@deepseek-harness-tui/dsh-tui 0.8.8 → 0.9.1

package/lib/types/components/AutoRecapRow.js

@@ -0,0 +1,23 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import { Box, Text } from '../ui.js';
+import { Divider } from './design-system/Divider.js';
+import { t } from '../i18n.js';
+/**
+ * Auto-recap row (`dsh-tui.recapOnOpen` setting): a quiet, dim recap shown
+ * at the bottom of the transcript after an automatic summary on session
+ * open/resume — a thin divider, then a `回顾：` line showing the session
+ * tail in FULL (wraps over lines rather than truncating, like a colleague
+ * catching the user up). Hover reveals the affordances on their own row;
+ * click expands into the full RecapPanel; the dismiss chip hides the row
+ * until the next session switch. It bows out on its own once the user
+ * starts a new message (see Chat.tsx). Keyboard users keep `/recap` for
+ * the full panel.
+ */
+export function AutoRecapRow({ summary, streaming, onExpand, onDismiss, }) {
+    const [hovered, setHovered] = React.useState(false);
+    const line = t('recap-auto-line', {
+        summary: streaming ? t('recap-answering') : summary,
+    });
+    return (_jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsx(Divider, {}), _jsxs(Box, { flexDirection: "column", marginTop: 1, marginLeft: 1, onClick: onExpand, onMouseEnter: () => setHovered(true), onMouseLeave: () => setHovered(false), children: [_jsx(Text, { dimColor: !hovered, children: line }), hovered && (_jsxs(Box, { flexDirection: "row", marginTop: 1, children: [_jsxs(Text, { dimColor: true, children: [" [", t('recap-auto-hint'), "]"] }), _jsx(Box, { onClick: onDismiss, children: _jsxs(Text, { color: "warning", children: [" [\u00D7 ", t('recap-auto-close'), "]"] }) })] }))] })] }));
+}

package/lib/types/components/BtwPanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BtwPanel.d.ts","sourceRoot":"","sources":["../../../src/components/BtwPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAOzB;;;;;GAKG;AACH,wBAAgB,QAAQ,CAAC,EACvB,QAAQ,EACR,MAAM,EACN,KAAK,EACL,SAAS,EACT,OAAO,EACP,MAAM,GACP,EAAE;IACD,QAAQ,EAAE,MAAM,CAAA;IAChB,MAAM,EAAE,MAAM,CAAA;IACd,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,SAAS,EAAE,OAAO,CAAA;IAClB,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,MAAM,EAAE,MAAM,IAAI,CAAA;CACnB,GAAG,KAAK,CAAC,SAAS,CA4DlB"}
+{"version":3,"file":"BtwPanel.d.ts","sourceRoot":"","sources":["../../../src/components/BtwPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAOzB;;;;;GAKG;AACH,wBAAgB,QAAQ,CAAC,EACvB,QAAQ,EACR,MAAM,EACN,KAAK,EACL,SAAS,EACT,OAAO,EACP,MAAM,GACP,EAAE;IACD,QAAQ,EAAE,MAAM,CAAA;IAChB,MAAM,EAAE,MAAM,CAAA;IACd,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,SAAS,EAAE,OAAO,CAAA;IAClB,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,MAAM,EAAE,MAAM,IAAI,CAAA;CACnB,GAAG,KAAK,CAAC,SAAS,CA+DlB"}

package/lib/types/components/BtwPanel.js

@@ -43,5 +43,5 @@ export function BtwPanel({ question, answer, error, streaming, onClose, onCopy,
         event.stopImmediatePropagation();
     });
     const settled = answer !== '' || error !== undefined;
-    return (_jsxs(Box, { flexDirection: "column", children: [_jsxs(Text, { children: [_jsx(Text, { color: "warning", bold: true, children: "/btw " }), _jsx(Text, { dimColor: true, children: question })] }), _jsx(Box, { flexDirection: "column", maxHeight: Math.max(5, rows - 8), children: _jsx(Box, { marginLeft: 2, flexDirection: "column", flexGrow: 1, children: _jsx(ScrollBox, { ref: scrollRef, flexDirection: "column", flexGrow: 1, children: error !== undefined ? (_jsx(Text, { color: "error", children: error })) : answer !== '' ? (_jsx(Markdown, { cacheTokens: false, children: answer })) : (_jsxs(Box, { children: [_jsx(SpinnerGlyph, { frame: frame, messageColor: "warning" }), _jsxs(Text, { color: "warning", children: [" ", t('btw-answering')] })] })) }) }) }), _jsx(Text, { dimColor: true, children: settled ? t('btw-hint-done') : streaming ? t('btw-hint-loading') : t('btw-hint-done') })] }));
+    return (_jsxs(Box, { flexDirection: "column", children: [_jsxs(Text, { children: [_jsx(Text, { color: "warning", bold: true, children: "/btw " }), _jsx(Text, { dimColor: true, children: question })] }), _jsx(Box, { flexDirection: "column", maxHeight: Math.max(5, rows - 8), children: _jsx(Box, { marginLeft: 2, flexDirection: "column", flexGrow: 1, children: _jsx(ScrollBox, { ref: scrollRef, flexDirection: "column", flexGrow: 1, children: error !== undefined ? (_jsx(Text, { color: "error", children: error })) : answer !== '' ? (_jsx(Markdown, { cacheTokens: false, children: answer })) : (_jsxs(Box, { children: [_jsx(SpinnerGlyph, { frame: frame, messageColor: "warning" }), _jsxs(Text, { color: "warning", children: [" ", t('btw-answering')] })] })) }) }) }), _jsx(Box, { onClick: settled ? onCopy : undefined, children: _jsx(Text, { dimColor: true, children: settled ? t('btw-hint-done') : streaming ? t('btw-hint-loading') : t('btw-hint-done') }) })] }));
 }

package/lib/types/components/Chat/SubagentMessage.d.ts

@@ -1,5 +1,6 @@
 import React from 'react';
 import type { SubagentRow } from '../../dsh-adapter/channel.js';
