@linxiraos/pi-tui 1.1.26 → 1.2.0

package/src/chat/advisor-message.ts

@@ -52,6 +52,10 @@ class AdvisorHeader implements Component {
 		this.#uiTheme = uiTheme;
 	}
 
+	releaseRenderCaches(): void {
+		this.#cache = undefined;
+	}
+
 	invalidate(): void {
 		this.#cache = undefined;
 	}
@@ -82,6 +86,10 @@ class AdvisorNotes implements Component {
 		this.#uiTheme = uiTheme;
 	}
 
+	releaseRenderCaches(): void {
+		this.#cache = undefined;
+	}
+
 	invalidate(): void {
 		this.#cache = undefined;
 	}
@@ -236,6 +244,9 @@ export function createAdvisorMessageCard(
 		invalidate(): void {
 			disclosure.invalidate();
 		},
+		releaseRenderCaches(): void {
+			disclosure.releaseRenderCaches();
+		},
 		dispose(): void {
 			disclosure.dispose();
 		},

package/src/chat/assistant-message.d.ts

@@ -38,7 +38,7 @@ export declare class AssistantMessageComponent extends Container {
      * for lack of a target is re-rendered with its reaction stripped.
      */
     pickReactionTarget(transcript: readonly Component[]): void;
-    constructor(message?: AssistantMessage, hideThinkingBlock?: boolean, onImageUpdate?: () => void, thinkingRenderers?: readonly AssistantThinkingRenderer[], imageBudget?: ImageBudget, proseOnlyThinking?: boolean, linkTargets?: ReadonlyMap<string, string>);
+    constructor(message?: AssistantMessage, hideThinkingBlock?: boolean, onImageUpdate?: () => void, thinkingRenderers?: readonly AssistantThinkingRenderer[], imageBudget?: ImageBudget, proseOnlyThinking?: boolean, linkTargets?: ReadonlyMap<string, string>, expandThinkingBlocks?: boolean);
     /**
      * Show or clear the trailing cache-invalidation divider. Set at `message_end`
      * (live) or during rebuild, once the turn's usage is known and compared
@@ -54,6 +54,7 @@ export declare class AssistantMessageComponent extends Container {
      */
     setServedModelMismatch(info: ServedModelMismatch | undefined): void;
     invalidate(): void;
+    releaseRenderCaches(): void;
     setHideThinkingBlock(hide: boolean): void;
     /**
      * Allow or withhold retiring finished lines into native scrollback while the
@@ -65,6 +66,11 @@ export declare class AssistantMessageComponent extends Container {
      */
     setMidStreamPublication(allowed: boolean): void;
     setProseOnlyThinking(proseOnly: boolean): void;
+    /**
+     * Keep finished thinking sections expanded instead of folding them to "Thought for 12s".
+     * Sections the user folded or unfolded by hand keep that choice.
+     */
+    setExpandThinkingBlocks(expand: boolean): void;
     dispose(): void;
     /**
      * Toggle suppression of the inline `Error: …` line while the same error is
@@ -81,6 +87,8 @@ export declare class AssistantMessageComponent extends Container {
      */
     setExpanded(expanded: boolean): void;
     isTranscriptBlockFinalized(): boolean;
+    /** Whether a figure still waits for the raster of its final source; the transcript holds retirement meanwhile. */
+    isTranscriptBlockPending(): boolean;
     render(width: number): readonly string[];
     /**
      * A `col` (role `zeta.assistant`) of `md` nodes keyed by content index, so
@@ -118,6 +126,8 @@ export declare class AssistantMessageComponent extends Container {
     messagePersistenceKey(): string | undefined;
     /** Toggle rendering for assistant-native and tool-result images. */
     setImagesVisible(visible: boolean): void;
+    /** Toggle charts under numeric tables (the main session's transcript only, never a subagent's). */
+    setTableChartsVisible(visible: boolean): void;
     /** Toggle only images produced by tool results; assistant-native images remain governed by setImagesVisible. */
     setToolResultImagesVisible(visible: boolean): void;
     setToolResultImages(toolCallId: string, images: ImageContent[]): void;

package/src/chat/assistant-message.ts

@@ -2,14 +2,19 @@ import type { AssistantMessage, ImageContent, TextContent } from "@linxiraos/pi-
 import { type Component, Container } from "../tui";
 import { Image, type ImageBudget } from "../components/image";
 import { ImageProtocol, TERMINAL } from "../terminal-capabilities";
-import { Markdown, type MarkdownTheme } from "../components/markdown";
+import {
+	type DefaultTextStyle,
+	Markdown,
+	type MarkdownTheme,
+	rewriteMarkdownLinkDestinations,
+} from "../components/markdown";
 import { Spacer } from "../components/spacer";
 import { Text } from "../components/text";
 import { formatDuration, formatNumber } from "@linxiraos/pi-utils";
 import chalk from "@linxiraos/pi-utils/chalk";
 import { LRUCache } from "@linxiraos/pi-utils/lru";
 import type { AssistantThinkingRenderer } from "./extension-types";
-import { ensureThemeSync, getMarkdownTheme, getThemeEpoch, theme } from "../theme";
+import { ensureThemeSync, getMarkdownTheme, getMarkdownThemeWithLinkTargets, getThemeEpoch, theme } from "../theme";
 import { card, col, elapsed, node, span, text } from "../native/describe";
 import { hasTranscriptActions, runTranscriptAction } from "./transcript-actions";
 import type { NativeChild, NativeNode, NativeUiEvent } from "../native/node";
@@ -27,6 +32,10 @@ import { type ServedModelMismatch, ServedModelMarkerComponent } from "./served-m
 import { isReactionTarget, type ReactionSplit, type ReactionTarget, splitReaction } from "./reaction";
 import { isRowPrefix, type TranscriptStableRow, trimBlankEdges } from "../chrome/transcript-container";
 import { formatTurnUsage, type TurnUsageSummary } from "../overlays/usage-row";
+import { FigureMarkdown } from "./figure-markdown";
+import { svgFigureRendering } from "./svg-figure";
+import { hasSvgFence } from "./svg-source";
+import { describeTableChart, hasChartTable, lookupTableChart, splitTableCharts } from "./table-chart";
 
 /**
  * Max wrapped rows of a turn-ending provider error rendered inline in the
@@ -46,6 +55,15 @@ function thoughtLabel(clock: { start: number; end?: number } | undefined): strin
 }
 
 type ThinkingContentBlock = Extract<AssistantMessage["content"][number], { type: "thinking" }>;
+/** Renders one text or thinking block: Markdown, or {@link FigureMarkdown} for text holding a ```svg fence. */
+type ProseBlock = Markdown | FigureMarkdown;
+/** A streamed block the fast path updates in place. */
+interface FastPathItem {
+	md: ProseBlock;
+	contentIndex: number;
+	blockType: "text" | "thinking";
+	lastText: string;
+}
 type DisplayThinkingContentBlock = ThinkingContentBlock & { rawThinking?: string };
 type StablePartKind = "thinking" | "text";
 type StablePart = { kind: StablePartKind; text: string } | { kind: "spacer" };
@@ -230,22 +248,30 @@ export class AssistantMessageComponent extends Container {
 	#cacheMarker?: CacheInvalidationMarkerComponent;
 	#servedModelMarker?: ServedModelMarkerComponent;
 	#lastMessage?: AssistantMessage;
-	#emergencyText?: Markdown;
+	#emergencyText?: ProseBlock;
 	#toolImagesByCallId = 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
+	 * component is awaiting, 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}.
+	 * themselves live in the bounded process-wide cache behind
+	 * {@link convertImageToPngShared}; an evicted one is redone on the next
+	 * render instead of being pinned here for the session.
 	 */
 	#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.
+	 * Conversions the current image children display, by payload key. Rebuilt
+	 * on every full render pass ({@link updateContent}), so a conversion is held
+	 * only while it is on screen — a re-render after the shared cache evicted
+	 * it still finds it — and released once hidden or replaced.
 	 */
-	#kittyConverted = new Map<string, ImageContent>();
+	#kittyDisplayed = new Map<string, ImageContent>();
+	/** The previous pass's {@link #kittyDisplayed}, readable only during a render pass. */
+	#kittyPreviouslyDisplayed: Map<string, ImageContent> | undefined;
 	#showImages = true;
 	#showToolResultImages = true;
+	/** Charts under numeric tables; off for subagent transcripts. */
+	#showTableCharts = true;
 	#transcriptBlockFinalized: boolean;
 	/** See {@link setMidStreamPublication}; the wire's `stream-revision` axis decides it. */
 	#midStreamPublication = true;
@@ -293,9 +319,13 @@ export class AssistantMessageComponent extends Container {
 	#lastUpdateTransient = false;
 	// Fast-path state: reuse Markdown children when message shape is stable during streaming.
 	#fastPathKey: string | undefined;
-	#fastPathItems:
-		| Array<{ md: Markdown; contentIndex: number; blockType: "text" | "thinking"; lastText: string }>
-		| undefined;
+	#fastPathItems: FastPathItem[] | undefined;
+	/**
+	 * Text blocks whose ```svg fences are lifted into figures, by content index.
+	 * Kept across slow-path rebuilds so a figure keeps its raster (and its
+	 * in-flight one) instead of starting over on every update.
+	 */
+	#figureBlocks = new Map<number, FigureMarkdown>();
 	/** Live "thinking" pulse shown in place of a hidden thinking block while it
 	 *  streams; undefined when not animating. Driven by {@link #thinkingDotsTimer}. */
 	#thinkingDots: Text | undefined;
@@ -339,6 +369,8 @@ export class AssistantMessageComponent extends Container {
 	#textColorTransform?: (text: string) => string;
 	#linkTargets: ReadonlyMap<string, string> = EMPTY_LINK_TARGETS;
 	#markdownTheme: MarkdownTheme | undefined;
+	/** Text-block sources with {@link #linkTargets} applied, for the native `md` nodes; reset with the targets. */
+	#nativeLinkSources = new Map<string, string>();
 	/** Block this reply reacts to; undefined when the preceding block takes no reactions. */
 	#reactionTarget: ReactionTarget | undefined;
 	/** Reaction lifted from the reply's opening emoji, once resolved. */
@@ -356,16 +388,38 @@ export class AssistantMessageComponent extends Container {
 	/** Markdown nodes by key, reused while their text and streaming flag are unchanged. */
 	#nativeParts = new Map<string, { text: string; stream: boolean; node: NativeNode }>();
 	readonly #nativeImages = new NativeImageCache();
+	/** Smart table chart picks a TSP describe is waiting on. */
+	readonly #chartPicks = new Set<Promise<void>>();
 
 	setTextColorTransform(transform?: (text: string) => string): void {
 		this.#textColorTransform = transform;
 	}
 
+	/**
+	 * Default text style for assistant paragraph Markdown. An explicitly
+	 * installed transform (live-command output) always wins and keeps its
+	 * historical paint-everything contract; otherwise the optional
+	 * `assistantMessageText` theme token paints prose, flagged `proseFg` so
+	 * markdown sub-elements keep their own `md*` tokens (docs/theme.md).
+	 * Returns undefined when the token is unset or empty so the terminal
+	 * default foreground is used byte-for-byte, exactly as before the token
+	 * existed.
+	 *
+	 * The token is re-derived on every rebuild (the theme-change path calls
+	 * `invalidate()` and rebuilds through the teardown path, which re-consults
+	 * the active theme), so prose follows theme switches both ways.
+	 */
+	#getProseTextStyle(): DefaultTextStyle | undefined {
+		if (this.#textColorTransform) return { color: this.#textColorTransform };
+		if (typeof theme === "undefined" || !theme.hasColor("assistantMessageText")) return undefined;
+		return { color: (text: string) => theme.fg("assistantMessageText", text), proseFg: true };
+	}
+
 	#getProseTheme(): MarkdownTheme {
 		if (this.#markdownTheme) return this.#markdownTheme;
 		const base = getMarkdownTheme();
 		const snapshot = this.#linkTargets;
-		const markdownTheme = snapshot.size > 0 ? { ...base, resolveLink: (href: string) => snapshot.get(href) } : base;
+		const markdownTheme = snapshot.size > 0 ? getMarkdownThemeWithLinkTargets(snapshot) : base;
 		this.#markdownTheme = markdownTheme;
 		return markdownTheme;
 	}
@@ -387,6 +441,9 @@ export class AssistantMessageComponent extends Container {
 		this.#markdownTheme = undefined;
 		this.#fastPathKey = undefined;
 		this.#fastPathItems = undefined;
+		for (const block of this.#figureBlocks.values()) block.restyle();
+		this.#nativeLinkSources.clear();
+		this.#nativeViewVersion++;
 		if (this.#lastMessage) {
 			this.updateContent(this.#lastMessage, { transient: this.#lastUpdateTransient });
 		}
@@ -456,6 +513,7 @@ export class AssistantMessageComponent extends Container {
 	readonly #thinkingRenderers: readonly AssistantThinkingRenderer[];
 	readonly #imageBudget?: ImageBudget;
 	#proseOnlyThinking: boolean;
+	#expandThinkingBlocks: boolean;
 
 	constructor(
 		message?: AssistantMessage,
@@ -465,6 +523,7 @@ export class AssistantMessageComponent extends Container {
 		imageBudget?: ImageBudget,
 		proseOnlyThinking = true,
 		linkTargets?: ReadonlyMap<string, string>,
+		expandThinkingBlocks = false,
 	) {
 		super();
 		this.#hideThinkingBlock = hideThinkingBlock;
@@ -472,6 +531,7 @@ export class AssistantMessageComponent extends Container {
 		this.#thinkingRenderers = thinkingRenderers;
 		this.#imageBudget = imageBudget;
 		this.#proseOnlyThinking = proseOnlyThinking;
+		this.#expandThinkingBlocks = expandThinkingBlocks;
 
 		ensureThemeSync();
 		this.#transcriptBlockFinalized = message !== undefined;
@@ -534,11 +594,18 @@ export class AssistantMessageComponent extends Container {
 		this.#markdownTheme = undefined;
 		this.#fastPathKey = undefined;
 		this.#fastPathItems = undefined;
+		for (const block of this.#figureBlocks.values()) block.restyle();
 		if (this.#lastMessage) {
 			this.updateContent(this.#lastMessage, { transient: this.#lastUpdateTransient });
 		}
 	}
 
+	override releaseRenderCaches(): void {
+		super.releaseRenderCaches();
+		this.#dropStableRenders();
+		this.#emergencyText?.releaseRenderCaches();
+	}
+
 	setHideThinkingBlock(hide: boolean): void {
 		this.#hideThinkingBlock = hide;
 		this.#thinkingCollapsed.clear();
@@ -560,6 +627,16 @@ export class AssistantMessageComponent extends Container {
 		this.#proseOnlyThinking = proseOnly;
 	}
 
+	/**
+	 * Keep finished thinking sections expanded instead of folding them to "Thought for 12s".
+	 * Sections the user folded or unfolded by hand keep that choice.
+	 */
+	setExpandThinkingBlocks(expand: boolean): void {
+		if (this.#expandThinkingBlocks === expand) return;
+		this.#expandThinkingBlocks = expand;
+		this.#nativeViewVersion++;
+	}
+
 	override dispose(): void {
 		this.#stopThinkingAnimation();
 		super.dispose();
@@ -700,6 +777,12 @@ export class AssistantMessageComponent extends Container {
 		return this.#transcriptBlockFinalized;
 	}
 
+	/** Whether a figure still waits for the raster of its final source; the transcript holds retirement meanwhile. */
+	isTranscriptBlockPending(): boolean {
+		for (const block of this.#figureBlocks.values()) if (block.pending) return true;
+		return false;
+	}
+
 	override render(width: number): readonly string[] {
 		const rows = super.render(width);
 		this.#publishStableSnapshot(rows, width);
@@ -793,7 +876,36 @@ export class AssistantMessageComponent extends Container {
 				const content = message.content[index]!;
 				const streaming = live && index === tailIndex;
 				if (content.type === "text" && canonicalizeMessage(content.text)) {
-					children.push(markdown(`t${index}`, `t${index}`, content.text.trim(), streaming));
+					const source = content.text.trim();
+					// The terminal renders this source itself and would resolve a relative
+					// link against its own idea of the cwd: hand it the session-resolved
+					// targets (resolved once the segment closes, so never while streaming).
+					const linked = (text: string, live: boolean): string => {
+						if (live || this.#linkTargets.size === 0) return text;
+						const targets = this.#linkTargets;
+						const resolved =
+							this.#nativeLinkSources.get(text) ??
+							rewriteMarkdownLinkDestinations(text, href => targets.get(href));
+						this.#nativeLinkSources.set(text, resolved);
+						return resolved;
+					};
+					if (!this.#showImages || !this.#showTableCharts || !hasChartTable(source)) {
+						children.push(markdown(`t${index}`, `t${index}`, linked(source, streaming), streaming));
+						continue;
+					}
+					// A chart follows its table as an SVG image node; the prose splits around it.
+					const segments = splitTableCharts(source, streaming);
+					segments.forEach((segment, part) => {
+						const slot = part === 0 ? `t${index}` : `t${index}.${part}`;
+						if (segment.kind === "markdown") {
+							const live = streaming && part === segments.length - 1;
+							children.push(markdown(slot, slot, linked(segment.text.trim(), live), live));
+							return;
+						}
+						const chart = lookupTableChart(segment.table);
+						if (chart instanceof Promise) this.#awaitChart(chart);
+						else if (chart) children.push(describeTableChart(chart, slot));
+					});
 				} else if (content.type === "thinking") {
 					const display = resolveThinkingDisplay(content, this.#proseOnlyThinking);
 					if (!display.visible) continue;
@@ -831,8 +943,10 @@ export class AssistantMessageComponent extends Container {
 								// `.live` while streaming: the body clamps to its tail under a fade.
 								role: thinkingLive ? "zeta.thinking.live" : "zeta.thinking",
 								collapsible: true,
-								// Open while it streams; a finished thought folds to its "Thought for 12s" line.
-								collapsed: this.#thinkingCollapsed.get(index) ?? (this.#hideThinkingBlock || !thinkingLive),
+								// Open while it streams; a finished thought folds to its "Thought for 12s" line unless the user keeps thinking expanded.
+								collapsed:
+									this.#thinkingCollapsed.get(index) ??
+									(this.#hideThinkingBlock || (!thinkingLive && !this.#expandThinkingBlocks)),
 								// Tern's fold head sums it into "Worked for 12s".
 								took: clock?.end === undefined ? undefined : Math.max(0, Math.round(clock.end - clock.start)),
 							},
@@ -1074,12 +1188,18 @@ export class AssistantMessageComponent extends Container {
 		for (const child of this.#contentContainer.children) {
 			const item = items[itemIndex];
 			if (item?.md === child) {
+				const md = item.md;
+				if (md instanceof FigureMarkdown) {
+					// Plain Markdown reproduces only the prose ahead of the first figure.
+					if (md.leadingProse) parts.push({ kind: item.blockType, text: md.leadingProse });
+					break;
+				}
 				if (itemIndex === items.length - 1) {
 					// Streaming child: publish Markdown's frozen prefix, and only
 					// once non-blank content exists past it — the block's last
 					// non-blank line is still being written (thinking's prose fold
 					// may rewrite it) and must stay out of published bytes.
-					const raw = item.md.getLastRenderStableText();
+					const raw = md.getLastRenderStableText();
 					const frozen = raw.trim();
 					if (frozen.length > 0 && /\S/.test(item.lastText.slice(raw.length))) {
 						parts.push({ kind: item.blockType, text: frozen });
@@ -1107,7 +1227,7 @@ export class AssistantMessageComponent extends Container {
 	/**
 	 * Render the first `partCount` stable parts, the final one cut to
 	 * `lastLength`. Rows match fresh Markdown renders of each part byte for
-	 * byte — {@link #createStableMarkdown} mirrors the live children — but a
+	 * byte — {@link #createMarkdown} builds the live children too — but a
 	 * closed part renders once per width, and the growing final part reuses one
 	 * Markdown instance so its already-frozen blocks are not re-lexed.
 	 */
@@ -1157,7 +1277,7 @@ export class AssistantMessageComponent extends Container {
 		// Trim like the live children, dropping the trailing blank line a frozen
 		// prefix still carries.
 		const trimmed = text.trim();
-		if (this.#transcriptBlockFinalized) return this.#createStableMarkdown(kind, trimmed).render(width);
+		if (this.#transcriptBlockFinalized) return this.#createMarkdown(kind, trimmed).render(width);
 		const head = this.#stableHeadRenderer;
 		const replay = this.#stableReplayRenderer;
 		const renderer = role === "head" ? head : role === "replay" ? replay : head?.index === index ? head : replay;
@@ -1165,29 +1285,74 @@ export class AssistantMessageComponent extends Container {
 			renderer.md.setText(trimmed);
 			return renderer.md.render(width);
 		}
-		const md = this.#createStableMarkdown(kind, trimmed);
+		const md = this.#createMarkdown(kind, trimmed);
 		if (role === "head") this.#stableHeadRenderer = { index, kind, md };
 		else if (role === "replay") this.#stableReplayRenderer = { index, kind, md };
 		return md.render(width);
 	}
 
-	/** Constructor args mirror the live child Markdown so stable rows prefix the block render. */
-	#createStableMarkdown(kind: StablePartKind, text: string): Markdown {
+	/** Markdown for a text or thinking block; live children and stable-row renders share it so stable rows prefix the block render. */
+	#createMarkdown(kind: StablePartKind, text: string): Markdown {
 		return kind === "text"
-			? new Markdown(
-					text,
-					1,
-					0,
-					this.#getProseTheme(),
-					this.#textColorTransform ? { color: this.#textColorTransform } : undefined,
-					0,
-				)
+			? new Markdown(text, 1, 0, this.#getProseTheme(), this.#getProseTextStyle(), 0)
 			: new Markdown(text, 1, 0, getMarkdownTheme(), {
 					color: (value: string) => theme.fg("thinkingText", value),
 					italic: true,
 				});
 	}
 
+	/**
+	 * Whether `text` holds a ```svg fence this terminal draws as a figure, or a
+	 * table it draws a chart under. Native (TSP) terminals receive the fence
+	 * verbatim in the `md` node and draw it themselves, and get charts as image
+	 * nodes from {@link describe}; image-less terminals keep fences as code and
+	 * tables as tables.
+	 */
+	#liftsFigures(text: string): boolean {
+		return (
+			this.#showImages &&
+			TERMINAL.imageProtocol !== null &&
+			!isNativeRendering() &&
+			((svgFigureRendering() && hasSvgFence(text)) || (this.#showTableCharts && hasChartTable(text)))
+		);
+	}
+
+	/** Re-describe once a smart table chart pick lands. */
+	#awaitChart(pick: Promise<void>): void {
+		if (this.#chartPicks.has(pick)) return;
+		this.#chartPicks.add(pick);
+		void pick.then(() => {
+			this.#chartPicks.delete(pick);
+			this.#blockVersion++;
+			this.#onImageUpdate?.();
+		});
+	}
+
+	/**
+	 * The component for text block `index`: Markdown, or a {@link FigureMarkdown}
+	 * when it holds a ```svg fence to lift or a table to chart — taken over from
+	 * `previous` so its figures keep their rasters across rebuilds.
+	 */
+	#proseBlock(index: number, text: string, previous: ReadonlyMap<number, FigureMarkdown>): ProseBlock {
+		if (!this.#liftsFigures(text)) return this.#createMarkdown("text", text);
+		let block = previous.get(index);
+		if (block) {
+			block.setText(text);
+		} else {
+			block = new FigureMarkdown(text, {
+				markdown: value => this.#createMarkdown("text", value),
+				charts: this.#showTableCharts,
+				budget: this.#imageBudget,
+				onChange: () => {
+					this.#blockVersion++;
+					this.#onImageUpdate?.();
+				},
+			});
+		}
+		this.#figureBlocks.set(index, block);
+		return block;
+	}
+
 	#stableLedger(width: number): StableRowLedger {
 		let ledger = this.#stableLedgers.get(width);
 		if (ledger === undefined) {
@@ -1307,6 +1472,18 @@ export class AssistantMessageComponent extends Container {
 		}
 	}
 
+	/** Toggle charts under numeric tables (the main session's transcript only, never a subagent's). */
+	setTableChartsVisible(visible: boolean): void {
+		if (this.#showTableCharts === visible) return;
+		this.#showTableCharts = visible;
+		// Figure blocks bake the switch in; rebuild them rather than reuse.
+		for (const block of this.#figureBlocks.values()) block.dispose();
+		this.#figureBlocks.clear();
+		if (this.#lastMessage) {
+			this.updateContent(this.#lastMessage, { transient: this.#lastUpdateTransient });
+		}
+	}
+
 	/** Toggle only images produced by tool results; assistant-native images remain governed by setImagesVisible. */
 	setToolResultImagesVisible(visible: boolean): void {
 		if (this.#showToolResultImages === visible) return;
@@ -1330,22 +1507,24 @@ export class AssistantMessageComponent extends Container {
 		}
 	}
 
+	/** A displayable Kitty PNG for a non-PNG `image`: the shared cache, else this component's displayed copy. */
+	#kittyConversion(image: ImageContent): ImageContent | undefined {
+		const cached = cachedPngConversion(image);
+		if (cached) return cached;
+		const key = imagePayloadKey(image);
+		return this.#kittyDisplayed.get(key) ?? this.#kittyPreviouslyDisplayed?.get(key);
+	}
+
 	#convertImagesForKitty(entries: Array<{ image: ImageContent; key: string }>): void {
 		if (TERMINAL.imageProtocol !== ImageProtocol.Kitty) return;
 		for (const { image } of entries) {
-			if (image.mimeType === "image/png") continue;
+			if (image.mimeType === "image/png" || this.#kittyConversion(image)) continue;
 			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.#kittyConverted.set(key, converted);
+				.then(() => {
+					this.#kittyConversionsAwaited.delete(key);
 					if (this.#lastMessage) {
 						this.updateContent(this.#lastMessage, { transient: this.#lastUpdateTransient });
 					}
@@ -1363,17 +1542,23 @@ export class AssistantMessageComponent extends Container {
 
 		if (withLeadingSpacer) this.#contentContainer.addChild(new Spacer(1));
 		for (const { image, key } of entries) {
-			const displayImage =
-				TERMINAL.imageProtocol === ImageProtocol.Kitty && image.mimeType !== "image/png"
-					? this.#kittyConverted.get(imagePayloadKey(image))
-					: image;
+			let displayImage: ImageContent | undefined = image;
+			if (TERMINAL.imageProtocol === ImageProtocol.Kitty && image.mimeType !== "image/png") {
+				displayImage = this.#kittyConversion(image);
+				if (displayImage) this.#kittyDisplayed.set(imagePayloadKey(image), displayImage);
+			}
 			if (TERMINAL.imageProtocol && displayImage) {
 				this.#contentContainer.addChild(
 					new Image(
 						displayImage.data,
 						displayImage.mimeType,
 						{ fallbackColor: (text: string) => theme.fg("toolOutput", text) },
-						{ ...resolveImageOptions(), budget: this.#imageBudget, imageKey: key },
+						{
+							...resolveImageOptions(),
+							budget: this.#imageBudget,
+							imageKey: key,
+							requestRender: this.#onImageUpdate,
+						},
 					),
 				);
 				continue;
@@ -1415,10 +1600,14 @@ export class AssistantMessageComponent extends Container {
 	}
 
 	#computeShapeKey(message: AssistantMessage): string {
-		const parts: string[] = [`htb:${this.#hideThinkingBlock ? 1 : 0}|pot:${this.#proseOnlyThinking ? 1 : 0}`];
+		const parts: string[] = [
+			`htb:${this.#hideThinkingBlock ? 1 : 0}|pot:${this.#proseOnlyThinking ? 1 : 0}|etb:${this.#expandThinkingBlocks ? 1 : 0}`,
+		];
 		for (const content of message.content) {
 			if (content.type === "text") {
-				parts.push(canonicalizeMessage(content.text) ? "T1" : "T0");
+				parts.push(
+					!canonicalizeMessage(content.text) ? "T0" : this.#liftsFigures(content.text.trim()) ? "TF" : "T1",
+				);
 			} else if (content.type === "thinking") {
 				if (this.#hideThinkingBlock) {
 					// Match the pulse's empty/nonempty transition without formatting hidden text.
@@ -1572,6 +1761,8 @@ export class AssistantMessageComponent extends Container {
 
 		// Clear content container
 		this.#contentContainer.clear();
+		this.#kittyPreviouslyDisplayed = this.#kittyDisplayed;
+		this.#kittyDisplayed = new Map();
 		this.#thinkingExtensions.clear();
 		this.#emergencyText = undefined;
 		this.#thinkingDots = undefined;
@@ -1579,9 +1770,9 @@ export class AssistantMessageComponent extends Container {
 
 		// Determine if we should capture Markdown instances for next fast path
 		const shouldCapture = this.#canFastPath(message);
-		const captureItems:
-			| Array<{ md: Markdown; contentIndex: number; blockType: "text" | "thinking"; lastText: string }>
-			| undefined = shouldCapture ? [] : undefined;
+		const captureItems: FastPathItem[] | undefined = shouldCapture ? [] : undefined;
+		const previousFigures = this.#figureBlocks;
+		this.#figureBlocks = new Map();
 
 		const hasVisibleContent = message.content.some(
 			c =>
@@ -1600,8 +1791,7 @@ export class AssistantMessageComponent extends Container {
 			if (content.type === "text" && canonicalizeMessage(content.text)) {
 				// Set paddingY=0 to avoid extra spacing before tool executions
 				const trimmed = content.text.trim();
-				const mdOptions = this.#textColorTransform ? { color: this.#textColorTransform } : undefined;
-				const md = new Markdown(trimmed, 1, 0, this.#getProseTheme(), mdOptions, 0);
+				const md = this.#proseBlock(i, trimmed, previousFigures);
 				this.#contentContainer.addChild(md);
 				this.#emergencyText = md;
 				captureItems?.push({ md, contentIndex: i, blockType: "text", lastText: trimmed });
@@ -1626,10 +1816,7 @@ export class AssistantMessageComponent extends Container {
 					);
 
 				// Thinking traces in thinkingText color, italic
-				const md = new Markdown(thinkingText, 1, 0, getMarkdownTheme(), {
-					color: (text: string) => theme.fg("thinkingText", text),
-					italic: true,
-				});
+				const md = this.#createMarkdown("thinking", thinkingText);
 				md.transientRenderCache = this.#lastUpdateTransient;
 				this.#contentContainer.addChild(md);
 				captureItems?.push({ md, contentIndex: i, blockType: "thinking", lastText: thinkingText });
@@ -1644,6 +1831,9 @@ export class AssistantMessageComponent extends Container {
 				hasRenderedContent ||= this.#showImages;
 			}
 		}
+		for (const [index, block] of previousFigures) {
+			if (this.#figureBlocks.get(index) !== block) block.dispose();
+		}
 
 		if (this.#shouldAnimateThinking(message)) {
 			if (hasVisibleContent) this.#contentContainer.addChild(new Spacer(1));
@@ -1655,6 +1845,7 @@ export class AssistantMessageComponent extends Container {
 		}
 
 		this.#renderToolImages();
+		this.#kittyPreviouslyDisplayed = undefined;
 		const errorPresentation = resolveAssistantErrorPresentation(message);
 		const hasToolCalls = message.content.some(c => c.type === "toolCall");
 		if (errorPresentation.kind === "compact-recovered") {

package/src/chat/chat-transcript-builder.d.ts

@@ -25,8 +25,11 @@ export interface ChatTranscriptBuilderDeps {
     cwd: string;
     hideThinkingBlock?: () => boolean;
     proseOnlyThinking?: () => boolean;
+    expandThinkingBlocks?: () => boolean;
     /** Session-scoped resolved destinations for model-authored Markdown links. */
     linkTargets?: ReadonlyMap<string, string>;
+    /** Draw charts under numeric tables; false for transcripts that are not the main session's. Default: true. */
+    tableCharts?: boolean;
     requestRender: () => void;
 }
 export declare class ChatTranscriptBuilder {