@deepseek-harness-tui/dsh-tui 0.12.0 → 0.14.0

package/lib/types/components/BtwPanel.js

@@ -1,28 +1,24 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * BtwPanelFallback：btw 侧栏面板未启用时的 /btw 浮层。同一问答只在一处
+ * 呈现，Chat 只在面板未启用时挂它。
+ *
+ * 内容是当前 session 的 btw 线程（只读：无 composer、无 attach）。键位：
+ * Esc/Enter/Space 关闭（关闭即中止在途的一轮，由 Chat 接线）、↑/↓ 滚动、
+ * c 复制；浮层打开时吞掉其余所有键。底部提示如何启用 btw 面板，不替用户
+ * 改面板列表。
+ */
 import React from 'react';
-import { Box, Text, useInput, ScrollBox, useTerminalSize } from '../ui.js';
-import { Markdown } from './Markdown.js';
-import { SpinnerGlyph } from './Spinner/SpinnerGlyph.js';
+import { Box, Text, useInput, useTerminalSize } from '../ui.js';
 import { t } from '../i18n.js';
 import { isPlainReturnInput } from '../utils/modifiers.js';
-/**
- * /btw side-question panel, an inline-pane form like the local pickers:
- * title line with the question, a scrollable answer body (error /
- * markdown answer / answering spinner), and a hint line. Owns the keyboard
- * while open — every key it sees is consumed here.
- */
-export function BtwPanel({ question, answer, error, streaming, onClose, onCopy, }) {
+import { BtwThreadView } from './sidePanel/btw/BtwThreadView.js';
+export function BtwPanelFallback({ thread, onClose, onCopy, }) {
     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 || answer !== '')
-            return;
-        const interval = setInterval(() => setFrame(f => f + 1), 80);
-        return () => clearInterval(interval);
-    }, [streaming, answer]);
+    const { rows, columns } = useTerminalSize();
     useInput((input, key, event) => {
+        // A pasted chunk can carry the return flag; it must not close the
+        // overlay (closing aborts the side question in flight).
         if (key.escape || isPlainReturnInput(input, key) || input === ' ') {
             event.stopImmediatePropagation();
             onClose();
@@ -35,13 +31,28 @@ export function BtwPanel({ question, answer, error, streaming, onClose, onCopy,
         }
         if (input === 'c' && !key.ctrl) {
             event.stopImmediatePropagation();
-            onCopy();
+            const latest = latestAnswer(thread);
+            if (latest !== '')
+                onCopy(latest);
             return;
         }
-        // The overlay owns the keyboard while open: swallow everything else so
-        // nothing leaks into the prompt input behind it.
+        // 浮层拥有键盘：吞掉其余一切，不泄漏进身后的输入框。
         event.stopImmediatePropagation();
     });
-    const settled = answer !== '' || error !== undefined;
-    return (_jsxs(Box, { flexDirection: "column", children: [_jsxs(Text, { children: [_jsx(Text, { color: "warning", bold: true, children: "/btw " }), _jsx(Text, { dimColor: true, children: question })] }), _jsx(Box, { flexDirection: "column", maxHeight: Math.max(5, rows - 8), children: _jsx(Box, { marginLeft: 2, flexDirection: "column", flexGrow: 1, children: _jsx(ScrollBox, { ref: scrollRef, flexDirection: "column", flexGrow: 1, children: error !== undefined ? (_jsx(Text, { color: "error", children: error })) : answer !== '' ? (_jsx(Markdown, { cacheTokens: false, children: answer })) : (_jsxs(Box, { children: [_jsx(SpinnerGlyph, { frame: frame, messageColor: "warning" }), _jsxs(Text, { color: "warning", children: [" ", t('btw-answering')] })] })) }) }) }), _jsx(Box, { onClick: settled ? onCopy : undefined, children: _jsx(Text, { dimColor: true, children: settled ? t('btw-hint-done') : streaming ? t('btw-hint-loading') : t('btw-hint-done') }) })] }));
+    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Box, { flexDirection: "column", maxHeight: Math.max(5, rows - 8), children: _jsx(BtwThreadView, { thread: thread, width: columns, height: Math.max(5, rows - 10), alive: true, scrollHandleRef: scrollRef }) }), _jsx(Box, { onClick: settled(thread) ? () => { const latest = latestAnswer(thread); if (latest !== '')
+                    onCopy(latest); } : undefined, children: _jsxs(Text, { dimColor: true, children: [settled(thread) ? t('btw-hint-done') : t('btw-hint-loading'), '  ·  ', t('btw-panel-unavailable')] }) })] }));
+}
+function latestAnswer(thread) {
+    if (thread === undefined)
+        return '';
+    for (let index = thread.turns.length - 1; index >= 0; index -= 1) {
+        const turn = thread.turns[index];
+        if (turn.answer !== '')
+            return turn.answer;
+    }
+    return '';
+}
+function settled(thread) {
+    const active = thread?.turns.find(turn => turn.turnId === thread.activeTurnId);
+    return thread === undefined || active === undefined || active.answer !== '' || active.phase === 'failed';
 }

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

