@askdkc/dsh-cli 0.11.3

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

@@ -0,0 +1,517 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import React from 'react';
+import { extname } from 'node:path';
+import { Box, Text, useTerminalSize } from '../../ui.js';
+import { stringWidth } from '../../ink/stringWidth.js';
+import { useAnimationFrame } from '../../ink/hooks/use-animation-frame.js';
+import { ToolUseLoader } from '../ToolUseLoader.js';
+import { SplitDiffView } from '../SplitDiffView.js';
+import { SyntaxText } from '../SyntaxText.js';
+import { useTooltip } from '../Tooltip.js';
+import { formatDuration } from '../../terminal-utils/format.js';
+import { formatClock } from '../../trajectory/format.js';
+import { foldLongLines } from '../../utils/fold-long-lines.js';
+import { getLang, t } from '../../i18n.js';
+import { revealLinesOf, snapReveal } from '../smoothReveal.js';
+import { useRevealVersion } from '../../hooks/useRevealVersion.js';
+/** Tool display names localize through the `tool-name-*` dictionary family
+ *  (i18n.ts): DSH emits lowercase tool ids (`bash`), display names resolve
+ *  per language — proper nouns (Bash, PowerShell) stay identical in zh.
+ *  Unmapped ids (plugins, new upstream tools) fall back to the id with its
+ *  first letter uppercased: that is a name, not copy — there is nothing to
+ *  translate. Keys appear as literals here, so verify-i18n's dead-key scan
+ *  sees them without a DYNAMIC_PREFIXES entry. */
+const TOOL_NAME_KEYS = {
+    bash: 'tool-name-bash',
+    powershell: 'tool-name-powershell',
+    read: 'tool-name-read',
+    glob: 'tool-name-glob',
+    grep: 'tool-name-grep',
+    write: 'tool-name-write',
+    edit: 'tool-name-edit',
+    todo_write: 'tool-name-todo_write',
+    subagent: 'tool-name-subagent',
+    web_search: 'tool-name-web_search',
+};
+function displayName(name) {
+    const key = TOOL_NAME_KEYS[name];
+    if (key !== undefined)
+        return t(key);
+    if (name.length === 0)
+        return name;
+    return name[0].toUpperCase() + name.slice(1);
+}
+function parseJsonArgs(args) {
+    try {
+        return JSON.parse(args);
+    }
+    catch {
+        return undefined;
+    }
+}
+function jsonArgsLanguage(args) {
+    return parseJsonArgs(args) === undefined ? undefined : 'json';
+}
+function filePathFromTool(tool, view) {
+    if (view !== undefined && 'path' in view && typeof view.path === 'string')
+        return view.path;
+    const parsed = parseJsonArgs(tool.argsFull ?? tool.argsText);
+    if (parsed !== null && typeof parsed === 'object') {
+        const record = parsed;
+        for (const key of ['file_path', 'path'])
+            if (typeof record[key] === 'string')
+                return record[key];
+    }
+    return undefined;
+}
+function languageFromPath(path) {
+    const language = path === undefined ? undefined : extname(path).slice(1).toLowerCase();
+    return language === '' ? undefined : language;
+}
+/** The collapsed text body keeps three lines. */
+const TEXT_BODY_MAX_LINES = 3;
+/** Diff bodies cap at the upstream chat row's 8 (dsh-client-ui-tool's
+ *  CHAT_DIFF_MAX_LINES) — denser information than log output. */
+const DIFF_BODY_MAX_LINES = 8;
+/** Minimum terminal width for the two-pane diff: below this the panes
+ *  would squeeze under ~50 columns each and the unified view reads better. */
+const SPLIT_DIFF_MIN_COLS = 110;
+const GUTTER_FIRST = ' ⎿ ';
+const GUTTER_REST = '   ';
+const add = (text) => ({ text, tone: 'add' });
+const del = (text) => ({ text, tone: 'del' });
+const dim = (text) => ({ text, tone: 'dim' });
+const plain = (text) => ({ text, tone: 'plain' });
+/** Tool-name color by category (mist-blue accents): read/search tools keep
+ *  the brand blue, file-mutating tools get the warm gold accent, exec /
+ *  terminal tools get mist cyan. Exported for the subagent card, which
+ *  mirrors the transcript tool-card name styling. */
+const TOOL_NAME_MUTATE = new Set(['edit', 'write', 'multiedit', 'notebookedit']);
+const TOOL_NAME_EXEC = new Set(['bash', 'bashpersistent', 'sh', 'shell', 'terminal']);
+export function toolNameColor(raw) {
+    const n = raw.toLowerCase();
+    if (TOOL_NAME_MUTATE.has(n))
+        return 'toolNameMutate';
+    if (TOOL_NAME_EXEC.has(n))
+        return 'toolNameExec';
+    return 'accent';
+}
+/** One side's text → display lines (upstream contentLines rule: empty text
+ *  is zero lines; a single trailing newline is a terminator, not a line;
+ *  interior blanks survive). */
+function sideLines(text) {
+    if (text === '')
+        return [];
+    const lines = text.split('\n');
+    if (lines[lines.length - 1] === '')
+        lines.pop();
+    return lines;
+}
+/** Diff hunks → add/del rows. The header already carries the path for the
+ *  common single-hunk case; with several hunks a path row separates files
+ *  and `⋯` separates scattered hunks of one file (upstream DiffBlock). */
+function diffLines(diffs) {
+    const out = [];
+    let prevPath;
+    for (const diff of diffs) {
+        if (diffs.length > 1) {
+            if (diff.path !== prevPath)
+                out.push({ text: diff.path, tone: 'path' });
+            else
+                out.push(dim('⋯'));
+        }
+        prevPath = diff.path;
+        if (diff.oldText !== null) {
+            for (const line of sideLines(diff.oldText))
+                out.push(del(`- ${line}`));
+        }
+        for (const line of sideLines(diff.newText))
+            out.push(add(`+ ${line}`));
+    }
+    return out;
+}
+/** Join the text blocks of a view's content payload (read/generic cards). */
+function contentLines(content) {
+    const text = (content ?? []).map(block => (block.type === 'text' ? block.text ?? '' : '')).join('').trimEnd();
+    if (text === '')
+        return [];
+    return text.split('\n').map(plain);
+}
+/** Per-card body lines; unknown/absent shapes yield [] so the caller falls
+ *  back to the raw result text. */
+function viewLines(view) {
+    switch (view.card) {
+        case 'diff':
+            return diffLines(view.diffs);
+        case 'terminal': {
+            // The call-side terminal card has no output yet; only presentResult's
+            // does. `in` narrows the call/result union without extra types.
+            const out = (('output' in view ? view.output : undefined) ?? '').trimEnd();
+            const lines = out === '' ? [] : out.split('\n').map(plain);
+            if ('exitCode' in view && view.exitCode !== undefined && view.exitCode !== 0) {
+                lines.push({ text: t('tool-exit-code', { code: view.exitCode }), tone: 'error' });
+            }
+            if ('signal' in view && view.signal !== undefined) {
+                lines.push({ text: t('tool-killed-signal', { name: String(view.signal) }), tone: 'error' });
+            }
+            return lines;
+        }
+        case 'read':
+            return contentLines('content' in view ? view.content : undefined);
+        case 'generic':
+            return contentLines('content' in view ? view.content : undefined);
+        case 'search': {
+            if (view.shape === 'paths') {
+                const lines = view.paths.map(plain);
+                if (view.truncated)
+                    lines.push(dim(t('search-results-total', { n: view.total })));
+                return lines;
+            }
+            const lines = [];
+            for (const file of view.files) {
+                lines.push(plain(file.path));
+                for (const match of file.matches) {
+                    lines.push(plain(`${match.lineNumber}: ${match.line}`));
+                }
+            }
+            if (view.truncated)
+                lines.push(dim(`… (${view.total} total)`));
+            return lines;
+        }
+        default:
+            return [];
+    }
+}
+/** Collapsed bodies fold past the card's line budget; verbose (Ctrl+O) is
+ *  always uncapped. Mirrors wrapText's "one extra line is shown directly". */
+function capLines(lines, max, verbose) {
+    if (verbose || lines.length <= max)
+        return lines;
+    if (lines.length - max === 1)
+        return lines;
+    return [
+        ...lines.slice(0, max),
+        { ...dim(t('lines-folded-expand', { n: lines.length - max })), revealOnHover: true },
+    ];
+}
+/** Long-line clip for the body rows (utils/fold-long-lines.ts): the line cap
+ *  above bounds how MANY rows a card paints, this bounds how many rows ONE
+ *  row can paint. A `read` of a minified file, a terminal result whose last
+ *  line never broke, or a `write` payload is a single 100k-char line — under
+ *  `wrap="wrap"` the body would lay out thousands of visual rows per frame
+ *  no matter what the line budget says. Identity-preserving (same array, same
+ *  line objects) when every line fits, so the ordinary card allocates
+ *  nothing. */
+function foldBodyLines(lines) {
+    let out;
+    for (let index = 0; index < lines.length; index++) {
+        const line = lines[index];
+        const folded = foldLongLines(line.text);
+        if (folded.hiddenChars === 0) {
+            out?.push(line);
+            continue;
+        }
+        out ??= lines.slice(0, index);
+        out.push({ ...line, text: folded.text });
+    }
+    return out ?? lines;
+}
+/** Header title from the presentation view: terminal cards keep the
+ *  `Name(command)` shape; everything else renders the tool's own title
+ *  (`Edit /path`, `Read /path (1 - 100)`) with the first word bold. The
+ *  result view's title replaces the call view's only when present — a
+ *  settled terminal card carries output but no title of its own. */
+/** Header args display budget: the parenthesized summary is a pointer, not
+ * the payload — full args live in the verbose/expanded body. A streaming
+ * tool call's args can grow to hundreds of KB, and wrapping that in the
+ * header Text every frame was the dominant long-output stall (string-width
+ * via wrap-ansi, 60%+ of CPU in profiles). */
+const HEADER_ARGS_BUDGET = 480;
+function clipHeaderArgs(args) {
+    if (args.length <= HEADER_ARGS_BUDGET)
+        return args;
+    return `${args.slice(0, HEADER_ARGS_BUDGET)}…`;
+}
+/** Fold a multi-line terminal command title to its first SOURCE line.
+ *  Counts '\n' separators in place instead of materializing a line array —
+ *  running cards re-render every second and a streamed command can reach
+ *  hundreds of KB, and the exact cost the HEADER_ARGS_BUDGET comment above
+ *  keeps out of the header must not sneak back in through folding. (Lone-\r
+ *  titles are not a thing presentCall produces; CRLF is normalized on the
+ *  first line only.)
+ *
+ *  Two independent folds:
+ *   - `foldLines` (the `dsh-tui.foldTerminalCommand` setting): a multi-line
+ *     script collapses to its first source line, reported as `+N lines`.
+ *   - The long-line clip (always on — utils/fold-long-lines.ts): a command is
+ *     frequently ONE enormous line (`python -c …`, a minified blob, a pasted
+ *     `curl` body). This header Text WRAPS, so an unclipped 200k-char command
+ *     lays out thousands of rows on the card header itself — the same stall
+ *     HEADER_ARGS_BUDGET keeps out of the args half of the line.
+ *
+ *  Single short titles return undefined: nothing to fold, rendering stays
+ *  byte-identical to the unfolded card (and the header stays tooltip-silent). */
+function foldTerminalTitle(title, foldLines) {
+    const firstEnd = title.indexOf('\n');
+    let hiddenLines = 0;
+    let body = title;
+    if (firstEnd !== -1 && foldLines) {
+        let separators = 1;
+        for (let at = title.indexOf('\n', firstEnd + 1); at !== -1; at = title.indexOf('\n', at + 1))
+            separators++;
+        // Same trailing-newline rule as sideLines: a terminator is not a line.
+        hiddenLines = separators - (title.endsWith('\n') ? 1 : 0);
+        body = title.slice(0, title.charCodeAt(firstEnd - 1) === 13 ? firstEnd - 1 : firstEnd);
+    }
+    const clipped = foldLongLines(body);
+    if (hiddenLines <= 0 && clipped.hiddenChars === 0)
+        return undefined;
+    return { first: clipped.text, hiddenLines: Math.max(0, hiddenLines), hiddenChars: clipped.hiddenChars };
+}
+/** Addendum line appended to the header hover tooltip when the header hides
+ *  content (folded script / clipped args / width-truncated title): start or
+ *  finish wall-clock and the terminal result's exit code / signal —
+ *  everything the header's relative `· 2m` chip and the body's
+ *  `Running… (…)` line do NOT say. Durations stay out on purpose: showing
+ *  a value twice, once on the card and once in the float, is exactly the
+ *  noise class this tooltip exists to avoid. A fully visible header pops
+ *  NOTHING (meta included) — a float that repeats or annotates content
+ *  already on screen is noise, not detail. Returns '' when the row carries
+ *  no timing data. */
+function toolCardMetaTooltip(tool, isRunning, isError) {
+    const parts = [];
+    const startedAt = tool.startedAt;
+    if (isRunning) {
+        if (startedAt !== undefined)
+            parts.push(t('tool-tip-started', { time: formatClock(startedAt) }));
+    }
+    else {
+        const durationMs = tool.durationMs;
+        if (startedAt !== undefined && durationMs !== undefined) {
+            parts.push(t(isError ? 'tool-tip-failed' : 'tool-tip-finished', { time: formatClock(startedAt + durationMs) }));
+        }
+    }
+    const resultView = tool.resultView;
+    if (resultView !== undefined && resultView.card === 'terminal') {
+        if ('exitCode' in resultView && resultView.exitCode !== undefined && resultView.exitCode !== 0) {
+            parts.push(t('tool-tip-exit', { code: resultView.exitCode }));
+        }
+        if ('signal' in resultView && resultView.signal !== undefined) {
+            parts.push(t('tool-tip-signal', { name: String(resultView.signal) }));
+        }
+    }
+    return parts.join(' · ');
+}
+function HeaderTitle({ name, title, isTerminal, folded, displayArgs, argsLanguage, nameColor, filePath, onOpenFile, metaTooltip, headerTextBudget }) {
+    // Hover tooltip rule: pop ONLY when the header genuinely hides content —
+    // a folded terminal script, args clipped past the 480-char budget, or a
+    // non-terminal one-line title cut by layout width (truncate-end). A header
+    // that fully fits its row stays silent: a float that repeats or annotates
+    // text already visible next to the pointer is noise, not detail. Empty
+    // content is a no-op inside the hook.
+    const headerTooltip = useTooltip(() => {
+        const meta = metaTooltip();
+        const withMeta = (full) => (meta === '' ? full : `${full}\n${meta}`);
+        if (folded !== undefined)
+            return withMeta(title ?? '');
+        if (title === undefined && clipHeaderArgs(displayArgs) !== displayArgs)
+            return withMeta(displayArgs);
+        // Width truncation: only the non-terminal title Text is truncate-end —
+        // a long one-line title is really cut by layout when it overflows the
+        // row. Terminal titles WRAP instead (default Text wrap, nothing hidden)
+        // and args within the 480 budget wrap too; they never reach this gate.
+        if (title !== undefined && !isTerminal && stringWidth(title.trim()) > headerTextBudget) {
+            return withMeta(title.trim());
+        }
+        // Header fully visible: nothing hidden, nothing to add — stay silent.
+        return '';
+    });
+    if (title === undefined) {
+        return (_jsxs(_Fragment, { children: [_jsx(Box, { flexShrink: 0, children: _jsx(Text, { bold: true, color: nameColor, wrap: "truncate-end", children: name }) }), displayArgs !== '' && (_jsxs(Box, { flexWrap: "nowrap", ...headerTooltip, children: [_jsx(Text, { children: "(" }), _jsx(SyntaxText, { text: clipHeaderArgs(displayArgs), sourceText: displayArgs, language: argsLanguage }), _jsx(Text, { children: ")" })] }))] }));
+    }
+    if (isTerminal) {
+        return (_jsxs(_Fragment, { children: [_jsx(Box, { flexShrink: 0, children: _jsx(Text, { bold: true, color: nameColor, wrap: "truncate-end", children: name }) }), _jsx(Box, { flexWrap: "nowrap", ...headerTooltip, children: folded === undefined ? (_jsxs(Text, { children: ["(", title, ")"] })) : (_jsxs(_Fragment, { children: [_jsxs(Text, { children: ["(", folded.first, ")"] }), folded.hiddenLines > 0 && (_jsx(Text, { dimColor: true, children: ` ${t('lines-folded-expand', { n: folded.hiddenLines })}` }))] })) })] }));
+    }
+    const trimmed = title.trim();
+    if (trimmed === '') {
+        return (_jsx(Box, { flexShrink: 0, children: _jsx(Text, { bold: true, color: nameColor, wrap: "truncate-end", children: name }) }));
+    }
+    // Clickable path: when the caller resolved a file path that appears in
+    // the title (`Edit /path (1 - 100)`), render that segment underlined and
+    // clickable. The click stops propagation so the row's fold toggle does
+    // not fire. indexOf keeps the split exact even for paths with regex
+    // metacharacters.
+    if (onOpenFile !== undefined && filePath !== undefined && filePath !== '' && trimmed.includes(filePath)) {
+        const at = trimmed.indexOf(filePath);
+        const before = trimmed.slice(0, at);
+        const after = trimmed.slice(at + filePath.length);
+        return (_jsxs(Box, { flexWrap: "nowrap", ...headerTooltip, children: [_jsx(Text, { bold: true, color: nameColor, wrap: "truncate-end", children: before }), _jsx(Box, { onClick: (event) => {
+                        event.stopImmediatePropagation();
+                        onOpenFile(filePath);
+                    }, children: _jsx(Text, { underline: true, wrap: "truncate-end", children: filePath }) }), after !== '' && (_jsx(Text, { bold: false, color: "text", wrap: "truncate-end", children: after }))] }));
+    }
+    const space = trimmed.indexOf(' ');
+    const head = space === -1 ? trimmed : trimmed.slice(0, space);
+    const tail = space === -1 ? '' : trimmed.slice(space);
+    return (_jsx(Box, { flexWrap: "nowrap", ...headerTooltip, children: _jsxs(Text, { bold: true, color: nameColor, wrap: "truncate-end", children: [head, _jsx(Text, { bold: false, color: "text", children: tail })] }) }));
+}
+/**
+ * Tool-call card: `● Edit /path` header with a blinking status dot, then the
+ * structured body under a `  ⎿  ` gutter — diff hunks in red/green, terminal
+ * output, read content — instead of the raw result dump. The channel captures
+ * the structured views per call.
+ */
+export function AssistantToolUseMessage({ tool, marginTopOnTurn, verbose, isSelected = false, isExpanded = false, onClick, footnote, diffLayout = 'auto', toolBackground = 'none', onOpenFile, foldTerminalCommand = false, smoothReveal = false, fresh = false, revealVersion, }) {
+    // MessageList owns the single production subscription and passes a version
+    // prop only to active reveal rows. Standalone consumers keep the fallback
+    // subscription so the component contract remains self-contained.
+    // DefaultLane on purpose (useRevealVersion): a useSyncExternalStore wakeup
+    // forces a SyncLane render per tick, and repeated sync commits ending with
+    // streaming work pending feed React's nested-update counter (error #185).
+    useRevealVersion(revealVersion === undefined);
+    const isRunning = tool.status === 'running';
+    const isError = tool.status === 'error';
+    const displayArgs = verbose ? tool.argsFull ?? tool.argsText : tool.argsText;
+    const result = tool.resultFull ?? tool.resultText;
+    const name = displayName(tool.name);
+    const minWidth = stringWidth(name) + 2;
+    // The settled view carries the applied diff / actual output; while running,
+    // the call view already shows the pending change.
+    const view = tool.resultView ?? tool.callView;
+    const filePath = filePathFromTool(tool, view);
+    const syntaxLanguage = view?.card === 'read' || view?.card === 'generic' || view === undefined
+        ? languageFromPath(filePath)
+        : undefined;
+    // presentResult may omit a title (terminal results carry output, not a
+    // command) — then the call view's title stands.
+    const headerTitle = tool.resultView?.title ?? tool.callView?.title;
+    const headerIsTerminal = view?.card === 'terminal';
+    // Fold the terminal header: multi-line command script (setting-gated) plus
+    // the always-on long-line clip, both off once the card is verbose/expanded
+    // (Ctrl+O and the row click both land in `verbose`, so expansion reuses the
+    // existing state machine). Memoized on the title reference: settled titles
+    // never change, so the 1s useAnimationFrame tick of a running card
+    // re-renders without rescanning. `lang` joins the deps because the inline
+    // marker is localized.
+    const lang = getLang();
+    const foldedHeader = React.useMemo(() => headerIsTerminal && !verbose && headerTitle !== undefined
+        ? foldTerminalTitle(headerTitle, foldTerminalCommand)
+        : undefined, [headerIsTerminal, foldTerminalCommand, verbose, headerTitle, lang]);
+    // Live elapsed clock while the call runs: the
+    // 1s tick re-renders the card; elapsed derives from wall-clock refs.
+    const [viewportRef] = useAnimationFrame(isRunning ? 1000 : null);
+    const elapsedMs = isRunning
+        ? tool.startedAt !== undefined
+            ? Date.now() - tool.startedAt
+            : undefined
+        : tool.durationMs;
+    const elapsedText = elapsedMs !== undefined ? ` · ${formatDuration(elapsedMs)}` : '';
+    // Body lines: the structured view first, raw result text as the fallback
+    // (tools without a presenter, or a folded row awaiting loadOlder).
+    // Wide terminals render diffs as a two-pane side-by-side instead: one
+    // source line per terminal row (truncate) keeps the panes row-aligned,
+    // which the flat add/del line model cannot express.
+    const { columns } = useTerminalSize();
+    // Interactive rows grow a ▾/▴ disclose column while the pointer dwells
+    // (fixed, no layout shift elsewhere). The tooltip resolves at show time —
+    // i.e. exactly while that column is present — so the budget must reserve
+    // it for clickable cards only; non-interactive rows never render it.
+    const interactive = onClick !== undefined;
+    // Header-row budget for the title Text. useTerminalSize() already reports
+    // the margin-adjusted content width, so this is the fixed chrome of the
+    // line only: loader dot 2 + hover ▾ indicator 2 (interactive rows, present
+    // while the pointer dwells) + the settled elapsed chip. Calibrated against
+    // the renderer (probe-tooltip-truncation): a truncate-end title whose
+    // width exceeds columns − loader − ▾ − chip is really cut on screen at
+    // tooltip time; anything at or under the budget fits fully and must NOT
+    // pop a tooltip. No extra slack, and the tool name is NOT deducted — a
+    // non-terminal title carries its own first word, so double-counting name
+    // pushed the gate ~10 cols too tight and floated fully visible titles.
+    const headerTextBudget = Math.max(0, columns - 2 - (interactive ? 2 : 0)
+        - (!isRunning && elapsedText !== '' ? stringWidth(elapsedText) : 0));
+    const useSplitDiff = !isError && view?.card === 'diff' &&
+        (diffLayout === 'split' || (diffLayout !== 'unified' && columns >= SPLIT_DIFF_MIN_COLS));
+    let body = [];
+    if (isError) {
+        if (tool.errorText)
+            body = [{ text: tool.errorText, tone: 'error' }];
+    }
+    else if (!useSplitDiff) {
+        if (view !== undefined)
+            body = viewLines(view);
+        if (body.length === 0 && result) {
+            body = result.trimEnd().split('\n').map(plain);
+        }
+        if (isRunning && body.length === 0) {
+            body = [dim(t('tool-running-elapsed', { duration: formatDuration(Math.max(0, Date.now() - (tool.startedAt ?? Date.now()))) }))];
+        }
+    }
+    const cap = view?.card === 'diff' ? DIFF_BODY_MAX_LINES : TEXT_BODY_MAX_LINES;
+    // Long-line clip before anything downstream reads the body: the syntax
+    // highlighter walks `bodySource` by line index, so the folded text must be
+    // the single source of truth for both.
+    const bodyLines = verbose ? body : foldBodyLines(body);
+    const bodySource = bodyLines.map(line => line.text).join('\n');
+    const argsLanguage = jsonArgsLanguage(displayArgs);
+    // The footnote rides OUTSIDE the cap: it is a pointer, not content, and a
+    // long error body must not be the reason it disappears.
+    const lines = capLines(bodyLines, cap, verbose);
+    const rendered = footnote === undefined ? lines : [...lines, { text: footnote, tone: 'hint' }];
+    // Smooth reveal (line-unit, pending CALL body only): model-authored prose
+    // (diff hunks, write content) flows in at ~30fps; the settled RESULT view,
+    // error bodies, verbose/expanded cards, and replayed (non-fresh) cards all
+    // paint complete. `snapReveal` on every non-revealable render retires a
+    // cursor the moment its card stops qualifying (result arrived, user
+    // expanded) — idempotent, safe during render.
+    const revealKey = `tool:${tool.callId}`;
+    const revealable = smoothReveal && !isError && isRunning && view !== undefined &&
+        tool.resultView === undefined && !verbose && !isExpanded && fresh;
+    if (!revealable)
+        snapReveal(revealKey);
+    const revealedLineCount = revealable
+        ? revealLinesOf(revealKey, rendered.length, { enabled: true, active: true })
+        : rendered.length;
+    const shownLines = revealedLineCount >= rendered.length ? rendered : rendered.slice(0, revealedLineCount);
+    // Nested split-diff context panes must also yield to interaction highlights.
+    // `none` leaves them transparent so the selected/expanded root shows through.
+    const ordinaryToolBackground = isSelected || isExpanded ? 'none' : toolBackground;
+    const ordinaryBackground = ordinaryToolBackground === 'subtle'
+        ? 'toolCardBackgroundDim'
+        : ordinaryToolBackground === 'strong'
+            ? 'toolCardBackground'
+            : undefined;
+    // Hover affordance for the click-to-toggle row: the theme's tool-card blue
+    // face marks the call's content area while the pointer dwells (the
+    // toolBackground treatment steps up one level to the strong card face), the
+    // collapsed fold hint (lines-folded-expand) steps from dim to text, the
+    // elapsed clock stops dimming, and a ▾/▴ discloses the row is a toggle.
+    // No layout change: the indicator is a fixed column on the header line, the
+    // body never moves.
+    const [hovered, setHovered] = React.useState(false);
+    const hoverTint = interactive && hovered && !isSelected;
+    return (_jsx(Box, { ref: viewportRef, flexDirection: "row", justifyContent: "space-between", marginTop: marginTopOnTurn ? 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.
+        backgroundColor: isSelected ? 'messageActionsBackground' : hoverTint ? 'toolCardBackground' : ordinaryBackground, onMouseEnter: interactive ? () => setHovered(true) : undefined, onMouseLeave: interactive ? () => setHovered(false) : undefined, 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, folded: foldedHeader, displayArgs: displayArgs, argsLanguage: argsLanguage, nameColor: toolNameColor(tool.name), filePath: filePath, onOpenFile: onOpenFile, metaTooltip: () => toolCardMetaTooltip(tool, isRunning, isError), headerTextBudget: headerTextBudget }), !isRunning && (_jsx(Box, { flexWrap: "nowrap", children: _jsx(Text, { dimColor: !hovered, children: elapsedText }) })), hovered && (_jsx(Box, { flexShrink: 0, children: _jsx(Text, { dimColor: true, children: isExpanded ? '▴' : '▾' }) }))] }), 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, reveal: revealable ? { key: `${revealKey}:split` } : undefined })] })) : (shownLines.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'
+                                        ? 'diffRemovedWord'
+                                        : line.tone === 'path'
+                                            ? 'ide'
+                                            : undefined, dimColor: line.tone !== 'add' && line.tone !== 'del' && line.tone !== 'path', children: index === 0 ? GUTTER_FIRST : GUTTER_REST }) }), _jsx(Box, { flexGrow: 1, children: line.tone === 'path' && onOpenFile !== undefined ? (_jsx(Box, { onClick: (event) => {
+                                    // Stop propagation so the row's fold toggle does not
+                                    // fire when clicking the path.
+                                    event.stopImmediatePropagation();
+                                    onOpenFile(line.text);
+                                }, children: _jsx(Text, { color: "ide", underline: true, children: line.text }) })) : (_jsx(Text, { color: line.tone === 'add'
+                                    ? 'diffAddedWord'
+                                    : line.tone === 'del'
+                                        ? 'diffRemovedWord'
+                                        : line.tone === 'error'
+                                            ? 'error'
+                                            : line.tone === 'hint'
+                                                ? 'subtle'
+                                                : line.tone === 'path'
+                                                    ? 'ide'
+                                                    : undefined, dimColor: line.tone === 'dim' && !(line.revealOnHover === true && hovered), wrap: "wrap", children: line.tone === 'plain' && syntaxLanguage !== undefined ? (_jsx(SyntaxText, { text: line.text, sourceText: bodySource, lineIndex: index, language: syntaxLanguage })) : (line.text === '' ? ' ' : line.text) })) })] }, index)))), useSplitDiff && footnote !== undefined && (_jsxs(Box, { flexDirection: "row", children: [_jsx(Box, { width: 3, flexShrink: 0, children: _jsx(Text, { dimColor: true, children: GUTTER_REST }) }), _jsx(Text, { color: "subtle", children: footnote })] }))] }) }));
+}

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

