@deepseek-harness-tui/dsh-tui 0.14.1 → 0.16.0

package/lib/types/components/SearchBox.js

@@ -5,9 +5,10 @@ import Text from './design-system/ThemedText.js';
 import { useTheme } from './design-system/ThemeProvider.js';
 import { cursorGlyphColor, getTheme } from '../theme.js';
 import measureElement from '../ink/measure-element.js';
-import { useDeclaredCursor } from '../ink/hooks/use-declared-cursor.js';
+import { useDeclaredCursor, useNativeCursor } from '../ink/hooks/use-declared-cursor.js';
 import { useTerminalSize } from '../ink/hooks/use-terminal-size.js';
 import { stringWidth } from '../ink/stringWidth.js';
+import { snapOffImageToken } from './composerImageTokens.js';
 /**
  * Window a single-line query around the caret so the visible slice fits
  * `avail` display cells (CJK display width, code-point safe — `[...s]`
@@ -18,7 +19,7 @@ import { stringWidth } from '../ink/stringWidth.js';
  * a mid-surrogate offset would split an emoji, so it snaps back to the
  * pair's start first.
  */
-function windowQuery(query, offset, avail) {
+function windowQuery(query, offset, avail, imageSpans) {
     const budget = Math.max(avail, 1);
     let caret = Math.max(0, Math.min(offset, query.length));
     if (caret > 0 &&
@@ -29,8 +30,10 @@ function windowQuery(query, offset, avail) {
         query.charCodeAt(caret) <= 0xdfff) {
         caret--; // mid-surrogate: snap to the emoji's start
     }
+    caret = snapOffImageToken(imageSpans, caret, 'nearest');
     const beforeChars = [...query.slice(0, caret)];
-    const at = caret < query.length ? [...query.slice(caret)][0] : ' ';
+    const tokenAtCaret = imageSpans.find(span => span.start === caret);
+    const at = tokenAtCaret !== undefined ? tokenAtCaret.token : caret < query.length ? [...query.slice(caret)][0] : ' ';
     const atWidth = Math.max(1, stringWidth(at));
     let caretColumn = 0;
     for (const ch of beforeChars)
@@ -40,6 +43,10 @@ function windowQuery(query, offset, avail) {
         caretColumn -= stringWidth(beforeChars[start]);
         start++;
     }
+    const before = beforeChars.slice(start).join('');
+    const rawStart = caret - before.length;
+    const windowStart = snapOffImageToken(imageSpans, rawStart, 'end');
+    caretColumn -= stringWidth(query.slice(rawStart, windowStart));
     let rest = budget - caretColumn - atWidth;
     let after = '';
     for (const ch of [...query.slice(caret + at.length)]) {
@@ -49,26 +56,26 @@ function windowQuery(query, offset, avail) {
         after += ch;
         rest -= w;
     }
-    return { before: beforeChars.slice(start).join(''), at, after, caretColumn };
+    const end = snapOffImageToken(imageSpans, caret + at.length + after.length, 'start');
+    return { before: query.slice(windowStart, caret), at, after: query.slice(caret + at.length, end), caretColumn, start: windowStart, caret };
 }
 /**
- * A single-line search input in a round-bordered box: `⌕ ` prefix, block
- * cursor at `cursorOffset` (theme cursor fill, or inverse cell when unset).
- * When empty and focused, the caret is a block **on the first
- * character of the placeholder** (opencode style, 2026-10 第七版) — it never
- * occupies a cell of its own, so text never shifts; the terminal-painted IME
- * preedit (pinyin) still lands at the declared native cursor next to it.
+ * A single-line search input in a round-bordered box: `⌕ ` prefix and a native
+ * cursor at `cursorOffset`. Static snapshots retain the theme-painted caret.
+ * When empty with a left-aligned placeholder, the caret sits on its first
+ * character; text stays in place and IME preedit uses the same native anchor.
  *
  * The query row is strictly single-line: an overlong query is windowed
  * around the caret (horizontal scroll) instead of wrapping, so the native
  * cursor declaration below stays exact for any query length.
  */
-export function SearchBox({ query, placeholder = 'Search…', isFocused, isTerminalFocused, prefix = '⌕', width, cursorOffset, borderless = false, caretBlink = true, placeholderAlign = 'right', }) {
+export function SearchBox({ query, placeholder = 'Search…', isFocused, isTerminalFocused, prefix = '⌕', width, cursorOffset, borderless = false, caretBlink = true, declareCursor = true, placeholderAlign = 'right', imageSpans = [], }) {
     const [themeName] = useTheme();
+    const nativeCursor = useNativeCursor();
     const cursorTheme = getTheme(themeName);
     const cursorColor = cursorTheme.cursor ?? '';
     const cursorGlyph = cursorGlyphColor(cursorTheme);
-    const caretCell = (text) => !caretBlink
+    const caretCell = (text, image = false) => !image && (nativeCursor || !caretBlink)
         ? _jsx(Text, { children: text })
         : cursorColor === ''
             ? _jsx(Text, { inverse: true, children: text })
@@ -77,10 +84,8 @@ export function SearchBox({ query, placeholder = 'Search…', isFocused, isTermi
     const borderStyle = borderless ? undefined : 'round';
     const borderColor = isFocused ? 'suggestion' : undefined;
     const borderDimColor = !isFocused;
-    // 空输入的行内光标（第七版重做）：光标压在**占位文本的第一个字符**身上
-    // （只对那一个字符着光标样式，opencode 式）——绝不自己占一格、绝不把文字往右
-    // 挤。不再拿终端焦点（DECSET 1004 focus 事件）当开关：只要这个输入框是
-    // 本屏的焦点目标，光标就常在（用户原话「光标永远不消失 哪怕焦点没了」）。
+    // Empty left-aligned inputs park on the placeholder's first character;
+    // the terminal owns the cursor's appearance when its window loses focus.
     const inlineCaret = isFocused && query === '';
     // Content width of the box in display cells. Measured from yoga after
     // layout (resize re-layouts without any prop/state change, so measure on
@@ -90,8 +95,26 @@ export function SearchBox({ query, placeholder = 'Search…', isFocused, isTermi
     const chrome = borderless ? 0 : 4; // 2 border cells + paddingX 2
     const [measuredWidth, setMeasuredWidth] = useState(null);
     const contentWidth = measuredWidth ?? Math.max(8, columns - chrome - 2);
-    const prefixWidth = stringWidth(`${prefix} `);
-    const win = windowQuery(query, offset, contentWidth - prefixWidth);
+    const prefixText = prefix === '' ? '' : `${prefix} `;
+    const prefixWidth = stringWidth(prefixText);
+    const win = windowQuery(query, offset, contentWidth - prefixWidth, imageSpans);
+    const renderQueryPart = (text, start) => {
+        if (imageSpans.length === 0)
+            return _jsx(Text, { children: text });
+        const pieces = [];
+        let pos = start;
+        for (const span of imageSpans) {
+            if (span.start < start || span.end > start + text.length)
+                continue;
+            if (pos < span.start)
+                pieces.push(_jsx(Text, { children: query.slice(pos, span.start) }, `text-${pos}`));
+            pieces.push(_jsx(Text, { color: "suggestion", children: span.token }, `image-${span.start}`));
+            pos = span.end;
+        }
+        if (pos < start + text.length)
+            pieces.push(_jsx(Text, { children: query.slice(pos, start + text.length) }, `text-${pos}`));
+        return pieces.length === 0 ? _jsx(Text, { children: text }) : _jsx(_Fragment, { children: pieces });
+    };
     // Park the native terminal cursor at the caret so IME preedit (pinyin)
     // renders inline at the input instead of the screen's bottom row (same
     // mechanism as PromptInput). The declaration hangs on the outer Box —
@@ -99,7 +122,7 @@ export function SearchBox({ query, placeholder = 'Search…', isFocused, isTermi
     // reorders/drops glyphs on narrow widths), so the position is computed:
     // border (1) + paddingX (1) per edge when bordered, then the `prefix `
     // run and the windowed before-caret text, all in display cells.
-    const showCaret = isFocused && isTerminalFocused;
+    const showCaret = isFocused && (nativeCursor || isTerminalFocused);
     // Clamp into the box's content area: on absurdly narrow layouts the
     // prefix alone can meet or exceed the content width, and the park must
     // never land outside the box's rect.
@@ -109,12 +132,21 @@ export function SearchBox({ query, placeholder = 'Search…', isFocused, isTermi
     const declarationRef = useDeclaredCursor({
         line: borderless ? 0 : 1,
         column: caretColumn,
-        active: showCaret,
+        active: showCaret && declareCursor,
+        visible: nativeCursor,
     });
     const boxNodeRef = useRef(null);
     const boxRef = useCallback((node) => {
         boxNodeRef.current = node;
-        declarationRef(node);
+        const cleanup = declarationRef(node);
+        if (node === null)
+            return;
+        return () => {
+            if (typeof cleanup === 'function')
+                cleanup();
+            if (boxNodeRef.current === node)
+                boxNodeRef.current = null;
+        };
     }, [declarationRef]);
     useLayoutEffect(() => {
         const node = boxNodeRef.current;
@@ -132,14 +164,13 @@ export function SearchBox({ query, placeholder = 'Search…', isFocused, isTermi
     let content;
     if (isFocused) {
         if (query) {
-            // 第七版重做：光标常在（不再依赖终端焦点事件），压在当前字符身上
-            // （对那一个字符着光标样式；行尾时为空格），闪烁相位只在
-            // 光标 ↔ 常规之间切样式——字符常在、文字不位移。
-            content = (_jsxs(_Fragment, { children: [_jsx(Text, { children: win.before }), caretCell(win.at), win.after !== '' && _jsx(Text, { children: win.after })] }));
+            // Keep the visible text intact; only the painted fallback changes
+            // the caret glyph's style as its blink phase advances.
+            content = (_jsxs(_Fragment, { children: [renderQueryPart(win.before, win.start), caretCell(win.at, imageSpans.some(span => span.start === win.caret)), win.after !== '' && renderQueryPart(win.after, win.caret + win.at.length)] }));
         }
     }
     else {
-        content = query ? _jsx(Text, { children: query }) : _jsx(Text, { children: placeholder });
+        content = query ? renderQueryPart(query, 0) : _jsx(Text, { children: placeholder });
     }
-    return (_jsx(Box, { ref: boxRef, flexShrink: 0, borderStyle: borderStyle, borderColor: borderColor, borderDimColor: borderDimColor, paddingX: borderless ? 0 : 1, width: width, children: inlineCaret ? (placeholderAlign === 'left' ? (_jsxs(Box, { flexDirection: "row", width: "100%", children: [_jsxs(Text, { children: [prefix, " "] }), _jsxs(Text, { dimColor: true, wrap: "truncate", children: [caretBlink ? caretCell(placeholder.slice(0, 1)) : placeholder.slice(0, 1), placeholder.slice(1)] })] })) : (_jsxs(Box, { flexDirection: "row", width: "100%", children: [_jsxs(Text, { children: [prefix, " "] }), caretCell(' '), _jsx(Box, { flexGrow: 1 }), _jsx(Text, { dimColor: true, wrap: "truncate", children: placeholder })] }))) : (_jsxs(Text, { dimColor: !isFocused, wrap: "truncate-end", children: [prefix, " ", content] })) }));
+    return (_jsx(Box, { ref: boxRef, flexShrink: 0, borderStyle: borderStyle, borderColor: borderColor, borderDimColor: borderDimColor, paddingX: borderless ? 0 : 1, width: width, children: inlineCaret ? (placeholderAlign === 'left' ? (_jsxs(Box, { flexDirection: "row", width: "100%", children: [_jsx(Text, { children: prefixText }), _jsxs(Text, { dimColor: true, wrap: "truncate", children: [caretCell(placeholder.slice(0, 1) || ' '), placeholder.slice(1)] })] })) : (_jsxs(Box, { flexDirection: "row", width: "100%", children: [_jsx(Text, { children: prefixText }), caretCell(' '), _jsx(Box, { flexGrow: 1 }), _jsx(Text, { dimColor: true, wrap: "truncate", children: placeholder })] }))) : (_jsxs(Text, { dimColor: !isFocused, wrap: "truncate-end", children: [prefixText, content] })) }));
 }

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

@@ -1,11 +1,23 @@
 import React from 'react';
 import type { SubagentState } from '../dsh-adapter/subagents.js';
 import type { ClickEvent } from '../ink/events/click-event.js';
+import type { TeamMemberStatus } from './teamRoster.js';
 export interface SubagentCardProps {
     subagent: SubagentState;
     focused?: boolean;
     onClick?(event: ClickEvent): void;
     variant?: 'default' | 'panel';
+    /** Agent Teams: the row is this teammate — its name replaces the
+     *  description and its member state replaces the run status. */
+    teamMember?: {
+        readonly name: string;
+        readonly status: TeamMemberStatus;
+    };
 }
-export declare function SubagentCard({ subagent, focused, onClick, variant }: SubagentCardProps): React.ReactNode;
+/** Status glyph and color of a team member (`·`-style in minimal UI). */
+export declare function teamStatusGlyph(status: TeamMemberStatus, minimalUi: boolean): {
+    readonly glyph: string;
+    readonly color?: 'warning' | 'subtle' | 'error' | 'accent';
+};
+export declare function SubagentCard({ subagent, focused, onClick, variant, teamMember }: SubagentCardProps): React.ReactNode;
 //# sourceMappingURL=SubagentCard.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"SubagentCard.d.ts","sourceRoot":"","sources":["../../../src/components/SubagentCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAA;AAEvC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAA;AAIhE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAA;AAO9D,MAAM,WAAW,iBAAiB;IAChC,QAAQ,EAAE,aAAa,CAAA;IACvB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,OAAO,CAAC,CAAC,KAAK,EAAE,UAAU,GAAG,IAAI,CAAA;IACjC,OAAO,CAAC,EAAE,SAAS,GAAG,OAAO,CAAA;CAC9B;AAED,wBAAgB,YAAY,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,OAAO,EAAE,OAAmB,EAAE,EAAE,iBAAiB,GAAG,KAAK,CAAC,SAAS,CAiFpH"}
+{"version":3,"file":"SubagentCard.d.ts","sourceRoot":"","sources":["../../../src/components/SubagentCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAA;AAEvC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAA;AAIhE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAA;AAC9D,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAA;AAOvD,MAAM,WAAW,iBAAiB;IAChC,QAAQ,EAAE,aAAa,CAAA;IACvB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,OAAO,CAAC,CAAC,KAAK,EAAE,UAAU,GAAG,IAAI,CAAA;IACjC,OAAO,CAAC,EAAE,SAAS,GAAG,OAAO,CAAA;IAC7B;oEACgE;IAChE,UAAU,CAAC,EAAE;QAAE,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;QAAC,QAAQ,CAAC,MAAM,EAAE,gBAAgB,CAAA;KAAE,CAAA;CAC1E;AAED,yEAAyE;AACzE,wBAAgB,eAAe,CAAC,MAAM,EAAE,gBAAgB,EAAE,SAAS,EAAE,OAAO,GAAG;IAAE,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,KAAK,CAAC,EAAE,SAAS,GAAG,QAAQ,GAAG,OAAO,GAAG,QAAQ,CAAA;CAAE,CAQpK;AAED,wBAAgB,YAAY,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,OAAO,EAAE,OAAmB,EAAE,UAAU,EAAE,EAAE,iBAAiB,GAAG,KAAK,CAAC,SAAS,CA2FhI"}

package/lib/types/components/SubagentCard.js

@@ -8,9 +8,21 @@ function formatDuration(ms) {
     const seconds = Math.floor(ms / 1000);
     return seconds < 60 ? `${seconds}s` : `${Math.floor(seconds / 60)}m${seconds % 60}s`;
 }
-export function SubagentCard({ subagent, focused, onClick, variant = 'default' }) {
+/** Status glyph and color of a team member (`·`-style in minimal UI). */
+export function teamStatusGlyph(status, minimalUi) {
+    switch (status) {
+        case 'running': return minimalUi ? { glyph: '·' } : { glyph: '🟡', color: 'warning' };
+        case 'idle': return minimalUi ? { glyph: '○' } : { glyph: '🔵', color: 'accent' };
+        case 'active': return minimalUi ? { glyph: '◇' } : { glyph: '🟣', color: 'accent' };
+        case 'provisioning': return minimalUi ? { glyph: '…' } : { glyph: '⚪', color: 'subtle' };
+        case 'failed': return minimalUi ? { glyph: '×' } : { glyph: '🔴', color: 'error' };
+    }
+}
+export function SubagentCard({ subagent, focused, onClick, variant = 'default', teamMember }) {
     const panelMode = variant === 'panel';
-    const running = subagent.status === 'running' || subagent.status === 'starting';
+    const running = teamMember !== undefined
+        ? teamMember.status === 'running'
+        : subagent.status === 'running' || subagent.status === 'starting';
     const [clockRef] = useAnimationFrame(running ? 1000 : null);
     // Unknown rows have no completion time, so they do not get a fabricated duration.
     const elapsed = running
@@ -25,15 +37,18 @@ export function SubagentCard({ subagent, focused, onClick, variant = 'default' }
     const [hovered, setHovered] = useState(false);
     const liveLine = running ? subagent.output[subagent.output.length - 1] : undefined;
     const minimalUi = isMinimalUiMode();
-    const glyph = running ? (minimalUi ? '·' : '🟡')
-        : subagent.status === 'unknown' ? (minimalUi ? '·' : '⚪')
-            : subagent.status === 'failed' || subagent.status === 'cancelled' ? (minimalUi ? '×' : '🔴')
-                : (minimalUi ? '✓' : '🟢');
-    const glyphColor = minimalUi ? undefined
-        : running ? 'warning'
-            : subagent.status === 'unknown' ? 'subtle'
-                : subagent.status === 'failed' || subagent.status === 'cancelled' ? 'error'
-                    : 'success';
+    const teamGlyph = teamMember === undefined ? undefined : teamStatusGlyph(teamMember.status, minimalUi);
+    const glyph = teamGlyph !== undefined ? teamGlyph.glyph
+        : running ? (minimalUi ? '·' : '🟡')
+            : subagent.status === 'unknown' ? (minimalUi ? '·' : '⚪')
+                : subagent.status === 'failed' || subagent.status === 'cancelled' ? (minimalUi ? '×' : '🔴')
+                    : (minimalUi ? '✓' : '🟢');
+    const glyphColor = teamGlyph !== undefined ? teamGlyph.color
+        : minimalUi ? undefined
+            : running ? 'warning'
+                : subagent.status === 'unknown' ? 'subtle'
+                    : subagent.status === 'failed' || subagent.status === 'cancelled' ? 'error'
+                        : 'success';
     const hoverTint = onClick !== undefined && hovered && !focused;
     // Keep the description on one row; narrower panels progressively drop metadata.
     const { columns } = useTerminalSize();
@@ -55,7 +70,7 @@ export function SubagentCard({ subagent, focused, onClick, variant = 'default' }
         subagent.effort,
         shownDuration === undefined ? undefined : formatDuration(shownDuration),
     ].filter(part => part !== undefined && part !== '').join(' · ');
-    return _jsxs(Box, { ref: clockRef, flexDirection: "column", paddingLeft: 1, marginBottom: panelMode ? 0 : 1, onClick: onClick, onMouseEnter: onClick !== undefined ? () => setHovered(true) : undefined, onMouseLeave: onClick !== undefined ? () => setHovered(false) : undefined, backgroundColor: hoverTint ? 'userMessageBackgroundHover' : undefined, children: [_jsxs(Box, { flexDirection: "row", children: [_jsx(Box, { flexShrink: 0, marginRight: 1, children: _jsx(Text, { color: glyphColor, children: glyph }) }), _jsx(Box, { flexGrow: 1, flexShrink: 1, overflow: "hidden", children: _jsx(Text, { bold: true, color: focused ? 'accent' : undefined, wrap: "truncate-end", children: panelMode ? subagent.description : `${t('subagent-card-prefix')}${subagent.description}` }) }), subagent.mode === 'continuable' && (_jsx(Box, { flexShrink: 0, marginLeft: 1, children: _jsx(Text, { color: focused ? 'accent' : 'warning', children: t('subagent-mode-continuable') }) })), subagent.mode === 'one-shot' && (_jsx(Box, { flexShrink: 0, marginLeft: 1, children: _jsx(Text, { dimColor: true, children: t('subagent-mode-one-shot') }) })), !panelMode && meta !== '' && (_jsx(Box, { flexShrink: 0, marginLeft: 1, children: _jsx(Text, { dimColor: true, wrap: "truncate-end", children: meta }) }))] }), panelMode && panelMeta !== '' && _jsx(Box, { paddingLeft: 3, children: _jsx(Text, { dimColor: true, wrap: "wrap", children: panelMeta }) }), panelMode
+    return _jsxs(Box, { ref: clockRef, flexDirection: "column", paddingLeft: 1, marginBottom: panelMode ? 0 : 1, onClick: onClick, onMouseEnter: onClick !== undefined ? () => setHovered(true) : undefined, onMouseLeave: onClick !== undefined ? () => setHovered(false) : undefined, backgroundColor: hoverTint ? 'userMessageBackgroundHover' : undefined, children: [_jsxs(Box, { flexDirection: "row", children: [_jsx(Box, { flexShrink: 0, marginRight: 1, children: _jsx(Text, { color: glyphColor, children: glyph }) }), _jsx(Box, { flexGrow: 1, flexShrink: 1, overflow: "hidden", children: _jsx(Text, { bold: true, color: focused ? 'accent' : undefined, wrap: "truncate-end", children: teamMember !== undefined ? teamMember.name : panelMode ? subagent.description : `${t('subagent-card-prefix')}${subagent.description}` }) }), teamMember !== undefined && (_jsx(Box, { flexShrink: 0, marginLeft: 1, children: _jsx(Text, { color: focused ? 'accent' : teamGlyph?.color, dimColor: teamMember.status === 'provisioning', children: t(`team-status-${teamMember.status}`) }) })), teamMember === undefined && subagent.mode === 'continuable' && (_jsx(Box, { flexShrink: 0, marginLeft: 1, children: _jsx(Text, { color: focused ? 'accent' : 'warning', children: t('subagent-mode-continuable') }) })), teamMember === undefined && subagent.mode === 'one-shot' && (_jsx(Box, { flexShrink: 0, marginLeft: 1, children: _jsx(Text, { dimColor: true, children: t('subagent-mode-one-shot') }) })), !panelMode && meta !== '' && (_jsx(Box, { flexShrink: 0, marginLeft: 1, children: _jsx(Text, { dimColor: true, wrap: "truncate-end", children: meta }) }))] }), panelMode && panelMeta !== '' && _jsx(Box, { paddingLeft: 3, children: _jsx(Text, { dimColor: true, wrap: "wrap", children: panelMeta }) }), panelMode
                 ? previewRows.map(row => _jsx(Text, { dimColor: true, wrap: "truncate", children: `  ${row.text}` }, row.key))
                 : liveLine !== undefined && _jsx(Text, { dimColor: true, wrap: "truncate", children: `  │ ${liveLine}` })] });
 }

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

@@ -2,6 +2,7 @@ import React from 'react';
 import type { SubagentState } from '../dsh-adapter/subagents.js';
 import type { SidePanelKeyFlags } from './sidePanel/types.js';
 import type { AgentMessageView, AgentIdentity } from './messages/agentTeam.js';
+import type { TeamView } from '../adapter/ports/channel-view.js';
 export interface SubagentDashboardProps {
     subagents: readonly SubagentState[];
     /** Optional cross-session agents, kept separate from this session children. */
@@ -15,6 +16,12 @@ export interface SubagentDashboardProps {
     onOpenView?: (agentId: string) => void;
     /** 代理↔代理消息流：每张卡下显示最后一条 from → to 摘要。 */
     messages?: readonly AgentMessageView[];
+    /** Agent Teams: present → team mode (members joined with their subagent
+     *  rows, a read-only task board, the failure banner). */
+    team?: TeamView;
+    /** The session on screen: inside a teammate the subagent rows are its own
+     *  children, so the roster is not joined with them. */
+    sessionId?: string;
     /** `panel` 挂在侧栏宿主里（去外层 padding、键盘走 usePanelInput 分发器）；
      *  default（缺省）与整屏形态逐字节一致。 */
     variant?: 'default' | 'panel';
@@ -32,5 +39,5 @@ export declare function ExitButton({ onClick }: {
  * SubagentDashboard — overlay panel showing all active/recent subagents.
  * Keyboard: up/down to navigate, Enter to view detail, Esc to close.
  */
-export declare function SubagentDashboard({ subagents, peers, onClose, onSelect, onOpenView, messages, variant, focused, visible, }: SubagentDashboardProps): React.ReactNode;
+export declare function SubagentDashboard({ subagents, team, sessionId, peers, onClose, onSelect, onOpenView, messages, variant, focused, visible, }: SubagentDashboardProps): React.ReactNode;
 //# sourceMappingURL=SubagentDashboard.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"SubagentDashboard.d.ts","sourceRoot":"","sources":["../../../src/components/SubagentDashboard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAA;AAMhE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAA;AAE7D,OAAO,KAAK,EAAE,gBAAgB,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAA;AAE9E,MAAM,WAAW,sBAAsB;IACrC,SAAS,EAAE,SAAS,aAAa,EAAE,CAAA;IACnC,+EAA+E;IAC/E,QAAQ,CAAC,KAAK,CAAC,EAAE,SAAS,aAAa,EAAE,CAAA;IACzC;mDAC+C;IAC/C,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAA;IACpC;0BACsB;IACtB,UAAU,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAA;IACtC,wCAAwC;IACxC,QAAQ,CAAC,EAAE,SAAS,gBAAgB,EAAE,CAAA;IACtC;iCAC6B;IAC7B,OAAO,CAAC,EAAE,SAAS,GAAG,OAAO,CAAA;IAC7B,+CAA+C;IAC/C,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB;AAED,2EAA2E;AAC3E,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,iBAAiB,GAAG,OAAO,CAOjF;AAED,yCAAyC;AACzC,wBAAgB,UAAU,CAAC,EAAE,OAAO,EAAE,EAAE;IAAE,OAAO,EAAE,MAAM,IAAI,CAAA;CAAE,GAAG,KAAK,CAAC,SAAS,CAWhF;AAED;;;GAGG;AACH,wBAAgB,iBAAiB,CAAC,EAChC,SAAS,EACT,KAAK,EACL,OAAO,EACP,QAAQ,EACR,UAAU,EACV,QAAQ,EACR,OAAmB,EACnB,OAAc,EACd,OAAc,GACf,EAAE,sBAAsB,GAAG,KAAK,CAAC,SAAS,CA+M1C"}
+{"version":3,"file":"SubagentDashboard.d.ts","sourceRoot":"","sources":["../../../src/components/SubagentDashboard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAA;AAMhE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAA;AAE7D,OAAO,KAAK,EAAE,gBAAgB,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAA;AAC9E,OAAO,KAAK,EAAY,QAAQ,EAAE,MAAM,kCAAkC,CAAA;AAI1E,MAAM,WAAW,sBAAsB;IACrC,SAAS,EAAE,SAAS,aAAa,EAAE,CAAA;IACnC,+EAA+E;IAC/E,QAAQ,CAAC,KAAK,CAAC,EAAE,SAAS,aAAa,EAAE,CAAA;IACzC;mDAC+C;IAC/C,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAA;IACpC;0BACsB;IACtB,UAAU,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAA;IACtC,wCAAwC;IACxC,QAAQ,CAAC,EAAE,SAAS,gBAAgB,EAAE,CAAA;IACtC;6DACyD;IACzD,IAAI,CAAC,EAAE,QAAQ,CAAA;IACf;2DACuD;IACvD,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;iCAC6B;IAC7B,OAAO,CAAC,EAAE,SAAS,GAAG,OAAO,CAAA;IAC7B,+CAA+C;IAC/C,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB;AAED,2EAA2E;AAC3E,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,iBAAiB,GAAG,OAAO,CAOjF;AAED,yCAAyC;AACzC,wBAAgB,UAAU,CAAC,EAAE,OAAO,EAAE,EAAE;IAAE,OAAO,EAAE,MAAM,IAAI,CAAA;CAAE,GAAG,KAAK,CAAC,SAAS,CAWhF;AAgED;;;GAGG;AACH,wBAAgB,iBAAiB,CAAC,EAChC,SAAS,EACT,IAAI,EACJ,SAAS,EACT,KAAK,EACL,OAAO,EACP,QAAQ,EACR,UAAU,EACV,QAAQ,EACR,OAAmB,EACnB,OAAc,EACd,OAAc,GACf,EAAE,sBAAsB,GAAG,KAAK,CAAC,SAAS,CAkS1C"}

package/lib/types/components/SubagentDashboard.js

@@ -1,12 +1,14 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import React from 'react';
 import { Box, Text, useInput, ScrollBox, useTerminalSize } from '../ui.js';
-import { SubagentCard } from './SubagentCard.js';
+import { SubagentCard, teamStatusGlyph } from './SubagentCard.js';
 import { t } from '../i18n.js';
 import { Divider } from './design-system/Divider.js';
 import { isPlainReturnInput } from '../utils/modifiers.js';
 import { usePanelInput } from './sidePanel/usePanelInput.js';
 import { AgentMessagesSummary } from './messages/AgentMessageFlow.js';
+import { isTeamTaskBlocked, teamDashboardModel, teamTaskProgress } from './teamRoster.js';
+import { isMinimalUiMode } from '../minimalUiMode.js';
 /** Accept Ink's Enter flag and the panel dispatcher's normalized alias. */
 export function isPanelPlainReturn(input, key) {
     return isPlainReturnInput(input, {
@@ -21,13 +23,29 @@ export function ExitButton({ onClick }) {
     const [hovered, setHovered] = React.useState(false);
     return (_jsx(Box, { onClick: onClick, onMouseEnter: () => setHovered(true), onMouseLeave: () => setHovered(false), children: _jsx(Text, { color: hovered ? 'text' : 'subtle', children: ' ✕' }) }));
 }
+/** A teammate the host has not announced as a subagent yet. */
+function TeamRosterOnlyRow({ row, focused, panelMode, self }) {
+    const { glyph, color } = teamStatusGlyph(row.status, isMinimalUiMode());
+    return (_jsxs(Box, { flexDirection: "row", paddingLeft: 1, marginBottom: panelMode ? 0 : 1, children: [_jsx(Box, { flexShrink: 0, marginRight: 1, children: _jsx(Text, { color: color, children: glyph }) }), _jsx(Box, { flexGrow: 1, flexShrink: 1, overflow: "hidden", children: _jsxs(Text, { wrap: "truncate-end", children: [_jsx(Text, { bold: true, color: focused ? 'accent' : undefined, children: row.member.name }), self && _jsx(Text, { dimColor: true, children: ' · ' + t('team-self-mark') })] }) }), _jsx(Box, { flexShrink: 0, marginLeft: 1, children: _jsx(Text, { color: focused ? 'accent' : color, dimColor: row.status === 'provisioning', children: t(`team-status-${row.status}`) }) })] }));
+}
+const TASK_GLYPH = {
+    pending: { glyph: '○', color: 'subtle' },
+    in_progress: { glyph: '◐', color: 'accent' },
+    completed: { glyph: '●', color: 'success' },
+};
+/** The team's shared task board, read-only; narrow widths drop the owner. */
+function TeamTaskBoard({ tasks }) {
+    const { columns } = useTerminalSize();
+    return (_jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsx(Text, { dimColor: true, wrap: "truncate-end", children: t('team-tasks-title', teamTaskProgress(tasks)) }), tasks.length === 0 && _jsx(Text, { dimColor: true, children: '  ' + t('team-tasks-empty') }), tasks.map(task => (_jsxs(Box, { flexDirection: "row", paddingLeft: 1, children: [_jsx(Box, { flexShrink: 0, marginRight: 1, children: _jsx(Text, { color: TASK_GLYPH[task.status].color, children: TASK_GLYPH[task.status].glyph }) }), _jsx(Box, { flexGrow: 1, flexShrink: 1, overflow: "hidden", children: _jsx(Text, { dimColor: task.status === 'completed', wrap: "truncate-end", children: task.subject }) }), columns >= 40 && task.ownerName !== undefined && (_jsx(Box, { flexShrink: 0, marginLeft: 1, children: _jsx(Text, { dimColor: true, children: '@' + task.ownerName }) })), isTeamTaskBlocked(task) && (_jsx(Box, { flexShrink: 0, marginLeft: 1, children: _jsx(Text, { color: "warning", children: t('team-task-blocked') }) })), task.writeScopeWarnings.length > 0 && (_jsx(Box, { flexShrink: 0, marginLeft: 1, children: _jsx(Text, { color: "warning", children: '⚠' + task.writeScopeWarnings.length }) }))] }, task.id)))] }));
+}
 /**
  * SubagentDashboard — overlay panel showing all active/recent subagents.
  * Keyboard: up/down to navigate, Enter to view detail, Esc to close.
  */
-export function SubagentDashboard({ subagents, peers, onClose, onSelect, onOpenView, messages, variant = 'default', focused = true, visible = true, }) {
+export function SubagentDashboard({ subagents, team, sessionId, peers, onClose, onSelect, onOpenView, messages, variant = 'default', focused = true, visible = true, }) {
     const panelMode = variant === 'panel';
-    const [focusIndex, setFocusIndex] = React.useState(0);
+    // Focus follows the row's key: team mode reorders the rows, and the roster can shrink.
+    const [focus, setFocus] = React.useState({ index: 0 });
     const scrollRef = React.useRef(null);
     const { rows, columns } = useTerminalSize();
     // Keep top-level children first when the roster includes nested agents.
@@ -35,6 +53,29 @@ export function SubagentDashboard({ subagents, peers, onClose, onSelect, onOpenV
     const nestedRows = subagents.filter(isNestedSpawn);
     const flatRows = subagents.filter(row => !isNestedSpawn(row));
     const ordered = nestedRows.length === 0 ? subagents : [...flatRows, ...nestedRows];
+    const model = team === undefined ? undefined : teamDashboardModel(team, subagents, sessionId);
+    const others = new Set(model?.others);
+    const nested = nestedRows.length;
+    const rowEntry = (subagent) => ({ key: subagent.agentId, subagent, nested: nested > 0 && isNestedSpawn(subagent) });
+    const entries = model === undefined
+        ? ordered.map(rowEntry)
+        : [
+            ...model.teammates.map(row => ({ key: row.member.id, teamRow: row, nested: false, ...row.subagent === undefined ? {} : { subagent: row.subagent } })),
+            ...ordered.filter(row => others.has(row)).map(rowEntry),
+        ];
+    const othersStart = model === undefined ? -1 : model.teammates.length;
+    const focusOf = (state) => {
+        const found = state.key === undefined ? -1 : entries.findIndex(entry => entry.key === state.key);
+        return found >= 0 ? found : Math.min(state.index, Math.max(0, entries.length - 1));
+    };
+    const focusIndex = focusOf(focus);
+    const moveFocus = (delta) => {
+        setFocus((prev) => {
+            const index = Math.max(0, Math.min(entries.length - 1, focusOf(prev) + delta));
+            const key = entries[index]?.key;
+            return key === undefined ? { index } : { index, key };
+        });
+    };
     useInput((input, key, event) => {
         if (panelMode)
             return;
@@ -45,19 +86,19 @@ export function SubagentDashboard({ subagents, peers, onClose, onSelect, onOpenV
         }
         if (key.upArrow) {
             event.stopImmediatePropagation();
-            setFocusIndex(i => Math.max(0, i - 1));
+            moveFocus(-1);
             scrollRef.current?.scrollBy(-3);
             return;
         }
         if (key.downArrow) {
             event.stopImmediatePropagation();
-            setFocusIndex(i => Math.min(ordered.length - 1, i + 1));
+            moveFocus(1);
             scrollRef.current?.scrollBy(3);
             return;
         }
         if (isPlainReturnInput(input, key) && onSelect) {
             event.stopImmediatePropagation();
-            const selected = ordered[focusIndex];
+            const selected = entries[focusIndex]?.subagent;
             if (selected)
                 onSelect(selected.agentId);
             return;
@@ -65,7 +106,7 @@ export function SubagentDashboard({ subagents, peers, onClose, onSelect, onOpenV
         // v = 主屏查看（Enter 仍是详情）。
         if (input.toLowerCase() === 'v' && onOpenView) {
             event.stopImmediatePropagation();
-            const selected = ordered[focusIndex];
+            const selected = entries[focusIndex]?.subagent;
             if (selected)
                 onOpenView(selected.agentId);
             return;
@@ -78,23 +119,23 @@ export function SubagentDashboard({ subagents, peers, onClose, onSelect, onOpenV
         if (key.escape === true || (key.ctrl === true && input === 'c'))
             return false;
         if (key.upArrow === true) {
-            setFocusIndex(i => Math.max(0, i - 1));
+            moveFocus(-1);
             scrollRef.current?.scrollBy(-3);
             return true;
         }
         if (key.downArrow === true) {
-            setFocusIndex(i => Math.min(ordered.length - 1, i + 1));
+            moveFocus(1);
             scrollRef.current?.scrollBy(3);
             return true;
         }
         if (isPanelPlainReturn(input, key)) {
-            const selected = ordered[focusIndex];
+            const selected = entries[focusIndex]?.subagent;
             if (selected !== undefined)
                 onSelect?.(selected.agentId);
             return true;
         }
         if (input.toLowerCase() === 'v' && onOpenView !== undefined) {
-            const selected = ordered[focusIndex];
+            const selected = entries[focusIndex]?.subagent;
             if (selected !== undefined)
                 onOpenView(selected.agentId);
             return true;
@@ -105,13 +146,14 @@ export function SubagentDashboard({ subagents, peers, onClose, onSelect, onOpenV
     const running = subagents.filter(s => s.status === 'running').length;
     const completed = subagents.filter(s => s.status === 'completed').length;
     const failed = subagents.filter(s => s.status === 'failed').length;
-    const nested = nestedRows.length;
+    const memberCount = (status) => model?.teammates.filter(row => row.status === status).length ?? 0;
+    const teamSep = panelMode ? ' · ' : '   ';
     // Full-screen keeps its inset; the panel uses one cell on each side.
     const outer = panelMode
         ? { paddingLeft: 1, paddingRight: 1, paddingTop: 0 }
         : { paddingX: 2, paddingY: 1 };
-    return (_jsxs(Box, { flexDirection: "column", ...outer, children: [!panelMode && _jsx(Divider, { color: "accent", title: t('subagent-dashboard-title') }), _jsxs(Box, { flexDirection: "row", gap: 3, marginTop: panelMode ? 0 : 1, marginBottom: panelMode ? 0 : 1, children: [_jsxs(Text, { children: [_jsx(Text, { color: "accent", children: running }), _jsxs(Text, { dimColor: true, children: [" ", t('subagent-count-running')] })] }), _jsxs(Text, { children: [_jsx(Text, { color: "success", children: completed }), _jsxs(Text, { dimColor: true, children: [" ", t('subagent-count-completed')] })] }), failed > 0 && (_jsxs(Text, { children: [_jsx(Text, { color: "error", children: failed }), _jsxs(Text, { dimColor: true, children: [" ", t('subagent-count-failed')] })] })), nested > 0 && (_jsxs(Text, { children: [_jsx(Text, { color: "accent", children: nested }), _jsxs(Text, { dimColor: true, children: [" ", t('subagent-count-nested')] })] })), _jsx(Box, { flexGrow: 1 }), !panelMode && onClose !== undefined && _jsx(ExitButton, { onClick: onClose })] }), _jsx(Box, { flexDirection: "column", maxHeight: panelMode ? Math.max(6, rows - 4) : Math.max(10, rows - 10), marginTop: panelMode ? 0 : 1, children: _jsx(ScrollBox, { ref: scrollRef, flexDirection: "column", flexGrow: 1, children: subagents.length === 0 ? (_jsxs(Box, { flexDirection: "column", alignItems: "center", marginTop: Math.max(2, Math.floor((rows - 16) / 3)), children: [_jsx(Text, { dimColor: true, children: '○' }), _jsx(Text, { dimColor: true, children: t('subagent-none') }), _jsx(Box, { marginTop: 1, children: _jsx(Text, { dimColor: true, children: t('subagent-empty-hint') }) })] })) : (ordered.map((subagent, index) => (_jsxs(Box, { flexDirection: "column", children: [nested > 0 && isNestedSpawn(subagent) && (_jsx(Text, { dimColor: true, children: '  ↳ ' + t('subagent-nested-mark') })), _jsx(SubagentCard, { subagent: subagent, variant: panelMode ? 'panel' : 'default', focused: index === focusIndex, onClick: onSelect !== undefined
-                                    // Click = view detail, same as Enter on the focused card.
-                                    ? () => onSelect(subagent.agentId)
-                                    : undefined }), messages !== undefined && messages.length > 0 && (_jsx(AgentMessagesSummary, { messages: messages.filter(message => message.from === subagent.agentId || message.to === subagent.agentId), selfAgentId: subagent.agentId })), onOpenView !== undefined && (!panelMode || index === focusIndex) && (_jsx(Box, { paddingLeft: 1, onClick: () => onOpenView(subagent.agentId), children: _jsx(Text, { color: "subtle", children: `⤢ ${t('agent-view-open-action')}` }) })), !panelMode && index < ordered.length - 1 && (_jsx(Text, { dimColor: true, children: '─'.repeat(Math.max(20, Math.min(72, columns - 6))) }))] }, subagent.agentId)))) }) }), peers !== undefined && (!panelMode || peers.length > 0) && (_jsx(Box, { flexDirection: "column", children: panelMode ? (_jsx(Text, { dimColor: true, wrap: "truncate-end", children: t('agents-peers-title') + ' · ' + peers.length })) : (_jsxs(_Fragment, { children: [_jsx(Text, { dimColor: true, children: t('agents-peers-title') }), peers.length === 0 ? (_jsx(Text, { dimColor: true, children: '  ' + t('agents-peers-empty') })) : (_jsxs(Box, { flexDirection: "column", children: [peers.map(peer => (_jsx(Text, { dimColor: true, wrap: "truncate-end", children: '  · ' + (peer.name ?? peer.label ?? peer.agentId.slice(0, 8)) + ' · ' + peer.agentId.slice(0, 8) }, peer.agentId))), _jsx(Text, { dimColor: true, wrap: "truncate-end", children: '  ' + t('agents-peers-note') })] }))] })) })), !panelMode && (_jsxs(_Fragment, { children: [_jsx(Divider, { color: "subtle", title: "" }), _jsx(Box, { children: _jsx(Text, { dimColor: true, children: onSelect ? t('subagent-dashboard-hint-detail') : t('subagent-dashboard-hint-basic') }) })] }))] }));
+    return (_jsxs(Box, { flexDirection: "column", ...outer, children: [!panelMode && _jsx(Divider, { color: "accent", title: t(team === undefined ? 'subagent-dashboard-title' : 'team-dashboard-title') }), _jsxs(Box, { flexDirection: "row", gap: 3, marginTop: panelMode ? 0 : 1, marginBottom: panelMode ? 0 : 1, children: [team !== undefined ? (_jsx(Box, { flexShrink: 1, overflow: "hidden", children: _jsxs(Text, { wrap: "truncate-end", children: [_jsx(Text, { color: "accent", children: memberCount('running') }), _jsx(Text, { dimColor: true, children: ' ' + t('team-status-running') + teamSep }), _jsx(Text, { color: "accent", children: memberCount('idle') }), _jsx(Text, { dimColor: true, children: ' ' + t('team-status-idle') + teamSep }), memberCount('provisioning') > 0 && (_jsxs(_Fragment, { children: [_jsx(Text, { dimColor: true, children: memberCount('provisioning') }), _jsx(Text, { dimColor: true, children: ' ' + t('team-status-provisioning') + teamSep })] })), memberCount('active') > 0 && (_jsxs(_Fragment, { children: [_jsx(Text, { color: "accent", children: memberCount('active') }), _jsx(Text, { dimColor: true, children: ' ' + t('team-status-active') + teamSep })] })), memberCount('failed') > 0 && (_jsxs(_Fragment, { children: [_jsx(Text, { color: "error", children: memberCount('failed') }), _jsx(Text, { dimColor: true, children: ' ' + t('team-status-failed') + teamSep })] })), _jsx(Text, { dimColor: true, children: t('team-tasks-count', teamTaskProgress(team.tasks)) })] }) })) : (_jsxs(_Fragment, { children: [_jsxs(Text, { children: [_jsx(Text, { color: "accent", children: running }), _jsxs(Text, { dimColor: true, children: [" ", t('subagent-count-running')] })] }), _jsxs(Text, { children: [_jsx(Text, { color: "success", children: completed }), _jsxs(Text, { dimColor: true, children: [" ", t('subagent-count-completed')] })] }), failed > 0 && (_jsxs(Text, { children: [_jsx(Text, { color: "error", children: failed }), _jsxs(Text, { dimColor: true, children: [" ", t('subagent-count-failed')] })] })), nested > 0 && (_jsxs(Text, { children: [_jsx(Text, { color: "accent", children: nested }), _jsxs(Text, { dimColor: true, children: [" ", t('subagent-count-nested')] })] }))] })), _jsx(Box, { flexGrow: 1 }), !panelMode && onClose !== undefined && _jsx(ExitButton, { onClick: onClose })] }), team?.failure !== undefined && (_jsx(Text, { color: "error", wrap: "wrap", children: '⚠ ' + t('team-failure', { failure: team.failure }) })), _jsx(Box, { flexDirection: "column", maxHeight: panelMode ? Math.max(6, rows - 4) : Math.max(10, rows - 10), marginTop: panelMode ? 0 : 1, children: _jsxs(ScrollBox, { ref: scrollRef, flexDirection: "column", flexGrow: 1, children: [model !== undefined && (_jsxs(_Fragment, { children: [_jsx(Text, { dimColor: true, children: t('team-members-title') }), _jsx(Text, { dimColor: true, wrap: "truncate-end", children: '  ◆ ' + t(model.viewedFromLead ? 'team-lead-row' : 'team-lead-row-peer') })] })), model === undefined && subagents.length === 0 ? (_jsxs(Box, { flexDirection: "column", alignItems: "center", marginTop: Math.max(2, Math.floor((rows - 16) / 3)), children: [_jsx(Text, { dimColor: true, children: '○' }), _jsx(Text, { dimColor: true, children: t('subagent-none') }), _jsx(Box, { marginTop: 1, children: _jsx(Text, { dimColor: true, children: t('subagent-empty-hint') }) })] })) : (entries.map(({ key, subagent, teamRow, nested: nestedMark }, index) => (_jsxs(Box, { flexDirection: "column", children: [index === othersStart && _jsx(Text, { dimColor: true, children: t('team-others-title') }), nestedMark && (_jsx(Text, { dimColor: true, children: '  ↳ ' + t('subagent-nested-mark') })), subagent === undefined ? (teamRow !== undefined && _jsx(TeamRosterOnlyRow, { row: teamRow, focused: index === focusIndex, panelMode: panelMode, self: teamRow.member.id === sessionId })) : (_jsx(SubagentCard, { subagent: subagent, variant: panelMode ? 'panel' : 'default', focused: index === focusIndex, onClick: onSelect !== undefined
+                                        // Click = view detail, same as Enter on the focused card.
+                                        ? () => onSelect(subagent.agentId)
+                                        : undefined, ...teamRow === undefined ? {} : { teamMember: { name: teamRow.member.name, status: teamRow.status } } })), teamRow?.status === 'failed' && teamRow.member.error !== undefined && (_jsx(Text, { color: "error", wrap: "truncate-end", children: '  │ ' + teamRow.member.error })), teamRow?.status === 'idle' && subagent?.status === 'failed' && (_jsx(Text, { color: "error", wrap: "truncate-end", children: '  │ ' + t('team-last-run-failed', { error: subagent.error ?? '' }).trimEnd() })), subagent !== undefined && messages !== undefined && messages.length > 0 && (_jsx(AgentMessagesSummary, { messages: messages.filter(message => message.from === subagent.agentId || message.to === subagent.agentId), selfAgentId: subagent.agentId })), subagent !== undefined && onOpenView !== undefined && (!panelMode || index === focusIndex) && (_jsx(Box, { paddingLeft: 1, onClick: () => onOpenView(subagent.agentId), children: _jsx(Text, { color: "subtle", children: `⤢ ${t('agent-view-open-action')}` }) })), !panelMode && index < entries.length - 1 && index + 1 !== othersStart && (_jsx(Text, { dimColor: true, children: '─'.repeat(Math.max(20, Math.min(72, columns - 6))) }))] }, key)))), team !== undefined && _jsx(TeamTaskBoard, { tasks: team.tasks })] }) }), peers !== undefined && (!panelMode || peers.length > 0) && (_jsx(Box, { flexDirection: "column", children: panelMode ? (_jsx(Text, { dimColor: true, wrap: "truncate-end", children: t('agents-peers-title') + ' · ' + peers.length })) : (_jsxs(_Fragment, { children: [_jsx(Text, { dimColor: true, children: t('agents-peers-title') }), peers.length === 0 ? (_jsx(Text, { dimColor: true, children: '  ' + t('agents-peers-empty') })) : (_jsxs(Box, { flexDirection: "column", children: [peers.map(peer => (_jsx(Text, { dimColor: true, wrap: "truncate-end", children: '  · ' + (peer.name ?? peer.label ?? peer.agentId.slice(0, 8)) + ' · ' + peer.agentId.slice(0, 8) }, peer.agentId))), _jsx(Text, { dimColor: true, wrap: "truncate-end", children: '  ' + t('agents-peers-note') })] }))] })) })), !panelMode && (_jsxs(_Fragment, { children: [_jsx(Divider, { color: "subtle", title: "" }), _jsx(Box, { children: _jsx(Text, { dimColor: true, children: onSelect ? t('subagent-dashboard-hint-detail') : t('subagent-dashboard-hint-basic') }) })] }))] }));
 }

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

@@ -1,5 +1,5 @@
 import React from 'react';
-import { type SelectOption } from './Select.js';
+import type { SelectOption } from './Select.js';
 import type { TuiThemeHost } from '../dsh-adapter/themes.js';
 /**
  * Build the full selectable list from the shared catalog: `auto`, built-ins,

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

@@ -1 +1 @@
-{"version":3,"file":"ThemePicker.d.ts","sourceRoot":"","sources":["../../../src/components/ThemePicker.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,OAAO,EAAU,KAAK,YAAY,EAAE,MAAM,aAAa,CAAA;AAMvD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAiF5D;;;;GAIG;AACH,wBAAgB,eAAe,CAAC,SAAS,CAAC,EAAE,YAAY,GAAG,YAAY,EAAE,CAExE;AAgBD;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,WAAW,CAAC,EAC1B,UAAU,EACV,YAAY,EACZ,SAAS,EACT,MAAM,GACP,EAAE;IACD,UAAU,EAAE,MAAM,CAAA;IAClB,YAAY,EAAE,MAAM,GAAG,SAAS,CAAA;IAChC,kEAAkE;IAClE,SAAS,CAAC,EAAE,YAAY,CAAA;IACxB;qDACiD;IACjD,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;CACjC,GAAG,KAAK,CAAC,SAAS,CA+DlB"}
+{"version":3,"file":"ThemePicker.d.ts","sourceRoot":"","sources":["../../../src/components/ThemePicker.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAA;AAQ/C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAA;AA4E5D;;;;GAIG;AACH,wBAAgB,eAAe,CAAC,SAAS,CAAC,EAAE,YAAY,GAAG,YAAY,EAAE,CAExE;AAgBD;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,WAAW,CAAC,EAC1B,UAAU,EACV,YAAY,EACZ,SAAS,EACT,MAAM,GACP,EAAE;IACD,UAAU,EAAE,MAAM,CAAA;IAClB,YAAY,EAAE,MAAM,GAAG,SAAS,CAAA;IAChC,kEAAkE;IAClE,SAAS,CAAC,EAAE,YAAY,CAAA;IACxB;qDACiD;IACjD,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;CACjC,GAAG,KAAK,CAAC,SAAS,CA2ElB"}

package/lib/types/components/ThemePicker.js

@@ -3,7 +3,8 @@ import React from 'react';
 import { t } from '../i18n.js';
 import { Box, Text, useTerminalSize } from '../ui.js';
 import { Pane } from './design-system/Pane.js';
-import { Select } from './Select.js';
+import { ListItem } from './design-system/ListItem.js';
+import { listWindow } from './listWindow.js';
 import { HintLine } from './design-system/HintLine.js';
 import { ThemePreviewPane } from './ThemePreviewPane.js';
 import { useOverlayListRows } from './OverlayAbove.js';
@@ -13,8 +14,6 @@ import { useRuntimeThemeSnapshot } from '../hooks/useRuntimeThemeSnapshot.js';
 const SWATCH = '██';
 /** Theme keys previewed in the picker, chosen for visual contrast. */
 const SWATCH_KEYS = ['accent', 'text', 'success'];
-/** 列表窗口行数（Select visibleOptionCount）——也是堆叠布局里列表占的行数。 */
-const LIST_ROWS = 6;
 /**
  * 面板自占的行数（不含列表/预览本体）：Pane 的上边距 + 分隔线 2 行、标题 1 行、
  * 标题下边距 1 行、底部提示 1 行。用来把浮层高度预算换算成"内容可用行数"。
@@ -31,11 +30,9 @@ const PREVIEW_MAX_COLUMNS = 48;
 /** 预览少于这个行数就整块不画：画半张工具卡比不画更难看，还白占浮层高度。 */
 const PREVIEW_MIN_ROWS = 5;
 /**
- * 堆叠布局里列表真实占的行数：每项 2 行（label + 描述），窗口最多 LIST_ROWS 项，
- * 另留 2 行给描述换行与滚动箭头。**不能按 LIST_ROWS 算**——浮层的溢出方向是
- * 从顶部裁，少算的每一行都会把列表本身顶出可视区（verify-theme-preview 的 F 组）。
+ * 堆叠布局为列表预留最多 12 行；ListItem 的标签与描述各占一行。
  */
-const LIST_RESERVE_ROWS = 2 * LIST_ROWS + 2;
+const LIST_RESERVE_ROWS = 12;
 function swatches(theme) {
     return (_jsx(_Fragment, { children: SWATCH_KEYS.map(key => (_jsx(Text, { color: theme[key], children: SWATCH }, key))) }));
 }
@@ -54,7 +51,7 @@ function optionsFrom(entries) {
         const description = item.source === 'auto'
             ? t('theme-auto-base')
             : item.source === 'builtin'
-                ? t('theme-builtin-base', { name: item.name })
+                ? t('theme-builtin-base', { base })
                 : item.source === 'runtime'
                     ? t('theme-plugin-base', { base, name: item.name })
                     : t('theme-user-base', { base, name: item.name });
@@ -109,11 +106,17 @@ export function ThemePicker({ focusIndex, currentTheme, themeHost, onPick, }) {
     // max(列表, 预览)——预览比列表矮就一分高度都不加，所以直接吃满预算；
     // 堆叠时预览是**加在列表下面**的净增量，必须先扣掉列表真实占的行数和
     // 那 1 行间隔，否则多出来的预览会把列表顶出浮层（溢出从顶部裁）。
-    const contentRows = useOverlayListRows(FRAME_ROWS);
-    const previewRows = sideBySide ? contentRows : contentRows - LIST_RESERVE_ROWS - 1;
+    const contentRows = useOverlayListRows(FRAME_ROWS + 1);
+    const reservedListRows = Math.min(LIST_RESERVE_ROWS, options.length * 2, contentRows);
+    const previewRows = sideBySide ? contentRows : contentRows - reservedListRows - 1;
     const focused = entries[focusIndex] ?? entries[0];
     const preview = focused !== undefined && previewRows >= PREVIEW_MIN_ROWS
         ? (_jsx(ThemePreviewPane, { entry: focused, rows: previewRows, width: sideBySide ? previewColumns : contentColumns }))
         : undefined;
-    return (_jsxs(Pane, { color: "permission", children: [_jsxs(Box, { flexDirection: sideBySide ? 'row' : 'column', children: [_jsxs(Box, { flexDirection: "column", width: sideBySide ? listColumns : undefined, children: [_jsx(Box, { marginBottom: 1, children: _jsx(Text, { color: "remember", bold: true, children: t('picker-title-theme') }) }), _jsx(Select, { options: options, focusIndex: focusIndex, selectedValue: currentTheme, visibleOptionCount: LIST_ROWS, onPick: onPick ? index => onPick(index) : undefined }), _jsx(Text, { dimColor: true, italic: true, children: _jsx(HintLine, { text: t('hint-confirm-exit') }) })] }), sideBySide && preview !== undefined && (_jsx(Box, { flexDirection: "column", marginLeft: 2, width: previewColumns, children: preview }))] }), !sideBySide && preview !== undefined && (_jsx(Box, { flexDirection: "column", marginTop: 1, children: preview }))] }));
+    const listRows = !sideBySide && preview !== undefined ? reservedListRows : contentRows;
+    const { start, end } = listWindow(options.map(() => 2), focusIndex, listRows);
+    return (_jsxs(Pane, { color: "permission", children: [_jsxs(Box, { flexDirection: sideBySide ? 'row' : 'column', children: [_jsxs(Box, { flexDirection: "column", width: sideBySide ? listColumns : undefined, children: [_jsx(Box, { marginBottom: 1, children: _jsx(Text, { color: "remember", bold: true, children: t('picker-title-theme') }) }), options.slice(start, end).map((option, index) => {
+                                const absoluteIndex = start + index;
+                                return (_jsx(ListItem, { isFocused: absoluteIndex === focusIndex, isSelected: option.value === currentTheme, description: option.description, showScrollUp: absoluteIndex === start && start > 0, showScrollDown: absoluteIndex === end - 1 && end < options.length, onClick: onPick ? () => onPick(absoluteIndex) : undefined, children: option.label }, option.value));
+                            }), _jsx(Text, { dimColor: true, italic: true, children: _jsx(HintLine, { text: t('hint-confirm-exit') }) })] }), sideBySide && preview !== undefined && (_jsx(Box, { flexDirection: "column", marginLeft: 2, width: previewColumns, children: preview }))] }), !sideBySide && preview !== undefined && (_jsx(Box, { flexDirection: "column", marginTop: 1, children: preview }))] }));
 }

package/lib/types/components/Tooltip.js

@@ -140,6 +140,7 @@ export function TooltipTarget({ content, children, }) {
  */
 export function TooltipLayer({ invalidationKey, subscribeInvalidation, } = {}) {
     const { columns, rows } = useTerminalSize();
+    const inset = React.useContext(PageInsetContext);
     const terminalFocused = useTerminalFocus();
     const tooltip = React.useSyncExternalStore(subscribeTooltip, getTooltipSnapshot);
     // A text selection and a floating tooltip are mutually exclusive: the copy
@@ -216,7 +217,6 @@ export function TooltipLayer({ invalidationKey, subscribeInvalidation, } = {}) {
     // (the earlier bug) moved the whole card by the page margin — with the
     // default margin one row low and two columns right, so its bottom border
     // landed ON the hovered row and that row's glyphs showed beside the card.
-    const inset = React.useContext(PageInsetContext);
     const anchorRow = tooltip.anchorRow - inset.y;
     const anchorCol = tooltip.anchorCol - inset.x;
     const topAbove = anchorRow - height;

package/lib/types/components/WorkingSpinner.js

@@ -4,7 +4,7 @@ import { useTerminalSize } from '../ink/hooks/use-terminal-size.js';
 import { Box } from '../ui.js';
 import { SpinnerAnimationRow } from './Spinner/SpinnerAnimationRow.js';
 import { tOr } from '../i18n.js';
-import { sample } from 'lodash-es';
+import sample from 'lodash-es/sample.js';
 /**
  * Which verbs fit which spinner phase: the working line's copy follows the
  * turn's stage (waiting → thinking → tools → responding) instead of one

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

@@ -1 +1 @@
-{"version":3,"file":"WorkspaceFlowPicker.d.ts","sourceRoot":"","sources":["../../../src/components/WorkspaceFlowPicker.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAA;AAO1D,8EAA8E;AAC9E,wBAAgB,mBAAmB,CAAC,EAClC,KAAK,EACL,OAAO,EACP,UAAU,EACV,IAAY,EACZ,KAAY,EACZ,MAAM,GACP,EAAE;IACD,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,EAAE,SAAS,kBAAkB,EAAE,CAAA;IACtC,UAAU,EAAE,MAAM,CAAA;IAClB,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,KAAK,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAC;QAAC,WAAW,CAAC,EAAE,MAAM,CAAA;KAAE,GAAG,IAAI,CAAA;IACtE;;;2CAGuC;IACvC,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;CACjC,GAAG,KAAK,CAAC,SAAS,CA0DlB"}
+{"version":3,"file":"WorkspaceFlowPicker.d.ts","sourceRoot":"","sources":["../../../src/components/WorkspaceFlowPicker.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAA;AAO1D,8EAA8E;AAC9E,wBAAgB,mBAAmB,CAAC,EAClC,KAAK,EACL,OAAO,EACP,UAAU,EACV,IAAY,EACZ,KAAY,EACZ,MAAM,GACP,EAAE;IACD,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,EAAE,SAAS,kBAAkB,EAAE,CAAA;IACtC,UAAU,EAAE,MAAM,CAAA;IAClB,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,KAAK,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAC;QAAC,WAAW,CAAC,EAAE,MAAM,CAAA;KAAE,GAAG,IAAI,CAAA;IACtE;;;2CAGuC;IACvC,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;CACjC,GAAG,KAAK,CAAC,SAAS,CA4DlB"}