@bubblebrain-ai/bubble 0.0.7 → 0.0.9

package/dist/tui-ink/run.d.ts

@@ -0,0 +1,37 @@
+import type { Agent } from "../agent.js";
+import type { CliArgs } from "../cli.js";
+import type { SessionManager } from "../session.js";
+import type { Provider } from "../types.js";
+import type { ProviderRegistry } from "../provider-registry.js";
+import type { SkillRegistry } from "../skills/registry.js";
+import { type ApprovalHandlerRef, type PlanHandlerRef } from "./app.js";
+import type { BashAllowlist } from "../approval/session-cache.js";
+import type { SettingsManager } from "../permissions/settings.js";
+import type { McpManager } from "../mcp/manager.js";
+import type { LspService } from "../lsp/index.js";
+import type { QuestionController } from "../question/index.js";
+import type { MemoryScope } from "../memory/index.js";
+import type { ResolvedTheme, ThemeMode } from "./theme.js";
+export interface RunTuiOptions {
+    sessionManager?: SessionManager;
+    createProvider?: (providerId: string, apiKey: string, baseURL: string) => Provider;
+    registry?: ProviderRegistry;
+    skillRegistry?: SkillRegistry;
+    planHandlerRef?: PlanHandlerRef;
+    approvalHandlerRef?: ApprovalHandlerRef;
+    questionController?: QuestionController;
+    bashAllowlist?: BashAllowlist;
+    settingsManager?: SettingsManager;
+    lspService?: LspService;
+    mcpManager?: McpManager;
+    themeMode?: ThemeMode;
+    themeOverrides?: Record<string, string>;
+    detectedTheme?: ResolvedTheme;
+    onThemeModeChange?: (mode: ThemeMode) => void;
+    flushMemory?: () => Promise<void>;
+    runMemoryCompaction?: () => Promise<string>;
+    runMemorySummary?: (scope?: MemoryScope) => Promise<string>;
+    runMemoryRefresh?: (scope?: MemoryScope) => Promise<string>;
+    bypassEnabled?: boolean;
+}
+export declare function runTui(agent: Agent, args: CliArgs, options?: RunTuiOptions): Promise<void>;

package/dist/tui-ink/run.js

@@ -0,0 +1,53 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { render } from "ink";
+import chalk from "chalk";
+import { App } from "./app.js";
+import { warmHighlighter } from "./code-highlight.js";
+export async function runTui(agent, args, options = {}) {
+    // Kick off shiki load before the first code block reaches <Static>. Fire and
+    // forget — CodeBlock's lazy init falls back to raw lines if this isn't ready
+    // yet, so callers don't need to await it.
+    warmHighlighter();
+    let exitSummary;
+    const instance = render(_jsx(App, { agent: agent, args: args, sessionManager: options.sessionManager, createProvider: options.createProvider, registry: options.registry, skillRegistry: options.skillRegistry, planHandlerRef: options.planHandlerRef, approvalHandlerRef: options.approvalHandlerRef, questionController: options.questionController, bashAllowlist: options.bashAllowlist, settingsManager: options.settingsManager, lspService: options.lspService, mcpManager: options.mcpManager, themeMode: options.themeMode, themeOverrides: options.themeOverrides, detectedTheme: options.detectedTheme, onThemeModeChange: options.onThemeModeChange, flushMemory: options.flushMemory, runMemoryCompaction: options.runMemoryCompaction, runMemorySummary: options.runMemorySummary, runMemoryRefresh: options.runMemoryRefresh, bypassEnabled: options.bypassEnabled, onExit: (summary) => {
+            // The app already called useApp().exit() inside requestExit, which
+            // triggers Ink's own unmount + TTY restore. waitUntilExit() below is
+            // the canonical signal that we're done — we deliberately do *not*
+            // call instance.unmount() again here to avoid double-teardown
+            // warnings on React 19. We capture the summary and render it after
+            // teardown so it lands in the real shell scrollback (Claude-Code style).
+            exitSummary = summary;
+        } }), {
+        kittyKeyboard: {
+            mode: "enabled",
+            flags: ["disambiguateEscapeCodes"],
+        },
+    });
+    await instance.waitUntilExit();
+    // zsh's PROMPT_SP prints a reverse-video `%` if the previous program left
+    // the cursor mid-line. Ink's interactive teardown (log-update.done) doesn't
+    // emit a trailing newline, so mirror Ink's non-interactive branch and align
+    // the cursor to column 0 before handing control back to the shell.
+    if (process.stdout.isTTY) {
+        process.stdout.write("\n");
+        if (exitSummary) {
+            process.stdout.write(formatExitSummary(exitSummary) + "\n");
+        }
+    }
+}
+function formatExitSummary(summary) {
+    const label = "Total duration (wall):";
+    return chalk.dim(`${label} ${formatWallMs(summary.wallMs)}`);
+}
+function formatWallMs(ms) {
+    const totalSeconds = Math.max(0, Math.round(ms / 1000));
+    if (totalSeconds < 60)
+        return `${totalSeconds}s`;
+    const minutes = Math.floor(totalSeconds / 60);
+    const seconds = totalSeconds % 60;
+    if (minutes < 60)
+        return `${minutes}m ${seconds}s`;
+    const hours = Math.floor(minutes / 60);
+    const minutesRest = minutes % 60;
+    return `${hours}h ${minutesRest}m ${seconds}s`;
+}

