@ai-matrx/content-ir-react 0.20.2 → 0.21.0

package/CHANGELOG.md

@@ -1,5 +1,28 @@
 # Changelog
 
+## 0.21.0 — 2026-10-02
+
+The G10B review of the action cards (nightly clone). Guard:
+`__tests__/directive-card-g10b.test.tsx` (5 red on 0.20.2).
+
+- **A nameless new item says so.** New `itemOwnName(item, titleColumn)` — the item's own
+  name, or null — and `NO_TITLE_WORD`. A create card whose title is empty reads "No title"
+  (muted), never "Item"; its copy control says "this Task". One rule for the card and a
+  host's confirm.
+- **A record's id is never shown.** `recordFallbackName(nounLabel)` — the name used when a
+  record's own cannot be read — is the record's type ("Task"), never "Task a8a00001". It no
+  longer takes an id. A link to a missing record hovered "Open Task a8a00001".
+- **The confirm opens with the record in hand.** Pointing at or focusing Apply on an update
+  or delete card calls `DirectiveHost.readRecord` for each target, so a host that keeps a
+  recent read answers the confirm's read without a second round trip.
+
+### Consumer action
+
+- Drop the second argument from any `recordFallbackName(label, id)` call.
+- Name a new item in your confirm through `itemOwnName` (null → say it has no title).
+- Keep a short-lived copy of a finished `readRecord` read (keyed by `recordRevision(id)`),
+  so the hover warm-up reaches the confirm.
+
 ## 0.20.2
 
 Automatic changed-only republish (docs/metadata drift since the last tag — see

package/dist/directives.cjs

@@ -30,6 +30,7 @@ __export(directives_exports, {
   DirectiveRender: () => DirectiveRender,
   DirectiveScopeProvider: () => DirectiveScopeProvider,
   EMPTY_VALUE_WORD: () => EMPTY_VALUE_WORD,
+  NO_TITLE_WORD: () => NO_TITLE_WORD,
   SideEffectDirectiveCard: () => SideEffectDirectiveCard,
   TARGETING_CLASSES: () => TARGETING_CLASSES,
   defaultFailureWords: () => defaultFailureWords,
@@ -40,6 +41,7 @@ __export(directives_exports, {
   fieldLabel: () => fieldLabel,
   getDirectiveRenderer: () => getDirectiveRenderer,
   itemChanges: () => itemChanges,
+  itemOwnName: () => itemOwnName,
   itemRecordId: () => itemRecordId,
   noteRecordChanged: () => noteRecordChanged,
   provisionalDirectiveSlug: () => provisionalDirectiveSlug,
@@ -98,11 +100,11 @@ function resetDirectiveRenderers() {
 
 // directives/ApplyDirectiveButton.tsx
 var import_react3 = require("react");
-var import_content_ir2 = require("@ai-matrx/content-ir");
+var import_content_ir3 = require("@ai-matrx/content-ir");
 
 // directives/item-changes.ts
-var import_uuid = require("@ai-matrx/kit/uuid");
 var import_text_case = require("@ai-matrx/kit/text-case");
+var import_content_ir2 = require("@ai-matrx/content-ir");
 var TARGETING_CLASSES = /* @__PURE__ */ new Set(["update", "delete"]);
 var NOT_A_CHANGE = /* @__PURE__ */ new Set(["__kind", "id"]);
 var CHANGE_VALUE_MAX = 280;
@@ -118,10 +120,14 @@ function fieldLabel(key) {
 function directiveFieldLabel(key, titleColumn) {
   return titleColumn && key === titleColumn ? "Title" : fieldLabel(key);
 }
+function itemOwnName(item, titleColumn) {
+  const probe = (0, import_content_ir2.itemTitle)(item, titleColumn, 0, 2);
+  return probe === "Item 1 of 2" ? null : probe;
+}
+var NO_TITLE_WORD = "No title";
 var EMPTY_VALUE_WORD = "None";
-function recordFallbackName(nounLabel3, id) {
-  const short = (0, import_uuid.isUuidShape)(id) ? id.slice(0, 8) : id.length > 12 ? `${id.slice(0, 12)}\u2026` : id;
-  return `${nounLabel3} ${short}`;
+function recordFallbackName(nounLabel3) {
+  return nounLabel3.trim() || "Record";
 }
 function describeChangeValue(value, word) {
   return describeValue(value, word);
@@ -443,7 +449,7 @@ function ApplyDirectiveButton({
   (0, import_react3.useEffect)(() => {
     currentIdentity.current = identity;
   }, [identity]);
-  const nounText = (0, import_content_ir2.nounLabel)(directive.noun, host.nouns);
+  const nounText = (0, import_content_ir3.nounLabel)(directive.noun, host.nouns);
   const shellKey = readsLedger ? JSON.stringify([directive.slug, items, conversationId ?? null]) : "";
   const read = host.applyState;
   const report = host.reportError;
@@ -623,7 +629,7 @@ function ApplyDirectiveButton({
           ) : null,
           records.map((record) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "inline-flex min-w-0 items-center", children: host.renderRecord?.({
             ...record,
-            fallback: recordFallbackName(label2, record.id),
+            fallback: recordFallbackName(label2),
             context: "applied",
             trashed
           }) }, `${record.noun}:${record.id}`)),
@@ -671,6 +677,14 @@ function ApplyDirectiveButton({
       }
     );
   }
+  const warm = () => {
+    const read2 = host.readRecord;
+    if (!read2 || !TARGETING_CLASSES.has(directive.directiveClass)) return;
+    for (const item of items) {
+      const id = itemRecordId(item);
+      if (id) void read2({ noun: directive.noun, id }).catch(() => null);
+    }
+  };
   const destructive = directive.directiveClass === "delete";
   const muted = nothingToChange && view.status === "idle";
   return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("span", { className: "flex min-w-0 flex-wrap items-center justify-end gap-x-2 gap-y-1", children: [
@@ -680,6 +694,8 @@ function ApplyDirectiveButton({
       {
         type: "button",
         onClick: () => void handleApply(),
+        onPointerEnter: warm,
+        onFocus: warm,
         disabled: view.status === "applying" || view.status === "asking" || items.length === 0,
         "data-apply-tone": muted ? "muted" : destructive ? "destructive" : "default",
         title: muted ? "It sets no fields, so applying it changes nothing." : void 0,
@@ -753,7 +769,7 @@ function FailureNotice({
 
 // directives/SideEffectDirectiveCard.tsx
 var import_react4 = require("react");
-var import_content_ir3 = require("@ai-matrx/content-ir");
+var import_content_ir4 = require("@ai-matrx/content-ir");
 var import_jsx_runtime4 = require("react/jsx-runtime");
 function directiveValueWord(host, noun) {
   const valueLabel = host.valueLabel;
@@ -776,20 +792,28 @@ function ItemRow({
   if (recordId) {
     return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(TargetRow, { directive, item, recordId, index, phase });
   }
-  const titleColumn = (0, import_content_ir3.nounTitleColumn)(directive.noun, host.nouns);
-  const title = (0, import_content_ir3.itemTitle)(item, titleColumn, index, total);
-  const subtitle = (0, import_content_ir3.itemSubtitle)(item);
+  const titleColumn = (0, import_content_ir4.nounTitleColumn)(directive.noun, host.nouns);
+  const ownName = itemOwnName(item, titleColumn);
+  const title = ownName ?? NO_TITLE_WORD;
+  const subtitle = (0, import_content_ir4.itemSubtitle)(item);
   const valueWord = directiveValueWord(host, directive.noun);
-  const facts = (0, import_content_ir3.itemFacts)(titleColumn ? omitKey(item, titleColumn) : item).map((fact) => ({
+  const facts = (0, import_content_ir4.itemFacts)(titleColumn ? omitKey(item, titleColumn) : item).map((fact) => ({
     ...fact,
     label: directiveFieldLabel(fact.key, titleColumn),
     value: valueWord?.(fact.key, fact.value) ?? fact.value
   }));
   const kind = host.itemKind?.(directive.slug) ?? null;
-  const display = (0, import_content_ir3.directiveDisplay)(directive.directiveClass, directive.noun, host.nouns);
+  const display = (0, import_content_ir4.directiveDisplay)(directive.directiveClass, directive.noun, host.nouns);
   const openItem = host.openItem;
   const body = /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "min-w-0 shrink-0 truncate font-medium text-foreground", children: title }),
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+      "span",
+      {
+        className: `min-w-0 shrink-0 truncate font-medium ${ownName ? "text-foreground" : "italic text-muted-foreground"}`,
+        "data-item-untitled": ownName ? void 0 : "",
+        children: title
+      }
+    ),
     /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "hidden min-w-0 flex-1 items-baseline gap-2 overflow-hidden sm:flex", children: facts.map((fact) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("span", { className: "truncate text-[11px] text-muted-foreground", "data-item-fact": fact.key, children: [
       fact.label,
       " ",
@@ -805,7 +829,7 @@ function ItemRow({
         type: "button",
         onClick: () => openItem({
           // Stamped so the panel's kind pipeline types it from its own first key.
-          item: (0, import_content_ir3.asKindInstance)(item, kind) ?? item,
+          item: (0, import_content_ir4.asKindInstance)(item, kind) ?? item,
           itemKind: kind,
           title,
           subtitle: `${display.title} \xB7 item ${index + 1} of ${total}`,
@@ -818,7 +842,12 @@ function ItemRow({
         children: body
       }
     ) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "flex min-w-0 flex-1 items-center gap-2 px-1 py-0.5", children: body }),
-    host.renderCopy?.({ label: title, value: item, kind, size: "xs" })
+    host.renderCopy?.({
+      label: ownName ?? `this ${(0, import_content_ir4.nounLabel)(directive.noun, host.nouns)}`,
+      value: item,
+      kind,
+      size: "xs"
+    })
   ] });
 }
 function DirectiveChangeList({
@@ -872,7 +901,7 @@ function TargetRow({
   phase
 }) {
   const host = useDirectiveHost();
-  const fallback = recordFallbackName((0, import_content_ir3.nounLabel)(directive.noun, host.nouns), recordId);
+  const fallback = recordFallbackName((0, import_content_ir4.nounLabel)(directive.noun, host.nouns));
   const isUpdate = directive.directiveClass === "update";
   const readsLive = isUpdate && phase.phase === "open";
   const live = useRecordValues(
@@ -881,7 +910,7 @@ function TargetRow({
   );
   const compareTo = phase.phase === "applied" ? phase.before?.[index] ?? null : readsLive ? live.values : null;
   const changes = isUpdate ? itemChanges(item, compareTo, {
-    titleColumn: (0, import_content_ir3.nounTitleColumn)(directive.noun, host.nouns),
+    titleColumn: (0, import_content_ir4.nounTitleColumn)(directive.noun, host.nouns),
     valueWord: directiveValueWord(host, directive.noun)
   }) : [];
   const name = host.renderRecord ? host.renderRecord({ noun: directive.noun, id: recordId, fallback, context: "row" }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "truncate font-medium text-foreground", children: fallback });
@@ -889,7 +918,7 @@ function TargetRow({
     /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex min-w-0 items-center gap-2", children: [
       /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "flex min-w-0 flex-1 items-center gap-1 px-1", children: name }),
       host.renderCopy?.({
-        label: `this ${(0, import_content_ir3.nounLabel)(directive.noun, host.nouns).toLowerCase()}`,
+        label: `this ${(0, import_content_ir4.nounLabel)(directive.noun, host.nouns).toLowerCase()}`,
         value: item,
         size: "xs",
         record: { noun: directive.noun, id: recordId }
@@ -903,7 +932,7 @@ function SideEffectDirectiveCard({ directive }) {
   const [expanded, setExpanded] = (0, import_react4.useState)(false);
   const items = directive.items;
   const total = items.length;
-  const display = (0, import_content_ir3.directiveDisplay)(directive.directiveClass, directive.noun, host.nouns);
+  const display = (0, import_content_ir4.directiveDisplay)(directive.directiveClass, directive.noun, host.nouns);
   const Icon = classIcon(directive.directiveClass, directive.noun);
   const [phase, setPhase] = (0, import_react4.useState)(
     () => readsApplyLedger(host, directive) ? { phase: "pending" } : { phase: "open" }
@@ -954,12 +983,12 @@ function SideEffectDirectiveCard({ directive }) {
 }
 
 // directives/DirectiveFallbackCard.tsx
-var import_content_ir4 = require("@ai-matrx/content-ir");
+var import_content_ir5 = require("@ai-matrx/content-ir");
 var import_jsx_runtime5 = require("react/jsx-runtime");
 function DirectiveFallbackCard({ directive, reason }) {
   const host = useDirectiveHost();
   const count = directive.items.length;
-  const display = (0, import_content_ir4.directiveDisplay)(directive.directiveClass, directive.noun, host.nouns);
+  const display = (0, import_content_ir5.directiveDisplay)(directive.directiveClass, directive.noun, host.nouns);
   return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "my-3 inline-flex flex-wrap items-center gap-2 rounded-md border border-border bg-muted px-2.5 py-1 text-sm", children: [
     /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(BoxesIcon, { className: "h-3.5 w-3.5 shrink-0 text-muted-foreground" }),
     /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "text-foreground", children: display.title }),
@@ -982,7 +1011,7 @@ function DirectiveFallbackCard({ directive, reason }) {
 }
 
 // directives/DirectiveProvisionalCard.tsx
-var import_content_ir5 = require("@ai-matrx/content-ir");
+var import_content_ir6 = require("@ai-matrx/content-ir");
 var import_jsx_runtime6 = require("react/jsx-runtime");
 var COMPLETE_SLUG_RE = /^\{\s*"__kind"\s*:\s*"([^"]+)"/;
 function provisionalDirectiveSlug(content) {
@@ -992,8 +1021,8 @@ function provisionalDirectiveSlug(content) {
 function DirectiveProvisionalCard({ content, streaming, className }) {
   const host = useDirectiveHost();
   const slug = provisionalDirectiveSlug(content);
-  const known = slug ? (0, import_content_ir5.parseDirectiveSlug)(slug) : null;
-  const display = known ? (0, import_content_ir5.directiveDisplay)(known.directiveClass, known.noun, host.nouns) : null;
+  const known = slug ? (0, import_content_ir6.parseDirectiveSlug)(slug) : null;
+  const display = known ? (0, import_content_ir6.directiveDisplay)(known.directiveClass, known.noun, host.nouns) : null;
   const Icon = known ? classIcon(known.directiveClass, known.noun) : BoxesIcon;
   const title = display?.title ?? "Structured action";
   return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
@@ -1022,7 +1051,7 @@ function DirectiveProvisionalCard({ content, streaming, className }) {
 }
 
 // directives/DirectiveRender.tsx
-var import_content_ir6 = require("@ai-matrx/content-ir");
+var import_content_ir7 = require("@ai-matrx/content-ir");
 var import_jsx_runtime7 = require("react/jsx-runtime");
 function isWholeJson(content) {
   try {
@@ -1038,13 +1067,13 @@ function DirectiveRender({ conversationId, ...props }) {
 }
 function DirectiveRenderInner({ content, className, streaming }) {
   const host = useDirectiveHost();
-  const directive = (0, import_content_ir6.tryDecodeDirectiveContent)(content, (message) => {
+  const directive = (0, import_content_ir7.tryDecodeDirectiveContent)(content, (message) => {
     const line = `[kind-directives] ${message}`;
     if (host.reportError) host.reportError(line);
     else console.error(line);
   });
   if (!directive) {
-    if (typeof content === "string" && (0, import_content_ir6.looksLikeDirectiveHead)(content) && !isWholeJson(content)) {
+    if (typeof content === "string" && (0, import_content_ir7.looksLikeDirectiveHead)(content) && !isWholeJson(content)) {
       return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(DirectiveProvisionalCard, { content, streaming: streaming !== false, className });
     }
     const raw = typeof content === "string" ? content : JSON.stringify(content, null, 2);