thaddeus 1.0.26 → 1.0.28

package/src/components/Spinner/SpinnerAnimationRow.js

@@ -0,0 +1,170 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { c as _c } from "react/compiler-runtime";
+import figures from 'figures';
+import * as React from 'react';
+import { useMemo, useRef } from 'react';
+import { stringWidth } from '../../ink/stringWidth.js';
+import { Box, Text, useAnimationFrame } from '../../ink.js';
+import { formatDuration, formatNumber } from '../../utils/format.js';
+import { toInkColor } from '../../utils/ink.js';
+import { Byline } from '../design-system/Byline.js';
+import { GlimmerMessage } from './GlimmerMessage.js';
+import { SpinnerGlyph } from './SpinnerGlyph.js';
+import { useStalledAnimation } from './useStalledAnimation.js';
+import { interpolateColor, toRGBColor } from './utils.js';
+const SEP_WIDTH = stringWidth(' · ');
+const THINKING_BARE_WIDTH = stringWidth('reasoning');
+const SHOW_TOKENS_AFTER_MS = 30_000;
+// Thinking shimmer constants. Previously lived in a separate ThinkingShimmerText
+// component with its own useAnimationFrame(50) — inlined here to reuse our
+// existing 50ms clock and eliminate the redundant subscriber.
+const THINKING_INACTIVE = {
+    r: 153,
+    g: 153,
+    b: 153
+};
+const THINKING_INACTIVE_SHIMMER = {
+    r: 185,
+    g: 185,
+    b: 185
+};
+const THINKING_DELAY_MS = 3000;
+const THINKING_GLOW_PERIOD_S = 2;
+/**
+ * The 50ms-animated portion of SpinnerWithVerb. Owns useAnimationFrame(50)
+ * and all values derived from the animation clock (frame, glimmer, token
+ * counter animation, elapsed-time, stalled intensity, thinking shimmer).
+ *
+ * The parent SpinnerWithVerb is freed from the 50ms render loop and only
+ * re-renders when its props/app state change (~25x/turn instead of ~383x).
+ * That keeps the outer Box shells, useAppState selectors, task filtering,
+ * and tip/tree subtrees out of the hot animation path.
+ */
+export function SpinnerAnimationRow({ mode, reducedMotion, hasActiveTools, responseLengthRef, message, messageColor, shimmerColor, overrideColor, loadingStartTimeRef, totalPausedMsRef, pauseStartTimeRef, spinnerSuffix, verbose, columns, hasRunningTeammates, teammateTokens, foregroundedTeammate, leaderIsIdle = false, thinkingStatus, effortSuffix }) {
+    const [viewportRef, time] = useAnimationFrame(reducedMotion ? null : 50);
+    // === Elapsed time (wall-clock, derived from refs each frame) ===
+    const now = Date.now();
+    const elapsedTimeMs = pauseStartTimeRef.current !== null ? pauseStartTimeRef.current - loadingStartTimeRef.current - totalPausedMsRef.current : now - loadingStartTimeRef.current - totalPausedMsRef.current;
+    // Track wall-clock turn start for teammates. While a swarm is running the
+    // leader's elapsedTimeMs may jump around (new API calls reset
+    // loadingStartTimeRef; pauses freeze it), so we anchor to the earliest
+    // derived start seen so far. When no teammates are running this just tracks
+    // derivedStart every frame, effectively resetting for the next swarm.
+    const derivedStart = now - elapsedTimeMs;
+    const turnStartRef = useRef(derivedStart);
+    if (!hasRunningTeammates || derivedStart < turnStartRef.current) {
+        turnStartRef.current = derivedStart;
+    }
+    // === Animation derivations from `time` ===
+    const currentResponseLength = responseLengthRef.current;
+    // Suppress stall detection when leader is idle — responseLengthRef and
+    // hasActiveTools both track leader state. When viewing an active teammate
+    // while leader is idle, they'd otherwise flag a false stall after 3s.
+    // Treating leaderIsIdle like hasActiveTools resets the stall timer.
+    const { isStalled, stalledIntensity } = useStalledAnimation(time, currentResponseLength, hasActiveTools || leaderIsIdle, reducedMotion);
+    const frame = reducedMotion ? 0 : Math.floor(time / 120);
+    const glimmerSpeed = mode === 'requesting' ? 50 : 200;
+    // message is stable within a turn; stringWidth is expensive enough (Bun native
+    // call per code point) to memoize explicitly across the 50ms loop.
+    const glimmerMessageWidth = useMemo(() => stringWidth(message), [message]);
+    const cycleLength = glimmerMessageWidth + 20;
+    const cyclePosition = Math.floor(time / glimmerSpeed);
+    const glimmerIndex = reducedMotion ? -100 : isStalled ? -100 : mode === 'requesting' ? cyclePosition % cycleLength - 10 : glimmerMessageWidth + 10 - cyclePosition % cycleLength;
+    const flashOpacity = reducedMotion ? 0 : mode === 'tool-use' ? (Math.sin(time / 1000 * Math.PI) + 1) / 2 : 0;
+    // === Token counter animation (smooth increment, driven by 50ms clock) ===
+    const tokenCounterRef = useRef(currentResponseLength);
+    if (reducedMotion) {
+        tokenCounterRef.current = currentResponseLength;
+    }
+    else {
+        const gap = currentResponseLength - tokenCounterRef.current;
+        if (gap > 0) {
+            let increment;
+            if (gap < 70) {
+                increment = 3;
+            }
+            else if (gap < 200) {
+                increment = Math.max(8, Math.ceil(gap * 0.15));
+            }
+            else {
+                increment = 50;
+            }
+            tokenCounterRef.current = Math.min(tokenCounterRef.current + increment, currentResponseLength);
+        }
+    }
+    const displayedResponseLength = tokenCounterRef.current;
+    const leaderTokens = Math.round(displayedResponseLength / 4);
+    const effectiveElapsedMs = hasRunningTeammates ? Math.max(elapsedTimeMs, now - turnStartRef.current) : elapsedTimeMs;
+    const timerText = formatDuration(effectiveElapsedMs);
+    const timerWidth = stringWidth(timerText);
+    // === Token count (leader + teammates, or foregrounded teammate) ===
+    const totalTokens = foregroundedTeammate && !foregroundedTeammate.isIdle ? foregroundedTeammate.progress?.tokenCount ?? 0 : leaderTokens + teammateTokens;
+    const tokenCount = formatNumber(totalTokens);
+    const tokensText = hasRunningTeammates ? `${tokenCount} tokens` : `${figures.arrowDown} ${tokenCount} tokens`;
+    const tokensWidth = stringWidth(tokensText);
+    // === Thinking text (may shrink to fit) ===
+    let thinkingText = thinkingStatus === 'thinking' ? `reasoning${effortSuffix}` : typeof thinkingStatus === 'number' ? `reasoned for ${Math.max(1, Math.round(thinkingStatus / 1000))}s` : null;
+    let thinkingWidthValue = thinkingText ? stringWidth(thinkingText) : 0;
+    // === Progressive width gating ===
+    const messageWidth = glimmerMessageWidth + 2;
+    const sep = SEP_WIDTH;
+    const wantsThinking = thinkingStatus !== null;
+    const wantsTimerAndTokens = verbose || hasRunningTeammates || effectiveElapsedMs > SHOW_TOKENS_AFTER_MS;
+    const availableSpace = columns - messageWidth - 5;
+    let showThinking = wantsThinking && availableSpace > thinkingWidthValue;
+    if (!showThinking && wantsThinking && thinkingStatus === 'thinking' && effortSuffix) {
+        if (availableSpace > THINKING_BARE_WIDTH) {
+            thinkingText = 'reasoning';
+            thinkingWidthValue = THINKING_BARE_WIDTH;
+            showThinking = true;
+        }
+    }
+    const usedAfterThinking = showThinking ? thinkingWidthValue + sep : 0;
+    const showTimer = wantsTimerAndTokens && availableSpace > usedAfterThinking + timerWidth;
+    const usedAfterTimer = usedAfterThinking + (showTimer ? timerWidth + sep : 0);
+    const showTokens = wantsTimerAndTokens && totalTokens > 0 && availableSpace > usedAfterTimer + tokensWidth;
+    const thinkingOnly = showThinking && thinkingStatus === 'thinking' && !spinnerSuffix && !showTimer && !showTokens && true;
+    // === Thinking shimmer color (formerly ThinkingShimmerText's own timer) ===
+    // Same sine-wave opacity, but derived from our shared `time` instead of a
+    // second useAnimationFrame(50) subscription.
+    const thinkingElapsedSec = (time - THINKING_DELAY_MS) / 1000;
+    const thinkingOpacity = time < THINKING_DELAY_MS ? 0 : (Math.sin(thinkingElapsedSec * Math.PI * 2 / THINKING_GLOW_PERIOD_S) + 1) / 2;
+    const thinkingShimmerColor = toRGBColor(interpolateColor(THINKING_INACTIVE, THINKING_INACTIVE_SHIMMER, thinkingOpacity));
+    // === Build status parts ===
+    const parts = [...(spinnerSuffix ? [_jsx(Text, { dimColor: true, children: spinnerSuffix }, "suffix")] : []), ...(showTimer ? [_jsx(Text, { dimColor: true, children: timerText }, "elapsedTime")] : []), ...(showTokens ? [_jsxs(Box, { flexDirection: "row", children: [!hasRunningTeammates && _jsx(SpinnerModeGlyph, { mode: mode }), _jsxs(Text, { dimColor: true, children: [tokenCount, " tokens"] })] }, "tokens")] : []), ...(showThinking && thinkingText ? [thinkingStatus === 'thinking' && !reducedMotion ? _jsx(Text, { color: thinkingShimmerColor, children: thinkingOnly ? `(${thinkingText})` : thinkingText }, "thinking") : _jsx(Text, { dimColor: true, children: thinkingText }, "thinking")] : [])];
+    const status = foregroundedTeammate && !foregroundedTeammate.isIdle ? _jsxs(_Fragment, { children: [_jsx(Text, { dimColor: true, children: "(esc to interrupt " }), _jsx(Text, { color: toInkColor(foregroundedTeammate.identity.color), children: foregroundedTeammate.identity.agentName }), _jsx(Text, { dimColor: true, children: ")" })] }) : !foregroundedTeammate && parts.length > 0 ? thinkingOnly ? _jsx(Byline, { children: parts }) : _jsxs(_Fragment, { children: [_jsx(Text, { dimColor: true, children: "(" }), _jsx(Byline, { children: parts }), _jsx(Text, { dimColor: true, children: ")" })] }) : null;
+    return _jsxs(Box, { ref: viewportRef, flexDirection: "row", flexWrap: "wrap", marginTop: 1, width: "100%", children: [_jsx(SpinnerGlyph, { frame: frame, messageColor: messageColor, stalledIntensity: overrideColor ? 0 : stalledIntensity, reducedMotion: reducedMotion, time: time }), _jsx(GlimmerMessage, { message: message, mode: mode, messageColor: messageColor, glimmerIndex: glimmerIndex, flashOpacity: flashOpacity, shimmerColor: shimmerColor, stalledIntensity: overrideColor ? 0 : stalledIntensity }), status] });
+}
+function SpinnerModeGlyph(t0) {
+    const $ = _c(2);
+    const { mode } = t0;
+    switch (mode) {
+        case "tool-input":
+        case "tool-use":
+        case "responding":
+        case "thinking":
+            {
+                let t1;
+                if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+                    t1 = _jsx(Box, { width: 2, children: _jsx(Text, { dimColor: true, children: figures.arrowDown }) });
+                    $[0] = t1;
+                }
+                else {
+                    t1 = $[0];
+                }
+                return t1;
+            }
+        case "requesting":
+            {
+                let t1;
+                if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
+                    t1 = _jsx(Box, { width: 2, children: _jsx(Text, { dimColor: true, children: figures.arrowUp }) });
+                    $[1] = t1;
+                }
+                else {
+                    t1 = $[1];
+                }
+                return t1;
+            }
+    }
+}

