@ai-matrx/agents 0.25.3 → 0.27.0

package/dist/context/react/index.d.ts

@@ -50,6 +50,15 @@ interface ContextRuleResult {
     };
     clamped: boolean;
 }
+/** Text the model actually read for one value (receipt `delivered` / `on_request`). */
+interface ContextDeliveredText {
+    /** Cut at the receipt's cap; `chars` is the whole length. */
+    text: string;
+    chars: number;
+    truncated: boolean;
+    /** SHA-256 hex of the whole text (UTF-8). */
+    sha256: string;
+}
 type ContextRowOrigin = "page" | "attached" | "system";
 /** Why the server kept a value from the model on this turn (receipt `blocked_by`). */
 type ContextBlockedBy = "model" | "self_check";
@@ -67,6 +76,15 @@ interface ResolvedContextRow extends Omit<ContextRuleResult, "delivery"> {
     fromReceipt?: boolean;
     /** From a receipt: why the server kept this value from the model this turn. */
     blockedBy?: ContextBlockedBy;
+    /**
+     * Display-only, from a receipt: what the model read for this value. When set,
+     * a detail view shows THIS — never `value`, the client's pre-send copy.
+     */
+    delivered?: ContextDeliveredText;
+    /** Display-only, from a receipt: what the `context` tool returns for it. */
+    onRequest?: ContextDeliveredText;
+    /** Display-only, from a receipt: the server's own statement of it, also read. */
+    serverRendered?: ContextDeliveredText;
     key: string;
     label: string;
     surfaceKey: string;
@@ -201,4 +219,16 @@ interface InlineMaxInputProps {
  */
 declare function InlineMaxInput({ value, inherited, cap, onCommit, disabled, label, comfortable, placeholder, }: InlineMaxInputProps): react.JSX.Element;
 
-export { ContextRulesChip, type ContextRulesChipProps, type ContextRulesDensity, ContextRulesPanelBody, type ContextRulesPanelBodyProps, ContextRulesTable, type ContextRulesTableProps, InlineMaxInput, type InlineMaxInputProps, summarizeContextRows };
+/**
+ * What the model READ for one value — the receipt's `delivered` (its own
+ * element in the rendered context block) and, for an on-request value, what
+ * the `context` tool returns (`on_request`). Verbatim; never the client's copy.
+ * Renders nothing when the receipt carries neither (the host may then show
+ * the value the page will send, labelled so). RULES.md §5.
+ */
+declare function ContextDeliveredValue({ row, className, }: {
+    row: Pick<ResolvedContextRow, "delivered" | "onRequest" | "serverRendered">;
+    className?: string;
+}): react.JSX.Element | null;
+
+export { ContextDeliveredValue, ContextRulesChip, type ContextRulesChipProps, type ContextRulesDensity, ContextRulesPanelBody, type ContextRulesPanelBodyProps, ContextRulesTable, type ContextRulesTableProps, InlineMaxInput, type InlineMaxInputProps, summarizeContextRows };

package/dist/context/react/index.js

@@ -728,9 +728,46 @@ import {
   Input as Input2,
   Switch as Switch3,
   TooltipProvider as TooltipProvider3,
-  cn as cn4
+  cn as cn5
 } from "@ai-matrx/design-system";
-import { Fragment as Fragment2, jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
+
+// context/react/ContextDeliveredValue.tsx
+import { cn as cn4 } from "@ai-matrx/design-system";
+import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
+function ContextDeliveredValue({
+  row,
+  className
+}) {
+  if (!row.delivered && !row.onRequest && !row.serverRendered) return null;
+  return /* @__PURE__ */ jsxs5("div", { className: cn4("flex flex-col gap-3", className), children: [
+    row.delivered ? /* @__PURE__ */ jsx5(DeliveredBlock, { title: "Agent received", text: row.delivered }) : null,
+    row.onRequest ? /* @__PURE__ */ jsx5(DeliveredBlock, { title: "Returned on request", text: row.onRequest }) : null,
+    row.serverRendered ? /* @__PURE__ */ jsx5(DeliveredBlock, { title: "Agent also received", text: row.serverRendered }) : null
+  ] });
+}
+function DeliveredBlock({ title, text }) {
+  return /* @__PURE__ */ jsxs5("section", { className: "flex flex-col gap-1", "aria-label": title, children: [
+    /* @__PURE__ */ jsxs5("div", { className: "flex items-baseline gap-2 text-xs", children: [
+      /* @__PURE__ */ jsx5("span", { className: "font-medium", children: title }),
+      text.truncated ? /* @__PURE__ */ jsx5("span", { className: "tabular-nums text-muted-foreground", children: `First ${text.text.length.toLocaleString()} of ${text.chars.toLocaleString()} chars` }) : null
+    ] }),
+    /* @__PURE__ */ jsx5(
+      "pre",
+      {
+        "data-testid": "context-delivered-text",
+        className: cn4(
+          "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"
+        ),
+        children: text.text
+      }
+    )
+  ] });
+}
+
+// context/react/ContextRulesPanelBody.tsx
+import { Fragment as Fragment2, jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
 function layerCells(row) {
   const { surface, agent, default_max } = row.layers ?? {};
   const declared = agent?.declared === true;
@@ -753,38 +790,38 @@ function layerCells(row) {
 var LAYERS = ["default", "page", "agent", "you"];
 function LayerTable({ row }) {
   const cells = layerCells(row);
-  const cell = (text, winning) => /* @__PURE__ */ jsx5(
+  const cell = (text, winning) => /* @__PURE__ */ jsx6(
     "span",
     {
       role: "cell",
       "data-winning": winning ? "true" : void 0,
-      className: cn4(
+      className: cn5(
         "rounded px-1.5 py-0.5 text-right tabular-nums",
         winning ? "bg-primary/10 font-medium text-foreground" : "text-muted-foreground"
       ),
       children: text
     }
   );
-  return /* @__PURE__ */ jsxs5("div", { role: "table", "aria-label": "Layers", className: "text-xs", children: [
-    /* @__PURE__ */ jsxs5(
+  return /* @__PURE__ */ jsxs6("div", { role: "table", "aria-label": "Layers", className: "text-xs", children: [
+    /* @__PURE__ */ jsxs6(
       "div",
       {
         role: "row",
         className: "grid h-7 grid-cols-[1fr_5rem_5rem] items-center gap-x-2 border-b border-border font-medium text-muted-foreground",
         children: [
-          /* @__PURE__ */ jsx5("span", { role: "columnheader", children: "Layer" }),
-          /* @__PURE__ */ jsx5("span", { role: "columnheader", className: "text-right", children: "Include" }),
-          /* @__PURE__ */ jsx5("span", { role: "columnheader", className: "text-right", children: "Inline max" })
+          /* @__PURE__ */ jsx6("span", { role: "columnheader", children: "Layer" }),
+          /* @__PURE__ */ jsx6("span", { role: "columnheader", className: "text-right", children: "Include" }),
+          /* @__PURE__ */ jsx6("span", { role: "columnheader", className: "text-right", children: "Inline max" })
         ]
       }
     ),
-    LAYERS.map((layer) => /* @__PURE__ */ jsxs5(
+    LAYERS.map((layer) => /* @__PURE__ */ jsxs6(
       "div",
       {
         role: "row",
         className: "grid h-7 grid-cols-[1fr_5rem_5rem] items-center gap-x-2 border-b border-border/50",
         children: [
-          /* @__PURE__ */ jsx5("span", { role: "cell", children: LAYER_LABEL[layer] }),
+          /* @__PURE__ */ jsx6("span", { role: "cell", children: LAYER_LABEL[layer] }),
           cell(cells[layer].include, row.decided_by.include === layer),
           cell(cells[layer].limit, row.decided_by.max_inline_chars === layer)
         ]
@@ -802,18 +839,18 @@ function RowDetail({
   renderDetail,
   comfortable
 }) {
-  return /* @__PURE__ */ jsxs5("div", { className: "flex flex-col gap-3 p-3", children: [
-    /* @__PURE__ */ jsxs5("div", { className: "flex min-w-0 items-baseline gap-2", children: [
-      /* @__PURE__ */ jsx5("h3", { className: "min-w-0 truncate text-sm font-medium", children: row.label }),
-      /* @__PURE__ */ jsx5("span", { className: "shrink-0 text-xs tabular-nums text-muted-foreground", children: `${formatChars(row.chars)} chars \xB7 ${DELIVERY_LABEL[row.delivery]}` })
+  return /* @__PURE__ */ jsxs6("div", { className: "flex flex-col gap-3 p-3", children: [
+    /* @__PURE__ */ jsxs6("div", { className: "flex min-w-0 items-baseline gap-2", children: [
+      /* @__PURE__ */ jsx6("h3", { className: "min-w-0 truncate text-sm font-medium", children: row.label }),
+      /* @__PURE__ */ jsx6("span", { className: "shrink-0 text-xs tabular-nums text-muted-foreground", children: `${formatChars(row.chars)} chars \xB7 ${DELIVERY_LABEL[row.delivery]}` })
     ] }),
-    mismatches.length > 0 ? /* @__PURE__ */ jsxs5("div", { className: "flex items-start gap-1.5 rounded-md border border-warning/40 bg-warning/10 px-2 py-1.5 text-xs text-warning", children: [
-      /* @__PURE__ */ jsx5(TriangleAlertIcon, { className: "mt-0.5 h-3.5 w-3.5 shrink-0" }),
-      /* @__PURE__ */ jsx5("span", { children: describeMismatches(mismatches) })
+    mismatches.length > 0 ? /* @__PURE__ */ jsxs6("div", { className: "flex items-start gap-1.5 rounded-md border border-warning/40 bg-warning/10 px-2 py-1.5 text-xs text-warning", children: [
+      /* @__PURE__ */ jsx6(TriangleAlertIcon, { className: "mt-0.5 h-3.5 w-3.5 shrink-0" }),
+      /* @__PURE__ */ jsx6("span", { children: describeMismatches(mismatches) })
     ] }) : null,
-    /* @__PURE__ */ jsxs5("div", { className: "grid grid-cols-[auto_1fr] items-center gap-x-4 gap-y-2 text-xs", children: [
-      /* @__PURE__ */ jsx5("span", { className: "text-muted-foreground", children: "Include" }),
-      /* @__PURE__ */ jsx5("div", { className: cn4("flex items-center", comfortable ? "h-11" : "h-7"), children: /* @__PURE__ */ jsx5(
+    /* @__PURE__ */ jsxs6("div", { className: "grid grid-cols-[auto_1fr] items-center gap-x-4 gap-y-2 text-xs", children: [
+      /* @__PURE__ */ jsx6("span", { className: "text-muted-foreground", children: "Include" }),
+      /* @__PURE__ */ jsx6("div", { className: cn5("flex items-center", comfortable ? "h-11" : "h-7"), children: /* @__PURE__ */ jsx6(
         Switch3,
         {
           size: "sm",
@@ -823,8 +860,8 @@ function RowDetail({
           onCheckedChange: (next) => onChange(row.key, row.surfaceKey, withInclude(row, next))
         }
       ) }),
-      /* @__PURE__ */ jsx5("span", { className: "text-muted-foreground", children: "Inline max" }),
-      /* @__PURE__ */ jsx5("div", { className: "flex", children: /* @__PURE__ */ jsx5(
+      /* @__PURE__ */ jsx6("span", { className: "text-muted-foreground", children: "Inline max" }),
+      /* @__PURE__ */ jsx6("div", { className: "flex", children: /* @__PURE__ */ jsx6(
         InlineMaxInput,
         {
           label: row.label,
@@ -838,7 +875,8 @@ function RowDetail({
         }
       ) })
     ] }),
-    /* @__PURE__ */ jsx5(LayerTable, { row }),
+    /* @__PURE__ */ jsx6(LayerTable, { row }),
+    /* @__PURE__ */ jsx6(ContextDeliveredValue, { row }),
     renderDetail ? renderDetail(row) : null
   ] });
 }
@@ -865,9 +903,9 @@ function ContextRulesPanelBody({
   const visible = q ? rows.filter((r) => r.label.toLowerCase().includes(q) || r.key.toLowerCase().includes(q)) : rows;
   const selected = selectedKey ? rows.find((r) => r.key === selectedKey) ?? null : null;
   const comfortable = !!isMobile;
-  const search = /* @__PURE__ */ jsxs5("div", { className: "relative shrink-0 border-b border-border p-2", children: [
-    /* @__PURE__ */ jsx5(SearchIcon, { className: "pointer-events-none absolute left-4 top-1/2 h-3.5 w-3.5 -translate-y-1/2 text-muted-foreground" }),
-    /* @__PURE__ */ jsx5(
+  const search = /* @__PURE__ */ jsxs6("div", { className: "relative shrink-0 border-b border-border p-2", children: [
+    /* @__PURE__ */ jsx6(SearchIcon, { className: "pointer-events-none absolute left-4 top-1/2 h-3.5 w-3.5 -translate-y-1/2 text-muted-foreground" }),
+    /* @__PURE__ */ jsx6(
       Input2,
       {
         type: "search",
@@ -875,11 +913,11 @@ function ContextRulesPanelBody({
         placeholder: "Search",
         value: query,
         onChange: (e) => setQuery(e.target.value),
-        className: cn4("pl-7 shadow-none", comfortable ? "h-11 text-base" : "h-8 text-xs")
+        className: cn5("pl-7 shadow-none", comfortable ? "h-11 text-base" : "h-8 text-xs")
       }
     )
   ] });
-  const table = /* @__PURE__ */ jsx5("div", { className: "min-h-0 flex-1 overflow-y-auto", children: /* @__PURE__ */ jsx5(
+  const table = /* @__PURE__ */ jsx6("div", { className: "min-h-0 flex-1 overflow-y-auto", children: /* @__PURE__ */ jsx6(
     ContextRulesTable,
     {
       rows: visible,
@@ -892,7 +930,7 @@ function ContextRulesPanelBody({
       ...mismatches ? { mismatches } : {}
     }
   ) });
-  const detail = selected ? /* @__PURE__ */ jsx5(
+  const detail = selected ? /* @__PURE__ */ jsx6(
     RowDetail,
     {
       row: selected,
@@ -905,34 +943,35 @@ function ContextRulesPanelBody({
     }
   ) : null;
   if (isMobile) {
-    return /* @__PURE__ */ jsx5(TooltipProvider3, { delayDuration: 300, titleTooltips: false, children: /* @__PURE__ */ jsx5("div", { className: cn4("flex h-full min-h-0 flex-col", className), children: selected ? /* @__PURE__ */ jsxs5(Fragment2, { children: [
-      /* @__PURE__ */ jsx5("div", { className: "flex h-12 shrink-0 items-center border-b border-border px-1", children: /* @__PURE__ */ jsxs5(
+    return /* @__PURE__ */ jsx6(TooltipProvider3, { delayDuration: 300, titleTooltips: false, children: /* @__PURE__ */ jsx6("div", { className: cn5("flex h-full min-h-0 flex-col", className), children: selected ? /* @__PURE__ */ jsxs6(Fragment2, { children: [
+      /* @__PURE__ */ jsx6("div", { className: "flex h-12 shrink-0 items-center border-b border-border px-1", children: /* @__PURE__ */ jsxs6(
         "button",
         {
           type: "button",
           onClick: () => select(null),
           className: "inline-flex h-11 items-center gap-1 rounded-md px-2 text-sm text-muted-foreground hover:text-foreground",
           children: [
-            /* @__PURE__ */ jsx5(ChevronLeftIcon, { className: "h-4 w-4" }),
+            /* @__PURE__ */ jsx6(ChevronLeftIcon, { className: "h-4 w-4" }),
             "Back"
           ]
         }
       ) }),
-      /* @__PURE__ */ jsx5("div", { className: "min-h-0 flex-1 overflow-y-auto", children: detail })
-    ] }) : /* @__PURE__ */ jsxs5(Fragment2, { children: [
+      /* @__PURE__ */ jsx6("div", { className: "min-h-0 flex-1 overflow-y-auto", children: detail })
+    ] }) : /* @__PURE__ */ jsxs6(Fragment2, { children: [
       search,
       table
     ] }) }) });
   }
-  return /* @__PURE__ */ jsx5(TooltipProvider3, { delayDuration: 300, titleTooltips: false, children: /* @__PURE__ */ jsxs5("div", { className: cn4("flex h-full min-h-0", className), children: [
-    /* @__PURE__ */ jsxs5("aside", { className: "flex w-[22rem] shrink-0 flex-col border-r border-border", children: [
+  return /* @__PURE__ */ jsx6(TooltipProvider3, { delayDuration: 300, titleTooltips: false, children: /* @__PURE__ */ jsxs6("div", { className: cn5("flex h-full min-h-0", className), children: [
+    /* @__PURE__ */ jsxs6("aside", { className: "flex w-[22rem] shrink-0 flex-col border-r border-border", children: [
       search,
       table
     ] }),
-    /* @__PURE__ */ jsx5("section", { className: "min-h-0 min-w-0 flex-1 overflow-y-auto", children: detail ?? /* @__PURE__ */ jsx5("div", { className: "flex h-full items-center justify-center text-xs text-muted-foreground", children: "Select an item" }) })
+    /* @__PURE__ */ jsx6("section", { className: "min-h-0 min-w-0 flex-1 overflow-y-auto", children: detail ?? /* @__PURE__ */ jsx6("div", { className: "flex h-full items-center justify-center text-xs text-muted-foreground", children: "Select an item" }) })
   ] }) });
 }
 export {
+  ContextDeliveredValue,
   ContextRulesChip,
   ContextRulesPanelBody,
   ContextRulesTable,