asma-ui-core 3.110.0 → 3.112.0

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

@@ -1,35 +1,35 @@
-import { cn as f } from "../../../helpers/cn.js";
+import { cn as h } from "../../../helpers/cn.js";
 import { firstTabbable as me } from "../../../helpers/focusable.js";
 import { StyledTooltip as u } from "../../data-display/tooltip/StyledTooltip.js";
-import { DotsVerticalIcon as he } from "../../icons/dots-vertical-icon/DotsVerticalIcon.js";
+import { DotsVerticalIcon as fe } from "../../icons/dots-vertical-icon/DotsVerticalIcon.js";
 import { CloseIcon as K } from "../../icons/close-icon/CloseIcon.js";
-import { MinimizeIcon as fe } from "../../icons/minimize-icon/MinimizeIcon.js";
+import { MinimizeIcon as he } from "../../icons/minimize-icon/MinimizeIcon.js";
 import { KeyboardCapslockIcon as ue } from "../../icons/keyboard-capslock-icon/KeyboardCapslockIcon.js";
 import { ArrowExpandIcon as ve } from "../../icons/arrow-expand-icon/ArrowExpandIcon.js";
 import { ArrowShrinkIcon as be } from "../../icons/arrow-shrink-icon/ArrowShrinkIcon.js";
 import { StyledButton as r } from "../../inputs/button/StyledButton.js";
-import { OverlayBackOwnerContext as pe, useBackCloses as ge } from "../../../hooks/useBackCloses.hook.js";
-import { useFocusTrap as xe } from "../../../hooks/useFocusTrap.hook.js";
+import { OverlayBackOwnerContext as pe, isOverlayBackNavigationPending as ge, useBackCloses as xe } from "../../../hooks/useBackCloses.hook.js";
+import { useFocusTrap as ke } from "../../../hooks/useFocusTrap.hook.js";
 import { StyledMenu as ye } from "../../navigation/menu/StyledMenu.js";
-import { StyledMenuItem as ke } from "../../navigation/menu/StyledMenuItem.js";
-import { fullScreenFieldWidthVars as we } from "../../inputs/field-styles.js";
+import { StyledMenuItem as we } from "../../navigation/menu/StyledMenuItem.js";
+import { fullScreenFieldWidthVars as ze } from "../../inputs/field-styles.js";
 import T from "./MinimizableDialog.module.js";
-import { useToggleMenuVisibility as ze } from "../../../hooks/useToggleMenuVisibility.hook.js";
+import { useToggleMenuVisibility as Ne } from "../../../hooks/useToggleMenuVisibility.hook.js";
 import H from "clsx";
-import { useLayoutEffect as Ne, useRef as J, useState as Q } from "react";
+import { useLayoutEffect as Ce, useRef as J, useState as Q } from "react";
 import { Fragment as p, jsx as e, jsxs as l } from "react/jsx-runtime";