@@ -0,0 +1,40 @@
+import React from 'react';
+import type { BackendChannelOption } from '../dsh-adapter/channel.js';
+/**
+ * 渠道档案选择器（/channel，仅 channels 能力的后端——即 Claude）：一行一个
+ * 渠道（当前渠道打 ✓、行尾副行是映射规模），末尾两行固定动作——「从
+ * settings.json 导入」与「查看映射」。
+ *
+ * 视觉照 KernelPicker/ColorPicker 先例（Pane color=permission + 标题 +
+ * 行列表 + 底部提示行）；行是 ListItem 但 **styled=false**，❯ 焦点指针
+ * 恒在、✓ 跟 activeId 走。键盘归宿主（Chat 的 overlay 分支）：↑/↓ 移焦点、
+ * Enter 走确认路径、Esc 关掉，本组件不碰 useInput。
+ *
+ * 名册不冻在 overlay 里（rows 是 Chat 每渲染现读 channels.json 的派生值）：
+ * 切换/导入后 ✓ 与行自己就刷新，选择器留在屏上（管理器姿态，与 /kernel
+ * 的「选完即关」刻意不同——这里还要继续导入/查看）。
+ *
+ * 鼠标契约照仓库规矩：给了 onPick 行才可点（hover 底色随之出现），点击
+ * 回的是**行号**——宿主把它喂给与键盘 Enter 完全相同的那条确认路径。
+ */
+/** 一行：渠道、或固定动作之一（导入 / 新增 / 管理 / 查看映射）。 */
+export type ChannelPickerRow = {
+    readonly kind: 'channel';
+    readonly option: BackendChannelOption;
+    readonly active: boolean;
+} | {
+    readonly kind: 'import';
+} | {
+    readonly kind: 'add';
+} | {
+    readonly kind: 'manage';
+} | {
+    readonly kind: 'view';
+};
+export declare function ChannelPicker({ rows, focusIndex, onPick }: {
+    rows: readonly ChannelPickerRow[];
+    focusIndex: number;
+    /** 鼠标点行（落到 Chat 同一条确认路径） */
+    onPick?: (index: number) => void;
+}): React.ReactNode;
+//# sourceMappingURL=ChannelPicker.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ChannelPicker.d.ts","sourceRoot":"","sources":["../../../src/components/ChannelPicker.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,2BAA2B,CAAA;AAKrE;;;;;;;;;;;;;;;;GAgBG;AAEH,0CAA0C;AAC1C,MAAM,MAAM,gBAAgB,GACxB;IAAE,QAAQ,CAAC,IAAI,EAAE,SAAS,CAAC;IAAC,QAAQ,CAAC,MAAM,EAAE,oBAAoB,CAAC;IAAC,QAAQ,CAAC,MAAM,EAAE,OAAO,CAAA;CAAE,GAC7F;IAAE,QAAQ,CAAC,IAAI,EAAE,QAAQ,CAAA;CAAE,GAC3B;IAAE,QAAQ,CAAC,IAAI,EAAE,KAAK,CAAA;CAAE,GACxB;IAAE,QAAQ,CAAC,IAAI,EAAE,QAAQ,CAAA;CAAE,GAC3B;IAAE,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAA;CAAE,CAAA;AAE7B,wBAAgB,aAAa,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,EAAE,EAAE;IAC1D,IAAI,EAAE,SAAS,gBAAgB,EAAE,CAAA;IACjC,UAAU,EAAE,MAAM,CAAA;IAClB,4BAA4B;IAC5B,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;CACjC,GAAG,KAAK,CAAC,SAAS,CAoElB"}

package/lib/types/components/ChannelPicker.js

@@ -0,0 +1,26 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { t } from '../i18n.js';
+import { Box, Text } from '../ui.js';
+import { Pane } from './design-system/Pane.js';
+import { ListItem } from './design-system/ListItem.js';
+import { HintLine } from './design-system/HintLine.js';
+export function ChannelPicker({ rows, focusIndex, onPick }) {
+    return (_jsx(Pane, { color: "permission", children: _jsxs(Box, { flexDirection: "column", children: [_jsx(Box, { marginBottom: 1, children: _jsx(Text, { color: "remember", bold: true, children: t('channel-picker-title') }) }), !rows.some(row => row.kind === 'channel') && (_jsx(Box, { paddingLeft: 2, marginBottom: 1, children: _jsx(Text, { dimColor: true, wrap: "wrap", children: t('channel-empty-hint') }) })), rows.map((row, index) => {
+                    const focused = index === focusIndex;
+                    if (row.kind === 'channel') {
+                        return (_jsx(ListItem, { isFocused: focused, isSelected: row.active, description: row.option.connection === undefined
+                                ? t('channel-row-summary', { models: String(row.option.models.length), tiers: String(row.option.tiers.length) })
+                                : t('channel-row-summary-conn', {
+                                    url: row.option.connection.baseUrl ?? t('channel-row-no-url'),
+                                    token: row.option.connection.hasToken ? '✓' : '—',
+                                    env: String(row.option.connection.envKeys.length),
+                                    models: String(row.option.models.length),
+                                    tiers: String(row.option.tiers.length),
+                                }), styled: false, onClick: onPick === undefined ? undefined : () => onPick(index), children: _jsx(Text, { color: row.active ? 'success' : focused ? 'suggestion' : undefined, bold: focused, wrap: "truncate-end", children: row.option.name }) }, row.option.id));
+                    }
+                    return (_jsx(ListItem, { isFocused: focused, styled: false, onClick: onPick === undefined ? undefined : () => onPick(index), children: _jsx(Text, { color: focused ? 'suggestion' : undefined, bold: focused, wrap: "truncate-end", children: t(row.kind === 'import' ? 'channel-action-import'
+                                : row.kind === 'add' ? 'channel-action-add'
+                                    : row.kind === 'manage' ? 'channel-action-manage'
+                                        : 'channel-action-view') }) }, row.kind));
+                }), _jsx(Text, { dimColor: true, italic: true, children: _jsx(HintLine, { text: t('channel-picker-hint') }) })] }) }));
+}

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

@@ -1,5 +1,6 @@
 import React from 'react';
 import type { JobRow } from '../../dsh-adapter/channel.js';
+import type { BackgroundJobOutputLine } from '../../adapter/ports/channel-view.js';
 /**
  * Producer progress as the design system's bar: `n/m` draws a 5-cell
  * sub-cell-accurate `ProgressBar` (same primitive the rest of the TUI uses)
@@ -9,24 +10,38 @@ import type { JobRow } from '../../dsh-adapter/channel.js';
 export declare function JobProgress({ progress }: {
     progress: string;
 }): React.ReactNode;
+/** One rendered waterfall row: a wrapped piece of an output line, or a gap
+ *  banner standing on its own row. */
+interface WaterfallRow {
+    key: string;
+    text: string;
+    gap?: true;
+}
 /**
- * Live background-job card embedded in the transcript (`kind: 'job'`),
- * sibling of the subagent card: header (id · kind · label · elapsed ·
- * status) plus a bounded output waterfall (up to three rows) while the job
- * is live — and only when mirrored output exists: background jobs are
- * usually silent, so an outputless card is just its header line, never a
- * row of empty gutters. Settled jobs fold to the header line alone (a
- * failed/killed job keeps one detail line); the `/jobs` panel holds the
- * fuller view the card clicks to.
- *
- * The waterfall is MIRRORED, never polled: the harness job registry's read
- * is consuming and reserved for the owning agent, so the card shows the
- * tail of the agent's own job_output results as they stream through the
- * transcript.
+ * The waterfall window: every entry is WRAPPED at the card width FIRST, then
+ * the last `budget` VISUAL rows are kept. A 400-cell JSON line therefore
+ * shows its ending folded over the rows instead of a clipped head — and the
+ * window still costs a constant number of rows, which is what the
+ * transcript's virtualization measures.
  */
