@telegraph/modal 0.0.80 → 0.0.82

package/dist/esm/index.mjs

@@ -1,7 +1,7 @@
-import { jsx as d, Fragment as q, jsxs as T } from "react/jsx-runtime";
+import { jsx as d, Fragment as q, jsxs as S } from "react/jsx-runtime";
 import * as v from "@radix-ui/react-dialog";
 import * as i from "react";
-import E from "react";
+import g from "react";
 import * as G from "react-dom";
 import { FocusScope as J } from "@radix-ui/react-focus-scope";
 import * as Q from "@radix-ui/react-portal";
@@ -9,9 +9,9 @@ import * as ee from "@radix-ui/react-visually-hidden";
 import { Button as te } from "@telegraph/button";
 import { RefToTgphRef as ne } from "@telegraph/helpers";
 import { Lucide as re } from "@telegraph/icon";
-import { Stack as g, Box as se } from "@telegraph/layout";
-import { AnimatePresence as oe, motion as B } from "framer-motion";
-function S(e, t, { checkForDefaultPrevented: n = !0 } = {}) {
+import { Stack as E, Box as oe } from "@telegraph/layout";
+import { AnimatePresence as se, motion as T } from "framer-motion";
+function x(e, t, { checkForDefaultPrevented: n = !0 } = {}) {
   return function(r) {
     if (e == null || e(r), n === !1 || !r.defaultPrevented)
       return t == null ? void 0 : t(r);
@@ -25,57 +25,57 @@ function I(e, t) {
 function _(...e) {
   return (t) => {
     let n = !1;
-    const s = e.map((r) => {
-      const o = I(r, t);
-      return !n && typeof o == "function" && (n = !0), o;
+    const o = e.map((r) => {
+      const s = I(r, t);
+      return !n && typeof s == "function" && (n = !0), s;
     });
     if (n)
       return () => {
-        for (let r = 0; r < s.length; r++) {
-          const o = s[r];
-          typeof o == "function" ? o() : I(e[r], null);
+        for (let r = 0; r < o.length; r++) {
+          const s = o[r];
+          typeof s == "function" ? s() : I(e[r], null);
         }
       };
   };
 }
-function U(...e) {
+function $(...e) {
   return i.useCallback(_(...e), e);
 }
-var z = i.forwardRef((e, t) => {
-  const { children: n, ...s } = e, r = i.Children.toArray(n), o = r.find(ae);
-  if (o) {
-    const a = o.props.children, c = r.map((p) => p === o ? i.Children.count(a) > 1 ? i.Children.only(null) : i.isValidElement(a) ? a.props.children : null : p);
-    return /* @__PURE__ */ d(W, { ...s, ref: t, children: i.isValidElement(a) ? i.cloneElement(a, void 0, c) : null });
+var U = i.forwardRef((e, t) => {
+  const { children: n, ...o } = e, r = i.Children.toArray(n), s = r.find(ae);
+  if (s) {
+    const a = s.props.children, l = r.map((y) => y === s ? i.Children.count(a) > 1 ? i.Children.only(null) : i.isValidElement(a) ? a.props.children : null : y);
+    return /* @__PURE__ */ d(B, { ...o, ref: t, children: i.isValidElement(a) ? i.cloneElement(a, void 0, l) : null });
   }
-  return /* @__PURE__ */ d(W, { ...s, ref: t, children: n });
+  return /* @__PURE__ */ d(B, { ...o, ref: t, children: n });
 });
-z.displayName = "Slot";
-var W = i.forwardRef((e, t) => {
-  const { children: n, ...s } = e;
+U.displayName = "Slot";
+var B = i.forwardRef((e, t) => {
+  const { children: n, ...o } = e;
   if (i.isValidElement(n)) {
-    const r = le(n), o = ce(s, n.props);
-    return n.type !== i.Fragment && (o.ref = t ? _(t, r) : r), i.cloneElement(n, o);
+    const r = le(n), s = ce(o, n.props);
+    return n.type !== i.Fragment && (s.ref = t ? _(t, r) : r), i.cloneElement(n, s);
   }
   return i.Children.count(n) > 1 ? i.Children.only(null) : null;
 });
-W.displayName = "SlotClone";
+B.displayName = "SlotClone";
 var ie = ({ children: e }) => /* @__PURE__ */ d(q, { children: e });
 function ae(e) {
   return i.isValidElement(e) && e.type === ie;
 }
 function ce(e, t) {
   const n = { ...t };
-  for (const s in t) {
-    const r = e[s], o = t[s];
-    /^on[A-Z]/.test(s) ? r && o ? n[s] = (...c) => {
-      o(...c), r(...c);
-    } : r && (n[s] = r) : s === "style" ? n[s] = { ...r, ...o } : s === "className" && (n[s] = [r, o].filter(Boolean).join(" "));
+  for (const o in t) {
+    const r = e[o], s = t[o];
+    /^on[A-Z]/.test(o) ? r && s ? n[o] = (...l) => {
+      s(...l), r(...l);
+    } : r && (n[o] = r) : o === "style" ? n[o] = { ...r, ...s } : o === "className" && (n[o] = [r, s].filter(Boolean).join(" "));
   }
   return { ...e, ...n };
 }
 function le(e) {
-  var s, r;
-  let t = (s = Object.getOwnPropertyDescriptor(e.props, "ref")) == null ? void 0 : s.get, n = t && "isReactWarning" in t && t.isReactWarning;
+  var o, r;
+  let t = (o = Object.getOwnPropertyDescriptor(e.props, "ref")) == null ? void 0 : o.get, n = t && "isReactWarning" in t && t.isReactWarning;
   return n ? e.ref : (t = (r = Object.getOwnPropertyDescriptor(e, "ref")) == null ? void 0 : r.get, n = t && "isReactWarning" in t && t.isReactWarning, n ? e.props.ref : e.props.ref || e.ref);
 }
 var ue = [
@@ -95,35 +95,35 @@ var ue = [
   "span",
   "svg",
   "ul"
-], V = ue.reduce((e, t) => {
-  const n = i.forwardRef((s, r) => {
-    const { asChild: o, ...a } = s, c = o ? z : t;
-    return typeof window < "u" && (window[Symbol.for("radix-ui")] = !0), /* @__PURE__ */ d(c, { ...a, ref: r });
+], z = ue.reduce((e, t) => {
+  const n = i.forwardRef((o, r) => {
+    const { asChild: s, ...a } = o, l = s ? U : t;
+    return typeof window < "u" && (window[Symbol.for("radix-ui")] = !0), /* @__PURE__ */ d(l, { ...a, ref: r });
   });
   return n.displayName = `Primitive.${t}`, { ...e, [t]: n };
 }, {});
 function de(e, t) {
   e && G.flushSync(() => e.dispatchEvent(t));
 }
-function L(e) {
+function N(e) {
   const t = i.useRef(e);
   return i.useEffect(() => {
     t.current = e;
   }), i.useMemo(() => (...n) => {
-    var s;
-    return (s = t.current) == null ? void 0 : s.call(t, ...n);
+    var o;
+    return (o = t.current) == null ? void 0 : o.call(t, ...n);
   }, []);
 }
 function fe(e, t = globalThis == null ? void 0 : globalThis.document) {
-  const n = L(e);
+  const n = N(e);
   i.useEffect(() => {
-    const s = (r) => {
+    const o = (r) => {
       r.key === "Escape" && n(r);
     };
-    return t.addEventListener("keydown", s, { capture: !0 }), () => t.removeEventListener("keydown", s, { capture: !0 });
+    return t.addEventListener("keydown", o, { capture: !0 }), () => t.removeEventListener("keydown", o, { capture: !0 });
   }, [n, t]);
 }
-var pe = "DismissableLayer", N = "dismissableLayer.update", ye = "dismissableLayer.pointerDownOutside", he = "dismissableLayer.focusOutside", M, $ = i.createContext({
+var pe = "DismissableLayer", W = "dismissableLayer.update", ye = "dismissableLayer.pointerDownOutside", he = "dismissableLayer.focusOutside", M, V = i.createContext({
   layers: /* @__PURE__ */ new Set(),
   layersWithOutsidePointerEventsDisabled: /* @__PURE__ */ new Set(),
   branches: /* @__PURE__ */ new Set()
@@ -131,43 +131,43 @@ var pe = "DismissableLayer", N = "dismissableLayer.update", ye = "dismissableLay
   (e, t) => {
     const {
       disableOutsidePointerEvents: n = !1,
-      onEscapeKeyDown: s,
+      onEscapeKeyDown: o,
       onPointerDownOutside: r,
-      onFocusOutside: o,
+      onFocusOutside: s,
       onInteractOutside: a,
-      onDismiss: c,
-      ...p
-    } = e, l = i.useContext($), [u, y] = i.useState(null), h = (u == null ? void 0 : u.ownerDocument) ?? (globalThis == null ? void 0 : globalThis.document), [, D] = i.useState({}), b = U(t, (f) => y(f)), C = Array.from(l.layers), [P] = [...l.layersWithOutsidePointerEventsDisabled].slice(-1), m = C.indexOf(P), O = u ? C.indexOf(u) : -1, w = l.layersWithOutsidePointerEventsDisabled.size > 0, k = O >= m, Z = ge((f) => {
-      const R = f.target, A = [...l.branches].some((x) => x.contains(R));
-      !k || A || (r == null || r(f), a == null || a(f), f.defaultPrevented || c == null || c());
-    }, h), F = Ee((f) => {
+      onDismiss: l,
+      ...y
+    } = e, u = i.useContext(V), [c, h] = i.useState(null), p = (c == null ? void 0 : c.ownerDocument) ?? (globalThis == null ? void 0 : globalThis.document), [, L] = i.useState({}), b = $(t, (f) => h(f)), C = Array.from(u.layers), [w] = [...u.layersWithOutsidePointerEventsDisabled].slice(-1), m = C.indexOf(w), D = c ? C.indexOf(c) : -1, P = u.layersWithOutsidePointerEventsDisabled.size > 0, k = D >= m, Z = Ee((f) => {
+      const R = f.target, A = [...u.branches].some((O) => O.contains(R));
+      !k || A || (r == null || r(f), a == null || a(f), f.defaultPrevented || l == null || l());
+    }, p), F = ge((f) => {
       const R = f.target;
-      [...l.branches].some((x) => x.contains(R)) || (o == null || o(f), a == null || a(f), f.defaultPrevented || c == null || c());
-    }, h);
+      [...u.branches].some((O) => O.contains(R)) || (s == null || s(f), a == null || a(f), f.defaultPrevented || l == null || l());
+    }, p);
     return fe((f) => {
-      O === l.layers.size - 1 && (s == null || s(f), !f.defaultPrevented && c && (f.preventDefault(), c()));
-    }, h), i.useEffect(() => {
-      if (u)
-        return n && (l.layersWithOutsidePointerEventsDisabled.size === 0 && (M = h.body.style.pointerEvents, h.body.style.pointerEvents = "none"), l.layersWithOutsidePointerEventsDisabled.add(u)), l.layers.add(u), j(), () => {
-          n && l.layersWithOutsidePointerEventsDisabled.size === 1 && (h.body.style.pointerEvents = M);
+      D === u.layers.size - 1 && (o == null || o(f), !f.defaultPrevented && l && (f.preventDefault(), l()));
+    }, p), i.useEffect(() => {
+      if (c)
+        return n && (u.layersWithOutsidePointerEventsDisabled.size === 0 && (M = p.body.style.pointerEvents, p.body.style.pointerEvents = "none"), u.layersWithOutsidePointerEventsDisabled.add(c)), u.layers.add(c), j(), () => {
+          n && u.layersWithOutsidePointerEventsDisabled.size === 1 && (p.body.style.pointerEvents = M);
         };
-    }, [u, h, n, l]), i.useEffect(() => () => {
-      u && (l.layers.delete(u), l.layersWithOutsidePointerEventsDisabled.delete(u), j());
-    }, [u, l]), i.useEffect(() => {
-      const f = () => D({});
-      return document.addEventListener(N, f), () => document.removeEventListener(N, f);
+    }, [c, p, n, u]), i.useEffect(() => () => {
+      c && (u.layers.delete(c), u.layersWithOutsidePointerEventsDisabled.delete(c), j());
+    }, [c, u]), i.useEffect(() => {
+      const f = () => L({});
+      return document.addEventListener(W, f), () => document.removeEventListener(W, f);
     }, []), /* @__PURE__ */ d(
-      V.div,
+      z.div,
       {
-        ...p,
+        ...y,
         ref: b,
         style: {
-          pointerEvents: w ? k ? "auto" : "none" : void 0,
+          pointerEvents: P ? k ? "auto" : "none" : void 0,
           ...e.style
         },
-        onFocusCapture: S(e.onFocusCapture, F.onFocusCapture),
-        onBlurCapture: S(e.onBlurCapture, F.onBlurCapture),
-        onPointerDownCapture: S(
+        onFocusCapture: x(e.onFocusCapture, F.onFocusCapture),
+        onBlurCapture: x(e.onBlurCapture, F.onBlurCapture),
+        onPointerDownCapture: x(
           e.onPointerDownCapture,
           Z.onPointerDownCapture
         )
@@ -177,96 +177,119 @@ var pe = "DismissableLayer", N = "dismissableLayer.update", ye = "dismissableLay
 );
 K.displayName = pe;
 var me = "DismissableLayerBranch", ve = i.forwardRef((e, t) => {
-  const n = i.useContext($), s = i.useRef(null), r = U(t, s);
+  const n = i.useContext(V), o = i.useRef(null), r = $(t, o);
   return i.useEffect(() => {
-    const o = s.current;
-    if (o)
-      return n.branches.add(o), () => {
-        n.branches.delete(o);
+    const s = o.current;
+    if (s)
+      return n.branches.add(s), () => {
+        n.branches.delete(s);
       };
-  }, [n.branches]), /* @__PURE__ */ d(V.div, { ...e, ref: r });
+  }, [n.branches]), /* @__PURE__ */ d(z.div, { ...e, ref: r });
 });
 ve.displayName = me;
-function ge(e, t = globalThis == null ? void 0 : globalThis.document) {
-  const n = L(e), s = i.useRef(!1), r = i.useRef(() => {
+function Ee(e, t = globalThis == null ? void 0 : globalThis.document) {
+  const n = N(e), o = i.useRef(!1), r = i.useRef(() => {
   });
   return i.useEffect(() => {
-    const o = (c) => {
-      if (c.target && !s.current) {
-        let p = function() {
+    const s = (l) => {
+      if (l.target && !o.current) {
+        let y = function() {
           X(
             ye,
             n,
-            l,
+            u,
             { discrete: !0 }
           );
         };
-        const l = { originalEvent: c };
-        c.pointerType === "touch" ? (t.removeEventListener("click", r.current), r.current = p, t.addEventListener("click", r.current, { once: !0 })) : p();
+        const u = { originalEvent: l };
+        l.pointerType === "touch" ? (t.removeEventListener("click", r.current), r.current = y, t.addEventListener("click", r.current, { once: !0 })) : y();
       } else
         t.removeEventListener("click", r.current);
-      s.current = !1;
+      o.current = !1;
     }, a = window.setTimeout(() => {
-      t.addEventListener("pointerdown", o);
+      t.addEventListener("pointerdown", s);
     }, 0);
     return () => {
-      window.clearTimeout(a), t.removeEventListener("pointerdown", o), t.removeEventListener("click", r.current);
+      window.clearTimeout(a), t.removeEventListener("pointerdown", s), t.removeEventListener("click", r.current);
     };
   }, [t, n]), {
     // ensures we check React component tree (not just DOM tree)
-    onPointerDownCapture: () => s.current = !0
+    onPointerDownCapture: () => o.current = !0
   };
 }
-function Ee(e, t = globalThis == null ? void 0 : globalThis.document) {
-  const n = L(e), s = i.useRef(!1);
+function ge(e, t = globalThis == null ? void 0 : globalThis.document) {
+  const n = N(e), o = i.useRef(!1);
   return i.useEffect(() => {
-    const r = (o) => {
-      o.target && !s.current && X(he, n, { originalEvent: o }, {
+    const r = (s) => {
+      s.target && !o.current && X(he, n, { originalEvent: s }, {
         discrete: !1
       });
     };
     return t.addEventListener("focusin", r), () => t.removeEventListener("focusin", r);
   }, [t, n]), {
-    onFocusCapture: () => s.current = !0,
-    onBlurCapture: () => s.current = !1
+    onFocusCapture: () => o.current = !0,
+    onBlurCapture: () => o.current = !1
   };
 }
 function j() {
-  const e = new CustomEvent(N);
+  const e = new CustomEvent(W);
   document.dispatchEvent(e);
 }
-function X(e, t, n, { discrete: s }) {
-  const r = n.originalEvent.target, o = new CustomEvent(e, { bubbles: !1, cancelable: !0, detail: n });
-  t && r.addEventListener(e, t, { once: !0 }), s ? de(r, o) : r.dispatchEvent(o);
+function X(e, t, n, { discrete: o }) {
+  const r = n.originalEvent.target, s = new CustomEvent(e, { bubbles: !1, cancelable: !0, detail: n });
+  t && r.addEventListener(e, t, { once: !0 }), o ? de(r, s) : r.dispatchEvent(s);
 }
-function be({
+var be = globalThis != null && globalThis.document ? i.useLayoutEffect : () => {
+}, Ce = i[" useInsertionEffect ".trim().toString()] || be;
+function Le({
   prop: e,
   defaultProp: t,
   onChange: n = () => {
-  }
+  },
+  caller: o
 }) {
-  const [s, r] = Ce({ defaultProp: t, onChange: n }), o = e !== void 0, a = o ? e : s, c = L(n), p = i.useCallback(
-    (l) => {
-      if (o) {
-        const y = typeof l == "function" ? l(e) : l;
-        y !== e && c(y);
+  const [r, s, a] = we({
+    defaultProp: t,
+    onChange: n
+  }), l = e !== void 0, y = l ? e : r;
+  {
+    const c = i.useRef(e !== void 0);
+    i.useEffect(() => {
+      const h = c.current;
+      h !== l && console.warn(
+        `${o} is changing from ${h ? "controlled" : "uncontrolled"} to ${l ? "controlled" : "uncontrolled"}. Components should not switch from controlled to uncontrolled (or vice versa). Decide between using a controlled or uncontrolled value for the lifetime of the component.`
+      ), c.current = l;
+    }, [l, o]);
+  }
+  const u = i.useCallback(
+    (c) => {
+      var h;
+      if (l) {
+        const p = Pe(c) ? c(e) : c;
+        p !== e && ((h = a.current) == null || h.call(a, p));
       } else
-        r(l);
+        s(c);
     },
-    [o, e, r, c]
+    [l, e, s, a]
   );
-  return [a, p];
+  return [y, u];
 }
-function Ce({
+function we({
   defaultProp: e,
   onChange: t
 }) {
-  const n = i.useState(e), [s] = n, r = i.useRef(s), o = L(t);
-  return i.useEffect(() => {
-    r.current !== s && (o(s), r.current = s);
-  }, [s, r, o]), n;
+  const [n, o] = i.useState(e), r = i.useRef(n), s = i.useRef(t);
+  return Ce(() => {
+    s.current = t;
+  }, [t]), i.useEffect(() => {
+    var a;
+    r.current !== n && ((a = s.current) == null || a.call(s, n), r.current = n);
+  }, [n, r]), [n, o, s];
 }
-const Y = E.createContext({
+function Pe(e) {
+  return typeof e == "function";
+}
+const Y = g.createContext({
   layers: [],
   setLayers: () => {
   },
@@ -276,97 +299,97 @@ const Y = E.createContext({
   },
   removeTopLayer: () => {
   }
-}), je = ({ children: e }) => {
-  const [t, n] = E.useState([]), s = (a) => {
-    n((c) => [...c, a]);
+}), Ue = ({ children: e }) => {
+  const [t, n] = g.useState([]), o = (a) => {
+    n((l) => [...l, a]);
   }, r = (a) => {
-    n(t.filter((c) => c !== a));
-  }, o = () => {
+    n(t.filter((l) => l !== a));
+  }, s = () => {
     const a = t[t.length - 1];
     a && r(a);
   };
   return /* @__PURE__ */ d(
     Y.Provider,
     {
-      value: { layers: t, setLayers: n, addLayer: s, removeLayer: r, removeTopLayer: o },
+      value: { layers: t, setLayers: n, addLayer: o, removeLayer: r, removeTopLayer: s },
       children: e
     }
   );
-}, H = () => E.useContext(Y), Le = ({
+}, H = () => g.useContext(Y), Re = ({
   defaultOpen: e,
   open: t,
   onOpenChange: n,
-  ...s
+  ...o
 }) => {
-  const [r, o] = be({
+  const [r, s] = Le({
     prop: t,
     onChange: n,
     defaultProp: e
-  }), a = H(), c = s.a11yTitle;
-  if (E.useEffect(() => {
-    !r && a.layers.includes(c) && a.removeLayer(c);
-  }, [c, a, r]), !!r)
-    return /* @__PURE__ */ d(Pe, { open: r, onOpenChange: o, ...s });
-}, Pe = ({
+  }), a = H(), l = o.a11yTitle;
+  if (g.useEffect(() => {
+    !r && a.layers.includes(l) && a.removeLayer(l);
+  }, [l, a, r]), !!r)
+    return /* @__PURE__ */ d(De, { open: r, onOpenChange: s, ...o });
+}, De = ({
   open: e,
   onOpenChange: t,
   a11yTitle: n,
-  a11yDescription: s,
+  a11yDescription: o,
   children: r,
   // Focus scope props
-  trapped: o,
+  trapped: s,
   onMountAutoFocus: a,
-  onUnmountAutoFocus: c,
-  ...p
+  onUnmountAutoFocus: l,
+  ...y
 }) => {
-  var C, P;
-  const l = n, u = H();
-  E.useEffect(() => {
-    !u || !e || u.layers.includes(l) || u.addLayer(l);
-  }, [l, u, e]);
-  const y = ((C = u.layers) == null ? void 0 : C.indexOf(l)) || 0, h = ((P = u.layers) == null ? void 0 : P.length) || 0, D = y !== 0, b = l === u.layers[u.layers.length - 1];
+  var C, w;
+  const u = n, c = H();
+  g.useEffect(() => {
+    !c || !e || c.layers.includes(u) || c.addLayer(u);
+  }, [u, c, e]);
+  const h = ((C = c.layers) == null ? void 0 : C.indexOf(u)) || 0, p = ((w = c.layers) == null ? void 0 : w.length) || 0, L = h !== 0, b = u === c.layers[c.layers.length - 1];
   return /* @__PURE__ */ d(
     K,
     {
       onEscapeKeyDown: (m) => {
-        b && (m.preventDefault(), u.removeTopLayer(), t(!1));
+        b && (m.preventDefault(), c.removeTopLayer(), t(!1));
       },
       onPointerDownOutside: (m) => {
-        b && (m.preventDefault(), u.removeTopLayer(), t(!1));
+        b && (m.preventDefault(), c.removeTopLayer(), t(!1));
       },
-      children: /* @__PURE__ */ T(
+      children: /* @__PURE__ */ S(
         v.Root,
         {
           open: e,
           onOpenChange: (m) => {
-            var w;
-            if (((w = u == null ? void 0 : u.layers) == null ? void 0 : w.length) > 0)
-              return m === !1 && l === u.layers[u.layers.length - 1] ? (u.removeLayer(l), t(!1)) : void 0;
+            var P;
+            if (((P = c == null ? void 0 : c.layers) == null ? void 0 : P.length) > 0)
+              return m === !1 && u === c.layers[c.layers.length - 1] ? (c.removeLayer(u), t(!1)) : void 0;
             t(m);
           },
           children: [
-            /* @__PURE__ */ T(ee.Root, { children: [
+            /* @__PURE__ */ S(ee.Root, { children: [
               /* @__PURE__ */ d(v.Title, { children: n }),
-              s && /* @__PURE__ */ d(v.Description, { children: s })
+              o && /* @__PURE__ */ d(v.Description, { children: o })
             ] }),
-            /* @__PURE__ */ d(oe, { children: e && // We add the className "tgph" here so that styles within
+            /* @__PURE__ */ d(se, { children: e && // We add the className "tgph" here so that styles within
             // the portal get scoped properly to telegraph
-            /* @__PURE__ */ d(Q.Root, { className: "tgph", children: /* @__PURE__ */ d(we, { layer: y, children: /* @__PURE__ */ d(
+            /* @__PURE__ */ d(Q.Root, { className: "tgph", children: /* @__PURE__ */ d(Oe, { layer: h, children: /* @__PURE__ */ d(
               J,
               {
-                trapped: typeof o == "boolean" ? o : b,
+                trapped: typeof s == "boolean" ? s : b,
                 onMountAutoFocus: a,
-                onUnmountAutoFocus: c,
+                onUnmountAutoFocus: l,
                 asChild: !0,
                 children: /* @__PURE__ */ d(ne, { children: /* @__PURE__ */ d(
-                  g,
+                  E,
                   {
-                    as: B.div,
+                    as: T.div,
                     initial: {
-                      top: `calc(var(--tgph-spacing-16) + var(--tgph-spacing-4) * ${h - 1})`
+                      top: `calc(var(--tgph-spacing-16) + var(--tgph-spacing-4) * ${p - 1})`
                     },
                     animate: {
-                      top: D ? `calc(var(--tgph-spacing-16) + var(--tgph-spacing-4) * ${y} )` : "var(--tgph-spacing-16)"
+                      top: L ? `calc(var(--tgph-spacing-16) + var(--tgph-spacing-4) * ${h} )` : "var(--tgph-spacing-16)"
                     },
                     exit: { top: 0 },
                     transition: { type: "spring", duration: 0.3, bounce: 0 },
@@ -377,15 +400,15 @@ const Y = E.createContext({
                       left: 0,
                       maxHeight: "calc(100vh - var(--tgph-spacing-32))",
                       maxWidth: "calc(100vw - var(--tgph-spacing-8))",
-                      zIndex: `calc(var(--tgph-zIndex-modal) + ${y})`
+                      zIndex: `calc(var(--tgph-zIndex-modal) + ${h})`
                     },
                     children: /* @__PURE__ */ d(
-                      g,
+                      E,
                       {
                         direction: "column",
-                        as: B.div,
+                        as: T.div,
                         animate: {
-                          scale: 1.02 - Math.abs(h - y) * 0.02,
+                          scale: 1.02 - Math.abs(p - h) * 0.02,
                           transformOrigin: "center center"
                         },
                         transition: {
@@ -393,33 +416,33 @@ const Y = E.createContext({
                           bounce: 0,
                           type: "spring"
                         },
-                        maxW: p.maxW ?? "160",
-                        w: p.w ?? "full",
+                        maxW: y.maxW ?? "160",
+                        w: y.w ?? "full",
                         bg: "surface-1",
                         border: "px",
                         rounded: "4",
                         shadow: "3",
-                        ...p,
+                        ...y,
                         children: r
                       },
-                      `content-${l}`
+                      `content-${u}`
                     )
                   },
-                  `container-${l}`
+                  `container-${u}`
                 ) })
               }
             ) }) }) })
           ]
         },
-        l
+        u
       )
     }
   );
-}, we = ({ layer: e, children: t }) => e > 0 ? t : /* @__PURE__ */ T(v.Overlay, { children: [
+}, Oe = ({ layer: e, children: t }) => e > 0 ? t : /* @__PURE__ */ S(v.Overlay, { children: [
   /* @__PURE__ */ d(
-    se,
+    oe,
     {
-      as: B.div,
+      as: T.div,
       initial: { opacity: 0 },
       animate: { opacity: 1 },
       exit: { opacity: 0 },
@@ -436,9 +459,9 @@ const Y = E.createContext({
     }
   ),
   t
-] }), Re = E.forwardRef(
-  ({ children: e, ...t }, n) => /* @__PURE__ */ d(v.Content, { ref: n, asChild: !0, ...t, children: /* @__PURE__ */ d(g, { direction: "column", h: "full", ...t, children: e }) })
-), De = ({
+] }), xe = g.forwardRef(
+  ({ children: e, ...t }, n) => /* @__PURE__ */ d(v.Content, { ref: n, asChild: !0, ...t, children: /* @__PURE__ */ d(E, { direction: "column", h: "full", ...t, children: e }) })
+), Se = ({
   size: e = "1",
   variant: t = "ghost",
   ...n
@@ -450,12 +473,12 @@ const Y = E.createContext({
     size: e,
     ...n
   }
-) }), Oe = ({
+) }), Te = ({
   style: e,
   children: t,
   ...n
 }) => /* @__PURE__ */ d(
-  g,
+  E,
   {
     direction: "column",
     px: "6",
@@ -467,11 +490,11 @@ const Y = E.createContext({
     ...n,
     children: t
   }
-), xe = ({
+), Be = ({
   children: e,
   ...t
 }) => /* @__PURE__ */ d(
-  g,
+  E,
   {
     direction: "row",
     justify: "space-between",
@@ -482,11 +505,11 @@ const Y = E.createContext({
     ...t,
     children: e
   }
-), Se = ({
+), We = ({
   children: e,
   ...t
 }) => /* @__PURE__ */ d(
-  g,
+  E,
   {
     direction: "row",
     align: "center",
@@ -498,17 +521,17 @@ const Y = E.createContext({
     ...t,
     children: e
   }
-), Te = {};
-Object.assign(Te, {
-  Root: Le,
-  Content: Re,
-  Close: De,
-  Body: Oe,
-  Header: xe,
-  Footer: Se
+), Ne = {};
+Object.assign(Ne, {
+  Root: Re,
+  Content: xe,
+  Close: Se,
+  Body: Te,
+  Header: Be,
+  Footer: We
 });
 export {
-  Te as Modal,
-  je as ModalStackingProvider
+  Ne as Modal,
+  Ue as ModalStackingProvider
 };
 //# sourceMappingURL=index.mjs.map