asma-ui-core 3.61.0 → 3.61.2

package/dist/components/feedback/minimizable-dialog/MinimizableDialog.js

@@ -17,9 +17,9 @@ import H from "clsx";
 import { useRef as fe, useState as J } from "react";
 import { Fragment as z, jsx as e, jsxs as i } from "react/jsx-runtime";
 var Ee = ({ onCloseText: u = "", onMinimizeText: N = "", onExpandText: I = "", onFullScreenText: M = "", showCloseIcon: j = !0, showMinimizeIcon: Q = !0, showExpandIcon: T = !0, showFullScreenIcon: W = !0, title: s, label: b, children: g, open: C, onClose: x, className: _ = "", primaryButtonText: w, primaryButtonLoading: k = !1, secondaryButtonText: c, onPrimaryButtonClick: v, onSecondaryButtonClick: p, dataTest: F, actionNode: X, extraActions: r, extraActionsText: m, btnContainerClassName: G, footerClassName: Y, footerInfo: D, locale: l = "en", enableFullscreen: Z = !0, fullScreenState: E, handleFullScreenState: L }) => {
-  const [d, A] = J(!1), [R, P] = J(!1), { open: B, anchorEl: ee, handleOpen: ie, handleClose: te } = he(), S = fe(null), o = E ?? R, a = o && !d;
-  if (se(C && a, S, x), !C) return null;
-  const le = a ? {
+  const [d, A] = J(!1), [R, P] = J(!1), { open: B, anchorEl: ee, handleOpen: ie, handleClose: te } = he(), S = fe(null), a = E ?? R, n = a && !d;
+  if (se(C && n, S, x), !C) return null;
+  const le = n ? {
     right: "auto",
     bottom: "auto",
     left: "50%",
@@ -27,11 +27,11 @@ var Ee = ({ onCloseText: u = "", onMinimizeText: N = "", onExpandText: I = "", o
     transform: "translate(-50%, -50%)",
     width: "min(1000px, calc(100vw - 32px))",
     height: "95dvh"
-  } : void 0, O = o ? l === "en" ? "Exit full screen" : "Avslutt fullskjerm" : l === "en" ? "Full screen" : "Fullskjerm", y = w ?? k, U = y || c, V = () => {
+  } : void 0, O = a ? l === "en" ? "Exit full screen" : "Avslutt fullskjerm" : l === "en" ? "Full screen" : "Fullskjerm", y = w ?? k, U = y || c, V = () => {
     A(!d);
   };
   return /* @__PURE__ */ i(z, { children: [
-    a && /* @__PURE__ */ e("div", { className: "fixed inset-0 z-[51] bg-[rgb(98,110,126)] bg-opacity-70" }),
+    n && /* @__PURE__ */ e("div", { className: "fixed inset-0 z-[51] bg-[rgb(98,110,126)] bg-opacity-70" }),
     /* @__PURE__ */ e("div", {
       style: { zIndex: 51 },
       className: h(q.dialog, !d && q.hidden),
@@ -80,10 +80,10 @@ var Ee = ({ onCloseText: u = "", onMinimizeText: N = "", onExpandText: I = "", o
     /* @__PURE__ */ i("div", {
       ref: S,
       style: le,
-      role: a ? "dialog" : void 0,
-      "aria-modal": a ? !0 : void 0,
-      "aria-label": a && typeof s == "string" ? s : void 0,
-      className: h("fixed bottom-4 right-4 z-[51] rounded-lg bg-white shadow-[0_4px_40px_0px_rgba(34,33,51,0.4)] transition-all duration-300", _ && !d && !o ? _ : "", d && "!h-0 !w-0 opacity-0 duration-0", a && "fixed duration-0"),
+      role: n ? "dialog" : void 0,
+      "aria-modal": n ? !0 : void 0,
+      "aria-label": n && typeof s == "string" ? s : void 0,
+      className: h("fixed bottom-4 right-4 z-[51] rounded-lg bg-white shadow-[0_4px_40px_0px_rgba(34,33,51,0.4)] transition-all duration-300", _ && !d && !a ? _ : "", d && "!h-0 !w-0 opacity-0 duration-0", n && "fixed duration-0"),
       "data-testid": F,
       children: [/* @__PURE__ */ i("div", {
         className: "flex flex-col gap-y-2 border-b-[1px] border-delta-200 p-4",
@@ -99,7 +99,7 @@ var Ee = ({ onCloseText: u = "", onMinimizeText: N = "", onExpandText: I = "", o
             className: "flex items-center gap-x-1",
             children: [
               X,
-              Q && /* @__PURE__ */ e(f, {
+              Q && !a && /* @__PURE__ */ e(f, {
                 title: l === "en" ? "Minimize" : "Minimer",
                 children: /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(t, {
                   dataTest: "minimize-button",
@@ -122,10 +122,10 @@ var Ee = ({ onCloseText: u = "", onMinimizeText: N = "", onExpandText: I = "", o
                   "aria-label": M ? void 0 : O,
                   variant: "textGray",
                   size: "small",
-                  onClick: (n) => {
-                    E !== void 0 && L ? L() : P(!R), n.detail !== 0 && n.currentTarget.blur();
+                  onClick: (o) => {
+                    E !== void 0 && L ? L() : P(!R), o.detail !== 0 && o.currentTarget.blur();
                   },
-                  endIcon: o ? /* @__PURE__ */ e(oe, {
+                  endIcon: a ? /* @__PURE__ */ e(oe, {
                     width: 20,
                     height: 20,
                     color: "text-delta-700"
@@ -160,10 +160,10 @@ var Ee = ({ onCloseText: u = "", onMinimizeText: N = "", onExpandText: I = "", o
           children: s
         })]
       }), /* @__PURE__ */ i("div", {
-        className: H("flex flex-col", o && !d && "h-[87dvh]"),
+        className: H("flex flex-col", a && !d && "h-[87dvh]"),
         children: [/* @__PURE__ */ e("div", {
           className: "flex-grow overflow-y-auto",
-          children: typeof g == "function" ? g({ fullScreen: o }) : g
+          children: typeof g == "function" ? g({ fullScreen: a }) : g
         }), (Array.isArray(r) && r.length || typeof r == "function") && m || D ? /* @__PURE__ */ i("div", {
           className: h("flex items-center justify-between border-0 border-t-[1px] border-solid border-delta-200 bg-white p-4", Y),
           children: [
@@ -180,11 +180,11 @@ var Ee = ({ onCloseText: u = "", onMinimizeText: N = "", onExpandText: I = "", o
               open: B,
               anchorEl: ee,
               onClose: te,
-              children: r.map((n) => /* @__PURE__ */ e(me, {
-                className: n.className,
-                onClick: n.onClick,
-                children: n.label
-              }, n.label))
+              children: r.map((o) => /* @__PURE__ */ e(me, {
+                className: o.className,
+                onClick: o.onClick,
+                children: o.label
+              }, o.label))
             })] }) : m && typeof r == "function" && /* @__PURE__ */ e(t, {
               dataTest: "extra-action-button",
               variant: "text",

package/dist/components/feedback/minimizable-dialog/v2/MinimizableDialogV2.js

@@ -10,17 +10,17 @@ import { useTranslations as V } from "./useTranslations.js";
 import { useControlledProps as _ } from "./useControlledProps.js";
 import $ from "clsx";
 import { useRef as A } from "react";
-import { Fragment as E, jsx as e, jsxs as t } from "react/jsx-runtime";
+import { Fragment as E, jsx as e, jsxs as o } from "react/jsx-runtime";
 var ee = (f) => {
-  const { showCloseIcon: u = !0, showMinimizeIcon: N = !0, showExpandIcon: w = !0, enableFullscreen: C = !0, title: o, label: m, children: F, open: h, onClose: T, classNameOverrides: d = {
+  const { showCloseIcon: u = !0, showMinimizeIcon: N = !0, showExpandIcon: w = !0, enableFullscreen: C = !0, title: n, label: m, children: F, open: h, onClose: T, classNameOverrides: d = {
     maximized: "",
     minimized: "",
     fullscreen: ""
-  }, dataTest: M, actionNode: S, locale: k = "en", style: v } = f, s = B(), n = V(k), b = A(null), { minimized: i, setMinimized: x, fullScreen: a, setFullScreen: g } = _(f), l = a && !i, p = () => {
+  }, dataTest: M, actionNode: S, locale: k = "en", style: v } = f, s = B(), a = V(k), b = A(null), { minimized: i, setMinimized: x, fullScreen: l, setFullScreen: g } = _(f), t = l && !i, p = () => {
     x(!1), T();
   };
-  D(h && l, b, p);
-  const I = l ? {
+  D(h && t, b, p);
+  const I = t ? {
     right: "auto",
     bottom: "auto",
     left: "50%",
@@ -30,27 +30,27 @@ var ee = (f) => {
     maxWidth: "min(1000px, calc(100vw - 32px))",
     height: "95dvh"
   } : void 0;
-  return h ? /* @__PURE__ */ t(E, { children: [
+  return h ? /* @__PURE__ */ o(E, { children: [
     /* @__PURE__ */ e("div", {
       style: {
         zIndex: 51,
         ...v
       },
       className: r(c["minimized-dialog"], !i && c.hidden, d.minimized),
-      children: /* @__PURE__ */ t("div", {
+      children: /* @__PURE__ */ o("div", {
         className: $("flex items-center justify-between", !i && "hidden"),
         "data-testid": M,
         children: [/* @__PURE__ */ e("div", {
           className: "max-w-[303px] truncate pr-1 text-lg font-semibold text-delta-800",
           children: /* @__PURE__ */ e(j, {
-            title: o,
+            title: n,
             placement: "top",
             children: /* @__PURE__ */ e("div", {
               className: "truncate",
-              children: o
+              children: n
             })
           })
-        }), /* @__PURE__ */ t("div", {
+        }), /* @__PURE__ */ o("div", {
           className: "flex items-center gap-x-1",
           children: [/* @__PURE__ */ e(z, {
             type: "expand",
@@ -58,72 +58,72 @@ var ee = (f) => {
             onClick: () => {
               x(!i);
             },
-            tooltipTitle: n.expand
+            tooltipTitle: a.expand
           }), /* @__PURE__ */ e(y, {
             showCloseIcon: u,
             onClick: p,
-            tooltipTitle: n.close
+            tooltipTitle: a.close
           })]
         })]
       })
     }),
-    l && /* @__PURE__ */ e("div", {
+    t && /* @__PURE__ */ e("div", {
       className: "fixed inset-0 z-[52] bg-[rgb(98,110,126)] bg-opacity-70",
       onClick: () => {
         g(!1);
       }
     }),
-    /* @__PURE__ */ t("div", {
+    /* @__PURE__ */ o("div", {
       style: {
         zIndex: 51,
         ...v,
         ...I
       },
       ref: b,
-      role: l ? "dialog" : void 0,
-      "aria-modal": l ? !0 : void 0,
-      "aria-label": l && typeof o == "string" ? o : void 0,
-      className: r(c.dialog, i && c.hidden, !a && d.maximized, a && d.fullscreen, l && "fixed z-[53] duration-0"),
-      children: [/* @__PURE__ */ t("div", {
+      role: t ? "dialog" : void 0,
+      "aria-modal": t ? !0 : void 0,
+      "aria-label": t && typeof n == "string" ? n : void 0,
+      className: r(c.dialog, i && c.hidden, !l && d.maximized, l && d.fullscreen, t && "fixed z-[53] duration-0"),
+      children: [/* @__PURE__ */ o("div", {
         className: r("flex flex-col border-b-[1px] border-delta-200 px-4", s ? "py-3" : "py-4"),
-        children: [/* @__PURE__ */ t("div", {
+        children: [/* @__PURE__ */ o("div", {
           className: "flex items-center justify-between",
           children: [m ? /* @__PURE__ */ e("div", {
             className: "text-sm text-delta-700",
             children: m
           }) : /* @__PURE__ */ e("div", {
             className: r("font-semibold text-delta-800", s ? "line-clamp-2 text-xl" : "line-clamp-1 text-2xl"),
-            children: o
-          }), /* @__PURE__ */ t("div", {
+            children: n
+          }), /* @__PURE__ */ o("div", {
             className: "flex items-center gap-x-1",
             children: [
               S,
               /* @__PURE__ */ e(z, {
-                visibility: N && !s,
+                visibility: N && !s && !l,
                 type: "minimize",
                 onClick: () => {
                   x(!i);
                 },
-                tooltipTitle: n.minimize
+                tooltipTitle: a.minimize
               }),
               /* @__PURE__ */ e(R, {
                 showFullScreenIcon: C && !s,
-                fullScreen: a,
+                fullScreen: l,
                 onClick: () => {
-                  g(!a);
+                  g(!l);
                 },
-                tooltipTitle: a ? n.exitFullscreen : n.fullscreen
+                tooltipTitle: l ? a.exitFullscreen : a.fullscreen
               }),
               /* @__PURE__ */ e(y, {
                 showCloseIcon: u,
                 onClick: p,
-                tooltipTitle: n.close
+                tooltipTitle: a.close
               })
             ]
           })]
         }), m && /* @__PURE__ */ e("div", {
           className: r("font-semibold text-delta-800", s ? "line-clamp-2 text-xl" : "line-clamp-1 text-2xl"),
-          children: o
+          children: n
         })]
       }), /* @__PURE__ */ e("div", {
         className: r(i && "hidden", "flex flex-grow flex-col overflow-y-auto"),

package/dist/components/mui-compat/Popper.js

@@ -1,35 +1,48 @@
-import { useState as P } from "react";
-import { jsx as r } from "react/jsx-runtime";
-import { FloatingPortal as y, autoUpdate as E, flip as F, shift as h, useFloating as w, useMergeRefs as M } from "@floating-ui/react";
-var j = ({ open: e = !1, anchorEl: s, id: l, placement: a = "bottom", transition: f, disablePortal: d, className: m, style: c, children: t }) => {
-  const [o, n] = P(!0);
-  e && o && n(!1);
-  const { refs: p, floatingStyles: u, placement: g } = w({
-    open: e,
-    placement: a,
-    whileElementsMounted: E,
-    elements: { reference: s ?? void 0 },
-    middleware: [F({ padding: 8 }), h({ padding: 8 })]
-  }), x = M([p.setFloating]);
-  if (!(e || f && !o)) return null;
-  const v = typeof t == "function" ? t({
+import { TOP_LAYER_PROPS as _, TOP_LAYER_RESET_STYLE as v, getOpenModalDialogAncestor as x, useTopLayerRef as y } from "../../hooks/useTopLayer.hook.js";
+import { useState as L } from "react";
+import { jsx as l } from "react/jsx-runtime";
+import { FloatingPortal as S, autoUpdate as b, flip as A, shift as O, useFloating as F, useMergeRefs as Y } from "@floating-ui/react";
+var w = {
+  ...v,
+  background: "transparent",
+  border: 0,
+  overflow: "visible",
+  padding: 0
+}, k = ({ open: t = !1, anchorEl: r, id: f, placement: d = "bottom", transition: p, disablePortal: m, className: g, style: c, children: o }) => {
+  const [n, a] = L(!0);
+  t && n && a(!1);
+  const e = x(r), { refs: i, floatingStyles: u, placement: R } = F({
+    open: t,
+    placement: d,
+    strategy: e ? "fixed" : "absolute",
+    whileElementsMounted: b,
+    elements: { reference: r ?? void 0 },
+    middleware: [A({ padding: 8 }), O({ padding: 8 })]
+  }), E = y(i.setFloating), P = Y([e ? E : i.setFloating]);
+  if (!(t || p && !n)) return null;
+  const T = typeof o == "function" ? o({
     TransitionProps: {
-      in: e,
-      onExited: () => n(!0)
+      in: t,
+      onExited: () => a(!0)
     },
-    placement: g
-  }) : t, i = /* @__PURE__ */ r("div", {
-    ref: x,
-    id: l,
+    placement: R
+  }) : o, s = /* @__PURE__ */ l("div", {
+    ref: P,
+    id: f,
+    ...e ? _ : {},
     style: {
+      ...e ? w : {},
       ...u,
       ...c
     },
-    className: m,
-    children: v
+    className: g,
+    children: T
+  });
+  return m ? s : /* @__PURE__ */ l(S, {
+    root: e,
+    children: s
   });
-  return d ? i : /* @__PURE__ */ r(y, { children: i });
 };
 export {
-  j as Popper
+  k as Popper
 };

package/dist/datetime/components/time-picker/TimePickerPopper.js

@@ -1,6 +1,6 @@
 import { StyledButton as r } from "../../shared-components/button/StyledButton.js";
-import { bindPopper as s } from "../../../hooks/usePopupState.js";
-import { Paper as l } from "../../../components/mui-compat/Paper.js";
+import { bindPopper as l } from "../../../hooks/usePopupState.js";
+import { Paper as s } from "../../../components/mui-compat/Paper.js";
 import { Fade as c } from "../../../components/mui-compat/Fade.js";
 import { Popper as f } from "../../../components/mui-compat/Popper.js";
 import h from "./StyledTimePicker.module.js";
@@ -12,16 +12,13 @@ import { jsx as t, jsxs as o } from "react/jsx-runtime";
 var I = (m) => {
   const { popupState: e, dataTest: a, value: i, onSelect: n, handleClear: p } = m;
   return /* @__PURE__ */ t(f, {
-    ...s(e),
+    ...l(e),
     transition: !0,
-    style: {
-      zIndex: "1300",
-      position: "absolute"
-    },
+    style: { zIndex: "1300" },
     children: ({ TransitionProps: d }) => /* @__PURE__ */ t(c, {
       ...d,
       timeout: 350,
-      children: /* @__PURE__ */ o(l, {
+      children: /* @__PURE__ */ o(s, {
         elevation: 0,
         className: y(h["time-picker-surface"]),
         style: { paddingBottom: "1px" },

package/dist/src/components/mui-compat/Popper.d.ts

@@ -24,6 +24,10 @@ export interface PopperProps {
  * content against `anchorEl`; with `transition`, renders children as a function receiving
  * `TransitionProps` (`in`/`onExited`) so a child `Fade` can animate and unmount. Public props
  * preserved (DEC-003). TASK-403.
+ *
+ * When `anchorEl` sits inside an open modal `<dialog>` the popper portals into that dialog and joins
+ * the top layer instead of the default `document.body` portal — a body portal is both occluded by
+ * the dialog and `inert`, so the popper looks dead on click. See `useTopLayer.hook`.
  */
 export declare const Popper: ({ open, anchorEl, id, placement, transition, disablePortal, className, style, children, }: PopperProps) => JSX.Element | null;
 export {};

package/package.json

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