@tangle-network/agent-app 0.43.50 → 0.43.51

package/dist/{chunk-O6H2WD3I.js → chunk-EIG7ZQW2.js}

@@ -1,6 +1,22 @@
+import {
+  ATTACHMENT_ACCEPT,
+  ATTACHMENT_MAX_COUNT,
+  MAX_ATTACHMENT_TOTAL_BYTES,
+  MAX_BINARY_ATTACHMENT_BYTES,
+  MAX_TEXT_ATTACHMENT_BYTES,
+  attachmentSizeErrorMessage,
+  attachmentTotalSizeErrorMessage,
+  checkAttachmentType,
+  sanitizeAttachmentFileName,
+  sniffBinary
+} from "./chunk-3EKOSBYL.js";
 import {
   stepActivityFlowTrace
 } from "./chunk-2QI7XV2T.js";
+import {
+  attachmentPartsFromMessageParts,
+  formatBytes
+} from "./chunk-JGYOYY5D.js";
 import {
   cancelStatusFor,
   fieldAcceptsFreeText,
@@ -21,7 +37,7 @@ import {
 } from "./chunk-MCJSS6SM.js";
 
 // src/web-react/index.tsx
-import { useEffect as useEffect8, useMemo as useMemo7, useRef as useRef8, useState as useState12, memo } from "react";
+import { useEffect as useEffect10, useMemo as useMemo8, useRef as useRef9, useState as useState14, memo } from "react";
 
 // src/web-react/smooth-text.ts
 import { useEffect, useRef, useState } from "react";
@@ -1145,6 +1161,176 @@ function DurableChatCards({
   }) });
 }
 
