@telegraph/modal 0.0.84 → 0.0.85

package/dist/esm/index.mjs

@@ -1,91 +1,90 @@
-import { jsx as d, jsxs as S } from "react/jsx-runtime";
-import * as v from "@radix-ui/react-dialog";
-import * as i from "react";
-import g from "react";
-import * as H from "react-dom";
-import { FocusScope as Z } from "@radix-ui/react-focus-scope";
-import * as q from "@radix-ui/react-portal";
-import * as G from "@radix-ui/react-visually-hidden";
-import { Button as J } from "@telegraph/button";
-import { RefToTgphRef as Q } from "@telegraph/helpers";
-import { Lucide as ee } from "@telegraph/icon";
-import { Stack as E, Box as te } from "@telegraph/layout";
-import { AnimatePresence as ne, motion as T } from "framer-motion";
-function O(e, t, { checkForDefaultPrevented: r = !0 } = {}) {
-  return function(n) {
-    if (e == null || e(n), r === !1 || !n.defaultPrevented)
-      return t == null ? void 0 : t(n);
-  };
-}
-function F(e, t) {
+import { jsx as M, jsxs as Ve } from "react/jsx-runtime";
+import * as J from "@radix-ui/react-dialog";
+import * as v from "react";
+import ne, { createContext as se, useRef as de, useLayoutEffect as Us, useEffect as dt, useState as zs, useContext as I, useMemo as Fe, useCallback as Gs, useInsertionEffect as Hs, forwardRef as Ys, Fragment as Tn, createElement as Xs } from "react";
+import * as qs from "react-dom";
+import { FocusScope as Zs } from "@radix-ui/react-focus-scope";
+import * as Js from "@radix-ui/react-portal";
+import * as Qs from "@radix-ui/react-visually-hidden";
+import { Button as ei } from "@telegraph/button";
+import { RefToTgphRef as ti } from "@telegraph/helpers";
+import { Stack as ee, Box as ni } from "@telegraph/layout";
+import { X as si } from "lucide-react";
+function Ke(e, t, { checkForDefaultPrevented: n = !0 } = {}) {
+  return function(i) {
+    if (e == null || e(i), n === !1 || !i.defaultPrevented)
+      return t == null ? void 0 : t(i);
+  };
+}
+function Kt(e, t) {
   if (typeof e == "function")
     return e(t);
   e != null && (e.current = t);
 }
-function $(...e) {
+function wn(...e) {
   return (t) => {
-    let r = !1;
-    const o = e.map((n) => {
-      const s = F(n, t);
-      return !r && typeof s == "function" && (r = !0), s;
+    let n = !1;
+    const s = e.map((i) => {
+      const r = Kt(i, t);
+      return !n && typeof r == "function" && (n = !0), r;
     });
-    if (r)
+    if (n)
       return () => {
-        for (let n = 0; n < o.length; n++) {
-          const s = o[n];
-          typeof s == "function" ? s() : F(e[n], null);
+        for (let i = 0; i < s.length; i++) {
+          const r = s[i];
+          typeof r == "function" ? r() : Kt(e[i], null);
         }
       };
   };
 }
-function M(...e) {
-  return i.useCallback($(...e), e);
+function Sn(...e) {
+  return v.useCallback(wn(...e), e);
 }
 // @__NO_SIDE_EFFECTS__
-function re(e) {
-  const t = /* @__PURE__ */ oe(e), r = i.forwardRef((o, n) => {
-    const { children: s, ...l } = o, a = i.Children.toArray(s), f = a.find(ie);
-    if (f) {
-      const u = f.props.children, c = a.map((y) => y === f ? i.Children.count(u) > 1 ? i.Children.only(null) : i.isValidElement(u) ? u.props.children : null : y);
-      return /* @__PURE__ */ d(t, { ...l, ref: n, children: i.isValidElement(u) ? i.cloneElement(u, void 0, c) : null });
-    }
-    return /* @__PURE__ */ d(t, { ...l, ref: n, children: s });
+function ii(e) {
+  const t = /* @__PURE__ */ ri(e), n = v.forwardRef((s, i) => {
+    const { children: r, ...o } = s, a = v.Children.toArray(r), l = a.find(ai);
+    if (l) {
+      const u = l.props.children, c = a.map((d) => d === l ? v.Children.count(u) > 1 ? v.Children.only(null) : v.isValidElement(u) ? u.props.children : null : d);
+      return /* @__PURE__ */ M(t, { ...o, ref: i, children: v.isValidElement(u) ? v.cloneElement(u, void 0, c) : null });
+    }
+    return /* @__PURE__ */ M(t, { ...o, ref: i, children: r });
   });
-  return r.displayName = `${e}.Slot`, r;
+  return n.displayName = `${e}.Slot`, n;
 }
 // @__NO_SIDE_EFFECTS__
-function oe(e) {
-  const t = i.forwardRef((r, o) => {
-    const { children: n, ...s } = r;
-    if (i.isValidElement(n)) {
-      const l = ce(n), a = ae(s, n.props);
-      return n.type !== i.Fragment && (a.ref = o ? $(o, l) : l), i.cloneElement(n, a);
-    }
-    return i.Children.count(n) > 1 ? i.Children.only(null) : null;
+function ri(e) {
+  const t = v.forwardRef((n, s) => {
+    const { children: i, ...r } = n;
+    if (v.isValidElement(i)) {
+      const o = ui(i), a = ci(r, i.props);
+      return i.type !== v.Fragment && (a.ref = s ? wn(s, o) : o), v.cloneElement(i, a);
+    }
+    return v.Children.count(i) > 1 ? v.Children.only(null) : null;
   });
   return t.displayName = `${e}.SlotClone`, t;
 }
-var se = Symbol("radix.slottable");
-function ie(e) {
-  return i.isValidElement(e) && typeof e.type == "function" && "__radixId" in e.type && e.type.__radixId === se;
+var oi = Symbol("radix.slottable");
+function ai(e) {
+  return v.isValidElement(e) && typeof e.type == "function" && "__radixId" in e.type && e.type.__radixId === oi;
 }
-function ae(e, t) {
-  const r = { ...t };
-  for (const o in t) {
-    const n = e[o], s = t[o];
-    /^on[A-Z]/.test(o) ? n && s ? r[o] = (...a) => {
-      const f = s(...a);
-      return n(...a), f;
-    } : n && (r[o] = n) : o === "style" ? r[o] = { ...n, ...s } : o === "className" && (r[o] = [n, s].filter(Boolean).join(" "));
+function ci(e, t) {
+  const n = { ...t };
+  for (const s in t) {
+    const i = e[s], r = t[s];
+    /^on[A-Z]/.test(s) ? i && r ? n[s] = (...a) => {
+      const l = r(...a);
+      return i(...a), l;
+    } : i && (n[s] = i) : s === "style" ? n[s] = { ...i, ...r } : s === "className" && (n[s] = [i, r].filter(Boolean).join(" "));
   }
-  return { ...e, ...r };
+  return { ...e, ...n };
 }
-function ce(e) {
-  var o, n;
-  let t = (o = Object.getOwnPropertyDescriptor(e.props, "ref")) == null ? void 0 : o.get, r = t && "isReactWarning" in t && t.isReactWarning;
-  return r ? e.ref : (t = (n = Object.getOwnPropertyDescriptor(e, "ref")) == null ? void 0 : n.get, r = t && "isReactWarning" in t && t.isReactWarning, r ? e.props.ref : e.props.ref || e.ref);
+function ui(e) {
+  var s, i;
+  let t = (s = Object.getOwnPropertyDescriptor(e.props, "ref")) == null ? void 0 : s.get, n = t && "isReactWarning" in t && t.isReactWarning;
+  return n ? e.ref : (t = (i = Object.getOwnPropertyDescriptor(e, "ref")) == null ? void 0 : i.get, n = t && "isReactWarning" in t && t.isReactWarning, n ? e.props.ref : e.props.ref || e.ref);
 }
-var le = [
+var li = [
   "a",
   "button",
   "div",
@@ -103,354 +102,3615 @@ var le = [
   "span",
   "svg",
   "ul"
-], j = le.reduce((e, t) => {
-  const r = /* @__PURE__ */ re(`Primitive.${t}`), o = i.forwardRef((n, s) => {
-    const { asChild: l, ...a } = n, f = l ? r : t;
-    return typeof window < "u" && (window[Symbol.for("radix-ui")] = !0), /* @__PURE__ */ d(f, { ...a, ref: s });
+], xn = li.reduce((e, t) => {
+  const n = /* @__PURE__ */ ii(`Primitive.${t}`), s = v.forwardRef((i, r) => {
+    const { asChild: o, ...a } = i, l = o ? n : t;
+    return typeof window < "u" && (window[Symbol.for("radix-ui")] = !0), /* @__PURE__ */ M(l, { ...a, ref: r });
   });
-  return o.displayName = `Primitive.${t}`, { ...e, [t]: o };
+  return s.displayName = `Primitive.${t}`, { ...e, [t]: s };
 }, {});
-function ue(e, t) {
-  e && H.flushSync(() => e.dispatchEvent(t));
+function fi(e, t) {
+  e && qs.flushSync(() => e.dispatchEvent(t));
 }
-function I(e) {
-  const t = i.useRef(e);
-  return i.useEffect(() => {
+function ht(e) {
+  const t = v.useRef(e);
+  return v.useEffect(() => {
     t.current = e;
-  }), i.useMemo(() => (...r) => {
-    var o;
-    return (o = t.current) == null ? void 0 : o.call(t, ...r);
+  }), v.useMemo(() => (...n) => {
+    var s;
+    return (s = t.current) == null ? void 0 : s.call(t, ...n);
   }, []);
 }
-function de(e, t = globalThis == null ? void 0 : globalThis.document) {
-  const r = I(e);
-  i.useEffect(() => {
-    const o = (n) => {
-      n.key === "Escape" && r(n);
+function di(e, t = globalThis == null ? void 0 : globalThis.document) {
+  const n = ht(e);
+  v.useEffect(() => {
+    const s = (i) => {
+      i.key === "Escape" && n(i);
     };
-    return t.addEventListener("keydown", o, { capture: !0 }), () => t.removeEventListener("keydown", o, { capture: !0 });
-  }, [r, t]);
+    return t.addEventListener("keydown", s, { capture: !0 }), () => t.removeEventListener("keydown", s, { capture: !0 });
+  }, [n, t]);
 }
-var fe = "DismissableLayer", B = "dismissableLayer.update", pe = "dismissableLayer.pointerDownOutside", ye = "dismissableLayer.focusOutside", A, U = i.createContext({
+var hi = "DismissableLayer", Ge = "dismissableLayer.update", pi = "dismissableLayer.pointerDownOutside", mi = "dismissableLayer.focusOutside", Wt, Vn = v.createContext({
   layers: /* @__PURE__ */ new Set(),
   layersWithOutsidePointerEventsDisabled: /* @__PURE__ */ new Set(),
   branches: /* @__PURE__ */ new Set()
-}), z = i.forwardRef(
+}), An = v.forwardRef(
   (e, t) => {
     const {
-      disableOutsidePointerEvents: r = !1,
-      onEscapeKeyDown: o,
-      onPointerDownOutside: n,
-      onFocusOutside: s,
-      onInteractOutside: l,
+      disableOutsidePointerEvents: n = !1,
+      onEscapeKeyDown: s,
+      onPointerDownOutside: i,
+      onFocusOutside: r,
+      onInteractOutside: o,
       onDismiss: a,
-      ...f
-    } = e, u = i.useContext(U), [c, y] = i.useState(null), m = (c == null ? void 0 : c.ownerDocument) ?? (globalThis == null ? void 0 : globalThis.document), [, L] = i.useState({}), b = M(t, (p) => y(p)), C = Array.from(u.layers), [P] = [...u.layersWithOutsidePointerEventsDisabled].slice(-1), h = C.indexOf(P), x = c ? C.indexOf(c) : -1, w = u.layersWithOutsidePointerEventsDisabled.size > 0, W = x >= h, Y = ve((p) => {
-      const R = p.target, k = [...u.branches].some((D) => D.contains(R));
-      !W || k || (n == null || n(p), l == null || l(p), p.defaultPrevented || a == null || a());
-    }, m), N = Ee((p) => {
-      const R = p.target;
-      [...u.branches].some((D) => D.contains(R)) || (s == null || s(p), l == null || l(p), p.defaultPrevented || a == null || a());
-    }, m);
-    return de((p) => {
-      x === u.layers.size - 1 && (o == null || o(p), !p.defaultPrevented && a && (p.preventDefault(), a()));
-    }, m), i.useEffect(() => {
+      ...l
+    } = e, u = v.useContext(Vn), [c, d] = v.useState(null), f = (c == null ? void 0 : c.ownerDocument) ?? (globalThis == null ? void 0 : globalThis.document), [, h] = v.useState({}), g = Sn(t, (x) => d(x)), y = Array.from(u.layers), [T] = [...u.layersWithOutsidePointerEventsDisabled].slice(-1), p = y.indexOf(T), V = c ? y.indexOf(c) : -1, m = u.layersWithOutsidePointerEventsDisabled.size > 0, C = V >= p, w = bi((x) => {
+      const S = x.target, D = [...u.branches].some((F) => F.contains(S));
+      !C || D || (i == null || i(x), o == null || o(x), x.defaultPrevented || a == null || a());
+    }, f), A = vi((x) => {
+      const S = x.target;
+      [...u.branches].some((F) => F.contains(S)) || (r == null || r(x), o == null || o(x), x.defaultPrevented || a == null || a());
+    }, f);
+    return di((x) => {
+      V === u.layers.size - 1 && (s == null || s(x), !x.defaultPrevented && a && (x.preventDefault(), a()));
+    }, f), v.useEffect(() => {
       if (c)
-        return r && (u.layersWithOutsidePointerEventsDisabled.size === 0 && (A = m.body.style.pointerEvents, m.body.style.pointerEvents = "none"), u.layersWithOutsidePointerEventsDisabled.add(c)), u.layers.add(c), _(), () => {
-          r && u.layersWithOutsidePointerEventsDisabled.size === 1 && (m.body.style.pointerEvents = A);
+        return n && (u.layersWithOutsidePointerEventsDisabled.size === 0 && (Wt = f.body.style.pointerEvents, f.body.style.pointerEvents = "none"), u.layersWithOutsidePointerEventsDisabled.add(c)), u.layers.add(c), $t(), () => {
+          n && u.layersWithOutsidePointerEventsDisabled.size === 1 && (f.body.style.pointerEvents = Wt);
         };
-    }, [c, m, r, u]), i.useEffect(() => () => {
-      c && (u.layers.delete(c), u.layersWithOutsidePointerEventsDisabled.delete(c), _());
-    }, [c, u]), i.useEffect(() => {
-      const p = () => L({});
-      return document.addEventListener(B, p), () => document.removeEventListener(B, p);
-    }, []), /* @__PURE__ */ d(
-      j.div,
+    }, [c, f, n, u]), v.useEffect(() => () => {
+      c && (u.layers.delete(c), u.layersWithOutsidePointerEventsDisabled.delete(c), $t());
+    }, [c, u]), v.useEffect(() => {
+      const x = () => h({});
+      return document.addEventListener(Ge, x), () => document.removeEventListener(Ge, x);
+    }, []), /* @__PURE__ */ M(
+      xn.div,
       {
-        ...f,
-        ref: b,
+        ...l,
+        ref: g,
         style: {
-          pointerEvents: w ? W ? "auto" : "none" : void 0,
+          pointerEvents: m ? C ? "auto" : "none" : void 0,
           ...e.style
         },
-        onFocusCapture: O(e.onFocusCapture, N.onFocusCapture),
-        onBlurCapture: O(e.onBlurCapture, N.onBlurCapture),
-        onPointerDownCapture: O(
+        onFocusCapture: Ke(e.onFocusCapture, A.onFocusCapture),
+        onBlurCapture: Ke(e.onBlurCapture, A.onBlurCapture),
+        onPointerDownCapture: Ke(
           e.onPointerDownCapture,
-          Y.onPointerDownCapture
+          w.onPointerDownCapture
         )
       }
     );
   }
 );
-z.displayName = fe;
-var me = "DismissableLayerBranch", he = i.forwardRef((e, t) => {
-  const r = i.useContext(U), o = i.useRef(null), n = M(t, o);
-  return i.useEffect(() => {
-    const s = o.current;
-    if (s)
-      return r.branches.add(s), () => {
-        r.branches.delete(s);
+An.displayName = hi;
+var gi = "DismissableLayerBranch", yi = v.forwardRef((e, t) => {
+  const n = v.useContext(Vn), s = v.useRef(null), i = Sn(t, s);
+  return v.useEffect(() => {
+    const r = s.current;
+    if (r)
+      return n.branches.add(r), () => {
+        n.branches.delete(r);
       };
-  }, [r.branches]), /* @__PURE__ */ d(j.div, { ...e, ref: n });
+  }, [n.branches]), /* @__PURE__ */ M(xn.div, { ...e, ref: i });
 });
-he.displayName = me;
-function ve(e, t = globalThis == null ? void 0 : globalThis.document) {
-  const r = I(e), o = i.useRef(!1), n = i.useRef(() => {
+yi.displayName = gi;
+function bi(e, t = globalThis == null ? void 0 : globalThis.document) {
+  const n = ht(e), s = v.useRef(!1), i = v.useRef(() => {
   });
-  return i.useEffect(() => {
-    const s = (a) => {
-      if (a.target && !o.current) {
-        let f = function() {
-          V(
-            pe,
-            r,
+  return v.useEffect(() => {
+    const r = (a) => {
+      if (a.target && !s.current) {
+        let l = function() {
+          Cn(
+            pi,
+            n,
             u,
             { discrete: !0 }
           );
         };
         const u = { originalEvent: a };
-        a.pointerType === "touch" ? (t.removeEventListener("click", n.current), n.current = f, t.addEventListener("click", n.current, { once: !0 })) : f();
+        a.pointerType === "touch" ? (t.removeEventListener("click", i.current), i.current = l, t.addEventListener("click", i.current, { once: !0 })) : l();
       } else
-        t.removeEventListener("click", n.current);
-      o.current = !1;
-    }, l = window.setTimeout(() => {
-      t.addEventListener("pointerdown", s);
+        t.removeEventListener("click", i.current);
+      s.current = !1;
+    }, o = window.setTimeout(() => {
+      t.addEventListener("pointerdown", r);
     }, 0);
     return () => {
-      window.clearTimeout(l), t.removeEventListener("pointerdown", s), t.removeEventListener("click", n.current);
+      window.clearTimeout(o), t.removeEventListener("pointerdown", r), t.removeEventListener("click", i.current);
     };
-  }, [t, r]), {
+  }, [t, n]), {
     // ensures we check React component tree (not just DOM tree)
-    onPointerDownCapture: () => o.current = !0
+    onPointerDownCapture: () => s.current = !0
   };
 }
-function Ee(e, t = globalThis == null ? void 0 : globalThis.document) {
-  const r = I(e), o = i.useRef(!1);
-  return i.useEffect(() => {
-    const n = (s) => {
-      s.target && !o.current && V(ye, r, { originalEvent: s }, {
+function vi(e, t = globalThis == null ? void 0 : globalThis.document) {
+  const n = ht(e), s = v.useRef(!1);
+  return v.useEffect(() => {
+    const i = (r) => {
+      r.target && !s.current && Cn(mi, n, { originalEvent: r }, {
         discrete: !1
       });
     };
-    return t.addEventListener("focusin", n), () => t.removeEventListener("focusin", n);
-  }, [t, r]), {
-    onFocusCapture: () => o.current = !0,
-    onBlurCapture: () => o.current = !1
+    return t.addEventListener("focusin", i), () => t.removeEventListener("focusin", i);
+  }, [t, n]), {
+    onFocusCapture: () => s.current = !0,
+    onBlurCapture: () => s.current = !1
   };
 }
-function _() {
-  const e = new CustomEvent(B);
+function $t() {
+  const e = new CustomEvent(Ge);
   document.dispatchEvent(e);
 }
-function V(e, t, r, { discrete: o }) {
-  const n = r.originalEvent.target, s = new CustomEvent(e, { bubbles: !1, cancelable: !0, detail: r });
-  t && n.addEventListener(e, t, { once: !0 }), o ? ue(n, s) : n.dispatchEvent(s);
+function Cn(e, t, n, { discrete: s }) {
+  const i = n.originalEvent.target, r = new CustomEvent(e, { bubbles: !1, cancelable: !0, detail: n });
+  t && i.addEventListener(e, t, { once: !0 }), s ? fi(i, r) : i.dispatchEvent(r);
 }
-var ge = globalThis != null && globalThis.document ? i.useLayoutEffect : () => {
-}, be = i[" useInsertionEffect ".trim().toString()] || ge;
-function Ce({
+var Ti = globalThis != null && globalThis.document ? v.useLayoutEffect : () => {
+}, wi = v[" useInsertionEffect ".trim().toString()] || Ti;
+function Si({
   prop: e,
   defaultProp: t,
-  onChange: r = () => {
+  onChange: n = () => {
   },
-  caller: o
+  caller: s
 }) {
-  const [n, s, l] = Le({
+  const [i, r, o] = xi({
     defaultProp: t,
-    onChange: r
-  }), a = e !== void 0, f = a ? e : n;
+    onChange: n
+  }), a = e !== void 0, l = a ? e : i;
   {
-    const c = i.useRef(e !== void 0);
-    i.useEffect(() => {
-      const y = c.current;
-      y !== a && console.warn(
-        `${o} is changing from ${y ? "controlled" : "uncontrolled"} to ${a ? "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.`
+    const c = v.useRef(e !== void 0);
+    v.useEffect(() => {
+      const d = c.current;
+      d !== a && console.warn(
+        `${s} is changing from ${d ? "controlled" : "uncontrolled"} to ${a ? "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 = a;
-    }, [a, o]);
+    }, [a, s]);
   }
-  const u = i.useCallback(
+  const u = v.useCallback(
     (c) => {
-      var y;
+      var d;
       if (a) {
-        const m = Pe(c) ? c(e) : c;
-        m !== e && ((y = l.current) == null || y.call(l, m));
+        const f = Vi(c) ? c(e) : c;
+        f !== e && ((d = o.current) == null || d.call(o, f));
       } else
-        s(c);
+        r(c);
     },
-    [a, e, s, l]
+    [a, e, r, o]
   );
-  return [f, u];
+  return [l, u];
 }
-function Le({
+function xi({
   defaultProp: e,
   onChange: t
 }) {
-  const [r, o] = i.useState(e), n = i.useRef(r), s = i.useRef(t);
-  return be(() => {
-    s.current = t;
-  }, [t]), i.useEffect(() => {
-    var l;
-    n.current !== r && ((l = s.current) == null || l.call(s, r), n.current = r);
-  }, [r, n]), [r, o, s];
-}
-function Pe(e) {
+  const [n, s] = v.useState(e), i = v.useRef(n), r = v.useRef(t);
+  return wi(() => {
+    r.current = t;
+  }, [t]), v.useEffect(() => {
+    var o;
+    i.current !== n && ((o = r.current) == null || o.call(r, n), i.current = n);
+  }, [n, i]), [n, s, r];
+}
+function Vi(e) {
   return typeof e == "function";
 }
-const K = g.createContext({
-  layers: [],
-  setLayers: () => {
-  },
-  addLayer: () => {
+const Ai = se({});
+function Ci(e) {
+  const t = de(null);
+  return t.current === null && (t.current = e()), t.current;
+}
+const pt = typeof window < "u", Mi = pt ? Us : dt, Mn = /* @__PURE__ */ se(null);
+function Pi(e, t) {
+  e.indexOf(t) === -1 && e.push(t);
+}
+function Ei(e, t) {
+  const n = e.indexOf(t);
+  n > -1 && e.splice(n, 1);
+}
+const Y = (e, t, n) => n > t ? t : n < e ? e : n;
+let ie = () => {
+}, _ = () => {
+};
+process.env.NODE_ENV !== "production" && (ie = (e, t) => {
+  !e && typeof console < "u" && console.warn(t);
+}, _ = (e, t) => {
+  if (!e)
+    throw new Error(t);
+});
+const W = {}, Pn = (e) => /^-?(?:\d+(?:\.\d+)?|\.\d+)$/u.test(e);
+function Di(e) {
+  return typeof e == "object" && e !== null;
+}
+const En = (e) => /^0[^.\s]+$/u.test(e);
+// @__NO_SIDE_EFFECTS__
+function mt(e) {
+  let t;
+  return () => (t === void 0 && (t = e()), t);
+}
+const re = /* @__NO_SIDE_EFFECTS__ */ (e) => e, Fi = (e, t) => (n) => t(e(n)), Re = (...e) => e.reduce(Fi), Dn = /* @__NO_SIDE_EFFECTS__ */ (e, t, n) => {
+  const s = t - e;
+  return s === 0 ? 1 : (n - e) / s;
+};
+class Fn {
+  constructor() {
+    this.subscriptions = [];
+  }
+  add(t) {
+    return Pi(this.subscriptions, t), () => Ei(this.subscriptions, t);
+  }
+  notify(t, n, s) {
+    const i = this.subscriptions.length;
+    if (i)
+      if (i === 1)
+        this.subscriptions[0](t, n, s);
+      else
+        for (let r = 0; r < i; r++) {
+          const o = this.subscriptions[r];
+          o && o(t, n, s);
+        }
+  }
+  getSize() {
+    return this.subscriptions.length;
+  }
+  clear() {
+    this.subscriptions.length = 0;
+  }
+}
+const N = /* @__NO_SIDE_EFFECTS__ */ (e) => e * 1e3, K = /* @__NO_SIDE_EFFECTS__ */ (e) => e / 1e3;
+function Rn(e, t) {
+  return t ? e * (1e3 / t) : 0;
+}
+const _t = /* @__PURE__ */ new Set();
+function On(e, t, n) {
+  e || _t.has(t) || (console.warn(t), _t.add(t));
+}
+const Ln = (e, t, n) => (((1 - 3 * n + 3 * t) * e + (3 * n - 6 * t)) * e + 3 * t) * e, Ri = 1e-7, Oi = 12;
+function Li(e, t, n, s, i) {
+  let r, o, a = 0;
+  do
+    o = t + (n - t) / 2, r = Ln(o, s, i) - e, r > 0 ? n = o : t = o;
+  while (Math.abs(r) > Ri && ++a < Oi);
+  return o;
+}
+function be(e, t, n, s) {
+  if (e === t && n === s)
+    return re;
+  const i = (r) => Li(r, 0, 1, e, n);
+  return (r) => r === 0 || r === 1 ? r : Ln(i(r), t, s);
+}
+const In = (e) => (t) => t <= 0.5 ? e(2 * t) / 2 : (2 - e(2 * (1 - t))) / 2, kn = (e) => (t) => 1 - e(1 - t), Nn = /* @__PURE__ */ be(0.33, 1.53, 0.69, 0.99), gt = /* @__PURE__ */ kn(Nn), Bn = /* @__PURE__ */ In(gt), Kn = (e) => (e *= 2) < 1 ? 0.5 * gt(e) : 0.5 * (2 - Math.pow(2, -10 * (e - 1))), yt = (e) => 1 - Math.sin(Math.acos(e)), Ii = kn(yt), Wn = In(yt), ki = /* @__PURE__ */ be(0.42, 0, 1, 1), Ni = /* @__PURE__ */ be(0, 0, 0.58, 1), $n = /* @__PURE__ */ be(0.42, 0, 0.58, 1), Bi = (e) => Array.isArray(e) && typeof e[0] != "number", _n = (e) => Array.isArray(e) && typeof e[0] == "number", jt = {
+  linear: re,
+  easeIn: ki,
+  easeInOut: $n,
+  easeOut: Ni,
+  circIn: yt,
+  circInOut: Wn,
+  circOut: Ii,
+  backIn: gt,
+  backInOut: Bn,
+  backOut: Nn,
+  anticipate: Kn
+}, Ki = (e) => typeof e == "string", Ut = (e) => {
+  if (_n(e)) {
+    _(e.length === 4, "Cubic bezier arrays must contain four numerical values.");
+    const [t, n, s, i] = e;
+    return be(t, n, s, i);
+  } else if (Ki(e))
+    return _(jt[e] !== void 0, `Invalid easing type '${e}'`), jt[e];
+  return e;
+}, Te = [
+  "setup",
+  // Compute
+  "read",
+  // Read
+  "resolveKeyframes",
+  // Write/Read/Write/Read
+  "preUpdate",
+  // Compute
+  "update",
+  // Compute
+  "preRender",
+  // Compute
+  "render",
+  // Write
+  "postRender"
+  // Compute
+];
+function Wi(e, t) {
+  let n = /* @__PURE__ */ new Set(), s = /* @__PURE__ */ new Set(), i = !1, r = !1;
+  const o = /* @__PURE__ */ new WeakSet();
+  let a = {
+    delta: 0,
+    timestamp: 0,
+    isProcessing: !1
+  };
+  function l(c) {
+    o.has(c) && (u.schedule(c), e()), c(a);
+  }
+  const u = {
+    /**
+     * Schedule a process to run on the next frame.
+     */
+    schedule: (c, d = !1, f = !1) => {
+      const g = f && i ? n : s;
+      return d && o.add(c), g.has(c) || g.add(c), c;
+    },
+    /**
+     * Cancel the provided callback from running on the next frame.
+     */
+    cancel: (c) => {
+      s.delete(c), o.delete(c);
+    },
+    /**
+     * Execute all schedule callbacks.
+     */
+    process: (c) => {
+      if (a = c, i) {
+        r = !0;
+        return;
+      }
+      i = !0, [n, s] = [s, n], n.forEach(l), n.clear(), i = !1, r && (r = !1, u.process(c));
+    }
+  };
+  return u;
+}
+const $i = 40;
+function jn(e, t) {
+  let n = !1, s = !0;
+  const i = {
+    delta: 0,
+    timestamp: 0,
+    isProcessing: !1
+  }, r = () => n = !0, o = Te.reduce((m, C) => (m[C] = Wi(r), m), {}), { setup: a, read: l, resolveKeyframes: u, preUpdate: c, update: d, preRender: f, render: h, postRender: g } = o, y = () => {
+    const m = W.useManualTiming ? i.timestamp : performance.now();
+    n = !1, W.useManualTiming || (i.delta = s ? 1e3 / 60 : Math.max(Math.min(m - i.timestamp, $i), 1)), i.timestamp = m, i.isProcessing = !0, a.process(i), l.process(i), u.process(i), c.process(i), d.process(i), f.process(i), h.process(i), g.process(i), i.isProcessing = !1, n && t && (s = !1, e(y));
+  }, T = () => {
+    n = !0, s = !0, i.isProcessing || e(y);
+  };
+  return { schedule: Te.reduce((m, C) => {
+    const w = o[C];
+    return m[C] = (A, x = !1, S = !1) => (n || T(), w.schedule(A, x, S)), m;
+  }, {}), cancel: (m) => {
+    for (let C = 0; C < Te.length; C++)
+      o[Te[C]].cancel(m);
+  }, state: i, steps: o };
+}
+const { schedule: k, cancel: He, state: Ae, steps: Dc } = /* @__PURE__ */ jn(typeof requestAnimationFrame < "u" ? requestAnimationFrame : re, !0);
+let Se;
+function _i() {
+  Se = void 0;
+}
+const L = {
+  now: () => (Se === void 0 && L.set(Ae.isProcessing || W.useManualTiming ? Ae.timestamp : performance.now()), Se),
+  set: (e) => {
+    Se = e, queueMicrotask(_i);
+  }
+}, Un = (e) => (t) => typeof t == "string" && t.startsWith(e), zn = /* @__PURE__ */ Un("--"), ji = /* @__PURE__ */ Un("var(--"), bt = (e) => ji(e) ? Ui.test(e.split("/*")[0].trim()) : !1, Ui = /var\(--(?:[\w-]+\s*|[\w-]+\s*,(?:\s*[^)(\s]|\s*\((?:[^)(]|\([^)(]*\))*\))+\s*)\)$/iu, oe = {
+  test: (e) => typeof e == "number",
+  parse: parseFloat,
+  transform: (e) => e
+}, pe = {
+  ...oe,
+  transform: (e) => Y(0, 1, e)
+}, we = {
+  ...oe,
+  default: 1
+}, he = (e) => Math.round(e * 1e5) / 1e5, vt = /-?(?:\d+(?:\.\d+)?|\.\d+)/gu;
+function zi(e) {
+  return e == null;
+}
+const Gi = /^(?:#[\da-f]{3,8}|(?:rgb|hsl)a?\((?:-?[\d.]+%?[,\s]+){2}-?[\d.]+%?\s*(?:[,/]\s*)?(?:\b\d+(?:\.\d+)?|\.\d+)?%?\))$/iu, Tt = (e, t) => (n) => !!(typeof n == "string" && Gi.test(n) && n.startsWith(e) || t && !zi(n) && Object.prototype.hasOwnProperty.call(n, t)), Gn = (e, t, n) => (s) => {
+  if (typeof s != "string")
+    return s;
+  const [i, r, o, a] = s.match(vt);
+  return {
+    [e]: parseFloat(i),
+    [t]: parseFloat(r),
+    [n]: parseFloat(o),
+    alpha: a !== void 0 ? parseFloat(a) : 1
+  };
+}, Hi = (e) => Y(0, 255, e), We = {
+  ...oe,
+  transform: (e) => Math.round(Hi(e))
+}, U = {
+  test: /* @__PURE__ */ Tt("rgb", "red"),
+  parse: /* @__PURE__ */ Gn("red", "green", "blue"),
+  transform: ({ red: e, green: t, blue: n, alpha: s = 1 }) => "rgba(" + We.transform(e) + ", " + We.transform(t) + ", " + We.transform(n) + ", " + he(pe.transform(s)) + ")"
+};
+function Yi(e) {
+  let t = "", n = "", s = "", i = "";
+  return e.length > 5 ? (t = e.substring(1, 3), n = e.substring(3, 5), s = e.substring(5, 7), i = e.substring(7, 9)) : (t = e.substring(1, 2), n = e.substring(2, 3), s = e.substring(3, 4), i = e.substring(4, 5), t += t, n += n, s += s, i += i), {
+    red: parseInt(t, 16),
+    green: parseInt(n, 16),
+    blue: parseInt(s, 16),
+    alpha: i ? parseInt(i, 16) / 255 : 1
+  };
+}
+const Ye = {
+  test: /* @__PURE__ */ Tt("#"),
+  parse: Yi,
+  transform: U.transform
+}, ve = /* @__NO_SIDE_EFFECTS__ */ (e) => ({
+  test: (t) => typeof t == "string" && t.endsWith(e) && t.split(" ").length === 1,
+  parse: parseFloat,
+  transform: (t) => `${t}${e}`
+}), $ = /* @__PURE__ */ ve("deg"), Q = /* @__PURE__ */ ve("%"), b = /* @__PURE__ */ ve("px"), Xi = /* @__PURE__ */ ve("vh"), qi = /* @__PURE__ */ ve("vw"), zt = {
+  ...Q,
+  parse: (e) => Q.parse(e) / 100,
+  transform: (e) => Q.transform(e * 100)
+}, q = {
+  test: /* @__PURE__ */ Tt("hsl", "hue"),
+  parse: /* @__PURE__ */ Gn("hue", "saturation", "lightness"),
+  transform: ({ hue: e, saturation: t, lightness: n, alpha: s = 1 }) => "hsla(" + Math.round(e) + ", " + Q.transform(he(t)) + ", " + Q.transform(he(n)) + ", " + he(pe.transform(s)) + ")"
+}, E = {
+  test: (e) => U.test(e) || Ye.test(e) || q.test(e),
+  parse: (e) => U.test(e) ? U.parse(e) : q.test(e) ? q.parse(e) : Ye.parse(e),
+  transform: (e) => typeof e == "string" ? e : e.hasOwnProperty("red") ? U.transform(e) : q.transform(e),
+  getAnimatableNone: (e) => {
+    const t = E.parse(e);
+    return t.alpha = 0, E.transform(t);
+  }
+}, Zi = /(?:#[\da-f]{3,8}|(?:rgb|hsl)a?\((?:-?[\d.]+%?[,\s]+){2}-?[\d.]+%?\s*(?:[,/]\s*)?(?:\b\d+(?:\.\d+)?|\.\d+)?%?\))/giu;
+function Ji(e) {
+  var t, n;
+  return isNaN(e) && typeof e == "string" && (((t = e.match(vt)) == null ? void 0 : t.length) || 0) + (((n = e.match(Zi)) == null ? void 0 : n.length) || 0) > 0;
+}
+const Hn = "number", Yn = "color", Qi = "var", er = "var(", Gt = "${}", tr = /var\s*\(\s*--(?:[\w-]+\s*|[\w-]+\s*,(?:\s*[^)(\s]|\s*\((?:[^)(]|\([^)(]*\))*\))+\s*)\)|#[\da-f]{3,8}|(?:rgb|hsl)a?\((?:-?[\d.]+%?[,\s]+){2}-?[\d.]+%?\s*(?:[,/]\s*)?(?:\b\d+(?:\.\d+)?|\.\d+)?%?\)|-?(?:\d+(?:\.\d+)?|\.\d+)/giu;
+function me(e) {
+  const t = e.toString(), n = [], s = {
+    color: [],
+    number: [],
+    var: []
+  }, i = [];
+  let r = 0;
+  const a = t.replace(tr, (l) => (E.test(l) ? (s.color.push(r), i.push(Yn), n.push(E.parse(l))) : l.startsWith(er) ? (s.var.push(r), i.push(Qi), n.push(l)) : (s.number.push(r), i.push(Hn), n.push(parseFloat(l))), ++r, Gt)).split(Gt);
+  return { values: n, split: a, indexes: s, types: i };
+}
+function Xn(e) {
+  return me(e).values;
+}
+function qn(e) {
+  const { split: t, types: n } = me(e), s = t.length;
+  return (i) => {
+    let r = "";
+    for (let o = 0; o < s; o++)
+      if (r += t[o], i[o] !== void 0) {
+        const a = n[o];
+        a === Hn ? r += he(i[o]) : a === Yn ? r += E.transform(i[o]) : r += i[o];
+      }
+    return r;
+  };
+}
+const nr = (e) => typeof e == "number" ? 0 : E.test(e) ? E.getAnimatableNone(e) : e;
+function sr(e) {
+  const t = Xn(e);
+  return qn(e)(t.map(nr));
+}
+const ae = {
+  test: Ji,
+  parse: Xn,
+  createTransformer: qn,
+  getAnimatableNone: sr
+};
+function $e(e, t, n) {
+  return n < 0 && (n += 1), n > 1 && (n -= 1), n < 1 / 6 ? e + (t - e) * 6 * n : n < 1 / 2 ? t : n < 2 / 3 ? e + (t - e) * (2 / 3 - n) * 6 : e;
+}
+function ir({ hue: e, saturation: t, lightness: n, alpha: s }) {
+  e /= 360, t /= 100, n /= 100;
+  let i = 0, r = 0, o = 0;
+  if (!t)
+    i = r = o = n;
+  else {
+    const a = n < 0.5 ? n * (1 + t) : n + t - n * t, l = 2 * n - a;
+    i = $e(l, a, e + 1 / 3), r = $e(l, a, e), o = $e(l, a, e - 1 / 3);
+  }
+  return {
+    red: Math.round(i * 255),
+    green: Math.round(r * 255),
+    blue: Math.round(o * 255),
+    alpha: s
+  };
+}
+function Ce(e, t) {
+  return (n) => n > 0 ? t : e;
+}
+const Oe = (e, t, n) => e + (t - e) * n, _e = (e, t, n) => {
+  const s = e * e, i = n * (t * t - s) + s;
+  return i < 0 ? 0 : Math.sqrt(i);
+}, rr = [Ye, U, q], or = (e) => rr.find((t) => t.test(e));
+function Ht(e) {
+  const t = or(e);
+  if (ie(!!t, `'${e}' is not an animatable color. Use the equivalent color code instead.`), !t)
+    return !1;
+  let n = t.parse(e);
+  return t === q && (n = ir(n)), n;
+}
+const Yt = (e, t) => {
+  const n = Ht(e), s = Ht(t);
+  if (!n || !s)
+    return Ce(e, t);
+  const i = { ...n };
+  return (r) => (i.red = _e(n.red, s.red, r), i.green = _e(n.green, s.green, r), i.blue = _e(n.blue, s.blue, r), i.alpha = Oe(n.alpha, s.alpha, r), U.transform(i));
+}, Xe = /* @__PURE__ */ new Set(["none", "hidden"]);
+function ar(e, t) {
+  return Xe.has(e) ? (n) => n <= 0 ? e : t : (n) => n >= 1 ? t : e;
+}
+function cr(e, t) {
+  return (n) => Oe(e, t, n);
+}
+function wt(e) {
+  return typeof e == "number" ? cr : typeof e == "string" ? bt(e) ? Ce : E.test(e) ? Yt : fr : Array.isArray(e) ? Zn : typeof e == "object" ? E.test(e) ? Yt : ur : Ce;
+}
+function Zn(e, t) {
+  const n = [...e], s = n.length, i = e.map((r, o) => wt(r)(r, t[o]));
+  return (r) => {
+    for (let o = 0; o < s; o++)
+      n[o] = i[o](r);
+    return n;
+  };
+}
+function ur(e, t) {
+  const n = { ...e, ...t }, s = {};
+  for (const i in n)
+    e[i] !== void 0 && t[i] !== void 0 && (s[i] = wt(e[i])(e[i], t[i]));
+  return (i) => {
+    for (const r in s)
+      n[r] = s[r](i);
+    return n;
+  };
+}
+function lr(e, t) {
+  const n = [], s = { color: 0, var: 0, number: 0 };
+  for (let i = 0; i < t.values.length; i++) {
+    const r = t.types[i], o = e.indexes[r][s[r]], a = e.values[o] ?? 0;
+    n[i] = a, s[r]++;
+  }
+  return n;
+}
+const fr = (e, t) => {
+  const n = ae.createTransformer(t), s = me(e), i = me(t);
+  return s.indexes.var.length === i.indexes.var.length && s.indexes.color.length === i.indexes.color.length && s.indexes.number.length >= i.indexes.number.length ? Xe.has(e) && !i.values.length || Xe.has(t) && !s.values.length ? ar(e, t) : Re(Zn(lr(s, i), i.values), n) : (ie(!0, `Complex values '${e}' and '${t}' too different to mix. Ensure all colors are of the same type, and that each contains the same quantity of number and color values. Falling back to instant transition.`), Ce(e, t));
+};
+function Jn(e, t, n) {
+  return typeof e == "number" && typeof t == "number" && typeof n == "number" ? Oe(e, t, n) : wt(e)(e, t);
+}
+const dr = (e) => {
+  const t = ({ timestamp: n }) => e(n);
+  return {
+    start: (n = !0) => k.update(t, n),
+    stop: () => He(t),
+    /**
+     * If we're processing this frame we can use the
+     * framelocked timestamp to keep things in sync.
+     */
+    now: () => Ae.isProcessing ? Ae.timestamp : L.now()
+  };
+}, Qn = (e, t, n = 10) => {
+  let s = "";
+  const i = Math.max(Math.round(t / n), 2);
+  for (let r = 0; r < i; r++)
+    s += Math.round(e(r / (i - 1)) * 1e4) / 1e4 + ", ";
+  return `linear(${s.substring(0, s.length - 2)})`;
+}, Me = 2e4;
+function St(e) {
+  let t = 0;
+  const n = 50;
+  let s = e.next(t);
+  for (; !s.done && t < Me; )
+    t += n, s = e.next(t);
+  return t >= Me ? 1 / 0 : t;
+}
+function hr(e, t = 100, n) {
+  const s = n({ ...e, keyframes: [0, t] }), i = Math.min(St(s), Me);
+  return {
+    type: "keyframes",
+    ease: (r) => s.next(i * r).value / t,
+    duration: /* @__PURE__ */ K(i)
+  };
+}
+const pr = 5;
+function es(e, t, n) {
+  const s = Math.max(t - pr, 0);
+  return Rn(n - e(s), t - s);
+}
+const P = {
+  // Default spring physics
+  stiffness: 100,
+  damping: 10,
+  mass: 1,
+  velocity: 0,
+  // Default duration/bounce-based options
+  duration: 800,
+  // in ms
+  bounce: 0.3,
+  visualDuration: 0.3,
+  // in seconds
+  // Rest thresholds
+  restSpeed: {
+    granular: 0.01,
+    default: 2
   },
-  removeLayer: () => {
+  restDelta: {
+    granular: 5e-3,
+    default: 0.5
   },
-  removeTopLayer: () => {
+  // Limits
+  minDuration: 0.01,
+  // in seconds
+  maxDuration: 10,
+  // in seconds
+  minDamping: 0.05,
+  maxDamping: 1
+}, Xt = 1e-3;
+function mr({ duration: e = P.duration, bounce: t = P.bounce, velocity: n = P.velocity, mass: s = P.mass }) {
+  let i, r;
+  ie(e <= /* @__PURE__ */ N(P.maxDuration), "Spring duration must be 10 seconds or less");
+  let o = 1 - t;
+  o = Y(P.minDamping, P.maxDamping, o), e = Y(P.minDuration, P.maxDuration, /* @__PURE__ */ K(e)), o < 1 ? (i = (u) => {
+    const c = u * o, d = c * e, f = c - n, h = qe(u, o), g = Math.exp(-d);
+    return Xt - f / h * g;
+  }, r = (u) => {
+    const d = u * o * e, f = d * n + n, h = Math.pow(o, 2) * Math.pow(u, 2) * e, g = Math.exp(-d), y = qe(Math.pow(u, 2), o);
+    return (-i(u) + Xt > 0 ? -1 : 1) * ((f - h) * g) / y;
+  }) : (i = (u) => {
+    const c = Math.exp(-u * e), d = (u - n) * e + 1;
+    return -1e-3 + c * d;
+  }, r = (u) => {
+    const c = Math.exp(-u * e), d = (n - u) * (e * e);
+    return c * d;
+  });
+  const a = 5 / e, l = yr(i, r, a);
+  if (e = /* @__PURE__ */ N(e), isNaN(l))
+    return {
+      stiffness: P.stiffness,
+      damping: P.damping,
+      duration: e
+    };
+  {
+    const u = Math.pow(l, 2) * s;
+    return {
+      stiffness: u,
+      damping: o * 2 * Math.sqrt(s * u),
+      duration: e
+    };
   }
-}), je = ({ children: e }) => {
-  const [t, r] = g.useState([]), o = (l) => {
-    r((a) => [...a, l]);
-  }, n = (l) => {
-    r(t.filter((a) => a !== l));
-  }, s = () => {
-    const l = t[t.length - 1];
-    l && n(l);
-  };
-  return /* @__PURE__ */ d(
-    K.Provider,
-    {
-      value: { layers: t, setLayers: r, addLayer: o, removeLayer: n, removeTopLayer: s },
-      children: e
+}
+const gr = 12;
+function yr(e, t, n) {
+  let s = n;
+  for (let i = 1; i < gr; i++)
+    s = s - e(s) / t(s);
+  return s;
+}
+function qe(e, t) {
+  return e * Math.sqrt(1 - t * t);
+}
+const br = ["duration", "bounce"], vr = ["stiffness", "damping", "mass"];
+function qt(e, t) {
+  return t.some((n) => e[n] !== void 0);
+}
+function Tr(e) {
+  let t = {
+    velocity: P.velocity,
+    stiffness: P.stiffness,
+    damping: P.damping,
+    mass: P.mass,
+    isResolvedFromDuration: !1,
+    ...e
+  };
+  if (!qt(e, vr) && qt(e, br))
+    if (e.visualDuration) {
+      const n = e.visualDuration, s = 2 * Math.PI / (n * 1.2), i = s * s, r = 2 * Y(0.05, 1, 1 - (e.bounce || 0)) * Math.sqrt(i);
+      t = {
+        ...t,
+        mass: P.mass,
+        stiffness: i,
+        damping: r
+      };
+    } else {
+      const n = mr(e);
+      t = {
+        ...t,
+        ...n,
+        mass: P.mass
+      }, t.isResolvedFromDuration = !0;
     }
-  );
-}, X = () => g.useContext(K), we = ({
-  defaultOpen: e,
-  open: t,
-  onOpenChange: r,
-  ...o
-}) => {
-  const [n, s] = Ce({
-    prop: t,
-    onChange: r,
-    defaultProp: e ?? !1
-  }), l = X(), a = o.a11yTitle;
-  if (g.useEffect(() => {
-    !n && l.layers.includes(a) && l.removeLayer(a);
-  }, [a, l, n]), !!n)
-    return /* @__PURE__ */ d(Re, { open: n, onOpenChange: s, ...o });
-}, Re = ({
-  open: e,
-  onOpenChange: t,
-  a11yTitle: r,
-  a11yDescription: o,
-  children: n,
-  // Focus scope props
-  trapped: s,
-  onMountAutoFocus: l,
-  onUnmountAutoFocus: a,
-  ...f
-}) => {
-  var C, P;
-  const u = r, c = X();
-  g.useEffect(() => {
-    !c || !e || c.layers.includes(u) || c.addLayer(u);
-  }, [u, c, e]);
-  const y = ((C = c.layers) == null ? void 0 : C.indexOf(u)) || 0, m = ((P = c.layers) == null ? void 0 : P.length) || 0, L = y !== 0, b = u === c.layers[c.layers.length - 1];
-  return /* @__PURE__ */ d(
-    z,
-    {
-      onEscapeKeyDown: (h) => {
-        b && (h.preventDefault(), c.removeTopLayer(), t(!1));
-      },
-      onPointerDownOutside: (h) => {
-        b && (h.preventDefault(), c.removeTopLayer(), t(!1));
-      },
-      children: /* @__PURE__ */ S(
-        v.Root,
-        {
-          open: e,
-          onOpenChange: (h) => {
-            var w;
-            if (((w = c == null ? void 0 : c.layers) == null ? void 0 : w.length) > 0)
-              return h === !1 && u === c.layers[c.layers.length - 1] ? (c.removeLayer(u), t(!1)) : void 0;
-            t(h);
-          },
-          children: [
-            /* @__PURE__ */ S(G.Root, { children: [
-              /* @__PURE__ */ d(v.Title, { children: r }),
-              o && /* @__PURE__ */ d(v.Description, { children: o })
-            ] }),
-            /* @__PURE__ */ d(ne, { 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(xe, { layer: y, children: /* @__PURE__ */ d(
-              Z,
-              {
-                trapped: typeof s == "boolean" ? s : b,
-                onMountAutoFocus: l,
-                onUnmountAutoFocus: a,
-                asChild: !0,
-                children: /* @__PURE__ */ d(Q, { children: /* @__PURE__ */ d(
-                  E,
-                  {
-                    as: T.div,
-                    initial: {
-                      top: `calc(var(--tgph-spacing-16) + var(--tgph-spacing-4) * ${m - 1})`
-                    },
-                    animate: {
-                      top: L ? `calc(var(--tgph-spacing-16) + var(--tgph-spacing-4) * ${y} )` : "var(--tgph-spacing-16)"
-                    },
-                    exit: { top: 0 },
-                    transition: { type: "spring", duration: 0.3, bounce: 0 },
-                    w: "full",
-                    justify: "center",
-                    style: {
-                      position: "fixed",
-                      left: 0,
-                      maxHeight: "calc(100vh - var(--tgph-spacing-32))",
-                      maxWidth: "calc(100vw - var(--tgph-spacing-8))",
-                      zIndex: `calc(var(--tgph-zIndex-modal) + ${y})`
-                    },
-                    children: /* @__PURE__ */ d(
-                      E,
-                      {
-                        direction: "column",
-                        as: T.div,
-                        animate: {
-                          scale: 1.02 - Math.abs(m - y) * 0.02,
-                          transformOrigin: "center center"
-                        },
-                        transition: {
-                          duration: 0.2,
-                          bounce: 0,
-                          type: "spring"
-                        },
-                        maxW: f.maxW ?? "160",
-                        w: f.w ?? "full",
-                        bg: "surface-1",
-                        border: "px",
-                        rounded: "4",
-                        shadow: "3",
-                        ...f,
-                        children: n
-                      },
-                      `content-${u}`
-                    )
-                  },
-                  `container-${u}`
-                ) })
-              }
-            ) }) }) })
-          ]
-        },
-        u
-      )
+  return t;
+}
+function Pe(e = P.visualDuration, t = P.bounce) {
+  const n = typeof e != "object" ? {
+    visualDuration: e,
+    keyframes: [0, 1],
+    bounce: t
+  } : e;
+  let { restSpeed: s, restDelta: i } = n;
+  const r = n.keyframes[0], o = n.keyframes[n.keyframes.length - 1], a = { done: !1, value: r }, { stiffness: l, damping: u, mass: c, duration: d, velocity: f, isResolvedFromDuration: h } = Tr({
+    ...n,
+    velocity: -/* @__PURE__ */ K(n.velocity || 0)
+  }), g = f || 0, y = u / (2 * Math.sqrt(l * c)), T = o - r, p = /* @__PURE__ */ K(Math.sqrt(l / c)), V = Math.abs(T) < 5;
+  s || (s = V ? P.restSpeed.granular : P.restSpeed.default), i || (i = V ? P.restDelta.granular : P.restDelta.default);
+  let m;
+  if (y < 1) {
+    const w = qe(p, y);
+    m = (A) => {
+      const x = Math.exp(-y * p * A);
+      return o - x * ((g + y * p * T) / w * Math.sin(w * A) + T * Math.cos(w * A));
+    };
+  } else if (y === 1)
+    m = (w) => o - Math.exp(-p * w) * (T + (g + p * T) * w);
+  else {
+    const w = p * Math.sqrt(y * y - 1);
+    m = (A) => {
+      const x = Math.exp(-y * p * A), S = Math.min(w * A, 300);
+      return o - x * ((g + y * p * T) * Math.sinh(S) + w * T * Math.cosh(S)) / w;
+    };
+  }
+  const C = {
+    calculatedDuration: h && d || null,
+    next: (w) => {
+      const A = m(w);
+      if (h)
+        a.done = w >= d;
+      else {
+        let x = w === 0 ? g : 0;
+        y < 1 && (x = w === 0 ? /* @__PURE__ */ N(g) : es(m, w, A));
+        const S = Math.abs(x) <= s, D = Math.abs(o - A) <= i;
+        a.done = S && D;
+      }
+      return a.value = a.done ? o : A, a;
+    },
+    toString: () => {
+      const w = Math.min(St(C), Me), A = Qn((x) => C.next(w * x).value, w, 30);
+      return w + "ms " + A;
+    },
+    toTransition: () => {
     }
-  );
-}, xe = ({ layer: e, children: t }) => e > 0 ? t : /* @__PURE__ */ S(v.Overlay, { children: [
-  /* @__PURE__ */ d(
-    te,
+  };
+  return C;
+}
+Pe.applyToOptions = (e) => {
+  const t = hr(e, 100, Pe);
+  return e.ease = t.ease, e.duration = /* @__PURE__ */ N(t.duration), e.type = "keyframes", e;
+};
+function Ze({ keyframes: e, velocity: t = 0, power: n = 0.8, timeConstant: s = 325, bounceDamping: i = 10, bounceStiffness: r = 500, modifyTarget: o, min: a, max: l, restDelta: u = 0.5, restSpeed: c }) {
+  const d = e[0], f = {
+    done: !1,
+    value: d
+  }, h = (S) => a !== void 0 && S < a || l !== void 0 && S > l, g = (S) => a === void 0 ? l : l === void 0 || Math.abs(a - S) < Math.abs(l - S) ? a : l;
+  let y = n * t;
+  const T = d + y, p = o === void 0 ? T : o(T);
+  p !== T && (y = p - d);
+  const V = (S) => -y * Math.exp(-S / s), m = (S) => p + V(S), C = (S) => {
+    const D = V(S), F = m(S);
+    f.done = Math.abs(D) <= u, f.value = f.done ? p : F;
+  };
+  let w, A;
+  const x = (S) => {
+    h(f.value) && (w = S, A = Pe({
+      keyframes: [f.value, g(f.value)],
+      velocity: es(m, S, f.value),
+      // TODO: This should be passing * 1000
+      damping: i,
+      stiffness: r,
+      restDelta: u,
+      restSpeed: c
+    }));
+  };
+  return x(0), {
+    calculatedDuration: null,
+    next: (S) => {
+      let D = !1;
+      return !A && w === void 0 && (D = !0, C(S), x(S)), w !== void 0 && S >= w ? A.next(S - w) : (!D && C(S), f);
+    }
+  };
+}
+function wr(e, t, n) {
+  const s = [], i = n || W.mix || Jn, r = e.length - 1;
+  for (let o = 0; o < r; o++) {
+    let a = i(e[o], e[o + 1]);
+    if (t) {
+      const l = Array.isArray(t) ? t[o] || re : t;
+      a = Re(l, a);
+    }
+    s.push(a);
+  }
+  return s;
+}
+function Sr(e, t, { clamp: n = !0, ease: s, mixer: i } = {}) {
+  const r = e.length;
+  if (_(r === t.length, "Both input and output ranges must be the same length"), r === 1)
+    return () => t[0];
+  if (r === 2 && t[0] === t[1])
+    return () => t[1];
+  const o = e[0] === e[1];
+  e[0] > e[r - 1] && (e = [...e].reverse(), t = [...t].reverse());
+  const a = wr(t, s, i), l = a.length, u = (c) => {
+    if (o && c < e[0])
+      return t[0];
+    let d = 0;
+    if (l > 1)
+      for (; d < e.length - 2 && !(c < e[d + 1]); d++)
+        ;
+    const f = /* @__PURE__ */ Dn(e[d], e[d + 1], c);
+    return a[d](f);
+  };
+  return n ? (c) => u(Y(e[0], e[r - 1], c)) : u;
+}
+function xr(e, t) {
+  const n = e[e.length - 1];
+  for (let s = 1; s <= t; s++) {
+    const i = /* @__PURE__ */ Dn(0, t, s);
+    e.push(Oe(n, 1, i));
+  }
+}
+function Vr(e) {
+  const t = [0];
+  return xr(t, e.length - 1), t;
+}
+function Ar(e, t) {
+  return e.map((n) => n * t);
+}
+function Cr(e, t) {
+  return e.map(() => t || $n).splice(0, e.length - 1);
+}
+function Z({ duration: e = 300, keyframes: t, times: n, ease: s = "easeInOut" }) {
+  const i = Bi(s) ? s.map(Ut) : Ut(s), r = {
+    done: !1,
+    value: t[0]
+  }, o = Ar(
+    // Only use the provided offsets if they're the correct length
+    // TODO Maybe we should warn here if there's a length mismatch
+    n && n.length === t.length ? n : Vr(t),
+    e
+  ), a = Sr(o, t, {
+    ease: Array.isArray(i) ? i : Cr(t, i)
+  });
+  return {
+    calculatedDuration: e,
+    next: (l) => (r.value = a(l), r.done = l >= e, r)
+  };
+}
+const Mr = (e) => e !== null;
+function xt(e, { repeat: t, repeatType: n = "loop" }, s, i = 1) {
+  const r = e.filter(Mr), a = i < 0 || t && n !== "loop" && t % 2 === 1 ? 0 : r.length - 1;
+  return !a || s === void 0 ? r[a] : s;
+}
+const Pr = {
+  decay: Ze,
+  inertia: Ze,
+  tween: Z,
+  keyframes: Z,
+  spring: Pe
+};
+function ts(e) {
+  typeof e.type == "string" && (e.type = Pr[e.type]);
+}
+class Vt {
+  constructor() {
+    this.updateFinished();
+  }
+  get finished() {
+    return this._finished;
+  }
+  updateFinished() {
+    this._finished = new Promise((t) => {
+      this.resolve = t;
+    });
+  }
+  notifyFinished() {
+    this.resolve();
+  }
+  /**
+   * Allows the animation to be awaited.
+   *
+   * @deprecated Use `finished` instead.
+   */
+  then(t, n) {
+    return this.finished.then(t, n);
+  }
+}
+const Er = (e) => e / 100;
+class At extends Vt {
+  constructor(t) {
+    super(), this.state = "idle", this.startTime = null, this.isStopped = !1, this.currentTime = 0, this.holdTime = null, this.playbackSpeed = 1, this.stop = () => {
+      var s, i;
+      const { motionValue: n } = this.options;
+      n && n.updatedAt !== L.now() && this.tick(L.now()), this.isStopped = !0, this.state !== "idle" && (this.teardown(), (i = (s = this.options).onStop) == null || i.call(s));
+    }, this.options = t, this.initAnimation(), this.play(), t.autoplay === !1 && this.pause();
+  }
+  initAnimation() {
+    const { options: t } = this;
+    ts(t);
+    const { type: n = Z, repeat: s = 0, repeatDelay: i = 0, repeatType: r, velocity: o = 0 } = t;
+    let { keyframes: a } = t;
+    const l = n || Z;
+    process.env.NODE_ENV !== "production" && l !== Z && _(a.length <= 2, `Only two keyframes currently supported with spring and inertia animations. Trying to animate ${a}`), l !== Z && typeof a[0] != "number" && (this.mixKeyframes = Re(Er, Jn(a[0], a[1])), a = [0, 100]);
+    const u = l({ ...t, keyframes: a });
+    r === "mirror" && (this.mirroredGenerator = l({
+      ...t,
+      keyframes: [...a].reverse(),
+      velocity: -o
+    })), u.calculatedDuration === null && (u.calculatedDuration = St(u));
+    const { calculatedDuration: c } = u;
+    this.calculatedDuration = c, this.resolvedDuration = c + i, this.totalDuration = this.resolvedDuration * (s + 1) - i, this.generator = u;
+  }
+  updateTime(t) {
+    const n = Math.round(t - this.startTime) * this.playbackSpeed;
+    this.holdTime !== null ? this.currentTime = this.holdTime : this.currentTime = n;
+  }
+  tick(t, n = !1) {
+    const { generator: s, totalDuration: i, mixKeyframes: r, mirroredGenerator: o, resolvedDuration: a, calculatedDuration: l } = this;
+    if (this.startTime === null)
+      return s.next(0);
+    const { delay: u = 0, keyframes: c, repeat: d, repeatType: f, repeatDelay: h, type: g, onUpdate: y, finalKeyframe: T } = this.options;
+    this.speed > 0 ? this.startTime = Math.min(this.startTime, t) : this.speed < 0 && (this.startTime = Math.min(t - i / this.speed, this.startTime)), n ? this.currentTime = t : this.updateTime(t);
+    const p = this.currentTime - u * (this.playbackSpeed >= 0 ? 1 : -1), V = this.playbackSpeed >= 0 ? p < 0 : p > i;
+    this.currentTime = Math.max(p, 0), this.state === "finished" && this.holdTime === null && (this.currentTime = i);
+    let m = this.currentTime, C = s;
+    if (d) {
+      const S = Math.min(this.currentTime, i) / a;
+      let D = Math.floor(S), F = S % 1;
+      !F && S >= 1 && (F = 1), F === 1 && D--, D = Math.min(D, d + 1), !!(D % 2) && (f === "reverse" ? (F = 1 - F, h && (F -= h / a)) : f === "mirror" && (C = o)), m = Y(0, 1, F) * a;
+    }
+    const w = V ? { done: !1, value: c[0] } : C.next(m);
+    r && (w.value = r(w.value));
+    let { done: A } = w;
+    !V && l !== null && (A = this.playbackSpeed >= 0 ? this.currentTime >= i : this.currentTime <= 0);
+    const x = this.holdTime === null && (this.state === "finished" || this.state === "running" && A);
+    return x && g !== Ze && (w.value = xt(c, this.options, T, this.speed)), y && y(w.value), x && this.finish(), w;
+  }
+  /**
+   * Allows the returned animation to be awaited or promise-chained. Currently
+   * resolves when the animation finishes at all but in a future update could/should
+   * reject if its cancels.
+   */
+  then(t, n) {
+    return this.finished.then(t, n);
+  }
+  get duration() {
+    return /* @__PURE__ */ K(this.calculatedDuration);
+  }
+  get time() {
+    return /* @__PURE__ */ K(this.currentTime);
+  }
+  set time(t) {
+    var n;
+    t = /* @__PURE__ */ N(t), this.currentTime = t, this.startTime === null || this.holdTime !== null || this.playbackSpeed === 0 ? this.holdTime = t : this.driver && (this.startTime = this.driver.now() - t / this.playbackSpeed), (n = this.driver) == null || n.start(!1);
+  }
+  get speed() {
+    return this.playbackSpeed;
+  }
+  set speed(t) {
+    this.updateTime(L.now());
+    const n = this.playbackSpeed !== t;
+    this.playbackSpeed = t, n && (this.time = /* @__PURE__ */ K(this.currentTime));
+  }
+  play() {
+    var i, r;
+    if (this.isStopped)
+      return;
+    const { driver: t = dr, startTime: n } = this.options;
+    this.driver || (this.driver = t((o) => this.tick(o))), (r = (i = this.options).onPlay) == null || r.call(i);
+    const s = this.driver.now();
+    this.state === "finished" ? (this.updateFinished(), this.startTime = s) : this.holdTime !== null ? this.startTime = s - this.holdTime : this.startTime || (this.startTime = n ?? s), this.state === "finished" && this.speed < 0 && (this.startTime += this.calculatedDuration), this.holdTime = null, this.state = "running", this.driver.start();
+  }
+  pause() {
+    this.state = "paused", this.updateTime(L.now()), this.holdTime = this.currentTime;
+  }
+  complete() {
+    this.state !== "running" && this.play(), this.state = "finished", this.holdTime = null;
+  }
+  finish() {
+    var t, n;
+    this.notifyFinished(), this.teardown(), this.state = "finished", (n = (t = this.options).onComplete) == null || n.call(t);
+  }
+  cancel() {
+    var t, n;
+    this.holdTime = null, this.startTime = 0, this.tick(0), this.teardown(), (n = (t = this.options).onCancel) == null || n.call(t);
+  }
+  teardown() {
+    this.state = "idle", this.stopDriver(), this.startTime = this.holdTime = null;
+  }
+  stopDriver() {
+    this.driver && (this.driver.stop(), this.driver = void 0);
+  }
+  sample(t) {
+    return this.startTime = 0, this.tick(t, !0);
+  }
+  attachTimeline(t) {
+    var n;
+    return this.options.allowFlatten && (this.options.type = "keyframes", this.options.ease = "linear", this.initAnimation()), (n = this.driver) == null || n.stop(), t.observe(this);
+  }
+}
+function Dr(e) {
+  for (let t = 1; t < e.length; t++)
+    e[t] ?? (e[t] = e[t - 1]);
+}
+const z = (e) => e * 180 / Math.PI, Je = (e) => {
+  const t = z(Math.atan2(e[1], e[0]));
+  return Qe(t);
+}, Fr = {
+  x: 4,
+  y: 5,
+  translateX: 4,
+  translateY: 5,
+  scaleX: 0,
+  scaleY: 3,
+  scale: (e) => (Math.abs(e[0]) + Math.abs(e[3])) / 2,
+  rotate: Je,
+  rotateZ: Je,
+  skewX: (e) => z(Math.atan(e[1])),
+  skewY: (e) => z(Math.atan(e[2])),
+  skew: (e) => (Math.abs(e[1]) + Math.abs(e[2])) / 2
+}, Qe = (e) => (e = e % 360, e < 0 && (e += 360), e), Zt = Je, Jt = (e) => Math.sqrt(e[0] * e[0] + e[1] * e[1]), Qt = (e) => Math.sqrt(e[4] * e[4] + e[5] * e[5]), Rr = {
+  x: 12,
+  y: 13,
+  z: 14,
+  translateX: 12,
+  translateY: 13,
+  translateZ: 14,
+  scaleX: Jt,
+  scaleY: Qt,
+  scale: (e) => (Jt(e) + Qt(e)) / 2,
+  rotateX: (e) => Qe(z(Math.atan2(e[6], e[5]))),
+  rotateY: (e) => Qe(z(Math.atan2(-e[2], e[0]))),
+  rotateZ: Zt,
+  rotate: Zt,
+  skewX: (e) => z(Math.atan(e[4])),
+  skewY: (e) => z(Math.atan(e[1])),
+  skew: (e) => (Math.abs(e[1]) + Math.abs(e[4])) / 2
+};
+function et(e) {
+  return e.includes("scale") ? 1 : 0;
+}
+function tt(e, t) {
+  if (!e || e === "none")
+    return et(t);
+  const n = e.match(/^matrix3d\(([-\d.e\s,]+)\)$/u);
+  let s, i;
+  if (n)
+    s = Rr, i = n;
+  else {
+    const a = e.match(/^matrix\(([-\d.e\s,]+)\)$/u);
+    s = Fr, i = a;
+  }
+  if (!i)
+    return et(t);
+  const r = s[t], o = i[1].split(",").map(Lr);
+  return typeof r == "function" ? r(o) : o[r];
+}
+const Or = (e, t) => {
+  const { transform: n = "none" } = getComputedStyle(e);
+  return tt(n, t);
+};
+function Lr(e) {
+  return parseFloat(e.trim());
+}
+const ce = [
+  "transformPerspective",
+  "x",
+  "y",
+  "z",
+  "translateX",
+  "translateY",
+  "translateZ",
+  "scale",
+  "scaleX",
+  "scaleY",
+  "rotate",
+  "rotateX",
+  "rotateY",
+  "rotateZ",
+  "skew",
+  "skewX",
+  "skewY"
+], ue = new Set(ce), en = (e) => e === oe || e === b, Ir = /* @__PURE__ */ new Set(["x", "y", "z"]), kr = ce.filter((e) => !Ir.has(e));
+function Nr(e) {
+  const t = [];
+  return kr.forEach((n) => {
+    const s = e.getValue(n);
+    s !== void 0 && (t.push([n, s.get()]), s.set(n.startsWith("scale") ? 1 : 0));
+  }), t;
+}
+const G = {
+  // Dimensions
+  width: ({ x: e }, { paddingLeft: t = "0", paddingRight: n = "0" }) => e.max - e.min - parseFloat(t) - parseFloat(n),
+  height: ({ y: e }, { paddingTop: t = "0", paddingBottom: n = "0" }) => e.max - e.min - parseFloat(t) - parseFloat(n),
+  top: (e, { top: t }) => parseFloat(t),
+  left: (e, { left: t }) => parseFloat(t),
+  bottom: ({ y: e }, { top: t }) => parseFloat(t) + (e.max - e.min),
+  right: ({ x: e }, { left: t }) => parseFloat(t) + (e.max - e.min),
+  // Transform
+  x: (e, { transform: t }) => tt(t, "x"),
+  y: (e, { transform: t }) => tt(t, "y")
+};
+G.translateX = G.x;
+G.translateY = G.y;
+const H = /* @__PURE__ */ new Set();
+let nt = !1, st = !1, it = !1;
+function ns() {
+  if (st) {
+    const e = Array.from(H).filter((s) => s.needsMeasurement), t = new Set(e.map((s) => s.element)), n = /* @__PURE__ */ new Map();
+    t.forEach((s) => {
+      const i = Nr(s);
+      i.length && (n.set(s, i), s.render());
+    }), e.forEach((s) => s.measureInitialState()), t.forEach((s) => {
+      s.render();
+      const i = n.get(s);
+      i && i.forEach(([r, o]) => {
+        var a;
+        (a = s.getValue(r)) == null || a.set(o);
+      });
+    }), e.forEach((s) => s.measureEndState()), e.forEach((s) => {
+      s.suspendedScrollY !== void 0 && window.scrollTo(0, s.suspendedScrollY);
+    });
+  }
+  st = !1, nt = !1, H.forEach((e) => e.complete(it)), H.clear();
+}
+function ss() {
+  H.forEach((e) => {
+    e.readKeyframes(), e.needsMeasurement && (st = !0);
+  });
+}
+function Br() {
+  it = !0, ss(), ns(), it = !1;
+}
+class Ct {
+  constructor(t, n, s, i, r, o = !1) {
+    this.state = "pending", this.isAsync = !1, this.needsMeasurement = !1, this.unresolvedKeyframes = [...t], this.onComplete = n, this.name = s, this.motionValue = i, this.element = r, this.isAsync = o;
+  }
+  scheduleResolve() {
+    this.state = "scheduled", this.isAsync ? (H.add(this), nt || (nt = !0, k.read(ss), k.resolveKeyframes(ns))) : (this.readKeyframes(), this.complete());
+  }
+  readKeyframes() {
+    const { unresolvedKeyframes: t, name: n, element: s, motionValue: i } = this;
+    if (t[0] === null) {
+      const r = i == null ? void 0 : i.get(), o = t[t.length - 1];
+      if (r !== void 0)
+        t[0] = r;
+      else if (s && n) {
+        const a = s.readValue(n, o);
+        a != null && (t[0] = a);
+      }
+      t[0] === void 0 && (t[0] = o), i && r === void 0 && i.set(t[0]);
+    }
+    Dr(t);
+  }
+  setFinalKeyframe() {
+  }
+  measureInitialState() {
+  }
+  renderEndStyles() {
+  }
+  measureEndState() {
+  }
+  complete(t = !1) {
+    this.state = "complete", this.onComplete(this.unresolvedKeyframes, this.finalKeyframe, t), H.delete(this);
+  }
+  cancel() {
+    this.state === "scheduled" && (H.delete(this), this.state = "pending");
+  }
+  resume() {
+    this.state === "pending" && this.scheduleResolve();
+  }
+}
+const Kr = (e) => e.startsWith("--");
+function Wr(e, t, n) {
+  Kr(t) ? e.style.setProperty(t, n) : e.style[t] = n;
+}
+const $r = /* @__PURE__ */ mt(() => window.ScrollTimeline !== void 0), _r = {};
+function jr(e, t) {
+  const n = /* @__PURE__ */ mt(e);
+  return () => _r[t] ?? n();
+}
+const is = /* @__PURE__ */ jr(() => {
+  try {
+    document.createElement("div").animate({ opacity: 0 }, { easing: "linear(0, 1)" });
+  } catch {
+    return !1;
+  }
+  return !0;
+}, "linearEasing"), fe = ([e, t, n, s]) => `cubic-bezier(${e}, ${t}, ${n}, ${s})`, tn = {
+  linear: "linear",
+  ease: "ease",
+  easeIn: "ease-in",
+  easeOut: "ease-out",
+  easeInOut: "ease-in-out",
+  circIn: /* @__PURE__ */ fe([0, 0.65, 0.55, 1]),
+  circOut: /* @__PURE__ */ fe([0.55, 0, 1, 0.45]),
+  backIn: /* @__PURE__ */ fe([0.31, 0.01, 0.66, -0.59]),
+  backOut: /* @__PURE__ */ fe([0.33, 1.53, 0.69, 0.99])
+};
+function rs(e, t) {
+  if (e)
+    return typeof e == "function" ? is() ? Qn(e, t) : "ease-out" : _n(e) ? fe(e) : Array.isArray(e) ? e.map((n) => rs(n, t) || tn.easeOut) : tn[e];
+}
+function Ur(e, t, n, { delay: s = 0, duration: i = 300, repeat: r = 0, repeatType: o = "loop", ease: a = "easeOut", times: l } = {}, u = void 0) {
+  const c = {
+    [t]: n
+  };
+  l && (c.offset = l);
+  const d = rs(a, i);
+  Array.isArray(d) && (c.easing = d);
+  const f = {
+    delay: s,
+    duration: i,
+    easing: Array.isArray(d) ? "linear" : d,
+    fill: "both",
+    iterations: r + 1,
+    direction: o === "reverse" ? "alternate" : "normal"
+  };
+  return u && (f.pseudoElement = u), e.animate(c, f);
+}
+function os(e) {
+  return typeof e == "function" && "applyToOptions" in e;
+}
+function zr({ type: e, ...t }) {
+  return os(e) && is() ? e.applyToOptions(t) : (t.duration ?? (t.duration = 300), t.ease ?? (t.ease = "easeOut"), t);
+}
+class Gr extends Vt {
+  constructor(t) {
+    if (super(), this.finishedTime = null, this.isStopped = !1, !t)
+      return;
+    const { element: n, name: s, keyframes: i, pseudoElement: r, allowFlatten: o = !1, finalKeyframe: a, onComplete: l } = t;
+    this.isPseudoElement = !!r, this.allowFlatten = o, this.options = t, _(typeof t.type != "string", `animateMini doesn't support "type" as a string. Did you mean to import { spring } from "motion"?`);
+    const u = zr(t);
+    this.animation = Ur(n, s, i, u, r), u.autoplay === !1 && this.animation.pause(), this.animation.onfinish = () => {
+      if (this.finishedTime = this.time, !r) {
+        const c = xt(i, this.options, a, this.speed);
+        this.updateMotionValue ? this.updateMotionValue(c) : Wr(n, s, c), this.animation.cancel();
+      }
+      l == null || l(), this.notifyFinished();
+    };
+  }
+  play() {
+    this.isStopped || (this.animation.play(), this.state === "finished" && this.updateFinished());
+  }
+  pause() {
+    this.animation.pause();
+  }
+  complete() {
+    var t, n;
+    (n = (t = this.animation).finish) == null || n.call(t);
+  }
+  cancel() {
+    try {
+      this.animation.cancel();
+    } catch {
+    }
+  }
+  stop() {
+    if (this.isStopped)
+      return;
+    this.isStopped = !0;
+    const { state: t } = this;
+    t === "idle" || t === "finished" || (this.updateMotionValue ? this.updateMotionValue() : this.commitStyles(), this.isPseudoElement || this.cancel());
+  }
+  /**
+   * WAAPI doesn't natively have any interruption capabilities.
+   *
+   * In this method, we commit styles back to the DOM before cancelling
+   * the animation.
+   *
+   * This is designed to be overridden by NativeAnimationExtended, which
+   * will create a renderless JS animation and sample it twice to calculate
+   * its current value, "previous" value, and therefore allow
+   * Motion to also correctly calculate velocity for any subsequent animation
+   * while deferring the commit until the next animation frame.
+   */
+  commitStyles() {
+    var t, n;
+    this.isPseudoElement || (n = (t = this.animation).commitStyles) == null || n.call(t);
+  }
+  get duration() {
+    var n, s;
+    const t = ((s = (n = this.animation.effect) == null ? void 0 : n.getComputedTiming) == null ? void 0 : s.call(n).duration) || 0;
+    return /* @__PURE__ */ K(Number(t));
+  }
+  get time() {
+    return /* @__PURE__ */ K(Number(this.animation.currentTime) || 0);
+  }
+  set time(t) {
+    this.finishedTime = null, this.animation.currentTime = /* @__PURE__ */ N(t);
+  }
+  /**
+   * The playback speed of the animation.
+   * 1 = normal speed, 2 = double speed, 0.5 = half speed.
+   */
+  get speed() {
+    return this.animation.playbackRate;
+  }
+  set speed(t) {
+    t < 0 && (this.finishedTime = null), this.animation.playbackRate = t;
+  }
+  get state() {
+    return this.finishedTime !== null ? "finished" : this.animation.playState;
+  }
+  get startTime() {
+    return Number(this.animation.startTime);
+  }
+  set startTime(t) {
+    this.animation.startTime = t;
+  }
+  /**
+   * Attaches a timeline to the animation, for instance the `ScrollTimeline`.
+   */
+  attachTimeline({ timeline: t, observe: n }) {
+    var s;
+    return this.allowFlatten && ((s = this.animation.effect) == null || s.updateTiming({ easing: "linear" })), this.animation.onfinish = null, t && $r() ? (this.animation.timeline = t, re) : n(this);
+  }
+}
+const as = {
+  anticipate: Kn,
+  backInOut: Bn,
+  circInOut: Wn
+};
+function Hr(e) {
+  return e in as;
+}
+function Yr(e) {
+  typeof e.ease == "string" && Hr(e.ease) && (e.ease = as[e.ease]);
+}
+const nn = 10;
+class Xr extends Gr {
+  constructor(t) {
+    Yr(t), ts(t), super(t), t.startTime && (this.startTime = t.startTime), this.options = t;
+  }
+  /**
+   * WAAPI doesn't natively have any interruption capabilities.
+   *
+   * Rather than read commited styles back out of the DOM, we can
+   * create a renderless JS animation and sample it twice to calculate
+   * its current value, "previous" value, and therefore allow
+   * Motion to calculate velocity for any subsequent animation.
+   */
+  updateMotionValue(t) {
+    const { motionValue: n, onUpdate: s, onComplete: i, element: r, ...o } = this.options;
+    if (!n)
+      return;
+    if (t !== void 0) {
+      n.set(t);
+      return;
+    }
+    const a = new At({
+      ...o,
+      autoplay: !1
+    }), l = /* @__PURE__ */ N(this.finishedTime ?? this.time);
+    n.setWithVelocity(a.sample(l - nn).value, a.sample(l).value, nn), a.stop();
+  }
+}
+const sn = (e, t) => t === "zIndex" ? !1 : !!(typeof e == "number" || Array.isArray(e) || typeof e == "string" && // It's animatable if we have a string
+(ae.test(e) || e === "0") && // And it contains numbers and/or colors
+!e.startsWith("url("));
+function qr(e) {
+  const t = e[0];
+  if (e.length === 1)
+    return !0;
+  for (let n = 0; n < e.length; n++)
+    if (e[n] !== t)
+      return !0;
+}
+function Zr(e, t, n, s) {
+  const i = e[0];
+  if (i === null)
+    return !1;
+  if (t === "display" || t === "visibility")
+    return !0;
+  const r = e[e.length - 1], o = sn(i, t), a = sn(r, t);
+  return ie(o === a, `You are trying to animate ${t} from "${i}" to "${r}". ${i} is not an animatable value - to enable this animation set ${i} to a value animatable to ${r} via the \`style\` property.`), !o || !a ? !1 : qr(e) || (n === "spring" || os(n)) && s;
+}
+function cs(e) {
+  return Di(e) && "offsetHeight" in e;
+}
+const Jr = /* @__PURE__ */ new Set([
+  "opacity",
+  "clipPath",
+  "filter",
+  "transform"
+  // TODO: Could be re-enabled now we have support for linear() easing
+  // "background-color"
+]), Qr = /* @__PURE__ */ mt(() => Object.hasOwnProperty.call(Element.prototype, "animate"));
+function eo(e) {
+  var u;
+  const { motionValue: t, name: n, repeatDelay: s, repeatType: i, damping: r, type: o } = e;
+  if (!cs((u = t == null ? void 0 : t.owner) == null ? void 0 : u.current))
+    return !1;
+  const { onUpdate: a, transformTemplate: l } = t.owner.getProps();
+  return Qr() && n && Jr.has(n) && (n !== "transform" || !l) && /**
+   * If we're outputting values to onUpdate then we can't use WAAPI as there's
+   * no way to read the value from WAAPI every frame.
+   */
+  !a && !s && i !== "mirror" && r !== 0 && o !== "inertia";
+}
+const to = 40;
+class no extends Vt {
+  constructor({ autoplay: t = !0, delay: n = 0, type: s = "keyframes", repeat: i = 0, repeatDelay: r = 0, repeatType: o = "loop", keyframes: a, name: l, motionValue: u, element: c, ...d }) {
+    var g;
+    super(), this.stop = () => {
+      var y, T;
+      this._animation && (this._animation.stop(), (y = this.stopTimeline) == null || y.call(this)), (T = this.keyframeResolver) == null || T.cancel();
+    }, this.createdAt = L.now();
+    const f = {
+      autoplay: t,
+      delay: n,
+      type: s,
+      repeat: i,
+      repeatDelay: r,
+      repeatType: o,
+      name: l,
+      motionValue: u,
+      element: c,
+      ...d
+    }, h = (c == null ? void 0 : c.KeyframeResolver) || Ct;
+    this.keyframeResolver = new h(a, (y, T, p) => this.onKeyframesResolved(y, T, f, !p), l, u, c), (g = this.keyframeResolver) == null || g.scheduleResolve();
+  }
+  onKeyframesResolved(t, n, s, i) {
+    this.keyframeResolver = void 0;
+    const { name: r, type: o, velocity: a, delay: l, isHandoff: u, onUpdate: c } = s;
+    this.resolvedAt = L.now(), Zr(t, r, o, a) || ((W.instantAnimations || !l) && (c == null || c(xt(t, s, n))), t[0] = t[t.length - 1], s.duration = 0, s.repeat = 0);
+    const f = {
+      startTime: i ? this.resolvedAt ? this.resolvedAt - this.createdAt > to ? this.resolvedAt : this.createdAt : this.createdAt : void 0,
+      finalKeyframe: n,
+      ...s,
+      keyframes: t
+    }, h = !u && eo(f) ? new Xr({
+      ...f,
+      element: f.motionValue.owner.current
+    }) : new At(f);
+    h.finished.then(() => this.notifyFinished()).catch(re), this.pendingTimeline && (this.stopTimeline = h.attachTimeline(this.pendingTimeline), this.pendingTimeline = void 0), this._animation = h;
+  }
+  get finished() {
+    return this._animation ? this.animation.finished : this._finished;
+  }
+  then(t, n) {
+    return this.finished.finally(t).then(() => {
+    });
+  }
+  get animation() {
+    var t;
+    return this._animation || ((t = this.keyframeResolver) == null || t.resume(), Br()), this._animation;
+  }
+  get duration() {
+    return this.animation.duration;
+  }
+  get time() {
+    return this.animation.time;
+  }
+  set time(t) {
+    this.animation.time = t;
+  }
+  get speed() {
+    return this.animation.speed;
+  }
+  get state() {
+    return this.animation.state;
+  }
+  set speed(t) {
+    this.animation.speed = t;
+  }
+  get startTime() {
+    return this.animation.startTime;
+  }
+  attachTimeline(t) {
+    return this._animation ? this.stopTimeline = this.animation.attachTimeline(t) : this.pendingTimeline = t, () => this.stop();
+  }
+  play() {
+    this.animation.play();
+  }
+  pause() {
+    this.animation.pause();
+  }
+  complete() {
+    this.animation.complete();
+  }
+  cancel() {
+    var t;
+    this._animation && this.animation.cancel(), (t = this.keyframeResolver) == null || t.cancel();
+  }
+}
+const so = (
+  // eslint-disable-next-line redos-detector/no-unsafe-regex -- false positive, as it can match a lot of words
+  /^var\(--(?:([\w-]+)|([\w-]+), ?([a-zA-Z\d ()%#.,-]+))\)/u
+);
+function io(e) {
+  const t = so.exec(e);
+  if (!t)
+    return [,];
+  const [, n, s, i] = t;
+  return [`--${n ?? s}`, i];
+}
+const ro = 4;
+function us(e, t, n = 1) {
+  _(n <= ro, `Max CSS variable fallback depth detected in property "${e}". This may indicate a circular fallback dependency.`);
+  const [s, i] = io(e);
+  if (!s)
+    return;
+  const r = window.getComputedStyle(t).getPropertyValue(s);
+  if (r) {
+    const o = r.trim();
+    return Pn(o) ? parseFloat(o) : o;
+  }
+  return bt(i) ? us(i, t, n + 1) : i;
+}
+function ls(e, t) {
+  return (e == null ? void 0 : e[t]) ?? (e == null ? void 0 : e.default) ?? e;
+}
+const fs = /* @__PURE__ */ new Set([
+  "width",
+  "height",
+  "top",
+  "left",
+  "right",
+  "bottom",
+  ...ce
+]), oo = {
+  test: (e) => e === "auto",
+  parse: (e) => e
+}, ds = (e) => (t) => t.test(e), hs = [oe, b, Q, $, qi, Xi, oo], rn = (e) => hs.find(ds(e));
+function ao(e) {
+  return typeof e == "number" ? e === 0 : e !== null ? e === "none" || e === "0" || En(e) : !0;
+}
+const co = /* @__PURE__ */ new Set(["brightness", "contrast", "saturate", "opacity"]);
+function uo(e) {
+  const [t, n] = e.slice(0, -1).split("(");
+  if (t === "drop-shadow")
+    return e;
+  const [s] = n.match(vt) || [];
+  if (!s)
+    return e;
+  const i = n.replace(s, "");
+  let r = co.has(t) ? 1 : 0;
+  return s !== n && (r *= 100), t + "(" + r + i + ")";
+}
+const lo = /\b([a-z-]*)\(.*?\)/gu, rt = {
+  ...ae,
+  getAnimatableNone: (e) => {
+    const t = e.match(lo);
+    return t ? t.map(uo).join(" ") : e;
+  }
+}, on = {
+  ...oe,
+  transform: Math.round
+}, fo = {
+  rotate: $,
+  rotateX: $,
+  rotateY: $,
+  rotateZ: $,
+  scale: we,
+  scaleX: we,
+  scaleY: we,
+  scaleZ: we,
+  skew: $,
+  skewX: $,
+  skewY: $,
+  distance: b,
+  translateX: b,
+  translateY: b,
+  translateZ: b,
+  x: b,
+  y: b,
+  z: b,
+  perspective: b,
+  transformPerspective: b,
+  opacity: pe,
+  originX: zt,
+  originY: zt,
+  originZ: b
+}, Mt = {
+  // Border props
+  borderWidth: b,
+  borderTopWidth: b,
+  borderRightWidth: b,
+  borderBottomWidth: b,
+  borderLeftWidth: b,
+  borderRadius: b,
+  radius: b,
+  borderTopLeftRadius: b,
+  borderTopRightRadius: b,
+  borderBottomRightRadius: b,
+  borderBottomLeftRadius: b,
+  // Positioning props
+  width: b,
+  maxWidth: b,
+  height: b,
+  maxHeight: b,
+  top: b,
+  right: b,
+  bottom: b,
+  left: b,
+  // Spacing props
+  padding: b,
+  paddingTop: b,
+  paddingRight: b,
+  paddingBottom: b,
+  paddingLeft: b,
+  margin: b,
+  marginTop: b,
+  marginRight: b,
+  marginBottom: b,
+  marginLeft: b,
+  // Misc
+  backgroundPositionX: b,
+  backgroundPositionY: b,
+  ...fo,
+  zIndex: on,
+  // SVG
+  fillOpacity: pe,
+  strokeOpacity: pe,
+  numOctaves: on
+}, ho = {
+  ...Mt,
+  // Color props
+  color: E,
+  backgroundColor: E,
+  outlineColor: E,
+  fill: E,
+  stroke: E,
+  // Border props
+  borderColor: E,
+  borderTopColor: E,
+  borderRightColor: E,
+  borderBottomColor: E,
+  borderLeftColor: E,
+  filter: rt,
+  WebkitFilter: rt
+}, ps = (e) => ho[e];
+function ms(e, t) {
+  let n = ps(e);
+  return n !== rt && (n = ae), n.getAnimatableNone ? n.getAnimatableNone(t) : void 0;
+}
+const po = /* @__PURE__ */ new Set(["auto", "none", "0"]);
+function mo(e, t, n) {
+  let s = 0, i;
+  for (; s < e.length && !i; ) {
+    const r = e[s];
+    typeof r == "string" && !po.has(r) && me(r).values.length && (i = e[s]), s++;
+  }
+  if (i && n)
+    for (const r of t)
+      e[r] = ms(n, i);
+}
+class go extends Ct {
+  constructor(t, n, s, i, r) {
+    super(t, n, s, i, r, !0);
+  }
+  readKeyframes() {
+    const { unresolvedKeyframes: t, element: n, name: s } = this;
+    if (!n || !n.current)
+      return;
+    super.readKeyframes();
+    for (let l = 0; l < t.length; l++) {
+      let u = t[l];
+      if (typeof u == "string" && (u = u.trim(), bt(u))) {
+        const c = us(u, n.current);
+        c !== void 0 && (t[l] = c), l === t.length - 1 && (this.finalKeyframe = u);
+      }
+    }
+    if (this.resolveNoneKeyframes(), !fs.has(s) || t.length !== 2)
+      return;
+    const [i, r] = t, o = rn(i), a = rn(r);
+    if (o !== a)
+      if (en(o) && en(a))
+        for (let l = 0; l < t.length; l++) {
+          const u = t[l];
+          typeof u == "string" && (t[l] = parseFloat(u));
+        }
+      else G[s] && (this.needsMeasurement = !0);
+  }
+  resolveNoneKeyframes() {
+    const { unresolvedKeyframes: t, name: n } = this, s = [];
+    for (let i = 0; i < t.length; i++)
+      (t[i] === null || ao(t[i])) && s.push(i);
+    s.length && mo(t, s, n);
+  }
+  measureInitialState() {
+    const { element: t, unresolvedKeyframes: n, name: s } = this;
+    if (!t || !t.current)
+      return;
+    s === "height" && (this.suspendedScrollY = window.pageYOffset), this.measuredOrigin = G[s](t.measureViewportBox(), window.getComputedStyle(t.current)), n[0] = this.measuredOrigin;
+    const i = n[n.length - 1];
+    i !== void 0 && t.getValue(s, i).jump(i, !1);
+  }
+  measureEndState() {
+    var a;
+    const { element: t, name: n, unresolvedKeyframes: s } = this;
+    if (!t || !t.current)
+      return;
+    const i = t.getValue(n);
+    i && i.jump(this.measuredOrigin, !1);
+    const r = s.length - 1, o = s[r];
+    s[r] = G[n](t.measureViewportBox(), window.getComputedStyle(t.current)), o !== null && this.finalKeyframe === void 0 && (this.finalKeyframe = o), (a = this.removedTransforms) != null && a.length && this.removedTransforms.forEach(([l, u]) => {
+      t.getValue(l).set(u);
+    }), this.resolveNoneKeyframes();
+  }
+}
+function yo(e, t, n) {
+  if (e instanceof EventTarget)
+    return [e];
+  if (typeof e == "string") {
+    const i = document.querySelectorAll(e);
+    return i ? Array.from(i) : [];
+  }
+  return Array.from(e);
+}
+const gs = (e, t) => t && typeof e == "number" ? t.transform(e) : e, an = 30, bo = (e) => !isNaN(parseFloat(e));
+class vo {
+  /**
+   * @param init - The initiating value
+   * @param config - Optional configuration options
+   *
+   * -  `transformer`: A function to transform incoming values with.
+   */
+  constructor(t, n = {}) {
+    this.canTrackVelocity = null, this.events = {}, this.updateAndNotify = (s, i = !0) => {
+      var o, a;
+      const r = L.now();
+      if (this.updatedAt !== r && this.setPrevFrameValue(), this.prev = this.current, this.setCurrent(s), this.current !== this.prev && ((o = this.events.change) == null || o.notify(this.current), this.dependents))
+        for (const l of this.dependents)
+          l.dirty();
+      i && ((a = this.events.renderRequest) == null || a.notify(this.current));
+    }, this.hasAnimated = !1, this.setCurrent(t), this.owner = n.owner;
+  }
+  setCurrent(t) {
+    this.current = t, this.updatedAt = L.now(), this.canTrackVelocity === null && t !== void 0 && (this.canTrackVelocity = bo(this.current));
+  }
+  setPrevFrameValue(t = this.current) {
+    this.prevFrameValue = t, this.prevUpdatedAt = this.updatedAt;
+  }
+  /**
+   * Adds a function that will be notified when the `MotionValue` is updated.
+   *
+   * It returns a function that, when called, will cancel the subscription.
+   *
+   * When calling `onChange` inside a React component, it should be wrapped with the
+   * `useEffect` hook. As it returns an unsubscribe function, this should be returned
+   * from the `useEffect` function to ensure you don't add duplicate subscribers..
+   *
+   * ```jsx
+   * export const MyComponent = () => {
+   *   const x = useMotionValue(0)
+   *   const y = useMotionValue(0)
+   *   const opacity = useMotionValue(1)
+   *
+   *   useEffect(() => {
+   *     function updateOpacity() {
+   *       const maxXY = Math.max(x.get(), y.get())
+   *       const newOpacity = transform(maxXY, [0, 100], [1, 0])
+   *       opacity.set(newOpacity)
+   *     }
+   *
+   *     const unsubscribeX = x.on("change", updateOpacity)
+   *     const unsubscribeY = y.on("change", updateOpacity)
+   *
+   *     return () => {
+   *       unsubscribeX()
+   *       unsubscribeY()
+   *     }
+   *   }, [])
+   *
+   *   return <motion.div style={{ x }} />
+   * }
+   * ```
+   *
+   * @param subscriber - A function that receives the latest value.
+   * @returns A function that, when called, will cancel this subscription.
+   *
+   * @deprecated
+   */
+  onChange(t) {
+    return process.env.NODE_ENV !== "production" && On(!1, 'value.onChange(callback) is deprecated. Switch to value.on("change", callback).'), this.on("change", t);
+  }
+  on(t, n) {
+    this.events[t] || (this.events[t] = new Fn());
+    const s = this.events[t].add(n);
+    return t === "change" ? () => {
+      s(), k.read(() => {
+        this.events.change.getSize() || this.stop();
+      });
+    } : s;
+  }
+  clearListeners() {
+    for (const t in this.events)
+      this.events[t].clear();
+  }
+  /**
+   * Attaches a passive effect to the `MotionValue`.
+   */
+  attach(t, n) {
+    this.passiveEffect = t, this.stopPassiveEffect = n;
+  }
+  /**
+   * Sets the state of the `MotionValue`.
+   *
+   * @remarks
+   *
+   * ```jsx
+   * const x = useMotionValue(0)
+   * x.set(10)
+   * ```
+   *
+   * @param latest - Latest value to set.
+   * @param render - Whether to notify render subscribers. Defaults to `true`
+   *
+   * @public
+   */
+  set(t, n = !0) {
+    !n || !this.passiveEffect ? this.updateAndNotify(t, n) : this.passiveEffect(t, this.updateAndNotify);
+  }
+  setWithVelocity(t, n, s) {
+    this.set(n), this.prev = void 0, this.prevFrameValue = t, this.prevUpdatedAt = this.updatedAt - s;
+  }
+  /**
+   * Set the state of the `MotionValue`, stopping any active animations,
+   * effects, and resets velocity to `0`.
+   */
+  jump(t, n = !0) {
+    this.updateAndNotify(t), this.prev = t, this.prevUpdatedAt = this.prevFrameValue = void 0, n && this.stop(), this.stopPassiveEffect && this.stopPassiveEffect();
+  }
+  dirty() {
+    var t;
+    (t = this.events.change) == null || t.notify(this.current);
+  }
+  addDependent(t) {
+    this.dependents || (this.dependents = /* @__PURE__ */ new Set()), this.dependents.add(t);
+  }
+  removeDependent(t) {
+    this.dependents && this.dependents.delete(t);
+  }
+  /**
+   * Returns the latest state of `MotionValue`
+   *
+   * @returns - The latest state of `MotionValue`
+   *
+   * @public
+   */
+  get() {
+    return this.current;
+  }
+  /**
+   * @public
+   */
+  getPrevious() {
+    return this.prev;
+  }
+  /**
+   * Returns the latest velocity of `MotionValue`
+   *
+   * @returns - The latest velocity of `MotionValue`. Returns `0` if the state is non-numerical.
+   *
+   * @public
+   */
+  getVelocity() {
+    const t = L.now();
+    if (!this.canTrackVelocity || this.prevFrameValue === void 0 || t - this.updatedAt > an)
+      return 0;
+    const n = Math.min(this.updatedAt - this.prevUpdatedAt, an);
+    return Rn(parseFloat(this.current) - parseFloat(this.prevFrameValue), n);
+  }
+  /**
+   * Registers a new animation to control this `MotionValue`. Only one
+   * animation can drive a `MotionValue` at one time.
+   *
+   * ```jsx
+   * value.start()
+   * ```
+   *
+   * @param animation - A function that starts the provided animation
+   */
+  start(t) {
+    return this.stop(), new Promise((n) => {
+      this.hasAnimated = !0, this.animation = t(n), this.events.animationStart && this.events.animationStart.notify();
+    }).then(() => {
+      this.events.animationComplete && this.events.animationComplete.notify(), this.clearAnimation();
+    });
+  }
+  /**
+   * Stop the currently active animation.
+   *
+   * @public
+   */
+  stop() {
+    this.animation && (this.animation.stop(), this.events.animationCancel && this.events.animationCancel.notify()), this.clearAnimation();
+  }
+  /**
+   * Returns `true` if this value is currently animating.
+   *
+   * @public
+   */
+  isAnimating() {
+    return !!this.animation;
+  }
+  clearAnimation() {
+    delete this.animation;
+  }
+  /**
+   * Destroy and clean up subscribers to this `MotionValue`.
+   *
+   * The `MotionValue` hooks like `useMotionValue` and `useTransform` automatically
+   * handle the lifecycle of the returned `MotionValue`, so this method is only necessary if you've manually
+   * created a `MotionValue` via the `motionValue` function.
+   *
+   * @public
+   */
+  destroy() {
+    var t, n;
+    (t = this.dependents) == null || t.clear(), (n = this.events.destroy) == null || n.notify(), this.clearListeners(), this.stop(), this.stopPassiveEffect && this.stopPassiveEffect();
+  }
+}
+function Ee(e, t) {
+  return new vo(e, t);
+}
+const { schedule: To, cancel: Fc } = /* @__PURE__ */ jn(queueMicrotask, !1), wo = {
+  x: !1,
+  y: !1
+};
+function So() {
+  return wo.y;
+}
+function ys(e, t) {
+  const n = yo(e), s = new AbortController(), i = {
+    passive: !0,
+    ...t,
+    signal: s.signal
+  };
+  return [n, i, () => s.abort()];
+}
+function cn(e) {
+  return !(e.pointerType === "touch" || So());
+}
+function xo(e, t, n = {}) {
+  const [s, i, r] = ys(e, n), o = (a) => {
+    if (!cn(a))
+      return;
+    const { target: l } = a, u = t(l, a);
+    if (typeof u != "function" || !l)
+      return;
+    const c = (d) => {
+      cn(d) && (u(d), l.removeEventListener("pointerleave", c));
+    };
+    l.addEventListener("pointerleave", c, i);
+  };
+  return s.forEach((a) => {
+    a.addEventListener("pointerenter", o, i);
+  }), r;
+}
+const bs = (e, t) => t ? e === t ? !0 : bs(e, t.parentElement) : !1, Vo = (e) => e.pointerType === "mouse" ? typeof e.button != "number" || e.button <= 0 : e.isPrimary !== !1, Ao = /* @__PURE__ */ new Set([
+  "BUTTON",
+  "INPUT",
+  "SELECT",
+  "TEXTAREA",
+  "A"
+]);
+function Co(e) {
+  return Ao.has(e.tagName) || e.tabIndex !== -1;
+}
+const xe = /* @__PURE__ */ new WeakSet();
+function un(e) {
+  return (t) => {
+    t.key === "Enter" && e(t);
+  };
+}
+function je(e, t) {
+  e.dispatchEvent(new PointerEvent("pointer" + t, { isPrimary: !0, bubbles: !0 }));
+}
+const Mo = (e, t) => {
+  const n = e.currentTarget;
+  if (!n)
+    return;
+  const s = un(() => {
+    if (xe.has(n))
+      return;
+    je(n, "down");
+    const i = un(() => {
+      je(n, "up");
+    }), r = () => je(n, "cancel");
+    n.addEventListener("keyup", i, t), n.addEventListener("blur", r, t);
+  });
+  n.addEventListener("keydown", s, t), n.addEventListener("blur", () => n.removeEventListener("keydown", s), t);
+};
+function ln(e) {
+  return Vo(e) && !0;
+}
+function Po(e, t, n = {}) {
+  const [s, i, r] = ys(e, n), o = (a) => {
+    const l = a.currentTarget;
+    if (!ln(a))
+      return;
+    xe.add(l);
+    const u = t(l, a), c = (h, g) => {
+      window.removeEventListener("pointerup", d), window.removeEventListener("pointercancel", f), xe.has(l) && xe.delete(l), ln(h) && typeof u == "function" && u(h, { success: g });
+    }, d = (h) => {
+      c(h, l === window || l === document || n.useGlobalTarget || bs(l, h.target));
+    }, f = (h) => {
+      c(h, !1);
+    };
+    window.addEventListener("pointerup", d, i), window.addEventListener("pointercancel", f, i);
+  };
+  return s.forEach((a) => {
+    (n.useGlobalTarget ? window : a).addEventListener("pointerdown", o, i), cs(a) && (a.addEventListener("focus", (u) => Mo(u, i)), !Co(a) && !a.hasAttribute("tabindex") && (a.tabIndex = 0));
+  }), r;
+}
+const O = (e) => !!(e && e.getVelocity), Eo = [...hs, E, ae], Do = (e) => Eo.find(ds(e)), vs = se({
+  transformPagePoint: (e) => e,
+  isStatic: !1,
+  reducedMotion: "never"
+}), Pt = se({ strict: !1 }), fn = {
+  animation: [
+    "animate",
+    "variants",
+    "whileHover",
+    "whileTap",
+    "exit",
+    "whileInView",
+    "whileFocus",
+    "whileDrag"
+  ],
+  exit: ["exit"],
+  drag: ["drag", "dragControls"],
+  focus: ["whileFocus"],
+  hover: ["whileHover", "onHoverStart", "onHoverEnd"],
+  tap: ["whileTap", "onTap", "onTapStart", "onTapCancel"],
+  pan: ["onPan", "onPanStart", "onPanSessionStart", "onPanEnd"],
+  inView: ["whileInView", "onViewportEnter", "onViewportLeave"],
+  layout: ["layout", "layoutId"]
+}, te = {};
+for (const e in fn)
+  te[e] = {
+    isEnabled: (t) => fn[e].some((n) => !!t[n])
+  };
+function ot(e) {
+  for (const t in e)
+    te[t] = {
+      ...te[t],
+      ...e[t]
+    };
+}
+function Fo({ children: e, features: t, strict: n = !1 }) {
+  const [, s] = zs(!Ue(t)), i = de(void 0);
+  if (!Ue(t)) {
+    const { renderer: r, ...o } = t;
+    i.current = r, ot(o);
+  }
+  return dt(() => {
+    Ue(t) && t().then(({ renderer: r, ...o }) => {
+      ot(o), i.current = r, s(!0);
+    });
+  }, []), M(Pt.Provider, { value: { renderer: i.current, strict: n }, children: e });
+}
+function Ue(e) {
+  return typeof e == "function";
+}
+const Ro = /* @__PURE__ */ new Set([
+  "animate",
+  "exit",
+  "variants",
+  "initial",
+  "style",
+  "values",
+  "variants",
+  "transition",
+  "transformTemplate",
+  "custom",
+  "inherit",
+  "onBeforeLayoutMeasure",
+  "onAnimationStart",
+  "onAnimationComplete",
+  "onUpdate",
+  "onDragStart",
+  "onDrag",
+  "onDragEnd",
+  "onMeasureDragConstraints",
+  "onDirectionLock",
+  "onDragTransitionEnd",
+  "_dragX",
+  "_dragY",
+  "onHoverStart",
+  "onHoverEnd",
+  "onViewportEnter",
+  "onViewportLeave",
+  "globalTapTarget",
+  "ignoreStrict",
+  "viewport"
+]);
+function De(e) {
+  return e.startsWith("while") || e.startsWith("drag") && e !== "draggable" || e.startsWith("layout") || e.startsWith("onTap") || e.startsWith("onPan") || e.startsWith("onLayout") || Ro.has(e);
+}
+let Ts = (e) => !De(e);
+function Oo(e) {
+  typeof e == "function" && (Ts = (t) => t.startsWith("on") ? !De(t) : e(t));
+}
+try {
+  Oo(require("@emotion/is-prop-valid").default);
+} catch {
+}
+function Lo(e, t, n) {
+  const s = {};
+  for (const i in e)
+    i === "values" && typeof e.values == "object" || (Ts(i) || n === !0 && De(i) || !t && !De(i) || // If trying to use native HTML drag events, forward drag listeners
+    e.draggable && i.startsWith("onDrag")) && (s[i] = e[i]);
+  return s;
+}
+const Le = /* @__PURE__ */ se({});
+function Ie(e) {
+  return e !== null && typeof e == "object" && typeof e.start == "function";
+}
+function ge(e) {
+  return typeof e == "string" || Array.isArray(e);
+}
+const Et = [
+  "animate",
+  "whileInView",
+  "whileFocus",
+  "whileHover",
+  "whileTap",
+  "whileDrag",
+  "exit"
+], Dt = ["initial", ...Et];
+function ke(e) {
+  return Ie(e.animate) || Dt.some((t) => ge(e[t]));
+}
+function ws(e) {
+  return !!(ke(e) || e.variants);
+}
+function Io(e, t) {
+  if (ke(e)) {
+    const { initial: n, animate: s } = e;
+    return {
+      initial: n === !1 || ge(n) ? n : void 0,
+      animate: ge(s) ? s : void 0
+    };
+  }
+  return e.inherit !== !1 ? t : {};
+}
+function ko(e) {
+  const { initial: t, animate: n } = Io(e, I(Le));
+  return Fe(() => ({ initial: t, animate: n }), [dn(t), dn(n)]);
+}
+function dn(e) {
+  return Array.isArray(e) ? e.join(" ") : e;
+}
+const No = Symbol.for("motionComponentSymbol");
+function Ss(e) {
+  return e && typeof e == "object" && Object.prototype.hasOwnProperty.call(e, "current");
+}
+function Bo(e, t, n) {
+  return Gs(
+    (s) => {
+      s && e.onMount && e.onMount(s), t && (s ? t.mount(s) : t.unmount()), n && (typeof n == "function" ? n(s) : Ss(n) && (n.current = s));
+    },
+    /**
+     * Only pass a new ref callback to React if we've received a visual element
+     * factory. Otherwise we'll be mounting/remounting every time externalRef
+     * or other dependencies change.
+     */
+    [t]
+  );
+}
+const Ft = (e) => e.replace(/([a-z])([A-Z])/gu, "$1-$2").toLowerCase(), Ko = "framerAppearId", xs = "data-" + Ft(Ko), Wo = se({});
+function $o(e, t, n, s, i) {
+  var y, T;
+  const { visualElement: r } = I(Le), o = I(Pt), a = I(Mn), l = I(vs).reducedMotion, u = de(null);
+  s = s || o.renderer, !u.current && s && (u.current = s(e, {
+    visualState: t,
+    parent: r,
+    props: n,
+    presenceContext: a,
+    blockInitialAnimation: a ? a.initial === !1 : !1,
+    reducedMotionConfig: l
+  }));
+  const c = u.current, d = I(Wo);
+  c && !c.projection && i && (c.type === "html" || c.type === "svg") && _o(u.current, n, i, d);
+  const f = de(!1);
+  Hs(() => {
+    c && f.current && c.update(n, a);
+  });
+  const h = n[xs], g = de(!!h && !((y = window.MotionHandoffIsComplete) != null && y.call(window, h)) && ((T = window.MotionHasOptimisedAnimation) == null ? void 0 : T.call(window, h)));
+  return Mi(() => {
+    c && (f.current = !0, window.MotionIsMounted = !0, c.updateFeatures(), To.render(c.render), g.current && c.animationState && c.animationState.animateChanges());
+  }), dt(() => {
+    c && (!g.current && c.animationState && c.animationState.animateChanges(), g.current && (queueMicrotask(() => {
+      var p;
+      (p = window.MotionHandoffMarkAsComplete) == null || p.call(window, h);
+    }), g.current = !1));
+  }), c;
+}
+function _o(e, t, n, s) {
+  const { layoutId: i, layout: r, drag: o, dragConstraints: a, layoutScroll: l, layoutRoot: u, layoutCrossfade: c } = t;
+  e.projection = new n(e.latestValues, t["data-framer-portal-id"] ? void 0 : Vs(e.parent)), e.projection.setOptions({
+    layoutId: i,
+    layout: r,
+    alwaysMeasureLayout: !!o || a && Ss(a),
+    visualElement: e,
+    /**
+     * TODO: Update options in an effect. This could be tricky as it'll be too late
+     * to update by the time layout animations run.
+     * We also need to fix this safeToRemove by linking it up to the one returned by usePresence,
+     * ensuring it gets called if there's no potential layout animations.
+     *
+     */
+    animationType: typeof r == "string" ? r : "both",
+    initialPromotionConfig: s,
+    crossfade: c,
+    layoutScroll: l,
+    layoutRoot: u
+  });
+}
+function Vs(e) {
+  if (e)
+    return e.options.allowProjection !== !1 ? e.projection : Vs(e.parent);
+}
+function jo({ preloadedFeatures: e, createVisualElement: t, useRender: n, useVisualState: s, Component: i }) {
+  e && ot(e);
+  function r(a, l) {
+    let u;
+    const c = {
+      ...I(vs),
+      ...a,
+      layoutId: Uo(a)
+    }, { isStatic: d } = c, f = ko(a), h = s(a, d);
+    if (!d && pt) {
+      zo(c, e);
+      const g = Go(c);
+      u = g.MeasureLayout, f.visualElement = $o(i, h, c, t, g.ProjectionNode);
+    }
+    return Ve(Le.Provider, { value: f, children: [u && f.visualElement ? M(u, { visualElement: f.visualElement, ...c }) : null, n(i, a, Bo(h, f.visualElement, l), h, d, f.visualElement)] });
+  }
+  r.displayName = `motion.${typeof i == "string" ? i : `create(${i.displayName ?? i.name ?? ""})`}`;
+  const o = Ys(r);
+  return o[No] = i, o;
+}
+function Uo({ layoutId: e }) {
+  const t = I(Ai).id;
+  return t && e !== void 0 ? t + "-" + e : e;
+}
+function zo(e, t) {
+  const n = I(Pt).strict;
+  if (process.env.NODE_ENV !== "production" && t && n) {
+    const s = "You have rendered a `motion` component within a `LazyMotion` component. This will break tree shaking. Import and render a `m` component instead.";
+    e.ignoreStrict ? ie(!1, s) : _(!1, s);
+  }
+}
+function Go(e) {
+  const { drag: t, layout: n } = te;
+  if (!t && !n)
+    return {};
+  const s = { ...t, ...n };
+  return {
+    MeasureLayout: t != null && t.isEnabled(e) || n != null && n.isEnabled(e) ? s.MeasureLayout : void 0,
+    ProjectionNode: s.ProjectionNode
+  };
+}
+const Ho = {};
+function As(e, { layout: t, layoutId: n }) {
+  return ue.has(e) || e.startsWith("origin") || (t || n !== void 0) && (!!Ho[e] || e === "opacity");
+}
+const Yo = {
+  x: "translateX",
+  y: "translateY",
+  z: "translateZ",
+  transformPerspective: "perspective"
+}, Xo = ce.length;
+function qo(e, t, n) {
+  let s = "", i = !0;
+  for (let r = 0; r < Xo; r++) {
+    const o = ce[r], a = e[o];
+    if (a === void 0)
+      continue;
+    let l = !0;
+    if (typeof a == "number" ? l = a === (o.startsWith("scale") ? 1 : 0) : l = parseFloat(a) === 0, !l || n) {
+      const u = gs(a, Mt[o]);
+      if (!l) {
+        i = !1;
+        const c = Yo[o] || o;
+        s += `${c}(${u}) `;
+      }
+      n && (t[o] = u);
+    }
+  }
+  return s = s.trim(), n ? s = n(t, i ? "" : s) : i && (s = "none"), s;
+}
+function Rt(e, t, n) {
+  const { style: s, vars: i, transformOrigin: r } = e;
+  let o = !1, a = !1;
+  for (const l in t) {
+    const u = t[l];
+    if (ue.has(l)) {
+      o = !0;
+      continue;
+    } else if (zn(l)) {
+      i[l] = u;
+      continue;
+    } else {
+      const c = gs(u, Mt[l]);
+      l.startsWith("origin") ? (a = !0, r[l] = c) : s[l] = c;
+    }
+  }
+  if (t.transform || (o || n ? s.transform = qo(t, e.transform, n) : s.transform && (s.transform = "none")), a) {
+    const { originX: l = "50%", originY: u = "50%", originZ: c = 0 } = r;
+    s.transformOrigin = `${l} ${u} ${c}`;
+  }
+}
+const Ot = () => ({
+  style: {},
+  transform: {},
+  transformOrigin: {},
+  vars: {}
+});
+function Cs(e, t, n) {
+  for (const s in t)
+    !O(t[s]) && !As(s, n) && (e[s] = t[s]);
+}
+function Zo({ transformTemplate: e }, t) {
+  return Fe(() => {
+    const n = Ot();
+    return Rt(n, t, e), Object.assign({}, n.vars, n.style);
+  }, [t]);
+}
+function Jo(e, t) {
+  const n = e.style || {}, s = {};
+  return Cs(s, n, e), Object.assign(s, Zo(e, t)), s;
+}
+function Qo(e, t) {
+  const n = {}, s = Jo(e, t);
+  return e.drag && e.dragListener !== !1 && (n.draggable = !1, s.userSelect = s.WebkitUserSelect = s.WebkitTouchCallout = "none", s.touchAction = e.drag === !0 ? "none" : `pan-${e.drag === "x" ? "y" : "x"}`), e.tabIndex === void 0 && (e.onTap || e.onTapStart || e.whileTap) && (n.tabIndex = 0), n.style = s, n;
+}
+const ea = {
+  offset: "stroke-dashoffset",
+  array: "stroke-dasharray"
+}, ta = {
+  offset: "strokeDashoffset",
+  array: "strokeDasharray"
+};
+function na(e, t, n = 1, s = 0, i = !0) {
+  e.pathLength = 1;
+  const r = i ? ea : ta;
+  e[r.offset] = b.transform(-s);
+  const o = b.transform(t), a = b.transform(n);
+  e[r.array] = `${o} ${a}`;
+}
+function Ms(e, {
+  attrX: t,
+  attrY: n,
+  attrScale: s,
+  pathLength: i,
+  pathSpacing: r = 1,
+  pathOffset: o = 0,
+  // This is object creation, which we try to avoid per-frame.
+  ...a
+}, l, u, c) {
+  if (Rt(e, a, u), l) {
+    e.style.viewBox && (e.attrs.viewBox = e.style.viewBox);
+    return;
+  }
+  e.attrs = e.style, e.style = {};
+  const { attrs: d, style: f } = e;
+  d.transform && (f.transform = d.transform, delete d.transform), (f.transform || d.transformOrigin) && (f.transformOrigin = d.transformOrigin ?? "50% 50%", delete d.transformOrigin), f.transform && (f.transformBox = (c == null ? void 0 : c.transformBox) ?? "fill-box", delete d.transformBox), t !== void 0 && (d.x = t), n !== void 0 && (d.y = n), s !== void 0 && (d.scale = s), i !== void 0 && na(d, i, r, o, !1);
+}
+const Ps = () => ({
+  ...Ot(),
+  attrs: {}
+}), Es = (e) => typeof e == "string" && e.toLowerCase() === "svg";
+function sa(e, t, n, s) {
+  const i = Fe(() => {
+    const r = Ps();
+    return Ms(r, t, Es(s), e.transformTemplate, e.style), {
+      ...r.attrs,
+      style: { ...r.style }
+    };
+  }, [t]);
+  if (e.style) {
+    const r = {};
+    Cs(r, e.style, e), i.style = { ...r, ...i.style };
+  }
+  return i;
+}
+const ia = [
+  "animate",
+  "circle",
+  "defs",
+  "desc",
+  "ellipse",
+  "g",
+  "image",
+  "line",
+  "filter",
+  "marker",
+  "mask",
+  "metadata",
+  "path",
+  "pattern",
+  "polygon",
+  "polyline",
+  "rect",
+  "stop",
+  "switch",
+  "symbol",
+  "svg",
+  "text",
+  "tspan",
+  "use",
+  "view"
+];
+function Lt(e) {
+  return (
+    /**
+     * If it's not a string, it's a custom React component. Currently we only support
+     * HTML custom React components.
+     */
+    typeof e != "string" || /**
+     * If it contains a dash, the element is a custom HTML webcomponent.
+     */
+    e.includes("-") ? !1 : (
+      /**
+       * If it's in our list of lowercase SVG tags, it's an SVG component
+       */
+      !!(ia.indexOf(e) > -1 || /**
+       * If it contains a capital letter, it's an SVG component
+       */
+      /[A-Z]/u.test(e))
+    )
+  );
+}
+function ra(e = !1) {
+  return (n, s, i, { latestValues: r }, o) => {
+    const l = (Lt(n) ? sa : Qo)(s, r, o, n), u = Lo(s, typeof n == "string", e), c = n !== Tn ? { ...u, ...l, ref: i } : {}, { children: d } = s, f = Fe(() => O(d) ? d.get() : d, [d]);
+    return Xs(n, {
+      ...c,
+      children: f
+    });
+  };
+}
+function hn(e) {
+  const t = [{}, {}];
+  return e == null || e.values.forEach((n, s) => {
+    t[0][s] = n.get(), t[1][s] = n.getVelocity();
+  }), t;
+}
+function It(e, t, n, s) {
+  if (typeof t == "function") {
+    const [i, r] = hn(s);
+    t = t(n !== void 0 ? n : e.custom, i, r);
+  }
+  if (typeof t == "string" && (t = e.variants && e.variants[t]), typeof t == "function") {
+    const [i, r] = hn(s);
+    t = t(n !== void 0 ? n : e.custom, i, r);
+  }
+  return t;
+}
+function oa(e) {
+  return O(e) ? e.get() : e;
+}
+function aa({ scrapeMotionValuesFromProps: e, createRenderState: t }, n, s, i) {
+  return {
+    latestValues: ca(n, s, i, e),
+    renderState: t()
+  };
+}
+const Ds = (e) => (t, n) => {
+  const s = I(Le), i = I(Mn), r = () => aa(e, t, s, i);
+  return n ? r() : Ci(r);
+};
+function ca(e, t, n, s) {
+  const i = {}, r = s(e, {});
+  for (const f in r)
+    i[f] = oa(r[f]);
+  let { initial: o, animate: a } = e;
+  const l = ke(e), u = ws(e);
+  t && u && !l && e.inherit !== !1 && (o === void 0 && (o = t.initial), a === void 0 && (a = t.animate));
+  let c = n ? n.initial === !1 : !1;
+  c = c || o === !1;
+  const d = c ? a : o;
+  if (d && typeof d != "boolean" && !Ie(d)) {
+    const f = Array.isArray(d) ? d : [d];
+    for (let h = 0; h < f.length; h++) {
+      const g = It(e, f[h]);
+      if (g) {
+        const { transitionEnd: y, transition: T, ...p } = g;
+        for (const V in p) {
+          let m = p[V];
+          if (Array.isArray(m)) {
+            const C = c ? m.length - 1 : 0;
+            m = m[C];
+          }
+          m !== null && (i[V] = m);
+        }
+        for (const V in y)
+          i[V] = y[V];
+      }
+    }
+  }
+  return i;
+}
+function kt(e, t, n) {
+  var r;
+  const { style: s } = e, i = {};
+  for (const o in s)
+    (O(s[o]) || t.style && O(t.style[o]) || As(o, e) || ((r = n == null ? void 0 : n.getValue(o)) == null ? void 0 : r.liveStyle) !== void 0) && (i[o] = s[o]);
+  return i;
+}
+const ua = {
+  useVisualState: Ds({
+    scrapeMotionValuesFromProps: kt,
+    createRenderState: Ot
+  })
+};
+function Fs(e, t, n) {
+  const s = kt(e, t, n);
+  for (const i in e)
+    if (O(e[i]) || O(t[i])) {
+      const r = ce.indexOf(i) !== -1 ? "attr" + i.charAt(0).toUpperCase() + i.substring(1) : i;
+      s[r] = e[i];
+    }
+  return s;
+}
+const la = {
+  useVisualState: Ds({
+    scrapeMotionValuesFromProps: Fs,
+    createRenderState: Ps
+  })
+};
+function fa(e, t) {
+  return function(s, { forwardMotionProps: i } = { forwardMotionProps: !1 }) {
+    const o = {
+      ...Lt(s) ? la : ua,
+      preloadedFeatures: e,
+      useRender: ra(i),
+      createVisualElement: t,
+      Component: s
+    };
+    return jo(o);
+  };
+}
+const da = /* @__PURE__ */ fa();
+function ye(e, t, n) {
+  const s = e.getProps();
+  return It(s, t, n !== void 0 ? n : s.custom, e);
+}
+const at = (e) => Array.isArray(e);
+function ha(e, t, n) {
+  e.hasValue(t) ? e.getValue(t).set(n) : e.addValue(t, Ee(n));
+}
+function pa(e) {
+  return at(e) ? e[e.length - 1] || 0 : e;
+}
+function ma(e, t) {
+  const n = ye(e, t);
+  let { transitionEnd: s = {}, transition: i = {}, ...r } = n || {};
+  r = { ...r, ...s };
+  for (const o in r) {
+    const a = pa(r[o]);
+    ha(e, o, a);
+  }
+}
+function ga(e) {
+  return !!(O(e) && e.add);
+}
+function ya(e, t) {
+  const n = e.getValue("willChange");
+  if (ga(n))
+    return n.add(t);
+  if (!n && W.WillChange) {
+    const s = new W.WillChange("auto");
+    e.addValue("willChange", s), s.add(t);
+  }
+}
+function ba(e) {
+  return e.props[xs];
+}
+const va = (e) => e !== null;
+function Ta(e, { repeat: t, repeatType: n = "loop" }, s) {
+  const i = e.filter(va), r = t && n !== "loop" && t % 2 === 1 ? 0 : i.length - 1;
+  return i[r];
+}
+const wa = {
+  type: "spring",
+  stiffness: 500,
+  damping: 25,
+  restSpeed: 10
+}, Sa = (e) => ({
+  type: "spring",
+  stiffness: 550,
+  damping: e === 0 ? 2 * Math.sqrt(550) : 30,
+  restSpeed: 10
+}), xa = {
+  type: "keyframes",
+  duration: 0.8
+}, Va = {
+  type: "keyframes",
+  ease: [0.25, 0.1, 0.35, 1],
+  duration: 0.3
+}, Aa = (e, { keyframes: t }) => t.length > 2 ? xa : ue.has(e) ? e.startsWith("scale") ? Sa(t[1]) : wa : Va;
+function Ca({ when: e, delay: t, delayChildren: n, staggerChildren: s, staggerDirection: i, repeat: r, repeatType: o, repeatDelay: a, from: l, elapsed: u, ...c }) {
+  return !!Object.keys(c).length;
+}
+const Ma = (e, t, n, s = {}, i, r) => (o) => {
+  const a = ls(s, e) || {}, l = a.delay || s.delay || 0;
+  let { elapsed: u = 0 } = s;
+  u = u - /* @__PURE__ */ N(l);
+  const c = {
+    keyframes: Array.isArray(n) ? n : [null, n],
+    ease: "easeOut",
+    velocity: t.getVelocity(),
+    ...a,
+    delay: -u,
+    onUpdate: (f) => {
+      t.set(f), a.onUpdate && a.onUpdate(f);
+    },
+    onComplete: () => {
+      o(), a.onComplete && a.onComplete();
+    },
+    name: e,
+    motionValue: t,
+    element: r ? void 0 : i
+  };
+  Ca(a) || Object.assign(c, Aa(e, c)), c.duration && (c.duration = /* @__PURE__ */ N(c.duration)), c.repeatDelay && (c.repeatDelay = /* @__PURE__ */ N(c.repeatDelay)), c.from !== void 0 && (c.keyframes[0] = c.from);
+  let d = !1;
+  if ((c.type === !1 || c.duration === 0 && !c.repeatDelay) && (c.duration = 0, c.delay === 0 && (d = !0)), (W.instantAnimations || W.skipAnimations) && (d = !0, c.duration = 0, c.delay = 0), c.allowFlatten = !a.type && !a.ease, d && !r && t.get() !== void 0) {
+    const f = Ta(c.keyframes, a);
+    if (f !== void 0) {
+      k.update(() => {
+        c.onUpdate(f), c.onComplete();
+      });
+      return;
+    }
+  }
+  return a.isSync ? new At(c) : new no(c);
+};
+function Pa({ protectedKeys: e, needsAnimating: t }, n) {
+  const s = e.hasOwnProperty(n) && t[n] !== !0;
+  return t[n] = !1, s;
+}
+function Rs(e, t, { delay: n = 0, transitionOverride: s, type: i } = {}) {
+  let { transition: r = e.getDefaultTransition(), transitionEnd: o, ...a } = t;
+  s && (r = s);
+  const l = [], u = i && e.animationState && e.animationState.getState()[i];
+  for (const c in a) {
+    const d = e.getValue(c, e.latestValues[c] ?? null), f = a[c];
+    if (f === void 0 || u && Pa(u, c))
+      continue;
+    const h = {
+      delay: n,
+      ...ls(r || {}, c)
+    }, g = d.get();
+    if (g !== void 0 && !d.isAnimating && !Array.isArray(f) && f === g && !h.velocity)
+      continue;
+    let y = !1;
+    if (window.MotionHandoffAnimation) {
+      const p = ba(e);
+      if (p) {
+        const V = window.MotionHandoffAnimation(p, c, k);
+        V !== null && (h.startTime = V, y = !0);
+      }
+    }
+    ya(e, c), d.start(Ma(c, d, f, e.shouldReduceMotion && fs.has(c) ? { type: !1 } : h, e, y));
+    const T = d.animation;
+    T && l.push(T);
+  }
+  return o && Promise.all(l).then(() => {
+    k.update(() => {
+      o && ma(e, o);
+    });
+  }), l;
+}
+function ct(e, t, n = {}) {
+  var l;
+  const s = ye(e, t, n.type === "exit" ? (l = e.presenceContext) == null ? void 0 : l.custom : void 0);
+  let { transition: i = e.getDefaultTransition() || {} } = s || {};
+  n.transitionOverride && (i = n.transitionOverride);
+  const r = s ? () => Promise.all(Rs(e, s, n)) : () => Promise.resolve(), o = e.variantChildren && e.variantChildren.size ? (u = 0) => {
+    const { delayChildren: c = 0, staggerChildren: d, staggerDirection: f } = i;
+    return Ea(e, t, u, c, d, f, n);
+  } : () => Promise.resolve(), { when: a } = i;
+  if (a) {
+    const [u, c] = a === "beforeChildren" ? [r, o] : [o, r];
+    return u().then(() => c());
+  } else
+    return Promise.all([r(), o(n.delay)]);
+}
+function Ea(e, t, n = 0, s = 0, i = 0, r = 1, o) {
+  const a = [], l = e.variantChildren.size, u = (l - 1) * i, c = typeof s == "function", d = c ? (f) => s(f, l) : (
+    // Support deprecated staggerChildren
+    r === 1 ? (f = 0) => f * i : (f = 0) => u - f * i
+  );
+  return Array.from(e.variantChildren).sort(Da).forEach((f, h) => {
+    f.notify("AnimationStart", t), a.push(ct(f, t, {
+      ...o,
+      delay: n + (c ? 0 : s) + d(h)
+    }).then(() => f.notify("AnimationComplete", t)));
+  }), Promise.all(a);
+}
+function Da(e, t) {
+  return e.sortNodePosition(t);
+}
+function Fa(e, t, n = {}) {
+  e.notify("AnimationStart", t);
+  let s;
+  if (Array.isArray(t)) {
+    const i = t.map((r) => ct(e, r, n));
+    s = Promise.all(i);
+  } else if (typeof t == "string")
+    s = ct(e, t, n);
+  else {
+    const i = typeof t == "function" ? ye(e, t, n.custom) : t;
+    s = Promise.all(Rs(e, i, n));
+  }
+  return s.then(() => {
+    e.notify("AnimationComplete", t);
+  });
+}
+function Os(e, t) {
+  if (!Array.isArray(t))
+    return !1;
+  const n = t.length;
+  if (n !== e.length)
+    return !1;
+  for (let s = 0; s < n; s++)
+    if (t[s] !== e[s])
+      return !1;
+  return !0;
+}
+const Ra = Dt.length;
+function Ls(e) {
+  if (!e)
+    return;
+  if (!e.isControllingVariants) {
+    const n = e.parent ? Ls(e.parent) || {} : {};
+    return e.props.initial !== void 0 && (n.initial = e.props.initial), n;
+  }
+  const t = {};
+  for (let n = 0; n < Ra; n++) {
+    const s = Dt[n], i = e.props[s];
+    (ge(i) || i === !1) && (t[s] = i);
+  }
+  return t;
+}
+const Oa = [...Et].reverse(), La = Et.length;
+function Ia(e) {
+  return (t) => Promise.all(t.map(({ animation: n, options: s }) => Fa(e, n, s)));
+}
+function ka(e) {
+  let t = Ia(e), n = pn(), s = !0;
+  const i = (l) => (u, c) => {
+    var f;
+    const d = ye(e, c, l === "exit" ? (f = e.presenceContext) == null ? void 0 : f.custom : void 0);
+    if (d) {
+      const { transition: h, transitionEnd: g, ...y } = d;
+      u = { ...u, ...y, ...g };
+    }
+    return u;
+  };
+  function r(l) {
+    t = l(e);
+  }
+  function o(l) {
+    const { props: u } = e, c = Ls(e.parent) || {}, d = [], f = /* @__PURE__ */ new Set();
+    let h = {}, g = 1 / 0;
+    for (let T = 0; T < La; T++) {
+      const p = Oa[T], V = n[p], m = u[p] !== void 0 ? u[p] : c[p], C = ge(m), w = p === l ? V.isActive : null;
+      w === !1 && (g = T);
+      let A = m === c[p] && m !== u[p] && C;
+      if (A && s && e.manuallyAnimateOnMount && (A = !1), V.protectedKeys = { ...h }, // If it isn't active and hasn't *just* been set as inactive
+      !V.isActive && w === null || // If we didn't and don't have any defined prop for this animation type
+      !m && !V.prevProp || // Or if the prop doesn't define an animation
+      Ie(m) || typeof m == "boolean")
+        continue;
+      const x = Na(V.prevProp, m);
+      let S = x || // If we're making this variant active, we want to always make it active
+      p === l && V.isActive && !A && C || // If we removed a higher-priority variant (i is in reverse order)
+      T > g && C, D = !1;
+      const F = Array.isArray(m) ? m : [m];
+      let X = F.reduce(i(p), {});
+      w === !1 && (X = {});
+      const { prevResolvedValues: Nt = {} } = V, js = {
+        ...Nt,
+        ...X
+      }, Bt = (R) => {
+        S = !0, f.has(R) && (D = !0, f.delete(R)), V.needsAnimating[R] = !0;
+        const B = e.getValue(R);
+        B && (B.liveStyle = !1);
+      };
+      for (const R in js) {
+        const B = X[R], Ne = Nt[R];
+        if (h.hasOwnProperty(R))
+          continue;
+        let Be = !1;
+        at(B) && at(Ne) ? Be = !Os(B, Ne) : Be = B !== Ne, Be ? B != null ? Bt(R) : f.add(R) : B !== void 0 && f.has(R) ? Bt(R) : V.protectedKeys[R] = !0;
+      }
+      V.prevProp = m, V.prevResolvedValues = X, V.isActive && (h = { ...h, ...X }), s && e.blockInitialAnimation && (S = !1), S && (!(A && x) || D) && d.push(...F.map((R) => ({
+        animation: R,
+        options: { type: p }
+      })));
+    }
+    if (f.size) {
+      const T = {};
+      if (typeof u.initial != "boolean") {
+        const p = ye(e, Array.isArray(u.initial) ? u.initial[0] : u.initial);
+        p && p.transition && (T.transition = p.transition);
+      }
+      f.forEach((p) => {
+        const V = e.getBaseTarget(p), m = e.getValue(p);
+        m && (m.liveStyle = !0), T[p] = V ?? null;
+      }), d.push({ animation: T });
+    }
+    let y = !!d.length;
+    return s && (u.initial === !1 || u.initial === u.animate) && !e.manuallyAnimateOnMount && (y = !1), s = !1, y ? t(d) : Promise.resolve();
+  }
+  function a(l, u) {
+    var d;
+    if (n[l].isActive === u)
+      return Promise.resolve();
+    (d = e.variantChildren) == null || d.forEach((f) => {
+      var h;
+      return (h = f.animationState) == null ? void 0 : h.setActive(l, u);
+    }), n[l].isActive = u;
+    const c = o(l);
+    for (const f in n)
+      n[f].protectedKeys = {};
+    return c;
+  }
+  return {
+    animateChanges: o,
+    setActive: a,
+    setAnimateFunction: r,
+    getState: () => n,
+    reset: () => {
+      n = pn(), s = !0;
+    }
+  };
+}
+function Na(e, t) {
+  return typeof t == "string" ? t !== e : Array.isArray(t) ? !Os(t, e) : !1;
+}
+function j(e = !1) {
+  return {
+    isActive: e,
+    protectedKeys: {},
+    needsAnimating: {},
+    prevResolvedValues: {}
+  };
+}
+function pn() {
+  return {
+    animate: j(!0),
+    whileInView: j(),
+    whileHover: j(),
+    whileTap: j(),
+    whileDrag: j(),
+    whileFocus: j(),
+    exit: j()
+  };
+}
+class le {
+  constructor(t) {
+    this.isMounted = !1, this.node = t;
+  }
+  update() {
+  }
+}
+class Ba extends le {
+  /**
+   * We dynamically generate the AnimationState manager as it contains a reference
+   * to the underlying animation library. We only want to load that if we load this,
+   * so people can optionally code split it out using the `m` component.
+   */
+  constructor(t) {
+    super(t), t.animationState || (t.animationState = ka(t));
+  }
+  updateAnimationControlsSubscription() {
+    const { animate: t } = this.node.getProps();
+    Ie(t) && (this.unmountControls = t.subscribe(this.node));
+  }
+  /**
+   * Subscribe any provided AnimationControls to the component's VisualElement
+   */
+  mount() {
+    this.updateAnimationControlsSubscription();
+  }
+  update() {
+    const { animate: t } = this.node.getProps(), { animate: n } = this.node.prevProps || {};
+    t !== n && this.updateAnimationControlsSubscription();
+  }
+  unmount() {
+    var t;
+    this.node.animationState.reset(), (t = this.unmountControls) == null || t.call(this);
+  }
+}
+let Ka = 0;
+class Wa extends le {
+  constructor() {
+    super(...arguments), this.id = Ka++;
+  }
+  update() {
+    if (!this.node.presenceContext)
+      return;
+    const { isPresent: t, onExitComplete: n } = this.node.presenceContext, { isPresent: s } = this.node.prevPresenceContext || {};
+    if (!this.node.animationState || t === s)
+      return;
+    const i = this.node.animationState.setActive("exit", !t);
+    n && !t && i.then(() => {
+      n(this.id);
+    });
+  }
+  mount() {
+    const { register: t, onExitComplete: n } = this.node.presenceContext || {};
+    n && n(this.id), t && (this.unmount = t(this.id));
+  }
+  unmount() {
+  }
+}
+const $a = {
+  animation: {
+    Feature: Ba
+  },
+  exit: {
+    Feature: Wa
+  }
+};
+function mn(e, t, n, s = { passive: !0 }) {
+  return e.addEventListener(t, n, s), () => e.removeEventListener(t, n);
+}
+function Is(e) {
+  return {
+    point: {
+      x: e.pageX,
+      y: e.pageY
+    }
+  };
+}
+function _a({ top: e, left: t, right: n, bottom: s }) {
+  return {
+    x: { min: t, max: n },
+    y: { min: e, max: s }
+  };
+}
+function ja(e, t) {
+  if (!t)
+    return e;
+  const n = t({ x: e.left, y: e.top }), s = t({ x: e.right, y: e.bottom });
+  return {
+    top: n.y,
+    left: n.x,
+    bottom: s.y,
+    right: s.x
+  };
+}
+const gn = () => ({ min: 0, max: 0 }), ks = () => ({
+  x: gn(),
+  y: gn()
+});
+function Ua(e, t) {
+  return _a(ja(e.getBoundingClientRect(), t));
+}
+function yn(e, t, n) {
+  const { props: s } = e;
+  e.animationState && s.whileHover && e.animationState.setActive("whileHover", n === "Start");
+  const i = "onHover" + n, r = s[i];
+  r && k.postRender(() => r(t, Is(t)));
+}
+class za extends le {
+  mount() {
+    const { current: t } = this.node;
+    t && (this.unmount = xo(t, (n, s) => (yn(this.node, s, "Start"), (i) => yn(this.node, i, "End"))));
+  }
+  unmount() {
+  }
+}
+class Ga extends le {
+  constructor() {
+    super(...arguments), this.isActive = !1;
+  }
+  onFocus() {
+    let t = !1;
+    try {
+      t = this.node.current.matches(":focus-visible");
+    } catch {
+      t = !0;
+    }
+    !t || !this.node.animationState || (this.node.animationState.setActive("whileFocus", !0), this.isActive = !0);
+  }
+  onBlur() {
+    !this.isActive || !this.node.animationState || (this.node.animationState.setActive("whileFocus", !1), this.isActive = !1);
+  }
+  mount() {
+    this.unmount = Re(mn(this.node.current, "focus", () => this.onFocus()), mn(this.node.current, "blur", () => this.onBlur()));
+  }
+  unmount() {
+  }
+}
+function bn(e, t, n) {
+  const { props: s } = e;
+  if (e.current instanceof HTMLButtonElement && e.current.disabled)
+    return;
+  e.animationState && s.whileTap && e.animationState.setActive("whileTap", n === "Start");
+  const i = "onTap" + (n === "End" ? "" : n), r = s[i];
+  r && k.postRender(() => r(t, Is(t)));
+}
+class Ha extends le {
+  mount() {
+    const { current: t } = this.node;
+    t && (this.unmount = Po(t, (n, s) => (bn(this.node, s, "Start"), (i, { success: r }) => bn(this.node, i, r ? "End" : "Cancel")), { useGlobalTarget: this.node.props.globalTapTarget }));
+  }
+  unmount() {
+  }
+}
+const ut = /* @__PURE__ */ new WeakMap(), ze = /* @__PURE__ */ new WeakMap(), Ya = (e) => {
+  const t = ut.get(e.target);
+  t && t(e);
+}, Xa = (e) => {
+  e.forEach(Ya);
+};
+function qa({ root: e, ...t }) {
+  const n = e || document;
+  ze.has(n) || ze.set(n, {});
+  const s = ze.get(n), i = JSON.stringify(t);
+  return s[i] || (s[i] = new IntersectionObserver(Xa, { root: e, ...t })), s[i];
+}
+function Za(e, t, n) {
+  const s = qa(t);
+  return ut.set(e, n), s.observe(e), () => {
+    ut.delete(e), s.unobserve(e);
+  };
+}
+const Ja = {
+  some: 0,
+  all: 1
+};
+class Qa extends le {
+  constructor() {
+    super(...arguments), this.hasEnteredView = !1, this.isInView = !1;
+  }
+  startObserver() {
+    this.unmount();
+    const { viewport: t = {} } = this.node.getProps(), { root: n, margin: s, amount: i = "some", once: r } = t, o = {
+      root: n ? n.current : void 0,
+      rootMargin: s,
+      threshold: typeof i == "number" ? i : Ja[i]
+    }, a = (l) => {
+      const { isIntersecting: u } = l;
+      if (this.isInView === u || (this.isInView = u, r && !u && this.hasEnteredView))
+        return;
+      u && (this.hasEnteredView = !0), this.node.animationState && this.node.animationState.setActive("whileInView", u);
+      const { onViewportEnter: c, onViewportLeave: d } = this.node.getProps(), f = u ? c : d;
+      f && f(l);
+    };
+    return Za(this.node.current, o, a);
+  }
+  mount() {
+    this.startObserver();
+  }
+  update() {
+    if (typeof IntersectionObserver > "u")
+      return;
+    const { props: t, prevProps: n } = this.node;
+    ["amount", "margin", "root"].some(ec(t, n)) && this.startObserver();
+  }
+  unmount() {
+  }
+}
+function ec({ viewport: e = {} }, { viewport: t = {} } = {}) {
+  return (n) => e[n] !== t[n];
+}
+const tc = {
+  inView: {
+    Feature: Qa
+  },
+  tap: {
+    Feature: Ha
+  },
+  focus: {
+    Feature: Ga
+  },
+  hover: {
+    Feature: za
+  }
+}, lt = { current: null }, Ns = { current: !1 };
+function nc() {
+  if (Ns.current = !0, !!pt)
+    if (window.matchMedia) {
+      const e = window.matchMedia("(prefers-reduced-motion)"), t = () => lt.current = e.matches;
+      e.addEventListener("change", t), t();
+    } else
+      lt.current = !1;
+}
+const sc = /* @__PURE__ */ new WeakMap();
+function ic(e, t, n) {
+  for (const s in t) {
+    const i = t[s], r = n[s];
+    if (O(i))
+      e.addValue(s, i);
+    else if (O(r))
+      e.addValue(s, Ee(i, { owner: e }));
+    else if (r !== i)
+      if (e.hasValue(s)) {
+        const o = e.getValue(s);
+        o.liveStyle === !0 ? o.jump(i) : o.hasAnimated || o.set(i);
+      } else {
+        const o = e.getStaticValue(s);
+        e.addValue(s, Ee(o !== void 0 ? o : i, { owner: e }));
+      }
+  }
+  for (const s in n)
+    t[s] === void 0 && e.removeValue(s);
+  return t;
+}
+const vn = [
+  "AnimationStart",
+  "AnimationComplete",
+  "Update",
+  "BeforeLayoutMeasure",
+  "LayoutMeasure",
+  "LayoutAnimationStart",
+  "LayoutAnimationComplete"
+];
+class rc {
+  /**
+   * This method takes React props and returns found MotionValues. For example, HTML
+   * MotionValues will be found within the style prop, whereas for Three.js within attribute arrays.
+   *
+   * This isn't an abstract method as it needs calling in the constructor, but it is
+   * intended to be one.
+   */
+  scrapeMotionValuesFromProps(t, n, s) {
+    return {};
+  }
+  constructor({ parent: t, props: n, presenceContext: s, reducedMotionConfig: i, blockInitialAnimation: r, visualState: o }, a = {}) {
+    this.current = null, this.children = /* @__PURE__ */ new Set(), this.isVariantNode = !1, this.isControllingVariants = !1, this.shouldReduceMotion = null, this.values = /* @__PURE__ */ new Map(), this.KeyframeResolver = Ct, this.features = {}, this.valueSubscriptions = /* @__PURE__ */ new Map(), this.prevMotionValues = {}, this.events = {}, this.propEventSubscriptions = {}, this.notifyUpdate = () => this.notify("Update", this.latestValues), this.render = () => {
+      this.current && (this.triggerBuild(), this.renderInstance(this.current, this.renderState, this.props.style, this.projection));
+    }, this.renderScheduledAt = 0, this.scheduleRender = () => {
+      const f = L.now();
+      this.renderScheduledAt < f && (this.renderScheduledAt = f, k.render(this.render, !1, !0));
+    };
+    const { latestValues: l, renderState: u } = o;
+    this.latestValues = l, this.baseTarget = { ...l }, this.initialValues = n.initial ? { ...l } : {}, this.renderState = u, this.parent = t, this.props = n, this.presenceContext = s, this.depth = t ? t.depth + 1 : 0, this.reducedMotionConfig = i, this.options = a, this.blockInitialAnimation = !!r, this.isControllingVariants = ke(n), this.isVariantNode = ws(n), this.isVariantNode && (this.variantChildren = /* @__PURE__ */ new Set()), this.manuallyAnimateOnMount = !!(t && t.current);
+    const { willChange: c, ...d } = this.scrapeMotionValuesFromProps(n, {}, this);
+    for (const f in d) {
+      const h = d[f];
+      l[f] !== void 0 && O(h) && h.set(l[f], !1);
+    }
+  }
+  mount(t) {
+    this.current = t, sc.set(t, this), this.projection && !this.projection.instance && this.projection.mount(t), this.parent && this.isVariantNode && !this.isControllingVariants && (this.removeFromVariantTree = this.parent.addVariantChild(this)), this.values.forEach((n, s) => this.bindToMotionValue(s, n)), Ns.current || nc(), this.shouldReduceMotion = this.reducedMotionConfig === "never" ? !1 : this.reducedMotionConfig === "always" ? !0 : lt.current, process.env.NODE_ENV !== "production" && On(this.shouldReduceMotion !== !0, "You have Reduced Motion enabled on your device. Animations may not appear as expected."), this.parent && this.parent.children.add(this), this.update(this.props, this.presenceContext);
+  }
+  unmount() {
+    this.projection && this.projection.unmount(), He(this.notifyUpdate), He(this.render), this.valueSubscriptions.forEach((t) => t()), this.valueSubscriptions.clear(), this.removeFromVariantTree && this.removeFromVariantTree(), this.parent && this.parent.children.delete(this);
+    for (const t in this.events)
+      this.events[t].clear();
+    for (const t in this.features) {
+      const n = this.features[t];
+      n && (n.unmount(), n.isMounted = !1);
+    }
+    this.current = null;
+  }
+  bindToMotionValue(t, n) {
+    this.valueSubscriptions.has(t) && this.valueSubscriptions.get(t)();
+    const s = ue.has(t);
+    s && this.onBindTransform && this.onBindTransform();
+    const i = n.on("change", (a) => {
+      this.latestValues[t] = a, this.props.onUpdate && k.preRender(this.notifyUpdate), s && this.projection && (this.projection.isTransformDirty = !0);
+    }), r = n.on("renderRequest", this.scheduleRender);
+    let o;
+    window.MotionCheckAppearSync && (o = window.MotionCheckAppearSync(this, t, n)), this.valueSubscriptions.set(t, () => {
+      i(), r(), o && o(), n.owner && n.stop();
+    });
+  }
+  sortNodePosition(t) {
+    return !this.current || !this.sortInstanceNodePosition || this.type !== t.type ? 0 : this.sortInstanceNodePosition(this.current, t.current);
+  }
+  updateFeatures() {
+    let t = "animation";
+    for (t in te) {
+      const n = te[t];
+      if (!n)
+        continue;
+      const { isEnabled: s, Feature: i } = n;
+      if (!this.features[t] && i && s(this.props) && (this.features[t] = new i(this)), this.features[t]) {
+        const r = this.features[t];
+        r.isMounted ? r.update() : (r.mount(), r.isMounted = !0);
+      }
+    }
+  }
+  triggerBuild() {
+    this.build(this.renderState, this.latestValues, this.props);
+  }
+  /**
+   * Measure the current viewport box with or without transforms.
+   * Only measures axis-aligned boxes, rotate and skew must be manually
+   * removed with a re-render to work.
+   */
+  measureViewportBox() {
+    return this.current ? this.measureInstanceViewportBox(this.current, this.props) : ks();
+  }
+  getStaticValue(t) {
+    return this.latestValues[t];
+  }
+  setStaticValue(t, n) {
+    this.latestValues[t] = n;
+  }
+  /**
+   * Update the provided props. Ensure any newly-added motion values are
+   * added to our map, old ones removed, and listeners updated.
+   */
+  update(t, n) {
+    (t.transformTemplate || this.props.transformTemplate) && this.scheduleRender(), this.prevProps = this.props, this.props = t, this.prevPresenceContext = this.presenceContext, this.presenceContext = n;
+    for (let s = 0; s < vn.length; s++) {
+      const i = vn[s];
+      this.propEventSubscriptions[i] && (this.propEventSubscriptions[i](), delete this.propEventSubscriptions[i]);
+      const r = "on" + i, o = t[r];
+      o && (this.propEventSubscriptions[i] = this.on(i, o));
+    }
+    this.prevMotionValues = ic(this, this.scrapeMotionValuesFromProps(t, this.prevProps, this), this.prevMotionValues), this.handleChildMotionValue && this.handleChildMotionValue();
+  }
+  getProps() {
+    return this.props;
+  }
+  /**
+   * Returns the variant definition with a given name.
+   */
+  getVariant(t) {
+    return this.props.variants ? this.props.variants[t] : void 0;
+  }
+  /**
+   * Returns the defined default transition on this component.
+   */
+  getDefaultTransition() {
+    return this.props.transition;
+  }
+  getTransformPagePoint() {
+    return this.props.transformPagePoint;
+  }
+  getClosestVariantNode() {
+    return this.isVariantNode ? this : this.parent ? this.parent.getClosestVariantNode() : void 0;
+  }
+  /**
+   * Add a child visual element to our set of children.
+   */
+  addVariantChild(t) {
+    const n = this.getClosestVariantNode();
+    if (n)
+      return n.variantChildren && n.variantChildren.add(t), () => n.variantChildren.delete(t);
+  }
+  /**
+   * Add a motion value and bind it to this visual element.
+   */
+  addValue(t, n) {
+    const s = this.values.get(t);
+    n !== s && (s && this.removeValue(t), this.bindToMotionValue(t, n), this.values.set(t, n), this.latestValues[t] = n.get());
+  }
+  /**
+   * Remove a motion value and unbind any active subscriptions.
+   */
+  removeValue(t) {
+    this.values.delete(t);
+    const n = this.valueSubscriptions.get(t);
+    n && (n(), this.valueSubscriptions.delete(t)), delete this.latestValues[t], this.removeValueFromRenderState(t, this.renderState);
+  }
+  /**
+   * Check whether we have a motion value for this key
+   */
+  hasValue(t) {
+    return this.values.has(t);
+  }
+  getValue(t, n) {
+    if (this.props.values && this.props.values[t])
+      return this.props.values[t];
+    let s = this.values.get(t);
+    return s === void 0 && n !== void 0 && (s = Ee(n === null ? void 0 : n, { owner: this }), this.addValue(t, s)), s;
+  }
+  /**
+   * If we're trying to animate to a previously unencountered value,
+   * we need to check for it in our state and as a last resort read it
+   * directly from the instance (which might have performance implications).
+   */
+  readValue(t, n) {
+    let s = this.latestValues[t] !== void 0 || !this.current ? this.latestValues[t] : this.getBaseTargetFromProps(this.props, t) ?? this.readValueFromInstance(this.current, t, this.options);
+    return s != null && (typeof s == "string" && (Pn(s) || En(s)) ? s = parseFloat(s) : !Do(s) && ae.test(n) && (s = ms(t, n)), this.setBaseTarget(t, O(s) ? s.get() : s)), O(s) ? s.get() : s;
+  }
+  /**
+   * Set the base target to later animate back to. This is currently
+   * only hydrated on creation and when we first read a value.
+   */
+  setBaseTarget(t, n) {
+    this.baseTarget[t] = n;
+  }
+  /**
+   * Find the base target for a value thats been removed from all animation
+   * props.
+   */
+  getBaseTarget(t) {
+    var r;
+    const { initial: n } = this.props;
+    let s;
+    if (typeof n == "string" || typeof n == "object") {
+      const o = It(this.props, n, (r = this.presenceContext) == null ? void 0 : r.custom);
+      o && (s = o[t]);
+    }
+    if (n && s !== void 0)
+      return s;
+    const i = this.getBaseTargetFromProps(this.props, t);
+    return i !== void 0 && !O(i) ? i : this.initialValues[t] !== void 0 && s === void 0 ? void 0 : this.baseTarget[t];
+  }
+  on(t, n) {
+    return this.events[t] || (this.events[t] = new Fn()), this.events[t].add(n);
+  }
+  notify(t, ...n) {
+    this.events[t] && this.events[t].notify(...n);
+  }
+}
+class Bs extends rc {
+  constructor() {
+    super(...arguments), this.KeyframeResolver = go;
+  }
+  sortInstanceNodePosition(t, n) {
+    return t.compareDocumentPosition(n) & 2 ? 1 : -1;
+  }
+  getBaseTargetFromProps(t, n) {
+    return t.style ? t.style[n] : void 0;
+  }
+  removeValueFromRenderState(t, { vars: n, style: s }) {
+    delete n[t], delete s[t];
+  }
+  handleChildMotionValue() {
+    this.childSubscription && (this.childSubscription(), delete this.childSubscription);
+    const { children: t } = this.props;
+    O(t) && (this.childSubscription = t.on("change", (n) => {
+      this.current && (this.current.textContent = `${n}`);
+    }));
+  }
+}
+function Ks(e, { style: t, vars: n }, s, i) {
+  const r = e.style;
+  let o;
+  for (o in t)
+    r[o] = t[o];
+  i == null || i.applyProjectionStyles(r, s);
+  for (o in n)
+    r.setProperty(o, n[o]);
+}
+function oc(e) {
+  return window.getComputedStyle(e);
+}
+class ac extends Bs {
+  constructor() {
+    super(...arguments), this.type = "html", this.renderInstance = Ks;
+  }
+  readValueFromInstance(t, n) {
+    var s;
+    if (ue.has(n))
+      return (s = this.projection) != null && s.isProjecting ? et(n) : Or(t, n);
+    {
+      const i = oc(t), r = (zn(n) ? i.getPropertyValue(n) : i[n]) || 0;
+      return typeof r == "string" ? r.trim() : r;
+    }
+  }
+  measureInstanceViewportBox(t, { transformPagePoint: n }) {
+    return Ua(t, n);
+  }
+  build(t, n, s) {
+    Rt(t, n, s.transformTemplate);
+  }
+  scrapeMotionValuesFromProps(t, n, s) {
+    return kt(t, n, s);
+  }
+}
+const Ws = /* @__PURE__ */ new Set([
+  "baseFrequency",
+  "diffuseConstant",
+  "kernelMatrix",
+  "kernelUnitLength",
+  "keySplines",
+  "keyTimes",
+  "limitingConeAngle",
+  "markerHeight",
+  "markerWidth",
+  "numOctaves",
+  "targetX",
+  "targetY",
+  "surfaceScale",
+  "specularConstant",
+  "specularExponent",
+  "stdDeviation",
+  "tableValues",
+  "viewBox",
+  "gradientTransform",
+  "pathLength",
+  "startOffset",
+  "textLength",
+  "lengthAdjust"
+]);
+function cc(e, t, n, s) {
+  Ks(e, t, void 0, s);
+  for (const i in t.attrs)
+    e.setAttribute(Ws.has(i) ? i : Ft(i), t.attrs[i]);
+}
+class uc extends Bs {
+  constructor() {
+    super(...arguments), this.type = "svg", this.isSVGTag = !1, this.measureInstanceViewportBox = ks;
+  }
+  getBaseTargetFromProps(t, n) {
+    return t[n];
+  }
+  readValueFromInstance(t, n) {
+    if (ue.has(n)) {
+      const s = ps(n);
+      return s && s.default || 0;
+    }
+    return n = Ws.has(n) ? n : Ft(n), t.getAttribute(n);
+  }
+  scrapeMotionValuesFromProps(t, n, s) {
+    return Fs(t, n, s);
+  }
+  build(t, n, s) {
+    Ms(t, n, this.isSVGTag, s.transformTemplate, s.style);
+  }
+  renderInstance(t, n, s, i) {
+    cc(t, n, s, i);
+  }
+  mount(t) {
+    this.isSVGTag = Es(t.tagName), super.mount(t);
+  }
+}
+const lc = (e, t) => Lt(e) ? new uc(t) : new ac(t, {
+  allowProjection: e !== Tn
+}), fc = {
+  renderer: lc,
+  ...$a,
+  ...tc
+}, ft = /* @__PURE__ */ da("div"), $s = ne.createContext({
+  layers: [],
+  setLayers: () => {
+  },
+  addLayer: () => {
+  },
+  removeLayer: () => {
+  },
+  removeTopLayer: () => {
+  }
+}), Rc = ({ children: e }) => {
+  const [t, n] = ne.useState([]), s = (o) => {
+    n((a) => [...a, o]);
+  }, i = (o) => {
+    n(t.filter((a) => a !== o));
+  }, r = () => {
+    const o = t[t.length - 1];
+    o && i(o);
+  };
+  return /* @__PURE__ */ M(
+    $s.Provider,
+    {
+      value: { layers: t, setLayers: n, addLayer: s, removeLayer: i, removeTopLayer: r },
+      children: e
+    }
+  );
+}, _s = () => ne.useContext($s), dc = ({
+  defaultOpen: e,
+  open: t,
+  onOpenChange: n,
+  ...s
+}) => {
+  const [i, r] = Si({
+    prop: t,
+    onChange: n,
+    defaultProp: e ?? !1
+  }), o = _s(), a = s.a11yTitle;
+  if (ne.useEffect(() => {
+    !i && o.layers.includes(a) && o.removeLayer(a);
+  }, [a, o, i]), !!i)
+    return /* @__PURE__ */ M(hc, { open: i, onOpenChange: r, ...s });
+}, hc = ({
+  open: e,
+  onOpenChange: t,
+  a11yTitle: n,
+  a11yDescription: s,
+  children: i,
+  // Focus scope props
+  trapped: r,
+  onMountAutoFocus: o,
+  onUnmountAutoFocus: a,
+  ...l
+}) => {
+  var y, T;
+  const u = n, c = _s();
+  ne.useEffect(() => {
+    !c || !e || c.layers.includes(u) || c.addLayer(u);
+  }, [u, c, e]);
+  const d = ((y = c.layers) == null ? void 0 : y.indexOf(u)) || 0, f = ((T = c.layers) == null ? void 0 : T.length) || 0, h = d !== 0, g = u === c.layers[c.layers.length - 1];
+  return /* @__PURE__ */ M(Fo, { features: fc, children: /* @__PURE__ */ M(
+    An,
+    {
+      onEscapeKeyDown: (p) => {
+        g && (p.preventDefault(), c.removeTopLayer(), t(!1));
+      },
+      onPointerDownOutside: (p) => {
+        g && (p.preventDefault(), c.removeTopLayer(), t(!1));
+      },
+      children: /* @__PURE__ */ Ve(
+        J.Root,
+        {
+          open: e,
+          onOpenChange: (p) => {
+            var m;
+            if (((m = c == null ? void 0 : c.layers) == null ? void 0 : m.length) > 0)
+              return p === !1 && u === c.layers[c.layers.length - 1] ? (c.removeLayer(u), t(!1)) : void 0;
+            t(p);
+          },
+          children: [
+            /* @__PURE__ */ Ve(Qs.Root, { children: [
+              /* @__PURE__ */ M(J.Title, { children: n }),
+              s && /* @__PURE__ */ M(J.Description, { children: s })
+            ] }),
+            e && // We add the className "tgph" here so that styles within
+            // the portal get scoped properly to telegraph
+            /* @__PURE__ */ M(Js.Root, { className: "tgph", children: /* @__PURE__ */ M(pc, { layer: d, children: /* @__PURE__ */ M(
+              Zs,
+              {
+                trapped: typeof r == "boolean" ? r : g,
+                onMountAutoFocus: o,
+                onUnmountAutoFocus: a,
+                asChild: !0,
+                children: /* @__PURE__ */ M(ti, { children: /* @__PURE__ */ M(
+                  ee,
+                  {
+                    as: ft,
+                    initial: {
+                      top: `calc(var(--tgph-spacing-16) + var(--tgph-spacing-4) * ${f - 1})`
+                    },
+                    animate: {
+                      top: h ? `calc(var(--tgph-spacing-16) + var(--tgph-spacing-4) * ${d} )` : "var(--tgph-spacing-16)"
+                    },
+                    exit: { top: 0 },
+                    transition: { type: "spring", duration: 0.3, bounce: 0 },
+                    w: "full",
+                    justify: "center",
+                    style: {
+                      position: "fixed",
+                      left: 0,
+                      maxHeight: "calc(100vh - var(--tgph-spacing-32))",
+                      maxWidth: "calc(100vw - var(--tgph-spacing-8))",
+                      zIndex: `calc(var(--tgph-zIndex-modal) + ${d})`
+                    },
+                    children: /* @__PURE__ */ M(
+                      ee,
+                      {
+                        direction: "column",
+                        as: ft,
+                        animate: {
+                          scale: 1.02 - Math.abs(f - d) * 0.02,
+                          transformOrigin: "center center"
+                        },
+                        transition: {
+                          duration: 0.2,
+                          bounce: 0,
+                          type: "spring"
+                        },
+                        maxW: l.maxW ?? "160",
+                        w: l.w ?? "full",
+                        bg: "surface-1",
+                        border: "px",
+                        rounded: "4",
+                        shadow: "3",
+                        ...l,
+                        children: i
+                      },
+                      `content-${u}`
+                    )
+                  },
+                  `container-${u}`
+                ) })
+              }
+            ) }) })
+          ]
+        },
+        u
+      )
+    }
+  ) });
+}, pc = ({ layer: e, children: t }) => e > 0 ? t : /* @__PURE__ */ Ve(J.Overlay, { children: [
+  /* @__PURE__ */ M(
+    ni,
     {
-      as: T.div,
+      as: ft,
       initial: { opacity: 0 },
       animate: { opacity: 1 },
       exit: { opacity: 0 },
@@ -467,26 +3727,26 @@ const K = g.createContext({
     }
   ),
   t
-] }), De = g.forwardRef(
-  ({ children: e, ...t }, r) => /* @__PURE__ */ d(v.Content, { ref: r, asChild: !0, ...t, children: /* @__PURE__ */ d(E, { direction: "column", h: "full", ...t, children: e }) })
-), Oe = ({
+] }), mc = ne.forwardRef(
+  ({ children: e, ...t }, n) => /* @__PURE__ */ M(J.Content, { ref: n, asChild: !0, ...t, children: /* @__PURE__ */ M(ee, { direction: "column", h: "full", ...t, children: e }) })
+), gc = ({
   size: e = "1",
   variant: t = "ghost",
-  ...r
-}) => /* @__PURE__ */ d(v.Close, { asChild: !0, children: /* @__PURE__ */ d(
-  J,
+  ...n
+}) => /* @__PURE__ */ M(J.Close, { asChild: !0, children: /* @__PURE__ */ M(
+  ei,
   {
-    icon: { icon: ee.X, alt: "Close Modal" },
+    icon: { icon: si, alt: "Close Modal" },
     variant: t,
     size: e,
-    ...r
+    ...n
   }
-) }), Se = ({
+) }), yc = ({
   style: e,
   children: t,
-  ...r
-}) => /* @__PURE__ */ d(
-  E,
+  ...n
+}) => /* @__PURE__ */ M(
+  ee,
   {
     direction: "column",
     px: "6",
@@ -495,14 +3755,14 @@ const K = g.createContext({
       overflowY: "auto",
       ...e
     },
-    ...r,
+    ...n,
     children: t
   }
-), Te = ({
+), bc = ({
   children: e,
   ...t
-}) => /* @__PURE__ */ d(
-  E,
+}) => /* @__PURE__ */ M(
+  ee,
   {
     direction: "row",
     justify: "space-between",
@@ -513,11 +3773,11 @@ const K = g.createContext({
     ...t,
     children: e
   }
-), Be = ({
+), vc = ({
   children: e,
   ...t
-}) => /* @__PURE__ */ d(
-  E,
+}) => /* @__PURE__ */ M(
+  ee,
   {
     direction: "row",
     align: "center",
@@ -529,17 +3789,17 @@ const K = g.createContext({
     ...t,
     children: e
   }
-), Ie = {};
-Object.assign(Ie, {
-  Root: we,
-  Content: De,
-  Close: Oe,
-  Body: Se,
-  Header: Te,
-  Footer: Be
+), Tc = {};
+Object.assign(Tc, {
+  Root: dc,
+  Content: mc,
+  Close: gc,
+  Body: yc,
+  Header: bc,
+  Footer: vc
 });
 export {
-  Ie as Modal,
-  je as ModalStackingProvider
+  Tc as Modal,
+  Rc as ModalStackingProvider
 };
 //# sourceMappingURL=index.mjs.map