@invergent/agent-chat-react 2.1.4 → 2.1.7

package/dist/index.cjs

@@ -882,7 +882,7 @@ var ConversationEmptyState = ({
       icon && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-center size-14 rounded-2xl bg-muted/60 text-muted-foreground/60", children: icon }),
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-1.5", children: [
         /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "font-semibold text-base text-foreground/80", children: title }),
-        description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground/60 text-sm max-w-sm", children: description })
+        description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-foreground/60 text-sm max-w-sm", children: description })
       ] })
     ] })
   }
@@ -5281,12 +5281,16 @@ var PromptInput = ({
         const formData = new FormData(form);
         return formData.get("message") || "";
       })();
+      const submittedFiles = files;
       if (!usingProvider) {
         form.reset();
+      } else {
+        controller.textInput.clear();
       }
+      clear();
       try {
         const convertedFiles = await Promise.all(
-          files.map(async (entry) => {
+          submittedFiles.map(async (entry) => {
             const isBlob = entry.url?.startsWith("blob:");
             const isImage = entry.mediaType?.startsWith("image/");
             if (isBlob && isImage && entry.url) {
@@ -5299,22 +5303,7 @@ var PromptInput = ({
             return entry;
           })
         );
-        const result = onSubmit({ files: convertedFiles, text }, event);
-        if (result instanceof Promise) {
-          try {
-            await result;
-            clear();
-            if (usingProvider) {
-              controller.textInput.clear();
-            }
-          } catch {
-          }
-        } else {
-          clear();
-          if (usingProvider) {
-            controller.textInput.clear();
-          }
-        }
+        await onSubmit({ files: convertedFiles, text }, event);
       } catch {
       }
     },
@@ -6392,36 +6381,6 @@ function ChatComposerInner({
                       }
                     )
                   ] }),
-                  onViewModeChange && /* @__PURE__ */ jsxRuntime.jsxs(
-                    "div",
-                    {
-                      role: "group",
-                      "aria-label": "Chat view mode",
-                      className: "inline-flex overflow-hidden rounded-md border border-border",
-                      children: [
-                        /* @__PURE__ */ jsxRuntime.jsx(
-                          "button",
-                          {
-                            type: "button",
-                            "aria-pressed": viewMode === "simple",
-                            onClick: () => onViewModeChange("simple"),
-                            className: viewMode === "simple" ? "bg-accent px-2 py-1 text-xs text-foreground" : "px-2 py-1 text-xs text-muted-foreground hover:text-foreground",
-                            children: "Simple"
-                          }
-                        ),
-                        /* @__PURE__ */ jsxRuntime.jsx(
-                          "button",
-                          {
-                            type: "button",
-                            "aria-pressed": viewMode === "expert",
-                            onClick: () => onViewModeChange("expert"),
-                            className: viewMode === "expert" ? "bg-accent px-2 py-1 text-xs text-foreground" : "px-2 py-1 text-xs text-muted-foreground hover:text-foreground",
-                            children: "Expert"
-                          }
-                        )
-                      ]
-                    }
-                  ),
                   canShowBrowser && onToggleBrowser && /* @__PURE__ */ jsxRuntime.jsx(
                     PromptInputButton,
                     {
@@ -6501,7 +6460,46 @@ function ChatComposerInner({
                     }
                   )
                 ] }),
