@hasna/terminal 0.1.4 → 0.2.0

package/.claude/scheduled_tasks.lock

@@ -1 +1 @@
-{"sessionId":"501c27b4-5243-40d6-8fb5-04ebdb3c8df8","pid":90841,"acquiredAt":1773556984409}
+{"sessionId":"c1e414c7-f1a5-4b9e-bcc4-64c451584cb8","pid":54679,"acquiredAt":1773566918526}

package/README.md

@@ -0,0 +1,186 @@
+# open-terminal
+
+Smart terminal wrapper for AI agents and humans. Speak plain English or let agents execute commands with structured output, token compression, and massive context savings.
+
+## Why?
+
+AI agents waste tokens on terminal interaction. Every `npm test` dumps hundreds of lines into context. Every `find` returns noise. `open-terminal` sits between callers and the shell, making every interaction dramatically more efficient.
+
+**For agents:** MCP server with structured output, token compression, diff-aware caching, smart search, process supervision. Cut token usage 50-90% on verbose commands.
+
+**For humans:** Natural language terminal powered by Cerebras (free, open-source) or Anthropic. Type "count typescript files" instead of `find . -name '*.ts' | wc -l`.
+
+## Install
+
+```bash
+npm install -g @hasna/terminal
+```
+
+## Quick Start
+
+### For Humans (TUI Mode)
+
+```bash
+# Set your API key (pick one)
+export CEREBRAS_API_KEY=your_key  # free, open-source (default)
+export ANTHROPIC_API_KEY=your_key # Claude
+
+# Launch
+t
+```
+
+Type in plain English. The terminal translates, shows you the command, and runs it.
+
+### For AI Agents (MCP Server)
+
+```bash
+# Install for your agent
+t mcp install --claude   # Claude Code
+t mcp install --codex    # OpenAI Codex
+t mcp install --gemini   # Gemini CLI
+t mcp install --all      # All agents
+
+# Or start manually
+t mcp serve
+```
+
+## MCP Tools
+
+| Tool | Description | Token Savings |
+|------|-------------|---------------|
+| `execute` | Run command with structured output, compression, or AI summary | 50-90% |
+| `execute_diff` | Run command, return only what changed since last run | 80-95% |
+| `browse` | List files as structured JSON, auto-filter node_modules | 60-80% |
+| `search_files` | Find files by pattern, categorized (source/config/other) | 70-90% |
+| `search_content` | Grep with grouping by file and relevance ranking | 60-80% |
+| `explain_error` | Structured error diagnosis with fix suggestions | N/A |
+| `bg_start` | Start background process with port auto-detection | N/A |
+| `bg_status` | List managed processes with health info | N/A |
+| `bg_wait_port` | Wait for a port to be ready | N/A |
+| `bg_stop` / `bg_logs` | Stop process / get recent output | N/A |
+| `list_recipes` / `run_recipe` / `save_recipe` | Reusable command templates | N/A |
+| `snapshot` | Capture terminal state for agent handoff | N/A |
+| `token_stats` | Token economy dashboard | N/A |
+
+### Example: Structured Output
+
+```
+Agent: execute("npm test", {format: "json"})
+
+→ {"passed": 142, "failed": 2, "failures": [{"test": "auth.test.ts:45", "error": "expected 200 got 401"}]}
+  (saved 847 tokens vs raw output)
+```
+
+### Example: Diff Mode
+
+```
+Agent: execute_diff("npm test")  # first run → full output
+Agent: execute_diff("npm test")  # second run → only changes
+
+→ {"diffSummary": "+1 new line, -1 removed", "added": ["PASS auth.test.ts:45"], "removed": ["FAIL auth.test.ts:45"], "tokensSaved": 892}
+```
+
+### Example: Smart Search
+
+```
+Agent: search_files("*hooks*")
+
+→ {"source": ["src/lib/webhooks.ts", "src/hooks/useAuth.ts"], "filtered": [{"count": 47, "reason": "node_modules"}], "tokensSaved": 312}
+```
+
+## Recipes
+
+Reusable command templates with variable substitution:
+
+```bash
+# Save a recipe
+t recipe add kill-port "lsof -i :{port} -t | xargs kill"
+
+# Run it
+t recipe run kill-port --port=3000
+
+# List recipes
+t recipe list
+
+# Project-scoped recipes
+t project init
+t recipe add dev-start "npm run dev" --project
+
+# Collections
+t collection create docker "Docker commands"
+t recipe add docker-build "docker build -t {tag} ." --collection=docker
+```
+
+## Token Economy
+
+Track how many tokens you've saved:
+
+```bash
+t stats
+```
+
+```
+Token Economy:
+  Total saved:  124.5K
+  By feature:
+    Structured: 45.2K
+    Compressed: 32.1K
+    Diff cache: 28.7K
+    Search:     18.5K
+```
+
+## TUI Keyboard Shortcuts
+
+| Key | Action |
+|-----|--------|
+| `ctrl+t` | New tab |
+| `tab` | Switch tabs |
+| `ctrl+w` | Close tab |
+| `ctrl+b` | Browse mode (file navigator) |
+| `ctrl+r` | Fuzzy history search |
+| `ctrl+l` | Clear scrollback |
+| `ctrl+c` | Cancel / exit |
+| `?` | Explain command before running |
+| `e` | Edit translated command |
+| `→` | Accept ghost text suggestion |
+
+## Configuration
+
+Config stored at `~/.terminal/config.json`:
+
+```json
+{
+  "provider": "cerebras",
+  "permissions": {
+    "destructive": true,
+    "network": true,
+    "sudo": false,
+    "install": true,
+    "write_outside_cwd": false
+  }
+}
+```
+
+## Architecture
+
+```
+┌──────────────────────────────────────────┐
+│            open-terminal                  │
+│  ┌──────────┐  ┌──────────┐  ┌────────┐ │
+│  │ Human    │  │ MCP      │  │ CLI    │ │
+│  │ TUI      │  │ Server   │  │ Tools  │ │
+│  └────┬─────┘  └────┬─────┘  └───┬────┘ │
+│       └──────────┬───┘────────────┘      │
+│   ┌──────────────────────────────────┐   │
+│   │  Output Intelligence Router      │   │
+│   │  Parsers → Compression → Diff    │   │
+│   └──────────────┬───────────────────┘   │
+│   ┌──────────────────────────────────┐   │
+│   │  Shell (zsh/bash)                │   │
+│   └──────────────────────────────────┘   │
+└──────────────────────────────────────────┘
+```
+
+## License
+
+MIT

