@ai-matrx/content-ir-react 0.20.0 → 0.20.1

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # Changelog
 
+## 0.20.1 — 2026-10-02
+
+G9 leftovers (nightly clone). Guard: `__tests__/directive-card-g9.test.tsx` (3 red on 0.20.0).
+
+- **A button never wraps its label.** At 375px "Apply" broke to "Appl / y" beside
+  "Nothing to change". Apply, Run again, Retry, Details and Show more are `whitespace-nowrap`
+  (`shrink-0`); the header group wraps and the reason text is what wraps.
+- **A screen-reader label never names an id.** A record row's copy control read
+  "Task a8a00001". `DirectiveCopyProps.label` is now type-generic ("this task") and the new
+  `DirectiveCopyProps.record` ({ noun, id }) lets the host swap in the record's live name.
+
+### Consumer action
+
+- In `renderCopy`, when `props.record` is set, label the control with the record's live name
+  (the same one `renderRecord` shows), keeping `props.label` while it loads.
+
 ## 0.20.0 — 2026-10-02
 
 The G8A review of the action cards (nightly clone). Guard:

package/dist/{directive-host-B1hcjJxS.d.cts → directive-host-CtFMuSZc.d.cts}

@@ -121,7 +121,14 @@ interface DirectiveOpenItemOptions {
     total: number;
 }
 interface DirectiveCopyProps {
+    /**
+     * What the control is called to a screen reader. Never an id: for a record it
+     * is type-generic ("this task"); a host with the record's live name replaces
+     * it through `record`.
+     */
     label: string;
+    /** The existing record this control copies, when it copies one — to name it. */
+    record?: DirectiveRecordRef;
     /** The value to copy — the whole shell or one item. */
     value: unknown;
     /** The item's kind, when copying an item. */

package/dist/{directive-host-B1hcjJxS.d.ts → directive-host-CtFMuSZc.d.ts}

@@ -121,7 +121,14 @@ interface DirectiveOpenItemOptions {
     total: number;
 }
 interface DirectiveCopyProps {
+    /**
+     * What the control is called to a screen reader. Never an id: for a record it
+     * is type-generic ("this task"); a host with the record's live name replaces
+     * it through `record`.
+     */
     label: string;
+    /** The existing record this control copies, when it copies one — to name it. */
+    record?: DirectiveRecordRef;
     /** The value to copy — the whole shell or one item. */
     value: unknown;
     /** The item's kind, when copying an item. */

package/dist/directives.cjs

@@ -633,7 +633,7 @@ function ApplyDirectiveButton({
               type: "button",
               disabled: askingAgain,
               onClick: () => void handleApply(!bad),
-              className: "inline-flex items-center gap-1 rounded px-1 py-0.5 text-muted-foreground hover:bg-accent hover:text-accent-foreground disabled:opacity-50",
+              className: "inline-flex shrink-0 items-center gap-1 whitespace-nowrap rounded px-1 py-0.5 text-muted-foreground hover:bg-accent hover:text-accent-foreground disabled:opacity-50",
               "data-apply-action": bad ? "retry" : "run-again",
               children: [
                 /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(RotateCcwIcon, { className: "h-3 w-3" }),
@@ -673,8 +673,8 @@ function ApplyDirectiveButton({
   }
   const destructive = directive.directiveClass === "delete";
   const muted = nothingToChange && view.status === "idle";
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("span", { className: "inline-flex items-center gap-2", children: [
-    muted ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "text-xs text-muted-foreground", "data-apply-nothing": "", children: "Nothing to change" }) : null,
+  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: [
+    muted ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "min-w-0 text-xs text-muted-foreground", "data-apply-nothing": "", children: "Nothing to change" }) : null,
     /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
       "button",
       {
@@ -683,7 +683,7 @@ function ApplyDirectiveButton({
         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,
-        className: `inline-flex items-center gap-1 rounded-md border px-2 py-1 text-xs font-medium disabled:opacity-50 ${muted ? "border-border/60 bg-background text-muted-foreground hover:bg-accent" : destructive ? "border-destructive/50 bg-background text-destructive hover:bg-destructive/10" : "border-border bg-background hover:bg-accent"}`,
+        className: `inline-flex shrink-0 items-center gap-1 whitespace-nowrap rounded-md border px-2 py-1 text-xs font-medium disabled:opacity-50 ${muted ? "border-border/60 bg-background text-muted-foreground hover:bg-accent" : destructive ? "border-destructive/50 bg-background text-destructive hover:bg-destructive/10" : "border-border bg-background hover:bg-accent"}`,
         children: [
           view.status === "applying" ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(LoaderIcon, { className: "h-3.5 w-3.5 animate-spin" }) : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(PlayIcon, { className: "h-3.5 w-3.5" }),
           view.status === "applying" ? `Applying${itemCount ? ` ${itemCount} ${itemCount === 1 ? "item" : "items"}` : ""}\u2026${elapsed ? ` ${elapsed}s` : ""}` : label
@@ -734,7 +734,7 @@ function FailureNotice({
           type: "button",
           onClick: () => setOpen((v) => !v),
           "aria-expanded": open,
-          className: "ml-1 underline underline-offset-2 hover:no-underline",
+          className: "ml-1 whitespace-nowrap underline underline-offset-2 hover:no-underline",
           "data-apply-failure-details-toggle": true,
           children: open ? "Hide details" : "Details"
         }
@@ -888,7 +888,12 @@ function TargetRow({
   return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "py-1 text-xs", "data-directive-target": recordId, children: [
     /* @__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: fallback, value: item, size: "xs" })
+      host.renderCopy?.({
+        label: `this ${(0, import_content_ir3.nounLabel)(directive.noun, host.nouns).toLowerCase()}`,
+        value: item,
+        size: "xs",
+        record: { noun: directive.noun, id: recordId }
+      })
     ] }),
     isUpdate ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(DirectiveChangeList, { changes, className: "mt-0.5 px-1" }) : null
   ] });
@@ -916,7 +921,7 @@ function SideEffectDirectiveCard({ directive }) {
         " ",
         total === 1 ? "item" : "items"
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "ml-auto flex items-center gap-1", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "ml-auto flex min-w-0 flex-wrap items-center justify-end gap-1", children: [
         host.renderCopy?.({ label: display.title, value: directive.shell, size: "icon" }),
         /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
           ApplyDirectiveButton,
@@ -938,7 +943,7 @@ function SideEffectDirectiveCard({ directive }) {
       {
         type: "button",
         onClick: () => setExpanded((v) => !v),
-        className: "mt-0.5 inline-flex items-center gap-1 rounded px-1 py-0.5 text-[11px] text-muted-foreground hover:text-foreground",
+        className: "mt-0.5 inline-flex items-center gap-1 whitespace-nowrap rounded px-1 py-0.5 text-[11px] text-muted-foreground hover:text-foreground",
         children: [
           expanded ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(ChevronDownIcon, { className: "h-3 w-3" }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(ChevronRightIcon, { className: "h-3 w-3" }),
           expanded ? "Show less" : `Show ${hidden} more`