chordia-ui 3.3.8 → 3.3.9

package/dist/components/chat.es.js

@@ -1,10 +1,2225 @@
-import { C as s, a as r, b as t, c as h, M as n, T as C } from "../ChartRenderer.es.js";
+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 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, i] = M(/* @__PURE__ */ new Set()), v = async (o, n) => {
+    try {
+      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;
+        });
+      }, 2e3);
+    } catch (t) {
+      console.error("Failed to copy text:", t);
+    }
+  }, L = (o, n, t) => {
+    const r = y.has(t);
+    return /* @__PURE__ */ s(
+      "div",
+      {
+        style: {
+          position: "relative",
+          marginBottom: "16px",
+          borderRadius: "8px",
+          background: "var(--ink, #1E2125)",
+          border: "1px solid var(--border-subtle, rgba(52,58,64,0.08))",
+          overflow: "hidden"
+        },
+        children: [
+          /* @__PURE__ */ s("div", { style: {
+            display: "flex",
+            justifyContent: "space-between",
+            alignItems: "center",
+            padding: "8px 12px",
+            background: "rgba(255,255,255,0.05)",
+            borderBottom: "1px solid rgba(255,255,255,0.1)"
+          }, children: [
+            /* @__PURE__ */ e("span", { style: {
+              fontSize: "11px",
+              color: "rgba(255,255,255,0.7)",
+              fontFamily: "var(--font-mono, monospace)",
+              textTransform: "uppercase",
+              letterSpacing: "0.05em"
+            }, children: n || "code" }),
+            /* @__PURE__ */ s(
+              "button",
+              {
+                onClick: () => v(o, t),
+                style: {
+                  background: "none",
+                  border: "none",
+                  color: "rgba(255,255,255,0.7)",
+                  cursor: "pointer",
+                  padding: "4px",
+                  borderRadius: "4px",
+                  display: "flex",
+                  alignItems: "center",
+                  gap: "4px",
+                  fontSize: "11px",
+                  transition: "all 0.15s ease"
+                },
+                onMouseEnter: (c) => {
+                  c.target.style.background = "rgba(255,255,255,0.1)", c.target.style.color = "rgba(255,255,255,0.9)";
+                },
+                onMouseLeave: (c) => {
+                  c.target.style.background = "none", c.target.style.color = "rgba(255,255,255,0.7)";
+                },
+                children: [
+                  r ? /* @__PURE__ */ e(Se, { size: 12 }) : /* @__PURE__ */ e(we, { size: 12 }),
+                  r ? "Copied!" : "Copy"
+                ]
+              }
+            ),
+            b && /* @__PURE__ */ s(
+              "button",
+              {
+                onClick: () => b({ code: o, language: n }),
+                style: {
+                  background: "none",
+                  border: "none",
+                  color: "rgba(255,255,255,0.7)",
+                  cursor: "pointer",
+                  padding: "4px",
+                  borderRadius: "4px",
+                  display: "flex",
+                  alignItems: "center",
+                  gap: "4px",
+                  fontSize: "11px",
+                  transition: "all 0.15s ease"
+                },
+                onMouseEnter: (c) => {
+                  c.currentTarget.style.background = "rgba(255,255,255,0.1)", c.currentTarget.style.color = "rgba(255,255,255,0.9)";
+                },
+                onMouseLeave: (c) => {
+                  c.currentTarget.style.background = "none", c.currentTarget.style.color = "rgba(255,255,255,0.7)";
+                },
+                children: [
+                  /* @__PURE__ */ e(ke, { size: 12 }),
+                  "Canvas"
+                ]
+              }
+            )
+          ] }),
+          /* @__PURE__ */ e("pre", { style: {
+            margin: 0,
+            padding: "12px",
+            fontFamily: "var(--font-mono, monospace)",
+            fontSize: "13px",
+            lineHeight: 1.4,
+            color: "rgba(255,255,255,0.95)",
+            overflow: "auto",
+            whiteSpace: "pre-wrap",
+            wordBreak: "break-word"
+          }, children: o })
+        ]
+      },
+      t
+    );
+  }, k = (o) => {
+    const n = [], t = o.split(`
+`);
+    let r = 0, c = 0;
+    for (; r < t.length; ) {
+      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++;
+        r < t.length && r++, n.push(L(C.join(`
+`), p, `code-${c++}`));
+        continue;
+      }
+      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(z, {
+            key: `header-${r}`,
+            style: {
+              fontSize: p === 1 ? "18px" : p === 2 ? "16px" : "14px",
+              fontWeight: 720,
+              color: "var(--text-strong, rgba(30,33,37,0.92))",
+              marginTop: n.length > 0 ? "20px" : "0",
+              marginBottom: "8px",
+              lineHeight: 1.3
+            }
+          }, C)
+        ), r++;
+        continue;
+      }
+      if (g.trim() === "---" || g.trim() === "***") {
+        n.push(
+          /* @__PURE__ */ e("hr", { style: {
+            border: "none",
+            borderTop: "1px solid var(--border-subtle, rgba(52,58,64,0.08))",
+            margin: "16px 0"
+          } }, `hr-${r}`)
+        ), r++;
+        continue;
+      }
+      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 B = t[r].match(/^(\s*)([-*+]|\d+\.)\s(.*)$/);
+            B && p.push(B[3]);
+          }
+          r++;
+        }
+        const z = C ? "ol" : "ul";
+        n.push(
+          de.createElement(z, {
+            key: `list-${r}`,
+            style: {
+              margin: "8px 0",
+              paddingLeft: "20px",
+              color: "var(--text-strong, rgba(30,33,37,0.92))"
+            }
+          }, p.map(
+            (B, a) => de.createElement("li", {
+              key: `item-${a}`,
+              style: { marginBottom: "4px" }
+            }, d(B))
+          ))
+        );
+        continue;
+      }
+      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 = (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",
+            lineHeight: 1.5,
+            color: "var(--text-strong, rgba(30,33,37,0.92))"
+          };
+          n.push(
+            /* @__PURE__ */ e("div", { style: { overflowX: "auto", margin: "8px 0" }, children: /* @__PURE__ */ s("table", { style: {
+              borderCollapse: "collapse",
+              width: "100%",
+              border: "1px solid var(--border-subtle, rgba(52,58,64,0.08))",
+              borderRadius: "6px",
+              overflow: "hidden"
+            }, children: [
+              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 (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++;
+        p.length > 0 && n.push(
+          /* @__PURE__ */ e("p", { style: {
+            margin: "8px 0",
+            lineHeight: 1.6,
+            color: "var(--text-strong, rgba(30,33,37,0.92))"
+          }, children: d(p.join(" ")) }, `p-${r}`)
+        );
+      } else
+        r++;
+    }
+    return n;
+  }, f = (o) => {
+    const n = [];
+    let t = o, r = 0;
+    for (; t.length > 0; ) {
+      if (m) {
+        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(a),
+                style: {
+                  color: "var(--rail-discovery, #5E88B0)",
+                  textDecoration: "underline",
+                  textDecorationStyle: "dotted",
+                  textUnderlineOffset: "2px",
+                  cursor: "pointer",
+                  fontFamily: "var(--font-mono, monospace)",
+                  fontSize: "13px",
+                  transition: "all 0.15s ease",
+                  ":hover": {
+                    background: "var(--hover-warm-subtle, rgba(231,212,162,0.08))",
+                    textDecoration: "underline",
+                    textDecorationStyle: "solid"
+                  }
+                },
+                onMouseEnter: (w) => {
+                  w.target.style.background = "var(--hover-warm-subtle, rgba(231,212,162,0.08))", w.target.style.textDecorationStyle = "solid";
+                },
+                onMouseLeave: (w) => {
+                  w.target.style.background = "none", w.target.style.textDecorationStyle = "dotted";
+                },
+                children: a
+              },
+              `file-path-${r++}`
+            )
+          ), t = t.slice(B[0].length);
+          continue;
+        }
+      }
+      const c = t.match(/^`([^`]+)`/);
+      if (c) {
+        n.push(
+          /* @__PURE__ */ e("code", { style: {
+            background: "var(--hover-warm-subtle, rgba(231,212,162,0.08))",
+            border: "1px solid var(--border-subtle, rgba(52,58,64,0.08))",
+            borderRadius: "3px",
+            padding: "2px 4px",
+            fontFamily: "var(--font-mono, monospace)",
+            fontSize: "12px",
+            color: "var(--text-strong, rgba(30,33,37,0.92))"
+          }, children: c[1] }, `inline-code-${r++}`)
+        ), t = t.slice(c[0].length);
+        continue;
+      }
+      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: g[1] }, `bold-${r++}`)
+        ), t = t.slice(g[0].length);
+        continue;
+      }
+      const p = t.match(/^\*([^*]+)\*/);
+      if (p) {
+        n.push(
+          /* @__PURE__ */ e("em", { style: {
+            fontStyle: "italic",
+            color: "var(--text-strong, rgba(30,33,37,0.92))"
+          }, children: p[1] }, `italic-${r++}`)
+        ), t = t.slice(p[0].length);
+        continue;
+      }
+      const C = t.match(/^\[([^\]]+)\]\(([^)]+)\)/);
+      if (C) {
+        n.push(
+          /* @__PURE__ */ e(
+            "a",
+            {
+              href: C[2],
+              target: "_blank",
+              rel: "noopener noreferrer",
+              style: {
+                color: "var(--rail-discovery, #5E88B0)",
+                textDecoration: "underline",
+                textUnderlineOffset: "2px"
+              },
+              children: C[1]
+            },
+            `link-${r++}`
+          )
+        ), t = t.slice(C[0].length);
+        continue;
+      }
+      const z = t.search(/[`*\[]/);
+      if (z === -1) {
+        n.push(t);
+        break;
+      } else
+        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;
+  }, d = (o) => f(o);
+  return /* @__PURE__ */ e("div", { children: k(h) });
+};
+function be({
+  role: h,
+  content: b,
+  html: m,
+  timestamp: y,
+  toolBadges: i,
+  isStreaming: v,
+  onCodeBlockClick: L,
+  onFilePathClick: k
+}) {
+  const f = h === "user";
+  return /* @__PURE__ */ s(
+    "div",
+    {
+      style: {
+        display: "flex",
+        flexDirection: "column",
+        alignItems: f ? "flex-end" : "flex-start",
+        marginBottom: "16px",
+        maxWidth: "100%"
+      },
+      children: [
+        /* @__PURE__ */ s(
+          "div",
+          {
+            style: {
+              fontSize: "var(--text-sm, 11px)",
+              color: "var(--text-faint, rgba(30,33,37,0.36))",
+              marginBottom: "6px",
+              fontWeight: 650,
+              letterSpacing: "0.02em"
+            },
+            children: [
+              f ? "You" : "Chordia",
+              v && !f && /* @__PURE__ */ e("span", { style: { marginLeft: "6px", color: "var(--rail-purple, #9B7AA8)" }, children: "●" })
+            ]
+          }
+        ),
+        i && i.length > 0 && /* @__PURE__ */ e("div", { style: {
+          marginBottom: "8px",
+          display: "flex",
+          flexWrap: "wrap",
+          gap: "4px",
+          maxWidth: "75%"
+        }, children: i.map((d, o) => /* @__PURE__ */ s(
+          "span",
+          {
+            style: {
+              display: "inline-block",
+              fontSize: "11px",
+              padding: "2px 8px",
+              borderRadius: "6px",
+              background: "var(--paper-elevated, rgba(255,255,255,0.82))",
+              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" } }),
+              d.name,
+              d.pending ? "..." : d.success !== !1 ? " ✓" : " ✗"
+            ]
+          },
+          d.id || o
+        )) }),
+        /* @__PURE__ */ e(
+          "div",
+          {
+            style: {
+              maxWidth: "75%",
+              padding: "12px 16px",
+              borderRadius: "var(--radius-lg, 12px)",
+              background: f ? "var(--card-customer, rgba(94,136,176,0.08))" : "var(--paper-elevated, rgba(255,255,255,0.82))",
+              border: f ? "1px solid var(--border-subtle, rgba(52,58,64,0.08))" : "1px solid var(--border, rgba(52,58,64,0.12))",
+              fontSize: "var(--text-base, 14px)",
+              lineHeight: 1.6,
+              color: "var(--text-strong, rgba(30,33,37,0.92))",
+              wordBreak: "break-word"
+            },
+            children: m ? /* @__PURE__ */ e("div", { dangerouslySetInnerHTML: { __html: m } }) : f ? (
+              // User messages stay plain text
+              /* @__PURE__ */ e("div", { style: { whiteSpace: "pre-wrap" }, children: b })
+            ) : (
+              // Assistant messages get markdown rendering
+              /* @__PURE__ */ e(We, { content: b || "", onCodeBlockClick: L, onFilePathClick: k })
+            )
+          }
+        ),
+        y && /* @__PURE__ */ e(
+          "div",
+          {
+            style: {
+              fontSize: "var(--text-xs-plus, 10.5px)",
+              color: "var(--text-faint, rgba(30,33,37,0.36))",
+              marginTop: "4px",
+              fontFamily: "var(--font-mono, monospace)"
+            },
+            children: y
+          }
+        )
+      ]
+    }
+  );
+}
+function Fe({
+  phase: h = "thinking",
+  toolSteps: b = [],
+  label: m,
+  elapsedMs: y,
+  compact: i = !1
+}) {
+  const v = (t) => {
+    if (!t || t < 1e3)
+      return null;
+    const r = Math.floor(t / 1e3);
+    if (r < 60)
+      return `${r}s`;
+    const c = Math.floor(r / 60), g = r % 60;
+    return g > 0 ? `${c}m ${g}s` : `${c}m`;
+  }, L = () => {
+    if (m)
+      return m;
+    switch (h) {
+      case "thinking":
+        return "Thinking...";
+      case "tool":
+        return null;
+      case "responding":
+        return "Responding...";
+      default:
+        return "Thinking...";
+    }
+  }, k = (t, r) => {
+    const c = () => {
+      const p = {
+        width: i ? "4px" : "6px",
+        height: i ? "4px" : "6px",
+        borderRadius: "50%",
+        display: "inline-block",
+        marginRight: i ? "6px" : "8px"
+      };
+      switch (t.status) {
+        case "active":
+          return /* @__PURE__ */ e(
+            "span",
+            {
+              style: {
+                ...p,
+                backgroundColor: "var(--rail-purple, #9B7AA8)",
+                animation: "pulse 1.2s ease-in-out infinite"
+              }
+            }
+          );
+        case "done":
+          return /* @__PURE__ */ e(
+            "span",
+            {
+              style: {
+                ...p,
+                backgroundColor: "var(--text-xfaint, rgba(30,33,37,0.28))"
+              }
+            }
+          );
+        case "error":
+          return /* @__PURE__ */ e(
+            "span",
+            {
+              style: {
+                ...p,
+                backgroundColor: "var(--rail-compliance, #C98A5A)"
+              }
+            }
+          );
+        default:
+          return /* @__PURE__ */ e(
+            "span",
+            {
+              style: {
+                ...p,
+                backgroundColor: "var(--text-xfaint, rgba(30,33,37,0.28))"
+              }
+            }
+          );
+      }
+    }, g = () => {
+      switch (t.status) {
+        case "done":
+          return /* @__PURE__ */ e("span", { style: {
+            color: "var(--text-faint, rgba(30,33,37,0.36))",
+            fontSize: i ? "9px" : "var(--text-xs-plus, 10.5px)"
+          }, children: "✓" });
+        case "error":
+          return /* @__PURE__ */ e("span", { style: {
+            color: "var(--rail-compliance, #C98A5A)",
+            fontSize: i ? "9px" : "var(--text-xs-plus, 10.5px)"
+          }, children: "failed" });
+        default:
+          return null;
+      }
+    };
+    return /* @__PURE__ */ s(
+      "div",
+      {
+        style: {
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "space-between",
+          marginBottom: i ? "2px" : "4px"
+        },
+        children: [
+          /* @__PURE__ */ s("div", { style: { display: "flex", alignItems: "center" }, children: [
+            c(),
+            /* @__PURE__ */ e("span", { style: {
+              fontFamily: "var(--font-mono)",
+              fontSize: i ? "9px" : "var(--text-xs-plus, 10.5px)",
+              color: "var(--text-muted)"
+            }, children: t.name })
+          ] }),
+          g()
+        ]
+      },
+      r
+    );
+  }, f = () => /* @__PURE__ */ e("div", { style: {
+    width: "100%",
+    height: i ? "2px" : "3px",
+    backgroundColor: "var(--border-subtle, rgba(52,58,64,0.08))",
+    borderRadius: i ? "2px" : "3px",
+    overflow: "hidden",
+    position: "relative"
+  }, children: /* @__PURE__ */ e("div", { style: {
+    position: "absolute",
+    top: 0,
+    left: 0,
+    right: 0,
+    bottom: 0,
+    background: "linear-gradient(90deg, transparent 0%, rgba(155,122,168,0.3) 50%, transparent 100%)",
+    animation: "shimmer 2s linear infinite"
+  } }) }), d = () => /* @__PURE__ */ e("span", { style: {
+    width: i ? "4px" : "6px",
+    height: i ? "10px" : "14px",
+    backgroundColor: "var(--rail-purple, #9B7AA8)",
+    borderRadius: "1px",
+    display: "inline-block",
+    marginLeft: "2px",
+    animation: "cursorBlink 0.8s ease-in-out infinite"
+  } }), o = L(), n = v(y);
+  return /* @__PURE__ */ s("div", { style: {
+    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: i ? "8px" : "10px",
+    padding: i ? "8px 10px 8px 12px" : "10px 14px 10px 18px"
+  }, children: [
+    /* @__PURE__ */ e("style", { children: `
+          @keyframes shimmer {
+            0% { transform: translateX(-100%); }
+            100% { transform: translateX(200%); }
+          }
+          
+          @keyframes pulse {
+            0%, 100% { opacity: 0.4; }
+            50% { opacity: 1.0; }
+          }
+          
+          @keyframes cursorBlink {
+            0%, 100% { opacity: 0; }
+            50% { opacity: 1; }
+          }
+        ` }),
+    !i && /* @__PURE__ */ e("div", { style: {
+      fontSize: "var(--text-xs-plus, 10.5px)",
+      fontWeight: 650,
+      textTransform: "uppercase",
+      letterSpacing: "var(--tracking-label, 0.16em)",
+      color: "var(--text-faint, rgba(30,33,37,0.36))",
+      marginBottom: "8px"
+    }, children: "AI ASSISTANT" }),
+    h === "thinking" && /* @__PURE__ */ s("div", { children: [
+      /* @__PURE__ */ s("div", { style: {
+        color: "var(--text-muted)",
+        fontWeight: 400,
+        fontSize: i ? "11px" : "13px",
+        marginBottom: i ? "4px" : "8px",
+        display: "flex",
+        alignItems: "center",
+        gap: "6px"
+      }, children: [
+        o,
+        n && /* @__PURE__ */ e("span", { style: {
+          fontSize: i ? "9px" : "10px",
+          color: "var(--text-faint, rgba(30,33,37,0.36))",
+          fontFamily: "var(--font-mono, monospace)"
+        }, children: n })
+      ] }),
+      f()
+    ] }),
+    h === "tool" && /* @__PURE__ */ s("div", { children: [
+      o && /* @__PURE__ */ s("div", { style: {
+        color: "var(--text-muted)",
+        fontWeight: 400,
+        fontSize: i ? "11px" : "13px",
+        marginBottom: i ? "4px" : "8px",
+        display: "flex",
+        alignItems: "center",
+        gap: "6px"
+      }, children: [
+        o,
+        n && /* @__PURE__ */ e("span", { style: {
+          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: 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: i ? "11px" : "13px",
+      display: "flex",
+      alignItems: "center",
+      gap: "6px"
+    }, children: [
+      /* @__PURE__ */ s("div", { style: { display: "flex", alignItems: "center" }, children: [
+        o,
+        d()
+      ] }),
+      n && /* @__PURE__ */ e("span", { style: {
+        fontSize: i ? "9px" : "10px",
+        color: "var(--text-faint, rgba(30,33,37,0.36))",
+        fontFamily: "var(--font-mono, monospace)"
+      }, children: n })
+    ] })
+  ] });
+}
+const _e = { error: (...h) => console.warn("toast.error:", ...h) };
+function qe({
+  initialMessages: h = [],
+  onSendMessage: b,
+  onStreamMessage: m,
+  // NEW: streaming version of onSendMessage
+  onMessagesChange: y,
+  // NEW: callback when messages array changes
+  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 [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 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`);
+  }, [d]), G(() => {
+    if (y) {
+      const u = [...k];
+      g && u.push(g), y(u);
+    }
+  }, [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 ? (_(!0), X(Math.floor(W))) : _(!1);
+      }
+    }, 500)), () => u && clearInterval(u);
+  }, [n, B]);
+  const P = () => {
+    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 {
+        return { type: "data", data: JSON.parse(W) };
+      } catch {
+        return null;
+      }
+    }
+    return null;
+  }, q = (u) => {
+    var j, R;
+    if (!((R = (j = u.choices) == null ? void 0 : j[0]) != null && R.delta))
+      return;
+    S.current = Date.now(), _(!1);
+    const W = u.choices[0].delta;
+    if (W.tool_calls || W.tool_results) {
+      z("tool");
+      return;
+    }
+    W.content !== void 0 && (z("responding"), p((F) => {
+      const V = F || {
+        id: Date.now().toString(),
+        role: "assistant",
+        content: "",
+        timestamp: (/* @__PURE__ */ new Date()).toLocaleTimeString("en-US", {
+          hour: "2-digit",
+          minute: "2-digit"
+        }),
+        isStreaming: !0
+      }, Q = {
+        ...V,
+        content: (V.content || "") + (W.content || "")
+      };
+      return I.current = Q, Q;
+    }));
+  }, U = async (u) => {
+    const W = u.getReader(), j = new TextDecoder();
+    let R = "";
+    try {
+      for (; ; ) {
+        const { done: F, value: V } = await W.read();
+        if (F)
+          break;
+        R += j.decode(V, { stream: !0 });
+        const Q = R.split(`
+`);
+        R = Q.pop() || "";
+        for (const ue of Q)
+          if (ue.trim()) {
+            const re = N(ue);
+            if (re) {
+              if (re.type === "done")
+                return;
+              re.type === "data" && q(re.data);
+            }
+          }
+      }
+    } finally {
+      W.releaseLock();
+    }
+  }, K = async () => {
+    if (!d.trim() || r)
+      return;
+    const u = d.trim(), W = {
+      id: Date.now().toString(),
+      role: "user",
+      content: u,
+      timestamp: (/* @__PURE__ */ new Date()).toLocaleTimeString("en-US", {
+        hour: "2-digit",
+        minute: "2-digit"
+      })
+    }, 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 R;
+      if (m)
+        R = await m(u, j);
+      else if (b)
+        R = await b(u, j);
+      else {
+        setTimeout(() => {
+          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.",
+            timestamp: (/* @__PURE__ */ new Date()).toLocaleTimeString("en-US", {
+              hour: "2-digit",
+              minute: "2-digit"
+            })
+          };
+          f((V) => [...V, F]), P();
+        }, 1e3);
+        return;
+      }
+      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((F) => [...F, {
+        ...I.current,
+        isStreaming: !1
+      }]);
+    } catch (R) {
+      R.name !== "AbortError" && (_e.error("Failed to send message"), console.error("Stream error:", R));
+    } finally {
+      P();
+    }
+  }, $ = (u) => {
+    u.key === "Enter" && !u.shiftKey && (u.preventDefault(), K());
+  };
+  return /* @__PURE__ */ s(
+    "div",
+    {
+      style: {
+        display: "flex",
+        flexDirection: "column",
+        height: "100%",
+        border: "1px solid var(--border, rgba(52,58,64,0.12))",
+        borderRadius: "var(--radius-lg, 12px)",
+        background: "var(--paper-elevated, rgba(255,255,255,0.82))",
+        overflow: "hidden"
+      },
+      children: [
+        L ? /* @__PURE__ */ s(
+          "div",
+          {
+            style: {
+              padding: "16px 20px",
+              borderBottom: "1px solid var(--border-subtle, rgba(52,58,64,0.08))",
+              background: "var(--paper-elevated, rgba(255,255,255,0.82))"
+            },
+            children: [
+              /* @__PURE__ */ e(
+                "div",
+                {
+                  style: {
+                    fontSize: "var(--text-lg, 16px)",
+                    fontWeight: 720,
+                    letterSpacing: "-0.01em",
+                    color: "var(--text-strong, rgba(30,33,37,0.92))"
+                  },
+                  children: L
+                }
+              ),
+              /* @__PURE__ */ e(
+                "div",
+                {
+                  style: {
+                    fontSize: "var(--text-sm, 11px)",
+                    color: "var(--text-muted, rgba(30,33,37,0.56))",
+                    marginTop: "2px"
+                  },
+                  children: "Ask questions, get insights from analyzed interactions"
+                }
+              )
+            ]
+          }
+        ) : null,
+        /* @__PURE__ */ e(
+          "div",
+          {
+            style: {
+              flex: 1,
+              minHeight: 0,
+              overflowY: "auto",
+              padding: "20px",
+              display: "flex",
+              flexDirection: "column"
+            },
+            children: k.length === 0 ? /* @__PURE__ */ e(
+              "div",
+              {
+                style: {
+                  flex: 1,
+                  display: "flex",
+                  alignItems: "center",
+                  justifyContent: "center",
+                  color: "var(--text-faint, rgba(30,33,37,0.36))",
+                  fontSize: "var(--text-md, 13px)",
+                  textAlign: "center",
+                  padding: "40px"
+                },
+                children: "No messages yet. Start a conversation by asking a question below."
+              }
+            ) : /* @__PURE__ */ s(J, { children: [
+              k.map((u) => /* @__PURE__ */ e(
+                be,
+                {
+                  role: u.role,
+                  content: u.content,
+                  html: u.html,
+                  timestamp: u.timestamp,
+                  toolBadges: u.toolBadges,
+                  isStreaming: u.isStreaming,
+                  onCodeBlockClick: i
+                },
+                u.id
+              )),
+              g && /* @__PURE__ */ e(
+                be,
+                {
+                  role: g.role,
+                  content: g.content,
+                  timestamp: g.timestamp,
+                  isStreaming: !0,
+                  onCodeBlockClick: i
+                },
+                g.id
+              ),
+              n && (!g || E) && /* @__PURE__ */ e("div", { style: { marginBottom: "16px" }, children: /* @__PURE__ */ e(
+                Fe,
+                {
+                  phase: E ? "tool" : C,
+                  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: T })
+            ] })
+          }
+        ),
+        /* @__PURE__ */ s(
+          "div",
+          {
+            style: {
+              borderTop: "1px solid var(--border-subtle, rgba(52,58,64,0.08))",
+              padding: "16px 20px",
+              background: "var(--paper-elevated, rgba(255,255,255,0.82))"
+            },
+            children: [
+              /* @__PURE__ */ s(
+                "div",
+                {
+                  style: {
+                    display: "flex",
+                    gap: "12px",
+                    alignItems: "flex-end"
+                  },
+                  children: [
+                    /* @__PURE__ */ e(
+                      "textarea",
+                      {
+                        ref: l,
+                        value: d,
+                        onChange: (u) => o(u.target.value),
+                        onKeyDown: $,
+                        placeholder: v,
+                        rows: 1,
+                        disabled: r,
+                        style: {
+                          flex: 1,
+                          padding: "10px 14px",
+                          fontSize: "var(--text-base, 14px)",
+                          lineHeight: 1.5,
+                          color: "var(--text-strong, rgba(30,33,37,0.92))",
+                          background: "rgba(255, 255, 255, 0.95)",
+                          border: "1px solid rgba(52, 58, 64, 0.18)",
+                          borderRadius: "var(--radius-md, 8px)",
+                          resize: "none",
+                          outline: "none",
+                          transition: "border-color 0.15s ease",
+                          fontFamily: "inherit",
+                          minHeight: "42px",
+                          maxHeight: "120px",
+                          opacity: r ? 0.6 : 1,
+                          cursor: r ? "not-allowed" : "text"
+                        },
+                        onFocus: (u) => {
+                          r || (u.target.style.borderColor = "rgba(94, 136, 176, 0.35)");
+                        },
+                        onBlur: (u) => {
+                          u.target.style.borderColor = "rgba(52, 58, 64, 0.18)";
+                        }
+                      }
+                    ),
+                    /* @__PURE__ */ e(
+                      "button",
+                      {
+                        onClick: K,
+                        disabled: !d.trim() || r,
+                        style: {
+                          padding: "10px 16px",
+                          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: d.trim() && !r ? "pointer" : "not-allowed",
+                          display: "flex",
+                          alignItems: "center",
+                          gap: "6px",
+                          fontSize: "var(--text-md, 13px)",
+                          fontWeight: 650,
+                          transition: "all 0.15s ease",
+                          height: "42px"
+                        },
+                        children: r ? /* @__PURE__ */ s(J, { children: [
+                          /* @__PURE__ */ e("style", { children: `
+                    @keyframes buttonSpin {
+                      from { transform: rotate(0deg); }
+                      to { transform: rotate(360deg); }
+                    }
+                  ` }),
+                          /* @__PURE__ */ e(
+                            "div",
+                            {
+                              style: {
+                                width: "14px",
+                                height: "14px",
+                                border: "2px solid rgba(255, 255, 255, 0.3)",
+                                borderTopColor: "white",
+                                borderRadius: "50%",
+                                animation: "buttonSpin 0.6s linear infinite"
+                              }
+                            }
+                          ),
+                          "Sending..."
+                        ] }) : /* @__PURE__ */ s(J, { children: [
+                          /* @__PURE__ */ e(ye, { size: 16 }),
+                          "Send"
+                        ] })
+                      }
+                    )
+                  ]
+                }
+              ),
+              /* @__PURE__ */ e(
+                "div",
+                {
+                  style: {
+                    fontSize: "var(--text-sm, 11px)",
+                    color: "var(--text-faint, rgba(30,33,37,0.36))",
+                    marginTop: "8px"
+                  },
+                  children: "Press Enter to send, Shift+Enter for new line"
+                }
+              )
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+function Ve({
+  threads: h = [],
+  activeThreadId: b,
+  onSelectThread: m,
+  onNewChat: y,
+  loading: i = !1
+}) {
+  const [v, L] = M(""), f = [...h.filter((o) => {
+    if (!v)
+      return !0;
+    const n = v.toLowerCase();
+    return (o.title || "").toLowerCase().includes(n) || (o.last_message_preview || "").toLowerCase().includes(n);
+  })].sort((o, n) => {
+    if (o.pinned && !n.pinned)
+      return -1;
+    if (!o.pinned && n.pinned)
+      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;
+  }), d = (o) => {
+    if (!o)
+      return "";
+    const n = new Date(o), r = (/* @__PURE__ */ new Date()).getTime() - n.getTime(), c = Math.floor(r / 864e5);
+    return c === 0 ? n.toLocaleTimeString("en-US", { hour: "2-digit", minute: "2-digit" }) : c === 1 ? "Yesterday" : c < 7 ? n.toLocaleDateString("en-US", { weekday: "short" }) : n.toLocaleDateString("en-US", { month: "short", day: "numeric" });
+  };
+  return /* @__PURE__ */ s(
+    "div",
+    {
+      style: {
+        display: "flex",
+        flexDirection: "column",
+        height: "100%",
+        background: "var(--paper, rgba(255,255,255,0.95))",
+        borderRight: "1px solid var(--border, rgba(52,58,64,0.12))",
+        overflow: "hidden"
+      },
+      children: [
+        /* @__PURE__ */ s(
+          "div",
+          {
+            style: {
+              padding: "12px 14px",
+              borderBottom: "1px solid var(--border-subtle, rgba(52,58,64,0.08))",
+              flexShrink: 0
+            },
+            children: [
+              /* @__PURE__ */ s(
+                "div",
+                {
+                  style: {
+                    display: "flex",
+                    justifyContent: "space-between",
+                    alignItems: "center",
+                    marginBottom: "10px"
+                  },
+                  children: [
+                    /* @__PURE__ */ e(
+                      "div",
+                      {
+                        style: {
+                          fontSize: "13px",
+                          fontWeight: 650,
+                          color: "var(--text-ink, rgba(30,33,37,0.92))"
+                        },
+                        children: "Threads"
+                      }
+                    ),
+                    y && /* @__PURE__ */ e(
+                      "button",
+                      {
+                        onClick: y,
+                        style: {
+                          padding: "4px 10px",
+                          fontSize: "11px",
+                          fontWeight: 600,
+                          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 = "#ECEEF2";
+                        },
+                        onMouseLeave: (o) => {
+                          o.currentTarget.style.background = "rgba(94, 136, 176, 0.08)";
+                        },
+                        children: "+ New"
+                      }
+                    )
+                  ]
+                }
+              ),
+              /* @__PURE__ */ s("div", { style: { position: "relative" }, children: [
+                /* @__PURE__ */ e(
+                  Ce,
+                  {
+                    size: 13,
+                    style: {
+                      position: "absolute",
+                      left: "10px",
+                      top: "50%",
+                      transform: "translateY(-50%)",
+                      color: "var(--text-faint, rgba(30,33,37,0.36))",
+                      pointerEvents: "none"
+                    }
+                  }
+                ),
+                /* @__PURE__ */ e(
+                  "input",
+                  {
+                    type: "text",
+                    value: v,
+                    onChange: (o) => L(o.target.value),
+                    placeholder: "Search threads...",
+                    style: {
+                      width: "100%",
+                      padding: "7px 10px 7px 32px",
+                      fontSize: "12px",
+                      color: "var(--text-ink, rgba(30,33,37,0.92))",
+                      background: "var(--paper-elevated, rgba(255,255,255,0.82))",
+                      border: "1px solid var(--border, rgba(52,58,64,0.12))",
+                      borderRadius: "6px",
+                      outline: "none",
+                      transition: "border-color 0.15s ease",
+                      boxSizing: "border-box"
+                    },
+                    onFocus: (o) => {
+                      o.target.style.borderColor = "rgba(94, 136, 176, 0.35)";
+                    },
+                    onBlur: (o) => {
+                      o.target.style.borderColor = "rgba(52, 58, 64, 0.12)";
+                    }
+                  }
+                )
+              ] })
+            ]
+          }
+        ),
+        /* @__PURE__ */ e("div", { style: { flex: 1, overflowY: "auto", padding: "4px 6px" }, children: i ? /* @__PURE__ */ e(
+          "div",
+          {
+            style: {
+              padding: "30px 16px",
+              textAlign: "center",
+              color: "var(--text-faint, rgba(30,33,37,0.36))",
+              fontSize: "12px"
+            },
+            children: "Loading threads..."
+          }
+        ) : f.length === 0 ? /* @__PURE__ */ e(
+          "div",
+          {
+            style: {
+              padding: "30px 16px",
+              textAlign: "center",
+              color: "var(--text-faint, rgba(30,33,37,0.36))",
+              fontSize: "12px"
+            },
+            children: v ? "No threads found" : "No threads yet"
+          }
+        ) : f.map((o) => {
+          const n = o.id === b;
+          return /* @__PURE__ */ s(
+            "div",
+            {
+              onClick: () => m == null ? void 0 : m(o.id),
+              style: {
+                padding: "10px 10px",
+                marginBottom: "2px",
+                borderRadius: "6px",
+                background: n ? "rgba(94, 136, 176, 0.10)" : "transparent",
+                border: n ? "1px solid rgba(94, 136, 176, 0.15)" : "1px solid transparent",
+                cursor: "pointer",
+                transition: "all 0.12s ease"
+              },
+              onMouseEnter: (t) => {
+                n || (t.currentTarget.style.background = "rgba(0,0,0,0.03)");
+              },
+              onMouseLeave: (t) => {
+                n || (t.currentTarget.style.background = "transparent");
+              },
+              children: [
+                /* @__PURE__ */ s("div", { style: { display: "flex", alignItems: "center", gap: "6px", marginBottom: "4px" }, children: [
+                  /* @__PURE__ */ e(
+                    ze,
+                    {
+                      size: 12,
+                      style: {
+                        color: n ? "var(--rail-discovery, #5E88B0)" : "var(--text-faint, rgba(30,33,37,0.36))",
+                        flexShrink: 0
+                      }
+                    }
+                  ),
+                  /* @__PURE__ */ e(
+                    "div",
+                    {
+                      style: {
+                        flex: 1,
+                        fontSize: "12px",
+                        fontWeight: n ? 650 : 550,
+                        color: n ? "var(--text-ink, rgba(30,33,37,0.92))" : "var(--text-base, rgba(30,33,37,0.78))",
+                        overflow: "hidden",
+                        textOverflow: "ellipsis",
+                        whiteSpace: "nowrap"
+                      },
+                      children: o.title || "Untitled thread"
+                    }
+                  ),
+                  o.pinned && /* @__PURE__ */ e(Te, { size: 10, style: { color: "var(--rail-discovery, #5E88B0)", flexShrink: 0 } })
+                ] }),
+                o.last_message_preview && /* @__PURE__ */ e(
+                  "div",
+                  {
+                    style: {
+                      fontSize: "11px",
+                      color: "var(--text-muted, rgba(30,33,37,0.56))",
+                      overflow: "hidden",
+                      textOverflow: "ellipsis",
+                      whiteSpace: "nowrap",
+                      marginLeft: "18px",
+                      marginBottom: "4px"
+                    },
+                    children: o.last_message_preview
+                  }
+                ),
+                /* @__PURE__ */ s(
+                  "div",
+                  {
+                    style: {
+                      display: "flex",
+                      alignItems: "center",
+                      gap: "6px",
+                      marginLeft: "18px",
+                      fontSize: "10px",
+                      color: "var(--text-faint, rgba(30,33,37,0.36))"
+                    },
+                    children: [
+                      /* @__PURE__ */ e(ge, { size: 9 }),
+                      /* @__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: [
+                          o.message_count,
+                          " msg",
+                          o.message_count !== 1 ? "s" : ""
+                        ] })
+                      ] })
+                    ]
+                  }
+                )
+              ]
+            },
+            o.id
+          );
+        }) })
+      ]
+    }
+  );
+}
+const $e = { error: (...h) => console.warn("toast.error:", ...h) }, je = () => ({ userData: { name: "User", email: "" } });
+function Ge({
+  sessionTitle: h,
+  messages: b,
+  onSendMessage: m,
+  currentUser: 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: ((B = c == null ? void 0 : c.name) == null ? void 0 : B.split(" ").map((a) => a[0]).join("").toUpperCase()) || "YO",
+    color: "#6B7C93"
+  };
+  G(() => {
+    d(b || []);
+  }, [b]), G(() => {
+    g.current && g.current.scrollIntoView({ behavior: "smooth" });
+  }, [f]);
+  const C = async () => {
+    if (!i.trim())
+      return;
+    const a = i.trim();
+    v(""), r(!0);
+    const w = {
+      id: `temp-${Date.now()}`,
+      author: {
+        name: p.name,
+        role: (c == null ? void 0 : c.role) || "",
+        initials: p.initials,
+        color: p.color
+      },
+      content: a,
+      timestamp: "Just now",
+      type: "comment",
+      isOptimistic: !0
+    };
+    if (d((D) => [...D, w]), m) {
+      try {
+        await m(a), d(
+          (D) => D.map(
+            (T) => T.id === w.id ? { ...T, isOptimistic: !1 } : T
+          )
+        );
+      } catch {
+        d((T) => T.filter((l) => l.id !== w.id)), $e.error("Failed to send message");
+      } finally {
+        r(!1);
+      }
+      return;
+    }
+    setTimeout(() => {
+      d(
+        (D) => D.map(
+          (T) => T.id === w.id ? { ...T, isOptimistic: !1 } : T
+        )
+      ), r(!1);
+    }, 500);
+  }, z = (a) => {
+    a.key === "Enter" && !a.shiftKey && (a.preventDefault(), C());
+  };
+  return /* @__PURE__ */ s(
+    "div",
+    {
+      style: {
+        display: "flex",
+        flexDirection: "column",
+        height: "100%",
+        background: "var(--paper-elevated, rgba(255,255,255,0.82))",
+        border: "1px solid var(--border, rgba(52,58,64,0.12))",
+        borderRadius: "var(--radius-lg, 12px)",
+        overflow: "hidden"
+      },
+      children: [
+        h && /* @__PURE__ */ s(
+          "div",
+          {
+            style: {
+              padding: "14px 16px",
+              borderBottom: "1px solid var(--border, rgba(52,58,64,0.12))",
+              background: "var(--paper-elevated, rgba(255,255,255,0.82))"
+            },
+            children: [
+              /* @__PURE__ */ e(
+                "div",
+                {
+                  style: {
+                    fontSize: "var(--text-md, 13px)",
+                    fontWeight: 680,
+                    color: "var(--text-strong, rgba(30,33,37,0.92))",
+                    marginBottom: "3px"
+                  },
+                  children: "Session Discussion"
+                }
+              ),
+              h && /* @__PURE__ */ e(
+                "div",
+                {
+                  style: {
+                    fontSize: "var(--text-sm, 11px)",
+                    color: "var(--text-muted, rgba(30,33,37,0.56))",
+                    display: "flex",
+                    alignItems: "center",
+                    gap: "8px"
+                  },
+                  children: /* @__PURE__ */ e("span", { children: h })
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ s(
+          "div",
+          {
+            style: {
+              flex: 1,
+              overflowY: "auto",
+              padding: "16px",
+              display: "flex",
+              flexDirection: "column",
+              gap: "16px"
+            },
+            children: [
+              o ? /* @__PURE__ */ e(
+                "div",
+                {
+                  style: {
+                    display: "flex",
+                    alignItems: "center",
+                    justifyContent: "center",
+                    padding: "40px",
+                    color: "var(--text-faint, rgba(30,33,37,0.36))"
+                  },
+                  children: "Loading messages..."
+                }
+              ) : f.length === 0 ? /* @__PURE__ */ e(
+                "div",
+                {
+                  style: {
+                    display: "flex",
+                    alignItems: "center",
+                    justifyContent: "center",
+                    padding: "40px",
+                    color: "var(--text-faint, rgba(30,33,37,0.36))"
+                  },
+                  children: "No messages yet. Start the conversation!"
+                }
+              ) : f.map((a) => /* @__PURE__ */ s(
+                "div",
+                {
+                  style: {
+                    display: "flex",
+                    gap: "12px",
+                    opacity: a.type === "system" ? 0.75 : 1
+                  },
+                  children: [
+                    a.type !== "system" && /* @__PURE__ */ e(
+                      "div",
+                      {
+                        style: {
+                          width: "32px",
+                          height: "32px",
+                          borderRadius: "8px",
+                          background: a.author.color,
+                          color: "white",
+                          display: "flex",
+                          alignItems: "center",
+                          justifyContent: "center",
+                          fontSize: "11px",
+                          fontWeight: 650,
+                          flexShrink: 0,
+                          opacity: 0.9
+                        },
+                        children: a.author.initials
+                      }
+                    ),
+                    a.type === "system" && /* @__PURE__ */ e(
+                      "div",
+                      {
+                        style: {
+                          width: "32px",
+                          height: "32px",
+                          borderRadius: "8px",
+                          background: "rgba(30, 33, 37, 0.08)",
+                          color: "rgba(30, 33, 37, 0.52)",
+                          display: "flex",
+                          alignItems: "center",
+                          justifyContent: "center",
+                          fontSize: "11px",
+                          fontWeight: 650,
+                          flexShrink: 0
+                        },
+                        children: /* @__PURE__ */ e(ge, { size: 14 })
+                      }
+                    ),
+                    /* @__PURE__ */ s("div", { style: { flex: 1, minWidth: 0 }, children: [
+                      /* @__PURE__ */ s(
+                        "div",
+                        {
+                          style: {
+                            display: "flex",
+                            alignItems: "baseline",
+                            gap: "8px",
+                            marginBottom: "4px"
+                          },
+                          children: [
+                            /* @__PURE__ */ e(
+                              "span",
+                              {
+                                style: {
+                                  fontSize: "var(--text-sm, 11px)",
+                                  fontWeight: 650,
+                                  color: "var(--text-base, rgba(30,33,37,0.78))"
+                                },
+                                children: a.author.name
+                              }
+                            ),
+                            /* @__PURE__ */ e(
+                              "span",
+                              {
+                                style: {
+                                  fontSize: "var(--text-sm, 11px)",
+                                  color: "var(--text-faint, rgba(30,33,37,0.36))",
+                                  fontFamily: "var(--font-mono, monospace)"
+                                },
+                                children: a.timestamp
+                              }
+                            ),
+                            a.author.role && /* @__PURE__ */ e(
+                              "span",
+                              {
+                                style: {
+                                  fontSize: "var(--text-xs, 10px)",
+                                  color: "var(--text-muted, rgba(30,33,37,0.56))",
+                                  background: "rgba(30, 33, 37, 0.06)",
+                                  padding: "2px 6px",
+                                  borderRadius: "4px",
+                                  textTransform: "uppercase",
+                                  letterSpacing: "0.04em",
+                                  fontWeight: 600
+                                },
+                                children: a.author.role
+                              }
+                            ),
+                            a.isEdited && /* @__PURE__ */ e(
+                              "span",
+                              {
+                                style: {
+                                  fontSize: "var(--text-xs, 10px)",
+                                  color: "var(--text-faint, rgba(30,33,37,0.36))",
+                                  fontStyle: "italic"
+                                },
+                                children: "(edited)"
+                              }
+                            )
+                          ]
+                        }
+                      ),
+                      /* @__PURE__ */ e(
+                        "div",
+                        {
+                          style: {
+                            fontSize: "var(--text-md, 13px)",
+                            color: "var(--text-base, rgba(30,33,37,0.78))",
+                            lineHeight: 1.5,
+                            marginBottom: a.references ? "8px" : 0
+                          },
+                          children: a.content
+                        }
+                      ),
+                      a.references && a.references.length > 0 && /* @__PURE__ */ e(
+                        "div",
+                        {
+                          style: {
+                            display: "flex",
+                            flexWrap: "wrap",
+                            gap: "6px",
+                            marginTop: "8px"
+                          },
+                          children: a.references.map((w, D) => /* @__PURE__ */ s(
+                            "button",
+                            {
+                              type: "button",
+                              style: {
+                                fontSize: "11px",
+                                padding: "4px 8px",
+                                borderRadius: "6px",
+                                border: "1px solid rgba(52, 58, 64, 0.16)",
+                                background: "rgba(255, 255, 255, 0.7)",
+                                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",
+                                gap: "4px",
+                                transition: "all 0.15s ease",
+                                fontWeight: 550
+                              },
+                              onMouseEnter: (T) => {
+                                T.currentTarget.style.background = "rgba(255, 255, 255, 0.95)", T.currentTarget.style.borderColor = "rgba(52, 58, 64, 0.24)";
+                              },
+                              onMouseLeave: (T) => {
+                                T.currentTarget.style.background = "rgba(255, 255, 255, 0.7)", T.currentTarget.style.borderColor = "rgba(52, 58, 64, 0.16)";
+                              },
+                              children: [
+                                w.type === "timestamp" && /* @__PURE__ */ e(ge, { size: 12 }),
+                                (w.type === "condition" || w.type === "observation") && /* @__PURE__ */ e(he, { size: 12 }),
+                                w.label
+                              ]
+                            },
+                            D
+                          ))
+                        }
+                      )
+                    ] })
+                  ]
+                },
+                a.id
+              )),
+              /* @__PURE__ */ e("div", { ref: g })
+            ]
+          }
+        ),
+        /* @__PURE__ */ s(
+          "div",
+          {
+            style: {
+              padding: "12px",
+              borderTop: "1px solid var(--border, rgba(52,58,64,0.12))",
+              background: "var(--paper-elevated, rgba(255,255,255,0.82))"
+            },
+            children: [
+              /* @__PURE__ */ s(
+                "div",
+                {
+                  style: {
+                    display: "flex",
+                    gap: "8px",
+                    alignItems: "flex-end"
+                  },
+                  children: [
+                    /* @__PURE__ */ e(
+                      "div",
+                      {
+                        style: {
+                          width: "32px",
+                          height: "32px",
+                          borderRadius: "var(--radius-md, 8px)",
+                          background: p.color,
+                          color: "white",
+                          display: "flex",
+                          alignItems: "center",
+                          justifyContent: "center",
+                          fontSize: "var(--text-sm, 11px)",
+                          fontWeight: 650,
+                          flexShrink: 0,
+                          opacity: 0.9
+                        },
+                        children: p.initials
+                      }
+                    ),
+                    /* @__PURE__ */ s(
+                      "div",
+                      {
+                        style: {
+                          flex: 1,
+                          display: "flex",
+                          flexDirection: "column",
+                          gap: "8px"
+                        },
+                        children: [
+                          /* @__PURE__ */ e(
+                            "textarea",
+                            {
+                              value: i,
+                              onChange: (a) => v(a.target.value),
+                              onKeyDown: z,
+                              onFocus: () => k(!0),
+                              onBlur: () => k(!1),
+                              placeholder: "Add a comment...",
+                              style: {
+                                width: "100%",
+                                minHeight: "38px",
+                                maxHeight: "120px",
+                                padding: "8px 12px",
+                                fontSize: "var(--text-md, 13px)",
+                                color: "var(--text-base, rgba(30,33,37,0.78))",
+                                background: "white",
+                                border: `1px solid ${L ? "rgba(94, 136, 176, 0.35)" : "rgba(52, 58, 64, 0.16)"}`,
+                                borderRadius: "var(--radius-md, 8px)",
+                                resize: "vertical",
+                                outline: "none",
+                                transition: "border-color 0.15s ease",
+                                fontFamily: "inherit",
+                                lineHeight: 1.5
+                              }
+                            }
+                          ),
+                          /* @__PURE__ */ s(
+                            "div",
+                            {
+                              style: {
+                                display: "flex",
+                                alignItems: "center",
+                                justifyContent: "space-between"
+                              },
+                              children: [
+                                /* @__PURE__ */ s("div", { style: { display: "flex", gap: "4px" }, children: [
+                                  /* @__PURE__ */ e(
+                                    "button",
+                                    {
+                                      type: "button",
+                                      style: {
+                                        padding: "6px",
+                                        background: "transparent",
+                                        border: "none",
+                                        borderRadius: "6px",
+                                        color: "rgba(30, 33, 37, 0.52)",
+                                        cursor: "pointer",
+                                        display: "flex",
+                                        alignItems: "center",
+                                        transition: "all 0.15s ease"
+                                      },
+                                      onMouseEnter: (a) => {
+                                        a.currentTarget.style.background = "rgba(30, 33, 37, 0.06)", a.currentTarget.style.color = "rgba(30, 33, 37, 0.75)";
+                                      },
+                                      onMouseLeave: (a) => {
+                                        a.currentTarget.style.background = "transparent", a.currentTarget.style.color = "rgba(30, 33, 37, 0.52)";
+                                      },
+                                      title: "Mention user",
+                                      children: /* @__PURE__ */ e(Be, { size: 16 })
+                                    }
+                                  ),
+                                  /* @__PURE__ */ e(
+                                    "button",
+                                    {
+                                      type: "button",
+                                      style: {
+                                        padding: "6px",
+                                        background: "transparent",
+                                        border: "none",
+                                        borderRadius: "6px",
+                                        color: "rgba(30, 33, 37, 0.52)",
+                                        cursor: "pointer",
+                                        display: "flex",
+                                        alignItems: "center",
+                                        transition: "all 0.15s ease"
+                                      },
+                                      onMouseEnter: (a) => {
+                                        a.currentTarget.style.background = "rgba(30, 33, 37, 0.06)", a.currentTarget.style.color = "rgba(30, 33, 37, 0.75)";
+                                      },
+                                      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 })
+                                    }
+                                  ),
+                                  /* @__PURE__ */ e(
+                                    "button",
+                                    {
+                                      type: "button",
+                                      style: {
+                                        padding: "6px",
+                                        background: "transparent",
+                                        border: "none",
+                                        borderRadius: "6px",
+                                        color: "rgba(30, 33, 37, 0.52)",
+                                        cursor: "pointer",
+                                        display: "flex",
+                                        alignItems: "center",
+                                        transition: "all 0.15s ease"
+                                      },
+                                      onMouseEnter: (a) => {
+                                        a.currentTarget.style.background = "rgba(30, 33, 37, 0.06)", a.currentTarget.style.color = "rgba(30, 33, 37, 0.75)";
+                                      },
+                                      onMouseLeave: (a) => {
+                                        a.currentTarget.style.background = "transparent", a.currentTarget.style.color = "rgba(30, 33, 37, 0.52)";
+                                      },
+                                      title: "Attach file",
+                                      children: /* @__PURE__ */ e(Re, { size: 16 })
+                                    }
+                                  )
+                                ] }),
+                                /* @__PURE__ */ e(
+                                  "button",
+                                  {
+                                    type: "button",
+                                    onClick: C,
+                                    disabled: !i.trim() || t,
+                                    style: {
+                                      padding: "6px 12px",
+                                      background: i.trim() && !t ? "rgba(94, 136, 176, 0.85)" : "var(--border-subtle, rgba(52,58,64,0.08))",
+                                      border: "none",
+                                      borderRadius: "6px",
+                                      color: i.trim() && !t ? "white" : "var(--text-faint, rgba(30,33,37,0.36))",
+                                      fontSize: "var(--text-sm, 11px)",
+                                      fontWeight: 600,
+                                      cursor: i.trim() && !t ? "pointer" : "not-allowed",
+                                      display: "flex",
+                                      alignItems: "center",
+                                      gap: "6px",
+                                      transition: "all 0.15s ease"
+                                    },
+                                    onMouseEnter: (a) => {
+                                      i.trim() && !t && (a.currentTarget.style.background = "rgba(94, 136, 176, 1)");
+                                    },
+                                    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: `
+                        @keyframes messageSpin {
+                          from { transform: rotate(0deg); }
+                          to { transform: rotate(360deg); }
+                        }
+                      ` }),
+                                      /* @__PURE__ */ e(
+                                        "div",
+                                        {
+                                          style: {
+                                            width: "14px",
+                                            height: "14px",
+                                            border: "2px solid rgba(255, 255, 255, 0.3)",
+                                            borderTopColor: "white",
+                                            borderRadius: "50%",
+                                            animation: "messageSpin 0.6s linear infinite"
+                                          }
+                                        }
+                                      ),
+                                      "Sending..."
+                                    ] }) : /* @__PURE__ */ s(J, { children: [
+                                      /* @__PURE__ */ e(ye, { size: 14 }),
+                                      "Send"
+                                    ] })
+                                  }
+                                )
+                              ]
+                            }
+                          )
+                        ]
+                      }
+                    )
+                  ]
+                }
+              ),
+              /* @__PURE__ */ s(
+                "div",
+                {
+                  style: {
+                    marginTop: "8px",
+                    fontSize: "var(--text-sm, 11px)",
+                    color: "var(--text-faint, rgba(30,33,37,0.36))",
+                    lineHeight: 1.4
+                  },
+                  children: [
+                    /* @__PURE__ */ e("strong", { children: "Tip:" }),
+                    " Use",
+                    " ",
+                    /* @__PURE__ */ e(
+                      "code",
+                      {
+                        style: {
+                          background: "rgba(30, 33, 37, 0.06)",
+                          padding: "2px 4px",
+                          borderRadius: "3px",
+                          fontFamily: "var(--font-mono, monospace)",
+                          fontSize: "var(--text-xs, 10px)"
+                        },
+                        children: "@"
+                      }
+                    ),
+                    " ",
+                    "to mention teammates,",
+                    " ",
+                    /* @__PURE__ */ e(
+                      "code",
+                      {
+                        style: {
+                          background: "rgba(30, 33, 37, 0.06)",
+                          padding: "2px 4px",
+                          borderRadius: "3px",
+                          fontFamily: "var(--font-mono, monospace)",
+                          fontSize: "var(--text-xs, 10px)"
+                        },
+                        children: "#"
+                      }
+                    ),
+                    " ",
+                    "to reference conditions"
+                  ]
+                }
+              )
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+const A = [
+  "#5E88B0",
+  // rail-discovery / rail-blue
+  "#9B7AA8",
+  // rail-purple / rail-tone
+  "#C98A5A",
+  // rail-compliance / rail-orange
+  "#7BA89D",
+  // rail-signal-upsell (teal-green)
+  "#D17B6B",
+  // rail-coral / rail-signal-churn
+  "#6B7C93",
+  // rail-slate / rail-outcome
+  "#9B8E6F",
+  // rail-olive / rail-signal-satisfaction
+  "#8A9BAF",
+  // rail-quality
+  "#B8976A",
+  // rail-teal (warm gold)
+  "#A8C76B"
+  // green accent (complementary)
+], pe = { fill: "var(--text-muted, #666)", fontSize: 12 }, O = { stroke: "var(--border, #e0e0e0)" }, se = "var(--border, #e0e0e0)", te = {
+  contentStyle: {
+    backgroundColor: "var(--paper-elevated, #fff)",
+    border: "1px solid var(--border, #e0e0e0)",
+    borderRadius: "var(--radius-sm, 4px)",
+    boxShadow: "0 2px 8px rgba(0, 0, 0, 0.1)",
+    color: "var(--text-ink, #1e2125)"
+  },
+  labelStyle: { color: "var(--text-strong, #1e2125)" }
+}, le = { color: "var(--text-ink, #1e2125)", fontSize: "12px" }, Pe = (h, b) => {
+  if (!h)
+    return !1;
+  const m = h.toLowerCase();
+  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), 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 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 = 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, 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 = d;
+}, He = (h, b) => {
+  const m = ["", ...h.map((v) => v.name)].join(","), y = b.map((v) => {
+    const L = h.map((k) => {
+      const f = k.data.find((d) => d.x === v);
+      return f ? f.y : "";
+    });
+    return [v, ...L].join(",");
+  }), i = [m, ...y].join(`
+`);
+  navigator.clipboard.writeText(i);
+}, Oe = ({ onDownload: h, onCopy: b, copied: m }) => /* @__PURE__ */ s("div", { style: {
+  display: "flex",
+  gap: 6,
+  justifyContent: "flex-end",
+  marginBottom: 8,
+  opacity: 0.7,
+  transition: "opacity 0.15s"
+}, children: [
+  /* @__PURE__ */ e("button", { onClick: b, title: "Copy data as CSV", style: {
+    background: "none",
+    border: "1px solid var(--border, #e0e0e0)",
+    borderRadius: "var(--radius-sm, 4px)",
+    padding: "3px 8px",
+    fontSize: 11,
+    color: "var(--text-muted, #666)",
+    cursor: "pointer",
+    display: "flex",
+    alignItems: "center",
+    gap: 4
+  }, children: m ? "✓ Copied" : "📋 CSV" }),
+  /* @__PURE__ */ e("button", { onClick: h, title: "Download as PNG", style: {
+    background: "none",
+    border: "1px solid var(--border, #e0e0e0)",
+    borderRadius: "var(--radius-sm, 4px)",
+    padding: "3px 8px",
+    fontSize: 11,
+    color: "var(--text-muted, #666)",
+    cursor: "pointer",
+    display: "flex",
+    alignItems: "center",
+    gap: 4
+  }, children: "📥 PNG" })
+] }), 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(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 = 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)",
+    padding: "16px",
+    marginBottom: "16px"
+  }, C = {
+    color: "var(--text-strong, #1e2125)",
+    fontSize: "14px",
+    fontWeight: "600",
+    marginBottom: "12px"
+  }, z = {
+    dataKey: "x",
+    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)" } }
+    } : {}
+  }, B = {
+    tick: pe,
+    axisLine: O,
+    tickLine: O,
+    ...y ? {
+      label: { value: y, angle: -90, position: "insideLeft", style: { textAnchor: "middle", fill: "var(--text-muted, #666)" } }
+    } : {}
+  }, a = () => {
+    switch (h) {
+      case "bar":
+        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, { ...z }),
+          /* @__PURE__ */ e(ie, { ...B }),
+          /* @__PURE__ */ e(ee, { ...te }),
+          !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, 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,
+            {
+              type: "number",
+              tick: pe,
+              axisLine: O,
+              tickLine: O,
+              ...y ? { label: { value: y, position: "insideBottom", offset: -5, style: { textAnchor: "middle", fill: "var(--text-muted, #666)" } } } : {}
+            }
+          ),
+          /* @__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(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: d, margin: { top: 5, right: 30, left: 20, bottom: g ? 40 : r }, children: [
+          /* @__PURE__ */ e(ne, { strokeDasharray: "3 3", stroke: se }),
+          /* @__PURE__ */ e(oe, { ...z }),
+          /* @__PURE__ */ e(ie, { ...B }),
+          /* @__PURE__ */ e(ee, { ...te }),
+          /* @__PURE__ */ e(ae, { wrapperStyle: le }),
+          o.map((l, x) => /* @__PURE__ */ e(
+            Ee,
+            {
+              type: "monotone",
+              dataKey: l,
+              stroke: A[x % A.length],
+              strokeWidth: 2,
+              dot: { r: 4, fill: A[x % A.length] },
+              activeDot: { r: 6, fill: A[x % A.length] }
+            },
+            l
+          ))
+        ] }) });
+      case "area":
+        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, { ...z }),
+          /* @__PURE__ */ e(ie, { ...B }),
+          /* @__PURE__ */ e(ee, { ...te }),
+          /* @__PURE__ */ e(ae, { wrapperStyle: le }),
+          o.map((l, x) => /* @__PURE__ */ e(
+            Me,
+            {
+              type: "monotone",
+              dataKey: l,
+              stroke: A[x % A.length],
+              strokeWidth: 2,
+              fill: A[x % A.length],
+              fillOpacity: 0.15
+            },
+            l
+          ))
+        ] }) });
+      case "pie": {
+        const l = i[0].data.map((S, E) => ({
+          name: S.x,
+          value: S.y,
+          fill: A[E % A.length]
+        })), x = Math.PI / 180;
+        return /* @__PURE__ */ e(Z, { width: "100%", height: 320, children: /* @__PURE__ */ s(Ae, { children: [
+          /* @__PURE__ */ e(
+            Le,
+            {
+              data: l,
+              cx: "50%",
+              cy: "50%",
+              outerRadius: 100,
+              dataKey: "value",
+              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",
+                  {
+                    x: U,
+                    y: K,
+                    fill: "var(--text-ink, #1e2125)",
+                    fontSize: 11,
+                    textAnchor: U > S ? "start" : "end",
+                    dominantBaseline: "central",
+                    children: [
+                      N,
+                      " (",
+                      (P * 100).toFixed(0),
+                      "%)"
+                    ]
+                  }
+                );
+              },
+              labelLine: { stroke: "var(--text-muted, #666)" },
+              children: l.map((S, E) => /* @__PURE__ */ e(ce, { fill: S.fill }, E))
+            }
+          ),
+          /* @__PURE__ */ e(ee, { ...te })
+        ] }) });
+      }
+      case "metric": {
+        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",
+            fontWeight: 700,
+            lineHeight: 1,
+            color: "var(--text-strong, #1e2125)",
+            fontVariantNumeric: "tabular-nums"
+          }, children: K(S) }),
+          E && /* @__PURE__ */ e("div", { style: { fontSize: "14px", color: "var(--text-muted, #666)", fontWeight: 500 }, children: E }),
+          _ && /* @__PURE__ */ s("div", { style: {
+            display: "flex",
+            alignItems: "center",
+            gap: 4,
+            fontSize: "13px",
+            fontWeight: 600,
+            color: q,
+            background: P ? "rgba(123,168,157,0.12)" : N ? "rgba(209,123,107,0.12)" : "rgba(128,128,128,0.08)",
+            padding: "3px 8px",
+            borderRadius: "var(--radius-sm, 4px)"
+          }, children: [
+            /* @__PURE__ */ e("span", { children: U }),
+            /* @__PURE__ */ s("span", { children: [
+              K(Math.abs(H)),
+              " (",
+              Math.abs(X).toFixed(1),
+              "%)"
+            ] })
+          ] }),
+          _ && /* @__PURE__ */ s("div", { style: { fontSize: "11px", color: "var(--text-faint, #999)" }, children: [
+            "vs ",
+            I.x || "previous"
+          ] })
+        ] });
+      }
+      default:
+        return /* @__PURE__ */ s("div", { style: { color: "var(--text-muted)", fontSize: 12, padding: 8 }, children: [
+          "Unsupported chart type: ",
+          h
+        ] });
+    }
+  }, w = xe(() => {
+    v.current && Ue(v.current, b);
+  }, [b]), D = xe(() => {
+    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: w, onCopy: D, copied: L }),
+    /* @__PURE__ */ e("div", { ref: v, children: a() })
+  ] });
+};
 export {
-  s as ChartRenderer,
-  r as ChatHistoryPanel,
-  t as ChatInterface,
-  h as ChatMessage,
-  n as MessageThread,
-  C as ThinkingIndicator
+  Je as ChartRenderer,
+  Ve as ChatHistoryPanel,
+  qe as ChatInterface,
+  be as ChatMessage,
+  Ge as MessageThread,
+  Fe as ThinkingIndicator
 };
 //# sourceMappingURL=chat.es.js.map