package/src/components/Spinner/SpinnerGlyph.js

@@ -0,0 +1,70 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { c as _c } from "react/compiler-runtime";
+import * as React from 'react';
+import { Box, Text, useTheme } from '../../ink.js';
+import { getTheme } from '../../utils/theme.js';
+import { getDefaultCharacters, interpolateColor, parseRGB, toRGBColor } from './utils.js';
+const DEFAULT_CHARACTERS = getDefaultCharacters();
+const SPINNER_FRAMES = [...DEFAULT_CHARACTERS, ...[...DEFAULT_CHARACTERS].reverse()];
+const REDUCED_MOTION_DOT = '●';
+const REDUCED_MOTION_CYCLE_MS = 2000; // 2-second cycle: 1s visible, 1s dim
+const ERROR_RED = {
+    r: 171,
+    g: 43,
+    b: 63
+};
+export function SpinnerGlyph(t0) {
+    const $ = _c(9);
+    const { frame, messageColor, stalledIntensity: t1, reducedMotion: t2, time: t3 } = t0;
+    const stalledIntensity = t1 === undefined ? 0 : t1;
+    const reducedMotion = t2 === undefined ? false : t2;
+    const time = t3 === undefined ? 0 : t3;
+    const [themeName] = useTheme();
+    const theme = getTheme(themeName);
+    if (reducedMotion) {
+        const isDim = Math.floor(time / (REDUCED_MOTION_CYCLE_MS / 2)) % 2 === 1;
+        let t4;
+        if ($[0] !== isDim || $[1] !== messageColor) {
+            t4 = _jsx(Box, { flexWrap: "wrap", height: 1, width: 2, children: _jsx(Text, { color: messageColor, dimColor: isDim, children: REDUCED_MOTION_DOT }) });
+            $[0] = isDim;
+            $[1] = messageColor;
+            $[2] = t4;
+        }
+        else {
+            t4 = $[2];
+        }
+        return t4;
+    }
+    const spinnerChar = SPINNER_FRAMES[frame % SPINNER_FRAMES.length];
+    if (stalledIntensity > 0) {
+        const baseColorStr = theme[messageColor];
+        const baseRGB = baseColorStr ? parseRGB(baseColorStr) : null;
+        if (baseRGB) {
+            const interpolated = interpolateColor(baseRGB, ERROR_RED, stalledIntensity);
+            return _jsx(Box, { flexWrap: "wrap", height: 1, width: 2, children: _jsx(Text, { color: toRGBColor(interpolated), children: spinnerChar }) });
+        }
+        const color = stalledIntensity > 0.5 ? "error" : messageColor;
+        let t4;
+        if ($[3] !== color || $[4] !== spinnerChar) {
+            t4 = _jsx(Box, { flexWrap: "wrap", height: 1, width: 2, children: _jsx(Text, { color: color, children: spinnerChar }) });
+            $[3] = color;
+            $[4] = spinnerChar;
+            $[5] = t4;
+        }
+        else {
+            t4 = $[5];
+        }
+        return t4;
+    }
+    let t4;
+    if ($[6] !== messageColor || $[7] !== spinnerChar) {
+        t4 = _jsx(Box, { flexWrap: "wrap", height: 1, width: 2, children: _jsx(Text, { color: messageColor, children: spinnerChar }) });
+        $[6] = messageColor;
+        $[7] = spinnerChar;
+        $[8] = t4;
+    }
+    else {
+        t4 = $[8];
+    }
+    return t4;
+}

