@ai-matrx/detail 0.1.68 → 0.1.70

package/dist/react.d.cts

@@ -1,5 +1,5 @@
-import { D as DetailRef, a as DetailInstanceData, b as DetailPresentation, c as DetailRecordType, d as DetailStatus, e as DetailRow, f as DetailField, g as DetailSourceHealth, h as DetailFrameContext, i as DetailListContext, j as DetailLoadState, k as DetailOpenRequest } from './host-BPTuBbgB.cjs';
-export { l as DetailDockedShellProps, m as DetailEffectivePresentation, n as DetailHostPorts, o as DetailHostProvider, p as DetailPageShellProps, q as DetailPresentationSetting, r as DetailShellSlots, s as DetailShells, t as DetailWindowShellProps, u as requireResolveType, v as requireShell, w as useDetailHost } from './host-BPTuBbgB.cjs';
+import { D as DetailRef, a as DetailInstanceData, b as DetailPresentation, c as DetailRecordType, d as DetailStatus, e as DetailRow, f as DetailField, g as DetailSourceHealth, h as DetailFrameContext, i as DetailListContext, j as DetailLoadState, k as DetailOpenRequest, l as DetailMenuAction } from './host-DrnEXBfp.cjs';
+export { m as DetailDockedShellProps, n as DetailEffectivePresentation, o as DetailHostPorts, p as DetailHostProvider, q as DetailPageShellProps, r as DetailPresentationSetting, s as DetailShellSlots, t as DetailShells, u as DetailWindowShellProps, v as requireResolveType, w as requireShell, x as useDetailHost } from './host-DrnEXBfp.cjs';
 import * as react from 'react';
 import { KeyboardEvent } from 'react';
 
