@code-yeongyu/senpi 2026.8.18 → 2026.8.20-2

package/dist/modes/interactive/interactive-mode.js

@@ -2,7 +2,6 @@
  * Interactive mode for the coding agent.
  * Handles TUI rendering and user interaction, delegating business logic to AgentSession.
  */
-import * as crypto from "node:crypto";
 import * as fs from "node:fs";
 import * as os from "node:os";
 import * as path from "node:path";
@@ -36,8 +35,9 @@ import { getUsageCostBreakdown } from "../../core/usage-totals.js";
 import { consumeEarlyInspectorVmImportRecoveries, INSPECTOR_VM_IMPORT_WARNING, isRecoverableInspectorVmImportError, } from "../../inspector-policy.js";
 import { getChangelogPath, getNewEntries, normalizeChangelogLinks, parseChangelog } from "../../utils/changelog.js";
 import { copyToClipboard, readClipboardText } from "../../utils/clipboard.js";
-import { extensionForImageMimeType, readClipboardImage } from "../../utils/clipboard-image.js";
+import { readClipboardImage } from "../../utils/clipboard-image.js";
 import { parseGitUrl } from "../../utils/git.js";
+import { processImage } from "../../utils/image-process.js";
 import { openBrowser } from "../../utils/open-browser.js";
 import { getCwdRelativePath } from "../../utils/paths.js";
 import { getPiUserAgent } from "../../utils/pi-user-agent.js";
@@ -70,6 +70,7 @@ import { createMermaidMarkdownTransformer } from "./components/mermaid.js";
 import { getModelFullId, mergeFavoritePatternsForPersist, } from "./components/model-favorites.js";
 import { ModelSelectorComponent } from "./components/model-selector.js";
 import { formatAuthSelectorProviderType, OAuthSelectorComponent, } from "./components/oauth-selector.js";
+import { DEFAULT_TAIL_BUDGET, DEFAULT_WARM_CHUNK_SIZE, ProgressiveTranscriptContainer, } from "./components/progressive-transcript-container.js";
 import { ScopedModelsSelectorComponent } from "./components/scoped-models-selector.js";
 import { SessionSelectorComponent } from "./components/session-selector.js";
 import { SettingsSelectorComponent } from "./components/settings-selector.js";
@@ -90,6 +91,7 @@ import { applyKeybindingsFileEdit, seedKeybindingsFile } from "./keybindings-com
 import { refreshModelCatalogs } from "./model-catalog-refresh.js";
 import { getModelSearchText } from "./model-search.js";
 import { isRiskyMainModel, RISKY_MAIN_MODEL_WARNING } from "./risky-main-model-warning.js";
+import { splitTrailingAssistantContent } from "./split-trailing-assistant-text.js";
 import { DEFAULT_SMOOTH_FPS, StreamingRevealController } from "./streaming-reveal.js";
 import { getAvailableThemes, getAvailableThemesWithPaths, getEditorTheme, getMarkdownTheme, getThemeByName, onThemeChange, setRegisteredThemes, stopThemeWatcher, Theme, theme, } from "./theme/theme.js";
 import { InteractiveThemeController } from "./theme/theme-controller.js";
@@ -104,6 +106,11 @@ import { ToolArgsRevealController } from "./tool-args-reveal.js";
 import { readToolProgress } from "./tool-progress.js";
 import { ToolResultRevealController } from "./tool-result-reveal.js";
 import { blendWorkingStatusShimmerRgbColor, formatActiveToolWorkingLabel, formatToolHookStatusMessageFrame, formatWorkingStatusMessageFrame, largeSessionWorkingStatusInterval, sanitizeWorkingStatusPlainText, } from "./working-status.js";
+function llamaCppPostLoginGuidance(actionLabel, loadedModelCount) {
+    return loadedModelCount === 0
+        ? `${actionLabel}. No llama.cpp models are loaded. Use /llama to load a model, then /model to select it.`
+        : `${actionLabel}. Use /model to select a loaded llama.cpp model, or /llama to manage models.`;
+}
 function isExpandable(obj) {
     return typeof obj === "object" && obj !== null && "setExpanded" in obj && typeof obj.setExpanded === "function";
 }
