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

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

@@ -0,0 +1,25 @@
+import React from 'react';
+/**
+ * `/recap` panel (pi-recap semantics), in the picker/dialog visual
+ * language: a permission-colored Pane with a title bar (会话回顾), a
+ * scrollable summary body (error / summary / answering spinner), the
+ * proposed session title row (apply via `a` or clicking the chip), and a
+ * dim italic hint line (click to copy, same as `c`). Owns the keyboard
+ * while open, mirroring BtwPanel.
+ */
+export declare function RecapPanel({ summary, title, error, streaming, titleApplied, onClose, onCopy, onApplyTitle, }: {
+    /** The one-line recap summary (streamed raw, then replaced on settle). */
+    summary: string;
+    /** Proposed session title from the recap call, when the model offered one. */
+    title?: string;
+    /** Human-readable failure reason. */
+    error?: string;
+    /** True while the recap call is in flight. */
+    streaming: boolean;
+    /** True once the proposed title was applied via renameSession. */
+    titleApplied: boolean;
+    onClose: () => void;
+    onCopy: () => void;
+    onApplyTitle: () => void;
+}): React.ReactNode;
+//# sourceMappingURL=RecapPanel.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"RecapPanel.d.ts","sourceRoot":"","sources":["../../../src/components/RecapPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAOzB;;;;;;;GAOG;AACH,wBAAgB,UAAU,CAAC,EACzB,OAAO,EACP,KAAK,EACL,KAAK,EACL,SAAS,EACT,YAAY,EACZ,OAAO,EACP,MAAM,EACN,YAAY,GACb,EAAE;IACD,0EAA0E;IAC1E,OAAO,EAAE,MAAM,CAAA;IACf,8EAA8E;IAC9E,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,qCAAqC;IACrC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,8CAA8C;IAC9C,SAAS,EAAE,OAAO,CAAA;IAClB,kEAAkE;IAClE,YAAY,EAAE,OAAO,CAAA;IACrB,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,YAAY,EAAE,MAAM,IAAI,CAAA;CACzB,GAAG,KAAK,CAAC,SAAS,CAuFlB"}

package/lib/types/components/RecapPanel.js

@@ -0,0 +1,55 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import { Box, Text, useInput, ScrollBox, useTerminalSize } from '../ui.js';
+import { SpinnerGlyph } from './Spinner/SpinnerGlyph.js';
+import { Pane } from './design-system/Pane.js';
+import { t } from '../i18n.js';
+import { isPlainReturnInput } from '../utils/modifiers.js';
+/**
+ * `/recap` panel (pi-recap semantics), in the picker/dialog visual
+ * language: a permission-colored Pane with a title bar (会话回顾), a
+ * scrollable summary body (error / summary / answering spinner), the
+ * proposed session title row (apply via `a` or clicking the chip), and a
+ * dim italic hint line (click to copy, same as `c`). Owns the keyboard
+ * while open, mirroring BtwPanel.
+ */
+export function RecapPanel({ summary, title, error, streaming, titleApplied, onClose, onCopy, onApplyTitle, }) {
+    const scrollRef = React.useRef(null);
+    const { rows } = useTerminalSize();
+    // Spinner frame (80ms cadence, only while waiting for the first text).
+    const [frame, setFrame] = React.useState(0);
+    React.useEffect(() => {
+        if (!streaming || summary !== '')
+            return;
+        const interval = setInterval(() => setFrame(f => f + 1), 80);
+        return () => clearInterval(interval);
+    }, [streaming, summary]);
+    const canApply = title !== undefined && title !== '' && !titleApplied;
+    useInput((input, key, event) => {
+        if (key.escape || isPlainReturnInput(input, key) || input === ' ') {
+            event.stopImmediatePropagation();
+            onClose();
+            return;
+        }
+        if (key.upArrow || key.downArrow) {
+            scrollRef.current?.scrollBy(key.upArrow ? -3 : 3);
+            event.stopImmediatePropagation();
+            return;
+        }
+        if (input === 'c' && !key.ctrl) {
+            event.stopImmediatePropagation();
+            onCopy();
+            return;
+        }
+        if (input === 'a' && !key.ctrl && canApply) {
+            event.stopImmediatePropagation();
+            onApplyTitle();
+            return;
+        }
+        // The overlay owns the keyboard while open: swallow everything else so
+        // nothing leaks into the prompt input behind it.
+        event.stopImmediatePropagation();
+    });
+    const settled = summary !== '' || error !== undefined;
+    return (_jsx(Pane, { color: "permission", children: _jsxs(Box, { flexDirection: "column", children: [_jsxs(Box, { marginBottom: 1, children: [_jsx(Text, { color: "remember", bold: true, children: t('recap-panel-title') }), _jsxs(Text, { dimColor: true, children: [" \u00B7 ", t('recap-panel-subtitle')] })] }), _jsx(Box, { flexDirection: "column", maxHeight: Math.max(5, rows - 11), children: _jsx(ScrollBox, { ref: scrollRef, flexDirection: "column", flexGrow: 1, children: error !== undefined ? (_jsx(Text, { color: "error", children: error })) : summary !== '' ? (_jsx(Text, { children: summary })) : (_jsxs(Box, { children: [_jsx(SpinnerGlyph, { frame: frame, messageColor: "warning" }), _jsxs(Text, { color: "warning", children: [" ", t('recap-answering')] })] })) }) }), title !== undefined && (_jsxs(Box, { flexDirection: "row", marginTop: 1, children: [_jsxs(Text, { dimColor: true, children: [t('recap-title-label'), ": "] }), _jsx(Text, { color: "suggestion", children: title }), titleApplied ? (_jsxs(Text, { color: "success", children: [" \u2713 ", t('recap-title-applied')] })) : (_jsx(Box, { onClick: canApply ? onApplyTitle : undefined, children: _jsxs(Text, { color: "success", bold: true, children: [' ', "[", t('recap-apply-title'), "]"] }) }))] })), _jsx(Box, { onClick: settled ? onCopy : undefined, children: _jsx(Text, { dimColor: true, italic: true, children: t('recap-hint', { apply: canApply ? ' · a ' + t('recap-apply-title') : '' }) }) })] }) }));
+}

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

@@ -12,7 +12,7 @@ import type { TuiRewindMode } from '../dsh-adapter/extension-events.js';
  * a choice list whose option zero is always the built-in conversation-only
  * rewind, followed by the plugin's modes (e.g. "also restore files").
  */
