@lukeashford/aurelius 4.0.0 → 4.1.0

package/dist/index.js

@@ -59,6 +59,7 @@ __export(index_exports, {
   ChatView: () => ChatView,
   CheckSquareIcon: () => CheckSquareIcon,
   Checkbox: () => Checkbox,
+  Checkpoint: () => Checkpoint,
   ChevronLeftIcon: () => ChevronLeftIcon,
   ChevronRightIcon: () => ChevronRightIcon,
   CloseIcon: () => CloseIcon,
@@ -72,6 +73,7 @@ __export(index_exports, {
   EmptySquareIcon: () => EmptySquareIcon,
   ExpandIcon: () => ExpandIcon,
   FileChip: () => FileChip,
+  GreyedDivider: () => GreyedDivider,
   HelperText: () => HelperText,
   HistoryIcon: () => HistoryIcon,
   HistoryPanel: () => HistoryPanel,
@@ -149,16 +151,22 @@ __export(index_exports, {
   ToolSidebar: () => ToolSidebar,
   Tooltip: () => Tooltip,
   VideoCard: () => VideoCard,
-  addMessageToTree: () => addMessageToTree,
+  addNodeToTree: () => addNodeToTree,
   areAllTasksSettled: () => areAllTasksSettled,
   createEmptyTree: () => createEmptyTree,
+  createPreviewUrl: () => createPreviewUrl,
+  findAncestor: () => findAncestor,
   generateId: () => generateId,
-  getActivePathMessages: () => getActivePathMessages,
+  getActivePath: () => getActivePath,
+  getGreyedFuture: () => getGreyedFuture,
   getSiblingInfo: () => getSiblingInfo,
   isBranchPoint: () => isBranchPoint,
+  isImageFile: () => isImageFile,
   messagesToTree: () => messagesToTree,
+  revokePreviewUrl: () => revokePreviewUrl,
+  setActiveLeaf: () => setActiveLeaf,
   switchBranch: () => switchBranch,
-  updateNodeContent: () => updateNodeContent,
+  updateMessageContent: () => updateMessageContent,
   useArtifactTreeNavigation: () => useArtifactTreeNavigation,
   useResizable: () => useResizable,
   useScrollAnchor: () => useScrollAnchor,
@@ -4213,10 +4221,10 @@ var StreamingCursor = import_react57.default.forwardRef(
 StreamingCursor.displayName = "StreamingCursor";
 
 // src/components/chat/ChatInterface.tsx
-var import_react79 = __toESM(require("react"));
+var import_react81 = __toESM(require("react"));
 
 // src/components/chat/ChatView.tsx
-var import_react61 = __toESM(require("react"));
+var import_react63 = __toESM(require("react"));
 
 // src/components/chat/hooks/useScrollAnchor.ts
 var import_react58 = require("react");
@@ -4431,9 +4439,169 @@ var ThinkingIndicator = import_react60.default.forwardRef(
 );
 ThinkingIndicator.displayName = "ThinkingIndicator";
 
+// src/components/chat/Checkpoint.tsx
+var import_react61 = __toESM(require("react"));
+var import_lucide_react12 = require("lucide-react");
+var KIND_ICONS = {
+  task: import_lucide_react12.GitBranch,
+  submit: import_lucide_react12.GitMerge,
+  rename: import_lucide_react12.PencilLine,
+  init: import_lucide_react12.GitCommitVertical
+};
+var KIND_ARIA_LABELS = {
+  task: "Task checkpoint",
+  submit: "Submit checkpoint",
+  rename: "Rename checkpoint",
+  init: "Project head checkpoint"
+};
+var Checkpoint = import_react61.default.forwardRef(
+  function Checkpoint2({ name, executionKind, status = "completed", isActive, muted, branchInfo, onJumpHere }, ref) {
+    const KindIcon = KIND_ICONS[executionKind];
+    const isFailed = status === "failed";
+    const isCancelled = status === "cancelled";
+    const isInteractive = !isActive && !!onJumpHere;
+    const iconColor = isActive ? "text-gold" : isFailed ? "text-error-muted" : "text-silver/50";
+    const nameClasses = cx(
+      "transition-colors text-xs",
+      isActive ? "text-silver font-medium" : isInteractive ? "text-silver/70 hover:text-white underline decoration-silver/30 underline-offset-4 decoration-dotted hover:decoration-silver/70" : "text-silver/50"
+    );
+    return /* @__PURE__ */ import_react61.default.createElement(
+      "div",
+      {
+        ref,
+        role: "group",
+        "aria-label": KIND_ARIA_LABELS[executionKind],
+        className: cx(
+          "group/checkpoint flex items-center gap-2 py-1.5 select-none",
+          muted && "opacity-60"
+        )
+      },
+      /* @__PURE__ */ import_react61.default.createElement(KindIcon, { className: cx("w-3.5 h-3.5 shrink-0", iconColor), "aria-hidden": "true" }),
+      /* @__PURE__ */ import_react61.default.createElement(
+        "button",
+        {
+          type: "button",
+          onClick: isInteractive ? onJumpHere : void 0,
+          disabled: !isInteractive,
+          className: cx(
+            nameClasses,
+            "truncate text-left",
+            !isInteractive && "cursor-default"
+          ),
+          "aria-label": isInteractive ? `Jump to checkpoint ${name}` : name
+        },
+        /* @__PURE__ */ import_react61.default.createElement("span", { className: "truncate" }, name),
+        isFailed && /* @__PURE__ */ import_react61.default.createElement("span", { className: "ml-1.5 text-error-muted" }, "\xB7 failed"),
+        isCancelled && /* @__PURE__ */ import_react61.default.createElement("span", { className: "ml-1.5 text-silver/40" }, "\xB7 cancelled")
+      ),
+      isInteractive && /* @__PURE__ */ import_react61.default.createElement(
+        "span",
+        {
+          className: cx(
+            "ml-1 inline-flex items-center gap-1 text-xs text-silver/40",
+            "opacity-0 group-hover/checkpoint:opacity-100 transition-opacity",
+            "pointer-events-none"
+          ),
+          "aria-hidden": "true"
+        },
+        /* @__PURE__ */ import_react61.default.createElement(import_lucide_react12.ArrowLeft, { className: "w-3 h-3" }),
+        "Jump here"
+      ),
+      branchInfo && branchInfo.total > 1 && /* @__PURE__ */ import_react61.default.createElement(
+        "div",
+        {
+          className: "ml-auto inline-flex items-center gap-0.5 text-silver/70 text-xs",
+          role: "navigation",
+          "aria-label": "Switch sibling checkpoint"
+        },
+        /* @__PURE__ */ import_react61.default.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 sibling checkpoint"
+          },
+          /* @__PURE__ */ import_react61.default.createElement(import_lucide_react12.ChevronLeft, { className: "w-3 h-3" })
+        ),
+        /* @__PURE__ */ import_react61.default.createElement("span", { className: "tabular-nums min-w-6 text-center" }, branchInfo.current, "/", branchInfo.total),
+        /* @__PURE__ */ import_react61.default.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 sibling checkpoint"
+          },
+          /* @__PURE__ */ import_react61.default.createElement(import_lucide_react12.ChevronRight, { className: "w-3 h-3" })
+        )
+      )
+    );
+  }
+);
+Checkpoint.displayName = "Checkpoint";
+
+// src/components/chat/GreyedDivider.tsx
+var import_react62 = __toESM(require("react"));
+var import_lucide_react13 = require("lucide-react");
+function pluralize(n, singular, plural) {
+  return `${n} ${n === 1 ? singular : plural}`;
+}
+function summarize(messageCount, checkpointCount) {
+  const parts = [];
+  if (messageCount > 0) {
+    parts.push(pluralize(messageCount, "message", "messages"));
+  }
+  if (checkpointCount > 0) {
+    parts.push(pluralize(checkpointCount, "checkpoint", "checkpoints"));
+  }
+  return parts.length > 0 ? parts.join(", ") : "no items";
+}
+var GreyedDivider = import_react62.default.forwardRef(
+  function GreyedDivider2({ messageCount, checkpointCount, onJumpToLatest }, ref) {
+    if (messageCount === 0 && checkpointCount === 0) {
+      return null;
+    }
+    return /* @__PURE__ */ import_react62.default.createElement(
+      "div",
+      {
+        ref,
+        role: "separator",
+        "aria-label": "Start of rewound timeline",
+        className: "flex items-center gap-3 py-2 text-xs text-silver/50 select-none"
+      },
+      /* @__PURE__ */ import_react62.default.createElement("div", { className: "flex-1 h-px bg-ash/40", "aria-hidden": "true" }),
+      /* @__PURE__ */ import_react62.default.createElement("span", { className: "inline-flex items-center gap-1.5 whitespace-nowrap" }, /* @__PURE__ */ import_react62.default.createElement(import_lucide_react13.ArrowDown, { className: "w-3 h-3", "aria-hidden": "true" }), "Later in this conversation \xB7 ", summarize(messageCount, checkpointCount)),
+      /* @__PURE__ */ import_react62.default.createElement("div", { className: "flex-1 h-px bg-ash/40", "aria-hidden": "true" }),
+      onJumpToLatest && /* @__PURE__ */ import_react62.default.createElement(
+        "button",
+        {
+          type: "button",
+          onClick: onJumpToLatest,
+          className: cx(
+            "shrink-0 transition-colors",
+            "text-silver/60 hover:text-white",
+            "underline decoration-silver/30 underline-offset-4 decoration-dotted hover:decoration-silver/70"
+          )
+        },
+        "Jump to latest \u2192"
+      )
+    );
+  }
+);
+GreyedDivider.displayName = "GreyedDivider";
+
 // src/components/chat/ChatView.tsx
-var ChatView = import_react61.default.forwardRef(
-  ({ messages, latestUserMessageIndex, isStreaming, isThinking, onScroll, className, ...rest }, ref) => {
+var ChatView = import_react63.default.forwardRef(
+  function ChatView2({ items, latestUserMessageIndex, isStreaming, isThinking, onScroll, className, ...rest }, ref) {
     const { containerRef, anchorRef, scrollToAnchor } = useScrollAnchor({
       behavior: "smooth",
       block: "start"
@@ -4442,19 +4610,23 @@ var ChatView = import_react61.default.forwardRef(
       containerRef,
       anchorRef
     });
-    (0, import_react61.useEffect)(() => {
+    const latestUserIdx = latestUserMessageIndex ?? items.reduceRight((found, item, idx) => {
+      if (found === -1 && item.kind === "message" && item.variant === "user") {
+        return idx;
+      }
+      return found;
+    }, -1);
+    (0, import_react63.useEffect)(() => {
       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;
+    const lastMessageIdx = items.reduceRight((found, item, idx) => {
+      return found === -1 && item.kind === "message" ? idx : found;
     }, -1);
-    const showThinking = isThinking && messages.length > 0 && messages[messages.length - 1]?.variant === "user";
-    return /* @__PURE__ */ import_react61.default.createElement(
+    const lastMessage = lastMessageIdx >= 0 ? items[lastMessageIdx] : null;
+    const showThinking = isThinking && lastMessage?.kind === "message" && lastMessage.variant === "user";
+    return /* @__PURE__ */ import_react63.default.createElement(
       "div",
       {
         ref: composeRefs(containerRef, ref),
@@ -4466,27 +4638,40 @@ var ChatView = import_react61.default.forwardRef(
         ),
         ...rest
       },
-      /* @__PURE__ */ import_react61.default.createElement("div", { ref: contentRef, className: "relative flex flex-col gap-3" }, messages.map(({
-        id,
-        variant,
-        className: messageClassName,
-        branchInfo,
-        actions,
-        isStreaming: nodeIsStreaming,
-        ...messageProps
-      }, index) => {
+      /* @__PURE__ */ import_react63.default.createElement("div", { ref: contentRef, className: "relative flex flex-col gap-3" }, items.map((item, index) => {
         const isAnchor = index === latestUserIdx;
-        const isLastMessage = index === messages.length - 1;
+        const wrapperRef = isAnchor ? anchorRef : void 0;
+        const wrapperClass = isAnchor ? "scroll-mt-4" : void 0;
+        if (item.kind === "divider") {
+          const { kind: _k2, id: id2, ...dividerProps } = item;
+          return /* @__PURE__ */ import_react63.default.createElement("div", { key: id2 }, /* @__PURE__ */ import_react63.default.createElement(GreyedDivider, { ...dividerProps }));
+        }
+        if (item.kind === "checkpoint") {
+          const { kind: _k2, id: id2, ...checkpointProps } = item;
+          return /* @__PURE__ */ import_react63.default.createElement("div", { key: id2, ref: wrapperRef, className: wrapperClass }, /* @__PURE__ */ import_react63.default.createElement(Checkpoint, { ...checkpointProps }));
+        }
+        const {
+          kind: _k,
+          id,
+          variant,
+          muted,
+          className: messageClassName,
+          branchInfo,
+          actions,
+          isStreaming: nodeIsStreaming,
+          ...messageProps
+        } = item;
+        const isLastMessage = index === lastMessageIdx;
         const showStreaming = isLastMessage && isStreaming && variant === "assistant";
         const isMessageStreaming = showStreaming || !!nodeIsStreaming;
-        return /* @__PURE__ */ import_react61.default.createElement(
+        return /* @__PURE__ */ import_react63.default.createElement(
           "div",
           {
-            key: id ?? `msg-${index}`,
-            ref: isAnchor ? anchorRef : void 0,
-            className: isAnchor ? "scroll-mt-4" : void 0
+            key: id,
+            ref: wrapperRef,
+            className: cx(wrapperClass, muted && "opacity-60")
           },
-          /* @__PURE__ */ import_react61.default.createElement(
+          /* @__PURE__ */ import_react63.default.createElement(
             Message,
             {
               variant,
@@ -4499,8 +4684,8 @@ var ChatView = import_react61.default.forwardRef(
             }
           )
         );
-      }), showThinking && /* @__PURE__ */ import_react61.default.createElement(ThinkingIndicator, { isVisible: true })),
-      /* @__PURE__ */ import_react61.default.createElement(
+      }), showThinking && /* @__PURE__ */ import_react63.default.createElement(ThinkingIndicator, { isVisible: true })),
+      /* @__PURE__ */ import_react63.default.createElement(
         "div",
         {
           ref: spacerRef,
@@ -4515,8 +4700,8 @@ var ChatView = import_react61.default.forwardRef(
 ChatView.displayName = "ChatView";
 
 // src/components/chat/ChatInput.tsx
-var import_react62 = __toESM(require("react"));
-var import_lucide_react12 = require("lucide-react");
+var import_react64 = __toESM(require("react"));
+var import_lucide_react14 = require("lucide-react");
 
 // src/components/chat/types.ts
 function isImageFile(file) {
@@ -4528,159 +4713,20 @@ function createPreviewUrl(file) {
   }
   return void 0;
 }
+function revokePreviewUrl(url) {
+  if (url) {
+    URL.revokeObjectURL(url);
+  }
+}
 function generateId() {
   if (typeof crypto !== "undefined" && typeof crypto.randomUUID === "function") {
     return crypto.randomUUID();
   }
   return `${Date.now()}-${Math.random().toString(36).slice(2, 11)}`;
 }
-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;
-  }
-  newNodes[message.id] = {
-    ...message,
-    parentId,
-    children: [],
-    branchIndex,
-    createdAt: message.createdAt ?? Date.now()
-  };
-  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;
-  let leafId = siblings[newIndex];
-  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 = import_react62.default.forwardRef(
+var ChatInput = import_react64.default.forwardRef(
   ({
     position = "bottom",
     placeholder = "Send a message...",
@@ -4702,13 +4748,13 @@ var ChatInput = import_react62.default.forwardRef(
     className,
     ...rest
   }, ref) => {
-    const [value, setValue] = (0, import_react62.useState)(initialInputValue);
-    const [localAttachments, setLocalAttachments] = (0, import_react62.useState)([]);
-    const [isDragOver, setIsDragOver] = (0, import_react62.useState)(false);
-    const textareaRef = (0, import_react62.useRef)(null);
-    const fileInputRef = (0, import_react62.useRef)(null);
+    const [value, setValue] = (0, import_react64.useState)(initialInputValue);
+    const [localAttachments, setLocalAttachments] = (0, import_react64.useState)([]);
+    const [isDragOver, setIsDragOver] = (0, import_react64.useState)(false);
+    const textareaRef = (0, import_react64.useRef)(null);
+    const fileInputRef = (0, import_react64.useRef)(null);
     const attachments = controlledAttachments ?? localAttachments;
-    const setAttachments = (0, import_react62.useCallback)(
+    const setAttachments = (0, import_react64.useCallback)(
       (newAttachments) => {
         if (onAttachmentsChange) {
           if (typeof newAttachments === "function") {
@@ -4722,7 +4768,7 @@ var ChatInput = import_react62.default.forwardRef(
       },
       [attachments, onAttachmentsChange]
     );
-    const handleSubmit = (0, import_react62.useCallback)(() => {
+    const handleSubmit = (0, import_react64.useCallback)(() => {
       const trimmed = value.trim();
       if (!trimmed || disabled || isStreaming) {
         return;
@@ -4734,7 +4780,7 @@ var ChatInput = import_react62.default.forwardRef(
         textareaRef.current.style.height = "auto";
       }
     }, [value, disabled, isStreaming, onSubmit, attachments, setAttachments]);
-    const handleKeyDown = (0, import_react62.useCallback)(
+    const handleKeyDown = (0, import_react64.useCallback)(
       (e) => {
         if (e.key === "Enter" && !e.shiftKey) {
           e.preventDefault();
@@ -4743,19 +4789,19 @@ var ChatInput = import_react62.default.forwardRef(
       },
       [handleSubmit]
     );
-    const handleChange = (0, import_react62.useCallback)((e) => {
+    const handleChange = (0, import_react64.useCallback)((e) => {
       setValue(e.target.value);
       onInputChange?.(e.target.value);
       const textarea = e.target;
       textarea.style.height = "auto";
       textarea.style.height = `${Math.min(textarea.scrollHeight, 200)}px`;
     }, [onInputChange]);
-    (0, import_react62.useEffect)(() => {
+    (0, import_react64.useEffect)(() => {
       if (autoFocus && !disabled && !isStreaming && textareaRef.current) {
         textareaRef.current.focus();
       }
     }, [disabled, isStreaming, autoFocus]);
-    const addFiles = (0, import_react62.useCallback)(
+    const addFiles = (0, import_react64.useCallback)(
       (files) => {
         const newAttachments = Array.from(files).map((file) => ({
           id: generateId(),
@@ -4767,7 +4813,7 @@ var ChatInput = import_react62.default.forwardRef(
       },
       [setAttachments]
     );
-    const handleFileSelect = (0, import_react62.useCallback)(
+    const handleFileSelect = (0, import_react64.useCallback)(
       (e) => {
         const files = e.target.files;
         if (files && files.length > 0) {
@@ -4777,7 +4823,7 @@ var ChatInput = import_react62.default.forwardRef(
       },
       [addFiles]
     );
-    const handleRemoveAttachment = (0, import_react62.useCallback)(
+    const handleRemoveAttachment = (0, import_react64.useCallback)(
       (id) => {
         const attachment = attachments.find((a) => a.id === id);
         if (attachment && onAttachmentRemove) {
@@ -4793,23 +4839,23 @@ var ChatInput = import_react62.default.forwardRef(
       },
       [attachments, onAttachmentRemove, setAttachments]
     );
-    const handleDragEnter = (0, import_react62.useCallback)((e) => {
+    const handleDragEnter = (0, import_react64.useCallback)((e) => {
       e.preventDefault();
       e.stopPropagation();
       setIsDragOver(true);
     }, []);
-    const handleDragLeave = (0, import_react62.useCallback)((e) => {
+    const handleDragLeave = (0, import_react64.useCallback)((e) => {
       e.preventDefault();
       e.stopPropagation();
       if (!e.currentTarget.contains(e.relatedTarget)) {
         setIsDragOver(false);
       }
     }, []);
-    const handleDragOver = (0, import_react62.useCallback)((e) => {
+    const handleDragOver = (0, import_react64.useCallback)((e) => {
       e.preventDefault();
       e.stopPropagation();
     }, []);
-    const handleDrop = (0, import_react62.useCallback)(
+    const handleDrop = (0, import_react64.useCallback)(
       (e) => {
         e.preventDefault();
         e.stopPropagation();
@@ -4825,7 +4871,7 @@ var ChatInput = import_react62.default.forwardRef(
     const hasAttachments = attachments.length > 0;
     const isUploading = attachments.some((a) => a.status === "uploading");
     const canSubmit = value.trim() && !disabled && !isStreaming && !isUploading;
-    return /* @__PURE__ */ import_react62.default.createElement(
+    return /* @__PURE__ */ import_react64.default.createElement(
       "div",
       {
         ref,
@@ -4837,12 +4883,12 @@ var ChatInput = import_react62.default.forwardRef(
         ),
         ...rest
       },
-      isCentered && helperText && /* @__PURE__ */ import_react62.default.createElement("p", { className: "text-silver text-sm mb-4 text-center" }, helperText),
-      notice && /* @__PURE__ */ import_react62.default.createElement("div", { className: cx(
+      isCentered && helperText && /* @__PURE__ */ import_react64.default.createElement("p", { className: "text-silver text-sm mb-4 text-center" }, helperText),
+      notice && /* @__PURE__ */ import_react64.default.createElement("div", { className: cx(
         "w-full flex items-start gap-2 px-3 py-2 mb-1 text-xs",
         isCentered && "max-w-lg",
         notice.variant === "warning" ? "bg-gold/5 border border-gold/20 text-gold/80" : "bg-error/10 border border-error/30 text-error"
-      ) }, /* @__PURE__ */ import_react62.default.createElement("span", { className: "flex-1" }, notice.content), (notice.dismissible ?? notice.variant === "warning") && notice.onDismiss && /* @__PURE__ */ import_react62.default.createElement(
+      ) }, /* @__PURE__ */ import_react64.default.createElement("span", { className: "flex-1" }, notice.content), (notice.dismissible ?? notice.variant === "warning") && notice.onDismiss && /* @__PURE__ */ import_react64.default.createElement(
         "button",
         {
           type: "button",
@@ -4853,9 +4899,9 @@ var ChatInput = import_react62.default.forwardRef(
             notice.variant === "warning" ? "text-gold" : "text-error"
           )
         },
-        /* @__PURE__ */ import_react62.default.createElement(import_lucide_react12.X, { className: "w-3 h-3" })
+        /* @__PURE__ */ import_react64.default.createElement(import_lucide_react14.X, { className: "w-3 h-3" })
       )),
-      /* @__PURE__ */ import_react62.default.createElement(
+      /* @__PURE__ */ import_react64.default.createElement(
         "div",
         {
           className: cx(
@@ -4870,7 +4916,7 @@ var ChatInput = import_react62.default.forwardRef(
           onDragOver: showAttachmentButton ? handleDragOver : void 0,
           onDrop: showAttachmentButton ? handleDrop : void 0
         },
-        hasAttachments && /* @__PURE__ */ import_react62.default.createElement("div", { className: "px-3 pt-3 pb-1" }, /* @__PURE__ */ import_react62.default.createElement(
+        hasAttachments && /* @__PURE__ */ import_react64.default.createElement("div", { className: "px-3 pt-3 pb-1" }, /* @__PURE__ */ import_react64.default.createElement(
           AttachmentPreview,
           {
             attachments,
@@ -4878,14 +4924,14 @@ var ChatInput = import_react62.default.forwardRef(
             removable: !isStreaming
           }
         )),
-        isDragOver && /* @__PURE__ */ import_react62.default.createElement(
+        isDragOver && /* @__PURE__ */ import_react64.default.createElement(
           "div",
           {
             className: "absolute inset-0 bg-gold/10 flex items-center justify-center z-10 pointer-events-none"
           },
-          /* @__PURE__ */ import_react62.default.createElement("span", { className: "text-gold text-sm font-medium" }, "Drop files here")
+          /* @__PURE__ */ import_react64.default.createElement("span", { className: "text-gold text-sm font-medium" }, "Drop files here")
         ),
-        /* @__PURE__ */ import_react62.default.createElement("div", { className: "flex items-end" }, showAttachmentButton && /* @__PURE__ */ import_react62.default.createElement(import_react62.default.Fragment, null, /* @__PURE__ */ import_react62.default.createElement(
+        /* @__PURE__ */ import_react64.default.createElement("div", { className: "flex items-end" }, showAttachmentButton && /* @__PURE__ */ import_react64.default.createElement(import_react64.default.Fragment, null, /* @__PURE__ */ import_react64.default.createElement(
           "button",
           {
             type: "button",
@@ -4897,8 +4943,8 @@ var ChatInput = import_react62.default.forwardRef(
             ),
             "aria-label": "Attach file"
           },
-          /* @__PURE__ */ import_react62.default.createElement(import_lucide_react12.Paperclip, { className: "w-5 h-5" })
-        ), /* @__PURE__ */ import_react62.default.createElement(
+          /* @__PURE__ */ import_react64.default.createElement(import_lucide_react14.Paperclip, { className: "w-5 h-5" })
+        ), /* @__PURE__ */ import_react64.default.createElement(
           "input",
           {
             ref: fileInputRef,
@@ -4909,7 +4955,7 @@ var ChatInput = import_react62.default.forwardRef(
             className: "hidden",
             "aria-hidden": "true"
           }
-        )), /* @__PURE__ */ import_react62.default.createElement(
+        )), /* @__PURE__ */ import_react64.default.createElement(
           "textarea",
           {
             ref: textareaRef,
@@ -4927,7 +4973,7 @@ var ChatInput = import_react62.default.forwardRef(
             ),
             style: { maxHeight: 200 }
           }
-        ), isStreaming ? /* @__PURE__ */ import_react62.default.createElement(
+        ), isStreaming ? /* @__PURE__ */ import_react64.default.createElement(
           "button",
           {
             type: "button",
@@ -4938,8 +4984,8 @@ var ChatInput = import_react62.default.forwardRef(
             ),
             "aria-label": "Stop generation"
           },
-          /* @__PURE__ */ import_react62.default.createElement(import_lucide_react12.Square, { className: "w-5 h-5 fill-current" })
-        ) : /* @__PURE__ */ import_react62.default.createElement(
+          /* @__PURE__ */ import_react64.default.createElement(import_lucide_react14.Square, { className: "w-5 h-5 fill-current" })
+        ) : /* @__PURE__ */ import_react64.default.createElement(
           "button",
           {
             type: "button",
@@ -4952,7 +4998,7 @@ var ChatInput = import_react62.default.forwardRef(
             ),
             "aria-label": "Send message"
           },
-          /* @__PURE__ */ import_react62.default.createElement(import_lucide_react12.Send, { className: "w-5 h-5" })
+          /* @__PURE__ */ import_react64.default.createElement(import_lucide_react14.Send, { className: "w-5 h-5" })
         ))
       )
     );
@@ -4961,14 +5007,14 @@ var ChatInput = import_react62.default.forwardRef(
 ChatInput.displayName = "ChatInput";
 
 // src/components/chat/ArtifactsPanel.tsx
-var import_react73 = __toESM(require("react"));
-var import_lucide_react15 = require("lucide-react");
+var import_react75 = __toESM(require("react"));
+var import_lucide_react17 = require("lucide-react");
 
 // src/components/ArtifactCard.tsx
-var import_react69 = __toESM(require("react"));
+var import_react71 = __toESM(require("react"));
 
 // src/components/ImageCard.tsx
-var import_react63 = __toESM(require("react"));
+var import_react65 = __toESM(require("react"));
 var ASPECT_RATIO_PRESETS = {
   landscape: "3 / 2",
   portrait: "2 / 3",
@@ -4980,7 +5026,7 @@ function resolveAspectRatio(ratio) {
   }
   return ratio.replace("/", " / ");
 }
-var ImageCard = import_react63.default.forwardRef(
+var ImageCard = import_react65.default.forwardRef(
   ({
     src,
     alt = "",
@@ -4996,7 +5042,7 @@ var ImageCard = import_react63.default.forwardRef(
     loading,
     ...props
   }, ref) => {
-    return /* @__PURE__ */ import_react63.default.createElement(
+    return /* @__PURE__ */ import_react65.default.createElement(
       Card,
       {
         ref,
@@ -5004,13 +5050,13 @@ var ImageCard = import_react63.default.forwardRef(
         loading,
         ...props
       },
-      /* @__PURE__ */ import_react63.default.createElement(
+      /* @__PURE__ */ import_react65.default.createElement(
         Card.Media,
         {
           className: mediaClassName,
           style: { aspectRatio: resolveAspectRatio(aspectRatio) }
         },
-        /* @__PURE__ */ import_react63.default.createElement(import_react63.default.Fragment, null, src && /* @__PURE__ */ import_react63.default.createElement(
+        /* @__PURE__ */ import_react65.default.createElement(import_react65.default.Fragment, null, src && /* @__PURE__ */ import_react65.default.createElement(
           "img",
           {
             src,
@@ -5020,7 +5066,7 @@ var ImageCard = import_react63.default.forwardRef(
               objectFit === "cover" ? "object-cover" : "object-contain"
             )
           }
-        ), overlay && /* @__PURE__ */ import_react63.default.createElement(
+        ), overlay && /* @__PURE__ */ import_react65.default.createElement(
           "div",
           {
             className: "absolute inset-0 bg-obsidian/80 opacity-0 group-hover:opacity-100 transition-opacity duration-200 flex items-center justify-center"
@@ -5028,7 +5074,7 @@ var ImageCard = import_react63.default.forwardRef(
           overlay
         ))
       ),
-      /* @__PURE__ */ import_react63.default.createElement(
+      /* @__PURE__ */ import_react65.default.createElement(
         Card.Header,
         {
           title,
@@ -5036,14 +5082,14 @@ var ImageCard = import_react63.default.forwardRef(
           className: contentClassName
         }
       ),
-      children && /* @__PURE__ */ import_react63.default.createElement(Card.Body, { className: contentClassName }, children)
+      children && /* @__PURE__ */ import_react65.default.createElement(Card.Body, { className: contentClassName }, children)
     );
   }
 );
 ImageCard.displayName = "ImageCard";
 
 // src/components/VideoCard.tsx
-var import_react64 = __toESM(require("react"));
+var import_react66 = __toESM(require("react"));
 var import_react_player = __toESM(require("react-player"));
 var ASPECT_RATIO_PRESETS2 = {
   video: "16 / 9",
@@ -5056,7 +5102,7 @@ function resolveAspectRatio2(ratio) {
   }
   return ratio.replace("/", " / ");
 }
-var VideoCard = import_react64.default.forwardRef(
+var VideoCard = import_react66.default.forwardRef(
   ({
     src,
     title,
@@ -5076,7 +5122,7 @@ var VideoCard = import_react64.default.forwardRef(
     loading,
     ...props
   }, ref) => {
-    return /* @__PURE__ */ import_react64.default.createElement(
+    return /* @__PURE__ */ import_react66.default.createElement(
       Card,
       {
         ref,
@@ -5084,13 +5130,13 @@ var VideoCard = import_react64.default.forwardRef(
         loading,
         ...props
       },
-      /* @__PURE__ */ import_react64.default.createElement(
+      /* @__PURE__ */ import_react66.default.createElement(
         Card.Media,
         {
           className: mediaClassName,
           style: { aspectRatio: resolveAspectRatio2(aspectRatio) }
         },
-        src && /* @__PURE__ */ import_react64.default.createElement(
+        src && /* @__PURE__ */ import_react66.default.createElement(
           import_react_player.default,
           {
             src,
@@ -5107,7 +5153,7 @@ var VideoCard = import_react64.default.forwardRef(
           }
         )
       ),
-      /* @__PURE__ */ import_react64.default.createElement(
+      /* @__PURE__ */ import_react66.default.createElement(
         Card.Header,
         {
           title,
@@ -5115,17 +5161,17 @@ var VideoCard = import_react64.default.forwardRef(
           className: contentClassName
         }
       ),
-      children && /* @__PURE__ */ import_react64.default.createElement(Card.Body, { className: contentClassName }, children)
+      children && /* @__PURE__ */ import_react66.default.createElement(Card.Body, { className: contentClassName }, children)
     );
   }
 );
 VideoCard.displayName = "VideoCard";
 
 // src/components/AudioCard.tsx
-var import_react65 = __toESM(require("react"));
+var import_react67 = __toESM(require("react"));
 var import_react_player2 = __toESM(require("react-player"));
-var import_lucide_react13 = require("lucide-react");
-var AudioCard = import_react65.default.forwardRef(
+var import_lucide_react15 = require("lucide-react");
+var AudioCard = import_react67.default.forwardRef(
   ({
     src,
     title,
@@ -5144,7 +5190,7 @@ var AudioCard = import_react65.default.forwardRef(
     loading,
     ...props
   }, ref) => {
-    return /* @__PURE__ */ import_react65.default.createElement(
+    return /* @__PURE__ */ import_react67.default.createElement(
       Card,
       {
         ref,
@@ -5152,10 +5198,10 @@ var AudioCard = import_react65.default.forwardRef(
         loading,
         ...props
       },
-      /* @__PURE__ */ import_react65.default.createElement(Card.Media, { className: cx(
+      /* @__PURE__ */ import_react67.default.createElement(Card.Media, { className: cx(
         "bg-obsidian py-8 flex flex-col items-center justify-center",
         mediaClassName
-      ) }, /* @__PURE__ */ import_react65.default.createElement("div", { className: "mb-4 text-gold" }, /* @__PURE__ */ import_react65.default.createElement(import_lucide_react13.Music, { size: 48 })), src && /* @__PURE__ */ import_react65.default.createElement("div", { className: "w-full px-4" }, /* @__PURE__ */ import_react65.default.createElement(
+      ) }, /* @__PURE__ */ import_react67.default.createElement("div", { className: "mb-4 text-gold" }, /* @__PURE__ */ import_react67.default.createElement(import_lucide_react15.Music, { size: 48 })), src && /* @__PURE__ */ import_react67.default.createElement("div", { className: "w-full px-4" }, /* @__PURE__ */ import_react67.default.createElement(
         import_react_player2.default,
         {
           src,
@@ -5170,7 +5216,7 @@ var AudioCard = import_react65.default.forwardRef(
           ...playerProps
         }
       ))),
-      /* @__PURE__ */ import_react65.default.createElement(
+      /* @__PURE__ */ import_react67.default.createElement(
         Card.Header,
         {
           title,
@@ -5178,16 +5224,16 @@ var AudioCard = import_react65.default.forwardRef(
           className: contentClassName
         }
       ),
-      children && /* @__PURE__ */ import_react65.default.createElement(Card.Body, { className: contentClassName }, children)
+      children && /* @__PURE__ */ import_react67.default.createElement(Card.Body, { className: contentClassName }, children)
     );
   }
 );
 AudioCard.displayName = "AudioCard";
 
 // src/components/PdfCard.tsx
-var import_react66 = __toESM(require("react"));
-var import_lucide_react14 = require("lucide-react");
-var PdfCard = import_react66.default.forwardRef(
+var import_react68 = __toESM(require("react"));
+var import_lucide_react16 = require("lucide-react");
+var PdfCard = import_react68.default.forwardRef(
   ({
     src,
     title,
@@ -5200,7 +5246,7 @@ var PdfCard = import_react66.default.forwardRef(
     loading,
     ...props
   }, ref) => {
-    return /* @__PURE__ */ import_react66.default.createElement(
+    return /* @__PURE__ */ import_react68.default.createElement(
       Card,
       {
         ref,
@@ -5208,13 +5254,13 @@ var PdfCard = import_react66.default.forwardRef(
         loading,
         ...props
       },
-      /* @__PURE__ */ import_react66.default.createElement(
+      /* @__PURE__ */ import_react68.default.createElement(
         Card.Media,
         {
           className: cx("bg-obsidian", mediaClassName),
           style: { height }
         },
-        src && /* @__PURE__ */ import_react66.default.createElement(
+        src && /* @__PURE__ */ import_react68.default.createElement(
           "iframe",
           {
             src: `${src}#view=FitH`,
@@ -5223,23 +5269,23 @@ var PdfCard = import_react66.default.forwardRef(
           }
         )
       ),
-      /* @__PURE__ */ import_react66.default.createElement(
+      /* @__PURE__ */ import_react68.default.createElement(
         Card.Header,
         {
           title,
           subtitle,
           className: contentClassName,
-          action: /* @__PURE__ */ import_react66.default.createElement("div", { className: "p-2 bg-ash/20 text-gold shrink-0" }, /* @__PURE__ */ import_react66.default.createElement(import_lucide_react14.FileText, { size: 20 }))
+          action: /* @__PURE__ */ import_react68.default.createElement("div", { className: "p-2 bg-ash/20 text-gold shrink-0" }, /* @__PURE__ */ import_react68.default.createElement(import_lucide_react16.FileText, { size: 20 }))
         }
       ),
-      children && /* @__PURE__ */ import_react66.default.createElement(Card.Body, { className: contentClassName }, children)
+      children && /* @__PURE__ */ import_react68.default.createElement(Card.Body, { className: contentClassName }, children)
     );
   }
 );
 PdfCard.displayName = "PdfCard";
 
 // src/components/ScriptCard.tsx
-var import_react67 = __toESM(require("react"));
+var import_react69 = __toESM(require("react"));
 var SCRIPT_ELEMENT_TYPES = {
   SCENE_HEADING: "scene-heading",
   ACTION: "action",
@@ -5253,28 +5299,28 @@ var SCRIPT_ELEMENT_TYPES = {
 function ScriptElementRenderer({ element }) {
   switch (element.type) {
     case "scene-heading":
-      return /* @__PURE__ */ import_react67.default.createElement("p", { className: "mt-4 mb-2 font-bold uppercase text-gold text-xs tracking-wide" }, element.content);
+      return /* @__PURE__ */ import_react69.default.createElement("p", { className: "mt-4 mb-2 font-bold uppercase text-gold text-xs tracking-wide" }, element.content);
     case "action":
-      return /* @__PURE__ */ import_react67.default.createElement("p", { className: "my-2 text-silver text-xs leading-relaxed" }, element.content);
+      return /* @__PURE__ */ import_react69.default.createElement("p", { className: "my-2 text-silver text-xs leading-relaxed" }, element.content);
     case "character":
-      return /* @__PURE__ */ import_react67.default.createElement("p", { className: "mt-4 mb-0.5 ml-8 font-bold text-white text-xs uppercase tracking-wide" }, element.content);
+      return /* @__PURE__ */ import_react69.default.createElement("p", { className: "mt-4 mb-0.5 ml-8 font-bold text-white text-xs uppercase tracking-wide" }, element.content);
     case "parenthetical":
-      return /* @__PURE__ */ import_react67.default.createElement("p", { className: "ml-6 text-silver/70 text-xs italic" }, "(", element.content, ")");
+      return /* @__PURE__ */ import_react69.default.createElement("p", { className: "ml-6 text-silver/70 text-xs italic" }, "(", element.content, ")");
     case "dialogue":
-      return /* @__PURE__ */ import_react67.default.createElement("p", { className: "ml-4 mr-8 text-silver text-xs leading-relaxed" }, element.content);
+      return /* @__PURE__ */ import_react69.default.createElement("p", { className: "ml-4 mr-8 text-silver text-xs leading-relaxed" }, element.content);
     case "transition":
-      return /* @__PURE__ */ import_react67.default.createElement("p", { className: "mt-4 mb-2 text-right font-bold uppercase text-gold/80 text-xs tracking-wide" }, element.content);
+      return /* @__PURE__ */ import_react69.default.createElement("p", { className: "mt-4 mb-2 text-right font-bold uppercase text-gold/80 text-xs tracking-wide" }, element.content);
     case "title":
-      return /* @__PURE__ */ import_react67.default.createElement("p", { className: "mt-6 mb-2 text-center font-bold text-gold text-sm" }, element.content);
+      return /* @__PURE__ */ import_react69.default.createElement("p", { className: "mt-6 mb-2 text-center font-bold text-gold text-sm" }, element.content);
     case "subtitle":
-      return /* @__PURE__ */ import_react67.default.createElement("p", { className: "text-center italic text-gold/70 text-xs" }, element.content);
+      return /* @__PURE__ */ import_react69.default.createElement("p", { className: "text-center italic text-gold/70 text-xs" }, element.content);
     default:
       return null;
   }
 }
-var ScriptCard = import_react67.default.forwardRef(
+var ScriptCard = import_react69.default.forwardRef(
   ({ title, subtitle, elements, maxHeight = "16rem", className, style, loading, ...rest }, ref) => {
-    return /* @__PURE__ */ import_react67.default.createElement(
+    return /* @__PURE__ */ import_react69.default.createElement(
       Card,
       {
         ref,
@@ -5282,20 +5328,20 @@ var ScriptCard = import_react67.default.forwardRef(
         loading,
         ...rest
       },
-      /* @__PURE__ */ import_react67.default.createElement(
+      /* @__PURE__ */ import_react69.default.createElement(
         Card.Header,
         {
           title,
           subtitle
         }
       ),
-      /* @__PURE__ */ import_react67.default.createElement(
+      /* @__PURE__ */ import_react69.default.createElement(
         Card.Body,
         {
           className: "font-mono overflow-y-auto",
           style: { maxHeight, ...style }
         },
-        elements.map((element, index) => /* @__PURE__ */ import_react67.default.createElement(ScriptElementRenderer, { key: index, element }))
+        elements.map((element, index) => /* @__PURE__ */ import_react69.default.createElement(ScriptElementRenderer, { key: index, element }))
       )
     );
   }
@@ -5303,8 +5349,8 @@ var ScriptCard = import_react67.default.forwardRef(
 ScriptCard.displayName = "ScriptCard";
 
 // src/components/TextCard.tsx
-var import_react68 = __toESM(require("react"));
-var TextCard = import_react68.default.forwardRef(
+var import_react70 = __toESM(require("react"));
+var TextCard = import_react70.default.forwardRef(
   ({
     content,
     title,
@@ -5316,7 +5362,7 @@ var TextCard = import_react68.default.forwardRef(
     loading,
     ...props
   }, ref) => {
-    return /* @__PURE__ */ import_react68.default.createElement(
+    return /* @__PURE__ */ import_react70.default.createElement(
       Card,
       {
         ref,
@@ -5324,20 +5370,20 @@ var TextCard = import_react68.default.forwardRef(
         loading,
         ...props
       },
-      /* @__PURE__ */ import_react68.default.createElement(
+      /* @__PURE__ */ import_react70.default.createElement(
         Card.Header,
         {
           title,
           subtitle
         }
       ),
-      /* @__PURE__ */ import_react68.default.createElement(
+      /* @__PURE__ */ import_react70.default.createElement(
         Card.Body,
         {
           className: cx("overflow-y-auto", contentClassName),
           style: { maxHeight }
         },
-        /* @__PURE__ */ import_react68.default.createElement(
+        /* @__PURE__ */ import_react70.default.createElement(
           MarkdownContent,
           {
             content,
@@ -5375,7 +5421,7 @@ var ARTIFACT_TYPES = {
   SCRIPT: "SCRIPT",
   PDF: "PDF"
 };
-var ArtifactCard = import_react69.default.forwardRef(
+var ArtifactCard = import_react71.default.forwardRef(
   ({ artifact, onExpand, loading, className, ...props }, ref) => {
     const derivedLoading = deriveCardSlotLoading(artifact);
     const commonProps = {
@@ -5393,7 +5439,7 @@ var ArtifactCard = import_react69.default.forwardRef(
     const renderContent = () => {
       switch (artifact.type) {
         case "IMAGE":
-          return /* @__PURE__ */ import_react69.default.createElement(
+          return /* @__PURE__ */ import_react71.default.createElement(
             ImageCard,
             {
               ...commonProps,
@@ -5403,7 +5449,7 @@ var ArtifactCard = import_react69.default.forwardRef(
             }
           );
         case "VIDEO":
-          return /* @__PURE__ */ import_react69.default.createElement(
+          return /* @__PURE__ */ import_react71.default.createElement(
             VideoCard,
             {
               ...commonProps,
@@ -5413,7 +5459,7 @@ var ArtifactCard = import_react69.default.forwardRef(
             }
           );
         case "AUDIO":
-          return /* @__PURE__ */ import_react69.default.createElement(
+          return /* @__PURE__ */ import_react71.default.createElement(
             AudioCard,
             {
               ...commonProps,
@@ -5422,7 +5468,7 @@ var ArtifactCard = import_react69.default.forwardRef(
             }
           );
         case "PDF":
-          return /* @__PURE__ */ import_react69.default.createElement(
+          return /* @__PURE__ */ import_react71.default.createElement(
             PdfCard,
             {
               ...commonProps,
@@ -5430,7 +5476,7 @@ var ArtifactCard = import_react69.default.forwardRef(
             }
           );
         case "SCRIPT":
-          return /* @__PURE__ */ import_react69.default.createElement(
+          return /* @__PURE__ */ import_react71.default.createElement(
             ScriptCard,
             {
               ...commonProps,
@@ -5439,7 +5485,7 @@ var ArtifactCard = import_react69.default.forwardRef(
             }
           );
         case "TEXT":
-          return /* @__PURE__ */ import_react69.default.createElement(
+          return /* @__PURE__ */ import_react71.default.createElement(
             TextCard,
             {
               ...commonProps,
@@ -5457,7 +5503,7 @@ var ArtifactCard = import_react69.default.forwardRef(
       }
     };
     const isCardExpandable = !!onExpand && (artifact.type === "IMAGE" || artifact.type === "PDF" || artifact.type === "SCRIPT" || artifact.type === "TEXT");
-    return /* @__PURE__ */ import_react69.default.createElement(
+    return /* @__PURE__ */ import_react71.default.createElement(
       "div",
       {
         ref,
@@ -5470,7 +5516,7 @@ var ArtifactCard = import_react69.default.forwardRef(
         onClick: isCardExpandable ? handleExpand : void 0,
         ...props
       },
-      onExpand && /* @__PURE__ */ import_react69.default.createElement(
+      onExpand && /* @__PURE__ */ import_react71.default.createElement(
         "button",
         {
           onClick: handleExpand,
@@ -5481,7 +5527,7 @@ var ArtifactCard = import_react69.default.forwardRef(
           ),
           "aria-label": "Expand artifact"
         },
-        /* @__PURE__ */ import_react69.default.createElement(ExpandIcon, { className: "w-4 h-4" })
+        /* @__PURE__ */ import_react71.default.createElement(ExpandIcon, { className: "w-4 h-4" })
       ),
       renderContent()
     );
@@ -5490,17 +5536,17 @@ var ArtifactCard = import_react69.default.forwardRef(
 ArtifactCard.displayName = "ArtifactCard";
 
 // src/components/ArtifactGroup.tsx
-var import_react70 = __toESM(require("react"));
+var import_react72 = __toESM(require("react"));
 var LAYER_OFFSET = "8px";
 var LAYER_OFFSET_2X = "16px";
-var ArtifactGroup = import_react70.default.forwardRef(
+var ArtifactGroup = import_react72.default.forwardRef(
   ({ node, onClick, className, ...props }, ref) => {
     const children = node.children;
     const count = children.length;
     const frontChild = children[0];
-    const prevCountRef = (0, import_react70.useRef)(count);
-    const [badgePing, setBadgePing] = (0, import_react70.useState)(false);
-    (0, import_react70.useEffect)(() => {
+    const prevCountRef = (0, import_react72.useRef)(count);
+    const [badgePing, setBadgePing] = (0, import_react72.useState)(false);
+    (0, import_react72.useEffect)(() => {
       if (count !== prevCountRef.current) {
         prevCountRef.current = count;
         setBadgePing(true);
@@ -5515,21 +5561,21 @@ var ArtifactGroup = import_react70.default.forwardRef(
     };
     const renderFrontContent = () => {
       if (!frontChild) {
-        return /* @__PURE__ */ import_react70.default.createElement("div", { className: "w-full aspect-video bg-graphite border border-ash/40 flex items-center justify-center" }, /* @__PURE__ */ import_react70.default.createElement("span", { className: "text-silver text-sm" }, "Empty group"));
+        return /* @__PURE__ */ import_react72.default.createElement("div", { className: "w-full aspect-video bg-graphite border border-ash/40 flex items-center justify-center" }, /* @__PURE__ */ import_react72.default.createElement("span", { className: "text-silver text-sm" }, "Empty group"));
       }
       if (frontChild.type === "ARTIFACT" && frontChild.artifact) {
-        return /* @__PURE__ */ import_react70.default.createElement(ArtifactCard, { artifact: frontChild.artifact, className: "w-full" });
+        return /* @__PURE__ */ import_react72.default.createElement(ArtifactCard, { artifact: frontChild.artifact, className: "w-full" });
       }
-      return /* @__PURE__ */ import_react70.default.createElement(
+      return /* @__PURE__ */ import_react72.default.createElement(
         "div",
         {
           className: "w-full aspect-video bg-graphite border border-gold/30 flex flex-col items-center justify-center gap-2 p-4"
         },
-        /* @__PURE__ */ import_react70.default.createElement("span", { className: "text-sm text-silver uppercase tracking-wider" }, frontChild.type === "GROUP" ? "Group" : "Variants"),
-        /* @__PURE__ */ import_react70.default.createElement("span", { className: "text-white font-semibold" }, frontChild.label)
+        /* @__PURE__ */ import_react72.default.createElement("span", { className: "text-sm text-silver uppercase tracking-wider" }, frontChild.type === "GROUP" ? "Group" : "Variants"),
+        /* @__PURE__ */ import_react72.default.createElement("span", { className: "text-white font-semibold" }, frontChild.label)
       );
     };
-    return /* @__PURE__ */ import_react70.default.createElement(
+    return /* @__PURE__ */ import_react72.default.createElement(
       "div",
       {
         ref,
@@ -5549,21 +5595,21 @@ var ArtifactGroup = import_react70.default.forwardRef(
         "aria-label": `${node.label} \u2014 ${count} items`,
         ...props
       },
-      /* @__PURE__ */ import_react70.default.createElement(Card, { noPadding: true, className: "p-5" }, /* @__PURE__ */ import_react70.default.createElement("h3", { className: "text-lg font-semibold text-white m-0 mb-4" }, node.label), /* @__PURE__ */ import_react70.default.createElement("div", { style: { paddingRight: LAYER_OFFSET_2X, paddingBottom: LAYER_OFFSET_2X } }, /* @__PURE__ */ import_react70.default.createElement("div", { className: "relative" }, /* @__PURE__ */ import_react70.default.createElement(
+      /* @__PURE__ */ import_react72.default.createElement(Card, { noPadding: true, className: "p-5" }, /* @__PURE__ */ import_react72.default.createElement("h3", { className: "text-lg font-semibold text-white m-0 mb-4" }, node.label), /* @__PURE__ */ import_react72.default.createElement("div", { style: { paddingRight: LAYER_OFFSET_2X, paddingBottom: LAYER_OFFSET_2X } }, /* @__PURE__ */ import_react72.default.createElement("div", { className: "relative" }, /* @__PURE__ */ import_react72.default.createElement(
         "div",
         {
           className: "absolute inset-0 bg-charcoal border border-ash/30 pointer-events-none",
           style: { transform: `translate(${LAYER_OFFSET_2X}, ${LAYER_OFFSET_2X})` },
           "aria-hidden": "true"
         }
-      ), /* @__PURE__ */ import_react70.default.createElement(
+      ), /* @__PURE__ */ import_react72.default.createElement(
         "div",
         {
           className: "absolute inset-0 bg-charcoal border border-ash/40 pointer-events-none",
           style: { transform: `translate(${LAYER_OFFSET}, ${LAYER_OFFSET})` },
           "aria-hidden": "true"
         }
-      ), /* @__PURE__ */ import_react70.default.createElement("div", { className: "relative transition-transform duration-200 group-hover:-translate-y-0.5" }, renderFrontContent()), /* @__PURE__ */ import_react70.default.createElement(
+      ), /* @__PURE__ */ import_react72.default.createElement("div", { className: "relative transition-transform duration-200 group-hover:-translate-y-0.5" }, renderFrontContent()), /* @__PURE__ */ import_react72.default.createElement(
         "div",
         {
           className: "absolute -top-2 -right-2 z-10 min-w-6 h-6 px-1.5 flex items-center justify-center bg-gold text-obsidian text-xs font-bold",
@@ -5577,13 +5623,13 @@ var ArtifactGroup = import_react70.default.forwardRef(
 ArtifactGroup.displayName = "ArtifactGroup";
 
 // src/components/ArtifactVariantStack.tsx
-var import_react71 = __toESM(require("react"));
-var ArtifactVariantStack = import_react71.default.forwardRef(
+var import_react73 = __toESM(require("react"));
+var ArtifactVariantStack = import_react73.default.forwardRef(
   ({ node, onExpandArtifact, onGroupClick, className, ...props }, ref) => {
     const children = node.children;
     const renderChild = (child) => {
       if (child.type === "ARTIFACT" && child.artifact) {
-        return /* @__PURE__ */ import_react71.default.createElement("div", { key: child.id, className: "flex-1 min-w-0" }, /* @__PURE__ */ import_react71.default.createElement(
+        return /* @__PURE__ */ import_react73.default.createElement("div", { key: child.id, className: "flex-1 min-w-0" }, /* @__PURE__ */ import_react73.default.createElement(
           ArtifactCard,
           {
             artifact: child.artifact,
@@ -5593,18 +5639,18 @@ var ArtifactVariantStack = import_react71.default.forwardRef(
         ));
       }
       if (child.type === "GROUP") {
-        return /* @__PURE__ */ import_react71.default.createElement("div", { key: child.id, className: "flex-1 min-w-0" }, /* @__PURE__ */ import_react71.default.createElement(ArtifactGroup, { node: child, onClick: onGroupClick }));
+        return /* @__PURE__ */ import_react73.default.createElement("div", { key: child.id, className: "flex-1 min-w-0" }, /* @__PURE__ */ import_react73.default.createElement(ArtifactGroup, { node: child, onClick: onGroupClick }));
       }
-      return /* @__PURE__ */ import_react71.default.createElement("div", { key: child.id, className: "flex-1 min-w-0" }, /* @__PURE__ */ import_react71.default.createElement(
+      return /* @__PURE__ */ import_react73.default.createElement("div", { key: child.id, className: "flex-1 min-w-0" }, /* @__PURE__ */ import_react73.default.createElement(
         "div",
         {
           className: "aspect-video bg-graphite border border-gold/30 flex flex-col items-center justify-center gap-2 p-4"
         },
-        /* @__PURE__ */ import_react71.default.createElement("span", { className: "text-xs text-silver uppercase tracking-wider" }, "Variants"),
-        /* @__PURE__ */ import_react71.default.createElement("span", { className: "text-sm text-white font-semibold truncate max-w-full" }, child.label)
+        /* @__PURE__ */ import_react73.default.createElement("span", { className: "text-xs text-silver uppercase tracking-wider" }, "Variants"),
+        /* @__PURE__ */ import_react73.default.createElement("span", { className: "text-sm text-white font-semibold truncate max-w-full" }, child.label)
       ));
     };
-    return /* @__PURE__ */ import_react71.default.createElement(
+    return /* @__PURE__ */ import_react73.default.createElement(
       Card,
       {
         ref,
@@ -5612,22 +5658,22 @@ var ArtifactVariantStack = import_react71.default.forwardRef(
         className: cx("w-full p-5", className),
         ...props
       },
-      /* @__PURE__ */ import_react71.default.createElement("h3", { className: "text-lg font-semibold text-white m-0 mb-4" }, node.label),
-      /* @__PURE__ */ import_react71.default.createElement("div", { className: "flex gap-3" }, children.map(renderChild))
+      /* @__PURE__ */ import_react73.default.createElement("h3", { className: "text-lg font-semibold text-white m-0 mb-4" }, node.label),
+      /* @__PURE__ */ import_react73.default.createElement("div", { className: "flex gap-3" }, children.map(renderChild))
     );
   }
 );
 ArtifactVariantStack.displayName = "ArtifactVariantStack";
 
 // src/components/chat/hooks/useArtifactTreeNavigation.ts
-var import_react72 = require("react");
+var import_react74 = require("react");
 function useArtifactTreeNavigation(rootNodes) {
-  const [stack, setStack] = (0, import_react72.useState)([]);
-  const currentNodes = (0, import_react72.useMemo)(() => {
+  const [stack, setStack] = (0, import_react74.useState)([]);
+  const currentNodes = (0, import_react74.useMemo)(() => {
     if (stack.length === 0) return rootNodes;
     return stack[stack.length - 1].children;
   }, [rootNodes, stack]);
-  const breadcrumbs = (0, import_react72.useMemo)(() => {
+  const breadcrumbs = (0, import_react74.useMemo)(() => {
     const entries = [{ label: "Project", node: null }];
     for (const node of stack) {
       entries.push({ label: node.label, node });
@@ -5635,13 +5681,13 @@ function useArtifactTreeNavigation(rootNodes) {
     return entries;
   }, [stack]);
   const isAtRoot = stack.length === 0;
-  const navigateInto = (0, import_react72.useCallback)((node) => {
+  const navigateInto = (0, import_react74.useCallback)((node) => {
     setStack((prev) => [...prev, node]);
   }, []);
-  const navigateTo = (0, import_react72.useCallback)((index) => {
+  const navigateTo = (0, import_react74.useCallback)((index) => {
     setStack((prev) => prev.slice(0, index));
   }, []);
-  const navigateBack = (0, import_react72.useCallback)(() => {
+  const navigateBack = (0, import_react74.useCallback)(() => {
     setStack((prev) => prev.slice(0, -1));
   }, []);
   return {
@@ -5661,46 +5707,46 @@ function ArtifactModal({
   onClose
 }) {
   useEscapeKey(onClose);
-  const handleBackdropClick = (0, import_react73.useCallback)((e) => {
+  const handleBackdropClick = (0, import_react75.useCallback)((e) => {
     if (e.target === e.currentTarget) {
       onClose();
     }
   }, [onClose]);
-  return /* @__PURE__ */ import_react73.default.createElement(
+  return /* @__PURE__ */ import_react75.default.createElement(
     "div",
     {
       className: "fixed inset-0 z-50 flex items-center justify-center bg-void/90 backdrop-blur-sm animate-fade-in",
       onClick: handleBackdropClick
     },
-    /* @__PURE__ */ import_react73.default.createElement(
+    /* @__PURE__ */ import_react75.default.createElement(
       "div",
       {
         className: "relative w-11/12 h-5/6 max-w-6xl bg-charcoal border border-ash/40 flex flex-col overflow-hidden"
       },
-      /* @__PURE__ */ import_react73.default.createElement(
+      /* @__PURE__ */ import_react75.default.createElement(
         "div",
         {
           className: "flex items-center justify-between p-4 border-b border-ash/40 shrink-0"
         },
-        /* @__PURE__ */ import_react73.default.createElement("div", null, artifact.title && /* @__PURE__ */ import_react73.default.createElement("h3", { className: "text-sm font-semibold text-white" }, artifact.title), artifact.subtitle && /* @__PURE__ */ import_react73.default.createElement("p", { className: "text-xs text-silver" }, artifact.subtitle)),
-        /* @__PURE__ */ import_react73.default.createElement(
+        /* @__PURE__ */ import_react75.default.createElement("div", null, artifact.title && /* @__PURE__ */ import_react75.default.createElement("h3", { className: "text-sm font-semibold text-white" }, artifact.title), artifact.subtitle && /* @__PURE__ */ import_react75.default.createElement("p", { className: "text-xs text-silver" }, artifact.subtitle)),
+        /* @__PURE__ */ import_react75.default.createElement(
           "button",
           {
             onClick: onClose,
             className: "p-2 text-silver hover:text-white hover:bg-ash/20 transition-colors",
             "aria-label": "Close modal"
           },
-          /* @__PURE__ */ import_react73.default.createElement(CloseIcon, { className: "w-5 h-5" })
+          /* @__PURE__ */ import_react75.default.createElement(CloseIcon, { className: "w-5 h-5" })
         )
       ),
-      /* @__PURE__ */ import_react73.default.createElement("div", { className: "flex-1 overflow-auto p-4" }, artifact.type === "IMAGE" && /* @__PURE__ */ import_react73.default.createElement(
+      /* @__PURE__ */ import_react75.default.createElement("div", { className: "flex-1 overflow-auto p-4" }, artifact.type === "IMAGE" && /* @__PURE__ */ import_react75.default.createElement(
         "img",
         {
           src: artifact.url,
           alt: artifact.alt || "Artifact image",
           className: "max-w-full max-h-full object-contain mx-auto"
         }
-      ), artifact.type === "VIDEO" && /* @__PURE__ */ import_react73.default.createElement(
+      ), artifact.type === "VIDEO" && /* @__PURE__ */ import_react75.default.createElement(
         VideoCard,
         {
           src: artifact.url || "",
@@ -5708,20 +5754,20 @@ function ArtifactModal({
           controls: true,
           className: "max-w-full max-h-full mx-auto"
         }
-      ), artifact.type === "AUDIO" && /* @__PURE__ */ import_react73.default.createElement(
+      ), artifact.type === "AUDIO" && /* @__PURE__ */ import_react75.default.createElement(
         AudioCard,
         {
           src: artifact.url || "",
           controls: true,
           className: "max-w-xl mx-auto"
         }
-      ), artifact.type === "PDF" && /* @__PURE__ */ import_react73.default.createElement(
+      ), artifact.type === "PDF" && /* @__PURE__ */ import_react75.default.createElement(
         PdfCard,
         {
           src: artifact.url || "",
           className: "h-full border-0"
         }
-      ), artifact.type === "TEXT" && /* @__PURE__ */ import_react73.default.createElement(
+      ), artifact.type === "TEXT" && /* @__PURE__ */ import_react75.default.createElement(
         MarkdownContent,
         {
           content: artifact.inlineContent || "",
@@ -5731,7 +5777,7 @@ function ArtifactModal({
             artifact.mimeType === "text/plain" && "whitespace-pre-wrap"
           )
         }
-      ), artifact.type === "SCRIPT" && artifact.scriptElements && /* @__PURE__ */ import_react73.default.createElement(
+      ), artifact.type === "SCRIPT" && artifact.scriptElements && /* @__PURE__ */ import_react75.default.createElement(
         ScriptCard,
         {
           elements: artifact.scriptElements,
@@ -5749,7 +5795,7 @@ function NodeRenderer({
   onGroupClick
 }) {
   if (node.type === "ARTIFACT" && node.artifact) {
-    return /* @__PURE__ */ import_react73.default.createElement(
+    return /* @__PURE__ */ import_react75.default.createElement(
       ArtifactCard,
       {
         artifact: node.artifact,
@@ -5759,10 +5805,10 @@ function NodeRenderer({
     );
   }
   if (node.type === "GROUP") {
-    return /* @__PURE__ */ import_react73.default.createElement(ArtifactGroup, { node, onClick: onGroupClick });
+    return /* @__PURE__ */ import_react75.default.createElement(ArtifactGroup, { node, onClick: onGroupClick });
   }
   if (node.type === "VARIANT_SET") {
-    return /* @__PURE__ */ import_react73.default.createElement(
+    return /* @__PURE__ */ import_react75.default.createElement(
       ArtifactVariantStack,
       {
         node,
@@ -5773,33 +5819,33 @@ function NodeRenderer({
   }
   return null;
 }
-var ArtifactsPanel = import_react73.default.forwardRef(
+var ArtifactsPanel = import_react75.default.forwardRef(
   ({
     nodes,
     loading,
     className,
     ...rest
   }, ref) => {
-    const [expandedArtifact, setExpandedArtifact] = (0, import_react73.useState)(null);
-    const [zoomIndex, setZoomIndex] = (0, import_react73.useState)(ZOOM_LEVELS.length - 1);
+    const [expandedArtifact, setExpandedArtifact] = (0, import_react75.useState)(null);
+    const [zoomIndex, setZoomIndex] = (0, import_react75.useState)(ZOOM_LEVELS.length - 1);
     const treeNav = useArtifactTreeNavigation(nodes || []);
     const hasNodes = !!nodes && nodes.length > 0;
-    const handleExpandArtifact = (0, import_react73.useCallback)((artifact) => {
+    const handleExpandArtifact = (0, import_react75.useCallback)((artifact) => {
       setExpandedArtifact(artifact);
     }, []);
-    const handleGroupClick = (0, import_react73.useCallback)((node) => {
+    const handleGroupClick = (0, import_react75.useCallback)((node) => {
       treeNav.navigateInto(node);
     }, [treeNav]);
-    const zoomIn = (0, import_react73.useCallback)(() => {
+    const zoomIn = (0, import_react75.useCallback)(() => {
       setZoomIndex((prev) => Math.min(prev + 1, ZOOM_LEVELS.length - 1));
     }, []);
-    const zoomOut = (0, import_react73.useCallback)(() => {
+    const zoomOut = (0, import_react75.useCallback)(() => {
       setZoomIndex((prev) => Math.max(prev - 1, 0));
     }, []);
     const currentZoom = ZOOM_LEVELS[zoomIndex];
-    const contentRef = (0, import_react73.useRef)(null);
-    const [contentHeight, setContentHeight] = (0, import_react73.useState)(void 0);
-    (0, import_react73.useEffect)(() => {
+    const contentRef = (0, import_react75.useRef)(null);
+    const [contentHeight, setContentHeight] = (0, import_react75.useState)(void 0);
+    (0, import_react75.useEffect)(() => {
       const el = contentRef.current;
       if (!el) return;
       const observer = new ResizeObserver(([entry]) => {
@@ -5808,7 +5854,7 @@ var ArtifactsPanel = import_react73.default.forwardRef(
       observer.observe(el);
       return () => observer.disconnect();
     }, []);
-    return /* @__PURE__ */ import_react73.default.createElement(import_react73.default.Fragment, null, /* @__PURE__ */ import_react73.default.createElement(
+    return /* @__PURE__ */ import_react75.default.createElement(import_react75.default.Fragment, null, /* @__PURE__ */ import_react75.default.createElement(
       "div",
       {
         ref,
@@ -5819,19 +5865,19 @@ var ArtifactsPanel = import_react73.default.forwardRef(
         ),
         ...rest
       },
-      /* @__PURE__ */ import_react73.default.createElement(
+      /* @__PURE__ */ import_react75.default.createElement(
         "div",
         {
           className: "flex items-center justify-between p-4 border-b border-ash/40 shrink-0"
         },
-        /* @__PURE__ */ import_react73.default.createElement("h3", { className: "text-sm font-semibold text-white" }, "Artifacts"),
-        hasNodes && /* @__PURE__ */ import_react73.default.createElement(
+        /* @__PURE__ */ import_react75.default.createElement("h3", { className: "text-sm font-semibold text-white" }, "Artifacts"),
+        hasNodes && /* @__PURE__ */ import_react75.default.createElement(
           "div",
           {
             className: "flex items-center gap-0.5",
             "data-testid": "zoom-controls"
           },
-          /* @__PURE__ */ import_react73.default.createElement(
+          /* @__PURE__ */ import_react75.default.createElement(
             "button",
             {
               onClick: zoomOut,
@@ -5845,8 +5891,8 @@ var ArtifactsPanel = import_react73.default.forwardRef(
             },
             "\u2212"
           ),
-          /* @__PURE__ */ import_react73.default.createElement("span", { className: "text-xs text-silver w-8 text-center tabular-nums", "data-testid": "zoom-level" }, Math.round(currentZoom * 100), "%"),
-          /* @__PURE__ */ import_react73.default.createElement(
+          /* @__PURE__ */ import_react75.default.createElement("span", { className: "text-xs text-silver w-8 text-center tabular-nums", "data-testid": "zoom-level" }, Math.round(currentZoom * 100), "%"),
+          /* @__PURE__ */ import_react75.default.createElement(
             "button",
             {
               onClick: zoomIn,
@@ -5862,7 +5908,7 @@ var ArtifactsPanel = import_react73.default.forwardRef(
           )
         )
       ),
-      hasNodes && !treeNav.isAtRoot && /* @__PURE__ */ import_react73.default.createElement(
+      hasNodes && !treeNav.isAtRoot && /* @__PURE__ */ import_react75.default.createElement(
         "nav",
         {
           className: "flex items-center gap-1 px-4 py-2 border-b border-ash/40 shrink-0 overflow-x-auto text-xs",
@@ -5871,7 +5917,7 @@ var ArtifactsPanel = import_react73.default.forwardRef(
         },
         treeNav.breadcrumbs.map((crumb, i) => {
           const isLast = i === treeNav.breadcrumbs.length - 1;
-          return /* @__PURE__ */ import_react73.default.createElement("span", { key: i, className: "flex items-center gap-1 shrink-0" }, i > 0 && /* @__PURE__ */ import_react73.default.createElement(ChevronRightIcon, { className: "w-3 h-3 text-silver/50", "aria-hidden": true }), isLast ? /* @__PURE__ */ import_react73.default.createElement("span", { className: "text-gold font-medium" }, crumb.label) : /* @__PURE__ */ import_react73.default.createElement(
+          return /* @__PURE__ */ import_react75.default.createElement("span", { key: i, className: "flex items-center gap-1 shrink-0" }, i > 0 && /* @__PURE__ */ import_react75.default.createElement(ChevronRightIcon, { className: "w-3 h-3 text-silver/50", "aria-hidden": true }), isLast ? /* @__PURE__ */ import_react75.default.createElement("span", { className: "text-gold font-medium" }, crumb.label) : /* @__PURE__ */ import_react75.default.createElement(
             "button",
             {
               onClick: () => treeNav.navigateTo(i),
@@ -5881,18 +5927,18 @@ var ArtifactsPanel = import_react73.default.forwardRef(
           ));
         })
       ),
-      /* @__PURE__ */ import_react73.default.createElement(
+      /* @__PURE__ */ import_react75.default.createElement(
         "div",
         {
           className: "flex-1 overflow-auto relative",
           "data-testid": "artifacts-scroll-area"
         },
-        /* @__PURE__ */ import_react73.default.createElement(
+        /* @__PURE__ */ import_react75.default.createElement(
           "div",
           {
             style: currentZoom !== 1 && contentHeight !== void 0 ? { height: contentHeight * currentZoom } : void 0
           },
-          /* @__PURE__ */ import_react73.default.createElement(
+          /* @__PURE__ */ import_react75.default.createElement(
             "div",
             {
               ref: contentRef,
@@ -5903,7 +5949,7 @@ var ArtifactsPanel = import_react73.default.forwardRef(
                 transformOrigin: "top center"
               } : void 0
             },
-            treeNav.currentNodes.length === 0 ? /* @__PURE__ */ import_react73.default.createElement("p", { className: "text-xs text-silver/60 text-center py-8" }, hasNodes ? "Empty group" : "No artifacts to display") : treeNav.currentNodes.map((node) => /* @__PURE__ */ import_react73.default.createElement(
+            treeNav.currentNodes.length === 0 ? /* @__PURE__ */ import_react75.default.createElement("p", { className: "text-xs text-silver/60 text-center py-8" }, hasNodes ? "Empty group" : "No artifacts to display") : treeNav.currentNodes.map((node) => /* @__PURE__ */ import_react75.default.createElement(
               NodeRenderer,
               {
                 key: node.id,
@@ -5916,7 +5962,7 @@ var ArtifactsPanel = import_react73.default.forwardRef(
           )
         )
       )
-    ), expandedArtifact && /* @__PURE__ */ import_react73.default.createElement(
+    ), expandedArtifact && /* @__PURE__ */ import_react75.default.createElement(
       ArtifactModal,
       {
         artifact: expandedArtifact,
@@ -5926,8 +5972,8 @@ var ArtifactsPanel = import_react73.default.forwardRef(
   }
 );
 ArtifactsPanel.displayName = "ArtifactsPanel";
-var ArtifactsPanelToggle = import_react73.default.forwardRef(({ artifactCount = 0, onExpand, className, ...rest }, ref) => {
-  return /* @__PURE__ */ import_react73.default.createElement(
+var ArtifactsPanelToggle = import_react75.default.forwardRef(({ artifactCount = 0, onExpand, className, ...rest }, ref) => {
+  return /* @__PURE__ */ import_react75.default.createElement(
     "button",
     {
       ref,
@@ -5944,8 +5990,8 @@ var ArtifactsPanelToggle = import_react73.default.forwardRef(({ artifactCount =
       "aria-label": "Expand artifacts panel",
       ...rest
     },
-    /* @__PURE__ */ import_react73.default.createElement(import_lucide_react15.Image, { className: "w-5 h-5", "aria-hidden": true }),
-    artifactCount > 0 && /* @__PURE__ */ import_react73.default.createElement(
+    /* @__PURE__ */ import_react75.default.createElement(import_lucide_react17.Image, { className: "w-5 h-5", "aria-hidden": true }),
+    artifactCount > 0 && /* @__PURE__ */ import_react75.default.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"
@@ -5957,8 +6003,8 @@ var ArtifactsPanelToggle = import_react73.default.forwardRef(({ artifactCount =
 ArtifactsPanelToggle.displayName = "ArtifactsPanelToggle";
 
 // src/components/chat/HistoryPanel.tsx
-var import_react74 = __toESM(require("react"));
-var import_lucide_react16 = require("lucide-react");
+var import_react76 = __toESM(require("react"));
+var import_lucide_react18 = require("lucide-react");
 function parseTimestamp(ts) {
   if (ts == null) {
     return null;
@@ -6000,12 +6046,12 @@ function ProjectFilter({
   onChange,
   className
 }) {
-  const [open, setOpen] = (0, import_react74.useState)(false);
-  const ref = (0, import_react74.useRef)(null);
-  const closeFilter = (0, import_react74.useCallback)(() => setOpen(false), []);
+  const [open, setOpen] = (0, import_react76.useState)(false);
+  const ref = (0, import_react76.useRef)(null);
+  const closeFilter = (0, import_react76.useCallback)(() => setOpen(false), []);
   useClickOutside(ref, closeFilter, open);
   const label = value ?? "All projects";
-  return /* @__PURE__ */ import_react74.default.createElement("div", { className: cx("relative min-w-0", className), ref }, /* @__PURE__ */ import_react74.default.createElement(
+  return /* @__PURE__ */ import_react76.default.createElement("div", { className: cx("relative min-w-0", className), ref }, /* @__PURE__ */ import_react76.default.createElement(
     "button",
     {
       type: "button",
@@ -6021,9 +6067,9 @@ function ProjectFilter({
         "transition-colors duration-150 min-w-0"
       )
     },
-    /* @__PURE__ */ import_react74.default.createElement("span", { className: "truncate" }, label),
-    /* @__PURE__ */ import_react74.default.createElement(import_lucide_react16.ChevronDown, { className: "w-3 h-3 shrink-0", "aria-hidden": true })
-  ), open && /* @__PURE__ */ import_react74.default.createElement(
+    /* @__PURE__ */ import_react76.default.createElement("span", { className: "truncate" }, label),
+    /* @__PURE__ */ import_react76.default.createElement(import_lucide_react18.ChevronDown, { className: "w-3 h-3 shrink-0", "aria-hidden": true })
+  ), open && /* @__PURE__ */ import_react76.default.createElement(
     "div",
     {
       role: "listbox",
@@ -6033,7 +6079,7 @@ function ProjectFilter({
         "max-h-60 overflow-y-auto"
       )
     },
-    /* @__PURE__ */ import_react74.default.createElement(
+    /* @__PURE__ */ import_react76.default.createElement(
       "button",
       {
         type: "button",
@@ -6051,7 +6097,7 @@ function ProjectFilter({
       },
       "All projects"
     ),
-    projects.map((p) => /* @__PURE__ */ import_react74.default.createElement(
+    projects.map((p) => /* @__PURE__ */ import_react76.default.createElement(
       "button",
       {
         key: p,
@@ -6077,33 +6123,33 @@ function ConversationRow({
   onSelect,
   onRename
 }) {
-  const [isEditing, setIsEditing] = (0, import_react74.useState)(false);
-  const [draft, setDraft] = (0, import_react74.useState)(conversation.title);
-  const inputRef = (0, import_react74.useRef)(null);
-  (0, import_react74.useEffect)(() => {
+  const [isEditing, setIsEditing] = (0, import_react76.useState)(false);
+  const [draft, setDraft] = (0, import_react76.useState)(conversation.title);
+  const inputRef = (0, import_react76.useRef)(null);
+  (0, import_react76.useEffect)(() => {
     if (isEditing && inputRef.current) {
       inputRef.current.focus();
       inputRef.current.select();
     }
   }, [isEditing]);
-  const startEdit = (0, import_react74.useCallback)((e) => {
+  const startEdit = (0, import_react76.useCallback)((e) => {
     e.stopPropagation();
     setDraft(conversation.title);
     setIsEditing(true);
   }, [conversation.title]);
-  const commit = (0, import_react74.useCallback)(() => {
+  const commit = (0, import_react76.useCallback)(() => {
     const trimmed = draft.trim();
     if (trimmed && trimmed !== conversation.title) {
       onRename?.(conversation.id, trimmed);
     }
     setIsEditing(false);
   }, [draft, conversation.id, conversation.title, onRename]);
-  const cancel = (0, import_react74.useCallback)(() => {
+  const cancel = (0, import_react76.useCallback)(() => {
     setDraft(conversation.title);
     setIsEditing(false);
   }, [conversation.title]);
   if (isEditing) {
-    return /* @__PURE__ */ import_react74.default.createElement(
+    return /* @__PURE__ */ import_react76.default.createElement(
       "div",
       {
         className: cx(
@@ -6111,7 +6157,7 @@ function ConversationRow({
           conversation.isActive ? "bg-ash/40" : "bg-ash/20"
         )
       },
-      /* @__PURE__ */ import_react74.default.createElement(
+      /* @__PURE__ */ import_react76.default.createElement(
         "input",
         {
           ref: inputRef,
@@ -6136,10 +6182,10 @@ function ConversationRow({
           "aria-label": "Conversation title"
         }
       ),
-      conversation.project && /* @__PURE__ */ import_react74.default.createElement("p", { className: "text-xs text-silver/60 truncate mt-1" }, conversation.project)
+      conversation.project && /* @__PURE__ */ import_react76.default.createElement("p", { className: "text-xs text-silver/60 truncate mt-1" }, conversation.project)
     );
   }
-  return /* @__PURE__ */ import_react74.default.createElement("div", { className: "relative group" }, /* @__PURE__ */ import_react74.default.createElement(
+  return /* @__PURE__ */ import_react76.default.createElement("div", { className: "relative group" }, /* @__PURE__ */ import_react76.default.createElement(
     "button",
     {
       onClick: () => onSelect?.(conversation.id),
@@ -6149,7 +6195,7 @@ function ConversationRow({
         conversation.isActive ? "bg-ash/40 text-white" : "text-silver hover:bg-ash/20 hover:text-white"
       )
     },
-    /* @__PURE__ */ import_react74.default.createElement(
+    /* @__PURE__ */ import_react76.default.createElement(
       "p",
       {
         className: cx(
@@ -6159,8 +6205,8 @@ function ConversationRow({
       },
       conversation.title
     ),
-    conversation.project && /* @__PURE__ */ import_react74.default.createElement("p", { className: "text-xs text-silver/60 truncate mt-0.5" }, conversation.project)
-  ), onRename && /* @__PURE__ */ import_react74.default.createElement(
+    conversation.project && /* @__PURE__ */ import_react76.default.createElement("p", { className: "text-xs text-silver/60 truncate mt-0.5" }, conversation.project)
+  ), onRename && /* @__PURE__ */ import_react76.default.createElement(
     "button",
     {
       type: "button",
@@ -6173,7 +6219,7 @@ function ConversationRow({
         "transition-opacity duration-150"
       )
     },
-    /* @__PURE__ */ import_react74.default.createElement(import_lucide_react16.Pencil, { className: "w-3.5 h-3.5", "aria-hidden": true })
+    /* @__PURE__ */ import_react76.default.createElement(import_lucide_react18.Pencil, { className: "w-3.5 h-3.5", "aria-hidden": true })
   ));
 }
 function HistoryPanel({
@@ -6182,8 +6228,8 @@ function HistoryPanel({
   onNewChat,
   onRenameConversation
 }) {
-  const [projectFilter, setProjectFilter] = (0, import_react74.useState)(null);
-  const projects = (0, import_react74.useMemo)(() => {
+  const [projectFilter, setProjectFilter] = (0, import_react76.useState)(null);
+  const projects = (0, import_react76.useMemo)(() => {
     const set = /* @__PURE__ */ new Set();
     for (const c of conversations) {
       if (c.project) {
@@ -6192,23 +6238,23 @@ function HistoryPanel({
     }
     return Array.from(set).sort((a, b) => a.localeCompare(b));
   }, [conversations]);
-  (0, import_react74.useEffect)(() => {
+  (0, import_react76.useEffect)(() => {
     if (projectFilter && !projects.includes(projectFilter)) {
       setProjectFilter(null);
     }
   }, [projects, projectFilter]);
-  const filteredConversations = (0, import_react74.useMemo)(() => {
+  const filteredConversations = (0, import_react76.useMemo)(() => {
     if (!projectFilter) {
       return conversations;
     }
     return conversations.filter((c) => c.project === projectFilter);
   }, [conversations, projectFilter]);
-  const groups = (0, import_react74.useMemo)(
+  const groups = (0, import_react76.useMemo)(
     () => groupConversations(filteredConversations),
     [filteredConversations]
   );
   const hasFilter = projects.length > 0;
-  return /* @__PURE__ */ import_react74.default.createElement("div", { className: "h-full flex flex-col" }, /* @__PURE__ */ import_react74.default.createElement("div", { className: "px-4 py-3 border-b border-ash/40 shrink-0 flex items-center gap-2" }, /* @__PURE__ */ import_react74.default.createElement("h3", { className: "text-xs font-medium text-white shrink-0" }, "History"), (hasFilter || onNewChat) && /* @__PURE__ */ import_react74.default.createElement("div", { className: "flex items-center gap-2 flex-1 min-w-0" }, hasFilter && /* @__PURE__ */ import_react74.default.createElement(import_react74.default.Fragment, null, /* @__PURE__ */ import_react74.default.createElement("div", { className: "w-px h-3 bg-ash/40 shrink-0 mx-1" }), /* @__PURE__ */ import_react74.default.createElement(
+  return /* @__PURE__ */ import_react76.default.createElement("div", { className: "h-full flex flex-col" }, /* @__PURE__ */ import_react76.default.createElement("div", { className: "px-4 py-3 border-b border-ash/40 shrink-0 flex items-center gap-2" }, /* @__PURE__ */ import_react76.default.createElement("h3", { className: "text-xs font-medium text-white shrink-0" }, "History"), (hasFilter || onNewChat) && /* @__PURE__ */ import_react76.default.createElement("div", { className: "flex items-center gap-2 flex-1 min-w-0" }, hasFilter && /* @__PURE__ */ import_react76.default.createElement(import_react76.default.Fragment, null, /* @__PURE__ */ import_react76.default.createElement("div", { className: "w-px h-3 bg-ash/40 shrink-0 mx-1" }), /* @__PURE__ */ import_react76.default.createElement(
     ProjectFilter,
     {
       projects,
@@ -6216,7 +6262,7 @@ function HistoryPanel({
       onChange: setProjectFilter,
       className: "flex-1"
     }
-  )), onNewChat && /* @__PURE__ */ import_react74.default.createElement(import_react74.default.Fragment, null, /* @__PURE__ */ import_react74.default.createElement("div", { className: "w-px h-3 bg-ash/40 shrink-0 mx-1" }), /* @__PURE__ */ import_react74.default.createElement(
+  )), onNewChat && /* @__PURE__ */ import_react76.default.createElement(import_react76.default.Fragment, null, /* @__PURE__ */ import_react76.default.createElement("div", { className: "w-px h-3 bg-ash/40 shrink-0 mx-1" }), /* @__PURE__ */ import_react76.default.createElement(
     "button",
     {
       onClick: onNewChat,
@@ -6228,15 +6274,15 @@ function HistoryPanel({
         "transition-colors duration-200"
       )
     },
-    /* @__PURE__ */ import_react74.default.createElement(PlusIcon, { className: "w-4 h-4" }),
-    /* @__PURE__ */ import_react74.default.createElement("span", { className: "truncate" }, "New Chat")
-  )))), /* @__PURE__ */ import_react74.default.createElement("div", { className: "flex-1 overflow-y-auto py-2" }, conversations.length === 0 ? /* @__PURE__ */ import_react74.default.createElement("p", { className: "px-4 py-2 text-xs text-silver/60" }, "No conversations yet") : groups.length === 0 ? /* @__PURE__ */ import_react74.default.createElement("p", { className: "px-4 py-2 text-xs text-silver/60" }, "No conversations match this filter") : /* @__PURE__ */ import_react74.default.createElement("div", null, groups.map((group, index) => /* @__PURE__ */ import_react74.default.createElement("section", { key: group.key, className: cx(index > 0 && "mt-3") }, /* @__PURE__ */ import_react74.default.createElement("div", { className: "flex items-center gap-2 px-3 pb-2" }, /* @__PURE__ */ import_react74.default.createElement(
+    /* @__PURE__ */ import_react76.default.createElement(PlusIcon, { className: "w-4 h-4" }),
+    /* @__PURE__ */ import_react76.default.createElement("span", { className: "truncate" }, "New Chat")
+  )))), /* @__PURE__ */ import_react76.default.createElement("div", { className: "flex-1 overflow-y-auto py-2" }, conversations.length === 0 ? /* @__PURE__ */ import_react76.default.createElement("p", { className: "px-4 py-2 text-xs text-silver/60" }, "No conversations yet") : groups.length === 0 ? /* @__PURE__ */ import_react76.default.createElement("p", { className: "px-4 py-2 text-xs text-silver/60" }, "No conversations match this filter") : /* @__PURE__ */ import_react76.default.createElement("div", null, groups.map((group, index) => /* @__PURE__ */ import_react76.default.createElement("section", { key: group.key, className: cx(index > 0 && "mt-3") }, /* @__PURE__ */ import_react76.default.createElement("div", { className: "flex items-center gap-2 px-3 pb-2" }, /* @__PURE__ */ import_react76.default.createElement(
     "span",
     {
       className: "text-xs font-medium uppercase tracking-wider text-gold/70"
     },
     group.label
-  ), /* @__PURE__ */ import_react74.default.createElement("div", { className: "flex-1 h-px bg-gold/20" })), /* @__PURE__ */ import_react74.default.createElement("div", { className: "space-y-1 px-2" }, group.conversations.map((conversation) => /* @__PURE__ */ import_react74.default.createElement(
+  ), /* @__PURE__ */ import_react76.default.createElement("div", { className: "flex-1 h-px bg-gold/20" })), /* @__PURE__ */ import_react76.default.createElement("div", { className: "space-y-1 px-2" }, group.conversations.map((conversation) => /* @__PURE__ */ import_react76.default.createElement(
     ConversationRow,
     {
       key: conversation.id,
@@ -6248,8 +6294,8 @@ function HistoryPanel({
 }
 
 // src/components/chat/TodosList.tsx
-var import_react75 = __toESM(require("react"));
-var import_lucide_react17 = require("lucide-react");
+var import_react77 = __toESM(require("react"));
+var import_lucide_react19 = require("lucide-react");
 var TASK_STATUSES = {
   PENDING: "pending",
   IN_PROGRESS: "in_progress",
@@ -6260,16 +6306,16 @@ var TASK_STATUSES = {
 function TaskIcon({ status }) {
   switch (status) {
     case "done":
-      return /* @__PURE__ */ import_react75.default.createElement(CheckSquareIcon, null);
+      return /* @__PURE__ */ import_react77.default.createElement(CheckSquareIcon, null);
     case "in_progress":
-      return /* @__PURE__ */ import_react75.default.createElement(SquareLoaderIcon, null);
+      return /* @__PURE__ */ import_react77.default.createElement(SquareLoaderIcon, null);
     case "cancelled":
-      return /* @__PURE__ */ import_react75.default.createElement(CrossSquareIcon, { variant: "cancelled" });
+      return /* @__PURE__ */ import_react77.default.createElement(CrossSquareIcon, { variant: "cancelled" });
     case "failed":
-      return /* @__PURE__ */ import_react75.default.createElement(CrossSquareIcon, { variant: "failed" });
+      return /* @__PURE__ */ import_react77.default.createElement(CrossSquareIcon, { variant: "failed" });
     case "pending":
     default:
-      return /* @__PURE__ */ import_react75.default.createElement(EmptySquareIcon, null);
+      return /* @__PURE__ */ import_react77.default.createElement(EmptySquareIcon, null);
   }
 }
 function sortTasks(tasks) {
@@ -6289,14 +6335,14 @@ function TaskItem({ task, depth = 0 }) {
   const isSubtle = task.status === "cancelled" || task.status === "failed";
   const showSubtasks = task.subtasks && task.subtasks.length > 0;
   const sortedSubtasks = showSubtasks ? sortTasks(task.subtasks) : [];
-  return /* @__PURE__ */ import_react75.default.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ import_react75.default.createElement(
+  return /* @__PURE__ */ import_react77.default.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ import_react77.default.createElement(
     "div",
     {
       className: "flex items-center gap-2 py-1",
       style: { paddingLeft: `${depth * 1.5}rem` }
     },
-    /* @__PURE__ */ import_react75.default.createElement(TaskIcon, { status: task.status }),
-    /* @__PURE__ */ import_react75.default.createElement(
+    /* @__PURE__ */ import_react77.default.createElement(TaskIcon, { status: task.status }),
+    /* @__PURE__ */ import_react77.default.createElement(
       "span",
       {
         className: cx(
@@ -6308,10 +6354,10 @@ function TaskItem({ task, depth = 0 }) {
         )
       },
       task.label,
-      task.status === "cancelled" && /* @__PURE__ */ import_react75.default.createElement("span", { className: "text-silver/40 ml-1" }, "(cancelled)"),
-      task.status === "failed" && /* @__PURE__ */ import_react75.default.createElement("span", { className: "text-error/60 ml-1" }, "(failed)")
+      task.status === "cancelled" && /* @__PURE__ */ import_react77.default.createElement("span", { className: "text-silver/40 ml-1" }, "(cancelled)"),
+      task.status === "failed" && /* @__PURE__ */ import_react77.default.createElement("span", { className: "text-error/60 ml-1" }, "(failed)")
     )
-  ), showSubtasks && /* @__PURE__ */ import_react75.default.createElement("div", { className: "flex flex-col" }, sortedSubtasks.map((subtask) => /* @__PURE__ */ import_react75.default.createElement(TaskItem, { key: subtask.id, task: subtask, depth: depth + 1 }))));
+  ), showSubtasks && /* @__PURE__ */ import_react77.default.createElement("div", { className: "flex flex-col" }, sortedSubtasks.map((subtask) => /* @__PURE__ */ import_react77.default.createElement(TaskItem, { key: subtask.id, task: subtask, depth: depth + 1 }))));
 }
 function hasInProgressTask(tasks) {
   return tasks.some((t) => {
@@ -6324,11 +6370,11 @@ function hasInProgressTask(tasks) {
     return false;
   });
 }
-var TodosList = import_react75.default.forwardRef(
+var TodosList = import_react77.default.forwardRef(
   ({ tasks, title = "Tasks", onStopAllTasks, className, ...rest }, ref) => {
-    const sortedTasks = (0, import_react75.useMemo)(() => sortTasks(tasks), [tasks]);
-    const [isStopping, setIsStopping] = (0, import_react75.useState)(false);
-    const handleStopClick = (0, import_react75.useCallback)(async () => {
+    const sortedTasks = (0, import_react77.useMemo)(() => sortTasks(tasks), [tasks]);
+    const [isStopping, setIsStopping] = (0, import_react77.useState)(false);
+    const handleStopClick = (0, import_react77.useCallback)(async () => {
       if (!onStopAllTasks || isStopping) {
         return;
       }
@@ -6349,7 +6395,7 @@ var TodosList = import_react75.default.forwardRef(
     if (tasks.length === 0) {
       return null;
     }
-    return /* @__PURE__ */ import_react75.default.createElement(
+    return /* @__PURE__ */ import_react77.default.createElement(
       "div",
       {
         ref,
@@ -6360,16 +6406,16 @@ var TodosList = import_react75.default.forwardRef(
         ),
         ...rest
       },
-      /* @__PURE__ */ import_react75.default.createElement(
+      /* @__PURE__ */ import_react77.default.createElement(
         "div",
         {
           className: "flex items-center justify-between px-4 py-2 border-b border-ash/40 flex-shrink-0"
         },
-        /* @__PURE__ */ import_react75.default.createElement("h4", { className: "text-xs font-medium text-white" }, title),
-        /* @__PURE__ */ import_react75.default.createElement("span", { className: "text-xs text-silver/60" }, countCompleted(tasks), "/", countTotal(tasks))
+        /* @__PURE__ */ import_react77.default.createElement("h4", { className: "text-xs font-medium text-white" }, title),
+        /* @__PURE__ */ import_react77.default.createElement("span", { className: "text-xs text-silver/60" }, countCompleted(tasks), "/", countTotal(tasks))
       ),
-      /* @__PURE__ */ import_react75.default.createElement("div", { className: "flex-1 overflow-y-auto px-4 py-2" }, sortedTasks.map((task) => /* @__PURE__ */ import_react75.default.createElement(TaskItem, { key: task.id, task }))),
-      showStopButton && /* @__PURE__ */ import_react75.default.createElement("div", { className: "px-4 py-2 border-t border-ash/40 flex-shrink-0" }, /* @__PURE__ */ import_react75.default.createElement(
+      /* @__PURE__ */ import_react77.default.createElement("div", { className: "flex-1 overflow-y-auto px-4 py-2" }, sortedTasks.map((task) => /* @__PURE__ */ import_react77.default.createElement(TaskItem, { key: task.id, task }))),
+      showStopButton && /* @__PURE__ */ import_react77.default.createElement("div", { className: "px-4 py-2 border-t border-ash/40 flex-shrink-0" }, /* @__PURE__ */ import_react77.default.createElement(
         "button",
         {
           type: "button",
@@ -6386,7 +6432,7 @@ var TodosList = import_react75.default.forwardRef(
             isStopping ? "cursor-not-allowed opacity-70" : "hover:bg-error/20"
           )
         },
-        isStopping ? /* @__PURE__ */ import_react75.default.createElement(import_react75.default.Fragment, null, /* @__PURE__ */ import_react75.default.createElement(import_lucide_react17.Loader2, { className: "w-3 h-3 animate-spin" }), "Stopping tasks") : /* @__PURE__ */ import_react75.default.createElement(import_react75.default.Fragment, null, /* @__PURE__ */ import_react75.default.createElement(import_lucide_react17.Square, { className: "w-3 h-3 fill-current" }), "Stop All Tasks")
+        isStopping ? /* @__PURE__ */ import_react77.default.createElement(import_react77.default.Fragment, null, /* @__PURE__ */ import_react77.default.createElement(import_lucide_react19.Loader2, { className: "w-3 h-3 animate-spin" }), "Stopping tasks") : /* @__PURE__ */ import_react77.default.createElement(import_react77.default.Fragment, null, /* @__PURE__ */ import_react77.default.createElement(import_lucide_react19.Square, { className: "w-3 h-3 fill-current" }), "Stop All Tasks")
       ))
     );
   }
@@ -6406,8 +6452,8 @@ function areAllTasksSettled(tasks) {
 }
 
 // src/components/chat/ToolSidebar.tsx
-var import_react76 = __toESM(require("react"));
-var ToolSidebar = import_react76.default.forwardRef(
+var import_react78 = __toESM(require("react"));
+var ToolSidebar = import_react78.default.forwardRef(
   ({ tools, activeTools, onToggleTool, side, className, ...rest }, ref) => {
     const topTools = tools.filter((t) => t.group === `top-${side}`);
     const bottomTools = tools.filter((t) => t.group === `bottom-${side}`);
@@ -6418,7 +6464,7 @@ var ToolSidebar = import_react76.default.forwardRef(
     };
     const renderButton = (tool) => {
       const active = isActive(tool.id);
-      return /* @__PURE__ */ import_react76.default.createElement(
+      return /* @__PURE__ */ import_react78.default.createElement(
         "button",
         {
           key: tool.id,
@@ -6430,10 +6476,10 @@ var ToolSidebar = import_react76.default.forwardRef(
           "aria-label": tool.label,
           "aria-pressed": active
         },
-        /* @__PURE__ */ import_react76.default.createElement("span", { className: "w-4 h-4 block" }, tool.icon)
+        /* @__PURE__ */ import_react78.default.createElement("span", { className: "w-4 h-4 block" }, tool.icon)
       );
     };
-    return /* @__PURE__ */ import_react76.default.createElement(
+    return /* @__PURE__ */ import_react78.default.createElement(
       "div",
       {
         ref,
@@ -6444,17 +6490,17 @@ var ToolSidebar = import_react76.default.forwardRef(
         ),
         ...rest
       },
-      /* @__PURE__ */ import_react76.default.createElement("div", { className: "flex flex-col items-center gap-1" }, topTools.map(renderButton)),
-      /* @__PURE__ */ import_react76.default.createElement("div", { className: "flex-1 flex items-center justify-center" }, /* @__PURE__ */ import_react76.default.createElement("div", { className: "w-5 border-t border-ash/30" })),
-      /* @__PURE__ */ import_react76.default.createElement("div", { className: "flex flex-col items-center gap-1" }, bottomTools.map(renderButton))
+      /* @__PURE__ */ import_react78.default.createElement("div", { className: "flex flex-col items-center gap-1" }, topTools.map(renderButton)),
+      /* @__PURE__ */ import_react78.default.createElement("div", { className: "flex-1 flex items-center justify-center" }, /* @__PURE__ */ import_react78.default.createElement("div", { className: "w-5 border-t border-ash/30" })),
+      /* @__PURE__ */ import_react78.default.createElement("div", { className: "flex flex-col items-center gap-1" }, bottomTools.map(renderButton))
     );
   }
 );
 ToolSidebar.displayName = "ToolSidebar";
 
 // src/components/chat/ToolPanelContainer.tsx
-var import_react77 = __toESM(require("react"));
-var ToolPanelContainer = import_react77.default.forwardRef(
+var import_react79 = __toESM(require("react"));
+var ToolPanelContainer = import_react79.default.forwardRef(
   ({
     topContent,
     bottomContent,
@@ -6465,21 +6511,21 @@ var ToolPanelContainer = import_react77.default.forwardRef(
     initialTopPercent = 60,
     ...rest
   }, ref) => {
-    const [topPercent, setTopPercent] = (0, import_react77.useState)(initialTopPercent);
-    const [isResizingHeight, setIsResizingHeight] = (0, import_react77.useState)(false);
-    const containerRef = (0, import_react77.useRef)(null);
-    const lastY = (0, import_react77.useRef)(null);
+    const [topPercent, setTopPercent] = (0, import_react79.useState)(initialTopPercent);
+    const [isResizingHeight, setIsResizingHeight] = (0, import_react79.useState)(false);
+    const containerRef = (0, import_react79.useRef)(null);
+    const lastY = (0, import_react79.useRef)(null);
     const hasBoth = topContent !== null && bottomContent !== null;
-    const startHeightResize = (0, import_react77.useCallback)((e) => {
+    const startHeightResize = (0, import_react79.useCallback)((e) => {
       e.preventDefault();
       setIsResizingHeight(true);
       lastY.current = e.clientY;
     }, []);
-    const stopHeightResize = (0, import_react77.useCallback)(() => {
+    const stopHeightResize = (0, import_react79.useCallback)(() => {
       setIsResizingHeight(false);
       lastY.current = null;
     }, []);
-    const resizeHeight = (0, import_react77.useCallback)(
+    const resizeHeight = (0, import_react79.useCallback)(
       (e) => {
         if (!isResizingHeight || lastY.current === null || !containerRef.current) {
           return;
@@ -6498,7 +6544,7 @@ var ToolPanelContainer = import_react77.default.forwardRef(
       },
       [isResizingHeight]
     );
-    (0, import_react77.useEffect)(() => {
+    (0, import_react79.useEffect)(() => {
       if (isResizingHeight) {
         window.addEventListener("mousemove", resizeHeight);
         window.addEventListener("mouseup", stopHeightResize);
@@ -6517,7 +6563,7 @@ var ToolPanelContainer = import_react77.default.forwardRef(
         document.body.style.userSelect = "";
       };
     }, [isResizingHeight, resizeHeight, stopHeightResize]);
-    return /* @__PURE__ */ import_react77.default.createElement(
+    return /* @__PURE__ */ import_react79.default.createElement(
       "div",
       {
         ref: composeRefs(containerRef, ref),
@@ -6529,7 +6575,7 @@ var ToolPanelContainer = import_react77.default.forwardRef(
         style: width ? { width } : void 0,
         ...rest
       },
-      /* @__PURE__ */ import_react77.default.createElement(
+      /* @__PURE__ */ import_react79.default.createElement(
         "div",
         {
           onMouseDown: onResizeStart,
@@ -6540,7 +6586,7 @@ var ToolPanelContainer = import_react77.default.forwardRef(
           )
         }
       ),
-      topContent !== null && /* @__PURE__ */ import_react77.default.createElement(
+      topContent !== null && /* @__PURE__ */ import_react79.default.createElement(
         "div",
         {
           className: "min-h-0 overflow-hidden flex flex-col",
@@ -6548,7 +6594,7 @@ var ToolPanelContainer = import_react77.default.forwardRef(
         },
         topContent
       ),
-      hasBoth && /* @__PURE__ */ import_react77.default.createElement(
+      hasBoth && /* @__PURE__ */ import_react79.default.createElement(
         "div",
         {
           onMouseDown: startHeightResize,
@@ -6560,7 +6606,7 @@ var ToolPanelContainer = import_react77.default.forwardRef(
           )
         }
       ),
-      bottomContent !== null && /* @__PURE__ */ import_react77.default.createElement(
+      bottomContent !== null && /* @__PURE__ */ import_react79.default.createElement(
         "div",
         {
           className: "min-h-0 overflow-hidden flex flex-col",
@@ -6574,26 +6620,26 @@ var ToolPanelContainer = import_react77.default.forwardRef(
 ToolPanelContainer.displayName = "ToolPanelContainer";
 
 // src/components/chat/hooks/useResizable.ts
-var import_react78 = require("react");
+var import_react80 = require("react");
 function useResizable({
   initialWidthPercent,
   minWidthPercent,
   maxWidthPercent,
   direction
 }) {
-  const [widthPercent, setWidthPercent] = (0, import_react78.useState)(initialWidthPercent);
-  const [isResizing, setIsResizing] = (0, import_react78.useState)(false);
-  const lastX = (0, import_react78.useRef)(null);
-  const startResizing = (0, import_react78.useCallback)((e) => {
+  const [widthPercent, setWidthPercent] = (0, import_react80.useState)(initialWidthPercent);
+  const [isResizing, setIsResizing] = (0, import_react80.useState)(false);
+  const lastX = (0, import_react80.useRef)(null);
+  const startResizing = (0, import_react80.useCallback)((e) => {
     e.preventDefault();
     setIsResizing(true);
     lastX.current = e.clientX;
   }, []);
-  const stopResizing = (0, import_react78.useCallback)(() => {
+  const stopResizing = (0, import_react80.useCallback)(() => {
     setIsResizing(false);
     lastX.current = null;
   }, []);
-  const resize = (0, import_react78.useCallback)(
+  const resize = (0, import_react80.useCallback)(
     (e) => {
       if (!isResizing || lastX.current === null) {
         return;
@@ -6609,7 +6655,7 @@ function useResizable({
     },
     [isResizing, direction, minWidthPercent, maxWidthPercent]
   );
-  (0, import_react78.useEffect)(() => {
+  (0, import_react80.useEffect)(() => {
     if (isResizing) {
       window.addEventListener("mousemove", resize);
       window.addEventListener("mouseup", stopResizing);
@@ -6632,8 +6678,150 @@ function useResizable({
   return { width, widthPercent, isResizing, startResizing };
 }
 
+// src/components/chat/tree.ts
+function createEmptyTree() {
+  return { nodes: {}, rootIds: [], activeLeafId: null, lastLeafId: null };
+}
+function addNodeToTree(tree, node, parentId = null) {
+  const newNodes = { ...tree.nodes };
+  const newRootIds = [...tree.rootIds];
+  const branchIndex = parentId ? newNodes[parentId]?.children.length ?? 0 : newRootIds.length;
+  newNodes[node.id] = {
+    ...node,
+    parentId,
+    children: [],
+    branchIndex,
+    createdAt: node.createdAt ?? Date.now()
+  };
+  if (parentId && newNodes[parentId]) {
+    newNodes[parentId] = {
+      ...newNodes[parentId],
+      children: [...newNodes[parentId].children, node.id]
+    };
+  } else {
+    newRootIds.push(node.id);
+  }
+  return {
+    nodes: newNodes,
+    rootIds: newRootIds,
+    activeLeafId: node.id,
+    lastLeafId: node.id
+  };
+}
+function getActivePath(tree) {
+  return walkUp(tree, tree.activeLeafId).reverse();
+}
+function findAncestor(tree, fromId, predicate) {
+  let id = fromId;
+  while (id) {
+    const node = tree.nodes[id];
+    if (!node) return null;
+    if (predicate(node)) return node;
+    id = node.parentId;
+  }
+  return null;
+}
+function getSiblingInfo(tree, nodeId) {
+  const siblings = siblingsOf(tree, nodeId);
+  const index = siblings.indexOf(nodeId);
+  if (index < 0) return { total: 1, current: 1 };
+  return { total: siblings.length, current: index + 1 };
+}
+function isBranchPoint(tree, nodeId) {
+  return (tree.nodes[nodeId]?.children.length ?? 0) > 1;
+}
+function switchBranch(tree, nodeId, direction) {
+  const siblings = siblingsOf(tree, nodeId);
+  if (siblings.length <= 1) return tree;
+  const currentIndex = siblings.indexOf(nodeId);
+  const newIndex = direction === "next" ? (currentIndex + 1) % siblings.length : (currentIndex - 1 + siblings.length) % siblings.length;
+  const leafId = deepestLeafOf(tree, siblings[newIndex]);
+  return { ...tree, activeLeafId: leafId, lastLeafId: leafId };
+}
+function setActiveLeaf(tree, leafId) {
+  if (!leafId || !tree.nodes[leafId]) {
+    return { ...tree, activeLeafId: leafId, lastLeafId: leafId };
+  }
+  const lastLeafId = tree.lastLeafId && isAncestor(tree, leafId, tree.lastLeafId) ? tree.lastLeafId : leafId;
+  return { ...tree, activeLeafId: leafId, lastLeafId };
+}
+function getGreyedFuture(tree) {
+  const { activeLeafId, lastLeafId } = tree;
+  if (!activeLeafId || !lastLeafId || activeLeafId === lastLeafId) return [];
+  const path = [];
+  let id = lastLeafId;
+  while (id && id !== activeLeafId) {
+    const node = tree.nodes[id];
+    if (!node) return [];
+    path.unshift(node);
+    id = node.parentId;
+  }
+  return id === activeLeafId ? path : [];
+}
+function messagesToTree(messages) {
+  let tree = createEmptyTree();
+  for (const msg of messages) {
+    const parentId = tree.activeLeafId;
+    tree = addNodeToTree(
+      tree,
+      { ...msg, kind: "message", parentId },
+      parentId
+    );
+  }
+  return tree;
+}
+function updateMessageContent(tree, nodeId, content, isStreaming) {
+  const node = tree.nodes[nodeId];
+  if (!node || node.kind !== "message") return tree;
+  const updated = {
+    ...node,
+    content,
+    isStreaming: isStreaming ?? node.isStreaming
+  };
+  return {
+    ...tree,
+    nodes: {
+      ...tree.nodes,
+      [nodeId]: updated
+    }
+  };
+}
+function walkUp(tree, fromId) {
+  const out = [];
+  let id = fromId;
+  while (id) {
+    const node = tree.nodes[id];
+    if (!node) break;
+    out.push(node);
+    id = node.parentId;
+  }
+  return out;
+}
+function siblingsOf(tree, nodeId) {
+  const node = tree.nodes[nodeId];
+  if (!node) return [];
+  return node.parentId ? tree.nodes[node.parentId]?.children ?? [] : tree.rootIds;
+}
+function deepestLeafOf(tree, nodeId) {
+  let id = nodeId;
+  let node = tree.nodes[id];
+  while (node && node.children.length > 0) {
+    id = node.children[node.children.length - 1];
+    node = tree.nodes[id];
+  }
+  return id;
+}
+function isAncestor(tree, ancestorId, descendantId) {
+  let id = descendantId;
+  while (id) {
+    if (id === ancestorId) return true;
+    id = tree.nodes[id]?.parentId ?? null;
+  }
+  return false;
+}
+
 // src/components/chat/ChatInterface.tsx
-var ChatInterface = import_react79.default.forwardRef(
+var ChatInterface = import_react81.default.forwardRef(
   ({
     messages = [],
     conversationTree,
@@ -6642,6 +6830,8 @@ var ChatInterface = import_react79.default.forwardRef(
     onMessageSubmit,
     onEditMessage,
     onRetryMessage,
+    onJumpToCheckpoint,
+    onJumpToLatest,
     onStop,
     onSelectConversation,
     onNewChat,
@@ -6670,17 +6860,17 @@ var ChatInterface = import_react79.default.forwardRef(
     className,
     ...rest
   }, ref) => {
-    const prevArtifactNodesRef = (0, import_react79.useRef)([]);
-    const prevTasksRef = (0, import_react79.useRef)([]);
-    const [internalTools, setInternalTools] = (0, import_react79.useState)({
+    const prevArtifactNodesRef = (0, import_react81.useRef)([]);
+    const prevTasksRef = (0, import_react81.useRef)([]);
+    const [internalTools, setInternalTools] = (0, import_react81.useState)({
       "top-left": "history",
       "bottom-left": null,
       "top-right": null,
       "bottom-right": null
     });
-    const dismissedToolsRef = (0, import_react79.useRef)(/* @__PURE__ */ new Set());
+    const dismissedToolsRef = (0, import_react81.useRef)(/* @__PURE__ */ new Set());
     const isPanelControlled = isArtifactsPanelOpen !== void 0;
-    const activeTools = (0, import_react79.useMemo)(() => {
+    const activeTools = (0, import_react81.useMemo)(() => {
       if (isPanelControlled) {
         return {
           ...internalTools,
@@ -6710,13 +6900,13 @@ var ChatInterface = import_react79.default.forwardRef(
       direction: "right"
     });
     const allSettled = tasks.length === 0 || areAllTasksSettled(tasks);
-    const allToolDefinitions = (0, import_react79.useMemo)(() => {
+    const allToolDefinitions = (0, import_react81.useMemo)(() => {
       const builtIn = [
-        { id: "history", icon: /* @__PURE__ */ import_react79.default.createElement(ChatBubbleIcon, null), label: "History", group: "top-left" },
-        { id: "artifacts", icon: /* @__PURE__ */ import_react79.default.createElement(MediaIcon, null), label: "Artifacts", group: "top-right" },
+        { id: "history", icon: /* @__PURE__ */ import_react81.default.createElement(ChatBubbleIcon, null), label: "History", group: "top-left" },
+        { id: "artifacts", icon: /* @__PURE__ */ import_react81.default.createElement(MediaIcon, null), label: "Artifacts", group: "top-right" },
         {
           id: "todos",
-          icon: allSettled ? /* @__PURE__ */ import_react79.default.createElement(CheckSquareIcon, null) : /* @__PURE__ */ import_react79.default.createElement(SquareLoaderIcon, null),
+          icon: allSettled ? /* @__PURE__ */ import_react81.default.createElement(CheckSquareIcon, null) : /* @__PURE__ */ import_react81.default.createElement(SquareLoaderIcon, null),
           label: "Tasks",
           group: "bottom-right"
         }
@@ -6724,7 +6914,7 @@ var ChatInterface = import_react79.default.forwardRef(
       const external = externalTools.map(({ content: _content, ...def }) => def);
       return [...builtIn, ...external];
     }, [allSettled, externalTools]);
-    const toggleTool = (0, import_react79.useCallback)((toolId) => {
+    const toggleTool = (0, import_react81.useCallback)((toolId) => {
       const toolDef = allToolDefinitions.find((t) => t.id === toolId);
       if (!toolDef) {
         return;
@@ -6754,21 +6944,25 @@ var ChatInterface = import_react79.default.forwardRef(
       });
     }, [allToolDefinitions, isPanelControlled, activeTools, onArtifactsPanelOpenChange]);
     const isTreeMode = !!conversationTree;
-    const effectiveMessages = (0, import_react79.useMemo)(() => {
-      if (isTreeMode && conversationTree) {
-        return getActivePathMessages(conversationTree);
-      }
-      return messages || [];
-    }, [isTreeMode, conversationTree, messages]);
-    const latestUserMessageIndex = (0, import_react79.useMemo)(() => {
-      for (let i = effectiveMessages.length - 1; i >= 0; i--) {
-        if (effectiveMessages[i].role === "user") {
-          return i;
-        }
-      }
-      return -1;
-    }, [effectiveMessages]);
-    (0, import_react79.useEffect)(() => {
+    const tree = isTreeMode ? conversationTree : null;
+    const activePath = (0, import_react81.useMemo)(() => {
+      if (tree) return getActivePath(tree);
+      return (messages || []).map((m) => ({ ...m, children: [], branchIndex: 0 }));
+    }, [tree, messages]);
+    const greyedFuture = (0, import_react81.useMemo)(
+      () => tree ? getGreyedFuture(tree) : [],
+      [tree]
+    );
+    const activeCheckpointId = (0, import_react81.useMemo)(() => {
+      if (!tree) return null;
+      const found = findAncestor(
+        tree,
+        tree.activeLeafId,
+        (n) => n.kind === "checkpoint"
+      );
+      return found?.id ?? null;
+    }, [tree]);
+    (0, import_react81.useEffect)(() => {
       const nodes = artifactNodes || [];
       const prevNodes = prevArtifactNodesRef.current;
       const hasNewOrChangedNode = nodes.length !== prevNodes.length || nodes.some((n, i) => n.id !== prevNodes[i]?.id);
@@ -6793,71 +6987,120 @@ var ChatInterface = import_react79.default.forwardRef(
       prevArtifactNodesRef.current = nodes;
       prevTasksRef.current = tasks;
     }, [artifactNodes, tasks, isPanelControlled]);
-    const handleBranchSwitch = (0, import_react79.useCallback)(
+    const handleBranchSwitch = (0, import_react81.useCallback)(
       (nodeId, direction) => {
-        if (!isTreeMode || !conversationTree || !onTreeChange) {
+        if (!tree || !onTreeChange) {
           return;
         }
-        const newTree = switchBranch(conversationTree, nodeId, direction);
-        onTreeChange(newTree);
+        onTreeChange(switchBranch(tree, nodeId, direction));
       },
-      [isTreeMode, conversationTree, onTreeChange]
+      [tree, onTreeChange]
     );
-    const displayMessages = (0, import_react79.useMemo)(() => {
-      return effectiveMessages.map((msg) => {
-        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 handleJumpToCheckpoint = (0, import_react81.useCallback)((checkpointId) => {
+      if (!tree) return;
+      if (onJumpToCheckpoint) {
+        onJumpToCheckpoint(checkpointId);
+        return;
+      }
+      if (onTreeChange) {
+        onTreeChange(setActiveLeaf(tree, checkpointId));
+      }
+    }, [tree, onTreeChange, onJumpToCheckpoint]);
+    const handleJumpToLatest = (0, import_react81.useCallback)(() => {
+      if (!tree) return;
+      if (onJumpToLatest) {
+        onJumpToLatest();
+        return;
+      }
+      if (onTreeChange && tree.lastLeafId) {
+        onTreeChange(setActiveLeaf(tree, tree.lastLeafId));
+      }
+    }, [tree, onTreeChange, onJumpToLatest]);
+    const buildItem = (0, import_react81.useCallback)(
+      (node, opts) => {
+        const branchInfo = tree && getSiblingInfo(tree, node.id).total > 1 ? {
+          ...getSiblingInfo(tree, node.id),
+          onPrevious: () => handleBranchSwitch(node.id, "prev"),
+          onNext: () => handleBranchSwitch(node.id, "next")
+        } : void 0;
+        if (node.kind === "checkpoint") {
+          return {
+            kind: "checkpoint",
+            id: node.id,
+            name: node.name,
+            executionKind: node.executionKind,
+            status: node.status,
+            isActive: node.id === activeCheckpointId && !opts.muted,
+            muted: opts.muted,
+            branchInfo,
+            onJumpHere: () => handleJumpToCheckpoint(node.id)
+          };
         }
         const actions = enableMessageActions ? {
           showCopy: true,
-          onEdit: msg.role === "user" && onEditMessage ? (newContent) => onEditMessage(msg.id, newContent) : void 0,
-          onRetry: msg.role === "assistant" && onRetryMessage ? () => onRetryMessage(msg.id) : void 0
+          onEdit: node.role === "user" && onEditMessage ? (newContent) => onEditMessage(node.id, newContent) : void 0,
+          onRetry: node.role === "assistant" && onRetryMessage ? () => onRetryMessage(node.id) : void 0
         } : void 0;
-        const {
-          role,
-          parentId,
-          children,
-          branchIndex,
-          createdAt,
-          ...rest2
-        } = msg;
         return {
-          ...rest2,
-          variant: role,
+          kind: "message",
+          id: node.id,
+          variant: node.role,
+          content: node.content,
+          isStreaming: node.isStreaming,
+          muted: opts.muted,
           branchInfo,
           actions
         };
-      });
-    }, [
-      effectiveMessages,
-      isTreeMode,
-      conversationTree,
-      enableMessageActions,
-      onEditMessage,
-      onRetryMessage,
-      handleBranchSwitch
-    ]);
-    const handleSubmit = (0, import_react79.useCallback)(
+      },
+      [
+        tree,
+        activeCheckpointId,
+        enableMessageActions,
+        onEditMessage,
+        onRetryMessage,
+        handleBranchSwitch,
+        handleJumpToCheckpoint
+      ]
+    );
+    const displayItems = (0, import_react81.useMemo)(() => {
+      const items = activePath.map((n) => buildItem(n, { muted: false }));
+      if (greyedFuture.length > 0) {
+        const messageCount = greyedFuture.filter((n) => n.kind === "message").length;
+        const checkpointCount = greyedFuture.filter((n) => n.kind === "checkpoint").length;
+        items.push({
+          kind: "divider",
+          id: "__greyed_divider__",
+          messageCount,
+          checkpointCount,
+          onJumpToLatest: handleJumpToLatest
+        });
+        for (const n of greyedFuture) {
+          items.push(buildItem(n, { muted: true }));
+        }
+      }
+      return items;
+    }, [activePath, greyedFuture, buildItem, handleJumpToLatest]);
+    const latestUserMessageIndex = (0, import_react81.useMemo)(() => {
+      for (let i = displayItems.length - 1; i >= 0; i--) {
+        const item = displayItems[i];
+        if (item.kind === "message" && item.variant === "user" && !item.muted) {
+          return i;
+        }
+      }
+      return -1;
+    }, [displayItems]);
+    const handleSubmit = (0, import_react81.useCallback)(
       (message, attachments) => {
         onMessageSubmit?.(message, attachments);
       },
       [onMessageSubmit]
     );
-    const isEmpty = effectiveMessages.length === 0;
-    const leftToolDefs = (0, import_react79.useMemo)(
+    const isEmpty = displayItems.length === 0;
+    const leftToolDefs = (0, import_react81.useMemo)(
       () => allToolDefinitions.filter((t) => t.group === "top-left" || t.group === "bottom-left"),
       [allToolDefinitions]
     );
-    const rightToolDefs = (0, import_react79.useMemo)(
+    const rightToolDefs = (0, import_react81.useMemo)(
       () => allToolDefinitions.filter(
         (t) => t.group === "top-right" || t.group === "bottom-right"
       ),
@@ -6871,7 +7114,7 @@ var ChatInterface = import_react79.default.forwardRef(
       }
       switch (toolId) {
         case "history":
-          return /* @__PURE__ */ import_react79.default.createElement(
+          return /* @__PURE__ */ import_react81.default.createElement(
             HistoryPanel,
             {
               conversations,
@@ -6881,7 +7124,7 @@ var ChatInterface = import_react79.default.forwardRef(
             }
           );
         case "artifacts":
-          return /* @__PURE__ */ import_react79.default.createElement(
+          return /* @__PURE__ */ import_react81.default.createElement(
             ArtifactsPanel,
             {
               nodes: artifactNodes,
@@ -6889,7 +7132,7 @@ var ChatInterface = import_react79.default.forwardRef(
             }
           );
         case "todos":
-          return tasks.length > 0 ? /* @__PURE__ */ import_react79.default.createElement(
+          return tasks.length > 0 ? /* @__PURE__ */ import_react81.default.createElement(
             TodosList,
             {
               tasks,
@@ -6897,21 +7140,21 @@ var ChatInterface = import_react79.default.forwardRef(
               onStopAllTasks,
               className: "h-full"
             }
-          ) : /* @__PURE__ */ import_react79.default.createElement("div", { className: "h-full flex flex-col" }, /* @__PURE__ */ import_react79.default.createElement("div", { className: "flex items-center p-4 border-b border-ash/40 shrink-0" }, /* @__PURE__ */ import_react79.default.createElement("h3", { className: "text-xs font-medium text-white" }, "Tasks")), /* @__PURE__ */ import_react79.default.createElement("div", { className: "flex-1 flex items-center justify-center" }, /* @__PURE__ */ import_react79.default.createElement("p", { className: "text-xs text-silver/60" }, "No tasks")));
+          ) : /* @__PURE__ */ import_react81.default.createElement("div", { className: "h-full flex flex-col" }, /* @__PURE__ */ import_react81.default.createElement("div", { className: "flex items-center p-4 border-b border-ash/40 shrink-0" }, /* @__PURE__ */ import_react81.default.createElement("h3", { className: "text-xs font-medium text-white" }, "Tasks")), /* @__PURE__ */ import_react81.default.createElement("div", { className: "flex-1 flex items-center justify-center" }, /* @__PURE__ */ import_react81.default.createElement("p", { className: "text-xs text-silver/60" }, "No tasks")));
         default: {
           const externalTool = externalTools.find((t) => t.id === toolId);
           return externalTool?.content ?? null;
         }
       }
     };
-    return /* @__PURE__ */ import_react79.default.createElement(
+    return /* @__PURE__ */ import_react81.default.createElement(
       "div",
       {
         ref,
         className: cx("flex h-full w-full bg-obsidian overflow-hidden", className),
         ...rest
       },
-      hasLeftTools && /* @__PURE__ */ import_react79.default.createElement(
+      hasLeftTools && /* @__PURE__ */ import_react81.default.createElement(
         ToolSidebar,
         {
           tools: leftToolDefs,
@@ -6920,7 +7163,7 @@ var ChatInterface = import_react79.default.forwardRef(
           side: "left"
         }
       ),
-      isLeftPanelOpen && /* @__PURE__ */ import_react79.default.createElement(
+      isLeftPanelOpen && /* @__PURE__ */ import_react81.default.createElement(
         ToolPanelContainer,
         {
           topContent: renderToolContent(activeTools["top-left"]),
@@ -6931,28 +7174,28 @@ var ChatInterface = import_react79.default.forwardRef(
           initialTopPercent: 30
         }
       ),
-      /* @__PURE__ */ import_react79.default.createElement("div", { className: "flex-1 flex flex-col min-w-0 relative" }, /* @__PURE__ */ import_react79.default.createElement("div", { className: cx(
+      /* @__PURE__ */ import_react81.default.createElement("div", { className: "flex-1 flex flex-col min-w-0 relative" }, /* @__PURE__ */ import_react81.default.createElement("div", { className: cx(
         "flex-1 flex flex-col min-h-0 relative",
         isEmpty ? "justify-center" : "justify-start"
-      ) }, /* @__PURE__ */ import_react79.default.createElement("div", { className: cx(
+      ) }, /* @__PURE__ */ import_react81.default.createElement("div", { className: cx(
         "transition-all duration-500 ease-in-out",
         isEmpty ? "flex-1" : "flex-zero"
-      ) }), /* @__PURE__ */ import_react79.default.createElement("div", { className: cx(
+      ) }), /* @__PURE__ */ import_react81.default.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__ */ import_react79.default.createElement(
+      ) }, /* @__PURE__ */ import_react81.default.createElement(
         ChatView,
         {
-          messages: displayMessages,
+          items: displayItems,
           latestUserMessageIndex,
           isStreaming,
           isThinking,
           className: "flex-1"
         }
-      )), /* @__PURE__ */ import_react79.default.createElement("div", { className: cx(
+      )), /* @__PURE__ */ import_react81.default.createElement("div", { className: cx(
         "transition-all duration-500 ease-in-out z-10 w-full flex flex-col items-center",
         isEmpty ? "p-4" : "shrink-0 p-4 border-t border-ash/40 bg-obsidian"
-      ) }, isEmpty && /* @__PURE__ */ import_react79.default.createElement("div", { className: "mb-8 text-center animate-fade-in duration-500" }, emptyState ? emptyState : /* @__PURE__ */ import_react79.default.createElement("h1", { className: "text-4xl md:text-5xl font-heading text-gold mb-2 tracking-tight" }, "Welcome!")), /* @__PURE__ */ import_react79.default.createElement(
+      ) }, isEmpty && /* @__PURE__ */ import_react81.default.createElement("div", { className: "mb-8 text-center animate-fade-in duration-500" }, emptyState ? emptyState : /* @__PURE__ */ import_react81.default.createElement("h1", { className: "text-4xl md:text-5xl font-heading text-gold mb-2 tracking-tight" }, "Welcome!")), /* @__PURE__ */ import_react81.default.createElement(
         ChatInput,
         {
           position: isEmpty ? "centered" : "bottom",
@@ -6971,11 +7214,11 @@ var ChatInterface = import_react79.default.forwardRef(
           initialInputValue,
           autoFocus
         }
-      )), /* @__PURE__ */ import_react79.default.createElement("div", { className: cx(
+      )), /* @__PURE__ */ import_react81.default.createElement("div", { className: cx(
         "transition-all duration-500 ease-in-out",
         isEmpty ? "flex-1" : "flex-zero"
       ) }))),
-      isRightPanelOpen && /* @__PURE__ */ import_react79.default.createElement(
+      isRightPanelOpen && /* @__PURE__ */ import_react81.default.createElement(
         ToolPanelContainer,
         {
           topContent: renderToolContent(activeTools["top-right"]),
@@ -6986,7 +7229,7 @@ var ChatInterface = import_react79.default.forwardRef(
           initialTopPercent: 70
         }
       ),
-      hasRightTools && /* @__PURE__ */ import_react79.default.createElement(
+      hasRightTools && /* @__PURE__ */ import_react81.default.createElement(
         ToolSidebar,
         {
           tools: rightToolDefs,
@@ -7001,9 +7244,9 @@ var ChatInterface = import_react79.default.forwardRef(
 ChatInterface.displayName = "ChatInterface";
 
 // src/components/chat/MessageActions.tsx
-var import_react80 = __toESM(require("react"));
-var import_lucide_react18 = require("lucide-react");
-var ActionButton2 = ({ onClick, label, children, className, disabled }) => /* @__PURE__ */ import_react80.default.createElement(
+var import_react82 = __toESM(require("react"));
+var import_lucide_react20 = require("lucide-react");
+var ActionButton2 = ({ onClick, label, children, className, disabled }) => /* @__PURE__ */ import_react82.default.createElement(
   "button",
   {
     type: "button",
@@ -7019,7 +7262,7 @@ var ActionButton2 = ({ onClick, label, children, className, disabled }) => /* @_
   },
   children
 );
-var MessageActions = import_react80.default.forwardRef(
+var MessageActions = import_react82.default.forwardRef(
   ({
     variant,
     content,
@@ -7031,12 +7274,12 @@ var MessageActions = import_react80.default.forwardRef(
     className,
     ...rest
   }, ref) => {
-    const [localIsEditing, setLocalIsEditing] = (0, import_react80.useState)(false);
-    const [localEditValue, setLocalEditValue] = (0, import_react80.useState)(content);
+    const [localIsEditing, setLocalIsEditing] = (0, import_react82.useState)(false);
+    const [localEditValue, setLocalEditValue] = (0, import_react82.useState)(content);
     const { copied, copy } = useCopyToClipboard();
     const isEditing = controlledIsEditing ?? localIsEditing;
     const editValue = controlledEditValue ?? localEditValue;
-    const setIsEditing = (0, import_react80.useCallback)(
+    const setIsEditing = (0, import_react82.useCallback)(
       (value) => {
         if (onEditingChange) {
           onEditingChange(value);
@@ -7046,28 +7289,28 @@ var MessageActions = import_react80.default.forwardRef(
       },
       [onEditingChange]
     );
-    const setEditValue = (0, import_react80.useCallback)((value) => {
+    const setEditValue = (0, import_react82.useCallback)((value) => {
       setLocalEditValue(value);
     }, []);
-    const handleCopy = (0, import_react80.useCallback)(() => {
+    const handleCopy = (0, import_react82.useCallback)(() => {
       void copy(content);
     }, [copy, content]);
-    const handleStartEdit = (0, import_react80.useCallback)(() => {
+    const handleStartEdit = (0, import_react82.useCallback)(() => {
       setLocalEditValue(content);
       setIsEditing(true);
     }, [content, setIsEditing]);
-    const handleCancelEdit = (0, import_react80.useCallback)(() => {
+    const handleCancelEdit = (0, import_react82.useCallback)(() => {
       setIsEditing(false);
       setLocalEditValue(content);
     }, [content, setIsEditing]);
-    const handleSubmitEdit = (0, import_react80.useCallback)(() => {
+    const handleSubmitEdit = (0, import_react82.useCallback)(() => {
       const trimmed = editValue.trim();
       if (trimmed && trimmed !== content) {
         onEdit?.(trimmed);
       }
       setIsEditing(false);
     }, [editValue, content, onEdit, setIsEditing]);
-    const handleEditKeyDown = (0, import_react80.useCallback)(
+    const handleEditKeyDown = (0, import_react82.useCallback)(
       (e) => {
         if (e.key === "Enter" && !e.shiftKey) {
           e.preventDefault();
@@ -7080,19 +7323,19 @@ var MessageActions = import_react80.default.forwardRef(
     );
     const isUser = variant === "user";
     if (isUser && isEditing) {
-      return /* @__PURE__ */ import_react80.default.createElement(
+      return /* @__PURE__ */ import_react82.default.createElement(
         "div",
         {
           ref,
           className: cx("mt-2", className),
           ...rest
         },
-        /* @__PURE__ */ import_react80.default.createElement(
+        /* @__PURE__ */ import_react82.default.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__ */ import_react80.default.createElement(
+          /* @__PURE__ */ import_react82.default.createElement(
             "textarea",
             {
               value: editValue,
@@ -7103,15 +7346,15 @@ var MessageActions = import_react80.default.forwardRef(
               rows: 2
             }
           ),
-          /* @__PURE__ */ import_react80.default.createElement("div", { className: "absolute right-2 bottom-2 flex gap-1" }, /* @__PURE__ */ import_react80.default.createElement(
+          /* @__PURE__ */ import_react82.default.createElement("div", { className: "absolute right-2 bottom-2 flex gap-1" }, /* @__PURE__ */ import_react82.default.createElement(
             ActionButton2,
             {
               onClick: handleCancelEdit,
               label: "Cancel edit",
               className: "text-silver/60 hover:text-error"
             },
-            /* @__PURE__ */ import_react80.default.createElement(import_lucide_react18.X, { className: "w-4 h-4" })
-          ), /* @__PURE__ */ import_react80.default.createElement(
+            /* @__PURE__ */ import_react82.default.createElement(import_lucide_react20.X, { className: "w-4 h-4" })
+          ), /* @__PURE__ */ import_react82.default.createElement(
             ActionButton2,
             {
               onClick: handleSubmitEdit,
@@ -7119,13 +7362,13 @@ var MessageActions = import_react80.default.forwardRef(
               className: "text-silver/60 hover:text-gold",
               disabled: !editValue.trim() || editValue.trim() === content
             },
-            /* @__PURE__ */ import_react80.default.createElement(import_lucide_react18.Send, { className: "w-4 h-4" })
+            /* @__PURE__ */ import_react82.default.createElement(import_lucide_react20.Send, { className: "w-4 h-4" })
           ))
         ),
-        /* @__PURE__ */ import_react80.default.createElement("p", { className: "text-xs text-silver/50 mt-1" }, "Press Enter to submit, Esc to cancel. This will create a new branch.")
+        /* @__PURE__ */ import_react82.default.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__ */ import_react80.default.createElement(
+    return /* @__PURE__ */ import_react82.default.createElement(
       "div",
       {
         ref,
@@ -7136,18 +7379,18 @@ var MessageActions = import_react80.default.forwardRef(
         ),
         ...rest
       },
-      /* @__PURE__ */ import_react80.default.createElement(ActionButton2, { onClick: handleCopy, label: copied ? "Copied!" : "Copy message" }, copied ? /* @__PURE__ */ import_react80.default.createElement(import_lucide_react18.Check, { className: "w-3.5 h-3.5 text-success" }) : /* @__PURE__ */ import_react80.default.createElement(import_lucide_react18.Copy, { className: "w-3.5 h-3.5" })),
-      isUser && onEdit && /* @__PURE__ */ import_react80.default.createElement(ActionButton2, { onClick: handleStartEdit, label: "Edit message" }, /* @__PURE__ */ import_react80.default.createElement(import_lucide_react18.Pencil, { className: "w-3.5 h-3.5" })),
-      !isUser && onRetry && /* @__PURE__ */ import_react80.default.createElement(ActionButton2, { onClick: onRetry, label: "Regenerate response" }, /* @__PURE__ */ import_react80.default.createElement(import_lucide_react18.RotateCcw, { className: "w-3.5 h-3.5" }))
+      /* @__PURE__ */ import_react82.default.createElement(ActionButton2, { onClick: handleCopy, label: copied ? "Copied!" : "Copy message" }, copied ? /* @__PURE__ */ import_react82.default.createElement(import_lucide_react20.Check, { className: "w-3.5 h-3.5 text-success" }) : /* @__PURE__ */ import_react82.default.createElement(import_lucide_react20.Copy, { className: "w-3.5 h-3.5" })),
+      isUser && onEdit && /* @__PURE__ */ import_react82.default.createElement(ActionButton2, { onClick: handleStartEdit, label: "Edit message" }, /* @__PURE__ */ import_react82.default.createElement(import_lucide_react20.Pencil, { className: "w-3.5 h-3.5" })),
+      !isUser && onRetry && /* @__PURE__ */ import_react82.default.createElement(ActionButton2, { onClick: onRetry, label: "Regenerate response" }, /* @__PURE__ */ import_react82.default.createElement(import_lucide_react20.RotateCcw, { className: "w-3.5 h-3.5" }))
     );
   }
 );
 MessageActions.displayName = "MessageActions";
 
 // src/components/chat/BranchNavigator.tsx
-var import_react81 = __toESM(require("react"));
-var import_lucide_react19 = require("lucide-react");
-var BranchNavigator = import_react81.default.forwardRef(
+var import_react83 = __toESM(require("react"));
+var import_lucide_react21 = require("lucide-react");
+var BranchNavigator = import_react83.default.forwardRef(
   ({
     current,
     total,
@@ -7166,7 +7409,7 @@ var BranchNavigator = import_react81.default.forwardRef(
     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__ */ import_react81.default.createElement(
+    return /* @__PURE__ */ import_react83.default.createElement(
       "div",
       {
         ref,
@@ -7178,8 +7421,8 @@ var BranchNavigator = import_react81.default.forwardRef(
         "aria-label": "Branch navigation",
         ...rest
       },
-      showIcon && /* @__PURE__ */ import_react81.default.createElement(import_lucide_react19.GitBranch, { className: cx(iconSize, "mr-0.5 text-silver/50"), "aria-hidden": "true" }),
-      /* @__PURE__ */ import_react81.default.createElement(
+      showIcon && /* @__PURE__ */ import_react83.default.createElement(import_lucide_react21.GitBranch, { className: cx(iconSize, "mr-0.5 text-silver/50"), "aria-hidden": "true" }),
+      /* @__PURE__ */ import_react83.default.createElement(
         "button",
         {
           type: "button",
@@ -7192,10 +7435,10 @@ var BranchNavigator = import_react81.default.forwardRef(
           ),
           "aria-label": "Previous branch"
         },
-        /* @__PURE__ */ import_react81.default.createElement(import_lucide_react19.ChevronLeft, { className: iconSize })
+        /* @__PURE__ */ import_react83.default.createElement(import_lucide_react21.ChevronLeft, { className: iconSize })
       ),
-      /* @__PURE__ */ import_react81.default.createElement("span", { className: cx(textSize, "tabular-nums min-w-6 text-center") }, current, "/", total),
-      /* @__PURE__ */ import_react81.default.createElement(
+      /* @__PURE__ */ import_react83.default.createElement("span", { className: cx(textSize, "tabular-nums min-w-6 text-center") }, current, "/", total),
+      /* @__PURE__ */ import_react83.default.createElement(
         "button",
         {
           type: "button",
@@ -7208,7 +7451,7 @@ var BranchNavigator = import_react81.default.forwardRef(
           ),
           "aria-label": "Next branch"
         },
-        /* @__PURE__ */ import_react81.default.createElement(import_lucide_react19.ChevronRight, { className: iconSize })
+        /* @__PURE__ */ import_react83.default.createElement(import_lucide_react21.ChevronRight, { className: iconSize })
       )
     );
   }
@@ -7216,16 +7459,16 @@ var BranchNavigator = import_react81.default.forwardRef(
 BranchNavigator.displayName = "BranchNavigator";
 
 // src/components/BrandIcon.tsx
-var import_react82 = __toESM(require("react"));
+var import_react84 = __toESM(require("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 = import_react82.default.forwardRef(
+var BrandIcon = import_react84.default.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__ */ import_react82.default.createElement(
+    return /* @__PURE__ */ import_react84.default.createElement(
       "div",
       {
         ref,
@@ -7244,17 +7487,17 @@ var BrandIcon = import_react82.default.forwardRef(
 BrandIcon.displayName = "BrandIcon";
 
 // src/components/ColorSwatch.tsx
-var import_react83 = __toESM(require("react"));
-var ColorSwatch = import_react83.default.forwardRef(
+var import_react85 = __toESM(require("react"));
+var ColorSwatch = import_react85.default.forwardRef(
   ({ color, label, className, ...rest }, ref) => {
-    return /* @__PURE__ */ import_react83.default.createElement(
+    return /* @__PURE__ */ import_react85.default.createElement(
       "div",
       {
         ref,
         className: cx("flex flex-col items-center gap-2", className),
         ...rest
       },
-      /* @__PURE__ */ import_react83.default.createElement(
+      /* @__PURE__ */ import_react85.default.createElement(
         "div",
         {
           className: "h-16 w-16 border-2 border-ash rounded-none shadow-sm",
@@ -7262,22 +7505,22 @@ var ColorSwatch = import_react83.default.forwardRef(
           "aria-label": label || color
         }
       ),
-      label && /* @__PURE__ */ import_react83.default.createElement("span", { className: "text-xs text-silver font-medium" }, label)
+      label && /* @__PURE__ */ import_react85.default.createElement("span", { className: "text-xs text-silver font-medium" }, label)
     );
   }
 );
 ColorSwatch.displayName = "ColorSwatch";
 
 // src/components/SectionHeading.tsx
-var import_react84 = __toESM(require("react"));
+var import_react86 = __toESM(require("react"));
 var levelStyles = {
   h2: "text-2xl mb-4",
   h3: "text-xl mb-3"
 };
-var SectionHeading = import_react84.default.forwardRef(
+var SectionHeading = import_react86.default.forwardRef(
   ({ level = "h2", children, className, ...rest }, ref) => {
     const Component = level;
-    return /* @__PURE__ */ import_react84.default.createElement(
+    return /* @__PURE__ */ import_react86.default.createElement(
       Component,
       {
         ref,
@@ -7334,6 +7577,7 @@ var version = "2.0.0";
   ChatView,
   CheckSquareIcon,
   Checkbox,
+  Checkpoint,
   ChevronLeftIcon,
   ChevronRightIcon,
   CloseIcon,
@@ -7347,6 +7591,7 @@ var version = "2.0.0";
   EmptySquareIcon,
   ExpandIcon,
   FileChip,
+  GreyedDivider,
   HelperText,
   HistoryIcon,
   HistoryPanel,
@@ -7424,16 +7669,22 @@ var version = "2.0.0";
   ToolSidebar,
   Tooltip,
   VideoCard,
-  addMessageToTree,
+  addNodeToTree,
   areAllTasksSettled,
   createEmptyTree,
+  createPreviewUrl,
+  findAncestor,
   generateId,
-  getActivePathMessages,
+  getActivePath,
+  getGreyedFuture,
   getSiblingInfo,
   isBranchPoint,
+  isImageFile,
   messagesToTree,
+  revokePreviewUrl,
+  setActiveLeaf,
   switchBranch,
-  updateNodeContent,
+  updateMessageContent,
   useArtifactTreeNavigation,
   useResizable,
   useScrollAnchor,