@timurproko/a1 0.1.8-dev.21b95d6 → 0.1.8-dev.224

package/dist/{src/foundation/pi-owned-ui-integration → integrations/pi/session-ui}/session-shell.js

@@ -1,723 +1,14 @@
-import { MOUSE_TRACKING_OFF, MOUSE_TRACKING_ON, parseMouseInput } from "../ui-components/index.js";
-import { PINNED_PI_HIDDEN_COMMAND_NAMES, PINNED_PI_WORKFLOW_COMMAND_NAMES, } from "../pi-engine-adapter/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 "../pi-component-adapter/index.js";
-import { PiTuiRuntimeAdapter, } from "../pi-tui-runtime-adapter/index.js";
-export class OwnedUiSessionShellRoot {
-    editor;
-    header;
-    resources;
-    #cwd;
-    #transcript = new Map();
-    #blocksById = new Map();
-    #renderedRows = new Map();
-    #themeUnsubscribe;
-    #transcriptOrder = [];
-    #view;
-    #status;
-    #footer;
-    #queued;
-    #extensionRenderers;
-    #componentRuntime;
-    #toolsExpanded = false;
-    #thinkingVisible = true;
-    #workflowTranscriptSequence = 0;
-    #workflowStatusAnchors = new Map();
-    #workflowStatusMessages = new Map();
-    #lastWorkflowStatusId;
-    #inputSurface;
-    #extensionHeader = null;
-    #extensionFooter = null;
-    #extensionWidgets = new Map();
-    #extensionStatuses = new Map();
-    #extensionWorkingMessage;
-    #extensionWorkingVisible = true;
-    constructor(view, cwd, handlers, startup = {}, agentDir, extensionRenderers = {
-        getMessageRenderer: () => undefined,
-        getToolDefinition: () => undefined,
-    }) {
-        this.#view = view;
-        this.#cwd = cwd;
-        this.#extensionRenderers = extensionRenderers;
-        this.#componentRuntime = handlers;
-        this.header = createPiShellHeader(startup);
-        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.editor = createPiShellEditor({
-            ...handlers,
-            cwd,
-            ...(agentDir === undefined ? {} : { agentDir }),
-            onToolsExpand: () => this.#setToolsExpanded(!this.#toolsExpanded),
-        });
-        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);
-        // 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());
-    }
-    update(view) {
-        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);
-        this.invalidate();
-    }
-    /**
-     * 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) {
-        this.#blocksById.set(block.id, block);
-        const component = this.#transcript.get(block.id);
-        if (component === undefined) {
-            const created = createPiShellTranscriptComponent(block, this.#cwd, this.#extensionRenderers);
-            created.setExpanded(this.#toolsExpanded);
-            this.#transcript.set(block.id, created);
-            this.#transcriptOrder.push(block.id);
-        }
-        else if (component.revision !== block.revision) {
-            component.update(block);
-        }
-        this.invalidate();
-    }
-    render(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),
-        ];
-    }
-    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) {
-        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;
-        });
-        const diagnostics = this.#view.diagnostics;
-        const startupRows = diagnostics
-            .filter(diagnostic => diagnostic.code === "engine-startup")
-            .flatMap(diagnostic => renderPiShellStartupDiagnostic(diagnostic, width));
-        const packageUpdateRows = 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
-            .filter(diagnostic => diagnostic.code !== "engine-startup" && diagnostic.code !== "package-updates")
-            .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 resourceRows = [...this.resources.render(width)];
-        if (resourceRows.at(-1) === "")
-            resourceRows.pop();
-        return [
-            ...startupRows,
-            ...(this.#extensionHeader ?? this.header).render(width),
-            ...resourceRows,
-            ...transcript,
-            ...packageUpdateRows,
-            ...diagnosticRows,
-        ];
-    }
-    /**
-     * Rows for one transcript block. A finalized block renders once for a given revision
-     * and width and is reused after that, so a frame costs what changed rather than what
-     * the session has accumulated. A live block, and anything the shell drives itself, is
-     * rendered every time because its content is still moving.
-     */
-    #blockRows(id, block, width) {
-        const component = this.#transcript.get(id);
-        if (component === undefined)
-            return [];
-        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 cached.rows;
-        const rows = component.render(width);
-        this.#renderedRows.set(id, { width, revision: block.revision, rows });
-        return rows;
-    }
-    transcriptComponent(id) {
-        return this.#transcript.get(id);
-    }
-    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.invalidate();
-            return;
-        }
-        const id = this.#appendAnchoredWorkflowComponent(width => [
-            "",
-            ...renderPiShellStatusText(this.#workflowStatusMessages.get(id) ?? message, width),
-        ]);
-        this.#workflowStatusMessages.set(id, message);
-        this.#lastWorkflowStatusId = id;
-    }
-    appendWorkflowResult(result) {
-        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.#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.#lastWorkflowStatusId = undefined;
-            const warning = (result.command === "name" && result.message.startsWith("Usage:"))
-                || (result.command === "reload" && result.message.startsWith("Wait for "));
-            const prefix = warning ? "Warning" : "Error";
-            const color = warning ? "warning" : "error";
-            this.#appendAnchoredWorkflowComponent(() => ["", ` ${piTheme().fg(color, `${prefix}: ${result.message}`)}`]);
-            return;
-        }
-        if (result.outcome === "completed" && (result.command === "quit" || result.command === "compact"))
-            return;
-        if (result.command === "new" && result.outcome === "completed") {
-            this.#lastWorkflowStatusId = undefined;
-            this.#appendAnchoredWorkflowComponent(() => ["", ` ${piTheme().fg("accent", result.message)}`]);
-            return;
-        }
-        if (result.command === "name" && result.outcome === "completed") {
-            this.#lastWorkflowStatusId = undefined;
-            this.#appendAnchoredWorkflowComponent(() => [
-                ...(result.detail ? ["", ` ${piTheme().fg("warning", `Warning: ${result.detail}`)}`] : []),
-                "",
-                ` ${piTheme().fg("dim", result.message)}`,
-            ]);
-            return;
-        }
-        if (result.command === "debug" && result.outcome === "completed") {
-            this.#lastWorkflowStatusId = undefined;
-            this.#appendAnchoredWorkflowComponent(() => [
-                "",
-                ` ${piTheme().fg("accent", result.message)}`,
-                ...(result.detail ? [` ${piTheme().fg("muted", result.detail)}`] : []),
-            ]);
-            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.#thinkingVisible = !this.#thinkingVisible;
-        this.invalidate();
-    }
-    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.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.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));
-        // An extension renderer may have drawn transcript blocks that are now unrendered by it.
-        this.#renderedRows.clear();
-        this.invalidate();
-    }
-    addExtensionNotification(message, type) {
-        if (type === "info") {
-            this.appendWorkflowStatus(message);
-            return;
-        }
-        this.#lastWorkflowStatusId = undefined;
-        const prefix = type === "warning" ? "Warning" : "Error";
-        this.#appendAnchoredWorkflowComponent(() => ["", ` ${piTheme().fg(type, `${prefix}: ${message}`)}`]);
-    }
-    extensionFooterData() {
-        return {
-            getGitBranch: () => this.#view.status.footer?.branch ?? null,
-            getExtensionStatuses: () => new Map(this.#extensionStatuses),
-            getAvailableProviderCount: () => this.#view.status.footer?.availableProviderCount ?? 1,
-            onBranchChange: () => () => { },
-        };
-    }
-    setInputSurface(component, disposePrevious = true) {
-        const next = component ?? this.editor;
-        if (next === this.#inputSurface)
-            return;
-        this.#inputSurface.setFocused?.(false);
-        if (disposePrevious && this.#inputSurface !== this.editor)
-            this.#inputSurface.dispose?.();
-        this.#inputSurface = next;
-        this.#inputSurface.setFocused?.(true);
-        this.invalidate();
-    }
-    handleInput(data) {
-        this.#inputSurface.handleInput?.(data);
-    }
-    invalidate() {
-        this.header.invalidate();
-        this.resources.invalidate();
-        for (const component of this.#transcript.values())
-            component.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.#themeUnsubscribe();
-        this.header.dispose?.();
-        this.resources.dispose?.();
-        for (const component of this.#transcript.values())
-            component.dispose?.();
-        this.#transcript.clear();
-        this.#renderedRows.clear();
-        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?.();
-    }
-    #syncTranscript(blocks) {
-        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 = createPiShellTranscriptComponent(block, this.#cwd, this.#extensionRenderers);
-                created.setExpanded(this.#toolsExpanded);
-                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() { },
-            ...(dispose === undefined ? {} : { dispose }),
-        };
-        this.#transcript.set(id, component);
-        this.#workflowStatusAnchors.set(id, this.#view.transcript.length);
-        this.#transcriptOrder.push(id);
-        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.#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);
-        // Expansion changes what a block draws without changing its revision.
-        this.#renderedRows.clear();
-        this.invalidate();
-    }
-}
-function layoutPort(render, invalidate, handleInput) {
-    return {
-        render,
-        invalidate,
-        ...(handleInput === undefined ? {} : { handleInput }),
-    };
-}
-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:");
-}
+import { PRODUCT_TEXT } from "../../../product-identity.js";
+import { MOUSE_TRACKING_OFF, MOUSE_TRACKING_ON, parseMouseInput } 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 { DamageAwareTerminalAdapter, PiTuiRuntimeAdapter, classifyPiTuiInput, } from "../tui-runtime/index.js";
+import { canonicalizeClipboardImage } from "./clipboard-image.js";
+import { STREAM_PRESENTATION_INTERVAL_MS, StreamPresentationCoalescer, } from "./stream-presentation-coalescer.js";
+import { preloadSystemClipboard, readSystemClipboardContent, writeSystemClipboardText, } from "./system-clipboard.js";
+import { OwnedUiSessionShellRoot, shellResourceEntries, } from "./session-shell-root.js";
+export { OwnedUiSessionShellRoot } from "./session-shell-root.js";
+/** Coordinates backend, owned presentation, and Pi TUI lifecycles for one interactive session. */
 export class OwnedUiSessionShell {
     backend;
     root;
@@ -729,14 +20,28 @@ export class OwnedUiSessionShell {
     #stopped;
     #resolveStopped;
     #dialogId;
+    #dialogSource;
     #routeHost;
     #dialogHandle;
     #sequence = 0;
     #started = false;
     #disposed = false;
     #pointerReporting = false;
+    #customViewport;
+    #damageTerminal;
+    #streamPresentation;
+    #removeViewportPreInput;
+    #unsubscribeSettings;
+    #unbindPiSettings;
+    #unbindTerminalSettings;
+    #unbindShutdownSettings;
+    #terminalProgressEnabled = false;
+    #showImages = true;
+    #imageWidthCells = 80;
+    #fullscreenExitOutput = "transcript";
     #compactionQueue = [];
     #lastClearTime = 0;
+    #lastEscapeTime = 0;
     #activeLoginDialog;
     #sessionGeneration;
     constructor(options) {
@@ -744,14 +49,26 @@ export class OwnedUiSessionShell {
         this.#sessionGeneration = this.backend.sessionGeneration;
         this.#cwd = options.cwd;
         this.#routeHost = options.routeHost ?? null;
+        this.#customViewport = options.sessionLayout === "custom-viewport";
+        if (this.#customViewport && options.clipboard === undefined)
+            preloadSystemClipboard();
         this.#stopped = new Promise(resolve => {
             this.#resolveStopped = resolve;
         });
         let runtime;
+        let damageTerminal;
+        let streamPresentation;
+        let pendingClipboardWrite = Promise.resolve();
         this.root = new OwnedUiSessionShellRoot(this.backend.view(), options.cwd, {
             getColumns: () => runtime?.viewport().columns ?? options.terminal?.columns ?? 80,
             getRows: () => runtime?.viewport().rows ?? options.terminal?.rows ?? 24,
-            requestRender: () => runtime?.requestRender(),
+            requestRender: force => runtime?.requestRender(force),
+            onViewportFrame: frame => damageTerminal?.arm(frame.descriptor, {
+                overlayActive: runtime?.hasOverlay() ?? false,
+                selectionActive: this.root.hasActiveSelection(),
+                replacementSurfaceActive: !this.root.usesDefaultInputSurface(),
+            }),
+            enableDockInputReuse: options.inputPresentation?.viewportReuse !== false,
             onSubmit: text => { void this.submit(text); },
             onInterrupt: () => { void this.interrupt(); },
             onClear: () => { void this.clearOrExit(); },
@@ -766,19 +83,187 @@ export class OwnedUiSessionShell {
             onMessageCopy: () => { void this.runWorkflow({ command: "copy", argument: "" }); },
             onFollowUp: () => { void this.queueFollowUp(); },
             onDequeue: () => this.restoreQueuedInput(),
+            onCopyText: text => {
+                runtime?.writeControl(`\u001b]52;c;${Buffer.from(text, "utf8").toString("base64")}\u0007`);
+                const write = options.clipboard === undefined
+                    ? writeSystemClipboardText(text)
+                    : options.clipboard.writeText?.(text) ?? Promise.resolve();
+                pendingClipboardWrite = write.catch(() => { });
+            },
+            readClipboardContent: async () => {
+                await pendingClipboardWrite;
+                if (options.clipboard === undefined)
+                    return readSystemClipboardContent();
+                try {
+                    const image = await options.clipboard.readImage?.();
+                    if (image !== null && image !== undefined) {
+                        const canonical = canonicalizeClipboardImage(image);
+                        if (canonical !== null)
+                            return { kind: "image", ...canonical };
+                    }
+                }
+                catch {
+                    // Compatibility: treat an unavailable or malformed image as text-capable clipboard input.
+                }
+                const text = await options.clipboard.readText();
+                return text === null ? null : { kind: "text", text };
+            },
         }, {
             ...options.startup,
             resources: options.startup?.resources ?? shellResourceEntries(this.backend),
         }, this.backend.agentDir, {
             getMessageRenderer: customType => this.backend.pinnedMessageRenderer(customType),
             getToolDefinition: toolName => this.backend.pinnedToolDefinition(toolName),
+        }, options.sessionLayout, {
+            resolve: assetId => this.backend.resolveTranscriptImage(assetId),
         });
-        const tuiMode = this.backend.disposed ? "regular" : this.backend.pinnedSettingsSnapshot().tuiMode;
-        const runtimeOptions = options.terminal === undefined
-            ? { root: this.root, mode: tuiMode, layoutRoot: this.root.layoutRoot(), hardwareCursor: this.backend.view().terminal.hardwareCursor }
-            : { root: this.root, mode: tuiMode, layoutRoot: this.root.layoutRoot(), terminal: options.terminal, hardwareCursor: this.backend.view().terminal.hardwareCursor };
+        // Invariant: bare A1 owns a bounded viewport and therefore always runs on the alternate
+        // fullscreen surface. The pinned comparison profiles still honor Pi's mode.
+        const tuiMode = this.#customViewport
+            ? "fullscreen"
+            : this.backend.disposed ? "regular" : this.backend.pinnedSettingsSnapshot().tuiMode;
+        const runtimeOptions = {
+            root: this.root,
+            mode: tuiMode,
+            ...(this.#customViewport ? {
+                decorateTerminal: (terminal) => {
+                    damageTerminal = new DamageAwareTerminalAdapter(terminal, {
+                        regionalScroll: process.env.TERM !== "dumb",
+                        onResize: () => streamPresentation?.noteImmediatePresentation(),
+                    });
+                    return damageTerminal;
+                },
+                ...(options.inputPresentation?.coordination === false ? {} : {
+                    inputCoordination: {
+                        classify: (data, focusedOverlay) => classifyPiTuiInput(data, focusedOverlay ?? this.root.inputCoordinationSurface()),
+                        onReceipt: () => streamPresentation?.noteImmediatePresentation(),
+                        ...(options.inputPresentation?.scheduler === undefined
+                            ? {}
+                            : { scheduler: options.inputPresentation.scheduler }),
+                    },
+                }),
+            } : { layoutRoot: this.root.layoutRoot() }),
+            ...(options.inputPresentation?.onEvent === undefined ? {} : {
+                inputDiagnostics: {
+                    onEvent: options.inputPresentation.onEvent,
+                    ...(options.inputPresentation.now === undefined ? {} : { now: options.inputPresentation.now }),
+                },
+            }),
+            ...(options.terminal === undefined ? {} : { terminal: options.terminal }),
+            hardwareCursor: this.backend.view().terminal.hardwareCursor,
+        };
         runtime = new PiTuiRuntimeAdapter(runtimeOptions);
         this.runtime = runtime;
+        this.#damageTerminal = damageTerminal ?? null;
+        const presentationInterval = options.streamPresentation?.intervalMs ?? STREAM_PRESENTATION_INTERVAL_MS;
+        streamPresentation = options.streamPresentation?.scheduler === undefined
+            ? new StreamPresentationCoalescer(() => this.runtime.requestRender(), presentationInterval)
+            : new StreamPresentationCoalescer(() => this.runtime.requestRender(), presentationInterval, options.streamPresentation.scheduler);
+        this.#streamPresentation = streamPresentation;
+        const initialPiSettings = this.backend.pinnedSettingsSnapshot();
+        this.runtime.setHardwareCursor(initialPiSettings.showHardwareCursor);
+        this.runtime.setClearOnShrink(initialPiSettings.clearOnShrink);
+        this.#terminalProgressEnabled = initialPiSettings.showTerminalProgress;
+        this.#fullscreenExitOutput = initialPiSettings.fullscreenExitOutput;
+        this.#unbindShutdownSettings = this.backend.bindSettingsOwner("shutdown", {
+            fullscreenExitOutput: { apply() { } },
+        });
+        this.#unbindTerminalSettings = this.backend.bindSettingsOwner("terminal", {
+            showHardwareCursor: { apply: value => {
+                    if (typeof value !== "boolean")
+                        throw new TypeError("Hardware cursor setting is invalid");
+                    this.runtime.setHardwareCursor(value);
+                } },
+            clearOnShrink: { apply: value => {
+                    if (typeof value !== "boolean")
+                        throw new TypeError("Clear-on-shrink setting is invalid");
+                    this.runtime.setClearOnShrink(value);
+                } },
+            showTerminalProgress: { apply: value => {
+                    if (typeof value !== "boolean")
+                        throw new TypeError("Terminal progress setting is invalid");
+                    this.#terminalProgressEnabled = value;
+                    this.#syncTerminalProgress(this.view());
+                } },
+        });
+        this.#removeViewportPreInput = this.#customViewport
+            ? this.runtime.addPreInputListener(data => {
+                if (options.inputPresentation?.coordination === false)
+                    this.#streamPresentation.noteImmediatePresentation();
+                // Invariant: an overlay or editor-replacement screen owns its entire pointer
+                // surface. Letting the transcript pre-router inspect those reports
+                // steals settings value menus and numeric +/- controls before the
+                // settings app can receive them.
+                if (this.runtime.hasOverlay() || !this.root.usesDefaultInputSurface())
+                    return undefined;
+                const routed = this.root.handleViewportPreInput(data, true);
+                if (routed.copyText !== undefined) {
+                    this.runtime.writeControl(`\u001b]52;c;${Buffer.from(routed.copyText, "utf8").toString("base64")}\u0007`);
+                }
+                if (!routed.consumed)
+                    return routed.data === data ? undefined : { data: routed.data };
+                return routed.data.length === 0 ? { consume: true } : { data: routed.data };
+            })
+            : () => { };
+        const applyViewportSettings = () => {
+            const snapshot = options.viewportSettings?.snapshot();
+            this.root.setViewportConfig(snapshot ?? {
+                scrollbarAppearance: "auto",
+                scrollbarStyle: "thin",
+                scrollbarSpeed: "normal",
+            });
+        };
+        applyViewportSettings();
+        this.#unsubscribeSettings = this.#customViewport && options.viewportSettings
+            ? options.viewportSettings.onChange(settings => this.root.setViewportConfig(settings))
+            : () => { };
+        this.root.setEditorPaddingX(initialPiSettings.editorPaddingX);
+        this.root.setAutocompleteMaxVisible(initialPiSettings.autocompleteMaxVisible);
+        this.root.setOutputPad(initialPiSettings.outputPad);
+        this.root.setHideThinkingBlock(initialPiSettings.hideThinkingBlock);
+        this.root.setMermaidRenderingMode(initialPiSettings.mermaidRenderingMode);
+        this.#showImages = initialPiSettings.showImages;
+        this.#imageWidthCells = initialPiSettings.imageWidthCells;
+        this.root.setImagePresentation(this.#showImages, this.#imageWidthCells);
+        this.#unbindPiSettings = this.backend.bindSettingsOwner("shell", {
+            editorPaddingX: { apply: value => {
+                    if (typeof value !== "number")
+                        throw new TypeError("Editor padding is invalid");
+                    this.root.setEditorPaddingX(value);
+                } },
+            autocompleteMaxVisible: { apply: value => {
+                    if (typeof value !== "number")
+                        throw new TypeError("Autocomplete maximum is invalid");
+                    this.root.setAutocompleteMaxVisible(value);
+                } },
+            outputPad: { apply: value => {
+                    if (value !== 0 && value !== 1)
+                        throw new TypeError("Output padding is invalid");
+                    this.root.setOutputPad(value);
+                } },
+            hideThinkingBlock: { apply: value => {
+                    if (typeof value !== "boolean")
+                        throw new TypeError("Thinking-block visibility is invalid");
+                    this.root.setHideThinkingBlock(value);
+                } },
+            mermaidRenderingMode: { apply: value => {
+                    if (value !== "off" && value !== "final" && value !== "streaming")
+                        throw new TypeError("Mermaid mode is invalid");
+                    this.root.setMermaidRenderingMode(value);
+                } },
+            showImages: { apply: value => {
+                    if (typeof value !== "boolean")
+                        throw new TypeError("Image visibility is invalid");
+                    this.#showImages = value;
+                    this.root.setImagePresentation(this.#showImages, this.#imageWidthCells);
+                } },
+            imageWidthCells: { apply: value => {
+                    if (typeof value !== "number" || !Number.isSafeInteger(value) || value < 1)
+                        throw new TypeError("Image width is invalid");
+                    this.#imageWidthCells = value;
+                    this.root.setImagePresentation(this.#showImages, this.#imageWidthCells);
+                } },
+        });
         this.#extensionBridge = createPiExtensionUiBridge({
             runtime: {
                 getColumns: () => this.runtime.viewport().columns,
@@ -786,7 +271,7 @@ export class OwnedUiSessionShell {
                 requestRender: () => this.runtime.requestRender(),
             },
             agentDir: this.backend.agentDir,
-            setInputSurface: component => this.root.setInputSurface(component),
+            setInputSurface: component => this.root.setInputSurface(component, true, "opaque"),
             showOverlay: (component, overlayOptions) => this.runtime.showOverlay(component, overlayOptions),
             listenInput: handler => this.runtime.addInputListener(handler),
             replaceWidget: (key, component, placement) => this.root.setExtensionWidget(key, component, placement),
@@ -800,7 +285,7 @@ export class OwnedUiSessionShell {
             setEditorText: text => this.root.editor.setText(text),
             pasteToEditor: text => this.root.editor.insertText(text),
             addAutocompleteProvider: factory => this.root.editor.addAutocompleteProvider(factory),
-            setCustomEditor: component => this.root.setInputSurface(component),
+            setCustomEditor: component => this.root.setInputSurface(component, true, "opaque"),
             getFooterData: () => this.root.extensionFooterData(),
             getToolsExpanded: () => this.root.toolsExpanded,
             setToolsExpanded: expanded => this.root.setToolsExpanded(expanded),
@@ -813,12 +298,18 @@ export class OwnedUiSessionShell {
         });
         this.root.editor.setAutocompleteCommands(this.backend.workflowAutocompleteCommands());
         this.#unsubscribe = this.backend.onEvent(event => {
-            // A streamed chunk names one block, and touching only that block is what keeps the
+            // Performance: a streamed chunk names one block, and touching only that block is what keeps the
             // cost of a chunk the same in a long session as in a new one. Everything else
             // resynchronizes the view, which is cheap next to re-reading the transcript.
+            if (event.type === "agent-run-started")
+                this.root.resumeViewportFollowing();
+            if (event.type === "assistant-message-completed")
+                this.root.noteCompletedAssistantMessage();
+            const semanticOnly = event.type === "agent-run-started" || event.type === "assistant-message-completed";
             const view = event.type === "transcript-block" && this.#sessionGeneration === this.backend.sessionGeneration
                 ? this.#syncBlock(event.block)
-                : this.#syncView();
+                : semanticOnly ? this.view() : this.#syncView();
+            this.#syncTerminalProgress(view);
             if (view.lifecycle === "ready" && this.#compactionQueue.length > 0)
                 void this.#flushCompactionQueue();
             if (event.type === "session-lifecycle" && event.lifecycle === "stopped")
@@ -830,11 +321,17 @@ export class OwnedUiSessionShell {
     view() {
         return this.backend.view();
     }
+    damagePresentationDecision() {
+        return this.#damageTerminal?.lastDecision ?? null;
+    }
     start() {
         if (this.#started)
             return;
         this.#started = true;
         this.runtime.start();
+        this.#syncTerminalProgress(this.view());
+        if (this.#customViewport)
+            this.#setPointerReporting(true);
         void this.backend.bindExtensionUi(this.#extensionBridge.context, () => { void this.shutdown(); });
         this.#syncView();
     }
@@ -847,16 +344,18 @@ export class OwnedUiSessionShell {
         return this.#stopped;
     }
     async submit(text) {
-        const input = text.trim();
-        if (!input)
+        const displayInput = text.trim();
+        if (!displayInput)
             return { outcome: "completed", diagnostic: null };
-        if (input.startsWith("/"))
-            return this.#slashCommand(input);
+        if (displayInput.startsWith("/"))
+            return this.#slashCommand(displayInput);
+        const prepared = this.root.preparePromptSubmission(displayInput);
+        const input = prepared.text.trim();
         if (input.startsWith("!")) {
             const excludeFromContext = input.startsWith("!!");
             const command = input.slice(excludeFromContext ? 2 : 1).trim();
             if (command) {
-                this.root.editor.addToHistory(input);
+                this.root.editor.addToHistory(displayInput);
                 try {
                     const result = await this.backend.executeBashWorkflow(command, excludeFromContext);
                     const workflow = {
@@ -878,19 +377,25 @@ export class OwnedUiSessionShell {
             }
         }
         if (this.view().status.workingMessage?.startsWith("Compacting") === true) {
-            this.root.editor.addToHistory(input);
-            this.#compactionQueue.push({ text: input, type: "steer" });
+            this.root.editor.addToHistory(displayInput);
+            this.#compactionQueue.push({
+                text: input,
+                type: "steer",
+                ...(prepared.images.length === 0 ? {} : { images: prepared.images }),
+            });
             this.root.appendWorkflowResult({ command: "compact", outcome: "completed", message: `Queued during compaction: ${input}` });
             this.runtime.requestRender();
             return { outcome: "completed", diagnostic: null };
         }
         const type = this.view().lifecycle === "busy" ? "steer" : "prompt";
-        this.root.editor.addToHistory(input);
+        this.root.editor.addToHistory(displayInput);
+        this.root.resumeViewportFollowing();
         return this.#execute({
             type,
             correlationId: this.#correlation(type),
             sessionId: this.backend.sessionId,
             text: input,
+            ...(prepared.images.length === 0 ? {} : { images: prepared.images }),
         });
     }
     async clearOrExit(now = Date.now()) {
@@ -901,14 +406,29 @@ export class OwnedUiSessionShell {
         this.runtime.requestRender();
         return { outcome: "completed", diagnostic: null };
     }
-    async interrupt() {
+    async interrupt(now = Date.now()) {
         if (this.view().lifecycle === "busy")
             return this.abort();
-        if (this.root.editor.getText().length > 0) {
+        if (this.root.editor.getText().trim().length > 0) {
             this.root.editor.setText("");
             return { outcome: "completed", diagnostic: null };
         }
-        return { outcome: "rejected", diagnostic: "nothing to interrupt" };
+        // Compatibility: match Pi: with an empty editor, two escapes inside 500 ms open the
+        // configured session navigator. The first escape intentionally does not
+        // interrupt or mutate the prompt.
+        const action = this.backend.pinnedSettingsSnapshot().doubleEscapeAction;
+        if (action === "none")
+            return { outcome: "rejected", diagnostic: "nothing to interrupt" };
+        if (now - this.#lastEscapeTime < 500) {
+            this.#lastEscapeTime = 0;
+            if (action === "tree")
+                this.showTreeSelector();
+            else
+                this.showForkSelector();
+            return { outcome: "completed", diagnostic: null };
+        }
+        this.#lastEscapeTime = now;
+        return { outcome: "completed", diagnostic: null };
     }
     async abort() {
         return this.#execute(this.#simple("abort"));
@@ -960,13 +480,20 @@ export class OwnedUiSessionShell {
         return workflowAdapterResult(result);
     }
     async queueFollowUp() {
-        const text = this.root.editor.getText().trim();
-        if (!text)
+        const displayInput = this.root.editor.getText().trim();
+        if (!displayInput)
             return rejected("nothing to queue");
-        this.root.editor.addToHistory(text);
+        const prepared = this.root.preparePromptSubmission(displayInput);
+        const text = prepared.text.trim();
+        this.root.editor.addToHistory(displayInput);
         this.root.editor.setText("");
+        this.root.resumeViewportFollowing();
         if (this.view().status.workingMessage?.startsWith("Compacting") === true) {
-            this.#compactionQueue.push({ text, type: "follow-up" });
+            this.#compactionQueue.push({
+                text,
+                type: "follow-up",
+                ...(prepared.images.length === 0 ? {} : { images: prepared.images }),
+            });
             return { outcome: "completed", diagnostic: null };
         }
         return this.#execute({
@@ -974,6 +501,7 @@ export class OwnedUiSessionShell {
             correlationId: this.#correlation("follow-up"),
             sessionId: this.backend.sessionId,
             text,
+            ...(prepared.images.length === 0 ? {} : { images: prepared.images }),
         });
     }
     restoreQueuedInput() {
@@ -986,6 +514,8 @@ export class OwnedUiSessionShell {
     }
     showSelector(title, options, onSelect, onCancel) {
         this.#dialogHandle?.hide();
+        this.#dialogSource = "local";
+        this.#dialogId = undefined;
         const component = createPiShellSelector({
             title,
             options,
@@ -993,14 +523,21 @@ export class OwnedUiSessionShell {
                 onSelect(id);
                 this.#dialogHandle?.hide();
                 this.#dialogHandle = undefined;
+                this.#dialogSource = undefined;
             },
             onCancel: () => {
                 this.#dialogHandle?.hide();
                 this.#dialogHandle = undefined;
+                this.#dialogSource = undefined;
                 onCancel?.();
             },
         });
-        const handle = this.runtime.showOverlay(component, { width: "70%", maxHeight: "80%", anchor: "center" });
+        const handle = this.runtime.showOverlay(component, {
+            width: "70%",
+            maxHeight: "80%",
+            anchor: "center",
+            inputCoordination: "owned",
+        });
         this.#dialogHandle = handle;
         return handle;
     }
@@ -1200,6 +737,10 @@ export class OwnedUiSessionShell {
                     return;
                 }
                 if (callback === "onTuiModeChange") {
+                    // Invariant: the custom bare-A1 surface is permanently fullscreen; this callback
+                    // remains available only to pinned comparison profiles.
+                    if (this.#customViewport)
+                        return;
                     if (value !== "regular" && value !== "fullscreen")
                         return;
                     if (!this.runtime.switchMode(value)) {
@@ -1207,13 +748,18 @@ export class OwnedUiSessionShell {
                         this.runtime.requestRender();
                         return;
                     }
+                    if (this.#customViewport) {
+                        this.#pointerReporting = false;
+                        this.#setPointerReporting(true);
+                    }
                 }
-                const result = this.backend.applyPinnedSettingValue(callback, value);
-                if (result.outcome === "failed")
-                    this.root.appendWorkflowResult(result);
-                else if (callback === "onTuiModeChange")
-                    this.root.appendWorkflowStatus(`TUI mode: ${value}`);
-                this.runtime.requestRender();
+                void this.backend.applyPinnedSettingValue(callback, value).then(result => {
+                    if (result.outcome === "failed")
+                        this.root.appendWorkflowResult(result);
+                    else if (callback === "onTuiModeChange")
+                        this.root.appendWorkflowStatus(`TUI mode: ${value}`);
+                    this.runtime.requestRender();
+                });
             },
             onCancel: close,
         });
@@ -1412,50 +958,84 @@ export class OwnedUiSessionShell {
             this.root.appendDaxnuts();
         }
     }
-    /**
-     * Turns terminal pointer reporting on for a screen that reads the pointer, and off for
-     * every path that ends it. While it is on the terminal hands A1 the wheel and the
-     * button instead of scrolling and selecting itself, so leaving it on outlives the
-     * screen that wanted it and takes the terminal's own scrolling and selection with it.
-     */
-    #setPointerReporting(enabled) {
-        if (this.#pointerReporting === enabled)
+    // Invariant: pointer reporting is disabled on every path that ends the owning screen.
+    #setPointerReporting(enabled, forceOff = false) {
+        const effective = forceOff ? false : this.#customViewport || enabled;
+        if (this.#pointerReporting === effective)
             return;
-        this.#pointerReporting = enabled;
+        this.#pointerReporting = effective;
         if (!this.runtime.active)
             return;
-        this.runtime.writeControl(enabled ? MOUSE_TRACKING_ON : MOUSE_TRACKING_OFF);
+        this.runtime.writeControl(effective ? MOUSE_TRACKING_ON : MOUSE_TRACKING_OFF);
     }
     async dispose() {
         if (this.#disposed)
             return;
         this.#disposed = true;
-        this.#setPointerReporting(false);
+        this.root.clearViewportPointerState();
+        this.#setPointerReporting(false, true);
+        this.#removeViewportPreInput();
+        this.#streamPresentation.dispose();
+        this.#unsubscribeSettings();
+        const exitMode = this.backend.disposed
+            ? this.#fullscreenExitOutput
+            : this.backend.pinnedSettingsSnapshot().fullscreenExitOutput;
+        const exitTranscript = this.root.exitTranscript(this.runtime.viewport().columns);
+        const resume = this.backend.currentSessionResumeMetadata();
+        const resumeHint = resume === null
+            ? ""
+            : `${dim("To resume this session:")} ${formatSessionResumeCommand(resume)}`;
+        const fullscreenExitText = this.runtime.mode !== "fullscreen"
+            ? ""
+            : exitMode === "resume-hint"
+                ? resumeHint
+                : [exitTranscript, resumeHint].filter(Boolean).join("\n\n");
+        this.#unbindPiSettings();
+        this.#unbindTerminalSettings();
+        this.#unbindShutdownSettings();
         this.#unsubscribe();
         this.#dialogHandle?.hide();
         await this.backend.unbindExtensionUi();
         this.#extensionBridge.dispose();
         await this.runtime.dispose();
+        if (fullscreenExitText.length > 0)
+            this.runtime.writeAfterStop(`${fullscreenExitText}\n`);
     }
-    /**
-     * Applies one transcript block without re-reading the session. The listeners still hear
-     * the view they would have heard, so nothing downstream can tell the difference.
-     */
+    // Invariant: incremental block updates notify listeners with the same complete view contract.
     #syncBlock(block) {
         this.root.applyTranscriptBlock(block);
-        this.runtime.requestRender();
+        if (this.#customViewport && block.status === "live" && isCoalescedStreamBlock(block.kind)) {
+            this.#streamPresentation.request();
+        }
+        else if (this.#streamPresentation.pending) {
+            this.#streamPresentation.flush();
+        }
+        else {
+            this.#streamPresentation.presentImmediate();
+        }
         const view = this.view();
         for (const listener of this.#listeners)
             listener(view);
         return view;
     }
+    #syncTerminalProgress(view) {
+        if (!this.runtime.active)
+            return;
+        this.runtime.setTerminalProgress(this.#terminalProgressEnabled && view.lifecycle === "busy");
+    }
     #syncView() {
+        this.#streamPresentation.noteImmediatePresentation();
         const view = this.view();
         if (this.backend.sessionGeneration !== this.#sessionGeneration) {
             this.#sessionGeneration = this.backend.sessionGeneration;
             this.#activeLoginDialog = undefined;
             this.#extensionBridge.reset();
-            // A replaced session takes its screens with it, pointer reporting included.
+            // Invariant: a replaced session takes its transient viewport and owned-route state with it.
+            this.root.resetViewport();
+            this.#dialogHandle?.hide();
+            this.#dialogHandle = undefined;
+            this.#dialogId = undefined;
+            this.#dialogSource = undefined;
             this.#setPointerReporting(false);
             this.root.setInputSurface(null);
             this.root.resetExtensionUi();
@@ -1475,10 +1055,11 @@ export class OwnedUiSessionShell {
         if (!this.runtime.active)
             return { outcome: "failed", diagnostic: "runtime is not active" };
         this.#dialogHandle?.hide();
-        // Any-event reporting: hover and drag are what the screen is driven by, and
+        this.#dialogSource = "route";
+        // Protocol: any-event reporting: hover and drag are what the screen is driven by, and
         // it also stops the terminal treating a drag as a text selection.
         this.#setPointerReporting(true);
-        // The interrupt chord is global, so it is watched on raw input rather than
+        // Protocol: the interrupt chord is global, so it is watched on raw input rather than
         // through the overlay: the pinned shell handles that key before an overlay
         // ever sees it, which is why an owned screen must not rely on being asked.
         let armedAt = 0;
@@ -1494,17 +1075,36 @@ export class OwnedUiSessionShell {
             }
             armedAt = now;
             this.runtime.requestRender();
-            // The presented screen owns the chord, so the pinned shell never sees a
+            // Invariant: the presented screen owns the chord, so the pinned shell never sees a
             // stray interrupt while it is up.
             return { consume: true };
         });
+        let removeSurfacePreInput = () => { };
         const closeSurface = () => {
+            removeSurfacePreInput();
             removeInterruptWatch();
             this.#setPointerReporting(false);
             this.#dialogHandle?.hide();
             this.#dialogHandle = undefined;
             this.#dialogId = undefined;
+            this.#dialogSource = undefined;
         };
+        // Compatibility: fullscreen Pi owns a fallback text-selection layer before focused overlay
+        // components see pointer input. Route every mouse report to the owned screen
+        // at the pre-input boundary so dropdowns, value hover, and numeric +/- work,
+        // and consume even unhandled reports so settings content is never selected.
+        removeSurfacePreInput = this.runtime.addPreInputListener(data => {
+            const { events, rest } = parseMouseInput(data);
+            if (events.length === 0)
+                return undefined;
+            for (const event of events)
+                surface.handleMouse(event);
+            if (surface.isClosed())
+                closeSurface();
+            else
+                this.runtime.requestRender();
+            return rest.length === 0 ? { consume: true } : { data: rest };
+        });
         const rows = () => Math.max(1, this.runtime.viewport().rows);
         const component = {
             render: (width) => [...surface.render(Math.max(1, width), rows())],
@@ -1527,7 +1127,12 @@ export class OwnedUiSessionShell {
             closeSurface();
             void this.shutdown();
         });
-        this.#dialogHandle = this.runtime.showOverlay(component, { width: "100%", maxHeight: "100%", anchor: "top-left" });
+        this.#dialogHandle = this.runtime.showOverlay(component, {
+            width: "100%",
+            maxHeight: "100%",
+            anchor: "top-left",
+            inputCoordination: "owned",
+        });
         this.#dialogId = surface.id;
         return { outcome: "completed", diagnostic: null };
     }
@@ -1535,25 +1140,40 @@ export class OwnedUiSessionShell {
         if (!this.runtime.active)
             return;
         if (dialog === null) {
+            // Invariant: locally owned routes (notably /settings) are independent of backend
+            // lifecycle/status events and remain open while an agent is working.
+            if (this.#dialogSource !== "backend")
+                return;
             this.#dialogHandle?.hide();
             this.#dialogHandle = undefined;
             this.#dialogId = undefined;
+            this.#dialogSource = undefined;
             return;
         }
-        if (this.#dialogId === dialog.id)
+        if (this.#dialogSource === "backend" && this.#dialogId === dialog.id)
             return;
         this.#dialogHandle?.hide();
+        this.#dialogSource = "backend";
         const component = createPiShellDialog(dialog, {
             onSelect: () => {
                 this.#dialogHandle?.hide();
                 this.#dialogHandle = undefined;
+                this.#dialogId = undefined;
+                this.#dialogSource = undefined;
             },
             onCancel: () => {
                 this.#dialogHandle?.hide();
                 this.#dialogHandle = undefined;
+                this.#dialogId = undefined;
+                this.#dialogSource = undefined;
             },
         });
-        this.#dialogHandle = this.runtime.showOverlay(component, { width: "70%", maxHeight: "80%", anchor: "center" });
+        this.#dialogHandle = this.runtime.showOverlay(component, {
+            width: "70%",
+            maxHeight: "80%",
+            anchor: "center",
+            inputCoordination: "owned",
+        });
         this.#dialogId = dialog.id;
     }
     async #slashCommand(text) {
@@ -1565,8 +1185,9 @@ export class OwnedUiSessionShell {
             return this.#openOwnedRoute(name);
         if (isWorkflowRoute(name))
             return this.runWorkflow({ command: name, argument });
-        // Unknown slash input, prompt templates, skills, and extension commands remain Pi prompt input.
+        // Compatibility: unknown slash input, prompt templates, skills, and extension commands remain Pi prompt input.
         this.root.editor.addToHistory(text);
+        this.root.resumeViewportFollowing();
         return this.#execute({
             type: this.view().lifecycle === "busy" ? "steer" : "prompt",
             correlationId: this.#correlation("prompt-command"),
@@ -1688,6 +1309,7 @@ export class OwnedUiSessionShell {
                 correlationId: this.#correlation(`compaction-${item.type}`),
                 sessionId: this.backend.sessionId,
                 text: item.text,
+                ...(item.images === undefined ? {} : { images: item.images }),
             });
         }
     }
@@ -1702,6 +1324,24 @@ export class OwnedUiSessionShell {
         return `pi-shell-${prefix}-${this.#sequence}`;
     }
 }
+function isCoalescedStreamBlock(kind) {
+    return kind === "assistant" || kind === "thinking" || kind === "tool-call" || kind === "tool-result";
+}
+export function formatSessionResumeCommand(metadata) {
+    const args = [PRODUCT_TEXT.commandName];
+    if (!metadata.usesDefaultSessionDir)
+        args.push("--session-dir", quoteCommandArgument(metadata.sessionDir));
+    args.push("--session", metadata.sessionId);
+    return args.join(" ");
+}
+export function quoteCommandArgument(value) {
+    if (value.length > 0 && !/[^a-zA-Z0-9_\-./~:@]/.test(value))
+        return value;
+    return `'${value.replaceAll("'", `'\\''`)}'`;
+}
+function dim(value) {
+    return `\u001b[2m${value}\u001b[22m`;
+}
 function modelReference(model) {
     if (typeof model !== "object" || model === null)
         return "";