@@ -148,8 +148,19 @@ declare function DetailTitle({ core }: {
 declare function DetailRecordMeta({ core }: {
     core: DetailCore;
 }): react.JSX.Element;
-declare function DetailActions({ core }: {
+/**
+ * The optional controls as data — the same actions the overflow menu offers —
+ * for a shell whose chrome has its own menu (a canvas tab's one "⋮").
+ */
+declare function useDetailMenuActions(core: DetailCore): DetailMenuAction[];
+/**
+ * Previous / next, the counter, and — unless `optional="none"` (the shell
+ * offers `menuActions` in its own menu) — the optional controls, which fold
+ * into one overflow button in a narrow header.
+ */
+declare function DetailActions({ core, optional }: {
     core: DetailCore;
+    optional?: "inline" | "none";
 }): react.JSX.Element;
 
 declare function DetailBody({ core }: {
@@ -188,4 +199,4 @@ declare const DETAIL_HEADER_COMPACT_BELOW = "@max-[26rem]/window-header";
 /** The floor under the record's name: ~96px, enough for a readable fragment. */
 declare const DETAIL_TITLE_MIN_WIDTH_CLASS = "min-w-[6rem]";
 
-export { DETAIL_HEADER_COMPACT_BELOW, DETAIL_HEADER_CONTAINER, DETAIL_TITLE_MIN_WIDTH_CLASS, DetailActions, DetailBody, type DetailCore, DetailDockedPresentation, type DetailKeyboard, type DetailKeyboardHandlers, DetailPagePresentation, DetailPresentationPane, type DetailPresentationProps, DetailRecordMeta, DetailTitle, DetailWindowPresentation, type OpenDetail, type UseDetailHealthArgs, reconnectFor, useDetailCore, useDetailHealth, useDetailKeyboard, useDetailRecord, useOpenDetail };
+export { DETAIL_HEADER_COMPACT_BELOW, DETAIL_HEADER_CONTAINER, DETAIL_TITLE_MIN_WIDTH_CLASS, DetailActions, DetailBody, type DetailCore, DetailDockedPresentation, type DetailKeyboard, type DetailKeyboardHandlers, DetailMenuAction, DetailPagePresentation, DetailPresentationPane, type DetailPresentationProps, DetailRecordMeta, DetailTitle, DetailWindowPresentation, type OpenDetail, type UseDetailHealthArgs, reconnectFor, useDetailCore, useDetailHealth, useDetailKeyboard, useDetailMenuActions, useDetailRecord, useOpenDetail };

package/dist/react.d.ts

@@ -1,5 +1,5 @@
-import { D as DetailRef, a as DetailInstanceData, b as DetailPresentation, c as DetailRecordType, d as DetailStatus, e as DetailRow, f as DetailField, g as DetailSourceHealth, h as DetailFrameContext, i as DetailListContext, j as DetailLoadState, k as DetailOpenRequest } from './host-BPTuBbgB.js';
-export { l as DetailDockedShellProps, m as DetailEffectivePresentation, n as DetailHostPorts, o as DetailHostProvider, p as DetailPageShellProps, q as DetailPresentationSetting, r as DetailShellSlots, s as DetailShells, t as DetailWindowShellProps, u as requireResolveType, v as requireShell, w as useDetailHost } from './host-BPTuBbgB.js';
+import { D as DetailRef, a as DetailInstanceData, b as DetailPresentation, c as DetailRecordType, d as DetailStatus, e as DetailRow, f as DetailField, g as DetailSourceHealth, h as DetailFrameContext, i as DetailListContext, j as DetailLoadState, k as DetailOpenRequest, l as DetailMenuAction } from './host-DrnEXBfp.js';
+export { m as DetailDockedShellProps, n as DetailEffectivePresentation, o as DetailHostPorts, p as DetailHostProvider, q as DetailPageShellProps, r as DetailPresentationSetting, s as DetailShellSlots, t as DetailShells, u as DetailWindowShellProps, v as requireResolveType, w as requireShell, x as useDetailHost } from './host-DrnEXBfp.js';
 import * as react from 'react';
 import { KeyboardEvent } from 'react';
 
@@ -148,8 +148,19 @@ declare function DetailTitle({ core }: {
 declare function DetailRecordMeta({ core }: {
     core: DetailCore;
 }): react.JSX.Element;
-declare function DetailActions({ core }: {
+/**
+ * The optional controls as data — the same actions the overflow menu offers —
+ * for a shell whose chrome has its own menu (a canvas tab's one "⋮").
+ */
+declare function useDetailMenuActions(core: DetailCore): DetailMenuAction[];
+/**
+ * Previous / next, the counter, and — unless `optional="none"` (the shell
+ * offers `menuActions` in its own menu) — the optional controls, which fold
+ * into one overflow button in a narrow header.
+ */
+declare function DetailActions({ core, optional }: {
     core: DetailCore;
+    optional?: "inline" | "none";
 }): react.JSX.Element;
 
 declare function DetailBody({ core }: {
@@ -188,4 +199,4 @@ declare const DETAIL_HEADER_COMPACT_BELOW = "@max-[26rem]/window-header";
 /** The floor under the record's name: ~96px, enough for a readable fragment. */
 declare const DETAIL_TITLE_MIN_WIDTH_CLASS = "min-w-[6rem]";
 
-export { DETAIL_HEADER_COMPACT_BELOW, DETAIL_HEADER_CONTAINER, DETAIL_TITLE_MIN_WIDTH_CLASS, DetailActions, DetailBody, type DetailCore, DetailDockedPresentation, type DetailKeyboard, type DetailKeyboardHandlers, DetailPagePresentation, DetailPresentationPane, type DetailPresentationProps, DetailRecordMeta, DetailTitle, DetailWindowPresentation, type OpenDetail, type UseDetailHealthArgs, reconnectFor, useDetailCore, useDetailHealth, useDetailKeyboard, useDetailRecord, useOpenDetail };
+export { DETAIL_HEADER_COMPACT_BELOW, DETAIL_HEADER_CONTAINER, DETAIL_TITLE_MIN_WIDTH_CLASS, DetailActions, DetailBody, type DetailCore, DetailDockedPresentation, type DetailKeyboard, type DetailKeyboardHandlers, DetailMenuAction, DetailPagePresentation, DetailPresentationPane, type DetailPresentationProps, DetailRecordMeta, DetailTitle, DetailWindowPresentation, type OpenDetail, type UseDetailHealthArgs, reconnectFor, useDetailCore, useDetailHealth, useDetailKeyboard, useDetailMenuActions, useDetailRecord, useOpenDetail };

package/dist/react.js

@@ -714,7 +714,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] = useState3(false);
   const [menuOpen, setMenuOpen] = useState3(false);
@@ -779,98 +799,100 @@ function DetailActions({ core }) {
       ),
       /* @__PURE__ */ jsx3("span", { className: "mx-1 h-4 w-px bg-border", "aria-hidden": true })
     ] }) : null,
-    /* @__PURE__ */ jsxs2(
-      "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__ */ jsx3(
-            "button",
-            {
-              type: "button",
-              className: ICON_BUTTON,
-              onClick: () => core.switchTo(value),
-              "aria-label": label,
-              title: label,
-              children: /* @__PURE__ */ jsx3(Icon, { className: "h-4 w-4" })
-            },
-            value
-          )),
-          /* @__PURE__ */ jsx3(
-            "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__ */ jsx3(CheckIcon, { className: "h-3.5 w-3.5 text-primary" }) : /* @__PURE__ */ jsx3(CopyIcon, { className: "h-3.5 w-3.5" })
-            }
-          )
-        ]
-      }
-    ),
-    /* @__PURE__ */ jsxs2("span", { className: "relative hidden @max-[26rem]/window-header:inline-flex", ref: menuRef, children: [
-      /* @__PURE__ */ jsx3(
-        "button",
-        {
-          type: "button",
-          className: 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__ */ jsx3(MoreHorizontalIcon, { className: "h-4 w-4" })
-        }
-      ),
-      menuOpen ? /* @__PURE__ */ jsxs2(
-        "div",
+    optional === "none" ? null : /* @__PURE__ */ jsxs2(Fragment2, { children: [
+      /* @__PURE__ */ jsxs2(
+        "span",
         {
-          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__ */ jsxs2(
+            others.map(({ value, label, Icon }) => /* @__PURE__ */ jsx3(
               "button",
               {
                 type: "button",
-                role: "menuitem",
-                className: MENU_ITEM,
-                onClick: () => {
-                  setMenuOpen(false);
-                  core.switchTo(value);
-                },
-                children: [
-                  /* @__PURE__ */ jsx3(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__ */ jsx3(Icon, { className: "h-4 w-4" })
               },
               value
             )),
-            /* @__PURE__ */ jsxs2(
+            /* @__PURE__ */ jsx3(
               "button",
               {
                 type: "button",
-                role: "menuitem",
-                className: MENU_ITEM,
-                onClick: () => {
-                  setMenuOpen(false);
-                  void copyId();
-                },
-                children: [
-                  /* @__PURE__ */ jsx3(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__ */ jsx3(CheckIcon, { className: "h-3.5 w-3.5 text-primary" }) : /* @__PURE__ */ jsx3(CopyIcon, { className: "h-3.5 w-3.5" })
               }
             )
           ]
         }
-      ) : null
+      ),
+      /* @__PURE__ */ jsxs2("span", { className: "relative hidden @max-[26rem]/window-header:inline-flex", ref: menuRef, children: [
+        /* @__PURE__ */ jsx3(
+          "button",
+          {
+            type: "button",
+            className: 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__ */ jsx3(MoreHorizontalIcon, { className: "h-4 w-4" })
+          }
+        ),
+        menuOpen ? /* @__PURE__ */ jsxs2(
+          "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__ */ jsxs2(
+                "button",
+                {
+                  type: "button",
+                  role: "menuitem",
+                  className: MENU_ITEM,
+                  onClick: () => {
+                    setMenuOpen(false);
+                    core.switchTo(value);
+                  },
+                  children: [
+                    /* @__PURE__ */ jsx3(Icon, { className: "h-3.5 w-3.5 shrink-0" }),
+                    label
+                  ]
+                },
+                value
+              )),
+              /* @__PURE__ */ jsxs2(
+                "button",
+                {
+                  type: "button",
+                  role: "menuitem",
+                  className: MENU_ITEM,
+                  onClick: () => {
+                    setMenuOpen(false);
+                    void copyId();
+                  },
+                  children: [
+                    /* @__PURE__ */ jsx3(CopyIcon, { className: "h-3.5 w-3.5 shrink-0" }),
+                    "Copy record id"
+                  ]
+                }
+              )
+            ]
+          }
+        ) : null
+      ] })
     ] })
   ] });
 }
@@ -1511,6 +1533,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__ */ jsx6(
     Shell,
@@ -1521,6 +1544,8 @@ function DetailWindowPresentation({ data, onClose }) {
       title: core.title,
       titleNode: /* @__PURE__ */ jsx6(KeyboardSlot, { core, children: /* @__PURE__ */ jsx6(DetailTitle, { core }) }),
       actions: /* @__PURE__ */ jsx6(KeyboardActionsSlot, { core, children: /* @__PURE__ */ jsx6(DetailActions, { core }) }),
+      navActions: /* @__PURE__ */ jsx6(KeyboardActionsSlot, { core, children: /* @__PURE__ */ jsx6(DetailActions, { core, optional: "none" }) }),
+      menuActions,
       onClose: core.close,
       children: /* @__PURE__ */ jsx6(KeyboardRoot, { core, children: /* @__PURE__ */ jsx6(DetailBody, { core }) })
     }
@@ -1529,6 +1554,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__ */ jsx6(
     Shell,
@@ -1538,6 +1564,8 @@ function DetailDockedPresentation({ data, onClose }) {
       title: core.title,
       titleNode: /* @__PURE__ */ jsx6(KeyboardSlot, { core, children: /* @__PURE__ */ jsx6(DetailTitle, { core }) }),
       actions: /* @__PURE__ */ jsx6(KeyboardActionsSlot, { core, children: /* @__PURE__ */ jsx6(DetailActions, { core }) }),
+      navActions: /* @__PURE__ */ jsx6(KeyboardActionsSlot, { core, children: /* @__PURE__ */ jsx6(DetailActions, { core, optional: "none" }) }),
+      menuActions,
       onClose: core.close,
       children: /* @__PURE__ */ jsx6(KeyboardRoot, { core, children: /* @__PURE__ */ jsx6(DetailBody, { core }) })
     }
@@ -1546,6 +1574,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__ */ jsx6(
     Shell,
@@ -1554,6 +1583,8 @@ function DetailPagePresentation({ data }) {
       title: core.title,
       titleNode: /* @__PURE__ */ jsx6(KeyboardSlot, { core, children: /* @__PURE__ */ jsx6(DetailTitle, { core }) }),
       actions: /* @__PURE__ */ jsx6(KeyboardActionsSlot, { core, children: /* @__PURE__ */ jsx6(DetailActions, { core }) }),
+      navActions: /* @__PURE__ */ jsx6(KeyboardActionsSlot, { core, children: /* @__PURE__ */ jsx6(DetailActions, { core, optional: "none" }) }),
+      menuActions,
       onClose: core.close,
       onBack: core.leave,
       children: /* @__PURE__ */ jsx6(KeyboardRoot, { core, children: /* @__PURE__ */ jsx6(DetailBody, { core }) })
@@ -1585,6 +1616,7 @@ export {
   useDetailHealth,
   useDetailHost,
   useDetailKeyboard,
+  useDetailMenuActions,
   useDetailRecord,
   useOpenDetail
 };