@co0ontty/wand 1.5.4 → 1.5.7

package/dist/process-manager.d.ts

@@ -1,11 +1,7 @@
 import { EventEmitter } from "node:events";
 import { WandStorage } from "./storage.js";
-import { ExecutionMode, SessionSnapshot, WandConfig } from "./types.js";
-export interface ProcessEvent {
-    type: "output" | "status" | "started" | "ended" | "usage" | "task" | "notification";
-    sessionId: string;
-    data?: unknown;
-}
+import { ExecutionMode, ProcessEventHandler, SessionSnapshot, WandConfig } from "./types.js";
+export type { ProcessEvent, ProcessEventHandler } from "./types.js";
 /** Human-readable task information for the UI */
 export interface TaskInfo {
     title: string;
@@ -17,7 +13,6 @@ export declare class SessionInputError extends Error {
     readonly sessionStatus?: SessionSnapshot["status"] | undefined;
     constructor(message: string, code: "SESSION_NOT_FOUND" | "SESSION_NOT_RUNNING" | "SESSION_NO_PTY", sessionId: string, sessionStatus?: SessionSnapshot["status"] | undefined);
 }
-export type ProcessEventHandler = (event: ProcessEvent) => void;
 /** A Claude Code session discovered by scanning ~/.claude/projects/ directories. */
 export interface ClaudeHistorySession {
     claudeSessionId: string;

package/dist/structured-session-manager.d.ts

@@ -1,6 +1,5 @@
 import { WandStorage } from "./storage.js";
-import { ExecutionMode, SessionRunner, SessionSnapshot, WandConfig } from "./types.js";
-import { ProcessEvent } from "./ws-broadcast.js";
+import { ExecutionMode, ProcessEvent, SessionRunner, SessionSnapshot, WandConfig } from "./types.js";
 interface CreateStructuredSessionOptions {
     cwd: string;
     mode: ExecutionMode;

package/dist/types.d.ts

@@ -8,6 +8,13 @@ export type EscalationScope = "write_file" | "run_command" | "network" | "outsid
 export type EscalationRunner = "json" | "pty";
 export type EscalationResolution = "approve_once" | "approve_turn" | "deny" | "fallback_manual";
 export type EscalationSource = "tool_permission_request" | "sandbox_hard_block" | "workspace_policy_limit" | "cli_capability_limit" | "unknown";
+/** WebSocket / ProcessManager event envelope used throughout the app. */
+export interface ProcessEvent {
+    type: "output" | "status" | "started" | "ended" | "usage" | "task" | "notification";
+    sessionId: string;
+    data?: unknown;
+}
+export type ProcessEventHandler = (event: ProcessEvent) => void;
 export interface EscalationRequest {
     requestId: string;
     scope: EscalationScope;

package/dist/web-ui/content/scripts.js

@@ -164,10 +164,13 @@
       var _statusBarStartTime = 0;
 
       function renderStructuredStatusBar(chatMessages, session) {
-        // Remove stale bar if session changed or not structured
-        var existing = chatMessages.querySelector(".structured-status-bar");
+        // Status bar now lives above the input-composer, inside .input-panel
+        var inputPanel = document.querySelector(".input-panel");
+        var existing = document.querySelector(".structured-status-bar");
+        var composer = document.querySelector(".input-composer");
         if (!session || !isStructuredSession(session)) {
           if (existing) existing.remove();
+          if (composer) composer.classList.remove("in-flight");
           clearInterval(_statusBarTimerId);
           _statusBarTimerId = null;
           return;
@@ -181,21 +184,26 @@
             _statusBarStartTime = Date.now();
           }
 
-          if (!existing) {
+          // Add glow to input composer
+          if (composer) composer.classList.add("in-flight");
+
+          if (!existing && inputPanel && composer) {
             var bar = document.createElement("div");
             bar.className = "structured-status-bar";
             bar.innerHTML =
+              '<span class="status-bar-dot"></span>' +
               '<span class="status-bar-label">回复中</span>' +
-              '<div class="status-bar-track"><div class="status-bar-fill"></div></div>' +
               '<span class="status-bar-timer">0.0s</span>';
-            // column-reverse: first child = visual bottom
-            chatMessages.insertBefore(bar, chatMessages.firstChild);
+            // Insert right before the input-composer element
+            inputPanel.insertBefore(bar, composer);
             existing = bar;
-          } else if (existing.classList.contains("completed")) {
+          } else if (existing && existing.classList.contains("completed")) {
             // Was completed, now in-flight again — reset
             existing.classList.remove("completed");
             existing.style.animation = "none";
             existing.querySelector(".status-bar-label").textContent = "回复中";
+            var dot = existing.querySelector(".status-bar-dot");
+            if (dot) dot.style.display = "";
             _statusBarStartTime = Date.now();
           }
 
@@ -214,12 +222,17 @@
           clearInterval(_statusBarTimerId);
           _statusBarTimerId = null;
 
+          // Remove glow from input composer
+          if (composer) composer.classList.remove("in-flight");
+
           if (existing && !existing.classList.contains("completed")) {
             // Just finished — transition to completed state
             var elapsed = _statusBarStartTime ? ((Date.now() - _statusBarStartTime) / 1000).toFixed(1) : "0.0";
             existing.classList.add("completed");
             existing.querySelector(".status-bar-label").textContent = "完成";
             existing.querySelector(".status-bar-timer").textContent = elapsed + "s";
+            var dot = existing.querySelector(".status-bar-dot");
+            if (dot) dot.style.display = "none";
             _statusBarStartTime = 0;
             // Remove after animation ends
             setTimeout(function() {
@@ -471,6 +484,8 @@
         if (!state.selectedId) return "";
         var isTerminal = state.currentView === "terminal";
         if (!isTerminal) return "";
+        var sel = state.sessions.find(function(s) { return s.id === state.selectedId; });
+        if (sel && isStructuredSession(sel)) return "";
         var keys = renderShortcutKeys();
         var arrow = state.shortcutsExpanded ? '›' : '‹';
         return '<div class="inline-shortcuts-wrap' + (state.shortcutsExpanded ? ' expanded' : '') + '">' +
@@ -484,6 +499,8 @@
         if (!state.selectedId) return "";
         var isTerminal = state.currentView === "terminal";
         if (!isTerminal) return "";
+        var sel = state.sessions.find(function(s) { return s.id === state.selectedId; });
+        if (sel && isStructuredSession(sel)) return "";
         return '<div class="inline-shortcuts-expanded-row' + (state.shortcutsExpanded ? ' visible' : '') + '">' + renderShortcutKeys() + '</div>';
       }
 
@@ -700,12 +717,11 @@
                     '<span id="session-mode-display" class="session-mode-display">' + (selectedSession ? getModeLabel(selectedSession.mode) : '默认') + '</span>' +
                     (selectedSession && selectedSession.autoApprovePermissions ? '<span class="session-info-separator">|</span><span id="auto-approve-toggle" class="auto-approve-indicator active" title="自动批准已启用 — 点击关闭">🛡 自动批准</span>' : '<span class="session-info-separator">|</span><span id="auto-approve-toggle" class="auto-approve-indicator" title="自动批准已关闭 — 点击开启">🛡 手动</span>') +
                     '<span class="session-info-separator">|</span>' +
-                    '<span id="session-kind-display" class="session-kind-display">' + (selectedSession ? (isStructuredSession(selectedSession) ? 'Structured' : 'PTY') : 'PTY') + '</span>' +
+                    '<span id="session-kind-display" class="session-kind-display">' + (selectedSession ? getSessionKindLabel(selectedSession) : '终端') + '</span>' +
                     '<span class="session-info-separator">|</span>' +
                     '<span id="session-status-display" class="session-status-display">' + (selectedSession ? getSessionStatusLabel(selectedSession) : '-') + '</span>' +
                     (selectedSession && selectedSession.claudeSessionId ? '<span class="session-info-separator">|</span><span id="claude-session-id-badge" class="claude-session-id-badge" data-claude-id="' + escapeHtml(selectedSession.claudeSessionId) + '" title="点击复制 Claude 会话 ID">☁ ' + escapeHtml(selectedSession.claudeSessionId.slice(0, 8)) + '</span>' : '') +
-                    '<span class="session-info-separator">|</span>' +
-                    '<span id="session-exit-display" class="session-exit-display">exit=' + (selectedSession && selectedSession.exitCode !== undefined ? selectedSession.exitCode : 'n/a') + '</span>' +
+                    (selectedSession && !isStructuredSession(selectedSession) ? '<span class="session-info-separator">|</span><span id="session-exit-display" class="session-exit-display">退出码=' + (selectedSession.exitCode !== undefined ? selectedSession.exitCode : 'n/a') + '</span>' : '') +
                   '</div>' +
                 '</div>' +
                 '<p id="action-error" class="error-message hidden"></p>' +
@@ -788,31 +804,50 @@
 
               // General config tab
               '<div class="settings-panel" id="settings-tab-general">' +
-                '<div class="field">' +
-                  '<label class="field-label" for="cfg-host">监听地址 (host)</label>' +
-                  '<input id="cfg-host" type="text" class="field-input" placeholder="127.0.0.1" />' +
-                '</div>' +
-                '<div class="field">' +
-                  '<label class="field-label" for="cfg-port">端口 (port)</label>' +
-                  '<input id="cfg-port" type="number" class="field-input" placeholder="8443" min="1" max="65535" />' +
+                '<div class="field-row">' +
+                  '<div class="field">' +
+                    '<label class="field-label" for="cfg-host">监听地址 (host)</label>' +
+                    '<input id="cfg-host" type="text" class="field-input" placeholder="127.0.0.1" />' +
+                  '</div>' +
+                  '<div class="field">' +
+                    '<label class="field-label" for="cfg-port">端口 (port)</label>' +
+                    '<input id="cfg-port" type="number" class="field-input" placeholder="8443" min="1" max="65535" />' +
+                  '</div>' +
                 '</div>' +
                 '<div class="field field-inline">' +
-                  '<label class="field-label" for="cfg-https">启用 HTTPS</label>' +
                   '<input id="cfg-https" type="checkbox" class="field-checkbox" />' +
+                  '<label class="field-label" for="cfg-https">启用 HTTPS</label>' +
                 '</div>' +
-                '<div class="field">' +
-                  '<label class="field-label" for="cfg-mode">默认执行模式</label>' +
-                  '<select id="cfg-mode" class="field-input">' +
-                    '<option value="default">default</option>' +
-                    '<option value="assist">assist</option>' +
-                    '<option value="agent">agent</option>' +
-                    '<option value="agent-max">agent-max</option>' +
-                    '<option value="auto-edit">auto-edit</option>' +
-                    '<option value="full-access">full-access</option>' +
-                    '<option value="native">native</option>' +
-                    '<option value="managed">managed</option>' +
-                  '</select>' +
+                '<div class="field-row">' +
+                  '<div class="field">' +
+                    '<label class="field-label" for="cfg-mode">默认执行模式</label>' +
+                    '<select id="cfg-mode" class="field-input">' +
+                      '<option value="default">default</option>' +
+                      '<option value="assist">assist</option>' +
+                      '<option value="agent">agent</option>' +
+                      '<option value="agent-max">agent-max</option>' +
+                      '<option value="auto-edit">auto-edit</option>' +
+                      '<option value="full-access">full-access</option>' +
+                      '<option value="native">native</option>' +
+                      '<option value="managed">managed</option>' +
+                    '</select>' +
+                  '</div>' +
+                  '<div class="field">' +
+                    '<label class="field-label" for="cfg-language">回复语言</label>' +
+                    '<select id="cfg-language" class="field-input">' +
+                      '<option value="">自动（不指定）</option>' +
+                      '<option value="中文">中文</option>' +
+                      '<option value="English">English</option>' +
+                      '<option value="日本語">日本語</option>' +
+                      '<option value="한국어">한국어</option>' +
+                      '<option value="Español">Español</option>' +
+                      '<option value="Français">Français</option>' +
+                      '<option value="Deutsch">Deutsch</option>' +
+                      '<option value="Русский">Русский</option>' +
+                    '</select>' +
+                  '</div>' +
                 '</div>' +
+                '<p class="field-hint" style="margin-top:-4px;">设置回复语言后，Claude 将尽量使用指定语言回复。</p>' +
                 '<div class="field">' +
                   '<label class="field-label" for="cfg-cwd">默认工作目录</label>' +
                   '<input id="cfg-cwd" type="text" class="field-input" placeholder="/home/user" />' +
@@ -821,52 +856,40 @@
                   '<label class="field-label" for="cfg-shell">Shell</label>' +
                   '<input id="cfg-shell" type="text" class="field-input" placeholder="/bin/bash" />' +
                 '</div>' +
-                '<div class="field">' +
-                  '<label class="field-label" for="cfg-language">回复语言</label>' +
-                  '<select id="cfg-language" class="field-input">' +
-                    '<option value="">自动（不指定）</option>' +
-                    '<option value="中文">中文</option>' +
-                    '<option value="English">English</option>' +
-                    '<option value="日本語">日本語</option>' +
-                    '<option value="한국어">한국어</option>' +
-                    '<option value="Español">Español</option>' +
-                    '<option value="Français">Français</option>' +
-                    '<option value="Deutsch">Deutsch</option>' +
-                    '<option value="Русский">Русский</option>' +
-                  '</select>' +
-                  '<p class="hint" style="margin-top:4px;margin-bottom:0;">设置后，Claude 将尽量使用指定语言回复。</p>' +
-                '</div>' +
                 '<button id="save-config-button" class="btn btn-primary btn-block">保存配置</button>' +
                 '<p id="config-message" class="hint hidden"></p>' +
               '</div>' +
 
               // Security tab
               '<div class="settings-panel" id="settings-tab-security">' +
-                '<h3 class="settings-section-title">修改密码</h3>' +
-                '<div class="field">' +
-                  '<label class="field-label" for="new-password">新密码</label>' +
-                  '<input id="new-password" type="password" class="field-input" placeholder="输入新密码（至少 6 个字符）" autocomplete="new-password" />' +
-                '</div>' +
-                '<div class="field">' +
-                  '<label class="field-label" for="confirm-password">确认密码</label>' +
-                  '<input id="confirm-password" type="password" class="field-input" placeholder="再次输入新密码" autocomplete="new-password" />' +
-                '</div>' +
-                '<button id="save-password-button" class="btn btn-primary btn-block">保存密码</button>' +
-                '<p id="settings-error" class="error-message hidden"></p>' +
-                '<p id="settings-success" class="hint hidden" style="color: var(--success);"></p>' +
-                '<hr class="settings-divider" />' +
-                '<h3 class="settings-section-title">SSL 证书</h3>' +
-                '<p class="settings-hint" id="cert-status">加载中...</p>' +
-                '<div class="field">' +
-                  '<label class="field-label" for="cert-key-file">私钥文件 (.key)</label>' +
-                  '<input id="cert-key-file" type="file" class="field-input field-file" accept=".key,.pem" />' +
+                '<div class="settings-card">' +
+                  '<h3 class="settings-section-title">\ud83d\udd12 修改密码</h3>' +
+                  '<div class="field">' +
+                    '<label class="field-label" for="new-password">新密码</label>' +
+                    '<input id="new-password" type="password" class="field-input" placeholder="输入新密码（至少 6 个字符）" autocomplete="new-password" />' +
+                  '</div>' +
+                  '<div class="field">' +
+                    '<label class="field-label" for="confirm-password">确认密码</label>' +
+                    '<input id="confirm-password" type="password" class="field-input" placeholder="再次输入新密码" autocomplete="new-password" />' +
+                  '</div>' +
+                  '<button id="save-password-button" class="btn btn-primary btn-block">保存密码</button>' +
+                  '<p id="settings-error" class="error-message hidden"></p>' +
+                  '<p id="settings-success" class="hint hidden" style="color: var(--success);"></p>' +
                 '</div>' +
-                '<div class="field">' +
-                  '<label class="field-label" for="cert-cert-file">证书文件 (.crt/.pem)</label>' +
-                  '<input id="cert-cert-file" type="file" class="field-input field-file" accept=".crt,.pem,.cert" />' +
+                '<div class="settings-card">' +
+                  '<h3 class="settings-section-title">\ud83d\udd10 SSL 证书</h3>' +
+                  '<p class="settings-hint" id="cert-status">加载中...</p>' +
+                  '<div class="field">' +
+                    '<label class="field-label" for="cert-key-file">私钥文件 (.key)</label>' +
+                    '<input id="cert-key-file" type="file" class="field-input field-file" accept=".key,.pem" />' +
+                  '</div>' +
+                  '<div class="field">' +
+                    '<label class="field-label" for="cert-cert-file">证书文件 (.crt/.pem)</label>' +
+                    '<input id="cert-cert-file" type="file" class="field-input field-file" accept=".crt,.pem,.cert" />' +
+                  '</div>' +
+                  '<button id="upload-cert-button" class="btn btn-primary btn-block">上传证书</button>' +
+                  '<p id="cert-message" class="hint hidden"></p>' +
                 '</div>' +
-                '<button id="upload-cert-button" class="btn btn-primary btn-block">上传证书</button>' +
-                '<p id="cert-message" class="hint hidden"></p>' +
               '</div>' +
 
               // Command presets tab
@@ -1743,7 +1766,15 @@
         if (!session) return "";
         if (session.archived) return "已归档";
         if (session.permissionBlocked) return "等待授权";
-        return session.status;
+        var statusMap = {
+          "stopped": "已停止",
+          "running": "运行中",
+          "idle": "空闲",
+          "thinking": "思考中",
+          "waiting-input": "等待输入",
+          "initializing": "启动中"
+        };
+        return statusMap[session.status] || session.status;
       }
 
       function getSessionStatusClass(session) {
@@ -2312,19 +2343,6 @@
         var selectedIndex = -1;
         var folderItems = [];
 
-        function saveWorkingDir(path) {
-          state.workingDir = path;
-          try {
-            localStorage.setItem("wand-working-dir", path);
-          } catch (e) {
-            // Ignore localStorage errors
-          }
-          // Also add to recent paths (defined later, will be called after function is available)
-          if (typeof addRecentPath === "function") {
-            addRecentPath(path);
-          }
-        }
-
         // Helper functions for path validation feedback
         function showValidationError(message) {
           if (folderPickerInput) {
@@ -2349,21 +2367,7 @@
         }
 
         // Helper functions for recent paths (single source: backend API)
-        function fetchRecentPaths(callback) {
-          fetch("/api/recent-paths", { credentials: "same-origin" })
-            .then(function(res) { return res.json(); })
-            .then(function(items) { callback(items || []); })
-            .catch(function() { callback([]); });
-        }
-
-        function addRecentPath(path) {
-          return fetch("/api/recent-paths", {
-            method: "POST",
-            headers: { "Content-Type": "application/json" },
-            credentials: "same-origin",
-            body: JSON.stringify({ path: path })
-          }).catch(function() {});
-        }
+        // NOTE: fetchRecentPaths and addRecentPath are defined at outer scope
 
         function renderRecentPathsHtml(items) {
           if (!items.length) return "";
@@ -2690,6 +2694,32 @@
         setupVisualViewportHandlers();
       }
 
+      function saveWorkingDir(path) {
+        state.workingDir = path;
+        try {
+          localStorage.setItem("wand-working-dir", path);
+        } catch (e) {
+          // Ignore localStorage errors
+        }
+        addRecentPath(path);
+      }
+
+      function fetchRecentPaths(callback) {
+        fetch("/api/recent-paths", { credentials: "same-origin" })
+          .then(function(res) { return res.json(); })
+          .then(function(items) { callback(items || []); })
+          .catch(function() { callback([]); });
+      }
+
+      function addRecentPath(path) {
+        return fetch("/api/recent-paths", {
+          method: "POST",
+          headers: { "Content-Type": "application/json" },
+          credentials: "same-origin",
+          body: JSON.stringify({ path: path })
+        }).catch(function() {});
+      }
+
       function activateSessionItem(sessionId) {
         var session = state.sessions.find(function(s) { return s.id === sessionId; });
         if (session && session.status !== "running" && !isStructuredSession(session)) {
@@ -3490,13 +3520,13 @@
       }
 
       function getSessionKindLabel(session) {
-        return isStructuredSession(session) ? "Structured" : "PTY";
+        return isStructuredSession(session) ? "结构化" : "终端";
       }
 
       function getSessionKindDescription(session) {
         return isStructuredSession(session)
-          ? "Structured · block transcript"
-          : "PTY · terminal session";
+          ? "结构化 · 块级记录"
+          : "终端 · PTY 会话";
       }
 
       function isRecoverableToolError(toolResult, nextResult) {
@@ -3830,8 +3860,9 @@
         var exitEl = document.getElementById("session-exit-display");
         var cwdText = selectedSession && selectedSession.cwd ? selectedSession.cwd : "未设置目录";
         var modeText = selectedSession ? getModeLabel(selectedSession.mode) : "默认";
-        var kindText = selectedSession ? getSessionKindLabel(selectedSession) : "PTY";
-        var exitText = "exit=" + (selectedSession && selectedSession.exitCode !== undefined ? selectedSession.exitCode : "n/a");
+        var kindText = selectedSession ? getSessionKindLabel(selectedSession) : "终端";
+        var isStructured = selectedSession && isStructuredSession(selectedSession);
+        var exitText = isStructured ? "" : "退出码=" + (selectedSession && selectedSession.exitCode !== undefined ? selectedSession.exitCode : "n/a");
         if (cwdEl && cwdEl.textContent !== cwdText) cwdEl.textContent = cwdText;
         if (modeEl && modeEl.textContent !== modeText) modeEl.textContent = modeText;
         if (kindEl && kindEl.textContent !== kindText) kindEl.textContent = kindText;
@@ -3919,15 +3950,23 @@
       function selectSession(id) {
         var foundSession = state.sessions.find(function(item) { return item.id === id; });
         console.log("[WAND] selectSession id:", id, "found:", !!foundSession, "sessionKind:", foundSession && foundSession.sessionKind, "runner:", foundSession && foundSession.runner, "isStructured:", isStructuredSession(foundSession));
+        if (!foundSession) {
+          console.warn("[WAND] selectSession: session not found, skipping", id);
+          return;
+        }
         state.selectedId = id;
         persistSelectedId();
+        // Clear queued inputs from the previous session to prevent cross-session leaks
+        state.messageQueue = [];
+        state.pendingMessages = [];
+        updateQueueCounter();
         resetChatRenderCache();
         state.currentMessages = [];
         if (chatRenderTimer) { clearTimeout(chatRenderTimer); chatRenderTimer = null; }
         // Reset todo progress bar
         var todoEl = document.getElementById("todo-progress");
         if (todoEl) todoEl.classList.add("hidden");
-        var session = state.sessions.find(function(item) { return item.id === id; });
+        var session = foundSession;
         state.preferredCommand = getPreferredTool();
         state.chatMode = getSafeModeForTool("claude", session && session.mode ? session.mode : state.chatMode);
         if (state.terminalInteractive && session && session.status !== "running") {
@@ -3986,6 +4025,8 @@
       var focusTrapHandler = null;
 
       function openSessionModal() {
+        // Close settings modal first if open (mutual exclusion)
+        closeSettingsModal();
         state.modalOpen = true;
         state.sessionsDrawerOpen = false;
         updateDrawerState();
@@ -4060,6 +4101,8 @@
       }
 
       function openSettingsModal() {
+        // Close session modal first if open (mutual exclusion)
+        closeSessionModal();
         var modal = document.getElementById("settings-modal");
         if (modal) {
           modal.classList.remove("hidden");
@@ -4216,7 +4259,7 @@
                   '<span class="preset-detail">' + escapeHtml(p.command) + (p.mode ? ' (' + escapeHtml(p.mode) + ')' : '') + '</span>' +
                 '</div>';
               }
-              if (!html) html = '<p class="settings-hint">没有命令预设。</p>';
+              if (!html) html = '<div class="empty-state-compact"><span class="empty-icon">\u2699</span><span>\u6ca1\u6709\u547d\u4ee4\u9884\u8bbe</span><span class="hint">\u5728 config.json \u7684 commandPresets \u4e2d\u914d\u7f6e</span></div>';
               presetsList.innerHTML = html;
             }
           })
@@ -4518,7 +4561,10 @@
         });
       }
 
+      var _sessionCreating = false;
+
       function runCommand() {
+        if (_sessionCreating) return;
         var cwdEl = document.getElementById("cwd");
         var errorEl = document.getElementById("modal-error");
         var command = getPreferredTool();
@@ -4540,6 +4586,7 @@
 
       function startStructuredSessionFromModal(cwd, mode, errorEl) {
         console.log("[WAND] startStructuredSessionFromModal cwd:", cwd, "mode:", mode);
+        _sessionCreating = true;
         state.modeValue = mode;
         state.chatMode = mode;
         state.sessionTool = "claude";
@@ -4555,11 +4602,13 @@
           .then(function() { focusInputBox(true); })
           .catch(function(error) {
             showError(errorEl, (error && error.message) || "无法启动结构化会话，请确认 Claude 已正确安装。");
-          });
+          })
+          .finally(function() { _sessionCreating = false; });
       }
 
       function runPtyCommandFromModal(command, cwd, mode, errorEl) {
         console.log("[WAND] runPtyCommandFromModal command:", command, "cwd:", cwd, "mode:", mode);
+        _sessionCreating = true;
         state.modeValue = mode;
         state.chatMode = mode;
         state.sessionTool = command;
@@ -4602,7 +4651,8 @@
         })
         .catch(function() {
           showError(errorEl, "无法启动会话，请确认 Claude 已正确安装。");
-        });
+        })
+        .finally(function() { _sessionCreating = false; });
       }
 
       function initBlankChatCwd() {
@@ -5626,10 +5676,12 @@
           }
         });
         // Inline keyboard visibility follows current view
-        var inlineKeyboard = document.getElementById("inline-keyboard");
+        var inlineKeyboard = document.querySelector(".inline-shortcuts-wrap");
         if (inlineKeyboard) inlineKeyboard.classList.toggle("hidden", structured || state.currentView !== "terminal");
+        var expandedRow = document.querySelector(".inline-shortcuts-expanded-row");
+        if (expandedRow) expandedRow.classList.toggle("hidden", structured || state.currentView !== "terminal");
         var inputHint = document.querySelector(".input-hint");
-        if (inputHint) inputHint.classList.toggle("hidden", structured ? false : state.currentView === "terminal");
+        if (inputHint) inputHint.classList.toggle("hidden", structured ? true : state.currentView === "terminal");
         var container = document.getElementById("output");
         if (container) container.classList.toggle("interactive", !structured && state.terminalInteractive);
       }
