chordia-ui 3.3.2 → 3.3.3

package/dist/components/chat.es.js

@@ -1,12 +1,12 @@
 import { jsxs as s, jsx as e, Fragment as J } from "react/jsx-runtime";
 import de, { useState as M, useRef as Y, useEffect as G, useCallback as xe } from "react";
-import { Wrench as ve, Check as Se, Copy as ke, PanelRightOpen as we, Send as ye, Search as Ce, MessageSquare as Te, Pin as ze, Clock as ge, Hash as he, AtSign as Re, Paperclip as Ae } from "lucide-react";
-import { ResponsiveContainer as Z, PieChart as Be, Pie as Le, Cell as ce, Tooltip as ee, AreaChart as Ie, CartesianGrid as ne, XAxis as oe, YAxis as ae, Legend as ie, Area as Me, LineChart as De, Line as Ee, BarChart as fe, Bar as me } from "recharts";
+import { Wrench as ve, Check as Se, Copy as we, PanelRightOpen as ke, Send as ye, Search as Ce, MessageSquare as ze, Pin as Te, Clock as ge, Hash as he, AtSign as Be, Paperclip as Re } from "lucide-react";
+import { ResponsiveContainer as Z, PieChart as Ae, Pie as Le, Cell as ce, Tooltip as ee, AreaChart as Ie, CartesianGrid as ne, XAxis as oe, YAxis as ie, Legend as ae, Area as Me, LineChart as De, Line as Ee, BarChart as fe, Bar as me } from "recharts";
 const We = ({ content: h, onCodeBlockClick: b, onFilePathClick: m }) => {
-  const [y, a] = M(/* @__PURE__ */ new Set()), v = async (o, n) => {
+  const [y, i] = M(/* @__PURE__ */ new Set()), v = async (o, n) => {
     try {
-      await navigator.clipboard.writeText(o), a((t) => /* @__PURE__ */ new Set([...t, n])), setTimeout(() => {
-        a((t) => {
+      await navigator.clipboard.writeText(o), i((t) => /* @__PURE__ */ new Set([...t, n])), setTimeout(() => {
+        i((t) => {
           const r = new Set(t);
           return r.delete(n), r;
         });
@@ -67,7 +67,7 @@ const We = ({ content: h, onCodeBlockClick: b, onFilePathClick: m }) => {
                   c.target.style.background = "none", c.target.style.color = "rgba(255,255,255,0.7)";
                 },
                 children: [
-                  r ? /* @__PURE__ */ e(Se, { size: 12 }) : /* @__PURE__ */ e(ke, { size: 12 }),
+                  r ? /* @__PURE__ */ e(Se, { size: 12 }) : /* @__PURE__ */ e(we, { size: 12 }),
                   r ? "Copied!" : "Copy"
                 ]
               }
@@ -96,7 +96,7 @@ const We = ({ content: h, onCodeBlockClick: b, onFilePathClick: m }) => {
                   c.currentTarget.style.background = "none", c.currentTarget.style.color = "rgba(255,255,255,0.7)";
                 },
                 children: [
-                  /* @__PURE__ */ e(we, { size: 12 }),
+                  /* @__PURE__ */ e(ke, { size: 12 }),
                   "Canvas"
                 ]
               }
@@ -117,14 +117,14 @@ const We = ({ content: h, onCodeBlockClick: b, onFilePathClick: m }) => {
       },
       t
     );
-  }, w = (o) => {
+  }, k = (o) => {
     const n = [], t = o.split(`
 `);
     let r = 0, c = 0;
     for (; r < t.length; ) {
-      const u = t[r];
-      if (u.trim().startsWith("```")) {
-        const p = u.trim().slice(3);
+      const g = t[r];
+      if (g.trim().startsWith("```")) {
+        const p = g.trim().slice(3);
         let C = [];
         for (r++; r < t.length && !t[r].trim().startsWith("```"); )
           C.push(t[r]), r++;
@@ -132,10 +132,10 @@ const We = ({ content: h, onCodeBlockClick: b, onFilePathClick: m }) => {
 `), p, `code-${c++}`));
         continue;
       }
-      if (u.startsWith("#")) {
-        const p = u.match(/^#+/)[0].length, C = u.slice(p).trim(), T = p === 1 ? "h2" : p === 2 ? "h3" : p === 3 ? "h4" : "h5";
+      if (g.startsWith("#")) {
+        const p = g.match(/^#+/)[0].length, C = g.slice(p).trim(), z = p === 1 ? "h2" : p === 2 ? "h3" : p === 3 ? "h4" : "h5";
         n.push(
-          de.createElement(T, {
+          de.createElement(z, {
             key: `header-${r}`,
             style: {
               fontSize: p === 1 ? "18px" : p === 2 ? "16px" : "14px",
@@ -149,7 +149,7 @@ const We = ({ content: h, onCodeBlockClick: b, onFilePathClick: m }) => {
         ), r++;
         continue;
       }
-      if (u.trim() === "---" || u.trim() === "***") {
+      if (g.trim() === "---" || g.trim() === "***") {
         n.push(
           /* @__PURE__ */ e("hr", { style: {
             border: "none",
@@ -159,18 +159,18 @@ const We = ({ content: h, onCodeBlockClick: b, onFilePathClick: m }) => {
         ), r++;
         continue;
       }
-      if (u.match(/^(\s*)([-*+]|\d+\.)\s/)) {
-        const p = [], C = /^\s*\d+\./.test(u);
+      if (g.match(/^(\s*)([-*+]|\d+\.)\s/)) {
+        const p = [], C = /^\s*\d+\./.test(g);
         for (; r < t.length && (t[r].match(/^(\s*)([-*+]|\d+\.)\s/) || t[r].trim() === ""); ) {
           if (t[r].trim() !== "") {
-            const R = t[r].match(/^(\s*)([-*+]|\d+\.)\s(.*)$/);
-            R && p.push(R[3]);
+            const B = t[r].match(/^(\s*)([-*+]|\d+\.)\s(.*)$/);
+            B && p.push(B[3]);
           }
           r++;
         }
-        const T = C ? "ol" : "ul";
+        const z = C ? "ol" : "ul";
         n.push(
-          de.createElement(T, {
+          de.createElement(z, {
             key: `list-${r}`,
             style: {
               margin: "8px 0",
@@ -178,20 +178,20 @@ const We = ({ content: h, onCodeBlockClick: b, onFilePathClick: m }) => {
               color: "var(--text-strong, rgba(30,33,37,0.92))"
             }
           }, p.map(
-            (R, i) => de.createElement("li", {
-              key: `item-${i}`,
+            (B, a) => de.createElement("li", {
+              key: `item-${a}`,
               style: { marginBottom: "4px" }
-            }, l(R))
+            }, d(B))
           ))
         );
         continue;
       }
-      if (u.trim().startsWith("|") && u.trim().endsWith("|")) {
+      if (g.trim().startsWith("|") && g.trim().endsWith("|")) {
         const p = [];
         for (; r < t.length && t[r].trim().startsWith("|") && t[r].trim().endsWith("|"); )
           p.push(t[r]), r++;
         if (p.length >= 2) {
-          const C = (d) => d.trim().slice(1, -1).split("|").map((x) => x.trim()), T = C(p[0]), R = (d) => C(d).every((x) => /^[-:]+$/.test(x)), i = p.length >= 2 && R(p[1]), k = i ? 2 : 1, D = i ? C(p[1]).map((d) => d.startsWith(":") && d.endsWith(":") ? "center" : d.endsWith(":") ? "right" : "left") : T.map(() => "left"), z = {
+          const C = (l) => l.trim().slice(1, -1).split("|").map((x) => x.trim()), z = C(p[0]), B = (l) => C(l).every((x) => /^[-:]+$/.test(x)), a = p.length >= 2 && B(p[1]), w = a ? 2 : 1, D = a ? C(p[1]).map((l) => l.startsWith(":") && l.endsWith(":") ? "center" : l.endsWith(":") ? "right" : "left") : z.map(() => "left"), T = {
             padding: "6px 12px",
             borderBottom: "1px solid var(--border-subtle, rgba(52,58,64,0.08))",
             fontSize: "13px",
@@ -206,14 +206,14 @@ const We = ({ content: h, onCodeBlockClick: b, onFilePathClick: m }) => {
               borderRadius: "6px",
               overflow: "hidden"
             }, children: [
-              i && /* @__PURE__ */ e("thead", { children: /* @__PURE__ */ e("tr", { style: { background: "var(--hover-warm-subtle, rgba(231,212,162,0.08))" }, children: T.map((d, x) => /* @__PURE__ */ e("th", { style: { ...z, fontWeight: 660, textAlign: D[x] || "left", whiteSpace: "nowrap" }, children: l(d) }, x)) }) }),
-              /* @__PURE__ */ e("tbody", { children: (i ? p.slice(k) : p).map((d, x) => /* @__PURE__ */ e("tr", { style: { background: x % 2 === 1 ? "var(--hover-warm-subtle, rgba(231,212,162,0.04))" : "transparent" }, children: C(d).map((I, S) => /* @__PURE__ */ e("td", { style: { ...z, textAlign: D[S] || "left" }, children: l(I) }, S)) }, x)) })
+              a && /* @__PURE__ */ e("thead", { children: /* @__PURE__ */ e("tr", { style: { background: "var(--hover-warm-subtle, rgba(231,212,162,0.08))" }, children: z.map((l, x) => /* @__PURE__ */ e("th", { style: { ...T, fontWeight: 660, textAlign: D[x] || "left", whiteSpace: "nowrap" }, children: d(l) }, x)) }) }),
+              /* @__PURE__ */ e("tbody", { children: (a ? p.slice(w) : p).map((l, x) => /* @__PURE__ */ e("tr", { style: { background: x % 2 === 1 ? "var(--hover-warm-subtle, rgba(231,212,162,0.04))" : "transparent" }, children: C(l).map((I, S) => /* @__PURE__ */ e("td", { style: { ...T, textAlign: D[S] || "left" }, children: d(I) }, S)) }, x)) })
             ] }) }, `table-${r}`)
           );
         }
         continue;
       }
-      if (u.trim()) {
+      if (g.trim()) {
         const p = [];
         for (; r < t.length && t[r].trim() && !t[r].match(/^(#|```|---|\*\*\*|(\s*)([-*+]|\d+\.)\s)/) && !(t[r].trim().startsWith("|") && t[r].trim().endsWith("|")); )
           p.push(t[r]), r++;
@@ -222,7 +222,7 @@ const We = ({ content: h, onCodeBlockClick: b, onFilePathClick: m }) => {
             margin: "8px 0",
             lineHeight: 1.6,
             color: "var(--text-strong, rgba(30,33,37,0.92))"
-          }, children: l(p.join(" ")) }, `p-${r}`)
+          }, children: d(p.join(" ")) }, `p-${r}`)
         );
       } else
         r++;
@@ -233,14 +233,14 @@ const We = ({ content: h, onCodeBlockClick: b, onFilePathClick: m }) => {
     let t = o, r = 0;
     for (; t.length > 0; ) {
       if (m) {
-        const R = t.match(/^([^\s`*\[]+(?:\/src\/|\/components\/|\/packages\/)[^\s`*\[]*|[^\s`*\[]*\.(ts|tsx|js|jsx|py|css|scss|sass|json|md|yaml|yml|html|xml|sh|sql|go|rs|php|java|c|cpp|h|hpp)(?:\b|$))/);
-        if (R) {
-          const i = R[1];
+        const B = t.match(/^([^\s`*\[]+(?:\/src\/|\/components\/|\/packages\/)[^\s`*\[]*|[^\s`*\[]*\.(ts|tsx|js|jsx|py|css|scss|sass|json|md|yaml|yml|html|xml|sh|sql|go|rs|php|java|c|cpp|h|hpp)(?:\b|$))/);
+        if (B) {
+          const a = B[1];
           n.push(
             /* @__PURE__ */ e(
               "span",
               {
-                onClick: () => m(i),
+                onClick: () => m(a),
                 style: {
                   color: "var(--rail-discovery, #5E88B0)",
                   textDecoration: "underline",
@@ -256,17 +256,17 @@ const We = ({ content: h, onCodeBlockClick: b, onFilePathClick: m }) => {
                     textDecorationStyle: "solid"
                   }
                 },
-                onMouseEnter: (k) => {
-                  k.target.style.background = "var(--hover-warm-subtle, rgba(231,212,162,0.08))", k.target.style.textDecorationStyle = "solid";
+                onMouseEnter: (w) => {
+                  w.target.style.background = "var(--hover-warm-subtle, rgba(231,212,162,0.08))", w.target.style.textDecorationStyle = "solid";
                 },
-                onMouseLeave: (k) => {
-                  k.target.style.background = "none", k.target.style.textDecorationStyle = "dotted";
+                onMouseLeave: (w) => {
+                  w.target.style.background = "none", w.target.style.textDecorationStyle = "dotted";
                 },
-                children: i
+                children: a
               },
               `file-path-${r++}`
             )
-          ), t = t.slice(R[0].length);
+          ), t = t.slice(B[0].length);
           continue;
         }
       }
@@ -285,14 +285,14 @@ const We = ({ content: h, onCodeBlockClick: b, onFilePathClick: m }) => {
         ), t = t.slice(c[0].length);
         continue;
       }
-      const u = t.match(/^\*\*([^*]+)\*\*/);
-      if (u) {
+      const g = t.match(/^\*\*([^*]+)\*\*/);
+      if (g) {
         n.push(
           /* @__PURE__ */ e("strong", { style: {
             fontWeight: 720,
             color: "var(--text-strong, rgba(30,33,37,0.92))"
-          }, children: u[1] }, `bold-${r++}`)
-        ), t = t.slice(u[0].length);
+          }, children: g[1] }, `bold-${r++}`)
+        ), t = t.slice(g[0].length);
         continue;
       }
       const p = t.match(/^\*([^*]+)\*/);
@@ -326,26 +326,26 @@ const We = ({ content: h, onCodeBlockClick: b, onFilePathClick: m }) => {
         ), t = t.slice(C[0].length);
         continue;
       }
-      const T = t.search(/[`*\[]/);
-      if (T === -1) {
+      const z = t.search(/[`*\[]/);
+      if (z === -1) {
         n.push(t);
         break;
       } else
-        T === 0 ? (n.push(t[0]), t = t.slice(1)) : (n.push(t.slice(0, T)), t = t.slice(T));
+        z === 0 ? (n.push(t[0]), t = t.slice(1)) : (n.push(t.slice(0, z)), t = t.slice(z));
     }
     return n.length === 1 && typeof n[0] == "string" ? n[0] : n;
-  }, l = (o) => f(o);
-  return /* @__PURE__ */ e("div", { children: w(h) });
+  }, d = (o) => f(o);
+  return /* @__PURE__ */ e("div", { children: k(h) });
 };
 function be({
   role: h,
   content: b,
   html: m,
   timestamp: y,
-  toolBadges: a,
+  toolBadges: i,
   isStreaming: v,
   onCodeBlockClick: L,
-  onFilePathClick: w
+  onFilePathClick: k
 }) {
   const f = h === "user";
   return /* @__PURE__ */ s(
@@ -375,13 +375,13 @@ function be({
             ]
           }
         ),
-        a && a.length > 0 && /* @__PURE__ */ e("div", { style: {
+        i && i.length > 0 && /* @__PURE__ */ e("div", { style: {
           marginBottom: "8px",
           display: "flex",
           flexWrap: "wrap",
           gap: "4px",
           maxWidth: "75%"
-        }, children: a.map((l, o) => /* @__PURE__ */ s(
+        }, children: i.map((d, o) => /* @__PURE__ */ s(
           "span",
           {
             style: {
@@ -390,16 +390,16 @@ function be({
               padding: "2px 8px",
               borderRadius: "6px",
               background: "var(--paper-elevated, rgba(255,255,255,0.82))",
-              border: `1px solid ${l.pending ? "var(--rail-discovery, #5A8CC0)" : l.success !== !1 ? "var(--state-present, #5CB85C)" : "var(--rail-signal-churn, #C98A5A)"}`,
-              color: l.pending ? "var(--rail-discovery, #5A8CC0)" : l.success !== !1 ? "var(--state-present, #5CB85C)" : "var(--rail-signal-churn, #C98A5A)"
+              border: `1px solid ${d.pending ? "var(--rail-discovery, #5A8CC0)" : d.success !== !1 ? "var(--state-present, #5CB85C)" : "var(--rail-signal-churn, #C98A5A)"}`,
+              color: d.pending ? "var(--rail-discovery, #5A8CC0)" : d.success !== !1 ? "var(--state-present, #5CB85C)" : "var(--rail-signal-churn, #C98A5A)"
             },
             children: [
               /* @__PURE__ */ e(ve, { size: 10, style: { marginRight: 3, verticalAlign: "middle" } }),
-              l.name,
-              l.pending ? "..." : l.success !== !1 ? " ✓" : " ✗"
+              d.name,
+              d.pending ? "..." : d.success !== !1 ? " ✓" : " ✗"
             ]
           },
-          l.id || o
+          d.id || o
         )) }),
         /* @__PURE__ */ e(
           "div",
@@ -420,7 +420,7 @@ function be({
               /* @__PURE__ */ e("div", { style: { whiteSpace: "pre-wrap" }, children: b })
             ) : (
               // Assistant messages get markdown rendering
-              /* @__PURE__ */ e(We, { content: b || "", onCodeBlockClick: L, onFilePathClick: w })
+              /* @__PURE__ */ e(We, { content: b || "", onCodeBlockClick: L, onFilePathClick: k })
             )
           }
         ),
@@ -440,12 +440,12 @@ function be({
     }
   );
 }
-function _e({
+function Fe({
   phase: h = "thinking",
   toolSteps: b = [],
   label: m,
   elapsedMs: y,
-  compact: a = !1
+  compact: i = !1
 }) {
   const v = (t) => {
     if (!t || t < 1e3)
@@ -453,8 +453,8 @@ function _e({
     const r = Math.floor(t / 1e3);
     if (r < 60)
       return `${r}s`;
-    const c = Math.floor(r / 60), u = r % 60;
-    return u > 0 ? `${c}m ${u}s` : `${c}m`;
+    const c = Math.floor(r / 60), g = r % 60;
+    return g > 0 ? `${c}m ${g}s` : `${c}m`;
   }, L = () => {
     if (m)
       return m;
@@ -468,14 +468,14 @@ function _e({
       default:
         return "Thinking...";
     }
-  }, w = (t, r) => {
+  }, k = (t, r) => {
     const c = () => {
       const p = {
-        width: a ? "4px" : "6px",
-        height: a ? "4px" : "6px",
+        width: i ? "4px" : "6px",
+        height: i ? "4px" : "6px",
         borderRadius: "50%",
         display: "inline-block",
-        marginRight: a ? "6px" : "8px"
+        marginRight: i ? "6px" : "8px"
       };
       switch (t.status) {
         case "active":
@@ -520,17 +520,17 @@ function _e({
             }
           );
       }
-    }, u = () => {
+    }, g = () => {
       switch (t.status) {
         case "done":
           return /* @__PURE__ */ e("span", { style: {
             color: "var(--text-faint, rgba(30,33,37,0.36))",
-            fontSize: a ? "9px" : "var(--text-xs-plus, 10.5px)"
+            fontSize: i ? "9px" : "var(--text-xs-plus, 10.5px)"
           }, children: "✓" });
         case "error":
           return /* @__PURE__ */ e("span", { style: {
             color: "var(--rail-compliance, #C98A5A)",
-            fontSize: a ? "9px" : "var(--text-xs-plus, 10.5px)"
+            fontSize: i ? "9px" : "var(--text-xs-plus, 10.5px)"
           }, children: "failed" });
         default:
           return null;
@@ -543,27 +543,27 @@ function _e({
           display: "flex",
           alignItems: "center",
           justifyContent: "space-between",
-          marginBottom: a ? "2px" : "4px"
+          marginBottom: i ? "2px" : "4px"
         },
         children: [
           /* @__PURE__ */ s("div", { style: { display: "flex", alignItems: "center" }, children: [
             c(),
             /* @__PURE__ */ e("span", { style: {
               fontFamily: "var(--font-mono)",
-              fontSize: a ? "9px" : "var(--text-xs-plus, 10.5px)",
+              fontSize: i ? "9px" : "var(--text-xs-plus, 10.5px)",
               color: "var(--text-muted)"
             }, children: t.name })
           ] }),
-          u()
+          g()
         ]
       },
       r
     );
   }, f = () => /* @__PURE__ */ e("div", { style: {
     width: "100%",
-    height: a ? "2px" : "3px",
+    height: i ? "2px" : "3px",
     backgroundColor: "var(--border-subtle, rgba(52,58,64,0.08))",
-    borderRadius: a ? "2px" : "3px",
+    borderRadius: i ? "2px" : "3px",
     overflow: "hidden",
     position: "relative"
   }, children: /* @__PURE__ */ e("div", { style: {
@@ -574,9 +574,9 @@ function _e({
     bottom: 0,
     background: "linear-gradient(90deg, transparent 0%, rgba(155,122,168,0.3) 50%, transparent 100%)",
     animation: "shimmer 2s linear infinite"
-  } }) }), l = () => /* @__PURE__ */ e("span", { style: {
-    width: a ? "4px" : "6px",
-    height: a ? "10px" : "14px",
+  } }) }), d = () => /* @__PURE__ */ e("span", { style: {
+    width: i ? "4px" : "6px",
+    height: i ? "10px" : "14px",
     backgroundColor: "var(--rail-purple, #9B7AA8)",
     borderRadius: "1px",
     display: "inline-block",
@@ -584,11 +584,11 @@ function _e({
     animation: "cursorBlink 0.8s ease-in-out infinite"
   } }), o = L(), n = v(y);
   return /* @__PURE__ */ s("div", { style: {
-    borderLeft: `${a ? "3px" : "4px"} solid var(--rail-purple, #9B7AA8)`,
+    borderLeft: `${i ? "3px" : "4px"} solid var(--rail-purple, #9B7AA8)`,
     backgroundColor: "var(--card-assistant, rgba(155,122,168,0.06))",
     border: "1px solid var(--border-subtle, rgba(52,58,64,0.08))",
-    borderRadius: a ? "8px" : "10px",
-    padding: a ? "8px 10px 8px 12px" : "10px 14px 10px 18px"
+    borderRadius: i ? "8px" : "10px",
+    padding: i ? "8px 10px 8px 12px" : "10px 14px 10px 18px"
   }, children: [
     /* @__PURE__ */ e("style", { children: `
           @keyframes shimmer {
@@ -606,7 +606,7 @@ function _e({
             50% { opacity: 1; }
           }
         ` }),
-    !a && /* @__PURE__ */ e("div", { style: {
+    !i && /* @__PURE__ */ e("div", { style: {
       fontSize: "var(--text-xs-plus, 10.5px)",
       fontWeight: 650,
       textTransform: "uppercase",
@@ -618,15 +618,15 @@ function _e({
       /* @__PURE__ */ s("div", { style: {
         color: "var(--text-muted)",
         fontWeight: 400,
-        fontSize: a ? "11px" : "13px",
-        marginBottom: a ? "4px" : "8px",
+        fontSize: i ? "11px" : "13px",
+        marginBottom: i ? "4px" : "8px",
         display: "flex",
         alignItems: "center",
         gap: "6px"
       }, children: [
         o,
         n && /* @__PURE__ */ e("span", { style: {
-          fontSize: a ? "9px" : "10px",
+          fontSize: i ? "9px" : "10px",
           color: "var(--text-faint, rgba(30,33,37,0.36))",
           fontFamily: "var(--font-mono, monospace)"
         }, children: n })
@@ -637,43 +637,43 @@ function _e({
       o && /* @__PURE__ */ s("div", { style: {
         color: "var(--text-muted)",
         fontWeight: 400,
-        fontSize: a ? "11px" : "13px",
-        marginBottom: a ? "4px" : "8px",
+        fontSize: i ? "11px" : "13px",
+        marginBottom: i ? "4px" : "8px",
         display: "flex",
         alignItems: "center",
         gap: "6px"
       }, children: [
         o,
         n && /* @__PURE__ */ e("span", { style: {
-          fontSize: a ? "9px" : "10px",
+          fontSize: i ? "9px" : "10px",
           color: "var(--text-faint, rgba(30,33,37,0.36))",
           fontFamily: "var(--font-mono, monospace)"
         }, children: n })
       ] }),
-      /* @__PURE__ */ e("div", { style: { marginBottom: a ? "4px" : "8px" }, children: b.map((t, r) => w(t, r)) }),
+      /* @__PURE__ */ e("div", { style: { marginBottom: i ? "4px" : "8px" }, children: b.map((t, r) => k(t, r)) }),
       f()
     ] }),
     h === "responding" && /* @__PURE__ */ s("div", { style: {
       color: "var(--text-muted)",
       fontWeight: 400,
-      fontSize: a ? "11px" : "13px",
+      fontSize: i ? "11px" : "13px",
       display: "flex",
       alignItems: "center",
       gap: "6px"
     }, children: [
       /* @__PURE__ */ s("div", { style: { display: "flex", alignItems: "center" }, children: [
         o,
-        l()
+        d()
       ] }),
       n && /* @__PURE__ */ e("span", { style: {
-        fontSize: a ? "9px" : "10px",
+        fontSize: i ? "9px" : "10px",
         color: "var(--text-faint, rgba(30,33,37,0.36))",
         fontFamily: "var(--font-mono, monospace)"
       }, children: n })
     ] })
   ] });
 }
-const Fe = { error: (...h) => console.warn("toast.error:", ...h) };
+const _e = { error: (...h) => console.warn("toast.error:", ...h) };
 function qe({
   initialMessages: h = [],
   onSendMessage: b,
@@ -681,39 +681,39 @@ function qe({
   // NEW: streaming version of onSendMessage
   onMessagesChange: y,
   // NEW: callback when messages array changes
-  onCodeBlockClick: a,
+  onCodeBlockClick: i,
   // callback when "Canvas" button clicked on a code block: ({ code, language }) => void
   placeholder: v = "Ask a question about this interaction...",
   title: L = "Chat with Chordia"
 }) {
-  const [w, f] = M(h || []), [l, o] = M(""), [n, t] = M(!1), [r, c] = M(!1), [u, p] = M(null), [C, T] = M("thinking"), [R, i] = M(null), [k, D] = M(0), z = Y(null), d = Y(null), x = Y(null), I = Y(null), S = Y(null), [E, F] = M(!1), [H, X] = M(0);
+  const [k, f] = M(h || []), [d, o] = M(""), [n, t] = M(!1), [r, c] = M(!1), [g, p] = M(null), [C, z] = M("thinking"), [B, a] = M(null), [w, D] = M(0), T = Y(null), l = Y(null), x = Y(null), I = Y(null), S = Y(null), [E, _] = M(!1), [H, X] = M(0);
   G(() => {
-    var g;
-    (g = z.current) == null || g.scrollIntoView({ behavior: "smooth" });
-  }, [w, n]), G(() => {
-    d.current && (d.current.style.height = "auto", d.current.style.height = `${Math.min(
-      d.current.scrollHeight,
+    var u;
+    (u = T.current) == null || u.scrollIntoView({ behavior: "smooth" });
+  }, [k, n]), G(() => {
+    l.current && (l.current.style.height = "auto", l.current.style.height = `${Math.min(
+      l.current.scrollHeight,
       120
     )}px`);
-  }, [l]), G(() => {
+  }, [d]), G(() => {
     if (y) {
-      const g = [...w];
-      u && g.push(u), y(g);
+      const u = [...k];
+      g && u.push(g), y(u);
     }
-  }, [w, u, y]), G(() => {
-    let g;
-    return n && R && (g = setInterval(() => {
-      if (D(Date.now() - R), S.current) {
+  }, [k, g, y]), G(() => {
+    let u;
+    return n && B && (u = setInterval(() => {
+      if (D(Date.now() - B), S.current) {
         const W = (Date.now() - S.current) / 1e3;
-        W >= 3 ? (F(!0), X(Math.floor(W))) : F(!1);
+        W >= 3 ? (_(!0), X(Math.floor(W))) : _(!1);
       }
-    }, 500)), () => g && clearInterval(g);
-  }, [n, R]);
+    }, 500)), () => u && clearInterval(u);
+  }, [n, B]);
   const P = () => {
-    t(!1), c(!1), p(null), I.current = null, T("thinking"), F(!1), X(0), S.current = null, i(null), D(0), x.current && (x.current.abort(), x.current = null);
-  }, N = (g) => {
-    if (g.startsWith("data: ")) {
-      const W = g.slice(6);
+    t(!1), c(!1), p(null), I.current = null, z("thinking"), _(!1), X(0), S.current = null, a(null), D(0), x.current && (x.current.abort(), x.current = null);
+  }, N = (u) => {
+    if (u.startsWith("data: ")) {
+      const W = u.slice(6);
       if (W === "[DONE]")
         return { type: "done" };
       try {
@@ -723,18 +723,18 @@ function qe({
       }
     }
     return null;
-  }, q = (g) => {
-    var j, A;
-    if (!((A = (j = g.choices) == null ? void 0 : j[0]) != null && A.delta))
+  }, q = (u) => {
+    var j, R;
+    if (!((R = (j = u.choices) == null ? void 0 : j[0]) != null && R.delta))
       return;
-    S.current = Date.now(), F(!1);
-    const W = g.choices[0].delta;
+    S.current = Date.now(), _(!1);
+    const W = u.choices[0].delta;
     if (W.tool_calls || W.tool_results) {
-      T("tool");
+      z("tool");
       return;
     }
-    W.content !== void 0 && (T("responding"), p((_) => {
-      const V = _ || {
+    W.content !== void 0 && (z("responding"), p((F) => {
+      const V = F || {
         id: Date.now().toString(),
         role: "assistant",
         content: "",
@@ -749,18 +749,18 @@ function qe({
       };
       return I.current = Q, Q;
     }));
-  }, U = async (g) => {
-    const W = g.getReader(), j = new TextDecoder();
-    let A = "";
+  }, U = async (u) => {
+    const W = u.getReader(), j = new TextDecoder();
+    let R = "";
     try {
       for (; ; ) {
-        const { done: _, value: V } = await W.read();
-        if (_)
+        const { done: F, value: V } = await W.read();
+        if (F)
           break;
-        A += j.decode(V, { stream: !0 });
-        const Q = A.split(`
+        R += j.decode(V, { stream: !0 });
+        const Q = R.split(`
 `);
-        A = Q.pop() || "";
+        R = Q.pop() || "";
         for (const ue of Q)
           if (ue.trim()) {
             const re = N(ue);
@@ -775,27 +775,27 @@ function qe({
       W.releaseLock();
     }
   }, K = async () => {
-    if (!l.trim() || r)
+    if (!d.trim() || r)
       return;
-    const g = l.trim(), W = {
+    const u = d.trim(), W = {
       id: Date.now().toString(),
       role: "user",
-      content: g,
+      content: u,
       timestamp: (/* @__PURE__ */ new Date()).toLocaleTimeString("en-US", {
         hour: "2-digit",
         minute: "2-digit"
       })
-    }, j = [...w, W];
-    f(j), o(""), t(!0), c(!0), T("thinking"), i(Date.now()), S.current = Date.now(), x.current = new AbortController();
+    }, j = [...k, W];
+    f(j), o(""), t(!0), c(!0), z("thinking"), a(Date.now()), S.current = Date.now(), x.current = new AbortController();
     try {
-      let A;
+      let R;
       if (m)
-        A = await m(g, j);
+        R = await m(u, j);
       else if (b)
-        A = await b(g, j);
+        R = await b(u, j);
       else {
         setTimeout(() => {
-          const _ = {
+          const F = {
             id: (Date.now() + 1).toString(),
             role: "assistant",
             content: "This is a demonstration response. In a real implementation, this would connect to your LLM backend.",
@@ -804,29 +804,29 @@ function qe({
               minute: "2-digit"
             })
           };
-          f((V) => [...V, _]), P();
+          f((V) => [...V, F]), P();
         }, 1e3);
         return;
       }
-      if (A instanceof ReadableStream)
-        await U(A);
-      else if (A instanceof Response && A.body)
-        await U(A.body);
-      else if (A && typeof A.then == "function") {
-        const _ = await A;
-        _ instanceof ReadableStream ? await U(_) : _ instanceof Response && _.body && await U(_.body);
+      if (R instanceof ReadableStream)
+        await U(R);
+      else if (R instanceof Response && R.body)
+        await U(R.body);
+      else if (R && typeof R.then == "function") {
+        const F = await R;
+        F instanceof ReadableStream ? await U(F) : F instanceof Response && F.body && await U(F.body);
       }
-      I.current && f((_) => [..._, {
+      I.current && f((F) => [...F, {
         ...I.current,
         isStreaming: !1
       }]);
-    } catch (A) {
-      A.name !== "AbortError" && (Fe.error("Failed to send message"), console.error("Stream error:", A));
+    } catch (R) {
+      R.name !== "AbortError" && (_e.error("Failed to send message"), console.error("Stream error:", R));
     } finally {
       P();
     }
-  }, $ = (g) => {
-    g.key === "Enter" && !g.shiftKey && (g.preventDefault(), K());
+  }, $ = (u) => {
+    u.key === "Enter" && !u.shiftKey && (u.preventDefault(), K());
   };
   return /* @__PURE__ */ s(
     "div",
@@ -887,7 +887,7 @@ function qe({
               display: "flex",
               flexDirection: "column"
             },
-            children: w.length === 0 ? /* @__PURE__ */ e(
+            children: k.length === 0 ? /* @__PURE__ */ e(
               "div",
               {
                 style: {
@@ -903,39 +903,39 @@ function qe({
                 children: "No messages yet. Start a conversation by asking a question below."
               }
             ) : /* @__PURE__ */ s(J, { children: [
-              w.map((g) => /* @__PURE__ */ e(
+              k.map((u) => /* @__PURE__ */ e(
                 be,
                 {
-                  role: g.role,
-                  content: g.content,
-                  html: g.html,
-                  timestamp: g.timestamp,
-                  toolBadges: g.toolBadges,
-                  isStreaming: g.isStreaming,
-                  onCodeBlockClick: a
+                  role: u.role,
+                  content: u.content,
+                  html: u.html,
+                  timestamp: u.timestamp,
+                  toolBadges: u.toolBadges,
+                  isStreaming: u.isStreaming,
+                  onCodeBlockClick: i
                 },
-                g.id
+                u.id
               )),
-              u && /* @__PURE__ */ e(
+              g && /* @__PURE__ */ e(
                 be,
                 {
-                  role: u.role,
-                  content: u.content,
-                  timestamp: u.timestamp,
+                  role: g.role,
+                  content: g.content,
+                  timestamp: g.timestamp,
                   isStreaming: !0,
-                  onCodeBlockClick: a
+                  onCodeBlockClick: i
                 },
-                u.id
+                g.id
               ),
-              n && (!u || E) && /* @__PURE__ */ e("div", { style: { marginBottom: "16px" }, children: /* @__PURE__ */ e(
-                _e,
+              n && (!g || E) && /* @__PURE__ */ e("div", { style: { marginBottom: "16px" }, children: /* @__PURE__ */ e(
+                Fe,
                 {
                   phase: E ? "tool" : C,
-                  elapsedMs: k,
+                  elapsedMs: w,
                   label: E && H >= 30 ? "Compacting conversation — trimming context to stay sharp..." : E && H >= 10 ? "Running background tasks..." : E ? "Still working..." : void 0
                 }
               ) }),
-              /* @__PURE__ */ e("div", { ref: z })
+              /* @__PURE__ */ e("div", { ref: T })
             ] })
           }
         ),
@@ -960,9 +960,9 @@ function qe({
                     /* @__PURE__ */ e(
                       "textarea",
                       {
-                        ref: d,
-                        value: l,
-                        onChange: (g) => o(g.target.value),
+                        ref: l,
+                        value: d,
+                        onChange: (u) => o(u.target.value),
                         onKeyDown: $,
                         placeholder: v,
                         rows: 1,
@@ -985,11 +985,11 @@ function qe({
                           opacity: r ? 0.6 : 1,
                           cursor: r ? "not-allowed" : "text"
                         },
-                        onFocus: (g) => {
-                          r || (g.target.style.borderColor = "rgba(94, 136, 176, 0.35)");
+                        onFocus: (u) => {
+                          r || (u.target.style.borderColor = "rgba(94, 136, 176, 0.35)");
                         },
-                        onBlur: (g) => {
-                          g.target.style.borderColor = "rgba(52, 58, 64, 0.18)";
+                        onBlur: (u) => {
+                          u.target.style.borderColor = "rgba(52, 58, 64, 0.18)";
                         }
                       }
                     ),
@@ -997,14 +997,14 @@ function qe({
                       "button",
                       {
                         onClick: K,
-                        disabled: !l.trim() || r,
+                        disabled: !d.trim() || r,
                         style: {
                           padding: "10px 16px",
-                          background: l.trim() && !r ? "var(--rail-discovery, #5E88B0)" : "var(--border-subtle, rgba(52,58,64,0.08))",
-                          color: l.trim() && !r ? "rgba(255, 255, 255, 0.95)" : "var(--text-faint, rgba(30,33,37,0.36))",
+                          background: d.trim() && !r ? "var(--Base-Strong, #0B0B0B)" : "#ECEEF2",
+                          color: d.trim() && !r ? "white" : "var(--text-base)",
                           border: "none",
                           borderRadius: "var(--radius-md, 8px)",
-                          cursor: l.trim() && !r ? "pointer" : "not-allowed",
+                          cursor: d.trim() && !r ? "pointer" : "not-allowed",
                           display: "flex",
                           alignItems: "center",
                           gap: "6px",
@@ -1013,12 +1013,6 @@ function qe({
                           transition: "all 0.15s ease",
                           height: "42px"
                         },
-                        onMouseEnter: (g) => {
-                          l.trim() && !r && (g.currentTarget.style.background = "rgba(94, 136, 176, 1)");
-                        },
-                        onMouseLeave: (g) => {
-                          l.trim() && !r && (g.currentTarget.style.background = "var(--rail-discovery, #5E88B0)");
-                        },
                         children: r ? /* @__PURE__ */ s(J, { children: [
                           /* @__PURE__ */ e("style", { children: `
                     @keyframes buttonSpin {
@@ -1072,7 +1066,7 @@ function Ve({
   activeThreadId: b,
   onSelectThread: m,
   onNewChat: y,
-  loading: a = !1
+  loading: i = !1
 }) {
   const [v, L] = M(""), f = [...h.filter((o) => {
     if (!v)
@@ -1086,7 +1080,7 @@ function Ve({
       return 1;
     const t = new Date(o.updated_at || o.created_at || 0).getTime();
     return new Date(n.updated_at || n.created_at || 0).getTime() - t;
-  }), l = (o) => {
+  }), d = (o) => {
     if (!o)
       return "";
     const n = new Date(o), r = (/* @__PURE__ */ new Date()).getTime() - n.getTime(), c = Math.floor(r / 864e5);
@@ -1142,15 +1136,15 @@ function Ve({
                           padding: "4px 10px",
                           fontSize: "11px",
                           fontWeight: 600,
-                          color: "var(--rail-discovery, #5E88B0)",
-                          background: "rgba(94, 136, 176, 0.08)",
+                          color: "var(--Base-Strong, #0B0B0B)",
+                          background: "#ECEEF2",
                           border: "1px solid var(--border-subtle, rgba(52,58,64,0.08))",
                           borderRadius: "6px",
                           cursor: "pointer",
                           transition: "all 0.15s ease"
                         },
                         onMouseEnter: (o) => {
-                          o.currentTarget.style.background = "rgba(94, 136, 176, 0.14)";
+                          o.currentTarget.style.background = "#ECEEF2";
                         },
                         onMouseLeave: (o) => {
                           o.currentTarget.style.background = "rgba(94, 136, 176, 0.08)";
@@ -1207,7 +1201,7 @@ function Ve({
             ]
           }
         ),
-        /* @__PURE__ */ e("div", { style: { flex: 1, overflowY: "auto", padding: "4px 6px" }, children: a ? /* @__PURE__ */ e(
+        /* @__PURE__ */ e("div", { style: { flex: 1, overflowY: "auto", padding: "4px 6px" }, children: i ? /* @__PURE__ */ e(
           "div",
           {
             style: {
@@ -1253,7 +1247,7 @@ function Ve({
               children: [
                 /* @__PURE__ */ s("div", { style: { display: "flex", alignItems: "center", gap: "6px", marginBottom: "4px" }, children: [
                   /* @__PURE__ */ e(
-                    Te,
+                    ze,
                     {
                       size: 12,
                       style: {
@@ -1277,7 +1271,7 @@ function Ve({
                       children: o.title || "Untitled thread"
                     }
                   ),
-                  o.pinned && /* @__PURE__ */ e(ze, { size: 10, style: { color: "var(--rail-discovery, #5E88B0)", flexShrink: 0 } })
+                  o.pinned && /* @__PURE__ */ e(Te, { size: 10, style: { color: "var(--rail-discovery, #5E88B0)", flexShrink: 0 } })
                 ] }),
                 o.last_message_preview && /* @__PURE__ */ e(
                   "div",
@@ -1307,7 +1301,7 @@ function Ve({
                     },
                     children: [
                       /* @__PURE__ */ e(ge, { size: 9 }),
-                      /* @__PURE__ */ e("span", { children: l(o.updated_at || o.created_at) }),
+                      /* @__PURE__ */ e("span", { children: d(o.updated_at || o.created_at) }),
                       o.message_count != null && /* @__PURE__ */ s(J, { children: [
                         /* @__PURE__ */ e("span", { children: "·" }),
                         /* @__PURE__ */ s("span", { children: [
@@ -1335,23 +1329,23 @@ function Ge({
   onSendMessage: m,
   currentUser: y
 }) {
-  var R;
-  const [a, v] = M(""), [L, w] = M(!1), [f, l] = M(b || []), [o, n] = M(!1), [t, r] = M(!1), { userData: c } = je(), u = Y(null), p = y || {
+  var B;
+  const [i, v] = M(""), [L, k] = M(!1), [f, d] = M(b || []), [o, n] = M(!1), [t, r] = M(!1), { userData: c } = je(), g = Y(null), p = y || {
     name: (c == null ? void 0 : c.name) || "You",
-    initials: ((R = c == null ? void 0 : c.name) == null ? void 0 : R.split(" ").map((i) => i[0]).join("").toUpperCase()) || "YO",
+    initials: ((B = c == null ? void 0 : c.name) == null ? void 0 : B.split(" ").map((a) => a[0]).join("").toUpperCase()) || "YO",
     color: "#6B7C93"
   };
   G(() => {
-    l(b || []);
+    d(b || []);
   }, [b]), G(() => {
-    u.current && u.current.scrollIntoView({ behavior: "smooth" });
+    g.current && g.current.scrollIntoView({ behavior: "smooth" });
   }, [f]);
   const C = async () => {
-    if (!a.trim())
+    if (!i.trim())
       return;
-    const i = a.trim();
+    const a = i.trim();
     v(""), r(!0);
-    const k = {
+    const w = {
       id: `temp-${Date.now()}`,
       author: {
         name: p.name,
@@ -1359,34 +1353,34 @@ function Ge({
         initials: p.initials,
         color: p.color
       },
-      content: i,
+      content: a,
       timestamp: "Just now",
       type: "comment",
       isOptimistic: !0
     };
-    if (l((D) => [...D, k]), m) {
+    if (d((D) => [...D, w]), m) {
       try {
-        await m(i), l(
+        await m(a), d(
           (D) => D.map(
-            (z) => z.id === k.id ? { ...z, isOptimistic: !1 } : z
+            (T) => T.id === w.id ? { ...T, isOptimistic: !1 } : T
           )
         );
       } catch {
-        l((z) => z.filter((d) => d.id !== k.id)), $e.error("Failed to send message");
+        d((T) => T.filter((l) => l.id !== w.id)), $e.error("Failed to send message");
       } finally {
         r(!1);
       }
       return;
     }
     setTimeout(() => {
-      l(
+      d(
         (D) => D.map(
-          (z) => z.id === k.id ? { ...z, isOptimistic: !1 } : z
+          (T) => T.id === w.id ? { ...T, isOptimistic: !1 } : T
         )
       ), r(!1);
     }, 500);
-  }, T = (i) => {
-    i.key === "Enter" && !i.shiftKey && (i.preventDefault(), C());
+  }, z = (a) => {
+    a.key === "Enter" && !a.shiftKey && (a.preventDefault(), C());
   };
   return /* @__PURE__ */ s(
     "div",
@@ -1474,23 +1468,23 @@ function Ge({
                   },
                   children: "No messages yet. Start the conversation!"
                 }
-              ) : f.map((i) => /* @__PURE__ */ s(
+              ) : f.map((a) => /* @__PURE__ */ s(
                 "div",
                 {
                   style: {
                     display: "flex",
                     gap: "12px",
-                    opacity: i.type === "system" ? 0.75 : 1
+                    opacity: a.type === "system" ? 0.75 : 1
                   },
                   children: [
-                    i.type !== "system" && /* @__PURE__ */ e(
+                    a.type !== "system" && /* @__PURE__ */ e(
                       "div",
                       {
                         style: {
                           width: "32px",
                           height: "32px",
                           borderRadius: "8px",
-                          background: i.author.color,
+                          background: a.author.color,
                           color: "white",
                           display: "flex",
                           alignItems: "center",
@@ -1500,10 +1494,10 @@ function Ge({
                           flexShrink: 0,
                           opacity: 0.9
                         },
-                        children: i.author.initials
+                        children: a.author.initials
                       }
                     ),
-                    i.type === "system" && /* @__PURE__ */ e(
+                    a.type === "system" && /* @__PURE__ */ e(
                       "div",
                       {
                         style: {
@@ -1541,7 +1535,7 @@ function Ge({
                                   fontWeight: 650,
                                   color: "var(--text-base, rgba(30,33,37,0.78))"
                                 },
-                                children: i.author.name
+                                children: a.author.name
                               }
                             ),
                             /* @__PURE__ */ e(
@@ -1552,10 +1546,10 @@ function Ge({
                                   color: "var(--text-faint, rgba(30,33,37,0.36))",
                                   fontFamily: "var(--font-mono, monospace)"
                                 },
-                                children: i.timestamp
+                                children: a.timestamp
                               }
                             ),
-                            i.author.role && /* @__PURE__ */ e(
+                            a.author.role && /* @__PURE__ */ e(
                               "span",
                               {
                                 style: {
@@ -1568,10 +1562,10 @@ function Ge({
                                   letterSpacing: "0.04em",
                                   fontWeight: 600
                                 },
-                                children: i.author.role
+                                children: a.author.role
                               }
                             ),
-                            i.isEdited && /* @__PURE__ */ e(
+                            a.isEdited && /* @__PURE__ */ e(
                               "span",
                               {
                                 style: {
@@ -1592,12 +1586,12 @@ function Ge({
                             fontSize: "var(--text-md, 13px)",
                             color: "var(--text-base, rgba(30,33,37,0.78))",
                             lineHeight: 1.5,
-                            marginBottom: i.references ? "8px" : 0
+                            marginBottom: a.references ? "8px" : 0
                           },
-                          children: i.content
+                          children: a.content
                         }
                       ),
-                      i.references && i.references.length > 0 && /* @__PURE__ */ e(
+                      a.references && a.references.length > 0 && /* @__PURE__ */ e(
                         "div",
                         {
                           style: {
@@ -1606,7 +1600,7 @@ function Ge({
                             gap: "6px",
                             marginTop: "8px"
                           },
-                          children: i.references.map((k, D) => /* @__PURE__ */ s(
+                          children: a.references.map((w, D) => /* @__PURE__ */ s(
                             "button",
                             {
                               type: "button",
@@ -1616,7 +1610,7 @@ function Ge({
                                 borderRadius: "6px",
                                 border: "1px solid rgba(52, 58, 64, 0.16)",
                                 background: "rgba(255, 255, 255, 0.7)",
-                                color: k.type === "condition" ? "rgba(94, 136, 176, 0.85)" : k.type === "observation" ? "rgba(107, 123, 147, 0.85)" : k.type === "timestamp" ? "rgba(184, 156, 106, 0.85)" : "rgba(30, 33, 37, 0.65)",
+                                color: w.type === "condition" ? "rgba(94, 136, 176, 0.85)" : w.type === "observation" ? "rgba(107, 123, 147, 0.85)" : w.type === "timestamp" ? "rgba(184, 156, 106, 0.85)" : "rgba(30, 33, 37, 0.65)",
                                 cursor: "pointer",
                                 display: "inline-flex",
                                 alignItems: "center",
@@ -1624,16 +1618,16 @@ function Ge({
                                 transition: "all 0.15s ease",
                                 fontWeight: 550
                               },
-                              onMouseEnter: (z) => {
-                                z.currentTarget.style.background = "rgba(255, 255, 255, 0.95)", z.currentTarget.style.borderColor = "rgba(52, 58, 64, 0.24)";
+                              onMouseEnter: (T) => {
+                                T.currentTarget.style.background = "rgba(255, 255, 255, 0.95)", T.currentTarget.style.borderColor = "rgba(52, 58, 64, 0.24)";
                               },
-                              onMouseLeave: (z) => {
-                                z.currentTarget.style.background = "rgba(255, 255, 255, 0.7)", z.currentTarget.style.borderColor = "rgba(52, 58, 64, 0.16)";
+                              onMouseLeave: (T) => {
+                                T.currentTarget.style.background = "rgba(255, 255, 255, 0.7)", T.currentTarget.style.borderColor = "rgba(52, 58, 64, 0.16)";
                               },
                               children: [
-                                k.type === "timestamp" && /* @__PURE__ */ e(ge, { size: 12 }),
-                                (k.type === "condition" || k.type === "observation") && /* @__PURE__ */ e(he, { size: 12 }),
-                                k.label
+                                w.type === "timestamp" && /* @__PURE__ */ e(ge, { size: 12 }),
+                                (w.type === "condition" || w.type === "observation") && /* @__PURE__ */ e(he, { size: 12 }),
+                                w.label
                               ]
                             },
                             D
@@ -1643,9 +1637,9 @@ function Ge({
                     ] })
                   ]
                 },
-                i.id
+                a.id
               )),
-              /* @__PURE__ */ e("div", { ref: u })
+              /* @__PURE__ */ e("div", { ref: g })
             ]
           }
         ),
@@ -1700,11 +1694,11 @@ function Ge({
                           /* @__PURE__ */ e(
                             "textarea",
                             {
-                              value: a,
-                              onChange: (i) => v(i.target.value),
-                              onKeyDown: T,
-                              onFocus: () => w(!0),
-                              onBlur: () => w(!1),
+                              value: i,
+                              onChange: (a) => v(a.target.value),
+                              onKeyDown: z,
+                              onFocus: () => k(!0),
+                              onBlur: () => k(!1),
                               placeholder: "Add a comment...",
                               style: {
                                 width: "100%",
@@ -1749,14 +1743,14 @@ function Ge({
                                         alignItems: "center",
                                         transition: "all 0.15s ease"
                                       },
-                                      onMouseEnter: (i) => {
-                                        i.currentTarget.style.background = "rgba(30, 33, 37, 0.06)", i.currentTarget.style.color = "rgba(30, 33, 37, 0.75)";
+                                      onMouseEnter: (a) => {
+                                        a.currentTarget.style.background = "rgba(30, 33, 37, 0.06)", a.currentTarget.style.color = "rgba(30, 33, 37, 0.75)";
                                       },
-                                      onMouseLeave: (i) => {
-                                        i.currentTarget.style.background = "transparent", i.currentTarget.style.color = "rgba(30, 33, 37, 0.52)";
+                                      onMouseLeave: (a) => {
+                                        a.currentTarget.style.background = "transparent", a.currentTarget.style.color = "rgba(30, 33, 37, 0.52)";
                                       },
                                       title: "Mention user",
-                                      children: /* @__PURE__ */ e(Re, { size: 16 })
+                                      children: /* @__PURE__ */ e(Be, { size: 16 })
                                     }
                                   ),
                                   /* @__PURE__ */ e(
@@ -1774,11 +1768,11 @@ function Ge({
                                         alignItems: "center",
                                         transition: "all 0.15s ease"
                                       },
-                                      onMouseEnter: (i) => {
-                                        i.currentTarget.style.background = "rgba(30, 33, 37, 0.06)", i.currentTarget.style.color = "rgba(30, 33, 37, 0.75)";
+                                      onMouseEnter: (a) => {
+                                        a.currentTarget.style.background = "rgba(30, 33, 37, 0.06)", a.currentTarget.style.color = "rgba(30, 33, 37, 0.75)";
                                       },
-                                      onMouseLeave: (i) => {
-                                        i.currentTarget.style.background = "transparent", i.currentTarget.style.color = "rgba(30, 33, 37, 0.52)";
+                                      onMouseLeave: (a) => {
+                                        a.currentTarget.style.background = "transparent", a.currentTarget.style.color = "rgba(30, 33, 37, 0.52)";
                                       },
                                       title: "Reference condition",
                                       children: /* @__PURE__ */ e(he, { size: 16 })
@@ -1799,14 +1793,14 @@ function Ge({
                                         alignItems: "center",
                                         transition: "all 0.15s ease"
                                       },
-                                      onMouseEnter: (i) => {
-                                        i.currentTarget.style.background = "rgba(30, 33, 37, 0.06)", i.currentTarget.style.color = "rgba(30, 33, 37, 0.75)";
+                                      onMouseEnter: (a) => {
+                                        a.currentTarget.style.background = "rgba(30, 33, 37, 0.06)", a.currentTarget.style.color = "rgba(30, 33, 37, 0.75)";
                                       },
-                                      onMouseLeave: (i) => {
-                                        i.currentTarget.style.background = "transparent", i.currentTarget.style.color = "rgba(30, 33, 37, 0.52)";
+                                      onMouseLeave: (a) => {
+                                        a.currentTarget.style.background = "transparent", a.currentTarget.style.color = "rgba(30, 33, 37, 0.52)";
                                       },
                                       title: "Attach file",
-                                      children: /* @__PURE__ */ e(Ae, { size: 16 })
+                                      children: /* @__PURE__ */ e(Re, { size: 16 })
                                     }
                                   )
                                 ] }),
@@ -1815,26 +1809,26 @@ function Ge({
                                   {
                                     type: "button",
                                     onClick: C,
-                                    disabled: !a.trim() || t,
+                                    disabled: !i.trim() || t,
                                     style: {
                                       padding: "6px 12px",
-                                      background: a.trim() && !t ? "rgba(94, 136, 176, 0.85)" : "var(--border-subtle, rgba(52,58,64,0.08))",
+                                      background: i.trim() && !t ? "rgba(94, 136, 176, 0.85)" : "var(--border-subtle, rgba(52,58,64,0.08))",
                                       border: "none",
                                       borderRadius: "6px",
-                                      color: a.trim() && !t ? "white" : "var(--text-faint, rgba(30,33,37,0.36))",
+                                      color: i.trim() && !t ? "white" : "var(--text-faint, rgba(30,33,37,0.36))",
                                       fontSize: "var(--text-sm, 11px)",
                                       fontWeight: 600,
-                                      cursor: a.trim() && !t ? "pointer" : "not-allowed",
+                                      cursor: i.trim() && !t ? "pointer" : "not-allowed",
                                       display: "flex",
                                       alignItems: "center",
                                       gap: "6px",
                                       transition: "all 0.15s ease"
                                     },
-                                    onMouseEnter: (i) => {
-                                      a.trim() && !t && (i.currentTarget.style.background = "rgba(94, 136, 176, 1)");
+                                    onMouseEnter: (a) => {
+                                      i.trim() && !t && (a.currentTarget.style.background = "rgba(94, 136, 176, 1)");
                                     },
-                                    onMouseLeave: (i) => {
-                                      a.trim() && !t && (i.currentTarget.style.background = "rgba(94, 136, 176, 0.85)");
+                                    onMouseLeave: (a) => {
+                                      i.trim() && !t && (a.currentTarget.style.background = "rgba(94, 136, 176, 0.85)");
                                     },
                                     children: t ? /* @__PURE__ */ s(J, { children: [
                                       /* @__PURE__ */ e("style", { children: `
@@ -1926,7 +1920,7 @@ function Ge({
     }
   );
 }
-const B = [
+const A = [
   "#5E88B0",
   // rail-discovery / rail-blue
   "#9B7AA8",
@@ -1960,34 +1954,34 @@ const B = [
   if (!h)
     return !1;
   const m = h.toLowerCase();
-  return b.filter((a) => String(a).toLowerCase().includes(m)).length < b.length * 0.5;
+  return b.filter((i) => String(i).toLowerCase().includes(m)).length < b.length * 0.5;
 }, Ue = async (h, b) => {
   const m = h.querySelector("svg");
   if (!m)
     return;
-  const y = m.cloneNode(!0), a = m.clientWidth || 600, v = m.clientHeight || 300;
-  y.setAttribute("width", a), y.setAttribute("height", v), y.setAttribute("xmlns", "http://www.w3.org/2000/svg");
+  const y = m.cloneNode(!0), i = m.clientWidth || 600, v = m.clientHeight || 300;
+  y.setAttribute("width", i), y.setAttribute("height", v), y.setAttribute("xmlns", "http://www.w3.org/2000/svg");
   const L = document.createElement("style");
   L.textContent = 'text { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; }', y.insertBefore(L, y.firstChild);
-  const w = new XMLSerializer().serializeToString(y), f = new Blob([w], { type: "image/svg+xml;charset=utf-8" }), l = URL.createObjectURL(f), o = new Image();
+  const k = new XMLSerializer().serializeToString(y), f = new Blob([k], { type: "image/svg+xml;charset=utf-8" }), d = URL.createObjectURL(f), o = new Image();
   o.onload = () => {
     const n = document.createElement("canvas"), t = 2;
-    n.width = a * t, n.height = v * t;
+    n.width = i * t, n.height = v * t;
     const r = n.getContext("2d");
-    r.fillStyle = "#ffffff", r.fillRect(0, 0, n.width, n.height), r.scale(t, t), r.drawImage(o, 0, 0, a, v), URL.revokeObjectURL(l);
+    r.fillStyle = "#ffffff", r.fillRect(0, 0, n.width, n.height), r.scale(t, t), r.drawImage(o, 0, 0, i, v), URL.revokeObjectURL(d);
     const c = document.createElement("a");
     c.download = `${(b || "chart").replace(/[^a-z0-9]+/gi, "_")}.png`, c.href = n.toDataURL("image/png"), c.click();
-  }, o.src = l;
+  }, o.src = d;
 }, He = (h, b) => {
   const m = ["", ...h.map((v) => v.name)].join(","), y = b.map((v) => {
-    const L = h.map((w) => {
-      const f = w.data.find((l) => l.x === v);
+    const L = h.map((k) => {
+      const f = k.data.find((d) => d.x === v);
       return f ? f.y : "";
     });
     return [v, ...L].join(",");
-  }), a = [m, ...y].join(`
+  }), i = [m, ...y].join(`
 `);
-  navigator.clipboard.writeText(a);
+  navigator.clipboard.writeText(i);
 }, Oe = ({ onDownload: h, onCopy: b, copied: m }) => /* @__PURE__ */ s("div", { style: {
   display: "flex",
   gap: 6,
@@ -2020,17 +2014,17 @@ const B = [
     alignItems: "center",
     gap: 4
   }, children: "📥 PNG" })
-] }), Je = ({ chartType: h, title: b, xLabel: m, yLabel: y, series: a }) => {
-  const v = Y(null), [L, w] = de.useState(!1);
-  if (!a || a.length === 0)
+] }), Je = ({ chartType: h, title: b, xLabel: m, yLabel: y, series: i }) => {
+  const v = Y(null), [L, k] = de.useState(!1);
+  if (!i || i.length === 0)
     return null;
-  const f = [...new Set(a.flatMap((d) => d.data.map((x) => x.x)))], l = f.map((d) => {
-    const x = { x: d };
-    return a.forEach((I) => {
-      const S = I.data.find((E) => E.x === d);
+  const f = [...new Set(i.flatMap((l) => l.data.map((x) => x.x)))], d = f.map((l) => {
+    const x = { x: l };
+    return i.forEach((I) => {
+      const S = I.data.find((E) => E.x === l);
       x[I.name] = S ? S.y : null;
     }), x;
-  }), o = a.map((d) => d.name), n = o.length === 1, t = Pe(m, f), r = t ? 20 : 5, u = Math.max(...f.map((d) => String(d).length)) > 12 || f.length > 8, p = {
+  }), o = i.map((l) => l.name), n = o.length === 1, t = Pe(m, f), r = t ? 20 : 5, g = Math.max(...f.map((l) => String(l).length)) > 12 || f.length > 8, p = {
     background: "var(--paper-elevated, #fff)",
     border: "1px solid var(--border, #e0e0e0)",
     borderRadius: "var(--radius-md, 8px)",
@@ -2041,34 +2035,34 @@ const B = [
     fontSize: "14px",
     fontWeight: "600",
     marginBottom: "12px"
-  }, T = {
+  }, z = {
     dataKey: "x",
-    tick: u ? { fill: "var(--text-muted, #666)", fontSize: 11, angle: -35, textAnchor: "end" } : pe,
+    tick: g ? { fill: "var(--text-muted, #666)", fontSize: 11, angle: -35, textAnchor: "end" } : pe,
     axisLine: O,
     tickLine: O,
     ...t ? {
       label: { value: m, position: "insideBottom", offset: -10, style: { textAnchor: "middle", fill: "var(--text-muted, #666)" } }
     } : {}
-  }, R = {
+  }, B = {
     tick: pe,
     axisLine: O,
     tickLine: O,
     ...y ? {
       label: { value: y, angle: -90, position: "insideLeft", style: { textAnchor: "middle", fill: "var(--text-muted, #666)" } }
     } : {}
-  }, i = () => {
+  }, a = () => {
     switch (h) {
       case "bar":
-        return /* @__PURE__ */ e(Z, { width: "100%", height: 300, children: /* @__PURE__ */ s(fe, { data: l, margin: { top: 5, right: 30, left: 20, bottom: u ? 40 : r }, children: [
+        return /* @__PURE__ */ e(Z, { width: "100%", height: 300, children: /* @__PURE__ */ s(fe, { data: d, margin: { top: 5, right: 30, left: 20, bottom: g ? 40 : r }, children: [
           /* @__PURE__ */ e(ne, { strokeDasharray: "3 3", stroke: se }),
-          /* @__PURE__ */ e(oe, { ...T }),
-          /* @__PURE__ */ e(ae, { ...R }),
+          /* @__PURE__ */ e(oe, { ...z }),
+          /* @__PURE__ */ e(ie, { ...B }),
           /* @__PURE__ */ e(ee, { ...te }),
-          !n && /* @__PURE__ */ e(ie, { wrapperStyle: le }),
-          o.map((d, x) => /* @__PURE__ */ e(me, { dataKey: d, fill: B[x % B.length], radius: [2, 2, 0, 0], children: n && l.map((I, S) => /* @__PURE__ */ e(ce, { fill: B[S % B.length] }, S)) }, d))
+          !n && /* @__PURE__ */ e(ae, { wrapperStyle: le }),
+          o.map((l, x) => /* @__PURE__ */ e(me, { dataKey: l, fill: A[x % A.length], radius: [2, 2, 0, 0], children: n && d.map((I, S) => /* @__PURE__ */ e(ce, { fill: A[S % A.length] }, S)) }, l))
         ] }) });
       case "horizontal_bar":
-        return /* @__PURE__ */ e(Z, { width: "100%", height: Math.max(300, l.length * 40), children: /* @__PURE__ */ s(fe, { data: l, layout: "vertical", margin: { top: 5, right: 30, left: 100, bottom: 5 }, children: [
+        return /* @__PURE__ */ e(Z, { width: "100%", height: Math.max(300, d.length * 40), children: /* @__PURE__ */ s(fe, { data: d, layout: "vertical", margin: { top: 5, right: 30, left: 100, bottom: 5 }, children: [
           /* @__PURE__ */ e(ne, { strokeDasharray: "3 3", stroke: se }),
           /* @__PURE__ */ e(
             oe,
@@ -2080,68 +2074,68 @@ const B = [
               ...y ? { label: { value: y, position: "insideBottom", offset: -5, style: { textAnchor: "middle", fill: "var(--text-muted, #666)" } } } : {}
             }
           ),
-          /* @__PURE__ */ e(ae, { type: "category", dataKey: "x", tick: { fill: "var(--text-muted, #666)", fontSize: 11 }, width: 90, axisLine: O, tickLine: O }),
+          /* @__PURE__ */ e(ie, { type: "category", dataKey: "x", tick: { fill: "var(--text-muted, #666)", fontSize: 11 }, width: 90, axisLine: O, tickLine: O }),
           /* @__PURE__ */ e(ee, { ...te }),
-          !n && /* @__PURE__ */ e(ie, { wrapperStyle: le }),
-          o.map((d, x) => /* @__PURE__ */ e(me, { dataKey: d, fill: B[x % B.length], radius: [0, 2, 2, 0], children: n && l.map((I, S) => /* @__PURE__ */ e(ce, { fill: B[S % B.length] }, S)) }, d))
+          !n && /* @__PURE__ */ e(ae, { wrapperStyle: le }),
+          o.map((l, x) => /* @__PURE__ */ e(me, { dataKey: l, fill: A[x % A.length], radius: [0, 2, 2, 0], children: n && d.map((I, S) => /* @__PURE__ */ e(ce, { fill: A[S % A.length] }, S)) }, l))
         ] }) });
       case "line":
-        return /* @__PURE__ */ e(Z, { width: "100%", height: 300, children: /* @__PURE__ */ s(De, { data: l, margin: { top: 5, right: 30, left: 20, bottom: u ? 40 : r }, children: [
+        return /* @__PURE__ */ e(Z, { width: "100%", height: 300, children: /* @__PURE__ */ s(De, { data: d, margin: { top: 5, right: 30, left: 20, bottom: g ? 40 : r }, children: [
           /* @__PURE__ */ e(ne, { strokeDasharray: "3 3", stroke: se }),
-          /* @__PURE__ */ e(oe, { ...T }),
-          /* @__PURE__ */ e(ae, { ...R }),
+          /* @__PURE__ */ e(oe, { ...z }),
+          /* @__PURE__ */ e(ie, { ...B }),
           /* @__PURE__ */ e(ee, { ...te }),
-          /* @__PURE__ */ e(ie, { wrapperStyle: le }),
-          o.map((d, x) => /* @__PURE__ */ e(
+          /* @__PURE__ */ e(ae, { wrapperStyle: le }),
+          o.map((l, x) => /* @__PURE__ */ e(
             Ee,
             {
               type: "monotone",
-              dataKey: d,
-              stroke: B[x % B.length],
+              dataKey: l,
+              stroke: A[x % A.length],
               strokeWidth: 2,
-              dot: { r: 4, fill: B[x % B.length] },
-              activeDot: { r: 6, fill: B[x % B.length] }
+              dot: { r: 4, fill: A[x % A.length] },
+              activeDot: { r: 6, fill: A[x % A.length] }
             },
-            d
+            l
           ))
         ] }) });
       case "area":
-        return /* @__PURE__ */ e(Z, { width: "100%", height: 300, children: /* @__PURE__ */ s(Ie, { data: l, margin: { top: 5, right: 30, left: 20, bottom: u ? 40 : r }, children: [
+        return /* @__PURE__ */ e(Z, { width: "100%", height: 300, children: /* @__PURE__ */ s(Ie, { data: d, margin: { top: 5, right: 30, left: 20, bottom: g ? 40 : r }, children: [
           /* @__PURE__ */ e(ne, { strokeDasharray: "3 3", stroke: se }),
-          /* @__PURE__ */ e(oe, { ...T }),
-          /* @__PURE__ */ e(ae, { ...R }),
+          /* @__PURE__ */ e(oe, { ...z }),
+          /* @__PURE__ */ e(ie, { ...B }),
           /* @__PURE__ */ e(ee, { ...te }),
-          /* @__PURE__ */ e(ie, { wrapperStyle: le }),
-          o.map((d, x) => /* @__PURE__ */ e(
+          /* @__PURE__ */ e(ae, { wrapperStyle: le }),
+          o.map((l, x) => /* @__PURE__ */ e(
             Me,
             {
               type: "monotone",
-              dataKey: d,
-              stroke: B[x % B.length],
+              dataKey: l,
+              stroke: A[x % A.length],
               strokeWidth: 2,
-              fill: B[x % B.length],
+              fill: A[x % A.length],
               fillOpacity: 0.15
             },
-            d
+            l
           ))
         ] }) });
       case "pie": {
-        const d = a[0].data.map((S, E) => ({
+        const l = i[0].data.map((S, E) => ({
           name: S.x,
           value: S.y,
-          fill: B[E % B.length]
+          fill: A[E % A.length]
         })), x = Math.PI / 180;
-        return /* @__PURE__ */ e(Z, { width: "100%", height: 320, children: /* @__PURE__ */ s(Be, { children: [
+        return /* @__PURE__ */ e(Z, { width: "100%", height: 320, children: /* @__PURE__ */ s(Ae, { children: [
           /* @__PURE__ */ e(
             Le,
             {
-              data: d,
+              data: l,
               cx: "50%",
               cy: "50%",
               outerRadius: 100,
               dataKey: "value",
-              label: ({ cx: S, cy: E, midAngle: F, innerRadius: H, outerRadius: X, percent: P, name: N }) => {
-                const q = X + 20, U = S + q * Math.cos(-F * x), K = E + q * Math.sin(-F * x);
+              label: ({ cx: S, cy: E, midAngle: _, innerRadius: H, outerRadius: X, percent: P, name: N }) => {
+                const q = X + 20, U = S + q * Math.cos(-_ * x), K = E + q * Math.sin(-_ * x);
                 return P < 0.04 ? null : /* @__PURE__ */ s(
                   "text",
                   {
@@ -2161,14 +2155,14 @@ const B = [
                 );
               },
               labelLine: { stroke: "var(--text-muted, #666)" },
-              children: d.map((S, E) => /* @__PURE__ */ e(ce, { fill: S.fill }, E))
+              children: l.map((S, E) => /* @__PURE__ */ e(ce, { fill: S.fill }, E))
             }
           ),
           /* @__PURE__ */ e(ee, { ...te })
         ] }) });
       }
       case "metric": {
-        const d = a[0], x = d.data[0], I = d.data.length > 1 ? d.data[1] : null, S = x.y, E = x.x || "", F = I !== null, H = F ? S - I.y : 0, X = F && I.y !== 0 ? H / Math.abs(I.y) * 100 : 0, P = H > 0, N = H < 0, q = P ? "#7BA89D" : N ? "#D17B6B" : "var(--text-muted, #666)", U = P ? "↑" : N ? "↓" : "→", K = ($) => Number.isInteger($) && Math.abs($) >= 1e3 ? $.toLocaleString() : typeof $ == "number" ? $ % 1 === 0 ? $.toString() : $.toFixed($ < 10 ? 2 : 1) : String($);
+        const l = i[0], x = l.data[0], I = l.data.length > 1 ? l.data[1] : null, S = x.y, E = x.x || "", _ = I !== null, H = _ ? S - I.y : 0, X = _ && I.y !== 0 ? H / Math.abs(I.y) * 100 : 0, P = H > 0, N = H < 0, q = P ? "#7BA89D" : N ? "#D17B6B" : "var(--text-muted, #666)", U = P ? "↑" : N ? "↓" : "→", K = ($) => Number.isInteger($) && Math.abs($) >= 1e3 ? $.toLocaleString() : typeof $ == "number" ? $ % 1 === 0 ? $.toString() : $.toFixed($ < 10 ? 2 : 1) : String($);
         return /* @__PURE__ */ s("div", { style: { display: "flex", alignItems: "baseline", gap: 12, padding: "8px 0" }, children: [
           /* @__PURE__ */ e("div", { style: {
             fontSize: "36px",
@@ -2178,7 +2172,7 @@ const B = [
             fontVariantNumeric: "tabular-nums"
           }, children: K(S) }),
           E && /* @__PURE__ */ e("div", { style: { fontSize: "14px", color: "var(--text-muted, #666)", fontWeight: 500 }, children: E }),
-          F && /* @__PURE__ */ s("div", { style: {
+          _ && /* @__PURE__ */ s("div", { style: {
             display: "flex",
             alignItems: "center",
             gap: 4,
@@ -2197,7 +2191,7 @@ const B = [
               "%)"
             ] })
           ] }),
-          F && /* @__PURE__ */ s("div", { style: { fontSize: "11px", color: "var(--text-faint, #999)" }, children: [
+          _ && /* @__PURE__ */ s("div", { style: { fontSize: "11px", color: "var(--text-faint, #999)" }, children: [
             "vs ",
             I.x || "previous"
           ] })
@@ -2209,15 +2203,15 @@ const B = [
           h
         ] });
     }
-  }, k = xe(() => {
+  }, w = xe(() => {
     v.current && Ue(v.current, b);
   }, [b]), D = xe(() => {
-    He(a, f), w(!0), setTimeout(() => w(!1), 2e3);
-  }, [a, f]);
+    He(i, f), k(!0), setTimeout(() => k(!1), 2e3);
+  }, [i, f]);
   return /* @__PURE__ */ s("div", { style: p, children: [
     b && /* @__PURE__ */ e("div", { style: C, children: b }),
-    h !== "metric" && /* @__PURE__ */ e(Oe, { onDownload: k, onCopy: D, copied: L }),
-    /* @__PURE__ */ e("div", { ref: v, children: i() })
+    h !== "metric" && /* @__PURE__ */ e(Oe, { onDownload: w, onCopy: D, copied: L }),
+    /* @__PURE__ */ e("div", { ref: v, children: a() })
   ] });
 };
 export {
@@ -2226,6 +2220,6 @@ export {
   qe as ChatInterface,
   be as ChatMessage,
   Ge as MessageThread,
-  _e as ThinkingIndicator
+  Fe as ThinkingIndicator
 };
 //# sourceMappingURL=chat.es.js.map