@wukonglabs/wukong 0.0.19 → 0.0.21

package/dist/tui/app.d.ts

@@ -1,22 +1,21 @@
 /**
- * TUI 主壳 —— 组合 Header / PlanPanel / ThinkingPanel / ToolCards / ResponsePanel / TextInput。
+ * TUI 主壳 —— 组合 StatusBar / PlanPanel / ThinkingPanel / ToolCards / ResponsePanel /
+ * TextInput / HintBar / NoticePanel。
  *
- * ## 职责
- *
- * 1. 持有 TUI 状态(输入、流式文本、thinking、活跃 tool call、step、cache 命中率)
- * 2. 订阅 EventBus:tool_call_start/end、step_start、cache_stat、plan_update(PlanPanel 自行订阅)
- * 3. 接收 onStream 的 content_delta + thinking_delta(通过 streamSinkRef 桥接)
- * 4. 调用 sendMessage 跑 agent;完成后落 lastCompleted
- *
- * ## M2-M5 增强
- *
- * - M2:Header 加 step counter + cache 命中率
- * - M3:ToolCards 独立组件,>5 个折叠
- * - M4:PlanPanel 订阅 plan_update
- * - M5:ThinkingPanel 订阅 thinking_delta(通过 onStream 桥接)
+ * 本次改造(22-tui-revamp-plan.md)集成了:
+ *   - M0:输入框锁死修复(abort 状态自动复位,见 ABORT_RESET_MS)
+ *   - M1:Slash 命令菜单(TextInput 内部导航 + dispatchSlash)
+ *   - M2:状态行 + Spinner + 实时计时(runStartAt + StatusBar)
+ *   - M3:流式响应逐字回归(ResponsePanel 视觉 tail)
+ *   - M4:Tool 卡片人话摘要(tool-cards + tool-summary)
+ *   - M5:输入框圆角边框 + 独立 HintBar
+ *   - M6:主题系统(ThemeProvider 在 run-ink 包 App,本文件用 useTheme)
+ *   - M7:/think 把 thinking 推进 <Static>
+ *   - M8:NoticePanel 独立承载错误
+ *   - M9:? / /keys 键位帮助
  */
 import React from 'react';
-import { CompletedRun } from './response-panel.js';
+import type { CompletedRun } from './response-panel.js';
 import type { EventBus, StreamEvent, ToolAuthorizer } from '@wukonglabs/wukong-agent-sdk';
 /** 流式 sink:App 在 sendMessage 前设置,runInteractive 包成 onStream 传给 agent */
 export type StreamSink = (event: StreamEvent) => void;
@@ -25,33 +24,35 @@ export interface SinkRef {
     current: StreamSink | null;
 }
 export interface AppHandlers {
-    /** 发送消息给 agent;返回 run 的结果 */
     sendMessage: (input: string) => Promise<CompletedRun>;
-    /** EventBus 订阅(用于 tool_call 等事件) */
     eventBus: EventBus;
-    /** 清空当前 session 历史 */
     clearSession: () => Promise<void>;
-    /** 最大 step 数(用于 Header 显示);可选 */
     maxSteps?: number;
-    /**
-     * 触发中断请求(§3.3 M3):TextInput 的 Ctrl+C 调用此方法。
-     * 由 index.ts 注入 abortController.requestAbort,实现两次 Ctrl+C 语义。
-     */
     requestAbort?: () => void;
-    /** 查询当前是否已收到首次中断(用于 App 显示提示) */
     isAbortRequested?: () => boolean;
-    /** 工具授权器(§3.6);交互模式注入,CI 模式不需要 */
     authorizer?: ToolAuthorizer;
+    /** M1:/compact 手动压缩(可选,未启用时命令返回提示) */
+    compactIfNeeded?: () => Promise<void>;
 }
 export interface AppProps {
     model: string;
     sessionUuidShort: string;
     workspaceRoot: string;
     handlers: AppHandlers;
-    /** 初始历史(从持久化文件读取) */
     initialHistory?: string[];
-    /** 由 index.ts 创建的 mutable ref;App 在每次 sendMessage 前写入 sink */
     streamSinkRef: SinkRef;
+    /** CLI 版本号,欢迎屏展示用 */
+    appVersion?: string;
+    /** 已解析到的配置文件路径(若有),欢迎屏展示用 */
+    configPath?: string;
+    /** 当前会话已有记录数 */
+    sessionRecordCount?: number;
+    /** 当前会话是否本次刚创建 */
+    sessionCreated?: boolean;
+    /** 已注册工具数量,欢迎屏展示用 */
+    toolsCount?: number;
+    /** 已加载且可用的技能数量,欢迎屏展示用 */
+    skillsLoaded?: number;
 }
