@timbal-ai/timbal-react 0.5.4 → 0.6.0

package/dist/chunk-YJQLLFKP.esm.js

@@ -0,0 +1,3672 @@
+import {
+  Avatar,
+  AvatarFallback,
+  AvatarImage,
+  Button,
+  Dialog,
+  DialogContent,
+  DialogTitle,
+  DialogTrigger,
+  Shimmer,
+  TIMBAL_V2_ELEVATED_GRADIENT,
+  TIMBAL_V2_SECONDARY_CHROME,
+  TIMBAL_V2_SWITCH_THUMB,
+  TIMBAL_V2_SWITCH_TRACK_OFF,
+  TimbalV2Button,
+  Tooltip,
+  TooltipContent,
+  TooltipProvider,
+  TooltipTrigger,
+  cn
+} from "./chunk-4TCJQSIX.esm.js";
+
+// src/chat/tooltip-icon-button.tsx
+import { forwardRef } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var TooltipIconButton = forwardRef(function TooltipIconButton2({ tooltip, side = "bottom", variant = "secondary", children, ...props }, ref) {
+  return /* @__PURE__ */ jsxs(Tooltip, { children: [
+    /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(TimbalV2Button, { ref, variant, size: "sm", isIconOnly: true, ...props, children: [
+      children,
+      /* @__PURE__ */ jsx("span", { className: "sr-only", children: tooltip })
+    ] }) }),
+    /* @__PURE__ */ jsx(TooltipContent, { side, children: tooltip })
+  ] });
+});
+
+// src/chat/attachment.tsx
+import { useEffect, useState } from "react";
+import { XIcon, PlusIcon, FileText } from "lucide-react";
+import {
+  AttachmentPrimitive,
+  ComposerPrimitive,
+  MessagePrimitive,
+  useAuiState,
+  useAui
+} from "@assistant-ui/react";
+import { useShallow } from "zustand/shallow";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var useFileSrc = (file) => {
+  const [src, setSrc] = useState(void 0);
+  useEffect(() => {
+    if (!file) {
+      setSrc(void 0);
+      return;
+    }
+    const objectUrl = URL.createObjectURL(file);
+    setSrc(objectUrl);
+    return () => {
+      URL.revokeObjectURL(objectUrl);
+    };
+  }, [file]);
+  return src;
+};
+var useAttachmentSrc = () => {
+  const { file, src } = useAuiState(
+    useShallow((s) => {
+      if (s.attachment.type !== "image") return {};
+      if (s.attachment.file) return { file: s.attachment.file };
+      const src2 = s.attachment.content?.filter((c) => c.type === "image")[0]?.image;
+      if (!src2) return {};
+      return { src: src2 };
+    })
+  );
+  return useFileSrc(file) ?? src;
+};
+var AttachmentPreview = ({ src }) => {
+  const [isLoaded, setIsLoaded] = useState(false);
+  return /* @__PURE__ */ jsx2(
+    "img",
+    {
+      src,
+      alt: "Image Preview",
+      className: cn(
+        "block h-auto max-h-[80vh] w-auto max-w-full object-contain",
+        isLoaded ? "aui-attachment-preview-image-loaded" : "aui-attachment-preview-image-loading invisible"
+      ),
+      onLoad: () => setIsLoaded(true)
+    }
+  );
+};
+var AttachmentPreviewDialog = ({ children }) => {
+  const src = useAttachmentSrc();
+  if (!src) return children;
+  return /* @__PURE__ */ jsxs2(Dialog, { children: [
+    /* @__PURE__ */ jsx2(
+      DialogTrigger,
+      {
+        className: "aui-attachment-preview-trigger cursor-pointer transition-colors hover:bg-accent/50",
+        asChild: true,
+        children
+      }
+    ),
+    /* @__PURE__ */ jsxs2(DialogContent, { className: "aui-attachment-preview-dialog-content p-2 sm:max-w-3xl [&>button]:rounded-full [&>button]:bg-foreground/60 [&>button]:p-1 [&>button]:opacity-100 [&>button]:ring-0! [&_svg]:text-background [&>button]:hover:[&_svg]:text-destructive", children: [
+      /* @__PURE__ */ jsx2(DialogTitle, { className: "aui-sr-only sr-only", children: "Image Attachment Preview" }),
+      /* @__PURE__ */ jsx2("div", { className: "aui-attachment-preview relative mx-auto flex max-h-[80dvh] w-full items-center justify-center overflow-hidden bg-background", children: /* @__PURE__ */ jsx2(AttachmentPreview, { src }) })
+    ] })
+  ] });
+};
+var AttachmentThumb = () => {
+  const isImage = useAuiState((s) => s.attachment.type === "image");
+  const src = useAttachmentSrc();
+  return /* @__PURE__ */ jsxs2(Avatar, { className: "aui-attachment-tile-avatar h-full w-full rounded-none", children: [
+    /* @__PURE__ */ jsx2(
+      AvatarImage,
+      {
+        src,
+        alt: "Attachment preview",
+        className: "aui-attachment-tile-image object-cover"
+      }
+    ),
+    /* @__PURE__ */ jsx2(AvatarFallback, { delayMs: isImage ? 200 : 0, children: /* @__PURE__ */ jsx2(FileText, { className: "aui-attachment-tile-fallback-icon size-8 text-muted-foreground" }) })
+  ] });
+};
+var AttachmentUI = () => {
+  const aui = useAui();
+  const isComposer = aui.attachment.source === "composer";
+  const isImage = useAuiState((s) => s.attachment.type === "image");
+  const typeLabel = useAuiState((s) => {
+    const type = s.attachment.type;
+    switch (type) {
+      case "image":
+        return "Image";
+      case "document":
+        return "Document";
+      case "file":
+        return "File";
+      default:
+        throw new Error(`Unknown attachment type: ${type}`);
+    }
+  });
+  return /* @__PURE__ */ jsxs2(Tooltip, { children: [
+    /* @__PURE__ */ jsxs2(
+      AttachmentPrimitive.Root,
+      {
+        className: cn(
+          "aui-attachment-root relative",
+          isImage && "aui-attachment-root-composer only:[&>#attachment-tile]:size-24"
+        ),
+        children: [
+          /* @__PURE__ */ jsx2(AttachmentPreviewDialog, { children: /* @__PURE__ */ jsx2(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx2(
+            "div",
+            {
+              className: cn(
+                "aui-attachment-tile size-14 cursor-pointer overflow-hidden rounded-[14px] border bg-muted transition-opacity hover:opacity-75",
+                isComposer && "aui-attachment-tile-composer border-foreground/20"
+              ),
+              role: "button",
+              id: "attachment-tile",
+              "aria-label": `${typeLabel} attachment`,
+              children: /* @__PURE__ */ jsx2(AttachmentThumb, {})
+            }
+          ) }) }),
+          isComposer && /* @__PURE__ */ jsx2(AttachmentRemove, {})
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx2(TooltipContent, { side: "top", children: /* @__PURE__ */ jsx2(AttachmentPrimitive.Name, {}) })
+  ] });
+};
+var AttachmentRemove = () => {
+  return /* @__PURE__ */ jsx2(AttachmentPrimitive.Remove, { asChild: true, children: /* @__PURE__ */ jsx2(
+    TooltipIconButton,
+    {
+      tooltip: "Remove file",
+      className: "aui-attachment-tile-remove absolute top-1.5 right-1.5 size-3.5 rounded-full bg-card text-foreground opacity-100 shadow-card hover:bg-card! [&_svg]:text-foreground hover:[&_svg]:text-destructive",
+      side: "top",
+      children: /* @__PURE__ */ jsx2(XIcon, { className: "aui-attachment-remove-icon size-3" })
+    }
+  ) });
+};
+var UserMessageAttachments = () => {
+  return /* @__PURE__ */ jsx2("div", { className: "aui-user-message-attachments-end col-span-full col-start-1 row-start-1 flex w-full flex-row justify-end gap-2", children: /* @__PURE__ */ jsx2(MessagePrimitive.Attachments, { components: { Attachment: AttachmentUI } }) });
+};
+var ComposerAttachments = () => {
+  return /* @__PURE__ */ jsx2("div", { className: "aui-composer-attachments mb-2 flex w-full flex-row items-center gap-2 overflow-x-auto px-1.5 pt-0.5 pb-1 empty:hidden", children: /* @__PURE__ */ jsx2(
+    ComposerPrimitive.Attachments,
+    {
+      components: { Attachment: AttachmentUI }
+    }
+  ) });
+};
+var ComposerAddAttachment = () => {
+  return /* @__PURE__ */ jsx2(ComposerPrimitive.AddAttachment, { asChild: true, children: /* @__PURE__ */ jsx2(
+    TooltipIconButton,
+    {
+      tooltip: "Add Attachment",
+      side: "bottom",
+      variant: "secondary",
+      className: "aui-composer-add-attachment shrink-0 text-muted-foreground",
+      "aria-label": "Add Attachment",
+      children: /* @__PURE__ */ jsx2(PlusIcon, { className: "aui-attachment-add-icon size-4 stroke-[1.5]" })
+    }
+  ) });
+};
+
+// src/artifacts/artifact-card.tsx
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+var ArtifactCard = ({ title, kind, className, bodyClassName, toolbar, children }) => {
+  const hasHeader = Boolean(title || toolbar);
+  return /* @__PURE__ */ jsxs3(
+    "div",
+    {
+      className: cn(
+        "aui-artifact-root my-3 overflow-hidden rounded-xl border border-border/60 bg-background shadow-sm",
+        className
+      ),
+      "data-artifact-kind": kind,
+      children: [
+        hasHeader && /* @__PURE__ */ jsxs3("div", { className: "aui-artifact-header flex items-center gap-2 border-b border-border/40 bg-muted/30 px-3 py-1.5", children: [
+          title && /* @__PURE__ */ jsx3("span", { className: "aui-artifact-title flex-1 truncate text-xs font-semibold text-foreground/80", children: title }),
+          !title && /* @__PURE__ */ jsx3("span", { className: "flex-1" }),
+          toolbar
+        ] }),
+        /* @__PURE__ */ jsx3("div", { className: cn("aui-artifact-body", bodyClassName), children })
+      ]
+    }
+  );
+};
+
+// src/artifacts/chart-artifact.tsx
+import { useMemo } from "react";
+import { Fragment, jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+var ChartArtifactView = ({
+  artifact
+}) => {
+  const { type: _t, chartType = "bar", data = [] } = artifact;
+  const xKey = artifact.xKey ?? inferXKey(data);
+  const dataKeys = useMemo(() => {
+    if (Array.isArray(artifact.dataKey)) return artifact.dataKey;
+    if (typeof artifact.dataKey === "string") return [artifact.dataKey];
+    return inferDataKeys(data, xKey);
+  }, [artifact.dataKey, data, xKey]);
+  return /* @__PURE__ */ jsx4(ArtifactCard, { title: artifact.title, kind: "chart", children: /* @__PURE__ */ jsxs4("div", { className: "aui-artifact-chart p-3", children: [
+    /* @__PURE__ */ jsx4(
+      ChartSvg,
+      {
+        chartType,
+        data,
+        xKey,
+        dataKeys,
+        unit: artifact.unit
+      }
+    ),
+    dataKeys.length > 1 && /* @__PURE__ */ jsx4(Legend, { dataKeys })
+  ] }) });
+};
+var COLORS = [
+  "var(--primary, #6366f1)",
+  "#22c55e",
+  "#f59e0b",
+  "#ef4444",
+  "#06b6d4",
+  "#a855f7"
+];
+var W = 600;
+var H = 240;
+var PAD = { top: 12, right: 16, bottom: 28, left: 36 };
+var ChartSvg = ({ chartType, data, xKey, dataKeys, unit }) => {
+  if (data.length === 0 || dataKeys.length === 0) {
+    return /* @__PURE__ */ jsx4(EmptyState, {});
+  }
+  if (chartType === "pie") {
+    return /* @__PURE__ */ jsx4(PieChart, { data, xKey, dataKey: dataKeys[0] });
+  }
+  const innerW = W - PAD.left - PAD.right;
+  const innerH = H - PAD.top - PAD.bottom;
+  const all = dataKeys.flatMap((k) => data.map((d) => toNum(d[k])));
+  const maxV = Math.max(0, ...all);
+  const minV = Math.min(0, ...all);
+  const range = maxV - minV || 1;
+  const yScale = (v) => PAD.top + innerH - (v - minV) / range * innerH;
+  const xCount = data.length;
+  const xStep = xCount > 1 ? innerW / (xCount - 1) : innerW;
+  const xPos = (i) => chartType === "bar" ? PAD.left + innerW * (i + 0.5) / xCount : PAD.left + i * xStep;
+  const ticks = niceTicks(minV, maxV);
+  return /* @__PURE__ */ jsxs4(
+    "svg",
+    {
+      viewBox: `0 0 ${W} ${H}`,
+      className: "aui-artifact-chart-svg w-full",
+      role: "img",
+      "aria-label": "Chart",
+      children: [
+        ticks.map((t, i) => /* @__PURE__ */ jsxs4("g", { children: [
+          /* @__PURE__ */ jsx4(
+            "line",
+            {
+              x1: PAD.left,
+              x2: W - PAD.right,
+              y1: yScale(t),
+              y2: yScale(t),
+              stroke: "currentColor",
+              strokeOpacity: 0.08
+            }
+          ),
+          /* @__PURE__ */ jsx4(
+            "text",
+            {
+              x: PAD.left - 6,
+              y: yScale(t),
+              textAnchor: "end",
+              dominantBaseline: "middle",
+              className: "fill-muted-foreground text-[10px]",
+              children: formatTick(t, unit)
+            }
+          )
+        ] }, i)),
+        data.map((d, i) => /* @__PURE__ */ jsx4(
+          "text",
+          {
+            x: xPos(i),
+            y: H - PAD.bottom + 14,
+            textAnchor: "middle",
+            className: "fill-muted-foreground text-[10px]",
+            children: String(d[xKey] ?? i)
+          },
+          i
+        )),
+        chartType === "bar" && renderBars({ data, dataKeys, xCount, xPos, yScale, minV, innerW }),
+        chartType === "line" && dataKeys.map((k, ki) => /* @__PURE__ */ jsx4(
+          Polyline,
+          {
+            data,
+            dataKey: k,
+            xPos,
+            yScale,
+            color: COLORS[ki % COLORS.length]
+          },
+          k
+        )),
+        chartType === "area" && dataKeys.map((k, ki) => /* @__PURE__ */ jsx4(
+          Area,
+          {
+            data,
+            dataKey: k,
+            xPos,
+            yScale,
+            baseY: yScale(Math.max(0, minV)),
+            color: COLORS[ki % COLORS.length]
+          },
+          k
+        ))
+      ]
+    }
+  );
+};
+function renderBars(args) {
+  const { data, dataKeys, xCount, xPos, yScale, minV, innerW } = args;
+  const groupWidth = innerW / xCount * 0.7;
+  const barWidth = groupWidth / dataKeys.length;
+  const baseY = yScale(Math.max(0, minV));
+  return dataKeys.flatMap(
+    (k, ki) => data.map((d, i) => {
+      const v = toNum(d[k]);
+      const y = yScale(v);
+      const x = xPos(i) - groupWidth / 2 + ki * barWidth;
+      const top = Math.min(y, baseY);
+      const height = Math.abs(y - baseY);
+      return /* @__PURE__ */ jsx4(
+        "rect",
+        {
+          x,
+          y: top,
+          width: Math.max(1, barWidth - 2),
+          height: Math.max(1, height),
+          rx: 2,
+          fill: COLORS[ki % COLORS.length]
+        },
+        `${k}-${i}`
+      );
+    })
+  );
+}
+var Polyline = ({ data, dataKey, xPos, yScale, color }) => {
+  const points = data.map((d, i) => `${xPos(i)},${yScale(toNum(d[dataKey]))}`).join(" ");
+  return /* @__PURE__ */ jsx4(
+    "polyline",
+    {
+      points,
+      fill: "none",
+      stroke: color,
+      strokeWidth: 2,
+      strokeLinejoin: "round",
+      strokeLinecap: "round"
+    }
+  );
+};
+var Area = ({ data, dataKey, xPos, yScale, baseY, color }) => {
+  if (data.length === 0) return null;
+  const top = data.map((d, i) => `${xPos(i)},${yScale(toNum(d[dataKey]))}`).join(" ");
+  const path = `M ${xPos(0)},${baseY} L ${top} L ${xPos(data.length - 1)},${baseY} Z`;
+  return /* @__PURE__ */ jsxs4(Fragment, { children: [
+    /* @__PURE__ */ jsx4("path", { d: path, fill: color, fillOpacity: 0.18 }),
+    /* @__PURE__ */ jsx4(Polyline, { data, dataKey, xPos, yScale, color })
+  ] });
+};
+var PieChart = ({ data, xKey, dataKey }) => {
+  const cx = W / 2;
+  const cy = H / 2;
+  const r = Math.min(W, H) / 2 - 16;
+  const total = data.reduce((sum, d) => sum + toNum(d[dataKey]), 0) || 1;
+  let acc = 0;
+  return /* @__PURE__ */ jsx4(
+    "svg",
+    {
+      viewBox: `0 0 ${W} ${H}`,
+      className: "aui-artifact-chart-svg w-full",
+      role: "img",
+      "aria-label": "Pie chart",
+      children: data.map((d, i) => {
+        const value = toNum(d[dataKey]);
+        const start = acc / total * Math.PI * 2;
+        acc += value;
+        const end = acc / total * Math.PI * 2;
+        return /* @__PURE__ */ jsx4(
+          PieSlice,
+          {
+            cx,
+            cy,
+            r,
+            start,
+            end,
+            color: COLORS[i % COLORS.length],
+            label: String(d[xKey] ?? i)
+          },
+          i
+        );
+      })
+    }
+  );
+};
+var PieSlice = ({ cx, cy, r, start, end, color, label }) => {
+  const x1 = cx + Math.sin(start) * r;
+  const y1 = cy - Math.cos(start) * r;
+  const x2 = cx + Math.sin(end) * r;
+  const y2 = cy - Math.cos(end) * r;
+  const large = end - start > Math.PI ? 1 : 0;
+  const path = `M ${cx} ${cy} L ${x1} ${y1} A ${r} ${r} 0 ${large} 1 ${x2} ${y2} Z`;
+  const mid = (start + end) / 2;
+  const lx = cx + Math.sin(mid) * (r * 0.65);
+  const ly = cy - Math.cos(mid) * (r * 0.65);
+  return /* @__PURE__ */ jsxs4("g", { children: [
+    /* @__PURE__ */ jsx4("path", { d: path, fill: color, stroke: "var(--background, #fff)", strokeWidth: 1 }),
+    /* @__PURE__ */ jsx4(
+      "text",
+      {
+        x: lx,
+        y: ly,
+        textAnchor: "middle",
+        dominantBaseline: "middle",
+        className: "fill-white text-[10px] font-semibold",
+        children: label
+      }
+    )
+  ] });
+};
+var Legend = ({ dataKeys }) => /* @__PURE__ */ jsx4("div", { className: "aui-artifact-chart-legend mt-2 flex flex-wrap items-center gap-x-3 gap-y-1 text-xs text-muted-foreground", children: dataKeys.map((k, i) => /* @__PURE__ */ jsxs4("span", { className: "inline-flex items-center gap-1.5", children: [
+  /* @__PURE__ */ jsx4(
+    "span",
+    {
+      className: "inline-block size-2 rounded-sm",
+      style: { background: COLORS[i % COLORS.length] },
+      "aria-hidden": true
+    }
+  ),
+  k
+] }, k)) });
+var EmptyState = () => /* @__PURE__ */ jsx4("div", { className: "aui-artifact-chart-empty flex h-32 items-center justify-center text-xs text-muted-foreground", children: "No data" });
+function inferXKey(data) {
+  if (data.length === 0) return "x";
+  for (const k of Object.keys(data[0])) {
+    if (typeof data[0][k] !== "number") return k;
+  }
+  return Object.keys(data[0])[0] ?? "x";
+}
+function inferDataKeys(data, xKey) {
+  if (data.length === 0) return [];
+  return Object.keys(data[0]).filter(
+    (k) => k !== xKey && typeof data[0][k] === "number"
+  );
+}
+function toNum(value) {
+  const n = typeof value === "number" ? value : Number(value);
+  return Number.isFinite(n) ? n : 0;
+}
+function niceTicks(min, max, count = 4) {
+  if (max === min) return [min];
+  const range = max - min;
+  const step = niceStep(range / count);
+  const start = Math.floor(min / step) * step;
+  const out = [];
+  for (let v = start; v <= max + step / 2; v += step) {
+    out.push(round(v));
+  }
+  return out;
+}
+function niceStep(raw) {
+  const exp = Math.floor(Math.log10(Math.abs(raw))) || 0;
+  const base = Math.pow(10, exp);
+  const norm = raw / base;
+  let nice = 1;
+  if (norm >= 5) nice = 5;
+  else if (norm >= 2) nice = 2;
+  return nice * base;
+}
+function round(v) {
+  return Math.round(v * 1e6) / 1e6;
+}
+function formatTick(v, unit) {
+  const s = Math.abs(v) >= 1e3 ? `${(v / 1e3).toFixed(1)}k` : String(round(v));
+  return unit ? `${s}${unit}` : s;
+}
+
+// src/artifacts/question-artifact.tsx
+import { useCallback, useState as useState2 } from "react";
+import { useThreadRuntime } from "@assistant-ui/react";
+import { CheckIcon } from "lucide-react";
+
+// src/design/classes.ts
+var studioTopbarPillHeightClass = "h-[var(--studio-chrome-pill-height)] min-h-[var(--studio-chrome-pill-height)]";
+var studioTopbarIconPillClass = "shrink-0 flex-none size-[var(--studio-chrome-pill-height)] min-h-[var(--studio-chrome-pill-height)] min-w-[var(--studio-chrome-pill-height)]";
+var studioPlaygroundGradientClass = "bg-gradient-to-b from-playground-from via-playground-via to-playground-to";
+var studioComposeInputShellClass = cn(
+  "aui-composer-shell flex w-full flex-col overflow-hidden rounded-2xl bg-composer-bg shadow-card-elevated outline-none",
+  "border border-composer-border",
+  "transition-[box-shadow,border-color]",
+  "focus-within:border-composer-border-focus focus-within:ring-2 focus-within:ring-foreground/5"
+);
+var studioSecondaryChromeClass = TIMBAL_V2_SECONDARY_CHROME;
+var studioSearchChromeClass = cn(
+  studioSecondaryChromeClass,
+  studioTopbarPillHeightClass,
+  "inline-flex items-center gap-2 rounded-full px-2.5"
+);
+var studioIntegrationSurfaceSolid = cn(
+  TIMBAL_V2_ELEVATED_GRADIENT,
+  "shadow-card"
+);
+var studioIntegrationBorder = "border border-border";
+var studioIntegrationCardClass = cn(
+  "rounded-xl",
+  studioIntegrationSurfaceSolid,
+  studioIntegrationBorder
+);
+var studioListRowButtonClass = cn(
+  "flex w-full cursor-pointer items-center gap-3 rounded-xl px-3 py-2.5 text-left",
+  studioIntegrationCardClass,
+  "transition-[background-color,box-shadow,border-color] duration-200 ease-in-out",
+  "hover:border-foreground/20",
+  "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-foreground/15 focus-visible:ring-offset-2 focus-visible:ring-offset-background"
+);
+var studioComposerIoWellClass = cn(
+  "rounded-lg",
+  studioIntegrationSurfaceSolid,
+  studioIntegrationBorder
+);
+var studioSidebarPanelClass = cn(
+  "bg-sidebar text-sidebar-foreground",
+  "border border-sidebar-border",
+  "shadow-card-elevated"
+);
+var studioSidebarNavItemClass = cn(
+  "flex items-center rounded-lg text-sm",
+  "transition-[color,background-color,box-shadow,border-color] duration-200 ease-in-out",
+  "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-foreground/15 focus-visible:ring-offset-2"
+);
+function studioSidebarNavItemLayout(iconOnly) {
+  return iconOnly ? "box-border size-8 min-h-8 min-w-8 shrink-0 justify-center rounded-lg p-0 focus-visible:ring-offset-0" : "w-full gap-2 px-2.5 py-2";
+}
+var studioSidebarNavItemSurfaceClass = cn(
+  "bg-gradient-to-b from-elevated-from to-elevated-to text-foreground",
+  "border border-border",
+  "shadow-card"
+);
+var studioSidebarNavItemIdleClass = cn(
+  "border border-transparent text-muted-foreground shadow-none",
+  "hover:text-foreground",
+  "hover:bg-gradient-to-b hover:from-elevated-from hover:to-elevated-to",
+  "hover:border-border hover:shadow-card"
+);
+var studioSidebarCollapsedRailItemClass = cn(
+  "border border-border shadow-card bg-sidebar-accent"
+);
+var studioSidebarCollapsedRailItemIdleClass = cn(
+  studioSidebarCollapsedRailItemClass,
+  "text-muted-foreground hover:text-foreground"
+);
+var studioSidebarCollapsedRailItemActiveClass = cn(
+  studioSidebarCollapsedRailItemClass,
+  studioSidebarNavItemSurfaceClass,
+  "text-foreground"
+);
+var studioSidebarNavItemActiveClass = studioSidebarNavItemSurfaceClass;
+var studioTimelineRowButtonClass = "group flex w-full min-w-0 cursor-pointer items-center justify-start rounded-md border-0 bg-transparent py-1 text-left shadow-none focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-foreground/15 focus-visible:ring-offset-2";
+var studioTimelineTextClass = "text-xs font-normal leading-snug";
+var studioTimelineActionClass = cn(
+  studioTimelineTextClass,
+  "shrink-0 text-foreground/70 transition-colors duration-150 group-hover:text-foreground/80"
+);
+var studioTimelineShimmerActionClass = cn(
+  studioTimelineTextClass,
+  "shrink-0"
+);
+var studioTimelineDetailClass = cn(
+  studioTimelineTextClass,
+  "min-w-0 truncate text-muted-foreground transition-colors duration-150"
+);
+function studioTimelineChevronClass(expanded) {
+  return cn(
+    "ml-0.5 size-3 min-h-3 min-w-3 shrink-0 transition-all duration-150",
+    expanded ? "rotate-90 text-foreground opacity-60" : "text-muted-foreground opacity-0 group-hover:opacity-70"
+  );
+}
+var studioTimelineBodyPadClass = "flex flex-col gap-2 pt-0.5 pb-0.5";
+var studioArtifactShellClass = cn(
+  studioIntegrationCardClass,
+  "my-2 w-full min-w-0 overflow-hidden"
+);
+var studioQuestionOptionClass = cn(
+  "flex w-full items-center gap-2 rounded-lg border border-transparent px-2 py-1.5 text-left text-sm",
+  "transition-[background-color,border-color,box-shadow] duration-200",
+  "hover:border-border hover:bg-gradient-to-b hover:from-elevated-from hover:to-elevated-to hover:shadow-card",
+  "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-foreground/15 focus-visible:ring-offset-2"
+);
+var studioQuestionOptionSelectedClass = cn(
+  studioQuestionOptionClass,
+  "border-border bg-gradient-to-b from-elevated-from to-elevated-to shadow-card ring-1 ring-foreground/10"
+);
+
+// src/artifacts/question-artifact.tsx
+import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
+function optionKey(option, index) {
+  const id = option.id?.trim();
+  return id ? id : `__option-${index}`;
+}
+var OptionRadio = ({ selected }) => /* @__PURE__ */ jsx5(
+  "span",
+  {
+    className: cn(
+      "flex size-4 shrink-0 items-center justify-center rounded-full border-2 transition-colors",
+      selected ? "border-foreground bg-foreground text-background" : "border-border bg-background"
+    ),
+    "aria-hidden": true,
+    children: selected ? /* @__PURE__ */ jsx5(CheckIcon, { className: "size-2.5 stroke-[3]" }) : null
+  }
+);
+var QuestionArtifactView = ({
+  artifact
+}) => {
+  const runtime = useThreadRuntime();
+  const [selected, setSelected] = useState2([]);
+  const [submittedIds, setSubmittedIds] = useState2(null);
+  const isMulti = artifact.multi === true;
+  const isDisabled = submittedIds !== null;
+  const send = useCallback(
+    (keys) => {
+      if (keys.length === 0) return;
+      const labels = artifact.options.map((option, index) => ({ option, key: optionKey(option, index) })).filter(({ key }) => keys.includes(key)).map(({ option }) => option.label);
+      setSubmittedIds(keys);
+      runtime.append({
+        role: "user",
+        content: [{ type: "text", text: labels.join(", ") }]
+      });
+    },
+    [artifact.options, runtime]
+  );
+  const onPick = useCallback(
+    (key) => {
+      if (isDisabled) return;
+      if (!isMulti) {
+        send([key]);
+        return;
+      }
+      setSelected(
+        (prev) => prev.includes(key) ? prev.filter((id) => id !== key) : [...prev, key]
+      );
+    },
+    [isDisabled, isMulti, send]
+  );
+  const onConfirm = useCallback(() => {
+    send(selected);
+  }, [selected, send]);
+  return /* @__PURE__ */ jsx5("div", { className: studioArtifactShellClass, "data-artifact-kind": "question", children: /* @__PURE__ */ jsxs5("div", { className: "px-2.5 py-2", children: [
+    artifact.prompt ? /* @__PURE__ */ jsx5("p", { className: "mb-2 text-sm font-normal leading-snug text-foreground", children: artifact.prompt }) : null,
+    /* @__PURE__ */ jsx5("div", { className: "flex flex-col gap-0.5", role: "list", children: artifact.options.map((option, index) => {
+      const key = optionKey(option, index);
+      const isSelected = submittedIds ? submittedIds.includes(key) : isMulti && selected.includes(key);
+      return /* @__PURE__ */ jsxs5(
+        "button",
+        {
+          type: "button",
+          role: "listitem",
+          disabled: isDisabled,
+          onClick: () => onPick(key),
+          className: cn(
+            isSelected ? studioQuestionOptionSelectedClass : studioQuestionOptionClass,
+            isDisabled && (isSelected ? "cursor-default" : "cursor-not-allowed opacity-50")
+          ),
+          children: [
+            /* @__PURE__ */ jsx5(OptionRadio, { selected: isSelected }),
+            /* @__PURE__ */ jsxs5("span", { className: "min-w-0 flex-1 text-left", children: [
+              /* @__PURE__ */ jsx5("span", { className: "block font-normal text-foreground", children: option.label }),
+              option.description ? /* @__PURE__ */ jsx5("span", { className: "mt-0.5 block text-xs text-muted-foreground", children: option.description }) : null
+            ] })
+          ]
+        },
+        key
+      );
+    }) }),
+    isMulti && !submittedIds ? /* @__PURE__ */ jsx5("div", { className: "mt-2 flex justify-end", children: /* @__PURE__ */ jsx5(
+      TimbalV2Button,
+      {
+        type: "button",
+        variant: "primary",
+        size: "sm",
+        disabled: selected.length === 0,
+        onClick: onConfirm,
+        children: "Confirm"
+      }
+    ) }) : null
+  ] }) });
+};
+
+// src/artifacts/html-artifact.tsx
+import { jsx as jsx6 } from "react/jsx-runtime";
+var HtmlArtifactView = ({ artifact }) => {
+  const sandboxed = artifact.sandboxed !== false;
+  const sandbox = sandboxed ? "allow-scripts allow-same-origin allow-forms allow-modals allow-popups allow-pointer-lock" : void 0;
+  const height = artifact.height ?? "320px";
+  return /* @__PURE__ */ jsx6(ArtifactCard, { title: artifact.title, kind: "html", children: /* @__PURE__ */ jsx6(
+    "iframe",
+    {
+      title: artifact.title ?? "HTML artifact",
+      srcDoc: artifact.content,
+      sandbox,
+      className: "aui-artifact-html w-full border-0 bg-background",
+      style: { height }
+    }
+  ) });
+};
+
+// src/artifacts/json-artifact.tsx
+import { jsx as jsx7 } from "react/jsx-runtime";
+var JsonArtifactView = ({
+  artifact
+}) => {
+  const data = "data" in artifact ? artifact.data : artifact;
+  const title = artifact.title;
+  let body;
+  try {
+    body = JSON.stringify(data, null, 2);
+  } catch {
+    body = String(data);
+  }
+  return /* @__PURE__ */ jsx7(ArtifactCard, { title, kind: "json", children: /* @__PURE__ */ jsx7("pre", { className: "aui-artifact-json m-0 max-h-[420px] overflow-auto p-3 font-mono text-[12px] leading-relaxed text-foreground/85", children: body }) });
+};
+
+// src/artifacts/table-artifact.tsx
+import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
+var TableArtifactView = ({ artifact }) => {
+  const rows = artifact.rows ?? [];
+  const columns = artifact.columns ?? deriveColumns(rows);
+  return /* @__PURE__ */ jsx8(ArtifactCard, { title: artifact.title, kind: "table", children: /* @__PURE__ */ jsx8("div", { className: "aui-artifact-table-wrap overflow-x-auto", children: /* @__PURE__ */ jsxs6("table", { className: "aui-artifact-table w-full border-collapse text-sm", children: [
+    /* @__PURE__ */ jsx8("thead", { children: /* @__PURE__ */ jsx8("tr", { className: "border-b border-border/40 bg-muted/20", children: columns.map((col) => /* @__PURE__ */ jsx8(
+      "th",
+      {
+        className: "px-3 py-2 text-left text-xs font-semibold uppercase tracking-wider text-muted-foreground",
+        children: col.label ?? col.key
+      },
+      col.key
+    )) }) }),
+    /* @__PURE__ */ jsx8("tbody", { children: rows.map((row, i) => /* @__PURE__ */ jsx8(
+      "tr",
+      {
+        className: "border-b border-border/30 transition-colors last:border-b-0 hover:bg-muted/20",
+        children: columns.map((col) => /* @__PURE__ */ jsx8(
+          "td",
+          {
+            className: "px-3 py-2 align-top text-foreground/85",
+            children: formatCell(row[col.key])
+          },
+          col.key
+        ))
+      },
+      i
+    )) })
+  ] }) }) });
+};
+function deriveColumns(rows) {
+  const seen = /* @__PURE__ */ new Set();
+  const cols = [];
+  for (const row of rows) {
+    for (const key of Object.keys(row)) {
+      if (!seen.has(key)) {
+        seen.add(key);
+        cols.push({ key });
+      }
+    }
+  }
+  return cols;
+}
+function formatCell(value) {
+  if (value === null || value === void 0) return "";
+  if (typeof value === "object") return JSON.stringify(value);
+  return String(value);
+}
+
+// src/artifacts/ui/types.ts
+function isUiBinding(value) {
+  return typeof value === "object" && value !== null && !Array.isArray(value) && typeof value.$bind === "string";
+}
+
+// src/artifacts/ui/state.ts
+function uiStateReducer(state, action) {
+  switch (action.type) {
+    case "set":
+      return setPath(state, action.path, action.value);
+    case "toggle": {
+      const current = getPath(state, action.path);
+      return setPath(state, action.path, !current);
+    }
+    case "replace":
+      return action.state;
+  }
+}
+function getPath(state, path) {
+  if (!path) return void 0;
+  const parts = path.split(".");
+  let cursor = state;
+  for (const part of parts) {
+    if (typeof cursor !== "object" || cursor === null) return void 0;
+    cursor = cursor[part];
+  }
+  return cursor;
+}
+function setPath(state, path, value) {
+  if (!path) return state;
+  const parts = path.split(".");
+  const next = { ...state };
+  let cursor = next;
+  for (let i = 0; i < parts.length - 1; i++) {
+    const key = parts[i];
+    const child = cursor[key];
+    const cloned = typeof child === "object" && child !== null && !Array.isArray(child) ? { ...child } : {};
+    cursor[key] = cloned;
+    cursor = cloned;
+  }
+  cursor[parts[parts.length - 1]] = value;
+  return next;
+}
+function resolveBindable(value, state) {
+  if (isUiBinding(value)) {
+    return getPath(state, value.$bind);
+  }
+  return value;
+}
+
+// src/artifacts/ui/registry.tsx
+import {
+  createContext,
+  useContext
+} from "react";
+import { jsx as jsx9 } from "react/jsx-runtime";
+var UiStateContext = createContext({});
+var UiDispatchContext = createContext(() => {
+});
+var UiStateProvider = ({ state, dispatch, children }) => /* @__PURE__ */ jsx9(UiStateContext.Provider, { value: state, children: /* @__PURE__ */ jsx9(UiDispatchContext.Provider, { value: dispatch, children }) });
+function useUiState() {
+  return useContext(UiStateContext);
+}
+function useUiDispatch() {
+  return useContext(UiDispatchContext);
+}
+var UiEventContext = createContext(
+  null
+);
+var UiEventProvider = ({ onEvent, children }) => /* @__PURE__ */ jsx9(UiEventContext.Provider, { value: onEvent, children });
+function useUiEventEmitter() {
+  return useContext(UiEventContext);
+}
+var UiCustomNodeRegistryContext = createContext({});
+var UiCustomNodeRegistryProvider = ({ renderers, children }) => /* @__PURE__ */ jsx9(UiCustomNodeRegistryContext.Provider, { value: renderers, children });
+function useUiCustomNodeRegistry() {
+  return useContext(UiCustomNodeRegistryContext);
+}
+
+// src/artifacts/ui/nodes.tsx
+import { useCallback as useCallback2 } from "react";
+import { motion } from "motion/react";
+import { useThreadRuntime as useThreadRuntime2 } from "@assistant-ui/react";
+import { jsx as jsx10, jsxs as jsxs7 } from "react/jsx-runtime";
+var UiNodeView = ({ node }) => {
+  switch (node.kind) {
+    case "box":
+      return /* @__PURE__ */ jsx10(BoxNode, { node });
+    case "text":
+      return /* @__PURE__ */ jsx10(TextNode, { node });
+    case "heading":
+      return /* @__PURE__ */ jsx10(HeadingNode, { node });
+    case "badge":
+      return /* @__PURE__ */ jsx10(BadgeNode, { node });
+    case "button":
+      return /* @__PURE__ */ jsx10(ButtonNode, { node });
+    case "toggle":
+      return /* @__PURE__ */ jsx10(ToggleNode, { node });
+    case "slider":
+      return /* @__PURE__ */ jsx10(SliderNode, { node });
+    case "tooltip":
+      return /* @__PURE__ */ jsx10(TooltipNode, { node });
+    case "draggable":
+      return /* @__PURE__ */ jsx10(DraggableNode, { node });
+    case "custom":
+      return /* @__PURE__ */ jsx10(CustomNode, { node });
+    default:
+      return null;
+  }
+};
+function useActionRunner() {
+  const state = useUiState();
+  const dispatch = useUiDispatch();
+  const runtime = useThreadRuntime2();
+  const emit = useUiEventEmitter();
+  return useCallback2(
+    (actions) => {
+      if (!actions) return;
+      const list = Array.isArray(actions) ? actions : [actions];
+      for (const action of list) {
+        switch (action.kind) {
+          case "message": {
+            const text = resolveBindable(action.text, state);
+            if (typeof text === "string" && text.length > 0) {
+              runtime?.append({
+                role: "user",
+                content: [{ type: "text", text }]
+              });
+            }
+            break;
+          }
+          case "set": {
+            const value = resolveBindable(action.value, state);
+            dispatch({ type: "set", path: action.path, value });
+            break;
+          }
+          case "toggle": {
+            dispatch({ type: "toggle", path: action.path });
+            break;
+          }
+          case "emit": {
+            emit?.({ name: action.name, payload: action.payload });
+            break;
+          }
+        }
+      }
+    },
+    [state, dispatch, runtime, emit]
+  );
+}
+var ALIGN_CLS = {
+  start: "items-start",
+  center: "items-center",
+  end: "items-end",
+  stretch: "items-stretch"
+};
+var JUSTIFY_CLS = {
+  start: "justify-start",
+  center: "justify-center",
+  end: "justify-end",
+  between: "justify-between",
+  around: "justify-around"
+};
+var BoxNode = ({ node }) => {
+  const dir = node.direction ?? "col";
+  return /* @__PURE__ */ jsx10(
+    "div",
+    {
+      className: cn(
+        "aui-ui-box flex",
+        dir === "col" ? "flex-col" : "flex-row",
+        node.wrap && "flex-wrap",
+        node.align && ALIGN_CLS[node.align],
+        node.justify && JUSTIFY_CLS[node.justify],
+        node.className
+      ),
+      style: {
+        gap: node.gap !== void 0 ? `${node.gap * 0.25}rem` : void 0,
+        padding: node.padding !== void 0 ? `${node.padding * 0.25}rem` : void 0
+      },
+      children: node.children?.map((child, i) => /* @__PURE__ */ jsx10(UiNodeView, { node: child }, child.id ?? i))
+    }
+  );
+};
+var TEXT_SIZE = {
+  xs: "text-xs",
+  sm: "text-sm",
+  base: "text-base",
+  lg: "text-lg"
+};
+var TEXT_WEIGHT = {
+  normal: "font-normal",
+  medium: "font-medium",
+  semibold: "font-semibold",
+  bold: "font-bold"
+};
+var TextNode = ({ node }) => {
+  const state = useUiState();
+  const value = resolveBindable(node.value, state);
+  return /* @__PURE__ */ jsx10(
+    "span",
+    {
+      className: cn(
+        "aui-ui-text",
+        node.muted && "text-muted-foreground",
+        node.size && TEXT_SIZE[node.size],
+        node.weight && TEXT_WEIGHT[node.weight],
+        node.className
+      ),
+      children: value === void 0 || value === null ? "" : String(value)
+    }
+  );
+};
+var HEADING_CLS = {
+  1: "text-2xl",
+  2: "text-xl",
+  3: "text-lg",
+  4: "text-base"
+};
+var HeadingNode = ({ node }) => {
+  const state = useUiState();
+  const value = String(resolveBindable(node.value, state) ?? "");
+  const level = node.level ?? 2;
+  const cls = cn(
+    "aui-ui-heading font-semibold text-foreground",
+    HEADING_CLS[level],
+    node.className
+  );
+  switch (level) {
+    case 1:
+      return /* @__PURE__ */ jsx10("h1", { className: cls, children: value });
+    case 2:
+      return /* @__PURE__ */ jsx10("h2", { className: cls, children: value });
+    case 3:
+      return /* @__PURE__ */ jsx10("h3", { className: cls, children: value });
+    case 4:
+      return /* @__PURE__ */ jsx10("h4", { className: cls, children: value });
+  }
+};
+var BADGE_TONE = {
+  default: "bg-muted text-foreground",
+  primary: "bg-primary/10 text-primary",
+  success: "bg-emerald-500/10 text-emerald-600 dark:text-emerald-400",
+  warn: "bg-amber-500/10 text-amber-600 dark:text-amber-400",
+  danger: "bg-destructive/10 text-destructive"
+};
+var BadgeNode = ({ node }) => {
+  const state = useUiState();
+  const value = String(resolveBindable(node.value, state) ?? "");
+  return /* @__PURE__ */ jsx10(
+    "span",
+    {
+      className: cn(
+        "aui-ui-badge inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium",
+        BADGE_TONE[node.tone ?? "default"],
+        node.className
+      ),
+      children: value
+    }
+  );
+};
+var ButtonNode = ({ node }) => {
+  const state = useUiState();
+  const run = useActionRunner();
+  const label = String(resolveBindable(node.label, state) ?? "");
+  const disabled = node.disabled !== void 0 ? Boolean(resolveBindable(node.disabled, state)) : false;
+  return /* @__PURE__ */ jsx10(
+    Button,
+    {
+      variant: node.variant ?? "default",
+      size: node.size ?? "default",
+      disabled,
+      className: node.className,
+      onClick: () => run(node.onClick),
+      children: label
+    }
+  );
+};
+var ToggleNode = ({ node }) => {
+  const state = useUiState();
+  const dispatch = useUiDispatch();
+  const run = useActionRunner();
+  const value = Boolean(getPath(state, node.binding));
+  const label = node.label ? String(resolveBindable(node.label, state) ?? "") : null;
+  const onToggle = () => {
+    dispatch({ type: "toggle", path: node.binding });
+    run(node.onChange);
+  };
+  return /* @__PURE__ */ jsxs7(
+    "label",
+    {
+      className: cn(
+        "aui-ui-toggle inline-flex cursor-pointer items-center gap-2 text-sm select-none",
+        node.className
+      ),
+      children: [
+        /* @__PURE__ */ jsx10(
+          "button",
+          {
+            type: "button",
+            role: "switch",
+            "aria-checked": value,
+            onClick: onToggle,
+            className: cn(
+              "relative inline-flex h-5 w-9 shrink-0 items-center rounded-full transition-[background,box-shadow,border-color] duration-200",
+              value ? "border-foreground/15 bg-gradient-to-b from-primary-fill-from to-primary-fill-to shadow-card" : cn(TIMBAL_V2_SWITCH_TRACK_OFF, "hover:from-secondary-fill-hover-from hover:to-secondary-fill-hover-to")
+            ),
+            children: /* @__PURE__ */ jsx10(
+              "span",
+              {
+                className: cn(
+                  "inline-block size-4 transform rounded-full transition-transform",
+                  TIMBAL_V2_SWITCH_THUMB,
+                  value ? "translate-x-4" : "translate-x-0.5"
+                ),
+                "aria-hidden": true
+              }
+            )
+          }
+        ),
+        label && /* @__PURE__ */ jsx10("span", { className: "text-foreground/85", children: label })
+      ]
+    }
+  );
+};
+var SliderNode = ({ node }) => {
+  const state = useUiState();
+  const dispatch = useUiDispatch();
+  const run = useActionRunner();
+  const min = node.min ?? 0;
+  const max = node.max ?? 100;
+  const step = node.step ?? 1;
+  const raw = getPath(state, node.binding);
+  const value = typeof raw === "number" ? raw : min;
+  const showValue = node.showValue ?? true;
+  const label = node.label ? String(resolveBindable(node.label, state) ?? "") : null;
+  const onChange = (e) => {
+    const next = Number(e.target.value);
+    dispatch({ type: "set", path: node.binding, value: next });
+  };
+  return /* @__PURE__ */ jsxs7("div", { className: cn("aui-ui-slider flex flex-col gap-1", node.className), children: [
+    (label || showValue) && /* @__PURE__ */ jsxs7("div", { className: "flex items-center justify-between text-xs text-muted-foreground", children: [
+      label && /* @__PURE__ */ jsx10("span", { children: label }),
+      showValue && /* @__PURE__ */ jsx10("span", { className: "font-mono", children: value })
+    ] }),
+    /* @__PURE__ */ jsx10(
+      "input",
+      {
+        type: "range",
+        min,
+        max,
+        step,
+        value,
+        onChange,
+        onMouseUp: () => run(node.onChange),
+        onKeyUp: (e) => {
+          if (e.key === "Enter" || e.key === " ") run(node.onChange);
+        },
+        onTouchEnd: () => run(node.onChange),
+        className: "aui-ui-slider-input h-1.5 w-full cursor-pointer appearance-none rounded-full bg-muted accent-primary"
+      }
+    )
+  ] });
+};
+var TooltipNode = ({ node }) => {
+  const state = useUiState();
+  const content = String(resolveBindable(node.content, state) ?? "");
+  return /* @__PURE__ */ jsx10(TooltipProvider, { children: /* @__PURE__ */ jsxs7(Tooltip, { children: [
+    /* @__PURE__ */ jsx10(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx10("span", { className: cn("aui-ui-tooltip-trigger inline-flex", node.className), children: /* @__PURE__ */ jsx10(UiNodeView, { node: node.child }) }) }),
+    /* @__PURE__ */ jsx10(TooltipContent, { side: node.side ?? "top", children: content })
+  ] }) });
+};
+var DraggableNode = ({ node }) => {
+  const run = useActionRunner();
+  const snapBack = node.snapBack ?? true;
+  const axis = node.axis ?? "both";
+  const dragProp = axis === "both" ? true : axis;
+  return /* @__PURE__ */ jsx10(
+    motion.div,
+    {
+      drag: dragProp,
+      dragMomentum: false,
+      dragSnapToOrigin: snapBack,
+      whileDrag: { scale: 1.02, cursor: "grabbing" },
+      onDragEnd: () => run(node.onDragEnd),
+      className: cn(
+        "aui-ui-draggable inline-block cursor-grab touch-none",
+        node.className
+      ),
+      children: /* @__PURE__ */ jsx10(UiNodeView, { node: node.child })
+    }
+  );
+};
+var CustomNode = ({ node }) => {
+  const state = useUiState();
+  const registry = useUiCustomNodeRegistry();
+  const Renderer = registry[node.name];
+  if (!Renderer) return null;
+  const resolvedProps = resolveProps(node.props ?? {}, state);
+  const children = node.children?.map((child, i) => /* @__PURE__ */ jsx10(UiNodeView, { node: child }, child.id ?? i));
+  return /* @__PURE__ */ jsx10(Renderer, { props: resolvedProps, children });
+};
+function resolveProps(props, state) {
+  const out = {};
+  for (const [k, v] of Object.entries(props)) {
+    out[k] = resolveBindable(v, state);
+  }
+  return out;
+}
+
+// src/artifacts/ui/ui-artifact.tsx
+import { useReducer } from "react";
+import { jsx as jsx11 } from "react/jsx-runtime";
+var UiArtifactView = ({ artifact }) => {
+  const [state, dispatch] = useReducer(
+    uiStateReducer,
+    artifact.initialState ?? {}
+  );
+  return /* @__PURE__ */ jsx11(ArtifactCard, { title: artifact.title, kind: "ui", children: /* @__PURE__ */ jsx11(UiStateProvider, { state, dispatch, children: /* @__PURE__ */ jsx11("div", { className: "aui-ui-root p-3", children: /* @__PURE__ */ jsx11(UiNodeView, { node: artifact.root }) }) }) });
+};
+
+// src/artifacts/registry.tsx
+import { createContext as createContext2, useContext as useContext2, useMemo as useMemo2 } from "react";
+import { jsx as jsx12 } from "react/jsx-runtime";
+var defaultArtifactRenderers = {
+  chart: ChartArtifactView,
+  question: QuestionArtifactView,
+  html: HtmlArtifactView,
+  json: JsonArtifactView,
+  table: TableArtifactView,
+  ui: UiArtifactView
+};
+var ArtifactRegistryContext = createContext2(
+  defaultArtifactRenderers
+);
+var ArtifactRegistryProvider = ({ renderers, override, children }) => {
+  const merged = useMemo2(() => {
+    if (!renderers) return defaultArtifactRenderers;
+    if (override) return renderers;
+    return { ...defaultArtifactRenderers, ...renderers };
+  }, [renderers, override]);
+  return /* @__PURE__ */ jsx12(ArtifactRegistryContext.Provider, { value: merged, children });
+};
+function useArtifactRegistry() {
+  return useContext2(ArtifactRegistryContext);
+}
+var ArtifactView = ({ artifact }) => {
+  const registry = useArtifactRegistry();
+  const Renderer = registry[artifact.type] ?? registry.json;
+  if (!Renderer) return null;
+  return /* @__PURE__ */ jsx12(Renderer, { artifact });
+};
+
+// src/artifacts/types.ts
+function isArtifact(value) {
+  return typeof value === "object" && value !== null && !Array.isArray(value) && typeof value.type === "string";
+}
+
+// src/artifacts/parse.ts
+var ARTIFACT_FENCE_LANGUAGES = /* @__PURE__ */ new Set([
+  "timbal-artifact",
+  "timbal"
+]);
+function isArtifactFenceLanguage(language) {
+  return typeof language === "string" && ARTIFACT_FENCE_LANGUAGES.has(language);
+}
+function tryParseStructuredText(text) {
+  const trimmed = text.trim();
+  if (!trimmed.startsWith("{") && !trimmed.startsWith("[")) return null;
+  try {
+    return JSON.parse(trimmed);
+  } catch {
+  }
+  try {
+    const asJson = trimmed.replace(/\bTrue\b/g, "true").replace(/\bFalse\b/g, "false").replace(/\bNone\b/g, "null").replace(/'/g, '"');
+    return JSON.parse(asJson);
+  } catch {
+    return null;
+  }
+}
+function parseArtifactFromToolResult(result) {
+  if (result === void 0 || result === null) return null;
+  if (typeof result === "string") {
+    const parsed = tryParseStructuredText(result);
+    if (parsed === null) return null;
+    return parseArtifactFromToolResult(parsed);
+  }
+  if (Array.isArray(result)) {
+    for (const item of result) {
+      if (typeof item === "object" && item !== null && "text" in item) {
+        const text = item.text;
+        if (typeof text === "string") {
+          const fromText = parseArtifactFromToolResult(text);
+          if (fromText) return fromText;
+        }
+      }
+    }
+    return null;
+  }
+  if (typeof result === "object") {
+    const obj = result;
+    if (obj.type === "text" && typeof obj.text === "string") {
+      return parseArtifactFromToolResult(obj.text);
+    }
+    if (obj.type === "thinking" && typeof obj.thinking === "string") {
+      return parseArtifactFromToolResult(obj.thinking);
+    }
+  }
+  return isArtifact(result) ? result : null;
+}
+var FENCE_RE = /```(?:timbal-artifact|timbal)\s*\n([\s\S]*?)\n```/g;
+function findMarkdownArtifacts(markdown) {
+  const matches = [];
+  FENCE_RE.lastIndex = 0;
+  let m;
+  while ((m = FENCE_RE.exec(markdown)) !== null) {
+    const raw = m[0];
+    const body = m[1];
+    try {
+      const parsed = JSON.parse(body);
+      if (isArtifact(parsed)) {
+        matches.push({
+          artifact: parsed,
+          raw,
+          start: m.index,
+          end: m.index + raw.length
+        });
+      }
+    } catch {
+    }
+  }
+  return matches;
+}
+function splitMarkdownByArtifacts(markdown) {
+  const matches = findMarkdownArtifacts(markdown);
+  if (matches.length === 0) return [{ kind: "text", text: markdown }];
+  const segments = [];
+  let cursor = 0;
+  for (const match of matches) {
+    if (match.start > cursor) {
+      segments.push({ kind: "text", text: markdown.slice(cursor, match.start) });
+    }
+    segments.push({ kind: "artifact", artifact: match.artifact });
+    cursor = match.end;
+  }
+  if (cursor < markdown.length) {
+    segments.push({ kind: "text", text: markdown.slice(cursor) });
+  }
+  return segments;
+}
+
+// src/chat/markdown-text.tsx
+import "@assistant-ui/react-markdown/styles/dot.css";
+import "katex/dist/katex.min.css";
+import {
+  MarkdownTextPrimitive,
+  unstable_memoizeMarkdownComponents as memoizeMarkdownComponents,
+  useIsMarkdownCodeBlock
+} from "@assistant-ui/react-markdown";
+import remarkGfm from "remark-gfm";
+import remarkMath from "remark-math";
+import rehypeKatex from "rehype-katex";
+import { memo, useState as useState4 } from "react";
+import { CheckIcon as CheckIcon2, CopyIcon } from "lucide-react";
+
+// src/chat/syntax-highlighter.tsx
+import { useEffect as useEffect2, useState as useState3 } from "react";
+import { createHighlighterCore } from "shiki/core";
+import { createJavaScriptRegexEngine } from "shiki/engine/javascript";
+import langJavascript from "shiki/langs/javascript.mjs";
+import langTypescript from "shiki/langs/typescript.mjs";
+import langPython from "shiki/langs/python.mjs";
+import langHtml from "shiki/langs/html.mjs";
+import langCss from "shiki/langs/css.mjs";
+import langJson from "shiki/langs/json.mjs";
+import langBash from "shiki/langs/bash.mjs";
+import langMarkdown from "shiki/langs/markdown.mjs";
+import langJsx from "shiki/langs/jsx.mjs";
+import langTsx from "shiki/langs/tsx.mjs";
+import langSql from "shiki/langs/sql.mjs";
+import langYaml from "shiki/langs/yaml.mjs";
+import langRust from "shiki/langs/rust.mjs";
+import langGo from "shiki/langs/go.mjs";
+import langJava from "shiki/langs/java.mjs";
+import langC from "shiki/langs/c.mjs";
+import langCpp from "shiki/langs/cpp.mjs";
+import themeVitesseDark from "shiki/themes/vitesse-dark.mjs";
+import themeVitesseLight from "shiki/themes/vitesse-light.mjs";
+import { jsx as jsx13 } from "react/jsx-runtime";
+var SHIKI_THEME_DARK = "vitesse-dark";
+var SHIKI_THEME_LIGHT = "vitesse-light";
+var highlighterPromise = null;
+function getHighlighter() {
+  if (!highlighterPromise) {
+    highlighterPromise = createHighlighterCore({
+      themes: [themeVitesseDark, themeVitesseLight],
+      langs: [
+        langJavascript,
+        langTypescript,
+        langPython,
+        langHtml,
+        langCss,
+        langJson,
+        langBash,
+        langMarkdown,
+        langJsx,
+        langTsx,
+        langSql,
+        langYaml,
+        langRust,
+        langGo,
+        langJava,
+        langC,
+        langCpp
+      ],
+      engine: createJavaScriptRegexEngine()
+    });
+  }
+  return highlighterPromise;
+}
+getHighlighter();
+var ShikiSyntaxHighlighter = ({
+  components: { Pre, Code: Code2 },
+  language,
+  code
+}) => {
+  const [html, setHtml] = useState3(null);
+  useEffect2(() => {
+    let cancelled = false;
+    (async () => {
+      try {
+        const highlighter = await getHighlighter();
+        const loadedLangs = highlighter.getLoadedLanguages();
+        if (!loadedLangs.includes(language)) {
+          if (!cancelled) setHtml(null);
+          return;
+        }
+        const result = highlighter.codeToHtml(code, {
+          lang: language,
+          themes: {
+            dark: SHIKI_THEME_DARK,
+            light: SHIKI_THEME_LIGHT
+          }
+        });
+        if (!cancelled) setHtml(result);
+      } catch {
+        if (!cancelled) setHtml(null);
+      }
+    })();
+    return () => {
+      cancelled = true;
+    };
+  }, [code, language]);
+  if (isArtifactFenceLanguage(language)) {
+    try {
+      const parsed = JSON.parse(code);
+      if (isArtifact(parsed)) {
+        return /* @__PURE__ */ jsx13(ArtifactView, { artifact: parsed });
+      }
+    } catch {
+    }
+  }
+  if (html) {
+    return /* @__PURE__ */ jsx13(
+      "div",
+      {
+        className: "shiki-wrapper [&>pre]:!m-0 [&>pre]:!rounded-t-none [&>pre]:!rounded-b-lg [&>pre]:!border [&>pre]:!border-t-0 [&>pre]:!border-border/50 [&>pre]:!p-3 [&>pre]:!text-xs [&>pre]:!leading-relaxed [&>pre]:overflow-x-auto",
+        dangerouslySetInnerHTML: { __html: html }
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx13(Pre, { children: /* @__PURE__ */ jsx13(Code2, { children: code }) });
+};
+var syntax_highlighter_default = ShikiSyntaxHighlighter;
+
+// src/chat/markdown-text.tsx
+import { jsx as jsx14, jsxs as jsxs8 } from "react/jsx-runtime";
+var MarkdownTextImpl = () => {
+  return /* @__PURE__ */ jsx14(
+    MarkdownTextPrimitive,
+    {
+      remarkPlugins: [remarkGfm, remarkMath],
+      rehypePlugins: [rehypeKatex],
+      className: "aui-md",
+      components: {
+        ...defaultComponents,
+        SyntaxHighlighter: syntax_highlighter_default
+      }
+    }
+  );
+};
+var MarkdownText = memo(MarkdownTextImpl);
+var CodeHeader = ({ language, code }) => {
+  const { isCopied, copyToClipboard } = useCopyToClipboard();
+  if (isArtifactFenceLanguage(language)) return null;
+  const onCopy = () => {
+    if (!code || isCopied) return;
+    copyToClipboard(code);
+  };
+  return /* @__PURE__ */ jsxs8("div", { className: "aui-code-header flex items-center justify-between rounded-t-lg border border-b-0 border-border/50 bg-code-header-bg px-4 py-2", children: [
+    /* @__PURE__ */ jsxs8("span", { className: "flex items-center gap-2 text-xs font-semibold tracking-wide text-muted-foreground/80 uppercase", children: [
+      /* @__PURE__ */ jsx14("span", { className: "inline-block h-2 w-2 rounded-full bg-primary/40" }),
+      language
+    ] }),
+    /* @__PURE__ */ jsxs8(
+      TooltipIconButton,
+      {
+        tooltip: isCopied ? "Copied!" : "Copy",
+        onClick: onCopy,
+        className: "transition-colors hover:text-foreground",
+        children: [
+          !isCopied && /* @__PURE__ */ jsx14(CopyIcon, { className: "h-3.5 w-3.5" }),
+          isCopied && /* @__PURE__ */ jsx14(CheckIcon2, { className: "h-3.5 w-3.5 text-emerald-500" })
+        ]
+      }
+    )
+  ] });
+};
+var useCopyToClipboard = ({
+  copiedDuration = 3e3
+} = {}) => {
+  const [isCopied, setIsCopied] = useState4(false);
+  const copyToClipboard = (value) => {
+    if (!value) return;
+    navigator.clipboard.writeText(value).then(() => {
+      setIsCopied(true);
+      setTimeout(() => setIsCopied(false), copiedDuration);
+    });
+  };
+  return { isCopied, copyToClipboard };
+};
+var defaultComponents = memoizeMarkdownComponents({
+  h1: ({ className, ...props }) => /* @__PURE__ */ jsx14(
+    "h1",
+    {
+      className: cn(
+        "aui-md-h1 mb-3 mt-6 scroll-m-20 text-xl font-bold tracking-tight first:mt-0 last:mb-0",
+        className
+      ),
+      ...props
+    }
+  ),
+  h2: ({ className, ...props }) => /* @__PURE__ */ jsx14(
+    "h2",
+    {
+      className: cn(
+        "aui-md-h2 mb-2.5 mt-5 scroll-m-20 border-b border-border/30 pb-1.5 text-lg font-semibold tracking-tight first:mt-0 last:mb-0",
+        className
+      ),
+      ...props
+    }
+  ),
+  h3: ({ className, ...props }) => /* @__PURE__ */ jsx14(
+    "h3",
+    {
+      className: cn(
+        "aui-md-h3 mb-2 mt-4 scroll-m-20 text-base font-semibold tracking-tight first:mt-0 last:mb-0",
+        className
+      ),
+      ...props
+    }
+  ),
+  h4: ({ className, ...props }) => /* @__PURE__ */ jsx14(
+    "h4",
+    {
+      className: cn(
+        "aui-md-h4 mb-1.5 mt-3 scroll-m-20 text-sm font-semibold first:mt-0 last:mb-0",
+        className
+      ),
+      ...props
+    }
+  ),
+  h5: ({ className, ...props }) => /* @__PURE__ */ jsx14(
+    "h5",
+    {
+      className: cn(
+        "aui-md-h5 mb-1 mt-2.5 text-sm font-medium first:mt-0 last:mb-0",
+        className
+      ),
+      ...props
+    }
+  ),
+  h6: ({ className, ...props }) => /* @__PURE__ */ jsx14(
+    "h6",
+    {
+      className: cn(
+        "aui-md-h6 mb-1 mt-2 text-sm font-medium text-muted-foreground first:mt-0 last:mb-0",
+        className
+      ),
+      ...props
+    }
+  ),
+  p: ({ className, ...props }) => /* @__PURE__ */ jsx14(
+    "p",
+    {
+      className: cn(
+        "aui-md-p my-3 leading-[1.7] first:mt-0 last:mb-0",
+        className
+      ),
+      ...props
+    }
+  ),
+  a: ({ className, ...props }) => /* @__PURE__ */ jsx14(
+    "a",
+    {
+      className: cn(
+        "aui-md-a font-medium text-primary underline decoration-primary/30 underline-offset-[3px] transition-colors hover:decoration-primary/80",
+        className
+      ),
+      target: "_blank",
+      rel: "noopener noreferrer",
+      ...props
+    }
+  ),
+  blockquote: ({ className, ...props }) => /* @__PURE__ */ jsx14(
+    "blockquote",
+    {
+      className: cn(
+        "aui-md-blockquote my-3 border-l-[3px] border-primary/30 bg-muted/30 py-1 pl-4 pr-2 text-muted-foreground italic [&>p]:my-1",
+        className
+      ),
+      ...props
+    }
+  ),
+  ul: ({ className, ...props }) => /* @__PURE__ */ jsx14(
+    "ul",
+    {
+      className: cn(
+        "aui-md-ul my-3 ml-1 list-none space-y-1.5 [&>li]:relative [&>li]:pl-5 [&>li]:before:absolute [&>li]:before:left-0 [&>li]:before:top-[0.6em] [&>li]:before:h-1.5 [&>li]:before:w-1.5 [&>li]:before:rounded-full [&>li]:before:bg-primary/30 [&>li]:before:content-['']",
+        className
+      ),
+      ...props
+    }
+  ),
+  ol: ({ className, ...props }) => /* @__PURE__ */ jsx14(
+    "ol",
+    {
+      className: cn(
+        "aui-md-ol my-3 ml-1 list-none space-y-1.5 [counter-reset:list-counter] [&>li]:relative [&>li]:pl-7 [&>li]:[counter-increment:list-counter] [&>li]:before:absolute [&>li]:before:left-0 [&>li]:before:top-0 [&>li]:before:flex [&>li]:before:h-[1.7em] [&>li]:before:w-5 [&>li]:before:items-center [&>li]:before:justify-center [&>li]:before:rounded-md [&>li]:before:bg-primary/[0.07] [&>li]:before:text-xs [&>li]:before:font-semibold [&>li]:before:text-primary/60 [&>li]:before:content-[counter(list-counter)]",
+        className
+      ),
+      ...props
+    }
+  ),
+  hr: ({ className, ...props }) => /* @__PURE__ */ jsx14(
+    "hr",
+    {
+      className: cn(
+        "aui-md-hr my-6 border-none h-px bg-gradient-to-r from-transparent via-border to-transparent",
+        className
+      ),
+      ...props
+    }
+  ),
+  table: ({ className, ...props }) => /* @__PURE__ */ jsx14("div", { className: "my-4 w-full overflow-x-auto rounded-lg border border-border/50", children: /* @__PURE__ */ jsx14(
+    "table",
+    {
+      className: cn("aui-md-table w-full border-collapse text-sm", className),
+      ...props
+    }
+  ) }),
+  th: ({ className, ...props }) => /* @__PURE__ */ jsx14(
+    "th",
+    {
+      className: cn(
+        "aui-md-th border-b border-border/50 bg-muted/60 px-3 py-2 text-left text-xs font-semibold uppercase tracking-wider text-muted-foreground [[align=center]]:text-center [[align=right]]:text-right",
+        className
+      ),
+      ...props
+    }
+  ),
+  td: ({ className, ...props }) => /* @__PURE__ */ jsx14(
+    "td",
+    {
+      className: cn(
+        "aui-md-td border-b border-border/30 px-3 py-2 [[align=center]]:text-center [[align=right]]:text-right",
+        className
+      ),
+      ...props
+    }
+  ),
+  tr: ({ className, ...props }) => /* @__PURE__ */ jsx14(
+    "tr",
+    {
+      className: cn(
+        "aui-md-tr transition-colors hover:bg-muted/30 [&:last-child>td]:border-b-0",
+        className
+      ),
+      ...props
+    }
+  ),
+  li: ({ className, ...props }) => /* @__PURE__ */ jsx14("li", { className: cn("aui-md-li leading-[1.7]", className), ...props }),
+  sup: ({ className, ...props }) => /* @__PURE__ */ jsx14(
+    "sup",
+    {
+      className: cn(
+        "aui-md-sup [&>a]:text-[0.7em] [&>a]:font-semibold [&>a]:text-primary/70 [&>a]:no-underline [&>a]:transition-colors [&>a]:hover:text-primary",
+        className
+      ),
+      ...props
+    }
+  ),
+  pre: ({ className, ...props }) => /* @__PURE__ */ jsx14(
+    "pre",
+    {
+      className: cn(
+        "aui-md-pre overflow-x-auto rounded-t-none rounded-b-lg border border-t-0 border-border/50 bg-code-block-bg p-4 text-[13px] leading-relaxed",
+        className
+      ),
+      ...props
+    }
+  ),
+  code: function Code({ className, ...props }) {
+    const isCodeBlock = useIsMarkdownCodeBlock();
+    return /* @__PURE__ */ jsx14(
+      "code",
+      {
+        className: cn(
+          !isCodeBlock && "aui-md-inline-code rounded-[5px] border border-border/60 bg-muted/60 px-[0.4em] py-[0.15em] font-mono text-[0.85em] font-medium text-foreground/90",
+          className
+        ),
+        ...props
+      }
+    );
+  },
+  strong: ({ className, ...props }) => /* @__PURE__ */ jsx14("strong", { className: cn("font-semibold text-foreground", className), ...props }),
+  em: ({ className, ...props }) => /* @__PURE__ */ jsx14("em", { className: cn("italic", className), ...props }),
+  CodeHeader
+});
+
+// src/auth/tokens.ts
+var ACCESS_TOKEN_KEY = "timbal_project_access_token";
+var REFRESH_TOKEN_KEY = "timbal_project_refresh_token";
+var getAccessToken = () => localStorage.getItem(ACCESS_TOKEN_KEY);
+var setAccessToken = (token) => localStorage.setItem(ACCESS_TOKEN_KEY, token);
+var getRefreshToken = () => localStorage.getItem(REFRESH_TOKEN_KEY);
+var setRefreshToken = (token) => localStorage.setItem(REFRESH_TOKEN_KEY, token);
+var clearTokens = () => {
+  localStorage.removeItem(ACCESS_TOKEN_KEY);
+  localStorage.removeItem(REFRESH_TOKEN_KEY);
+};
+var refreshPromise = null;
+var refreshAccessToken = async () => {
+  const refreshToken = getRefreshToken();
+  if (!refreshToken) return false;
+  if (refreshPromise) return refreshPromise;
+  refreshPromise = (async () => {
+    try {
+      const res = await fetch("/api/auth/refresh", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ refresh_token: refreshToken })
+      });
+      if (!res.ok) {
+        clearTokens();
+        return false;
+      }
+      const data = await res.json();
+      if (data.access_token) {
+        localStorage.setItem(ACCESS_TOKEN_KEY, data.access_token);
+      }
+      if (data.refresh_token) {
+        localStorage.setItem(REFRESH_TOKEN_KEY, data.refresh_token);
+      }
+      return true;
+    } catch {
+      clearTokens();
+      return false;
+    } finally {
+      refreshPromise = null;
+    }
+  })();
+  return refreshPromise;
+};
+var authFetch = async (url, options) => {
+  const token = getAccessToken();
+  let res = await fetch(url, {
+    ...options,
+    headers: {
+      ...options?.headers,
+      ...token ? { Authorization: `Bearer ${token}` } : {}
+    }
+  });
+  if (res.status === 401 && getRefreshToken()) {
+    const refreshed = await refreshAccessToken();
+    if (refreshed) {
+      const newToken = getAccessToken();
+      res = await fetch(url, {
+        ...options,
+        headers: {
+          ...options?.headers,
+          ...newToken ? { Authorization: `Bearer ${newToken}` } : {}
+        }
+      });
+    }
+  }
+  return res;
+};
+var fetchCurrentUser = async () => {
+  try {
+    const token = getAccessToken();
+    const res = await fetch("/api/me", {
+      headers: token ? { Authorization: `Bearer ${token}` } : {}
+    });
+    if (!res.ok) return null;
+    return await res.json();
+  } catch {
+    return null;
+  }
+};
+
+// src/runtime/upload-adapter.ts
+var DEFAULT_UPLOAD_ACCEPT = "image/*,application/pdf,text/*,.md,.json,.csv,.tsv,.xlsx,.docx";
+function createDefaultAttachmentAdapter({
+  baseUrl = "",
+  uploadUrl,
+  fetch: fetchFn = authFetch,
+  accept = DEFAULT_UPLOAD_ACCEPT
+} = {}) {
+  const base = baseUrl.replace(/\/$/, "");
+  const resolvedUploadUrl = uploadUrl ?? `${base}/files/upload`;
+  return {
+    accept,
+    async add({ file }) {
+      const isImage = file.type.startsWith("image/");
+      const pending = {
+        id: crypto.randomUUID(),
+        type: isImage ? "image" : "file",
+        name: file.name,
+        contentType: file.type || "application/octet-stream",
+        file,
+        status: { type: "requires-action", reason: "composer-send" }
+      };
+      return pending;
+    },
+    async send(attachment) {
+      const fd = new FormData();
+      fd.append("file", attachment.file);
+      const res = await fetchFn(resolvedUploadUrl, { method: "POST", body: fd });
+      if (!res.ok) {
+        const detail = await res.text().catch(() => "");
+        throw new Error(
+          `Attachment upload failed (${res.status}): ${detail || res.statusText}`
+        );
+      }
+      const remoteUrl = await readUploadedUrl(res);
+      const mime = attachment.contentType ?? "application/octet-stream";
+      const filename = attachment.name;
+      const complete = {
+        ...attachment,
+        status: { type: "complete" },
+        content: mime.startsWith("image/") ? [{ type: "image", image: remoteUrl, filename }] : [{ type: "file", data: remoteUrl, mimeType: mime, filename }]
+      };
+      return complete;
+    },
+    async remove() {
+    }
+  };
+}
+var createUploadAttachmentAdapter = createDefaultAttachmentAdapter;
+async function readUploadedUrl(res) {
+  const contentType = res.headers.get("content-type") ?? "";
+  if (contentType.includes("application/json")) {
+    const data = await res.json();
+    const raw = data.url ?? data.signed_url ?? data.id;
+    const candidate = typeof raw === "string" ? raw : typeof raw === "number" ? String(raw) : "";
+    if (candidate.length > 0) {
+      return candidate;
+    }
+    throw new Error(
+      "Attachment upload response did not include a `url`, `signed_url`, or `id` field."
+    );
+  }
+  const text = (await res.text()).trim();
+  if (!text) {
+    throw new Error("Attachment upload response was empty.");
+  }
+  return text;
+}
+
+// src/runtime/resolve-attachments.ts
+function isAttachmentAdapter(value) {
+  return typeof value === "object" && value !== null && "accept" in value && typeof value.add === "function" && typeof value.send === "function" && typeof value.remove === "function";
+}
+function resolveAttachmentAdapter(attachments, options = {}) {
+  const baseUrl = options.baseUrl ?? "/api";
+  const legacyUploadUrl = options.uploadUrl;
+  const legacyAccept = options.accept;
+  if (attachments === null) return void 0;
+  const legacyEnables = legacyUploadUrl !== void 0 || legacyAccept !== void 0;
+  if (attachments === void 0) {
+    if (!legacyEnables) return void 0;
+    return createDefaultAttachmentAdapter({
+      baseUrl,
+      fetch: options.fetch,
+      uploadUrl: legacyUploadUrl,
+      accept: legacyAccept
+    });
+  }
+  if (attachments === true) {
+    return createDefaultAttachmentAdapter({
+      baseUrl,
+      fetch: options.fetch,
+      uploadUrl: legacyUploadUrl,
+      accept: legacyAccept
+    });
+  }
+  if (isAttachmentAdapter(attachments)) return attachments;
+  const config = attachments;
+  return createDefaultAttachmentAdapter({
+    baseUrl,
+    fetch: options.fetch,
+    uploadUrl: config.uploadUrl ?? legacyUploadUrl,
+    accept: config.accept ?? legacyAccept
+  });
+}
+
+// src/runtime/provider.tsx
+import {
+  createContext as createContext4,
+  useCallback as useCallback3,
+  useContext as useContext4,
+  useEffect as useEffect3,
+  useMemo as useMemo3,
+  useRef,
+  useState as useState5
+} from "react";
+import {
+  useExternalStoreRuntime,
+  AssistantRuntimeProvider
+} from "@assistant-ui/react";
+import { parseSSELine } from "@timbal-ai/timbal-sdk";
+
+// src/runtime/reducer.ts
+function createReducerState() {
+  return { parts: [], toolIndexById: /* @__PURE__ */ new Map() };
+}
+function reduceSseEvent(state, event) {
+  switch (event.type) {
+    case "DELTA":
+      return reduceDelta(state, event.item);
+    case "OUTPUT": {
+      const path = event.path;
+      const isNested = typeof path === "string" && path.includes(".");
+      if (!isNested) {
+        const errorMessage = readErrorMessage(event);
+        if (errorMessage) {
+          state.parts.push({ type: "text", text: `**Error:** ${errorMessage}` });
+          return true;
+        }
+      }
+      if (isNested) {
+        return reduceNestedOutput(
+          state,
+          path,
+          event.output
+        );
+      }
+      return reduceOutput(
+        state,
+        event.output
+      );
+    }
+    default:
+      return false;
+  }
+}
+function reduceDelta(state, item) {
+  if (!item) return false;
+  if (item.type === "text_delta" && typeof item.text_delta === "string") {
+    lastTextPart(state).text += item.text_delta;
+    return true;
+  }
+  if (item.type === "thinking_delta" && typeof item.thinking_delta === "string") {
+    lastThinkingPart(state).text += item.thinking_delta;
+    return true;
+  }
+  if (item.type === "tool_use") {
+    const toolCallId = item.id || `tool-${crypto.randomUUID()}`;
+    const inputStr = stringifyInput(item.input);
+    const part = {
+      type: "tool-call",
+      toolCallId,
+      toolName: item.name || "unknown",
+      argsText: inputStr,
+      status: "running"
+    };
+    state.parts.push(part);
+    state.toolIndexById.set(toolCallId, state.parts.length - 1);
+    return true;
+  }
+  if (item.type === "tool_use_delta") {
+    const idx = state.toolIndexById.get(item.id);
+    if (idx !== void 0 && typeof item.input_delta === "string") {
+      state.parts[idx].argsText += item.input_delta;
+      return true;
+    }
+  }
+  return false;
+}
+function reduceNestedOutput(state, path, output) {
+  if (!output || typeof output !== "object") return false;
+  if (!Array.isArray(output.content) && isArtifact(output)) {
+    const toolName = toolNameFromPath(path);
+    if (toolName && attachToolResult(state, { toolName, result: output })) {
+      return true;
+    }
+  }
+  return reduceOutput(state, output, { toolResultsOnly: true, allowOrphan: false });
+}
+function reduceOutput(state, output, options) {
+  if (!output) return false;
+  if (typeof output === "string") {
+    if (state.parts.length === 0) {
+      state.parts.push({ type: "text", text: output });
+      return true;
+    }
+    return false;
+  }
+  if (Array.isArray(output.content)) {
+    let changed = false;
+    const blocks = output.content;
+    for (const block of blocks) {
+      if (block.type === "tool_use") {
+        if (!options?.toolResultsOnly && recordToolUse(state, block)) {
+          changed = true;
+        }
+      } else if (block.type === "tool_result") {
+        if (recordToolResult(state, block, options)) changed = true;
+      } else if (!options?.toolResultsOnly) {
+        if (block.type === "text" && typeof block.text === "string" && !lastTextPart(state).text) {
+          lastTextPart(state).text = block.text;
+          changed = true;
+        } else if (block.type === "thinking" && typeof block.thinking === "string" && !lastThinkingPart(state).text) {
+          lastThinkingPart(state).text = block.thinking;
+          changed = true;
+        }
+      }
+    }
+    return changed;
+  }
+  if (state.parts.length === 0) {
+    state.parts.push({ type: "text", text: JSON.stringify(output) });
+    return true;
+  }
+  return false;
+}
+function recordToolUse(state, block) {
+  const id = block.id || `tool-${crypto.randomUUID()}`;
+  if (state.toolIndexById.has(id)) return false;
+  const inputStr = stringifyInput(block.input);
+  const part = {
+    type: "tool-call",
+    toolCallId: id,
+    toolName: block.name || "unknown",
+    argsText: inputStr,
+    status: "running"
+  };
+  state.parts.push(part);
+  state.toolIndexById.set(id, state.parts.length - 1);
+  return true;
+}
+function recordToolResult(state, block, options) {
+  const allowOrphan = options?.allowOrphan !== false;
+  const id = block.id || block.tool_use_id || "";
+  const { result, resultText } = parseToolResultContent(block.content);
+  const toolName = block.name || void 0;
+  if (id) {
+    const idx = state.toolIndexById.get(id);
+    if (idx !== void 0) {
+      const part2 = state.parts[idx];
+      part2.result = result;
+      if (resultText) part2.resultText = resultText;
+      part2.status = "complete";
+      return true;
+    }
+    if (!allowOrphan) return false;
+  }
+  if (!id && toolName && attachToolResult(state, {
+    toolName,
+    result,
+    resultText
+  })) {
+    return true;
+  }
+  if (!id || !allowOrphan) return false;
+  const part = {
+    type: "tool-call",
+    toolCallId: id,
+    toolName: toolName || "unknown",
+    argsText: "",
+    result,
+    resultText,
+    status: "complete"
+  };
+  state.parts.push(part);
+  state.toolIndexById.set(id, state.parts.length - 1);
+  return true;
+}
+function toolNameFromPath(path) {
+  const segment = path.split(".").pop();
+  return segment && segment !== "agent" && segment !== "llm" ? segment : null;
+}
+function attachToolResult(state, {
+  toolCallId,
+  toolName,
+  result,
+  resultText
+}) {
+  if (toolCallId) {
+    const idx = state.toolIndexById.get(toolCallId);
+    if (idx !== void 0) {
+      const part = state.parts[idx];
+      part.result = result;
+      if (resultText) part.resultText = resultText;
+      part.status = "complete";
+      return true;
+    }
+  }
+  if (toolName) {
+    for (let i = state.parts.length - 1; i >= 0; i--) {
+      const part = state.parts[i];
+      if (part.type === "tool-call" && part.toolName === toolName && part.result === void 0) {
+        part.result = result;
+        if (resultText) part.resultText = resultText;
+        part.status = "complete";
+        return true;
+      }
+    }
+  }
+  return false;
+}
+function parseToolResultContent(content) {
+  if (typeof content === "string") {
+    return { result: content, resultText: content };
+  }
+  if (!Array.isArray(content)) {
+    return { result: content };
+  }
+  const textChunks = [];
+  for (const item of content) {
+    if (typeof item === "string") {
+      textChunks.push(item);
+    } else if (item && typeof item === "object") {
+      const obj = item;
+      if (obj.type === "text" && typeof obj.text === "string") {
+        textChunks.push(obj.text);
+      } else if (obj.type === "thinking" && typeof obj.thinking === "string") {
+        textChunks.push(obj.thinking);
+      }
+    }
+  }
+  return {
+    result: content,
+    resultText: textChunks.length > 0 ? textChunks.join("\n") : void 0
+  };
+}
+function readErrorMessage(event) {
+  const status = event.status;
+  const isErrorStatus = status?.code === "error";
+  const error = event.error;
+  let type = null;
+  let message = null;
+  if (isErrorStatus && typeof status?.message === "string" && status.message.length > 0) {
+    message = status.message;
+  }
+  if (!message && typeof error === "string" && error.length > 0) {
+    message = error;
+  } else if (error && typeof error === "object") {
+    const obj = error;
+    if (typeof obj.type === "string" && obj.type.length > 0) {
+      type = obj.type;
+    }
+    if (!message && typeof obj.message === "string" && obj.message.length > 0) {
+      message = obj.message;
+    }
+  }
+  if (!message && !isErrorStatus) return null;
+  if (!message) return "The agent failed to generate a response.";
+  const compact = compactError(message);
+  return type ? `${type}: ${compact}` : compact;
+}
+var ERROR_MAX_CHARS = 480;
+function compactError(message) {
+  const trimmed = message.split(/\n\s*Traceback \(most recent call last\):/u)[0].trim();
+  if (trimmed.length <= ERROR_MAX_CHARS) return trimmed;
+  return `${trimmed.slice(0, ERROR_MAX_CHARS).trimEnd()}\u2026`;
+}
+function stringifyInput(input) {
+  if (input === void 0 || input === null) return "{}";
+  return typeof input === "string" ? input : JSON.stringify(input);
+}
+function lastTextPart(state) {
+  const last = state.parts[state.parts.length - 1];
+  if (last?.type === "text") return last;
+  const next = { type: "text", text: "" };
+  state.parts.push(next);
+  return next;
+}
+function lastThinkingPart(state) {
+  const last = state.parts[state.parts.length - 1];
+  if (last?.type === "thinking") return last;
+  const next = { type: "thinking", text: "" };
+  state.parts.push(next);
+  return next;
+}
+
+// src/runtime/attachments.ts
+async function extractAttachment(attachment) {
+  const file = attachment.file;
+  let src = null;
+  let contentType;
+  let name = attachment.name ?? file?.name;
+  const content = attachment.content;
+  if (content) {
+    for (const block of content) {
+      if (block.type === "image" && typeof block.image === "string") {
+        src = block.image;
+        if (typeof block.mimeType === "string") {
+          contentType = block.mimeType;
+        }
+        break;
+      }
+      if (block.type === "file" && typeof block.data === "string") {
+        src = block.data;
+        if (typeof block.mimeType === "string") contentType = block.mimeType;
+        break;
+      }
+    }
+  }
+  if (src === null && file) {
+    src = await fileToDataUrl(file);
+    if (!contentType) contentType = file.type || void 0;
+    if (!name) name = file.name;
+  }
+  if (!src) return null;
+  if (!contentType) contentType = mimeFromDataUrl(src);
+  const rawType = String(attachment.type ?? "file");
+  const type = rawType === "image" || rawType === "document" ? rawType : "file";
+  return {
+    id: attachment.id ?? crypto.randomUUID(),
+    type,
+    ...name !== void 0 ? { name } : {},
+    ...contentType !== void 0 ? { contentType } : {},
+    dataUrl: src
+  };
+}
+function fileToDataUrl(file) {
+  return new Promise((resolve, reject) => {
+    const reader = new FileReader();
+    reader.onload = () => resolve(reader.result);
+    reader.onerror = () => reject(reader.error);
+    reader.readAsDataURL(file);
+  });
+}
+function mimeFromDataUrl(dataUrl) {
+  const match = /^data:([^;,]+)[;,]/.exec(dataUrl);
+  return match?.[1];
+}
+function buildPromptBody({
+  input,
+  attachments,
+  parentId
+}) {
+  const context = { parent_id: parentId };
+  const files = attachments ?? [];
+  if (files.length === 0) {
+    return { prompt: input, context };
+  }
+  const parts = [];
+  if (input) parts.push({ type: "text", text: input });
+  for (const attachment of files) {
+    parts.push({ type: "file", file: attachment.dataUrl });
+  }
+  return { prompt: parts, context };
+}
+
+// src/runtime/attachments-context.tsx
+import { createContext as createContext3, useContext as useContext3 } from "react";
+import { jsx as jsx15 } from "react/jsx-runtime";
+var TimbalAttachmentsEnabledContext = createContext3(false);
+function TimbalAttachmentsEnabledProvider({
+  enabled,
+  children
+}) {
+  return /* @__PURE__ */ jsx15(TimbalAttachmentsEnabledContext.Provider, { value: enabled, children });
+}
+function useTimbalAttachmentsEnabled() {
+  return useContext3(TimbalAttachmentsEnabledContext);
+}
+
+// src/runtime/provider.tsx
+import { jsx as jsx16 } from "react/jsx-runtime";
+function projectAttachment(attachment) {
+  const filename = attachment.name ?? "attachment";
+  const mimeType = attachment.contentType ?? "application/octet-stream";
+  if (attachment.type === "image") {
+    return {
+      id: attachment.id,
+      type: "image",
+      name: filename,
+      contentType: mimeType,
+      status: { type: "complete" },
+      content: [{ type: "image", image: attachment.dataUrl, filename }]
+    };
+  }
+  return {
+    id: attachment.id,
+    type: attachment.type,
+    name: filename,
+    contentType: mimeType,
+    status: { type: "complete" },
+    content: [
+      { type: "file", data: attachment.dataUrl, mimeType, filename }
+    ]
+  };
+}
+var convertMessage = (message) => {
+  const content = message.content.map((part) => {
+    if (part.type === "text") return { type: "text", text: part.text };
+    if (part.type === "thinking") return { type: "reasoning", text: part.text };
+    return {
+      type: "tool-call",
+      toolCallId: part.toolCallId,
+      toolName: part.toolName,
+      argsText: part.argsText,
+      ...part.result !== void 0 ? { result: part.result } : {}
+    };
+  });
+  const attachments = message.attachments && message.attachments.length > 0 ? message.attachments.map(projectAttachment) : void 0;
+  return {
+    role: message.role,
+    content,
+    id: message.id,
+    ...attachments ? { attachments } : {}
+  };
+};
+function findParentId(messages, beforeIndex) {
+  const slice = beforeIndex !== void 0 ? messages.slice(0, beforeIndex) : messages;
+  for (let i = slice.length - 1; i >= 0; i--) {
+    if (slice[i].role === "assistant" && slice[i].runId) return slice[i].runId;
+  }
+  return null;
+}
+function getTextFromMessage(message) {
+  const part = message.content.find((c) => c.type === "text");
+  return part?.type === "text" ? part.text : "";
+}
+function getAttachmentsFromMessage(message) {
+  return message.attachments?.length ? message.attachments : void 0;
+}
+function useTimbalStream({
+  workforceId,
+  baseUrl = "/api",
+  fetch: fetchFn,
+  debug = false
+}) {
+  const [messages, setMessages] = useState5([]);
+  const [isRunning, setIsRunning] = useState5(false);
+  const abortRef = useRef(null);
+  const messagesRef = useRef([]);
+  const fetchFnRef = useRef(fetchFn ?? authFetch);
+  useEffect3(() => {
+    fetchFnRef.current = fetchFn ?? authFetch;
+  }, [fetchFn]);
+  const debugRef = useRef(debug);
+  useEffect3(() => {
+    debugRef.current = debug;
+  }, [debug]);
+  useEffect3(() => {
+    messagesRef.current = messages;
+  }, [messages]);
+  const streamAssistantResponse = useCallback3(
+    async (input, attachments, userId, assistantId, parentId, signal) => {
+      const state = createReducerState();
+      const flush = () => {
+        setMessages(
+          (prev) => prev.map(
+            (m) => m.id === assistantId ? { ...m, content: [...state.parts] } : m
+          )
+        );
+      };
+      const stampRunId = (runId) => {
+        setMessages(
+          (prev) => prev.map(
+            (m) => m.id === userId || m.id === assistantId ? { ...m, runId } : m
+          )
+        );
+      };
+      try {
+        const body = buildPromptBody({ input, attachments, parentId });
+        const res = await fetchFnRef.current(
+          `${baseUrl}/workforce/${workforceId}/stream`,
+          {
+            method: "POST",
+            headers: { "Content-Type": "application/json" },
+            body: JSON.stringify(body),
+            signal
+          }
+        );
+        if (!res.ok || !res.body) throw new Error(`Request failed: ${res.status}`);
+        const reader = res.body.getReader();
+        const decoder = new TextDecoder();
+        let buffer = "";
+        let capturedRunId = null;
+        while (true) {
+          const { done, value } = await reader.read();
+          if (done) break;
+          buffer += decoder.decode(value, { stream: true });
+          const lines = buffer.split("\n");
+          buffer = lines.pop() ?? "";
+          for (const line of lines) {
+            const event = parseSSELine(line);
+            if (!event) continue;
+            if (debugRef.current) {
+              console.debug("[timbal]", event.type, event);
+            }
+            if (!capturedRunId) {
+              const runId = readTopLevelStartRunId(event);
+              if (runId) {
+                capturedRunId = runId;
+                stampRunId(runId);
+              }
+            }
+            const changed = reduceSseEvent(state, event);
+            if (changed) flush();
+          }
+        }
+        if (buffer.trim()) {
+          const event = parseSSELine(buffer);
+          if (event) {
+            if (debugRef.current) {
+              console.debug("[timbal]", event.type, event);
+            }
+            if (reduceSseEvent(state, event)) flush();
+          }
+        }
+      } catch (err) {
+        if (err.name !== "AbortError") {
+          if (state.parts.length === 0) {
+            state.parts.push({ type: "text", text: "Something went wrong." });
+          }
+          flush();
+        }
+      } finally {
+        setIsRunning(false);
+        abortRef.current = null;
+      }
+    },
+    [workforceId, baseUrl]
+  );
+  const send = useCallback3(
+    async (input, options) => {
+      const userId = crypto.randomUUID();
+      const assistantId = crypto.randomUUID();
+      const base = messagesRef.current;
+      const parentId = options?.parentId !== void 0 ? options.parentId : findParentId(base);
+      const userMessage = {
+        id: userId,
+        role: "user",
+        content: input ? [{ type: "text", text: input }] : [],
+        ...options?.attachments && options.attachments.length > 0 ? { attachments: options.attachments } : {}
+      };
+      setMessages([
+        ...base,
+        userMessage,
+        { id: assistantId, role: "assistant", content: [] }
+      ]);
+      setIsRunning(true);
+      const controller = new AbortController();
+      abortRef.current = controller;
+      await streamAssistantResponse(
+        input,
+        options?.attachments,
+        userId,
+        assistantId,
+        parentId,
+        controller.signal
+      );
+    },
+    [streamAssistantResponse]
+  );
+  const reload = useCallback3(
+    async (messageId) => {
+      const current = messagesRef.current;
+      const idx = messageId ? current.findIndex((m) => m.id === messageId) : current.length - 2;
+      const userMessage = idx >= 0 ? current[idx] : null;
+      if (!userMessage || userMessage.role !== "user") return;
+      const input = getTextFromMessage(userMessage);
+      const messageAttachments = getAttachmentsFromMessage(userMessage);
+      if (!input && !messageAttachments?.length) return;
+      const assistantId = crypto.randomUUID();
+      const parentId = findParentId(current, idx);
+      setMessages((prev) => [
+        ...prev.slice(0, idx + 1),
+        { id: assistantId, role: "assistant", content: [] }
+      ]);
+      setIsRunning(true);
+      const controller = new AbortController();
+      abortRef.current = controller;
+      await streamAssistantResponse(
+        input,
+        messageAttachments,
+        userMessage.id,
+        assistantId,
+        parentId,
+        controller.signal
+      );
+    },
+    [streamAssistantResponse]
+  );
+  const cancel = useCallback3(() => {
+    abortRef.current?.abort();
+  }, []);
+  const clear = useCallback3(() => {
+    abortRef.current?.abort();
+    setMessages([]);
+  }, []);
+  return useMemo3(
+    () => ({ messages, isRunning, send, reload, cancel, clear }),
+    [messages, isRunning, send, reload, cancel, clear]
+  );
+}
+function readTopLevelStartRunId(event) {
+  if (event.type === "START" && typeof event.run_id === "string" && typeof event.path === "string" && !event.path.includes(".")) {
+    return event.run_id;
+  }
+  return null;
+}
+var TimbalStreamContext = createContext4(null);
+function useTimbalRuntime() {
+  const ctx = useContext4(TimbalStreamContext);
+  if (!ctx) {
+    throw new Error(
+      "useTimbalRuntime must be used inside a <TimbalRuntimeProvider>."
+    );
+  }
+  return ctx;
+}
+function TimbalRuntimeProvider({
+  workforceId,
+  children,
+  baseUrl = "/api",
+  fetch: fetchFn,
+  attachments,
+  attachmentsUploadUrl,
+  attachmentsAccept,
+  debug
+}) {
+  const stream = useTimbalStream({
+    workforceId,
+    baseUrl,
+    fetch: fetchFn,
+    debug
+  });
+  const attachmentAdapter = useMemo3(
+    () => resolveAttachmentAdapter(attachments, {
+      baseUrl,
+      fetch: fetchFn,
+      uploadUrl: attachmentsUploadUrl,
+      accept: attachmentsAccept
+    }),
+    [attachments, attachmentsUploadUrl, attachmentsAccept, baseUrl, fetchFn]
+  );
+  const onNew = useCallback3(
+    async (message) => {
+      const textPart = message.content.find((c) => c.type === "text");
+      const input = textPart && textPart.type === "text" ? textPart.text : "";
+      const auiAttachments = message.attachments;
+      const attachments2 = auiAttachments ? (await Promise.all(auiAttachments.map(extractAttachment))).filter((a) => a !== null) : [];
+      if (!input && attachments2.length === 0) return;
+      const parentId = message.parentId !== null && message.parentId !== void 0 ? findParentIdFromAuiParent(stream.messages, message.parentId) : void 0;
+      await stream.send(input, {
+        attachments: attachments2.length > 0 ? attachments2 : void 0,
+        ...parentId !== void 0 ? { parentId } : {}
+      });
+    },
+    [stream]
+  );
+  const onReload = useCallback3(
+    async (messageId) => {
+      await stream.reload(messageId);
+    },
+    [stream]
+  );
+  const onCancel = useCallback3(async () => {
+    stream.cancel();
+  }, [stream]);
+  const runtime = useExternalStoreRuntime({
+    isRunning: stream.isRunning,
+    messages: stream.messages,
+    convertMessage,
+    onNew,
+    onEdit: onNew,
+    onReload,
+    onCancel,
+    ...attachmentAdapter ? { adapters: { attachments: attachmentAdapter } } : {}
+  });
+  return /* @__PURE__ */ jsx16(TimbalStreamContext.Provider, { value: stream, children: /* @__PURE__ */ jsx16(TimbalAttachmentsEnabledProvider, { enabled: attachmentAdapter !== void 0, children: /* @__PURE__ */ jsx16(AssistantRuntimeProvider, { runtime, children }) }) });
+}
+function findParentIdFromAuiParent(messages, auiParentId) {
+  const idx = messages.findIndex((m) => m.id === auiParentId);
+  if (idx < 0) return null;
+  return findParentId(messages.slice(0, idx + 1));
+}
+
+// src/chat/tool-fallback.tsx
+import { memo as memo2, useMemo as useMemo4, useState as useState6 } from "react";
+import { ChevronRightIcon } from "lucide-react";
+import {
+  useAuiState as useAuiState2
+} from "@assistant-ui/react";
+
+// src/chat/motion.tsx
+import { AnimatePresence, motion as motion2, useReducedMotion } from "motion/react";
+import { jsx as jsx17 } from "react/jsx-runtime";
+var luxuryEase = [0.16, 1, 0.3, 1];
+var TOOL_ENTER_MS = 0.78;
+var TOOL_EXIT_MS = 0.28;
+function toolPresenceTransition(reduced) {
+  return {
+    enter: {
+      duration: reduced ? 0.35 : TOOL_ENTER_MS,
+      ease: luxuryEase
+    },
+    exit: {
+      duration: reduced ? 0.2 : TOOL_EXIT_MS,
+      ease: [0.4, 0, 1, 1]
+    }
+  };
+}
+function toolMotionState(reduced, entering, variant) {
+  if (reduced) {
+    return entering ? { opacity: 0, y: variant === "executing" ? 8 : 10 } : { opacity: 1, y: 0 };
+  }
+  if (variant === "executing") {
+    return entering ? { opacity: 0, y: 12 } : { opacity: 1, y: 0 };
+  }
+  return entering ? { opacity: 0, y: 14, filter: "blur(10px)" } : { opacity: 1, y: 0, filter: "blur(0px)" };
+}
+function ToolMotion({ children, className, motionKey }) {
+  const reduced = useReducedMotion() ?? false;
+  const { enter, exit } = toolPresenceTransition(reduced);
+  return /* @__PURE__ */ jsx17(
+    motion2.div,
+    {
+      className: cn("aui-tool-motion w-full min-w-0", className),
+      initial: toolMotionState(reduced, true, "settled"),
+      animate: toolMotionState(reduced, false, "settled"),
+      exit: reduced ? { opacity: 0, y: 6, transition: exit } : { opacity: 0, y: 8, filter: "blur(6px)", transition: exit },
+      transition: enter,
+      style: { willChange: "opacity, transform, filter" },
+      children
+    },
+    motionKey
+  );
+}
+function ToolPresence({
+  presenceKey,
+  children,
+  className,
+  variant = "settled"
+}) {
+  const reduced = useReducedMotion() ?? false;
+  const { enter, exit } = toolPresenceTransition(reduced);
+  const enterTransition = variant === "executing" ? { duration: reduced ? 0.3 : 0.52, ease: luxuryEase } : enter;
+  return /* @__PURE__ */ jsx17(AnimatePresence, { mode: "wait", initial: true, children: /* @__PURE__ */ jsx17(
+    motion2.div,
+    {
+      className: cn("aui-tool-presence w-full min-w-0", className),
+      initial: toolMotionState(reduced, true, variant),
+      animate: toolMotionState(reduced, false, variant),
+      exit: reduced ? { opacity: 0, y: 6, transition: exit } : { opacity: 0, y: 8, filter: "blur(6px)", transition: exit },
+      transition: enterTransition,
+      style: {
+        willChange: variant === "executing" ? "opacity, transform" : "opacity, transform, filter"
+      },
+      children
+    },
+    presenceKey
+  ) });
+}
+function ToolBodyPresence({
+  open,
+  children,
+  className
+}) {
+  const reduced = useReducedMotion() ?? false;
+  return /* @__PURE__ */ jsx17(
+    "div",
+    {
+      className: cn(
+        "aui-tool-body grid min-h-0 transition-[grid-template-rows]",
+        open ? reduced ? "duration-200 ease-out" : "duration-[340ms] ease-[cubic-bezier(0.16,1,0.3,1)]" : reduced ? "duration-150 ease-[cubic-bezier(0.4,0,0.2,1)]" : "duration-200 ease-[cubic-bezier(0.4,0,0.2,1)]"
+      ),
+      style: { gridTemplateRows: open ? "1fr" : "0fr" },
+      children: /* @__PURE__ */ jsx17("div", { className: "min-h-0 overflow-hidden", children: /* @__PURE__ */ jsx17(
+        "div",
+        {
+          className: cn(
+            className,
+            "transition-opacity",
+            open ? reduced ? "opacity-100 duration-200 ease-out" : "opacity-100 duration-300 ease-[cubic-bezier(0.16,1,0.3,1)] delay-75" : reduced ? "opacity-0 duration-100 ease-in" : "opacity-0 duration-150 ease-[cubic-bezier(0.4,0,0.2,1)]"
+          ),
+          children
+        }
+      ) })
+    }
+  );
+}
+
+// src/chat/tool-fallback.tsx
+import { jsx as jsx18, jsxs as jsxs9 } from "react/jsx-runtime";
+function detectRunning({
+  status,
+  result,
+  streamRunning
+}) {
+  const isError = status?.type === "incomplete" && status.reason !== "cancelled";
+  if (isError) return false;
+  if (status?.type === "running") return true;
+  if (status?.type === "complete") return false;
+  return streamRunning && result === void 0;
+}
+function useToolRunning(props) {
+  const { isRunning: streamRunning } = useTimbalRuntime();
+  const partStatus = useAuiState2((s) => s.part.status);
+  return detectRunning({
+    status: partStatus ?? props.status,
+    result: props.result,
+    streamRunning
+  });
+}
+function formatToolLabel(toolName) {
+  return toolName.replace(/_/g, " ").replace(/([a-z])([A-Z])/g, "$1 $2").toLowerCase();
+}
+function formatToolResult(result) {
+  if (typeof result === "string") return result;
+  try {
+    return JSON.stringify(result, null, 2);
+  } catch {
+    return String(result);
+  }
+}
+var TimelineActionLabel = ({ action, detail, shimmer = false }) => /* @__PURE__ */ jsxs9("span", { className: "inline-flex min-w-0 max-w-full items-baseline gap-1", children: [
+  action ? shimmer ? /* @__PURE__ */ jsx18(
+    Shimmer,
+    {
+      as: "span",
+      className: cn(studioTimelineShimmerActionClass, "aui-tool-shimmer"),
+      duration: 1.8,
+      spread: 2.5,
+      children: action
+    }
+  ) : /* @__PURE__ */ jsx18("span", { className: studioTimelineActionClass, children: action }) : null,
+  detail ? /* @__PURE__ */ jsx18("span", { className: studioTimelineDetailClass, children: detail }) : null
+] });
+var TimelineHoverChevron = ({ expanded }) => /* @__PURE__ */ jsx18(
+  ChevronRightIcon,
+  {
+    className: studioTimelineChevronClass(expanded),
+    "aria-hidden": true
+  }
+);
+var ToolPanel = ({ toolName, argsText, result, isError }) => {
+  const [open, setOpen] = useState6(false);
+  const detail = formatToolLabel(toolName);
+  const formattedArgs = useMemo4(() => {
+    if (!argsText || argsText === "{}") return null;
+    try {
+      return JSON.stringify(JSON.parse(argsText), null, 2);
+    } catch {
+      return argsText;
+    }
+  }, [argsText]);
+  const formattedResult = useMemo4(() => {
+    if (result === void 0 || result === null) return null;
+    return formatToolResult(result);
+  }, [result]);
+  const hasBody = Boolean(formattedArgs || formattedResult);
+  const action = isError ? "Failed" : "Used";
+  if (!hasBody) {
+    return /* @__PURE__ */ jsx18("div", { className: "aui-tool-row w-full min-w-0", children: /* @__PURE__ */ jsx18(TimelineActionLabel, { action, detail }) });
+  }
+  return /* @__PURE__ */ jsxs9("div", { className: "aui-tool-row w-full min-w-0", children: [
+    /* @__PURE__ */ jsx18(
+      "button",
+      {
+        type: "button",
+        onClick: () => setOpen((v) => !v),
+        "aria-expanded": open,
+        "aria-label": `${action} ${detail}`,
+        className: studioTimelineRowButtonClass,
+        children: /* @__PURE__ */ jsxs9(
+          "span",
+          {
+            className: cn(
+              "inline-flex min-w-0 max-w-full items-center gap-0.5",
+              studioTimelineTextClass,
+              "text-foreground"
+            ),
+            children: [
+              /* @__PURE__ */ jsx18(TimelineActionLabel, { action, detail }),
+              /* @__PURE__ */ jsx18(TimelineHoverChevron, { expanded: open })
+            ]
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ jsxs9(
+      ToolBodyPresence,
+      {
+        open,
+        className: cn(studioTimelineBodyPadClass, "gap-2"),
+        children: [
+          formattedArgs ? /* @__PURE__ */ jsx18(
+            "div",
+            {
+              className: cn(
+                studioComposerIoWellClass,
+                "max-h-48 overflow-auto px-2.5 py-2"
+              ),
+              children: /* @__PURE__ */ jsx18("pre", { className: "whitespace-pre-wrap break-words font-mono text-[11px] font-normal leading-relaxed text-foreground", children: formattedArgs })
+            }
+          ) : null,
+          formattedResult ? /* @__PURE__ */ jsx18(
+            "div",
+            {
+              className: cn(
+                studioComposerIoWellClass,
+                "max-h-48 overflow-auto px-2.5 py-2"
+              ),
+              children: /* @__PURE__ */ jsx18("pre", { className: "whitespace-pre-wrap break-words font-mono text-[11px] font-normal leading-relaxed text-foreground", children: formattedResult })
+            }
+          ) : null
+        ]
+      }
+    )
+  ] });
+};
+var ToolFallbackImpl = ({
+  toolName,
+  argsText,
+  result,
+  status
+}) => {
+  const isRunning = useToolRunning({ status, result });
+  const isError = status?.type === "incomplete" && status.reason !== "cancelled";
+  const presenceKey = isRunning ? "running" : isError ? "error" : "complete";
+  return /* @__PURE__ */ jsx18(
+    ToolPresence,
+    {
+      presenceKey,
+      variant: isRunning ? "executing" : "settled",
+      className: "py-0.5",
+      children: isRunning ? /* @__PURE__ */ jsx18("div", { className: "aui-tool-running", children: /* @__PURE__ */ jsx18(
+        TimelineActionLabel,
+        {
+          action: "Using",
+          detail: formatToolLabel(toolName),
+          shimmer: true
+        }
+      ) }) : /* @__PURE__ */ jsx18(
+        ToolPanel,
+        {
+          toolName,
+          argsText,
+          result,
+          isError
+        }
+      )
+    }
+  );
+};
+var ToolFallback = memo2(
+  ToolFallbackImpl
+);
+ToolFallback.displayName = "ToolFallback";
+
+// src/artifacts/tool-artifact.tsx
+import { jsx as jsx19 } from "react/jsx-runtime";
+var ToolArtifactFallback = (props) => {
+  const registry = useArtifactRegistry();
+  const isRunning = useToolRunning({
+    status: props.status,
+    result: props.result
+  });
+  if (!isRunning) {
+    const artifact = parseArtifactFromToolResult(props.result);
+    if (artifact) {
+      const Renderer = registry[artifact.type];
+      if (Renderer) {
+        return /* @__PURE__ */ jsx19(
+          ToolMotion,
+          {
+            motionKey: `artifact-${artifact.type}`,
+            className: "aui-tool-artifact",
+            children: /* @__PURE__ */ jsx19(Renderer, { artifact })
+          }
+        );
+      }
+    }
+  }
+  return /* @__PURE__ */ jsx19(ToolFallback, { ...props });
+};
+
+// src/chat/composer.tsx
+import {
+  AuiIf,
+  ComposerPrimitive as ComposerPrimitive2,
+  useComposerRuntime
+} from "@assistant-ui/react";
+import { ArrowUpIcon, SquareIcon } from "lucide-react";
+import { Fragment as Fragment2, jsx as jsx20, jsxs as jsxs10 } from "react/jsx-runtime";
+var Composer = ({
+  placeholder = "Send a message...",
+  showAttachments,
+  toolbar,
+  sendTooltip = "Send message",
+  noAutoFocus,
+  className
+}) => {
+  const attachmentsEnabled = useTimbalAttachmentsEnabled();
+  const attachUi = showAttachments !== false && attachmentsEnabled;
+  const shell = /* @__PURE__ */ jsxs10(Fragment2, { children: [
+    attachUi && /* @__PURE__ */ jsx20(ComposerAttachments, {}),
+    /* @__PURE__ */ jsx20(ComposerInput, { placeholder, autoFocus: !noAutoFocus }),
+    /* @__PURE__ */ jsx20(
+      ComposerToolbar,
+      {
+        showAttachments: attachUi,
+        toolbar,
+        sendTooltip
+      }
+    )
+  ] });
+  return /* @__PURE__ */ jsx20(
+    ComposerPrimitive2.Root,
+    {
+      className: cn(
+        "aui-composer-root relative flex w-full flex-col",
+        className
+      ),
+      children: attachUi ? /* @__PURE__ */ jsx20(
+        ComposerPrimitive2.AttachmentDropzone,
+        {
+          className: cn(
+            studioComposeInputShellClass,
+            "data-[dragging=true]:border-2 data-[dragging=true]:border-dashed data-[dragging=true]:border-primary data-[dragging=true]:bg-accent/50"
+          ),
+          children: shell
+        }
+      ) : /* @__PURE__ */ jsx20("div", { className: studioComposeInputShellClass, children: shell })
+    }
+  );
+};
+var ComposerInput = ({
+  placeholder,
+  autoFocus
+}) => {
+  const composer = useComposerRuntime();
+  const onKeyDown = (e) => {
+    if (e.key === "Enter" && !e.shiftKey && !e.nativeEvent.isComposing) {
+      e.preventDefault();
+      composer.send();
+    }
+  };
+  const onInput = (e) => {
+    const el = e.currentTarget;
+    el.style.height = "auto";
+    el.style.height = `${Math.min(el.scrollHeight, 240)}px`;
+  };
+  return /* @__PURE__ */ jsx20(
+    ComposerPrimitive2.Input,
+    {
+      placeholder,
+      className: "aui-composer-input max-h-60 min-h-14 w-full resize-none bg-composer-bg px-3 pt-3 pb-1 text-sm outline-none placeholder:text-muted-foreground/70 focus-visible:ring-0",
+      rows: 1,
+      autoFocus,
+      "aria-label": "Message input",
+      onKeyDown,
+      onInput
+    }
+  );
+};
+var ComposerToolbar = ({ showAttachments, toolbar, sendTooltip }) => {
+  return /* @__PURE__ */ jsxs10("div", { className: "aui-composer-action-wrapper relative z-[1] flex items-center justify-between gap-1 bg-composer-bg px-2.5 pb-2.5", children: [
+    /* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-1", children: [
+      showAttachments && /* @__PURE__ */ jsx20(ComposerAddAttachment, {}),
+      toolbar
+    ] }),
+    /* @__PURE__ */ jsx20(ComposerSendOrCancel, { sendTooltip })
+  ] });
+};
+var ComposerSendOrCancel = ({ sendTooltip }) => {
+  return /* @__PURE__ */ jsxs10(Fragment2, { children: [
+    /* @__PURE__ */ jsx20(AuiIf, { condition: (s) => !s.thread.isRunning, children: /* @__PURE__ */ jsx20(ComposerPrimitive2.Send, { asChild: true, children: /* @__PURE__ */ jsx20(
+      TooltipIconButton,
+      {
+        tooltip: sendTooltip,
+        variant: "primary",
+        type: "submit",
+        className: "aui-composer-send shrink-0 disabled:opacity-30",
+        "aria-label": "Send message",
+        children: /* @__PURE__ */ jsx20(ArrowUpIcon, { className: "aui-composer-send-icon size-4" })
+      }
+    ) }) }),
+    /* @__PURE__ */ jsx20(AuiIf, { condition: (s) => s.thread.isRunning, children: /* @__PURE__ */ jsx20(ComposerPrimitive2.Cancel, { asChild: true, children: /* @__PURE__ */ jsx20(
+      TooltipIconButton,
+      {
+        tooltip: "Stop generating",
+        variant: "primary",
+        className: "aui-composer-cancel shrink-0",
+        "aria-label": "Stop generating",
+        children: /* @__PURE__ */ jsx20(SquareIcon, { className: "aui-composer-cancel-icon size-3 fill-current" })
+      }
+    ) }) })
+  ] });
+};
+
+// src/chat/suggestions.tsx
+import {
+  useEffect as useEffect4,
+  useMemo as useMemo5,
+  useState as useState7
+} from "react";
+import { useThreadRuntime as useThreadRuntime3 } from "@assistant-ui/react";
+import { ArrowUpIcon as ArrowUpIcon2 } from "lucide-react";
+import { jsx as jsx21, jsxs as jsxs11 } from "react/jsx-runtime";
+var Suggestions = ({
+  suggestions,
+  className
+}) => {
+  const items = useResolvedSuggestions(suggestions);
+  if (!items || items.length === 0) return null;
+  return /* @__PURE__ */ jsx21(
+    "div",
+    {
+      className: cn(
+        "aui-thread-suggestions flex w-full flex-col gap-2 pb-2.5",
+        className
+      ),
+      role: "list",
+      "aria-label": "Suggested prompts",
+      children: items.map((suggestion, i) => /* @__PURE__ */ jsx21(SuggestionRow, { suggestion }, (suggestion.prompt ?? suggestion.title) + i))
+    }
+  );
+};
+var SuggestionRow = ({ suggestion }) => {
+  const runtime = useThreadRuntime3();
+  const onClick = () => {
+    const text = suggestion.prompt ?? suggestion.title;
+    runtime.append({ role: "user", content: [{ type: "text", text }] });
+  };
+  return /* @__PURE__ */ jsxs11(
+    "button",
+    {
+      type: "button",
+      role: "listitem",
+      onClick,
+      className: cn("aui-thread-suggestion", studioListRowButtonClass),
+      children: [
+        /* @__PURE__ */ jsx21("span", { className: "aui-thread-suggestion-icon shrink-0 text-muted-foreground", children: suggestion.icon ?? /* @__PURE__ */ jsx21(ArrowUpIcon2, { className: "size-4", strokeWidth: 1.75, "aria-hidden": true }) }),
+        /* @__PURE__ */ jsxs11("span", { className: "aui-thread-suggestion-text min-w-0 flex-1 text-left", children: [
+          /* @__PURE__ */ jsx21("span", { className: "aui-thread-suggestion-text-1 block truncate text-sm font-normal text-foreground", children: suggestion.title }),
+          suggestion.description && /* @__PURE__ */ jsx21("span", { className: "aui-thread-suggestion-text-2 mt-0.5 block truncate text-xs text-muted-foreground", children: suggestion.description })
+        ] })
+      ]
+    }
+  );
+};
+function useResolvedSuggestions(source) {
+  const [resolved, setResolved] = useState7(
+    () => Array.isArray(source) ? source : void 0
+  );
+  useEffect4(() => {
+    if (!source) {
+      setResolved(void 0);
+      return;
+    }
+    if (Array.isArray(source)) {
+      setResolved(source);
+      return;
+    }
+    let cancelled = false;
+    Promise.resolve().then(() => source()).then((value) => {
+      if (!cancelled) setResolved(value);
+    }).catch(() => {
+      if (!cancelled) setResolved([]);
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [source]);
+  return useMemo5(() => resolved, [resolved]);
+}
+
+// src/chat/thread.tsx
+import { useEffect as useEffect5 } from "react";
+import {
+  ActionBarMorePrimitive,
+  ActionBarPrimitive,
+  AuiIf as AuiIf2,
+  ComposerPrimitive as ComposerPrimitive3,
+  ErrorPrimitive,
+  MessagePartPrimitive,
+  MessagePrimitive as MessagePrimitive2,
+  ThreadPrimitive,
+  useThread
+} from "@assistant-ui/react";
+import {
+  ArrowDownIcon,
+  CheckIcon as CheckIcon3,
+  CopyIcon as CopyIcon2,
+  DownloadIcon,
+  MoreHorizontalIcon,
+  PencilIcon,
+  RefreshCwIcon
+} from "lucide-react";
+import { motion as motion3 } from "motion/react";
+
+// src/design/theme-sanity.ts
+var scheduled = false;
+var warned = false;
+function isDev() {
+  if (typeof process !== "undefined" && process.env?.NODE_ENV === "production") {
+    return false;
+  }
+  return true;
+}
+function parseLuminance(color) {
+  const value = color.trim();
+  if (!value) return null;
+  const oklch = value.match(/oklch\(\s*([0-9.]+)/i);
+  if (oklch) {
+    const lightness = Number.parseFloat(oklch[1]);
+    if (Number.isFinite(lightness)) return lightness;
+  }
+  const rgb = value.match(/rgba?\(\s*([0-9.]+)[\s,]+([0-9.]+)[\s,]+([0-9.]+)/i);
+  if (rgb) {
+    const r = Number.parseFloat(rgb[1]) / 255;
+    const g = Number.parseFloat(rgb[2]) / 255;
+    const b = Number.parseFloat(rgb[3]) / 255;
+    if ([r, g, b].every(Number.isFinite)) {
+      return 0.2126 * r + 0.7152 * g + 0.0722 * b;
+    }
+  }
+  const hsl = value.match(/hsla?\(\s*[0-9.]+[\s,]+[0-9.]+%[\s,]+([0-9.]+)%/i);
+  if (hsl) {
+    const lightness = Number.parseFloat(hsl[1]) / 100;
+    if (Number.isFinite(lightness)) return lightness;
+  }
+  return null;
+}
+function runCheck() {
+  if (warned) return;
+  if (typeof window === "undefined" || typeof document === "undefined") return;
+  const root = document.documentElement;
+  const styles = window.getComputedStyle(root);
+  const background = styles.getPropertyValue("--background").trim();
+  if (!background) {
+    warned = true;
+    console.warn(
+      '[@timbal-ai/timbal-react] No `--background` CSS variable found on `<html>`. Did you `import "@timbal-ai/timbal-react/styles.css"` in your app entry? Components rely on semantic tokens (bg-background, text-foreground, \u2026) and will fall back to browser defaults.'
+    );
+    return;
+  }
+  const luminance = parseLuminance(background);
+  if (luminance === null) return;
+  const hasDarkClass = root.classList.contains("dark");
+  const looksDark = luminance < 0.5;
+  if (hasDarkClass !== looksDark) {
+    warned = true;
+    console.warn(
+      `[@timbal-ai/timbal-react] Theme mismatch detected. \`<html>\` has${hasDarkClass ? "" : " no"} \`.dark\` class but the resolved \`--background\` is ${looksDark ? "dark" : "light"} (${background}). This usually means the consumer's CSS overrides \`--background\` only in one mode. Import \`@timbal-ai/timbal-react/styles.css\` for a complete light + dark token set, or declare matching \`:root\` AND \`.dark\` blocks in your own CSS.`
+    );
+  }
+}
+function scheduleThemeSanityCheck() {
+  if (scheduled) return;
+  if (!isDev()) return;
+  if (typeof window === "undefined") return;
+  scheduled = true;
+  if (typeof queueMicrotask === "function") {
+    queueMicrotask(() => setTimeout(runCheck, 0));
+  } else {
+    setTimeout(runCheck, 0);
+  }
+}
+
+// src/chat/thread-variant.tsx
+import { createContext as createContext5, useContext as useContext5 } from "react";
+var ThreadVariantContext = createContext5("default");
+var ThreadVariantProvider = ThreadVariantContext.Provider;
+function useThreadVariant() {
+  return useContext5(ThreadVariantContext);
+}
+
+// src/chat/thread.tsx
+import { jsx as jsx22, jsxs as jsxs12 } from "react/jsx-runtime";
+var Thread = ({
+  className,
+  variant = "default",
+  maxWidth: maxWidthProp,
+  welcome,
+  suggestions,
+  composerPlaceholder,
+  components,
+  artifacts,
+  onArtifactEvent
+}) => {
+  const isPanel = variant === "panel";
+  const maxWidth = maxWidthProp ?? (isPanel ? "100%" : "44rem");
+  const placeholder = composerPlaceholder ?? (isPanel ? "Ask about this page\u2026" : "Send a message...");
+  const WelcomeSlot = components?.Welcome ?? ThreadWelcome;
+  const ComposerSlot = components?.Composer ?? Composer;
+  const UserMessageSlot = components?.UserMessage ?? UserMessage;
+  const AssistantMessageSlot = components?.AssistantMessage ?? AssistantMessage;
+  const EditComposerSlot = components?.EditComposer ?? EditComposer;
+  const ScrollToBottomSlot = components?.ScrollToBottom ?? ThreadScrollToBottom;
+  const SuggestionsSlot = components?.Suggestions ?? Suggestions;
+  useEffect5(() => {
+    scheduleThemeSanityCheck();
+  }, []);
+  return /* @__PURE__ */ jsx22(ThreadVariantProvider, { value: variant, children: /* @__PURE__ */ jsx22(
+    ArtifactRegistryProvider,
+    {
+      renderers: artifacts?.renderers,
+      override: artifacts?.override,
+      children: /* @__PURE__ */ jsx22(UiEventProvider, { onEvent: onArtifactEvent ?? (() => {
+      }), children: /* @__PURE__ */ jsx22(
+        ThreadPrimitive.Root,
+        {
+          className: cn(
+            "aui-root aui-thread-root @container flex h-full flex-col bg-transparent",
+            isPanel && "aui-thread-root--panel",
+            className
+          ),
+          style: { ["--thread-max-width"]: maxWidth },
+          "data-thread-variant": variant,
+          children: /* @__PURE__ */ jsxs12(
+            ThreadPrimitive.Viewport,
+            {
+              turnAnchor: "bottom",
+              className: cn(
+                "aui-thread-viewport relative flex flex-1 flex-col overflow-x-auto overflow-y-scroll scroll-pb-28",
+                isPanel ? "px-2 pt-2" : "px-4 pt-4"
+              ),
+              children: [
+                /* @__PURE__ */ jsx22(
+                  WelcomeSlot,
+                  {
+                    config: welcome,
+                    suggestions,
+                    Suggestions: SuggestionsSlot
+                  }
+                ),
+                /* @__PURE__ */ jsx22(
+                  ThreadPrimitive.Messages,
+                  {
+                    components: {
+                      UserMessage: UserMessageSlot,
+                      EditComposer: EditComposerSlot,
+                      AssistantMessage: AssistantMessageSlot
+                    }
+                  }
+                ),
+                /* @__PURE__ */ jsx22(
+                  ThreadPrimitive.ViewportFooter,
+                  {
+                    className: cn(
+                      "aui-thread-viewport-footer sticky bottom-0 z-10 mt-auto w-full isolate pt-2",
+                      isPanel ? "bg-card pb-2" : "bg-background pb-4 md:pb-6"
+                    ),
+                    children: /* @__PURE__ */ jsxs12(
+                      "div",
+                      {
+                        className: cn(
+                          "mx-auto flex w-full max-w-(--thread-max-width) flex-col",
+                          isPanel ? "gap-2" : "gap-4"
+                        ),
+                        children: [
+                          /* @__PURE__ */ jsx22(ScrollToBottomSlot, {}),
+                          /* @__PURE__ */ jsx22(ComposerSlot, { placeholder })
+                        ]
+                      }
+                    )
+                  }
+                )
+              ]
+            }
+          )
+        }
+      ) })
+    }
+  ) });
+};
+var ThreadScrollToBottom = () => {
+  return /* @__PURE__ */ jsx22(ThreadPrimitive.ScrollToBottom, { asChild: true, children: /* @__PURE__ */ jsx22(
+    TooltipIconButton,
+    {
+      tooltip: "Scroll to bottom",
+      variant: "secondary",
+      className: "aui-thread-scroll-to-bottom absolute -top-12 z-10 self-center disabled:invisible",
+      children: /* @__PURE__ */ jsx22(ArrowDownIcon, { className: "size-4" })
+    }
+  ) });
+};
+var welcomeStagger = {
+  initial: {},
+  animate: {
+    transition: { staggerChildren: 0.16, delayChildren: 0.12 }
+  }
+};
+var welcomeItem = {
+  initial: { opacity: 0, y: 14 },
+  animate: {
+    opacity: 1,
+    y: 0,
+    transition: { duration: 0.9, ease: luxuryEase }
+  }
+};
+var welcomeIcon = {
+  initial: { opacity: 0, y: 10, scale: 0.96 },
+  animate: {
+    opacity: 1,
+    y: 0,
+    scale: 1,
+    transition: { duration: 1.1, ease: luxuryEase }
+  }
+};
+var ThreadWelcome = ({
+  config,
+  suggestions,
+  Suggestions: SuggestionsSlot = Suggestions
+}) => {
+  const isEmpty = useThread((s) => s.messages.length === 0);
+  const isPanel = useThreadVariant() === "panel";
+  if (!isEmpty) return null;
+  const defaultHeading = isPanel ? "Ask about this page" : "How can I help you today?";
+  const defaultSubheading = isPanel ? "The assistant can use dashboard context from your app." : "Send a message to start a conversation.";
+  return /* @__PURE__ */ jsxs12("div", { className: "aui-thread-welcome-root mx-auto my-auto flex w-full max-w-(--thread-max-width) grow flex-col", children: [
+    /* @__PURE__ */ jsx22("div", { className: "aui-thread-welcome-center flex w-full grow flex-col items-center justify-center", children: /* @__PURE__ */ jsxs12(
+      motion3.div,
+      {
+        className: cn(
+          "aui-thread-welcome-message flex flex-col items-center justify-center text-center",
+          isPanel ? "px-2" : "px-4"
+        ),
+        variants: welcomeStagger,
+        initial: "initial",
+        animate: "animate",
+        children: [
+          config?.icon && /* @__PURE__ */ jsx22(motion3.div, { variants: welcomeIcon, className: isPanel ? "mb-3" : "mb-5", children: config.icon }),
+          /* @__PURE__ */ jsx22(
+            motion3.h1,
+            {
+              variants: welcomeItem,
+              className: cn(
+                "aui-thread-welcome-message-inner font-semibold",
+                isPanel ? "text-base" : "text-2xl"
+              ),
+              children: config?.heading ?? defaultHeading
+            }
+          ),
+          /* @__PURE__ */ jsx22(
+            motion3.p,
+            {
+              variants: welcomeItem,
+              className: "aui-thread-welcome-message-inner mt-1.5 text-muted-foreground text-sm",
+              children: config?.subheading ?? defaultSubheading
+            }
+          )
+        ]
+      }
+    ) }),
+    suggestions && !isPanel ? /* @__PURE__ */ jsx22("div", { className: "aui-thread-welcome-suggestions mx-auto w-full max-w-(--thread-max-width) px-2", children: /* @__PURE__ */ jsx22(SuggestionsSlot, { suggestions }) }) : null
+  ] });
+};
+var MessageError = () => {
+  return /* @__PURE__ */ jsx22(MessagePrimitive2.Error, { children: /* @__PURE__ */ jsx22(ErrorPrimitive.Root, { className: "aui-message-error-root mt-2 rounded-md border border-destructive bg-destructive/10 p-3 text-destructive text-sm", children: /* @__PURE__ */ jsx22(ErrorPrimitive.Message, { className: "aui-message-error-message line-clamp-2" }) }) });
+};
+var AssistantMessage = () => {
+  const isPanel = useThreadVariant() === "panel";
+  return /* @__PURE__ */ jsxs12(
+    MessagePrimitive2.Root,
+    {
+      className: cn(
+        "aui-assistant-message-root fade-in slide-in-from-bottom-1 relative mx-auto w-full max-w-(--thread-max-width) animate-in duration-150",
+        isPanel ? "py-2" : "py-3"
+      ),
+      "data-role": "assistant",
+      children: [
+        /* @__PURE__ */ jsxs12(
+          "div",
+          {
+            className: cn(
+              "aui-assistant-message-content wrap-break-word text-foreground leading-relaxed",
+              isPanel ? "px-1 text-sm" : "px-2"
+            ),
+            children: [
+              /* @__PURE__ */ jsx22(
+                MessagePrimitive2.Parts,
+                {
+                  components: {
+                    Text: MarkdownText,
+                    // `Override` (not `Fallback`) replaces the default tool renderer
+                    // entirely so we never fall back to the assistant-ui boilerplate.
+                    tools: { Override: ToolArtifactFallback }
+                  }
+                }
+              ),
+              /* @__PURE__ */ jsx22(MessageError, {})
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx22("div", { className: "aui-assistant-message-footer mt-1 mb-3 ml-1 flex", children: /* @__PURE__ */ jsx22(AssistantActionBar, {}) })
+      ]
+    }
+  );
+};
+var ASSISTANT_ACTION_ICON_CLASS = cn(
+  "size-6 min-h-6 min-w-6 text-muted-foreground/45 hover:text-muted-foreground/80",
+  // The v2 fill span sits inside `group/tbv2 > span:first-child`. We mute it
+  // here so action-bar buttons read as subtle icons rather than full pills.
+  "[&>span:first-child]:bg-transparent",
+  "[&>span:first-child]:group-hover/tbv2:bg-ghost-fill-hover"
+);
+var AssistantActionBar = () => {
+  return /* @__PURE__ */ jsxs12(
+    ActionBarPrimitive.Root,
+    {
+      hideWhenRunning: true,
+      autohide: "never",
+      className: "aui-assistant-action-bar-root flex items-center gap-0 bg-transparent px-0 py-0.5 text-muted-foreground/60",
+      children: [
+        /* @__PURE__ */ jsx22(ActionBarPrimitive.Copy, { asChild: true, children: /* @__PURE__ */ jsxs12(
+          TooltipIconButton,
+          {
+            tooltip: "Copy",
+            variant: "ghost",
+            className: ASSISTANT_ACTION_ICON_CLASS,
+            children: [
+              /* @__PURE__ */ jsx22(AuiIf2, { condition: (s) => s.message.isCopied, children: /* @__PURE__ */ jsx22(CheckIcon3, { className: "size-3" }) }),
+              /* @__PURE__ */ jsx22(AuiIf2, { condition: (s) => !s.message.isCopied, children: /* @__PURE__ */ jsx22(CopyIcon2, { className: "size-3" }) })
+            ]
+          }
+        ) }),
+        /* @__PURE__ */ jsx22(ActionBarPrimitive.Reload, { asChild: true, children: /* @__PURE__ */ jsx22(
+          TooltipIconButton,
+          {
+            tooltip: "Regenerate",
+            variant: "ghost",
+            className: ASSISTANT_ACTION_ICON_CLASS,
+            children: /* @__PURE__ */ jsx22(RefreshCwIcon, { className: "size-3" })
+          }
+        ) }),
+        /* @__PURE__ */ jsxs12(ActionBarMorePrimitive.Root, { children: [
+          /* @__PURE__ */ jsx22(ActionBarMorePrimitive.Trigger, { asChild: true, children: /* @__PURE__ */ jsx22(
+            TooltipIconButton,
+            {
+              tooltip: "More",
+              variant: "ghost",
+              className: cn(
+                ASSISTANT_ACTION_ICON_CLASS,
+                "data-[state=open]:text-muted-foreground/80"
+              ),
+              children: /* @__PURE__ */ jsx22(MoreHorizontalIcon, { className: "size-3" })
+            }
+          ) }),
+          /* @__PURE__ */ jsx22(
+            ActionBarMorePrimitive.Content,
+            {
+              side: "bottom",
+              align: "start",
+              className: "aui-action-bar-more-content z-50 min-w-36 overflow-hidden rounded-lg border border-border bg-popover p-1 text-popover-foreground shadow-card-elevated",
+              children: /* @__PURE__ */ jsx22(ActionBarPrimitive.ExportMarkdown, { asChild: true, children: /* @__PURE__ */ jsxs12(ActionBarMorePrimitive.Item, { className: "aui-action-bar-more-item flex cursor-pointer select-none items-center gap-2 rounded-md px-2 py-1.5 text-sm outline-none hover:bg-muted focus:bg-muted", children: [
+                /* @__PURE__ */ jsx22(DownloadIcon, { className: "size-4 shrink-0" }),
+                "Export as Markdown"
+              ] }) })
+            }
+          )
+        ] })
+      ]
+    }
+  );
+};
+var UserMessageText = () => {
+  return /* @__PURE__ */ jsx22("span", { className: "whitespace-pre-wrap", children: /* @__PURE__ */ jsx22(MessagePartPrimitive.Text, { smooth: false }) });
+};
+var UserMessage = () => {
+  const isPanel = useThreadVariant() === "panel";
+  return /* @__PURE__ */ jsxs12(
+    MessagePrimitive2.Root,
+    {
+      className: cn(
+        "aui-user-message-root mx-auto flex w-full max-w-(--thread-max-width) flex-col items-end gap-2",
+        isPanel ? "px-1 py-2" : "px-2 py-3"
+      ),
+      "data-role": "user",
+      children: [
+        /* @__PURE__ */ jsx22(UserMessageAttachments, {}),
+        /* @__PURE__ */ jsxs12(
+          motion3.div,
+          {
+            className: cn(
+              "aui-user-message-content relative inline-block max-w-[85%] rounded-2xl bg-bubble-user text-bubble-user-foreground",
+              isPanel ? "px-3 py-2 text-sm" : "max-w-[80%] px-4 py-2.5"
+            ),
+            initial: { opacity: 0, y: 8, scale: 0.99 },
+            animate: { opacity: 1, y: 0, scale: 1 },
+            transition: { duration: 0.65, ease: luxuryEase },
+            children: [
+              /* @__PURE__ */ jsx22(MessagePrimitive2.Parts, { components: { Text: UserMessageText } }),
+              /* @__PURE__ */ jsx22("div", { className: "aui-user-action-bar-wrapper absolute top-1/2 left-0 -translate-x-full -translate-y-1/2 pr-2", children: /* @__PURE__ */ jsx22(UserActionBar, {}) })
+            ]
+          }
+        )
+      ]
+    }
+  );
+};
+var UserActionBar = () => {
+  return /* @__PURE__ */ jsx22(
+    ActionBarPrimitive.Root,
+    {
+      hideWhenRunning: true,
+      autohide: "always",
+      className: "aui-user-action-bar-root flex flex-col items-end",
+      children: /* @__PURE__ */ jsx22(ActionBarPrimitive.Edit, { asChild: true, children: /* @__PURE__ */ jsx22(
+        TooltipIconButton,
+        {
+          tooltip: "Edit",
+          variant: "ghost",
+          className: ASSISTANT_ACTION_ICON_CLASS,
+          children: /* @__PURE__ */ jsx22(PencilIcon, { className: "size-3" })
+        }
+      ) })
+    }
+  );
+};
+var EditComposer = () => {
+  return /* @__PURE__ */ jsx22(MessagePrimitive2.Root, { className: "aui-edit-composer-wrapper mx-auto flex w-full max-w-(--thread-max-width) flex-col px-2 py-3", children: /* @__PURE__ */ jsxs12(ComposerPrimitive3.Root, { className: "aui-edit-composer-root ml-auto flex w-full max-w-[85%] flex-col rounded-2xl bg-muted", children: [
+    /* @__PURE__ */ jsx22(
+      ComposerPrimitive3.Input,
+      {
+        className: "aui-edit-composer-input min-h-14 w-full resize-none bg-transparent p-4 text-foreground text-sm outline-none",
+        autoFocus: true
+      }
+    ),
+    /* @__PURE__ */ jsxs12("div", { className: "aui-edit-composer-footer mx-3 mb-3 flex items-center gap-2 self-end", children: [
+      /* @__PURE__ */ jsx22(ComposerPrimitive3.Cancel, { asChild: true, children: /* @__PURE__ */ jsx22(TimbalV2Button, { variant: "ghost", size: "sm", children: "Cancel" }) }),
+      /* @__PURE__ */ jsx22(ComposerPrimitive3.Send, { asChild: true, children: /* @__PURE__ */ jsx22(TimbalV2Button, { variant: "primary", size: "sm", children: "Update" }) })
+    ] })
+  ] }) });
+};
+
+// src/chat/chat.tsx
+import { jsx as jsx23 } from "react/jsx-runtime";
+function TimbalChat({
+  workforceId,
+  baseUrl,
+  fetch: fetch2,
+  attachments,
+  attachmentsUploadUrl,
+  attachmentsAccept,
+  debug,
+  ...threadProps
+}) {
+  return /* @__PURE__ */ jsx23(
+    TimbalRuntimeProvider,
+    {
+      workforceId,
+      baseUrl,
+      fetch: fetch2,
+      attachments,
+      attachmentsUploadUrl,
+      attachmentsAccept,
+      debug,
+      children: /* @__PURE__ */ jsx23(Thread, { ...threadProps })
+    }
+  );
+}
+
+export {
+  studioTopbarPillHeightClass,
+  studioTopbarIconPillClass,
+  studioPlaygroundGradientClass,
+  studioSecondaryChromeClass,
+  studioSearchChromeClass,
+  studioIntegrationCardClass,
+  studioSidebarPanelClass,
+  studioSidebarNavItemClass,
+  studioSidebarNavItemLayout,
+  studioSidebarNavItemIdleClass,
+  studioSidebarCollapsedRailItemIdleClass,
+  studioSidebarCollapsedRailItemActiveClass,
+  studioSidebarNavItemActiveClass,
+  TooltipIconButton,
+  UserMessageAttachments,
+  ComposerAttachments,
+  ComposerAddAttachment,
+  ArtifactCard,
+  ChartArtifactView,
+  QuestionArtifactView,
+  HtmlArtifactView,
+  JsonArtifactView,
+  TableArtifactView,
+  isUiBinding,
+  getPath,
+  setPath,
+  resolveBindable,
+  useUiState,
+  useUiDispatch,
+  UiEventProvider,
+  useUiEventEmitter,
+  UiCustomNodeRegistryProvider,
+  useUiCustomNodeRegistry,
+  UiNodeView,
+  UiArtifactView,
+  defaultArtifactRenderers,
+  ArtifactRegistryProvider,
+  useArtifactRegistry,
+  ArtifactView,
+  isArtifact,
+  ARTIFACT_FENCE_LANGUAGES,
+  isArtifactFenceLanguage,
+  parseArtifactFromToolResult,
+  findMarkdownArtifacts,
+  splitMarkdownByArtifacts,
+  MarkdownText,
+  luxuryEase,
+  getAccessToken,
+  setAccessToken,
+  getRefreshToken,
+  setRefreshToken,
+  clearTokens,
+  refreshAccessToken,
+  authFetch,
+  fetchCurrentUser,
+  DEFAULT_UPLOAD_ACCEPT,
+  createDefaultAttachmentAdapter,
+  createUploadAttachmentAdapter,
+  resolveAttachmentAdapter,
+  useTimbalStream,
+  useTimbalRuntime,
+  TimbalRuntimeProvider,
+  useToolRunning,
+  ToolFallback,
+  ToolArtifactFallback,
+  Composer,
+  Suggestions,
+  useResolvedSuggestions,
+  Thread,
+  TimbalChat
+};