muonroi-cli 1.8.4 → 1.8.5

package/dist/src/ui/components/council-status-list.js

@@ -2,16 +2,6 @@ import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "@opentui/reac
 import { useEffect, useState } from "react";
 const SPINNER_FRAMES = ["⬒", "⬔", "⬓", "⬕"];
 const DONE_HOLD_MS = 1500;
-const PHASE_LABEL = {
-    clarify: "clarify",
-    plan_debate: "plan",
-    research: "research",
-    opening: "opening",
-    exchange: "exchange",
-    evaluate: "evaluate",
-    synthesis: "synthesis",
-    summary: "summary",
-};
 function Spinner() {
     const [frame, setFrame] = useState(0);
     useEffect(() => {
@@ -20,6 +10,20 @@ function Spinner() {
     }, []);
     return _jsx(_Fragment, { children: SPINNER_FRAMES[frame] });
 }
+/**
+ * Re-render every `tickMs` so active rows show a live-ticking elapsed counter.
+ * Without this the row freezes at the last emitter-sent elapsedMs (emitters
+ * only send on state transitions) — the same "im lìm" symptom the phase
+ * timeline fixed with its own heartbeat (council-phase-timeline.tsx).
+ */
+function useHeartbeat(tickMs = 1000) {
+    const [, force] = useState(0);
+    useEffect(() => {
+        const id = setInterval(() => force((n) => n + 1), tickMs);
+        return () => clearInterval(id);
+    }, [tickMs]);
+    return Date.now();
+}
 function formatElapsed(ms) {
     if (!ms || ms < 0)
         return "0s";
@@ -38,18 +42,22 @@ function formatTokens(s) {
         parts.push(`↓ ${s.tokensOut}`);
     return parts.length > 0 ? ` · ${parts.join(" · ")} tokens` : "";
 }
-export function CouncilStatusList({ statuses, theme: t }) {
-    if (statuses.length === 0)
+export function CouncilStatusList({ statuses, theme: t, sessionId }) {
+    // Hook must run unconditionally — before the empty-list early return.
+    const now = useHeartbeat(1000);
+    if (statuses.length === 0 && !sessionId)
         return null;
-    return (_jsx("box", { flexDirection: "column", paddingLeft: 2, paddingTop: 0, flexShrink: 0, children: statuses.map((s) => {
-            const isError = s.state === "error";
-            const isDone = s.state === "done";
-            const marker = isError ? "✗" : isDone ? "✓" : _jsx(Spinner, {});
-            const markerColor = isError ? t.diffRemovedFg : isDone ? t.planOptionCheck : t.accent;
-            const labelColor = isError ? t.diffRemovedFg : t.text;
-            const meta = `(${formatElapsed(s.elapsedMs)}${formatTokens(s)})`;
-            return (_jsxs("box", { flexDirection: "column", children: [_jsxs("box", { children: [_jsx("text", { fg: markerColor, children: marker }), _jsx("text", { fg: labelColor, children: ` ${s.label}` }), _jsx("text", { fg: t.textMuted, children: ` ${meta}` }), _jsx("text", { fg: t.textDim, children: `  [${PHASE_LABEL[s.phase]}]` })] }), s.detail && (_jsx("box", { paddingLeft: 2, children: _jsx("text", { fg: t.textMuted, children: `└ ${truncate(s.detail, 90)}` }) })), s.errorMessage && (_jsx("box", { paddingLeft: 2, children: _jsx("text", { fg: t.diffRemovedFg, children: `└ ${truncate(s.errorMessage, 90)}` }) }))] }, s.statusId));
-        }) }));
+    return (_jsxs("box", { flexDirection: "column", paddingLeft: 2, paddingTop: 0, flexShrink: 0, children: [sessionId && (_jsx("box", { marginBottom: 1, children: _jsx("text", { fg: t.textDim, children: `session ${sessionId}` }) })), statuses.map((s) => {
+                const isError = s.state === "error";
+                const isDone = s.state === "done";
+                const marker = isError ? "✗" : isDone ? "✓" : _jsx(Spinner, {});
+                const markerColor = isError ? t.diffRemovedFg : isDone ? t.planOptionCheck : t.accent;
+                const labelColor = isError ? t.diffRemovedFg : t.text;
+                const isLive = s.state === "start" || s.state === "tick";
+                const liveElapsedMs = isLive && typeof s.startedAt === "number" ? Math.max(0, now - s.startedAt) : s.elapsedMs;
+                const meta = `(${formatElapsed(liveElapsedMs)}${formatTokens(s)})`;
+                return (_jsxs("box", { flexDirection: "column", children: [_jsxs("box", { children: [_jsx("text", { fg: markerColor, children: marker }), _jsx("text", { fg: labelColor, children: ` ${s.label}` }), _jsx("text", { fg: t.textMuted, children: ` ${meta}` })] }), s.detail && (_jsx("box", { paddingLeft: 2, children: _jsx("text", { fg: t.textMuted, children: `└ ${truncate(s.detail, 140)}` }) })), s.errorMessage && (_jsx("box", { paddingLeft: 2, children: _jsx("text", { fg: t.diffRemovedFg, children: `└ ${truncate(s.errorMessage, 140)}` }) }))] }, s.statusId));
+            })] }));
 }
 function truncate(s, max) {
     if (s.length <= max)
@@ -63,10 +71,14 @@ function truncate(s, max) {
  */
 export function upsertStatus(prev, next) {
     const idx = prev.findIndex((s) => s.statusId === next.statusId);
-    if (idx === -1)
-        return [...prev, next];
+    if (idx === -1) {
+        // Stamp a client-side start anchor so the row can live-tick between emitter
+        // updates (emitters only send elapsedMs on state transitions).
+        const startedAt = next.startedAt ?? Date.now() - (next.elapsedMs ?? 0);
+        return [...prev, { ...next, startedAt }];
+    }
     const out = prev.slice();
-    out[idx] = next;
+    out[idx] = { ...next, startedAt: next.startedAt ?? out[idx].startedAt };
     return out;
 }
 /** Remove `done` rows that finished more than DONE_HOLD_MS ago. */

package/dist/src/ui/components/council-synthesis-banner.d.ts

@@ -1,9 +1,14 @@
 import type { CouncilMessage } from "../../types/index.js";
+import type { Theme } from "../theme.js";
 export interface CouncilSynthesisBannerProps {
     msg: CouncilMessage;
+    theme: Theme;
 }
 export declare function buildSynthesisTitle(round: number | undefined): string;
 /**
- * Full-width double-border pinned banner for round and final synthesis.
+ * Round / final synthesis, rendered as a linear group-chat row that closes the
+ * thread. A synthesis-colored left bar + bold title distinguishes the leader's
+ * verdict from the debate turns while staying in the same downward stream (no
+ * centered/full-width banner that broke the chat flow).
  */
-export declare function CouncilSynthesisBanner({ msg }: CouncilSynthesisBannerProps): import("react").ReactNode;
+export declare function CouncilSynthesisBanner({ msg, theme: t }: CouncilSynthesisBannerProps): import("react").ReactNode;

package/dist/src/ui/components/council-synthesis-banner.js

@@ -1,15 +1,30 @@
 import { jsx as _jsx, jsxs as _jsxs } from "@opentui/react/jsx-runtime";
-import { dark } from "../theme.js";
 import { truncateCodeBlocks } from "./code-block-truncate.js";
+import { CouncilConclusionCard, parseConclusion } from "./council-conclusion-card.js";
 export function buildSynthesisTitle(round) {
     return round === undefined ? "Final Synthesis" : `Round ${round} Synthesis`;
 }
 /**
- * Full-width double-border pinned banner for round and final synthesis.
+ * Round / final synthesis, rendered as a linear group-chat row that closes the
+ * thread. A synthesis-colored left bar + bold title distinguishes the leader's
+ * verdict from the debate turns while staying in the same downward stream (no
+ * centered/full-width banner that broke the chat flow).
  */
-export function CouncilSynthesisBanner({ msg }) {
-    const bodyText = truncateCodeBlocks(msg.text.trim());
+export function CouncilSynthesisBanner({ msg, theme: t }) {
+    // When the synthesis is a structured evaluation/decision JSON, render it as a
+    // scannable conclusion card instead of dumping raw JSON as freetext. Prose
+    // syntheses (no parseable JSON object) fall through to the plain-text path.
+    const conclusion = parseConclusion(msg.text);
+    if (conclusion) {
+        return _jsx(CouncilConclusionCard, { conclusion: conclusion, round: msg.round, theme: t });
+    }
+    // A `---READABLE---` marker means the synthesizer already produced a human
+    // prose tail — show ONLY that tail, not the raw JSON above it. Empty tail
+    // (marker at the very end) falls back to the full text.
+    const raw = msg.text.trim();
+    const readableIdx = raw.indexOf("---READABLE---");
+    const bodyText = truncateCodeBlocks(readableIdx !== -1 ? raw.slice(readableIdx + "---READABLE---".length).trim() || raw : raw);
     const title = buildSynthesisTitle(msg.round);
-    return (_jsx("box", { flexDirection: "column", marginBottom: 1, children: _jsxs("box", { borderStyle: "double", borderColor: dark.councilSynthesisBorder, flexDirection: "column", paddingLeft: 1, paddingRight: 1, children: [_jsx("text", { fg: dark.councilSynthesisBorder, attributes: 1, children: title }), _jsx("text", { fg: dark.text, children: bodyText })] }) }));
+    return (_jsxs("box", { flexDirection: "column", marginBottom: 1, border: ["left"], borderColor: t.councilSynthesisBorder, paddingLeft: 2, children: [_jsx("text", { fg: t.councilSynthesisBorder, attributes: 1, children: title }), _jsx("text", { fg: t.text, children: bodyText })] }));
 }
 //# sourceMappingURL=council-synthesis-banner.js.map

package/dist/src/ui/components/halt-recovery-card.js

@@ -14,14 +14,18 @@ import { Semantic } from "@muonroi/agent-harness-opentui";
 const MAX_CARD_COLS = 100;
 const FALLBACK_THRESHOLD = 70;
 const REASON_LABELS = {
-    no_recipe: "No verify recipe detected",
-    zero_coverage: "Zero test coverage detected",
-    budget_exhausted: "Token budget exhausted",
+    no_recipe: "No verification recipe found",
+    zero_coverage: "No test coverage found",
+    budget_exhausted: "Token budget used up",
+    sprint_failed: "Sprint failed",
 };
 export function HaltRecoveryCard({ halt, selectedIndex, terminalCols, theme }) {
     const fallback = terminalCols < FALLBACK_THRESHOLD;
     const width = fallback ? terminalCols : Math.min(terminalCols - 2, MAX_CARD_COLS);
-    const title = `Halted — ${REASON_LABELS[halt.reason] ?? halt.reason}`;
-    return (_jsx(Semantic, { id: "ideal-halt-card", role: "dialog", name: "Recovery options", isModal: true, children: _jsx("box", { flexDirection: "column", marginBottom: 1, children: _jsxs("box", { width: width, borderStyle: "single", borderColor: theme.haltCardBorder, flexDirection: "column", paddingLeft: 1, paddingRight: 1, children: [_jsx("text", { fg: theme.haltCardTitle, attributes: 1, children: title }), halt.detail && (_jsx("text", { fg: theme.haltCardDetail, marginTop: 1, children: halt.detail })), _jsx("box", { flexDirection: "column", marginTop: 1, children: halt.recovery_options.map((opt, i) => (_jsxs(Semantic, { id: `halt-option-${opt.id}`, role: "listitem", name: opt.label, selected: i === selectedIndex || undefined, children: [_jsx("box", { flexDirection: "row", marginBottom: 0, children: _jsxs("text", { fg: i === selectedIndex ? theme.haltCardOptionSelected : theme.haltCardOptionDefault, children: [i === selectedIndex ? "▶ " : "  ", opt.label] }) }), _jsx("box", { flexDirection: "row", marginLeft: 2, children: _jsx("text", { fg: theme.haltCardOptionDesc, children: opt.description }) })] }, opt.id))) }), _jsx("text", { fg: theme.haltCardHint, marginTop: 1, children: "\u2191\u2193 navigate \u00B7 Enter select \u00B7 Esc dismiss" })] }) }) }));
+    // A — a sprint break titles with the failing sprint number ("Sprint 3 failed").
+    const title = halt.reason === "sprint_failed" && typeof halt.sprintN === "number"
+        ? `Halted — Sprint ${halt.sprintN} failed`
+        : `Halted — ${REASON_LABELS[halt.reason] ?? halt.reason}`;
+    return (_jsx(Semantic, { id: "ideal-halt-card", role: "dialog", name: "Recovery options", isModal: true, children: _jsx("box", { flexDirection: "column", marginBottom: 1, children: _jsxs("box", { width: width, borderStyle: "single", borderColor: theme.haltCardBorder, flexDirection: "column", paddingLeft: 1, paddingRight: 1, children: [_jsx("text", { fg: theme.haltCardTitle, attributes: 1, children: title }), halt.detail && (_jsx("text", { fg: theme.haltCardDetail, marginTop: 1, children: halt.detail })), _jsx("box", { flexDirection: "column", marginTop: 1, children: halt.recovery_options.map((opt, i) => (_jsxs(Semantic, { id: `halt-option-${opt.id}`, role: "listitem", name: opt.label, selected: i === selectedIndex || undefined, children: [_jsx("box", { flexDirection: "row", marginBottom: 0, children: _jsxs("text", { fg: i === selectedIndex ? theme.haltCardOptionSelected : theme.haltCardOptionDefault, children: [i === selectedIndex ? "▶ " : "  ", opt.label] }) }), _jsx("box", { flexDirection: "row", marginLeft: 2, children: _jsx("text", { fg: theme.haltCardOptionDesc, children: opt.description }) })] }, opt.id))) }), _jsx("text", { fg: theme.haltCardHint, marginTop: 1, children: "\u2191/\u2193 to browse \u00B7 Enter to select \u00B7 Esc to dismiss" })] }) }) }));
 }
 //# sourceMappingURL=halt-recovery-card.js.map

package/dist/src/ui/components/jump-to-latest-pill.d.ts

@@ -0,0 +1,11 @@
+export interface JumpToLatestPillProps {
+    /** Number of new appends suppressed since the user scrolled up. */
+    newSinceLock: number;
+}
+/**
+ * Scroll-lock affordance (MUONROI_SCROLL_LOCK): shown pinned to the bottom of
+ * the transcript when the user has scrolled up while new content is arriving.
+ * Pressing End re-pins to the live tail. Glyph-free (ASCII only) so it renders
+ * on every terminal — the debate pill work proved non-`● ✓` glyphs are unsafe.
+ */
+export declare function JumpToLatestPill({ newSinceLock }: JumpToLatestPillProps): import("react").ReactNode;

package/dist/src/ui/components/jump-to-latest-pill.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx } from "@opentui/react/jsx-runtime";
+import { Semantic } from "@muonroi/agent-harness-opentui";
+import { dark } from "../theme.js";
+/**
+ * Scroll-lock affordance (MUONROI_SCROLL_LOCK): shown pinned to the bottom of
+ * the transcript when the user has scrolled up while new content is arriving.
+ * Pressing End re-pins to the live tail. Glyph-free (ASCII only) so it renders
+ * on every terminal — the debate pill work proved non-`● ✓` glyphs are unsafe.
+ */
+export function JumpToLatestPill({ newSinceLock }) {
+    const label = newSinceLock > 0 ? `${newSinceLock} new below - press End to jump` : "press End to jump to latest";
+    return (_jsx(Semantic, { id: "jump-to-latest", role: "region", props: { newSinceLock }, children: _jsx("box", { flexDirection: "row", alignSelf: "center", paddingLeft: 1, paddingRight: 1, backgroundColor: dark.accent, children: _jsx("text", { fg: "#ffffff", attributes: 1, children: label }) }) }));
+}
+//# sourceMappingURL=jump-to-latest-pill.js.map

package/dist/src/ui/components/prompt-box.js

@@ -1,7 +1,7 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "@opentui/react/jsx-runtime";
-import { Semantic } from "@muonroi/agent-harness-opentui";
+import { jsx as _jsx, jsxs as _jsxs } from "@opentui/react/jsx-runtime";
 import { useEffect, useState } from "react";
 import { PROMPT_LOADING_FRAMES } from "../constants.js";
+import { Menu, TextBox } from "../primitives/index.js";
 import { withAlpha } from "../utils/color.js";
 import { SuggestionOverlay } from "./SuggestionOverlay.js";
 import { ContextMeter } from "./session-header.js";
@@ -40,27 +40,29 @@ export function PromptModeLabel({ t, modeInfo, isProcessing, }) {
 export function PromptBox({ t, inputRef, isProcessing, showModelPicker, showSandboxPicker, showWalletPicker, showSlashMenu, showPlanQuestions, showApiKeyModal, blockPrompt, onSubmit, onPaste, pasteBlocks: _pasteBlocks, modeInfo, model, modelInfo, contextStats, placeholder, queuedCount, queuedMessages, typeahead, slashItems, slashSelectedIndex, slashInputIsMatched, composerValue, }) {
     const hasQueue = (queuedMessages?.length ?? 0) > 0;
     const showSuggestions = typeahead?.visible ?? false;
+    // Single source of truth for composer focus — mirrored to BOTH the OpenTUI
+    // textarea (`focused`) and the semantic node (via TextBox `focused`). Keeping
+    // one expression avoids the two drifting apart (the harness would otherwise
+    // report a focus state that disagrees with what the textarea actually has).
+    const composerFocused = !showModelPicker &&
+        !showSandboxPicker &&
+        !showWalletPicker &&
+        !showPlanQuestions &&
+        !showApiKeyModal &&
+        !blockPrompt;
     return (_jsxs("box", { backgroundColor: t.backgroundPanel, children: [_jsxs("box", { children: [hasQueue && (_jsxs("box", { paddingLeft: 2, paddingRight: 2, paddingTop: 1, paddingBottom: 1, backgroundColor: t.queueBg, flexShrink: 0, children: [queuedMessages.map((msg, i) => (
                             // biome-ignore lint/suspicious/noArrayIndexKey: append-only queue of plain strings
-                            _jsxs("text", { fg: t.text, children: ["→ ", msg] }, i))), _jsx("box", { height: 1 }), _jsxs("text", { children: [_jsx("span", { style: { fg: t.primary }, children: "enter " }), _jsx("span", { style: { fg: t.textMuted }, children: "send now" }), _jsx("span", { style: { fg: t.textDim }, children: " · " }), _jsx("span", { style: { fg: t.primary }, children: "↑ " }), _jsx("span", { style: { fg: t.textMuted }, children: "edit" }), _jsx("span", { style: { fg: t.textDim }, children: " · " }), _jsx("span", { style: { fg: t.primary }, children: "esc " }), _jsx("span", { style: { fg: t.textMuted }, children: "cancel" })] })] })), showSlashMenu && slashItems && (_jsx(Semantic, { id: "slash-menu", role: "menu", isModal: true, name: "Slash commands", children: _jsx(SlashInlineMenu, { t: t, items: slashItems, selectedIndex: slashSelectedIndex ?? 0 }) })), showSuggestions && typeahead && (_jsx(SuggestionOverlay, { t: t, suggestions: typeahead.suggestions, selectedIndex: typeahead.selectedIndex })), _jsxs("box", { paddingLeft: 2, paddingRight: 2, paddingTop: 1, paddingBottom: 1, backgroundColor: t.backgroundElement, flexDirection: "row", gap: 2, alignItems: "flex-start", flexShrink: 0, children: [_jsx(PromptModeLabel, { t: t, modeInfo: modeInfo, isProcessing: isProcessing }), _jsx("box", { flexGrow: 1, children: _jsx(Semantic, { id: "composer", role: "textbox", 
+                            _jsxs("text", { fg: t.text, children: ["→ ", msg] }, i))), _jsx("box", { height: 1 }), _jsxs("text", { children: [_jsx("span", { style: { fg: t.primary }, children: "enter " }), _jsx("span", { style: { fg: t.textMuted }, children: "send now" }), _jsx("span", { style: { fg: t.textDim }, children: " · " }), _jsx("span", { style: { fg: t.primary }, children: "↑ " }), _jsx("span", { style: { fg: t.textMuted }, children: "edit" }), _jsx("span", { style: { fg: t.textDim }, children: " · " }), _jsx("span", { style: { fg: t.primary }, children: "esc " }), _jsx("span", { style: { fg: t.textMuted }, children: "cancel" })] })] })), showSlashMenu && slashItems && (_jsx(Menu, { id: "slash-menu", name: "Slash commands", children: _jsx(SlashInlineMenu, { t: t, items: slashItems, selectedIndex: slashSelectedIndex ?? 0 }) })), showSuggestions && typeahead && (_jsx(SuggestionOverlay, { t: t, suggestions: typeahead.suggestions, selectedIndex: typeahead.selectedIndex })), _jsxs("box", { paddingLeft: 2, paddingRight: 2, paddingTop: 1, paddingBottom: 1, backgroundColor: t.backgroundElement, flexDirection: "row", gap: 2, alignItems: "flex-start", flexShrink: 0, children: [_jsx(PromptModeLabel, { t: t, modeInfo: modeInfo, isProcessing: isProcessing }), _jsx("box", { flexGrow: 1, children: _jsx(TextBox, { id: "composer", 
                                     // Mirror current composer text so external harness drivers
                                     // can read back what the user typed. Prefer the textarea's
                                     // actual plainText (ground truth) over composerValue (derived
                                     // from slashSearchQuery). This makes post-Tab state visible
                                     // even while the slash menu is technically still open — was
                                     // hiding the trailing space inserted by Tab autocomplete.
-                                    value: inputRef.current?.plainText ?? composerValue ?? "", focus: !showModelPicker &&
-                                        !showSandboxPicker &&
-                                        !showWalletPicker &&
-                                        !showPlanQuestions &&
-                                        !showApiKeyModal &&
-                                        !blockPrompt
-                                        ? true
-                                        : undefined, children: _jsx("textarea", { ref: inputRef, focused: !showModelPicker &&
-                                            !showSandboxPicker &&
-                                            !showWalletPicker &&
-                                            !showPlanQuestions &&
-                                            !showApiKeyModal &&
-                                            !blockPrompt, placeholder: isProcessing ? "Queue a follow-up... (esc to interrupt)" : placeholder || "Message muonroi-cli...", textColor: slashInputIsMatched ? "#3b82f6" : t.text, backgroundColor: t.backgroundElement, placeholderColor: t.textMuted, minHeight: 1, maxHeight: 10, wrapMode: "word", keyBindings: TEXTAREA_KEYBINDINGS, onSubmit: onSubmit, onPaste: onPaste }) }) })] })] }), _jsxs("box", { flexDirection: "row", justifyContent: "space-between", alignItems: "center", paddingLeft: 2, paddingRight: 2, height: 1, flexShrink: 0, children: [_jsxs("box", { flexDirection: "row", gap: 1, alignItems: "center", height: 1, children: [_jsx("text", { fg: t.text, children: modelInfo?.name || model }), contextStats ? _jsx(ContextMeter, { t: t, stats: contextStats }) : null] }), _jsx("box", { flexDirection: "row", gap: 1, alignItems: "center", height: 1, children: isProcessing ? (_jsxs("box", { flexDirection: "row", gap: 1, children: [_jsxs("text", { fg: t.text, children: ["enter ", _jsx("span", { style: { fg: t.textMuted }, children: "queue" })] }), _jsxs("text", { fg: t.text, children: ["esc ", _jsx("span", { style: { fg: t.textMuted }, children: (queuedCount ?? 0) > 0 ? "clear queue" : "interrupt" })] })] })) : showSlashMenu ? (_jsxs("box", { flexDirection: "row", gap: 1, children: [_jsxs("text", { fg: t.text, children: ["↑↓ ", _jsx("span", { style: { fg: t.textMuted }, children: "navigate" })] }), _jsxs("text", { fg: t.text, children: ["enter ", _jsx("span", { style: { fg: t.textMuted }, children: "select" })] }), _jsxs("text", { fg: t.text, children: ["esc ", _jsx("span", { style: { fg: t.textMuted }, children: "dismiss" })] })] })) : showSuggestions ? (_jsxs("box", { flexDirection: "row", gap: 1, children: [_jsxs("text", { fg: t.text, children: ["tab ", _jsx("span", { style: { fg: t.textMuted }, children: "accept" })] }), _jsxs("text", { fg: t.text, children: ["↑↓ ", _jsx("span", { style: { fg: t.textMuted }, children: "navigate" })] }), _jsxs("text", { fg: t.text, children: ["esc ", _jsx("span", { style: { fg: t.textMuted }, children: "dismiss" })] })] })) : (_jsxs(_Fragment, { children: [_jsxs("text", { fg: t.text, children: ["@ ", _jsx("span", { style: { fg: t.textMuted }, children: "files" })] }), _jsxs("text", { fg: t.text, children: ["shift+enter ", _jsx("span", { style: { fg: t.textMuted }, children: "new line" })] }), _jsxs("text", { fg: t.text, children: ["tab ", _jsx("span", { style: { fg: t.textMuted }, children: "modes" })] })] })) })] })] }));
+                                    value: inputRef.current?.plainText ?? composerValue ?? "", focused: composerFocused, children: _jsx("textarea", { ref: inputRef, focused: composerFocused, placeholder: isProcessing ? "Queue a follow-up... (esc to interrupt)" : placeholder || "Message muonroi-cli...", textColor: slashInputIsMatched ? "#3b82f6" : t.text, backgroundColor: t.backgroundElement, placeholderColor: t.textMuted, minHeight: 1, maxHeight: 10, wrapMode: "word", keyBindings: TEXTAREA_KEYBINDINGS, onSubmit: onSubmit, onPaste: onPaste }) }) })] })] }), _jsxs("box", { flexDirection: "row", justifyContent: "space-between", alignItems: "center", paddingLeft: 2, paddingRight: 2, height: 1, flexShrink: 0, children: [_jsxs("box", { flexDirection: "row", gap: 1, alignItems: "center", height: 1, children: [_jsx("text", { fg: t.text, children: modelInfo?.name || model }), contextStats ? _jsx(ContextMeter, { t: t, stats: contextStats }) : null] }), _jsx("box", { flexDirection: "row", gap: 1, alignItems: "center", height: 1, children: isProcessing ? (_jsxs("box", { flexDirection: "row", gap: 1, children: [_jsxs("text", { fg: t.text, children: ["enter ", _jsx("span", { style: { fg: t.textMuted }, children: "queue" })] }), _jsxs("text", { fg: t.text, children: ["esc ", _jsx("span", { style: { fg: t.textMuted }, children: (queuedCount ?? 0) > 0 ? "clear queue" : "interrupt" })] })] })) : showSlashMenu ? (_jsxs("box", { flexDirection: "row", gap: 1, children: [_jsxs("text", { fg: t.text, children: ["↑↓ ", _jsx("span", { style: { fg: t.textMuted }, children: "navigate" })] }), _jsxs("text", { fg: t.text, children: ["enter ", _jsx("span", { style: { fg: t.textMuted }, children: "select" })] }), _jsxs("text", { fg: t.text, children: ["esc ", _jsx("span", { style: { fg: t.textMuted }, children: "dismiss" })] })] })) : showSuggestions ? (_jsxs("box", { flexDirection: "row", gap: 1, children: [_jsxs("text", { fg: t.text, children: ["tab ", _jsx("span", { style: { fg: t.textMuted }, children: "accept" })] }), _jsxs("text", { fg: t.text, children: ["↑↓ ", _jsx("span", { style: { fg: t.textMuted }, children: "navigate" })] }), _jsxs("text", { fg: t.text, children: ["esc ", _jsx("span", { style: { fg: t.textMuted }, children: "dismiss" })] })] })) : (
+                        // Wrap in a gap'd row like the other three hint branches — a bare
+                        // fragment let the three hints run together ("@ filesshift+enter new
+                        // linetab modes"); the inner box restores the 1-col separators.
+                        _jsxs("box", { flexDirection: "row", gap: 1, children: [_jsxs("text", { fg: t.text, children: ["@ ", _jsx("span", { style: { fg: t.textMuted }, children: "files" })] }), _jsxs("text", { fg: t.text, children: ["shift+enter ", _jsx("span", { style: { fg: t.textMuted }, children: "new line" })] }), _jsxs("text", { fg: t.text, children: ["tab ", _jsx("span", { style: { fg: t.textMuted }, children: "modes" })] })] })) })] })] }));
 }
 //# sourceMappingURL=prompt-box.js.map