package/dist/tui-ink/theme.d.ts

@@ -0,0 +1,66 @@
+/**
+ * Color themes for the TUI.
+ *
+ * Two base palettes are shipped: `darkTheme` for dark terminal backgrounds and
+ * `lightTheme` for light ones. The shape is identical so consumers depend on
+ * `Theme` rather than either palette directly. Active palette is provided
+ * through `ThemeContext` so components re-render automatically when the
+ * user switches via `/theme` at runtime.
+ */
+export type ResolvedTheme = "light" | "dark";
+export type ThemeMode = "auto" | ResolvedTheme;
+export interface Theme {
+    user: string;
+    agent: string;
+    error: string;
+    warning: string;
+    success: string;
+    accent: string;
+    border: string;
+    borderActive: string;
+    inputBorder: string;
+    inputBorderDisabled: string;
+    inputBg: string;
+    inputBgDisabled: string;
+    inputText: string;
+    inputPlaceholder: string;
+    muted: string;
+    dim: string;
+    thinking: string;
+    thinkingDim: string;
+    toolName: string;
+    toolResult: string;
+    toolError: string;
+    toolPending: string;
+    code: string;
+    traceAction: string;
+    traceCount: string;
+    traceDetail: string;
+    traceCommand: string;
+    tracePending: string;
+    userMessageBorder: string;
+    userMessageBg: string;
+    userMessageText: string;
+    userRail: string;
+    diffAdd: string;
+    diffRemove: string;
+    diffAddFg: string;
+    diffRemoveFg: string;
+}
+export declare const darkTheme: Theme;
+/**
+ * Light palette. Two ground rules drove the color choices:
+ *   1. Named ANSI colors that render OK on both backgrounds (red/green/blue)
+ *      are kept by name so the user's terminal palette overrides remain
+ *      effective.
+ *   2. Specific hex values are used wherever the dark palette assumed a dark
+ *      background (notably accent/code/trace colors and message bubbles).
+ *      Each hex was picked to clear WCAG AA contrast (4.5:1) against a near-
+ *      white background (#fafafa) or, when applicable, against the explicit
+ *      surface color in the same palette (e.g. diffAddFg vs diffAdd).
+ */
+export declare const lightTheme: Theme;
+export declare const ThemeProvider: import("react").Provider<Theme>;
+export declare function useTheme(): Theme;
+/** Build the active palette given a resolved mode and optional overrides. */
+export declare function paletteFor(mode: ResolvedTheme, overrides?: Record<string, string>): Theme;

package/dist/tui-ink/theme.js