-export declare function JobCard({ job, marginTopOnTurn, onClick }: {
+export declare function jobOutputRows(entries: readonly BackgroundJobOutputLine[], width: number, budget: number): WaterfallRow[];
+/** Command content shares normalization and wrapping with the full jobs panel. */
+export declare function jobCommandRows(text: string, width: number, expanded: boolean): string[];
+/** The renderer draws the continuous section edge across all content rows. */
+export declare function JobSection({ rows, color, onToggle, children }: {
+    rows: readonly string[];
+    color: 'accent' | 'success';
+    onToggle?: () => void;
+    children?: React.ReactNode;
+}): React.ReactNode;
+/** Transcript job card: command folding is independent of the fixed output tail. */
+export declare function JobCard({ job, marginTopOnTurn, onClick, onWatchOutput, expanded, onToggle }: {
     job: JobRow;
     marginTopOnTurn: boolean;
     onClick?(): void;
+    expanded?: boolean;
+    onToggle?: () => void;
+    onWatchOutput?: (id: string) => () => void;
 }): React.ReactNode;
+export {};
 //# sourceMappingURL=JobCard.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"JobCard.d.ts","sourceRoot":"","sources":["../../../../src/components/Chat/JobCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,8BAA8B,CAAA;AAmC1D;;;;;GAKG;AACH,wBAAgB,WAAW,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,MAAM,CAAA;CAAE,GAAG,KAAK,CAAC,SAAS,CAa/E;AAmBD;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,OAAO,CAAC,EAAE,GAAG,EAAE,eAAe,EAAE,OAAO,EAAE,EAAE;IACzD,GAAG,EAAE,MAAM,CAAA;IACX,eAAe,EAAE,OAAO,CAAA;IACxB,OAAO,CAAC,IAAI,IAAI,CAAA;CACjB,GAAG,KAAK,CAAC,SAAS,CAwFlB"}
+{"version":3,"file":"JobCard.d.ts","sourceRoot":"","sources":["../../../../src/components/Chat/JobCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,8BAA8B,CAAA;AAC1D,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,qCAAqC,CAAA;AAiClF;;;;;GAKG;AACH,wBAAgB,WAAW,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,MAAM,CAAA;CAAE,GAAG,KAAK,CAAC,SAAS,CAa/E;AAED;sCACsC;AACtC,UAAU,YAAY;IACpB,GAAG,EAAE,MAAM,CAAA;IACX,IAAI,EAAE,MAAM,CAAA;IACZ,GAAG,CAAC,EAAE,IAAI,CAAA;CACX;AAED;;;;;;GAMG;AACH,wBAAgB,aAAa,CAC3B,OAAO,EAAE,SAAS,uBAAuB,EAAE,EAC3C,KAAK,EAAE,MAAM,EACb,MAAM,EAAE,MAAM,GACb,YAAY,EAAE,CAiBhB;AACD,kFAAkF;AAClF,wBAAgB,cAAc,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,GAAG,MAAM,EAAE,CAQvF;AAED,8EAA8E;AAC9E,wBAAgB,UAAU,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE;IAC9D,IAAI,EAAE,SAAS,MAAM,EAAE,CAAA;IACvB,KAAK,EAAE,QAAQ,GAAG,SAAS,CAAA;IAC3B,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC3B,GAAG,KAAK,CAAC,SAAS,CAOlB;AACD,oFAAoF;AACpF,wBAAgB,OAAO,CAAC,EAAE,GAAG,EAAE,eAAe,EAAE,OAAO,EAAE,aAAa,EAAE,QAAgB,EAAE,QAAQ,EAAE,EAAE;IACpG,GAAG,EAAE,MAAM,CAAA;IACX,eAAe,EAAE,OAAO,CAAA;IACxB,OAAO,CAAC,IAAI,IAAI,CAAA;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,aAAa,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,MAAM,IAAI,CAAA;CAC3C,GAAG,KAAK,CAAC,SAAS,CAmClB"}

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

@@ -3,13 +3,12 @@ import React from 'react';
 import { Box, Text, useAnimationFrame, useTerminalSize } from '../../ui.js';
 import { formatJobDuration } from '../../dsh-adapter/jobs.js';
 import { t } from '../../i18n.js';
-import { stringWidth } from '../../ink/stringWidth.js';
+import wrapText from '../../ink/wrap-text.js';
 import { isMinimalUiMode } from '../../minimalUiMode.js';
 import { ProgressBar } from '../design-system/ProgressBar.js';
 /** The waterfall window mirrors the subagent card: a constant-height region. */
-const WATERFALL_ROWS = 3;
-/** Card left padding + the `│ ` gutter prefix. */
-const WATERFALL_GUTTER = 4;
+const WATERFALL_ROWS = 2;
+const COMMAND_MARK = process.platform === 'win32' ? '>' : '❯';
 /** Static status marker — deliberately NOT the animated activity-indicator
  *  preset: a background job is parked work, and reusing the main spinner
  *  language for every card reads as clutter. ● = live background work
@@ -46,75 +45,63 @@ export function JobProgress({ progress }) {
     }
     return (_jsxs(Box, { flexDirection: "row", gap: 1, children: [_jsx(ProgressBar, { ratio: Math.min(current, total) / total, width: 5, fillColor: "accent", emptyColor: "inactive" }), _jsx(Text, { color: "accent", children: progress.trim() })] }));
 }
-/** Hard single-line clip by display width — a wrapped waterfall row would
- *  break the constant-height window. */
-function clipLine(text, maxWidth) {
-    if (maxWidth <= 1)
-        return '';
-    let width = 0;
-    let index = 0;
-    while (index < text.length) {
-        const next = text.codePointAt(index);
-        const char = String.fromCodePoint(next);
-        const charWidth = stringWidth(char);
-        if (width + charWidth > maxWidth - 1)
-            break;
-        width += charWidth;
-        index += char.length;
-    }
-    return index < text.length ? `${text.slice(0, index)}…` : text;
-}
 /**
- * Live background-job card embedded in the transcript (`kind: 'job'`),
- * sibling of the subagent card: header (id · kind · label · elapsed ·
- * status) plus a bounded output waterfall (up to three rows) while the job
- * is live — and only when mirrored output exists: background jobs are
- * usually silent, so an outputless card is just its header line, never a
- * row of empty gutters. Settled jobs fold to the header line alone (a
- * failed/killed job keeps one detail line); the `/jobs` panel holds the
- * fuller view the card clicks to.
- *
- * The waterfall is MIRRORED, never polled: the harness job registry's read
- * is consuming and reserved for the owning agent, so the card shows the
- * tail of the agent's own job_output results as they stream through the
- * transcript.
+ * The waterfall window: every entry is WRAPPED at the card width FIRST, then
+ * the last `budget` VISUAL rows are kept. A 400-cell JSON line therefore
+ * shows its ending folded over the rows instead of a clipped head — and the
+ * window still costs a constant number of rows, which is what the
+ * transcript's virtualization measures.
  */
-export function JobCard({ job, marginTopOnTurn, onClick }) {
+export function jobOutputRows(entries, width, budget) {
+    const rows = [];
+    // One cell of slack: a line that lands exactly on the boundary is re-wrapped
+    // by ink's own renderer, which would silently double that row's height.
+    const textWidth = Math.max(1, width - 1);
+    for (let index = entries.length - 1; index >= 0 && rows.length < budget; index--) {
+        const entry = entries[index];
+        const wrapped = wrapText(entry.text, textWidth, 'wrap').split('\n');
+        for (let row = wrapped.length - 1; row >= 0 && rows.length < budget; row--) {
+            rows.unshift({
+                key: `${index}-${row}`,
+                text: wrapped[row] ?? '',
+            });
+        }
+        if (entry.gapBefore === true && rows.length < budget)
+            rows.unshift({ key: `gap-${index}`, text: '', gap: true });
+    }
+    return rows;
+}
+/** Command content shares normalization and wrapping with the full jobs panel. */
+export function jobCommandRows(text, width, expanded) {
+    const command = text.trim();
+    const script = command.replace(/^(?:pwsh|powershell)(?:\.exe)?\s+(?:(?:-(?:NoProfile|NoLogo|NonInteractive)|-ExecutionPolicy\s+\S+)\s+)*-Command\s+/i, '');
+    const body = (script === command ? script : script.replace(/^(['"])([\s\S]*)\1$/, '$2')).replace(/\r\n?/g, '\n').trim();
+    const source = body.split('\n').filter((line, index, lines) => line.trim() !== '' || index === 0 || lines[index - 1]?.trim() !== '').join('\n');
+    const shown = expanded ? source : source.split('\n')[0];
+    const rows = wrapText(COMMAND_MARK + ' ' + shown, Math.max(1, width), 'wrap').split('\n');
+    return expanded ? rows : rows.slice(0, 1);
+}
+/** The renderer draws the continuous section edge across all content rows. */
+export function JobSection({ rows, color, onToggle, children }) {
+    if (rows.length === 0 && children === undefined)
+        return null;
+    return _jsx(Box, { flexDirection: "column", borderStyle: "single", borderTop: false, borderBottom: false, borderRight: false, borderLeft: true, borderColor: color, paddingLeft: 1, onClick: onToggle === undefined ? undefined : event => { event.stopImmediatePropagation(); onToggle(); }, children: children === undefined ? rows.map((line, index) => _jsx(Text, { dimColor: true, wrap: "truncate-end", children: line === '' ? ' ' : line }, index)) : children });
+}
+/** Transcript job card: command folding is independent of the fixed output tail. */
+export function JobCard({ job, marginTopOnTurn, onClick, onWatchOutput, expanded = false, onToggle }) {
     const settled = job.status === 'completed' || job.status === 'failed' || job.status === 'killed';
-    // 动画订阅仅限存活卡片：settled 后退订共享 clock（同 SubagentMessage 的
-    // 约定）。1s tick 只驱动运行时长跳动——状态标是静态的（见 statusInfo）。
+    React.useEffect(() => (settled || onWatchOutput === undefined ? undefined : onWatchOutput(job.id)), [settled, onWatchOutput, job.id]);
     const [viewportRef] = useAnimationFrame(settled ? null : 1000);
     const { columns } = useTerminalSize();
     const info = statusInfo(job.status);
     const [hovered, setHovered] = React.useState(false);
-    const clickable = onClick !== undefined;
-    const rowWidth = Math.max(20, (columns ?? 80) - WATERFALL_GUTTER);
-    // Waterfall entries: gap banners interleave as their own rows, then the
-    // window keeps the LAST WATERFALL_ROWS entries so a banner never pushes a
-    // fresher line out — the card stays constant-height.
-    const waterfall = [];
-    for (const line of settled ? [] : job.outputLines) {
-        if (line.gapBefore === true)
-            waterfall.push({ kind: 'gap' });
-        waterfall.push({ kind: 'line', line });
-    }
-    const activity = waterfall.slice(-WATERFALL_ROWS);
-    // A settled job's terminal detail ('exit code: 0') rides the header; a
-    // failed/killed one also keeps it as the explanatory tail line.
+    const contentWidth = Math.max(1, columns - 2);
+    const commandRows = jobCommandRows(job.label, contentWidth, expanded);
+    const output = jobOutputRows(job.outputLines, Math.max(1, contentWidth - 1), WATERFALL_ROWS);
+    const outputRows = output.map((entry, index) => (index === 0 ? '≡ ' : '') + (entry.gap === true ? t('jobs-output-gap') : entry.text));
     const headerDetail = job.detail !== undefined && job.detail !== '' ? job.detail : undefined;
     const headerName = `${t('jobs-card-prefix')}${job.id}`;
     const duration = formatJobDuration(job);
-    // Only a LIVE job carries a progress chip; a settled one has dropped it, so
-    // reserving width for it unconditionally would clip the label for nothing.
     const liveProgress = settled || job.progress === undefined || job.progress === '' ? undefined : job.progress;
-    // 点击打开 /jobs 面板；hover 不刷整行背景（转录视觉保持安静），只把
-    // 状态 glyph 提亮为品牌色作为可点指示。无外层缩进：任务卡是上方工具
-    // 调用（run_in_background 卡）的延续，与工具卡通栏左对齐；子代理卡才
-    // 是嵌套子实体、保留缩进。瀑布的 `  │ ` 槽自带两格，正好与工具卡正文
-    // 的 `  ⎿ ` 槽位一致。
-    return _jsxs(Box, { flexDirection: "column", marginTop: marginTopOnTurn ? 1 : 0, ref: viewportRef, onClick: onClick, onMouseEnter: clickable ? () => setHovered(true) : undefined, onMouseLeave: clickable ? () => setHovered(false) : undefined, children: [_jsxs(Box, { flexDirection: "row", gap: 1, children: [_jsx(Text, { color: hovered && clickable ? 'accent' : info.color, children: info.glyph }), _jsx(Box, { flexShrink: 0, children: _jsx(Text, { bold: true, color: hovered && clickable ? 'accent' : undefined, children: headerName }) }), _jsx(Box, { flexShrink: 0, children: _jsx(Text, { dimColor: true, children: job.kind }) }), _jsx(Box, { flexGrow: 1, flexShrink: 1, children: _jsx(Text, { wrap: "truncate-end", children: job.label }) }), liveProgress !== undefined && (_jsx(Box, { width: 12, flexShrink: 0, children: _jsx(JobProgress, { progress: liveProgress }) })), _jsx(Box, { flexShrink: 0, children: _jsx(Text, { dimColor: true, children: duration }) }), headerDetail !== undefined && _jsx(Box, { flexShrink: 0, children: _jsx(Text, { dimColor: true, wrap: "truncate-end", children: headerDetail }) }), _jsx(Box, { flexShrink: 0, children: _jsx(Text, { color: info.color, children: info.label }) })] }), !settled && activity.length > 0 && activity.map((entry, index) => (
-            // key 不含 time（同 SubagentMessage 的约定）：内容更新走 in-place
-            // diff，避免每个 tick 都 unmount+mount。瀑布只在有镜像输出时出现
-            // （后台任务静默是常态——无输出时卡片就是头行，不摆空 gutter）。
-            entry.kind === 'gap' ? (_jsx(Text, { dimColor: true, italic: true, wrap: "truncate", children: `  · ${clipLine(t('jobs-output-gap'), rowWidth)}` }, `${job.id}-wf-gap-${index}`)) : (_jsx(Text, { color: entry.line.channel === 'stderr' ? 'error' : undefined, dimColor: entry.line.channel !== 'stderr', wrap: "truncate", children: `  │ ${clipLine(entry.line.text, rowWidth)}` }, `${job.id}-wf-${index}`)))), settled && job.status !== 'completed' && headerDetail !== undefined && (_jsx(Text, { dimColor: true, wrap: "truncate", children: `  └ ${clipLine(headerDetail, rowWidth)}` }))] });
+    return _jsxs(Box, { flexDirection: "column", marginTop: marginTopOnTurn ? 1 : 0, ref: viewportRef, onClick: onToggle === undefined ? undefined : event => { event.stopImmediatePropagation(); onToggle(); }, onMouseEnter: () => setHovered(true), onMouseLeave: () => setHovered(false), children: [_jsxs(Box, { flexDirection: "row", gap: 1, height: 1, overflow: "hidden", onClick: onClick === undefined ? undefined : event => { event.stopImmediatePropagation(); onClick(); }, children: [_jsx(Box, { flexShrink: 0, children: _jsx(Text, { color: hovered ? 'accent' : info.color, children: info.glyph }) }), _jsx(Box, { flexShrink: 0, children: _jsx(Text, { bold: true, color: hovered ? 'accent' : undefined, children: headerName }) }), _jsx(Box, { flexShrink: 0, children: _jsx(Text, { dimColor: true, children: job.kind }) }), liveProgress !== undefined && _jsx(Box, { width: 12, flexShrink: 0, children: _jsx(JobProgress, { progress: liveProgress }) }), _jsx(Box, { flexShrink: 0, children: _jsx(Text, { dimColor: true, children: duration }) }), headerDetail !== undefined && _jsx(Box, { flexShrink: 0, children: _jsx(Text, { dimColor: true, wrap: "truncate-end", children: headerDetail }) }), _jsx(Box, { flexShrink: 0, children: _jsx(Text, { color: info.color, children: info.label }) })] }), _jsx(JobSection, { rows: commandRows, color: "accent" }), _jsx(JobSection, { rows: outputRows, color: "success" })] });
 }

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

@@ -0,0 +1,27 @@
+import React from 'react';
+import type { JobGroupRow } from '../../adapter/ports/channel-view.js';
+/**
+ * Header line of a consecutive-job group (`row.jobGroup`): the run summary
+ * while the group is open, and the fold line once it is closed.
+ *
+ *   ▾ 后台任务 ×6 · 2 运行中 · 4 已完成 · 合计 12.3s
+ *   ▸ 已折叠 6 个后台任务 · 4 已完成 · 2 失败 · 合计 12.3s · 点击展开
+ *
+ * The fold line keeps the header's row and glyph slot, so a settling group
+ * reads as the SAME block tucking its body away (the thinking/compact fold
+ * convention) instead of a new row appearing. The whole line is clickable
+ * and brightens on hover — the same mouse gesture the job cards use — and
+ * Ctrl+O expands every group at once.
+ *
+ * The summary line sits OUTSIDE the group's rail: the cards below it carry
+ * the bracket (`╭` on the first card, `╰` on the last), so this line reads as
+ * the run's title rather than its first row.
+ *
+ * Failures stay LOUD while folded: the failed/killed counts are painted in
+ * the error color, because folding must never bury a job that died.
+ */
+export declare function JobGroupHeader({ group, onToggle }: {
+    group: JobGroupRow;
+    onToggle?(): void;
+}): React.ReactNode;
+//# sourceMappingURL=JobGroupHeader.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"JobGroupHeader.d.ts","sourceRoot":"","sources":["../../../../src/components/Chat/JobGroupHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,qCAAqC,CAAA;AAQtE;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,cAAc,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE;IAClD,KAAK,EAAE,WAAW,CAAA;IAClB,QAAQ,CAAC,IAAI,IAAI,CAAA;CAClB,GAAG,KAAK,CAAC,SAAS,CAoElB"}

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

@@ -0,0 +1,62 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import { Box, Text, useAnimationFrame } from '../../ui.js';
+import { formatJobDuration } from '../../dsh-adapter/jobs.js';
+import { t } from '../../i18n.js';
+import { isMinimalUiMode } from '../../minimalUiMode.js';
+/**
+ * Header line of a consecutive-job group (`row.jobGroup`): the run summary
+ * while the group is open, and the fold line once it is closed.
+ *
+ *   ▾ 后台任务 ×6 · 2 运行中 · 4 已完成 · 合计 12.3s
+ *   ▸ 已折叠 6 个后台任务 · 4 已完成 · 2 失败 · 合计 12.3s · 点击展开
+ *
+ * The fold line keeps the header's row and glyph slot, so a settling group
+ * reads as the SAME block tucking its body away (the thinking/compact fold
+ * convention) instead of a new row appearing. The whole line is clickable
+ * and brightens on hover — the same mouse gesture the job cards use — and
+ * Ctrl+O expands every group at once.
+ *
+ * The summary line sits OUTSIDE the group's rail: the cards below it carry
+ * the bracket (`╭` on the first card, `╰` on the last), so this line reads as
+ * the run's title rather than its first row.
+ *
+ * Failures stay LOUD while folded: the failed/killed counts are painted in
+ * the error color, because folding must never bury a job that died.
+ */
+export function JobGroupHeader({ group, onToggle }) {
+    const minimalUi = isMinimalUiMode();
+    const [hovered, setHovered] = React.useState(false);
+    // Only a LIVE group ticks: its elapsed keeps counting. A settled group's
+    // duration is frozen, so it must not keep re-rendering the row.
+    const [tickRef] = useAnimationFrame(group.running > 0 ? 1000 : null);
+    const clickable = onToggle !== undefined;
+    const duration = formatJobDuration({
+        startedAt: group.startedAt,
+        ...(group.endedAt === undefined ? {} : { finishedAt: group.endedAt }),
+    });
+    const chipColor = (color) => minimalUi ? undefined : color;
+    const chips = [];
+    if (group.running > 0)
+        chips.push({ key: 'running', text: t('jobs-group-running', { count: group.running }), color: chipColor('warning') });
+    if (group.failed > 0)
+        chips.push({ key: 'failed', text: t('jobs-group-failed', { count: group.failed }), color: chipColor('error') });
+    if (group.killed > 0)
+        chips.push({ key: 'killed', text: t('jobs-group-killed', { count: group.killed }), color: chipColor('error') });
+    if (group.folded && group.running === 0 && group.failed === 0 && group.killed === 0) {
+        // Folded and clean: "全部完成" says more than "6 已完成" — the group is
+        // the unit being reported on now.
+        chips.push({ key: 'all', text: t('jobs-group-all-completed'), color: chipColor('success') });
+    }
+    else if (group.completed > 0) {
+        chips.push({ key: 'completed', text: t('jobs-group-completed', { count: group.completed }), color: undefined });
+    }
+    // The mouse affordance: a folded line always teaches the way back in; an
+    // open group only says it while hovered (its ▾ already carries the hint).
+    const hint = group.folded
+        ? t('jobs-group-hint-expand')
+        : hovered && clickable ? t('jobs-group-hint-fold') : undefined;
+    return (_jsxs(Box, { flexDirection: "row", gap: 1, ref: tickRef, onClick: clickable ? onToggle : undefined, onMouseEnter: clickable ? () => setHovered(true) : undefined, onMouseLeave: clickable ? () => setHovered(false) : undefined, children: [_jsx(Text, { color: hovered && clickable && !minimalUi ? 'accent' : 'inactive', children: group.folded ? '▸' : '▾' }), _jsx(Text, { wrap: "truncate-end", color: hovered && clickable ? 'text' : undefined, dimColor: !(hovered && clickable), children: group.folded
+                    ? t('jobs-group-folded', { count: group.count })
+                    : t('jobs-group-title', { count: group.count }) }), chips.map(chip => (_jsxs(React.Fragment, { children: [_jsx(Text, { color: "inactive", children: "\u00B7" }), _jsx(Text, { color: chip.color, dimColor: chip.color === undefined, children: chip.text })] }, chip.key))), _jsx(Text, { color: "inactive", children: "\u00B7" }), _jsx(Text, { dimColor: true, children: t('jobs-group-elapsed', { duration }) }), hint !== undefined && (_jsxs(React.Fragment, { children: [_jsx(Text, { color: "inactive", children: "\u00B7" }), _jsx(Text, { color: group.folded ? 'inactive' : 'accent', children: hint })] }))] }));
+}

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

@@ -10,11 +10,14 @@ import type { ClickEvent } from '../../ink/events/click-event.js';
  * working-activity preset (`/activity`), so the indicator follows the same
  * setting as the main spinner.
  */
-export declare function SubagentMessage({ subagent, marginTopOnTurn, activityFrames, onClick }: {
+export declare function SubagentMessage({ subagent, marginTopOnTurn, activityFrames, onClick, onOpenView }: {
     subagent: SubagentRow;
     marginTopOnTurn: boolean;
     activityFrames?: string;
     isExpanded: boolean;
     onClick?(event: ClickEvent): void;
+    /** 在主屏打开子代理转录：与卡片点击（→ 详情）并列的独立动作；拦截冒泡，
+     *  普通正文点击与选区不受影响。 */
+    onOpenView?(): void;
 }): React.ReactNode;
 //# sourceMappingURL=SubagentMessage.d.ts.map

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

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

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

@@ -26,6 +26,9 @@ function status(row) {
         return { glyph: minimalUi ? '×' : '🔴', label: t('subagent-status-failed'), color: minimalUi ? undefined : 'error' };
     if (row.status === 'cancelled')
         return { glyph: minimalUi ? '×' : '🔴', label: t('subagent-status-cancelled'), color: minimalUi ? undefined : 'error' };
+    // No end was ever reported (the run's process is gone): settled, unknown.
+    if (row.status === 'unknown')
+        return { glyph: minimalUi ? '·' : '⚪', label: t('subagent-status-unknown'), color: minimalUi ? undefined : 'subtle' };
     return { glyph: minimalUi ? '·' : '🟡', label: t('subagent-status-running'), color: minimalUi ? undefined : 'warning' };
 }
 /** Hard single-line clip by display width — a wrapped waterfall row would
@@ -57,8 +60,8 @@ function clipLine(text, maxWidth) {
  * working-activity preset (`/activity`), so the indicator follows the same
  * setting as the main spinner.
  */
-export function SubagentMessage({ subagent, marginTopOnTurn, activityFrames, onClick }) {
-    const settled = subagent.status === 'completed' || subagent.status === 'failed' || subagent.status === 'cancelled';
+export function SubagentMessage({ subagent, marginTopOnTurn, activityFrames, onClick, onOpenView }) {
+    const settled = subagent.status === 'completed' || subagent.status === 'failed' || subagent.status === 'cancelled' || subagent.status === 'unknown';
     // 动画订阅仅限运行中的卡片：settled 后传 null 退出共享 clock（keepAlive
     // 归零 → interval 清除），否则历史里的每张完成卡片都以 120ms 永久驱动
     // React commit。viewportRef 必须挂到根节点——useTerminalViewport 初始
@@ -79,5 +82,9 @@ export function SubagentMessage({ subagent, marginTopOnTurn, activityFrames, onC
     const rowWidth = Math.max(20, (columns ?? 80) - WATERFALL_GUTTER);
     // 点击打开详情场景；hover 不刷整行背景（转录视觉保持安静），只把状态
     // glyph 提亮为品牌色作为可点指示。
-    return _jsxs(Box, { flexDirection: "column", marginTop: marginTopOnTurn ? 1 : 0, paddingLeft: 2, ref: viewportRef, onClick: onClick, onMouseEnter: clickable ? () => setHovered(true) : undefined, onMouseLeave: clickable ? () => setHovered(false) : undefined, children: [_jsxs(Box, { flexDirection: "row", gap: 1, children: [_jsx(Text, { color: hovered && clickable ? 'accent' : info.color, children: settled ? info.glyph : ` ${runningGlyph}` }), _jsx(Text, { bold: true, color: hovered && clickable ? 'accent' : undefined, children: `${t('subagent-card-prefix')}${subagent.description}` }), _jsx(Text, { dimColor: true, children: "\u00B7" }), _jsx(Text, { children: subagent.model ?? subagent.provider ?? 'default' }), subagent.effort && _jsxs(_Fragment, { children: [_jsx(Text, { dimColor: true, children: "\u00B7" }), _jsx(Text, { dimColor: true, children: subagent.effort })] }), _jsx(Text, { dimColor: true, children: "\u00B7" }), _jsx(Text, { dimColor: true, children: duration(elapsed) }), _jsx(Text, { dimColor: true, children: "\u00B7" }), _jsx(Text, { dimColor: true, children: tokens(subagent) }), _jsx(Text, { dimColor: true, children: "\u00B7" }), _jsxs(Text, { dimColor: true, children: [subagent.toolCalls.length, " tools"] }), _jsx(Text, { dimColor: true, children: "\u00B7" }), _jsx(Text, { color: info.color, children: info.label })] }), !settled && (lastRunning ?? previousDone) !== undefined && (_jsx(Text, { wrap: "truncate", children: lastRunning !== undefined ? (_jsxs(_Fragment, { children: [previousDone !== undefined && (_jsxs(_Fragment, { children: [_jsx(Text, { dimColor: true, children: '  · ' }), _jsx(Text, { color: "success", children: "\u2713" }), _jsx(Text, { color: toolNameColor(previousDone.name), children: previousDone.name }), _jsx(Text, { dimColor: true, children: ' · ' })] })), lastRunning.argsPreview === undefined && (_jsx(Text, { color: toolNameColor(lastRunning.name), children: lastRunning.name })), lastRunning.argsPreview !== undefined && (_jsxs(_Fragment, { children: [_jsx(Text, { color: toolNameColor(lastRunning.name), children: lastRunning.name }), _jsx(Text, { dimColor: true, children: ` (${clipLine(lastRunning.argsPreview.replace(/\s+/g, ' ').trim(), Math.max(10, rowWidth - lastRunning.name.length - 6))})` })] }))] })) : (previousDone !== undefined && (_jsxs(_Fragment, { children: [_jsx(Text, { dimColor: true, children: '  · ' }), _jsx(Text, { color: "success", children: "\u2713" }), _jsx(Text, { color: toolNameColor(previousDone.name), children: previousDone.name }), previousDone.argsPreview !== undefined && (_jsx(Text, { dimColor: true, children: ` (${clipLine(previousDone.argsPreview.replace(/\s+/g, ' ').trim(), Math.max(10, rowWidth - previousDone.name.length - 6))})` }))] }))) })), !settled && Array.from({ length: WATERFALL_ROWS }, (_, index) => (_jsx(Text, { dimColor: true, wrap: "truncate", children: `  │ ${clipLine(activity[index] ?? '', rowWidth)}` }, `${subagent.agentId}-wf-${index}`))), settled && subagent.status === 'failed' && subagent.error && (_jsx(Text, { color: "error", wrap: "truncate", children: `  └ ${clipLine(subagent.error, rowWidth)}` }))] });
+    return _jsxs(Box, { flexDirection: "column", marginTop: marginTopOnTurn ? 1 : 0, paddingLeft: 2, ref: viewportRef, onClick: onClick, onMouseEnter: clickable ? () => setHovered(true) : undefined, onMouseLeave: clickable ? () => setHovered(false) : undefined, children: [_jsxs(Box, { flexDirection: "row", gap: 1, children: [_jsx(Text, { color: hovered && clickable ? 'accent' : info.color, children: settled ? info.glyph : ` ${runningGlyph}` }), _jsx(Text, { bold: true, color: hovered && clickable ? 'accent' : undefined, children: `${t('subagent-card-prefix')}${subagent.description}` }), _jsx(Text, { dimColor: true, children: "\u00B7" }), _jsx(Text, { children: subagent.model ?? subagent.provider ?? 'default' }), subagent.effort && _jsxs(_Fragment, { children: [_jsx(Text, { dimColor: true, children: "\u00B7" }), _jsx(Text, { dimColor: true, children: subagent.effort })] }), _jsx(Text, { dimColor: true, children: "\u00B7" }), _jsx(Text, { dimColor: true, children: duration(elapsed) }), _jsx(Text, { dimColor: true, children: "\u00B7" }), _jsx(Text, { dimColor: true, children: tokens(subagent) }), _jsx(Text, { dimColor: true, children: "\u00B7" }), _jsxs(Text, { dimColor: true, children: [subagent.toolCalls.length, " tools"] }), _jsx(Text, { dimColor: true, children: "\u00B7" }), _jsx(Text, { color: info.color, children: info.label }), onOpenView !== undefined && (_jsx(Box, { flexShrink: 0, marginLeft: 1, onClick: (event) => {
+                            // 拦截冒泡：这一格是「主屏查看」，不是卡片点击（→详情）。
+                            event.stopImmediatePropagation();
+                            onOpenView();
+                        }, onMouseEnter: () => setHovered(true), onMouseLeave: () => setHovered(false), children: _jsx(Text, { color: hovered ? 'accent' : 'subtle', children: '⤢' }) }))] }), !settled && (lastRunning ?? previousDone) !== undefined && (_jsx(Text, { wrap: "truncate", children: lastRunning !== undefined ? (_jsxs(_Fragment, { children: [previousDone !== undefined && (_jsxs(_Fragment, { children: [_jsx(Text, { dimColor: true, children: '  · ' }), _jsx(Text, { color: "success", children: "\u2713" }), _jsx(Text, { color: toolNameColor(previousDone.name), children: previousDone.name }), _jsx(Text, { dimColor: true, children: ' · ' })] })), lastRunning.argsPreview === undefined && (_jsx(Text, { color: toolNameColor(lastRunning.name), children: lastRunning.name })), lastRunning.argsPreview !== undefined && (_jsxs(_Fragment, { children: [_jsx(Text, { color: toolNameColor(lastRunning.name), children: lastRunning.name }), _jsx(Text, { dimColor: true, children: ` (${clipLine(lastRunning.argsPreview.replace(/\s+/g, ' ').trim(), Math.max(10, rowWidth - lastRunning.name.length - 6))})` })] }))] })) : (previousDone !== undefined && (_jsxs(_Fragment, { children: [_jsx(Text, { dimColor: true, children: '  · ' }), _jsx(Text, { color: "success", children: "\u2713" }), _jsx(Text, { color: toolNameColor(previousDone.name), children: previousDone.name }), previousDone.argsPreview !== undefined && (_jsx(Text, { dimColor: true, children: ` (${clipLine(previousDone.argsPreview.replace(/\s+/g, ' ').trim(), Math.max(10, rowWidth - previousDone.name.length - 6))})` }))] }))) })), !settled && Array.from({ length: WATERFALL_ROWS }, (_, index) => (_jsx(Text, { dimColor: true, wrap: "truncate", children: `  │ ${clipLine(activity[index] ?? '', rowWidth)}` }, `${subagent.agentId}-wf-${index}`))), settled && subagent.status === 'failed' && subagent.error && (_jsx(Text, { color: "error", wrap: "truncate", children: `  └ ${clipLine(subagent.error, rowWidth)}` }))] });
 }

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

@@ -0,0 +1,27 @@
+import React from 'react';
+/**
+ * The Claude girl portrait（Claude 娘）that stands in for the header's pixel
+ * whale while the claude brand is active (`branding.ts` — the cc kernel):
+ * a 30×30 true-color sprite in `claudeGirlSprite.ts`, rendered with the same
+ * half-block technique as the whale and the whale girl — one `▀`/`▄` cell
+ * packs two sprite rows, so the portrait shows at 30 columns × 15 rows.
+ * A static portrait by design: the whale's idle planner and click-hearts
+ * stay whale-only, exactly like the whale-girl mode.
+ */
+/** Pre-rendered ANSI rows, computed once at module load. */
+export declare const CLAUDE_GIRL_ROWS: readonly string[];
+/**
+ * The portrait's center column when it fills the whale's 40-column box
+ * (indented (40−30)/2 = 5, so the art spans columns 5..34 → center 19.5 —
+ * same metrics as the whale girl, both sprites are 30 columns).
+ */
+export declare const CLAUDE_GIRL_CENTER = 19.5;
+/**
+ * The Claude girl as an Ink component: 15 rows × 30 columns. `width` pins
+ * the box (the header passes the whale's 40-column box so the neighbouring
+ * text column never shifts) and centers the portrait inside it.
+ */
+export declare function ClaudeGirlArt({ width }: {
+    width?: number;
+}): React.ReactNode;
+//# sourceMappingURL=ClaudeGirl.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ClaudeGirl.d.ts","sourceRoot":"","sources":["../../../src/components/ClaudeGirl.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB;;;;;;;;GAQG;AAEH,4DAA4D;AAC5D,eAAO,MAAM,gBAAgB,EAAE,SAAS,MAAM,EAI7C,CAAA;AAED;;;;GAIG;AACH,eAAO,MAAM,kBAAkB,OAAO,CAAA;AAEtC;;;;GAIG;AACH,wBAAgB,aAAa,CAAC,EAAE,KAAK,EAAE,EAAE;IAAE,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,GAAG,KAAK,CAAC,SAAS,CAW5E"}

package/lib/types/components/ClaudeGirl.js

@@ -0,0 +1,30 @@
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { Box, Text } from '../ui.js';
+import { renderCellRows } from './Whale.js';
+import { CLAUDE_GIRL_COLS, CLAUDE_GIRL_SPRITE, CLAUDE_GIRL_SPRITE_ROWS } from './claudeGirlSprite.js';
+/**
+ * The Claude girl portrait（Claude 娘）that stands in for the header's pixel
+ * whale while the claude brand is active (`branding.ts` — the cc kernel):
+ * a 30×30 true-color sprite in `claudeGirlSprite.ts`, rendered with the same
+ * half-block technique as the whale and the whale girl — one `▀`/`▄` cell
+ * packs two sprite rows, so the portrait shows at 30 columns × 15 rows.
+ * A static portrait by design: the whale's idle planner and click-hearts
+ * stay whale-only, exactly like the whale-girl mode.
+ */
+/** Pre-rendered ANSI rows, computed once at module load. */
+export const CLAUDE_GIRL_ROWS = renderCellRows(CLAUDE_GIRL_COLS, CLAUDE_GIRL_SPRITE_ROWS, (x, y) => CLAUDE_GIRL_SPRITE[y]?.[x] ?? undefined);
+/**
+ * The portrait's center column when it fills the whale's 40-column box
+ * (indented (40−30)/2 = 5, so the art spans columns 5..34 → center 19.5 —
+ * same metrics as the whale girl, both sprites are 30 columns).
+ */
+export const CLAUDE_GIRL_CENTER = 19.5;
+/**
+ * The Claude girl as an Ink component: 15 rows × 30 columns. `width` pins
+ * the box (the header passes the whale's 40-column box so the neighbouring
+ * text column never shifts) and centers the portrait inside it.
+ */
+export function ClaudeGirlArt({ width }) {
+    const pad = width === undefined ? 0 : Math.max(0, Math.floor((width - CLAUDE_GIRL_COLS) / 2));
+    return (_jsx(Box, { flexDirection: "column", flexShrink: 0, width: width, children: CLAUDE_GIRL_ROWS.map((row, index) => (_jsxs(Text, { wrap: "truncate-end", children: [pad > 0 ? ' '.repeat(pad) : '', row] }, index))) }));
+}