@tutti-os/agent-gui 0.0.21 → 0.0.23

package/dist/{chunk-4NGM7NFL.js → chunk-MQAGIHYM.js}

@@ -10,7 +10,7 @@ import {
   resolveWorkspaceFileLinkAction,
   resolveWorkspaceFilePathCandidate,
   resolveWorkspaceLinkAction
-} from "./chunk-BMGCH4JC.js";
+} from "./chunk-7Q3JKSQ5.js";
 import {
   attrsToMentionItem,
   createAgentFileMentionExtension,
@@ -4663,7 +4663,7 @@ import {
   useMemo,
   useState as useState5
 } from "react";
-import { AlertTriangle, ChevronRight as ChevronRight3, Info } from "lucide-react";
+import { ChevronRight as ChevronRight3, LoaderCircle } from "lucide-react";
 import { CheckIcon, CopyIcon } from "@tutti-os/ui-system/icons";
 
 // app/renderer/components/ui/button.tsx
@@ -6084,7 +6084,8 @@ import { jsx as jsx8, jsxs as jsxs4 } from "react/jsx-runtime";
 function WorkspaceAgentSessionThinkingDisclosure({
   thinking,
   label,
-  onLinkClick
+  onLinkClick,
+  previewMode = false
 }) {
   "use memo";
   const [expanded, setExpanded] = useState3(false);
@@ -6153,7 +6154,8 @@ function WorkspaceAgentSessionThinkingDisclosure({
         content: thinking.body,
         onLinkClick,
         className: "text-[11px] text-[var(--text-secondary)] opacity-92 [&_p]:mb-1",
-        enableImageZoom: true
+        enableImageZoom: true,
+        previewMode
       }
     ) }) })
   ] });