package/src/components/Spinner/TeammateSpinnerLine.js

@@ -0,0 +1,171 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import figures from 'figures';
+import sample from 'lodash-es/sample.js';
+import * as React from 'react';
+import { useRef, useState } from 'react';
+import { getSpinnerVerbs } from '../../constants/spinnerVerbs.js';
+import { TURN_COMPLETION_VERBS } from '../../constants/turnCompletionVerbs.js';
+import { useElapsedTime } from '../../hooks/useElapsedTime.js';
+import { useTerminalSize } from '../../hooks/useTerminalSize.js';
+import { stringWidth } from '../../ink/stringWidth.js';
+import { Box, Text } from '../../ink.js';
+import { summarizeRecentActivities } from '../../utils/collapseReadSearch.js';
+import { formatDuration, formatNumber, truncateToWidth } from '../../utils/format.js';
+import { toInkColor } from '../../utils/ink.js';
+import { TEAMMATE_SELECT_HINT } from './teammateSelectHint.js';
+/**
+ * Extract the last 3 lines of content from a teammate's conversation.
+ * Shows recent activity from any message type (user or assistant).
+ */
+function getMessagePreview(messages) {
+    if (!messages?.length)
+        return [];
+    const allLines = [];
+    const maxLineLength = 80;
+    // Collect lines from recent messages (newest first)
+    for (let i = messages.length - 1; i >= 0 && allLines.length < 3; i--) {
+        const msg = messages[i];
+        // Only process messages that have content (user/assistant messages)
+        if (!msg || msg.type !== 'user' && msg.type !== 'assistant' || !msg.message?.content?.length) {
+            continue;
+        }
+        const content = msg.message.content;
+        for (const block of content) {
+            if (allLines.length >= 3)
+                break;
+            if (!block || typeof block !== 'object')
+                continue;
+            if ('type' in block && block.type === 'tool_use' && 'name' in block) {
+                // Try to show meaningful info from tool input
+                const input = 'input' in block ? block.input : null;
+                let toolLine = `Using ${block.name}…`;
+                if (input) {
+                    // Look for common descriptive fields
+                    const desc = input.description || input.prompt || input.command || input.query || input.pattern;
+                    if (desc) {
+                        toolLine = desc.split('\n')[0] ?? toolLine;
+                    }
+                }
+                allLines.push(truncateToWidth(toolLine, maxLineLength));
+            }
+            else if ('type' in block && block.type === 'text' && 'text' in block) {
+                const textLines = block.text.split('\n').filter(l => l.trim());
+                // Take from end of text (most recent lines)
+                for (let j = textLines.length - 1; j >= 0 && allLines.length < 3; j--) {
+                    const line = textLines[j];
+                    if (!line)
+                        continue;
+                    allLines.push(truncateToWidth(line, maxLineLength));
+                }
+            }
+        }
+    }
+    // Reverse so oldest of the 3 is first (reading order)
+    return allLines.reverse();
+}
+export function TeammateSpinnerLine({ teammate, isLast, isSelected, isForegrounded, allIdle, showPreview }) {
+    const [randomVerb] = useState(() => teammate.spinnerVerb ?? sample(getSpinnerVerbs()));
+    const [pastTenseVerb] = useState(() => teammate.pastTenseVerb ?? sample(TURN_COMPLETION_VERBS));
+    const isHighlighted = isSelected || isForegrounded;
+    const treeChar = isHighlighted ? isLast ? '╘═' : '╞═' : isLast ? '└─' : '├─';
+    const nameColor = toInkColor(teammate.identity.color);
+    const { columns } = useTerminalSize();
+    // Track when teammate became idle (for "Idle for X..." display)
+    const idleStartRef = useRef(null);
+    // Freeze elapsed time when entering all-idle state
+    const frozenDurationRef = useRef(null);
+    // Track idle start time
+    if (teammate.isIdle && idleStartRef.current === null) {
+        idleStartRef.current = Date.now();
+    }
+    else if (!teammate.isIdle) {
+        idleStartRef.current = null;
+    }
+    // Reset frozen duration when leaving all-idle state
+    if (!allIdle && frozenDurationRef.current !== null) {
+        frozenDurationRef.current = null;
+    }
+    // Get elapsed idle time (how long they've been idle) - for "Idle for X..." display
+    const idleElapsedTime = useElapsedTime(idleStartRef.current ?? Date.now(), teammate.isIdle && !allIdle);
+    // Freeze the duration when we first detect all idle
+    // Use the teammate's actual work time (since task started) for the past-tense display
+    if (allIdle && frozenDurationRef.current === null) {
+        frozenDurationRef.current = formatDuration(Math.max(0, Date.now() - teammate.startTime - (teammate.totalPausedMs ?? 0)));
+    }
+    // Use frozen work duration when all idle, otherwise use idle elapsed time
+    const displayTime = allIdle ? frozenDurationRef.current ?? (() => {
+        throw new Error(`frozenDurationRef is null for idle teammate ${teammate.identity.agentName}`);
+    })() : idleElapsedTime;
+    // Layout: paddingLeft(3) + pointer(1) + space(1) + treeChar(2) + space(1) = 8 fixed chars
+    // Then optionally: @name + ": " OR just ": "
+    // Then: activity text + optional extras (stats, hints)
+    const basePrefix = 8;
+    const fullAgentName = `@${teammate.identity.agentName}`;
+    const fullNameWidth = stringWidth(fullAgentName);
+    // Get stats from progress
+    const toolUseCount = teammate.progress?.toolUseCount ?? 0;
+    const tokenCount = teammate.progress?.tokenCount ?? 0;
+    const statsText = ` · ${toolUseCount} tool ${toolUseCount === 1 ? 'use' : 'uses'} · ${formatNumber(tokenCount)} tokens`;
+    const statsWidth = stringWidth(statsText);
+    const selectHintText = ` · ${TEAMMATE_SELECT_HINT}`;
+    const selectHintWidth = stringWidth(selectHintText);
+    const viewHintText = ' · enter to view';
+    const viewHintWidth = stringWidth(viewHintText);
+    // Progressive responsive layout:
+    // Wide (80+): full name + activity + stats + hint
+    // Medium (60-80): full name + activity
+    // Narrow (<60): hide name, just show activity
+    const minActivityWidth = 25;
+    // Hide name on narrow terminals (< 60 cols) or if there's not enough room
+    const spaceWithFullName = columns - basePrefix - fullNameWidth - 2;
+    const showName = columns >= 60 && spaceWithFullName >= minActivityWidth;
+    const nameWidth = showName ? fullNameWidth + 2 : 0; // +2 for ": " when name shown
+    const availableForActivity = columns - basePrefix - nameWidth;
+    // Progressive hiding: view hint → select hint → stats
+    // Stats always visible (dimmed when not selected); hints only when highlighted/selected
+    const showViewHint = isSelected && !isForegrounded && availableForActivity > viewHintWidth + statsWidth + minActivityWidth + 5;
+    const showSelectHint = isHighlighted && availableForActivity > selectHintWidth + (showViewHint ? viewHintWidth : 0) + statsWidth + minActivityWidth + 5;
+    const showStats = availableForActivity > statsWidth + minActivityWidth + 5;
+    // Activity text gets remaining space
+    const extrasCost = (showStats ? statsWidth : 0) + (showSelectHint ? selectHintWidth : 0) + (showViewHint ? viewHintWidth : 0);
+    const activityMaxWidth = Math.max(minActivityWidth, availableForActivity - extrasCost - 1);
+    // Format the activity text for active teammates, rolling up search/read ops
+    const activityText = (() => {
+        const activities = teammate.progress?.recentActivities;
+        if (activities && activities.length > 0) {
+            const summary = summarizeRecentActivities(activities);
+            if (summary)
+                return truncateToWidth(summary, activityMaxWidth);
+        }
+        const desc = teammate.progress?.lastActivity?.activityDescription;
+        if (desc)
+            return truncateToWidth(desc, activityMaxWidth);
+        return randomVerb;
+    })();
+    // Status rendering logic
+    const renderStatus = () => {
+        if (teammate.shutdownRequested) {
+            return _jsx(Text, { dimColor: true, children: "[stopping]" });
+        }
+        if (teammate.awaitingPlanApproval) {
+            return _jsx(Text, { color: "warning", children: "[awaiting approval]" });
+        }
+        if (teammate.isIdle) {
+            if (allIdle) {
+                return _jsxs(Text, { dimColor: true, children: [pastTenseVerb, " for ", displayTime] });
+            }
+            return _jsxs(Text, { dimColor: true, children: ["Idle for ", idleElapsedTime] });
+        }
+        // Active - show spinner glyph + activity description (only when not highlighted;
+        // when highlighted, the main spinner above already shows the verb)
+        if (isHighlighted) {
+            return null;
+        }
+        return _jsx(Text, { dimColor: true, children: activityText?.endsWith('…') ? activityText : `${activityText}…` });
+    };
+    // Get preview lines if enabled
+    const previewLines = showPreview ? getMessagePreview(teammate.messages) : [];
+    // Tree continuation character for preview lines
+    const previewTreeChar = isLast ? '   ' : '│  ';
+    return _jsxs(Box, { flexDirection: "column", children: [_jsxs(Box, { paddingLeft: 3, children: [_jsx(Text, { color: isSelected ? 'suggestion' : undefined, bold: isSelected, children: isSelected ? figures.pointer : ' ' }), _jsxs(Text, { dimColor: !isSelected, children: [treeChar, " "] }), showName && _jsxs(Text, { color: isSelected ? 'suggestion' : nameColor, children: ["@", teammate.identity.agentName] }), showName && _jsx(Text, { dimColor: !isSelected, children: ": " }), renderStatus(), showStats && _jsxs(Text, { dimColor: true, children: [' ', "\u00B7 ", toolUseCount, " tool ", toolUseCount === 1 ? 'use' : 'uses', " \u00B7", ' ', formatNumber(tokenCount), " tokens"] }), showSelectHint && _jsxs(Text, { dimColor: true, children: [" \u00B7 ", TEAMMATE_SELECT_HINT] }), showViewHint && _jsx(Text, { dimColor: true, children: " \u00B7 enter to view" })] }), previewLines.map((line, idx) => _jsxs(Box, { paddingLeft: 3, children: [_jsx(Text, { dimColor: true, children: " " }), _jsxs(Text, { dimColor: true, children: [previewTreeChar, " "] }), _jsx(Text, { dimColor: true, children: line })] }, idx))] });
+}