@oxbit/cli 0.10.0 → 0.11.0

package/agent/dist/assets/{index-BrBnidfI.js → index-T_6HaJx-.js}

@@ -1,17 +1,120 @@
 #!/usr/bin/env node
-import { jsx, jsxs } from "react/jsx-runtime";
-import { renderToString, Box, Text, useAnimation, measureElement, useInput, useWindowSize, usePaste, Static, render } from "ink";
+import { jsxs, jsx } from "react/jsx-runtime";
+import { Box, Text, renderToString, useAnimation, measureElement, useInput, useWindowSize, usePaste, Static, render } from "ink";
 import { createContext, useContext, useMemo, useState, useRef, useEffect, useSyncExternalStore } from "react";
-import { M as MODES, w as walkFiles } from "../index.js";
-import { mkdirSync, appendFileSync, readFileSync, writeFileSync } from "node:fs";
-import { dirname } from "node:path";
+import { c as contextLegend, a as contextGrid, f as formatTokens, b as contextNotes, d as formatPercent, M as MODES } from "../index.js";
+import { memoryTuiConnection, fileHistory } from "./memory-Bdy8hvTl.js";
 import "node:util";
 import "node:readline";
 import "node:fs/promises";
+import "node:path";
 import "node:crypto";
 import "node:os";
 import "node:child_process";
 import "node:http";