package/dist/App.js

@@ -3,76 +3,124 @@ import { useState, useCallback, useRef } from "react";
 import { Box, Text, useInput, useApp } from "ink";
 import { spawn } from "child_process";
 import { translateToCommand, explainCommand, fixCommand, checkPermissions, isIrreversible } from "./ai.js";
-import { loadHistory, appendHistory, loadConfig, saveConfig, } from "./history.js";
+import { loadHistory, appendHistory, loadConfig, saveConfig } from "./history.js";
 import { loadCache } from "./cache.js";
 import Onboarding from "./Onboarding.js";
 import StatusBar from "./StatusBar.js";
 import Spinner from "./Spinner.js";
-// warm cache on startup
+import Browse from "./Browse.js";
+import FuzzyPicker from "./FuzzyPicker.js";
 loadCache();
 const MAX_LINES = 20;
 // ── helpers ───────────────────────────────────────────────────────────────────
 function insertAt(s, pos, ch) { return s.slice(0, pos) + ch + s.slice(pos); }
 function deleteAt(s, pos) { return pos <= 0 ? s : s.slice(0, pos - 1) + s.slice(pos); }
-function runCommand(command, onLine, onDone, signal) {
-    const proc = spawn("/bin/zsh", ["-c", command], { stdio: ["ignore", "pipe", "pipe"] });
-    const handleData = (data) => {
-        const text = data.toString();
-        text.split("\n").forEach((line) => { if (line)
-            onLine(line); });
+/** Detect if output lines look like file paths */
+function extractFilePaths(lines) {
+    return lines.filter(l => /^\.?\//.test(l.trim()) || /\.(ts|tsx|js|json|md|py|sh|go|rs|txt|yaml|yml|env)$/.test(l.trim()));
+}
+/** Ghost text: find the best NL match that starts with the current input */
+function ghostText(input, history) {
+    if (!input.trim())
+        return "";
+    const lower = input.toLowerCase();
+    const match = [...history].reverse().find(h => h.toLowerCase().startsWith(lower) && h.length > input.length);
+    return match ? match.slice(input.length) : "";
+}
+/** Detect cd and change process cwd */
+function maybeCd(command) {
+    const m = command.match(/^\s*cd\s+(.+)\s*$/);
+    if (!m)
+        return null;
+    let target = m[1].trim().replace(/^['"]|['"]$/g, "");
+    if (target.startsWith("~"))
+        target = target.replace("~", process.env.HOME ?? "");
+    return target;
+}
+function newTab(id, cwd) {
+    return {
+        id, cwd,
+        scroll: [], sessionCmds: [], sessionNl: [],
+        phase: { type: "input", value: "", cursor: 0, histIdx: -1, raw: false },
+        streamLines: [],
     };
-    proc.stdout?.on("data", handleData);
-    proc.stderr?.on("data", handleData);
-    proc.on("close", (code) => onDone(code ?? 0));
+}
+function runCommand(command, cwd, onLine, onDone, signal) {
+    const proc = spawn("/bin/zsh", ["-c", command], { cwd, stdio: ["ignore", "pipe", "pipe"] });
+    const handle = (d) => d.toString().split("\n").forEach(l => { if (l)
+        onLine(l); });
+    proc.stdout?.on("data", handle);
+    proc.stderr?.on("data", handle);
+    proc.on("close", code => onDone(code ?? 0));
     signal.addEventListener("abort", () => { try {
         proc.kill("SIGTERM");
     }
     catch { } });
-    return proc;
 }
-// ── component ─────────────────────────────────────────────────────────────────
+// ── App ───────────────────────────────────────────────────────────────────────
 export default function App() {
     const { exit } = useApp();
     const [config, setConfig] = useState(() => loadConfig());
-    const [nlHistory] = useState(() => loadHistory().map((h) => h.nl).filter(Boolean));
-    const [sessionCmds, setSessionCmds] = useState([]);
-    const [sessionNl, setSessionNl] = useState([]);
-    const [scroll, setScroll] = useState([]);
-    const [streamLines, setStreamLines] = useState([]);
+    const [nlHistory] = useState(() => loadHistory().map(h => h.nl).filter(Boolean));
+    const [tabs, setTabs] = useState([newTab(1, process.cwd())]);
+    const [activeTab, setActiveTab] = useState(0);
     const abortRef = useRef(null);
-    const [phase, setPhase] = useState({
-        type: "input", value: "", cursor: 0, histIdx: -1, raw: false,
-    });
-    const allNl = [...nlHistory, ...sessionNl];
-    const finishOnboarding = (perms) => {
-        const next = { onboarded: true, confirm: false, permissions: perms };
-        setConfig(next);
-        saveConfig(next);
-    };
+    let nextTabId = useRef(2);
+    const tab = tabs[activeTab];
+    const allNl = [...nlHistory, ...tab.sessionNl];
+    // ── tab helpers ─────────────────────────────────────────────────────────────
+    const updateTab = (updater) => setTabs(ts => ts.map((t, i) => i === activeTab ? updater(t) : t));
+    const setPhase = (phase) => updateTab(t => ({ ...t, phase }));
+    const setStreamLines = (lines) => updateTab(t => ({ ...t, streamLines: lines }));
     const inputPhase = (overrides = {}) => {
-        setPhase({ type: "input", value: "", cursor: 0, histIdx: -1, raw: false, ...overrides });
-        setStreamLines([]);
+        updateTab(t => ({
+            ...t,
+            streamLines: [],
+            phase: { type: "input", value: "", cursor: 0, histIdx: -1, raw: false, ...overrides },
+        }));
     };
-    const pushScroll = (entry) => setScroll((s) => [...s, { ...entry, expanded: false }]);
+    const pushScroll = (entry) => updateTab(t => ({ ...t, scroll: [...t.scroll, { ...entry, expanded: false }] }));
     const commitStream = (nl, cmd, lines, error) => {
         const truncated = lines.length > MAX_LINES;
-        pushScroll({ nl, cmd, lines: truncated ? lines.slice(0, MAX_LINES) : lines, truncated, error });
+        const filePaths = !error ? extractFilePaths(lines) : [];
+        updateTab(t => ({
+            ...t,
+            streamLines: [],
+            sessionCmds: [...t.sessionCmds.slice(-9), cmd],
+            scroll: [...t.scroll, {
+                    nl, cmd,
+                    lines: truncated ? lines.slice(0, MAX_LINES) : lines,
+                    truncated, expanded: false,
+                    error: error || undefined,
+                    filePaths: filePaths.length ? filePaths : undefined,
+                }],
+        }));
         appendHistory({ nl, cmd, output: lines.join("\n"), ts: Date.now(), error });
-        setSessionCmds((c) => [...c.slice(-9), cmd]);
-        setStreamLines([]);
     };
+    // ── run command ─────────────────────────────────────────────────────────────
     const runPhase = async (nl, command, raw) => {
         setPhase({ type: "running", nl, command });
-        setStreamLines([]);
+        updateTab(t => ({ ...t, streamLines: [] }));
         const abort = new AbortController();
         abortRef.current = abort;
         const lines = [];
-        await new Promise((resolve) => {
-            runCommand(command, (line) => { lines.push(line); setStreamLines([...lines]); }, (code) => {
+        const cwd = tabs[activeTab].cwd;
+        await new Promise(resolve => {
+            runCommand(command, cwd, line => { lines.push(line); setStreamLines([...lines]); }, code => {
+                // handle cd — update tab cwd
+                const cdTarget = maybeCd(command);
+                if (cdTarget) {
+                    try {
+                        const { resolve: resolvePath } = require("path");
+                        const newCwd = require("path").resolve(cwd, cdTarget);
+                        process.chdir(newCwd);
+                        updateTab(t => ({ ...t, cwd: newCwd }));
+                    }
+                    catch { }
+                }
                 commitStream(nl, command, lines, code !== 0);
                 abortRef.current = null;
                 if (code !== 0 && !raw) {
-                    // offer auto-fix
                     setPhase({ type: "autofix", nl, command, errorOutput: lines.join("\n") });
                 }
                 else {
@@ -82,8 +130,43 @@ export default function App() {
             }, abort.signal);
         });
     };
+    // ── translate + run ─────────────────────────────────────────────────────────
+    const translateAndRun = async (nl, raw) => {
+        updateTab(t => ({ ...t, sessionNl: [...t.sessionNl, nl] }));
+        if (raw) {
+            await runPhase(nl, nl, true);
+            return;
+        }
+        const sessionCmds = tabs[activeTab].sessionCmds;
+        setPhase({ type: "thinking", nl, partial: "" });
+        try {
+            const command = await translateToCommand(nl, config.permissions, sessionCmds, partial => setPhase({ type: "thinking", nl, partial }));
+            const blocked = checkPermissions(command, config.permissions);
+            if (blocked) {
+                pushScroll({ nl, cmd: command, lines: [`blocked: ${blocked}`], truncated: false, error: true });
+                inputPhase();
+                return;
+            }
+            const danger = isIrreversible(command);
+            if (!config.confirm && !danger) {
+                await runPhase(nl, command, false);
+                return;
+            }
+            setPhase({ type: "confirm", nl, command, danger });
+        }
+        catch (e) {
+            setPhase({ type: "error", message: e.message });
+        }
+    };
+    // ── input handler ───────────────────────────────────────────────────────────
     useInput(useCallback(async (input, key) => {
-        // ── running: Ctrl+C kills process ─────────────────────────────────
+        const phase = tabs[activeTab].phase;
+        // ── global: ctrl+c always exits ─────────────────────────────────────────
+        if (key.ctrl && input === "c" && phase.type !== "running") {
+            exit();
+            return;
+        }
+        // ── running: ctrl+c cancels ──────────────────────────────────────────────
         if (phase.type === "running") {
             if (key.ctrl && input === "c") {
                 abortRef.current?.abort();
@@ -91,20 +174,46 @@ export default function App() {
             }
             return;
         }
-        // ── input ─────────────────────────────────────────────────────────
+        // ── browse ───────────────────────────────────────────────────────────────
+        if (phase.type === "browse")
+            return; // handled by Browse component
+        // ── fuzzy ────────────────────────────────────────────────────────────────
+        if (phase.type === "fuzzy")
+            return; // handled by FuzzyPicker component
+        // ── input ────────────────────────────────────────────────────────────────
         if (phase.type === "input") {
-            if (key.ctrl && input === "c") {
-                exit();
+            // global shortcuts
+            if (key.ctrl && input === "l") {
+                updateTab(t => ({ ...t, scroll: [] }));
                 return;
             }
-            if (key.ctrl && input === "l") {
-                setScroll([]);
+            if (key.ctrl && input === "b") {
+                setPhase({ type: "browse", cwd: tab.cwd });
                 return;
             }
             if (key.ctrl && input === "r") {
-                setPhase({ ...phase, raw: !phase.raw, value: "", cursor: 0 });
+                setPhase({ type: "fuzzy" });
+                return;
+            }
+            // tab management
+            if (key.ctrl && input === "t") {
+                const id = nextTabId.current++;
+                setTabs(ts => [...ts, newTab(id, tab.cwd)]);
+                setActiveTab(tabs.length); // new tab index
                 return;
             }
+            if (key.ctrl && input === "w") {
+                if (tabs.length > 1) {
+                    setTabs(ts => ts.filter((_, i) => i !== activeTab));
+                    setActiveTab(i => Math.min(i, tabs.length - 2));
+                }
+                return;
+            }
+            if (key.tab) {
+                setActiveTab(i => (i + 1) % tabs.length);
+                return;
+            }
+            // history nav
             if (key.upArrow) {
                 const idx = Math.min(phase.histIdx + 1, allNl.length - 1);
                 const val = allNl[allNl.length - 1 - idx] ?? "";
@@ -117,45 +226,37 @@ export default function App() {
                 setPhase({ ...phase, value: val, cursor: val.length, histIdx: idx });
                 return;
             }
+            // cursor movement
             if (key.leftArrow) {
                 setPhase({ ...phase, cursor: Math.max(0, phase.cursor - 1) });
                 return;
             }
             if (key.rightArrow) {
-                setPhase({ ...phase, cursor: Math.min(phase.value.length, phase.cursor + 1) });
+                // right arrow at end → accept ghost text
+                const ghost = ghostText(phase.value, allNl);
+                if (phase.cursor === phase.value.length && ghost) {
+                    const full = phase.value + ghost;
+                    setPhase({ ...phase, value: full, cursor: full.length });
+                }
+                else {
+                    setPhase({ ...phase, cursor: Math.min(phase.value.length, phase.cursor + 1) });
+                }
                 return;
             }
+            if (key.tab) {
+                // tab → accept ghost text
+                const ghost = ghostText(phase.value, allNl);
+                if (ghost) {
+                    const full = phase.value + ghost;
+                    setPhase({ ...phase, value: full, cursor: full.length });
+                    return;
+                }
+            }
             if (key.return) {
                 const nl = phase.value.trim();
                 if (!nl)
                     return;
-                setSessionNl((h) => [...h, nl]);
-                if (phase.raw) {
-                    await runPhase(nl, nl, true);
-                    return;
-                }
-                setPhase({ type: "thinking", nl, raw: false, partial: "" });
-                try {
-                    const command = await translateToCommand(nl, config.permissions, sessionCmds, (partial) => {
-                        setPhase({ type: "thinking", nl, raw: false, partial });
-                    });
-                    const blocked = checkPermissions(command, config.permissions);
-                    if (blocked) {
-                        pushScroll({ nl, cmd: command, lines: [`blocked: ${blocked}`], truncated: false, error: true });
-                        inputPhase();
-                        return;
-                    }
-                    const danger = isIrreversible(command);
-                    // skip confirm unless user opted in OR command is dangerous
-                    if (!config.confirm && !danger) {
-                        await runPhase(nl, command, false);
-                        return;
-                    }
-                    setPhase({ type: "confirm", nl, command, raw: false, danger });
-                }
-                catch (e) {
-                    setPhase({ type: "error", message: e.message });
-                }
+                await translateAndRun(nl, phase.raw);
                 return;
             }
             if (key.backspace || key.delete) {
@@ -169,21 +270,17 @@ export default function App() {
             }
             return;
         }
-        // ── confirm ───────────────────────────────────────────────────────
+        // ── confirm ──────────────────────────────────────────────────────────────
         if (phase.type === "confirm") {
-            if (key.ctrl && input === "c") {
-                exit();
-                return;
-            }
             if (input === "?") {
                 const { nl, command } = phase;
-                setPhase({ type: "thinking", nl, raw: false, partial: "" });
+                setPhase({ type: "thinking", nl, partial: "" });
                 try {
                     const explanation = await explainCommand(command);
                     setPhase({ type: "explain", nl, command, explanation });
                 }
                 catch {
-                    setPhase({ type: "confirm", nl, command, raw: false, danger: phase.danger });
+                    setPhase({ type: "confirm", nl, command, danger: phase.danger });
                 }
                 return;
             }
@@ -201,32 +298,24 @@ export default function App() {
             }
             return;
         }
-        // ── explain → back to confirm ─────────────────────────────────────
+        // ── explain ──────────────────────────────────────────────────────────────
         if (phase.type === "explain") {
-            if (key.ctrl && input === "c") {
-                exit();
-                return;
-            }
-            setPhase({ type: "confirm", nl: phase.nl, command: phase.command, raw: false, danger: isIrreversible(phase.command) });
+            setPhase({ type: "confirm", nl: phase.nl, command: phase.command, danger: isIrreversible(phase.command) });
             return;
         }
-        // ── autofix ───────────────────────────────────────────────────────
+        // ── autofix ──────────────────────────────────────────────────────────────
         if (phase.type === "autofix") {
-            if (key.ctrl && input === "c") {
-                exit();
-                return;
-            }
             if (input === "y" || input === "Y" || key.return) {
                 const { nl, command, errorOutput } = phase;
-                setPhase({ type: "thinking", nl, raw: false, partial: "" });
+                setPhase({ type: "thinking", nl, partial: "" });
                 try {
-                    const fixed = await fixCommand(nl, command, errorOutput, config.permissions, sessionCmds);
+                    const fixed = await fixCommand(nl, command, errorOutput, config.permissions, tab.sessionCmds);
                     const danger = isIrreversible(fixed);
                     if (!config.confirm && !danger) {
                         await runPhase(nl, fixed, false);
                         return;
                     }
-                    setPhase({ type: "confirm", nl, command: fixed, raw: false, danger });
+                    setPhase({ type: "confirm", nl, command: fixed, danger });
                 }
                 catch (e) {
                     setPhase({ type: "error", message: e.message });
@@ -236,23 +325,46 @@ export default function App() {
             inputPhase();
             return;
         }
-        // ── error ─────────────────────────────────────────────────────────
+        // ── error ────────────────────────────────────────────────────────────────
         if (phase.type === "error") {
-            if (key.ctrl && input === "c") {
-                exit();
-                return;
-            }
             inputPhase();
             return;
         }
-    }, [phase, allNl, config, sessionCmds, exit]));
-    // ── expand toggle ──────────────────────────────────────────────────────────
-    const toggleExpand = (i) => setScroll((s) => s.map((e, idx) => idx === i ? { ...e, expanded: !e.expanded } : e));
-    // ── onboarding ─────────────────────────────────────────────────────────────
+    }, [tabs, activeTab, allNl, config, exit]));
+    // ── onboarding ───────────────────────────────────────────────────────────────
     if (!config.onboarded) {
-        return _jsx(Onboarding, { onDone: finishOnboarding });
+        return _jsx(Onboarding, { onDone: (perms) => {
+                const next = { onboarded: true, confirm: false, permissions: perms };
+                setConfig(next);
+                saveConfig(next);
+            } });
     }
+    const phase = tab.phase;
     const isRaw = phase.type === "input" && phase.raw;
-    // ── render ─────────────────────────────────────────────────────────────────
-    return (_jsxs(Box, { flexDirection: "column", children: [scroll.map((entry, i) => (_jsxs(Box, { flexDirection: "column", marginBottom: 1, paddingLeft: 2, children: [_jsxs(Box, { gap: 2, children: [_jsx(Text, { dimColor: true, children: "\u203A" }), _jsx(Text, { dimColor: true, children: entry.nl })] }), entry.nl !== entry.cmd && (_jsxs(Box, { gap: 2, paddingLeft: 2, children: [_jsx(Text, { dimColor: true, children: "$" }), _jsx(Text, { dimColor: true, children: entry.cmd })] })), entry.lines.length > 0 && (_jsxs(Box, { flexDirection: "column", paddingLeft: 4, children: [entry.lines.map((line, j) => (_jsx(Text, { color: entry.error ? "red" : undefined, children: line }, j))), entry.truncated && !entry.expanded && (_jsx(Text, { dimColor: true, children: "\u2026 (space to expand)" }))] }))] }, i))), phase.type === "confirm" && (_jsxs(Box, { flexDirection: "column", marginBottom: 1, paddingLeft: 2, children: [_jsxs(Box, { gap: 2, children: [_jsx(Text, { dimColor: true, children: "\u203A" }), _jsx(Text, { dimColor: true, children: phase.nl })] }), _jsxs(Box, { gap: 2, paddingLeft: 2, children: [_jsx(Text, { dimColor: true, children: "$" }), _jsx(Text, { children: phase.command }), phase.danger && _jsx(Text, { color: "red", children: " \u26A0 irreversible" })] }), _jsx(Box, { paddingLeft: 4, children: _jsx(Text, { dimColor: true, children: "enter  n  e  ?" }) })] })), phase.type === "explain" && (_jsxs(Box, { flexDirection: "column", marginBottom: 1, paddingLeft: 2, children: [_jsxs(Box, { gap: 2, paddingLeft: 2, children: [_jsx(Text, { dimColor: true, children: "$" }), _jsx(Text, { children: phase.command })] }), _jsx(Box, { paddingLeft: 4, children: _jsx(Text, { dimColor: true, children: phase.explanation }) }), _jsx(Box, { paddingLeft: 4, children: _jsx(Text, { dimColor: true, children: "any key to continue" }) })] })), phase.type === "autofix" && (_jsx(Box, { flexDirection: "column", marginBottom: 1, paddingLeft: 2, children: _jsx(Text, { dimColor: true, children: "  command failed \u2014 retry with fix?  [enter / n]" }) })), phase.type === "thinking" && (phase.partial ? (_jsxs(Box, { flexDirection: "column", paddingLeft: 2, children: [_jsxs(Box, { gap: 2, children: [_jsx(Text, { dimColor: true, children: "\u203A" }), _jsx(Text, { dimColor: true, children: phase.nl })] }), _jsxs(Box, { gap: 2, paddingLeft: 2, children: [_jsx(Text, { dimColor: true, children: "$" }), _jsx(Text, { dimColor: true, children: phase.partial })] })] })) : (_jsx(Spinner, { label: "translating" }))), phase.type === "running" && (_jsxs(Box, { flexDirection: "column", paddingLeft: 2, children: [_jsxs(Box, { gap: 2, children: [_jsx(Text, { dimColor: true, children: "$" }), _jsx(Text, { dimColor: true, children: phase.command })] }), streamLines.length > 0 && (_jsx(Box, { flexDirection: "column", paddingLeft: 2, children: streamLines.slice(-MAX_LINES).map((line, i) => (_jsx(Text, { children: line }, i))) })), _jsx(Spinner, { label: "ctrl+c to cancel" })] })), phase.type === "error" && (_jsx(Box, { paddingLeft: 2, children: _jsx(Text, { color: "red", children: phase.message }) })), phase.type === "input" && (_jsxs(Box, { gap: 2, paddingLeft: 2, children: [_jsx(Text, { dimColor: true, children: isRaw ? "$" : "›" }), _jsxs(Box, { children: [_jsx(Text, { children: phase.value.slice(0, phase.cursor) }), _jsx(Text, { inverse: true, children: phase.value[phase.cursor] ?? " " }), _jsx(Text, { children: phase.value.slice(phase.cursor + 1) })] })] })), _jsx(StatusBar, { permissions: config.permissions })] }));
+    const ghost = phase.type === "input" ? ghostText(phase.value, allNl) : "";
+    // ── browse overlay ────────────────────────────────────────────────────────
+    if (phase.type === "browse") {
+        return (_jsxs(Box, { flexDirection: "column", children: [tabs.length > 1 && _jsx(TabBar, { tabs: tabs, active: activeTab }), _jsx(Browse, { cwd: phase.cwd, onCd: path => setPhase({ type: "browse", cwd: path }), onSelect: path => {
+                        // fill input with the path
+                        setPhase({ type: "input", value: path, cursor: path.length, histIdx: -1, raw: false });
+                    }, onExit: () => inputPhase() }), _jsx(StatusBar, { permissions: config.permissions })] }));
+    }
+    // ── fuzzy overlay ──────────────────────────────────────────────────────────
+    if (phase.type === "fuzzy") {
+        return (_jsxs(Box, { flexDirection: "column", children: [tabs.length > 1 && _jsx(TabBar, { tabs: tabs, active: activeTab }), _jsx(FuzzyPicker, { history: allNl, onSelect: nl => {
+                        setPhase({ type: "input", value: nl, cursor: nl.length, histIdx: -1, raw: false });
+                    }, onExit: () => inputPhase() }), _jsx(StatusBar, { permissions: config.permissions })] }));
+    }
+    // ── main render ───────────────────────────────────────────────────────────
+    return (_jsxs(Box, { flexDirection: "column", children: [tabs.length > 1 && _jsx(TabBar, { tabs: tabs, active: activeTab }), tab.scroll.map((entry, i) => (_jsxs(Box, { flexDirection: "column", marginBottom: 1, paddingLeft: 2, children: [_jsxs(Box, { gap: 2, children: [_jsx(Text, { dimColor: true, children: "\u203A" }), _jsx(Text, { dimColor: true, children: entry.nl })] }), entry.nl !== entry.cmd && (_jsxs(Box, { gap: 2, paddingLeft: 2, children: [_jsx(Text, { dimColor: true, children: "$" }), _jsx(Text, { dimColor: true, children: entry.cmd })] })), entry.lines.length > 0 && (_jsxs(Box, { flexDirection: "column", paddingLeft: 4, children: [(entry.expanded ? entry.lines : entry.lines).map((line, j) => (_jsx(Text, { color: entry.error ? "red" : undefined, children: line }, j))), entry.truncated && !entry.expanded && (_jsx(Text, { dimColor: true, children: "  \u2026 more lines" }))] }))] }, i))), phase.type === "confirm" && (_jsxs(Box, { flexDirection: "column", marginBottom: 1, paddingLeft: 2, children: [_jsxs(Box, { gap: 2, children: [_jsx(Text, { dimColor: true, children: "\u203A" }), _jsx(Text, { dimColor: true, children: phase.nl })] }), _jsxs(Box, { gap: 2, paddingLeft: 2, children: [_jsx(Text, { dimColor: true, children: "$" }), _jsx(Text, { children: phase.command }), phase.danger && _jsx(Text, { color: "red", children: "  \u26A0 irreversible" })] }), _jsx(Box, { paddingLeft: 4, children: _jsx(Text, { dimColor: true, children: "enter  n  e  ?" }) })] })), phase.type === "explain" && (_jsxs(Box, { flexDirection: "column", marginBottom: 1, paddingLeft: 2, children: [_jsxs(Box, { gap: 2, paddingLeft: 2, children: [_jsx(Text, { dimColor: true, children: "$" }), _jsx(Text, { children: phase.command })] }), _jsx(Box, { paddingLeft: 4, children: _jsx(Text, { dimColor: true, children: phase.explanation }) }), _jsx(Box, { paddingLeft: 4, children: _jsx(Text, { dimColor: true, children: "any key \u2192" }) })] })), phase.type === "autofix" && (_jsx(Box, { paddingLeft: 2, children: _jsx(Text, { dimColor: true, children: "failed \u2014 retry with fix?  [enter / n]" }) })), phase.type === "thinking" && (phase.partial ? (_jsxs(Box, { flexDirection: "column", paddingLeft: 2, children: [_jsxs(Box, { gap: 2, children: [_jsx(Text, { dimColor: true, children: "\u203A" }), _jsx(Text, { dimColor: true, children: phase.nl })] }), _jsxs(Box, { gap: 2, paddingLeft: 2, children: [_jsx(Text, { dimColor: true, children: "$" }), _jsx(Text, { dimColor: true, children: phase.partial })] })] })) : _jsx(Spinner, { label: "translating" })), phase.type === "running" && (_jsxs(Box, { flexDirection: "column", paddingLeft: 2, children: [_jsxs(Box, { gap: 2, children: [_jsx(Text, { dimColor: true, children: "$" }), _jsx(Text, { dimColor: true, children: phase.command })] }), _jsx(Box, { flexDirection: "column", paddingLeft: 2, children: tab.streamLines.slice(-MAX_LINES).map((l, i) => _jsx(Text, { children: l }, i)) }), _jsx(Spinner, { label: "ctrl+c to cancel" })] })), phase.type === "error" && (_jsx(Box, { paddingLeft: 2, children: _jsx(Text, { color: "red", children: phase.message }) })), phase.type === "input" && (_jsxs(Box, { gap: 2, paddingLeft: 2, children: [_jsx(Text, { dimColor: true, children: isRaw ? "$" : "›" }), _jsxs(Box, { children: [_jsx(Text, { children: phase.value.slice(0, phase.cursor) }), _jsx(Text, { inverse: true, children: phase.value[phase.cursor] ?? " " }), _jsx(Text, { children: phase.value.slice(phase.cursor + 1) }), ghost && phase.cursor === phase.value.length && (_jsx(Text, { dimColor: true, children: ghost }))] })] })), _jsx(StatusBar, { permissions: config.permissions, cwd: tab.cwd })] }));
+}
+// ── TabBar ────────────────────────────────────────────────────────────────────
+function TabBar({ tabs, active }) {
+    return (_jsxs(Box, { gap: 1, paddingLeft: 2, marginBottom: 1, children: [tabs.map((t, i) => {
+                const label = ` ${i + 1} `;
+                const cwd = t.cwd.split("/").pop() || t.cwd;
+                return (_jsx(Box, { children: i === active
+                        ? _jsxs(Text, { inverse: true, children: [label, cwd] })
+                        : _jsxs(Text, { dimColor: true, children: [label, cwd] }) }, t.id));
+            }), _jsx(Text, { dimColor: true, children: "  ctrl+t new  tab switch  ctrl+w close" })] }));
 }