bitpull 0.1.30 → 0.1.32

package/ui/quick.js

@@ -0,0 +1,668 @@
+// Quick commands of the composer, the same in Projects and in the chat, on a computer and on a phone:
+//   /  at the start: a command or a custom one ("skill"); the text after its name is its arguments
+//   !  at the start: a command run on this computer in the project's folder, without the model
+//   @  a file of the project (Projects handles it)
+//   :  an emoji by its short name, :heart: becomes ❤️
+//   ?  on an empty input: the keyboard shortcuts
+// Every command is in one registry: built-in ones (their action given by each page), custom ones from
+// Markdown files, and later plugins and MCP prompts. Keys come from ~/.bitpull/keybindings.json.
+(() => {
+  /** The built-in commands: [name, aliases, category, argument hint, runs at once, hidden]. */
+  const CATALOG = [
+    ["clear", ["reset", "new"], "session", "[name]"],
+    ["compact", [], "session", "[instructions]"],
+    ["resume", ["continue"], "session", "[name]", true],
+    ["rename", [], "session", "[name]"],
+    ["export", [], "session", "[file]", true],
+    ["copy", [], "session", "[N]", true],
+    ["recap", [], "session", ""],
+    ["btw", [], "session", "<question>", true],
+    ["rewind", ["checkpoint", "undo"], "session", ""],
+    ["stop", [], "session", "", true],
+    ["exit", ["quit"], "session", "", true],
+    ["add-dir", ["folder"], "session", "<path>", true],
+    ["cd", [], "session", "<path>", true],
+    ["init", [], "context", ""],
+    ["memory", [], "context", "", true],
+    ["context", [], "context", "", true],
+    ["model", [], "model", "[model]", true],
+    ["plan", [], "model", "[description]"],
+    ["permissions", ["allowed-tools"], "model", "[ask|edits|auto]", true],
+    ["diff", [], "code", "", true],
+    ["review", ["code-review"], "code", "[focus]"],
+    ["security-review", [], "code", ""],
+    ["simplify", [], "code", "[target]"],
+    ["verify", [], "code", ""],
+    ["debug", [], "code", "[description]"],
+    ["tasks", ["bashes"], "agents", "", true],
+    ["loop", ["proactive"], "agents", "[interval] [prompt] | stop", true],
+    ["skills", [], "extensions", "", true],
+    ["reload-skills", [], "extensions", "", true],
+    ["mcp", [], "extensions", "", true],
+    ["config", ["settings"], "config", "", true],
+    ["theme", [], "config", "", true],
+    ["keybindings", [], "config", "", true],
+    ["privacy-settings", [], "config", "", true],
+    ["help", [], "info", "", true],
+    ["status", [], "info", "", true],
+    ["doctor", ["checkup"], "info", "", true],
+    ["usage", ["cost", "stats"], "info", "", true],
+    ["release-notes", [], "info", "", true],
+    ["bug", ["share"], "info", "[report]", true],
+    ["feedback", [], "info", "[report]", true],
+    ["version", [], "info", "", true, true],
+    ["shell-reply", [], "config", "[on|off]", true],
+    ["login", [], "account", "", true],
+    ["logout", [], "account", "", true],
+    ["plans", ["upgrade"], "account", "", true],
+    ["topup", ["usage-credits"], "account", "", true],
+    ["phone", ["mobile", "remote-control"], "bitpull", "", true],
+    ["lend", [], "bitpull", "[on|off]", true],
+    ["pause", [], "bitpull", "", true],
+    ["network", [], "bitpull", "", true],
+    ["groups", [], "bitpull", "", true],
+    ["models", [], "bitpull", "", true],
+    ["publish", [], "bitpull", "", true],
+    ["terminal", [], "bitpull", "", true],
+    ["projects", [], "bitpull", "", true],
+    ["chat", [], "bitpull", "", true],
+  ];
+  const CATEGORIES = ["session", "context", "model", "code", "agents", "extensions", "config", "info", "account", "bitpull", "custom"];
+
+  /** Default keys; the person's ~/.bitpull/keybindings.json replaces any of them. */
+  const DEFAULT_KEYS = {
+    "chat:submit": ["Enter"],
+    "chat:newline": ["Shift+Enter", "Alt+Enter", "Ctrl+J"],
+    "chat:interrupt": ["Escape"],
+    "chat:clearInput": ["Escape Escape"],
+    "history:search": ["Ctrl+R"],
+    "chat:stash": ["Ctrl+S"],
+    "chat:modelPicker": ["Alt+P"],
+    "chat:cycleMode": ["Shift+Tab"],
+    "chat:sendNow": ["Ctrl+Enter", "Ctrl+X Ctrl+S"],
+    "help:shortcuts": ["?"],
+    "edit:killToEnd": ["Ctrl+K"],
+    "edit:killToStart": ["Ctrl+U"],
+    "edit:killWord": ["Ctrl+W"],
+    "edit:yank": ["Ctrl+Y"],
+    "edit:wordBack": ["Alt+B"],
+    "edit:wordForward": ["Alt+F"],
+    "edit:deleteWord": ["Alt+D"],
+    "edit:undo": ["Ctrl+_"],
+  };
+  /** Line start and end: on a Mac the text box does it already; elsewhere Ctrl+A stays "select all". */
+  if (/Mac/i.test(navigator.platform || navigator.userAgent)) Object.assign(DEFAULT_KEYS, { "edit:lineStart": ["Ctrl+A"], "edit:lineEnd": ["Ctrl+E"] });
+
+  const EMOJI = {
+    heart: "❤️", smile: "😄", grin: "😁", joy: "😂", laughing: "😆", wink: "😉", blush: "😊", thinking: "🤔", cry: "😢", sob: "😭",
+    "+1": "👍", thumbsup: "👍", "-1": "👎", thumbsdown: "👎", clap: "👏", pray: "🙏", wave: "👋", ok_hand: "👌", muscle: "💪", eyes: "👀",
+    fire: "🔥", rocket: "🚀", tada: "🎉", sparkles: "✨", star: "⭐", "100": "💯", check: "✅", white_check_mark: "✅", x: "❌", warning: "⚠️",
+    bug: "🐛", wrench: "🔧", hammer: "🔨", gear: "⚙️", zap: "⚡", bulb: "💡", memo: "📝", lock: "🔒", key: "🔑", package: "📦",
+    computer: "💻", phone: "📱", robot: "🤖", brain: "🧠", chart: "📈", coffee: "☕", pizza: "🍕", beer: "🍺", sun: "☀️", moon: "🌙",
+  };
+
+  const INVISIBLE = /[​-‏‪-‮⁠-⁤⁦-⁩]|[\u{E0000}-\u{E007F}]/gu;
+  const norm = (s) => String(s).toLowerCase().replace(/[:_-]/g, "");
+  const words = (s) => String(s).toLowerCase().split(/[:_-]+/).filter(Boolean);
+
+  /** Does `q` (already normalised) match this name: from the start, or from a word inside it. */
+  const strong = (name, q) => norm(name).startsWith(q) || words(name).some((w) => w.startsWith(q));
+  /** Near: a few letters wrong, missing or swapped (a typing mistake shows them, never chosen by Enter). */
+  const distance = (a, b) => {
+    const d = Array.from({ length: a.length + 1 }, (_, i) => [i, ...Array(b.length).fill(0)]);
+    for (let j = 1; j <= b.length; j++) d[0][j] = j;
+    for (let i = 1; i <= a.length; i++) {
+      for (let j = 1; j <= b.length; j++) {
+        d[i][j] = Math.min(d[i - 1][j] + 1, d[i][j - 1] + 1, d[i - 1][j - 1] + (a[i - 1] === b[j - 1] ? 0 : 1));
+        if (i > 1 && j > 1 && a[i - 1] === b[j - 2] && a[i - 2] === b[j - 1]) d[i][j] = Math.min(d[i][j], d[i - 2][j - 2] + 1);
+      }
+    }
+    return d[a.length][b.length];
+  };
+  const near = (name, q) => {
+    if (q.length < 3) return false;
+    const n = norm(name);
+    const most = Math.max(1, Math.floor(q.length / 3));
+    return distance(n, q) <= most || distance(n.slice(0, q.length), q) <= most;
+  };
+
+  function createRegistry() {
+    const cmds = new Map();
+    return {
+      add(c) {
+        cmds.set(c.name, { aliases: [], args: "", category: "custom", kind: "builtin", hidden: false, runsImmediately: false, isAvailable: () => true, ...c });
+      },
+      clearKind(kind) {
+        for (const [k, c] of cmds) if (c.kind === kind) cmds.delete(k);
+      },
+      all() {
+        return [...cmds.values()].filter((c) => c.isAvailable());
+      },
+      find(name) {
+        const n = String(name).toLowerCase();
+        const list = this.all();
+        return list.find((c) => c.name.toLowerCase() === n) || list.find((c) => c.aliases.some((a) => a.toLowerCase() === n))
+          // A plugin's command by its short name, when only one has it.
+          || ((m) => (m.length === 1 ? m[0] : null))(list.filter((c) => c.name.includes(":") && c.name.split(":").pop().toLowerCase() === n));
+      },
+      /** What to show for "/q": strong matches (the first is chosen), or near ones (none chosen). */
+      match(q) {
+        const nq = norm(q);
+        const list = this.all();
+        const order = (a, b) => CATEGORIES.indexOf(a.category) - CATEGORIES.indexOf(b.category) || a.name.localeCompare(b.name);
+        if (!nq) return { items: list.filter((c) => !c.hidden).sort(order), chosen: 0 };
+        const hit = list.filter((c) => (c.hidden ? norm(c.name) === nq : strong(c.name, nq) || c.aliases.some((a) => strong(a, nq))));
+        if (hit.length) {
+          const exact = (c) => norm(c.name) === nq || c.aliases.some((a) => norm(a) === nq);
+          const starts = (c) => norm(c.name).startsWith(nq) || c.aliases.some((a) => norm(a).startsWith(nq));
+          hit.sort((a, b) => Number(exact(b)) - Number(exact(a)) || Number(starts(b)) - Number(starts(a)) || order(a, b));
+          return { items: hit, chosen: 0 };
+        }
+        return { items: list.filter((c) => !c.hidden && (near(c.name, nq) || c.aliases.some((a) => near(a, nq)))).sort(order).slice(0, 8), chosen: -1 };
+      },
+    };
+  }
+
+  /** "ctrl+x ctrl+s" → "Ctrl+X Ctrl+S", as keyName() writes them. */
+  const MOD = { ctrl: "Ctrl", control: "Ctrl", alt: "Alt", option: "Alt", opt: "Alt", shift: "Shift", meta: "Meta", cmd: "Meta", command: "Meta", super: "Meta" };
+  const NAMED = { enter: "Enter", return: "Enter", esc: "Escape", escape: "Escape", tab: "Tab", space: "Space", backspace: "Backspace", delete: "Delete", up: "ArrowUp", down: "ArrowDown", left: "ArrowLeft", right: "ArrowRight" };
+  const normKey = (combo) => String(combo).trim().split(/\s+/).map((step) => {
+    const parts = step.split("+").filter(Boolean);
+    const key = parts.pop() || "";
+    const mods = [...new Set(parts.map((m) => MOD[m.toLowerCase()] || m))].sort((a, b) => ["Ctrl", "Alt", "Shift", "Meta"].indexOf(a) - ["Ctrl", "Alt", "Shift", "Meta"].indexOf(b));
+    const k = NAMED[key.toLowerCase()] || (key.length === 1 ? key.toUpperCase() : key);
+    // Shift with one character is already in the character ("?" not "Shift+/").
+    return [...mods.filter((m) => !(m === "Shift" && k.length === 1)), k].join("+");
+  }).join(" ");
+
+  /**
+   * The person's keybindings.json, in either form:
+   *   { "chat:sendNow": ["Ctrl+Enter"] }                        an action and its keys
+   *   { "ctrl+x ctrl+s": "chat:sendNow", "ctrl+s": null }       keys and their action; null takes a key away
+   *   { "bindings": [{ "context": "Chat", "bindings": {…} }] }  as in Claude Code
+   */
+  function applyKeymap(base, raw) {
+    const keys = Object.fromEntries(Object.entries(base).map(([a, l]) => [a, [...l]]));
+    const unbind = (k) => { for (const a of Object.keys(keys)) keys[a] = keys[a].filter((x) => x !== k); };
+    const known = (a) => a in DEFAULT_KEYS || a === "edit:lineStart" || a === "edit:lineEnd";
+    const one = (obj) => {
+      if (!obj || typeof obj !== "object") return;
+      for (const [k, v] of Object.entries(obj)) {
+        if (known(k)) { keys[k] = [].concat(v || []).map(normKey); continue; }
+        const combo = normKey(k);
+        if (v === null) { unbind(combo); continue; }
+        if (typeof v === "string" && known(v)) { unbind(combo); keys[v] = [...(keys[v] || []), combo]; }
+      }
+    };
+    if (Array.isArray(raw.bindings)) for (const b of raw.bindings) one(b && b.bindings);
+    else one(raw);
+    return keys;
+  }
+
+  /** "Ctrl+X Ctrl+S" and the like: does this key event finish one of these combinations? */
+  const keyName = (e) => {
+    const parts = [];
+    if (e.ctrlKey) parts.push("Ctrl");
+    if (e.altKey) parts.push("Alt");
+    if (e.shiftKey && e.key.length > 1) parts.push("Shift");
+    if (e.metaKey) parts.push("Meta");
+    let k = e.key;
+    if (e.altKey && /^Key[A-Z]$/.test(e.code)) k = e.code.slice(3);
+    if (k.length === 1) k = k.toUpperCase();
+    if (k === " ") k = "Space";
+    if (!["Control", "Alt", "Shift", "Meta"].includes(e.key)) parts.push(k);
+    return parts.join("+");
+  };
+
+  /**
+   * Plugs the quick commands into a text box. `o`:
+   *   t(key, vars)            translation
+   *   surface                 "projects" or "chat"
+   *   registry                from createRegistry(), with each page's built-in actions
+   *   send(text)              an ordinary message
+   *   shell(command)          "!" (missing: the page says where it works)
+   *   runSkill(name, args)    a custom command
+   *   loadSkills()            the custom commands for the menu
+   *   busy()                  the model is answering: commands wait in a queue
+   *   say(text, kind)         a short line under the box
+   *   interrupt()             Esc while the model works
+   *   pickModel(), cycleMode()
+   */
+  function attach(input, o) {
+    const t = o.t;
+    let keys = { ...DEFAULT_KEYS };
+    let keymapFile = "";
+    fetch("/api/quick/keymap", { headers: { "x-bitpull-token": (window.__BITPULL__ || {}).token || "" } })
+      .then((r) => (r.ok ? r.json() : null))
+      .then((r) => {
+        if (r && r.keymap) keys = applyKeymap(keys, r.keymap);
+        keymapFile = (r && r.file) || "";
+      })
+      .catch(() => {});
+    const is = (action, name) => (keys[action] || []).includes(name);
+
+    const host = o.host || input.parentElement;
+    if (getComputedStyle(host).position === "static") host.style.position = "relative";
+    const menu = document.createElement("ul");
+    menu.className = "qc-menu";
+    menu.setAttribute("role", "listbox");
+    menu.hidden = true;
+    host.appendChild(menu);
+    const panel = document.createElement("div");
+    panel.className = "qc-panel";
+    panel.hidden = true;
+    host.appendChild(panel);
+
+    let items = [];
+    let chosen = -1;
+    let kind = null; // "slash" | "emoji" | "history"
+    let emojiStart = -1;
+    const queue = [];
+    let pendingInvisible = null;
+    let chord = null;
+    let chordTimer = 0;
+    let stash = null;
+    const killRing = [];
+    const undoStack = [];
+    const histKey = `bp_qc_history_${o.surface}`;
+    const shellKey = () => `bp_qc_shell_${o.surface}_${o.scope ? o.scope() : ""}`;
+    const load = (k) => { try { return JSON.parse(localStorage.getItem(k) || "[]"); } catch { return []; } };
+    const save = (k, v) => { try { localStorage.setItem(k, JSON.stringify(v.slice(-200))); } catch {} };
+    let history = load(histKey);
+    let histPos = -1;
+
+    const close = () => { menu.hidden = true; items = []; chosen = -1; kind = null; };
+    const draw = () => {
+      menu.replaceChildren();
+      if (!items.length) { menu.hidden = true; return; }
+      items.forEach((it, i) => {
+        const li = document.createElement("li");
+        li.className = i === chosen ? "on" : "";
+        li.setAttribute("role", "option");
+        const a = document.createElement("span");
+        a.className = "qc-name";
+        a.textContent = it.label;
+        const b = document.createElement("span");
+        b.className = "qc-desc";
+        b.textContent = it.desc || "";
+        li.append(a, b);
+        li.addEventListener("mousedown", (e) => { e.preventDefault(); chosen = i; accept(true); });
+        menu.appendChild(li);
+      });
+      menu.hidden = false;
+      menu.querySelector("li.on")?.scrollIntoView({ block: "nearest" });
+    };
+    const describe = (c) => (c.kind === "builtin" ? t(`qc.${c.name}`) : c.description || t("qc.custom"));
+
+    async function refreshSkills() {
+      if (!o.loadSkills) return;
+      try {
+        const list = await o.loadSkills();
+        o.registry.clearKind("skill");
+        o.registry.clearKind("plugin");
+        for (const s of list) o.registry.add({ name: s.name, description: s.description, args: s.argumentHint, category: "custom", kind: s.plugin ? "plugin" : "skill", handler: (args) => o.runSkill(s.name, args) });
+      } catch {}
+    }
+    refreshSkills();
+
+    /** Shows the menu for what is typed now. */
+    function update() {
+      const v = input.value;
+      const caret = input.selectionStart ?? v.length;
+      input.classList.toggle("qc-shell", v.startsWith("!"));
+      // "/" only opens a command when it starts the message, and only while its name is being typed.
+      const slash = /^\/(\S*)$/.exec(v.slice(0, caret));
+      if (slash && v.indexOf(" ") === -1 || slash && caret <= v.indexOf(" ")) {
+        const m = o.registry.match(slash[1]);
+        kind = "slash";
+        items = m.items.map((c) => ({ label: `/${c.name}${c.args ? ` ${c.args}` : ""}`, desc: describe(c), cmd: c }));
+        chosen = m.chosen;
+        if (!items.length) items = [{ label: t("qc.nomatch", { q: slash[1] }), desc: "", none: true }];
+        return draw();
+      }
+      // ":" and two letters: emoji suggestions; ":name:" becomes the emoji.
+      const before = v.slice(0, caret);
+      const full = /(^|\s):([a-z0-9_+-]{1,30}):$/.exec(before);
+      if (full && EMOJI[full[2]]) {
+        const start = caret - full[2].length - 2;
+        setValue(v.slice(0, start) + EMOJI[full[2]] + v.slice(caret), start + EMOJI[full[2]].length);
+        return close();
+      }
+      const part = /(^|\s):([a-z0-9_+-]{2,30})$/.exec(before);
+      if (part) {
+        const q = part[2];
+        const found = Object.entries(EMOJI).filter(([k]) => k.startsWith(q)).slice(0, 8);
+        if (found.length) {
+          kind = "emoji";
+          emojiStart = caret - q.length - 1;
+          items = found.map(([k, e]) => ({ label: `${e}  :${k}:`, emoji: e }));
+          chosen = 0;
+          return draw();
+        }
+      }
+      if (kind !== "history") close();
+    }
+
+    function setValue(v, caret) {
+      undoStack.push({ v: input.value, c: input.selectionStart });
+      if (undoStack.length > 100) undoStack.shift();
+      input.value = v;
+      const at = caret ?? v.length;
+      input.setSelectionRange(at, at);
+      input.dispatchEvent(new Event("input", { bubbles: true }));
+    }
+
+    /** Tab or a click: the chosen suggestion goes into the box; with `run`, a command also runs. */
+    function accept(run) {
+      const it = items[chosen];
+      if (!it || it.none) return false;
+      if (kind === "slash") {
+        if (run && !it.cmd.args.startsWith("<")) { close(); setValue(""); dispatch(`/${it.cmd.name}`); return true; }
+        setValue(`/${it.cmd.name} `);
+        close();
+        return true;
+      }
+      if (kind === "emoji") {
+        const v = input.value;
+        const caret = input.selectionStart;
+        setValue(v.slice(0, emojiStart) + it.emoji + v.slice(caret), emojiStart + it.emoji.length);
+        close();
+        return true;
+      }
+      if (kind === "history") {
+        setValue(it.text);
+        close();
+        return true;
+      }
+      return false;
+    }
+
+    /** One message from the box: a command, a skill (up to six in a row), "!", or a plain message. */
+    async function dispatch(text) {
+      if (text.startsWith("!")) {
+        const command = text.slice(1).trim();
+        if (!command) return;
+        if (!o.shell) return o.say(t("qc.shell.where"), "warn");
+        const past = load(shellKey()).filter((c) => c !== command);
+        save(shellKey(), [...past, command]);
+        if (o.busy()) return enqueue(text, false);
+        return o.shell(command);
+      }
+      if (text.startsWith("/")) {
+        const m = /^\/(\S+)\s*([\s\S]*)$/.exec(text);
+        const c = m && o.registry.find(m[1]);
+        if (!c) return o.say(t("qc.unknown", { name: m ? m[1] : "" }), "warn");
+        if (c.kind !== "builtin") {
+          // "/a /b do X": every skill named first gets "do X".
+          const chain = [c];
+          let rest = m[2];
+          for (let next = /^\/(\S+)\s*([\s\S]*)$/.exec(rest); next && chain.length < 6; next = /^\/(\S+)\s*([\s\S]*)$/.exec(rest)) {
+            const s = o.registry.find(next[1]);
+            if (!s || s.kind === "builtin") break;
+            chain.push(s);
+            rest = next[2];
+          }
+          if (o.busy()) return enqueue(text, false);
+          for (const s of chain) await s.handler(rest.trim());
+          return;
+        }
+        if (o.busy() && !c.runsImmediately) return enqueue(text, false);
+        return c.handler(m[2].trim());
+      }
+      if (o.busy()) return enqueue(text, true);
+      return o.send(text);
+    }
+
+    function enqueue(text) {
+      queue.push(text);
+      o.say(t("qc.queued", { n: queue.length }), "info");
+    }
+
+    /** The page calls this when the model has finished: what waits goes, in order. */
+    async function idle() {
+      if (!queue.length) return;
+      // The "in the queue" line goes first: what the queued commands say stays on screen.
+      o.say("", "info");
+      while (queue.length && !o.busy()) {
+        const next = queue.shift();
+        await dispatch(next);
+        if (o.busy()) break;
+      }
+      if (queue.length) o.say(t("qc.queued", { n: queue.length }), "info");
+    }
+
+    function remember(text) {
+      history = [...history.filter((h) => h !== text), text];
+      save(histKey, history);
+      histPos = -1;
+    }
+
+    async function submit() {
+      let text = input.value;
+      // Invisible characters are taken out, and the person confirms with a second Enter.
+      if (INVISIBLE.test(text)) {
+        INVISIBLE.lastIndex = 0;
+        const clean = text.replace(INVISIBLE, "");
+        if (pendingInvisible !== clean) {
+          pendingInvisible = clean;
+          setValue(clean);
+          return o.say(t("qc.invisible"), "warn");
+        }
+        text = clean;
+      }
+      INVISIBLE.lastIndex = 0;
+      pendingInvisible = null;
+      text = text.trim();
+      if (!text) return;
+      // A command being typed with the chosen suggestion: Enter runs that one.
+      if (kind === "slash" && chosen >= 0 && !text.includes(" ") && items[chosen]?.cmd) text = `/${items[chosen].cmd.name}`;
+      close();
+      remember(text);
+      setValue("");
+      await dispatch(text);
+    }
+
+    function shortcuts() {
+      if (!panel.hidden) { panel.hidden = true; return; }
+      panel.replaceChildren();
+      const h = document.createElement("strong");
+      h.textContent = t("qc.keys.title");
+      panel.appendChild(h);
+      const rows = [
+        ["/", t("qc.keys.slash")], ["!", t("qc.keys.bang")], ["@", t("qc.keys.at")], [":", t("qc.keys.colon")],
+        ...Object.entries(keys).map(([a, k]) => [[].concat(k).join(" · "), t(`qc.key.${a}`)]),
+      ];
+      const dl = document.createElement("dl");
+      for (const [k, d] of rows) {
+        const dt = document.createElement("dt");
+        dt.textContent = k;
+        const dd = document.createElement("dd");
+        dd.textContent = d;
+        dl.append(dt, dd);
+      }
+      panel.appendChild(dl);
+      panel.hidden = false;
+    }
+
+    // ---- editing as in a terminal (readline) ----------------------------------------------------
+    const lineStart = (v, c) => v.lastIndexOf("\n", c - 1) + 1;
+    const lineEnd = (v, c) => ((i) => (i < 0 ? v.length : i))(v.indexOf("\n", c));
+    const wordLeft = (v, c) => { let i = c; while (i > 0 && /\W/.test(v[i - 1])) i--; while (i > 0 && /\w/.test(v[i - 1])) i--; return i; };
+    const wordRight = (v, c) => { let i = c; while (i < v.length && /\W/.test(v[i])) i++; while (i < v.length && /\w/.test(v[i])) i++; return i; };
+    const spaceLeft = (v, c) => { let i = c; while (i > 0 && /\s/.test(v[i - 1])) i--; while (i > 0 && !/\s/.test(v[i - 1])) i--; return i; };
+    const kill = (from, to) => {
+      const v = input.value;
+      if (from === to) return;
+      killRing.push(v.slice(from, to));
+      if (killRing.length > 20) killRing.shift();
+      setValue(v.slice(0, from) + v.slice(to), from);
+    };
+
+    input.addEventListener("input", update);
+    input.addEventListener("click", update);
+    input.addEventListener("blur", () => setTimeout(close, 150));
+    input.addEventListener("paste", (e) => {
+      // Pasting text that starts with "!" in an empty box enters shell mode, as typing it does.
+      const text = e.clipboardData && e.clipboardData.getData("text");
+      if (text && text.startsWith("!") && !input.value) setTimeout(update, 0);
+    });
+
+    input.addEventListener("keydown", (e) => {
+      if (e.isComposing || e.defaultPrevented) return;
+      const name = keyName(e);
+      const v = input.value;
+      const c = input.selectionStart ?? 0;
+
+      // A combination in two steps (Ctrl+X then Ctrl+S).
+      if (chord) {
+        const full = `${chord} ${name}`;
+        chord = null;
+        clearTimeout(chordTimer);
+        o.say("", "info");
+        for (const [action, list] of Object.entries(keys)) if (list.includes(full)) { e.preventDefault(); return run(action); }
+      }
+      // A prefix key (Ctrl+X) waits up to three seconds for the second one, and says so.
+      // A key that is also an action of its own (Esc, then Esc Esc) does its action as well.
+      // With text selected Ctrl+X still cuts it, as everywhere.
+      if (input.selectionStart === input.selectionEnd && Object.values(keys).some((list) => list.some((k) => k.startsWith(`${name} `)))) {
+        chord = name;
+        clearTimeout(chordTimer);
+        chordTimer = setTimeout(() => { if (chord === name) { chord = null; o.say("", "info"); } }, 3000);
+        if (!Object.values(keys).some((list) => list.includes(name))) {
+          o.say(t("qc.chord", { key: name }), "info");
+          e.preventDefault();
+          return;
+        }
+      }
+
+      // The menu first.
+      if (!menu.hidden && items.length) {
+        if (e.key === "ArrowDown") { chosen = Math.min(items.length - 1, chosen + 1); draw(); return e.preventDefault(); }
+        if (e.key === "ArrowUp") { chosen = Math.max(0, chosen - 1); draw(); return e.preventDefault(); }
+        if (e.key === "Tab" && !e.shiftKey) { if (chosen < 0) chosen = 0; e.preventDefault(); return void accept(false); }
+        if (e.key === "Escape") { e.preventDefault(); return close(); }
+        if (e.key === "Enter" && !e.shiftKey && kind !== "slash") { if (chosen >= 0) { e.preventDefault(); return void accept(kind === "slash"); } }
+      }
+
+      // "?" on an empty box: the shortcuts, instead of the character.
+      if (e.key === "?" && !v && is("help:shortcuts", "?")) { e.preventDefault(); return shortcuts(); }
+      if (!panel.hidden && e.key === "Escape") { panel.hidden = true; return e.preventDefault(); }
+
+      // Shell mode: Tab completes from the commands used before in this project; Esc or Backspace at "!" leave it.
+      if (v.startsWith("!") && e.key === "Tab" && !e.shiftKey) {
+        const typed = v.slice(1).trimStart();
+        const past = load(shellKey()).reverse().find((x) => x.startsWith(typed) && x !== typed);
+        e.preventDefault();
+        if (past) setValue(`! ${past}`);
+        return;
+      }
+      if (v === "!" && (e.key === "Escape" || e.key === "Backspace")) { e.preventDefault(); setValue(""); return; }
+
+      // A backslash before Enter: a new line, as in a terminal.
+      if (e.key === "Enter" && !e.shiftKey && !e.altKey && v[c - 1] === "\\") { e.preventDefault(); setValue(`${v.slice(0, c - 1)}\n${v.slice(c)}`, c); return; }
+
+      for (const [action, list] of Object.entries(keys)) {
+        if (!list.includes(name)) continue;
+        if (action === "help:shortcuts") continue;
+        if (action === "chat:submit" && e.shiftKey) continue;
+        e.preventDefault();
+        return run(action);
+      }
+
+      // History: up from the first line, down from the last.
+      if (e.key === "ArrowUp" && !e.shiftKey && c <= (v.indexOf("\n") < 0 ? v.length : v.indexOf("\n")) && (!v || histPos >= 0)) {
+        if (!history.length) return;
+        e.preventDefault();
+        histPos = histPos < 0 ? history.length - 1 : Math.max(0, histPos - 1);
+        return setValue(history[histPos]);
+      }
+      if (e.key === "ArrowDown" && histPos >= 0 && c >= v.lastIndexOf("\n") + 1) {
+        e.preventDefault();
+        histPos++;
+        if (histPos >= history.length) { histPos = -1; return setValue(""); }
+        return setValue(history[histPos]);
+      }
+    });
+
+    function run(action) {
+      const v = input.value;
+      const c = input.selectionStart ?? 0;
+      switch (action) {
+        case "chat:submit": return void submit();
+        case "chat:newline": return setValue(`${v.slice(0, c)}\n${v.slice(input.selectionEnd ?? c)}`, c + 1);
+        case "chat:interrupt": if (o.busy() && o.interrupt) o.interrupt(); return;
+        // Esc Esc with text: it goes into the history (Up brings it back) and the box empties.
+        case "chat:clearInput": if (v.trim()) { remember(v.trim()); setValue(""); o.say(t("qc.cleared"), "info"); } return;
+        case "history:search": {
+          const q = v.trim().toLowerCase();
+          kind = "history";
+          items = [...history].reverse().filter((h) => !q || h.toLowerCase().includes(q)).slice(0, 12).map((h) => ({ label: h.split("\n")[0].slice(0, 120), desc: "", text: h }));
+          chosen = items.length ? 0 : -1;
+          if (!items.length) items = [{ label: t("qc.history.none"), none: true }];
+          return draw();
+        }
+        case "chat:stash":
+          if (v.trim()) { stash = v; setValue(""); o.say(t("qc.stashed"), "info"); }
+          else if (stash !== null) { setValue(stash); stash = null; }
+          return;
+        case "chat:modelPicker": return o.pickModel && o.pickModel();
+        case "chat:cycleMode": return o.cycleMode && o.cycleMode();
+        // Send now: what is in the box joins the queue, the model stops, and the queue goes at once.
+        case "chat:sendNow":
+          if (v.trim()) { remember(v.trim()); queue.push(v.trim()); setValue(""); }
+          if (o.busy()) { if (o.interrupt) o.interrupt(); return; }
+          return void idle();
+        case "edit:lineStart": return input.setSelectionRange(lineStart(v, c), lineStart(v, c));
+        case "edit:lineEnd": return input.setSelectionRange(lineEnd(v, c), lineEnd(v, c));
+        case "edit:killToEnd": return kill(c, lineEnd(v, c) === c ? Math.min(v.length, c + 1) : lineEnd(v, c));
+        case "edit:killToStart": return kill(lineStart(v, c), c);
+        case "edit:killWord": return kill(spaceLeft(v, c), c);
+        case "edit:yank": { const last = killRing[killRing.length - 1]; if (last) setValue(v.slice(0, c) + last + v.slice(c), c + last.length); return; }
+        case "edit:wordBack": return input.setSelectionRange(wordLeft(v, c), wordLeft(v, c));
+        case "edit:wordForward": return input.setSelectionRange(wordRight(v, c), wordRight(v, c));
+        case "edit:deleteWord": return kill(c, wordRight(v, c));
+        case "edit:undo": { const prev = undoStack.pop(); if (prev) { input.value = prev.v; input.setSelectionRange(prev.c, prev.c); update(); } return; }
+      }
+    }
+
+    return { idle, submit, submitText: (text) => { remember(text); return dispatch(text); }, sendNow: (text) => (o.busy() ? enqueue(text) : o.send(text)), refreshSkills, queue: () => queue.slice(), shortcuts, keys: () => ({ ...keys }), keymapFile: () => keymapFile, set: setValue, update };
+  }
+
+  /** Adds the built-in commands that a page knows how to do. */
+  function builtins(registry, handlers) {
+    for (const [name, aliases, category, args, immediate, hidden] of CATALOG) {
+      const handler = handlers[name];
+      if (!handler) continue;
+      registry.add({ name, aliases, category, args, runsImmediately: !!immediate, hidden: !!hidden, kind: "builtin", handler });
+    }
+  }
+
+  /** The whole conversation as plain text, for /export and /copy. */
+  const download = (name, text) => {
+    const a = document.createElement("a");
+    a.href = URL.createObjectURL(new Blob([text], { type: "text/plain;charset=utf-8" }));
+    a.download = name;
+    document.body.appendChild(a);
+    a.click();
+    setTimeout(() => { URL.revokeObjectURL(a.href); a.remove(); }, 1000);
+  };
+
+  window.BitPullQuick = { createRegistry, attach, builtins, CATALOG, CATEGORIES, EMOJI, DEFAULT_KEYS, keyName, normKey, applyKeymap, download };
+
+  const css = document.createElement("style");
+  css.textContent = `
+  .qc-menu { position:absolute; left:0; right:0; bottom:calc(100% + 6px); z-index:40; list-style:none; margin:0; padding:6px; max-height:min(50vh,340px); overflow:auto;
+    background:var(--surface, var(--bg2, #1f2128)); color:var(--text, var(--fg, #ececec)); border:1px solid var(--line, var(--border, #33363f)); border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,.3); font-size:13px; }
+  .qc-menu li { display:flex; gap:12px; align-items:baseline; padding:6px 10px; border-radius:8px; cursor:pointer; min-height:28px; }
+  .qc-menu li.on, .qc-menu li:hover { background:color-mix(in srgb, var(--accent, #7f95ff) 22%, transparent); }
+  .qc-menu .qc-name { font-family:ui-monospace, Menlo, Consolas, monospace; white-space:nowrap; flex:0 0 auto; }
+  .qc-menu .qc-desc { color:var(--muted, #a2a19b); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; min-width:0; }
+  .qc-panel { position:absolute; left:0; right:0; bottom:calc(100% + 6px); z-index:41; padding:12px 14px; max-height:min(60vh,420px); overflow:auto;
+    background:var(--surface, var(--bg2, #1f2128)); color:var(--text, var(--fg, #ececec)); border:1px solid var(--line, var(--border, #33363f)); border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,.3); font-size:13px; }
+  .qc-panel dl { display:grid; grid-template-columns:max-content 1fr; gap:4px 14px; margin:8px 0 0; }
+  .qc-panel dt { font-family:ui-monospace, Menlo, Consolas, monospace; }
+  .qc-panel dd { margin:0; color:var(--muted, #a2a19b); }
+  textarea.qc-shell { border-color:var(--warn, #e0a64b) !important; box-shadow:inset 3px 0 0 var(--warn, #e0a64b); font-family:ui-monospace, Menlo, Consolas, monospace; }
+  @media (max-width:720px) { .qc-menu li { min-height:40px; } .qc-menu .qc-desc { white-space:normal; } }`;
+  document.head.appendChild(css);
+})();