@particle-academy/react-fancy 3.0.1 → 3.2.0

package/dist/index.cjs

@@ -9223,11 +9223,11 @@ function computeTicks(min, max, count = 5) {
   }
   return ticks;
 }
-function niceNum(range2, round) {
+function niceNum(range2, round2) {
   const exponent = Math.floor(Math.log10(range2));
   const fraction = range2 / Math.pow(10, exponent);
   let niceFraction;
-  if (round) {
+  if (round2) {
     if (fraction < 1.5) niceFraction = 1;
     else if (fraction < 3) niceFraction = 2;
     else if (fraction < 7) niceFraction = 5;
@@ -11840,6 +11840,1277 @@ TreeNavRoot.displayName = "TreeNav";
 var TreeNav = Object.assign(TreeNavRoot, {
   Node: TreeNode
 });
+var CONFIDENCE_TIERS = [
+  { min: 0.85, color: "#10b981", label: "high" },
+  { min: 0.6, color: "#f59e0b", label: "medium" },
+  { min: 0, color: "#ef4444", label: "low" }
+];
+function tier(c) {
+  return CONFIDENCE_TIERS.find((t) => c >= t.min) ?? CONFIDENCE_TIERS[2];
+}
+function ReasonTag({
+  value,
+  reason,
+  confidence = 1,
+  sources = [],
+  by,
+  theme = "dot",
+  pinned = false,
+  onFollowUp,
+  className
+}) {
+  const t = tier(confidence);
+  const trigger = theme === "chip" ? /* @__PURE__ */ jsxRuntime.jsxs(
+    "span",
+    {
+      className: `inline-flex cursor-help items-center gap-1 rounded-full px-2 py-0.5 text-[12px] font-medium ${className ?? ""}`,
+      style: { backgroundColor: t.color + "22", color: t.color },
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "span",
+          {
+            className: "h-1.5 w-1.5 rounded-full",
+            style: { backgroundColor: t.color }
+          }
+        ),
+        value,
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[10px] opacity-70", children: "?" })
+      ]
+    }
+  ) : theme === "underline" ? /* @__PURE__ */ jsxRuntime.jsxs(
+    "span",
+    {
+      className: `cursor-help underline decoration-dotted underline-offset-2 ${className ?? ""}`,
+      style: { textDecorationColor: t.color },
+      children: [
+        value,
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "span",
+          {
+            className: "ml-0.5 font-mono text-[10px]",
+            style: { color: t.color },
+            children: "?"
+          }
+        )
+      ]
+    }
+  ) : /* @__PURE__ */ jsxRuntime.jsxs("span", { className: `inline-flex cursor-help items-baseline gap-1 ${className ?? ""}`, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-medium", children: value }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "span",
+      {
+        className: "inline-block h-1.5 w-1.5 rounded-full align-middle",
+        style: { backgroundColor: t.color },
+        title: "reason available"
+      }
+    )
+  ] });
+  if (pinned) {
+    return /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex flex-col items-start gap-0.5 align-top", children: [
+      trigger,
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "span",
+        {
+          className: "block max-w-[280px] rounded border-l-2 pl-2 text-[11px] leading-snug text-zinc-600 dark:text-zinc-300",
+          style: { borderColor: t.color },
+          children: reason
+        }
+      )
+    ] });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(Popover, { hover: true, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(Popover.Trigger, { children: trigger }),
+    /* @__PURE__ */ jsxRuntime.jsx(Popover.Content, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-72 space-y-2 text-sm", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-baseline gap-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          "span",
+          {
+            className: "text-[10px] font-semibold uppercase tracking-wider",
+            style: { color: t.color },
+            children: [
+              t.label,
+              " confidence \xB7 ",
+              (confidence * 100).toFixed(0),
+              "%"
+            ]
+          }
+        ),
+        by && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "ml-auto font-mono text-[10px] text-zinc-400", children: [
+          "@",
+          by
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[13px] leading-snug text-zinc-700 dark:text-zinc-200", children: reason }),
+      sources.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-[10px] uppercase tracking-wider text-zinc-400", children: "sources" }),
+        /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "mt-0.5 space-y-0.5 text-[12px]", children: sources.map((s, i) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: s.href ? /* @__PURE__ */ jsxRuntime.jsx("a", { className: "text-violet-600 hover:underline", href: s.href, children: s.label }) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-zinc-600 dark:text-zinc-300", children: s.label }) }, i)) })
+      ] }),
+      onFollowUp && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex justify-end pt-1", children: /* @__PURE__ */ jsxRuntime.jsx(Action, { size: "sm", variant: "ghost", onClick: onFollowUp, children: "ask follow-up" }) })
+    ] }) })
+  ] });
+}
+function MoodMeter({
+  min,
+  max,
+  step,
+  value,
+  confidence,
+  onChange,
+  posted,
+  width = 320,
+  height = 220,
+  showGrid = true,
+  color = "#0ea5e9",
+  postedColor = "#a855f7",
+  prefix = "",
+  suffix = "",
+  formatValue,
+  className
+}) {
+  const ref = react.useRef(null);
+  const [dragging, setDragging] = react.useState(false);
+  const snapStep = step ?? (max - min) / 100;
+  const fmt = react.useCallback(
+    (v) => {
+      if (formatValue) return formatValue(v);
+      const num = snapStep < 1 ? v.toFixed(2) : Math.round(v).toString();
+      return `${prefix}${num}${suffix}`;
+    },
+    [formatValue, snapStep, prefix, suffix]
+  );
+  const set = react.useCallback(
+    (clientX, clientY) => {
+      const el = ref.current;
+      if (!el) return;
+      const rect = el.getBoundingClientRect();
+      const x = clamp((clientX - rect.left) / rect.width, 0, 1);
+      const y = clamp((clientY - rect.top) / rect.height, 0, 1);
+      const raw = min + x * (max - min);
+      const snapped = round(raw, snapStep, min);
+      const c = clamp(1 - y, 0, 1);
+      onChange(snapped, Math.round(c * 100) / 100);
+    },
+    [min, max, snapStep, onChange]
+  );
+  const onPointerDown = (e) => {
+    e.target.setPointerCapture?.(e.pointerId);
+    setDragging(true);
+    set(e.clientX, e.clientY);
+  };
+  const onPointerMove = (e) => {
+    if (!dragging) return;
+    set(e.clientX, e.clientY);
+  };
+  const onPointerUp = () => setDragging(false);
+  const xPct = (value - min) / (max - min) * 100;
+  const yPct = (1 - confidence) * 100;
+  const haloR = 18 + (1 - confidence) * 70;
+  const pxPct = posted ? (posted.value - min) / (max - min) * 100 : 0;
+  const pyPct = posted ? (1 - posted.confidence) * 100 : 0;
+  const pHaloR = posted ? 16 + (1 - posted.confidence) * 60 : 0;
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      ref,
+      onPointerDown,
+      onPointerMove,
+      onPointerUp,
+      onPointerCancel: onPointerUp,
+      className: `relative cursor-crosshair touch-none select-none overflow-hidden rounded-md border border-zinc-200 bg-zinc-50 dark:border-zinc-800 dark:bg-zinc-950 ${className ?? ""}`,
+      style: { width, height },
+      children: [
+        showGrid && /* @__PURE__ */ jsxRuntime.jsxs("svg", { className: "pointer-events-none absolute inset-0 h-full w-full", "aria-hidden": true, children: [
+          [0.25, 0.5, 0.75].map((p, i) => /* @__PURE__ */ jsxRuntime.jsx(
+            "line",
+            {
+              x1: `${p * 100}%`,
+              x2: `${p * 100}%`,
+              y1: "0",
+              y2: "100%",
+              stroke: "#a1a1aa",
+              strokeOpacity: 0.18,
+              strokeDasharray: "3 4"
+            },
+            `v${i}`
+          )),
+          [0.25, 0.5, 0.75].map((p, i) => /* @__PURE__ */ jsxRuntime.jsx(
+            "line",
+            {
+              x1: "0",
+              x2: "100%",
+              y1: `${p * 100}%`,
+              y2: `${p * 100}%`,
+              stroke: "#a1a1aa",
+              strokeOpacity: 0.18,
+              strokeDasharray: "3 4"
+            },
+            `h${i}`
+          ))
+        ] }),
+        showGrid && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "pointer-events-none absolute left-1.5 top-1.5 text-[10px] uppercase tracking-wider text-zinc-400", children: "\u2191 sure" }),
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "pointer-events-none absolute bottom-1.5 left-1.5 text-[10px] uppercase tracking-wider text-zinc-400", children: "\u2193 unsure" }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "pointer-events-none absolute right-1.5 top-1.5 text-[10px] uppercase tracking-wider text-zinc-400", children: [
+            fmt(max),
+            " \u2192"
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "pointer-events-none absolute bottom-1.5 right-1.5 text-[10px] uppercase tracking-wider text-zinc-400", children: [
+            "\u2190 ",
+            fmt(min)
+          ] })
+        ] }),
+        posted && /* @__PURE__ */ jsxRuntime.jsx(
+          Handle,
+          {
+            xPct: pxPct,
+            yPct: pyPct,
+            haloR: pHaloR,
+            color: postedColor,
+            dashed: true,
+            label: "agent"
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          Handle,
+          {
+            xPct,
+            yPct,
+            haloR,
+            color,
+            label: fmt(value)
+          }
+        )
+      ]
+    }
+  );
+}
+function Handle({
+  xPct,
+  yPct,
+  haloR,
+  color,
+  dashed = false,
+  label
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: "pointer-events-none absolute -translate-x-1/2 -translate-y-1/2 rounded-full",
+        style: {
+          left: `${xPct}%`,
+          top: `${yPct}%`,
+          width: haloR * 2,
+          height: haloR * 2,
+          background: color + (dashed ? "11" : "22"),
+          border: dashed ? `1px dashed ${color}` : "none"
+        }
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: "pointer-events-none absolute -translate-x-1/2 -translate-y-1/2 rounded-full ring-2 ring-white dark:ring-zinc-900",
+        style: {
+          left: `${xPct}%`,
+          top: `${yPct}%`,
+          width: 14,
+          height: 14,
+          background: color,
+          opacity: dashed ? 0.6 : 1
+        }
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: "pointer-events-none absolute -translate-x-1/2 rounded px-1.5 py-0.5 font-mono text-[10px]",
+        style: {
+          left: `${xPct}%`,
+          top: `calc(${yPct}% + 14px)`,
+          color
+        },
+        children: label
+      }
+    )
+  ] });
+}
+function clamp(n, lo, hi) {
+  return Math.max(lo, Math.min(hi, n));
+}
+function round(n, step, min) {
+  if (step >= 1) return Math.round(n);
+  return Math.round((n - min) / step) * step + min;
+}
+var DEFAULT_MENTION_COLOR = {
+  agent: "#a855f7",
+  file: "#10b981",
+  person: "#3b82f6"
+};
+function PromptInput({
+  budgetTokens,
+  commands = [],
+  mentions = [],
+  showHint = true,
+  onSubmit,
+  placeholder = "Ask anything. Type / for commands, @ for mentions. \u2318/Ctrl+Enter to send.",
+  charsPerToken = 4,
+  mentionColor,
+  maxHeight = 280,
+  aboveInput
+}) {
+  const [text, setText] = react.useState("");
+  const [attachments, setAttachments] = react.useState([]);
+  const [picker, setPicker] = react.useState(null);
+  const taRef = react.useRef(null);
+  const [dragOver, setDragOver] = react.useState(false);
+  const colors = mentionColor ?? DEFAULT_MENTION_COLOR;
+  const tokens = react.useMemo(
+    () => Math.ceil(text.length / Math.max(1, charsPerToken)),
+    [text, charsPerToken]
+  );
+  const ratio = Math.min(1, tokens / budgetTokens);
+  const meterColor = ratio < 0.6 ? "#10b981" : ratio < 0.85 ? "#f59e0b" : "#ef4444";
+  const filteredCmds = react.useMemo(
+    () => picker?.kind === "cmd" ? commands.filter(
+      (c) => c.name.slice(1).toLowerCase().startsWith(picker.query.toLowerCase())
+    ) : [],
+    [picker, commands]
+  );
+  const filteredMentions = react.useMemo(
+    () => picker?.kind === "mention" ? mentions.filter(
+      (m) => m.name.toLowerCase().includes(picker.query.toLowerCase())
+    ) : [],
+    [picker, mentions]
+  );
+  const items = picker?.kind === "cmd" ? filteredCmds : picker?.kind === "mention" ? filteredMentions : [];
+  react.useEffect(() => {
+    const ta = taRef.current;
+    if (!ta) return;
+    ta.style.height = "auto";
+    ta.style.height = Math.min(maxHeight, ta.scrollHeight) + "px";
+  }, [text, maxHeight]);
+  const updateText = (next, caret) => {
+    setText(next);
+    let triggerIdx = -1;
+    let triggerKind = null;
+    for (let i = caret - 1; i >= 0; i--) {
+      const ch = next[i];
+      if (ch === "@") {
+        triggerKind = "mention";
+        triggerIdx = i;
+        break;
+      }
+      if (ch === "/" && (i === 0 || /\s/.test(next[i - 1] ?? ""))) {
+        triggerKind = "cmd";
+        triggerIdx = i;
+        break;
+      }
+      if (/\s/.test(ch)) break;
+    }
+    if (triggerKind !== null && triggerIdx >= 0) {
+      const query = next.slice(triggerIdx + 1, caret);
+      setPicker({ kind: triggerKind, start: triggerIdx, query, cursor: 0 });
+    } else {
+      setPicker(null);
+    }
+  };
+  const insertChoice = (i) => {
+    if (!picker || items.length === 0) return;
+    const choice = items[i] ?? items[0];
+    const insert = picker.kind === "cmd" ? choice.name + " " : `@${choice.id} `;
+    const before = text.slice(0, picker.start);
+    const after = text.slice(picker.start + 1 + picker.query.length);
+    const next = before + insert + after;
+    setText(next);
+    setPicker(null);
+    requestAnimationFrame(() => {
+      const ta = taRef.current;
+      if (!ta) return;
+      ta.focus();
+      const pos = before.length + insert.length;
+      ta.setSelectionRange(pos, pos);
+    });
+  };
+  const submit = () => {
+    if (!text.trim() && attachments.length === 0) return;
+    onSubmit(text, attachments);
+    setText("");
+    setAttachments([]);
+    setPicker(null);
+  };
+  const onKeyDown = (e) => {
+    if (picker) {
+      if (e.key === "ArrowDown") {
+        e.preventDefault();
+        setPicker(
+          (p) => p ? { ...p, cursor: Math.min(items.length - 1, p.cursor + 1) } : p
+        );
+        return;
+      }
+      if (e.key === "ArrowUp") {
+        e.preventDefault();
+        setPicker((p) => p ? { ...p, cursor: Math.max(0, p.cursor - 1) } : p);
+        return;
+      }
+      if (e.key === "Enter" && !e.metaKey && !e.ctrlKey && items.length > 0) {
+        e.preventDefault();
+        insertChoice(picker.cursor);
+        return;
+      }
+      if (e.key === "Escape") {
+        e.preventDefault();
+        setPicker(null);
+        return;
+      }
+    }
+    if (e.key === "Enter" && (e.metaKey || e.ctrlKey)) {
+      e.preventDefault();
+      submit();
+    }
+  };
+  const onDrop = (e) => {
+    e.preventDefault();
+    setDragOver(false);
+    const files = Array.from(e.dataTransfer.files);
+    setAttachments((cur) => [
+      ...cur,
+      ...files.map((f) => ({
+        id: `${f.name}-${Date.now()}-${Math.random()}`,
+        name: f.name,
+        bytes: f.size
+      }))
+    ]);
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      onDragOver: (e) => {
+        e.preventDefault();
+        setDragOver(true);
+      },
+      onDragLeave: () => setDragOver(false),
+      onDrop,
+      className: `relative rounded-md border transition ${dragOver ? "border-violet-400 bg-violet-50/50 dark:border-violet-600 dark:bg-violet-950/30" : "border-zinc-200 dark:border-zinc-800"} bg-white dark:bg-zinc-900`,
+      children: [
+        aboveInput && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-b border-zinc-200 dark:border-zinc-800", children: aboveInput }),
+        attachments.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap gap-1.5 border-b border-zinc-200 px-3 py-2 dark:border-zinc-800", children: attachments.map((a) => /* @__PURE__ */ jsxRuntime.jsxs(
+          "span",
+          {
+            className: "inline-flex items-center gap-1.5 rounded-md bg-zinc-100 px-2 py-0.5 text-[11px] dark:bg-zinc-800",
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx("span", { children: "\u{1F4CE}" }),
+              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-mono", children: a.name }),
+              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-zinc-400", children: fmtSize(a.bytes) }),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "button",
+                {
+                  onClick: () => setAttachments((cur) => cur.filter((x) => x.id !== a.id)),
+                  className: "opacity-50 hover:opacity-100",
+                  "aria-label": "Remove attachment",
+                  children: "\xD7"
+                }
+              )
+            ]
+          },
+          a.id
+        )) }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "textarea",
+            {
+              ref: taRef,
+              value: text,
+              onChange: (e) => updateText(e.target.value, e.target.selectionStart),
+              onKeyDown,
+              placeholder,
+              spellCheck: false,
+              className: "block w-full resize-none bg-transparent px-3 py-2.5 text-[14px] leading-relaxed outline-none placeholder:text-zinc-400",
+              rows: 3
+            }
+          ),
+          picker && items.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "absolute bottom-full left-2 z-10 mb-1 w-72 overflow-hidden rounded-md border border-zinc-200 bg-white shadow-lg dark:border-zinc-700 dark:bg-zinc-900", children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border-b border-zinc-100 bg-zinc-50 px-2 py-1 text-[10px] font-semibold uppercase tracking-wider text-zinc-500 dark:border-zinc-800 dark:bg-zinc-950", children: [
+              picker.kind === "cmd" ? "Commands" : "Mention",
+              " \xB7 ",
+              items.length
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "max-h-56 overflow-y-auto", children: items.map((item, i) => {
+              const active = i === picker.cursor;
+              if (picker.kind === "cmd") {
+                const c = item;
+                return /* @__PURE__ */ jsxRuntime.jsxs(
+                  "li",
+                  {
+                    onMouseDown: (e) => {
+                      e.preventDefault();
+                      insertChoice(i);
+                    },
+                    onMouseEnter: () => setPicker((p) => p ? { ...p, cursor: i } : p),
+                    className: `cursor-pointer px-2 py-1.5 text-[12px] ${active ? "bg-violet-100 dark:bg-violet-900/30" : "hover:bg-zinc-50 dark:hover:bg-zinc-800"}`,
+                    children: [
+                      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "font-mono font-medium text-violet-700 dark:text-violet-300", children: c.name }),
+                      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-[11px] text-zinc-500", children: c.hint })
+                    ]
+                  },
+                  c.name
+                );
+              }
+              const m = item;
+              return /* @__PURE__ */ jsxRuntime.jsxs(
+                "li",
+                {
+                  onMouseDown: (e) => {
+                    e.preventDefault();
+                    insertChoice(i);
+                  },
+                  onMouseEnter: () => setPicker((p) => p ? { ...p, cursor: i } : p),
+                  className: `flex cursor-pointer items-center gap-2 px-2 py-1.5 text-[12px] ${active ? "bg-violet-100 dark:bg-violet-900/30" : "hover:bg-zinc-50 dark:hover:bg-zinc-800"}`,
+                  children: [
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      "span",
+                      {
+                        className: "h-2 w-2 rounded-full",
+                        style: { backgroundColor: colors[m.kind] ?? "#71717a" }
+                      }
+                    ),
+                    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-medium", children: m.name }),
+                    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-auto text-[10px] uppercase tracking-wider text-zinc-400", children: m.kind })
+                  ]
+                },
+                m.id
+              );
+            }) })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 border-t border-zinc-200 bg-zinc-50/60 px-3 py-2 dark:border-zinc-800 dark:bg-zinc-900/40", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(Tooltip, { content: "Drop files here, or click", children: /* @__PURE__ */ jsxRuntime.jsx(
+            Action,
+            {
+              variant: "ghost",
+              size: "sm",
+              onClick: () => {
+              },
+              children: "\u{1F4CE} attach"
+            }
+          ) }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ml-2 flex items-center gap-1.5", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-1.5 w-24 overflow-hidden rounded-full bg-zinc-200 dark:bg-zinc-700", children: /* @__PURE__ */ jsxRuntime.jsx(
+              "div",
+              {
+                className: "h-full rounded-full transition-all",
+                style: { width: `${ratio * 100}%`, backgroundColor: meterColor }
+              }
+            ) }),
+            /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "font-mono text-[11px]", style: { color: meterColor }, children: [
+              fmtTokens(tokens),
+              " / ",
+              fmtTokens(budgetTokens)
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ml-auto flex items-center gap-2", children: [
+            showHint && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "hidden text-[10px] text-zinc-500 sm:inline", children: [
+              /* @__PURE__ */ jsxRuntime.jsx("kbd", { className: "rounded border border-zinc-300 bg-zinc-50 px-1 py-0.5 font-mono text-[9px] text-zinc-700 dark:border-zinc-700 dark:bg-zinc-800 dark:text-zinc-300", children: "\u2318" }),
+              " ",
+              "+",
+              " ",
+              /* @__PURE__ */ jsxRuntime.jsx("kbd", { className: "rounded border border-zinc-300 bg-zinc-50 px-1 py-0.5 font-mono text-[9px] text-zinc-700 dark:border-zinc-700 dark:bg-zinc-800 dark:text-zinc-300", children: "Enter" }),
+              " ",
+              "to send"
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx(Action, { color: "violet", size: "sm", onClick: submit, children: "send \u2192" })
+          ] })
+        ] })
+      ]
+    }
+  );
+}
+function fmtTokens(n) {
+  if (n < 1e3) return `${n}`;
+  return `${(n / 1e3).toFixed(1)}k`;
+}
+function fmtSize(b) {
+  if (b < 1024) return `${b} B`;
+  if (b < 1024 * 1024) return `${(b / 1024).toFixed(0)} KB`;
+  return `${(b / 1024 / 1024).toFixed(1)} MB`;
+}
+function ChatDrawer({
+  tabs,
+  activeTabId,
+  onTabChange,
+  open = true,
+  onToggle,
+  children,
+  minBodyHeight = 140,
+  className
+}) {
+  const handleToggle = react.useCallback(() => {
+    onToggle?.(!open);
+  }, [onToggle, open]);
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5 px-2.5 py-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap items-center gap-1.5", children: tabs.map((tab, i) => {
+        const active = tab.id === activeTabId;
+        const number = tab.number === null ? null : tab.number ?? i + 1;
+        return /* @__PURE__ */ jsxRuntime.jsxs(
+          "button",
+          {
+            type: "button",
+            onClick: () => onTabChange(tab.id),
+            className: [
+              "group inline-flex items-center gap-1.5 rounded-full border px-2.5 py-1 text-[12px] font-medium transition",
+              active ? "border-violet-500 bg-violet-500 text-white" : "border-zinc-200 bg-transparent text-zinc-700 hover:border-zinc-300 hover:bg-zinc-50 dark:border-zinc-700 dark:text-zinc-300 dark:hover:border-zinc-600 dark:hover:bg-zinc-800"
+            ].join(" "),
+            "aria-pressed": active,
+            children: [
+              number !== null && /* @__PURE__ */ jsxRuntime.jsx(
+                "span",
+                {
+                  className: [
+                    "inline-flex h-4 w-4 items-center justify-center rounded-full text-[10px] font-semibold",
+                    active ? "bg-white/20 text-white" : "bg-zinc-200 text-zinc-600 group-hover:bg-zinc-300 dark:bg-zinc-700 dark:text-zinc-300"
+                  ].join(" "),
+                  children: number
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate max-w-[180px]", children: tab.label })
+            ]
+          },
+          tab.id
+        );
+      }) }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          type: "button",
+          onClick: handleToggle,
+          "aria-label": open ? "Collapse drawer" : "Expand drawer",
+          "aria-expanded": open,
+          className: "ml-auto inline-flex h-6 w-6 items-center justify-center rounded-full text-zinc-400 transition hover:bg-zinc-100 hover:text-zinc-700 dark:hover:bg-zinc-800 dark:hover:text-zinc-200",
+          children: /* @__PURE__ */ jsxRuntime.jsx(
+            Icon,
+            {
+              name: open ? "chevron-down" : "chevron-up",
+              className: "h-3.5 w-3.5"
+            }
+          )
+        }
+      )
+    ] }),
+    open && /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: "px-2.5 pb-2.5",
+        style: { minHeight: minBodyHeight },
+        children
+      }
+    )
+  ] });
+}
+function defaultKeyOf(item) {
+  if (item && typeof item === "object") {
+    const r = item;
+    if (typeof r.name === "string") return r.name;
+    if (typeof r.id === "string") return r.id;
+  }
+  return String(item);
+}
+function defaultFilter(item, query) {
+  if (!query) return true;
+  return defaultKeyOf(item).toLowerCase().includes(query.toLowerCase());
+}
+function detectTrigger(text, caret, triggerChars) {
+  for (let i = caret - 1; i >= 0; i--) {
+    const ch = text[i];
+    if (ch === void 0) break;
+    if (triggerChars.has(ch)) {
+      if (i === 0 || /\s/.test(text[i - 1])) {
+        return {
+          char: ch,
+          start: i,
+          end: caret,
+          query: text.slice(i + 1, caret)
+        };
+      }
+      return null;
+    }
+    if (/\s/.test(ch)) return null;
+  }
+  return null;
+}
+function InputTag({
+  adapter,
+  triggers,
+  maxItems = 8,
+  placement = "bottom-left",
+  className,
+  style,
+  onPick
+}) {
+  const triggerChars = react.useMemo(() => new Set(Object.keys(triggers)), [triggers]);
+  const [active, setActive] = react.useState(null);
+  const [cursor, setCursor] = react.useState(0);
+  const [anchorRect, setAnchorRect] = react.useState(null);
+  const stateRef = react.useRef({ text: "", caretIndex: 0 });
+  const activeRef = react.useRef(null);
+  const cursorRef = react.useRef(0);
+  activeRef.current = active;
+  cursorRef.current = cursor;
+  const items = react.useMemo(() => {
+    if (!active) return [];
+    const cfg2 = triggers[active.char];
+    if (!cfg2) return [];
+    const filter = cfg2.filter ?? defaultFilter;
+    const out = [];
+    for (const item of cfg2.items) {
+      if (filter(item, active.query)) out.push(item);
+      if (out.length >= maxItems) break;
+    }
+    return out;
+  }, [active, triggers, maxItems]);
+  react.useEffect(() => {
+    return adapter.subscribe((s) => {
+      stateRef.current = s;
+      const next = detectTrigger(s.text, s.caretIndex, triggerChars);
+      setActive((prev) => {
+        if (!prev || !next || prev.char !== next.char || prev.start !== next.start) {
+          setCursor(0);
+        }
+        return next;
+      });
+      if (next) setAnchorRect(adapter.getAnchorRect());
+    });
+  }, [adapter, triggerChars]);
+  react.useLayoutEffect(() => {
+    if (!active) return;
+    const update = () => setAnchorRect(adapter.getAnchorRect());
+    update();
+    window.addEventListener("scroll", update, true);
+    window.addEventListener("resize", update);
+    return () => {
+      window.removeEventListener("scroll", update, true);
+      window.removeEventListener("resize", update);
+    };
+  }, [active, adapter]);
+  react.useEffect(() => {
+    if (cursor >= items.length) setCursor(Math.max(0, items.length - 1));
+  }, [items.length, cursor]);
+  const pickItem = react.useCallback(
+    (item) => {
+      const cur = activeRef.current;
+      if (!cur) return;
+      const cfg2 = triggers[cur.char];
+      if (!cfg2) return;
+      const replacement = cfg2.insert(item, cur.query);
+      adapter.replaceRange(cur.start, cur.end, replacement);
+      onPick?.({ triggerChar: cur.char, query: cur.query, item });
+      setActive(null);
+    },
+    [adapter, triggers, onPick]
+  );
+  react.useEffect(() => {
+    return adapter.onKey((e) => {
+      const cur = activeRef.current;
+      if (!cur) return false;
+      const visible = items;
+      switch (e.key) {
+        case "ArrowDown":
+          if (visible.length === 0) return false;
+          setCursor((c) => (c + 1) % visible.length);
+          return true;
+        case "ArrowUp":
+          if (visible.length === 0) return false;
+          setCursor((c) => (c - 1 + visible.length) % visible.length);
+          return true;
+        case "Enter":
+        case "Tab": {
+          if (visible.length === 0) return false;
+          const idx = Math.min(cursorRef.current, visible.length - 1);
+          pickItem(visible[idx]);
+          return true;
+        }
+        case "Escape":
+          setActive(null);
+          return true;
+        default:
+          return false;
+      }
+    });
+  }, [adapter, items, pickItem]);
+  if (!active || !anchorRect || items.length === 0) return null;
+  const cfg = triggers[active.char];
+  if (!cfg) return null;
+  const popStyle = computePopoverStyle(anchorRect, placement);
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      role: "listbox",
+      "aria-label": cfg.label ?? `Pick a ${active.char === "/" ? "command" : "mention"}`,
+      className: [
+        "fixed z-50 w-72 overflow-hidden rounded-md border border-zinc-200 bg-white shadow-lg dark:border-zinc-700 dark:bg-zinc-900",
+        className ?? ""
+      ].filter(Boolean).join(" "),
+      style: { ...popStyle, ...style },
+      children: [
+        (cfg.label || active.query) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between border-b border-zinc-100 bg-zinc-50 px-2 py-1 text-[10px] font-semibold uppercase tracking-wider text-zinc-500 dark:border-zinc-800 dark:bg-zinc-950", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("span", { children: cfg.label ?? labelForChar(active.char) }),
+          active.query && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "font-mono text-[10px] normal-case tracking-normal text-zinc-400", children: [
+            active.char,
+            active.query
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "max-h-60 overflow-y-auto", children: items.map((item, i) => {
+          const renderer = cfg.render ?? ((it) => /* @__PURE__ */ jsxRuntime.jsx("span", { children: defaultKeyOf(it) }));
+          const active2 = i === cursor;
+          const key = (cfg.keyOf ?? defaultKeyOf)(item);
+          return /* @__PURE__ */ jsxRuntime.jsx(
+            "li",
+            {
+              role: "option",
+              "aria-selected": active2,
+              onMouseDown: (e) => {
+                e.preventDefault();
+                pickItem(item);
+              },
+              onMouseEnter: () => setCursor(i),
+              className: [
+                "cursor-pointer px-2 py-1.5 text-[12px]",
+                active2 ? "bg-violet-100 dark:bg-violet-900/30" : "hover:bg-zinc-50 dark:hover:bg-zinc-800"
+              ].join(" "),
+              children: renderer(item, active2)
+            },
+            key
+          );
+        }) })
+      ]
+    }
+  );
+}
+function labelForChar(ch) {
+  if (ch === "/") return "Commands";
+  if (ch === "@") return "Mentions";
+  if (ch === "#") return "Tags";
+  if (ch === ":") return "Emoji";
+  return `Trigger ${ch}`;
+}
+function computePopoverStyle(anchor, placement) {
+  const offset = 4;
+  switch (placement) {
+    case "bottom-right":
+      return { top: anchor.bottom + offset, right: window.innerWidth - anchor.right };
+    case "top-left":
+      return { bottom: window.innerHeight - anchor.top + offset, left: anchor.left };
+    case "top-right":
+      return { bottom: window.innerHeight - anchor.top + offset, right: window.innerWidth - anchor.right };
+    case "bottom-left":
+    default:
+      return { top: anchor.bottom + offset, left: anchor.left };
+  }
+}
+
+// src/components/InputTag/adapters.ts
+function nativeValueSetter(el) {
+  const proto = el instanceof HTMLTextAreaElement ? HTMLTextAreaElement.prototype : HTMLInputElement.prototype;
+  const desc = Object.getOwnPropertyDescriptor(proto, "value");
+  if (!desc?.set) return null;
+  return desc.set.bind(el);
+}
+function replaceInValueElement(el, start, end, replacement) {
+  const current = el.value;
+  const next = current.slice(0, start) + replacement + current.slice(end);
+  const setter = nativeValueSetter(el);
+  if (setter) {
+    setter(next);
+  } else {
+    el.value = next;
+  }
+  el.dispatchEvent(new Event("input", { bubbles: true }));
+  const caret = start + replacement.length;
+  el.setSelectionRange(caret, caret);
+  el.focus();
+}
+function valueElementAdapter(ref) {
+  return {
+    subscribe(fn) {
+      const handler = () => {
+        const el2 = ref.current;
+        if (!el2) return;
+        fn({
+          text: el2.value,
+          caretIndex: el2.selectionStart ?? el2.value.length
+        });
+      };
+      const el = ref.current;
+      if (el) {
+        el.addEventListener("input", handler);
+        el.addEventListener("click", handler);
+        el.addEventListener("keyup", handler);
+        el.addEventListener("focus", handler);
+      }
+      return () => {
+        const el2 = ref.current;
+        if (el2) {
+          el2.removeEventListener("input", handler);
+          el2.removeEventListener("click", handler);
+          el2.removeEventListener("keyup", handler);
+          el2.removeEventListener("focus", handler);
+        }
+      };
+    },
+    replaceRange(start, end, replacement) {
+      const el = ref.current;
+      if (!el) return;
+      replaceInValueElement(el, start, end, replacement);
+    },
+    getAnchorRect() {
+      const el = ref.current;
+      return el ? el.getBoundingClientRect() : null;
+    },
+    onKey(handler) {
+      const fn = (e) => {
+        if (handler(e)) {
+          e.preventDefault();
+          e.stopPropagation();
+        }
+      };
+      const el = ref.current;
+      if (el) el.addEventListener("keydown", fn);
+      return () => {
+        const el2 = ref.current;
+        if (el2) el2.removeEventListener("keydown", fn);
+      };
+    }
+  };
+}
+function textareaAdapter(ref) {
+  return valueElementAdapter(ref);
+}
+function inputAdapter(ref) {
+  return valueElementAdapter(ref);
+}
+function contentEditableAdapter(ref) {
+  function caretIndex(el) {
+    const sel = window.getSelection();
+    if (!sel || sel.rangeCount === 0) return 0;
+    const range2 = sel.getRangeAt(0).cloneRange();
+    range2.selectNodeContents(el);
+    range2.setEnd(sel.focusNode, sel.focusOffset);
+    return range2.toString().length;
+  }
+  function setCaret(el, index) {
+    const sel = window.getSelection();
+    if (!sel) return;
+    const walker = document.createTreeWalker(el, NodeFilter.SHOW_TEXT);
+    let remaining = index;
+    let node = walker.nextNode();
+    while (node) {
+      const len = (node.textContent ?? "").length;
+      if (remaining <= len) {
+        const range3 = document.createRange();
+        range3.setStart(node, remaining);
+        range3.collapse(true);
+        sel.removeAllRanges();
+        sel.addRange(range3);
+        return;
+      }
+      remaining -= len;
+      node = walker.nextNode();
+    }
+    const range2 = document.createRange();
+    range2.selectNodeContents(el);
+    range2.collapse(false);
+    sel.removeAllRanges();
+    sel.addRange(range2);
+  }
+  return {
+    subscribe(fn) {
+      const handler = () => {
+        const el2 = ref.current;
+        if (!el2) return;
+        fn({ text: el2.textContent ?? "", caretIndex: caretIndex(el2) });
+      };
+      const el = ref.current;
+      if (el) {
+        el.addEventListener("input", handler);
+        el.addEventListener("click", handler);
+        el.addEventListener("keyup", handler);
+        el.addEventListener("focus", handler);
+      }
+      return () => {
+        const el2 = ref.current;
+        if (el2) {
+          el2.removeEventListener("input", handler);
+          el2.removeEventListener("click", handler);
+          el2.removeEventListener("keyup", handler);
+          el2.removeEventListener("focus", handler);
+        }
+      };
+    },
+    replaceRange(start, end, replacement) {
+      const el = ref.current;
+      if (!el) return;
+      const current = el.textContent ?? "";
+      const next = current.slice(0, start) + replacement + current.slice(end);
+      el.textContent = next;
+      setCaret(el, start + replacement.length);
+      el.dispatchEvent(new Event("input", { bubbles: true }));
+      el.focus();
+    },
+    getAnchorRect() {
+      const el = ref.current;
+      return el ? el.getBoundingClientRect() : null;
+    },
+    onKey(handler) {
+      const fn = (e) => {
+        if (handler(e)) {
+          e.preventDefault();
+          e.stopPropagation();
+        }
+      };
+      const el = ref.current;
+      if (el) el.addEventListener("keydown", fn);
+      return () => {
+        const el2 = ref.current;
+        if (el2) el2.removeEventListener("keydown", fn);
+      };
+    }
+  };
+}
+function controlledAdapter(opts) {
+  let listener = null;
+  let keyHandler = null;
+  const installKey = () => {
+    const el = opts.anchorRef.current;
+    if (!el || !keyHandler) return () => {
+    };
+    const fn = (e) => {
+      if (keyHandler && keyHandler(e)) {
+        e.preventDefault();
+        e.stopPropagation();
+      }
+    };
+    el.addEventListener("keydown", fn);
+    return () => el.removeEventListener("keydown", fn);
+  };
+  return {
+    notify(state) {
+      listener?.(state);
+    },
+    subscribe(fn) {
+      listener = fn;
+      return () => {
+        if (listener === fn) listener = null;
+      };
+    },
+    replaceRange(start, end, replacement) {
+      opts.onReplaceRange(start, end, replacement);
+    },
+    getAnchorRect() {
+      const el = opts.anchorRef.current;
+      return el ? el.getBoundingClientRect() : null;
+    },
+    onKey(handler) {
+      keyHandler = handler;
+      const uninstall = installKey();
+      return () => {
+        if (keyHandler === handler) keyHandler = null;
+        uninstall();
+      };
+    }
+  };
+}
+function MagicWand({
+  value,
+  onValueChange,
+  actions,
+  appearance = "floating",
+  autoHide = true,
+  rows = 6,
+  placeholder,
+  onAction
+}) {
+  const taRef = react.useRef(null);
+  const wandRef = react.useRef(null);
+  const [sel, setSel] = react.useState(null);
+  const [pos, setPos] = react.useState(null);
+  const [busy, setBusy] = react.useState(null);
+  const measureSelection = react.useCallback(() => {
+    const ta = taRef.current;
+    if (!ta) return;
+    const start = ta.selectionStart ?? 0;
+    const end = ta.selectionEnd ?? 0;
+    if (start === end) {
+      setSel(null);
+      setPos(null);
+      return;
+    }
+    const text = ta.value.slice(start, end);
+    setSel({ start, end, text });
+    const rect = caretRect(ta, start, end);
+    if (rect) setPos({ x: rect.x, y: rect.y });
+  }, []);
+  react.useEffect(() => {
+    if (!autoHide) return;
+    const onScroll = () => {
+      setSel(null);
+      setPos(null);
+    };
+    window.addEventListener("scroll", onScroll, true);
+    return () => window.removeEventListener("scroll", onScroll, true);
+  }, [autoHide]);
+  react.useEffect(() => {
+    if (!autoHide) return;
+    const onDocMouseDown = (e) => {
+      if (wandRef.current?.contains(e.target)) return;
+      if (taRef.current?.contains(e.target)) return;
+      setSel(null);
+      setPos(null);
+    };
+    document.addEventListener("mousedown", onDocMouseDown);
+    return () => document.removeEventListener("mousedown", onDocMouseDown);
+  }, [autoHide]);
+  const handleAction = async (action) => {
+    if (!sel) return;
+    setBusy(action.id);
+    try {
+      const replacement = await action.run(sel.text, sel);
+      const next = value.slice(0, sel.start) + replacement + value.slice(sel.end);
+      onValueChange(next);
+      onAction?.(action, sel, replacement);
+    } finally {
+      setBusy(null);
+      setSel(null);
+      setPos(null);
+    }
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      Textarea,
+      {
+        ref: taRef,
+        value,
+        onValueChange,
+        onSelect: measureSelection,
+        onKeyUp: measureSelection,
+        onMouseUp: measureSelection,
+        rows,
+        placeholder
+      }
+    ),
+    sel && pos && /* @__PURE__ */ jsxRuntime.jsx(
+      Wand,
+      {
+        ref: wandRef,
+        pos,
+        actions,
+        appearance,
+        busy,
+        onAction: handleAction,
+        selectionLength: sel.text.length
+      }
+    )
+  ] });
+}
+function Wand({
+  ref,
+  pos,
+  actions,
+  appearance,
+  busy,
+  onAction,
+  selectionLength
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      ref,
+      className: "absolute z-20 -translate-x-1/2 -translate-y-full",
+      style: { left: pos.x, top: pos.y - 6 },
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1 rounded-full border border-violet-300 bg-white px-1.5 py-1 shadow-lg ring-1 ring-violet-200 dark:border-violet-700 dark:bg-zinc-900 dark:ring-violet-900", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "ml-1 mr-0.5 inline-flex items-center gap-1 text-[10px] font-medium text-violet-700 dark:text-violet-300", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": true, children: "\u2726" }),
+            appearance === "floating" && /* @__PURE__ */ jsxRuntime.jsxs(Badge, { color: "violet", children: [
+              selectionLength,
+              " chars"
+            ] })
+          ] }),
+          actions.map((a) => /* @__PURE__ */ jsxRuntime.jsxs(
+            Action,
+            {
+              size: "sm",
+              variant: "ghost",
+              onClick: () => onAction(a),
+              disabled: busy !== null,
+              title: a.hint,
+              children: [
+                busy === a.id ? "\u2026" : appearance === "pill" ? a.label[0] : a.label,
+                appearance === "floating" && a.tag && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-1 rounded-full bg-zinc-100 px-1 text-[9px] font-medium text-zinc-500 dark:bg-zinc-800", children: a.tag })
+              ]
+            },
+            a.id
+          ))
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute left-1/2 top-full -translate-x-1/2 -translate-y-px", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-2 w-2 rotate-45 border-b border-r border-violet-300 bg-white dark:border-violet-700 dark:bg-zinc-900" }) })
+      ]
+    }
+  );
+}
+function caretRect(ta, start, end) {
+  const div = document.createElement("div");
+  const style = getComputedStyle(ta);
+  const props = [
+    "boxSizing",
+    "width",
+    "height",
+    "overflowX",
+    "overflowY",
+    "borderTopWidth",
+    "borderRightWidth",
+    "borderBottomWidth",
+    "borderLeftWidth",
+    "paddingTop",
+    "paddingRight",
+    "paddingBottom",
+    "paddingLeft",
+    "fontStyle",
+    "fontVariant",
+    "fontWeight",
+    "fontStretch",
+    "fontSize",
+    "fontSizeAdjust",
+    "lineHeight",
+    "fontFamily",
+    "textAlign",
+    "textTransform",
+    "textIndent",
+    "letterSpacing",
+    "wordSpacing",
+    "tabSize"
+  ];
+  for (const p of props) div.style[p] = style[p];
+  div.style.position = "absolute";
+  div.style.top = "-9999px";
+  div.style.left = "-9999px";
+  div.style.whiteSpace = "pre-wrap";
+  div.style.wordWrap = "break-word";
+  const value = ta.value;
+  div.textContent = value.substring(0, start);
+  const startSpan = document.createElement("span");
+  startSpan.textContent = value.substring(start, end) || ".";
+  div.appendChild(startSpan);
+  document.body.appendChild(div);
+  const taRect = ta.getBoundingClientRect();
+  const parentRect = ta.offsetParent?.getBoundingClientRect() ?? taRect;
+  const spanRect = startSpan.getBoundingClientRect();
+  const divRect = div.getBoundingClientRect();
+  const offsetX = spanRect.left - divRect.left;
+  const offsetY = spanRect.top - divRect.top;
+  document.body.removeChild(div);
+  const x = taRect.left - parentRect.left + offsetX + spanRect.width / 2;
+  const y = taRect.top - parentRect.top + offsetY - ta.scrollTop;
+  return { x, y };
+}
 
 exports.Accordion = Accordion;
 exports.AccordionPanel = AccordionPanel;
