@ai-matrx/detail 0.1.67 → 0.1.69

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # Changelog — @ai-matrx/detail
 
+## 0.1.69
+### A shell with its own menu gets the actions as data
+
+- `DetailShellSlots.menuActions: DetailMenuAction[]` (open as window / docked / page, copy record id — the overflow menu's entries as `{ id, label, onSelect }`) and `DetailShellSlots.navActions` (previous / next only). `DetailActions` takes `optional="none"`; `useDetailMenuActions(core)` is exported.
+- Why: a record open as a canvas tab drew "More record actions" (…) beside the pane's own menu (⋮). A shell whose chrome has a menu offers `menuActions` there and renders `navActions`.
+- Consumer action: a custom shell keeps working (`actions` is unchanged); one with its own menu may switch to `navActions` + `menuActions`.
+
+## 0.1.68
+### Custom fields on every record view (lane 7 STANDARD-TABLES W5)
+
+- `DetailHostPorts.customFields?: { Section: ComponentType<{ token; id }> }` — the host binds the
+  organization's custom-fields section once; `DetailBody` renders it after Fields for every record
+  with an `entityToken` (window, docked, page, and a peek that renders the body).
+- Consumer action: bind `customFields.Section` in the host (matrx-frontend `DetailHost.tsx`). Optional;
+  an unbound host shows no section.
+
 ## 0.1.67
 
 Automatic changed-only republish (docs/metadata drift since the last tag — see

package/dist/{host-DdaWXBin.d.cts → host-DrnEXBfp.d.cts}

@@ -272,6 +272,12 @@ interface DetailHistoryEntry {
 }
 
 /** Props every shell receives; the package fills the slots, the host owns the chrome. */
+/** One of the record's optional controls as data (a shell's menu draws it). */
+interface DetailMenuAction {
+    readonly id: string;
+    readonly label: string;
+    readonly onSelect: () => void;
+}
 interface DetailShellSlots {
     /** Accessible plain-text title (window chrome, drawer title, document title). */
     title: string;
@@ -279,6 +285,13 @@ interface DetailShellSlots {
     titleNode: ReactNode;
     /** Presentation switcher · previous / next · copy id. Compact. */
     actions: ReactNode;
+    /**
+     * Previous / next only — for a shell whose chrome has its OWN menu: it puts
+     * `menuActions` there instead of a second overflow button ("…" beside "⋮").
+     */
+    navActions: ReactNode;
+    /** The optional controls (open as window / docked / page, copy id) as data, for a shell's own menu. */
+    menuActions: readonly DetailMenuAction[];
     children: ReactNode;
     onClose: () => void;
 }
@@ -475,6 +488,23 @@ interface DetailHostPorts {
             row: DetailRow | null;
         }>;
     };
+    /**
+     * 🚨 CUSTOM FIELDS ON EVERY RECORD VIEW (lane 7 STANDARD-TABLES W5). The ONE
+     * place a window, a docked panel, the `/detail` page and a record peek get the
+     * organization's own fields for a standard record: the host binds its section
+     * once, and the body renders it after Fields whenever the record has an
+     * `entityToken`. The section is given only the token and the id — it reads the
+     * row's organization itself (never the active organization) and says in one
+     * line why it shows nothing, so it is never silently absent. A peek binds a
+     * compact section through a nested provider (providers merge). Optional: a
+     * host without custom fields binds nothing and the section is absent.
+     */
+    customFields?: {
+        Section: ComponentType<{
+            token: string;
+            id: string;
+        }>;
+    };
     notify: {
         error: (message: string) => void;
         success: (message: string) => void;
@@ -521,4 +551,4 @@ declare function requireResolveType(host: DetailHostPorts): NonNullable<DetailHo
 /** A presentation's shell, or an error naming which entry forgot to bind it. */
 declare function requireShell<K extends keyof DetailShells>(shells: DetailShells, which: K): NonNullable<DetailShells[K]>;
 
-export { type DetailRef as D, type DetailInstanceData as a, type DetailPresentation as b, type DetailRecordType as c, type DetailStatus as d, type DetailRow as e, type DetailField as f, type DetailSourceHealth as g, type DetailFrameContext as h, type DetailListContext as i, type DetailLoadState as j, type DetailOpenRequest as k, type DetailDockedShellProps as l, type DetailEffectivePresentation as m, type DetailHostPorts as n, DetailHostProvider as o, type DetailPageShellProps as p, type DetailPresentationSetting as q, type DetailShellSlots as r, type DetailShells as s, type DetailWindowShellProps as t, requireResolveType as u, requireShell as v, useDetailHost as w };
+export { type DetailRef as D, type DetailInstanceData as a, type DetailPresentation as b, type DetailRecordType as c, type DetailStatus as d, type DetailRow as e, type DetailField as f, type DetailSourceHealth as g, type DetailFrameContext as h, type DetailListContext as i, type DetailLoadState as j, type DetailOpenRequest as k, type DetailMenuAction as l, type DetailDockedShellProps as m, type DetailEffectivePresentation as n, type DetailHostPorts as o, DetailHostProvider as p, type DetailPageShellProps as q, type DetailPresentationSetting as r, type DetailShellSlots as s, type DetailShells as t, type DetailWindowShellProps as u, requireResolveType as v, requireShell as w, useDetailHost as x };

package/dist/{host-DdaWXBin.d.ts → host-DrnEXBfp.d.ts}

@@ -272,6 +272,12 @@ interface DetailHistoryEntry {
 }
 
 /** Props every shell receives; the package fills the slots, the host owns the chrome. */
+/** One of the record's optional controls as data (a shell's menu draws it). */
+interface DetailMenuAction {
+    readonly id: string;
+    readonly label: string;
+    readonly onSelect: () => void;
+}
 interface DetailShellSlots {
     /** Accessible plain-text title (window chrome, drawer title, document title). */
     title: string;
@@ -279,6 +285,13 @@ interface DetailShellSlots {
     titleNode: ReactNode;
     /** Presentation switcher · previous / next · copy id. Compact. */
     actions: ReactNode;
+    /**
+     * Previous / next only — for a shell whose chrome has its OWN menu: it puts
+     * `menuActions` there instead of a second overflow button ("…" beside "⋮").
+     */
+    navActions: ReactNode;
+    /** The optional controls (open as window / docked / page, copy id) as data, for a shell's own menu. */
+    menuActions: readonly DetailMenuAction[];
     children: ReactNode;
     onClose: () => void;
 }
@@ -475,6 +488,23 @@ interface DetailHostPorts {
             row: DetailRow | null;
         }>;
     };
+    /**
+     * 🚨 CUSTOM FIELDS ON EVERY RECORD VIEW (lane 7 STANDARD-TABLES W5). The ONE
+     * place a window, a docked panel, the `/detail` page and a record peek get the
+     * organization's own fields for a standard record: the host binds its section
+     * once, and the body renders it after Fields whenever the record has an
+     * `entityToken`. The section is given only the token and the id — it reads the
+     * row's organization itself (never the active organization) and says in one
+     * line why it shows nothing, so it is never silently absent. A peek binds a
+     * compact section through a nested provider (providers merge). Optional: a
+     * host without custom fields binds nothing and the section is absent.
+     */
+    customFields?: {
+        Section: ComponentType<{
+            token: string;
+            id: string;
+        }>;
+    };
     notify: {
         error: (message: string) => void;
         success: (message: string) => void;
@@ -521,4 +551,4 @@ declare function requireResolveType(host: DetailHostPorts): NonNullable<DetailHo
 /** A presentation's shell, or an error naming which entry forgot to bind it. */
 declare function requireShell<K extends keyof DetailShells>(shells: DetailShells, which: K): NonNullable<DetailShells[K]>;
 
-export { type DetailRef as D, type DetailInstanceData as a, type DetailPresentation as b, type DetailRecordType as c, type DetailStatus as d, type DetailRow as e, type DetailField as f, type DetailSourceHealth as g, type DetailFrameContext as h, type DetailListContext as i, type DetailLoadState as j, type DetailOpenRequest as k, type DetailDockedShellProps as l, type DetailEffectivePresentation as m, type DetailHostPorts as n, DetailHostProvider as o, type DetailPageShellProps as p, type DetailPresentationSetting as q, type DetailShellSlots as r, type DetailShells as s, type DetailWindowShellProps as t, requireResolveType as u, requireShell as v, useDetailHost as w };
+export { type DetailRef as D, type DetailInstanceData as a, type DetailPresentation as b, type DetailRecordType as c, type DetailStatus as d, type DetailRow as e, type DetailField as f, type DetailSourceHealth as g, type DetailFrameContext as h, type DetailListContext as i, type DetailLoadState as j, type DetailOpenRequest as k, type DetailMenuAction as l, type DetailDockedShellProps as m, type DetailEffectivePresentation as n, type DetailHostPorts as o, DetailHostProvider as p, type DetailPageShellProps as q, type DetailPresentationSetting as r, type DetailShellSlots as s, type DetailShells as t, type DetailWindowShellProps as u, requireResolveType as v, requireShell as w, useDetailHost as x };

package/dist/react.cjs

@@ -40,6 +40,7 @@ __export(react_exports, {
   useDetailHealth: () => useDetailHealth,
   useDetailHost: () => useDetailHost,
   useDetailKeyboard: () => useDetailKeyboard,
+  useDetailMenuActions: () => useDetailMenuActions,
   useDetailRecord: () => useDetailRecord,
   useOpenDetail: () => useOpenDetail
 });
@@ -759,7 +760,27 @@ function DetailRecordMeta({ core }) {
     }
   );
 }
-function DetailActions({ core }) {
+function useDetailMenuActions(core) {
+  const host = useDetailHost();
+  return [
+    ...PRESENTATIONS.filter((p) => p.value !== core.presentation).map(({ value, label }) => ({
+      id: `detail-open-${value}`,
+      label,
+      onSelect: () => core.switchTo(value)
+    })),
+    {
+      id: "detail-copy-id",
+      label: "Copy record id",
+      onSelect: () => {
+        void host.copyText(core.ref.id).then((ok) => {
+          if (ok) host.notify.success("Record id copied");
+          else host.notify.error("Could not copy the record id to the clipboard.");
+        });
+      }
+    }
+  ];
+}
+function DetailActions({ core, optional = "inline" }) {
   const host = useDetailHost();
   const [copied, setCopied] = (0, import_react7.useState)(false);
   const [menuOpen, setMenuOpen] = (0, import_react7.useState)(false);
@@ -824,98 +845,100 @@ function DetailActions({ core }) {
       ),
       /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "mx-1 h-4 w-px bg-border", "aria-hidden": true })
     ] }) : null,
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
-      "span",
-      {
-        className: "flex items-center gap-0.5 @max-[26rem]/window-header:hidden",
-        "data-detail-actions-collapsible": true,
-        children: [
-          others.map(({ value, label, Icon }) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-            "button",
-            {
-              type: "button",
-              className: ICON_BUTTON,
-              onClick: () => core.switchTo(value),
-              "aria-label": label,
-              title: label,
-              children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Icon, { className: "h-4 w-4" })
-            },
-            value
-          )),
-          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-            "button",
-            {
-              type: "button",
-              onClick: () => void copyId(),
-              className: ICON_BUTTON,
-              "aria-label": "Copy record id",
-              title: "Copy record id",
-              "data-detail-copy-id": true,
-              children: copied ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(CheckIcon, { className: "h-3.5 w-3.5 text-primary" }) : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(CopyIcon, { className: "h-3.5 w-3.5" })
-            }
-          )
-        ]
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("span", { className: "relative hidden @max-[26rem]/window-header:inline-flex", ref: menuRef, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-        "button",
+    optional === "none" ? null : /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+        "span",
         {
-          type: "button",
-          className: (0, import_design_system.cn)(ICON_BUTTON, "hidden @max-[26rem]/window-header:inline-flex"),
-          onClick: () => setMenuOpen((wasOpen) => !wasOpen),
-          "aria-label": "More record actions",
-          title: "More record actions",
-          "aria-haspopup": "menu",
-          "aria-expanded": menuOpen,
-          "data-detail-actions-overflow": true,
-          children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(MoreHorizontalIcon, { className: "h-4 w-4" })
-        }
-      ),
-      menuOpen ? /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
-        "div",
-        {
-          role: "menu",
-          "aria-label": "Record actions",
-          className: "absolute right-0 top-full z-50 mt-1 min-w-44 rounded-md border border-border bg-card p-1 shadow-md",
-          "data-detail-actions-menu": true,
+          className: "flex items-center gap-0.5 @max-[26rem]/window-header:hidden",
+          "data-detail-actions-collapsible": true,
           children: [
-            others.map(({ value, label, Icon }) => /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+            others.map(({ value, label, Icon }) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
               "button",
               {
                 type: "button",
-                role: "menuitem",
-                className: MENU_ITEM,
-                onClick: () => {
-                  setMenuOpen(false);
-                  core.switchTo(value);
-                },
-                children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Icon, { className: "h-3.5 w-3.5 shrink-0" }),
-                  label
-                ]
+                className: ICON_BUTTON,
+                onClick: () => core.switchTo(value),
+                "aria-label": label,
+                title: label,
+                children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Icon, { className: "h-4 w-4" })
               },
               value
             )),
