@bubblebrain-ai/bubble 0.0.24 → 0.0.25

package/dist/tui-ink/app.js

@@ -3,18 +3,19 @@ import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { Box, Text, useApp, useInput } from "ink";
 import { AgentAbortError, INTERRUPTED_ASSISTANT_CONTENT } from "../agent.js";
 import { isHiddenToolMetadata } from "../agent/discovery-barrier.js";
+import { SessionManager } from "../session.js";
 import { registry as slashRegistry } from "../slash-commands/index.js";
 import { UserConfig, maskKey } from "../config.js";
 import { createPastedContentMarker, InputBox, isCtrlCInput, shouldCollapsePastedContent, } from "./input-box.js";
 import { MessageList } from "./message-list.js";
-import { appendTextPart, appendToolPart, compactDisplayMessages, contentFromParts, latestCompactionSummary, nextDisplayMessageKey, setUserInputStatus, snapshotDisplayParts, stripInterruptedAssistantMarker, toolCallsFromParts, } from "./display-history.js";
+import { appendTextPart, appendToolPart, compactDisplayMessages, contentFromParts, latestCompactionSummary, moveStatusMessageToEnd, nextDisplayMessageKey, setUserInputStatus, snapshotDisplayParts, stripInterruptedAssistantMarker, toolCallsFromParts, } from "./display-history.js";
 import { AgentRunInputQueue } from "../agent/input-controller.js";
 import { paletteFor, ThemeProvider, useTheme } from "./theme.js";
-import { ModelPicker, ProviderPicker, KeyPicker, SkillPicker } from "./model-picker.js";
+import { isPrintablePickerInput, ModelPicker, ProviderPicker, KeyPicker, SkillPicker } from "./model-picker.js";
 import { FeishuSetupPicker } from "./feishu-setup-picker.js";
 import { BUILTIN_PROVIDERS, ProviderRegistry, displayModel, isUserVisibleProvider } from "../provider-registry.js";
 import { buildSystemPrompt } from "../system-prompt.js";
-import { getAvailableThinkingLevels, getDefaultThinkingLevel, normalizeThinkingLevel } from "../provider-transform.js";
+import { getAvailableThinkingLevels, normalizeThinkingLevel } from "../provider-transform.js";
 import { FooterBar, buildFooterData } from "./footer.js";
 import { SkillRegistry } from "../skills/registry.js";
 import { parseSkillInvocation } from "../skills/invocation.js";
@@ -28,8 +29,23 @@ import { getNextPermissionMode } from "../permission/mode.js";
 import { QuestionDialog } from "./question-dialog.js";
 import { FeedbackDialog } from "./feedback-dialog.js";
 import { collectFeedback } from "../feedback/collect.js";
-import { hasTerminalMouseSequence } from "./terminal-mouse.js";
+import { isKeyReleaseEvent } from "./key-events.js";
+import { errorMessage, formatModelSwitchError, switchAgentModel } from "../tui/model-switch.js";
+import { formatImageUserDisplayText, nextImageDisplayLabelStart } from "../tui/image-display.js";
+import { sanitizeTerminalMouseInput, transcriptScrollLinesFromMouseInput } from "./terminal-mouse.js";
+import { transcriptPageScrollDirection } from "./transcript-input.js";
+import { decideStartingSubmitFingerprint, submitPayloadFingerprint } from "./submit-dedupe.js";
+import { isQueuedInputForCurrentSession, queuedAndPendingDisplayKeys, } from "./input-queue.js";
 import { TranscriptViewport } from "./transcript-viewport.js";