@@ -6234,6 +6236,7 @@ function AgentThinkingDisclosure({
   thinking,
   label,
   onLinkClick,
+  previewMode = false,
   showRawTimelineJson = false,
   rawTimelineJsonLabel = ""
 }) {
@@ -6244,7 +6247,8 @@ function AgentThinkingDisclosure({
       {
         thinking,
         label,
-        onLinkClick
+        onLinkClick,
+        previewMode
       }
     ),
     showRawTimelineJson && rawTimelineJsonLabel ? /* @__PURE__ */ jsx10(
@@ -6315,6 +6319,7 @@ function AgentMessageBlock({
   onAuthLogin,
   availableSkills,
   workspaceAppIcons,
+  previewMode = false,
   showRawTimelineJson = false,
   rawTimelineJsonLabel = ""
 }) {
@@ -6363,6 +6368,7 @@ function AgentMessageBlock({
       thinking,
       label: thinkingLabel,
       onLinkClick: handleLinkClick,
+      previewMode,
       showRawTimelineJson,
       rawTimelineJsonLabel
     },
@@ -6405,7 +6411,8 @@ function AgentMessageBlock({
               workspaceRoot,
               basePath,
               onLinkAction,
-              workspaceAppIcons
+              workspaceAppIcons,
+              previewMode
             }
           ) : /* @__PURE__ */ jsx12(
             AgentMessageMarkdown,
@@ -6421,6 +6428,7 @@ function AgentMessageBlock({
               workspaceAppIcons,
               deferLongContentRender: true,
               enableImageZoom: true,
+              previewMode,
               streaming: message.statusKind === "working"
             }
           );
@@ -6513,7 +6521,7 @@ function AgentUserImageGrid({
 }) {
   "use memo";
   const images = message.images ?? [];
-  const loadedImages = useAgentMessageImageSources(images);
+  const { loadingIds, sources: loadedImages } = useAgentMessageImageSources(images);
   const columnCount = Math.min(Math.max(images.length, 1), 4);
   return /* @__PURE__ */ jsx12(
     "div",
@@ -6522,6 +6530,7 @@ function AgentUserImageGrid({
       style: { gridTemplateColumns: `repeat(${columnCount}, 80px)` },
       children: images.map((image) => {
         const src = loadedImages.get(image.id) ?? imageDataUrl(image);
+        const loading = !src && loadingIds.has(image.id);
         return /* @__PURE__ */ jsx12(
           "div",
           {
@@ -6534,6 +6543,20 @@ function AgentUserImageGrid({
                 className: "size-full object-cover",
                 draggable: false
               }
+            ) : loading ? /* @__PURE__ */ jsx12(
+              "div",
+              {
+                className: "flex size-full items-center justify-center bg-[color-mix(in_srgb,var(--text-primary)_6%,transparent)]",
+                "data-testid": "agent-gui-message-image-loading",
+                children: /* @__PURE__ */ jsx12(
+                  LoaderCircle,
+                  {
+                    "aria-hidden": "true",
+                    className: "size-5 animate-spin text-[color-mix(in_srgb,var(--text-primary)_45%,transparent)]",
+                    strokeWidth: 2
+                  }
+                )
+              }
             ) : /* @__PURE__ */ jsx12("div", { className: "size-full animate-pulse bg-[color-mix(in_srgb,var(--text-primary)_8%,transparent)]" })
           },
           image.id
@@ -6545,6 +6568,7 @@ function AgentUserImageGrid({
 function useAgentMessageImageSources(images) {
   const runtime = getOptionalAgentActivityRuntime();
   const [sources, setSources] = useState5(() => /* @__PURE__ */ new Map());
+  const [loadingIds, setLoadingIds] = useState5(() => /* @__PURE__ */ new Set());
   const missingImages = useMemo(
     () => images.filter(
       (image) => !imageDataUrl(image) && !sources.has(image.id) && image.workspaceId && image.agentSessionId && (image.attachmentId || image.path)
@@ -6571,6 +6595,14 @@ function useAgentMessageImageSources(images) {
       if (!readImage) {
         continue;
       }
+      setLoadingIds((current) => {
+        if (current.has(image.id)) {
+          return current;
+        }
+        const next = new Set(current);
+        next.add(image.id);
+        return next;
+      });
       void readImage.then((attachment) => {
         if (canceled) {
           return;
@@ -6587,13 +6619,25 @@ function useAgentMessageImageSources(images) {
           return next;
         });
       }).catch(() => {
+      }).finally(() => {
+        if (canceled) {
+          return;
+        }
+        setLoadingIds((current) => {
+          if (!current.has(image.id)) {
+            return current;
+          }
+          const next = new Set(current);
+          next.delete(image.id);
+          return next;
+        });
       });
     }
     return () => {
       canceled = true;
     };
   }, [missingImages, runtime]);
-  return sources;
+  return { loadingIds, sources };
 }
 function imageDataUrl(image) {
   const data = image.data?.trim() ?? "";
@@ -6610,26 +6654,14 @@ function AgentSystemNoticeMessage({
   const notice = message.systemNotice;
   const detail = notice?.detail?.trim() ?? "";
   const isWarning = notice?.severity === "warning" || notice?.severity === "error";
-  const Icon = isWarning ? AlertTriangle : Info;
   return /* @__PURE__ */ jsx12(
     "section",
     {
       role: isWarning ? "status" : void 0,
       className: "box-border w-full min-w-0 rounded-[8px] border border-[color-mix(in_srgb,var(--state-warning)_14%,transparent)] bg-[color-mix(in_srgb,var(--background-fronted)_100%,var(--state-warning)_6%)] p-3 text-[13px] leading-5 text-[var(--text-primary)]",
-      children: /* @__PURE__ */ jsxs7("div", { className: "flex min-w-0 items-start gap-2", children: [
-        /* @__PURE__ */ jsx12(
-          Icon,
-          {
-            size: 15,
-            strokeWidth: 2.1,
-            "aria-hidden": "true",
-            className: "mt-0.5 shrink-0 text-[var(--state-warning)]"
-          }
-        ),
-        /* @__PURE__ */ jsxs7("div", { className: "min-w-0 flex-1", children: [
-          /* @__PURE__ */ jsx12("div", { className: "font-medium text-[var(--text-primary)]", children: systemNoticeTitle(message) }),
-          detail ? /* @__PURE__ */ jsx12(AgentMessageDetailsDisclosure, { detail, className: "mt-1" }) : null
-        ] })
+      children: /* @__PURE__ */ jsxs7("div", { className: "min-w-0", children: [
+        /* @__PURE__ */ jsx12("div", { className: "font-medium text-[var(--text-primary)]", children: systemNoticeTitle(message) }),
+        detail ? /* @__PURE__ */ jsx12(AgentMessageDetailsDisclosure, { detail, className: "mt-1" }) : null
       ] })
     }
   );
@@ -6639,7 +6671,8 @@ function AgentPlanCardMessage({
   workspaceRoot,
   basePath,
   onLinkAction,
-  workspaceAppIcons
+  workspaceAppIcons,
+  previewMode = false
 }) {
   "use memo";
   return /* @__PURE__ */ jsx12(AgentPlanCard, { copyText: message.body, children: /* @__PURE__ */ jsx12(
@@ -6655,7 +6688,8 @@ function AgentPlanCardMessage({
       },
       workspaceAppIcons,
       deferLongContentRender: true,
-      enableImageZoom: true
+      enableImageZoom: true,
+      previewMode
     }
   ) });
 }
@@ -8076,8 +8110,7 @@ function getWebFetchRenderData(call, maxContentLength = 3e3) {
     contentText(call.output?.content),
     stringValue8(call.output?.output),
     stringValue8(call.output?.content),
-    stringValue8(call.output?.stdout),
-    nonEmpty(call.summary)
+    stringValue8(call.output?.stdout)
   );
   return {
     url,
@@ -9368,7 +9401,11 @@ function lineClassName(line) {
 }
 
 // shared/agentConversation/components/tool-renderers/agentToolContentShared.tsx
-import { useState as useState8 } from "react";
+import {
+  createContext,
+  useContext,
+  useState as useState8
+} from "react";
 import { ChevronDown as ChevronDown5, ChevronRight as ChevronRight5 } from "lucide-react";
 
 // shared/agentConversation/components/tool-renderers/AgentReadContent.tsx
@@ -9456,6 +9493,14 @@ function languageForPath3(path) {
 
 // shared/agentConversation/components/tool-renderers/agentToolContentShared.tsx
 import { jsx as jsx26, jsxs as jsxs18 } from "react/jsx-runtime";
+var AgentToolPreviewModeContext = createContext(false);
+function AgentToolPreviewModeProvider({
+  children,
+  previewMode
+}) {
+  "use memo";
+  return /* @__PURE__ */ jsx26(AgentToolPreviewModeContext.Provider, { value: previewMode, children });
+}
 function ToolSection({
   title,
   children
@@ -9472,9 +9517,12 @@ function ToolSection({
 function ToolMarkdownBlock({
   content,
   onLinkClick,
-  collapsible = false
+  collapsible = false,
+  previewMode
 }) {
   "use memo";
+  const contextPreviewMode = useContext(AgentToolPreviewModeContext);
+  const effectivePreviewMode = previewMode ?? contextPreviewMode;
   const normalized = content.trim();
   if (!normalized) {
     return null;
@@ -9486,6 +9534,7 @@ function ToolMarkdownBlock({
       onLinkClick,
       collapsible,
       enableImageZoom: true,
+      previewMode: effectivePreviewMode,
       className: "workspace-agents-status-panel__detail-tool-markdown [&_ol]:text-[var(--text-secondary)] [&_ul]:text-[var(--text-secondary)]"
     }
   );
@@ -9496,9 +9545,13 @@ function AgentDefaultToolContent({
 }) {
   "use memo";
   const fallbackText = getToolFallbackText(call);
-  const inputText = fallbackText.input;
-  const outputText = fallbackText.output;
-  const errorText = fallbackText.error;
+  const inputText = dedupeToolSectionContent(fallbackText.input);
+  const outputText = dedupeToolSectionContent(fallbackText.output, inputText);
+  const errorText = dedupeToolSectionContent(
+    fallbackText.error,
+    inputText,
+    outputText
+  );
   const detail = dedupeToolSummary(
     call.summary.trim(),
     inputText,
@@ -9733,16 +9786,20 @@ function rawPayloadJson(value) {
   }
 }
 function dedupeToolSummary(summary, ...otherValues) {
-  const normalizedSummary = summary.trim();
-  if (!normalizedSummary) {
+  return dedupeToolSectionContent(summary, ...otherValues);
+}
+function dedupeToolSectionContent(content, ...previousValues) {
+  const normalizedContent = content?.trim() ?? "";
+  if (!normalizedContent) {
     return "";
   }
-  const duplicate = otherValues.some(
-    (value) => normalizeWhitespace(value) === normalizeWhitespace(normalizedSummary)
+  const contentKey = normalizeToolSectionContent(normalizedContent);
+  const duplicate = previousValues.some(
+    (value) => normalizeToolSectionContent(value) === contentKey
   );
-  return duplicate ? "" : normalizedSummary;
+  return duplicate ? "" : normalizedContent;
 }
-function normalizeWhitespace(value) {
+function normalizeToolSectionContent(value) {
   return (value ?? "").trim().replace(/\s+/g, " ");
 }
 
@@ -10312,6 +10369,10 @@ function AgentMcpToolContent({
   "use memo";
   const payload = normalizeMcpPayload(call);
   const specialized = renderRegisteredMcp(payload);
+  const visibleText = dedupeToolSectionContent(
+    payload.text,
+    payload.inputSummary
+  );
   return /* @__PURE__ */ jsxs25("div", { className: "workspace-agents-status-panel__detail-tool-body", children: [
     payload.server || payload.tool ? /* @__PURE__ */ jsx35(ToolSection, { title: translate("agentHost.agentTool.details.mcp"), children: /* @__PURE__ */ jsx35(
       ToolMarkdownBlock,
@@ -10330,10 +10391,10 @@ function AgentMcpToolContent({
         onLinkClick
       }
     ) }) : null,
-    specialized ? /* @__PURE__ */ jsx35(ToolSection, { title: translate("agentHost.agentTool.details.output"), children: specialized }) : payload.text ? /* @__PURE__ */ jsx35(ToolSection, { title: translate("agentHost.agentTool.details.output"), children: /* @__PURE__ */ jsx35(
+    specialized ? /* @__PURE__ */ jsx35(ToolSection, { title: translate("agentHost.agentTool.details.output"), children: specialized }) : visibleText ? /* @__PURE__ */ jsx35(ToolSection, { title: translate("agentHost.agentTool.details.output"), children: /* @__PURE__ */ jsx35(
       ToolMarkdownBlock,
       {
-        content: payload.text,
+        content: visibleText,
         onLinkClick,
         collapsible: true
       }
@@ -10387,7 +10448,11 @@ function AgentSearchContent({
 
 ${translate("agentHost.agentTool.details.scope")}: ${search.scope}`.trim() : search.query;
   const resultFiles = withStableOccurrenceKeys(search.files, "file");
-  const outputLines = withStableOccurrenceKeys(search.lines, "line");
+  const visibleOutput = dedupeToolSectionContent(search.output, queryText);
+  const outputLines = withStableOccurrenceKeys(
+    visibleOutput.split("\n").filter(Boolean),
+    "line"
+  );
   return /* @__PURE__ */ jsxs26("div", { className: "workspace-agents-status-panel__detail-tool-body", children: [
     queryText ? /* @__PURE__ */ jsx37(ToolSection, { title: translate("agentHost.agentTool.details.query"), children: /* @__PURE__ */ jsx37(ToolMarkdownBlock, { content: queryText, onLinkClick }) }) : null,
     (search.mode === "files_with_matches" || search.mode === "list_files") && search.files.length > 0 ? /* @__PURE__ */ jsx37(ToolSection, { title: translate("agentHost.agentTool.details.results"), children: /* @__PURE__ */ jsx37("div", { className: "workspace-agents-status-panel__detail-tool-result-list overflow-hidden rounded-[8px] border border-[var(--line-2)] bg-[var(--transparency-block)]", children: resultFiles.map(({ key, value: file, isFirst }) => /* @__PURE__ */ jsx37(
@@ -10398,7 +10463,7 @@ ${translate("agentHost.agentTool.details.scope")}: ${search.scope}`.trim() : sea
       },
       key
     )) }) }) : null,
-    search.mode === "content" && search.output ? /* @__PURE__ */ jsx37(ToolSection, { title: translate("agentHost.agentTool.details.output"), children: /* @__PURE__ */ jsx37("pre", { className: "max-h-[320px] overflow-auto rounded-[8px] border border-[var(--line-2)] bg-[var(--transparency-block)] px-3 py-2 text-[11px] leading-5 text-[var(--text-primary)]", children: outputLines.map(({ key, value: line }) => /* @__PURE__ */ jsx37(
+    search.mode === "content" && visibleOutput ? /* @__PURE__ */ jsx37(ToolSection, { title: translate("agentHost.agentTool.details.output"), children: /* @__PURE__ */ jsx37("pre", { className: "max-h-[320px] overflow-auto rounded-[8px] border border-[var(--line-2)] bg-[var(--transparency-block)] px-3 py-2 text-[11px] leading-5 text-[var(--text-primary)]", children: outputLines.map(({ key, value: line }) => /* @__PURE__ */ jsx37(
       "div",
       {
         className: line.includes(":") ? "text-[var(--text-primary)]" : "text-[var(--text-tertiary)]",
@@ -10407,11 +10472,11 @@ ${translate("agentHost.agentTool.details.scope")}: ${search.scope}`.trim() : sea
       key
     )) }) }) : null,
     search.mode === "count" ? /* @__PURE__ */ jsx37(ToolSection, { title: translate("agentHost.agentTool.details.results"), children: /* @__PURE__ */ jsx37("div", { className: "inline-flex rounded-full border border-[var(--line-2)] bg-[var(--transparency-block)] px-2.5 py-1 text-[11px] text-[var(--text-tertiary)]", children: search.output || "0" }) }) : null,
-    (search.mode === "files_with_matches" || search.mode === "list_files" || search.mode === "count") && search.files.length === 0 && !search.output && !search.error ? /* @__PURE__ */ jsx37(ToolSection, { title: translate("agentHost.agentTool.details.results"), children: /* @__PURE__ */ jsx37("div", { className: "text-[11px] italic text-[var(--text-tertiary)]", children: translate("agentHost.agentTool.details.noMatches") }) }) : null,
-    search.mode === "unknown" && search.output ? /* @__PURE__ */ jsx37(ToolSection, { title: translate("agentHost.agentTool.details.output"), children: /* @__PURE__ */ jsx37(
+    (search.mode === "files_with_matches" || search.mode === "list_files" || search.mode === "count") && search.files.length === 0 && !visibleOutput && !search.error ? /* @__PURE__ */ jsx37(ToolSection, { title: translate("agentHost.agentTool.details.results"), children: /* @__PURE__ */ jsx37("div", { className: "text-[11px] italic text-[var(--text-tertiary)]", children: translate("agentHost.agentTool.details.noMatches") }) }) : null,
+    search.mode === "unknown" && visibleOutput ? /* @__PURE__ */ jsx37(ToolSection, { title: translate("agentHost.agentTool.details.output"), children: /* @__PURE__ */ jsx37(
       ToolMarkdownBlock,
       {
-        content: search.output,
+        content: visibleOutput,
         onLinkClick,
         collapsible: true
       }
@@ -10680,28 +10745,49 @@ function AgentWebFetchContent({
 }) {
   "use memo";
   const web = getWebFetchRenderData(call);
-  if (!web.url && !web.visibleContent) {
+  const urlText = web.url && web.domain && web.domain !== web.url ? `${web.domain}
+
+${web.url}` : web.url;
+  const visibleContent = dedupeToolSectionContent(
+    web.visibleContent,
+    web.url,
+    web.domain,
+    urlText
+  );
+  const fallbackText = getToolFallbackText(call);
+  const errorText = dedupeToolSectionContent(
+    fallbackText.error,
+    urlText,
+    visibleContent
+  );
+  if (!web.url && !visibleContent && !errorText) {
     return null;
   }
   return /* @__PURE__ */ jsxs32("div", { className: "workspace-agents-status-panel__detail-tool-body", children: [
     web.url ? /* @__PURE__ */ jsx43(ToolSection, { title: translate("agentHost.agentTool.details.url"), children: /* @__PURE__ */ jsx43(
       ToolMarkdownBlock,
       {
-        content: web.domain && web.domain !== web.url ? `${web.domain}
-
-${web.url}` : web.url,
+        content: urlText ?? "",
         onLinkClick
       }
     ) }) : null,
-    web.visibleContent ? /* @__PURE__ */ jsx43(ToolSection, { title: translate("agentHost.agentTool.details.content"), children: /* @__PURE__ */ jsx43(
+    visibleContent ? /* @__PURE__ */ jsx43(ToolSection, { title: translate("agentHost.agentTool.details.content"), children: /* @__PURE__ */ jsx43(
       ToolMarkdownBlock,
       {
-        content: web.visibleContent,
+        content: visibleContent,
         onLinkClick,
         collapsible: true
       }
     ) }) : null,
-    web.isTruncated ? /* @__PURE__ */ jsx43("div", { className: "text-[10px] italic text-[var(--text-tertiary)]", children: translate("agentHost.agentTool.details.contentTruncated") }) : null
+    web.isTruncated ? /* @__PURE__ */ jsx43("div", { className: "text-[10px] italic text-[var(--text-tertiary)]", children: translate("agentHost.agentTool.details.contentTruncated") }) : null,
+    errorText ? /* @__PURE__ */ jsx43(ToolSection, { title: translate("agentHost.agentTool.details.error"), children: /* @__PURE__ */ jsx43(
+      ToolMarkdownBlock,
+      {
+        content: errorText,
+        onLinkClick,
+        collapsible: true
+      }
+    ) }) : null
   ] });
 }
 
@@ -10717,24 +10803,21 @@ function AgentWebSearchContent({
   const queries = web.queries;
   const outputText = web.output;
   const links = normalizeLinks(call.output?.links, outputText);
-  const summary = extractSummary(outputText) ?? (call.summary.trim() || null);
-  const visibleSummary = summary ? summary.slice(0, MAX_SUMMARY_LENGTH) : null;
+  const queryText = webSearchQueryText(web.query, queries);
+  const summary = extractSummary(outputText);
+  const visibleSummary = dedupeToolSectionContent(
+    summary ? summary.slice(0, MAX_SUMMARY_LENGTH) : null,
+    queryText,
+    links.map((link) => `${link.domain} ${link.title}`).join("\n")
+  );
   const hasRenderableContent = Boolean(
-    web.query || queries.length > 0 || links.length > 0 || visibleSummary || web.error
+    queryText || links.length > 0 || visibleSummary || web.error
   );
   if (!hasRenderableContent) {
     return null;
   }
   return /* @__PURE__ */ jsxs33("div", { className: "workspace-agents-status-panel__detail-tool-body", children: [
-    web.query ? /* @__PURE__ */ jsx44(ToolSection, { title: translate("agentHost.agentTool.details.query"), children: /* @__PURE__ */ jsx44(ToolMarkdownBlock, { content: web.query, onLinkClick }) }) : null,
-    queries.length > 0 ? /* @__PURE__ */ jsx44(ToolSection, { title: translate("agentHost.agentTool.details.results"), children: /* @__PURE__ */ jsx44("div", { className: "workspace-agents-status-panel__detail-tool-result-list overflow-hidden rounded-[8px] border border-[var(--line-2)] bg-[var(--transparency-block)]", children: queries.map((candidate, index) => /* @__PURE__ */ jsx44(
-      "div",
-      {
-        className: `px-3 py-2 font-[var(--tsh-font-mono)] text-[11px] text-[var(--text-primary)] ${index > 0 ? "border-t border-[var(--line-2)]" : ""}`,
-        children: candidate
-      },
-      `${candidate}:${queries.length}`
-    )) }) }) : null,
+    queryText ? /* @__PURE__ */ jsx44(ToolSection, { title: translate("agentHost.agentTool.details.query"), children: /* @__PURE__ */ jsx44(ToolMarkdownBlock, { content: queryText, onLinkClick }) }) : null,
     links.length > 0 ? /* @__PURE__ */ jsx44(ToolSection, { title: translate("agentHost.agentTool.details.results"), children: /* @__PURE__ */ jsx44("div", { className: "workspace-agents-status-panel__detail-tool-result-list overflow-hidden rounded-[8px] border border-[var(--line-2)] bg-[var(--transparency-block)]", children: links.map((link, index) => /* @__PURE__ */ jsxs33(
       "a",
       {
@@ -10768,6 +10851,13 @@ function AgentWebSearchContent({
     ) }) : null
   ] });
 }
+function webSearchQueryText(query, queries) {
+  const candidates = queries.length > 0 ? queries : query ? [query] : [];
+  const deduped = [
+    ...new Set(candidates.map((value) => value.trim()).filter(Boolean))
+  ];
+  return deduped.length > 0 ? deduped.join("\n") : null;
+}
 function normalizeLinks(value, output) {
   const explicitLinks = arrayValue8(value)?.map(optionRecord).filter(
     (candidate) => candidate !== null
@@ -10905,46 +10995,69 @@ function AgentWriteContent({
 import { jsx as jsx46 } from "react/jsx-runtime";
 function AgentExpandedToolContent({
   call,
-  onLinkClick
+  onLinkClick,
+  previewMode = false
 }) {
   "use memo";
+  const props = { call, onLinkClick, previewMode };
+  let content;
   switch (call.rendererKind) {
     case "approval":
-      return /* @__PURE__ */ jsx46(AgentApprovalContent, { call, onLinkClick });
+      content = /* @__PURE__ */ jsx46(AgentApprovalContent, { ...props });
+      break;
     case "plan-enter":
     case "plan-exit":
-      return /* @__PURE__ */ jsx46(AgentPlanModeContent, { call, onLinkClick });
+      content = /* @__PURE__ */ jsx46(AgentPlanModeContent, { ...props });
+      break;
     case "ask-user":
-      return /* @__PURE__ */ jsx46(AgentAskUserQuestionContent, { call, onLinkClick });
+      content = /* @__PURE__ */ jsx46(AgentAskUserQuestionContent, { ...props });
+      break;
     case "task":
-      return /* @__PURE__ */ jsx46(AgentTaskContent, { call, onLinkClick });
+      content = /* @__PURE__ */ jsx46(AgentTaskContent, { ...props });
+      break;
     case "read":
-      return /* @__PURE__ */ jsx46(AgentReadContent, { call, onLinkClick });
+      content = /* @__PURE__ */ jsx46(AgentReadContent, { ...props });
+      break;
     case "write":
-      return /* @__PURE__ */ jsx46(AgentWriteContent, { call, onLinkClick });
+      content = /* @__PURE__ */ jsx46(AgentWriteContent, { ...props });
+      break;
     case "edit":
-      return /* @__PURE__ */ jsx46(AgentEditContent, { call, onLinkClick });
+      content = /* @__PURE__ */ jsx46(AgentEditContent, { ...props });
+      break;
     case "bash":
-      return /* @__PURE__ */ jsx46(AgentBashContent, { call, onLinkClick });
+      content = /* @__PURE__ */ jsx46(AgentBashContent, { ...props });
+      break;
     case "search":
-      return /* @__PURE__ */ jsx46(AgentSearchContent, { call, onLinkClick });
+      content = /* @__PURE__ */ jsx46(AgentSearchContent, { ...props });
+      break;
     case "web-search":
-      return /* @__PURE__ */ jsx46(AgentWebSearchContent, { call, onLinkClick });
+      content = /* @__PURE__ */ jsx46(AgentWebSearchContent, { ...props });
+      break;
     case "web-fetch":
-      return /* @__PURE__ */ jsx46(AgentWebFetchContent, { call, onLinkClick });
+      content = /* @__PURE__ */ jsx46(AgentWebFetchContent, { ...props });
+      break;
     case "image-generation":
-      return /* @__PURE__ */ jsx46(AgentImageGenerationContent, { call, onLinkClick });
+      content = /* @__PURE__ */ jsx46(AgentImageGenerationContent, { ...props });
+      break;
     case "todo-write":
-      return /* @__PURE__ */ jsx46(AgentTodoWriteContent, { call, onLinkClick });
+      content = /* @__PURE__ */ jsx46(AgentTodoWriteContent, { ...props });
+      break;
     case "tool-search":
-      return /* @__PURE__ */ jsx46(AgentToolSearchContent, { call, onLinkClick });
+      content = /* @__PURE__ */ jsx46(AgentToolSearchContent, { ...props });
+      break;
     case "skill":
-      return /* @__PURE__ */ jsx46(AgentSkillContent, { call, onLinkClick });
+      content = /* @__PURE__ */ jsx46(AgentSkillContent, { ...props });
+      break;
     case "mcp":
-      return /* @__PURE__ */ jsx46(AgentMcpToolContent, { call, onLinkClick });
+      content = /* @__PURE__ */ jsx46(AgentMcpToolContent, { ...props });
+      break;
     default:
-      return /* @__PURE__ */ jsx46(AgentDefaultToolContent, { call, onLinkClick });
+      content = /* @__PURE__ */ jsx46(AgentDefaultToolContent, { ...props });
+  }
+  if (!content) {
+    return null;
   }
+  return /* @__PURE__ */ jsx46(AgentToolPreviewModeProvider, { previewMode, children: content });
 }
 
 // shared/agentConversation/components/AgentAskUserQuestionCard.tsx
@@ -10952,6 +11065,7 @@ import { jsx as jsx47, jsxs as jsxs35 } from "react/jsx-runtime";
 function AgentAskUserQuestionCard({
   call,
   onLinkClick,
+  previewMode = false,
   defaultExpanded,
   nonCollapsible
 }) {
@@ -10972,8 +11086,22 @@ function AgentAskUserQuestionCard({
       }
     ) : /* @__PURE__ */ jsx47("div", { className: "workspace-agents-status-panel__detail-tool-row-head", children: /* @__PURE__ */ jsx47(AgentToolCallHeader, { call, expanded: false, hasDetail: false }) }),
     !hasDetail && call.summary ? /* @__PURE__ */ jsx47("div", { className: "workspace-agents-status-panel__detail-tool-summary", children: call.summary }) : null,
-    hasDetail && pinned ? /* @__PURE__ */ jsx47(AgentExpandedToolContent, { call, onLinkClick }) : null,
-    hasDetail && !pinned ? /* @__PURE__ */ jsx47(CollapsibleReveal, { expanded, children: /* @__PURE__ */ jsx47(AgentExpandedToolContent, { call, onLinkClick }) }) : null
+    hasDetail && pinned ? /* @__PURE__ */ jsx47(
+      AgentExpandedToolContent,
+      {
+        call,
+        onLinkClick,
+        previewMode
+      }
+    ) : null,
+    hasDetail && !pinned ? /* @__PURE__ */ jsx47(CollapsibleReveal, { expanded, children: /* @__PURE__ */ jsx47(
+      AgentExpandedToolContent,
+      {
+        call,
+        onLinkClick,
+        previewMode
+      }
+    ) }) : null
   ] });
 }
 
@@ -10981,14 +11109,22 @@ function AgentAskUserQuestionCard({
 import { jsx as jsx48, jsxs as jsxs36 } from "react/jsx-runtime";
 function AgentEnterPlanModeCard({
   call,
-  onLinkClick
+  onLinkClick,
+  previewMode = false
 }) {
   "use memo";
   const hasDetail = hasAgentToolContent(call);
   return /* @__PURE__ */ jsxs36("div", { className: "workspace-agents-status-panel__detail-tool-row workspace-agents-status-panel__detail-tool-row--plan-enter", children: [
     /* @__PURE__ */ jsx48("div", { className: "workspace-agents-status-panel__detail-tool-row-head", children: /* @__PURE__ */ jsx48(AgentToolCallHeader, { call, expanded: false, hasDetail: false }) }),
     !hasDetail && call.summary ? /* @__PURE__ */ jsx48("div", { className: "workspace-agents-status-panel__detail-tool-summary", children: call.summary }) : null,
-    hasDetail ? /* @__PURE__ */ jsx48(AgentExpandedToolContent, { call, onLinkClick }) : null
+    hasDetail ? /* @__PURE__ */ jsx48(
+      AgentExpandedToolContent,
+      {
+        call,
+        onLinkClick,
+        previewMode
+      }
+    ) : null
   ] });
 }
 
@@ -10996,14 +11132,22 @@ function AgentEnterPlanModeCard({
 import { jsx as jsx49, jsxs as jsxs37 } from "react/jsx-runtime";
 function AgentExitPlanModeCard({
   call,
-  onLinkClick
+  onLinkClick,
+  previewMode = false
 }) {
   "use memo";
   const hasDetail = hasAgentToolContent(call);
   return /* @__PURE__ */ jsxs37("div", { className: "workspace-agents-status-panel__detail-tool-row workspace-agents-status-panel__detail-tool-row--plan-exit", children: [
     /* @__PURE__ */ jsx49("div", { className: "workspace-agents-status-panel__detail-tool-row-head", children: /* @__PURE__ */ jsx49(AgentToolCallHeader, { call, expanded: false, hasDetail: false }) }),
     !hasDetail && call.summary ? /* @__PURE__ */ jsx49("div", { className: "workspace-agents-status-panel__detail-tool-summary", children: call.summary }) : null,
-    hasDetail ? /* @__PURE__ */ jsx49(AgentExpandedToolContent, { call, onLinkClick }) : null
+    hasDetail ? /* @__PURE__ */ jsx49(
+      AgentExpandedToolContent,
+      {
+        call,
+        onLinkClick,
+        previewMode
+      }
+    ) : null
   ] });
 }
 
@@ -11013,6 +11157,7 @@ import { jsx as jsx50, jsxs as jsxs38 } from "react/jsx-runtime";
 function AgentTaskCallCard({
   call,
   onLinkClick,
+  previewMode = false,
   defaultExpanded,
   nonCollapsible
 }) {
@@ -11035,8 +11180,22 @@ function AgentTaskCallCard({
       }
     ) : /* @__PURE__ */ jsx50("div", { className: "workspace-agents-status-panel__detail-tool-row-head", children: /* @__PURE__ */ jsx50(AgentToolCallHeader, { call, expanded: false, hasDetail: false }) }),
     !hasDetail && call.summary ? /* @__PURE__ */ jsx50("div", { className: "workspace-agents-status-panel__detail-tool-summary", children: call.summary }) : null,
-    hasDetail && pinned ? /* @__PURE__ */ jsx50(AgentExpandedToolContent, { call, onLinkClick }) : null,
-    hasDetail && !pinned ? /* @__PURE__ */ jsx50(CollapsibleReveal, { expanded, children: /* @__PURE__ */ jsx50(AgentExpandedToolContent, { call, onLinkClick }) }) : null
+    hasDetail && pinned ? /* @__PURE__ */ jsx50(
+      AgentExpandedToolContent,
+      {
+        call,
+        onLinkClick,
+        previewMode
+      }
+    ) : null,
+    hasDetail && !pinned ? /* @__PURE__ */ jsx50(CollapsibleReveal, { expanded, children: /* @__PURE__ */ jsx50(
+      AgentExpandedToolContent,
+      {
+        call,
+        onLinkClick,
+        previewMode
+      }
+    ) }) : null
   ] });
 }
 function taskCallAriaLabel(call) {
@@ -11053,6 +11212,7 @@ import { jsx as jsx51, jsxs as jsxs39 } from "react/jsx-runtime";
 function AgentToolCallCard({
   call,
   onLinkClick,
+  previewMode = false,
   defaultExpanded = false,
   nonCollapsible = false,
   variantClassName
@@ -11081,8 +11241,22 @@ function AgentToolCallCard({
             children: /* @__PURE__ */ jsx51(AgentToolCallHeader, { call, expanded, hasDetail: true })
           }
         ) : /* @__PURE__ */ jsx51("div", { className: "workspace-agents-status-panel__detail-tool-row-head", children: /* @__PURE__ */ jsx51(AgentToolCallHeader, { call, expanded: false, hasDetail: false }) }),
-        hasDetail && nonCollapsible ? /* @__PURE__ */ jsx51(AgentExpandedToolContent, { call, onLinkClick }) : null,
-        hasDetail && !nonCollapsible ? /* @__PURE__ */ jsx51(CollapsibleReveal, { expanded, children: /* @__PURE__ */ jsx51(AgentExpandedToolContent, { call, onLinkClick }) }) : null
+        hasDetail && nonCollapsible ? /* @__PURE__ */ jsx51(
+          AgentExpandedToolContent,
+          {
+            call,
+            onLinkClick,
+            previewMode
+          }
+        ) : null,
+        hasDetail && !nonCollapsible ? /* @__PURE__ */ jsx51(CollapsibleReveal, { expanded, children: /* @__PURE__ */ jsx51(
+          AgentExpandedToolContent,
+          {
+            call,
+            onLinkClick,
+            previewMode
+          }
+        ) }) : null
       ]
     }
   );
@@ -11102,6 +11276,7 @@ var AgentToolGroupRow = memo(function AgentToolGroupRow2({
   label,
   thinkingLabel,
   onLinkClick,
+  previewMode = false,
   expanded,
   expansionKey,
   onExpandedChange,
@@ -11126,6 +11301,7 @@ var AgentToolGroupRow = memo(function AgentToolGroupRow2({
     return renderToolCard(
       singleCall,
       onLinkClick,
+      previewMode,
       showRawTimelineJson,
       rawTimelineJsonLabel
     );
@@ -11177,6 +11353,7 @@ var AgentToolGroupRow = memo(function AgentToolGroupRow2({
                   thinking: entry.thinking,
                   label: thinkingLabel,
                   onLinkClick,
+                  previewMode,
                   showRawTimelineJson,
                   rawTimelineJsonLabel
                 }
@@ -11190,6 +11367,7 @@ var AgentToolGroupRow = memo(function AgentToolGroupRow2({
               children: renderToolCard(
                 entry.call,
                 onLinkClick,
+                previewMode,
                 showRawTimelineJson,
                 rawTimelineJsonLabel
               )
@@ -11236,8 +11414,8 @@ function renderToolCountLabel(label) {
 function formatInlineStatusLabel3(label) {
   return /^[\sA-Z]+[a-z]+$/.test(label) ? label.toLowerCase() : label;
 }
-function renderToolCard(call, onLinkClick, showRawTimelineJson = false, rawTimelineJsonLabel = "") {
-  const props = { call, onLinkClick };
+function renderToolCard(call, onLinkClick, previewMode = false, showRawTimelineJson = false, rawTimelineJsonLabel = "") {
+  const props = { call, onLinkClick, previewMode };
   let card;
   switch (call.rendererKind) {
     case "plan-enter":
@@ -11597,6 +11775,7 @@ var AgentTranscriptItemView = memo2(function AgentTranscriptItemView2({
   onAuthLogin,
   availableSkills,
   workspaceAppIcons,
+  previewMode = false,
   showRawTimelineJson = false,
   toolGroupExpanded,
   toolGroupExpansionKey,
@@ -11629,6 +11808,7 @@ var AgentTranscriptItemView = memo2(function AgentTranscriptItemView2({
           onAuthLogin,
           availableSkills,
           workspaceAppIcons,
+          previewMode,
           thinkingLabel: labels.thinkingLabel,
           showRawTimelineJson,
           rawTimelineJsonLabel: labels.rawTimelineJson
@@ -11642,6 +11822,7 @@ var AgentTranscriptItemView = memo2(function AgentTranscriptItemView2({
           label: labels.toolCallsLabel,
           thinkingLabel: labels.thinkingLabel,
           onLinkClick: handleLinkClick,
+          previewMode,
           showRawTimelineJson,
           rawTimelineJsonLabel: labels.rawTimelineJson,
           expanded: row.grouped ? toolGroupExpanded : void 0,
@@ -11656,7 +11837,8 @@ var AgentTranscriptItemView = memo2(function AgentTranscriptItemView2({
           row,
           workspaceRoot,
           label: labels.turnSummary,
-          onLinkAction
+          onLinkAction,
+          previewMode
         }
       );
     case "processing":
@@ -11802,7 +11984,7 @@ function areAgentTranscriptViewPropsEqual(previous, next) {
   return transcriptConversationRenderInputEquals(
     previous.conversation,
     next.conversation
-  ) && previous.onLinkAction === next.onLinkAction && previous.onAuthLogin === next.onAuthLogin && previous.availableSkills === next.availableSkills && previous.workspaceAppIcons === next.workspaceAppIcons && previous.showRawTimelineJson === next.showRawTimelineJson && transcriptLabelsEqual(previous.labels, next.labels);
+  ) && previous.onLinkAction === next.onLinkAction && previous.onAuthLogin === next.onAuthLogin && previous.availableSkills === next.availableSkills && previous.workspaceAppIcons === next.workspaceAppIcons && previous.previewMode === next.previewMode && previous.showRawTimelineJson === next.showRawTimelineJson && transcriptLabelsEqual(previous.labels, next.labels);
 }
 var AgentTranscriptView = memo3(function AgentTranscriptView2({
   conversation,
@@ -11810,6 +11992,7 @@ var AgentTranscriptView = memo3(function AgentTranscriptView2({
   onAuthLogin,
   availableSkills,
   workspaceAppIcons,
+  previewMode = false,
   showRawTimelineJson = false,
   labels
 }) {
@@ -11901,6 +12084,7 @@ var AgentTranscriptView = memo3(function AgentTranscriptView2({
               onAuthLogin,
               availableSkills,
               workspaceAppIcons,
+              previewMode,
               showRawTimelineJson,
               toolGroupExpanded: row.kind === "tool-group" ? expandedToolRows[rowKey] === true : void 0,
               toolGroupExpansionKey: row.kind === "tool-group" ? rowKey : void 0,
@@ -12026,6 +12210,7 @@ var AgentConversationFlow = memo4(function AgentConversationFlow2({
   onAuthLogin,
   availableSkills,
   workspaceAppIcons,
+  previewMode = false,
   showRawTimelineJson = false,
   labels
 }) {
@@ -12044,6 +12229,7 @@ var AgentConversationFlow = memo4(function AgentConversationFlow2({
       onAuthLogin,
       availableSkills,
       workspaceAppIcons,
+      previewMode,
       labels,
       showRawTimelineJson
     }
@@ -12080,7 +12266,6 @@ function useProjectedAgentConversation({
 
 export {
   Button,
-  buildCanonicalWorkspaceAgentDetailView,
   buildWorkspaceAgentSessionDetailViewModel,
   projectAgentConversationVM,
   reconcileProjectedAgentConversationVM,
@@ -12097,4 +12282,4 @@ export {
   AgentConversationFlow,
   useProjectedAgentConversation
 };
-//# sourceMappingURL=chunk-4NGM7NFL.js.map
+//# sourceMappingURL=chunk-MQAGIHYM.js.map