fix(tui): prevent image ID collisions between modules

- allocateImageId() now returns random IDs instead of sequential
- Static images no longer auto-allocate IDs (transient display)
- Only explicit imageId usage (like DOSBox) gets tracked IDs
- Suppress emulators exit logging in DOSBox dispose

Fixes image replacement bug when extension and main app both
allocated sequential IDs starting at 1.

packages/coding-agent/examples/extensions/pi-dosbox/src/dosbox-component.ts

@@ -206,8 +206,23 @@ export class DosboxComponent implements Component {
 			this.kittyPushed = false;
 		}
 		if (this.ci) {
-			void this.ci.exit().catch(() => undefined);
+			// Suppress emulators exit logging
+			const origLog = console.log;
+			const origError = console.error;
+			console.log = () => {};
+			console.error = () => {};
+			const ci = this.ci;
 			this.ci = null;
+			void ci
+				.exit()
+				.catch(() => undefined)
+				.finally(() => {
+					// Restore after a delay to catch async logging
+					setTimeout(() => {
+						console.log = origLog;
+						console.error = origError;
+					}, 100);
+				});
 		}
 	}
 }

packages/tui/src/components/image.ts

@@ -1,5 +1,4 @@
 import {
-	deleteKittyImage,
 	getCapabilities,
 	getImageDimensions,
 	type ImageDimensions,
@@ -102,15 +101,4 @@ export class Image implements Component {
 
 		return lines;
 	}
-
-	/**
-	 * Delete the terminal image. Call this when done with the image
-	 * to free terminal resources.
-	 */
-	dispose(): void {
-		if (this.imageId !== undefined) {
-			process.stdout.write(deleteKittyImage(this.imageId));
-			this.imageId = undefined;
-		}
-	}
 }

packages/tui/src/terminal-image.ts

@@ -81,13 +81,14 @@ export function resetCapabilitiesCache(): void {
 	cachedCapabilities = null;
 }
 
-// Counter for generating unique image IDs
+/**
-let nextImageId = 1;
+ * Generate a random image ID for Kitty graphics protocol.
-
+ * Uses random IDs to avoid collisions between different module instances
+ * (e.g., main app vs extensions).
+ */
 export function allocateImageId(): number {
-	const id = nextImageId;
+	// Use random ID in range [1, 0xffffffff] to avoid collisions
-	nextImageId = (nextImageId % 0xffffffff) + 1; // Wrap around at max uint32
+	return Math.floor(Math.random() * 0xfffffffe) + 1;
-	return id;
 }
 
 export function encodeKitty(
@@ -342,9 +343,9 @@ export function renderImage(
 	const rows = calculateImageRows(imageDimensions, maxWidth, getCellDimensions());
 
 	if (caps.images === "kitty") {
-		const imageId = options.imageId ?? allocateImageId();
+		// Only use imageId if explicitly provided - static images don't need IDs
-		const sequence = encodeKitty(base64Data, { columns: maxWidth, rows, imageId });
+		const sequence = encodeKitty(base64Data, { columns: maxWidth, rows, imageId: options.imageId });
-		return { sequence, rows, imageId };
+		return { sequence, rows, imageId: options.imageId };
 	}
 
 	if (caps.images === "iterm2") {