@bubblebrain-ai/bubble 0.0.7 → 0.0.8

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

@@ -0,0 +1,326 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useEffect, useMemo } from "react";
+import { Box, Text, useInput, usePaste, useStdout } from "ink";
+import { theme } from "./theme.js";
+import { encodeModel, decodeModel, displayModel, isUserVisibleProvider } from "../provider-registry.js";
+import { listBuiltinModels } from "../model-catalog.js";
+export function ModelPicker({ registry, current, recent, onSelect, onCancel }) {
+    const { stdout } = useStdout();
+    const termHeight = stdout?.rows || 24;
+    const maxVisible = Math.max(5, termHeight - 10);
+    const [rawOptions, setRawOptions] = useState(() => buildLocalModelOptions(registry, current, recent));
+    const [refreshing, setRefreshing] = useState(false);
+    const [query, setQuery] = useState("");
+    const [selectedIndex, setSelectedIndex] = useState(() => preferredModelIndex(buildLocalModelOptions(registry, current, recent), current));
+    useEffect(() => {
+        let cancelled = false;
+        const localOptions = buildLocalModelOptions(registry, current, recent);
+        setRawOptions(localOptions);
+        setSelectedIndex(preferredModelIndex(localOptions, current));
+        async function refreshRemote() {
+            const enabled = registry.getEnabled();
+            const opts = [];
+            const seen = new Set();
+            // Recent first
+            for (const m of recent.slice(0, 5)) {
+                const { providerId } = decodeModel(m);
+                const provider = enabled.find((p) => p.id === providerId);
+                appendModelOption(opts, seen, {
+                    id: m,
+                    label: displayModel(m),
+                    group: "Recent",
+                    providerBadge: provider?.name || providerId || "",
+                });
+            }
+            const visibleProviders = enabled.filter((item) => isUserVisibleProvider(item.id));
+            const discovered = await Promise.all(visibleProviders.map(async (provider) => {
+                try {
+                    return { provider, models: await registry.listModels(provider) };
+                }
+                catch {
+                    return { provider, models: localModelsForProvider(registry, provider) };
+                }
+            }));
+            for (const { provider, models } of discovered) {
+                for (const m of models) {
+                    appendModelOption(opts, seen, {
+                        id: encodeModel(m.providerId, m.id),
+                        label: m.name,
+                        group: provider.name,
+                        providerBadge: provider.name,
+                    });
+                }
+            }
+            if (current && !seen.has(current)) {
+                const { providerId } = decodeModel(current);
+                const provider = enabled.find((p) => p.id === providerId);
+                opts.unshift({ id: current, label: displayModel(current), group: "Current", providerBadge: provider?.name || providerId || "" });
+            }
+            if (!cancelled) {
+                setRawOptions(opts);
+                setSelectedIndex((index) => {
+                    const currentIndex = preferredModelIndex(opts, current);
+                    return index === preferredModelIndex(localOptions, current) ? currentIndex : Math.min(index, Math.max(0, opts.length - 1));
+                });
+                setRefreshing(false);
+            }
+        }
+        setRefreshing(true);
+        void refreshRemote();
+        return () => {
+            cancelled = true;
+        };
+    }, [registry, current, recent]);
+    const options = useMemo(() => {
+        if (!query.trim())
+            return rawOptions;
+        const q = query.toLowerCase();
+        return rawOptions.filter((opt) => opt.label.toLowerCase().includes(q) || opt.providerBadge.toLowerCase().includes(q));
+    }, [rawOptions, query]);
+    useInput((input, key) => {
+        if (key.escape) {
+            onCancel();
+            return;
+        }
+        if (key.return) {
+            const opt = options[selectedIndex];
+            if (opt)
+                onSelect(opt.id);
+            return;
+        }
+        if (key.upArrow) {
+            setSelectedIndex((i) => Math.max(0, i - 1));
+            return;
+        }
+        if (key.downArrow) {
+            setSelectedIndex((i) => Math.min(options.length - 1, i + 1));
+            return;
+        }
+        if (key.backspace || key.delete) {
+            setQuery((q) => {
+                const next = q.slice(0, -1);
+                setSelectedIndex(0);
+                return next;
+            });
+            return;
+        }
+        if (input && !key.ctrl && !key.meta) {
+            setQuery((q) => {
+                const next = q + input;
+                setSelectedIndex(0);
+                return next;
+            });
+            return;
+        }
+    });
+    const start = Math.max(0, Math.min(selectedIndex, options.length - maxVisible));
+    const visible = options.slice(start, start + maxVisible);
+    return (_jsxs(Box, { flexDirection: "column", marginY: 1, paddingX: 1, borderStyle: "round", borderColor: theme.borderActive, children: [_jsx(Text, { bold: true, color: theme.accent, children: "Select Model" }), _jsx(SearchField, { query: query, placeholder: "Type to search models..." }), _jsx(Text, { color: theme.muted, children: "\u2191/\u2193 navigate \u00B7 Enter select \u00B7 Esc cancel \u00B7 Backspace clear" }), refreshing && _jsx(Text, { color: theme.muted, children: "Refreshing remote model list..." }), _jsxs(Box, { flexDirection: "column", marginTop: 1, children: [options.length === 0 && (_jsxs(Text, { color: theme.muted, children: ["No models match \"", query, "\""] })), visible.map((opt, i) => {
+                        const actualIndex = start + i;
+                        const isSelected = actualIndex === selectedIndex;
+                        return (_jsxs(Box, { children: [_jsxs(Text, { color: isSelected ? theme.accent : undefined, children: [isSelected ? "> " : "  ", opt.label] }), _jsx(Box, { marginLeft: 1, children: _jsx(Text, { color: theme.muted, dimColor: true, children: opt.providerBadge }) }), opt.id === current && (_jsx(Box, { marginLeft: 1, children: _jsx(Text, { color: theme.accent, children: "\u25CF" }) }))] }, opt.id));
+                    })] })] }));
+}
+function SearchField({ query, placeholder }) {
+    const [cursorVisible, setCursorVisible] = useState(true);
+    useEffect(() => {
+        const t = setInterval(() => setCursorVisible((v) => !v), 500);
+        return () => clearInterval(t);
+    }, []);
+    return (_jsxs(Box, { marginTop: 1, marginBottom: 1, children: [_jsx(Text, { color: theme.accent, children: "❯ " }), _jsx(Text, { children: query }), _jsx(Text, { color: theme.accent, inverse: cursorVisible, children: " " }), !query && _jsxs(Text, { color: theme.muted, dimColor: true, children: [" ", placeholder] })] }));
+}
+export function buildLocalModelOptions(registry, current, recent) {
+    const enabled = registry.getEnabled();
+    const opts = [];
+    const seen = new Set();
+    for (const model of recent.slice(0, 5)) {
+        const { providerId } = decodeModel(model);
+        const provider = enabled.find((item) => item.id === providerId);
+        appendModelOption(opts, seen, {
+            id: model,
+            label: displayModel(model),
+            group: "Recent",
+            providerBadge: provider?.name || providerId || "",
+        });
+    }
+    for (const provider of enabled.filter((item) => isUserVisibleProvider(item.id))) {
+        for (const model of localModelsForProvider(registry, provider)) {
+            appendModelOption(opts, seen, {
+                id: encodeModel(model.providerId, model.id),
+                label: model.name,
+                group: provider.name,
+                providerBadge: provider.name,
+            });
+        }
+    }
+    if (current && !seen.has(current)) {
+        const { providerId } = decodeModel(current);
+        const provider = enabled.find((item) => item.id === providerId);
+        opts.unshift({
+            id: current,
+            label: displayModel(current),
+            group: "Current",
+            providerBadge: provider?.name || providerId || "",
+        });
+    }
+    return opts;
+}
+function localModelsForProvider(registry, provider) {
+    const customModels = registry.getModelConfig().getCustomModels(provider.id);
+    if (customModels.length > 0)
+        return customModels;
+    const builtinProviderId = provider.id === "openai" && provider.authType === "oauth"
+        ? "openai-codex"
+        : provider.id;
+    return listBuiltinModels(builtinProviderId).map((model) => ({
+        id: model.id,
+        name: model.name,
+        providerId: provider.id,
+    }));
+}
+function appendModelOption(options, seen, option) {
+    if (seen.has(option.id))
+        return;
+    seen.add(option.id);
+    options.push(option);
+}
+function preferredModelIndex(options, current) {
+    const idx = options.findIndex((option) => option.id === current);
+    return idx >= 0 ? idx : 0;
+}
+export function ProviderPicker({ providers, current, onSelect, onCancel, title }) {
+    const { stdout } = useStdout();
+    const termHeight = stdout?.rows || 24;
+    const maxVisible = Math.max(5, termHeight - 8);
+    const [selectedIndex, setSelectedIndex] = useState(() => {
+        const idx = providers.findIndex((p) => p.id === current);
+        return idx >= 0 ? idx : 0;
+    });
+    useInput((input, key) => {
+        if (key.escape) {
+            onCancel();
+            return;
+        }
+        if (key.return) {
+            const p = providers[selectedIndex];
+            if (p)
+                onSelect(p.id);
+            return;
+        }
+        if (key.upArrow) {
+            setSelectedIndex((i) => Math.max(0, i - 1));
+            return;
+        }
+        if (key.downArrow) {
+            setSelectedIndex((i) => Math.min(providers.length - 1, i + 1));
+            return;
+        }
+        if (input && input.length === 1 && /[a-z]/i.test(input)) {
+            const char = input.toLowerCase();
+            for (let i = selectedIndex + 1; i < providers.length; i++) {
+                if (providers[i].name.toLowerCase().startsWith(char)) {
+                    setSelectedIndex(i);
+                    return;
+                }
+            }
+            for (let i = 0; i <= selectedIndex; i++) {
+                if (providers[i].name.toLowerCase().startsWith(char)) {
+                    setSelectedIndex(i);
+                    return;
+                }
+            }
+        }
+    });
+    const start = Math.max(0, Math.min(selectedIndex, providers.length - maxVisible));
+    const visible = providers.slice(start, start + maxVisible);
+    return (_jsxs(Box, { flexDirection: "column", marginY: 1, paddingX: 1, borderStyle: "round", borderColor: theme.borderActive, children: [_jsx(Text, { bold: true, color: theme.accent, children: title || "Select Provider" }), _jsx(Text, { color: theme.muted, children: "\u2191/\u2193 navigate \u00B7 Enter select \u00B7 Esc cancel \u00B7 type letter to jump" }), _jsx(Box, { flexDirection: "column", marginTop: 1, children: visible.map((p, i) => {
+                    const actualIndex = start + i;
+                    const isSelected = actualIndex === selectedIndex;
+                    return (_jsx(Box, { children: _jsxs(Text, { color: isSelected ? theme.accent : undefined, children: [isSelected ? "> " : "  ", p.name, p.id === current ? " (current)" : "", !p.enabled ? " [disabled]" : ""] }) }, p.id));
+                }) })] }));
+}
+export function KeyPicker({ providerName, onSubmit, onCancel }) {
+    const [value, setValue] = useState("");
+    useInput((input, key) => {
+        if (key.escape) {
+            onCancel();
+            return;
+        }
+        if (key.return) {
+            if (value.trim())
+                onSubmit(value.trim());
+            return;
+        }
+        if (key.backspace || key.delete) {
+            setValue((v) => v.slice(0, -1));
+            return;
+        }
+        if (input && !key.ctrl && !key.meta) {
+            setValue((v) => v + input);
+        }
+    });
+    // Append pasted clipboard content directly into the key field. Without
+    // this the paste falls through to whichever other hook (InputBox's
+    // usePaste) is active, and the key ends up in the main input area.
+    usePaste((pasted) => {
+        const clean = pasted.replace(/[\r\n\t]/g, "").trim();
+        if (clean)
+            setValue((v) => v + clean);
+    });
+    return (_jsxs(Box, { flexDirection: "column", marginY: 1, paddingX: 1, borderStyle: "round", borderColor: theme.borderActive, children: [_jsxs(Text, { bold: true, color: theme.accent, children: ["Enter API Key for ", providerName] }), _jsx(Text, { color: theme.muted, children: "Paste or type the key \u00B7 Enter to submit \u00B7 Esc to cancel" }), _jsx(SearchField, { query: value.replace(/./g, "*"), placeholder: "Paste your key here..." })] }));
+}
+export function SkillPicker({ skills, onSelect, onCancel }) {
+    const { stdout } = useStdout();
+    const termHeight = stdout?.rows || 24;
+    const maxVisible = Math.max(5, termHeight - 8);
+    const [query, setQuery] = useState("");
+    const [selectedIndex, setSelectedIndex] = useState(0);
+    const options = useMemo(() => {
+        const q = query.trim().toLowerCase();
+        if (!q)
+            return skills;
+        return skills.filter((skill) => skill.name.toLowerCase().includes(q) || skill.description.toLowerCase().includes(q));
+    }, [query, skills]);
+    useInput((input, key) => {
+        if (key.escape) {
+            onCancel();
+            return;
+        }
+        if (key.return) {
+            const skill = options[selectedIndex];
+            if (skill)
+                onSelect(skill.name);
+            return;
+        }
+        if (key.upArrow) {
+            setSelectedIndex((i) => Math.max(0, i - 1));
+            return;
+        }
+        if (key.downArrow) {
+            setSelectedIndex((i) => Math.min(Math.max(0, options.length - 1), i + 1));
+            return;
+        }
+        if (key.backspace || key.delete) {
+            setQuery((q) => {
+                const next = q.slice(0, -1);
+                setSelectedIndex(0);
+                return next;
+            });
+            return;
+        }
+        if (input && !key.ctrl && !key.meta) {
+            setQuery((q) => {
+                const next = q + input;
+                setSelectedIndex(0);
+                return next;
+            });
+        }
+    });
+    const start = Math.max(0, Math.min(selectedIndex, options.length - maxVisible));
+    const visible = options.slice(start, start + maxVisible);
+    return (_jsxs(Box, { flexDirection: "column", marginY: 1, paddingX: 1, borderStyle: "round", borderColor: theme.borderActive, children: [_jsx(Text, { bold: true, color: theme.accent, children: "Select Skill" }), _jsx(SearchField, { query: query, placeholder: "Type to search skills..." }), _jsx(Text, { color: theme.muted, children: "\u2191/\u2193 navigate \u00B7 Enter load \u00B7 Esc cancel \u00B7 Backspace clear" }), _jsxs(Box, { flexDirection: "column", marginTop: 1, children: [options.length === 0 && (_jsxs(Text, { color: theme.muted, children: ["No skills match \"", query, "\""] })), visible.map((skill, i) => {
+                        const actualIndex = start + i;
+                        const isSelected = actualIndex === selectedIndex;
+                        return (_jsxs(Box, { flexDirection: "column", children: [_jsxs(Text, { color: isSelected ? theme.accent : undefined, children: [isSelected ? "> " : "  ", skill.name] }), skill.description && (_jsx(Box, { marginLeft: 2, children: _jsx(Text, { color: theme.muted, dimColor: true, children: skill.description }) }))] }, skill.name));
+                    })] })] }));
+}

