@ai-matrx/records-ui 0.115.77 → 0.115.79

package/dist/pickers.js

@@ -890,7 +890,7 @@ import {
   SelectItem as SelectItem7,
   SelectTrigger as SelectTrigger7,
   SelectValue as SelectValue7,
-  cn as cn24
+  cn as cn25
 } from "@ai-matrx/design-system";
 
 // src/dates.ts
@@ -2046,7 +2046,7 @@ function RelationPicker({ field, value, onChange, disabled, id, className, allow
 
 // src/buttonCell.tsx
 import { useState as useState24 } from "react";
-import { Button as Button16, Dialog as Dialog2, DialogContent as DialogContent2, DialogDescription, DialogHeader as DialogHeader2, DialogTitle as DialogTitle2, Popover as Popover4, PopoverContent as PopoverContent4, PopoverTrigger as PopoverTrigger4, cn as cn21 } from "@ai-matrx/design-system";
+import { Button as Button16, Dialog as Dialog2, DialogContent as DialogContent2, DialogDescription, DialogHeader as DialogHeader2, DialogTitle as DialogTitle2, Popover as Popover4, PopoverContent as PopoverContent4, PopoverTrigger as PopoverTrigger4, cn as cn22 } from "@ai-matrx/design-system";
 import { CHOICE_CHIP_CLASS as CHOICE_CHIP_CLASS2, NEUTRAL_CHIP_CLASS as NEUTRAL_CHIP_CLASS2, isStyleColor as isStyleColor2 } from "@ai-matrx/design-system/data-table";
 import { buttonNeeds as buttonNeeds2, buttonOf as buttonOf2 } from "@ai-matrx/records";
 import { useOptionalRecordsClient as useOptionalRecordsClient8 } from "@ai-matrx/records/react";
@@ -2114,7 +2114,7 @@ import {
   SelectTrigger as SelectTrigger6,
   SelectValue as SelectValue6,
   Separator,
-  cn as cn20
+  cn as cn21
 } from "@ai-matrx/design-system";
 
 // src/ReferenceBuilder.tsx
@@ -2841,7 +2841,7 @@ import { tableShapeChanged, useRecordsClient as useRecordsClient6 } from "@ai-ma
 // src/values.tsx
 import { SWATCH_CLASS as SWATCH_CLASS2, formatColumnValue } from "@ai-matrx/design-system/data-table";
 import { formatFieldValue as formatFieldValue3 } from "@ai-matrx/design-system/field-formats";
-import { Badge as Badge5, cn as cn18 } from "@ai-matrx/design-system";
+import { Badge as Badge5, cn as cn19 } from "@ai-matrx/design-system";
 
 // src/embeddedLook.tsx
 import { createContext as createContext2, useContext as useContext2 } from "react";
@@ -3940,7 +3940,7 @@ function linkChipText(raw) {
 // src/gridAttachments.tsx
 import { useEffect as useEffect11, useRef as useRef10, useState as useState17 } from "react";
 import { useOptionalRecordsClient as useOptionalRecordsClient5 } from "@ai-matrx/records/react";
-import { Badge as Badge3, Button as Button10, Dialog, DialogContent, DialogHeader, DialogTitle } from "@ai-matrx/design-system";
+import { Badge as Badge3, Button as Button10, cn as cn17, Dialog, DialogContent, DialogHeader, DialogTitle } from "@ai-matrx/design-system";
 
 // src/FilePicker.tsx
 import { useCallback as useCallback4, useId, useRef as useRef9, useState as useState16 } from "react";
@@ -4096,46 +4096,63 @@ function AttachmentChip({ id, onRemove, onPreview }) {
   const words = read?.name ?? (read ? FILE_CHIP_UNREAD : "\u2026");
   const href = read?.fileId ? host.hrefForFile?.({ fileId: read.fileId }) : void 0;
   const title = onPreview ? `Preview ${words}` : href ? `Open ${words}` : read?.why ?? FILE_CHIP_NO_PAGE;
-  return /* @__PURE__ */ jsxs19(Badge3, { variant: "secondary", className: "max-w-[14rem] gap-1 text-[11px]", "data-records-file-chip": id, title, children: [
-    onPreview ? /* @__PURE__ */ jsx21(
-      "button",
-      {
-        type: "button",
-        className: "truncate underline-offset-2 hover:underline",
-        "data-records-file-preview": id,
+  return /* @__PURE__ */ jsxs19(
+    Badge3,
+    {
+      variant: "secondary",
+      className: cn17("max-w-[14rem] gap-1 text-[11px]", onPreview && "cursor-pointer"),
+      "data-records-file-chip": id,
+      title,
+      ...onPreview ? {
         onClick: (event) => {
           event.stopPropagation();
           onPreview();
         },
         onMouseDown: (event) => event.stopPropagation(),
-        onDoubleClick: (event) => event.stopPropagation(),
-        children: words
-      }
-    ) : href ? /* @__PURE__ */ jsx21(
-      OutboundLink4,
-      {
-        href,
-        className: "truncate underline-offset-2 hover:underline",
-        "data-records-file-link": read?.fileId ?? "",
-        onClick: (event) => event.stopPropagation(),
-        onMouseDown: (event) => event.stopPropagation(),
-        children: words
-      }
-    ) : /* @__PURE__ */ jsx21("span", { className: "truncate", children: words }),
-    onRemove ? /* @__PURE__ */ jsx21(
-      "button",
-      {
-        type: "button",
-        "aria-label": `Remove ${words}`,
-        className: "shrink-0 rounded px-0.5 text-muted-foreground hover:text-foreground",
-        onClick: (event) => {
-          event.stopPropagation();
-          onRemove();
-        },
-        children: "\xD7"
-      }
-    ) : null
-  ] });
+        onDoubleClick: (event) => event.stopPropagation()
+      } : {},
+      children: [
+        onPreview ? /* @__PURE__ */ jsx21(
+          "button",
+          {
+            type: "button",
+            className: "truncate underline-offset-2 hover:underline",
+            "data-records-file-preview": id,
+            onClick: (event) => {
+              event.stopPropagation();
+              onPreview();
+            },
+            onMouseDown: (event) => event.stopPropagation(),
+            onDoubleClick: (event) => event.stopPropagation(),
+            children: words
+          }
+        ) : href ? /* @__PURE__ */ jsx21(
+          OutboundLink4,
+          {
+            href,
+            className: "truncate underline-offset-2 hover:underline",
+            "data-records-file-link": read?.fileId ?? "",
+            onClick: (event) => event.stopPropagation(),
+            onMouseDown: (event) => event.stopPropagation(),
+            children: words
+          }
+        ) : /* @__PURE__ */ jsx21("span", { className: "truncate", children: words }),
+        onRemove ? /* @__PURE__ */ jsx21(
+          "button",
+          {
+            type: "button",
+            "aria-label": `Remove ${words}`,
+            className: "shrink-0 rounded px-0.5 text-muted-foreground hover:text-foreground",
+            onClick: (event) => {
+              event.stopPropagation();
+              onRemove();
+            },
+            children: "\xD7"
+          }
+        ) : null
+      ]
+    }
+  );
 }
 function AttachmentChips({ value, onRemove }) {
   const host = useRecordsUi();
@@ -4176,6 +4193,18 @@ function AttachmentViewer({
     {
       className: "sm:max-w-3xl",
       "data-records-attachment-viewer": id,
+      tabIndex: -1,
+      onOpenAutoFocus: (event) => {
+        event.preventDefault();
+        event.currentTarget.focus();
+      },
+      onCloseAutoFocus: (event) => {
+        const chip = document.querySelector(`[data-records-file-preview="${ids[index]}"]`);
+        if (chip) {
+          event.preventDefault();
+          chip.focus();
+        }
+      },
       onKeyDown: (event) => {
         if (event.key === "ArrowLeft") {
           event.preventDefault();
@@ -4284,7 +4313,7 @@ function AttachmentControl({
 
 // src/ReferenceChips.tsx
 import { entityRefsOf as entityRefsOf2 } from "@ai-matrx/records";
-import { Badge as Badge4, Skeleton as Skeleton2, cn as cn17 } from "@ai-matrx/design-system";
+import { Badge as Badge4, Skeleton as Skeleton2, cn as cn18 } from "@ai-matrx/design-system";
 
 // src/kindValues.ts
 import { tryDecodeDirective } from "@ai-matrx/content-ir/directives";
@@ -4389,7 +4418,7 @@ function ReferenceChip({ reference, waiting }) {
     return /* @__PURE__ */ jsxs20(
       "span",
       {
-        className: cn17(
+        className: cn18(
           "inline-flex max-w-full min-w-0 items-center gap-1.5 text-sm text-foreground hover:underline [&_a]:text-inherit [&_a]:no-underline [&_a:hover]:underline",
           reference.archived && "opacity-70"
         ),
@@ -4409,7 +4438,7 @@ function ReferenceChip({ reference, waiting }) {
     Badge4,
     {
       variant: "secondary",
-      className: cn17(
+      className: cn18(
         "max-w-full min-w-0 gap-1 px-1.5 py-0 text-[11px] font-normal",
         reference.archived && "opacity-70"
       ),
@@ -4437,7 +4466,7 @@ function KindValueCell({
     return /* @__PURE__ */ jsx22("span", { className: "flex min-w-0 max-w-full items-center", "data-records-kind-value": kv.kind, children: host.renderKind({ value: kv.value, kind: kv.kind, where, title }) });
   }
   const named = kv.items.map(kindItemWords).filter((w) => w !== null);
-  return /* @__PURE__ */ jsx22("span", { className: cn17("flex min-w-0 flex-wrap gap-1"), "data-records-kind-value": kv.kind, title: JSON.stringify(kv.value), children: named.length > 0 ? named.map((w, i) => /* @__PURE__ */ jsx22(Badge4, { variant: "secondary", className: "px-1.5 py-0 text-[11px] font-normal", children: w }, `${w}-${i}`)) : /* @__PURE__ */ jsx22(Badge4, { variant: "outline", className: "px-1.5 py-0 text-[11px] font-normal", children: kindLabel(kv.kind) }) });
+  return /* @__PURE__ */ jsx22("span", { className: cn18("flex min-w-0 flex-wrap gap-1"), "data-records-kind-value": kv.kind, title: JSON.stringify(kv.value), children: named.length > 0 ? named.map((w, i) => /* @__PURE__ */ jsx22(Badge4, { variant: "secondary", className: "px-1.5 py-0 text-[11px] font-normal", children: w }, `${w}-${i}`)) : /* @__PURE__ */ jsx22(Badge4, { variant: "outline", className: "px-1.5 py-0 text-[11px] font-normal", children: kindLabel(kv.kind) }) });
 }
 
 // src/formulaNames.ts
@@ -4604,11 +4633,11 @@ function renderValue(field, value, document2, labels, stillWaitingFor, look) {
         Badge5,
         {
           variant: "outline",
-          className: cn18("text-[11px]", chip.className),
+          className: cn19("text-[11px]", chip.className),
           "data-records-choice-chip": "",
           ...chip.tinted ? { "data-records-choice-tint": "" } : {},
           children: [
-            look?.choiceDot ? /* @__PURE__ */ jsx23("span", { "aria-hidden": "true", "data-matrx-pill-ink": "", "data-records-choice-dot": "", className: cn18("mr-1.5 inline-block size-1.5 shrink-0 rounded-full", chip.dot) }) : null,
+            look?.choiceDot ? /* @__PURE__ */ jsx23("span", { "aria-hidden": "true", "data-matrx-pill-ink": "", "data-records-choice-dot": "", className: cn19("mr-1.5 inline-block size-1.5 shrink-0 rounded-full", chip.dot) }) : null,
             statusMark(field, item, Array.isArray(value) ? void 0 : document2),
             scalarText(field, item, labels, Array.isArray(value) ? void 0 : stillWaitingFor)
           ]
@@ -4657,7 +4686,7 @@ function renderValue(field, value, document2, labels, stillWaitingFor, look) {
   if (typeof value === "boolean") {
     return /* @__PURE__ */ jsx23("span", { className: kind === "checkbox" ? "text-sm" : "", title: value ? "Yes" : "No", children: value ? "\u2713" : "\u2014" });
   }
-  return /* @__PURE__ */ jsx23("span", { className: cn18("truncate", kind === "number" || kind === "currency" || kind === "percent" ? "tabular-nums" : ""), children: scalarText(field, value, labels, stillWaitingFor) });
+  return /* @__PURE__ */ jsx23("span", { className: cn19("truncate", kind === "number" || kind === "currency" || kind === "percent" ? "tabular-nums" : ""), children: scalarText(field, value, labels, stillWaitingFor) });
 }
 function scalarText(field, value, labels, stillWaitingFor) {
   if (value === null || value === void 0) return "\u2014";
@@ -6026,7 +6055,7 @@ import { useOptionalRecordsClient as useOptionalRecordsClient7 } from "@ai-matrx
 
 // src/AccentSwatches.tsx
 import { PORTAL_ACCENTS } from "@ai-matrx/records";
-import { cn as cn19 } from "@ai-matrx/design-system";
+import { cn as cn20 } from "@ai-matrx/design-system";
 import { STYLE_COLOR_LABELS as STYLE_COLOR_LABELS2, SWATCH_CLASS as SWATCH_CLASS3 } from "@ai-matrx/design-system/data-table";
 import { jsx as jsx30, jsxs as jsxs28 } from "react/jsx-runtime";
 function AccentSwatches({ value, onChange, options = PORTAL_ACCENTS, noneLabel = "App colour" }) {
@@ -6038,7 +6067,7 @@ function AccentSwatches({ value, onChange, options = PORTAL_ACCENTS, noneLabel =
         role: "radio",
         "aria-checked": value === "",
         onClick: () => onChange(""),
-        className: cn19(
+        className: cn20(
           "h-7 rounded border px-2 text-xs",
           value === "" ? "border-foreground" : "border-border text-muted-foreground"
         ),
@@ -6054,7 +6083,7 @@ function AccentSwatches({ value, onChange, options = PORTAL_ACCENTS, noneLabel =
         "aria-label": STYLE_COLOR_LABELS2[c],
         title: STYLE_COLOR_LABELS2[c],
         onClick: () => onChange(c),
-        className: cn19("h-7 w-7 rounded-full border-2", SWATCH_CLASS3[c], value === c ? "border-foreground" : "border-transparent")
+        className: cn20("h-7 w-7 rounded-full border-2", SWATCH_CLASS3[c], value === c ? "border-foreground" : "border-transparent")
       },
       c
     ))
@@ -6527,7 +6556,7 @@ function FieldEditor(props) {
   const offersMany = multiApplies(type) && !isTitle;
   if (!mayShape) {
     if (onEntity && entityRights.loading) return null;
-    return /* @__PURE__ */ jsx32("p", { className: cn20("text-xs text-muted-foreground", className), children: props.tableLabel && storeLabel && whyNot ? whyNot.split(storeLabel).join(props.tableLabel) : whyNot });
+    return /* @__PURE__ */ jsx32("p", { className: cn21("text-xs text-muted-foreground", className), children: props.tableLabel && storeLabel && whyNot ? whyNot.split(storeLabel).join(props.tableLabel) : whyNot });
   }
   const options = newChoices.map((r) => r.words.trim()).filter((word) => word !== "");
   const shownStatusRows = type !== "status" ? [] : statusGroupRows(field, editing ? choiceList ?? [] : newChoices, statusKeys, statusGroups);
@@ -6727,7 +6756,7 @@ function FieldEditor(props) {
     if (gone) (onRemoved ?? onSaved)?.();
     else setAskingToRemove(false);
   };
-  return /* @__PURE__ */ jsxs30("div", { className: cn20("flex min-w-0 flex-col gap-3 text-xs", className), "data-records-field-editor": "", children: [
+  return /* @__PURE__ */ jsxs30("div", { className: cn21("flex min-w-0 flex-col gap-3 text-xs", className), "data-records-field-editor": "", children: [
     /* @__PURE__ */ jsxs30("div", { className: "flex items-center gap-2", children: [
       /* @__PURE__ */ jsx32("span", { className: "font-medium", children: field ? `Field \xB7 ${fieldName(field)}` : "New field" }),
       /* @__PURE__ */ jsx32("span", { className: "ml-auto text-muted-foreground", children: tableLabel })
@@ -7184,8 +7213,8 @@ function FieldEditor(props) {
            the dialog card 0.2278 and closing it 0.1303. The consequence is the tooltip of
            "Remove it" (interface-text: the slot holds a label, never a paragraph). */
         /* @__PURE__ */ jsxs30("div", { className: "ml-auto grid shrink-0 items-center", "data-field-editor-remove": askingToRemove ? "asking" : "idle", children: [
-          /* @__PURE__ */ jsx32("div", { className: cn20("col-start-1 row-start-1 flex items-center justify-end gap-2", askingToRemove && "invisible"), "aria-hidden": askingToRemove || void 0, children: /* @__PURE__ */ jsx32(Button15, { size: "sm", variant: "outline", tabIndex: askingToRemove ? -1 : void 0, onClick: () => setAskingToRemove(true), children: "Remove this field" }) }),
-          /* @__PURE__ */ jsxs30("div", { className: cn20("col-start-1 row-start-1 flex items-center justify-end gap-2", !askingToRemove && "invisible"), "aria-hidden": !askingToRemove || void 0, children: [
+          /* @__PURE__ */ jsx32("div", { className: cn21("col-start-1 row-start-1 flex items-center justify-end gap-2", askingToRemove && "invisible"), "aria-hidden": askingToRemove || void 0, children: /* @__PURE__ */ jsx32(Button15, { size: "sm", variant: "outline", tabIndex: askingToRemove ? -1 : void 0, onClick: () => setAskingToRemove(true), children: "Remove this field" }) }),
+          /* @__PURE__ */ jsxs30("div", { className: cn21("col-start-1 row-start-1 flex items-center justify-end gap-2", !askingToRemove && "invisible"), "aria-hidden": !askingToRemove || void 0, children: [
             /* @__PURE__ */ jsx32("span", { className: "whitespace-nowrap text-destructive", "data-field-editor-remove-ask": "", children: "Archive this field?" }),
             /* @__PURE__ */ jsx32(
               Button15,
@@ -7624,7 +7653,7 @@ function ButtonValue({ field, recordId, inCell }) {
           "data-records-button-unset": needs ? "" : void 0,
           "aria-busy": busy || void 0,
           disabled: busy,
-          className: cn21("max-w-full gap-1 border px-2 font-medium", inCell ? "h-5" : "h-6", color, needs && "border-dashed opacity-80"),
+          className: cn22("max-w-full gap-1 border px-2 font-medium", inCell ? "h-5" : "h-6", color, needs && "border-dashed opacity-80"),
           onPointerDown: stop,
           onDoubleClick: stop,
           onClick: (event) => {
@@ -7678,7 +7707,7 @@ function ButtonValue({ field, recordId, inCell }) {
 import { useCallback as useCallback6, useEffect as useEffect18, useMemo as useMemo11, useRef as useRef13, useState as useState25 } from "react";
 import { rankTypedMatches as rankTypedMatches3 } from "@ai-matrx/records";
 import { useOptionalRecordsClient as useOptionalRecordsClient9 } from "@ai-matrx/records/react";
-import { cn as cn22 } from "@ai-matrx/design-system";
+import { cn as cn23 } from "@ai-matrx/design-system";
 import { Fragment as Fragment11, jsx as jsx34, jsxs as jsxs32 } from "react/jsx-runtime";
 function personFromRow(row) {
   const data = row.document ?? {};
@@ -7760,10 +7789,10 @@ function PersonPicker({ field, value, onChange, disabled, id, className, autoOpe
   }, [client, personTable, picked.length, people.length]);
   const listed = rankTypedMatches3(members ?? [], search, memberName);
   if (!membersPort || !client) {
-    return /* @__PURE__ */ jsx34("p", { className: cn22("text-xs text-muted-foreground", className), children: NO_MEMBERS_REASON });
+    return /* @__PURE__ */ jsx34("p", { className: cn23("text-xs text-muted-foreground", className), children: NO_MEMBERS_REASON });
   }
   if (!personTable) {
-    return /* @__PURE__ */ jsxs32("p", { className: cn22("text-xs text-muted-foreground", className), children: [
+    return /* @__PURE__ */ jsxs32("p", { className: cn23("text-xs text-muted-foreground", className), children: [
       fieldName(field),
       " is a person field, but it does not say which Table the people are records of yet, so there is nothing to pick from. A table admin sets its target in the field editor."
     ] });
@@ -7814,7 +7843,7 @@ function PersonPicker({ field, value, onChange, disabled, id, className, autoOpe
   );
   const anchored = autoOpen === true;
   const cellChips = picked.map((recordId) => /* @__PURE__ */ jsx34(PersonChip, { name: nameOfRecord(recordId), ...disabled || anchored ? {} : { onRemove: () => drop(recordId) } }, recordId));
-  return /* @__PURE__ */ jsxs32("div", { className: cn22("flex flex-wrap items-center gap-1", className), children: [
+  return /* @__PURE__ */ jsxs32("div", { className: cn23("flex flex-wrap items-center gap-1", className), children: [
     anchored && !disabled ? null : cellChips,
     disabled ? null : (
       // THE ONE "PICK OR ADD" BUILDER (lane CELL-EDITORS, 2026-10-06): the person list used to carry
@@ -8022,7 +8051,7 @@ function formatControl(args) {
 
 // src/typedDateHelper.tsx
 import { useState as useState28 } from "react";
-import { Popover as Popover5, PopoverContent as PopoverContent5, PopoverTrigger as PopoverTrigger5, cn as cn23 } from "@ai-matrx/design-system";
+import { Popover as Popover5, PopoverContent as PopoverContent5, PopoverTrigger as PopoverTrigger5, cn as cn24 } from "@ai-matrx/design-system";
 import { readTypedDate, readTypedTime, typedDateText, typedTimeText } from "@ai-matrx/records";
 import { jsx as jsx37, jsxs as jsxs35 } from "react/jsx-runtime";
 var WEEK = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"];
@@ -8147,7 +8176,7 @@ function TypedDateHelper({
                     type: "button",
                     ...keepFocus,
                     "data-records-date-helper-day": key,
-                    className: cn23(
+                    className: cn24(
                       "h-6 w-6 rounded tabular-nums hover:bg-muted",
                       key === held.day ? "bg-primary text-primary-foreground hover:bg-primary" : "",
                       key === todayKey && key !== held.day ? "ring-1 ring-ring" : ""
@@ -8166,7 +8195,7 @@ function TypedDateHelper({
               type: "button",
               ...keepFocus,
               "data-records-date-helper-time": `${pad(t.h)}:${pad(t.m)}`,
-              className: cn23(
+              className: cn24(
                 "whitespace-nowrap rounded px-2 py-0.5 text-left tabular-nums hover:bg-muted",
                 held.time && held.time.h === t.h && held.time.m === t.m ? "bg-primary text-primary-foreground" : ""
               ),
@@ -8955,7 +8984,7 @@ function OpenChoicePicker({
   const pickedOptions = current.map((v) => options.find((o) => isTheChosen(o, v)));
   const cellChips = pickedWords.map((word, i) => {
     const chip = chipOf(pickedOptions[i], word);
-    return /* @__PURE__ */ jsx38(Badge6, { variant: "outline", className: cn24("text-[11px]", chip.className), "data-records-choice-chip": "", children: word }, word);
+    return /* @__PURE__ */ jsx38(Badge6, { variant: "outline", className: cn25("text-[11px]", chip.className), "data-records-choice-chip": "", children: word }, word);
   });
   const headChips = pickedWords.map((word, i) => {
     const option = pickedOptions[i];
@@ -9028,7 +9057,7 @@ function RecordChip({
     // name. So it caps at its container and ends in an ellipsis with the whole name in
     // its tooltip, rather than being cut mid-word by whatever box it landed in
     // (lane FIX-14, 2026-09-22).
-    /* @__PURE__ */ jsxs36(Badge6, { variant: "secondary", className: cn24("max-w-full gap-1 text-[11px]", className), title, children: [
+    /* @__PURE__ */ jsxs36(Badge6, { variant: "secondary", className: cn25("max-w-full gap-1 text-[11px]", className), title, children: [
       /* @__PURE__ */ jsx38("span", { className: "min-w-0 truncate", children: title }),
       onRemove ? /* @__PURE__ */ jsx38("button", { type: "button", onClick: onRemove, "aria-label": `Remove ${title}`, className: "shrink-0 opacity-60 hover:opacity-100", children: "\xD7" }) : null
     ] })
@@ -9083,7 +9112,7 @@ function ChoiceAnswer({
         tabIndex: field.multi || choice.key === tabStop ? 0 : -1,
         onClick: () => press(choice),
         "data-records-choice-answer": choice.key,
-        className: cn24(
+        className: cn25(
           "flex min-h-11 w-full items-center gap-3 rounded-md border px-3 py-2 text-left text-base font-medium text-foreground transition-colors sm:min-h-10 sm:text-sm",
           chosen ? "border-primary bg-primary/10" : "border-primary/30 bg-primary/[0.03] hover:bg-primary/10"
         ),
@@ -9092,7 +9121,7 @@ function ChoiceAnswer({
             "kbd",
             {
               "aria-hidden": "true",
-              className: cn24(
+              className: cn25(
                 "inline-flex h-6 w-6 shrink-0 items-center justify-center rounded border font-sans text-xs font-semibold",
                 chosen ? "border-primary bg-primary text-primary-foreground" : "border-primary/40 text-primary"
               ),
@@ -9400,7 +9429,7 @@ function RecordPicker({ tableId, value, onChange, disabled }) {
 import { useEffect as useEffect23, useMemo as useMemo13 } from "react";
 import { isEntityReferenceConfig } from "@ai-matrx/records";
 import { useFields as useFields4, useTable as useTable3 } from "@ai-matrx/records/react";
-import { BasicInput as BasicInput12, Button as Button19, CreatablePicker as CreatablePicker2, cn as cn25 } from "@ai-matrx/design-system";
+import { BasicInput as BasicInput12, Button as Button19, CreatablePicker as CreatablePicker2, cn as cn26 } from "@ai-matrx/design-system";
 import { jsx as jsx41, jsxs as jsxs38 } from "react/jsx-runtime";
 var DATA_BINDING_SHAPES = [
   { value: "collection", label: "The whole table" },
@@ -9576,7 +9605,7 @@ function BindingDetails({
       /* @__PURE__ */ jsx41(
         "textarea",
         {
-          className: cn25(
+          className: cn26(
             "min-h-[3.5rem] w-full rounded-md border border-border bg-background px-2 py-1.5 font-mono text-xs"
           ),
           "aria-label": "Each row reads as",