@@ -0,0 +1,14 @@
+import React from 'react';
+type Props = {
+    /** Wall-clock ms of the assistant message event. */
+    timestamp?: number;
+    /** Model id shown next to the time (session model). */
+    model: string;
+};
+/**
+ * Transcript-mode metadata row: `HH:MM · model`, right-aligned above the
+ * assistant text, collapsed into one row.
+ */
+export declare function MessageMetadata({ timestamp, model, }: Props): React.ReactNode;
+export {};
+//# sourceMappingURL=MessageMetadata.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"MessageMetadata.d.ts","sourceRoot":"","sources":["../../../../src/components/messages/MessageMetadata.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,KAAK,KAAK,GAAG;IACX,oDAAoD;IACpD,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,uDAAuD;IACvD,KAAK,EAAE,MAAM,CAAA;CACd,CAAA;AAED;;;GAGG;AACH,wBAAgB,eAAe,CAAC,EAC9B,SAAS,EACT,KAAK,GACN,EAAE,KAAK,GAAG,KAAK,CAAC,SAAS,CAczB"}

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

@@ -0,0 +1,19 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import Box from '../../ink/components/Box.js';
+import Text from '../design-system/ThemedText.js';
+import { stringWidth } from '../../ink/stringWidth.js';
+/**
+ * Transcript-mode metadata row: `HH:MM · model`, right-aligned above the
+ * assistant text, collapsed into one row.
+ */
+export function MessageMetadata({ timestamp, model, }) {
+    if (timestamp === undefined)
+        return null;
+    const formatted = new Date(timestamp).toLocaleTimeString('en-US', {
+        hour: '2-digit',
+        minute: '2-digit',
+        hour12: true,
+    });
+    const text = `${formatted} · ${model}`;
+    return (_jsx(Box, { minWidth: stringWidth(text), children: _jsx(Text, { dimColor: true, children: text }) }));
+}

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