@@ -11857,6 +13128,7 @@ exports.Callout = Callout;
 exports.Card = Card;
 exports.Carousel = Carousel;
 exports.Chart = Chart;
+exports.ChatDrawer = ChatDrawer;
 exports.Checkbox = Checkbox;
 exports.CheckboxGroup = CheckboxGroup;
 exports.ColorPicker = ColorPicker;
@@ -11877,10 +13149,13 @@ exports.FileUpload = FileUpload;
 exports.Heading = Heading;
 exports.Icon = Icon;
 exports.Input = Input;
+exports.InputTag = InputTag;
 exports.Kanban = Kanban;
+exports.MagicWand = MagicWand;
 exports.Menu = Menu2;
 exports.MobileMenu = MobileMenu;
 exports.Modal = Modal;
+exports.MoodMeter = MoodMeter;
 exports.MultiSwitch = MultiSwitch;
 exports.Navbar = Navbar;
 exports.OtpInput = OtpInput;
@@ -11890,7 +13165,9 @@ exports.Popover = Popover;
 exports.Portal = Portal;
 exports.Profile = Profile;
 exports.Progress = Progress;
+exports.PromptInput = PromptInput;
 exports.RadioGroup = RadioGroup;
+exports.ReasonTag = ReasonTag;
 exports.SKIN_TONES = SKIN_TONES;
 exports.Select = Select;
 exports.Separator = Separator;
@@ -11910,8 +13187,11 @@ exports.TreeNav = TreeNav;
 exports.applyTone = applyTone;
 exports.cn = cn;
 exports.configureIcons = configureIcons;
+exports.contentEditableAdapter = contentEditableAdapter;
+exports.controlledAdapter = controlledAdapter;
 exports.find = find;
 exports.hasSkinTones = hasSkinTones;
+exports.inputAdapter = inputAdapter;
 exports.registerExtension = registerExtension;
 exports.registerExtensions = registerExtensions;
 exports.registerIconSet = registerIconSet;
@@ -11921,6 +13201,7 @@ exports.sanitizeHref = sanitizeHref;
 exports.sanitizeHtml = sanitizeHtml;
 exports.search = search;
 exports.skinTones = skinTones;
+exports.textareaAdapter = textareaAdapter;
 exports.useAccordion = useAccordion;
 exports.useAccordionPanel = useAccordionPanel;
 exports.useAccordionSection = useAccordionSection;