@oh-my-pi/pi-tui 18.4.0 → 18.4.2

package/dist/types/theme/theme-class.d.ts

@@ -49,7 +49,7 @@ export declare class Theme {
      * Theme-derived inputs for `getSessionAccentHex`: the accent hex whose
      * OKLCH weight session accents adopt, the major colors they must not
      * hue-collide with, and the light-theme surface luminance to contrast
-     * against.
+     * against. Built once per instance and frozen; callers share the object.
      */
     get sessionAccentInputs(): SessionAccentTheme;
     fg(color: ThemeColor, text: string): string;

package/dist/types/tools/output-meta.d.ts

@@ -73,9 +73,10 @@ export interface LimitsMeta {
         reached: number;
         suggestion: number;
     };
+    /** `suggestion` is omitted when the tool is already at its hard cap, so no larger usable limit exists to advise. */
     resultLimit?: {
         reached: number;
-        suggestion: number;
+        suggestion?: number;
     };
     headLimit?: {
         reached: number;

package/dist/types/tools/vibe.d.ts

@@ -8,6 +8,8 @@ export interface VibeToolDetails {
     op: VibeOp;
     /** Live TV-wall snapshot of the owner's worker sessions at (or during) the call. */
     screens: VibeScreenSnapshot[];
+    /** Sessions the director killed, left off `screens`; shown as a count. */
+    hiddenKilled?: string[];
     spawned?: {
         id: string;
         cli: VibeCli;
@@ -38,6 +40,8 @@ export interface VibeScreenSnapshot {
     id: string;
     cli: VibeCli;
     state: VibeSessionState;
+    /** Terminated by the director (`vibe_kill`) or mode teardown; unset for workers that died on their own. */
+    killed?: boolean;
     model?: string;
     turns: number;
     queued: number;

package/dist/types/tui.d.ts

@@ -273,8 +273,9 @@ export declare class Container implements Component {
 /**
  * Merge runs of byte-adjacent SGR sequences (`CSI [0-9;:]* m`) into one. Only
  * CSI-SGR sequences are touched; text, cursor moves, OSC, hyperlinks and image
- * payloads pass through verbatim. Returns the original reference when nothing
- * merges, so SGR-light lines incur only a single `indexOf` scan.
+ * payloads pass through verbatim. Isolated sequences require no parameter
+ * slices or arrays; output is built only at merged boundaries or empty resets
+ * that need normalization within an adjacent run.
  */
 export declare function coalesceAdjacentSgr(line: string): string;
 /**

package/package.json

@@ -1,7 +1,7 @@
 {
 	"type": "module",
 	"name": "@oh-my-pi/pi-tui",
-	"version": "18.4.0",
+	"version": "18.4.2",
 	"description": "Terminal User Interface library with differential rendering for efficient text-based applications",
 	"homepage": "https://omp.sh",
 	"author": {
@@ -41,14 +41,14 @@
 		"gen:glyphs": "bun scripts/gen-glyphs.ts"
 	},
 	"dependencies": {
-		"@oh-my-pi/omptype": "18.4.0",
-		"@oh-my-pi/pi-agent-core": "18.4.0",
-		"@oh-my-pi/pi-ai": "18.4.0",
-		"@oh-my-pi/pi-catalog": "18.4.0",
-		"@oh-my-pi/pi-natives": "18.4.0",
-		"@oh-my-pi/pi-utils": "18.4.0",
-		"@oh-my-pi/pi-wire": "18.4.0",
-		"@oh-my-pi/snapcompact": "18.4.0"
+		"@oh-my-pi/omptype": "18.4.2",
+		"@oh-my-pi/pi-agent-core": "18.4.2",
+		"@oh-my-pi/pi-ai": "18.4.2",
+		"@oh-my-pi/pi-catalog": "18.4.2",
+		"@oh-my-pi/pi-natives": "18.4.2",
+		"@oh-my-pi/pi-utils": "18.4.2",
+		"@oh-my-pi/pi-wire": "18.4.2",
+		"@oh-my-pi/snapcompact": "18.4.2"
 	},
 	"devDependencies": {
 		"kitty-vt-wasm": "^0.2.0"

package/src/chat/assistant-message.ts

@@ -12,7 +12,7 @@ import type { AssistantThinkingRenderer } from "./extension-types";
 import { ensureThemeSync, getMarkdownTheme, theme } from "../theme";
 import { EMPTY_LINK_TARGETS, resolveImageOptions } from "../render/render-utils";
 import { WidthAwareText } from "../render";
-import { convertImageToPng } from "./image-loading";
+import { cachedPngConversion, convertImageToPngShared, imagePayloadKey } from "./image-loading";
 import { canonicalizeMessage, formatThinkingForDisplay, hasDisplayableThinking } from "./thinking-display";
 import { resolveAssistantErrorPresentation } from "./transcript-render-helpers";
 import { type CacheInvalidation, CacheInvalidationMarkerComponent } from "./cache-invalidation-marker";
@@ -186,10 +186,20 @@ export class AssistantMessageComponent extends Container {
 	#lastMessage?: AssistantMessage;
 	#emergencyText?: Markdown;
 	#toolImagesByCallId = new Map<string, ImageContent[]>();
-	#convertedKittyImages = new Map<string, ImageContent>();
+	/**
+	 * Payload keys ({@link imagePayloadKey}) whose Kitty PNG conversion this
+	 * component already awaits, so a re-delivered image neither re-encodes nor
+	 * schedules a second {@link updateContent} cascade. The conversions
+	 * themselves are shared process-wide by {@link convertImageToPngShared}.
+	 */
+	#kittyConversionsAwaited = new Set<string>();
+	/**
+	 * Conversions this component displays, held so a later re-render (theme
+	 * invalidation) still finds them after the bounded shared cache evicts them.
+	 */
+	#kittyConverted = new Map<string, ImageContent>();
 	#showImages = true;
 	#showToolResultImages = true;
-	#kittyConversionsInFlight = new Set<string>();
 	#transcriptBlockFinalized: boolean;
 	/** See {@link setMidStreamPublication}; the wire's `stream-revision` axis decides it. */
 	#midStreamPublication = true;
@@ -832,16 +842,6 @@ export class AssistantMessageComponent extends Container {
 	setToolResultImages(toolCallId: string, images: ImageContent[]): void {
 		if (!toolCallId) return;
 		const validImages = images.filter(img => img.type === "image" && img.data && img.mimeType);
-		for (const key of Array.from(this.#convertedKittyImages.keys())) {
-			if (key.startsWith(`${toolCallId}:`)) {
-				this.#convertedKittyImages.delete(key);
-			}
-		}
-		for (const key of Array.from(this.#kittyConversionsInFlight)) {
-			if (key.startsWith(`${toolCallId}:`)) {
-				this.#kittyConversionsInFlight.delete(key);
-			}
-		}
 		if (validImages.length === 0) {
 			this.#toolImagesByCallId.delete(toolCallId);
 		} else {
@@ -855,21 +855,27 @@ export class AssistantMessageComponent extends Container {
 
 	#convertImagesForKitty(entries: Array<{ image: ImageContent; key: string }>): void {
 		if (TERMINAL.imageProtocol !== ImageProtocol.Kitty) return;
-		for (const { image, key } of entries) {
+		for (const { image } of entries) {
 			if (image.mimeType === "image/png") continue;
-			if (this.#convertedKittyImages.has(key) || this.#kittyConversionsInFlight.has(key)) continue;
-			this.#kittyConversionsInFlight.add(key);
-			convertImageToPng(image)
+			const key = imagePayloadKey(image);
+			if (this.#kittyConverted.has(key)) continue;
+			const cached = cachedPngConversion(image);
+			if (cached) {
+				this.#kittyConverted.set(key, cached);
+				continue;
+			}
+			if (this.#kittyConversionsAwaited.has(key)) continue;
+			this.#kittyConversionsAwaited.add(key);
+			convertImageToPngShared(image)
 				.then(converted => {
-					this.#kittyConversionsInFlight.delete(key);
-					this.#convertedKittyImages.set(key, converted);
+					this.#kittyConverted.set(key, converted);
 					if (this.#lastMessage) {
 						this.updateContent(this.#lastMessage, { transient: this.#lastUpdateTransient });
 					}
 					this.#onImageUpdate?.();
 				})
 				.catch(() => {
-					this.#kittyConversionsInFlight.delete(key);
+					this.#kittyConversionsAwaited.delete(key);
 				});
 		}
 	}
@@ -882,7 +888,7 @@ export class AssistantMessageComponent extends Container {
 		for (const { image, key } of entries) {
 			const displayImage =
 				TERMINAL.imageProtocol === ImageProtocol.Kitty && image.mimeType !== "image/png"
-					? this.#convertedKittyImages.get(key)
+					? this.#kittyConverted.get(imagePayloadKey(image))
 					: image;
 			if (TERMINAL.imageProtocol && displayImage) {
 				this.#contentContainer.addChild(

package/src/chat/image-loading.ts

@@ -110,6 +110,87 @@ export async function convertImageToPng(image: ImageContent): Promise<ImageConte
 	return { ...image, data, mimeType: "image/png" };
 }
 
+/**
+ * Byte ceiling for {@link convertImageToPngShared}'s resident conversions.
+ * Converted PNGs are larger than the webp/jpeg they came from, so the cache is
+ * bounded and evicts least-recently-used entries rather than growing with the
+ * session's image history.
+ */
+const PNG_CACHE_MAX_BYTES = 32 * 1024 * 1024;
+
+/** Least-recently-used first; {@link touchPngCache} re-inserts on hit. */
+const pngCache = new Map<string, ImageContent>();
+let pngCacheBytes = 0;
+const pngConversionsInFlight = new Map<string, Promise<ImageContent>>();
+
+/** Cache lookup that also marks `key` as most recently used. */
+function touchPngCache(key: string): ImageContent | undefined {
+	const hit = pngCache.get(key);
+	if (!hit) return undefined;
+	pngCache.delete(key);
+	pngCache.set(key, hit);
+	return hit;
+}
+
+/**
+ * Content-addressed identity of an image payload, stable across components and
+ * transcript rebuilds. Callers key their own per-image state by this instead of
+ * positional ids like `${toolCallId}:${index}`, which go stale when the images
+ * behind a position are replaced.
+ */
+export function imagePayloadKey(image: ImageContent): string {
+	return `${image.mimeType}:${image.data.length}:${Bun.hash(image.data)}`;
+}
+
+/**
+ * The PNG conversion of `image` when one is still resident, else `undefined`.
+ * Synchronous so renderers can use an already-converted image on the spot
+ * instead of scheduling another async re-render.
+ */
+export function cachedPngConversion(image: ImageContent): ImageContent | undefined {
+	return touchPngCache(imagePayloadKey(image));
+}
+
+/**
+ * Converts `image` to PNG at most once per distinct payload: concurrent callers
+ * share one in-flight conversion and later callers hit {@link pngCache}.
+ * Kitty-graphics renderers use this because `convertImageToPng` is a full
+ * decode plus re-encode, and the same image is delivered repeatedly (read-result
+ * replay) and rebuilt from scratch on resume, rewind, and `/tree` navigation.
+ *
+ * Rejections are not cached — a payload that failed to decode is retried by the
+ * next caller, matching {@link convertImageToPng}'s contract.
+ */
+export function convertImageToPngShared(image: ImageContent): Promise<ImageContent> {
+	const key = imagePayloadKey(image);
+	const cached = touchPngCache(key);
+	if (cached) return Promise.resolve(cached);
+	const running = pngConversionsInFlight.get(key);
+	if (running) return running;
+	const conversion = convertImageToPng(image)
+		.then(({ data }) => {
+			pngConversionsInFlight.delete(key);
+			// Only the payload is shared; caller-specific fields (`url`,
+			// `providerFile`, `detail`) describe the source image, not this PNG.
+			const converted: ImageContent = { type: "image", data, mimeType: "image/png" };
+			pngCache.set(key, converted);
+			pngCacheBytes += data.length;
+			for (const [oldest, entry] of pngCache) {
+				if (pngCacheBytes <= PNG_CACHE_MAX_BYTES) break;
+				if (oldest === key) continue;
+				pngCache.delete(oldest);
+				pngCacheBytes -= entry.data.length;
+			}
+			return converted;
+		})
+		.catch(error => {
+			pngConversionsInFlight.delete(key);
+			throw error;
+		});
+	pngConversionsInFlight.set(key, conversion);
+	return conversion;
+}
+
 export async function ensureSupportedImageInput(image: ImageContent): Promise<ImageContent | null> {
 	if (SUPPORTED_INPUT_IMAGE_MIME_TYPES.has(image.mimeType)) {
 		return image;

package/src/chat/tool-execution.ts

@@ -1,3 +1,4 @@
+import type { ImageContent } from "@oh-my-pi/pi-ai";
 import type { AgentTool } from "@oh-my-pi/pi-agent-core";
 import { Box } from "../components/box";
 import { SPINNER_ADVANCE_MS } from "../components/loader";
@@ -26,7 +27,7 @@ import { isWaitingPollDetails } from "../tools/wait";
 import { formatStatusIcon, replaceTabs, resolveImageOptions } from "../render/render-utils";
 import type { XdevMountedState } from "../tools/xdev";
 import { isFramedBlockComponent, markFramedBlockComponent, renderStatusLine, WidthAwareText } from "../render/index";
-import { convertImageToPng } from "./image-loading";
+import { cachedPngConversion, convertImageToPngShared, imagePayloadKey } from "./image-loading";
 import { sanitizeWithOptionalSixelPassthrough } from "../render/sixel";
 import { renderDiff } from "../chrome/diff";
 import { type AnimationFrame, trimBlankEdges } from "../chrome/transcript-container";
@@ -284,6 +285,14 @@ export class ToolExecutionComponent extends Container {
 	// so a terminal resize re-shapes image-bearing results to rescale them without
 	// forcing the common image-free result to re-shape on every resize tick.
 	#renderedImageCount = 0;
+	// `stateBgKey|themeEpoch` of the tint last handed to #contentText. Re-tinting
+	// drops its wrap cache, so a rebuild whose tint is unchanged skips it and the
+	// inner Text re-wraps only when the reformatted card text actually differs.
+	#contentTextBgKey: string | undefined;
+	// Memoized #getTextOutput(), keyed by every input it reads: the result
+	// (versioned by #resultVersion), #showImages, and the image protocol.
+	#textOutput = "";
+	#textOutputKey: string | undefined;
 	#tool?: AgentTool;
 	#renderer?: ToolRenderer;
 	#ui: ToolExecutionUi;
@@ -296,8 +305,13 @@ export class ToolExecutionComponent extends Container {
 	#editMode?: EditMode;
 	#editDiffPreview?: PerFileDiffPreview[];
 	#previewReady?: PromiseWithResolvers<void>;
-	// Cached converted images for Kitty protocol (which requires PNG), keyed by index
-	#convertedImages: Map<number, { data: string; mimeType: string }> = new Map();
+	// Payload keys whose Kitty PNG conversion is already awaited; the converted
+	// images themselves live in the process-wide cache behind
+	// `convertImageToPngShared`, so rebuilt components reuse them.
+	#kittyConversionsAwaited = new Set<string>();
+	// Conversions this component displays, held so a later re-render still finds
+	// them after the bounded shared cache evicts them.
+	#kittyConverted = new Map<string, ImageContent>();
 	// Spinner animation for partial task results
 	#spinnerFrame?: number;
 	#spinnerActive = false;
@@ -545,26 +559,32 @@ export class ToolExecutionComponent extends Container {
 		if (TERMINAL.imageProtocol !== ImageProtocol.Kitty) return;
 		if (!this.#result) return;
 
-		const imageBlocks = this.#getAllImageBlocks();
-
-		for (let i = 0; i < imageBlocks.length; i++) {
-			const img = imageBlocks[i];
+		for (const img of this.#getAllImageBlocks()) {
 			if (!img.data || !img.mimeType) continue;
-			// Skip if already PNG or already converted
+			// Skip if already PNG or already converted anywhere in this process
 			if (img.mimeType === "image/png") continue;
-			if (this.#convertedImages.has(i)) continue;
+			const image: ImageContent = { type: "image", data: img.data, mimeType: img.mimeType };
+			const key = imagePayloadKey(image);
+			if (this.#kittyConverted.has(key)) continue;
+			const cached = cachedPngConversion(image);
+			if (cached) {
+				this.#kittyConverted.set(key, cached);
+				continue;
+			}
+			if (this.#kittyConversionsAwaited.has(key)) continue;
+			this.#kittyConversionsAwaited.add(key);
 
 			// Convert async - catch errors from processing
-			const index = i;
-			convertImageToPng({ type: "image", data: img.data, mimeType: img.mimeType })
+			convertImageToPngShared(image)
 				.then(converted => {
-					this.#convertedImages.set(index, converted);
+					this.#kittyConverted.set(key, converted);
 					this.#displayInputVersion++;
 					this.#updateDisplay();
 					this.#ui.requestRender();
 				})
 				.catch(() => {
 					// Ignore conversion failures - display will use original image format
+					this.#kittyConversionsAwaited.delete(key);
 				});
 		}
 	}
@@ -1188,8 +1208,7 @@ export class ToolExecutionComponent extends Container {
 			// Generic fallback (no custom/built-in renderer). WidthAwareText
 			// reformats at render time so output fills the actual terminal width
 			// instead of a fixed column cap.
-			this.#contentText.setCustomBgFn(stateBgFn);
-			this.#contentText.invalidate();
+			this.#refreshContentText(stateBgKey, stateBgFn);
 		}
 
 		// Handle images (same for both custom and built-in)
@@ -1209,7 +1228,11 @@ export class ToolExecutionComponent extends Container {
 				const img = imageBlocks[i];
 				if (TERMINAL.imageProtocol && this.#showImages && img.data && img.mimeType) {
 					// Use converted PNG for Kitty protocol if available
-					const converted = this.#convertedImages.get(i);
+					const source: ImageContent = { type: "image", data: img.data, mimeType: img.mimeType };
+					const converted =
+						TERMINAL.imageProtocol === ImageProtocol.Kitty && img.mimeType !== "image/png"
+							? (this.#kittyConverted.get(imagePayloadKey(source)) ?? cachedPngConversion(source))
+							: undefined;
 					const imageData = converted?.data ?? img.data;
 					const imageMimeType = converted?.mimeType ?? img.mimeType;
 
@@ -1323,6 +1346,8 @@ export class ToolExecutionComponent extends Container {
 
 	#getTextOutput(): string {
 		if (!this.#result) return "";
+		const key = `${this.#resultVersion}|${this.#showImages}|${TERMINAL.imageProtocol ?? "-"}`;
+		if (key === this.#textOutputKey) return this.#textOutput;
 
 		const textBlocks = this.#result.content.filter(c => c.type === "text");
 		const imageBlocks = this.#getAllImageBlocks();
@@ -1344,9 +1369,21 @@ export class ToolExecutionComponent extends Container {
 			output = output ? `${output}\n${imageIndicators}` : imageIndicators;
 		}
 
+		this.#textOutputKey = key;
+		this.#textOutput = output;
 		return output;
 	}
 
+	/** Re-tint (only when the tint changed) and reformat the generic #contentText card. */
+	#refreshContentText(stateBgKey: string, stateBgFn: (text: string) => string): void {
+		const bgKey = `${stateBgKey}|${getThemeEpoch()}`;
+		if (bgKey !== this.#contentTextBgKey) {
+			this.#contentTextBgKey = bgKey;
+			this.#contentText.setCustomBgFn(stateBgFn);
+		}
+		this.#contentText.reformat();
+	}
+
 	/**
 	 * Format the generic call/result card at `contentWidth`. Shared by the
 	 * #contentText fallback and the benign-skip path so both render identically.
@@ -1390,8 +1427,7 @@ export class ToolExecutionComponent extends Container {
 	 */
 	#renderBenignSkipCard(stateBgFn: (text: string) => string): void {
 		if (!this.#usesContentBox) {
-			this.#contentText.setCustomBgFn(stateBgFn);
-			this.#contentText.invalidate();
+			this.#refreshContentText("toolPendingBg", stateBgFn);
 			return;
 		}
 		for (const box of this.#multiFileBoxes) {

package/src/chat/transcript-entry.ts

@@ -68,6 +68,22 @@ export function isUserRequestEntry(entry: TranscriptEntryLike | { type: string }
 	return false;
 }
 
+/**
+ * Recent transcript tail starting at a user-request boundary, so tool calls
+ * and results stay together. ChatTranscriptBuilder drops a tool result whose
+ * initiating call was sliced away, so a tail of orphaned results can leave
+ * the picker without any target.
+ *
+ * A whole user turn may exceed `limit`; paginate rendering if one turn grows too large.
+ */
+export function recentTranscriptEntries(entries: TranscriptEntryLike[], limit = 600): TranscriptEntryLike[] {
+	if (entries.length <= limit) return entries;
+	for (let index = entries.length - limit; index > 0; index--) {
+		if (isUserRequestEntry(entries[index]!)) return entries.slice(index);
+	}
+	return entries;
+}
+
 /** Editable user request text, preserving skill invocation syntax. */
 export function userTurnDraft(entry: TranscriptEntryLike): string | undefined {
 	const message = transcriptEntryMessage(entry);