@@ -5986,9 +6038,12 @@
         });
       }
 
+      var _resumeInProgress = false;
+
       function resumeSession(sessionId, errorEl) {
         console.log("[WAND] resumeSession sessionId:", sessionId);
-        if (!sessionId) return Promise.resolve(null);
+        if (!sessionId || _resumeInProgress) return Promise.resolve(null);
+        _resumeInProgress = true;
         return fetch("/api/sessions/" + encodeURIComponent(sessionId) + "/resume", {
           method: "POST",
           headers: { "Content-Type": "application/json" },
@@ -6014,7 +6069,8 @@
           if (errorEl) showError(errorEl, message);
           else showToast(message, "error");
           return null;
-        });
+        })
+        .finally(function() { _resumeInProgress = false; });
       }
 
       function resumeClaudeSessionById(claudeSessionId, errorEl) {
@@ -8151,12 +8207,16 @@
             smartScrollToBottom(chatMessages);
           });
         } else if (msgCount === existingCount && outputHash !== prevHash) {
-          // Same message count but content changed (streaming update). Re-render in place
-          // by index so assistant growth, tool cards, and retroactive message fixes all show up.
+          // Same message count but content changed (streaming update).
+          // Optimization: only re-render the newest N messages (column-reverse: first children)
+          // that actually differ, starting from the top (newest). Most streaming updates only
+          // touch the latest assistant turn, so we can skip scanning all older messages.
           var existingEls = Array.from(chatMessages.querySelectorAll(".chat-message"));
           var reversedMessages = messages.slice().reverse();
           var replacedAny = false;
-          for (var mi = 0; mi < reversedMessages.length && mi < existingEls.length; mi++) {
+          // Scan from newest (index 0 in reversed) up to MAX_STREAMING_SCAN messages
+          var MAX_STREAMING_SCAN = Math.min(4, reversedMessages.length, existingEls.length);
+          for (var mi = 0; mi < MAX_STREAMING_SCAN; mi++) {
             var currentEl = existingEls[mi];
             var tmpWrap = document.createElement("div");
             var srOrigIdx = reversedMessages.length - 1 - mi;
@@ -8167,8 +8227,16 @@
               chatMessages.replaceChild(replacementEl, currentEl);
               attachCopyHandler(replacementEl);
               replacedAny = true;
+            } else if (mi > 0) {
+              // Once we hit an unchanged older message, stop scanning
+              break;
             }
           }
+          // Fallback: if hash changed but no visible diff found in the top N messages,
+          // the change is deeper — trigger a full render to avoid stale display.
+          if (!replacedAny && reversedMessages.length > MAX_STREAMING_SCAN) {
+            fullRenderChat();
+          }
           if (replacedAny) {
             requestAnimationFrame(function() {
               smartScrollToBottom(chatMessages);
@@ -8955,6 +9023,98 @@
         return '<div class="structured-tool-hint">已自动恢复一次 ' + escapeHtml(getToolDisplayName(toolName)) + ' 参数问题</div>';
       }
 
+      // ── 连续同类工具调用分组 ──
+      var GROUPABLE_TOOLS = { Read: 1, Glob: 1, Grep: 1, WebFetch: 1, WebSearch: 1, TodoRead: 1 };
+
+      function groupConsecutiveTools(content) {
+        var groups = [];
+        var i = 0;
+        while (i < content.length) {
+          var block = content[i];
+          if (block.type === "tool_result") { i++; continue; }
+          if (block.type === "tool_use" && GROUPABLE_TOOLS[block.name]) {
+            var run = [{ block: block, index: i }];
+            var j = i + 1;
+            while (j < content.length) {
+              if (content[j].type === "tool_result") { j++; continue; }
+              if (content[j].type === "tool_use" && GROUPABLE_TOOLS[content[j].name]) {
+                run.push({ block: content[j], index: j });
+                j++;
+              } else { break; }
+            }
+            if (run.length >= 2) {
+              groups.push({ type: "group", items: run, endIndex: j });
+            } else {
+              groups.push({ type: "single", block: block, index: i });
+            }
+            i = j;
+          } else {
+            groups.push({ type: "single", block: block, index: i });
+            i++;
+          }
+        }
+        return groups;
+      }
+
+      var TOOL_GROUP_LABELS = { Read: "读取", Glob: "搜索", Grep: "搜索", WebFetch: "抓取", WebSearch: "搜索", TodoRead: "待办" };
+
+      function renderToolGroup(items, role, toolResults) {
+        // Count by tool name
+        var counts = {};
+        for (var k = 0; k < items.length; k++) {
+          var n = items[k].block.name;
+          counts[n] = (counts[n] || 0) + 1;
+        }
+        // Check if all done or still pending
+        var allDone = true;
+        var anyError = false;
+        for (var k = 0; k < items.length; k++) {
+          var b = items[k].block;
+          var tr = pickToolResultForDisplay(toolResults, b.id);
+          if (!tr) { allDone = false; }
+          else if (tr.is_error) { anyError = true; }
+        }
+        var statusIcon = !allDone ? "…" : (anyError ? "✗" : "✓");
+        var statusClass = !allDone ? "pending" : (anyError ? "error" : "done");
+        // Summary text
+        var parts = [];
+        for (var name in counts) {
+          parts.push(counts[name] + " " + (TOOL_GROUP_LABELS[name] || name));
+        }
+        var summaryText = parts.join(" · ");
+
+        // Render each item's inline-tool card
+        var innerHtml = "";
+        for (var k = 0; k < items.length; k++) {
+          try {
+            innerHtml += renderContentBlock(items[k].block, role, toolResults, items[k].index);
+          } catch (e) {
+            innerHtml += '<div class="render-error">工具渲染失败</div>';
+          }
+        }
+
+        return '<div class="tool-group" data-expanded="false" data-status="' + statusClass + '">' +
+          '<div class="tool-group-summary" onclick="__toolGroupToggle(this.parentNode)">' +
+            '<span class="tool-group-status">' + statusIcon + '</span>' +
+            '<span class="tool-group-text">' + escapeHtml(summaryText) + '</span>' +
+            '<span class="tool-group-count">' + items.length + ' 个调用</span>' +
+            '<svg class="tool-group-chevron" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"/></svg>' +
+          '</div>' +
+          '<div class="tool-group-body">' + innerHtml + '</div>' +
+        '</div>';
+      }
+
+      // global toggle
+      window.__toolGroupToggle = function(el) {
+        if (!el) return;
+        var expanded = el.getAttribute("data-expanded") === "true";
+        el.setAttribute("data-expanded", expanded ? "false" : "true");
+        var body = el.querySelector(".tool-group-body");
+        if (body) body.style.display = expanded ? "none" : "block";
+        var chevron = el.querySelector(".tool-group-chevron");
+        if (chevron) chevron.style.transform = expanded ? "" : "rotate(180deg)";
+      };
+
       function renderStructuredMessage(msg, roundUsage) {
         var role = msg.role;
         var avatar = role === "assistant" ? '<div class="chat-message-avatar">赛博虎妞</div>' : "";
@@ -8973,10 +9133,15 @@
         var blocksHtml = "";
 
         try {
-          for (var i = 0; i < msg.content.length; i++) {
-            var block = msg.content[i];
+          var groups = groupConsecutiveTools(msg.content);
+          for (var g = 0; g < groups.length; g++) {
+            var grp = groups[g];
             try {
-              blocksHtml += renderContentBlock(block, role, toolResults, i);
+              if (grp.type === "group") {
+                blocksHtml += renderToolGroup(grp.items, role, toolResults);
+              } else {
+                blocksHtml += renderContentBlock(grp.block, role, toolResults, grp.index);
+              }
             } catch (e) {
               blocksHtml += '<div class="render-error">消息块渲染失败</div>';
             }
@@ -8989,17 +9154,6 @@
         }
 
         var usageHtml = "";
-        if (role === "assistant" && roundUsage) {
-          var u = roundUsage;
-          var parts = [];
-          if (u.inputTokens > 0) parts.push("输入 " + u.inputTokens);
-          if (u.outputTokens > 0) parts.push("输出 " + u.outputTokens);
-          if (u.cacheReadInputTokens > 0) parts.push("缓存 " + u.cacheReadInputTokens);
-          if (u.totalCostUsd > 0) parts.push("$" + u.totalCostUsd.toFixed(4));
-          if (parts.length > 0) {
-            usageHtml = '<div class="message-usage">' + parts.join(" · ") + '</div>';
-          }
-        }
 
         return '<div class="chat-message ' + role + '">' +
           avatar +

package/dist/web-ui/content/styles.css

@@ -2876,6 +2876,65 @@
       border-radius: 2px;
     }
 
+    /* ── Tool Group (连续同类调用折叠) ── */
+    .tool-group {
+      margin: 2px 0;
+      border-radius: 6px;
+      border: 1px solid var(--border-subtle, rgba(127,127,127,0.1));
+      overflow: hidden;
+    }
+    .tool-group-summary {
+      display: flex;
+      align-items: center;
+      gap: 6px;
+      padding: 5px 10px;
+      cursor: pointer;
+      font-size: 0.75rem;
+      color: var(--text-secondary);
+      user-select: none;
+      transition: background var(--transition-fast);
+    }
+    .tool-group-summary:hover {
+      background: var(--bg-hover, rgba(127,127,127,0.06));
+    }
+    .tool-group-status {
+      font-size: 0.6875rem;
+      flex-shrink: 0;
+      width: 14px;
+      text-align: center;
+    }
+    .tool-group[data-status="done"] .tool-group-status { color: var(--success, #22c55e); }
+    .tool-group[data-status="error"] .tool-group-status { color: var(--error, #ef4444); }
+    .tool-group[data-status="pending"] .tool-group-status { color: var(--text-muted); }
+    .tool-group-text {
+      flex: 1;
+      min-width: 0;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
+    .tool-group-count {
+      flex-shrink: 0;
+      font-size: 0.625rem;
+      color: var(--text-muted);
+    }
+    .tool-group-chevron {
+      flex-shrink: 0;
+      transition: transform 0.2s ease;
+      color: var(--text-muted);
+    }
+    .tool-group[data-expanded="true"] .tool-group-chevron {
+      transform: rotate(180deg);
+    }
+    .tool-group-body {
+      display: none;
+      padding: 2px 6px 4px;
+      border-top: 1px solid var(--border-subtle, rgba(127,127,127,0.08));
+    }
+    .tool-group[data-expanded="true"] .tool-group-body {
+      display: block;
+    }
+
     /* ── Inline Tool Display (Read, Glob, Grep, WebFetch, WebSearch, TodoRead) ── */
     .inline-tool {
       display: flex;
@@ -4743,7 +4802,7 @@
     .modal-backdrop {
       position: fixed;
       inset: 0;
-      z-index: 100;
+      z-index: 500;
       background: rgba(42, 28, 18, 0.52);
       backdrop-filter: blur(12px);
       -webkit-backdrop-filter: blur(12px);
@@ -5625,6 +5684,7 @@
       .modal { max-height: 80vh; }
       .modal-header { padding: 8px 10px; min-height: 36px; }
       .modal-body { padding: 8px 10px; }
+      .field-row { grid-template-columns: 1fr; gap: 0; }
 
       .btn { min-height: 36px; padding: 8px 12px; }
       .btn-sm { min-height: 28px; padding: 4px 8px; }
@@ -6228,18 +6288,21 @@
       background: none;
       border: none;
       border-bottom: 2px solid transparent;
+      border-radius: var(--radius-sm) var(--radius-sm) 0 0;
       cursor: pointer;
-      transition: color 0.15s, border-color 0.15s;
+      transition: color 0.15s, border-color 0.15s, background 0.15s;
       white-space: nowrap;
     }
 
     .settings-tab:hover {
       color: var(--text-primary);
+      background: rgba(197, 101, 61, 0.06);
     }
 
     .settings-tab.active {
       color: var(--accent);
       border-bottom-color: var(--accent);
+      background: var(--accent-muted);
     }
 
     .settings-panel {
@@ -6253,8 +6316,11 @@
     .settings-about-info {
       display: flex;
       flex-direction: column;
-      gap: 10px;
+      gap: 0;
       margin-bottom: 18px;
+      background: var(--bg-secondary);
+      border-radius: var(--radius-md);
+      padding: 2px 14px;
     }
 
     .settings-about-row {
@@ -6262,6 +6328,12 @@
       justify-content: space-between;
       align-items: center;
       font-size: 0.8125rem;
+      padding: 9px 0;
+      border-bottom: 1px solid var(--border-subtle);
+    }
+
+    .settings-about-row:last-child {
+      border-bottom: none;
     }
 
     .settings-label {
@@ -6297,8 +6369,8 @@
     .settings-section-title {
       font-size: 0.8125rem;
       font-weight: 600;
-      color: var(--fg-primary);
-      margin-bottom: 10px;
+      color: var(--text-primary);
+      margin: 0 0 12px 0;
       letter-spacing: 0.02em;
     }
 
@@ -6308,13 +6380,6 @@
       margin-top: 10px;
     }
 
-    .settings-section-title {
-      font-size: 0.875rem;
-      font-weight: 600;
-      color: var(--text-primary);
-      margin: 0 0 12px 0;
-    }
-
     .settings-divider {
       border: none;
       border-top: 1px solid var(--border-subtle);
@@ -6338,6 +6403,49 @@
       margin-bottom: 0;
     }
 
+    .field-row {
+      display: grid;
+      grid-template-columns: 1fr 1fr;
+      gap: 12px;
+      margin-bottom: 14px;
+    }
+    .field-row .field {
+      margin-bottom: 0;
+    }
+
+    .settings-card {
+      background: var(--bg-secondary);
+      border-radius: var(--radius-md);
+      padding: 16px;
+      margin-bottom: 14px;
+    }
+    .settings-card .field:last-of-type {
+      margin-bottom: 12px;
+    }
+    .settings-card .settings-section-title {
+      margin-top: 0;
+    }
+    .settings-card .field-input {
+      background: rgba(255, 255, 255, 0.6);
+    }
+    .settings-card .btn-block {
+      margin-bottom: 0;
+    }
+
+    .empty-state-compact {
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      gap: 6px;
+      padding: 32px 16px;
+      color: var(--text-muted);
+      font-size: 0.8125rem;
+    }
+    .empty-state-compact .empty-icon {
+      font-size: 1.5rem;
+      opacity: 0.5;
+    }
+
     .field-checkbox {
       width: 18px;
       height: 18px;
@@ -7522,13 +7630,61 @@
     }
 
     /* ── 结构化会话状态条 ── */
+    /* ── 输入框顶部波浪脉冲（回复中） ── */
+    .input-composer.in-flight {
+      border-color: transparent;
+    }
+    .input-composer.in-flight::before {
+      content: "";
+      position: absolute;
+      top: -2px;
+      left: -60%;
+      width: 220%;
+      height: 3px;
+      border-radius: 14px 14px 0 0;
+      background:
+        radial-gradient(ellipse 280px 4px,
+          rgba(var(--accent-rgb, 197, 101, 61), 0.45) 0%,
+          rgba(var(--accent-rgb, 197, 101, 61), 0.12) 35%,
+          transparent 60%)
+        no-repeat;
+      background-size: 280px 4px;
+      animation: composerWaveSlide 7s cubic-bezier(0.35, 0, 0.65, 1) infinite;
+      z-index: 2;
+      pointer-events: none;
+    }
+    .input-composer.in-flight::after {
+      content: "";
+      position: absolute;
+      top: -2px;
+      left: -60%;
+      width: 220%;
+      height: 3px;
+      border-radius: 14px 14px 0 0;
+      background:
+        radial-gradient(ellipse 220px 3px,
+          rgba(var(--accent-rgb, 197, 101, 61), 0.25) 0%,
+          rgba(var(--accent-rgb, 197, 101, 61), 0.06) 35%,
+          transparent 60%)
+        no-repeat;
+      background-size: 220px 3px;
+      animation: composerWaveSlide 9s cubic-bezier(0.35, 0, 0.65, 1) infinite reverse;
+      z-index: 2;
+      pointer-events: none;
+    }
+    @keyframes composerWaveSlide {
+      0%   { background-position: 0% center; }
+      100% { background-position: 100% center; }
+    }
+
+    /* ── 结构化会话状态条（输入框右上角） ── */
     .structured-status-bar {
       display: flex;
       align-items: center;
-      gap: 8px;
-      margin: 0;
-      padding: 4px 10px;
-      border-radius: var(--radius-sm);
+      justify-content: flex-end;
+      gap: 5px;
+      margin: 0 4px 2px 0;
+      padding: 0;
       background: transparent;
       border: none;
       font-size: 0.6875rem;
@@ -7537,35 +7693,25 @@
       overflow: hidden;
     }
 
-    .structured-status-bar .status-bar-label {
+    .structured-status-bar .status-bar-dot {
+      width: 5px;
+      height: 5px;
+      border-radius: 50%;
+      background: rgba(var(--accent-rgb, 197, 101, 61), 0.8);
+      animation: statusDotPulse 1.2s ease-in-out infinite;
       flex-shrink: 0;
-      font-weight: 500;
-      color: var(--text-muted);
     }
 
-    .structured-status-bar .status-bar-track {
-      flex: 1;
-      height: 2px;
-      border-radius: 1px;
-      background: rgba(var(--accent-rgb, 99, 102, 241), 0.08);
-      overflow: hidden;
-      position: relative;
-    }
-
-    .structured-status-bar .status-bar-fill {
-      position: absolute;
-      top: 0;
-      left: 0;
-      width: 30%;
-      height: 100%;
-      border-radius: 1px;
-      background: linear-gradient(90deg, transparent, var(--accent-soft), transparent);
-      animation: marqueeScroll 1.5s ease-in-out infinite;
+    @keyframes statusDotPulse {
+      0%, 100% { opacity: 0.4; transform: scale(0.9); }
+      50%      { opacity: 1;   transform: scale(1.1); }
     }
 
-    @keyframes marqueeScroll {
-      0%   { left: -40%; }
-      100% { left: 100%; }
+    .structured-status-bar .status-bar-label {
+      flex-shrink: 0;
+      font-weight: 500;
+      color: var(--text-muted);
+      font-size: 0.625rem;
     }
 
     .structured-status-bar .status-bar-timer {
@@ -7578,8 +7724,6 @@
 
     /* 完成态 */
     .structured-status-bar.completed {
-      background: transparent;
-      border-color: transparent;
       animation: statusBarFadeOut 2s ease-out 1s forwards;
     }
 
@@ -7587,22 +7731,10 @@
       color: var(--success);
     }
 
-    .structured-status-bar.completed .status-bar-track {
-      background: rgba(79, 122, 88, 0.1);
-    }
-
-    .structured-status-bar.completed .status-bar-fill {
-      width: 100%;
-      background: var(--success);
-      opacity: 0.5;
-      animation: none;
-      left: 0;
-    }
-
     @keyframes statusBarFadeOut {
-      0%   { opacity: 1; max-height: 30px; margin: 0; padding: 4px 10px; }
-      70%  { opacity: 0; max-height: 30px; margin: 0; padding: 4px 10px; }
-      100% { opacity: 0; max-height: 0; margin: 0; padding: 0 10px; border-width: 0; }
+      0%   { opacity: 1; max-height: 20px; }
+      70%  { opacity: 0; max-height: 20px; }
+      100% { opacity: 0; max-height: 0; margin: 0; }
     }
 
     /* 结束标记 */

package/dist/ws-broadcast.d.ts

@@ -3,12 +3,8 @@
  * Handles debounced output events, backpressure control, and client subscriptions.
  */
 import { WebSocketServer } from "ws";
-import type { SessionSnapshot } from "./types.js";
-export interface ProcessEvent {
-    type: "output" | "status" | "started" | "ended" | "usage" | "task" | "notification";
-    sessionId: string;
-    data?: unknown;
-}
+import type { SessionSnapshot, ProcessEvent } from "./types.js";
+export type { ProcessEvent } from "./types.js";
 export declare class WsBroadcastManager {
     private wss;
     private clients;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@co0ontty/wand",
-  "version": "1.5.4",
+  "version": "1.5.7",
   "description": "A web terminal for local CLI tools like Claude.",
   "type": "module",
   "bin": {