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
  );
};
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