+import "node:fs";
+const THEMES = {
+  dark: {
+    name: "dark",
+    accent: "#8ab4f8",
+    muted: "gray",
+    user: "#c8d3f5",
+    success: "#9ece6a",
+    error: "#f7768e",
+    warning: "#e0af68",
+    link: "#7dcfff",
+    code: "#e0af68",
+    keyword: "#bb9af7",
+    string: "#9ece6a",
+    number: "#ff9e64",
+    added: "#9ece6a",
+    removed: "#f7768e",
+    addedBg: "#1d3325",
+    removedBg: "#3b1f27",
+    border: "gray",
+    modes: { ask: "gray", "accept-edits": "#bb9af7", "full-auto": "#e0af68" }
+  },
+  light: {
+    name: "light",
+    accent: "#1d4ed8",
+    muted: "gray",
+    user: "#1e293b",
+    success: "#15803d",
+    error: "#b91c1c",
+    warning: "#b45309",
+    link: "#0369a1",
+    code: "#9a3412",
+    keyword: "#7c3aed",
+    string: "#15803d",
+    number: "#c2410c",
+    added: "#166534",
+    removed: "#991b1b",
+    addedBg: "#dcfce7",
+    removedBg: "#fee2e2",
+    border: "gray",
+    modes: { ask: "gray", "accept-edits": "#7c3aed", "full-auto": "#b45309" }
+  }
+};
+function resolveTheme(choice = "auto", env = process.env) {
+  if (choice !== "auto") return THEMES[choice];
+  const background = Number(env.COLORFGBG?.split(";").at(-1));
+  return THEMES[Number.isInteger(background) && (background === 7 || background >= 9) ? "light" : "dark"];
+}
+const ThemeContext = createContext(THEMES.dark);
+const useTheme = () => useContext(ThemeContext);
+const COLUMNS = 20;
+const GRID_WIDTH = COLUMNS * 2 - 1;
+const glyph = (id) => id === "free" ? "□" : id === "buffer" ? "⊠" : "■";
+const colors = (theme) => ({
+  system: theme.accent,
+  instructions: theme.keyword,
+  skills: theme.link,
+  context: theme.user,
+  tools: theme.number,
+  mcp: theme.removed,
+  messages: theme.success,
+  free: theme.muted,
+  buffer: theme.warning
+});
+function ContextView({ usage, width: width2 }) {
+  const theme = useTheme();
+  const known = colors(theme);
+  const spare = [theme.code, theme.error, theme.string, theme.added];
+  const legend = contextLegend(usage).map((row, index) => ({ ...row, color: known[row.id] ?? spare[index % spare.length] }));
+  const color = new Map(legend.map((row) => [row.id, row.color]));
+  const grid = contextGrid(usage, COLUMNS * 10);
+  const rows = Array.from({ length: grid.length / COLUMNS }, (_, row) => grid.slice(row * COLUMNS, (row + 1) * COLUMNS));
+  const label = Math.max(...legend.map((row) => row.label.length));
+  const counts = legend.map((row) => formatTokens(row.tokens));
+  const digits = Math.max(...counts.map((count) => count.length));
+  const side = rows.length > 0 && width2 >= GRID_WIDTH + 3 + label + digits + 12;
+  const { header, footer } = contextNotes(usage);
+  return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", marginTop: 1, width: width2, children: [
+    /* @__PURE__ */ jsxs(Text, { children: [
+      /* @__PURE__ */ jsx(Text, { color: theme.accent, children: "●" }),
+      " ",
+      /* @__PURE__ */ jsx(Text, { bold: true, children: header })
+    ] }),
+    /* @__PURE__ */ jsxs(Box, { flexDirection: side ? "row" : "column", marginTop: 1, paddingLeft: 2, children: [
+      rows.length ? /* @__PURE__ */ jsx(Box, { flexDirection: "column", width: GRID_WIDTH, flexShrink: 0, marginRight: side ? 3 : 0, marginBottom: side ? 0 : 1, children: rows.map((cells2, index) => /* @__PURE__ */ jsx(Text, { children: cells2.map((id, at) => /* @__PURE__ */ jsxs(Text, { color: color.get(id), children: [
+        at ? " " : "",
+        glyph(id)
+      ] }, at)) }, index)) }) : null,
+      /* @__PURE__ */ jsx(Box, { flexDirection: "column", children: legend.map((row, index) => /* @__PURE__ */ jsxs(Text, { wrap: "truncate-end", children: [
+        /* @__PURE__ */ jsx(Text, { color: row.color, children: glyph(row.id) }),
+        " ",
+        row.label.padEnd(label),
+        "  ",
+        counts[index].padStart(digits),
+        usage.window ? /* @__PURE__ */ jsxs(Text, { color: theme.muted, children: [
+          "  ",
+          formatPercent(row.tokens, usage.window).padStart(6)
+        ] }) : null
+      ] }, index)) })
+    ] }),
+    /* @__PURE__ */ jsx(Box, { flexDirection: "column", marginTop: 1, paddingLeft: 2, children: footer.map((line, index) => /* @__PURE__ */ jsx(Text, { color: theme.muted, wrap: "wrap", children: line }, index)) })
+  ] });
+}
 const FENCE = /^ {0,3}(`{3,}|~{3,})\s*([^\s`]*)/;
 const HEADING = /^ {0,3}(#{1,6})(?:\s+(.*?))?\s*#*\s*$/;
 const RULE = /^ {0,3}([-*_])(?:\s*\1){2,}\s*$/;
@@ -271,55 +374,6 @@ function highlight(line, lang) {
   if (last < line.length) tokens.push({ text: line.slice(last) });
   return tokens;
 }
-const THEMES = {
-  dark: {
-    name: "dark",
-    accent: "#8ab4f8",
-    muted: "gray",
-    user: "#c8d3f5",
-    success: "#9ece6a",
-    error: "#f7768e",
-    warning: "#e0af68",
-    link: "#7dcfff",
-    code: "#e0af68",
-    keyword: "#bb9af7",
-    string: "#9ece6a",
-    number: "#ff9e64",
-    added: "#9ece6a",
-    removed: "#f7768e",
-    addedBg: "#1d3325",
-    removedBg: "#3b1f27",
-    border: "gray",
-    modes: { ask: "gray", "accept-edits": "#bb9af7", "full-auto": "#e0af68" }
-  },
-  light: {
-    name: "light",
-    accent: "#1d4ed8",
-    muted: "gray",
-    user: "#1e293b",
-    success: "#15803d",
-    error: "#b91c1c",
-    warning: "#b45309",
-    link: "#0369a1",
-    code: "#9a3412",
-    keyword: "#7c3aed",
-    string: "#15803d",
-    number: "#c2410c",
-    added: "#166534",
-    removed: "#991b1b",
-    addedBg: "#dcfce7",
-    removedBg: "#fee2e2",
-    border: "gray",
-    modes: { ask: "gray", "accept-edits": "#7c3aed", "full-auto": "#b45309" }
-  }
-};
-function resolveTheme(choice = "auto", env = process.env) {
-  if (choice !== "auto") return THEMES[choice];
-  const background = Number(env.COLORFGBG?.split(";").at(-1));
-  return THEMES[Number.isInteger(background) && (background === 7 || background >= 9) ? "light" : "dark"];
-}
-const ThemeContext = createContext(THEMES.dark);
-const useTheme = () => useContext(ThemeContext);
 const segmenter = new Intl.Segmenter();
 const ANSI = /\x1b\[[0-9;:?]*[ -/]*[@-~]|\x1b\][^\x07\x1b]*(?:\x07|\x1b\\)/g;
 const ZERO = /^[\p{Mn}\p{Me}\p{Cf}\p{Cc}]+$/u;
@@ -789,6 +843,8 @@ function ItemView({ item, live = false, context }) {
         /* @__PURE__ */ jsx(Box, { width: 2, flexShrink: 0, children: /* @__PURE__ */ jsx(Text, { color: theme.error, children: "✗" }) }),
         /* @__PURE__ */ jsx(Text, { color: theme.error, wrap: "wrap", children: item.text })
       ] }) : /* @__PURE__ */ jsx(Box, { width: width2, children: /* @__PURE__ */ jsx(Gutter, { children: /* @__PURE__ */ jsx(Text, { color: item.tone === "warn" ? theme.warning : theme.muted, wrap: "wrap", children: item.text }) }) });
