@timurproko/a1 0.1.8-dev.157 → 0.1.8-dev.214

package/dist/integrations/pi/session-ui/session-shell-root.js

@@ -1,9 +1,10 @@
-import { backgroundSgrSpan, composeSubmittedPromptRows, displayWidth, formatSubmittedPromptTime, heldNativeHyperlinkStyle, hyperlinkSgrSpan, nativeHyperlinkStyle, overlaySpan, submittedPromptLayout, stripAnsi, } from "../../../ui/components/index.js";
+import { backgroundSgrSpan, composeSubmittedPromptRows, displayWidth, formatSubmittedPromptTime, heldNativeHyperlinkStyle, hyperlinkSgrSpan, nativeHyperlinkStyle, overlaySpan, progressStatusText, submittedPromptLayout, stripAnsi, } from "../../../ui/components/index.js";
 import { PINNED_PI_HIDDEN_COMMAND_NAMES, PINNED_PI_WORKFLOW_COMMAND_NAMES, } from "../engine/index.js";
-import { createPiExtensionUiBridge, createPiQueuedInputStatus, createPiShellArmin, createPiShellAuthProviderSelector, createPiShellChangelog, createPiShellDaxnuts, createPiShellDialog, createPiShellEarendilAnnouncement, createPiShellEditor, createPiShellExtensionSelector, createPiShellFooter, createPiShellHeader, createPiShellHotkeys, createPiShellLoadedResources, createPiShellLoginDialog, createPiShellModelSelector, createPiShellOperationLoader, createPiShellReloadBox, createPiShellScopedModelsSelector, createPiShellSelector, createPiShellSessionInfo, createPiShellSessionSelector, createPiShellSettingsSelector, createPiShellStatus, createPiShellTranscriptComponent, createPiShellTreeSelector, createPiShellTrustSelector, createPiShellUserMessageSelector, onPiThemeChange, piShellVisibleWidth, piTheme, renderPiShellPackageUpdateNotice, renderPiShellStartupDiagnostic, renderPiShellStatusText, renderPiShellTranscriptBlock, } from "../components/index.js";
-import { PiTuiRuntimeAdapter, } from "../tui-runtime/index.js";
+import { createPiExtensionUiBridge, createPiQueuedInputStatus, createPiShellArmin, createPiShellAuthProviderSelector, createPiShellChangelog, createPiShellCollapsedChangelog, createPiShellDaxnuts, createPiShellDialog, createPiShellEarendilAnnouncement, createPiShellEditor, createPiShellExtensionSelector, createPiShellFooter, createPiShellHeader, createPiShellHotkeys, createPiShellLoadedResources, createPiShellLoginDialog, createPiShellModelSelector, createPiShellOperationLoader, createPiShellReloadBox, createPiShellScopedModelsSelector, createPiShellSelector, createPiShellSessionInfo, createPiShellSessionSelector, createPiShellSettingsSelector, createPiShellStatus, createPiShellTranscriptComponent, createPiShellTreeSelector, createPiShellTrustSelector, createPiShellUserMessageSelector, onPiThemeChange, piShellVisibleWidth, piTheme, renderPiShellPackageUpdateNotice, renderPiShellStartupDiagnostic, renderPiShellStatusText, renderPiShellTranscriptBlock, } from "../components/index.js";
+import { PiTuiRuntimeAdapter, classifyPiTuiInput, } from "../tui-runtime/index.js";
 import { PromptChipStore } from "./prompt-chips.js";
 import { SessionViewportController } from "./session-viewport-controller.js";