@@ -0,0 +1,115 @@
+/**
+ * Color themes for the TUI.
+ *
+ * Two base palettes are shipped: `darkTheme` for dark terminal backgrounds and
+ * `lightTheme` for light ones. The shape is identical so consumers depend on
+ * `Theme` rather than either palette directly. Active palette is provided
+ * through `ThemeContext` so components re-render automatically when the
+ * user switches via `/theme` at runtime.
+ */
+import { createContext, useContext } from "react";
+export const darkTheme = {
+    user: "green",
+    agent: "blue",
+    error: "red",
+    warning: "yellow",
+    success: "green",
+    accent: "cyan",
+    border: "gray",
+    borderActive: "cyan",
+    inputBorder: "#8A7FC6",
+    inputBorderDisabled: "#4a4754",
+    inputBg: "#1c1c24",
+    inputBgDisabled: "#161620",
+    inputText: "#f3f3f7",
+    inputPlaceholder: "#6c6a78",
+    muted: "gray",
+    dim: "gray",
+    thinking: "magenta",
+    thinkingDim: "gray",
+    toolName: "cyan",
+    toolResult: "gray",
+    toolError: "red",
+    toolPending: "yellow",
+    code: "yellow",
+    traceAction: "#E89A6B",
+    traceCount: "#c9c1bd",
+    traceDetail: "gray",
+    traceCommand: "#59BCE8",
+    tracePending: "yellow",
+    userMessageBorder: "#8A7FC6",
+    userMessageBg: "#2a2a34",
+    userMessageText: "#f3f3f7",
+    userRail: "#8A7FC6",
+    diffAdd: "#1a3d1a",
+    diffRemove: "#3d1a1a",
+    diffAddFg: "#9CDCFE",
+    diffRemoveFg: "#F48771",
+};
+/**
+ * Light palette. Two ground rules drove the color choices:
+ *   1. Named ANSI colors that render OK on both backgrounds (red/green/blue)
+ *      are kept by name so the user's terminal palette overrides remain
+ *      effective.
+ *   2. Specific hex values are used wherever the dark palette assumed a dark
+ *      background (notably accent/code/trace colors and message bubbles).
+ *      Each hex was picked to clear WCAG AA contrast (4.5:1) against a near-
+ *      white background (#fafafa) or, when applicable, against the explicit
+ *      surface color in the same palette (e.g. diffAddFg vs diffAdd).
+ */
+export const lightTheme = {
+    user: "green",
+    agent: "blue",
+    error: "red",
+    warning: "#9A6500", // ANSI yellow is invisible on white — go to dark amber.
+    success: "green",
+    accent: "#0E5A85", // dark teal — replaces "cyan" which washes out on white.
+    border: "gray",
+    borderActive: "#0E5A85",
+    inputBorder: "#6B5FB8",
+    inputBorderDisabled: "#c5c3d0",
+    inputBg: "#f5f5fa",
+    inputBgDisabled: "#ebebf2",
+    inputText: "#1c1c24",
+    inputPlaceholder: "#7a7886",
+    muted: "gray",
+    dim: "gray",
+    thinking: "magenta",
+    thinkingDim: "gray",
+    toolName: "#0E5A85",
+    toolResult: "gray",
+    toolError: "red",
+    toolPending: "#9A6500",
+    code: "#9A6500",
+    traceAction: "#B85A20",
+    traceCount: "#5a5a5a",
+    traceDetail: "gray",
+    traceCommand: "#1A5FA0",
+    tracePending: "#9A6500",
+    userMessageBorder: "#6B5FB8",
+    userMessageBg: "#e8e6f4",
+    userMessageText: "#1c1c24",
+    userRail: "#6B5FB8",
+    diffAdd: "#d4f4d4",
+    diffRemove: "#f4d4d4",
+    diffAddFg: "#1c1c24",
+    diffRemoveFg: "#1c1c24",
+};
+const ThemeContext = createContext(darkTheme);
+export const ThemeProvider = ThemeContext.Provider;
+export function useTheme() {
+    return useContext(ThemeContext);
+}
+/** Build the active palette given a resolved mode and optional overrides. */
+export function paletteFor(mode, overrides) {
+    const base = mode === "light" ? lightTheme : darkTheme;
+    if (!overrides)
+        return base;
+    const filtered = {};
+    for (const [key, value] of Object.entries(overrides)) {
+        if (typeof value === "string" && key in base) {
+            filtered[key] = value;
+        }
+    }
+    return { ...base, ...filtered };
+}

package/dist/tui-ink/todos.d.ts

