@telegraph/tag 0.0.90 → 0.0.92

package/dist/esm/index.mjs

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