@hybridcore/ui 1.6.1 → 1.6.2

package/dist/Modal-MUZygjmQ.js

@@ -0,0 +1,1158 @@
+import { a as g, _ as G } from "./objectWithoutPropertiesLoose-DJteAcBH.js";
+import * as d from "react";
+import { P as e } from "./index-C__OZmYy.js";
+import { c as ee } from "./clsx-OuTLNxxd.js";
+import { g as he, a as Ee, s as ne, u as ge, c as ye } from "./generateUtilityClasses-C3ivN9Ie.js";
+import { o as $, a as oe } from "./ownerWindow-wg6foiOE.js";
+import { c as Te, u as K, a as le, s as ce, b as de } from "./TransitionGroupContext-BDAp2T0O.js";
+import { r as Me, m as Fe, a as De, u as Ae, T as Be, b as Le, g as ue, e as _e } from "./Paper-BkQLdsCI.js";
+import { c as pe } from "./createChainedFunction-C0nujS3O.js";
+import { jsxs as ve, jsx as D } from "react/jsx-runtime";
+import * as $e from "react-dom";
+function je(n) {
+  const {
+    prototype: o = {}
+  } = n;
+  return !!o.isReactComponent;
+}
+function xe(n, o, r, t, a) {
+  const s = n[o], i = a || o;
+  if (s == null || // When server-side rendering React doesn't warn either.
+  // This is not an accurate check for SSR.
+  // This is only in place for Emotion compat.
+  // TODO: Revisit once https://github.com/facebook/react/issues/20047 is resolved.
+  typeof window > "u")
+    return null;
+  let l;
+  const u = s.type;
+  return typeof u == "function" && !je(u) && (l = "Did you accidentally use a plain function component for an element instead?"), l !== void 0 ? new Error(`Invalid ${t} \`${i}\` supplied to \`${r}\`. Expected an element that can hold a ref. ${l} For more information see https://mui.com/r/caveat-with-refs-guide`) : null;
+}
+const X = Te(e.element, xe);
+X.isRequired = Te(e.element.isRequired, xe);
+const He = "exact-prop: ​";
+function Pe(n) {
+  return process.env.NODE_ENV === "production" ? n : g({}, n, {
+    [He]: (o) => {
+      const r = Object.keys(o).filter((t) => !n.hasOwnProperty(t));
+      return r.length > 0 ? new Error(`The following props are not supported: ${r.map((t) => `\`${t}\``).join(", ")}. Please remove them.`) : null;
+    }
+  });
+}
+function Re(n, o, r, t, a) {
+  if (process.env.NODE_ENV === "production")
+    return null;
+  const s = n[o], i = a || o;
+  return s == null ? null : s && s.nodeType !== 1 ? new Error(`Invalid ${t} \`${i}\` supplied to \`${r}\`. Expected an HTMLElement.`) : null;
+}
+function Ue(n) {
+  const o = n.documentElement.clientWidth;
+  return Math.abs(window.innerWidth - o);
+}
+const Ve = ["elementType", "externalSlotProps", "ownerState", "skipResolvingSlotProps"];
+function fe(n) {
+  var o;
+  const {
+    elementType: r,
+    externalSlotProps: t,
+    ownerState: a,
+    skipResolvingSlotProps: s = !1
+  } = n, i = G(n, Ve), l = s ? {} : Me(t, a), {
+    props: u,
+    internalRef: b
+  } = Fe(g({}, i, {
+    externalSlotProps: l
+  })), h = K(b, l == null ? void 0 : l.ref, (o = n.additionalProps) == null ? void 0 : o.ref);
+  return De(r, g({}, u, {
+    ref: h
+  }), a);
+}
+function te(n) {
+  if (parseInt(d.version, 10) >= 19) {
+    var o;
+    return (n == null || (o = n.props) == null ? void 0 : o.ref) || null;
+  }
+  return (n == null ? void 0 : n.ref) || null;
+}
+function Ke(n) {
+  const o = $(n);
+  return o.body === n ? oe(n).innerWidth > o.documentElement.clientWidth : n.scrollHeight > n.clientHeight;
+}
+function V(n, o) {
+  o ? n.setAttribute("aria-hidden", "true") : n.removeAttribute("aria-hidden");
+}
+function me(n) {
+  return parseInt(oe(n).getComputedStyle(n).paddingRight, 10) || 0;
+}
+function qe(n) {
+  const r = ["TEMPLATE", "SCRIPT", "STYLE", "LINK", "MAP", "META", "NOSCRIPT", "PICTURE", "COL", "COLGROUP", "PARAM", "SLOT", "SOURCE", "TRACK"].indexOf(n.tagName) !== -1, t = n.tagName === "INPUT" && n.getAttribute("type") === "hidden";
+  return r || t;
+}
+function be(n, o, r, t, a) {
+  const s = [o, r, ...t];
+  [].forEach.call(n.children, (i) => {
+    const l = s.indexOf(i) === -1, u = !qe(i);
+    l && u && V(i, a);
+  });
+}
+function Z(n, o) {
+  let r = -1;
+  return n.some((t, a) => o(t) ? (r = a, !0) : !1), r;
+}
+function We(n, o) {
+  const r = [], t = n.container;
+  if (!o.disableScrollLock) {
+    if (Ke(t)) {
+      const i = Ue($(t));
+      r.push({
+        value: t.style.paddingRight,
+        property: "padding-right",
+        el: t
+      }), t.style.paddingRight = `${me(t) + i}px`;
+      const l = $(t).querySelectorAll(".mui-fixed");
+      [].forEach.call(l, (u) => {
+        r.push({
+          value: u.style.paddingRight,
+          property: "padding-right",
+          el: u
+        }), u.style.paddingRight = `${me(u) + i}px`;
+      });
+    }
+    let s;
+    if (t.parentNode instanceof DocumentFragment)
+      s = $(t).body;
+    else {
+      const i = t.parentElement, l = oe(t);
+      s = (i == null ? void 0 : i.nodeName) === "HTML" && l.getComputedStyle(i).overflowY === "scroll" ? i : t;
+    }
+    r.push({
+      value: s.style.overflow,
+      property: "overflow",
+      el: s
+    }, {
+      value: s.style.overflowX,
+      property: "overflow-x",
+      el: s
+    }, {
+      value: s.style.overflowY,
+      property: "overflow-y",
+      el: s
+    }), s.style.overflow = "hidden";
+  }
+  return () => {
+    r.forEach(({
+      value: s,
+      el: i,
+      property: l
+    }) => {
+      s ? i.style.setProperty(l, s) : i.style.removeProperty(l);
+    });
+  };
+}
+function ze(n) {
+  const o = [];
+  return [].forEach.call(n.children, (r) => {
+    r.getAttribute("aria-hidden") === "true" && o.push(r);
+  }), o;
+}
+class Ye {
+  constructor() {
+    this.containers = void 0, this.modals = void 0, this.modals = [], this.containers = [];
+  }
+  add(o, r) {
+    let t = this.modals.indexOf(o);
+    if (t !== -1)
+      return t;
+    t = this.modals.length, this.modals.push(o), o.modalRef && V(o.modalRef, !1);
+    const a = ze(r);
+    be(r, o.mount, o.modalRef, a, !0);
+    const s = Z(this.containers, (i) => i.container === r);
+    return s !== -1 ? (this.containers[s].modals.push(o), t) : (this.containers.push({
+      modals: [o],
+      container: r,
+      restore: null,
+      hiddenSiblings: a
+    }), t);
+  }
+  mount(o, r) {
+    const t = Z(this.containers, (s) => s.modals.indexOf(o) !== -1), a = this.containers[t];
+    a.restore || (a.restore = We(a, r));
+  }
+  remove(o, r = !0) {
+    const t = this.modals.indexOf(o);
+    if (t === -1)
+      return t;
+    const a = Z(this.containers, (i) => i.modals.indexOf(o) !== -1), s = this.containers[a];
+    if (s.modals.splice(s.modals.indexOf(o), 1), this.modals.splice(t, 1), s.modals.length === 0)
+      s.restore && s.restore(), o.modalRef && V(o.modalRef, r), be(s.container, o.mount, o.modalRef, s.hiddenSiblings, !1), this.containers.splice(a, 1);
+    else {
+      const i = s.modals[s.modals.length - 1];
+      i.modalRef && V(i.modalRef, !1);
+    }
+    return t;
+  }
+  isTopModal(o) {
+    return this.modals.length > 0 && this.modals[this.modals.length - 1] === o;
+  }
+}
+const Ge = ["input", "select", "textarea", "a[href]", "button", "[tabindex]", "audio[controls]", "video[controls]", '[contenteditable]:not([contenteditable="false"])'].join(",");
+function Xe(n) {
+  const o = parseInt(n.getAttribute("tabindex") || "", 10);
+  return Number.isNaN(o) ? n.contentEditable === "true" || (n.nodeName === "AUDIO" || n.nodeName === "VIDEO" || n.nodeName === "DETAILS") && n.getAttribute("tabindex") === null ? 0 : n.tabIndex : o;
+}
+function Je(n) {
+  if (n.tagName !== "INPUT" || n.type !== "radio" || !n.name)
+    return !1;
+  const o = (t) => n.ownerDocument.querySelector(`input[type="radio"]${t}`);
+  let r = o(`[name="${n.name}"]:checked`);
+  return r || (r = o(`[name="${n.name}"]`)), r !== n;
+}
+function Qe(n) {
+  return !(n.disabled || n.tagName === "INPUT" && n.type === "hidden" || Je(n));
+}
+function Ze(n) {
+  const o = [], r = [];
+  return Array.from(n.querySelectorAll(Ge)).forEach((t, a) => {
+    const s = Xe(t);
+    s === -1 || !Qe(t) || (s === 0 ? o.push(t) : r.push({
+      documentOrder: a,
+      tabIndex: s,
+      node: t
+    }));
+  }), r.sort((t, a) => t.tabIndex === a.tabIndex ? t.documentOrder - a.documentOrder : t.tabIndex - a.tabIndex).map((t) => t.node).concat(o);
+}
+function en() {
+  return !0;
+}
+function z(n) {
+  const {
+    children: o,
+    disableAutoFocus: r = !1,
+    disableEnforceFocus: t = !1,
+    disableRestoreFocus: a = !1,
+    getTabbable: s = Ze,
+    isEnabled: i = en,
+    open: l
+  } = n, u = d.useRef(!1), b = d.useRef(null), h = d.useRef(null), y = d.useRef(null), R = d.useRef(null), x = d.useRef(!1), p = d.useRef(null), M = K(te(o), p), N = d.useRef(null);
+  d.useEffect(() => {
+    !l || !p.current || (x.current = !r);
+  }, [r, l]), d.useEffect(() => {
+    if (!l || !p.current)
+      return;
+    const c = $(p.current);
+    return p.current.contains(c.activeElement) || (p.current.hasAttribute("tabIndex") || (process.env.NODE_ENV !== "production" && console.error(["MUI: The modal content node does not accept focus.", 'For the benefit of assistive technologies, the tabIndex of the node is being set to "-1".'].join(`
+`)), p.current.setAttribute("tabIndex", "-1")), x.current && p.current.focus()), () => {
+      a || (y.current && y.current.focus && (u.current = !0, y.current.focus()), y.current = null);
+    };
+  }, [l]), d.useEffect(() => {
+    if (!l || !p.current)
+      return;
+    const c = $(p.current), T = (P) => {
+      N.current = P, !(t || !i() || P.key !== "Tab") && c.activeElement === p.current && P.shiftKey && (u.current = !0, h.current && h.current.focus());
+    }, v = () => {
+      const P = p.current;
+      if (P === null)
+        return;
+      if (!c.hasFocus() || !i() || u.current) {
+        u.current = !1;
+        return;
+      }
+      if (P.contains(c.activeElement) || t && c.activeElement !== b.current && c.activeElement !== h.current)
+        return;
+      if (c.activeElement !== R.current)
+        R.current = null;
+      else if (R.current !== null)
+        return;
+      if (!x.current)
+        return;
+      let O = [];
+      if ((c.activeElement === b.current || c.activeElement === h.current) && (O = s(p.current)), O.length > 0) {
+        var A, w;
+        const _ = !!((A = N.current) != null && A.shiftKey && ((w = N.current) == null ? void 0 : w.key) === "Tab"), B = O[0], L = O[O.length - 1];
+        typeof B != "string" && typeof L != "string" && (_ ? L.focus() : B.focus());
+      } else
+        P.focus();
+    };
+    c.addEventListener("focusin", v), c.addEventListener("keydown", T, !0);
+    const k = setInterval(() => {
+      c.activeElement && c.activeElement.tagName === "BODY" && v();
+    }, 50);
+    return () => {
+      clearInterval(k), c.removeEventListener("focusin", v), c.removeEventListener("keydown", T, !0);
+    };
+  }, [r, t, a, i, l, s]);
+  const S = (c) => {
+    y.current === null && (y.current = c.relatedTarget), x.current = !0, R.current = c.target;
+    const T = o.props.onFocus;
+    T && T(c);
+  }, C = (c) => {
+    y.current === null && (y.current = c.relatedTarget), x.current = !0;
+  };
+  return /* @__PURE__ */ ve(d.Fragment, {
+    children: [/* @__PURE__ */ D("div", {
+      tabIndex: l ? 0 : -1,
+      onFocus: C,
+      ref: b,
+      "data-testid": "sentinelStart"
+    }), /* @__PURE__ */ d.cloneElement(o, {
+      ref: M,
+      onFocus: S
+    }), /* @__PURE__ */ D("div", {
+      tabIndex: l ? 0 : -1,
+      onFocus: C,
+      ref: h,
+      "data-testid": "sentinelEnd"
+    })]
+  });
+}
+process.env.NODE_ENV !== "production" && (z.propTypes = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * A single child content element.
+   */
+  children: X,
+  /**
+   * If `true`, the focus trap will not automatically shift focus to itself when it opens, and
+   * replace it to the last focused element when it closes.
+   * This also works correctly with any focus trap children that have the `disableAutoFocus` prop.
+   *
+   * Generally this should never be set to `true` as it makes the focus trap less
+   * accessible to assistive technologies, like screen readers.
+   * @default false
+   */
+  disableAutoFocus: e.bool,
+  /**
+   * If `true`, the focus trap will not prevent focus from leaving the focus trap while open.
+   *
+   * Generally this should never be set to `true` as it makes the focus trap less
+   * accessible to assistive technologies, like screen readers.
+   * @default false
+   */
+  disableEnforceFocus: e.bool,
+  /**
+   * If `true`, the focus trap will not restore focus to previously focused element once
+   * focus trap is hidden or unmounted.
+   * @default false
+   */
+  disableRestoreFocus: e.bool,
+  /**
+   * Returns an array of ordered tabbable nodes (i.e. in tab order) within the root.
+   * For instance, you can provide the "tabbable" npm dependency.
+   * @param {HTMLElement} root
+   */
+  getTabbable: e.func,
+  /**
+   * This prop extends the `open` prop.
+   * It allows to toggle the open state without having to wait for a rerender when changing the `open` prop.
+   * This prop should be memoized.
+   * It can be used to support multiple focus trap mounted at the same time.
+   * @default function defaultIsEnabled(): boolean {
+   *   return true;
+   * }
+   */
+  isEnabled: e.func,
+  /**
+   * If `true`, focus is locked.
+   */
+  open: e.bool.isRequired
+});
+process.env.NODE_ENV !== "production" && (z.propTypes = Pe(z.propTypes));
+function nn(n) {
+  return typeof n == "function" ? n() : n;
+}
+const Y = /* @__PURE__ */ d.forwardRef(function(o, r) {
+  const {
+    children: t,
+    container: a,
+    disablePortal: s = !1
+  } = o, [i, l] = d.useState(null), u = K(/* @__PURE__ */ d.isValidElement(t) ? te(t) : null, r);
+  if (le(() => {
+    s || l(nn(a) || document.body);
+  }, [a, s]), le(() => {
+    if (i && !s)
+      return ce(r, i), () => {
+        ce(r, null);
+      };
+  }, [r, i, s]), s) {
+    if (/* @__PURE__ */ d.isValidElement(t)) {
+      const b = {
+        ref: u
+      };
+      return /* @__PURE__ */ d.cloneElement(t, b);
+    }
+    return /* @__PURE__ */ D(d.Fragment, {
+      children: t
+    });
+  }
+  return /* @__PURE__ */ D(d.Fragment, {
+    children: i && /* @__PURE__ */ $e.createPortal(t, i)
+  });
+});
+process.env.NODE_ENV !== "production" && (Y.propTypes = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The children to render into the `container`.
+   */
+  children: e.node,
+  /**
+   * An HTML element or function that returns one.
+   * The `container` will have the portal children appended to it.
+   *
+   * You can also provide a callback, which is called in a React layout effect.
+   * This lets you set the container from a ref, and also makes server-side rendering possible.
+   *
+   * By default, it uses the body of the top-level document object,
+   * so it's simply `document.body` most of the time.
+   */
+  container: e.oneOfType([Re, e.func]),
+  /**
+   * The `children` will be under the DOM hierarchy of the parent component.
+   * @default false
+   */
+  disablePortal: e.bool
+});
+process.env.NODE_ENV !== "production" && (Y.propTypes = Pe(Y.propTypes));
+const on = ["addEndListener", "appear", "children", "easing", "in", "onEnter", "onEntered", "onEntering", "onExit", "onExited", "onExiting", "style", "timeout", "TransitionComponent"], tn = {
+  entering: {
+    opacity: 1
+  },
+  entered: {
+    opacity: 1
+  }
+}, ke = /* @__PURE__ */ d.forwardRef(function(o, r) {
+  const t = Ae(), a = {
+    enter: t.transitions.duration.enteringScreen,
+    exit: t.transitions.duration.leavingScreen
+  }, {
+    addEndListener: s,
+    appear: i = !0,
+    children: l,
+    easing: u,
+    in: b,
+    onEnter: h,
+    onEntered: y,
+    onEntering: R,
+    onExit: x,
+    onExited: p,
+    onExiting: M,
+    style: N,
+    timeout: S = a,
+    // eslint-disable-next-line react/prop-types
+    TransitionComponent: C = Be
+  } = o, c = G(o, on), T = d.useRef(null), v = K(T, te(l), r), k = (m) => (I) => {
+    if (m) {
+      const f = T.current;
+      I === void 0 ? m(f) : m(f, I);
+    }
+  }, P = k(R), O = k((m, I) => {
+    Le(m);
+    const f = ue({
+      style: N,
+      timeout: S,
+      easing: u
+    }, {
+      mode: "enter"
+    });
+    m.style.webkitTransition = t.transitions.create("opacity", f), m.style.transition = t.transitions.create("opacity", f), h && h(m, I);
+  }), A = k(y), w = k(M), _ = k((m) => {
+    const I = ue({
+      style: N,
+      timeout: S,
+      easing: u
+    }, {
+      mode: "exit"
+    });
+    m.style.webkitTransition = t.transitions.create("opacity", I), m.style.transition = t.transitions.create("opacity", I), x && x(m);
+  }), B = k(p);
+  return /* @__PURE__ */ D(C, g({
+    appear: i,
+    in: b,
+    nodeRef: T,
+    onEnter: O,
+    onEntered: A,
+    onEntering: P,
+    onExit: _,
+    onExited: B,
+    onExiting: w,
+    addEndListener: (m) => {
+      s && s(T.current, m);
+    },
+    timeout: S
+  }, c, {
+    children: (m, I) => /* @__PURE__ */ d.cloneElement(l, g({
+      style: g({
+        opacity: 0,
+        visibility: m === "exited" && !b ? "hidden" : void 0
+      }, tn[m], N, l.props.style),
+      ref: v
+    }, I))
+  }));
+});
+process.env.NODE_ENV !== "production" && (ke.propTypes = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * Add a custom transition end trigger. Called with the transitioning DOM
+   * node and a done callback. Allows for more fine grained transition end
+   * logic. Note: Timeouts are still used as a fallback if provided.
+   */
+  addEndListener: e.func,
+  /**
+   * Perform the enter transition when it first mounts if `in` is also `true`.
+   * Set this to `false` to disable this behavior.
+   * @default true
+   */
+  appear: e.bool,
+  /**
+   * A single child content element.
+   */
+  children: X.isRequired,
+  /**
+   * The transition timing function.
+   * You may specify a single easing or a object containing enter and exit values.
+   */
+  easing: e.oneOfType([e.shape({
+    enter: e.string,
+    exit: e.string
+  }), e.string]),
+  /**
+   * If `true`, the component will transition in.
+   */
+  in: e.bool,
+  /**
+   * @ignore
+   */
+  onEnter: e.func,
+  /**
+   * @ignore
+   */
+  onEntered: e.func,
+  /**
+   * @ignore
+   */
+  onEntering: e.func,
+  /**
+   * @ignore
+   */
+  onExit: e.func,
+  /**
+   * @ignore
+   */
+  onExited: e.func,
+  /**
+   * @ignore
+   */
+  onExiting: e.func,
+  /**
+   * @ignore
+   */
+  style: e.object,
+  /**
+   * The duration for the transition, in milliseconds.
+   * You may specify a single timeout for all transitions, or individually with an object.
+   * @default {
+   *   enter: theme.transitions.duration.enteringScreen,
+   *   exit: theme.transitions.duration.leavingScreen,
+   * }
+   */
+  timeout: e.oneOfType([e.number, e.shape({
+    appear: e.number,
+    enter: e.number,
+    exit: e.number
+  })])
+});
+function rn(n) {
+  return Ee("MuiBackdrop", n);
+}
+he("MuiBackdrop", ["root", "invisible"]);
+const sn = ["children", "className", "component", "components", "componentsProps", "invisible", "open", "slotProps", "slots", "TransitionComponent", "transitionDuration"], an = (n) => {
+  const {
+    classes: o,
+    invisible: r
+  } = n;
+  return ye({
+    root: ["root", r && "invisible"]
+  }, rn, o);
+}, ln = ne("div", {
+  name: "MuiBackdrop",
+  slot: "Root",
+  overridesResolver: (n, o) => {
+    const {
+      ownerState: r
+    } = n;
+    return [o.root, r.invisible && o.invisible];
+  }
+})(({
+  ownerState: n
+}) => g({
+  position: "fixed",
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "center",
+  right: 0,
+  bottom: 0,
+  top: 0,
+  left: 0,
+  backgroundColor: "rgba(0, 0, 0, 0.5)",
+  WebkitTapHighlightColor: "transparent"
+}, n.invisible && {
+  backgroundColor: "transparent"
+})), Ne = /* @__PURE__ */ d.forwardRef(function(o, r) {
+  var t, a, s;
+  const i = ge({
+    props: o,
+    name: "MuiBackdrop"
+  }), {
+    children: l,
+    className: u,
+    component: b = "div",
+    components: h = {},
+    componentsProps: y = {},
+    invisible: R = !1,
+    open: x,
+    slotProps: p = {},
+    slots: M = {},
+    TransitionComponent: N = ke,
+    transitionDuration: S
+  } = i, C = G(i, sn), c = g({}, i, {
+    component: b,
+    invisible: R
+  }), T = an(c), v = (t = p.root) != null ? t : y.root;
+  return /* @__PURE__ */ D(N, g({
+    in: x,
+    timeout: S
+  }, C, {
+    children: /* @__PURE__ */ D(ln, g({
+      "aria-hidden": !0
+    }, v, {
+      as: (a = (s = M.root) != null ? s : h.Root) != null ? a : b,
+      className: ee(T.root, u, v == null ? void 0 : v.className),
+      ownerState: g({}, c, v == null ? void 0 : v.ownerState),
+      classes: T,
+      ref: r,
+      children: l
+    }))
+  }));
+});
+process.env.NODE_ENV !== "production" && (Ne.propTypes = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The content of the component.
+   */
+  children: e.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: e.object,
+  /**
+   * @ignore
+   */
+  className: e.string,
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: e.elementType,
+  /**
+   * The components used for each slot inside.
+   *
+   * This prop is an alias for the `slots` prop.
+   * It's recommended to use the `slots` prop instead.
+   *
+   * @default {}
+   */
+  components: e.shape({
+    Root: e.elementType
+  }),
+  /**
+   * The extra props for the slot components.
+   * You can override the existing props or add new ones.
+   *
+   * This prop is an alias for the `slotProps` prop.
+   * It's recommended to use the `slotProps` prop instead, as `componentsProps` will be deprecated in the future.
+   *
+   * @default {}
+   */
+  componentsProps: e.shape({
+    root: e.object
+  }),
+  /**
+   * If `true`, the backdrop is invisible.
+   * It can be used when rendering a popover or a custom select component.
+   * @default false
+   */
+  invisible: e.bool,
+  /**
+   * If `true`, the component is shown.
+   */
+  open: e.bool.isRequired,
+  /**
+   * The extra props for the slot components.
+   * You can override the existing props or add new ones.
+   *
+   * This prop is an alias for the `componentsProps` prop, which will be deprecated in the future.
+   *
+   * @default {}
+   */
+  slotProps: e.shape({
+    root: e.object
+  }),
+  /**
+   * The components used for each slot inside.
+   *
+   * This prop is an alias for the `components` prop, which will be deprecated in the future.
+   *
+   * @default {}
+   */
+  slots: e.shape({
+    root: e.elementType
+  }),
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: e.oneOfType([e.arrayOf(e.oneOfType([e.func, e.object, e.bool])), e.func, e.object]),
+  /**
+   * The component used for the transition.
+   * [Follow this guide](/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component.
+   * @default Fade
+   */
+  TransitionComponent: e.elementType,
+  /**
+   * The duration for the transition, in milliseconds.
+   * You may specify a single timeout for all transitions, or individually with an object.
+   */
+  transitionDuration: e.oneOfType([e.number, e.shape({
+    appear: e.number,
+    enter: e.number,
+    exit: e.number
+  })])
+});
+function cn(n) {
+  return typeof n == "function" ? n() : n;
+}
+function dn(n) {
+  return n ? n.props.hasOwnProperty("in") : !1;
+}
+const un = new Ye();
+function pn(n) {
+  const {
+    container: o,
+    disableEscapeKeyDown: r = !1,
+    disableScrollLock: t = !1,
+    // @ts-ignore internal logic - Base UI supports the manager as a prop too
+    manager: a = un,
+    closeAfterTransition: s = !1,
+    onTransitionEnter: i,
+    onTransitionExited: l,
+    children: u,
+    onClose: b,
+    open: h,
+    rootRef: y
+  } = n, R = d.useRef({}), x = d.useRef(null), p = d.useRef(null), M = K(p, y), [N, S] = d.useState(!h), C = dn(u);
+  let c = !0;
+  (n["aria-hidden"] === "false" || n["aria-hidden"] === !1) && (c = !1);
+  const T = () => $(x.current), v = () => (R.current.modalRef = p.current, R.current.mount = x.current, R.current), k = () => {
+    a.mount(v(), {
+      disableScrollLock: t
+    }), p.current && (p.current.scrollTop = 0);
+  }, P = de(() => {
+    const f = cn(o) || T().body;
+    a.add(v(), f), p.current && k();
+  }), O = d.useCallback(() => a.isTopModal(v()), [a]), A = de((f) => {
+    x.current = f, f && (h && O() ? k() : p.current && V(p.current, c));
+  }), w = d.useCallback(() => {
+    a.remove(v(), c);
+  }, [c, a]);
+  d.useEffect(() => () => {
+    w();
+  }, [w]), d.useEffect(() => {
+    h ? P() : (!C || !s) && w();
+  }, [h, w, C, s, P]);
+  const _ = (f) => (E) => {
+    var F;
+    (F = f.onKeyDown) == null || F.call(f, E), !(E.key !== "Escape" || E.which === 229 || // Wait until IME is settled.
+    !O()) && (r || (E.stopPropagation(), b && b(E, "escapeKeyDown")));
+  }, B = (f) => (E) => {
+    var F;
+    (F = f.onClick) == null || F.call(f, E), E.target === E.currentTarget && b && b(E, "backdropClick");
+  };
+  return {
+    getRootProps: (f = {}) => {
+      const E = _e(n);
+      delete E.onTransitionEnter, delete E.onTransitionExited;
+      const F = g({}, E, f);
+      return g({
+        role: "presentation"
+      }, F, {
+        onKeyDown: _(F),
+        ref: M
+      });
+    },
+    getBackdropProps: (f = {}) => {
+      const E = f;
+      return g({
+        "aria-hidden": !0
+      }, E, {
+        onClick: B(E),
+        open: h
+      });
+    },
+    getTransitionProps: () => {
+      const f = () => {
+        S(!1), i && i();
+      }, E = () => {
+        S(!0), l && l(), s && w();
+      };
+      return {
+        onEnter: pe(f, u == null ? void 0 : u.props.onEnter),
+        onExited: pe(E, u == null ? void 0 : u.props.onExited)
+      };
+    },
+    rootRef: M,
+    portalRef: A,
+    isTopModal: O,
+    exited: N,
+    hasTransition: C
+  };
+}
+function fn(n) {
+  return Ee("MuiModal", n);
+}
+he("MuiModal", ["root", "hidden", "backdrop"]);
+const mn = ["BackdropComponent", "BackdropProps", "classes", "className", "closeAfterTransition", "children", "container", "component", "components", "componentsProps", "disableAutoFocus", "disableEnforceFocus", "disableEscapeKeyDown", "disablePortal", "disableRestoreFocus", "disableScrollLock", "hideBackdrop", "keepMounted", "onBackdropClick", "onClose", "onTransitionEnter", "onTransitionExited", "open", "slotProps", "slots", "theme"], bn = (n) => {
+  const {
+    open: o,
+    exited: r,
+    classes: t
+  } = n;
+  return ye({
+    root: ["root", !o && r && "hidden"],
+    backdrop: ["backdrop"]
+  }, fn, t);
+}, hn = ne("div", {
+  name: "MuiModal",
+  slot: "Root",
+  overridesResolver: (n, o) => {
+    const {
+      ownerState: r
+    } = n;
+    return [o.root, !r.open && r.exited && o.hidden];
+  }
+})(({
+  theme: n,
+  ownerState: o
+}) => g({
+  position: "fixed",
+  zIndex: (n.vars || n).zIndex.modal,
+  right: 0,
+  bottom: 0,
+  top: 0,
+  left: 0
+}, !o.open && o.exited && {
+  visibility: "hidden"
+})), En = ne(Ne, {
+  name: "MuiModal",
+  slot: "Backdrop",
+  overridesResolver: (n, o) => o.backdrop
+})({
+  zIndex: -1
+}), gn = /* @__PURE__ */ d.forwardRef(function(o, r) {
+  var t, a, s, i, l, u;
+  const b = ge({
+    name: "MuiModal",
+    props: o
+  }), {
+    BackdropComponent: h = En,
+    BackdropProps: y,
+    className: R,
+    closeAfterTransition: x = !1,
+    children: p,
+    container: M,
+    component: N,
+    components: S = {},
+    componentsProps: C = {},
+    disableAutoFocus: c = !1,
+    disableEnforceFocus: T = !1,
+    disableEscapeKeyDown: v = !1,
+    disablePortal: k = !1,
+    disableRestoreFocus: P = !1,
+    disableScrollLock: O = !1,
+    hideBackdrop: A = !1,
+    keepMounted: w = !1,
+    onBackdropClick: _,
+    open: B,
+    slotProps: L,
+    slots: m
+    // eslint-disable-next-line react/prop-types
+  } = b, I = G(b, mn), f = g({}, b, {
+    closeAfterTransition: x,
+    disableAutoFocus: c,
+    disableEnforceFocus: T,
+    disableEscapeKeyDown: v,
+    disablePortal: k,
+    disableRestoreFocus: P,
+    disableScrollLock: O,
+    hideBackdrop: A,
+    keepMounted: w
+  }), {
+    getRootProps: E,
+    getBackdropProps: F,
+    getTransitionProps: Se,
+    portalRef: Ce,
+    isTopModal: Oe,
+    exited: re,
+    hasTransition: se
+  } = pn(g({}, f, {
+    rootRef: r
+  })), U = g({}, f, {
+    exited: re
+  }), j = bn(U), q = {};
+  if (p.props.tabIndex === void 0 && (q.tabIndex = "-1"), se) {
+    const {
+      onEnter: H,
+      onExited: W
+    } = Se();
+    q.onEnter = H, q.onExited = W;
+  }
+  const ie = (t = (a = m == null ? void 0 : m.root) != null ? a : S.Root) != null ? t : hn, ae = (s = (i = m == null ? void 0 : m.backdrop) != null ? i : S.Backdrop) != null ? s : h, J = (l = L == null ? void 0 : L.root) != null ? l : C.root, Q = (u = L == null ? void 0 : L.backdrop) != null ? u : C.backdrop, we = fe({
+    elementType: ie,
+    externalSlotProps: J,
+    externalForwardedProps: I,
+    getSlotProps: E,
+    additionalProps: {
+      ref: r,
+      as: N
+    },
+    ownerState: U,
+    className: ee(R, J == null ? void 0 : J.className, j == null ? void 0 : j.root, !U.open && U.exited && (j == null ? void 0 : j.hidden))
+  }), Ie = fe({
+    elementType: ae,
+    externalSlotProps: Q,
+    additionalProps: y,
+    getSlotProps: (H) => F(g({}, H, {
+      onClick: (W) => {
+        _ && _(W), H != null && H.onClick && H.onClick(W);
+      }
+    })),
+    className: ee(Q == null ? void 0 : Q.className, y == null ? void 0 : y.className, j == null ? void 0 : j.backdrop),
+    ownerState: U
+  });
+  return !w && !B && (!se || re) ? null : /* @__PURE__ */ D(Y, {
+    ref: Ce,
+    container: M,
+    disablePortal: k,
+    children: /* @__PURE__ */ ve(ie, g({}, we, {
+      children: [!A && h ? /* @__PURE__ */ D(ae, g({}, Ie)) : null, /* @__PURE__ */ D(z, {
+        disableEnforceFocus: T,
+        disableAutoFocus: c,
+        disableRestoreFocus: P,
+        isEnabled: Oe,
+        open: B,
+        children: /* @__PURE__ */ d.cloneElement(p, q)
+      })]
+    }))
+  });
+});
+process.env.NODE_ENV !== "production" && (gn.propTypes = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * A backdrop component. This prop enables custom backdrop rendering.
+   * @deprecated Use `slots.backdrop` instead. While this prop currently works, it will be removed in the next major version.
+   * Use the `slots.backdrop` prop to make your application ready for the next version of Material UI.
+   * @default styled(Backdrop, {
+   *   name: 'MuiModal',
+   *   slot: 'Backdrop',
+   *   overridesResolver: (props, styles) => {
+   *     return styles.backdrop;
+   *   },
+   * })({
+   *   zIndex: -1,
+   * })
+   */
+  BackdropComponent: e.elementType,
+  /**
+   * Props applied to the [`Backdrop`](/material-ui/api/backdrop/) element.
+   * @deprecated Use `slotProps.backdrop` instead.
+   */
+  BackdropProps: e.object,
+  /**
+   * A single child content element.
+   */
+  children: X.isRequired,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: e.object,
+  /**
+   * @ignore
+   */
+  className: e.string,
+  /**
+   * When set to true the Modal waits until a nested Transition is completed before closing.
+   * @default false
+   */
+  closeAfterTransition: e.bool,
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: e.elementType,
+  /**
+   * The components used for each slot inside.
+   *
+   * This prop is an alias for the `slots` prop.
+   * It's recommended to use the `slots` prop instead.
+   *
+   * @default {}
+   */
+  components: e.shape({
+    Backdrop: e.elementType,
+    Root: e.elementType
+  }),
+  /**
+   * The extra props for the slot components.
+   * You can override the existing props or add new ones.
+   *
+   * This prop is an alias for the `slotProps` prop.
+   * It's recommended to use the `slotProps` prop instead, as `componentsProps` will be deprecated in the future.
+   *
+   * @default {}
+   */
+  componentsProps: e.shape({
+    backdrop: e.oneOfType([e.func, e.object]),
+    root: e.oneOfType([e.func, e.object])
+  }),
+  /**
+   * An HTML element or function that returns one.
+   * The `container` will have the portal children appended to it.
+   *
+   * You can also provide a callback, which is called in a React layout effect.
+   * This lets you set the container from a ref, and also makes server-side rendering possible.
+   *
+   * By default, it uses the body of the top-level document object,
+   * so it's simply `document.body` most of the time.
+   */
+  container: e.oneOfType([Re, e.func]),
+  /**
+   * If `true`, the modal will not automatically shift focus to itself when it opens, and
+   * replace it to the last focused element when it closes.
+   * This also works correctly with any modal children that have the `disableAutoFocus` prop.
+   *
+   * Generally this should never be set to `true` as it makes the modal less
+   * accessible to assistive technologies, like screen readers.
+   * @default false
+   */
+  disableAutoFocus: e.bool,
+  /**
+   * If `true`, the modal will not prevent focus from leaving the modal while open.
+   *
+   * Generally this should never be set to `true` as it makes the modal less
+   * accessible to assistive technologies, like screen readers.
+   * @default false
+   */
+  disableEnforceFocus: e.bool,
+  /**
+   * If `true`, hitting escape will not fire the `onClose` callback.
+   * @default false
+   */
+  disableEscapeKeyDown: e.bool,
+  /**
+   * The `children` will be under the DOM hierarchy of the parent component.
+   * @default false
+   */
+  disablePortal: e.bool,
+  /**
+   * If `true`, the modal will not restore focus to previously focused element once
+   * modal is hidden or unmounted.
+   * @default false
+   */
+  disableRestoreFocus: e.bool,
+  /**
+   * Disable the scroll lock behavior.
+   * @default false
+   */
+  disableScrollLock: e.bool,
+  /**
+   * If `true`, the backdrop is not rendered.
+   * @default false
+   */
+  hideBackdrop: e.bool,
+  /**
+   * Always keep the children in the DOM.
+   * This prop can be useful in SEO situation or
+   * when you want to maximize the responsiveness of the Modal.
+   * @default false
+   */
+  keepMounted: e.bool,
+  /**
+   * Callback fired when the backdrop is clicked.
+   * @deprecated Use the `onClose` prop with the `reason` argument to handle the `backdropClick` events.
+   */
+  onBackdropClick: e.func,
+  /**
+   * Callback fired when the component requests to be closed.
+   * The `reason` parameter can optionally be used to control the response to `onClose`.
+   *
+   * @param {object} event The event source of the callback.
+   * @param {string} reason Can be: `"escapeKeyDown"`, `"backdropClick"`.
+   */
+  onClose: e.func,
+  /**
+   * A function called when a transition enters.
+   */
+  onTransitionEnter: e.func,
+  /**
+   * A function called when a transition has exited.
+   */
+  onTransitionExited: e.func,
+  /**
+   * If `true`, the component is shown.
+   */
+  open: e.bool.isRequired,
+  /**
+   * The props used for each slot inside the Modal.
+   * @default {}
+   */
+  slotProps: e.shape({
+    backdrop: e.oneOfType([e.func, e.object]),
+    root: e.oneOfType([e.func, e.object])
+  }),
+  /**
+   * The components used for each slot inside the Modal.
+   * Either a string to use a HTML element or a component.
+   * @default {}
+   */
+  slots: e.shape({
+    backdrop: e.elementType,
+    root: e.elementType
+  }),
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: e.oneOfType([e.arrayOf(e.oneOfType([e.func, e.object, e.bool])), e.func, e.object])
+});
+export {
+  Ne as B,
+  ke as F,
+  Re as H,
+  gn as M,
+  Y as P,
+  Ue as a,
+  z as b,
+  X as e,
+  te as g,
+  fe as u
+};