+/** Composes backend session state into the owned transcript, viewport, editor, and dock presentation. */
 export class OwnedUiSessionShellRoot {
     editor;
     header;
@@ -12,7 +13,7 @@ export class OwnedUiSessionShellRoot {
     #transcript = new Map();
     #blocksById = new Map();
     #renderedRows = new Map();
-    /** Flattened transcript rows reused by wheel, rail, jump, and selection frames. */
+    // Performance: document layouts are shared by wheel, rail, jump, and selection frames.
     #documentLayouts = new Map();
     #themeUnsubscribe;
     #transcriptOrder = [];
@@ -21,18 +22,32 @@ export class OwnedUiSessionShellRoot {
     #footer;
     #queued;
     #extensionRenderers;
+    #imageAssets;
     #promptChips = new PromptChipStore();
     #customViewport;
     #submittedPromptComposer;
     #viewportController;
+    #viewportTheme;
+    #onViewportFrame;
     #componentRuntime;
     #toolsExpanded = false;
     #thinkingVisible = true;
+    #mermaidRenderingMode = "off";
+    #showImages = true;
+    #imageWidthCells = 80;
+    #outputPad = 1;
     #workflowTranscriptSequence = 0;
     #workflowStatusAnchors = new Map();
     #workflowStatusMessages = new Map();
     #lastWorkflowStatusId;
     #inputSurface;
+    #inputSurfaceCoordination = "editor";
+    #dockInputReuseEnabled;
+    #dockInputCandidate = false;
+    #visibleViewportSnapshot;
+    #fullViewportCompositions = 0;
+    #dockOnlyViewportCompositions = 0;
+    #transcriptBlockRenders = 0;
     #extensionHeader = null;
     #extensionFooter = null;
     #extensionWidgets = new Map();
@@ -42,7 +57,7 @@ export class OwnedUiSessionShellRoot {
     constructor(view, cwd, handlers, startup = {}, agentDir, extensionRenderers = {
         getMessageRenderer: () => undefined,
         getToolDefinition: () => undefined,
-    }, sessionLayout = "pinned") {
+    }, sessionLayout = "pinned", imageAssets) {
         this.#view = view;
         this.#customViewport = sessionLayout === "custom-viewport";
         this.#submittedPromptComposer = this.#customViewport
@@ -54,10 +69,13 @@ export class OwnedUiSessionShellRoot {
             : undefined;
         this.#cwd = cwd;
         this.#extensionRenderers = extensionRenderers;
+        this.#imageAssets = imageAssets;
         this.#componentRuntime = handlers;
+        this.#onViewportFrame = handlers.onViewportFrame;
+        this.#dockInputReuseEnabled = handlers.enableDockInputReuse ?? true;
         this.header = createPiShellHeader(startup);
         this.resources = createPiShellLoadedResources(startup.resources ?? [], startup.expanded ?? false);
-        this.#status = createPiShellStatus(view, handlers);
+        this.#status = createPiShellStatus(view, progressStatusText, handlers);
         this.#footer = createPiShellFooter(this.#viewWithExtensionStatuses(view), cwd);
         this.#queued = createPiQueuedInputStatus(view.editor.queuedSubmissions, this.#customViewport ? "custom-viewport" : "pinned");
         this.editor = createPiShellEditor({
@@ -72,7 +90,7 @@ export class OwnedUiSessionShellRoot {
                 if (ranges.length === 0)
                     return row;
                 const linkResetAndTail = `\u001b]8;;\u001b\\\u001b[24m${" ".repeat(Math.max(0, width - piShellVisibleWidth(row)))}`;
-                // VS15 is zero-column and default-ignorable. It breaks Windows Terminal's
+                // Platform: VS15 is zero-column and default-ignorable. It breaks Windows Terminal's
                 // plain-text URL detector only in the held-button paint; semantic text stays exact.
                 const paintRow = this.#viewportController.editorPointerSelecting
                     ? row.replaceAll("https://", "https:\uFE0E//").replaceAll("http://", "http:\uFE0E//")
@@ -80,7 +98,7 @@ export class OwnedUiSessionShellRoot {
                 const decorated = this.#viewportController.editorPointerSelecting
                     ? ranges.reduce((result, range) => backgroundSgrSpan(result, piShellVisibleWidth(plain.slice(0, range.start)), piShellVisibleWidth(plain.slice(0, range.end)), "\u001b[4:4m", "\u001b[24m", piShellVisibleWidth), paintRow)
                     : ranges.reduce((result, range) => hyperlinkSgrSpan(result, piShellVisibleWidth(plain.slice(0, range.start)), piShellVisibleWidth(plain.slice(0, range.end)), range.target, piShellVisibleWidth), row);
-                // Windows Terminal can retain stale native dotted-link cells when a mutable
+                // Platform: Windows Terminal can retain stale native dotted-link cells when a mutable
                 // prompt replaces a longer URL. Explicit non-link spaces overwrite that tail.
                 return `${decorated}${linkResetAndTail}`;
             },
@@ -95,6 +113,16 @@ export class OwnedUiSessionShellRoot {
             requestRender: force => this.#componentRuntime.requestRender(force),
             hasEditorLinks: () => this.#promptChips.hyperlinkRanges(this.editor.getText()).length > 0,
         });
+        // Performance: stable painter identities let the neutral viewport retain row-level
+        // selection variants while each callback still resolves the live Pi theme.
+        this.#viewportTheme = {
+            track: text => `${SCROLLBAR_CELL_RESET}${piTheme().fg("dim", text)}`,
+            thumb: text => `${SCROLLBAR_CELL_RESET}${piTheme().fg("accent", text)}`,
+            sticky: (text, hovered) => piTheme().bg(hovered ? "selectedBg" : "toolPendingBg", piTheme().fg("text", withoutTerminalBackground(text))),
+            quietSticky: text => `\u001b[2m${text.replace(/\u001b\[(?:0|22)m/g, "$&\u001b[2m")}\u001b[22m`,
+            bottomControl: (text, hovered) => piTheme().bg(hovered ? "selectedBg" : "toolPendingBg", piTheme().fg("text", text)),
+            selection: (line, from, to) => backgroundSgrSpan(line, from, to, "\u001b[48;2;38;79;120m", "\u001b[49m"),
+        };
         this.editor.setThinkingLevel(view.thinkingLevel);
         this.#inputSurface = this.editor;
         for (const block of view.transcript) {
@@ -102,13 +130,54 @@ export class OwnedUiSessionShellRoot {
                 this.editor.addToHistory(block.text);
         }
         this.#syncTranscript(view.transcript);
-        // Colours come from the active theme, so rendered rows outlive their revision only
+        // Invariant: colours come from the active theme, so rendered rows outlive their revision only
         // until the theme under them changes.
         this.#themeUnsubscribe = onPiThemeChange(() => {
             this.#renderedRows.clear();
             this.#documentLayouts.clear();
         });
     }
+    setEditorPaddingX(padding) {
+        this.editor.setPaddingX(padding);
+        this.#documentLayouts.clear();
+    }
+    setAutocompleteMaxVisible(maxVisible) {
+        this.editor.setAutocompleteMaxVisible(maxVisible);
+    }
+    setOutputPad(padding) {
+        if (this.#outputPad === padding)
+            return;
+        this.#outputPad = padding;
+        this.#status.setOutputPad(padding);
+        for (const component of this.#transcript.values())
+            component.setOutputPad(padding);
+        this.#invalidateTranscriptPresentation();
+    }
+    setHideThinkingBlock(hidden) {
+        if (this.#thinkingVisible === !hidden)
+            return;
+        this.#thinkingVisible = !hidden;
+        for (const component of this.#transcript.values())
+            component.setHideThinkingBlock(hidden);
+        this.#invalidateTranscriptPresentation();
+    }
+    setMermaidRenderingMode(mode) {
+        if (this.#mermaidRenderingMode === mode)
+            return;
+        this.#mermaidRenderingMode = mode;
+        for (const component of this.#transcript.values())
+            component.setMermaidRenderingMode(mode);
+        this.#invalidateTranscriptPresentation();
+    }
+    setImagePresentation(showImages, imageWidthCells) {
+        if (this.#showImages === showImages && this.#imageWidthCells === imageWidthCells)
+            return;
+        this.#showImages = showImages;
+        this.#imageWidthCells = imageWidthCells;
+        for (const component of this.#transcript.values())
+            component.setImagePresentation(showImages, imageWidthCells);
+        this.#invalidateTranscriptPresentation();
+    }
     preparePromptSubmission(text) {
         return this.#promptChips.prepareSubmission(text);
     }
@@ -135,7 +204,7 @@ export class OwnedUiSessionShellRoot {
         this.#blocksById.set(block.id, block);
         const component = this.#transcript.get(block.id);
         if (component === undefined) {
-            const created = createPiShellTranscriptComponent(block, this.#cwd, this.#extensionRenderers, this.#submittedPromptComposer);
+            const created = createPiShellTranscriptComponent(block, this.#cwd, this.#extensionRenderers, this.#submittedPromptComposer, this.#outputPad, !this.#thinkingVisible, this.#mermaidRenderingMode, this.#showImages, this.#imageWidthCells, this.#imageAssets);
             created.setExpanded(this.#toolsExpanded);
             this.#transcript.set(block.id, created);
             this.#transcriptOrder.push(block.id);
@@ -143,7 +212,7 @@ export class OwnedUiSessionShellRoot {
         else if (component.revision !== block.revision) {
             component.update(block);
         }
-        // One chunk touches one block, and the updated component tracks its own dirtiness.
+        // Performance: one chunk touches one block, and the updated component tracks its own dirtiness.
         // Invalidating the whole shell here would re-wrap the entire transcript per chunk.
         this.#renderedRows.delete(block.id);
         this.#documentLayouts.clear();
@@ -155,62 +224,79 @@ export class OwnedUiSessionShellRoot {
         }
         const height = Math.max(0, this.#componentRuntime.getRows());
         const dock = this.#renderDockLayout(width);
-        const availableWithoutTransient = Math.max(0, height - Math.min(height, dock.rowsWithoutTransient.length));
-        // Ordinary transcript content uses the full terminal width. The rail is an
+        // Invariant: ordinary transcript content uses the full terminal width. The rail is an
         // overlay, not a lost wrapping cell. Submitted prompts alone retain the
         // intentional final gutter after their right-aligned timestamp.
         const documentWidth = width;
-        let document = this.#renderDocumentLayout(documentWidth);
-        // Keep queued steering/follow-up messages and Working together in Pi's
-        // semantic order while content fits. Once the transcript overflows, move
-        // the complete transient group into its tail so every row naturally
-        // scrolls away and the detached viewport can use the full space above the
-        // stable editor/footer dock.
-        const pinTransient = document.rows.length + dock.transientRows.length <= availableWithoutTransient;
-        const dockRows = pinTransient ? dock.rows : dock.rowsWithoutTransient;
+        const document = this.#renderDocumentLayout(documentWidth);
+        // Invariant: prompt-adjacent transient surfaces always belong to the dock.
+        // Changing from fitting to overflowing content reallocates transcript rows
+        // only; it never moves queued or Working rows into selectable history.
+        const dockRows = dock.rows;
         const selectableDocumentRowCount = document.rows.length;
-        if (!pinTransient)
-            document = { ...document, rows: [...document.rows, ...dock.transientRows] };
         const dockStartRow = height - dockRows.length + 1;
-        const editorOffset = pinTransient ? dock.editorOffsetWithTransient : dock.editorOffsetWithoutTransient;
+        const editorOffset = dock.editorOffset;
         this.#viewportController.setEditorPointerFrame(this.usesDefaultInputSurface()
             ? {
                 rowStart: dockStartRow + editorOffset,
                 rowEnd: dockStartRow + editorOffset + dock.inputRows - 1,
             }
             : undefined);
-        return this.#viewportController.compose({
-            documentRows: document.rows,
-            ...(this.#viewportController.transcriptPointerSelecting
-                ? { paintDocumentRow: heldNativeHyperlinkStyle }
-                : {}),
-            // Overflowing queued and Working rows scroll with the transcript but
-            // remain status chrome: selection and copying stop at the real document tail.
-            selectableDocumentRowCount,
-            dockRows,
-            promptAnchors: document.promptAnchors,
+        const snapshot = this.#visibleViewportSnapshot;
+        const dockInputCandidate = this.#dockInputCandidate;
+        this.#dockInputCandidate = false;
+        let frame = dockInputCandidate
+            && snapshot !== undefined
+            && snapshot.width === width
+            && snapshot.height === height
+            && snapshot.documentRows === document.rows
+            && snapshot.promptAnchors === document.promptAnchors
+            && snapshot.dockLength === dockRows.length
+            && snapshot.inputSurface === this.#inputSurface
+            && snapshot.viewportRevision === this.#viewportController.presentationRevision
+            && snapshot.selectionRevision === this.#viewportController.selectionRevision
+            ? this.#viewportController.composeDockOnly(dockRows, width, height)
+            : null;
+        if (frame === null) {
+            frame = this.#viewportController.compose({
+                documentRows: document.rows,
+                ...(this.#viewportController.transcriptPointerSelecting
+                    ? { paintDocumentRow: heldNativeHyperlinkStyle }
+                    : {}),
+                // Invariant: selection and copying stop at the real document tail; queued
+                // and Working rows remain dock-owned status chrome at every fit boundary.
+                selectableDocumentRowCount,
+                dockRows,
+                promptAnchors: document.promptAnchors,
+                width,
+                height,
+                // Invariant: the control belongs immediately above the complete dock,
+                // never on top of a queued or Working row.
+                bottomControlRow: Math.max(0, height - Math.min(height, dockRows.length) - 1),
+                theme: this.#viewportTheme,
+            });
+            this.#fullViewportCompositions += 1;
+        }
+        else
+            this.#dockOnlyViewportCompositions += 1;
+        this.#visibleViewportSnapshot = {
             width,
             height,
-            // Anchor above the stable editor/widget/footer group. Queued input,
-            // working states, and transient notifications may grow above it without
-            // moving the floating control up and down the terminal.
-            bottomControlRow: Math.max(0, height - Math.min(height, dock.stableBottomRows) - 1),
-            theme: {
-                // Match the v2 rail: a continuously dim track and an accent thumb at
-                // rest, thickening on hover/drag through the presentation glyph. Reset
-                // inherited text decorations so dim transcript rows cannot dull the
-                // thumb; the row background deliberately remains intact.
-                track: text => `${SCROLLBAR_CELL_RESET}${piTheme().fg("dim", text)}`,
-                thumb: text => `${SCROLLBAR_CELL_RESET}${piTheme().fg("accent", text)}`,
-                sticky: (text, hovered) => piTheme().bg(hovered ? "selectedBg" : "toolPendingBg", piTheme().fg("text", withoutTerminalBackground(text))),
-                quietSticky: text => `\u001b[2m${text.replace(/\u001b\[(?:0|22)m/g, "$&\u001b[2m")}\u001b[22m`,
-                bottomControl: (text, hovered) => piTheme().bg(hovered ? "selectedBg" : "toolPendingBg", piTheme().fg("text", text)),
-                // Selection paints only the familiar dark-blue background. Source
-                // foreground roles (including links, warnings, muted text, and bold
-                // intensity) remain exactly as rendered instead of being inverted.
-                selection: (line, from, to) => backgroundSgrSpan(line, from, to, "\u001b[48;2;38;79;120m", "\u001b[49m"),
-            },
-        }).rows;
+            documentRows: document.rows,
+            promptAnchors: document.promptAnchors,
+            dockLength: dockRows.length,
+            inputSurface: this.#inputSurface,
+            viewportRevision: this.#viewportController.presentationRevision,
+            selectionRevision: this.#viewportController.selectionRevision,
+        };
+        this.#onViewportFrame?.(frame);
+        return frame.rows;
+    }
+    viewportFrameDescriptor() {
+        return this.#viewportController.frame?.descriptor ?? null;
+    }
+    hasActiveSelection() {
+        return this.#viewportController.hasSelection || this.editor.hasSelection();
     }
     setViewportConfig(config) {
         if (this.#viewportController.setConfig(config))
@@ -245,11 +331,7 @@ export class OwnedUiSessionShellRoot {
         const rowsWithoutTransient = [...aboveWidgets, ...input, ...belowWidgets, ...footer];
         return {
             rows: [...transientRows, ...rowsWithoutTransient],
-            rowsWithoutTransient,
-            transientRows,
-            stableBottomRows: rowsWithoutTransient.length,
-            editorOffsetWithTransient: transientRows.length + aboveWidgets.length,
-            editorOffsetWithoutTransient: aboveWidgets.length,
+            editorOffset: transientRows.length + aboveWidgets.length,
             inputRows: input.length,
         };
     }
@@ -306,7 +388,7 @@ export class OwnedUiSessionShellRoot {
         return this.#renderDocumentLayout(width).rows;
     }
     #renderDocumentLayout(width) {
-        // Extension headers may animate independently of transcript revisions, so
+        // Performance: extension headers may animate independently of transcript revisions, so
         // only the stable built-in document participates in this frame cache.
         const cached = this.#extensionHeader === null ? this.#documentLayouts.get(width) : undefined;
         if (cached !== undefined)
@@ -340,7 +422,7 @@ export class OwnedUiSessionShellRoot {
                 : width;
             const blockRows = this.#blockRows(id, block, blockWidth);
             if (block?.kind === "user") {
-                // The first natural prompt gets one breathing row at the document top.
+                // Compatibility: the first natural prompt gets one breathing row at the document top.
                 // Once scrolling advances, the prompt itself reaches row zero and then
                 // becomes sticky there, so the spacer is never pinned with it.
                 if (this.#customViewport && index === 0)
@@ -363,7 +445,13 @@ export class OwnedUiSessionShellRoot {
             .filter(diagnostic => diagnostic.code === "package-updates")
             .flatMap(diagnostic => renderPiShellPackageUpdateNotice(diagnostic.message.split("\n").filter(line => line.startsWith("- ")).map(line => line.slice(2)), width)));
         rows.push(...diagnostics
-            .filter(diagnostic => diagnostic.code !== "engine-startup" && diagnostic.code !== "package-updates")
+            .filter(diagnostic => diagnostic.code === "changelog-collapsed" || diagnostic.code === "changelog-expanded")
+            .flatMap(diagnostic => diagnostic.code === "changelog-collapsed"
+            ? createPiShellCollapsedChangelog().render(width)
+            : createPiShellChangelog(diagnostic.message).render(width)));
+        rows.push(...diagnostics
+            .filter(diagnostic => diagnostic.code !== "engine-startup" && diagnostic.code !== "package-updates"
+            && diagnostic.code !== "changelog-collapsed" && diagnostic.code !== "changelog-expanded")
             .slice(-3)
             .flatMap(diagnostic => renderPiShellTranscriptBlock({
             id: `diagnostic-${diagnostic.sequence}`,
@@ -377,23 +465,19 @@ export class OwnedUiSessionShellRoot {
         const layout = { rows: Object.freeze(rows), promptAnchors: Object.freeze(promptAnchors) };
         if (this.#extensionHeader === null) {
             this.#documentLayouts.set(width, layout);
-            // The custom viewport commonly probes full width and reserved-rail width.
+            // Performance: the custom viewport commonly probes full width and reserved-rail width.
             while (this.#documentLayouts.size > 2)
                 this.#documentLayouts.delete(this.#documentLayouts.keys().next().value);
         }
         return layout;
     }
-    /**
-     * Rows for one transcript block. A finalized block renders once for a given revision
-     * and width and is reused after that, so a frame costs what changed rather than what
-     * the session has accumulated. A live block, and anything the shell drives itself, is
-     * rendered every time because its content is still moving.
-     */
+    // Performance: finalized blocks cache by revision and width; live blocks always render.
     #blockRows(id, block, width) {
         const component = this.#transcript.get(id);
         if (component === undefined)
             return [];
         const render = () => {
+            this.#transcriptBlockRenders += 1;
             const rows = component.render(width);
             if (!this.#customViewport || block?.kind === "user")
                 return rows;
@@ -411,7 +495,7 @@ export class OwnedUiSessionShellRoot {
             this.#renderedRows.set(id, byWidth);
         }
         byWidth.set(width, { revision: block.revision, rows });
-        // Bare A1 probes full width before reserving the overflowing rail column;
+        // Invariant: bare A1 probes full width before reserving the overflowing rail column;
         // retain both widths without turning resize history into an unbounded cache.
         while (byWidth.size > 2)
             byWidth.delete(byWidth.keys().next().value);
@@ -420,6 +504,20 @@ export class OwnedUiSessionShellRoot {
     transcriptComponent(id) {
         return this.#transcript.get(id);
     }
+    exitTranscript(width) {
+        const rows = [];
+        for (const id of this.#transcriptOrder) {
+            const block = this.#blocksById.get(id);
+            if (block === undefined || (!this.#thinkingVisible && block.kind === "thinking"))
+                continue;
+            if (rows.length > 0 && block.kind === "user")
+                rows.push("");
+            rows.push(...this.#blockRows(id, block, width).map(sanitizeExitTranscriptRow));
+        }
+        while (rows.at(-1) === "")
+            rows.pop();
+        return rows.join("\n");
+    }
     appendWorkflowStatus(message) {
         const previousId = this.#lastWorkflowStatusId;
         if (previousId !== undefined
@@ -432,7 +530,7 @@ export class OwnedUiSessionShellRoot {
         }
         const id = this.#appendAnchoredWorkflowComponent(width => [
             "",
-            ...renderPiShellStatusText(this.#workflowStatusMessages.get(id) ?? message, width),
+            ...renderPiShellStatusText(this.#workflowStatusMessages.get(id) ?? message, width, this.#outputPad),
         ]);
         this.#workflowStatusMessages.set(id, message);
         this.#lastWorkflowStatusId = id;
@@ -517,9 +615,7 @@ export class OwnedUiSessionShellRoot {
         this.#appendAnchoredWorkflowComponent(width => ["", ...daxnuts.render(width)], () => daxnuts.dispose?.());
     }
     toggleThinkingVisibility() {
-        this.#thinkingVisible = !this.#thinkingVisible;
-        this.#documentLayouts.clear();
-        this.invalidate();
+        this.setHideThinkingBlock(this.#thinkingVisible);
     }
     get toolsExpanded() {
         return this.#toolsExpanded;
@@ -588,7 +684,7 @@ export class OwnedUiSessionShellRoot {
         this.#extensionWorkingMessage = undefined;
         this.#status.setWorkingOverride(undefined);
         this.#footer.update(this.#viewWithExtensionStatuses(this.#view));
-        // An extension renderer may have drawn transcript blocks that are now unrendered by it.
+        // Invariant: an extension renderer may have drawn transcript blocks that are now unrendered by it.
         this.#renderedRows.clear();
         this.#documentLayouts.clear();
         this.invalidate();
@@ -613,19 +709,41 @@ export class OwnedUiSessionShellRoot {
     usesDefaultInputSurface() {
         return this.#inputSurface === this.editor;
     }
-    setInputSurface(component, disposePrevious = true) {
+    inputCoordinationSurface() {
+        return this.#inputSurfaceCoordination;
+    }
+    viewportCompositionEvidence() {
+        return { full: this.#fullViewportCompositions, dockOnly: this.#dockOnlyViewportCompositions };
+    }
+    transcriptRenderCount() {
+        return this.#transcriptBlockRenders;
+    }
+    setInputSurface(component, disposePrevious = true, coordination = "owned") {
         const next = component ?? this.editor;
-        if (next === this.#inputSurface)
+        const nextCoordination = next === this.editor ? "editor" : coordination;
+        if (next === this.#inputSurface) {
+            this.#inputSurfaceCoordination = nextCoordination;
             return;
+        }
+        this.#dockInputCandidate = false;
         this.#inputSurface.setFocused?.(false);
         if (disposePrevious && this.#inputSurface !== this.editor)
             this.#inputSurface.dispose?.();
         this.#inputSurface = next;
+        this.#inputSurfaceCoordination = nextCoordination;
         this.#inputSurface.setFocused?.(true);
         this.invalidate();
     }
     handleInput(data) {
-        this.#inputSurface.handleInput?.(data);
+        this.#dockInputCandidate = this.#customViewport && this.#dockInputReuseEnabled
+            && classifyPiTuiInput(data, this.#inputSurfaceCoordination) === "safe";
+        try {
+            this.#inputSurface.handleInput?.(data);
+        }
+        catch (error) {
+            this.#dockInputCandidate = false;
+            throw error;
+        }
     }
     invalidate() {
         this.header.invalidate();
@@ -653,6 +771,8 @@ export class OwnedUiSessionShellRoot {
         this.#transcript.clear();
         this.#renderedRows.clear();
         this.#documentLayouts.clear();
+        this.#visibleViewportSnapshot = undefined;
+        this.#dockInputCandidate = false;
         if (this.#inputSurface !== this.editor)
             this.#inputSurface.dispose?.();
         this.#extensionHeader?.dispose?.();
@@ -665,6 +785,11 @@ export class OwnedUiSessionShellRoot {
         this.#footer.dispose?.();
         this.#queued.dispose?.();
     }
+    #invalidateTranscriptPresentation() {
+        this.#renderedRows.clear();
+        this.#documentLayouts.clear();
+        this.invalidate();
+    }
     #syncTranscript(blocks) {
         const previousIds = this.#transcriptOrder.filter(id => !id.startsWith("workflow-status-"));
         const transcriptChanged = previousIds.length !== blocks.length || blocks.some((block, index) => {
@@ -687,7 +812,7 @@ export class OwnedUiSessionShellRoot {
         for (const block of blocks) {
             const component = this.#transcript.get(block.id);
             if (component === undefined) {
-                const created = createPiShellTranscriptComponent(block, this.#cwd, this.#extensionRenderers, this.#submittedPromptComposer);
+                const created = createPiShellTranscriptComponent(block, this.#cwd, this.#extensionRenderers, this.#submittedPromptComposer, this.#outputPad, !this.#thinkingVisible, this.#mermaidRenderingMode, this.#showImages, this.#imageWidthCells, this.#imageAssets);
                 created.setExpanded(this.#toolsExpanded);
                 this.#transcript.set(block.id, created);
             }
@@ -724,6 +849,10 @@ export class OwnedUiSessionShellRoot {
             invalidate() { },
             update() { },
             setExpanded() { },
+            setOutputPad() { },
+            setHideThinkingBlock() { },
+            setMermaidRenderingMode() { },
+            setImagePresentation() { },
             ...(dispose === undefined ? {} : { dispose }),
         };
         this.#transcript.set(id, component);
@@ -775,13 +904,19 @@ export class OwnedUiSessionShellRoot {
         this.resources.setExpanded(expanded);
         for (const component of this.#transcript.values())
             component.setExpanded(expanded);
-        // Expansion changes what a block draws without changing its revision.
+        // Invariant: expansion changes what a block draws without changing its revision.
         this.#renderedRows.clear();
         this.#documentLayouts.clear();
         this.invalidate();
     }
 }
 const SCROLLBAR_CELL_RESET = "\u001b[22;23;24;25;27;28;29;39;54;55m";
+const KITTY_IMAGE_CONTROL = /\u001b_G[\s\S]*?\u001b\\/g;
+const ITERM_IMAGE_CONTROL = /\u001b]1337;File=[^\u0007]*(?:\u0007|\u001b\\)/g;
+/** Keep semantic SGR/OSC styling while excluding non-replayable image payloads. */
+function sanitizeExitTranscriptRow(row) {
+    return row.replace(KITTY_IMAGE_CONTROL, "").replace(ITERM_IMAGE_CONTROL, "");
+}
 const TERMINAL_BACKGROUND = /\u001b\[(?:4[0-9]|10[0-7]|48(?:[;:][0-9;:]*)?)m/g;
 /** Web URLs use link blue; file targets retain A1's cyan interactive accent. */
 function nativeTranscriptLinkColor(text, target) {

package/dist/integrations/pi/session-ui/session-shell.d.ts

@@ -1,9 +1,10 @@
 import type { OwnedUiSessionViewModel, OwnedUiThinkingLevel } from "../../../contracts/owned-ui/index.js";
 import { type AdapterCommandResult, type PiWorkflowRequest } from "../engine/index.js";
 import { type PiShellSelectorOption } from "../components/index.js";
-import { PiTuiRuntimeAdapter, type PiTuiOverlayHandle } from "../tui-runtime/index.js";
+import { PiTuiRuntimeAdapter, type PiTuiDamageDecision, type PiTuiOverlayHandle } from "../tui-runtime/index.js";
 import { OwnedUiSessionShellRoot, type OwnedUiBackendPort, type OwnedUiSessionShellOptions } from "./session-shell-root.js";
 export { OwnedUiSessionShellRoot, type OwnedUiSessionShellOptions } from "./session-shell-root.js";
+/** Coordinates backend, owned presentation, and Pi TUI lifecycles for one interactive session. */
 export declare class OwnedUiSessionShell {
     #private;
     readonly backend: OwnedUiBackendPort;
@@ -11,6 +12,7 @@ export declare class OwnedUiSessionShell {
     readonly runtime: PiTuiRuntimeAdapter;
     constructor(options: OwnedUiSessionShellOptions);
     view(): OwnedUiSessionViewModel;
+    damagePresentationDecision(): PiTuiDamageDecision | null;
     start(): void;
     onView(listener: (view: OwnedUiSessionViewModel) => void): () => void;
     waitUntilStopped(): Promise<void>;
@@ -44,3 +46,10 @@ export declare class OwnedUiSessionShell {
     showScopedModelsSelector(): void;
     dispose(): Promise<void>;
 }
+export interface SessionResumeCommandMetadata {
+    readonly sessionId: string;
+    readonly sessionDir: string;
+    readonly usesDefaultSessionDir: boolean;
+}
+export declare function formatSessionResumeCommand(metadata: SessionResumeCommandMetadata): string;
+export declare function quoteCommandArgument(value: string): string;