@rio-cloud/rio-uikit 2.5.1 → 3.0.0-beta.1

package/components/dialog/ConfirmationDialog.d.ts

@@ -1,4 +1,5 @@
 import { default as React } from 'react';
+import { BUTTON_STYLE } from '../button/Button';
 import { AutoTrackingAttributes } from '../../utils/analytics/autoTracking';
 import { BaseDialogProps } from './Dialog';
 export type ConfirmationDialogProps = BaseDialogProps & {
@@ -22,6 +23,10 @@ export type ConfirmationDialogProps = BaseDialogProps & {
      * The content of the cancel button. (Usually a text, can also be a FormattedMessage component).
      */
     cancelButtonText?: string | React.ReactNode;
+    /**
+     * Sets the style of the cancel button.
+     */
+    cancelButtonBsStyle?: BUTTON_STYLE;
     /**
      * Optional key used to generate automatic GA tracking attributes for the cancel button.
      */
@@ -34,6 +39,12 @@ export type ConfirmationDialogProps = BaseDialogProps & {
      * The content of the confirmation button. Since it is a node, it can be a simple text or any JSX node like a div element with an icon and a text.
      */
     confirmButtonText?: string | React.ReactNode;
+    /**
+     * Sets the style of the confirmation button.
+     *
+     * @default 'primary'
+     */
+    confirmButtonBsStyle?: BUTTON_STYLE;
     /**
      * Optional key used to generate automatic GA tracking attributes for the confirmation button.
      */

package/components/dialog/ConfirmationDialog.js

@@ -1,58 +1,39 @@
-import { jsxs as k, jsx as o } from "react/jsx-runtime";
+import e from "../button/Button.js";
+import t from "./Dialog.js";
 import { noop as n } from "es-toolkit/function";
-import i from "../button/Button.js";
-import B from "./Dialog.js";
-const x = (r) => {
-  const {
-    content: a,
-    onClickCancel: t = n,
-    cancelButtonText: c,
-    cancelButtonAutoTrackingKey: e,
-    cancelButtonTrackingAttributes: l,
-    onClickConfirm: s = n,
-    confirmButtonText: m,
-    confirmButtonAutoTrackingKey: u,
-    confirmButtonTrackingAttributes: f,
-    disableConfirm: C,
-    ...d
-  } = r, g = /* @__PURE__ */ k("div", { className: "btn-toolbar", children: [
-    /* @__PURE__ */ o(
-      i,
-      {
-        className: "CancelButton",
-        onClick: t,
-        autoTrackingKey: e,
-        ...l,
-        children: c
-      }
-    ),
-    /* @__PURE__ */ o(
-      i,
-      {
-        bsStyle: "primary",
-        className: "ConfirmationButton",
-        onClick: s,
-        disabled: C,
-        autoTrackingKey: u,
-        ...f,
-        children: m
-      }
-    )
-  ] });
-  return /* @__PURE__ */ o(
-    B,
-    {
-      ...d,
-      body: a,
-      footer: g,
-      onClose: t,
-      showCloseButton: !1,
-      className: "confirmation-dialog",
-      disableEsc: !0
-    }
-  );
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+//#region src/components/dialog/ConfirmationDialog.tsx
+var a = (a) => {
+	let { content: o, onClickCancel: s = n, cancelButtonText: c, cancelButtonBsStyle: l, cancelButtonAutoTrackingKey: u, cancelButtonTrackingAttributes: d, onClickConfirm: f = n, confirmButtonText: p, confirmButtonBsStyle: m = "primary", confirmButtonAutoTrackingKey: h, confirmButtonTrackingAttributes: g, disableConfirm: _, ...v } = a, y = /* @__PURE__ */ i("div", {
+		className: "btn-toolbar",
+		children: [/* @__PURE__ */ r(e, {
+			bsStyle: l,
+			className: "CancelButton",
+			onClick: s,
+			autoTrackingKey: u,
+			...d,
+			children: c
+		}), /* @__PURE__ */ r(e, {
+			bsStyle: m,
+			className: "ConfirmationButton",
+			onClick: f,
+			disabled: _,
+			autoTrackingKey: h,
+			...g,
+			children: p
+		})]
+	});
+	return /* @__PURE__ */ r(t, {
+		...v,
+		body: o,
+		footer: y,
+		onClose: s,
+		showCloseButton: !1,
+		className: "confirmation-dialog",
+		disableEsc: !0
+	});
 };
-export {
-  x as default
-};
-//# sourceMappingURL=ConfirmationDialog.js.map
+//#endregion
+export { a as default };
+
+//# sourceMappingURL=ConfirmationDialog.js.map

package/components/dialog/ConfirmationDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"ConfirmationDialog.js","sources":["../../../src/components/dialog/ConfirmationDialog.tsx"],"sourcesContent":["import type React from 'react';\nimport { noop } from 'es-toolkit/function';\n\nimport Button from '../button/Button';\nimport type { AutoTrackingAttributes } from '../../utils/analytics/autoTracking';\nimport Dialog, { type BaseDialogProps } from './Dialog';\n\nexport type ConfirmationDialogProps = BaseDialogProps & {\n    /**\n     * The content of the dialog body itself\n     */\n    content?: string | React.ReactNode;\n\n    /**\n     * A callback fired when the confirmation button is clicked.\n     *\n     * @default () => {}\n     */\n    onClickConfirm?: VoidFunction;\n\n    /**\n     * A callback fired when the cancel button is clicked or the dialog is closed.\n     *\n     * @default () => {}\n     */\n    onClickCancel?: VoidFunction;\n\n    /**\n     * The content of the cancel button. (Usually a text, can also be a FormattedMessage component).\n     */\n    cancelButtonText?: string | React.ReactNode;\n\n    /**\n     * Optional key used to generate automatic GA tracking attributes for the cancel button.\n     */\n    cancelButtonAutoTrackingKey?: string;\n\n    /**\n     * Optional tracking attributes (e.g. from `getTrackingAttributes`) added to the cancel button.\n     */\n    cancelButtonTrackingAttributes?: AutoTrackingAttributes;\n\n    /**\n     * The content of the confirmation button. Since it is a node, it can be a simple text or any JSX node like a div element with an icon and a text.\n     */\n    confirmButtonText?: string | React.ReactNode;\n\n    /**\n     * Optional key used to generate automatic GA tracking attributes for the confirmation button.\n     */\n    confirmButtonAutoTrackingKey?: string;\n\n    /**\n     * Optional tracking attributes (e.g. from `getTrackingAttributes`) added to the confirmation button.\n     */\n    confirmButtonTrackingAttributes?: AutoTrackingAttributes;\n\n    /**\n     * When set to `true` the confirmation button will be disabled.\n     */\n    disableConfirm?: boolean;\n};\n\nconst ConfirmationDialog = (props: ConfirmationDialogProps) => {\n    const {\n        content,\n        onClickCancel = noop,\n        cancelButtonText,\n        cancelButtonAutoTrackingKey,\n        cancelButtonTrackingAttributes,\n        onClickConfirm = noop,\n        confirmButtonText,\n        confirmButtonAutoTrackingKey,\n        confirmButtonTrackingAttributes,\n        disableConfirm,\n        ...remainingProps\n    } = props;\n\n    const footer = (\n        <div className='btn-toolbar'>\n            <Button\n                className='CancelButton'\n                onClick={onClickCancel}\n                autoTrackingKey={cancelButtonAutoTrackingKey}\n                {...cancelButtonTrackingAttributes}\n            >\n                {cancelButtonText}\n            </Button>\n            <Button\n                bsStyle='primary'\n                className='ConfirmationButton'\n                onClick={onClickConfirm}\n                disabled={disableConfirm}\n                autoTrackingKey={confirmButtonAutoTrackingKey}\n                {...confirmButtonTrackingAttributes}\n            >\n                {confirmButtonText}\n            </Button>\n        </div>\n    );\n\n    return (\n        <Dialog\n            {...remainingProps}\n            body={content}\n            footer={footer}\n            onClose={onClickCancel}\n            showCloseButton={false}\n            className='confirmation-dialog'\n            disableEsc\n        />\n    );\n};\n\nexport default ConfirmationDialog;\n"],"names":["ConfirmationDialog","props","content","onClickCancel","noop","cancelButtonText","cancelButtonAutoTrackingKey","cancelButtonTrackingAttributes","onClickConfirm","confirmButtonText","confirmButtonAutoTrackingKey","confirmButtonTrackingAttributes","disableConfirm","remainingProps","footer","jsxs","jsx","Button","Dialog"],"mappings":";;;;AA+DA,MAAMA,IAAqB,CAACC,MAAmC;AAC3D,QAAM;AAAA,IACF,SAAAC;AAAA,IACA,eAAAC,IAAgBC;AAAA,IAChB,kBAAAC;AAAA,IACA,6BAAAC;AAAA,IACA,gCAAAC;AAAA,IACA,gBAAAC,IAAiBJ;AAAA,IACjB,mBAAAK;AAAA,IACA,8BAAAC;AAAA,IACA,iCAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,IACHZ,GAEEa,IACF,gBAAAC,EAAC,OAAA,EAAI,WAAU,eACX,UAAA;AAAA,IAAA,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QACG,WAAU;AAAA,QACV,SAASd;AAAA,QACT,iBAAiBG;AAAA,QAChB,GAAGC;AAAA,QAEH,UAAAF;AAAA,MAAA;AAAA,IAAA;AAAA,IAEL,gBAAAW;AAAA,MAACC;AAAA,MAAA;AAAA,QACG,SAAQ;AAAA,QACR,WAAU;AAAA,QACV,SAAST;AAAA,QACT,UAAUI;AAAA,QACV,iBAAiBF;AAAA,QAChB,GAAGC;AAAA,QAEH,UAAAF;AAAA,MAAA;AAAA,IAAA;AAAA,EACL,GACJ;AAGJ,SACI,gBAAAO;AAAA,IAACE;AAAA,IAAA;AAAA,MACI,GAAGL;AAAA,MACJ,MAAMX;AAAA,MACN,QAAAY;AAAA,MACA,SAASX;AAAA,MACT,iBAAiB;AAAA,MACjB,WAAU;AAAA,MACV,YAAU;AAAA,IAAA;AAAA,EAAA;AAGtB;"}
+{"version":3,"file":"ConfirmationDialog.js","names":[],"sources":["../../../src/components/dialog/ConfirmationDialog.tsx"],"sourcesContent":["import type React from 'react';\nimport { noop } from 'es-toolkit/function';\n\nimport Button, { type BUTTON_STYLE } from '../button/Button';\nimport type { AutoTrackingAttributes } from '../../utils/analytics/autoTracking';\nimport Dialog, { type BaseDialogProps } from './Dialog';\n\nexport type ConfirmationDialogProps = BaseDialogProps & {\n    /**\n     * The content of the dialog body itself\n     */\n    content?: string | React.ReactNode;\n\n    /**\n     * A callback fired when the confirmation button is clicked.\n     *\n     * @default () => {}\n     */\n    onClickConfirm?: VoidFunction;\n\n    /**\n     * A callback fired when the cancel button is clicked or the dialog is closed.\n     *\n     * @default () => {}\n     */\n    onClickCancel?: VoidFunction;\n\n    /**\n     * The content of the cancel button. (Usually a text, can also be a FormattedMessage component).\n     */\n    cancelButtonText?: string | React.ReactNode;\n\n    /**\n     * Sets the style of the cancel button.\n     */\n    cancelButtonBsStyle?: BUTTON_STYLE;\n\n    /**\n     * Optional key used to generate automatic GA tracking attributes for the cancel button.\n     */\n    cancelButtonAutoTrackingKey?: string;\n\n    /**\n     * Optional tracking attributes (e.g. from `getTrackingAttributes`) added to the cancel button.\n     */\n    cancelButtonTrackingAttributes?: AutoTrackingAttributes;\n\n    /**\n     * The content of the confirmation button. Since it is a node, it can be a simple text or any JSX node like a div element with an icon and a text.\n     */\n    confirmButtonText?: string | React.ReactNode;\n\n    /**\n     * Sets the style of the confirmation button.\n     *\n     * @default 'primary'\n     */\n    confirmButtonBsStyle?: BUTTON_STYLE;\n\n    /**\n     * Optional key used to generate automatic GA tracking attributes for the confirmation button.\n     */\n    confirmButtonAutoTrackingKey?: string;\n\n    /**\n     * Optional tracking attributes (e.g. from `getTrackingAttributes`) added to the confirmation button.\n     */\n    confirmButtonTrackingAttributes?: AutoTrackingAttributes;\n\n    /**\n     * When set to `true` the confirmation button will be disabled.\n     */\n    disableConfirm?: boolean;\n};\n\nconst ConfirmationDialog = (props: ConfirmationDialogProps) => {\n    const {\n        content,\n        onClickCancel = noop,\n        cancelButtonText,\n        cancelButtonBsStyle,\n        cancelButtonAutoTrackingKey,\n        cancelButtonTrackingAttributes,\n        onClickConfirm = noop,\n        confirmButtonText,\n        confirmButtonBsStyle = 'primary',\n        confirmButtonAutoTrackingKey,\n        confirmButtonTrackingAttributes,\n        disableConfirm,\n        ...remainingProps\n    } = props;\n\n    const footer = (\n        <div className='btn-toolbar'>\n            <Button\n                bsStyle={cancelButtonBsStyle}\n                className='CancelButton'\n                onClick={onClickCancel}\n                autoTrackingKey={cancelButtonAutoTrackingKey}\n                {...cancelButtonTrackingAttributes}\n            >\n                {cancelButtonText}\n            </Button>\n            <Button\n                bsStyle={confirmButtonBsStyle}\n                className='ConfirmationButton'\n                onClick={onClickConfirm}\n                disabled={disableConfirm}\n                autoTrackingKey={confirmButtonAutoTrackingKey}\n                {...confirmButtonTrackingAttributes}\n            >\n                {confirmButtonText}\n            </Button>\n        </div>\n    );\n\n    return (\n        <Dialog\n            {...remainingProps}\n            body={content}\n            footer={footer}\n            onClose={onClickCancel}\n            showCloseButton={false}\n            className='confirmation-dialog'\n            disableEsc\n        />\n    );\n};\n\nexport default ConfirmationDialog;\n"],"mappings":";;;;;AA2EA,IAAM,KAAsB,MAAmC;CAC3D,IAAM,EACF,YACA,mBAAgB,GAChB,qBACA,wBACA,gCACA,mCACA,oBAAiB,GACjB,sBACA,0BAAuB,WACvB,iCACA,oCACA,mBACA,GAAG,MACH,GAEE,IACF,kBAAC,OAAD;EAAK,WAAU;YAAf,CACI,kBAAC,GAAD;GACI,SAAS;GACT,WAAU;GACV,SAAS;GACT,iBAAiB;GACjB,GAAI;aAEH;EACG,CAAA,GACR,kBAAC,GAAD;GACI,SAAS;GACT,WAAU;GACV,SAAS;GACT,UAAU;GACV,iBAAiB;GACjB,GAAI;aAEH;EACG,CAAA,CACP;;CAGT,OACI,kBAAC,GAAD;EACI,GAAI;EACJ,MAAM;EACE;EACR,SAAS;EACT,iBAAiB;EACjB,WAAU;EACV,YAAA;CACH,CAAA;AAET"}

package/components/dialog/Dialog.js

@@ -1,164 +1,114 @@
-import { jsx as s, jsxs as r, Fragment as $ } from "react/jsx-runtime";
-import { useState as m } from "react";
-import oo from "react-dom";
-import { noop as L } from "es-toolkit/function";
-import { useReducedMotion as eo, AnimatePresence as lo, motion as S } from "motion/react";
-import _ from "../../utils/classNames.js";
-import { getOrCreatePortalRoot as to } from "../../utils/portalRoot.js";
-import so from "../../hooks/useEsc.js";
-import I from "./DialogHeader.js";
-import v from "./DialogBody.js";
-import D from "./DialogFooter.js";
-import ao from "../../hooks/useFocusTrap.js";
-import { DialogContextProvider as io } from "./dialogContext.js";
-const C = "modal-dialog", x = "modal-open", o = (w) => {
-  const {
-    title: c,
-    subtitle: N,
-    body: d,
-    footer: f,
-    headerButtons: b,
-    className: F = "",
-    bodyClassName: Z,
-    footerClassName: A,
-    showXsDialogBorders: O = !1,
-    showCloseButton: B = !0,
-    useOverflow: H = !1,
-    bsSize: e,
-    show: a = !1,
-    onClose: R = L,
-    disableEsc: T = !1,
-    onEsc: M = L,
-    onCloseValidation: P = () => !0,
-    children: u,
-    ...G
-  } = w, [U, h] = m(a), p = to(), l = eo(), [n, X] = m(null);
-  ao(n);
-  const j = (t) => {
-    const i = p.getElementsByClassName(C).length > 1;
-    t ? document.body.classList.add(x) : !t && !i && document.body.classList.remove(x);
-  }, k = () => g(), g = (t) => {
-    P() && (h(!1), R(), M());
-  }, [z, K] = m(a);
-  a !== z && (h(a), j(a), K(a)), so(() => {
-    if (!n)
-      return;
-    const t = n, i = document.activeElement;
-    !T && t.contains(i) && g();
-  });
-  const V = (t) => {
-    if (t.opacity === 0)
-      return;
-    const i = n, Y = document.activeElement;
-    i?.contains(Y) || i?.focus();
-  }, W = _("modal", "show", F), E = e === "xs", y = !!u, q = _(
-    C,
-    H && "modal-overflow",
-    e === "xs" && "modal-xs",
-    e === "sm" && "modal-sm",
-    e === "lg" && "modal-lg",
-    e === "xl" && "modal-xl",
-    e === "full" && "modal-full-width",
-    e === "fullwidth" && "modal-full-width",
-    e === "fullheight" && "modal-full-height",
-    e === "fullheight-lg" && "modal-full-height modal-lg",
-    e === "fullheight-xl" && "modal-full-height modal-xl",
-    e === "fullscreen" && "modal-fullscreen"
-  ), J = {
-    type: "spring",
-    damping: 33,
-    stiffness: 500
-  }, Q = {
-    type: "spring",
-    damping: 25,
-    stiffness: 400
-  };
-  return oo.createPortal(
-    /* @__PURE__ */ s(
-      io,
-      {
-        value: { onClose: k, isSmallestDialog: E, showXsDialogBorders: O, showCloseButton: B },
-        children: /* @__PURE__ */ s(
-          lo,
-          {
-            initial: !1,
-            mode: "wait",
-            children: U && /* @__PURE__ */ r(
-              "div",
-              {
-                ...G,
-                className: W,
-                role: "dialog",
-                "aria-label": "dialog",
-                tabIndex: 0,
-                children: [
-                  /* @__PURE__ */ s(
-                    S.div,
-                    {
-                      initial: l ? !1 : { opacity: 0, y: "-50%" },
-                      animate: l ? { opacity: 1 } : { opacity: 1, y: 0, transition: E ? Q : J },
-                      exit: l ? void 0 : { opacity: 0, y: "-150%" },
-                      transition: l ? { duration: 0 } : {
-                        opacity: { duration: 0.2 },
-                        y: { duration: 0.3 }
-                      },
-                      onAnimationComplete: V,
-                      ref: X,
-                      className: q,
-                      role: "document",
-                      tabIndex: -1,
-                      children: /* @__PURE__ */ r("div", { className: "modal-content", children: [
-                        y && u,
-                        !y && /* @__PURE__ */ r($, { children: [
-                          c && /* @__PURE__ */ s(
-                            I,
-                            {
-                              title: c,
-                              subtitle: N,
-                              headerButtons: b
-                            }
-                          ),
-                          d && /* @__PURE__ */ s(v, { className: Z, children: d }),
-                          f && /* @__PURE__ */ s(D, { className: A, children: f })
-                        ] })
-                      ] })
-                    }
-                  ),
-                  /* @__PURE__ */ s(
-                    S.div,
-                    {
-                      initial: l ? !1 : { opacity: 0 },
-                      animate: { opacity: 1 },
-                      exit: l ? void 0 : { opacity: 0 },
-                      transition: l ? { duration: 0 } : { duration: 0.1 },
-                      className: "modal-backdrop"
-                    }
-                  )
-                ]
-              }
-            )
-          }
-        )
-      }
-    ),
-    p
-  );
+import e from "../../hooks/useFocusTrap.js";
+import t from "../../hooks/useEsc.js";
+import n from "../../utils/classNames.js";
+import { getOrCreatePortalRoot as r } from "../../utils/portalRoot.js";
+import { DialogContextProvider as i } from "./dialogContext.js";
+import a from "./DialogHeader.js";
+import o from "./DialogBody.js";
+import s from "./DialogFooter.js";
+import { useState as c } from "react";
+import { noop as l } from "es-toolkit/function";
+import { AnimatePresence as u, motion as d, useReducedMotion as f } from "motion/react";
+import { Fragment as p, jsx as m, jsxs as h } from "react/jsx-runtime";
+import g from "react-dom";
+//#region src/components/dialog/Dialog.tsx
+var _ = "modal-dialog", v = "modal-open", y = (y) => {
+	let { title: b, subtitle: x, body: S, footer: C, headerButtons: w, className: T = "", bodyClassName: E, footerClassName: D, showXsDialogBorders: O = !1, showCloseButton: k = !0, useOverflow: A = !1, bsSize: j, show: M = !1, onClose: N = l, disableEsc: P = !1, onEsc: F = l, onCloseValidation: I = () => !0, children: L, ...R } = y, [z, B] = c(M), V = r(), H = f(), [U, W] = c(null);
+	e(U);
+	let G = (e) => {
+		let t = V.getElementsByClassName(_).length > 1;
+		e ? document.body.classList.add(v) : !e && !t && document.body.classList.remove(v);
+	}, K = () => q(!0), q = (e) => {
+		I() && (B(!1), N(), e && F());
+	}, [J, Y] = c(M);
+	M !== J && (B(M), G(M), Y(M)), t(() => {
+		if (!U) return;
+		let e = U, t = document.activeElement;
+		!P && e.contains(t) && q(!0);
+	});
+	let X = (e) => {
+		if (e.opacity === 0) return;
+		let t = U, n = document.activeElement;
+		t?.contains(n) || t?.focus();
+	}, Z = n("modal", "show", T), Q = j === "xs", $ = !!L, ee = n(_, A && "modal-overflow", j === "xs" && "modal-xs", j === "sm" && "modal-sm", j === "lg" && "modal-lg", j === "xl" && "modal-xl", j === "full" && "modal-full-width", j === "fullwidth" && "modal-full-width", j === "fullheight" && "modal-full-height", j === "fullheight-lg" && "modal-full-height modal-lg", j === "fullheight-xl" && "modal-full-height modal-xl", j === "fullscreen" && "modal-fullscreen"), te = {
+		type: "spring",
+		damping: 33,
+		stiffness: 500
+	}, ne = {
+		type: "spring",
+		damping: 25,
+		stiffness: 400
+	};
+	return g.createPortal(/* @__PURE__ */ m(i, {
+		value: {
+			onClose: K,
+			isSmallestDialog: Q,
+			showXsDialogBorders: O,
+			showCloseButton: k
+		},
+		children: /* @__PURE__ */ m(u, {
+			initial: !1,
+			mode: "wait",
+			children: z && /* @__PURE__ */ h("div", {
+				...R,
+				className: Z,
+				role: "dialog",
+				"aria-label": "dialog",
+				tabIndex: 0,
+				children: [/* @__PURE__ */ m(d.div, {
+					initial: !H && {
+						opacity: 0,
+						y: "-50%"
+					},
+					animate: H ? { opacity: 1 } : {
+						opacity: 1,
+						y: 0,
+						transition: Q ? ne : te
+					},
+					exit: H ? void 0 : {
+						opacity: 0,
+						y: "-150%"
+					},
+					transition: H ? { duration: 0 } : {
+						opacity: { duration: .2 },
+						y: { duration: .3 }
+					},
+					onAnimationComplete: X,
+					ref: W,
+					className: ee,
+					role: "document",
+					tabIndex: -1,
+					children: /* @__PURE__ */ h("div", {
+						className: "modal-content",
+						children: [$ && L, !$ && /* @__PURE__ */ h(p, { children: [
+							b && /* @__PURE__ */ m(a, {
+								title: b,
+								subtitle: x,
+								headerButtons: w
+							}),
+							S && /* @__PURE__ */ m(o, {
+								className: E,
+								children: S
+							}),
+							C && /* @__PURE__ */ m(s, {
+								className: D,
+								children: C
+							})
+						] })]
+					})
+				}), /* @__PURE__ */ m(d.div, {
+					initial: !H && { opacity: 0 },
+					animate: { opacity: 1 },
+					exit: H ? void 0 : { opacity: 0 },
+					transition: H ? { duration: 0 } : { duration: .1 },
+					className: "modal-backdrop"
+				})]
+			})
+		})
+	}), V);
 };
-o.Title = I;
-o.Body = v;
-o.Footer = D;
-o.SIZE_XS = "xs";
-o.SIZE_SM = "sm";
-o.SIZE_MD = "md";
-o.SIZE_LG = "lg";
-o.SIZE_XL = "xl";
-o.SIZE_FULL = "full";
-o.SIZE_FULL_WIDTH = "fullwidth";
-o.SIZE_FULL_HEIGHT = "fullheight";
-o.SIZE_FULL_HEIGHT_LG = "fullheight-lg";
-o.SIZE_FULL_HEIGHT_XL = "fullheight-xl";
-o.SIZE_FULL_SCREEN = "fullscreen";
-export {
-  o as default
-};
-//# sourceMappingURL=Dialog.js.map
+y.Title = a, y.Body = o, y.Footer = s, y.SIZE_XS = "xs", y.SIZE_SM = "sm", y.SIZE_MD = "md", y.SIZE_LG = "lg", y.SIZE_XL = "xl", y.SIZE_FULL = "full", y.SIZE_FULL_WIDTH = "fullwidth", y.SIZE_FULL_HEIGHT = "fullheight", y.SIZE_FULL_HEIGHT_LG = "fullheight-lg", y.SIZE_FULL_HEIGHT_XL = "fullheight-xl", y.SIZE_FULL_SCREEN = "fullscreen";
+//#endregion
+export { y as default };
+
+//# sourceMappingURL=Dialog.js.map

package/components/dialog/Dialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"Dialog.js","sources":["../../../src/components/dialog/Dialog.tsx"],"sourcesContent":["import React, { useState, type PropsWithChildren } from 'react';\nimport ReactDOM from 'react-dom';\nimport { noop } from 'es-toolkit/function';\nimport { AnimatePresence, type AnimationDefinition, motion, type Transition, useReducedMotion } from 'motion/react';\n\nimport classNames from '../../utils/classNames';\nimport { getOrCreatePortalRoot } from '../../utils/portalRoot';\nimport useEsc from '../../hooks/useEsc';\nimport DialogHeader from './DialogHeader';\nimport DialogBody from './DialogBody';\nimport DialogFooter from './DialogFooter';\nimport useFocusTrap from '../../hooks/useFocusTrap';\nimport { DialogContextProvider } from './dialogContext';\n\nconst MODAL_DIALOG_CLASS = 'modal-dialog';\nconst MODAL_OPEN_CLASS = 'modal-open';\n\nexport type DialogSize =\n    | 'xs'\n    | 'sm'\n    | 'md'\n    | 'lg'\n    | 'xl'\n    | 'full'\n    | 'fullwidth'\n    | 'fullheight'\n    | 'fullheight-lg'\n    | 'fullheight-xl'\n    | 'fullscreen';\n\nexport type BaseDialogProps = {\n    /**\n     * Opens the dialog when set to `true`.\n     *\n     * @default false\n     */\n    show: boolean;\n\n    /**\n     * The dialog title (can also be a FormattedMessage component).\n     */\n    title?: React.ReactNode;\n\n    /**\n     * The dialog header subtitle content.\n     */\n    subtitle?: React.ReactNode;\n\n    /**\n     * Shows a close button when set to `true`.\n     *\n     * @default true\n     */\n    showCloseButton?: boolean;\n\n    /**\n     * A callback function invoked when the dialog closes.\n     */\n    onClose?: () => void;\n\n    /**\n     * Defined how large the dialog will be rendered.\n     *\n     * By default, the dialog has a medium size, and thus it can be omitted.\n     *\n     * Possible values are:\n     *\n     * - `'xs'`\n     * - `'sm'`\n     * - `'lg'`\n     * - `'xl'`\n     * - `'fullwidth'`\n     * - `'fullheight'`\n     * - `'fullheight-lg'`\n     * - `'fullheight-xl'`\n     * - `'fullscreen'`\n     *\n     * @default 'md'\n     */\n    bsSize?: DialogSize;\n\n    /**\n     * Enables or disabled closing the dialog via esc key.\n     *\n     * @default false\n     */\n    disableEsc?: boolean;\n\n    /**\n     * Enables the modal body to overflow and use inline scrolling if needed.\n     *\n     * @default false\n     */\n    useOverflow?: boolean;\n\n    /**\n     * Show Header and Footer Borders for the \"xs\" dialog\n     *\n     * @default false\n     */\n    showXsDialogBorders?: boolean;\n\n    /**\n     * Additional classes for the modal element.\n     */\n    className?: string;\n};\n\nexport type DialogProps = BaseDialogProps & {\n    /**\n     * The dialog body content.\n     */\n    body?: React.ReactNode;\n\n    /**\n     * The dialog body content.\n     */\n    footer?: React.ReactNode;\n\n    /**\n     * Additional classes for the modal-body element.\n     */\n    bodyClassName?: string;\n\n    /**\n     * Additional classes for the modal-footer element.\n     */\n    footerClassName?: string;\n\n    /**\n     * Allows to add additional buttons to the dialog header.\n     */\n    headerButtons?: React.ReactNode;\n\n    /**\n     * A callback fired when esc key is pressed and the dialog is about to close.\n     */\n    onEsc?: VoidFunction;\n\n    /**\n     * A callback function to be executed before closing the dialog.\n     *\n     * If the function returns `false`, the dialog will not be closed\n     *\n     * @default () => true\n     */\n    onCloseValidation?: () => boolean;\n};\n\nconst Dialog = (props: PropsWithChildren<DialogProps>) => {\n    const {\n        title,\n        subtitle,\n        body,\n        footer,\n        headerButtons,\n        className = '',\n        bodyClassName,\n        footerClassName,\n        showXsDialogBorders = false,\n        showCloseButton = true,\n        useOverflow = false,\n        bsSize,\n        show = false,\n        onClose: onCloseCallback = noop,\n        disableEsc = false,\n        onEsc = noop,\n        onCloseValidation = () => true,\n        children,\n        ...remainingProps\n    } = props;\n\n    const [open, setOpen] = useState(show);\n\n    const modalRoot = getOrCreatePortalRoot();\n\n    const shouldReduceMotion = useReducedMotion();\n\n    // Use a setter function for the focus trap as it would not re-render\n    // and fails to set the focus listener\n    const [focusTrapRef, setFocusTrapRef] = useState<HTMLDivElement | null>(null);\n    useFocusTrap(focusTrapRef);\n\n    const toggleBodyClass = (add: boolean) => {\n        // We need to set a body class to fix the -webkit-overflow-scrolling on safari and iOS\n\n        // Remove \"modal-open\" from body only when there is no other dialog in the DOM\n        // in order to support multiple dialogs\n        const hasOtherDialogs = modalRoot.getElementsByClassName(MODAL_DIALOG_CLASS).length > 1;\n\n        if (add) {\n            document.body.classList.add(MODAL_OPEN_CLASS);\n        } else if (!add && !hasOtherDialogs) {\n            document.body.classList.remove(MODAL_OPEN_CLASS);\n        }\n    };\n\n    const handleCloseButton = () => closeDialog(true);\n\n    const closeDialog = (usedEscapeKey: boolean) => {\n        if (onCloseValidation()) {\n            setOpen(false);\n            onCloseCallback();\n\n            usedEscapeKey && onEsc();\n        }\n    };\n\n    const [previousShow, setPreviousShow] = useState(show);\n    if (show !== previousShow) {\n        setOpen(show);\n        toggleBodyClass(show);\n        setPreviousShow(show);\n    }\n\n    useEsc(() => {\n        if (!focusTrapRef) {\n            return;\n        }\n\n        const dialogElement = focusTrapRef;\n        const currentActiveElement = document.activeElement;\n\n        // Only allow to close the dialog when the focus is inside the dialog\n        if (!disableEsc && dialogElement.contains(currentActiveElement)) {\n            closeDialog(true);\n        }\n    });\n\n    const handleAnimationComplete = (definition: AnimationDefinition) => {\n        // The animation complete callback is invoked too when closing the dialog.\n        // For that we check the animation props like the \"opacity\" to skip focusing\n        // on the way out when closing the dialog.\n        // @ts-expect-error\n        if (definition.opacity === 0) {\n            return;\n        }\n\n        const dialogElement = focusTrapRef;\n        const currentActiveElement = document.activeElement;\n\n        // Set the focus to the dialog if no element inside has focus already. Otherwise, focused\n        // elements like inputs would lose their focus to the dialog.\n        // Note that in order to focus the dialog itself, the tabindex has to be set on that element\n        // IMPORTANT: make sure the dialog has a tabIndex prop\n        if (!dialogElement?.contains(currentActiveElement)) {\n            dialogElement?.focus();\n        }\n    };\n\n    const modalClasses = classNames('modal', 'show', className);\n\n    const isSmallestDialog = bsSize === 'xs';\n\n    const hasChildren = !!children;\n\n    const modalDialogClasses = classNames(\n        MODAL_DIALOG_CLASS,\n        useOverflow && 'modal-overflow',\n        bsSize === 'xs' && 'modal-xs',\n        bsSize === 'sm' && 'modal-sm',\n        bsSize === 'lg' && 'modal-lg',\n        bsSize === 'xl' && 'modal-xl',\n        bsSize === 'full' && 'modal-full-width',\n        bsSize === 'fullwidth' && 'modal-full-width',\n        bsSize === 'fullheight' && 'modal-full-height',\n        bsSize === 'fullheight-lg' && 'modal-full-height modal-lg',\n        bsSize === 'fullheight-xl' && 'modal-full-height modal-xl',\n        bsSize === 'fullscreen' && 'modal-fullscreen'\n    );\n\n    const spring: Transition = {\n        type: 'spring',\n        damping: 33,\n        stiffness: 500,\n    };\n\n    const springXs: Transition = {\n        type: 'spring',\n        damping: 25,\n        stiffness: 400,\n    };\n\n    return ReactDOM.createPortal(\n        <DialogContextProvider\n            value={{ onClose: handleCloseButton, isSmallestDialog, showXsDialogBorders, showCloseButton }}\n        >\n            <AnimatePresence\n                // Disable any initial animations on children that\n                // are present when the component is first rendered\n                initial={false}\n                // Only render one component at a time.\n                // The exiting component will finish its exit\n                // animation before entering component is rendered\n                mode='wait'\n            >\n                {open && (\n                    <div\n                        {...remainingProps}\n                        className={modalClasses}\n                        role='dialog'\n                        aria-label='dialog'\n                        // Make sure it has a tabIndex to focus the dialog so the close on esc works.\n                        // biome-ignore lint/a11y/noNoninteractiveTabindex: <explanation>\n                        tabIndex={0}\n                    >\n                        <motion.div\n                            initial={shouldReduceMotion ? false : { opacity: 0, y: '-50%' }}\n                            animate={\n                                shouldReduceMotion\n                                    ? { opacity: 1 }\n                                    : { opacity: 1, y: 0, transition: isSmallestDialog ? springXs : spring }\n                            }\n                            exit={shouldReduceMotion ? undefined : { opacity: 0, y: '-150%' }}\n                            transition={\n                                shouldReduceMotion\n                                    ? { duration: 0 }\n                                    : {\n                                          opacity: { duration: 0.2 },\n                                          y: { duration: 0.3 },\n                                      }\n                            }\n                            onAnimationComplete={handleAnimationComplete}\n                            ref={setFocusTrapRef}\n                            className={modalDialogClasses}\n                            role='document'\n                            // Focus target for keyboard handling after open.\n                            tabIndex={-1}\n                        >\n                            <div className='modal-content'>\n                                {hasChildren && children}\n                                {!hasChildren && (\n                                    <>\n                                        {title && (\n                                            <DialogHeader\n                                                title={title}\n                                                subtitle={subtitle}\n                                                headerButtons={headerButtons}\n                                            />\n                                        )}\n                                        {body && <DialogBody className={bodyClassName}>{body}</DialogBody>}\n                                        {footer && <DialogFooter className={footerClassName}>{footer}</DialogFooter>}\n                                    </>\n                                )}\n                            </div>\n                        </motion.div>\n                        <motion.div\n                            initial={shouldReduceMotion ? false : { opacity: 0 }}\n                            animate={{ opacity: 1 }}\n                            exit={shouldReduceMotion ? undefined : { opacity: 0 }}\n                            transition={shouldReduceMotion ? { duration: 0 } : { duration: 0.1 }}\n                            className='modal-backdrop'\n                        />\n                    </div>\n                )}\n            </AnimatePresence>\n        </DialogContextProvider>,\n        modalRoot\n    );\n};\n\nDialog.Title = DialogHeader;\nDialog.Body = DialogBody;\nDialog.Footer = DialogFooter;\n\nDialog.SIZE_XS = 'xs' as const;\nDialog.SIZE_SM = 'sm' as const;\nDialog.SIZE_MD = 'md' as const; // default\nDialog.SIZE_LG = 'lg' as const;\nDialog.SIZE_XL = 'xl' as const;\nDialog.SIZE_FULL = 'full' as const;\nDialog.SIZE_FULL_WIDTH = 'fullwidth' as const;\nDialog.SIZE_FULL_HEIGHT = 'fullheight' as const;\nDialog.SIZE_FULL_HEIGHT_LG = 'fullheight-lg' as const;\nDialog.SIZE_FULL_HEIGHT_XL = 'fullheight-xl' as const;\nDialog.SIZE_FULL_SCREEN = 'fullscreen' as const;\n\nexport default Dialog;\n"],"names":["MODAL_DIALOG_CLASS","MODAL_OPEN_CLASS","Dialog","props","title","subtitle","body","footer","headerButtons","className","bodyClassName","footerClassName","showXsDialogBorders","showCloseButton","useOverflow","bsSize","show","onCloseCallback","noop","disableEsc","onEsc","onCloseValidation","children","remainingProps","open","setOpen","useState","modalRoot","getOrCreatePortalRoot","shouldReduceMotion","useReducedMotion","focusTrapRef","setFocusTrapRef","useFocusTrap","toggleBodyClass","add","hasOtherDialogs","handleCloseButton","closeDialog","usedEscapeKey","previousShow","setPreviousShow","useEsc","dialogElement","currentActiveElement","handleAnimationComplete","definition","modalClasses","classNames","isSmallestDialog","hasChildren","modalDialogClasses","spring","springXs","ReactDOM","jsx","DialogContextProvider","AnimatePresence","jsxs","motion","Fragment","DialogHeader","DialogBody","DialogFooter"],"mappings":";;;;;;;;;;;;;AAcA,MAAMA,IAAqB,gBACrBC,IAAmB,cAsInBC,IAAS,CAACC,MAA0C;AACtD,QAAM;AAAA,IACF,OAAAC;AAAA,IACA,UAAAC;AAAA,IACA,MAAAC;AAAA,IACA,QAAAC;AAAA,IACA,eAAAC;AAAA,IACA,WAAAC,IAAY;AAAA,IACZ,eAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,qBAAAC,IAAsB;AAAA,IACtB,iBAAAC,IAAkB;AAAA,IAClB,aAAAC,IAAc;AAAA,IACd,QAAAC;AAAA,IACA,MAAAC,IAAO;AAAA,IACP,SAASC,IAAkBC;AAAA,IAC3B,YAAAC,IAAa;AAAA,IACb,OAAAC,IAAQF;AAAA,IACR,mBAAAG,IAAoB,MAAM;AAAA,IAC1B,UAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,IACHpB,GAEE,CAACqB,GAAMC,CAAO,IAAIC,EAASV,CAAI,GAE/BW,IAAYC,GAAA,GAEZC,IAAqBC,GAAA,GAIrB,CAACC,GAAcC,CAAe,IAAIN,EAAgC,IAAI;AAC5E,EAAAO,GAAaF,CAAY;AAEzB,QAAMG,IAAkB,CAACC,MAAiB;AAKtC,UAAMC,IAAkBT,EAAU,uBAAuB3B,CAAkB,EAAE,SAAS;AAEtF,IAAImC,IACA,SAAS,KAAK,UAAU,IAAIlC,CAAgB,IACrC,CAACkC,KAAO,CAACC,KAChB,SAAS,KAAK,UAAU,OAAOnC,CAAgB;AAAA,EAEvD,GAEMoC,IAAoB,MAAMC,EAAgB,GAE1CA,IAAc,CAACC,MAA2B;AAC5C,IAAIlB,QACAI,EAAQ,EAAK,GACbR,EAAA,GAEiBG,EAAA;AAAA,EAEzB,GAEM,CAACoB,GAAcC,CAAe,IAAIf,EAASV,CAAI;AACrD,EAAIA,MAASwB,MACTf,EAAQT,CAAI,GACZkB,EAAgBlB,CAAI,GACpByB,EAAgBzB,CAAI,IAGxB0B,GAAO,MAAM;AACT,QAAI,CAACX;AACD;AAGJ,UAAMY,IAAgBZ,GAChBa,IAAuB,SAAS;AAGtC,IAAI,CAACzB,KAAcwB,EAAc,SAASC,CAAoB,KAC1DN,EAAgB;AAAA,EAExB,CAAC;AAED,QAAMO,IAA0B,CAACC,MAAoC;AAKjE,QAAIA,EAAW,YAAY;AACvB;AAGJ,UAAMH,IAAgBZ,GAChBa,IAAuB,SAAS;AAMtC,IAAKD,GAAe,SAASC,CAAoB,KAC7CD,GAAe,MAAA;AAAA,EAEvB,GAEMI,IAAeC,EAAW,SAAS,QAAQvC,CAAS,GAEpDwC,IAAmBlC,MAAW,MAE9BmC,IAAc,CAAC,CAAC5B,GAEhB6B,IAAqBH;AAAA,IACvBhD;AAAA,IACAc,KAAe;AAAA,IACfC,MAAW,QAAQ;AAAA,IACnBA,MAAW,QAAQ;AAAA,IACnBA,MAAW,QAAQ;AAAA,IACnBA,MAAW,QAAQ;AAAA,IACnBA,MAAW,UAAU;AAAA,IACrBA,MAAW,eAAe;AAAA,IAC1BA,MAAW,gBAAgB;AAAA,IAC3BA,MAAW,mBAAmB;AAAA,IAC9BA,MAAW,mBAAmB;AAAA,IAC9BA,MAAW,gBAAgB;AAAA,EAAA,GAGzBqC,IAAqB;AAAA,IACvB,MAAM;AAAA,IACN,SAAS;AAAA,IACT,WAAW;AAAA,EAAA,GAGTC,IAAuB;AAAA,IACzB,MAAM;AAAA,IACN,SAAS;AAAA,IACT,WAAW;AAAA,EAAA;AAGf,SAAOC,GAAS;AAAA,IACZ,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QACG,OAAO,EAAE,SAASnB,GAAmB,kBAAAY,GAAkB,qBAAArC,GAAqB,iBAAAC,EAAA;AAAA,QAE5E,UAAA,gBAAA0C;AAAA,UAACE;AAAA,UAAA;AAAA,YAGG,SAAS;AAAA,YAIT,MAAK;AAAA,YAEJ,UAAAjC,KACG,gBAAAkC;AAAA,cAAC;AAAA,cAAA;AAAA,gBACI,GAAGnC;AAAA,gBACJ,WAAWwB;AAAA,gBACX,MAAK;AAAA,gBACL,cAAW;AAAA,gBAGX,UAAU;AAAA,gBAEV,UAAA;AAAA,kBAAA,gBAAAQ;AAAA,oBAACI,EAAO;AAAA,oBAAP;AAAA,sBACG,SAAS9B,IAAqB,KAAQ,EAAE,SAAS,GAAG,GAAG,OAAA;AAAA,sBACvD,SACIA,IACM,EAAE,SAAS,MACX,EAAE,SAAS,GAAG,GAAG,GAAG,YAAYoB,IAAmBI,IAAWD,EAAA;AAAA,sBAExE,MAAMvB,IAAqB,SAAY,EAAE,SAAS,GAAG,GAAG,QAAA;AAAA,sBACxD,YACIA,IACM,EAAE,UAAU,MACZ;AAAA,wBACI,SAAS,EAAE,UAAU,IAAA;AAAA,wBACrB,GAAG,EAAE,UAAU,IAAA;AAAA,sBAAI;AAAA,sBAGjC,qBAAqBgB;AAAA,sBACrB,KAAKb;AAAA,sBACL,WAAWmB;AAAA,sBACX,MAAK;AAAA,sBAEL,UAAU;AAAA,sBAEV,UAAA,gBAAAO,EAAC,OAAA,EAAI,WAAU,iBACV,UAAA;AAAA,wBAAAR,KAAe5B;AAAA,wBACf,CAAC4B,KACE,gBAAAQ,EAAAE,GAAA,EACK,UAAA;AAAA,0BAAAxD,KACG,gBAAAmD;AAAA,4BAACM;AAAA,4BAAA;AAAA,8BACG,OAAAzD;AAAA,8BACA,UAAAC;AAAA,8BACA,eAAAG;AAAA,4BAAA;AAAA,0BAAA;AAAA,0BAGPF,KAAQ,gBAAAiD,EAACO,GAAA,EAAW,WAAWpD,GAAgB,UAAAJ,GAAK;AAAA,0BACpDC,KAAU,gBAAAgD,EAACQ,GAAA,EAAa,WAAWpD,GAAkB,UAAAJ,EAAA,CAAO;AAAA,wBAAA,EAAA,CACjE;AAAA,sBAAA,EAAA,CAER;AAAA,oBAAA;AAAA,kBAAA;AAAA,kBAEJ,gBAAAgD;AAAA,oBAACI,EAAO;AAAA,oBAAP;AAAA,sBACG,SAAS9B,IAAqB,KAAQ,EAAE,SAAS,EAAA;AAAA,sBACjD,SAAS,EAAE,SAAS,EAAA;AAAA,sBACpB,MAAMA,IAAqB,SAAY,EAAE,SAAS,EAAA;AAAA,sBAClD,YAAYA,IAAqB,EAAE,UAAU,MAAM,EAAE,UAAU,IAAA;AAAA,sBAC/D,WAAU;AAAA,oBAAA;AAAA,kBAAA;AAAA,gBACd;AAAA,cAAA;AAAA,YAAA;AAAA,UACJ;AAAA,QAAA;AAAA,MAER;AAAA,IAAA;AAAA,IAEJF;AAAA,EAAA;AAER;AAEAzB,EAAO,QAAQ2D;AACf3D,EAAO,OAAO4D;AACd5D,EAAO,SAAS6D;AAEhB7D,EAAO,UAAU;AACjBA,EAAO,UAAU;AACjBA,EAAO,UAAU;AACjBA,EAAO,UAAU;AACjBA,EAAO,UAAU;AACjBA,EAAO,YAAY;AACnBA,EAAO,kBAAkB;AACzBA,EAAO,mBAAmB;AAC1BA,EAAO,sBAAsB;AAC7BA,EAAO,sBAAsB;AAC7BA,EAAO,mBAAmB;"}
+{"version":3,"file":"Dialog.js","names":[],"sources":["../../../src/components/dialog/Dialog.tsx"],"sourcesContent":["import React, { useState, type PropsWithChildren } from 'react';\nimport ReactDOM from 'react-dom';\nimport { noop } from 'es-toolkit/function';\nimport { AnimatePresence, type AnimationDefinition, motion, type Transition, useReducedMotion } from 'motion/react';\n\nimport classNames from '../../utils/classNames';\nimport { getOrCreatePortalRoot } from '../../utils/portalRoot';\nimport useEsc from '../../hooks/useEsc';\nimport DialogHeader from './DialogHeader';\nimport DialogBody from './DialogBody';\nimport DialogFooter from './DialogFooter';\nimport useFocusTrap from '../../hooks/useFocusTrap';\nimport { DialogContextProvider } from './dialogContext';\n\nconst MODAL_DIALOG_CLASS = 'modal-dialog';\nconst MODAL_OPEN_CLASS = 'modal-open';\n\nexport type DialogSize =\n    | 'xs'\n    | 'sm'\n    | 'md'\n    | 'lg'\n    | 'xl'\n    | 'full'\n    | 'fullwidth'\n    | 'fullheight'\n    | 'fullheight-lg'\n    | 'fullheight-xl'\n    | 'fullscreen';\n\nexport type BaseDialogProps = {\n    /**\n     * Opens the dialog when set to `true`.\n     *\n     * @default false\n     */\n    show: boolean;\n\n    /**\n     * The dialog title (can also be a FormattedMessage component).\n     */\n    title?: React.ReactNode;\n\n    /**\n     * The dialog header subtitle content.\n     */\n    subtitle?: React.ReactNode;\n\n    /**\n     * Shows a close button when set to `true`.\n     *\n     * @default true\n     */\n    showCloseButton?: boolean;\n\n    /**\n     * A callback function invoked when the dialog closes.\n     */\n    onClose?: () => void;\n\n    /**\n     * Defined how large the dialog will be rendered.\n     *\n     * By default, the dialog has a medium size, and thus it can be omitted.\n     *\n     * Possible values are:\n     *\n     * - `'xs'`\n     * - `'sm'`\n     * - `'lg'`\n     * - `'xl'`\n     * - `'fullwidth'`\n     * - `'fullheight'`\n     * - `'fullheight-lg'`\n     * - `'fullheight-xl'`\n     * - `'fullscreen'`\n     *\n     * @default 'md'\n     */\n    bsSize?: DialogSize;\n\n    /**\n     * Enables or disabled closing the dialog via esc key.\n     *\n     * @default false\n     */\n    disableEsc?: boolean;\n\n    /**\n     * Enables the modal body to overflow and use inline scrolling if needed.\n     *\n     * @default false\n     */\n    useOverflow?: boolean;\n\n    /**\n     * Show Header and Footer Borders for the \"xs\" dialog\n     *\n     * @default false\n     */\n    showXsDialogBorders?: boolean;\n\n    /**\n     * Additional classes for the modal element.\n     */\n    className?: string;\n};\n\nexport type DialogProps = BaseDialogProps & {\n    /**\n     * The dialog body content.\n     */\n    body?: React.ReactNode;\n\n    /**\n     * The dialog body content.\n     */\n    footer?: React.ReactNode;\n\n    /**\n     * Additional classes for the modal-body element.\n     */\n    bodyClassName?: string;\n\n    /**\n     * Additional classes for the modal-footer element.\n     */\n    footerClassName?: string;\n\n    /**\n     * Allows to add additional buttons to the dialog header.\n     */\n    headerButtons?: React.ReactNode;\n\n    /**\n     * A callback fired when esc key is pressed and the dialog is about to close.\n     */\n    onEsc?: VoidFunction;\n\n    /**\n     * A callback function to be executed before closing the dialog.\n     *\n     * If the function returns `false`, the dialog will not be closed\n     *\n     * @default () => true\n     */\n    onCloseValidation?: () => boolean;\n};\n\nconst Dialog = (props: PropsWithChildren<DialogProps>) => {\n    const {\n        title,\n        subtitle,\n        body,\n        footer,\n        headerButtons,\n        className = '',\n        bodyClassName,\n        footerClassName,\n        showXsDialogBorders = false,\n        showCloseButton = true,\n        useOverflow = false,\n        bsSize,\n        show = false,\n        onClose: onCloseCallback = noop,\n        disableEsc = false,\n        onEsc = noop,\n        onCloseValidation = () => true,\n        children,\n        ...remainingProps\n    } = props;\n\n    const [open, setOpen] = useState(show);\n\n    const modalRoot = getOrCreatePortalRoot();\n\n    const shouldReduceMotion = useReducedMotion();\n\n    // Use a setter function for the focus trap as it would not re-render\n    // and fails to set the focus listener\n    const [focusTrapRef, setFocusTrapRef] = useState<HTMLDivElement | null>(null);\n    useFocusTrap(focusTrapRef);\n\n    const toggleBodyClass = (add: boolean) => {\n        // We need to set a body class to fix the -webkit-overflow-scrolling on safari and iOS\n\n        // Remove \"modal-open\" from body only when there is no other dialog in the DOM\n        // in order to support multiple dialogs\n        const hasOtherDialogs = modalRoot.getElementsByClassName(MODAL_DIALOG_CLASS).length > 1;\n\n        if (add) {\n            document.body.classList.add(MODAL_OPEN_CLASS);\n        } else if (!add && !hasOtherDialogs) {\n            document.body.classList.remove(MODAL_OPEN_CLASS);\n        }\n    };\n\n    const handleCloseButton = () => closeDialog(true);\n\n    const closeDialog = (usedEscapeKey: boolean) => {\n        if (onCloseValidation()) {\n            setOpen(false);\n            onCloseCallback();\n\n            usedEscapeKey && onEsc();\n        }\n    };\n\n    const [previousShow, setPreviousShow] = useState(show);\n    if (show !== previousShow) {\n        setOpen(show);\n        toggleBodyClass(show);\n        setPreviousShow(show);\n    }\n\n    useEsc(() => {\n        if (!focusTrapRef) {\n            return;\n        }\n\n        const dialogElement = focusTrapRef;\n        const currentActiveElement = document.activeElement;\n\n        // Only allow to close the dialog when the focus is inside the dialog\n        if (!disableEsc && dialogElement.contains(currentActiveElement)) {\n            closeDialog(true);\n        }\n    });\n\n    const handleAnimationComplete = (definition: AnimationDefinition) => {\n        // The animation complete callback is invoked too when closing the dialog.\n        // For that we check the animation props like the \"opacity\" to skip focusing\n        // on the way out when closing the dialog.\n        // @ts-expect-error\n        if (definition.opacity === 0) {\n            return;\n        }\n\n        const dialogElement = focusTrapRef;\n        const currentActiveElement = document.activeElement;\n\n        // Set the focus to the dialog if no element inside has focus already. Otherwise, focused\n        // elements like inputs would lose their focus to the dialog.\n        // Note that in order to focus the dialog itself, the tabindex has to be set on that element\n        // IMPORTANT: make sure the dialog has a tabIndex prop\n        if (!dialogElement?.contains(currentActiveElement)) {\n            dialogElement?.focus();\n        }\n    };\n\n    const modalClasses = classNames('modal', 'show', className);\n\n    const isSmallestDialog = bsSize === 'xs';\n\n    const hasChildren = !!children;\n\n    const modalDialogClasses = classNames(\n        MODAL_DIALOG_CLASS,\n        useOverflow && 'modal-overflow',\n        bsSize === 'xs' && 'modal-xs',\n        bsSize === 'sm' && 'modal-sm',\n        bsSize === 'lg' && 'modal-lg',\n        bsSize === 'xl' && 'modal-xl',\n        bsSize === 'full' && 'modal-full-width',\n        bsSize === 'fullwidth' && 'modal-full-width',\n        bsSize === 'fullheight' && 'modal-full-height',\n        bsSize === 'fullheight-lg' && 'modal-full-height modal-lg',\n        bsSize === 'fullheight-xl' && 'modal-full-height modal-xl',\n        bsSize === 'fullscreen' && 'modal-fullscreen'\n    );\n\n    const spring: Transition = {\n        type: 'spring',\n        damping: 33,\n        stiffness: 500,\n    };\n\n    const springXs: Transition = {\n        type: 'spring',\n        damping: 25,\n        stiffness: 400,\n    };\n\n    return ReactDOM.createPortal(\n        <DialogContextProvider\n            value={{ onClose: handleCloseButton, isSmallestDialog, showXsDialogBorders, showCloseButton }}\n        >\n            <AnimatePresence\n                // Disable any initial animations on children that\n                // are present when the component is first rendered\n                initial={false}\n                // Only render one component at a time.\n                // The exiting component will finish its exit\n                // animation before entering component is rendered\n                mode='wait'\n            >\n                {open && (\n                    <div\n                        {...remainingProps}\n                        className={modalClasses}\n                        role='dialog'\n                        aria-label='dialog'\n                        // Make sure it has a tabIndex to focus the dialog so the close on esc works.\n                        // biome-ignore lint/a11y/noNoninteractiveTabindex: <explanation>\n                        tabIndex={0}\n                    >\n                        <motion.div\n                            initial={shouldReduceMotion ? false : { opacity: 0, y: '-50%' }}\n                            animate={\n                                shouldReduceMotion\n                                    ? { opacity: 1 }\n                                    : { opacity: 1, y: 0, transition: isSmallestDialog ? springXs : spring }\n                            }\n                            exit={shouldReduceMotion ? undefined : { opacity: 0, y: '-150%' }}\n                            transition={\n                                shouldReduceMotion\n                                    ? { duration: 0 }\n                                    : {\n                                          opacity: { duration: 0.2 },\n                                          y: { duration: 0.3 },\n                                      }\n                            }\n                            onAnimationComplete={handleAnimationComplete}\n                            ref={setFocusTrapRef}\n                            className={modalDialogClasses}\n                            role='document'\n                            // Focus target for keyboard handling after open.\n                            tabIndex={-1}\n                        >\n                            <div className='modal-content'>\n                                {hasChildren && children}\n                                {!hasChildren && (\n                                    <>\n                                        {title && (\n                                            <DialogHeader\n                                                title={title}\n                                                subtitle={subtitle}\n                                                headerButtons={headerButtons}\n                                            />\n                                        )}\n                                        {body && <DialogBody className={bodyClassName}>{body}</DialogBody>}\n                                        {footer && <DialogFooter className={footerClassName}>{footer}</DialogFooter>}\n                                    </>\n                                )}\n                            </div>\n                        </motion.div>\n                        <motion.div\n                            initial={shouldReduceMotion ? false : { opacity: 0 }}\n                            animate={{ opacity: 1 }}\n                            exit={shouldReduceMotion ? undefined : { opacity: 0 }}\n                            transition={shouldReduceMotion ? { duration: 0 } : { duration: 0.1 }}\n                            className='modal-backdrop'\n                        />\n                    </div>\n                )}\n            </AnimatePresence>\n        </DialogContextProvider>,\n        modalRoot\n    );\n};\n\nDialog.Title = DialogHeader;\nDialog.Body = DialogBody;\nDialog.Footer = DialogFooter;\n\nDialog.SIZE_XS = 'xs' as const;\nDialog.SIZE_SM = 'sm' as const;\nDialog.SIZE_MD = 'md' as const; // default\nDialog.SIZE_LG = 'lg' as const;\nDialog.SIZE_XL = 'xl' as const;\nDialog.SIZE_FULL = 'full' as const;\nDialog.SIZE_FULL_WIDTH = 'fullwidth' as const;\nDialog.SIZE_FULL_HEIGHT = 'fullheight' as const;\nDialog.SIZE_FULL_HEIGHT_LG = 'fullheight-lg' as const;\nDialog.SIZE_FULL_HEIGHT_XL = 'fullheight-xl' as const;\nDialog.SIZE_FULL_SCREEN = 'fullscreen' as const;\n\nexport default Dialog;\n"],"mappings":"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"}

package/components/dialog/DialogBody.js

@@ -1,10 +1,16 @@
-import { jsx as r } from "react/jsx-runtime";
-import d from "../../utils/classNames.js";
-const t = ({ className: a = "", children: o, ...s }) => {
-  const l = d("modal-body", a);
-  return /* @__PURE__ */ r("div", { ...s, className: l, "aria-label": "dialog body", children: o });
+import e from "../../utils/classNames.js";
+import { jsx as t } from "react/jsx-runtime";
+//#region src/components/dialog/DialogBody.tsx
+var n = ({ className: n = "", children: r, ...i }) => {
+	let a = e("modal-body", n);
+	return /* @__PURE__ */ t("div", {
+		...i,
+		className: a,
+		"aria-label": "dialog body",
+		children: r
+	});
 };
-export {
-  t as default
-};
-//# sourceMappingURL=DialogBody.js.map
+//#endregion
+export { n as default };
+
+//# sourceMappingURL=DialogBody.js.map

package/components/dialog/DialogBody.js.map

@@ -1 +1 @@
-{"version":3,"file":"DialogBody.js","sources":["../../../src/components/dialog/DialogBody.tsx"],"sourcesContent":["import type { ComponentProps, PropsWithChildren } from 'react';\n\nimport classNames from '../../utils/classNames';\n\nexport type DialogBodyProps = ComponentProps<'div'> & {\n    /**\n     * Additional classes for the modal-body element.\n     */\n    className?: string;\n};\n\nconst DialogBody = ({ className = '', children, ...remainingProps }: PropsWithChildren<DialogBodyProps>) => {\n    const classes = classNames('modal-body', className);\n    return (\n        <div {...remainingProps} className={classes} aria-label='dialog body'>\n            {children}\n        </div>\n    );\n};\n\nexport default DialogBody;\n"],"names":["DialogBody","className","children","remainingProps","classes","classNames","jsx"],"mappings":";;AAWA,MAAMA,IAAa,CAAC,EAAE,WAAAC,IAAY,IAAI,UAAAC,GAAU,GAAGC,QAAyD;AACxG,QAAMC,IAAUC,EAAW,cAAcJ,CAAS;AAClD,SACI,gBAAAK,EAAC,SAAK,GAAGH,GAAgB,WAAWC,GAAS,cAAW,eACnD,UAAAF,GACL;AAER;"}
+{"version":3,"file":"DialogBody.js","names":[],"sources":["../../../src/components/dialog/DialogBody.tsx"],"sourcesContent":["import type { ComponentProps, PropsWithChildren } from 'react';\n\nimport classNames from '../../utils/classNames';\n\nexport type DialogBodyProps = ComponentProps<'div'> & {\n    /**\n     * Additional classes for the modal-body element.\n     */\n    className?: string;\n};\n\nconst DialogBody = ({ className = '', children, ...remainingProps }: PropsWithChildren<DialogBodyProps>) => {\n    const classes = classNames('modal-body', className);\n    return (\n        <div {...remainingProps} className={classes} aria-label='dialog body'>\n            {children}\n        </div>\n    );\n};\n\nexport default DialogBody;\n"],"mappings":";;;AAWA,IAAM,KAAc,EAAE,eAAY,IAAI,aAAU,GAAG,QAAyD;CACxG,IAAM,IAAU,EAAW,cAAc,CAAS;CAClD,OACI,kBAAC,OAAD;EAAK,GAAI;EAAgB,WAAW;EAAS,cAAW;EACnD;CACA,CAAA;AAEb"}

package/components/dialog/DialogFooter.js

@@ -1,15 +1,17 @@
-import { jsx as i } from "react/jsx-runtime";
-import d from "../../utils/classNames.js";
-import { useDialogContext as m } from "./dialogContext.js";
-const f = (o) => {
-  const { className: s = "", children: r, ...a } = o, { isSmallestDialog: e, showXsDialogBorders: t } = m(), l = d(
-    "modal-footer",
-    !(e ? t : !0) && "border-top-none padding-top-0",
-    s
-  );
-  return /* @__PURE__ */ i("div", { ...a, className: l, "aria-label": "dialog footer", children: r });
+import e from "../../utils/classNames.js";
+import { useDialogContext as t } from "./dialogContext.js";
+import { jsx as n } from "react/jsx-runtime";
+//#region src/components/dialog/DialogFooter.tsx
+var r = (r) => {
+	let { className: i = "", children: a, ...o } = r, { isSmallestDialog: s, showXsDialogBorders: c } = t(), l = e("modal-footer", !(!s || c) && "border-top-none padding-top-0", i);
+	return /* @__PURE__ */ n("div", {
+		...o,
+		className: l,
+		"aria-label": "dialog footer",
+		children: a
+	});
 };
-export {
-  f as default
-};
-//# sourceMappingURL=DialogFooter.js.map
+//#endregion
+export { r as default };
+
+//# sourceMappingURL=DialogFooter.js.map

package/components/dialog/DialogFooter.js.map

@@ -1 +1 @@
-{"version":3,"file":"DialogFooter.js","sources":["../../../src/components/dialog/DialogFooter.tsx"],"sourcesContent":["import type { ComponentProps, PropsWithChildren } from 'react';\n\nimport classNames from '../../utils/classNames';\n\nimport { useDialogContext } from './dialogContext';\n\nexport type DialogFooterProps = ComponentProps<'div'> & {\n    /**\n     * Additional classes for the modal-footer element.\n     */\n    className?: string;\n};\n\nconst DialogFooter = (props: PropsWithChildren<DialogFooterProps>) => {\n    const { className = '', children, ...remainingProps } = props;\n\n    const { isSmallestDialog, showXsDialogBorders } = useDialogContext();\n\n    const doShowXsDialogBorders = isSmallestDialog ? showXsDialogBorders : true;\n\n    const footerClassNames = classNames(\n        'modal-footer',\n        !doShowXsDialogBorders && 'border-top-none padding-top-0',\n        className\n    );\n\n    return (\n        <div {...remainingProps} className={footerClassNames} aria-label='dialog footer'>\n            {children}\n        </div>\n    );\n};\n\nexport default DialogFooter;\n"],"names":["DialogFooter","props","className","children","remainingProps","isSmallestDialog","showXsDialogBorders","useDialogContext","footerClassNames","classNames","jsx"],"mappings":";;;AAaA,MAAMA,IAAe,CAACC,MAAgD;AAClE,QAAM,EAAE,WAAAC,IAAY,IAAI,UAAAC,GAAU,GAAGC,MAAmBH,GAElD,EAAE,kBAAAI,GAAkB,qBAAAC,EAAA,IAAwBC,EAAA,GAI5CC,IAAmBC;AAAA,IACrB;AAAA,IACA,EAJ0BJ,IAAmBC,IAAsB,OAIzC;AAAA,IAC1BJ;AAAA,EAAA;AAGJ,SACI,gBAAAQ,EAAC,SAAK,GAAGN,GAAgB,WAAWI,GAAkB,cAAW,iBAC5D,UAAAL,GACL;AAER;"}
+{"version":3,"file":"DialogFooter.js","names":[],"sources":["../../../src/components/dialog/DialogFooter.tsx"],"sourcesContent":["import type { ComponentProps, PropsWithChildren } from 'react';\n\nimport classNames from '../../utils/classNames';\n\nimport { useDialogContext } from './dialogContext';\n\nexport type DialogFooterProps = ComponentProps<'div'> & {\n    /**\n     * Additional classes for the modal-footer element.\n     */\n    className?: string;\n};\n\nconst DialogFooter = (props: PropsWithChildren<DialogFooterProps>) => {\n    const { className = '', children, ...remainingProps } = props;\n\n    const { isSmallestDialog, showXsDialogBorders } = useDialogContext();\n\n    const doShowXsDialogBorders = isSmallestDialog ? showXsDialogBorders : true;\n\n    const footerClassNames = classNames(\n        'modal-footer',\n        !doShowXsDialogBorders && 'border-top-none padding-top-0',\n        className\n    );\n\n    return (\n        <div {...remainingProps} className={footerClassNames} aria-label='dialog footer'>\n            {children}\n        </div>\n    );\n};\n\nexport default DialogFooter;\n"],"mappings":";;;;AAaA,IAAM,KAAgB,MAAgD;CAClE,IAAM,EAAE,eAAY,IAAI,aAAU,GAAG,MAAmB,GAElD,EAAE,qBAAkB,2BAAwB,EAAiB,GAI7D,IAAmB,EACrB,gBACA,EAJ0B,MAAmB,MAInB,iCAC1B,CACJ;CAEA,OACI,kBAAC,OAAD;EAAK,GAAI;EAAgB,WAAW;EAAkB,cAAW;EAC5D;CACA,CAAA;AAEb"}