-            /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
               "button",
               {
                 type: "button",
-                role: "menuitem",
-                className: MENU_ITEM,
-                onClick: () => {
-                  setMenuOpen(false);
-                  void copyId();
-                },
-                children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(CopyIcon, { className: "h-3.5 w-3.5 shrink-0" }),
-                  "Copy record id"
-                ]
+                onClick: () => void copyId(),
+                className: ICON_BUTTON,
+                "aria-label": "Copy record id",
+                title: "Copy record id",
+                "data-detail-copy-id": true,
+                children: copied ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(CheckIcon, { className: "h-3.5 w-3.5 text-primary" }) : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(CopyIcon, { className: "h-3.5 w-3.5" })
               }
             )
           ]
         }
-      ) : null
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("span", { className: "relative hidden @max-[26rem]/window-header:inline-flex", ref: menuRef, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+          "button",
+          {
+            type: "button",
+            className: (0, import_design_system.cn)(ICON_BUTTON, "hidden @max-[26rem]/window-header:inline-flex"),
+            onClick: () => setMenuOpen((wasOpen) => !wasOpen),
+            "aria-label": "More record actions",
+            title: "More record actions",
+            "aria-haspopup": "menu",
+            "aria-expanded": menuOpen,
+            "data-detail-actions-overflow": true,
+            children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(MoreHorizontalIcon, { className: "h-4 w-4" })
+          }
+        ),
+        menuOpen ? /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+          "div",
+          {
+            role: "menu",
+            "aria-label": "Record actions",
+            className: "absolute right-0 top-full z-50 mt-1 min-w-44 rounded-md border border-border bg-card p-1 shadow-md",
+            "data-detail-actions-menu": true,
+            children: [
+              others.map(({ value, label, Icon }) => /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+                "button",
+                {
+                  type: "button",
+                  role: "menuitem",
+                  className: MENU_ITEM,
+                  onClick: () => {
+                    setMenuOpen(false);
+                    core.switchTo(value);
+                  },
+                  children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Icon, { className: "h-3.5 w-3.5 shrink-0" }),
+                    label
+                  ]
+                },
+                value
+              )),
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+                "button",
+                {
+                  type: "button",
+                  role: "menuitem",
+                  className: MENU_ITEM,
+                  onClick: () => {
+                    setMenuOpen(false);
+                    void copyId();
+                  },
+                  children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(CopyIcon, { className: "h-3.5 w-3.5 shrink-0" }),
+                    "Copy record id"
+                  ]
+                }
+              )
+            ]
+          }
+        ) : null
+      ] })
     ] })
   ] });
 }
