@forgeax/app-shell 0.38.0 → 0.39.0

package/dist/react.d.ts

@@ -129,6 +129,32 @@ interface FloatingMenuProps {
 /** Product-neutral floating menu portal with outside-dismiss and viewport clamping. */
 declare function FloatingMenu({ open, onClose, point, anchor, align, offset, className, children, }: FloatingMenuProps): react.ReactPortal | null;
 
+interface DockLayoutMenuPanel {
+    readonly id: string;
+    readonly title: string;
+    readonly icon?: ReactNode;
+}
+interface DockLayoutMenuProps<Anchor extends FloatingMenuAnchor> {
+    readonly state: DockLayoutControlState<Anchor>;
+    readonly onToggle: DockLayoutControlToggleSource<Anchor>['onToggle'];
+    readonly isPanelOpen: (panelId: string) => boolean;
+    readonly closePanel: (panelId: string) => void;
+    readonly reopenPanel: (panelId: string) => void;
+    readonly onReset: () => void;
+    readonly resetLabel: ReactNode;
+    readonly sectionLabel: ReactNode;
+    readonly emptyLabel: ReactNode;
+    readonly resetIcon?: ReactNode;
+    readonly panels: readonly DockLayoutMenuPanel[];
+}
+/**
+ * Product-neutral Dock layout-menu composition.
+ *
+ * Consumers inject copy, icons, reset policy and concrete panel adapters while
+ * App Shell owns the stable binding, carrier, row semantics and structure.
+ */
+declare function DockLayoutMenu<Anchor extends FloatingMenuAnchor>({ state, onToggle, isPanelOpen, closePanel, reopenPanel, onReset, resetLabel, sectionLabel, emptyLabel, resetIcon, panels, }: DockLayoutMenuProps<Anchor>): react.JSX.Element;
+
 type ShellSlotElement = 'aside' | 'div' | 'main' | 'section';
 interface ShellSlotProps extends HTMLAttributes<HTMLElement> {
     as?: ShellSlotElement;
@@ -137,4 +163,4 @@ interface ShellSlotProps extends HTMLAttributes<HTMLElement> {
 /** Structural shell marker that preserves the caller's semantic element. */
 declare function ShellSlot({ as, name, ...props }: ShellSlotProps): ReactElement;
 
-export { DetachedPanelBoundary, type DetachedPanelBoundaryProps, DetachedSurfaceFrame, type DetachedSurfaceFrameProps, DetachedSurfaceStatus, type DetachedSurfaceStatusProps, type DetachedSurfaceStatusTone, type DockLayoutControlBinding, type DockLayoutControlBindingOptions, FloatingMenu, type FloatingMenuAnchor, type FloatingMenuPoint, type FloatingMenuProps, type PanelContentPadding, type PanelContentPolicy, type PanelContentScroll, type PanelContentTone, PanelEmptyState, type PanelEmptyStateProps, PanelSurface, type PanelSurfaceProps, ResizeHandle, type ResizeHandleProps, ShellSlot, type ShellSlotElement, type ShellSlotProps, SlotDebugOverlay, SurfacePlaceholder, type SurfacePlaceholderProps, SurfaceRegion, type SurfaceRegionProps, hashSlotHue, isSlotDebugEnabled, useDockLayoutControlBinding, useLocalSize };
+export { DetachedPanelBoundary, type DetachedPanelBoundaryProps, DetachedSurfaceFrame, type DetachedSurfaceFrameProps, DetachedSurfaceStatus, type DetachedSurfaceStatusProps, type DetachedSurfaceStatusTone, type DockLayoutControlBinding, type DockLayoutControlBindingOptions, DockLayoutMenu, type DockLayoutMenuPanel, type DockLayoutMenuProps, FloatingMenu, type FloatingMenuAnchor, type FloatingMenuPoint, type FloatingMenuProps, type PanelContentPadding, type PanelContentPolicy, type PanelContentScroll, type PanelContentTone, PanelEmptyState, type PanelEmptyStateProps, PanelSurface, type PanelSurfaceProps, ResizeHandle, type ResizeHandleProps, ShellSlot, type ShellSlotElement, type ShellSlotProps, SlotDebugOverlay, SurfacePlaceholder, type SurfacePlaceholderProps, SurfaceRegion, type SurfaceRegionProps, hashSlotHue, isSlotDebugEnabled, useDockLayoutControlBinding, useLocalSize };

package/dist/react.js

@@ -949,6 +949,85 @@ function FloatingMenu({
   );
 }
 
+// src/dock-layout-menu.tsx
+import { jsx as jsx8, jsxs as jsxs4 } from "react/jsx-runtime";
+function DockLayoutMenu({
+  state,
+  onToggle,
+  isPanelOpen,
+  closePanel,
+  reopenPanel,
+  onReset,
+  resetLabel,
+  sectionLabel,
+  emptyLabel,
+  resetIcon,
+  panels
+}) {
+  const { snapshot, panelControl } = useDockLayoutControlBinding({
+    state,
+    onToggle,
+    isPanelOpen,
+    closePanel,
+    reopenPanel
+  });
+  return /* @__PURE__ */ jsxs4(
+    FloatingMenu,
+    {
+      open: snapshot.open,
+      onClose: state.close,
+      anchor: snapshot.anchor,
+      align: "end",
+      className: "fx-dl-menu",
+      children: [
+        /* @__PURE__ */ jsxs4(
+          "button",
+          {
+            type: "button",
+            role: "menuitem",
+            "data-app-shell-dock-layout-reset": "",
+            className: "fx-dl-item fx-dl-reset",
+            onClick: () => {
+              try {
+                onReset();
+              } finally {
+                state.close();
+              }
+            },
+            children: [
+              resetIcon ? /* @__PURE__ */ jsx8("span", { className: "fx-dl-icon", "aria-hidden": "true", children: resetIcon }) : null,
+              resetLabel
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx8("div", { className: "fx-dl-sep", role: "separator" }),
+        /* @__PURE__ */ jsx8("div", { className: "fx-dl-head", children: sectionLabel }),
+        panels.length === 0 ? /* @__PURE__ */ jsx8("div", { className: "fx-dl-head", "data-app-shell-dock-layout-empty": "", children: emptyLabel }) : panels.map((panel) => {
+          const isOpen = panelControl.isOpen(panel.id);
+          return /* @__PURE__ */ jsxs4(
+            "button",
+            {
+              type: "button",
+              role: "menuitemcheckbox",
+              "aria-checked": isOpen,
+              className: `fx-dl-item${isOpen ? " on" : ""}`,
+              onClick: () => {
+                panelControl.toggle(panel.id);
+              },
+              children: [
+                /* @__PURE__ */ jsx8("span", { className: "fx-dl-check", "aria-hidden": "true", children: isOpen ? "\u2713" : "\uFF0B" }),
+                panel.icon ? /* @__PURE__ */ jsx8("span", { className: "fx-dl-icon", "aria-hidden": "true", children: panel.icon }) : null,
+                panel.title
+              ]
+            },
+            panel.id
+          );
+        })
+      ]
+    }
+  );
+}
+
 // src/react.tsx
 function ShellSlot({
   as = "div",
@@ -961,6 +1040,7 @@ export {
   DetachedPanelBoundary,
   DetachedSurfaceFrame,
   DetachedSurfaceStatus,
+  DockLayoutMenu,
   FloatingMenu,
   PanelEmptyState,
   PanelSurface,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@forgeax/app-shell",
-  "version": "0.38.0",
+  "version": "0.39.0",
   "description": "Generic Dock, Panel, Window, and Slot composition primitives",
   "license": "Apache-2.0",
   "type": "module",