@ai-matrx/content-ir-react 0.24.4 → 0.25.0

package/dist/react.js

@@ -80,7 +80,7 @@ function useContentIrKindVersion(kind, sources) {
 }
 
 // react/KindInstanceRender.tsx
-import { useEffect as useEffect3, useState as useState4 } from "react";
+import { useEffect as useEffect4, useState as useState4 } from "react";
 import {
   envelopeFromCompleteValue as envelopeFromCompleteValue2,
   IR_ENVELOPE_KEY,
@@ -182,6 +182,9 @@ function itemChanges(item, current, options = {}) {
   }
   return out;
 }
+function changesNothing(changes) {
+  return changes.every((change) => change.same === true);
+}
 
 // directives/record-values.ts
 import { useEffect, useState, useSyncExternalStore as useSyncExternalStore2 } from "react";
@@ -690,7 +693,7 @@ function ApplyDirectiveButton({
         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,
+        title: muted ? "Applying it changes nothing." : void 0,
         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__ */ jsx4(LoaderIcon, { className: "h-3.5 w-3.5 animate-spin" }) : /* @__PURE__ */ jsx4(PlayIcon, { className: "h-3.5 w-3.5" }),
@@ -840,7 +843,7 @@ function getDirectiveRenderer(directive) {
 }
 
 // directives/SideEffectDirectiveCard.tsx
-import { useState as useState3 } from "react";
+import { useEffect as useEffect3, useState as useState3 } from "react";
 import {
   asKindInstance,
   directiveDisplay as directiveDisplay3,
@@ -864,12 +867,23 @@ function ItemRow({
   item,
   index,
   total,
-  phase
+  phase,
+  onNothing
 }) {
   const host = useDirectiveHost();
   const recordId = TARGETING_CLASSES.has(directive.directiveClass) ? itemRecordId(item) : null;
   if (recordId) {
-    return /* @__PURE__ */ jsx7(TargetRow, { directive, item, recordId, index, phase });
+    return /* @__PURE__ */ jsx7(
+      TargetRow,
+      {
+        directive,
+        item,
+        recordId,
+        index,
+        phase,
+        onNothing
+      }
+    );
   }
   const titleColumn = nounTitleColumn(directive.noun, host.nouns);
   const ownName = itemOwnName(item, titleColumn);
@@ -888,7 +902,8 @@ function ItemRow({
     /* @__PURE__ */ jsx7(
       "span",
       {
-        className: `min-w-0 shrink-0 truncate font-medium ${ownName ? "text-foreground" : "italic text-muted-foreground"}`,
+        className: `min-w-0 line-clamp-2 font-medium [overflow-wrap:anywhere] sm:shrink-0 sm:truncate ${ownName ? "text-foreground" : "italic text-muted-foreground"}`,
+        "data-item-name": "",
         "data-item-untitled": ownName ? void 0 : "",
         children: title
       }
@@ -977,7 +992,8 @@ function TargetRow({
   item,
   recordId,
   index,
-  phase
+  phase,
+  onNothing
 }) {
   const host = useDirectiveHost();
   const fallback = recordFallbackName(nounLabel2(directive.noun, host.nouns));
@@ -992,7 +1008,11 @@ function TargetRow({
     titleColumn: 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__ */ jsx7("span", { className: "truncate font-medium text-foreground", children: fallback });
+  const nothing = readsLive && live.values !== null && changesNothing(changes);
+  useEffect3(() => {
+    onNothing?.(index, nothing);
+  }, [onNothing, index, nothing]);
+  const name = host.renderRecord ? host.renderRecord({ noun: directive.noun, id: recordId, fallback, context: "row" }) : /* @__PURE__ */ jsx7("span", { className: "line-clamp-2 min-w-0 font-medium text-foreground [overflow-wrap:anywhere]", children: fallback });
   return /* @__PURE__ */ jsxs5("div", { className: "py-1 text-xs", "data-directive-target": recordId, children: [
     /* @__PURE__ */ jsxs5("div", { className: "flex min-w-0 items-center gap-2", children: [
       /* @__PURE__ */ jsx7("span", { className: "flex min-w-0 flex-1 items-center gap-1 px-1", children: name }),
@@ -1016,7 +1036,9 @@ function SideEffectDirectiveCard({ directive }) {
   const [phase, setPhase] = useState3(
     () => readsApplyLedger(host, directive) ? { phase: "pending" } : { phase: "open" }
   );
-  const nothingToChange = directive.directiveClass === "update" && total > 0 && items.every((item) => itemChanges(item).length === 0);
+  const [nothingAt, setNothingAt] = useState3({});
+  const noteNothing = (index, nothing) => setNothingAt((prev) => prev[index] === nothing ? prev : { ...prev, [index]: nothing });
+  const nothingToChange = directive.directiveClass === "update" && total > 0 && items.every((item, index) => itemChanges(item).length === 0 || nothingAt[index] === true);
   const shown = expanded ? items : items.slice(0, ROWS_BEFORE_FOLD);
   const hidden = total - shown.length;
   return /* @__PURE__ */ jsxs5("div", { className: "my-3 rounded-md border border-border bg-card px-2.5 py-1.5", "data-directive": directive.slug, children: [
@@ -1045,7 +1067,18 @@ function SideEffectDirectiveCard({ directive }) {
     total === 0 ? (
       // Stated, never silent: an empty batch is a real (and suspicious) state.
       /* @__PURE__ */ jsx7("p", { className: "mt-1 text-xs text-muted-foreground", children: "No items \u2014 nothing would be written." })
-    ) : /* @__PURE__ */ jsx7("div", { className: "mt-0.5 divide-y divide-border/60", children: shown.map((item, i) => /* @__PURE__ */ jsx7(ItemRow, { directive, item, index: i, total, phase }, i)) }),
+    ) : /* @__PURE__ */ jsx7("div", { className: "mt-0.5 divide-y divide-border/60", children: shown.map((item, i) => /* @__PURE__ */ jsx7(
+      ItemRow,
+      {
+        directive,
+        item,
+        index: i,
+        total,
+        phase,
+        onNothing: noteNothing
+      },
+      i
+    )) }),
     hidden > 0 || expanded ? /* @__PURE__ */ jsxs5(
       "button",
       {
@@ -1161,7 +1194,7 @@ function KindInstanceRenderInner({
   const [routingStatus, setRoutingStatus] = useState4(
     () => kindIsRoutable(kind, host) ? "routable" : "checking"
   );
-  useEffect3(() => {
+  useEffect4(() => {
     let cancelled = false;
     let warmed = false;
     const syncRoutingStatus = () => {