citadel_cli 1.1.7 → 1.4.0

package/dist/citadel.es.js

@@ -1,13 +1,13 @@
-var ye = Object.defineProperty;
-var xe = (r, e, n) => e in r ? ye(r, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : r[e] = n;
-var b = (r, e, n) => xe(r, typeof e != "symbol" ? e + "" : e, n);
-import { jsx as m, jsxs as N, Fragment as ve } from "react/jsx-runtime";
-import O, { createContext as Ce, useState as R, useEffect as A, useMemo as D, useContext as Y, useCallback as y, useReducer as Se, useRef as H } from "react";
-import { createRoot as ke } from "react-dom/client";
-var F = /* @__PURE__ */ ((r) => (r.Pending = "pending", r.Success = "success", r.Failure = "failure", r.Timeout = "timeout", r))(F || {});
-class T {
+var Ae = Object.defineProperty;
+var Pe = (n, e, t) => e in n ? Ae(n, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[e] = t;
+var f = (n, e, t) => Pe(n, typeof e != "symbol" ? e + "" : e, t);
+import { jsx as m, jsxs as I, Fragment as He } from "react/jsx-runtime";
+import U, { createContext as Re, useState as _, useMemo as A, useEffect as P, useContext as Q, useCallback as w, useReducer as _e, useRef as z, useLayoutEffect as Me } from "react";
+import { createRoot as Te } from "react-dom/client";
+var q = /* @__PURE__ */ ((n) => (n.Pending = "pending", n.Success = "success", n.Failure = "failure", n.Timeout = "timeout", n))(q || {});
+class W {
   constructor(e = Date.now()) {
-    b(this, "_status", "pending");
+    f(this, "_status", "pending");
     this.timestamp = e;
   }
   get status() {
@@ -23,71 +23,80 @@ class T {
     this._status = "timeout";
   }
 }
-class ln extends T {
-  constructor(e, n) {
-    super(n), this.data = e;
+class ze extends W {
+  constructor(e, t) {
+    super(t), this.data = e;
   }
   render() {
-    return /* @__PURE__ */ m("pre", { className: "text-gray-200", children: JSON.stringify(this.data, null, 2) });
+    return /* @__PURE__ */ m("pre", { className: "citadel-result-json", children: JSON.stringify(this.data, null, 2) });
   }
 }
-class G extends T {
-  constructor(e, n) {
-    super(n), this.text = e;
+class Y extends W {
+  constructor(e, t) {
+    super(t), this.text = e;
   }
   render() {
-    return /* @__PURE__ */ m("div", { className: "text-gray-200 whitespace-pre font-mono", children: this.text });
+    return /* @__PURE__ */ m("div", { className: "citadel-result-text", children: this.text });
   }
 }
-class Ne extends T {
-  constructor(e, n) {
-    super(n), this.error = e, this.markFailure();
+class we extends W {
+  constructor(e, t) {
+    super(t), this.error = e, this.markFailure();
   }
   render() {
-    return /* @__PURE__ */ m("div", { className: "mt-1 text-red-400", children: this.error });
+    return /* @__PURE__ */ m("div", { className: "citadel-result-error", children: this.error });
   }
 }
-class Ee extends T {
+class De extends W {
   render() {
-    return /* @__PURE__ */ m("div", { className: "text-gray-400", children: "..." });
+    return /* @__PURE__ */ m("div", { className: "citadel-result-pending", children: "..." });
   }
 }
-class cn extends T {
-  constructor(e, n = "", t) {
-    super(t), this.imageUrl = e, this.altText = n;
+class Fe extends W {
+  constructor(e, t = "", s) {
+    super(s), this.imageUrl = e, this.altText = t;
   }
   render() {
-    return /* @__PURE__ */ m("div", { className: "my-2", children: /* @__PURE__ */ m(
+    return /* @__PURE__ */ m("div", { className: "citadel-result-image-wrap", children: /* @__PURE__ */ m(
       "img",
       {
         src: this.imageUrl,
         alt: this.altText,
-        className: "max-w-[400px] max-h-[300px] h-auto rounded-lg object-contain"
+        className: "citadel-result-image"
       }
     ) });
   }
 }
-const _e = (r) => async function() {
-  const e = r.commands.filter((n) => n.fullPath[0] !== "help").map((n) => `${n.segments.map((o) => o.type === "argument" ? `<${o.name}>` : o.name).join(" ")} - ${n.description}`).sort();
-  return e.length === 0 ? new G(
+const Le = (n) => async function() {
+  const t = n.commands.filter((s) => s.fullPath[0] !== "help").map((s) => {
+    const a = `${s.segments.map((c) => c.type === "argument" ? `<${c.name}>` : c.name).join(" ")} - ${s.description}`, o = s.segments.filter((c) => c.type === "argument" && c.description).map((c) => `  <${c.name}>: ${c.description}`);
+    return {
+      commandLine: a,
+      argumentLines: o
+    };
+  }).sort((s, r) => s.commandLine.localeCompare(r.commandLine)).flatMap((s) => [
+    s.commandLine,
+    ...s.argumentLines
+  ]);
+  return t.length === 0 ? new Y(
     "No commands available yet. Add some commands to get started!"
-  ) : (e.push("help - Show available commands"), new G(
+  ) : (t.push("help - Show available commands"), new Y(
     `Available Commands:
-` + e.join(`
+` + t.join(`
 `)
   ));
 };
-var Q = /* @__PURE__ */ ((r) => (r[r.NONE = 0] = "NONE", r[r.ERROR = 1] = "ERROR", r[r.WARN = 2] = "WARN", r[r.INFO = 3] = "INFO", r[r.DEBUG = 4] = "DEBUG", r[r.TRACE = 5] = "TRACE", r))(Q || {});
-const ne = !0;
-class C {
+var ie = /* @__PURE__ */ ((n) => (n[n.NONE = 0] = "NONE", n[n.ERROR = 1] = "ERROR", n[n.WARN = 2] = "WARN", n[n.INFO = 3] = "INFO", n[n.DEBUG = 4] = "DEBUG", n[n.TRACE = 5] = "TRACE", n))(ie || {});
+const ue = !0;
+class k {
   static configure(e) {
     this.level = e.level, this.prefix = e.prefix || "[Citadel]";
   }
   static trace(...e) {
-    this.level >= 5 && !ne && console.trace(this.prefix, ...e);
+    this.level >= 5 && !ue && console.trace(this.prefix, ...e);
   }
   static debug(...e) {
-    this.level >= 4 && !ne && console.debug(this.prefix, ...e);
+    this.level >= 4 && !ue && console.debug(this.prefix, ...e);
   }
   static info(...e) {
     this.level >= 3 && console.info(this.prefix, ...e);
@@ -99,15 +108,17 @@ class C {
     this.level >= 1 && console.error(this.prefix, ...e);
   }
 }
-b(C, "level", 0), b(C, "prefix", "");
-const _ = {
+f(k, "level", 0), f(k, "prefix", "");
+const N = {
   commandTimeoutMs: 1e4,
   cursorColor: "var(--cursor-color, #fff)",
   cursorSpeed: 530,
   cursorType: "blink",
   includeHelpCommand: !0,
-  initialHeight: "40vh",
-  logLevel: Q.ERROR,
+  fontFamily: "monospace",
+  fontSize: "0.875rem",
+  initialHeight: "50vh",
+  logLevel: ie.ERROR,
   maxHeight: "80vh",
   minHeight: "200",
   outputFontSize: "0.875rem",
@@ -118,138 +129,51 @@ const _ = {
     type: "localStorage",
     maxCommands: 100
   }
-};
-class de {
-  constructor(e) {
-    b(this, "config");
-    this.config = {
-      type: "localStorage",
-      maxCommands: 100,
-      ...e
-    };
-  }
-  /**
-   * Add a command to history, enforcing storage limits
-   */
-  async addStoredCommand(e) {
-    const n = await this.getStoredCommands();
-    for (n.push(e); n.length > this.config.maxCommands; )
-      n.shift();
-    await this.saveCommands(n);
-  }
-}
-class Ae extends de {
-  constructor(n) {
-    super(n);
-    b(this, "storageKey", "citadel_command_history");
-  }
-  async getStoredCommands() {
-    try {
-      const n = window.localStorage.getItem(this.storageKey);
-      return n ? JSON.parse(n).map((o) => ({
-        commandSegments: o.commandSegments || [],
-        timestamp: o.timestamp
-      })) : [];
-    } catch (n) {
-      return console.warn("Failed to load commands from localStorage:", n), [];
-    }
-  }
-  async clear() {
-    try {
-      window.localStorage.removeItem(this.storageKey);
-    } catch (n) {
-      console.warn("Failed to clear localStorage:", n);
-    }
-  }
-  async saveCommands(n) {
-    try {
-      const t = n.map((o) => ({
-        commandSegments: Array.isArray(o.commandSegments) ? [...o.commandSegments] : [],
-        timestamp: o.timestamp
-      }));
-      window.localStorage.setItem(this.storageKey, JSON.stringify(t));
-    } catch (t) {
-      throw console.warn("Failed to save commands to localStorage:", t), t;
-    }
-  }
-}
-class te extends de {
-  constructor(n) {
-    super(n);
-    b(this, "storedCommands", []);
-  }
-  async getStoredCommands() {
-    return this.storedCommands.map((n) => ({
-      commandSegments: Array.isArray(n.commandSegments) ? [...n.commandSegments] : [],
-      timestamp: n.timestamp
-    }));
-  }
-  async clear() {
-    this.storedCommands = [];
-  }
-  async saveCommands(n) {
-    this.storedCommands = n.map((t) => ({
-      commandSegments: Array.isArray(t.commandSegments) ? [...t.commandSegments] : [],
-      timestamp: t.timestamp
-    }));
-  }
-}
-const P = class P {
-  constructor() {
-    b(this, "currentStorage");
-  }
-  static reset() {
-    P.instance = void 0;
-  }
-  static getInstance() {
-    return P.instance || (P.instance = new P()), P.instance;
-  }
-  initializeStorage(e) {
-    try {
-      e.type === "memory" ? this.currentStorage = new te(e) : this.currentStorage = new Ae(e);
-    } catch (n) {
-      console.warn("Failed to create storage, falling back to memory storage:", n), this.currentStorage = new te(e);
-    }
-  }
-  getStorage() {
-    if (!this.currentStorage)
-      throw new Error("Storage not initialized. Call initializeStorage first.");
-    return this.currentStorage;
-  }
-};
-b(P, "instance");
-let q = P;
-const me = async () => new G("");
-class X {
-  constructor(e, n, t) {
-    this.type = e, this.name = n, this.description = t;
+}, Ce = async () => new Y("");
+class ce {
+  constructor(e, t, s) {
+    this.type = e, this.name = t, this.description = s;
   }
   toString() {
     return this.name;
   }
 }
-class ue extends X {
+class le extends ce {
   constructor() {
     super("null", ">null<", "Empty segment");
   }
 }
-class ze extends X {
-  constructor(e, n) {
-    super("word", e, n);
+class ve extends ce {
+  constructor(e, t) {
+    super("word", e, t);
   }
 }
-class W extends X {
-  constructor(e, n, t, o) {
-    super("argument", e, n), this.value = t, this.valid = o;
+class O extends ce {
+  constructor(e, t, s, r) {
+    super("argument", e, t), this.value = s, this.valid = r;
   }
 }
-class Ie {
-  constructor(e, n, t = me) {
-    b(this, "_segments");
-    b(this, "_description");
+const $e = (n) => {
+  if (n.type === "word")
+    return new ve(n.name, n.description);
+  if (n.type === "argument") {
+    const e = n;
+    return new O(
+      e.name,
+      e.description,
+      e.value,
+      e.valid
+    );
+  }
+  return new le();
+}, D = (n) => n.map((e) => $e(e));
+class je {
+  constructor(e, t, s = Ce) {
+    f(this, "_segments");
+    f(this, "_description");
     // Used by `Help` command, etc.
-    b(this, "_handler");
-    this._segments = e, this._description = n, this._handler = t;
+    f(this, "_handler");
+    this._segments = e, this._description = t, this._handler = s;
   }
   get segments() {
     return this._segments;
@@ -273,9 +197,9 @@ class Ie {
     return this.fullPath.join(" ") === e.fullPath.join(" ");
   }
 }
-class Z {
+class X {
   constructor() {
-    b(this, "_commands", []);
+    f(this, "_commands", []);
   }
   get commands() {
     return this._commands;
@@ -291,20 +215,20 @@ class Z {
    * @param handler Async handler executed when the command is submitted; defaults to `NoopHandler`.
    * @throws {Error} If the segment list is empty or the path collides with an existing command.
    */
-  addCommand(e, n, t = me) {
+  addCommand(e, t, s = Ce) {
     if (e === void 0 || e.length === 0)
       throw new Error("Command path cannot be empty");
-    const o = new Ie(e, n, t), a = this._commands.find((i) => {
-      const c = i.segments.map(
-        (l) => l.type === "argument" ? "*" : l.name
-      ).join(" "), s = e.map(
-        (l) => l.type === "argument" ? "*" : l.name
+    const r = new je(e, t, s), a = this._commands.find((o) => {
+      const c = o.segments.map(
+        (d) => d.type === "argument" ? "*" : d.name
+      ).join(" "), i = e.map(
+        (d) => d.type === "argument" ? "*" : d.name
       ).join(" ");
-      return c === s;
+      return c === i;
     });
     if (a)
-      throw new Error(`Duplicate commands: '${a.fullPath_s}' and '${o.fullPath_s}'`);
-    this._commands.push(o);
+      throw new Error(`Duplicate commands: '${a.fullPath_s}' and '${r.fullPath_s}'`);
+    this._commands.push(r);
   }
   /**
    * Removes a command that exactly matches the provided path.
@@ -313,8 +237,8 @@ class Z {
    * @returns True if a command was removed; otherwise false.
    */
   removeCommand(e) {
-    const n = e.join(" "), t = this._commands.findIndex((o) => o.fullPath.join(" ") === n);
-    return t === -1 ? !1 : (this._commands.splice(t, 1), !0);
+    const t = e.join(" "), s = this._commands.findIndex((r) => r.fullPath.join(" ") === t);
+    return s === -1 ? !1 : (this._commands.splice(s, 1), !0);
   }
   /**
    * Retrieves a command from the registry for the given path.
@@ -323,26 +247,26 @@ class Z {
    * @returns The command node or undefined if not found.
    */
   getCommand(e) {
-    return this._commands.find((n) => {
-      const t = n.fullPath.join(" "), o = e.join(" ");
-      if (t === o)
+    return this._commands.find((t) => {
+      const s = t.fullPath.join(" "), r = e.join(" ");
+      if (s === r)
         return !0;
-      const i = n.segments.filter((c) => c.type === "word").map((c) => c.name);
-      return i.length === e.length && i.join(" ") === o;
+      const o = t.segments.filter((c) => c.type === "word").map((c) => c.name);
+      return o.length === e.length && o.join(" ") === r;
     });
   }
   commandExistsForPath(e) {
-    const n = this._commands.map(
-      (o) => o.segments.map(
+    const t = this._commands.map(
+      (r) => r.segments.map(
         (a) => a.type === "argument" ? "*" : a.name
       ).join(" ")
-    ), t = e.map((o, a) => this._commands.some(
+    ), s = e.map((r, a) => this._commands.some(
       (c) => {
-        var s;
-        return ((s = c.segments[a]) == null ? void 0 : s.type) === "argument";
+        var i;
+        return ((i = c.segments[a]) == null ? void 0 : i.type) === "argument";
       }
-    ) ? "*" : o).join(" ");
-    return n.includes(t);
+    ) ? "*" : r).join(" ");
+    return t.includes(s);
   }
   /**
    * Gets possible matches for a given path.
@@ -351,7 +275,26 @@ class Z {
    * @returns An array of completion strings.
    */
   getCompletionNames(e) {
-    return this.getCompletions(e).map((n) => n.name);
+    return this.getCompletions(e).map((t) => t.name);
+  }
+  /**
+   * Returns completion segments whose names start with the given prefix.
+   * Matching is case-insensitive.
+   */
+  getMatchingCompletions(e, t) {
+    const s = t.trim().toLowerCase(), r = this.getCompletions(e);
+    return s ? r.filter(
+      (a) => a.name.toLowerCase().startsWith(s)
+    ) : r;
+  }
+  /**
+   * Returns a single completion when prefix matching is unambiguous.
+   * Returns undefined for ambiguous or no-match prefixes.
+   */
+  getUniqueCompletion(e, t) {
+    const s = this.getMatchingCompletions(e, t);
+    if (s.length === 1)
+      return s[0];
   }
   /**
    * Gets an array of segments reachable from a given path
@@ -360,29 +303,29 @@ class Z {
    * @returns An array of completion strings.
    */
   getCompletions(e) {
-    if (C.debug("[getCompletions] path: ", e), !e.length) {
-      const a = this._commands.map((s) => s.segments[0]), i = (s, l) => s.type === l.type && s.name === l.name;
+    if (k.debug("[getCompletions] path: ", e), !e.length) {
+      const a = this._commands.map((i) => i.segments[0]), o = (i, d) => i.type === d.type && i.name === d.name;
       return a.filter(
-        (s, l, h) => l === h.findIndex((p) => i(p, s))
+        (i, d, g) => d === g.findIndex((u) => o(u, i))
       );
     }
-    const n = e.length;
+    const t = e.length;
     return this._commands.filter((a) => {
-      const i = a.segments;
-      if (i.length <= n - 1)
+      const o = a.segments;
+      if (o.length <= t - 1)
         return !1;
-      for (let c = 0; c < n; c++) {
-        const s = e[c], l = i[c];
-        if (!(s === "*" && l.type === "argument") && s !== l.name)
+      for (let c = 0; c < t; c++) {
+        const i = e[c], d = o[c];
+        if (!(i === "*" && d.type === "argument") && i !== d.name)
           return !1;
       }
       return !0;
-    }).filter((a) => a.segments.length > n).map((a) => {
-      const i = a.segments[n], c = i.type === "argument" ? W : ze;
-      return new c(i.name, i.description);
+    }).filter((a) => a.segments.length > t).map((a) => {
+      const o = a.segments[t], c = o.type === "argument" ? O : ve;
+      return new c(o.name, o.description);
     }).filter(
-      (a, i, c) => i === c.findIndex(
-        (s) => s.type === a.type && s.name === a.name
+      (a, o, c) => o === c.findIndex(
+        (i) => i.type === a.type && i.name === a.name
       )
     );
   }
@@ -390,17 +333,122 @@ class Z {
     return this.getCompletions(e).length > 0;
   }
 }
-class he {
+class Se {
+  constructor(e) {
+    f(this, "config");
+    this.config = {
+      type: "localStorage",
+      maxCommands: 100,
+      ...e
+    };
+  }
+  /**
+   * Add a command to history, enforcing storage limits
+   */
+  async addStoredCommand(e) {
+    const t = await this.getStoredCommands();
+    for (t.push(e); t.length > this.config.maxCommands; )
+      t.shift();
+    await this.saveCommands(t);
+  }
+}
+class Ue extends Se {
+  constructor(t) {
+    super(t);
+    f(this, "storageKey", "citadel_command_history");
+  }
+  async getStoredCommands() {
+    try {
+      const t = window.localStorage.getItem(this.storageKey);
+      return t ? JSON.parse(t).map((r) => ({
+        commandSegments: Array.isArray(r.commandSegments) ? D(r.commandSegments) : [],
+        timestamp: r.timestamp
+      })) : [];
+    } catch (t) {
+      return console.warn("Failed to load commands from localStorage:", t), [];
+    }
+  }
+  async clear() {
+    try {
+      window.localStorage.removeItem(this.storageKey);
+    } catch (t) {
+      console.warn("Failed to clear localStorage:", t);
+    }
+  }
+  async saveCommands(t) {
+    try {
+      const s = t.map((r) => ({
+        commandSegments: Array.isArray(r.commandSegments) ? D(r.commandSegments).map((a) => ({
+          type: a.type,
+          name: a.name,
+          description: a.description,
+          ...a instanceof O ? { value: a.value } : {}
+        })) : [],
+        timestamp: r.timestamp
+      }));
+      window.localStorage.setItem(this.storageKey, JSON.stringify(s));
+    } catch (s) {
+      throw console.warn("Failed to save commands to localStorage:", s), s;
+    }
+  }
+}
+class pe extends Se {
+  constructor(t) {
+    super(t);
+    f(this, "storedCommands", []);
+  }
+  async getStoredCommands() {
+    return this.storedCommands.map((t) => ({
+      commandSegments: Array.isArray(t.commandSegments) ? D(t.commandSegments) : [],
+      timestamp: t.timestamp
+    }));
+  }
+  async clear() {
+    this.storedCommands = [];
+  }
+  async saveCommands(t) {
+    this.storedCommands = t.map((s) => ({
+      commandSegments: Array.isArray(s.commandSegments) ? D(s.commandSegments) : [],
+      timestamp: s.timestamp
+    }));
+  }
+}
+const $ = class $ {
+  constructor() {
+    f(this, "currentStorage");
+  }
+  static reset() {
+    $.instance = void 0;
+  }
+  static getInstance() {
+    return $.instance || ($.instance = new $()), $.instance;
+  }
+  initializeStorage(e) {
+    try {
+      e.type === "memory" ? this.currentStorage = new pe(e) : this.currentStorage = new Ue(e);
+    } catch (t) {
+      console.warn("Failed to create storage, falling back to memory storage:", t), this.currentStorage = new pe(e);
+    }
+  }
+  getStorage() {
+    if (!this.currentStorage)
+      throw new Error("Storage not initialized. Call initializeStorage first.");
+    return this.currentStorage;
+  }
+};
+f($, "instance");
+let J = $;
+class xe {
   constructor() {
-    b(this, "segments", []);
-    b(this, "nullSegment", new ue());
-    b(this, "observers", []);
+    f(this, "segments", []);
+    f(this, "nullSegment", new le());
+    f(this, "observers", []);
   }
   subscribe(e) {
     this.observers.push(e);
   }
   unsubscribe(e) {
-    this.observers = this.observers.filter((n) => n !== e);
+    this.observers = this.observers.filter((t) => t !== e);
   }
   notifyObservers() {
     this.observers.forEach((e) => e.update());
@@ -421,7 +469,7 @@ class he {
    * Pushes an array of segments onto the stack
    */
   pushAll(e) {
-    e.forEach((n) => this.push(n));
+    e.forEach((t) => this.push(t));
   }
   /**
    * Removes and returns the top segment from the stack
@@ -477,367 +525,411 @@ class he {
     return [...this.segments];
   }
 }
-const Re = {
-  config: _,
-  commands: new Z(),
-  segmentStack: new he()
-}, L = Ce(Re), Pe = ({ config: r = _, commandRegistry: e, children: n }) => {
-  const [t, o] = O.useState(), [a] = R(() => new he()), i = {
-    ..._,
-    ...r,
+const Oe = {
+  config: N,
+  commands: new X(),
+  segmentStack: new xe()
+}, B = Re(Oe), We = ({ config: n = N, commandRegistry: e, children: t }) => {
+  const [s, r] = U.useState(), [a] = _(() => new xe()), o = A(() => ({
+    ...N,
+    ...n,
     // Ensure nested objects are properly merged
     storage: {
-      ..._.storage,
-      ...r.storage
+      ...N.storage,
+      ...n.storage
     },
     // Ensure explicit values from config take precedence
-    cursorType: r.cursorType ?? _.cursorType,
-    cursorColor: r.cursorColor ?? _.cursorColor,
-    cursorSpeed: r.cursorSpeed ?? _.cursorSpeed,
-    showCitadelKey: r.showCitadelKey || "."
-  };
-  A(() => {
-    q.getInstance().initializeStorage(
-      i.storage ?? _.storage
-    ), o(q.getInstance().getStorage());
-  }, []), A(() => {
+    cursorType: n.cursorType ?? N.cursorType,
+    cursorColor: n.cursorColor ?? N.cursorColor,
+    cursorSpeed: n.cursorSpeed ?? N.cursorSpeed,
+    showCitadelKey: n.showCitadelKey || "."
+  }), [n]);
+  P(() => {
+    J.getInstance().initializeStorage(
+      o.storage ?? N.storage
+    ), r(J.getInstance().getStorage());
+  }, [o.storage]), P(() => {
     if (e) {
-      if (i.includeHelpCommand) {
+      if (o.includeHelpCommand) {
         if (!e.commandExistsForPath(["help"])) {
-          const s = _e(e);
+          const i = Le(e);
           e.addCommand(
             [{ type: "word", name: "help" }],
             "Show available commands",
-            s
+            i
           );
         }
         return;
       }
       e.removeCommand(["help"]);
     }
-  }, [e, i.includeHelpCommand]);
-  const c = D(() => ({
-    config: i,
-    commands: e || new Z(),
-    storage: t,
+  }, [e, o.includeHelpCommand]);
+  const c = A(() => ({
+    config: o,
+    commands: e || new X(),
+    storage: s,
     segmentStack: a
-  }), [i, e, t, a]);
-  return /* @__PURE__ */ m(L.Provider, { value: c, children: n });
-}, $ = () => {
-  const r = Y(L);
-  if (r === void 0)
+  }), [o, e, s, a]);
+  return /* @__PURE__ */ m(B.Provider, { value: c, children: t });
+}, j = () => {
+  const n = Q(B);
+  if (n === void 0)
     throw new Error("useCitadelConfig must be used within a CitadelConfigProvider");
-  return r.config;
-}, B = () => {
-  const r = Y(L);
-  if (r === void 0)
+  return n.config;
+}, Z = () => {
+  const n = Q(B);
+  if (n === void 0)
     throw new Error("useCitadelCommands must be used within a CitadelConfigProvider");
-  return r.commands;
-}, pe = () => {
-  const r = Y(L);
-  if (r === void 0)
+  return n.commands;
+}, be = () => {
+  const n = Q(B);
+  if (n === void 0)
     throw new Error("useCitadelStorage must be used within a CitadelConfigProvider");
-  return r.storage;
-}, K = () => {
-  const r = Y(L);
-  if (r === void 0)
+  return n.storage;
+}, V = () => {
+  const n = Q(B);
+  if (n === void 0)
     throw new Error("useSegmentStack must be used within a CitadelConfigProvider");
-  return r.segmentStack;
-}, V = class V {
-  constructor(e, n) {
-    b(this, "id");
-    b(this, "timestamp");
-    b(this, "command");
-    b(this, "result");
-    this.id = `output-${Date.now()}-${V.idCounter++}`, this.command = e.toArray().map((t) => t.type === "argument" ? t.value || "" : t.name), this.timestamp = Date.now(), this.result = n ?? new Ee();
+  return n.segmentStack;
+}, G = class G {
+  constructor(e, t) {
+    f(this, "id");
+    f(this, "timestamp");
+    f(this, "command");
+    f(this, "result");
+    this.id = `output-${Date.now()}-${G.idCounter++}`, this.command = e.toArray().map((s) => s.type === "argument" ? s.value || "" : s.name), this.timestamp = Date.now(), this.result = t ?? new De();
   }
 };
-b(V, "idCounter", 0);
-let J = V;
-function He(r) {
+f(G, "idCounter", 0);
+let oe = G;
+function Ke(n) {
   return {
-    commandSegments: r,
+    commandSegments: D(n),
     timestamp: Date.now()
   };
 }
-function ge() {
-  const r = pe(), [e, n] = R({
+function ke() {
+  const n = be(), [e, t] = _({
     storedCommands: [],
     position: null
-  }), t = y(async (c) => {
-    if (r)
+  }), s = w(async (c) => {
+    if (n)
       try {
-        const s = He(c);
-        await r.addStoredCommand(s), n((l) => ({
-          ...l,
-          storedCommands: [...l.storedCommands, s],
+        const i = Ke(c);
+        await n.addStoredCommand(i), t((d) => ({
+          ...d,
+          storedCommands: [...d.storedCommands, {
+            ...i,
+            commandSegments: D(i.commandSegments)
+          }],
           position: null
         }));
-      } catch (s) {
-        console.warn("Failed to save command to history:", s);
+      } catch (i) {
+        console.warn("Failed to save command to history:", i);
       }
-  }, [r]), o = y(async () => r ? await r.getStoredCommands() : [], [r]);
-  A(() => {
-    if (!r) return;
+  }, [n]), r = w(async () => n ? (await n.getStoredCommands()).map((i) => ({
+    ...i,
+    commandSegments: D(i.commandSegments)
+  })) : [], [n]);
+  P(() => {
+    if (!n) return;
     (async () => {
       try {
-        const s = await r.getStoredCommands();
-        return n((l) => ({
-          ...l,
-          storedCommands: s
-        })), s;
-      } catch (s) {
-        console.warn("Failed to load command history:", s);
+        const d = (await n.getStoredCommands()).map((g) => ({
+          ...g,
+          commandSegments: D(g.commandSegments)
+        }));
+        return t((g) => ({
+          ...g,
+          storedCommands: d
+        })), d;
+      } catch (i) {
+        console.warn("Failed to load command history:", i);
       }
     })();
-  }, [r]);
-  const a = y(async (c) => {
-    const s = await o();
-    if (s.length === 0)
-      return n((p) => ({
-        ...p,
+  }, [n]);
+  const a = w(async (c) => {
+    const i = await r();
+    if (i.length === 0)
+      return t((u) => ({
+        ...u,
         storedCommands: [],
         position: null
       })), { segments: null, position: null };
-    let l = null;
-    if (c === "up" ? e.position === null ? l = s.length - 1 : e.position > 0 ? l = e.position - 1 : l = 0 : e.position === null || e.position >= s.length - 1 ? l = null : l = e.position + 1, n((p) => ({
-      ...p,
-      storedCommands: s,
-      position: l
-    })), l === null)
+    let d = null;
+    if (c === "up" ? e.position === null ? d = i.length - 1 : e.position > 0 ? d = e.position - 1 : d = 0 : e.position === null || e.position >= i.length - 1 ? d = null : d = e.position + 1, t((u) => ({
+      ...u,
+      storedCommands: i.map((h) => ({
+        ...h,
+        commandSegments: D(h.commandSegments)
+      })),
+      position: d
+    })), d === null)
       return {
         segments: [],
         position: null
       };
-    const h = s[l];
-    return h ? {
-      segments: h.commandSegments,
-      position: l
+    const g = i[d];
+    return g ? {
+      segments: D(g.commandSegments),
+      position: d
     } : {
       segments: [],
       position: null
     };
-  }, [e.position, o]), i = y(async () => {
+  }, [e.position, r]), o = w(async () => {
     try {
-      if (!r) return;
-      await r.clear(), n({
+      if (!n) return;
+      await n.clear(), t({
         storedCommands: [],
         position: null
       });
     } catch (c) {
       console.warn("Failed to clear command history:", c);
     }
-  }, [r]);
+  }, [n]);
   return {
     history: e,
-    addStoredCommand: t,
-    getStoredCommands: o,
+    addStoredCommand: s,
+    getStoredCommands: r,
     navigateHistory: a,
-    clear: i
+    clear: o
   };
 }
-const ee = () => {
-  const r = $(), e = B(), n = ge(), t = K(), o = pe(), [a, i] = R({
+const de = () => {
+  const n = j(), e = Z(), t = ke(), s = V(), r = be(), [a, o] = _({
     currentInput: "",
     isEnteringArg: !1,
     output: [],
     history: {
       commands: [],
       position: null,
-      storage: o
+      storage: r
     }
   });
-  A(() => {
-  }, [o]), A(() => {
-    i((s) => ({
-      ...s,
+  P(() => {
+  }, [r]), P(() => {
+    o((i) => ({
+      ...i,
       history: {
-        commands: n.history.storedCommands,
-        position: n.history.position,
-        storage: o
+        commands: t.history.storedCommands,
+        position: t.history.position,
+        storage: r
       }
     }));
-  }, [n.history, o]);
+  }, [t.history, r]);
   const c = {
-    setCurrentInput: y((s) => {
-      C.debug("[CitadelActions] setCurrentInput: ", s), i((l) => ({ ...l, currentInput: s }));
+    setCurrentInput: w((i) => {
+      k.debug("[CitadelActions] setCurrentInput: ", i), o((d) => ({ ...d, currentInput: i }));
     }, []),
-    setIsEnteringArg: y((s) => {
-      C.debug("[CitadelActions] setIsEnteringArg: ", s), i((l) => ({ ...l, isEnteringArg: s }));
+    setIsEnteringArg: w((i) => {
+      k.debug("[CitadelActions] setIsEnteringArg: ", i), o((d) => ({ ...d, isEnteringArg: i }));
     }, []),
-    addOutput: y((s) => {
-      C.debug("[CitadelActions]addOutput: ", s), i((l) => ({
-        ...l,
-        output: [...l.output, s]
+    addOutput: w((i) => {
+      k.debug("[CitadelActions]addOutput: ", i), o((d) => ({
+        ...d,
+        output: [...d.output, i]
       }));
     }, []),
-    executeCommand: y(async () => {
-      const s = t.path(), l = e.getCommand(s);
-      if (!l) {
-        console.error("[CitadelActions][executeCommand] Cannot execute command because no command was found for the given path: ", s);
+    executeCommand: w(async () => {
+      const i = s.path(), d = e.getCommand(i);
+      if (!d) {
+        console.error("[CitadelActions][executeCommand] Cannot execute command because no command was found for the given path: ", i);
         return;
       }
-      const h = new J(t);
-      i((p) => ({
-        ...p,
-        output: [...p.output, h]
+      const g = new oe(s);
+      o((u) => ({
+        ...u,
+        output: [...u.output, g]
       }));
       try {
-        const p = new Promise((u, k) => {
+        const u = new Promise((y, v) => {
           setTimeout(() => {
-            k(new Error("Request timed out"));
-          }, r.commandTimeoutMs);
-        }), S = t.arguments.map((u) => u.value || ""), v = await Promise.race([
-          l.handler(S),
-          p
+            v(new Error("Request timed out"));
+          }, n.commandTimeoutMs);
+        }), h = s.arguments.map((y) => y.value || ""), x = await Promise.race([
+          d.handler(h),
+          u
         ]);
-        if (!(v instanceof T))
+        if (!(x instanceof W))
           throw new Error(
-            `The ${s.join(".")} command returned an invalid result type. Commands must return an instance of a CommandResult.
+            `The ${i.join(".")} command returned an invalid result type. Commands must return an instance of a CommandResult.
 For example:
    return new JsonCommandResult({ text: "Hello World" });
-Check the definition of the ${s.join(".")} command and update the return type for its handler.`
+Check the definition of the ${i.join(".")} command and update the return type for its handler.`
           );
-        v.markSuccess(), i((u) => ({
-          ...u,
-          output: u.output.map(
-            (k) => k.id === h.id ? { ...k, result: v } : k
+        x.markSuccess(), o((y) => ({
+          ...y,
+          output: y.output.map(
+            (v) => v.id === g.id ? { ...v, result: x } : v
           )
         }));
-      } catch (p) {
-        const S = new Ne(
-          p instanceof Error ? p.message : "Unknown error"
+      } catch (u) {
+        const h = new we(
+          u instanceof Error ? u.message : "Unknown error"
         );
-        S.markFailure(), i((v) => ({
-          ...v,
-          output: v.output.map(
-            (u) => u.id === h.id ? { ...u, result: S } : u
+        h.markFailure(), o((x) => ({
+          ...x,
+          output: x.output.map(
+            (y) => y.id === g.id ? { ...y, result: h } : y
           )
         }));
       }
-    }, [e, r.commandTimeoutMs, t]),
-    clearHistory: y(async () => {
+    }, [e, n.commandTimeoutMs, s]),
+    clearHistory: w(async () => {
       try {
-        await n.clear();
-      } catch (s) {
-        console.warn("Failed to clear history:", s);
+        await t.clear();
+      } catch (i) {
+        console.warn("Failed to clear history:", i);
       }
-    }, [n])
+    }, [t])
   };
   return { state: a, actions: c };
-}, Me = ({ onOpen: r, onClose: e, isVisible: n, showCitadelKey: t }) => {
-  A(() => {
-    const o = (a) => {
-      var i, c;
-      !n && a.key === t && !["input", "textarea"].includes(((c = (i = a.target) == null ? void 0 : i.tagName) == null ? void 0 : c.toLowerCase()) || "") && (a.preventDefault(), r()), n && a.key === "Escape" && (a.preventDefault(), e());
+}, qe = ({ onOpen: n, onClose: e, isVisible: t, showCitadelKey: s }) => {
+  P(() => {
+    const r = (a) => {
+      var o, c;
+      !t && a.key === s && !["input", "textarea"].includes(((c = (o = a.target) == null ? void 0 : o.tagName) == null ? void 0 : c.toLowerCase()) || "") && (a.preventDefault(), n()), t && a.key === "Escape" && (a.preventDefault(), e());
     };
-    return document.addEventListener("keydown", o), () => document.removeEventListener("keydown", o);
-  }, [r, e, n, t]);
-}, De = "_panelContainer_1pav9_3", Te = "_innerContainer_1pav9_19", Ue = "_inputSection_1pav9_29", je = "_resizeHandle_1pav9_36", Fe = "_citadel_slideUp_1pav9_65", Oe = "_citadel_slideDown_1pav9_69", Le = "_inlineContainer_1pav9_73", re = {
-  panelContainer: De,
-  innerContainer: Te,
-  inputSection: Ue,
-  resizeHandle: je,
-  citadel_slideUp: Fe,
-  citadel_slideDown: Oe,
-  inlineContainer: Le
-}, $e = (r) => {
-  const { isVisible: e, isClosing: n, onAnimationComplete: t } = r, o = D(() => e ? n ? re.slideDown : re.slideUp : "", [e, n]);
-  return A(() => {
-    if (t) {
-      const i = setTimeout(() => {
-        t();
+    return document.addEventListener("keydown", r), () => document.removeEventListener("keydown", r);
+  }, [n, e, t, s]);
+}, Be = (n) => {
+  const { isVisible: e, isClosing: t, onAnimationComplete: s } = n, r = A(() => e ? t ? "citadel_slideDown" : "citadel_slideUp" : "", [e, t]);
+  return P(() => {
+    if (s) {
+      const o = setTimeout(() => {
+        s();
       }, 200);
-      return () => clearTimeout(i);
+      return () => clearTimeout(o);
     }
-  }, [n, t]), {
-    style: D(() => ({
+  }, [t, s]), {
+    style: A(() => ({
       opacity: e ? 1 : 0,
-      transform: e ? "translateY(0)" : n ? "translateY(100%)" : "translateY(-100%)",
+      transform: e ? "translateY(0)" : t ? "translateY(100%)" : "translateY(-100%)",
       transition: "opacity 200ms ease-in-out, transform 200ms ease-in-out"
-    }), [e, n]),
-    animationClass: o
+    }), [e, t]),
+    animationClass: r
   };
-}, Ke = () => /* @__PURE__ */ m(
+}, Ve = () => /* @__PURE__ */ m(
   "div",
   {
     "data-testid": "spinner",
-    className: "animate-spin rounded-full h-4 w-4 border-2 border-gray-300 border-t-gray-600"
-  }
-), We = ({
-  command: r,
+    className: "citadel-spinner"
+  }
+), Ee = (n) => {
+  const e = n == null ? void 0 : n.trim();
+  return e || void 0;
+}, Ye = (n) => {
+  const e = Ee(n);
+  return e ? { style: { fontSize: e } } : {};
+}, ee = (n, e) => {
+  const t = Ee(n), r = {
+    ...Ye(e).style
+  };
+  return t && (r.fontFamily = t), {
+    style: Object.keys(r).length > 0 ? r : void 0
+  };
+}, Je = ({
+  command: n,
   timestamp: e,
-  status: n
-}) => /* @__PURE__ */ N("div", { className: "flex items-center gap-2 font-mono text-sm", children: [
-  /* @__PURE__ */ N("span", { className: "text-gray-200", children: [
-    "> ",
-    r.split(" ").map((t, o) => {
-      const a = t.startsWith("<") && t.endsWith(">");
-      return /* @__PURE__ */ N(
-        "span",
-        {
-          className: a ? "text-green-400" : "text-gray-200",
-          children: [
-            o > 0 ? " " : "",
-            t
-          ]
-        },
-        o
-      );
-    })
-  ] }),
-  /* @__PURE__ */ m("span", { className: "text-gray-400", children: "·" }),
-  /* @__PURE__ */ m("span", { className: "text-gray-500", children: e }),
-  n === F.Pending && /* @__PURE__ */ m(Ke, {}),
-  n === F.Success && /* @__PURE__ */ m(
-    "div",
-    {
-      "data-testid": "success-indicator",
-      className: "w-4 h-4 rounded-full bg-green-500"
-    }
-  ),
-  (n === F.Timeout || n === F.Failure) && /* @__PURE__ */ m(
+  status: t,
+  fontFamily: s,
+  fontSize: r
+}) => {
+  const a = A(
+    () => ee(s, r ?? "0.875rem"),
+    [s, r]
+  );
+  return /* @__PURE__ */ I(
     "div",
     {
-      "data-testid": "success-indicator",
-      className: "w-4 h-4 rounded-full bg-red-500"
+      className: "citadel-output-line",
+      style: a.style,
+      children: [
+        /* @__PURE__ */ I("span", { className: "citadel-output-command", children: [
+          "> ",
+          n.split(" ").map((o, c) => {
+            const i = o.startsWith("<") && o.endsWith(">");
+            return /* @__PURE__ */ I(
+              "span",
+              {
+                className: i ? "citadel-output-command-arg" : "citadel-output-command-word",
+                children: [
+                  c > 0 ? " " : "",
+                  o
+                ]
+              },
+              c
+            );
+          })
+        ] }),
+        /* @__PURE__ */ m("span", { className: "citadel-output-separator", children: "·" }),
+        /* @__PURE__ */ m("span", { className: "citadel-output-timestamp", children: e }),
+        t === q.Pending && /* @__PURE__ */ m(Ve, {}),
+        t === q.Success && /* @__PURE__ */ m(
+          "div",
+          {
+            "data-testid": "success-indicator",
+            className: "citadel-status-dot citadel-status-dot-success"
+          }
+        ),
+        (t === q.Timeout || t === q.Failure) && /* @__PURE__ */ m(
+          "div",
+          {
+            "data-testid": "success-indicator",
+            className: "citadel-status-dot citadel-status-dot-failure"
+          }
+        )
+      ]
     }
-  )
-] }), qe = ({ output: r, outputRef: e }) => {
-  const n = $(), t = y(() => {
+  );
+}, Ge = ({ output: n, outputRef: e }) => {
+  const t = j(), s = A(
+    () => ee(t.fontFamily, t.outputFontSize ?? t.fontSize),
+    [t.fontFamily, t.fontSize, t.outputFontSize]
+  ), r = w(() => {
     if (e.current) {
-      const o = e.current;
+      const a = e.current;
       requestAnimationFrame(() => {
-        o.scrollTop = o.scrollHeight;
+        a.scrollTop = a.scrollHeight;
       });
     }
   }, [e]);
-  return A(() => {
-    if (t(), e.current) {
-      const o = e.current.getElementsByTagName("img"), a = o[o.length - 1];
-      if (a && !a.complete)
-        return a.addEventListener("load", t), () => a.removeEventListener("load", t);
+  return P(() => {
+    if (r(), e.current) {
+      const a = e.current.getElementsByTagName("img"), o = a[a.length - 1];
+      if (o && !o.complete)
+        return o.addEventListener("load", r), () => o.removeEventListener("load", r);
     }
-  }, [r, t, e]), /* @__PURE__ */ m(
+  }, [n, r, e]), /* @__PURE__ */ m(
     "div",
     {
       ref: e,
-      className: "h-full overflow-y-auto border border-gray-700 rounded-lg p-3 text-left",
+      className: "citadel-output",
       "data-testid": "citadel-command-output",
-      children: r.map((o) => /* @__PURE__ */ N("div", { className: "mb-4 last:mb-0", children: [
+      children: n.map((a) => /* @__PURE__ */ I("div", { className: "citadel-output-item", children: [
         /* @__PURE__ */ m(
-          We,
+          Je,
           {
-            command: o.command.join(" "),
-            timestamp: new Date(o.timestamp).toLocaleTimeString(),
-            status: o.result.status
+            command: a.command.join(" "),
+            timestamp: new Date(a.timestamp).toLocaleTimeString(),
+            status: a.result.status,
+            fontFamily: t.fontFamily,
+            fontSize: t.fontSize
           }
         ),
-        /* @__PURE__ */ m("pre", { className: `text-gray-200 whitespace-pre font-mono ${n.outputFontSize}`, children: o.result.render() })
-      ] }, o.id))
+        /* @__PURE__ */ m(
+          "div",
+          {
+            className: "citadel-output-content",
+            style: s.style,
+            children: a.result.render()
+          }
+        )
+      ] }, a.id))
     }
   );
-}, Ve = {
+}, Qe = {
   blink: {
     character: "▋",
     speed: 530,
@@ -858,444 +950,510 @@ Check the definition of the ${s.join(".")} command and update the return type fo
     speed: 120,
     color: "#fff"
   }
-}, oe = ["⠋", "⠙", "⠹", "⠸", "⠼", "⠴", "⠦", "⠧", "⠇", "⠏"], se = ["|", "/", "-", "\\"], Ye = ({
-  style: r = { type: "blink" },
+}, he = ["⠋", "⠙", "⠹", "⠸", "⠼", "⠴", "⠦", "⠧", "⠇", "⠏"], ge = ["|", "/", "-", "\\"], Xe = ({
+  style: n = { type: "blink" },
   isValid: e = !0,
-  errorMessage: n
+  errorMessage: t
 }) => {
-  const t = D(() => ({
-    ...Ve[r.type],
-    ...r
-  }), [r]), [o, a] = R(!0), [i, c] = R(0);
-  A(() => {
-    if (t.speed === 0) return;
-    const h = setInterval(() => {
-      t.type === "blink" ? a((p) => !p) : ["spin", "bbs"].includes(t.type) && c((p) => (p + 1) % (t.type === "bbs" ? se.length : oe.length));
-    }, t.speed);
-    return () => clearInterval(h);
-  }, [t.type, t.speed]);
-  const s = D(() => ({
-    color: e ? t.color : "#ff4444",
+  const s = A(() => ({
+    ...Qe[n.type],
+    ...n
+  }), [n]), [r, a] = _(!0), [o, c] = _(0);
+  P(() => {
+    if (s.speed === 0) return;
+    const g = setInterval(() => {
+      s.type === "blink" ? a((u) => !u) : ["spin", "bbs"].includes(s.type) && c((u) => (u + 1) % (s.type === "bbs" ? ge.length : he.length));
+    }, s.speed);
+    return () => clearInterval(g);
+  }, [s.type, s.speed]);
+  const i = A(() => ({
+    color: e ? s.color : "#ff4444",
     transition: "color 0.15s ease-in-out"
-  }), [e, t.color]);
-  return /* @__PURE__ */ m("div", { className: "relative inline-block", children: /* @__PURE__ */ m(
+  }), [e, s.color]);
+  return /* @__PURE__ */ m("div", { className: "citadel-cursor-wrapper", children: /* @__PURE__ */ m(
     "span",
     {
       className: `command-cursor ${e ? "" : "animate-shake"}`,
-      style: s,
-      title: n,
-      children: !e && n ? "✗" : ["spin", "bbs"].includes(t.type) ? (t.type === "bbs" ? se : oe)[i] : t.type === "solid" || o ? t.character : " "
+      style: i,
+      title: t,
+      children: !e && t ? "✗" : ["spin", "bbs"].includes(s.type) ? (s.type === "bbs" ? ge : he)[o] : s.type === "solid" || r ? s.character : " "
     }
   ) });
 };
-function Be(r, e) {
+function Ze(n, e) {
   switch (e.type) {
     case "set":
-      return C.debug(`[inputStateReducer] InputState changing from ${r} to ${e.state}`), e.state;
+      return k.debug(`[inputStateReducer] InputState changing from ${n} to ${e.state}`), e.state;
     default:
-      return r;
-  }
-}
-const Ge = () => {
-  const { state: r } = ee(), e = B(), n = ge(), t = K(), [o, a] = Se(Be, "idle"), i = (d) => {
-    a({ type: "set", state: d });
-  }, c = y(() => {
-    const f = e.getCompletions(t.path())[0] || t.nullSegment;
-    return C.debug("[getNextExpectedSegment] ", f), f;
-  }, [e, t]), s = y(() => e.getCompletionNames(t.path()).map((f) => e.getCommand([...t.path(), f])).filter((f) => f !== void 0), [e, t]), l = y((d, f) => {
-    if (!d) return f;
-    const w = t.path().length;
-    return f.filter((x) => {
-      const g = x.segments[w];
-      return !g || g.type !== "word" ? !1 : g.name.toLowerCase().startsWith(d.toLowerCase());
+      return n;
+  }
+}
+const et = () => {
+  const { state: n } = de(), e = Z(), t = ke(), s = V(), [r, a] = _e(Ze, "idle"), o = (l) => {
+    a({ type: "set", state: l });
+  }, c = w(() => {
+    const p = e.getCompletions(s.path())[0] || s.nullSegment;
+    return k.debug("[getNextExpectedSegment] ", p), p;
+  }, [e, s]), i = w(() => e.getCompletionNames(s.path()).map((p) => e.getCommand([...s.path(), p])).filter((p) => p !== void 0), [e, s]), d = w((l, p) => {
+    if (!l) return p;
+    const C = s.path().length;
+    return p.filter((M) => {
+      const S = M.segments[C];
+      return !S || S.type !== "word" ? !1 : S.name.toLowerCase().startsWith(l.toLowerCase());
     });
-  }, [t]), h = y((d) => {
-    const w = e.getCompletions(t.path()).filter((x) => x.type === "word").filter(
-      (x) => x.name.toLowerCase().startsWith(d.toLowerCase())
-    );
-    return w.length === 1 ? w[0] : t.nullSegment;
-  }, [e, t]), p = y((d) => {
-    const f = t.path(), w = e.getCompletions(f);
-    return w.length === 0 && d ? !1 : w.some((g) => g.type === "argument") ? !0 : w.some(
-      (g) => g.type === "word" && g.name.toLowerCase().startsWith(d.toLowerCase())
-    );
-  }, [e, t]), S = y((d) => {
-    C.debug("[tryAutoComplete] input: ", d);
-    const f = h(d);
-    return !f || f.name === d ? new ue() : (C.debug("[tryAutoComplete] result: ", f), f);
-  }, [h]), v = y((d, f) => {
-    if (r.history.position === null) {
-      if (f.setCurrentInput(d), C.debug("[useCommandParser][handleInputChange] newValue: ", d), o === "entering_argument") {
-        const w = ae(d);
-        if (w.isQuoted)
-          if (w.isComplete) {
-            const x = c();
-            if (!(x instanceof W)) return;
-            x.value = d.trim() || "", C.debug("[useCommandParser][handleInputChange][entering_command] pushing: ", x), t.push(x), f.setCurrentInput(""), i("idle");
-            return;
-          } else
-            return;
-        else if (w.isComplete) {
-          const x = c();
-          if (!(x instanceof W)) return;
-          x.value = d.trim() || "", C.debug("[useCommandParser][handleInputChange][entering_command] pushing: ", x), t.push(x), f.setCurrentInput(""), i("idle");
+  }, [s]), g = w((l) => {
+    const p = e.getUniqueCompletion(s.path(), l);
+    return p && p.type === "word" ? p : s.nullSegment;
+  }, [e, s]), u = w((l) => {
+    const p = s.path(), C = e.getCompletions(p);
+    return C.length === 0 && l ? !1 : C.some((S) => S.type === "argument") ? !0 : e.getMatchingCompletions(p, l).some((S) => S.type === "word");
+  }, [e, s]), h = w((l) => {
+    k.debug("[tryAutoComplete] input: ", l);
+    const p = g(l);
+    return !p || p.type === "null" ? new le() : (k.debug("[tryAutoComplete] result: ", p), p);
+  }, [g]), x = w((l, p) => {
+    if (n.history.position !== null)
+      return;
+    p.setCurrentInput(l), k.debug("[useCommandParser][handleInputChange] newValue: ", l);
+    const C = c();
+    if (C.type === "argument" || r === "entering_argument") {
+      const H = fe(l);
+      if (H.isQuoted)
+        if (H.isComplete) {
+          if (!(C instanceof O)) return;
+          C.value = l.trim() || "", k.debug("[useCommandParser][handleInputChange][entering_command] pushing: ", C), s.push(C), p.setCurrentInput(""), o("idle");
           return;
         } else
           return;
+      else if (H.isComplete) {
+        if (!(C instanceof O)) return;
+        C.value = l.trim() || "", k.debug("[useCommandParser][handleInputChange][entering_command] pushing: ", C), s.push(C), p.setCurrentInput(""), o("idle");
+        return;
+      } else
+        return;
+    }
+    if (l.endsWith(" ")) {
+      const H = l.trim().toLowerCase(), T = e.getCompletions(s.path()).filter(
+        (b) => b.type === "word" && b.name.toLowerCase() === H
+      );
+      if (T.length === 1) {
+        s.push(T[0]), p.setCurrentInput(""), o("idle");
+        return;
       }
-      if (o === "entering_command") {
-        const w = S(d);
-        if (w.type === "word") {
-          C.debug("[useCommandParser][handleInputChange][entering_command] pushing: ", w), t.push(w), f.setCurrentInput(""), i("idle");
-          return;
-        }
-      }
     }
-  }, [S, r, c, o, t]), u = y((d) => {
-    d.setCurrentInput(""), d.setIsEnteringArg(!1), t.clear(), i("idle");
-  }, [t]), k = y((d, f, w) => {
-    if (!(d.key === "Backspace" || d.key === "Enter" || d.key === "ArrowUp" || d.key === "ArrowDown" || d.key === "ArrowLeft" || d.key === "ArrowRight" || d.key === "Escape" || d.key === "Delete" || d.key === "Home" || d.key === "End" || d.key.length === 1))
+    const S = h(l);
+    if (S.type === "word") {
+      k.debug("[useCommandParser][handleInputChange][entering_command] pushing: ", S), s.push(S), p.setCurrentInput(""), o("idle");
+      return;
+    }
+  }, [h, n, c, r, s, e]), y = w((l) => {
+    l.setCurrentInput(""), l.setIsEnteringArg(!1), s.clear(), o("idle");
+  }, [s]), v = w((l, p, C) => {
+    if (!(l.key === "Backspace" || l.key === "Enter" || l.key === "ArrowUp" || l.key === "ArrowDown" || l.key === "ArrowLeft" || l.key === "ArrowRight" || l.key === "Escape" || l.key === "Delete" || l.key === "Home" || l.key === "End" || l.key.length === 1))
       return !0;
-    const { currentInput: g, isEnteringArg: E } = f, I = ae(g);
-    switch (d.key) {
+    const { currentInput: S, isEnteringArg: H } = p, T = fe(S);
+    switch (l.key) {
       case "Backspace":
-        return g === "" && (d.preventDefault(), t.size() > 0 && t.pop(), i("idle")), !0;
+        return S === "" && (l.preventDefault(), s.size() > 0 && s.pop(), o("idle")), !0;
       case "Enter": {
-        if (d.preventDefault(), I.isQuoted && !I.isComplete)
+        if (l.preventDefault(), T.isQuoted && !T.isComplete)
           return !0;
-        if (o === "entering_argument" || E && g.trim()) {
-          const M = c();
-          M instanceof W && (M.value = g, C.debug("[handleKeyDown][Enter]['entering_argument'] pushing: ", M), t.push(M));
+        if (r === "entering_argument" || H && S.trim()) {
+          const F = c();
+          F instanceof O && (F.value = S, k.debug("[handleKeyDown][Enter]['entering_argument'] pushing: ", F), s.push(F));
         }
-        const z = t.path(), U = e.getCommand(z);
-        if (!U)
+        const b = s.path(), te = e.getCommand(b);
+        if (!te)
           return !1;
-        const j = U.segments.filter((M) => M.type === "argument"), be = t.arguments;
-        return j.length > be.length ? !1 : (C.debug("[handleKeyDown][Enter] calling actions.executeCommand. segmentStack: ", t), w.executeCommand(), n.addStoredCommand(t.toArray()), u(w), !0);
+        const K = te.segments.filter((F) => F.type === "argument"), ne = s.arguments;
+        return K.length > ne.length ? !1 : (k.debug("[handleKeyDown][Enter] calling actions.executeCommand. segmentStack: ", s), C.executeCommand(), t.addStoredCommand(s.toArray()), y(C), !0);
       }
       case "ArrowUp":
-        return d.preventDefault(), (async () => {
-          const z = await n.navigateHistory("up");
-          return z.segments && (t.clear(), t.pushAll(z.segments), w.setCurrentInput("")), !0;
+        return l.preventDefault(), (async () => {
+          const b = await t.navigateHistory("up");
+          return b.segments && (s.clear(), s.pushAll(b.segments), C.setCurrentInput("")), !0;
         })();
       case "ArrowDown":
-        return d.preventDefault(), (async () => {
-          const z = await n.navigateHistory("down");
-          return z.segments && (t.clear(), t.pushAll(z.segments), w.setCurrentInput("")), !0;
+        return l.preventDefault(), (async () => {
+          const b = await t.navigateHistory("down");
+          return b.segments && (s.clear(), s.pushAll(b.segments), C.setCurrentInput("")), !0;
         })();
       default: {
-        if (!E && d.key.length === 1) {
-          const z = g + d.key;
-          if (!p(z))
-            return d.preventDefault(), !1;
+        if (!H && l.key.length === 1) {
+          const b = S + l.key;
+          if (!u(b))
+            return l.preventDefault(), !1;
         }
         return !0;
       }
     }
   }, [
-    o,
-    p,
-    c,
-    n,
+    r,
     u,
+    c,
+    t,
+    y,
     e,
-    t
+    s
   ]);
   return {
-    handleInputChange: v,
-    handleKeyDown: k,
-    inputState: o,
-    setInputStateWithLogging: i,
+    handleInputChange: x,
+    handleKeyDown: v,
+    inputState: r,
+    setInputStateWithLogging: o,
     // Expose internal functions for testing
-    findMatchingCommands: l,
-    getAutocompleteSuggestion: h,
-    getAvailableNodes: s,
+    findMatchingCommands: d,
+    getAutocompleteSuggestion: g,
+    getAvailableNodes: i,
     getNextExpectedSegment: c,
-    isValidCommandInput: p
+    isValidCommandInput: u
   };
 };
-function ae(r) {
+function fe(n) {
   const e = [];
-  let n = "", t = !1, o;
-  for (let a = 0; a < r.length; a++) {
-    const i = r[a];
-    (i === '"' || i === "'") && (!t || i === o) ? t ? (e.push(n), n = "", t = !1, o = void 0) : (n && (e.push(n), n = ""), t = !0, o = i) : !t && i === " " ? n && (e.push(n), n = "") : n += i;
+  let t = "", s = !1, r;
+  for (let a = 0; a < n.length; a++) {
+    const o = n[a];
+    (o === '"' || o === "'") && (!s || o === r) ? s ? (e.push(t), t = "", s = !1, r = void 0) : (t && (e.push(t), t = ""), s = !0, r = o) : !s && o === " " ? t && (e.push(t), t = "") : t += o;
   }
   return {
     words: e,
-    currentWord: n,
-    isQuoted: t,
-    quoteChar: o,
-    isComplete: !t && !n
+    currentWord: t,
+    isQuoted: s,
+    quoteChar: r,
+    isComplete: !s && !t
   };
 }
-const Je = () => {
-  const r = K(), [e, n] = R(0);
-  return A(() => {
-    const t = {
+const tt = () => {
+  const n = V(), [e, t] = _(0);
+  return P(() => {
+    const s = {
       update: () => {
-        n((o) => o + 1);
+        t((r) => r + 1);
       }
     };
-    return r.subscribe(t), () => {
-      r.unsubscribe(t);
+    return n.subscribe(s), () => {
+      n.unsubscribe(s);
     };
-  }, [r]), e;
-}, Qe = ({
-  state: r,
+  }, [n]), e;
+}, nt = ({
+  state: n,
   actions: e
 }) => {
-  const n = H(null), t = B(), o = K(), {
+  const t = z(null), s = Z(), r = V(), {
     handleKeyDown: a,
-    handleInputChange: i,
+    handleInputChange: o,
     inputState: c,
-    setInputStateWithLogging: s,
-    getNextExpectedSegment: l
-  } = Ge(), [h, p] = R(!1), S = $(), v = Je(), u = async (g) => {
-    const E = a(g, r, e);
-    await Promise.resolve(E) === !1 && (p(!0), setTimeout(() => p(!1), 500));
-  }, k = (g) => {
-    i(g.target.value, e);
-  }, d = (g) => {
-    g.preventDefault();
-    const E = g.clipboardData.getData("text");
-    i(E, e);
-  };
-  A(() => {
-    n.current && n.current.focus(), c !== "entering_command" && s("entering_command");
-  }, [c, s]), A(() => {
+    setInputStateWithLogging: i,
+    getNextExpectedSegment: d
+  } = et(), [g, u] = _(!1), h = j(), x = tt(), y = z(null), [v, l] = _(0), p = A(
+    () => ee(h.fontFamily, h.fontSize),
+    [h.fontFamily, h.fontSize]
+  ), C = w(async (E) => {
+    const R = a(E, n, e);
+    await Promise.resolve(R) === !1 && (u(!0), setTimeout(() => u(!1), 500));
+  }, [e, a, n]), M = w((E) => {
+    o(E.target.value, e);
+  }, [e, o]), S = w((E) => {
+    E.preventDefault();
+    const R = E.clipboardData.getData("text");
+    o(R, e);
+  }, [e, o]);
+  P(() => {
+    t.current && t.current.focus(), c !== "entering_command" && i("entering_command");
+  }, [c, i]), P(() => {
     if (c !== "idle") return;
-    const g = l();
-    let E = "idle";
-    switch (g.type) {
+    const E = d();
+    let R = "idle";
+    switch (E.type) {
       case "word":
-        E = "entering_command", e.setIsEnteringArg(!1);
+        R = "entering_command", e.setIsEnteringArg(!1);
         break;
       case "argument":
-        E = "entering_argument", e.setIsEnteringArg(!0);
+        R = "entering_argument", e.setIsEnteringArg(!0);
         break;
     }
-    s(E);
-  }, [v, c, l, s, e]);
-  const f = D(() => {
-    const g = [], E = o.toArray().map((I, z) => {
-      g.push(I.name);
-      const U = t.hasNextSegment(g);
-      if (I.type === "argument") {
-        const j = I;
-        return /* @__PURE__ */ N(O.Fragment, { children: [
-          /* @__PURE__ */ m("span", { className: "text-gray-200 whitespace-pre", children: j.value }),
-          z < o.size() && U && /* @__PURE__ */ m("span", { className: "text-gray-200 whitespace-pre", children: " " })
-        ] }, "arg-" + j.name + j.value);
+    i(R);
+  }, [x, c, d, i, e]);
+  const H = A(() => {
+    const E = [], R = r.toArray().map((L, se) => {
+      E.push(L.name);
+      const me = s.hasNextSegment(E);
+      if (L.type === "argument") {
+        const re = L;
+        return /* @__PURE__ */ I(U.Fragment, { children: [
+          /* @__PURE__ */ m("span", { className: "citadel-input-segment-arg", children: re.value }),
+          se < r.size() && me && /* @__PURE__ */ m("span", { className: "citadel-input-segment-space", children: " " })
+        ] }, "arg-" + re.name + re.value);
       }
-      return /* @__PURE__ */ N(O.Fragment, { children: [
-        /* @__PURE__ */ m("span", { className: "text-blue-400 whitespace-pre", children: I.name }),
-        z < o.size() && U && /* @__PURE__ */ m("span", { className: "text-blue-400 whitespace-pre", children: " " })
-      ] }, "word-" + I.name);
+      return /* @__PURE__ */ I(U.Fragment, { children: [
+        /* @__PURE__ */ m("span", { className: "citadel-input-segment-word", children: L.name }),
+        se < r.size() && me && /* @__PURE__ */ m("span", { className: "citadel-input-segment-space citadel-input-segment-space-command", children: " " })
+      ] }, "word-" + L.name);
     });
-    return [/* @__PURE__ */ m("div", { className: "flex items-center gap-1", "data-testid": "user-input-area", children: E }, "{segmentStackVersion}")];
-  }, [v, t, o]), [w, x] = R("");
-  return A(() => {
-    const g = l();
-    g.type === "argument" ? x(g.name) : x("");
-  }, [v, l]), /* @__PURE__ */ N("div", { className: "flex flex-col w-full bg-gray-900 rounded-lg p-4", children: [
-    /* @__PURE__ */ m("style", { children: `
-        @keyframes subtleGlow {
-          0%, 100% { box-shadow: 0 0 0 rgba(239, 68, 68, 0); }
-          50% { box-shadow: 0 0 8px rgba(239, 68, 68, 0.6); }
-        }
-        .invalid-input-animation {
-          animation: subtleGlow 0.4s ease-in-out;
-        }
-      ` }),
-    /* @__PURE__ */ N("div", { className: "flex items-center gap-2", children: [
-      /* @__PURE__ */ m("div", { className: "text-gray-400 font-mono", children: ">" }),
-      /* @__PURE__ */ N("div", { className: "flex-1 font-mono flex items-center", children: [
-        f,
-        /* @__PURE__ */ N("div", { className: "relative flex-1", children: [
-          /* @__PURE__ */ m(
-            "input",
-            {
-              ref: n,
-              type: "text",
-              role: "textbox",
-              value: r.currentInput,
-              onChange: k,
-              onKeyDown: u,
-              onPaste: d,
-              "data-testid": "citadel-command-input",
-              className: `w-full bg-transparent outline-none text-gray-200 caret-transparent ${h ? "invalid-input-animation" : ""}`,
-              spellCheck: !1,
-              autoComplete: "off",
-              placeholder: w
-            }
-          ),
-          /* @__PURE__ */ m(
-            "div",
-            {
-              className: "absolute top-0 pointer-events-none",
-              style: {
-                left: `${r.currentInput.length}ch`,
-                transition: "left 0.05s ease-out"
-              },
-              children: /* @__PURE__ */ m(
-                Ye,
-                {
-                  style: {
-                    type: S.cursorType ?? _.cursorType,
-                    color: S.cursorColor || _.cursorColor,
-                    speed: S.cursorSpeed || _.cursorSpeed
-                  }
-                }
-              )
-            }
-          )
+    return [/* @__PURE__ */ m("div", { className: "citadel-input-segments", "data-testid": "user-input-area", children: R }, x)];
+  }, [x, s, r]), [T, b] = _("");
+  P(() => {
+    const E = d();
+    E.type === "argument" ? b(E.name) : b("");
+  }, [x, d]);
+  const K = !n.isEnteringArg ? "is-command-mode" : "is-argument-mode", ne = A(
+    () => ({
+      left: `${v}px`,
+      transition: "left 0.05s ease-out"
+    }),
+    [v]
+  ), F = A(
+    () => ({
+      type: h.cursorType ?? N.cursorType,
+      color: h.cursorColor || N.cursorColor,
+      speed: h.cursorSpeed || N.cursorSpeed
+    }),
+    [h.cursorColor, h.cursorSpeed, h.cursorType]
+  );
+  return Me(() => {
+    const E = y.current, R = t.current;
+    if (!E || !R) {
+      l(0);
+      return;
+    }
+    const L = E.getBoundingClientRect().width;
+    l(Math.max(0, L - R.scrollLeft));
+  }, [n.currentInput, K, p.style]), /* @__PURE__ */ m("div", { className: "citadel-input-shell", children: /* @__PURE__ */ I(
+    "div",
+    {
+      className: "citadel-input-line",
+      style: p.style,
+      children: [
+        /* @__PURE__ */ m("div", { className: "citadel-input-prompt", children: ">" }),
+        /* @__PURE__ */ I("div", { className: "citadel-input-row", children: [
+          H,
+          /* @__PURE__ */ I("div", { className: "citadel-input-control", children: [
+            /* @__PURE__ */ m(
+              "span",
+              {
+                ref: y,
+                className: `citadel-input-measure ${K}`.trim(),
+                "aria-hidden": "true",
+                children: n.currentInput
+              }
+            ),
+            /* @__PURE__ */ m(
+              "input",
+              {
+                ref: t,
+                type: "text",
+                role: "textbox",
+                value: n.currentInput,
+                onChange: M,
+                onKeyDown: C,
+                onPaste: S,
+                "data-testid": "citadel-command-input",
+                className: `citadel-input-field ${K} ${g ? "invalid-input-animation" : ""}`.trim(),
+                spellCheck: !1,
+                autoComplete: "off",
+                placeholder: T
+              }
+            ),
+            /* @__PURE__ */ m(
+              "div",
+              {
+                className: "citadel-input-cursor",
+                style: ne,
+                children: /* @__PURE__ */ m(Xe, { style: F })
+              }
+            )
+          ] })
         ] })
-      ] })
-    ] })
-  ] });
-}, Xe = () => {
-  const r = B(), e = K(), n = "mt-2 border-t border-gray-700 px-4 py-2", t = "text-gray-300", o = r.getCompletions(e.path());
-  C.debug("[AvailableCommands] nextCommandSegments: ", o);
-  const a = O.useMemo(() => {
-    const l = [...o], h = (u) => u.name.toLowerCase() === "help", p = l.filter(h);
-    return [...l.filter((u) => !h(u)).sort(
-      (u, k) => u.name.localeCompare(k.name, void 0, { sensitivity: "base" })
-    ), ...p];
-  }, [o]), i = O.useMemo(() => {
-    const l = /* @__PURE__ */ new Map();
-    for (const h of a) {
-      const p = a.reduce((S, v) => {
-        if (v === h) return S;
-        let u = 0;
-        for (; u < h.name.length && u < v.name.length && h.name[u].toLowerCase() === v.name[u].toLowerCase(); )
-          u++;
-        return Math.max(S, u + 1);
+      ]
+    }
+  ) });
+}, st = ({ currentInput: n = "" }) => {
+  const e = Z(), t = j(), s = V(), r = U.useMemo(
+    () => ee(t.fontFamily, t.fontSize),
+    [t.fontFamily, t.fontSize]
+  ), a = n.trim().toLowerCase(), o = e.getMatchingCompletions(
+    s.path(),
+    a
+  );
+  k.debug("[AvailableCommands] nextCommandSegments: ", o);
+  const c = U.useMemo(() => {
+    const u = [...o], h = (l) => l.name.toLowerCase() === "help", x = u.filter(h);
+    return [...u.filter((l) => !h(l)).sort(
+      (l, p) => l.name.localeCompare(p.name, void 0, { sensitivity: "base" })
+    ), ...x];
+  }, [o]), i = U.useMemo(() => {
+    const u = /* @__PURE__ */ new Map();
+    for (const h of c) {
+      const x = c.reduce((y, v) => {
+        if (v === h) return y;
+        let l = 0;
+        for (; l < h.name.length && l < v.name.length && h.name[l].toLowerCase() === v.name[l].toLowerCase(); )
+          l++;
+        return Math.max(y, l + 1);
       }, 1);
-      l.set(h.name, p);
+      u.set(h.name, x);
     }
-    return l;
-  }, [a]), c = o.some((l) => l.type === "argument"), s = o[0];
-  return /* @__PURE__ */ m("div", { className: n, "data-testid": "available-commands", children: /* @__PURE__ */ m("div", { className: t, children: c ? o.length > 0 ? /* @__PURE__ */ N(ve, { children: [
-    /* @__PURE__ */ m("span", { className: "text-blue-400", children: s.name }),
-    s.description && /* @__PURE__ */ N("span", { className: "text-gray-400 ml-2", children: [
+    return u;
+  }, [c]), d = o.some((u) => u.type === "argument"), g = o[0];
+  return /* @__PURE__ */ m("div", { className: "citadel-available-commands", "data-testid": "available-commands", children: /* @__PURE__ */ m("div", { className: "citadel-available-commands-content", style: r.style, children: d ? o.length > 0 ? /* @__PURE__ */ I(He, { children: [
+    /* @__PURE__ */ m("span", { className: "citadel-available-next-arg", children: g.name }),
+    g.description && /* @__PURE__ */ I("span", { className: "citadel-available-next-desc", children: [
       "- ",
-      s.description
+      g.description
     ] })
-  ] }) : null : /* @__PURE__ */ m("div", { className: "flex flex-wrap gap-2", children: a == null ? void 0 : a.map((l) => {
-    const h = i.get(l.name) ?? 1;
+  ] }) : null : /* @__PURE__ */ m("div", { className: "citadel-available-chip-list", children: c == null ? void 0 : c.map((u) => {
+    const h = i.get(u.name) ?? 1;
     return /* @__PURE__ */ m(
       "div",
       {
-        className: "px-2 py-1 rounded bg-gray-800 mr-2 last:mr-0",
-        children: /* @__PURE__ */ N("span", { className: "font-mono text-white", children: [
-          /* @__PURE__ */ m("strong", { className: "underline", children: l.name.slice(0, h) }),
-          l.name.slice(h)
+        "data-testid": "available-command-chip",
+        className: "citadel-available-chip",
+        children: /* @__PURE__ */ I("span", { className: "citadel-available-chip-text", children: [
+          /* @__PURE__ */ m("strong", { className: "citadel-available-chip-prefix", children: u.name.slice(0, h) }),
+          u.name.slice(h)
         ] })
       },
-      l.name
+      u.name
     );
   }) }) }) });
-}, fe = ({
-  state: r,
+}, Ne = ({
+  state: n,
   actions: e,
-  outputRef: n
-}) => /* @__PURE__ */ N("div", { className: "innerContainer", children: [
-  /* @__PURE__ */ m("div", { className: "flex-1 min-h-0 pt-3 px-4", children: /* @__PURE__ */ m(qe, { output: r.output, outputRef: n }) }),
-  /* @__PURE__ */ N("div", { children: [
-    /* @__PURE__ */ m(Qe, { state: r, actions: e }),
-    /* @__PURE__ */ m(Xe, {})
-  ] })
-] }), Ze = () => {
-  const [r, e] = R(!1), [n, t] = R(!1), o = $(), [a, i] = R(() => o.initialHeight || null), c = H(null), s = H(null), l = H(!1), h = H(0), p = H(0), { state: S, actions: v } = ee();
-  Me({
+  outputRef: t
+}) => {
+  const r = j().displayMode === "inline", a = U.useMemo(
+    () => r ? { overflow: "hidden" } : void 0,
+    [r]
+  );
+  return /* @__PURE__ */ I("div", { className: "innerContainer citadel-tty", children: [
+    /* @__PURE__ */ m(
+      "div",
+      {
+        className: "citadel-tty-output-pane",
+        "data-testid": "citadel-output-pane",
+        style: a,
+        children: /* @__PURE__ */ m(Ge, { output: n.output, outputRef: t })
+      }
+    ),
+    /* @__PURE__ */ I("div", { className: "citadel-tty-input-region", children: [
+      /* @__PURE__ */ m(nt, { state: n, actions: e }),
+      /* @__PURE__ */ m(st, { currentInput: n.isEnteringArg ? "" : n.currentInput })
+    ] })
+  ] });
+}, rt = () => {
+  const [n, e] = _(!1), [t, s] = _(!1), r = j(), [a, o] = _(() => r.initialHeight || null), c = z(null), i = z(null), d = z(!1), g = z(0), u = z(0), { state: h, actions: x } = de();
+  qe({
     onOpen: () => e(!0),
-    onClose: () => t(!0),
-    isVisible: r,
-    showCitadelKey: o.showCitadelKey || "."
+    onClose: () => s(!0),
+    isVisible: n,
+    showCitadelKey: r.showCitadelKey || "."
   });
-  const u = y((w) => {
-    var I;
-    if (!l.current) return;
-    const x = w.clientY - h.current, g = (I = o.maxHeight) != null && I.endsWith("vh") ? window.innerHeight * parseInt(o.maxHeight, 10) / 100 : parseInt(o.maxHeight || "80vh", 10), E = Math.min(
-      Math.max(p.current - x, parseInt(o.minHeight || "200", 10)),
-      g
+  const y = w((M) => {
+    var b;
+    if (!d.current) return;
+    const S = M.clientY - g.current, H = (b = r.maxHeight) != null && b.endsWith("vh") ? window.innerHeight * parseInt(r.maxHeight, 10) / 100 : parseInt(r.maxHeight || "80vh", 10), T = Math.min(
+      Math.max(u.current - S, parseInt(r.minHeight || "200", 10)),
+      H
     );
-    s.current && (s.current.style.height = `${E}px`, s.current.style.bottom = "0", i(`${E}px`));
-  }, [o.maxHeight, o.minHeight]), k = y(() => {
-    l.current = !1, document.documentElement.style.userSelect = "", document.documentElement.style.webkitUserSelect = "", document.documentElement.style.mozUserSelect = "", document.documentElement.style.msUserSelect = "", document.removeEventListener("mousemove", u), document.removeEventListener("mouseup", k);
-  }, [u]), d = y((w) => {
-    s.current && (l.current = !0, h.current = w.clientY, p.current = s.current.offsetHeight, document.documentElement.style.userSelect = "none", document.documentElement.style.webkitUserSelect = "none", document.documentElement.style.mozUserSelect = "none", document.documentElement.style.msUserSelect = "none", document.addEventListener("mousemove", u), document.addEventListener("mouseup", k));
-  }, [u, k]);
-  A(() => () => {
-    document.removeEventListener("mousemove", u), document.removeEventListener("mouseup", k);
-  }, [u, k]);
-  const f = y(() => {
-    n && (e(!1), t(!1));
-  }, [n]);
-  return $e({
-    isVisible: r,
-    isClosing: n,
-    onAnimationComplete: f
-  }), r ? /* @__PURE__ */ N(
+    i.current && (i.current.style.height = `${T}px`, i.current.style.bottom = "0", o(`${T}px`));
+  }, [r.maxHeight, r.minHeight]), v = w(() => {
+    d.current = !1, document.documentElement.style.userSelect = "", document.documentElement.style.webkitUserSelect = "", document.documentElement.style.mozUserSelect = "", document.documentElement.style.msUserSelect = "", document.removeEventListener("mousemove", y), document.removeEventListener("mouseup", v);
+  }, [y]), l = w((M) => {
+    i.current && (d.current = !0, g.current = M.clientY, u.current = i.current.offsetHeight, document.documentElement.style.userSelect = "none", document.documentElement.style.webkitUserSelect = "none", document.documentElement.style.mozUserSelect = "none", document.documentElement.style.msUserSelect = "none", document.addEventListener("mousemove", y), document.addEventListener("mouseup", v));
+  }, [y, v]);
+  P(() => () => {
+    document.removeEventListener("mousemove", y), document.removeEventListener("mouseup", v);
+  }, [y, v]);
+  const p = w(() => {
+    t && (e(!1), s(!1));
+  }, [t]);
+  Be({
+    isVisible: n,
+    isClosing: t,
+    onAnimationComplete: p
+  });
+  const C = A(
+    () => ({
+      ...a ? { height: a } : {},
+      maxHeight: r.maxHeight
+    }),
+    [r.maxHeight, a]
+  );
+  return n ? /* @__PURE__ */ I(
     "div",
     {
-      ref: s,
-      className: `panelContainer ${r ? "citadel_slideUp" : ""} ${n ? "citadel_slideDown" : ""}`,
-      style: {
-        ...a ? { height: a } : void 0,
-        maxHeight: o.maxHeight
-      },
+      ref: i,
+      className: `panelContainer ${n ? "citadel_slideUp" : ""} ${t ? "citadel_slideDown" : ""}`,
+      style: C,
       children: [
-        /* @__PURE__ */ m("div", { className: "resizeHandle", onMouseDown: d }),
+        /* @__PURE__ */ m("div", { className: "resizeHandle", onMouseDown: l }),
         /* @__PURE__ */ m(
-          fe,
+          Ne,
           {
-            state: S,
-            actions: v,
+            state: h,
+            actions: x,
             outputRef: c
           }
         )
       ]
     }
   ) : null;
-}, en = () => {
-  const { state: r, actions: e } = ee(), n = H(null);
+}, ae = (n) => {
+  if (!n) return;
+  const e = n.trim();
+  if (e)
+    return /^\d+(\.\d+)?$/.test(e) ? `${e}px` : e;
+}, at = () => {
+  const { state: n, actions: e } = de(), t = j(), s = z(null), r = A(
+    () => ({
+      height: ae(t.initialHeight),
+      maxHeight: ae(t.maxHeight),
+      minHeight: ae(t.minHeight)
+    }),
+    [t.initialHeight, t.maxHeight, t.minHeight]
+  );
   return /* @__PURE__ */ m(
     "div",
     {
       className: "inlineContainer",
       "data-testid": "citadel-inline-container",
+      style: r,
       children: /* @__PURE__ */ m(
-        fe,
+        Ne,
         {
-          state: r,
+          state: n,
           actions: e,
-          outputRef: n
+          outputRef: s
         }
       )
     }
   );
-}, ie = `:host {
-  --citadel-bg: rgb(17, 24, 39);
-  --citadel-text: rgba(255, 255, 255, 0.87);
-  --citadel-border: rgb(55, 65, 81);
-  --citadel-accent: #646cff;
-  --citadel-accent-hover: #535bf2;
+}, ye = `:host {
+  --citadel-bg: oklch(20.8% 0.042 265.8);
+  --citadel-surface: oklch(27.9% 0.041 260);
+  --citadel-border: oklch(37.2% 0.044 257.3);
+  --citadel-text: oklch(92.8% 0.006 264.5);
+  --citadel-muted: oklch(70.7% 0.022 261.3);
+  --citadel-subtle: oklch(55.1% 0.023 264.4);
+  --citadel-word: oklch(70.7% 0.165 254.6);
+  --citadel-arg: oklch(72.3% 0.219 149.6);
+  --citadel-error: oklch(70.4% 0.191 22.2);
+  --citadel-success: oklch(72.3% 0.219 149.6);
   --citadel-min-height: 200px;
   --citadel-max-height: 80vh;
   --citadel-default-height: 35vh;
-  --citadel-error: rgb(239, 68, 68);
 
   display: block;
   pointer-events: auto;
+  color: var(--citadel-text);
   font-synthesis: none;
   text-rendering: optimizeLegibility;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
 }
 
-:host([data-display-mode="panel"]) {
+:host([data-display-mode='panel']) {
   position: fixed;
   bottom: 0;
   left: 0;
@@ -1304,11 +1462,11 @@ const Je = () => {
   height: var(--citadel-default-height);
   max-height: var(--citadel-max-height);
   min-height: var(--citadel-min-height);
-  z-index: 2147483647; /* Maximum z-index value */
+  z-index: 2147483647;
   overflow: hidden;
 }
 
-:host([data-display-mode="inline"]) {
+:host([data-display-mode='inline']) {
   position: relative;
   bottom: auto;
   left: auto;
@@ -1321,127 +1479,93 @@ const Je = () => {
   overflow: hidden;
 }
 
-button {
-  border-radius: 8px;
-  border: 1px solid transparent;
-  padding: 0.6em 1.2em;
-  font-size: 1em;
-  font-weight: 500;
-  font-family: inherit;
-  background-color: #1a1a1a;
-  cursor: pointer;
-  transition: border-color 0.25s;
-}
-
-button:hover {
-  border-color: var(--citadel-accent);
-}
-
-button:focus,
-button:focus-visible {
-  outline: 4px auto -webkit-focus-ring-color;
-}
-
-a {
-  font-weight: 500;
-  color: var(--citadel-accent);
-  text-decoration: inherit;
-}
-
-a:hover {
-  color: var(--citadel-accent-hover);
-}
-
-.flex-1 { flex: 1 1 0%; }
-.flex-shrink-0 { flex-shrink: 0; }
-.min-h-0 { min-height: 0px; }
-.pt-3 { padding-top: 0.75rem; }
-.px-4 { padding-left: 1rem; padding-right: 1rem; }
-
-.h-full {
+#citadel-root {
+  width: 100%;
   height: 100%;
 }
-.overflow-y-auto {
-  overflow-y: auto;
-}
-.border {
-  border-width: 1px;
-}
-.border-gray-700 {
-  --tw-border-opacity: 1;
-  border-color: rgb(55 65 81 / var(--tw-border-opacity, 1));
-}
-.rounded-lg {
-  border-radius: 0.5rem;
-}
-.p-3 {
-  padding: 0.75rem;
-}
-.text-left {
-  text-align: left;
+
+#citadel-root,
+#citadel-root * {
+  box-sizing: border-box;
 }
-`, le = `/* Keep only component-specific styles here */
 
 .panelContainer {
   position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  width: 100%;
   height: var(--citadel-default-height);
   min-height: var(--citadel-min-height);
   max-height: var(--citadel-max-height);
-  background-color: var(--citadel-bg);
-  overflow: hidden;
-  width: 100%;
-  box-sizing: border-box;
   margin: 0;
   padding: 0;
-  bottom: 0;
-  left: 0;
-  right: 0;
+  background-color: var(--citadel-bg);
+  overflow: hidden;
 }
 
 .innerContainer {
-  height: 100%;
-  flex: 1;
   width: 100%;
-  display: flex;
-  flex-direction: column;
+  height: 100%;
   margin: 0;
   padding: 0;
+  display: flex;
+  flex: 1;
+  flex-direction: column;
 }
 
-.inputSection {
-  border-top: 1px solid var(--citadel-border);
-  padding: 1rem;
-  margin: 0;
-  box-sizing: border-box;
+.citadel-tty {
+  background: var(--citadel-bg);
 }
 
-.resizeHandle {
-  width: 100%;
-  height: 6px;
-  background: transparent;
-  cursor: ns-resize;
+.citadel-tty-output-pane {
+  display: flex;
+  flex: 1 1 auto;
+  min-height: 0;
+  padding: 0.75rem 1rem 0;
+}
+
+.citadel-tty-input-region {
+  flex-shrink: 0;
+}
+
+.resizeHandle {
   position: absolute;
   top: -3px;
   left: 0;
   right: 0;
   z-index: 10;
+  width: 100%;
+  height: 6px;
+  background: transparent;
+  cursor: ns-resize;
   user-select: none;
   -webkit-user-select: none;
   pointer-events: all;
 }
 
 .resizeHandle:hover {
-  background: rgba(255, 255, 255, 0.1);
+  background: color-mix(in oklch, var(--citadel-text) 10%, transparent);
 }
 
 @keyframes citadel_slideUp {
-  from { transform: translateY(100%); }
-  to { transform: translateY(0); }
+  from {
+    transform: translateY(100%);
+  }
+
+  to {
+    transform: translateY(0);
+  }
 }
 
 @keyframes citadel_slideDown {
-  from { transform: translateY(0); }
-  to { transform: translateY(100%); }
+  from {
+    transform: translateY(0);
+  }
+
+  to {
+    transform: translateY(100%);
+  }
 }
 
 .citadel_slideUp {
@@ -1460,907 +1584,502 @@ a:hover {
   flex-direction: column;
   background-color: var(--citadel-bg);
   overflow: hidden;
-  box-sizing: border-box;
 }
-`, ce = `@tailwind base;
-@tailwind components;
-@tailwind utilities;
-`, nn = `*, ::before, ::after {
-  --tw-border-spacing-x: 0;
-  --tw-border-spacing-y: 0;
-  --tw-translate-x: 0;
-  --tw-translate-y: 0;
-  --tw-rotate: 0;
-  --tw-skew-x: 0;
-  --tw-skew-y: 0;
-  --tw-scale-x: 1;
-  --tw-scale-y: 1;
-  --tw-pan-x:  ;
-  --tw-pan-y:  ;
-  --tw-pinch-zoom:  ;
-  --tw-scroll-snap-strictness: proximity;
-  --tw-gradient-from-position:  ;
-  --tw-gradient-via-position:  ;
-  --tw-gradient-to-position:  ;
-  --tw-ordinal:  ;
-  --tw-slashed-zero:  ;
-  --tw-numeric-figure:  ;
-  --tw-numeric-spacing:  ;
-  --tw-numeric-fraction:  ;
-  --tw-ring-inset:  ;
-  --tw-ring-offset-width: 0px;
-  --tw-ring-offset-color: #fff;
-  --tw-ring-color: rgb(59 130 246 / 0.5);
-  --tw-ring-offset-shadow: 0 0 #0000;
-  --tw-ring-shadow: 0 0 #0000;
-  --tw-shadow: 0 0 #0000;
-  --tw-shadow-colored: 0 0 #0000;
-  --tw-blur:  ;
-  --tw-brightness:  ;
-  --tw-contrast:  ;
-  --tw-grayscale:  ;
-  --tw-hue-rotate:  ;
-  --tw-invert:  ;
-  --tw-saturate:  ;
-  --tw-sepia:  ;
-  --tw-drop-shadow:  ;
-  --tw-backdrop-blur:  ;
-  --tw-backdrop-brightness:  ;
-  --tw-backdrop-contrast:  ;
-  --tw-backdrop-grayscale:  ;
-  --tw-backdrop-hue-rotate:  ;
-  --tw-backdrop-invert:  ;
-  --tw-backdrop-opacity:  ;
-  --tw-backdrop-saturate:  ;
-  --tw-backdrop-sepia:  ;
-  --tw-contain-size:  ;
-  --tw-contain-layout:  ;
-  --tw-contain-paint:  ;
-  --tw-contain-style:  ;
-}
-
-::backdrop {
-  --tw-border-spacing-x: 0;
-  --tw-border-spacing-y: 0;
-  --tw-translate-x: 0;
-  --tw-translate-y: 0;
-  --tw-rotate: 0;
-  --tw-skew-x: 0;
-  --tw-skew-y: 0;
-  --tw-scale-x: 1;
-  --tw-scale-y: 1;
-  --tw-pan-x:  ;
-  --tw-pan-y:  ;
-  --tw-pinch-zoom:  ;
-  --tw-scroll-snap-strictness: proximity;
-  --tw-gradient-from-position:  ;
-  --tw-gradient-via-position:  ;
-  --tw-gradient-to-position:  ;
-  --tw-ordinal:  ;
-  --tw-slashed-zero:  ;
-  --tw-numeric-figure:  ;
-  --tw-numeric-spacing:  ;
-  --tw-numeric-fraction:  ;
-  --tw-ring-inset:  ;
-  --tw-ring-offset-width: 0px;
-  --tw-ring-offset-color: #fff;
-  --tw-ring-color: rgb(59 130 246 / 0.5);
-  --tw-ring-offset-shadow: 0 0 #0000;
-  --tw-ring-shadow: 0 0 #0000;
-  --tw-shadow: 0 0 #0000;
-  --tw-shadow-colored: 0 0 #0000;
-  --tw-blur:  ;
-  --tw-brightness:  ;
-  --tw-contrast:  ;
-  --tw-grayscale:  ;
-  --tw-hue-rotate:  ;
-  --tw-invert:  ;
-  --tw-saturate:  ;
-  --tw-sepia:  ;
-  --tw-drop-shadow:  ;
-  --tw-backdrop-blur:  ;
-  --tw-backdrop-brightness:  ;
-  --tw-backdrop-contrast:  ;
-  --tw-backdrop-grayscale:  ;
-  --tw-backdrop-hue-rotate:  ;
-  --tw-backdrop-invert:  ;
-  --tw-backdrop-opacity:  ;
-  --tw-backdrop-saturate:  ;
-  --tw-backdrop-sepia:  ;
-  --tw-contain-size:  ;
-  --tw-contain-layout:  ;
-  --tw-contain-paint:  ;
-  --tw-contain-style:  ;
-}/*
-! tailwindcss v3.4.15 | MIT License | https://tailwindcss.com
-*//*
-1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
-2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
-*/
-
-*,
-::before,
-::after {
-  box-sizing: border-box; /* 1 */
-  border-width: 0; /* 2 */
-  border-style: solid; /* 2 */
-  border-color: #e5e7eb; /* 2 */
-}
-
-::before,
-::after {
-  --tw-content: '';
-}
-
-/*
-1. Use a consistent sensible line-height in all browsers.
-2. Prevent adjustments of font size after orientation changes in iOS.
-3. Use a more readable tab size.
-4. Use the user's configured \`sans\` font-family by default.
-5. Use the user's configured \`sans\` font-feature-settings by default.
-6. Use the user's configured \`sans\` font-variation-settings by default.
-7. Disable tap highlights on iOS
-*/
-
-html,
-:host {
-  line-height: 1.5; /* 1 */
-  -webkit-text-size-adjust: 100%; /* 2 */
-  -moz-tab-size: 4; /* 3 */
-  -o-tab-size: 4;
-     tab-size: 4; /* 3 */
-  font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; /* 4 */
-  font-feature-settings: normal; /* 5 */
-  font-variation-settings: normal; /* 6 */
-  -webkit-tap-highlight-color: transparent; /* 7 */
-}
-
-/*
-1. Remove the margin in all browsers.
-2. Inherit line-height from \`html\` so users can set them as a class directly on the \`html\` element.
-*/
-
-body {
-  margin: 0; /* 1 */
-  line-height: inherit; /* 2 */
-}
-
-/*
-1. Add the correct height in Firefox.
-2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
-3. Ensure horizontal rules are visible by default.
-*/
-
-hr {
-  height: 0; /* 1 */
-  color: inherit; /* 2 */
-  border-top-width: 1px; /* 3 */
-}
-
-/*
-Add the correct text decoration in Chrome, Edge, and Safari.
-*/
-
-abbr:where([title]) {
-  -webkit-text-decoration: underline dotted;
-          text-decoration: underline dotted;
-}
-
-/*
-Remove the default font size and weight for headings.
-*/
-
-h1,
-h2,
-h3,
-h4,
-h5,
-h6 {
-  font-size: inherit;
-  font-weight: inherit;
-}
-
-/*
-Reset links to optimize for opt-in styling instead of opt-out.
-*/
-
-a {
-  color: inherit;
-  text-decoration: inherit;
-}
-
-/*
-Add the correct font weight in Edge and Safari.
-*/
-
-b,
-strong {
-  font-weight: bolder;
-}
-
-/*
-1. Use the user's configured \`mono\` font-family by default.
-2. Use the user's configured \`mono\` font-feature-settings by default.
-3. Use the user's configured \`mono\` font-variation-settings by default.
-4. Correct the odd \`em\` font sizing in all browsers.
-*/
 
-code,
-kbd,
-samp,
-pre {
-  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; /* 1 */
-  font-feature-settings: normal; /* 2 */
-  font-variation-settings: normal; /* 3 */
-  font-size: 1em; /* 4 */
-}
-
-/*
-Add the correct font size in all browsers.
-*/
-
-small {
-  font-size: 80%;
+.citadel-output {
+  width: 100%;
+  height: 100%;
+  overflow-y: auto;
+  padding: 0.75rem;
+  border: 1px solid var(--citadel-border);
+  border-radius: 0.5rem;
+  background: color-mix(in oklch, var(--citadel-bg) 75%, black);
+  text-align: left;
 }
 
-/*
-Prevent \`sub\` and \`sup\` elements from affecting the line height in all browsers.
-*/
-
-sub,
-sup {
-  font-size: 75%;
-  line-height: 0;
-  position: relative;
-  vertical-align: baseline;
+.citadel-output-item {
+  margin-bottom: 1rem;
 }
 
-sub {
-  bottom: -0.25em;
+.citadel-output-item:last-child {
+  margin-bottom: 0;
 }
 
-sup {
-  top: -0.5em;
+.citadel-output-content {
+  margin-top: 0.35rem;
+  color: var(--citadel-text);
 }
 
-/*
-1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
-2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
-3. Remove gaps between table borders by default.
-*/
-
-table {
-  text-indent: 0; /* 1 */
-  border-color: inherit; /* 2 */
-  border-collapse: collapse; /* 3 */
+.citadel-output-content > :first-child {
+  margin-top: 0;
 }
 
-/*
-1. Change the font styles in all browsers.
-2. Remove the margin in Firefox and Safari.
-3. Remove default padding in all browsers.
-*/
-
-button,
-input,
-optgroup,
-select,
-textarea {
-  font-family: inherit; /* 1 */
-  font-feature-settings: inherit; /* 1 */
-  font-variation-settings: inherit; /* 1 */
-  font-size: 100%; /* 1 */
-  font-weight: inherit; /* 1 */
-  line-height: inherit; /* 1 */
-  letter-spacing: inherit; /* 1 */
-  color: inherit; /* 1 */
-  margin: 0; /* 2 */
-  padding: 0; /* 3 */
+.citadel-output-content > :last-child {
+  margin-bottom: 0;
 }
 
-/*
-Remove the inheritance of text transform in Edge and Firefox.
-*/
-
-button,
-select {
-  text-transform: none;
+.citadel-output-line {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 0.5rem;
 }
 
-/*
-1. Correct the inability to style clickable types in iOS and Safari.
-2. Remove default button styles.
-*/
-
-button,
-input:where([type='button']),
-input:where([type='reset']),
-input:where([type='submit']) {
-  -webkit-appearance: button; /* 1 */
-  background-color: transparent; /* 2 */
-  background-image: none; /* 2 */
+.citadel-output-command,
+.citadel-output-command-word {
+  color: var(--citadel-text);
 }
 
-/*
-Use the modern Firefox focus style for all focusable elements.
-*/
-
-:-moz-focusring {
-  outline: auto;
+.citadel-output-command-arg {
+  color: var(--citadel-arg);
 }
 
-/*
-Remove the additional \`:invalid\` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
-*/
+.citadel-output-separator {
+  color: var(--citadel-muted);
+}
 
-:-moz-ui-invalid {
-  box-shadow: none;
+.citadel-output-timestamp {
+  color: var(--citadel-subtle);
 }
 
-/*
-Add the correct vertical alignment in Chrome and Firefox.
-*/
+.citadel-status-dot {
+  width: 1rem;
+  height: 1rem;
+  border-radius: 999px;
+}
 
-progress {
-  vertical-align: baseline;
+.citadel-status-dot-success {
+  background: var(--citadel-success);
 }
 
-/*
-Correct the cursor style of increment and decrement buttons in Safari.
-*/
+.citadel-status-dot-failure {
+  background: var(--citadel-error);
+}
 
-::-webkit-inner-spin-button,
-::-webkit-outer-spin-button {
-  height: auto;
+.citadel-spinner {
+  width: 1rem;
+  height: 1rem;
+  border: 2px solid color-mix(in oklch, var(--citadel-text) 60%, transparent);
+  border-top-color: color-mix(in oklch, var(--citadel-muted) 80%, black);
+  border-radius: 999px;
+  animation: citadel-spin 0.9s linear infinite;
 }
 
-/*
-1. Correct the odd appearance in Chrome and Safari.
-2. Correct the outline style in Safari.
-*/
+@keyframes citadel-spin {
+  to {
+    transform: rotate(360deg);
+  }
+}
 
-[type='search'] {
-  -webkit-appearance: textfield; /* 1 */
-  outline-offset: -2px; /* 2 */
+.citadel-input-shell {
+  width: 100%;
+  padding: 1rem;
+  border-radius: 0.5rem;
+  background-color: var(--citadel-bg);
 }
 
-/*
-Remove the inner padding in Chrome and Safari on macOS.
-*/
+.citadel-input-line {
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+}
 
-::-webkit-search-decoration {
-  -webkit-appearance: none;
+.citadel-input-prompt {
+  color: var(--citadel-muted);
 }
 
-/*
-1. Correct the inability to style clickable types in iOS and Safari.
-2. Change font properties to \`inherit\` in Safari.
-*/
+.citadel-input-row {
+  display: flex;
+  align-items: center;
+  flex: 1 1 auto;
+  min-width: 0;
+}
 
-::-webkit-file-upload-button {
-  -webkit-appearance: button; /* 1 */
-  font: inherit; /* 2 */
+.citadel-input-segments {
+  display: flex;
+  align-items: center;
+  gap: 0.25rem;
 }
 
-/*
-Add the correct display in Chrome and Safari.
-*/
+.citadel-input-segment-arg {
+  color: var(--citadel-text);
+  white-space: pre;
+}
 
-summary {
-  display: list-item;
+.citadel-input-segment-word {
+  color: var(--citadel-word);
+  white-space: pre;
 }
 
-/*
-Removes the default spacing and border for appropriate elements.
-*/
+.citadel-input-segment-space {
+  color: var(--citadel-text);
+  white-space: pre;
+}
 
-blockquote,
-dl,
-dd,
-h1,
-h2,
-h3,
-h4,
-h5,
-h6,
-hr,
-figure,
-p,
-pre {
-  margin: 0;
+.citadel-input-segment-space-command {
+  color: var(--citadel-word);
 }
 
-fieldset {
-  margin: 0;
-  padding: 0;
+.citadel-input-control {
+  position: relative;
+  flex: 1 1 auto;
+  min-width: 0;
 }
 
-legend {
-  padding: 0;
+.citadel-input-measure {
+  position: absolute;
+  top: 0;
+  left: 0;
+  visibility: hidden;
+  pointer-events: none;
+  white-space: pre;
+  font: inherit;
+  letter-spacing: inherit;
 }
 
-ol,
-ul,
-menu {
-  list-style: none;
+.citadel-input-field {
+  width: 100%;
   margin: 0;
   padding: 0;
+  border: 0;
+  border-radius: 0;
+  outline: none;
+  background: transparent;
+  font: inherit;
+  line-height: inherit;
+  letter-spacing: inherit;
+  appearance: none;
+  -webkit-appearance: none;
+  caret-color: transparent;
 }
 
-/*
-Reset default styling for dialogs.
-*/
-dialog {
-  padding: 0;
+.citadel-input-field::placeholder {
+  color: var(--citadel-subtle);
+  opacity: 1;
 }
 
-/*
-Prevent resizing textareas horizontally by default.
-*/
-
-textarea {
-  resize: vertical;
+.citadel-input-field.is-command-mode {
+  color: var(--citadel-word);
 }
 
-/*
-1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
-2. Set the default placeholder color to the user's configured gray 400 color.
-*/
-
-input::-moz-placeholder, textarea::-moz-placeholder {
-  opacity: 1; /* 1 */
-  color: #9ca3af; /* 2 */
+.citadel-input-field.is-argument-mode {
+  color: var(--citadel-text);
 }
 
-input::placeholder,
-textarea::placeholder {
-  opacity: 1; /* 1 */
-  color: #9ca3af; /* 2 */
+.citadel-input-cursor {
+  position: absolute;
+  top: 0;
+  pointer-events: none;
 }
 
-/*
-Set the default cursor for buttons.
-*/
+@keyframes citadel-invalid-glow {
+  0%,
+  100% {
+    box-shadow: 0 0 0 color-mix(in oklch, var(--citadel-error) 0%, transparent);
+  }
 
-button,
-[role="button"] {
-  cursor: pointer;
+  50% {
+    box-shadow: 0 0 8px color-mix(in oklch, var(--citadel-error) 70%, transparent);
+  }
 }
 
-/*
-Make sure disabled buttons don't get the pointer cursor.
-*/
-:disabled {
-  cursor: default;
+.invalid-input-animation {
+  animation: citadel-invalid-glow 0.4s ease-in-out;
 }
 
-/*
-1. Make replaced elements \`display: block\` by default. (https://github.com/mozdevs/cssremedy/issues/14)
-2. Add \`vertical-align: middle\` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
-   This can trigger a poorly considered lint error in some tools but is included by design.
-*/
+.citadel-cursor-wrapper {
+  position: relative;
+  display: inline-block;
+}
 
-img,
-svg,
-video,
-canvas,
-audio,
-iframe,
-embed,
-object {
-  display: block; /* 1 */
-  vertical-align: middle; /* 2 */
+.command-cursor {
+  display: inline-block;
+  white-space: pre;
 }
 
-/*
-Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
-*/
+@keyframes citadel-shake {
+  0%,
+  100% {
+    transform: translateX(0);
+  }
 
-img,
-video {
-  max-width: 100%;
-  height: auto;
-}
+  25% {
+    transform: translateX(-4px);
+  }
 
-/* Make elements with the HTML hidden attribute stay hidden by default */
-[hidden]:where(:not([hidden="until-found"])) {
-  display: none;
-}
-.container {
-  width: 100%;
-}
-.pointer-events-none {
-  pointer-events: none;
-}
-.visible {
-  visibility: visible;
-}
-.static {
-  position: static;
-}
-.fixed {
-  position: fixed;
-}
-.absolute {
-  position: absolute;
-}
-.relative {
-  position: relative;
-}
-.top-0 {
-  top: 0px;
-}
-.my-2 {
-  margin-top: 0.5rem;
-  margin-bottom: 0.5rem;
-}
-.mb-4 {
-  margin-bottom: 1rem;
-}
-.ml-2 {
-  margin-left: 0.5rem;
-}
-.mr-2 {
-  margin-right: 0.5rem;
+  75% {
+    transform: translateX(4px);
+  }
 }
-.mt-1 {
-  margin-top: 0.25rem;
+
+.animate-shake {
+  animation: citadel-shake 0.2s ease-in-out;
 }
-.mt-2 {
+
+.citadel-available-commands {
   margin-top: 0.5rem;
+  padding: 0.5rem 1rem;
+  border-top: 1px solid var(--citadel-border);
 }
-.block {
-  display: block;
-}
-.inline-block {
-  display: inline-block;
-}
-.flex {
-  display: flex;
-}
-.hidden {
-  display: none;
-}
-.h-12 {
-  height: 3rem;
-}
-.h-4 {
-  height: 1rem;
-}
-.h-auto {
-  height: auto;
-}
-.h-full {
-  height: 100%;
-}
-.max-h-\\[300px\\] {
-  max-height: 300px;
-}
-.min-h-0 {
-  min-height: 0px;
-}
-.min-h-screen {
-  min-height: 100vh;
-}
-.w-4 {
-  width: 1rem;
-}
-.w-full {
-  width: 100%;
-}
-.max-w-\\[400px\\] {
-  max-width: 400px;
-}
-.flex-1 {
-  flex: 1 1 0%;
-}
-.flex-shrink-0 {
-  flex-shrink: 0;
-}
-.transform {
-  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
-}
-@keyframes spin {
 
-  to {
-    transform: rotate(360deg);
-  }
-}
-.animate-spin {
-  animation: spin 1s linear infinite;
+.citadel-available-commands-content {
+  color: var(--citadel-muted);
 }
-.flex-col {
-  flex-direction: column;
-}
-.flex-wrap {
+
+.citadel-available-chip-list {
+  display: flex;
   flex-wrap: wrap;
-}
-.items-center {
-  align-items: center;
-}
-.justify-center {
-  justify-content: center;
-}
-.gap-2 {
   gap: 0.5rem;
 }
-.overflow-y-auto {
-  overflow-y: auto;
-}
-.whitespace-pre {
-  white-space: pre;
-}
-.rounded {
-  border-radius: 0.25rem;
-}
-.rounded-full {
-  border-radius: 9999px;
-}
-.rounded-lg {
-  border-radius: 0.5rem;
-}
-.border {
-  border-width: 1px;
-}
-.border-2 {
-  border-width: 2px;
-}
-.border-t {
-  border-top-width: 1px;
-}
-.border-gray-300 {
-  --tw-border-opacity: 1;
-  border-color: rgb(209 213 219 / var(--tw-border-opacity, 1));
-}
-.border-gray-700 {
-  --tw-border-opacity: 1;
-  border-color: rgb(55 65 81 / var(--tw-border-opacity, 1));
-}
-.border-t-gray-600 {
-  --tw-border-opacity: 1;
-  border-top-color: rgb(75 85 99 / var(--tw-border-opacity, 1));
-}
-.bg-gray-100 {
-  --tw-bg-opacity: 1;
-  background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1));
-}
-.bg-gray-800 {
-  --tw-bg-opacity: 1;
-  background-color: rgb(31 41 55 / var(--tw-bg-opacity, 1));
-}
-.bg-gray-900 {
-  --tw-bg-opacity: 1;
-  background-color: rgb(17 24 39 / var(--tw-bg-opacity, 1));
-}
-.bg-green-500 {
-  --tw-bg-opacity: 1;
-  background-color: rgb(34 197 94 / var(--tw-bg-opacity, 1));
-}
-.bg-red-500 {
-  --tw-bg-opacity: 1;
-  background-color: rgb(239 68 68 / var(--tw-bg-opacity, 1));
-}
-.bg-transparent {
-  background-color: transparent;
-}
-.bg-white {
-  --tw-bg-opacity: 1;
-  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
-}
-.object-contain {
-  -o-object-fit: contain;
-     object-fit: contain;
-}
-.p-3 {
-  padding: 0.75rem;
-}
-.p-4 {
-  padding: 1rem;
-}
-.p-6 {
-  padding: 1.5rem;
-}
-.px-2 {
-  padding-left: 0.5rem;
-  padding-right: 0.5rem;
-}
-.px-4 {
-  padding-left: 1rem;
-  padding-right: 1rem;
-}
-.py-1 {
-  padding-top: 0.25rem;
-  padding-bottom: 0.25rem;
-}
-.pt-2 {
-  padding-top: 0.5rem;
-}
-.pt-3 {
-  padding-top: 0.75rem;
-}
-.text-left {
-  text-align: left;
-}
-.font-mono {
-  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
-}
-.text-base {
-  font-size: 1rem;
-  line-height: 1.5rem;
-}
-.text-lg {
-  font-size: 1.125rem;
-  line-height: 1.75rem;
-}
-.text-sm {
-  font-size: 0.875rem;
-  line-height: 1.25rem;
-}
-.text-xs {
-  font-size: 0.75rem;
-  line-height: 1rem;
-}
-.text-blue-400 {
-  --tw-text-opacity: 1;
-  color: rgb(96 165 250 / var(--tw-text-opacity, 1));
-}
-.text-gray-200 {
-  --tw-text-opacity: 1;
-  color: rgb(229 231 235 / var(--tw-text-opacity, 1));
-}
-.text-gray-300 {
-  --tw-text-opacity: 1;
-  color: rgb(209 213 219 / var(--tw-text-opacity, 1));
-}
-.text-gray-400 {
-  --tw-text-opacity: 1;
-  color: rgb(156 163 175 / var(--tw-text-opacity, 1));
-}
-.text-gray-500 {
-  --tw-text-opacity: 1;
-  color: rgb(107 114 128 / var(--tw-text-opacity, 1));
-}
-.text-gray-700 {
-  --tw-text-opacity: 1;
-  color: rgb(55 65 81 / var(--tw-text-opacity, 1));
-}
-.text-green-500 {
-  --tw-text-opacity: 1;
-  color: rgb(34 197 94 / var(--tw-text-opacity, 1));
-}
-.text-red-400 {
-  --tw-text-opacity: 1;
-  color: rgb(248 113 113 / var(--tw-text-opacity, 1));
-}
-.text-red-500 {
-  --tw-text-opacity: 1;
-  color: rgb(239 68 68 / var(--tw-text-opacity, 1));
-}
-.text-white {
-  --tw-text-opacity: 1;
-  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
+
+.citadel-available-chip {
+  padding: 0.25rem 0.5rem;
+  border-radius: 0.375rem;
+  background: var(--citadel-surface);
 }
-.underline {
-  text-decoration-line: underline;
+
+.citadel-available-chip-text {
+  color: white;
 }
-.caret-transparent {
-  caret-color: transparent;
+
+.citadel-available-chip-prefix {
+  text-decoration: underline;
 }
-.shadow {
-  --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
-  --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
-  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+
+.citadel-available-next-arg {
+  color: var(--citadel-word);
 }
-.shadow-lg {
-  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
-  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
-  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+
+.citadel-available-next-desc {
+  margin-left: 0.5rem;
+  color: var(--citadel-muted);
 }
-.outline-none {
-  outline: 2px solid transparent;
-  outline-offset: 2px;
+
+.citadel-result-json,
+.citadel-result-text {
+  color: var(--citadel-text);
 }
-.filter {
-  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
+
+.citadel-result-json {
+  margin: 0;
 }
-.transition {
-  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
-  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
-  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
-  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
-  transition-duration: 150ms;
+
+.citadel-result-text {
+  white-space: pre;
 }
-.ease-in-out {
-  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+
+.citadel-result-error {
+  margin-top: 0.25rem;
+  color: var(--citadel-error);
 }
-.ease-out {
-  transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
+
+.citadel-result-pending {
+  color: var(--citadel-muted);
 }
-.last\\:mb-0:last-child {
-  margin-bottom: 0px;
+
+.citadel-result-image-wrap {
+  margin-block: 0.5rem;
 }
-.last\\:mr-0:last-child {
-  margin-right: 0px;
+
+.citadel-result-image {
+  max-width: 400px;
+  max-height: 300px;
+  height: auto;
+  object-fit: contain;
+  border-radius: 0.5rem;
 }
-`, dn = ({
-  config: r = _,
-  commandRegistry: e = new Z(),
-  containerId: n = null
+`, wt = ({
+  config: n = N,
+  commandRegistry: e,
+  containerId: t = null
 }) => {
-  const t = H(null), o = r.displayMode ?? _.displayMode ?? "panel";
-  return A(() => {
-    C.configure({
-      level: r.logLevel || _.logLevel || Q.ERROR,
+  const s = z(new X()), r = e ?? s.current, a = z(null), o = A(() => ({ width: "100%", height: "100%" }), []), c = n.displayMode ?? N.displayMode ?? "panel";
+  return P(() => {
+    k.configure({
+      level: n.logLevel || N.logLevel || ie.ERROR,
       prefix: "[Citadel]"
     });
-    const a = new we(e, r), i = o === "inline" && !n, c = i ? t.current : n ? document.getElementById(n) : document.body;
-    if (c)
-      c.appendChild(a);
+    const i = new Ie(r, n), d = c === "inline" && !t, g = d ? a.current : t ? document.getElementById(t) : document.body;
+    if (g)
+      g.appendChild(i);
     else {
-      if (i) {
+      if (d) {
         console.warn("[Citadel] No host available for inline mode; skipping mount.");
         return;
       }
-      console.warn(`Container with id "${n}" not found, falling back to body`), document.body.appendChild(a);
+      console.warn(`Container with id "${t}" not found, falling back to body`), document.body.appendChild(i);
     }
     return () => {
-      var s;
-      (s = a.parentElement) == null || s.removeChild(a);
+      var u;
+      (u = i.parentElement) == null || u.removeChild(i);
     };
-  }, [e, n, r, o]), o === "inline" && !n ? /* @__PURE__ */ m("div", { ref: t, style: { width: "100%", height: "100%" } }) : null;
+  }, [r, t, n, c]), c === "inline" && !t ? /* @__PURE__ */ m("div", { ref: a, style: o }) : null;
 };
-class we extends HTMLElement {
-  constructor(n, t) {
+class Ie extends HTMLElement {
+  constructor(t, s) {
     var a;
     super();
-    b(this, "shadow");
-    b(this, "root", null);
-    b(this, "commandRegistry");
-    b(this, "config");
-    this.shadow = this.attachShadow({ mode: "open" }), this.commandRegistry = n, this.config = t;
-    const o = ((a = this.config) == null ? void 0 : a.displayMode) ?? "panel";
-    this.setAttribute("data-display-mode", o);
+    f(this, "shadow");
+    f(this, "root", null);
+    f(this, "commandRegistry");
+    f(this, "config");
+    this.shadow = this.attachShadow({ mode: "open" }), this.commandRegistry = t, this.config = s;
+    const r = ((a = this.config) == null ? void 0 : a.displayMode) ?? "panel";
+    this.setAttribute("data-display-mode", r);
   }
   connectedCallback() {
     try {
-      const t = [ie, le, ce, nn].map((o) => {
+      const s = [ye].map((r) => {
         const a = new CSSStyleSheet();
-        return a.replaceSync(o), a;
+        return a.replaceSync(r), a;
       });
-      this.shadow.adoptedStyleSheets = [...t];
+      this.shadow.adoptedStyleSheets = [...s];
     } catch {
-      const t = [ie, le, ce].join(`
-`), o = document.createElement("style");
-      o.textContent = t, this.shadow.appendChild(o);
+      const s = [ye].join(`
+`), r = document.createElement("style");
+      r.textContent = s, this.shadow.appendChild(r);
     }
-    const n = document.createElement("div");
-    n.id = "citadel-root", n.style.width = "100%", n.style.height = "100%", this.shadow.appendChild(n), this.root = ke(n), this.root.render(
-      /* @__PURE__ */ m(Pe, { config: this.config || _, commandRegistry: this.commandRegistry, children: /* @__PURE__ */ m(tn, {}) })
+    const t = document.createElement("div");
+    t.id = "citadel-root", t.style.width = "100%", t.style.height = "100%", this.shadow.appendChild(t), this.root = Te(t), this.root.render(
+      /* @__PURE__ */ m(We, { config: this.config || N, commandRegistry: this.commandRegistry, children: /* @__PURE__ */ m(ot, {}) })
     );
   }
   disconnectedCallback() {
-    const n = this.root;
-    if (this.root = null, !n) {
+    const t = this.root;
+    if (this.root = null, !t) {
       this.shadow.replaceChildren();
       return;
     }
     queueMicrotask(() => {
-      n.unmount(), this.shadow.replaceChildren();
+      t.unmount(), this.shadow.replaceChildren();
     });
   }
 }
-typeof window < "u" && window.customElements && !window.customElements.get("citadel-element") && window.customElements.define("citadel-element", we);
-const tn = () => ($().displayMode ?? "panel") === "inline" ? /* @__PURE__ */ m(en, {}) : /* @__PURE__ */ m(Ze, {});
+typeof window < "u" && window.customElements && !window.customElements.get("citadel-element") && window.customElements.define("citadel-element", Ie);
+const ot = () => (j().displayMode ?? "panel") === "inline" ? /* @__PURE__ */ m(at, {}) : /* @__PURE__ */ m(rt, {});
+class it {
+  constructor() {
+    f(this, "_description");
+  }
+  describe(e) {
+    return this._description = e, this;
+  }
+  get description() {
+    return this._description;
+  }
+}
+class ct {
+  constructor(e) {
+    f(this, "state");
+    this.state = {
+      path: e,
+      description: "",
+      segments: lt(e)
+    };
+  }
+  describe(e) {
+    return this.state.description = e, this;
+  }
+  details(e) {
+    return this.state.details = e, this;
+  }
+  arg(e, t) {
+    const s = new it();
+    return t == null || t(s), this.state.segments.push({
+      type: "argument",
+      name: e,
+      description: s.description
+    }), this;
+  }
+  handle(e) {
+    return {
+      path: this.state.path,
+      description: this.state.description,
+      details: this.state.details,
+      segments: [...this.state.segments],
+      handler: e
+    };
+  }
+}
+function lt(n) {
+  const e = n.trim();
+  if (!e)
+    throw new Error("Command path cannot be empty");
+  const t = e.split(".");
+  if (t.some((s) => s.trim() === ""))
+    throw new Error(`Invalid command path "${n}". Empty segments are not allowed.`);
+  if (t.some((s) => s.includes(" ")))
+    throw new Error(
+      `Invalid command path "${n}". Use dot-delimited words (e.g. "user.show").`
+    );
+  return t.map((s) => ({
+    type: "word",
+    name: s
+  }));
+}
+function dt(n) {
+  return n.flatMap((e) => e.type === "argument" ? [e.name] : []);
+}
+function mt(n) {
+  const e = dt(n.segments);
+  return async (t) => {
+    const s = e.reduce((r, a, o) => (r[a] = t[o], r), {});
+    return Promise.resolve(
+      n.handler({
+        rawArgs: t,
+        namedArgs: s,
+        commandPath: n.path
+      })
+    );
+  };
+}
+function Ct(n) {
+  return new ct(n);
+}
+function ut(n, e) {
+  n.addCommand(
+    e.segments,
+    e.description,
+    mt(e)
+  );
+}
+function pt(n, e) {
+  return e.forEach((t) => ut(n, t)), n;
+}
+function vt(n) {
+  const e = new X();
+  return pt(e, n);
+}
+function St(n) {
+  return new Y(n);
+}
+function xt(n) {
+  return new ze(n);
+}
+function bt(n, e = "") {
+  return new Fe(n, e);
+}
+function kt(n) {
+  return new we(n);
+}
 export {
-  dn as Citadel,
-  Z as CommandRegistry,
-  T as CommandResult,
-  F as CommandStatus,
-  Ve as DEFAULT_CURSOR_CONFIGS,
-  Ne as ErrorCommandResult,
-  cn as ImageCommandResult,
-  ln as JsonCommandResult,
-  J as OutputItem,
-  Ee as PendingCommandResult,
-  G as TextCommandResult
+  wt as Citadel,
+  X as CommandRegistry,
+  W as CommandResult,
+  q as CommandStatus,
+  Qe as DEFAULT_CURSOR_CONFIGS,
+  we as ErrorCommandResult,
+  Fe as ImageCommandResult,
+  ze as JsonCommandResult,
+  oe as OutputItem,
+  De as PendingCommandResult,
+  Y as TextCommandResult,
+  Ct as command,
+  vt as createCommandRegistry,
+  kt as error,
+  bt as image,
+  xt as json,
+  ut as registerCommand,
+  pt as registerCommands,
+  St as text
 };