@timurproko/a1 0.1.8-dev.137 → 0.1.8-dev.151

package/dist/integrations/pi/{owned-ui → session-ui}/session-shell-root.js

@@ -1,7 +1,9 @@
-import { MOUSE_TRACKING_OFF, MOUSE_TRACKING_ON, parseMouseInput } from "../../../ui/components/index.js";
+import { backgroundSgrSpan, composeSubmittedPromptRows, displayWidth, formatSubmittedPromptTime, heldNativeHyperlinkStyle, hyperlinkSgrSpan, nativeHyperlinkStyle, overlaySpan, 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, piTheme, renderPiShellPackageUpdateNotice, renderPiShellStartupDiagnostic, renderPiShellStatusText, renderPiShellTranscriptBlock, } from "../components/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 { PromptChipStore } from "./prompt-chips.js";
+import { SessionViewportController } from "./session-viewport-controller.js";
 export class OwnedUiSessionShellRoot {
     editor;
     header;
@@ -10,6 +12,8 @@ export class OwnedUiSessionShellRoot {
     #transcript = new Map();
     #blocksById = new Map();
     #renderedRows = new Map();
+    /** Flattened transcript rows reused by wheel, rail, jump, and selection frames. */
+    #documentLayouts = new Map();
     #themeUnsubscribe;
     #transcriptOrder = [];
     #view;
@@ -17,6 +21,10 @@ export class OwnedUiSessionShellRoot {
     #footer;
     #queued;
     #extensionRenderers;
+    #promptChips = new PromptChipStore();
+    #customViewport;
+    #submittedPromptComposer;
+    #viewportController;
     #componentRuntime;
     #toolsExpanded = false;
     #thinkingVisible = true;
@@ -34,8 +42,16 @@ export class OwnedUiSessionShellRoot {
     constructor(view, cwd, handlers, startup = {}, agentDir, extensionRenderers = {
         getMessageRenderer: () => undefined,
         getToolDefinition: () => undefined,
-    }) {
+    }, sessionLayout = "pinned") {
         this.#view = view;
+        this.#customViewport = sessionLayout === "custom-viewport";
+        this.#submittedPromptComposer = this.#customViewport
+            ? {
+                layout: submittedPromptLayout,
+                compose: (rows, width, source, style) => composeSubmittedPromptRows(rows, width, source, style)
+                    .map(row => nativeHyperlinkStyle(row, nativeTranscriptLinkColor)),
+            }
+            : undefined;
         this.#cwd = cwd;
         this.#extensionRenderers = extensionRenderers;
         this.#componentRuntime = handlers;
@@ -43,13 +59,42 @@ export class OwnedUiSessionShellRoot {
         this.resources = createPiShellLoadedResources(startup.resources ?? [], startup.expanded ?? false);
         this.#status = createPiShellStatus(view, handlers);
         this.#footer = createPiShellFooter(this.#viewWithExtensionStatuses(view), cwd);
-        this.#queued = createPiQueuedInputStatus(view.editor.queuedSubmissions);
+        this.#queued = createPiQueuedInputStatus(view.editor.queuedSubmissions, this.#customViewport ? "custom-viewport" : "pinned");
         this.editor = createPiShellEditor({
             ...handlers,
+            keybindingProfile: this.#customViewport ? "a1" : "pi",
+            paintEditorSelection: (line, from, to, atomic) => backgroundSgrSpan(line, from, to, atomic ? "\u001b[7m" : "\u001b[27m\u001b[48;2;38;79;120m", atomic ? "\u001b[27m" : "\u001b[49m", piShellVisibleWidth),
+            transformPastedContent: content => this.#promptChips.transformPastedContent(content),
+            editorAtomicRanges: line => this.#promptChips.atomicRanges(line),
+            decorateEditorRow: (row, width) => {
+                const plain = stripAnsi(row);
+                const ranges = this.#promptChips.hyperlinkRanges(plain);
+                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
+                // 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//")
+                    : row;
+                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
+                // prompt replaces a longer URL. Explicit non-link spaces overwrite that tail.
+                return `${decorated}${linkResetAndTail}`;
+            },
+            expandCopiedEditorText: text => this.#promptChips.expandCopiedText(text),
             cwd,
             ...(agentDir === undefined ? {} : { agentDir }),
             onToolsExpand: () => this.#setToolsExpanded(!this.#toolsExpanded),
         });
+        this.#viewportController = new SessionViewportController({
+            enabled: this.#customViewport,
+            editor: this.editor,
+            requestRender: force => this.#componentRuntime.requestRender(force),
+            hasEditorLinks: () => this.#promptChips.hyperlinkRanges(this.editor.getText()).length > 0,
+        });
         this.editor.setThinkingLevel(view.thinkingLevel);
         this.#inputSurface = this.editor;
         for (const block of view.transcript) {
@@ -59,9 +104,19 @@ export class OwnedUiSessionShellRoot {
         this.#syncTranscript(view.transcript);
         // 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.#themeUnsubscribe = onPiThemeChange(() => {
+            this.#renderedRows.clear();
+            this.#documentLayouts.clear();
+        });
+    }
+    preparePromptSubmission(text) {
+        return this.#promptChips.prepareSubmission(text);
     }
     update(view) {
+        if (view.diagnostics.length !== this.#view.diagnostics.length
+            || view.diagnostics.some((diagnostic, index) => diagnostic.sequence !== this.#view.diagnostics[index]?.sequence)) {
+            this.#documentLayouts.clear();
+        }
         this.#view = view;
         this.#status.update(view);
         this.#footer.update(this.#viewWithExtensionStatuses(view));
@@ -80,7 +135,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);
+            const created = createPiShellTranscriptComponent(block, this.#cwd, this.#extensionRenderers, this.#submittedPromptComposer);
             created.setExpanded(this.#toolsExpanded);
             this.#transcript.set(block.id, created);
             this.#transcriptOrder.push(block.id);
@@ -91,18 +146,112 @@ export class OwnedUiSessionShellRoot {
         // 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();
     }
     render(width) {
+        if (!this.#customViewport) {
+            this.#viewportController.setEditorPointerFrame(undefined);
+            return [...this.#renderDocument(width), ...this.#renderDock(width)];
+        }
+        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
+        // 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 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;
+        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,
+            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;
+    }
+    setViewportConfig(config) {
+        if (this.#viewportController.setConfig(config))
+            this.#documentLayouts.clear();
+    }
+    resumeViewportFollowing() {
+        this.#viewportController.resumeFollowing();
+    }
+    noteCompletedAssistantMessage() {
+        this.#viewportController.noteCompletedAssistantMessage();
+    }
+    resetViewport() {
+        this.#viewportController.reset();
+    }
+    clearViewportPointerState() {
+        this.#viewportController.clearPointerState();
+    }
+    handleViewportPreInput(data, allowWheel = true, now = Date.now()) {
+        return this.#viewportController.handlePreInput(data, allowWheel, now);
+    }
+    #renderDock(width) {
+        return this.#renderDockLayout(width).rows;
+    }
+    #renderDockLayout(width) {
         const queued = this.#view.editor.queuedSubmissions.length === 0 ? [] : this.#queued.render(width);
-        return [
-            ...this.#renderDocument(width),
-            ...queued,
-            ...this.#renderStatus(width),
-            ...this.#renderWidgets("aboveEditor", width),
-            ...this.#inputSurface.render(width),
-            ...this.#renderWidgets("belowEditor", width),
-            ...this.#renderFooter(width),
-        ];
+        const statusRows = this.#renderStatus(width);
+        const transientRows = [...queued, ...statusRows];
+        const aboveWidgets = this.#renderWidgets("aboveEditor", width);
+        const input = this.#inputSurface.render(width);
+        const belowWidgets = this.#renderWidgets("belowEditor", width);
+        const footer = this.#renderFooter(width);
+        const rowsWithoutTransient = [...aboveWidgets, ...input, ...belowWidgets, ...footer];
+        return {
+            rows: [...transientRows, ...rowsWithoutTransient],
+            rowsWithoutTransient,
+            transientRows,
+            stableBottomRows: rowsWithoutTransient.length,
+            editorOffsetWithTransient: transientRows.length + aboveWidgets.length,
+            editorOffsetWithoutTransient: aboveWidgets.length,
+            inputRows: input.length,
+        };
     }
     layoutRoot() {
         const document = layoutPort(width => this.#renderDocument(width), () => this.invalidate());
@@ -154,23 +303,66 @@ export class OwnedUiSessionShellRoot {
         };
     }
     #renderDocument(width) {
-        const transcript = this.#transcriptOrder.flatMap((id, index) => {
-            const block = this.#blocksById.get(id);
-            if (!this.#thinkingVisible && block?.kind === "thinking")
-                return [];
-            const rows = this.#blockRows(id, block, width);
-            if (index > 0 && block?.kind === "user")
-                return ["", ...rows];
-            return rows;
-        });
+        return this.#renderDocumentLayout(width).rows;
+    }
+    #renderDocumentLayout(width) {
+        // 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)
+            return cached;
         const diagnostics = this.#view.diagnostics;
         const startupRows = diagnostics
             .filter(diagnostic => diagnostic.code === "engine-startup")
             .flatMap(diagnostic => renderPiShellStartupDiagnostic(diagnostic, width));
-        const packageUpdateRows = diagnostics
+        const resourceRows = this.#customViewport ? [] : [...this.resources.render(width)];
+        if (resourceRows.at(-1) === "")
+            resourceRows.pop();
+        const headerRows = this.#extensionHeader !== null
+            ? this.#extensionHeader.render(width)
+            : this.#customViewport ? [] : this.header.render(width);
+        const rows = [
+            ...startupRows,
+            ...headerRows,
+            ...resourceRows,
+        ];
+        const promptAnchors = [];
+        for (let index = 0; index < this.#transcriptOrder.length; index += 1) {
+            const id = this.#transcriptOrder[index];
+            const block = this.#blocksById.get(id);
+            if (!this.#thinkingVisible && block?.kind === "thinking")
+                continue;
+            const blockWidth = this.#customViewport
+                && block?.kind === "user"
+                && this.#viewportController.config.scrollbarAppearance !== "hidden"
+                && width > 1
+                ? width - 1
+                : width;
+            const blockRows = this.#blockRows(id, block, blockWidth);
+            if (block?.kind === "user") {
+                // 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)
+                    rows.push("");
+                else if (index > 0)
+                    rows.push("");
+            }
+            const firstRow = rows.length;
+            rows.push(...blockRows);
+            if (block?.kind === "user" && blockRows[0] !== undefined) {
+                promptAnchors.push({
+                    id: block.id,
+                    firstRow,
+                    lastRow: Math.max(firstRow, rows.length - 1),
+                    sourceRow: pinnedPromptSourceRow(block, blockRows[0], blockWidth),
+                });
+            }
+        }
+        rows.push(...diagnostics
             .filter(diagnostic => diagnostic.code === "package-updates")
-            .flatMap(diagnostic => renderPiShellPackageUpdateNotice(diagnostic.message.split("\n").filter(line => line.startsWith("- ")).map(line => line.slice(2)), width));
-        const diagnosticRows = diagnostics
+            .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")
             .slice(-3)
             .flatMap(diagnostic => renderPiShellTranscriptBlock({
@@ -181,18 +373,15 @@ export class OwnedUiSessionShellRoot {
             title: diagnostic.code,
             text: diagnostic.message,
             payload: {},
-        }, width, this.#cwd));
-        const resourceRows = [...this.resources.render(width)];
-        if (resourceRows.at(-1) === "")
-            resourceRows.pop();
-        return [
-            ...startupRows,
-            ...(this.#extensionHeader ?? this.header).render(width),
-            ...resourceRows,
-            ...transcript,
-            ...packageUpdateRows,
-            ...diagnosticRows,
-        ];
+        }, width, this.#cwd)));
+        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.
+            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
@@ -204,13 +393,28 @@ export class OwnedUiSessionShellRoot {
         const component = this.#transcript.get(id);
         if (component === undefined)
             return [];
+        const render = () => {
+            const rows = component.render(width);
+            if (!this.#customViewport || block?.kind === "user")
+                return rows;
+            return rows.map(row => nativeHyperlinkStyle(row, nativeTranscriptLinkColor));
+        };
         if (block === undefined || block.status !== "finalized")
-            return component.render(width);
-        const cached = this.#renderedRows.get(id);
-        if (cached && cached.width === width && cached.revision === block.revision)
+            return render();
+        let byWidth = this.#renderedRows.get(id);
+        const cached = byWidth?.get(width);
+        if (cached?.revision === block.revision)
             return cached.rows;
-        const rows = component.render(width);
-        this.#renderedRows.set(id, { width, revision: block.revision, rows });
+        const rows = render();
+        if (byWidth === undefined) {
+            byWidth = new Map();
+            this.#renderedRows.set(id, byWidth);
+        }
+        byWidth.set(width, { revision: block.revision, rows });
+        // 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);
         return rows;
     }
     transcriptComponent(id) {
@@ -222,6 +426,7 @@ export class OwnedUiSessionShellRoot {
             && this.#transcriptOrder.at(-1) === previousId
             && this.#workflowStatusAnchors.get(previousId) === this.#view.transcript.length) {
             this.#workflowStatusMessages.set(previousId, message);
+            this.#documentLayouts.clear();
             this.invalidate();
             return;
         }
@@ -313,6 +518,7 @@ export class OwnedUiSessionShellRoot {
     }
     toggleThinkingVisibility() {
         this.#thinkingVisible = !this.#thinkingVisible;
+        this.#documentLayouts.clear();
         this.invalidate();
     }
     get toolsExpanded() {
@@ -335,6 +541,7 @@ export class OwnedUiSessionShellRoot {
         if (this.#extensionHeader !== component)
             this.#extensionHeader?.dispose?.();
         this.#extensionHeader = component;
+        this.#documentLayouts.clear();
         this.invalidate();
     }
     setExtensionFooter(component) {
@@ -366,6 +573,7 @@ export class OwnedUiSessionShellRoot {
         this.#workflowStatusMessages.clear();
         this.#transcriptOrder = this.#transcriptOrder.filter(id => !id.startsWith("workflow-status-"));
         this.#lastWorkflowStatusId = undefined;
+        this.#documentLayouts.clear();
         this.invalidate();
     }
     resetExtensionUi() {
@@ -382,6 +590,7 @@ export class OwnedUiSessionShellRoot {
         this.#footer.update(this.#viewWithExtensionStatuses(this.#view));
         // An extension renderer may have drawn transcript blocks that are now unrendered by it.
         this.#renderedRows.clear();
+        this.#documentLayouts.clear();
         this.invalidate();
     }
     addExtensionNotification(message, type) {
@@ -401,6 +610,9 @@ export class OwnedUiSessionShellRoot {
             onBranchChange: () => () => { },
         };
     }
+    usesDefaultInputSurface() {
+        return this.#inputSurface === this.editor;
+    }
     setInputSurface(component, disposePrevious = true) {
         const next = component ?? this.editor;
         if (next === this.#inputSurface)
@@ -432,6 +644,7 @@ export class OwnedUiSessionShellRoot {
         this.#inputSurface.setFocused?.(focused);
     }
     dispose() {
+        this.clearViewportPointerState();
         this.#themeUnsubscribe();
         this.header.dispose?.();
         this.resources.dispose?.();
@@ -439,6 +652,7 @@ export class OwnedUiSessionShellRoot {
             component.dispose?.();
         this.#transcript.clear();
         this.#renderedRows.clear();
+        this.#documentLayouts.clear();
         if (this.#inputSurface !== this.editor)
             this.#inputSurface.dispose?.();
         this.#extensionHeader?.dispose?.();
@@ -452,6 +666,13 @@ export class OwnedUiSessionShellRoot {
         this.#queued.dispose?.();
     }
     #syncTranscript(blocks) {
+        const previousIds = this.#transcriptOrder.filter(id => !id.startsWith("workflow-status-"));
+        const transcriptChanged = previousIds.length !== blocks.length || blocks.some((block, index) => {
+            const previous = this.#blocksById.get(block.id);
+            return previousIds[index] !== block.id || previous?.revision !== block.revision;
+        });
+        if (transcriptChanged)
+            this.#documentLayouts.clear();
         this.#blocksById.clear();
         for (const block of blocks)
             this.#blocksById.set(block.id, block);
@@ -466,7 +687,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);
+                const created = createPiShellTranscriptComponent(block, this.#cwd, this.#extensionRenderers, this.#submittedPromptComposer);
                 created.setExpanded(this.#toolsExpanded);
                 this.#transcript.set(block.id, created);
             }
@@ -508,6 +729,7 @@ export class OwnedUiSessionShellRoot {
         this.#transcript.set(id, component);
         this.#workflowStatusAnchors.set(id, this.#view.transcript.length);
         this.#transcriptOrder.push(id);
+        this.#documentLayouts.clear();
         this.invalidate();
         return id;
     }
@@ -555,9 +777,36 @@ export class OwnedUiSessionShellRoot {
             component.setExpanded(expanded);
         // 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 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) {
+    return piTheme().fg(/^file:/iu.test(target) ? "accent" : "mdLink", text);
+}
+/** Repaint a source prompt with viewport chrome while preserving text, links, and foreground roles. */
+function withoutTerminalBackground(text) {
+    return text.replace(TERMINAL_BACKGROUND, "");
+}
+/** A pinned timestamp is content now, not secondary transcript metadata. */
+function pinnedPromptSourceRow(block, sourceRow, width) {
+    if (typeof block.payload !== "object" || block.payload === null)
+        return sourceRow;
+    const value = block.payload.timestamp;
+    if (typeof value !== "number" || !Number.isFinite(value))
+        return sourceRow;
+    const timestamp = formatSubmittedPromptTime(value);
+    if (timestamp === null || submittedPromptLayout(width, value).timestamp === null)
+        return sourceRow;
+    const rowWidth = displayWidth(sourceRow);
+    const timestampWidth = displayWidth(timestamp);
+    if (rowWidth < timestampWidth)
+        return sourceRow;
+    return overlaySpan(sourceRow, rowWidth - timestampWidth, rowWidth, piTheme().fg("userMessageText", timestamp));
+}
 function layoutPort(render, invalidate, handleInput) {
     return {
         render,

package/dist/integrations/pi/{owned-ui → session-ui}/session-shell.d.ts

@@ -16,7 +16,7 @@ export declare class OwnedUiSessionShell {
     waitUntilStopped(): Promise<void>;
     submit(text: string): Promise<AdapterCommandResult>;
     clearOrExit(now?: number): Promise<AdapterCommandResult>;
-    interrupt(): Promise<AdapterCommandResult>;
+    interrupt(now?: number): Promise<AdapterCommandResult>;
     abort(): Promise<AdapterCommandResult>;
     retry(): Promise<AdapterCommandResult>;
     compact(): Promise<AdapterCommandResult>;