+import { SessionPicker } from "./session-picker.js";
+import { sessionDisplayName } from "../tui/session-display.js";
+import { parseGoalCommand } from "../goal/command.js";
+import { continuationPrompt, initialPrompt } from "../goal/prompts.js";
+import { shouldContinueGoal, stopReasonNotice } from "../goal/engine.js";
+import { goalCompleteNotice, goalIndicatorLine, goalSummaryText } from "../goal/format.js";
+import { tokenUsageTotal } from "../goal/usage.js";
+import { formatInternalContextBlock } from "../agent/internal-reminder-sanitizer.js";
+import { collectUsageStatsBundle, formatStatsPanelBody, rangeLabel } from "../stats/usage.js";
 import os from "node:os";
 function buildTips(agent, registry) {
     const tips = [];
@@ -55,6 +71,11 @@ function friendlyCwd(cwd) {
         return "~" + cwd.slice(home.length);
     return cwd;
 }
+function truncate(value, max) {
+    if (value.length <= max)
+        return value;
+    return `${value.slice(0, Math.max(0, max - 1))}…`;
+}
 function reconstructDisplayMessages(agentMessages) {
     const result = [];
     for (const m of agentMessages) {
@@ -206,7 +227,38 @@ function withMessageKey(message) {
 // would make Yoga re-lay-out the transcript for every few bytes of output.
 // 40ms keeps perceived latency invisible while capping layout work at 25fps.
 const STREAMING_FLUSH_INTERVAL_MS = 40;
-export function App({ agent, args, sessionManager, createProvider, registry, skillRegistry, planHandlerRef, approvalHandlerRef, questionController, bashAllowlist, settingsManager, lspService, mcpManager, themeMode: initialThemeMode, themeOverrides, detectedTheme, onThemeModeChange, flushMemory, runMemoryCompaction, runMemorySummary, runMemoryRefresh, bypassEnabled, updateNotice, hookController, onExit }) {
+export const INK_LOCAL_SLASH_COMMANDS = [
+    {
+        name: "thinking",
+        description: "Toggle thinking block visibility",
+    },
+    {
+        name: "toggle-thinking",
+        description: "Toggle thinking block visibility",
+    },
+    {
+        name: "goal",
+        description: "Set/manage an autonomous goal (/goal <objective>|clear|pause|resume|edit)",
+    },
+    {
+        name: "trace",
+        description: "Toggle verbose trace output",
+    },
+    {
+        name: "verbose",
+        description: "Toggle verbose trace output",
+    },
+    {
+        name: "debug",
+        description: "Toggle verbose trace output",
+    },
+    {
+        name: "write-previews",
+        description: "Toggle write preview expansion",
+    },
+];
+export function App({ agent, args, sessionManager: initialSessionManager, switchSession, createProvider, registry, skillRegistry, planHandlerRef, approvalHandlerRef, questionController, bashAllowlist, settingsManager, lspService, mcpManager, themeMode: initialThemeMode, themeOverrides, detectedTheme, onThemeModeChange, flushMemory, runMemoryCompaction, runMemorySummary, runMemoryRefresh, goalStore, bypassEnabled, updateNotice, updateNoticeRefresh, hookController, onExit }) {
+    const [sessionManager, setSessionManager] = useState(initialSessionManager);
     const [themeMode, setThemeMode] = useState(initialThemeMode ?? "auto");
     // `detectedTheme` is captured once at startup in main.ts. We keep it in state
     // so future re-detection (e.g. if a user runs `/theme auto` after switching
@@ -224,6 +276,7 @@ export function App({ agent, args, sessionManager, createProvider, registry, ski
     const themeResolved = themeMode === "auto" ? autoResolved : themeMode;
     const { exit } = useApp();
     const [messages, setMessages] = useState(() => compactDisplayMessages(reconstructDisplayMessages(agent.messages)));
+    const nextImageDisplayLabelStartRef = useRef(nextImageDisplayLabelStart(messages));
     const [isRunning, setIsRunning] = useState(false);
     const [streamingContent, setStreamingContent] = useState("");
     const [streamingReasoning, setStreamingReasoning] = useState("");
@@ -232,26 +285,33 @@ export function App({ agent, args, sessionManager, createProvider, registry, ski
     const [thinkingLevel, setThinkingLevel] = useState(agent.thinking);
     const [permissionMode, setPermissionMode] = useState(agent.mode);
     const [todos, setTodos] = useState(() => agent.getTodos());
+    const [goalLine, setGoalLine] = useState("");
+    const [currentUpdateNotice, setCurrentUpdateNotice] = useState(updateNotice);
     const [pendingPlan, setPendingPlan] = useState(null);
     const [pendingApproval, setPendingApproval] = useState(null);
     const [pendingQuestion, setPendingQuestion] = useState(null);
     const [pendingFeedback, setPendingFeedback] = useState(null);
     const [pickerMode, setPickerMode] = useState(null);
+    const [statsPanel, setStatsPanel] = useState(null);
     const [cursorResetEpoch, setCursorResetEpoch] = useState(0);
     const [composerDraft, setComposerDraft] = useState(null);
     const [keyProviderId, setKeyProviderId] = useState(null);
+    const [showThinking, setShowThinking] = useState(false);
+    const [expandedToolOutput, setExpandedToolOutput] = useState(false);
     const [verboseTrace, setVerboseTrace] = useState(false);
+    const [sidebarMode, setSidebarMode] = useState("collapsed");
     const startedWithVisibleHistoryRef = useRef(messages.some((message) => message.syntheticKind !== "ui_summary"));
     const { columns: terminalColumns, rows: terminalRows } = useTerminalSize();
     const showWelcome = shouldShowWelcomeBanner({
         messages,
         startedWithVisibleHistory: startedWithVisibleHistoryRef.current,
     });
+    const showWelcomeRef = useRef(showWelcome);
     const activeAbortRef = useRef(null);
     const exitRequestedRef = useRef(false);
     const sessionStartRef = useRef(Date.now());
     const viewportRef = useRef(null);
-    // Steer/queue while the agent runs (parity with the OpenTUI composer):
+    // Steer/queue while the agent runs:
     // Enter steers the current run via the agent's input controller; Tab (or an
     // ineligible input) queues for the next turn. Both render placeholder user
     // rows whose badge tracks the input's lifecycle.
@@ -260,6 +320,8 @@ export function App({ agent, args, sessionManager, createProvider, registry, ski
     const queuedInputsRef = useRef([]);
     const [pendingSteerCount, setPendingSteerCount] = useState(0);
     const [queuedCount, setQueuedCount] = useState(0);
+    const startingSubmitFingerprintRef = useRef(null);
+    const [startingSubmitFingerprint, setStartingSubmitFingerprint] = useState(null);
     const nextRunIdRef = useRef(0);
     // Set true the moment /quit is invoked so we can hide dynamic UI (composer,
     // waiting indicator, footer) before Ink snapshots its final frame into the
@@ -286,6 +348,46 @@ export function App({ agent, args, sessionManager, createProvider, registry, ski
         cwd: args.cwd,
         skillPaths: userConfig.getSkillPaths(),
     });
+    useEffect(() => {
+        setCurrentUpdateNotice(updateNotice);
+    }, [updateNotice]);
+    useEffect(() => {
+        showWelcomeRef.current = showWelcome;
+    }, [showWelcome]);
+    useEffect(() => {
+        if (!goalStore)
+            return;
+        let persistSuspended = false;
+        const persistGoal = (goal) => {
+            if (!sessionManager)
+                return;
+            try {
+                const metadata = sessionManager.getMetadata();
+                sessionManager.setMetadata({ ...metadata, goal: goal ?? undefined });
+            }
+            catch {
+                // Goal persistence is best-effort; never break the run loop over it.
+            }
+        };
+        const unsubscribe = goalStore.onChange((goal) => {
+            setGoalLine(goal ? goalIndicatorLine(goal) : "");
+            if (!persistSuspended)
+                persistGoal(goal);
+        });
+        const persisted = sessionManager?.getMetadata().goal;
+        if (persisted) {
+            persistSuspended = true;
+            goalStore.loadFrom(persisted.status === "active" ? { ...persisted, status: "paused" } : persisted);
+            persistSuspended = false;
+        }
+        else {
+            persistSuspended = true;
+            goalStore.loadFrom(undefined);
+            persistSuspended = false;
+            setGoalLine("");
+        }
+        return unsubscribe;
+    }, [goalStore, sessionManager]);
     const requestExit = useCallback(() => {
         if (exitRequestedRef.current)
             return;
@@ -415,26 +517,54 @@ export function App({ agent, args, sessionManager, createProvider, registry, ski
         }));
     }, [agent, args.cwd, safeRegistry, safeSkillRegistry]);
     useInput((input, key) => {
+        if (isKeyReleaseEvent(key))
+            return;
         if (isCtrlCInput(input, key)) {
             requestExit();
             return;
         }
-        // Mouse reporting is off (native drag-select/copy works directly), so no
-        // SGR wheel events arrive — wheel scrolling reaches the app as Up/Down
-        // arrows via the terminal's alternate-scroll mode, classified in the
-        // composer. Defensively drop any stray mouse report bytes.
-        if (hasTerminalMouseSequence(input))
+        const overlayActive = !!(pickerMode || pendingPlan || pendingApproval || pendingQuestion || pendingFeedback || statsPanel);
+        const mouseInput = sanitizeTerminalMouseInput(input);
+        if (mouseInput.wheelDirections.length > 0) {
+            for (const lines of transcriptScrollLinesFromMouseInput(mouseInput, { overlayActive })) {
+                viewportRef.current?.scrollBy(lines);
+            }
+        }
+        if (mouseInput.hasMouse) {
+            if (!mouseInput.strippedInput)
+                return;
+            input = mouseInput.strippedInput;
+        }
+        const pageScrollDirection = transcriptPageScrollDirection(key, { overlayActive });
+        if (pageScrollDirection) {
+            viewportRef.current?.scrollPage(pageScrollDirection);
+            return;
+        }
+        if (pendingPlan || pendingApproval || pendingQuestion || pendingFeedback || statsPanel)
             return;
-        if (!pickerMode && key.pageUp) {
-            viewportRef.current?.scrollPage("up");
+        if (key.ctrl && input.toLowerCase() === "p" && !pickerMode && !activeAbortRef.current) {
+            setStatsPanel(null);
+            setPickerMode("slash");
             return;
         }
-        if (!pickerMode && key.pageDown) {
-            viewportRef.current?.scrollPage("down");
+        if (key.ctrl && key.shift && input.toLowerCase() === "m" && !pickerMode) {
+            if (!mcpManager || mcpManager.getStates().length === 0) {
+                addMessage("assistant", "No MCP servers configured.");
+            }
+            else {
+                setStatsPanel(null);
+                setPickerMode("mcp-reconnect");
+            }
             return;
         }
-        if (pendingPlan || pendingApproval || pendingQuestion || pendingFeedback)
+        if (key.ctrl && input.toLowerCase() === "t" && !pickerMode) {
+            setShowThinking((current) => {
+                const next = !current;
+                addMessage("assistant", next ? "Thinking blocks visible" : "Thinking blocks hidden");
+                return next;
+            });
             return;
+        }
         if (key.ctrl && input === "o" && !pickerMode) {
             setVerboseTrace((v) => !v);
             return;
@@ -481,6 +611,23 @@ export function App({ agent, args, sessionManager, createProvider, registry, ski
     const addMessage = useCallback((role, content) => {
         updateDisplayMessages((prev) => [...prev, withMessageKey({ role, content })]);
     }, [updateDisplayMessages]);
+    useEffect(() => {
+        if (!updateNoticeRefresh)
+            return;
+        let cancelled = false;
+        updateNoticeRefresh.then((notice) => {
+            if (cancelled || !notice)
+                return;
+            setCurrentUpdateNotice(notice);
+            if (!showWelcomeRef.current)
+                addMessage("assistant", notice);
+        }).catch(() => {
+            // Best-effort update checks should never disturb the session.
+        });
+        return () => {
+            cancelled = true;
+        };
+    }, [addMessage, updateNoticeRefresh]);
     const clearMessages = useCallback(() => {
         // The transcript lives entirely in React state now (alt-screen viewport,
         // no terminal scrollback) — clearing state clears the screen. Writing
@@ -494,26 +641,42 @@ export function App({ agent, args, sessionManager, createProvider, registry, ski
         viewportRef.current?.forceScrollToBottom();
         return key;
     }, [updateDisplayMessages]);
+    const prepareSubmitDisplay = useCallback((payload) => {
+        if (payload.images.length === 0)
+            return payload;
+        if (payload.imageDisplayStart !== undefined) {
+            nextImageDisplayLabelStartRef.current = Math.max(nextImageDisplayLabelStartRef.current, payload.imageDisplayStart + payload.images.length);
+            return payload;
+        }
+        const imageDisplayStart = nextImageDisplayLabelStartRef.current;
+        nextImageDisplayLabelStartRef.current += payload.images.length;
+        return { ...payload, imageDisplayStart };
+    }, []);
+    const submitDisplayText = useCallback((payload) => (formatImageUserDisplayText(payload.displayText ?? payload.text, payload.images.length, payload.imageDisplayStart)), []);
+    const currentSessionFile = useCallback(() => sessionManager?.getSessionFile(), [sessionManager]);
     const queueInput = useCallback((payload) => {
-        const displayKey = addStatusUserMessage(payload.displayText ?? payload.text, "queued");
-        queuedInputsRef.current.push({ payload, displayKey });
+        const preparedPayload = prepareSubmitDisplay(payload);
+        const displayKey = addStatusUserMessage(submitDisplayText(preparedPayload), "queued");
+        queuedInputsRef.current.push({ payload: preparedPayload, displayKey, sessionFile: currentSessionFile() });
         setQueuedCount(queuedInputsRef.current.length);
-    }, [addStatusUserMessage]);
+    }, [addStatusUserMessage, currentSessionFile, prepareSubmitDisplay, submitDisplayText]);
     const submitSteer = useCallback((payload) => {
         const controller = inputControllerRef.current;
         if (!controller) {
             queueInput(payload);
             return;
         }
-        const displayKey = addStatusUserMessage(payload.displayText ?? payload.text, "pending_steer");
-        const pending = controller.enqueue(payload.text);
-        pendingSteersRef.current.set(pending.id, { displayKey });
+        const preparedPayload = prepareSubmitDisplay(payload);
+        const displayKey = addStatusUserMessage(submitDisplayText(preparedPayload), "pending_steer");
+        const pending = controller.enqueue(preparedPayload.text);
+        pendingSteersRef.current.set(pending.id, { displayKey, sessionFile: currentSessionFile() });
         setPendingSteerCount(pendingSteersRef.current.size);
-    }, [addStatusUserMessage, queueInput]);
+    }, [addStatusUserMessage, currentSessionFile, prepareSubmitDisplay, queueInput, submitDisplayText]);
     const openPicker = useCallback((mode, providerId) => {
         if (mode === "key") {
             setKeyProviderId(providerId ?? null);
         }
+        setStatsPanel(null);
         setPickerMode(mode);
     }, []);
     const closePicker = useCallback(() => {
@@ -529,71 +692,151 @@ export function App({ agent, args, sessionManager, createProvider, registry, ski
     const clearComposerDraft = useCallback(() => {
         setComposerDraft(null);
     }, []);
+    const setStartingSubmit = useCallback((fingerprint) => {
+        startingSubmitFingerprintRef.current = fingerprint;
+        setStartingSubmitFingerprint(fingerprint);
+    }, []);
     const openFeedback = useCallback((initialDescription) => {
         const base = collectFeedback(agent, { description: "" });
         const { description: _drop, ...rest } = base;
         setPendingFeedback({ base: rest, initialDescription });
     }, [agent]);
-    const handleModelSelect = useCallback((model) => {
+    const sidebarFits = terminalColumns > 120;
+    const sidebarVisible = sidebarMode === "expanded" ? sidebarFits : sidebarMode === "auto" && sidebarFits;
+    const currentSidebarCommandState = useCallback((mode = sidebarMode) => {
+        const visible = mode === "expanded" ? sidebarFits : mode === "auto" && sidebarFits;
+        return { mode, visible, active: visible };
+    }, [sidebarFits, sidebarMode]);
+    const toggleSidebar = useCallback(() => {
+        const next = sidebarVisible ? "collapsed" : "expanded";
+        setSidebarMode(next);
+        return currentSidebarCommandState(next);
+    }, [currentSidebarCommandState, sidebarVisible]);
+    const applySidebarMode = useCallback((mode) => {
+        setSidebarMode(mode);
+        return currentSidebarCommandState(mode);
+    }, [currentSidebarCommandState]);
+    const openSessionPicker = useCallback(() => {
+        if (activeAbortRef.current) {
+            addMessage("error", "Stop the current run before switching sessions.");
+            return;
+        }
+        setStatsPanel(null);
+        setPickerMode("session");
+    }, [addMessage]);
+    const openRewindPicker = useCallback(() => {
+        if (!sessionManager) {
+            addMessage("error", "Rewind requires an active session.");
+            return;
+        }
+        if (activeAbortRef.current) {
+            addMessage("error", "Stop the current run before rewinding.");
+            return;
+        }
+        setStatsPanel(null);
+        setPickerMode("rewind");
+    }, [addMessage, sessionManager]);
+    const openStatsPanel = useCallback(() => {
+        setPickerMode(null);
+        setStatsPanel({
+            range: "30d",
+            bundle: collectUsageStatsBundle(),
+        });
+    }, []);
+    const closeStatsPanel = useCallback(() => {
+        setStatsPanel(null);
+        setCursorResetEpoch((epoch) => epoch + 1);
+    }, []);
+    const handleSessionSelect = useCallback((sessionFile) => {
+        if (!switchSession) {
+            addMessage("error", "Session switching is not available in this mode.");
+            closePicker();
+            return;
+        }
+        if (activeAbortRef.current) {
+            addMessage("error", "Stop the current run before switching sessions.");
+            closePicker();
+            return;
+        }
+        const result = switchSession(sessionFile);
+        if ("error" in result) {
+            addMessage("error", `Failed to switch session: ${result.error}`);
+            closePicker();
+            return;
+        }
+        const queuedDisplayKeys = queuedAndPendingDisplayKeys(queuedInputsRef.current, pendingSteersRef.current.values());
+        queuedInputsRef.current = [];
+        pendingSteersRef.current.clear();
+        inputControllerRef.current = null;
+        setQueuedCount(0);
+        setPendingSteerCount(0);
+        setStartingSubmit(null);
+        clearComposerDraft();
+        setSessionManager(result.manager);
+        setTodos(agent.getTodos());
+        updateDisplayMessages(() => [
+            ...reconstructDisplayMessages(agent.messages).filter((message) => !queuedDisplayKeys.has(message.key ?? "")),
+            withMessageKey({ role: "assistant", content: `⤷ Resumed session: ${sessionDisplayName(result.manager)}` }),
+        ]);
+        viewportRef.current?.forceScrollToBottom();
+        closePicker();
+    }, [addMessage, agent, clearComposerDraft, closePicker, setStartingSubmit, switchSession, updateDisplayMessages]);
+    const handleModelSelect = useCallback((model, selectedThinkingLevel) => {
+        const run = async () => {
+            const nextThinkingLevel = await switchAgentModel({
+                model,
+                agent,
+                registry: safeRegistry,
+                createProvider,
+                workingDir: args.cwd,
+                systemPromptOptions: agent.getSystemPromptToolOptions(),
+                thinkingLevel: selectedThinkingLevel,
+                rememberModel: (nextModel) => userConfig.pushRecentModel(nextModel),
+                setThinkingLevel,
+                sessionManager,
+            });
+            const effortNote = nextThinkingLevel && nextThinkingLevel !== "off"
+                ? ` with ${nextThinkingLevel} effort`
+                : "";
+            addMessage("assistant", `Model switched to ${displayModel(model)}${effortNote}.`);
+            closePicker();
+            return nextThinkingLevel;
+        };
+        void run().catch((error) => {
+            addMessage("error", formatModelSwitchError(model, error));
+            closePicker();
+        });
+    }, [agent, addMessage, closePicker, sessionManager, userConfig, safeRegistry, createProvider]);
+    const handleProviderSelect = useCallback((providerId) => {
         const run = async () => {
-            agent.model = model;
-            const decoded = model.includes(":")
-                ? model.split(":")
-                : [agent.providerId || safeRegistry.getDefault()?.id || "openai", model];
-            const providerId = decoded[0];
             await safeRegistry.prepareProvider(providerId);
-            const provider = safeRegistry.getConfigured().find((item) => item.id === providerId);
-            if (!provider?.apiKey || !createProvider) {
-                addMessage("error", `Provider ${providerId} is not configured or has no active credentials.`);
+            const configured = safeRegistry.getConfigured();
+            const p = configured.find((x) => x.id === providerId);
+            const builtin = BUILTIN_PROVIDERS.find((x) => x.id === providerId);
+            if (!p && !builtin) {
+                addMessage("error", `Provider ${providerId} not found.`);
                 closePicker();
                 return;
             }
-            const modelId = model.includes(":") ? model.split(":").slice(1).join(":") : model;
-            agent.thinking = normalizeThinkingLevel(agent.thinking || getDefaultThinkingLevel(providerId, modelId), getAvailableThinkingLevels(providerId, modelId));
-            agent.setProvider(createProvider(providerId, provider.apiKey, provider.baseURL));
+            if (!p?.apiKey) {
+                if (!p && builtin) {
+                    safeRegistry.addProvider(providerId, "");
+                }
+                safeRegistry.setDefault(providerId);
+                setKeyProviderId(providerId);
+                setPickerMode("key");
+                return;
+            }
+            safeRegistry.setDefault(providerId);
+            agent.setProvider(createProvider(providerId, p.apiKey, p.baseURL));
             agent.providerId = providerId;
-            agent.setSystemPrompt(buildSystemPrompt({
-                agentName: "Bubble",
-                configuredProvider: providerId,
-                configuredModel: displayModel(model),
-                configuredModelId: model,
-                thinkingLevel: agent.thinking,
-                workingDir: args.cwd,
-                ...agent.getSystemPromptToolOptions(),
-            }));
-            userConfig.pushRecentModel(model);
-            setThinkingLevel(agent.thinking);
-            sessionManager?.updateMetadata({ model, thinkingLevel: agent.thinking, reasoningEffort: agent.thinking });
-            sessionManager?.appendMarker("model_switch", model);
-            addMessage("assistant", `Model switched to ${displayModel(model)}.`);
+            addMessage("assistant", `Switched to provider ${p.name}. Use /model to pick a model.`);
             closePicker();
         };
-        void run();
-    }, [agent, addMessage, closePicker, sessionManager, userConfig, safeRegistry, createProvider]);
-    const handleProviderSelect = useCallback(async (providerId) => {
-        await safeRegistry.prepareProvider(providerId);
-        const configured = safeRegistry.getConfigured();
-        const p = configured.find((x) => x.id === providerId);
-        const builtin = BUILTIN_PROVIDERS.find((x) => x.id === providerId);
-        if (!p && !builtin) {
-            addMessage("error", `Provider ${providerId} not found.`);
+        void run().catch((error) => {
+            addMessage("error", `Failed to switch provider ${providerId}: ${errorMessage(error)}`);
             closePicker();
-            return;
-        }
-        if (!p?.apiKey) {
-            if (!p && builtin) {
-                safeRegistry.addProvider(providerId, "");
-            }
-            safeRegistry.setDefault(providerId);
-            setKeyProviderId(providerId);
-            setPickerMode("key");
-            return;
-        }
-        safeRegistry.setDefault(providerId);
-        agent.setProvider(createProvider(providerId, p.apiKey, p.baseURL));
-        agent.providerId = providerId;
-        addMessage("assistant", `Switched to provider ${p.name}. Use /model to pick a model.`);
-        closePicker();
+        });
     }, [addMessage, agent, closePicker, createProvider, safeRegistry]);
     const handleProviderAddSelect = useCallback((providerId) => {
         const ok = safeRegistry.addProvider(providerId, "");
@@ -620,7 +863,10 @@ export function App({ agent, args, sessionManager, createProvider, registry, ski
                 throw new Error("Provider creation not available");
             }),
             openPicker,
+            openSessionPicker,
+            openRewindPicker,
             openFeedback,
+            fillComposer,
             registry: safeRegistry,
             skillRegistry: safeSkillRegistry,
             bashAllowlist,
@@ -635,11 +881,12 @@ export function App({ agent, args, sessionManager, createProvider, registry, ski
             getThemeMode: () => themeMode,
             getResolvedTheme: () => themeResolved,
             setThemeMode: applyThemeMode,
+            openStats: openStatsPanel,
         });
         if (handled && result) {
             addMessage("assistant", result);
         }
-    }, [agent, addMessage, clearMessages, closePicker, createProvider, exit, openPicker, safeRegistry, sessionManager]);
+    }, [agent, addMessage, clearMessages, closePicker, createProvider, exit, fillComposer, openPicker, openSessionPicker, openRewindPicker, openStatsPanel, safeRegistry, sessionManager]);
     const handleLogoutProviderSelect = useCallback(async (providerId) => {
         closePicker();
         const command = `/logout ${providerId}`;
@@ -654,7 +901,10 @@ export function App({ agent, args, sessionManager, createProvider, registry, ski
                 throw new Error("Provider creation not available");
             }),
             openPicker,
+            openSessionPicker,
+            openRewindPicker,
             openFeedback,
+            fillComposer,
             registry: safeRegistry,
             skillRegistry: safeSkillRegistry,
             bashAllowlist,
@@ -669,11 +919,12 @@ export function App({ agent, args, sessionManager, createProvider, registry, ski
             getThemeMode: () => themeMode,
             getResolvedTheme: () => themeResolved,
             setThemeMode: applyThemeMode,
+            openStats: openStatsPanel,
         });
         if (handled && result) {
             addMessage("assistant", result);
         }
-    }, [agent, addMessage, clearMessages, closePicker, createProvider, exit, openPicker, safeRegistry, sessionManager]);
+    }, [agent, addMessage, clearMessages, closePicker, createProvider, exit, fillComposer, openPicker, openSessionPicker, openRewindPicker, openStatsPanel, safeRegistry, sessionManager]);
     const handleKeySubmit = useCallback((key) => {
         const targetId = keyProviderId || safeRegistry.getDefault()?.id;
         if (!targetId) {
@@ -693,16 +944,15 @@ export function App({ agent, args, sessionManager, createProvider, registry, ski
         setKeyProviderId(null);
     }, [addMessage, agent, closePicker, createProvider, keyProviderId, safeRegistry]);
     const handleSubmit = useCallback(async (payload) => {
-        const normalized = typeof payload === "string" ? { text: payload, images: [] } : payload;
-        const input = normalized.text;
-        const displayInput = normalized.displayText ?? input;
-        const images = normalized.images;
+        const initialPayload = typeof payload === "string" ? { text: payload, images: [] } : payload;
+        const input = initialPayload.text;
+        const displayInput = initialPayload.displayText ?? input;
+        const images = initialPayload.images;
         if (!input.trim() && images.length === 0)
             return;
         // Agent already running: route the submit into the live run instead of
         // starting a new one. Plain prose steers the current turn; slash
-        // commands, @-mentions and image payloads queue for the next turn
-        // (mirrors the OpenTUI boundary-steer eligibility rules).
+        // commands, @-mentions and image payloads queue for the next turn.
         if (activeAbortRef.current) {
             if (/^\/(?:quit|exit)\s*$/.test(input.trim())) {
                 requestExit();
@@ -712,435 +962,641 @@ export function App({ agent, args, sessionManager, createProvider, registry, ski
                 !input.includes("@") &&
                 images.length === 0;
             if (steerEligible) {
-                submitSteer(normalized);
+                submitSteer(initialPayload);
             }
             else {
-                queueInput(normalized);
+                queueInput(initialPayload);
             }
             return;
         }
-        const runAgentInput = async (actualInput, displayInput, attachedImages = []) => {
-            const activeProviderId = agent.providerId || safeRegistry.getDefault()?.id;
-            const hasActiveProvider = !!activeProviderId && safeRegistry.getEnabled().some((provider) => provider.id === activeProviderId);
-            if (!hasActiveProvider) {
-                addMessage("error", "No provider configured. Use /login for ChatGPT or /provider --add <id> before sending a prompt.");
-                return;
-            }
-            if (!agent.model) {
-                addMessage("error", "No model selected. Use /model after /login or provider setup.");
-                return;
-            }
-            const displayContent = attachedImages.length > 0
-                ? `${displayInput}${displayInput ? "\n" : ""}${attachedImages
-                    .map((img, i) => `[image${attachedImages.length > 1 ? ` ${i + 1}` : ""}: ${img.filename ?? "clipboard"} · ${Math.max(1, Math.round(img.bytes / 1024))}KB]`)
-                    .join(" ")}`
-                : displayInput;
-            updateDisplayMessages((prev) => [
-                ...prev,
-                withMessageKey({ role: "user", content: displayContent }),
-            ]);
-            // Sending is an explicit "watch the newest turn" intent: snap the
-            // transcript back to the bottom even if the user had scrolled up.
-            viewportRef.current?.forceScrollToBottom();
-            setIsRunning(true);
-            runStartRef.current = Date.now();
-            setStreamingContent("");
-            setStreamingReasoning("");
-            setStreamingTools([]);
-            setStreamingParts([]);
-            let assistantContent = "";
-            let assistantReasoning = "";
-            const toolCalls = [];
-            const assistantParts = [];
-            const abortController = new AbortController();
-            activeAbortRef.current = abortController;
-            const inputController = new AgentRunInputQueue(`run-${++nextRunIdRef.current}`);
-            inputControllerRef.current = inputController;
-            const syncStreamingParts = () => {
-                setStreamingParts(snapshotDisplayParts(assistantParts));
-            };
-            // Text/reasoning deltas arrive far faster than the screen needs to
-            // update; batch them so the full-frame re-render runs at most every
-            // STREAMING_FLUSH_INTERVAL_MS. Tool events stay immediate.
-            let streamingFlushTimer = null;
-            const cancelStreamingFlush = () => {
-                if (streamingFlushTimer !== null) {
-                    clearTimeout(streamingFlushTimer);
-                    streamingFlushTimer = null;
-                }
-            };
-            const scheduleStreamingFlush = () => {
-                if (streamingFlushTimer !== null)
-                    return;
-                streamingFlushTimer = setTimeout(() => {
-                    streamingFlushTimer = null;
-                    setStreamingContent(assistantContent);
-                    setStreamingReasoning(assistantReasoning);
-                    syncStreamingParts();
-                }, STREAMING_FLUSH_INTERVAL_MS);
-            };
-            const hasAssistantOutput = () => (!!assistantContent ||
-                !!assistantReasoning ||
-                toolCalls.length > 0 ||
-                assistantParts.length > 0);
-            const commitAssistantMessage = (taskElapsedMs) => {
-                if (!hasAssistantOutput())
+        const submitFingerprint = submitPayloadFingerprint(initialPayload);
+        const startingDecision = decideStartingSubmitFingerprint(startingSubmitFingerprintRef.current, submitFingerprint);
+        if (startingDecision === "ignore")
+            return;
+        if (startingDecision === "queue") {
+            queueInput(initialPayload);
+            return;
+        }
+        const normalized = prepareSubmitDisplay(initialPayload);
+        setStartingSubmit(submitFingerprint);
+        try {
+            const runAgentInput = async (actualInput, displayInput, attachedImages = [], runOptions = {}) => {
+                const runSessionFile = currentSessionFile();
+                const activeProviderId = agent.providerId || safeRegistry.getDefault()?.id;
+                const hasActiveProvider = !!activeProviderId && safeRegistry.getEnabled().some((provider) => provider.id === activeProviderId);
+                if (!hasActiveProvider) {
+                    addMessage("error", "No provider configured. Use /login for ChatGPT or /provider --add <id> before sending a prompt.");
+                    if (runOptions.goalRun && goalStore?.snapshot()?.status === "active") {
+                        goalStore.pause();
+                        addMessage("assistant", stopReasonNotice("error"));
+                    }
                     return;
-                const currentParts = snapshotDisplayParts(assistantParts);
-                const currentToolCalls = [...toolCalls];
-                const partContent = assistantContent || contentFromParts(currentParts);
-                const partToolCalls = currentToolCalls.length > 0
-                    ? currentToolCalls
-                    : toolCallsFromParts(currentParts);
-                const msg = {
-                    key: nextDisplayMessageKey("asst"),
-                    role: "assistant",
-                    content: partContent,
-                };
-                if (assistantReasoning) {
-                    msg.reasoning = assistantReasoning;
                 }
-                if (partToolCalls.length > 0) {
-                    msg.toolCalls = partToolCalls;
-                }
-                if (currentParts.length > 0) {
-                    msg.parts = currentParts;
+                if (!agent.model) {
+                    addMessage("error", "No model selected. Use /model after /login or provider setup.");
+                    if (runOptions.goalRun && goalStore?.snapshot()?.status === "active") {
+                        goalStore.pause();
+                        addMessage("assistant", stopReasonNotice("error"));
+                    }
+                    return;
                 }
-                if (taskElapsedMs !== undefined && Number.isFinite(taskElapsedMs) && taskElapsedMs > 0) {
-                    msg.taskElapsedMs = taskElapsedMs;
+                const displayContent = formatImageUserDisplayText(displayInput, attachedImages.length, runOptions.imageDisplayStart);
+                if (!runOptions.hidden) {
+                    updateDisplayMessages((prev) => [
+                        ...prev,
+                        withMessageKey({ role: "user", content: displayContent }),
+                    ]);
+                    // Sending is an explicit "watch the newest turn" intent: snap the
+                    // transcript back to the bottom even if the user had scrolled up.
+                    viewportRef.current?.forceScrollToBottom();
                 }
-                updateDisplayMessages((prev) => [...prev, msg]);
-            };
-            const clearAssistantStream = () => {
-                // A timer firing after this reset would resurrect the just-committed
-                // text as a phantom streaming block — cancel before clearing.
-                cancelStreamingFlush();
+                setIsRunning(true);
+                runStartRef.current = Date.now();
                 setStreamingContent("");
                 setStreamingReasoning("");
                 setStreamingTools([]);
                 setStreamingParts([]);
-                assistantContent = "";
-                assistantReasoning = "";
-                toolCalls.length = 0;
-                assistantParts.length = 0;
-            };
-            try {
-                for await (const event of agent.run(actualInput, args.cwd, {
-                    abortSignal: abortController.signal,
-                    inputController,
-                })) {
-                    switch (event.type) {
-                        case "text_delta":
-                            assistantContent += event.content;
-                            appendTextPart(assistantParts, event.content);
-                            scheduleStreamingFlush();
-                            break;
-                        case "reasoning_delta":
-                            assistantReasoning += event.content;
-                            scheduleStreamingFlush();
-                            break;
-                        case "tool_call_start": {
-                            // The LLM has begun emitting this tool call. Args are still
-                            // streaming — render an empty-args placeholder so the user
-                            // sees the tool the moment it appears in the assistant
-                            // response, not after the full arg payload finishes.
-                            if (!toolCalls.some((t) => t.id === event.id)) {
-                                const toolCall = {
-                                    id: event.id,
-                                    name: event.name,
-                                    args: {},
-                                    startedAt: Date.now(),
-                                };
-                                toolCalls.push(toolCall);
-                                appendToolPart(assistantParts, toolCall);
-                                setStreamingTools([...toolCalls]);
-                                syncStreamingParts();
+                let assistantContent = "";
+                let assistantReasoning = "";
+                let goalRunTokens = 0;
+                let goalRunUsageReported = false;
+                let runCancelled = false;
+                let runErrored = false;
+                const toolCalls = [];
+                const assistantParts = [];
+                const abortController = new AbortController();
+                activeAbortRef.current = abortController;
+                setStartingSubmit(null);
+                const inputController = new AgentRunInputQueue(`run-${++nextRunIdRef.current}`);
+                inputControllerRef.current = inputController;
+                const syncStreamingParts = () => {
+                    setStreamingParts(snapshotDisplayParts(assistantParts));
+                };
+                // Text/reasoning deltas arrive far faster than the screen needs to
+                // update; batch them so the full-frame re-render runs at most every
+                // STREAMING_FLUSH_INTERVAL_MS. Tool events stay immediate.
+                let streamingFlushTimer = null;
+                const cancelStreamingFlush = () => {
+                    if (streamingFlushTimer !== null) {
+                        clearTimeout(streamingFlushTimer);
+                        streamingFlushTimer = null;
+                    }
+                };
+                const scheduleStreamingFlush = () => {
+                    if (streamingFlushTimer !== null)
+                        return;
+                    streamingFlushTimer = setTimeout(() => {
+                        streamingFlushTimer = null;
+                        setStreamingContent(assistantContent);
+                        setStreamingReasoning(assistantReasoning);
+                        syncStreamingParts();
+                    }, STREAMING_FLUSH_INTERVAL_MS);
+                };
+                const hasAssistantOutput = () => (!!assistantContent ||
+                    !!assistantReasoning ||
+                    toolCalls.length > 0 ||
+                    assistantParts.length > 0);
+                const commitAssistantMessage = (taskElapsedMs) => {
+                    if (!hasAssistantOutput())
+                        return;
+                    const currentParts = snapshotDisplayParts(assistantParts);
+                    const currentToolCalls = [...toolCalls];
+                    const partContent = assistantContent || contentFromParts(currentParts);
+                    const partToolCalls = currentToolCalls.length > 0
+                        ? currentToolCalls
+                        : toolCallsFromParts(currentParts);
+                    const msg = {
+                        key: nextDisplayMessageKey("asst"),
+                        role: "assistant",
+                        content: partContent,
+                    };
+                    if (assistantReasoning) {
+                        msg.reasoning = assistantReasoning;
+                    }
+                    if (partToolCalls.length > 0) {
+                        msg.toolCalls = partToolCalls;
+                    }
+                    if (currentParts.length > 0) {
+                        msg.parts = currentParts;
+                    }
+                    if (taskElapsedMs !== undefined && Number.isFinite(taskElapsedMs) && taskElapsedMs > 0) {
+                        msg.taskElapsedMs = taskElapsedMs;
+                    }
+                    updateDisplayMessages((prev) => [...prev, msg]);
+                };
+                const clearAssistantStream = () => {
+                    // A timer firing after this reset would resurrect the just-committed
+                    // text as a phantom streaming block — cancel before clearing.
+                    cancelStreamingFlush();
+                    setStreamingContent("");
+                    setStreamingReasoning("");
+                    setStreamingTools([]);
+                    setStreamingParts([]);
+                    assistantContent = "";
+                    assistantReasoning = "";
+                    toolCalls.length = 0;
+                    assistantParts.length = 0;
+                };
+                try {
+                    for await (const event of agent.run(actualInput, args.cwd, {
+                        abortSignal: abortController.signal,
+                        inputController,
+                    })) {
+                        switch (event.type) {
+                            case "text_delta":
+                                assistantContent += event.content;
+                                appendTextPart(assistantParts, event.content);
+                                scheduleStreamingFlush();
+                                break;
+                            case "reasoning_delta":
+                                assistantReasoning += event.content;
+                                scheduleStreamingFlush();
+                                break;
+                            case "tool_call_start": {
+                                // The LLM has begun emitting this tool call. Args are still
+                                // streaming — render an empty-args placeholder so the user
+                                // sees the tool the moment it appears in the assistant
+                                // response, not after the full arg payload finishes.
+                                if (!toolCalls.some((t) => t.id === event.id)) {
+                                    const toolCall = {
+                                        id: event.id,
+                                        name: event.name,
+                                        args: {},
+                                        startedAt: Date.now(),
+                                    };
+                                    toolCalls.push(toolCall);
+                                    appendToolPart(assistantParts, toolCall);
+                                    setStreamingTools([...toolCalls]);
+                                    syncStreamingParts();
+                                }
+                                break;
                             }
-                            break;
-                        }
-                        case "tool_call_delta": {
-                            // Best-effort parse of the partial argument JSON to extract
-                            // identifying fields (path, command, content, …). The buffer
-                            // is incomplete JSON during streaming, so fall back to regex
-                            // peeks on common string fields.
-                            const tc = toolCalls.find((t) => t.id === event.id);
-                            if (tc) {
-                                tc.args = parsePartialArgs(event.arguments, tc.args);
+                            case "tool_call_delta": {
+                                // Best-effort parse of the partial argument JSON to extract
+                                // identifying fields (path, command, content, …). The buffer
+                                // is incomplete JSON during streaming, so fall back to regex
+                                // peeks on common string fields.
+                                const tc = toolCalls.find((t) => t.id === event.id);
+                                if (tc) {
+                                    tc.args = parsePartialArgs(event.arguments, tc.args);
+                                    setStreamingTools([...toolCalls]);
+                                    syncStreamingParts();
+                                }
+                                break;
+                            }
+                            case "tool_call_end": {
+                                // Provider signaled args streaming is complete; agent will
+                                // emit tool_start next. We don't need to do anything visual
+                                // here — the placeholder is already in place and tool_start
+                                // will refresh it with the canonical parsed args.
+                                break;
+                            }
+                            case "tool_start": {
+                                // Tool is about to execute. Upgrade the placeholder created
+                                // by tool_call_start (or append if upstream skipped the
+                                // streaming path).
+                                const existing = toolCalls.find((t) => t.id === event.id);
+                                if (existing) {
+                                    existing.args = event.args;
+                                    existing.startedAt = existing.startedAt ?? Date.now();
+                                }
+                                else {
+                                    const toolCall = {
+                                        id: event.id,
+                                        name: event.name,
+                                        args: event.args,
+                                        startedAt: Date.now(),
+                                    };
+                                    toolCalls.push(toolCall);
+                                    appendToolPart(assistantParts, toolCall);
+                                }
                                 setStreamingTools([...toolCalls]);
                                 syncStreamingParts();
+                                break;
                             }
-                            break;
-                        }
-                        case "tool_call_end": {
-                            // Provider signaled args streaming is complete; agent will
-                            // emit tool_start next. We don't need to do anything visual
-                            // here — the placeholder is already in place and tool_start
-                            // will refresh it with the canonical parsed args.
-                            break;
-                        }
-                        case "tool_start": {
-                            // Tool is about to execute. Upgrade the placeholder created
-                            // by tool_call_start (or append if upstream skipped the
-                            // streaming path).
-                            const existing = toolCalls.find((t) => t.id === event.id);
-                            if (existing) {
-                                existing.args = event.args;
-                                existing.startedAt = existing.startedAt ?? Date.now();
+                            case "tool_end": {
+                                const tc = toolCalls.find((t) => t.id === event.id);
+                                if (tc) {
+                                    tc.result = event.result.content;
+                                    tc.isError = event.result.isError;
+                                    tc.metadata = event.result.metadata;
+                                    setStreamingTools([...toolCalls]);
+                                    syncStreamingParts();
+                                }
+                                break;
                             }
-                            else {
-                                const toolCall = {
-                                    id: event.id,
-                                    name: event.name,
-                                    args: event.args,
-                                    startedAt: Date.now(),
-                                };
-                                toolCalls.push(toolCall);
-                                appendToolPart(assistantParts, toolCall);
+                            case "tool_update": {
+                                const tc = toolCalls.find((t) => t.id === event.id);
+                                if (tc) {
+                                    tc.metadata = mergeToolMetadata(tc.metadata, event.update.metadata);
+                                    if (event.update.message) {
+                                        tc.result = event.update.message;
+                                    }
+                                    tc.isError = event.update.status === "failed"
+                                        || event.update.status === "blocked"
+                                        || event.update.status === "cancelled";
+                                    setStreamingTools([...toolCalls]);
+                                    syncStreamingParts();
+                                }
+                                break;
                             }
-                            setStreamingTools([...toolCalls]);
-                            syncStreamingParts();
-                            break;
-                        }
-                        case "tool_end": {
-                            const tc = toolCalls.find((t) => t.id === event.id);
-                            if (tc) {
-                                tc.result = event.result.content;
-                                tc.isError = event.result.isError;
-                                tc.metadata = event.result.metadata;
-                                setStreamingTools([...toolCalls]);
-                                syncStreamingParts();
+                            case "todos_updated": {
+                                setTodos(event.todos);
+                                break;
                             }
-                            break;
-                        }
-                        case "tool_update": {
-                            const tc = toolCalls.find((t) => t.id === event.id);
-                            if (tc) {
-                                tc.metadata = mergeToolMetadata(tc.metadata, event.update.metadata);
-                                if (event.update.message) {
-                                    tc.result = event.update.message;
+                            case "mode_changed": {
+                                setPermissionMode(event.mode);
+                                sessionManager?.appendMarker("mode_switch", event.mode);
+                                break;
+                            }
+                            case "input_applied": {
+                                // The steer joined the current turn at the next model-call
+                                // boundary. Move it after the just-finished tool/assistant
+                                // turn instead of clearing the badge in its original
+                                // placeholder position.
+                                const steer = pendingSteersRef.current.get(event.id);
+                                if (steer) {
+                                    pendingSteersRef.current.delete(event.id);
+                                    setPendingSteerCount(pendingSteersRef.current.size);
+                                    updateDisplayMessages((prev) => moveStatusMessageToEnd(prev, steer.displayKey));
                                 }
-                                tc.isError = event.update.status === "failed"
-                                    || event.update.status === "blocked"
-                                    || event.update.status === "cancelled";
-                                setStreamingTools([...toolCalls]);
-                                syncStreamingParts();
+                                break;
                             }
-                            break;
-                        }
-                        case "todos_updated": {
-                            setTodos(event.todos);
-                            break;
-                        }
-                        case "mode_changed": {
-                            setPermissionMode(event.mode);
-                            sessionManager?.appendMarker("mode_switch", event.mode);
-                            break;
-                        }
-                        case "input_applied": {
-                            // The steer joined the current turn — its placeholder row
-                            // becomes a regular user message (badge cleared).
-                            const steer = pendingSteersRef.current.get(event.id);
-                            if (steer) {
-                                pendingSteersRef.current.delete(event.id);
-                                setPendingSteerCount(pendingSteersRef.current.size);
-                                updateDisplayMessages((prev) => prev.map((message) => message.key === steer.displayKey ? setUserInputStatus(message) : message));
+                            case "input_rejected": {
+                                // No model continuation left in this run: the steer moves to
+                                // the next turn's queue, badge flips to QUEUED.
+                                const steer = pendingSteersRef.current.get(event.id);
+                                if (steer) {
+                                    pendingSteersRef.current.delete(event.id);
+                                    setPendingSteerCount(pendingSteersRef.current.size);
+                                    updateDisplayMessages((prev) => prev.map((message) => message.key === steer.displayKey ? setUserInputStatus(message, "queued") : message));
+                                    queuedInputsRef.current.push({
+                                        payload: { text: event.content, images: [] },
+                                        displayKey: steer.displayKey,
+                                        sessionFile: steer.sessionFile ?? runSessionFile,
+                                    });
+                                    setQueuedCount(queuedInputsRef.current.length);
+                                }
+                                break;
                             }
-                            break;
-                        }
-                        case "input_rejected": {
-                            // No model continuation left in this run: the steer moves to
-                            // the next turn's queue, badge flips to QUEUED.
-                            const steer = pendingSteersRef.current.get(event.id);
-                            if (steer) {
-                                pendingSteersRef.current.delete(event.id);
-                                setPendingSteerCount(pendingSteersRef.current.size);
-                                updateDisplayMessages((prev) => prev.map((message) => message.key === steer.displayKey ? setUserInputStatus(message, "queued") : message));
-                                queuedInputsRef.current.push({
-                                    payload: { text: event.content, images: [] },
-                                    displayKey: steer.displayKey,
-                                });
-                                setQueuedCount(queuedInputsRef.current.length);
+                            case "input_pending_changed": {
+                                if (event.pending === 0 && pendingSteersRef.current.size > 0) {
+                                    pendingSteersRef.current.clear();
+                                }
+                                setPendingSteerCount(event.pending === 0 ? 0 : event.pending);
+                                break;
                             }
-                            break;
-                        }
-                        case "input_pending_changed": {
-                            if (event.pending === 0 && pendingSteersRef.current.size > 0) {
-                                pendingSteersRef.current.clear();
+                            case "turn_end": {
+                                if (event.usage) {
+                                    goalRunUsageReported = true;
+                                    goalRunTokens += tokenUsageTotal(event.usage);
+                                }
+                                if (event.willContinue) {
+                                    commitAssistantMessage();
+                                    clearAssistantStream();
+                                    break;
+                                }
+                                commitAssistantMessage(runStartRef.current ? Date.now() - runStartRef.current : undefined);
+                                clearAssistantStream();
+                                break;
                             }
-                            setPendingSteerCount(event.pending === 0 ? 0 : event.pending);
-                            break;
                         }
-                        case "turn_end": {
-                            if (event.willContinue) {
-                                syncStreamingParts();
-                                break;
+                    }
+                }
+                catch (err) {
+                    commitAssistantMessage();
+                    if (err instanceof AgentAbortError || err?.name === "AbortError") {
+                        runCancelled = true;
+                        updateDisplayMessages(() => reconstructDisplayMessages(agent.messages));
+                    }
+                    else {
+                        runErrored = true;
+                        updateDisplayMessages((prev) => [
+                            ...prev,
+                            withMessageKey({ role: "error", content: err.message }),
+                        ]);
+                    }
+                }
+                finally {
+                    cancelStreamingFlush();
+                    // Leftover steers that never reached a model-call boundary: drop
+                    // them on cancel (the user asked the run to stop); requeue them for
+                    // the next turn on a normal end.
+                    const cancelled = abortController.signal.aborted;
+                    if (cancelled)
+                        runCancelled = true;
+                    for (const leftover of inputController.clear()) {
+                        const steer = pendingSteersRef.current.get(leftover.id);
+                        pendingSteersRef.current.delete(leftover.id);
+                        if (cancelled) {
+                            if (steer) {
+                                updateDisplayMessages((prev) => prev.filter((message) => message.key !== steer.displayKey));
                             }
-                            commitAssistantMessage(runStartRef.current ? Date.now() - runStartRef.current : undefined);
-                            clearAssistantStream();
-                            break;
+                            continue;
+                        }
+                        if (steer) {
+                            updateDisplayMessages((prev) => prev.map((message) => message.key === steer.displayKey ? setUserInputStatus(message, "queued") : message));
                         }
+                        queuedInputsRef.current.push({
+                            payload: { text: leftover.content, images: [] },
+                            displayKey: steer?.displayKey,
+                            sessionFile: steer?.sessionFile ?? runSessionFile,
+                        });
                     }
+                    setPendingSteerCount(0);
+                    setQueuedCount(queuedInputsRef.current.length);
+                    if (inputControllerRef.current === inputController)
+                        inputControllerRef.current = null;
+                    if (activeAbortRef.current === abortController)
+                        activeAbortRef.current = null;
+                    setIsRunning(false);
+                    runStartRef.current = null;
+                    setStreamingContent("");
+                    setStreamingReasoning("");
+                    setStreamingTools([]);
+                    setStreamingParts([]);
+                    maybeContinueGoal({
+                        runCancelled,
+                        runErrored,
+                        isGoalRun: !!runOptions.goalRun,
+                        runTokens: goalRunTokens,
+                        usageReported: goalRunUsageReported,
+                    });
                 }
-            }
-            catch (err) {
-                commitAssistantMessage();
-                if (err instanceof AgentAbortError || err?.name === "AbortError") {
-                    updateDisplayMessages(() => reconstructDisplayMessages(agent.messages));
+            };
+            const kickGoalTurn = (prompt, visibleInput) => {
+                if (activeAbortRef.current)
+                    return;
+                queueMicrotask(() => {
+                    void runAgentInput(prompt, visibleInput ?? "", [], {
+                        hidden: visibleInput === undefined,
+                        goalRun: true,
+                    });
+                });
+            };
+            function maybeContinueGoal(input) {
+                if (!goalStore || exitRequestedRef.current)
+                    return;
+                const current = goalStore.snapshot();
+                if (!current)
+                    return;
+                if (input.runCancelled || input.runErrored) {
+                    if (current.status === "active") {
+                        goalStore.pause();
+                        addMessage("assistant", stopReasonNotice(input.runErrored ? "error" : "cancelled"));
+                    }
+                    return;
                 }
-                else {
-                    updateDisplayMessages((prev) => [
-                        ...prev,
-                        withMessageKey({ role: "error", content: err.message }),
-                    ]);
+                if (input.isGoalRun) {
+                    if (input.usageReported) {
+                        if (input.runTokens > 0)
+                            goalStore.addTokens(input.runTokens);
+                    }
+                    else {
+                        goalStore.markTokenUsageUnavailable();
+                    }
+                    goalStore.incrementTurn();
+                }
+                const goal = goalStore.snapshot();
+                const decision = shouldContinueGoal({
+                    goal,
+                    queuedInputs: queuedInputsRef.current.length,
+                });
+                if (decision.continue) {
+                    kickGoalTurn(formatInternalContextBlock("goal", continuationPrompt(goal)));
+                    return;
                 }
+                if (decision.reason === "budget" && goal.status === "active") {
+                    goalStore.markBudgetLimited();
+                }
+                if (decision.reason === "complete") {
+                    addMessage("assistant", goalCompleteNotice(goal));
+                    return;
+                }
+                const note = stopReasonNotice(decision.reason);
+                if (note)
+                    addMessage("assistant", note);
             }
-            finally {
-                cancelStreamingFlush();
-                // Leftover steers that never reached a model-call boundary: drop
-                // them on cancel (the user asked the run to stop); requeue them for
-                // the next turn on a normal end (mirrors the OpenTUI run teardown).
-                const cancelled = abortController.signal.aborted;
-                for (const leftover of inputController.clear()) {
-                    const steer = pendingSteersRef.current.get(leftover.id);
-                    pendingSteersRef.current.delete(leftover.id);
-                    if (cancelled) {
-                        if (steer) {
-                            updateDisplayMessages((prev) => prev.filter((message) => message.key !== steer.displayKey));
+            const handleGoalCommand = async (goalInput) => {
+                if (!goalStore) {
+                    addMessage("error", "Goals are not available in this session.");
+                    return;
+                }
+                const command = parseGoalCommand(goalInput);
+                if (command.error) {
+                    addMessage("error", command.error);
+                    return;
+                }
+                const existing = goalStore.snapshot();
+                switch (command.kind) {
+                    case "show": {
+                        addMessage("assistant", existing ? goalSummaryText(existing) : "No active goal. Set one with /goal <objective>");
+                        return;
+                    }
+                    case "clear": {
+                        if (!existing) {
+                            addMessage("assistant", "No active goal to clear");
+                            return;
                         }
-                        continue;
+                        goalStore.clear();
+                        addMessage("assistant", "Goal cleared");
+                        return;
+                    }
+                    case "pause": {
+                        if (!existing) {
+                            addMessage("assistant", "No active goal to pause");
+                            return;
+                        }
+                        goalStore.pause();
+                        addMessage("assistant", "Goal paused — /goal resume to continue");
+                        return;
+                    }
+                    case "resume": {
+                        if (!existing) {
+                            addMessage("assistant", "No goal to resume. Set one with /goal <objective>");
+                            return;
+                        }
+                        const resumed = goalStore.resume();
+                        if (resumed?.status === "active") {
+                            addMessage("assistant", "Goal resumed");
+                            kickGoalTurn(formatInternalContextBlock("goal", continuationPrompt(resumed)));
+                        }
+                        else {
+                            addMessage("assistant", "Goal cannot be resumed (already complete)");
+                        }
+                        return;
+                    }
+                    case "edit": {
+                        if (!existing) {
+                            addMessage("assistant", "No active goal to edit. Set one with /goal <objective>");
+                            return;
+                        }
+                        goalStore.edit(command.objective);
+                        if (command.tokenBudget !== undefined)
+                            goalStore.setBudget(command.tokenBudget);
+                        addMessage("assistant", `Goal updated: ${truncate(goalStore.snapshot().objective, 60)}`);
+                        return;
                     }
-                    if (steer) {
-                        updateDisplayMessages((prev) => prev.map((message) => message.key === steer.displayKey ? setUserInputStatus(message, "queued") : message));
+                    case "set": {
+                        const goal = goalStore.set(command.objective, { tokenBudget: command.tokenBudget });
+                        const budgetNote = goal.tokenBudget !== undefined ? ` (budget ${goal.tokenBudget} tok)` : "";
+                        addMessage("assistant", `Goal set${budgetNote} — working autonomously. /goal pause to stop.`);
+                        kickGoalTurn(formatInternalContextBlock("goal", initialPrompt(goal)), goalInput.trim());
+                        return;
                     }
-                    queuedInputsRef.current.push({
-                        payload: { text: leftover.content, images: [] },
-                        displayKey: steer?.displayKey,
+                }
+            };
+            // Slash commands and skill invocations drop any attached images —
+            // they're meant for pure command routing.
+            if (displayInput.startsWith("/")) {
+                // Fast-path `/quit` and `/exit` before slash-registry / skill
+                // resolution. This guarantees a literal "/quit" always exits even if
+                // a skill or alias of the same name is later registered. The
+                // canonical handler still lives in slash-commands/commands.ts so
+                // `/help` and the slash menu can list it; both paths end up calling
+                // requestExit().
+                if (/^\/(?:quit|exit)\s*$/.test(input.trim())) {
+                    requestExit();
+                    return;
+                }
+                if (/^\/(?:thinking|toggle-thinking)(?:\s|$)/.test(input.trim())) {
+                    setShowThinking((current) => {
+                        const next = !current;
+                        addMessage("assistant", next ? "Thinking blocks visible" : "Thinking blocks hidden");
+                        return next;
                     });
+                    return;
                 }
-                setPendingSteerCount(0);
-                setQueuedCount(queuedInputsRef.current.length);
-                if (inputControllerRef.current === inputController)
-                    inputControllerRef.current = null;
-                if (activeAbortRef.current === abortController)
-                    activeAbortRef.current = null;
-                setIsRunning(false);
-                runStartRef.current = null;
-                setStreamingContent("");
-                setStreamingReasoning("");
-                setStreamingTools([]);
-                setStreamingParts([]);
-            }
-        };
-        // Slash commands and skill invocations drop any attached images —
-        // they're meant for pure command routing.
-        if (displayInput.startsWith("/")) {
-            // Fast-path `/quit` and `/exit` before slash-registry / skill
-            // resolution. This guarantees a literal "/quit" always exits even if
-            // a skill or alias of the same name is later registered. The
-            // canonical handler still lives in slash-commands/commands.ts so
-            // `/help` and the slash menu can list it; both paths end up calling
-            // requestExit().
-            if (/^\/(?:quit|exit)\s*$/.test(input.trim())) {
-                requestExit();
-                return;
-            }
-            const skillInvocation = parseSkillInvocation(input, safeSkillRegistry);
-            if (skillInvocation) {
-                await runAgentInput(skillInvocation.actualPrompt, displayInput);
-                return;
-            }
-            const { handled, result, inject } = await slashRegistry.execute(input, {
-                agent,
-                addMessage,
-                clearMessages,
-                cwd: args.cwd,
-                exit: () => { requestExit(); },
-                sessionManager,
-                createProvider: createProvider ?? (() => {
-                    throw new Error("Provider creation not available");
-                }),
-                openPicker,
-                openFeedback,
-                fillComposer,
-                registry: safeRegistry,
-                skillRegistry: safeSkillRegistry,
-                bashAllowlist,
-                settingsManager,
-                lspService,
-                mcpManager,
-                hookController,
-                flushMemory,
-                runMemoryCompaction,
-                runMemorySummary,
-                runMemoryRefresh,
-                getThemeMode: () => themeMode,
-                getResolvedTheme: () => themeResolved,
-                setThemeMode: applyThemeMode,
-            });
-            if (handled) {
-                if (agent.mode !== permissionMode) {
-                    setPermissionMode(agent.mode);
+                if (/^\/(?:trace|verbose|debug)(?:\s|$)/.test(input.trim())) {
+                    setVerboseTrace((current) => {
+                        const next = !current;
+                        addMessage("assistant", next ? "Verbose trace visible" : "Compact trace visible");
+                        return next;
+                    });
+                    return;
                 }
-                if (result) {
-                    // `/compact` rewrites agent.messages, so the Ink transcript needs to
-                    // be rebuilt from the new agent state before appending the summary
-                    // card; otherwise the pre-compaction history would keep rendering.
-                    if (result.startsWith("✓ Compaction complete")) {
-                        const summary = latestCompactionSummary(agent.messages);
-                        updateDisplayMessages(() => [
-                            ...reconstructDisplayMessages(agent.messages),
-                            {
-                                role: "assistant",
-                                content: result,
-                                syntheticKind: "ui_compact_summary",
-                                compactionSummary: summary,
-                            },
-                        ]);
+                if (/^\/write-previews(?:\s|$)/.test(input.trim())) {
+                    setExpandedToolOutput((current) => {
+                        const next = !current;
+                        addMessage("assistant", next ? "Write previews expanded" : "Write previews collapsed");
+                        return next;
+                    });
+                    return;
+                }
+                if (/^\/goal(?:\s|$)/.test(input.trim())) {
+                    await handleGoalCommand(input);
+                    return;
+                }
+                const skillInvocation = parseSkillInvocation(input, safeSkillRegistry);
+                if (skillInvocation) {
+                    await runAgentInput(skillInvocation.actualPrompt, displayInput);
+                    return;
+                }
+                const { handled, result, inject } = await slashRegistry.execute(input, {
+                    agent,
+                    addMessage,
+                    clearMessages,
+                    cwd: args.cwd,
+                    exit: () => { requestExit(); },
+                    sessionManager,
+                    createProvider: createProvider ?? (() => {
+                        throw new Error("Provider creation not available");
+                    }),
+                    openPicker,
+                    openSessionPicker,
+                    openRewindPicker,
+                    openFeedback,
+                    fillComposer,
+                    registry: safeRegistry,
+                    skillRegistry: safeSkillRegistry,
+                    bashAllowlist,
+                    settingsManager,
+                    lspService,
+                    mcpManager,
+                    hookController,
+                    flushMemory,
+                    runMemoryCompaction,
+                    runMemorySummary,
+                    runMemoryRefresh,
+                    getThemeMode: () => themeMode,
+                    getResolvedTheme: () => themeResolved,
+                    setThemeMode: applyThemeMode,
+                    toggleSidebar,
+                    setSidebarMode: applySidebarMode,
+                    openStats: openStatsPanel,
+                });
+                if (handled) {
+                    if (agent.mode !== permissionMode) {
+                        setPermissionMode(agent.mode);
                     }
-                    else if (result.startsWith("⏪")) {
-                        // /rewind truncated agent.messages — rebuild the transcript from
-                        // the rewound state before appending the summary.
-                        updateDisplayMessages(() => [
-                            ...reconstructDisplayMessages(agent.messages),
-                            { role: "assistant", content: result },
-                        ]);
+                    if (result) {
+                        // `/compact` rewrites agent.messages, so the Ink transcript needs to
+                        // be rebuilt from the new agent state before appending the summary
+                        // card; otherwise the pre-compaction history would keep rendering.
+                        if (result.startsWith("✓ Compaction complete")) {
+                            const summary = latestCompactionSummary(agent.messages);
+                            updateDisplayMessages(() => [
+                                ...reconstructDisplayMessages(agent.messages),
+                                {
+                                    role: "assistant",
+                                    content: result,
+                                    syntheticKind: "ui_compact_summary",
+                                    compactionSummary: summary,
+                                },
+                            ]);
+                        }
+                        else if (result.startsWith("⏪")) {
+                            // /rewind truncated agent.messages — rebuild the transcript from
+                            // the rewound state before appending the summary.
+                            updateDisplayMessages(() => [
+                                ...reconstructDisplayMessages(agent.messages),
+                                { role: "assistant", content: result },
+                            ]);
+                        }
+                        else {
+                            addMessage("assistant", result);
+                        }
                     }
-                    else {
-                        addMessage("assistant", result);
+                    if (inject) {
+                        await runAgentInput(inject, displayInput);
                     }
+                    return;
                 }
-                if (inject) {
-                    await runAgentInput(inject, displayInput);
-                }
-                return;
+            }
+            const expansion = await expandAtMentions(input, args.cwd);
+            if (expansion.missing.length > 0) {
+                addMessage("error", `Could not resolve @mention: ${expansion.missing.join(", ")}`);
+            }
+            for (const skip of expansion.skipped) {
+                if (skip.reason !== "too large")
+                    addMessage("error", `Skipped @${skip.path}: ${skip.reason}`);
+            }
+            const agentInput = images.length > 0
+                ? [
+                    ...(expansion.text ? [{ type: "text", text: expansion.text }] : []),
+                    ...images.map((img) => ({
+                        type: "image_url",
+                        image_url: { url: img.dataUrl },
+                    })),
+                ]
+                : expansion.text;
+            await runAgentInput(agentInput, displayInput, images.map((img) => ({ filename: img.filename, bytes: img.bytes })), { imageDisplayStart: normalized.imageDisplayStart });
+        }
+        finally {
+            if (startingSubmitFingerprintRef.current === submitFingerprint) {
+                setStartingSubmit(null);
             }
         }
-        const expansion = await expandAtMentions(input, args.cwd);
-        if (expansion.missing.length > 0) {
-            addMessage("error", `Could not resolve @mention: ${expansion.missing.join(", ")}`);
-        }
-        for (const skip of expansion.skipped) {
-            if (skip.reason !== "too large")
-                addMessage("error", `Skipped @${skip.path}: ${skip.reason}`);
-        }
-        const agentInput = images.length > 0
-            ? [
-                ...(expansion.text ? [{ type: "text", text: expansion.text }] : []),
-                ...images.map((img) => ({
-                    type: "image_url",
-                    image_url: { url: img.dataUrl },
-                })),
-            ]
-            : expansion.text;
-        await runAgentInput(agentInput, displayInput, images.map((img) => ({ filename: img.filename, bytes: img.bytes })));
-    }, [addMessage, agent, args.cwd, openPicker, createProvider, fillComposer, safeRegistry, safeSkillRegistry, updateDisplayMessages, queueInput, submitSteer, requestExit]);
+    }, [addMessage, agent, args.cwd, openPicker, openSessionPicker, openRewindPicker, openStatsPanel, createProvider, currentSessionFile, fillComposer, prepareSubmitDisplay, safeRegistry, safeSkillRegistry, updateDisplayMessages, queueInput, submitSteer, requestExit, toggleSidebar, applySidebarMode, setStartingSubmit]);
     // Drain the queue once the run ends and no modal needs the user first.
     // The placeholder row is removed right before resubmitting — handleSubmit
     // renders the message again as a regular user row.
     const drainQueuedInput = useCallback(() => {
         if (activeAbortRef.current)
             return;
-        if (pendingPlan || pendingApproval || pendingQuestion || pendingFeedback || pickerMode)
+        if (startingSubmitFingerprintRef.current)
+            return;
+        if (pendingPlan || pendingApproval || pendingQuestion || pendingFeedback || pickerMode || statsPanel)
             return;
         const next = queuedInputsRef.current.shift();
         if (!next)
@@ -1149,16 +1605,20 @@ export function App({ agent, args, sessionManager, createProvider, registry, ski
         if (next.displayKey) {
             updateDisplayMessages((prev) => prev.filter((message) => message.key !== next.displayKey));
         }
+        if (!isQueuedInputForCurrentSession(next, currentSessionFile()))
+            return;
         void handleSubmit(next.payload);
-    }, [pendingPlan, pendingApproval, pendingQuestion, pendingFeedback, pickerMode, updateDisplayMessages, handleSubmit]);
+    }, [pendingPlan, pendingApproval, pendingQuestion, pendingFeedback, pickerMode, statsPanel, currentSessionFile, updateDisplayMessages, handleSubmit]);
     useEffect(() => {
         if (isRunning || queuedCount === 0)
             return;
-        if (pendingPlan || pendingApproval || pendingQuestion || pendingFeedback || pickerMode)
+        if (startingSubmitFingerprint)
+            return;
+        if (pendingPlan || pendingApproval || pendingQuestion || pendingFeedback || pickerMode || statsPanel)
             return;
         const timer = setTimeout(drainQueuedInput, 0);
         return () => clearTimeout(timer);
-    }, [isRunning, queuedCount, pendingPlan, pendingApproval, pendingQuestion, pendingFeedback, pickerMode, drainQueuedInput]);
+    }, [isRunning, queuedCount, startingSubmitFingerprint, pendingPlan, pendingApproval, pendingQuestion, pendingFeedback, pickerMode, statsPanel, drainQueuedInput]);
     const currentProviderId = agent.providerId || safeRegistry.getDefault()?.id;
     const keyTarget = keyProviderId
         ? safeRegistry.getConfigured().find((p) => p.id === keyProviderId)
@@ -1181,7 +1641,9 @@ export function App({ agent, args, sessionManager, createProvider, registry, ski
     const showThinkingLabel = getAvailableThinkingLevels(agent.providerId, agent.apiModel).length > 2
         && thinkingLevel
         && thinkingLevel !== "off";
-    const welcomeBannerNode = showWelcome ? (_jsx(WelcomeBanner, { terminalColumns: terminalColumns, tips: buildTips(agent, safeRegistry), updateNotice: updateNotice, cwd: friendlyCwd(args.cwd), providerId: agent.providerId || safeRegistry.getDefault()?.id, modelLabel: agent.model ? displayModel(agent.model) : undefined, thinkingLabel: showThinkingLabel ? thinkingLevel : undefined })) : null;
+    const welcomeBannerNode = showWelcome ? (_jsx(WelcomeBanner, { terminalColumns: terminalColumns, tips: buildTips(agent, safeRegistry), updateNotice: currentUpdateNotice, cwd: friendlyCwd(args.cwd), providerId: agent.providerId || safeRegistry.getDefault()?.id, modelLabel: agent.model ? displayModel(agent.model) : undefined, thinkingLabel: showThinkingLabel ? thinkingLevel : undefined })) : null;
+    const commandPaletteItems = useMemo(() => buildCommandPaletteItems(safeSkillRegistry), [safeSkillRegistry]);
+    const mcpReconnectItems = useMemo(() => buildMcpReconnectItems(mcpManager), [mcpManager]);
     // One row shorter than the terminal on purpose. A frame that exactly fills
     // the screen makes Ink omit the trailing newline ("fullscreen" mode), and
     // Ink's cursor-only repositioning (buildReturnToBottom) miscalculates by one
@@ -1190,64 +1652,440 @@ export function App({ agent, args, sessionManager, createProvider, registry, ski
     // stdout write). Keeping every frame below viewport height keeps all of
     // Ink's cursor paths on the consistent trailing-newline math.
     const frameRows = Math.max(4, terminalRows - 1);
-    return (_jsx(ThemeProvider, { value: palette, children: _jsxs(Box, { flexDirection: "column", width: terminalColumns, height: frameRows, children: [_jsx(TranscriptViewport, { ref: viewportRef, children: _jsx(Box, { flexDirection: "column", paddingX: 1, paddingTop: 1, flexShrink: 0, children: _jsx(MessageList, { messages: messages, streamingContent: streamingContent, streamingReasoning: streamingReasoning, streamingTools: streamingTools, streamingParts: streamingParts, terminalColumns: terminalColumns, verboseTrace: verboseTrace, pendingApproval: approvalHint, nowTick: nowTick, welcomeBanner: welcomeBannerNode }) }) }), pickerMode === "model" && (_jsx(Box, { paddingX: 1, flexShrink: 0, children: _jsx(ModelPicker, { registry: safeRegistry, current: agent.model, recent: userConfig.getRecentModels(), onSelect: handleModelSelect, onCancel: closePicker }) })), pickerMode === "provider" && (_jsx(Box, { paddingX: 1, flexShrink: 0, children: _jsx(ProviderPicker, { providers: BUILTIN_PROVIDERS
-                            .filter((p) => isUserVisibleProvider(p.id))
-                            .map((p) => {
-                            const configured = safeRegistry.getConfigured().find((item) => item.id === p.id);
-                            const configuredLabel = configured?.apiKey ? "configured" : "needs key";
-                            return {
-                                id: p.id,
-                                name: `${p.name} [${configuredLabel}]`,
-                                enabled: true,
-                            };
-                        }), current: currentProviderId, onSelect: handleProviderSelect, onCancel: closePicker }) })), pickerMode === "provider-add" && (_jsx(Box, { paddingX: 1, flexShrink: 0, children: _jsx(ProviderPicker, { providers: BUILTIN_PROVIDERS
-                            .filter((p) => isUserVisibleProvider(p.id))
-                            .map((p) => ({ id: p.id, name: p.name, enabled: true })), current: currentProviderId, onSelect: handleProviderAddSelect, onCancel: closePicker, title: "Add Provider" }) })), pickerMode === "login" && (_jsx(Box, { paddingX: 1, flexShrink: 0, children: _jsx(ProviderPicker, { providers: BUILTIN_PROVIDERS
-                            .filter((p) => isUserVisibleProvider(p.id) && safeRegistry.supportsOAuth(p.id))
-                            .map((p) => ({ id: p.id, name: p.name, enabled: true })), current: currentProviderId, onSelect: handleLoginProviderSelect, onCancel: closePicker, title: "Select Login Provider" }) })), pickerMode === "logout" && (_jsx(Box, { paddingX: 1, flexShrink: 0, children: _jsx(ProviderPicker, { providers: safeRegistry.getConfigured()
-                            .filter((p) => safeRegistry.getAuthStorage().has(p.id))
-                            .map((p) => ({ id: p.id, name: p.name, enabled: true })), current: currentProviderId, onSelect: handleLogoutProviderSelect, onCancel: closePicker, title: "Select Logout Provider" }) })), pickerMode === "key" && keyTarget && (_jsx(Box, { paddingX: 1, flexShrink: 0, children: _jsx(KeyPicker, { providerName: keyTarget.name, onSubmit: handleKeySubmit, onCancel: () => {
-                            closePicker();
-                            setKeyProviderId(null);
-                        } }) })), pickerMode === "skill" && (_jsx(Box, { paddingX: 1, flexShrink: 0, children: _jsx(SkillPicker, { skills: safeSkillRegistry.summaries(), onSelect: (name) => {
-                            fillComposer(`/${name} `);
-                            closePicker();
-                        }, onCancel: closePicker }) })), pickerMode === "feishu-setup" && (_jsx(Box, { paddingX: 1, flexShrink: 0, children: _jsx(FeishuSetupPicker, { onComplete: (summary) => {
-                            closePicker();
-                            addMessage("assistant", summary);
-                        }, onCancel: () => {
-                            closePicker();
-                            addMessage("assistant", "已取消 Feishu setup。");
-                        } }) })), todos.length > 0 && !pickerMode && !pendingPlan && !pendingQuestion && (_jsx(Box, { paddingX: 1, flexShrink: 0, children: _jsx(TodosPanel, { todos: todos, terminalColumns: terminalColumns }) })), pendingPlan && !pickerMode && !pendingQuestion && (_jsx(Box, { paddingX: 1, flexShrink: 0, children: _jsx(PlanConfirm, { initialPlan: pendingPlan.plan, onApprove: (finalPlan) => {
-                            const resolve = pendingPlan.resolve;
-                            setPendingPlan(null);
-                            resolve({ action: "approve", plan: finalPlan });
-                        }, onReject: (reason) => {
-                            const resolve = pendingPlan.resolve;
-                            setPendingPlan(null);
-                            resolve({ action: "reject", reason });
-                        } }) })), pendingApproval && !pickerMode && !pendingPlan && !pendingQuestion && (_jsx(Box, { paddingX: 1, flexShrink: 0, children: _jsx(ApprovalDialog, { request: pendingApproval.request, onDecision: (decision) => {
-                            const resolve = pendingApproval.resolve;
-                            setPendingApproval(null);
-                            resolve(decision);
-                        }, onAllowBashPrefix: (prefix) => {
-                            bashAllowlist?.add(prefix);
-                        } }) })), pendingQuestion && !pickerMode && !pendingPlan && !pendingApproval && !pendingFeedback && (_jsx(Box, { paddingX: 1, flexShrink: 0, children: _jsx(QuestionDialog, { request: pendingQuestion, onSubmit: (answers) => {
-                            questionController?.reply(pendingQuestion.id, answers);
-                            setPendingQuestion(null);
-                        }, onCancel: () => {
-                            questionController?.reject(pendingQuestion.id);
-                            setPendingQuestion(null);
-                        } }) })), pendingFeedback && !pickerMode && !pendingPlan && !pendingApproval && !pendingQuestion && (_jsx(Box, { paddingX: 1, flexShrink: 0, children: _jsx(FeedbackDialog, { base: pendingFeedback.base, initialDescription: pendingFeedback.initialDescription, onDismiss: () => setPendingFeedback(null), onResult: (result) => {
-                            if (result.kind === "success") {
-                                addMessage("assistant", `Feedback submitted: ${result.url}`);
-                            }
-                            else if (result.kind === "error") {
-                                addMessage("error", `Feedback failed: ${result.message}`);
-                            }
-                        } }) })), !isExiting && isRunning && !pickerMode && !pendingPlan && !pendingApproval && !pendingQuestion && !pendingFeedback && (_jsx(Box, { paddingX: 1, paddingBottom: 1, flexShrink: 0, children: _jsx(WaitingIndicator, { tools: streamingTools, hasStreamingText: streamingContent.length > 0, hasStreamingReasoning: streamingReasoning.length > 0, streamedChars: streamingContent.length + streamingReasoning.length, nowTick: nowTick, pendingSteerCount: pendingSteerCount, queuedCount: queuedCount }) })), !isExiting && !pickerMode && (_jsx(Box, { paddingBottom: 1, flexShrink: 0, children: _jsx(InputBox, { onSubmit: handleSubmit, onQueue: isRunning ? queueInput : undefined, onWheelScroll: (direction, lines) => {
-                            viewportRef.current?.scrollBy(direction === "up" ? -lines : lines);
-                        }, disabled: !!pendingPlan || !!pendingApproval || !!pendingQuestion || !!pendingFeedback, cursorResetEpoch: cursorResetEpoch, draftText: composerDraft?.text, draftEpoch: composerDraft?.epoch, onDraftApplied: clearComposerDraft, skillRegistry: safeSkillRegistry, terminalColumns: terminalColumns, cwd: args.cwd }) })), !isExiting && (_jsx(Box, { flexShrink: 0, children: _jsx(FooterBar, { data: buildFooterData({ mode: permissionMode }) }) }))] }) }));
+    const sidebarWidth = sidebarVisible ? Math.min(42, Math.max(28, Math.floor(terminalColumns * 0.34))) : 0;
+    const mainWidth = Math.max(40, terminalColumns - sidebarWidth);
+    return (_jsx(ThemeProvider, { value: palette, children: _jsxs(Box, { flexDirection: "row", width: terminalColumns, height: frameRows, backgroundColor: palette.background, children: [_jsxs(Box, { flexDirection: "column", width: mainWidth, height: frameRows, backgroundColor: palette.background, children: [_jsx(TranscriptViewport, { ref: viewportRef, children: _jsx(Box, { flexDirection: "column", paddingX: 1, paddingTop: 1, flexShrink: 0, children: _jsx(MessageList, { messages: messages, streamingContent: streamingContent, streamingReasoning: streamingReasoning, streamingTools: streamingTools, streamingParts: streamingParts, terminalColumns: mainWidth, showThinking: showThinking, expandedToolOutput: expandedToolOutput, verboseTrace: verboseTrace, pendingApproval: approvalHint, nowTick: nowTick, welcomeBanner: welcomeBannerNode }) }) }), pickerMode === "model" && (_jsx(Box, { paddingX: 1, flexShrink: 0, children: _jsx(ModelPicker, { registry: safeRegistry, current: agent.model, currentThinkingLevel: thinkingLevel, recent: userConfig.getRecentModels(), onSelect: handleModelSelect, onCancel: closePicker }) })), pickerMode === "provider" && (_jsx(Box, { paddingX: 1, flexShrink: 0, children: _jsx(ProviderPicker, { providers: BUILTIN_PROVIDERS
+                                    .filter((p) => isUserVisibleProvider(p.id))
+                                    .map((p) => {
+                                    const configured = safeRegistry.getConfigured().find((item) => item.id === p.id);
+                                    const configuredLabel = configured?.apiKey ? "configured" : "needs key";
+                                    return {
+                                        id: p.id,
+                                        name: `${p.name} [${configuredLabel}]`,
+                                        enabled: true,
+                                    };
+                                }), current: currentProviderId, onSelect: handleProviderSelect, onCancel: closePicker }) })), pickerMode === "provider-add" && (_jsx(Box, { paddingX: 1, flexShrink: 0, children: _jsx(ProviderPicker, { providers: BUILTIN_PROVIDERS
+                                    .filter((p) => isUserVisibleProvider(p.id))
+                                    .map((p) => ({ id: p.id, name: p.name, enabled: true })), current: currentProviderId, onSelect: handleProviderAddSelect, onCancel: closePicker, title: "Add Provider" }) })), pickerMode === "login" && (_jsx(Box, { paddingX: 1, flexShrink: 0, children: _jsx(ProviderPicker, { providers: BUILTIN_PROVIDERS
+                                    .filter((p) => isUserVisibleProvider(p.id) && safeRegistry.supportsOAuth(p.id))
+                                    .map((p) => ({ id: p.id, name: p.name, enabled: true })), current: currentProviderId, onSelect: handleLoginProviderSelect, onCancel: closePicker, title: "Select Login Provider" }) })), pickerMode === "logout" && (_jsx(Box, { paddingX: 1, flexShrink: 0, children: _jsx(ProviderPicker, { providers: safeRegistry.getConfigured()
+                                    .filter((p) => safeRegistry.getAuthStorage().has(p.id))
+                                    .map((p) => ({ id: p.id, name: p.name, enabled: true })), current: currentProviderId, onSelect: handleLogoutProviderSelect, onCancel: closePicker, title: "Select Logout Provider" }) })), pickerMode === "key" && keyTarget && (_jsx(Box, { paddingX: 1, flexShrink: 0, children: _jsx(KeyPicker, { providerName: keyTarget.name, onSubmit: handleKeySubmit, onCancel: () => {
+                                    closePicker();
+                                    setKeyProviderId(null);
+                                } }) })), pickerMode === "skill" && (_jsx(Box, { paddingX: 1, flexShrink: 0, children: _jsx(SkillPicker, { skills: safeSkillRegistry.summaries(), onSelect: (name) => {
+                                    fillComposer(`/${name} `);
+                                    closePicker();
+                                }, onCancel: closePicker }) })), pickerMode === "slash" && (_jsx(Box, { paddingX: 1, flexShrink: 0, children: _jsx(CommandPalette, { items: commandPaletteItems, terminalColumns: mainWidth, terminalRows: terminalRows, onSelect: (item) => {
+                                    closePicker();
+                                    if (item.action === "insert-skill") {
+                                        fillComposer(`/${item.value} `);
+                                    }
+                                    else {
+                                        void handleSubmit(item.command);
+                                    }
+                                }, onCancel: closePicker }) })), pickerMode === "mcp-reconnect" && (_jsx(Box, { paddingX: 1, flexShrink: 0, children: _jsx(McpReconnectPicker, { items: mcpReconnectItems, terminalColumns: mainWidth, terminalRows: terminalRows, onSelect: (item) => {
+                                    closePicker();
+                                    void handleSubmit(item.command);
+                                }, onCancel: closePicker }) })), pickerMode === "session" && (_jsx(Box, { paddingX: 1, flexShrink: 0, children: _jsx(SessionPicker, { currentCwd: args.cwd, currentSessions: SessionManager.summarizeSessionsForCwd(args.cwd), allSessions: SessionManager.listAllSessions(), onSelect: handleSessionSelect, onCancel: closePicker }) })), pickerMode === "rewind" && sessionManager && (_jsx(Box, { paddingX: 1, flexShrink: 0, children: _jsx(RewindPicker, { sessionManager: sessionManager, terminalColumns: mainWidth, terminalRows: terminalRows, onSelect: (command) => {
+                                    closePicker();
+                                    void handleSubmit(command);
+                                }, onCancel: closePicker }) })), pickerMode === "feishu-setup" && (_jsx(Box, { paddingX: 1, flexShrink: 0, children: _jsx(FeishuSetupPicker, { onComplete: (summary) => {
+                                    closePicker();
+                                    addMessage("assistant", summary);
+                                }, onCancel: () => {
+                                    closePicker();
+                                    addMessage("assistant", "已取消 Feishu setup。");
+                                } }) })), statsPanel && !pickerMode && (_jsx(Box, { paddingX: 1, flexShrink: 0, children: _jsx(StatsPanel, { panel: statsPanel, terminalColumns: mainWidth, terminalRows: terminalRows, onRangeChange: (range) => setStatsPanel((current) => current ? { ...current, range } : current), onCancel: closeStatsPanel }) })), todos.length > 0 && !pickerMode && !statsPanel && !pendingPlan && !pendingQuestion && (_jsx(Box, { paddingX: 1, flexShrink: 0, children: _jsx(TodosPanel, { todos: todos, terminalColumns: terminalColumns }) })), pendingPlan && !pickerMode && !statsPanel && !pendingQuestion && (_jsx(Box, { paddingX: 1, flexShrink: 0, children: _jsx(PlanConfirm, { initialPlan: pendingPlan.plan, onApprove: (finalPlan) => {
+                                    const resolve = pendingPlan.resolve;
+                                    setPendingPlan(null);
+                                    resolve({ action: "approve", plan: finalPlan });
+                                }, onReject: (reason) => {
+                                    const resolve = pendingPlan.resolve;
+                                    setPendingPlan(null);
+                                    resolve({ action: "reject", reason });
+                                } }) })), pendingApproval && !pickerMode && !statsPanel && !pendingPlan && !pendingQuestion && (_jsx(Box, { paddingX: 1, flexShrink: 0, children: _jsx(ApprovalDialog, { request: pendingApproval.request, onDecision: (decision) => {
+                                    const resolve = pendingApproval.resolve;
+                                    setPendingApproval(null);
+                                    resolve(decision);
+                                }, onAllowBashPrefix: (prefix) => {
+                                    bashAllowlist?.add(prefix);
+                                } }) })), pendingQuestion && !pickerMode && !statsPanel && !pendingPlan && !pendingApproval && !pendingFeedback && (_jsx(Box, { paddingX: 1, flexShrink: 0, children: _jsx(QuestionDialog, { request: pendingQuestion, onSubmit: (answers) => {
+                                    questionController?.reply(pendingQuestion.id, answers);
+                                    setPendingQuestion(null);
+                                }, onCancel: () => {
+                                    questionController?.reject(pendingQuestion.id);
+                                    setPendingQuestion(null);
+                                } }) })), pendingFeedback && !pickerMode && !statsPanel && !pendingPlan && !pendingApproval && !pendingQuestion && (_jsx(Box, { paddingX: 1, flexShrink: 0, children: _jsx(FeedbackDialog, { base: pendingFeedback.base, initialDescription: pendingFeedback.initialDescription, onDismiss: () => setPendingFeedback(null), onResult: (result) => {
+                                    if (result.kind === "success") {
+                                        addMessage("assistant", `Feedback submitted: ${result.url}`);
+                                    }
+                                    else if (result.kind === "error") {
+                                        addMessage("error", `Feedback failed: ${result.message}`);
+                                    }
+                                } }) })), !isExiting && isRunning && !pickerMode && !statsPanel && !pendingPlan && !pendingApproval && !pendingQuestion && !pendingFeedback && (_jsx(Box, { paddingX: 1, paddingBottom: 1, flexShrink: 0, backgroundColor: palette.background, children: _jsx(WaitingIndicator, { tools: streamingTools, hasStreamingText: streamingContent.length > 0, hasStreamingReasoning: streamingReasoning.length > 0, streamedChars: streamingContent.length + streamingReasoning.length, nowTick: nowTick, pendingSteerCount: pendingSteerCount, queuedCount: queuedCount }) })), !isExiting && !pickerMode && !statsPanel && (_jsx(Box, { paddingBottom: 1, flexShrink: 0, backgroundColor: palette.background, children: _jsx(InputBox, { onSubmit: handleSubmit, onQueue: isRunning ? queueInput : undefined, disabled: !!pendingPlan || !!pendingApproval || !!pendingQuestion || !!pendingFeedback || !!statsPanel, cursorResetEpoch: cursorResetEpoch, draftText: composerDraft?.text, draftEpoch: composerDraft?.epoch, onDraftApplied: clearComposerDraft, skillRegistry: safeSkillRegistry, localSlashCommands: [...INK_LOCAL_SLASH_COMMANDS], terminalColumns: mainWidth, cwd: args.cwd, sessionFile: currentSessionFile(), nextImageLabelStart: nextImageDisplayLabelStartRef.current }) })), !isExiting && (_jsx(Box, { flexShrink: 0, children: _jsx(FooterBar, { data: buildFooterData({ mode: permissionMode, goalLine }) }) }))] }), sidebarVisible && (_jsx(InkSidebar, { width: sidebarWidth, agent: agent, sessionManager: sessionManager, cwd: args.cwd, mode: permissionMode, goalLine: goalLine, todos: todos, mcpManager: mcpManager, lspService: lspService }))] }) }));
+}
+function buildCommandPaletteItems(skillRegistry) {
+    const items = new Map();
+    const add = (item) => {
+        const key = `${item.action ?? "command"}:${item.value}`;
+        if (!items.has(key))
+            items.set(key, item);
+    };
+    for (const command of INK_LOCAL_SLASH_COMMANDS) {
+        add({
+            label: `/${command.name}`,
+            detail: command.description,
+            value: command.name,
+            command: `/${command.name}`,
+        });
+    }
+    for (const command of slashRegistry.list()) {
+        const source = command.source === "mcp" ? " :mcp" : "";
+        const sourceLabel = command.sourceLabel ? `[${command.sourceLabel}] ` : "";
+        add({
+            label: `/${command.name}${source}`,
+            detail: `${sourceLabel}${command.description}`,
+            value: command.name,
+            command: `/${command.name}`,
+        });
+    }
+    for (const skill of skillRegistry.summaries()) {
+        add({
+            label: `/${skill.name} :skill`,
+            detail: `[${skill.source}] ${skill.description}`,
+            value: skill.name,
+            command: `/${skill.name}`,
+            action: "insert-skill",
+        });
+    }
+    return [...items.values()];
+}
+function buildMcpReconnectItems(mcpManager) {
+    return (mcpManager?.getStates() ?? []).map((state) => {
+        let detail;
+        if (state.status.kind === "connected") {
+            const tools = state.status.tools.length;
+            const prompts = state.status.prompts.length;
+            detail = `connected · ${tools} tool${tools === 1 ? "" : "s"} · ${prompts} prompt${prompts === 1 ? "" : "s"}`;
+        }
+        else if (state.status.kind === "failed") {
+            detail = `failed · ${state.status.error}`;
+        }
+        else {
+            detail = "disabled";
+        }
+        return {
+            label: state.name,
+            detail,
+            value: state.name,
+            command: `/mcp reconnect ${state.name}`,
+        };
+    });
+}
+function CommandPalette({ items, terminalColumns, terminalRows, onSelect, onCancel, }) {
+    return (_jsx(PalettePicker, { title: "Commands", hint: "Type to filter \u00B7 Up/Down choose \u00B7 Enter run \u00B7 Esc cancel", emptyText: "No commands found.", items: items, terminalColumns: terminalColumns, terminalRows: terminalRows, searchable: true, onSelect: onSelect, onCancel: onCancel }));
+}
+function McpReconnectPicker({ items, terminalColumns, terminalRows, onSelect, onCancel, }) {
+    return (_jsx(PalettePicker, { title: "MCP servers", hint: "Up/Down choose \u00B7 Enter or r reconnect \u00B7 Esc cancel", emptyText: "No MCP servers configured.", items: items, terminalColumns: terminalColumns, terminalRows: terminalRows, reconnectAlias: true, onSelect: onSelect, onCancel: onCancel }));
+}
+function PalettePicker({ title, hint, emptyText, items, terminalColumns, terminalRows, searchable = false, reconnectAlias = false, onSelect, onCancel, }) {
+    const theme = useTheme();
+    const [query, setQuery] = useState("");
+    const [selectedIndex, setSelectedIndex] = useState(0);
+    const maxVisible = Math.max(5, Math.min(12, terminalRows - 10));
+    const filtered = useMemo(() => {
+        const needle = query.trim().toLowerCase();
+        if (!needle)
+            return items;
+        return items.filter((item) => item.label.toLowerCase().includes(needle) ||
+            item.detail.toLowerCase().includes(needle) ||
+            item.value.toLowerCase().includes(needle));
+    }, [items, query]);
+    useEffect(() => {
+        setSelectedIndex((current) => Math.min(Math.max(0, filtered.length - 1), current));
+    }, [filtered.length]);
+    useInput((input, key) => {
+        if (isKeyReleaseEvent(key))
+            return;
+        if (key.escape) {
+            onCancel();
+            return;
+        }
+        if (key.return || (reconnectAlias && input.toLowerCase() === "r")) {
+            const item = filtered[selectedIndex];
+            if (item)
+                onSelect(item);
+            return;
+        }
+        if (key.upArrow) {
+            setSelectedIndex((index) => Math.max(0, index - 1));
+            return;
+        }
+        if (key.downArrow) {
+            setSelectedIndex((index) => Math.min(Math.max(0, filtered.length - 1), index + 1));
+            return;
+        }
+        if (key.pageUp) {
+            setSelectedIndex((index) => Math.max(0, index - maxVisible));
+            return;
+        }
+        if (key.pageDown) {
+            setSelectedIndex((index) => Math.min(Math.max(0, filtered.length - 1), index + maxVisible));
+            return;
+        }
+        if (!searchable)
+            return;
+        if (key.backspace || key.delete) {
+            setQuery((current) => current.slice(0, -1));
+            return;
+        }
+        if (isPrintablePickerInput(input) && !key.ctrl && !key.meta) {
+            setQuery((current) => current + input);
+        }
+    });
+    const start = clampWindowStartForIndex(filtered.length, selectedIndex, maxVisible);
+    const visible = filtered.slice(start, start + maxVisible);
+    const labelWidth = Math.max(18, Math.min(36, Math.floor(terminalColumns * 0.32)));
+    const detailWidth = Math.max(20, terminalColumns - labelWidth - 10);
+    return (_jsxs(Box, { flexDirection: "column", marginY: 1, paddingX: 1, borderStyle: "round", borderColor: theme.borderActive, children: [_jsx(Text, { bold: true, color: theme.accent, children: title }), searchable && (_jsxs(Text, { color: theme.muted, children: ["Filter: ", _jsx(Text, { color: theme.userMessageText, children: query || " " })] })), _jsx(Text, { color: theme.muted, children: hint }), _jsxs(Box, { flexDirection: "column", marginTop: 1, children: [filtered.length === 0 && _jsx(Text, { color: theme.muted, children: emptyText }), visible.map((item, offset) => {
+                        const actualIndex = start + offset;
+                        const selected = actualIndex === selectedIndex;
+                        return (_jsxs(Box, { children: [_jsxs(Text, { color: selected ? theme.accent : undefined, children: [selected ? "> " : "  ", truncate(item.label, labelWidth)] }), _jsxs(Text, { color: theme.muted, children: [" ", truncate(item.detail, detailWidth)] })] }, `${item.action ?? "command"}-${item.value}`));
+                    })] })] }));
+}
+const REWIND_SCOPE_ORDER = ["all", "chat", "code"];
+const REWIND_SCOPE_LABEL = {
+    all: "chat + files",
+    chat: "chat only",
+    code: "files only",
+};
+function rewindCommand(turnIndex, scope) {
+    const base = `/rewind ${turnIndex + 1}`;
+    if (scope === "chat")
+        return `${base} --chat`;
+    if (scope === "code")
+        return `${base} --code`;
+    return base;
+}
+function cycleRewindScope(scope, direction) {
+    const index = REWIND_SCOPE_ORDER.indexOf(scope);
+    return REWIND_SCOPE_ORDER[(index + direction + REWIND_SCOPE_ORDER.length) % REWIND_SCOPE_ORDER.length];
+}
+function RewindPicker({ sessionManager, terminalColumns, terminalRows, onSelect, onCancel, }) {
+    const theme = useTheme();
+    const turns = useMemo(() => sessionManager.listUserTurns(), [sessionManager]);
+    const checkpoints = useMemo(() => sessionManager.getCheckpoints(), [sessionManager]);
+    const fileCounts = useMemo(() => {
+        const entries = checkpoints.listEntries();
+        const byTurn = new Map();
+        for (const entry of entries) {
+            const files = byTurn.get(entry.turn);
+            if (files)
+                files.add(entry.path);
+            else
+                byTurn.set(entry.turn, new Set([entry.path]));
+        }
+        return new Map(turns.map((turn) => [turn.id, byTurn.get(turn.id)?.size ?? 0]));
+    }, [checkpoints, turns]);
+    const [selectedIndex, setSelectedIndex] = useState(() => Math.max(0, turns.length - 1));
+    const [scope, setScope] = useState("all");
+    const maxVisible = Math.max(4, Math.min(10, terminalRows - 10));
+    useEffect(() => {
+        setSelectedIndex((current) => Math.min(Math.max(0, turns.length - 1), current));
+    }, [turns.length]);
+    useInput((input, key) => {
+        if (isKeyReleaseEvent(key))
+            return;
+        if (key.escape) {
+            onCancel();
+            return;
+        }
+        if (key.return) {
+            if (turns[selectedIndex])
+                onSelect(rewindCommand(selectedIndex, scope));
+            return;
+        }
+        if (key.upArrow) {
+            setSelectedIndex((index) => Math.max(0, index - 1));
+            return;
+        }
+        if (key.downArrow) {
+            setSelectedIndex((index) => Math.min(Math.max(0, turns.length - 1), index + 1));
+            return;
+        }
+        if (key.pageUp) {
+            setSelectedIndex((index) => Math.max(0, index - maxVisible));
+            return;
+        }
+        if (key.pageDown) {
+            setSelectedIndex((index) => Math.min(Math.max(0, turns.length - 1), index + maxVisible));
+            return;
+        }
+        if (key.tab || key.rightArrow || input === "l") {
+            setScope((current) => cycleRewindScope(current, 1));
+            return;
+        }
+        if (key.leftArrow || input === "h") {
+            setScope((current) => cycleRewindScope(current, -1));
+        }
+    });
+    const start = clampWindowStartForIndex(turns.length, selectedIndex, maxVisible);
+    const visibleTurns = turns.slice(start, start + maxVisible);
+    const previewWidth = Math.max(18, Math.min(76, terminalColumns - 34));
+    return (_jsxs(Box, { flexDirection: "column", marginY: 1, paddingX: 1, borderStyle: "round", borderColor: theme.borderActive, children: [_jsx(Text, { bold: true, color: theme.accent, children: "Rewind" }), _jsxs(Text, { color: theme.muted, children: ["Restore: ", _jsx(Text, { color: theme.accent, children: REWIND_SCOPE_LABEL[scope] }), "  ·  ", turns.length, " point", turns.length === 1 ? "" : "s"] }), _jsx(Text, { color: theme.muted, children: "Up/Down choose \u00B7 Left/Right scope \u00B7 Enter rewind \u00B7 Esc cancel" }), _jsxs(Box, { flexDirection: "column", marginTop: 1, children: [turns.length === 0 && _jsx(Text, { color: theme.muted, children: "Nothing to rewind: no user messages in this session." }), visibleTurns.map((turn, offset) => {
+                        const actualIndex = start + offset;
+                        const isSelected = actualIndex === selectedIndex;
+                        const touched = fileCounts.get(turn.id) ?? 0;
+                        return (_jsx(RewindRow, { turn: turn, turnNumber: actualIndex + 1, selected: isSelected, fileCount: touched, previewWidth: previewWidth }, turn.id));
+                    })] })] }));
+}
+function RewindRow({ turn, turnNumber, selected, fileCount, previewWidth, }) {
+    const theme = useTheme();
+    const time = new Date(turn.timestamp).toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" });
+    const fileNote = fileCount > 0 ? ` · ${fileCount} file${fileCount === 1 ? "" : "s"}` : "";
+    return (_jsxs(Box, { children: [_jsxs(Text, { color: selected ? theme.accent : undefined, children: [selected ? "> " : "  ", String(turnNumber).padStart(2, " "), " ", time, " ", truncate(turn.preview, previewWidth)] }), _jsx(Text, { color: theme.muted, children: fileNote })] }));
+}
+function clampWindowStartForIndex(total, selectedIndex, maxVisible) {
+    if (total <= maxVisible)
+        return 0;
+    const half = Math.floor(maxVisible / 2);
+    let start = Math.max(0, selectedIndex - half);
+    if (start + maxVisible > total)
+        start = total - maxVisible;
+    return Math.max(0, start);
+}
+function StatsPanel({ panel, terminalColumns, terminalRows, onRangeChange, onCancel, }) {
+    const theme = useTheme();
+    const [scroll, setScroll] = useState(0);
+    const bodyWidth = Math.max(48, Math.min(92, terminalColumns - 6));
+    const lines = useMemo(() => formatStatsPanelBody(panel.bundle.ranges[panel.range], bodyWidth).split("\n"), [bodyWidth, panel.bundle, panel.range]);
+    const maxVisible = Math.max(5, Math.min(16, terminalRows - 10));
+    const maxScroll = Math.max(0, lines.length - maxVisible);
+    useEffect(() => {
+        setScroll(0);
+    }, [panel.range]);
+    useEffect(() => {
+        setScroll((current) => Math.min(current, maxScroll));
+    }, [maxScroll]);
+    useInput((input, key) => {
+        if (isKeyReleaseEvent(key))
+            return;
+        if (key.escape) {
+            onCancel();
+            return;
+        }
+        if (key.tab) {
+            onRangeChange(panel.range === "30d" ? "7d" : "30d");
+            return;
+        }
+        if (key.leftArrow || input === "h") {
+            onRangeChange("7d");
+            return;
+        }
+        if (key.rightArrow || input === "l") {
+            onRangeChange("30d");
+            return;
+        }
+        if (key.upArrow) {
+            setScroll((current) => Math.max(0, current - 1));
+            return;
+        }
+        if (key.downArrow) {
+            setScroll((current) => Math.min(maxScroll, current + 1));
+            return;
+        }
+        if (key.pageUp) {
+            setScroll((current) => Math.max(0, current - maxVisible));
+            return;
+        }
+        if (key.pageDown) {
+            setScroll((current) => Math.min(maxScroll, current + maxVisible));
+        }
+    });
+    const visible = lines.slice(scroll, scroll + maxVisible);
+    const generatedAt = panel.bundle.generatedAt.toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" });
+    return (_jsxs(Box, { flexDirection: "column", marginY: 1, paddingX: 1, borderStyle: "round", borderColor: theme.borderActive, children: [_jsx(Text, { bold: true, color: theme.accent, children: "Stats" }), _jsxs(Text, { color: theme.muted, children: [rangeLabel(panel.range), " \u00B7 generated ", generatedAt] }), _jsx(Text, { color: theme.muted, children: "Left/Right range \u00B7 Up/Down scroll \u00B7 Tab toggle \u00B7 Esc close" }), _jsx(Box, { flexDirection: "column", marginTop: 1, children: visible.map((line, index) => {
+                    const key = `${scroll + index}-${line}`;
+                    const heading = line === "Activity" || line === "Model usage" || line === "Summary";
+                    return (_jsx(Text, { color: heading ? theme.accent : undefined, bold: heading, children: line || " " }, key));
+                }) }), maxScroll > 0 && (_jsxs(Text, { color: theme.muted, children: [scroll + 1, "-", Math.min(lines.length, scroll + maxVisible), " of ", lines.length] }))] }));
+}
+function summarizeMcpStates(states) {
+    const summary = { connected: 0, starting: 0, failed: 0, disabled: 0, tools: 0 };
+    for (const state of states) {
+        if (state.status.kind === "connected") {
+            summary.connected += 1;
+            summary.tools += state.status.tools.length;
+        }
+        else if (state.status.kind === "failed") {
+            summary.failed += 1;
+        }
+        else {
+            summary.disabled += 1;
+        }
+    }
+    return summary;
+}
+function summarizeLspStatuses(statuses) {
+    const summary = { connected: 0, starting: 0, failed: 0, disabled: 0 };
+    for (const status of statuses) {
+        if (status.status === "connected")
+            summary.connected += 1;
+        else if (status.status === "starting")
+            summary.starting += 1;
+        else
+            summary.failed += 1;
+    }
+    return summary;
+}
+function formatStatusCount(summary) {
+    const parts = [];
+    if (summary.connected > 0)
+        parts.push(`${summary.connected} up`);
+    if (summary.starting > 0)
+        parts.push(`${summary.starting} starting`);
+    if (summary.failed > 0)
+        parts.push(`${summary.failed} failed`);
+    if (summary.disabled > 0)
+        parts.push(`${summary.disabled} disabled`);
+    return parts.join(" · ") || "none";
+}
+function SidebarSection({ title, children }) {
+    const theme = useTheme();
+    return (_jsxs(Box, { flexDirection: "column", marginBottom: 1, children: [_jsx(Text, { color: theme.accent, bold: true, children: title }), children] }));
+}
+function SidebarRow({ label, value, color, }) {
+    const theme = useTheme();
+    return (_jsxs(Box, { children: [_jsxs(Text, { color: theme.muted, children: [label, ": "] }), _jsx(Text, { color: color ?? theme.userMessageText, children: value })] }));
+}
+function InkSidebar({ width, agent, sessionManager, cwd, mode, goalLine, todos, mcpManager, lspService, }) {
+    const theme = useTheme();
+    const innerWidth = Math.max(12, width - 4);
+    const todoCounts = todos.reduce((acc, todo) => {
+        acc[todo.status] = (acc[todo.status] ?? 0) + 1;
+        return acc;
+    }, {});
+    const todoSummary = todos.length === 0
+        ? "none"
+        : [
+            todoCounts.in_progress ? `${todoCounts.in_progress} active` : "",
+            todoCounts.pending ? `${todoCounts.pending} pending` : "",
+            todoCounts.completed ? `${todoCounts.completed} done` : "",
+        ].filter(Boolean).join(" · ");
+    const mcpStates = mcpManager?.getStates() ?? [];
+    const mcpSummary = summarizeMcpStates(mcpStates);
+    const lspSummary = lspService?.isDisabled()
+        ? { connected: 0, starting: 0, failed: 0, disabled: 1 }
+        : summarizeLspStatuses(lspService?.status() ?? []);
+    const latestMcpFailure = mcpStates.find((state) => state.status.kind === "failed");
+    const latestLspFailure = lspService?.status().find((status) => status.status === "error");
+    const sessionTitle = truncate(sessionDisplayName(sessionManager), innerWidth);
+    const modelLabel = agent.model ? displayModel(agent.model) : "not selected";
+    const route = agent.providerId
+        ? `${agent.providerId}/${modelLabel}`
+        : modelLabel;
+    return (_jsxs(Box, { flexDirection: "column", width: width, height: "100%", borderStyle: "single", borderColor: theme.border, paddingX: 1, paddingY: 1, flexShrink: 0, children: [_jsx(Text, { color: theme.borderActive, bold: true, children: "Session" }), _jsx(Text, { color: theme.userMessageText, children: sessionTitle }), _jsx(Text, { color: theme.muted, children: truncate(friendlyCwd(cwd), innerWidth) }), _jsxs(Box, { marginTop: 1, flexDirection: "column", children: [_jsxs(SidebarSection, { title: "Runtime", children: [_jsx(SidebarRow, { label: "model", value: truncate(route, innerWidth - 7) }), _jsx(SidebarRow, { label: "mode", value: mode, color: mode === "bypassPermissions" ? theme.warning : theme.userMessageText }), _jsx(SidebarRow, { label: "thinking", value: agent.thinking || "off" })] }), goalLine && (_jsx(SidebarSection, { title: "Goal", children: _jsx(Text, { color: theme.userMessageText, children: truncate(goalLine, innerWidth) }) })), _jsx(SidebarSection, { title: "Todos", children: _jsx(Text, { color: todos.length > 0 ? theme.userMessageText : theme.muted, children: truncate(todoSummary, innerWidth) }) }), _jsxs(SidebarSection, { title: "MCP", children: [_jsx(Text, { color: mcpSummary.failed > 0 ? theme.warning : theme.userMessageText, children: truncate(`${formatStatusCount(mcpSummary)}${mcpSummary.tools > 0 ? ` · ${mcpSummary.tools} tools` : ""}`, innerWidth) }), latestMcpFailure?.status.kind === "failed" && (_jsx(Text, { color: theme.muted, children: truncate(latestMcpFailure.status.error, innerWidth) }))] }), _jsxs(SidebarSection, { title: "LSP", children: [_jsx(Text, { color: lspSummary.failed > 0 ? theme.warning : theme.userMessageText, children: truncate(formatStatusCount(lspSummary), innerWidth) }), latestLspFailure?.message && (_jsx(Text, { color: theme.muted, children: truncate(latestLspFailure.message, innerWidth) }))] })] })] }));
 }
 const SPINNER_FRAMES = ["⠋", "⠙", "⠹", "⠸", "⠼", "⠴", "⠦", "⠧", "⠇", "⠏"];
 const GENERIC_PHRASES = [