@@ -133,17 +140,38 @@ function formatToolHookTerminalTitle(event) {
 function isCustomSessionEntry(item) {
     return "type" in item && item.type === "custom";
 }
+function isCompactionCostNotice(item) {
+    return "type" in item && item.type === "compaction_cost";
+}
 const DEAD_TERMINAL_ERROR_CODES = new Set(["EIO", "EPIPE", "ENOTCONN"]);
+const DEFAULT_RETRY_STATUS_REFRESH_INTERVAL_MS = 80;
+const LARGE_SESSION_RETRY_STATUS_REFRESH_INTERVAL_MS = 60_000;
 const DEFAULT_WORKING_STATUS_REFRESH_INTERVAL_MS = 600;
 const DEFAULT_WORKING_STATUS_MESSAGE_ANIMATION_INTERVAL_MS = 32;
 const LARGE_SESSION_WORKING_STATUS_REFRESH_INTERVAL_MS = 60_000;
 const LARGE_SESSION_WORKING_STATUS_MESSAGE_INTERVAL_MS = 1_000;
 const FALLBACK_STATUS_KEY = "fallback";
 const RGB_FOREGROUND_PATTERN = /\x1b\[38;2;(\d+);(\d+);(\d+)m/;
-const DARK_DEFAULT_WORKING_TEXT_RGB = { r: 229, g: 229, b: 231 };
-const LIGHT_DEFAULT_WORKING_TEXT_RGB = { r: 17, g: 17, b: 17 };
-const DARK_DEFAULT_WORKING_BASE_RGB = { r: 102, g: 102, b: 102 };
-const LIGHT_DEFAULT_WORKING_BASE_RGB = { r: 118, g: 118, b: 118 };
+const DARK_DEFAULT_WORKING_TEXT_RGB = {
+    r: 229,
+    g: 229,
+    b: 231,
+};
+const LIGHT_DEFAULT_WORKING_TEXT_RGB = {
+    r: 17,
+    g: 17,
+    b: 17,
+};
+const DARK_DEFAULT_WORKING_BASE_RGB = {
+    r: 102,
+    g: 102,
+    b: 102,
+};
+const LIGHT_DEFAULT_WORKING_BASE_RGB = {
+    r: 118,
+    g: 118,
+    b: 118,
+};
 function parseAnsiRgbForeground(ansi) {
     const match = RGB_FOREGROUND_PATTERN.exec(ansi);
     const red = match?.[1];
@@ -258,6 +286,63 @@ function formatLoginProviderCompletionDescription(provider) {
     const authTypes = provider.authTypes.map(formatAuthSelectorProviderType).join("/");
     return provider.name === provider.id ? authTypes : `${provider.name} · ${authTypes}`;
 }
+/** Local copy of pi-tui's image-marker pattern so submission scanning never mutates a shared /g regex. */
+const IMAGE_MARKER_PATTERN = /\[Image #([1-9]\d*)\]/g;
+/**
+ * Attach a clipboard bitmap as an in-memory image behind an atomic
+ * `[Image #N]` marker. Returns false when nothing was attached, so the caller
+ * falls through to the plain-text clipboard path.
+ *
+ * The bytes deliberately never touch the filesystem: writing a temp file and
+ * inserting its path as literal text (the previous behavior) shipped an
+ * unreadable `/var/folders/.../pi-clipboard-<uuid>.png` string to the model and
+ * attached no image at all.
+ */
+async function attachClipboardImage(deps, image) {
+    if (deps.settings.getBlockImages()) {
+        // Pinned behavior: nothing is attached and nothing is inserted, but the
+        // paste is never a silent no-op - the user must learn why their screenshot
+        // vanished, and which setting to flip.
+        deps.showStatus("Image paste blocked by the images.blockImages setting");
+        return false;
+    }
+    if (!deps.editor.insertImageMarker) {
+        // A marker-unaware editor cannot keep the marker atomic, and a dead literal
+        // `[Image #N]` with a live payload behind it would misnumber every other
+        // attachment at submit.
+        deps.showStatus("Image paste is not supported by the active editor");
+        return false;
+    }
+    if (deps.isCompacting()) {
+        // The compaction queue carries text only; an attachment queued behind
+        // compaction would be silently lost at delivery, so drop it here with a
+        // visible status. Consume the paste (true) - the clipboard holds a
+        // bitmap, so the plain-text fallback has nothing useful to insert.
+        deps.showStatus("Image paste dropped: messages sent during compaction cannot carry images - paste again after compaction finishes");
+        return true;
+    }
+    const processed = await processImage(image.bytes, image.mimeType, {
+        autoResizeImages: deps.settings.getImageAutoResize(),
+    });
+    if (!processed.ok) {
+        deps.showStatus(processed.message);
+        return false;
+    }
+    // insertImageMarker fires onImageMarkersChanged (with the pre-renumber
+    // ids) synchronously and only then returns the marker's FINAL canonical id,
+    // whose slot the reconcile pass just vacated - so this write can neither
+    // land in an orphaned map (reconcile mutates pendingImages in place) nor
+    // overwrite a surviving payload (the new marker had no payload when the
+    // reconcile ran, so nothing was keyed onto its slot).
+    const id = deps.editor.insertImageMarker();
+    deps.pendingImages.set(id, {
+        type: "image",
+        data: processed.data,
+        mimeType: processed.mimeType,
+    });
+    deps.requestRender();
+    return true;
+}
 /** Composition root for selecting the interactive terminal renderer. */
 export function createInteractiveTui(options) {
     const terminal = options.terminal ?? new ProcessTerminal({ onExternalStdoutWrite: appendHiddenTuiStdout });
@@ -348,6 +433,14 @@ export class InteractiveMode {
         this.autocompleteProviderWrappers = [];
         this.isInitialized = false;
         this.pendingUserInputs = [];
+        /**
+         * Clipboard images pasted into the composer, keyed by their visible
+         * `[Image #N]` marker number. The editor stores marker ids only, so these
+         * bytes must live here (and survive an editor swap, which discards the
+         * editor instance). Kept aligned with the displayed numbers by
+         * {@link reconcilePendingImages}.
+         */
+        this.pendingImages = new Map();
         this.activeStatusIndicator = undefined;
         this.idleStatus = new IdleStatus();
         this.workingMessage = undefined;
@@ -375,6 +468,7 @@ export class InteractiveMode {
         this.managedToolStatusStarted = false;
         // Streaming message tracking
         this.streamingComponent = undefined;
+        this.trailingAssistantComponent = undefined;
         this.streamingMessage = undefined;
         // Tool execution tracking: toolCallId -> component
         this.pendingTools = new Map();
@@ -471,7 +565,14 @@ export class InteractiveMode {
         this.ui.setClearOnShrink(this.settingsManager.getClearOnShrink());
         this.headerContainer = new Container();
         this.loadedResourcesContainer = new Container();
-        this.chatContainer = new Container();
+        // Resuming a long session paints a bounded, fully-styled tail first and warms
+        // the earlier history in background chunks, so /resume is not blocked on
+        // Markdown-rendering every persisted message before the first frame.
+        this.chatContainer = new ProgressiveTranscriptContainer({
+            tailBudget: DEFAULT_TAIL_BUDGET,
+            warmChunkSize: DEFAULT_WARM_CHUNK_SIZE,
+            requestRender: () => this.ui.requestRender(),
+        });
         this.documentContainer = new Container();
         this.documentContainer.addChild(this.headerContainer);
         this.documentContainer.addChild(this.loadedResourcesContainer);
@@ -707,7 +808,11 @@ export class InteractiveMode {
         }
         previousUi.stop({ preserveScreen: true });
         previousUi.setFocus(null);
-        previousUi.clear();
+        // Detach, not clear: the same live components (spinners, reveals, extension
+        // widgets) are remounted on nextUi below. clear() would dispose them,
+        // killing every interval they own while they keep rendering static frames
+        // forever — the TUI then never self-repaints until an input event forces one.
+        previousUi.detachAll();
         if (TuiLayouts.isViewportTUI(previousUi))
             previousUi.setLayoutRoot(undefined);
         const nextUi = createInteractiveTui({
@@ -777,7 +882,13 @@ export class InteractiveMode {
             { component: this.footerContainer, shrink: 1, minSize: 1 },
         ]);
         this.fullscreenLayoutRoot = new TuiLayouts.VStack([
-            { component: this.transcriptScrollView, basis: 0, grow: 1, shrink: 1, minSize: 1 },
+            {
+                component: this.transcriptScrollView,
+                basis: 0,
+                grow: 1,
+                shrink: 1,
+                minSize: 1,
+            },
             { component: dock, basis: "auto", grow: 0, shrink: 1, minSize: 1 },
         ]);
         const rootComponents = [
@@ -1016,7 +1127,10 @@ export class InteractiveMode {
         while (true) {
             const userInput = await this.getUserInput();
             try {
-                await this.session.prompt(userInput, { streamingBehavior: "steer" });
+                await this.session.prompt(userInput.text, {
+                    streamingBehavior: "steer",
+                    ...(userInput.images ? { images: userInput.images } : {}),
+                });
             }
             catch (error) {
                 const errorMessage = error instanceof Error ? error.message : "Unknown error occurred";
@@ -1173,7 +1287,10 @@ export class InteractiveMode {
             return;
         }
         const seeded = seedKeybindingsFile(configPath, this.keybindings);
-        const edit = await editFileInExternalEditor({ command: editorCommand, path: configPath });
+        const edit = await editFileInExternalEditor({
+            command: editorCommand,
+            path: configPath,
+        });
         if (edit.status === "launch-failed") {
             // The editor never ran, so a file we just seeded carries no user content.
             if (seeded)
@@ -1356,7 +1473,11 @@ export class InteractiveMode {
             return { label: "path", color: "muted" };
         }
         if (source === "cli") {
-            return { label: "path", scopeLabel: scope === "temporary" ? "temp" : undefined, color: "muted" };
+            return {
+                label: "path",
+                scopeLabel: scope === "temporary" ? "temp" : undefined,
+                color: "muted",
+            };
         }
         const scopeLabel = scope === "user" ? "user" : scope === "project" ? "project" : scope === "temporary" ? "temp" : undefined;
         return { label: source, scopeLabel, color: "accent" };
@@ -1458,25 +1579,32 @@ export class InteractiveMode {
             const first = collisionList[0]?.collision;
             if (!first)
                 continue;
-            lines.push(theme.fg("warning", `  "${name}" collision:`));
-            lines.push(theme.fg("dim", `    ${theme.fg("success", "✓")} ${this.formatPathWithSource(first.winnerPath, this.findSourceInfoForPath(first.winnerPath, sourceInfos))}`));
+            lines.push({ text: `  "${name}" collision:`, tone: "warning" });
+            lines.push({
+                text: `    ✓ ${this.formatPathWithSource(first.winnerPath, this.findSourceInfoForPath(first.winnerPath, sourceInfos))}`,
+                tone: "warning",
+            });
             for (const d of collisionList) {
                 if (d.collision) {
-                    lines.push(theme.fg("dim", `    ${theme.fg("warning", "✗")} ${this.formatPathWithSource(d.collision.loserPath, this.findSourceInfoForPath(d.collision.loserPath, sourceInfos))} (skipped)`));
+                    lines.push({
+                        text: `    ✗ ${this.formatPathWithSource(d.collision.loserPath, this.findSourceInfoForPath(d.collision.loserPath, sourceInfos))} (skipped)`,
+                        tone: "warning",
+                    });
                 }
             }
         }
         for (const d of otherDiagnostics) {
+            const tone = d.type === "error" ? "error" : "warning";
             if (d.path) {
                 const formattedPath = this.formatPathWithSource(d.path, this.findSourceInfoForPath(d.path, sourceInfos));
-                lines.push(theme.fg(d.type === "error" ? "error" : "warning", `  ${formattedPath}`));
-                lines.push(theme.fg(d.type === "error" ? "error" : "warning", `    ${d.message}`));
+                lines.push({ text: `  ${formattedPath}`, tone });
+                lines.push({ text: `    ${d.message}`, tone });
             }
             else {
-                lines.push(theme.fg(d.type === "error" ? "error" : "warning", `  ${d.message}`));
+                lines.push({ text: `  ${d.message}`, tone });
             }
         }
-        return lines.join("\n");
+        return lines;
     }
     showLoadedResources(options) {
         // Resource rendering is idempotent; chat clears no longer clear this separate container.
@@ -1548,7 +1676,10 @@ export class InteractiveMode {
             }
             const skills = skillsResult.skills;
             if (skills.length > 0) {
-                const groups = this.buildScopeGroups(skills.map((skill) => ({ path: skill.filePath, sourceInfo: skill.sourceInfo })));
+                const groups = this.buildScopeGroups(skills.map((skill) => ({
+                    path: skill.filePath,
+                    sourceInfo: skill.sourceInfo,
+                })));
                 const skillList = this.formatScopeGroups(groups, {
                     formatPath: (item) => this.formatDisplayPath(item.path),
                     formatPackagePath: (item) => this.getShortPath(item.path, item.sourceInfo),
@@ -1558,7 +1689,10 @@ export class InteractiveMode {
             }
             const templates = this.session.promptTemplates;
             if (templates.length > 0) {
-                const groups = this.buildScopeGroups(templates.map((template) => ({ path: template.filePath, sourceInfo: template.sourceInfo })));
+                const groups = this.buildScopeGroups(templates.map((template) => ({
+                    path: template.filePath,
+                    sourceInfo: template.sourceInfo,
+                })));
                 const templateByPath = new Map(templates.map((t) => [t.filePath, t]));
                 const templateList = this.formatScopeGroups(groups, {
                     formatPath: (item) => {
@@ -1599,23 +1733,32 @@ export class InteractiveMode {
             }
         }
         if (showDiagnostics) {
+            const addDiagnosticNotice = (title, diagnostics) => {
+                this.loadedResourcesContainer.addChild(buildNoticeBox({
+                    title,
+                    tone: "warning",
+                    why: "Conflicting or invalid loaded resources were found.",
+                    extra: this.formatDiagnostics(diagnostics, sourceInfos),
+                }, { expanded: this.toolOutputExpanded }, theme));
+                this.loadedResourcesContainer.addChild(new Spacer(1));
+            };
             const skillDiagnostics = skillsResult.diagnostics;
             if (skillDiagnostics.length > 0) {
-                const warningLines = this.formatDiagnostics(skillDiagnostics, sourceInfos);
-                this.loadedResourcesContainer.addChild(new Text(`${theme.fg("warning", "[Skill conflicts]")}\n${warningLines}`, 0, 0));
-                this.loadedResourcesContainer.addChild(new Spacer(1));
+                addDiagnosticNotice("Skill conflicts", skillDiagnostics);
             }
             const promptDiagnostics = promptsResult.diagnostics;
             if (promptDiagnostics.length > 0) {
-                const warningLines = this.formatDiagnostics(promptDiagnostics, sourceInfos);
-                this.loadedResourcesContainer.addChild(new Text(`${theme.fg("warning", "[Prompt conflicts]")}\n${warningLines}`, 0, 0));
-                this.loadedResourcesContainer.addChild(new Spacer(1));
+                addDiagnosticNotice("Prompt conflicts", promptDiagnostics);
             }
             const extensionDiagnostics = [];
             const extensionErrors = this.session.resourceLoader.getExtensions().errors;
             if (extensionErrors.length > 0) {
                 for (const error of extensionErrors) {
-                    extensionDiagnostics.push({ type: "error", message: error.error, path: error.path });
+                    extensionDiagnostics.push({
+                        type: "error",
+                        message: error.error,
+                        path: error.path,
+                    });
                 }
             }
             const commandDiagnostics = this.session.extensionRunner.getCommandDiagnostics();
@@ -1624,15 +1767,11 @@ export class InteractiveMode {
             const shortcutDiagnostics = this.session.extensionRunner.getShortcutDiagnostics();
             extensionDiagnostics.push(...shortcutDiagnostics);
             if (extensionDiagnostics.length > 0) {
-                const warningLines = this.formatDiagnostics(extensionDiagnostics, sourceInfos);
-                this.loadedResourcesContainer.addChild(new Text(`${theme.fg("warning", "[Extension issues]")}\n${warningLines}`, 0, 0));
-                this.loadedResourcesContainer.addChild(new Spacer(1));
+                addDiagnosticNotice("Extension issues", extensionDiagnostics);
             }
             const themeDiagnostics = themesResult.diagnostics;
             if (themeDiagnostics.length > 0) {
-                const warningLines = this.formatDiagnostics(themeDiagnostics, sourceInfos);
-                this.loadedResourcesContainer.addChild(new Text(`${theme.fg("warning", "[Theme conflicts]")}\n${warningLines}`, 0, 0));
-                this.loadedResourcesContainer.addChild(new Spacer(1));
+                addDiagnosticNotice("Theme conflicts", themeDiagnostics);
             }
         }
     }
@@ -2312,7 +2451,10 @@ export class InteractiveMode {
         this.ui.requestRender();
     }
     addExtensionTerminalInputListener(handler) {
-        const subscription = { handler, unsubscribe: this.ui.addInputListener(handler) };
+        const subscription = {
+            handler,
+            unsubscribe: this.ui.addInputListener(handler),
+        };
         this.extensionTerminalInputSubscriptions.add(subscription);
         return () => {
             subscription.unsubscribe();
@@ -2423,7 +2565,11 @@ export class InteractiveMode {
                 opts?.signal?.removeEventListener("abort", onAbort);
                 this.hideExtensionSelector();
                 resolve(undefined);
-            }, { tui: this.ui, timeout: opts?.timeout, onToggleToolsExpanded: () => this.toggleToolOutputExpansion() });
+            }, {
+                tui: this.ui,
+                timeout: opts?.timeout,
+                onToggleToolsExpanded: () => this.toggleToolOutputExpansion(),
+            });
             this.disposeActiveSelector();
             this.editorContainer.clear();
             this.editorContainer.addChild(this.extensionSelector);
@@ -2556,8 +2702,13 @@ export class InteractiveMode {
                 this.defaultEditor.onSubmit?.(expandSubmittedText(newEditor, text));
             };
             newEditor.onChange = this.defaultEditor.onChange;
-            // Copy text (and any collapsed paste markers) from previous editor
-            transferEditorContent(this.editor, newEditor);
+            // Copy text (and any collapsed paste/image markers) from previous editor.
+            // Image payloads live on this instance, so they must be dropped when the
+            // destination cannot own their markers.
+            if (!transferEditorContent(this.editor, newEditor).imageMarkersTransferred) {
+                this.pendingImages.clear();
+            }
+            this.subscribeImageMarkers(newEditor);
             // Copy appearance settings if supported
             if (newEditor.borderColor !== undefined) {
                 newEditor.borderColor = this.defaultEditor.borderColor;
@@ -2600,7 +2751,10 @@ export class InteractiveMode {
             // hand-off, and a setText round-trip would be pure churn on the
             // user's draft.
             if (this.editor !== this.defaultEditor) {
-                transferEditorContent(this.editor, this.defaultEditor);
+                if (!transferEditorContent(this.editor, this.defaultEditor).imageMarkersTransferred) {
+                    this.pendingImages.clear();
+                }
+                this.subscribeImageMarkers(this.defaultEditor);
             }
             this.editor = this.defaultEditor;
         }
@@ -2787,8 +2941,11 @@ export class InteractiveMode {
             }
             this.updateShortcutOverlay(text);
         };
-        // Handle clipboard paste (triggered on Ctrl+V). Images are attached by path;
-        // otherwise, paste plain text from the system clipboard.
+        // Keep pendingImages aligned with the markers the editor displays.
+        this.subscribeImageMarkers(this.defaultEditor);
+        // Handle clipboard paste (triggered on Ctrl+V). Images are attached in
+        // memory behind an atomic `[Image #N]` marker; otherwise, paste plain text
+        // from the system clipboard.
         this.defaultEditor.onPasteImage = () => {
             this.lastInputWasPaste = true;
             void this.handleClipboardPaste();
@@ -2818,16 +2975,17 @@ export class InteractiveMode {
     async handleClipboardPaste() {
         try {
             const image = await readClipboardImage();
-            if (image) {
-                const tmpDir = os.tmpdir();
-                const ext = extensionForImageMimeType(image.mimeType) ?? "png";
-                const fileName = `pi-clipboard-${crypto.randomUUID()}.${ext}`;
-                const filePath = path.join(tmpDir, fileName);
-                fs.writeFileSync(filePath, Buffer.from(image.bytes));
-                this.editor.insertTextAtCursor?.(filePath);
-                this.ui.requestRender();
+            const attached = image &&
+                (await attachClipboardImage({
+                    editor: this.editor,
+                    pendingImages: this.pendingImages,
+                    settings: this.settingsManager,
+                    isCompacting: () => this.session?.isCompacting === true,
+                    showStatus: (message) => this.showStatus(message),
+                    requestRender: () => this.ui.requestRender(),
+                }, image));
+            if (attached)
                 return;
-            }
             const text = await readClipboardText();
             if (text) {
                 this.editor.insertTextAtCursor?.(text);
@@ -2836,10 +2994,89 @@ export class InteractiveMode {
         }
         catch (error) {
             const message = error instanceof Error ? error.message : String(error);
-            this.getSessionLogger().warn("clipboard_error", { op: "paste", error: message });
+            this.getSessionLogger().warn("clipboard_error", {
+                op: "paste",
+                error: message,
+            });
             this.showStatus(`Clipboard paste failed: ${sanitizeTuiErrorMessage(message)}`);
         }
     }
+    /** Route an editor's image-marker changes into {@link reconcilePendingImages}. */
+    subscribeImageMarkers(editor) {
+        if (!editor.insertImageMarker)
+            return;
+        editor.onImageMarkersChanged = (order) => this.reconcilePendingImages(order);
+        // The editor's undo stack restores marker TEXT and registry ids, but the
+        // payloads live HERE; mirror them into every undo snapshot so undo restores
+        // both halves of the pairing. Without this, deleting a marker re-keys the
+        // survivors onto its number and a later undo re-displays the deleted marker
+        // with no (or the wrong) payload behind it.
+        editor.snapshotAttachmentState = () => new Map(this.pendingImages);
+        editor.restoreAttachmentState = (state) => {
+            if (!(state instanceof Map))
+                return;
+            this.pendingImages.clear();
+            for (const [key, image] of state) {
+                this.pendingImages.set(key, image);
+            }
+        };
+    }
+    /**
+     * Re-key {@link pendingImages} onto the marker numbers the editor now
+     * displays. `order` lists the SURVIVING marker ids (pre-renumber, i.e. the
+     * keys the payloads currently sit under) in text reading order, and the
+     * editor keeps the visible numbers canonical 1..k in reading order, so a
+     * payload's new key is its position in that list. Ids absent from `order`
+     * are dropped; reported ids with no payload (a hand-typed marker) are skipped
+     * without consuming anyone else's slot.
+     *
+     * The map is mutated IN PLACE, never replaced: handleClipboardPaste hands
+     * this.pendingImages by reference into attachClipboardImage's deps, and a
+     * fresh identity would orphan that reference - the second paste in a turn
+     * then wrote into the dead map and silently destroyed its image.
+     */
+    reconcilePendingImages(order) {
+        if (this.pendingImages.size === 0)
+            return;
+        const reconciled = new Map();
+        order.forEach((id, index) => {
+            const image = this.pendingImages.get(id);
+            if (image)
+                reconciled.set(index + 1, image);
+        });
+        this.pendingImages.clear();
+        for (const [key, image] of reconciled) {
+            this.pendingImages.set(key, image);
+        }
+    }
+    /**
+     * Resolve the `[Image #N]` markers in `submittedText` (in READING order)
+     * into the image array submitted alongside it, then clear
+     * {@link pendingImages}.
+     *
+     * Reads ONLY the submitted text plus pendingImages - never live editor
+     * state: pi-tui's `Editor.submitValue()` resets the editor and clears its
+     * registries BEFORE `onSubmit` fires. A marker with no pending payload (a
+     * hand-typed `[Image #N]`, or the second half of a kill/yank duplicate) is
+     * passed through untouched and consumes no slot; a payload-bearing
+     * marker's FIRST occurrence wins. Slots are assigned 1..k in reading
+     * order, so the Nth marker in the final text is `images[N-1]`.
+     */
+    takeSubmissionImages(submittedText) {
+        const images = [];
+        const consumed = new Set();
+        for (const match of submittedText.matchAll(IMAGE_MARKER_PATTERN)) {
+            const id = Number.parseInt(match[1] ?? "0", 10);
+            if (consumed.has(id))
+                continue;
+            consumed.add(id);
+            const image = this.pendingImages.get(id);
+            if (image)
+                images.push(image);
+        }
+        this.pendingImages.clear();
+        return images;
+    }
     getSessionLogger() {
         this.sessionLogger ??= createSessionLogger(this.runtimeHost.services.agentDir);
         return this.sessionLogger;
@@ -2850,6 +3087,13 @@ export class InteractiveMode {
     }
     setupEditorSubmitHandler() {
         this.defaultEditor.onSubmit = async (text) => {
+            // Capture-then-clear BEFORE any branch: handleFollowUp's non-streaming
+            // path pre-resolves images and hands off here, but slash / extension /
+            // bash submissions return before the consuming branches below. Clearing
+            // only after use would leak a stale array into a later ordinary
+            // submission whose text never references it.
+            const preResolvedImages = this.preResolvedSubmissionImages;
+            this.preResolvedSubmissionImages = undefined;
             this.hideShortcutOverlay();
             this.lastEditorText = "";
             text = text.trim();
@@ -3033,7 +3277,7 @@ export class InteractiveMode {
                     await this.session.prompt(text);
                 }
                 else {
-                    this.queueCompactionMessage(text, "steer");
+                    this.queueCompactionSubmission(text, "steer");
                 }
                 return;
             }
@@ -3043,9 +3287,15 @@ export class InteractiveMode {
             // behavior here applies only to ordinary text, prompt template expansion,
             // and queueing.
             if (this.session.isStreaming) {
+                // Resolve BEFORE setText(""): the editor's prune chain fires
+                // onImageMarkersChanged([]) and destroys pendingImages.
+                const images = preResolvedImages ?? this.takeSubmissionImages(text);
                 this.editor.addToHistory?.(text);
                 this.editor.setText("");
-                await this.session.prompt(text, { streamingBehavior: "steer" });
+                await this.session.prompt(text, {
+                    streamingBehavior: "steer",
+                    ...(images.length > 0 ? { images } : {}),
+                });
                 this.updatePendingMessagesDisplay();
                 this.ui.requestRender();
                 return;
@@ -3053,11 +3303,13 @@ export class InteractiveMode {
             // Normal message submission
             // First, move any pending bash components to chat
             this.flushPendingBashComponents();
+            const images = preResolvedImages ?? this.takeSubmissionImages(text);
+            const submission = images.length > 0 ? { text, images } : { text };
             if (this.onInputCallback) {
-                this.onInputCallback(text);
+                this.onInputCallback(submission);
             }
             else {
-                this.pendingUserInputs.push(text);
+                this.pendingUserInputs.push(submission);
             }
             this.editor.addToHistory?.(text);
         };
@@ -3148,7 +3400,10 @@ export class InteractiveMode {
             case "message_update":
                 if (this.streamingComponent && event.message.role === "assistant") {
                     this.streamingMessage = event.message;
-                    this.streamingReveal.setTarget(this.streamingMessage);
+                    {
+                        const { head } = splitTrailingAssistantContent(event.message.content);
+                        this.streamingReveal.setTarget({ ...event.message, content: head });
+                    }
                     for (const content of this.streamingMessage.content) {
                         if (content.type === "toolCall") {
                             let component = this.pendingTools.get(content.id);
@@ -3168,6 +3423,7 @@ export class InteractiveMode {
                             }
                         }
                     }
+                    this.syncTrailingAssistantText(event.message);
                     this.ui.requestRender();
                 }
                 break;
@@ -3191,7 +3447,8 @@ export class InteractiveMode {
                         errorMessage = abortedErrorLabel(undefined, this.session.retryAttempt);
                         this.streamingMessage.errorMessage = errorMessage;
                     }
-                    this.streamingComponent.updateContent(this.streamingMessage, false);
+                    this.syncTrailingAssistantText(this.streamingMessage);
+                    this.trailingAssistantComponent = undefined;
                     this.addContinuityNotice(this.streamingMessage);
                     if (this.streamingMessage.stopReason === "aborted" || this.streamingMessage.stopReason === "error") {
                         if (!errorMessage) {
@@ -3248,7 +3505,9 @@ export class InteractiveMode {
                     }
                     const activity = readToolProgress(event.partialResult.details)?.activity;
                     if (activity) {
-                        const label = formatActiveToolWorkingLabel(event.toolName, { command: activity });
+                        const label = formatActiveToolWorkingLabel(event.toolName, {
+                            command: activity,
+                        });
                         this.activeToolExecutions.set(event.toolCallId, label);
                         this.workingMessage = label;
                         this.activeToolExecutionTerminalTitle = `${APP_TITLE} - ${label}`;
@@ -3262,13 +3521,17 @@ export class InteractiveMode {
             case "tool_execution_end": {
                 this.handleToolExecutionEnd(event);
                 this.toolArgsReveal.finish(event.toolCallId);
-                const component = this.pendingTools.get(event.toolCallId);
-                if (component) {
-                    this.toolResultReveal.finish(event.toolCallId);
-                    component.updateResult({ ...event.result, isError: event.isError });
-                    this.pendingTools.delete(event.toolCallId);
-                    this.ui.requestRender();
+                let component = this.pendingTools.get(event.toolCallId);
+                if (!component) {
+                    component = this.createToolExecutionComponent(event.toolName, event.toolCallId, {});
+                    component.setExpanded(this.toolOutputExpanded);
+                    this.chatContainer.addChild(component);
+                    this.pendingTools.set(event.toolCallId, component);
                 }
+                this.toolResultReveal.finish(event.toolCallId);
+                component.updateResult({ ...event.result, isError: event.isError });
+                this.pendingTools.delete(event.toolCallId);
+                this.ui.requestRender();
                 break;
             }
             case "agent_end":
@@ -3351,9 +3614,35 @@ export class InteractiveMode {
                     }
                 }
                 else if (event.result) {
+                    // Compaction event consumers in the fork are session-backed and do not
+                    // necessarily expose InteractiveMode's SessionManager convenience getter.
+                    // Keep the structural fallback for focused handler consumers while using
+                    // the session-owned manager on the real TUI path.
+                    const sessionManager = this.session.sessionManager ?? this.sessionManager;
+                    const entries = sessionManager.buildContextEntries();
+                    if (entries[0]?.type !== "compaction") {
+                        throw new Error("Completed compaction is missing from the session context");
+                    }
                     this.chatContainer.clear();
-                    this.rebuildChatFromMessages();
-                    this.addMessageToChat(createCompactionSummaryMessage(sanitizeTerminalLabel(event.result.summary), event.result.tokensBefore, new Date().toISOString(), event.result.details));
+                    const summaryMessage = createCompactionSummaryMessage(sanitizeTerminalLabel(event.result.summary), event.result.tokensBefore, new Date().toISOString(), event.result.details);
+                    if (typeof this.renderSessionEntries === "function") {
+                        // The latest compaction is prepended for model context; append it below at its chronological position.
+                        this.renderSessionEntries(entries.slice(1));
+                        this.addMessageToChat(summaryMessage);
+                        if (event.result.usage) {
+                            this.addCompactionCostNotice({
+                                type: "compaction_cost",
+                                kind: "compaction",
+                                usage: event.result.usage,
+                            });
+                        }
+                    }
+                    else {
+                        // Fork-owned compaction consumers expose the established rebuild helper,
+                        // not InteractiveMode's private entry renderer.
+                        this.rebuildChatFromMessages();
+                        this.addMessageToChat(summaryMessage);
+                    }
                     this.footer.invalidate();
                 }
                 else if (event.errorMessage) {
@@ -3389,7 +3678,10 @@ export class InteractiveMode {
                 // over-threshold context would just repeat the failure.
                 const compactionSucceeded = event.accepted === true || event.result !== undefined;
                 if (compactionSucceeded) {
-                    void this.flushCompactionQueue({ willRetry: event.willRetry, deferAdmission: false });
+                    void this.flushCompactionQueue({
+                        willRetry: event.willRetry,
+                        deferAdmission: false,
+                    });
                 }
                 else if (event.willRetry === true) {
                     const heldCount = this.compactionQueuedMessages.length;
@@ -3401,7 +3693,10 @@ export class InteractiveMode {
                         });
                         this.showStatus(`${heldCount} queued message${heldCount === 1 ? "" : "s"} will send with the next turn (compaction will retry)`);
                     }
-                    void this.flushCompactionQueue({ willRetry: true, deferAdmission: true });
+                    void this.flushCompactionQueue({
+                        willRetry: true,
+                        deferAdmission: true,
+                    });
                 }
                 else {
                     const restoredCount = this.restoreQueuedMessagesToEditor();
@@ -3507,8 +3802,7 @@ export class InteractiveMode {
             }
             case "summarization_retry_scheduled": {
                 this.showError(event.errorMessage);
-                this.showStatusIndicator(new RetryStatusIndicator(this.ui, event.attempt, event.maxAttempts, event.delayMs));
-                this.ui.requestRender();
+                this.showSummarizationRetryStatusIndicator(event);
                 break;
             }
             case "summarization_retry_attempt_start": {
@@ -3549,7 +3843,15 @@ export class InteractiveMode {
         }
     }
     showRetryStatusIndicator(event) {
-        this.showStatusIndicator(new RetryStatusIndicator(this.ui, event.attempt, event.maxAttempts, event.delayMs));
+        this.showRetryStatusIndicatorWithCadence(event);
+    }
+    showSummarizationRetryStatusIndicator(event) {
+        this.showRetryStatusIndicatorWithCadence(event);
+    }
+    showRetryStatusIndicatorWithCadence(event) {
+        const refreshIntervalMs = largeSessionWorkingStatusInterval(this.sessionManager.getEntries().length, DEFAULT_RETRY_STATUS_REFRESH_INTERVAL_MS, LARGE_SESSION_RETRY_STATUS_REFRESH_INTERVAL_MS);
+        const indicator = refreshIntervalMs === DEFAULT_RETRY_STATUS_REFRESH_INTERVAL_MS ? undefined : { intervalMs: refreshIntervalMs };
+        this.showStatusIndicator(new RetryStatusIndicator(this.ui, event.attempt, event.maxAttempts, event.delayMs, indicator));
         this.ui.requestRender();
     }
     /** Extract text content from a user message */
@@ -3695,6 +3997,29 @@ export class InteractiveMode {
             }
         }
     }
+    syncTrailingAssistantText(message) {
+        if (!this.streamingComponent)
+            return;
+        const { head, tail } = splitTrailingAssistantContent(message.content);
+        this.streamingComponent.updateContent({ ...message, content: head }, true);
+        if (tail.length === 0) {
+            if (this.trailingAssistantComponent) {
+                this.chatContainer.detachChild(this.trailingAssistantComponent);
+                this.trailingAssistantComponent = undefined;
+            }
+            return;
+        }
+        const tailMessage = { ...message, content: tail };
+        if (!this.trailingAssistantComponent) {
+            this.trailingAssistantComponent = new AssistantMessageComponent(tailMessage, this.hideThinkingBlock, this.getMarkdownThemeWithSettings(), this.hiddenThinkingLabel, this.outputPad, this.getMarkdownTransformers());
+            this.trailingAssistantComponent.setExpanded(this.toolOutputExpanded);
+            this.chatContainer.addChild(this.trailingAssistantComponent);
+            return;
+        }
+        this.trailingAssistantComponent.updateContent(tailMessage, true);
+        this.chatContainer.detachChild(this.trailingAssistantComponent);
+        this.chatContainer.addChild(this.trailingAssistantComponent);
+    }
     createToolExecutionComponent(toolName, toolCallId, args) {
         if (this.chrome) {
             return new ToolExecutionComponent(toolName, toolCallId, args, {
@@ -3731,6 +4056,10 @@ export class InteractiveMode {
                 this.addCustomEntryToChat(item);
                 continue;
             }
+            if (isCompactionCostNotice(item)) {
+                this.addCompactionCostNotice(item);
+                continue;
+            }
             const message = item;
             // Assistant messages need special handling for tool calls
             if (message.role === "assistant") {
@@ -3749,7 +4078,10 @@ export class InteractiveMode {
                             else {
                                 errorMessage = message.errorMessage || "Error";
                             }
-                            component.updateResult({ content: [{ type: "text", text: errorMessage }], isError: true });
+                            component.updateResult({
+                                content: [{ type: "text", text: errorMessage }],
+                                isError: true,
+                            });
                         }
                         else {
                             renderedPendingTools.set(content.id, component);
@@ -3795,10 +4127,28 @@ export class InteractiveMode {
             if (entry.type === "custom") {
                 return [entry];
             }
-            return sessionEntryToContextMessages(entry);
+            const messages = sessionEntryToContextMessages(entry);
+            if ((entry.type === "compaction" || entry.type === "branch_summary") && entry.usage && messages.length > 0) {
+                return [...messages, { type: "compaction_cost", kind: entry.type, usage: entry.usage }];
+            }
+            return messages;
         });
         this.renderSessionItems(items, options);
     }
+    /**
+     * Render billing usage for a compaction or branch summary. The notice is derived
+     * from persisted summary usage and is not stored as a separate session entry.
+     */
+    addCompactionCostNotice(notice) {
+        if (!this.settingsManager.getShowCacheMissNotices())
+            return;
+        const { usage } = notice;
+        const tokens = usage.input + usage.output + usage.cacheRead + usage.cacheWrite;
+        const cost = usage.cost.total >= 0.01 ? ` (~$${usage.cost.total.toFixed(2)})` : "";
+        const label = notice.kind === "compaction" ? "Compaction" : "Branch summary";
+        this.chatContainer.addChild(new Spacer(1));
+        this.chatContainer.addChild(new Text(theme.fg("warning", `${label}: ${formatTokens(tokens)} tokens billed${cost}`), 1, 0));
+    }
     /**
      * Show a transcript notice when a completed assistant message paid for a
      * significant cache miss. Only states observable facts: the miss itself,
@@ -3865,9 +4215,9 @@ export class InteractiveMode {
             return queuedInput;
         }
         return new Promise((resolve) => {
-            this.onInputCallback = (text) => {
+            this.onInputCallback = (input) => {
                 this.onInputCallback = undefined;
-                resolve(text);
+                resolve(input);
             };
         });
     }
@@ -4070,7 +4420,10 @@ export class InteractiveMode {
         // does NOT pass through onSubmit, so the isExtensionCommand check below is the
         // live dispatch point here: commands go straight to AgentSession.prompt(),
         // which runs them immediately even while compaction is active, while ordinary
-        // text is queued for delivery after compaction settles.
+        // text is queued for delivery after compaction settles. Image attachments
+        // are consumed and dropped VISIBLY inside queueCompactionSubmission - the
+        // queue is text-only, so resolving them here and queueing the text with a
+        // dead marker would lose the images without telling the user.
         if (this.session.isCompacting) {
             if (this.isExtensionCommand(text)) {
                 this.editor.addToHistory?.(text);
@@ -4078,10 +4431,15 @@ export class InteractiveMode {
                 await this.session.prompt(text);
             }
             else {
-                this.queueCompactionMessage(text, "followUp");
+                this.queueCompactionSubmission(text, "followUp");
             }
             return;
         }
+        // Resolve attachments BEFORE any setText("") below: the editor's prune
+        // chain fires onImageMarkersChanged([]) and the reconciler destroys
+        // pendingImages, so resolving after the clear would ship a literal
+        // `[Image #N]` with no attachment behind it.
+        const images = this.takeSubmissionImages(text);
         // Alt+Enter queues a follow-up message (waits until agent finishes).
         // Extension commands never reach this branch: the compaction branch above
         // dispatches them while compacting, and otherwise prompt() runs them
@@ -4090,12 +4448,20 @@ export class InteractiveMode {
         if (this.session.isStreaming) {
             this.editor.addToHistory?.(text);
             this.editor.setText("");
-            await this.session.prompt(text, { streamingBehavior: "followUp" });
+            await this.session.prompt(text, {
+                streamingBehavior: "followUp",
+                ...(images.length > 0 ? { images } : {}),
+            });
             this.updatePendingMessagesDisplay();
             this.ui.requestRender();
         }
         // If not streaming, Alt+Enter acts like regular Enter (trigger onSubmit)
         else if (this.editor.onSubmit) {
+            // The public `onSubmit(text: string)` API cannot be widened, so hand
+            // the pre-resolved images over out-of-band; the submit handler
+            // captures-and-clears the field at entry and delivers them through the
+            // widened main-loop channel.
+            this.preResolvedSubmissionImages = images.length > 0 ? images : undefined;
             this.editor.setText("");
             this.editor.onSubmit(text);
         }
@@ -4234,7 +4600,12 @@ export class InteractiveMode {
             why: sanitizeTuiErrorMessage(spec.why),
             ...(spec.extra === undefined
                 ? {}
-                : { extra: spec.extra.map((line) => ({ ...line, text: sanitizeTuiErrorMessage(line.text) })) }),
+                : {
+                    extra: spec.extra.map((line) => ({
+                        ...line,
+                        text: sanitizeTuiErrorMessage(line.text),
+                    })),
+                }),
             ...(spec.expandedLine === undefined ? {} : { expandedLine: sanitizeTuiErrorMessage(spec.expandedLine) }),
         };
         this.chatContainer.addChild(new Spacer(1));
@@ -4247,48 +4618,43 @@ export class InteractiveMode {
         this.ui.requestRender();
     }
     showNewVersionNotification(newVersion) {
-        const action = theme.fg("accent", BRAND?.update?.command ?? `${APP_NAME} update`);
-        const updateInstruction = theme.fg("muted", `New version ${newVersion} is available. Run `) + action;
+        const action = BRAND?.update?.command ?? `${APP_NAME} update`;
         const changelogUrl = getReleaseChangelogUrl(newVersion);
-        const changelogLink = getCapabilities().hyperlinks
-            ? hyperlink(theme.fg("accent", changelogUrl), changelogUrl)
-            : theme.fg("accent", changelogUrl);
-        const changelogLine = theme.fg("muted", "Changelog: ") + changelogLink;
-        this.chatContainer.addChild(new Spacer(1));
-        this.chatContainer.addChild(new DynamicBorder((text) => theme.fg("warning", text)));
-        this.chatContainer.addChild(new Text(`${theme.bold(theme.fg("warning", "Update Available"))}\n${updateInstruction}\n${changelogLine}`, 1, 0));
-        this.chatContainer.addChild(new DynamicBorder((text) => theme.fg("warning", text)));
-        this.ui.requestRender();
+        const changelogLink = getCapabilities().hyperlinks ? hyperlink(changelogUrl, changelogUrl) : changelogUrl;
+        this.showNoticeBox({
+            title: "Update Available",
+            tone: "warning",
+            why: `New version ${newVersion} is available. Run ${action}`,
+            extra: [{ text: `Changelog: ${changelogLink}`, tone: "accent" }],
+        });
     }
     showRiskyMainModelWarning(model) {
         if (!model || !isRiskyMainModel(model))
             return;
-        this.chatContainer.addChild(new Spacer(1));
-        this.chatContainer.addChild(new DynamicBorder((text) => theme.fg("error", text)));
-        this.chatContainer.addChild(new Text(`${theme.bold(theme.fg("error", "Risky model warning"))}\n${theme.fg("error", RISKY_MAIN_MODEL_WARNING)}`, 1, 0));
-        this.chatContainer.addChild(new DynamicBorder((text) => theme.fg("error", text)));
-        this.ui.requestRender();
+        this.showNoticeBox({ title: "Risky model warning", tone: "error", why: RISKY_MAIN_MODEL_WARNING });
     }
     showSettingsSourceSelected(event) {
         this.showStatus(`Settings: ${path.basename(event.path)} (${event.format.toUpperCase()})`);
     }
     showHighReasoningWarning(event) {
         const { title, body } = buildHighReasoningWarning({ id: event.modelId, provider: event.provider }, event.thinkingLevel);
-        this.chatContainer.addChild(new Spacer(1));
-        this.chatContainer.addChild(new DynamicBorder((text) => theme.fg("error", text)));
-        this.chatContainer.addChild(new Text(`${theme.bold(theme.fg("error", title))}\n${body.map((line) => theme.fg("error", line)).join("\n")}`, 1, 0));
-        this.chatContainer.addChild(new DynamicBorder((text) => theme.fg("error", text)));
-        this.ui.requestRender();
+        this.showNoticeBox({
+            title,
+            tone: "error",
+            why: body[0] ?? "High reasoning may affect reliability or cost.",
+            extra: body.slice(1).map((text) => ({ text, tone: "error" })),
+        });
     }
     showPackageUpdateNotification(packages) {
-        const action = theme.fg("accent", `${APP_NAME} update --extensions`);
-        const updateInstruction = theme.fg("muted", "Package updates are available. Run ") + action;
-        const packageLines = packages.map((pkg) => `- ${pkg}`).join("\n");
-        this.chatContainer.addChild(new Spacer(1));
-        this.chatContainer.addChild(new DynamicBorder((text) => theme.fg("warning", text)));
-        this.chatContainer.addChild(new Text(`${theme.bold(theme.fg("warning", "Package Updates Available"))}\n${updateInstruction}\n${theme.fg("muted", "Packages:")}\n${packageLines}`, 1, 0));
-        this.chatContainer.addChild(new DynamicBorder((text) => theme.fg("warning", text)));
-        this.ui.requestRender();
+        this.showNoticeBox({
+            title: "Package Updates Available",
+            tone: "warning",
+            why: `Package updates are available. Run ${APP_NAME} update --extensions`,
+            extra: [
+                { text: "Packages:", tone: "dim" },
+                ...packages.map((pkg) => ({ text: `- ${pkg}`, tone: "dim" })),
+            ],
+        });
     }
     /**
      * Get all queued messages (read-only).
@@ -4316,7 +4682,11 @@ export class InteractiveMode {
         const clearedNative = this.session.clearQueue(options);
         const { steering, followUp } = clearedNative;
         const nativeMessages = clearedNative.ordered ?? [
-            ...steering.map((text, enqueueOrder) => ({ text, mode: "steer", enqueueOrder })),
+            ...steering.map((text, enqueueOrder) => ({
+                text,
+                mode: "steer",
+                enqueueOrder,
+            })),
             ...followUp.map((text, index) => ({
                 text,
                 mode: "followUp",
@@ -4343,7 +4713,10 @@ export class InteractiveMode {
             steering: [...steering, ...compactionSteering],
             followUp: [...followUp, ...compactionFollowUp],
         };
-        Object.defineProperty(cleared, "ordered", { value: ordered, enumerable: false });
+        Object.defineProperty(cleared, "ordered", {
+            value: ordered,
+            enumerable: false,
+        });
         return cleared;
     }
     updatePendingMessagesDisplay() {
@@ -4365,7 +4738,9 @@ export class InteractiveMode {
         }
     }
     restoreQueuedMessagesToEditor(options) {
-        const { steering, followUp, ordered } = this.clearAllQueues({ abortWillFollow: options?.abort === true });
+        const { steering, followUp, ordered } = this.clearAllQueues({
+            abortWillFollow: options?.abort === true,
+        });
         const allQueued = ordered?.map((message) => message.text) ?? [...steering, ...followUp];
         if (allQueued.length === 0) {
             this.updatePendingMessagesDisplay();
@@ -4394,7 +4769,9 @@ export class InteractiveMode {
      * - The helper never auto-prompts restored queue text; the user decides whether to send it.
      */
     async abortAndFireQueuedMessages() {
-        const { steering, followUp, ordered } = this.clearAllQueues({ abortWillFollow: true });
+        const { steering, followUp, ordered } = this.clearAllQueues({
+            abortWillFollow: true,
+        });
         const allQueued = ordered?.map((message) => message.text) ?? [...steering, ...followUp];
         this.updatePendingMessagesDisplay();
         await this.session.abort();
@@ -4407,13 +4784,43 @@ export class InteractiveMode {
         this.editor.setText(combinedText);
         return allQueued.length;
     }
-    queueCompactionMessage(text, mode) {
-        this.compactionQueuedMessages.push({ text, mode, enqueueOrder: this.session.reserveQueuedInputOrder() });
-        this.getSessionLogger().debug("compaction_queue_enqueue", { mode, count: this.compactionQueuedMessages.length });
+    queueCompactionMessage(text, mode, droppedImageCount = 0) {
+        this.compactionQueuedMessages.push({
+            text,
+            mode,
+            enqueueOrder: this.session.reserveQueuedInputOrder(),
+        });
+        this.getSessionLogger().debug("compaction_queue_enqueue", {
+            mode,
+            count: this.compactionQueuedMessages.length,
+        });
         this.editor.addToHistory?.(text);
         this.editor.setText("");
         this.updatePendingMessagesDisplay();
-        this.showStatus("Queued message for after compaction");
+        this.showStatus(droppedImageCount > 0
+            ? `Queued message for after compaction; dropped ${droppedImageCount} image${droppedImageCount > 1 ? "s" : ""}: messages sent during compaction cannot carry images - paste again after compaction finishes`
+            : "Queued message for after compaction");
+    }
+    /**
+     * Queue a user submission for delivery after compaction. The compaction
+     * queue carries text only, so pasted attachments are dropped here -
+     * VISIBLY, never silently, mirroring attachClipboardImage's paste-time
+     * contract - and their `[Image #N]` markers are stripped, because a queued
+     * literal marker has no payload behind it and would ship an unreadable
+     * `[Image #N]` string to the model once the queue drains.
+     */
+    queueCompactionSubmission(text, mode) {
+        const images = this.takeSubmissionImages(text);
+        if (images.length === 0) {
+            this.queueCompactionMessage(text, mode);
+            return;
+        }
+        const queued = text.replace(IMAGE_MARKER_PATTERN, "").trim();
+        if (queued) {
+            this.queueCompactionMessage(queued, mode, images.length);
+            return;
+        }
+        this.showStatus(`Dropped ${images.length} image${images.length > 1 ? "s" : ""}: messages sent during compaction cannot carry images - paste again after compaction finishes`);
     }
     hasRegisteredCommand(command) {
         return !!this.session.extensionRunner.getCommand(command);
@@ -4480,8 +4887,12 @@ export class InteractiveMode {
                         return message.mode === "followUp" ? session.followUp(message.text) : session.steer(message.text);
                     }
                     return message.mode === "followUp"
-                        ? session.followUp(message.text, undefined, { enqueueOrder: message.enqueueOrder })
-                        : session.steer(message.text, undefined, { enqueueOrder: message.enqueueOrder });
+                        ? session.followUp(message.text, undefined, {
+                            enqueueOrder: message.enqueueOrder,
+                        })
+                        : session.steer(message.text, undefined, {
+                            enqueueOrder: message.enqueueOrder,
+                        });
                 },
                 reportFailure: (error, undeliveredCount) => {
                     this.showError(`Failed to send queued message${undeliveredCount === 1 ? "" : "s"}: ${error instanceof Error ? error.message : String(error)}`);
@@ -4991,7 +5402,11 @@ export class InteractiveMode {
                     await this.applyFavoriteSelection(favoriteIds, allModels, true, await favoritePatternSnapshot);
                 },
             });
-            return { component: selector, focus: selector, dispose: () => selector.dispose() };
+            return {
+                component: selector,
+                focus: selector,
+                dispose: () => selector.dispose(),
+            };
         });
     }
     async showFavoriteModelsSelector() {
@@ -5399,7 +5814,9 @@ export class InteractiveMode {
         return options.sort((a, b) => a.name.localeCompare(b.name));
     }
     async getLogoutProviderOptions() {
-        return (await this.session.modelRuntime.listCredentials({ signal: AbortSignal.timeout(15_000) }))
+        return (await this.session.modelRuntime.listCredentials({
+            signal: AbortSignal.timeout(15_000),
+        }))
             .map(({ providerId, type }) => ({
             id: providerId,
             name: this.session.modelRuntime.getProvider(providerId)?.name ?? providerId,
@@ -5580,7 +5997,11 @@ export class InteractiveMode {
         if (isUnknownModel(previousModel)) {
             const availableModels = this.session.modelRuntime.getAvailableSnapshot();
             const providerModels = availableModels.filter((model) => model.provider === providerId);
-            if (!hasDefaultModelProvider(providerId)) {
+            // Matches LLAMA_PROVIDER_ID from extensions/llama/provider.ts; kept inline to avoid coupling interactive mode to the built-in extension.
+            if (providerId === "llama.cpp") {
+                selectionError = llamaCppPostLoginGuidance(actionLabel, providerModels.length);
+            }
+            else if (!hasDefaultModelProvider(providerId)) {
                 selectionError = `${actionLabel}, but no default model is configured for provider "${providerId}". Use /model to select a model.`;
             }
             else if (providerModels.length === 0) {
@@ -5625,8 +6046,13 @@ export class InteractiveMode {
         }
         const controller = new AbortController();
         const timeout = setTimeout(() => controller.abort(), 15_000);
+        const refreshProviders = providerId === "cursor" ? [providerId, "cursor-cli-oauth"] : [providerId];
         void this.session.modelRuntime
-            .refresh({ allowNetwork: true, providers: [providerId], signal: controller.signal })
+            .refresh({
+            allowNetwork: true,
+            providers: refreshProviders,
+            signal: controller.signal,
+        })
             .then((result) => {
             if (result.aborted) {
                 this.showWarning(`${actionLabel}, but its model catalog refresh timed out; using cached models.`);
@@ -5821,7 +6247,6 @@ export class InteractiveMode {
             this.showWarning(veto.reason ?? "Reload blocked by an extension.");
             return;
         }
-        this.resetExtensionUI();
         const reloadBox = new Container();
         const borderColor = (s) => theme.fg("border", s);
         reloadBox.addChild(new DynamicBorder(borderColor));
@@ -5847,6 +6272,13 @@ export class InteractiveMode {
             if (chatRestoredBeforeSessionStart) {
                 return;
             }
+            // Reset extension UI only once the reload is actually proceeding (this
+            // callback runs after reload()'s internal veto re-check, right before the
+            // new runner's session_start re-registers extension UI). Resetting before
+            // reload() destroyed live extension footers/widgets/tickers on a vetoed
+            // or failed reload with nothing left to restore them, so the TUI stopped
+            // self-repainting until an input event forced a frame.
+            this.resetExtensionUI();
             this.hideThinkingBlock = this.settingsManager.getHideThinkingBlock();
             this.outputPad = this.settingsManager.getOutputPad();
             this.rebuildChatFromMessages();
@@ -5854,7 +6286,9 @@ export class InteractiveMode {
             chatRestoredBeforeSessionStart = true;
         };
         try {
-            const reloadResult = await this.session.reload({ beforeSessionStart: restoreChatBeforeSessionStart });
+            const reloadResult = await this.session.reload({
+                beforeSessionStart: restoreChatBeforeSessionStart,
+            });
             if (reloadResult.cancelled) {
                 dismissReloadBox(previousEditor);
                 reloadBoxDismissed = true;
@@ -5985,7 +6419,9 @@ export class InteractiveMode {
     async handleShareCommand() {
         // Check if gh is available and logged in
         try {
-            const authResult = spawnSync("gh", ["auth", "status"], { encoding: "utf-8" });
+            const authResult = spawnSync("gh", ["auth", "status"], {
+                encoding: "utf-8",
+            });
             if (authResult.status !== 0) {
                 this.showError("GitHub CLI is not logged in. Run 'gh auth login' first.");
                 return;
@@ -6346,9 +6782,7 @@ export class InteractiveMode {
         ].join("\n");
         fs.mkdirSync(path.dirname(debugLogPath), { recursive: true });
         fs.writeFileSync(debugLogPath, debugData);
-        this.chatContainer.addChild(new Spacer(1));
-        this.chatContainer.addChild(new Text(`${theme.fg("accent", "✓ Debug log written")}\n${theme.fg("muted", debugLogPath)}`, 1, 1));
-        this.ui.requestRender();
+        this.showNoticeBox({ title: "✓ Debug log written", tone: "success", why: debugLogPath });
     }
     handleArminSaysHi() {
         this.chatContainer.addChild(new Spacer(1));