@@ -0,0 +1,7 @@
+import type { Todo } from "../types.js";
+interface TodosPanelProps {
+    todos: Todo[];
+    terminalColumns: number;
+}
+export declare function TodosPanel({ todos, terminalColumns }: TodosPanelProps): import("react/jsx-runtime").JSX.Element | null;
+export {};

package/dist/tui-ink/todos.js

@@ -0,0 +1,46 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text } from "ink";
+import { useTheme } from "./theme.js";
+const MAX_ROWS = 8;
+export function TodosPanel({ todos, terminalColumns }) {
+    const theme = useTheme();
+    if (todos.length === 0) {
+        return null;
+    }
+    const rows = selectVisibleRows(todos);
+    const hiddenCount = todos.length - rows.length;
+    const contentWidth = Math.max(20, terminalColumns - 4);
+    return (_jsxs(Box, { flexDirection: "column", marginBottom: 1, children: [_jsx(Text, { color: theme.accent, bold: true, children: "\u25CF Todos" }), rows.map((todo, index) => (_jsx(TodoRow, { todo: todo, maxWidth: contentWidth }, index))), hiddenCount > 0 && (_jsxs(Text, { color: theme.muted, children: ["... ", hiddenCount, " more item", hiddenCount === 1 ? "" : "s", " hidden"] }))] }));
+}
+function selectVisibleRows(todos) {
+    if (todos.length <= MAX_ROWS) {
+        return todos;
+    }
+    // Prefer to show: all in_progress, the last N completed just before current, and upcoming pending.
+    const inProgressIdx = todos.findIndex((t) => t.status === "in_progress");
+    const anchor = inProgressIdx >= 0 ? inProgressIdx : todos.findIndex((t) => t.status === "pending");
+    const pivot = anchor >= 0 ? anchor : 0;
+    const half = Math.floor(MAX_ROWS / 2);
+    let start = Math.max(0, pivot - half);
+    let end = Math.min(todos.length, start + MAX_ROWS);
+    if (end - start < MAX_ROWS) {
+        start = Math.max(0, end - MAX_ROWS);
+    }
+    return todos.slice(start, end);
+}
+function TodoRow({ todo, maxWidth }) {
+    const theme = useTheme();
+    const { glyph, color, dim, label } = statusStyle(todo, theme);
+    const text = label || todo.content;
+    const trimmed = text.length > maxWidth - 4 ? text.slice(0, maxWidth - 5) + "…" : text;
+    return (_jsx(Box, { height: 1, children: _jsxs(Text, { color: color, dimColor: dim, children: [glyph, " ", trimmed] }) }));
+}
+function statusStyle(todo, theme) {
+    if (todo.status === "completed") {
+        return { glyph: "✔", color: theme.muted, dim: true, label: todo.content };
+    }
+    if (todo.status === "in_progress") {
+        return { glyph: "▶", color: theme.accent, dim: false, label: todo.activeForm || todo.content };
+    }
+    return { glyph: "○", color: theme.muted, dim: false, label: todo.content };
+}

package/dist/tui-ink/trace-groups.d.ts

@@ -0,0 +1,27 @@
+import type { DisplayToolCall } from "./display-history.js";
+export type TraceGroupKind = "list" | "read" | "search" | "execute" | "edit" | "write" | "subagent" | "other";
+export interface TraceGroup {
+    kind: TraceGroupKind;
+    title: string;
+    raw: DisplayToolCall[];
+    count?: number;
+    noun?: string;
+    command?: string;
+    items: string[];
+    previewLines: string[];
+    errorLines: string[];
+    omitted: number;
+    pending: boolean;
+    hasError: boolean;
+    errorCount: number;
+    startedAt?: number;
+}
+export interface TraceGroupOptions {
+    maxItems?: number;
+    maxPreviewLines?: number;
+    homeDir?: string;
+}
+export declare function buildTraceGroups(toolCalls: DisplayToolCall[], options?: TraceGroupOptions): TraceGroup[];
+export declare function formatTracePath(value: unknown, homeDir?: string): string;
+export declare function formatElapsed(startedAt: number | undefined, now?: number): string | null;
+export declare function traceGroupLabel(group: TraceGroup): string;