asma-ui-core 3.105.0 → 3.107.0

package/dist/components/feedback/dialog/dialog-footer/StyledDialogFooter.js

@@ -1,97 +1,102 @@
-import { cn as $ } from "../../../../helpers/cn.js";
-import { DotsVerticalIcon as z } from "../../../icons/dots-vertical-icon/DotsVerticalIcon.js";
-import { LoadingIcon as F } from "../../../icons/loading-icon/LoadingIcon.js";
-import { StyledTooltip as j } from "../../../data-display/tooltip/StyledTooltip.js";
-import { StyledButton as y } from "../../../inputs/button/StyledButton.js";
-import { StyledMenu as K } from "../../../navigation/menu/StyledMenu.js";
-import { StyledMenuItem as D } from "../../../navigation/menu/StyledMenuItem.js";
-import { useElementWidthPx as H } from "../../../../hooks/useElementWidthPx.js";
-import { useWidthRegistry as U } from "../../../../hooks/useWidthRegistry.js";
-import { planToolbarActions as G } from "../../../custom/module/header-layout/planToolbarActions.js";
-import { ToolbarActionButton as V } from "../../../custom/module/header-layout/ToolbarActionGroup.js";
-import { useToolbarTranslations as X } from "../../../custom/module/header-layout/useTranslations.js";
-import { useMemo as C, useState as Y } from "react";
-import { Fragment as N, jsx as r, jsxs as n } from "react/jsx-runtime";
-var q = 2, J = 470, Q = 8, k = "dialog-footer-right", M = "dialog-footer-more", O = (l, a) => `dialog-footer-action:${l}:${a ? "label" : "icon"}`;
-function pe({ leftActions: l = [], leadingSlot: a, secondaryAction: s, primaryAction: d, fixed: I = !1, rounded: _ = !0, locale: A = "en", className: E, dataTest: c = "styled-dialog-footer" }) {
-  const P = X(A), { ref: R, widthPx: m } = H(), { register: f, widths: t } = U(), [p, h] = Y(null), g = m > 0 && m < J, W = g ? 8 : 16, o = C(() => l.filter((e) => !e.hidden).map((e) => e.icon == null && e.canHideLabel == null ? {
+import { cn as j } from "../../../../helpers/cn.js";
+import { StyledTooltip as K } from "../../../data-display/tooltip/StyledTooltip.js";
+import { DotsVerticalIcon as U } from "../../../icons/dots-vertical-icon/DotsVerticalIcon.js";
+import { DialogBusyContext as H, WAIT_UNTIL_SAVED as V, useReportDialogBusy as G } from "../DialogBusyContext.js";
+import { StyledButton as P } from "../../../inputs/button/StyledButton.js";
+import { StyledMenu as X } from "../../../navigation/menu/StyledMenu.js";
+import { StyledMenuItem as Y } from "../../../navigation/menu/StyledMenuItem.js";
+import { useElementWidthPx as q } from "../../../../hooks/useElementWidthPx.js";
+import { useWidthRegistry as J } from "../../../../hooks/useWidthRegistry.js";
+import { planToolbarActions as Q } from "../../../custom/module/header-layout/planToolbarActions.js";
+import { ToolbarActionButton as Z, overflowItemState as ee } from "../../../custom/module/header-layout/ToolbarActionGroup.js";
+import { useToolbarTranslations as oe } from "../../../custom/module/header-layout/useTranslations.js";
+import { useContext as re, useMemo as R, useState as le } from "react";
+import { Fragment as _, jsx as o, jsxs as d } from "react/jsx-runtime";
+var ne = 2, ie = 470, te = 8, M = "dialog-footer-right", O = "dialog-footer-more", k = (l, n) => `dialog-footer-action:${l}:${n ? "label" : "icon"}`;
+function Te({ leftActions: l = [], leadingSlot: n, secondaryAction: c, primaryAction: m, fixed: E = !1, rounded: W = !0, locale: i = "en", className: S, dataTest: f = "styled-dialog-footer" }) {
+  const b = re(H), p = oe(i), { ref: L, widthPx: h } = q(), { register: u, widths: t } = J(), [g, x] = le(null), y = h > 0 && h < ie, D = y ? 8 : 16, a = R(() => l.filter((e) => !e.hidden).map((e) => e.icon == null && e.canHideLabel == null ? {
     ...e,
     canHideLabel: !1
-  } : e), [l]), B = t[k] ?? 0, x = s != null || d != null, v = Math.max(0, m - W * 2 - B - (x ? Q : 0)), u = C(() => o.length >= q ? {
+  } : e), [l]), $ = t[M] ?? 0, T = c != null || m != null, B = Math.max(0, h - D * 2 - $ - (T ? te : 0)), s = R(() => a.length >= ne ? {
     inlineActions: [],
-    overflowActions: o,
+    overflowActions: a,
     showMoreMenu: !0
-  } : G({
-    actions: o,
-    availableWidth: v,
+  } : Q({
+    actions: a,
+    availableWidth: B,
     collapseLabels: !0,
-    resolveActionWidth: (e, i) => t[O(e.id, i)],
-    moreButtonWidthPx: t[M]
+    resolveActionWidth: (e, r) => t[k(e.id, r)],
+    moreButtonWidthPx: t[O]
   }), [
-    o,
-    v,
+    a,
+    B,
     t
-  ]), b = (e, i, L) => {
-    const T = !!e.disabled || !!e.loading, w = /* @__PURE__ */ r(y, {
-      dataTest: e.dataTest ?? `${c}-${L}`,
-      variant: e.variant ?? i,
+  ]);
+  G(n == null && s.overflowActions.some((e) => !!e.loading && e.holdsDialog !== !1));
+  const C = (e, r, w) => {
+    const N = w === "secondary" && b?.busy, v = !!e.disabled || !!N, A = N ? b.busyReason ?? V[i] : e.tooltip, I = v || !!e.loading, z = /* @__PURE__ */ o(P, {
+      locale: i,
+      dataTest: e.dataTest ?? `${f}-${w}`,
+      variant: e.variant ?? r,
       error: e.tone === "danger",
       size: "medium",
       type: e.type ?? "button",
-      "aria-disabled": T || void 0,
+      disabled: v && !!A,
+      "aria-disabled": I || void 0,
+      disabledReason: A,
+      loading: !!e.loading,
       startIcon: e.icon,
-      endIcon: e.loading ? /* @__PURE__ */ r(F, {
-        width: 20,
-        height: 20
-      }) : e.endIcon,
-      onClick: T ? (S) => S.preventDefault() : e.onClick,
+      endIcon: e.endIcon,
+      onClick: I ? (F) => F.preventDefault() : e.onClick,
       "aria-label": e.ariaLabel,
-      "aria-busy": e.loading,
       children: e.label
     });
-    return e.tooltip ? /* @__PURE__ */ r(j, {
+    return /* @__PURE__ */ o(K, {
       arrow: !0,
       title: e.tooltip,
-      children: /* @__PURE__ */ r("span", {
+      open: v || !e.tooltip ? !1 : void 0,
+      children: /* @__PURE__ */ o("span", {
         className: "inline-flex",
-        children: w
+        children: z
       })
-    }) : w;
+    });
   };
-  return /* @__PURE__ */ n("div", {
-    ref: R,
-    "data-testid": c,
-    className: $("flex items-center justify-end self-stretch border-0 border-t border-solid border-delta-200 bg-white", g ? "gap-2 p-2" : "gap-4 p-4", _ && "rounded-b-lg", I && "sticky bottom-0 z-[1]", E),
-    children: [/* @__PURE__ */ r("div", {
+  return /* @__PURE__ */ d("div", {
+    ref: L,
+    "data-testid": f,
+    className: j("flex items-center justify-end self-stretch border-0 border-t border-solid border-delta-200 bg-white", y ? "gap-2 p-2" : "gap-4 p-4", W && "rounded-b-lg", E && "sticky bottom-0 z-[1]", S),
+    children: [/* @__PURE__ */ o("div", {
       className: "flex shrink-0 flex-nowrap items-center gap-2",
-      children: a ?? /* @__PURE__ */ n(N, { children: [u.inlineActions.map(({ action: e, showLabel: i }) => /* @__PURE__ */ r("span", {
-        ref: f(O(e.id, i)),
+      children: n ?? /* @__PURE__ */ d(_, { children: [s.inlineActions.map(({ action: e, showLabel: r }) => /* @__PURE__ */ o("span", {
+        ref: u(k(e.id, r)),
         className: "inline-flex shrink-0",
-        children: /* @__PURE__ */ r(V, {
+        children: /* @__PURE__ */ o(Z, {
           action: e,
-          showLabel: i
+          showLabel: r,
+          inProgressLabel: p.inProgress
         })
-      }, e.id)), u.showMoreMenu && /* @__PURE__ */ n(N, { children: [/* @__PURE__ */ r("span", {
-        ref: f(M),
+      }, e.id)), s.showMoreMenu && /* @__PURE__ */ d(_, { children: [/* @__PURE__ */ o("span", {
+        ref: u(O),
         className: "inline-flex shrink-0",
-        children: /* @__PURE__ */ r(y, {
-          dataTest: `${c}-more`,
+        children: /* @__PURE__ */ o(P, {
+          locale: i,
+          dataTest: `${f}-more`,
           variant: "outlined",
           size: "medium",
           type: "button",
-          onClick: (e) => h(e.currentTarget),
-          "aria-label": P.more,
+          onClick: (e) => x(e.currentTarget),
+          "aria-label": p.more,
           "aria-haspopup": "menu",
-          "aria-expanded": p != null,
-          startIcon: /* @__PURE__ */ r(z, {
+          "aria-expanded": g != null,
+          startIcon: /* @__PURE__ */ o(U, {
             width: 24,
             height: 24
           })
         })
-      }), /* @__PURE__ */ r(K, {
-        anchorEl: p,
-        open: p != null,
-        onClose: () => h(null),
+      }), /* @__PURE__ */ o(X, {
+        anchorEl: g,
+        open: g != null,
+        onClose: () => x(null),
         anchorOrigin: {
           vertical: "top",
           horizontal: "left"
@@ -100,27 +105,27 @@ function pe({ leftActions: l = [], leadingSlot: a, secondaryAction: s, primaryAc
           vertical: "bottom",
           horizontal: "left"
         },
-        children: u.overflowActions.map((e) => /* @__PURE__ */ r(D, {
-          disabled: e.disabled,
+        children: s.overflowActions.map((e) => /* @__PURE__ */ o(Y, {
+          ...ee(e, p.inProgress),
           onClick: () => {
-            h(null), e.onClick();
+            x(null), e.onClick();
           },
-          children: /* @__PURE__ */ r("span", {
+          children: /* @__PURE__ */ o("span", {
             className: e.tone === "danger" ? "text-beta-500" : "text-delta-700",
             children: e.label
           })
         }, e.id))
       })] })] })
-    }), x && /* @__PURE__ */ r("span", {
+    }), T && /* @__PURE__ */ o("span", {
       className: "flex min-w-px flex-1 flex-nowrap items-center justify-end",
-      children: /* @__PURE__ */ n("span", {
-        ref: f(k),
+      children: /* @__PURE__ */ d("span", {
+        ref: u(M),
         className: "flex shrink-0 flex-nowrap items-center gap-2",
-        children: [s && b(s, "outlined", "secondary"), d && b(d, "contained", "primary")]
+        children: [c && C(c, "outlined", "secondary"), m && C(m, "contained", "primary")]
       })
     })]
   });
 }
 export {
-  pe as StyledDialogFooter
+  Te as StyledDialogFooter
 };

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

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

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

@@ -1,19 +1,22 @@
-import { CloseIcon as i } from "../../../icons/close-icon/CloseIcon.js";
 import { StyledTooltip as n } from "../../../data-display/tooltip/StyledTooltip.js";
-import { StyledButton as a } from "../../../inputs/button/StyledButton.js";
+import { CloseIcon as a } from "../../../icons/close-icon/CloseIcon.js";
+import { StyledButton as m } from "../../../inputs/button/StyledButton.js";
 import "react";
 import { jsx as t } from "react/jsx-runtime";
-var h = ({ showCloseIcon: e, tooltipTitle: r, onClick: o, buttonRef: l }) => e ? /* @__PURE__ */ t(n, {
+var u = ({ showCloseIcon: e, tooltipTitle: r, onClick: l, buttonRef: i, disabledReason: o }) => e ? /* @__PURE__ */ t(n, {
   title: r,
   placement: "top",
-  children: /* @__PURE__ */ t("div", { children: /* @__PURE__ */ t(a, {
+  open: o ? !1 : void 0,
+  children: /* @__PURE__ */ t("div", { children: /* @__PURE__ */ t(m, {
     dataTest: "close-button",
-    refLink: l,
+    refLink: i,
     "aria-label": r,
     variant: "textGray",
     size: "small",
-    onClick: o,
-    endIcon: /* @__PURE__ */ t(i, {
+    disabled: !!o,
+    disabledReason: o,
+    onClick: l,
+    endIcon: /* @__PURE__ */ t(a, {
       height: 20,
       width: 20,
       color: "text-delta-700"
@@ -21,5 +24,5 @@ var h = ({ showCloseIcon: e, tooltipTitle: r, onClick: o, buttonRef: l }) => e ?
   }) })
 }) : null;
 export {
-  h as CloseBtn
+  u as CloseBtn
 };