@bubblebrain-ai/bubble 0.0.49 → 0.0.51

package/dist/tui-ink/command-palette.d.ts

@@ -0,0 +1,32 @@
+import { SkillRegistry } from "../skills/registry.js";
+import type { McpManager } from "../mcp/manager.js";
+export interface PaletteItem {
+    label: string;
+    detail: string;
+    value: string;
+    command: string;
+    action?: "insert-skill";
+}
+export declare function buildCommandPaletteItems(skillRegistry: SkillRegistry, grokSessionBound?: boolean): PaletteItem[];
+export declare function buildMcpReconnectItems(mcpManager?: McpManager): PaletteItem[];
+export declare function CommandPalette({ items, terminalColumns, terminalRows, onSelect, onCancel, }: {
+    items: PaletteItem[];
+    terminalColumns: number;
+    terminalRows: number;
+    onSelect: (item: PaletteItem) => void;
+    onCancel: () => void;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function McpReconnectPicker({ items, terminalColumns, terminalRows, onSelect, onCancel, }: {
+    items: PaletteItem[];
+    terminalColumns: number;
+    terminalRows: number;
+    onSelect: (item: PaletteItem) => void;
+    onCancel: () => void;
+}): import("react/jsx-runtime").JSX.Element;
+export declare const INK_LOCAL_SLASH_COMMANDS: readonly [{
+    readonly name: "goal";
+    readonly description: "Set/manage an autonomous goal (/goal <objective>|clear|pause|resume|edit)";
+}, {
+    readonly name: "loop";
+    readonly description: "Run a prompt on a recurring interval (/loop 5m <prompt>|list|stop [id])";
+}];

package/dist/tui-ink/command-palette.js

@@ -0,0 +1,158 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Slash-command and MCP-server picker overlays, the local /goal & /loop
+ * command table, and the shared PalettePicker list UI they render through.
+ */
+import { useEffect, useMemo, useState } from "react";
+import { Box, Text, useInput } from "ink";
+import { registry as slashRegistry } from "../slash-commands/index.js";
+import { isGrokLocalSlashCommand } from "../external-runtime/grok-input-policy.js";
+import { useTheme } from "./theme.js";
+import { isPrintablePickerInput } from "./model-picker.js";
+import { isKeyReleaseEvent } from "./key-events.js";
+import { clampWindowStartForIndex, truncate } from "./app-helpers.js";
+export function buildCommandPaletteItems(skillRegistry, grokSessionBound = false) {
+    const items = new Map();
+    const add = (item) => {
+        const key = `${item.action ?? "command"}:${item.value}`;
+        if (!items.has(key))
+            items.set(key, item);
+    };
+    if (!grokSessionBound) {
+        for (const command of INK_LOCAL_SLASH_COMMANDS) {
+            add({
+                label: `/${command.name}`,
+                detail: command.description,
+                value: command.name,
+                command: `/${command.name}`,
+            });
+        }
+    }
+    for (const command of slashRegistry.list()) {
+        if (grokSessionBound && !isGrokLocalSlashCommand(command.name))
+            continue;
+        const source = command.source === "mcp" ? " :mcp" : "";
+        const sourceLabel = command.sourceLabel ? `[${command.sourceLabel}] ` : "";
+        add({
+            label: `/${command.name}${source}`,
+            detail: `${sourceLabel}${command.description}`,
+            value: command.name,
+            command: `/${command.name}`,
+        });
+    }
+    if (!grokSessionBound) {
+        for (const skill of skillRegistry.summaries()) {
+            add({
+                label: `/${skill.name} :skill`,
+                detail: `[${skill.source}] ${skill.description}`,
+                value: skill.name,
+                command: `/${skill.name}`,
+                action: "insert-skill",
+            });
+        }
+    }
+    return [...items.values()];
+}
+export function buildMcpReconnectItems(mcpManager) {
+    return (mcpManager?.getStates() ?? []).map((state) => {
+        let detail;
+        if (state.status.kind === "connected") {
+            const tools = state.status.tools.length;
+            const prompts = state.status.prompts.length;
+            detail = `connected · ${tools} tool${tools === 1 ? "" : "s"} · ${prompts} prompt${prompts === 1 ? "" : "s"}`;
+        }
+        else if (state.status.kind === "failed") {
+            detail = `failed · ${state.status.error}`;
+        }
+        else {
+            detail = "disabled";
+        }
+        return {
+            label: state.name,
+            detail,
+            value: state.name,
+            command: `/mcp reconnect ${state.name}`,
+        };
+    });
+}
+export function CommandPalette({ items, terminalColumns, terminalRows, onSelect, onCancel, }) {
+    return (_jsx(PalettePicker, { title: "Commands", hint: "Type to filter \u00B7 Up/Down choose \u00B7 Enter run \u00B7 Esc cancel", emptyText: "No commands found.", items: items, terminalColumns: terminalColumns, terminalRows: terminalRows, searchable: true, onSelect: onSelect, onCancel: onCancel }));
+}
+export function McpReconnectPicker({ items, terminalColumns, terminalRows, onSelect, onCancel, }) {
+    return (_jsx(PalettePicker, { title: "MCP servers", hint: "Up/Down choose \u00B7 Enter or r reconnect \u00B7 Esc cancel", emptyText: "No MCP servers configured.", items: items, terminalColumns: terminalColumns, terminalRows: terminalRows, reconnectAlias: true, onSelect: onSelect, onCancel: onCancel }));
+}
+function PalettePicker({ title, hint, emptyText, items, terminalColumns, terminalRows, searchable = false, reconnectAlias = false, onSelect, onCancel, }) {
+    const theme = useTheme();
+    const [query, setQuery] = useState("");
+    const [selectedIndex, setSelectedIndex] = useState(0);
+    const maxVisible = Math.max(5, Math.min(12, terminalRows - 10));
+    const filtered = useMemo(() => {
+        const needle = query.trim().toLowerCase();
+        if (!needle)
+            return items;
+        return items.filter((item) => item.label.toLowerCase().includes(needle) ||
+            item.detail.toLowerCase().includes(needle) ||
+            item.value.toLowerCase().includes(needle));
+    }, [items, query]);
+    useEffect(() => {
+        setSelectedIndex((current) => Math.min(Math.max(0, filtered.length - 1), current));
+    }, [filtered.length]);
+    useInput((input, key) => {
+        if (isKeyReleaseEvent(key))
+            return;
+        if (key.escape) {
+            onCancel();
+            return;
+        }
+        if (key.return || (reconnectAlias && input.toLowerCase() === "r")) {
+            const item = filtered[selectedIndex];
+            if (item)
+                onSelect(item);
+            return;
+        }
+        if (key.upArrow) {
+            setSelectedIndex((index) => Math.max(0, index - 1));
+            return;
+        }
+        if (key.downArrow) {
+            setSelectedIndex((index) => Math.min(Math.max(0, filtered.length - 1), index + 1));
+            return;
+        }
+        if (key.pageUp) {
+            setSelectedIndex((index) => Math.max(0, index - maxVisible));
+            return;
+        }
+        if (key.pageDown) {
+            setSelectedIndex((index) => Math.min(Math.max(0, filtered.length - 1), index + maxVisible));
+            return;
+        }
+        if (!searchable)
+            return;
+        if (key.backspace || key.delete) {
+            setQuery((current) => current.slice(0, -1));
+            return;
+        }
+        if (isPrintablePickerInput(input) && !key.ctrl && !key.meta) {
+            setQuery((current) => current + input);
+        }
+    });
+    const start = clampWindowStartForIndex(filtered.length, selectedIndex, maxVisible);
+    const visible = filtered.slice(start, start + maxVisible);
+    const labelWidth = Math.max(18, Math.min(36, Math.floor(terminalColumns * 0.32)));
+    const detailWidth = Math.max(20, terminalColumns - labelWidth - 10);
+    return (_jsxs(Box, { flexDirection: "column", marginY: 1, paddingX: 1, borderStyle: "round", borderColor: theme.borderActive, children: [_jsx(Text, { bold: true, color: theme.accent, children: title }), searchable && (_jsxs(Text, { color: theme.muted, children: ["Filter: ", _jsx(Text, { color: theme.userMessageText, children: query || " " })] })), _jsx(Text, { color: theme.muted, children: hint }), _jsxs(Box, { flexDirection: "column", marginTop: 1, children: [filtered.length === 0 && _jsx(Text, { color: theme.muted, children: emptyText }), visible.map((item, offset) => {
+                        const actualIndex = start + offset;
+                        const selected = actualIndex === selectedIndex;
+                        return (_jsxs(Box, { children: [_jsxs(Text, { color: selected ? theme.accent : undefined, children: [selected ? "> " : "  ", truncate(item.label, labelWidth)] }), _jsxs(Text, { color: theme.muted, children: [" ", truncate(item.detail, detailWidth)] })] }, `${item.action ?? "command"}-${item.value}`));
+                    })] })] }));
+}
+export const INK_LOCAL_SLASH_COMMANDS = [
+    {
+        name: "goal",
+        description: "Set/manage an autonomous goal (/goal <objective>|clear|pause|resume|edit)",
+    },
+    {
+        name: "loop",
+        description: "Run a prompt on a recurring interval (/loop 5m <prompt>|list|stop [id])",
+    },
+];

package/dist/tui-ink/display-reconstruct.d.ts

@@ -0,0 +1,3 @@
+import { type DisplayMessage } from "./display-history.js";
+import type { Message } from "../types.js";
+export declare function reconstructDisplayMessages(agentMessages: Message[]): DisplayMessage[];

package/dist/tui-ink/display-reconstruct.js

@@ -0,0 +1,82 @@
+/**
+ * Rebuilds UI DisplayMessages from the agent's raw transcript — used on
+ * initial mount and after transcript rewrites (rewind, resume).
+ */
+import { INTERRUPTED_ASSISTANT_CONTENT } from "../agent.js";
+import { isHiddenToolMetadata } from "../agent/tool-visibility.js";
+import { isInternalBlockOnlyContent } from "../agent/internal-reminder-sanitizer.js";
+import { nextDisplayMessageKey, stripInterruptedAssistantMarker } from "./display-history.js";
+export function reconstructDisplayMessages(agentMessages) {
+    const result = [];
+    for (const m of agentMessages) {
+        if (m.role === "system" || m.role === "tool")
+            continue;
+        if (m.role === "user") {
+            if (m.isMeta)
+                continue; // <system-reminder> injections are not user-visible
+            // Harness-initiated kicks (goal continuations, task wakes) persist as
+            // user-role messages wrapped in internal blocks so the model keeps
+            // them across resume — but they were hidden live and must stay hidden
+            // when the transcript is rebuilt.
+            if (isInternalBlockOnlyContent(m.content))
+                continue;
+            result.push({
+                key: nextDisplayMessageKey("user"),
+                role: "user",
+                content: typeof m.content === "string" ? m.content : "(multimedia)",
+            });
+        }
+        else if (m.role === "assistant") {
+            const toolCalls = [];
+            if (m.toolCalls) {
+                for (const tc of m.toolCalls) {
+                    let args = {};
+                    try {
+                        args = JSON.parse(tc.arguments || "{}");
+                    }
+                    catch {
+                        args = {};
+                    }
+                    const toolResult = agentMessages.find((tm) => tm.role === "tool" && tm.toolCallId === tc.id);
+                    if (isHiddenToolMetadata(toolResult ? toolResult.metadata : undefined))
+                        continue;
+                    toolCalls.push({
+                        id: tc.id,
+                        name: tc.name,
+                        args,
+                        result: toolResult ? toolResult.content : undefined,
+                        isError: toolResult ? toolResult.content?.startsWith?.("Error:") : false,
+                        metadata: toolResult ? toolResult.metadata : undefined,
+                    });
+                }
+            }
+            // An aborted assistant message carries the model-facing interruption
+            // note in its content. Render only what the assistant actually said
+            // (partial streamed text, if any) plus a dedicated interrupt row —
+            // never the note itself, which reads like a leaked system prompt.
+            const interrupted = m.error?.aborted === true;
+            const content = interrupted
+                ? stripInterruptedAssistantMarker(m.content, INTERRUPTED_ASSISTANT_CONTENT)
+                : m.content;
+            if (content || m.reasoning || toolCalls.length > 0 || m.systemFingerprint) {
+                result.push({
+                    key: nextDisplayMessageKey("asst"),
+                    role: "assistant",
+                    content,
+                    reasoning: m.reasoning || undefined,
+                    toolCalls: toolCalls.length > 0 ? toolCalls : undefined,
+                    systemFingerprint: m.systemFingerprint,
+                });
+            }
+            if (interrupted) {
+                result.push({
+                    key: nextDisplayMessageKey("asst"),
+                    role: "assistant",
+                    content: "Interrupted by user",
+                    syntheticKind: "ui_interrupt",
+                });
+            }
+        }
+    }
+    return result;
+}

package/dist/tui-ink/message-list.js

@@ -442,7 +442,6 @@ const TOOL_GLYPHS = {
     web_fetch: "⇲",
     web_search: "⌕",
     task: "↳",
-    todo: "✓",
     skill: "★",
 };
 function displayToolName(name) {

package/dist/tui-ink/rewind-picker.d.ts

@@ -0,0 +1,8 @@
+import type { SessionManager } from "../session.js";
+export declare function RewindPicker({ sessionManager, terminalColumns, terminalRows, onSelect, onCancel, }: {
+    sessionManager: SessionManager;
+    terminalColumns: number;
+    terminalRows: number;
+    onSelect: (command: string) => void;
+    onCancel: () => void;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/tui-ink/rewind-picker.js

@@ -0,0 +1,102 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * /rewind checkpoint picker: lists user turns with touched-file counts and
+ * cycles the restore scope (chat + files / chat only / files only).
+ */
+import { useEffect, useMemo, useState } from "react";
+import { Box, Text, useInput } from "ink";
+import { useTheme } from "./theme.js";
+import { isKeyReleaseEvent } from "./key-events.js";
+import { clampWindowStartForIndex, truncate } from "./app-helpers.js";
+const REWIND_SCOPE_ORDER = ["all", "chat", "code"];
+const REWIND_SCOPE_LABEL = {
+    all: "chat + files",
+    chat: "chat only",
+    code: "files only",
+};
+function rewindCommand(turnIndex, scope) {
+    const base = `/rewind ${turnIndex + 1}`;
+    if (scope === "chat")
+        return `${base} --chat`;
+    if (scope === "code")
+        return `${base} --code`;
+    return base;
+}
+function cycleRewindScope(scope, direction) {
+    const index = REWIND_SCOPE_ORDER.indexOf(scope);
+    return REWIND_SCOPE_ORDER[(index + direction + REWIND_SCOPE_ORDER.length) % REWIND_SCOPE_ORDER.length];
+}
+export function RewindPicker({ sessionManager, terminalColumns, terminalRows, onSelect, onCancel, }) {
+    const theme = useTheme();
+    const turns = useMemo(() => sessionManager.listUserTurns(), [sessionManager]);
+    const checkpoints = useMemo(() => sessionManager.getCheckpoints(), [sessionManager]);
+    const fileCounts = useMemo(() => {
+        const entries = checkpoints.listEntries();
+        const byTurn = new Map();
+        for (const entry of entries) {
+            const files = byTurn.get(entry.turn);
+            if (files)
+                files.add(entry.path);
+            else
+                byTurn.set(entry.turn, new Set([entry.path]));
+        }
+        return new Map(turns.map((turn) => [turn.id, byTurn.get(turn.id)?.size ?? 0]));
+    }, [checkpoints, turns]);
+    const [selectedIndex, setSelectedIndex] = useState(() => Math.max(0, turns.length - 1));
+    const [scope, setScope] = useState("all");
+    const maxVisible = Math.max(4, Math.min(10, terminalRows - 10));
+    useEffect(() => {
+        setSelectedIndex((current) => Math.min(Math.max(0, turns.length - 1), current));
+    }, [turns.length]);
+    useInput((input, key) => {
+        if (isKeyReleaseEvent(key))
+            return;
+        if (key.escape) {
+            onCancel();
+            return;
+        }
+        if (key.return) {
+            if (turns[selectedIndex])
+                onSelect(rewindCommand(selectedIndex, scope));
+            return;
+        }
+        if (key.upArrow) {
+            setSelectedIndex((index) => Math.max(0, index - 1));
+            return;
+        }
+        if (key.downArrow) {
+            setSelectedIndex((index) => Math.min(Math.max(0, turns.length - 1), index + 1));
+            return;
+        }
+        if (key.pageUp) {
+            setSelectedIndex((index) => Math.max(0, index - maxVisible));
+            return;
+        }
+        if (key.pageDown) {
+            setSelectedIndex((index) => Math.min(Math.max(0, turns.length - 1), index + maxVisible));
+            return;
+        }
+        if (key.tab || key.rightArrow || input === "l") {
+            setScope((current) => cycleRewindScope(current, 1));
+            return;
+        }
+        if (key.leftArrow || input === "h") {
+            setScope((current) => cycleRewindScope(current, -1));
+        }
+    });
+    const start = clampWindowStartForIndex(turns.length, selectedIndex, maxVisible);
+    const visibleTurns = turns.slice(start, start + maxVisible);
+    const previewWidth = Math.max(18, Math.min(76, terminalColumns - 34));
+    return (_jsxs(Box, { flexDirection: "column", marginY: 1, paddingX: 1, borderStyle: "round", borderColor: theme.borderActive, children: [_jsx(Text, { bold: true, color: theme.accent, children: "Rewind" }), _jsxs(Text, { color: theme.muted, children: ["Restore: ", _jsx(Text, { color: theme.accent, children: REWIND_SCOPE_LABEL[scope] }), "  ·  ", turns.length, " point", turns.length === 1 ? "" : "s"] }), _jsx(Text, { color: theme.muted, children: "Up/Down choose \u00B7 Left/Right scope \u00B7 Enter rewind \u00B7 Esc cancel" }), _jsxs(Box, { flexDirection: "column", marginTop: 1, children: [turns.length === 0 && _jsx(Text, { color: theme.muted, children: "Nothing to rewind: no user messages in this session." }), visibleTurns.map((turn, offset) => {
+                        const actualIndex = start + offset;
+                        const isSelected = actualIndex === selectedIndex;
+                        const touched = fileCounts.get(turn.id) ?? 0;
+                        return (_jsx(RewindRow, { turn: turn, turnNumber: actualIndex + 1, selected: isSelected, fileCount: touched, previewWidth: previewWidth }, turn.id));
+                    })] })] }));
+}
+function RewindRow({ turn, turnNumber, selected, fileCount, previewWidth, }) {
+    const theme = useTheme();
+    const time = new Date(turn.timestamp).toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" });
+    const fileNote = fileCount > 0 ? ` · ${fileCount} file${fileCount === 1 ? "" : "s"}` : "";
+    return (_jsxs(Box, { children: [_jsxs(Text, { color: selected ? theme.accent : undefined, children: [selected ? "> " : "  ", String(turnNumber).padStart(2, " "), " ", time, " ", truncate(turn.preview, previewWidth)] }), _jsx(Text, { color: theme.muted, children: fileNote })] }));
+}

package/dist/tui-ink/session-picker.js

@@ -19,7 +19,7 @@ export function SessionPicker({ currentCwd, currentSessions, allSessions, onSele
         ? 0
         : Math.min(selectedSessionIdx, sessionRowIndices.length - 1);
     const selectedRowIndex = sessionRowIndices[clampedIdx] ?? -1;
-    useInput((input, key) => {
+    useInput((_input, key) => {
         if (isKeyReleaseEvent(key))
             return;
         if (key.escape) {

package/dist/tui-ink/stats-panel.d.ts

@@ -0,0 +1,11 @@
+import { type StatsRange, type UsageStatsBundle } from "../stats/usage.js";
+export declare function StatsPanel({ panel, terminalColumns, terminalRows, onRangeChange, onCancel, }: {
+    panel: {
+        range: StatsRange;
+        bundle: UsageStatsBundle;
+    };
+    terminalColumns: number;
+    terminalRows: number;
+    onRangeChange: (range: StatsRange) => void;
+    onCancel: () => void;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/tui-ink/stats-panel.js

@@ -0,0 +1,65 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * /stats overlay: range-switching, scrollable usage panel.
+ */
+import { useEffect, useMemo, useState } from "react";
+import { Box, Text, useInput } from "ink";
+import { formatStatsPanelBody, rangeLabel } from "../stats/usage.js";
+import { useTheme } from "./theme.js";
+import { isKeyReleaseEvent } from "./key-events.js";
+export function StatsPanel({ panel, terminalColumns, terminalRows, onRangeChange, onCancel, }) {
+    const theme = useTheme();
+    const [scroll, setScroll] = useState(0);
+    const bodyWidth = Math.max(48, Math.min(92, terminalColumns - 6));
+    const lines = useMemo(() => formatStatsPanelBody(panel.bundle.ranges[panel.range], bodyWidth).split("\n"), [bodyWidth, panel.bundle, panel.range]);
+    const maxVisible = Math.max(5, Math.min(16, terminalRows - 10));
+    const maxScroll = Math.max(0, lines.length - maxVisible);
+    useEffect(() => {
+        setScroll(0);
+    }, [panel.range]);
+    useEffect(() => {
+        setScroll((current) => Math.min(current, maxScroll));
+    }, [maxScroll]);
+    useInput((input, key) => {
+        if (isKeyReleaseEvent(key))
+            return;
+        if (key.escape) {
+            onCancel();
+            return;
+        }
+        if (key.tab) {
+            onRangeChange(panel.range === "30d" ? "7d" : "30d");
+            return;
+        }
+        if (key.leftArrow || input === "h") {
+            onRangeChange("7d");
+            return;
+        }
+        if (key.rightArrow || input === "l") {
+            onRangeChange("30d");
+            return;
+        }
+        if (key.upArrow) {
+            setScroll((current) => Math.max(0, current - 1));
+            return;
+        }
+        if (key.downArrow) {
+            setScroll((current) => Math.min(maxScroll, current + 1));
+            return;
+        }
+        if (key.pageUp) {
+            setScroll((current) => Math.max(0, current - maxVisible));
+            return;
+        }
+        if (key.pageDown) {
+            setScroll((current) => Math.min(maxScroll, current + maxVisible));
+        }
+    });
+    const visible = lines.slice(scroll, scroll + maxVisible);
+    const generatedAt = panel.bundle.generatedAt.toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" });
+    return (_jsxs(Box, { flexDirection: "column", marginY: 1, paddingX: 1, borderStyle: "round", borderColor: theme.borderActive, children: [_jsx(Text, { bold: true, color: theme.accent, children: "Stats" }), _jsxs(Text, { color: theme.muted, children: [rangeLabel(panel.range), " \u00B7 generated ", generatedAt] }), _jsx(Text, { color: theme.muted, children: "Left/Right range \u00B7 Up/Down scroll \u00B7 Tab toggle \u00B7 Esc close" }), _jsx(Box, { flexDirection: "column", marginTop: 1, children: visible.map((line, index) => {
+                    const key = `${scroll + index}-${line}`;
+                    const heading = line === "Activity" || line === "Model usage" || line === "Summary";
+                    return (_jsx(Text, { color: heading ? theme.accent : undefined, bold: heading, children: line || " " }, key));
+                }) }), maxScroll > 0 && (_jsxs(Text, { color: theme.muted, children: [scroll + 1, "-", Math.min(lines.length, scroll + maxVisible), " of ", lines.length] }))] }));
+}

package/dist/tui-ink/waiting-indicator.d.ts

@@ -0,0 +1,12 @@
+import type { DisplayToolCall } from "./display-history.js";
+interface WaitingIndicatorProps {
+    tools: DisplayToolCall[];
+    hasStreamingText: boolean;
+    hasStreamingReasoning: boolean;
+    streamedChars: number;
+    nowTick: number;
+    pendingSteerCount?: number;
+    queuedCount?: number;
+}
+export declare function WaitingIndicator({ tools, hasStreamingText, hasStreamingReasoning, streamedChars, nowTick, pendingSteerCount, queuedCount, }: WaitingIndicatorProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/tui-ink/waiting-indicator.js

@@ -0,0 +1,129 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * The animated spinner row shown while a run is in flight: tool-targeted or
+ * generic phrases, streaming token counter, and steer/queue hints.
+ */
+import { useEffect, useState } from "react";
+import { Box, Text } from "ink";
+import { useTheme } from "./theme.js";
+const SPINNER_FRAMES = ["⠋", "⠙", "⠹", "⠸", "⠼", "⠴", "⠦", "⠧", "⠇", "⠏"];
+const GENERIC_PHRASES = [
+    "mapping the workspace",
+    "reading the room",
+    "following the threads",
+    "connecting the pieces",
+    "sorting the context",
+    "scanning the structure",
+    "shaping the next step",
+    "gathering signal",
+    "checking the edges",
+    "lining up the answer",
+    "tracing the flow",
+    "building the picture",
+    "walking the graph",
+    "collecting the clues",
+    "framing the problem",
+    "locating the source",
+    "resolving the shape",
+    "untangling the state",
+    "comparing the paths",
+    "narrowing the target",
+    "tracking the changes",
+    "reading the patterns",
+    "weighing the options",
+    "assembling the context",
+    "following the signal",
+    "checking the assumptions",
+    "aligning the details",
+    "testing the shape",
+    "pulling the thread",
+    "cleaning the edges",
+    "refining the draft",
+    "verifying the route",
+    "making sense of it",
+    "looking for leverage",
+    "stitching the answer",
+    "holding the thread",
+    "distilling the noise",
+    "finding the seam",
+    "reading between the lines",
+    "preparing the response",
+];
+const TOOL_TARGET_PHRASES = {
+    read: "reading files",
+    write: "writing changes",
+    edit: "patching files",
+    grep: "searching the codebase",
+    glob: "scanning paths",
+    ls: "listing directories",
+    bash: "running command",
+    web_search: "searching the web",
+    web_fetch: "fetching a page",
+    task: "spawning subagent",
+};
+function formatTokensApprox(chars) {
+    const tokens = Math.max(0, Math.round(chars / 4));
+    if (tokens < 1000)
+        return `${tokens}`;
+    if (tokens < 10000)
+        return `${(tokens / 1000).toFixed(1)}k`;
+    return `${Math.round(tokens / 1000)}k`;
+}
+export function WaitingIndicator({ tools, hasStreamingText, hasStreamingReasoning, streamedChars, nowTick, pendingSteerCount = 0, queuedCount = 0, }) {
+    void nowTick;
+    const theme = useTheme();
+    const [frameIndex, setFrameIndex] = useState(0);
+    const [idlePhrase, setIdlePhrase] = useState(() => GENERIC_PHRASES[0]);
+    // Frame timer is independent of the agent state — keeps animation smooth.
+    useEffect(() => {
+        const t = setInterval(() => {
+            setFrameIndex((i) => (i + 1) % SPINNER_FRAMES.length);
+        }, 100);
+        return () => clearInterval(t);
+    }, []);
+    // Determine state: active tool > streaming text > streaming reasoning > idle
+    const activeTool = [...tools].reverse().find((t) => !t.result);
+    const state = activeTool
+        ? "tool"
+        : hasStreamingText
+            ? "text"
+            : hasStreamingReasoning
+                ? "reasoning"
+                : "idle";
+    // Rotate idle phrases on a slower cadence; only matters in the idle state.
+    useEffect(() => {
+        if (state !== "idle")
+            return;
+        const t = setInterval(() => {
+            setIdlePhrase((current) => {
+                const candidates = GENERIC_PHRASES.filter((item) => item !== current);
+                return candidates[Math.floor(Math.random() * candidates.length)] || current;
+            });
+        }, 1500);
+        return () => clearInterval(t);
+    }, [state]);
+    let phrase;
+    if (state === "tool" && activeTool) {
+        phrase =
+            TOOL_TARGET_PHRASES[activeTool.name] || `running ${activeTool.name}`;
+    }
+    else if (state === "text") {
+        phrase = "writing the response";
+    }
+    else if (state === "reasoning") {
+        phrase = "working through the request";
+    }
+    else {
+        phrase = idlePhrase;
+    }
+    const tokenText = streamedChars > 0 ? `↓${formatTokensApprox(streamedChars)} tok` : "";
+    const hintParts = [];
+    if (tokenText)
+        hintParts.push(tokenText);
+    if (pendingSteerCount > 0)
+        hintParts.push(`${pendingSteerCount} pending steer${pendingSteerCount === 1 ? "" : "s"}`);
+    if (queuedCount > 0)
+        hintParts.push(`${queuedCount} queued`);
+    hintParts.push("enter steer", "tab queue", "esc stop");
+    return (_jsxs(Box, { children: [_jsx(Text, { color: theme.accent, children: SPINNER_FRAMES[frameIndex] }), _jsxs(Text, { color: theme.muted, children: [" ", phrase, " "] }), _jsxs(Text, { color: theme.muted, dimColor: true, children: ["(", hintParts.join(" · "), ")"] })] }));
+}

package/dist/types.d.ts

@@ -284,12 +284,6 @@ export type PlanDecision = {
     action: "reject";
     reason?: string;
 };
-export type TodoStatus = "pending" | "in_progress" | "completed";
-export interface Todo {
-    content: string;
-    status: TodoStatus;
-    activeForm: string;
-}
 export type StreamChunk = {
     type: "text";
     content: string;
@@ -463,9 +457,6 @@ export type AgentEvent = {
 } | {
     type: "mode_changed";
     mode: PermissionMode;
-} | {
-    type: "todos_updated";
-    todos: Todo[];
 } | {
     type: "agent_end";
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bubblebrain-ai/bubble",
-  "version": "0.0.49",
+  "version": "0.0.51",
   "description": "A terminal coding agent",
   "type": "module",
   "engines": {