-export declare function App({ model, sessionUuidShort, workspaceRoot, handlers, initialHistory, streamSinkRef, }: AppProps): React.ReactElement;
+export declare function App({ model, sessionUuidShort, workspaceRoot, handlers, initialHistory, streamSinkRef, appVersion, configPath, sessionRecordCount, sessionCreated, toolsCount, skillsLoaded, }: AppProps): React.ReactElement;
 //# sourceMappingURL=app.d.ts.map

package/dist/tui/app.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"app.d.ts","sourceRoot":"","sources":["../../src/tui/app.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;GAgBG;AACH,OAAO,KAAmD,MAAM,OAAO,CAAC;AAGxE,OAAO,EAAgC,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAQjF,OAAO,KAAK,EAEV,QAAQ,EACR,WAAW,EAGX,cAAc,EACf,MAAM,8BAA8B,CAAC;AAEtC,wEAAwE;AACxE,MAAM,MAAM,UAAU,GAAG,CAAC,KAAK,EAAE,WAAW,KAAK,IAAI,CAAC;AAEtD,2DAA2D;AAC3D,MAAM,WAAW,OAAO;IACtB,OAAO,EAAE,UAAU,GAAG,IAAI,CAAC;CAC5B;AAsDD,MAAM,WAAW,WAAW;IAC1B,6BAA6B;IAC7B,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,OAAO,CAAC,YAAY,CAAC,CAAC;IACtD,oCAAoC;IACpC,QAAQ,EAAE,QAAQ,CAAC;IACnB,sBAAsB;IACtB,YAAY,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAClC,iCAAiC;IACjC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,iCAAiC;IACjC,gBAAgB,CAAC,EAAE,MAAM,OAAO,CAAC;IACjC,kCAAkC;IAClC,UAAU,CAAC,EAAE,cAAc,CAAC;CAC7B;AAED,MAAM,WAAW,QAAQ;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,gBAAgB,EAAE,MAAM,CAAC;IACzB,aAAa,EAAE,MAAM,CAAC;IACtB,QAAQ,EAAE,WAAW,CAAC;IACtB,qBAAqB;IACrB,cAAc,CAAC,EAAE,MAAM,EAAE,CAAC;IAC1B,8DAA8D;IAC9D,aAAa,EAAE,OAAO,CAAC;CACxB;AAED,wBAAgB,GAAG,CAAC,EAClB,KAAK,EACL,gBAAgB,EAChB,aAAa,EACb,QAAQ,EACR,cAAmB,EACnB,aAAa,GACd,EAAE,QAAQ,GAAG,KAAK,CAAC,YAAY,CAuR/B"}
+{"version":3,"file":"app.d.ts","sourceRoot":"","sources":["../../src/tui/app.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AACH,OAAO,KAAmD,MAAM,OAAO,CAAC;AAGxE,OAAO,KAAK,EAAiB,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAgBvE,OAAO,KAAK,EAEV,QAAQ,EACR,WAAW,EAGX,cAAc,EACf,MAAM,8BAA8B,CAAC;AAEtC,wEAAwE;AACxE,MAAM,MAAM,UAAU,GAAG,CAAC,KAAK,EAAE,WAAW,KAAK,IAAI,CAAC;AAEtD,2DAA2D;AAC3D,MAAM,WAAW,OAAO;IACtB,OAAO,EAAE,UAAU,GAAG,IAAI,CAAC;CAC5B;AAiBD,MAAM,WAAW,WAAW;IAC1B,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,OAAO,CAAC,YAAY,CAAC,CAAC;IACtD,QAAQ,EAAE,QAAQ,CAAC;IACnB,YAAY,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAClC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,gBAAgB,CAAC,EAAE,MAAM,OAAO,CAAC;IACjC,UAAU,CAAC,EAAE,cAAc,CAAC;IAC5B,sCAAsC;IACtC,eAAe,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;CACvC;AAED,MAAM,WAAW,QAAQ;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,gBAAgB,EAAE,MAAM,CAAC;IACzB,aAAa,EAAE,MAAM,CAAC;IACtB,QAAQ,EAAE,WAAW,CAAC;IACtB,cAAc,CAAC,EAAE,MAAM,EAAE,CAAC;IAC1B,aAAa,EAAE,OAAO,CAAC;IACvB,qBAAqB;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,6BAA6B;IAC7B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,gBAAgB;IAChB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,kBAAkB;IAClB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,qBAAqB;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,yBAAyB;IACzB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,wBAAgB,GAAG,CAAC,EAClB,KAAK,EACL,gBAAgB,EAChB,aAAa,EACb,QAAQ,EACR,cAAmB,EACnB,aAAa,EACb,UAAU,EACV,UAAU,EACV,kBAAsB,EACtB,cAAsB,EACtB,UAAU,EACV,YAAY,GACb,EAAE,QAAQ,GAAG,KAAK,CAAC,YAAY,CA4b/B"}

package/dist/tui/app.js

@@ -1,94 +1,91 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 /**
- * TUI 主壳 —— 组合 Header / PlanPanel / ThinkingPanel / ToolCards / ResponsePanel / TextInput。
+ * TUI 主壳 —— 组合 StatusBar / PlanPanel / ThinkingPanel / ToolCards / ResponsePanel /
+ * TextInput / HintBar / NoticePanel。
  *
- * ## 职责
- *
- * 1. 持有 TUI 状态(输入、流式文本、thinking、活跃 tool call、step、cache 命中率)
- * 2. 订阅 EventBus:tool_call_start/end、step_start、cache_stat、plan_update(PlanPanel 自行订阅)
- * 3. 接收 onStream 的 content_delta + thinking_delta(通过 streamSinkRef 桥接)
- * 4. 调用 sendMessage 跑 agent;完成后落 lastCompleted
- *
- * ## M2-M5 增强
- *
- * - M2:Header 加 step counter + cache 命中率
- * - M3:ToolCards 独立组件,>5 个折叠
- * - M4:PlanPanel 订阅 plan_update
- * - M5:ThinkingPanel 订阅 thinking_delta(通过 onStream 桥接)
+ * 本次改造(22-tui-revamp-plan.md)集成了:
+ *   - M0:输入框锁死修复(abort 状态自动复位,见 ABORT_RESET_MS)
+ *   - M1:Slash 命令菜单(TextInput 内部导航 + dispatchSlash)
+ *   - M2:状态行 + Spinner + 实时计时(runStartAt + StatusBar)
+ *   - M3:流式响应逐字回归(ResponsePanel 视觉 tail)
+ *   - M4:Tool 卡片人话摘要(tool-cards + tool-summary)
+ *   - M5:输入框圆角边框 + 独立 HintBar
+ *   - M6:主题系统(ThemeProvider 在 run-ink 包 App,本文件用 useTheme)
+ *   - M7:/think 把 thinking 推进 <Static>
+ *   - M8:NoticePanel 独立承载错误
+ *   - M9:? / /keys 键位帮助
  */
 import { useState, useCallback, useEffect, useRef } from 'react';
-import { Box, Text, Static, useApp, useStdout } from 'ink';
-import { Header } from './header.js';
-import { ResponsePanel } from './response-panel.js';
-import { ToolCards } from './tool-cards.js';
-import { PlanPanel } from './plan-panel.js';
-import { ThinkingPanel } from './thinking-panel.js';
+import { Box, Text, useApp, useStdout } from 'ink';
 import { TextInput } from './text-input.js';
 import { useInputHistory } from './use-input-history.js';
-import { usePlanState } from './use-plan-state.js';
 import { PermissionCard } from './permission-card.js';
-/** 取文本末尾 N 行(限制动态区流式文本高度,避免超过终端高度触发重绘故障) */
-function tailLines(text, maxLines) {
-    const lines = text.split('\n');
-    if (lines.length <= maxLines)
-        return text;
-    return lines.slice(lines.length - maxLines).join('\n');
-}
-/**
- * 动态区高度硬约束(总和 ≤ 12 行)。
- *
- * 背景:Ink 的动态区通过"光标上移 N 行 + 清行 + 重画"实现就地更新;
- * 当动态区总高度超过终端可视高度时,"上移 N 行"会推到 scrollback 里,
- * 部分终端(如 vscode 内嵌终端)在 scrollback 区里执行"清行"会渲染出
- * 贯穿终端全宽的空线框,视觉上就是"满屏空白线"。
- *
- * 修复:把动态区的每个组件都压到极限低高度,总和 ≤ 12 行,基本能容纳
- * 到任何终端(包括 vscode 20 行的小终端)的可视区内。
- *
- * 分配:
- *   Header      1 行(去掉了 borderStyle)
- *   PlanPanel   最多 4 行(1 摘要 + 3 todo)
- *   Thinking    1 行(永远折叠为摘要)
- *   ToolCards   最多 6 行(1 头 + 2 卡片 × 最多 2 行 + 1 折叠提示;done 卡压成 1 行)
- *   Response    最多 3 行(streamingText tail)
- *   TextInput   1-2 行
- *   快捷键提示  1 行
- *   marginTop   1 行
- *   ─────────
- *   合计       ≤ 19 行(vscode 内嵌终端最小约 20 行,勉强留余量)
- *
- * 注:tools/thinking 现在会保留到用户下一次提交才清空(而不是 run 结束就清),
- * 便于用户回看本轮"用了什么工具、思考了什么"。折叠靠 maxVisible 保证不会
- * 让 tools 数量爆炸击穿高度上限。
- */
-const RESPONSE_TAIL_LINES = 3;
-const PLAN_MAX_VISIBLE = 3;
-const TOOLS_MAX_VISIBLE = 2;
-export function App({ model, sessionUuidShort, workspaceRoot, handlers, initialHistory = [], streamSinkRef, }) {
+import { HintBar } from './hint-bar.js';
+import { NoticePanel } from './notice-panel.js';
+import { useTheme } from './theme/context.js';
+import { isThemeName } from './theme/theme.js';
+import { KEYS_HELP } from './keys-help.js';
+import { parseSlashCommand } from './slash/parse.js';
+import { MainArea } from './main-area.js';
+import { Welcome } from './welcome.js';
+import { useViewport } from './use-viewport.js';
+import { useElapsed } from './use-elapsed.js';
+import { usePlanState } from './use-plan-state.js';
+/** §5.0 M0:abort 窗口超时(ms),与 sigint-handler 的 resetTimeoutMs 保持一致 */
+const ABORT_RESET_MS = 3000;
+const HELP_TEXT = `可用命令:
+  /help        本帮助
+  /status      显示当前配置(模型 / workspace / session)
+  /clear       清空对话历史
+  /model       显示当前模型
+  /session     显示 session 信息
+  /theme       切换主题(dark/light/mono)
+  /compact     手动触发压缩
+  /think       展开 Thinking 到滚动历史
+  /keys        键位帮助
+快捷键:Enter 发送 · Shift+Enter 换行 · Ctrl+R 反查 · Ctrl+C 中断 · ? 键位帮助 · / 命令菜单`;
+export function App({ model, sessionUuidShort, workspaceRoot, handlers, initialHistory = [], streamSinkRef, appVersion, configPath, sessionRecordCount = 0, sessionCreated = false, toolsCount, skillsLoaded, }) {
     const { exit } = useApp();
     const { write } = useStdout();
+    const { themeName, setThemeName } = useTheme();
     const [input, setInput] = useState('');
     const [streamingText, setStreamingText] = useState('');
     const [streaming, setStreaming] = useState(false);
     const [thinkingText, setThinkingText] = useState('');
     const [thinkingStreaming, setThinkingStreaming] = useState(false);
-    // 注:动态区高度硬约束下,thinking 永远折叠为 1 行摘要,不再支持 t 键展开。
-    // 完整 thinking 内容在 stream 完成后可通过 session trace 查看。
+    // 跟踪 thinkingText 最新值,避免 useCallback stale closure(handleSubmit 不依赖 thinkingText)
+    const thinkingTextRef = useRef('');
+    // 每次 thinkingText 变化时同步 ref
+    thinkingTextRef.current = thinkingText;
     const [busy, setBusy] = useState(false);
     const [activeTools, setActiveTools] = useState([]);
+    // 跟踪 activeTools 最新值,catch 路径需要读取残留工具
+    const activeToolsRef = useRef([]);
+    activeToolsRef.current = activeTools;
     const [history, setHistory] = useState([]);
     const historyIdRef = useRef(0);
-    const [error, setError] = useState(undefined);
+    const [welcomeSessionRecordCount, setWelcomeSessionRecordCount] = useState(sessionRecordCount);
+    const [notice, setNotice] = useState(null);
     const [lastDurationMs, setLastDurationMs] = useState(undefined);
-    const [lastCompleted, setLastCompleted] = useState(undefined);
     const [currentStep, setCurrentStep] = useState(0);
     const [cacheHitRate, setCacheHitRate] = useState(undefined);
     const [abortRequested, setAbortRequested] = useState(false);
+    const [runStartAt, setRunStartAt] = useState(null);
     const [exiting, setExiting] = useState(false);
     const [pendingAuth, setPendingAuth] = useState(null);
+    const inputHistory = useInputHistory(initialHistory);
+    // 视口:固定 header + 弹性主区 + 固定 footer(24-tui-redesign-viewport.md)
+    const viewport = useViewport();
+    // 集中计算本轮耗时,供 StatusBar 和 LiveBlock 活动行共用(避免重复 setInterval)
+    const elapsedSec = useElapsed(busy ? runStartAt ?? null : null);
+    // 派生"等待 LLM 首 token"窗口 —— busy=true 但还没收到任何 chunk、也没工具调用。
+    // 仅有这一段时间主区会一片空白(无 thinking/streaming/tools),LiveBlock 必须显式
+    // 渲染等待行,否则用户感受是屏幕"卡"了 0.5-3s。
+    const awaitingLlm = busy && !thinkingStreaming && !streaming && activeTools.length === 0;
+    // 实时 Plan 树:订阅 eventBus 的 plan_update;resetSignal 用于 /clear 清空
+    const [planReset, setPlanReset] = useState(0);
+    const todos = usePlanState(handlers.eventBus, planReset);
     // §3.6:把 authorizer 的 uiCallback 桥接到 PermissionCard
-    // 当 authorizer.requestAuthorization 调 uiCallback 时,设置 pendingAuth + 返回 promise
-    // PermissionCard 的 onSubmit resolve promise,清 pendingAuth
     useEffect(() => {
         if (!handlers.authorizer)
             return;
@@ -98,7 +95,6 @@ export function App({ model, sessionUuidShort, workspaceRoot, handlers, initialH
             });
         });
         return () => {
-            // 卸载时清掉 uiCallback(避免 stale)
             handlers.authorizer?.setUiCallback(async () => ({ approved: true, decision: 'once' }));
         };
     }, [handlers.authorizer]);
@@ -108,20 +104,26 @@ export function App({ model, sessionUuidShort, workspaceRoot, handlers, initialH
             return null;
         });
     }, []);