-export declare function RewindPicker({ rows, focusIndex, confirmRow, modes, modeIndex, busy, }: {
+export declare function RewindPicker({ rows, focusIndex, confirmRow, modes, modeIndex, busy, onPickRow, onConfirm, onPickMode, }: {
     rows: readonly ChatRow[];
     focusIndex: number;
     confirmRow: ChatRow | null;
@@ -22,5 +22,16 @@ export declare function RewindPicker({ rows, focusIndex, confirmRow, modes, mode
     modeIndex?: number;
     /** True while the plugin decision is in flight. */
     busy?: boolean;
+    /**
+     * Mouse pick on a list row (fullscreen): sets focus only — rewind is a
+     * high-risk invisible-confirm operation, so stepping into the confirm
+     * state stays an explicit keyboard Enter.
+     */
+    onPickRow?: (index: number) => void;
+    /** Mouse click on the plain confirm row: executes the rewind directly —
+     *  the confirm pane itself is the explicit confirmation layer. */
+    onConfirm?: () => void;
+    /** Mouse pick on a modes-list option: executes that mode directly. */
+    onPickMode?: (index: number) => void;
 }): React.ReactNode;
 //# sourceMappingURL=RewindPicker.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"RewindPicker.d.ts","sourceRoot":"","sources":["../../../src/components/RewindPicker.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,2BAA2B,CAAA;AACxD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,oCAAoC,CAAA;AAMvE;;;;;;;;;;GAUG;AACH,wBAAgB,YAAY,CAAC,EAC3B,IAAI,EACJ,UAAU,EACV,UAAU,EACV,KAAY,EACZ,SAAa,EACb,IAAY,GACb,EAAE;IACD,IAAI,EAAE,SAAS,OAAO,EAAE,CAAA;IACxB,UAAU,EAAE,MAAM,CAAA;IAClB,UAAU,EAAE,OAAO,GAAG,IAAI,CAAA;IAC1B,6EAA6E;IAC7E,KAAK,CAAC,EAAE,SAAS,aAAa,EAAE,GAAG,IAAI,CAAA;IACvC,gEAAgE;IAChE,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,mDAAmD;IACnD,IAAI,CAAC,EAAE,OAAO,CAAA;CACf,GAAG,KAAK,CAAC,SAAS,CA4GlB"}
+{"version":3,"file":"RewindPicker.d.ts","sourceRoot":"","sources":["../../../src/components/RewindPicker.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,2BAA2B,CAAA;AACxD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,oCAAoC,CAAA;AAMvE;;;;;;;;;;GAUG;AACH,wBAAgB,YAAY,CAAC,EAC3B,IAAI,EACJ,UAAU,EACV,UAAU,EACV,KAAY,EACZ,SAAa,EACb,IAAY,EACZ,SAAS,EACT,SAAS,EACT,UAAU,GACX,EAAE;IACD,IAAI,EAAE,SAAS,OAAO,EAAE,CAAA;IACxB,UAAU,EAAE,MAAM,CAAA;IAClB,UAAU,EAAE,OAAO,GAAG,IAAI,CAAA;IAC1B,6EAA6E;IAC7E,KAAK,CAAC,EAAE,SAAS,aAAa,EAAE,GAAG,IAAI,CAAA;IACvC,gEAAgE;IAChE,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,mDAAmD;IACnD,IAAI,CAAC,EAAE,OAAO,CAAA;IACd;;;;OAIG;IACH,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACnC;sEACkE;IAClE,SAAS,CAAC,EAAE,MAAM,IAAI,CAAA;IACtB,sEAAsE;IACtE,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;CACrC,GAAG,KAAK,CAAC,SAAS,CAkHlB"}

package/lib/types/components/RewindPicker.js

@@ -16,7 +16,7 @@ import { listWindow } from './listWindow.js';
  * a choice list whose option zero is always the built-in conversation-only
  * rewind, followed by the plugin's modes (e.g. "also restore files").
  */
-export function RewindPicker({ rows, focusIndex, confirmRow, modes = null, modeIndex = 0, busy = false, }) {
+export function RewindPicker({ rows, focusIndex, confirmRow, modes = null, modeIndex = 0, busy = false, onPickRow, onConfirm, onPickMode, }) {
     if (confirmRow !== null) {
         if (modes !== null) {
             // Plugin modes: a described choice list (one extra row per
@@ -34,10 +34,10 @@ export function RewindPicker({ rows, focusIndex, confirmRow, modes = null, modeI
             ];
             return (_jsxs(Pane, { color: "permission", children: [_jsxs(Box, { flexDirection: "column", children: [_jsxs(Box, { marginBottom: 1, children: [_jsx(Text, { color: "remember", bold: true, children: t('rewind-confirm-title') }), _jsx(Text, { dimColor: true, children: preview(confirmRow.text) })] }), options.slice(start, end).map((option, index) => {
                                 const absoluteIndex = start + index;
-                                return (_jsx(ListItem, { isFocused: absoluteIndex === modeIndex, description: option.description, showScrollUp: absoluteIndex === start && start > 0, showScrollDown: absoluteIndex === end - 1 && end < options.length, children: option.label }, option.key));
+                                return (_jsx(ListItem, { isFocused: absoluteIndex === modeIndex, description: option.description, showScrollUp: absoluteIndex === start && start > 0, showScrollDown: absoluteIndex === end - 1 && end < options.length, onClick: onPickMode === undefined ? undefined : () => onPickMode(absoluteIndex), children: option.label }, option.key));
                             })] }), _jsx(Text, { dimColor: true, italic: true, children: _jsx(HintLine, { text: t('hint-select-exit') }) })] }));
         }
-        return (_jsx(Pane, { color: "permission", children: _jsxs(Box, { flexDirection: "column", children: [_jsx(Box, { marginBottom: 1, children: _jsx(Text, { color: "remember", bold: true, children: t('rewind-confirm-title') }) }), _jsx(ListItem, { isFocused: false, description: t('rewind-confirm-desc'), children: preview(confirmRow.text) }), _jsx(Text, { dimColor: true, italic: true, children: _jsx(HintLine, { text: t('hint-rewind-back') }) })] }) }));
+        return (_jsx(Pane, { color: "permission", children: _jsxs(Box, { flexDirection: "column", children: [_jsx(Box, { marginBottom: 1, children: _jsx(Text, { color: "remember", bold: true, children: t('rewind-confirm-title') }) }), _jsx(ListItem, { isFocused: false, description: t('rewind-confirm-desc'), onClick: onConfirm, children: preview(confirmRow.text) }), _jsx(Text, { dimColor: true, italic: true, children: _jsx(HintLine, { text: t('hint-rewind-back') }) })] }) }));
     }
     const { rows: terminalRows } = useTerminalSize();
     // 焦点窗口化按行预算：首项带 'last message' 描述占 2 行、其余 1 行
@@ -46,7 +46,9 @@ export function RewindPicker({ rows, focusIndex, confirmRow, modes = null, modeI
     const { start, end } = listWindow(rows.map((_, i) => (i === 0 ? 2 : 1)), focusIndex, Math.max(terminalRows - 14, 2));
     return (_jsxs(Pane, { color: "permission", children: [_jsxs(Box, { flexDirection: "column", children: [_jsxs(Box, { marginBottom: 1, children: [_jsx(Text, { color: "remember", bold: true, children: t('rewind-title') }), _jsx(Text, { dimColor: true, children: t('rewind-subtitle') })] }), rows.length === 0 ? (_jsx(ListItem, { isFocused: false, children: t('rewind-empty') })) : (rows.slice(start, end).map((row, index) => {
                         const absoluteIndex = start + index;
-                        return (_jsx(ListItem, { isFocused: absoluteIndex === focusIndex, description: absoluteIndex === 0 ? t('rewind-last-message') : undefined, showScrollUp: absoluteIndex === start && start > 0, showScrollDown: absoluteIndex === end - 1 && end < rows.length, children: preview(row.text) }, row.id));
+                        return (_jsx(ListItem, { isFocused: absoluteIndex === focusIndex, description: absoluteIndex === 0 ? t('rewind-last-message') : undefined, showScrollUp: absoluteIndex === start && start > 0, showScrollDown: absoluteIndex === end - 1 && end < rows.length, onClick: onPickRow !== undefined && !busy
+                                ? () => onPickRow(absoluteIndex)
+                                : undefined, children: preview(row.text) }, row.id));
                     })), busy && _jsx(Text, { dimColor: true, children: t('rewind-waiting-plugins') })] }), _jsx(Text, { dimColor: true, italic: true, children: _jsx(HintLine, { text: t('hint-select-exit') }) })] }));
 }
 /** One-line preview of a message (newlines flattened, capped). */

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

@@ -0,0 +1,28 @@
+import React from 'react';
+import { type ScrollBoxHandle } from '../ui.js';
+/**
+ * Proportional scrollbar for the fullscreen transcript's gutter — the
+ * `scrollbar` option of the `dsh-tui.scrollGutter` setting (the timeline
+ * rail's sibling; same 2-column slot, same chrome rules):
+ *
+ *  - the thumb (██) shows the visible window's position AND size over the
+ *    whole content (viewport²/content tall, positioned by scrollTop);
+ *  - clicking the track scrolls the clicked position to the viewport top
+ *    (classic scrollbar semantics — the thumb centers under the click
+ *    through the follow-up renders);
+ *  - the gutter is permanent while scrollable (Qwen's rule: an
+ *    auto-hiding gutter that changes content width rewraps everything);
+ *    hidden below 60 terminal columns or when the content fits (inline
+ *    mode keeps the terminal's native scrollback);
+ *  - NoSelect fences the glyphs out of click-drag text selection; the
+ *    wheel over the gutter scrolls the transcript.
+ *
+ * Thumb dragging is intentionally NOT implemented (Grok's MVP rule): a
+ * proportional thumb encodes position, and the tick rail remains the
+ * semantic navigator. Click-to-position covers the same need.
+ */
+export declare function ScrollbarGutter({ handle, terminalWidth, }: {
+    handle: ScrollBoxHandle | null;
+    terminalWidth: number;
+}): React.ReactNode;
+//# sourceMappingURL=ScrollbarGutter.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ScrollbarGutter.d.ts","sourceRoot":"","sources":["../../../src/components/ScrollbarGutter.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAuB,KAAK,eAAe,EAAE,MAAM,UAAU,CAAA;AAUpE;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,wBAAgB,eAAe,CAAC,EAC9B,MAAM,EACN,aAAa,GACd,EAAE;IACD,MAAM,EAAE,eAAe,GAAG,IAAI,CAAA;IAC9B,aAAa,EAAE,MAAM,CAAA;CACtB,GAAG,KAAK,CAAC,SAAS,CAoIlB"}

package/lib/types/components/ScrollbarGutter.js

@@ -0,0 +1,119 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import { Box, Text, NoSelect } from '../ui.js';
+import { RAIL_MIN_TERMINAL_WIDTH, RAIL_WIDTH } from '../ink/timeline-rail.js';
+/** Thumb glyph across the 2-col gutter: solid, clearly positional —
+ *  deliberately distinct from the timeline's ━━ active tick. */
+const THUMB = '██';
+/** Rest time before the hover position chip pops (anti-flash sweep gate). */
+const CHIP_DWELL_MS = 250;
+/**
+ * Proportional scrollbar for the fullscreen transcript's gutter — the
+ * `scrollbar` option of the `dsh-tui.scrollGutter` setting (the timeline
+ * rail's sibling; same 2-column slot, same chrome rules):
+ *
+ *  - the thumb (██) shows the visible window's position AND size over the
+ *    whole content (viewport²/content tall, positioned by scrollTop);
+ *  - clicking the track scrolls the clicked position to the viewport top
+ *    (classic scrollbar semantics — the thumb centers under the click
+ *    through the follow-up renders);
+ *  - the gutter is permanent while scrollable (Qwen's rule: an
+ *    auto-hiding gutter that changes content width rewraps everything);
+ *    hidden below 60 terminal columns or when the content fits (inline
+ *    mode keeps the terminal's native scrollback);
+ *  - NoSelect fences the glyphs out of click-drag text selection; the
+ *    wheel over the gutter scrolls the transcript.
+ *
+ * Thumb dragging is intentionally NOT implemented (Grok's MVP rule): a
+ * proportional thumb encodes position, and the tick rail remains the
+ * semantic navigator. Click-to-position covers the same need.
+ */
+export function ScrollbarGutter({ handle, terminalWidth, }) {
+    const [, setTick] = React.useState(0);
+    // Hover readout: the row under the pointer brightens the thumb when it is
+    // the hovered one, and floats a `62% · 340/540` chip left of the gutter
+    // naming the position a click there would jump to. The chip is
+    // dwell-gated (TimelineRail's preview-card rule): a sweep across the
+    // track brightens rows but never pops chips — only ~250ms of rest does.
+    // Once shown it follows row changes immediately; leaving hides it.
+    const [hoverRow, setHoverRow] = React.useState(null);
+    const [chipRow, setChipRow] = React.useState(null);
+    const dwellTimer = React.useRef(null);
+    const clearDwell = () => {
+        if (dwellTimer.current !== null) {
+            clearTimeout(dwellTimer.current);
+            dwellTimer.current = null;
+        }
+    };
+    const clearChip = () => {
+        clearDwell();
+        setChipRow(null);
+    };
+    React.useEffect(() => clearDwell, []);
+    React.useEffect(() => {
+        if (!handle)
+            return;
+        return handle.subscribe(() => setTick(t => t + 1));
+    }, [handle]);
+    if (!handle)
+        return null;
+    const viewport = handle.getViewportHeight();
+    const content = handle.getScrollHeight();
+    const maxScroll = Math.max(0, content - viewport);
+    if (viewport < 2 || content <= viewport || terminalWidth < RAIL_MIN_TERMINAL_WIDTH)
+        return null;
+    // Thumb: the visible window mapped onto the gutter. Height proportional
+    // to the visible fraction (≥2 rows so it is always grabbable-looking);
+    // top follows scrollTop over the scroll range.
+    const thumbH = Math.max(2, Math.round((viewport * viewport) / content));
+    const trackH = Math.max(1, viewport - thumbH);
+    const thumbTop = Math.round((handle.getScrollTop() / Math.max(1, maxScroll)) * trackH);
+    const thumbBottom = Math.min(viewport, thumbTop + thumbH);
+    // Clicking the track maps the clicked row's position on the track back
+    // to a scrollTop and scrolls that content position to the viewport top.
+    const trackScrollTop = (y) => {
+        if (y <= 0)
+            return 0;
+        if (y >= trackH)
+            return maxScroll;
+        return Math.round((y / trackH) * maxScroll);
+    };
+    const rows = [];
+    for (let y = 0; y < viewport; y++) {
+        const inThumb = y >= thumbTop && y < thumbBottom;
+        rows.push(_jsx(Box, { height: 1, flexShrink: 0, onClick: () => handle.scrollTo(trackScrollTop(y)), onMouseEnter: () => {
+                setHoverRow(y);
+                // Resting pointer: chip follows immediately once dwell has
+                // opened it; a sweep re-arms the dwell instead of flashing.
+                clearDwell();
+                if (chipRow !== null) {
+                    setChipRow(y);
+                }
+                else {
+                    dwellTimer.current = setTimeout(() => setChipRow(y), CHIP_DWELL_MS);
+                }
+            }, onMouseLeave: () => {
+                setHoverRow(current => (current === y ? null : current));
+                clearChip();
+            }, children: _jsx(Text, { color: inThumb
+                    ? hoverRow !== null && hoverRow >= thumbTop && hoverRow < thumbBottom
+                        ? 'professionalBlue'
+                        : 'inactive'
+                    : undefined, children: inThumb ? THUMB : '  ' }) }, y));
+    }
+    // The floating position chip, anchored left of the gutter on the
+    // dwell-armed row (TimelineRail's preview-card geometry, one line tall).
+    // Absolute + zero layout contribution: popping it never moves anything.
+    // Fenced with noSelect: it floats over selectable transcript text.
+    let hoverChip = null;
+    if (chipRow !== null && maxScroll > 0) {
+        const jumpTop = trackScrollTop(chipRow);
+        const pct = Math.round((jumpTop / maxScroll) * 100);
+        const line = Math.min(content, jumpTop + 1);
+        hoverChip = (_jsx(Box, { position: "absolute", top: chipRow, right: RAIL_WIDTH + 1, flexShrink: 0, backgroundColor: "toolCardBackgroundDim", paddingX: 1, noSelect: true, children: _jsx(Text, { color: "text", children: `${pct}% · ${line}/${content}` }) }));
+    }
+    return (_jsx(NoSelect, { children: _jsxs("ink-box", { onWheel: e => {
+                if (e.deltaY !== 0)
+                    handle.scrollBy(e.deltaY);
+            }, style: { flexDirection: 'column', flexShrink: 0, width: RAIL_WIDTH }, children: [rows, hoverChip] }) }));
+}

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

@@ -1,4 +1,5 @@
 import React from 'react';
+import type { ClickEvent } from '../ink/events/click-event.js';
 export type SelectOption = {
     value: string;
     /** Row content; plain strings render inline, richer rows may carry color swatches. */
@@ -11,12 +12,18 @@ export type SelectOption = {
  * scroll arrows). Keyboard navigation is owned by the parent dialog, which
  * passes focus/selection indices back in.
  */
-export declare function Select({ options, focusIndex, selectedValue, visibleOptionCount, }: {
+export declare function Select({ options, focusIndex, selectedValue, visibleOptionCount, onPick, }: {
     options: readonly SelectOption[];
     /** Index of the keyboard-focused row (shows the ❯ pointer). */
     focusIndex: number;
     /** Value of the chosen row (shows the ✓ checkmark). */
     selectedValue: string | undefined;
     visibleOptionCount?: number;
+    /**
+     * Mouse pick handler (fullscreen). Clicking a row reports the row's
+     * absolute index — the parent typically applies it with the same code
+     * path as the keyboard Enter. Absent → rows are not clickable.
+     */
+    onPick?: (index: number, value: string, event: ClickEvent) => void;
 }): React.ReactNode;
 //# sourceMappingURL=Select.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../src/components/Select.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,MAAM,MAAM,YAAY,GAAG;IACzB,KAAK,EAAE,MAAM,CAAA;IACb,sFAAsF;IACtF,KAAK,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB,CAAA;AAED;;;;;GAKG;AACH,wBAAgB,MAAM,CAAC,EACrB,OAAO,EACP,UAAU,EACV,aAAa,EACb,kBAAsB,GACvB,EAAE;IACD,OAAO,EAAE,SAAS,YAAY,EAAE,CAAA;IAChC,+DAA+D;IAC/D,UAAU,EAAE,MAAM,CAAA;IAClB,uDAAuD;IACvD,aAAa,EAAE,MAAM,GAAG,SAAS,CAAA;IACjC,kBAAkB,CAAC,EAAE,MAAM,CAAA;CAC5B,GAAG,KAAK,CAAC,SAAS,CAiClB"}
+{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../src/components/Select.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAA;AAG9D,MAAM,MAAM,YAAY,GAAG;IACzB,KAAK,EAAE,MAAM,CAAA;IACb,sFAAsF;IACtF,KAAK,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB,CAAA;AAED;;;;;GAKG;AACH,wBAAgB,MAAM,CAAC,EACrB,OAAO,EACP,UAAU,EACV,aAAa,EACb,kBAAsB,EACtB,MAAM,GACP,EAAE;IACD,OAAO,EAAE,SAAS,YAAY,EAAE,CAAA;IAChC,+DAA+D;IAC/D,UAAU,EAAE,MAAM,CAAA;IAClB,uDAAuD;IACvD,aAAa,EAAE,MAAM,GAAG,SAAS,CAAA;IACjC,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B;;;;OAIG;IACH,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,UAAU,KAAK,IAAI,CAAA;CACnE,GAAG,KAAK,CAAC,SAAS,CAsClB"}

package/lib/types/components/Select.js

@@ -7,13 +7,15 @@ import { ListItem } from './design-system/ListItem.js';
  * scroll arrows). Keyboard navigation is owned by the parent dialog, which
  * passes focus/selection indices back in.
  */
-export function Select({ options, focusIndex, selectedValue, visibleOptionCount = 5, }) {
+export function Select({ options, focusIndex, selectedValue, visibleOptionCount = 5, onPick, }) {
     // Window around the focus row, with scroll hints at the edges (CC style).
     const startIndex = Math.max(0, Math.min(focusIndex - Math.floor(visibleOptionCount / 2), options.length - visibleOptionCount));
     const endIndex = Math.min(startIndex + visibleOptionCount, options.length);
     const visible = options.slice(startIndex, endIndex);
     return (_jsx(Box, { flexDirection: "column", children: visible.map((option, index) => {
             const absoluteIndex = startIndex + index;
-            return (_jsx(ListItem, { isFocused: absoluteIndex === focusIndex, isSelected: option.value === selectedValue, description: option.description, showScrollUp: absoluteIndex === startIndex && startIndex > 0, showScrollDown: absoluteIndex === endIndex - 1 && endIndex < options.length, children: option.label }, option.value));
+            return (_jsx(ListItem, { isFocused: absoluteIndex === focusIndex, isSelected: option.value === selectedValue, description: option.description, showScrollUp: absoluteIndex === startIndex && startIndex > 0, showScrollDown: absoluteIndex === endIndex - 1 && endIndex < options.length, onClick: onPick
+                    ? (event) => onPick(absoluteIndex, option.value, event)
+                    : undefined, children: option.label }, option.value));
         }) }));
 }

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

@@ -9,9 +9,12 @@ import type { SkillInfo } from '../dsh-adapter/channel.js';
  * 长列表按焦点窗口化（ModelPicker 同款）：picker 经 OverlayAbove 浮层挂载后
  * 有 maxHeight 裁剪，全量渲染会让焦点行被裁掉（看不到焦点按 Enter）。
  */
-export declare function SkillsPicker({ skills, focusIndex, }: {
+export declare function SkillsPicker({ skills, focusIndex, onPick, }: {
     skills: readonly SkillInfo[];
     focusIndex: number;
+    /** Mouse pick (fullscreen): clicked row's absolute index (Chat applies
+     *  the same code path as the keyboard Enter). */
+    onPick?: (index: number) => void;
 }): React.ReactNode;
 /** `/skills` while the registry snapshot is still in flight (ModelPickerLoading 同款). */
 export declare function SkillsPickerLoading(): React.ReactNode;

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

@@ -1 +1 @@
-{"version":3,"file":"SkillsPicker.d.ts","sourceRoot":"","sources":["../../../src/components/SkillsPicker.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAA;AA2B1D;;;;;;;;GAQG;AACH,wBAAgB,YAAY,CAAC,EAC3B,MAAM,EACN,UAAU,GACX,EAAE;IACD,MAAM,EAAE,SAAS,SAAS,EAAE,CAAA;IAC5B,UAAU,EAAE,MAAM,CAAA;CACnB,GAAG,KAAK,CAAC,SAAS,CAyClB;AAED,wFAAwF;AACxF,wBAAgB,mBAAmB,IAAI,KAAK,CAAC,SAAS,CAerD"}
+{"version":3,"file":"SkillsPicker.d.ts","sourceRoot":"","sources":["../../../src/components/SkillsPicker.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAA;AA2B1D;;;;;;;;GAQG;AACH,wBAAgB,YAAY,CAAC,EAC3B,MAAM,EACN,UAAU,EACV,MAAM,GACP,EAAE;IACD,MAAM,EAAE,SAAS,SAAS,EAAE,CAAA;IAC5B,UAAU,EAAE,MAAM,CAAA;IAClB;qDACiD;IACjD,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;CACjC,GAAG,KAAK,CAAC,SAAS,CA0ClB;AAED,wFAAwF;AACxF,wBAAgB,mBAAmB,IAAI,KAAK,CAAC,SAAS,CAerD"}

package/lib/types/components/SkillsPicker.js

@@ -34,14 +34,14 @@ function sourceLabel(source) {
  * 长列表按焦点窗口化（ModelPicker 同款）：picker 经 OverlayAbove 浮层挂载后
  * 有 maxHeight 裁剪，全量渲染会让焦点行被裁掉（看不到焦点按 Enter）。
  */
-export function SkillsPicker({ skills, focusIndex, }) {
+export function SkillsPicker({ skills, focusIndex, onPick, }) {
     const { rows: terminalRows } = useTerminalSize();
     // 每项恒占 2 行（正文 + 来源/简述描述行，均 truncate 成单行）。
     // 框架行：浮层预留 8 + Pane 2 + 标题 2 + 页脚 1 + 挂载包裹 marginTop 1 = 14（ModelPicker 同款）。
     const { start, end } = listWindow(skills.map(() => 2), focusIndex, Math.max(terminalRows - 14, 2));
     return (_jsxs(Pane, { color: "permission", children: [_jsxs(Box, { flexDirection: "column", children: [_jsx(Box, { marginBottom: 1, children: _jsx(Text, { color: "remember", bold: true, children: t('picker-title-skills') }) }), skills.length === 0 ? (_jsx(Text, { dimColor: true, children: t('skills-empty') })) : (skills.slice(start, end).map((skill, index) => {
                         const absoluteIndex = start + index;
-                        return (_jsx(ListItem, { isFocused: absoluteIndex === focusIndex, description: `${sourceLabel(skill.source)}${skill.description === '' ? '' : ` · ${skill.description}`}`, showScrollUp: absoluteIndex === start && start > 0, showScrollDown: absoluteIndex === end - 1 && end < skills.length, children: skill.userInvocable ? `/${skill.name}` : skill.name }, skill.name));
+                        return (_jsx(ListItem, { isFocused: absoluteIndex === focusIndex, description: `${sourceLabel(skill.source)}${skill.description === '' ? '' : ` · ${skill.description}`}`, showScrollUp: absoluteIndex === start && start > 0, showScrollDown: absoluteIndex === end - 1 && end < skills.length, onClick: onPick ? () => onPick(absoluteIndex) : undefined, children: skill.userInvocable ? `/${skill.name}` : skill.name }, skill.name));
                     }))] }), _jsx(Text, { dimColor: true, italic: true, children: _jsx(HintLine, { text: t('hint-fill-exit') }) })] }));
 }
 /** `/skills` while the registry snapshot is still in flight (ModelPickerLoading 同款). */

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

@@ -1,9 +1,10 @@
 import React from 'react';
 import type { SubagentState } from '../dsh-adapter/subagents.js';
+import type { ClickEvent } from '../ink/events/click-event.js';
 export interface SubagentCardProps {
     subagent: SubagentState;
     focused?: boolean;
-    onClick?: () => void;
+    onClick?(event: ClickEvent): void;
 }
 export declare function SubagentCard({ subagent, focused, onClick }: SubagentCardProps): React.ReactNode;
 //# sourceMappingURL=SubagentCard.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"SubagentCard.d.ts","sourceRoot":"","sources":["../../../src/components/SubagentCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAA;AAShE,MAAM,WAAW,iBAAiB;IAAG,QAAQ,EAAE,aAAa,CAAC;IAAC,OAAO,CAAC,EAAE,OAAO,CAAC;IAAC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;CAAE;AAEvG,wBAAgB,YAAY,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,OAAO,EAAE,EAAE,iBAAiB,GAAG,KAAK,CAAC,SAAS,CA4B/F"}
+{"version":3,"file":"SubagentCard.d.ts","sourceRoot":"","sources":["../../../src/components/SubagentCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAA;AAEvC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAA;AAGhE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAA;AAO9D,MAAM,WAAW,iBAAiB;IAAG,QAAQ,EAAE,aAAa,CAAC;IAAC,OAAO,CAAC,EAAE,OAAO,CAAC;IAAC,OAAO,CAAC,CAAC,KAAK,EAAE,UAAU,GAAG,IAAI,CAAA;CAAE;AAEpH,wBAAgB,YAAY,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,OAAO,EAAE,EAAE,iBAAiB,GAAG,KAAK,CAAC,SAAS,CA0C/F"}

package/lib/types/components/SubagentCard.js

@@ -1,4 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
 import { Box, Text } from '../ui.js';
 import { t } from '../i18n.js';
 import { isMinimalMode } from '../minimalMode.js';
@@ -10,9 +11,14 @@ export function SubagentCard({ subagent, focused, onClick }) {
     const running = subagent.status === 'running' || subagent.status === 'starting';
     const elapsed = subagent.completedAt ? subagent.completedAt - subagent.startedAt : Date.now() - subagent.startedAt;
     const total = subagent.tokens?.total ?? ((subagent.tokens?.input ?? 0) + (subagent.tokens?.output ?? 0) || 0);
+    // Mouse affordance: clickable cards tint on hover; the keyboard-focused
+    // card keeps its brand-color header (no double highlight).
+    const [hovered, setHovered] = useState(false);
     // Live preview: the newest streamed line rides under the header while the
     // subagent runs, then folds away — the dashboard stays one line per settled
-    // subagent.
+    // subagent. Deliberately NOT revived on hover: an extra line would grow
+    // the card mid-gesture and reshuffle the whole dashboard list (user
+    // feedback: hover must never change layout). The hover tint stays.
     const liveLine = running ? subagent.output[subagent.output.length - 1] : undefined;
     const minimal = isMinimalMode();
     const glyph = running ? (minimal ? '·' : '🟡')
@@ -22,5 +28,6 @@ export function SubagentCard({ subagent, focused, onClick }) {
         : running ? 'warning'
             : subagent.status === 'failed' || subagent.status === 'cancelled' ? 'error'
                 : 'success';
-    return _jsxs(Box, { flexDirection: "column", paddingLeft: 1, marginBottom: 1, onClick: onClick, children: [_jsxs(Box, { flexDirection: "row", gap: 1, children: [_jsx(Text, { color: glyphColor, children: glyph }), _jsx(Text, { bold: true, color: focused ? 'claude' : undefined, children: `${t('subagent-card-prefix')}${subagent.description}` }), _jsxs(Text, { children: [_jsx(Text, { dimColor: true, children: ' · ' }), _jsx(Text, { children: subagent.model ?? subagent.provider ?? 'default' }), _jsx(Text, { dimColor: true, children: ` · ${formatDuration(elapsed)} · ${total || '—'} tok · ${subagent.toolCalls.length} tools` })] })] }), liveLine && _jsx(Text, { dimColor: true, wrap: "truncate", children: `  │ ${liveLine}` })] });
+    const hoverTint = onClick !== undefined && hovered && !focused;
+    return _jsxs(Box, { flexDirection: "column", paddingLeft: 1, marginBottom: 1, onClick: onClick, onMouseEnter: onClick !== undefined ? () => setHovered(true) : undefined, onMouseLeave: onClick !== undefined ? () => setHovered(false) : undefined, backgroundColor: hoverTint ? 'userMessageBackgroundHover' : undefined, children: [_jsxs(Box, { flexDirection: "row", gap: 1, children: [_jsx(Text, { color: glyphColor, children: glyph }), _jsx(Text, { bold: true, color: focused ? 'claude' : undefined, children: `${t('subagent-card-prefix')}${subagent.description}` }), _jsxs(Text, { children: [_jsx(Text, { dimColor: true, children: ' · ' }), _jsx(Text, { children: subagent.model ?? subagent.provider ?? 'default' }), _jsx(Text, { dimColor: true, children: ` · ${formatDuration(elapsed)} · ${total || '—'} tok · ${subagent.toolCalls.length} tools` })] })] }), liveLine && _jsx(Text, { dimColor: true, wrap: "truncate", children: `  │ ${liveLine}` })] });
 }

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

@@ -5,6 +5,10 @@ export interface SubagentDashboardProps {
     onClose: () => void;
     onSelect?: (agentId: string) => void;
 }
+/** 可点击 ✕ 退出按钮：整屏/浮层场景的鼠标退出通道（Esc 等价）。 */
+export declare function ExitButton({ onClick }: {
+    onClick: () => void;
+}): React.ReactNode;
 /**
  * SubagentDashboard — overlay panel showing all active/recent subagents.
  * Keyboard: up/down to navigate, Enter to view detail, Esc to close.

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

@@ -1 +1 @@
-{"version":3,"file":"SubagentDashboard.d.ts","sourceRoot":"","sources":["../../../src/components/SubagentDashboard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAA;AAMhE,MAAM,WAAW,sBAAsB;IACrC,SAAS,EAAE,aAAa,EAAE,CAAA;IAC1B,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAA;CACrC;AAED;;;GAGG;AACH,wBAAgB,iBAAiB,CAAC,EAChC,SAAS,EACT,OAAO,EACP,QAAQ,EACT,EAAE,sBAAsB,GAAG,KAAK,CAAC,SAAS,CAoG1C"}
+{"version":3,"file":"SubagentDashboard.d.ts","sourceRoot":"","sources":["../../../src/components/SubagentDashboard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAA;AAMhE,MAAM,WAAW,sBAAsB;IACrC,SAAS,EAAE,aAAa,EAAE,CAAA;IAC1B,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAA;CACrC;AAED,yCAAyC;AACzC,wBAAgB,UAAU,CAAC,EAAE,OAAO,EAAE,EAAE;IAAE,OAAO,EAAE,MAAM,IAAI,CAAA;CAAE,GAAG,KAAK,CAAC,SAAS,CAWhF;AAED;;;GAGG;AACH,wBAAgB,iBAAiB,CAAC,EAChC,SAAS,EACT,OAAO,EACP,QAAQ,EACT,EAAE,sBAAsB,GAAG,KAAK,CAAC,SAAS,CA2G1C"}

package/lib/types/components/SubagentDashboard.js

@@ -5,6 +5,11 @@ import { SubagentCard } from './SubagentCard.js';
 import { t } from '../i18n.js';
 import { Divider } from './design-system/Divider.js';
 import { isPlainReturnInput } from '../utils/modifiers.js';
+/** 可点击 ✕ 退出按钮：整屏/浮层场景的鼠标退出通道（Esc 等价）。 */
+export function ExitButton({ onClick }) {
+    const [hovered, setHovered] = React.useState(false);
+    return (_jsx(Box, { onClick: onClick, onMouseEnter: () => setHovered(true), onMouseLeave: () => setHovered(false), children: _jsx(Text, { color: hovered ? 'text' : 'subtle', children: ' ✕' }) }));
+}
 /**
  * SubagentDashboard — overlay panel showing all active/recent subagents.
  * Keyboard: up/down to navigate, Enter to view detail, Esc to close.
@@ -44,7 +49,10 @@ export function SubagentDashboard({ subagents, onClose, onSelect }) {
     const running = subagents.filter(s => s.status === 'running').length;
     const completed = subagents.filter(s => s.status === 'completed').length;
     const failed = subagents.filter(s => s.status === 'failed').length;
-    return (_jsxs(Box, { flexDirection: "column", paddingX: 2, paddingY: 1, children: [_jsx(Divider, { color: "claude", title: t('subagent-dashboard-title'), padding: 4 }), _jsxs(Box, { flexDirection: "row", gap: 3, marginTop: 1, marginBottom: 1, children: [_jsxs(Text, { children: [_jsx(Text, { color: "claude", children: running }), _jsxs(Text, { dimColor: true, children: [" ", t('subagent-count-running')] })] }), _jsxs(Text, { children: [_jsx(Text, { color: "success", children: completed }), _jsxs(Text, { dimColor: true, children: [" ", t('subagent-count-completed')] })] }), failed > 0 && (_jsxs(Text, { children: [_jsx(Text, { color: "error", children: failed }), _jsxs(Text, { dimColor: true, children: [" ", t('subagent-count-failed')] })] }))] }), _jsx(Box, { flexDirection: "column", maxHeight: Math.max(10, rows - 10), marginTop: 1, children: _jsx(ScrollBox, { ref: scrollRef, flexDirection: "column", flexGrow: 1, children: subagents.length === 0 ? (_jsxs(Box, { flexDirection: "column", alignItems: "center", marginTop: Math.max(2, Math.floor((rows - 16) / 3)), children: [_jsx(Text, { dimColor: true, children: '○' }), _jsx(Text, { dimColor: true, children: t('subagent-none') }), _jsx(Box, { marginTop: 1, children: _jsx(Text, { dimColor: true, children: t('subagent-empty-hint') }) })] })) : (subagents.map((subagent, index) => (_jsxs(Box, { flexDirection: "column", children: [_jsx(SubagentCard, { subagent: subagent, focused: index === focusIndex }), index < subagents.length - 1 && (_jsx(Text, { dimColor: true, children: '─'.repeat(Math.max(20, Math.min(72, columns - 6))) }))] }, subagent.agentId)))) }) }), _jsx(Divider, { color: "subtle", title: "", padding: 4 }), _jsx(Box, { marginTop: 0, children: _jsx(Text, { dimColor: true, children: onSelect
+    return (_jsxs(Box, { flexDirection: "column", paddingX: 2, paddingY: 1, children: [_jsx(Divider, { color: "claude", title: t('subagent-dashboard-title'), padding: 4 }), _jsxs(Box, { flexDirection: "row", gap: 3, marginTop: 1, marginBottom: 1, children: [_jsxs(Text, { children: [_jsx(Text, { color: "claude", children: running }), _jsxs(Text, { dimColor: true, children: [" ", t('subagent-count-running')] })] }), _jsxs(Text, { children: [_jsx(Text, { color: "success", children: completed }), _jsxs(Text, { dimColor: true, children: [" ", t('subagent-count-completed')] })] }), failed > 0 && (_jsxs(Text, { children: [_jsx(Text, { color: "error", children: failed }), _jsxs(Text, { dimColor: true, children: [" ", t('subagent-count-failed')] })] })), _jsx(Box, { flexGrow: 1 }), _jsx(ExitButton, { onClick: onClose })] }), _jsx(Box, { flexDirection: "column", maxHeight: Math.max(10, rows - 10), marginTop: 1, children: _jsx(ScrollBox, { ref: scrollRef, flexDirection: "column", flexGrow: 1, children: subagents.length === 0 ? (_jsxs(Box, { flexDirection: "column", alignItems: "center", marginTop: Math.max(2, Math.floor((rows - 16) / 3)), children: [_jsx(Text, { dimColor: true, children: '○' }), _jsx(Text, { dimColor: true, children: t('subagent-none') }), _jsx(Box, { marginTop: 1, children: _jsx(Text, { dimColor: true, children: t('subagent-empty-hint') }) })] })) : (subagents.map((subagent, index) => (_jsxs(Box, { flexDirection: "column", children: [_jsx(SubagentCard, { subagent: subagent, focused: index === focusIndex, onClick: onSelect !== undefined
+                                    // Click = view detail, same as Enter on the focused card.
+                                    ? () => onSelect(subagent.agentId)
+                                    : undefined }), index < subagents.length - 1 && (_jsx(Text, { dimColor: true, children: '─'.repeat(Math.max(20, Math.min(72, columns - 6))) }))] }, subagent.agentId)))) }) }), _jsx(Divider, { color: "subtle", title: "", padding: 4 }), _jsx(Box, { marginTop: 0, children: _jsx(Text, { dimColor: true, children: onSelect
                         ? t('subagent-dashboard-hint-detail')
                         : t('subagent-dashboard-hint-basic') }) })] }));
 }

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

@@ -1 +1 @@
-{"version":3,"file":"SubagentDetailScene.d.ts","sourceRoot":"","sources":["../../../src/components/SubagentDetailScene.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAA;AAsGhE,MAAM,WAAW,wBAAwB;IACvC,QAAQ,EAAE,aAAa,CAAA;IACvB,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,WAAW,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAA;CACxC;AAED;;;;;;GAMG;AACH,wBAAgB,mBAAmB,CAAC,EAClC,QAAQ,EACR,MAAM,EACN,WAAW,GACZ,EAAE,wBAAwB,GAAG,KAAK,CAAC,SAAS,CA+L5C"}
+{"version":3,"file":"SubagentDetailScene.d.ts","sourceRoot":"","sources":["../../../src/components/SubagentDetailScene.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAA;AAuGhE,MAAM,WAAW,wBAAwB;IACvC,QAAQ,EAAE,aAAa,CAAA;IACvB,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,WAAW,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAA;CACxC;AAED;;;;;;GAMG;AACH,wBAAgB,mBAAmB,CAAC,EAClC,QAAQ,EACR,MAAM,EACN,WAAW,GACZ,EAAE,wBAAwB,GAAG,KAAK,CAAC,SAAS,CA8M5C"}

package/lib/types/components/SubagentDetailScene.js

@@ -1,8 +1,9 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import React from 'react';
 import { Box, Text, useInput, ScrollBox, useTerminalSize } from '../ui.js';
 import { t } from '../i18n.js';
 import { Divider } from './design-system/Divider.js';
+import { ExitButton } from './SubagentDashboard.js';
 import { isPlainReturnInput } from '../utils/modifiers.js';
 import { toolNameColor } from './messages/AssistantToolUseMessage.js';
 import { getCliHighlightPromise } from '../cc/cliHighlight.js';
@@ -134,8 +135,8 @@ export function SubagentDetailScene({ subagent, onBack, onInterrupt, }) {
     });
     const tab = (name, label) => {
         const active = page === name;
-        return (_jsxs(React.Fragment, { children: [_jsx(Text, { color: active ? 'claude' : undefined, bold: active, inverse: active, children: ` ${label} ` }), _jsx(Text, { dimColor: true, children: name === PAGES[PAGES.length - 1] ? '' : '│' })] }, name));
+        return (_jsxs(React.Fragment, { children: [_jsx(Box, { onClick: () => setPage(name), backgroundColor: !active ? 'userMessageBackgroundHover' : undefined, children: _jsx(Text, { color: active ? 'claude' : undefined, bold: active, inverse: active, children: ` ${label} ` }) }), _jsx(Text, { dimColor: true, children: name === PAGES[PAGES.length - 1] ? '' : '│' })] }, name));
     };
-    return (_jsxs(Box, { flexDirection: "column", paddingX: 2, paddingY: 1, children: [_jsxs(Box, { flexDirection: "row", gap: 1, children: [_jsx(Text, { color: info.color, bold: true, children: info.glyph }), _jsx(Text, { bold: true, children: `${t('subagent-card-prefix')}${subagent.description}` }), _jsx(Text, { dimColor: true, children: "\u00B7" }), _jsx(Text, { color: info.color, children: info.label })] }), _jsxs(Text, { children: [_jsx(Text, { children: subagent.model ?? subagent.provider ?? 'default' }), _jsx(Text, { dimColor: true, children: ` · ${formatDuration(elapsed)} · ${totalTokens || '—'} tok · ${subagent.toolCalls.length} tools` })] }), _jsxs(Text, { dimColor: true, children: [`${t('subagent-started')} ${formatTimestamp(subagent.startedAt)}`
-                        + (subagent.completedAt ? ` · ${t('subagent-completed')} ${formatTimestamp(subagent.completedAt)}` : ''), ` · id ${subagent.agentId}`] }), subagent.error && (_jsx(Box, { marginTop: 0, children: _jsx(Text, { color: "error", wrap: "wrap", children: `${t('subagent-error-label')}: ${subagent.error}` }) })), _jsxs(Box, { flexDirection: "row", gap: 0, marginTop: 1, children: [tab('summary', t('subagent-tab-summary')), tab('output', t('subagent-output-label')), tab('tools', t('subagent-tools')), _jsx(Text, { dimColor: true, children: `  ${pageIndex + 1}/${PAGES.length}` })] }), _jsx(Text, { dimColor: true, children: '─'.repeat(Math.max(20, Math.min(72, columns - 6))) }), _jsx(Box, { flexDirection: "column", paddingX: 1, maxHeight: Math.max(10, rows - 14), children: _jsxs(ScrollBox, { ref: scrollRef, flexDirection: "column", flexGrow: 1, children: [page === 'summary' && (_jsxs(Box, { flexDirection: "column", children: [_jsx(StatGrid, { subagent: subagent, totalTokens: totalTokens, elapsed: elapsed, statusLabel: info.label, statusColor: info.color }), subagent.summary && (_jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsx(Text, { dimColor: true, bold: true, children: '─ summary ' }), _jsx(Text, { wrap: "wrap", children: subagent.summary })] })), !subagent.summary && (_jsx(Text, { dimColor: true, children: isRunning ? t('subagent-no-output') : t('subagent-no-summary') }))] })), page === 'output' && (subagent.outputEvents.length === 0 && subagent.output.length === 0 ? (_jsx(Text, { dimColor: true, children: t('subagent-no-output') })) : (subagent.outputEvents.map((line, index) => (_jsxs(Text, { wrap: "wrap", dimColor: line.kind === 'thinking' || line.kind === 'system', color: line.kind === 'error' ? 'error' : undefined, children: [line.kind === 'thinking' ? '  ⌁ ' : '  ', line.text, !line.settled && isRunning ? ' ▍' : ''] }, index))))), page === 'tools' && (subagent.toolCalls.length === 0 ? (_jsx(Text, { dimColor: true, children: t('subagent-no-tools') })) : (subagent.toolCalls.map((tool, index) => (_jsxs(Box, { flexDirection: "column", marginTop: index === 0 ? 0 : 1, children: [_jsxs(Box, { flexDirection: "row", gap: 1, children: [_jsx(Text, { color: tool.status === 'failed' ? 'error' : tool.status === 'running' ? 'warning' : 'success', children: tool.status === 'running' ? '·' : tool.status === 'failed' ? '×' : '✓' }), _jsx(Text, { color: toolNameColor(tool.name), children: tool.name }), tool.endedAt && _jsx(Text, { dimColor: true, children: formatDuration(tool.endedAt - tool.startedAt) })] }), tool.argsPreview && (_jsx(Box, { flexDirection: "row", paddingLeft: 2, children: _jsx(JsonArgsText, { raw: tool.argsPreview }) })), tool.resultPreview && (_jsx(Box, { flexDirection: "row", paddingLeft: 2, children: _jsx(Text, { dimColor: true, wrap: "wrap", children: `⎿ ${tool.resultPreview}` }) })), tool.error && (_jsx(Box, { flexDirection: "row", paddingLeft: 2, children: _jsx(Text, { color: "error", wrap: "wrap", children: tool.error }) }))] }, tool.id ?? index)))))] }) }), _jsx(Divider, { color: "subtle", title: "", padding: 4 }), _jsx(Box, { marginTop: 0, children: _jsxs(Text, { dimColor: true, children: [`←/→ ${t('subagent-hint-page')} · ↑/↓ ${t('subagent-hint-scroll')}`, isRunning && onInterrupt ? ' · X interrupt' : '', ` · Esc ${t('subagent-hint-back')}`] }) })] }));
+    return (_jsxs(Box, { flexDirection: "column", paddingX: 2, paddingY: 1, children: [_jsxs(Box, { flexDirection: "row", gap: 1, children: [_jsx(Text, { color: info.color, bold: true, children: info.glyph }), _jsx(Text, { bold: true, children: `${t('subagent-card-prefix')}${subagent.description}` }), _jsx(Text, { dimColor: true, children: "\u00B7" }), _jsx(Text, { color: info.color, children: info.label }), _jsx(Box, { flexGrow: 1 }), _jsx(ExitButton, { onClick: onBack })] }), _jsxs(Text, { children: [_jsx(Text, { children: subagent.model ?? subagent.provider ?? 'default' }), _jsx(Text, { dimColor: true, children: ` · ${formatDuration(elapsed)} · ${totalTokens || '—'} tok · ${subagent.toolCalls.length} tools` })] }), _jsxs(Text, { dimColor: true, children: [`${t('subagent-started')} ${formatTimestamp(subagent.startedAt)}`
+                        + (subagent.completedAt ? ` · ${t('subagent-completed')} ${formatTimestamp(subagent.completedAt)}` : ''), ` · id ${subagent.agentId}`] }), subagent.error && (_jsx(Box, { marginTop: 0, children: _jsx(Text, { color: "error", wrap: "wrap", children: `${t('subagent-error-label')}: ${subagent.error}` }) })), _jsxs(Box, { flexDirection: "row", gap: 0, marginTop: 1, children: [tab('summary', t('subagent-tab-summary')), tab('output', t('subagent-output-label')), tab('tools', t('subagent-tools')), _jsx(Text, { dimColor: true, children: `  ${pageIndex + 1}/${PAGES.length}` })] }), _jsx(Text, { dimColor: true, children: '─'.repeat(Math.max(20, Math.min(72, columns - 6))) }), _jsx(Box, { flexDirection: "column", paddingX: 1, maxHeight: Math.max(10, rows - 14), children: _jsxs(ScrollBox, { ref: scrollRef, flexDirection: "column", flexGrow: 1, children: [page === 'summary' && (_jsxs(Box, { flexDirection: "column", children: [_jsx(StatGrid, { subagent: subagent, totalTokens: totalTokens, elapsed: elapsed, statusLabel: info.label, statusColor: info.color }), subagent.summary && (_jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsx(Text, { dimColor: true, bold: true, children: '─ summary ' }), _jsx(Text, { wrap: "wrap", children: subagent.summary })] })), !subagent.summary && (_jsx(Text, { dimColor: true, children: isRunning ? t('subagent-no-output') : t('subagent-no-summary') }))] })), page === 'output' && (subagent.outputEvents.length === 0 && subagent.output.length === 0 ? (_jsx(Text, { dimColor: true, children: t('subagent-no-output') })) : (subagent.outputEvents.map((line, index) => (_jsxs(Text, { wrap: "wrap", dimColor: line.kind === 'thinking' || line.kind === 'system', color: line.kind === 'error' ? 'error' : undefined, children: [line.kind === 'thinking' ? '  ⌁ ' : '  ', line.text, !line.settled && isRunning ? ' ▍' : ''] }, index))))), page === 'tools' && (subagent.toolCalls.length === 0 ? (_jsx(Text, { dimColor: true, children: t('subagent-no-tools') })) : (subagent.toolCalls.map((tool, index) => (_jsxs(Box, { flexDirection: "column", marginTop: index === 0 ? 0 : 1, children: [_jsxs(Box, { flexDirection: "row", gap: 1, children: [_jsx(Text, { color: tool.status === 'failed' ? 'error' : tool.status === 'running' ? 'warning' : 'success', children: tool.status === 'running' ? '·' : tool.status === 'failed' ? '×' : '✓' }), _jsx(Text, { color: toolNameColor(tool.name), children: tool.name }), tool.endedAt && _jsx(Text, { dimColor: true, children: formatDuration(tool.endedAt - tool.startedAt) })] }), tool.argsPreview && (_jsx(Box, { flexDirection: "row", paddingLeft: 2, children: _jsx(JsonArgsText, { raw: tool.argsPreview }) })), tool.resultPreview && (_jsx(Box, { flexDirection: "row", paddingLeft: 2, children: _jsx(Text, { dimColor: true, wrap: "wrap", children: `⎿ ${tool.resultPreview}` }) })), tool.error && (_jsx(Box, { flexDirection: "row", paddingLeft: 2, children: _jsx(Text, { color: "error", wrap: "wrap", children: tool.error }) }))] }, tool.id ?? index)))))] }) }), _jsx(Divider, { color: "subtle", title: "", padding: 4 }), _jsxs(Box, { marginTop: 0, flexDirection: "row", children: [_jsx(Text, { dimColor: true, children: `←/→ ${t('subagent-hint-page')} · ↑/↓ ${t('subagent-hint-scroll')}` }), isRunning && onInterrupt && (_jsxs(_Fragment, { children: [_jsx(Text, { dimColor: true, children: ' · ' }), _jsx(Box, { onClick: () => onInterrupt(subagent.agentId), children: _jsx(Text, { dimColor: true, bold: true, color: "warning", children: "X interrupt" }) })] })), _jsx(Text, { dimColor: true, children: ` · Esc ${t('subagent-hint-back')}` })] })] }));
 }