@ai-matrx/detail 0.1.177 → 0.1.178

package/dist/react.js

@@ -714,13 +714,9 @@ function DetailActions({ core, optional = "inline" }) {
 }
 
 // src/react/DetailBody.tsx
-import { useEffect as useEffect7, useRef as useRef6, useState as useState5 } from "react";
+import { lazy, Suspense, useEffect as useEffect7, useRef as useRef6, useState as useState5 } from "react";
 import { cn as cn3, ErrorActions as ErrorActions2, Skeleton } from "@ai-matrx/design-system";
-import {
-  ASSOCIATION_TARGET_TYPES,
-  isEntityTypeToken
-} from "@ai-matrx/associations";
-import { AssociationCardGrid, PrimaryEntityProvider } from "@ai-matrx/associations/react";
+import { ASSOCIATION_TARGET_TYPES } from "@ai-matrx/associations/contracts";
 import { formatDurationMs } from "@ai-matrx/kit/format";
 
 // src/format.ts
@@ -1161,18 +1157,28 @@ function LoadingFields({ core, label }) {
 function isAssociationTarget(token) {
   return ASSOCIATION_TARGET_TYPES.includes(token);
 }
+var loadDetailLinked = () => import("./DetailLinked-57SRZLYJ.js");
+var DetailLinked = lazy(loadDetailLinked);
 function AssociationsSection({ core }) {
   const host = useDetailHost();
   const token = core.entityToken;
   if (!token || !isAssociationTarget(token) || !host.associations.canAnchor(token)) return null;
   if (core.recordType?.associationTokens === null) return null;
-  const wanted = core.recordType?.associationTokens ?? host.associations.defaultTokens;
-  const tokens = wanted.filter((t) => t !== token).filter(isEntityTypeToken);
-  if (tokens.length === 0) return null;
-  return /* @__PURE__ */ jsxs3("section", { className: "space-y-2", "data-detail-section": "associations", children: [
-    /* @__PURE__ */ jsx3(SectionHeading, { icon: /* @__PURE__ */ jsx3(Link2Icon, { className: "h-3 w-3" }), children: "Linked" }),
-    /* @__PURE__ */ jsx3(PrimaryEntityProvider, { value: { type: token, id: core.ref.id, label: core.title }, children: /* @__PURE__ */ jsx3(AssociationCardGrid, { tokens }) })
-  ] });
+  const wanted = (core.recordType?.associationTokens ?? host.associations.defaultTokens).filter(
+    (t) => t !== token
+  );
+  if (wanted.length === 0) return null;
+  const heading = /* @__PURE__ */ jsx3(SectionHeading, { icon: /* @__PURE__ */ jsx3(Link2Icon, { className: "h-3 w-3" }), children: "Linked" });
+  return /* @__PURE__ */ jsx3(
+    Suspense,
+    {
+      fallback: /* @__PURE__ */ jsxs3("section", { className: "space-y-2", "data-detail-section": "associations", "aria-busy": "true", children: [
+        heading,
+        /* @__PURE__ */ jsx3(Skeleton, { className: "h-16 w-full" })
+      ] }),
+      children: /* @__PURE__ */ jsx3(DetailLinked, { token, id: core.ref.id, label: core.title, wanted, heading })
+    }
+  );
 }
 var ACTOR_COLUMNS = ["actor_id", "user_id", "person_id", "created_by_id"];
 function HistorySection({ core }) {
@@ -1257,6 +1263,9 @@ function CustomFieldsPort({ core }) {
   return /* @__PURE__ */ jsx3(Section, { token, id: core.ref.id });
 }
 function DetailBody({ core }) {
+  useEffect7(() => {
+    loadDetailLinked().catch(() => void 0);
+  }, []);
   const extra = core.recordType?.extraSections && core.frameCtx ? core.recordType.extraSections(core.row, core.frameCtx) : [];
   const Frame = core.recordType?.Frame ?? null;
   const body = (