package/dist/src/ui/components/session-tree-card.d.ts

@@ -0,0 +1,14 @@
+import type { SessionChainNode } from "../../storage/transcript.js";
+/**
+ * Rail "Sessions" block: the session tree this TUI hosts — the root
+ * conversation plus every rotation / sub-agent descendant. The children's
+ * message content is already merged into the transcript on resume; this makes
+ * the multi-session structure VISIBLE (which session produced what, how many
+ * messages, whether it is the current one) instead of a flat anonymous timeline.
+ *
+ * Renders nothing extra when the tree is a single conversation (no sub-sessions)
+ * — keeps a lean rail for the common single-session case.
+ */
+export declare function SessionTreeCard({ nodes }: {
+    nodes: SessionChainNode[];
+}): import("react").ReactNode;

package/dist/src/ui/components/session-tree-card.js

@@ -0,0 +1,46 @@
+import { jsx as _jsx, jsxs as _jsxs } from "@opentui/react/jsx-runtime";
+import { Semantic } from "@muonroi/agent-harness-opentui";
+import { dark } from "../theme.js";
+/** Short kind badge for the rail — keeps rows narrow in a ~34-col panel. */
+function kindBadge(kind) {
+    switch (kind) {
+        case "subagent":
+            return "sub";
+        case "rotation":
+            return "rot";
+        case "conversation":
+            return "conv";
+        default:
+            return "·";
+    }
+}
+/** Trim a model id to its last path segment so "deepseek/deepseek-v4-flash"
+ *  reads as "deepseek-v4-flash" in the narrow rail. */
+function shortModel(model) {
+    if (!model)
+        return "—";
+    const seg = model.includes("/") ? model.slice(model.lastIndexOf("/") + 1) : model;
+    return seg.length > 16 ? `${seg.slice(0, 15)}…` : seg;
+}
+/**
+ * Rail "Sessions" block: the session tree this TUI hosts — the root
+ * conversation plus every rotation / sub-agent descendant. The children's
+ * message content is already merged into the transcript on resume; this makes
+ * the multi-session structure VISIBLE (which session produced what, how many
+ * messages, whether it is the current one) instead of a flat anonymous timeline.
+ *
+ * Renders nothing extra when the tree is a single conversation (no sub-sessions)
+ * — keeps a lean rail for the common single-session case.
+ */
+export function SessionTreeCard({ nodes }) {
+    if (nodes.length <= 1)
+        return null;
+    return (_jsx(Semantic, { id: "session-tree", role: "listbox", name: "Sessions", props: { count: nodes.length, ids: nodes.map((n) => n.id.slice(0, 8)).join(",") }, children: _jsxs("box", { flexDirection: "column", flexShrink: 0, paddingTop: 1, children: [_jsx("text", { fg: dark.textMuted, attributes: 1, children: `Sessions (${nodes.length})` }), nodes.map((n) => {
+                    const indent = "  ".repeat(Math.min(n.depth, 3));
+                    const marker = n.isCurrent ? "●" : n.depth > 0 ? "↳" : "○";
+                    const badge = kindBadge(n.kind);
+                    const done = n.status && n.status !== "active";
+                    return (_jsx(Semantic, { id: `session-node-${n.id}`, role: "listitem", name: `${badge} ${n.id.slice(0, 8)}`, value: `${n.messageCount} msg`, selected: n.isCurrent ? true : undefined, props: { kind: n.kind ?? "", status: n.status ?? "", messageCount: n.messageCount, depth: n.depth }, children: _jsx("box", { flexDirection: "column", children: _jsxs("text", { children: [_jsx("span", { style: { fg: n.isCurrent ? dark.selected : dark.textMuted }, children: `${indent}${marker} ` }), _jsx("span", { style: { fg: n.isCurrent ? dark.selected : dark.text }, children: `${badge} ` }), _jsx("span", { style: { fg: dark.textMuted }, children: `${n.id.slice(0, 8)}  ${shortModel(n.model)}  ` }), _jsx("span", { style: { fg: dark.text }, children: `${n.messageCount} msg` }), done ? _jsx("span", { style: { fg: dark.textDim }, children: `  ${n.status}` }) : null] }) }) }, n.id));
+                })] }) }));
+}
+//# sourceMappingURL=session-tree-card.js.map

