@ai-matrx/chat 0.5.0 → 0.5.3

package/dist/tool-call-visualization/renderers/research/ResearchInline.js

@@ -1,4 +1,5 @@
 "use client";
+import { jsx, jsxs } from "react/jsx-runtime";
 import React, { useMemo } from "react";
 import {
   Globe,
@@ -22,18 +23,22 @@ import { Button } from "@ai-matrx/design-system/controls";
 const Favicon = ({ url, className }) => {
   const [failed, setFailed] = React.useState(false);
   const src = url ? getFaviconUrl(url) : "";
-  if (failed || !src) return /* @__PURE__ */ React.createElement(Globe, { className: `text-muted-foreground ${className ?? ""}` });
+  if (failed || !src) return /* @__PURE__ */ jsx(Globe, { className: `text-muted-foreground ${className ?? ""}` });
   return (
     // eslint-disable-next-line @next/next/no-img-element -- favicon service, not owned media
-    /* @__PURE__ */ React.createElement("img", { src, alt: "", className: `rounded-sm ${className ?? ""}`, onError: () => setFailed(true) })
+    /* @__PURE__ */ jsx("img", { src, alt: "", className: `rounded-sm ${className ?? ""}`, onError: () => setFailed(true) })
   );
 };
 const StatChip = ({
   icon,
   value,
   label
-}) => /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-2 rounded-md border border-border bg-card px-2.5 py-1.5" }, /* @__PURE__ */ React.createElement("span", { className: "text-muted-foreground" }, icon), /* @__PURE__ */ React.createElement("span", { className: "text-sm font-semibold tabular-nums text-foreground" }, value), /* @__PURE__ */ React.createElement("span", { className: "text-xs text-muted-foreground" }, label));
-const SourceRow = ({ source, index }) => /* @__PURE__ */ React.createElement(
+}) => /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 rounded-md border border-border bg-card px-2.5 py-1.5", children: [
+  /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: icon }),
+  /* @__PURE__ */ jsx("span", { className: "text-sm font-semibold tabular-nums text-foreground", children: value }),
+  /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground", children: label })
+] });
+const SourceRow = ({ source, index }) => /* @__PURE__ */ jsxs(
   "a",
   {
     href: source.url || void 0,
@@ -41,11 +46,13 @@ const SourceRow = ({ source, index }) => /* @__PURE__ */ React.createElement(
     rel: "noopener noreferrer",
     onClick: (e) => e.stopPropagation(),
     className: "group flex items-center gap-2 rounded-md px-2 py-1.5 transition-colors hover:bg-muted/40 animate-in fade-in slide-in-from-bottom-1",
-    style: { animationDelay: `${Math.min(index, 10) * 30}ms`, animationDuration: "220ms", animationFillMode: "backwards" }
-  },
-  /* @__PURE__ */ React.createElement(Favicon, { url: source.url, className: "h-4 w-4 flex-shrink-0" }),
-  /* @__PURE__ */ React.createElement("span", { className: "min-w-0 flex-1 truncate text-sm text-foreground group-hover:text-primary" }, source.title),
-  /* @__PURE__ */ React.createElement("span", { className: "hidden flex-shrink-0 truncate text-xs text-muted-foreground sm:inline" }, source.domain)
+    style: { animationDelay: `${Math.min(index, 10) * 30}ms`, animationDuration: "220ms", animationFillMode: "backwards" },
+    children: [
+      /* @__PURE__ */ jsx(Favicon, { url: source.url, className: "h-4 w-4 flex-shrink-0" }),
+      /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate text-sm text-foreground group-hover:text-primary", children: source.title }),
+      /* @__PURE__ */ jsx("span", { className: "hidden flex-shrink-0 truncate text-xs text-muted-foreground sm:inline", children: source.domain })
+    ]
+  }
 );
 function useReportReveal(report, active, replayKey) {
   const blocks = useMemo(
@@ -91,46 +98,82 @@ const ResearchInline = ({
     entry.callId
   );
   if (complete && !ok) {
-    return /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-2 py-2 text-sm text-destructive" }, /* @__PURE__ */ React.createElement(Search, { className: "h-4 w-4 flex-shrink-0" }), /* @__PURE__ */ React.createElement("span", null, "Research failed", queries[0] ? ` for "${queries[0]}"` : "", "."));
+    return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 py-2 text-sm text-destructive", children: [
+      /* @__PURE__ */ jsx(Search, { className: "h-4 w-4 flex-shrink-0" }),
+      /* @__PURE__ */ jsxs("span", { children: [
+        "Research failed",
+        queries[0] ? ` for "${queries[0]}"` : "",
+        "."
+      ] })
+    ] });
   }
   if (live) {
-    return /* @__PURE__ */ React.createElement("div", { className: "space-y-3" }, /* @__PURE__ */ React.createElement(
-      SearchInline,
-      {
-        entry,
-        events,
-        onOpenOverlay,
-        toolGroupId,
-        requestId
-      }
-    ), report.trim().length > 0 && /* @__PURE__ */ React.createElement(
-      SubagentReportBlock,
-      {
-        report: revealedReport,
-        streaming: reportStreaming,
-        queries
-      }
-    ));
+    return /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+      /* @__PURE__ */ jsx(
+        SearchInline,
+        {
+          entry,
+          events,
+          onOpenOverlay,
+          toolGroupId,
+          requestId
+        }
+      ),
+      report.trim().length > 0 && /* @__PURE__ */ jsx(
+        SubagentReportBlock,
+        {
+          report: revealedReport,
+          streaming: reportStreaming,
+          queries
+        }
+      )
+    ] });
   }
   const topSources = parsed.sources.slice(0, 6);