package/dist/tui-ink/plan-confirm.d.ts

@@ -0,0 +1,7 @@
+interface PlanConfirmProps {
+    initialPlan: string;
+    onApprove: (plan: string) => void;
+    onReject: (reason?: string) => void;
+}
+export declare function PlanConfirm({ initialPlan, onApprove, onReject }: PlanConfirmProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/tui-ink/plan-confirm.js

@@ -0,0 +1,104 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { Box, Text, useInput } from "ink";
+import { theme } from "./theme.js";
+import { MarkdownContent } from "./markdown.js";
+export function PlanConfirm({ initialPlan, onApprove, onReject }) {
+    const [stage, setStage] = useState("view");
+    const [draft, setDraft] = useState(initialPlan);
+    const [cursor, setCursor] = useState(initialPlan.length);
+    useInput((input, key) => {
+        if (stage === "view") {
+            if (key.escape || input === "n" || input === "N") {
+                onReject();
+                return;
+            }
+            if (input === "y" || input === "Y" || key.return) {
+                onApprove(initialPlan);
+                return;
+            }
+            if (input === "e" || input === "E") {
+                setStage("edit");
+                return;
+            }
+            return;
+        }
+        // edit stage
+        if (key.escape) {
+            setDraft(initialPlan);
+            setCursor(initialPlan.length);
+            setStage("view");
+            return;
+        }
+        if (key.ctrl && (input === "s" || input === "d")) {
+            const finalText = draft.trim();
+            if (!finalText) {
+                return;
+            }
+            onApprove(finalText);
+            return;
+        }
+        if (key.return) {
+            // Enter inserts a newline (multi-line editor).
+            insertAtCursor("\n");
+            return;
+        }
+        if (key.backspace || key.delete) {
+            if (cursor > 0) {
+                setDraft((prev) => prev.slice(0, cursor - 1) + prev.slice(cursor));
+                setCursor((c) => Math.max(0, c - 1));
+            }
+            return;
+        }
+        if (key.leftArrow) {
+            setCursor((c) => Math.max(0, c - 1));
+            return;
+        }
+        if (key.rightArrow) {
+            setCursor((c) => Math.min(draft.length, c + 1));
+            return;
+        }
+        if (key.upArrow || key.downArrow) {
+            const before = draft.slice(0, cursor);
+            const after = draft.slice(cursor);
+            const beforeLines = before.split("\n");
+            const afterLines = after.split("\n");
+            const currentCol = beforeLines[beforeLines.length - 1].length;
+            if (key.upArrow && beforeLines.length > 1) {
+                const prevLine = beforeLines[beforeLines.length - 2];
+                const col = Math.min(currentCol, prevLine.length);
+                const newCursor = before.length - beforeLines[beforeLines.length - 1].length - 1 - (prevLine.length - col);
+                setCursor(Math.max(0, newCursor));
+            }
+            else if (key.downArrow && afterLines.length > 1) {
+                const nextLine = afterLines[1];
+                const col = Math.min(currentCol, nextLine.length);
+                const newCursor = before.length + afterLines[0].length + 1 + col;
+                setCursor(Math.min(draft.length, newCursor));
+            }
+            return;
+        }
+        if (input) {
+            insertAtCursor(input);
+        }
+    });
+    function insertAtCursor(text) {
+        setDraft((prev) => prev.slice(0, cursor) + text + prev.slice(cursor));
+        setCursor((c) => c + text.length);
+    }
+    if (stage === "view") {
+        return (_jsxs(Box, { flexDirection: "column", borderStyle: "round", borderColor: theme.accent, paddingX: 1, marginY: 1, children: [_jsx(Text, { color: theme.accent, bold: true, children: "Proposed plan" }), _jsx(Box, { flexDirection: "column", marginTop: 1, children: _jsx(MarkdownContent, { content: initialPlan }) }), _jsx(Box, { marginTop: 1, children: _jsxs(Text, { color: theme.muted, children: [_jsx(Text, { color: theme.accent, bold: true, children: "y" }), " approve \u00A0\u00A0", _jsx(Text, { color: theme.accent, bold: true, children: "e" }), " edit \u00A0\u00A0", _jsx(Text, { color: theme.accent, bold: true, children: "n" }), "/", _jsx(Text, { color: theme.accent, bold: true, children: "esc" }), " reject"] }) })] }));
+    }
+    // edit stage
+    const lines = draft.split("\n");
+    const beforeCursor = draft.slice(0, cursor);
+    const cursorLineIndex = beforeCursor.split("\n").length - 1;
+    const cursorCol = beforeCursor.split("\n").pop()?.length || 0;
+    return (_jsxs(Box, { flexDirection: "column", borderStyle: "round", borderColor: theme.accent, paddingX: 1, marginY: 1, children: [_jsx(Text, { color: theme.accent, bold: true, children: "Edit plan" }), _jsx(Box, { flexDirection: "column", marginTop: 1, children: lines.map((line, index) => {
+                    if (index !== cursorLineIndex) {
+                        return (_jsx(Text, { children: line || " " }, index));
+                    }
+                    const safe = line || " ";
+                    return (_jsxs(Box, { children: [_jsx(Text, { children: safe.slice(0, cursorCol) }), _jsx(Text, { backgroundColor: "white", color: "black", children: safe[cursorCol] || " " }), _jsx(Text, { children: safe.slice(cursorCol + 1) })] }, index));
+                }) }), _jsx(Box, { marginTop: 1, children: _jsxs(Text, { color: theme.muted, children: [_jsx(Text, { color: theme.accent, bold: true, children: "\u2303S" }), " save & approve \u00A0\u00A0", _jsx(Text, { color: theme.accent, bold: true, children: "esc" }), " cancel edit"] }) })] }));
+}

package/dist/tui-ink/question-dialog.d.ts

@@ -0,0 +1,8 @@
+import type { QuestionAnswer, QuestionRequest } from "../question/index.js";
+interface QuestionDialogProps {
+    request: QuestionRequest;
+    onSubmit: (answers: QuestionAnswer[]) => void;
+    onCancel: () => void;
+}
+export declare function QuestionDialog({ request, onSubmit, onCancel }: QuestionDialogProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/tui-ink/question-dialog.js

@@ -0,0 +1,98 @@
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { useMemo, useState } from "react";
+import { Box, Text, useInput } from "ink";
+import { theme } from "./theme.js";
+export function QuestionDialog({ request, onSubmit, onCancel }) {
+    const [index, setIndex] = useState(0);
+    const [selected, setSelected] = useState(0);
+    const [custom, setCustom] = useState("");
+    const [answers, setAnswers] = useState(() => request.questions.map(() => []));
+    const question = request.questions[index];
+    const options = question?.options ?? [];
+    const canUseCustom = question?.custom !== false;
+    const isMultiple = question?.multiple === true;
+    const totalTabs = request.questions.length;
+    const currentAnswer = useMemo(() => answers[index] ?? [], [answers, index]);
+    const commitQuestion = () => {
+        const option = options[selected]?.label;
+        const customAnswer = custom.trim();
+        const nextAnswer = customAnswer
+            ? [customAnswer]
+            : isMultiple
+                ? currentAnswer
+                : option
+                    ? [option]
+                    : [];
+        const nextAnswers = answers.map((answer, i) => i === index ? nextAnswer : answer);
+        if (index < request.questions.length - 1) {
+            setAnswers(nextAnswers);
+            setIndex((i) => i + 1);
+            setSelected(0);
+            setCustom("");
+            return;
+        }
+        onSubmit(nextAnswers);
+    };
+    const toggleCurrentOption = () => {
+        const option = options[selected]?.label;
+        if (!option)
+            return;
+        if (!isMultiple) {
+            setAnswers((prev) => prev.map((answer, i) => i === index ? [option] : answer));
+            return;
+        }
+        setAnswers((prev) => prev.map((answer, i) => {
+            if (i !== index)
+                return answer;
+            return answer.includes(option)
+                ? answer.filter((item) => item !== option)
+                : [...answer, option];
+        }));
+    };
+    useInput((input, key) => {
+        if (key.escape) {
+            onCancel();
+            return;
+        }
+        if (key.leftArrow && index > 0) {
+            setIndex((i) => i - 1);
+            setSelected(0);
+            setCustom("");
+            return;
+        }
+        if (key.rightArrow && index < totalTabs - 1) {
+            setIndex((i) => i + 1);
+            setSelected(0);
+            setCustom("");
+            return;
+        }
+        if (key.upArrow) {
+            setSelected((i) => Math.max(0, i - 1));
+            return;
+        }
+        if (key.downArrow) {
+            setSelected((i) => Math.min(Math.max(0, options.length - 1), i + 1));
+            return;
+        }
+        if (key.tab || input === " ") {
+            toggleCurrentOption();
+            return;
+        }
+        if (key.return) {
+            commitQuestion();
+            return;
+        }
+        if (key.backspace || key.delete) {
+            setCustom((value) => value.slice(0, -1));
+            return;
+        }
+        if (canUseCustom && input && !key.ctrl && !key.meta) {
+            setCustom((value) => value + input);
+        }
+    });
+    return (_jsxs(Box, { flexDirection: "column", borderStyle: "round", borderColor: theme.accent, paddingX: 1, marginY: 1, children: [_jsxs(Text, { color: theme.accent, bold: true, children: ["Question ", totalTabs > 1 ? `${index + 1}/${totalTabs}` : ""] }), _jsx(Box, { marginTop: 1, children: _jsx(Text, { children: question?.question ?? "The agent is asking for input." }) }), _jsx(Box, { flexDirection: "column", marginTop: 1, children: options.map((option, optionIndex) => {
+                    const isSelected = optionIndex === selected;
+                    const isChecked = currentAnswer.includes(option.label);
+                    return (_jsxs(Box, { flexDirection: "column", children: [_jsxs(Text, { color: isSelected ? theme.accent : undefined, children: [isSelected ? "> " : "  ", isMultiple ? `[${isChecked ? "x" : " "}] ` : "", option.label] }), option.description && (_jsx(Box, { marginLeft: 4, children: _jsx(Text, { color: theme.muted, dimColor: true, children: option.description }) }))] }, `${option.label}-${optionIndex}`));
+                }) }), canUseCustom && (_jsx(Box, { marginTop: 1, children: _jsxs(Text, { color: custom ? undefined : theme.muted, children: ["Custom: ", custom || "type to answer..."] }) })), _jsx(Box, { marginTop: 1, children: _jsx(Text, { color: theme.muted, children: "\u2191\u2193 choose \u00B7 Tab/Space toggle \u00B7 Enter submit \u00B7 Esc dismiss" }) })] }));
+}

package/dist/tui-ink/recent-activity.d.ts

@@ -0,0 +1,8 @@
+export interface RecentSession {
+    file: string;
+    modifiedAt: number;
+    preview: string;
+}
+export declare function getRecentSessions(cwd: string, limit?: number): RecentSession[];
+export declare function formatRelativeTime(timestampMs: number, now?: number): string;
+export declare function truncatePreview(preview: string, maxLen: number): string;

package/dist/tui-ink/recent-activity.js

@@ -0,0 +1,71 @@
+import { readFileSync, readdirSync, statSync, existsSync } from "node:fs";
+import path from "node:path";
+import { getSessionsDir } from "../session.js";
+export function getRecentSessions(cwd, limit = 3) {
+    const dir = getSessionsDir(cwd);
+    if (!existsSync(dir))
+        return [];
+    const files = readdirSync(dir).filter((f) => f.endsWith(".jsonl"));
+    const withMtime = files.map((f) => {
+        const full = path.join(dir, f);
+        try {
+            return { file: f, full, modifiedAt: statSync(full).mtimeMs };
+        }
+        catch {
+            return { file: f, full, modifiedAt: 0 };
+        }
+    });
+    withMtime.sort((a, b) => b.modifiedAt - a.modifiedAt);
+    return withMtime.slice(0, limit).map(({ file, full, modifiedAt }) => ({
+        file,
+        modifiedAt,
+        preview: extractFirstUserMessage(full) ?? "(no messages)",
+    }));
+}
+export function formatRelativeTime(timestampMs, now = Date.now()) {
+    const diffSec = Math.max(0, Math.floor((now - timestampMs) / 1000));
+    if (diffSec < 60)
+        return "just now";
+    if (diffSec < 3600)
+        return `${Math.floor(diffSec / 60)}m ago`;
+    if (diffSec < 86400)
+        return `${Math.floor(diffSec / 3600)}h ago`;
+    if (diffSec < 604800)
+        return `${Math.floor(diffSec / 86400)}d ago`;
+    const weeks = Math.floor(diffSec / 604800);
+    if (weeks < 5)
+        return `${weeks}w ago`;
+    const months = Math.floor(diffSec / (30 * 86400));
+    return `${months}mo ago`;
+}
+function extractFirstUserMessage(file) {
+    let raw;
+    try {
+        raw = readFileSync(file, "utf-8");
+    }
+    catch {
+        return null;
+    }
+    const lines = raw.split("\n");
+    for (const line of lines) {
+        if (!line.trim())
+            continue;
+        let entry;
+        try {
+            entry = JSON.parse(line);
+        }
+        catch {
+            continue;
+        }
+        if (entry.type === "user_message" && typeof entry.message?.content === "string") {
+            return entry.message.content;
+        }
+    }
+    return null;
+}
+export function truncatePreview(preview, maxLen) {
+    const firstLine = preview.split("\n")[0]?.trim() ?? "";
+    if (firstLine.length <= maxLen)
+        return firstLine;
+    return firstLine.slice(0, Math.max(1, maxLen - 1)) + "…";
+}

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

@@ -0,0 +1,33 @@
+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";
+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;
+    theme?: Record<string, string>;
+    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>;