-var He = ({ onCloseText: v = "", onMinimizeText: C = "", onExpandText: I = "", onFullScreenText: M = "", showCloseIcon: R = !0, showMinimizeIcon: X = !0, showExpandIcon: Y = !0, showFullScreenIcon: Z = !0, title: m, label: g, children: x, open: y, onClose: L, className: j = "", primaryButtonText: S, primaryButtonLoading: n = !1, primaryButtonDisabled: B, primaryButtonDisabledReason: ee, secondaryButtonText: k, onPrimaryButtonClick: F, onSecondaryButtonClick: _, dataTest: E, actionNode: te, extraActions: d, extraActionsText: h, btnContainerClassName: G, footerClassName: ie, footerInfo: D, locale: t = "en", enableFullscreen: le = !0, fullScreenState: O, handleFullScreenState: V }) => {
-  const [i, re] = Q(!1), [q, ne] = Q(!1), { open: de, anchorEl: ae, handleOpen: oe, handleClose: se } = ze(), s = J(null), w = J(null), z = t === "en" ? "Wait until saved" : "Vent til lagringen er ferdig", b = () => {
+var Qe = ({ onCloseText: v = "", onMinimizeText: C = "", onExpandText: I = "", onFullScreenText: M = "", showCloseIcon: R = !0, showMinimizeIcon: X = !0, showExpandIcon: Y = !0, showFullScreenIcon: Z = !0, title: m, label: g, children: x, open: k, onClose: L, className: j = "", primaryButtonText: S, primaryButtonLoading: n = !1, primaryButtonDisabled: B, primaryButtonDisabledReason: ee, secondaryButtonText: y, onPrimaryButtonClick: F, onSecondaryButtonClick: _, dataTest: q, actionNode: te, extraActions: d, extraActionsText: f, btnContainerClassName: E, footerClassName: ie, footerInfo: G, locale: t = "en", enableFullscreen: le = !0, fullScreenState: O, handleFullScreenState: D }) => {
+  const [i, re] = Q(!1), [V, ne] = Q(!1), { open: de, anchorEl: ae, handleOpen: oe, handleClose: se } = Ne(), s = J(null), w = J(null), z = t === "en" ? "Wait until saved" : "Vent til lagringen er ferdig", b = () => {
     if (n) return !1;
     L();
-  }, o = O ?? q, a = o && !i;
-  if (xe(y && a, s, b), ge({
-    active: y && a,
-    requestClose: b,
+  }, o = O ?? V, a = o && !i;
+  if (ke(k && a, s, b), xe({
+    active: k && !i,
+    requestClose: () => !a && ge() ? !1 : b(),
     ownerRef: s
-  }), Ne(() => {
+  }), Ce(() => {
     s.current?.toggleAttribute("inert", i), w.current?.toggleAttribute("inert", !i);
-  }, [i]), !y) return null;
+  }, [i]), !k) return null;
   const ce = a ? {
     right: "auto",
     bottom: "auto",
@@ -38,15 +38,15 @@ var He = ({ onCloseText: v = "", onMinimizeText: C = "", onExpandText: I = "", o
     transform: "translate(-50%, -50%)",
     width: "min(1000px, calc(100vw - 32px))",
     height: "95dvh",
-    ...we
-  } : void 0, W = o ? t === "en" ? "Exit full screen" : "Avslutt fullskjerm" : t === "en" ? "Full screen" : "Fullskjerm", P = S ?? n, U = P || k, $ = /* @__PURE__ */ l(p, { children: [k && _ && /* @__PURE__ */ e(r, {
+    ...ze
+  } : void 0, P = o ? t === "en" ? "Exit full screen" : "Avslutt fullskjerm" : t === "en" ? "Full screen" : "Fullskjerm", W = S ?? n, U = W || y, $ = /* @__PURE__ */ l(p, { children: [y && _ && /* @__PURE__ */ e(r, {
     dataTest: "cancel-button",
     variant: "outlined",
     disabled: n,
     disabledReason: z,
     onClick: _,
-    children: k
-  }), P && F && /* @__PURE__ */ e(r, {
+    children: y
+  }), W && F && /* @__PURE__ */ e(r, {
     dataTest: "save-button",
     loading: n,
     locale: t,
@@ -66,10 +66,10 @@ var He = ({ onCloseText: v = "", onMinimizeText: C = "", onExpandText: I = "", o
     /* @__PURE__ */ e("div", {
       ref: w,
       style: { zIndex: 51 },
-      className: f(T.dialog, !i && T.hidden),
+      className: h(T.dialog, !i && T.hidden),
       children: /* @__PURE__ */ l("div", {
         className: H("flex items-center justify-between", !i && "hidden"),
-        "data-testid": E,
+        "data-testid": q,
         children: [/* @__PURE__ */ e("div", {
           className: "truncate text-lg font-semibold text-delta-800",
           children: m
@@ -118,8 +118,8 @@ var He = ({ onCloseText: v = "", onMinimizeText: C = "", onExpandText: I = "", o
       role: a ? "dialog" : void 0,
       "aria-modal": a ? !0 : void 0,
       "aria-label": a && typeof m == "string" ? m : void 0,
-      className: f("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", j && !i && !o ? j : "", i && "!h-0 !w-0 opacity-0 duration-0", a && "fixed duration-0"),
-      "data-testid": E,
+      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", j && !i && !o ? j : "", i && "!h-0 !w-0 opacity-0 duration-0", a && "fixed duration-0"),
+      "data-testid": q,
       children: /* @__PURE__ */ l(pe.Provider, {
         value: s,
         children: [/* @__PURE__ */ l("div", {
@@ -144,7 +144,7 @@ var He = ({ onCloseText: v = "", onMinimizeText: C = "", onExpandText: I = "", o
                     variant: "textGray",
                     size: "small",
                     onClick: A,
-                    endIcon: /* @__PURE__ */ e(fe, {
+                    endIcon: /* @__PURE__ */ e(he, {
                       height: 20,
                       width: 20,
                       color: "text-delta-700"
@@ -153,14 +153,14 @@ var He = ({ onCloseText: v = "", onMinimizeText: C = "", onExpandText: I = "", o
                   }) })
                 }),
                 le && Z && /* @__PURE__ */ e(u, {
-                  title: W,
+                  title: P,
                   children: /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(r, {
                     dataTest: "fullscreen-button",
-                    "aria-label": M ? void 0 : W,
+                    "aria-label": M ? void 0 : P,
                     variant: "textGray",
                     size: "small",
                     onClick: () => {
-                      O !== void 0 && V ? V() : ne(!q);
+                      O !== void 0 && D ? D() : ne(!V);
                     },
                     endIcon: o ? /* @__PURE__ */ e(be, {
                       width: 20,
@@ -204,42 +204,42 @@ var He = ({ onCloseText: v = "", onMinimizeText: C = "", onExpandText: I = "", o
           children: [/* @__PURE__ */ e("div", {
             className: "flex-grow overflow-y-auto overscroll-contain",
             children: typeof x == "function" ? x({ fullScreen: o }) : x
-          }), (Array.isArray(d) && d.length || typeof d == "function") && h || D ? /* @__PURE__ */ l("div", {
-            className: f("flex items-center justify-between border-0 border-t-[1px] border-solid border-delta-200 bg-white p-4", ie),
+          }), (Array.isArray(d) && d.length || typeof d == "function") && f || G ? /* @__PURE__ */ l("div", {
+            className: h("flex items-center justify-between border-0 border-t-[1px] border-solid border-delta-200 bg-white p-4", ie),
             children: [
-              Array.isArray(d) && d.length && h ? /* @__PURE__ */ l(p, { children: [/* @__PURE__ */ e(r, {
+              Array.isArray(d) && d.length && f ? /* @__PURE__ */ l(p, { children: [/* @__PURE__ */ e(r, {
                 dataTest: "extra-actions-button",
                 variant: "textGray",
-                startIcon: /* @__PURE__ */ e(he, {
+                startIcon: /* @__PURE__ */ e(fe, {
                   width: 24,
                   height: 24
                 }),
                 onClick: oe,
-                children: h
+                children: f
               }), /* @__PURE__ */ e(ye, {
                 open: de,
                 anchorEl: ae,
                 onClose: se,
-                children: d.map((c) => /* @__PURE__ */ e(ke, {
+                children: d.map((c) => /* @__PURE__ */ e(we, {
                   className: c.className,
                   onClick: c.onClick,
                   children: c.label
                 }, c.label))
-              })] }) : h && typeof d == "function" && /* @__PURE__ */ e(r, {
+              })] }) : f && typeof d == "function" && /* @__PURE__ */ e(r, {
                 dataTest: "extra-action-button",
                 variant: "text",
                 onClick: d,
-                children: h
+                children: f
               }),
               " ",
-              D,
+              G,
               U ? /* @__PURE__ */ e("div", {
-                className: f("flex justify-end gap-x-2", G),
+                className: h("flex justify-end gap-x-2", E),
                 children: $
               }) : null
             ]
           }) : /* @__PURE__ */ e(p, { children: U ? /* @__PURE__ */ e("div", {
-            className: f("flex justify-end gap-x-2 border-t-[1px] border-delta-200 p-4", G),
+            className: h("flex justify-end gap-x-2 border-t-[1px] border-delta-200 p-4", E),
             children: $
           }) : null })]
         })]
@@ -248,5 +248,5 @@ var He = ({ onCloseText: v = "", onMinimizeText: C = "", onExpandText: I = "", o
   ] });
 };
 export {
-  He as MinimizableDialog
+  Qe as MinimizableDialog
 };

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

@@ -1,57 +1,57 @@
 import { cn as a } from "../../../../helpers/cn.js";
-import { firstTabbable as O } from "../../../../helpers/focusable.js";
+import { firstTabbable as q } from "../../../../helpers/focusable.js";
 import { StyledTooltip as te } from "../../../data-display/tooltip/StyledTooltip.js";
-import { DialogBusyContext as A, useDialogBusyBoundary as ie } from "../../dialog/DialogBusyContext.js";
+import { DialogBusyContext as D, useDialogBusyBoundary as ie } from "../../dialog/DialogBusyContext.js";
 import { useMobileMediaQuery as le } from "../../../../hooks/useMediaQuery.hook.js";
-import { OverlayBackOwnerContext as ne, useBackCloses as oe } from "../../../../hooks/useBackCloses.hook.js";
-import { useFocusTrap as re } from "../../../../hooks/useFocusTrap.hook.js";
-import { fullScreenFieldWidthVars as se } from "../../../inputs/field-styles.js";
-import { CloseBtn as V } from "../components/CloseBtn.js";
-import { MinimizeBtn as $ } from "../components/MinimizeBtn.js";
-import { FullScreenBtn as ce } from "../components/FullscreenBtn.js";
+import { OverlayBackOwnerContext as ne, isOverlayBackNavigationPending as oe, useBackCloses as re } from "../../../../hooks/useBackCloses.hook.js";
+import { useFocusTrap as se } from "../../../../hooks/useFocusTrap.hook.js";
+import { fullScreenFieldWidthVars as ce } from "../../../inputs/field-styles.js";
+import { CloseBtn as A } from "../components/CloseBtn.js";
+import { MinimizeBtn as V } from "../components/MinimizeBtn.js";
+import { FullScreenBtn as ae } from "../components/FullscreenBtn.js";
 import h from "./MinimizableDialogV2.module.js";
-import { useTranslations as ae } from "./useTranslations.js";
-import { useControlledProps as de } from "./useControlledProps.js";
-import me from "clsx";
-import { useId as q, useLayoutEffect as W, useRef as d } from "react";
-import { Fragment as ue, jsx as e, jsxs as r } from "react/jsx-runtime";
-var Me = (C) => {
-  const { showCloseIcon: R = !0, showMinimizeIcon: H = !0, showExpandIcon: L = !0, enableFullscreen: _ = !0, title: u, label: f, children: Q, open: i, onClose: U, classNameOverrides: b = {
+import { useTranslations as de } from "./useTranslations.js";
+import { useControlledProps as me } from "./useControlledProps.js";
+import ue from "clsx";
+import { useId as $, useLayoutEffect as W, useRef as d } from "react";
+import { Fragment as fe, jsx as e, jsxs as r } from "react/jsx-runtime";
+var Ee = (w) => {
+  const { showCloseIcon: N = !0, showMinimizeIcon: H = !0, showExpandIcon: L = !0, enableFullscreen: _ = !0, title: u, label: f, children: Q, open: i, onClose: U, classNameOverrides: b = {
     maximized: "",
     minimized: "",
     fullscreen: ""
-  }, dataTest: G, actionNode: J, locale: K = "en", busyReason: X, style: N, initialFocusRef: S } = C, s = le(), l = ae(K), n = d(null), p = d(null), F = d(null), B = d(null), g = d(!1), y = d(null), x = q(), T = q(), { minimized: t, setMinimized: I, fullScreen: o, setFullScreen: M } = de(C), c = o && !t, { busy: z, busyReason: k, contextValue: E } = ie(X ?? l.waitUntilSaved), v = () => {
+  }, dataTest: G, actionNode: J, locale: K = "en", busyReason: X, style: R, initialFocusRef: B } = w, s = le(), l = de(K), n = d(null), p = d(null), S = d(null), F = d(null), g = d(!1), y = d(null), x = $(), k = $(), { minimized: t, setMinimized: T, fullScreen: o, setFullScreen: I } = me(w), c = o && !t, { busy: z, busyReason: M, contextValue: E } = ie(X ?? l.waitUntilSaved), v = () => {
     if (z) return !1;
-    I(!1), U();
+    T(!1), U();
   };
   W(() => {
     n.current?.toggleAttribute("inert", t), p.current?.toggleAttribute("inert", !t);
   }, [t]), W(() => {
-    const w = i && !g.current, m = !i && g.current;
+    const C = i && !g.current, m = !i && g.current;
     if (g.current = i, m) {
-      const D = y.current;
-      y.current = null, (!document.activeElement || document.activeElement === document.body) && D?.isConnected && D.focus({ preventScroll: !0 });
+      const O = y.current;
+      y.current = null, (!document.activeElement || document.activeElement === document.body) && O?.isConnected && O.focus({ preventScroll: !0 });
       return;
     }
-    if (!w) return;
+    if (!C) return;
     y.current = document.activeElement instanceof HTMLElement ? document.activeElement : null;
-    const P = t ? p.current : n.current, ee = t ? B.current : F.current;
-    (S?.current ?? ee ?? (P ? O(P) : void 0))?.focus({ preventScroll: !0 });
+    const j = t ? p.current : n.current, ee = t ? F.current : S.current;
+    (B?.current ?? ee ?? (j ? q(j) : void 0))?.focus({ preventScroll: !0 });
   }, [
-    S,
+    B,
     t,
     i
   ]);
-  const j = () => {
-    const w = t ? n : p;
-    I(!t), requestAnimationFrame(() => {
-      const m = w.current;
-      m && (m.querySelector('[data-testid="toggle-minimize-btn"]') ?? O(m))?.focus({ preventScroll: !0 });
+  const P = () => {
+    const C = t ? n : p;
+    T(!t), requestAnimationFrame(() => {
+      const m = C.current;
+      m && (m.querySelector('[data-testid="toggle-minimize-btn"]') ?? q(m))?.focus({ preventScroll: !0 });
     });
   };
-  re(i && c, n, v), oe({
-    active: i && c,
-    requestClose: v,
+  se(i && c, n, v), re({
+    active: i && !t,
+    requestClose: () => !c && oe() ? !1 : v(),
     ownerRef: n
   });
   const Y = c ? s ? {
@@ -70,20 +70,20 @@ var Me = (C) => {
     width: "min(1000px, calc(100vw - 32px))",
     maxWidth: "min(1000px, calc(100vw - 32px))",
     height: "95dvh",
-    ...se
+    ...ce
   } : void 0;
   if (!i) return null;
-  const Z = f ? `${T} ${x}` : x;
-  return /* @__PURE__ */ r(ue, { children: [
+  const Z = f ? `${k} ${x}` : x;
+  return /* @__PURE__ */ r(fe, { children: [
     /* @__PURE__ */ e("div", {
       ref: p,
       style: {
         zIndex: 51,
-        ...N
+        ...R
       },
       className: a(h["minimized-dialog"], !t && h.hidden, b.minimized),
       children: /* @__PURE__ */ r("div", {
-        className: me("flex items-center justify-between", !t && "hidden"),
+        className: ue("flex items-center justify-between", !t && "hidden"),
         "data-testid": G,
         children: [/* @__PURE__ */ e("div", {
           className: "max-w-[303px] truncate pr-1 text-lg font-semibold text-delta-800",
@@ -97,16 +97,16 @@ var Me = (C) => {
           })
         }), /* @__PURE__ */ r("div", {
           className: "flex items-center gap-x-1",
-          children: [/* @__PURE__ */ e($, {
+          children: [/* @__PURE__ */ e(V, {
             type: "expand",
             visibility: L,
-            onClick: j,
+            onClick: P,
             tooltipTitle: l.expand
-          }), /* @__PURE__ */ e(V, {
-            buttonRef: B,
-            showCloseIcon: R,
+          }), /* @__PURE__ */ e(A, {
+            buttonRef: F,
+            showCloseIcon: N,
             onClick: v,
-            disabledReason: z ? k : void 0,
+            disabledReason: z ? M : void 0,
             tooltipTitle: l.close
           })]
         })]
@@ -115,13 +115,13 @@ var Me = (C) => {
     c && /* @__PURE__ */ e("div", {
       className: "fixed inset-0 z-[52] bg-[rgb(98,110,126)] bg-opacity-70",
       onClick: () => {
-        M(!1);
+        I(!1);
       }
     }),
     /* @__PURE__ */ e("div", {
       style: {
         zIndex: 51,
-        ...N,
+        ...R,
         ...Y
       },
       ref: n,
@@ -136,7 +136,7 @@ var Me = (C) => {
           children: [/* @__PURE__ */ r("div", {
             className: "flex items-center justify-between",
             children: [f ? /* @__PURE__ */ e("div", {
-              id: T,
+              id: k,
               className: "text-sm text-delta-700",
               children: f
             }) : /* @__PURE__ */ e("div", {
@@ -146,29 +146,29 @@ var Me = (C) => {
             }), /* @__PURE__ */ r("div", {
               className: "flex items-center gap-x-1",
               children: [
-                /* @__PURE__ */ e(A.Provider, {
+                /* @__PURE__ */ e(D.Provider, {
                   value: E,
                   children: J
                 }),
-                /* @__PURE__ */ e($, {
+                /* @__PURE__ */ e(V, {
                   visibility: H && !s && !o,
                   type: "minimize",
-                  onClick: j,
+                  onClick: P,
                   tooltipTitle: l.minimize
                 }),
-                /* @__PURE__ */ e(ce, {
+                /* @__PURE__ */ e(ae, {
                   showFullScreenIcon: _ && !s,
                   fullScreen: o,
                   onClick: () => {
-                    M(!o);
+                    I(!o);
                   },
                   tooltipTitle: o ? l.exitFullscreen : l.fullscreen
                 }),
-                /* @__PURE__ */ e(V, {
-                  buttonRef: F,
-                  showCloseIcon: R,
+                /* @__PURE__ */ e(A, {
+                  buttonRef: S,
+                  showCloseIcon: N,
                   onClick: v,
-                  disabledReason: z ? k : void 0,
+                  disabledReason: z ? M : void 0,
                   tooltipTitle: l.close
                 })
               ]
@@ -180,7 +180,7 @@ var Me = (C) => {
           })]
         }), /* @__PURE__ */ e("div", {
           className: a(t && "hidden", "flex flex-grow flex-col overflow-y-auto overscroll-contain"),
-          children: /* @__PURE__ */ e(A.Provider, {
+          children: /* @__PURE__ */ e(D.Provider, {
             value: E,
             children: Q
           })
@@ -190,5 +190,5 @@ var Me = (C) => {
   ] });
 };
 export {
-  Me as MinimizableDialogV2
+  Ee as MinimizableDialogV2
 };