package/dist/src/ui/components/slash-inline-menu.d.ts

@@ -1,5 +1,17 @@
 import type { SlashMenuItem } from "../slash/menu-items.js";
 import type { Theme } from "../theme.js";
+/**
+ * Compute the scrolling viewport for the slash dropdown so the highlighted row
+ * stays visible when the filtered list exceeds the window. Pure + exported so
+ * the scroll behavior is unit-testable without a live TUI (the api-key modal
+ * blocks a clean greenfield harness drive of the menu).
+ */
+export declare function computeSlashMenuWindow(total: number, selectedIndex: number, maxVisible?: number): {
+    start: number;
+    end: number;
+    hiddenAbove: number;
+    hiddenBelow: number;
+};
 export declare function SlashInlineMenu({ t, items, selectedIndex, }: {
     t: Theme;
     items: SlashMenuItem[];

package/dist/src/ui/components/slash-inline-menu.js

@@ -1,14 +1,35 @@
 import { jsx as _jsx, jsxs as _jsxs } from "@opentui/react/jsx-runtime";
 import { Semantic } from "@muonroi/agent-harness-opentui";
 const SLASH_MENU_MAX_VISIBLE = 8;
+/**
+ * Compute the scrolling viewport for the slash dropdown so the highlighted row
+ * stays visible when the filtered list exceeds the window. Pure + exported so
+ * the scroll behavior is unit-testable without a live TUI (the api-key modal
+ * blocks a clean greenfield harness drive of the menu).
+ */
+export function computeSlashMenuWindow(total, selectedIndex, maxVisible = SLASH_MENU_MAX_VISIBLE) {
+    if (total <= 0)
+        return { start: 0, end: 0, hiddenAbove: 0, hiddenBelow: 0 };
+    const clamped = Math.min(Math.max(0, selectedIndex), total - 1);
+    const start = total <= maxVisible ? 0 : Math.min(Math.max(0, clamped - maxVisible + 1), total - maxVisible);
+    const end = Math.min(start + maxVisible, total);
+    return { start, end, hiddenAbove: start, hiddenBelow: total - end };
+}
 export function SlashInlineMenu({ t, items, selectedIndex, }) {
-    const visible = items.slice(0, SLASH_MENU_MAX_VISIBLE);
-    if (visible.length === 0) {
+    if (items.length === 0) {
         return (_jsx("box", { paddingLeft: 2, paddingRight: 2, paddingTop: 1, flexShrink: 0, flexDirection: "column", children: _jsx("box", { height: 1, paddingLeft: 1, children: _jsx("text", { fg: t.textMuted, children: "No commands match" }) }) }));
     }
-    return (_jsxs("box", { paddingLeft: 2, paddingRight: 2, paddingTop: 1, flexShrink: 0, flexDirection: "column", children: [visible.map((item, i) => {
-                const isSelected = i === selectedIndex;
+    // Scrolling viewport: keep the highlighted row in view when the filtered list
+    // exceeds the visible window. Without this the window was pinned to
+    // items.slice(0,8) and pressing Down past index 7 moved the selection
+    // off-screen — the list "wouldn't continue past the initial suggestions".
+    const clampedSelected = Math.min(Math.max(0, selectedIndex), items.length - 1);
+    const { start: windowStart, hiddenAbove, hiddenBelow } = computeSlashMenuWindow(items.length, clampedSelected);
+    const visible = items.slice(windowStart, windowStart + SLASH_MENU_MAX_VISIBLE);
+    return (_jsxs("box", { paddingLeft: 2, paddingRight: 2, paddingTop: 1, flexShrink: 0, flexDirection: "column", children: [hiddenAbove > 0 && _jsx("text", { fg: t.textDim, children: `  ▲ ${hiddenAbove} more` }), visible.map((item, i) => {
+                const absoluteIndex = windowStart + i;
+                const isSelected = absoluteIndex === clampedSelected;
                 return (_jsx(Semantic, { id: `slash-item-${item.id}`, role: "listitem", name: `/${item.label}`, value: item.description, selected: isSelected ? true : undefined, children: _jsxs("box", { height: 1, backgroundColor: isSelected ? t.selectedBg : undefined, flexDirection: "row", justifyContent: "space-between", paddingLeft: 1, paddingRight: 1, children: [_jsxs("text", { fg: isSelected ? t.selected : t.text, children: ["/", item.label] }), _jsx("text", { fg: t.textMuted, children: item.description })] }) }, item.id));
-            }), items.length > SLASH_MENU_MAX_VISIBLE && (_jsx("text", { fg: t.textDim, children: `  +${items.length - SLASH_MENU_MAX_VISIBLE} more` }))] }));
+            }), hiddenBelow > 0 && _jsx("text", { fg: t.textDim, children: `  ▼ ${hiddenBelow} more` })] }));
 }
 //# sourceMappingURL=slash-inline-menu.js.map

package/dist/src/ui/components/task-list-panel.d.ts

@@ -19,14 +19,27 @@
 import type { TaskListItem, TaskListSnapshot } from "../../types/index.js";
 import type { Theme } from "../theme.js";
 declare function sortItems(items: ReadonlyArray<TaskListItem>): TaskListItem[];
+/**
+ * One-line summary used by the collapsed panel. Kept pure + exported so it can be
+ * unit-tested without rendering OpenTUI. Mirrors the expanded footer's bucket
+ * wording so the two views read consistently.
+ */
+declare function buildCollapsedLine(snapshot: TaskListSnapshot): string;
 export interface TaskListPanelProps {
     snapshot: TaskListSnapshot;
     t: Theme;
     expanded: boolean;
+    /**
+     * Render a single summary line instead of the full panel. Set while a council
+     * debate is active so the todo band stops eating the debate scrollbox's height
+     * (~11 rows → 1). `ctrl+e` flips it back to the full panel for a peek.
+     */
+    collapsed?: boolean;
 }
-export declare function TaskListPanel({ snapshot, t, expanded }: TaskListPanelProps): import("react").ReactNode;
+export declare function TaskListPanel({ snapshot, t, expanded, collapsed }: TaskListPanelProps): import("react").ReactNode;
 export declare const __TEST_ONLY__: {
     sortItems: typeof sortItems;
     MAX_VISIBLE: number;
+    buildCollapsedLine: typeof buildCollapsedLine;
 };
 export {};

package/dist/src/ui/components/task-list-panel.js

@@ -54,9 +54,29 @@ function ItemRow({ item, t }) {
     }
     return (_jsx(Semantic, { id: `task-${item.id}`, role: "listitem", name: label, state: item.status, children: _jsx("box", { width: "100%", children: _jsxs("text", { fg: textColor, children: [_jsx("span", { style: { fg: glyphColor }, children: `${glyph} ` }), trunc(label, 70)] }) }) }));
 }
-export function TaskListPanel({ snapshot, t, expanded }) {
+/**
+ * One-line summary used by the collapsed panel. Kept pure + exported so it can be
+ * unit-tested without rendering OpenTUI. Mirrors the expanded footer's bucket
+ * wording so the two views read consistently.
+ */
+function buildCollapsedLine(snapshot) {
+    const { completed, inProgress, pending } = snapshot.counts;
+    const parts = [];
+    if (completed > 0)
+        parts.push(`${completed} completed`);
+    if (inProgress > 0)
+        parts.push(`${inProgress} in progress`);
+    if (pending > 0)
+        parts.push(`${pending} queued`);
+    const body = parts.length > 0 ? parts.join(" · ") : "0 todos";
+    return `▸ Todos · ${body} (ctrl+e)`;
+}
+export function TaskListPanel({ snapshot, t, expanded, collapsed = false }) {
     if (snapshot.items.length === 0)
         return null;
+    if (collapsed) {
+        return (_jsx(Semantic, { id: "task-list", role: "listbox", name: "Todos", state: "collapsed", children: _jsx("box", { paddingLeft: 2, paddingRight: 2, marginBottom: 1, children: _jsx("text", { fg: t.textMuted, children: buildCollapsedLine(snapshot) }) }) }));
+    }
     const sorted = sortItems(snapshot.items);
     const overflow = !expanded && sorted.length > MAX_VISIBLE ? sorted.length - MAX_VISIBLE : 0;
     const visible = overflow > 0 ? sorted.slice(0, MAX_VISIBLE) : sorted;
@@ -71,5 +91,5 @@ export function TaskListPanel({ snapshot, t, expanded }) {
     const footer = footerParts.length > 0 ? footerParts.join(" · ") : "0 todos";
     return (_jsx(Semantic, { id: "task-list", role: "listbox", name: "Todos", children: _jsxs("box", { border: true, borderColor: t.border, paddingLeft: 2, paddingRight: 2, paddingTop: 0, paddingBottom: 0, marginBottom: 1, flexDirection: "column", children: [_jsx("box", { paddingBottom: 1, children: _jsx("text", { fg: t.textMuted, children: _jsx("b", { children: "Todos" }) }) }), _jsx("box", { flexDirection: "column", children: visible.map((it) => (_jsx(ItemRow, { item: it, t: t }, it.id))) }), overflow > 0 && (_jsx("box", { marginTop: 1, children: _jsx("text", { fg: t.textMuted, children: `… +${overflow} more (ctrl+e to expand)` }) })), _jsx("box", { marginTop: 1, paddingTop: 1, border: ["top"], borderColor: t.border, children: _jsx("text", { fg: t.textDim, children: footer }) })] }) }));
 }
-export const __TEST_ONLY__ = { sortItems, MAX_VISIBLE };
+export const __TEST_ONLY__ = { sortItems, MAX_VISIBLE, buildCollapsedLine };
 //# sourceMappingURL=task-list-panel.js.map

package/dist/src/ui/containers/modals-layer.d.ts

@@ -1,3 +1,4 @@
+import type { ResumeEntry } from "../../types/index.js";
 export interface ModalsLayerProps {
     agentRows: any;
     agentsEditorDraft: any;
@@ -50,7 +51,7 @@ export interface ModalsLayerProps {
     scheduleRows: any;
     scheduleSearchQuery: any;
     sessionPickerIndex: any;
-    sessionPickerList: any;
+    sessionPickerList: ResumeEntry[];
     showAgentsEditor: any;
     showAgentsModal: any;
     showApiKeyModal: any;

package/dist/src/ui/hooks/use-session-picker.d.ts

@@ -1,4 +1,4 @@
-import type { SessionInfo } from "../../types/index.js";
+import type { ResumeEntry } from "../../types/index.js";
 /**
  * State for the /sessions picker modal. Sessions are loaded lazily when the
  * picker is opened (the SQLite query is cheap — ORDER BY updated_at LIMIT 20
@@ -9,6 +9,6 @@ export declare function useSessionPicker(): {
     setShowSessionPicker: import("react").Dispatch<import("react").SetStateAction<boolean>>;
     sessionPickerIndex: number;
     setSessionPickerIndex: import("react").Dispatch<import("react").SetStateAction<number>>;
-    sessions: SessionInfo[];
-    setSessions: import("react").Dispatch<import("react").SetStateAction<SessionInfo[]>>;
+    sessions: ResumeEntry[];
+    setSessions: import("react").Dispatch<import("react").SetStateAction<ResumeEntry[]>>;
 };

package/dist/src/ui/mcp-modal.js

@@ -53,8 +53,7 @@ export function McpBrowserModal({ t, width, height, selectedIndex, searchQuery,
     const contentHeight = itemCount + 7;
     const maxHeight = Math.floor(height * 0.68);
     const panelHeight = Math.min(contentHeight, maxHeight);
-    const overlayBg = "#000000cc";
-    return (_jsx(Semantic, { id: "mcp-modal", role: "dialog", name: "MCP Servers", isModal: true, children: _jsx("box", { position: "absolute", left: 0, top: 0, width: width, height: height, alignItems: "center", paddingTop: bottomAlignedModalTop(height, panelHeight), backgroundColor: overlayBg, children: _jsxs("box", { width: Math.min(96, width - 4), height: panelHeight, backgroundColor: t.backgroundPanel, paddingTop: 1, paddingBottom: 1, flexDirection: "column", children: [_jsxs("box", { flexShrink: 0, flexDirection: "row", justifyContent: "space-between", paddingLeft: 2, paddingRight: 2, children: [_jsx("text", { fg: t.primary, children: _jsx("b", { children: "MCP Servers" }) }), _jsx("text", { fg: t.textMuted, children: "esc" })] }), _jsx("box", { flexShrink: 0, paddingLeft: 2, paddingRight: 2, paddingTop: 1, paddingBottom: 1, children: _jsx("text", { fg: t.text, children: searchQuery || _jsx("span", { style: { fg: t.textMuted }, children: "Search servers..." }) }) }), _jsx(Semantic, { id: "mcp-list", role: "listbox", children: _jsx("scrollbox", { ref: listRef, flexGrow: 1, minHeight: 0, children: rows.map((row, idx) => {
+    return (_jsx(Semantic, { id: "mcp-modal", role: "dialog", name: "MCP Servers", isModal: true, children: _jsx("box", { position: "absolute", left: 0, top: 0, width: width, height: height, alignItems: "center", paddingTop: bottomAlignedModalTop(height, panelHeight), backgroundColor: t.overlay, children: _jsxs("box", { width: Math.min(96, width - 4), height: panelHeight, backgroundColor: t.backgroundPanel, paddingTop: 1, paddingBottom: 1, flexDirection: "column", children: [_jsxs("box", { flexShrink: 0, flexDirection: "row", justifyContent: "space-between", paddingLeft: 2, paddingRight: 2, children: [_jsx("text", { fg: t.primary, children: _jsx("b", { children: "MCP Servers" }) }), _jsx("text", { fg: t.textMuted, children: "esc" })] }), _jsx("box", { flexShrink: 0, paddingLeft: 2, paddingRight: 2, paddingTop: 1, paddingBottom: 1, children: _jsx("text", { fg: t.text, children: searchQuery || _jsx("span", { style: { fg: t.textMuted }, children: "Search servers..." }) }) }), _jsx(Semantic, { id: "mcp-list", role: "listbox", children: _jsx("scrollbox", { ref: listRef, flexGrow: 1, minHeight: 0, children: rows.map((row, idx) => {
                                 const selected = idx === selectedIndex;
                                 if (row.kind === "server") {
                                     const enabledColor = row.server.enabled ? t.diffAddedFg : selected ? t.selected : t.text;
@@ -74,7 +73,6 @@ function syncRef(ref, value) {
 }
 export function McpEditorModal({ t, width, height, draft, focusedField, syncKey, error, title, labelRef, urlRef, headersRef, commandRef, argsRef, cwdRef, envRef, onSubmit, }) {
     const panelHeight = Math.min(30, Math.floor(height * 0.82));
-    const overlayBg = "#000000cc";
     const isRemote = draft.transport === "http" || draft.transport === "sse";
     // biome-ignore lint/correctness/useExhaustiveDependencies: syncKey is an intentional cache-bust prop
     useEffect(() => {
@@ -86,7 +84,7 @@ export function McpEditorModal({ t, width, height, draft, focusedField, syncKey,
         syncRef(cwdRef, draft.cwd);
         syncRef(envRef, draft.envText);
     }, [draft, syncKey, labelRef, urlRef, headersRef, commandRef, argsRef, cwdRef, envRef]);
-    return (_jsx(Semantic, { id: "mcp-editor", role: "dialog", name: title, isModal: true, children: _jsx("box", { position: "absolute", left: 0, top: 0, width: width, height: height, alignItems: "center", paddingTop: bottomAlignedModalTop(height, panelHeight), backgroundColor: overlayBg, children: _jsxs("box", { width: Math.min(86, width - 6), height: panelHeight, backgroundColor: t.backgroundPanel, paddingTop: 1, paddingBottom: 1, flexDirection: "column", children: [_jsxs("box", { flexShrink: 0, flexDirection: "row", justifyContent: "space-between", paddingLeft: 2, paddingRight: 2, children: [_jsx("text", { fg: t.primary, children: _jsx("b", { children: title }) }), _jsx("text", { fg: t.textMuted, children: "esc" })] }), _jsx("box", { flexShrink: 0, paddingLeft: 2, paddingRight: 2, paddingTop: 1, children: _jsxs("box", { flexDirection: "row", gap: 1, alignItems: "center", children: [_jsx("text", { fg: focusedField === "transport" ? t.primary : t.textMuted, children: "Transport" }), ["stdio", "http", "sse"].map((option) => {
+    return (_jsx(Semantic, { id: "mcp-editor", role: "dialog", name: title, isModal: true, children: _jsx("box", { position: "absolute", left: 0, top: 0, width: width, height: height, alignItems: "center", paddingTop: bottomAlignedModalTop(height, panelHeight), backgroundColor: t.overlay, children: _jsxs("box", { width: Math.min(86, width - 6), height: panelHeight, backgroundColor: t.backgroundPanel, paddingTop: 1, paddingBottom: 1, flexDirection: "column", children: [_jsxs("box", { flexShrink: 0, flexDirection: "row", justifyContent: "space-between", paddingLeft: 2, paddingRight: 2, children: [_jsx("text", { fg: t.primary, children: _jsx("b", { children: title }) }), _jsx("text", { fg: t.textMuted, children: "esc" })] }), _jsx("box", { flexShrink: 0, paddingLeft: 2, paddingRight: 2, paddingTop: 1, children: _jsxs("box", { flexDirection: "row", gap: 1, alignItems: "center", children: [_jsx("text", { fg: focusedField === "transport" ? t.primary : t.textMuted, children: "Transport" }), ["stdio", "http", "sse"].map((option) => {
                                     const active = draft.transport === option;
                                     const focused = focusedField === "transport";
                                     return (_jsx("box", { backgroundColor: active ? (focused ? t.selectedBg : t.backgroundElement) : undefined, paddingLeft: 1, paddingRight: 1, children: _jsx("text", { fg: active ? (focused ? t.primary : t.text) : t.textMuted, children: option }) }, option));

package/dist/src/ui/modals/api-key-modal.js

@@ -10,6 +10,6 @@ export function ApiKeyModal({ t, width, height, inputRef, error, onSubmit, }) {
     const panelWidth = Math.min(68, width - 6);
     const panelHeight = 13;
     const top = bottomAlignedModalTop(height, panelHeight);
-    return (_jsx(Semantic, { id: "api-key-modal", role: "dialog", name: "API Key", isModal: true, children: _jsx("box", { position: "absolute", left: 0, top: 0, width: width, height: height, alignItems: "center", paddingTop: top, backgroundColor: overlayBg, children: _jsxs("box", { width: panelWidth, height: panelHeight, backgroundColor: t.backgroundPanel, paddingTop: 1, paddingBottom: 1, flexDirection: "column", children: [_jsxs("box", { flexShrink: 0, flexDirection: "row", justifyContent: "space-between", paddingLeft: 2, paddingRight: 2, children: [_jsx("text", { fg: t.primary, children: _jsx("b", { children: "Add API key" }) }), _jsx("text", { fg: t.textMuted, children: "esc" })] }), _jsx("box", { paddingLeft: 2, paddingRight: 2, paddingTop: 1, children: _jsx("text", { fg: t.text, children: "Paste your DeepSeek or SiliconFlow API key to unlock chat. Esc hides this prompt." }) }), _jsx("box", { paddingLeft: 2, paddingRight: 2, paddingTop: 1, children: _jsx("box", { backgroundColor: t.backgroundElement, paddingLeft: 1, paddingRight: 1, width: "100%", children: _jsx(Semantic, { id: "api-key-input", role: "textbox", children: _jsx("textarea", { ref: inputRef, focused: true, placeholder: "sk-...", textColor: t.text, backgroundColor: t.backgroundElement, placeholderColor: t.textMuted, minHeight: 1, maxHeight: 3, wrapMode: "word", keyBindings: TEXTAREA_KEYBINDINGS, onSubmit: onSubmit }) }) }) }), _jsx("box", { flexGrow: 1, minHeight: 0 }), _jsx("box", { paddingLeft: 2, paddingRight: 2, paddingTop: 2, paddingBottom: 1, children: error ? (_jsx("text", { fg: t.diffRemovedFg, children: error })) : (_jsxs("text", { children: [_jsx("span", { style: { fg: t.primary }, children: "enter " }), _jsx("span", { style: { fg: t.textMuted }, children: "save key  ·  " }), _jsx("span", { style: { fg: t.primary }, children: "esc " }), _jsx("span", { style: { fg: t.textMuted }, children: "hide" })] })) })] }) }) }));
+    return (_jsx(Semantic, { id: "api-key-modal", role: "dialog", name: "API Key", isModal: true, children: _jsx("box", { position: "absolute", left: 0, top: 0, width: width, height: height, alignItems: "center", paddingTop: top, backgroundColor: overlayBg, children: _jsxs("box", { width: panelWidth, height: panelHeight, backgroundColor: t.backgroundPanel, paddingTop: 1, paddingBottom: 1, flexDirection: "column", children: [_jsxs("box", { flexShrink: 0, flexDirection: "row", justifyContent: "space-between", paddingLeft: 2, paddingRight: 2, children: [_jsx("text", { fg: t.primary, children: _jsx("b", { children: "Add API key" }) }), _jsx("text", { fg: t.textMuted, children: "esc" })] }), _jsx("box", { paddingLeft: 2, paddingRight: 2, paddingTop: 1, children: _jsx("text", { fg: t.text, children: "Paste your DeepSeek API key to unlock chat. Esc hides this prompt." }) }), _jsx("box", { paddingLeft: 2, paddingRight: 2, paddingTop: 1, children: _jsx("box", { backgroundColor: t.backgroundElement, paddingLeft: 1, paddingRight: 1, width: "100%", children: _jsx(Semantic, { id: "api-key-input", role: "textbox", children: _jsx("textarea", { ref: inputRef, focused: true, placeholder: "sk-...", textColor: t.text, backgroundColor: t.backgroundElement, placeholderColor: t.textMuted, minHeight: 1, maxHeight: 3, wrapMode: "word", keyBindings: TEXTAREA_KEYBINDINGS, onSubmit: onSubmit }) }) }) }), _jsx("box", { flexGrow: 1, minHeight: 0 }), _jsx("box", { paddingLeft: 2, paddingRight: 2, paddingTop: 2, paddingBottom: 1, children: error ? (_jsx("text", { fg: t.diffRemovedFg, children: error })) : (_jsxs("text", { children: [_jsx("span", { style: { fg: t.primary }, children: "enter " }), _jsx("span", { style: { fg: t.textMuted }, children: "save key  ·  " }), _jsx("span", { style: { fg: t.primary }, children: "esc " }), _jsx("span", { style: { fg: t.textMuted }, children: "hide" })] })) })] }) }) }));
 }
 //# sourceMappingURL=api-key-modal.js.map