@ai-matrx/chat 0.5.0 → 0.5.3

package/dist/agents/components/context-policies-display/ContextPolicyItemsPopover.js

@@ -1,4 +1,5 @@
 "use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { useState } from "react";
 import { Boxes } from "lucide-react";
 import {
@@ -41,47 +42,56 @@ function ContextPolicyItemsPopover({
       contextEntryLabel(entry, policyByKey.get(entry.key)?.label)
     );
   };
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Popover, { open: popoverOpen, onOpenChange: setPopoverOpen }, /* @__PURE__ */ React.createElement(PopoverTrigger, { asChild: true }, /* @__PURE__ */ React.createElement(
-    ValueCountPill,
-    {
-      text: String(count),
-      icon: Boxes,
-      "aria-label": `${count} sent`,
-      className
-    }
-  )), /* @__PURE__ */ React.createElement(
-    PopoverContent,
-    {
-      sizing: "content",
-      align: "start",
-      side: "top",
-      sideOffset: 6,
-      className: "p-1.5"
-    },
-    /* @__PURE__ */ React.createElement("div", { className: "max-h-64 overflow-y-auto space-y-0.5" }, entries.map((entry) => {
-      const policy = policyByKey.get(entry.key);
-      const type = policy?.type ?? entry.type;
-      const Icon = CONTEXT_TYPE_ICON[type] ?? FALLBACK_CONTEXT_ICON;
-      const theme = resolveContextPolicyTileTheme(type);
-      const typeLabel = getKnownContextDefinition(entry.key)?.typeLabel ?? CONTEXT_TYPE_TILE_LABEL[type] ?? "";
-      const label = contextEntryLabel(entry, policy?.label);
-      const preview = contextPolicyEntryPreview(entry, type);
-      return /* @__PURE__ */ React.createElement(
-        "button",
-        {
-          key: entry.key,
-          type: "button",
-          onClick: () => openDetail(entry),
-          className: cn(
-            "flex w-full items-start gap-2 rounded-lg px-2 py-1.5 text-left",
-            "transition-colors hover:bg-accent/80"
-          )
-        },
-        /* @__PURE__ */ React.createElement("span", { className: "mt-0.5 inline-flex h-[1.125rem] w-[1.125rem] shrink-0 items-center justify-center" }, /* @__PURE__ */ React.createElement(Icon, { className: cn("h-3.5 w-3.5", theme.icon) })),
-        /* @__PURE__ */ React.createElement("span", { className: "min-w-0 flex-1" }, /* @__PURE__ */ React.createElement("span", { className: "block truncate text-[9px] font-semibold uppercase tracking-wide text-muted-foreground" }, typeLabel), /* @__PURE__ */ React.createElement("span", { className: "block truncate text-xs font-medium text-foreground" }, label), preview ? /* @__PURE__ */ React.createElement("span", { className: "block truncate text-[10px] text-muted-foreground" }, preview) : null)
-      );
-    }))
-  )));
+  return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs(Popover, { open: popoverOpen, onOpenChange: setPopoverOpen, children: [
+    /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
+      ValueCountPill,
+      {
+        text: String(count),
+        icon: Boxes,
+        "aria-label": `${count} sent`,
+        className
+      }
+    ) }),
+    /* @__PURE__ */ jsx(
+      PopoverContent,
+      {
+        sizing: "content",
+        align: "start",
+        side: "top",
+        sideOffset: 6,
+        className: "p-1.5",
+        children: /* @__PURE__ */ jsx("div", { className: "max-h-64 overflow-y-auto space-y-0.5", children: entries.map((entry) => {
+          const policy = policyByKey.get(entry.key);
+          const type = policy?.type ?? entry.type;
+          const Icon = CONTEXT_TYPE_ICON[type] ?? FALLBACK_CONTEXT_ICON;
+          const theme = resolveContextPolicyTileTheme(type);
+          const typeLabel = getKnownContextDefinition(entry.key)?.typeLabel ?? CONTEXT_TYPE_TILE_LABEL[type] ?? "";
+          const label = contextEntryLabel(entry, policy?.label);
+          const preview = contextPolicyEntryPreview(entry, type);
+          return /* @__PURE__ */ jsxs(
+            "button",
+            {
+              type: "button",
+              onClick: () => openDetail(entry),
+              className: cn(
+                "flex w-full items-start gap-2 rounded-lg px-2 py-1.5 text-left",
+                "transition-colors hover:bg-accent/80"
+              ),
+              children: [
+                /* @__PURE__ */ jsx("span", { className: "mt-0.5 inline-flex h-[1.125rem] w-[1.125rem] shrink-0 items-center justify-center", children: /* @__PURE__ */ jsx(Icon, { className: cn("h-3.5 w-3.5", theme.icon) }) }),
+                /* @__PURE__ */ jsxs("span", { className: "min-w-0 flex-1", children: [
+                  /* @__PURE__ */ jsx("span", { className: "block truncate text-[9px] font-semibold uppercase tracking-wide text-muted-foreground", children: typeLabel }),
+                  /* @__PURE__ */ jsx("span", { className: "block truncate text-xs font-medium text-foreground", children: label }),
+                  preview ? /* @__PURE__ */ jsx("span", { className: "block truncate text-[10px] text-muted-foreground", children: preview }) : null
+                ] })
+              ]
+            },
+            entry.key
+          );
+        }) })
+      }
+    )
+  ] }) });
 }
 export {
   ContextPolicyItemsPopover

package/dist/agents/components/context-policies-display/ContextPolicyTile.js

@@ -1,4 +1,5 @@
 "use client";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { createElement, forwardRef } from "react";
 import { cn } from "@ai-matrx/design-system";
 import { RESOURCE_ATTACHMENT_TILE_SHELL_ADAPTIVE } from "../messages-display/user/resourceAttachmentTile.theme.js";
@@ -14,7 +15,7 @@ const ContextPolicyTile = forwardRef(function ContextPolicyTile2({
   ...props
 }, ref) {
   const theme = resolveContextPolicyTileTheme(themeKey);
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsxs(
     "button",
     {
       ref,
@@ -26,12 +27,17 @@ const ContextPolicyTile = forwardRef(function ContextPolicyTile2({
         theme.surface,
         className
       ),
-      ...props
-    },
-    /* @__PURE__ */ React.createElement("span", { className: "flex items-center gap-1 min-w-0 w-full" }, /* @__PURE__ */ React.createElement("span", { className: "h-[1.125rem] w-[1.125rem] shrink-0 flex items-center justify-center" }, createElement(Icon, {
-      className: cn("h-3.5 w-3.5 shrink-0", theme.icon)
-    })), /* @__PURE__ */ React.createElement("span", { className: "min-w-0 flex-1 truncate whitespace-nowrap text-[9px] font-semibold leading-none text-muted-foreground uppercase tracking-wide" }, typeLabel)),
-    /* @__PURE__ */ React.createElement("span", { className: "block w-full min-w-0 truncate whitespace-nowrap text-[10px] leading-none text-foreground font-medium" }, title)
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-1 min-w-0 w-full", children: [
+          /* @__PURE__ */ jsx("span", { className: "h-[1.125rem] w-[1.125rem] shrink-0 flex items-center justify-center", children: createElement(Icon, {
+            className: cn("h-3.5 w-3.5 shrink-0", theme.icon)
+          }) }),
+          /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate whitespace-nowrap text-[9px] font-semibold leading-none text-muted-foreground uppercase tracking-wide", children: typeLabel })
+        ] }),
+        /* @__PURE__ */ jsx("span", { className: "block w-full min-w-0 truncate whitespace-nowrap text-[10px] leading-none text-foreground font-medium", children: title })
+      ]
+    }
   );
 });
 export {

package/dist/agents/components/context-policies-display/ContextRulesPanel.js

@@ -1,4 +1,5 @@
 "use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { useConversationDisplayRows } from "../inputs/smart-input/useConversationDisplayRows.js";
 import { ContextRulesPanelBody } from "@ai-matrx/agents/context/react";
 import {
@@ -63,28 +64,34 @@ function ContextRulesPanel({
   const renderDetail = (row) => {
     const docKind = docKindForContextKey(row.key);
     if (docKind !== null) {
-      return /* @__PURE__ */ React.createElement("div", { className: "min-h-[24rem]" }, /* @__PURE__ */ React.createElement(
+      return /* @__PURE__ */ jsx("div", { className: "min-h-[24rem]", children: /* @__PURE__ */ jsx(
         WorkingDocumentBody,
         {
           item: buildWorkingDocumentDrawerItem(conversationId, row.label, docKind),
           initialKind: docKind
         }
-      ));
+      ) });
     }
     const policy = policies?.find((p) => p.key === row.key);
     const received = Boolean(row.delivered || row.onRequest);
     const serverOwned = !received && isServerOwnedContextKey(row.key);
     const value = row.value && typeof row.value === "object" && !Array.isArray(row.value) && "content" in row.value ? row.value.content : row.value;
-    return /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-3" }, received || serverOwned ? null : /* @__PURE__ */ React.createElement(React.Fragment, null, value !== void 0 && value !== null ? /* @__PURE__ */ React.createElement("p", { className: "text-xs font-medium" }, "Will send") : null, /* @__PURE__ */ React.createElement(
-      ContextValueBody,
-      {
-        type: policy?.type ?? row.type ?? "text",
-        contextKey: row.key,
-        value
-      }
-    )), policy ? /* @__PURE__ */ React.createElement(AgentEditAccessBadge, { access: decodeAgentEditAccess(policy).access }) : null);
+    return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3", children: [
+      received || serverOwned ? null : /* @__PURE__ */ jsxs(Fragment, { children: [
+        value !== void 0 && value !== null ? /* @__PURE__ */ jsx("p", { className: "text-xs font-medium", children: "Will send" }) : null,
+        /* @__PURE__ */ jsx(
+          ContextValueBody,
+          {
+            type: policy?.type ?? row.type ?? "text",
+            contextKey: row.key,
+            value
+          }
+        )
+      ] }),
+      policy ? /* @__PURE__ */ jsx(AgentEditAccessBadge, { access: decodeAgentEditAccess(policy).access }) : null
+    ] });
   };
