tactile-material 1.0.3 → 1.0.4

package/dist/tactile.es.js

@@ -1,4 +1,4 @@
-import * as Nn from "react";
+import * as Fn from "react";
 import ar, { createContext as zt, useRef as B, useId as Bn, useContext as Q, useInsertionEffect as Ie, useCallback as In, useMemo as I, useEffect as dt, Children as ga, isValidElement as ya, useLayoutEffect as va, useState as bt, forwardRef as _n, Fragment as lr, createElement as vn, Component as xa } from "react";
 const ue = (t, e = 360, n = 88) => {
   const s = (i) => {
@@ -78,8 +78,8 @@ function Ta() {
     }
     function S(d, T, M) {
       {
-        var E = y.ReactDebugCurrentFrame, O = E.getStackAddendum();
-        O !== "" && (T += "%s", M = M.concat([O]));
+        var E = y.ReactDebugCurrentFrame, N = E.getStackAddendum();
+        N !== "" && (T += "%s", M = M.concat([N]));
         var _ = M.map(function($) {
           return String($);
         });
@@ -88,19 +88,19 @@ function Ta() {
     }
     var C = !1, w = !1, A = !1, b = !1, R = !1, D;
     D = Symbol.for("react.module.reference");
-    function V(d) {
+    function k(d) {
       return !!(typeof d == "string" || typeof d == "function" || d === s || d === o || R || d === i || d === c || d === u || b || d === p || C || w || A || typeof d == "object" && d !== null && (d.$$typeof === h || d.$$typeof === f || d.$$typeof === r || d.$$typeof === a || d.$$typeof === l || // This needs to include all possible module reference object
       // types supported by any Flight configuration anywhere since
       // we don't know which Flight build this will end up being used
       // with.
       d.$$typeof === D || d.getModuleId !== void 0));
     }
-    function F(d, T, M) {
+    function O(d, T, M) {
       var E = d.displayName;
       if (E)
         return E;
-      var O = T.displayName || T.name || "";
-      return O !== "" ? M + "(" + O + ")" : M;
+      var N = T.displayName || T.name || "";
+      return N !== "" ? M + "(" + N + ")" : M;
     }
     function Z(d) {
       return d.displayName || "Context";
@@ -135,12 +135,12 @@ function Ta() {
             var M = d;
             return Z(M._context) + ".Provider";
           case l:
-            return F(d, d.render, "ForwardRef");
+            return O(d, d.render, "ForwardRef");
           case f:
             var E = d.displayName || null;
             return E !== null ? E : L(d.type) || "Memo";
           case h: {
-            var O = d, _ = O._payload, $ = O._init;
+            var N = d, _ = N._payload, $ = N._init;
             try {
               return L($(_));
             } catch {
@@ -218,8 +218,8 @@ function Ta() {
         if (qe === void 0)
           try {
             throw Error();
-          } catch (O) {
-            var E = O.stack.trim().match(/\n( *(at )?)/);
+          } catch (N) {
+            var E = N.stack.trim().match(/\n( *(at )?)/);
             qe = E && E[1] || "";
           }
         return `
@@ -241,7 +241,7 @@ function Ta() {
       }
       var E;
       Qe = !0;
-      var O = Error.prepareStackTrace;
+      var N = Error.prepareStackTrace;
       Error.prepareStackTrace = void 0;
       var _;
       _ = He.current, He.current = null, Wo();
@@ -297,9 +297,9 @@ function Ta() {
             }
         }
       } finally {
-        Qe = !1, He.current = _, Xo(), Error.prepareStackTrace = O;
+        Qe = !1, He.current = _, Xo(), Error.prepareStackTrace = N;
       }
-      var Ft = d ? d.displayName || d.name : "", At = Ft ? we(Ft) : "";
+      var Ot = d ? d.displayName || d.name : "", At = Ot ? we(Ot) : "";
       return typeof d == "function" && Pe.set(d, At), At;
     }
     function Ko(d, T, M) {
@@ -329,9 +329,9 @@ function Ta() {
           case f:
             return Se(d.type, T, M);
           case h: {
-            var E = d, O = E._payload, _ = E._init;
+            var E = d, N = E._payload, _ = E._init;
             try {
-              return Se(_(O), T, M);
+              return Se(_(N), T, M);
             } catch {
             }
           }
@@ -346,7 +346,7 @@ function Ta() {
       } else
         Ms.setExtraStackFrame(null);
     }
-    function Go(d, T, M, E, O) {
+    function Go(d, T, M, E, N) {
       {
         var _ = Function.call.bind(Qt);
         for (var $ in d)
@@ -361,7 +361,7 @@ function Ta() {
             } catch (K) {
               j = K;
             }
-            j && !(j instanceof Error) && (Re(O), P("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).", E || "React class", M, $, typeof j), Re(null)), j instanceof Error && !(j.message in Rs) && (Rs[j.message] = !0, Re(O), P("Failed %s type: %s", M, j.message), Re(null));
+            j && !(j instanceof Error) && (Re(N), P("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).", E || "React class", M, $, typeof j), Re(null)), j instanceof Error && !(j.message in Rs) && (Rs[j.message] = !0, Re(N), P("Failed %s type: %s", M, j.message), Re(null));
           }
       }
     }
@@ -389,12 +389,12 @@ function Ta() {
       if (qo(d))
         return P("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.", Ho(d)), As(d);
     }
-    var Vs = y.ReactCurrentOwner, Qo = {
+    var ks = y.ReactCurrentOwner, Qo = {
       key: !0,
       ref: !0,
       __self: !0,
       __source: !0
-    }, ks, Es;
+    }, Vs, Es;
     function Jo(d) {
       if (Qt.call(d, "ref")) {
         var T = Object.getOwnPropertyDescriptor(d, "ref").get;
@@ -412,12 +412,12 @@ function Ta() {
       return d.key !== void 0;
     }
     function ea(d, T) {
-      typeof d.ref == "string" && Vs.current;
+      typeof d.ref == "string" && ks.current;
     }
     function na(d, T) {
       {
         var M = function() {
-          ks || (ks = !0, P("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", T));
+          Vs || (Vs = !0, P("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", T));
         };
         M.isReactWarning = !0, Object.defineProperty(d, "key", {
           get: M,
@@ -436,7 +436,7 @@ function Ta() {
         });
       }
     }
-    var ia = function(d, T, M, E, O, _, $) {
+    var ia = function(d, T, M, E, N, _, $) {
       var j = {
         // This tag allows us to uniquely identify this as a React Element
         $$typeof: e,
@@ -462,13 +462,13 @@ function Ta() {
         configurable: !1,
         enumerable: !1,
         writable: !1,
-        value: O
+        value: N
       }), Object.freeze && (Object.freeze(j.props), Object.freeze(j)), j;
     };
-    function ra(d, T, M, E, O) {
+    function ra(d, T, M, E, N) {
       {
         var _, $ = {}, j = null, nt = null;
-        M !== void 0 && (Cs(M), j = "" + M), ta(T) && (Cs(T.key), j = "" + T.key), Jo(T) && (nt = T.ref, ea(T, O));
+        M !== void 0 && (Cs(M), j = "" + M), ta(T) && (Cs(T.key), j = "" + T.key), Jo(T) && (nt = T.ref, ea(T, N));
         for (_ in T)
           Qt.call(T, _) && !Qo.hasOwnProperty(_) && ($[_] = T[_]);
         if (d && d.defaultProps) {
@@ -480,11 +480,11 @@ function Ta() {
           var G = typeof d == "function" ? d.displayName || d.name || "Unknown" : d;
           j && na($, G), nt && sa($, G);
         }
-        return ia(d, j, nt, O, E, Vs.current, $);
+        return ia(d, j, nt, N, E, ks.current, $);
       }
     }
     var tn = y.ReactCurrentOwner, Ds = y.ReactDebugCurrentFrame;
-    function Ot(d) {
+    function Nt(d) {
       if (d) {
         var T = d._owner, M = Se(d.type, d._source, T ? T.type : null);
         Ds.setExtraStackFrame(M);
@@ -534,10 +534,10 @@ Check the top-level render call using <` + M + ">.");
           return;
         Ls[M] = !0;
         var E = "";
-        d && d._owner && d._owner !== tn.current && (E = " It was passed a child from " + L(d._owner.type) + "."), Ot(d), P('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.', M, E), Ot(null);
+        d && d._owner && d._owner !== tn.current && (E = " It was passed a child from " + L(d._owner.type) + "."), Nt(d), P('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.', M, E), Nt(null);
       }
     }
-    function Os(d, T) {
+    function Ns(d, T) {
       {
         if (typeof d != "object")
           return;
@@ -549,9 +549,9 @@ Check the top-level render call using <` + M + ">.");
         else if (nn(d))
           d._store && (d._store.validated = !0);
         else if (d) {
-          var O = x(d);
-          if (typeof O == "function" && O !== d.entries)
-            for (var _ = O.call(d), $; !($ = _.next()).done; )
+          var N = x(d);
+          if (typeof N == "function" && N !== d.entries)
+            for (var _ = N.call(d), $; !($ = _.next()).done; )
               nn($.value) && $s($.value, T);
         }
       }
@@ -575,8 +575,8 @@ Check the top-level render call using <` + M + ">.");
           Go(M, d.props, "prop", E, d);
         } else if (T.PropTypes !== void 0 && !en) {
           en = !0;
-          var O = L(T);
-          P("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?", O || "Unknown");
+          var N = L(T);
+          P("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?", N || "Unknown");
         }
         typeof T.getDefaultProps == "function" && !T.getDefaultProps.isReactClassApproved && P("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.");
       }
@@ -586,17 +586,17 @@ Check the top-level render call using <` + M + ">.");
         for (var T = Object.keys(d.props), M = 0; M < T.length; M++) {
           var E = T[M];
           if (E !== "children" && E !== "key") {
-            Ot(d), P("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.", E), Ot(null);
+            Nt(d), P("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.", E), Nt(null);
             break;
           }
         }
-        d.ref !== null && (Ot(d), P("Invalid attribute `ref` supplied to `React.Fragment`."), Ot(null));
+        d.ref !== null && (Nt(d), P("Invalid attribute `ref` supplied to `React.Fragment`."), Nt(null));
       }
     }
-    var Fs = {};
-    function Ns(d, T, M, E, O, _) {
+    var Os = {};
+    function Fs(d, T, M, E, N, _) {
       {
-        var $ = V(d);
+        var $ = k(d);
         if (!$) {
           var j = "";
           (d === void 0 || typeof d == "object" && d !== null && Object.keys(d).length === 0) && (j += " You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.");
@@ -605,7 +605,7 @@ Check the top-level render call using <` + M + ">.");
           var K;
           d === null ? K = "null" : Je(d) ? K = "array" : d !== void 0 && d.$$typeof === e ? (K = "<" + (L(d.type) || "Unknown") + " />", j = " Did you accidentally export a JSX literal instead of a component?") : K = typeof d, P("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", K, j);
         }
-        var G = ra(d, T, M, O, _);
+        var G = ra(d, T, M, N, _);
         if (G == null)
           return G;
         if ($) {
@@ -613,36 +613,36 @@ Check the top-level render call using <` + M + ">.");
           if (at !== void 0)
             if (E)
               if (Je(at)) {
-                for (var Ft = 0; Ft < at.length; Ft++)
-                  Os(at[Ft], d);
+                for (var Ot = 0; Ot < at.length; Ot++)
+                  Ns(at[Ot], d);
                 Object.freeze && Object.freeze(at);
               } else
                 P("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");
             else
-              Os(at, d);
+              Ns(at, d);
         }
         if (Qt.call(T, "key")) {
           var At = L(d), st = Object.keys(T).filter(function(ma) {
             return ma !== "key";
           }), sn = st.length > 0 ? "{key: someKey, " + st.join(": ..., ") + ": ...}" : "{key: someKey}";
-          if (!Fs[At + sn]) {
+          if (!Os[At + sn]) {
             var pa = st.length > 0 ? "{" + st.join(": ..., ") + ": ...}" : "{}";
             P(`A props object containing a "key" prop is being spread into JSX:
   let props = %s;
   <%s {...props} />
 React keys must be passed directly to JSX without using spread:
   let props = %s;
-  <%s key={someKey} {...props} />`, sn, At, pa, At), Fs[At + sn] = !0;
+  <%s key={someKey} {...props} />`, sn, At, pa, At), Os[At + sn] = !0;
           }
         }
         return d === s ? ca(G) : la(G), G;
       }
     }
     function ua(d, T, M) {
-      return Ns(d, T, M, !0);
+      return Fs(d, T, M, !0);
     }
     function fa(d, T, M) {
-      return Ns(d, T, M, !1);
+      return Fs(d, T, M, !1);
     }
     var da = fa, ha = ua;
     te.Fragment = s, te.jsx = da, te.jsxs = ha;
@@ -660,7 +660,7 @@ const _e = zt(null), me = zt({
   isStatic: !1,
   reducedMotion: "never"
 });
-class wa extends Nn.Component {
+class wa extends Fn.Component {
   getSnapshotBeforeUpdate(e) {
     const n = this.props.childRef.current;
     if (n && e.isPresent && !this.props.isPresent) {
@@ -702,7 +702,7 @@ function Pa({ children: t, isPresent: e }) {
         `), () => {
       document.head.removeChild(u);
     };
-  }, [e]), m.jsx(wa, { isPresent: e, childRef: s, sizeRef: i, children: Nn.cloneElement(t, { ref: s }) });
+  }, [e]), m.jsx(wa, { isPresent: e, childRef: s, sizeRef: i, children: Fn.cloneElement(t, { ref: s }) });
 }
 const Sa = ({ children: t, initial: e, isPresent: n, onExitComplete: s, custom: i, presenceAffectsLayout: o, mode: r }) => {
   const a = Gt(Ra), l = Bn(), c = In((f) => {
@@ -729,7 +729,7 @@ const Sa = ({ children: t, initial: e, isPresent: n, onExitComplete: s, custom:
   );
   return I(() => {
     a.forEach((f, h) => a.set(h, !1));
-  }, [n]), Nn.useEffect(() => {
+  }, [n]), Fn.useEffect(() => {
     !n && !a.size && s && s();
   }, [n]), r === "popLayout" && (t = m.jsx(Pa, { isPresent: n, children: t })), m.jsx(_e.Provider, { value: u, children: t });
 };
@@ -858,7 +858,7 @@ const Ae = [
   // Write
   "postRender"
   // Compute
-], Va = 40;
+], ka = 40;
 function ur(t, e) {
   let n = !1, s = !0;
   const i = {
@@ -867,7 +867,7 @@ function ur(t, e) {
     isProcessing: !1
   }, o = () => n = !0, r = Ae.reduce((y, P) => (y[P] = Ca(o), y), {}), { read: a, resolveKeyframes: l, update: c, preRender: u, render: f, postRender: h } = r, p = () => {
     const y = performance.now();
-    n = !1, i.delta = s ? 1e3 / 60 : Math.max(Math.min(y - i.timestamp, Va), 1), i.timestamp = y, i.isProcessing = !0, a.process(i), l.process(i), c.process(i), u.process(i), f.process(i), h.process(i), i.isProcessing = !1, n && e && (s = !1, t(p));
+    n = !1, i.delta = s ? 1e3 / 60 : Math.max(Math.min(y - i.timestamp, ka), 1), i.timestamp = y, i.isProcessing = !0, a.process(i), l.process(i), c.process(i), u.process(i), f.process(i), h.process(i), i.isProcessing = !1, n && e && (s = !1, t(p));
   }, g = () => {
     n = !0, s = !0, i.isProcessing || t(p);
   };
@@ -879,7 +879,7 @@ function ur(t, e) {
       r[Ae[P]].cancel(y);
   }, state: i, steps: r };
 }
-const { schedule: N, cancel: Tt, state: q, steps: rn } = ur(typeof requestAnimationFrame < "u" ? requestAnimationFrame : it, !0), fr = zt({ strict: !1 }), Us = {
+const { schedule: F, cancel: Tt, state: q, steps: rn } = ur(typeof requestAnimationFrame < "u" ? requestAnimationFrame : it, !0), fr = zt({ strict: !1 }), Us = {
   animation: [
     "animate",
     "variants",
@@ -903,7 +903,7 @@ for (const t in Us)
   Xt[t] = {
     isEnabled: (e) => Us[t].some((n) => !!e[n])
   };
-function ka(t) {
+function Va(t) {
   for (const e in t)
     Xt[e] = {
       ...Xt[e],
@@ -1009,21 +1009,21 @@ function $a(t, e) {
   }
   return t.inherit !== !1 ? e : {};
 }
-function Oa(t) {
+function Na(t) {
   const { initial: e, animate: n } = $a(t, Q(We));
   return I(() => ({ initial: e, animate: n }), [Xs(e), Xs(n)]);
 }
 function Xs(t) {
   return Array.isArray(t) ? t.join(" ") : t;
 }
-const Fa = Symbol.for("motionComponentSymbol");
-function Nt(t) {
+const Oa = Symbol.for("motionComponentSymbol");
+function Ft(t) {
   return t && typeof t == "object" && Object.prototype.hasOwnProperty.call(t, "current");
 }
-function Na(t, e, n) {
+function Fa(t, e, n) {
   return In(
     (s) => {
-      s && t.onMount && t.onMount(s), e && (s ? e.mount(s) : e.unmount()), n && (typeof n == "function" ? n(s) : Nt(n) && (n.current = s));
+      s && t.onMount && t.onMount(s), e && (s ? e.mount(s) : e.unmount()), n && (typeof n == "function" ? n(s) : Ft(n) && (n.current = s));
     },
     /**
      * Only pass a new ref callback to React if we've received a visual element
@@ -1066,7 +1066,7 @@ function _a(t, e, n, s) {
   t.projection = new n(t.latestValues, e["data-framer-portal-id"] ? void 0 : gr(t.parent)), t.projection.setOptions({
     layoutId: i,
     layout: o,
-    alwaysMeasureLayout: !!r || a && Nt(a),
+    alwaysMeasureLayout: !!r || a && Ft(a),
     visualElement: t,
     /**
      * TODO: Update options in an effect. This could be tricky as it'll be too late
@@ -1087,24 +1087,24 @@ function gr(t) {
 }
 function Ua({ preloadedFeatures: t, createVisualElement: e, useRender: n, useVisualState: s, Component: i }) {
   var o, r;
-  t && ka(t);
+  t && Va(t);
   function a(c, u) {
     let f;
     const h = {
       ...Q(me),
       ...c,
       layoutId: Wa(c)
-    }, { isStatic: p } = h, g = Oa(c), v = s(c, p);
+    }, { isStatic: p } = h, g = Na(c), v = s(c, p);
     if (!p && Wn) {
       Xa(h, t);
       const x = Ya(h);
       f = x.MeasureLayout, g.visualElement = Ia(i, v, h, e, x.ProjectionNode);
     }
-    return m.jsxs(We.Provider, { value: g, children: [f && g.visualElement ? m.jsx(f, { visualElement: g.visualElement, ...h }) : null, n(i, c, Na(v, g.visualElement, u), v, p, g.visualElement)] });
+    return m.jsxs(We.Provider, { value: g, children: [f && g.visualElement ? m.jsx(f, { visualElement: g.visualElement, ...h }) : null, n(i, c, Fa(v, g.visualElement, u), v, p, g.visualElement)] });
   }
   a.displayName = `motion.${typeof i == "string" ? i : `create(${(r = (o = i.displayName) !== null && o !== void 0 ? o : i.name) !== null && r !== void 0 ? r : ""})`}`;
   const l = _n(a);
-  return l[Fa] = i, l;
+  return l[Oa] = i, l;
 }
 function Wa({ layoutId: t }) {
   const e = Q(Un).id;
@@ -1192,7 +1192,7 @@ function Hn(t, e, n, s) {
   return e;
 }
 const bn = (t) => Array.isArray(t), za = (t) => !!(t && typeof t == "object" && t.mix && t.toValue), Ga = (t) => bn(t) ? t[t.length - 1] || 0 : t, J = (t) => !!(t && t.getVelocity);
-function ke(t) {
+function Ve(t) {
   const e = J(t) ? t.get() : t;
   return za(e) ? e.toValue() : e;
 }
@@ -1210,7 +1210,7 @@ const yr = (t) => (e, n) => {
 function Ha(t, e, n, s) {
   const i = {}, o = s(t, {});
   for (const h in o)
-    i[h] = ke(o[h]);
+    i[h] = Ve(o[h]);
   let { initial: r, animate: a } = t;
   const l = Ye(t), c = hr(t);
   e && c && !l && t.inherit !== !1 && (r === void 0 && (r = e.initial), a === void 0 && (a = e.animate));
@@ -1270,46 +1270,46 @@ const Ht = [
   test: (e) => typeof e == "string" && e.endsWith(t) && e.split(" ").length === 1,
   parse: parseFloat,
   transform: (e) => `${e}${t}`
-}), St = /* @__PURE__ */ ye("deg"), pt = /* @__PURE__ */ ye("%"), k = /* @__PURE__ */ ye("px"), Ja = /* @__PURE__ */ ye("vh"), tl = /* @__PURE__ */ ye("vw"), Ks = {
+}), St = /* @__PURE__ */ ye("deg"), pt = /* @__PURE__ */ ye("%"), V = /* @__PURE__ */ ye("px"), Ja = /* @__PURE__ */ ye("vh"), tl = /* @__PURE__ */ ye("vw"), Ks = {
   ...pt,
   parse: (t) => pt.parse(t) / 100,
   transform: (t) => pt.transform(t * 100)
 }, el = {
   // Border props
-  borderWidth: k,
-  borderTopWidth: k,
-  borderRightWidth: k,
-  borderBottomWidth: k,
-  borderLeftWidth: k,
-  borderRadius: k,
-  radius: k,
-  borderTopLeftRadius: k,
-  borderTopRightRadius: k,
-  borderBottomRightRadius: k,
-  borderBottomLeftRadius: k,
+  borderWidth: V,
+  borderTopWidth: V,
+  borderRightWidth: V,
+  borderBottomWidth: V,
+  borderLeftWidth: V,
+  borderRadius: V,
+  radius: V,
+  borderTopLeftRadius: V,
+  borderTopRightRadius: V,
+  borderBottomRightRadius: V,
+  borderBottomLeftRadius: V,
   // Positioning props
-  width: k,
-  maxWidth: k,
-  height: k,
-  maxHeight: k,
-  top: k,
-  right: k,
-  bottom: k,
-  left: k,
+  width: V,
+  maxWidth: V,
+  height: V,
+  maxHeight: V,
+  top: V,
+  right: V,
+  bottom: V,
+  left: V,
   // Spacing props
-  padding: k,
-  paddingTop: k,
-  paddingRight: k,
-  paddingBottom: k,
-  paddingLeft: k,
-  margin: k,
-  marginTop: k,
-  marginRight: k,
-  marginBottom: k,
-  marginLeft: k,
+  padding: V,
+  paddingTop: V,
+  paddingRight: V,
+  paddingBottom: V,
+  paddingLeft: V,
+  margin: V,
+  marginTop: V,
+  marginRight: V,
+  marginBottom: V,
+  marginLeft: V,
   // Misc
-  backgroundPositionX: k,
-  backgroundPositionY: k
+  backgroundPositionX: V,
+  backgroundPositionY: V
 }, nl = {
   rotate: St,
   rotateX: St,
@@ -1322,19 +1322,19 @@ const Ht = [
   skew: St,
   skewX: St,
   skewY: St,
-  distance: k,
-  translateX: k,
-  translateY: k,
-  translateZ: k,
-  x: k,
-  y: k,
-  z: k,
-  perspective: k,
-  transformPerspective: k,
+  distance: V,
+  translateX: V,
+  translateY: V,
+  translateZ: V,
+  x: V,
+  y: V,
+  z: V,
+  perspective: V,
+  transformPerspective: V,
   opacity: de,
   originX: Ks,
   originY: Ks,
-  originZ: k
+  originZ: V
 }, zs = {
   ...qt,
   transform: Math.round
@@ -1342,7 +1342,7 @@ const Ht = [
   ...el,
   ...nl,
   zIndex: zs,
-  size: k,
+  size: V,
   // SVG
   fillOpacity: de,
   strokeOpacity: de,
@@ -1403,12 +1403,12 @@ const ol = {
 function ll(t, e, n = 1, s = 0, i = !0) {
   t.pathLength = 1;
   const o = i ? ol : al;
-  t[o.offset] = k.transform(-s);
-  const r = k.transform(e), a = k.transform(n);
+  t[o.offset] = V.transform(-s);
+  const r = V.transform(e), a = V.transform(n);
   t[o.array] = `${r} ${a}`;
 }
 function Gs(t, e, n) {
-  return typeof t == "string" ? t : k.transform(e + n * t);
+  return typeof t == "string" ? t : V.transform(e + n * t);
 }
 function cl(t, e, n) {
   const s = Gs(e, t.x, t.width), i = Gs(n, t.y, t.height);
@@ -1536,8 +1536,8 @@ const Zs = ["x", "y", "width", "height", "cx", "cy", "r"], dl = {
           const l = Zs[a];
           t[l] !== e[l] && (r = !0);
         }
-      r && N.read(() => {
-        fl(n, s), N.render(() => {
+      r && F.read(() => {
+        fl(n, s), F.render(() => {
           ts(s, i, ns(n.tagName), t.transformTemplate), Sr(n, s);
         });
       });
@@ -1697,7 +1697,7 @@ function is(t, e) {
   return t ? t[e] || t.default || t : void 0;
 }
 const Tn = 2e4;
-function Vr(t) {
+function kr(t) {
   let e = 0;
   const n = 50;
   let s = t.next(e);
@@ -1728,7 +1728,7 @@ const $e = /* @__PURE__ */ Sl(() => {
     return !1;
   }
   return !0;
-}, "linearEasing"), kr = (t, e, n = 10) => {
+}, "linearEasing"), Vr = (t, e, n = 10) => {
   let s = "";
   const i = Math.max(Math.round(e / n), 2);
   for (let o = 0; o < i; o++)
@@ -1751,7 +1751,7 @@ const ne = ([t, e, n, s]) => `cubic-bezier(${t}, ${e}, ${n}, ${s})`, wn = {
 };
 function Dr(t, e) {
   if (t)
-    return typeof t == "function" && $e() ? kr(t, e) : os(t) ? ne(t) : Array.isArray(t) ? t.map((n) => Dr(n, e) || wn.easeOut) : wn[t];
+    return typeof t == "function" && $e() ? Vr(t, e) : os(t) ? ne(t) : Array.isArray(t) ? t.map((n) => Dr(n, e) || wn.easeOut) : wn[t];
 }
 const ft = {
   x: !1,
@@ -1817,7 +1817,7 @@ function Qs(t) {
 function on(t, e) {
   t.dispatchEvent(new PointerEvent("pointer" + e, { isPrimary: !0, bubbles: !0 }));
 }
-const Vl = (t, e) => {
+const kl = (t, e) => {
   const n = t.currentTarget;
   if (!n)
     return;
@@ -1835,7 +1835,7 @@ const Vl = (t, e) => {
 function Js(t) {
   return as(t) && !jr();
 }
-function kl(t, e, n = {}) {
+function Vl(t, e, n = {}) {
   const [s, i, o] = Lr(t, n), r = (a) => {
     const l = a.currentTarget;
     if (!Js(a) || se.has(l))
@@ -1851,7 +1851,7 @@ function kl(t, e, n = {}) {
     window.addEventListener("pointerup", f, i), window.addEventListener("pointercancel", h, i);
   };
   return s.forEach((a) => {
-    !Cl(a) && a.getAttribute("tabindex") === null && (a.tabIndex = 0), (n.useGlobalTarget ? window : a).addEventListener("pointerdown", r, i), a.addEventListener("focus", (c) => Vl(c, i), i);
+    !Cl(a) && a.getAttribute("tabindex") === null && (a.tabIndex = 0), (n.useGlobalTarget ? window : a).addEventListener("pointerdown", r, i), a.addEventListener("focus", (c) => kl(c, i), i);
   }), o;
 }
 function El(t) {
@@ -1861,7 +1861,7 @@ function El(t) {
     ft.x = ft.y = !1;
   });
 }
-const Or = /* @__PURE__ */ new Set([
+const Nr = /* @__PURE__ */ new Set([
   "width",
   "height",
   "top",
@@ -1912,7 +1912,7 @@ class us {
     this.subscriptions.length = 0;
   }
 }
-function Fr(t, e) {
+function Or(t, e) {
   return e ? t * (1e3 / e) : 0;
 }
 const ti = 30, jl = (t) => !isNaN(parseFloat(t)), re = {
@@ -1986,7 +1986,7 @@ class Ll {
     this.events[e] || (this.events[e] = new us());
     const s = this.events[e].add(n);
     return e === "change" ? () => {
-      s(), N.read(() => {
+      s(), F.read(() => {
         this.events.change.getSize() || this.stop();
       });
     } : s;
@@ -2059,7 +2059,7 @@ class Ll {
     if (!this.canTrackVelocity || this.prevFrameValue === void 0 || e - this.updatedAt > ti)
       return 0;
     const n = Math.min(this.updatedAt - this.prevUpdatedAt, ti);
-    return Fr(parseFloat(this.current) - parseFloat(this.prevFrameValue), n);
+    return Or(parseFloat(this.current) - parseFloat(this.prevFrameValue), n);
   }
   /**
    * Registers a new animation to control this `MotionValue`. Only one
@@ -2127,23 +2127,23 @@ function fs(t, e) {
     $l(t, r, a);
   }
 }
-function Ol(t) {
+function Nl(t) {
   return !!(J(t) && t.add);
 }
 function Pn(t, e) {
   const n = t.getValue("willChange");
-  if (Ol(n))
+  if (Nl(n))
     return n.add(e);
 }
-function Nr(t) {
+function Fr(t) {
   return t.props[pr];
 }
-const Br = (t, e, n) => (((1 - 3 * n + 3 * e) * t + (3 * n - 6 * e)) * t + 3 * e) * t, Fl = 1e-7, Nl = 12;
+const Br = (t, e, n) => (((1 - 3 * n + 3 * e) * t + (3 * n - 6 * e)) * t + 3 * e) * t, Ol = 1e-7, Fl = 12;
 function Bl(t, e, n, s, i) {
   let o, r, a = 0;
   do
     r = e + (n - e) / 2, o = Br(r, s, i) - t, o > 0 ? n = r : e = r;
-  while (Math.abs(o) > Fl && ++a < Nl);
+  while (Math.abs(o) > Ol && ++a < Fl);
   return r;
 }
 function ve(t, e, n, s) {
@@ -2290,7 +2290,7 @@ function sc(t, e, n) {
     for (const o of e)
       t[o] = Jr(n, i);
 }
-const ni = (t) => t === qt || t === k, si = (t, e) => parseFloat(t.split(", ")[e]), ii = (t, e) => (n, { transform: s }) => {
+const ni = (t) => t === qt || t === V, si = (t, e) => parseFloat(t.split(", ")[e]), ii = (t, e) => (n, { transform: s }) => {
   if (s === "none" || !s)
     return 0;
   const i = s.match(/^matrix3d\((.+)\)$/u);
@@ -2356,7 +2356,7 @@ class ys {
     this.isComplete = !1, this.isAsync = !1, this.needsMeasurement = !1, this.isScheduled = !1, this.unresolvedKeyframes = [...e], this.onComplete = n, this.name = s, this.motionValue = i, this.element = o, this.isAsync = r;
   }
   scheduleResolve() {
-    this.isScheduled = !0, this.isAsync ? (Dt.add(this), Mn || (Mn = !0, N.read(eo), N.resolveKeyframes(to))) : (this.readKeyframes(), this.complete());
+    this.isScheduled = !0, this.isAsync ? (Dt.add(this), Mn || (Mn = !0, F.read(eo), F.resolveKeyframes(to))) : (this.readKeyframes(), this.complete());
   }
   readKeyframes() {
     const { unresolvedKeyframes: e, name: n, element: s, motionValue: i } = this;
@@ -2419,7 +2419,7 @@ function so(t, e, n = 1) {
 const io = (t) => (e) => e.test(t), fc = {
   test: (t) => t === "auto",
   parse: (t) => t
-}, ro = [qt, k, pt, St, tl, Ja, fc], ri = (t) => ro.find(io(t));
+}, ro = [qt, V, pt, St, tl, Ja, fc], ri = (t) => ro.find(io(t));
 class oo extends ys {
   constructor(e, n, s, i, o) {
     super(e, n, s, i, o, !0);
@@ -2436,7 +2436,7 @@ class oo extends ys {
         u !== void 0 && (e[l] = u), l === e.length - 1 && (this.finalKeyframe = c);
       }
     }
-    if (this.resolveNoneKeyframes(), !Or.has(s) || e.length !== 2)
+    if (this.resolveNoneKeyframes(), !Nr.has(s) || e.length !== 2)
       return;
     const [i, o] = e, r = ri(i), a = ri(o);
     if (r !== a)
@@ -2595,7 +2595,7 @@ function gc({ hue: t, saturation: e, lightness: n, alpha: s }) {
     alpha: s
   };
 }
-function Oe(t, e) {
+function Ne(t, e) {
   return (n) => n > 0 ? e : t;
 }
 const cn = (t, e, n) => {
@@ -2612,7 +2612,7 @@ function ai(t) {
 const li = (t, e) => {
   const n = ai(t), s = ai(e);
   if (!n || !s)
-    return Oe(t, e);
+    return Ne(t, e);
   const i = { ...n };
   return (o) => (i.red = cn(n.red, s.red, o), i.green = cn(n.green, s.green, o), i.blue = cn(n.blue, s.blue, o), i.alpha = X(n.alpha, s.alpha, o), Et.transform(i));
 }, xc = (t, e) => (n) => e(t(n)), xe = (...t) => t.reduce(xc), Cn = /* @__PURE__ */ new Set(["none", "hidden"]);
@@ -2623,7 +2623,7 @@ function Tc(t, e) {
   return (n) => X(t, e, n);
 }
 function vs(t) {
-  return typeof t == "number" ? Tc : typeof t == "string" ? qn(t) ? Oe : tt.test(t) ? li : Sc : Array.isArray(t) ? lo : typeof t == "object" ? tt.test(t) ? li : wc : Oe;
+  return typeof t == "number" ? Tc : typeof t == "string" ? qn(t) ? Ne : tt.test(t) ? li : Sc : Array.isArray(t) ? lo : typeof t == "object" ? tt.test(t) ? li : wc : Ne;
 }
 function lo(t, e) {
   const n = [...t], s = n.length, i = t.map((o, r) => vs(o)(o, e[r]));
@@ -2654,7 +2654,7 @@ function Pc(t, e) {
 }
 const Sc = (t, e) => {
   const n = Rt.createTransformer(e), s = he(t), i = he(e);
-  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 ? Cn.has(t) && !i.values.length || Cn.has(e) && !s.values.length ? bc(t, e) : xe(lo(Pc(s, i), i.values), n) : (Zt(!0, `Complex values '${t}' and '${e}' 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.`), Oe(t, e));
+  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 ? Cn.has(t) && !i.values.length || Cn.has(e) && !s.values.length ? bc(t, e) : xe(lo(Pc(s, i), i.values), n) : (Zt(!0, `Complex values '${t}' and '${e}' 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.`), Ne(t, e));
 };
 function co(t, e, n) {
   return typeof t == "number" && typeof e == "number" && typeof n == "number" ? X(t, e, n) : vs(t)(t, e);
@@ -2662,7 +2662,7 @@ function co(t, e, n) {
 const Rc = 5;
 function uo(t, e, n) {
   const s = Math.max(e - Rc, 0);
-  return Fr(n - t(s), e - s);
+  return Or(n - t(s), e - s);
 }
 const W = {
   // Default spring physics
@@ -2698,10 +2698,10 @@ function Mc({ duration: t = W.duration, bounce: e = W.bounce, velocity: n = W.ve
   Zt(t <= /* @__PURE__ */ ht(W.maxDuration), "Spring duration must be 10 seconds or less");
   let r = 1 - e;
   r = wt(W.minDamping, W.maxDamping, r), t = wt(W.minDuration, W.maxDuration, /* @__PURE__ */ vt(t)), r < 1 ? (i = (c) => {
-    const u = c * r, f = u * t, h = u - n, p = Vn(c, r), g = Math.exp(-f);
+    const u = c * r, f = u * t, h = u - n, p = kn(c, r), g = Math.exp(-f);
     return un - h / p * g;
   }, o = (c) => {
-    const f = c * r * t, h = f * n + n, p = Math.pow(r, 2) * Math.pow(c, 2) * t, g = Math.exp(-f), v = Vn(Math.pow(c, 2), r);
+    const f = c * r * t, h = f * n + n, p = Math.pow(r, 2) * Math.pow(c, 2) * t, g = Math.exp(-f), v = kn(Math.pow(c, 2), r);
     return (-i(c) + un > 0 ? -1 : 1) * ((h - p) * g) / v;
   }) : (i = (c) => {
     const u = Math.exp(-c * t), f = (c - n) * t + 1;
@@ -2733,10 +2733,10 @@ function Cc(t, e, n) {
     s = s - t(s) / e(s);
   return s;
 }
-function Vn(t, e) {
+function kn(t, e) {
   return t * Math.sqrt(1 - e * e);
 }
-const Vc = ["duration", "bounce"], kc = ["stiffness", "damping", "mass"];
+const kc = ["duration", "bounce"], Vc = ["stiffness", "damping", "mass"];
 function ci(t, e) {
   return e.some((n) => t[n] !== void 0);
 }
@@ -2749,7 +2749,7 @@ function Ec(t) {
     isResolvedFromDuration: !1,
     ...t
   };
-  if (!ci(t, kc) && ci(t, Vc))
+  if (!ci(t, Vc) && ci(t, kc))
     if (t.visualDuration) {
       const n = t.visualDuration, s = 2 * Math.PI / (n * 1.2), i = s * s, o = 2 * wt(0.05, 1, 1 - (t.bounce || 0)) * Math.sqrt(i);
       e = {
@@ -2782,7 +2782,7 @@ function fo(t = W.visualDuration, e = W.bounce) {
   s || (s = P ? W.restSpeed.granular : W.restSpeed.default), i || (i = P ? W.restDelta.granular : W.restDelta.default);
   let S;
   if (v < 1) {
-    const w = Vn(y, v);
+    const w = kn(y, v);
     S = (A) => {
       const b = Math.exp(-v * y * A);
       return r - b * ((g + v * y * x) / w * Math.sin(w * A) + x * Math.cos(w * A));
@@ -2811,7 +2811,7 @@ function fo(t = W.visualDuration, e = W.bounce) {
       return a.value = a.done ? r : A, a;
     },
     toString: () => {
-      const w = Math.min(Vr(C), Tn), A = kr((b) => C.next(w * b).value, w, 30);
+      const w = Math.min(kr(C), Tn), A = Vr((b) => C.next(w * b).value, w, 30);
       return w + "ms " + A;
     }
   };
@@ -2826,8 +2826,8 @@ function ui({ keyframes: t, velocity: e = 0, power: n = 0.8, timeConstant: s = 3
   const x = f + v, y = r === void 0 ? x : r(x);
   y !== x && (v = y - f);
   const P = (R) => -v * Math.exp(-R / s), S = (R) => y + P(R), C = (R) => {
-    const D = P(R), V = S(R);
-    h.done = Math.abs(D) <= c, h.value = h.done ? y : V;
+    const D = P(R), k = S(R);
+    h.done = Math.abs(D) <= c, h.value = h.done ? y : k;
   };
   let w, A;
   const b = (R) => {
@@ -2902,31 +2902,31 @@ function po(t, e, { clamp: n = !0, ease: s, mixer: i } = {}) {
   };
   return n ? (u) => c(wt(t[0], t[o - 1], u)) : c;
 }
-function Oc(t, e) {
+function Nc(t, e) {
   const n = t[t.length - 1];
   for (let s = 1; s <= e; s++) {
     const i = /* @__PURE__ */ Wt(0, e, s);
     t.push(X(n, 1, i));
   }
 }
-function Fc(t) {
+function Oc(t) {
   const e = [0];
-  return Oc(e, t.length - 1), e;
+  return Nc(e, t.length - 1), e;
 }
-function Nc(t, e) {
+function Fc(t, e) {
   return t.map((n) => n * e);
 }
 function Bc(t, e) {
   return t.map(() => e || ho).splice(0, t.length - 1);
 }
-function Fe({ duration: t = 300, keyframes: e, times: n, ease: s = "easeInOut" }) {
+function Oe({ duration: t = 300, keyframes: e, times: n, ease: s = "easeInOut" }) {
   const i = Lc(s) ? s.map(di) : di(s), o = {
     done: !1,
     value: e[0]
-  }, r = Nc(
+  }, r = Fc(
     // 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 === e.length ? n : Fc(e),
+    n && n.length === e.length ? n : Oc(e),
     t
   ), a = po(r, e, {
     ease: Array.isArray(i) ? i : Bc(e, i)
@@ -2939,7 +2939,7 @@ function Fe({ duration: t = 300, keyframes: e, times: n, ease: s = "easeInOut" }
 const Ic = (t) => {
   const e = ({ timestamp: n }) => t(n);
   return {
-    start: () => N.update(e, !0),
+    start: () => F.update(e, !0),
     stop: () => Tt(e),
     /**
      * If we're processing this frame we can use the
@@ -2950,8 +2950,8 @@ const Ic = (t) => {
 }, _c = {
   decay: ui,
   inertia: ui,
-  tween: Fe,
-  keyframes: Fe,
+  tween: Oe,
+  keyframes: Oe,
   spring: fo
 }, Uc = (t) => t / 100;
 class Ge extends ao {
@@ -2970,15 +2970,15 @@ class Ge extends ao {
     super.flatten(), this._resolved && Object.assign(this._resolved, this.initPlayback(this._resolved.keyframes));
   }
   initPlayback(e) {
-    const { type: n = "keyframes", repeat: s = 0, repeatDelay: i = 0, repeatType: o, velocity: r = 0 } = this.options, a = rs(n) ? n : _c[n] || Fe;
+    const { type: n = "keyframes", repeat: s = 0, repeatDelay: i = 0, repeatType: o, velocity: r = 0 } = this.options, a = rs(n) ? n : _c[n] || Oe;
     let l, c;
-    a !== Fe && typeof e[0] != "number" && (process.env.NODE_ENV !== "production" && gt(e.length === 2, `Only two keyframes currently supported with spring and inertia animations. Trying to animate ${e}`), l = xe(Uc, co(e[0], e[1])), e = [0, 100]);
+    a !== Oe && typeof e[0] != "number" && (process.env.NODE_ENV !== "production" && gt(e.length === 2, `Only two keyframes currently supported with spring and inertia animations. Trying to animate ${e}`), l = xe(Uc, co(e[0], e[1])), e = [0, 100]);
     const u = a({ ...this.options, keyframes: e });
     o === "mirror" && (c = a({
       ...this.options,
       keyframes: [...e].reverse(),
       velocity: -r
-    })), u.calculatedDuration === null && (u.calculatedDuration = Vr(u));
+    })), u.calculatedDuration === null && (u.calculatedDuration = kr(u));
     const { calculatedDuration: f } = u, h = f + i, p = h * (s + 1) - i;
     return {
       generator: u,
@@ -3009,8 +3009,8 @@ class Ge extends ao {
     let S = this.currentTime, C = o;
     if (p) {
       const R = Math.min(this.currentTime, u) / f;
-      let D = Math.floor(R), V = R % 1;
-      !V && R >= 1 && (V = 1), V === 1 && D--, D = Math.min(D, p + 1), !!(D % 2) && (g === "reverse" ? (V = 1 - V, v && (V -= v / f)) : g === "mirror" && (C = r)), S = wt(0, 1, V) * f;
+      let D = Math.floor(R), k = R % 1;
+      !k && R >= 1 && (k = 1), k === 1 && D--, D = Math.min(D, p + 1), !!(D % 2) && (g === "reverse" ? (k = 1 - k, v && (k -= v / f)) : g === "mirror" && (C = r)), S = wt(0, 1, k) * f;
     }
     const w = P ? { done: !1, value: l[0] } : C.next(S);
     a && (w.value = a(w.value));
@@ -3102,7 +3102,7 @@ function Yc(t, e, n, { delay: s = 0, duration: i = 300, repeat: o = 0, repeatTyp
     direction: r === "reverse" ? "alternate" : "normal"
   });
 }
-const Kc = /* @__PURE__ */ Xn(() => Object.hasOwnProperty.call(Element.prototype, "animate")), Ne = 10, zc = 2e4;
+const Kc = /* @__PURE__ */ Xn(() => Object.hasOwnProperty.call(Element.prototype, "animate")), Fe = 10, zc = 2e4;
 function Gc(t) {
   return rs(t.type) || t.type === "spring" || !Er(t.ease);
 }
@@ -3118,11 +3118,11 @@ function Zc(t, e) {
   const i = [];
   let o = 0;
   for (; !s.done && o < zc; )
-    s = n.sample(o), i.push(s.value), o += Ne;
+    s = n.sample(o), i.push(s.value), o += Fe;
   return {
     times: void 0,
     keyframes: i,
-    duration: o - Ne,
+    duration: o - Fe,
     ease: "linear"
   };
 }
@@ -3262,7 +3262,7 @@ class hi extends ao {
         times: a,
         isGenerator: !0
       }), v = /* @__PURE__ */ ht(this.time);
-      c.setWithVelocity(g.sample(v - Ne).value, g.sample(v).value, Ne);
+      c.setWithVelocity(g.sample(v - Fe).value, g.sample(v).value, Fe);
     }
     const { onStop: l } = this.options;
     l && l(), this.cancel();
@@ -3336,7 +3336,7 @@ const xs = (t, e, n, s = {}, i, o) => (r) => {
   if ((u.type === !1 || u.duration === 0 && !u.repeatDelay) && (u.duration = 0, u.delay === 0 && (f = !0)), f && !o && e.get() !== void 0) {
     const h = ze(u.keyframes, a);
     if (h !== void 0)
-      return N.update(() => {
+      return F.update(() => {
         u.onUpdate(h), u.onComplete();
       }), new wl([]);
   }
@@ -3361,23 +3361,23 @@ function go(t, e, { delay: n = 0, transitionOverride: s, type: i } = {}) {
     };
     let v = !1;
     if (window.MotionHandoffAnimation) {
-      const y = Nr(t);
+      const y = Fr(t);
       if (y) {
-        const P = window.MotionHandoffAnimation(y, f, N);
+        const P = window.MotionHandoffAnimation(y, f, F);
         P !== null && (g.startTime = P, v = !0);
       }
     }
-    Pn(t, f), h.start(xs(f, h, p, t.shouldReduceMotion && Or.has(f) ? { type: !1 } : g, t, v));
+    Pn(t, f), h.start(xs(f, h, p, t.shouldReduceMotion && Nr.has(f) ? { type: !1 } : g, t, v));
     const x = h.animation;
     x && c.push(x);
   }
   return a && Promise.all(c).then(() => {
-    N.update(() => {
+    F.update(() => {
       a && fs(t, a);
     });
   }), c;
 }
-function kn(t, e, n = {}) {
+function Vn(t, e, n = {}) {
   var s;
   const i = Ke(t, e, n.type === "exit" ? (s = t.presenceContext) === null || s === void 0 ? void 0 : s.custom : void 0);
   let { transition: o = t.getDefaultTransition() || {} } = i || {};
@@ -3395,7 +3395,7 @@ function kn(t, e, n = {}) {
 function iu(t, e, n = 0, s = 0, i = 1, o) {
   const r = [], a = (t.variantChildren.size - 1) * s, l = i === 1 ? (c = 0) => c * s : (c = 0) => a - c * s;
   return Array.from(t.variantChildren).sort(ru).forEach((c, u) => {
-    c.notify("AnimationStart", e), r.push(kn(c, e, {
+    c.notify("AnimationStart", e), r.push(Vn(c, e, {
       ...o,
       delay: n + l(u)
     }).then(() => c.notify("AnimationComplete", e)));
@@ -3408,10 +3408,10 @@ function yo(t, e, n = {}) {
   t.notify("AnimationStart", e);
   let s;
   if (Array.isArray(e)) {
-    const i = e.map((o) => kn(t, o, n));
+    const i = e.map((o) => Vn(t, o, n));
     s = Promise.all(i);
   } else if (typeof e == "string")
-    s = kn(t, e, n);
+    s = Vn(t, e, n);
   else {
     const i = typeof e == "function" ? Ke(t, e, n.custom) : e;
     s = Promise.all(go(t, i, n));
@@ -3469,25 +3469,25 @@ function uu(t) {
       let R = b || // If we're making this variant active, we want to always make it active
       y === l && P.isActive && !A && C || // If we removed a higher-priority variant (i is in reverse order)
       x > g && C, D = !1;
-      const V = Array.isArray(S) ? S : [S];
-      let F = V.reduce(i(y), {});
-      w === !1 && (F = {});
+      const k = Array.isArray(S) ? S : [S];
+      let O = k.reduce(i(y), {});
+      w === !1 && (O = {});
       const { prevResolvedValues: Z = {} } = P, L = {
         ...Z,
-        ...F
+        ...O
       }, U = (H) => {
         R = !0, h.has(H) && (D = !0, h.delete(H)), P.needsAnimating[H] = !0;
         const ot = t.getValue(H);
         ot && (ot.liveStyle = !1);
       };
       for (const H in L) {
-        const ot = F[H], Lt = Z[H];
+        const ot = O[H], Lt = Z[H];
         if (p.hasOwnProperty(H))
           continue;
         let $t = !1;
         bn(ot) && bn(Lt) ? $t = !Cr(ot, Lt) : $t = ot !== Lt, $t ? ot != null ? U(H) : h.add(H) : ot !== void 0 && h.has(H) ? U(H) : P.protectedKeys[H] = !0;
       }
-      P.prevProp = S, P.prevResolvedValues = F, P.isActive && (p = { ...p, ...F }), s && t.blockInitialAnimation && (R = !1), R && (!(A && b) || D) && f.push(...V.map((H) => ({
+      P.prevProp = S, P.prevResolvedValues = O, P.isActive && (p = { ...p, ...O }), s && t.blockInitialAnimation && (R = !1), R && (!(A && b) || D) && f.push(...k.map((H) => ({
         animation: H,
         options: { type: y }
       })));
@@ -3644,7 +3644,7 @@ class xo {
       const { onStart: x, onMove: y } = this.handlers;
       h || (x && x(this.lastMoveEvent, f), this.startEvent = this.lastMoveEvent), y && y(this.lastMoveEvent, f);
     }, this.handlePointerMove = (f, h) => {
-      this.lastMoveEvent = f, this.lastMoveEventInfo = fn(h, this.transformPagePoint), N.update(this.updatePoint, !0);
+      this.lastMoveEvent = f, this.lastMoveEventInfo = fn(h, this.transformPagePoint), F.update(this.updatePoint, !0);
     }, this.handlePointerUp = (f, h) => {
       this.end();
       const { onEnd: p, onSessionEnd: g, resumeAnimation: v } = this.handlers;
@@ -3755,12 +3755,12 @@ function Cu(t, e) {
     y: Ti(t.y, e.y)
   };
 }
-function Vu(t, e) {
+function ku(t, e) {
   let n = 0.5;
   const s = rt(t), i = rt(e);
   return i > s ? n = /* @__PURE__ */ Wt(e.min, e.max - s, t.min) : s > i && (n = /* @__PURE__ */ Wt(t.min, t.max - i, e.min)), wt(0, 1, n);
 }
-function ku(t, e) {
+function Vu(t, e) {
   const n = {};
   return e.min !== void 0 && (n.min = e.min - t.min), e.max !== void 0 && (n.max = e.max - t.min), n;
 }
@@ -3821,7 +3821,7 @@ function hn(t) {
 function Dn({ scale: t, scaleX: e, scaleY: n }) {
   return !hn(t) || !hn(e) || !hn(n);
 }
-function Vt(t) {
+function kt(t) {
   return Dn(t) || So(t) || t.z || t.rotate || t.rotateX || t.rotateY || t.skewX || t.skewY;
 }
 function So(t) {
@@ -3843,7 +3843,7 @@ function jn(t, e = 0, n = 1, s, i) {
 function Ro(t, { x: e, y: n }) {
   jn(t.x, e.translate, e.scale, e.originPoint), jn(t.y, n.translate, n.scale, n.originPoint);
 }
-const Ci = 0.999999999999, Vi = 1.0000000000001;
+const Ci = 0.999999999999, ki = 1.0000000000001;
 function Lu(t, e, n, s = !1) {
   const i = n.length;
   if (!i)
@@ -3856,19 +3856,19 @@ function Lu(t, e, n, s = !1) {
     l && l.props.style && l.props.style.display === "contents" || (s && o.options.layoutScroll && o.scroll && o !== o.root && Ut(t, {
       x: -o.scroll.offset.x,
       y: -o.scroll.offset.y
-    }), r && (e.x *= r.x.scale, e.y *= r.y.scale, Ro(t, r)), s && Vt(o.latestValues) && Ut(t, o.latestValues));
+    }), r && (e.x *= r.x.scale, e.y *= r.y.scale, Ro(t, r)), s && kt(o.latestValues) && Ut(t, o.latestValues));
   }
-  e.x < Vi && e.x > Ci && (e.x = 1), e.y < Vi && e.y > Ci && (e.y = 1);
+  e.x < ki && e.x > Ci && (e.x = 1), e.y < ki && e.y > Ci && (e.y = 1);
 }
 function _t(t, e) {
   t.min = t.min + e, t.max = t.max + e;
 }
-function ki(t, e, n, s, i = 0.5) {
+function Vi(t, e, n, s, i = 0.5) {
   const o = X(t.min, t.max, i);
   jn(t, e, n, o, s);
 }
 function Ut(t, e) {
-  ki(t.x, e.x, e.scaleX, e.scale, e.originX), ki(t.y, e.y, e.scaleY, e.scale, e.originY);
+  Vi(t.x, e.x, e.scaleX, e.scale, e.originX), Vi(t.y, e.y, e.scaleY, e.scale, e.originY);
 }
 function Mo(t, e) {
   return Po(ju(t.getBoundingClientRect(), e));
@@ -3877,8 +3877,8 @@ function $u(t, e, n) {
   const s = Mo(t, n), { scroll: i } = e;
   return i && (_t(s.x, i.offset.x), _t(s.y, i.offset.y)), s;
 }
-const Ao = ({ current: t }) => t ? t.ownerDocument.defaultView : null, Ou = /* @__PURE__ */ new WeakMap();
-class Fu {
+const Ao = ({ current: t }) => t ? t.ownerDocument.defaultView : null, Nu = /* @__PURE__ */ new WeakMap();
+class Ou {
   constructor(e) {
     this.openDragLock = null, this.isDragging = !1, this.currentDirection = null, this.originPoint = { x: 0, y: 0 }, this.constraints = !1, this.hasMutatedConstraints = !1, this.elastic = z(), this.visualElement = e;
   }
@@ -3903,7 +3903,7 @@ class Fu {
           }
         }
         this.originPoint[x] = y;
-      }), g && N.postRender(() => g(u, f)), Pn(this.visualElement, "transform");
+      }), g && F.postRender(() => g(u, f)), Pn(this.visualElement, "transform");
       const { animationState: v } = this.visualElement;
       v && v.setActive("whileDrag", !0);
     }, r = (u, f) => {
@@ -3912,7 +3912,7 @@ class Fu {
         return;
       const { offset: x } = f;
       if (p && this.currentDirection === null) {
-        this.currentDirection = Nu(x), this.currentDirection !== null && g && g(this.currentDirection);
+        this.currentDirection = Fu(x), this.currentDirection !== null && g && g(this.currentDirection);
         return;
       }
       this.updateAxis("x", f.point, x), this.updateAxis("y", f.point, x), this.visualElement.render(), v && v(u, f);
@@ -3939,7 +3939,7 @@ class Fu {
     const { velocity: i } = n;
     this.startAnimation(i);
     const { onDragEnd: o } = this.getProps();
-    o && N.postRender(() => o(e, n));
+    o && F.postRender(() => o(e, n));
   }
   cancel() {
     this.isDragging = !1;
@@ -3950,7 +3950,7 @@ class Fu {
   }
   updateAxis(e, n, s) {
     const { drag: i } = this.getProps();
-    if (!s || !Ve(e, i, this.currentDirection))
+    if (!s || !ke(e, i, this.currentDirection))
       return;
     const o = this.getAxisMotionValue(e);
     let r = this.originPoint[e] + s[e];
@@ -3959,13 +3959,13 @@ class Fu {
   resolveConstraints() {
     var e;
     const { dragConstraints: n, dragElastic: s } = this.getProps(), i = this.visualElement.projection && !this.visualElement.projection.layout ? this.visualElement.projection.measure(!1) : (e = this.visualElement.projection) === null || e === void 0 ? void 0 : e.layout, o = this.constraints;
-    n && Nt(n) ? this.constraints || (this.constraints = this.resolveRefConstraints()) : n && i ? this.constraints = Au(i.layoutBox, n) : this.constraints = !1, this.elastic = Eu(s), o !== this.constraints && i && this.constraints && !this.hasMutatedConstraints && ct((r) => {
-      this.constraints !== !1 && this.getAxisMotionValue(r) && (this.constraints[r] = ku(i.layoutBox[r], this.constraints[r]));
+    n && Ft(n) ? this.constraints || (this.constraints = this.resolveRefConstraints()) : n && i ? this.constraints = Au(i.layoutBox, n) : this.constraints = !1, this.elastic = Eu(s), o !== this.constraints && i && this.constraints && !this.hasMutatedConstraints && ct((r) => {
+      this.constraints !== !1 && this.getAxisMotionValue(r) && (this.constraints[r] = Vu(i.layoutBox[r], this.constraints[r]));
     });
   }
   resolveRefConstraints() {
     const { dragConstraints: e, onMeasureDragConstraints: n } = this.getProps();
-    if (!e || !Nt(e))
+    if (!e || !Ft(e))
       return !1;
     const s = e.current;
     gt(s !== null, "If `dragConstraints` is set as a React ref, that ref must be passed to another component's `ref` prop.");
@@ -3982,7 +3982,7 @@ class Fu {
   }
   startAnimation(e) {
     const { drag: n, dragMomentum: s, dragElastic: i, dragTransition: o, dragSnapToOrigin: r, onDragTransitionEnd: a } = this.getProps(), l = this.constraints || {}, c = ct((u) => {
-      if (!Ve(u, n, this.currentDirection))
+      if (!ke(u, n, this.currentDirection))
         return;
       let f = l && l[u] || {};
       r && (f = { min: 0, max: 0 });
@@ -4031,7 +4031,7 @@ class Fu {
   snapToCursor(e) {
     ct((n) => {
       const { drag: s } = this.getProps();
-      if (!Ve(n, s, this.currentDirection))
+      if (!ke(n, s, this.currentDirection))
         return;
       const { projection: i } = this.visualElement, o = this.getAxisMotionValue(n);
       if (i && i.layout) {
@@ -4049,7 +4049,7 @@ class Fu {
     if (!this.visualElement.current)
       return;
     const { drag: e, dragConstraints: n } = this.getProps(), { projection: s } = this.visualElement;
-    if (!Nt(n) || !s || !this.constraints)
+    if (!Ft(n) || !s || !this.constraints)
       return;
     this.stopAnimation();
     const i = { x: 0, y: 0 };
@@ -4057,12 +4057,12 @@ class Fu {
       const a = this.getAxisMotionValue(r);
       if (a && this.constraints !== !1) {
         const l = a.get();
-        i[r] = Vu({ min: l, max: l }, this.constraints[r]);
+        i[r] = ku({ min: l, max: l }, this.constraints[r]);
       }
     });
     const { transformTemplate: o } = this.visualElement.getProps();
     this.visualElement.current.style.transform = o ? o({}, "") : "none", s.root && s.root.updateScroll(), s.updateLayout(), this.resolveConstraints(), ct((r) => {
-      if (!Ve(r, e, null))
+      if (!ke(r, e, null))
         return;
       const a = this.getAxisMotionValue(r), { min: l, max: c } = this.constraints[r];
       a.set(X(l, c, i[r]));
@@ -4071,15 +4071,15 @@ class Fu {
   addListeners() {
     if (!this.visualElement.current)
       return;
-    Ou.set(this.visualElement, this);
+    Nu.set(this.visualElement, this);
     const e = this.visualElement.current, n = ae(e, "pointerdown", (l) => {
       const { drag: c, dragListener: u = !0 } = this.getProps();
       c && u && this.start(l);
     }), s = () => {
       const { dragConstraints: l } = this.getProps();
-      Nt(l) && l.current && (this.constraints = this.resolveRefConstraints());
+      Ft(l) && l.current && (this.constraints = this.resolveRefConstraints());
     }, { projection: i } = this.visualElement, o = i.addEventListener("measure", s);
-    i && !i.layout && (i.root && i.root.updateScroll(), i.updateLayout()), N.read(s);
+    i && !i.layout && (i.root && i.root.updateScroll(), i.updateLayout()), F.read(s);
     const r = pe(window, "resize", () => this.scalePositionWithinConstraints()), a = i.addEventListener("didUpdate", ({ delta: l, hasLayoutChanged: c }) => {
       this.isDragging && c && (ct((u) => {
         const f = this.getAxisMotionValue(u);
@@ -4103,16 +4103,16 @@ class Fu {
     };
   }
 }
-function Ve(t, e, n) {
+function ke(t, e, n) {
   return (e === !0 || e === t) && (n === null || n === t);
 }
-function Nu(t, e = 10) {
+function Fu(t, e = 10) {
   let n = null;
   return Math.abs(t.y) > e ? n = "y" : Math.abs(t.x) > e && (n = "x"), n;
 }
 class Bu extends Mt {
   constructor(e) {
-    super(e), this.removeGroupControls = it, this.removeListeners = it, this.controls = new Fu(e);
+    super(e), this.removeGroupControls = it, this.removeListeners = it, this.controls = new Ou(e);
   }
   mount() {
     const { dragControls: e } = this.node.getProps();
@@ -4123,7 +4123,7 @@ class Bu extends Mt {
   }
 }
 const Ei = (t) => (e, n) => {
-  t && N.postRender(() => t(e, n));
+  t && F.postRender(() => t(e, n));
 };
 class Iu extends Mt {
   constructor() {
@@ -4142,7 +4142,7 @@ class Iu extends Mt {
       onStart: Ei(n),
       onMove: s,
       onEnd: (o, r) => {
-        delete this.session, i && N.postRender(() => i(o, r));
+        delete this.session, i && F.postRender(() => i(o, r));
       }
     };
   }
@@ -4176,7 +4176,7 @@ const ee = {
     if (!e.target)
       return t;
     if (typeof t == "string")
-      if (k.test(t))
+      if (V.test(t))
         t = parseFloat(t);
       else
         return t;
@@ -4211,7 +4211,7 @@ class Uu extends xa {
   }
   getSnapshotBeforeUpdate(e) {
     const { layoutDependency: n, visualElement: s, drag: i, isPresent: o } = this.props, r = s.projection;
-    return r && (r.isPresent = o, i || e.layoutDependency !== n || n === void 0 ? r.willUpdate() : this.safeToRemove(), e.isPresent !== o && (o ? r.promote() : r.relegate() || N.postRender(() => {
+    return r && (r.isPresent = o, i || e.layoutDependency !== n || n === void 0 ? r.willUpdate() : this.safeToRemove(), e.isPresent !== o && (o ? r.promote() : r.relegate() || F.postRender(() => {
       const a = r.getStack();
       (!a || !a.members.length) && this.safeToRemove();
     }))), null;
@@ -4281,9 +4281,9 @@ function Gu(t, e) {
     const o = i - n;
     o >= e && (Tt(s), t(o - e));
   };
-  return N.read(s, !0), () => Tt(s);
+  return F.read(s, !0), () => Tt(s);
 }
-const Vo = ["TopLeft", "TopRight", "BottomLeft", "BottomRight"], Zu = Vo.length, ji = (t) => typeof t == "string" ? parseFloat(t) : t, Li = (t) => typeof t == "number" || k.test(t);
+const ko = ["TopLeft", "TopRight", "BottomLeft", "BottomRight"], Zu = ko.length, ji = (t) => typeof t == "string" ? parseFloat(t) : t, Li = (t) => typeof t == "number" || V.test(t);
 function Hu(t, e, n, s, i, o) {
   i ? (t.opacity = X(
     0,
@@ -4292,7 +4292,7 @@ function Hu(t, e, n, s, i, o) {
     qu(s)
   ), t.opacityExit = X(e.opacity !== void 0 ? e.opacity : 1, 0, Qu(s))) : o && (t.opacity = X(e.opacity !== void 0 ? e.opacity : 1, n.opacity !== void 0 ? n.opacity : 1, s));
   for (let r = 0; r < Zu; r++) {
-    const a = `border${Vo[r]}Radius`;
+    const a = `border${ko[r]}Radius`;
     let l = $i(e, a), c = $i(n, a);
     if (l === void 0 && c === void 0)
       continue;
@@ -4303,27 +4303,27 @@ function Hu(t, e, n, s, i, o) {
 function $i(t, e) {
   return t[e] !== void 0 ? t[e] : t.borderRadius;
 }
-const qu = /* @__PURE__ */ ko(0, 0.5, Yr), Qu = /* @__PURE__ */ ko(0.5, 0.95, it);
-function ko(t, e, n) {
+const qu = /* @__PURE__ */ Vo(0, 0.5, Yr), Qu = /* @__PURE__ */ Vo(0.5, 0.95, it);
+function Vo(t, e, n) {
   return (s) => s < t ? 0 : s > e ? 1 : n(/* @__PURE__ */ Wt(t, e, s));
 }
-function Oi(t, e) {
+function Ni(t, e) {
   t.min = e.min, t.max = e.max;
 }
 function lt(t, e) {
-  Oi(t.x, e.x), Oi(t.y, e.y);
+  Ni(t.x, e.x), Ni(t.y, e.y);
 }
-function Fi(t, e) {
+function Oi(t, e) {
   t.translate = e.translate, t.scale = e.scale, t.originPoint = e.originPoint, t.origin = e.origin;
 }
-function Ni(t, e, n, s, i) {
+function Fi(t, e, n, s, i) {
   return t -= e, t = Be(t, 1 / n, s), i !== void 0 && (t = Be(t, 1 / i, s)), t;
 }
 function Ju(t, e = 0, n = 1, s = 0.5, i, o = t, r = t) {
   if (pt.test(e) && (e = parseFloat(e), e = X(r.min, r.max, e / 100) - r.min), typeof e != "number")
     return;
   let a = X(o.min, o.max, s);
-  t === o && (a -= e), t.min = Ni(t.min, e, n, a, i), t.max = Ni(t.max, e, n, a, i);
+  t === o && (a -= e), t.min = Fi(t.min, e, n, a, i), t.max = Fi(t.max, e, n, a, i);
 }
 function Bi(t, e, [n, s, i], o, r) {
   Ju(t, e[n], e[s], e[i], e.scale, o, r);
@@ -4420,7 +4420,7 @@ function rf(t, e, n) {
   const a = t.x.scale * e.x, l = t.y.scale * e.y;
   return (a !== 1 || l !== 1) && (s += `scale(${a}, ${l})`), s || "none";
 }
-const kt = {
+const Vt = {
   type: "projectionFrame",
   totalNodes: 0,
   resolvedTargetDeltas: 0,
@@ -4437,10 +4437,10 @@ function jo(t) {
   const { visualElement: e } = t.options;
   if (!e)
     return;
-  const n = Nr(e);
+  const n = Fr(e);
   if (window.MotionHasOptimisedAnimation(n, "transform")) {
     const { layout: i, layoutId: o } = t.options;
-    window.MotionCancelOptimisedAnimation(n, "transform", N, !(i || o));
+    window.MotionCancelOptimisedAnimation(n, "transform", F, !(i || o));
   }
   const { parent: s } = t;
   s && !s.hasCheckedOptimisedAppear && jo(s);
@@ -4451,7 +4451,7 @@ function Lo({ attachResizeListener: t, defaultParent: e, measureScroll: n, check
       this.id = af++, this.animationId = 0, this.children = /* @__PURE__ */ new Set(), this.options = {}, this.isTreeAnimating = !1, this.isAnimationBlocked = !1, this.isLayoutDirty = !1, this.isProjectionDirty = !1, this.isSharedProjectionDirty = !1, this.isTransformDirty = !1, this.updateManuallyBlocked = !1, this.updateBlockedByResize = !1, this.isUpdating = !1, this.isSVG = !1, this.needsReset = !1, this.shouldResetTransform = !1, this.hasCheckedOptimisedAppear = !1, this.treeScale = { x: 1, y: 1 }, this.eventHandlers = /* @__PURE__ */ new Map(), this.hasTreeAnimated = !1, this.updateScheduled = !1, this.scheduleUpdate = () => this.update(), this.projectionUpdateScheduled = !1, this.checkUpdateFailed = () => {
         this.isUpdating && (this.isUpdating = !1, this.clearAllSnapshots());
       }, this.updateProjection = () => {
-        this.projectionUpdateScheduled = !1, ie && (kt.totalNodes = kt.resolvedTargetDeltas = kt.recalculatedProjection = 0), this.nodes.forEach(uf), this.nodes.forEach(mf), this.nodes.forEach(gf), this.nodes.forEach(ff), ie && window.MotionDebug.record(kt);
+        this.projectionUpdateScheduled = !1, ie && (Vt.totalNodes = Vt.resolvedTargetDeltas = Vt.recalculatedProjection = 0), this.nodes.forEach(uf), this.nodes.forEach(mf), this.nodes.forEach(gf), this.nodes.forEach(ff), ie && window.MotionDebug.record(Vt);
       }, this.resolvedRelativeTargetAt = 0, this.hasProjected = !1, this.isVisible = !0, this.animationProgress = 0, this.sharedNodes = /* @__PURE__ */ new Map(), this.latestValues = r, this.root = a ? a.root || a : this, this.path = a ? [...a.path, a] : [], this.parent = a, this.depth = a ? a.depth + 1 : 0;
       for (let l = 0; l < this.path.length; l++)
         this.path[l].shouldResetTransform = !0;
@@ -4561,10 +4561,10 @@ function Lo({ attachResizeListener: t, defaultParent: e, measureScroll: n, check
       this.nodes.forEach(df), this.sharedNodes.forEach(vf);
     }
     scheduleUpdateProjection() {
-      this.projectionUpdateScheduled || (this.projectionUpdateScheduled = !0, N.preRender(this.updateProjection, !1, !0));
+      this.projectionUpdateScheduled || (this.projectionUpdateScheduled = !0, F.preRender(this.updateProjection, !1, !0));
     }
     scheduleCheckAfterUnmount() {
-      N.postRender(() => {
+      F.postRender(() => {
         this.isLayoutDirty ? this.root.didUpdate() : this.root.checkUpdateFailed();
       });
     }
@@ -4602,7 +4602,7 @@ function Lo({ attachResizeListener: t, defaultParent: e, measureScroll: n, check
       if (!i)
         return;
       const r = this.isLayoutDirty || this.shouldResetTransform || this.options.alwaysMeasureLayout, a = this.projectionDelta && !Eo(this.projectionDelta), l = this.getTransformTemplate(), c = l ? l(this.latestValues, "") : void 0, u = c !== this.prevTransformTemplateValue;
-      r && (a || Vt(this.latestValues) || u) && (i(this.instance, c), this.shouldResetTransform = !1, this.scheduleRender());
+      r && (a || kt(this.latestValues) || u) && (i(this.instance, c), this.shouldResetTransform = !1, this.scheduleRender());
     }
     measure(r = !0) {
       const a = this.measurePageBox();
@@ -4646,22 +4646,22 @@ function Lo({ attachResizeListener: t, defaultParent: e, measureScroll: n, check
         !a && u.options.layoutScroll && u.scroll && u !== u.root && Ut(l, {
           x: -u.scroll.offset.x,
           y: -u.scroll.offset.y
-        }), Vt(u.latestValues) && Ut(l, u.latestValues);
+        }), kt(u.latestValues) && Ut(l, u.latestValues);
       }
-      return Vt(this.latestValues) && Ut(l, this.latestValues), l;
+      return kt(this.latestValues) && Ut(l, this.latestValues), l;
     }
     removeTransform(r) {
       const a = z();
       lt(a, r);
       for (let l = 0; l < this.path.length; l++) {
         const c = this.path[l];
-        if (!c.instance || !Vt(c.latestValues))
+        if (!c.instance || !kt(c.latestValues))
           continue;
         Dn(c.latestValues) && c.updateSnapshot();
         const u = z(), f = c.measurePageBox();
         lt(u, f), Ii(a, c.latestValues, c.snapshot ? c.snapshot.layoutBox : void 0, u);
       }
-      return Vt(this.latestValues) && Ii(a, this.latestValues), a;
+      return kt(this.latestValues) && Ii(a, this.latestValues), a;
     }
     setTargetDelta(r) {
       this.targetDelta = r, this.root.scheduleUpdateProjection(), this.isProjectionDirty = !0;
@@ -4698,7 +4698,7 @@ function Lo({ attachResizeListener: t, defaultParent: e, measureScroll: n, check
             const p = this.getClosestProjectingParent();
             p && !!p.resumingFrom == !!this.resumingFrom && !p.options.layoutScroll && p.target && this.animationProgress !== 1 ? (this.relativeParent = p, this.forceRelativeParentToResolveTarget(), this.relativeTarget = z(), this.relativeTargetOrigin = z(), ce(this.relativeTargetOrigin, this.target, p.target), lt(this.relativeTarget, this.relativeTargetOrigin)) : this.relativeParent = this.relativeTarget = void 0;
           }
-          ie && kt.resolvedTargetDeltas++;
+          ie && Vt.resolvedTargetDeltas++;
         }
       }
     }
@@ -4726,7 +4726,7 @@ function Lo({ attachResizeListener: t, defaultParent: e, measureScroll: n, check
         this.prevProjectionDelta && (this.createProjectionDeltas(), this.scheduleRender());
         return;
       }
-      !this.projectionDelta || !this.prevProjectionDelta ? this.createProjectionDeltas() : (Fi(this.prevProjectionDelta.x, this.projectionDelta.x), Fi(this.prevProjectionDelta.y, this.projectionDelta.y)), le(this.projectionDelta, this.layoutCorrected, g, this.latestValues), (this.treeScale.x !== h || this.treeScale.y !== p || !Yi(this.projectionDelta.x, this.prevProjectionDelta.x) || !Yi(this.projectionDelta.y, this.prevProjectionDelta.y)) && (this.hasProjected = !0, this.scheduleRender(), this.notifyListeners("projectionUpdate", g)), ie && kt.recalculatedProjection++;
+      !this.projectionDelta || !this.prevProjectionDelta ? this.createProjectionDeltas() : (Oi(this.prevProjectionDelta.x, this.projectionDelta.x), Oi(this.prevProjectionDelta.y, this.projectionDelta.y)), le(this.projectionDelta, this.layoutCorrected, g, this.latestValues), (this.treeScale.x !== h || this.treeScale.y !== p || !Yi(this.projectionDelta.x, this.prevProjectionDelta.x) || !Yi(this.projectionDelta.y, this.prevProjectionDelta.y)) && (this.hasProjected = !0, this.scheduleRender(), this.notifyListeners("projectionUpdate", g)), ie && Vt.recalculatedProjection++;
     }
     hide() {
       this.isVisible = !1;
@@ -4757,7 +4757,7 @@ function Lo({ attachResizeListener: t, defaultParent: e, measureScroll: n, check
       }, this.mixTargetDelta(this.options.layoutRoot ? 1e3 : 0);
     }
     startAnimation(r) {
-      this.notifyListeners("animationStart"), this.currentAnimation && this.currentAnimation.stop(), this.resumingFrom && this.resumingFrom.currentAnimation && this.resumingFrom.currentAnimation.stop(), this.pendingAnimation && (Tt(this.pendingAnimation), this.pendingAnimation = void 0), this.pendingAnimation = N.update(() => {
+      this.notifyListeners("animationStart"), this.currentAnimation && this.currentAnimation.stop(), this.resumingFrom && this.resumingFrom.currentAnimation && this.resumingFrom.currentAnimation.stop(), this.pendingAnimation && (Tt(this.pendingAnimation), this.pendingAnimation = void 0), this.pendingAnimation = F.update(() => {
         De.hasAnimatedSinceResize = !0, this.currentAnimation = Xu(0, Ki, {
           ...r,
           onUpdate: (a) => {
@@ -4853,11 +4853,11 @@ function Lo({ attachResizeListener: t, defaultParent: e, measureScroll: n, check
         visibility: ""
       }, u = this.getTransformTemplate();
       if (this.needsReset)
-        return this.needsReset = !1, c.opacity = "", c.pointerEvents = ke(r == null ? void 0 : r.pointerEvents) || "", c.transform = u ? u(this.latestValues, "") : "none", c;
+        return this.needsReset = !1, c.opacity = "", c.pointerEvents = Ve(r == null ? void 0 : r.pointerEvents) || "", c.transform = u ? u(this.latestValues, "") : "none", c;
       const f = this.getLead();
       if (!this.projectionDelta || !this.layout || !f.target) {
         const v = {};
-        return this.options.layoutId && (v.opacity = this.latestValues.opacity !== void 0 ? this.latestValues.opacity : 1, v.pointerEvents = ke(r == null ? void 0 : r.pointerEvents) || ""), this.hasProjected && !Vt(this.latestValues) && (v.transform = u ? u({}, "") : "none", this.hasProjected = !1), v;
+        return this.options.layoutId && (v.opacity = this.latestValues.opacity !== void 0 ? this.latestValues.opacity : 1, v.pointerEvents = Ve(r == null ? void 0 : r.pointerEvents) || ""), this.hasProjected && !kt(this.latestValues) && (v.transform = u ? u({}, "") : "none", this.hasProjected = !1), v;
       }
       const h = f.animationValues || f.latestValues;
       this.applyTransformsToTarget(), c.transform = rf(this.projectionDeltaWithTransform, this.treeScale, h), u && (c.transform = u(h, c.transform));
@@ -4874,7 +4874,7 @@ function Lo({ attachResizeListener: t, defaultParent: e, measureScroll: n, check
         } else
           c[v] = P;
       }
-      return this.options.layoutId && (c.pointerEvents = f === this ? ke(r == null ? void 0 : r.pointerEvents) || "" : "none"), c;
+      return this.options.layoutId && (c.pointerEvents = f === this ? Ve(r == null ? void 0 : r.pointerEvents) || "" : "none"), c;
     }
     clearSnapshot() {
       this.resumeFrom = this.snapshot = void 0;
@@ -4936,7 +4936,7 @@ function cf(t) {
   t.options.transition = void 0;
 }
 function uf(t) {
-  ie && kt.totalNodes++, t.parent && (t.isProjecting() || (t.isProjectionDirty = t.parent.isProjectionDirty), t.isSharedProjectionDirty || (t.isSharedProjectionDirty = !!(t.isProjectionDirty || t.parent.isProjectionDirty || t.parent.isSharedProjectionDirty)), t.isTransformDirty || (t.isTransformDirty = t.parent.isTransformDirty));
+  ie && Vt.totalNodes++, t.parent && (t.isProjecting() || (t.isProjectionDirty = t.parent.isProjectionDirty), t.isSharedProjectionDirty || (t.isSharedProjectionDirty = !!(t.isProjectionDirty || t.parent.isProjectionDirty || t.parent.isSharedProjectionDirty)), t.isTransformDirty || (t.isTransformDirty = t.parent.isTransformDirty));
 }
 function ff(t) {
   t.isProjectionDirty = t.isSharedProjectionDirty = t.isTransformDirty = !1;
@@ -5007,7 +5007,7 @@ const Sf = Lo({
   checkIsScrollRoot: () => !0
 }), gn = {
   current: void 0
-}, Oo = Lo({
+}, No = Lo({
   measureScroll: (t) => ({
     x: t.scrollLeft,
     y: t.scrollTop
@@ -5029,7 +5029,7 @@ const Sf = Lo({
   },
   drag: {
     Feature: Bu,
-    ProjectionNode: Oo,
+    ProjectionNode: No,
     MeasureLayout: Co
   }
 };
@@ -5037,7 +5037,7 @@ function tr(t, e, n) {
   const { props: s } = t;
   t.animationState && s.whileHover && t.animationState.setActive("whileHover", n === "Start");
   const i = "onHover" + n, o = s[i];
-  o && N.postRender(() => o(e, be(e)));
+  o && F.postRender(() => o(e, be(e)));
 }
 class Mf extends Mt {
   mount() {
@@ -5073,27 +5073,27 @@ function er(t, e, n) {
   const { props: s } = t;
   t.animationState && s.whileTap && t.animationState.setActive("whileTap", n === "Start");
   const i = "onTap" + (n === "End" ? "" : n), o = s[i];
-  o && N.postRender(() => o(e, be(e)));
+  o && F.postRender(() => o(e, be(e)));
 }
 class Cf extends Mt {
   mount() {
     const { current: e } = this.node;
-    e && (this.unmount = kl(e, (n) => (er(this.node, n, "Start"), (s, { success: i }) => er(this.node, s, i ? "End" : "Cancel")), { useGlobalTarget: this.node.props.globalTapTarget }));
+    e && (this.unmount = Vl(e, (n) => (er(this.node, n, "Start"), (s, { success: i }) => er(this.node, s, i ? "End" : "Cancel")), { useGlobalTarget: this.node.props.globalTapTarget }));
   }
   unmount() {
   }
 }
-const Ln = /* @__PURE__ */ new WeakMap(), yn = /* @__PURE__ */ new WeakMap(), Vf = (t) => {
+const Ln = /* @__PURE__ */ new WeakMap(), yn = /* @__PURE__ */ new WeakMap(), kf = (t) => {
   const e = Ln.get(t.target);
   e && e(t);
-}, kf = (t) => {
-  t.forEach(Vf);
+}, Vf = (t) => {
+  t.forEach(kf);
 };
 function Ef({ root: t, ...e }) {
   const n = t || document;
   yn.has(n) || yn.set(n, {});
   const s = yn.get(n), i = JSON.stringify(e);
-  return s[i] || (s[i] = new IntersectionObserver(kf, { root: t, ...e })), s[i];
+  return s[i] || (s[i] = new IntersectionObserver(Vf, { root: t, ...e })), s[i];
 }
 function Df(t, e, n) {
   const s = Ef(e);
@@ -5140,7 +5140,7 @@ class Lf extends Mt {
 function $f({ viewport: t = {} }, { viewport: e = {} } = {}) {
   return (n) => t[n] !== e[n];
 }
-const Of = {
+const Nf = {
   inView: {
     Feature: Lf
   },
@@ -5153,14 +5153,14 @@ const Of = {
   hover: {
     Feature: Mf
   }
-}, Ff = {
+}, Of = {
   layout: {
-    ProjectionNode: Oo,
+    ProjectionNode: No,
     MeasureLayout: Co
   }
-}, $n = { current: null }, Fo = { current: !1 };
-function Nf() {
-  if (Fo.current = !0, !!Wn)
+}, $n = { current: null }, Oo = { current: !1 };
+function Ff() {
+  if (Oo.current = !0, !!Wn)
     if (window.matchMedia) {
       const t = window.matchMedia("(prefers-reduced-motion)"), e = () => $n.current = t.matches;
       t.addListener(e), e();
@@ -5213,7 +5213,7 @@ class Uf {
       this.current && (this.triggerBuild(), this.renderInstance(this.current, this.renderState, this.props.style, this.projection));
     }, this.renderScheduledAt = 0, this.scheduleRender = () => {
       const p = mt.now();
-      this.renderScheduledAt < p && (this.renderScheduledAt = p, N.render(this.render, !1, !0));
+      this.renderScheduledAt < p && (this.renderScheduledAt = p, F.render(this.render, !1, !0));
     };
     const { latestValues: l, renderState: c, onUpdate: u } = r;
     this.onUpdate = u, this.latestValues = l, this.baseTarget = { ...l }, this.initialValues = n.initial ? { ...l } : {}, this.renderState = c, this.parent = e, this.props = n, this.presenceContext = s, this.depth = e ? e.depth + 1 : 0, this.reducedMotionConfig = i, this.options = a, this.blockInitialAnimation = !!o, this.isControllingVariants = Ye(n), this.isVariantNode = hr(n), this.isVariantNode && (this.variantChildren = /* @__PURE__ */ new Set()), this.manuallyAnimateOnMount = !!(e && e.current);
@@ -5224,7 +5224,7 @@ class Uf {
     }
   }
   mount(e) {
-    this.current = e, nr.set(e, this), this.projection && !this.projection.instance && this.projection.mount(e), this.parent && this.isVariantNode && !this.isControllingVariants && (this.removeFromVariantTree = this.parent.addVariantChild(this)), this.values.forEach((n, s) => this.bindToMotionValue(s, n)), Fo.current || Nf(), this.shouldReduceMotion = this.reducedMotionConfig === "never" ? !1 : this.reducedMotionConfig === "always" ? !0 : $n.current, process.env.NODE_ENV !== "production" && Ue(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);
+    this.current = e, nr.set(e, this), this.projection && !this.projection.instance && this.projection.mount(e), this.parent && this.isVariantNode && !this.isControllingVariants && (this.removeFromVariantTree = this.parent.addVariantChild(this)), this.values.forEach((n, s) => this.bindToMotionValue(s, n)), Oo.current || Ff(), this.shouldReduceMotion = this.reducedMotionConfig === "never" ? !1 : this.reducedMotionConfig === "always" ? !0 : $n.current, process.env.NODE_ENV !== "production" && Ue(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() {
     nr.delete(this.current), this.projection && this.projection.unmount(), Tt(this.notifyUpdate), Tt(this.render), this.valueSubscriptions.forEach((e) => e()), this.valueSubscriptions.clear(), this.removeFromVariantTree && this.removeFromVariantTree(), this.parent && this.parent.children.delete(this);
@@ -5239,7 +5239,7 @@ class Uf {
   bindToMotionValue(e, n) {
     this.valueSubscriptions.has(e) && this.valueSubscriptions.get(e)();
     const s = jt.has(e), i = n.on("change", (a) => {
-      this.latestValues[e] = a, this.props.onUpdate && N.preRender(this.notifyUpdate), s && this.projection && (this.projection.isTransformDirty = !0);
+      this.latestValues[e] = a, this.props.onUpdate && F.preRender(this.notifyUpdate), s && this.projection && (this.projection.isTransformDirty = !0);
     }), o = n.on("renderRequest", this.scheduleRender);
     let r;
     window.MotionCheckAppearSync && (r = window.MotionCheckAppearSync(this, e, n)), this.valueSubscriptions.set(e, () => {
@@ -5390,7 +5390,7 @@ class Uf {
     this.events[e] && this.events[e].notify(...n);
   }
 }
-class No extends Uf {
+class Fo extends Uf {
   constructor() {
     super(...arguments), this.KeyframeResolver = oo;
   }
@@ -5414,7 +5414,7 @@ class No extends Uf {
 function Wf(t) {
   return window.getComputedStyle(t);
 }
-class Xf extends No {
+class Xf extends Fo {
   constructor() {
     super(...arguments), this.type = "html", this.renderInstance = wr;
   }
@@ -5437,7 +5437,7 @@ class Xf extends No {
     return ss(e, n, s);
   }
 }
-class Yf extends No {
+class Yf extends Fo {
   constructor() {
     super(...arguments), this.type = "svg", this.isSVGTag = !1, this.measureInstanceViewportBox = z;
   }
@@ -5468,9 +5468,9 @@ const Kf = (t, e) => Zn(t) ? new Yf(e) : new Xf(e, {
   allowProjection: t !== lr
 }), zf = /* @__PURE__ */ xl({
   ...mu,
-  ...Of,
+  ...Nf,
   ...Rf,
-  ...Ff
+  ...Of
 }, Kf), et = /* @__PURE__ */ La(zf);
 function Gf(t, e, n) {
   Ie(() => t.on(e, n), [t, e, n]);
@@ -5486,7 +5486,7 @@ function ut(t) {
 function Bo(t, e) {
   const n = ut(e()), s = () => n.set(e());
   return s(), ge(() => {
-    const i = () => N.preRender(s, !1, !0), o = t.map((r) => r.on("change", i));
+    const i = () => F.preRender(s, !1, !0), o = t.map((r) => r.on("change", i));
     return () => {
       o.forEach((r) => r()), Tt(s);
     };
@@ -5511,7 +5511,7 @@ function xt(t, e = {}) {
   }, l = () => {
     s.current && s.current.stop();
   };
-  return Ie(() => i.attach((c, u) => n ? u(c) : (o.current = c, r.current = u, N.update(a), i.get()), l), [JSON.stringify(e)]), ge(() => {
+  return Ie(() => i.attach((c, u) => n ? u(c) : (o.current = c, r.current = u, F.update(a), i.get()), l), [JSON.stringify(e)]), ge(() => {
     if (J(t))
       return t.on("change", (c) => i.set(ir(c)));
   }, [i]), i;
@@ -5548,28 +5548,28 @@ function rr(t, e) {
 function Jf(t) {
   const e = ut(t.getVelocity()), n = () => {
     const s = t.getVelocity();
-    e.set(s), s && N.update(n);
+    e.set(s), s && F.update(n);
   };
   return Gf(t, "change", () => {
-    N.update(n, !1, !0);
+    F.update(n, !1, !0);
   }), e;
 }
 function td(t) {
   t.values.forEach((e) => e.stop());
 }
-function On(t, e) {
+function Nn(t, e) {
   [...e].reverse().forEach((s) => {
     const i = t.getVariant(s);
     i && fs(t, i), t.variantChildren && t.variantChildren.forEach((o) => {
-      On(o, e);
+      Nn(o, e);
     });
   });
 }
 function ed(t, e) {
   if (Array.isArray(e))
-    return On(t, e);
+    return Nn(t, e);
   if (typeof e == "string")
-    return On(t, [e]);
+    return Nn(t, [e]);
   fs(t, e);
 }
 function nd() {
@@ -5651,10 +5651,9 @@ const id = sd, Ze = (t) => {
       "path",
       {
         d: f,
-        fill: "white",
+        className: "fill-white dark:fill-slate-800 transition-colors duration-300",
         stroke: e,
-        strokeWidth: t.strokeWidth,
-        className: "transition-colors duration-300"
+        strokeWidth: t.strokeWidth
       }
     ) }),
     /* @__PURE__ */ m.jsx("div", { className: "relative z-10 flex items-center h-full px-5 gap-4", children: n })
@@ -5675,10 +5674,9 @@ const id = sd, Ze = (t) => {
             "path",
             {
               d: g,
-              fill: e ? "#6366f1" : "#f1f5f9",
+              className: `transition-all duration-300 ${e ? "fill-indigo-500 dark:fill-indigo-600" : "fill-slate-100 dark:fill-slate-700"}`,
               stroke: e ? "#4f46e5" : "#e2e8f0",
-              strokeWidth: 1.5,
-              className: "transition-all duration-300"
+              strokeWidth: 1.5
             }
           ) }),
           /* @__PURE__ */ m.jsx(
@@ -5695,7 +5693,7 @@ const id = sd, Ze = (t) => {
                 damping: i.damping,
                 mass: i.mass
               },
-              children: /* @__PURE__ */ m.jsx("svg", { viewBox: "0 0 20 20", className: "overflow-visible drop-shadow-sm", children: /* @__PURE__ */ m.jsx("path", { d: S, fill: "white", stroke: e ? "#4f46e5" : "#94a3b8", strokeWidth: 1 }) })
+              children: /* @__PURE__ */ m.jsx("svg", { viewBox: "0 0 20 20", className: "overflow-visible drop-shadow-sm", children: /* @__PURE__ */ m.jsx("path", { d: S, className: "fill-white dark:fill-slate-200", stroke: e ? "#4f46e5" : "#94a3b8", strokeWidth: 1 }) })
             }
           )
         ] })
@@ -5804,7 +5802,7 @@ const Uo = Te("Info", [
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const Fn = Te("X", [
+const On = Te("X", [
   ["path", { d: "M18 6 6 18", key: "1bl5f8" }],
   ["path", { d: "m6 6 12 12", key: "d8bk6v" }]
 ]), hd = ({ isOpen: t, title: e, message: n, onConfirm: s, onCancel: i }) => {
@@ -5856,7 +5854,7 @@ const Fn = Te("X", [
     info: { color: "#3b82f6", icon: Uo, label: "Info Sistem" },
     warning: { color: "#f59e0b", icon: Io, label: "Peringatan" },
     success: { color: "#10b981", icon: _o, label: "Berhasil" },
-    error: { color: "#ef4444", icon: Fn, label: "Kesalahan" }
+    error: { color: "#ef4444", icon: On, label: "Kesalahan" }
   }, c = l[t] || l.info;
   return /* @__PURE__ */ m.jsx(
     et.div,
@@ -5881,7 +5879,7 @@ const Fn = Te("X", [
     info: { color: "#3b82f6", icon: Uo, label: "Info" },
     warning: { color: "#f59e0b", icon: Io, label: "Warning" },
     success: { color: "#10b981", icon: _o, label: "Success" },
-    error: { color: "#ef4444", icon: Fn, label: "Error" }
+    error: { color: "#ef4444", icon: On, label: "Error" }
   }, p = h[i] || h.info;
   return /* @__PURE__ */ m.jsx(
     et.div,
@@ -5908,16 +5906,16 @@ const Fn = Te("X", [
           /* @__PURE__ */ m.jsx("h4", { className: "text-[10px] uppercase tracking-wider font-bold opacity-40 mb-0.5", children: p.label }),
           /* @__PURE__ */ m.jsx("p", { className: "text-sm font-medium text-slate-800 truncate leading-snug", children: o })
         ] }),
-        /* @__PURE__ */ m.jsx("button", { onClick: () => e(s), className: "flex-shrink-0 p-1.5 rounded-md hover:bg-slate-100 opacity-0 group-hover:opacity-100 transition-opacity duration-200", children: /* @__PURE__ */ m.jsx(Fn, { size: 16, className: "text-slate-400" }) })
+        /* @__PURE__ */ m.jsx("button", { onClick: () => e(s), className: "flex-shrink-0 p-1.5 rounded-md hover:bg-slate-100 opacity-0 group-hover:opacity-100 transition-opacity duration-200", children: /* @__PURE__ */ m.jsx(On, { size: 16, className: "text-slate-400" }) })
       ] })
     }
   );
 });
 ld.displayName = "TactileToast";
 const md = ({ title: t, description: e, seed: n }) => {
-  const s = I(() => n || Math.random() * 1e3, [n]), i = 340, o = 220, r = (V) => {
-    const F = Math.sin(s + V) * 1e4;
-    return F - Math.floor(F);
+  const s = I(() => n || Math.random() * 1e3, [n]), i = 340, o = 220, r = (k) => {
+    const O = Math.sin(s + k) * 1e4;
+    return O - Math.floor(O);
   }, a = I(() => ({
     r: {
       tl: 12 + r(1) * 16,
@@ -5931,13 +5929,13 @@ const md = ({ title: t, description: e, seed: n }) => {
     // Adjust stiffness/damping values to fit framer-motion spring behavior
     stiffness: 120 + r(8) * 60,
     damping: 15 + r(9) * 10
-  }), [s]), l = `M ${a.r.tl},0 L ${i - a.r.tr},0 Q ${i},0 ${i},${a.r.tr} L ${i},${o - a.r.br} Q ${i},${o} ${i - a.r.br},${o} L ${a.r.bl},${o} Q 0,${o} 0,${o - a.r.bl} L 0,${a.r.tl} Q 0,0 ${a.r.tl},0 Z`, c = ut(0), u = ut(0), f = ut(0), h = { stiffness: a.stiffness, damping: a.damping, mass: a.mass }, p = xt(c, h), g = xt(u, h), v = xt(f, h), x = B(null), y = (V) => {
+  }), [s]), l = `M ${a.r.tl},0 L ${i - a.r.tr},0 Q ${i},0 ${i},${a.r.tr} L ${i},${o - a.r.br} Q ${i},${o} ${i - a.r.br},${o} L ${a.r.bl},${o} Q 0,${o} 0,${o - a.r.bl} L 0,${a.r.tl} Q 0,0 ${a.r.tl},0 Z`, c = ut(0), u = ut(0), f = ut(0), h = { stiffness: a.stiffness, damping: a.damping, mass: a.mass }, p = xt(c, h), g = xt(u, h), v = xt(f, h), x = B(null), y = (k) => {
     if (!x.current) return;
-    const F = x.current.getBoundingClientRect(), Z = V.clientX - F.left, L = V.clientY - F.top, U = (Z / i - 0.5) * 16, Y = (L / o - 0.5) * -16;
+    const O = x.current.getBoundingClientRect(), Z = k.clientX - O.left, L = k.clientY - O.top, U = (Z / i - 0.5) * 16, Y = (L / o - 0.5) * -16;
     u.set(U), c.set(Y), f.set(15);
   }, P = () => {
     c.set(0), u.set(0), f.set(0);
-  }, S = () => f.set(-5), C = () => f.set(15), w = yt(g, (V) => a.shadowX + V * 0.5), A = yt(p, (V) => 6 + V * -0.5), b = yt(v, (V) => 1 + V * 2e-3), R = yt(v, (V) => 0.06 + V * 4e-3), D = Math.floor(s).toString(16).toUpperCase();
+  }, S = () => f.set(-5), C = () => f.set(15), w = yt(g, (k) => a.shadowX + k * 0.5), A = yt(p, (k) => 6 + k * -0.5), b = yt(v, (k) => 1 + k * 2e-3), R = yt(v, (k) => 0.06 + k * 4e-3), D = Math.floor(s).toString(16).toUpperCase();
   return /* @__PURE__ */ m.jsxs(
     "div",
     {
@@ -5974,7 +5972,7 @@ const md = ({ title: t, description: e, seed: n }) => {
               transformStyle: "preserve-3d"
             },
             children: [
-              /* @__PURE__ */ m.jsx("svg", { viewBox: `0 0 ${i} ${o}`, className: "w-full h-full block", children: /* @__PURE__ */ m.jsx("path", { d: l, fill: "white", stroke: "#e2e8f0", strokeWidth: a.stroke, className: "transition-colors group-hover:fill-slate-50/80" }) }),
+              /* @__PURE__ */ m.jsx("svg", { viewBox: `0 0 ${i} ${o}`, className: "w-full h-full block", children: /* @__PURE__ */ m.jsx("path", { d: l, className: "fill-white dark:fill-slate-800 transition-colors group-hover:fill-slate-50/80 dark:group-hover:fill-slate-700/80", stroke: "#e2e8f0", strokeWidth: a.stroke }) }),
               /* @__PURE__ */ m.jsxs("div", { className: "absolute inset-0 p-8 flex flex-col pointer-events-none", children: [
                 /* @__PURE__ */ m.jsxs("div", { className: "flex items-center gap-3 mb-4", children: [
                   /* @__PURE__ */ m.jsx("div", { className: "w-2.5 h-2.5 rounded-full bg-slate-200 group-hover:bg-indigo-400 transition-colors" }),
@@ -5983,14 +5981,14 @@ const md = ({ title: t, description: e, seed: n }) => {
                     Math.floor(s)
                   ] })
                 ] }),
-                /* @__PURE__ */ m.jsx("h3", { className: "text-[13px] font-bold text-slate-800 leading-tight mb-2", children: t }),
-                /* @__PURE__ */ m.jsx("p", { className: "text-[11px] text-slate-500 leading-relaxed font-medium", children: e }),
-                /* @__PURE__ */ m.jsxs("div", { className: "mt-auto pt-4 border-t border-slate-100 flex justify-between items-center opacity-30 group-hover:opacity-60 transition-opacity", children: [
-                  /* @__PURE__ */ m.jsxs("span", { className: "text-[9px] font-mono", children: [
+                /* @__PURE__ */ m.jsx("h3", { className: "text-[13px] font-bold text-slate-800 dark:text-slate-100 leading-tight mb-2", children: t }),
+                /* @__PURE__ */ m.jsx("p", { className: "text-[11px] text-slate-500 dark:text-slate-400 leading-relaxed font-medium", children: e }),
+                /* @__PURE__ */ m.jsxs("div", { className: "mt-auto pt-4 border-t border-slate-100 dark:border-slate-700/50 flex justify-between items-center opacity-30 group-hover:opacity-60 transition-opacity", children: [
+                  /* @__PURE__ */ m.jsxs("span", { className: "text-[9px] font-mono text-slate-800 dark:text-slate-300", children: [
                     "ID: 0x",
                     D
                   ] }),
-                  /* @__PURE__ */ m.jsxs("svg", { width: "12", height: "12", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "3", strokeLinecap: "round", strokeLinejoin: "round", children: [
+                  /* @__PURE__ */ m.jsxs("svg", { width: "12", height: "12", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", className: "text-slate-800 dark:text-slate-300", strokeWidth: "3", strokeLinecap: "round", strokeLinejoin: "round", children: [
                     /* @__PURE__ */ m.jsx("line", { x1: "5", y1: "12", x2: "19", y2: "12" }),
                     /* @__PURE__ */ m.jsx("polyline", { points: "12 5 19 12 12 19" })
                   ] })
@@ -6003,9 +6001,9 @@ const md = ({ title: t, description: e, seed: n }) => {
     }
   );
 }, gd = ({ label: t, color: e = "#64748b", onClick: n, className: s = "" }) => {
-  const i = I(() => Math.random() * 1e3, []), o = 140, r = 54, a = (V) => {
-    const F = Math.sin(i + V) * 1e4;
-    return F - Math.floor(F);
+  const i = I(() => Math.random() * 1e3, []), o = 140, r = 54, a = (k) => {
+    const O = Math.sin(i + k) * 1e4;
+    return O - Math.floor(O);
   }, l = I(() => ({
     r: {
       tl: 6 + a(1) * 14,
@@ -6020,13 +6018,13 @@ const md = ({ title: t, description: e, seed: n }) => {
     // Adjusted for Framer Motion
     damping: 20 + a(9) * 10
     // Adjusted for Framer Motion
-  }), [i]), c = `M ${l.r.tl},0 L ${o - l.r.tr},0 Q ${o},0 ${o},${l.r.tr} L ${o},${r - l.r.br} Q ${o},${r} ${o - l.r.br},${r} L ${l.r.bl},${r} Q 0,${r} 0,${r - l.r.bl} L 0,${l.r.tl} Q 0,0 ${l.r.tl},0 Z`, u = ut(0), f = ut(0), h = ut(1), p = { stiffness: l.stiffness, damping: l.damping, mass: l.mass }, g = { stiffness: l.stiffness * 2, damping: l.damping, mass: l.mass }, v = xt(u, p), x = xt(f, p), y = xt(h, g), P = B(null), S = (V) => {
+  }), [i]), c = `M ${l.r.tl},0 L ${o - l.r.tr},0 Q ${o},0 ${o},${l.r.tr} L ${o},${r - l.r.br} Q ${o},${r} ${o - l.r.br},${r} L ${l.r.bl},${r} Q 0,${r} 0,${r - l.r.bl} L 0,${l.r.tl} Q 0,0 ${l.r.tl},0 Z`, u = ut(0), f = ut(0), h = ut(1), p = { stiffness: l.stiffness, damping: l.damping, mass: l.mass }, g = { stiffness: l.stiffness * 2, damping: l.damping, mass: l.mass }, v = xt(u, p), x = xt(f, p), y = xt(h, g), P = B(null), S = (k) => {
     if (!P.current) return;
-    const F = P.current.getBoundingClientRect(), Z = V.clientX - F.left, L = V.clientY - F.top, U = (Z / o - 0.5) * 25, Y = (L / r - 0.5) * -25;
+    const O = P.current.getBoundingClientRect(), Z = k.clientX - O.left, L = k.clientY - O.top, U = (Z / o - 0.5) * 25, Y = (L / r - 0.5) * -25;
     f.set(U), u.set(Y);
   }, C = () => {
     u.set(0), f.set(0), h.set(1);
-  }, w = () => h.set(0.94), A = () => h.set(1), b = yt(x, (V) => V * 0.2), R = yt(v, (V) => l.shadowY + V * -0.2), D = yt(y, (V) => 0.1 - (1 - V));
+  }, w = () => h.set(0.94), A = () => h.set(1), b = yt(x, (k) => k * 0.2), R = yt(v, (k) => l.shadowY + k * -0.2), D = yt(y, (k) => 0.1 - (1 - k));
   return /* @__PURE__ */ m.jsxs(
     "div",
     {
@@ -6067,10 +6065,9 @@ const md = ({ title: t, description: e, seed: n }) => {
                 "path",
                 {
                   d: c,
-                  fill: "white",
+                  className: "fill-white dark:fill-slate-800 transition-colors duration-300 group-hover:fill-slate-50 dark:group-hover:fill-slate-700",
                   stroke: e,
-                  strokeWidth: l.stroke,
-                  className: "transition-colors duration-300 group-hover:fill-slate-50"
+                  strokeWidth: l.stroke
                 }
               ) }),
               /* @__PURE__ */ m.jsx("div", { className: "absolute inset-0 flex items-center justify-center pointer-events-none", children: /* @__PURE__ */ m.jsx("span", { className: "text-[10px] font-black uppercase tracking-[0.2em]", style: { color: e }, children: t }) })
@@ -6117,7 +6114,7 @@ const md = ({ title: t, description: e, seed: n }) => {
     L.target.setPointerCapture(L.pointerId), b(L.clientX);
   }, D = (L) => {
     L.target.hasPointerCapture(L.pointerId) && b(L.clientX);
-  }, V = yt(w, (L) => `inset(0 ${a - L}px 0 0)`), F = Jf(w), Z = yt(F, (L) => 1 + Math.abs(L) * 5e-4);
+  }, k = yt(w, (L) => `inset(0 ${a - L}px 0 0)`), O = Jf(w), Z = yt(O, (L) => 1 + Math.abs(L) * 5e-4);
   return /* @__PURE__ */ m.jsxs("div", { className: `w-full max-w-[400px] mb-12 relative px-4 ${o}`, children: [
     /* @__PURE__ */ m.jsxs("div", { className: "flex justify-between items-center mb-4", children: [
       /* @__PURE__ */ m.jsx("span", { className: "text-[10px] font-black uppercase tracking-widest text-slate-400", children: t }),
@@ -6135,7 +6132,7 @@ const md = ({ title: t, description: e, seed: n }) => {
         onPointerDown: R,
         onPointerMove: D,
         children: [
-          /* @__PURE__ */ m.jsx("svg", { width: a, height: l, viewBox: `0 0 ${a} ${l}`, className: "overflow-visible absolute inset-0 pointer-events-none", children: /* @__PURE__ */ m.jsx("path", { d: v, fill: "#f1f5f9", stroke: "#e2e8f0", strokeWidth: g.strokeWidth }) }),
+          /* @__PURE__ */ m.jsx("svg", { width: a, height: l, viewBox: `0 0 ${a} ${l}`, className: "overflow-visible absolute inset-0 pointer-events-none", children: /* @__PURE__ */ m.jsx("path", { d: v, className: "fill-slate-100 dark:fill-slate-700", stroke: "#e2e8f0", strokeWidth: g.strokeWidth }) }),
           /* @__PURE__ */ m.jsx(
             et.svg,
             {
@@ -6143,8 +6140,8 @@ const md = ({ title: t, description: e, seed: n }) => {
               height: l,
               viewBox: `0 0 ${a} ${l}`,
               className: "overflow-visible absolute inset-0 pointer-events-none",
-              style: { clipPath: V },
-              children: /* @__PURE__ */ m.jsx("path", { d: v, fill: "#6366f1" })
+              style: { clipPath: k },
+              children: /* @__PURE__ */ m.jsx("path", { d: v, className: "fill-indigo-500 dark:fill-indigo-600" })
             }
           ),
           /* @__PURE__ */ m.jsx(
@@ -6159,7 +6156,7 @@ const md = ({ title: t, description: e, seed: n }) => {
                 scaleX: Z,
                 originX: 0.5
               },
-              children: /* @__PURE__ */ m.jsx("svg", { viewBox: `0 0 ${c} ${c}`, className: "overflow-visible drop-shadow-md", children: /* @__PURE__ */ m.jsx("path", { d: x, fill: "white", stroke: "#4f46e5", strokeWidth: "1.5" }) })
+              children: /* @__PURE__ */ m.jsx("svg", { viewBox: `0 0 ${c} ${c}`, className: "overflow-visible drop-shadow-md", children: /* @__PURE__ */ m.jsx("path", { d: x, className: "fill-white dark:fill-slate-200", stroke: "#4f46e5", strokeWidth: "1.5" }) })
             }
           )
         ]
@@ -6203,8 +6200,8 @@ const md = ({ title: t, description: e, seed: n }) => {
     let w;
     const A = () => {
       if (!a.current || !r.current) return;
-      const b = l.current, { mass: R, stiffness: D, damping: V, elasticity: F } = g, Z = Math.sin(Date.now() * 2e-3) * 0.02, L = (b.targetVelocity + Z - b.angularVelocity) * F;
-      b.angularVelocity += L / R, b.angularVelocity *= b.friction, b.angle += b.angularVelocity, b.velocityRotateX += (b.targetRotateX - b.currentRotateX) * D / R, b.velocityRotateX *= V, b.currentRotateX += b.velocityRotateX, b.velocityRotateY += (b.targetRotateY - b.currentRotateY) * D / R, b.velocityRotateY *= V, b.currentRotateY += b.velocityRotateY, b.velocityTranslateZ += (b.targetTranslateZ - b.currentTranslateZ) * D / R, b.velocityTranslateZ *= V, b.currentTranslateZ += b.velocityTranslateZ;
+      const b = l.current, { mass: R, stiffness: D, damping: k, elasticity: O } = g, Z = Math.sin(Date.now() * 2e-3) * 0.02, L = (b.targetVelocity + Z - b.angularVelocity) * O;
+      b.angularVelocity += L / R, b.angularVelocity *= b.friction, b.angle += b.angularVelocity, b.velocityRotateX += (b.targetRotateX - b.currentRotateX) * D / R, b.velocityRotateX *= k, b.currentRotateX += b.velocityRotateX, b.velocityRotateY += (b.targetRotateY - b.currentRotateY) * D / R, b.velocityRotateY *= k, b.currentRotateY += b.velocityRotateY, b.velocityTranslateZ += (b.targetTranslateZ - b.currentTranslateZ) * D / R, b.velocityTranslateZ *= k, b.currentTranslateZ += b.velocityTranslateZ;
       const U = b.angularVelocity * 150, Y = x + U;
       a.current.style.strokeDasharray = `${Y} ${v - Y}`;
       const Pt = b.angle * 180 / Math.PI;
@@ -6309,12 +6306,12 @@ const md = ({ title: t, description: e, seed: n }) => {
     }), s)) {
       const R = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789!@#$%^&*()_+-=[]{}|;:,.<>?";
       let D = 0;
-      const V = 8;
+      const k = 8;
       g.current && clearInterval(g.current), g.current = setInterval(() => {
-        let F = "";
+        let O = "";
         for (let Z = 0; Z < s.length; Z++)
-          F += R.charAt(Math.floor(Math.random() * R.length));
-        h(F), D++, D >= V && (clearInterval(g.current), g.current = null, h(s));
+          O += R.charAt(Math.floor(Math.random() * R.length));
+        h(O), D++, D >= k && (clearInterval(g.current), g.current = null, h(s));
       }, 50);
     }
     v.current = n;
@@ -6431,8 +6428,8 @@ const md = ({ title: t, description: e, seed: n }) => {
   dt(() => {
     let w;
     const A = () => {
-      const b = c.current, { mass: R, stiffness: D, damping: V } = p, F = (b.targetX - b.currentX) * D;
-      b.velocity += F / R, b.velocity *= V, b.currentX += b.velocity, b.velocityRX += (b.targetRotateX - b.currentRotateX) * D / R, b.velocityRX *= V, b.currentRotateX += b.velocityRX, b.velocityRY += (b.targetRotateY - b.currentRotateY) * D / R, b.velocityRY *= V, b.currentRotateY += b.velocityRY, b.velocityZ += (b.targetZ - b.currentZ) * D / R, b.velocityZ *= V, b.currentZ += b.velocityZ;
+      const b = c.current, { mass: R, stiffness: D, damping: k } = p, O = (b.targetX - b.currentX) * D;
+      b.velocity += O / R, b.velocity *= k, b.currentX += b.velocity, b.velocityRX += (b.targetRotateX - b.currentRotateX) * D / R, b.velocityRX *= k, b.currentRotateX += b.velocityRX, b.velocityRY += (b.targetRotateY - b.currentRotateY) * D / R, b.velocityRY *= k, b.currentRotateY += b.velocityRY, b.velocityZ += (b.targetZ - b.currentZ) * D / R, b.velocityZ *= k, b.currentZ += b.velocityZ;
       const Z = 1 + Math.abs(b.velocity) * 0.04;
       u.knob.current && (u.knob.current.style.left = `${Math.floor(b.currentX)}px`, u.knob.current.style.transform = `scaleX(${Z})`), u.kineticBody.current && (u.kineticBody.current.style.transform = `
                     rotateX(${b.currentRotateX}deg)