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

package/lib/types/components/messages/AssistantToolUseMessage.js

@@ -221,7 +221,7 @@ function HeaderTitle({ name, title, isTerminal, displayArgs, argsLanguage, nameC
  * output, read content — instead of the raw result dump (mirroring Claude Code's `AssistantToolUseMessage.tsx` + the dsh-tools presentation views the
  * channel captures per call).
  */
-export function AssistantToolUseMessage({ tool, addMargin, verbose, isSelected = false, isExpanded = false, footnote, diffLayout = 'auto', toolBackground = 'none', }) {
+export function AssistantToolUseMessage({ tool, addMargin, verbose, isSelected = false, isExpanded = false, onClick, footnote, diffLayout = 'auto', toolBackground = 'none', }) {
     const isRunning = tool.status === 'running';
     const isError = tool.status === 'error';
     const displayArgs = verbose ? tool.argsFull ?? tool.argsText : tool.argsText;
@@ -286,9 +286,11 @@ export function AssistantToolUseMessage({ tool, addMargin, verbose, isSelected =
         : ordinaryToolBackground === 'strong'
             ? 'toolCardBackground'
             : undefined;
-    return (_jsx(Box, { ref: viewportRef, flexDirection: "row", justifyContent: "space-between", marginTop: addMargin ? 1 : 0, width: "100%", 
+    return (_jsx(Box, { ref: viewportRef, flexDirection: "row", justifyContent: "space-between", marginTop: addMargin ? 1 : 0, width: "100%", onClick: onClick, 
         // Only selection paints a highlight; the configured treatment applies
         // to an ordinary card. Diff line tints stay - they are content, not chrome.
+        // No hover tint: the card stays visually quiet until clicked (user
+        // feedback — row-hover color changes read as noise in the transcript).
         backgroundColor: isSelected ? 'messageActionsBackground' : ordinaryBackground, children: _jsxs(Box, { flexDirection: "column", flexGrow: 1, children: [_jsxs(Box, { flexDirection: "row", flexWrap: "nowrap", minWidth: minWidth, children: [_jsx(ToolUseLoader, { shouldAnimate: isRunning, isUnresolved: isRunning, isError: isError, toolName: tool.name }), _jsx(HeaderTitle, { name: name, title: headerTitle, isTerminal: headerIsTerminal, displayArgs: displayArgs, argsLanguage: argsLanguage, nameColor: toolNameColor(tool.name) }), !isRunning && (_jsx(Box, { flexWrap: "nowrap", children: _jsx(Text, { dimColor: true, children: elapsedText }) }))] }), useSplitDiff && view?.card === 'diff' ? (_jsxs(Box, { flexDirection: "row", children: [_jsx(Box, { width: 3, flexShrink: 0, children: _jsx(Text, { dimColor: true, children: GUTTER_FIRST }) }), _jsx(SplitDiffView, { diffs: view.diffs, width: columns - 4, maxRows: DIFF_BODY_MAX_LINES, verbose: verbose, toolBackground: ordinaryToolBackground })] })) : (rendered.map((line, index) => (_jsxs(Box, { flexDirection: "row", children: [_jsx(Box, { width: 3, flexShrink: 0, children: _jsx(Text, { color: line.tone === 'add'
                                     ? 'diffAddedWord'
                                     : line.tone === 'del'

package/lib/types/components/messages/UserPromptMessage.d.ts

@@ -1,11 +1,12 @@
 import React from 'react';
+import type { ClickEvent } from '../../ink/events/click-event.js';
 type Props = {
     text: string;
     /** Adds the top margin between turns (CC: addMargin). */
     addMargin: boolean;
     /** Message-selection mode highlight. */
     isSelected?: boolean;
-    onClick?(): void;
+    onClick?(event: ClickEvent): void;
 };
 /**
  * User prompt bubble: `❯ text` in bold briefLabelYou gold with no background

package/lib/types/components/messages/UserPromptMessage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"UserPromptMessage.d.ts","sourceRoot":"","sources":["../../../../src/components/messages/UserPromptMessage.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAMzB,KAAK,KAAK,GAAG;IACX,IAAI,EAAE,MAAM,CAAA;IACZ,yDAAyD;IACzD,SAAS,EAAE,OAAO,CAAA;IAClB,wCAAwC;IACxC,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,OAAO,CAAC,IAAI,IAAI,CAAA;CACjB,CAAA;AAED;;;;GAIG;AACH,wBAAgB,iBAAiB,CAAC,EAChC,IAAI,EACJ,SAAS,EACT,UAAkB,EAClB,OAAO,GACR,EAAE,KAAK,GAAG,KAAK,CAAC,SAAS,CA6BzB"}
+{"version":3,"file":"UserPromptMessage.d.ts","sourceRoot":"","sources":["../../../../src/components/messages/UserPromptMessage.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iCAAiC,CAAA;AAEjE,KAAK,KAAK,GAAG;IACX,IAAI,EAAE,MAAM,CAAA;IACZ,yDAAyD;IACzD,SAAS,EAAE,OAAO,CAAA;IAClB,wCAAwC;IACxC,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,OAAO,CAAC,CAAC,KAAK,EAAE,UAAU,GAAG,IAAI,CAAA;CAClC,CAAA;AAED;;;;GAIG;AACH,wBAAgB,iBAAiB,CAAC,EAChC,IAAI,EACJ,SAAS,EACT,UAAkB,EAClB,OAAO,GACR,EAAE,KAAK,GAAG,KAAK,CAAC,SAAS,CA6BzB"}

package/lib/types/components/questions/AskUserQuestionPanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AskUserQuestionPanel.d.ts","sourceRoot":"","sources":["../../../../src/components/questions/AskUserQuestionPanel.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAA;AAMzB,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAA;AASvE,MAAM,MAAM,yBAAyB,GAAG;IACtC,gEAAgE;IAChE,QAAQ,CAAC,QAAQ,EAAE;QACjB,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAA;QACzB,QAAQ,CAAC,MAAM,CAAC,EAAE,MAAM,CAAA;QACxB,QAAQ,CAAC,MAAM,CAAC,EAAE,MAAM,CAAA;QACxB,QAAQ,CAAC,OAAO,CAAC,EAAE,aAAa,CAAC;YAAE,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;YAAC,QAAQ,CAAC,WAAW,CAAC,EAAE,MAAM,CAAA;SAAE,CAAC,CAAA;QAC3F,QAAQ,CAAC,WAAW,CAAC,EAAE,OAAO,CAAA;QAC9B;;oEAE4D;QAC5D,QAAQ,CAAC,eAAe,CAAC,EAAE,OAAO,CAAA;QAClC;0EACkE;QAClE,QAAQ,CAAC,MAAM,CAAC,EAAE;YAAE,QAAQ,CAAC,IAAI,EAAE,aAAa,CAAC;YAAC,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAA;SAAE,CAAA;KAC7E,CAAA;IACD,2DAA2D;IAC3D,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAA;IACzB,sDAAsD;IACtD,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAA;IACtB,iDAAiD;IACjD,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAA;IACzB,QAAQ,CAAC,QAAQ,EAAE,CAAC,SAAS,EAAE,iBAAiB,KAAK,IAAI,CAAA;IACzD,2EAA2E;IAC3E,QAAQ,CAAC,QAAQ,EAAE,MAAM,IAAI,CAAA;CAC9B,CAAA;AAED,wBAAgB,oBAAoB,CAAC,EACnC,QAAQ,EACR,QAAQ,EACR,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,QAAQ,GACT,EAAE,yBAAyB,GAAG,KAAK,CAAC,SAAS,CAwW7C"}
+{"version":3,"file":"AskUserQuestionPanel.d.ts","sourceRoot":"","sources":["../../../../src/components/questions/AskUserQuestionPanel.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAA;AAMzB,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAA;AASvE,MAAM,MAAM,yBAAyB,GAAG;IACtC,gEAAgE;IAChE,QAAQ,CAAC,QAAQ,EAAE;QACjB,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAA;QACzB,QAAQ,CAAC,MAAM,CAAC,EAAE,MAAM,CAAA;QACxB,QAAQ,CAAC,MAAM,CAAC,EAAE,MAAM,CAAA;QACxB,QAAQ,CAAC,OAAO,CAAC,EAAE,aAAa,CAAC;YAAE,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;YAAC,QAAQ,CAAC,WAAW,CAAC,EAAE,MAAM,CAAA;SAAE,CAAC,CAAA;QAC3F,QAAQ,CAAC,WAAW,CAAC,EAAE,OAAO,CAAA;QAC9B;;oEAE4D;QAC5D,QAAQ,CAAC,eAAe,CAAC,EAAE,OAAO,CAAA;QAClC;0EACkE;QAClE,QAAQ,CAAC,MAAM,CAAC,EAAE;YAAE,QAAQ,CAAC,IAAI,EAAE,aAAa,CAAC;YAAC,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAA;SAAE,CAAA;KAC7E,CAAA;IACD,2DAA2D;IAC3D,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAA;IACzB,sDAAsD;IACtD,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAA;IACtB,iDAAiD;IACjD,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAA;IACzB,QAAQ,CAAC,QAAQ,EAAE,CAAC,SAAS,EAAE,iBAAiB,KAAK,IAAI,CAAA;IACzD,2EAA2E;IAC3E,QAAQ,CAAC,QAAQ,EAAE,MAAM,IAAI,CAAA;CAC9B,CAAA;AAED,wBAAgB,oBAAoB,CAAC,EACnC,QAAQ,EACR,QAAQ,EACR,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,QAAQ,GACT,EAAE,yBAAyB,GAAG,KAAK,CAAC,SAAS,CA+Y7C"}

package/lib/types/components/questions/AskUserQuestionPanel.js

@@ -241,7 +241,39 @@ export function AskUserQuestionPanel({ question, position, total, answered, onAn
     const remaining = total - answered;
     const headerTitle = ` ${t('question-header-progress', { position, total, remaining: remaining > 1 ? t('question-remaining-more', { n: remaining }) : '' })} `;
     const cursorChar = customCursor < customText.length ? customText[customCursor] : ' ';
-    const renderInputRow = () => (_jsxs(Box, { flexDirection: "row", marginTop: inputFocused ? 1 : 0, children: [_jsx(Box, { width: 1, flexShrink: 0, children: _jsx(Text, { color: inputFocused ? 'claude' : undefined, bold: inputFocused, children: inputFocused ? POINTER : ' ' }) }), _jsx(Box, { width: 1, flexShrink: 0, children: _jsx(Text, { color: inputFocused ? 'claude' : 'suggestion', children: PENCIL }) }), _jsxs(Box, { flexDirection: "row", marginLeft: 1, children: [_jsx(Text, { bold: inputFocused, color: inputFocused ? 'claude' : 'suggestion', children: t('question-custom-tab') }), attached !== null && (_jsx(Text, { color: "suggestion", children: t('question-attached-label', { label: attached }) })), _jsx(Text, { dimColor: true, children: "\uFF1A" }), customText === '' && !inputFocused ? (_jsx(Text, { ref: caretRef, dimColor: true, children: t('question-direct-input') })) : (_jsxs(_Fragment, { children: [_jsx(Text, { wrap: "wrap", children: customText.slice(0, customCursor) }), inputFocused
+    /** Mouse: click the input row to focus it (same as Tab). */
+    const focusInputRow = () => {
+        if (hideCustomInput)
+            return;
+        setFocusIndex(options.length);
+        setError(null);
+    };
+    /**
+     * Mouse: click an option row. Multi-select toggles the checkmark (same as
+     * Space); single-select answers immediately with that option plus any
+     * typed text (same as focusing the row and pressing Enter) — one click =
+     * one answer, matching ApprovalPanel's click semantics.
+     */
+    const clickOption = (index) => {
+        if (multiSelect) {
+            setChecked(previous => {
+                const next = new Set(previous);
+                if (next.has(index))
+                    next.delete(index);
+                else
+                    next.add(index);
+                return next;
+            });
+            return;
+        }
+        const label = options[index]?.label;
+        if (label === undefined)
+            return;
+        const text = customText.trim();
+        onAnswer({ selected: [label], ...(text !== '' ? { custom: text } : {}) });
+    };
+    const [hoverIndex, setHoverIndex] = React.useState(-1);
+    const renderInputRow = () => (_jsxs(Box, { flexDirection: "row", marginTop: inputFocused ? 1 : 0, onClick: focusInputRow, onMouseEnter: () => setHoverIndex(options.length), onMouseLeave: () => setHoverIndex(current => (current === options.length ? -1 : current)), backgroundColor: hoverIndex === options.length && !inputFocused ? 'userMessageBackgroundHover' : undefined, children: [_jsx(Box, { width: 1, flexShrink: 0, children: _jsx(Text, { color: inputFocused ? 'claude' : undefined, bold: inputFocused, children: inputFocused ? POINTER : ' ' }) }), _jsx(Box, { width: 1, flexShrink: 0, children: _jsx(Text, { color: inputFocused ? 'claude' : 'suggestion', children: PENCIL }) }), _jsxs(Box, { flexDirection: "row", marginLeft: 1, children: [_jsx(Text, { bold: inputFocused, color: inputFocused ? 'claude' : 'suggestion', children: t('question-custom-tab') }), attached !== null && (_jsx(Text, { color: "suggestion", children: t('question-attached-label', { label: attached }) })), _jsx(Text, { dimColor: true, children: "\uFF1A" }), customText === '' && !inputFocused ? (_jsx(Text, { ref: caretRef, dimColor: true, children: t('question-direct-input') })) : (_jsxs(_Fragment, { children: [_jsx(Text, { wrap: "wrap", children: customText.slice(0, customCursor) }), inputFocused
                                 ? _jsx(Text, { ref: caretRef, inverse: true, children: cursorChar })
                                 : _jsx(Text, { ref: caretRef, color: "suggestion", children: "\u258F" }), _jsx(Text, { wrap: "wrap", children: customText.slice(inputFocused ? customCursor + 1 : customCursor) })] }))] })] }));
     const renderOptions = () => (_jsxs(Box, { flexDirection: "column", marginTop: 1, children: [options.slice(optionWindow.start, optionWindow.end).map((option, index) => {
@@ -259,7 +291,7 @@ export function AskUserQuestionPanel({ question, position, total, answered, onAn
                 const description = windowedOptions
                     ? option.description?.replace(/\s+/gu, ' ').trim()
                     : option.description;
-                return (_jsxs(Box, { flexDirection: "row", marginTop: !windowedOptions && focused ? 1 : 0, children: [_jsx(Box, { width: 1, flexShrink: 0, children: _jsx(Text, { color: focused ? 'claude' : undefined, bold: focused, children: pointer }) }), _jsx(Box, { width: 1, flexShrink: 0, children: _jsx(Text, { color: focused ? 'claude' : undefined, bold: selected, children: selected ? (multiSelect ? CHECKED : '●') : UNCHECKED }) }), _jsxs(Box, { flexDirection: "column", marginLeft: 1, children: [_jsx(Text, { bold: focused || selected, color: focused ? 'claude' : undefined, wrap: windowedOptions ? 'truncate' : 'wrap', children: label }), description !== undefined && (_jsx(Text, { dimColor: true, wrap: windowedOptions ? 'truncate' : 'wrap', children: description }))] })] }, `${absoluteIndex}:${option.label}`));
+                return (_jsxs(Box, { flexDirection: "row", marginTop: !windowedOptions && focused ? 1 : 0, onClick: () => clickOption(absoluteIndex), onMouseEnter: () => setHoverIndex(absoluteIndex), onMouseLeave: () => setHoverIndex(current => (current === absoluteIndex ? -1 : current)), backgroundColor: hoverIndex === absoluteIndex && !focused ? 'userMessageBackgroundHover' : undefined, children: [_jsx(Box, { width: 1, flexShrink: 0, children: _jsx(Text, { color: focused ? 'claude' : undefined, bold: focused, children: pointer }) }), _jsx(Box, { width: 1, flexShrink: 0, children: _jsx(Text, { color: focused ? 'claude' : undefined, bold: selected, children: selected ? (multiSelect ? CHECKED : '●') : UNCHECKED }) }), _jsxs(Box, { flexDirection: "column", marginLeft: 1, children: [_jsx(Text, { bold: focused || selected, color: focused ? 'claude' : undefined, wrap: windowedOptions ? 'truncate' : 'wrap', children: label }), description !== undefined && (_jsx(Text, { dimColor: true, wrap: windowedOptions ? 'truncate' : 'wrap', children: description }))] })] }, `${absoluteIndex}:${option.label}`));
             }), hideCustomInput ? null : renderInputRow()] }));
     const hintParts = inputFocused
         ? [

package/lib/types/components/questions/PlanReviewPanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PlanReviewPanel.d.ts","sourceRoot":"","sources":["../../../../src/components/questions/PlanReviewPanel.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAA;AAOzB,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAA;AAKvE,MAAM,MAAM,oBAAoB,GAAG;IACjC,gEAAgE;IAChE,QAAQ,CAAC,QAAQ,EAAE;QACjB,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAA;QACzB,QAAQ,CAAC,MAAM,CAAC,EAAE,MAAM,CAAA;QACxB,QAAQ,CAAC,MAAM,CAAC,EAAE,MAAM,CAAA;QACxB,QAAQ,CAAC,OAAO,CAAC,EAAE,aAAa,CAAC;YAAE,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;YAAC,QAAQ,CAAC,WAAW,CAAC,EAAE,MAAM,CAAA;SAAE,CAAC,CAAA;QAC3F,QAAQ,CAAC,MAAM,CAAC,EAAE;YAAE,QAAQ,CAAC,IAAI,EAAE,aAAa,CAAC;YAAC,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAA;SAAE,CAAA;KAC7E,CAAA;IACD,QAAQ,CAAC,QAAQ,EAAE,CAAC,SAAS,EAAE,iBAAiB,KAAK,IAAI,CAAA;IACzD,iEAAiE;IACjE,QAAQ,CAAC,QAAQ,EAAE,MAAM,IAAI,CAAA;CAC9B,CAAA;AAED,wBAAgB,eAAe,CAAC,EAC9B,QAAQ,EACR,QAAQ,EACR,QAAQ,GACT,EAAE,oBAAoB,GAAG,KAAK,CAAC,SAAS,CAyOxC"}
+{"version":3,"file":"PlanReviewPanel.d.ts","sourceRoot":"","sources":["../../../../src/components/questions/PlanReviewPanel.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAA;AAOzB,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAA;AAKvE,MAAM,MAAM,oBAAoB,GAAG;IACjC,gEAAgE;IAChE,QAAQ,CAAC,QAAQ,EAAE;QACjB,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAA;QACzB,QAAQ,CAAC,MAAM,CAAC,EAAE,MAAM,CAAA;QACxB,QAAQ,CAAC,MAAM,CAAC,EAAE,MAAM,CAAA;QACxB,QAAQ,CAAC,OAAO,CAAC,EAAE,aAAa,CAAC;YAAE,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;YAAC,QAAQ,CAAC,WAAW,CAAC,EAAE,MAAM,CAAA;SAAE,CAAC,CAAA;QAC3F,QAAQ,CAAC,MAAM,CAAC,EAAE;YAAE,QAAQ,CAAC,IAAI,EAAE,aAAa,CAAC;YAAC,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAA;SAAE,CAAA;KAC7E,CAAA;IACD,QAAQ,CAAC,QAAQ,EAAE,CAAC,SAAS,EAAE,iBAAiB,KAAK,IAAI,CAAA;IACzD,iEAAiE;IACjE,QAAQ,CAAC,QAAQ,EAAE,MAAM,IAAI,CAAA;CAC9B,CAAA;AAED,wBAAgB,eAAe,CAAC,EAC9B,QAAQ,EACR,QAAQ,EACR,QAAQ,GACT,EAAE,oBAAoB,GAAG,KAAK,CAAC,SAAS,CAmQxC"}

package/lib/types/components/questions/PlanReviewPanel.js

@@ -168,11 +168,22 @@ export function PlanReviewPanel({ question, onAnswer, onCancel, }) {
         }
     }, { isActive: true });
     const cursorChar = cursor < feedback.length ? feedback[cursor] : ' ';
+    /** Mouse: click a decision row = focus it + submit (same as Enter). */
+    const [hoverIndex, setHoverIndex] = React.useState(-1);
+    const clickOption = (index) => {
+        setFocusIndex(index);
+        submitOption(index);
+    };
+    /** Mouse: click the feedback row to focus it. */
+    const focusFeedbackRow = () => {
+        setFocusIndex(options.length);
+        setError(null);
+    };
     return (_jsxs(Box, { flexDirection: "column", marginTop: 1, paddingLeft: 2, paddingRight: 2, width: "100%", children: [_jsx(Divider, { color: "permission", title: ` ${question.header ?? t('plan-review-fallback-header')} `, padding: 4 }), _jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsx(Text, { bold: true, wrap: "wrap", children: question.question }), question.detail !== undefined && (_jsx(Box, { flexDirection: "column", marginTop: 1, children: _jsx(Markdown, { children: question.detail }) }))] }), _jsxs(Box, { flexDirection: "column", marginTop: 1, children: [options.map((option, index) => {
                         const focused = index === focusIndex;
                         const isApprove = option.label === approveLabel;
-                        return (_jsxs(Box, { flexDirection: "row", marginTop: focused ? 1 : 0, children: [_jsx(Box, { width: 1, flexShrink: 0, children: _jsx(Text, { color: focused ? 'claude' : undefined, bold: focused, children: focused ? POINTER : ' ' }) }), _jsxs(Box, { flexDirection: "column", marginLeft: 1, children: [_jsxs(Text, { bold: focused, color: focused || isApprove ? 'claude' : undefined, wrap: "wrap", children: [index + 1, ". ", option.label] }), option.description !== undefined && (_jsx(Text, { dimColor: true, wrap: "wrap", children: option.description }))] })] }, option.label));
-                    }), _jsxs(Box, { flexDirection: "row", marginTop: inputFocused ? 1 : 0, children: [_jsx(Box, { width: 1, flexShrink: 0, children: _jsx(Text, { color: inputFocused ? 'claude' : undefined, bold: inputFocused, children: inputFocused ? POINTER : ' ' }) }), _jsx(Box, { width: 1, flexShrink: 0, children: _jsx(Text, { color: inputFocused ? 'claude' : 'suggestion', children: PENCIL }) }), _jsx(Box, { flexDirection: "row", marginLeft: 1, children: feedback === '' && !inputFocused ? (_jsx(Text, { ref: caretRef, dimColor: true, children: t('plan-review-feedback-placeholder') })) : (_jsxs(_Fragment, { children: [_jsx(Text, { wrap: "wrap", children: feedback.slice(0, cursor) }), inputFocused
+                        return (_jsxs(Box, { flexDirection: "row", marginTop: focused ? 1 : 0, onClick: () => clickOption(index), onMouseEnter: () => setHoverIndex(index), onMouseLeave: () => setHoverIndex(current => (current === index ? -1 : current)), backgroundColor: hoverIndex === index && !focused ? 'userMessageBackgroundHover' : undefined, children: [_jsx(Box, { width: 1, flexShrink: 0, children: _jsx(Text, { color: focused ? 'claude' : undefined, bold: focused, children: focused ? POINTER : ' ' }) }), _jsxs(Box, { flexDirection: "column", marginLeft: 1, children: [_jsxs(Text, { bold: focused, color: focused || isApprove ? 'claude' : undefined, wrap: "wrap", children: [index + 1, ". ", option.label] }), option.description !== undefined && (_jsx(Text, { dimColor: true, wrap: "wrap", children: option.description }))] })] }, option.label));
+                    }), _jsxs(Box, { flexDirection: "row", marginTop: inputFocused ? 1 : 0, onClick: focusFeedbackRow, onMouseEnter: () => setHoverIndex(options.length), onMouseLeave: () => setHoverIndex(current => (current === options.length ? -1 : current)), backgroundColor: hoverIndex === options.length && !inputFocused ? 'userMessageBackgroundHover' : undefined, children: [_jsx(Box, { width: 1, flexShrink: 0, children: _jsx(Text, { color: inputFocused ? 'claude' : undefined, bold: inputFocused, children: inputFocused ? POINTER : ' ' }) }), _jsx(Box, { width: 1, flexShrink: 0, children: _jsx(Text, { color: inputFocused ? 'claude' : 'suggestion', children: PENCIL }) }), _jsx(Box, { flexDirection: "row", marginLeft: 1, children: feedback === '' && !inputFocused ? (_jsx(Text, { ref: caretRef, dimColor: true, children: t('plan-review-feedback-placeholder') })) : (_jsxs(_Fragment, { children: [_jsx(Text, { wrap: "wrap", children: feedback.slice(0, cursor) }), inputFocused
                                             ? _jsx(Text, { ref: caretRef, inverse: true, children: cursorChar })
                                             : _jsx(Text, { ref: caretRef, color: "suggestion", children: "\u258F" }), _jsx(Text, { wrap: "wrap", children: feedback.slice(inputFocused ? cursor + 1 : cursor) })] })) })] })] }), error !== null && (_jsx(Box, { marginTop: 1, children: _jsx(Text, { color: "error", children: error }) })), _jsx(Box, { marginTop: 1, children: _jsx(Text, { dimColor: true, children: t('plan-review-hint') }) })] }));
 }

package/lib/types/components/sessions/SessionListRow.d.ts

@@ -1,4 +1,5 @@
 import React from 'react';
+import type { ClickEvent } from '../../ink/events/click-event.js';
 import type { SessionSummary } from '../../dsh-adapter/sessions/index.js';
 /**
  * One session in the browser's list: a title line and a metadata line.
@@ -13,7 +14,7 @@ import type { SessionSummary } from '../../dsh-adapter/sessions/index.js';
  * stay exactly two lines at every terminal width, and a row that wraps
  * destroys the alignment that lets the eye scan a list at all.
  */
-export declare function SessionListRow({ session, width, depth, focused, now, }: {
+export declare function SessionListRow({ session, width, depth, focused, now, onClick, }: {
     session: SessionSummary;
     /** Columns available to the row, indentation included. */
     width: number;
@@ -22,5 +23,7 @@ export declare function SessionListRow({ session, width, depth, focused, now, }:
     focused: boolean;
     /** Epoch ms used for every relative time in this render pass. */
     now: number;
+    /** 鼠标点击行（fullscreen）：恢复该会话（与 Enter 同路径）。 */
+    onClick?(event: ClickEvent): void;
 }): React.ReactNode;
 //# sourceMappingURL=SessionListRow.d.ts.map

package/lib/types/components/sessions/SessionListRow.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SessionListRow.d.ts","sourceRoot":"","sources":["../../../../src/components/sessions/SessionListRow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAUzB,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,qCAAqC,CAAA;AAEzE;;;;;;;;;;;;GAYG;AACH,wBAAgB,cAAc,CAAC,EAC7B,OAAO,EACP,KAAK,EACL,KAAK,EACL,OAAO,EACP,GAAG,GACJ,EAAE;IACD,OAAO,EAAE,cAAc,CAAA;IACvB,0DAA0D;IAC1D,KAAK,EAAE,MAAM,CAAA;IACb,oEAAoE;IACpE,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,EAAE,OAAO,CAAA;IAChB,iEAAiE;IACjE,GAAG,EAAE,MAAM,CAAA;CACZ,GAAG,KAAK,CAAC,SAAS,CAoClB"}
+{"version":3,"file":"SessionListRow.d.ts","sourceRoot":"","sources":["../../../../src/components/sessions/SessionListRow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAA;AAGvC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iCAAiC,CAAA;AAQjE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,qCAAqC,CAAA;AAEzE;;;;;;;;;;;;GAYG;AACH,wBAAgB,cAAc,CAAC,EAC7B,OAAO,EACP,KAAK,EACL,KAAK,EACL,OAAO,EACP,GAAG,EACH,OAAO,GACR,EAAE;IACD,OAAO,EAAE,cAAc,CAAA;IACvB,0DAA0D;IAC1D,KAAK,EAAE,MAAM,CAAA;IACb,oEAAoE;IACpE,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,EAAE,OAAO,CAAA;IAChB,iEAAiE;IACjE,GAAG,EAAE,MAAM,CAAA;IACX,4CAA4C;IAC5C,OAAO,CAAC,CAAC,KAAK,EAAE,UAAU,GAAG,IAAI,CAAA;CAClC,GAAG,KAAK,CAAC,SAAS,CA4ClB"}

package/lib/types/components/sessions/SessionListRow.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 { formatBytes, formatWhen, kindMark, titleColor, truncateWidth, } from '../../sessions/format.js';
@@ -15,11 +16,12 @@ import { formatBytes, formatWhen, kindMark, titleColor, truncateWidth, } from '.
  * stay exactly two lines at every terminal width, and a row that wraps
  * destroys the alignment that lets the eye scan a list at all.
  */
-export function SessionListRow({ session, width, depth, focused, now, }) {
+export function SessionListRow({ session, width, depth, focused, now, onClick, }) {
     const indent = depth * 2;
     // Two cells for the focus marker, plus the indent for a nested run.
     const body = Math.max(8, width - 2 - indent);
     const mark = kindMark(session.kind);
+    const [hovered, setHovered] = useState(false);
     const facts = [formatWhen(session.updatedAt, now)];
     if (session.branch !== undefined)
         facts.push(session.branch);
@@ -31,5 +33,5 @@ export function SessionListRow({ session, width, depth, focused, now, }) {
     if (session.childCount > 0 && depth === 0) {
         facts.push(t('session-children', { n: session.childCount }));
     }
-    return (_jsxs(Box, { flexDirection: "column", flexShrink: 0, children: [_jsxs(Box, { children: [_jsx(Text, { color: focused ? 'suggestion' : 'subtle', children: `${' '.repeat(indent)}${focused ? '❯ ' : '  '}` }), mark !== undefined && _jsx(Text, { color: mark.color, children: `${mark.glyph} ` }), _jsx(Text, { color: titleColor(session.title.source, focused), bold: focused, children: truncateWidth(session.label ?? session.title.text, body - (mark === undefined ? 0 : 2)) })] }), _jsx(Box, { children: _jsx(Text, { dimColor: true, children: `${' '.repeat(indent + 2)}${truncateWidth(facts.join(' · '), body)}` }) })] }));
+    return (_jsxs(Box, { flexDirection: "column", flexShrink: 0, onClick: onClick, onMouseEnter: onClick !== undefined ? () => setHovered(true) : undefined, onMouseLeave: onClick !== undefined ? () => setHovered(false) : undefined, backgroundColor: hovered && !focused ? 'userMessageBackgroundHover' : undefined, children: [_jsxs(Box, { children: [_jsx(Text, { color: focused ? 'suggestion' : 'subtle', children: `${' '.repeat(indent)}${focused ? '❯ ' : '  '}` }), mark !== undefined && _jsx(Text, { color: mark.color, children: `${mark.glyph} ` }), _jsx(Text, { color: titleColor(session.title.source, focused), bold: focused, children: truncateWidth(session.label ?? session.title.text, body - (mark === undefined ? 0 : 2)) })] }), _jsx(Box, { children: _jsx(Text, { dimColor: true, children: `${' '.repeat(indent + 2)}${truncateWidth(facts.join(' · '), body)}` }) })] }));
 }

package/lib/types/components/trajectory/HotspotView.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 import type { HotspotRow, HotspotSort, TrajAggregate } from '../../dsh-adapter/types.js';
 /** Flatten the three sections into the single list the cursor walks. */
 export declare function hotspotRows(agg: TrajAggregate): HotspotRow[];
-export declare function HotspotView({ agg, sort, width, height, cursor, tick, switchTick, }: {
+export declare function HotspotView({ agg, sort, width, height, cursor, tick, switchTick, onRowClick, }: {
     agg: TrajAggregate;
     sort: HotspotSort;
     width: number;
@@ -10,5 +10,11 @@ export declare function HotspotView({ agg, sort, width, height, cursor, tick, sw
     cursor: number;
     tick: number;
     switchTick: number;
+    /**
+     * Mouse pick (fullscreen): reports the clicked row's cursor index — the
+     * scene jumps back to the timeline positioned on the group's first member
+     * (same path as the keyboard Enter). Hover shows a dim `▸` pointer.
+     */
+    onRowClick?: (cursorIndex: number) => void;
 }): React.ReactNode;
 //# sourceMappingURL=HotspotView.d.ts.map

package/lib/types/components/trajectory/HotspotView.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"HotspotView.d.ts","sourceRoot":"","sources":["../../../../src/components/trajectory/HotspotView.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAMzB,OAAO,KAAK,EAAE,UAAU,EAAE,WAAW,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAA;AA6CxF,wEAAwE;AACxE,wBAAgB,WAAW,CAAC,GAAG,EAAE,aAAa,GAAG,UAAU,EAAE,CAE5D;AAOD,wBAAgB,WAAW,CAAC,EAC1B,GAAG,EACH,IAAI,EACJ,KAAK,EACL,MAAM,EACN,MAAM,EACN,IAAI,EACJ,UAAU,GACX,EAAE;IACD,GAAG,EAAE,aAAa,CAAA;IAClB,IAAI,EAAE,WAAW,CAAA;IACjB,KAAK,EAAE,MAAM,CAAA;IACb,MAAM,EAAE,MAAM,CAAA;IACd,MAAM,EAAE,MAAM,CAAA;IACd,IAAI,EAAE,MAAM,CAAA;IACZ,UAAU,EAAE,MAAM,CAAA;CACnB,GAAG,KAAK,CAAC,SAAS,CA4ElB"}
+{"version":3,"file":"HotspotView.d.ts","sourceRoot":"","sources":["../../../../src/components/trajectory/HotspotView.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAMzB,OAAO,KAAK,EAAE,UAAU,EAAE,WAAW,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAA;AA6CxF,wEAAwE;AACxE,wBAAgB,WAAW,CAAC,GAAG,EAAE,aAAa,GAAG,UAAU,EAAE,CAE5D;AAOD,wBAAgB,WAAW,CAAC,EAC1B,GAAG,EACH,IAAI,EACJ,KAAK,EACL,MAAM,EACN,MAAM,EACN,IAAI,EACJ,UAAU,EACV,UAAU,GACX,EAAE;IACD,GAAG,EAAE,aAAa,CAAA;IAClB,IAAI,EAAE,WAAW,CAAA;IACjB,KAAK,EAAE,MAAM,CAAA;IACb,MAAM,EAAE,MAAM,CAAA;IACd,MAAM,EAAE,MAAM,CAAA;IACd,IAAI,EAAE,MAAM,CAAA;IACZ,UAAU,EAAE,MAAM,CAAA;IAClB;;;;OAIG;IACH,UAAU,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAA;CAC3C,GAAG,KAAK,CAAC,SAAS,CA6FlB"}

package/lib/types/components/trajectory/HotspotView.js

@@ -1,4 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
 import { Box, Text, useTheme } from '../../ui.js';
 import { getTheme } from '../../theme.js';
 import { formatDuration, formatTokens, truncateWidth } from '../../trajectory/format.js';
@@ -40,9 +41,10 @@ export function hotspotRows(agg) {
 function valueOf(row, sort) {
     return sort === 'count' ? row.count : sort === 'tokens' ? row.tokens : row.totalMs;
 }
-export function HotspotView({ agg, sort, width, height, cursor, tick, switchTick, }) {
+export function HotspotView({ agg, sort, width, height, cursor, tick, switchTick, onRowClick, }) {
     const [themeName] = useTheme();
     const theme = getTheme(themeName);
+    const [hoverIndex, setHoverIndex] = React.useState(-1);
     const labelWidth = Math.min(18, Math.max(10, Math.floor(width * 0.16)));
     const barWidth = Math.max(6, Math.min(30, width - labelWidth - 34));
     // Build the flat list once, tagging each row with its section's scale.
@@ -72,12 +74,16 @@ export function HotspotView({ agg, sort, width, height, cursor, tick, switchTick
             }
             const { row, max, colorKey } = entry;
             const focused = entry.cursorIndex === cursor;
+            // 鼠标：行点击跳回 timeline 定位；悬停轻指示（dim ▸，不刷背景）
+            const hovered = onRowClick !== undefined && hoverIndex === entry.cursorIndex;
             // Stagger the settle by row so a section reads top-down on switch.
             const dim = reproject(tick - offset, switchTick);
             const base = row.error === true ? theme.error : theme[colorKey];
             const stats = `${row.count}×` +
                 (row.tokens > 0 ? ` · ${formatTokens(row.tokens)}` : '') +
                 (row.count > 0 && row.totalMs > 0 ? ` · ⌀${formatDuration(row.totalMs / row.count)}` : '');
-            return (_jsxs(Box, { flexDirection: "row", width: "100%", height: 1, flexShrink: 0, gap: 1, children: [_jsx(Box, { flexShrink: 0, width: 2, children: _jsx(Text, { color: "suggestion", children: focused ? '▸' : ' ' }) }), _jsx(Box, { flexShrink: 0, width: labelWidth, children: _jsx(Text, { color: focused ? 'suggestion' : row.error === true ? 'error' : undefined, children: truncateWidth(row.label, labelWidth) }) }), _jsx(Box, { flexShrink: 0, width: barWidth, children: _jsx(Text, { color: mix(base, theme.background, dim), children: bar(valueOf(row, sort), max, barWidth) }) }), _jsx(Box, { flexShrink: 0, width: 8, justifyContent: "flex-end", children: _jsx(Text, { bold: true, color: row.error === true ? 'error' : undefined, children: formatDuration(row.totalMs) }) }), _jsx(Box, { flexShrink: 1, overflow: "hidden", children: _jsx(Text, { color: "subtle", children: truncateWidth(stats, Math.max(4, width - labelWidth - barWidth - 16)) }) })] }, `r${entry.cursorIndex}`));
+            return (_jsxs(Box, { flexDirection: "row", width: "100%", height: 1, flexShrink: 0, gap: 1, onClick: onRowClick === undefined ? undefined : () => onRowClick(entry.cursorIndex), onMouseEnter: onRowClick === undefined ? undefined : () => setHoverIndex(entry.cursorIndex), onMouseLeave: onRowClick === undefined
+                    ? undefined
+                    : () => setHoverIndex(previous => (previous === entry.cursorIndex ? -1 : previous)), children: [_jsx(Box, { flexShrink: 0, width: 2, children: _jsx(Text, { color: focused ? 'suggestion' : 'inactive', children: focused || hovered ? '▸' : ' ' }) }), _jsx(Box, { flexShrink: 0, width: labelWidth, children: _jsx(Text, { color: focused ? 'suggestion' : row.error === true ? 'error' : undefined, children: truncateWidth(row.label, labelWidth) }) }), _jsx(Box, { flexShrink: 0, width: barWidth, children: _jsx(Text, { color: mix(base, theme.background, dim), children: bar(valueOf(row, sort), max, barWidth) }) }), _jsx(Box, { flexShrink: 0, width: 8, justifyContent: "flex-end", children: _jsx(Text, { bold: true, color: row.error === true ? 'error' : undefined, children: formatDuration(row.totalMs) }) }), _jsx(Box, { flexShrink: 1, overflow: "hidden", children: _jsx(Text, { color: "subtle", children: truncateWidth(stats, Math.max(4, width - labelWidth - barWidth - 16)) }) })] }, `r${entry.cursorIndex}`));
         }) }));
 }

package/lib/types/components/trajectory/Ledger.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
+import type { ClickEvent } from '../../ink/events/click-event.js';
 import type { TrajNode } from '../../dsh-adapter/types.js';
-export declare function Ledger({ rows, start, height, cursor, width, tick, arrivalTick, arrivalFrom, }: {
+export declare function Ledger({ rows, start, height, cursor, width, tick, arrivalTick, arrivalFrom, onRowClick, }: {
     /** The (possibly filtered) ledger. */
     rows: readonly TrajNode[];
     /** Index of the first visible row. */
@@ -16,5 +17,12 @@ export declare function Ledger({ rows, start, height, cursor, width, tick, arriv
     arrivalTick: number;
     /** Rows at or after this index are the ones that just arrived. */
     arrivalFrom: number;
+    /**
+     * Mouse pick (fullscreen): reports the clicked row's absolute index — the
+     * scene jumps the cursor to it (same semantics as the keyboard jumps).
+     * Hover on a non-focused row shows a dim `▸` pointer — light indication,
+     * no background wash (the ledger is content, not a menu).
+     */
+    onRowClick?: (index: number, event: ClickEvent) => void;
 }): React.ReactNode;
 //# sourceMappingURL=Ledger.d.ts.map

package/lib/types/components/trajectory/Ledger.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Ledger.d.ts","sourceRoot":"","sources":["../../../../src/components/trajectory/Ledger.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAiBzB,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,4BAA4B,CAAA;AA6C1D,wBAAgB,MAAM,CAAC,EACrB,IAAI,EACJ,KAAK,EACL,MAAM,EACN,MAAM,EACN,KAAK,EACL,IAAI,EACJ,WAAW,EACX,WAAW,GACZ,EAAE;IACD,sCAAsC;IACtC,IAAI,EAAE,SAAS,QAAQ,EAAE,CAAA;IACzB,sCAAsC;IACtC,KAAK,EAAE,MAAM,CAAA;IACb,yBAAyB;IACzB,MAAM,EAAE,MAAM,CAAA;IACd,qCAAqC;IACrC,MAAM,EAAE,MAAM,CAAA;IACd,+BAA+B;IAC/B,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,MAAM,CAAA;IACZ,kDAAkD;IAClD,WAAW,EAAE,MAAM,CAAA;IACnB,kEAAkE;IAClE,WAAW,EAAE,MAAM,CAAA;CACpB,GAAG,KAAK,CAAC,SAAS,CAoJlB"}
+{"version":3,"file":"Ledger.d.ts","sourceRoot":"","sources":["../../../../src/components/trajectory/Ledger.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iCAAiC,CAAA;AAgBjE,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,4BAA4B,CAAA;AA6C1D,wBAAgB,MAAM,CAAC,EACrB,IAAI,EACJ,KAAK,EACL,MAAM,EACN,MAAM,EACN,KAAK,EACL,IAAI,EACJ,WAAW,EACX,WAAW,EACX,UAAU,GACX,EAAE;IACD,sCAAsC;IACtC,IAAI,EAAE,SAAS,QAAQ,EAAE,CAAA;IACzB,sCAAsC;IACtC,KAAK,EAAE,MAAM,CAAA;IACb,yBAAyB;IACzB,MAAM,EAAE,MAAM,CAAA;IACd,qCAAqC;IACrC,MAAM,EAAE,MAAM,CAAA;IACd,+BAA+B;IAC/B,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,MAAM,CAAA;IACZ,kDAAkD;IAClD,WAAW,EAAE,MAAM,CAAA;IACnB,kEAAkE;IAClE,WAAW,EAAE,MAAM,CAAA;IACnB;;;;;OAKG;IACH,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,UAAU,KAAK,IAAI,CAAA;CACxD,GAAG,KAAK,CAAC,SAAS,CAsKlB"}

package/lib/types/components/trajectory/Ledger.js

@@ -1,4 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
 import { Box, Text, useTheme } from '../../ui.js';
 import { burstDurationMs, burstErrors, previewText } from '../../dsh-adapter/trajectory/index.js';
 import { costGlyph, formatDuration, formatClock, heatColor, KIND_BADGE, KIND_BADGE_BG, KIND_FG, KIND_GLYPH, ledgerLayout, } from '../../trajectory/format.js';
@@ -46,9 +47,10 @@ function spineGlyph(rows, index) {
         return SPINE.close;
     return SPINE.mid;
 }
-export function Ledger({ rows, start, height, cursor, width, tick, arrivalTick, arrivalFrom, }) {
+export function Ledger({ rows, start, height, cursor, width, tick, arrivalTick, arrivalFrom, onRowClick, }) {
     const [themeName] = useTheme();
     const theme = getTheme(themeName);
+    const [hoverIndex, setHoverIndex] = React.useState(-1);
     const layout = ledgerLayout(width);
     const visible = rows.slice(start, start + height);
     const arriving = arrive(tick, arrivalTick);
@@ -65,6 +67,22 @@ export function Ledger({ rows, start, height, cursor, width, tick, arrivalTick,
             const running = node.status === 'running';
             const isNew = index >= arrivalFrom && arriving > 0;
             const duration = node.burst === undefined ? node.durationMs : burstDurationMs(node.burst);
+            // 鼠标：行点击跳光标；悬停在非焦点行亮出 dim ▸（轻指示，不刷背景）
+            const hovered = onRowClick !== undefined && hoverIndex === index;
+            const pointer = focused || hovered ? '▸' : ' ';
+            const rowEvents = onRowClick === undefined
+                ? undefined
+                : {
+                    onClick: (event) => {
+                        onRowClick(index, event);
+                    },
+                    onMouseEnter: () => {
+                        setHoverIndex(index);
+                    },
+                    onMouseLeave: () => {
+                        setHoverIndex(previous => (previous === index ? -1 : previous));
+                    },
+                };
             // ── structural rows are RULES, not rows ────────────────────────────
             //
             // A ledger with five hundred entries needs chapters. Turn and step
@@ -82,7 +100,7 @@ export function Ledger({ rows, start, height, cursor, width, tick, arrivalTick,
                 // attention than the work between them. Only the turn, which is the
                 // session's actual chapter break, gets a rule.
                 if (!isTurn) {
-                    return (_jsxs(Box, { flexDirection: "row", width: "100%", height: 1, flexShrink: 0, gap: 1, children: [_jsx(Box, { flexShrink: 0, children: _jsx(Text, { color: "subtle", children: `${focused ? '▸' : ' '}╵` }) }), _jsx(Box, { flexGrow: 1, flexShrink: 1, overflow: "hidden", children: _jsx(Text, { color: focused ? 'suggestion' : 'subtle', wrap: "truncate", children: node.label }) }), _jsx(Box, { flexShrink: 0, children: _jsx(Text, { color: heatColor(duration), children: costGlyph(duration) }) }), _jsx(Box, { flexShrink: 0, justifyContent: "flex-end", width: 7, children: _jsx(Text, { color: heatColor(duration), children: right }) })] }, `${node.seq}:step`));
+                    return (_jsxs(Box, { flexDirection: "row", width: "100%", height: 1, flexShrink: 0, gap: 1, ...rowEvents, children: [_jsx(Box, { flexShrink: 0, children: _jsx(Text, { color: "subtle", children: `${pointer}╵` }) }), _jsx(Box, { flexGrow: 1, flexShrink: 1, overflow: "hidden", children: _jsx(Text, { color: focused ? 'suggestion' : 'subtle', wrap: "truncate", children: node.label }) }), _jsx(Box, { flexShrink: 0, children: _jsx(Text, { color: heatColor(duration), children: costGlyph(duration) }) }), _jsx(Box, { flexShrink: 0, justifyContent: "flex-end", width: 7, children: _jsx(Text, { color: heatColor(duration), children: right }) })] }, `${node.seq}:step`));
                 }
                 const tone = failed ? 'error' : running ? 'success' : 'inactiveShimmer';
                 // Idle before a turn is wall-clock the session spent waiting on the
@@ -92,9 +110,9 @@ export function Ledger({ rows, start, height, cursor, width, tick, arrivalTick,
                 const previous = rows[index - 1];
                 const idle = previous === undefined ? 0 : node.time - (previous.time + (previous.durationMs ?? 0));
                 const idleText = idle >= IDLE_FLOOR_MS ? `  ⋯ ${formatDuration(idle)}` : '';
-                const head = `${focused ? '▸' : ' '}━━ ${node.label}${idleText} `;
+                const head = `${pointer}━━ ${node.label}${idleText} `;
                 const fill = Math.max(2, width - stringWidth(head) - stringWidth(right) - 2);
-                return (_jsx(Box, { width: "100%", height: 1, flexShrink: 0, children: _jsxs(Text, { color: tone, bold: true, children: [`${focused ? '▸' : ' '}━━ ${node.label}`, _jsx(Text, { color: "subtle", children: idleText }), _jsx(Text, { color: "inactive", children: ` ${'━'.repeat(fill)} ` }), _jsx(Text, { color: failed ? 'error' : heatColor(duration), children: right })] }) }, `${node.seq}:turn`));
+                return (_jsx(Box, { width: "100%", height: 1, flexShrink: 0, ...rowEvents, children: _jsxs(Text, { color: tone, bold: true, children: [`${pointer}━━ ${node.label}`, _jsx(Text, { color: "subtle", children: idleText }), _jsx(Text, { color: "inactive", children: ` ${'━'.repeat(fill)} ` }), _jsx(Text, { color: failed ? 'error' : heatColor(duration), children: right })] }) }, `${node.seq}:turn`));
             }
             const spineColor = failed ? 'error' : running ? 'success' : node.seed === true ? 'subtle' : 'inactive';
             const badgeBg = KIND_BADGE_BG[node.kind];
@@ -107,6 +125,6 @@ export function Ledger({ rows, start, height, cursor, width, tick, arrivalTick,
             const outcome = layout.outcome && node.outcome !== undefined && node.outcome !== ''
                 ? previewText(node.outcome, Math.max(8, Math.floor(layout.detail * 0.3)))
                 : '';
-            return (_jsxs(Box, { flexDirection: "row", width: "100%", height: 1, flexShrink: 0, gap: 1, children: [_jsx(Box, { flexShrink: 0, children: _jsxs(Text, { color: spineColor, children: [focused ? '▸' : ' ', spineGlyph(rows, index)] }) }), layout.index && (_jsx(Box, { flexShrink: 0, width: 8, children: _jsx(Text, { color: "subtle", children: formatClock(node.time) }) })), _jsx(Box, { flexShrink: 0, children: _jsx(Text, { color: isNew ? mix(theme[KIND_FG[node.kind]], theme.text, arriving) : KIND_FG[node.kind], backgroundColor: badgeBg, bold: true, children: badge }) }), _jsx(Box, { flexGrow: 1, flexShrink: 1, overflow: "hidden", children: _jsxs(Text, { wrap: "truncate", color: focused ? 'suggestion' : node.seed === true ? 'subtle' : undefined, children: [label, detail === '' ? '' : ' ', _jsx(Text, { color: focused ? 'suggestion' : 'inactive', children: detail }), outcome === '' ? '' : _jsx(Text, { color: "subtle", children: `  → ${outcome}` })] }) }), _jsx(Box, { flexShrink: 0, children: _jsx(Text, { color: running ? 'success' : heatColor(duration), children: costGlyph(duration) }) }), _jsx(Box, { flexShrink: 0, justifyContent: "flex-end", width: 7, children: _jsx(Text, { color: running ? 'success' : heatColor(duration), children: running ? '…' : duration === undefined ? '' : formatDuration(duration) }) })] }, `${node.seq}:${node.kind}`));
+            return (_jsxs(Box, { flexDirection: "row", width: "100%", height: 1, flexShrink: 0, gap: 1, ...rowEvents, children: [_jsx(Box, { flexShrink: 0, children: _jsxs(Text, { color: spineColor, children: [pointer, spineGlyph(rows, index)] }) }), layout.index && (_jsx(Box, { flexShrink: 0, width: 8, children: _jsx(Text, { color: "subtle", children: formatClock(node.time) }) })), _jsx(Box, { flexShrink: 0, children: _jsx(Text, { color: isNew ? mix(theme[KIND_FG[node.kind]], theme.text, arriving) : KIND_FG[node.kind], backgroundColor: badgeBg, bold: true, children: badge }) }), _jsx(Box, { flexGrow: 1, flexShrink: 1, overflow: "hidden", children: _jsxs(Text, { wrap: "truncate", color: focused ? 'suggestion' : node.seed === true ? 'subtle' : undefined, children: [label, detail === '' ? '' : ' ', _jsx(Text, { color: focused ? 'suggestion' : 'inactive', children: detail }), outcome === '' ? '' : _jsx(Text, { color: "subtle", children: `  → ${outcome}` })] }) }), _jsx(Box, { flexShrink: 0, children: _jsx(Text, { color: running ? 'success' : heatColor(duration), children: costGlyph(duration) }) }), _jsx(Box, { flexShrink: 0, justifyContent: "flex-end", width: 7, children: _jsx(Text, { color: running ? 'success' : heatColor(duration), children: running ? '…' : duration === undefined ? '' : formatDuration(duration) }) })] }, `${node.seq}:${node.kind}`));
         }) }));
 }

package/lib/types/components/trajectory/WaveBand.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
+import type { ClickEvent } from '../../ink/events/click-event.js';
 import type { WaveBand as Band } from '../../dsh-adapter/types.js';
-export declare function WaveBand({ band, width, cursorColumn, viewportStart, viewportEnd, matches, tick, alertTick, }: {
+export declare function WaveBand({ band, width, cursorColumn, viewportStart, viewportEnd, matches, tick, alertTick, onColumnClick, }: {
     band: Band;
     /** Rendered width in cells; equals `band.buckets.length`. */
     width: number;
@@ -19,6 +20,14 @@ export declare function WaveBand({ band, width, cursorColumn, viewportStart, vie
     tick: number;
     /** Tick the most recent alert was triggered on. */
     alertTick: number;
+    /**
+     * Mouse pick (fullscreen): reports the clicked column (0-based within the
+     * band; the ruler row counts too — its ▐▌ bracket is the seek affordance).
+     * The scene jumps to that column's nearest event via bucket.firstIndex,
+     * which empty columns inherit from their predecessor for exactly this
+     * purpose. No hover: column density makes per-cell indication noise.
+     */
+    onColumnClick?: (column: number, event: ClickEvent) => void;
 }): React.ReactNode;
 /**
  * Convert a theme colour to the `#rrggbb` form chalk needs.

package/lib/types/components/trajectory/WaveBand.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"WaveBand.d.ts","sourceRoot":"","sources":["../../../../src/components/trajectory/WaveBand.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAMzB,OAAO,KAAK,EAAE,QAAQ,IAAI,IAAI,EAAe,MAAM,4BAA4B,CAAA;AAmD/E,wBAAgB,QAAQ,CAAC,EACvB,IAAI,EACJ,KAAK,EACL,YAAY,EACZ,aAAa,EACb,WAAW,EACX,OAAO,EACP,IAAI,EACJ,SAAS,GACV,EAAE;IACD,IAAI,EAAE,IAAI,CAAA;IACV,6DAA6D;IAC7D,KAAK,EAAE,MAAM,CAAA;IACb,kDAAkD;IAClD,YAAY,EAAE,MAAM,CAAA;IACpB,kEAAkE;IAClE,aAAa,EAAE,MAAM,CAAA;IACrB,WAAW,EAAE,MAAM,CAAA;IACnB;;;;OAIG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAA;IAC7B,wBAAwB;IACxB,IAAI,EAAE,MAAM,CAAA;IACZ,mDAAmD;IACnD,SAAS,EAAE,MAAM,CAAA;CAClB,GAAG,KAAK,CAAC,SAAS,CAgGlB;AAED;;;;;;GAMG;AACH,iBAAS,KAAK,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAMrC;AAED,6EAA6E;AAC7E,OAAO,EAAE,KAAK,IAAI,OAAO,EAAE,CAAA"}
+{"version":3,"file":"WaveBand.d.ts","sourceRoot":"","sources":["../../../../src/components/trajectory/WaveBand.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iCAAiC,CAAA;AAIjE,OAAO,KAAK,EAAE,QAAQ,IAAI,IAAI,EAAe,MAAM,4BAA4B,CAAA;AAmD/E,wBAAgB,QAAQ,CAAC,EACvB,IAAI,EACJ,KAAK,EACL,YAAY,EACZ,aAAa,EACb,WAAW,EACX,OAAO,EACP,IAAI,EACJ,SAAS,EACT,aAAa,GACd,EAAE;IACD,IAAI,EAAE,IAAI,CAAA;IACV,6DAA6D;IAC7D,KAAK,EAAE,MAAM,CAAA;IACb,kDAAkD;IAClD,YAAY,EAAE,MAAM,CAAA;IACpB,kEAAkE;IAClE,aAAa,EAAE,MAAM,CAAA;IACrB,WAAW,EAAE,MAAM,CAAA;IACnB;;;;OAIG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAA;IAC7B,wBAAwB;IACxB,IAAI,EAAE,MAAM,CAAA;IACZ,mDAAmD;IACnD,SAAS,EAAE,MAAM,CAAA;IACjB;;;;;;OAMG;IACH,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,UAAU,KAAK,IAAI,CAAA;CAC5D,GAAG,KAAK,CAAC,SAAS,CA2GlB;AAED;;;;;;GAMG;AACH,iBAAS,KAAK,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAMrC;AAED,6EAA6E;AAC7E,OAAO,EAAE,KAAK,IAAI,OAAO,EAAE,CAAA"}

package/lib/types/components/trajectory/WaveBand.js

@@ -50,7 +50,7 @@ function channelColor(channel, theme) {
         default: return theme.subtle;
     }
 }
-export function WaveBand({ band, width, cursorColumn, viewportStart, viewportEnd, matches, tick, alertTick, }) {
+export function WaveBand({ band, width, cursorColumn, viewportStart, viewportEnd, matches, tick, alertTick, onColumnClick, }) {
     const [themeName] = useTheme();
     const theme = getTheme(themeName);
     if (band.buckets.length === 0) {
@@ -123,7 +123,12 @@ export function WaveBand({ band, width, cursorColumn, viewportStart, viewportEnd
             ? chalk.hex(toHex(theme.permission))(glyph)
             : chalk.hex(toHex(theme.subtle))(glyph);
     }
-    return (_jsxs(Box, { flexDirection: "column", flexShrink: 0, children: [_jsx(Text, { children: wave }), _jsx(Text, { children: rulerText })] }));
+    return (_jsxs(Box, { flexDirection: "column", flexShrink: 0, onClick: onColumnClick === undefined
+            ? undefined
+            : (event) => {
+                const column = Math.max(0, Math.min(band.buckets.length - 1, event.localCol));
+                onColumnClick(column, event);
+            }, children: [_jsx(Text, { children: wave }), _jsx(Text, { children: rulerText })] }));
 }
 /**
  * Convert a theme colour to the `#rrggbb` form chalk needs.

package/lib/types/dsh-adapter/channel.d.ts

@@ -8,7 +8,7 @@ import { type PreviewEntry, type SessionSummary } from './sessions/index.js';
 import { type FileCandidate } from '../utils/fileSuggestions.js';
 import type { ProviderSetupHost } from './providerWizard.js';
 import { type SessionModeSpec } from '../sessionModes.js';
-import { type StatusBarConfig, type ToolBackground } from '../tuiDisplayPrefs.js';
+import { type ScrollGutterMode, type StatusBarConfig, type ToolBackground } from '../tuiDisplayPrefs.js';
 import { type SubagentState } from './subagents.js';
 export type { SubagentState } from './subagents.js';
 import type { SpinnerMode } from '../components/Spinner/spinnerMode.js';
@@ -376,6 +376,10 @@ export interface Channel {
     readonly thinkingFold: 'preview' | 'full';
     /** Live tool-card background treatment. */
     readonly toolBackground: ToolBackground;
+    /** What the fullscreen transcript's right gutter shows (settings
+     *  `dsh-tui.scrollGutter`: turn timeline / proportional scrollbar /
+     *  nothing). */
+    readonly scrollGutter: ScrollGutterMode;
     /** Live status-footer visibility and compactness preferences. */
     readonly statusBar: Readonly<StatusBarConfig>;
     /** Whether the header's pixel whale art shows (settings `dsh-tui.whale`). */
@@ -390,10 +394,11 @@ export interface Channel {
     readonly contextBarEnabled: boolean;
     /**
      * Current same-session goal projection, when a goal exists. Derived live
-     * from the durable `goal/change` context events (round-zero goal-sourced
-     * user messages) in the session log — every goal mutation appends one, so
-     * this snapshot tracks create/edit/pause/resume/complete/block/clear in
-     * real time and replays correctly on resume/rewind.
+     * from the durable goal events in the session log — top-level
+     * `goal/change` snapshots (every goal mutation appends one) plus the
+     * goal-sourced continuation rounds that advance the counter — so this
+     * snapshot tracks create/edit/pause/resume/complete/block/clear in real
+     * time and replays correctly on resume/rewind.
      */
     readonly goal: ChannelGoal | undefined;
     /**
@@ -740,6 +745,8 @@ export interface ChannelState {
     thinkingFold: 'preview' | 'full';
     /** Tool-card background treatment (see the public Channel type). */
     toolBackground: ToolBackground;
+    /** Transcript gutter mode (see the public Channel type). */
+    scrollGutter: ScrollGutterMode;
     /** Status-footer preferences (see the public Channel type). */
     statusBar: StatusBarConfig;
     /** Apply a diff-layout change (see the public Channel type). */
@@ -748,6 +755,8 @@ export interface ChannelState {
     setThinkingFold(mode: 'preview' | 'full'): void;
     /** Apply a tool-card background change. */
     setToolBackground(background: ToolBackground): void;
+    /** Apply a transcript gutter mode change. */
+    setScrollGutter(mode: ScrollGutterMode): void;
     /** Apply status-footer preference changes. */
     setStatusBar(config: Partial<StatusBarConfig>): void;
     /** Whale header art switch (see the public Channel type). */
@@ -942,6 +951,8 @@ export declare function createChannel(ctx: Context, initialAgent: Agent, options
     thinkingFold?: 'preview' | 'full';
     /** Tool-card background treatment; default `none`. */
     toolBackground?: ToolBackground;
+    /** Transcript gutter mode; default `timeline` (settings `dsh-tui.scrollGutter`). */
+    scrollGutter?: ScrollGutterMode;
     /** Status-footer field visibility and compactness. */
     statusBar?: Partial<StatusBarConfig>;
     /** Show the header's pixel whale art; default on. */