-                /* @__PURE__ */ jsxRuntime.jsx(PromptInputSubmit, { status, onStop })
+                /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
+                  onViewModeChange && /* @__PURE__ */ jsxRuntime.jsxs(
+                    "div",
+                    {
+                      role: "group",
+                      "aria-label": "Chat view mode",
+                      className: "inline-flex overflow-hidden rounded-md border border-border",
+                      children: [
+                        /* @__PURE__ */ jsxRuntime.jsx(
+                          "button",
+                          {
+                            type: "button",
+                            "aria-pressed": viewMode === "simple",
+                            onClick: () => onViewModeChange("simple"),
+                            className: viewMode === "simple" ? "bg-accent px-2 py-1 text-xs text-foreground" : "px-2 py-1 text-xs text-muted-foreground hover:text-foreground",
+                            children: "Simple"
+                          }
+                        ),
+                        /* @__PURE__ */ jsxRuntime.jsx(
+                          "button",
+                          {
+                            type: "button",
+                            "aria-pressed": viewMode === "expert",
+                            onClick: () => onViewModeChange("expert"),
+                            className: viewMode === "expert" ? "bg-accent px-2 py-1 text-xs text-foreground" : "px-2 py-1 text-xs text-muted-foreground hover:text-foreground",
+                            children: "Advanced"
+                          }
+                        )
+                      ]
+                    }
+                  ),
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    PromptInputSubmit,
+                    {
+                      status,
+                      onStop,
+                      className: "md:size-8"
+                    }
+                  )
+                ] })
               ] })
             ]
           }
@@ -6678,7 +6676,7 @@ function TurnFeedback({ msg }) {
         {
           type: "button",
           variant: "ghost",
-          size: "icon-xs",
+          size: "icon-sm",
           "aria-label": "Good response",
           title: alreadyRated && rating === "up" ? "Good response (recorded)" : "Good response",
           disabled: pending !== null || alreadyRated,
@@ -6686,7 +6684,7 @@ function TurnFeedback({ msg }) {
           className: cn(
             rating === "up" ? "text-foreground" : "text-muted-foreground/60"
           ),
-          children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ThumbsUpIcon, { className: "size-3.5" })
+          children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ThumbsUpIcon, { className: "size-4.5" })
         }
       ),
       /* @__PURE__ */ jsxRuntime.jsx(
@@ -6694,7 +6692,7 @@ function TurnFeedback({ msg }) {
         {
           type: "button",
           variant: "ghost",
-          size: "icon-xs",
+          size: "icon-sm",
           "aria-label": "Poor response",
           title: alreadyRated && rating === "down" ? "Poor response (recorded)" : "Poor response",
           disabled: pending !== null || reasonDraft !== null || alreadyRated,
@@ -6702,7 +6700,7 @@ function TurnFeedback({ msg }) {
           className: cn(
             rating === "down" ? "text-foreground" : "text-muted-foreground/60"
           ),
-          children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ThumbsDownIcon, { className: "size-3.5" })
+          children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ThumbsDownIcon, { className: "size-4.5" })
         }
       ),
       alreadyRated && msg.userFeedback?.reason && /* @__PURE__ */ jsxRuntime.jsxs(
@@ -7472,7 +7470,8 @@ function FileViewer({
   error,
   downloadUrl,
   onDelete,
-  onClose
+  onClose,
+  hideHeader = false
 }) {
   const visible = loading || file !== null || error !== null;
   if (!visible) return null;
@@ -7482,7 +7481,7 @@ function FileViewer({
   const isImage = file?.encoding === "base64" && !isPdf;
   const HeaderIcon = isImage ? lucideReact.ImageIcon : lucideReact.FileTextIcon;
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-h-0 flex-1 flex-col border-t border-line", children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex shrink-0 items-center gap-2 border-b border-line px-3 py-2", children: [
+    !hideHeader && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex shrink-0 items-center gap-2 border-b border-line px-3 py-2", children: [
       /* @__PURE__ */ jsxRuntime.jsx(HeaderIcon, { className: "size-3.5 shrink-0 text-muted-foreground" }),
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0 flex-1", children: [
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: "truncate text-xs font-medium", children: fileName2 }),
@@ -7527,7 +7526,12 @@ function FileViewer({
         }
       )
     ] }),
