@lukeashford/aurelius 2.9.0 → 2.10.0

package/dist/index.mjs

@@ -860,7 +860,7 @@ var Tooltip = ({ content, children, open = false, side = "top" }) => {
     {
       role: "tooltip",
       className: cx(
-        "pointer-events-none absolute z-50 whitespace-nowrap rounded-md border border-ash bg-graphite px-3 py-1.5 text-sm text-white shadow-lg transition-opacity duration-200 ease-out",
+        "pointer-events-none absolute z-50 whitespace-nowrap border border-ash bg-graphite px-3 py-1.5 text-sm text-white shadow-lg transition-opacity duration-200 ease-out",
         open ? "opacity-100" : "opacity-0",
         side === "top" && "left-1/2 -translate-x-1/2 -top-2 -translate-y-full",
         side === "bottom" && "left-1/2 -translate-x-1/2 -bottom-2 translate-y-full",
@@ -1070,11 +1070,152 @@ var ListSubheader = React13.forwardRef(
 );
 ListSubheader.displayName = "ListSubheader";
 
-// src/components/Label.tsx
+// src/components/FileChip.tsx
 import React14 from "react";
-var Label = React14.forwardRef(
-  ({ className, required, children, ...rest }, ref) => {
+import { File, FileImage, FileVideo, FileAudio, FileText, FileCode, FileArchive, X, Loader2 } from "lucide-react";
+function formatBytes(bytes) {
+  if (bytes === 0) return "0 B";
+  const k = 1024;
+  const sizes = ["B", "KB", "MB", "GB"];
+  const i = Math.floor(Math.log(bytes) / Math.log(k));
+  return `${parseFloat((bytes / Math.pow(k, i)).toFixed(1))} ${sizes[i]}`;
+}
+function getFileIcon(type) {
+  if (!type) return File;
+  if (type.startsWith("image/")) return FileImage;
+  if (type.startsWith("video/")) return FileVideo;
+  if (type.startsWith("audio/")) return FileAudio;
+  if (type.startsWith("text/")) return FileText;
+  if (type.includes("javascript") || type.includes("typescript") || type.includes("json") || type.includes("xml")) {
+    return FileCode;
+  }
+  if (type.includes("zip") || type.includes("rar") || type.includes("tar") || type.includes("gz")) {
+    return FileArchive;
+  }
+  return File;
+}
+var statusStyles = {
+  pending: "border-silver/30",
+  uploading: "border-gold/50",
+  complete: "border-success/50",
+  error: "border-error/50"
+};
+var FileChip = React14.forwardRef(
+  ({
+    name,
+    size,
+    type,
+    status = "complete",
+    previewUrl,
+    onRemove,
+    removable = true,
+    error,
+    className,
+    ...rest
+  }, ref) => {
+    const Icon = getFileIcon(type);
+    const isImage = type?.startsWith("image/");
+    const showPreview = isImage && previewUrl;
     return /* @__PURE__ */ React14.createElement(
+      "div",
+      {
+        ref,
+        className: cx(
+          "group relative inline-flex items-center gap-2 px-2 py-1.5",
+          "bg-charcoal border text-sm text-white",
+          "transition-colors duration-150",
+          statusStyles[status],
+          status === "error" && "bg-error/10",
+          className
+        ),
+        role: "listitem",
+        ...rest
+      },
+      showPreview ? /* @__PURE__ */ React14.createElement("div", { className: "w-8 h-8 flex-shrink-0 overflow-hidden bg-slate" }, /* @__PURE__ */ React14.createElement(
+        "img",
+        {
+          src: previewUrl,
+          alt: "",
+          className: "w-full h-full object-cover"
+        }
+      )) : /* @__PURE__ */ React14.createElement(Icon, { className: cx(
+        "w-4 h-4 flex-shrink-0",
+        status === "error" ? "text-error" : "text-silver"
+      ) }),
+      /* @__PURE__ */ React14.createElement("div", { className: "flex flex-col min-w-0 flex-1" }, /* @__PURE__ */ React14.createElement("span", { className: "truncate max-w-40", title: name }, name), size !== void 0 && status !== "error" && /* @__PURE__ */ React14.createElement("span", { className: "text-xs text-silver/60" }, formatBytes(size)), status === "error" && error && /* @__PURE__ */ React14.createElement("span", { className: "text-xs text-error truncate", title: error }, error)),
+      status === "uploading" && /* @__PURE__ */ React14.createElement(Loader2, { className: "w-3.5 h-3.5 text-gold animate-spin flex-shrink-0" }),
+      status === "pending" && /* @__PURE__ */ React14.createElement("div", { className: "w-2 h-2 rounded-full bg-silver/50 flex-shrink-0" }),
+      removable && onRemove && /* @__PURE__ */ React14.createElement(
+        "button",
+        {
+          type: "button",
+          onClick: (e) => {
+            e.stopPropagation();
+            onRemove();
+          },
+          className: cx(
+            "p-0.5 text-silver/40 hover:text-white transition-colors",
+            "hover:bg-white/10",
+            "opacity-0 group-hover:opacity-100",
+            "focus:opacity-100"
+          ),
+          "aria-label": `Remove ${name}`
+        },
+        /* @__PURE__ */ React14.createElement(X, { className: "w-3.5 h-3.5" })
+      )
+    );
+  }
+);
+FileChip.displayName = "FileChip";
+
+// src/components/AttachmentPreview.tsx
+import React15 from "react";
+var AttachmentPreview = React15.forwardRef(
+  ({
+    attachments,
+    onRemove,
+    removable = true,
+    maxVisible,
+    className,
+    ...rest
+  }, ref) => {
+    if (attachments.length === 0) return null;
+    const visibleAttachments = maxVisible && maxVisible > 0 ? attachments.slice(0, maxVisible) : attachments;
+    const hiddenCount = maxVisible && maxVisible > 0 ? Math.max(0, attachments.length - maxVisible) : 0;
+    return /* @__PURE__ */ React15.createElement(
+      "div",
+      {
+        ref,
+        className: cx("flex flex-wrap gap-2", className),
+        role: "list",
+        "aria-label": "Attached files",
+        ...rest
+      },
+      visibleAttachments.map((attachment) => /* @__PURE__ */ React15.createElement(
+        FileChip,
+        {
+          key: attachment.id,
+          name: attachment.file.name,
+          size: attachment.file.size,
+          type: attachment.file.type,
+          status: attachment.status,
+          previewUrl: attachment.previewUrl,
+          error: attachment.error,
+          removable,
+          onRemove: onRemove ? () => onRemove(attachment.id) : void 0
+        }
+      )),
+      hiddenCount > 0 && /* @__PURE__ */ React15.createElement("div", { className: "inline-flex items-center px-2 py-1.5 bg-charcoal border border-silver/30 text-sm text-silver" }, "+", hiddenCount, " more")
+    );
+  }
+);
+AttachmentPreview.displayName = "AttachmentPreview";
+
+// src/components/Label.tsx
+import React16 from "react";
+var Label = React16.forwardRef(
+  ({ className, required, children, ...rest }, ref) => {
+    return /* @__PURE__ */ React16.createElement(
       "label",
       {
         ref,
@@ -1082,17 +1223,17 @@ var Label = React14.forwardRef(
         ...rest
       },
       children,
-      required && /* @__PURE__ */ React14.createElement("span", { className: "text-error ml-1" }, "*")
+      required && /* @__PURE__ */ React16.createElement("span", { className: "text-error ml-1" }, "*")
     );
   }
 );
 Label.displayName = "Label";
 
 // src/components/HelperText.tsx
-import React15 from "react";
-var HelperText = React15.forwardRef(
+import React17 from "react";
+var HelperText = React17.forwardRef(
   ({ className, error, children, ...rest }, ref) => {
-    return /* @__PURE__ */ React15.createElement(
+    return /* @__PURE__ */ React17.createElement(
       "p",
       {
         ref,
@@ -1106,12 +1247,12 @@ var HelperText = React15.forwardRef(
 HelperText.displayName = "HelperText";
 
 // src/components/Textarea.tsx
-import React16 from "react";
-var Textarea = React16.forwardRef(
+import React18 from "react";
+var Textarea = React18.forwardRef(
   ({ error = false, className, disabled, ...rest }, ref) => {
     const base = "w-full px-3 py-2 bg-graphite border border-ash rounded-none text-white placeholder:text-zinc min-h-[80px] transition-all duration-fast focus:border-gold focus:ring-1 focus:ring-gold focus:outline-none disabled:bg-slate disabled:text-dim disabled:cursor-not-allowed";
     const errorCls = error ? "border-error focus:border-error focus:ring-error" : "";
-    return /* @__PURE__ */ React16.createElement(
+    return /* @__PURE__ */ React18.createElement(
       "textarea",
       {
         ref,
@@ -1125,11 +1266,11 @@ var Textarea = React16.forwardRef(
 Textarea.displayName = "Textarea";
 
 // src/components/Select.tsx
-import React17 from "react";
+import React19 from "react";
 var selectBgImage = `url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%23C9A227' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e")`;
-var Select = React17.forwardRef(
+var Select = React19.forwardRef(
   ({ error = false, className, disabled, options, children, ...rest }, ref) => {
-    return /* @__PURE__ */ React17.createElement(
+    return /* @__PURE__ */ React19.createElement(
       "select",
       {
         ref,
@@ -1149,16 +1290,16 @@ var Select = React17.forwardRef(
         disabled,
         ...rest
       },
-      options ? options.map((opt) => /* @__PURE__ */ React17.createElement("option", { key: opt.value, value: opt.value }, opt.label)) : children
+      options ? options.map((opt) => /* @__PURE__ */ React19.createElement("option", { key: opt.value, value: opt.value }, opt.label)) : children
     );
   }
 );
 Select.displayName = "Select";
 
 // src/components/Checkbox.tsx
-import React18, { useCallback } from "react";
+import React20, { useCallback } from "react";
 var checkmarkSvg = `url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='%231A1A1A' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3e%3c/svg%3e")`;
-var Checkbox = React18.forwardRef(
+var Checkbox = React20.forwardRef(
   ({ className, label, id, ...rest }, ref) => {
     const inputId = id || rest.name || Math.random().toString(36).substr(2, 9);
     const setRef = useCallback((node) => {
@@ -1173,14 +1314,14 @@ var Checkbox = React18.forwardRef(
         ref.current = node;
       }
     }, [ref]);
-    return /* @__PURE__ */ React18.createElement("div", { className: "flex items-center" }, /* @__PURE__ */ React18.createElement(
+    return /* @__PURE__ */ React20.createElement("div", { className: "flex items-center" }, /* @__PURE__ */ React20.createElement(
       "input",
       {
         type: "checkbox",
         id: inputId,
         ref: setRef,
         className: cx(
-          "appearance-none h-4 w-4 border border-ash rounded-sm bg-graphite",
+          "appearance-none h-4 w-4 border border-ash bg-graphite",
           "checked:bg-gold checked:border-gold",
           "focus:ring-1 focus:ring-gold focus:ring-offset-1 focus:ring-offset-obsidian",
           "transition duration-200 ease-in-out cursor-pointer",
@@ -1203,15 +1344,15 @@ var Checkbox = React18.forwardRef(
         },
         ...rest
       }
-    ), label && /* @__PURE__ */ React18.createElement("label", { htmlFor: inputId, className: "ml-2 text-sm text-silver cursor-pointer select-none" }, label));
+    ), label && /* @__PURE__ */ React20.createElement("label", { htmlFor: inputId, className: "ml-2 text-sm text-silver cursor-pointer select-none" }, label));
   }
 );
 Checkbox.displayName = "Checkbox";
 
 // src/components/Radio.tsx
-import React19, { useCallback as useCallback2 } from "react";
+import React21, { useCallback as useCallback2 } from "react";
 var radioDotSvg = `url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='%231A1A1A' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='8' cy='8' r='3'/%3e%3c/svg%3e")`;
-var Radio = React19.forwardRef(
+var Radio = React21.forwardRef(
   ({ className, label, id, ...rest }, ref) => {
     const inputId = id || rest.name || Math.random().toString(36).substr(2, 9);
     const setRef = useCallback2((node) => {
@@ -1226,7 +1367,7 @@ var Radio = React19.forwardRef(
         ref.current = node;
       }
     }, [ref]);
-    return /* @__PURE__ */ React19.createElement("div", { className: "flex items-center" }, /* @__PURE__ */ React19.createElement(
+    return /* @__PURE__ */ React21.createElement("div", { className: "flex items-center" }, /* @__PURE__ */ React21.createElement(
       "input",
       {
         type: "radio",
@@ -1264,14 +1405,14 @@ var Radio = React19.forwardRef(
         },
         ...rest
       }
-    ), label && /* @__PURE__ */ React19.createElement("label", { htmlFor: inputId, className: "ml-2 text-sm text-silver cursor-pointer select-none" }, label));
+    ), label && /* @__PURE__ */ React21.createElement("label", { htmlFor: inputId, className: "ml-2 text-sm text-silver cursor-pointer select-none" }, label));
   }
 );
 Radio.displayName = "Radio";
 
 // src/components/Switch.tsx
-import React20, { useCallback as useCallback3, useRef, useState } from "react";
-var Switch = React20.forwardRef(
+import React22, { useCallback as useCallback3, useRef, useState } from "react";
+var Switch = React22.forwardRef(
   ({ checked: controlledChecked, defaultChecked = false, onCheckedChange, disabled, className, label, ...rest }, ref) => {
     const [internalChecked, setInternalChecked] = useState(defaultChecked);
     const isControlled = controlledChecked !== void 0;
@@ -1297,7 +1438,7 @@ var Switch = React20.forwardRef(
       onCheckedChange?.(newChecked);
       rest.onClick?.(e);
     };
-    return /* @__PURE__ */ React20.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React20.createElement(
+    return /* @__PURE__ */ React22.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React22.createElement(
       "button",
       {
         type: "button",
@@ -1317,7 +1458,7 @@ var Switch = React20.forwardRef(
         ),
         ...rest
       },
-      /* @__PURE__ */ React20.createElement(
+      /* @__PURE__ */ React22.createElement(
         "span",
         {
           className: cx(
@@ -1327,7 +1468,7 @@ var Switch = React20.forwardRef(
           )
         }
       )
-    ), label && /* @__PURE__ */ React20.createElement(
+    ), label && /* @__PURE__ */ React22.createElement(
       "span",
       {
         className: "text-sm text-silver cursor-pointer",
@@ -1343,7 +1484,7 @@ var Switch = React20.forwardRef(
 Switch.displayName = "Switch";
 
 // src/components/Slider.tsx
-import React21, { useState as useState2, useRef as useRef2, useCallback as useCallback4 } from "react";
+import React23, { useState as useState2, useRef as useRef2, useCallback as useCallback4 } from "react";
 var SIZE_TRACK = {
   sm: "h-1",
   md: "h-2",
@@ -1354,7 +1495,7 @@ var SIZE_THUMB = {
   md: "h-4 w-4",
   lg: "h-5 w-5"
 };
-var Slider = React21.forwardRef(
+var Slider = React23.forwardRef(
   ({
     value: controlledValue,
     defaultValue = 0,
@@ -1442,14 +1583,14 @@ var Slider = React21.forwardRef(
       onChange?.(newValue);
       onChangeEnd?.(newValue);
     };
-    return /* @__PURE__ */ React21.createElement(
+    return /* @__PURE__ */ React23.createElement(
       "div",
       {
         ref,
         className: cx("relative w-full py-2", disabled && "opacity-50", className),
         ...props
       },
-      /* @__PURE__ */ React21.createElement(
+      /* @__PURE__ */ React23.createElement(
         "div",
         {
           ref: trackRef,
@@ -1459,14 +1600,14 @@ var Slider = React21.forwardRef(
           ),
           onMouseDown: handleMouseDown
         },
-        /* @__PURE__ */ React21.createElement(
+        /* @__PURE__ */ React23.createElement(
           "div",
           {
             className: cx("absolute inset-y-0 left-0 bg-gold", SIZE_TRACK[size]),
             style: { width: `${percentage}%` }
           }
         ),
-        /* @__PURE__ */ React21.createElement(
+        /* @__PURE__ */ React23.createElement(
           "div",
           {
             role: "slider",
@@ -1487,7 +1628,7 @@ var Slider = React21.forwardRef(
             ),
             style: { left: `${percentage}%` }
           },
-          showTooltip && isDragging && /* @__PURE__ */ React21.createElement("div", { className: "absolute bottom-full left-1/2 -translate-x-1/2 mb-2 px-2 py-1 bg-graphite border border-ash text-xs text-white whitespace-nowrap" }, formatValue(value))
+          showTooltip && isDragging && /* @__PURE__ */ React23.createElement("div", { className: "absolute bottom-full left-1/2 -translate-x-1/2 mb-2 px-2 py-1 bg-graphite border border-ash text-xs text-white whitespace-nowrap" }, formatValue(value))
         )
       )
     );
@@ -1496,10 +1637,10 @@ var Slider = React21.forwardRef(
 Slider.displayName = "Slider";
 
 // src/components/InputGroup.tsx
-import React22 from "react";
-var InputGroup = React22.forwardRef(
+import React24 from "react";
+var InputGroup = React24.forwardRef(
   ({ className, children, ...props }, ref) => {
-    return /* @__PURE__ */ React22.createElement(
+    return /* @__PURE__ */ React24.createElement(
       "div",
       {
         ref,
@@ -1511,9 +1652,9 @@ var InputGroup = React22.forwardRef(
   }
 );
 InputGroup.displayName = "InputGroup";
-var InputLeftAddon = React22.forwardRef(
+var InputLeftAddon = React24.forwardRef(
   ({ className, children, ...props }, ref) => {
-    return /* @__PURE__ */ React22.createElement(
+    return /* @__PURE__ */ React24.createElement(
       "div",
       {
         ref,
@@ -1529,9 +1670,9 @@ var InputLeftAddon = React22.forwardRef(
   }
 );
 InputLeftAddon.displayName = "InputLeftAddon";
-var InputRightAddon = React22.forwardRef(
+var InputRightAddon = React24.forwardRef(
   ({ className, children, ...props }, ref) => {
-    return /* @__PURE__ */ React22.createElement(
+    return /* @__PURE__ */ React24.createElement(
       "div",
       {
         ref,
@@ -1547,9 +1688,9 @@ var InputRightAddon = React22.forwardRef(
   }
 );
 InputRightAddon.displayName = "InputRightAddon";
-var InputLeftElement = React22.forwardRef(
+var InputLeftElement = React24.forwardRef(
   ({ className, children, ...props }, ref) => {
-    return /* @__PURE__ */ React22.createElement(
+    return /* @__PURE__ */ React24.createElement(
       "div",
       {
         ref,
@@ -1565,9 +1706,9 @@ var InputLeftElement = React22.forwardRef(
   }
 );
 InputLeftElement.displayName = "InputLeftElement";
-var InputRightElement = React22.forwardRef(
+var InputRightElement = React24.forwardRef(
   ({ className, children, ...props }, ref) => {
-    return /* @__PURE__ */ React22.createElement(
+    return /* @__PURE__ */ React24.createElement(
       "div",
       {
         ref,
@@ -1582,9 +1723,9 @@ var InputRightElement = React22.forwardRef(
   }
 );
 InputRightElement.displayName = "InputRightElement";
-var InputWrapper = React22.forwardRef(
+var InputWrapper = React24.forwardRef(
   ({ className, children, ...props }, ref) => {
-    return /* @__PURE__ */ React22.createElement(
+    return /* @__PURE__ */ React24.createElement(
       "div",
       {
         ref,
@@ -1598,7 +1739,7 @@ var InputWrapper = React22.forwardRef(
 InputWrapper.displayName = "InputWrapper";
 
 // src/components/Alert.tsx
-import React23 from "react";
+import React25 from "react";
 import { Info, CheckCircle, AlertTriangle, XCircle } from "lucide-react";
 var icons = {
   info: Info,
@@ -1612,10 +1753,10 @@ var variantStyles = {
   warning: "bg-warning/10 border-warning text-warning",
   error: "bg-error/10 border-error text-error"
 };
-var Alert = React23.forwardRef(
+var Alert = React25.forwardRef(
   ({ variant = "info", title, children, className, ...rest }, ref) => {
     const Icon = icons[variant];
-    return /* @__PURE__ */ React23.createElement(
+    return /* @__PURE__ */ React25.createElement(
       "div",
       {
         ref,
@@ -1627,18 +1768,18 @@ var Alert = React23.forwardRef(
         ),
         ...rest
       },
-      /* @__PURE__ */ React23.createElement(Icon, { className: "h-5 w-5 shrink-0" }),
-      /* @__PURE__ */ React23.createElement("div", { className: "flex-1" }, title && /* @__PURE__ */ React23.createElement("h5", { className: "mb-1 font-medium leading-none tracking-tight text-current" }, title), /* @__PURE__ */ React23.createElement("div", { className: "text-sm opacity-90" }, children))
+      /* @__PURE__ */ React25.createElement(Icon, { className: "h-5 w-5 shrink-0" }),
+      /* @__PURE__ */ React25.createElement("div", { className: "flex-1" }, title && /* @__PURE__ */ React25.createElement("h5", { className: "mb-1 font-medium leading-none tracking-tight text-current" }, title), /* @__PURE__ */ React25.createElement("div", { className: "text-sm opacity-90" }, children))
     );
   }
 );
 Alert.displayName = "Alert";
 
 // src/components/Spinner.tsx
-import React24 from "react";
+import React26 from "react";
 var Spinner = ({ className, size = "md", ...rest }) => {
   const sizeClass = size === "sm" ? "h-4 w-4" : size === "lg" ? "h-8 w-8" : "h-6 w-6";
-  return /* @__PURE__ */ React24.createElement(
+  return /* @__PURE__ */ React26.createElement(
     "svg",
     {
       xmlns: "http://www.w3.org/2000/svg",
@@ -1651,20 +1792,20 @@ var Spinner = ({ className, size = "md", ...rest }) => {
       className: cx("animate-spin text-gold", sizeClass, className),
       ...rest
     },
-    /* @__PURE__ */ React24.createElement("path", { d: "M21 12a9 9 0 1 1-6.219-8.56" })
+    /* @__PURE__ */ React26.createElement("path", { d: "M21 12a9 9 0 1 1-6.219-8.56" })
   );
 };
 Spinner.displayName = "Spinner";
 
 // src/components/Skeleton.tsx
-import React25 from "react";
-var Skeleton = React25.forwardRef(
+import React27 from "react";
+var Skeleton = React27.forwardRef(
   ({ className, ...rest }, ref) => {
-    return /* @__PURE__ */ React25.createElement(
+    return /* @__PURE__ */ React27.createElement(
       "div",
       {
         ref,
-        className: cx("animate-pulse bg-ash rounded-sm", className),
+        className: cx("animate-pulse bg-ash", className),
         ...rest
       }
     );
@@ -1673,7 +1814,7 @@ var Skeleton = React25.forwardRef(
 Skeleton.displayName = "Skeleton";
 
 // src/components/Progress.tsx
-import React26 from "react";
+import React28 from "react";
 var SIZE_MAP = {
   sm: "h-1",
   md: "h-2",
@@ -1685,7 +1826,7 @@ var VARIANT_MAP2 = {
   warning: "bg-warning",
   error: "bg-error"
 };
-var Progress = React26.forwardRef(
+var Progress = React28.forwardRef(
   ({
     value = 0,
     max = 100,
@@ -1699,7 +1840,7 @@ var Progress = React26.forwardRef(
   }, ref) => {
     const percentage = Math.min(100, Math.max(0, value / max * 100));
     const displayValue = formatValue ? formatValue(value, max) : `${Math.round(percentage)}%`;
-    return /* @__PURE__ */ React26.createElement("div", { ref, className: cx("w-full", className), ...props }, showValue && /* @__PURE__ */ React26.createElement("div", { className: "flex justify-between mb-1" }, /* @__PURE__ */ React26.createElement("span", { className: "text-sm text-silver" }, "Progress"), /* @__PURE__ */ React26.createElement("span", { className: "text-sm text-white font-medium" }, displayValue)), /* @__PURE__ */ React26.createElement(
+    return /* @__PURE__ */ React28.createElement("div", { ref, className: cx("w-full", className), ...props }, showValue && /* @__PURE__ */ React28.createElement("div", { className: "flex justify-between mb-1" }, /* @__PURE__ */ React28.createElement("span", { className: "text-sm text-silver" }, "Progress"), /* @__PURE__ */ React28.createElement("span", { className: "text-sm text-white font-medium" }, displayValue)), /* @__PURE__ */ React28.createElement(
       "div",
       {
         className: cx(
@@ -1711,7 +1852,7 @@ var Progress = React26.forwardRef(
         "aria-valuemin": 0,
         "aria-valuemax": max
       },
-      /* @__PURE__ */ React26.createElement(
+      /* @__PURE__ */ React28.createElement(
         "div",
         {
           className: cx(
@@ -1730,9 +1871,9 @@ var Progress = React26.forwardRef(
 Progress.displayName = "Progress";
 
 // src/components/Toast.tsx
-import React27, { createContext, useContext, useState as useState3, useCallback as useCallback5, useEffect } from "react";
+import React29, { createContext, useContext, useState as useState3, useCallback as useCallback5, useEffect } from "react";
 import { createPortal } from "react-dom";
-import { X, CheckCircle as CheckCircle2, AlertCircle, AlertTriangle as AlertTriangle2, Info as Info2 } from "lucide-react";
+import { X as X2, CheckCircle as CheckCircle2, AlertCircle, AlertTriangle as AlertTriangle2, Info as Info2 } from "lucide-react";
 var ToastContext = createContext(null);
 function useToast() {
   const context = useContext(ToastContext);
@@ -1776,7 +1917,7 @@ var ToastProvider = ({
   const removeToast = useCallback5((id) => {
     setToasts((prev) => prev.filter((t) => t.id !== id));
   }, []);
-  return /* @__PURE__ */ React27.createElement(ToastContext.Provider, { value: { toasts, addToast, removeToast, position } }, children, mounted && /* @__PURE__ */ React27.createElement(ToastViewport, null));
+  return /* @__PURE__ */ React29.createElement(ToastContext.Provider, { value: { toasts, addToast, removeToast, position } }, children, mounted && /* @__PURE__ */ React29.createElement(ToastViewport, null));
 };
 ToastProvider.displayName = "ToastProvider";
 var ToastViewport = () => {
@@ -1792,7 +1933,7 @@ var ToastViewport = () => {
     "bottom-center": "bottom-4 left-1/2 -translate-x-1/2"
   };
   return createPortal(
-    /* @__PURE__ */ React27.createElement(
+    /* @__PURE__ */ React29.createElement(
       "div",
       {
         className: cx(
@@ -1800,7 +1941,7 @@ var ToastViewport = () => {
           positionClasses[position]
         )
       },
-      toasts.map((toast) => /* @__PURE__ */ React27.createElement(Toast, { key: toast.id, ...toast }))
+      toasts.map((toast) => /* @__PURE__ */ React29.createElement(Toast, { key: toast.id, ...toast }))
     ),
     document.body
   );
@@ -1814,10 +1955,10 @@ var VARIANT_STYLES2 = {
 };
 var VARIANT_ICONS = {
   default: null,
-  success: /* @__PURE__ */ React27.createElement(CheckCircle2, { className: "h-5 w-5 text-success" }),
-  error: /* @__PURE__ */ React27.createElement(AlertCircle, { className: "h-5 w-5 text-error" }),
-  warning: /* @__PURE__ */ React27.createElement(AlertTriangle2, { className: "h-5 w-5 text-warning" }),
-  info: /* @__PURE__ */ React27.createElement(Info2, { className: "h-5 w-5 text-info" })
+  success: /* @__PURE__ */ React29.createElement(CheckCircle2, { className: "h-5 w-5 text-success" }),
+  error: /* @__PURE__ */ React29.createElement(AlertCircle, { className: "h-5 w-5 text-error" }),
+  warning: /* @__PURE__ */ React29.createElement(AlertTriangle2, { className: "h-5 w-5 text-warning" }),
+  info: /* @__PURE__ */ React29.createElement(Info2, { className: "h-5 w-5 text-info" })
 };
 var Toast = ({
   id,
@@ -1837,7 +1978,7 @@ var Toast = ({
     }
   }, [id, duration, context]);
   const icon = VARIANT_ICONS[variant];
-  return /* @__PURE__ */ React27.createElement(
+  return /* @__PURE__ */ React29.createElement(
     "div",
     {
       role: "alert",
@@ -1846,23 +1987,23 @@ var Toast = ({
         VARIANT_STYLES2[variant]
       )
     },
-    /* @__PURE__ */ React27.createElement("div", { className: "flex gap-3" }, icon && /* @__PURE__ */ React27.createElement("div", { className: "shrink-0 mt-0.5" }, icon), /* @__PURE__ */ React27.createElement("div", { className: "flex-1 min-w-0" }, title && /* @__PURE__ */ React27.createElement("p", { className: "text-sm font-medium text-white" }, title), description && /* @__PURE__ */ React27.createElement("p", { className: "text-sm text-silver mt-1" }, description), action && /* @__PURE__ */ React27.createElement("div", { className: "mt-3" }, action)), /* @__PURE__ */ React27.createElement(
+    /* @__PURE__ */ React29.createElement("div", { className: "flex gap-3" }, icon && /* @__PURE__ */ React29.createElement("div", { className: "shrink-0 mt-0.5" }, icon), /* @__PURE__ */ React29.createElement("div", { className: "flex-1 min-w-0" }, title && /* @__PURE__ */ React29.createElement("p", { className: "text-sm font-medium text-white" }, title), description && /* @__PURE__ */ React29.createElement("p", { className: "text-sm text-silver mt-1" }, description), action && /* @__PURE__ */ React29.createElement("div", { className: "mt-3" }, action)), /* @__PURE__ */ React29.createElement(
       "button",
       {
         onClick: () => context?.removeToast(id),
         className: "shrink-0 text-silver hover:text-white transition-colors"
       },
-      /* @__PURE__ */ React27.createElement(X, { className: "h-4 w-4" }),
-      /* @__PURE__ */ React27.createElement("span", { className: "sr-only" }, "Dismiss")
+      /* @__PURE__ */ React29.createElement(X2, { className: "h-4 w-4" }),
+      /* @__PURE__ */ React29.createElement("span", { className: "sr-only" }, "Dismiss")
     ))
   );
 };
 Toast.displayName = "Toast";
 
 // src/components/Modal.tsx
-import React28, { useEffect as useEffect2, useState as useState4 } from "react";
+import React30, { useEffect as useEffect2, useState as useState4 } from "react";
 import { createPortal as createPortal2 } from "react-dom";
-import { X as X2 } from "lucide-react";
+import { X as X3 } from "lucide-react";
 var Modal = ({ isOpen, onClose, title, children, className }) => {
   const [mounted, setMounted] = useState4(false);
   useEffect2(() => {
@@ -1891,7 +2032,7 @@ var Modal = ({ isOpen, onClose, title, children, className }) => {
   }, [onClose]);
   if (!mounted) return null;
   if (!isOpen) return null;
-  const content = /* @__PURE__ */ React28.createElement("div", { className: "fixed inset-0 z-50 flex items-center justify-center p-4 sm:p-6", onClick: onClose }, /* @__PURE__ */ React28.createElement("div", { className: "fixed inset-0 z-40 bg-obsidian/80 backdrop-blur-sm", "aria-hidden": "true" }), /* @__PURE__ */ React28.createElement(
+  const content = /* @__PURE__ */ React30.createElement("div", { className: "fixed inset-0 z-50 flex items-center justify-center p-4 sm:p-6", onClick: onClose }, /* @__PURE__ */ React30.createElement("div", { className: "fixed inset-0 z-40 bg-obsidian/80 backdrop-blur-sm", "aria-hidden": "true" }), /* @__PURE__ */ React30.createElement(
     "div",
     {
       role: "dialog",
@@ -1903,17 +2044,17 @@ var Modal = ({ isOpen, onClose, title, children, className }) => {
       "data-state": "open",
       onClick: (e) => e.stopPropagation()
     },
-    /* @__PURE__ */ React28.createElement("div", { className: "flex items-center justify-between mb-2" }, title ? /* @__PURE__ */ React28.createElement("h3", { className: "text-xl font-semibold text-white m-0" }, title) : /* @__PURE__ */ React28.createElement("div", null), /* @__PURE__ */ React28.createElement("button", { onClick: onClose, className: "text-silver hover:text-white transition-colors ml-auto" }, /* @__PURE__ */ React28.createElement(X2, { className: "h-5 w-5" }), /* @__PURE__ */ React28.createElement("span", { className: "sr-only" }, "Close"))),
-    /* @__PURE__ */ React28.createElement("div", null, children)
+    /* @__PURE__ */ React30.createElement("div", { className: "flex items-center justify-between mb-2" }, title ? /* @__PURE__ */ React30.createElement("h3", { className: "text-xl font-semibold text-white m-0" }, title) : /* @__PURE__ */ React30.createElement("div", null), /* @__PURE__ */ React30.createElement("button", { onClick: onClose, className: "text-silver hover:text-white transition-colors ml-auto" }, /* @__PURE__ */ React30.createElement(X3, { className: "h-5 w-5" }), /* @__PURE__ */ React30.createElement("span", { className: "sr-only" }, "Close"))),
+    /* @__PURE__ */ React30.createElement("div", null, children)
   ));
   return createPortal2(content, document.body);
 };
 Modal.displayName = "Modal";
 
 // src/components/Drawer.tsx
-import React29, { useEffect as useEffect3, useState as useState5 } from "react";
+import React31, { useEffect as useEffect3, useState as useState5 } from "react";
 import { createPortal as createPortal3 } from "react-dom";
-import { X as X3 } from "lucide-react";
+import { X as X4 } from "lucide-react";
 var SIZE_MAP2 = {
   sm: {
     left: "w-64",
@@ -1993,7 +2134,7 @@ var Drawer = ({
     return () => window.removeEventListener("keydown", handleEsc);
   }, [onClose]);
   if (!mounted) return null;
-  const content = /* @__PURE__ */ React29.createElement(
+  const content = /* @__PURE__ */ React31.createElement(
     "div",
     {
       className: cx(
@@ -2001,7 +2142,7 @@ var Drawer = ({
         isOpen ? "pointer-events-auto" : "pointer-events-none"
       )
     },
-    /* @__PURE__ */ React29.createElement(
+    /* @__PURE__ */ React31.createElement(
       "div",
       {
         className: cx(
@@ -2012,7 +2153,7 @@ var Drawer = ({
         "aria-hidden": "true"
       }
     ),
-    /* @__PURE__ */ React29.createElement(
+    /* @__PURE__ */ React31.createElement(
       "div",
       {
         role: "dialog",
@@ -2030,16 +2171,16 @@ var Drawer = ({
           className
         )
       },
-      /* @__PURE__ */ React29.createElement("div", { className: "flex items-center justify-between px-4 py-3 border-b border-ash" }, title ? /* @__PURE__ */ React29.createElement("h2", { className: "text-lg font-semibold text-white m-0" }, title) : /* @__PURE__ */ React29.createElement("div", null), /* @__PURE__ */ React29.createElement(
+      /* @__PURE__ */ React31.createElement("div", { className: "flex items-center justify-between px-4 py-3 border-b border-ash" }, title ? /* @__PURE__ */ React31.createElement("h2", { className: "text-lg font-semibold text-white m-0" }, title) : /* @__PURE__ */ React31.createElement("div", null), /* @__PURE__ */ React31.createElement(
         "button",
         {
           onClick: onClose,
           className: "text-silver hover:text-white transition-colors"
         },
-        /* @__PURE__ */ React29.createElement(X3, { className: "h-5 w-5" }),
-        /* @__PURE__ */ React29.createElement("span", { className: "sr-only" }, "Close")
+        /* @__PURE__ */ React31.createElement(X4, { className: "h-5 w-5" }),
+        /* @__PURE__ */ React31.createElement("span", { className: "sr-only" }, "Close")
       )),
-      /* @__PURE__ */ React29.createElement("div", { className: "flex-1 overflow-auto p-4" }, children)
+      /* @__PURE__ */ React31.createElement("div", { className: "flex-1 overflow-auto p-4" }, children)
     )
   );
   return createPortal3(content, document.body);
@@ -2047,7 +2188,7 @@ var Drawer = ({
 Drawer.displayName = "Drawer";
 
 // src/components/Popover.tsx
-import React30, { useState as useState6, useRef as useRef3, useEffect as useEffect4, useCallback as useCallback6, useId } from "react";
+import React32, { useState as useState6, useRef as useRef3, useEffect as useEffect4, useCallback as useCallback6, useId } from "react";
 var POSITION_CLASSES2 = {
   top: {
     start: "bottom-full left-0 mb-2",
@@ -2116,14 +2257,14 @@ var Popover = ({
   const handleTriggerClick = () => {
     setIsOpen(!isOpen);
   };
-  const triggerElement = React30.cloneElement(trigger, {
+  const triggerElement = React32.cloneElement(trigger, {
     onClick: handleTriggerClick,
     "aria-haspopup": "dialog",
     "aria-expanded": isOpen,
     "aria-controls": `${baseId}-popover`,
     id: `${baseId}-trigger`
   });
-  return /* @__PURE__ */ React30.createElement("div", { ref: containerRef, className: "relative inline-block" }, triggerElement, isOpen && /* @__PURE__ */ React30.createElement(
+  return /* @__PURE__ */ React32.createElement("div", { ref: containerRef, className: "relative inline-block" }, triggerElement, isOpen && /* @__PURE__ */ React32.createElement(
     "div",
     {
       id: `${baseId}-popover`,
@@ -2142,7 +2283,7 @@ var Popover = ({
 Popover.displayName = "Popover";
 
 // src/components/Dialog.tsx
-import React31, { useCallback as useCallback7 } from "react";
+import React33, { useCallback as useCallback7 } from "react";
 var ConfirmDialog = ({
   title = "Confirm",
   description,
@@ -2163,7 +2304,7 @@ var ConfirmDialog = ({
     await onConfirm();
     onClose();
   }, [onConfirm, onClose]);
-  return /* @__PURE__ */ React31.createElement(Modal, { title, onClose, ...props }, description && /* @__PURE__ */ React31.createElement("p", { className: "text-sm text-silver mb-6" }, description), /* @__PURE__ */ React31.createElement("div", { className: "flex justify-end gap-3" }, /* @__PURE__ */ React31.createElement(Button, { variant: "outlined", onClick: handleCancel, disabled: isLoading }, cancelText), /* @__PURE__ */ React31.createElement(
+  return /* @__PURE__ */ React33.createElement(Modal, { title, onClose, ...props }, description && /* @__PURE__ */ React33.createElement("p", { className: "text-sm text-silver mb-6" }, description), /* @__PURE__ */ React33.createElement("div", { className: "flex justify-end gap-3" }, /* @__PURE__ */ React33.createElement(Button, { variant: "outlined", onClick: handleCancel, disabled: isLoading }, cancelText), /* @__PURE__ */ React33.createElement(
     Button,
     {
       variant: confirmVariant,
@@ -2186,7 +2327,7 @@ var AlertDialog = ({
     variant === "warning" && "text-warning",
     variant === "error" && "text-error"
   );
-  return /* @__PURE__ */ React31.createElement(Modal, { onClose, ...props }, /* @__PURE__ */ React31.createElement("h3", { className: cx("text-xl font-semibold mb-2", titleClass) }, title), description && /* @__PURE__ */ React31.createElement("p", { className: "text-sm text-silver mb-6" }, description), /* @__PURE__ */ React31.createElement("div", { className: "flex justify-end" }, /* @__PURE__ */ React31.createElement(Button, { variant: "primary", onClick: onClose }, acknowledgeText)));
+  return /* @__PURE__ */ React33.createElement(Modal, { onClose, ...props }, /* @__PURE__ */ React33.createElement("h3", { className: cx("text-xl font-semibold mb-2", titleClass) }, title), description && /* @__PURE__ */ React33.createElement("p", { className: "text-sm text-silver mb-6" }, description), /* @__PURE__ */ React33.createElement("div", { className: "flex justify-end" }, /* @__PURE__ */ React33.createElement(Button, { variant: "primary", onClick: onClose }, acknowledgeText)));
 };
 AlertDialog.displayName = "AlertDialog";
 var PromptDialog = ({
@@ -2202,7 +2343,7 @@ var PromptDialog = ({
   isLoading = false,
   ...props
 }) => {
-  const [value, setValue] = React31.useState(defaultValue);
+  const [value, setValue] = React33.useState(defaultValue);
   const handleCancel = useCallback7(() => {
     onCancel?.();
     onClose();
@@ -2215,7 +2356,7 @@ var PromptDialog = ({
     },
     [onSubmit, value, onClose]
   );
-  return /* @__PURE__ */ React31.createElement(Modal, { title, onClose, ...props }, /* @__PURE__ */ React31.createElement("form", { onSubmit: handleSubmit }, description && /* @__PURE__ */ React31.createElement("p", { className: "text-sm text-silver mb-4" }, description), /* @__PURE__ */ React31.createElement(
+  return /* @__PURE__ */ React33.createElement(Modal, { title, onClose, ...props }, /* @__PURE__ */ React33.createElement("form", { onSubmit: handleSubmit }, description && /* @__PURE__ */ React33.createElement("p", { className: "text-sm text-silver mb-4" }, description), /* @__PURE__ */ React33.createElement(
     "input",
     {
       type: "text",
@@ -2230,7 +2371,7 @@ var PromptDialog = ({
       ),
       autoFocus: true
     }
-  ), /* @__PURE__ */ React31.createElement("div", { className: "flex justify-end gap-3" }, /* @__PURE__ */ React31.createElement(
+  ), /* @__PURE__ */ React33.createElement("div", { className: "flex justify-end gap-3" }, /* @__PURE__ */ React33.createElement(
     Button,
     {
       type: "button",
@@ -2239,12 +2380,12 @@ var PromptDialog = ({
       disabled: isLoading
     },
     cancelText
-  ), /* @__PURE__ */ React31.createElement(Button, { type: "submit", variant: "important", loading: isLoading }, submitText))));
+  ), /* @__PURE__ */ React33.createElement(Button, { type: "submit", variant: "important", loading: isLoading }, submitText))));
 };
 PromptDialog.displayName = "PromptDialog";
 
 // src/components/Tabs.tsx
-import React32, { createContext as createContext2, useContext as useContext2, useState as useState7, useCallback as useCallback8, useId as useId2 } from "react";
+import React34, { createContext as createContext2, useContext as useContext2, useState as useState7, useCallback as useCallback8, useId as useId2 } from "react";
 var TabsContext = createContext2(null);
 function useTabsContext() {
   const context = useContext2(TabsContext);
@@ -2253,7 +2394,7 @@ function useTabsContext() {
   }
   return context;
 }
-var Tabs = React32.forwardRef(
+var Tabs = React34.forwardRef(
   ({ defaultValue, value, onValueChange, children, className, ...props }, ref) => {
     const [internalValue, setInternalValue] = useState7(defaultValue ?? "");
     const isControlled = value !== void 0;
@@ -2268,13 +2409,13 @@ var Tabs = React32.forwardRef(
       },
       [isControlled, onValueChange]
     );
-    return /* @__PURE__ */ React32.createElement(TabsContext.Provider, { value: { activeTab, setActiveTab, baseId } }, /* @__PURE__ */ React32.createElement("div", { ref, className: cx("w-full", className), ...props }, children));
+    return /* @__PURE__ */ React34.createElement(TabsContext.Provider, { value: { activeTab, setActiveTab, baseId } }, /* @__PURE__ */ React34.createElement("div", { ref, className: cx("w-full", className), ...props }, children));
   }
 );
 Tabs.displayName = "Tabs";
-var TabList = React32.forwardRef(
+var TabList = React34.forwardRef(
   ({ children, className, ...props }, ref) => {
-    return /* @__PURE__ */ React32.createElement(
+    return /* @__PURE__ */ React34.createElement(
       "div",
       {
         ref,
@@ -2290,13 +2431,13 @@ var TabList = React32.forwardRef(
   }
 );
 TabList.displayName = "TabList";
-var Tab = React32.forwardRef(
+var Tab = React34.forwardRef(
   ({ value, children, className, disabled, ...props }, ref) => {
     const { activeTab, setActiveTab, baseId } = useTabsContext();
     const isActive = activeTab === value;
     const panelId = `${baseId}-panel-${value}`;
     const tabId = `${baseId}-tab-${value}`;
-    return /* @__PURE__ */ React32.createElement(
+    return /* @__PURE__ */ React34.createElement(
       "button",
       {
         ref,
@@ -2323,7 +2464,7 @@ var Tab = React32.forwardRef(
   }
 );
 Tab.displayName = "Tab";
-var TabPanel = React32.forwardRef(
+var TabPanel = React34.forwardRef(
   ({ value, forceMount = false, children, className, ...props }, ref) => {
     const { activeTab, baseId } = useTabsContext();
     const isActive = activeTab === value;
@@ -2332,7 +2473,7 @@ var TabPanel = React32.forwardRef(
     if (!isActive && !forceMount) {
       return null;
     }
-    return /* @__PURE__ */ React32.createElement(
+    return /* @__PURE__ */ React34.createElement(
       "div",
       {
         ref,
@@ -2355,7 +2496,7 @@ var TabPanel = React32.forwardRef(
 TabPanel.displayName = "TabPanel";
 
 // src/components/Accordion.tsx
-import React33, { createContext as createContext3, useContext as useContext3, useState as useState8, useCallback as useCallback9, useId as useId3 } from "react";
+import React35, { createContext as createContext3, useContext as useContext3, useState as useState8, useCallback as useCallback9, useId as useId3 } from "react";
 import { ChevronDown } from "lucide-react";
 var AccordionContext = createContext3(null);
 function useAccordionContext() {
@@ -2365,7 +2506,7 @@ function useAccordionContext() {
   }
   return context;
 }
-var Accordion = React33.forwardRef(
+var Accordion = React35.forwardRef(
   ({ type = "single", defaultValue, value, onValueChange, children, className, ...props }, ref) => {
     const [internalValue, setInternalValue] = useState8(() => {
       if (defaultValue) {
@@ -2394,7 +2535,7 @@ var Accordion = React33.forwardRef(
       },
       [expandedItems, type, isControlled, onValueChange]
     );
-    return /* @__PURE__ */ React33.createElement(AccordionContext.Provider, { value: { expandedItems, toggleItem, type } }, /* @__PURE__ */ React33.createElement(
+    return /* @__PURE__ */ React35.createElement(AccordionContext.Provider, { value: { expandedItems, toggleItem, type } }, /* @__PURE__ */ React35.createElement(
       "div",
       {
         ref,
@@ -2407,9 +2548,9 @@ var Accordion = React33.forwardRef(
 );
 Accordion.displayName = "Accordion";
 var AccordionItemContext = createContext3(null);
-var AccordionItem = React33.forwardRef(
+var AccordionItem = React35.forwardRef(
   ({ value, disabled = false, children, className, ...props }, ref) => {
-    return /* @__PURE__ */ React33.createElement(AccordionItemContext.Provider, { value: { value, disabled } }, /* @__PURE__ */ React33.createElement(
+    return /* @__PURE__ */ React35.createElement(AccordionItemContext.Provider, { value: { value, disabled } }, /* @__PURE__ */ React35.createElement(
       "div",
       {
         ref,
@@ -2422,7 +2563,7 @@ var AccordionItem = React33.forwardRef(
   }
 );
 AccordionItem.displayName = "AccordionItem";
-var AccordionTrigger = React33.forwardRef(
+var AccordionTrigger = React35.forwardRef(
   ({ children, className, ...props }, ref) => {
     const { expandedItems, toggleItem } = useAccordionContext();
     const itemContext = useContext3(AccordionItemContext);
@@ -2432,7 +2573,7 @@ var AccordionTrigger = React33.forwardRef(
     }
     const { value, disabled } = itemContext;
     const isExpanded = expandedItems.has(value);
-    return /* @__PURE__ */ React33.createElement("h3", { className: "m-0" }, /* @__PURE__ */ React33.createElement(
+    return /* @__PURE__ */ React35.createElement("h3", { className: "m-0" }, /* @__PURE__ */ React35.createElement(
       "button",
       {
         ref,
@@ -2453,8 +2594,8 @@ var AccordionTrigger = React33.forwardRef(
         ),
         ...props
       },
-      /* @__PURE__ */ React33.createElement("span", null, children),
-      /* @__PURE__ */ React33.createElement(
+      /* @__PURE__ */ React35.createElement("span", null, children),
+      /* @__PURE__ */ React35.createElement(
         ChevronDown,
         {
           className: cx(
@@ -2467,7 +2608,7 @@ var AccordionTrigger = React33.forwardRef(
   }
 );
 AccordionTrigger.displayName = "AccordionTrigger";
-var AccordionContent = React33.forwardRef(
+var AccordionContent = React35.forwardRef(
   ({ children, className, ...props }, ref) => {
     const { expandedItems } = useAccordionContext();
     const itemContext = useContext3(AccordionItemContext);
@@ -2477,7 +2618,7 @@ var AccordionContent = React33.forwardRef(
     }
     const { value } = itemContext;
     const isExpanded = expandedItems.has(value);
-    return /* @__PURE__ */ React33.createElement(
+    return /* @__PURE__ */ React35.createElement(
       "div",
       {
         ref,
@@ -2492,14 +2633,14 @@ var AccordionContent = React33.forwardRef(
         ),
         ...props
       },
-      /* @__PURE__ */ React33.createElement("div", { className: "px-4 pb-4 text-sm text-silver" }, children)
+      /* @__PURE__ */ React35.createElement("div", { className: "px-4 pb-4 text-sm text-silver" }, children)
     );
   }
 );
 AccordionContent.displayName = "AccordionContent";
 
 // src/components/Menu.tsx
-import React34, {
+import React36, {
   createContext as createContext4,
   useContext as useContext4,
   useState as useState9,
@@ -2530,7 +2671,7 @@ var Menu = ({ children, open, onOpenChange }) => {
     },
     [isControlled, onOpenChange]
   );
-  return /* @__PURE__ */ React34.createElement(
+  return /* @__PURE__ */ React36.createElement(
     MenuContext.Provider,
     {
       value: {
@@ -2540,11 +2681,11 @@ var Menu = ({ children, open, onOpenChange }) => {
         menuId: `${baseId}-menu`
       }
     },
-    /* @__PURE__ */ React34.createElement("div", { className: "relative inline-block" }, children)
+    /* @__PURE__ */ React36.createElement("div", { className: "relative inline-block" }, children)
   );
 };
 Menu.displayName = "Menu";
-var MenuTrigger = React34.forwardRef(
+var MenuTrigger = React36.forwardRef(
   ({ children, className, asChild, ...props }, ref) => {
     const { isOpen, setIsOpen, triggerId, menuId } = useMenuContext();
     const handleClick = (e) => {
@@ -2552,7 +2693,7 @@ var MenuTrigger = React34.forwardRef(
       setIsOpen(!isOpen);
       props.onClick?.(e);
     };
-    return /* @__PURE__ */ React34.createElement(
+    return /* @__PURE__ */ React36.createElement(
       "button",
       {
         ref,
@@ -2573,7 +2714,7 @@ var MenuTrigger = React34.forwardRef(
   }
 );
 MenuTrigger.displayName = "MenuTrigger";
-var MenuContent = React34.forwardRef(
+var MenuContent = React36.forwardRef(
   ({ children, className, align = "start", side = "bottom", ...props }, ref) => {
     const { isOpen, setIsOpen, triggerId, menuId } = useMenuContext();
     const menuRef = useRef4(null);
@@ -2607,7 +2748,7 @@ var MenuContent = React34.forwardRef(
       top: "bottom-full mb-1",
       bottom: "top-full mt-1"
     };
-    return /* @__PURE__ */ React34.createElement(
+    return /* @__PURE__ */ React36.createElement(
       "div",
       {
         ref: (node) => {
@@ -2633,7 +2774,7 @@ var MenuContent = React34.forwardRef(
   }
 );
 MenuContent.displayName = "MenuContent";
-var MenuItem = React34.forwardRef(
+var MenuItem = React36.forwardRef(
   ({ children, className, icon, destructive, disabled, onClick, ...props }, ref) => {
     const { setIsOpen } = useMenuContext();
     const handleClick = (e) => {
@@ -2641,7 +2782,7 @@ var MenuItem = React34.forwardRef(
       onClick?.(e);
       setIsOpen(false);
     };
-    return /* @__PURE__ */ React34.createElement(
+    return /* @__PURE__ */ React36.createElement(
       "button",
       {
         ref,
@@ -2659,13 +2800,13 @@ var MenuItem = React34.forwardRef(
         ),
         ...props
       },
-      icon && /* @__PURE__ */ React34.createElement("span", { className: "w-4 h-4 shrink-0" }, icon),
+      icon && /* @__PURE__ */ React36.createElement("span", { className: "w-4 h-4 shrink-0" }, icon),
       children
     );
   }
 );
 MenuItem.displayName = "MenuItem";
-var MenuSeparator = React34.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React34.createElement(
+var MenuSeparator = React36.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React36.createElement(
   "div",
   {
     ref,
@@ -2675,7 +2816,7 @@ var MenuSeparator = React34.forwardRef(({ className, ...props }, ref) => /* @__P
   }
 ));
 MenuSeparator.displayName = "MenuSeparator";
-var MenuLabel = React34.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ React34.createElement(
+var MenuLabel = React36.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ React36.createElement(
   "div",
   {
     ref,
@@ -2687,10 +2828,10 @@ var MenuLabel = React34.forwardRef(({ className, children, ...props }, ref) => /
 MenuLabel.displayName = "MenuLabel";
 
 // src/components/Navbar.tsx
-import React35 from "react";
-var Navbar = React35.forwardRef(
+import React37 from "react";
+var Navbar = React37.forwardRef(
   ({ fixed = false, bordered = true, className, children, ...props }, ref) => {
-    return /* @__PURE__ */ React35.createElement(
+    return /* @__PURE__ */ React37.createElement(
       "nav",
       {
         ref,
@@ -2702,14 +2843,14 @@ var Navbar = React35.forwardRef(
         ),
         ...props
       },
-      /* @__PURE__ */ React35.createElement("div", { className: "flex items-center justify-between" }, children)
+      /* @__PURE__ */ React37.createElement("div", { className: "flex items-center justify-between" }, children)
     );
   }
 );
 Navbar.displayName = "Navbar";
-var NavbarBrand = React35.forwardRef(
+var NavbarBrand = React37.forwardRef(
   ({ className, children, ...props }, ref) => {
-    return /* @__PURE__ */ React35.createElement(
+    return /* @__PURE__ */ React37.createElement(
       "div",
       {
         ref,
@@ -2721,14 +2862,14 @@ var NavbarBrand = React35.forwardRef(
   }
 );
 NavbarBrand.displayName = "NavbarBrand";
-var NavbarContent = React35.forwardRef(
+var NavbarContent = React37.forwardRef(
   ({ position = "center", className, children, ...props }, ref) => {
     const positionClasses = {
       start: "mr-auto",
       center: "mx-auto",
       end: "ml-auto"
     };
-    return /* @__PURE__ */ React35.createElement(
+    return /* @__PURE__ */ React37.createElement(
       "div",
       {
         ref,
@@ -2744,9 +2885,9 @@ var NavbarContent = React35.forwardRef(
   }
 );
 NavbarContent.displayName = "NavbarContent";
-var NavbarItem = React35.forwardRef(
+var NavbarItem = React37.forwardRef(
   ({ active = false, className, children, ...props }, ref) => {
-    return /* @__PURE__ */ React35.createElement(
+    return /* @__PURE__ */ React37.createElement(
       "div",
       {
         ref,
@@ -2761,9 +2902,9 @@ var NavbarItem = React35.forwardRef(
   }
 );
 NavbarItem.displayName = "NavbarItem";
-var NavbarLink = React35.forwardRef(
+var NavbarLink = React37.forwardRef(
   ({ active = false, className, children, ...props }, ref) => {
-    return /* @__PURE__ */ React35.createElement(
+    return /* @__PURE__ */ React37.createElement(
       "a",
       {
         ref,
@@ -2779,7 +2920,7 @@ var NavbarLink = React35.forwardRef(
   }
 );
 NavbarLink.displayName = "NavbarLink";
-var NavbarDivider = React35.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React35.createElement(
+var NavbarDivider = React37.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React37.createElement(
   "div",
   {
     ref,
@@ -2790,19 +2931,19 @@ var NavbarDivider = React35.forwardRef(({ className, ...props }, ref) => /* @__P
 NavbarDivider.displayName = "NavbarDivider";
 
 // src/components/Breadcrumb.tsx
-import React36 from "react";
+import React38 from "react";
 import { ChevronRight } from "lucide-react";
-var Breadcrumb = React36.forwardRef(
+var Breadcrumb = React38.forwardRef(
   ({ separator, className, children, ...props }, ref) => {
-    const items = React36.Children.toArray(children);
-    const defaultSeparator = /* @__PURE__ */ React36.createElement(ChevronRight, { className: "h-4 w-4 text-ash" });
-    return /* @__PURE__ */ React36.createElement("nav", { ref, "aria-label": "Breadcrumb", className, ...props }, /* @__PURE__ */ React36.createElement("ol", { className: "flex items-center gap-2" }, items.map((child, index) => /* @__PURE__ */ React36.createElement("li", { key: index, className: "flex items-center gap-2" }, child, index < items.length - 1 && /* @__PURE__ */ React36.createElement("span", { "aria-hidden": "true" }, separator ?? defaultSeparator)))));
+    const items = React38.Children.toArray(children);
+    const defaultSeparator = /* @__PURE__ */ React38.createElement(ChevronRight, { className: "h-4 w-4 text-ash" });
+    return /* @__PURE__ */ React38.createElement("nav", { ref, "aria-label": "Breadcrumb", className, ...props }, /* @__PURE__ */ React38.createElement("ol", { className: "flex items-center gap-2" }, items.map((child, index) => /* @__PURE__ */ React38.createElement("li", { key: index, className: "flex items-center gap-2" }, child, index < items.length - 1 && /* @__PURE__ */ React38.createElement("span", { "aria-hidden": "true" }, separator ?? defaultSeparator)))));
   }
 );
 Breadcrumb.displayName = "Breadcrumb";
-var BreadcrumbItem = React36.forwardRef(
+var BreadcrumbItem = React38.forwardRef(
   ({ current = false, className, children, ...props }, ref) => {
-    return /* @__PURE__ */ React36.createElement(
+    return /* @__PURE__ */ React38.createElement(
       "span",
       {
         ref,
@@ -2819,9 +2960,9 @@ var BreadcrumbItem = React36.forwardRef(
   }
 );
 BreadcrumbItem.displayName = "BreadcrumbItem";
-var BreadcrumbLink = React36.forwardRef(
+var BreadcrumbLink = React38.forwardRef(
   ({ className, children, ...props }, ref) => {
-    return /* @__PURE__ */ React36.createElement(
+    return /* @__PURE__ */ React38.createElement(
       "a",
       {
         ref,
@@ -2838,7 +2979,7 @@ var BreadcrumbLink = React36.forwardRef(
 BreadcrumbLink.displayName = "BreadcrumbLink";
 
 // src/components/Pagination.tsx
-import React37 from "react";
+import React39 from "react";
 import { ChevronLeft, ChevronRight as ChevronRight2, MoreHorizontal } from "lucide-react";
 function generatePagination(currentPage, totalPages, siblingCount) {
   const totalSlots = siblingCount * 2 + 5;
@@ -2868,7 +3009,7 @@ function generatePagination(currentPage, totalPages, siblingCount) {
   );
   return [1, "ellipsis", ...middleRange, "ellipsis", totalPages];
 }
-var Pagination = React37.forwardRef(
+var Pagination = React39.forwardRef(
   ({
     page,
     totalPages,
@@ -2880,7 +3021,7 @@ var Pagination = React37.forwardRef(
   }, ref) => {
     const pages = generatePagination(page, totalPages, siblingCount);
     const buttonBaseClass = "flex items-center justify-center h-8 min-w-8 px-2 text-sm border border-ash transition-colors duration-fast focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-gold";
-    return /* @__PURE__ */ React37.createElement(
+    return /* @__PURE__ */ React39.createElement(
       "nav",
       {
         ref,
@@ -2889,7 +3030,7 @@ var Pagination = React37.forwardRef(
         className: cx("flex items-center gap-1", className),
         ...props
       },
-      /* @__PURE__ */ React37.createElement(
+      /* @__PURE__ */ React39.createElement(
         "button",
         {
           type: "button",
@@ -2902,17 +3043,17 @@ var Pagination = React37.forwardRef(
             page <= 1 && "opacity-50 cursor-not-allowed hover:border-ash"
           )
         },
-        /* @__PURE__ */ React37.createElement(ChevronLeft, { className: "h-4 w-4" })
+        /* @__PURE__ */ React39.createElement(ChevronLeft, { className: "h-4 w-4" })
       ),
       pages.map(
-        (pageNum, index) => pageNum === "ellipsis" ? /* @__PURE__ */ React37.createElement(
+        (pageNum, index) => pageNum === "ellipsis" ? /* @__PURE__ */ React39.createElement(
           "span",
           {
             key: `ellipsis-${index}`,
             className: "flex items-center justify-center h-8 w-8 text-silver"
           },
-          /* @__PURE__ */ React37.createElement(MoreHorizontal, { className: "h-4 w-4" })
-        ) : /* @__PURE__ */ React37.createElement(
+          /* @__PURE__ */ React39.createElement(MoreHorizontal, { className: "h-4 w-4" })
+        ) : /* @__PURE__ */ React39.createElement(
           "button",
           {
             key: pageNum,
@@ -2928,7 +3069,7 @@ var Pagination = React37.forwardRef(
           pageNum
         )
       ),
-      /* @__PURE__ */ React37.createElement(
+      /* @__PURE__ */ React39.createElement(
         "button",
         {
           type: "button",
@@ -2941,7 +3082,7 @@ var Pagination = React37.forwardRef(
             page >= totalPages && "opacity-50 cursor-not-allowed hover:border-ash"
           )
         },
-        /* @__PURE__ */ React37.createElement(ChevronRight2, { className: "h-4 w-4" })
+        /* @__PURE__ */ React39.createElement(ChevronRight2, { className: "h-4 w-4" })
       )
     );
   }
@@ -2949,9 +3090,9 @@ var Pagination = React37.forwardRef(
 Pagination.displayName = "Pagination";
 
 // src/components/Stepper.tsx
-import React38 from "react";
+import React40 from "react";
 import { Check as Check2 } from "lucide-react";
-var Stepper = React38.forwardRef(
+var Stepper = React40.forwardRef(
   ({ steps, currentStep, status, className, ...rest }, ref) => {
     const currentIndex = steps.findIndex((step) => step.id === currentStep);
     const getStepState = (index) => {
@@ -2963,7 +3104,7 @@ var Stepper = React38.forwardRef(
       }
       return "future";
     };
-    return /* @__PURE__ */ React38.createElement(
+    return /* @__PURE__ */ React40.createElement(
       "div",
       {
         ref,
@@ -2973,7 +3114,7 @@ var Stepper = React38.forwardRef(
       steps.map((step, index) => {
         const state = getStepState(index);
         const isLast = index === steps.length - 1;
-        return /* @__PURE__ */ React38.createElement(React38.Fragment, { key: step.id }, /* @__PURE__ */ React38.createElement("div", { className: "flex flex-col items-center" }, /* @__PURE__ */ React38.createElement(
+        return /* @__PURE__ */ React40.createElement(React40.Fragment, { key: step.id }, /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col items-center" }, /* @__PURE__ */ React40.createElement(
           "div",
           {
             className: cx(
@@ -2984,8 +3125,8 @@ var Stepper = React38.forwardRef(
               state === "future" && "bg-charcoal border-ash text-silver"
             )
           },
-          state === "complete" ? /* @__PURE__ */ React38.createElement(Check2, { className: "h-5 w-5" }) : /* @__PURE__ */ React38.createElement("span", null, index + 1)
-        ), /* @__PURE__ */ React38.createElement(
+          state === "complete" ? /* @__PURE__ */ React40.createElement(Check2, { className: "h-5 w-5" }) : /* @__PURE__ */ React40.createElement("span", null, index + 1)
+        ), /* @__PURE__ */ React40.createElement(
           "span",
           {
             className: cx(
@@ -2997,7 +3138,7 @@ var Stepper = React38.forwardRef(
             )
           },
           step.label
-        )), !isLast && /* @__PURE__ */ React38.createElement(
+        )), !isLast && /* @__PURE__ */ React40.createElement(
           "div",
           {
             className: cx(
@@ -3013,10 +3154,10 @@ var Stepper = React38.forwardRef(
 Stepper.displayName = "Stepper";
 
 // src/components/Message.tsx
-import React41 from "react";
+import React42, { useState as useState10, useEffect as useEffect6, useRef as useRef5 } from "react";
 
 // src/components/MarkdownContent.tsx
-import React39, { useMemo } from "react";
+import React41, { useMemo } from "react";
 import DOMPurify from "dompurify";
 var DEFAULT_SANITIZE_CONFIG = {
   ALLOWED_TAGS: [
@@ -3095,17 +3236,45 @@ function useDOMPurifySetup() {
     });
   }, []);
 }
-var MarkdownContent = React39.forwardRef(
-  ({ className, content, sanitizeConfig, ...rest }, ref) => {
+var CURSOR_BASE_CLASSES = "inline-block bg-current animate-cursor-blink w-0.5 h-cursor translate-y-cursor-offset";
+function injectStreamingCursor(html, cursorClassName) {
+  if (!html.trim()) {
+    return `<span class="${cx(CURSOR_BASE_CLASSES, cursorClassName)}" aria-hidden="true"></span>`;
+  }
+  const cursorHtml = `<span class="${cx(CURSOR_BASE_CLASSES, cursorClassName)}" aria-hidden="true"></span>`;
+  const parser = new DOMParser();
+  const doc = parser.parseFromString(`<div>${html}</div>`, "text/html");
+  const container = doc.body.firstChild;
+  if (!container) {
+    return html + cursorHtml;
+  }
+  let target = container;
+  while (target.lastElementChild) {
+    const lastChild = target.lastElementChild;
+    const tagName = lastChild.tagName.toLowerCase();
+    if (["code", "a", "strong", "em", "b", "i", "span", "mark", "del", "s"].includes(tagName)) {
+      break;
+    }
+    target = lastChild;
+  }
+  target.insertAdjacentHTML("beforeend", cursorHtml);
+  return container.innerHTML;
+}
+var MarkdownContent = React41.forwardRef(
+  ({ className, content, sanitizeConfig, isStreaming, cursorClassName, ...rest }, ref) => {
     useDOMPurifySetup();
     const sanitizedHtml = useMemo(() => {
-      if (!content) {
+      if (!content && !isStreaming) {
         return "";
       }
       const config = sanitizeConfig ?? DEFAULT_SANITIZE_CONFIG;
-      return DOMPurify.sanitize(content, config);
-    }, [content, sanitizeConfig]);
-    return /* @__PURE__ */ React39.createElement(
+      const sanitized = content ? DOMPurify.sanitize(content, config) : "";
+      if (isStreaming) {
+        return injectStreamingCursor(sanitized, cursorClassName);
+      }
+      return sanitized;
+    }, [content, sanitizeConfig, isStreaming, cursorClassName]);
+    return /* @__PURE__ */ React41.createElement(
       "div",
       {
         ref,
@@ -3118,16 +3287,202 @@ var MarkdownContent = React39.forwardRef(
 );
 MarkdownContent.displayName = "MarkdownContent";
 
+// src/components/Message.tsx
+var variantStyles2 = {
+  user: "bg-gold text-obsidian ml-auto",
+  assistant: "bg-charcoal border border-ash text-white mr-auto"
+};
+var ActionButton = ({ onClick, label, children, className, disabled }) => /* @__PURE__ */ React42.createElement(
+  "button",
+  {
+    type: "button",
+    onClick,
+    disabled,
+    className: cx(
+      "p-1.5 text-silver/60 hover:text-silver transition-colors duration-150",
+      "hover:bg-white/5",
+      "disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:bg-transparent",
+      className
+    ),
+    "aria-label": label
+  },
+  children
+);
+var CopyIcon = () => /* @__PURE__ */ React42.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "w-3.5 h-3.5" }, /* @__PURE__ */ React42.createElement("rect", { width: "14", height: "14", x: "8", y: "8", rx: "2", ry: "2" }), /* @__PURE__ */ React42.createElement("path", { d: "M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2" }));
+var CheckIcon = () => /* @__PURE__ */ React42.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "w-3.5 h-3.5 text-success" }, /* @__PURE__ */ React42.createElement("polyline", { points: "20 6 9 17 4 12" }));
+var PencilIcon = () => /* @__PURE__ */ React42.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "w-3.5 h-3.5" }, /* @__PURE__ */ React42.createElement("path", { d: "M17 3a2.85 2.83 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5Z" }), /* @__PURE__ */ React42.createElement("path", { d: "m15 5 4 4" }));
+var RetryIcon = () => /* @__PURE__ */ React42.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "w-3.5 h-3.5" }, /* @__PURE__ */ React42.createElement("path", { d: "M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8" }), /* @__PURE__ */ React42.createElement("path", { d: "M21 3v5h-5" }), /* @__PURE__ */ React42.createElement("path", { d: "M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16" }), /* @__PURE__ */ React42.createElement("path", { d: "M8 16H3v5" }));
+var ChevronLeftIcon = () => /* @__PURE__ */ React42.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "w-3 h-3" }, /* @__PURE__ */ React42.createElement("path", { d: "m15 18-6-6 6-6" }));
+var ChevronRightIcon = () => /* @__PURE__ */ React42.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "w-3 h-3" }, /* @__PURE__ */ React42.createElement("path", { d: "m9 18 6-6-6-6" }));
+var GitBranchIcon = () => /* @__PURE__ */ React42.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "w-3 h-3 mr-0.5 text-silver/50" }, /* @__PURE__ */ React42.createElement("line", { x1: "6", x2: "6", y1: "3", y2: "15" }), /* @__PURE__ */ React42.createElement("circle", { cx: "18", cy: "6", r: "3" }), /* @__PURE__ */ React42.createElement("circle", { cx: "6", cy: "18", r: "3" }), /* @__PURE__ */ React42.createElement("path", { d: "M18 9a9 9 0 0 1-9 9" }));
+var XIcon = () => /* @__PURE__ */ React42.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "w-4 h-4" }, /* @__PURE__ */ React42.createElement("path", { d: "M18 6 6 18" }), /* @__PURE__ */ React42.createElement("path", { d: "m6 6 12 12" }));
+var SendIcon = () => /* @__PURE__ */ React42.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "w-4 h-4" }, /* @__PURE__ */ React42.createElement("path", { d: "m22 2-7 20-4-9-9-4Z" }), /* @__PURE__ */ React42.createElement("path", { d: "M22 2 11 13" }));
+var Message = React42.forwardRef(
+  ({ variant = "assistant", className, content, isStreaming, branchInfo, actions, hideActions, ...rest }, ref) => {
+    const isUser = variant === "user";
+    const [copied, setCopied] = useState10(false);
+    const [isEditing, setIsEditing] = useState10(false);
+    const [editValue, setEditValue] = useState10(content);
+    const textareaRef = useRef5(null);
+    const showBranchNav = branchInfo && branchInfo.total > 1;
+    const showActions = actions && !hideActions && !isStreaming;
+    useEffect6(() => {
+      if (isEditing && textareaRef.current) {
+        const textarea = textareaRef.current;
+        textarea.style.height = "auto";
+        textarea.style.height = `${textarea.scrollHeight}px`;
+        textarea.focus();
+        textarea.setSelectionRange(textarea.value.length, textarea.value.length);
+      }
+    }, [isEditing]);
+    const handleCopy = async () => {
+      try {
+        await navigator.clipboard.writeText(content);
+        setCopied(true);
+        setTimeout(() => setCopied(false), 2e3);
+      } catch {
+        const textArea = document.createElement("textarea");
+        textArea.value = content;
+        document.body.appendChild(textArea);
+        textArea.select();
+        document.execCommand("copy");
+        document.body.removeChild(textArea);
+        setCopied(true);
+        setTimeout(() => setCopied(false), 2e3);
+      }
+    };
+    const handleStartEdit = () => {
+      setEditValue(content);
+      setIsEditing(true);
+    };
+    const handleCancelEdit = () => {
+      setIsEditing(false);
+      setEditValue(content);
+    };
+    const handleSubmitEdit = () => {
+      const trimmed = editValue.trim();
+      if (trimmed && trimmed !== content) {
+        actions?.onEdit?.(trimmed);
+      }
+      setIsEditing(false);
+    };
+    const handleEditKeyDown = (e) => {
+      if (e.key === "Enter" && !e.shiftKey) {
+        e.preventDefault();
+        handleSubmitEdit();
+      } else if (e.key === "Escape") {
+        handleCancelEdit();
+      }
+    };
+    const handleEditChange = (e) => {
+      setEditValue(e.target.value);
+      const textarea = e.target;
+      textarea.style.height = "auto";
+      textarea.style.height = `${textarea.scrollHeight}px`;
+    };
+    return /* @__PURE__ */ React42.createElement(
+      "div",
+      {
+        ref,
+        className: cx(
+          "flex flex-col",
+          isUser ? "items-end" : "items-start",
+          className
+        ),
+        ...rest
+      },
+      isUser && isEditing ? /* @__PURE__ */ React42.createElement("div", { className: "w-full max-w-11/12" }, /* @__PURE__ */ React42.createElement("div", { className: "relative bg-gold" }, /* @__PURE__ */ React42.createElement(
+        "textarea",
+        {
+          ref: textareaRef,
+          value: editValue,
+          onChange: handleEditChange,
+          onKeyDown: handleEditKeyDown,
+          className: "w-full bg-transparent text-obsidian px-3 py-2 pr-20 resize-none outline-none min-h-10 text-sm",
+          rows: 1
+        }
+      ), /* @__PURE__ */ React42.createElement("div", { className: "absolute right-1 top-1/2 -translate-y-1/2 flex gap-0.5" }, /* @__PURE__ */ React42.createElement(
+        "button",
+        {
+          type: "button",
+          onClick: handleCancelEdit,
+          className: "p-1.5 text-obsidian/60 hover:text-obsidian transition-colors",
+          "aria-label": "Cancel edit"
+        },
+        /* @__PURE__ */ React42.createElement(XIcon, null)
+      ), /* @__PURE__ */ React42.createElement(
+        "button",
+        {
+          type: "button",
+          onClick: handleSubmitEdit,
+          disabled: !editValue.trim() || editValue.trim() === content,
+          className: "p-1.5 text-obsidian/60 hover:text-obsidian transition-colors disabled:opacity-30",
+          "aria-label": "Submit edit"
+        },
+        /* @__PURE__ */ React42.createElement(SendIcon, null)
+      )))) : /* @__PURE__ */ React42.createElement(
+        "div",
+        {
+          className: cx(
+            "px-3 py-2 w-fit max-w-11/12",
+            variantStyles2[variant]
+          )
+        },
+        /* @__PURE__ */ React42.createElement(
+          MarkdownContent,
+          {
+            content,
+            className: cx("prose-sm", isUser ? "prose-inherit" : "prose-invert"),
+            isStreaming,
+            cursorClassName: "ml-0.5"
+          }
+        )
+      ),
+      showActions && !isEditing && /* @__PURE__ */ React42.createElement("div", { className: cx(
+        "flex items-center gap-0.5 mt-1",
+        isUser ? "mr-1" : "ml-1"
+      ) }, actions.showCopy !== false && /* @__PURE__ */ React42.createElement(ActionButton, { onClick: handleCopy, label: copied ? "Copied!" : "Copy message" }, copied ? /* @__PURE__ */ React42.createElement(CheckIcon, null) : /* @__PURE__ */ React42.createElement(CopyIcon, null)), isUser && actions.onEdit && /* @__PURE__ */ React42.createElement(ActionButton, { onClick: handleStartEdit, label: "Edit message" }, /* @__PURE__ */ React42.createElement(PencilIcon, null)), !isUser && actions.onRetry && /* @__PURE__ */ React42.createElement(ActionButton, { onClick: actions.onRetry, label: "Regenerate response" }, /* @__PURE__ */ React42.createElement(RetryIcon, null)), showBranchNav && /* @__PURE__ */ React42.createElement(React42.Fragment, null, /* @__PURE__ */ React42.createElement("div", { className: "w-px h-4 bg-ash/40 mx-1" }), /* @__PURE__ */ React42.createElement("div", { className: "flex items-center gap-0.5 text-silver/70" }, /* @__PURE__ */ React42.createElement(GitBranchIcon, null), /* @__PURE__ */ React42.createElement(
+        "button",
+        {
+          type: "button",
+          onClick: branchInfo.onPrevious,
+          disabled: branchInfo.current <= 1,
+          className: cx(
+            "p-0.5 hover:text-white hover:bg-white/10 transition-colors",
+            "disabled:opacity-30 disabled:cursor-not-allowed disabled:hover:bg-transparent disabled:hover:text-silver/70"
+          ),
+          "aria-label": "Previous branch"
+        },
+        /* @__PURE__ */ React42.createElement(ChevronLeftIcon, null)
+      ), /* @__PURE__ */ React42.createElement("span", { className: "text-xs tabular-nums min-w-6 text-center" }, branchInfo.current, "/", branchInfo.total), /* @__PURE__ */ React42.createElement(
+        "button",
+        {
+          type: "button",
+          onClick: branchInfo.onNext,
+          disabled: branchInfo.current >= branchInfo.total,
+          className: cx(
+            "p-0.5 hover:text-white hover:bg-white/10 transition-colors",
+            "disabled:opacity-30 disabled:cursor-not-allowed disabled:hover:bg-transparent disabled:hover:text-silver/70"
+          ),
+          "aria-label": "Next branch"
+        },
+        /* @__PURE__ */ React42.createElement(ChevronRightIcon, null)
+      ))))
+    );
+  }
+);
+Message.displayName = "Message";
+
 // src/components/StreamingCursor.tsx
-import React40 from "react";
-var StreamingCursor = React40.forwardRef(
+import React43 from "react";
+var StreamingCursor = React43.forwardRef(
   ({ className, variant = "line", ...rest }, ref) => {
     const variantStyles3 = {
       block: "w-2.5 h-cursor translate-y-cursor-offset",
       line: "w-0.5 h-cursor translate-y-cursor-offset",
       underscore: "w-2.5 h-0.5 self-end mb-0.5"
     };
-    return /* @__PURE__ */ React40.createElement(
+    return /* @__PURE__ */ React43.createElement(
       "span",
       {
         ref,
@@ -3144,131 +3499,852 @@ var StreamingCursor = React40.forwardRef(
 );
 StreamingCursor.displayName = "StreamingCursor";
 
-// src/components/Message.tsx
-var variantStyles2 = {
-  user: "bg-gold text-obsidian ml-auto",
-  assistant: "bg-charcoal border border-ash text-white mr-auto"
-};
-var Message = React41.forwardRef(
-  ({ variant = "assistant", className, content, isStreaming, ...rest }, ref) => {
-    const isUser = variant === "user";
-    return /* @__PURE__ */ React41.createElement(
+// src/components/chat/ChatInterface.tsx
+import React51, { useCallback as useCallback14, useMemo as useMemo3, useState as useState15 } from "react";
+
+// src/components/chat/ChatView.tsx
+import React45, { useEffect as useEffect9 } from "react";
+
+// src/components/chat/hooks/useScrollAnchor.ts
+import { useCallback as useCallback11, useRef as useRef6 } from "react";
+function useScrollAnchor(options = {}) {
+  const { behavior = "smooth", block = "start" } = options;
+  const containerRef = useRef6(null);
+  const anchorRef = useRef6(null);
+  const scrollToAnchor = useCallback11(() => {
+    const el = anchorRef.current;
+    if (!el) return;
+    requestAnimationFrame(() => {
+      requestAnimationFrame(() => {
+        el.scrollIntoView({ behavior, block });
+      });
+    });
+  }, [behavior, block]);
+  const scrollToBottom = useCallback11(() => {
+    const container = containerRef.current;
+    if (!container) return;
+    if (typeof container.scrollTo === "function") {
+      container.scrollTo({ top: container.scrollHeight, behavior });
+    } else {
+      container.scrollTop = container.scrollHeight;
+    }
+  }, [behavior]);
+  const isScrolledToBottom = useCallback11(() => {
+    const container = containerRef.current;
+    if (!container) return true;
+    const threshold = 50;
+    const { scrollTop, scrollHeight, clientHeight } = container;
+    return scrollHeight - scrollTop - clientHeight < threshold;
+  }, []);
+  return {
+    containerRef,
+    anchorRef,
+    scrollToAnchor,
+    scrollToBottom,
+    isScrolledToBottom
+  };
+}
+
+// src/components/chat/hooks/useAdaptiveSpacer.ts
+import { useCallback as useCallback12, useEffect as useEffect7, useRef as useRef7, useState as useState11 } from "react";
+function useAdaptiveSpacer(options = {}) {
+  const { minHeight = 0, containerRef: externalContainerRef, anchorRef } = options;
+  const internalContainerRef = useRef7(null);
+  const containerRef = externalContainerRef ?? internalContainerRef;
+  const contentRef = useRef7(null);
+  const spacerRef = useRef7(null);
+  const [spacerHeight, setSpacerHeight] = useState11(0);
+  const recalculate = useCallback12(() => {
+    const container = containerRef.current;
+    const content = contentRef.current;
+    if (!container || !content) return;
+    const style = getComputedStyle(container);
+    const paddingTop = parseFloat(style.paddingTop) || 0;
+    const paddingBottom = parseFloat(style.paddingBottom) || 0;
+    const availableHeight = container.clientHeight - paddingTop - paddingBottom;
+    let heightFromAnchorToBottom;
+    const anchor = anchorRef?.current;
+    if (anchor && content.contains(anchor)) {
+      const anchorTop = anchor.offsetTop;
+      heightFromAnchorToBottom = content.scrollHeight - anchorTop;
+    } else {
+      heightFromAnchorToBottom = content.scrollHeight;
+    }
+    const newSpacerHeight = Math.max(minHeight, availableHeight - heightFromAnchorToBottom);
+    if (spacerRef.current) {
+      spacerRef.current.style.height = `${newSpacerHeight}px`;
+    }
+    setSpacerHeight(newSpacerHeight);
+  }, [minHeight, anchorRef]);
+  useEffect7(() => {
+    const container = containerRef.current;
+    const content = contentRef.current;
+    if (!container || !content) return;
+    recalculate();
+    const resizeObserver = new ResizeObserver(() => {
+      recalculate();
+    });
+    resizeObserver.observe(container);
+    resizeObserver.observe(content);
+    const mutationObserver = new MutationObserver(() => {
+      requestAnimationFrame(recalculate);
+    });
+    mutationObserver.observe(content, {
+      childList: true,
+      subtree: true,
+      characterData: true
+    });
+    return () => {
+      resizeObserver.disconnect();
+      mutationObserver.disconnect();
+    };
+  }, [recalculate]);
+  return {
+    containerRef,
+    contentRef,
+    spacerRef,
+    spacerHeight,
+    recalculate
+  };
+}
+
+// src/components/chat/ThinkingIndicator.tsx
+import React44, { useState as useState12, useEffect as useEffect8 } from "react";
+var THINKING_PHRASES = [
+  "Consulting the ancient tomes...",
+  "Parsing the ineffable...",
+  "Traversing the manifold of possibilities...",
+  "Genuflecting before the oracle...",
+  "Distilling quintessence...",
+  "Communing with the machine spirits...",
+  "Unfolding higher dimensions...",
+  "Perturbing the probability matrix...",
+  "Invoking the categorical imperative...",
+  "Reticulating splines...",
+  "Brewing a fresh batch of tokens...",
+  "Consulting my inner monologue...",
+  "Summoning the muse..."
+];
+var ThinkingIndicator = React44.forwardRef(
+  ({
+    isVisible = true,
+    phraseInterval = 2500,
+    phrases = THINKING_PHRASES,
+    className,
+    ...rest
+  }, ref) => {
+    const [currentIndex, setCurrentIndex] = useState12(() => Math.floor(Math.random() * phrases.length));
+    const [isTransitioning, setIsTransitioning] = useState12(false);
+    useEffect8(() => {
+      if (!isVisible || phrases.length <= 1) return;
+      const interval = setInterval(() => {
+        setIsTransitioning(true);
+        setTimeout(() => {
+          setCurrentIndex((prev) => (prev + 1) % phrases.length);
+          setIsTransitioning(false);
+        }, 200);
+      }, phraseInterval);
+      return () => clearInterval(interval);
+    }, [isVisible, phrases.length, phraseInterval]);
+    if (!isVisible) return null;
+    return /* @__PURE__ */ React44.createElement(
       "div",
       {
         ref,
         className: cx(
-          "px-3 py-2 w-fit",
-          variantStyles2[variant],
+          "flex items-center gap-2 px-3 py-2 w-fit",
+          "bg-charcoal border border-ash text-silver",
+          "mr-auto",
           className
         ),
+        role: "status",
+        "aria-live": "polite",
         ...rest
       },
-      /* @__PURE__ */ React41.createElement(
-        MarkdownContent,
+      /* @__PURE__ */ React44.createElement("div", { className: "flex gap-1", "aria-hidden": "true" }, /* @__PURE__ */ React44.createElement("span", { className: "w-1.5 h-1.5 bg-gold/60 rounded-full animate-pulse", style: { animationDelay: "0ms" } }), /* @__PURE__ */ React44.createElement("span", { className: "w-1.5 h-1.5 bg-gold/60 rounded-full animate-pulse", style: { animationDelay: "150ms" } }), /* @__PURE__ */ React44.createElement("span", { className: "w-1.5 h-1.5 bg-gold/60 rounded-full animate-pulse", style: { animationDelay: "300ms" } })),
+      /* @__PURE__ */ React44.createElement(
+        "span",
         {
-          content,
-          className: cx("prose-sm", isUser ? "prose-inherit" : "prose-invert")
-        }
-      ),
-      isStreaming && /* @__PURE__ */ React41.createElement(StreamingCursor, { className: "ml-0.5" })
+          className: cx(
+            "text-sm italic transition-opacity duration-200",
+            isTransitioning ? "opacity-0" : "opacity-100"
+          )
+        },
+        phrases[currentIndex]
+      )
     );
   }
 );
-Message.displayName = "Message";
+ThinkingIndicator.displayName = "ThinkingIndicator";
 
-// src/components/ChatHistory.tsx
-import React42, { useEffect as useEffect6, useRef as useRef5 } from "react";
-var ChatHistory = ({ messages, className, ...rest }) => {
-  const innerRef = useRef5(null);
-  useEffect6(() => {
-    const el = innerRef.current;
-    if (!el) {
-      return;
-    }
-    if (typeof el.scrollTo === "function") {
-      el.scrollTo({ top: el.scrollHeight, behavior: "smooth" });
-    } else {
-      el.scrollTop = el.scrollHeight;
-    }
-  }, [messages]);
-  return /* @__PURE__ */ React42.createElement(
-    "div",
-    {
-      ref: innerRef,
-      className: cx(
-        "flex flex-col gap-3 justify-end w-full h-96 bg-charcoal/50 border border-ash/40 p-4 overflow-y-auto",
-        className
-      ),
-      ...rest
-    },
-    messages.map(({ id, variant, className: messageClassName, ...messageProps }, index) => /* @__PURE__ */ React42.createElement(
-      Message,
+// src/components/chat/ChatView.tsx
+var ChatView = React45.forwardRef(
+  ({ messages, latestUserMessageIndex, isStreaming, isThinking, onScroll, className, ...rest }, ref) => {
+    const { containerRef, anchorRef, scrollToAnchor } = useScrollAnchor({
+      behavior: "smooth",
+      block: "start"
+    });
+    const { contentRef, spacerRef, spacerHeight } = useAdaptiveSpacer({
+      containerRef,
+      anchorRef
+    });
+    useEffect9(() => {
+      if (latestUserMessageIndex !== void 0 && latestUserMessageIndex >= 0) {
+        scrollToAnchor();
+      }
+    }, [latestUserMessageIndex, scrollToAnchor]);
+    const latestUserIdx = latestUserMessageIndex ?? messages.reduceRight((found, msg, idx) => {
+      if (found === -1 && msg.variant === "user") {
+        return idx;
+      }
+      return found;
+    }, -1);
+    const showThinking = isThinking && messages.length > 0 && messages[messages.length - 1]?.variant === "user";
+    return /* @__PURE__ */ React45.createElement(
+      "div",
       {
-        key: id ?? index,
+        ref: (node) => {
+          ;
+          containerRef.current = node;
+          if (typeof ref === "function") {
+            ref(node);
+          } else if (ref) {
+            ref.current = node;
+          }
+        },
+        onScroll,
+        className: cx(
+          "flex flex-col w-full h-full overflow-y-auto scroll-smooth",
+          "px-4 py-6 overscroll-contain",
+          className
+        ),
+        ...rest
+      },
+      /* @__PURE__ */ React45.createElement("div", { ref: contentRef, className: "relative flex flex-col gap-3" }, messages.map(({
+        id,
         variant,
         className: messageClassName,
+        branchInfo,
+        actions,
+        isStreaming: nodeIsStreaming,
         ...messageProps
-      }
-    ))
-  );
-};
-ChatHistory.displayName = "ChatHistory";
+      }, index) => {
+        const isAnchor = index === latestUserIdx;
+        const isLastMessage = index === messages.length - 1;
+        const showStreaming = isLastMessage && isStreaming && variant === "assistant";
+        const isMessageStreaming = showStreaming || !!nodeIsStreaming;
+        return /* @__PURE__ */ React45.createElement(
+          "div",
+          {
+            key: id ?? `msg-${index}`,
+            ref: isAnchor ? anchorRef : void 0,
+            className: isAnchor ? "scroll-mt-4" : void 0
+          },
+          /* @__PURE__ */ React45.createElement(
+            Message,
+            {
+              variant,
+              isStreaming: isMessageStreaming,
+              className: messageClassName,
+              branchInfo,
+              actions,
+              hideActions: isMessageStreaming,
+              ...messageProps
+            }
+          )
+        );
+      }), showThinking && /* @__PURE__ */ React45.createElement(ThinkingIndicator, { isVisible: true })),
+      /* @__PURE__ */ React45.createElement(
+        "div",
+        {
+          ref: spacerRef,
+          className: "shrink-0 pointer-events-none",
+          style: { height: spacerHeight },
+          "aria-hidden": "true"
+        }
+      )
+    );
+  }
+);
+ChatView.displayName = "ChatView";
 
-// src/components/BrandIcon.tsx
-import React43 from "react";
-var sizeMap2 = {
-  sm: "h-8 w-8 text-sm",
-  md: "h-12 w-12 text-base",
-  lg: "h-16 w-16 text-lg"
-};
-var BrandIcon = React43.forwardRef(
-  ({ size = "md", variant = "solid", children, className, ...rest }, ref) => {
-    const variantClasses = variant === "solid" ? "bg-gold text-obsidian border-2 border-gold" : "bg-transparent text-gold border-2 border-gold";
-    return /* @__PURE__ */ React43.createElement(
+// src/components/chat/ChatInput.tsx
+import React46, { useCallback as useCallback13, useEffect as useEffect10, useRef as useRef8, useState as useState13 } from "react";
+import { Paperclip, Send, Square } from "lucide-react";
+
+// src/components/chat/types.ts
+function isImageFile(file) {
+  return file.type.startsWith("image/");
+}
+function createPreviewUrl(file) {
+  if (isImageFile(file)) {
+    return URL.createObjectURL(file);
+  }
+  return void 0;
+}
+function revokePreviewUrl(url) {
+  if (url) {
+    URL.revokeObjectURL(url);
+  }
+}
+function generateId() {
+  return `${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
+}
+function createEmptyTree() {
+  return {
+    nodes: {},
+    rootIds: [],
+    activeLeafId: null
+  };
+}
+function addMessageToTree(tree, message, parentId = null) {
+  const newNodes = { ...tree.nodes };
+  const newRootIds = [...tree.rootIds];
+  let branchIndex = 0;
+  if (parentId && newNodes[parentId]) {
+    branchIndex = newNodes[parentId].children.length;
+  } else if (!parentId) {
+    branchIndex = newRootIds.length;
+  }
+  const newNode = {
+    ...message,
+    parentId,
+    children: [],
+    branchIndex,
+    createdAt: message.createdAt ?? Date.now()
+  };
+  newNodes[message.id] = newNode;
+  if (parentId && newNodes[parentId]) {
+    newNodes[parentId] = {
+      ...newNodes[parentId],
+      children: [...newNodes[parentId].children, message.id]
+    };
+  } else {
+    newRootIds.push(message.id);
+  }
+  return {
+    nodes: newNodes,
+    rootIds: newRootIds,
+    activeLeafId: message.id
+  };
+}
+function getActivePathMessages(tree) {
+  if (!tree.activeLeafId) return [];
+  const path = [];
+  let currentId = tree.activeLeafId;
+  while (currentId) {
+    const node = tree.nodes[currentId];
+    if (!node) break;
+    path.unshift(node);
+    currentId = node.parentId;
+  }
+  return path;
+}
+function getSiblingInfo(tree, nodeId) {
+  const node = tree.nodes[nodeId];
+  if (!node) return { total: 1, current: 1 };
+  if (node.parentId) {
+    const parent = tree.nodes[node.parentId];
+    if (parent) {
+      const index = parent.children.indexOf(nodeId);
+      return {
+        total: parent.children.length,
+        current: index + 1
+      };
+    }
+  } else {
+    const index = tree.rootIds.indexOf(nodeId);
+    return {
+      total: tree.rootIds.length,
+      current: index + 1
+    };
+  }
+  return { total: 1, current: 1 };
+}
+function switchBranch(tree, nodeId, direction) {
+  const node = tree.nodes[nodeId];
+  if (!node) return tree;
+  let siblings;
+  let currentIndex;
+  if (node.parentId) {
+    const parent = tree.nodes[node.parentId];
+    if (!parent) return tree;
+    siblings = parent.children;
+    currentIndex = siblings.indexOf(nodeId);
+  } else {
+    siblings = tree.rootIds;
+    currentIndex = siblings.indexOf(nodeId);
+  }
+  if (siblings.length <= 1) return tree;
+  const newIndex = direction === "next" ? (currentIndex + 1) % siblings.length : (currentIndex - 1 + siblings.length) % siblings.length;
+  const newNodeId = siblings[newIndex];
+  let leafId = newNodeId;
+  let currentNode = tree.nodes[leafId];
+  while (currentNode && currentNode.children.length > 0) {
+    leafId = currentNode.children[0];
+    currentNode = tree.nodes[leafId];
+  }
+  return {
+    ...tree,
+    activeLeafId: leafId
+  };
+}
+function updateNodeContent(tree, nodeId, content, isStreaming) {
+  const node = tree.nodes[nodeId];
+  if (!node) return tree;
+  return {
+    ...tree,
+    nodes: {
+      ...tree.nodes,
+      [nodeId]: {
+        ...node,
+        content,
+        isStreaming: isStreaming ?? node.isStreaming
+      }
+    }
+  };
+}
+function messagesToTree(messages) {
+  let tree = createEmptyTree();
+  for (const msg of messages) {
+    const parentId = tree.activeLeafId;
+    tree = addMessageToTree(tree, {
+      id: msg.id,
+      role: msg.role,
+      content: msg.content,
+      parentId,
+      isStreaming: msg.isStreaming
+    }, parentId);
+  }
+  return tree;
+}
+function isBranchPoint(tree, nodeId) {
+  const node = tree.nodes[nodeId];
+  return node ? node.children.length > 1 : false;
+}
+
+// src/components/chat/ChatInput.tsx
+var ChatInput = React46.forwardRef(
+  ({
+    position = "bottom",
+    placeholder = "Send a message...",
+    helperText,
+    onSubmit,
+    disabled = false,
+    animate = true,
+    isStreaming = false,
+    onStop,
+    attachments: controlledAttachments,
+    onAttachmentsChange,
+    showAttachmentButton = true,
+    acceptedFileTypes,
+    className,
+    ...rest
+  }, ref) => {
+    const [value, setValue] = useState13("");
+    const [localAttachments, setLocalAttachments] = useState13([]);
+    const [isDragOver, setIsDragOver] = useState13(false);
+    const textareaRef = useRef8(null);
+    const fileInputRef = useRef8(null);
+    const attachments = controlledAttachments ?? localAttachments;
+    const setAttachments = useCallback13(
+      (newAttachments) => {
+        if (onAttachmentsChange) {
+          if (typeof newAttachments === "function") {
+            onAttachmentsChange(newAttachments(attachments));
+          } else {
+            onAttachmentsChange(newAttachments);
+          }
+        } else {
+          setLocalAttachments(newAttachments);
+        }
+      },
+      [attachments, onAttachmentsChange]
+    );
+    const handleSubmit = useCallback13(() => {
+      const trimmed = value.trim();
+      if (!trimmed || disabled || isStreaming) {
+        return;
+      }
+      onSubmit?.(trimmed, attachments.length > 0 ? attachments : void 0);
+      setValue("");
+      setAttachments([]);
+      if (textareaRef.current) {
+        textareaRef.current.style.height = "auto";
+      }
+    }, [value, disabled, isStreaming, onSubmit, attachments, setAttachments]);
+    const handleKeyDown = useCallback13(
+      (e) => {
+        if (e.key === "Enter" && !e.shiftKey) {
+          e.preventDefault();
+          handleSubmit();
+        }
+      },
+      [handleSubmit]
+    );
+    const handleChange = useCallback13((e) => {
+      setValue(e.target.value);
+      const textarea = e.target;
+      textarea.style.height = "auto";
+      textarea.style.height = `${Math.min(textarea.scrollHeight, 200)}px`;
+    }, []);
+    useEffect10(() => {
+      if (!disabled && !isStreaming && textareaRef.current) {
+        textareaRef.current.focus();
+      }
+    }, [disabled, isStreaming]);
+    const addFiles = useCallback13(
+      (files) => {
+        const newAttachments = Array.from(files).map((file) => ({
+          id: generateId(),
+          file,
+          previewUrl: isImageFile(file) ? createPreviewUrl(file) : void 0,
+          status: "pending"
+        }));
+        setAttachments((prev) => [...prev, ...newAttachments]);
+      },
+      [setAttachments]
+    );
+    const handleFileSelect = useCallback13(
+      (e) => {
+        const files = e.target.files;
+        if (files && files.length > 0) {
+          addFiles(files);
+        }
+        e.target.value = "";
+      },
+      [addFiles]
+    );
+    const handleRemoveAttachment = useCallback13(
+      (id) => {
+        setAttachments((prev) => {
+          const attachment = prev.find((a) => a.id === id);
+          if (attachment?.previewUrl) {
+            URL.revokeObjectURL(attachment.previewUrl);
+          }
+          return prev.filter((a) => a.id !== id);
+        });
+      },
+      [setAttachments]
+    );
+    const handleDragEnter = useCallback13((e) => {
+      e.preventDefault();
+      e.stopPropagation();
+      setIsDragOver(true);
+    }, []);
+    const handleDragLeave = useCallback13((e) => {
+      e.preventDefault();
+      e.stopPropagation();
+      if (!e.currentTarget.contains(e.relatedTarget)) {
+        setIsDragOver(false);
+      }
+    }, []);
+    const handleDragOver = useCallback13((e) => {
+      e.preventDefault();
+      e.stopPropagation();
+    }, []);
+    const handleDrop = useCallback13(
+      (e) => {
+        e.preventDefault();
+        e.stopPropagation();
+        setIsDragOver(false);
+        const files = e.dataTransfer.files;
+        if (files && files.length > 0) {
+          addFiles(files);
+        }
+      },
+      [addFiles]
+    );
+    const isCentered = position === "centered";
+    const hasAttachments = attachments.length > 0;
+    const canSubmit = value.trim() && !disabled && !isStreaming;
+    return /* @__PURE__ */ React46.createElement(
       "div",
       {
         ref,
         className: cx(
-          "inline-flex items-center justify-center rounded-none font-bold select-none overflow-hidden",
-          sizeMap2[size],
-          variantClasses,
+          "w-full",
+          isCentered && "flex flex-col items-center justify-center",
+          animate && "transition-all duration-300 ease-out",
           className
         ),
         ...rest
       },
-      children
+      isCentered && helperText && /* @__PURE__ */ React46.createElement("p", { className: "text-silver text-sm mb-4 text-center" }, helperText),
+      /* @__PURE__ */ React46.createElement(
+        "div",
+        {
+          className: cx(
+            "relative w-full bg-charcoal border",
+            isDragOver ? "border-gold ring-1 ring-gold/30" : "border-ash/60",
+            "focus-within:border-gold/60 focus-within:ring-1 focus-within:ring-gold/20",
+            "transition-colors duration-200",
+            isCentered && "max-w-lg"
+          ),
+          onDragEnter: showAttachmentButton ? handleDragEnter : void 0,
+          onDragLeave: showAttachmentButton ? handleDragLeave : void 0,
+          onDragOver: showAttachmentButton ? handleDragOver : void 0,
+          onDrop: showAttachmentButton ? handleDrop : void 0
+        },
+        hasAttachments && /* @__PURE__ */ React46.createElement("div", { className: "px-3 pt-3 pb-1" }, /* @__PURE__ */ React46.createElement(
+          AttachmentPreview,
+          {
+            attachments,
+            onRemove: handleRemoveAttachment,
+            removable: !isStreaming
+          }
+        )),
+        isDragOver && /* @__PURE__ */ React46.createElement(
+          "div",
+          {
+            className: "absolute inset-0 bg-gold/10 flex items-center justify-center z-10 pointer-events-none"
+          },
+          /* @__PURE__ */ React46.createElement("span", { className: "text-gold text-sm font-medium" }, "Drop files here")
+        ),
+        /* @__PURE__ */ React46.createElement("div", { className: "flex items-end" }, showAttachmentButton && /* @__PURE__ */ React46.createElement(React46.Fragment, null, /* @__PURE__ */ React46.createElement(
+          "button",
+          {
+            type: "button",
+            onClick: () => fileInputRef.current?.click(),
+            disabled: disabled || isStreaming,
+            className: cx(
+              "p-3 text-silver/60 hover:text-silver transition-colors",
+              "disabled:opacity-50 disabled:cursor-not-allowed"
+            ),
+            "aria-label": "Attach file"
+          },
+          /* @__PURE__ */ React46.createElement(Paperclip, { className: "w-5 h-5" })
+        ), /* @__PURE__ */ React46.createElement(
+          "input",
+          {
+            ref: fileInputRef,
+            type: "file",
+            multiple: true,
+            accept: acceptedFileTypes,
+            onChange: handleFileSelect,
+            className: "hidden",
+            "aria-hidden": "true"
+          }
+        )), /* @__PURE__ */ React46.createElement(
+          "textarea",
+          {
+            ref: textareaRef,
+            value,
+            onChange: handleChange,
+            onKeyDown: handleKeyDown,
+            placeholder,
+            disabled: disabled || isStreaming,
+            rows: 1,
+            className: cx(
+              "flex-1 bg-transparent text-white placeholder:text-silver/60",
+              "py-3 pr-12 resize-none outline-none min-h-12",
+              !showAttachmentButton && "pl-4",
+              (disabled || isStreaming) && "opacity-50 cursor-not-allowed"
+            ),
+            style: { maxHeight: 200 }
+          }
+        ), isStreaming ? /* @__PURE__ */ React46.createElement(
+          "button",
+          {
+            type: "button",
+            onClick: onStop,
+            className: cx(
+              "absolute right-2 bottom-2 p-2",
+              "text-error hover:bg-error/10 transition-colors duration-200"
+            ),
+            "aria-label": "Stop generation"
+          },
+          /* @__PURE__ */ React46.createElement(Square, { className: "w-5 h-5 fill-current" })
+        ) : /* @__PURE__ */ React46.createElement(
+          "button",
+          {
+            type: "button",
+            onClick: handleSubmit,
+            disabled: !canSubmit,
+            className: cx(
+              "absolute right-2 bottom-2 p-2",
+              "transition-colors duration-200",
+              canSubmit ? "text-gold hover:bg-gold/10" : "text-silver/40 cursor-not-allowed"
+            ),
+            "aria-label": "Send message"
+          },
+          /* @__PURE__ */ React46.createElement(Send, { className: "w-5 h-5" })
+        ))
+      )
     );
   }
 );
-BrandIcon.displayName = "BrandIcon";
+ChatInput.displayName = "ChatInput";
 
-// src/components/ColorSwatch.tsx
-import React44 from "react";
-var ColorSwatch = React44.forwardRef(
-  ({ color, label, className, ...rest }, ref) => {
-    return /* @__PURE__ */ React44.createElement(
+// src/components/chat/ConversationSidebar.tsx
+import React47 from "react";
+function HistoryIcon({ className }) {
+  return /* @__PURE__ */ React47.createElement(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 20 20",
+      fill: "currentColor",
+      className
+    },
+    /* @__PURE__ */ React47.createElement(
+      "path",
+      {
+        fillRule: "evenodd",
+        d: "M10 18a8 8 0 100-16 8 8 0 000 16zm.75-13a.75.75 0 00-1.5 0v5c0 .414.336.75.75.75h4a.75.75 0 000-1.5h-3.25V5z",
+        clipRule: "evenodd"
+      }
+    )
+  );
+}
+function ChevronLeftIcon2({ className }) {
+  return /* @__PURE__ */ React47.createElement(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 20 20",
+      fill: "currentColor",
+      className
+    },
+    /* @__PURE__ */ React47.createElement(
+      "path",
+      {
+        fillRule: "evenodd",
+        d: "M12.79 5.23a.75.75 0 01-.02 1.06L8.832 10l3.938 3.71a.75.75 0 11-1.04 1.08l-4.5-4.25a.75.75 0 010-1.08l4.5-4.25a.75.75 0 011.06.02z",
+        clipRule: "evenodd"
+      }
+    )
+  );
+}
+var ConversationSidebar = React47.forwardRef(
+  ({
+    conversations,
+    isCollapsed = false,
+    onSelectConversation,
+    onNewChat,
+    onToggleCollapse,
+    className,
+    ...rest
+  }, ref) => {
+    if (isCollapsed) {
+      return /* @__PURE__ */ React47.createElement(
+        "div",
+        {
+          ref,
+          className: cx(
+            "h-full bg-charcoal/80 border-r border-ash/40 flex flex-col items-center py-3",
+            "w-12 flex-shrink-0",
+            className
+          ),
+          ...rest
+        },
+        /* @__PURE__ */ React47.createElement(
+          "button",
+          {
+            onClick: onToggleCollapse,
+            className: cx(
+              "p-2",
+              "text-silver hover:text-white hover:bg-ash/20",
+              "transition-colors duration-150"
+            ),
+            "aria-label": "Expand sidebar"
+          },
+          /* @__PURE__ */ React47.createElement(HistoryIcon, { className: "w-5 h-5" })
+        )
+      );
+    }
+    return /* @__PURE__ */ React47.createElement(
       "div",
       {
         ref,
-        className: cx("flex flex-col items-center gap-2", className),
+        className: cx(
+          "h-full bg-charcoal/80 border-r border-ash/40 flex flex-col",
+          "w-64 flex-shrink-0",
+          className
+        ),
         ...rest
       },
-      /* @__PURE__ */ React44.createElement(
-        "div",
+      /* @__PURE__ */ React47.createElement("div", { className: "p-3 border-b border-ash/40 flex-shrink-0 flex items-center gap-2" }, /* @__PURE__ */ React47.createElement(
+        "button",
         {
-          className: "h-16 w-16 border-2 border-ash rounded-none shadow-sm",
-          style: { backgroundColor: color },
-          "aria-label": label || color
-        }
-      ),
-      label && /* @__PURE__ */ React44.createElement("span", { className: "text-xs text-silver font-medium" }, label)
+          onClick: onToggleCollapse,
+          className: cx(
+            "p-1.5",
+            "text-silver hover:text-white hover:bg-ash/20",
+            "transition-colors duration-150"
+          ),
+          "aria-label": "Collapse sidebar"
+        },
+        /* @__PURE__ */ React47.createElement(ChevronLeftIcon2, { className: "w-5 h-5" })
+      ), /* @__PURE__ */ React47.createElement(
+        "button",
+        {
+          onClick: onNewChat,
+          className: cx(
+            "flex-1 px-3 py-2",
+            "bg-gold/10 hover:bg-gold/20 text-gold",
+            "border border-gold/30",
+            "flex items-center justify-center gap-2",
+            "transition-colors duration-200"
+          )
+        },
+        /* @__PURE__ */ React47.createElement(
+          "svg",
+          {
+            xmlns: "http://www.w3.org/2000/svg",
+            viewBox: "0 0 20 20",
+            fill: "currentColor",
+            className: "w-4 h-4"
+          },
+          /* @__PURE__ */ React47.createElement("path", { d: "M10.75 4.75a.75.75 0 00-1.5 0v4.5h-4.5a.75.75 0 000 1.5h4.5v4.5a.75.75 0 001.5 0v-4.5h4.5a.75.75 0 000-1.5h-4.5v-4.5z" })
+        ),
+        /* @__PURE__ */ React47.createElement("span", { className: "text-sm font-medium" }, "New Chat")
+      )),
+      /* @__PURE__ */ React47.createElement("div", { className: "flex-1 overflow-y-auto py-2" }, conversations.length === 0 ? /* @__PURE__ */ React47.createElement("p", { className: "px-4 py-2 text-sm text-silver/60" }, "No conversations yet") : /* @__PURE__ */ React47.createElement("div", { className: "space-y-1 px-2" }, conversations.map((conversation) => /* @__PURE__ */ React47.createElement(
+        "button",
+        {
+          key: conversation.id,
+          onClick: () => onSelectConversation?.(conversation.id),
+          className: cx(
+            "w-full px-3 py-2 text-left",
+            "transition-colors duration-150",
+            conversation.isActive ? "bg-ash/40 text-white" : "text-silver hover:bg-ash/20 hover:text-white"
+          )
+        },
+        /* @__PURE__ */ React47.createElement("p", { className: "text-sm font-medium truncate" }, conversation.title),
+        conversation.preview && /* @__PURE__ */ React47.createElement("p", { className: "text-xs text-silver/60 truncate mt-0.5" }, conversation.preview),
+        conversation.timestamp && /* @__PURE__ */ React47.createElement("p", { className: "text-xs text-silver/40 mt-1" }, conversation.timestamp)
+      ))))
     );
   }
 );
-ColorSwatch.displayName = "ColorSwatch";
+ConversationSidebar.displayName = "ConversationSidebar";
+var CollapsedSidebarToggle = React47.forwardRef(({ onExpand, className, ...rest }, ref) => {
+  return /* @__PURE__ */ React47.createElement(
+    "button",
+    {
+      ref,
+      onClick: onExpand,
+      className: cx(
+        "p-2",
+        "bg-charcoal/80 border border-ash/40",
+        "text-silver hover:text-white hover:bg-ash/20",
+        "transition-colors duration-150",
+        className
+      ),
+      "aria-label": "Expand sidebar",
+      ...rest
+    },
+    /* @__PURE__ */ React47.createElement(HistoryIcon, { className: "w-5 h-5" })
+  );
+});
+CollapsedSidebarToggle.displayName = "CollapsedSidebarToggle";
+
+// src/components/chat/ArtifactsPanel.tsx
+import React50, { useState as useState14, useEffect as useEffect11 } from "react";
 
 // src/components/ImageCard.tsx
-import React45 from "react";
+import React48 from "react";
 var ASPECT_RATIO_PRESETS = {
   landscape: "3 / 2",
   portrait: "2 / 3",
@@ -3280,7 +4356,7 @@ function resolveAspectRatio(ratio) {
   }
   return ratio.replace("/", " / ");
 }
-var ImageCard = React45.forwardRef(
+var ImageCard = React48.forwardRef(
   ({
     src,
     alt,
@@ -3297,7 +4373,7 @@ var ImageCard = React45.forwardRef(
   }, ref) => {
     const hasAspectRatio = aspectRatio !== void 0;
     const isContain = objectFit === "contain";
-    return /* @__PURE__ */ React45.createElement(Card, { ref, className: cx("p-0 overflow-hidden group w-fit", className), ...props }, /* @__PURE__ */ React45.createElement(
+    return /* @__PURE__ */ React48.createElement(Card, { ref, className: cx("p-0 overflow-hidden group w-fit", className), ...props }, /* @__PURE__ */ React48.createElement(
       "div",
       {
         className: cx(
@@ -3307,7 +4383,7 @@ var ImageCard = React45.forwardRef(
         ),
         style: hasAspectRatio ? { aspectRatio: resolveAspectRatio(aspectRatio) } : void 0
       },
-      /* @__PURE__ */ React45.createElement(
+      /* @__PURE__ */ React48.createElement(
         "img",
         {
           src,
@@ -3320,20 +4396,20 @@ var ImageCard = React45.forwardRef(
           )
         }
       ),
-      overlay && /* @__PURE__ */ React45.createElement(
+      overlay && /* @__PURE__ */ React48.createElement(
         "div",
         {
           className: "absolute inset-0 bg-obsidian/80 opacity-0 group-hover:opacity-100 transition-opacity duration-200 flex items-center justify-center"
         },
         overlay
       )
-    ), (title || subtitle || children) && /* @__PURE__ */ React45.createElement("div", { className: cx("px-4 py-4", contentClassName) }, title && /* @__PURE__ */ React45.createElement("h4", { className: "text-lg font-semibold leading-tight" }, title), subtitle && /* @__PURE__ */ React45.createElement("p", { className: "text-sm text-silver leading-normal" }, subtitle), children));
+    ), (title || subtitle || children) && /* @__PURE__ */ React48.createElement("div", { className: cx("px-4 py-4", contentClassName) }, title && /* @__PURE__ */ React48.createElement("h4", { className: "text-lg font-semibold leading-tight" }, title), subtitle && /* @__PURE__ */ React48.createElement("p", { className: "text-sm text-silver leading-normal" }, subtitle), children));
   }
 );
 ImageCard.displayName = "ImageCard";
 
 // src/components/VideoCard.tsx
-import React46 from "react";
+import React49 from "react";
 import ReactPlayer2 from "react-player";
 var ASPECT_RATIO_PRESETS2 = {
   video: "16 / 9",
@@ -3346,7 +4422,7 @@ function resolveAspectRatio2(ratio) {
   }
   return ratio.replace("/", " / ");
 }
-var VideoCard = React46.forwardRef(
+var VideoCard = React49.forwardRef(
   ({
     src,
     title,
@@ -3366,16 +4442,16 @@ var VideoCard = React46.forwardRef(
     ...props
   }, ref) => {
     const hasAspectRatio = aspectRatio !== void 0;
-    return /* @__PURE__ */ React46.createElement(Card, { ref, className: cx("p-0 overflow-hidden group w-full", className), ...props }, /* @__PURE__ */ React46.createElement(
+    return /* @__PURE__ */ React49.createElement(Card, { ref, className: cx("p-0 overflow-hidden group w-full", className), ...props }, /* @__PURE__ */ React49.createElement(
       "div",
       {
         className: cx(
-          "relative bg-black overflow-hidden",
+          "relative bg-obsidian overflow-hidden",
           mediaClassName
         ),
         style: { aspectRatio: resolveAspectRatio2(aspectRatio) }
       },
-      /* @__PURE__ */ React46.createElement(
+      /* @__PURE__ */ React49.createElement(
         ReactPlayer2,
         {
           src,
@@ -3391,7 +4467,7 @@ var VideoCard = React46.forwardRef(
           ...playerProps
         }
       )
-    ), (title || subtitle || children) && /* @__PURE__ */ React46.createElement("div", { className: cx("px-4 py-4", contentClassName) }, title && /* @__PURE__ */ React46.createElement("h4", { className: "text-lg font-semibold leading-tight" }, title), subtitle && /* @__PURE__ */ React46.createElement(
+    ), (title || subtitle || children) && /* @__PURE__ */ React49.createElement("div", { className: cx("px-4 py-4", contentClassName) }, title && /* @__PURE__ */ React49.createElement("h4", { className: "text-lg font-semibold leading-tight" }, title), subtitle && /* @__PURE__ */ React49.createElement(
       "p",
       {
         className: "text-sm text-silver leading-normal mt-1"
@@ -3402,16 +4478,778 @@ var VideoCard = React46.forwardRef(
 );
 VideoCard.displayName = "VideoCard";
 
+// src/components/chat/ArtifactsPanel.tsx
+function LayersIcon({ className }) {
+  return /* @__PURE__ */ React50.createElement(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 20 20",
+      fill: "currentColor",
+      className
+    },
+    /* @__PURE__ */ React50.createElement("path", { d: "M3.196 12.87l-.825.483a.75.75 0 000 1.294l7.25 4.25a.75.75 0 00.758 0l7.25-4.25a.75.75 0 000-1.294l-.825-.484-5.666 3.322a2.25 2.25 0 01-2.276 0L3.196 12.87z" }),
+    /* @__PURE__ */ React50.createElement("path", { d: "M3.196 8.87l-.825.483a.75.75 0 000 1.294l7.25 4.25a.75.75 0 00.758 0l7.25-4.25a.75.75 0 000-1.294l-.825-.484-5.666 3.322a2.25 2.25 0 01-2.276 0L3.196 8.87z" }),
+    /* @__PURE__ */ React50.createElement("path", { d: "M10.38 1.103a.75.75 0 00-.76 0l-7.25 4.25a.75.75 0 000 1.294l7.25 4.25a.75.75 0 00.76 0l7.25-4.25a.75.75 0 000-1.294l-7.25-4.25z" })
+  );
+}
+function ChevronRightIcon2({ className }) {
+  return /* @__PURE__ */ React50.createElement(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 20 20",
+      fill: "currentColor",
+      className
+    },
+    /* @__PURE__ */ React50.createElement(
+      "path",
+      {
+        fillRule: "evenodd",
+        d: "M7.21 14.77a.75.75 0 01.02-1.06L11.168 10 7.23 6.29a.75.75 0 111.04-1.08l4.5 4.25a.75.75 0 010 1.08l-4.5 4.25a.75.75 0 01-1.06-.02z",
+        clipRule: "evenodd"
+      }
+    )
+  );
+}
+function ArtifactSkeleton({ type }) {
+  if (type === "image") {
+    return /* @__PURE__ */ React50.createElement("div", { className: "overflow-hidden" }, /* @__PURE__ */ React50.createElement(Skeleton, { className: "w-full h-48" }), /* @__PURE__ */ React50.createElement("div", { className: "p-4 bg-charcoal border border-ash/40 border-t-0" }, /* @__PURE__ */ React50.createElement(Skeleton, { className: "h-5 w-3/4 mb-2" }), /* @__PURE__ */ React50.createElement(Skeleton, { className: "h-4 w-1/2" })));
+  }
+  if (type === "video") {
+    return /* @__PURE__ */ React50.createElement("div", { className: "overflow-hidden" }, /* @__PURE__ */ React50.createElement(Skeleton, { className: "w-full aspect-video" }), /* @__PURE__ */ React50.createElement("div", { className: "p-4 bg-charcoal border border-ash/40 border-t-0" }, /* @__PURE__ */ React50.createElement(Skeleton, { className: "h-5 w-3/4 mb-2" }), /* @__PURE__ */ React50.createElement(Skeleton, { className: "h-4 w-1/2" })));
+  }
+  return /* @__PURE__ */ React50.createElement("div", { className: "p-4 bg-charcoal border border-ash/40 space-y-2" }, /* @__PURE__ */ React50.createElement(Skeleton, { className: "h-5 w-1/2" }), /* @__PURE__ */ React50.createElement(Skeleton, { className: "h-4 w-full" }), /* @__PURE__ */ React50.createElement(Skeleton, { className: "h-4 w-full" }), /* @__PURE__ */ React50.createElement(Skeleton, { className: "h-4 w-3/4" }));
+}
+function ArtifactRenderer({ artifact, isLoading }) {
+  const [imageLoaded, setImageLoaded] = useState14(false);
+  const [minDelayPassed, setMinDelayPassed] = useState14(false);
+  useEffect11(() => {
+    setImageLoaded(false);
+    setMinDelayPassed(false);
+    const timer = setTimeout(() => {
+      setMinDelayPassed(true);
+    }, 800);
+    return () => clearTimeout(timer);
+  }, [artifact.src, artifact.id]);
+  if (isLoading || artifact.isPending) {
+    return /* @__PURE__ */ React50.createElement(ArtifactSkeleton, { type: artifact.type });
+  }
+  const showContent = imageLoaded && minDelayPassed;
+  switch (artifact.type) {
+    case "image":
+      return /* @__PURE__ */ React50.createElement("div", { className: "relative" }, !showContent && /* @__PURE__ */ React50.createElement(ArtifactSkeleton, { type: "image" }), /* @__PURE__ */ React50.createElement(
+        ImageCard,
+        {
+          src: artifact.src || "",
+          alt: artifact.alt || "Artifact image",
+          title: artifact.title,
+          subtitle: artifact.subtitle,
+          aspectRatio: "landscape",
+          className: cx(
+            "w-full transition-opacity duration-300",
+            showContent ? "opacity-100" : "opacity-0 absolute inset-0"
+          ),
+          onLoad: () => setImageLoaded(true)
+        }
+      ));
+    case "video":
+      return /* @__PURE__ */ React50.createElement(
+        VideoCard,
+        {
+          src: artifact.src || "",
+          title: artifact.title,
+          subtitle: artifact.subtitle,
+          aspectRatio: "video",
+          controls: true,
+          className: "w-full"
+        }
+      );
+    case "text":
+      return /* @__PURE__ */ React50.createElement("div", { className: "p-4 bg-charcoal border border-ash/40" }, artifact.title && /* @__PURE__ */ React50.createElement("h4", { className: "text-lg font-semibold text-white mb-2" }, artifact.title), /* @__PURE__ */ React50.createElement(
+        MarkdownContent,
+        {
+          content: artifact.content || "",
+          className: "prose-sm prose-invert"
+        }
+      ));
+    default:
+      return null;
+  }
+}
+var ArtifactsPanel = React50.forwardRef(
+  ({ artifacts, isOpen = false, onClose, isLoading = false, className, ...rest }, ref) => {
+    if (!isOpen) {
+      return /* @__PURE__ */ React50.createElement(
+        "div",
+        {
+          ref,
+          className: cx(
+            "h-full bg-charcoal/80 border-l border-ash/40 flex flex-col items-center py-3",
+            "w-12 flex-shrink-0",
+            className
+          ),
+          ...rest
+        },
+        /* @__PURE__ */ React50.createElement(
+          "button",
+          {
+            onClick: onClose,
+            className: cx(
+              "p-2",
+              "text-silver hover:text-white hover:bg-ash/20",
+              "transition-colors duration-150",
+              "relative"
+            ),
+            "aria-label": "Expand artifacts panel"
+          },
+          /* @__PURE__ */ React50.createElement(LayersIcon, { className: "w-5 h-5" }),
+          artifacts.length > 0 && /* @__PURE__ */ React50.createElement("span", { className: "absolute -top-1 -right-1 w-4 h-4 bg-gold text-obsidian text-xs font-medium flex items-center justify-center rounded-full" }, artifacts.length)
+        )
+      );
+    }
+    return /* @__PURE__ */ React50.createElement(
+      "div",
+      {
+        ref,
+        className: cx(
+          "h-full bg-charcoal/50 border-l border-ash/40 flex flex-col",
+          "w-96 flex-shrink-0",
+          className
+        ),
+        ...rest
+      },
+      /* @__PURE__ */ React50.createElement("div", { className: "flex items-center justify-between p-4 border-b border-ash/40 flex-shrink-0" }, /* @__PURE__ */ React50.createElement("h3", { className: "text-lg font-semibold text-white" }, "Artifacts"), /* @__PURE__ */ React50.createElement(
+        "button",
+        {
+          onClick: onClose,
+          className: cx(
+            "p-1.5",
+            "text-silver hover:text-white hover:bg-ash/20",
+            "transition-colors duration-150"
+          ),
+          "aria-label": "Collapse artifacts panel"
+        },
+        /* @__PURE__ */ React50.createElement(ChevronRightIcon2, { className: "w-5 h-5" })
+      )),
+      /* @__PURE__ */ React50.createElement("div", { className: "flex-1 overflow-y-auto p-4 space-y-4" }, artifacts.length === 0 && !isLoading ? /* @__PURE__ */ React50.createElement("p", { className: "text-sm text-silver/60 text-center py-8" }, "No artifacts to display") : artifacts.map((artifact) => /* @__PURE__ */ React50.createElement(
+        ArtifactRenderer,
+        {
+          key: artifact.id,
+          artifact,
+          isLoading
+        }
+      )))
+    );
+  }
+);
+ArtifactsPanel.displayName = "ArtifactsPanel";
+var ArtifactsPanelToggle = React50.forwardRef(({ artifactCount = 0, onExpand, className, ...rest }, ref) => {
+  return /* @__PURE__ */ React50.createElement(
+    "button",
+    {
+      ref,
+      onClick: onExpand,
+      className: cx(
+        "p-2",
+        "bg-charcoal/80 border border-ash/40",
+        "text-silver hover:text-white hover:bg-ash/20",
+        "transition-colors duration-150",
+        "flex items-center gap-2",
+        "relative",
+        className
+      ),
+      "aria-label": "Expand artifacts panel",
+      ...rest
+    },
+    /* @__PURE__ */ React50.createElement(LayersIcon, { className: "w-5 h-5" }),
+    artifactCount > 0 && /* @__PURE__ */ React50.createElement("span", { className: "absolute -top-1 -right-1 w-4 h-4 bg-gold text-obsidian text-xs font-medium flex items-center justify-center rounded-full" }, artifactCount)
+  );
+});
+ArtifactsPanelToggle.displayName = "ArtifactsPanelToggle";
+
+// src/components/chat/hooks/useArtifactParser.ts
+import { useMemo as useMemo2 } from "react";
+var COMPLETE_ARTIFACT_REGEX = /:::artifact\{([^}]+)\}(?:([^:]*?))?:::/gs;
+var ARTIFACT_START_REGEX = /:::artifact\{/;
+function parseAttributes(attrString) {
+  const attrs = {};
+  const regex = /(\w+)="([^"]*)"/g;
+  let match;
+  while ((match = regex.exec(attrString)) !== null) {
+    attrs[match[1]] = match[2];
+  }
+  return attrs;
+}
+function generateStableArtifactId(type, identifier) {
+  const str = `${type}:${identifier}`;
+  let hash = 0;
+  for (let i = 0; i < str.length; i++) {
+    const char = str.charCodeAt(i);
+    hash = (hash << 5) - hash + char;
+    hash = hash & hash;
+  }
+  return `artifact-${Math.abs(hash).toString(36)}`;
+}
+function useArtifactParser(content) {
+  return useMemo2(() => {
+    if (!content) {
+      return { cleanContent: "", artifacts: [], hasPendingArtifact: false };
+    }
+    const artifacts = [];
+    let workingContent = content;
+    let artifactIndex = 0;
+    workingContent = workingContent.replace(COMPLETE_ARTIFACT_REGEX, (_, attrString, innerContent) => {
+      const attrs = parseAttributes(attrString);
+      const type = attrs.type || "text";
+      const identifier = attrs.src || attrs.content || innerContent || `idx-${artifactIndex++}`;
+      const id = generateStableArtifactId(type, identifier);
+      const artifact = {
+        id,
+        type,
+        title: attrs.title,
+        subtitle: attrs.subtitle
+      };
+      if (type === "text") {
+        artifact.content = innerContent?.trim() || attrs.content;
+      } else if (type === "image") {
+        artifact.src = attrs.src;
+        artifact.alt = attrs.alt || "Image";
+      } else if (type === "video") {
+        artifact.src = attrs.src;
+      }
+      artifacts.push(artifact);
+      return "";
+    });
+    const startMatch = workingContent.match(ARTIFACT_START_REGEX);
+    let hasPendingArtifact = false;
+    if (startMatch && startMatch.index !== void 0) {
+      workingContent = workingContent.substring(0, startMatch.index);
+      hasPendingArtifact = true;
+      artifacts.push({
+        id: "artifact-pending",
+        type: "image",
+        // Default to image for skeleton
+        isPending: true
+      });
+    }
+    return {
+      cleanContent: workingContent.trim(),
+      artifacts,
+      hasPendingArtifact
+    };
+  }, [content]);
+}
+
+// src/components/chat/ChatInterface.tsx
+var ChatInterface = React51.forwardRef(
+  ({
+    messages = [],
+    conversationTree,
+    onTreeChange,
+    conversations = [],
+    onMessageSubmit,
+    onEditMessage,
+    onRetryMessage,
+    onStop,
+    onSelectConversation,
+    onNewChat,
+    isStreaming = false,
+    isThinking = false,
+    placeholder = "Send a message...",
+    emptyStateHelper = "Type anything to start a conversation",
+    initialSidebarCollapsed = false,
+    emptyState,
+    showAttachmentButton = true,
+    enableMessageActions = true,
+    attachments: propsAttachments,
+    onAttachmentsChange,
+    className,
+    ...rest
+  }, ref) => {
+    const [sidebarCollapsed, setSidebarCollapsed] = useState15(initialSidebarCollapsed);
+    const [artifactsPanelOpen, setArtifactsPanelOpen] = useState15(false);
+    const isTreeMode = !!conversationTree;
+    const effectiveMessages = useMemo3(() => {
+      if (isTreeMode && conversationTree) {
+        const pathNodes = getActivePathMessages(conversationTree);
+        return pathNodes.map((node) => ({
+          id: node.id,
+          variant: node.role,
+          content: node.content,
+          isStreaming: node.isStreaming
+        }));
+      }
+      return messages;
+    }, [isTreeMode, conversationTree, messages]);
+    const latestUserMessageIndex = useMemo3(() => {
+      for (let i = effectiveMessages.length - 1; i >= 0; i--) {
+        if (effectiveMessages[i].variant === "user") {
+          return i;
+        }
+      }
+      return -1;
+    }, [effectiveMessages]);
+    const allAssistantContent = useMemo3(() => {
+      return effectiveMessages.filter((msg) => msg.variant === "assistant").map((msg) => msg.content).join("\n\n");
+    }, [effectiveMessages]);
+    const { artifacts, hasPendingArtifact } = useArtifactParser(allAssistantContent);
+    const currentStreamingCleanContent = useMemo3(() => {
+      if (!isStreaming || effectiveMessages.length === 0) {
+        return null;
+      }
+      const lastMessage = effectiveMessages[effectiveMessages.length - 1];
+      if (lastMessage.variant === "assistant") {
+        const content = lastMessage.content;
+        let clean = content.replace(/:::artifact\{[^}]+}(?:[^:]*?)?:::/gs, "");
+        const startMatch = clean.match(/:::artifact\{/);
+        if (startMatch && startMatch.index !== void 0) {
+          clean = clean.substring(0, startMatch.index);
+        }
+        return clean.trim();
+      }
+      return null;
+    }, [effectiveMessages, isStreaming]);
+    React51.useEffect(() => {
+      if ((artifacts.length > 0 || hasPendingArtifact) && !artifactsPanelOpen) {
+        setArtifactsPanelOpen(true);
+      }
+    }, [artifacts.length, hasPendingArtifact, artifactsPanelOpen]);
+    const handleBranchSwitch = useCallback14(
+      (nodeId, direction) => {
+        if (!isTreeMode || !conversationTree || !onTreeChange) {
+          return;
+        }
+        const newTree = switchBranch(conversationTree, nodeId, direction);
+        onTreeChange(newTree);
+      },
+      [isTreeMode, conversationTree, onTreeChange]
+    );
+    const displayMessages = useMemo3(() => {
+      return effectiveMessages.map((msg, idx) => {
+        let cleanContent = msg.content;
+        if (msg.variant === "assistant") {
+          if (isStreaming && idx === effectiveMessages.length - 1 && currentStreamingCleanContent !== null) {
+            cleanContent = currentStreamingCleanContent;
+          } else {
+            let clean = msg.content.replace(/:::artifact\{[^}]+}(?:[^:]*?)?:::/gs, "");
+            const startMatch = clean.match(/:::artifact\{/);
+            if (startMatch && startMatch.index !== void 0) {
+              clean = clean.substring(0, startMatch.index);
+            }
+            cleanContent = clean.trim();
+          }
+        }
+        let branchInfo = void 0;
+        if (isTreeMode && conversationTree) {
+          const siblingInfo = getSiblingInfo(conversationTree, msg.id);
+          if (siblingInfo.total > 1) {
+            branchInfo = {
+              current: siblingInfo.current,
+              total: siblingInfo.total,
+              onPrevious: () => handleBranchSwitch(msg.id, "prev"),
+              onNext: () => handleBranchSwitch(msg.id, "next")
+            };
+          }
+        }
+        const actions = enableMessageActions ? {
+          showCopy: true,
+          onEdit: msg.variant === "user" && onEditMessage ? (newContent) => onEditMessage(msg.id, newContent) : void 0,
+          onRetry: msg.variant === "assistant" && onRetryMessage ? () => onRetryMessage(msg.id) : void 0
+        } : void 0;
+        return {
+          ...msg,
+          content: cleanContent,
+          branchInfo,
+          actions
+        };
+      });
+    }, [
+      effectiveMessages,
+      isStreaming,
+      currentStreamingCleanContent,
+      isTreeMode,
+      conversationTree,
+      enableMessageActions,
+      onEditMessage,
+      onRetryMessage,
+      handleBranchSwitch
+    ]);
+    const allArtifacts = useMemo3(() => {
+      return artifacts;
+    }, [artifacts]);
+    const handleSubmit = useCallback14(
+      (message, attachments) => {
+        onMessageSubmit?.(message, attachments);
+      },
+      [onMessageSubmit]
+    );
+    const toggleSidebar = useCallback14(() => {
+      setSidebarCollapsed((prev) => !prev);
+    }, []);
+    const toggleArtifactsPanel = useCallback14(() => {
+      setArtifactsPanelOpen((prev) => !prev);
+    }, []);
+    const isEmpty = effectiveMessages.length === 0;
+    return /* @__PURE__ */ React51.createElement(
+      "div",
+      {
+        ref,
+        className: cx("flex h-full w-full bg-obsidian overflow-hidden", className),
+        ...rest
+      },
+      /* @__PURE__ */ React51.createElement(
+        ConversationSidebar,
+        {
+          conversations,
+          isCollapsed: sidebarCollapsed,
+          onSelectConversation,
+          onNewChat,
+          onToggleCollapse: toggleSidebar
+        }
+      ),
+      /* @__PURE__ */ React51.createElement("div", { className: "flex-1 flex flex-col min-w-0 relative" }, /* @__PURE__ */ React51.createElement("div", { className: cx(
+        "flex-1 flex flex-col min-h-0 relative transition-all duration-500",
+        isEmpty ? "justify-center" : "justify-start"
+      ) }, /* @__PURE__ */ React51.createElement("div", { className: cx(
+        "transition-all duration-500 ease-in-out",
+        isEmpty ? "flex-1" : "flex-zero"
+      ) }), /* @__PURE__ */ React51.createElement("div", { className: cx(
+        "transition-all duration-500 ease-in-out overflow-hidden flex flex-col",
+        isEmpty ? "flex-zero opacity-0" : "flex-1 opacity-100"
+      ) }, /* @__PURE__ */ React51.createElement(
+        ChatView,
+        {
+          messages: displayMessages,
+          latestUserMessageIndex,
+          isStreaming,
+          isThinking,
+          className: "flex-1"
+        }
+      )), /* @__PURE__ */ React51.createElement("div", { className: cx(
+        "transition-all duration-500 ease-in-out z-10 w-full",
+        isEmpty ? "p-4" : "shrink-0 p-4 border-t border-ash/40 bg-obsidian"
+      ) }, isEmpty && emptyState ? /* @__PURE__ */ React51.createElement("div", { className: "flex justify-center" }, emptyState) : /* @__PURE__ */ React51.createElement(
+        ChatInput,
+        {
+          position: isEmpty ? "centered" : "bottom",
+          placeholder,
+          helperText: isEmpty ? emptyStateHelper : void 0,
+          onSubmit: handleSubmit,
+          disabled: isEmpty ? isStreaming : isStreaming && !onStop,
+          isStreaming,
+          onStop,
+          showAttachmentButton,
+          attachments: propsAttachments,
+          onAttachmentsChange
+        }
+      )), /* @__PURE__ */ React51.createElement("div", { className: cx(
+        "transition-all duration-500 ease-in-out",
+        isEmpty ? "flex-1" : "flex-zero"
+      ) }))),
+      /* @__PURE__ */ React51.createElement(
+        ArtifactsPanel,
+        {
+          artifacts: allArtifacts,
+          isOpen: artifactsPanelOpen,
+          onClose: toggleArtifactsPanel,
+          isLoading: isStreaming && hasPendingArtifact
+        }
+      )
+    );
+  }
+);
+ChatInterface.displayName = "ChatInterface";
+
+// src/components/chat/MessageActions.tsx
+import React52, { useState as useState16, useCallback as useCallback15 } from "react";
+import {
+  Copy,
+  Check as Check3,
+  Pencil,
+  RotateCcw,
+  X as X5,
+  Send as Send2
+} from "lucide-react";
+var ActionButton2 = ({ onClick, label, children, className, disabled }) => /* @__PURE__ */ React52.createElement(
+  "button",
+  {
+    type: "button",
+    onClick,
+    disabled,
+    className: cx(
+      "p-1.5 text-silver/60 hover:text-silver transition-colors duration-150",
+      "hover:bg-white/5 ",
+      "disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:bg-transparent",
+      className
+    ),
+    "aria-label": label
+  },
+  children
+);
+var MessageActions = React52.forwardRef(
+  ({
+    variant,
+    content,
+    onEdit,
+    onRetry,
+    isEditing: controlledIsEditing,
+    onEditingChange,
+    editValue: controlledEditValue,
+    className,
+    ...rest
+  }, ref) => {
+    const [localIsEditing, setLocalIsEditing] = useState16(false);
+    const [localEditValue, setLocalEditValue] = useState16(content);
+    const [copied, setCopied] = useState16(false);
+    const isEditing = controlledIsEditing ?? localIsEditing;
+    const editValue = controlledEditValue ?? localEditValue;
+    const setIsEditing = useCallback15(
+      (value) => {
+        if (onEditingChange) {
+          onEditingChange(value);
+        } else {
+          setLocalIsEditing(value);
+        }
+      },
+      [onEditingChange]
+    );
+    const setEditValue = useCallback15((value) => {
+      setLocalEditValue(value);
+    }, []);
+    const handleCopy = useCallback15(async () => {
+      try {
+        await navigator.clipboard.writeText(content);
+        setCopied(true);
+        setTimeout(() => setCopied(false), 2e3);
+      } catch {
+        const textArea = document.createElement("textarea");
+        textArea.value = content;
+        document.body.appendChild(textArea);
+        textArea.select();
+        document.execCommand("copy");
+        document.body.removeChild(textArea);
+        setCopied(true);
+        setTimeout(() => setCopied(false), 2e3);
+      }
+    }, [content]);
+    const handleStartEdit = useCallback15(() => {
+      setLocalEditValue(content);
+      setIsEditing(true);
+    }, [content, setIsEditing]);
+    const handleCancelEdit = useCallback15(() => {
+      setIsEditing(false);
+      setLocalEditValue(content);
+    }, [content, setIsEditing]);
+    const handleSubmitEdit = useCallback15(() => {
+      const trimmed = editValue.trim();
+      if (trimmed && trimmed !== content) {
+        onEdit?.(trimmed);
+      }
+      setIsEditing(false);
+    }, [editValue, content, onEdit, setIsEditing]);
+    const handleEditKeyDown = useCallback15(
+      (e) => {
+        if (e.key === "Enter" && !e.shiftKey) {
+          e.preventDefault();
+          handleSubmitEdit();
+        } else if (e.key === "Escape") {
+          handleCancelEdit();
+        }
+      },
+      [handleSubmitEdit, handleCancelEdit]
+    );
+    const isUser = variant === "user";
+    if (isUser && isEditing) {
+      return /* @__PURE__ */ React52.createElement(
+        "div",
+        {
+          ref,
+          className: cx("mt-2", className),
+          ...rest
+        },
+        /* @__PURE__ */ React52.createElement("div", { className: "relative bg-charcoal border border-ash/60 focus-within:border-gold/60 focus-within:ring-1 focus-within:ring-gold/20" }, /* @__PURE__ */ React52.createElement(
+          "textarea",
+          {
+            value: editValue,
+            onChange: (e) => setEditValue(e.target.value),
+            onKeyDown: handleEditKeyDown,
+            className: "w-full bg-transparent text-white px-3 py-2 pr-20 resize-none outline-none min-h-16 text-sm",
+            autoFocus: true,
+            rows: 2
+          }
+        ), /* @__PURE__ */ React52.createElement("div", { className: "absolute right-2 bottom-2 flex gap-1" }, /* @__PURE__ */ React52.createElement(
+          ActionButton2,
+          {
+            onClick: handleCancelEdit,
+            label: "Cancel edit",
+            className: "text-silver/60 hover:text-error"
+          },
+          /* @__PURE__ */ React52.createElement(X5, { className: "w-4 h-4" })
+        ), /* @__PURE__ */ React52.createElement(
+          ActionButton2,
+          {
+            onClick: handleSubmitEdit,
+            label: "Submit edit",
+            className: "text-silver/60 hover:text-gold",
+            disabled: !editValue.trim() || editValue.trim() === content
+          },
+          /* @__PURE__ */ React52.createElement(Send2, { className: "w-4 h-4" })
+        ))),
+        /* @__PURE__ */ React52.createElement("p", { className: "text-xs text-silver/50 mt-1" }, "Press Enter to submit, Esc to cancel. This will create a new branch.")
+      );
+    }
+    return /* @__PURE__ */ React52.createElement(
+      "div",
+      {
+        ref,
+        className: cx(
+          "flex items-center gap-0.5 mt-1",
+          isUser ? "justify-end" : "justify-start",
+          className
+        ),
+        ...rest
+      },
+      /* @__PURE__ */ React52.createElement(ActionButton2, { onClick: handleCopy, label: copied ? "Copied!" : "Copy message" }, copied ? /* @__PURE__ */ React52.createElement(Check3, { className: "w-3.5 h-3.5 text-success" }) : /* @__PURE__ */ React52.createElement(Copy, { className: "w-3.5 h-3.5" })),
+      isUser && onEdit && /* @__PURE__ */ React52.createElement(ActionButton2, { onClick: handleStartEdit, label: "Edit message" }, /* @__PURE__ */ React52.createElement(Pencil, { className: "w-3.5 h-3.5" })),
+      !isUser && onRetry && /* @__PURE__ */ React52.createElement(ActionButton2, { onClick: onRetry, label: "Regenerate response" }, /* @__PURE__ */ React52.createElement(RotateCcw, { className: "w-3.5 h-3.5" }))
+    );
+  }
+);
+MessageActions.displayName = "MessageActions";
+
+// src/components/chat/BranchNavigator.tsx
+import React53 from "react";
+import { ChevronLeft as ChevronLeft2, ChevronRight as ChevronRight3, GitBranch } from "lucide-react";
+var BranchNavigator = React53.forwardRef(
+  ({
+    current,
+    total,
+    onPrevious,
+    onNext,
+    size = "sm",
+    showIcon = true,
+    className,
+    ...rest
+  }, ref) => {
+    if (total <= 1) return null;
+    const isFirst = current <= 1;
+    const isLast = current >= total;
+    const buttonSize = size === "sm" ? "p-0.5" : "p-1";
+    const iconSize = size === "sm" ? "w-3 h-3" : "w-4 h-4";
+    const textSize = size === "sm" ? "text-xs" : "text-sm";
+    return /* @__PURE__ */ React53.createElement(
+      "div",
+      {
+        ref,
+        className: cx(
+          "inline-flex items-center gap-0.5 text-silver/70",
+          className
+        ),
+        role: "navigation",
+        "aria-label": "Branch navigation",
+        ...rest
+      },
+      showIcon && /* @__PURE__ */ React53.createElement(GitBranch, { className: cx(iconSize, "mr-0.5 text-silver/50"), "aria-hidden": "true" }),
+      /* @__PURE__ */ React53.createElement(
+        "button",
+        {
+          type: "button",
+          onClick: onPrevious,
+          disabled: isFirst,
+          className: cx(
+            buttonSize,
+            "hover:text-white hover:bg-white/10  transition-colors",
+            "disabled:opacity-30 disabled:cursor-not-allowed disabled:hover:bg-transparent disabled:hover:text-silver/70"
+          ),
+          "aria-label": "Previous branch"
+        },
+        /* @__PURE__ */ React53.createElement(ChevronLeft2, { className: iconSize })
+      ),
+      /* @__PURE__ */ React53.createElement("span", { className: cx(textSize, "tabular-nums min-w-6 text-center") }, current, "/", total),
+      /* @__PURE__ */ React53.createElement(
+        "button",
+        {
+          type: "button",
+          onClick: onNext,
+          disabled: isLast,
+          className: cx(
+            buttonSize,
+            "hover:text-white hover:bg-white/10  transition-colors",
+            "disabled:opacity-30 disabled:cursor-not-allowed disabled:hover:bg-transparent disabled:hover:text-silver/70"
+          ),
+          "aria-label": "Next branch"
+        },
+        /* @__PURE__ */ React53.createElement(ChevronRight3, { className: iconSize })
+      )
+    );
+  }
+);
+BranchNavigator.displayName = "BranchNavigator";
+
+// src/components/BrandIcon.tsx
+import React54 from "react";
+var sizeMap2 = {
+  sm: "h-8 w-8 text-sm",
+  md: "h-12 w-12 text-base",
+  lg: "h-16 w-16 text-lg"
+};
+var BrandIcon = React54.forwardRef(
+  ({ size = "md", variant = "solid", children, className, ...rest }, ref) => {
+    const variantClasses = variant === "solid" ? "bg-gold text-obsidian border-2 border-gold" : "bg-transparent text-gold border-2 border-gold";
+    return /* @__PURE__ */ React54.createElement(
+      "div",
+      {
+        ref,
+        className: cx(
+          "inline-flex items-center justify-center rounded-none font-bold select-none overflow-hidden",
+          sizeMap2[size],
+          variantClasses,
+          className
+        ),
+        ...rest
+      },
+      children
+    );
+  }
+);
+BrandIcon.displayName = "BrandIcon";
+
+// src/components/ColorSwatch.tsx
+import React55 from "react";
+var ColorSwatch = React55.forwardRef(
+  ({ color, label, className, ...rest }, ref) => {
+    return /* @__PURE__ */ React55.createElement(
+      "div",
+      {
+        ref,
+        className: cx("flex flex-col items-center gap-2", className),
+        ...rest
+      },
+      /* @__PURE__ */ React55.createElement(
+        "div",
+        {
+          className: "h-16 w-16 border-2 border-ash rounded-none shadow-sm",
+          style: { backgroundColor: color },
+          "aria-label": label || color
+        }
+      ),
+      label && /* @__PURE__ */ React55.createElement("span", { className: "text-xs text-silver font-medium" }, label)
+    );
+  }
+);
+ColorSwatch.displayName = "ColorSwatch";
+
 // src/components/SectionHeading.tsx
-import React47 from "react";
+import React56 from "react";
 var levelStyles = {
   h2: "text-2xl mb-4",
   h3: "text-xl mb-3"
 };
-var SectionHeading = React47.forwardRef(
+var SectionHeading = React56.forwardRef(
   ({ level = "h2", children, className, ...rest }, ref) => {
     const Component = level;
-    return /* @__PURE__ */ React47.createElement(
+    return /* @__PURE__ */ React56.createElement(
       Component,
       {
         ref,
@@ -3437,22 +5275,31 @@ export {
   AccordionTrigger,
   Alert,
   AlertDialog,
+  ArtifactsPanel,
+  ArtifactsPanelToggle,
+  AttachmentPreview,
   Avatar,
   Badge,
+  BranchNavigator,
   BrandIcon,
   Breadcrumb,
   BreadcrumbItem,
   BreadcrumbLink,
   Button,
   Card,
-  ChatHistory,
+  ChatInput,
+  ChatInterface,
+  ChatView,
   Checkbox,
   Col,
+  CollapsedSidebarToggle,
   ColorSwatch,
   ConfirmDialog,
   Container,
+  ConversationSidebar,
   Divider,
   Drawer,
+  FileChip,
   HelperText,
   ImageCard,
   Input,
@@ -3475,6 +5322,7 @@ export {
   MenuSeparator,
   MenuTrigger,
   Message,
+  MessageActions,
   Modal,
   Navbar,
   NavbarBrand,
@@ -3510,9 +5358,24 @@ export {
   TableRow,
   Tabs,
   Textarea,
+  ThinkingIndicator,
   ToastProvider,
   Tooltip,
   VideoCard,
+  addMessageToTree,
+  createEmptyTree,
+  createPreviewUrl,
+  generateId,
+  getActivePathMessages,
+  getSiblingInfo,
+  isBranchPoint,
+  isImageFile,
+  messagesToTree,
+  revokePreviewUrl,
+  switchBranch,
+  updateNodeContent,
+  useArtifactParser,
+  useScrollAnchor,
   useToast,
   version
 };