@timurproko/a1 0.1.8-dev.3b54f21 → 0.1.8-dev.407

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

@@ -0,0 +1,1305 @@
+import { acceptsTranscriptUpdate } from "../../../contracts/owned-ui/index.js";
+import { backgroundSgrSpan, caretCell, composeSubmittedPromptRows, PromptInput, promptArrow, displayWidth, faint, 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, 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, isPiPromptStyleCompaction, piShellVisibleWidth, piShellTruncateToWidth, piTheme, renderPiShellCommandMessage, renderPiShellPackageUpdateNotice, renderPiShellStartupDiagnostic, renderPiShellStatusText, renderPiShellTranscriptBlock, } from "../components/index.js";
+import { PiTuiRuntimeAdapter, classifyPiTuiInput, } from "../tui-runtime/index.js";
+import { PromptChipStore } from "./prompt-chips.js";
+import { EditorHyperlinkBudget } from "./editor-hyperlink-budget.js";
+import { SessionViewportController } from "./session-viewport-controller.js";
+import { canPreparePasteInline } from "./paste-text-preparation.js";
+/** Composes backend session state into the owned transcript, viewport, editor, and dock presentation. */
+export class OwnedUiSessionShellRoot {
+    editor;
+    header;
+    resources;
+    #cwd;
+    #transcript = new Map();
+    #blocksById = new Map();
+    #renderedRows = new Map();
+    // Performance: document layouts are shared by wheel, rail, jump, and selection frames.
+    #documentLayouts = new Map();
+    #themeUnsubscribe;
+    #transcriptOrder = [];
+    #view;
+    #status;
+    #footer;
+    #queued;
+    #extensionRenderers;
+    #imageAssets;
+    #promptChips;
+    #editorHyperlinks = new EditorHyperlinkBudget();
+    #pasteFramingId = 0;
+    #customViewport;
+    #submittedPromptComposer;
+    #viewportController;
+    #viewportTheme;
+    #onViewportFrame;
+    #onInputSurfaceChanged;
+    #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;
+    // Invariant: receipt-time eligibility is evidence, never authorization for composition-time reuse.
+    #dockInputRevision;
+    #visibleViewportSnapshot;
+    #fullViewportCompositions = 0;
+    #dockOnlyViewportCompositions = 0;
+    #transcriptBlockRenders = 0;
+    #extensionHeader = null;
+    #extensionFooter = null;
+    #extensionWidgets = new Map();
+    #extensionStatuses = new Map();
+    #extensionWorkingMessage;
+    #extensionWorkingVisible = true;
+    constructor(view, cwd, handlers, startup = {}, agentDir, extensionRenderers = {
+        getMessageRenderer: () => undefined,
+        getToolDefinition: () => undefined,
+    }, sessionLayout = "pinned", imageAssets) {
+        this.#view = view;
+        this.#customViewport = sessionLayout === "custom-viewport";
+        this.#promptChips = new PromptChipStore({ isolated: this.#customViewport,
+            ...(handlers.pasteDiagnostics === undefined ? {} : { onEvent: handlers.pasteDiagnostics }) });
+        this.#submittedPromptComposer = this.#customViewport
+            ? {
+                layout: submittedPromptLayout,
+                compose: (rows, width, source, style) => composeSubmittedPromptRows(rows, width, source, { ...style, prefix: text => promptArrow(text, piTheme()) })
+                    .map(row => nativeHyperlinkStyle(row, nativeTranscriptLinkColor)),
+            }
+            : undefined;
+        this.#cwd = cwd;
+        this.#extensionRenderers = extensionRenderers;
+        this.#imageAssets = imageAssets;
+        this.#componentRuntime = handlers;
+        this.#onViewportFrame = handlers.onViewportFrame;
+        this.#onInputSurfaceChanged = handlers.onInputSurfaceChanged;
+        this.#dockInputReuseEnabled = handlers.enableDockInputReuse ?? true;
+        this.header = createPiShellHeader({
+            ...startup,
+            ...(this.#customViewport ? { getKeybindings: () => this.editor.keybindingConfig() } : {}),
+        });
+        this.resources = createPiShellLoadedResources(startup.resources ?? [], startup.expanded ?? false);
+        this.#status = createPiShellStatus(view, progressStatusText, handlers);
+        this.#footer = createPiShellFooter(this.#viewWithExtensionStatuses(view), cwd, this.#customViewport ? "a1" : "pi");
+        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 => {
+                try {
+                    return this.#promptChips.transformPastedContent(content, this.editor.getText());
+                }
+                catch (error) {
+                    handlers.onPasteRejected?.(error);
+                    return "";
+                }
+            },
+            ...(this.#customViewport ? {
+                beginClipboardPaste: () => this.#promptChips.beginPaste(this.editor.getText(), handlers.captureClipboardPaste?.() ?? { kind: "provided", read: signal => handlers.readClipboardContent?.(signal) ?? Promise.resolve(null) }, error => handlers.onPasteRejected?.(error), () => handlers.requestRender()),
+                onPasteInput: bytes => {
+                    try {
+                        handlers.pasteDiagnostics?.({ request: --this.#pasteFramingId, phase: "framing", bytes, atMs: performance.now(), pending: 0, transport: "terminal" });
+                    }
+                    catch { /* Invariant: payload-free diagnostics cannot interfere with the input path. */ }
+                },
+                deferTextPaste: text => !canPreparePasteInline(text),
+                beginTextPaste: text => this.#promptChips.beginPaste(this.editor.getText(), { kind: "text", text }, error => handlers.onPasteRejected?.(error)),
+            } : {}),
+            editorAtomicRanges: line => this.#promptChips.atomicRanges(line),
+            editorHiddenRanges: line => this.#promptChips.hiddenRanges(line),
+            decorateEditorRow: (row, width, rowIndex) => {
+                if (rowIndex === 0)
+                    this.#editorHyperlinks.reset();
+                const plain = stripAnsi(row);
+                const ranges = this.#promptChips.hyperlinkRanges(plain);
+                if (ranges.length === 0 || !this.#editorHyperlinks.takeCleanup())
+                    return row;
+                const linkResetAndTail = `\u001b]8;;\u001b\\\u001b[24m${" ".repeat(Math.max(0, width - piShellVisibleWidth(row)))}`;
+                // 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//")
+                    : 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.filter(range => this.#editorHyperlinks.take(range.target)).reduce((result, range) => hyperlinkSgrSpan(result, piShellVisibleWidth(plain.slice(0, range.start)), piShellVisibleWidth(plain.slice(0, range.end)), range.target, piShellVisibleWidth), row);
+                // 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}`;
+            },
+            expandCopiedEditorText: text => this.#promptChips.expandCopiedText(text),
+            cwd,
+            ...(agentDir === undefined ? {} : { agentDir }),
+            onToolsExpand: () => this.#setToolsExpanded(!this.#toolsExpanded),
+            ...(this.#customViewport ? {
+                promptPresentation: {
+                    input: new PromptInput({ fg: (token, text) => piTheme().fg(token, text) }, {
+                        measure: piShellVisibleWidth,
+                        truncate: piShellTruncateToWidth,
+                    }),
+                    styleSuggestion: faint,
+                    styleSuggestionCaret: caretCell,
+                },
+            } : {}),
+            onChange: text => {
+                handlers.onEditorChange?.(text);
+                // Concurrency: Pi clears before onSubmit; capture waiting references before pruning removed chips.
+                queueMicrotask(() => this.#promptChips.reconcileDraft(this.editor.getText()));
+            },
+            ...(handlers.onPromptSuggestionAccepted === undefined ? {} : { onPromptSuggestionAccepted: handlers.onPromptSuggestionAccepted }),
+        });
+        this.#viewportController = new SessionViewportController({
+            enabled: this.#customViewport,
+            editor: this.editor,
+            requestRender: force => this.#componentRuntime.requestRender(force),
+            requestHyperlinkCleanup: rows => handlers.requestHyperlinkCleanup?.(rows),
+            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) {
+            if (block.kind === "user")
+                this.editor.addToHistory(block.text);
+        }
+        this.#syncTranscript(view.transcript);
+        // 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();
+    }
+    prepareHistoryText(text) {
+        return this.#promptChips.prepareHistoryText(text);
+    }
+    rehydrateHistoryText(text, resolveImage) {
+        return this.#promptChips.rehydrateHistoryText(text, resolveImage);
+    }
+    imageChipAttachmentsFromEditor(text) {
+        return this.#promptChips.imageChipAttachments(text);
+    }
+    preparePromptSubmission(text) {
+        return this.#promptChips.prepareSubmission(text);
+    }
+    hasPendingPastes(text) { return this.#promptChips.hasPending(text); }
+    waitForPromptPastes(text, signal) {
+        return this.#promptChips.waitForPastes(text, signal, () => this.editor.getText());
+    }
+    resetPendingPastes() {
+        this.editor.cancelPendingPastes?.();
+        this.editor.setText(this.#promptChips.resetPastes(this.editor.getText()));
+    }
+    disposePendingPastes() {
+        this.resetPendingPastes();
+        return this.#promptChips.dispose();
+    }
+    promptSuggestionPrepareBlockReason() {
+        if (!this.usesDefaultInputSurface())
+            return "replacement-input";
+        if (this.#view.dialog !== null || this.#view.overlay !== null)
+            return "modal";
+        if (this.editor.getText().length > 0)
+            return "draft";
+        return null;
+    }
+    canPreparePromptSuggestion() { return this.promptSuggestionPrepareBlockReason() === null; }
+    promptSuggestionPresentationBlockReason() {
+        const reason = this.promptSuggestionPrepareBlockReason();
+        if (reason !== null)
+            return reason;
+        if (this.#view.lifecycle !== "ready")
+            return "not-ready";
+        return this.editor.promptSuggestionBlockReason?.()
+            ?? (this.editor.canPresentPromptSuggestion() ? null : "presentation-unavailable");
+    }
+    canPresentPromptSuggestion() { return this.promptSuggestionPresentationBlockReason() === null; }
+    setPromptSuggestion(text) {
+        this.editor.setPromptSuggestion(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));
+        this.#queued.update(view.editor.queuedSubmissions);
+        this.#syncTranscript(view.transcript);
+        this.editor.setSubmitEnabled(view.lifecycle !== "stopping" && view.lifecycle !== "stopped" && view.lifecycle !== "failed");
+        this.editor.setThinkingLevel(view.thinkingLevel);
+        // Performance: semantic updates already invalidate affected transcript blocks. Chrome is a separate authority.
+        this.#invalidateChrome();
+    }
+    /**
+     * Applies one block: its component is created or updated in place and the order grows
+     * only when the block is new. A streamed chunk costs one component update rather than a
+     * walk of the whole transcript.
+     */
+    applyTranscriptBlock(block) {
+        const current = this.#blocksById.get(block.id);
+        // Invariant: a full-view/final presentation may preempt queued partials. Never revive an older revision.
+        if (current !== undefined && !acceptsTranscriptUpdate(current, block))
+            return;
+        this.#blocksById.set(block.id, block);
+        const component = this.#transcript.get(block.id);
+        if (component === undefined) {
+            const created = this.#mountTranscript(block);
+            this.#transcript.set(block.id, created);
+            this.#transcriptOrder.push(block.id);
+        }
+        else if (component.revision !== block.revision) {
+            component.update(block);
+        }
+        // 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();
+    }
+    #mountTranscript(block) {
+        const created = createPiShellTranscriptComponent(block, this.#cwd, this.#extensionRenderers, this.#submittedPromptComposer, this.#outputPad, !this.#thinkingVisible, this.#mermaidRenderingMode, this.#showImages, this.#imageWidthCells, this.#imageAssets, { ...this.#componentRuntime, changed: () => {
+                if (this.#transcript.get(block.id) !== created)
+                    return;
+                this.#renderedRows.delete(block.id);
+                this.#documentLayouts.clear();
+                this.#visibleViewportSnapshot = undefined;
+                this.#dockInputCandidate = false;
+                this.#dockInputRevision = undefined;
+                this.#componentRuntime.requestRender();
+            } });
+        created.setExpanded(this.#toolsExpanded);
+        return created;
+    }
+    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);
+        // 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;
+        const document = this.#renderDocumentLayout(documentWidth);
+        const steeringRows = this.#renderQueued(width);
+        const statusRows = this.#renderStatus(width);
+        const transientSignature = transientRowsSignature(steeringRows, statusRows);
+        const snapshot = this.#visibleViewportSnapshot;
+        const dockInputCandidate = this.#dockInputCandidate;
+        // Concurrency: input may change after a keyboard receipt but before its paint.
+        // Capture only the live inputs this composition will actually represent.
+        const inputSurface = this.#inputSurface;
+        const dockRows = dock.rows;
+        const selectableDocumentRowCount = document.rows.length;
+        const dockStartRow = height - dockRows.length + 1;
+        const editorOffset = dock.editorOffset;
+        this.#viewportController.setInputSurfaceFrame(this.usesDefaultInputSurface() ? undefined : {
+            component: this.#inputSurface,
+            columnStart: 1,
+            columnEnd: width,
+            rowStart: Math.max(1, dockStartRow + editorOffset),
+            rowEnd: Math.min(height, dockStartRow + editorOffset + dock.inputRows - 1),
+        });
+        this.#viewportController.setEditorPointerFrame(this.usesDefaultInputSurface()
+            ? {
+                rowStart: dockStartRow + editorOffset,
+                rowEnd: dockStartRow + editorOffset + dock.inputRows - 1,
+            }
+            : undefined);
+        const viewportRevision = this.#viewportController.presentationRevision;
+        const selectionRevision = this.#viewportController.selectionRevision;
+        const pointerPosition = this.#viewportController.pointerPosition;
+        this.#dockInputCandidate = false;
+        let frame = dockInputCandidate
+            && snapshot !== undefined
+            && snapshot.width === width
+            && snapshot.height === height
+            && snapshot.documentRows === document.rows
+            && snapshot.transientSignature === transientSignature
+            && snapshot.promptAnchors === document.promptAnchors
+            && snapshot.dockLength === dockRows.length
+            && snapshot.inputSurface === inputSurface
+            && snapshot.viewportRevision === viewportRevision
+            && snapshot.selectionRevision === selectionRevision
+            ? this.#viewportController.composeDockOnly(dockRows, width, height)
+            : null;
+        if (frame === null) {
+            frame = this.#viewportController.compose({
+                // Performance: do not copy the complete document on unchanged dock-only input.
+                // Steering and Working retain their one non-selectable viewport-tail ownership.
+                documentRows: [...document.rows, ...steeringRows, ...statusRows],
+                ...(this.#viewportController.transcriptPointerSelecting
+                    ? { paintDocumentRow: heldNativeHyperlinkStyle }
+                    : {}),
+                // Invariant: selection and copying stop at the real document tail; Steering,
+                // fitting alignment, and live Working remain transient presentation chrome.
+                selectableDocumentRowCount,
+                ...(document.liveTailStartRow === undefined ? {} : { liveTailStartRow: document.liveTailStartRow }),
+                bottomAlignedTailRowCount: statusRows.length,
+                dockRows,
+                promptAnchors: document.promptAnchors,
+                width,
+                height,
+                // Invariant: the control belongs immediately above the complete dock and
+                // floats over transient viewport content rather than consuming a dock 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,
+            documentRows: document.rows,
+            transientSignature,
+            promptAnchors: document.promptAnchors,
+            dockLength: dockRows.length,
+            inputSurface,
+            // Invariant: a callback during composition cannot bless older rows with its
+            // newer revision. Its ordinary pending render will publish the newer state.
+            viewportRevision,
+            selectionRevision: frame.descriptor.selectionRevision,
+            pointerPosition,
+        };
+        this.#onViewportFrame?.(frame);
+        return frame.rows;
+    }
+    viewportFrameDescriptor() {
+        return this.#viewportController.frame?.descriptor ?? null;
+    }
+    /** Read-only, payload-free evidence; observing a pending frame must never render or repair it. */
+    viewportPresentationEvidence() {
+        const frame = this.#viewportController.frame;
+        const snapshot = this.#visibleViewportSnapshot;
+        return {
+            candidate: this.#dockInputCandidate,
+            candidateRevision: this.#dockInputCandidate ? this.#dockInputRevision ?? null : null,
+            currentRevision: this.#viewportController.presentationRevision,
+            composedRevision: snapshot?.viewportRevision ?? null,
+            currentPointer: this.#viewportController.pointerPosition ?? null,
+            composedPointer: snapshot?.pointerPosition ?? null,
+            frameId: frame?.descriptor.frameId ?? null,
+            bottom: frame?.hits.bottom ?? null,
+            followingEnd: frame?.followingEnd ?? true,
+            scrollTop: frame?.scrollTop ?? 0,
+            maxScroll: frame?.maxScroll ?? 0,
+            cause: frame?.descriptor.cause ?? null,
+        };
+    }
+    /** Visible non-selectable Steering, alignment, and Working rows, for rendering evidence. */
+    viewportTransientTailRowCount() {
+        return this.#viewportController.frame?.hits.transientTail.length ?? 0;
+    }
+    hasActiveSelection() {
+        return this.#viewportController.hasSelection || this.editor.hasSelection();
+    }
+    setViewportConfig(config) {
+        if (this.#viewportController.setConfig(config))
+            this.#documentLayouts.clear();
+    }
+    resumeViewportFollowing() {
+        this.#viewportController.resumeFollowing();
+    }
+    noteCompletedAssistantMessage() {
+        this.#viewportController.noteCompletedAssistantMessage();
+    }
+    /** A new session binding owns new mounts even when it reuses semantic invocation ids. */
+    resetTranscript() {
+        for (const component of this.#transcript.values())
+            component.dispose?.();
+        this.#transcript.clear();
+        this.#blocksById.clear();
+        this.#transcriptOrder = [];
+        this.#renderedRows.clear();
+        this.#documentLayouts.clear();
+    }
+    resetViewport() {
+        this.#viewportController.reset();
+    }
+    clearViewportPointerState() {
+        this.#viewportController.clearPointerState();
+    }
+    setViewportOverlaySurfaces(surfaces) {
+        this.#viewportController.setOverlaySurfaces(surfaces);
+    }
+    viewportInputGeometryReady(width, height) {
+        const frame = this.#viewportController.frame;
+        return this.#viewportController.inputGeometryReady && frame?.descriptor.width === width && frame.descriptor.height === height;
+    }
+    handleViewportPreInput(data, allowWheel = true, now = Date.now(), editorActive = this.usesDefaultInputSurface()) {
+        return this.#viewportController.handlePreInput(data, allowWheel, now, editorActive);
+    }
+    #renderDock(width) {
+        return this.#renderDockLayout(width).rows;
+    }
+    #renderDockLayout(width) {
+        const queued = this.#customViewport ? [] : this.#renderQueued(width);
+        const statusRows = this.#customViewport ? this.#status.renderDock(width) : this.#renderStatus(width);
+        const transientRows = [...queued, ...statusRows];
+        const aboveWidgets = this.#renderWidgets("aboveEditor", width);
+        const input = this.#inputSurface.render(width);
+        // Invariant: pointer rows describe the body, not the autocomplete block now preceding it.
+        const body = this.usesDefaultInputSurface() ? this.editor.bodyGeometry?.() : undefined;
+        const belowWidgets = this.#renderWidgets("belowEditor", width);
+        const footer = this.#renderFooter(width);
+        const rowsWithoutTransient = [...aboveWidgets, ...input, ...belowWidgets, ...footer];
+        return {
+            rows: [...transientRows, ...rowsWithoutTransient],
+            editorOffset: transientRows.length + aboveWidgets.length + (body?.rowOffset ?? 0),
+            inputRows: body?.rowCount ?? input.length,
+        };
+    }
+    #renderQueued(width) {
+        return this.#view.editor.queuedSubmissions.length === 0 ? [] : this.#queued.render(width);
+    }
+    layoutRoot() {
+        const document = layoutPort(width => this.#renderDocument(width), () => this.invalidate());
+        const queued = layoutPort(width => this.#view.editor.queuedSubmissions.length === 0 ? [] : this.#queued.render(width), () => this.#queued.invalidate());
+        const aboveWidgets = layoutPort(width => this.#renderWidgets("aboveEditor", width), () => this.#invalidateExtensions());
+        const status = layoutPort(width => this.#renderStatus(width), () => this.#status.invalidate());
+        const editor = layoutPort(width => this.#inputSurface.render(width), () => this.#inputSurface.invalidate(), data => this.#inputSurface.handleInput?.(data));
+        const belowWidgets = layoutPort(width => this.#renderWidgets("belowEditor", width), () => this.#invalidateExtensions());
+        const footer = layoutPort(width => this.#renderFooter(width), () => (this.#extensionFooter ?? this.#footer).invalidate());
+        return {
+            type: "stack",
+            direction: "vertical",
+            children: [
+                {
+                    basis: 0,
+                    grow: 1,
+                    shrink: 1,
+                    minSize: 1,
+                    node: {
+                        type: "scroll",
+                        id: "transcript",
+                        follow: "end",
+                        primary: true,
+                        overscroll: "chain",
+                        scrollbar: "auto",
+                        scrollbarStyle: text => piTheme().bg("scrollbarThumb", text),
+                        child: { type: "component", component: document },
+                    },
+                },
+                {
+                    basis: "auto",
+                    grow: 0,
+                    shrink: 1,
+                    minSize: 1,
+                    node: {
+                        type: "stack",
+                        direction: "vertical",
+                        children: [
+                            { shrink: 1, minSize: 0, node: { type: "component", component: queued } },
+                            { shrink: 1, minSize: 0, node: { type: "component", component: status } },
+                            { shrink: 1, minSize: 0, node: { type: "component", component: aboveWidgets } },
+                            { shrink: 1, minSize: 3, node: { type: "component", component: editor } },
+                            { shrink: 1, minSize: 0, node: { type: "component", component: belowWidgets } },
+                            { shrink: 1, minSize: 1, node: { type: "component", component: footer } },
+                        ],
+                    },
+                },
+            ],
+        };
+    }
+    #renderDocument(width) {
+        return this.#renderDocumentLayout(width).rows;
+    }
+    #renderDocumentLayout(width) {
+        // 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)
+            return cached;
+        const diagnostics = this.#view.diagnostics;
+        const startupRows = diagnostics
+            .filter(diagnostic => diagnostic.code === "engine-startup")
+            .flatMap(diagnostic => renderPiShellStartupDiagnostic(diagnostic, width));
+        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 = [];
+        // Rationale: a block that is still streaming re-renders every row it owns, so the frame
+        // reports where its rows begin. Damage-aware painting uses that to tell a live block's
+        // own reflow apart from a repaint that reaches settled rows.
+        let liveTailStartRow;
+        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 promptLike = block !== undefined
+                && (block.kind === "user" || this.#customViewport && isPiPromptStyleCompaction(block));
+            const blockWidth = this.#customViewport
+                && promptLike
+                && this.#viewportController.config.scrollbarAppearance !== "hidden"
+                && width > 1
+                ? width - 1
+                : width;
+            const blockRows = this.#blockRows(id, block, blockWidth);
+            if (promptLike) {
+                // 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)
+                    rows.push("");
+                else if (index > 0)
+                    rows.push("");
+            }
+            const firstRow = rows.length;
+            if (liveTailStartRow === undefined && block !== undefined && block.status !== "finalized") {
+                liveTailStartRow = firstRow;
+            }
+            rows.push(...blockRows);
+            if (promptLike && blockRows[0] !== undefined) {
+                promptAnchors.push({
+                    id: block.id,
+                    firstRow,
+                    lastRow: Math.max(firstRow, rows.length - 1),
+                    sourceRow: pinnedPromptSourceRow(block, blockRows[0], blockWidth),
+                    prominentSourceRow: blockRows[0],
+                });
+            }
+        }
+        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)));
+        rows.push(...diagnostics
+            .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}`,
+            kind: diagnostic.severity === "error" ? "error" : "system",
+            status: "finalized",
+            revision: diagnostic.sequence,
+            title: diagnostic.code,
+            text: diagnostic.message,
+            payload: {},
+        }, width, this.#cwd)));
+        const layout = { rows: Object.freeze(rows), promptAnchors: Object.freeze(promptAnchors), liveTailStartRow };
+        if (this.#extensionHeader === null) {
+            this.#documentLayouts.set(width, layout);
+            // 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;
+    }
+    // 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;
+            return rows.map(row => nativeHyperlinkStyle(row, nativeTranscriptLinkColor));
+        };
+        if (block === undefined || block.status !== "finalized")
+            return render();
+        let byWidth = this.#renderedRows.get(id);
+        const cached = byWidth?.get(width);
+        const presentationRevision = component.presentationRevision ?? 0;
+        if (cached?.revision === block.revision && cached.presentationRevision === presentationRevision)
+            return cached.rows;
+        const rows = render();
+        if (byWidth === undefined) {
+            byWidth = new Map();
+            this.#renderedRows.set(id, byWidth);
+        }
+        byWidth.set(width, { revision: block.revision, presentationRevision, rows });
+        // 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);
+        return rows;
+    }
+    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" || this.#customViewport && isPiPromptStyleCompaction(block)))
+                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
+            && this.#transcriptOrder.at(-1) === previousId
+            && this.#workflowStatusAnchors.get(previousId) === this.#view.transcript.length) {
+            this.#workflowStatusMessages.set(previousId, message);
+            this.#documentLayouts.clear();
+            this.invalidate();
+            return;
+        }
+        const id = this.#appendAnchoredWorkflowComponent(width => [
+            "",
+            ...renderPiShellStatusText(this.#workflowStatusMessages.get(id) ?? message, width),
+        ]);
+        this.#workflowStatusMessages.set(id, message);
+        this.#lastWorkflowStatusId = id;
+    }
+    appendWorkflowMessage(message) {
+        if (message.kind === "status") {
+            this.appendWorkflowStatus(message.message);
+            return;
+        }
+        this.#lastWorkflowStatusId = undefined;
+        const presentation = { kind: message.kind, message: message.message };
+        this.#appendAnchoredWorkflowComponent(width => renderPiShellCommandMessage(presentation, width, this.#outputPad));
+    }
+    appendWorkflowResult(result) {
+        if (result.messages !== undefined) {
+            for (const message of result.messages)
+                this.appendWorkflowMessage(message);
+            return;
+        }
+        if (result.messageKind === "silent" || (result.outcome === "cancelled" && result.messageKind === undefined))
+            return;
+        if (result.command === "reload" && result.outcome === "completed") {
+            this.appendWorkflowStatus(result.message);
+            return;
+        }
+        if (result.command === "session" && result.outcome === "completed" && result.presentation?.kind === "session-info") {
+            this.#lastWorkflowStatusId = undefined;
+            const sessionInfo = createPiShellSessionInfo(result.presentation);
+            this.#appendAnchoredWorkflowComponent(width => sessionInfo.render(width), () => sessionInfo.dispose?.());
+            return;
+        }
+        if (result.command === "hotkeys" && result.outcome === "completed") {
+            this.#lastWorkflowStatusId = undefined;
+            const hotkeys = createPiShellHotkeys(this.editor.keybindingConfig(), bindings => this.#extensionRenderers.getShortcuts?.(bindings) ?? [], this.#customViewport ? "a1" : "pi");
+            this.#appendAnchoredWorkflowComponent(width => hotkeys.render(width), () => hotkeys.dispose?.());
+            return;
+        }
+        if (result.command === "changelog" && result.outcome === "completed") {
+            this.#lastWorkflowStatusId = undefined;
+            const changelog = createPiShellChangelog(result.detail ?? "No changelog entries found.");
+            this.#appendAnchoredWorkflowComponent(width => changelog.render(width), () => changelog.dispose?.());
+            return;
+        }
+        if (result.outcome === "failed") {
+            this.appendWorkflowMessage({
+                kind: result.messageKind === "warning" ? "warning" : "error",
+                message: result.message,
+            });
+            return;
+        }
+        if (result.outcome === "completed" && (result.command === "quit" || result.command === "compact"))
+            return;
+        if (result.outcome === "completed" && (result.command === "new" || result.command === "name" || result.command === "debug")) {
+            this.#lastWorkflowStatusId = undefined;
+            const presentation = { kind: result.command, message: result.message, ...(result.detail === undefined ? {} : { detail: result.detail }) };
+            this.#appendAnchoredWorkflowComponent(width => renderPiShellCommandMessage(presentation, width, this.#outputPad));
+            return;
+        }
+        if (result.command === "arminsayshi" && result.outcome === "completed") {
+            this.#lastWorkflowStatusId = undefined;
+            const armin = createPiShellArmin(this.#componentRuntime);
+            this.#appendAnchoredWorkflowComponent(width => ["", ...armin.render(width)], () => armin.dispose?.());
+            return;
+        }
+        if (result.command === "dementedelves" && result.outcome === "completed") {
+            this.#lastWorkflowStatusId = undefined;
+            const announcement = createPiShellEarendilAnnouncement();
+            this.#appendAnchoredWorkflowComponent(width => ["", ...announcement.render(width)], () => announcement.dispose?.());
+            return;
+        }
+        const message = result.command === "share" && result.detail
+            ? `${result.message}\nGist: ${result.detail}`
+            : result.message;
+        this.appendWorkflowStatus(message);
+    }
+    appendDaxnuts() {
+        this.#lastWorkflowStatusId = undefined;
+        const daxnuts = createPiShellDaxnuts(this.#componentRuntime);
+        this.#appendAnchoredWorkflowComponent(width => ["", ...daxnuts.render(width)], () => daxnuts.dispose?.());
+    }
+    toggleThinkingVisibility() {
+        this.setHideThinkingBlock(this.#thinkingVisible);
+    }
+    get toolsExpanded() {
+        return this.#toolsExpanded;
+    }
+    setToolsExpanded(expanded) {
+        this.#setToolsExpanded(expanded);
+    }
+    setExtensionWidget(key, component, placement) {
+        const previous = this.#extensionWidgets.get(key)?.component;
+        if (component === null)
+            this.#extensionWidgets.delete(key);
+        else
+            this.#extensionWidgets.set(key, { component, placement });
+        if (previous !== undefined && previous !== component)
+            previous.dispose?.();
+        this.invalidate();
+    }
+    setExtensionHeader(component) {
+        if (this.#extensionHeader !== component)
+            this.#extensionHeader?.dispose?.();
+        this.#extensionHeader = component;
+        this.#documentLayouts.clear();
+        this.invalidate();
+    }
+    setExtensionFooter(component) {
+        if (this.#extensionFooter !== component)
+            this.#extensionFooter?.dispose?.();
+        this.#extensionFooter = component;
+        this.invalidate();
+    }
+    setExtensionStatus(key, text) {
+        if (text === undefined)
+            this.#extensionStatuses.delete(key);
+        else
+            this.#extensionStatuses.set(key, text);
+        this.#footer.update(this.#viewWithExtensionStatuses(this.#view));
+        this.invalidate();
+    }
+    setExtensionWorking(message, visible = this.#extensionWorkingVisible) {
+        this.#extensionWorkingMessage = message;
+        this.#extensionWorkingVisible = visible;
+        this.#status.setWorkingOverride(visible ? message : undefined);
+        this.invalidate();
+    }
+    resetWorkflowPresentation() {
+        for (const id of this.#workflowStatusAnchors.keys()) {
+            this.#transcript.get(id)?.dispose?.();
+            this.#transcript.delete(id);
+        }
+        this.#workflowStatusAnchors.clear();
+        this.#workflowStatusMessages.clear();
+        this.#transcriptOrder = this.#transcriptOrder.filter(id => !id.startsWith("workflow-status-"));
+        this.#lastWorkflowStatusId = undefined;
+        this.#documentLayouts.clear();
+        this.invalidate();
+    }
+    resetExtensionUi() {
+        this.#extensionHeader?.dispose?.();
+        this.#extensionFooter?.dispose?.();
+        for (const { component } of this.#extensionWidgets.values())
+            component.dispose?.();
+        this.#extensionHeader = null;
+        this.#extensionFooter = null;
+        this.#extensionWidgets.clear();
+        this.#extensionStatuses.clear();
+        this.#extensionWorkingMessage = undefined;
+        this.#status.setWorkingOverride(undefined);
+        this.#footer.update(this.#viewWithExtensionStatuses(this.#view));
+        // Invariant: 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) {
+        if (type === "info") {
+            this.appendWorkflowStatus(message);
+            return;
+        }
+        this.appendWorkflowMessage({ kind: type, message });
+    }
+    extensionFooterData() {
+        return {
+            getGitBranch: () => this.#view.status.footer?.branch ?? null,
+            getExtensionStatuses: () => new Map(this.#extensionStatuses),
+            getAvailableProviderCount: () => this.#view.status.footer?.availableProviderCount ?? 1,
+            onBranchChange: () => () => { },
+        };
+    }
+    usesDefaultInputSurface() {
+        return this.#inputSurface === this.editor;
+    }
+    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;
+        const nextCoordination = next === this.editor ? "editor" : coordination;
+        if (next === this.#inputSurface) {
+            this.#inputSurfaceCoordination = nextCoordination;
+            return;
+        }
+        this.#dockInputCandidate = false;
+        this.#viewportController.invalidateInputSurface();
+        this.#inputSurface.setFocused?.(false);
+        if (disposePrevious && this.#inputSurface !== this.editor)
+            this.#inputSurface.dispose?.();
+        this.#inputSurface = next;
+        this.#inputSurfaceCoordination = nextCoordination;
+        this.#onInputSurfaceChanged?.();
+        this.#inputSurface.setFocused?.(true);
+        this.invalidate();
+    }
+    handleInput(data) {
+        this.#dockInputCandidate = this.#customViewport && this.#dockInputReuseEnabled
+            && classifyPiTuiInput(data, this.#inputSurfaceCoordination) === "safe";
+        this.#dockInputRevision = this.#dockInputCandidate ? this.#viewportController.presentationRevision : undefined;
+        try {
+            this.#inputSurface.handleInput?.(data);
+        }
+        catch (error) {
+            this.#dockInputCandidate = false;
+            throw error;
+        }
+    }
+    invalidate() {
+        this.#renderedRows.clear();
+        this.#documentLayouts.clear();
+        for (const component of this.#transcript.values())
+            component.invalidate();
+        this.#invalidateChrome();
+    }
+    #invalidateChrome() {
+        this.header.invalidate();
+        this.resources.invalidate();
+        this.editor.invalidate();
+        if (this.#inputSurface !== this.editor)
+            this.#inputSurface.invalidate();
+        this.#invalidateExtensions();
+        this.#status.invalidate();
+        this.#footer.invalidate();
+        this.#queued.invalidate();
+    }
+    setFocused(focused) {
+        this.#inputSurface.setFocused?.(focused);
+    }
+    dispose() {
+        this.clearViewportPointerState();
+        this.#themeUnsubscribe();
+        this.header.dispose?.();
+        this.resources.dispose?.();
+        for (const component of this.#transcript.values())
+            component.dispose?.();
+        this.#transcript.clear();
+        this.#renderedRows.clear();
+        this.#documentLayouts.clear();
+        this.#visibleViewportSnapshot = undefined;
+        this.#dockInputCandidate = false;
+        this.#dockInputRevision = undefined;
+        if (this.#inputSurface !== this.editor)
+            this.#inputSurface.dispose?.();
+        this.#extensionHeader?.dispose?.();
+        this.#extensionFooter?.dispose?.();
+        for (const { component } of this.#extensionWidgets.values())
+            component.dispose?.();
+        this.#extensionWidgets.clear();
+        this.editor.dispose?.();
+        this.#status.dispose?.();
+        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) => {
+            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);
+        const nextIds = new Set(blocks.map(block => block.id));
+        for (const [id, component] of this.#transcript) {
+            if (id.startsWith("workflow-status-") || nextIds.has(id))
+                continue;
+            component.dispose?.();
+            this.#transcript.delete(id);
+            this.#renderedRows.delete(id);
+        }
+        for (const block of blocks) {
+            const component = this.#transcript.get(block.id);
+            if (component === undefined) {
+                const created = this.#mountTranscript(block);
+                this.#transcript.set(block.id, created);
+            }
+            else if (component.revision !== block.revision) {
+                component.update(block);
+            }
+        }
+        const statusIds = [...this.#workflowStatusAnchors.keys()];
+        const order = [];
+        for (let index = 0; index <= blocks.length; index += 1) {
+            for (const statusId of statusIds) {
+                if (this.#workflowStatusAnchors.get(statusId) === index)
+                    order.push(statusId);
+            }
+            const block = blocks[index];
+            if (block !== undefined)
+                order.push(block.id);
+        }
+        const placed = new Set(order);
+        for (const statusId of statusIds) {
+            if (!placed.has(statusId))
+                order.push(statusId);
+        }
+        this.#transcriptOrder = order;
+    }
+    #appendAnchoredWorkflowComponent(render, dispose) {
+        this.#workflowTranscriptSequence += 1;
+        const id = `workflow-status-${this.#workflowTranscriptSequence}`;
+        const component = {
+            id,
+            revision: 1,
+            render,
+            handleInput() { },
+            invalidate() { },
+            update() { },
+            setExpanded() { },
+            setOutputPad() { },
+            setHideThinkingBlock() { },
+            setMermaidRenderingMode() { },
+            setImagePresentation() { },
+            ...(dispose === undefined ? {} : { dispose }),
+        };
+        this.#transcript.set(id, component);
+        this.#workflowStatusAnchors.set(id, this.#view.transcript.length);
+        this.#transcriptOrder.push(id);
+        this.#documentLayouts.clear();
+        this.invalidate();
+        return id;
+    }
+    #renderWidgets(placement, width) {
+        const rows = [...this.#extensionWidgets.values()]
+            .filter(widget => widget.placement === placement)
+            .flatMap(widget => widget.component.render(width));
+        return placement === "aboveEditor" ? ["", ...rows] : rows;
+    }
+    #renderStatus(width) {
+        return this.#customViewport ? this.#status.renderLive(width) : this.#status.render(width);
+    }
+    #renderFooter(width) {
+        return (this.#extensionFooter ?? this.#footer).render(width);
+    }
+    #viewWithExtensionStatuses(view) {
+        const footer = view.status.footer;
+        const statuses = new Map(footer?.extensionStatuses ?? []);
+        for (const [key, text] of this.#extensionStatuses)
+            statuses.set(key, text);
+        return {
+            ...view,
+            status: {
+                ...view.status,
+                footer: {
+                    branch: footer?.branch ?? null,
+                    sessionName: footer?.sessionName ?? null,
+                    availableProviderCount: footer?.availableProviderCount ?? 1,
+                    extensionStatuses: [...statuses],
+                },
+            },
+        };
+    }
+    #invalidateExtensions() {
+        this.#extensionHeader?.invalidate();
+        this.#extensionFooter?.invalidate();
+        for (const { component } of this.#extensionWidgets.values())
+            component.invalidate();
+    }
+    #setToolsExpanded(expanded) {
+        this.#toolsExpanded = expanded;
+        this.header.setExpanded(expanded);
+        this.resources.setExpanded(expanded);
+        for (const component of this.#transcript.values())
+            component.setExpanded(expanded);
+        // 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) {
+    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, "");
+}
+/** Preserve the established prompt foreground for quiet and hovered pinned timestamps. */
+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,
+        invalidate,
+        ...(handleInput === undefined ? {} : { handleInput }),
+    };
+}
+export function shellResourceEntries(backend) {
+    const resources = backend.nonVisualResources().map(resource => ({
+        section: resource.kind === "skill"
+            ? "Skills"
+            : resource.kind === "prompt-template"
+                ? "Prompts"
+                : resource.kind === "theme"
+                    ? "Themes"
+                    : "Context",
+        label: resource.kind === "prompt-template"
+            ? `/${resource.label}`
+            : resource.kind === "agent-context" || resource.kind === "system-prompt"
+                ? compactResourceLabel(resource.sourcePath ?? resource.label)
+                : resource.label,
+        sourcePath: resource.sourcePath,
+        diagnostic: resource.diagnostic,
+    }));
+    const extensions = backend.extensionResources().filter(extension => !extension.hidden);
+    const loadedExtensions = extensions.filter(extension => extension.diagnostic === null);
+    const extensionLabels = compactExtensionLabels(loadedExtensions);
+    for (const extension of extensions) {
+        const labelIndex = loadedExtensions.indexOf(extension);
+        resources.push({
+            section: "Extensions",
+            label: extensionLabels[labelIndex] ?? compactResourceLabel(extension.sourcePath ?? extension.resolvedPath ?? "extension"),
+            sourcePath: extension.sourcePath ?? extension.resolvedPath,
+            diagnostic: extension.diagnostic,
+        });
+    }
+    return resources;
+}
+function compactResourceLabel(path) {
+    const segments = compactPathSegments(path);
+    const leaf = segments.at(-1) ?? path;
+    if ((leaf === "index.ts" || leaf === "index.js") && segments.length > 1)
+        return segments.at(-2) ?? leaf;
+    return leaf;
+}
+/**
+ * Pinned from InteractiveMode's compact extension-label helpers at Pi commit
+ * 914cf1472e715297caa30db4b9535d534a9eb718. The source metadata crosses an
+ * A1-owned boundary first; the owned shell never inspects Pi's private root.
+ */
+function compactExtensionLabels(extensions) {
+    const localExtensions = extensions
+        .filter(extension => !isPackageExtensionSource(extension.sourceInfo))
+        .map(extension => {
+        const path = extension.sourcePath ?? extension.resolvedPath ?? "extension";
+        const segments = compactPathSegments(path);
+        if (segments.length > 1 && (segments.at(-1) === "index.ts" || segments.at(-1) === "index.js"))
+            segments.pop();
+        return { extension, segments };
+    });
+    return extensions.map(extension => {
+        const resourcePath = extension.sourcePath ?? extension.resolvedPath ?? "extension";
+        if (isPackageExtensionSource(extension.sourceInfo)) {
+            return compactPackageExtensionLabel(resourcePath, extension.sourceInfo);
+        }
+        const localIndex = localExtensions.findIndex(item => item.extension === extension);
+        const segments = localExtensions[localIndex]?.segments;
+        if (!segments || segments.length === 0)
+            return compactResourceLabel(resourcePath);
+        for (let count = 1; count <= segments.length; count += 1) {
+            const candidate = segments.slice(-count).join("/");
+            if (localExtensions.every((item, itemIndex) => itemIndex === localIndex || item.segments.slice(-count).join("/") !== candidate)) {
+                return candidate;
+            }
+        }
+        return segments.join("/");
+    });
+}
+function compactPackageExtensionLabel(resourcePath, sourceInfo) {
+    const sourceLabel = compactPackageSourceLabel(sourceInfo.source);
+    if (!sourceLabel)
+        return compactResourceLabel(resourcePath);
+    const shortPath = shortPackagePath(resourcePath, sourceInfo).replaceAll("\\", "/");
+    const packagePath = shortPath.startsWith("extensions/") ? shortPath.slice("extensions/".length) : shortPath;
+    const slash = packagePath.lastIndexOf("/");
+    const fileName = slash < 0 ? packagePath : packagePath.slice(slash + 1);
+    const directory = slash < 0 ? "" : packagePath.slice(0, slash);
+    const extension = fileName.lastIndexOf(".");
+    const name = extension <= 0 ? fileName : fileName.slice(0, extension);
+    if (name === "index")
+        return !directory || directory === "." ? sourceLabel : `${sourceLabel}:${directory}`;
+    return `${sourceLabel}:${packagePath}`;
+}
+function compactPackageSourceLabel(source) {
+    if (source.startsWith("npm:"))
+        return source.slice("npm:".length) || source;
+    if (!source.startsWith("git:"))
+        return source;
+    const gitSource = source.slice("git:".length).trim();
+    let repositoryPath;
+    const scpLike = gitSource.match(/^git@[^:]+:(.+)$/);
+    if (scpLike?.[1]) {
+        repositoryPath = scpLike[1];
+    }
+    else if (/^[a-z]+:\/\//i.test(gitSource)) {
+        try {
+            repositoryPath = new URL(gitSource).pathname.replace(/^\/+/, "");
+        }
+        catch {
+            return source;
+        }
+    }
+    else {
+        const slash = gitSource.indexOf("/");
+        if (slash >= 0)
+            repositoryPath = gitSource.slice(slash + 1);
+    }
+    if (!repositoryPath)
+        return source;
+    const ref = repositoryPath.indexOf("@");
+    const withoutRef = ref < 0 ? repositoryPath : repositoryPath.slice(0, ref);
+    return withoutRef.replace(/\.git$/, "") || source;
+}
+function shortPackagePath(resourcePath, sourceInfo) {
+    const fullPath = normalizeResourcePath(resourcePath);
+    const baseDir = sourceInfo.baseDir === null ? undefined : normalizeResourcePath(sourceInfo.baseDir).replace(/\/$/, "");
+    if (baseDir) {
+        const npmRoot = baseDir.match(/^(.*\/node_modules)\/(@?[^/]+(?:\/[^/]+)?)$/);
+        if (npmRoot?.[1] && fullPath.startsWith(`${npmRoot[1]}/`))
+            return relativeResourcePath(baseDir, fullPath);
+        if (fullPath === baseDir)
+            return ".";
+        if (fullPath.startsWith(`${baseDir}/`))
+            return fullPath.slice(baseDir.length + 1);
+    }
+    const npmMatch = fullPath.match(/node_modules\/(@?[^/]+(?:\/[^/]+)?)\/(.*)/);
+    if (npmMatch?.[2] && sourceInfo.source.startsWith("npm:"))
+        return npmMatch[2];
+    const gitMatch = fullPath.match(/git\/[^/]+\/[^/]+\/(.*)/);
+    if (gitMatch?.[1] && sourceInfo.source.startsWith("git:"))
+        return gitMatch[1];
+    return resourcePath;
+}
+function relativeResourcePath(from, to) {
+    const fromSegments = from.split("/").filter(Boolean);
+    const toSegments = to.split("/").filter(Boolean);
+    let common = 0;
+    while (common < fromSegments.length && common < toSegments.length
+        && fromSegments[common]?.toLowerCase() === toSegments[common]?.toLowerCase())
+        common += 1;
+    return [...fromSegments.slice(common).map(() => ".."), ...toSegments.slice(common)].join("/") || ".";
+}
+function compactPathSegments(path) {
+    return normalizeResourcePath(path).split("/").filter(segment => segment.length > 0 && segment !== "~");
+}
+function normalizeResourcePath(path) {
+    return path.replaceAll("\\", "/");
+}
+function isPackageExtensionSource(sourceInfo) {
+    const source = sourceInfo?.source ?? "";
+    return source.startsWith("npm:") || source.startsWith("git:");
+}
+function transientRowsSignature(steeringRows, statusRows) {
+    return `${steeringRows.length}\u0000${steeringRows.join("\u0000")}\u0001${statusRows.length}\u0000${statusRows.join("\u0000")}`;
+}