-    const inputHistory = useInputHistory(initialHistory);
-    const todos = usePlanState(handlers.eventBus);
-    // §3.3 M3:Ctrl+C 处理(由 TextInput 触发)
-    const handleAbort = useCallback(() => {
-        handlers.requestAbort?.();
-        // 标记状态以显示提示(首次中断后展示)
-        if (handlers.isAbortRequested?.()) {
-            setAbortRequested(true);
-        }
-        else {
-            // requestAbort 可能已触发首次,下次再查
-            setAbortRequested(true);
-        }
-    }, [handlers]);
+    // §5.0 M0:abort 窗口超时自动复位(备选方案,仅改 app.tsx)
+    useEffect(() => {
+        if (!abortRequested)
+            return;
+        const timer = setTimeout(() => setAbortRequested(false), ABORT_RESET_MS);
+        return () => clearTimeout(timer);
+    }, [abortRequested]);
+    // 通知自动消失(M8)
+    useEffect(() => {
+        if (!notice)
+            return;
+        const id = setTimeout(() => setNotice(null), 5000);
+        return () => clearTimeout(id);
+    }, [notice]);
+    const showNotice = useCallback((kind, text) => {
+        setNotice({ kind, text, timestamp: Date.now() });
+    }, []);
+    const appendHistory = useCallback((item) => {
+        setHistory((prev) => [...prev, { id: historyIdRef.current++, ...item }]);
+    }, []);
     // ── 订阅 EventBus ──
     useEffect(() => {
         const unsub = handlers.eventBus.on((event) => {
@@ -138,22 +140,33 @@ export function App({ model, sessionUuidShort, workspaceRoot, handlers, initialH
                         name: event.data.name,
                         step: event.data.step,
                         startedAt: Date.now(),
+                        argsJson: event.data.argumentsJson,
                     };
                     setActiveTools((prev) => [...prev, tool]);
                     break;
                 }
                 case 'tool_call_end': {
-                    // 只更新为已完成状态,保留在列表中直到下一轮 run 开始时清空。
-                    // 这样用户能看到本轮 run 中触发过的所有工具(含耗时/结果预览),
-                    // 而不是"闪一下就没了"。清空点见 handleSubmit 里 setActiveTools([])。
-                    setActiveTools((prev) => prev.map((t) => t.toolCallId === event.data.toolCallId
-                        ? {
-                            ...t,
-                            endedAt: Date.now(),
-                            success: event.data.success,
-                            resultPreview: event.data.resultPreview,
+                    const { toolCallId, success, resultPreview } = event.data;
+                    setActiveTools((prev) => {
+                        const t = prev.find((x) => x.toolCallId === toolCallId);
+                        if (t) {
+                            // 用 queueMicrotask 把 append 推迟到本次 setState 之后,避免嵌套 setState 警告
+                            queueMicrotask(() => appendHistory({
+                                kind: 'tool',
+                                text: '',
+                                tool: {
+                                    name: t.name,
+                                    argsJson: t.argsJson,
+                                    resultPreview,
+                                    success,
+                                    durationMs: Date.now() - t.startedAt,
+                                    step: t.step,
+                                },
+                            }));
                         }
-                        : t));
+                        // 从动态区活跃列表移除(已固化进 Static)
+                        return prev.filter((x) => x.toolCallId !== toolCallId);
+                    });
                     break;
                 }
                 default:
@@ -162,17 +175,86 @@ export function App({ model, sessionUuidShort, workspaceRoot, handlers, initialH
         });
         return unsub;
     }, [handlers.eventBus]);
+    // ── Slash 命令派发(M1)──
+    const dispatchSlash = useCallback(async (name, arg) => {
+        switch (name) {
+            case 'exit':
+            case 'quit':
+                setExiting(true);
+                write('\n👋 再见！\n');
+                exit();
+                return;
+            case 'clear':
+                await handlers.clearSession();
+                setHistory([]);
+                setPlanReset((n) => n + 1);
+                return;
+            case 'help':
+                appendHistory({ kind: 'help', text: HELP_TEXT });
+                return;
+            case 'model':
+                appendHistory({ kind: 'info', text: `当前模型:${model}` });
+                return;
+            case 'session':
+                appendHistory({ kind: 'info', text: `Session: ${sessionUuidShort}` });
+                return;
+            case 'status':
+                appendHistory({
+                    kind: 'info',
+                    text: `当前配置:\n  model: ${model}\n  workspace: ${workspaceRoot}\n  session: ${sessionUuidShort}\n  theme: ${themeName}`,
+                });
+                return;
+            case 'theme':
+                if (!arg) {
+                    appendHistory({ kind: 'info', text: `当前主题:${themeName}` });
+                }
+                else if (isThemeName(arg)) {
+                    setThemeName(arg);
+                    appendHistory({ kind: 'info', text: `已切换主题:${arg}` });
+                }
+                else {
+                    appendHistory({ kind: 'info', text: `未知主题:${arg}(可选 dark/light/mono)` });
+                }
+                return;
+            case 'compact':
+                if (handlers.compactIfNeeded) {
+                    await handlers.compactIfNeeded();
+                    appendHistory({ kind: 'info', text: '已手动触发压缩' });
+                }
+                else {
+                    appendHistory({ kind: 'info', text: '压缩功能未启用' });
+                }
+                return;
+            case 'think':
+                if (thinkingText) {
+                    appendHistory({ kind: 'thinking', text: thinkingText });
+                    setThinkingText('');
+                }
+                else {
+                    appendHistory({ kind: 'info', text: '当前没有 thinking 内容' });
+                }
+                return;
+            case 'keys':
+                appendHistory({ kind: 'keys-help', text: KEYS_HELP });
+                return;
+            default:
+                appendHistory({ kind: 'info', text: `未知命令: /${name}` });
+        }
+    }, [handlers, model, workspaceRoot, sessionUuidShort, themeName, setThemeName, thinkingText, write, exit, appendHistory]);
     // ── 提交输入 ──
     const handleSubmit = useCallback(async (value) => {
         if (exiting)
             return;
+        // M1:slash 命令优先于普通发送
+        const parsed = parseSlashCommand(value);
+        if (parsed.isSlash && parsed.name) {
+            await dispatchSlash(parsed.name, parsed.arg);
+            return;
+        }
         const trimmed = value.trim();
         if (!trimmed)
             return;
-        // §3.3 M3:若已请求中断,不再接受新输入(等当前 run 退出)
-        if (abortRequested)
-            return;
-        // 内置命令
+        // 内置命令(向后兼容,保留字面量)
         if (trimmed.toLowerCase() === 'exit' || trimmed.toLowerCase() === 'quit') {
             setExiting(true);
             write('\n👋 再见！\n');
@@ -182,30 +264,27 @@ export function App({ model, sessionUuidShort, workspaceRoot, handlers, initialH
         if (trimmed.toLowerCase() === 'clear') {
             await handlers.clearSession();
             setHistory([]);
+            setWelcomeSessionRecordCount(0);
             return;
         }
-        // 把用户输入固化到滚动历史(Static),不参与后续重绘
-        setHistory((prev) => [
-            ...prev,
-            { id: historyIdRef.current++, kind: 'user', text: trimmed },
-        ]);
+        maybePinWelcome();
+        appendHistory({ kind: 'user', text: trimmed });
         setBusy(true);
-        setError(undefined);
+        setNotice(null);
         setStreamingText('');
         setStreaming(false);
         setThinkingText('');
         setThinkingStreaming(false);
-        // 新 run 开始时清空上一轮的 tools / 完成提示;这样上一轮的过程感会一直保留到用户
-        // 下一次提交为止,而不是运行完立刻消失(见 tool_call_end 分支的注释)。
         setActiveTools([]);
-        setLastCompleted(undefined);
         setCurrentStep(0);
         setCacheHitRate(undefined);
-        // 设置流式 sink,让 index.ts 的 onStream 把 content_delta + thinking_delta 推进来
+        setRunStartAt(Date.now());
         streamSinkRef.current = (event) => {
             if (event.type === 'content_delta' && event.content) {
                 setStreamingText((prev) => prev + event.content);
                 setStreaming(true);
+                // 内容开始流式 → thinking 阶段已结束,LiveBlock 应隐藏 thinking 内容
+                setThinkingStreaming(false);
             }
             else if (event.type === 'thinking_delta' && event.thinking) {
                 setThinkingText((prev) => prev + event.thinking);
@@ -218,51 +297,99 @@ export function App({ model, sessionUuidShort, workspaceRoot, handlers, initialH
             else if (event.type === 'error') {
                 setStreaming(false);
                 setThinkingStreaming(false);
-                setError(event.error ?? '流式错误');
+                showNotice('error', event.error ?? '流式错误');
             }
         };
         try {
             const completed = await handlers.sendMessage(trimmed);
-            // 固化助手响应到滚动历史(Static),清空动态区的流式/思考文本
-            setHistory((prev) => [
-                ...prev,
-                {
-                    id: historyIdRef.current++,
-                    kind: 'assistant',
-                    text: completed.response,
-                    stats: {
-                        steps: completed.steps,
-                        totalTokens: completed.totalTokens,
-                        durationMs: completed.durationMs,
-                    },
+            // Thinking 不再自动固化进 Static:LiveBlock 在 thinkingStreaming=false
+            // 时已自动收起,避免滚动历史里塞一长串思考.
+            // 想保留时跑 /think 即可.这里只负责清空 thinkingText.
+            setThinkingText('');
+            appendHistory({
+                kind: 'assistant',
+                text: completed.response,
+                stats: {
+                    steps: completed.steps,
+                    totalTokens: completed.totalTokens,
+                    durationMs: completed.durationMs,
                 },
-            ]);
+            });
             setLastDurationMs(completed.durationMs);
-            setLastCompleted(completed);
             setStreamingText('');
             setStreaming(false);
-            // 不清 thinkingText / activeTools / lastCompleted:让"本轮响应已完成 + thinking 摘要
-            // + 触发过的工具卡片"保留到用户下一次提交(handleSubmit 顶部统一清空)。
-            // 这样用户 run 结束后仍能看到明确的完成信号,而不是动态区突然清空、疑似渲染卡住。
             setThinkingStreaming(false);
             setCurrentStep(0);
         }
         catch (err) {
-            setError(err instanceof Error ? err.message : String(err));
+            // 异常/中断时将残留的 thinking 和未固化工具也写入历史,避免丢失
+            const tt = thinkingTextRef.current;
+            if (tt) {
+                appendHistory({ kind: 'thinking', text: tt });
+                setThinkingText('');
+            }
+            const remaining = activeToolsRef.current;
+            if (remaining.length > 0) {
+                for (const t of remaining) {
+                    appendHistory({
+                        kind: 'tool',
+                        text: '',
+                        tool: {
+                            name: t.name,
+                            argsJson: t.argsJson,
+                            resultPreview: undefined,
+                            success: false,
+                            durationMs: Date.now() - t.startedAt,
+                            step: t.step,
+                        },
+                    });
+                }
+                setActiveTools([]);
+            }
+            showNotice('error', err instanceof Error ? err.message : String(err));
         }
         finally {
             streamSinkRef.current = null;
             setBusy(false);
+            setRunStartAt(null);
+            // §5.0 M0:run 结束清 abort 标志,输入框恢复可用
+            setAbortRequested(false);
         }
-    }, [exiting, handlers, exit, write, streamSinkRef]);
-    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Static, { items: history, children: (item) => _jsx(HistoryEntry, { item: item }, item.id) }), _jsxs(Box, { flexDirection: "column", children: [_jsx(Header, { model: model, sessionUuidShort: sessionUuidShort, workspaceRoot: workspaceRoot, busy: busy, lastDurationMs: lastDurationMs, currentStep: currentStep, maxSteps: handlers.maxSteps, cacheHitRate: cacheHitRate }), _jsx(PlanPanel, { todos: todos, maxVisible: PLAN_MAX_VISIBLE }), _jsx(ThinkingPanel, { thinking: thinkingText, streaming: thinkingStreaming, expanded: false }), _jsx(ToolCards, { tools: activeTools, maxVisible: TOOLS_MAX_VISIBLE }), _jsx(ResponsePanel, { streamingText: tailLines(streamingText, RESPONSE_TAIL_LINES), streaming: streaming, activeTools: [], lastCompleted: lastCompleted, error: error }), abortRequested && (_jsx(Box, { children: _jsx(Text, { color: "yellow", children: "\u26A0\uFE0F  \u5DF2\u8BF7\u6C42\u4E2D\u65AD,\u7B49\u5F53\u524D\u6B65\u9AA4\u5B8C\u6210\u540E\u9000\u51FA;\u518D\u6309 Ctrl+C \u7ACB\u5373\u9000\u51FA" }) })), pendingAuth ? (_jsx(Box, { marginTop: 1, children: _jsx(PermissionCard, { request: pendingAuth.request, onSubmit: handleAuthSubmit }) })) : (_jsxs(Box, { marginTop: 1, flexDirection: "column", children: [_jsx(TextInput, { value: input, onChange: setInput, onSubmit: handleSubmit, multiline: true, history: inputHistory, placeholder: "\u8F93\u5165\u6D88\u606F(Enter \u53D1\u9001,Shift+Enter \u6362\u884C,Ctrl+R \u53CD\u67E5\u5386\u53F2,exit \u9000\u51FA)", disabled: busy || abortRequested, onAbort: handleAbort }), _jsx(Text, { dimColor: true, children: "[Enter: \u53D1\u9001] [Shift+Enter: \u6362\u884C] [Ctrl+C: \u4E2D\u65AD/\u9000\u51FA] [Ctrl+R: \u53CD\u67E5\u5386\u53F2] [Ctrl+L: \u6E05\u5C4F]" })] }))] })] }));
+    }, [exiting, handlers, exit, write, dispatchSlash, appendHistory, showNotice]);
+    // §5.0 M0:Ctrl+C 处理(由 TextInput 触发)
+    const handleAbort = useCallback(() => {
+        handlers.requestAbort?.();
+        setAbortRequested(true);
+    }, [handlers]);
+    const handleExit = useCallback(() => {
+        setExiting(true);
+        write('\n👋 再见！\n');
+        exit();
+    }, [write, exit]);
+    const placeholder = abortRequested
+        ? '正在中断当前任务,请等它退出…'
+        : '输入消息或 / 打开命令菜单…';
+    const welcomeCard = (_jsx(Welcome, { appVersion: appVersion, cwd: workspaceRoot, configPath: configPath, model: model, sessionUuidShort: sessionUuidShort, sessionRecordCount: welcomeSessionRecordCount, sessionCreated: sessionCreated, toolsCount: toolsCount, skillsLoaded: skillsLoaded }));
+    /** 首条用户消息发出时,将欢迎卡作为历史首项固化进 Static */
+    const maybePinWelcome = useCallback(() => {
+        setHistory((prev) => {
+            if (prev.length > 0)
+                return prev; // 已有历史(欢迎已钉过或 /clear 后重建)
+            const welcomeItem = {
+                id: historyIdRef.current++,
+                kind: 'welcome',
+                text: '',
+                welcomeEl: (_jsx(Welcome, { appVersion: appVersion, cwd: workspaceRoot, configPath: configPath, model: model, sessionUuidShort: sessionUuidShort, sessionRecordCount: welcomeSessionRecordCount, sessionCreated: sessionCreated, toolsCount: toolsCount, skillsLoaded: skillsLoaded })),
+            };
+            return [welcomeItem];
+        });
+    }, [appVersion, workspaceRoot, configPath, model, sessionUuidShort, welcomeSessionRecordCount, sessionCreated, toolsCount, skillsLoaded]);
+    return (_jsxs(Box, { flexDirection: "column", children: [history.length === 0 && !busy ? (welcomeCard) : (_jsx(MainArea, { history: history, todos: todos, thinkingText: thinkingText, thinkingStreaming: thinkingStreaming, activeTools: activeTools, streamingText: streamingText, streaming: streaming, awaitingLlm: awaitingLlm, mainHeight: viewport.mainHeight, cols: viewport.cols, elapsedSec: elapsedSec, currentStep: currentStep, maxSteps: handlers.maxSteps })), abortRequested && _jsx(AbortHint, {}), notice && _jsx(NoticePanel, { notice: notice }), pendingAuth ? (_jsx(Box, { marginTop: 1, children: _jsx(PermissionCard, { request: pendingAuth.request, onSubmit: handleAuthSubmit }) })) : (_jsxs(Box, { flexDirection: "column", children: [_jsx(Box, { borderStyle: "round", borderColor: "gray", paddingX: 1, children: _jsx(TextInput, { value: input, onChange: setInput, onSubmit: handleSubmit, multiline: true, history: inputHistory, placeholder: placeholder, disabled: busy, onAbort: handleAbort, onExit: handleExit, onSlash: (n, a) => {
+                                void dispatchSlash(n, a);
+                            } }) }), _jsx(HintBar, { mode: busy ? 'busy' : 'normal' })] }))] }));
 }
-/** 渲染一条已固化的对话记录(用于 Static) */
-function HistoryEntry({ item }) {
-    if (item.kind === 'user') {
-        return (_jsxs(Box, { children: [_jsx(Text, { color: "green", children: '> ' }), _jsx(Text, { children: item.text })] }));
-    }
-    const s = item.stats;
-    return (_jsxs(Box, { flexDirection: "column", paddingX: 1, children: [_jsx(Text, { color: "cyan", bold: true, children: "Wukong:" }), _jsx(Text, { children: item.text }), s && (_jsxs(Text, { dimColor: true, children: ['  [步骤: ', s.steps, ' | Token: ', s.totalTokens.prompt + s.totalTokens.completion, ' (prompt=', s.totalTokens.prompt, ', completion=', s.totalTokens.completion, ')', ' | 耗时: ', (s.durationMs / 1000).toFixed(1), "s", ']'] }))] }));
+/** 中断提示(24-tui-redesign-viewport.md §4.9):拆成两行,窄终端不折行错乱 */
+function AbortHint() {
+    return (_jsxs(Box, { flexDirection: "column", marginY: 0, children: [_jsx(Text, { color: "yellow", children: "\u26A0\uFE0F \u5DF2\u8BF7\u6C42\u4E2D\u65AD \u00B7 \u5F53\u524D step \u7ED3\u675F\u540E\u505C\u6B62" }), _jsx(Text, { color: "yellow", dimColor: true, children: "   \u7ACB\u5373\u5F3A\u9000:\u518D\u6309\u4E00\u6B21 Ctrl+C" })] }));
 }
 //# sourceMappingURL=app.js.map