@ash-cloud/ash-ai 0.1.12 → 0.1.15

package/dist/playground.js

@@ -1,9 +1,9 @@
-var it = Object.defineProperty;
-var at = (e, n, r) => n in e ? it(e, n, { enumerable: !0, configurable: !0, writable: !0, value: r }) : e[n] = r;
-var ee = (e, n, r) => at(e, typeof n != "symbol" ? n + "" : n, r);
-import { lazy as lt, createContext as Ge, useState as N, useRef as B, useEffect as j, useCallback as O, useMemo as re, useContext as Je, Suspense as ot, Fragment as Le } from "react";
-import { jsxs as i, jsx as t, Fragment as _ } from "react/jsx-runtime";
-function ct(e) {
+var ot = Object.defineProperty;
+var ct = (e, n, r) => n in e ? ot(e, n, { enumerable: !0, configurable: !0, writable: !0, value: r }) : e[n] = r;
+var se = (e, n, r) => ct(e, typeof n != "symbol" ? n + "" : n, r);
+import { lazy as dt, createContext as Je, useState as N, useCallback as F, useRef as V, useEffect as P, useMemo as ae, useContext as Ue, Suspense as ut, Fragment as $e } from "react";
+import { jsxs as a, jsx as t, Fragment as _ } from "react/jsx-runtime";
+function ht(e) {
   if (e.startsWith("mcp__")) {
     const n = e.split("__");
     if (n.length >= 3)
@@ -11,7 +11,7 @@ function ct(e) {
   }
   return e;
 }
-function dt(e) {
+function mt(e) {
   if (e.startsWith("mcp__")) {
     const n = e.split("__");
     if (n.length >= 3 && n[1] !== void 0)
@@ -22,7 +22,7 @@ function dt(e) {
   }
   return null;
 }
-function ut(e, n) {
+function pt(e, n) {
   const r = n || {};
   switch (e) {
     case "Bash":
@@ -43,14 +43,14 @@ function ut(e, n) {
       };
     }
     case "Edit": {
-      const s = r.old_string, a = r.new_string, l = s ? s.split(`
-`).length : 0, c = a ? a.split(`
+      const s = r.old_string, i = r.new_string, l = s ? s.split(`
+`).length : 0, c = i ? i.split(`
 `).length : 0;
       return {
         action: "file_edit",
         path: r.file_path || "",
         oldString: s,
-        newString: a,
+        newString: i,
         replaceAll: r.replace_all,
         linesAdded: c,
         linesRemoved: l
@@ -92,7 +92,7 @@ function ut(e, n) {
         query: r.query || ""
       };
     case "TodoWrite": {
-      const s = r.todos || [], a = {
+      const s = r.todos || [], i = {
         total: s.length,
         completed: s.filter((l) => l.status === "completed").length,
         inProgress: s.filter((l) => l.status === "in_progress").length,
@@ -101,7 +101,7 @@ function ut(e, n) {
       return {
         action: "todo_write",
         todos: s,
-        stats: a
+        stats: i
       };
     }
     case "Task":
@@ -114,7 +114,7 @@ function ut(e, n) {
         toolCallCount: 0
       };
     default: {
-      const s = dt(e);
+      const s = mt(e);
       return s ? {
         action: "mcp_tool",
         serverName: s.serverName,
@@ -122,13 +122,13 @@ function ut(e, n) {
         arguments: n
       } : {
         action: "generic_tool",
-        toolName: ct(e),
+        toolName: ht(e),
         arguments: n
       };
     }
   }
 }
-function ht(e, n, r) {
+function ft(e, n, r) {
   switch (r.action) {
     case "command_run": {
       const s = r.command;
@@ -162,11 +162,11 @@ function ht(e, n, r) {
       return "Unknown tool";
   }
 }
-function mt(e) {
+function xt(e) {
   return typeof e == "string" ? e : Array.isArray(e) ? e.filter((n) => typeof (n == null ? void 0 : n.text) == "string").map((n) => n.text).join(`
 `) : e && typeof e == "object" && "text" in e ? String(e.text) : JSON.stringify(e, null, 2);
 }
-function pt(e) {
+function gt(e) {
   if (typeof e == "string")
     try {
       return { type: "json", value: JSON.parse(e) };
@@ -190,8 +190,8 @@ function pt(e) {
   }
   return { type: "json", value: e };
 }
-function ft(e) {
-  const n = mt(e);
+function wt(e) {
+  const n = xt(e);
   if (typeof e == "string")
     try {
       const r = JSON.parse(e);
@@ -208,8 +208,8 @@ function ft(e) {
     success: !0
   };
 }
-function nr(e) {
-  const n = ut(e.name, e.input), r = ht(e.name, e.input, n);
+function rr(e) {
+  const n = pt(e.name, e.input), r = ft(e.name, e.input, n);
   return {
     id: e.id,
     toolName: e.name,
@@ -220,15 +220,15 @@ function nr(e) {
     startedAt: (/* @__PURE__ */ new Date()).toISOString()
   };
 }
-function rr(e, n, r) {
-  const s = { ...e }, a = { ...e.actionType };
-  if (s.status = r ? "failed" : "success", s.completedAt = (/* @__PURE__ */ new Date()).toISOString(), s.isError = r, s.output = n, a.action === "command_run") {
-    const l = ft(n);
-    a.result = l, l.exitCode !== void 0 && l.exitCode !== 0 && (s.status = "failed", s.isError = !0);
-  } else (a.action === "mcp_tool" || a.action === "generic_tool") && (a.result = pt(n));
-  return s.actionType = a, s;
+function sr(e, n, r) {
+  const s = { ...e }, i = { ...e.actionType };
+  if (s.status = r ? "failed" : "success", s.completedAt = (/* @__PURE__ */ new Date()).toISOString(), s.isError = r, s.output = n, i.action === "command_run") {
+    const l = wt(n);
+    i.result = l, l.exitCode !== void 0 && l.exitCode !== 0 && (s.status = "failed", s.isError = !0);
+  } else (i.action === "mcp_tool" || i.action === "generic_tool") && (i.result = gt(n));
+  return s.actionType = i, s;
 }
-function sr(e) {
+function ar(e) {
   switch (e.action) {
     case "command_run":
       return "terminal";
@@ -258,7 +258,7 @@ function sr(e) {
       return "tool";
   }
 }
-function Ue(e) {
+function Ke(e) {
   switch (e.action) {
     case "command_run":
       return "Command";
@@ -291,7 +291,7 @@ function Ue(e) {
 function ir(e) {
   return e < 1024 ? `${e} B` : e < 1024 * 1024 ? `${(e / 1024).toFixed(1)} KB` : `${(e / (1024 * 1024)).toFixed(1)} MB`;
 }
-function De(e) {
+function je(e) {
   try {
     return new Date(e).toLocaleTimeString("en-US", {
       hour: "2-digit",
@@ -303,63 +303,63 @@ function De(e) {
     return e;
   }
 }
-function He(e, n) {
-  const r = typeof e == "string" ? new Date(e) : e, a = (/* @__PURE__ */ new Date()).getTime() - r.getTime(), l = Math.floor(a / 1e3);
+function Ve(e, n) {
+  const r = typeof e == "string" ? new Date(e) : e, i = (/* @__PURE__ */ new Date()).getTime() - r.getTime(), l = Math.floor(i / 1e3);
   if (l < 60)
     return `${l}s`;
   const c = Math.floor(l / 60), h = l % 60;
   return h === 0 ? `${c}m` : `${c}m ${h}s`;
 }
-function ar(e, n) {
+function lr(e, n) {
   return e.length <= n ? e : e.substring(0, n - 3) + "...";
 }
 function p(...e) {
   return e.filter(Boolean).join(" ");
 }
-function xt(e, n) {
+function vt(e, n) {
   const r = [];
-  let s = [], a = 0;
+  let s = [], i = 0;
   const l = () => {
     s.length > 0 && (r.push({
       type: "tool_group",
       entries: [...s],
-      id: `tool-group-${a++}`
+      id: `tool-group-${i++}`
     }), s = []);
   };
   for (const c of e)
     c.entryType.type === "tool_call" ? (s.push(c), n.breakEveryNToolCalls && n.breakEveryNToolCalls > 0 && s.length >= n.breakEveryNToolCalls && l()) : (l(), r.push({ type: "single", entry: c }));
   return l(), r;
 }
-function gt(e) {
+function yt(e) {
   return e.filter(
     (n) => n.entryType.type === "tool_call"
   ).map((n) => n.entryType.toolCall);
 }
-function wt(e) {
+function bt(e) {
   const n = /(?:\*\*)?Option\s+(\d+)(?:\*\*)?[:\-]\s*([^\n]+)(?:\n((?:(?!\n(?:\*\*)?Option\s+\d).)*?))?/gi, r = [];
-  let s = -1, a;
-  for (n.lastIndex = 0; (a = n.exec(e)) !== null; ) {
-    s === -1 && (s = a.index);
-    const h = a[1] ?? "", o = a[2], w = o ? o.trim() : "", d = a[3];
-    let m;
+  let s = -1, i;
+  for (n.lastIndex = 0; (i = n.exec(e)) !== null; ) {
+    s === -1 && (s = i.index);
+    const h = i[1] ?? "", o = i[2], f = o ? o.trim() : "", d = i[3];
+    let x;
     if (d) {
-      const g = d.split(`
-`).map((v) => v.trim()).filter((v) => v.length > 0).join(" ");
-      g && (m = g);
+      const m = d.split(`
+`).map((w) => w.trim()).filter((w) => w.length > 0).join(" ");
+      m && (x = m);
     }
-    r.push({ id: h, label: w, description: m });
+    r.push({ id: h, label: f, description: x });
   }
   if (r.length >= 2)
     return { preamble: s > 0 ? e.substring(0, s).trim() : "", options: r };
   const l = /^(.*?(?:what would you like to do\??|choose an option|select.*?:|here are your options.*?:))\s*\n+((?:\d+\.\s+.+\n?)+)/ims, c = e.match(l);
   if (c && c[1] && c[2]) {
-    const h = c[1].trim(), o = c[2], w = /(\d+)\.\s+([^\n]+)/g;
+    const h = c[1].trim(), o = c[2], f = /(\d+)\.\s+([^\n]+)/g;
     let d;
-    for (; (d = w.exec(o)) !== null; ) {
-      const m = d[1] ?? "", g = d[2], v = g ? g.trim() : "";
+    for (; (d = f.exec(o)) !== null; ) {
+      const x = d[1] ?? "", m = d[2], w = m ? m.trim() : "";
       r.push({
-        id: m,
-        label: v
+        id: x,
+        label: w
       });
     }
     if (r.length >= 2)
@@ -367,8 +367,8 @@ function wt(e) {
   }
   return null;
 }
-function lr({ className: e }) {
-  return /* @__PURE__ */ i("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+function or({ className: e }) {
+  return /* @__PURE__ */ a("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
     /* @__PURE__ */ t("circle", { cx: "12", cy: "12", r: "5" }),
     /* @__PURE__ */ t("line", { x1: "12", y1: "1", x2: "12", y2: "3" }),
     /* @__PURE__ */ t("line", { x1: "12", y1: "21", x2: "12", y2: "23" }),
@@ -380,29 +380,29 @@ function lr({ className: e }) {
     /* @__PURE__ */ t("line", { x1: "18.36", y1: "5.64", x2: "19.78", y2: "4.22" })
   ] });
 }
-function or({ className: e }) {
+function cr({ className: e }) {
   return /* @__PURE__ */ t("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ t("path", { d: "M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z" }) });
 }
-function je({ className: e }) {
+function We({ className: e }) {
   return /* @__PURE__ */ t("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ t("polyline", { points: "6 9 12 15 18 9" }) });
 }
-function ve({ className: e }) {
+function be({ className: e }) {
   return /* @__PURE__ */ t("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ t("polyline", { points: "9 18 15 12 9 6" }) });
 }
-function cr({ className: e }) {
+function dr({ className: e }) {
   return /* @__PURE__ */ t("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ t("polyline", { points: "15 18 9 12 15 6" }) });
 }
-function dr({ className: e }) {
+function ur({ className: e }) {
   return /* @__PURE__ */ t("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ t("polyline", { points: "18 15 12 9 6 15" }) });
 }
-function Me({ className: e }) {
-  return /* @__PURE__ */ i("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+function Ie({ className: e }) {
+  return /* @__PURE__ */ a("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
     /* @__PURE__ */ t("polyline", { points: "4 17 10 11 4 5" }),
     /* @__PURE__ */ t("line", { x1: "12", y1: "19", x2: "20", y2: "19" })
   ] });
 }
-function We({ className: e }) {
-  return /* @__PURE__ */ i("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+function Be({ className: e }) {
+  return /* @__PURE__ */ a("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
     /* @__PURE__ */ t("path", { d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" }),
     /* @__PURE__ */ t("polyline", { points: "14 2 14 8 20 8" }),
     /* @__PURE__ */ t("line", { x1: "16", y1: "13", x2: "8", y2: "13" }),
@@ -410,72 +410,72 @@ function We({ className: e }) {
   ] });
 }
 function Oe({ className: e }) {
-  return /* @__PURE__ */ i("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+  return /* @__PURE__ */ a("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
     /* @__PURE__ */ t("path", { d: "M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7" }),
     /* @__PURE__ */ t("path", { d: "M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z" })
   ] });
 }
-function vt({ className: e }) {
-  return /* @__PURE__ */ i("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+function Nt({ className: e }) {
+  return /* @__PURE__ */ a("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
     /* @__PURE__ */ t("path", { d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" }),
     /* @__PURE__ */ t("polyline", { points: "14 2 14 8 20 8" }),
     /* @__PURE__ */ t("line", { x1: "12", y1: "18", x2: "12", y2: "12" }),
     /* @__PURE__ */ t("line", { x1: "9", y1: "15", x2: "15", y2: "15" })
   ] });
 }
-function _e({ className: e }) {
-  return /* @__PURE__ */ i("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+function Se({ className: e }) {
+  return /* @__PURE__ */ a("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
     /* @__PURE__ */ t("circle", { cx: "11", cy: "11", r: "8" }),
     /* @__PURE__ */ t("line", { x1: "21", y1: "21", x2: "16.65", y2: "16.65" })
   ] });
 }
-function yt({ className: e }) {
-  return /* @__PURE__ */ i("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+function kt({ className: e }) {
+  return /* @__PURE__ */ a("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
     /* @__PURE__ */ t("circle", { cx: "12", cy: "12", r: "10" }),
     /* @__PURE__ */ t("line", { x1: "2", y1: "12", x2: "22", y2: "12" }),
     /* @__PURE__ */ t("path", { d: "M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z" })
   ] });
 }
-function bt({ className: e }) {
-  return /* @__PURE__ */ i("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+function Ct({ className: e }) {
+  return /* @__PURE__ */ a("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
     /* @__PURE__ */ t("path", { d: "M12 2v6" }),
     /* @__PURE__ */ t("path", { d: "M6 6v4a6 6 0 0 0 12 0V6" }),
     /* @__PURE__ */ t("path", { d: "M12 16v6" })
   ] });
 }
-function Nt({ className: e }) {
+function _t({ className: e }) {
   return /* @__PURE__ */ t("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ t("path", { d: "M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z" }) });
 }
-function kt({ className: e }) {
-  return /* @__PURE__ */ i("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+function Tt({ className: e }) {
+  return /* @__PURE__ */ a("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
     /* @__PURE__ */ t("path", { d: "M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z" }),
     /* @__PURE__ */ t("circle", { cx: "11", cy: "13", r: "3" }),
     /* @__PURE__ */ t("line", { x1: "15", y1: "16", x2: "17", y2: "18" })
   ] });
 }
-function ur({ className: e }) {
-  return /* @__PURE__ */ i("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+function hr({ className: e }) {
+  return /* @__PURE__ */ a("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
     /* @__PURE__ */ t("polyline", { points: "16 18 22 12 16 6" }),
     /* @__PURE__ */ t("polyline", { points: "8 6 2 12 8 18" })
   ] });
 }
-function hr({ className: e }) {
-  return /* @__PURE__ */ i("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+function St({ className: e }) {
+  return /* @__PURE__ */ a("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
     /* @__PURE__ */ t("rect", { x: "9", y: "9", width: "13", height: "13", rx: "2", ry: "2" }),
     /* @__PURE__ */ t("path", { d: "M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1" })
   ] });
 }
-function Ct({ className: e }) {
+function Ye({ className: e }) {
   return /* @__PURE__ */ t("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ t("polyline", { points: "20 6 9 17 4 12" }) });
 }
 function mr({ className: e }) {
-  return /* @__PURE__ */ i("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+  return /* @__PURE__ */ a("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
     /* @__PURE__ */ t("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
     /* @__PURE__ */ t("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
   ] });
 }
-function _t({ className: e }) {
-  return /* @__PURE__ */ i("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+function Mt({ className: e }) {
+  return /* @__PURE__ */ a("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
     /* @__PURE__ */ t("line", { x1: "12", y1: "2", x2: "12", y2: "6" }),
     /* @__PURE__ */ t("line", { x1: "12", y1: "18", x2: "12", y2: "22" }),
     /* @__PURE__ */ t("line", { x1: "4.93", y1: "4.93", x2: "7.76", y2: "7.76" }),
@@ -486,29 +486,29 @@ function _t({ className: e }) {
     /* @__PURE__ */ t("line", { x1: "16.24", y1: "7.76", x2: "19.07", y2: "4.93" })
   ] });
 }
-function Tt({ className: e }) {
-  return /* @__PURE__ */ i("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+function Et({ className: e }) {
+  return /* @__PURE__ */ a("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
     /* @__PURE__ */ t("circle", { cx: "12", cy: "12", r: "10" }),
     /* @__PURE__ */ t("line", { x1: "12", y1: "16", x2: "12", y2: "12" }),
     /* @__PURE__ */ t("line", { x1: "12", y1: "8", x2: "12.01", y2: "8" })
   ] });
 }
-function Ke({ className: e }) {
-  return /* @__PURE__ */ i("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+function Ze({ className: e }) {
+  return /* @__PURE__ */ a("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
     /* @__PURE__ */ t("path", { d: "M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z" }),
     /* @__PURE__ */ t("line", { x1: "12", y1: "9", x2: "12", y2: "13" }),
     /* @__PURE__ */ t("line", { x1: "12", y1: "17", x2: "12.01", y2: "17" })
   ] });
 }
-function St({ className: e }) {
-  return /* @__PURE__ */ i("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+function It({ className: e }) {
+  return /* @__PURE__ */ a("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
     /* @__PURE__ */ t("circle", { cx: "12", cy: "12", r: "10" }),
     /* @__PURE__ */ t("line", { x1: "12", y1: "8", x2: "12", y2: "12" }),
     /* @__PURE__ */ t("line", { x1: "12", y1: "16", x2: "12.01", y2: "16" })
   ] });
 }
-function Mt({ className: e }) {
-  return /* @__PURE__ */ i("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+function Lt({ className: e }) {
+  return /* @__PURE__ */ a("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
     /* @__PURE__ */ t("rect", { x: "8", y: "6", width: "8", height: "14", rx: "4" }),
     /* @__PURE__ */ t("path", { d: "M3 10h2" }),
     /* @__PURE__ */ t("path", { d: "M19 10h2" }),
@@ -518,30 +518,30 @@ function Mt({ className: e }) {
     /* @__PURE__ */ t("path", { d: "M12 2v4" })
   ] });
 }
-function Et({ className: e }) {
-  return /* @__PURE__ */ i("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+function $t({ className: e }) {
+  return /* @__PURE__ */ a("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
     /* @__PURE__ */ t("circle", { cx: "12", cy: "12", r: "10" }),
     /* @__PURE__ */ t("path", { d: "M9 12l2 2 4-4" })
   ] });
 }
-function It({ className: e }) {
-  return /* @__PURE__ */ i("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+function Rt({ className: e }) {
+  return /* @__PURE__ */ a("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
     /* @__PURE__ */ t("circle", { cx: "12", cy: "12", r: "10" }),
     /* @__PURE__ */ t("line", { x1: "15", y1: "9", x2: "9", y2: "15" }),
     /* @__PURE__ */ t("line", { x1: "9", y1: "9", x2: "15", y2: "15" })
   ] });
 }
 function pr({ className: e }) {
-  return /* @__PURE__ */ i("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+  return /* @__PURE__ */ a("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
     /* @__PURE__ */ t("line", { x1: "22", y1: "2", x2: "11", y2: "13" }),
     /* @__PURE__ */ t("polygon", { points: "22 2 15 22 11 13 2 9 22 2" })
   ] });
 }
-function Lt({ className: e }) {
+function At({ className: e }) {
   return /* @__PURE__ */ t("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ t("path", { d: "M21.44 11.05l-9.19 9.19a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.83-2.83l8.49-8.48" }) });
 }
 function fr({ className: e }) {
-  return /* @__PURE__ */ i("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+  return /* @__PURE__ */ a("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
     /* @__PURE__ */ t("circle", { cx: "12", cy: "12", r: "10" }),
     /* @__PURE__ */ t("rect", { x: "9", y: "9", width: "6", height: "6" })
   ] });
@@ -549,21 +549,21 @@ function fr({ className: e }) {
 function xr({ className: e }) {
   return /* @__PURE__ */ t("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ t("path", { d: "M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z" }) });
 }
-function $t({ className: e }) {
-  return /* @__PURE__ */ i("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+function Qe({ className: e }) {
+  return /* @__PURE__ */ a("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
     /* @__PURE__ */ t("path", { d: "M12 3l1.5 4.5L18 9l-4.5 1.5L12 15l-1.5-4.5L6 9l4.5-1.5L12 3z" }),
     /* @__PURE__ */ t("path", { d: "M5 19l.5 1.5L7 21l-1.5.5L5 23l-.5-1.5L3 21l1.5-.5L5 19z" }),
     /* @__PURE__ */ t("path", { d: "M19 11l.5 1.5L21 13l-1.5.5L19 15l-.5-1.5L17 13l1.5-.5L19 11z" })
   ] });
 }
 function gr({ className: e }) {
-  return /* @__PURE__ */ i("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+  return /* @__PURE__ */ a("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
     /* @__PURE__ */ t("path", { d: "M9.5 2A2.5 2.5 0 0 1 12 4.5v15a2.5 2.5 0 0 1-4.96.44 2.5 2.5 0 0 1-2.96-3.08 3 3 0 0 1-.34-5.58 2.5 2.5 0 0 1 1.32-4.24 2.5 2.5 0 0 1 4.44-1.54" }),
     /* @__PURE__ */ t("path", { d: "M14.5 2A2.5 2.5 0 0 0 12 4.5v15a2.5 2.5 0 0 0 4.96.44 2.5 2.5 0 0 0 2.96-3.08 3 3 0 0 0 .34-5.58 2.5 2.5 0 0 0-1.32-4.24 2.5 2.5 0 0 0-4.44-1.54" })
   ] });
 }
-function de({ className: e }) {
-  return /* @__PURE__ */ i("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+function xe({ className: e }) {
+  return /* @__PURE__ */ a("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
     /* @__PURE__ */ t("path", { d: "M12 8V4H8" }),
     /* @__PURE__ */ t("rect", { x: "5", y: "8", width: "14", height: "12", rx: "2" }),
     /* @__PURE__ */ t("path", { d: "M2 14h2" }),
@@ -572,17 +572,17 @@ function de({ className: e }) {
     /* @__PURE__ */ t("path", { d: "M15 13v2" })
   ] });
 }
-function At({ className: e }) {
-  return /* @__PURE__ */ i("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+function Dt({ className: e }) {
+  return /* @__PURE__ */ a("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
     /* @__PURE__ */ t("path", { d: "M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2" }),
     /* @__PURE__ */ t("circle", { cx: "12", cy: "7", r: "4" })
   ] });
 }
-function Rt({ className: e }) {
+function jt({ className: e }) {
   return /* @__PURE__ */ t("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ t("circle", { cx: "12", cy: "12", r: "10" }) });
 }
-function Dt({ className: e }) {
-  return /* @__PURE__ */ i("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+function Wt({ className: e }) {
+  return /* @__PURE__ */ a("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
     /* @__PURE__ */ t("path", { d: "M10 6h11" }),
     /* @__PURE__ */ t("path", { d: "M10 12h11" }),
     /* @__PURE__ */ t("path", { d: "M10 18h11" }),
@@ -591,21 +591,21 @@ function Dt({ className: e }) {
     /* @__PURE__ */ t("path", { d: "M3 18l2 2 4-4" })
   ] });
 }
-function jt({ className: e }) {
-  return /* @__PURE__ */ i("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+function Bt({ className: e }) {
+  return /* @__PURE__ */ a("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
     /* @__PURE__ */ t("circle", { cx: "12", cy: "12", r: "10" }),
     /* @__PURE__ */ t("polyline", { points: "12 6 12 12 16 14" })
   ] });
 }
-function qe({ className: e }) {
+function He({ className: e }) {
   return /* @__PURE__ */ t("svg", { className: e, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ t("path", { d: "M21 12a9 9 0 1 1-6.219-8.56" }) });
 }
-function Wt({ status: e, size: n = "sm", className: r }) {
+function Ot({ status: e, size: n = "sm", className: r }) {
   const s = {
     sm: "w-2 h-2",
     md: "w-3 h-3",
     lg: "w-4 h-4"
-  }, a = {
+  }, i = {
     pending: "ash-status-pending",
     success: "ash-status-success",
     failed: "ash-status-failed"
@@ -616,67 +616,90 @@ function Wt({ status: e, size: n = "sm", className: r }) {
       className: p(
         "rounded-full flex-shrink-0",
         s[n],
-        a[e],
+        i[e],
         r
       )
     }
   );
 }
-function Ye({ actionType: e, className: n = "w-4 h-4" }) {
+function Xe({ actionType: e, className: n = "w-4 h-4" }) {
   switch (e.action) {
     case "command_run":
-      return /* @__PURE__ */ t(Me, { className: n });
+      return /* @__PURE__ */ t(Ie, { className: n });
     case "file_read":
-      return /* @__PURE__ */ t(We, { className: n });
+      return /* @__PURE__ */ t(Be, { className: n });
     case "file_edit":
       return /* @__PURE__ */ t(Oe, { className: n });
     case "file_write":
-      return /* @__PURE__ */ t(vt, { className: n });
+      return /* @__PURE__ */ t(Nt, { className: n });
     case "search":
-      return /* @__PURE__ */ t(_e, { className: n });
+      return /* @__PURE__ */ t(Se, { className: n });
     case "glob":
-      return /* @__PURE__ */ t(kt, { className: n });
+      return /* @__PURE__ */ t(Tt, { className: n });
     case "web_fetch":
-      return /* @__PURE__ */ t(yt, { className: n });
+      return /* @__PURE__ */ t(kt, { className: n });
     case "web_search":
-      return /* @__PURE__ */ t(_e, { className: n });
+      return /* @__PURE__ */ t(Se, { className: n });
     case "mcp_tool":
-      return /* @__PURE__ */ t(bt, { className: n });
+      return /* @__PURE__ */ t(Ct, { className: n });
     case "todo_write":
-      return /* @__PURE__ */ t(Dt, { className: n });
+      return /* @__PURE__ */ t(Wt, { className: n });
     case "agent_tool":
-      return /* @__PURE__ */ t(de, { className: n });
+      return /* @__PURE__ */ t(xe, { className: n });
     case "generic_tool":
     default:
-      return /* @__PURE__ */ t(Nt, { className: n });
+      return /* @__PURE__ */ t(_t, { className: n });
   }
 }
-function se({
+function oe({
   children: e,
   maxHeight: n = 200,
   language: r,
   showLineNumbers: s = !1,
-  className: a
+  className: i
 }) {
-  const [l, c] = N(!1), h = e.split(`
-`), o = h.length > 10 || e.length > 500;
-  return /* @__PURE__ */ i("div", { className: p("relative", a), children: [
+  const [l, c] = N(!1), [h, o] = N(!1), f = e.split(`
+`), d = f.length > 10 || e.length > 500, x = F(async () => {
+    try {
+      await navigator.clipboard.writeText(e), o(!0), setTimeout(() => o(!1), 2e3);
+    } catch (m) {
+      console.error("Failed to copy:", m);
+    }
+  }, [e]);
+  return /* @__PURE__ */ a("div", { className: p("relative rounded-lg overflow-hidden border border-white/10", i), children: [
+    /* @__PURE__ */ a("div", { className: "flex items-center justify-between px-4 py-2 bg-[var(--ash-code-header-bg)] border-b border-white/10", children: [
+      /* @__PURE__ */ t("span", { className: "text-xs text-white/60 font-medium", children: r || "code" }),
+      /* @__PURE__ */ t(
+        "button",
+        {
+          onClick: x,
+          className: "flex items-center gap-1.5 text-xs text-white/60 hover:text-white transition-colors",
+          children: h ? /* @__PURE__ */ a(_, { children: [
+            /* @__PURE__ */ t(Ye, { className: "w-3.5 h-3.5" }),
+            /* @__PURE__ */ t("span", { children: "Copied!" })
+          ] }) : /* @__PURE__ */ a(_, { children: [
+            /* @__PURE__ */ t(St, { className: "w-3.5 h-3.5" }),
+            /* @__PURE__ */ t("span", { children: "Copy" })
+          ] })
+        }
+      )
+    ] }),
     /* @__PURE__ */ t(
       "pre",
       {
         className: p(
-          "ash-tool-code-block text-xs font-mono text-white/90 p-3 rounded-xl overflow-x-auto whitespace-pre-wrap break-words",
-          !l && o && "overflow-y-hidden"
+          "text-xs font-mono text-white/90 p-4 bg-black/30 overflow-x-auto whitespace-pre-wrap break-words",
+          !l && d && "overflow-y-hidden"
         ),
-        style: !l && o ? { maxHeight: n } : void 0,
+        style: !l && d ? { maxHeight: n } : void 0,
         "data-language": r,
-        children: s ? /* @__PURE__ */ t("code", { children: h.map((w, d) => /* @__PURE__ */ i("span", { className: "block", children: [
-          /* @__PURE__ */ t("span", { className: "inline-block w-8 text-white/30 select-none text-right pr-2", children: d + 1 }),
-          /* @__PURE__ */ t("span", { className: "text-white/80", children: w })
-        ] }, d)) }) : /* @__PURE__ */ t("code", { className: "text-white/80", children: e })
+        children: s ? /* @__PURE__ */ t("code", { children: f.map((m, w) => /* @__PURE__ */ a("span", { className: "block", children: [
+          /* @__PURE__ */ t("span", { className: "inline-block w-8 text-white/30 select-none text-right pr-2", children: w + 1 }),
+          /* @__PURE__ */ t("span", { className: "text-white/80", children: m })
+        ] }, w)) }) : /* @__PURE__ */ t("code", { className: "text-white/80", children: e })
       }
     ),
-    o && !l && /* @__PURE__ */ t("div", { className: "absolute bottom-0 left-0 right-0 h-12 ash-truncate-fade flex items-end justify-center pb-2", children: /* @__PURE__ */ t(
+    d && !l && /* @__PURE__ */ t("div", { className: "absolute bottom-0 left-0 right-0 h-12 ash-truncate-fade flex items-end justify-center pb-2", children: /* @__PURE__ */ t(
       "button",
       {
         onClick: () => c(!0),
@@ -684,7 +707,7 @@ function se({
         children: "Show more"
       }
     ) }),
-    o && l && /* @__PURE__ */ t(
+    d && l && /* @__PURE__ */ t(
       "button",
       {
         onClick: () => c(!1),
@@ -694,59 +717,59 @@ function se({
     )
   ] });
 }
-function Te({ value: e, maxHeight: n, className: r }) {
+function Me({ value: e, maxHeight: n, className: r }) {
   const s = JSON.stringify(e, null, 2);
-  return /* @__PURE__ */ t(se, { maxHeight: n, className: r, children: s });
+  return /* @__PURE__ */ t(oe, { maxHeight: n, className: r, children: s });
 }
-function Ze({
+function et({
   toolCall: e,
   defaultExpanded: n = !1,
   className: r,
   depth: s = 0
 }) {
-  const [a, l] = N(n), [c, h] = N(""), o = B(null), { actionType: w, status: d, summary: m, nestedToolCalls: g, nestedToolCallCount: v, startedAt: S } = e, z = re(() => {
-    if (w.action !== "agent_tool")
+  const [i, l] = N(n), [c, h] = N(""), o = V(null), { actionType: f, status: d, summary: x, nestedToolCalls: m, nestedToolCallCount: w, startedAt: E } = e, D = ae(() => {
+    if (f.action !== "agent_tool")
       return null;
-    const P = w;
+    const W = f;
     return {
-      agentType: P.agentType,
-      description: P.description,
-      prompt: P.prompt
+      agentType: W.agentType,
+      description: W.description,
+      prompt: W.prompt
     };
-  }, [w]), M = v ?? (g == null ? void 0 : g.length) ?? 0, k = d === "pending";
-  if (j(() => {
-    if (k && S)
-      return h(He(S)), o.current = setInterval(() => {
-        h(He(S));
+  }, [f]), R = w ?? (m == null ? void 0 : m.length) ?? 0, T = d === "pending";
+  if (P(() => {
+    if (T && E)
+      return h(Ve(E)), o.current = setInterval(() => {
+        h(Ve(E));
       }, 1e3), () => {
         o.current && (clearInterval(o.current), o.current = null);
       };
-    k || (o.current && (clearInterval(o.current), o.current = null), h(""));
-  }, [k, S]), !z)
+    T || (o.current && (clearInterval(o.current), o.current = null), h(""));
+  }, [T, E]), !D)
     return null;
-  const { agentType: A, description: I, prompt: W } = z, F = s > 0 ? "ml-4" : "";
-  return /* @__PURE__ */ i(
+  const { agentType: X, description: S, prompt: G } = D, A = s > 0 ? "ml-4" : "";
+  return /* @__PURE__ */ a(
     "div",
     {
       className: p(
         "rounded-xl border bg-[var(--ash-surface-dark,#0a0a0a)] overflow-hidden",
-        k ? "border-yellow-500/30" : d === "failed" ? "border-red-500/30" : "border-white/10",
-        F,
+        T ? "border-yellow-500/30" : d === "failed" ? "border-red-500/30" : "border-white/10",
+        A,
         r
       ),
       children: [
-        /* @__PURE__ */ i(
+        /* @__PURE__ */ a(
           "button",
           {
-            onClick: () => l(!a),
+            onClick: () => l(!i),
             className: "w-full px-4 py-3 flex items-center gap-3 hover:bg-white/5 cursor-pointer transition-colors",
             children: [
               /* @__PURE__ */ t(
-                ve,
+                be,
                 {
                   className: p(
                     "w-4 h-4 text-white/40 transition-transform duration-200 shrink-0",
-                    a && "rotate-90"
+                    i && "rotate-90"
                   )
                 }
               ),
@@ -755,15 +778,15 @@ function Ze({
                 {
                   className: p(
                     "w-6 h-6 rounded-lg flex items-center justify-center shrink-0",
-                    k ? "bg-yellow-500/20" : d === "failed" ? "bg-red-500/20" : "bg-[var(--ash-accent)]/20"
+                    T ? "bg-yellow-500/20" : d === "failed" ? "bg-red-500/20" : "bg-[var(--ash-accent)]/20"
                   ),
-                  children: k ? /* @__PURE__ */ t(
-                    qe,
+                  children: T ? /* @__PURE__ */ t(
+                    He,
                     {
                       className: "w-3.5 h-3.5 text-yellow-400 animate-spin"
                     }
                   ) : /* @__PURE__ */ t(
-                    de,
+                    xe,
                     {
                       className: p(
                         "w-3.5 h-3.5",
@@ -778,46 +801,46 @@ function Ze({
                 {
                   className: p(
                     "px-2 py-0.5 rounded text-xs font-medium shrink-0",
-                    k ? "bg-yellow-500/20 text-yellow-400" : d === "failed" ? "bg-red-500/20 text-red-400" : "bg-white/10 text-white/70"
+                    T ? "bg-yellow-500/20 text-yellow-400" : d === "failed" ? "bg-red-500/20 text-red-400" : "bg-white/10 text-white/70"
                   ),
-                  children: A
+                  children: X
                 }
               ),
-              /* @__PURE__ */ t("span", { className: "text-sm text-white/80 truncate flex-1 text-left", children: I || m }),
-              M > 0 && /* @__PURE__ */ i("span", { className: "text-xs text-white/50 shrink-0", children: [
-                M,
+              /* @__PURE__ */ t("span", { className: "text-sm text-white/80 truncate flex-1 text-left", children: S || x }),
+              R > 0 && /* @__PURE__ */ a("span", { className: "text-xs text-white/50 shrink-0", children: [
+                R,
                 " tool call",
-                M !== 1 ? "s" : ""
+                R !== 1 ? "s" : ""
               ] }),
-              k && c && /* @__PURE__ */ i("div", { className: "flex items-center gap-1 text-xs text-white/40 shrink-0", children: [
-                /* @__PURE__ */ t(jt, { className: "w-3 h-3" }),
+              T && c && /* @__PURE__ */ a("div", { className: "flex items-center gap-1 text-xs text-white/40 shrink-0", children: [
+                /* @__PURE__ */ t(Bt, { className: "w-3 h-3" }),
                 /* @__PURE__ */ t("span", { children: c })
               ] }),
               /* @__PURE__ */ t("span", { className: "text-white/30 shrink-0", children: "..." })
             ]
           }
         ),
-        a && /* @__PURE__ */ i("div", { className: "border-t border-white/5 bg-black/20", children: [
-          W && /* @__PURE__ */ t("div", { className: "px-4 py-3 border-b border-white/5", children: /* @__PURE__ */ t("p", { className: "text-sm text-white/70 whitespace-pre-wrap", children: W.length > 500 ? W.substring(0, 500) + "..." : W }) }),
-          g && g.length > 0 && /* @__PURE__ */ t("div", { className: "p-3 space-y-2", children: g.map((P) => /* @__PURE__ */ t("div", { children: P.actionType.action === "agent_tool" ? /* @__PURE__ */ t(
-            Ze,
+        i && /* @__PURE__ */ a("div", { className: "border-t border-white/5 bg-black/20", children: [
+          G && /* @__PURE__ */ t("div", { className: "px-4 py-3 border-b border-white/5", children: /* @__PURE__ */ t("p", { className: "text-sm text-white/70 whitespace-pre-wrap", children: G.length > 500 ? G.substring(0, 500) + "..." : G }) }),
+          m && m.length > 0 && /* @__PURE__ */ t("div", { className: "p-3 space-y-2", children: m.map((W) => /* @__PURE__ */ t("div", { children: W.actionType.action === "agent_tool" ? /* @__PURE__ */ t(
+            et,
             {
-              toolCall: P,
+              toolCall: W,
               defaultExpanded: !1,
               depth: s + 1
             }
           ) : /* @__PURE__ */ t(
-            Be,
+            ze,
             {
-              toolCall: P,
+              toolCall: W,
               defaultExpanded: !1
             }
-          ) }, P.id)) }),
-          (!g || g.length === 0) && k && /* @__PURE__ */ t("div", { className: "px-4 py-6 flex items-center justify-center", children: /* @__PURE__ */ i("div", { className: "flex items-center gap-2 text-sm text-white/40", children: [
-            /* @__PURE__ */ t(qe, { className: "w-4 h-4 animate-spin" }),
+          ) }, W.id)) }),
+          (!m || m.length === 0) && T && /* @__PURE__ */ t("div", { className: "px-4 py-6 flex items-center justify-center", children: /* @__PURE__ */ a("div", { className: "flex items-center gap-2 text-sm text-white/40", children: [
+            /* @__PURE__ */ t(He, { className: "w-4 h-4 animate-spin" }),
             /* @__PURE__ */ t("span", { children: "Agent is working..." })
           ] }) }),
-          (!g || g.length === 0) && !k && /* @__PURE__ */ t("div", { className: "px-4 py-4 text-sm text-white/40 text-center", children: "No tool calls recorded" })
+          (!m || m.length === 0) && !T && /* @__PURE__ */ t("div", { className: "px-4 py-4 text-sm text-white/40 text-center", children: "No tool calls recorded" })
         ] })
       ]
     }
@@ -827,20 +850,20 @@ function L({ children: e }) {
   return /* @__PURE__ */ t("div", { className: "ash-tool-section-header", children: e });
 }
 function $({ children: e }) {
-  return /* @__PURE__ */ t("div", { className: "px-3 py-2", children: e });
+  return /* @__PURE__ */ t("div", { className: "px-3 py-1.5", children: e });
 }
-function Ot({ action: e }) {
+function zt({ action: e }) {
   var n;
-  return /* @__PURE__ */ i(_, { children: [
-    e.command && /* @__PURE__ */ i(_, { children: [
+  return /* @__PURE__ */ a(_, { children: [
+    e.command && /* @__PURE__ */ a(_, { children: [
       /* @__PURE__ */ t(L, { children: "COMMAND" }),
-      /* @__PURE__ */ t($, { children: /* @__PURE__ */ t(se, { children: e.command }) })
+      /* @__PURE__ */ t($, { children: /* @__PURE__ */ t(oe, { children: e.command }) })
     ] }),
-    ((n = e.result) == null ? void 0 : n.output) && /* @__PURE__ */ i(_, { children: [
+    ((n = e.result) == null ? void 0 : n.output) && /* @__PURE__ */ a(_, { children: [
       /* @__PURE__ */ t(L, { children: "OUTPUT" }),
-      /* @__PURE__ */ i($, { children: [
-        /* @__PURE__ */ t(se, { maxHeight: 300, children: e.result.output }),
-        e.result.exitCode !== void 0 && e.result.exitCode !== 0 && /* @__PURE__ */ i("div", { className: "mt-2 text-xs text-red-400", children: [
+      /* @__PURE__ */ a($, { children: [
+        /* @__PURE__ */ t(oe, { maxHeight: 300, children: e.result.output }),
+        e.result.exitCode !== void 0 && e.result.exitCode !== 0 && /* @__PURE__ */ a("div", { className: "mt-2 text-xs text-red-400", children: [
           "Exit code: ",
           e.result.exitCode
         ] })
@@ -848,18 +871,18 @@ function Ot({ action: e }) {
     ] })
   ] });
 }
-function Bt({ action: e }) {
-  return /* @__PURE__ */ i(_, { children: [
+function Ft({ action: e }) {
+  return /* @__PURE__ */ a(_, { children: [
     /* @__PURE__ */ t(L, { children: "PATH" }),
-    /* @__PURE__ */ i($, { children: [
+    /* @__PURE__ */ a($, { children: [
       /* @__PURE__ */ t("code", { className: "text-xs font-mono bg-white/10 text-white/90 px-1 py-0.5 rounded", children: e.path }),
-      (e.offset !== void 0 || e.limit !== void 0) && /* @__PURE__ */ i("div", { className: "mt-1 text-xs text-white/50", children: [
-        e.offset !== void 0 && /* @__PURE__ */ i("span", { children: [
+      (e.offset !== void 0 || e.limit !== void 0) && /* @__PURE__ */ a("div", { className: "mt-1 text-xs text-white/50", children: [
+        e.offset !== void 0 && /* @__PURE__ */ a("span", { children: [
           "Offset: ",
           e.offset
         ] }),
         e.offset !== void 0 && e.limit !== void 0 && /* @__PURE__ */ t("span", { children: " · " }),
-        e.limit !== void 0 && /* @__PURE__ */ i("span", { children: [
+        e.limit !== void 0 && /* @__PURE__ */ a("span", { children: [
           "Limit: ",
           e.limit
         ] })
@@ -867,45 +890,45 @@ function Bt({ action: e }) {
     ] })
   ] });
 }
-function zt({ action: e }) {
-  return /* @__PURE__ */ i(_, { children: [
+function Pt({ action: e }) {
+  return /* @__PURE__ */ a(_, { children: [
     /* @__PURE__ */ t(L, { children: "PATH" }),
     /* @__PURE__ */ t($, { children: /* @__PURE__ */ t("code", { className: "text-xs font-mono bg-white/10 text-white/90 px-1 py-0.5 rounded", children: e.path }) }),
-    e.oldString && /* @__PURE__ */ i(_, { children: [
+    e.oldString && /* @__PURE__ */ a(_, { children: [
       /* @__PURE__ */ t(L, { children: "OLD" }),
-      /* @__PURE__ */ t($, { children: /* @__PURE__ */ t(se, { children: e.oldString }) })
+      /* @__PURE__ */ t($, { children: /* @__PURE__ */ t(oe, { children: e.oldString }) })
     ] }),
-    e.newString && /* @__PURE__ */ i(_, { children: [
+    e.newString && /* @__PURE__ */ a(_, { children: [
       /* @__PURE__ */ t(L, { children: "NEW" }),
-      /* @__PURE__ */ t($, { children: /* @__PURE__ */ t(se, { children: e.newString }) })
+      /* @__PURE__ */ t($, { children: /* @__PURE__ */ t(oe, { children: e.newString }) })
     ] })
   ] });
 }
-function Ft({ action: e }) {
-  return /* @__PURE__ */ i(_, { children: [
+function Gt({ action: e }) {
+  return /* @__PURE__ */ a(_, { children: [
     /* @__PURE__ */ t(L, { children: "PATH" }),
     /* @__PURE__ */ t($, { children: /* @__PURE__ */ t("code", { className: "text-xs font-mono bg-white/10 text-white/90 px-1 py-0.5 rounded", children: e.path }) }),
-    e.content && /* @__PURE__ */ i(_, { children: [
+    e.content && /* @__PURE__ */ a(_, { children: [
       /* @__PURE__ */ t(L, { children: "CONTENT" }),
-      /* @__PURE__ */ t($, { children: /* @__PURE__ */ t(se, { maxHeight: 300, children: e.content }) })
+      /* @__PURE__ */ t($, { children: /* @__PURE__ */ t(oe, { maxHeight: 300, children: e.content }) })
     ] })
   ] });
 }
-function Pt({ action: e }) {
-  return /* @__PURE__ */ i(_, { children: [
+function Vt({ action: e }) {
+  return /* @__PURE__ */ a(_, { children: [
     /* @__PURE__ */ t(L, { children: "PATTERN" }),
-    /* @__PURE__ */ i($, { children: [
+    /* @__PURE__ */ a($, { children: [
       /* @__PURE__ */ t("code", { className: "text-xs font-mono bg-white/10 text-white/90 px-1 py-0.5 rounded", children: e.pattern }),
-      (e.path || e.glob || e.type) && /* @__PURE__ */ i("div", { className: "mt-1 text-xs text-white/50", children: [
-        e.path && /* @__PURE__ */ i("span", { children: [
+      (e.path || e.glob || e.type) && /* @__PURE__ */ a("div", { className: "mt-1 text-xs text-white/50", children: [
+        e.path && /* @__PURE__ */ a("span", { children: [
           "Path: ",
           e.path
         ] }),
-        e.glob && /* @__PURE__ */ i("span", { children: [
+        e.glob && /* @__PURE__ */ a("span", { children: [
           "Glob: ",
           e.glob
         ] }),
-        e.type && /* @__PURE__ */ i("span", { children: [
+        e.type && /* @__PURE__ */ a("span", { children: [
           "Type: ",
           e.type
         ] })
@@ -914,11 +937,11 @@ function Pt({ action: e }) {
   ] });
 }
 function Ht({ action: e }) {
-  return /* @__PURE__ */ i(_, { children: [
+  return /* @__PURE__ */ a(_, { children: [
     /* @__PURE__ */ t(L, { children: "PATTERN" }),
-    /* @__PURE__ */ i($, { children: [
+    /* @__PURE__ */ a($, { children: [
       /* @__PURE__ */ t("code", { className: "text-xs font-mono bg-white/10 text-white/90 px-1 py-0.5 rounded", children: e.pattern }),
-      e.path && /* @__PURE__ */ i("div", { className: "mt-1 text-xs text-white/50", children: [
+      e.path && /* @__PURE__ */ a("div", { className: "mt-1 text-xs text-white/50", children: [
         "Path: ",
         e.path
       ] })
@@ -926,9 +949,9 @@ function Ht({ action: e }) {
   ] });
 }
 function qt({ action: e }) {
-  return /* @__PURE__ */ i(_, { children: [
+  return /* @__PURE__ */ a(_, { children: [
     /* @__PURE__ */ t(L, { children: "URL" }),
-    /* @__PURE__ */ i($, { children: [
+    /* @__PURE__ */ a($, { children: [
       /* @__PURE__ */ t(
         "a",
         {
@@ -943,49 +966,49 @@ function qt({ action: e }) {
     ] })
   ] });
 }
-function Vt({ action: e }) {
-  return /* @__PURE__ */ i(_, { children: [
+function Jt({ action: e }) {
+  return /* @__PURE__ */ a(_, { children: [
     /* @__PURE__ */ t(L, { children: "QUERY" }),
     /* @__PURE__ */ t($, { children: /* @__PURE__ */ t("span", { className: "text-sm text-white/90", children: e.query }) })
   ] });
 }
-function Gt({ action: e, isError: n }) {
-  return /* @__PURE__ */ i(_, { children: [
+function Ut({ action: e, isError: n }) {
+  return /* @__PURE__ */ a(_, { children: [
     /* @__PURE__ */ t(L, { children: "TOOL" }),
-    /* @__PURE__ */ t($, { children: /* @__PURE__ */ i("code", { className: "text-xs font-mono bg-white/10 text-white/90 px-1 py-0.5 rounded", children: [
+    /* @__PURE__ */ t($, { children: /* @__PURE__ */ a("code", { className: "text-xs font-mono bg-white/10 text-white/90 px-1 py-0.5 rounded", children: [
       e.serverName,
       ":",
       e.toolName
     ] }) }),
-    e.arguments && /* @__PURE__ */ i(_, { children: [
+    e.arguments && /* @__PURE__ */ a(_, { children: [
       /* @__PURE__ */ t(L, { children: "ARGS" }),
-      /* @__PURE__ */ t($, { children: /* @__PURE__ */ t(Te, { value: e.arguments }) })
+      /* @__PURE__ */ t($, { children: /* @__PURE__ */ t(Me, { value: e.arguments }) })
     ] }),
-    e.result && /* @__PURE__ */ i(_, { children: [
+    e.result && /* @__PURE__ */ a(_, { children: [
       /* @__PURE__ */ t(L, { children: n ? "ERROR" : "RESULT" }),
-      /* @__PURE__ */ t($, { children: /* @__PURE__ */ t("div", { className: n ? "text-red-400" : "", children: e.result.type === "markdown" ? /* @__PURE__ */ t(se, { children: String(e.result.value) }) : /* @__PURE__ */ t(Te, { value: e.result.value }) }) })
+      /* @__PURE__ */ t($, { children: /* @__PURE__ */ t("div", { className: n ? "text-red-400" : "", children: e.result.type === "markdown" ? /* @__PURE__ */ t(oe, { children: String(e.result.value) }) : /* @__PURE__ */ t(Me, { value: e.result.value }) }) })
     ] })
   ] });
 }
-function Jt({ action: e, isError: n }) {
-  return /* @__PURE__ */ i(_, { children: [
-    e.arguments && /* @__PURE__ */ i(_, { children: [
+function Kt({ action: e, isError: n }) {
+  return /* @__PURE__ */ a(_, { children: [
+    e.arguments && /* @__PURE__ */ a(_, { children: [
       /* @__PURE__ */ t(L, { children: "ARGS" }),
-      /* @__PURE__ */ t($, { children: /* @__PURE__ */ t(Te, { value: e.arguments }) })
+      /* @__PURE__ */ t($, { children: /* @__PURE__ */ t(Me, { value: e.arguments }) })
     ] }),
-    e.result && /* @__PURE__ */ i(_, { children: [
+    e.result && /* @__PURE__ */ a(_, { children: [
       /* @__PURE__ */ t(L, { children: n ? "ERROR" : "RESULT" }),
-      /* @__PURE__ */ t($, { children: /* @__PURE__ */ t("div", { className: n ? "text-red-400" : "", children: e.result.type === "markdown" ? /* @__PURE__ */ t(se, { children: String(e.result.value) }) : /* @__PURE__ */ t(Te, { value: e.result.value }) }) })
+      /* @__PURE__ */ t($, { children: /* @__PURE__ */ t("div", { className: n ? "text-red-400" : "", children: e.result.type === "markdown" ? /* @__PURE__ */ t(oe, { children: String(e.result.value) }) : /* @__PURE__ */ t(Me, { value: e.result.value }) }) })
     ] })
   ] });
 }
-function Ut({ action: e }) {
+function Yt({ action: e }) {
   const { todos: n, stats: r } = e;
-  return /* @__PURE__ */ i(_, { children: [
-    r && /* @__PURE__ */ i(_, { children: [
+  return /* @__PURE__ */ a(_, { children: [
+    r && /* @__PURE__ */ a(_, { children: [
       /* @__PURE__ */ t(L, { children: "PROGRESS" }),
-      /* @__PURE__ */ i($, { children: [
-        /* @__PURE__ */ i("div", { className: "flex items-center gap-3", children: [
+      /* @__PURE__ */ a($, { children: [
+        /* @__PURE__ */ a("div", { className: "flex items-center gap-3", children: [
           /* @__PURE__ */ t("div", { className: "flex-1 h-2 bg-white/10 rounded-full overflow-hidden", children: /* @__PURE__ */ t(
             "div",
             {
@@ -993,18 +1016,18 @@ function Ut({ action: e }) {
               style: { width: `${r.total > 0 ? r.completed / r.total * 100 : 0}%` }
             }
           ) }),
-          /* @__PURE__ */ i("span", { className: "text-xs text-white/60 tabular-nums", children: [
+          /* @__PURE__ */ a("span", { className: "text-xs text-white/60 tabular-nums", children: [
             r.completed,
             "/",
             r.total
           ] })
         ] }),
-        /* @__PURE__ */ i("div", { className: "flex gap-3 mt-2 text-xs", children: [
-          r.inProgress > 0 && /* @__PURE__ */ i("span", { className: "text-yellow-400", children: [
+        /* @__PURE__ */ a("div", { className: "flex gap-3 mt-2 text-xs", children: [
+          r.inProgress > 0 && /* @__PURE__ */ a("span", { className: "text-yellow-400", children: [
             r.inProgress,
             " in progress"
           ] }),
-          r.pending > 0 && /* @__PURE__ */ i("span", { className: "text-white/40", children: [
+          r.pending > 0 && /* @__PURE__ */ a("span", { className: "text-white/40", children: [
             r.pending,
             " pending"
           ] })
@@ -1012,9 +1035,9 @@ function Ut({ action: e }) {
       ] })
     ] }),
     /* @__PURE__ */ t(L, { children: "TASKS" }),
-    /* @__PURE__ */ t($, { children: /* @__PURE__ */ t("div", { className: "space-y-1.5", children: n.map((s, a) => {
+    /* @__PURE__ */ t($, { children: /* @__PURE__ */ t("div", { className: "space-y-1.5", children: n.map((s, i) => {
       const l = s.status === "in_progress" ? s.activeForm : s.content;
-      return /* @__PURE__ */ i(
+      return /* @__PURE__ */ a(
         "div",
         {
           className: p(
@@ -1023,8 +1046,8 @@ function Ut({ action: e }) {
             s.status === "in_progress" && "bg-yellow-500/10 -mx-2 px-2 rounded"
           ),
           children: [
-            s.status === "completed" ? /* @__PURE__ */ t(Et, { className: "w-4 h-4 text-emerald-400 shrink-0 mt-0.5" }) : s.status === "in_progress" ? /* @__PURE__ */ t(_t, { className: "w-4 h-4 text-yellow-400 animate-spin shrink-0 mt-0.5" }) : /* @__PURE__ */ t(Rt, { className: "w-4 h-4 text-white/30 shrink-0 mt-0.5" }),
-            /* @__PURE__ */ i(
+            s.status === "completed" ? /* @__PURE__ */ t($t, { className: "w-4 h-4 text-emerald-400 shrink-0 mt-0.5" }) : s.status === "in_progress" ? /* @__PURE__ */ t(Mt, { className: "w-4 h-4 text-yellow-400 animate-spin shrink-0 mt-0.5" }) : /* @__PURE__ */ t(jt, { className: "w-4 h-4 text-white/30 shrink-0 mt-0.5" }),
+            /* @__PURE__ */ a(
               "span",
               {
                 className: p(
@@ -1032,8 +1055,8 @@ function Ut({ action: e }) {
                   s.status === "completed" ? "text-white/50 line-through" : "text-white/80"
                 ),
                 children: [
-                  /* @__PURE__ */ i("span", { className: "text-white/40 mr-1.5", children: [
-                    a + 1,
+                  /* @__PURE__ */ a("span", { className: "text-white/40 mr-1.5", children: [
+                    i + 1,
                     "."
                   ] }),
                   l
@@ -1042,40 +1065,40 @@ function Ut({ action: e }) {
             )
           ]
         },
-        `${s.content}-${a}`
+        `${s.content}-${i}`
       );
     }) }) })
   ] });
 }
-function Kt({ actionType: e, isError: n }) {
+function Zt({ actionType: e, isError: n }) {
   switch (e.action) {
     case "command_run":
-      return /* @__PURE__ */ t(Ot, { action: e });
+      return /* @__PURE__ */ t(zt, { action: e });
     case "file_read":
-      return /* @__PURE__ */ t(Bt, { action: e });
+      return /* @__PURE__ */ t(Ft, { action: e });
     case "file_edit":
-      return /* @__PURE__ */ t(zt, { action: e });
+      return /* @__PURE__ */ t(Pt, { action: e });
     case "file_write":
-      return /* @__PURE__ */ t(Ft, { action: e });
+      return /* @__PURE__ */ t(Gt, { action: e });
     case "search":
-      return /* @__PURE__ */ t(Pt, { action: e });
+      return /* @__PURE__ */ t(Vt, { action: e });
     case "glob":
       return /* @__PURE__ */ t(Ht, { action: e });
     case "web_fetch":
       return /* @__PURE__ */ t(qt, { action: e });
     case "web_search":
-      return /* @__PURE__ */ t(Vt, { action: e });
+      return /* @__PURE__ */ t(Jt, { action: e });
     case "mcp_tool":
-      return /* @__PURE__ */ t(Gt, { action: e, isError: n });
+      return /* @__PURE__ */ t(Ut, { action: e, isError: n });
     case "generic_tool":
-      return /* @__PURE__ */ t(Jt, { action: e, isError: n });
+      return /* @__PURE__ */ t(Kt, { action: e, isError: n });
     case "todo_write":
-      return /* @__PURE__ */ t(Ut, { action: e });
+      return /* @__PURE__ */ t(Yt, { action: e });
     default:
       return null;
   }
 }
-function Yt(e) {
+function Qt(e) {
   var n;
   switch (e.action) {
     case "command_run":
@@ -1107,23 +1130,23 @@ function Yt(e) {
       return !1;
   }
 }
-function Be({ toolCall: e, defaultExpanded: n = !1, className: r }) {
-  const [s, a] = N(n), { actionType: l, status: c, summary: h } = e;
+function ze({ toolCall: e, defaultExpanded: n = !1, className: r }) {
+  const [s, i] = N(n), { actionType: l, status: c, summary: h } = e;
   if (l.action === "agent_tool")
     return /* @__PURE__ */ t(
-      Ze,
+      et,
       {
         toolCall: e,
         defaultExpanded: n,
         className: r
       }
     );
-  const o = Yt(l);
-  return /* @__PURE__ */ i(
+  const o = Qt(l);
+  return /* @__PURE__ */ a(
     "div",
     {
       className: p(
-        "rounded-xl border bg-[var(--ash-surface-dark,#0a0a0a)] overflow-hidden",
+        "rounded-lg border bg-[var(--ash-surface-dark,#0a0a0a)] overflow-hidden",
         {
           pending: "border-yellow-500/30 ash-tool-status-pending",
           success: "border-white/10",
@@ -1132,40 +1155,40 @@ function Be({ toolCall: e, defaultExpanded: n = !1, className: r }) {
         r
       ),
       children: [
-        /* @__PURE__ */ i(
+        /* @__PURE__ */ a(
           "button",
           {
-            onClick: () => o && a(!s),
+            onClick: () => o && i(!s),
             className: p(
-              "w-full px-4 py-3 flex items-center justify-between transition-colors",
+              "w-full px-3 py-2 flex items-center justify-between transition-colors",
               o ? "hover:bg-white/5 cursor-pointer" : "cursor-default"
             ),
             disabled: !o,
             children: [
-              /* @__PURE__ */ i("div", { className: "flex items-center gap-3 min-w-0 flex-1", children: [
+              /* @__PURE__ */ a("div", { className: "flex items-center gap-2 min-w-0 flex-1", children: [
                 /* @__PURE__ */ t("div", { className: p(
-                  "w-6 h-6 rounded-lg flex items-center justify-center shrink-0",
+                  "w-5 h-5 rounded flex items-center justify-center shrink-0",
                   c === "pending" ? "bg-yellow-500/20" : c === "failed" ? "bg-red-500/20" : "bg-[var(--ash-accent)]/20"
                 ), children: /* @__PURE__ */ t(
-                  Ye,
+                  Xe,
                   {
                     actionType: l,
                     className: p(
-                      "w-3.5 h-3.5",
+                      "w-3 h-3",
                       c === "pending" ? "text-yellow-400" : c === "failed" ? "text-red-400" : "text-[var(--ash-accent)]"
                     )
                   }
                 ) }),
-                /* @__PURE__ */ t("span", { className: "text-sm font-medium text-white shrink-0", children: Ue(l) }),
-                /* @__PURE__ */ t("span", { className: "font-mono text-sm truncate text-white/60 min-w-0", children: h })
+                /* @__PURE__ */ t("span", { className: "text-[13px] font-medium text-white shrink-0", children: Ke(l) }),
+                /* @__PURE__ */ t("span", { className: "font-mono text-[12px] truncate text-white/50 min-w-0", children: h })
               ] }),
-              /* @__PURE__ */ i("div", { className: "flex items-center gap-2 shrink-0", children: [
-                /* @__PURE__ */ t(Wt, { status: c, size: "sm" }),
+              /* @__PURE__ */ a("div", { className: "flex items-center gap-1.5 shrink-0", children: [
+                /* @__PURE__ */ t(Ot, { status: c, size: "sm" }),
                 o && /* @__PURE__ */ t(
-                  je,
+                  We,
                   {
                     className: p(
-                      "w-4 h-4 text-white/40 transition-transform duration-200",
+                      "w-3.5 h-3.5 text-white/30 transition-transform duration-200",
                       s && "rotate-180"
                     )
                   }
@@ -1174,31 +1197,36 @@ function Be({ toolCall: e, defaultExpanded: n = !1, className: r }) {
             ]
           }
         ),
-        s && o && /* @__PURE__ */ i("div", { className: "border-t border-white/5 max-h-[400px] overflow-y-auto ash-scrollbar bg-black/20", children: [
-          /* @__PURE__ */ t(Kt, { actionType: l, isError: e.isError || c === "failed" }),
-          c === "success" && /* @__PURE__ */ t("div", { className: "px-4 py-3 border-t border-white/5 bg-[var(--ash-accent)]/5", children: /* @__PURE__ */ i("div", { className: "flex items-center gap-2", children: [
-            /* @__PURE__ */ t(Ct, { className: "w-4 h-4 text-[var(--ash-accent)]" }),
-            /* @__PURE__ */ t("span", { className: "text-sm text-[var(--ash-accent)] font-medium", children: "Completed successfully" })
+        s && o && /* @__PURE__ */ a("div", { className: "border-t border-white/5 max-h-[350px] overflow-y-auto ash-scrollbar bg-black/20", children: [
+          /* @__PURE__ */ t(Zt, { actionType: l, isError: e.isError || c === "failed" }),
+          c === "success" && /* @__PURE__ */ t("div", { className: "px-3 py-2 border-t border-white/5 bg-[var(--ash-accent)]/5", children: /* @__PURE__ */ a("div", { className: "flex items-center gap-1.5", children: [
+            /* @__PURE__ */ t(Ye, { className: "w-3.5 h-3.5 text-[var(--ash-accent)]" }),
+            /* @__PURE__ */ t("span", { className: "text-[12px] text-[var(--ash-accent)] font-medium", children: "Completed" })
           ] }) }),
-          c === "failed" && /* @__PURE__ */ t("div", { className: "px-4 py-3 border-t border-red-500/20 bg-red-500/10", children: /* @__PURE__ */ i("div", { className: "flex items-center gap-2", children: [
-            /* @__PURE__ */ t(It, { className: "w-4 h-4 text-red-400" }),
-            /* @__PURE__ */ t("span", { className: "text-sm text-red-400 font-medium", children: "Tool call failed" })
+          c === "failed" && /* @__PURE__ */ t("div", { className: "px-3 py-2 border-t border-red-500/20 bg-red-500/10", children: /* @__PURE__ */ a("div", { className: "flex items-center gap-1.5", children: [
+            /* @__PURE__ */ t(Rt, { className: "w-3.5 h-3.5 text-red-400" }),
+            /* @__PURE__ */ t("span", { className: "text-[12px] text-red-400 font-medium", children: "Failed" })
           ] }) })
         ] })
       ]
     }
   );
 }
-var Zt = lt(() => import("./index-DJwpy-R5.js"));
-function ze({ children: e, fallback: n, className: r }) {
-  const [s, a] = N(!1);
-  return j(() => {
-    a(!0);
-  }, []), s ? /* @__PURE__ */ t(ot, { fallback: /* @__PURE__ */ t("span", { className: r, children: n ?? e }), children: /* @__PURE__ */ t(Zt, { children: e }) }) : /* @__PURE__ */ t("span", { className: r, children: n ?? e });
+var Xt = dt(() => import("./index-DJwpy-R5.js"));
+function Fe({ children: e, fallback: n, components: r, className: s }) {
+  const [i, l] = N(!1);
+  P(() => {
+    l(!0);
+  }, []);
+  const c = ae(() => {
+    if (r)
+      return r;
+  }, [r]);
+  return i ? /* @__PURE__ */ t(ut, { fallback: /* @__PURE__ */ t("span", { className: s, children: n ?? e }), children: /* @__PURE__ */ t(Xt, { components: c, children: e }) }) : /* @__PURE__ */ t("span", { className: s, children: n ?? e });
 }
-function Qt({ segment: e }) {
+function en({ segment: e }) {
   const n = e.color ? `${e.color}20` : "rgba(34, 197, 94, 0.2)", r = e.color || "#22c55e", s = e.color ? `${e.color}40` : "rgba(34, 197, 94, 0.4)";
-  return /* @__PURE__ */ i(
+  return /* @__PURE__ */ a(
     "span",
     {
       className: "inline-flex items-center px-2 py-0.5 rounded-md text-xs font-medium mx-0.5",
@@ -1215,20 +1243,20 @@ function Qt({ segment: e }) {
     }
   );
 }
-function Xt({
+function tn({
   content: e,
   renderers: n,
   className: r
 }) {
-  return /* @__PURE__ */ t("div", { className: p("rich-content", r), children: e.map((s, a) => {
-    const l = `segment-${a}`;
+  return /* @__PURE__ */ t("div", { className: p("rich-content", r), children: e.map((s, i) => {
+    const l = `segment-${i}`;
     switch (s.type) {
       case "text":
-        return /* @__PURE__ */ t(Le, { children: /* @__PURE__ */ t(ze, { children: s.content }) }, l);
+        return /* @__PURE__ */ t($e, { children: /* @__PURE__ */ t(Fe, { children: s.content }) }, l);
       case "mention":
-        return n != null && n.renderMention ? /* @__PURE__ */ t(Le, { children: n.renderMention({ segment: s }) }, l) : /* @__PURE__ */ t(Qt, { segment: s }, l);
+        return n != null && n.renderMention ? /* @__PURE__ */ t($e, { children: n.renderMention({ segment: s }) }, l) : /* @__PURE__ */ t(en, { segment: s }, l);
       case "component":
-        return n != null && n.renderComponent ? /* @__PURE__ */ t(Le, { children: n.renderComponent({ segment: s }) }, l) : /* @__PURE__ */ i("code", { className: "text-xs text-orange-400", children: [
+        return n != null && n.renderComponent ? /* @__PURE__ */ t($e, { children: n.renderComponent({ segment: s }) }, l) : /* @__PURE__ */ a("code", { className: "text-xs text-orange-400", children: [
           "[component: ",
           s.componentType,
           "]"
@@ -1238,10 +1266,10 @@ function Xt({
     }
   }) });
 }
-function en({ options: e, onSelect: n, className: r }) {
+function nn({ options: e, onSelect: n, className: r }) {
   return /* @__PURE__ */ t("div", { className: p("grid gap-2 mt-3", r), style: {
     gridTemplateColumns: "repeat(auto-fit, minmax(200px, 1fr))"
-  }, children: e.map((s) => /* @__PURE__ */ i(
+  }, children: e.map((s) => /* @__PURE__ */ a(
     "button",
     {
       onClick: () => n(s),
@@ -1262,7 +1290,7 @@ function en({ options: e, onSelect: n, className: r }) {
           "group-hover:bg-[var(--ash-accent)]/30",
           "transition-colors duration-200"
         ), children: s.id }),
-        /* @__PURE__ */ i("div", { className: "flex-1 min-w-0", children: [
+        /* @__PURE__ */ a("div", { className: "flex-1 min-w-0", children: [
           /* @__PURE__ */ t("div", { className: "text-sm font-medium text-white/90 group-hover:text-white transition-colors", children: s.label }),
           s.description && /* @__PURE__ */ t("div", { className: "text-xs text-white/50 mt-0.5 line-clamp-2 group-hover:text-white/60 transition-colors", children: s.description })
         ] }),
@@ -1286,7 +1314,37 @@ function en({ options: e, onSelect: n, className: r }) {
     s.id
   )) });
 }
-function tn(e) {
+var Ne = {
+  dense: {
+    text: "text-xs",
+    padding: "px-2 py-1",
+    gap: "gap-1.5",
+    avatar: "w-4 h-4",
+    messageGap: "space-y-0.5"
+  },
+  compact: {
+    text: "text-[13px]",
+    padding: "px-3 py-2",
+    gap: "gap-2",
+    avatar: "w-5 h-5",
+    messageGap: "space-y-1"
+  },
+  default: {
+    text: "text-sm",
+    padding: "px-4 py-3",
+    gap: "gap-3",
+    avatar: "w-6 h-6",
+    messageGap: "space-y-2"
+  },
+  comfortable: {
+    text: "text-[15px]",
+    padding: "px-5 py-4",
+    gap: "gap-4",
+    avatar: "w-7 h-7",
+    messageGap: "space-y-3"
+  }
+};
+function rn(e) {
   const n = "[Uploaded files available at /uploads/]", r = e.indexOf(n);
   if (r === -1)
     return { text: e, files: [] };
@@ -1294,141 +1352,240 @@ function tn(e) {
 `).filter((c) => c.startsWith("- ")).map((c) => c.substring(2).trim());
   return { text: s, files: l };
 }
-function nn({ entry: e, className: n }) {
-  const { text: r, files: s } = tn(e.content);
-  return /* @__PURE__ */ i("div", { className: p("flex gap-3 justify-end ash-animate-fade-in", n), children: [
-    /* @__PURE__ */ i("div", { className: "max-w-[85%]", children: [
-      /* @__PURE__ */ t("div", { className: "rounded-2xl p-4 bg-[var(--ash-accent)] text-[var(--ash-accent-foreground)]", children: /* @__PURE__ */ t("p", { className: "text-sm leading-relaxed whitespace-pre-wrap", children: r || "(files attached)" }) }),
-      s.length > 0 && /* @__PURE__ */ i("div", { className: "mt-2 pt-2 border-t border-[var(--ash-accent-foreground)]/20", children: [
-        /* @__PURE__ */ i("div", { className: "text-xs text-[var(--ash-accent-foreground)]/60 mb-1 flex items-center gap-1", children: [
-          /* @__PURE__ */ t(Lt, { className: "w-3 h-3" }),
-          "Attached Files"
+function sn({
+  entry: e,
+  variant: n = "bubble",
+  scale: r = "compact",
+  showAvatar: s = !1,
+  // Hidden by default for ChatGPT style
+  showTimestamp: i = !0,
+  renderMetadata: l,
+  metadata: c,
+  className: h
+}) {
+  const { text: o, files: f } = rn(e.content), d = Ne[r], x = {
+    bubble: "rounded-[20px] bg-[var(--ash-user-bg)] text-[var(--ash-user-text)] border border-[var(--ash-user-border)]",
+    plain: "bg-transparent text-[var(--ash-text-primary)]",
+    minimal: "bg-transparent text-[var(--ash-text-secondary)]"
+  };
+  return /* @__PURE__ */ a(
+    "div",
+    {
+      "data-message-role": "user",
+      className: p("flex justify-end ash-animate-fade-in pr-1", d.gap, h),
+      children: [
+        /* @__PURE__ */ a("div", { className: "max-w-[85%] flex flex-col items-end", children: [
+          /* @__PURE__ */ a("div", { className: p(x[n], n === "bubble" && "px-4 py-3"), children: [
+            /* @__PURE__ */ t("p", { className: p(d.text, "leading-snug whitespace-pre-wrap"), children: o || "(files attached)" }),
+            f.length > 0 && n === "bubble" && /* @__PURE__ */ t("div", { className: "mt-1.5 pt-1.5 border-t border-[var(--ash-user-text)]/15 flex flex-wrap gap-1", children: f.map((m, w) => /* @__PURE__ */ a(
+              "span",
+              {
+                className: "inline-flex items-center gap-1 px-1.5 py-0.5 rounded bg-[var(--ash-user-text)]/10 text-[11px]",
+                title: m,
+                children: [
+                  /* @__PURE__ */ t(At, { className: "w-2.5 h-2.5 opacity-60" }),
+                  m.split(" (")[0]
+                ]
+              },
+              w
+            )) })
+          ] }),
+          l ? l({ entry: e, metadata: c }) : i && e.timestamp && /* @__PURE__ */ a("div", { className: "text-[10px] text-[var(--ash-text-faint)] mt-0.5 mr-1 tabular-nums flex items-center gap-1.5", children: [
+            (c == null ? void 0 : c.model) && /* @__PURE__ */ t("span", { children: c.model }),
+            (c == null ? void 0 : c.model) && /* @__PURE__ */ t("span", { className: "opacity-50", children: "·" }),
+            je(e.timestamp)
+          ] })
         ] }),
-        /* @__PURE__ */ t("div", { className: "flex flex-wrap gap-1", children: s.map((a, l) => /* @__PURE__ */ t(
-          "span",
-          {
-            className: "inline-flex items-center px-2 py-0.5 rounded-lg bg-[var(--ash-accent-foreground)]/10 text-xs",
-            title: a,
-            children: a.split(" (")[0]
-          },
-          l
-        )) })
-      ] }),
-      e.timestamp && /* @__PURE__ */ t("div", { className: "text-xs text-white/40 mt-2", children: De(e.timestamp) })
-    ] }),
-    /* @__PURE__ */ t("div", { className: "w-7 h-7 rounded-full bg-white/10 flex items-center justify-center shrink-0", children: /* @__PURE__ */ t(At, { className: "w-4 h-4 text-white/50" }) })
-  ] });
+        s && /* @__PURE__ */ t("div", { className: p(d.avatar, "rounded-full bg-[var(--ash-avatar-user-bg)] flex items-center justify-center shrink-0 mt-0.5"), children: /* @__PURE__ */ t(Dt, { className: "w-3 h-3 text-[var(--ash-text-muted)]" }) })
+      ]
+    }
+  );
 }
-function rn({
+function an({
   entry: e,
-  onOptionSelect: n,
-  richContentRenderers: r,
-  className: s
+  variant: n = "bubble",
+  scale: r = "compact",
+  showAvatar: s = !0,
+  showTimestamp: i = !0,
+  onOptionSelect: l,
+  richContentRenderers: c,
+  markdownComponents: h,
+  renderMetadata: o,
+  metadata: f,
+  className: d
 }) {
-  const a = e.richContent ? null : wt(e.content), l = (h) => {
-    n && n(`Option ${h.id}: ${h.label}`);
-  }, c = (h) => e.richContent && e.richContent.length > 0 ? /* @__PURE__ */ t(
-    Xt,
+  const x = e.richContent ? null : bt(e.content), m = Ne[r], w = (R) => {
+    l && l(`Option ${R.id}: ${R.label}`);
+  }, E = {
+    bubble: "rounded-[16px] bg-[var(--ash-assistant-bg)] border border-[var(--ash-assistant-border)]",
+    plain: "bg-transparent",
+    minimal: "bg-transparent"
+  }, D = (R) => e.richContent && e.richContent.length > 0 ? /* @__PURE__ */ t(
+    tn,
     {
       content: e.richContent,
-      renderers: r
-    }
-  ) : /* @__PURE__ */ t(ze, { children: h || e.content });
-  return /* @__PURE__ */ i("div", { className: p("flex gap-3 ash-animate-fade-in", s), children: [
-    /* @__PURE__ */ t("div", { className: "w-7 h-7 rounded-full bg-[var(--ash-accent)]/20 flex items-center justify-center shrink-0", children: /* @__PURE__ */ t(de, { className: "w-4 h-4 text-[var(--ash-accent)]" }) }),
-    /* @__PURE__ */ i("div", { className: "flex-1 max-w-[85%]", children: [
-      /* @__PURE__ */ t("div", { className: "ash-card-glass rounded-2xl p-4", children: /* @__PURE__ */ t("div", { className: "ash-message-content prose prose-sm prose-invert max-w-none text-sm leading-relaxed", children: a ? /* @__PURE__ */ i(_, { children: [
-        a.preamble && c(a.preamble),
-        /* @__PURE__ */ t(
-          en,
-          {
-            options: a.options,
-            onSelect: l
-          }
-        )
-      ] }) : c() }) }),
-      e.timestamp && /* @__PURE__ */ t("div", { className: "text-xs text-white/40 mt-2", children: De(e.timestamp) })
-    ] })
-  ] });
+      renderers: c
+    }
+  ) : /* @__PURE__ */ t(Fe, { components: h, children: R || e.content });
+  return /* @__PURE__ */ a(
+    "div",
+    {
+      "data-message-role": "assistant",
+      className: p("flex ash-animate-fade-in pl-1", m.gap, d),
+      children: [
+        s && /* @__PURE__ */ t("div", { className: p(m.avatar, "rounded-full bg-[var(--ash-avatar-assistant-bg)] flex items-center justify-center shrink-0 mt-0.5"), children: /* @__PURE__ */ t(Qe, { className: "w-3 h-3 text-white" }) }),
+        /* @__PURE__ */ a("div", { className: "flex-1 min-w-0", children: [
+          /* @__PURE__ */ t("div", { className: p(E[n], n === "bubble" && "px-4 py-3"), children: /* @__PURE__ */ t("div", { className: p("ash-message-content prose prose-sm prose-invert max-w-none leading-relaxed text-[var(--ash-assistant-text)]", m.text), children: x ? /* @__PURE__ */ a(_, { children: [
+            x.preamble && D(x.preamble),
+            /* @__PURE__ */ t(
+              nn,
+              {
+                options: x.options,
+                onSelect: w
+              }
+            )
+          ] }) : D() }) }),
+          o ? o({ entry: e, metadata: f }) : i && e.timestamp && /* @__PURE__ */ a("div", { className: "text-[10px] text-[var(--ash-text-faint)] mt-0.5 ml-1 tabular-nums flex items-center gap-1.5", children: [
+            (f == null ? void 0 : f.model) && /* @__PURE__ */ t("span", { children: f.model }),
+            (f == null ? void 0 : f.model) && /* @__PURE__ */ t("span", { className: "opacity-50", children: "·" }),
+            je(e.timestamp)
+          ] })
+        ] })
+      ]
+    }
+  );
 }
-function sn({ entry: e, className: n }) {
-  return /* @__PURE__ */ i("div", { className: p("flex gap-3 ash-animate-fade-in", n), children: [
-    /* @__PURE__ */ t("div", { className: "w-7 h-7 rounded-full bg-purple-500/20 flex items-center justify-center shrink-0", children: /* @__PURE__ */ t($t, { className: "w-4 h-4 text-purple-400" }) }),
-    /* @__PURE__ */ t("div", { className: "flex-1 max-w-[85%]", children: /* @__PURE__ */ i("div", { className: "rounded-2xl p-4 bg-purple-500/10 border border-purple-500/30", children: [
-      /* @__PURE__ */ t("div", { className: "text-xs text-purple-400 mb-2 font-medium", children: "Thinking" }),
-      /* @__PURE__ */ t("div", { className: "text-sm text-purple-300 italic opacity-80 whitespace-pre-wrap leading-relaxed", children: e.content })
-    ] }) })
-  ] });
+function ln({ entry: e, scale: n = "compact", showAvatar: r = !0, className: s }) {
+  const i = Ne[n];
+  return /* @__PURE__ */ a(
+    "div",
+    {
+      "data-message-role": "thinking",
+      className: p("flex ash-animate-fade-in pl-1", i.gap, s),
+      children: [
+        r && /* @__PURE__ */ t("div", { className: p(i.avatar, "rounded-md bg-[var(--ash-avatar-thinking-bg)] flex items-center justify-center shrink-0 mt-0.5"), children: /* @__PURE__ */ t(Qe, { className: "w-3 h-3 text-purple-400" }) }),
+        /* @__PURE__ */ t("div", { className: "flex-1 min-w-0", children: /* @__PURE__ */ a("div", { className: p("rounded-lg bg-[var(--ash-thinking-bg)] border border-[var(--ash-thinking-border)]", i.padding), children: [
+          /* @__PURE__ */ t("div", { className: "text-[10px] text-[var(--ash-thinking-text)] opacity-80 mb-1 font-medium uppercase tracking-wide", children: "Thinking" }),
+          /* @__PURE__ */ t("div", { className: p(i.text, "text-[var(--ash-thinking-text)] opacity-70 italic whitespace-pre-wrap leading-relaxed"), children: e.content })
+        ] }) })
+      ]
+    }
+  );
 }
-function an({ entry: e, defaultExpanded: n = !1, className: r }) {
-  return e.entryType.type !== "tool_call" ? null : /* @__PURE__ */ i("div", { className: p("flex gap-3 ash-animate-fade-in", r), children: [
-    /* @__PURE__ */ t("div", { className: "w-7 h-7 rounded-full bg-[var(--ash-accent)]/20 flex items-center justify-center shrink-0", children: /* @__PURE__ */ t(de, { className: "w-4 h-4 text-[var(--ash-accent)]" }) }),
-    /* @__PURE__ */ t("div", { className: "flex-1", children: /* @__PURE__ */ t(Be, { toolCall: e.entryType.toolCall, defaultExpanded: n }) })
-  ] });
+function on({ entry: e, scale: n = "compact", showAvatar: r = !0, defaultExpanded: s = !1, className: i }) {
+  if (e.entryType.type !== "tool_call") return null;
+  const l = Ne[n];
+  return /* @__PURE__ */ a(
+    "div",
+    {
+      "data-message-role": "tool",
+      className: p("flex ash-animate-fade-in pl-1", l.gap, i),
+      children: [
+        r && /* @__PURE__ */ t("div", { className: p(l.avatar, "rounded-md bg-[var(--ash-avatar-assistant-bg)] flex items-center justify-center shrink-0 mt-0.5"), children: /* @__PURE__ */ t(xe, { className: "w-3 h-3 text-[var(--ash-accent)]" }) }),
+        /* @__PURE__ */ t("div", { className: "flex-1 min-w-0", children: /* @__PURE__ */ t(ze, { toolCall: e.entryType.toolCall, defaultExpanded: s }) })
+      ]
+    }
+  );
 }
-function ln({ entry: e, className: n }) {
-  return e.entryType.type !== "error" ? null : /* @__PURE__ */ i("div", { className: p("flex gap-3 ash-animate-fade-in", n), children: [
-    /* @__PURE__ */ t("div", { className: "w-7 h-7 rounded-full bg-red-500/20 flex items-center justify-center shrink-0", children: /* @__PURE__ */ t(Ke, { className: "w-4 h-4 text-red-400" }) }),
-    /* @__PURE__ */ t("div", { className: "flex-1 max-w-[85%]", children: /* @__PURE__ */ i("div", { className: "rounded-2xl p-4 bg-red-500/10 border border-red-500/30", children: [
-      /* @__PURE__ */ t("div", { className: "text-xs text-red-400 mb-2 font-medium", children: "Error" }),
-      /* @__PURE__ */ t("p", { className: "text-sm text-red-300", children: e.entryType.message }),
-      e.entryType.code && /* @__PURE__ */ i("p", { className: "text-xs text-red-400/70 mt-2 font-mono", children: [
-        "Code: ",
-        e.entryType.code
-      ] })
-    ] }) })
-  ] });
+function cn({ entry: e, scale: n = "compact", showAvatar: r = !0, className: s }) {
+  if (e.entryType.type !== "error") return null;
+  const i = Ne[n];
+  return /* @__PURE__ */ a(
+    "div",
+    {
+      "data-message-role": "error",
+      className: p("flex ash-animate-fade-in pl-1", i.gap, s),
+      children: [
+        r && /* @__PURE__ */ t("div", { className: p(i.avatar, "rounded-md bg-[var(--ash-avatar-error-bg)] flex items-center justify-center shrink-0 mt-0.5"), children: /* @__PURE__ */ t(Ze, { className: "w-3 h-3 text-red-400" }) }),
+        /* @__PURE__ */ t("div", { className: "flex-1 min-w-0", children: /* @__PURE__ */ a("div", { className: p("rounded-lg bg-[var(--ash-error-bg)] border border-[var(--ash-error-border)]", i.padding), children: [
+          /* @__PURE__ */ t("div", { className: "text-[10px] text-[var(--ash-error-text)] opacity-80 mb-1 font-medium uppercase tracking-wide", children: "Error" }),
+          /* @__PURE__ */ t("p", { className: p(i.text, "text-[var(--ash-error-text)] opacity-90"), children: e.entryType.message }),
+          e.entryType.code && /* @__PURE__ */ a("p", { className: "text-[11px] text-[var(--ash-error-text)] opacity-60 mt-1 font-mono", children: [
+            "Code: ",
+            e.entryType.code
+          ] })
+        ] }) })
+      ]
+    }
+  );
 }
-function on({
+function dn({
   entry: e,
   onOptionSelect: n,
   defaultExpanded: r,
   richContentRenderers: s,
-  className: a
+  markdownComponents: i,
+  userVariant: l,
+  assistantVariant: c,
+  scale: h,
+  showAvatars: o = !0,
+  showTimestamp: f = !0,
+  renderMetadata: d,
+  metadata: x,
+  className: m
 }) {
   switch (e.entryType.type) {
     case "user_message":
-      return /* @__PURE__ */ t(nn, { entry: e, className: a });
+      return /* @__PURE__ */ t(
+        sn,
+        {
+          entry: e,
+          variant: l,
+          scale: h,
+          showAvatar: o,
+          showTimestamp: f,
+          renderMetadata: d,
+          metadata: x,
+          className: m
+        }
+      );
     case "assistant_message":
       return /* @__PURE__ */ t(
-        rn,
+        an,
         {
           entry: e,
+          variant: c,
+          scale: h,
+          showAvatar: o,
+          showTimestamp: f,
           onOptionSelect: n,
           richContentRenderers: s,
-          className: a
+          markdownComponents: i,
+          renderMetadata: d,
+          metadata: x,
+          className: m
         }
       );
     case "thinking":
-      return /* @__PURE__ */ t(sn, { entry: e, className: a });
+      return /* @__PURE__ */ t(ln, { entry: e, scale: h, showAvatar: o, className: m });
     case "tool_call":
-      return /* @__PURE__ */ t(an, { entry: e, defaultExpanded: r, className: a });
+      return /* @__PURE__ */ t(on, { entry: e, scale: h, showAvatar: o, defaultExpanded: r, className: m });
     case "error":
-      return /* @__PURE__ */ t(ln, { entry: e, className: a });
+      return /* @__PURE__ */ t(cn, { entry: e, scale: h, showAvatar: o, className: m });
     default:
       return null;
   }
 }
-function $e({ variant: e = "dots", size: n = "md", className: r }) {
+function Re({ variant: e = "dots", size: n = "md", className: r }) {
   if (e === "dots") {
-    const a = {
+    const i = {
       sm: "w-1 h-1",
       md: "w-1.5 h-1.5",
       lg: "w-2 h-2"
     };
-    return /* @__PURE__ */ i("div", { className: p("flex items-center gap-1", r), children: [
-      /* @__PURE__ */ t("span", { className: p("rounded-full bg-[var(--ash-accent)] animate-pulse", a[n]) }),
-      /* @__PURE__ */ t("span", { className: p("rounded-full bg-[var(--ash-accent)] animate-pulse", a[n]), style: { animationDelay: "150ms" } }),
-      /* @__PURE__ */ t("span", { className: p("rounded-full bg-[var(--ash-accent)] animate-pulse", a[n]), style: { animationDelay: "300ms" } })
+    return /* @__PURE__ */ a("div", { className: p("flex items-center gap-1", r), children: [
+      /* @__PURE__ */ t("span", { className: p("rounded-full bg-[var(--ash-accent)] animate-pulse", i[n]) }),
+      /* @__PURE__ */ t("span", { className: p("rounded-full bg-[var(--ash-accent)] animate-pulse", i[n]), style: { animationDelay: "150ms" } }),
+      /* @__PURE__ */ t("span", { className: p("rounded-full bg-[var(--ash-accent)] animate-pulse", i[n]), style: { animationDelay: "300ms" } })
     ] });
   }
   if (e === "pulse") {
-    const a = {
+    const i = {
       sm: "w-1.5 h-1.5",
       md: "w-2 h-2",
       lg: "w-3 h-3"
     };
-    return /* @__PURE__ */ t("div", { className: p("flex items-center gap-1", r), children: /* @__PURE__ */ t("span", { className: p("bg-[var(--ash-accent)] rounded-full animate-pulse", a[n]) }) });
+    return /* @__PURE__ */ t("div", { className: p("flex items-center gap-1", r), children: /* @__PURE__ */ t("span", { className: p("bg-[var(--ash-accent)] rounded-full animate-pulse", i[n]) }) });
   }
   return e === "cursor" ? /* @__PURE__ */ t(
     "span",
@@ -1447,26 +1604,26 @@ function $e({ variant: e = "dots", size: n = "md", className: r }) {
     sm: "w-4 h-4",
     md: "w-6 h-6",
     lg: "w-8 h-8"
-  }[n], r), children: /* @__PURE__ */ i("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+  }[n], r), children: /* @__PURE__ */ a("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
     /* @__PURE__ */ t("circle", { cx: "12", cy: "12", r: "10", className: "opacity-25" }),
     /* @__PURE__ */ t("path", { d: "M12 2a10 10 0 0 1 10 10", strokeLinecap: "round" })
   ] }) });
 }
-function cn({
+function un({
   content: e,
   isStreaming: n = !1,
   renderMarkdown: r = !0,
   className: s
 }) {
-  return /* @__PURE__ */ t("div", { className: p("relative", s), children: r ? /* @__PURE__ */ i("div", { className: "ash-message-content prose prose-sm prose-invert max-w-none text-sm leading-relaxed", children: [
-    /* @__PURE__ */ t(ze, { children: e }),
-    n && /* @__PURE__ */ t($e, { variant: "cursor", size: "sm", className: "inline-block ml-0.5" })
-  ] }) : /* @__PURE__ */ i("p", { className: "whitespace-pre-wrap text-sm leading-relaxed", children: [
+  return /* @__PURE__ */ t("div", { className: p("relative", s), children: r ? /* @__PURE__ */ a("div", { className: "ash-message-content prose prose-sm prose-invert max-w-none text-sm leading-relaxed", children: [
+    /* @__PURE__ */ t(Fe, { children: e }),
+    n && /* @__PURE__ */ t(Re, { variant: "cursor", size: "sm", className: "inline-block ml-0.5" })
+  ] }) : /* @__PURE__ */ a("p", { className: "whitespace-pre-wrap text-sm leading-relaxed", children: [
     e,
-    n && /* @__PURE__ */ t($e, { variant: "cursor", size: "sm", className: "inline-block ml-0.5" })
+    n && /* @__PURE__ */ t(Re, { variant: "cursor", size: "sm", className: "inline-block ml-0.5" })
   ] }) });
 }
-function dn(e) {
+function hn(e) {
   switch (e.action) {
     case "file_read":
     case "file_edit":
@@ -1476,15 +1633,15 @@ function dn(e) {
       return null;
   }
 }
-function Qe(e) {
+function tt(e) {
   const n = e.split("/");
   return n[n.length - 1] || e;
 }
-function un(e) {
-  const n = Qe(e), r = n.lastIndexOf(".");
+function mn(e) {
+  const n = tt(e), r = n.lastIndexOf(".");
   return r === -1 ? null : n.slice(r + 1).toLowerCase();
 }
-function hn(e) {
+function pn(e) {
   switch (e.action) {
     case "file_edit": {
       const n = e;
@@ -1502,7 +1659,7 @@ function hn(e) {
       return null;
   }
 }
-function mn(e) {
+function fn(e) {
   switch (e) {
     case "ts":
     case "tsx":
@@ -1525,9 +1682,9 @@ function mn(e) {
       return "text-white/70";
   }
 }
-function Xe({ toolCall: e, showFullPath: n = !1, className: r }) {
-  const { actionType: s, status: a, summary: l } = e, c = Ue(s), h = dn(s), o = hn(s), w = h ? n ? h : Qe(h) : null, d = h ? un(h) : null, m = mn(d), g = !h && l;
-  return /* @__PURE__ */ i(
+function nt({ toolCall: e, showFullPath: n = !1, className: r }) {
+  const { actionType: s, status: i, summary: l } = e, c = Ke(s), h = hn(s), o = pn(s), f = h ? n ? h : tt(h) : null, d = h ? mn(h) : null, x = fn(d), m = !h && l;
+  return /* @__PURE__ */ a(
     "div",
     {
       className: p(
@@ -1535,54 +1692,54 @@ function Xe({ toolCall: e, showFullPath: n = !1, className: r }) {
         r
       ),
       children: [
-        /* @__PURE__ */ i("div", { className: "flex items-center gap-1.5 shrink-0", children: [
+        /* @__PURE__ */ a("div", { className: "flex items-center gap-1.5 shrink-0", children: [
           /* @__PURE__ */ t(
-            Ye,
+            Xe,
             {
               actionType: s,
               className: p(
                 "w-3.5 h-3.5",
-                a === "pending" ? "text-yellow-400" : a === "failed" ? "text-red-400" : "text-white/50"
+                i === "pending" ? "text-yellow-400" : i === "failed" ? "text-red-400" : "text-white/50"
               )
             }
           ),
           /* @__PURE__ */ t("span", { className: p(
             "font-medium",
-            a === "pending" ? "text-white/90" : a === "failed" ? "text-red-400" : "text-white/60"
+            i === "pending" ? "text-white/90" : i === "failed" ? "text-red-400" : "text-white/60"
           ), children: c })
         ] }),
-        w && /* @__PURE__ */ t("code", { className: p(
+        f && /* @__PURE__ */ t("code", { className: p(
           "px-1.5 py-0.5 rounded bg-white/5 font-mono text-xs truncate max-w-[200px]",
-          m
-        ), children: w }),
-        o && /* @__PURE__ */ i("span", { className: "flex items-center gap-1 text-xs shrink-0 font-mono", children: [
-          o.added !== void 0 && o.added > 0 && /* @__PURE__ */ i("span", { className: "text-emerald-400", children: [
+          x
+        ), children: f }),
+        o && /* @__PURE__ */ a("span", { className: "flex items-center gap-1 text-xs shrink-0 font-mono", children: [
+          o.added !== void 0 && o.added > 0 && /* @__PURE__ */ a("span", { className: "text-emerald-400", children: [
             "+",
             o.added
           ] }),
-          o.removed !== void 0 && o.removed > 0 && /* @__PURE__ */ i("span", { className: "text-red-400", children: [
+          o.removed !== void 0 && o.removed > 0 && /* @__PURE__ */ a("span", { className: "text-red-400", children: [
             "-",
             o.removed
           ] }),
-          o.read !== void 0 && /* @__PURE__ */ i("span", { className: "text-white/40", children: [
+          o.read !== void 0 && /* @__PURE__ */ a("span", { className: "text-white/40", children: [
             o.read,
             " lines"
           ] }),
-          o.written !== void 0 && /* @__PURE__ */ i("span", { className: "text-emerald-400", children: [
+          o.written !== void 0 && /* @__PURE__ */ a("span", { className: "text-emerald-400", children: [
             "+",
             o.written
           ] })
         ] }),
-        g && /* @__PURE__ */ t("span", { className: "text-white/40 truncate min-w-0 text-xs", children: l })
+        m && /* @__PURE__ */ t("span", { className: "text-white/40 truncate min-w-0 text-xs", children: l })
       ]
     }
   );
 }
-function pn(e) {
+function xn(e) {
   const n = e.split("/").pop() || e, r = n.lastIndexOf(".");
   return r === -1 ? null : n.slice(r + 1).toLowerCase();
 }
-function fn(e) {
+function gn(e) {
   switch (e) {
     case "ts":
     case "tsx":
@@ -1605,7 +1762,7 @@ function fn(e) {
       return "";
   }
 }
-function xn(e) {
+function wn(e) {
   switch (e) {
     case "ts":
     case "tsx":
@@ -1628,31 +1785,31 @@ function xn(e) {
       return "bg-white/10";
   }
 }
-function et({
+function rt({
   path: e,
   linesAdded: n,
   linesRemoved: r,
   showOnlyFilename: s = !0,
-  className: a
+  className: i
 }) {
-  const l = s && e.split("/").pop() || e, c = pn(e), h = fn(c), o = xn(c), w = n !== void 0 && n > 0 || r !== void 0 && r > 0;
-  return /* @__PURE__ */ i(
+  const l = s && e.split("/").pop() || e, c = xn(e), h = gn(c), o = wn(c), f = n !== void 0 && n > 0 || r !== void 0 && r > 0;
+  return /* @__PURE__ */ a(
     "span",
     {
       className: p(
         "inline-flex items-center gap-1.5 px-2 py-0.5 rounded-md text-xs font-mono",
         o,
-        a
+        i
       ),
       children: [
         h && /* @__PURE__ */ t("span", { className: "text-[10px] opacity-60 font-semibold", children: h }),
         /* @__PURE__ */ t("span", { className: "text-white/80 truncate max-w-[120px]", children: l }),
-        w && /* @__PURE__ */ i("span", { className: "flex items-center gap-0.5", children: [
-          n !== void 0 && n > 0 && /* @__PURE__ */ i("span", { className: "text-emerald-400", children: [
+        f && /* @__PURE__ */ a("span", { className: "flex items-center gap-0.5", children: [
+          n !== void 0 && n > 0 && /* @__PURE__ */ a("span", { className: "text-emerald-400", children: [
             "+",
             n
           ] }),
-          r !== void 0 && r > 0 && /* @__PURE__ */ i("span", { className: "text-red-400", children: [
+          r !== void 0 && r > 0 && /* @__PURE__ */ a("span", { className: "text-red-400", children: [
             "-",
             r
           ] })
@@ -1661,28 +1818,28 @@ function et({
     }
   );
 }
-function gn(e) {
+function vn(e) {
   const n = /* @__PURE__ */ new Map();
   for (const r of e) {
     const { actionType: s } = r;
     if (s.action === "file_edit") {
-      const a = s, l = n.get(a.path);
-      l ? (l.linesAdded = (l.linesAdded || 0) + (a.linesAdded || 0), l.linesRemoved = (l.linesRemoved || 0) + (a.linesRemoved || 0)) : n.set(a.path, {
-        path: a.path,
-        linesAdded: a.linesAdded,
-        linesRemoved: a.linesRemoved
+      const i = s, l = n.get(i.path);
+      l ? (l.linesAdded = (l.linesAdded || 0) + (i.linesAdded || 0), l.linesRemoved = (l.linesRemoved || 0) + (i.linesRemoved || 0)) : n.set(i.path, {
+        path: i.path,
+        linesAdded: i.linesAdded,
+        linesRemoved: i.linesRemoved
       });
     } else if (s.action === "file_write") {
-      const a = s;
-      n.has(a.path) || n.set(a.path, {
-        path: a.path,
-        linesAdded: a.linesWritten
+      const i = s;
+      n.has(i.path) || n.set(i.path, {
+        path: i.path,
+        linesAdded: i.linesWritten
       });
     }
   }
   return Array.from(n.values());
 }
-function wn(e) {
+function yn(e) {
   const n = {};
   for (const r of e) {
     const s = r.actionType.action;
@@ -1690,37 +1847,37 @@ function wn(e) {
   }
   return n;
 }
-function vn(e) {
+function bn(e) {
   switch (e) {
     case "file_read":
-      return We;
+      return Be;
     case "file_edit":
     case "file_write":
       return Oe;
     case "command_run":
-      return Me;
+      return Ie;
     case "search":
     case "glob":
-      return _e;
+      return Se;
     default:
       return null;
   }
 }
-function yn({
+function Nn({
   toolCalls: e,
   defaultExpanded: n = !1,
   className: r
 }) {
-  const [s, a] = N(n), [l, c] = N(null), h = re(() => gn(e), [e]), o = re(() => wn(e), [e]), w = re(() => Object.entries(o).sort((m, g) => g[1] - m[1]).slice(0, 3).map(([m]) => m), [o]), d = e.length;
-  return e.length === 0 ? null : /* @__PURE__ */ i("div", { className: p("ash-animate-fade-in", r), children: [
-    /* @__PURE__ */ i(
+  const [s, i] = N(n), [l, c] = N(null), h = ae(() => vn(e), [e]), o = ae(() => yn(e), [e]), f = ae(() => Object.entries(o).sort((x, m) => m[1] - x[1]).slice(0, 3).map(([x]) => x), [o]), d = e.length;
+  return e.length === 0 ? null : /* @__PURE__ */ a("div", { className: p("ash-animate-fade-in", r), children: [
+    /* @__PURE__ */ a(
       "button",
       {
-        onClick: () => a(!s),
+        onClick: () => i(!s),
         className: "w-full flex items-center gap-2 py-1 text-left group",
         children: [
           /* @__PURE__ */ t(
-            ve,
+            be,
             {
               className: p(
                 "w-3.5 h-3.5 text-white/40 transition-transform duration-200 shrink-0",
@@ -1728,33 +1885,33 @@ function yn({
               )
             }
           ),
-          /* @__PURE__ */ i("span", { className: "text-sm text-white/60", children: [
+          /* @__PURE__ */ a("span", { className: "text-sm text-white/60", children: [
             d,
             " tool call",
             d !== 1 ? "s" : ""
           ] }),
-          /* @__PURE__ */ t("div", { className: "flex items-center gap-1", children: w.map((m) => {
-            const g = vn(m);
-            return g ? /* @__PURE__ */ t(
-              g,
+          /* @__PURE__ */ t("div", { className: "flex items-center gap-1", children: f.map((x) => {
+            const m = bn(x);
+            return m ? /* @__PURE__ */ t(
+              m,
               {
                 className: "w-3.5 h-3.5 text-white/30"
               },
-              m
+              x
             ) : null;
           }) }),
           /* @__PURE__ */ t("div", { className: "flex-1" }),
-          !s && h.length > 0 && /* @__PURE__ */ i("div", { className: "flex items-center gap-1.5 flex-wrap justify-end", children: [
-            h.slice(0, 4).map((m) => /* @__PURE__ */ t(
-              et,
+          !s && h.length > 0 && /* @__PURE__ */ a("div", { className: "flex items-center gap-1.5 flex-wrap justify-end", children: [
+            h.slice(0, 4).map((x) => /* @__PURE__ */ t(
+              rt,
               {
-                path: m.path,
-                linesAdded: m.linesAdded,
-                linesRemoved: m.linesRemoved
+                path: x.path,
+                linesAdded: x.linesAdded,
+                linesRemoved: x.linesRemoved
               },
-              m.path
+              x.path
             )),
-            h.length > 4 && /* @__PURE__ */ i("span", { className: "text-xs text-white/40", children: [
+            h.length > 4 && /* @__PURE__ */ a("span", { className: "text-xs text-white/40", children: [
               "+",
               h.length - 4,
               " more"
@@ -1763,11 +1920,11 @@ function yn({
         ]
       }
     ),
-    s && /* @__PURE__ */ t("div", { className: "pl-5 border-l border-white/10 ml-1.5 mt-1 space-y-0.5", children: e.map((m) => /* @__PURE__ */ t("div", { children: l === m.id ? /* @__PURE__ */ i("div", { className: "py-1", children: [
+    s && /* @__PURE__ */ t("div", { className: "pl-5 border-l border-white/10 ml-1.5 mt-1 space-y-0.5", children: e.map((x) => /* @__PURE__ */ t("div", { children: l === x.id ? /* @__PURE__ */ a("div", { className: "py-1", children: [
       /* @__PURE__ */ t(
-        Be,
+        ze,
         {
-          toolCall: m,
+          toolCall: x,
           defaultExpanded: !0
         }
       ),
@@ -1782,23 +1939,23 @@ function yn({
     ] }) : /* @__PURE__ */ t(
       "button",
       {
-        onClick: () => c(m.id),
+        onClick: () => c(x.id),
         className: "w-full text-left hover:bg-white/5 rounded px-1 -mx-1 transition-colors",
-        children: /* @__PURE__ */ t(Xe, { toolCall: m })
+        children: /* @__PURE__ */ t(nt, { toolCall: x })
       }
-    ) }, m.id)) })
+    ) }, x.id)) })
   ] });
 }
-function bn(e) {
+function kn(e) {
   const n = /* @__PURE__ */ new Map();
   for (const r of e) {
     const { actionType: s } = r;
     if (s.action === "file_edit") {
-      const a = s, l = n.get(a.path);
-      l ? (l.linesAdded = (l.linesAdded || 0) + (a.linesAdded || 0), l.linesRemoved = (l.linesRemoved || 0) + (a.linesRemoved || 0)) : n.set(a.path, {
-        path: a.path,
-        linesAdded: a.linesAdded,
-        linesRemoved: a.linesRemoved
+      const i = s, l = n.get(i.path);
+      l ? (l.linesAdded = (l.linesAdded || 0) + (i.linesAdded || 0), l.linesRemoved = (l.linesRemoved || 0) + (i.linesRemoved || 0)) : n.set(i.path, {
+        path: i.path,
+        linesAdded: i.linesAdded,
+        linesRemoved: i.linesRemoved
       });
     } else s.action === "file_write" && (n.has(s.path) || n.set(s.path, {
       path: s.path,
@@ -1807,7 +1964,7 @@ function bn(e) {
   }
   return Array.from(n.values());
 }
-function Nn(e) {
+function Cn(e) {
   const n = {};
   for (const r of e) {
     const s = r.actionType.action;
@@ -1815,37 +1972,37 @@ function Nn(e) {
   }
   return n;
 }
-function kn(e) {
+function _n(e) {
   switch (e) {
     case "file_read":
-      return We;
+      return Be;
     case "file_edit":
     case "file_write":
       return Oe;
     case "command_run":
-      return Me;
+      return Ie;
     case "search":
     case "glob":
-      return _e;
+      return Se;
     default:
       return null;
   }
 }
-function Cn({
+function Tn({
   toolCalls: e,
   defaultExpanded: n = !1,
   isExpanded: r,
   onToggle: s,
-  className: a
+  className: i
 }) {
-  const [l, c] = N(n), h = r !== void 0 ? r : l, o = O(() => {
-    s ? s() : c((v) => !v);
-  }, [s]), w = re(() => bn(e), [e]), d = re(() => Nn(e), [e]), m = re(() => Object.entries(d).sort((v, S) => S[1] - v[1]).slice(0, 3).map(([v]) => v), [d]);
+  const [l, c] = N(n), h = r !== void 0 ? r : l, o = F(() => {
+    s ? s() : c((w) => !w);
+  }, [s]), f = ae(() => kn(e), [e]), d = ae(() => Cn(e), [e]), x = ae(() => Object.entries(d).sort((w, E) => E[1] - w[1]).slice(0, 3).map(([w]) => w), [d]);
   if (e.length === 0)
     return null;
-  const g = e.length;
-  return /* @__PURE__ */ i("div", { className: p("ash-animate-fade-in", a), children: [
-    /* @__PURE__ */ i(
+  const m = e.length;
+  return /* @__PURE__ */ a("div", { className: p("ash-animate-fade-in", i), children: [
+    /* @__PURE__ */ a(
       "button",
       {
         type: "button",
@@ -1853,7 +2010,7 @@ function Cn({
         className: "w-full flex items-center gap-2 py-1 text-left group",
         children: [
           /* @__PURE__ */ t(
-            ve,
+            be,
             {
               className: p(
                 "w-3.5 h-3.5 text-white/40 transition-transform duration-200 shrink-0",
@@ -1861,42 +2018,42 @@ function Cn({
               )
             }
           ),
-          /* @__PURE__ */ i("span", { className: "text-sm text-white/60", children: [
-            g,
+          /* @__PURE__ */ a("span", { className: "text-sm text-white/60", children: [
+            m,
             " tool call",
-            g !== 1 ? "s" : ""
+            m !== 1 ? "s" : ""
           ] }),
-          /* @__PURE__ */ t("div", { className: "flex items-center gap-1", children: m.map((v) => {
-            const S = kn(v);
-            return S ? /* @__PURE__ */ t(
-              S,
+          /* @__PURE__ */ t("div", { className: "flex items-center gap-1", children: x.map((w) => {
+            const E = _n(w);
+            return E ? /* @__PURE__ */ t(
+              E,
               {
                 className: "w-3.5 h-3.5 text-white/30"
               },
-              v
+              w
             ) : null;
           }) }),
           /* @__PURE__ */ t("div", { className: "flex-1" }),
-          !h && w.length > 0 && /* @__PURE__ */ i("div", { className: "flex items-center gap-1.5 flex-wrap justify-end", children: [
-            w.slice(0, 4).map((v) => /* @__PURE__ */ t(
-              et,
+          !h && f.length > 0 && /* @__PURE__ */ a("div", { className: "flex items-center gap-1.5 flex-wrap justify-end", children: [
+            f.slice(0, 4).map((w) => /* @__PURE__ */ t(
+              rt,
               {
-                path: v.path,
-                linesAdded: v.linesAdded,
-                linesRemoved: v.linesRemoved
+                path: w.path,
+                linesAdded: w.linesAdded,
+                linesRemoved: w.linesRemoved
               },
-              v.path
+              w.path
             )),
-            w.length > 4 && /* @__PURE__ */ i("span", { className: "text-xs text-white/40", children: [
+            f.length > 4 && /* @__PURE__ */ a("span", { className: "text-xs text-white/40", children: [
               "+",
-              w.length - 4,
+              f.length - 4,
               " more"
             ] })
           ] })
         ]
       }
     ),
-    h && /* @__PURE__ */ t("div", { className: "pl-5 border-l border-white/10 ml-1.5 mt-1 space-y-0.5", children: e.map((v) => /* @__PURE__ */ t(Xe, { toolCall: v }, v.id)) })
+    h && /* @__PURE__ */ t("div", { className: "pl-5 border-l border-white/10 ml-1.5 mt-1 space-y-0.5", children: e.map((w) => /* @__PURE__ */ t(nt, { toolCall: w }, w.id)) })
   ] });
 }
 function wr(e) {
@@ -1935,16 +2092,16 @@ function Mr(e) {
 function Er(e) {
   return e.type === "error";
 }
-var _n = {
+var Sn = {
   mode: "inline",
   breakEveryNToolCalls: 0,
   defaultExpanded: !1,
   animationDuration: 300
-}, Tn = Ge(null);
-function Sn() {
-  const e = Je(Tn);
+}, Mn = Je(null);
+function En() {
+  const e = Ue(Mn);
   return e || {
-    config: _n,
+    config: Sn,
     setMode: () => {
     },
     setConfig: () => {
@@ -1953,111 +2110,127 @@ function Sn() {
     }
   };
 }
-function Mn() {
-  const { config: e } = Sn();
+function In() {
+  const { config: e } = En();
   return e;
 }
-function En({
+function Ln({
   entries: e,
   loading: n,
   streamingContent: r,
   displayConfig: s,
-  onOptionSelect: a,
+  onOptionSelect: i,
   renderWidget: l,
   onWidgetAction: c,
   autoScroll: h = !0,
   richContentRenderers: o,
-  className: w
+  userVariant: f,
+  assistantVariant: d,
+  scale: x,
+  showAvatars: m = !0,
+  showTimestamp: w = !0,
+  markdownComponents: E,
+  renderMetadata: D,
+  metadata: R,
+  className: T
 }) {
-  const d = Mn(), m = s || d, g = B(null), v = B(null);
-  j(() => {
-    h && v.current && g.current && v.current.scrollIntoView({ behavior: "smooth", block: "end" });
+  const X = In(), S = s || X, G = V(null), A = V(null);
+  P(() => {
+    h && A.current && G.current && A.current.scrollIntoView({ behavior: "smooth", block: "end" });
   }, [e, r, n, h]);
-  const S = O(
-    (M, k) => {
+  const W = F(
+    (B, H) => {
       if (c)
-        return (A) => {
+        return (C) => {
           c({
-            ...A,
-            entryId: M,
-            widgetType: k
+            ...C,
+            entryId: B,
+            widgetType: H
           });
         };
     },
     [c]
-  ), z = re(() => m.mode === "inline" ? e.map((M) => ({
+  ), ie = ae(() => S.mode === "inline" ? e.map((B) => ({
     type: "single",
-    entry: M,
-    id: M.id
-  })) : xt(e, m), [e, m]);
-  return /* @__PURE__ */ i("div", { ref: g, className: p("flex-1 overflow-y-auto p-4 space-y-4 ash-scrollbar", w), children: [
-    z.map((M) => {
-      if (M.type === "single") {
-        const A = M.entry;
-        if (A.entryType.type === "widget" && l) {
-          const I = A.entryType, W = l({
-            entry: A,
-            widgetType: I.widgetType,
-            widgetData: I.widgetData,
-            onAction: S(A.id, I.widgetType)
+    entry: B,
+    id: B.id
+  })) : vt(e, S), [e, S]), ee = x ? `ash-density-${x}` : void 0;
+  return /* @__PURE__ */ a("div", { ref: G, className: p("flex-1 overflow-y-auto px-3 py-2 space-y-1 ash-scrollbar", ee, T), children: [
+    ie.map((B) => {
+      if (B.type === "single") {
+        const C = B.entry;
+        if (C.entryType.type === "widget" && l) {
+          const O = C.entryType, te = l({
+            entry: C,
+            widgetType: O.widgetType,
+            widgetData: O.widgetData,
+            onAction: W(C.id, O.widgetType)
           });
-          if (W !== null)
-            return /* @__PURE__ */ t("div", { className: "ash-animate-fade-in", children: W }, A.id);
+          if (te !== null)
+            return /* @__PURE__ */ t("div", { className: "ash-animate-fade-in", children: te }, C.id);
         }
         return /* @__PURE__ */ t(
-          on,
+          dn,
           {
-            entry: A,
-            onOptionSelect: a,
-            defaultExpanded: m.defaultExpanded,
-            richContentRenderers: o
+            entry: C,
+            onOptionSelect: i,
+            defaultExpanded: S.defaultExpanded,
+            richContentRenderers: o,
+            markdownComponents: E,
+            userVariant: f,
+            assistantVariant: d,
+            scale: x,
+            showAvatars: m,
+            showTimestamp: w,
+            renderMetadata: D,
+            metadata: R
           },
-          A.id
+          C.id
         );
       }
-      const k = gt(M.entries);
-      return /* @__PURE__ */ i("div", { className: "flex gap-3 ash-animate-fade-in", children: [
-        /* @__PURE__ */ t("div", { className: "w-7 h-7 rounded-full bg-[var(--ash-accent)]/20 flex items-center justify-center shrink-0", children: /* @__PURE__ */ t(de, { className: "w-4 h-4 text-[var(--ash-accent)]" }) }),
-        /* @__PURE__ */ t("div", { className: "flex-1", children: m.mode === "accordion" ? /* @__PURE__ */ t(
-          Cn,
+      const H = yt(B.entries);
+      return /* @__PURE__ */ a("div", { className: "ash-message-row flex ash-animate-fade-in pl-1", style: { gap: "var(--ash-message-gap, 0.5rem)" }, children: [
+        m && /* @__PURE__ */ t("div", { className: "ash-avatar rounded-md bg-[var(--ash-avatar-assistant-bg)] flex items-center justify-center shrink-0 mt-0.5", style: { width: "var(--ash-avatar-size, 1.25rem)", height: "var(--ash-avatar-size, 1.25rem)" }, children: /* @__PURE__ */ t(xe, { className: "w-3 h-3 text-[var(--ash-accent)]" }) }),
+        /* @__PURE__ */ t("div", { className: "flex-1 min-w-0", children: S.mode === "accordion" ? /* @__PURE__ */ t(
+          Tn,
           {
-            toolCalls: k,
-            defaultExpanded: m.defaultExpanded
+            toolCalls: H,
+            defaultExpanded: S.defaultExpanded
           }
         ) : /* @__PURE__ */ t(
-          yn,
+          Nn,
           {
-            toolCalls: k,
-            defaultExpanded: m.defaultExpanded,
-            animationDuration: m.animationDuration
+            toolCalls: H,
+            defaultExpanded: S.defaultExpanded,
+            animationDuration: S.animationDuration
           }
         ) })
-      ] }, M.id);
+      ] }, B.id);
     }),
-    r && /* @__PURE__ */ i("div", { className: "flex gap-3 ash-animate-fade-in", children: [
-      /* @__PURE__ */ t("div", { className: "w-7 h-7 rounded-full bg-[var(--ash-accent)]/20 flex items-center justify-center shrink-0", children: /* @__PURE__ */ t(de, { className: "w-4 h-4 text-[var(--ash-accent)]" }) }),
-      /* @__PURE__ */ t("div", { className: "flex-1 max-w-[85%]", children: /* @__PURE__ */ t("div", { className: "rounded-xl p-3 bg-white/5 text-white/80", children: /* @__PURE__ */ t(cn, { content: r, isStreaming: !0 }) }) })
+    r && /* @__PURE__ */ a("div", { className: "ash-message-row flex ash-animate-fade-in pl-1", style: { gap: "var(--ash-message-gap, 0.5rem)" }, children: [
+      m && /* @__PURE__ */ t("div", { className: "ash-avatar rounded-md bg-[var(--ash-avatar-assistant-bg)] flex items-center justify-center shrink-0 mt-0.5", style: { width: "var(--ash-avatar-size, 1.25rem)", height: "var(--ash-avatar-size, 1.25rem)" }, children: /* @__PURE__ */ t(xe, { className: "w-3 h-3 text-[var(--ash-accent)]" }) }),
+      /* @__PURE__ */ t("div", { className: "flex-1 min-w-0", children: /* @__PURE__ */ t("div", { className: "ash-message-bubble rounded-lg bg-white/[0.03] text-white/80 leading-relaxed", style: { padding: "var(--ash-message-padding, 0.5rem 0.75rem)", fontSize: "var(--ash-font-size-base, 13px)" }, children: /* @__PURE__ */ t(un, { content: r, isStreaming: !0 }) }) })
     ] }),
-    n && !r && /* @__PURE__ */ i("div", { className: "flex gap-3 ash-animate-fade-in", children: [
-      /* @__PURE__ */ t("div", { className: "w-7 h-7 rounded-full bg-[var(--ash-accent)]/20 flex items-center justify-center shrink-0", children: /* @__PURE__ */ t(de, { className: "w-4 h-4 text-[var(--ash-accent)]" }) }),
-      /* @__PURE__ */ t("div", { className: "rounded-xl p-3 bg-white/5", children: /* @__PURE__ */ t($e, { variant: "dots" }) })
+    n && !r && /* @__PURE__ */ a("div", { className: "ash-message-row flex ash-animate-fade-in pl-1", style: { gap: "var(--ash-message-gap, 0.5rem)" }, children: [
+      m && /* @__PURE__ */ t("div", { className: "ash-avatar rounded-md bg-[var(--ash-avatar-assistant-bg)] flex items-center justify-center shrink-0 mt-0.5", style: { width: "var(--ash-avatar-size, 1.25rem)", height: "var(--ash-avatar-size, 1.25rem)" }, children: /* @__PURE__ */ t(xe, { className: "w-3 h-3 text-[var(--ash-accent)]" }) }),
+      /* @__PURE__ */ t("div", { className: "rounded-lg px-3 py-1.5 bg-white/[0.03]", children: /* @__PURE__ */ t(Re, { variant: "dots" }) })
     ] }),
-    /* @__PURE__ */ t("div", { ref: v })
+    /* @__PURE__ */ t("div", { ref: A })
   ] });
 }
-function In(e) {
+function $n(e) {
   switch (e) {
     case "info":
-      return /* @__PURE__ */ t(Tt, { className: "w-3.5 h-3.5" });
+      return /* @__PURE__ */ t(Et, { className: "w-3.5 h-3.5" });
     case "warn":
-      return /* @__PURE__ */ t(Ke, { className: "w-3.5 h-3.5" });
+      return /* @__PURE__ */ t(Ze, { className: "w-3.5 h-3.5" });
     case "error":
-      return /* @__PURE__ */ t(St, { className: "w-3.5 h-3.5" });
+      return /* @__PURE__ */ t(It, { className: "w-3.5 h-3.5" });
     case "debug":
-      return /* @__PURE__ */ t(Mt, { className: "w-3.5 h-3.5" });
+      return /* @__PURE__ */ t(Lt, { className: "w-3.5 h-3.5" });
   }
 }
-function Ln(e) {
+function Rn(e) {
   switch (e) {
     case "info":
       return "text-blue-400";
@@ -2069,7 +2242,7 @@ function Ln(e) {
       return "text-white/50";
   }
 }
-function $n(e) {
+function An(e) {
   switch (e) {
     case "info":
       return "bg-blue-900/20";
@@ -2081,7 +2254,7 @@ function $n(e) {
       return "bg-white/5";
   }
 }
-function An(e) {
+function Dn(e) {
   switch (e) {
     case "setup":
       return "Setup";
@@ -2095,26 +2268,26 @@ function An(e) {
       return "Startup";
   }
 }
-function Rn({ log: e }) {
+function jn({ log: e }) {
   const [n, r] = N(!1), s = e.data && Object.keys(e.data).length > 0;
-  return /* @__PURE__ */ i(
+  return /* @__PURE__ */ a(
     "div",
     {
       className: p(
         "px-3 py-2 border-b border-white/10 last:border-b-0",
-        $n(e.level)
+        An(e.level)
       ),
       children: [
-        /* @__PURE__ */ i(
+        /* @__PURE__ */ a(
           "div",
           {
             className: p("flex items-start gap-2", s && "cursor-pointer"),
             onClick: () => s && r(!n),
             children: [
-              /* @__PURE__ */ t("div", { className: "w-4 flex-shrink-0 pt-0.5", children: s && (n ? /* @__PURE__ */ t(je, { className: "w-3 h-3 text-white/40" }) : /* @__PURE__ */ t(ve, { className: "w-3 h-3 text-white/40" })) }),
-              /* @__PURE__ */ t("div", { className: p("flex-shrink-0 pt-0.5", Ln(e.level)), children: In(e.level) }),
-              /* @__PURE__ */ t("span", { className: "text-xs text-white/40 font-mono flex-shrink-0 pt-0.5", children: De(e.timestamp) }),
-              /* @__PURE__ */ t("span", { className: "text-xs px-1.5 py-0.5 rounded bg-white/10 text-white/70 font-medium flex-shrink-0", children: An(e.category) }),
+              /* @__PURE__ */ t("div", { className: "w-4 flex-shrink-0 pt-0.5", children: s && (n ? /* @__PURE__ */ t(We, { className: "w-3 h-3 text-white/40" }) : /* @__PURE__ */ t(be, { className: "w-3 h-3 text-white/40" })) }),
+              /* @__PURE__ */ t("div", { className: p("flex-shrink-0 pt-0.5", Rn(e.level)), children: $n(e.level) }),
+              /* @__PURE__ */ t("span", { className: "text-xs text-white/40 font-mono flex-shrink-0 pt-0.5", children: je(e.timestamp) }),
+              /* @__PURE__ */ t("span", { className: "text-xs px-1.5 py-0.5 rounded bg-white/10 text-white/70 font-medium flex-shrink-0", children: Dn(e.category) }),
               /* @__PURE__ */ t("span", { className: "text-sm text-white/80 flex-1 break-words", children: e.message })
             ]
           }
@@ -2124,16 +2297,16 @@ function Rn({ log: e }) {
     }
   );
 }
-function Dn({
+function Wn({
   logs: e,
   title: n = "Logs",
   isLoading: r,
   defaultCollapsed: s = !0,
-  maxHeight: a = 256,
+  maxHeight: i = 256,
   className: l
 }) {
-  const [c, h] = N(s), o = e.filter((d) => d.level === "error").length, w = e.filter((d) => d.level === "warn").length;
-  return e.length === 0 && !r ? null : /* @__PURE__ */ i(
+  const [c, h] = N(s), o = e.filter((d) => d.level === "error").length, f = e.filter((d) => d.level === "warn").length;
+  return e.length === 0 && !r ? null : /* @__PURE__ */ a(
     "div",
     {
       className: p(
@@ -2141,33 +2314,33 @@ function Dn({
         l
       ),
       children: [
-        /* @__PURE__ */ i(
+        /* @__PURE__ */ a(
           "button",
           {
             onClick: () => h(!c),
             className: "w-full flex items-center justify-between px-4 py-2 hover:bg-white/5 transition-colors",
             children: [
-              /* @__PURE__ */ i("div", { className: "flex items-center gap-2", children: [
-                /* @__PURE__ */ t(Me, { className: "w-4 h-4 text-white/50" }),
+              /* @__PURE__ */ a("div", { className: "flex items-center gap-2", children: [
+                /* @__PURE__ */ t(Ie, { className: "w-4 h-4 text-white/50" }),
                 /* @__PURE__ */ t("span", { className: "text-sm font-medium text-white/80", children: n }),
-                /* @__PURE__ */ i("span", { className: "text-xs text-white/40", children: [
+                /* @__PURE__ */ a("span", { className: "text-xs text-white/40", children: [
                   "(",
                   e.length,
                   ")"
                 ] }),
-                o > 0 && /* @__PURE__ */ i("span", { className: "text-xs px-1.5 py-0.5 rounded bg-red-900/50 text-red-400 font-medium", children: [
+                o > 0 && /* @__PURE__ */ a("span", { className: "text-xs px-1.5 py-0.5 rounded bg-red-900/50 text-red-400 font-medium", children: [
                   o,
                   " error",
                   o > 1 ? "s" : ""
                 ] }),
-                w > 0 && /* @__PURE__ */ i("span", { className: "text-xs px-1.5 py-0.5 rounded bg-yellow-900/50 text-yellow-400 font-medium", children: [
-                  w,
+                f > 0 && /* @__PURE__ */ a("span", { className: "text-xs px-1.5 py-0.5 rounded bg-yellow-900/50 text-yellow-400 font-medium", children: [
+                  f,
                   " warning",
-                  w > 1 ? "s" : ""
+                  f > 1 ? "s" : ""
                 ] }),
                 r && /* @__PURE__ */ t("span", { className: "text-xs text-white/40 animate-pulse", children: "Loading..." })
               ] }),
-              c ? /* @__PURE__ */ t(ve, { className: "w-4 h-4 text-white/40" }) : /* @__PURE__ */ t(je, { className: "w-4 h-4 text-white/40" })
+              c ? /* @__PURE__ */ t(be, { className: "w-4 h-4 text-white/40" }) : /* @__PURE__ */ t(We, { className: "w-4 h-4 text-white/40" })
             ]
           }
         ),
@@ -2175,22 +2348,22 @@ function Dn({
           "div",
           {
             className: "overflow-y-auto border-t border-white/10",
-            style: { maxHeight: a },
-            children: e.length === 0 ? /* @__PURE__ */ t("div", { className: "px-4 py-6 text-center text-sm text-white/50", children: "No logs yet" }) : e.map((d, m) => /* @__PURE__ */ t(Rn, { log: d }, `${d.timestamp}-${m}`))
+            style: { maxHeight: i },
+            children: e.length === 0 ? /* @__PURE__ */ t("div", { className: "px-4 py-6 text-center text-sm text-white/50", children: "No logs yet" }) : e.map((d, x) => /* @__PURE__ */ t(jn, { log: d }, `${d.timestamp}-${x}`))
           }
         )
       ]
     }
   );
 }
-var Ae = Ge(void 0), jn = "ash-ui-theme";
+var Ae = Je(void 0), Bn = "ash-ui-theme";
 function Ir({
   children: e,
   defaultTheme: n,
-  storageKey: r = jn,
+  storageKey: r = Bn,
   listenToSystemChanges: s = !0
 }) {
-  const [a, l] = N(() => {
+  const [i, l] = N(() => {
     if (typeof window < "u") {
       const d = localStorage.getItem(r);
       if (d === "dark" || d === "light")
@@ -2200,33 +2373,33 @@ function Ir({
     }
     return n ?? "light";
   }), [c, h] = N(!1);
-  j(() => {
+  P(() => {
     h(!0);
-  }, []), j(() => {
+  }, []), P(() => {
     if (!c) return;
     const d = document.documentElement;
-    a === "dark" ? d.classList.add("dark") : d.classList.remove("dark"), localStorage.setItem(r, a);
-  }, [a, c, r]), j(() => {
+    i === "dark" ? d.classList.add("dark") : d.classList.remove("dark"), localStorage.setItem(r, i);
+  }, [i, c, r]), P(() => {
     if (!s || typeof window > "u") return;
-    const d = window.matchMedia("(prefers-color-scheme: dark)"), m = (g) => {
-      localStorage.getItem(r) || l(g.matches ? "dark" : "light");
+    const d = window.matchMedia("(prefers-color-scheme: dark)"), x = (m) => {
+      localStorage.getItem(r) || l(m.matches ? "dark" : "light");
     };
-    return d.addEventListener("change", m), () => d.removeEventListener("change", m);
+    return d.addEventListener("change", x), () => d.removeEventListener("change", x);
   }, [r, s]);
-  const o = O(() => {
+  const o = F(() => {
     l((d) => d === "light" ? "dark" : "light");
-  }, []), w = O((d) => {
+  }, []), f = F((d) => {
     l(d);
   }, []);
-  return c ? /* @__PURE__ */ t(Ae.Provider, { value: { theme: a, toggleTheme: o, setTheme: w }, children: e }) : /* @__PURE__ */ t(Ae.Provider, { value: { theme: n ?? "light", toggleTheme: o, setTheme: w }, children: e });
+  return c ? /* @__PURE__ */ t(Ae.Provider, { value: { theme: i, toggleTheme: o, setTheme: f }, children: e }) : /* @__PURE__ */ t(Ae.Provider, { value: { theme: n ?? "light", toggleTheme: o, setTheme: f }, children: e });
 }
 function Lr() {
-  const e = Je(Ae);
+  const e = Ue(Ae);
   if (e === void 0)
     throw new Error("useTheme must be used within a ThemeProvider");
   return e;
 }
-var Wn = {
+var On = {
   slideUp: `
     @keyframes ash-slide-up {
       from { opacity: 0; transform: translateY(20px); }
@@ -2264,33 +2437,33 @@ var Wn = {
     }
   `
 };
-Object.values(Wn).join(`
+Object.values(On).join(`
 `);
-function On({
+function zn({
   messages: e,
   loading: n,
   streamingContent: r
 }) {
-  const s = B(null), a = B(null);
-  return j(() => {
-    a.current && a.current.scrollIntoView({ behavior: "smooth", block: "end" });
-  }, [e, r, n]), /* @__PURE__ */ i("div", { ref: s, className: "flex-1 overflow-y-auto p-4 space-y-4", children: [
-    e.map((l) => /* @__PURE__ */ t(Bn, { message: l }, l.id)),
-    r && /* @__PURE__ */ t("div", { className: "flex justify-start animate-fade-in", children: /* @__PURE__ */ i("div", { className: "max-w-[80%] card-glass rounded-2xl p-4", children: [
+  const s = V(null), i = V(null);
+  return P(() => {
+    i.current && i.current.scrollIntoView({ behavior: "smooth", block: "end" });
+  }, [e, r, n]), /* @__PURE__ */ a("div", { ref: s, className: "flex-1 overflow-y-auto p-4 space-y-4", children: [
+    e.map((l) => /* @__PURE__ */ t(Fn, { message: l }, l.id)),
+    r && /* @__PURE__ */ t("div", { className: "flex justify-start animate-fade-in", children: /* @__PURE__ */ a("div", { className: "max-w-[80%] card-glass rounded-2xl p-4", children: [
       /* @__PURE__ */ t("div", { className: "text-xs text-[#ccff00] mb-2 font-medium", children: "Assistant" }),
       /* @__PURE__ */ t("div", { className: "message-content prose prose-sm prose-invert max-w-none whitespace-pre-wrap", children: r })
     ] }) }),
-    n && !r && /* @__PURE__ */ t("div", { className: "flex justify-start animate-fade-in", children: /* @__PURE__ */ t("div", { className: "card-glass rounded-2xl p-4", children: /* @__PURE__ */ i("div", { className: "flex items-center gap-2 text-[#ccff00]", children: [
+    n && !r && /* @__PURE__ */ t("div", { className: "flex justify-start animate-fade-in", children: /* @__PURE__ */ t("div", { className: "card-glass rounded-2xl p-4", children: /* @__PURE__ */ a("div", { className: "flex items-center gap-2 text-[#ccff00]", children: [
       /* @__PURE__ */ t("span", { className: "w-2 h-2 rounded-full bg-[#ccff00] animate-pulse" }),
       /* @__PURE__ */ t("span", { className: "w-2 h-2 rounded-full bg-[#ccff00] animate-pulse delay-100" }),
       /* @__PURE__ */ t("span", { className: "w-2 h-2 rounded-full bg-[#ccff00] animate-pulse delay-200" })
     ] }) }) }),
-    /* @__PURE__ */ t("div", { ref: a })
+    /* @__PURE__ */ t("div", { ref: i })
   ] });
 }
-function Bn({ message: e }) {
+function Fn({ message: e }) {
   const n = e.role === "user", r = e.role === "tool";
-  return /* @__PURE__ */ t("div", { className: `flex ${n ? "justify-end" : "justify-start"} animate-fade-in`, children: /* @__PURE__ */ i(
+  return /* @__PURE__ */ t("div", { className: `flex ${n ? "justify-end" : "justify-start"} animate-fade-in`, children: /* @__PURE__ */ a(
     "div",
     {
       className: `max-w-[80%] rounded-2xl p-4 ${n ? "bg-[#ccff00] text-black shadow-[0_0_20px_rgba(204,255,0,0.2)]" : r ? "bg-yellow-500/10 border border-yellow-500/20" : "card-glass"}`,
@@ -2302,173 +2475,175 @@ function Bn({ message: e }) {
             children: e.role.charAt(0).toUpperCase() + e.role.slice(1)
           }
         ),
-        /* @__PURE__ */ t("div", { className: `message-content ${n ? "" : "prose prose-sm prose-invert max-w-none"}`, children: e.content.map((a, l) => /* @__PURE__ */ t(zn, { block: a, isUser: n }, l)) }),
+        /* @__PURE__ */ t("div", { className: `message-content ${n ? "" : "prose prose-sm prose-invert max-w-none"}`, children: e.content.map((i, l) => /* @__PURE__ */ t(Pn, { block: i, isUser: n }, l)) }),
         /* @__PURE__ */ t("div", { className: `text-xs mt-3 ${n ? "text-black/40" : "text-white/40"}`, children: new Date(e.createdAt).toLocaleTimeString() })
       ]
     }
   ) });
 }
-function zn({
+function Pn({
   block: e,
   isUser: n
 }) {
-  return e.type === "text" && e.text ? /* @__PURE__ */ t("p", { className: "whitespace-pre-wrap", children: e.text }) : e.type === "tool_use" ? /* @__PURE__ */ i("div", { className: "bg-black/40 border border-white/10 rounded-xl p-3 my-2", children: [
-    /* @__PURE__ */ i("div", { className: "text-xs text-[#ccff00] mb-2 font-medium flex items-center gap-2", children: [
+  return e.type === "text" && e.text ? /* @__PURE__ */ t("p", { className: "whitespace-pre-wrap", children: e.text }) : e.type === "tool_use" ? /* @__PURE__ */ a("div", { className: "bg-black/40 border border-white/10 rounded-xl p-3 my-2", children: [
+    /* @__PURE__ */ a("div", { className: "text-xs text-[#ccff00] mb-2 font-medium flex items-center gap-2", children: [
       /* @__PURE__ */ t("svg", { className: "w-3.5 h-3.5", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ t("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M11.42 15.17 17.25 21A2.652 2.652 0 0 0 21 17.25l-5.877-5.877M11.42 15.17l2.496-3.03c.317-.384.74-.626 1.208-.766M11.42 15.17l-4.655 5.653a2.548 2.548 0 1 1-3.586-3.586l6.837-5.63m5.108-.233c.55-.164 1.163-.188 1.743-.14a4.5 4.5 0 0 0 4.486-6.336l-3.276 3.277a3.004 3.004 0 0 1-2.25-2.25l3.276-3.276a4.5 4.5 0 0 0-6.336 4.486c.091 1.076-.071 2.264-.904 2.95l-.102.085m-1.745 1.437L5.909 7.5H4.5L2.25 3.75l1.5-1.5L7.5 4.5v1.409l4.26 4.26m-1.745 1.437 1.745-1.437m6.615 8.206L15.75 15.75M4.867 19.125h.008v.008h-.008v-.008Z" }) }),
       "Tool: ",
       e.name
     ] }),
     /* @__PURE__ */ t("pre", { className: "text-sm overflow-x-auto text-white/80 font-mono", children: JSON.stringify(e.input, null, 2) })
-  ] }) : e.type === "tool_result" ? /* @__PURE__ */ i("div", { className: "bg-emerald-500/10 border border-emerald-500/20 rounded-xl p-3 my-2", children: [
-    /* @__PURE__ */ i("div", { className: "text-xs text-emerald-400 mb-2 font-medium flex items-center gap-2", children: [
+  ] }) : e.type === "tool_result" ? /* @__PURE__ */ a("div", { className: "bg-emerald-500/10 border border-emerald-500/20 rounded-xl p-3 my-2", children: [
+    /* @__PURE__ */ a("div", { className: "text-xs text-emerald-400 mb-2 font-medium flex items-center gap-2", children: [
       /* @__PURE__ */ t("svg", { className: "w-3.5 h-3.5", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ t("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M9 12.75 11.25 15 15 9.75M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" }) }),
       "Tool Result"
     ] }),
     /* @__PURE__ */ t("pre", { className: "text-sm overflow-x-auto text-emerald-300/80 font-mono", children: typeof e.content == "string" ? e.content : JSON.stringify(e.content, null, 2) })
   ] }) : null;
 }
-const Fn = 5e3;
-function Ve(e) {
+const Gn = 5e3;
+function qe(e) {
   return e < 1024 ? `${e} B` : e < 1024 * 1024 ? `${(e / 1024).toFixed(1)} KB` : `${(e / (1024 * 1024)).toFixed(1)} MB`;
 }
-function Pn({
+function Vn({
   onSend: e,
   disabled: n,
   loading: r,
   placeholder: s = "Type your message...",
-  queue: a = [],
+  queue: i = [],
   onCancelQueued: l,
   sessionContext: c = "",
   onSessionContextChange: h,
   envVars: o = {},
-  onEnvVarsChange: w,
+  onEnvVarsChange: f,
   enableFileUpload: d = !0,
-  maxFileSize: m = 100 * 1024 * 1024,
+  maxFileSize: x = 100 * 1024 * 1024,
   // 100MB
-  maxFiles: g = 10,
-  onStop: v,
-  canStop: S = !1,
-  enableLongTextConversion: z = !0,
-  longTextThreshold: M = Fn
+  maxFiles: m = 10,
+  onStop: w,
+  canStop: E = !1,
+  enableLongTextConversion: D = !0,
+  longTextThreshold: R = Gn
 }) {
-  const [k, A] = N(""), [I, W] = N(!1), [F, P] = N(!1), [ue, ie] = N(""), [ye, ae] = N(""), [R, K] = N([]), [he, le] = N(!1), [Z, Y] = N(null), [me, pe] = N(/* @__PURE__ */ new Map()), ge = B(0), oe = B(null), be = B(null), fe = B(null), we = O((u) => {
-    const E = new TextEncoder().encode(u);
-    let f = "";
-    for (let C = 0; C < E.length; C++)
-      f += String.fromCharCode(E[C]);
-    return btoa(f);
-  }, []), q = O((u) => {
-    if (!z || !d) return;
+  const [T, X] = N(""), [S, G] = N(!1), [A, W] = N(!1), [ie, ee] = N(""), [B, H] = N(""), [C, O] = N([]), [te, ce] = N(!1), [ne, Q] = N(null), [he, me] = N(/* @__PURE__ */ new Map()), ge = V(0), de = V(null), ke = V(null), pe = V(null), we = F((u) => {
+    const I = new TextEncoder().encode(u);
+    let k = "";
+    for (let y = 0; y < I.length; y++)
+      k += String.fromCharCode(I[y]);
+    return btoa(k);
+  }, []), K = F((u) => {
+    if (!D || !d) return;
     const b = u.clipboardData.getData("text/plain");
-    if (b.length > M) {
-      if (u.preventDefault(), R.length >= g) {
-        console.warn(`Cannot convert text to attachment: maximum ${g} files reached`);
+    if (b.length > R) {
+      if (u.preventDefault(), C.length >= m) {
+        console.warn(`Cannot convert text to attachment: maximum ${m} files reached`);
         return;
       }
-      const E = b.split(`
+      const I = b.split(`
 `).length;
       ge.current += 1;
-      const f = ge.current, C = `pasted-text-${f}-${Date.now()}.txt`, X = we(b), rt = new TextEncoder().encode(b).length, st = {
-        filename: C,
-        content: X,
+      const k = ge.current, y = `pasted-text-${k}-${Date.now()}.txt`, j = we(b), it = new TextEncoder().encode(b).length, lt = {
+        filename: y,
+        content: j,
         mimeType: "text/plain",
-        size: rt
+        size: it
       };
-      pe((Ie) => {
-        const Pe = new Map(Ie);
-        return Pe.set(C, { number: f, lineCount: E }), Pe;
-      }), K((Ie) => [...Ie, st]), Y({
+      me((Le) => {
+        const Ge = new Map(Le);
+        return Ge.set(y, { number: k, lineCount: I }), Ge;
+      }), O((Le) => [...Le, lt]), Q({
         originalLength: b.length,
-        filename: C,
+        filename: y,
         preview: b.slice(0, 100) + (b.length > 100 ? "..." : ""),
-        lineCount: E
+        lineCount: I
       }), setTimeout(() => {
-        Y(null);
+        Q(null);
       }, 5e3);
     }
-  }, [z, d, M, R.length, g, we]), x = () => {
-    const u = k.trim();
-    (u || R.length > 0) && !n && (e(u || "(files attached)", R.length > 0 ? R : void 0), A(""), K([]), pe(/* @__PURE__ */ new Map()), oe.current && (oe.current.style.height = "auto"));
-  }, y = (u) => {
-    u.key === "Enter" && !u.shiftKey && (u.preventDefault(), x());
-  }, T = () => {
-    const u = oe.current;
+  }, [D, d, R, C.length, m, we]), g = () => {
+    const u = T.trim();
+    (u || C.length > 0) && !n && (e(u || "(files attached)", C.length > 0 ? C : void 0), X(""), O([]), me(/* @__PURE__ */ new Map()), de.current && (de.current.style.height = "auto"));
+  }, v = (u) => {
+    u.key === "Enter" && !u.shiftKey && (u.preventDefault(), g());
+  }, M = () => {
+    const u = de.current;
     u && (u.style.height = "auto", u.style.height = `${Math.min(u.scrollHeight, 200)}px`);
-  }, D = async (u) => {
+  }, z = async (u) => {
     if (!u) return;
-    const b = [], E = R.length;
-    for (let f = 0; f < u.length && E + b.length < g; f++) {
-      const C = u[f];
-      if (C.size > m) {
-        console.warn(`File ${C.name} exceeds maximum size of ${Ve(m)}`);
+    const b = [], I = C.length;
+    for (let k = 0; k < u.length && I + b.length < m; k++) {
+      const y = u[k];
+      if (y.size > x) {
+        console.warn(`File ${y.name} exceeds maximum size of ${qe(x)}`);
         continue;
       }
       try {
-        const X = await Q(C);
+        const j = await re(y);
         b.push({
-          filename: C.name,
-          content: X,
-          mimeType: C.type || "application/octet-stream",
-          size: C.size
+          filename: y.name,
+          content: j,
+          mimeType: y.type || "application/octet-stream",
+          size: y.size
         });
-      } catch (X) {
-        console.error(`Failed to read file ${C.name}:`, X);
+      } catch (j) {
+        console.error(`Failed to read file ${y.name}:`, j);
       }
     }
-    b.length > 0 && K((f) => [...f, ...b]);
-  }, Q = (u) => new Promise((b, E) => {
-    const f = new FileReader();
-    f.onload = () => {
-      const X = f.result.split(",")[1];
-      b(X || "");
-    }, f.onerror = () => E(f.error), f.readAsDataURL(u);
-  }), te = (u) => {
-    D(u.target.files), fe.current && (fe.current.value = "");
-  }, ce = (u) => {
-    u.preventDefault(), d && !n && le(!0);
-  }, V = (u) => {
-    u.preventDefault(), le(!1);
-  }, H = (u) => {
-    u.preventDefault(), le(!1), d && !n && D(u.dataTransfer.files);
-  }, G = (u) => {
-    const b = R[u];
-    b && me.has(b.filename) && pe((E) => {
-      const f = new Map(E);
-      return f.delete(b.filename), f;
-    }), K((E) => E.filter((f, C) => C !== u));
-  }, J = a.length > 0, Ne = r ? "Sending..." : J ? `Queue (${a.length})` : "Send", ke = c.trim().length > 0, Ce = Object.keys(o).length > 0, Ee = !n && (k.trim() || R.length > 0), xe = () => {
-    const u = ue.trim(), b = ye.trim();
-    u && w && (w({ ...o, [u]: b }), ie(""), ae(""));
-  }, U = (u) => {
-    if (w) {
+    b.length > 0 && O((k) => [...k, ...b]);
+  }, re = (u) => new Promise((b, I) => {
+    const k = new FileReader();
+    k.onload = () => {
+      const j = k.result.split(",")[1];
+      b(j || "");
+    }, k.onerror = () => I(k.error), k.readAsDataURL(u);
+  }), le = (u) => {
+    z(u.target.files), pe.current && (pe.current.value = "");
+  }, ue = (u) => {
+    u.preventDefault(), d && !n && ce(!0);
+  }, Y = (u) => {
+    u.preventDefault(), ce(!1);
+  }, q = (u) => {
+    u.preventDefault(), ce(!1), d && !n && z(u.dataTransfer.files);
+  }, Z = (u) => {
+    const b = C[u];
+    b && he.has(b.filename) && me((I) => {
+      const k = new Map(I);
+      return k.delete(b.filename), k;
+    }), O((I) => I.filter((k, y) => y !== u));
+  }, J = i.length > 0;
+  r || J && `${i.length}`;
+  const Ce = c.trim().length > 0, _e = Object.keys(o).length > 0, ve = !n && (T.trim() || C.length > 0), Te = () => {
+    const u = ie.trim(), b = B.trim();
+    u && f && (f({ ...o, [u]: b }), ee(""), H(""));
+  }, ye = (u) => {
+    if (f) {
       const b = { ...o };
-      delete b[u], w(b);
+      delete b[u], f(b);
     }
-  }, ne = (u) => {
-    u.key === "Enter" && (u.preventDefault(), xe());
+  }, U = (u) => {
+    u.key === "Enter" && (u.preventDefault(), Te());
   };
-  return /* @__PURE__ */ i(
+  return /* @__PURE__ */ a(
     "div",
     {
-      className: `border-t border-white/10 p-3 sm:p-4 glass-panel relative ${he ? "bg-[#ccff00]/5" : ""}`,
-      onDragOver: ce,
-      onDragLeave: V,
-      onDrop: H,
+      className: `border-t border-white/10 p-3 sm:p-4 glass-panel relative ${te ? "bg-[#ccff00]/5" : ""}`,
+      onDragOver: ue,
+      onDragLeave: Y,
+      onDrop: q,
       children: [
-        he && d && /* @__PURE__ */ t("div", { className: "absolute inset-0 bg-[#ccff00]/10 border-2 border-dashed border-[#ccff00]/50 rounded-xl flex items-center justify-center z-10 pointer-events-none", children: /* @__PURE__ */ t("div", { className: "text-[#ccff00] font-medium", children: "Drop files here" }) }),
-        h && /* @__PURE__ */ i("div", { className: "mb-3", children: [
-          /* @__PURE__ */ i(
+        te && d && /* @__PURE__ */ t("div", { className: "absolute inset-0 bg-[#ccff00]/10 border-2 border-dashed border-[#ccff00]/50 rounded-xl flex items-center justify-center z-10 pointer-events-none", children: /* @__PURE__ */ t("div", { className: "text-[#ccff00] font-medium", children: "Drop files here" }) }),
+        h && /* @__PURE__ */ a("div", { className: "mb-3", children: [
+          /* @__PURE__ */ a(
             "button",
             {
               type: "button",
-              onClick: () => W(!I),
+              onClick: () => G(!S),
               className: "flex items-center gap-2 text-xs font-medium text-white/50 hover:text-white/80 transition-colors",
               children: [
                 /* @__PURE__ */ t(
                   "svg",
                   {
                     xmlns: "http://www.w3.org/2000/svg",
-                    className: `h-3 w-3 transition-transform ${I ? "rotate-90" : ""}`,
+                    className: `h-3 w-3 transition-transform ${S ? "rotate-90" : ""}`,
                     viewBox: "0 0 20 20",
                     fill: "currentColor",
                     children: /* @__PURE__ */ t(
@@ -2482,19 +2657,19 @@ function Pn({
                   }
                 ),
                 /* @__PURE__ */ t("span", { className: "uppercase tracking-wide", children: "Session Context" }),
-                ke && !I && /* @__PURE__ */ t("span", { className: "badge badge-accent", children: "Active" })
+                Ce && !S && /* @__PURE__ */ t("span", { className: "badge badge-accent", children: "Active" })
               ]
             }
           ),
-          I && /* @__PURE__ */ i("div", { className: "mt-2", children: [
+          S && /* @__PURE__ */ a("div", { className: "mt-2", children: [
             /* @__PURE__ */ t(
               "textarea",
               {
-                ref: be,
+                ref: ke,
                 value: c,
                 onChange: (u) => h(u.target.value),
                 onInput: () => {
-                  const u = be.current;
+                  const u = ke.current;
                   u && (u.style.height = "auto", u.style.height = `${Math.min(u.scrollHeight, 150)}px`);
                 },
                 placeholder: "Add context that will be injected into every request (e.g., current page, user selection, etc.)",
@@ -2505,19 +2680,19 @@ function Pn({
             /* @__PURE__ */ t("p", { className: "text-xs text-white/40 mt-1", children: "This context is appended to the system prompt for each message sent." })
           ] })
         ] }),
-        w && /* @__PURE__ */ i("div", { className: "mb-3", children: [
-          /* @__PURE__ */ i(
+        f && /* @__PURE__ */ a("div", { className: "mb-3", children: [
+          /* @__PURE__ */ a(
             "button",
             {
               type: "button",
-              onClick: () => P(!F),
+              onClick: () => W(!A),
               className: "flex items-center gap-2 text-xs font-medium text-white/50 hover:text-white/80 transition-colors",
               children: [
                 /* @__PURE__ */ t(
                   "svg",
                   {
                     xmlns: "http://www.w3.org/2000/svg",
-                    className: `h-3 w-3 transition-transform ${F ? "rotate-90" : ""}`,
+                    className: `h-3 w-3 transition-transform ${A ? "rotate-90" : ""}`,
                     viewBox: "0 0 20 20",
                     fill: "currentColor",
                     children: /* @__PURE__ */ t(
@@ -2531,12 +2706,12 @@ function Pn({
                   }
                 ),
                 /* @__PURE__ */ t("span", { className: "uppercase tracking-wide", children: "Environment Variables" }),
-                Ce && !F && /* @__PURE__ */ t("span", { className: "badge badge-accent", children: Object.keys(o).length })
+                _e && !A && /* @__PURE__ */ t("span", { className: "badge badge-accent", children: Object.keys(o).length })
               ]
             }
           ),
-          F && /* @__PURE__ */ i("div", { className: "mt-2 space-y-2", children: [
-            Object.entries(o).map(([u, b]) => /* @__PURE__ */ i(
+          A && /* @__PURE__ */ a("div", { className: "mt-2 space-y-2", children: [
+            Object.entries(o).map(([u, b]) => /* @__PURE__ */ a(
               "div",
               {
                 className: "flex items-center gap-2 bg-white/5 border border-white/10 rounded-xl px-3 py-2 text-sm",
@@ -2547,7 +2722,7 @@ function Pn({
                   /* @__PURE__ */ t(
                     "button",
                     {
-                      onClick: () => U(u),
+                      onClick: () => ye(u),
                       className: "text-white/40 hover:text-red-400 transition-colors",
                       title: "Remove variable",
                       children: /* @__PURE__ */ t(
@@ -2573,14 +2748,14 @@ function Pn({
               },
               u
             )),
-            /* @__PURE__ */ i("div", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ a("div", { className: "flex items-center gap-2", children: [
               /* @__PURE__ */ t(
                 "input",
                 {
                   type: "text",
-                  value: ue,
-                  onChange: (u) => ie(u.target.value.toUpperCase().replace(/[^A-Z0-9_]/g, "")),
-                  onKeyDown: ne,
+                  value: ie,
+                  onChange: (u) => ee(u.target.value.toUpperCase().replace(/[^A-Z0-9_]/g, "")),
+                  onKeyDown: U,
                   placeholder: "KEY",
                   className: "input-glass text-sm font-mono flex-1 min-w-0 py-2"
                 }
@@ -2590,9 +2765,9 @@ function Pn({
                 "input",
                 {
                   type: "text",
-                  value: ye,
-                  onChange: (u) => ae(u.target.value),
-                  onKeyDown: ne,
+                  value: B,
+                  onChange: (u) => H(u.target.value),
+                  onKeyDown: U,
                   placeholder: "value",
                   className: "input-glass text-sm font-mono flex-[2] min-w-0 py-2"
                 }
@@ -2600,8 +2775,8 @@ function Pn({
               /* @__PURE__ */ t(
                 "button",
                 {
-                  onClick: xe,
-                  disabled: !ue.trim(),
+                  onClick: Te,
+                  disabled: !ie.trim(),
                   className: "px-3 py-2 text-sm bg-[#ccff00]/20 hover:bg-[#ccff00]/30 text-[#ccff00] rounded-xl transition-all duration-300 disabled:opacity-30 disabled:cursor-not-allowed",
                   children: "Add"
                 }
@@ -2610,8 +2785,8 @@ function Pn({
             /* @__PURE__ */ t("p", { className: "text-xs text-white/40", children: "These environment variables will be available in the sandbox for new sessions." })
           ] })
         ] }),
-        Z && /* @__PURE__ */ t("div", { className: "mb-3 p-3 bg-blue-500/10 border border-blue-500/30 rounded-xl", children: /* @__PURE__ */ i("div", { className: "flex items-start justify-between gap-3", children: [
-          /* @__PURE__ */ i("div", { className: "flex items-start gap-2 min-w-0", children: [
+        ne && /* @__PURE__ */ t("div", { className: "mb-3 p-3 bg-blue-500/10 border border-blue-500/30 rounded-xl", children: /* @__PURE__ */ a("div", { className: "flex items-start justify-between gap-3", children: [
+          /* @__PURE__ */ a("div", { className: "flex items-start gap-2 min-w-0", children: [
             /* @__PURE__ */ t(
               "svg",
               {
@@ -2631,21 +2806,21 @@ function Pn({
                 )
               }
             ),
-            /* @__PURE__ */ i("div", { className: "min-w-0", children: [
+            /* @__PURE__ */ a("div", { className: "min-w-0", children: [
               /* @__PURE__ */ t("p", { className: "text-sm text-blue-200 font-medium", children: "Long text converted to attachment" }),
-              /* @__PURE__ */ i("p", { className: "text-xs text-blue-300/70 mt-1", children: [
-                Z.originalLength.toLocaleString(),
+              /* @__PURE__ */ a("p", { className: "text-xs text-blue-300/70 mt-1", children: [
+                ne.originalLength.toLocaleString(),
                 " characters (",
-                Z.lineCount,
+                ne.lineCount,
                 " lines) saved as text attachment"
               ] }),
-              /* @__PURE__ */ t("p", { className: "text-xs text-white/50 mt-1 truncate font-mono", children: Z.preview })
+              /* @__PURE__ */ t("p", { className: "text-xs text-white/50 mt-1 truncate font-mono", children: ne.preview })
             ] })
           ] }),
           /* @__PURE__ */ t(
             "button",
             {
-              onClick: () => Y(null),
+              onClick: () => Q(null),
               className: "text-blue-400/70 hover:text-blue-300 transition-colors shrink-0",
               title: "Dismiss",
               children: /* @__PURE__ */ t(
@@ -2668,20 +2843,20 @@ function Pn({
             }
           )
         ] }) }),
-        R.length > 0 && /* @__PURE__ */ i("div", { className: "mb-3 space-y-2", children: [
-          /* @__PURE__ */ i("div", { className: "text-xs font-medium text-white/50 uppercase tracking-wide", children: [
+        C.length > 0 && /* @__PURE__ */ a("div", { className: "mb-3 space-y-2", children: [
+          /* @__PURE__ */ a("div", { className: "text-xs font-medium text-white/50 uppercase tracking-wide", children: [
             "Attached Files (",
-            R.length,
+            C.length,
             ")"
           ] }),
-          /* @__PURE__ */ t("div", { className: "flex flex-wrap gap-2", children: R.map((u, b) => {
-            const E = me.get(u.filename), f = !!E;
-            return /* @__PURE__ */ i(
+          /* @__PURE__ */ t("div", { className: "flex flex-wrap gap-2", children: C.map((u, b) => {
+            const I = he.get(u.filename), k = !!I;
+            return /* @__PURE__ */ a(
               "div",
               {
-                className: `flex items-center gap-2 rounded-xl px-3 py-1.5 text-sm ${f ? "bg-purple-500/10 border border-purple-500/30" : "bg-white/5 border border-white/10"}`,
+                className: `flex items-center gap-2 rounded-xl px-3 py-1.5 text-sm ${k ? "bg-purple-500/10 border border-purple-500/30" : "bg-white/5 border border-white/10"}`,
                 children: [
-                  f ? (
+                  k ? (
                     // Pasted text icon (document with lines)
                     /* @__PURE__ */ t(
                       "svg",
@@ -2724,21 +2899,21 @@ function Pn({
                       }
                     )
                   ),
-                  f ? /* @__PURE__ */ i("span", { className: "text-purple-200 font-mono", title: u.filename, children: [
+                  k ? /* @__PURE__ */ a("span", { className: "text-purple-200 font-mono", title: u.filename, children: [
                     "[Pasted text #",
-                    E.number,
+                    I.number,
                     " +",
-                    E.lineCount,
+                    I.lineCount,
                     " lines]"
-                  ] }) : /* @__PURE__ */ i(_, { children: [
+                  ] }) : /* @__PURE__ */ a(_, { children: [
                     /* @__PURE__ */ t("span", { className: "text-white/80 truncate max-w-[150px]", title: u.filename, children: u.filename }),
-                    /* @__PURE__ */ t("span", { className: "text-white/40 text-xs", children: Ve(u.size) })
+                    /* @__PURE__ */ t("span", { className: "text-white/40 text-xs", children: qe(u.size) })
                   ] }),
                   /* @__PURE__ */ t(
                     "button",
                     {
-                      onClick: () => G(b),
-                      className: `hover:text-red-400 transition-colors ${f ? "text-purple-400/70" : "text-white/40"}`,
+                      onClick: () => Z(b),
+                      className: `hover:text-red-400 transition-colors ${k ? "text-purple-400/70" : "text-white/40"}`,
                       title: "Remove file",
                       children: /* @__PURE__ */ t(
                         "svg",
@@ -2765,19 +2940,19 @@ function Pn({
             );
           }) })
         ] }),
-        J && /* @__PURE__ */ i("div", { className: "mb-3 space-y-2", children: [
-          /* @__PURE__ */ i("div", { className: "text-xs font-medium text-white/50 uppercase tracking-wide", children: [
+        J && /* @__PURE__ */ a("div", { className: "mb-3 space-y-2", children: [
+          /* @__PURE__ */ a("div", { className: "text-xs font-medium text-white/50 uppercase tracking-wide", children: [
             "Queued Messages (",
-            a.length,
+            i.length,
             ")"
           ] }),
-          /* @__PURE__ */ t("div", { className: "max-h-32 overflow-y-auto space-y-1", children: a.map((u, b) => /* @__PURE__ */ i(
+          /* @__PURE__ */ t("div", { className: "max-h-32 overflow-y-auto space-y-1", children: i.map((u, b) => /* @__PURE__ */ a(
             "div",
             {
               className: "flex items-center justify-between bg-yellow-500/10 border border-yellow-500/20 rounded-xl px-3 py-2 text-sm",
               children: [
-                /* @__PURE__ */ i("div", { className: "flex items-center gap-2 flex-1 min-w-0", children: [
-                  /* @__PURE__ */ i("span", { className: "text-yellow-400 font-medium shrink-0", children: [
+                /* @__PURE__ */ a("div", { className: "flex items-center gap-2 flex-1 min-w-0", children: [
+                  /* @__PURE__ */ a("span", { className: "text-yellow-400 font-medium shrink-0", children: [
                     "#",
                     b + 1
                   ] }),
@@ -2813,30 +2988,75 @@ function Pn({
             u.id
           )) })
         ] }),
-        /* @__PURE__ */ i("div", { className: "flex gap-2 items-end", children: [
-          d && /* @__PURE__ */ i(_, { children: [
+        /* @__PURE__ */ a("div", { className: "flex gap-3 items-end", children: [
+          /* @__PURE__ */ a("div", { className: "flex-1 flex items-end bg-[#2f2f2f] rounded-2xl border border-white/10 overflow-hidden", children: [
+            d && /* @__PURE__ */ a(_, { children: [
+              /* @__PURE__ */ t(
+                "input",
+                {
+                  ref: pe,
+                  type: "file",
+                  multiple: !0,
+                  onChange: le,
+                  className: "hidden",
+                  disabled: n || C.length >= m
+                }
+              ),
+              /* @__PURE__ */ t(
+                "button",
+                {
+                  type: "button",
+                  onClick: () => {
+                    var u;
+                    return (u = pe.current) == null ? void 0 : u.click();
+                  },
+                  disabled: n || C.length >= m,
+                  className: "shrink-0 p-3 text-white/50 hover:text-white transition-colors disabled:opacity-50 disabled:cursor-not-allowed",
+                  title: C.length >= m ? `Maximum ${m} files` : "Attach files",
+                  children: /* @__PURE__ */ t(
+                    "svg",
+                    {
+                      xmlns: "http://www.w3.org/2000/svg",
+                      className: "h-5 w-5",
+                      fill: "none",
+                      viewBox: "0 0 24 24",
+                      stroke: "currentColor",
+                      children: /* @__PURE__ */ t(
+                        "path",
+                        {
+                          strokeLinecap: "round",
+                          strokeLinejoin: "round",
+                          strokeWidth: 2,
+                          d: "M15.172 7l-6.586 6.586a2 2 0 102.828 2.828l6.414-6.586a4 4 0 00-5.656-5.656l-6.415 6.585a6 6 0 108.486 8.486L20.5 13"
+                        }
+                      )
+                    }
+                  )
+                }
+              )
+            ] }),
             /* @__PURE__ */ t(
-              "input",
+              "textarea",
               {
-                ref: fe,
-                type: "file",
-                multiple: !0,
-                onChange: te,
-                className: "hidden",
-                disabled: n || R.length >= g
+                ref: de,
+                value: T,
+                onChange: (u) => X(u.target.value),
+                onKeyDown: v,
+                onInput: M,
+                onPaste: K,
+                placeholder: s,
+                disabled: n,
+                className: "flex-1 min-w-0 resize-none py-3 px-2 bg-transparent text-white placeholder-white/40 focus:outline-none disabled:opacity-50 disabled:cursor-not-allowed",
+                rows: 1
               }
             ),
             /* @__PURE__ */ t(
               "button",
               {
                 type: "button",
-                onClick: () => {
-                  var u;
-                  return (u = fe.current) == null ? void 0 : u.click();
-                },
-                disabled: n || R.length >= g,
-                className: "shrink-0 p-2 sm:px-3 sm:py-2 text-white/50 hover:text-[#ccff00] hover:bg-white/5 rounded-xl transition-all duration-300 disabled:opacity-50 disabled:cursor-not-allowed",
-                title: R.length >= g ? `Maximum ${g} files` : "Attach files",
+                className: "shrink-0 p-3 text-white/50 hover:text-white transition-colors disabled:opacity-50",
+                disabled: n,
+                title: "Voice input (not available)",
                 children: /* @__PURE__ */ t(
                   "svg",
                   {
@@ -2851,59 +3071,68 @@ function Pn({
                         strokeLinecap: "round",
                         strokeLinejoin: "round",
                         strokeWidth: 2,
-                        d: "M15.172 7l-6.586 6.586a2 2 0 102.828 2.828l6.414-6.586a4 4 0 00-5.656-5.656l-6.415 6.585a6 6 0 108.486 8.486L20.5 13"
+                        d: "M12 1a3 3 0 00-3 3v8a3 3 0 006 0V4a3 3 0 00-3-3zM19 10v2a7 7 0 01-14 0v-2M12 19v4M8 23h8"
                       }
                     )
                   }
                 )
               }
+            ),
+            /* @__PURE__ */ t(
+              "button",
+              {
+                type: "button",
+                onClick: g,
+                disabled: !ve,
+                className: "shrink-0 p-3 text-white/50 hover:text-white transition-colors disabled:opacity-30 disabled:cursor-not-allowed",
+                title: "Send message",
+                children: /* @__PURE__ */ a(
+                  "svg",
+                  {
+                    xmlns: "http://www.w3.org/2000/svg",
+                    className: "h-5 w-5",
+                    fill: "none",
+                    viewBox: "0 0 24 24",
+                    stroke: "currentColor",
+                    children: [
+                      /* @__PURE__ */ t("line", { x1: "12", y1: "19", x2: "12", y2: "5", strokeWidth: 2, strokeLinecap: "round" }),
+                      /* @__PURE__ */ t("polyline", { points: "5 12 12 5 19 12", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round" })
+                    ]
+                  }
+                )
+              }
             )
           ] }),
-          /* @__PURE__ */ t(
-            "textarea",
-            {
-              ref: oe,
-              value: k,
-              onChange: (u) => A(u.target.value),
-              onKeyDown: y,
-              onInput: T,
-              onPaste: q,
-              placeholder: s,
-              disabled: n,
-              className: "input-glass flex-1 min-w-0 resize-none py-2.5 disabled:opacity-50 disabled:cursor-not-allowed",
-              rows: 1
-            }
-          ),
-          r && S && v ? /* @__PURE__ */ i(
+          r && E && w ? /* @__PURE__ */ a(
             "button",
             {
-              onClick: v,
-              className: "shrink-0 px-3 sm:px-4 py-2.5 bg-red-500/80 hover:bg-red-500 text-white rounded-xl transition-all duration-300 flex items-center gap-1 sm:gap-2 border border-red-400/30",
+              onClick: w,
+              className: "shrink-0 px-4 py-3 bg-red-500/80 hover:bg-red-500 text-white rounded-2xl transition-all duration-300 flex items-center gap-2 border border-red-400/30 font-medium",
               title: "Stop generation",
               children: [
                 /* @__PURE__ */ t("svg", { xmlns: "http://www.w3.org/2000/svg", className: "h-4 w-4", viewBox: "0 0 20 20", fill: "currentColor", children: /* @__PURE__ */ t("path", { fillRule: "evenodd", d: "M10 18a8 8 0 100-16 8 8 0 000 16zM8 7a1 1 0 00-1 1v4a1 1 0 001 1h4a1 1 0 001-1V8a1 1 0 00-1-1H8z", clipRule: "evenodd" }) }),
                 /* @__PURE__ */ t("span", { className: "hidden sm:inline", children: "Stop" })
               ]
             }
-          ) : /* @__PURE__ */ i(
+          ) : /* @__PURE__ */ a(
             "button",
             {
-              onClick: x,
-              disabled: !Ee,
-              className: `shrink-0 px-3 sm:px-5 py-2.5 rounded-xl font-medium transition-all duration-300 disabled:opacity-30 disabled:cursor-not-allowed ${J ? "bg-yellow-500/80 hover:bg-yellow-500 text-black border border-yellow-400/30" : "bg-[#ccff00] hover:bg-[#b8e600] text-black shadow-[0_0_20px_rgba(204,255,0,0.3)] hover:shadow-[0_0_30px_rgba(204,255,0,0.5)]"}`,
+              onClick: g,
+              disabled: !ve,
+              className: `shrink-0 px-4 py-3 rounded-2xl font-medium transition-all duration-300 disabled:opacity-30 disabled:cursor-not-allowed ${J ? "bg-yellow-500/80 hover:bg-yellow-500 text-black border border-yellow-400/30" : "bg-[#10a37f] hover:bg-[#0d8c6d] text-white"}`,
               children: [
-                /* @__PURE__ */ t("span", { className: "hidden sm:inline", children: Ne }),
-                /* @__PURE__ */ t("span", { className: "sm:hidden", children: r ? "..." : J ? `+${a.length}` : "→" })
+                /* @__PURE__ */ t("span", { className: "hidden sm:inline", children: J ? `Queue (${i.length})` : "Execute" }),
+                /* @__PURE__ */ t("span", { className: "sm:hidden", children: r ? "..." : J ? `+${i.length}` : "→" })
               ]
             }
           )
         ] }),
-        /* @__PURE__ */ i("div", { className: "text-xs text-white/40 mt-2 hidden sm:block", children: [
+        /* @__PURE__ */ a("div", { className: "text-xs text-white/40 mt-2 hidden sm:block", children: [
           "Press Enter to ",
           r || J ? "queue" : "send",
           ", Shift+Enter for new line",
           d && " • Drag & drop files or click the attach button",
-          z && d && ` • Long text (>${M.toLocaleString()} chars) auto-converts to attachment`
+          D && d && ` • Long text (>${R.toLocaleString()} chars) auto-converts to attachment`
         ] })
       ]
     }
@@ -2914,230 +3143,230 @@ function $r({
   initialAgent: n,
   initialSessionId: r,
   onSessionChange: s,
-  className: a = "",
+  className: i = "",
   useBackendQueue: l = !1
 }) {
-  const [c, h] = N([]), [o, w] = N(n || null), [d, m] = N(r || null), [g, v] = N([]), [S, z] = N(!1), [M, k] = N(""), [A, I] = N(null), [W, F] = N([]), [P, ue] = N([]), [ie, ye] = N(""), [ae, R] = N({}), K = B(!1), he = B(ie), le = B(ae), Z = B(null);
-  j(() => {
-    he.current = ie;
-  }, [ie]), j(() => {
-    le.current = ae;
-  }, [ae]), j(() => {
-    fetch(`${e}/agents`).then((x) => x.json()).then((x) => {
-      const y = x.agents || [];
-      h(y), !o && y.length > 0 && w(y[0].slug || y[0].name);
-    }).catch((x) => {
-      console.error("Failed to fetch agents:", x), I("Failed to load agents");
+  const [c, h] = N([]), [o, f] = N(n || null), [d, x] = N(r || null), [m, w] = N([]), [E, D] = N(!1), [R, T] = N(""), [X, S] = N(null), [G, A] = N([]), [W, ie] = N([]), [ee, B] = N(""), [H, C] = N({}), O = V(!1), te = V(ee), ce = V(H), ne = V(null);
+  P(() => {
+    te.current = ee;
+  }, [ee]), P(() => {
+    ce.current = H;
+  }, [H]), P(() => {
+    fetch(`${e}/agents`).then((g) => g.json()).then((g) => {
+      const v = g.agents || [];
+      h(v), !o && v.length > 0 && f(v[0].slug || v[0].name);
+    }).catch((g) => {
+      console.error("Failed to fetch agents:", g), S("Failed to load agents");
     });
-  }, [e]), j(() => {
-    d && me(d);
+  }, [e]), P(() => {
+    d && he(d);
   }, [d]);
-  const Y = O(async () => {
+  const Q = F(async () => {
     if (!(!l || !o))
       try {
-        const x = await fetch(
+        const g = await fetch(
           `${e}/queue/status/${o}?sessionId=${d || ""}`
         );
-        if (!x.ok) return;
-        const y = await x.json();
-        z(y.isProcessing), ue(y.nextItems || []), !y.isProcessing && S && (d && await me(d), k(""));
-      } catch (x) {
-        console.error("Failed to fetch queue status:", x);
+        if (!g.ok) return;
+        const v = await g.json();
+        D(v.isProcessing), ie(v.nextItems || []), !v.isProcessing && E && (d && await he(d), T(""));
+      } catch (g) {
+        console.error("Failed to fetch queue status:", g);
       }
-  }, [l, o, d, e, S]);
-  j(() => {
+  }, [l, o, d, e, E]);
+  P(() => {
     if (l)
-      return Z.current = setInterval(Y, 1e3), () => {
-        Z.current && (clearInterval(Z.current), Z.current = null);
+      return ne.current = setInterval(Q, 1e3), () => {
+        ne.current && (clearInterval(ne.current), ne.current = null);
       };
-  }, [l, Y]), j(() => {
+  }, [l, Q]), P(() => {
     s == null || s(d);
   }, [d, s]);
-  const me = async (x) => {
+  const he = async (g) => {
     try {
-      const y = await fetch(`${e}/sessions/${x}/messages`);
-      if (!y.ok) throw new Error("Failed to fetch messages");
-      const T = await y.json();
-      v(T.items || T.messages || []);
-    } catch (y) {
-      I(y instanceof Error ? y.message : "Failed to fetch messages");
-    }
-  }, pe = O(async (x, y, T) => {
-    var te, ce;
-    if (!o) return y;
-    z(!0), I(null), k("");
-    const D = {
+      const v = await fetch(`${e}/sessions/${g}/messages`);
+      if (!v.ok) throw new Error("Failed to fetch messages");
+      const M = await v.json();
+      w(M.items || M.messages || []);
+    } catch (v) {
+      S(v instanceof Error ? v.message : "Failed to fetch messages");
+    }
+  }, me = F(async (g, v, M) => {
+    var le, ue;
+    if (!o) return v;
+    D(!0), S(null), T("");
+    const z = {
       id: `temp-${Date.now()}`,
       role: "user",
-      content: [{ type: "text", text: x }],
+      content: [{ type: "text", text: g }],
       createdAt: (/* @__PURE__ */ new Date()).toISOString()
     };
-    v((V) => [...V, D]);
-    let Q = y;
+    w((Y) => [...Y, z]);
+    let re = v;
     try {
-      const V = y ? `${e}/sessions/${y}/send` : `${e}/agents/${o}/run`, H = T == null ? void 0 : T.map((ne) => ({
-        filename: ne.filename,
-        content: ne.content,
-        mimeType: ne.mimeType
-      })), G = { prompt: x }, J = he.current.trim();
-      J && (G.sessionContext = J);
-      const Ne = le.current;
-      !y && Object.keys(Ne).length > 0 && (G.envVars = Ne), H && H.length > 0 && (G.files = H);
-      const ke = await fetch(V, {
+      const Y = v ? `${e}/sessions/${v}/send` : `${e}/agents/${o}/run`, q = M == null ? void 0 : M.map((fe) => ({
+        filename: fe.filename,
+        content: fe.content,
+        mimeType: fe.mimeType
+      })), Z = { prompt: g }, J = te.current.trim();
+      J && (Z.sessionContext = J);
+      const Ce = ce.current;
+      !v && Object.keys(Ce).length > 0 && (Z.envVars = Ce), q && q.length > 0 && (Z.files = q);
+      const _e = await fetch(Y, {
         method: "POST",
         headers: { "Content-Type": "application/json" },
-        body: JSON.stringify(G)
+        body: JSON.stringify(Z)
       });
-      if (!ke.ok) throw new Error("Failed to send message");
-      const Ce = (te = ke.body) == null ? void 0 : te.getReader(), Ee = new TextDecoder();
-      let xe = "", U = "";
-      for (; Ce; ) {
-        const { done: ne, value: Fe } = await Ce.read();
-        if (ne) break;
-        xe += Ee.decode(Fe, { stream: !0 });
-        const u = xe.split(`
+      if (!_e.ok) throw new Error("Failed to send message");
+      const ve = (le = _e.body) == null ? void 0 : le.getReader(), Te = new TextDecoder();
+      let ye = "", U = "";
+      for (; ve; ) {
+        const { done: fe, value: u } = await ve.read();
+        if (fe) break;
+        ye += Te.decode(u, { stream: !0 });
+        const b = ye.split(`
 `);
-        xe = u.pop() || "";
-        for (const b of u)
-          if (b.startsWith("data:")) {
-            const E = b.slice(5).trim();
-            if (!E) continue;
+        ye = b.pop() || "";
+        for (const I of b)
+          if (I.startsWith("data:")) {
+            const k = I.slice(5).trim();
+            if (!k) continue;
             try {
-              const f = JSON.parse(E);
-              if (f.type === "session_start" && f.sessionId)
-                Q = f.sessionId, m(f.sessionId);
-              else if (f.type === "text_delta" && f.delta)
-                U += f.delta, k(U);
-              else if (f.type === "thinking_delta" && f.delta)
-                U += f.delta, k(U);
-              else if (f.type === "message" && f.message) {
-                const C = (ce = f.message.content) == null ? void 0 : ce.find(
-                  (X) => X.type === "text"
+              const y = JSON.parse(k);
+              if (y.type === "session_start" && y.sessionId)
+                re = y.sessionId, x(y.sessionId);
+              else if (y.type === "text_delta" && y.delta)
+                U += y.delta, T(U);
+              else if (y.type === "thinking_delta" && y.delta)
+                U += y.delta, T(U);
+              else if (y.type === "message" && y.message) {
+                const j = (ue = y.message.content) == null ? void 0 : ue.find(
+                  (Pe) => Pe.type === "text"
                 );
-                C != null && C.text && (U || (U = C.text, k(U)));
-              } else if (f.type === "tool_use")
+                j != null && j.text && (U || (U = j.text, T(U)));
+              } else if (y.type === "tool_use")
                 U += `
 
-🔧 Using tool: ${f.name}
-`, k(U);
-              else if (f.type === "session_end") {
-                const C = y || f.sessionId;
-                C && await me(C), k("");
-              } else f.type === "error" && I(f.error || "Unknown error");
+🔧 Using tool: ${y.name}
+`, T(U);
+              else if (y.type === "session_end") {
+                const j = v || y.sessionId;
+                j && await he(j), T("");
+              } else y.type === "error" && S(y.error || "Unknown error");
             } catch {
             }
           }
       }
-    } catch (V) {
-      I(V instanceof Error ? V.message : "Unknown error"), v((H) => H.filter((G) => G.id !== D.id));
+    } catch (Y) {
+      S(Y instanceof Error ? Y.message : "Unknown error"), w((q) => q.filter((Z) => Z.id !== z.id));
     } finally {
-      z(!1);
+      D(!1);
     }
-    return Q;
-  }, [e, o]), ge = O(async () => {
-    if (K.current) return;
-    K.current = !0;
-    let x = d;
+    return re;
+  }, [e, o]), ge = F(async () => {
+    if (O.current) return;
+    O.current = !0;
+    let g = d;
     for (; ; ) {
-      let y;
-      if (F((T) => T.length === 0 ? T : (y = T[0], T.slice(1))), await new Promise((T) => setTimeout(T, 0)), !y) break;
-      x = await pe(y.text, x, y.files);
-    }
-    K.current = !1;
-  }, [d, pe]);
-  j(() => {
-    W.length > 0 && !K.current && ge();
-  }, [W, ge]);
-  const oe = O(async (x, y) => {
+      let v;
+      if (A((M) => M.length === 0 ? M : (v = M[0], M.slice(1))), await new Promise((M) => setTimeout(M, 0)), !v) break;
+      g = await me(v.text, g, v.files);
+    }
+    O.current = !1;
+  }, [d, me]);
+  P(() => {
+    G.length > 0 && !O.current && ge();
+  }, [G, ge]);
+  const de = F(async (g, v) => {
     if (!o) return;
-    const T = {
+    const M = {
       id: `temp-${Date.now()}`,
       role: "user",
-      content: [{ type: "text", text: x }],
+      content: [{ type: "text", text: g }],
       createdAt: (/* @__PURE__ */ new Date()).toISOString()
     };
-    v((D) => [...D, T]);
+    w((z) => [...z, M]);
     try {
-      const D = y == null ? void 0 : y.map((H) => ({
-        filename: H.filename,
-        content: H.content,
-        mimeType: H.mimeType
-      })), Q = le.current, te = !d && Object.keys(Q).length > 0 ? Q : void 0, ce = await fetch(`${e}/queue`, {
+      const z = v == null ? void 0 : v.map((q) => ({
+        filename: q.filename,
+        content: q.content,
+        mimeType: q.mimeType
+      })), re = ce.current, le = !d && Object.keys(re).length > 0 ? re : void 0, ue = await fetch(`${e}/queue`, {
         method: "POST",
         headers: { "Content-Type": "application/json" },
         body: JSON.stringify({
           agentName: o,
           sessionId: d,
-          prompt: x,
-          files: D,
-          sessionContext: he.current.trim() || void 0,
-          envVars: te
+          prompt: g,
+          files: z,
+          sessionContext: te.current.trim() || void 0,
+          envVars: le
         })
       });
-      if (!ce.ok)
+      if (!ue.ok)
         throw new Error("Failed to queue message");
-      const V = await ce.json();
-      !d && V.id && setTimeout(async () => {
-        const G = await fetch(`${e}/queue/${V.id}`);
-        if (G.ok) {
-          const J = await G.json();
-          J.sessionId && m(J.sessionId);
+      const Y = await ue.json();
+      !d && Y.id && setTimeout(async () => {
+        const Z = await fetch(`${e}/queue/${Y.id}`);
+        if (Z.ok) {
+          const J = await Z.json();
+          J.sessionId && x(J.sessionId);
         }
-      }, 500), await Y();
-    } catch (D) {
-      I(D instanceof Error ? D.message : "Failed to queue message"), v((Q) => Q.filter((te) => te.id !== T.id));
+      }, 500), await Q();
+    } catch (z) {
+      S(z instanceof Error ? z.message : "Failed to queue message"), w((re) => re.filter((le) => le.id !== M.id));
     }
-  }, [o, d, e, Y]), be = O((x, y) => {
+  }, [o, d, e, Q]), ke = F((g, v) => {
     if (!o) return;
     if (l) {
-      oe(x, y);
+      de(g, v);
       return;
     }
-    const T = {
+    const M = {
       id: `queue-${Date.now()}-${Math.random().toString(36).slice(2)}`,
-      text: x,
-      files: y
+      text: g,
+      files: v
     };
-    S || K.current ? F((D) => [...D, T]) : F([T]);
-  }, [o, S, l, oe]), fe = O(async (x) => {
+    E || O.current ? A((z) => [...z, M]) : A([M]);
+  }, [o, E, l, de]), pe = F(async (g) => {
     if (l) {
       try {
-        await fetch(`${e}/queue/${x}/cancel`, {
+        await fetch(`${e}/queue/${g}/cancel`, {
           method: "POST"
-        }), await Y();
-      } catch (y) {
-        console.error("Failed to cancel queue item:", y);
+        }), await Q();
+      } catch (v) {
+        console.error("Failed to cancel queue item:", v);
       }
       return;
     }
-    F((y) => y.filter((T) => T.id !== x));
-  }, [l, e, Y]), we = O(() => {
-    m(null), v([]), k(""), I(null), ue([]), F([]);
-  }, []), q = c.find(
-    (x) => x.slug === o || x.name === o
+    A((v) => v.filter((M) => M.id !== g));
+  }, [l, e, Q]), we = F(() => {
+    x(null), w([]), T(""), S(null), ie([]), A([]);
+  }, []), K = c.find(
+    (g) => g.slug === o || g.name === o
   );
-  return /* @__PURE__ */ i("div", { className: `harness-playground flex flex-col h-full bg-[#0a0a0a] relative overflow-hidden ${a}`, children: [
+  return /* @__PURE__ */ a("div", { className: `harness-playground flex flex-col h-full bg-[#0a0a0a] relative overflow-hidden ${i}`, children: [
     /* @__PURE__ */ t("div", { className: "ambient-glow ambient-glow-accent w-[40vw] h-[40vw] -top-[20%] -right-[10%] animate-pulse-slow" }),
     /* @__PURE__ */ t("div", { className: "ambient-glow ambient-glow-green w-[30vw] h-[30vw] bottom-[10%] -left-[10%] animate-pulse-slow" }),
     /* @__PURE__ */ t("div", { className: "fixed inset-0 grid-pattern pointer-events-none z-0" }),
     /* @__PURE__ */ t("div", { className: "fixed inset-0 noise-overlay pointer-events-none z-0" }),
-    /* @__PURE__ */ i("div", { className: "sticky top-0 flex items-center justify-between p-4 border-b border-white/10 glass-panel relative z-10", children: [
-      /* @__PURE__ */ i("div", { children: [
+    /* @__PURE__ */ a("div", { className: "sticky top-0 flex items-center justify-between p-4 border-b border-white/10 glass-panel relative z-10", children: [
+      /* @__PURE__ */ a("div", { children: [
         /* @__PURE__ */ t("h1", { className: "text-xl font-semibold text-white", children: "Playground" }),
-        q && /* @__PURE__ */ t("p", { className: "text-sm text-white/50 mt-0.5", children: q.description || `Chat with ${q.name}` })
+        K && /* @__PURE__ */ t("p", { className: "text-sm text-white/50 mt-0.5", children: K.description || `Chat with ${K.name}` })
       ] }),
-      /* @__PURE__ */ i("div", { className: "flex items-center gap-3", children: [
-        /* @__PURE__ */ i(
+      /* @__PURE__ */ a("div", { className: "flex items-center gap-3", children: [
+        /* @__PURE__ */ a(
           "select",
           {
             value: o || "",
-            onChange: (x) => {
-              w(x.target.value), we();
+            onChange: (g) => {
+              f(g.target.value), we();
             },
             className: "px-4 py-2.5 rounded-xl text-sm bg-white/5 border border-white/10 text-white focus:outline-none focus:border-[#ccff00]/50 transition-all duration-300",
             children: [
               c.length === 0 && /* @__PURE__ */ t("option", { value: "", children: "No agents" }),
-              c.map((x) => /* @__PURE__ */ t("option", { value: x.slug || x.name, className: "bg-[#0a0a0a]", children: x.name }, x.slug || x.name))
+              c.map((g) => /* @__PURE__ */ t("option", { value: g.slug || g.name, className: "bg-[#0a0a0a]", children: g.name }, g.slug || g.name))
             ]
           }
         ),
@@ -3151,47 +3380,47 @@ function $r({
         )
       ] })
     ] }),
-    A && /* @__PURE__ */ i("div", { className: "bg-red-500/10 border-b border-red-500/20 px-4 py-3 text-red-400 text-sm flex items-center justify-between relative z-10", children: [
-      /* @__PURE__ */ t("span", { children: A }),
+    X && /* @__PURE__ */ a("div", { className: "bg-red-500/10 border-b border-red-500/20 px-4 py-3 text-red-400 text-sm flex items-center justify-between relative z-10", children: [
+      /* @__PURE__ */ t("span", { children: X }),
       /* @__PURE__ */ t(
         "button",
         {
-          onClick: () => I(null),
+          onClick: () => S(null),
           className: "text-red-400/70 hover:text-red-400 transition-colors",
           children: /* @__PURE__ */ t("svg", { className: "w-4 h-4", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ t("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M6 18L18 6M6 6l12 12" }) })
         }
       )
     ] }),
-    /* @__PURE__ */ t("div", { className: "flex-1 overflow-hidden relative z-10", children: g.length === 0 && !M ? /* @__PURE__ */ t("div", { className: "h-full flex items-center justify-center", children: /* @__PURE__ */ i("div", { className: "text-center animate-fade-in", children: [
+    /* @__PURE__ */ t("div", { className: "flex-1 overflow-hidden relative z-10", children: m.length === 0 && !R ? /* @__PURE__ */ t("div", { className: "h-full flex items-center justify-center", children: /* @__PURE__ */ a("div", { className: "text-center animate-fade-in", children: [
       /* @__PURE__ */ t("div", { className: "w-16 h-16 mx-auto mb-4 rounded-2xl bg-[#ccff00]/10 border border-[#ccff00]/20 flex items-center justify-center", children: /* @__PURE__ */ t("svg", { className: "w-8 h-8 text-[#ccff00]", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ t("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M8.625 12a.375.375 0 1 1-.75 0 .375.375 0 0 1 .75 0Zm0 0H8.25m4.125 0a.375.375 0 1 1-.75 0 .375.375 0 0 1 .75 0Zm0 0H12m4.125 0a.375.375 0 1 1-.75 0 .375.375 0 0 1 .75 0Zm0 0h-.375M21 12c0 4.556-4.03 8.25-9 8.25a9.764 9.764 0 0 1-2.555-.337A5.972 5.972 0 0 1 5.41 20.97a5.969 5.969 0 0 1-.474-.065 4.48 4.48 0 0 0 .978-2.025c.09-.457-.133-.901-.467-1.226C3.93 16.178 3 14.189 3 12c0-4.556 4.03-8.25 9-8.25s9 3.694 9 8.25Z" }) }) }),
       /* @__PURE__ */ t("p", { className: "text-lg text-white/80", children: "Start a conversation" }),
-      /* @__PURE__ */ t("p", { className: "text-sm mt-1 text-white/40", children: o ? `Chat with ${(q == null ? void 0 : q.name) || o}` : "Select an agent to begin" })
+      /* @__PURE__ */ t("p", { className: "text-sm mt-1 text-white/40", children: o ? `Chat with ${(K == null ? void 0 : K.name) || o}` : "Select an agent to begin" })
     ] }) }) : /* @__PURE__ */ t(
-      On,
+      zn,
       {
-        messages: g,
-        loading: S,
-        streamingContent: M
+        messages: m,
+        loading: E,
+        streamingContent: R
       }
     ) }),
     /* @__PURE__ */ t("div", { className: "relative z-10", children: /* @__PURE__ */ t(
-      Pn,
+      Vn,
       {
-        onSend: be,
+        onSend: ke,
         disabled: !o,
-        loading: S,
-        queue: l ? P.map((x) => ({ id: x.id, text: x.prompt })) : W,
-        onCancelQueued: fe,
-        sessionContext: ie,
-        onSessionContextChange: ye,
-        envVars: ae,
-        onEnvVarsChange: R,
-        placeholder: o ? `Message ${(q == null ? void 0 : q.name) || o}...` : "Select an agent to start chatting"
+        loading: E,
+        queue: l ? W.map((g) => ({ id: g.id, text: g.prompt })) : G,
+        onCancelQueued: pe,
+        sessionContext: ee,
+        onSessionContextChange: B,
+        envVars: H,
+        onEnvVarsChange: C,
+        placeholder: o ? `Message ${(K == null ? void 0 : K.name) || o}...` : "Select an agent to start chatting"
       }
     ) }),
-    d && /* @__PURE__ */ i("div", { className: "px-4 py-2 border-t border-white/10 text-xs text-white/40 glass-panel relative z-10 flex items-center gap-2", children: [
+    d && /* @__PURE__ */ a("div", { className: "px-4 py-2 border-t border-white/10 text-xs text-white/40 glass-panel relative z-10 flex items-center gap-2", children: [
       /* @__PURE__ */ t("span", { className: "w-1.5 h-1.5 rounded-full bg-[#ccff00]" }),
-      /* @__PURE__ */ i("span", { className: "font-mono", children: [
+      /* @__PURE__ */ a("span", { className: "font-mono", children: [
         "Session: ",
         d.slice(0, 8),
         "..."
@@ -3199,27 +3428,27 @@ function $r({
     ] })
   ] });
 }
-function Ar({
+function Rr({
   entries: e,
   loading: n,
   streamingContent: r,
   displayConfig: s,
-  onOptionSelect: a
+  onOptionSelect: i
 }) {
   return /* @__PURE__ */ t(
-    En,
+    Ln,
     {
       entries: e,
       loading: n,
       streamingContent: r,
       displayConfig: s,
-      onOptionSelect: a
+      onOptionSelect: i
     }
   );
 }
-function Rr({ logs: e, isLoading: n, className: r }) {
+function Ar({ logs: e, isLoading: n, className: r }) {
   return /* @__PURE__ */ t(
-    Dn,
+    Wn,
     {
       logs: e,
       title: "Sandbox Logs",
@@ -3247,7 +3476,7 @@ function qn(e) {
   }
   return null;
 }
-function Vn(e, n) {
+function Jn(e, n) {
   const r = n || {};
   switch (e) {
     case "Bash":
@@ -3303,7 +3532,7 @@ function Vn(e, n) {
         query: r.query || ""
       };
     case "TodoWrite": {
-      const s = r.todos || [], a = {
+      const s = r.todos || [], i = {
         total: s.length,
         completed: s.filter((l) => l.status === "completed").length,
         inProgress: s.filter((l) => l.status === "in_progress").length,
@@ -3312,7 +3541,7 @@ function Vn(e, n) {
       return {
         action: "todo_write",
         todos: s,
-        stats: a
+        stats: i
       };
     }
     default: {
@@ -3330,7 +3559,7 @@ function Vn(e, n) {
     }
   }
 }
-function Gn(e, n, r) {
+function Un(e, n, r) {
   switch (r.action) {
     case "command_run":
       const s = r.command;
@@ -3354,18 +3583,18 @@ function Gn(e, n, r) {
     case "generic_tool":
       return r.toolName;
     case "todo_write": {
-      const { stats: a } = r;
-      return a ? `${a.completed}/${a.total} completed` : `${r.todos.length} tasks`;
+      const { stats: i } = r;
+      return i ? `${i.completed}/${i.total} completed` : `${r.todos.length} tasks`;
     }
     default:
       return "Unknown tool";
   }
 }
-function Jn(e) {
+function Kn(e) {
   return typeof e == "string" ? e : Array.isArray(e) ? e.filter((n) => typeof (n == null ? void 0 : n.text) == "string").map((n) => n.text).join(`
 `) : e && typeof e == "object" && "text" in e ? String(e.text) : JSON.stringify(e, null, 2);
 }
-function Un(e) {
+function Yn(e) {
   if (typeof e == "string")
     try {
       return { type: "json", value: JSON.parse(e) };
@@ -3389,8 +3618,8 @@ function Un(e) {
   }
   return { type: "json", value: e };
 }
-function Kn(e) {
-  const n = Jn(e);
+function Zn(e) {
+  const n = Kn(e);
   if (typeof e == "string")
     try {
       const r = JSON.parse(e);
@@ -3408,8 +3637,8 @@ function Kn(e) {
     // Assume success if no exit code
   };
 }
-function tt(e) {
-  const n = Vn(e.name, e.input), r = Gn(e.name, e.input, n);
+function st(e) {
+  const n = Jn(e.name, e.input), r = Un(e.name, e.input, n);
   return {
     id: e.id,
     toolName: e.name,
@@ -3419,36 +3648,36 @@ function tt(e) {
     startedAt: (/* @__PURE__ */ new Date()).toISOString()
   };
 }
-function nt(e, n, r) {
-  const s = { ...e }, a = { ...e.actionType };
-  if (s.status = r ? "failed" : "success", s.completedAt = (/* @__PURE__ */ new Date()).toISOString(), s.isError = r, a.action === "command_run") {
-    const l = Kn(n);
-    a.result = l, l.exitCode !== void 0 && l.exitCode !== 0 && (s.status = "failed", s.isError = !0);
-  } else (a.action === "mcp_tool" || a.action === "generic_tool") && (a.result = Un(n));
-  return s.actionType = a, s;
+function at(e, n, r) {
+  const s = { ...e }, i = { ...e.actionType };
+  if (s.status = r ? "failed" : "success", s.completedAt = (/* @__PURE__ */ new Date()).toISOString(), s.isError = r, i.action === "command_run") {
+    const l = Zn(n);
+    i.result = l, l.exitCode !== void 0 && l.exitCode !== 0 && (s.status = "failed", s.isError = !0);
+  } else (i.action === "mcp_tool" || i.action === "generic_tool") && (i.result = Yn(n));
+  return s.actionType = i, s;
 }
-function Yn(e) {
+function Qn(e) {
   return e.type === "tool_use";
 }
-function Zn(e) {
+function Xn(e) {
   return e.type === "tool_result";
 }
 function Dr(e) {
   const n = [], r = /* @__PURE__ */ new Map(), s = /* @__PURE__ */ new Map();
-  for (const a of e) {
-    const l = a.createdAt instanceof Date ? a.createdAt.toISOString() : a.createdAt;
-    for (const c of a.content)
+  for (const i of e) {
+    const l = i.createdAt instanceof Date ? i.createdAt.toISOString() : i.createdAt;
+    for (const c of i.content)
       if (c.type === "text" && "text" in c)
         n.push({
-          id: `${a.id}-text-${n.length}`,
+          id: `${i.id}-text-${n.length}`,
           timestamp: l,
           entryType: {
-            type: a.role === "user" ? "user_message" : "assistant_message"
+            type: i.role === "user" ? "user_message" : "assistant_message"
           },
           content: c.text
         });
-      else if (Yn(c)) {
-        const h = tt(c);
+      else if (Qn(c)) {
+        const h = st(c);
         r.set(c.id, h);
         const o = {
           id: c.id,
@@ -3460,30 +3689,30 @@ function Dr(e) {
           content: h.summary
         };
         n.push(o), s.set(c.id, o);
-      } else if (Zn(c)) {
+      } else if (Xn(c)) {
         const h = c.toolUseId, o = r.get(h);
         if (o) {
-          const w = nt(
+          const f = at(
             o,
             c.content,
             c.isError
           ), d = s.get(h);
-          d && d.entryType.type === "tool_call" && (d.entryType.toolCall = w), r.delete(h);
+          d && d.entryType.type === "tool_call" && (d.entryType.toolCall = f), r.delete(h);
         }
       }
   }
   return n;
 }
-const Se = class Se {
+const Ee = class Ee {
   constructor() {
-    ee(this, "entries", []);
-    ee(this, "pendingToolCalls", /* @__PURE__ */ new Map());
-    ee(this, "listeners", /* @__PURE__ */ new Set());
-    ee(this, "currentTextContent", "");
-    ee(this, "currentTextEntryId", null);
-    ee(this, "hadToolCallSinceText", !1);
+    se(this, "entries", []);
+    se(this, "pendingToolCalls", /* @__PURE__ */ new Map());
+    se(this, "listeners", /* @__PURE__ */ new Set());
+    se(this, "currentTextContent", "");
+    se(this, "currentTextEntryId", null);
+    se(this, "hadToolCallSinceText", !1);
     /** Track the last few deltas to detect duplicates (prevents double-processing) */
-    ee(this, "recentDeltas", []);
+    se(this, "recentDeltas", []);
   }
   /**
    * Subscribe to entry updates.
@@ -3570,7 +3799,7 @@ const Se = class Se {
         console.warn("[ToolCallProcessor] Skipping potential duplicate delta");
         return;
       }
-      this.recentDeltas.push(s), this.recentDeltas.length > Se.MAX_RECENT_DELTAS && this.recentDeltas.shift();
+      this.recentDeltas.push(s), this.recentDeltas.length > Ee.MAX_RECENT_DELTAS && this.recentDeltas.shift();
     }
     if (this.hadToolCallSinceText && this.currentTextEntryId && (this.currentTextContent = "", this.currentTextEntryId = null, this.hadToolCallSinceText = !1), this.currentTextContent += n, !this.currentTextEntryId)
       this.currentTextEntryId = `text-${Date.now()}-${Math.random().toString(36).slice(2)}`, this.entries.push({
@@ -3580,13 +3809,13 @@ const Se = class Se {
         content: this.currentTextContent
       });
     else {
-      const s = this.entries.findIndex((a) => a.id === this.currentTextEntryId);
+      const s = this.entries.findIndex((i) => i.id === this.currentTextEntryId);
       if (s !== -1) {
-        const a = this.entries[s];
-        a && (this.entries[s] = {
-          id: a.id,
-          timestamp: a.timestamp,
-          entryType: a.entryType,
+        const i = this.entries[s];
+        i && (this.entries[s] = {
+          id: i.id,
+          timestamp: i.timestamp,
+          entryType: i.entryType,
           content: this.currentTextContent
         });
       }
@@ -3604,7 +3833,7 @@ const Se = class Se {
    */
   handleToolUse(n) {
     this.finalizeCurrentText(), this.hadToolCallSinceText = !0;
-    const r = tt({
+    const r = st({
       id: n.id,
       name: n.name,
       input: n.input
@@ -3616,8 +3845,8 @@ const Se = class Se {
         toolCall: r
       },
       content: r.summary
-    }, a = this.entries.length;
-    this.entries.push(s), this.pendingToolCalls.set(n.id, { entryIndex: a, toolCall: r }), this.emit();
+    }, i = this.entries.length;
+    this.entries.push(s), this.pendingToolCalls.set(n.id, { entryIndex: i, toolCall: r }), this.emit();
   }
   /**
    * Handle tool_result event - update pending tool call with result
@@ -3625,19 +3854,19 @@ const Se = class Se {
   handleToolResult(n) {
     const r = this.pendingToolCalls.get(n.toolUseId);
     if (r) {
-      const s = nt(
+      const s = at(
         r.toolCall,
         n.content,
         n.isError
-      ), a = this.entries[r.entryIndex];
-      a && a.entryType.type === "tool_call" && (this.entries[r.entryIndex] = {
-        id: a.id,
-        timestamp: a.timestamp,
+      ), i = this.entries[r.entryIndex];
+      i && i.entryType.type === "tool_call" && (this.entries[r.entryIndex] = {
+        id: i.id,
+        timestamp: i.timestamp,
         entryType: {
           type: "tool_call",
           toolCall: s
         },
-        content: a.content
+        content: i.content
       }), this.pendingToolCalls.delete(n.toolUseId), this.emit();
     }
   }
@@ -3664,76 +3893,76 @@ const Se = class Se {
     this.listeners.forEach((r) => r(n));
   }
 };
-ee(Se, "MAX_RECENT_DELTAS", 10);
-let Re = Se;
+se(Ee, "MAX_RECENT_DELTAS", 10);
+let De = Ee;
 function jr() {
-  return new Re();
+  return new De();
 }
 export {
-  Ye as ActionIcon,
-  St as AlertCircleIcon,
-  Ke as AlertTriangleIcon,
-  rn as AssistantMessage,
+  Xe as ActionIcon,
+  It as AlertCircleIcon,
+  Ze as AlertTriangleIcon,
+  an as AssistantMessage,
   gr as BrainIcon,
-  Mt as BugIcon,
-  Pn as ChatInput,
-  Et as CheckCircleIcon,
-  Ct as CheckIcon,
-  je as ChevronDownIcon,
-  cr as ChevronLeftIcon,
-  ve as ChevronRightIcon,
-  dr as ChevronUpIcon,
-  se as CodeBlock,
-  ur as CodeIcon,
-  hr as CopyIcon,
+  Lt as BugIcon,
+  Vn as ChatInput,
+  $t as CheckCircleIcon,
+  Ye as CheckIcon,
+  We as ChevronDownIcon,
+  dr as ChevronLeftIcon,
+  be as ChevronRightIcon,
+  ur as ChevronUpIcon,
+  oe as CodeBlock,
+  hr as CodeIcon,
+  St as CopyIcon,
   Oe as EditIcon,
-  ln as ErrorMessage,
-  We as FileIcon,
-  vt as FilePlusIcon,
-  kt as FolderSearchIcon,
-  yt as GlobeIcon,
-  Tt as InfoIcon,
-  Te as JsonDisplay,
-  On as LegacyMessageList,
-  _t as LoaderIcon,
-  $e as LoadingIndicator,
-  Dn as LogsPanel,
-  on as MessageEntry,
-  En as MessageList,
+  cn as ErrorMessage,
+  Be as FileIcon,
+  Nt as FilePlusIcon,
+  Tt as FolderSearchIcon,
+  kt as GlobeIcon,
+  Et as InfoIcon,
+  Me as JsonDisplay,
+  zn as LegacyMessageList,
+  Mt as LoaderIcon,
+  Re as LoadingIndicator,
+  Wn as LogsPanel,
+  dn as MessageEntry,
+  Ln as MessageList,
   xr as MessageSquareIcon,
-  or as MoonIcon,
-  Ar as NormalizedMessageList,
-  Lt as PaperclipIcon,
+  cr as MoonIcon,
+  Rr as NormalizedMessageList,
+  At as PaperclipIcon,
   $r as Playground,
-  bt as PlugIcon,
-  Rr as SandboxLogsPanel,
-  _e as SearchIcon,
+  Ct as PlugIcon,
+  Ar as SandboxLogsPanel,
+  Se as SearchIcon,
   pr as SendIcon,
-  $t as SparklesIcon,
-  Wt as StatusIndicator,
+  Qe as SparklesIcon,
+  Ot as StatusIndicator,
   fr as StopCircleIcon,
-  cn as StreamingText,
-  lr as SunIcon,
-  Me as TerminalIcon,
+  un as StreamingText,
+  or as SunIcon,
+  Ie as TerminalIcon,
   Ir as ThemeProvider,
-  sn as ThinkingMessage,
-  Be as ToolCallCard,
-  an as ToolCallMessage,
-  Re as ToolCallProcessor,
-  Nt as ToolIcon,
-  nn as UserMessage,
-  It as XCircleIcon,
+  ln as ThinkingMessage,
+  ze as ToolCallCard,
+  on as ToolCallMessage,
+  De as ToolCallProcessor,
+  _t as ToolIcon,
+  sn as UserMessage,
+  Rt as XCircleIcon,
   mr as XIcon,
   p as cn,
-  nr as createToolCall,
+  rr as createToolCall,
   jr as createToolCallProcessor,
-  mt as extractTextContent,
+  xt as extractTextContent,
   ir as formatFileSize,
-  De as formatTimestamp,
-  ct as formatToolName,
-  ht as generateToolSummary,
-  sr as getActionIcon,
-  Ue as getActionLabel,
+  je as formatTimestamp,
+  ht as formatToolName,
+  ft as generateToolSummary,
+  ar as getActionIcon,
+  Ke as getActionLabel,
   wr as isCommandRunAction,
   Er as isErrorEntry,
   yr as isFileEditAction,
@@ -3746,12 +3975,12 @@ export {
   Mr as isToolCallEntry,
   Cr as isWebFetchAction,
   _r as isWebSearchAction,
-  ut as mapToolToActionType,
+  pt as mapToolToActionType,
   Dr as normalizeMessages,
-  pt as normalizeToolResult,
-  ft as parseCommandResult,
-  dt as parseMcpToolName,
-  ar as truncate,
-  rr as updateToolCallWithResult,
+  gt as normalizeToolResult,
+  wt as parseCommandResult,
+  mt as parseMcpToolName,
+  lr as truncate,
+  sr as updateToolCallWithResult,
   Lr as useTheme
 };