@@ -0,0 +1,21 @@
+import React from 'react';
+import type { TerminalImageSource } from '../../ink/terminal-image.js';
+import type { TranscriptImage } from '../../dsh-adapter/transcript-images.js';
+/** Full-resolution (bounded) decode for the modal preview overlay. */
+export declare const loadTranscriptImageFull: (image: TranscriptImage, signal?: AbortSignal) => Promise<TerminalImageSource>;
+/** Display label for one transcript image: sanitized name, or the generic
+ *  localized fallback. Shared by thumbnails and the preview overlay. */
+export declare function transcriptImageLabel(image: TranscriptImage): string;
+/** Bounded image gallery shared by user, assistant, and tool-result rows. */
+export declare function TranscriptImages({ images, indent, onPreview, suppressGraphics, }: {
+    readonly images: readonly TranscriptImage[];
+    readonly indent?: number;
+    /** Present = thumbnails are clickable and open the shared preview overlay. */
+    readonly onPreview?: (image: TranscriptImage) => void;
+    /** Keep fallback geometry/click targets but yield the global terminal-image
+     * frame budget to the modal full preview. */
+    readonly suppressGraphics?: boolean;
+}): React.ReactNode;
+/** @internal Focused regression scripts clear the process-local LRUs. */
+export declare function clearTranscriptImageCacheForTests(): void;
+//# sourceMappingURL=TranscriptImages.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"TranscriptImages.d.ts","sourceRoot":"","sources":["../../../../src/components/messages/TranscriptImages.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAA;AAEtE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,wCAAwC,CAAA;AAS7E,sEAAsE;AACtE,eAAO,MAAM,uBAAuB,gFAAgB,CAAA;AAEpD;wEACwE;AACxE,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,eAAe,GAAG,MAAM,CAGnE;AAED,6EAA6E;AAC7E,wBAAgB,gBAAgB,CAAC,EAC/B,MAAM,EACN,MAAU,EACV,SAAS,EACT,gBAAwB,GACzB,EAAE;IACD,QAAQ,CAAC,MAAM,EAAE,SAAS,eAAe,EAAE,CAAA;IAC3C,QAAQ,CAAC,MAAM,CAAC,EAAE,MAAM,CAAA;IACxB,8EAA8E;IAC9E,QAAQ,CAAC,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,IAAI,CAAA;IACrD;iDAC6C;IAC7C,QAAQ,CAAC,gBAAgB,CAAC,EAAE,OAAO,CAAA;CACpC,GAAG,KAAK,CAAC,SAAS,CA6BlB;AA0FD,yEAAyE;AACzE,wBAAgB,iCAAiC,IAAI,IAAI,CAGxD"}