minimal-agent 0.5.4 → 0.5.6

package/src/ui/App.js

@@ -7,31 +7,175 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  *  不直接处理键盘输入，那是 InputBox 的事。
  * ============================================================
  */
-import React from 'react';
-import { Box, Text, Static } from 'ink';
+import React, { useDeferredValue } from 'react';
+import { Box, Text } from 'ink';
+import { getWorkingDir } from '../bootstrap/workingDir.js';
+import { listArchives, restoreArchive } from '../context/archive.js';
 import { saveContext } from '../context/persistContext.js';
+import { sessionFileFor } from '../context/sessionPath.js';
+import { listSessions } from '../context/sessionRegistry.js';
 import { InputBox } from './InputBox.js';
+import { LiveArea } from './LiveArea.js';
 import { MessageList } from './MessageList.js';
 import { StatusLine } from './StatusLine.js';
-import { ToolStatus } from './ToolStatus.js';
 import { useChat } from './hooks/useChat.js';
-/** ANSI escape: 清屏 + 光标归位 */
+import { useTerminalSize } from './hooks/useTerminalSize.js';
+/**
+ * ANSI escape: 清屏 + 光标归位。
+ *
+ * 注意：项目里仅这两处保留 process.stdout.write 旁路 Ink：
+ *   1) onCompactDone（压缩完）
+ *   2) /new 清空历史后
+ * CLEAR_SCREEN 是**一次性**写入 + 整屏清空的语义，不存在"反复写新内容到 live 区"
+ * 的问题；ESC[2J 清屏后 ink 下次 onRender 会重发完整 lastOutput，lineCount 残留
+ * 也不会留下脏行（写在空白处）。其它"用户看到的非消息内容"必须走 chat.ephemeralLine
+ * 走 Ink 渲染管线，否则会破坏 log-update 计数。
+ */
 const CLEAR_SCREEN = '\x1b[2J\x1b[H';
 export function App({ provider, initialHistory }) {
-    // 持久化挂钩：每次轮次结束 / 清空 / 压缩后由 useChat 触发；fire-and-forget。
-    const onPersist = React.useCallback((messages) => {
-        void saveContext(messages);
-    }, []);
+    // v2 multi-session：持久化路径完全由 useChat 内部管控（按 activeSessionId 选文件）。
+    // App 不再传 onPersist —— 之前 App 端调 saveContext(messages) 会污染 default session。
     const chat = useChat({
         provider,
         initialHistory,
-        onPersist,
         onCompactDone: () => process.stdout.write(CLEAR_SCREEN),
     });
+    // 终端尺寸感知：rows → MessageList 决定窄终端是否折叠 reasoning + LiveArea 收敛预览高；
+    //                cols → LiveArea 逐行截断防换行
+    const { rows: terminalRows, cols: terminalCols } = useTerminalSize();
+    /**
+     * 用 useDeferredValue 把 history 推后到低优先级渲染队列。
+     *
+     * 流式期间 transient state 高频 setState 是高优先级，
+     * 而 MessageList 重算 turn meta + Static reconcile 比较重，可以"等空闲再做"。
+     * React 在繁忙时会让 deferredHistory 保持旧值跳过 MessageList rerender，
+     * 直到 streamingText 稳定下来再 commit 新 history。
+     *
+     * 注意：assistant_message 落定时 history 增长 + streamingText 清空是同一次
+     * runQuery yield —— useDeferredValue 不会无限延迟，最终一定会 catch up，
+     * Static commit 新 message 进 scrollback 不会丢。
+     */
+    const deferredHistory = useDeferredValue(chat.history);
     // /new：内存 reset + 磁盘 clearContext 全部由 chat.clearHistory() 内部完成，await 之后再清屏。
+    // ★ deps 用精细字段 chat.clearHistory，不是整个 chat。
+    //   理由：useChat 返回的 chat 对象每次 useChat 重渲都是新对象字面量引用。
+    //   如果 deps=[chat]，流式期 reasoningPreview/streamingText 每 100ms flush 触发
+    //   useChat rerender → chat 新引用 → handleClear 新引用 → InputBox 收到新 onClear
+    //   prop → 强制重渲 → 整个 live 区被 Ink 重写一次（看起来就是 spinner 每帧打新行）。
     const handleClear = React.useCallback(async () => {
         await chat.clearHistory();
         process.stdout.write(CLEAR_SCREEN);
-    }, [chat]);
-    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Static, { items: [null], children: () => (_jsxs(Box, { marginBottom: 1, children: [_jsx(Text, { color: "cyan", bold: true, children: "minimal-agent" }), _jsx(Text, { color: "gray", children: `  · ${provider.name}/${provider.model} · /new 清空 · /compact 压缩 · /exit 退出 · Ctrl+C 中断` })] })) }), _jsx(MessageList, { history: chat.history, streamingText: chat.streamingText, streamingReasoning: chat.streamingReasoning }), _jsx(ToolStatus, { status: chat.toolStatus, compacting: chat.compacting }), chat.error && (_jsx(Box, { marginBottom: 1, children: _jsxs(Text, { color: "red", children: ["\u26A0 ", chat.error] }) })), chat.interrupted && (_jsx(Box, { marginBottom: 1, children: _jsx(Text, { color: "yellow", children: "\u26A1 \u64CD\u4F5C\u88AB\u7528\u6237\u4E2D\u65AD\uFF0C\u7B49\u5F85\u65B0\u7684\u4EFB\u52A1\u8F93\u5165..." }) })), _jsx(InputBox, { onSubmit: chat.submit, disabled: chat.isLoading, onAbort: chat.abort, onClear: handleClear, onCompact: chat.compactNow }), _jsx(Static, { items: [chat.history.length], children: () => (_jsx(StatusLine, { provider: provider, history: chat.history, pluginProgress: chat.pluginProgress })) })] }));
+    }, [chat.clearHistory]);
+    // history ref：在 handleSubmit 闭包里读最新 chat.history，避免每次流式 flush
+    // 重建 callback；同时避免把 chat.history 放进 deps 导致 InputBox 频繁 rerender。
+    const historyRef = React.useRef(chat.history);
+    React.useEffect(() => {
+        historyRef.current = chat.history;
+    }, [chat.history]);
+    /**
+     * v2 slash 命令拦截层。
+     *
+     * InputBox 已经拦截了 /exit /quit /new /compact 不走 onSubmit；
+     * 其他 / 开头命令落到这里。命中命令走 chat.ephemeralLine() 把提示作为
+     * _ephemeral 的 system 消息推进 history → MessageList <Static> 把它 commit
+     * 进 scrollback；不调 chat.submit 避免被 LLM 当成用户输入。
+     *
+     * 旧方案是 process.stdout.write 旁路 Ink，但那样会破坏 ink log-update 的
+     * previousLineCount 计数，下一帧 eraseLines 用过期 N 去清会留下脏行。
+     *
+     * 支持：
+     *   /session <name>   — 切到指定 session（同 cwd）
+     *   /sessions         — 列当前 cwd 下所有 session
+     *   /list-archive     — 列归档
+     *   /restore <id>     — 恢复归档为当前 session 历史（覆盖+重读）
+     *   /show <id-suffix> — 打印 tool_call_id 末尾匹配的完整 tool result
+     */
+    const handleSubmit = React.useCallback(async (text) => {
+        // /session <name>
+        if (text.startsWith('/session ')) {
+            const id = text.slice('/session '.length).trim();
+            if (id.length === 0) {
+                chat.ephemeralLine('[/session] 用法：/session <name>');
+                return;
+            }
+            await chat.switchSession(id);
+            chat.ephemeralLine(`[/session] 已切换到 session "${id}"`);
+            return;
+        }
+        // /sessions
+        if (text.trim() === '/sessions') {
+            const ids = await listSessions(getWorkingDir());
+            const lines = ids
+                .map((id) => (id === chat.activeSessionId ? `* ${id}` : `  ${id}`))
+                .join('\n');
+            chat.ephemeralLine(`[/sessions] 当前 cwd 下的 session（* = 激活）：\n${lines}`);
+            return;
+        }
+        // /list-archive
+        if (text.trim() === '/list-archive') {
+            const entries = await listArchives();
+            if (entries.length === 0) {
+                chat.ephemeralLine('[/list-archive] 当前 cwd 下无归档。');
+                return;
+            }
+            const lines = entries
+                .slice(0, 30)
+                .map((e) => `  ${e.id}  ·  ${e.msgCount} msgs  ·  ${e.firstUserPreview || '(empty)'}`)
+                .join('\n');
+            const tail = entries.length > 30 ? `\n  ...（共 ${entries.length} 条，仅显示前 30）` : '';
+            chat.ephemeralLine(`[/list-archive] 归档列表（最新优先）：\n${lines}${tail}`);
+            return;
+        }
+        // /restore <id>
+        if (text.startsWith('/restore ')) {
+            const id = text.slice('/restore '.length).trim();
+            if (id.length === 0) {
+                chat.ephemeralLine('[/restore] 用法：/restore <archive-id>');
+                return;
+            }
+            const messages = await restoreArchive(id);
+            if (!messages) {
+                chat.ephemeralLine(`[/restore] 未找到 archive id "${id}"`);
+                return;
+            }
+            // 覆盖当前 active session 文件；强制 reload 让 history 替换
+            const targetFile = sessionFileFor(getWorkingDir(), chat.activeSessionId);
+            await saveContext(messages, targetFile);
+            await chat.switchSession(chat.activeSessionId, { force: true });
+            chat.ephemeralLine(`[/restore] 已恢复 archive ${id} 到 session "${chat.activeSessionId}"（${messages.length} 条消息）`);
+            return;
+        }
+        // /show <id-suffix>
+        if (text.startsWith('/show ')) {
+            const suffix = text.slice('/show '.length).trim();
+            if (suffix.length === 0) {
+                chat.ephemeralLine('[/show] 用法：/show <tool_call_id 末尾 8 字符>');
+                return;
+            }
+            const hit = historyRef.current.find((m) => m.role === 'tool' && m.tool_call_id.endsWith(suffix));
+            if (!hit || hit.role !== 'tool') {
+                chat.ephemeralLine(`[/show] 未找到 tool_call_id 末尾匹配 "${suffix}" 的 tool result`);
+                return;
+            }
+            chat.ephemeralLine(`[tool result · #${hit.tool_call_id.slice(-8)} · 完整 ${hit.content.split('\n').length} 行]\n${hit.content}`);
+            return;
+        }
+        // 非命令 → 走正常 LLM 流程
+        void chat.submit(text);
+    }, 
+    // ★ 精细 deps：用 chat 的具体方法/字段，**不是**整个 chat 对象。
+    //   useChat 每次重渲都返回新的 chat 对象字面量；用 [chat] 会让 handleSubmit
+    //   随每次流式 flush（100ms）重建一次 → InputBox 收到新 onSubmit → 强制重渲
+    //   → Ink 重写 live 区 → spinner 看起来每帧打新行。
+    [
+        chat.ephemeralLine,
+        chat.switchSession,
+        chat.activeSessionId,
+        chat.submit,
+    ]);
+    // banner 改作为 Static items[0] 走 MessageList。原因：Ink 5 的 Static 约定
+    // 它必须是兄弟节点中第一个，否则 above-sibling 会跟 Static commit 一起被重打
+    // 到 stdout（实测看到 banner 反复打印 N 次）。
+    const bannerText = `minimal-agent  · ${provider.name}/${provider.model} · /new 清空 · /compact 压缩 · /exit 退出 · Ctrl+C 中断`;
+    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(MessageList, { history: deferredHistory, compactGeneration: chat.compactGeneration, bannerText: bannerText, terminalRows: terminalRows }), _jsxs(Box, { flexDirection: "column", width: Math.max(1, terminalCols - 1), children: [_jsx(LiveArea, { progressStage: chat.progressStage, reasoningPreview: chat.reasoningPreview, streamingText: chat.streamingText, runningTools: chat.runningTools, pluginProgress: chat.pluginProgress, terminalCols: terminalCols, terminalRows: terminalRows }), chat.error && (_jsx(Box, { marginBottom: 1, children: _jsxs(Text, { color: "red", children: ["\u26A0 ", chat.error] }) })), chat.interrupted && (_jsx(Box, { marginBottom: 1, children: _jsx(Text, { color: "yellow", children: "\u26A1 \u64CD\u4F5C\u88AB\u7528\u6237\u4E2D\u65AD\uFF0C\u7B49\u5F85\u65B0\u7684\u4EFB\u52A1\u8F93\u5165..." }) })), _jsx(InputBox, { onSubmit: handleSubmit, disabled: chat.isLoading, onAbort: chat.abort, onClear: handleClear, onCompact: chat.compactNow }), _jsx(StatusLine, { provider: provider, history: chat.history, pluginProgress: chat.pluginProgress })] })] }));
 }

