asma-ui-core 3.35.0 → 3.37.0

package/dist/components/feedback/dialog/StyledDialog.js

@@ -1,38 +1,38 @@
 import { cn as p } from "../../../helpers/cn.js";
 import { resolveSx as u } from "../../../helpers/sx.js";
-import { CloseIcon as _ } from "../../icons/close-icon/CloseIcon.js";
-import { StyledButton as I } from "../../inputs/button/StyledButton.js";
-import { useMobileMediaQuery as R } from "../../../hooks/useMediaQuery.hook.js";
-import z from "./StyledDialog.module.js";
-import { useEffect as K, useRef as P } from "react";
+import { CloseIcon as I } from "../../icons/close-icon/CloseIcon.js";
+import { StyledButton as R } from "../../inputs/button/StyledButton.js";
+import { useMobileMediaQuery as z } from "../../../hooks/useMediaQuery.hook.js";
+import K from "./StyledDialog.module.js";
+import { useEffect as P, useRef as W } from "react";
 import { jsx as l, jsxs as t } from "react/jsx-runtime";
-var W = {
+var X = {
   xs: 444,
   sm: 600,
   md: 900,
   lg: 1200,
   xl: 1536
-}, J = ({ open: r, onClose: o, children: h, dataTest: a, maxWidth: n = "sm", fullWidth: y, fullScreen: g, scroll: w = "paper", disableEscapeKeyDown: v, className: b, style: D, sx: N, PaperProps: k, slotProps: C, onCloseText: S, showCloseIcon: d = !0, dialogLabel: s, dialogTitle: c, dialogHeaderNode: j }) => {
-  const M = R(), i = P(null), f = M ? !0 : g;
-  K(() => {
-    const e = i.current;
-    e && (r && !e.open ? e.showModal() : !r && e.open && e.close());
-  }, [r]);
+}, O = ({ open: o, onClose: r, children: h, dataTest: a, maxWidth: i = "sm", fullWidth: y, fullScreen: g, scroll: w = "paper", disableEscapeKeyDown: v, className: b, style: D, sx: N, classes: k, PaperProps: C, slotProps: S, onCloseText: j, showCloseIcon: d = !0, dialogLabel: n, dialogTitle: s, dialogHeaderNode: M }) => {
+  const _ = z(), c = W(null), f = _ ? !0 : g;
+  P(() => {
+    const e = c.current;
+    e && (o && !e.open ? e.showModal() : !o && e.open && e.close());
+  }, [o]);
   const m = {
-    ...k,
-    ...C?.paper
-  }, x = n === !1 ? void 0 : W[n];
+    ...C,
+    ...S?.paper
+  }, x = i === !1 ? void 0 : X[i];
   return /* @__PURE__ */ t("dialog", {
-    ref: i,
+    ref: c,
     "data-testid": a,
     "aria-label": a,
     onCancel: (e) => {
-      e.preventDefault(), v || o?.(e, "escapeKeyDown");
+      e.preventDefault(), v || r?.(e, "escapeKeyDown");
     },
     onClick: (e) => {
-      e.target === i.current && o?.(e, "backdropClick");
+      e.target === c.current && r?.(e, "backdropClick");
     },
-    className: p(z.StyledDialog, "m-auto max-h-[calc(100%-64px)] overflow-hidden rounded-2xl border-0 bg-white p-0 text-delta-800 shadow-xl", f ? "h-full max-h-full w-full max-w-full rounded-none" : p("w-[calc(100%-64px)]", y ? "w-[calc(100%-64px)]" : "w-auto"), w === "body" ? "overflow-y-auto" : "flex flex-col", b, m.className),
+    className: p(K.StyledDialog, "text-delta-800 m-auto max-h-[calc(100%-64px)] overflow-hidden rounded-2xl border-0 bg-white p-0 shadow-xl", f ? "h-full max-h-full w-full max-w-full rounded-none" : p("w-[calc(100%-64px)]", y ? "w-[calc(100%-64px)]" : "w-auto"), w === "body" ? "overflow-y-auto" : "open:flex open:flex-col", b, m.className, k?.paper),
     style: {
       zIndex: 999,
       ...x && !f ? { maxWidth: x } : {},
@@ -40,39 +40,39 @@ var W = {
       ...u(m.sx),
       ...D
     },
-    children: [(!!s || !!c || d) && /* @__PURE__ */ t("div", {
+    children: [(!!n || !!s || d) && /* @__PURE__ */ t("div", {
       className: "flex w-full justify-between px-4 pt-4",
       children: [/* @__PURE__ */ t("div", {
         className: "flex flex-col justify-start gap-0.5",
-        children: [s && /* @__PURE__ */ l("div", {
+        children: [n && /* @__PURE__ */ l("div", {
           className: "flex h-8 items-center text-sm font-normal leading-5 text-[var(--colors-grey-700)]",
-          children: s
-        }), c && /* @__PURE__ */ l("div", {
+          children: n
+        }), s && /* @__PURE__ */ l("div", {
           className: "flex text-2xl font-semibold leading-8 text-[var(--colors-grey-800)]",
-          children: c
+          children: s
         })]
       }), d && /* @__PURE__ */ t("div", {
         className: "flex flex-grow justify-end gap-2",
-        children: [j, /* @__PURE__ */ l(I, {
+        children: [M, /* @__PURE__ */ l(R, {
           dataTest: `close-button-${a}`,
           variant: "textGray",
           size: "small",
-          endIcon: /* @__PURE__ */ l(_, {
+          endIcon: /* @__PURE__ */ l(I, {
             width: 20,
             height: 20
           }),
-          onClick: (e) => o?.(e, "escapeKeyDown"),
+          onClick: (e) => r?.(e, "escapeKeyDown"),
           style: {
             color: "var(--colors-grey-800)",
             paddingRight: "6px",
             paddingLeft: "6px"
           },
-          children: S
+          children: j
         })]
       })]
     }), h]
   });
 };
 export {
-  J as StyledDialog
+  O as StyledDialog
 };

package/dist/components/navigation/menu/StyledMenu.js

@@ -1,30 +1,31 @@
-import { cn as S } from "../../../helpers/cn.js";
-import { StyledPopover as c } from "../../utils/popover/StyledPopover.js";
+import { cn as y } from "../../../helpers/cn.js";
+import { StyledPopover as S } from "../../utils/popover/StyledPopover.js";
 import { StyledMenuList as f } from "./StyledMenuList.js";
-import { jsx as o } from "react/jsx-runtime";
+import { jsx as p } from "react/jsx-runtime";
 var u = {
   border: "1px solid var(--colors-delta-300)",
   boxShadow: "0px 2px 4px 0px rgba(34, 33, 51, 0.15)"
-}, E = ({ open: p, anchorEl: e, onClose: t, anchorOrigin: a, transformOrigin: d, id: l, className: m, sx: s, classes: r, autoFocus: x = !0, onClick: i, children: n }) => /* @__PURE__ */ o(c, {
-  open: p,
-  anchorEl: e,
+}, M = ({ open: a, anchorEl: o, onClose: t, anchorOrigin: l, transformOrigin: m, id: d, className: s, sx: x, classes: e, slotProps: r, autoFocus: i = !0, onClick: c, children: n }) => /* @__PURE__ */ p(S, {
+  open: a,
+  anchorEl: o,
   onClose: t,
-  anchorOrigin: a,
-  transformOrigin: d,
-  id: l,
-  className: m,
-  sx: s,
+  anchorOrigin: l,
+  transformOrigin: m,
+  id: d,
+  className: s,
+  sx: x,
   slotProps: { paper: {
-    className: S("rounded", r?.paper),
-    sx: u
+    className: y("rounded", e?.paper, r?.paper?.className),
+    sx: [u, r?.paper?.sx],
+    style: r?.paper?.style
   } },
-  children: /* @__PURE__ */ o(f, {
-    autoFocus: x,
-    className: r?.list,
-    onClick: i,
+  children: /* @__PURE__ */ p(f, {
+    autoFocus: i,
+    className: e?.list,
+    onClick: c,
     children: n
   })
 });
 export {
-  E as StyledMenu
+  M as StyledMenu
 };

package/dist/components/navigation/menu/StyledMenuItem.js

@@ -1,20 +1,20 @@
 import { cn as a } from "../../../helpers/cn.js";
 import { resolveSx as s } from "../../../helpers/sx.js";
-import { jsx as p } from "react/jsx-runtime";
-var w = ({ children: n, onClick: o, disabled: e, selected: l, className: i, classes: r, sx: m, "data-test": d, "data-testid": u, value: y }) => /* @__PURE__ */ p("li", {
+import { jsx as y } from "react/jsx-runtime";
+var D = ({ children: n, onClick: o, disabled: e, selected: l, dense: i, className: m, classes: r, sx: d, "data-test": u, "data-testid": p, value: f }) => /* @__PURE__ */ y("li", {
   role: "menuitem",
   "aria-disabled": e ? !0 : void 0,
   tabIndex: -1,
-  "data-test": d,
-  "data-testid": u,
+  "data-test": u,
+  "data-testid": p,
   onClick: e ? void 0 : o,
   onKeyDown: (t) => {
     e || (t.key === "Enter" || t.key === " ") && (t.preventDefault(), o?.(t));
   },
-  className: a("flex items-center px-3 py-2.5 outline-none", e ? "cursor-not-allowed" : "cursor-pointer hover:bg-delta-50", l && a("bg-gama-50", r?.selected), r?.root, i),
-  style: s(m),
+  className: a("flex items-center px-3 outline-none", i ? "py-1.5" : "py-2.5", e ? "cursor-not-allowed" : "cursor-pointer hover:bg-delta-50", l && a("bg-gama-50", r?.selected), r?.root, m),
+  style: s(d),
   children: n
 });
 export {
-  w as StyledMenuItem
+  D as StyledMenuItem
 };

package/dist/components/utils/popover/StyledPopover.js

@@ -2,17 +2,17 @@ import { cn as w } from "../../../helpers/cn.js";
 import { resolveSx as l } from "../../../helpers/sx.js";
 import { useMemo as x } from "react";
 import { jsx as i } from "react/jsx-runtime";
-import { FloatingPortal as z, autoUpdate as R, flip as A, offset as D, shift as M, useDismiss as N, useFloating as P, useInteractions as S, useMergeRefs as k } from "@floating-ui/react";
-var C = {
+import { FloatingPortal as z, autoUpdate as R, flip as A, offset as D, shift as M, useDismiss as N, useFloating as S, useInteractions as k, useMergeRefs as C } from "@floating-ui/react";
+var E = {
   vertical: "bottom",
   horizontal: "left"
-}, E = {
+}, P = {
   vertical: "top",
   horizontal: "left"
-}, T = (e, t) => `${t.vertical === "bottom" ? "top" : t.vertical === "top" ? "bottom" : e.vertical === "top" ? "top" : "bottom"}${e.horizontal === "left" ? "-start" : e.horizontal === "right" ? "-end" : ""}`, j = ({ open: e, anchorEl: t, onClose: s, anchorOrigin: o = C, transformOrigin: r = E, id: n, className: p, sx: m, slotProps: a, onClick: c, children: f }) => {
-  const { refs: d, floatingStyles: u, context: v } = P({
+}, T = (e, t) => `${t.vertical === "bottom" ? "top" : t.vertical === "top" ? "bottom" : e.vertical === "top" ? "top" : "bottom"}${e.horizontal === "left" ? "-start" : e.horizontal === "right" ? "-end" : ""}`, j = ({ open: e, anchorEl: t, onClose: s, anchorOrigin: r = E, transformOrigin: a = P, id: n, className: p, sx: m, slotProps: o, onClick: c, children: f }) => {
+  const { refs: d, floatingStyles: u, context: v } = S({
     open: e,
-    placement: x(() => T(o, r), [o, r]),
+    placement: x(() => T(r, a), [r, a]),
     whileElementsMounted: R,
     elements: { reference: t ?? void 0 },
     middleware: [
@@ -23,20 +23,21 @@ var C = {
     onOpenChange: (y, F, b) => {
       y || s?.(F ?? {}, b === "escape-key" ? "escapeKeyDown" : "backdropClick");
     }
-  }), { getFloatingProps: g } = S([N(v, {
+  }), { getFloatingProps: g } = k([N(v, {
     outsidePress: !0,
     escapeKey: !0
-  })]), h = k([d.setFloating]);
+  })]), h = C([d.setFloating]);
   return e ? /* @__PURE__ */ i(z, { children: /* @__PURE__ */ i("div", {
     ref: h,
     id: n,
     style: {
       ...u,
       ...l(m),
-      ...l(a?.paper?.sx)
+      ...l(o?.paper?.sx),
+      ...o?.paper?.style
     },
     ...g({ onClick: c }),
-    className: w("z-[1300] overflow-auto rounded bg-white shadow-lg", p ?? "my-1", a?.paper?.className),
+    className: w("z-[1300] overflow-auto rounded bg-white shadow-lg", p ?? "my-1", o?.paper?.className),
     children: f
   }) }) : null;
 };

package/dist/src/components/feedback/dialog/StyledDialog.d.ts

@@ -16,9 +16,22 @@ export interface IStyledDialogProps {
     fullScreen?: boolean;
     scroll?: 'paper' | 'body';
     disableEscapeKeyDown?: boolean;
+    /**
+     * Accepted for MUI `Dialog` parity (DEC-003). Focus is trapped by the native `<dialog>`
+     * `showModal()`, so this MUI `Modal` prop is a typed no-op.
+     */
+    disableEnforceFocus?: boolean;
     className?: string;
     style?: CSSProperties;
     sx?: unknown;
+    /**
+     * MUI `Dialog` `classes` parity (DEC-003). The native `<dialog>` is the paper, so `classes.paper`
+     * is merged onto it; `classes.root` is accepted as a typed no-op (no separate root element).
+     */
+    classes?: {
+        paper?: string;
+        root?: string;
+    };
     PaperProps?: DialogPaperProps;
     slotProps?: {
         paper?: DialogPaperProps;

package/dist/src/components/navigation/drawer/StyledDrawer.d.ts

@@ -13,6 +13,13 @@ export interface DrawerProps {
         className?: string;
         sx?: unknown;
     };
+    /**
+     * Accepted for MUI `Drawer` parity (DEC-003). The panel always stays mounted so the slide
+     * transition can play, so `keepMounted` is effectively always-on — this prop is a typed no-op.
+     */
+    ModalProps?: {
+        keepMounted?: boolean;
+    };
     children?: ReactNode;
 }
 /**

package/dist/src/components/navigation/menu/StyledMenu.d.ts

@@ -1,4 +1,4 @@
-import { MouseEvent, ReactNode } from 'react';
+import { CSSProperties, MouseEvent, ReactNode } from 'react';
 import { PopoverOrigin, StyledPopoverProps } from '../../utils/popover';
 export interface MenuProps {
     open: boolean;
@@ -13,6 +13,14 @@ export interface MenuProps {
         paper?: string;
         list?: string;
     };
+    /** MUI `Menu` `slotProps.paper` parity (DEC-003): styles/classes forwarded to the menu paper. */
+    slotProps?: {
+        paper?: {
+            className?: string;
+            sx?: unknown;
+            style?: CSSProperties;
+        };
+    };
     autoFocus?: boolean;
     onClick?: (event: MouseEvent<HTMLUListElement>) => void;
     children?: ReactNode;
@@ -22,4 +30,4 @@ export interface MenuProps {
  * Public props (`open`/`anchorEl`/`onClose`/`anchorOrigin`/`classes`/`autoFocus`) preserved
  * (DEC-003). TASK-303.
  */
-export declare const StyledMenu: ({ open, anchorEl, onClose, anchorOrigin, transformOrigin, id, className, sx, classes, autoFocus, onClick, children, }: MenuProps) => JSX.Element;
+export declare const StyledMenu: ({ open, anchorEl, onClose, anchorOrigin, transformOrigin, id, className, sx, classes, slotProps, autoFocus, onClick, children, }: MenuProps) => JSX.Element;

package/dist/src/components/navigation/menu/StyledMenuItem.d.ts

@@ -4,6 +4,8 @@ export interface StyledMenuItemProps {
     onClick?: (event: MouseEvent<HTMLLIElement>) => void;
     disabled?: boolean;
     selected?: boolean;
+    /** Compact vertical padding (MUI `MenuItem` `dense` parity, DEC-003). */
+    dense?: boolean;
     value?: unknown;
     className?: string;
     classes?: {
@@ -18,4 +20,4 @@ export interface StyledMenuItemProps {
  * Native `role="menuitem"` (replaces MUI `MenuItem`). Enter/Space activate; a disabled item stays
  * focusable but non-interactive (MUI parity). Public props preserved (DEC-003). TASK-303.
  */
-export declare const StyledMenuItem: ({ children, onClick, disabled, selected, className, classes, sx, "data-test": dataTest, "data-testid": dataTestId, value: _value, }: StyledMenuItemProps) => JSX.Element;
+export declare const StyledMenuItem: ({ children, onClick, disabled, selected, dense, className, classes, sx, "data-test": dataTest, "data-testid": dataTestId, value: _value, }: StyledMenuItemProps) => JSX.Element;

package/dist/src/components/navigation/tabs/StyledTabs.d.ts

@@ -2,7 +2,7 @@ import { FC, ReactNode, SyntheticEvent } from 'react';
 import { TabValue } from './TabsContext';
 export interface StyledTabsProps {
     value?: TabValue;
-    onChange?: (event: SyntheticEvent, value: TabValue) => void;
+    onChange?(event: SyntheticEvent, value: TabValue): void;
     variant?: 'standard' | 'scrollable' | 'fullWidth';
     scrollButtons?: 'auto' | boolean;
     centered?: boolean;

package/dist/src/components/utils/popover/StyledPopover.d.ts

@@ -17,6 +17,7 @@ export interface StyledPopoverProps {
         paper?: {
             className?: string;
             sx?: unknown;
+            style?: React.CSSProperties;
         };
     };
     onClick?: (event: React.MouseEvent<HTMLDivElement>) => void;

package/package.json

@@ -3,7 +3,7 @@
     "publishConfig": {
         "access": "public"
     },
-    "version": "3.35.0",
+    "version": "3.37.0",
     "type": "module",
     "sideEffects": [
         "**/*.css",