-    /* @__PURE__ */ jsxRuntime.jsxs(ScrollArea, { className: "min-h-0 flex-1", children: [
+    file && isPdf && file.encoding === "base64" ? (
+      // PDF has its own scrollable container — bypass ScrollArea so
+      // it can grow with the parent's flex height (Radix Viewport's
+      // internal table wrapper sizes to content and breaks h-full).
+      /* @__PURE__ */ jsxRuntime.jsx(PdfPreview, { file, fileName: fileName2 })
+    ) : /* @__PURE__ */ jsxRuntime.jsxs(ScrollArea, { className: "min-h-0 flex-1", children: [
       loading && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-1.5 p-3", children: Array.from({ length: 10 }).map((_, index) => /* @__PURE__ */ jsxRuntime.jsx(
         Skeleton,
         {
@@ -7543,7 +7547,6 @@ function FileViewer({
         /* @__PURE__ */ jsxRuntime.jsx("span", { children: error })
       ] }),
       file && isPdf && file.encoding !== "base64" && /* @__PURE__ */ jsxRuntime.jsx(FileViewerError, { message: "PDF preview requires base64 file content." }),
-      file && isPdf && file.encoding === "base64" && /* @__PURE__ */ jsxRuntime.jsx(PdfPreview, { file, fileName: fileName2 }),
       file && isImage && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-center p-4", children: /* @__PURE__ */ jsxRuntime.jsx(
         "img",
         {
@@ -7807,7 +7810,7 @@ function PdfPreview({
       /* @__PURE__ */ jsxRuntime.jsx(lucideReact.AlertCircleIcon, { className: "mt-0.5 size-3.5 shrink-0" }),
       /* @__PURE__ */ jsxRuntime.jsx("span", { children: error })
     ] }),
-    !error && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative h-[70vh] min-h-[420px] flex-1 bg-muted/20", children: /* @__PURE__ */ jsxRuntime.jsx(
+    !error && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative min-h-105 flex-1 bg-muted/20", children: /* @__PURE__ */ jsxRuntime.jsx(
       "div",
       {
         ref: containerRef,
@@ -8008,8 +8011,23 @@ function WorkspaceFilePreviewDialog({
       cancelled = true;
     };
   }, [adapter, sessionId, path, open]);
-  return /* @__PURE__ */ jsxRuntime.jsx(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsxRuntime.jsxs(DialogContent, { className: "flex h-[80vh] w-full max-w-5xl flex-col gap-0 overflow-hidden p-0", children: [
-    /* @__PURE__ */ jsxRuntime.jsx(DialogHeader, { className: "border-b border-line px-4 py-3", children: /* @__PURE__ */ jsxRuntime.jsx(DialogTitle, { className: "truncate text-sm", children: _basename(path) }) }),
+  return /* @__PURE__ */ jsxRuntime.jsx(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsxRuntime.jsxs(DialogContent, { className: "flex h-[85vh] w-[95vw] max-w-350! flex-col gap-0 overflow-hidden p-0", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(DialogHeader, { className: "flex flex-row items-center gap-2 border-b border-line px-4 py-3", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(DialogTitle, { className: "min-w-0 flex-1 truncate text-sm", children: _basename(path) }),
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        "a",
+        {
+          href: downloadUrl,
+          download: _basename(path),
+          className: "mr-8 inline-flex shrink-0 items-center gap-1.5 rounded-md border border-border bg-background px-2.5 py-1 text-xs font-medium text-foreground transition-colors hover:bg-muted",
+          "aria-label": `Download ${_basename(path)}`,
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx(lucideReact.DownloadIcon, { className: "size-3.5", "aria-hidden": true }),
+            "Download"
+          ]
+        }
+      )
+    ] }),
     /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex min-h-0 flex-1 flex-col", children: /* @__PURE__ */ jsxRuntime.jsx(
       FileViewer,
       {
@@ -8018,7 +8036,8 @@ function WorkspaceFilePreviewDialog({
         error,
         downloadUrl,
         onDelete: null,
-        onClose: () => onOpenChange(false)
+        onClose: () => onOpenChange(false),
+        hideHeader: true
       }
     ) })
   ] }) });
@@ -8045,7 +8064,8 @@ function TurnSummaryCard({
   const hasRecap = summary.recap.trim().length > 0;
   const hasArtifacts = summary.artifacts.length > 0;
   if (!hasRecap && !hasArtifacts) return null;
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-3 rounded border border-border bg-muted/20 px-3 py-2 text-sm", children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-3 rounded border border-border bg-muted/50 px-3 py-2 text-sm", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-2 text-xs font-semibold uppercase tracking-wide", children: "Summary" }),
     hasRecap && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-2 whitespace-pre-wrap text-foreground", children: summary.recap }),
     hasArtifacts && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-2", children: summary.artifacts.map((artifact, i) => {
       const key = `${artifact.kind}:${artifact.ref}:${i}`;
@@ -8099,6 +8119,16 @@ function TurnSummaryCard({
     }) })
   ] });
 }