-  return /* @__PURE__ */ React.createElement("div", { className: "flex h-full min-h-0 flex-col overflow-hidden bg-background" }, /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx("div", { className: "flex h-full min-h-0 flex-col overflow-hidden bg-background", children: /* @__PURE__ */ jsx(
     ContextRulesPanelBody,
     {
       rows,
@@ -101,7 +108,7 @@ function ContextRulesPanel({
       onSelectedKeyChange,
       className: "min-h-0 flex-1"
     }
-  ));
+  ) });
 }
 export {
   ContextRulesPanel,

package/dist/agents/components/context-policies-display/ContextValueBody.js

@@ -1,4 +1,5 @@
 "use client";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { ExternalLink } from "lucide-react";
 import {
   KnownContextDetail,
@@ -22,57 +23,59 @@ function ContextValueBody({
   value
 }) {
   if (value === void 0 || value === null) {
-    return /* @__PURE__ */ React.createElement("p", { className: "text-[11px] italic text-muted-foreground/70" }, "No value set for this conversation.");
+    return /* @__PURE__ */ jsx("p", { className: "text-[11px] italic text-muted-foreground/70", children: "No value set for this conversation." });
   }
   const unwrapped = unwrapRichContextValue(value);
   if (isKnownContextKey(contextKey) && parseContextRecord(unwrapped) && getKnownContextDefinition(contextKey)) {
-    return /* @__PURE__ */ React.createElement(KnownContextDetail, { contextKey, value: unwrapped });
+    return /* @__PURE__ */ jsx(KnownContextDetail, { contextKey, value: unwrapped });
   }
   if (isKnownTextContextKey(contextKey)) {
     const textDef = getKnownTextContextDefinition(contextKey);
     if (textDef?.Detail) {
-      return /* @__PURE__ */ React.createElement(KnownTextContextDetail, { contextKey, value });
+      return /* @__PURE__ */ jsx(KnownTextContextDetail, { contextKey, value });
     }
   }
   const classified = classifyContextValue(value, type);
   if (type === "file_url" && typeof classified.text === "string") {
-    return /* @__PURE__ */ React.createElement(
+    return /* @__PURE__ */ jsxs(
       "a",
       {
         href: classified.text,
         target: "_blank",
         rel: "noreferrer noopener",
-        className: "inline-flex select-text items-center gap-1.5 break-all text-xs text-primary hover:underline"
-      },
-      /* @__PURE__ */ React.createElement(ExternalLink, { className: "h-3 w-3 shrink-0" }),
-      /* @__PURE__ */ React.createElement("span", { className: "break-all" }, classified.text)
+        className: "inline-flex select-text items-center gap-1.5 break-all text-xs text-primary hover:underline",
+        children: [
+          /* @__PURE__ */ jsx(ExternalLink, { className: "h-3 w-3 shrink-0" }),
+          /* @__PURE__ */ jsx("span", { className: "break-all", children: classified.text })
+        ]
+      }
     );
   }
   if (classified.kind === "json") {
-    return /* @__PURE__ */ React.createElement("div", { className: "h-[min(50dvh,22rem)] min-h-[12rem] overflow-hidden rounded border border-border" }, /* @__PURE__ */ React.createElement(JsonInspector, { data: classified.data ?? {}, className: "h-full" }));
+    return /* @__PURE__ */ jsx("div", { className: "h-[min(50dvh,22rem)] min-h-[12rem] overflow-hidden rounded border border-border", children: /* @__PURE__ */ jsx(JsonInspector, { data: classified.data ?? {}, className: "h-full" }) });
   }
   if (classified.kind === "markdown-text" && classified.text) {
-    return /* @__PURE__ */ React.createElement("div", { className: "select-text text-xs" }, /* @__PURE__ */ React.createElement(RichContent, { level: "full", imagePolicy: "other", source: classified.text, hideCopyButton: true }));
+    return /* @__PURE__ */ jsx("div", { className: "select-text text-xs", children: /* @__PURE__ */ jsx(RichContent, { level: "full", imagePolicy: "other", source: classified.text, hideCopyButton: true }) });
   }
   if (classified.kind === "scalar" && classified.text) {
-    return /* @__PURE__ */ React.createElement("p", { className: "select-text break-words font-mono text-xs text-foreground" }, classified.text);
+    return /* @__PURE__ */ jsx("p", { className: "select-text break-words font-mono text-xs text-foreground", children: classified.text });
   }
   if (classified.text) {
-    return /* @__PURE__ */ React.createElement(SelectableMonospaceBlock, { text: classified.text });
+    return /* @__PURE__ */ jsx(SelectableMonospaceBlock, { text: classified.text });
   }
-  return /* @__PURE__ */ React.createElement("p", { className: "text-[11px] italic text-muted-foreground/70" }, "No displayable value.");
+  return /* @__PURE__ */ jsx("p", { className: "text-[11px] italic text-muted-foreground/70", children: "No displayable value." });
 }
 function SelectableMonospaceBlock({ text }) {
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     "pre",
     {
       className: cn(
         "max-h-[min(50dvh,22rem)] cursor-text select-text overflow-auto",
         "whitespace-pre-wrap break-words rounded border border-border",
         "bg-muted/40 p-2 font-mono text-[11px] text-foreground"
-      )
-    },
-    text
+      ),
+      children: text
+    }
   );
 }
 export {

package/dist/agents/components/context-policies-display/MessageContextReceipt.js

@@ -1,4 +1,5 @@
 "use client";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { useMemo, useState } from "react";
 import { Boxes, TriangleAlert } from "lucide-react";
 import {
@@ -62,32 +63,40 @@ function MessageContextReceiptTable({
     opened && (opened.delivered || opened.onRequest || opened.deliveredBlocks?.length)
   );
   const block = alsoSent.find((b) => b.id === openBlock) ?? null;
-  return /* @__PURE__ */ React.createElement("div", { className: "flex min-w-0 flex-col" }, receipt.model_reads_context === false ? /* @__PURE__ */ React.createElement("p", { className: "px-2 py-1 text-xs text-muted-foreground" }, "This model can't read these values") : null, receipt.rules_error ? /* @__PURE__ */ React.createElement("p", { className: "px-2 py-1 text-xs text-warning" }, "Your rules could not be read") : null, /* @__PURE__ */ React.createElement(
-    ContextRulesTable,
-    {
-      rows,
-      cap: receipt.cap,
-      readOnly: true,
-      hierarchy,
-      mismatches,
-      onChange: NO_CHANGE,
-      onOpenRow: (key) => {
-        setOpenBlock(null);
-        setOpenKey((current) => current === key ? null : key);
-      },
-      selectedKey: openKey
-    }
-  ), opened && hasText ? /* @__PURE__ */ React.createElement(ContextDeliveredValue, { row: opened, load, className: "px-2 py-2" }) : null, alsoSent.length > 0 ? /* @__PURE__ */ React.createElement(
-    ContextReceiptBlocks,
-    {
-      blocks: alsoSent,
-      selectedId: openBlock,
-      onOpenBlock: (id) => {
-        setOpenKey(null);
-        setOpenBlock((current) => current === id ? null : id);
+  return /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-col", children: [
+    receipt.model_reads_context === false ? /* @__PURE__ */ jsx("p", { className: "px-2 py-1 text-xs text-muted-foreground", children: "This model can't read these values" }) : null,
+    receipt.rules_error ? /* @__PURE__ */ jsx("p", { className: "px-2 py-1 text-xs text-warning", children: "Your rules could not be read" }) : null,
+    /* @__PURE__ */ jsx(
+      ContextRulesTable,
+      {
+        rows,
+        cap: receipt.cap,
+        readOnly: true,
+        hierarchy,
+        mismatches,
+        onChange: NO_CHANGE,
+        onOpenRow: (key) => {
+          setOpenBlock(null);
+          setOpenKey((current) => current === key ? null : key);
+        },
+        selectedKey: openKey
       }
-    }
-  ) : null, block ? /* @__PURE__ */ React.createElement(ContextReceiptBlockDetail, { block, load, className: "px-2 py-2" }) : null, receipt.room_view ? /* @__PURE__ */ React.createElement(RoomViewManifestTable, { roomView: receipt.room_view }) : null);
+    ),
+    opened && hasText ? /* @__PURE__ */ jsx(ContextDeliveredValue, { row: opened, load, className: "px-2 py-2" }) : null,
+    alsoSent.length > 0 ? /* @__PURE__ */ jsx(
+      ContextReceiptBlocks,
+      {
+        blocks: alsoSent,
+        selectedId: openBlock,
+        onOpenBlock: (id) => {
+          setOpenKey(null);
+          setOpenBlock((current) => current === id ? null : id);
+        }
+      }
+    ) : null,
+    block ? /* @__PURE__ */ jsx(ContextReceiptBlockDetail, { block, load, className: "px-2 py-2" }) : null,
+    receipt.room_view ? /* @__PURE__ */ jsx(RoomViewManifestTable, { roomView: receipt.room_view }) : null
+  ] });
 }
 const ROOM_VIEW_BLOCK_ID = "room_view";
 function withheldRuleLabel(rule) {
@@ -103,7 +112,36 @@ function RoomViewManifestTable({
   withheldText
 }) {
   const withheld = roomView.withheld ?? [];
-  return /* @__PURE__ */ React.createElement("div", { className: "flex min-w-0 flex-col text-xs", "data-room-view": roomView.participant_key }, /* @__PURE__ */ React.createElement("div", { className: "flex flex-wrap items-center gap-x-3 gap-y-0.5 px-2 py-1 tabular-nums text-muted-foreground" }, /* @__PURE__ */ React.createElement("span", null, "Round ", roomView.round), /* @__PURE__ */ React.createElement("span", null, "Policy v", roomView.policy_version), /* @__PURE__ */ React.createElement("span", null, (roomView.included ?? []).length, " shown"), /* @__PURE__ */ React.createElement("span", null, (roomView.digested ?? []).length, " digested"), /* @__PURE__ */ React.createElement("span", { className: withheld.length ? "text-foreground" : void 0 }, withheld.length, " withheld")), roomView.error ? /* @__PURE__ */ React.createElement("p", { className: "px-2 py-1 text-destructive" }, roomView.error) : null, withheld.length > 0 ? /* @__PURE__ */ React.createElement("table", { className: "w-full table-fixed border-t border-border" }, /* @__PURE__ */ React.createElement("tbody", null, withheld.map((item) => /* @__PURE__ */ React.createElement("tr", { key: `${item.message_id}:${item.rule}`, className: "border-b border-border/60 align-top", "data-withheld": item.message_id }, /* @__PURE__ */ React.createElement("td", { className: "w-28 truncate px-2 py-1 font-medium text-foreground" }, speakerName(item.speaker)), /* @__PURE__ */ React.createElement("td", { className: "w-36 truncate px-2 py-1 text-muted-foreground" }, withheldRuleLabel(item.rule)), /* @__PURE__ */ React.createElement("td", { className: "truncate px-2 py-1 text-muted-foreground", title: withheldText?.[item.message_id] }, withheldText?.[item.message_id] ?? "\u2014"))))) : null);
+  return /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-col text-xs", "data-room-view": roomView.participant_key, children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-x-3 gap-y-0.5 px-2 py-1 tabular-nums text-muted-foreground", children: [
+      /* @__PURE__ */ jsxs("span", { children: [
+        "Round ",
+        roomView.round
+      ] }),
+      /* @__PURE__ */ jsxs("span", { children: [
+        "Policy v",
+        roomView.policy_version
+      ] }),
+      /* @__PURE__ */ jsxs("span", { children: [
+        (roomView.included ?? []).length,
+        " shown"
+      ] }),
+      /* @__PURE__ */ jsxs("span", { children: [
+        (roomView.digested ?? []).length,
+        " digested"
+      ] }),
+      /* @__PURE__ */ jsxs("span", { className: withheld.length ? "text-foreground" : void 0, children: [
+        withheld.length,
+        " withheld"
+      ] })
+    ] }),
+    roomView.error ? /* @__PURE__ */ jsx("p", { className: "px-2 py-1 text-destructive", children: roomView.error }) : null,
+    withheld.length > 0 ? /* @__PURE__ */ jsx("table", { className: "w-full table-fixed border-t border-border", children: /* @__PURE__ */ jsx("tbody", { children: withheld.map((item) => /* @__PURE__ */ jsxs("tr", { className: "border-b border-border/60 align-top", "data-withheld": item.message_id, children: [
+      /* @__PURE__ */ jsx("td", { className: "w-28 truncate px-2 py-1 font-medium text-foreground", children: speakerName(item.speaker) }),
+      /* @__PURE__ */ jsx("td", { className: "w-36 truncate px-2 py-1 text-muted-foreground", children: withheldRuleLabel(item.rule) }),
+      /* @__PURE__ */ jsx("td", { className: "truncate px-2 py-1 text-muted-foreground", title: withheldText?.[item.message_id], children: withheldText?.[item.message_id] ?? "\u2014" })
+    ] }, `${item.message_id}:${item.rule}`)) }) }) : null
+  ] });
 }
 function RoomViewReceipt({
   conversationId,
@@ -114,7 +152,10 @@ function RoomViewReceipt({
 }) {
   const load = useSentTurnContextView(conversationId, messageId);
   const block = (receipt.blocks ?? []).find((b) => b.id === ROOM_VIEW_BLOCK_ID) ?? null;
-  return /* @__PURE__ */ React.createElement("div", { className: "flex min-w-0 flex-col" }, block ? /* @__PURE__ */ React.createElement(ContextReceiptBlockDetail, { block, load, className: "px-2 py-2" }) : null, receipt.room_view ? /* @__PURE__ */ React.createElement(RoomViewManifestTable, { roomView: receipt.room_view, speakerName, withheldText }) : /* @__PURE__ */ React.createElement("p", { className: "px-2 py-1 text-xs text-muted-foreground" }, "No group view on this turn"));
+  return /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-col", children: [
+    block ? /* @__PURE__ */ jsx(ContextReceiptBlockDetail, { block, load, className: "px-2 py-2" }) : null,
+    receipt.room_view ? /* @__PURE__ */ jsx(RoomViewManifestTable, { roomView: receipt.room_view, speakerName, withheldText }) : /* @__PURE__ */ jsx("p", { className: "px-2 py-1 text-xs text-muted-foreground", children: "No group view on this turn" })
+  ] });
 }
 function MessageContextReceiptView({
   conversationId,
@@ -128,9 +169,9 @@ function MessageContextReceiptView({
   );
   const load = useSentTurnContextView(conversationId, messageId);
   if (!receipt) {
-    return /* @__PURE__ */ React.createElement("p", { className: "px-3 py-2 text-xs text-muted-foreground" }, "No receipt for this turn");
+    return /* @__PURE__ */ jsx("p", { className: "px-3 py-2 text-xs text-muted-foreground", children: "No receipt for this turn" });
   }
-  return /* @__PURE__ */ React.createElement("div", { className: "h-full min-h-0 overflow-y-auto" }, /* @__PURE__ */ React.createElement(MessageContextReceiptTable, { receipt, mismatches, load }));
+  return /* @__PURE__ */ jsx("div", { className: "h-full min-h-0 overflow-y-auto", children: /* @__PURE__ */ jsx(MessageContextReceiptTable, { receipt, mismatches, load }) });
 }
 function MessageContextReceipt({
   conversationId,
@@ -142,7 +183,7 @@ function MessageContextReceipt({
   const tab = useChatCanvasTab({ kind: MESSAGE_CONTEXT_RECEIPT_KIND, key: messageId });
   const hasMismatch = (mismatches?.length ?? 0) > 0;
   const summary = receiptSummary(receipt);
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     ValueCountPill,
     {
       text: summary,

package/dist/agents/components/context-policies-display/ValueCountPill.js

@@ -1,20 +1,21 @@
 "use client";
+import { jsx } from "react/jsx-runtime";
 import { forwardRef } from "react";
 import { Button } from "@ai-matrx/design-system/controls";
 const ValueCountPill = forwardRef(
   function ValueCountPill2({ icon: Icon, text, name, warn, className, type = "button", ...props }, ref) {
-    return /* @__PURE__ */ React.createElement(
+    return /* @__PURE__ */ jsx(
       Button,
       {
         ref,
         type,
         variant: "outline",
         tone: warn ? "warning" : void 0,
-        icon: /* @__PURE__ */ React.createElement(Icon, null),
+        icon: /* @__PURE__ */ jsx(Icon, {}),
         className,
-        ...props
-      },
-      name ? `${name} \xB7 ${text}` : text
+        ...props,
+        children: name ? `${name} \xB7 ${text}` : text
+      }
     );
   }
 );

package/dist/agents/components/context-policies-display/knownContextValues.js

@@ -1,4 +1,5 @@
 "use client";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { WAR_ROOM_CONTEXT_KEY } from "./war-room-context-key.js";
 import { cn } from "@ai-matrx/design-system";
 import { unwrapRichContextValue } from "./contextValueUtils.js";
@@ -43,16 +44,19 @@ function truncateId(id, head = 8) {
 function ContextFieldGrid({
   fields
 }) {
-  return /* @__PURE__ */ React.createElement("dl", { className: "grid grid-cols-[minmax(4.5rem,auto)_1fr] gap-x-3 gap-y-2 text-xs" }, fields.map(({ label, value, mono }) => /* @__PURE__ */ React.createElement("div", { key: label, className: "contents" }, /* @__PURE__ */ React.createElement("dt", { className: "text-muted-foreground" }, label), /* @__PURE__ */ React.createElement(
-    "dd",
-    {
-      className: cn(
-        "min-w-0 break-words text-foreground",
-        mono && "font-mono text-[11px]"
-      )
-    },
-    value
-  ))));
+  return /* @__PURE__ */ jsx("dl", { className: "grid grid-cols-[minmax(4.5rem,auto)_1fr] gap-x-3 gap-y-2 text-xs", children: fields.map(({ label, value, mono }) => /* @__PURE__ */ jsxs("div", { className: "contents", children: [
+    /* @__PURE__ */ jsx("dt", { className: "text-muted-foreground", children: label }),
+    /* @__PURE__ */ jsx(
+      "dd",
+      {
+        className: cn(
+          "min-w-0 break-words text-foreground",
+          mono && "font-mono text-[11px]"
+        ),
+        children: value
+      }
+    )
+  ] }, label)) });
 }
 const USER = {
   typeLabel: "Profile",
@@ -62,7 +66,7 @@ const USER = {
     if (name && email) return `${name} \xB7 ${email}`;
     return name ?? email;
   },
-  Detail: ({ record: r }) => /* @__PURE__ */ React.createElement(
+  Detail: ({ record: r }) => /* @__PURE__ */ jsx(
     ContextFieldGrid,
     {
       fields: [
@@ -85,7 +89,7 @@ const CLIENT = {
     if (now && tz) return `${formatIsoShort(now)} \xB7 ${tz}`;
     return now ? formatIsoShort(now) : tz;
   },
-  Detail: ({ record: r }) => /* @__PURE__ */ React.createElement(
+  Detail: ({ record: r }) => /* @__PURE__ */ jsx(
     ContextFieldGrid,
     {
       fields: [
@@ -110,7 +114,7 @@ const ROUTE_BRIEF = {
     if (kind && head) return `${kind} \xB7 ${head}`;
     return kind ?? head;
   },
-  Detail: ({ record: r }) => /* @__PURE__ */ React.createElement(
+  Detail: ({ record: r }) => /* @__PURE__ */ jsx(
     ContextFieldGrid,
     {
       fields: [
@@ -127,7 +131,7 @@ const CONVERSATION = {
     const id = str(r.id);
     return id ? `Conversation ${truncateId(id)}` : null;
   },
-  Detail: ({ record: r }) => /* @__PURE__ */ React.createElement(
+  Detail: ({ record: r }) => /* @__PURE__ */ jsx(
     ContextFieldGrid,
     {
       fields: [{ label: "ID", value: str(r.id) ?? "\u2014", mono: true }]
@@ -168,7 +172,7 @@ function KnownTextContextDetail({
   const def = getKnownTextContextDefinition(contextKey);
   const unwrapped = unwrapRichContextValue(value);
   if (!def || typeof unwrapped !== "string") return null;
-  if (def.Detail) return /* @__PURE__ */ React.createElement(def.Detail, { text: unwrapped });
+  if (def.Detail) return /* @__PURE__ */ jsx(def.Detail, { text: unwrapped });
   return null;
 }
 function isKnownTextContextKey(key) {
@@ -195,7 +199,7 @@ function KnownContextDetail({
   if (!def || !record) {
     return null;
   }
-  return /* @__PURE__ */ React.createElement(def.Detail, { record });
+  return /* @__PURE__ */ jsx(def.Detail, { record });
 }
 function isKnownContextKey(key) {
   return key in KNOWN_CONTEXT_VALUES;