+// src/web-react/message-attachments.tsx
+import { useCallback, useEffect as useEffect5, useState as useState6 } from "react";
+import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
+function FileGlyph({ className }) {
+  return /* @__PURE__ */ jsxs6("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
+    /* @__PURE__ */ jsx8("path", { d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" }),
+    /* @__PURE__ */ jsx8("path", { d: "M14 2v6h6" })
+  ] });
+}
+function ImageGlyph({ className }) {
+  return /* @__PURE__ */ jsxs6("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
+    /* @__PURE__ */ jsx8("rect", { x: "3", y: "3", width: "18", height: "18", rx: "2" }),
+    /* @__PURE__ */ jsx8("circle", { cx: "9", cy: "9", r: "2" }),
+    /* @__PURE__ */ jsx8("path", { d: "m21 15-5-5L5 21" })
+  ] });
+}
+function WarningGlyph({ className }) {
+  return /* @__PURE__ */ jsx8("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx8("path", { d: "M12 9v4m0 4h.01M10.29 3.86 1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0Z" }) });
+}
+function iconForMediaType(mediaType) {
+  return mediaType?.startsWith("image/") ? ImageGlyph : FileGlyph;
+}
+var attachmentFileCache = /* @__PURE__ */ new Map();
+function __resetAttachmentFileCacheForTests() {
+  attachmentFileCache.clear();
+}
+async function defaultFetchFile(url) {
+  return fetch(url, { credentials: "same-origin" });
+}
+async function fetchAttachmentFile(url, fetchFile) {
+  try {
+    const res = await fetchFile(url);
+    if (!res.ok) return { ok: false, message: `Failed to load attachment (${res.status})` };
+    return { ok: true, blob: await res.blob() };
+  } catch (err) {
+    return { ok: false, message: err instanceof Error && err.message ? err.message : "Network error loading attachment" };
+  }
+}
+function loadAttachmentFile(url, fetchFile = defaultFetchFile) {
+  const cached = attachmentFileCache.get(url);
+  if (cached) return cached;
+  const promise = fetchAttachmentFile(url, fetchFile);
+  attachmentFileCache.set(url, promise);
+  void promise.then((result) => {
+    if (!result.ok && attachmentFileCache.get(url) === promise) attachmentFileCache.delete(url);
+  });
+  return promise;
+}
+function triggerAttachmentDownload(name, blob) {
+  try {
+    const url = URL.createObjectURL(blob);
+    const link = document.createElement("a");
+    link.href = url;
+    link.download = name;
+    document.body.appendChild(link);
+    link.click();
+    link.remove();
+    URL.revokeObjectURL(url);
+    return { ok: true };
+  } catch (err) {
+    return { ok: false, message: err instanceof Error && err.message ? err.message : "Failed to download attachment" };
+  }
+}
+function useAttachmentObjectUrl(blob) {
+  const [url, setUrl] = useState6(null);
+  useEffect5(() => {
+    if (!blob) {
+      setUrl(null);
+      return;
+    }
+    const objectUrl = URL.createObjectURL(blob);
+    setUrl(objectUrl);
+    return () => URL.revokeObjectURL(objectUrl);
+  }, [blob]);
+  return url;
+}
+function AttachmentThumbnailError({ name }) {
+  return /* @__PURE__ */ jsxs6("span", { className: "inline-flex h-16 w-16 shrink-0 flex-col items-center justify-center gap-1 rounded-md border border-destructive/40 bg-destructive/10 px-1 text-center text-destructive", children: [
+    /* @__PURE__ */ jsx8(WarningGlyph, { className: "h-4 w-4 shrink-0" }),
+    /* @__PURE__ */ jsx8("span", { className: "line-clamp-2 text-[10px] leading-tight", children: name })
+  ] });
+}
+function AttachmentThumbnail({ part, resolveFileUrl, fetchFile }) {
+  const url = resolveFileUrl(part);
+  const [result, setResult] = useState6(null);
+  useEffect5(() => {
+    let cancelled = false;
+    setResult(null);
+    loadAttachmentFile(url, fetchFile).then((next) => {
+      if (!cancelled) setResult(next);
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [url, fetchFile]);
+  const objectUrl = useAttachmentObjectUrl(result?.ok ? result.blob : void 0);
+  const handleClick = useCallback(() => {
+    if (!objectUrl) return;
+    window.open(objectUrl, "_blank", "noopener");
+  }, [objectUrl]);
+  if (!result) {
+    return /* @__PURE__ */ jsx8("span", { className: "inline-block h-16 w-16 shrink-0 animate-pulse rounded-md bg-muted", "aria-hidden": true });
+  }
+  if (!result.ok || !objectUrl) {
+    return /* @__PURE__ */ jsx8(AttachmentThumbnailError, { name: part.name });
+  }
+  return /* @__PURE__ */ jsx8(
+    "button",
+    {
+      type: "button",
+      onClick: handleClick,
+      "aria-label": `Open ${part.name}`,
+      className: "h-16 w-16 shrink-0 overflow-hidden rounded-md border border-border focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",
+      children: /* @__PURE__ */ jsx8("img", { src: objectUrl, alt: part.name, className: "h-16 w-16 object-cover" })
+    }
+  );
+}
+function AttachmentChip({ part, resolveFileUrl, fetchFile }) {
+  const [status, setStatus] = useState6("idle");
+  const [errorMessage, setErrorMessage] = useState6(null);
+  const handleClick = useCallback(() => {
+    if (status === "loading") return;
+    setStatus("loading");
+    setErrorMessage(null);
+    const url = resolveFileUrl(part);
+    void loadAttachmentFile(url, fetchFile).then((result) => {
+      if (!result.ok) {
+        setStatus("error");
+        setErrorMessage(result.message);
+        return;
+      }
+      const download = triggerAttachmentDownload(part.name, result.blob);
+      if (!download.ok) {
+        setStatus("error");
+        setErrorMessage(download.message);
+        return;
+      }
+      setStatus("idle");
+    });
+  }, [status, resolveFileUrl, part, fetchFile]);
+  const Icon = status === "error" ? WarningGlyph : iconForMediaType(part.mediaType);
+  const className = [
+    "inline-flex items-center gap-1 rounded-md border px-2 py-0.5 text-[11px]",
+    status === "error" ? "border-destructive/40 bg-destructive/10 text-destructive" : "border-border bg-muted/60 text-muted-foreground"
+  ].join(" ");
+  return /* @__PURE__ */ jsxs6(
+    "button",
+    {
+      type: "button",
+      onClick: handleClick,
+      title: status === "error" ? errorMessage ?? void 0 : void 0,
+      className,
+      children: [
+        /* @__PURE__ */ jsx8(Icon, { className: "h-3 w-3 shrink-0" }),
+        part.name,
+        typeof part.size === "number" && /* @__PURE__ */ jsxs6("span", { className: "text-muted-foreground/70", children: [
+          "\xB7 ",
+          formatBytes(part.size)
+        ] })
+      ]
+    }
+  );
+}
+function MessageAttachments({ parts, resolveFileUrl, justify = "end", fetchFile }) {
+  if (parts.length === 0) return null;
+  return /* @__PURE__ */ jsx8("div", { className: `flex flex-wrap gap-1.5 ${justify === "start" ? "justify-start" : "justify-end"}`, children: parts.map(
+    (part) => part.type === "image" ? /* @__PURE__ */ jsx8(AttachmentThumbnail, { part, resolveFileUrl, fetchFile }, `${part.path}:${part.name}`) : /* @__PURE__ */ jsx8(AttachmentChip, { part, resolveFileUrl, fetchFile }, `${part.path}:${part.name}`)
+  ) });
+}
+
 // src/web-react/chat-stream.ts
 function dispatchChatStreamLine(line, cb) {
   let receivedContent = false;
@@ -1315,32 +1501,32 @@ async function streamChatTurn(opts) {
 
 // src/web-react/chat-composer.tsx
 import {
-  useCallback,
-  useEffect as useEffect5,
+  useCallback as useCallback2,
+  useEffect as useEffect6,
   useRef as useRef5,
-  useState as useState6
+  useState as useState7
 } from "react";
-import { Fragment as Fragment3, jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
 function SendGlyph({ className }) {
-  return /* @__PURE__ */ jsx8("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx8("path", { d: "M22 2 11 13M22 2l-7 20-4-9-9-4 20-7z" }) });
+  return /* @__PURE__ */ jsx9("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx9("path", { d: "M22 2 11 13M22 2l-7 20-4-9-9-4 20-7z" }) });
 }
 function StopGlyph({ className }) {
-  return /* @__PURE__ */ jsx8("svg", { className, viewBox: "0 0 24 24", fill: "currentColor", "aria-hidden": true, children: /* @__PURE__ */ jsx8("rect", { x: "6", y: "6", width: "12", height: "12", rx: "2" }) });
+  return /* @__PURE__ */ jsx9("svg", { className, viewBox: "0 0 24 24", fill: "currentColor", "aria-hidden": true, children: /* @__PURE__ */ jsx9("rect", { x: "6", y: "6", width: "12", height: "12", rx: "2" }) });
 }
 function PaperclipGlyph({ className }) {
-  return /* @__PURE__ */ jsx8("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx8("path", { d: "m21.44 11.05-9.19 9.19a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.83-2.83l8.49-8.48" }) });
+  return /* @__PURE__ */ jsx9("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx9("path", { d: "m21.44 11.05-9.19 9.19a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.83-2.83l8.49-8.48" }) });
 }
 function FolderGlyph({ className }) {
-  return /* @__PURE__ */ jsxs6("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
-    /* @__PURE__ */ jsx8("path", { d: "M4 20h16a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.93a2 2 0 0 1-1.66-.9l-.82-1.2A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13c0 1.1.9 2 2 2Z" }),
-    /* @__PURE__ */ jsx8("path", { d: "M12 10v6m-3-3h6" })
+  return /* @__PURE__ */ jsxs7("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
+    /* @__PURE__ */ jsx9("path", { d: "M4 20h16a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.93a2 2 0 0 1-1.66-.9l-.82-1.2A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13c0 1.1.9 2 2 2Z" }),
+    /* @__PURE__ */ jsx9("path", { d: "M12 10v6m-3-3h6" })
   ] });
 }
 function CloseGlyph({ className }) {
-  return /* @__PURE__ */ jsx8("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx8("path", { d: "M18 6 6 18M6 6l12 12" }) });
+  return /* @__PURE__ */ jsx9("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx9("path", { d: "M18 6 6 18M6 6l12 12" }) });
 }
 function UploadGlyph({ className }) {
-  return /* @__PURE__ */ jsx8("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx8("path", { d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4M17 8l-5-5-5 5M12 3v12" }) });
+  return /* @__PURE__ */ jsx9("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx9("path", { d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4M17 8l-5-5-5 5M12 3v12" }) });
 }
 var MAX_HEIGHT = 168;
 function ChatComposer({
@@ -1369,21 +1555,21 @@ function ChatComposer({
   className
 }) {
   const isControlled = value !== void 0;
-  const [internal, setInternal] = useState6(initialValue ?? "");
+  const [internal, setInternal] = useState7(initialValue ?? "");
   const text = isControlled ? value : internal;
   const textareaRef = useRef5(null);
   const fileInputRef = useRef5(null);
   const folderInputRef = useRef5(null);
-  const [dragOver, setDragOver] = useState6(false);
+  const [dragOver, setDragOver] = useState7(false);
   const dragDepth = useRef5(0);
-  const setText = useCallback(
+  const setText = useCallback2(
     (next) => {
       if (!isControlled) setInternal(next);
       onValueChange?.(next);
     },
     [isControlled, onValueChange]
   );
-  useEffect5(() => {
+  useEffect6(() => {
     const el = textareaRef.current;
     if (!el) return;
     el.style.height = "auto";
@@ -1391,7 +1577,7 @@ function ChatComposer({
   }, [text]);
   const prevSeedRef = useRef5(null);
   const pendingCaretRef = useRef5(null);
-  useEffect5(() => {
+  useEffect6(() => {
     const prev = prevSeedRef.current;
     prevSeedRef.current = seed ?? null;
     if (seed == null || seed === prev || isControlled) return;
@@ -1405,7 +1591,7 @@ function ChatComposer({
       pendingCaretRef.current = seed;
     }
   }, [seed, setText, onSeedApplied, isControlled]);
-  useEffect5(() => {
+  useEffect6(() => {
     if (pendingCaretRef.current == null || pendingCaretRef.current !== text)
       return;
     pendingCaretRef.current = null;
@@ -1414,7 +1600,7 @@ function ChatComposer({
     el.focus();
     el.setSelectionRange(text.length, text.length);
   }, [text]);
-  useEffect5(() => {
+  useEffect6(() => {
     if (!focusShortcut || disabled) return;
     function onKeyDown(e) {
       if ((e.metaKey || e.ctrlKey) && e.key.toLowerCase() === "l") {
@@ -1425,20 +1611,20 @@ function ChatComposer({
     document.addEventListener("keydown", onKeyDown);
     return () => document.removeEventListener("keydown", onKeyDown);
   }, [focusShortcut, disabled]);
-  const readyParts = pendingFiles.filter((f) => f.status === "ready" && f.part).map((f) => f.part);
-  const hasSendable = onSendParts ? text.trim().length > 0 || readyParts.length > 0 : text.trim().length > 0;
+  const readyFileCount = pendingFiles.filter((f) => f.status === "ready").length;
+  const hasSendable = text.trim().length > 0 || readyFileCount > 0;
   const canSend = hasSendable && !isStreaming && !disabled;
-  const send = useCallback(() => {
+  const send = useCallback2(() => {
     const trimmed = text.trim();
     if (isStreaming || disabled) return;
+    const readyFiles = pendingFiles.filter((f) => f.status === "ready");
+    if (!trimmed && readyFiles.length === 0) return;
     if (onSendParts) {
-      const parts = pendingFiles.filter((f) => f.status === "ready" && f.part).map((f) => f.part);
-      if (!trimmed && parts.length === 0) return;
+      const parts = readyFiles.filter((f) => f.part).map((f) => f.part);
       onSendParts(trimmed, parts);
       setText("");
       return;
     }
-    if (!trimmed) return;
     onSend?.(trimmed);
     setText("");
   }, [text, isStreaming, disabled, onSend, onSendParts, pendingFiles, setText]);
@@ -1457,13 +1643,13 @@ function ChatComposer({
     if (e.target.files?.length) (onAttachFolder ?? onAttach)?.(e.target.files);
     e.target.value = "";
   };
-  const handleDragEnter = useCallback((e) => {
+  const handleDragEnter = useCallback2((e) => {
     e.preventDefault();
     e.stopPropagation();
     dragDepth.current++;
     if (e.dataTransfer?.types.includes("Files")) setDragOver(true);
   }, []);
-  const handleDragLeave = useCallback((e) => {
+  const handleDragLeave = useCallback2((e) => {
     e.preventDefault();
     e.stopPropagation();
     dragDepth.current--;
@@ -1472,12 +1658,12 @@ function ChatComposer({
       setDragOver(false);
     }
   }, []);
-  const handleDragOver = useCallback((e) => {
+  const handleDragOver = useCallback2((e) => {
     e.preventDefault();
     e.stopPropagation();
     if (e.dataTransfer) e.dataTransfer.dropEffect = "copy";
   }, []);
-  const handleDrop = useCallback(
+  const handleDrop = useCallback2(
     (e) => {
       e.preventDefault();
       e.stopPropagation();
@@ -1492,7 +1678,7 @@ function ChatComposer({
   const fileChips = pendingFiles.filter((f) => f.kind !== "folder");
   const showFooter = controls != null && controlsPlacement === "footer";
   const showAbove = controls != null && controlsPlacement === "above";
-  return /* @__PURE__ */ jsxs6(
+  return /* @__PURE__ */ jsxs7(
     "div",
     {
       className: `relative ${className ?? ""}`,
@@ -1501,42 +1687,42 @@ function ChatComposer({
       onDragOver: onAttach ? handleDragOver : void 0,
       onDrop: onAttach ? handleDrop : void 0,
       children: [
-        dragOver && /* @__PURE__ */ jsx8("div", { className: "pointer-events-none absolute inset-0 z-10 flex items-center justify-center rounded-2xl border-2 border-dashed border-primary/50 bg-card/95", children: /* @__PURE__ */ jsxs6("div", { className: "text-center", children: [
-          /* @__PURE__ */ jsx8("span", { className: "mx-auto mb-2 flex h-11 w-11 items-center justify-center rounded-xl bg-primary/10 text-primary", children: /* @__PURE__ */ jsx8(UploadGlyph, { className: "h-5 w-5" }) }),
-          /* @__PURE__ */ jsx8("p", { className: "text-sm font-semibold text-foreground", children: dropTitle }),
-          /* @__PURE__ */ jsx8("p", { className: "mt-0.5 text-xs text-muted-foreground", children: dropDescription })
+        dragOver && /* @__PURE__ */ jsx9("div", { className: "pointer-events-none absolute inset-0 z-10 flex items-center justify-center rounded-2xl border-2 border-dashed border-primary/50 bg-card/95", children: /* @__PURE__ */ jsxs7("div", { className: "text-center", children: [
+          /* @__PURE__ */ jsx9("span", { className: "mx-auto mb-2 flex h-11 w-11 items-center justify-center rounded-xl bg-primary/10 text-primary", children: /* @__PURE__ */ jsx9(UploadGlyph, { className: "h-5 w-5" }) }),
+          /* @__PURE__ */ jsx9("p", { className: "text-sm font-semibold text-foreground", children: dropTitle }),
+          /* @__PURE__ */ jsx9("p", { className: "mt-0.5 text-xs text-muted-foreground", children: dropDescription })
         ] }) }),
-        showAbove && /* @__PURE__ */ jsx8("div", { className: "mb-1.5 flex flex-wrap items-center gap-1.5 px-1", children: controls }),
-        pendingFiles.length > 0 && /* @__PURE__ */ jsx8("div", { className: "mb-2 flex flex-wrap gap-1.5", children: [...folderChips, ...fileChips].map((f) => /* @__PURE__ */ jsxs6(
+        showAbove && /* @__PURE__ */ jsx9("div", { className: "mb-1.5 flex flex-wrap items-center gap-1.5 px-1", children: controls }),
+        pendingFiles.length > 0 && /* @__PURE__ */ jsx9("div", { className: "mb-2 flex flex-wrap gap-1.5", children: [...folderChips, ...fileChips].map((f) => /* @__PURE__ */ jsxs7(
           "span",
           {
             className: `inline-flex items-center gap-1.5 rounded-full border px-2.5 py-1 text-xs ${f.status === "error" ? "border-destructive/40 text-destructive" : "border-border bg-muted/50 text-foreground"}`,
             children: [
-              f.kind === "folder" ? /* @__PURE__ */ jsx8(FolderGlyph, { className: "h-3 w-3 shrink-0" }) : /* @__PURE__ */ jsx8(PaperclipGlyph, { className: "h-3 w-3 shrink-0" }),
-              /* @__PURE__ */ jsx8("span", { className: "max-w-[150px] truncate", children: f.name }),
-              f.fileCount !== void 0 && /* @__PURE__ */ jsxs6("span", { className: "text-muted-foreground", children: [
+              f.kind === "folder" ? /* @__PURE__ */ jsx9(FolderGlyph, { className: "h-3 w-3 shrink-0" }) : /* @__PURE__ */ jsx9(PaperclipGlyph, { className: "h-3 w-3 shrink-0" }),
+              /* @__PURE__ */ jsx9("span", { className: "max-w-[150px] truncate", children: f.name }),
+              f.fileCount !== void 0 && /* @__PURE__ */ jsxs7("span", { className: "text-muted-foreground", children: [
                 "(",
                 f.fileCount,
                 ")"
               ] }),
-              f.status === "uploading" && /* @__PURE__ */ jsx8("span", { className: "h-3 w-3 animate-spin rounded-full border-2 border-primary border-t-transparent" }),
-              onRemoveFile && /* @__PURE__ */ jsx8(
+              f.status === "uploading" && /* @__PURE__ */ jsx9("span", { className: "h-3 w-3 animate-spin rounded-full border-2 border-primary border-t-transparent" }),
+              onRemoveFile && /* @__PURE__ */ jsx9(
                 "button",
                 {
                   type: "button",
                   "aria-label": `Remove ${f.name}`,
                   onClick: () => onRemoveFile(f.id),
                   className: "rounded p-0.5 text-muted-foreground transition hover:text-foreground focus:outline-none focus-visible:ring-2 focus-visible:ring-ring",
-                  children: /* @__PURE__ */ jsx8(CloseGlyph, { className: "h-3 w-3" })
+                  children: /* @__PURE__ */ jsx9(CloseGlyph, { className: "h-3 w-3" })
                 }
               )
             ]
           },
           f.id
         )) }),
-        /* @__PURE__ */ jsxs6("div", { className: "flex items-end gap-2 rounded-2xl border border-border bg-card px-2.5 py-2 transition focus-within:border-primary/40 focus-within:ring-2 focus-within:ring-primary/15", children: [
-          onAttach && /* @__PURE__ */ jsxs6(Fragment3, { children: [
-            /* @__PURE__ */ jsx8(
+        /* @__PURE__ */ jsxs7("div", { className: "flex items-end gap-2 rounded-2xl border border-border bg-card px-2.5 py-2 transition focus-within:border-primary/40 focus-within:ring-2 focus-within:ring-primary/15", children: [
+          onAttach && /* @__PURE__ */ jsxs7(Fragment3, { children: [
+            /* @__PURE__ */ jsx9(
               "button",
               {
                 type: "button",
@@ -1545,13 +1731,13 @@ function ChatComposer({
                 "aria-label": "Attach files",
                 title: "Attach files",
                 className: "mb-0.5 shrink-0 rounded-lg p-2 text-muted-foreground transition hover:bg-accent/40 hover:text-foreground disabled:opacity-50 focus:outline-none focus-visible:ring-2 focus-visible:ring-ring",
-                children: /* @__PURE__ */ jsx8(PaperclipGlyph, { className: "h-4 w-4" })
+                children: /* @__PURE__ */ jsx9(PaperclipGlyph, { className: "h-4 w-4" })
               }
             ),
-            /* @__PURE__ */ jsx8("input", { ref: fileInputRef, type: "file", multiple: true, className: "hidden", accept, onChange: handleFileChange })
+            /* @__PURE__ */ jsx9("input", { ref: fileInputRef, type: "file", multiple: true, className: "hidden", accept, onChange: handleFileChange })
           ] }),
-          onAttachFolder && /* @__PURE__ */ jsxs6(Fragment3, { children: [
-            /* @__PURE__ */ jsx8(
+          onAttachFolder && /* @__PURE__ */ jsxs7(Fragment3, { children: [
+            /* @__PURE__ */ jsx9(
               "button",
               {
                 type: "button",
@@ -1560,10 +1746,10 @@ function ChatComposer({
                 "aria-label": "Attach folder",
                 title: "Attach folder",
                 className: "mb-0.5 shrink-0 rounded-lg p-2 text-muted-foreground transition hover:bg-accent/40 hover:text-foreground disabled:opacity-50 focus:outline-none focus-visible:ring-2 focus-visible:ring-ring",
-                children: /* @__PURE__ */ jsx8(FolderGlyph, { className: "h-4 w-4" })
+                children: /* @__PURE__ */ jsx9(FolderGlyph, { className: "h-4 w-4" })
               }
             ),
-            /* @__PURE__ */ jsx8(
+            /* @__PURE__ */ jsx9(
               "input",
               {
                 ref: folderInputRef,
@@ -1575,7 +1761,7 @@ function ChatComposer({
               }
             )
           ] }),
-          /* @__PURE__ */ jsx8(
+          /* @__PURE__ */ jsx9(
             "textarea",
             {
               ref: textareaRef,
@@ -1589,8 +1775,8 @@ function ChatComposer({
               className: "max-h-[168px] min-h-[40px] flex-1 resize-none bg-transparent px-1.5 py-2 text-[15px] leading-6 text-foreground outline-none placeholder:text-muted-foreground disabled:opacity-50"
             }
           ),
-          showFooter && /* @__PURE__ */ jsx8("div", { className: "mb-0.5 flex shrink-0 items-center gap-1.5", children: controls }),
-          isStreaming ? /* @__PURE__ */ jsxs6(
+          showFooter && /* @__PURE__ */ jsx9("div", { className: "mb-0.5 flex shrink-0 items-center gap-1.5", children: controls }),
+          isStreaming ? /* @__PURE__ */ jsxs7(
             "button",
             {
               type: "button",
@@ -1598,11 +1784,11 @@ function ChatComposer({
               "aria-label": "Stop response",
               className: "mb-0.5 inline-flex shrink-0 items-center gap-1.5 rounded-full bg-destructive/15 px-3.5 py-2 text-sm font-medium text-destructive transition hover:bg-destructive/25 focus:outline-none focus-visible:ring-2 focus-visible:ring-destructive/50",
               children: [
-                /* @__PURE__ */ jsx8(StopGlyph, { className: "h-3.5 w-3.5" }),
-                /* @__PURE__ */ jsx8("span", { children: "Stop" })
+                /* @__PURE__ */ jsx9(StopGlyph, { className: "h-3.5 w-3.5" }),
+                /* @__PURE__ */ jsx9("span", { children: "Stop" })
               ]
             }
-          ) : /* @__PURE__ */ jsxs6(
+          ) : /* @__PURE__ */ jsxs7(
             "button",
             {
               type: "button",
@@ -1611,16 +1797,16 @@ function ChatComposer({
               "aria-label": sendLabel,
               className: "mb-0.5 inline-flex shrink-0 items-center gap-1.5 rounded-full bg-primary px-3.5 py-2 text-sm font-medium text-primary-foreground shadow-sm transition hover:bg-primary/90 disabled:cursor-not-allowed disabled:opacity-40 focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1 focus-visible:ring-offset-card",
               children: [
-                /* @__PURE__ */ jsx8(SendGlyph, { className: "h-3.5 w-3.5" }),
-                /* @__PURE__ */ jsx8("span", { children: sendLabel })
+                /* @__PURE__ */ jsx9(SendGlyph, { className: "h-3.5 w-3.5" }),
+                /* @__PURE__ */ jsx9("span", { children: sendLabel })
               ]
             }
           )
         ] }),
-        focusShortcut && /* @__PURE__ */ jsx8("div", { className: "mt-1.5 flex justify-end px-1", children: /* @__PURE__ */ jsxs6("span", { className: "text-xs text-muted-foreground", children: [
-          /* @__PURE__ */ jsx8("kbd", { className: "rounded border border-border bg-background px-1 py-0.5 text-[10px]", children: "Cmd" }),
-          /* @__PURE__ */ jsx8("kbd", { className: "ml-0.5 rounded border border-border bg-background px-1 py-0.5 text-[10px]", children: "L" }),
-          /* @__PURE__ */ jsx8("span", { className: "ml-1", children: "to focus" })
+        focusShortcut && /* @__PURE__ */ jsx9("div", { className: "mt-1.5 flex justify-end px-1", children: /* @__PURE__ */ jsxs7("span", { className: "text-xs text-muted-foreground", children: [
+          /* @__PURE__ */ jsx9("kbd", { className: "rounded border border-border bg-background px-1 py-0.5 text-[10px]", children: "Cmd" }),
+          /* @__PURE__ */ jsx9("kbd", { className: "ml-0.5 rounded border border-border bg-background px-1 py-0.5 text-[10px]", children: "L" }),
+          /* @__PURE__ */ jsx9("span", { className: "ml-1", children: "to focus" })
         ] }) })
       ]
     }
@@ -1628,7 +1814,7 @@ function ChatComposer({
 }
 
 // src/web-react/durable-plan-flow.ts
-import { useCallback as useCallback2, useEffect as useEffect6, useRef as useRef6, useState as useState7 } from "react";
+import { useCallback as useCallback3, useEffect as useEffect7, useRef as useRef6, useState as useState8 } from "react";
 var DurablePlanClientError = class extends Error {
   constructor(message, status, code, currentPlan) {
     super(message);
@@ -1715,14 +1901,14 @@ function createDurablePlanDecisionClient(options) {
   };
 }
 function useDurablePlanFlow(options) {
-  const [plan, setPlan] = useState7(options.plan);
-  const [deciding, setDeciding] = useState7(null);
-  const [restoring, setRestoring] = useState7(false);
-  const [error, setError] = useState7(null);
+  const [plan, setPlan] = useState8(options.plan);
+  const [deciding, setDeciding] = useState8(null);
+  const [restoring, setRestoring] = useState8(false);
+  const [error, setError] = useState8(null);
   const attachments = useRef6(/* @__PURE__ */ new Map());
   const decisionInFlight = useRef6(false);
-  useEffect6(() => setPlan(options.plan), [options.plan]);
-  const apply = useCallback2(async (result) => {
+  useEffect7(() => setPlan(options.plan), [options.plan]);
+  const apply = useCallback3(async (result) => {
     setPlan(result.plan);
     options.onUpdated?.(result.plan);
     const receipt = result.followUp;
@@ -1735,7 +1921,7 @@ function useDurablePlanFlow(options) {
     }
     await pending;
   }, [options.attachFollowUp, options.onUpdated]);
-  const decide = useCallback2(async (decision, feedback) => {
+  const decide = useCallback3(async (decision, feedback) => {
     if (decisionInFlight.current) return null;
     decisionInFlight.current = true;
     setDeciding(decision);
@@ -1761,7 +1947,7 @@ function useDurablePlanFlow(options) {
       setDeciding(null);
     }
   }, [apply, options.client, options.onUpdated, plan.planId, plan.revision]);
-  const restore = useCallback2(async () => {
+  const restore = useCallback3(async () => {
     setRestoring(true);
     setError(null);
     try {
@@ -1890,7 +2076,7 @@ function createDurableInteractionAnswerSubmitter(options) {
 }
 
 // src/web-react/use-chat-interactions.ts
-import { useCallback as useCallback3, useMemo as useMemo4, useState as useState8 } from "react";
+import { useCallback as useCallback4, useMemo as useMemo4, useState as useState9 } from "react";
 function hasPendingContentDuplicate(list, interaction) {
   if (interaction.status !== "pending") return false;
   const signature = questionInteractionContentSignature(interaction);
@@ -1969,34 +2155,34 @@ function hydrateChatInteractions(list, persisted) {
   return persisted.reduce(upsertChatInteraction, list);
 }
 function useChatInteractions(options = {}) {
-  const [interactions, setInteractions] = useState8([]);
-  const upsert = useCallback3((interaction) => {
+  const [interactions, setInteractions] = useState9([]);
+  const upsert = useCallback4((interaction) => {
     setInteractions((prev) => upsertChatInteraction(prev, interaction));
   }, []);
-  const applyCancel = useCallback3((cancel) => {
+  const applyCancel = useCallback4((cancel) => {
     setInteractions((prev) => cancelChatInteraction(prev, cancel));
   }, []);
-  const markResolved = useCallback3((id, status, answers) => {
+  const markResolved = useCallback4((id, status, answers) => {
     setInteractions((prev) => resolveChatInteraction(prev, id, status, answers));
   }, []);
-  const restore = useCallback3((outstanding, restoreOptions) => {
+  const restore = useCallback4((outstanding, restoreOptions) => {
     setInteractions((prev) => restoreChatInteractions(prev, outstanding, {
       mode: restoreOptions?.mode ?? options.mode
     }));
   }, [options.mode]);
-  const hydrate = useCallback3((persisted) => {
+  const hydrate = useCallback4((persisted) => {
     setInteractions((prev) => hydrateChatInteractions(prev, persisted));
   }, []);
-  const terminalizePending = useCallback3((status) => {
+  const terminalizePending = useCallback4((status) => {
     setInteractions((prev) => terminalizePendingChatInteractions(prev, status));
   }, []);
-  const reset = useCallback3(() => setInteractions([]), []);
+  const reset = useCallback4(() => setInteractions([]), []);
   const pending = useMemo4(() => interactions.filter((item) => item.status === "pending"), [interactions]);
   return { interactions, pending, upsert, applyCancel, markResolved, restore, hydrate, terminalizePending, reset };
 }
 
 // src/web-react/use-file-mentions.ts
-import { useCallback as useCallback4, useMemo as useMemo5, useRef as useRef7, useState as useState9 } from "react";
+import { useCallback as useCallback5, useMemo as useMemo5, useRef as useRef7, useState as useState10 } from "react";
 var FILE_MENTION_KIND = "file";
 function toMentionItem(file) {
   return { id: file.path, label: file.name, detail: file.path, kind: FILE_MENTION_KIND };
@@ -2054,12 +2240,12 @@ function useFileMentions(options) {
     emptyText = DEFAULT_MENTION_EMPTY_TEXT
   } = options;
   const fetchImpl = options.fetchImpl ?? fetch;
-  const [state, setState] = useState9({ kind: "idle" });
+  const [state, setState] = useState10({ kind: "idle" });
   const stateRef = useRef7(state);
   stateRef.current = state;
   const inFlightRef = useRef7(null);
-  const [mentions, setMentions] = useState9([]);
-  const load = useCallback4(() => {
+  const [mentions, setMentions] = useState10([]);
+  const load = useCallback5(() => {
     if (inFlightRef.current) return inFlightRef.current;
     if (stateRef.current.kind === "idle") {
       stateRef.current = { kind: "loading" };
@@ -2091,10 +2277,10 @@ function useFileMentions(options) {
     inFlightRef.current = attempt;
     return attempt;
   }, [fetchImpl, indexUrl]);
-  const refresh = useCallback4(async () => {
+  const refresh = useCallback5(async () => {
     await load();
   }, [load]);
-  const fetchItems = useCallback4(
+  const fetchItems = useCallback5(
     async (query) => {
       let current = stateRef.current;
       if (current.kind === "idle" || current.kind === "loading") {
@@ -2109,10 +2295,10 @@ function useFileMentions(options) {
     },
     [load, limit, refreshAfterMs]
   );
-  const onMentionsChange = useCallback4((items) => {
+  const onMentionsChange = useCallback5((items) => {
     setMentions(items.filter((item) => item.kind === void 0 || item.kind === FILE_MENTION_KIND).map(toFileMention));
   }, []);
-  const clearMentions = useCallback4(() => setMentions([]), []);
+  const clearMentions = useCallback5(() => setMentions([]), []);
   const mention = useMemo5(
     () => ({
       fetchItems,
@@ -2166,9 +2352,284 @@ function segmentMentionContent(content, parts) {
   return { segments, matched };
 }
 
+// src/web-react/use-composer-attachments.ts
+import { useCallback as useCallback6, useEffect as useEffect8, useMemo as useMemo6, useRef as useRef8, useState as useState11 } from "react";
+function newId() {
+  const cryptoObject = globalThis.crypto;
+  if (typeof cryptoObject?.randomUUID === "function") return cryptoObject.randomUUID();
+  return `att-${Date.now()}-${Math.random().toString(36).slice(2)}`;
+}
+function dedupeName(name, taken) {
+  if (!taken.has(name)) return name;
+  const dot = name.lastIndexOf(".");
+  const base = dot > 0 ? name.slice(0, dot) : name;
+  const ext = dot > 0 ? name.slice(dot) : "";
+  let n = 2;
+  let candidate = `${base}-${n}${ext}`;
+  while (taken.has(candidate)) {
+    n += 1;
+    candidate = `${base}-${n}${ext}`;
+  }
+  return candidate;
+}
+function kindForMime(mime) {
+  return mime.startsWith("image/") ? "image" : "file";
+}
+function isAcceptedFileType(file, accept) {
+  const patterns = accept.split(",").map((p) => p.trim()).filter((p) => p.length > 0);
+  if (patterns.length === 0) return true;
+  const name = file.name.toLowerCase();
+  const type = (file.type || "").toLowerCase();
+  return patterns.some((pattern) => {
+    const lower = pattern.toLowerCase();
+    if (lower.startsWith(".")) return name.endsWith(lower);
+    if (lower.endsWith("/*")) return type.startsWith(lower.slice(0, -1));
+    return type === lower;
+  });
+}
+async function parseUploadError(res) {
+  const detail = await res.json().catch(() => null);
+  if (detail && typeof detail === "object" && "error" in detail) {
+    const error = detail.error;
+    if (typeof error === "string" && error) return error;
+    if (error && typeof error === "object" && "message" in error) {
+      const message = error.message;
+      if (typeof message === "string" && message) return message;
+    }
+  }
+  return `Upload failed (${res.status})`;
+}
+var NO_UPLOAD_TARGET_MESSAGE = "No upload destination configured (pass uploadUrl or buildUploadRequest)";
+function useComposerAttachments(options) {
+  const optionsRef = useRef8(options);
+  optionsRef.current = options;
+  const [staged, setStagedState] = useState11([]);
+  const stagedRef = useRef8([]);
+  const controllersRef = useRef8(/* @__PURE__ */ new Map());
+  const setStaged = useCallback6(
+    (updater) => {
+      const next = typeof updater === "function" ? updater(stagedRef.current) : updater;
+      stagedRef.current = next;
+      setStagedState(next);
+    },
+    []
+  );
+  const upload = useCallback6(
+    async (id, file, name) => {
+      const opts = optionsRef.current;
+      setStaged(
+        (prev) => prev.map((s) => s.id === id ? { ...s, status: "uploading", errorMessage: void 0 } : s)
+      );
+      const controller = new AbortController();
+      controllersRef.current.set(id, controller);
+      const form = new FormData();
+      form.append("file", file, name);
+      const request = opts.buildUploadRequest ? opts.buildUploadRequest({ file, name, form }) : opts.uploadUrl ? { url: opts.uploadUrl } : null;
+      if (!request) {
+        setStaged(
+          (prev) => prev.map(
+            (s) => s.id === id ? { ...s, status: "error", errorMessage: NO_UPLOAD_TARGET_MESSAGE } : s
+          )
+        );
+        opts.onError?.(NO_UPLOAD_TARGET_MESSAGE);
+        controllersRef.current.delete(id);
+        return;
+      }
+      try {
+        const res = await fetch(request.url, {
+          method: "POST",
+          credentials: "same-origin",
+          ...request.init,
+          body: form,
+          signal: controller.signal
+        });
+        if (!res.ok) {
+          const message = await parseUploadError(res);
+          setStaged(
+            (prev) => prev.map((s) => s.id === id ? { ...s, status: "error", errorMessage: message } : s)
+          );
+          opts.onError?.(message);
+          return;
+        }
+        const data = await res.json();
+        const uploaded = data.files?.[0];
+        if (!uploaded) {
+          const message = "Upload returned no file";
+          setStaged(
+            (prev) => prev.map((s) => s.id === id ? { ...s, status: "error", errorMessage: message } : s)
+          );
+          opts.onError?.(message);
+          return;
+        }
+        setStaged(
+          (prev) => prev.map((s) => s.id === id ? { ...s, status: "ready", reference: uploaded } : s)
+        );
+      } catch (err) {
+        if (err.name === "AbortError") return;
+        const message = err instanceof Error && err.message ? err.message : "Upload failed \u2014 check your connection";
+        setStaged(
+          (prev) => prev.map((s) => s.id === id ? { ...s, status: "error", errorMessage: message } : s)
+        );
+        opts.onError?.(message);
+      } finally {
+        controllersRef.current.delete(id);
+      }
+    },
+    [setStaged]
+  );
+  const addFiles = useCallback6(
+    async (files) => {
+      const opts = optionsRef.current;
+      const enabled2 = opts.enabled ?? true;
+      if (!enabled2) {
+        opts.onReject?.("Attachments are disabled");
+        return;
+      }
+      const accept = opts.accept ?? ATTACHMENT_ACCEPT;
+      const maxCount = opts.limits?.maxCount ?? ATTACHMENT_MAX_COUNT;
+      const maxBinaryBytes = opts.limits?.maxBinaryBytes ?? MAX_BINARY_ATTACHMENT_BYTES;
+      const maxTextBytes = opts.limits?.maxTextBytes ?? MAX_TEXT_ATTACHMENT_BYTES;
+      const maxTotalBytes = opts.limits?.maxTotalBytes ?? MAX_ATTACHMENT_TOTAL_BYTES;
+      const allowedKinds = opts.allowedKinds ?? ["image", "file"];
+      const list = Array.isArray(files) ? files : Array.from(files);
+      const currentCount = stagedRef.current.length;
+      const countAccepted = [];
+      for (const file of list) {
+        if (!isAcceptedFileType(file, accept)) {
+          opts.onReject?.(`"${file.name}" is not an accepted file type (${accept}).`, file);
+          continue;
+        }
+        if (currentCount + countAccepted.length >= maxCount) {
+          opts.onReject?.(`"${file.name}" was not added \u2014 the ${maxCount}-file limit is already reached.`, file);
+          continue;
+        }
+        countAccepted.push(file);
+      }
+      const sizeAccepted = [];
+      for (const file of countAccepted) {
+        const bytes = new Uint8Array(await file.arrayBuffer());
+        const sniff = sniffBinary(bytes);
+        const typeCheck = checkAttachmentType(file.name, sniff);
+        if (!typeCheck.succeeded) {
+          opts.onReject?.(typeCheck.message, file);
+          continue;
+        }
+        const limit = sniff.binary ? maxBinaryBytes : maxTextBytes;
+        if (file.size > limit) {
+          opts.onReject?.(attachmentSizeErrorMessage(file.name, file.size, limit), file);
+          continue;
+        }
+        const mediaType = sniff.mime ?? file.type ?? "";
+        const kind = kindForMime(mediaType);
+        if (!allowedKinds.includes(kind)) {
+          opts.onReject?.(`"${file.name}" is a ${kind} attachment, which isn't accepted here`, file);
+          continue;
+        }
+        sizeAccepted.push(file);
+      }
+      const accepted = [];
+      let totalBytes = stagedRef.current.reduce((total, s) => total + s.size, 0);
+      for (const file of sizeAccepted) {
+        const nextTotalBytes = totalBytes + file.size;
+        if (nextTotalBytes > maxTotalBytes) {
+          opts.onReject?.(attachmentTotalSizeErrorMessage(nextTotalBytes, maxTotalBytes), file);
+          continue;
+        }
+        accepted.push(file);
+        totalBytes = nextTotalBytes;
+      }
+      if (accepted.length === 0) return;
+      const taken = new Set(stagedRef.current.map((s) => s.name));
+      const entries = accepted.map((file) => {
+        const name = dedupeName(sanitizeAttachmentFileName(file.name), taken);
+        taken.add(name);
+        return {
+          id: newId(),
+          file,
+          name,
+          size: file.size,
+          status: "pending",
+          previewUrl: file.type.startsWith("image/") ? URL.createObjectURL(file) : void 0
+        };
+      });
+      setStaged((prev) => [...prev, ...entries]);
+      for (const entry of entries) void upload(entry.id, entry.file, entry.name);
+    },
+    [setStaged, upload]
+  );
+  const retry = useCallback6(
+    (id) => {
+      const entry = stagedRef.current.find((s) => s.id === id);
+      if (!entry) return;
+      void upload(entry.id, entry.file, entry.name);
+    },
+    [upload]
+  );
+  const removeAttachment = useCallback6(
+    (id) => {
+      controllersRef.current.get(id)?.abort();
+      controllersRef.current.delete(id);
+      const entry = stagedRef.current.find((s) => s.id === id);
+      if (entry?.previewUrl) URL.revokeObjectURL(entry.previewUrl);
+      setStaged((prev) => prev.filter((s) => s.id !== id));
+    },
+    [setStaged]
+  );
+  const clear = useCallback6(() => {
+    for (const controller of controllersRef.current.values()) controller.abort();
+    controllersRef.current.clear();
+    for (const entry of stagedRef.current) {
+      if (entry.previewUrl) URL.revokeObjectURL(entry.previewUrl);
+    }
+    setStaged([]);
+  }, [setStaged]);
+  useEffect8(
+    () => () => {
+      for (const controller of controllersRef.current.values()) controller.abort();
+      controllersRef.current.clear();
+      for (const entry of stagedRef.current) {
+        if (entry.previewUrl) URL.revokeObjectURL(entry.previewUrl);
+      }
+    },
+    []
+  );
+  const composerFiles = useMemo6(
+    () => staged.map((s) => ({
+      id: s.id,
+      name: s.name,
+      size: s.size,
+      kind: "file",
+      status: s.status
+    })),
+    [staged]
+  );
+  const references = useMemo6(
+    () => staged.filter((s) => s.status === "ready" && !!s.reference).map((s) => s.reference),
+    [staged]
+  );
+  const hasPending = useMemo6(
+    () => staged.some((s) => s.status === "pending" || s.status === "uploading"),
+    [staged]
+  );
+  const hasError = useMemo6(() => staged.some((s) => s.status === "error"), [staged]);
+  const enabled = options.enabled ?? true;
+  const blockReason = !enabled ? "Attachments are disabled" : hasPending ? "Attachments are still uploading" : hasError ? "Remove failed attachments to send" : null;
+  return {
+    composerFiles,
+    references,
+    addFiles,
+    retry,
+    removeAttachment,
+    clear,
+    hasPending,
+    hasError,
+    blockReason
+  };
+}
+
 // src/web-react/mission-activity.tsx
-import { useCallback as useCallback5, useEffect as useEffect7, useState as useState10 } from "react";
-import { Fragment as Fragment4, jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
+import { useCallback as useCallback7, useEffect as useEffect9, useState as useState12 } from "react";
+import { Fragment as Fragment4, jsx as jsx10, jsxs as jsxs8 } from "react/jsx-runtime";
 var LIVE_STATUSES = /* @__PURE__ */ new Set(["pending", "running"]);
 var OK_STATUSES = /* @__PURE__ */ new Set(["completed", "done", "succeeded"]);
 var ERROR_STATUSES = /* @__PURE__ */ new Set(["failed", "error", "cancelled", "aborted"]);
@@ -2215,20 +2676,20 @@ function waterfallLayout(trace) {
   });
 }
 function ChevronGlyph({ className }) {
-  return /* @__PURE__ */ jsx9("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx9("path", { d: "m6 9 6 6 6-6" }) });
+  return /* @__PURE__ */ jsx10("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx10("path", { d: "m6 9 6 6 6-6" }) });
 }
 function RefreshGlyph({ className }) {
-  return /* @__PURE__ */ jsx9("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx9("path", { d: "M21 12a9 9 0 1 1-2.64-6.36M21 3v6h-6" }) });
+  return /* @__PURE__ */ jsx10("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx10("path", { d: "M21 12a9 9 0 1 1-2.64-6.36M21 3v6h-6" }) });
 }
 function CopyGlyph({ className }) {
-  return /* @__PURE__ */ jsxs7("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
-    /* @__PURE__ */ jsx9("rect", { x: "9", y: "9", width: "13", height: "13", rx: "2" }),
-    /* @__PURE__ */ jsx9("path", { d: "M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1" })
+  return /* @__PURE__ */ jsxs8("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
+    /* @__PURE__ */ jsx10("rect", { x: "9", y: "9", width: "13", height: "13", rx: "2" }),
+    /* @__PURE__ */ jsx10("path", { d: "M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1" })
   ] });
 }
 function TraceIdCopy({ traceId }) {
-  const [copied, setCopied] = useState10(false);
-  const copy = useCallback5(() => {
+  const [copied, setCopied] = useState12(false);
+  const copy = useCallback7(() => {
     void navigator.clipboard?.writeText(traceId).then(
       () => {
         setCopied(true);
@@ -2238,7 +2699,7 @@ function TraceIdCopy({ traceId }) {
       }
     );
   }, [traceId]);
-  return /* @__PURE__ */ jsxs7(
+  return /* @__PURE__ */ jsxs8(
     "button",
     {
       type: "button",
@@ -2247,23 +2708,23 @@ function TraceIdCopy({ traceId }) {
       "aria-label": "Copy trace id",
       className: "inline-flex min-w-0 items-center gap-1.5 rounded text-left font-mono text-muted-foreground transition hover:text-foreground focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1 focus-visible:ring-offset-card",
       children: [
-        /* @__PURE__ */ jsx9("span", { className: "truncate", children: traceId }),
-        /* @__PURE__ */ jsx9(CopyGlyph, { className: "h-3 w-3 shrink-0" }),
-        copied && /* @__PURE__ */ jsx9("span", { className: "shrink-0 not-italic text-success", children: "copied" })
+        /* @__PURE__ */ jsx10("span", { className: "truncate", children: traceId }),
+        /* @__PURE__ */ jsx10(CopyGlyph, { className: "h-3 w-3 shrink-0" }),
+        copied && /* @__PURE__ */ jsx10("span", { className: "shrink-0 not-italic text-success", children: "copied" })
       ]
     }
   );
 }
 function StatusDot({ tone }) {
-  return /* @__PURE__ */ jsxs7("span", { className: "inline-flex items-center", children: [
-    /* @__PURE__ */ jsx9(
+  return /* @__PURE__ */ jsxs8("span", { className: "inline-flex items-center", children: [
+    /* @__PURE__ */ jsx10(
       "span",
       {
         "aria-hidden": true,
         className: `h-2 w-2 shrink-0 rounded-full ${tone === "live" ? "animate-pulse bg-warning" : tone === "ok" ? "bg-success" : tone === "error" ? "bg-destructive" : "bg-muted-foreground/40"}`
       }
     ),
-    /* @__PURE__ */ jsx9("span", { className: "sr-only", children: tone })
+    /* @__PURE__ */ jsx10("span", { className: "sr-only", children: tone })
   ] });
 }
 var BAR_CLASS = {
@@ -2275,19 +2736,19 @@ function FlowWaterfall({ trace }) {
   const rows = waterfallLayout(trace);
   if (rows.length === 0) return null;
   const cost = formatActivityCost(trace.costUsd);
-  return /* @__PURE__ */ jsxs7("div", { className: "space-y-1", children: [
-    rows.map((row, i) => /* @__PURE__ */ jsxs7("div", { className: "grid grid-cols-[minmax(0,2fr)_minmax(0,3fr)_auto] items-center gap-2", children: [
-      /* @__PURE__ */ jsx9("span", { className: "truncate font-mono text-[11px] text-muted-foreground", title: row.name, children: row.name }),
-      /* @__PURE__ */ jsx9("div", { className: "relative h-2 rounded-sm bg-muted/40", children: /* @__PURE__ */ jsx9(
+  return /* @__PURE__ */ jsxs8("div", { className: "space-y-1", children: [
+    rows.map((row, i) => /* @__PURE__ */ jsxs8("div", { className: "grid grid-cols-[minmax(0,2fr)_minmax(0,3fr)_auto] items-center gap-2", children: [
+      /* @__PURE__ */ jsx10("span", { className: "truncate font-mono text-[11px] text-muted-foreground", title: row.name, children: row.name }),
+      /* @__PURE__ */ jsx10("div", { className: "relative h-2 rounded-sm bg-muted/40", children: /* @__PURE__ */ jsx10(
         "div",
         {
           className: `absolute inset-y-0 rounded-sm ${row.ok ? BAR_CLASS[row.kind] : "bg-destructive/80"} ${row.approx ? "opacity-70" : ""}`,
           style: { left: `${row.offsetPct}%`, width: `${row.widthPct}%` }
         }
       ) }),
-      /* @__PURE__ */ jsx9("span", { className: "shrink-0 font-mono text-[10px] tabular-nums text-muted-foreground/70", children: row.durationLabel })
+      /* @__PURE__ */ jsx10("span", { className: "shrink-0 font-mono text-[10px] tabular-nums text-muted-foreground/70", children: row.durationLabel })
     ] }, i)),
-    /* @__PURE__ */ jsxs7("p", { className: "pt-0.5 text-right font-mono text-[10px] tabular-nums text-muted-foreground/60", children: [
+    /* @__PURE__ */ jsxs8("p", { className: "pt-0.5 text-right font-mono text-[10px] tabular-nums text-muted-foreground/60", children: [
       (trace.totalMs / 1e3).toFixed(1),
       "s",
       cost ? ` \xB7 ${cost}` : ""
@@ -2295,43 +2756,43 @@ function FlowWaterfall({ trace }) {
   ] });
 }
 function MissionActivityLane({ activity, startedAt, nowMs }) {
-  const [expanded, setExpanded] = useState10(false);
+  const [expanded, setExpanded] = useState12(false);
   if (activity.length === 0) return null;
-  return /* @__PURE__ */ jsxs7("div", { className: "mt-1 border-l border-border/50 pl-3", children: [
+  return /* @__PURE__ */ jsxs8("div", { className: "mt-1 border-l border-border/50 pl-3", children: [
     activity.map((run) => {
       const tone = activityTone(run.status);
       const cost = formatActivityCost(run.costUsd);
       const duration = formatActivityDuration(run.durationMs);
-      return /* @__PURE__ */ jsxs7("div", { className: "flex items-center gap-2 py-1 text-xs", children: [
-        /* @__PURE__ */ jsx9(StatusDot, { tone }),
-        /* @__PURE__ */ jsxs7("span", { className: "min-w-0 flex-1 truncate", children: [
-          /* @__PURE__ */ jsx9("span", { className: "font-medium", children: run.tool }),
-          /* @__PURE__ */ jsxs7("span", { className: "text-muted-foreground", children: [
+      return /* @__PURE__ */ jsxs8("div", { className: "flex items-center gap-2 py-1 text-xs", children: [
+        /* @__PURE__ */ jsx10(StatusDot, { tone }),
+        /* @__PURE__ */ jsxs8("span", { className: "min-w-0 flex-1 truncate", children: [
+          /* @__PURE__ */ jsx10("span", { className: "font-medium", children: run.tool }),
+          /* @__PURE__ */ jsxs8("span", { className: "text-muted-foreground", children: [
             " \u2014 ",
             run.detail
           ] })
         ] }),
-        tone === "live" && (run.iteration !== void 0 || run.phase !== void 0) && /* @__PURE__ */ jsx9("span", { className: "shrink-0 rounded-full bg-warning/10 px-1.5 py-0.5 font-mono text-[10px] text-warning", children: [run.iteration !== void 0 ? `iter ${run.iteration}` : null, run.phase ?? null].filter(Boolean).join(" \xB7 ") }),
-        /* @__PURE__ */ jsxs7("span", { className: "flex shrink-0 items-center gap-1.5 font-mono text-[10px] tabular-nums text-muted-foreground/70", children: [
-          tone !== "live" && tone !== "ok" && /* @__PURE__ */ jsx9("span", { children: run.status }),
-          cost && /* @__PURE__ */ jsx9("span", { children: cost }),
-          duration && /* @__PURE__ */ jsx9("span", { children: duration })
+        tone === "live" && (run.iteration !== void 0 || run.phase !== void 0) && /* @__PURE__ */ jsx10("span", { className: "shrink-0 rounded-full bg-warning/10 px-1.5 py-0.5 font-mono text-[10px] text-warning", children: [run.iteration !== void 0 ? `iter ${run.iteration}` : null, run.phase ?? null].filter(Boolean).join(" \xB7 ") }),
+        /* @__PURE__ */ jsxs8("span", { className: "flex shrink-0 items-center gap-1.5 font-mono text-[10px] tabular-nums text-muted-foreground/70", children: [
+          tone !== "live" && tone !== "ok" && /* @__PURE__ */ jsx10("span", { children: run.status }),
+          cost && /* @__PURE__ */ jsx10("span", { children: cost }),
+          duration && /* @__PURE__ */ jsx10("span", { children: duration })
         ] })
       ] }, run.taskId);
     }),
-    /* @__PURE__ */ jsxs7(
+    /* @__PURE__ */ jsxs8(
       "button",
       {
         type: "button",
         onClick: () => setExpanded((v) => !v),
         className: "flex items-center gap-1 py-0.5 text-[10px] font-medium text-muted-foreground/70 transition hover:text-foreground",
         children: [
-          /* @__PURE__ */ jsx9(ChevronGlyph, { className: `h-3 w-3 transition-transform ${expanded ? "rotate-180" : ""}` }),
+          /* @__PURE__ */ jsx10(ChevronGlyph, { className: `h-3 w-3 transition-transform ${expanded ? "rotate-180" : ""}` }),
           "timeline"
         ]
       }
     ),
-    expanded && /* @__PURE__ */ jsx9("div", { className: "rounded-md border border-border/50 bg-muted/10 p-2", children: /* @__PURE__ */ jsx9(
+    expanded && /* @__PURE__ */ jsx10("div", { className: "rounded-md border border-border/50 bg-muted/10 p-2", children: /* @__PURE__ */ jsx10(
       FlowWaterfall,
       {
         trace: stepActivityFlowTrace(activity, {
@@ -2346,45 +2807,45 @@ function ActivityRow({
   record,
   renderMissionRef
 }) {
-  const [open, setOpen] = useState10(false);
+  const [open, setOpen] = useState12(false);
   const tone = activityTone(record.status);
   const cost = formatActivityCost(record.costUsd);
   const duration = formatActivityDuration(record.durationMs);
-  return /* @__PURE__ */ jsxs7("div", { className: "rounded-lg border border-border/60 bg-card", children: [
-    /* @__PURE__ */ jsxs7("button", { type: "button", onClick: () => setOpen((v) => !v), className: "flex w-full items-center gap-2.5 px-3 py-2 text-left text-sm", children: [
-      /* @__PURE__ */ jsx9(StatusDot, { tone }),
-      /* @__PURE__ */ jsxs7("span", { className: "min-w-0 flex-1 truncate", children: [
-        /* @__PURE__ */ jsx9("span", { className: "font-medium", children: record.tool }),
-        /* @__PURE__ */ jsxs7("span", { className: "text-muted-foreground", children: [
+  return /* @__PURE__ */ jsxs8("div", { className: "rounded-lg border border-border/60 bg-card", children: [
+    /* @__PURE__ */ jsxs8("button", { type: "button", onClick: () => setOpen((v) => !v), className: "flex w-full items-center gap-2.5 px-3 py-2 text-left text-sm", children: [
+      /* @__PURE__ */ jsx10(StatusDot, { tone }),
+      /* @__PURE__ */ jsxs8("span", { className: "min-w-0 flex-1 truncate", children: [
+        /* @__PURE__ */ jsx10("span", { className: "font-medium", children: record.tool }),
+        /* @__PURE__ */ jsxs8("span", { className: "text-muted-foreground", children: [
           " \u2014 ",
           record.detail
         ] })
       ] }),
-      tone === "live" && (record.iteration !== void 0 || record.phase !== void 0) && /* @__PURE__ */ jsx9("span", { className: "shrink-0 rounded-full bg-warning/10 px-2 py-0.5 font-mono text-[10px] text-warning", children: [record.iteration !== void 0 ? `iter ${record.iteration}` : null, record.phase ?? null].filter(Boolean).join(" \xB7 ") }),
-      /* @__PURE__ */ jsx9(
+      tone === "live" && (record.iteration !== void 0 || record.phase !== void 0) && /* @__PURE__ */ jsx10("span", { className: "shrink-0 rounded-full bg-warning/10 px-2 py-0.5 font-mono text-[10px] text-warning", children: [record.iteration !== void 0 ? `iter ${record.iteration}` : null, record.phase ?? null].filter(Boolean).join(" \xB7 ") }),
+      /* @__PURE__ */ jsx10(
         "span",
         {
           className: `shrink-0 rounded-full px-2 py-0.5 text-[10px] font-medium ${tone === "ok" ? "bg-success/10 text-success" : tone === "error" ? "bg-destructive/10 text-destructive" : tone === "live" ? "bg-warning/10 text-warning" : "bg-muted/60 text-muted-foreground"}`,
           children: record.status
         }
       ),
-      cost && /* @__PURE__ */ jsx9("span", { className: "shrink-0 font-mono text-[11px] tabular-nums text-muted-foreground", children: cost }),
-      /* @__PURE__ */ jsx9(ChevronGlyph, { className: `h-3 w-3 shrink-0 text-muted-foreground transition-transform ${open ? "rotate-180" : ""}` })
+      cost && /* @__PURE__ */ jsx10("span", { className: "shrink-0 font-mono text-[11px] tabular-nums text-muted-foreground", children: cost }),
+      /* @__PURE__ */ jsx10(ChevronGlyph, { className: `h-3 w-3 shrink-0 text-muted-foreground transition-transform ${open ? "rotate-180" : ""}` })
     ] }),
-    open && /* @__PURE__ */ jsxs7("div", { className: "space-y-2.5 border-t border-border/40 px-3 py-2.5", children: [
-      record.durationMs !== void 0 && /* @__PURE__ */ jsx9("div", { className: "rounded-md border border-border/50 bg-muted/10 p-2", children: /* @__PURE__ */ jsx9(FlowWaterfall, { trace: stepActivityFlowTrace([record]) }) }),
-      /* @__PURE__ */ jsxs7("dl", { className: "grid grid-cols-[auto_1fr] gap-x-3 gap-y-1 font-mono text-[11px]", children: [
-        /* @__PURE__ */ jsx9("dt", { className: "text-muted-foreground/60", children: "task" }),
-        /* @__PURE__ */ jsx9("dd", { className: "truncate text-muted-foreground", children: record.taskId }),
-        /* @__PURE__ */ jsx9("dt", { className: "text-muted-foreground/60", children: "started" }),
-        /* @__PURE__ */ jsx9("dd", { className: "text-muted-foreground", children: new Date(record.startedAt).toLocaleString() }),
-        duration && /* @__PURE__ */ jsxs7(Fragment4, { children: [
-          /* @__PURE__ */ jsx9("dt", { className: "text-muted-foreground/60", children: "duration" }),
-          /* @__PURE__ */ jsx9("dd", { className: "text-muted-foreground", children: duration })
+    open && /* @__PURE__ */ jsxs8("div", { className: "space-y-2.5 border-t border-border/40 px-3 py-2.5", children: [
+      record.durationMs !== void 0 && /* @__PURE__ */ jsx10("div", { className: "rounded-md border border-border/50 bg-muted/10 p-2", children: /* @__PURE__ */ jsx10(FlowWaterfall, { trace: stepActivityFlowTrace([record]) }) }),
+      /* @__PURE__ */ jsxs8("dl", { className: "grid grid-cols-[auto_1fr] gap-x-3 gap-y-1 font-mono text-[11px]", children: [
+        /* @__PURE__ */ jsx10("dt", { className: "text-muted-foreground/60", children: "task" }),
+        /* @__PURE__ */ jsx10("dd", { className: "truncate text-muted-foreground", children: record.taskId }),
+        /* @__PURE__ */ jsx10("dt", { className: "text-muted-foreground/60", children: "started" }),
+        /* @__PURE__ */ jsx10("dd", { className: "text-muted-foreground", children: new Date(record.startedAt).toLocaleString() }),
+        duration && /* @__PURE__ */ jsxs8(Fragment4, { children: [
+          /* @__PURE__ */ jsx10("dt", { className: "text-muted-foreground/60", children: "duration" }),
+          /* @__PURE__ */ jsx10("dd", { className: "text-muted-foreground", children: duration })
         ] }),
-        record.traceId && /* @__PURE__ */ jsxs7(Fragment4, { children: [
-          /* @__PURE__ */ jsx9("dt", { className: "text-muted-foreground/60", children: "trace" }),
-          /* @__PURE__ */ jsx9("dd", { className: "min-w-0", children: /* @__PURE__ */ jsx9(TraceIdCopy, { traceId: record.traceId }) })
+        record.traceId && /* @__PURE__ */ jsxs8(Fragment4, { children: [
+          /* @__PURE__ */ jsx10("dt", { className: "text-muted-foreground/60", children: "trace" }),
+          /* @__PURE__ */ jsx10("dd", { className: "min-w-0", children: /* @__PURE__ */ jsx10(TraceIdCopy, { traceId: record.traceId }) })
         ] })
       ] }),
       record.missionRef && renderMissionRef?.(record.missionRef, record)
@@ -2392,11 +2853,11 @@ function ActivityRow({
   ] });
 }
 function AgentActivityPanel({ fetchActivity, renderMissionRef, title = "Agent activity", emptyLabel = "No agent runs yet." }) {
-  const [rows, setRows] = useState10([]);
-  const [cursor, setCursor] = useState10(void 0);
-  const [loading, setLoading] = useState10(false);
-  const [error, setError] = useState10(null);
-  const load = useCallback5(
+  const [rows, setRows] = useState12([]);
+  const [cursor, setCursor] = useState12(void 0);
+  const [loading, setLoading] = useState12(false);
+  const [error, setError] = useState12(null);
+  const load = useCallback7(
     async (from) => {
       setLoading(true);
       setError(null);
@@ -2412,13 +2873,13 @@ function AgentActivityPanel({ fetchActivity, renderMissionRef, title = "Agent ac
     },
     [fetchActivity]
   );
-  useEffect7(() => {
+  useEffect9(() => {
     void load();
   }, [load]);
-  return /* @__PURE__ */ jsxs7("div", { className: "space-y-2", children: [
-    /* @__PURE__ */ jsxs7("div", { className: "flex items-center gap-2", children: [
-      /* @__PURE__ */ jsx9("h2", { className: "flex-1 text-sm font-semibold", children: title }),
-      /* @__PURE__ */ jsx9(
+  return /* @__PURE__ */ jsxs8("div", { className: "space-y-2", children: [
+    /* @__PURE__ */ jsxs8("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsx10("h2", { className: "flex-1 text-sm font-semibold", children: title }),
+      /* @__PURE__ */ jsx10(
         "button",
         {
           type: "button",
@@ -2426,14 +2887,14 @@ function AgentActivityPanel({ fetchActivity, renderMissionRef, title = "Agent ac
           disabled: loading,
           "aria-label": "Refresh",
           className: "rounded-md p-1.5 text-muted-foreground transition hover:bg-accent/30 hover:text-foreground disabled:opacity-50",
-          children: /* @__PURE__ */ jsx9(RefreshGlyph, { className: `h-3.5 w-3.5 ${loading ? "animate-spin" : ""}` })
+          children: /* @__PURE__ */ jsx10(RefreshGlyph, { className: `h-3.5 w-3.5 ${loading ? "animate-spin" : ""}` })
         }
       )
     ] }),
-    error && /* @__PURE__ */ jsx9("p", { role: "alert", className: "rounded-md border border-destructive/40 bg-destructive/5 px-3 py-2 text-xs text-destructive", children: error }),
-    !error && rows.length === 0 && !loading && /* @__PURE__ */ jsx9("p", { className: "px-1 text-sm text-muted-foreground", children: emptyLabel }),
-    /* @__PURE__ */ jsx9("div", { className: "space-y-1.5", children: rows.map((record) => /* @__PURE__ */ jsx9(ActivityRow, { record, renderMissionRef }, record.taskId)) }),
-    cursor && /* @__PURE__ */ jsx9(
+    error && /* @__PURE__ */ jsx10("p", { role: "alert", className: "rounded-md border border-destructive/40 bg-destructive/5 px-3 py-2 text-xs text-destructive", children: error }),
+    !error && rows.length === 0 && !loading && /* @__PURE__ */ jsx10("p", { className: "px-1 text-sm text-muted-foreground", children: emptyLabel }),
+    /* @__PURE__ */ jsx10("div", { className: "space-y-1.5", children: rows.map((record) => /* @__PURE__ */ jsx10(ActivityRow, { record, renderMissionRef }, record.taskId)) }),
+    cursor && /* @__PURE__ */ jsx10(
       "button",
       {
         type: "button",
@@ -2447,9 +2908,9 @@ function AgentActivityPanel({ fetchActivity, renderMissionRef, title = "Agent ac
 }
 
 // src/web-react/seat-paywall.tsx
-import { jsx as jsx10, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx11, jsxs as jsxs9 } from "react/jsx-runtime";
 function CheckGlyph3() {
-  return /* @__PURE__ */ jsx10(
+  return /* @__PURE__ */ jsx11(
     "svg",
     {
       className: "h-4 w-4 shrink-0 text-primary",
@@ -2460,14 +2921,14 @@ function CheckGlyph3() {
       strokeLinecap: "round",
       strokeLinejoin: "round",
       "aria-hidden": true,
-      children: /* @__PURE__ */ jsx10("path", { d: "M20 6 9 17l-5-5" })
+      children: /* @__PURE__ */ jsx11("path", { d: "M20 6 9 17l-5-5" })
     }
   );
 }
 function Benefit({ children }) {
-  return /* @__PURE__ */ jsxs8("li", { className: "flex items-start gap-2.5 text-sm text-foreground", children: [
-    /* @__PURE__ */ jsx10("span", { className: "mt-0.5", children: /* @__PURE__ */ jsx10(CheckGlyph3, {}) }),
-    /* @__PURE__ */ jsx10("span", { children })
+  return /* @__PURE__ */ jsxs9("li", { className: "flex items-start gap-2.5 text-sm text-foreground", children: [
+    /* @__PURE__ */ jsx11("span", { className: "mt-0.5", children: /* @__PURE__ */ jsx11(CheckGlyph3, {}) }),
+    /* @__PURE__ */ jsx11("span", { children })
   ] });
 }
 function SeatPaywall({
@@ -2481,30 +2942,30 @@ function SeatPaywall({
   footnote
 }) {
   const { pending, run } = usePending();
-  return /* @__PURE__ */ jsx10("div", { className: "flex min-h-[60vh] w-full items-center justify-center p-6", children: /* @__PURE__ */ jsxs8("div", { className: "w-full max-w-md rounded-2xl border border-border bg-card p-8 shadow-sm", children: [
-    /* @__PURE__ */ jsx10("p", { className: "text-xs font-medium uppercase tracking-wide text-muted-foreground", children: product }),
-    /* @__PURE__ */ jsxs8("h1", { className: "mt-2 text-2xl font-semibold tracking-tight text-foreground", children: [
+  return /* @__PURE__ */ jsx11("div", { className: "flex min-h-[60vh] w-full items-center justify-center p-6", children: /* @__PURE__ */ jsxs9("div", { className: "w-full max-w-md rounded-2xl border border-border bg-card p-8 shadow-sm", children: [
+    /* @__PURE__ */ jsx11("p", { className: "text-xs font-medium uppercase tracking-wide text-muted-foreground", children: product }),
+    /* @__PURE__ */ jsxs9("h1", { className: "mt-2 text-2xl font-semibold tracking-tight text-foreground", children: [
       "Unlock ",
       product
     ] }),
-    tagline && /* @__PURE__ */ jsx10("p", { className: "mt-2 text-sm text-muted-foreground", children: tagline }),
-    /* @__PURE__ */ jsxs8("div", { className: "mt-6 flex items-baseline gap-1.5", children: [
-      /* @__PURE__ */ jsxs8("span", { className: "text-3xl font-semibold text-foreground", children: [
+    tagline && /* @__PURE__ */ jsx11("p", { className: "mt-2 text-sm text-muted-foreground", children: tagline }),
+    /* @__PURE__ */ jsxs9("div", { className: "mt-6 flex items-baseline gap-1.5", children: [
+      /* @__PURE__ */ jsxs9("span", { className: "text-3xl font-semibold text-foreground", children: [
         "$",
         priceUsd
       ] }),
-      /* @__PURE__ */ jsx10("span", { className: "text-sm text-muted-foreground", children: "/mo" })
+      /* @__PURE__ */ jsx11("span", { className: "text-sm text-muted-foreground", children: "/mo" })
     ] }),
-    /* @__PURE__ */ jsxs8("p", { className: "mt-1 text-sm text-muted-foreground", children: [
+    /* @__PURE__ */ jsxs9("p", { className: "mt-1 text-sm text-muted-foreground", children: [
       "Includes $",
       includedUsageUsd,
       "/mo of AI usage"
     ] }),
-    /* @__PURE__ */ jsx10("ul", { className: "mt-6 space-y-2.5", children: (benefits ?? [
+    /* @__PURE__ */ jsx11("ul", { className: "mt-6 space-y-2.5", children: (benefits ?? [
       `Full access to ${product}`,
       `$${includedUsageUsd}/mo of AI usage included, every month`
-    ]).map((benefit, i) => /* @__PURE__ */ jsx10(Benefit, { children: benefit }, i)) }),
-    /* @__PURE__ */ jsx10(
+    ]).map((benefit, i) => /* @__PURE__ */ jsx11(Benefit, { children: benefit }, i)) }),
+    /* @__PURE__ */ jsx11(
       "button",
       {
         type: "button",
@@ -2514,13 +2975,13 @@ function SeatPaywall({
         children: pending ? "Opening checkout\u2026" : ctaLabel ?? `Unlock ${product}`
       }
     ),
-    footnote && /* @__PURE__ */ jsx10("p", { className: "mt-3 text-center text-xs text-muted-foreground/70", children: footnote })
+    footnote && /* @__PURE__ */ jsx11("p", { className: "mt-3 text-center text-xs text-muted-foreground/70", children: footnote })
   ] }) });
 }
 
 // src/web-react/agent-session-controls.tsx
-import { useMemo as useMemo6, useState as useState11 } from "react";
-import { jsx as jsx11, jsxs as jsxs9 } from "react/jsx-runtime";
+import { useMemo as useMemo7, useState as useState13 } from "react";
+import { jsx as jsx12, jsxs as jsxs10 } from "react/jsx-runtime";
 var HARNESS_LABELS = {
   opencode: "OpenCode (any model)",
   "claude-code": "Claude Code (Anthropic)",
@@ -2540,12 +3001,12 @@ function harnessLabel(h) {
   return HARNESS_LABELS[h] ?? h;
 }
 function ChevronDown2({ className }) {
-  return /* @__PURE__ */ jsx11("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx11("path", { d: "m6 9 6 6 6-6" }) });
+  return /* @__PURE__ */ jsx12("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx12("path", { d: "m6 9 6 6 6-6" }) });
 }
 function GearGlyph({ className }) {
-  return /* @__PURE__ */ jsxs9("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
-    /* @__PURE__ */ jsx11("circle", { cx: "12", cy: "12", r: "3" }),
-    /* @__PURE__ */ jsx11("path", { d: "M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 1 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 1 1-2.83-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 1 1 2.83-2.83l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 1 1 2.83 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1Z" })
+  return /* @__PURE__ */ jsxs10("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
+    /* @__PURE__ */ jsx12("circle", { cx: "12", cy: "12", r: "3" }),
+    /* @__PURE__ */ jsx12("path", { d: "M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 1 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 1 1-2.83-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 1 1 2.83-2.83l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 1 1 2.83 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1Z" })
   ] });
 }
 var FOCUS_RING = "focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1 focus-visible:ring-offset-background";
@@ -2554,11 +3015,11 @@ function HarnessPicker({
   onChange,
   available
 }) {
-  const [open, setOpen] = useState11(false);
+  const [open, setOpen] = useState13(false);
   const { containerRef, triggerProps } = usePopover(open, setOpen);
   const options = available ?? Object.keys(HARNESS_LABELS);
-  return /* @__PURE__ */ jsxs9("div", { ref: containerRef, className: "relative inline-flex", children: [
-    /* @__PURE__ */ jsxs9(
+  return /* @__PURE__ */ jsxs10("div", { ref: containerRef, className: "relative inline-flex", children: [
+    /* @__PURE__ */ jsxs10(
       "button",
       {
         type: "button",
@@ -2567,12 +3028,12 @@ function HarnessPicker({
         title: "Agent backend",
         className: `inline-flex w-full items-center justify-between gap-1.5 rounded-lg border border-border bg-card px-3 py-1.5 text-sm font-medium text-foreground transition hover:bg-accent/30 ${FOCUS_RING}`,
         children: [
-          /* @__PURE__ */ jsx11("span", { className: "truncate", children: harnessLabel(value) }),
-          /* @__PURE__ */ jsx11(ChevronDown2, { className: "h-3.5 w-3.5 text-muted-foreground" })
+          /* @__PURE__ */ jsx12("span", { className: "truncate", children: harnessLabel(value) }),
+          /* @__PURE__ */ jsx12(ChevronDown2, { className: "h-3.5 w-3.5 text-muted-foreground" })
         ]
       }
     ),
-    open && /* @__PURE__ */ jsx11("div", { role: "menu", className: "absolute bottom-full left-0 z-50 mb-2 max-h-64 w-full min-w-[220px] overflow-y-auto rounded-xl border border-border bg-card p-1 shadow-lg", children: options.map((h) => /* @__PURE__ */ jsx11(
+    open && /* @__PURE__ */ jsx12("div", { role: "menu", className: "absolute bottom-full left-0 z-50 mb-2 max-h-64 w-full min-w-[220px] overflow-y-auto rounded-xl border border-border bg-card p-1 shadow-lg", children: options.map((h) => /* @__PURE__ */ jsx12(
       "button",
       {
         type: "button",
@@ -2591,7 +3052,7 @@ function HarnessPicker({
 }
 function useCoherentHandlers(props) {
   const { model, models, harness, onModelChange, onHarnessChange } = props;
-  const canonicalIds = useMemo6(() => models.map((m) => m.id), [models]);
+  const canonicalIds = useMemo7(() => models.map((m) => m.id), [models]);
   const onModel = (next) => {
     onModelChange(next);
     const nextHarness = snapHarnessToModel(harness, next);
@@ -2619,11 +3080,11 @@ function AgentSessionControls(props) {
     className
   } = props;
   const { onModel, onHarness } = useCoherentHandlers(props);
-  const [open, setOpen] = useState11(false);
+  const [open, setOpen] = useState13(false);
   const { containerRef: popoverRef, triggerProps } = usePopover(open, setOpen);
   const selectedModel = models.find((m) => m.id === model);
   const showEffort = selectedModel?.supportsReasoning ?? true;
-  const modelPicker = /* @__PURE__ */ jsx11(
+  const modelPicker = /* @__PURE__ */ jsx12(
     ModelPicker,
     {
       value: model,
@@ -2634,17 +3095,17 @@ function AgentSessionControls(props) {
     }
   );
   if (layout === "inline") {
-    return /* @__PURE__ */ jsxs9("div", { className: `flex items-center gap-1.5 ${className ?? ""}`, children: [
+    return /* @__PURE__ */ jsxs10("div", { className: `flex items-center gap-1.5 ${className ?? ""}`, children: [
       modelPicker,
-      showHarness && /* @__PURE__ */ jsx11(HarnessPicker, { value: harness, onChange: onHarness, available: availableHarnesses }),
-      showEffort && /* @__PURE__ */ jsx11(EffortPicker, { value: effort, onChange: onEffortChange })
+      showHarness && /* @__PURE__ */ jsx12(HarnessPicker, { value: harness, onChange: onHarness, available: availableHarnesses }),
+      showEffort && /* @__PURE__ */ jsx12(EffortPicker, { value: effort, onChange: onEffortChange })
     ] });
   }
   const hasAdvanced = showHarness || showEffort;
-  return /* @__PURE__ */ jsxs9("div", { className: `flex items-center gap-1.5 ${className ?? ""}`, children: [
+  return /* @__PURE__ */ jsxs10("div", { className: `flex items-center gap-1.5 ${className ?? ""}`, children: [
     modelPicker,
-    hasAdvanced && /* @__PURE__ */ jsxs9("div", { ref: popoverRef, className: "relative inline-flex", children: [
-      /* @__PURE__ */ jsx11(
+    hasAdvanced && /* @__PURE__ */ jsxs10("div", { ref: popoverRef, className: "relative inline-flex", children: [
+      /* @__PURE__ */ jsx12(
         "button",
         {
           type: "button",
@@ -2653,19 +3114,19 @@ function AgentSessionControls(props) {
           title: "Model settings \u2014 pick the agent backend and how hard it thinks",
           className: `flex h-8 w-8 items-center justify-center rounded-full text-muted-foreground transition-colors hover:bg-muted hover:text-foreground data-[state=open]:bg-muted ${FOCUS_RING}`,
           "data-state": open ? "open" : "closed",
-          children: /* @__PURE__ */ jsx11(GearGlyph, { className: "h-4 w-4" })
+          children: /* @__PURE__ */ jsx12(GearGlyph, { className: "h-4 w-4" })
         }
       ),
-      open && /* @__PURE__ */ jsxs9("div", { className: "absolute bottom-full left-0 z-50 mb-2 w-72 space-y-3 rounded-xl border border-border bg-card p-3 shadow-lg", children: [
-        showHarness && /* @__PURE__ */ jsxs9("div", { className: "space-y-1.5", children: [
-          /* @__PURE__ */ jsx11("p", { className: "text-xs font-medium text-foreground", children: "Agent backend" }),
-          /* @__PURE__ */ jsx11(HarnessPicker, { value: harness, onChange: onHarness, available: availableHarnesses }),
-          /* @__PURE__ */ jsx11("p", { className: "text-[11px] leading-snug text-muted-foreground", children: "The engine that runs the agent. Switching it keeps your model choice compatible." })
+      open && /* @__PURE__ */ jsxs10("div", { className: "absolute bottom-full left-0 z-50 mb-2 w-72 space-y-3 rounded-xl border border-border bg-card p-3 shadow-lg", children: [
+        showHarness && /* @__PURE__ */ jsxs10("div", { className: "space-y-1.5", children: [
+          /* @__PURE__ */ jsx12("p", { className: "text-xs font-medium text-foreground", children: "Agent backend" }),
+          /* @__PURE__ */ jsx12(HarnessPicker, { value: harness, onChange: onHarness, available: availableHarnesses }),
+          /* @__PURE__ */ jsx12("p", { className: "text-[11px] leading-snug text-muted-foreground", children: "The engine that runs the agent. Switching it keeps your model choice compatible." })
         ] }),
-        showEffort && /* @__PURE__ */ jsxs9("div", { className: "space-y-1.5", children: [
-          /* @__PURE__ */ jsx11("p", { className: "text-xs font-medium text-foreground", children: "Thinking" }),
-          /* @__PURE__ */ jsx11(EffortPicker, { value: effort, onChange: onEffortChange, label: "" }),
-          /* @__PURE__ */ jsx11("p", { className: "text-[11px] leading-snug text-muted-foreground", children: "How hard the agent thinks before answering. Higher is slower but more thorough." })
+        showEffort && /* @__PURE__ */ jsxs10("div", { className: "space-y-1.5", children: [
+          /* @__PURE__ */ jsx12("p", { className: "text-xs font-medium text-foreground", children: "Thinking" }),
+          /* @__PURE__ */ jsx12(EffortPicker, { value: effort, onChange: onEffortChange, label: "" }),
+          /* @__PURE__ */ jsx12("p", { className: "text-[11px] leading-snug text-muted-foreground", children: "How hard the agent thinks before answering. Higher is slower but more thorough." })
         ] })
       ] })
     ] })
@@ -2673,7 +3134,7 @@ function AgentSessionControls(props) {
 }
 
 // src/web-react/index.tsx
-import { Fragment as Fragment5, jsx as jsx12, jsxs as jsxs10 } from "react/jsx-runtime";
+import { Fragment as Fragment5, jsx as jsx13, jsxs as jsxs11 } from "react/jsx-runtime";
 function formatModelCost(msg, models) {
   if (msg.promptTokens == null && msg.completionTokens == null) return null;
   const pricing = models.find((m) => m.id === msg.modelUsed)?.pricing;
@@ -2687,41 +3148,41 @@ function formatTokensPerSecond(msg) {
   return `${Math.round(msg.completionTokens / (msg.durationMs / 1e3))} tok/s`;
 }
 function RunDrillIn({ run, onClose }) {
-  return /* @__PURE__ */ jsxs10("div", { className: "fixed inset-y-0 right-0 z-50 flex w-[480px] max-w-full flex-col border-l border-border bg-card shadow-xl", children: [
-    /* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-2 border-b border-border px-4 py-3", children: [
-      /* @__PURE__ */ jsx12(
+  return /* @__PURE__ */ jsxs11("div", { className: "fixed inset-y-0 right-0 z-50 flex w-[480px] max-w-full flex-col border-l border-border bg-card shadow-xl", children: [
+    /* @__PURE__ */ jsxs11("div", { className: "flex items-center gap-2 border-b border-border px-4 py-3", children: [
+      /* @__PURE__ */ jsx13(
         "span",
         {
           className: `h-2 w-2 shrink-0 rounded-full ${run.status === "running" ? "bg-warning" : run.status === "error" ? "bg-destructive" : "bg-success"}`
         }
       ),
-      /* @__PURE__ */ jsxs10("div", { className: "min-w-0 flex-1", children: [
-        /* @__PURE__ */ jsx12("p", { className: "truncate text-sm font-semibold", children: run.title }),
-        /* @__PURE__ */ jsx12("p", { className: "truncate font-mono text-[11px] text-muted-foreground", children: run.toolName })
+      /* @__PURE__ */ jsxs11("div", { className: "min-w-0 flex-1", children: [
+        /* @__PURE__ */ jsx13("p", { className: "truncate text-sm font-semibold", children: run.title }),
+        /* @__PURE__ */ jsx13("p", { className: "truncate font-mono text-[11px] text-muted-foreground", children: run.toolName })
       ] }),
-      /* @__PURE__ */ jsx12(
+      /* @__PURE__ */ jsx13(
         "button",
         {
           type: "button",
           onClick: onClose,
           "aria-label": "Close",
           className: "rounded-md p-1.5 text-muted-foreground transition hover:bg-accent/30 hover:text-foreground",
-          children: /* @__PURE__ */ jsx12("svg", { className: "h-4 w-4", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx12("path", { d: "M18 6 6 18M6 6l12 12" }) })
+          children: /* @__PURE__ */ jsx13("svg", { className: "h-4 w-4", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx13("path", { d: "M18 6 6 18M6 6l12 12" }) })
         }
       )
     ] }),
-    /* @__PURE__ */ jsxs10("div", { className: "flex-1 space-y-3 overflow-y-auto p-4", children: [
-      run.steps.length === 0 && /* @__PURE__ */ jsx12("p", { className: "text-sm text-muted-foreground", children: "No steps recorded yet." }),
-      run.steps.map((step, i) => /* @__PURE__ */ jsxs10("div", { className: "rounded-lg border border-border/60 bg-background", children: [
-        /* @__PURE__ */ jsxs10("div", { className: "flex items-baseline gap-2 border-b border-border/40 px-3 py-1.5", children: [
-          /* @__PURE__ */ jsx12("span", { className: `font-mono text-[11px] ${step.status === "error" ? "text-destructive" : "text-muted-foreground"}`, children: step.status === "error" ? "\u2717" : "$" }),
-          /* @__PURE__ */ jsx12("code", { className: "min-w-0 flex-1 truncate font-mono text-xs", children: step.label }),
-          /* @__PURE__ */ jsx12("span", { className: "shrink-0 text-[10px] text-muted-foreground", children: new Date(step.at).toLocaleTimeString() })
+    /* @__PURE__ */ jsxs11("div", { className: "flex-1 space-y-3 overflow-y-auto p-4", children: [
+      run.steps.length === 0 && /* @__PURE__ */ jsx13("p", { className: "text-sm text-muted-foreground", children: "No steps recorded yet." }),
+      run.steps.map((step, i) => /* @__PURE__ */ jsxs11("div", { className: "rounded-lg border border-border/60 bg-background", children: [
+        /* @__PURE__ */ jsxs11("div", { className: "flex items-baseline gap-2 border-b border-border/40 px-3 py-1.5", children: [
+          /* @__PURE__ */ jsx13("span", { className: `font-mono text-[11px] ${step.status === "error" ? "text-destructive" : "text-muted-foreground"}`, children: step.status === "error" ? "\u2717" : "$" }),
+          /* @__PURE__ */ jsx13("code", { className: "min-w-0 flex-1 truncate font-mono text-xs", children: step.label }),
+          /* @__PURE__ */ jsx13("span", { className: "shrink-0 text-[10px] text-muted-foreground", children: new Date(step.at).toLocaleTimeString() })
         ] }),
-        step.detail && /* @__PURE__ */ jsx12("pre", { className: "max-h-48 overflow-auto whitespace-pre-wrap px-3 py-2 font-mono text-[11px] leading-relaxed text-muted-foreground", children: step.detail })
+        step.detail && /* @__PURE__ */ jsx13("pre", { className: "max-h-48 overflow-auto whitespace-pre-wrap px-3 py-2 font-mono text-[11px] leading-relaxed text-muted-foreground", children: step.detail })
       ] }, i))
     ] }),
-    /* @__PURE__ */ jsx12("p", { className: "border-t border-border px-4 py-2 text-[11px] text-muted-foreground", children: "Readonly drill-in. Follow up in the main chat." })
+    /* @__PURE__ */ jsx13("p", { className: "border-t border-border px-4 py-2 text-[11px] text-muted-foreground", children: "Readonly drill-in. Follow up in the main chat." })
   ] });
 }
 function pendingApprovalOf(call) {
@@ -2735,20 +3196,20 @@ function ChatEmptyState({
   subline = "Describe the outcome you want. The agent works through it step by step, and pauses for your approval before anything irreversible.",
   doors
 }) {
-  return /* @__PURE__ */ jsxs10("div", { className: "mx-auto flex w-full max-w-2xl flex-col items-center px-6 py-12 text-center sm:py-20", children: [
-    /* @__PURE__ */ jsx12("span", { className: "mb-5 inline-flex h-14 w-14 items-center justify-center rounded-2xl bg-primary/10 ring-1 ring-primary/15", children: /* @__PURE__ */ jsx12(BrandMark, { size: 32, className: "shrink-0" }) }),
-    /* @__PURE__ */ jsx12("p", { className: "text-[11px] font-semibold uppercase tracking-[0.18em] text-muted-foreground", children: productName }),
-    /* @__PURE__ */ jsx12("h2", { className: "mt-1.5 text-balance text-2xl font-semibold leading-tight text-foreground sm:text-[28px]", children: headline }),
-    subline && /* @__PURE__ */ jsx12("p", { className: "mt-3 max-w-md text-[15px] leading-relaxed text-muted-foreground", children: subline }),
-    doors && doors.length > 0 && /* @__PURE__ */ jsx12("div", { className: "mt-7 grid w-full gap-2.5 sm:grid-cols-3", children: doors.slice(0, 3).map((door, i) => /* @__PURE__ */ jsxs10(
+  return /* @__PURE__ */ jsxs11("div", { className: "mx-auto flex w-full max-w-2xl flex-col items-center px-6 py-12 text-center sm:py-20", children: [
+    /* @__PURE__ */ jsx13("span", { className: "mb-5 inline-flex h-14 w-14 items-center justify-center rounded-2xl bg-primary/10 ring-1 ring-primary/15", children: /* @__PURE__ */ jsx13(BrandMark, { size: 32, className: "shrink-0" }) }),
+    /* @__PURE__ */ jsx13("p", { className: "text-[11px] font-semibold uppercase tracking-[0.18em] text-muted-foreground", children: productName }),
+    /* @__PURE__ */ jsx13("h2", { className: "mt-1.5 text-balance text-2xl font-semibold leading-tight text-foreground sm:text-[28px]", children: headline }),
+    subline && /* @__PURE__ */ jsx13("p", { className: "mt-3 max-w-md text-[15px] leading-relaxed text-muted-foreground", children: subline }),
+    doors && doors.length > 0 && /* @__PURE__ */ jsx13("div", { className: "mt-7 grid w-full gap-2.5 sm:grid-cols-3", children: doors.slice(0, 3).map((door, i) => /* @__PURE__ */ jsxs11(
       "button",
       {
         type: "button",
         onClick: door.onSelect,
         className: "group flex min-h-[44px] flex-col items-start rounded-xl border border-border bg-card px-4 py-3 text-left transition hover:border-primary/40 hover:bg-accent/30 focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",
         children: [
-          /* @__PURE__ */ jsx12("span", { className: "text-sm font-semibold text-foreground", children: door.label }),
-          door.description && /* @__PURE__ */ jsx12("span", { className: "mt-0.5 text-[12px] leading-snug text-muted-foreground", children: door.description })
+          /* @__PURE__ */ jsx13("span", { className: "text-sm font-semibold text-foreground", children: door.label }),
+          door.description && /* @__PURE__ */ jsx13("span", { className: "mt-0.5 text-[12px] leading-snug text-muted-foreground", children: door.description })
         ]
       },
       i
@@ -2757,26 +3218,26 @@ function ChatEmptyState({
 }
 function ToolGlyph({ name, className }) {
   if (name.startsWith("sandbox_")) {
-    return /* @__PURE__ */ jsxs10("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
-      /* @__PURE__ */ jsx12("polyline", { points: "4 17 10 11 4 5" }),
-      /* @__PURE__ */ jsx12("line", { x1: "12", y1: "19", x2: "20", y2: "19" })
+    return /* @__PURE__ */ jsxs11("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
+      /* @__PURE__ */ jsx13("polyline", { points: "4 17 10 11 4 5" }),
+      /* @__PURE__ */ jsx13("line", { x1: "12", y1: "19", x2: "20", y2: "19" })
     ] });
   }
   if (name === "submit_proposal") {
-    return /* @__PURE__ */ jsxs10("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
-      /* @__PURE__ */ jsx12("path", { d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" }),
-      /* @__PURE__ */ jsx12("path", { d: "M14 2v6h6M9 15l2 2 4-4" })
+    return /* @__PURE__ */ jsxs11("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
+      /* @__PURE__ */ jsx13("path", { d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" }),
+      /* @__PURE__ */ jsx13("path", { d: "M14 2v6h6M9 15l2 2 4-4" })
     ] });
   }
   if (name === "schedule_followup") {
-    return /* @__PURE__ */ jsxs10("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", "aria-hidden": true, children: [
-      /* @__PURE__ */ jsx12("circle", { cx: "12", cy: "12", r: "9" }),
-      /* @__PURE__ */ jsx12("path", { d: "M12 7v5l3 3" })
+    return /* @__PURE__ */ jsxs11("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", "aria-hidden": true, children: [
+      /* @__PURE__ */ jsx13("circle", { cx: "12", cy: "12", r: "9" }),
+      /* @__PURE__ */ jsx13("path", { d: "M12 7v5l3 3" })
     ] });
   }
-  return /* @__PURE__ */ jsxs10("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
-    /* @__PURE__ */ jsx12("path", { d: "M12 3v3m0 12v3M3 12h3m12 0h3" }),
-    /* @__PURE__ */ jsx12("circle", { cx: "12", cy: "12", r: "4" })
+  return /* @__PURE__ */ jsxs11("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
+    /* @__PURE__ */ jsx13("path", { d: "M12 3v3m0 12v3M3 12h3m12 0h3" }),
+    /* @__PURE__ */ jsx13("circle", { cx: "12", cy: "12", r: "4" })
   ] });
 }
 function toolOutcomeOf(call) {
@@ -2844,40 +3305,40 @@ function truncate(v, max = 240) {
 function KvRows({ data }) {
   const entries = Object.entries(data).filter(([, v]) => v !== void 0 && v !== null && v !== "");
   if (!entries.length) return null;
-  return /* @__PURE__ */ jsx12("dl", { className: "grid grid-cols-[auto_1fr] gap-x-3 gap-y-1", children: entries.map(([k, v]) => /* @__PURE__ */ jsxs10("div", { className: "contents", children: [
-    /* @__PURE__ */ jsx12("dt", { className: "font-mono text-[11px] text-muted-foreground", children: k }),
-    /* @__PURE__ */ jsx12("dd", { className: "min-w-0 whitespace-pre-wrap break-words font-mono text-[11px] text-muted-foreground", children: truncate(v) })
+  return /* @__PURE__ */ jsx13("dl", { className: "grid grid-cols-[auto_1fr] gap-x-3 gap-y-1", children: entries.map(([k, v]) => /* @__PURE__ */ jsxs11("div", { className: "contents", children: [
+    /* @__PURE__ */ jsx13("dt", { className: "font-mono text-[11px] text-muted-foreground", children: k }),
+    /* @__PURE__ */ jsx13("dd", { className: "min-w-0 whitespace-pre-wrap break-words font-mono text-[11px] text-muted-foreground", children: truncate(v) })
   ] }, k)) });
 }
 function ShellDetail({ call }) {
   const outcome = toolOutcomeOf(call);
   const r = outcome?.result ?? {};
-  return /* @__PURE__ */ jsxs10("div", { className: "overflow-hidden rounded-md bg-zinc-900 font-mono text-[11px] leading-relaxed", children: [
-    /* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-2 px-3 pt-2 text-zinc-400", children: [
-      /* @__PURE__ */ jsx12("span", { className: "select-none text-zinc-500", children: "$" }),
-      /* @__PURE__ */ jsx12("span", { className: "min-w-0 flex-1 truncate text-zinc-200", children: String(call.args?.command ?? "") }),
-      r.exitCode != null && /* @__PURE__ */ jsxs10("span", { className: r.exitCode === 0 ? "text-success" : "text-destructive", children: [
+  return /* @__PURE__ */ jsxs11("div", { className: "overflow-hidden rounded-md bg-zinc-900 font-mono text-[11px] leading-relaxed", children: [
+    /* @__PURE__ */ jsxs11("div", { className: "flex items-center gap-2 px-3 pt-2 text-zinc-400", children: [
+      /* @__PURE__ */ jsx13("span", { className: "select-none text-zinc-500", children: "$" }),
+      /* @__PURE__ */ jsx13("span", { className: "min-w-0 flex-1 truncate text-zinc-200", children: String(call.args?.command ?? "") }),
+      r.exitCode != null && /* @__PURE__ */ jsxs11("span", { className: r.exitCode === 0 ? "text-success" : "text-destructive", children: [
         "exit ",
         r.exitCode
       ] })
     ] }),
-    /* @__PURE__ */ jsx12("pre", { className: "max-h-56 overflow-auto whitespace-pre-wrap px-3 pb-2.5 pt-1.5 text-zinc-300", children: outcome?.ok === false ? outcome.message ?? "failed" : [r.stdout, r.stderr].filter(Boolean).join("\n") || "(no output)" })
+    /* @__PURE__ */ jsx13("pre", { className: "max-h-56 overflow-auto whitespace-pre-wrap px-3 pb-2.5 pt-1.5 text-zinc-300", children: outcome?.ok === false ? outcome.message ?? "failed" : [r.stdout, r.stderr].filter(Boolean).join("\n") || "(no output)" })
   ] });
 }
 function DefaultToolDetail({ call }) {
   const result = call.result;
   const envelope = typeof result === "object" && result !== null ? result : null;
-  return /* @__PURE__ */ jsxs10("div", { className: "space-y-2", children: [
-    call.args && Object.keys(call.args).length > 0 && /* @__PURE__ */ jsxs10("div", { children: [
-      /* @__PURE__ */ jsx12("p", { className: "mb-1 text-[10px] font-semibold uppercase tracking-wide text-muted-foreground", children: "Called with" }),
-      /* @__PURE__ */ jsx12(KvRows, { data: call.args })
+  return /* @__PURE__ */ jsxs11("div", { className: "space-y-2", children: [
+    call.args && Object.keys(call.args).length > 0 && /* @__PURE__ */ jsxs11("div", { children: [
+      /* @__PURE__ */ jsx13("p", { className: "mb-1 text-[10px] font-semibold uppercase tracking-wide text-muted-foreground", children: "Called with" }),
+      /* @__PURE__ */ jsx13(KvRows, { data: call.args })
     ] }),
-    envelope ? /* @__PURE__ */ jsxs10("div", { children: [
-      /* @__PURE__ */ jsx12("p", { className: "mb-1 text-[10px] font-semibold uppercase tracking-wide text-muted-foreground", children: envelope.ok === false ? "Failed" : "Result" }),
-      envelope.ok === false ? /* @__PURE__ */ jsx12("p", { className: "text-xs text-destructive", children: envelope.message ?? "Tool failed" }) : envelope.result && typeof envelope.result === "object" ? /* @__PURE__ */ jsx12(KvRows, { data: envelope.result }) : envelope.result != null ? /* @__PURE__ */ jsx12("p", { className: "font-mono text-[11px] text-muted-foreground", children: truncate(envelope.result) }) : null
-    ] }) : result != null ? /* @__PURE__ */ jsxs10("div", { children: [
-      /* @__PURE__ */ jsx12("p", { className: "mb-1 text-[10px] font-semibold uppercase tracking-wide text-muted-foreground", children: "Result" }),
-      /* @__PURE__ */ jsx12("p", { className: "font-mono text-[11px] text-muted-foreground", children: truncate(result) })
+    envelope ? /* @__PURE__ */ jsxs11("div", { children: [
+      /* @__PURE__ */ jsx13("p", { className: "mb-1 text-[10px] font-semibold uppercase tracking-wide text-muted-foreground", children: envelope.ok === false ? "Failed" : "Result" }),
+      envelope.ok === false ? /* @__PURE__ */ jsx13("p", { className: "text-xs text-destructive", children: envelope.message ?? "Tool failed" }) : envelope.result && typeof envelope.result === "object" ? /* @__PURE__ */ jsx13(KvRows, { data: envelope.result }) : envelope.result != null ? /* @__PURE__ */ jsx13("p", { className: "font-mono text-[11px] text-muted-foreground", children: truncate(envelope.result) }) : null
+    ] }) : result != null ? /* @__PURE__ */ jsxs11("div", { children: [
+      /* @__PURE__ */ jsx13("p", { className: "mb-1 text-[10px] font-semibold uppercase tracking-wide text-muted-foreground", children: "Result" }),
+      /* @__PURE__ */ jsx13("p", { className: "font-mono text-[11px] text-muted-foreground", children: truncate(result) })
     ] }) : null
   ] });
 }
@@ -2888,23 +3349,23 @@ function ProposalCard({
   approval,
   renderers
 }) {
-  const [expanded, setExpanded] = useState12(false);
+  const [expanded, setExpanded] = useState14(false);
   const { summary, meta } = proposalPreview(call);
   const custom = renderers?.[call.name]?.(call, message);
   const { pending: deciding, run: decide } = usePending();
-  return /* @__PURE__ */ jsxs10("div", { className: "w-full max-w-full rounded-xl border border-warning/50 bg-warning/[0.06] text-sm shadow-sm ring-1 ring-warning/10", children: [
-    /* @__PURE__ */ jsxs10("div", { className: "flex items-start gap-2.5 px-4 pt-3.5", children: [
-      /* @__PURE__ */ jsx12("span", { className: "mt-0.5 inline-flex h-6 w-6 shrink-0 items-center justify-center rounded-full bg-warning/15 text-warning", children: /* @__PURE__ */ jsx12(ToolGlyph, { name: call.name, className: "h-3.5 w-3.5" }) }),
-      /* @__PURE__ */ jsxs10("div", { className: "min-w-0 flex-1", children: [
-        /* @__PURE__ */ jsx12("p", { className: "text-[10px] font-semibold uppercase tracking-wider text-warning-foreground", children: "Needs your approval" }),
-        /* @__PURE__ */ jsx12("p", { className: "mt-0.5 text-[15px] font-semibold leading-snug text-foreground", children: friendlyToolTitle(call) }),
-        summary && /* @__PURE__ */ jsx12("p", { className: "mt-1 text-[13px] leading-relaxed text-muted-foreground", children: summary }),
-        meta.length > 0 && /* @__PURE__ */ jsx12("div", { className: "mt-1.5 flex flex-wrap items-center gap-1.5", children: meta.map((m, i) => /* @__PURE__ */ jsx12("span", { className: "rounded-full bg-muted/60 px-2 py-0.5 text-[11px] font-medium text-muted-foreground", children: m }, i)) })
+  return /* @__PURE__ */ jsxs11("div", { className: "w-full max-w-full rounded-xl border border-warning/50 bg-warning/[0.06] text-sm shadow-sm ring-1 ring-warning/10", children: [
+    /* @__PURE__ */ jsxs11("div", { className: "flex items-start gap-2.5 px-4 pt-3.5", children: [
+      /* @__PURE__ */ jsx13("span", { className: "mt-0.5 inline-flex h-6 w-6 shrink-0 items-center justify-center rounded-full bg-warning/15 text-warning", children: /* @__PURE__ */ jsx13(ToolGlyph, { name: call.name, className: "h-3.5 w-3.5" }) }),
+      /* @__PURE__ */ jsxs11("div", { className: "min-w-0 flex-1", children: [
+        /* @__PURE__ */ jsx13("p", { className: "text-[10px] font-semibold uppercase tracking-wider text-warning-foreground", children: "Needs your approval" }),
+        /* @__PURE__ */ jsx13("p", { className: "mt-0.5 text-[15px] font-semibold leading-snug text-foreground", children: friendlyToolTitle(call) }),
+        summary && /* @__PURE__ */ jsx13("p", { className: "mt-1 text-[13px] leading-relaxed text-muted-foreground", children: summary }),
+        meta.length > 0 && /* @__PURE__ */ jsx13("div", { className: "mt-1.5 flex flex-wrap items-center gap-1.5", children: meta.map((m, i) => /* @__PURE__ */ jsx13("span", { className: "rounded-full bg-muted/60 px-2 py-0.5 text-[11px] font-medium text-muted-foreground", children: m }, i)) })
       ] })
     ] }),
-    /* @__PURE__ */ jsxs10("div", { className: "flex flex-wrap items-center gap-2 px-4 pb-3.5 pt-3", children: [
-      approval ? /* @__PURE__ */ jsxs10(Fragment5, { children: [
-        /* @__PURE__ */ jsx12(
+    /* @__PURE__ */ jsxs11("div", { className: "flex flex-wrap items-center gap-2 px-4 pb-3.5 pt-3", children: [
+      approval ? /* @__PURE__ */ jsxs11(Fragment5, { children: [
+        /* @__PURE__ */ jsx13(
           "button",
           {
             type: "button",
@@ -2914,7 +3375,7 @@ function ProposalCard({
             children: "Approve & run"
           }
         ),
-        /* @__PURE__ */ jsx12(
+        /* @__PURE__ */ jsx13(
           "button",
           {
             type: "button",
@@ -2924,8 +3385,8 @@ function ProposalCard({
             children: "Reject"
           }
         )
-      ] }) : /* @__PURE__ */ jsx12("span", { className: "text-[12px] font-medium text-muted-foreground", children: "Awaiting approval\u2026" }),
-      /* @__PURE__ */ jsxs10(
+      ] }) : /* @__PURE__ */ jsx13("span", { className: "text-[12px] font-medium text-muted-foreground", children: "Awaiting approval\u2026" }),
+      /* @__PURE__ */ jsxs11(
         "button",
         {
           type: "button",
@@ -2934,23 +3395,23 @@ function ProposalCard({
           className: "ml-auto inline-flex items-center gap-1 rounded text-[12px] font-medium text-muted-foreground transition hover:text-foreground focus:outline-none focus-visible:ring-2 focus-visible:ring-ring",
           children: [
             expanded ? "Hide details" : "View details",
-            /* @__PURE__ */ jsx12(ChevronDown, { className: `h-3 w-3 transition-transform ${expanded ? "rotate-180" : ""}` })
+            /* @__PURE__ */ jsx13(ChevronDown, { className: `h-3 w-3 transition-transform ${expanded ? "rotate-180" : ""}` })
           ]
         }
       )
     ] }),
-    expanded && /* @__PURE__ */ jsx12("div", { className: "border-t border-warning/20 px-4 py-3 text-xs", children: custom ?? /* @__PURE__ */ jsx12(DefaultToolDetail, { call }) })
+    expanded && /* @__PURE__ */ jsx13("div", { className: "border-t border-warning/20 px-4 py-3 text-xs", children: custom ?? /* @__PURE__ */ jsx13(DefaultToolDetail, { call }) })
   ] });
 }
 function FollowupCard({ call }) {
   const a = call.args ?? {};
   const when = typeof a.when === "string" ? a.when : typeof a.at === "string" ? a.at : typeof a.schedule === "string" ? a.schedule : null;
-  return /* @__PURE__ */ jsxs10("div", { className: "w-fit min-w-[260px] max-w-full rounded-lg border border-border/60 border-l-2 border-l-primary/60 bg-muted/20 px-3 py-2 text-sm", children: [
-    /* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-2", children: [
-      /* @__PURE__ */ jsx12(ToolGlyph, { name: call.name, className: "h-3.5 w-3.5 shrink-0 text-primary/80" }),
-      /* @__PURE__ */ jsx12("span", { className: "min-w-0 flex-1 truncate font-medium text-foreground", children: friendlyToolTitle(call) })
+  return /* @__PURE__ */ jsxs11("div", { className: "w-fit min-w-[260px] max-w-full rounded-lg border border-border/60 border-l-2 border-l-primary/60 bg-muted/20 px-3 py-2 text-sm", children: [
+    /* @__PURE__ */ jsxs11("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsx13(ToolGlyph, { name: call.name, className: "h-3.5 w-3.5 shrink-0 text-primary/80" }),
+      /* @__PURE__ */ jsx13("span", { className: "min-w-0 flex-1 truncate font-medium text-foreground", children: friendlyToolTitle(call) })
     ] }),
-    when && /* @__PURE__ */ jsx12("p", { className: "mt-0.5 pl-[22px] text-[12px] text-muted-foreground", children: when })
+    when && /* @__PURE__ */ jsx13("p", { className: "mt-0.5 pl-[22px] text-[12px] text-muted-foreground", children: when })
   ] });
 }
 function ToolCallCard({
@@ -2960,13 +3421,13 @@ function ToolCallCard({
   onOpenRun,
   renderers
 }) {
-  const [expanded, setExpanded] = useState12(false);
+  const [expanded, setExpanded] = useState14(false);
   const pending = call.status === "done" ? pendingApprovalOf(call) : null;
   const kind = blockKindOf(call);
   const failed = call.status === "error" || toolOutcomeOf(call)?.ok === false;
   const custom = renderers?.[call.name]?.(call, message);
   if (pending) {
-    return /* @__PURE__ */ jsx12(
+    return /* @__PURE__ */ jsx13(
       ProposalCard,
       {
         call,
@@ -2978,16 +3439,16 @@ function ToolCallCard({
     );
   }
   if (kind === "followup" && !failed) {
-    return /* @__PURE__ */ jsx12(FollowupCard, { call });
+    return /* @__PURE__ */ jsx13(FollowupCard, { call });
   }
   const isCommand = kind === "command";
-  return /* @__PURE__ */ jsxs10(
+  return /* @__PURE__ */ jsxs11(
     "div",
     {
       className: `w-fit min-w-[280px] max-w-full rounded-lg border text-xs transition ${failed ? "border-destructive/40 bg-destructive/5" : "border-border/60 bg-muted/20"}`,
       children: [
-        /* @__PURE__ */ jsxs10("div", { className: "flex w-full items-center gap-2 px-3 py-2", children: [
-          /* @__PURE__ */ jsxs10(
+        /* @__PURE__ */ jsxs11("div", { className: "flex w-full items-center gap-2 px-3 py-2", children: [
+          /* @__PURE__ */ jsxs11(
             "button",
             {
               type: "button",
@@ -2995,14 +3456,14 @@ function ToolCallCard({
               "aria-expanded": expanded,
               className: "flex min-w-0 flex-1 items-center gap-2 rounded text-left focus:outline-none focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
               children: [
-                /* @__PURE__ */ jsx12(
+                /* @__PURE__ */ jsx13(
                   "span",
                   {
                     className: `h-2 w-2 shrink-0 rounded-full ${call.status === "running" ? "animate-pulse bg-warning" : failed ? "bg-destructive" : "bg-success"}`
                   }
                 ),
-                /* @__PURE__ */ jsx12(ToolGlyph, { name: call.name, className: "h-3.5 w-3.5 shrink-0 text-muted-foreground" }),
-                /* @__PURE__ */ jsx12(
+                /* @__PURE__ */ jsx13(ToolGlyph, { name: call.name, className: "h-3.5 w-3.5 shrink-0 text-muted-foreground" }),
+                /* @__PURE__ */ jsx13(
                   "span",
                   {
                     className: `min-w-0 flex-1 truncate ${isCommand ? "font-mono text-[12px] tracking-tight text-foreground/90" : "font-medium"}`,
@@ -3012,8 +3473,8 @@ function ToolCallCard({
               ]
             }
           ),
-          /* @__PURE__ */ jsx12("span", { className: "shrink-0 text-[11px] text-muted-foreground", children: call.status === "running" ? "running\u2026" : failed ? "failed" : "done" }),
-          /* @__PURE__ */ jsx12(
+          /* @__PURE__ */ jsx13("span", { className: "shrink-0 text-[11px] text-muted-foreground", children: call.status === "running" ? "running\u2026" : failed ? "failed" : "done" }),
+          /* @__PURE__ */ jsx13(
             "button",
             {
               type: "button",
@@ -3021,13 +3482,13 @@ function ToolCallCard({
               "aria-label": expanded ? "Collapse details" : "Expand details",
               "aria-expanded": expanded,
               className: "shrink-0 rounded p-0.5 focus:outline-none focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
-              children: /* @__PURE__ */ jsx12(ChevronDown, { className: `h-3 w-3 text-muted-foreground transition-transform ${expanded ? "rotate-180" : ""}` })
+              children: /* @__PURE__ */ jsx13(ChevronDown, { className: `h-3 w-3 text-muted-foreground transition-transform ${expanded ? "rotate-180" : ""}` })
             }
           )
         ] }),
-        expanded && /* @__PURE__ */ jsxs10("div", { className: "border-t border-border/40 px-3 py-2.5", children: [
-          custom ?? (call.name === "sandbox_run_command" ? /* @__PURE__ */ jsx12(ShellDetail, { call }) : /* @__PURE__ */ jsx12(DefaultToolDetail, { call })),
-          onOpenRun && call.name.startsWith("sandbox_") && /* @__PURE__ */ jsx12(
+        expanded && /* @__PURE__ */ jsxs11("div", { className: "border-t border-border/40 px-3 py-2.5", children: [
+          custom ?? (call.name === "sandbox_run_command" ? /* @__PURE__ */ jsx13(ShellDetail, { call }) : /* @__PURE__ */ jsx13(DefaultToolDetail, { call })),
+          onOpenRun && call.name.startsWith("sandbox_") && /* @__PURE__ */ jsx13(
             "button",
             {
               type: "button",
@@ -3042,7 +3503,7 @@ function ToolCallCard({
   );
 }
 function StreamingCaret() {
-  return /* @__PURE__ */ jsx12(
+  return /* @__PURE__ */ jsx13(
     "span",
     {
       className: "ml-0.5 inline-block h-[1.1em] w-[3px] translate-y-[2px] animate-pulse rounded-sm bg-foreground/70",
@@ -3057,11 +3518,11 @@ function SegmentText({
   renderBody
 }) {
   const text = useSmoothText(content, streaming);
-  const body = useMemo7(() => renderBody(text), [renderBody, text]);
+  const body = useMemo8(() => renderBody(text), [renderBody, text]);
   if (!content.trim() && !showCaret) return null;
-  return /* @__PURE__ */ jsxs10("div", { className: "text-base leading-[1.75]", children: [
+  return /* @__PURE__ */ jsxs11("div", { className: "text-base leading-[1.75]", children: [
     body,
-    showCaret && /* @__PURE__ */ jsx12(StreamingCaret, {})
+    showCaret && /* @__PURE__ */ jsx13(StreamingCaret, {})
   ] });
 }
 var COLLAPSE_TOOL_RUN_AT = 3;
@@ -3084,7 +3545,7 @@ function SegmentedBody({
   const leftoverToolCalls = (msg.toolCalls ?? []).filter(
     (tc) => !segmentToolIds.has(tc.id)
   );
-  const renderToolCard = (call) => /* @__PURE__ */ jsx12(
+  const renderToolCard = (call) => /* @__PURE__ */ jsx13(
     ToolCallCard,
     {
       call,
@@ -3107,9 +3568,9 @@ function SegmentedBody({
       else groups.push({ kind: "tools", index: i, calls: [seg.call] });
     }
   }
-  return /* @__PURE__ */ jsxs10("div", { className: "flex flex-col gap-2", children: [
+  return /* @__PURE__ */ jsxs11("div", { className: "flex flex-col gap-2", children: [
     groups.map(
-      (g) => g.kind === "text" ? /* @__PURE__ */ jsx12(
+      (g) => g.kind === "text" ? /* @__PURE__ */ jsx13(
         SegmentText,
         {
           content: g.content,
@@ -3118,24 +3579,24 @@ function SegmentedBody({
           renderBody
         },
         `text-${g.index}`
-      ) : !streaming && g.calls.length >= COLLAPSE_TOOL_RUN_AT && !g.calls.some(isImportantTool) ? /* @__PURE__ */ jsxs10(
+      ) : !streaming && g.calls.length >= COLLAPSE_TOOL_RUN_AT && !g.calls.some(isImportantTool) ? /* @__PURE__ */ jsxs11(
         "details",
         {
           className: "rounded-lg border-l-2 border-border/70 bg-muted/20 px-3 py-2",
           children: [
-            /* @__PURE__ */ jsxs10("summary", { className: "cursor-pointer select-none text-xs font-medium text-muted-foreground", children: [
+            /* @__PURE__ */ jsxs11("summary", { className: "cursor-pointer select-none text-xs font-medium text-muted-foreground", children: [
               "Worked through ",
               g.calls.length,
               " steps"
             ] }),
-            /* @__PURE__ */ jsx12("div", { className: "mt-2 flex flex-col gap-2", children: g.calls.map(renderToolCard) })
+            /* @__PURE__ */ jsx13("div", { className: "mt-2 flex flex-col gap-2", children: g.calls.map(renderToolCard) })
           ]
         },
         `tools-${g.index}`
-      ) : /* @__PURE__ */ jsx12("div", { className: "flex flex-col gap-2", children: g.calls.map(renderToolCard) }, `tools-${g.index}`)
+      ) : /* @__PURE__ */ jsx13("div", { className: "flex flex-col gap-2", children: g.calls.map(renderToolCard) }, `tools-${g.index}`)
     ),
     leftoverToolCalls.map(renderToolCard),
-    streaming && segments[lastIndex]?.kind === "tool" && /* @__PURE__ */ jsx12(StreamingCaret, {})
+    streaming && segments[lastIndex]?.kind === "tool" && /* @__PURE__ */ jsx13(StreamingCaret, {})
   ] });
 }
 function AssistantMessageImpl({
@@ -3148,44 +3609,45 @@ function AssistantMessageImpl({
   onToolCallClick,
   toolRenderers,
   renderExtras,
-  durableCards
+  durableCards,
+  resolveAttachmentUrl
 }) {
   const content = useSmoothText(msg.content, streaming);
   const reasoning = useSmoothText(msg.reasoning ?? "", streaming);
-  const body = useMemo7(() => renderBody(content), [renderBody, content]);
+  const body = useMemo8(() => renderBody(content), [renderBody, content]);
   const segments = msg.segments;
   const hasAnswerText = content !== "" || (segments?.some((s) => s.kind === "text" && s.content.trim() !== "") ?? false);
-  const reasoningScrollRef = useRef8(null);
-  const thinkStartRef = useRef8(null);
-  const thinkMsRef = useRef8(null);
+  const reasoningScrollRef = useRef9(null);
+  const thinkStartRef = useRef9(null);
+  const thinkMsRef = useRef9(null);
   if (streaming && reasoning && !hasAnswerText && thinkStartRef.current === null) {
     thinkStartRef.current = performance.now();
   }
   if (hasAnswerText && thinkStartRef.current !== null && thinkMsRef.current === null) {
     thinkMsRef.current = performance.now() - thinkStartRef.current;
   }
-  useEffect8(() => {
+  useEffect10(() => {
     const el = reasoningScrollRef.current;
     if (el && streaming && !hasAnswerText) el.scrollTop = el.scrollHeight;
   }, [reasoning, streaming, hasAnswerText]);
   const thinkingSeconds = useThinkingSeconds(
     streaming && !!reasoning && !hasAnswerText
   );
-  return /* @__PURE__ */ jsxs10("div", { className: "mx-auto w-full max-w-3xl px-6 py-3", children: [
-    /* @__PURE__ */ jsxs10("div", { className: "mb-1 flex items-baseline gap-2 text-[11px] tracking-wide text-muted-foreground", children: [
-      /* @__PURE__ */ jsx12("span", { className: "font-semibold uppercase", children: agentLabel }),
-      msg.modelUsed && /* @__PURE__ */ jsx12("span", { className: "font-mono normal-case", children: msg.modelUsed }),
-      formatTokensPerSecond(msg) && /* @__PURE__ */ jsx12("span", { children: formatTokensPerSecond(msg) }),
-      formatModelCost(msg, models) && /* @__PURE__ */ jsx12("span", { children: formatModelCost(msg, models) })
+  return /* @__PURE__ */ jsxs11("div", { className: "mx-auto w-full max-w-3xl px-6 py-3", children: [
+    /* @__PURE__ */ jsxs11("div", { className: "mb-1 flex items-baseline gap-2 text-[11px] tracking-wide text-muted-foreground", children: [
+      /* @__PURE__ */ jsx13("span", { className: "font-semibold uppercase", children: agentLabel }),
+      msg.modelUsed && /* @__PURE__ */ jsx13("span", { className: "font-mono normal-case", children: msg.modelUsed }),
+      formatTokensPerSecond(msg) && /* @__PURE__ */ jsx13("span", { children: formatTokensPerSecond(msg) }),
+      formatModelCost(msg, models) && /* @__PURE__ */ jsx13("span", { children: formatModelCost(msg, models) })
     ] }),
-    reasoning && /* @__PURE__ */ jsxs10("details", { className: "mb-2 rounded-lg border-l-2 border-border/70 bg-muted/20 px-3 py-2", open: !hasAnswerText, children: [
-      /* @__PURE__ */ jsx12("summary", { className: "cursor-pointer select-none text-xs font-medium text-muted-foreground", children: !hasAnswerText ? /* @__PURE__ */ jsxs10("span", { className: "animate-pulse", children: [
+    reasoning && /* @__PURE__ */ jsxs11("details", { className: "mb-2 rounded-lg border-l-2 border-border/70 bg-muted/20 px-3 py-2", open: !hasAnswerText, children: [
+      /* @__PURE__ */ jsx13("summary", { className: "cursor-pointer select-none text-xs font-medium text-muted-foreground", children: !hasAnswerText ? /* @__PURE__ */ jsxs11("span", { className: "animate-pulse", children: [
         "Thinking",
         thinkingSeconds >= 3 ? ` \xB7 ${thinkingSeconds}s` : "\u2026"
       ] }) : thinkMsRef.current != null ? `Thought for ${Math.max(1, Math.round(thinkMsRef.current / 1e3))}s` : "Thought process" }),
-      /* @__PURE__ */ jsx12("div", { ref: reasoningScrollRef, className: "mt-2 max-h-48 overflow-y-auto whitespace-pre-wrap text-[13px] leading-relaxed text-muted-foreground", children: reasoning })
+      /* @__PURE__ */ jsx13("div", { ref: reasoningScrollRef, className: "mt-2 max-h-48 overflow-y-auto whitespace-pre-wrap text-[13px] leading-relaxed text-muted-foreground", children: reasoning })
     ] }),
-    segments && segments.length > 0 ? /* @__PURE__ */ jsx12(
+    segments && segments.length > 0 ? /* @__PURE__ */ jsx13(
       SegmentedBody,
       {
         segments,
@@ -3196,12 +3658,12 @@ function AssistantMessageImpl({
         onToolCallClick,
         toolRenderers
       }
-    ) : /* @__PURE__ */ jsxs10(Fragment5, { children: [
-      /* @__PURE__ */ jsxs10("div", { className: "text-base leading-[1.75]", children: [
+    ) : /* @__PURE__ */ jsxs11(Fragment5, { children: [
+      /* @__PURE__ */ jsxs11("div", { className: "text-base leading-[1.75]", children: [
         body,
-        streaming && content && !msg.toolCalls?.length && /* @__PURE__ */ jsx12(StreamingCaret, {})
+        streaming && content && !msg.toolCalls?.length && /* @__PURE__ */ jsx13(StreamingCaret, {})
       ] }),
-      msg.toolCalls && msg.toolCalls.length > 0 && /* @__PURE__ */ jsx12("div", { className: "mt-2 flex flex-col gap-1.5", children: msg.toolCalls.map((tc) => /* @__PURE__ */ jsx12(
+      msg.toolCalls && msg.toolCalls.length > 0 && /* @__PURE__ */ jsx13("div", { className: "mt-2 flex flex-col gap-1.5", children: msg.toolCalls.map((tc) => /* @__PURE__ */ jsx13(
         ToolCallCard,
         {
           call: tc,
@@ -3213,7 +3675,7 @@ function AssistantMessageImpl({
         tc.id
       )) })
     ] }),
-    durableCards && msg.parts && /* @__PURE__ */ jsx12(
+    durableCards && msg.parts && /* @__PURE__ */ jsx13(
       DurableChatCards,
       {
         ...durableCards,
@@ -3222,13 +3684,21 @@ function AssistantMessageImpl({
         className: "mt-3"
       }
     ),
-    renderExtras?.(msg)
+    renderExtras?.(msg),
+    resolveAttachmentUrl && attachmentPartsFromMessageParts(msg.parts).length > 0 && /* @__PURE__ */ jsx13("div", { className: "mt-2", children: /* @__PURE__ */ jsx13(
+      MessageAttachments,
+      {
+        parts: attachmentPartsFromMessageParts(msg.parts),
+        resolveFileUrl: resolveAttachmentUrl,
+        justify: "start"
+      }
+    ) })
   ] });
 }
 var AssistantMessage = memo(AssistantMessageImpl);
 function useThinkingSeconds(active) {
-  const [seconds, setSeconds] = useState12(0);
-  useEffect8(() => {
+  const [seconds, setSeconds] = useState14(0);
+  useEffect10(() => {
     if (!active) return;
     setSeconds(0);
     const id = setInterval(() => setSeconds((s) => s + 1), 1e3);
@@ -3238,23 +3708,23 @@ function useThinkingSeconds(active) {
 }
 function ThinkingRow({ agentLabel }) {
   const seconds = useThinkingSeconds(true);
-  return /* @__PURE__ */ jsxs10("div", { className: "mx-auto w-full max-w-3xl px-6 py-3", children: [
-    /* @__PURE__ */ jsx12("p", { className: "mb-1 text-[11px] font-semibold uppercase tracking-wide text-muted-foreground", children: agentLabel }),
-    /* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-2 text-base text-muted-foreground", children: [
-      /* @__PURE__ */ jsx12("svg", { className: "h-4 w-4 animate-spin", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", "aria-hidden": true, children: /* @__PURE__ */ jsx12("path", { d: "M21 12a9 9 0 1 1-6.219-8.56", strokeLinecap: "round" }) }),
+  return /* @__PURE__ */ jsxs11("div", { className: "mx-auto w-full max-w-3xl px-6 py-3", children: [
+    /* @__PURE__ */ jsx13("p", { className: "mb-1 text-[11px] font-semibold uppercase tracking-wide text-muted-foreground", children: agentLabel }),
+    /* @__PURE__ */ jsxs11("div", { className: "flex items-center gap-2 text-base text-muted-foreground", children: [
+      /* @__PURE__ */ jsx13("svg", { className: "h-4 w-4 animate-spin", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", "aria-hidden": true, children: /* @__PURE__ */ jsx13("path", { d: "M21 12a9 9 0 1 1-6.219-8.56", strokeLinecap: "round" }) }),
       "Thinking",
       seconds >= 3 ? ` \xB7 ${seconds}s` : "..."
     ] })
   ] });
 }
 function StreamErrorRow({ message, onRetry }) {
-  return /* @__PURE__ */ jsx12("div", { className: "mx-auto w-full max-w-3xl px-6 py-3", children: /* @__PURE__ */ jsxs10("div", { role: "alert", className: "flex items-start gap-2.5 rounded-lg border border-destructive/40 bg-destructive/5 px-3 py-2.5 text-sm text-destructive", children: [
-    /* @__PURE__ */ jsxs10("svg", { className: "mt-0.5 h-4 w-4 shrink-0", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
-      /* @__PURE__ */ jsx12("circle", { cx: "12", cy: "12", r: "9" }),
-      /* @__PURE__ */ jsx12("path", { d: "M12 8v4m0 4h.01" })
+  return /* @__PURE__ */ jsx13("div", { className: "mx-auto w-full max-w-3xl px-6 py-3", children: /* @__PURE__ */ jsxs11("div", { role: "alert", className: "flex items-start gap-2.5 rounded-lg border border-destructive/40 bg-destructive/5 px-3 py-2.5 text-sm text-destructive", children: [
+    /* @__PURE__ */ jsxs11("svg", { className: "mt-0.5 h-4 w-4 shrink-0", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
+      /* @__PURE__ */ jsx13("circle", { cx: "12", cy: "12", r: "9" }),
+      /* @__PURE__ */ jsx13("path", { d: "M12 8v4m0 4h.01" })
     ] }),
-    /* @__PURE__ */ jsx12("span", { className: "min-w-0 flex-1 break-words", children: message }),
-    onRetry && /* @__PURE__ */ jsx12(
+    /* @__PURE__ */ jsx13("span", { className: "min-w-0 flex-1 break-words", children: message }),
+    onRetry && /* @__PURE__ */ jsx13(
       "button",
       {
         type: "button",
@@ -3281,27 +3751,36 @@ function ChatMessages({
   onRetry,
   renderEmpty,
   emptyState,
-  header
+  header,
+  resolveAttachmentUrl
 }) {
-  const renderBody = useMemo7(
-    () => renderMarkdown ?? ((content) => /* @__PURE__ */ jsx12("p", { className: "whitespace-pre-wrap", children: content })),
+  const renderBody = useMemo8(
+    () => renderMarkdown ?? ((content) => /* @__PURE__ */ jsx13("p", { className: "whitespace-pre-wrap", children: content })),
     [renderMarkdown]
   );
   const lastIsUser = messages[messages.length - 1]?.role === "user";
   if (messages.length === 0 && !loading && !error) {
-    const empty = renderEmpty ? renderEmpty() : /* @__PURE__ */ jsx12(ChatEmptyState, { ...emptyState });
-    return /* @__PURE__ */ jsxs10(Fragment5, { children: [
+    const empty = renderEmpty ? renderEmpty() : /* @__PURE__ */ jsx13(ChatEmptyState, { ...emptyState });
+    return /* @__PURE__ */ jsxs11(Fragment5, { children: [
       header,
       empty
     ] });
   }
-  return /* @__PURE__ */ jsxs10(Fragment5, { children: [
+  return /* @__PURE__ */ jsxs11(Fragment5, { children: [
     header,
     messages.map(
-      (msg) => msg.role === "user" ? /* @__PURE__ */ jsx12("div", { className: "mx-auto w-full max-w-3xl px-6 py-3", children: /* @__PURE__ */ jsxs10("div", { className: "ml-auto w-fit max-w-[85%]", children: [
-        /* @__PURE__ */ jsx12("p", { className: "mb-1 text-right text-[11px] font-semibold uppercase tracking-wide text-muted-foreground", children: userLabel }),
-        /* @__PURE__ */ jsx12("div", { className: "rounded-2xl rounded-tr-md bg-primary/10 px-4 py-2.5 text-base leading-relaxed", children: /* @__PURE__ */ jsx12("p", { className: "whitespace-pre-wrap", children: msg.content }) })
-      ] }) }, msg.id) : /* @__PURE__ */ jsx12(
+      (msg) => msg.role === "user" ? /* @__PURE__ */ jsx13("div", { className: "mx-auto w-full max-w-3xl px-6 py-3", children: /* @__PURE__ */ jsxs11("div", { className: "ml-auto w-fit max-w-[85%]", children: [
+        /* @__PURE__ */ jsx13("p", { className: "mb-1 text-right text-[11px] font-semibold uppercase tracking-wide text-muted-foreground", children: userLabel }),
+        /* @__PURE__ */ jsx13("div", { className: "rounded-2xl rounded-tr-md bg-primary/10 px-4 py-2.5 text-base leading-relaxed", children: /* @__PURE__ */ jsx13("p", { className: "whitespace-pre-wrap", children: msg.content }) }),
+        resolveAttachmentUrl && attachmentPartsFromMessageParts(msg.parts).length > 0 && /* @__PURE__ */ jsx13("div", { className: "mt-1.5", children: /* @__PURE__ */ jsx13(
+          MessageAttachments,
+          {
+            parts: attachmentPartsFromMessageParts(msg.parts),
+            resolveFileUrl: resolveAttachmentUrl,
+            justify: "end"
+          }
+        ) })
+      ] }) }, msg.id) : /* @__PURE__ */ jsx13(
         AssistantMessage,
         {
           msg,
@@ -3313,13 +3792,14 @@ function ChatMessages({
           onToolCallClick,
           toolRenderers,
           renderExtras,
-          durableCards
+          durableCards,
+          resolveAttachmentUrl
         },
         msg.id
       )
     ),
-    loading && lastIsUser && /* @__PURE__ */ jsx12(ThinkingRow, { agentLabel }),
-    error && !loading && /* @__PURE__ */ jsx12(StreamErrorRow, { message: error, onRetry })
+    loading && lastIsUser && /* @__PURE__ */ jsx13(ThinkingRow, { agentLabel }),
+    error && !loading && /* @__PURE__ */ jsx13(StreamErrorRow, { message: error, onRetry })
   ] });
 }
 
@@ -3352,6 +3832,10 @@ export {
   InteractionPlanCard,
   durableChatCardsFromParts,
   DurableChatCards,
+  __resetAttachmentFileCacheForTests,
+  loadAttachmentFile,
+  triggerAttachmentDownload,
+  MessageAttachments,
   dispatchChatStreamLine,
   consumeChatStream,
   streamChatTurn,
@@ -3376,6 +3860,7 @@ export {
   DEFAULT_MENTION_EMPTY_TEXT,
   useFileMentions,
   segmentMentionContent,
+  useComposerAttachments,
   activityTone,
   formatActivityCost,
   formatActivityDuration,
@@ -3394,4 +3879,4 @@ export {
   useThinkingSeconds,
   ChatMessages
 };
-//# sourceMappingURL=chunk-O6H2WD3I.js.map
+//# sourceMappingURL=chunk-EIG7ZQW2.js.map