@@ -1453,6 +1476,13 @@ function HistorySection({ core }) {
     )) })
   ] });
 }
+function CustomFieldsPort({ core }) {
+  const host = useDetailHost();
+  const Section = host.customFields?.Section;
+  const token = core.entityToken;
+  if (!Section || !token) return null;
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Section, { token, id: core.ref.id });
+}
 function DetailBody({ core }) {
   const extra = core.recordType?.extraSections && core.frameCtx ? core.recordType.extraSections(core.row, core.frameCtx) : [];
   const Frame = core.recordType?.Frame ?? null;
@@ -1466,6 +1496,7 @@ function DetailBody({ core }) {
       /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "space-y-6 p-4", children: [
         /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(FieldsSection, { core }),
         core.status === "ready" || core.status === "none" ? /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(CustomFieldsPort, { core }),
           /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(AssociationsSection, { core }),
           /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(HistorySection, { core }),
           extra.map((section) => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("section", { className: "space-y-2", "data-detail-section": section.id, children: [
@@ -1545,6 +1576,7 @@ function KeyboardRoot({ core, children }) {
 function DetailWindowPresentation({ data, onClose }) {
   const host = useDetailHost();
   const core = useDetailCore(data, "window", { onClose });
+  const menuActions = useDetailMenuActions(core);
   const Shell = requireShell(host.shells, "Window");
   return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
     Shell,
@@ -1555,6 +1587,8 @@ function DetailWindowPresentation({ data, onClose }) {
       title: core.title,
       titleNode: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(KeyboardSlot, { core, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DetailTitle, { core }) }),
       actions: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(KeyboardActionsSlot, { core, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DetailActions, { core }) }),
+      navActions: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(KeyboardActionsSlot, { core, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DetailActions, { core, optional: "none" }) }),
+      menuActions,
       onClose: core.close,
       children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(KeyboardRoot, { core, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DetailBody, { core }) })
     }
@@ -1563,6 +1597,7 @@ function DetailWindowPresentation({ data, onClose }) {
 function DetailDockedPresentation({ data, onClose }) {
   const host = useDetailHost();
   const core = useDetailCore(data, "docked", { onClose });
+  const menuActions = useDetailMenuActions(core);
   const Shell = requireShell(host.shells, "Docked");
   return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
     Shell,
@@ -1572,6 +1607,8 @@ function DetailDockedPresentation({ data, onClose }) {
       title: core.title,
       titleNode: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(KeyboardSlot, { core, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DetailTitle, { core }) }),
       actions: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(KeyboardActionsSlot, { core, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DetailActions, { core }) }),
+      navActions: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(KeyboardActionsSlot, { core, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DetailActions, { core, optional: "none" }) }),
+      menuActions,
       onClose: core.close,
       children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(KeyboardRoot, { core, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DetailBody, { core }) })
     }
@@ -1580,6 +1617,7 @@ function DetailDockedPresentation({ data, onClose }) {
 function DetailPagePresentation({ data }) {
   const host = useDetailHost();
   const core = useDetailCore(data, "page", {});
+  const menuActions = useDetailMenuActions(core);
   const Shell = requireShell(host.shells, "Page");
   return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
     Shell,
@@ -1588,6 +1626,8 @@ function DetailPagePresentation({ data }) {
       title: core.title,
       titleNode: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(KeyboardSlot, { core, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DetailTitle, { core }) }),
       actions: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(KeyboardActionsSlot, { core, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DetailActions, { core }) }),
+      navActions: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(KeyboardActionsSlot, { core, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DetailActions, { core, optional: "none" }) }),
+      menuActions,
       onClose: core.close,
       onBack: core.leave,
       children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(KeyboardRoot, { core, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DetailBody, { core }) })