+import type { ClickEvent } from '../../ink/events/click-event.js';
 /**
  * Borderless, fixed-height activity card embedded directly in the transcript
  * (Kimi Code visual language). Running: header + one-line current tool + a
@@ -14,6 +15,6 @@ export declare function SubagentMessage({ subagent, addMargin, activityFrames, o
     addMargin: boolean;
     activityFrames?: string;
     isExpanded: boolean;
-    onClick: () => void;
+    onClick?(event: ClickEvent): void;
 }): React.ReactNode;
 //# sourceMappingURL=SubagentMessage.d.ts.map

package/lib/types/components/Chat/SubagentMessage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SubagentMessage.d.ts","sourceRoot":"","sources":["../../../../src/components/Chat/SubagentMessage.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAA;AA+C/D;;;;;;;;GAQG;AACH,wBAAgB,eAAe,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,cAAc,EAAE,OAAO,EAAE,EAAE;IAChF,QAAQ,EAAE,WAAW,CAAA;IACrB,SAAS,EAAE,OAAO,CAAA;IAClB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,UAAU,EAAE,OAAO,CAAA;IACnB,OAAO,EAAE,MAAM,IAAI,CAAA;CACpB,GAAG,KAAK,CAAC,SAAS,CAqElB"}
+{"version":3,"file":"SubagentMessage.d.ts","sourceRoot":"","sources":["../../../../src/components/Chat/SubagentMessage.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAA;AAO/D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iCAAiC,CAAA;AAyCjE;;;;;;;;GAQG;AACH,wBAAgB,eAAe,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,cAAc,EAAE,OAAO,EAAE,EAAE;IAChF,QAAQ,EAAE,WAAW,CAAA;IACrB,SAAS,EAAE,OAAO,CAAA;IAClB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,UAAU,EAAE,OAAO,CAAA;IACnB,OAAO,CAAC,CAAC,KAAK,EAAE,UAAU,GAAG,IAAI,CAAA;CAClC,GAAG,KAAK,CAAC,SAAS,CAwFlB"}

package/lib/types/components/Chat/SubagentMessage.js

@@ -58,10 +58,16 @@ function clipLine(text, maxWidth) {
  * setting as the main spinner.
  */
 export function SubagentMessage({ subagent, addMargin, activityFrames, onClick }) {
-    const [, time] = useAnimationFrame(120);
+    const settled = subagent.status === 'completed' || subagent.status === 'failed' || subagent.status === 'cancelled';
+    // 动画订阅仅限运行中的卡片：settled 后传 null 退出共享 clock（keepAlive
+    // 归零 → interval 清除），否则历史里的每张完成卡片都以 120ms 永久驱动
+    // React commit。viewportRef 必须挂到根节点——useTerminalViewport 初始
+    // isVisible:true，ref 不挂就永远不修正（虚拟化滚出视口的卡片继续动画）。
+    const [viewportRef, time] = useAnimationFrame(settled ? null : 120);
     const { columns } = useTerminalSize();
     const info = status(subagent);
-    const settled = subagent.status === 'completed' || subagent.status === 'failed' || subagent.status === 'cancelled';
+    const [hovered, setHovered] = React.useState(false);
+    const clickable = onClick !== undefined;
     const elapsed = subagent.completedAt ? subagent.durationMs : Date.now() - subagent.startedAt;
     const lastRunning = [...subagent.toolCalls].reverse().find(tool => tool.status === 'running');
     const previousDone = lastRunning
@@ -71,5 +77,7 @@ export function SubagentMessage({ subagent, addMargin, activityFrames, onClick }
     const activity = settled ? [] : subagent.outputLines.slice(-WATERFALL_ROWS);
     const runningGlyph = preset.frames[Math.floor(time / preset.intervalMs) % preset.frames.length] ?? '·';
     const rowWidth = Math.max(20, (columns ?? 80) - WATERFALL_GUTTER);
-    return _jsxs(Box, { flexDirection: "column", marginTop: addMargin ? 1 : 0, paddingLeft: 2, onClick: onClick, children: [_jsxs(Box, { flexDirection: "row", gap: 1, children: [_jsx(Text, { color: info.color, children: settled ? info.glyph : ` ${runningGlyph}` }), _jsx(Text, { bold: true, children: `${t('subagent-card-prefix')}${subagent.description}` }), _jsx(Text, { dimColor: true, children: "\u00B7" }), _jsx(Text, { children: subagent.model ?? subagent.provider ?? 'default' }), subagent.effort && _jsxs(_Fragment, { children: [_jsx(Text, { dimColor: true, children: "\u00B7" }), _jsx(Text, { dimColor: true, children: subagent.effort })] }), _jsx(Text, { dimColor: true, children: "\u00B7" }), _jsx(Text, { dimColor: true, children: duration(elapsed) }), _jsx(Text, { dimColor: true, children: "\u00B7" }), _jsx(Text, { dimColor: true, children: tokens(subagent) }), _jsx(Text, { dimColor: true, children: "\u00B7" }), _jsxs(Text, { dimColor: true, children: [subagent.toolCalls.length, " tools"] }), _jsx(Text, { dimColor: true, children: "\u00B7" }), _jsx(Text, { color: info.color, children: info.label })] }), !settled && (lastRunning ?? previousDone) !== undefined && (_jsx(Text, { wrap: "truncate", children: lastRunning !== undefined ? (_jsxs(_Fragment, { children: [previousDone !== undefined && (_jsxs(_Fragment, { children: [_jsx(Text, { dimColor: true, children: '  · ' }), _jsx(Text, { color: "success", children: "\u2713" }), _jsx(Text, { color: toolNameColor(previousDone.name), children: previousDone.name }), _jsx(Text, { dimColor: true, children: ' · ' })] })), lastRunning.argsPreview === undefined && (_jsx(Text, { color: toolNameColor(lastRunning.name), children: lastRunning.name })), lastRunning.argsPreview !== undefined && (_jsxs(_Fragment, { children: [_jsx(Text, { color: toolNameColor(lastRunning.name), children: lastRunning.name }), _jsx(Text, { dimColor: true, children: ` (${clipLine(lastRunning.argsPreview.replace(/\s+/g, ' ').trim(), Math.max(10, rowWidth - lastRunning.name.length - 6))})` })] }))] })) : (previousDone !== undefined && (_jsxs(_Fragment, { children: [_jsx(Text, { dimColor: true, children: '  · ' }), _jsx(Text, { color: "success", children: "\u2713" }), _jsx(Text, { color: toolNameColor(previousDone.name), children: previousDone.name }), previousDone.argsPreview !== undefined && (_jsx(Text, { dimColor: true, children: ` (${clipLine(previousDone.argsPreview.replace(/\s+/g, ' ').trim(), Math.max(10, rowWidth - previousDone.name.length - 6))})` }))] }))) })), !settled && Array.from({ length: WATERFALL_ROWS }, (_, index) => (_jsx(Text, { dimColor: true, wrap: "truncate", children: `  │ ${clipLine(activity[index] ?? '', rowWidth)}` }, `${subagent.agentId}-wf-${index}-${time}`))), settled && subagent.status === 'failed' && subagent.error && (_jsx(Text, { color: "error", wrap: "truncate", children: `  └ ${clipLine(subagent.error, rowWidth)}` }))] });
+    // 点击打开详情场景；hover 不刷整行背景（转录视觉保持安静），只把状态
+    // glyph 提亮为品牌色作为可点指示。
+    return _jsxs(Box, { flexDirection: "column", marginTop: addMargin ? 1 : 0, paddingLeft: 2, ref: viewportRef, onClick: onClick, onMouseEnter: clickable ? () => setHovered(true) : undefined, onMouseLeave: clickable ? () => setHovered(false) : undefined, children: [_jsxs(Box, { flexDirection: "row", gap: 1, children: [_jsx(Text, { color: hovered && clickable ? 'claude' : info.color, children: settled ? info.glyph : ` ${runningGlyph}` }), _jsx(Text, { bold: true, color: hovered && clickable ? 'claude' : undefined, children: `${t('subagent-card-prefix')}${subagent.description}` }), _jsx(Text, { dimColor: true, children: "\u00B7" }), _jsx(Text, { children: subagent.model ?? subagent.provider ?? 'default' }), subagent.effort && _jsxs(_Fragment, { children: [_jsx(Text, { dimColor: true, children: "\u00B7" }), _jsx(Text, { dimColor: true, children: subagent.effort })] }), _jsx(Text, { dimColor: true, children: "\u00B7" }), _jsx(Text, { dimColor: true, children: duration(elapsed) }), _jsx(Text, { dimColor: true, children: "\u00B7" }), _jsx(Text, { dimColor: true, children: tokens(subagent) }), _jsx(Text, { dimColor: true, children: "\u00B7" }), _jsxs(Text, { dimColor: true, children: [subagent.toolCalls.length, " tools"] }), _jsx(Text, { dimColor: true, children: "\u00B7" }), _jsx(Text, { color: info.color, children: info.label })] }), !settled && (lastRunning ?? previousDone) !== undefined && (_jsx(Text, { wrap: "truncate", children: lastRunning !== undefined ? (_jsxs(_Fragment, { children: [previousDone !== undefined && (_jsxs(_Fragment, { children: [_jsx(Text, { dimColor: true, children: '  · ' }), _jsx(Text, { color: "success", children: "\u2713" }), _jsx(Text, { color: toolNameColor(previousDone.name), children: previousDone.name }), _jsx(Text, { dimColor: true, children: ' · ' })] })), lastRunning.argsPreview === undefined && (_jsx(Text, { color: toolNameColor(lastRunning.name), children: lastRunning.name })), lastRunning.argsPreview !== undefined && (_jsxs(_Fragment, { children: [_jsx(Text, { color: toolNameColor(lastRunning.name), children: lastRunning.name }), _jsx(Text, { dimColor: true, children: ` (${clipLine(lastRunning.argsPreview.replace(/\s+/g, ' ').trim(), Math.max(10, rowWidth - lastRunning.name.length - 6))})` })] }))] })) : (previousDone !== undefined && (_jsxs(_Fragment, { children: [_jsx(Text, { dimColor: true, children: '  · ' }), _jsx(Text, { color: "success", children: "\u2713" }), _jsx(Text, { color: toolNameColor(previousDone.name), children: previousDone.name }), previousDone.argsPreview !== undefined && (_jsx(Text, { dimColor: true, children: ` (${clipLine(previousDone.argsPreview.replace(/\s+/g, ' ').trim(), Math.max(10, rowWidth - previousDone.name.length - 6))})` }))] }))) })), !settled && Array.from({ length: WATERFALL_ROWS }, (_, index) => (_jsx(Text, { dimColor: true, wrap: "truncate", children: `  │ ${clipLine(activity[index] ?? '', rowWidth)}` }, `${subagent.agentId}-wf-${index}`))), settled && subagent.status === 'failed' && subagent.error && (_jsx(Text, { color: "error", wrap: "truncate", children: `  └ ${clipLine(subagent.error, rowWidth)}` }))] });
 }

package/lib/types/components/ColorPicker.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+/**
+ * Session accent color picker (bare `/color`): a permission-colored Pane
+ * listing the whole palette with a colored swatch per row, `❯` focus
+ * pointer and `✓` on the session's current color. Enter applies through
+ * `channel.setSessionColor`, Esc cancels. The palette is static, so the
+ * picker never needs an async list.
+ */
+export declare function ColorPicker({ focusIndex, currentColor, onPick, }: {
+    focusIndex: number;
+    /** The session's current accent color name ('' = theme default). */
+    currentColor: string;
+    /** Mouse pick (fullscreen): clicked row's absolute index (Chat applies
+     *  the same code path as the keyboard Enter). */
+    onPick?: (index: number) => void;
+}): React.ReactNode;
+//# sourceMappingURL=ColorPicker.d.ts.map

package/lib/types/components/ColorPicker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColorPicker.d.ts","sourceRoot":"","sources":["../../../src/components/ColorPicker.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAQzB;;;;;;GAMG;AACH,wBAAgB,WAAW,CAAC,EAC1B,UAAU,EACV,YAAY,EACZ,MAAM,GACP,EAAE;IACD,UAAU,EAAE,MAAM,CAAA;IAClB,oEAAoE;IACpE,YAAY,EAAE,MAAM,CAAA;IACpB;qDACiD;IACjD,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;CACjC,GAAG,KAAK,CAAC,SAAS,CA6BlB"}

package/lib/types/components/ColorPicker.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { t } from '../i18n.js';
+import { Box, Text } from '../ui.js';
+import { Pane } from './design-system/Pane.js';
+import { Select } from './Select.js';
+import { HintLine } from './design-system/HintLine.js';
+import { SESSION_COLOR_NAMES, SESSION_COLORS } from '../cc/sessionColors.js';
+/**
+ * Session accent color picker (bare `/color`): a permission-colored Pane
+ * listing the whole palette with a colored swatch per row, `❯` focus
+ * pointer and `✓` on the session's current color. Enter applies through
+ * `channel.setSessionColor`, Esc cancels. The palette is static, so the
+ * picker never needs an async list.
+ */
+export function ColorPicker({ focusIndex, currentColor, onPick, }) {
+    return (_jsx(Pane, { color: "permission", children: _jsxs(Box, { flexDirection: "column", children: [_jsx(Box, { marginBottom: 1, children: _jsx(Text, { color: "remember", bold: true, children: t('picker-title-color') }) }), _jsx(Select, { options: SESSION_COLOR_NAMES.map(name => ({
+                        value: name,
+                        label: (_jsxs(Text, { children: [_jsx(Text, { color: SESSION_COLORS[name], children: "\u25CF " }), name] })),
+                    })), focusIndex: focusIndex, selectedValue: currentColor === '' ? undefined : currentColor, onPick: onPick ? index => onPick(index) : undefined }), _jsx(Text, { dimColor: true, italic: true, children: _jsx(HintLine, { text: t('hint-confirm-exit') }) })] }) }));
+}

package/lib/types/components/CommandSuggestions.d.ts

@@ -1,16 +1,35 @@
 import React from 'react';
+import type { Color } from '../ink/styles.js';
+import type { Theme } from '../theme.js';
 import type { LocalCommand } from '../commands.js';
 /**
  * The slash-command suggestion overlay, mirroring Claude Code's
- * `PromptInputFooterSuggestions.tsx` (command layout only): a name column
- * padded to a fixed width, optional `[tag]`, then a truncated description.
- * The selected row renders in the theme's `suggestion` color, others dim.
+ * `PromptInputFooterSuggestions.tsx` (command layout only) wrapped in the
+ * shared rounded `SuggestionCard`:
+ *
+ *   ╭─ 命令 · 共 12 项 ──────────────────────╮
+ *   │ ❯ compact  Compact the conversation …  │   ← 选中：❯ + 加粗 + suggestion 色
+ *   │   compare  Compare selected messages … │   ← 名字里命中输入的段提亮
+ *   │ ↑2 · ↓3                                 │   ← 仅当列表被窗口裁剪
+ *   ╰─────────────────────────────────────────╯
+ *
+ * 未选中行整体 dim，唯独名字里匹配当前查询 token 的前缀以正常亮度提亮
+ * （bold 与 dim 在终端互斥，故提亮用非 dim 而非加粗）；选中行整行
+ * suggestion 色、名字加粗、前置 ❯ 指针。
  */
-export declare function CommandSuggestions({ commands, selectedIndex, columns, }: {
+export declare function CommandSuggestions({ commands, selectedIndex, columns, query, accent, onPick, onWheelStep, }: {
     commands: readonly (LocalCommand & {
         descriptionKey?: string;
     })[];
     selectedIndex: number;
     columns: number;
+    /** 原始 `/…` 输入；其最后一段 token 用于名字前缀高亮。 */
+    query?: string;
+    accent?: keyof Theme | Color;
+    /** 鼠标点击行（fullscreen）：上报过滤后列表的绝对索引（与键盘
+     *  selectedIndex 同一索引空间），接受路径由 PromptInput 复用。 */
+    onPick?: (index: number) => void;
+    /** 滚轮步进（fullscreen）：±1 移动选中行。 */
+    onWheelStep?: (step: 1 | -1) => void;
 }): React.ReactNode;
 //# sourceMappingURL=CommandSuggestions.d.ts.map

package/lib/types/components/CommandSuggestions.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CommandSuggestions.d.ts","sourceRoot":"","sources":["../../../src/components/CommandSuggestions.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAGlD;;;;;GAKG;AACH,wBAAgB,kBAAkB,CAAC,EACjC,QAAQ,EACR,aAAa,EACb,OAAO,GACR,EAAE;IACD,QAAQ,EAAE,SAAS,CAAC,YAAY,GAAG;QAAE,cAAc,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,EAAE,CAAA;IACjE,aAAa,EAAE,MAAM,CAAA;IACrB,OAAO,EAAE,MAAM,CAAA;CAChB,GAAG,KAAK,CAAC,SAAS,CAqDlB"}
+{"version":3,"file":"CommandSuggestions.d.ts","sourceRoot":"","sources":["../../../src/components/CommandSuggestions.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAA;AAC7C,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,aAAa,CAAA;AACxC,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAMlD;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,kBAAkB,CAAC,EACjC,QAAQ,EACR,aAAa,EACb,OAAO,EACP,KAAU,EACV,MAAM,EACN,MAAM,EACN,WAAW,GACZ,EAAE;IACD,QAAQ,EAAE,SAAS,CAAC,YAAY,GAAG;QAAE,cAAc,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,EAAE,CAAA;IACjE,aAAa,EAAE,MAAM,CAAA;IACrB,OAAO,EAAE,MAAM,CAAA;IACf,uCAAuC;IACvC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,MAAM,KAAK,GAAG,KAAK,CAAA;IAC5B;sDACkD;IAClD,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAChC,iCAAiC;IACjC,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,GAAG,CAAC,CAAC,KAAK,IAAI,CAAA;CACrC,GAAG,KAAK,CAAC,SAAS,CAmFlB"}

package/lib/types/components/CommandSuggestions.js

@@ -1,35 +1,62 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Box, Text } from '../ui.js';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Text } from '../ui.js';
 import { stringWidth } from '../ink/stringWidth.js';
 import { truncateToWidth } from '../ink/truncateToWidth.js';
 import { localizedDescription } from '../commands.js';
+import { t } from '../i18n.js';
+import { POINTER } from '../cc/figures.js';
+import { SuggestionCard, cardContentWidth, splitQueryMatch } from './SuggestionCard.js';
 /**
  * The slash-command suggestion overlay, mirroring Claude Code's
- * `PromptInputFooterSuggestions.tsx` (command layout only): a name column
- * padded to a fixed width, optional `[tag]`, then a truncated description.
- * The selected row renders in the theme's `suggestion` color, others dim.
+ * `PromptInputFooterSuggestions.tsx` (command layout only) wrapped in the
+ * shared rounded `SuggestionCard`:
+ *
+ *   ╭─ 命令 · 共 12 项 ──────────────────────╮
+ *   │ ❯ compact  Compact the conversation …  │   ← 选中：❯ + 加粗 + suggestion 色
+ *   │   compare  Compare selected messages … │   ← 名字里命中输入的段提亮
+ *   │ ↑2 · ↓3                                 │   ← 仅当列表被窗口裁剪
+ *   ╰─────────────────────────────────────────╯
+ *
+ * 未选中行整体 dim，唯独名字里匹配当前查询 token 的前缀以正常亮度提亮
+ * （bold 与 dim 在终端互斥，故提亮用非 dim 而非加粗）；选中行整行
+ * suggestion 色、名字加粗、前置 ❯ 指针。
  */
-export function CommandSuggestions({ commands, selectedIndex, columns, }) {
+export function CommandSuggestions({ commands, selectedIndex, columns, query = '', accent, onPick, onWheelStep, }) {
     if (commands.length === 0)
         return null;
-    // Cap the command name column at 40% of terminal width to ensure the
-    // description has space (same as Claude Code).
-    const maxNameWidth = Math.floor(columns * 0.4);
+    // Cap the command name column at 40% of the card's content width to ensure
+    // the description has space (same ratio as Claude Code).
+    const usable = cardContentWidth(columns);
+    const maxNameWidth = Math.floor(usable * 0.4);
     const nameWidth = Math.min(Math.max(...commands.map(c => stringWidth(c.name))) + 5, maxNameWidth);
     const maxVisible = 5;
     const startIndex = Math.max(0, Math.min(selectedIndex - Math.floor(maxVisible / 2), commands.length - maxVisible));
     const visible = commands.slice(startIndex, startIndex + maxVisible);
-    return (_jsx(Box, { flexDirection: "column", children: visible.map(command => {
+    const above = startIndex;
+    const below = commands.length - (startIndex + visible.length);
+    // 前缀高亮取查询的最后一段 token（`/plan of` 高亮 `of` 命中的段）。
+    const queryToken = query.replace(/^\//, '').match(/[^ \t]*$/)?.[0] ?? '';
+    const title = `${t('sugg-commands-title')} · ${t('sugg-count', { n: commands.length })}`;
+    const footer = above > 0 || below > 0
+        ? [
+            above > 0 ? t('sugg-more-above', { n: above }) : null,
+            below > 0 ? t('sugg-more-below', { n: below }) : null,
+        ]
+            .filter((part) => part !== null)
+            .join(' · ')
+        : null;
+    return (_jsx(SuggestionCard, { title: title, columns: columns, accent: accent, footer: footer, onRowPick: onPick ? index => onPick(startIndex + index) : undefined, onWheelStep: onWheelStep, rows: visible.map(command => {
             const isSelected = command.name === commands[selectedIndex]?.name;
-            const padded = command.name +
-                ' '.repeat(Math.max(0, nameWidth - stringWidth(command.name)));
             const tagText = command.tag ? `[${command.tag}] ` : '';
             const tagWidth = stringWidth(tagText);
-            const descriptionWidth = Math.max(0, columns - nameWidth - tagWidth - 4);
+            // 行预算：内容宽 − 前导空格 1 − 指针列 2。
+            const descriptionWidth = Math.max(0, usable - 3 - nameWidth - tagWidth);
             const rawDescription = localizedDescription(command);
             const description = stringWidth(rawDescription) > descriptionWidth
                 ? truncateToWidth(rawDescription, descriptionWidth - 1) + '…'
                 : rawDescription;
-            return (_jsxs(Text, { wrap: "truncate", children: [_jsx(Text, { color: isSelected ? 'suggestion' : undefined, dimColor: !isSelected, children: padded }), tagText ? _jsx(Text, { dimColor: true, children: tagText }) : null, _jsx(Text, { color: isSelected ? 'suggestion' : undefined, dimColor: !isSelected, children: description })] }, command.name));
+            const parts = splitQueryMatch(command.name, queryToken);
+            const padAfter = Math.max(0, nameWidth - stringWidth(command.name));
+            return (_jsxs(Text, { wrap: "truncate", children: [' ', isSelected ? (_jsx(Text, { color: "suggestion", bold: true, children: `${POINTER} ${command.name}${' '.repeat(padAfter)}` })) : parts ? (_jsxs(_Fragment, { children: [_jsx(Text, { dimColor: true, children: `  ${parts.before}` }), _jsx(Text, { children: parts.match }), _jsx(Text, { dimColor: true, children: `${parts.after}${' '.repeat(padAfter)}` })] })) : (_jsx(Text, { dimColor: true, children: `  ${command.name}${' '.repeat(padAfter)}` })), tagText ? _jsx(Text, { dimColor: true, children: tagText }) : null, _jsx(Text, { color: isSelected ? 'suggestion' : undefined, dimColor: !isSelected, children: description })] }, command.name));
         }) }));
 }

package/lib/types/components/ContextBarView.d.ts

@@ -0,0 +1,33 @@
+import React from 'react';
+import type { Color } from '../ink/styles.js';
+import { type ContextSegments } from '../screens/StatusMetrics.js';
+/**
+ * The hoverable JSX twin of `renderContextBar`: the same segmented context
+ * bar (same largest-remainder column split, same label fallback ladder,
+ * same free-segment readout), rendered as one Box per segment so each
+ * carries its own mouse handlers. Hovering a segment reports its key (or
+ * `free`) upward through `onHover`; the footer turns that into a detail
+ * readout on its supplemental row.
+ *
+ * Pixel parity with the ANSI path is the contract: this exists so the bar
+ * can react to the pointer, not to restyle it.
+ */
+export declare function ContextBarView({ segments, usedTokens, contextWindow, width, colors, onHover, }: {
+    /** Used tokens per content type. */
+    segments: ContextSegments;
+    /** Total used tokens, driving the usage readout. */
+    usedTokens: number;
+    /** The context window size in tokens. */
+    contextWindow: number;
+    /** Total bar width in terminal columns. */
+    width: number;
+    /** Theme overrides for the free segment (light theme passes its own). */
+    colors?: {
+        freeFill: Color;
+        freeText: Color;
+    };
+    /** Hover signal: a segment key (`system`…`tools`), `free`, or null on
+     *  leave. Absent handlers render a static bar (tests, headless embeds). */
+    onHover?: (segment: string | null) => void;
+}): React.ReactNode;
+//# sourceMappingURL=ContextBarView.d.ts.map

package/lib/types/components/ContextBarView.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ContextBarView.d.ts","sourceRoot":"","sources":["../../../src/components/ContextBarView.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAA;AAC7C,OAAO,EAOL,KAAK,eAAe,EACrB,MAAM,6BAA6B,CAAA;AAOpC;;;;;;;;;;GAUG;AACH,wBAAgB,cAAc,CAAC,EAC7B,QAAQ,EACR,UAAU,EACV,aAAa,EACb,KAAK,EACL,MAAM,EACN,OAAO,GACR,EAAE;IACD,oCAAoC;IACpC,QAAQ,EAAE,eAAe,CAAA;IACzB,oDAAoD;IACpD,UAAU,EAAE,MAAM,CAAA;IAClB,yCAAyC;IACzC,aAAa,EAAE,MAAM,CAAA;IACrB,2CAA2C;IAC3C,KAAK,EAAE,MAAM,CAAA;IACb,yEAAyE;IACzE,MAAM,CAAC,EAAE;QAAE,QAAQ,EAAE,KAAK,CAAC;QAAC,QAAQ,EAAE,KAAK,CAAA;KAAE,CAAA;IAC7C;+EAC2E;IAC3E,OAAO,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAA;CAC3C,GAAG,KAAK,CAAC,SAAS,CAgElB"}

package/lib/types/components/ContextBarView.js

@@ -0,0 +1,46 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Box, Text } from '../ui.js';
+import { USED_SEGMENTS, allocateBarColumns, centeredText, chooseLabel, composeFreeSegmentText, formatTokens, } from '../screens/StatusMetrics.js';
+/** Free-segment colors, mirroring StatusMetrics' dark-theme defaults. */
+const FREE_FILL = '#E8E8E8';
+const FREE_TEXT = '#4A4A4A';
+const USED_TEXT = '#FFFFFF';
+/**
+ * The hoverable JSX twin of `renderContextBar`: the same segmented context
+ * bar (same largest-remainder column split, same label fallback ladder,
+ * same free-segment readout), rendered as one Box per segment so each
+ * carries its own mouse handlers. Hovering a segment reports its key (or
+ * `free`) upward through `onHover`; the footer turns that into a detail
+ * readout on its supplemental row.
+ *
+ * Pixel parity with the ANSI path is the contract: this exists so the bar
+ * can react to the pointer, not to restyle it.
+ */
+export function ContextBarView({ segments, usedTokens, contextWindow, width, colors, onHover, }) {
+    if (width <= 0 || contextWindow <= 0)
+        return null;
+    const freeTokens = Math.max(0, contextWindow - usedTokens);
+    const values = [...USED_SEGMENTS.map(segment => segments[segment.key]), freeTokens];
+    const columns = allocateBarColumns(values, width);
+    const percent = `${((usedTokens / contextWindow) * 100).toFixed(1)}%`;
+    const total = `${formatTokens(usedTokens)}/${formatTokens(contextWindow)}`;
+    const free = formatTokens(contextWindow - usedTokens);
+    const nodes = [];
+    for (const [index, segment] of USED_SEGMENTS.entries()) {
+        const segmentWidth = columns[index] ?? 0;
+        if (segmentWidth <= 0)
+            continue;
+        const label = chooseLabel(segment.labels, segmentWidth);
+        nodes.push(_jsx(Box, { width: segmentWidth, height: 1, flexShrink: 0, backgroundColor: segment.color, onMouseEnter: onHover === undefined ? undefined : () => onHover(segment.key), onMouseLeave: onHover === undefined ? undefined : () => onHover(null), children: _jsx(Text, { color: USED_TEXT, children: label.length > 0 ? centeredText(label, segmentWidth) : ' '.repeat(segmentWidth) }) }, segment.key));
+    }
+    const freeWidth = columns[USED_SEGMENTS.length] ?? 0;
+    if (freeWidth > 0) {
+        nodes.push(_jsx(Box, { width: freeWidth, height: 1, flexShrink: 0, backgroundColor: colors?.freeFill ?? FREE_FILL, onMouseEnter: onHover === undefined ? undefined : () => onHover('free'), onMouseLeave: onHover === undefined ? undefined : () => onHover(null), children: _jsx(Text, { color: colors?.freeText ?? FREE_TEXT, children: composeFreeSegmentText([
+                    `ctx ${total} ${percent} ${free}`,
+                    `${total} ${percent} ${free}`,
+                    `${total} ${percent}`,
+                    percent,
+                ], freeWidth) }) }, "free"));
+    }
+    return (_jsx(Box, { flexDirection: "row", flexShrink: 0, width: width, children: nodes }));
+}

package/lib/types/components/EffortInputBorder.d.ts

@@ -22,7 +22,16 @@
 import React from 'react';
 import type { Color } from '../ink/styles.js';
 import type { Theme } from '../theme.js';
-export declare function EffortInputBorder({ effort, levels, columns, onLight, idleColor, children, }: {
+/** A static chip on the top border row (the session label, CC-style). */
+export interface InputBorderLabel {
+    /** Visible text (already width-truncated by the caller). */
+    text: string;
+    /** Chip background (theme token or raw color). */
+    color: keyof Theme | Color;
+    /** Chip foreground (theme token or raw color). */
+    ink: keyof Theme | Color;
+}
+export declare function EffortInputBorder({ effort, levels, columns, onLight, idleColor, topRightLabel, children, }: {
     /** 当前思考强度档 id；`undefined` 表示路线未声明。 */
     effort: string | undefined;
     /** 当前路线的档位表（低→高，末位为最高档）；未知时传 `undefined`。 */
@@ -31,6 +40,8 @@ export declare function EffortInputBorder({ effort, levels, columns, onLight, id
     onLight: boolean;
     /** 静止边框色（主题 token 名，如 'promptBorder' / 'planMode'）。 */
     idleColor: keyof Theme | Color;
+    /** 顶边框右侧的静态标签 chip（会话名标签）；undefined = 不显示。 */
+    topRightLabel?: InputBorderLabel;
     children: React.ReactNode;
 }): React.ReactNode;
 //# sourceMappingURL=EffortInputBorder.d.ts.map

package/lib/types/components/EffortInputBorder.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EffortInputBorder.d.ts","sourceRoot":"","sources":["../../../src/components/EffortInputBorder.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,OAAO,KAA8D,MAAM,OAAO,CAAA;AAGlF,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAA;AAC7C,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,aAAa,CAAA;AAgCxC,wBAAgB,iBAAiB,CAAC,EAChC,MAAM,EACN,MAAM,EACN,OAAO,EACP,OAAO,EACP,SAAS,EACT,QAAQ,GACT,EAAE;IACD,sCAAsC;IACtC,MAAM,EAAE,MAAM,GAAG,SAAS,CAAA;IAC1B,6CAA6C;IAC7C,MAAM,EAAE,SAAS,MAAM,EAAE,GAAG,SAAS,CAAA;IACrC,OAAO,EAAE,MAAM,CAAA;IACf,OAAO,EAAE,OAAO,CAAA;IAChB,uDAAuD;IACvD,SAAS,EAAE,MAAM,KAAK,GAAG,KAAK,CAAA;IAC9B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B,GAAG,KAAK,CAAC,SAAS,CA0DlB"}
+{"version":3,"file":"EffortInputBorder.d.ts","sourceRoot":"","sources":["../../../src/components/EffortInputBorder.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,OAAO,KAA8D,MAAM,OAAO,CAAA;AAGlF,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAA;AAE7C,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,aAAa,CAAA;AAKxC,yEAAyE;AACzE,MAAM,WAAW,gBAAgB;IAC/B,4DAA4D;IAC5D,IAAI,EAAE,MAAM,CAAA;IACZ,kDAAkD;IAClD,KAAK,EAAE,MAAM,KAAK,GAAG,KAAK,CAAA;IAC1B,kDAAkD;IAClD,GAAG,EAAE,MAAM,KAAK,GAAG,KAAK,CAAA;CACzB;AAiDD,wBAAgB,iBAAiB,CAAC,EAChC,MAAM,EACN,MAAM,EACN,OAAO,EACP,OAAO,EACP,SAAS,EACT,aAAa,EACb,QAAQ,GACT,EAAE;IACD,sCAAsC;IACtC,MAAM,EAAE,MAAM,GAAG,SAAS,CAAA;IAC1B,6CAA6C;IAC7C,MAAM,EAAE,SAAS,MAAM,EAAE,GAAG,SAAS,CAAA;IACrC,OAAO,EAAE,MAAM,CAAA;IACf,OAAO,EAAE,OAAO,CAAA;IAChB,uDAAuD;IACvD,SAAS,EAAE,MAAM,KAAK,GAAG,KAAK,CAAA;IAC9B,8CAA8C;IAC9C,aAAa,CAAC,EAAE,gBAAgB,CAAA;IAChC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B,GAAG,KAAK,CAAC,SAAS,CA0DlB"}

package/lib/types/components/EffortInputBorder.js

@@ -23,12 +23,29 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useContext, useEffect, useReducer, useState } from 'react';
 import { Box, Text } from '../ui.js';
 import { ClockContext } from '../ink/components/ClockContext.js';
+import { stringWidth } from '../ink/stringWidth.js';
 import { IGNITION_TIMELINE, ignitionLineColors } from '../trajectory/effortIgnition.js';
-/** 边框行（顶/底共用同一色段序列——同步变色）。 */
-function BorderRow({ left, right, runs, idleColor, }) {
-    return (_jsx(Box, { width: "100%", height: 1, flexShrink: 0, overflow: "hidden", children: _jsxs(Text, { wrap: "truncate-end", children: [_jsx(Text, { color: idleColor, children: left }), runs.map((run, i) => (_jsx(Text, { color: run.color, children: run.glyph }, i))), _jsx(Text, { color: idleColor, children: right })] }) }));
+/** 边框行（顶/底共用同一色段序列——同步变色）。顶行可在右圆角前插入
+ *  一个静态标签 chip（会话名），占用的列数从色段序列里扣掉，行宽不变。 */
+function BorderRow({ left, right, runs, idleColor, label, }) {
+    const labelWidth = label === undefined ? 0 : stringWidth(` ${label.text} `);
+    // chip 与右圆角之间的留白（边框线格数）：视觉上不让标签贴死 ╮。
+    const labelGap = label === undefined ? 0 : 2;
+    // 裁剪色段序列到剩余列数（label 行与底行的列数一致，总宽不变）。
+    // 色段保留左侧部分，右侧让位给 chip + 留白（右上角布局）。
+    let budget = Math.max(0, runs.reduce((sum, run) => sum + run.glyph.length, 0) - labelWidth - labelGap);
+    const clipped = [];
+    for (const run of runs) {
+        if (budget <= 0)
+            break;
+        const take = Math.min(run.glyph.length, budget);
+        if (take > 0)
+            clipped.push({ glyph: run.glyph.slice(0, take), color: run.color });
+        budget -= take;
+    }
+    return (_jsx(Box, { width: "100%", height: 1, flexShrink: 0, overflow: "hidden", children: _jsxs(Text, { wrap: "truncate-end", children: [_jsx(Text, { color: idleColor, children: left }), clipped.map((run, i) => (_jsx(Text, { color: run.color, children: run.glyph }, i))), label !== undefined && (_jsx(Text, { backgroundColor: label.color, color: label.ink, children: ` ${label.text} ` })), label !== undefined && _jsx(Text, { color: idleColor, children: '─'.repeat(labelGap) }), _jsx(Text, { color: idleColor, children: right })] }) }));
 }
-export function EffortInputBorder({ effort, levels, columns, onLight, idleColor, children, }) {
+export function EffortInputBorder({ effort, levels, columns, onLight, idleColor, topRightLabel, children, }) {
     const clock = useContext(ClockContext);
     const [overlay, setOverlay] = useState(null);
     const [prevEffort, setPrevEffort] = useState(effort);
@@ -69,5 +86,5 @@ export function EffortInputBorder({ effort, levels, columns, onLight, idleColor,
         else
             runs.push({ glyph: '─', color });
     }
-    return (_jsxs(Box, { flexDirection: "column", alignItems: "flex-start", justifyContent: "flex-start", width: "100%", flexShrink: 0, children: [_jsx(BorderRow, { left: "\u256D", right: "\u256E", runs: runs, idleColor: idleColor }), _jsx(Box, { flexShrink: 0, children: children }), _jsx(BorderRow, { left: "\u2570", right: "\u256F", runs: runs, idleColor: idleColor })] }));
+    return (_jsxs(Box, { flexDirection: "column", alignItems: "flex-start", justifyContent: "flex-start", width: "100%", flexShrink: 0, children: [_jsx(BorderRow, { left: "\u256D", right: "\u256E", runs: runs, idleColor: idleColor, label: topRightLabel }), _jsx(Box, { flexShrink: 0, children: children }), _jsx(BorderRow, { left: "\u2570", right: "\u256F", runs: runs, idleColor: idleColor })] }));
 }

package/lib/types/components/EffortSlider.d.ts

@@ -7,9 +7,12 @@ import type { EffortOption } from '../dsh-adapter/channel.js';
  * or Esc just closes it). The current level carries `✓`; the focused level's
  * description renders below the row.
  */
-export declare function EffortSlider({ options, focusIndex, currentId, }: {
+export declare function EffortSlider({ options, focusIndex, currentId, onPick, }: {
     options: readonly EffortOption[];
     focusIndex: number;
     currentId: string | undefined;
+    /** Mouse pick (fullscreen): click a tier = move there and live-apply —
+     *  the same semantics as the ←/→ keys (the slider IS the control). */
+    onPick?: (index: number) => void;
 }): React.ReactNode;
 //# sourceMappingURL=EffortSlider.d.ts.map

package/lib/types/components/EffortSlider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EffortSlider.d.ts","sourceRoot":"","sources":["../../../src/components/EffortSlider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAA;AAE7D;;;;;;GAMG;AACH,wBAAgB,YAAY,CAAC,EAC3B,OAAO,EACP,UAAU,EACV,SAAS,GACV,EAAE;IACD,OAAO,EAAE,SAAS,YAAY,EAAE,CAAA;IAChC,UAAU,EAAE,MAAM,CAAA;IAClB,SAAS,EAAE,MAAM,GAAG,SAAS,CAAA;CAC9B,GAAG,KAAK,CAAC,SAAS,CAmClB"}
+{"version":3,"file":"EffortSlider.d.ts","sourceRoot":"","sources":["../../../src/components/EffortSlider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAA;AAE7D;;;;;;GAMG;AACH,wBAAgB,YAAY,CAAC,EAC3B,OAAO,EACP,UAAU,EACV,SAAS,EACT,MAAM,GACP,EAAE;IACD,OAAO,EAAE,SAAS,YAAY,EAAE,CAAA;IAChC,UAAU,EAAE,MAAM,CAAA;IAClB,SAAS,EAAE,MAAM,GAAG,SAAS,CAAA;IAC7B;0EACsE;IACtE,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;CACjC,GAAG,KAAK,CAAC,SAAS,CA4ClB"}

package/lib/types/components/EffortSlider.js

@@ -11,7 +11,9 @@ import { HintLine } from './design-system/HintLine.js';
  * or Esc just closes it). The current level carries `✓`; the focused level's
  * description renders below the row.
  */
-export function EffortSlider({ options, focusIndex, currentId, }) {
+export function EffortSlider({ options, focusIndex, currentId, onPick, }) {
     const focused = options[focusIndex];
-    return (_jsx(Pane, { color: "permission", children: _jsxs(Box, { flexDirection: "column", children: [_jsx(Box, { marginBottom: 1, children: _jsx(Text, { color: "remember", bold: true, children: t('picker-title-effort') }) }), _jsx(Box, { flexDirection: "row", children: options.map((option, index) => (_jsxs(React.Fragment, { children: [index > 0 ? (_jsx(Text, { dimColor: true, children: " \u2500\u2500 " })) : null, _jsx(Text, { inverse: index === focusIndex, bold: index === focusIndex, children: option.name }), option.id === currentId ? _jsx(Text, { color: "remember", children: "\u2713" }) : null] }, option.id))) }), focused?.description !== undefined ? (_jsx(Text, { dimColor: true, children: focused.description })) : null, _jsx(Text, { dimColor: true, italic: true, children: _jsx(HintLine, { text: t('hint-adjust-done') }) })] }) }));
+    return (_jsx(Pane, { color: "permission", children: _jsxs(Box, { flexDirection: "column", children: [_jsx(Box, { marginBottom: 1, children: _jsx(Text, { color: "remember", bold: true, children: t('picker-title-effort') }) }), _jsx(Box, { flexDirection: "row", children: options.map((option, index) => (_jsxs(React.Fragment, { children: [index > 0 ? (_jsx(Text, { dimColor: true, children: " \u2500\u2500 " })) : null, _jsx(Box, { onClick: onPick ? () => onPick(index) : undefined, backgroundColor: onPick !== undefined && index !== focusIndex
+                                    ? 'userMessageBackgroundHover'
+                                    : undefined, children: _jsx(Text, { inverse: index === focusIndex, bold: index === focusIndex, children: option.name }) }), option.id === currentId ? _jsx(Text, { color: "remember", children: "\u2713" }) : null] }, option.id))) }), focused?.description !== undefined ? (_jsx(Text, { dimColor: true, children: focused.description })) : null, _jsx(Text, { dimColor: true, italic: true, children: _jsx(HintLine, { text: t('hint-adjust-done') }) })] }) }));
 }

package/lib/types/components/ExtensionDialog.js

@@ -87,7 +87,9 @@ function SelectDialog({ dialog, onDecide, onCancel, }) {
     const { start, end } = listWindow(dialog.options.map(option => (option.description === undefined ? 1 : 2)), focusIndex, Math.max(terminalRows - 10, 2));
     return (_jsxs(Pane, { color: "permission", children: [_jsxs(Box, { flexDirection: "column", children: [_jsx(Box, { marginBottom: 1, children: _jsx(Text, { color: "remember", bold: true, children: dialog.title }) }), dialog.options.slice(start, end).map((option, index) => {
                         const absoluteIndex = start + index;
-                        return (_jsx(ListItem, { isFocused: absoluteIndex === focusIndex, description: option.description, showScrollUp: absoluteIndex === start && start > 0, showScrollDown: absoluteIndex === end - 1 && end < dialog.options.length, children: option.label }, option.id));
+                        return (_jsx(ListItem, { isFocused: absoluteIndex === focusIndex, description: option.description, showScrollUp: absoluteIndex === start && start > 0, showScrollDown: absoluteIndex === end - 1 && end < dialog.options.length, 
+                            // Click = decide this option (same as Enter on it).
+                            onClick: () => onDecide(option.id), children: option.label }, option.id));
                     })] }), _jsx(Text, { dimColor: true, italic: true, children: _jsx(HintLine, { text: t('hint-select-exit') }) })] }));
 }
 function ConfirmDialog({ dialog, onDecide, onCancel, }) {
@@ -123,7 +125,9 @@ function ConfirmDialog({ dialog, onDecide, onCancel, }) {
             onDecide(focusRef.current === 0);
         }
     }, { isActive: true });
-    return (_jsxs(Pane, { color: "permission", children: [_jsxs(Box, { flexDirection: "column", children: [_jsxs(Box, { marginBottom: 1, children: [_jsx(Text, { color: "remember", bold: true, children: dialog.title }), dialog.message !== undefined && _jsx(Text, { dimColor: true, children: dialog.message })] }), labels.map((label, index) => (_jsx(ListItem, { isFocused: index === focusIndex, children: label }, label)))] }), _jsx(Text, { dimColor: true, italic: true, children: _jsx(HintLine, { text: t('hint-select-exit') }) })] }));
+    return (_jsxs(Pane, { color: "permission", children: [_jsxs(Box, { flexDirection: "column", children: [_jsxs(Box, { marginBottom: 1, children: [_jsx(Text, { color: "remember", bold: true, children: dialog.title }), dialog.message !== undefined && _jsx(Text, { dimColor: true, children: dialog.message })] }), labels.map((label, index) => (_jsx(ListItem, { isFocused: index === focusIndex, 
+                        // Click = decide this row (same as Enter on it).
+                        onClick: () => onDecide(index === 0), children: label }, label)))] }), _jsx(Text, { dimColor: true, italic: true, children: _jsx(HintLine, { text: t('hint-select-exit') }) })] }));
 }
 function InputDialog({ dialog, onDecide, onCancel, }) {
     const [value, setValue] = React.useState(dialog.initial);

package/lib/types/components/FileActionsPanel.d.ts

@@ -0,0 +1,22 @@
+import React from 'react';
+/**
+ * Click-to-act file menu (fullscreen): opened by clicking a file path in
+ * the transcript (tool cards, markdown code spans / plain text, file://
+ * links). Rows: open the target, reveal it in the file manager, copy its
+ * absolute path. The path shown is already resolved to an absolute path by
+ * the caller (Chat.tsx resolves against the channel cwd at click time).
+ * When the target is a directory, the first row reads "open folder" — the
+ * same action (default handler), just honest about what it opens.
+ */
+export declare const FILE_ACTION_COUNT = 3;
+export declare function FileActionsPanel({ path, isDir, focusIndex, onPick, }: {
+    /** Absolute path the actions operate on (caller-resolved). */
+    path: string;
+    /** Whether the target exists on disk and is a directory. */
+    isDir: boolean;
+    /** Index of the keyboard-focused row. */
+    focusIndex: number;
+    /** Mouse pick (fullscreen): clicked row's absolute index. */
+    onPick?: (index: number) => void;
+}): React.ReactNode;
+//# sourceMappingURL=FileActionsPanel.d.ts.map

package/lib/types/components/FileActionsPanel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileActionsPanel.d.ts","sourceRoot":"","sources":["../../../src/components/FileActionsPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAQzB;;;;;;;;GAQG;AACH,eAAO,MAAM,iBAAiB,IAAI,CAAA;AAKlC,wBAAgB,gBAAgB,CAAC,EAC/B,IAAI,EACJ,KAAK,EACL,UAAU,EACV,MAAM,GACP,EAAE;IACD,8DAA8D;IAC9D,IAAI,EAAE,MAAM,CAAA;IACZ,4DAA4D;IAC5D,KAAK,EAAE,OAAO,CAAA;IACd,yCAAyC;IACzC,UAAU,EAAE,MAAM,CAAA;IAClB,6DAA6D;IAC7D,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;CACjC,GAAG,KAAK,CAAC,SAAS,CAiClB"}

package/lib/types/components/FileActionsPanel.js

@@ -0,0 +1,28 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import { t } from '../i18n.js';
+import { Box, Text } from '../ui.js';
+import { Pane } from './design-system/Pane.js';
+import { Select } from './Select.js';
+import { HintLine } from './design-system/HintLine.js';
+import { truncateToWidth } from '../ink/truncateToWidth.js';
+/**
+ * Click-to-act file menu (fullscreen): opened by clicking a file path in
+ * the transcript (tool cards, markdown code spans / plain text, file://
+ * links). Rows: open the target, reveal it in the file manager, copy its
+ * absolute path. The path shown is already resolved to an absolute path by
+ * the caller (Chat.tsx resolves against the channel cwd at click time).
+ * When the target is a directory, the first row reads "open folder" — the
+ * same action (default handler), just honest about what it opens.
+ */
+export const FILE_ACTION_COUNT = 3;
+/** How many terminal cells of the path fit next to the title. */
+const PATH_DISPLAY_BUDGET = 48;
+export function FileActionsPanel({ path, isDir, focusIndex, onPick, }) {
+    const options = React.useMemo(() => [
+        { value: 'open', label: t(isDir ? 'file-actions-open-dir' : 'file-actions-open') },
+        { value: 'reveal', label: t('file-actions-reveal') },
+        { value: 'copy', label: t('file-actions-copy') },
+    ], [isDir]);
+    return (_jsx(Pane, { color: "permission", children: _jsxs(Box, { flexDirection: "column", children: [_jsxs(Box, { flexDirection: "row", marginBottom: 1, children: [_jsx(Text, { color: "remember", bold: true, children: t('file-actions-title') }), _jsxs(Text, { dimColor: true, wrap: "truncate-end", children: [' ', truncateToWidth(path, PATH_DISPLAY_BUDGET)] })] }), _jsx(Select, { options: options, focusIndex: focusIndex, selectedValue: undefined, visibleOptionCount: FILE_ACTION_COUNT, onPick: onPick ? index => onPick(index) : undefined }), _jsx(Text, { dimColor: true, italic: true, children: _jsx(HintLine, { text: t('hint-confirm-exit') }) })] }) }));
+}

package/lib/types/components/FileSuggestions.d.ts

@@ -1,16 +1,35 @@
 import React from 'react';
+import type { Color } from '../ink/styles.js';
+import type { Theme } from '../theme.js';
 import type { FileCandidate } from '../utils/fileSuggestions.js';
 /**
- * The `@` file-completion overlay in CC's suggestion style: full relative
- * path (directory suffix stripped) + a `file`/`directory` description. The
- * selected row renders in the theme's `suggestion` color, others dim. The
- * name column is padded to a fixed display width so the description column
- * keeps its contract at narrow terminals (pinned by verify-cjk-truncate.tsx);
- * every pad/truncate uses display width, so CJK names never split a glyph.
+ * The `@` file-completion overlay in CC's suggestion style, wrapped in the
+ * shared rounded `SuggestionCard` (与 `/` 命令菜单同一视觉语言):
+ *
+ *   ╭─ 文件 · 共 12 项 ──────────────────────╮
+ *   │ ❯ ▸ src/components/     directory     │
+ *   │   + README.md           file          │
+ *   ╰─────────────────────────────────────────╯
+ *
+ * Full relative path (directory suffix stripped) + a `file`/`directory`
+ * description; the selected row renders `❯` + bold in the theme's
+ * `suggestion` color, others dim with the query-matched prefix of the name
+ * highlighted (non-dim). The name column is padded to a fixed display width
+ * so the description column keeps its contract at narrow terminals (pinned
+ * by verify-cjk-truncate.tsx); every pad/truncate uses display width, so CJK
+ * names never split a glyph.
  */
-export declare function FileSuggestions({ files, selectedIndex, columns, }: {
+export declare function FileSuggestions({ files, selectedIndex, columns, query, accent, onPick, onWheelStep, }: {
     files: readonly FileCandidate[];
     selectedIndex: number;
     columns: number;
+    /** `@` 触发 token 里已输入的查询（`mention.query`），用于名字前缀高亮。 */
+    query?: string;
+    accent?: keyof Theme | Color;
+    /** 鼠标点击行（fullscreen）：上报过滤后列表的绝对索引（与键盘
+     *  selectedIndex 同一索引空间），接受路径由 PromptInput 复用。 */
+    onPick?: (index: number) => void;
+    /** 滚轮步进（fullscreen）：±1 移动选中行。 */
+    onWheelStep?: (step: 1 | -1) => void;
 }): React.ReactNode;
 //# sourceMappingURL=FileSuggestions.d.ts.map