+    case "context":
+      return /* @__PURE__ */ jsx(ContextView, { usage: item.usage, width: width2 });
     case "divider": {
       const label = ` ${item.text} `;
       return /* @__PURE__ */ jsx(Box, { marginTop: 1, children: /* @__PURE__ */ jsxs(Text, { color: theme.muted, wrap: "truncate-end", children: [
@@ -801,7 +857,7 @@ function ItemView({ item, live = false, context }) {
 }
 const emptyTranscript = () => ({ flushed: [{ id: 0, type: "banner" }], live: [], next: 1 });
 const STREAMING = /* @__PURE__ */ new Set(["assistant", "thought", "plan"]);
-const FINAL = /* @__PURE__ */ new Set(["banner", "user", "notice", "divider"]);
+const FINAL = /* @__PURE__ */ new Set(["banner", "user", "notice", "divider", "context"]);
 const isDone = (item) => FINAL.has(item.type) || !!item.done;
 const textOf = (content) => {
   const block = content;
@@ -863,7 +919,7 @@ function tool(state, update) {
 function applyUpdate(state, update) {
   switch (update.sessionUpdate) {
     case "agent_message_chunk":
-      return stream(state, "assistant", textOf(update.content));
+      return update._meta?.oxbit?.context ? append(state, { type: "context", usage: update._meta.oxbit.context }) : stream(state, "assistant", textOf(update.content));
     case "agent_thought_chunk":
       return stream(state, "thought", textOf(update.content));
     case "user_message_chunk": {
@@ -1217,19 +1273,33 @@ class SessionController {
     if (this.state.running) return this.notice("Wait for the agent to finish, or press Esc to stop it", "warn");
     this.rules.clear();
     if (label) this.transcript((transcript) => append(transcript, { type: "divider", text: label }));
+    await this.load(sessionId, true);
+  }
+  /** Loads the open session again after the agent was rebuilt; its replayed history stays out of the transcript. */
+  async reload() {
+    if (this.state.running) return this.notice("Wait for the agent to finish, or press Esc to stop it", "warn");
+    await this.load(this.state.status.sessionId, false);
+  }
+  async load(sessionId, replay) {
     this.early = [];
     let session;
     try {
       session = sessionId ? await this.connection.loadSession(sessionId, this.cwd) : await this.connection.newSession(this.cwd);
     } catch (error) {
-      this.notice(message(error), "error");
+      if (!replay && /Unknown ACP session/.test(message(error))) session = await this.connection.newSession(this.cwd).catch(() => void 0);
+      if (!session) this.notice(message(error), "error");
     }
     const early = this.early;
     this.early = void 0;
     if (!session) return;
-    this.set({ status: fromSession(session), info: this.connection.info() });
-    for (const [id, update] of early) this.onUpdate(id, update);
-    this.transcript(endTurn);
+    const { title, usage, goal, loop, commands } = this.state.status;
+    const kept = replay || session.sessionId !== sessionId ? {} : { title, usage, goal, loop, commands };
+    this.set({ status: { ...fromSession(session), ...kept }, info: this.connection.info() });
+    for (const [id, update] of early) {
+      if (replay) this.onUpdate(id, update);
+      else if (id === session.sessionId) this.set({ status: applyStatus(this.state.status, update) });
+    }
+    if (replay) this.transcript(endTurn);
   }
   async send(text) {
     const sessionId = this.state.status.sessionId;
@@ -1268,8 +1338,10 @@ class SessionController {
     this.set({ permission: this.permissions[0] });
   }
   cycleMode() {
-    const ids = MODES.map((mode2) => mode2.id);
-    const mode = ids[(ids.indexOf(this.state.status.mode) + 1) % ids.length];
+    const ids = MODES.map((mode) => mode.id);
+    this.setMode(ids[(ids.indexOf(this.state.status.mode) + 1) % ids.length]);
+  }
+  setMode(mode) {
     const sessionId = this.state.status.sessionId;
     this.set({ status: { ...this.state.status, mode } });
     if (sessionId) this.connection.setMode(sessionId, mode).catch((error) => this.notice(message(error), "error"));
@@ -1332,10 +1404,187 @@ class SessionController {
     return item?.tool;
   }
 }
+const PANELS = ["config", "skills", "hooks", "mcp", "instructions", "providers"];
+const isPanel = (name) => PANELS.includes(name);
+function panelRows(panel) {
+  const rows = panel?.rows ?? [];
+  return [...new Set(rows.map((row) => row.section))].flatMap((section) => rows.filter((row) => row.section === section));
+}
+class PanelController extends SessionController {
+  panelAbort;
+  panelOverlay() {
+    const overlay = this.state.overlay;
+    return overlay?.kind === "panel" ? overlay : void 0;
+  }
+  patchPanel(patch) {
+    const overlay = this.panelOverlay();
+    if (overlay) this.set({ overlay: { ...overlay, ...patch } });
+  }
+  selectedRow() {
+    const overlay = this.panelOverlay();
+    return overlay && panelRows(overlay.panel)[overlay.index];
+  }
+  openPanel(id) {
+    this.closeOverlay();
+    this.set({ overlay: { kind: "panel", id, index: 0, loading: true } });
+    void this.loadPanel();
+  }
+  /** Closes any overlay and cancels the panel request in flight. */
+  closeOverlay() {
+    this.panelAbort?.abort();
+    this.panelAbort = void 0;
+    if (this.state.overlay) this.set({ overlay: void 0 });
+  }
+  /** Runs one SettingsManager call; undefined when it failed, was cancelled or another call replaced it. */
+  async call(run2) {
+    const overlay = this.panelOverlay();
+    const settings = this.connection.settings;
+    if (!overlay || !settings) return void 0;
+    this.panelAbort?.abort();
+    const abort = this.panelAbort = new AbortController();
+    const current = () => this.panelAbort === abort;
+    const context = {
+      cwd: this.cwd,
+      sessionId: this.state.status.sessionId,
+      signal: abort.signal,
+      progress: (text) => current() && this.patchPanel({ progress: text })
+    };
+    try {
+      const result = await run2(settings, overlay.id, context);
+      return current() ? result : void 0;
+    } catch (error) {
+      if (current()) this.patchPanel({ error: message(error), loading: false, busy: false, progress: void 0 });
+      return void 0;
+    } finally {
+      if (current()) this.panelAbort = void 0;
+    }
+  }
+  async loadPanel() {
+    const panel = await this.call((settings, id, context) => settings.panel(id, context));
+    const overlay = this.panelOverlay();
+    if (!panel || !overlay) return;
+    const rows = panelRows(panel);
+    const selected2 = rows.findIndex((row) => row.id === panelRows(overlay.panel)[overlay.index]?.id);
+    const index = selected2 >= 0 ? selected2 : Math.min(overlay.index, Math.max(0, rows.length - 1));
+    this.patchPanel({ panel, index, loading: false, busy: false, progress: void 0 });
+  }
+  async change(run2) {
+    const overlay = this.panelOverlay();
+    if (!overlay?.panel || overlay.busy) return;
+    this.patchPanel({ busy: true, progress: void 0, error: void 0, menu: void 0, input: void 0 });
+    const change = await this.call(run2);
+    if (!change) return;
+    if (change.reloaded) await this.reload();
+    if (change.mode) this.setMode(change.mode);
+    if (change.draft !== void 0) {
+      this.closeOverlay();
+      this.set({ draft: draftOf(change.draft), completion: void 0 });
+    } else await this.loadPanel();
+    if (change.message) this.flash(change.message);
+  }
+  movePanel(step) {
+    const overlay = this.panelOverlay();
+    const row = this.selectedRow();
+    if (!overlay || overlay.busy) return;
+    if (overlay.menu !== void 0 && row?.actions) {
+      const count2 = row.actions.length;
+      return this.patchPanel({ menu: (overlay.menu + step + count2) % count2 });
+    }
+    const count = panelRows(overlay.panel).length;
+    if (count) this.patchPanel({ index: (overlay.index + step + count) % count });
+  }
+  togglePanelRow() {
+    const row = this.selectedRow();
+    if (row?.enabled !== void 0) void this.change((settings, id, context) => settings.toggle(id, row.id, !row.enabled, context));
+  }
+  cyclePanelChoice(step) {
+    const row = this.selectedRow();
+    const options = row?.choice?.options ?? [];
+    if (!row?.choice || !options.length) return;
+    const at = options.findIndex((option2) => option2.value === row.choice.value);
+    const value = options[(at + step + options.length) % options.length].value;
+    void this.change((settings, id, context) => settings.choose(id, row.id, value, context));
+  }
+  /** Enter: runs the row's only action, lists several, or runs the one picked from that list. */
+  enterPanel() {
+    const overlay = this.panelOverlay();
+    const row = this.selectedRow();
+    if (!overlay || !row || overlay.busy) return;
+    const actions = row.actions ?? [];
+    if (overlay.menu !== void 0) return this.startAction(row, actions[overlay.menu]);
+    if (actions.length === 1) return this.startAction(row, actions[0]);
+    if (actions.length) return this.patchPanel({ menu: 0 });
+    if (row.enabled !== void 0) return this.togglePanelRow();
+    this.cyclePanelChoice(1);
+  }
+  startAction(row, action) {
+    if (!action) return;
+    if (action.reloads && this.state.running) {
+      this.patchPanel({ menu: void 0 });
+      return this.flash("Wait for the turn to finish");
+    }
+    const first = action.inputs?.[0];
+    if (first) return this.patchPanel({ menu: void 0, input: { rowId: row.id, action, values: [], draft: draftOf(first.value ?? "") } });
+    void this.change((settings, id, context) => settings.act(id, row.id, action.id, [], context));
+  }
+  editPanelInput(draft) {
+    const input = this.panelOverlay()?.input;
+    if (input) this.patchPanel({ input: { ...input, draft } });
+  }
+  pastePanelInput(text) {
+    const input = this.panelOverlay()?.input;
+    if (input) this.editPanelInput(insert(input.draft, text.replace(/\n+$/, "").replace(/\n/g, " ")));
+  }
+  /** Enter in the input field: asks the next input, or runs the action with every answer. */
+  submitPanelInput() {
+    const input = this.panelOverlay()?.input;
+    if (!input) return;
+    const values = [...input.values, input.draft.text];
+    const next = input.action.inputs?.[values.length];
+    if (next) return this.patchPanel({ input: { ...input, values, draft: draftOf(next.value ?? "") } });
+    if (input.action.reloads && this.state.running) {
+      this.patchPanel({ input: void 0 });
+      return this.flash("Wait for the turn to finish");
+    }
+    void this.change((settings, id, context) => settings.act(id, input.rowId, input.action.id, values, context));
+  }
+  /** Typed `/providers use <id>`: the agent command cannot rebuild the agent mid-turn, so the panel action switches it here. */
+  async useProvider(id) {
+    const settings = this.connection.settings;
+    if (!settings) return;
+    if (this.state.running) return this.flash("Wait for the turn to finish");
+    const context = { cwd: this.cwd, sessionId: this.state.status.sessionId, signal: new AbortController().signal, progress: () => {
+    } };
+    try {
+      const change = await settings.act("providers", id, "use", [], context);
+      if (change.reloaded) await this.reload();
+      if (change.message) this.flash(change.message);
+    } catch (error) {
+      this.notice(message(error), "error");
+    }
+  }
+  /** Esc: cancels the running call, then leaves the input or action list, then closes the panel. */
+  escapePanel() {
+    const overlay = this.panelOverlay();
+    if (overlay?.busy) {
+      this.panelAbort?.abort();
+      this.panelAbort = void 0;
+      return this.patchPanel({ busy: false, progress: void 0 });
+    }
+    if (overlay?.input || overlay?.menu !== void 0) return this.patchPanel({ input: void 0, menu: void 0 });
+    this.closeOverlay();
+  }
+}
 const LOCAL_COMMANDS = [
   { name: "model", description: "Choose the model and reasoning effort", hint: "[model]" },
   { name: "new", description: "Start a new session" },
   { name: "resume", description: "Resume a saved session" },
+  { name: "config", description: "Settings: permission mode, auto-compact, hooks and MCP trust" },
+  { name: "skills", description: "Turn skills on or off, or start a prompt with one" },
+  { name: "hooks", description: "Turn hook sources on or off" },
+  { name: "mcp", description: "Add, remove, trust and sign in to MCP servers" },
+  { name: "instructions", description: "Choose which AGENTS.md and CLAUDE.md files load" },
+  { name: "providers", description: "Sign in to providers and set API keys" },
   { name: "help", description: "Show keys and commands" },
   { name: "exit", description: "Quit" }
 ];
@@ -1348,7 +1597,7 @@ function overlayItems(state) {
     return rank(overlay.sessions, (session) => session.title ?? session.sessionId, overlay.filter, 200).map((session) => ({ value: session.sessionId, label: session.title || session.sessionId, detail: session.updatedAt?.slice(0, 16).replace("T", " ") }));
   return [];
 }
-class Controller extends SessionController {
+class Controller extends PanelController {
   constructor(connection, options) {
     super(connection, options.cwd);
     this.options = options;
@@ -1362,9 +1611,14 @@ class Controller extends SessionController {
   fileTimer;
   files = /* @__PURE__ */ new Map();
   lastInterrupt = 0;
+  /** Server commands, then local ones; a panel command shows the server command's hint, since arguments go to the server. */
   commands() {
-    const local = LOCAL_COMMANDS.filter((command) => command.name !== "resume" || this.connection.listSessions);
-    return [...this.state.status.commands.filter((command) => !local.some((item) => item.name === command.name)), ...local];
+    const server = this.state.status.commands;
+    const local = LOCAL_COMMANDS.filter((command) => command.name === "resume" ? this.connection.listSessions : !isPanel(command.name) || this.connection.settings).map((command) => {
+      const hint = isPanel(command.name) ? server.find((item) => item.name === command.name)?.hint : void 0;
+      return hint ? { ...command, hint: hint.startsWith("[") ? hint : `[${hint}]` } : command;
+    });
+    return [...server.filter((command) => !local.some((item) => item.name === command.name)), ...local];
   }
   submit() {
     const text = this.state.draft.text.replace(/\s+$/, "");
@@ -1396,6 +1650,21 @@ class Controller extends SessionController {
         if (args) void this.open(args, "Resumed session");
         else void this.openSessions();
         return true;
+      case "config":
+      case "skills":
+      case "hooks":
+      case "mcp":
+      case "instructions":
+      case "providers": {
+        const use = name === "providers" && this.connection.settings ? /^use\s+(\S+)$/i.exec(args) : null;
+        if (use) {
+          void this.useProvider(use[1]);
+          return true;
+        }
+        if (!this.connection.settings || args) return false;
+        this.openPanel(name);
+        return true;
+      }
       case "help":
         this.set({ overlay: { kind: "help" } });
         return true;
@@ -1417,6 +1686,7 @@ class Controller extends SessionController {
     const clean = text.replace(/\r\n?/g, "\n");
     const overlay = this.state.overlay;
     if (picker(overlay)) return this.filter(picker(overlay).filter + clean.replace(/\n/g, " "));
+    if (overlay?.kind === "panel") return this.pastePanelInput(clean);
     if (overlay) return;
     this.setDraft(insert(this.state.draft, clean));
   }
@@ -1459,7 +1729,7 @@ class Controller extends SessionController {
     if (!completion) return;
     const item = completion.items[completion.index];
     const command = completion.kind === "command" ? this.commands().find((entry) => `/${entry.name}` === item.value) : void 0;
-    if (run2 && command && !command.hint) {
+    if (run2 && command && (!command.hint || isPanel(command.name) && this.connection.settings)) {
       this.set({ draft: draftOf(item.value) });
       return this.submit();
     }
@@ -1472,7 +1742,9 @@ class Controller extends SessionController {
     const index = this.historyIndex < 0 ? this.history.length - 1 : this.historyIndex + step;
     if (index < 0) return true;
     this.historyIndex = index >= this.history.length ? -1 : index;
-    this.setDraft(this.historyIndex < 0 ? this.stash : draftOf(this.history[index]));
+    const draft = this.historyIndex < 0 ? this.stash : draftOf(this.history[index]);
+    this.dismissed = draft.text;
+    this.setDraft(draft);
     return true;
   }
   filter(text) {
@@ -1506,7 +1778,7 @@ class Controller extends SessionController {
     if (now - this.lastInterrupt < 2e3) return this.exit();
     this.lastInterrupt = now;
     if (this.state.running || this.state.permission) this.cancel();
-    else if (this.state.overlay) this.set({ overlay: void 0 });
+    else if (this.state.overlay) this.closeOverlay();
     else if (this.state.draft.text) this.setDraft(emptyDraft);
     this.flash("Press Ctrl+C again to exit");
   }
@@ -1611,7 +1883,7 @@ function OverlayView({ state, width: width2 }) {
       ] })
     ] });
   }
-  if (overlay.kind === "details") return null;
+  if (overlay.kind === "details" || overlay.kind === "panel") return null;
   const items = overlayItems(state);
   const reasoning = overlay.kind === "models" ? state.status.reasoning : void 0;
   return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", borderStyle: "round", borderColor: theme.accent, paddingX: 1, width: width2, marginTop: 1, children: [
@@ -1636,6 +1908,20 @@ function OverlayView({ state, width: width2 }) {
     ] })
   ] });
 }
+function lineEdit(draft, input, key) {
+  if (key.leftArrow) return key.meta || key.ctrl ? wordLeft(draft) : left(draft);
+  if (key.rightArrow) return key.meta || key.ctrl ? wordRight(draft) : right(draft);
+  if (key.home || key.ctrl && input === "a") return home(draft);
+  if (key.end || key.ctrl && input === "e") return end(draft);
+  if (key.backspace) return key.meta || key.ctrl ? deleteWordLeft(draft) : backspace(draft);
+  if (key.delete) return deleteForward(draft);
+  if (key.ctrl && input === "w") return deleteWordLeft(draft);
+  if (key.ctrl && input === "u") return killLineLeft(draft);
+  if (key.ctrl && input === "k") return killLineRight(draft);
+  if (key.meta && input === "b") return wordLeft(draft);
+  if (key.meta && input === "f") return wordRight(draft);
+  if (input && !key.ctrl && !key.meta && !key.tab) return insert(draft, input.replace(/\r\n?/g, "\n"));
+}
 function permissionKey(controller, input, key) {
   const pending = controller.getState().permission;
   const choose = (index) => controller.decide(DECISIONS[index]);
@@ -1648,8 +1934,23 @@ function permissionKey(controller, input, key) {
   const shortcut = { 1: 0, 2: 1, 3: 2, y: 0, a: 1, n: 2 }[input.toLowerCase()];
   if (shortcut !== void 0) choose(shortcut);
 }
+function panelKey(controller, input, key, overlay) {
+  if (overlay.input) {
+    if (key.escape) return controller.escapePanel();
+    if (key.return) return controller.submitPanelInput();
+    const next = lineEdit(overlay.input.draft, input.replace(/[\r\n]/g, ""), key);
+    return next && controller.editPanelInput(next);
+  }
+  if (key.escape) return controller.escapePanel();
+  if (key.upArrow || key.downArrow) return controller.movePanel(key.upArrow ? -1 : 1);
+  if (key.return) return controller.enterPanel();
+  if (overlay.menu !== void 0) return;
+  if (input === " ") return controller.togglePanelRow();
+  if (key.leftArrow || key.rightArrow) controller.cyclePanelChoice(key.leftArrow ? -1 : 1);
+}
 function overlayKey(controller, input, key) {
   const overlay = controller.getState().overlay;
+  if (overlay.kind === "panel") return panelKey(controller, input, key, overlay);
   if (overlay.kind === "details") {
     if (key.escape || key.return || input === "q" || key.ctrl && input === "o") controller.set({ overlay: void 0 });
     else if (key.leftArrow || key.rightArrow) controller.showDetails(key.leftArrow ? -1 : 1);
@@ -1699,18 +2000,130 @@ function handleKey(controller, input, key) {
     if (moved) return edit(moved);
     return void controller.recall(step);
   }
-  if (key.leftArrow) return edit(key.meta || key.ctrl ? wordLeft(draft) : left(draft));
-  if (key.rightArrow) return edit(key.meta || key.ctrl ? wordRight(draft) : right(draft));
-  if (key.home || key.ctrl && input === "a") return edit(home(draft));
-  if (key.end || key.ctrl && input === "e") return edit(end(draft));
-  if (key.backspace) return edit(key.meta || key.ctrl ? deleteWordLeft(draft) : backspace(draft));
-  if (key.delete) return edit(deleteForward(draft));
-  if (key.ctrl && input === "w") return edit(deleteWordLeft(draft));
-  if (key.ctrl && input === "u") return edit(killLineLeft(draft));
-  if (key.ctrl && input === "k") return edit(killLineRight(draft));
-  if (key.meta && input === "b") return edit(wordLeft(draft));
-  if (key.meta && input === "f") return edit(wordRight(draft));
-  if (input && !key.ctrl && !key.meta && !key.tab) edit(insert(draft, input.replace(/\r\n?/g, "\n")));
+  const next = lineEdit(draft, input, key);
+  if (next) edit(next);
+}
+const SIZE = 12;
+function hints(overlay, row) {
+  if (overlay.input) return "enter submit · esc cancel";
+  if (overlay.busy) return "esc cancel";
+  if (overlay.menu !== void 0) return "↑↓ select · enter run · esc back";
+  const actions = row?.actions ?? [];
+  return [
+    "↑↓ move",
+    row?.enabled !== void 0 ? "space toggle" : "",
+    row?.choice ? "←→ change" : "",
+    actions.length === 1 ? `enter ${actions[0].label.toLowerCase()}` : actions.length ? "enter actions" : "",
+    "esc close"
+  ].filter(Boolean).join(" · ");
+}
+function Busy() {
+  const theme = useTheme();
+  const { frame } = useAnimation({ interval: 100 });
+  return /* @__PURE__ */ jsxs(Text, { color: theme.accent, children: [
+    SPINNER[frame % SPINNER.length],
+    " Working…"
+  ] });
+}
+function RowLine({ row, selected: selected2 }) {
+  const theme = useTheme();
+  const value = row.choice && (row.choice.options.find((option2) => option2.value === row.choice.value)?.name ?? row.choice.value);
+  return /* @__PURE__ */ jsxs(Text, { wrap: "truncate-end", children: [
+    /* @__PURE__ */ jsxs(Text, { color: selected2 ? theme.accent : void 0, bold: selected2, children: [
+      selected2 ? "❯ " : "  ",
+      row.enabled === void 0 ? "" : row.enabled ? "[x] " : "[ ] ",
+      row.label
+    ] }),
+    row.choice ? /* @__PURE__ */ jsxs(Text, { children: [
+      /* @__PURE__ */ jsx(Text, { color: theme.muted, children: " ◂ " }),
+      /* @__PURE__ */ jsx(Text, { color: theme.accent, children: value }),
+      /* @__PURE__ */ jsx(Text, { color: theme.muted, children: " ▸" })
+    ] }) : null,
+    row.detail ? /* @__PURE__ */ jsxs(Text, { color: theme.muted, children: [
+      "  ",
+      row.detail
+    ] }) : null
+  ] });
+}
+function Rows({ overlay }) {
+  const theme = useTheme();
+  const lines = [];
+  panelRows(overlay.panel).forEach((row, at, rows2) => {
+    if (row.section && row.section !== rows2[at - 1]?.section) lines.push({ heading: row.section });
+    lines.push({ row, at });
+  });
+  if (!lines.length) return /* @__PURE__ */ jsx(Text, { color: theme.muted, children: "Nothing to show" });
+  const { start, rows } = windowOf(lines, lines.findIndex((line) => "row" in line && line.at === overlay.index), SIZE);
+  return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", children: [
+    start > 0 ? /* @__PURE__ */ jsxs(Text, { color: theme.muted, children: [
+      "  ↑ ",
+      start,
+      " more"
+    ] }) : null,
+    rows.map((line, at) => "heading" in line ? /* @__PURE__ */ jsx(Text, { bold: true, color: theme.muted, wrap: "truncate-end", children: line.heading }, `h${start + at}`) : /* @__PURE__ */ jsx(RowLine, { row: line.row, selected: line.at === overlay.index }, line.row.id)),
+    start + rows.length < lines.length ? /* @__PURE__ */ jsxs(Text, { color: theme.muted, children: [
+      "  ↓ ",
+      lines.length - start - rows.length,
+      " more"
+    ] }) : null
+  ] });
+}
+function Menu({ row, index }) {
+  const theme = useTheme();
+  return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", children: [
+    /* @__PURE__ */ jsx(Text, { bold: true, wrap: "truncate-end", children: row.label }),
+    (row.actions ?? []).map((action, at) => /* @__PURE__ */ jsxs(Text, { color: at === index ? theme.accent : void 0, bold: at === index, wrap: "truncate-end", children: [
+      at === index ? "❯ " : "  ",
+      action.label
+    ] }, action.id))
+  ] });
+}
+function Field({ input }) {
+  const theme = useTheme();
+  const inputs = input.action.inputs ?? [];
+  const field = inputs[input.values.length];
+  const mask = (text = "") => field?.secret ? "•".repeat(graphemes(text).length) : text;
+  const line = cursorLines(input.draft)[0];
+  const under = input.draft.cursor < input.draft.text.length ? mask(line.under) : " ";
+  return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", children: [
+    /* @__PURE__ */ jsxs(Text, { bold: true, wrap: "truncate-end", children: [
+      input.action.label,
+      inputs.length > 1 ? /* @__PURE__ */ jsxs(Text, { color: theme.muted, children: [
+        " (",
+        input.values.length + 1,
+        "/",
+        inputs.length,
+        ")"
+      ] }) : null
+    ] }),
+    /* @__PURE__ */ jsxs(Text, { wrap: "wrap", children: [
+      /* @__PURE__ */ jsxs(Text, { color: theme.accent, children: [
+        field?.label,
+        ": "
+      ] }),
+      mask(line.before),
+      /* @__PURE__ */ jsx(Text, { inverse: true, children: under }),
+      mask(line.after),
+      input.draft.text ? null : /* @__PURE__ */ jsx(Text, { color: theme.muted, children: field?.placeholder ?? "" })
+    ] })
+  ] });
+}
+function PanelView({ overlay, width: width2 }) {
+  const theme = useTheme();
+  const { panel } = overlay;
+  const row = panelRows(panel)[overlay.index];
+  return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", width: width2, children: [
+    /* @__PURE__ */ jsxs(Box, { flexDirection: "column", borderStyle: "round", borderColor: theme.accent, paddingX: 1, width: width2, marginTop: 1, children: [
+      /* @__PURE__ */ jsx(Text, { bold: true, wrap: "truncate-end", children: panel?.title ?? `/${overlay.id}` }),
+      overlay.loading && !panel ? /* @__PURE__ */ jsx(Text, { color: theme.muted, children: "Loading…" }) : null,
+      !panel ? null : overlay.input ? /* @__PURE__ */ jsx(Field, { input: overlay.input }) : overlay.menu !== void 0 && row ? /* @__PURE__ */ jsx(Menu, { row, index: overlay.menu }) : /* @__PURE__ */ jsx(Rows, { overlay }),
+      overlay.busy ? /* @__PURE__ */ jsx(Busy, {}) : null,
+      overlay.error ? /* @__PURE__ */ jsx(Text, { color: theme.error, wrap: "wrap", children: overlay.error }) : null,
+      panel?.footer ? /* @__PURE__ */ jsx(Text, { color: theme.muted, wrap: "wrap", children: panel.footer }) : null,
+      /* @__PURE__ */ jsx(Text, { color: theme.muted, wrap: "truncate-end", children: hints(overlay, row) })
+    ] }),
+    overlay.progress ? /* @__PURE__ */ jsx(Text, { wrap: "wrap", children: overlay.progress }) : null
+  ] });
 }
 const MODE_LABELS = { ask: "◇ ask", "accept-edits": "⏵⏵ accept edits", "full-auto": "⏵⏵⏵ full auto" };
 function PromptBox({ state, width: width2 }) {
@@ -1814,7 +2227,7 @@ function Screen({ controller, version }) {
   return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", width: width2, children: [
     /* @__PURE__ */ jsx(Static, { items: state.transcript.flushed, children: (item) => /* @__PURE__ */ jsx(Box, { width: width2, flexDirection: "column", children: /* @__PURE__ */ jsx(ItemView, { item, context }) }, item.id) }),
     state.transcript.live.map((item) => /* @__PURE__ */ jsx(ItemView, { item, live: true, context }, item.id)),
-    state.permission ? /* @__PURE__ */ jsx(PermissionDialog, { pending: state.permission, controller, width: width2, cwd: state.cwd }) : state.overlay?.kind === "details" ? /* @__PURE__ */ jsx(Details, { id: state.overlay.id, transcript: state.transcript, context }, state.overlay.id) : state.overlay ? /* @__PURE__ */ jsx(OverlayView, { state, width: width2 }) : /* @__PURE__ */ jsxs(Box, { flexDirection: "column", children: [
+    state.permission ? /* @__PURE__ */ jsx(PermissionDialog, { pending: state.permission, controller, width: width2, cwd: state.cwd }) : state.overlay?.kind === "details" ? /* @__PURE__ */ jsx(Details, { id: state.overlay.id, transcript: state.transcript, context }, state.overlay.id) : state.overlay?.kind === "panel" ? /* @__PURE__ */ jsx(PanelView, { overlay: state.overlay, width: width2 }) : state.overlay ? /* @__PURE__ */ jsx(OverlayView, { state, width: width2 }) : /* @__PURE__ */ jsxs(Box, { flexDirection: "column", children: [
       state.running ? /* @__PURE__ */ jsx(Working, { state }) : null,
       /* @__PURE__ */ jsxs(Box, { flexDirection: "column", marginTop: 1, children: [
         state.queued.map((text, index) => /* @__PURE__ */ jsxs(Text, { color: theme.muted, wrap: "truncate-end", children: [
@@ -1831,78 +2244,6 @@ function Screen({ controller, version }) {
 function App({ controller, theme, version }) {
   return /* @__PURE__ */ jsx(ThemeContext.Provider, { value: theme, children: /* @__PURE__ */ jsx(Screen, { controller, version }) });
 }
-const FILE_LIST_TTL_MS = 1e4;
-const FILE_MATCHES = 2e3;
-const HISTORY_LIMIT = 500;
-const subsequence = (query, path) => {
-  let at = 0;
-  for (const char of query) {
-    at = path.indexOf(char, at) + 1;
-    if (!at) return false;
-  }
-  return true;
-};
-function memoryTuiConnection(connection, options = {}) {
-  const listed = /* @__PURE__ */ new Map();
-  const files = (cwd) => {
-    const cached = listed.get(cwd);
-    if (cached && Date.now() - cached.at < FILE_LIST_TTL_MS) return cached.files;
-    const entry = { at: Date.now(), files: walkFiles(cwd).catch(() => []) };
-    listed.set(cwd, entry);
-    return entry.files;
-  };
-  return {
-    info: () => ({ provider: options.provider, usingChatGPTPlan: options.usingChatGPTPlan }),
-    async newSession(cwd) {
-      const state = await connection.newSession({ cwd });
-      if (!options.mode || !state.modes || state.modes.currentModeId === options.mode) return state;
-      await connection.setMode(state.sessionId, options.mode);
-      return { ...state, modes: { ...state.modes, currentModeId: options.mode } };
-    },
-    loadSession: async (sessionId, cwd) => await connection.loadSession(sessionId, { cwd }),
-    listSessions: async (cwd) => (await connection.listSessions(cwd)).sessions,
-    prompt: (sessionId, prompt) => connection.prompt(sessionId, prompt),
-    cancel: (sessionId) => connection.cancel(sessionId),
-    setMode: (sessionId, modeId) => connection.setMode(sessionId, modeId),
-    setModel: async (sessionId, modelId) => await connection.setModel(sessionId, modelId),
-    setConfigOption: async (sessionId, configId, value) => await connection.setConfigOption(sessionId, configId, value),
-    onUpdate: (listener) => connection.onUpdate((sessionId, update) => listener(sessionId, update)),
-    onPermission: (handler) => connection.onPermission(async (request) => (await handler(request)).outcome),
-    async listFiles(query, cwd) {
-      const term = query.toLowerCase();
-      return (await files(cwd)).filter((path) => subsequence(term, path.toLowerCase())).slice(0, FILE_MATCHES);
-    }
-  };
-}
-function fileHistory(path) {
-  return {
-    load() {
-      try {
-        return readFileSync(path, "utf8").split("\n").flatMap((line) => {
-          try {
-            const entry = JSON.parse(line);
-            return typeof entry === "string" ? [entry] : [];
-          } catch {
-            return [];
-          }
-        }).slice(-HISTORY_LIMIT);
-      } catch {
-        return [];
-      }
-    },
-    save(entry) {
-      try {
-        mkdirSync(dirname(path), { recursive: true, mode: 448 });
-        appendFileSync(path, `${JSON.stringify(entry)}
-`, { mode: 384 });
-        const lines = readFileSync(path, "utf8").split("\n").filter(Boolean);
-        if (lines.length > HISTORY_LIMIT * 2) writeFileSync(path, `${lines.slice(-HISTORY_LIMIT).join("\n")}
-`, { mode: 384 });
-      } catch {
-      }
-    }
-  };
-}
 async function run(connection, options) {
   const controller = new Controller(connection, { cwd: options.cwd, history: options.history });
   const exited = new Promise((resolve) => {
@@ -1951,4 +2292,4 @@ export {
   run,
   runTui
 };
-//# sourceMappingURL=index-BrBnidfI.js.map
+//# sourceMappingURL=index-T_6HaJx-.js.map