-  return /* @__PURE__ */ React.createElement("div", { className: "space-y-3" }, report.trim().length > 0 && /* @__PURE__ */ React.createElement(SubagentReportBlock, { report, streaming: false, queries }), /* @__PURE__ */ React.createElement("div", { className: "flex flex-wrap items-center gap-2" }, /* @__PURE__ */ React.createElement(
-    StatChip,
-    {
-      icon: /* @__PURE__ */ React.createElement(Search, { className: "h-3.5 w-3.5" }),
-      value: queries.length,
-      label: queries.length === 1 ? "query" : "queries"
-    }
-  ), /* @__PURE__ */ React.createElement(StatChip, { icon: /* @__PURE__ */ React.createElement(Globe, { className: "h-3.5 w-3.5" }), value: parsed.sources.length, label: "sources" }), parsed.reads.length > 0 && /* @__PURE__ */ React.createElement(
-    StatChip,
-    {
-      icon: /* @__PURE__ */ React.createElement(BookOpenCheck, { className: "h-3.5 w-3.5" }),
-      value: parsed.reads.length,
-      label: parsed.reads.length === 1 ? "read" : "reads"
-    }
-  ), /* @__PURE__ */ React.createElement(StatChip, { icon: /* @__PURE__ */ React.createElement(Layers, { className: "h-3.5 w-3.5" }), value: parsed.domains.length, label: "domains" })), parsed.domains.length > 0 && /* @__PURE__ */ React.createElement("div", { className: "flex flex-wrap gap-1.5" }, parsed.domains.slice(0, 8).map((d) => /* @__PURE__ */ React.createElement(Badge, { key: d.domain, variant: "secondary", className: "gap-1.5 font-normal" }, /* @__PURE__ */ React.createElement(Favicon, { url: `https://${d.domain}`, className: "h-3 w-3" }), /* @__PURE__ */ React.createElement("span", { className: "max-w-[140px] truncate" }, d.domain), /* @__PURE__ */ React.createElement("span", { className: "tabular-nums text-muted-foreground" }, d.count))), parsed.domains.length > 8 && /* @__PURE__ */ React.createElement(Badge, { variant: "outline", className: "font-normal text-muted-foreground" }, "+", parsed.domains.length - 8, " more")), topSources.length > 0 && /* @__PURE__ */ React.createElement("div", { className: "divide-y divide-border/50 rounded-md border border-border p-1" }, topSources.map((s, i) => /* @__PURE__ */ React.createElement(SourceRow, { key: `${s.url}-${i}`, index: i, source: s }))), onOpenOverlay && (parsed.sources.length > 0 || parsed.reads.length > 0) && /* @__PURE__ */ React.createElement(Button, { variant: "outline", iconEnd: /* @__PURE__ */ React.createElement(ArrowRight, null), onClick: (e) => {
-    e.stopPropagation();
-    onOpenOverlay(`tool-group-${toolGroupId}`);
-  }, className: "w-full" }, "View full research", parsed.sources.length > 0 ? ` \xB7 ${parsed.sources.length} sources` : "", parsed.reads.length > 0 ? ` \xB7 ${parsed.reads.length} read` : ""));
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+    report.trim().length > 0 && /* @__PURE__ */ jsx(SubagentReportBlock, { report, streaming: false, queries }),
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [
+      /* @__PURE__ */ jsx(
+        StatChip,
+        {
+          icon: /* @__PURE__ */ jsx(Search, { className: "h-3.5 w-3.5" }),
+          value: queries.length,
+          label: queries.length === 1 ? "query" : "queries"
+        }
+      ),
+      /* @__PURE__ */ jsx(StatChip, { icon: /* @__PURE__ */ jsx(Globe, { className: "h-3.5 w-3.5" }), value: parsed.sources.length, label: "sources" }),
+      parsed.reads.length > 0 && /* @__PURE__ */ jsx(
+        StatChip,
+        {
+          icon: /* @__PURE__ */ jsx(BookOpenCheck, { className: "h-3.5 w-3.5" }),
+          value: parsed.reads.length,
+          label: parsed.reads.length === 1 ? "read" : "reads"
+        }
+      ),
+      /* @__PURE__ */ jsx(StatChip, { icon: /* @__PURE__ */ jsx(Layers, { className: "h-3.5 w-3.5" }), value: parsed.domains.length, label: "domains" })
+    ] }),
+    parsed.domains.length > 0 && /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap gap-1.5", children: [
+      parsed.domains.slice(0, 8).map((d) => /* @__PURE__ */ jsxs(Badge, { variant: "secondary", className: "gap-1.5 font-normal", children: [
+        /* @__PURE__ */ jsx(Favicon, { url: `https://${d.domain}`, className: "h-3 w-3" }),
+        /* @__PURE__ */ jsx("span", { className: "max-w-[140px] truncate", children: d.domain }),
+        /* @__PURE__ */ jsx("span", { className: "tabular-nums text-muted-foreground", children: d.count })
+      ] }, d.domain)),
+      parsed.domains.length > 8 && /* @__PURE__ */ jsxs(Badge, { variant: "outline", className: "font-normal text-muted-foreground", children: [
+        "+",
+        parsed.domains.length - 8,
+        " more"
+      ] })
+    ] }),
+    topSources.length > 0 && /* @__PURE__ */ jsx("div", { className: "divide-y divide-border/50 rounded-md border border-border p-1", children: topSources.map((s, i) => /* @__PURE__ */ jsx(SourceRow, { index: i, source: s }, `${s.url}-${i}`)) }),
+    onOpenOverlay && (parsed.sources.length > 0 || parsed.reads.length > 0) && /* @__PURE__ */ jsxs(Button, { variant: "outline", iconEnd: /* @__PURE__ */ jsx(ArrowRight, {}), onClick: (e) => {
+      e.stopPropagation();
+      onOpenOverlay(`tool-group-${toolGroupId}`);
+    }, className: "w-full", children: [
+      "View full research",
+      parsed.sources.length > 0 ? ` \xB7 ${parsed.sources.length} sources` : "",
+      parsed.reads.length > 0 ? ` \xB7 ${parsed.reads.length} read` : ""
+    ] })
+  ] });
 };
 export {
   ResearchInline

package/dist/tool-call-visualization/renderers/research/ResearchOverlay.js

@@ -1,6 +1,7 @@
 "use client";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { formatCount } from "@ai-matrx/kit/format";
-import React, { useMemo, useState } from "react";
+import { useMemo, useState } from "react";
 import {
   BookOpen,
   Check,
@@ -25,34 +26,43 @@ import { RichDocument } from "@ai-matrx/rich-content/rich-document/RichDocument"
 const Favicon = ({ url, className }) => {
   const [failed, setFailed] = useState(false);
   const src = url ? getFaviconUrl(url) : "";
-  if (failed || !src) return /* @__PURE__ */ React.createElement(Globe, { className: cn("text-muted-foreground", className) });
+  if (failed || !src) return /* @__PURE__ */ jsx(Globe, { className: cn("text-muted-foreground", className) });
   return (
     // eslint-disable-next-line @next/next/no-img-element -- favicon service, not owned media
-    /* @__PURE__ */ React.createElement("img", { src, alt: "", className: cn("rounded-sm", className), onError: () => setFailed(true) })
+    /* @__PURE__ */ jsx("img", { src, alt: "", className: cn("rounded-sm", className), onError: () => setFailed(true) })
   );
 };
-const EmptyState = ({ icon, message }) => /* @__PURE__ */ React.createElement("div", { className: "flex h-64 items-center justify-center text-muted-foreground" }, /* @__PURE__ */ React.createElement("div", { className: "text-center" }, /* @__PURE__ */ React.createElement("div", { className: "mx-auto mb-3 opacity-40" }, icon), /* @__PURE__ */ React.createElement("p", { className: "text-sm" }, message)));
+const EmptyState = ({ icon, message }) => /* @__PURE__ */ jsx("div", { className: "flex h-64 items-center justify-center text-muted-foreground", children: /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
+  /* @__PURE__ */ jsx("div", { className: "mx-auto mb-3 opacity-40", children: icon }),
+  /* @__PURE__ */ jsx("p", { className: "text-sm", children: message })
+] }) });
 function useParsed(entry) {
   return useMemo(() => parseSearch(resultAsString(entry)), [entry]);
 }
 const ResearchReportTab = ({ entry }) => {
   const parsed = useParsed(entry);
   if (!parsed.report) {
-    return /* @__PURE__ */ React.createElement(EmptyState, { icon: /* @__PURE__ */ React.createElement(FileText, { className: "h-12 w-12" }), message: "No curated report available" });
+    return /* @__PURE__ */ jsx(EmptyState, { icon: /* @__PURE__ */ jsx(FileText, { className: "h-12 w-12" }), message: "No curated report available" });
   }
-  return /* @__PURE__ */ React.createElement("div", { className: "space-y-4" }, /* @__PURE__ */ React.createElement("div", { className: "overflow-hidden rounded-lg border border-border bg-card" }, parsed.queries.length > 0 && /* @__PURE__ */ React.createElement("div", { className: "border-b border-border bg-muted/40 px-5 py-3" }, /* @__PURE__ */ React.createElement("p", { className: "mb-1 text-xs font-medium uppercase tracking-wide text-muted-foreground" }, "Queries"), /* @__PURE__ */ React.createElement("p", { className: "text-sm text-foreground" }, parsed.queries.join(" \xB7 "))), /* @__PURE__ */ React.createElement("div", { className: "p-5" }, /* @__PURE__ */ React.createElement(
-    RichDocument,
-    {
-      imagePolicy: "ai",
-      content: parsed.report,
-      source: { type: "raw" },
-      actionsVariant: "mini-bar",
-      actionsClassName: "mt-2",
-      actions: { exclude: ["announcements", "preferences"] },
-      hideCopyButton: true,
-      contentClassName: "text-sm"
-    }
-  ))));
+  return /* @__PURE__ */ jsx("div", { className: "space-y-4", children: /* @__PURE__ */ jsxs("div", { className: "overflow-hidden rounded-lg border border-border bg-card", children: [
+    parsed.queries.length > 0 && /* @__PURE__ */ jsxs("div", { className: "border-b border-border bg-muted/40 px-5 py-3", children: [
+      /* @__PURE__ */ jsx("p", { className: "mb-1 text-xs font-medium uppercase tracking-wide text-muted-foreground", children: "Queries" }),
+      /* @__PURE__ */ jsx("p", { className: "text-sm text-foreground", children: parsed.queries.join(" \xB7 ") })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "p-5", children: /* @__PURE__ */ jsx(
+      RichDocument,
+      {
+        imagePolicy: "ai",
+        content: parsed.report,
+        source: { type: "raw" },
+        actionsVariant: "mini-bar",
+        actionsClassName: "mt-2",
+        actions: { exclude: ["announcements", "preferences"] },
+        hideCopyButton: true,
+        contentClassName: "text-sm"
+      }
+    ) })
+  ] }) });
 };
 const ReadCard = ({
   read,
@@ -62,44 +72,66 @@ const ReadCard = ({
 }) => {
   const [expanded, setExpanded] = useState(false);
   const isLong = read.text.length > 500;
-  return /* @__PURE__ */ React.createElement("div", { className: "overflow-hidden rounded-lg border border-border bg-card" }, /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-2.5 border-b border-border bg-muted/40 px-4 py-2.5" }, /* @__PURE__ */ React.createElement(Favicon, { url: read.url, className: "h-4 w-4 flex-shrink-0" }), /* @__PURE__ */ React.createElement(
-    "a",
-    {
-      href: read.url || void 0,
-      target: "_blank",
-      rel: "noopener noreferrer",
-      className: "truncate text-xs font-medium text-primary hover:underline",
-      title: read.url
-    },
-    getDomain(read.url)
-  ), /* @__PURE__ */ React.createElement(Button, { variant: "quiet", icon: copied === index ? /* @__PURE__ */ React.createElement(Check, null) : /* @__PURE__ */ React.createElement(Copy, null), glyphTone: copied === index ? "success" : void 0, onClick: () => onCopy(read, index), title: "Copy this source", "aria-label": "Copy this source", className: "ml-auto" })), /* @__PURE__ */ React.createElement("div", { className: "space-y-3 p-5" }, /* @__PURE__ */ React.createElement(
-    "a",
-    {
-      href: read.url || void 0,
-      target: "_blank",
-      rel: "noopener noreferrer",
-      className: "block text-base font-semibold text-foreground hover:text-primary"
-    },
-    read.title || getDomain(read.url)
-  ), read.text && /* @__PURE__ */ React.createElement("div", { className: "text-sm" }, /* @__PURE__ */ React.createElement(
-    BasicMarkdownContent,
-    {
-      imagePolicy: "other",
-      content: expanded || !isLong ? read.text : `${read.text.slice(0, 500)}\u2026`
-    }
-  ), isLong && /* @__PURE__ */ React.createElement(Button, { variant: "quiet", tone: "primary", onClick: () => setExpanded((p) => !p), className: "mt-2" }, expanded ? "Show less" : `Show full content (${formatCount(read.text.length, { style: "compact" })} chars)`))));
+  return /* @__PURE__ */ jsxs("div", { className: "overflow-hidden rounded-lg border border-border bg-card", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2.5 border-b border-border bg-muted/40 px-4 py-2.5", children: [
+      /* @__PURE__ */ jsx(Favicon, { url: read.url, className: "h-4 w-4 flex-shrink-0" }),
+      /* @__PURE__ */ jsx(
+        "a",
+        {
+          href: read.url || void 0,
+          target: "_blank",
+          rel: "noopener noreferrer",
+          className: "truncate text-xs font-medium text-primary hover:underline",
+          title: read.url,
+          children: getDomain(read.url)
+        }
+      ),
+      /* @__PURE__ */ jsx(Button, { variant: "quiet", icon: copied === index ? /* @__PURE__ */ jsx(Check, {}) : /* @__PURE__ */ jsx(Copy, {}), glyphTone: copied === index ? "success" : void 0, onClick: () => onCopy(read, index), title: "Copy this source", "aria-label": "Copy this source", className: "ml-auto" })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "space-y-3 p-5", children: [
+      /* @__PURE__ */ jsx(
+        "a",
+        {
+          href: read.url || void 0,
+          target: "_blank",
+          rel: "noopener noreferrer",
+          className: "block text-base font-semibold text-foreground hover:text-primary",
+          children: read.title || getDomain(read.url)
+        }
+      ),
+      read.text && /* @__PURE__ */ jsxs("div", { className: "text-sm", children: [
+        /* @__PURE__ */ jsx(
+          BasicMarkdownContent,
+          {
+            imagePolicy: "other",
+            content: expanded || !isLong ? read.text : `${read.text.slice(0, 500)}\u2026`
+          }
+        ),
+        isLong && /* @__PURE__ */ jsx(Button, { variant: "quiet", tone: "primary", onClick: () => setExpanded((p) => !p), className: "mt-2", children: expanded ? "Show less" : `Show full content (${formatCount(read.text.length, { style: "compact" })} chars)` })
+      ] })
+    ] })
+  ] });
 };