package/src/ui/InputBox.js

@@ -16,17 +16,21 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  *    - 保留强制刷新但精准控制时机
  * ============================================================
  */
-import { useRef, useState, useCallback } from 'react';
+import React, { useRef, useState, useCallback } from 'react';
 import { Box, Text, useApp, useInput } from 'ink';
 import { useTextBuffer } from './hooks/useTextBuffer.js';
 import { usePasteHandler } from './hooks/usePasteHandler.js';
-export function InputBox({ onSubmit, disabled, onAbort, onClear, onCompact }) {
+import { useInputHistory } from './hooks/useInputHistory.js';
+function InputBoxImpl({ onSubmit, disabled, onAbort, onClear, onCompact }) {
     const buf = useTextBuffer();
+    const hist = useInputHistory();
     const ctrlCCountRef = useRef(0);
     const ctrlCTimerRef = useRef(null);
     const { exit } = useApp();
-    // ✅ 精准刷新计数器：只在必要时触发重渲染
-    const [refreshCounter, setRefreshCounter] = useState(0);
+    // 刷新触发器：值本身不读，只用 setter 触发 InputBoxImpl 重渲（→ BufferView 随父重渲）。
+    const [, setRefreshCounter] = useState(0);
+    // ✅ Ctrl+R 反向搜索模式（null 表示不在搜索）
+    const [searchMode, setSearchMode] = useState(null);
     // ✅ Delete 专用去重：只防止 Windows 双事件，不影响其他键
     const lastDeleteTime = useRef(0);
     const DELETE_DEBOUNCE_MS = 20; // 仅 Delete 键用极短防抖
@@ -61,12 +65,68 @@ export function InputBox({ onSubmit, disabled, onAbort, onClear, onCompact }) {
             return;
         }
         // pasteResult === 'continue'，继续普通处理
+        // ---- ✅ Ctrl+R 反向搜索模式（独占按键流）----
+        if (searchMode !== null) {
+            // ESC 退出搜索
+            if (key.escape) {
+                setSearchMode(null);
+                return;
+            }
+            // Enter 选中并提交
+            if (key.return) {
+                if (searchMode.hit !== null) {
+                    const text = searchMode.hit;
+                    setSearchMode(null);
+                    buf.clear();
+                    forceRefresh();
+                    hist.push(text);
+                    hist.resetCursor();
+                    onSubmit(text);
+                }
+                else {
+                    setSearchMode(null);
+                }
+                return;
+            }
+            // Backspace 削 query；query 削空了退出
+            if (key.backspace || key.delete) {
+                const nextQuery = searchMode.query.slice(0, -1);
+                if (nextQuery.length === 0) {
+                    setSearchMode(null);
+                    return;
+                }
+                const nextHit = hist.search(nextQuery)[0] ?? null;
+                setSearchMode({ query: nextQuery, hit: nextHit });
+                return;
+            }
+            // Ctrl+C 退出搜索（不退出程序）
+            if (key.ctrl && input === 'c') {
+                setSearchMode(null);
+                return;
+            }
+            // 字面字符（排除控制键）追加到 query
+            if (input && !key.ctrl && !key.meta && !key.return && !key.escape) {
+                const nextQuery = searchMode.query + input;
+                const nextHit = hist.search(nextQuery)[0] ?? null;
+                setSearchMode({ query: nextQuery, hit: nextHit });
+                return;
+            }
+            // 其他按键在搜索模式下静默吞掉
+            return;
+        }
         // ---- ESC ----
         if (key.escape) {
             if (disabled)
                 onAbort();
             return;
         }
+        // ---- ✅ Ctrl+R 进入反向搜索（仅在空 buf + 非 disabled）----
+        if (key.ctrl && input === 'r') {
+            if (!disabled && buf.state.text.length === 0) {
+                setSearchMode({ query: '', hit: null });
+            }
+            return;
+        }
         // ---- Ctrl+C ----
         if (key.ctrl && input === 'c') {
             if (buf.state.text.length > 0) {
@@ -96,6 +156,9 @@ export function InputBox({ onSubmit, disabled, onAbort, onClear, onCompact }) {
             const text = buf.state.text.trim();
             if (text.length === 0)
                 return;
+            // 入历史（所有非空提交都记，包括 slash 命令；连续重复 hist 内部去重）
+            hist.push(text);
+            hist.resetCursor();
             if (text === '/exit' || text === '/quit')
                 exit();
             else if (text === '/new' || text === '/clear') {
@@ -133,11 +196,29 @@ export function InputBox({ onSubmit, disabled, onAbort, onClear, onCompact }) {
             return;
         }
         if (key.upArrow) {
+            // 首行按 ↑ → 翻历史；中间行 → 正常移动光标
+            if (buf.layout.cursorRow === 0) {
+                const prev = hist.prev();
+                if (prev !== null) {
+                    buf.setText(prev);
+                    forceRefresh();
+                }
+                return;
+            }
             buf.moveUp();
             forceRefresh();
             return;
         }
         if (key.downArrow) {
+            // 末行按 ↓ → 翻历史；中间行 → 正常移动光标
+            const lastRow = buf.layout.lines.length - 1;
+            if (buf.layout.cursorRow >= lastRow) {
+                const nxt = hist.next();
+                // next 返 null 表示走到 "新输入" 位 → 清空缓冲
+                buf.setText(nxt ?? '');
+                forceRefresh();
+                return;
+            }
             buf.moveDown();
             forceRefresh();
             return;
@@ -213,20 +294,50 @@ export function InputBox({ onSubmit, disabled, onAbort, onClear, onCompact }) {
             forceRefresh();
         }
     });
-    // ✅ 传递 refreshCounter 作为 prop（不放入 key）
-    return (_jsx(BufferView, { buf: buf, disabled: disabled, refreshCounter: refreshCounter }));
+    // ✅ 搜索模式下覆盖整个 BufferView，显示 (reverse-i-search)`<query>': <hit>
+    if (searchMode !== null) {
+        return _jsx(ReverseSearchView, { query: searchMode.query, hit: searchMode.hit });
+    }
+    // BufferView 非 memo：InputBoxImpl 因按键 setState（useTextBuffer 的 buf state
+    // 或 refreshCounter 任一变化）重渲时，BufferView 作为子组件随之重渲、重读 buf.layout。
+    // 故无需把刷新计数透传给它（透传是冗余的）。
+    return _jsx(BufferView, { buf: buf, disabled: disabled });
+}
+/**
+ * v2.x 修复：用 React.memo 包装 InputBox。
+ *
+ * 根因：App.tsx 之前用 deps=[chat] 包 handleClear / handleSubmit；chat 每次
+ * useChat 重渲都是新对象引用（流式期 reasoningPreview/streamingText 每 100ms flush，
+ * ~10 Hz）→ handleClear / handleSubmit 引用频繁变 → InputBox 收到新 onClear / onSubmit
+ * → 不 memo 时强制重渲 → Ink 收到 InputBox 子树输出变化 → 整个 live 区被重写 →
+ * 看起来 spinner 每帧打新行。
+ *
+ * App.tsx deps 已改为精细字段（chat.clearHistory / chat.submit 等），引用稳定；
+ * 配合此处 React.memo，InputBox 在 onSubmit / onAbort / onClear / onCompact /
+ * disabled 真正变化时才重渲。
+ */
+export const InputBox = React.memo(InputBoxImpl);
+// ---------- 反向搜索视图 ----------
+function ReverseSearchView({ query, hit, }) {
+    // hit 可能含换行；仅展示首行避免撑爆 InputBox
+    const hitFirstLine = hit !== null ? hit.split('\n', 1)[0] : null;
+    const hitDisplay = hitFirstLine === null
+        ? '<no match>'
+        : hit !== null && hit.includes('\n')
+            ? `${hitFirstLine} …`
+            : hitFirstLine;
+    return (_jsxs(Box, { borderStyle: "round", borderColor: "magenta", paddingX: 1, flexDirection: "column", children: [_jsxs(Box, { children: [_jsx(Text, { color: "magenta", bold: true, children: '(reverse-i-search)`' }), _jsx(Text, { color: "yellow", children: query }), _jsx(Text, { color: "magenta", bold: true, children: "': " }), _jsx(Text, { color: hitFirstLine === null ? 'gray' : 'white', children: hitDisplay })] }), _jsx(Box, { children: _jsx(Text, { color: "gray", dimColor: true, children: "Enter \u63D0\u4EA4 \u00B7 ESC \u53D6\u6D88 \u00B7 Backspace \u5220\u5B57\u7B26" }) })] }));
 }
-function BufferView({ buf, disabled, refreshCounter }) {
-    // ✅ 关键：用 useMemo 依赖 refreshCounter，而非改变 key
-    // 这样不会重建组件，只是强制重新计算 layout
+function BufferView({ buf, disabled }) {
+    // buf.layout 由 useTextBuffer 的 useMemo([state]) 维护：父组件每次重渲传入的 buf
+    // 都已带最新 layout，这里直接读即可（BufferView 故意不 memo，随父重渲）。
     const { lines, cursorRow, cursorCol } = buf.layout;
     const promptColor = disabled ? 'gray' : 'cyan';
     const prompt = disabled ? '⏳ ' : '> ';
     return (_jsx(Box, { borderStyle: "round", borderColor: promptColor, paddingX: 1, flexDirection: "column", children: lines.map((line, row) => {
             const isFirst = row === 0;
             const isCursorRow = row === cursorRow && !disabled;
-            // ✅ key 保持稳定（只用 row），避免组件重建
-            // refreshCounter 通过 useMemo 依赖间接触发更新
+            // key 只用 row：保持稳定，避免逐行重建（layout 变化由父级重渲带下来）
             return (_jsxs(Box, { children: [_jsx(Text, { color: promptColor, bold: true, children: isFirst ? prompt : '  ' }), isCursorRow ? _jsx(CursorLine, { line: line, col: cursorCol }) : _jsx(Text, { children: line || ' ' })] }, row));
         }) }));
 }

package/src/ui/LiveArea.js

@@ -0,0 +1,132 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * ============================================================
+ *  src/ui/LiveArea.tsx —— 输入框上方的本轮过程区（有界多行流式 live 区）
+ * ------------------------------------------------------------
+ *  结构（自上而下）：
+ *    ┌ 状态行（恒 1 行）：动画 spinner + 阶段标签 + 已耗时 (+ plugin 进度)
+ *    └ 内容区（0..N 行，有界）：随阶段切换——
+ *        thinking       → reasoningPreview 尾部最近 N 行（gray dim，首行 💭）
+ *        streaming      → streamingText   尾部最近 N 行（默认亮色 = 答案是主角）
+ *        tool_executing → runningTools 逐行人话描述（gray dim）
+ *        compacting/idle→ 无内容行
+ *
+ *  ★ 为什么这样能既"多行打字机 + 流式答案"又**不刷屏**（详见 liveViewport.ts 头部）：
+ *    - INV-1：每行都用 wrapToDisplayLines / clampWidthStart 按 CJK/emoji=2 钳到
+ *      ≤ cols - LIVE_RIGHT_MARGIN → 终端永不自动折行 → ink eraseLines 每帧精确。
+ *    - INV-2：内容区取**尾部最近 N 行**（contentMaxLines 自适应终端高度），保证
+ *      live 区总高度 < 终端行数 → 不触发 ink 的 outputHeight>=rows 全屏重写。
+ *    完整思维链/答案由 <Static>（MessageList）write-once 呈现，不进 live 区。
+ *
+ *  ★ 动画 spinner + 已耗时：非 idle 时挂一个 ~150ms tick 强制 re-render，保证
+ *    "无 token 到达的纯等待期"spinner 仍在跳、秒数仍在走 → 消除"卡住"观感。
+ *    流式内容本身走 useChat 的 100ms 节流；ink 内部 32ms throttle 合并，频率安全。
+ * ============================================================
+ */
+import React, { useEffect, useRef, useState } from 'react';
+import { Box, Text } from 'ink';
+import { LIVE_RIGHT_MARGIN, clampWidthStart, wrapToDisplayLines, } from './liveViewport.js';
+const STAGE_LABELS = {
+    thinking: '思考中',
+    streaming: '回答中',
+    tool_executing: '调用工具',
+    compacting: '压缩历史',
+};
+/** 动画 spinner 帧（charWidth 上界按 2 计；终端实际多为 1，算宽无害）。 */
+const SPINNER_FRAMES = ['✶', '✸', '✹', '✺', '✹', '✷'];
+/** spinner 推进 + 强制 re-render 间隔（ms）。~7Hz，远低于 ink 31Hz throttle，Windows 安全。 */
+const SPINNER_INTERVAL_MS = 150;
+/** 内容区行数硬顶（大终端也不铺满，保持清爽）。 */
+const CONTENT_HARD_CAP = 8;
+/** 终端高度里预留给 status(1) + 输入框(3) + StatusLine(1) + error/interrupt + 安全余量。 */
+const RESERVED_ROWS = 9;
+/** reasoning 行 💭 前缀 / 续行缩进的预留宽度（💭=2 + 空格；上界 4 更稳）。 */
+const REASONING_PREFIX_RESERVE = 4;
+/** 工具 argsPreview fallback 截断长度。 */
+const TOOL_ARGS_MAX = 60;
+/** 内容区最多显示几行：自适应终端高度，留足 status/input 余量（满足 INV-2）。 */
+export function contentMaxLines(terminalRows) {
+    return Math.max(2, Math.min(CONTENT_HARD_CAP, terminalRows - RESERVED_ROWS));
+}
+/** 取数组尾部最近 n 个元素。 */
+function lastN(arr, n) {
+    return arr.length <= n ? arr : arr.slice(arr.length - n);
+}
+function toolDesc(t) {
+    if (t.argsFriendly && t.argsFriendly.length > 0)
+        return t.argsFriendly;
+    const a = t.argsPreview.length > TOOL_ARGS_MAX
+        ? `${t.argsPreview.slice(0, TOOL_ARGS_MAX - 1)}…`
+        : t.argsPreview;
+    return `${t.toolName}(${a})`;
+}
+/**
+ * 纯函数：把一帧的 props（+ 动画 frame / 已耗时秒数）算成 LiveView。
+ * idle 返回 null。导出供单测断言 INV-1（每行宽）/ INV-2（行数）/ 颜色层次。
+ */
+export function buildLiveView(props) {
+    const { progressStage, reasoningPreview, streamingText, runningTools, pluginProgress, terminalCols, terminalRows, frame, elapsedSec, } = props;
+    if (progressStage === 'idle')
+        return null;
+    const stage = progressStage;
+    const maxWidth = Math.max(8, terminalCols - LIVE_RIGHT_MARGIN);
+    const maxLines = contentMaxLines(terminalRows);
+    // ---- 状态行 ----
+    let status = `${frame} ${STAGE_LABELS[stage]} (${elapsedSec}s)`;
+    if (pluginProgress) {
+        status += `  ·  [plugin:${pluginProgress.pluginId}] ${pluginProgress.current}/${pluginProgress.max ?? '?'}${pluginProgress.message ? ` ${pluginProgress.message}` : ''}`;
+    }
+    status = clampWidthStart(status, maxWidth);
+    // ---- 内容区 ----
+    let contentLines = [];
+    let contentDim = true;
+    if (stage === 'thinking' && reasoningPreview.length > 0) {
+        const wrapped = wrapToDisplayLines(reasoningPreview, maxWidth - REASONING_PREFIX_RESERVE);
+        contentLines = lastN(wrapped, maxLines).map((line, i) => i === 0 ? `💭 ${line}` : `   ${line}`);
+        contentDim = true;
+    }
+    else if (stage === 'streaming' && streamingText.length > 0) {
+        contentLines = lastN(wrapToDisplayLines(streamingText, maxWidth), maxLines);
+        contentDim = false; // 答案 = 主角，默认亮色
+    }
+    else if (stage === 'tool_executing' && runningTools.length > 0) {
+        contentLines = lastN(runningTools, maxLines).map((t) => clampWidthStart(`  ${toolDesc(t)}`, maxWidth));
+        contentDim = true;
+    }
+    return {
+        statusLine: status,
+        statusColor: stage === 'compacting' ? 'magenta' : 'cyan',
+        contentLines,
+        contentDim,
+    };
+}
+export const LiveArea = React.memo(function LiveArea(props) {
+    const { progressStage } = props;
+    // 计时起点：idle→非idle 那一刻记下，idle 清零。在 render 中惰性初始化 ref（幂等，安全）。
+    const startRef = useRef(null);
+    if (progressStage === 'idle') {
+        startRef.current = null;
+    }
+    else if (startRef.current === null) {
+        startRef.current = Date.now();
+    }
+    // 非 idle 时 ~150ms tick：强制 re-render，让 spinner/秒数在纯等待期也持续动。
+    const [, setTick] = useState(0);
+    useEffect(() => {
+        if (progressStage === 'idle')
+            return;
+        const timer = setInterval(() => setTick((t) => (t + 1) % 1_000_000), SPINNER_INTERVAL_MS);
+        return () => clearInterval(timer);
+    }, [progressStage]);
+    if (progressStage === 'idle')
+        return null;
+    const now = Date.now();
+    const elapsedSec = startRef.current
+        ? Math.max(0, Math.floor((now - startRef.current) / 1000))
+        : 0;
+    const frame = SPINNER_FRAMES[Math.floor(now / SPINNER_INTERVAL_MS) % SPINNER_FRAMES.length];
+    const view = buildLiveView({ ...props, frame, elapsedSec });
+    if (!view)
+        return null;
+    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { color: view.statusColor, bold: true, wrap: "truncate", children: view.statusLine }), view.contentLines.map((line, i) => (_jsx(Text, { color: view.contentDim ? 'gray' : undefined, dimColor: view.contentDim, wrap: "truncate", children: line.length > 0 ? line : ' ' }, `live-${i}`)))] }));
+});