+function TurnSummaryPending() {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-3 rounded border border-border bg-muted/50 px-3 py-2 text-sm", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-2 text-xs font-semibold uppercase tracking-wide", children: "Summary" }),
+    /* @__PURE__ */ jsxRuntime.jsx(Shimmer, { duration: 3, spread: 3, className: "mb-2 text-sm", children: "Summarizing conversation..." }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-1.5", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { className: "h-3 w-3/4" }),
+      /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { className: "h-3 w-2/3" })
+    ] })
+  ] });
+}
 function ArtifactRow({
   artifact,
   sessionId,
@@ -8835,7 +8865,7 @@ function IterationGroup({
         type: "button",
         onClick: () => setOpen((prev) => !prev),
         "aria-expanded": open,
-        className: "flex w-full items-center gap-2 rounded px-1 py-0.5 text-left text-sm hover:bg-muted/40",
+        className: "flex w-full items-center gap-2 rounded py-0.5 text-left text-sm hover:bg-muted/40",
         children: [
           /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn("flex-1 truncate", labelTone), children: label }),
           /* @__PURE__ */ jsxRuntime.jsx(
@@ -8863,6 +8893,18 @@ function IterationGroup({
   ] });
 }
 function deriveFileArtifactsFromMessages(messages) {
+  const terminalCommands = [];
+  for (const msg of messages) {
+    if (msg.role !== "assistant" || !msg.toolCalls) continue;
+    for (const tc of msg.toolCalls) {
+      if (tc.toolName !== "terminal") continue;
+      const status = effectiveStatus(tc);
+      if (status === "error" || status === "cancelled") continue;
+      const args = parseArgs(tc.args);
+      const cmd = typeof args?.command === "string" ? args.command : "";
+      if (cmd) terminalCommands.push(cmd);
+    }
+  }
   const seen = /* @__PURE__ */ new Set();
   const out = [];
   for (const msg of messages) {
@@ -8875,6 +8917,8 @@ function deriveFileArtifactsFromMessages(messages) {
       if (tc.toolName === "write_file" || tc.toolName === "patch") {
         const path = typeof args.path === "string" ? args.path : typeof args.file_path === "string" ? args.file_path : "";
         if (!path || seen.has(`file:${path}`)) continue;
+        const executed = terminalCommands.some((cmd) => cmd.includes(path));
+        if (executed) continue;
         seen.add(`file:${path}`);
         out.push({
           kind: "file",
@@ -8915,11 +8959,13 @@ function SimpleAssistantGroup({
   const isTailGroup = lastGlobalIndex === totalMessages - 1;
   const showThinkingShim = isTailGroup && isRunning && (!tail && messages.some((m) => m.role !== "assistant") || tailIsTextOnly && tail.status === "streaming" && !tail.content);
   const showErrorInfo = !!tail && tail.status === "error" && !!tail.errorInfo;
+  const turnComplete = !isRunning && tail?.status === "complete";
   const effectiveTurnSummary = (() => {
     const fromHarness = tail?.turnSummary;
     if (fromHarness && fromHarness.artifacts.length > 0) {
       return fromHarness;
     }
+    if (!turnComplete) return fromHarness;
     const derived = deriveFileArtifactsFromMessages(messages);
     if (derived.length === 0) return fromHarness;
     return {
@@ -8960,7 +9006,7 @@ function SimpleAssistantGroup({
       /* @__PURE__ */ jsxRuntime.jsx(MessageResponse, { children: finalText }),
       tail?.status === "complete" && /* @__PURE__ */ jsxRuntime.jsx(TurnFeedback, { msg: tail })
     ] }),
-    effectiveTurnSummary && /* @__PURE__ */ jsxRuntime.jsx(
+    effectiveTurnSummary ? /* @__PURE__ */ jsxRuntime.jsx(
       TurnSummaryCard,
       {
         summary: effectiveTurnSummary,
@@ -8968,6 +9014,14 @@ function SimpleAssistantGroup({
         messages,
         onFileSelect
       }
+    ) : (
+      // The harness summarizer runs after the last assistant
+      // response and before ``session.complete``. Show a pending
+      // placeholder during that window so users aren't surprised
+      // when the Summary card pops in. Gated on the tail group +
+      // a complete final answer + still-running session so the
+      // placeholder doesn't show on historic turns or mid-stream.
+      isTailGroup && isRunning && !!finalText && tail?.status === "complete" && /* @__PURE__ */ jsxRuntime.jsx(TurnSummaryPending, {})
     ),
     showErrorInfo && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-3", children: /* @__PURE__ */ jsxRuntime.jsx(ErrorMessage, { errorInfo: tail.errorInfo, onRetry }) })
   ] }) });
@@ -9419,6 +9473,27 @@ function findEntry(entries, path) {
   }
   return null;
 }
+var FILENAME_MAX_CHARS = 42;
+function truncateFilename(name, max) {
+  if (name.length <= max) return name;
+  const dot = name.lastIndexOf(".");
+  if (dot > 0 && name.length - dot <= 12) {
+    const ext = name.slice(dot);
+    const head = name.slice(0, Math.max(1, max - ext.length - 1));
+    return `${head}\u2026${ext}`;
+  }
+  return `${name.slice(0, max - 1)}\u2026`;
+}
+function TruncatedFileName({ name }) {
+  const truncated = truncateFilename(name, FILENAME_MAX_CHARS);
+  const isTruncated = truncated !== name;
+  const node = /* @__PURE__ */ jsxRuntime.jsx("span", { className: "min-w-0 flex-1 truncate", children: truncated });
+  if (!isTruncated) return node;
+  return /* @__PURE__ */ jsxRuntime.jsxs(Tooltip, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: node }),
+    /* @__PURE__ */ jsxRuntime.jsx(TooltipContent, { side: "top", className: "max-w-md break-all", children: name })
+  ] });
+}
 function RenderEntries({
   entries,
   onDelete,
@@ -9438,7 +9513,7 @@ function RenderEntries({
     const fileName2 = entry.name;
     return /* @__PURE__ */ jsxRuntime.jsxs(FileTreeFile, { name: entry.name, path: entry.path, children: [
       /* @__PURE__ */ jsxRuntime.jsx("span", { className: "size-4 shrink-0" }),
-      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "min-w-0 flex-1 truncate", children: entry.name }),
+      /* @__PURE__ */ jsxRuntime.jsx(TruncatedFileName, { name: entry.name }),
       entry.size != null && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-1 shrink-0 text-xs text-muted-foreground/60", children: formatFileSize(entry.size) }),
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ml-1 flex shrink-0 items-center gap-0 opacity-100 transition-opacity md:opacity-0 md:group-hover:opacity-100", children: [
         /* @__PURE__ */ jsxRuntime.jsx(
@@ -9482,7 +9557,6 @@ function WorkspacePanel({
 }) {
   const fileInputRef = react.useRef(null);
   const [entries, setEntries] = react.useState([]);
-  const [rootName, setRootName] = react.useState("workspace");
   const [treeLoading, setTreeLoading] = react.useState(false);
   const [treeError, setTreeError] = react.useState(null);
   const [file, setFile] = react.useState(null);
@@ -9501,7 +9575,6 @@ function WorkspacePanel({
   const fetchTree = react.useCallback(async () => {
     if (!sessionId) {
       setEntries([]);
-      setRootName("workspace");
       setExpandedPaths(/* @__PURE__ */ new Set());
       setTreeLoading(false);
       setTreeError(null);
@@ -9516,12 +9589,10 @@ function WorkspacePanel({
       });
       if (sessionIdRef.current !== requestedSessionId) return;
       setEntries(tree.entries);
-      setRootName(tree.root || "workspace");
       setExpandedPaths(new Set(collectExpandedPaths(tree.entries)));
     } catch (error) {
       if (sessionIdRef.current !== requestedSessionId) return;
       setEntries([]);
-      setRootName("workspace");
       setTreeError(error.message);
     } finally {
       if (sessionIdRef.current === requestedSessionId) {
@@ -9711,10 +9782,7 @@ function WorkspacePanel({
         ),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-h-14 items-center gap-2 border-b border-line px-3 py-3", children: [
           /* @__PURE__ */ jsxRuntime.jsx(lucideReact.FolderOpenIcon, { className: "size-4 shrink-0 text-amber-500" }),
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0 flex-1", children: [
-            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "truncate text-sm font-medium text-foreground", children: rootName }),
-            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "truncate text-xs text-faint", children: disabled ? "Workspace - Read-only" : "Workspace" })
-          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "min-w-0 flex-1", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "truncate text-sm font-medium text-foreground", children: disabled ? "Workspace - Read-only" : "Workspace" }) }),
           /* @__PURE__ */ jsxRuntime.jsxs(Tooltip, { children: [
             /* @__PURE__ */ jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
               Button,
@@ -10834,6 +10902,7 @@ function readTurnMeta(data) {
 
 // src/runtime/use-agent-chat-runtime.ts
 var VIEW_MODE_KEY = "@invergent/agent-chat-react:viewMode";
+var VIEW_MODE_EVENT = "@invergent/agent-chat-react:viewMode:change";
 function readPersistedViewMode() {
   if (typeof window === "undefined") return null;
   try {
@@ -10849,6 +10918,36 @@ function writePersistedViewMode(mode) {
     window.localStorage.setItem(VIEW_MODE_KEY, mode);
   } catch {
   }
+  try {
+    window.dispatchEvent(
+      new CustomEvent(VIEW_MODE_EVENT, { detail: mode })
+    );
+  } catch {
+  }
+}
+function useChatViewMode() {
+  const [mode, setMode] = react.useState(
+    () => readPersistedViewMode() ?? "simple"
+  );
+  react.useEffect(() => {
+    if (typeof window === "undefined") return;
+    const onSameTab = (event) => {
+      const detail = event.detail;
+      if (detail === "simple" || detail === "expert") setMode(detail);
+    };
+    const onCrossTab = (event) => {
+      if (event.key !== VIEW_MODE_KEY) return;
+      const next = event.newValue;
+      if (next === "simple" || next === "expert") setMode(next);
+    };
+    window.addEventListener(VIEW_MODE_EVENT, onSameTab);
+    window.addEventListener("storage", onCrossTab);
+    return () => {
+      window.removeEventListener(VIEW_MODE_EVENT, onSameTab);
+      window.removeEventListener("storage", onCrossTab);
+    };
+  }, []);
+  return mode;
 }
 function useAgentChatRuntime({
   adapter,
@@ -13905,6 +14004,7 @@ exports.isTerminalMissionStatus = isTerminalMissionStatus;
 exports.missionTaskBucket = missionTaskBucket;
 exports.useAgentChatAdapterContext = useAgentChatAdapterContext;
 exports.useAgentChatRuntime = useAgentChatRuntime;
+exports.useChatViewMode = useChatViewMode;
 exports.useInboxUnreadCount = useInboxUnreadCount;
 //# sourceMappingURL=index.cjs.map
 //# sourceMappingURL=index.cjs.map