-const RankedSource = ({ source, rank }) => /* @__PURE__ */ React.createElement(
+const RankedSource = ({ source, rank }) => /* @__PURE__ */ jsxs(
   "a",
   {
     href: source.url || void 0,
     target: "_blank",
     rel: "noopener noreferrer",
-    className: "group flex items-start gap-3 px-3 py-2 transition-colors hover:bg-muted/40"
-  },
-  /* @__PURE__ */ React.createElement("span", { className: "mt-0.5 w-6 flex-shrink-0 text-right text-xs tabular-nums text-muted-foreground" }, rank),
-  /* @__PURE__ */ React.createElement(Favicon, { url: source.url, className: "mt-0.5 h-4 w-4 flex-shrink-0" }),
-  /* @__PURE__ */ React.createElement("div", { className: "min-w-0 flex-1" }, /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React.createElement("span", { className: "min-w-0 flex-1 truncate text-sm font-medium text-foreground group-hover:text-primary" }, source.title), /* @__PURE__ */ React.createElement(ExternalLink, { className: "h-3 w-3 flex-shrink-0 text-muted-foreground opacity-0 transition-opacity group-hover:opacity-100" })), /* @__PURE__ */ React.createElement("div", { className: "truncate text-xs text-primary/80" }, source.domain), source.snippet && /* @__PURE__ */ React.createElement("p", { className: "mt-1 line-clamp-2 text-xs leading-relaxed text-muted-foreground" }, source.snippet))
+    className: "group flex items-start gap-3 px-3 py-2 transition-colors hover:bg-muted/40",
+    children: [
+      /* @__PURE__ */ jsx("span", { className: "mt-0.5 w-6 flex-shrink-0 text-right text-xs tabular-nums text-muted-foreground", children: rank }),
+      /* @__PURE__ */ jsx(Favicon, { url: source.url, className: "mt-0.5 h-4 w-4 flex-shrink-0" }),
+      /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate text-sm font-medium text-foreground group-hover:text-primary", children: source.title }),
+          /* @__PURE__ */ jsx(ExternalLink, { className: "h-3 w-3 flex-shrink-0 text-muted-foreground opacity-0 transition-opacity group-hover:opacity-100" })
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: "truncate text-xs text-primary/80", children: source.domain }),
+        source.snippet && /* @__PURE__ */ jsx("p", { className: "mt-1 line-clamp-2 text-xs leading-relaxed text-muted-foreground", children: source.snippet })
+      ] })
+    ]
+  }
 );
 const ResearchSourcesTab = ({ entry }) => {
   const parsed = useParsed(entry);
@@ -114,9 +146,22 @@ ${read.text}`, "default", { toast: false })) {
     }
   };
   if (parsed.reads.length === 0 && parsed.sources.length === 0) {
-    return /* @__PURE__ */ React.createElement(EmptyState, { icon: /* @__PURE__ */ React.createElement(Link2, { className: "h-12 w-12" }), message: "No sources available" });
+    return /* @__PURE__ */ jsx(EmptyState, { icon: /* @__PURE__ */ jsx(Link2, { className: "h-12 w-12" }), message: "No sources available" });
   }
-  return /* @__PURE__ */ React.createElement("div", { className: "space-y-4" }, parsed.reads.length > 0 && /* @__PURE__ */ React.createElement("div", { className: "space-y-3" }, parsed.reads.map((r, i) => /* @__PURE__ */ React.createElement(ReadCard, { key: `${r.url}-${i}`, read: r, index: i, copied, onCopy: handleCopy }))), parsed.sources.length > 0 && /* @__PURE__ */ React.createElement("div", { className: "overflow-hidden rounded-md border border-border" }, /* @__PURE__ */ React.createElement("div", { className: "flex items-center justify-between border-b border-border bg-muted/40 px-3 py-2" }, /* @__PURE__ */ React.createElement("span", { className: "text-sm font-medium text-foreground" }, "All sources"), /* @__PURE__ */ React.createElement("span", { className: "text-xs tabular-nums text-muted-foreground" }, parsed.sources.length, " ", parsed.sources.length === 1 ? "source" : "sources")), /* @__PURE__ */ React.createElement("div", { className: "divide-y divide-border/60" }, parsed.sources.map((s, i) => /* @__PURE__ */ React.createElement(RankedSource, { key: `${s.url}-${i}`, rank: i + 1, source: s })))));
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
+    parsed.reads.length > 0 && /* @__PURE__ */ jsx("div", { className: "space-y-3", children: parsed.reads.map((r, i) => /* @__PURE__ */ jsx(ReadCard, { read: r, index: i, copied, onCopy: handleCopy }, `${r.url}-${i}`)) }),
+    parsed.sources.length > 0 && /* @__PURE__ */ jsxs("div", { className: "overflow-hidden rounded-md border border-border", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between border-b border-border bg-muted/40 px-3 py-2", children: [
+        /* @__PURE__ */ jsx("span", { className: "text-sm font-medium text-foreground", children: "All sources" }),
+        /* @__PURE__ */ jsxs("span", { className: "text-xs tabular-nums text-muted-foreground", children: [
+          parsed.sources.length,
+          " ",
+          parsed.sources.length === 1 ? "source" : "sources"
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: "divide-y divide-border/60", children: parsed.sources.map((s, i) => /* @__PURE__ */ jsx(RankedSource, { rank: i + 1, source: s }, `${s.url}-${i}`)) })
+    ] })
+  ] });
 };
 function buildFullText(parsed) {
   let text = "";
@@ -183,9 +228,12 @@ const ResearchFullTextTab = ({ entry }) => {
     }
   };
   if (!fullText.trim()) {
-    return /* @__PURE__ */ React.createElement(EmptyState, { icon: /* @__PURE__ */ React.createElement(BookOpen, { className: "h-12 w-12" }), message: "No research data available" });
+    return /* @__PURE__ */ jsx(EmptyState, { icon: /* @__PURE__ */ jsx(BookOpen, { className: "h-12 w-12" }), message: "No research data available" });
   }
-  return /* @__PURE__ */ React.createElement("div", { className: "relative overflow-hidden rounded-lg border border-border bg-card" }, /* @__PURE__ */ React.createElement(Button, { variant: "outline", icon: copied ? /* @__PURE__ */ React.createElement(Check, null) : /* @__PURE__ */ React.createElement(Copy, null), glyphTone: copied ? "success" : void 0, onClick: handleCopyAll, "aria-label": copied ? "Copied" : "Copy all", title: copied ? "Copied" : "Copy all", className: "absolute right-2 top-2 z-10" }), /* @__PURE__ */ React.createElement("div", { className: "p-5" }, /* @__PURE__ */ React.createElement(RichContent, { level: "full", imagePolicy: "ai", source: fullText, hideCopyButton: true, className: "text-sm" })));
+  return /* @__PURE__ */ jsxs("div", { className: "relative overflow-hidden rounded-lg border border-border bg-card", children: [
+    /* @__PURE__ */ jsx(Button, { variant: "outline", icon: copied ? /* @__PURE__ */ jsx(Check, {}) : /* @__PURE__ */ jsx(Copy, {}), glyphTone: copied ? "success" : void 0, onClick: handleCopyAll, "aria-label": copied ? "Copied" : "Copy all", title: copied ? "Copied" : "Copy all", className: "absolute right-2 top-2 z-10" }),
+    /* @__PURE__ */ jsx("div", { className: "p-5", children: /* @__PURE__ */ jsx(RichContent, { level: "full", imagePolicy: "ai", source: fullText, hideCopyButton: true, className: "text-sm" }) })
+  ] });
 };
 const researchOverlayTabs = [
   { id: "report", label: "Report", Component: ResearchReportTab },

package/dist/tool-call-visualization/renderers/research/SubagentReportBlock.js

@@ -1,6 +1,7 @@
 "use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { Badge } from "@ai-matrx/design-system/controls";
-import React, { useState } from "react";
+import { useState } from "react";
 import {
   FileText,
   ChevronDown,
@@ -23,74 +24,103 @@ const SubagentReportBlock = ({
   const effectiveView = streaming ? "partial" : view;
   const scrollRef = useAutoScrollOnStream(report, streaming);
   const hasReport = report.trim().length > 0;
-  return /* @__PURE__ */ React.createElement("div", { className: "mx-auto w-[94%] overflow-hidden rounded-xl border border-primary/20 bg-card shadow-sm" }, /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-2 border-b border-border bg-primary/5 px-3 py-2" }, /* @__PURE__ */ React.createElement(
-    "button",
-    {
-      type: "button",
-      onClick: () => setView((v) => v === "none" ? "partial" : "none"),
-      className: "flex min-w-0 flex-1 items-center gap-2 text-left",
-      "aria-expanded": effectiveView !== "none"
-    },
-    effectiveView === "none" ? /* @__PURE__ */ React.createElement(ChevronRight, { className: "h-4 w-4 flex-shrink-0 text-muted-foreground" }) : /* @__PURE__ */ React.createElement(ChevronDown, { className: "h-4 w-4 flex-shrink-0 text-muted-foreground" }),
-    /* @__PURE__ */ React.createElement(AGENT_ICON, { className: "h-4 w-4 flex-shrink-0 text-primary" }),
-    /* @__PURE__ */ React.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React.createElement("span", { className: "text-sm font-semibold text-foreground" }, "Research report"), /* @__PURE__ */ React.createElement(Badge, { tone: "primary" }, "Sub-agent")), queries && queries.length > 0 && /* @__PURE__ */ React.createElement("div", { className: "truncate text-xs text-muted-foreground" }, queries.join(" \xB7 ")))
-  ), streaming ? /* @__PURE__ */ React.createElement("span", { className: "flex flex-shrink-0 items-center gap-1.5 text-xs font-medium text-primary" }, /* @__PURE__ */ React.createElement("span", { className: "h-1.5 w-1.5 rounded-full bg-primary animate-pulse" }), "Streaming") : effectiveView !== "none" && /* @__PURE__ */ React.createElement(
-    "button",
-    {
-      type: "button",
-      onClick: () => setView((v) => v === "full" ? "partial" : "full"),
-      className: "flex flex-shrink-0 items-center gap-1 rounded-md border border-border bg-background px-2 py-1 text-xs text-muted-foreground transition-colors hover:bg-muted/50",
-      title: view === "full" ? "Collapse to a window" : "Expand fully"
-    },
-    view === "full" ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Minimize2, { className: "h-3 w-3" }), " Collapse") : /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Maximize2, { className: "h-3 w-3" }), " Expand")
-  )), effectiveView !== "none" && /* @__PURE__ */ React.createElement(React.Fragment, null, streaming ? (
-    // STREAMING — locked, auto-scrolling viewport via MarkdownStream.
-    /* @__PURE__ */ React.createElement(
-      "div",
-      {
-        ref: scrollRef,
-        className: "overflow-y-auto p-4",
-        style: { maxHeight: PARTIAL_MAX_PX }
-      },
-      hasReport ? /* @__PURE__ */ React.createElement(
-        RichContent,
+  return /* @__PURE__ */ jsxs("div", { className: "mx-auto w-[94%] overflow-hidden rounded-xl border border-primary/20 bg-card shadow-sm", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 border-b border-border bg-primary/5 px-3 py-2", children: [
+      /* @__PURE__ */ jsxs(
+        "button",
         {
-          level: "full",
-          imagePolicy: "ai",
-          source: report,
-          isStreaming: true,
-          hideCopyButton: true,
-          className: "text-sm"
+          type: "button",
+          onClick: () => setView((v) => v === "none" ? "partial" : "none"),
+          className: "flex min-w-0 flex-1 items-center gap-2 text-left",
+          "aria-expanded": effectiveView !== "none",
+          children: [
+            effectiveView === "none" ? /* @__PURE__ */ jsx(ChevronRight, { className: "h-4 w-4 flex-shrink-0 text-muted-foreground" }) : /* @__PURE__ */ jsx(ChevronDown, { className: "h-4 w-4 flex-shrink-0 text-muted-foreground" }),
+            /* @__PURE__ */ jsx(AGENT_ICON, { className: "h-4 w-4 flex-shrink-0 text-primary" }),
+            /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+                /* @__PURE__ */ jsx("span", { className: "text-sm font-semibold text-foreground", children: "Research report" }),
+                /* @__PURE__ */ jsx(Badge, { tone: "primary", children: "Sub-agent" })
+              ] }),
+              queries && queries.length > 0 && /* @__PURE__ */ jsx("div", { className: "truncate text-xs text-muted-foreground", children: queries.join(" \xB7 ") })
+            ] })
+          ]
         }
-      ) : /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-2 py-6 text-sm text-muted-foreground" }, /* @__PURE__ */ React.createElement(FileText, { className: "h-4 w-4 text-primary" }), "Synthesizing the report\u2026")
-    )
-  ) : hasReport ? (
-    // DONE — user-controllable. `partial` = a free-scroll window;
-    // `full` = the whole report inline. RichDocument supplies the
-    // action toolkit (copy / save to notes / open editor / …).
-    /* @__PURE__ */ React.createElement(
-      "div",
-      {
-        className: cn(
-          effectiveView === "partial" && "overflow-y-auto"
-        ),
-        style: effectiveView === "partial" ? { maxHeight: PARTIAL_MAX_PX } : void 0
-      },
-      /* @__PURE__ */ React.createElement("div", { className: "p-4" }, /* @__PURE__ */ React.createElement(
-        RichDocument,
+      ),
+      streaming ? /* @__PURE__ */ jsxs("span", { className: "flex flex-shrink-0 items-center gap-1.5 text-xs font-medium text-primary", children: [
+        /* @__PURE__ */ jsx("span", { className: "h-1.5 w-1.5 rounded-full bg-primary animate-pulse" }),
+        "Streaming"
+      ] }) : effectiveView !== "none" && /* @__PURE__ */ jsx(
+        "button",
         {
-          imagePolicy: "ai",
-          content: report,
-          source: { type: "raw" },
-          actionsVariant: "mini-bar",
-          actionsClassName: "mt-2",
-          actions: { exclude: ["announcements", "preferences"] },
-          hideCopyButton: true,
-          contentClassName: "text-sm"
+          type: "button",
+          onClick: () => setView((v) => v === "full" ? "partial" : "full"),
+          className: "flex flex-shrink-0 items-center gap-1 rounded-md border border-border bg-background px-2 py-1 text-xs text-muted-foreground transition-colors hover:bg-muted/50",
+          title: view === "full" ? "Collapse to a window" : "Expand fully",
+          children: view === "full" ? /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(Minimize2, { className: "h-3 w-3" }),
+            " Collapse"
+          ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(Maximize2, { className: "h-3 w-3" }),
+            " Expand"
+          ] })
         }
-      ))
-    )
-  ) : /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-2 p-4 text-sm text-muted-foreground" }, /* @__PURE__ */ React.createElement(FileText, { className: "h-4 w-4" }), "No report was produced.")));
+      )
+    ] }),
+    effectiveView !== "none" && /* @__PURE__ */ jsx(Fragment, { children: streaming ? (
+      // STREAMING — locked, auto-scrolling viewport via MarkdownStream.
+      /* @__PURE__ */ jsx(
+        "div",
+        {
+          ref: scrollRef,
+          className: "overflow-y-auto p-4",
+          style: { maxHeight: PARTIAL_MAX_PX },
+          children: hasReport ? /* @__PURE__ */ jsx(
+            RichContent,
+            {
+              level: "full",
+              imagePolicy: "ai",
+              source: report,
+              isStreaming: true,
+              hideCopyButton: true,
+              className: "text-sm"
+            }
+          ) : /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 py-6 text-sm text-muted-foreground", children: [
+            /* @__PURE__ */ jsx(FileText, { className: "h-4 w-4 text-primary" }),
+            "Synthesizing the report\u2026"
+          ] })
+        }
+      )
+    ) : hasReport ? (
+      // DONE — user-controllable. `partial` = a free-scroll window;
+      // `full` = the whole report inline. RichDocument supplies the
+      // action toolkit (copy / save to notes / open editor / …).
+      /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: cn(
+            effectiveView === "partial" && "overflow-y-auto"
+          ),
+          style: effectiveView === "partial" ? { maxHeight: PARTIAL_MAX_PX } : void 0,
+          children: /* @__PURE__ */ jsx("div", { className: "p-4", children: /* @__PURE__ */ jsx(
+            RichDocument,
+            {
+              imagePolicy: "ai",
+              content: report,
+              source: { type: "raw" },
+              actionsVariant: "mini-bar",
+              actionsClassName: "mt-2",
+              actions: { exclude: ["announcements", "preferences"] },
+              hideCopyButton: true,
+              contentClassName: "text-sm"
+            }
+          ) })
+        }
+      )
+    ) : /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 p-4 text-sm text-muted-foreground", children: [
+      /* @__PURE__ */ jsx(FileText, { className: "h-4 w-4" }),
+      "No report was produced."
+    ] }) })
+  ] });
 };
 export {
   SubagentReportBlock