@telegraph/combobox 0.0.88 → 0.0.89

package/dist/esm/index.mjs

@@ -1,113 +1,3374 @@
-import { jsx as s, jsxs as w, Fragment as _ } from "react/jsx-runtime";
-import { DismissableLayer as ee } from "@radix-ui/react-dismissable-layer";
-import * as te from "@radix-ui/react-portal";
-import { useControllableState as oe } from "@radix-ui/react-use-controllable-state";
-import * as re from "@radix-ui/react-visually-hidden";
-import { Button as O } from "@telegraph/button";
-import { useComposedRefs as $ } from "@telegraph/compose-refs";
-import { RefToTgphRef as ne } from "@telegraph/helpers";
-import { Lucide as E, Icon as z } from "@telegraph/icon";
-import { Input as ae } from "@telegraph/input";
-import { Stack as k, Box as G } from "@telegraph/layout";
-import { Menu as Q } from "@telegraph/menu";
-import { Text as H } from "@telegraph/typography";
-import l from "react";
-import { motion as P, AnimatePresence as M } from "@telegraph/motion";
-import { Tag as K } from "@telegraph/tag";
-import { Tooltip as ie } from "@telegraph/tooltip";
-import { TooltipIfTruncated as Y } from "@telegraph/truncate";
-const ce = {
+import { jsx as w, jsxs as G, Fragment as zt } from "react/jsx-runtime";
+import { DismissableLayer as Qs } from "@radix-ui/react-dismissable-layer";
+import * as Zs from "@radix-ui/react-portal";
+import { useControllableState as Js } from "@radix-ui/react-use-controllable-state";
+import * as er from "@radix-ui/react-visually-hidden";
+import { Button as ae } from "@telegraph/button";
+import { useComposedRefs as An } from "@telegraph/compose-refs";
+import { RefToTgphRef as tr } from "@telegraph/helpers";
+import { Icon as Mn } from "@telegraph/icon";
+import { Input as nr } from "@telegraph/input";
+import { Stack as ie, Box as Pn } from "@telegraph/layout";
+import { Menu as Be } from "@telegraph/menu";
+import { Text as gt } from "@telegraph/typography";
+import { ChevronDown as sr, X as yt, Search as Rn, Plus as rr } from "lucide-react";
+import b, { createContext as ce, useRef as ye, useLayoutEffect as ir, useEffect as bt, useState as or, useContext as B, useMemo as Le, useCallback as ar, useInsertionEffect as cr, forwardRef as ur, Fragment as Fn, createElement as lr } from "react";
+import { Tag as vt } from "@telegraph/tag";
+import { Tooltip as fr } from "@telegraph/tooltip";
+import { TooltipIfTruncated as Dn } from "@telegraph/truncate";
+const dr = ce({});
+function hr(e) {
+  const t = ye(null);
+  return t.current === null && (t.current = e()), t.current;
+}
+const Tt = typeof window < "u", pr = Tt ? ir : bt, On = /* @__PURE__ */ ce(null);
+function mr(e, t) {
+  e.indexOf(t) === -1 && e.push(t);
+}
+function gr(e, t) {
+  const n = e.indexOf(t);
+  n > -1 && e.splice(n, 1);
+}
+const J = (e, t, n) => n > t ? t : n < e ? e : n;
+let ue = () => {
+}, U = () => {
+};
+process.env.NODE_ENV !== "production" && (ue = (e, t) => {
+  !e && typeof console < "u" && console.warn(t);
+}, U = (e, t) => {
+  if (!e)
+    throw new Error(t);
+});
+const j = {}, En = (e) => /^-?(?:\d+(?:\.\d+)?|\.\d+)$/u.test(e);
+function yr(e) {
+  return typeof e == "object" && e !== null;
+}
+const In = (e) => /^0[^.\s]+$/u.test(e);
+// @__NO_SIDE_EFFECTS__
+function wt(e) {
+  let t;
+  return () => (t === void 0 && (t = e()), t);
+}
+const le = /* @__NO_SIDE_EFFECTS__ */ (e) => e, br = (e, t) => (n) => t(e(n)), Ne = (...e) => e.reduce(br), kn = /* @__NO_SIDE_EFFECTS__ */ (e, t, n) => {
+  const s = t - e;
+  return s === 0 ? 1 : (n - e) / s;
+};
+class Bn {
+  constructor() {
+    this.subscriptions = [];
+  }
+  add(t) {
+    return mr(this.subscriptions, t), () => gr(this.subscriptions, t);
+  }
+  notify(t, n, s) {
+    const r = this.subscriptions.length;
+    if (r)
+      if (r === 1)
+        this.subscriptions[0](t, n, s);
+      else
+        for (let i = 0; i < r; i++) {
+          const o = this.subscriptions[i];
+          o && o(t, n, s);
+        }
+  }
+  getSize() {
+    return this.subscriptions.length;
+  }
+  clear() {
+    this.subscriptions.length = 0;
+  }
+}
+const N = /* @__NO_SIDE_EFFECTS__ */ (e) => e * 1e3, $ = /* @__NO_SIDE_EFFECTS__ */ (e) => e / 1e3;
+function Ln(e, t) {
+  return t ? e * (1e3 / t) : 0;
+}
+const Yt = /* @__PURE__ */ new Set();
+function Nn(e, t, n) {
+  e || Yt.has(t) || (console.warn(t), Yt.add(t));
+}
+const Kn = (e, t, n) => (((1 - 3 * n + 3 * t) * e + (3 * n - 6 * t)) * e + 3 * t) * e, vr = 1e-7, Tr = 12;
+function wr(e, t, n, s, r) {
+  let i, o, a = 0;
+  do
+    o = t + (n - t) / 2, i = Kn(o, s, r) - e, i > 0 ? n = o : t = o;
+  while (Math.abs(i) > vr && ++a < Tr);
+  return o;
+}
+function Se(e, t, n, s) {
+  if (e === t && n === s)
+    return le;
+  const r = (i) => wr(i, 0, 1, e, n);
+  return (i) => i === 0 || i === 1 ? i : Kn(r(i), t, s);
+}
+const $n = (e) => (t) => t <= 0.5 ? e(2 * t) / 2 : (2 - e(2 * (1 - t))) / 2, jn = (e) => (t) => 1 - e(1 - t), Wn = /* @__PURE__ */ Se(0.33, 1.53, 0.69, 0.99), xt = /* @__PURE__ */ jn(Wn), _n = /* @__PURE__ */ $n(xt), Hn = (e) => (e *= 2) < 1 ? 0.5 * xt(e) : 0.5 * (2 - Math.pow(2, -10 * (e - 1))), St = (e) => 1 - Math.sin(Math.acos(e)), xr = jn(St), Gn = $n(St), Sr = /* @__PURE__ */ Se(0.42, 0, 1, 1), Vr = /* @__PURE__ */ Se(0, 0, 0.58, 1), Un = /* @__PURE__ */ Se(0.42, 0, 0.58, 1), Cr = (e) => Array.isArray(e) && typeof e[0] != "number", zn = (e) => Array.isArray(e) && typeof e[0] == "number", qt = {
+  linear: le,
+  easeIn: Sr,
+  easeInOut: Un,
+  easeOut: Vr,
+  circIn: St,
+  circInOut: Gn,
+  circOut: xr,
+  backIn: xt,
+  backInOut: _n,
+  backOut: Wn,
+  anticipate: Hn
+}, Ar = (e) => typeof e == "string", Xt = (e) => {
+  if (zn(e)) {
+    U(e.length === 4, "Cubic bezier arrays must contain four numerical values.");
+    const [t, n, s, r] = e;
+    return Se(t, n, s, r);
+  } else if (Ar(e))
+    return U(qt[e] !== void 0, `Invalid easing type '${e}'`), qt[e];
+  return e;
+}, Ce = [
+  "setup",
+  // Compute
+  "read",
+  // Read
+  "resolveKeyframes",
+  // Write/Read/Write/Read
+  "preUpdate",
+  // Compute
+  "update",
+  // Compute
+  "preRender",
+  // Compute
+  "render",
+  // Write
+  "postRender"
+  // Compute
+];
+function Mr(e, t) {
+  let n = /* @__PURE__ */ new Set(), s = /* @__PURE__ */ new Set(), r = !1, i = !1;
+  const o = /* @__PURE__ */ new WeakSet();
+  let a = {
+    delta: 0,
+    timestamp: 0,
+    isProcessing: !1
+  };
+  function u(c) {
+    o.has(c) && (l.schedule(c), e()), c(a);
+  }
+  const l = {
+    /**
+     * Schedule a process to run on the next frame.
+     */
+    schedule: (c, d = !1, f = !1) => {
+      const m = f && r ? n : s;
+      return d && o.add(c), m.has(c) || m.add(c), c;
+    },
+    /**
+     * Cancel the provided callback from running on the next frame.
+     */
+    cancel: (c) => {
+      s.delete(c), o.delete(c);
+    },
+    /**
+     * Execute all schedule callbacks.
+     */
+    process: (c) => {
+      if (a = c, r) {
+        i = !0;
+        return;
+      }
+      r = !0, [n, s] = [s, n], n.forEach(u), n.clear(), r = !1, i && (i = !1, l.process(c));
+    }
+  };
+  return l;
+}
+const Pr = 40;
+function Yn(e, t) {
+  let n = !1, s = !0;
+  const r = {
+    delta: 0,
+    timestamp: 0,
+    isProcessing: !1
+  }, i = () => n = !0, o = Ce.reduce((v, A) => (v[A] = Mr(i), v), {}), { setup: a, read: u, resolveKeyframes: l, preUpdate: c, update: d, preRender: f, render: h, postRender: m } = o, g = () => {
+    const v = j.useManualTiming ? r.timestamp : performance.now();
+    n = !1, j.useManualTiming || (r.delta = s ? 1e3 / 60 : Math.max(Math.min(v - r.timestamp, Pr), 1)), r.timestamp = v, r.isProcessing = !0, a.process(r), u.process(r), l.process(r), c.process(r), d.process(r), f.process(r), h.process(r), m.process(r), r.isProcessing = !1, n && t && (s = !1, e(g));
+  }, y = () => {
+    n = !0, s = !0, r.isProcessing || e(g);
+  };
+  return { schedule: Ce.reduce((v, A) => {
+    const S = o[A];
+    return v[A] = (C, M = !1, V = !1) => (n || y(), S.schedule(C, M, V)), v;
+  }, {}), cancel: (v) => {
+    for (let A = 0; A < Ce.length; A++)
+      o[Ce[A]].cancel(v);
+  }, state: r, steps: o };
+}
+const { schedule: L, cancel: Qe, state: Fe, steps: $c } = /* @__PURE__ */ Yn(typeof requestAnimationFrame < "u" ? requestAnimationFrame : le, !0);
+let Me;
+function Rr() {
+  Me = void 0;
+}
+const k = {
+  now: () => (Me === void 0 && k.set(Fe.isProcessing || j.useManualTiming ? Fe.timestamp : performance.now()), Me),
+  set: (e) => {
+    Me = e, queueMicrotask(Rr);
+  }
+}, qn = (e) => (t) => typeof t == "string" && t.startsWith(e), Xn = /* @__PURE__ */ qn("--"), Fr = /* @__PURE__ */ qn("var(--"), Vt = (e) => Fr(e) ? Dr.test(e.split("/*")[0].trim()) : !1, Dr = /var\(--(?:[\w-]+\s*|[\w-]+\s*,(?:\s*[^)(\s]|\s*\((?:[^)(]|\([^)(]*\))*\))+\s*)\)$/iu, fe = {
+  test: (e) => typeof e == "number",
+  parse: parseFloat,
+  transform: (e) => e
+}, ve = {
+  ...fe,
+  transform: (e) => J(0, 1, e)
+}, Ae = {
+  ...fe,
+  default: 1
+}, be = (e) => Math.round(e * 1e5) / 1e5, Ct = /-?(?:\d+(?:\.\d+)?|\.\d+)/gu;
+function Or(e) {
+  return e == null;
+}
+const Er = /^(?:#[\da-f]{3,8}|(?:rgb|hsl)a?\((?:-?[\d.]+%?[,\s]+){2}-?[\d.]+%?\s*(?:[,/]\s*)?(?:\b\d+(?:\.\d+)?|\.\d+)?%?\))$/iu, At = (e, t) => (n) => !!(typeof n == "string" && Er.test(n) && n.startsWith(e) || t && !Or(n) && Object.prototype.hasOwnProperty.call(n, t)), Qn = (e, t, n) => (s) => {
+  if (typeof s != "string")
+    return s;
+  const [r, i, o, a] = s.match(Ct);
+  return {
+    [e]: parseFloat(r),
+    [t]: parseFloat(i),
+    [n]: parseFloat(o),
+    alpha: a !== void 0 ? parseFloat(a) : 1
+  };
+}, Ir = (e) => J(0, 255, e), Ge = {
+  ...fe,
+  transform: (e) => Math.round(Ir(e))
+}, q = {
+  test: /* @__PURE__ */ At("rgb", "red"),
+  parse: /* @__PURE__ */ Qn("red", "green", "blue"),
+  transform: ({ red: e, green: t, blue: n, alpha: s = 1 }) => "rgba(" + Ge.transform(e) + ", " + Ge.transform(t) + ", " + Ge.transform(n) + ", " + be(ve.transform(s)) + ")"
+};
+function kr(e) {
+  let t = "", n = "", s = "", r = "";
+  return e.length > 5 ? (t = e.substring(1, 3), n = e.substring(3, 5), s = e.substring(5, 7), r = e.substring(7, 9)) : (t = e.substring(1, 2), n = e.substring(2, 3), s = e.substring(3, 4), r = e.substring(4, 5), t += t, n += n, s += s, r += r), {
+    red: parseInt(t, 16),
+    green: parseInt(n, 16),
+    blue: parseInt(s, 16),
+    alpha: r ? parseInt(r, 16) / 255 : 1
+  };
+}
+const Ze = {
+  test: /* @__PURE__ */ At("#"),
+  parse: kr,
+  transform: q.transform
+}, Ve = /* @__NO_SIDE_EFFECTS__ */ (e) => ({
+  test: (t) => typeof t == "string" && t.endsWith(e) && t.split(" ").length === 1,
+  parse: parseFloat,
+  transform: (t) => `${t}${e}`
+}), W = /* @__PURE__ */ Ve("deg"), re = /* @__PURE__ */ Ve("%"), T = /* @__PURE__ */ Ve("px"), Br = /* @__PURE__ */ Ve("vh"), Lr = /* @__PURE__ */ Ve("vw"), Qt = {
+  ...re,
+  parse: (e) => re.parse(e) / 100,
+  transform: (e) => re.transform(e * 100)
+}, ne = {
+  test: /* @__PURE__ */ At("hsl", "hue"),
+  parse: /* @__PURE__ */ Qn("hue", "saturation", "lightness"),
+  transform: ({ hue: e, saturation: t, lightness: n, alpha: s = 1 }) => "hsla(" + Math.round(e) + ", " + re.transform(be(t)) + ", " + re.transform(be(n)) + ", " + be(ve.transform(s)) + ")"
+}, R = {
+  test: (e) => q.test(e) || Ze.test(e) || ne.test(e),
+  parse: (e) => q.test(e) ? q.parse(e) : ne.test(e) ? ne.parse(e) : Ze.parse(e),
+  transform: (e) => typeof e == "string" ? e : e.hasOwnProperty("red") ? q.transform(e) : ne.transform(e),
+  getAnimatableNone: (e) => {
+    const t = R.parse(e);
+    return t.alpha = 0, R.transform(t);
+  }
+}, Nr = /(?:#[\da-f]{3,8}|(?:rgb|hsl)a?\((?:-?[\d.]+%?[,\s]+){2}-?[\d.]+%?\s*(?:[,/]\s*)?(?:\b\d+(?:\.\d+)?|\.\d+)?%?\))/giu;
+function Kr(e) {
+  var t, n;
+  return isNaN(e) && typeof e == "string" && (((t = e.match(Ct)) == null ? void 0 : t.length) || 0) + (((n = e.match(Nr)) == null ? void 0 : n.length) || 0) > 0;
+}
+const Zn = "number", Jn = "color", $r = "var", jr = "var(", Zt = "${}", Wr = /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 Te(e) {
+  const t = e.toString(), n = [], s = {
+    color: [],
+    number: [],
+    var: []
+  }, r = [];
+  let i = 0;
+  const a = t.replace(Wr, (u) => (R.test(u) ? (s.color.push(i), r.push(Jn), n.push(R.parse(u))) : u.startsWith(jr) ? (s.var.push(i), r.push($r), n.push(u)) : (s.number.push(i), r.push(Zn), n.push(parseFloat(u))), ++i, Zt)).split(Zt);
+  return { values: n, split: a, indexes: s, types: r };
+}
+function es(e) {
+  return Te(e).values;
+}
+function ts(e) {
+  const { split: t, types: n } = Te(e), s = t.length;
+  return (r) => {
+    let i = "";
+    for (let o = 0; o < s; o++)
+      if (i += t[o], r[o] !== void 0) {
+        const a = n[o];
+        a === Zn ? i += be(r[o]) : a === Jn ? i += R.transform(r[o]) : i += r[o];
+      }
+    return i;
+  };
+}
+const _r = (e) => typeof e == "number" ? 0 : R.test(e) ? R.getAnimatableNone(e) : e;
+function Hr(e) {
+  const t = es(e);
+  return ts(e)(t.map(_r));
+}
+const de = {
+  test: Kr,
+  parse: es,
+  createTransformer: ts,
+  getAnimatableNone: Hr
+};
+function Ue(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 Gr({ hue: e, saturation: t, lightness: n, alpha: s }) {
+  e /= 360, t /= 100, n /= 100;
+  let r = 0, i = 0, o = 0;
+  if (!t)
+    r = i = o = n;
+  else {
+    const a = n < 0.5 ? n * (1 + t) : n + t - n * t, u = 2 * n - a;
+    r = Ue(u, a, e + 1 / 3), i = Ue(u, a, e), o = Ue(u, a, e - 1 / 3);
+  }
+  return {
+    red: Math.round(r * 255),
+    green: Math.round(i * 255),
+    blue: Math.round(o * 255),
+    alpha: s
+  };
+}
+function De(e, t) {
+  return (n) => n > 0 ? t : e;
+}
+const Ke = (e, t, n) => e + (t - e) * n, ze = (e, t, n) => {
+  const s = e * e, r = n * (t * t - s) + s;
+  return r < 0 ? 0 : Math.sqrt(r);
+}, Ur = [Ze, q, ne], zr = (e) => Ur.find((t) => t.test(e));
+function Jt(e) {
+  const t = zr(e);
+  if (ue(!!t, `'${e}' is not an animatable color. Use the equivalent color code instead.`), !t)
+    return !1;
+  let n = t.parse(e);
+  return t === ne && (n = Gr(n)), n;
+}
+const en = (e, t) => {
+  const n = Jt(e), s = Jt(t);
+  if (!n || !s)
+    return De(e, t);
+  const r = { ...n };
+  return (i) => (r.red = ze(n.red, s.red, i), r.green = ze(n.green, s.green, i), r.blue = ze(n.blue, s.blue, i), r.alpha = Ke(n.alpha, s.alpha, i), q.transform(r));
+}, Je = /* @__PURE__ */ new Set(["none", "hidden"]);
+function Yr(e, t) {
+  return Je.has(e) ? (n) => n <= 0 ? e : t : (n) => n >= 1 ? t : e;
+}
+function qr(e, t) {
+  return (n) => Ke(e, t, n);
+}
+function Mt(e) {
+  return typeof e == "number" ? qr : typeof e == "string" ? Vt(e) ? De : R.test(e) ? en : Zr : Array.isArray(e) ? ns : typeof e == "object" ? R.test(e) ? en : Xr : De;
+}
+function ns(e, t) {
+  const n = [...e], s = n.length, r = e.map((i, o) => Mt(i)(i, t[o]));
+  return (i) => {
+    for (let o = 0; o < s; o++)
+      n[o] = r[o](i);
+    return n;
+  };
+}
+function Xr(e, t) {
+  const n = { ...e, ...t }, s = {};
+  for (const r in n)
+    e[r] !== void 0 && t[r] !== void 0 && (s[r] = Mt(e[r])(e[r], t[r]));
+  return (r) => {
+    for (const i in s)
+      n[i] = s[i](r);
+    return n;
+  };
+}
+function Qr(e, t) {
+  const n = [], s = { color: 0, var: 0, number: 0 };
+  for (let r = 0; r < t.values.length; r++) {
+    const i = t.types[r], o = e.indexes[i][s[i]], a = e.values[o] ?? 0;
+    n[r] = a, s[i]++;
+  }
+  return n;
+}
+const Zr = (e, t) => {
+  const n = de.createTransformer(t), s = Te(e), r = Te(t);
+  return s.indexes.var.length === r.indexes.var.length && s.indexes.color.length === r.indexes.color.length && s.indexes.number.length >= r.indexes.number.length ? Je.has(e) && !r.values.length || Je.has(t) && !s.values.length ? Yr(e, t) : Ne(ns(Qr(s, r), r.values), n) : (ue(!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.`), De(e, t));
+};
+function ss(e, t, n) {
+  return typeof e == "number" && typeof t == "number" && typeof n == "number" ? Ke(e, t, n) : Mt(e)(e, t);
+}
+const Jr = (e) => {
+  const t = ({ timestamp: n }) => e(n);
+  return {
+    start: (n = !0) => L.update(t, n),
+    stop: () => Qe(t),
+    /**
+     * If we're processing this frame we can use the
+     * framelocked timestamp to keep things in sync.
+     */
+    now: () => Fe.isProcessing ? Fe.timestamp : k.now()
+  };
+}, rs = (e, t, n = 10) => {
+  let s = "";
+  const r = Math.max(Math.round(t / n), 2);
+  for (let i = 0; i < r; i++)
+    s += Math.round(e(i / (r - 1)) * 1e4) / 1e4 + ", ";
+  return `linear(${s.substring(0, s.length - 2)})`;
+}, Oe = 2e4;
+function Pt(e) {
+  let t = 0;
+  const n = 50;
+  let s = e.next(t);
+  for (; !s.done && t < Oe; )
+    t += n, s = e.next(t);
+  return t >= Oe ? 1 / 0 : t;
+}
+function ei(e, t = 100, n) {
+  const s = n({ ...e, keyframes: [0, t] }), r = Math.min(Pt(s), Oe);
+  return {
+    type: "keyframes",
+    ease: (i) => s.next(r * i).value / t,
+    duration: /* @__PURE__ */ $(r)
+  };
+}
+const ti = 5;
+function is(e, t, n) {
+  const s = Math.max(t - ti, 0);
+  return Ln(n - e(s), t - s);
+}
+const P = {
+  // Default spring physics
+  stiffness: 100,
+  damping: 10,
+  mass: 1,
+  velocity: 0,
+  // Default duration/bounce-based options
+  duration: 800,
+  // in ms
+  bounce: 0.3,
+  visualDuration: 0.3,
+  // in seconds
+  // Rest thresholds
+  restSpeed: {
+    granular: 0.01,
+    default: 2
+  },
+  restDelta: {
+    granular: 5e-3,
+    default: 0.5
+  },
+  // Limits
+  minDuration: 0.01,
+  // in seconds
+  maxDuration: 10,
+  // in seconds
+  minDamping: 0.05,
+  maxDamping: 1
+}, tn = 1e-3;
+function ni({ duration: e = P.duration, bounce: t = P.bounce, velocity: n = P.velocity, mass: s = P.mass }) {
+  let r, i;
+  ue(e <= /* @__PURE__ */ N(P.maxDuration), "Spring duration must be 10 seconds or less");
+  let o = 1 - t;
+  o = J(P.minDamping, P.maxDamping, o), e = J(P.minDuration, P.maxDuration, /* @__PURE__ */ $(e)), o < 1 ? (r = (l) => {
+    const c = l * o, d = c * e, f = c - n, h = et(l, o), m = Math.exp(-d);
+    return tn - f / h * m;
+  }, i = (l) => {
+    const d = l * o * e, f = d * n + n, h = Math.pow(o, 2) * Math.pow(l, 2) * e, m = Math.exp(-d), g = et(Math.pow(l, 2), o);
+    return (-r(l) + tn > 0 ? -1 : 1) * ((f - h) * m) / g;
+  }) : (r = (l) => {
+    const c = Math.exp(-l * e), d = (l - n) * e + 1;
+    return -1e-3 + c * d;
+  }, i = (l) => {
+    const c = Math.exp(-l * e), d = (n - l) * (e * e);
+    return c * d;
+  });
+  const a = 5 / e, u = ri(r, i, a);
+  if (e = /* @__PURE__ */ N(e), isNaN(u))
+    return {
+      stiffness: P.stiffness,
+      damping: P.damping,
+      duration: e
+    };
+  {
+    const l = Math.pow(u, 2) * s;
+    return {
+      stiffness: l,
+      damping: o * 2 * Math.sqrt(s * l),
+      duration: e
+    };
+  }
+}
+const si = 12;
+function ri(e, t, n) {
+  let s = n;
+  for (let r = 1; r < si; r++)
+    s = s - e(s) / t(s);
+  return s;
+}
+function et(e, t) {
+  return e * Math.sqrt(1 - t * t);
+}
+const ii = ["duration", "bounce"], oi = ["stiffness", "damping", "mass"];
+function nn(e, t) {
+  return t.some((n) => e[n] !== void 0);
+}
+function ai(e) {
+  let t = {
+    velocity: P.velocity,
+    stiffness: P.stiffness,
+    damping: P.damping,
+    mass: P.mass,
+    isResolvedFromDuration: !1,
+    ...e
+  };
+  if (!nn(e, oi) && nn(e, ii))
+    if (e.visualDuration) {
+      const n = e.visualDuration, s = 2 * Math.PI / (n * 1.2), r = s * s, i = 2 * J(0.05, 1, 1 - (e.bounce || 0)) * Math.sqrt(r);
+      t = {
+        ...t,
+        mass: P.mass,
+        stiffness: r,
+        damping: i
+      };
+    } else {
+      const n = ni(e);
+      t = {
+        ...t,
+        ...n,
+        mass: P.mass
+      }, t.isResolvedFromDuration = !0;
+    }
+  return t;
+}
+function Ee(e = P.visualDuration, t = P.bounce) {
+  const n = typeof e != "object" ? {
+    visualDuration: e,
+    keyframes: [0, 1],
+    bounce: t
+  } : e;
+  let { restSpeed: s, restDelta: r } = n;
+  const i = n.keyframes[0], o = n.keyframes[n.keyframes.length - 1], a = { done: !1, value: i }, { stiffness: u, damping: l, mass: c, duration: d, velocity: f, isResolvedFromDuration: h } = ai({
+    ...n,
+    velocity: -/* @__PURE__ */ $(n.velocity || 0)
+  }), m = f || 0, g = l / (2 * Math.sqrt(u * c)), y = o - i, p = /* @__PURE__ */ $(Math.sqrt(u / c)), x = Math.abs(y) < 5;
+  s || (s = x ? P.restSpeed.granular : P.restSpeed.default), r || (r = x ? P.restDelta.granular : P.restDelta.default);
+  let v;
+  if (g < 1) {
+    const S = et(p, g);
+    v = (C) => {
+      const M = Math.exp(-g * p * C);
+      return o - M * ((m + g * p * y) / S * Math.sin(S * C) + y * Math.cos(S * C));
+    };
+  } else if (g === 1)
+    v = (S) => o - Math.exp(-p * S) * (y + (m + p * y) * S);
+  else {
+    const S = p * Math.sqrt(g * g - 1);
+    v = (C) => {
+      const M = Math.exp(-g * p * C), V = Math.min(S * C, 300);
+      return o - M * ((m + g * p * y) * Math.sinh(V) + S * y * Math.cosh(V)) / S;
+    };
+  }
+  const A = {
+    calculatedDuration: h && d || null,
+    next: (S) => {
+      const C = v(S);
+      if (h)
+        a.done = S >= d;
+      else {
+        let M = S === 0 ? m : 0;
+        g < 1 && (M = S === 0 ? /* @__PURE__ */ N(m) : is(v, S, C));
+        const V = Math.abs(M) <= s, F = Math.abs(o - C) <= r;
+        a.done = V && F;
+      }
+      return a.value = a.done ? o : C, a;
+    },
+    toString: () => {
+      const S = Math.min(Pt(A), Oe), C = rs((M) => A.next(S * M).value, S, 30);
+      return S + "ms " + C;
+    },
+    toTransition: () => {
+    }
+  };
+  return A;
+}
+Ee.applyToOptions = (e) => {
+  const t = ei(e, 100, Ee);
+  return e.ease = t.ease, e.duration = /* @__PURE__ */ N(t.duration), e.type = "keyframes", e;
+};
+function tt({ keyframes: e, velocity: t = 0, power: n = 0.8, timeConstant: s = 325, bounceDamping: r = 10, bounceStiffness: i = 500, modifyTarget: o, min: a, max: u, restDelta: l = 0.5, restSpeed: c }) {
+  const d = e[0], f = {
+    done: !1,
+    value: d
+  }, h = (V) => a !== void 0 && V < a || u !== void 0 && V > u, m = (V) => a === void 0 ? u : u === void 0 || Math.abs(a - V) < Math.abs(u - V) ? a : u;
+  let g = n * t;
+  const y = d + g, p = o === void 0 ? y : o(y);
+  p !== y && (g = p - d);
+  const x = (V) => -g * Math.exp(-V / s), v = (V) => p + x(V), A = (V) => {
+    const F = x(V), I = v(V);
+    f.done = Math.abs(F) <= l, f.value = f.done ? p : I;
+  };
+  let S, C;
+  const M = (V) => {
+    h(f.value) && (S = V, C = Ee({
+      keyframes: [f.value, m(f.value)],
+      velocity: is(v, V, f.value),
+      // TODO: This should be passing * 1000
+      damping: r,
+      stiffness: i,
+      restDelta: l,
+      restSpeed: c
+    }));
+  };
+  return M(0), {
+    calculatedDuration: null,
+    next: (V) => {
+      let F = !1;
+      return !C && S === void 0 && (F = !0, A(V), M(V)), S !== void 0 && V >= S ? C.next(V - S) : (!F && A(V), f);
+    }
+  };
+}
+function ci(e, t, n) {
+  const s = [], r = n || j.mix || ss, i = e.length - 1;
+  for (let o = 0; o < i; o++) {
+    let a = r(e[o], e[o + 1]);
+    if (t) {
+      const u = Array.isArray(t) ? t[o] || le : t;
+      a = Ne(u, a);
+    }
+    s.push(a);
+  }
+  return s;
+}
+function ui(e, t, { clamp: n = !0, ease: s, mixer: r } = {}) {
+  const i = e.length;
+  if (U(i === t.length, "Both input and output ranges must be the same length"), i === 1)
+    return () => t[0];
+  if (i === 2 && t[0] === t[1])
+    return () => t[1];
+  const o = e[0] === e[1];
+  e[0] > e[i - 1] && (e = [...e].reverse(), t = [...t].reverse());
+  const a = ci(t, s, r), u = a.length, l = (c) => {
+    if (o && c < e[0])
+      return t[0];
+    let d = 0;
+    if (u > 1)
+      for (; d < e.length - 2 && !(c < e[d + 1]); d++)
+        ;
+    const f = /* @__PURE__ */ kn(e[d], e[d + 1], c);
+    return a[d](f);
+  };
+  return n ? (c) => l(J(e[0], e[i - 1], c)) : l;
+}
+function li(e, t) {
+  const n = e[e.length - 1];
+  for (let s = 1; s <= t; s++) {
+    const r = /* @__PURE__ */ kn(0, t, s);
+    e.push(Ke(n, 1, r));
+  }
+}
+function fi(e) {
+  const t = [0];
+  return li(t, e.length - 1), t;
+}
+function di(e, t) {
+  return e.map((n) => n * t);
+}
+function hi(e, t) {
+  return e.map(() => t || Un).splice(0, e.length - 1);
+}
+function se({ duration: e = 300, keyframes: t, times: n, ease: s = "easeInOut" }) {
+  const r = Cr(s) ? s.map(Xt) : Xt(s), i = {
+    done: !1,
+    value: t[0]
+  }, o = di(
+    // 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 : fi(t),
+    e
+  ), a = ui(o, t, {
+    ease: Array.isArray(r) ? r : hi(t, r)
+  });
+  return {
+    calculatedDuration: e,
+    next: (u) => (i.value = a(u), i.done = u >= e, i)
+  };
+}
+const pi = (e) => e !== null;
+function Rt(e, { repeat: t, repeatType: n = "loop" }, s, r = 1) {
+  const i = e.filter(pi), a = r < 0 || t && n !== "loop" && t % 2 === 1 ? 0 : i.length - 1;
+  return !a || s === void 0 ? i[a] : s;
+}
+const mi = {
+  decay: tt,
+  inertia: tt,
+  tween: se,
+  keyframes: se,
+  spring: Ee
+};
+function os(e) {
+  typeof e.type == "string" && (e.type = mi[e.type]);
+}
+class Ft {
+  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 gi = (e) => e / 100;
+class Dt extends Ft {
+  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, r;
+      const { motionValue: n } = this.options;
+      n && n.updatedAt !== k.now() && this.tick(k.now()), this.isStopped = !0, this.state !== "idle" && (this.teardown(), (r = (s = this.options).onStop) == null || r.call(s));
+    }, this.options = t, this.initAnimation(), this.play(), t.autoplay === !1 && this.pause();
+  }
+  initAnimation() {
+    const { options: t } = this;
+    os(t);
+    const { type: n = se, repeat: s = 0, repeatDelay: r = 0, repeatType: i, velocity: o = 0 } = t;
+    let { keyframes: a } = t;
+    const u = n || se;
+    process.env.NODE_ENV !== "production" && u !== se && U(a.length <= 2, `Only two keyframes currently supported with spring and inertia animations. Trying to animate ${a}`), u !== se && typeof a[0] != "number" && (this.mixKeyframes = Ne(gi, ss(a[0], a[1])), a = [0, 100]);
+    const l = u({ ...t, keyframes: a });
+    i === "mirror" && (this.mirroredGenerator = u({
+      ...t,
+      keyframes: [...a].reverse(),
+      velocity: -o
+    })), l.calculatedDuration === null && (l.calculatedDuration = Pt(l));
+    const { calculatedDuration: c } = l;
+    this.calculatedDuration = c, this.resolvedDuration = c + r, this.totalDuration = this.resolvedDuration * (s + 1) - r, 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: r, mixKeyframes: i, mirroredGenerator: o, resolvedDuration: a, calculatedDuration: u } = this;
+    if (this.startTime === null)
+      return s.next(0);
+    const { delay: l = 0, keyframes: c, repeat: d, repeatType: f, repeatDelay: h, type: m, onUpdate: g, finalKeyframe: y } = this.options;
+    this.speed > 0 ? this.startTime = Math.min(this.startTime, t) : this.speed < 0 && (this.startTime = Math.min(t - r / this.speed, this.startTime)), n ? this.currentTime = t : this.updateTime(t);
+    const p = this.currentTime - l * (this.playbackSpeed >= 0 ? 1 : -1), x = this.playbackSpeed >= 0 ? p < 0 : p > r;
+    this.currentTime = Math.max(p, 0), this.state === "finished" && this.holdTime === null && (this.currentTime = r);
+    let v = this.currentTime, A = s;
+    if (d) {
+      const V = Math.min(this.currentTime, r) / a;
+      let F = Math.floor(V), I = V % 1;
+      !I && V >= 1 && (I = 1), I === 1 && F--, F = Math.min(F, d + 1), !!(F % 2) && (f === "reverse" ? (I = 1 - I, h && (I -= h / a)) : f === "mirror" && (A = o)), v = J(0, 1, I) * a;
+    }
+    const S = x ? { done: !1, value: c[0] } : A.next(v);
+    i && (S.value = i(S.value));
+    let { done: C } = S;
+    !x && u !== null && (C = this.playbackSpeed >= 0 ? this.currentTime >= r : this.currentTime <= 0);
+    const M = this.holdTime === null && (this.state === "finished" || this.state === "running" && C);
+    return M && m !== tt && (S.value = Rt(c, this.options, y, this.speed)), g && g(S.value), M && this.finish(), S;
+  }
+  /**
+   * 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__ */ $(this.calculatedDuration);
+  }
+  get time() {
+    return /* @__PURE__ */ $(this.currentTime);
+  }
+  set time(t) {
+    var n;
+    t = /* @__PURE__ */ N(t), this.currentTime = t, this.startTime === null || this.holdTime !== null || this.playbackSpeed === 0 ? this.holdTime = t : this.driver && (this.startTime = this.driver.now() - t / this.playbackSpeed), (n = this.driver) == null || n.start(!1);
+  }
+  get speed() {
+    return this.playbackSpeed;
+  }
+  set speed(t) {
+    this.updateTime(k.now());
+    const n = this.playbackSpeed !== t;
+    this.playbackSpeed = t, n && (this.time = /* @__PURE__ */ $(this.currentTime));
+  }
+  play() {
+    var r, i;
+    if (this.isStopped)
+      return;
+    const { driver: t = Jr, startTime: n } = this.options;
+    this.driver || (this.driver = t((o) => this.tick(o))), (i = (r = this.options).onPlay) == null || i.call(r);
+    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(k.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 yi(e) {
+  for (let t = 1; t < e.length; t++)
+    e[t] ?? (e[t] = e[t - 1]);
+}
+const X = (e) => e * 180 / Math.PI, nt = (e) => {
+  const t = X(Math.atan2(e[1], e[0]));
+  return st(t);
+}, bi = {
+  x: 4,
+  y: 5,
+  translateX: 4,
+  translateY: 5,
+  scaleX: 0,
+  scaleY: 3,
+  scale: (e) => (Math.abs(e[0]) + Math.abs(e[3])) / 2,
+  rotate: nt,
+  rotateZ: nt,
+  skewX: (e) => X(Math.atan(e[1])),
+  skewY: (e) => X(Math.atan(e[2])),
+  skew: (e) => (Math.abs(e[1]) + Math.abs(e[2])) / 2
+}, st = (e) => (e = e % 360, e < 0 && (e += 360), e), sn = nt, rn = (e) => Math.sqrt(e[0] * e[0] + e[1] * e[1]), on = (e) => Math.sqrt(e[4] * e[4] + e[5] * e[5]), vi = {
+  x: 12,
+  y: 13,
+  z: 14,
+  translateX: 12,
+  translateY: 13,
+  translateZ: 14,
+  scaleX: rn,
+  scaleY: on,
+  scale: (e) => (rn(e) + on(e)) / 2,
+  rotateX: (e) => st(X(Math.atan2(e[6], e[5]))),
+  rotateY: (e) => st(X(Math.atan2(-e[2], e[0]))),
+  rotateZ: sn,
+  rotate: sn,
+  skewX: (e) => X(Math.atan(e[4])),
+  skewY: (e) => X(Math.atan(e[1])),
+  skew: (e) => (Math.abs(e[1]) + Math.abs(e[4])) / 2
+};
+function rt(e) {
+  return e.includes("scale") ? 1 : 0;
+}
+function it(e, t) {
+  if (!e || e === "none")
+    return rt(t);
+  const n = e.match(/^matrix3d\(([-\d.e\s,]+)\)$/u);
+  let s, r;
+  if (n)
+    s = vi, r = n;
+  else {
+    const a = e.match(/^matrix\(([-\d.e\s,]+)\)$/u);
+    s = bi, r = a;
+  }
+  if (!r)
+    return rt(t);
+  const i = s[t], o = r[1].split(",").map(wi);
+  return typeof i == "function" ? i(o) : o[i];
+}
+const Ti = (e, t) => {
+  const { transform: n = "none" } = getComputedStyle(e);
+  return it(n, t);
+};
+function wi(e) {
+  return parseFloat(e.trim());
+}
+const he = [
+  "transformPerspective",
+  "x",
+  "y",
+  "z",
+  "translateX",
+  "translateY",
+  "translateZ",
+  "scale",
+  "scaleX",
+  "scaleY",
+  "rotate",
+  "rotateX",
+  "rotateY",
+  "rotateZ",
+  "skew",
+  "skewX",
+  "skewY"
+], pe = new Set(he), an = (e) => e === fe || e === T, xi = /* @__PURE__ */ new Set(["x", "y", "z"]), Si = he.filter((e) => !xi.has(e));
+function Vi(e) {
+  const t = [];
+  return Si.forEach((n) => {
+    const s = e.getValue(n);
+    s !== void 0 && (t.push([n, s.get()]), s.set(n.startsWith("scale") ? 1 : 0));
+  }), t;
+}
+const Q = {
+  // 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 }) => it(t, "x"),
+  y: (e, { transform: t }) => it(t, "y")
+};
+Q.translateX = Q.x;
+Q.translateY = Q.y;
+const Z = /* @__PURE__ */ new Set();
+let ot = !1, at = !1, ct = !1;
+function as() {
+  if (at) {
+    const e = Array.from(Z).filter((s) => s.needsMeasurement), t = new Set(e.map((s) => s.element)), n = /* @__PURE__ */ new Map();
+    t.forEach((s) => {
+      const r = Vi(s);
+      r.length && (n.set(s, r), s.render());
+    }), e.forEach((s) => s.measureInitialState()), t.forEach((s) => {
+      s.render();
+      const r = n.get(s);
+      r && r.forEach(([i, o]) => {
+        var a;
+        (a = s.getValue(i)) == null || a.set(o);
+      });
+    }), e.forEach((s) => s.measureEndState()), e.forEach((s) => {
+      s.suspendedScrollY !== void 0 && window.scrollTo(0, s.suspendedScrollY);
+    });
+  }
+  at = !1, ot = !1, Z.forEach((e) => e.complete(ct)), Z.clear();
+}
+function cs() {
+  Z.forEach((e) => {
+    e.readKeyframes(), e.needsMeasurement && (at = !0);
+  });
+}
+function Ci() {
+  ct = !0, cs(), as(), ct = !1;
+}
+class Ot {
+  constructor(t, n, s, r, i, o = !1) {
+    this.state = "pending", this.isAsync = !1, this.needsMeasurement = !1, this.unresolvedKeyframes = [...t], this.onComplete = n, this.name = s, this.motionValue = r, this.element = i, this.isAsync = o;
+  }
+  scheduleResolve() {
+    this.state = "scheduled", this.isAsync ? (Z.add(this), ot || (ot = !0, L.read(cs), L.resolveKeyframes(as))) : (this.readKeyframes(), this.complete());
+  }
+  readKeyframes() {
+    const { unresolvedKeyframes: t, name: n, element: s, motionValue: r } = this;
+    if (t[0] === null) {
+      const i = r == null ? void 0 : r.get(), o = t[t.length - 1];
+      if (i !== void 0)
+        t[0] = i;
+      else if (s && n) {
+        const a = s.readValue(n, o);
+        a != null && (t[0] = a);
+      }
+      t[0] === void 0 && (t[0] = o), r && i === void 0 && r.set(t[0]);
+    }
+    yi(t);
+  }
+  setFinalKeyframe() {
+  }
+  measureInitialState() {
+  }
+  renderEndStyles() {
+  }
+  measureEndState() {
+  }
+  complete(t = !1) {
+    this.state = "complete", this.onComplete(this.unresolvedKeyframes, this.finalKeyframe, t), Z.delete(this);
+  }
+  cancel() {
+    this.state === "scheduled" && (Z.delete(this), this.state = "pending");
+  }
+  resume() {
+    this.state === "pending" && this.scheduleResolve();
+  }
+}
+const Ai = (e) => e.startsWith("--");
+function Mi(e, t, n) {
+  Ai(t) ? e.style.setProperty(t, n) : e.style[t] = n;
+}
+const Pi = /* @__PURE__ */ wt(() => window.ScrollTimeline !== void 0), Ri = {};
+function Fi(e, t) {
+  const n = /* @__PURE__ */ wt(e);
+  return () => Ri[t] ?? n();
+}
+const us = /* @__PURE__ */ Fi(() => {
+  try {
+    document.createElement("div").animate({ opacity: 0 }, { easing: "linear(0, 1)" });
+  } catch {
+    return !1;
+  }
+  return !0;
+}, "linearEasing"), ge = ([e, t, n, s]) => `cubic-bezier(${e}, ${t}, ${n}, ${s})`, cn = {
+  linear: "linear",
+  ease: "ease",
+  easeIn: "ease-in",
+  easeOut: "ease-out",
+  easeInOut: "ease-in-out",
+  circIn: /* @__PURE__ */ ge([0, 0.65, 0.55, 1]),
+  circOut: /* @__PURE__ */ ge([0.55, 0, 1, 0.45]),
+  backIn: /* @__PURE__ */ ge([0.31, 0.01, 0.66, -0.59]),
+  backOut: /* @__PURE__ */ ge([0.33, 1.53, 0.69, 0.99])
+};
+function ls(e, t) {
+  if (e)
+    return typeof e == "function" ? us() ? rs(e, t) : "ease-out" : zn(e) ? ge(e) : Array.isArray(e) ? e.map((n) => ls(n, t) || cn.easeOut) : cn[e];
+}
+function Di(e, t, n, { delay: s = 0, duration: r = 300, repeat: i = 0, repeatType: o = "loop", ease: a = "easeOut", times: u } = {}, l = void 0) {
+  const c = {
+    [t]: n
+  };
+  u && (c.offset = u);
+  const d = ls(a, r);
+  Array.isArray(d) && (c.easing = d);
+  const f = {
+    delay: s,
+    duration: r,
+    easing: Array.isArray(d) ? "linear" : d,
+    fill: "both",
+    iterations: i + 1,
+    direction: o === "reverse" ? "alternate" : "normal"
+  };
+  return l && (f.pseudoElement = l), e.animate(c, f);
+}
+function fs(e) {
+  return typeof e == "function" && "applyToOptions" in e;
+}
+function Oi({ type: e, ...t }) {
+  return fs(e) && us() ? e.applyToOptions(t) : (t.duration ?? (t.duration = 300), t.ease ?? (t.ease = "easeOut"), t);
+}
+class Ei extends Ft {
+  constructor(t) {
+    if (super(), this.finishedTime = null, this.isStopped = !1, !t)
+      return;
+    const { element: n, name: s, keyframes: r, pseudoElement: i, allowFlatten: o = !1, finalKeyframe: a, onComplete: u } = t;
+    this.isPseudoElement = !!i, this.allowFlatten = o, this.options = t, U(typeof t.type != "string", `animateMini doesn't support "type" as a string. Did you mean to import { spring } from "motion"?`);
+    const l = Oi(t);
+    this.animation = Di(n, s, r, l, i), l.autoplay === !1 && this.animation.pause(), this.animation.onfinish = () => {
+      if (this.finishedTime = this.time, !i) {
+        const c = Rt(r, this.options, a, this.speed);
+        this.updateMotionValue ? this.updateMotionValue(c) : Mi(n, s, c), this.animation.cancel();
+      }
+      u == null || u(), 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__ */ $(Number(t));
+  }
+  get time() {
+    return /* @__PURE__ */ $(Number(this.animation.currentTime) || 0);
+  }
+  set time(t) {
+    this.finishedTime = null, this.animation.currentTime = /* @__PURE__ */ N(t);
+  }
+  /**
+   * The playback speed of the animation.
+   * 1 = normal speed, 2 = double speed, 0.5 = half speed.
+   */
+  get speed() {
+    return this.animation.playbackRate;
+  }
+  set speed(t) {
+    t < 0 && (this.finishedTime = null), this.animation.playbackRate = t;
+  }
+  get state() {
+    return this.finishedTime !== null ? "finished" : this.animation.playState;
+  }
+  get startTime() {
+    return Number(this.animation.startTime);
+  }
+  set startTime(t) {
+    this.animation.startTime = t;
+  }
+  /**
+   * Attaches a timeline to the animation, for instance the `ScrollTimeline`.
+   */
+  attachTimeline({ timeline: t, observe: n }) {
+    var s;
+    return this.allowFlatten && ((s = this.animation.effect) == null || s.updateTiming({ easing: "linear" })), this.animation.onfinish = null, t && Pi() ? (this.animation.timeline = t, le) : n(this);
+  }
+}
+const ds = {
+  anticipate: Hn,
+  backInOut: _n,
+  circInOut: Gn
+};
+function Ii(e) {
+  return e in ds;
+}
+function ki(e) {
+  typeof e.ease == "string" && Ii(e.ease) && (e.ease = ds[e.ease]);
+}
+const un = 10;
+class Bi extends Ei {
+  constructor(t) {
+    ki(t), os(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: r, element: i, ...o } = this.options;
+    if (!n)
+      return;
+    if (t !== void 0) {
+      n.set(t);
+      return;
+    }
+    const a = new Dt({
+      ...o,
+      autoplay: !1
+    }), u = /* @__PURE__ */ N(this.finishedTime ?? this.time);
+    n.setWithVelocity(a.sample(u - un).value, a.sample(u).value, un), a.stop();
+  }
+}
+const ln = (e, t) => t === "zIndex" ? !1 : !!(typeof e == "number" || Array.isArray(e) || typeof e == "string" && // It's animatable if we have a string
+(de.test(e) || e === "0") && // And it contains numbers and/or colors
+!e.startsWith("url("));
+function Li(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 Ni(e, t, n, s) {
+  const r = e[0];
+  if (r === null)
+    return !1;
+  if (t === "display" || t === "visibility")
+    return !0;
+  const i = e[e.length - 1], o = ln(r, t), a = ln(i, t);
+  return ue(o === a, `You are trying to animate ${t} from "${r}" to "${i}". ${r} is not an animatable value - to enable this animation set ${r} to a value animatable to ${i} via the \`style\` property.`), !o || !a ? !1 : Li(e) || (n === "spring" || fs(n)) && s;
+}
+function hs(e) {
+  return yr(e) && "offsetHeight" in e;
+}
+const Ki = /* @__PURE__ */ new Set([
+  "opacity",
+  "clipPath",
+  "filter",
+  "transform"
+  // TODO: Could be re-enabled now we have support for linear() easing
+  // "background-color"
+]), $i = /* @__PURE__ */ wt(() => Object.hasOwnProperty.call(Element.prototype, "animate"));
+function ji(e) {
+  var l;
+  const { motionValue: t, name: n, repeatDelay: s, repeatType: r, damping: i, type: o } = e;
+  if (!hs((l = t == null ? void 0 : t.owner) == null ? void 0 : l.current))
+    return !1;
+  const { onUpdate: a, transformTemplate: u } = t.owner.getProps();
+  return $i() && n && Ki.has(n) && (n !== "transform" || !u) && /**
+   * 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 && r !== "mirror" && i !== 0 && o !== "inertia";
+}
+const Wi = 40;
+class _i extends Ft {
+  constructor({ autoplay: t = !0, delay: n = 0, type: s = "keyframes", repeat: r = 0, repeatDelay: i = 0, repeatType: o = "loop", keyframes: a, name: u, motionValue: l, element: c, ...d }) {
+    var m;
+    super(), this.stop = () => {
+      var g, y;
+      this._animation && (this._animation.stop(), (g = this.stopTimeline) == null || g.call(this)), (y = this.keyframeResolver) == null || y.cancel();
+    }, this.createdAt = k.now();
+    const f = {
+      autoplay: t,
+      delay: n,
+      type: s,
+      repeat: r,
+      repeatDelay: i,
+      repeatType: o,
+      name: u,
+      motionValue: l,
+      element: c,
+      ...d
+    }, h = (c == null ? void 0 : c.KeyframeResolver) || Ot;
+    this.keyframeResolver = new h(a, (g, y, p) => this.onKeyframesResolved(g, y, f, !p), u, l, c), (m = this.keyframeResolver) == null || m.scheduleResolve();
+  }
+  onKeyframesResolved(t, n, s, r) {
+    this.keyframeResolver = void 0;
+    const { name: i, type: o, velocity: a, delay: u, isHandoff: l, onUpdate: c } = s;
+    this.resolvedAt = k.now(), Ni(t, i, o, a) || ((j.instantAnimations || !u) && (c == null || c(Rt(t, s, n))), t[0] = t[t.length - 1], s.duration = 0, s.repeat = 0);
+    const f = {
+      startTime: r ? this.resolvedAt ? this.resolvedAt - this.createdAt > Wi ? this.resolvedAt : this.createdAt : this.createdAt : void 0,
+      finalKeyframe: n,
+      ...s,
+      keyframes: t
+    }, h = !l && ji(f) ? new Bi({
+      ...f,
+      element: f.motionValue.owner.current
+    }) : new Dt(f);
+    h.finished.then(() => this.notifyFinished()).catch(le), 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(), Ci()), 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 Hi = (
+  // 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 Gi(e) {
+  const t = Hi.exec(e);
+  if (!t)
+    return [,];
+  const [, n, s, r] = t;
+  return [`--${n ?? s}`, r];
+}
+const Ui = 4;
+function ps(e, t, n = 1) {
+  U(n <= Ui, `Max CSS variable fallback depth detected in property "${e}". This may indicate a circular fallback dependency.`);
+  const [s, r] = Gi(e);
+  if (!s)
+    return;
+  const i = window.getComputedStyle(t).getPropertyValue(s);
+  if (i) {
+    const o = i.trim();
+    return En(o) ? parseFloat(o) : o;
+  }
+  return Vt(r) ? ps(r, t, n + 1) : r;
+}
+function ms(e, t) {
+  return (e == null ? void 0 : e[t]) ?? (e == null ? void 0 : e.default) ?? e;
+}
+const gs = /* @__PURE__ */ new Set([
+  "width",
+  "height",
+  "top",
+  "left",
+  "right",
+  "bottom",
+  ...he
+]), zi = {
+  test: (e) => e === "auto",
+  parse: (e) => e
+}, ys = (e) => (t) => t.test(e), bs = [fe, T, re, W, Lr, Br, zi], fn = (e) => bs.find(ys(e));
+function Yi(e) {
+  return typeof e == "number" ? e === 0 : e !== null ? e === "none" || e === "0" || In(e) : !0;
+}
+const qi = /* @__PURE__ */ new Set(["brightness", "contrast", "saturate", "opacity"]);
+function Xi(e) {
+  const [t, n] = e.slice(0, -1).split("(");
+  if (t === "drop-shadow")
+    return e;
+  const [s] = n.match(Ct) || [];
+  if (!s)
+    return e;
+  const r = n.replace(s, "");
+  let i = qi.has(t) ? 1 : 0;
+  return s !== n && (i *= 100), t + "(" + i + r + ")";
+}
+const Qi = /\b([a-z-]*)\(.*?\)/gu, ut = {
+  ...de,
+  getAnimatableNone: (e) => {
+    const t = e.match(Qi);
+    return t ? t.map(Xi).join(" ") : e;
+  }
+}, dn = {
+  ...fe,
+  transform: Math.round
+}, Zi = {
+  rotate: W,
+  rotateX: W,
+  rotateY: W,
+  rotateZ: W,
+  scale: Ae,
+  scaleX: Ae,
+  scaleY: Ae,
+  scaleZ: Ae,
+  skew: W,
+  skewX: W,
+  skewY: W,
+  distance: T,
+  translateX: T,
+  translateY: T,
+  translateZ: T,
+  x: T,
+  y: T,
+  z: T,
+  perspective: T,
+  transformPerspective: T,
+  opacity: ve,
+  originX: Qt,
+  originY: Qt,
+  originZ: T
+}, Et = {
+  // Border props
+  borderWidth: T,
+  borderTopWidth: T,
+  borderRightWidth: T,
+  borderBottomWidth: T,
+  borderLeftWidth: T,
+  borderRadius: T,
+  radius: T,
+  borderTopLeftRadius: T,
+  borderTopRightRadius: T,
+  borderBottomRightRadius: T,
+  borderBottomLeftRadius: T,
+  // Positioning props
+  width: T,
+  maxWidth: T,
+  height: T,
+  maxHeight: T,
+  top: T,
+  right: T,
+  bottom: T,
+  left: T,
+  // Spacing props
+  padding: T,
+  paddingTop: T,
+  paddingRight: T,
+  paddingBottom: T,
+  paddingLeft: T,
+  margin: T,
+  marginTop: T,
+  marginRight: T,
+  marginBottom: T,
+  marginLeft: T,
+  // Misc
+  backgroundPositionX: T,
+  backgroundPositionY: T,
+  ...Zi,
+  zIndex: dn,
+  // SVG
+  fillOpacity: ve,
+  strokeOpacity: ve,
+  numOctaves: dn
+}, Ji = {
+  ...Et,
+  // Color props
+  color: R,
+  backgroundColor: R,
+  outlineColor: R,
+  fill: R,
+  stroke: R,
+  // Border props
+  borderColor: R,
+  borderTopColor: R,
+  borderRightColor: R,
+  borderBottomColor: R,
+  borderLeftColor: R,
+  filter: ut,
+  WebkitFilter: ut
+}, vs = (e) => Ji[e];
+function Ts(e, t) {
+  let n = vs(e);
+  return n !== ut && (n = de), n.getAnimatableNone ? n.getAnimatableNone(t) : void 0;
+}
+const eo = /* @__PURE__ */ new Set(["auto", "none", "0"]);
+function to(e, t, n) {
+  let s = 0, r;
+  for (; s < e.length && !r; ) {
+    const i = e[s];
+    typeof i == "string" && !eo.has(i) && Te(i).values.length && (r = e[s]), s++;
+  }
+  if (r && n)
+    for (const i of t)
+      e[i] = Ts(n, r);
+}
+class no extends Ot {
+  constructor(t, n, s, r, i) {
+    super(t, n, s, r, i, !0);
+  }
+  readKeyframes() {
+    const { unresolvedKeyframes: t, element: n, name: s } = this;
+    if (!n || !n.current)
+      return;
+    super.readKeyframes();
+    for (let u = 0; u < t.length; u++) {
+      let l = t[u];
+      if (typeof l == "string" && (l = l.trim(), Vt(l))) {
+        const c = ps(l, n.current);
+        c !== void 0 && (t[u] = c), u === t.length - 1 && (this.finalKeyframe = l);
+      }
+    }
+    if (this.resolveNoneKeyframes(), !gs.has(s) || t.length !== 2)
+      return;
+    const [r, i] = t, o = fn(r), a = fn(i);
+    if (o !== a)
+      if (an(o) && an(a))
+        for (let u = 0; u < t.length; u++) {
+          const l = t[u];
+          typeof l == "string" && (t[u] = parseFloat(l));
+        }
+      else Q[s] && (this.needsMeasurement = !0);
+  }
+  resolveNoneKeyframes() {
+    const { unresolvedKeyframes: t, name: n } = this, s = [];
+    for (let r = 0; r < t.length; r++)
+      (t[r] === null || Yi(t[r])) && s.push(r);
+    s.length && to(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 = Q[s](t.measureViewportBox(), window.getComputedStyle(t.current)), n[0] = this.measuredOrigin;
+    const r = n[n.length - 1];
+    r !== void 0 && t.getValue(s, r).jump(r, !1);
+  }
+  measureEndState() {
+    var a;
+    const { element: t, name: n, unresolvedKeyframes: s } = this;
+    if (!t || !t.current)
+      return;
+    const r = t.getValue(n);
+    r && r.jump(this.measuredOrigin, !1);
+    const i = s.length - 1, o = s[i];
+    s[i] = Q[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(([u, l]) => {
+      t.getValue(u).set(l);
+    }), this.resolveNoneKeyframes();
+  }
+}
+function so(e, t, n) {
+  if (e instanceof EventTarget)
+    return [e];
+  if (typeof e == "string") {
+    const r = document.querySelectorAll(e);
+    return r ? Array.from(r) : [];
+  }
+  return Array.from(e);
+}
+const ws = (e, t) => t && typeof e == "number" ? t.transform(e) : e, hn = 30, ro = (e) => !isNaN(parseFloat(e));
+class io {
+  /**
+   * @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, r = !0) => {
+      var o, a;
+      const i = k.now();
+      if (this.updatedAt !== i && 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 u of this.dependents)
+          u.dirty();
+      r && ((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 = k.now(), this.canTrackVelocity === null && t !== void 0 && (this.canTrackVelocity = ro(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" && Nn(!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 Bn());
+    const s = this.events[t].add(n);
+    return t === "change" ? () => {
+      s(), L.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 = k.now();
+    if (!this.canTrackVelocity || this.prevFrameValue === void 0 || t - this.updatedAt > hn)
+      return 0;
+    const n = Math.min(this.updatedAt - this.prevUpdatedAt, hn);
+    return Ln(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 Ie(e, t) {
+  return new io(e, t);
+}
+const { schedule: oo, cancel: jc } = /* @__PURE__ */ Yn(queueMicrotask, !1), ao = {
+  x: !1,
+  y: !1
+};
+function co() {
+  return ao.y;
+}
+function xs(e, t) {
+  const n = so(e), s = new AbortController(), r = {
+    passive: !0,
+    ...t,
+    signal: s.signal
+  };
+  return [n, r, () => s.abort()];
+}
+function pn(e) {
+  return !(e.pointerType === "touch" || co());
+}
+function uo(e, t, n = {}) {
+  const [s, r, i] = xs(e, n), o = (a) => {
+    if (!pn(a))
+      return;
+    const { target: u } = a, l = t(u, a);
+    if (typeof l != "function" || !u)
+      return;
+    const c = (d) => {
+      pn(d) && (l(d), u.removeEventListener("pointerleave", c));
+    };
+    u.addEventListener("pointerleave", c, r);
+  };
+  return s.forEach((a) => {
+    a.addEventListener("pointerenter", o, r);
+  }), i;
+}
+const Ss = (e, t) => t ? e === t ? !0 : Ss(e, t.parentElement) : !1, lo = (e) => e.pointerType === "mouse" ? typeof e.button != "number" || e.button <= 0 : e.isPrimary !== !1, fo = /* @__PURE__ */ new Set([
+  "BUTTON",
+  "INPUT",
+  "SELECT",
+  "TEXTAREA",
+  "A"
+]);
+function ho(e) {
+  return fo.has(e.tagName) || e.tabIndex !== -1;
+}
+const Pe = /* @__PURE__ */ new WeakSet();
+function mn(e) {
+  return (t) => {
+    t.key === "Enter" && e(t);
+  };
+}
+function Ye(e, t) {
+  e.dispatchEvent(new PointerEvent("pointer" + t, { isPrimary: !0, bubbles: !0 }));
+}
+const po = (e, t) => {
+  const n = e.currentTarget;
+  if (!n)
+    return;
+  const s = mn(() => {
+    if (Pe.has(n))
+      return;
+    Ye(n, "down");
+    const r = mn(() => {
+      Ye(n, "up");
+    }), i = () => Ye(n, "cancel");
+    n.addEventListener("keyup", r, t), n.addEventListener("blur", i, t);
+  });
+  n.addEventListener("keydown", s, t), n.addEventListener("blur", () => n.removeEventListener("keydown", s), t);
+};
+function gn(e) {
+  return lo(e) && !0;
+}
+function mo(e, t, n = {}) {
+  const [s, r, i] = xs(e, n), o = (a) => {
+    const u = a.currentTarget;
+    if (!gn(a))
+      return;
+    Pe.add(u);
+    const l = t(u, a), c = (h, m) => {
+      window.removeEventListener("pointerup", d), window.removeEventListener("pointercancel", f), Pe.has(u) && Pe.delete(u), gn(h) && typeof l == "function" && l(h, { success: m });
+    }, d = (h) => {
+      c(h, u === window || u === document || n.useGlobalTarget || Ss(u, h.target));
+    }, f = (h) => {
+      c(h, !1);
+    };
+    window.addEventListener("pointerup", d, r), window.addEventListener("pointercancel", f, r);
+  };
+  return s.forEach((a) => {
+    (n.useGlobalTarget ? window : a).addEventListener("pointerdown", o, r), hs(a) && (a.addEventListener("focus", (l) => po(l, r)), !ho(a) && !a.hasAttribute("tabindex") && (a.tabIndex = 0));
+  }), i;
+}
+const E = (e) => !!(e && e.getVelocity), go = [...bs, R, de], yo = (e) => go.find(ys(e)), Vs = ce({
+  transformPagePoint: (e) => e,
+  isStatic: !1,
+  reducedMotion: "never"
+}), It = ce({ strict: !1 }), yn = {
+  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"]
+}, oe = {};
+for (const e in yn)
+  oe[e] = {
+    isEnabled: (t) => yn[e].some((n) => !!t[n])
+  };
+function lt(e) {
+  for (const t in e)
+    oe[t] = {
+      ...oe[t],
+      ...e[t]
+    };
+}
+function bo({ children: e, features: t, strict: n = !1 }) {
+  const [, s] = or(!qe(t)), r = ye(void 0);
+  if (!qe(t)) {
+    const { renderer: i, ...o } = t;
+    r.current = i, lt(o);
+  }
+  return bt(() => {
+    qe(t) && t().then(({ renderer: i, ...o }) => {
+      lt(o), r.current = i, s(!0);
+    });
+  }, []), w(It.Provider, { value: { renderer: r.current, strict: n }, children: e });
+}
+function qe(e) {
+  return typeof e == "function";
+}
+const vo = /* @__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 ke(e) {
+  return e.startsWith("while") || e.startsWith("drag") && e !== "draggable" || e.startsWith("layout") || e.startsWith("onTap") || e.startsWith("onPan") || e.startsWith("onLayout") || vo.has(e);
+}
+let Cs = (e) => !ke(e);
+function To(e) {
+  typeof e == "function" && (Cs = (t) => t.startsWith("on") ? !ke(t) : e(t));
+}
+try {
+  To(require("@emotion/is-prop-valid").default);
+} catch {
+}
+function wo(e, t, n) {
+  const s = {};
+  for (const r in e)
+    r === "values" && typeof e.values == "object" || (Cs(r) || n === !0 && ke(r) || !t && !ke(r) || // If trying to use native HTML drag events, forward drag listeners
+    e.draggable && r.startsWith("onDrag")) && (s[r] = e[r]);
+  return s;
+}
+const $e = /* @__PURE__ */ ce({});
+function je(e) {
+  return e !== null && typeof e == "object" && typeof e.start == "function";
+}
+function we(e) {
+  return typeof e == "string" || Array.isArray(e);
+}
+const kt = [
+  "animate",
+  "whileInView",
+  "whileFocus",
+  "whileHover",
+  "whileTap",
+  "whileDrag",
+  "exit"
+], Bt = ["initial", ...kt];
+function We(e) {
+  return je(e.animate) || Bt.some((t) => we(e[t]));
+}
+function As(e) {
+  return !!(We(e) || e.variants);
+}
+function xo(e, t) {
+  if (We(e)) {
+    const { initial: n, animate: s } = e;
+    return {
+      initial: n === !1 || we(n) ? n : void 0,
+      animate: we(s) ? s : void 0
+    };
+  }
+  return e.inherit !== !1 ? t : {};
+}
+function So(e) {
+  const { initial: t, animate: n } = xo(e, B($e));
+  return Le(() => ({ initial: t, animate: n }), [bn(t), bn(n)]);
+}
+function bn(e) {
+  return Array.isArray(e) ? e.join(" ") : e;
+}
+const Vo = Symbol.for("motionComponentSymbol");
+function Ms(e) {
+  return e && typeof e == "object" && Object.prototype.hasOwnProperty.call(e, "current");
+}
+function Co(e, t, n) {
+  return ar(
+    (s) => {
+      s && e.onMount && e.onMount(s), t && (s ? t.mount(s) : t.unmount()), n && (typeof n == "function" ? n(s) : Ms(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 Lt = (e) => e.replace(/([a-z])([A-Z])/gu, "$1-$2").toLowerCase(), Ao = "framerAppearId", Ps = "data-" + Lt(Ao), Mo = ce({});
+function Po(e, t, n, s, r) {
+  var g, y;
+  const { visualElement: i } = B($e), o = B(It), a = B(On), u = B(Vs).reducedMotion, l = ye(null);
+  s = s || o.renderer, !l.current && s && (l.current = s(e, {
+    visualState: t,
+    parent: i,
+    props: n,
+    presenceContext: a,
+    blockInitialAnimation: a ? a.initial === !1 : !1,
+    reducedMotionConfig: u
+  }));
+  const c = l.current, d = B(Mo);
+  c && !c.projection && r && (c.type === "html" || c.type === "svg") && Ro(l.current, n, r, d);
+  const f = ye(!1);
+  cr(() => {
+    c && f.current && c.update(n, a);
+  });
+  const h = n[Ps], m = ye(!!h && !((g = window.MotionHandoffIsComplete) != null && g.call(window, h)) && ((y = window.MotionHasOptimisedAnimation) == null ? void 0 : y.call(window, h)));
+  return pr(() => {
+    c && (f.current = !0, window.MotionIsMounted = !0, c.updateFeatures(), oo.render(c.render), m.current && c.animationState && c.animationState.animateChanges());
+  }), bt(() => {
+    c && (!m.current && c.animationState && c.animationState.animateChanges(), m.current && (queueMicrotask(() => {
+      var p;
+      (p = window.MotionHandoffMarkAsComplete) == null || p.call(window, h);
+    }), m.current = !1));
+  }), c;
+}
+function Ro(e, t, n, s) {
+  const { layoutId: r, layout: i, drag: o, dragConstraints: a, layoutScroll: u, layoutRoot: l, layoutCrossfade: c } = t;
+  e.projection = new n(e.latestValues, t["data-framer-portal-id"] ? void 0 : Rs(e.parent)), e.projection.setOptions({
+    layoutId: r,
+    layout: i,
+    alwaysMeasureLayout: !!o || a && Ms(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 i == "string" ? i : "both",
+    initialPromotionConfig: s,
+    crossfade: c,
+    layoutScroll: u,
+    layoutRoot: l
+  });
+}
+function Rs(e) {
+  if (e)
+    return e.options.allowProjection !== !1 ? e.projection : Rs(e.parent);
+}
+function Fo({ preloadedFeatures: e, createVisualElement: t, useRender: n, useVisualState: s, Component: r }) {
+  e && lt(e);
+  function i(a, u) {
+    let l;
+    const c = {
+      ...B(Vs),
+      ...a,
+      layoutId: Do(a)
+    }, { isStatic: d } = c, f = So(a), h = s(a, d);
+    if (!d && Tt) {
+      Oo(c, e);
+      const m = Eo(c);
+      l = m.MeasureLayout, f.visualElement = Po(r, h, c, t, m.ProjectionNode);
+    }
+    return G($e.Provider, { value: f, children: [l && f.visualElement ? w(l, { visualElement: f.visualElement, ...c }) : null, n(r, a, Co(h, f.visualElement, u), h, d, f.visualElement)] });
+  }
+  i.displayName = `motion.${typeof r == "string" ? r : `create(${r.displayName ?? r.name ?? ""})`}`;
+  const o = ur(i);
+  return o[Vo] = r, o;
+}
+function Do({ layoutId: e }) {
+  const t = B(dr).id;
+  return t && e !== void 0 ? t + "-" + e : e;
+}
+function Oo(e, t) {
+  const n = B(It).strict;
+  if (process.env.NODE_ENV !== "production" && t && n) {
+    const s = "You have rendered a `motion` component within a `LazyMotion` component. This will break tree shaking. Import and render a `m` component instead.";
+    e.ignoreStrict ? ue(!1, s) : U(!1, s);
+  }
+}
+function Eo(e) {
+  const { drag: t, layout: n } = oe;
+  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 Io = {};
+function Fs(e, { layout: t, layoutId: n }) {
+  return pe.has(e) || e.startsWith("origin") || (t || n !== void 0) && (!!Io[e] || e === "opacity");
+}
+const ko = {
+  x: "translateX",
+  y: "translateY",
+  z: "translateZ",
+  transformPerspective: "perspective"
+}, Bo = he.length;
+function Lo(e, t, n) {
+  let s = "", r = !0;
+  for (let i = 0; i < Bo; i++) {
+    const o = he[i], a = e[o];
+    if (a === void 0)
+      continue;
+    let u = !0;
+    if (typeof a == "number" ? u = a === (o.startsWith("scale") ? 1 : 0) : u = parseFloat(a) === 0, !u || n) {
+      const l = ws(a, Et[o]);
+      if (!u) {
+        r = !1;
+        const c = ko[o] || o;
+        s += `${c}(${l}) `;
+      }
+      n && (t[o] = l);
+    }
+  }
+  return s = s.trim(), n ? s = n(t, r ? "" : s) : r && (s = "none"), s;
+}
+function Nt(e, t, n) {
+  const { style: s, vars: r, transformOrigin: i } = e;
+  let o = !1, a = !1;
+  for (const u in t) {
+    const l = t[u];
+    if (pe.has(u)) {
+      o = !0;
+      continue;
+    } else if (Xn(u)) {
+      r[u] = l;
+      continue;
+    } else {
+      const c = ws(l, Et[u]);
+      u.startsWith("origin") ? (a = !0, i[u] = c) : s[u] = c;
+    }
+  }
+  if (t.transform || (o || n ? s.transform = Lo(t, e.transform, n) : s.transform && (s.transform = "none")), a) {
+    const { originX: u = "50%", originY: l = "50%", originZ: c = 0 } = i;
+    s.transformOrigin = `${u} ${l} ${c}`;
+  }
+}
+const Kt = () => ({
+  style: {},
+  transform: {},
+  transformOrigin: {},
+  vars: {}
+});
+function Ds(e, t, n) {
+  for (const s in t)
+    !E(t[s]) && !Fs(s, n) && (e[s] = t[s]);
+}
+function No({ transformTemplate: e }, t) {
+  return Le(() => {
+    const n = Kt();
+    return Nt(n, t, e), Object.assign({}, n.vars, n.style);
+  }, [t]);
+}
+function Ko(e, t) {
+  const n = e.style || {}, s = {};
+  return Ds(s, n, e), Object.assign(s, No(e, t)), s;
+}
+function $o(e, t) {
+  const n = {}, s = Ko(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 jo = {
+  offset: "stroke-dashoffset",
+  array: "stroke-dasharray"
+}, Wo = {
+  offset: "strokeDashoffset",
+  array: "strokeDasharray"
+};
+function _o(e, t, n = 1, s = 0, r = !0) {
+  e.pathLength = 1;
+  const i = r ? jo : Wo;
+  e[i.offset] = T.transform(-s);
+  const o = T.transform(t), a = T.transform(n);
+  e[i.array] = `${o} ${a}`;
+}
+function Os(e, {
+  attrX: t,
+  attrY: n,
+  attrScale: s,
+  pathLength: r,
+  pathSpacing: i = 1,
+  pathOffset: o = 0,
+  // This is object creation, which we try to avoid per-frame.
+  ...a
+}, u, l, c) {
+  if (Nt(e, a, l), u) {
+    e.style.viewBox && (e.attrs.viewBox = e.style.viewBox);
+    return;
+  }
+  e.attrs = e.style, e.style = {};
+  const { attrs: d, style: f } = e;
+  d.transform && (f.transform = d.transform, delete d.transform), (f.transform || d.transformOrigin) && (f.transformOrigin = d.transformOrigin ?? "50% 50%", delete d.transformOrigin), f.transform && (f.transformBox = (c == null ? void 0 : c.transformBox) ?? "fill-box", delete d.transformBox), t !== void 0 && (d.x = t), n !== void 0 && (d.y = n), s !== void 0 && (d.scale = s), r !== void 0 && _o(d, r, i, o, !1);
+}
+const Es = () => ({
+  ...Kt(),
+  attrs: {}
+}), Is = (e) => typeof e == "string" && e.toLowerCase() === "svg";
+function Ho(e, t, n, s) {
+  const r = Le(() => {
+    const i = Es();
+    return Os(i, t, Is(s), e.transformTemplate, e.style), {
+      ...i.attrs,
+      style: { ...i.style }
+    };
+  }, [t]);
+  if (e.style) {
+    const i = {};
+    Ds(i, e.style, e), r.style = { ...i, ...r.style };
+  }
+  return r;
+}
+const Go = [
+  "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 $t(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
+       */
+      !!(Go.indexOf(e) > -1 || /**
+       * If it contains a capital letter, it's an SVG component
+       */
+      /[A-Z]/u.test(e))
+    )
+  );
+}
+function Uo(e = !1) {
+  return (n, s, r, { latestValues: i }, o) => {
+    const u = ($t(n) ? Ho : $o)(s, i, o, n), l = wo(s, typeof n == "string", e), c = n !== Fn ? { ...l, ...u, ref: r } : {}, { children: d } = s, f = Le(() => E(d) ? d.get() : d, [d]);
+    return lr(n, {
+      ...c,
+      children: f
+    });
+  };
+}
+function vn(e) {
+  const t = [{}, {}];
+  return e == null || e.values.forEach((n, s) => {
+    t[0][s] = n.get(), t[1][s] = n.getVelocity();
+  }), t;
+}
+function jt(e, t, n, s) {
+  if (typeof t == "function") {
+    const [r, i] = vn(s);
+    t = t(n !== void 0 ? n : e.custom, r, i);
+  }
+  if (typeof t == "string" && (t = e.variants && e.variants[t]), typeof t == "function") {
+    const [r, i] = vn(s);
+    t = t(n !== void 0 ? n : e.custom, r, i);
+  }
+  return t;
+}
+function zo(e) {
+  return E(e) ? e.get() : e;
+}
+function Yo({ scrapeMotionValuesFromProps: e, createRenderState: t }, n, s, r) {
+  return {
+    latestValues: qo(n, s, r, e),
+    renderState: t()
+  };
+}
+const ks = (e) => (t, n) => {
+  const s = B($e), r = B(On), i = () => Yo(e, t, s, r);
+  return n ? i() : hr(i);
+};
+function qo(e, t, n, s) {
+  const r = {}, i = s(e, {});
+  for (const f in i)
+    r[f] = zo(i[f]);
+  let { initial: o, animate: a } = e;
+  const u = We(e), l = As(e);
+  t && l && !u && e.inherit !== !1 && (o === void 0 && (o = t.initial), a === void 0 && (a = t.animate));
+  let c = n ? n.initial === !1 : !1;
+  c = c || o === !1;
+  const d = c ? a : o;
+  if (d && typeof d != "boolean" && !je(d)) {
+    const f = Array.isArray(d) ? d : [d];
+    for (let h = 0; h < f.length; h++) {
+      const m = jt(e, f[h]);
+      if (m) {
+        const { transitionEnd: g, transition: y, ...p } = m;
+        for (const x in p) {
+          let v = p[x];
+          if (Array.isArray(v)) {
+            const A = c ? v.length - 1 : 0;
+            v = v[A];
+          }
+          v !== null && (r[x] = v);
+        }
+        for (const x in g)
+          r[x] = g[x];
+      }
+    }
+  }
+  return r;
+}
+function Wt(e, t, n) {
+  var i;
+  const { style: s } = e, r = {};
+  for (const o in s)
+    (E(s[o]) || t.style && E(t.style[o]) || Fs(o, e) || ((i = n == null ? void 0 : n.getValue(o)) == null ? void 0 : i.liveStyle) !== void 0) && (r[o] = s[o]);
+  return r;
+}
+const Xo = {
+  useVisualState: ks({
+    scrapeMotionValuesFromProps: Wt,
+    createRenderState: Kt
+  })
+};
+function Bs(e, t, n) {
+  const s = Wt(e, t, n);
+  for (const r in e)
+    if (E(e[r]) || E(t[r])) {
+      const i = he.indexOf(r) !== -1 ? "attr" + r.charAt(0).toUpperCase() + r.substring(1) : r;
+      s[i] = e[r];
+    }
+  return s;
+}
+const Qo = {
+  useVisualState: ks({
+    scrapeMotionValuesFromProps: Bs,
+    createRenderState: Es
+  })
+};
+function Zo(e, t) {
+  return function(s, { forwardMotionProps: r } = { forwardMotionProps: !1 }) {
+    const o = {
+      ...$t(s) ? Qo : Xo,
+      preloadedFeatures: e,
+      useRender: Uo(r),
+      createVisualElement: t,
+      Component: s
+    };
+    return Fo(o);
+  };
+}
+const Ls = /* @__PURE__ */ Zo();
+function xe(e, t, n) {
+  const s = e.getProps();
+  return jt(s, t, n !== void 0 ? n : s.custom, e);
+}
+const ft = (e) => Array.isArray(e);
+function Jo(e, t, n) {
+  e.hasValue(t) ? e.getValue(t).set(n) : e.addValue(t, Ie(n));
+}
+function ea(e) {
+  return ft(e) ? e[e.length - 1] || 0 : e;
+}
+function ta(e, t) {
+  const n = xe(e, t);
+  let { transitionEnd: s = {}, transition: r = {}, ...i } = n || {};
+  i = { ...i, ...s };
+  for (const o in i) {
+    const a = ea(i[o]);
+    Jo(e, o, a);
+  }
+}
+function na(e) {
+  return !!(E(e) && e.add);
+}
+function sa(e, t) {
+  const n = e.getValue("willChange");
+  if (na(n))
+    return n.add(t);
+  if (!n && j.WillChange) {
+    const s = new j.WillChange("auto");
+    e.addValue("willChange", s), s.add(t);
+  }
+}
+function ra(e) {
+  return e.props[Ps];
+}
+const ia = (e) => e !== null;
+function oa(e, { repeat: t, repeatType: n = "loop" }, s) {
+  const r = e.filter(ia), i = t && n !== "loop" && t % 2 === 1 ? 0 : r.length - 1;
+  return r[i];
+}
+const aa = {
+  type: "spring",
+  stiffness: 500,
+  damping: 25,
+  restSpeed: 10
+}, ca = (e) => ({
+  type: "spring",
+  stiffness: 550,
+  damping: e === 0 ? 2 * Math.sqrt(550) : 30,
+  restSpeed: 10
+}), ua = {
+  type: "keyframes",
+  duration: 0.8
+}, la = {
+  type: "keyframes",
+  ease: [0.25, 0.1, 0.35, 1],
+  duration: 0.3
+}, fa = (e, { keyframes: t }) => t.length > 2 ? ua : pe.has(e) ? e.startsWith("scale") ? ca(t[1]) : aa : la;
+function da({ when: e, delay: t, delayChildren: n, staggerChildren: s, staggerDirection: r, repeat: i, repeatType: o, repeatDelay: a, from: u, elapsed: l, ...c }) {
+  return !!Object.keys(c).length;
+}
+const ha = (e, t, n, s = {}, r, i) => (o) => {
+  const a = ms(s, e) || {}, u = a.delay || s.delay || 0;
+  let { elapsed: l = 0 } = s;
+  l = l - /* @__PURE__ */ N(u);
+  const c = {
+    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: i ? void 0 : r
+  };
+  da(a) || Object.assign(c, fa(e, c)), c.duration && (c.duration = /* @__PURE__ */ N(c.duration)), c.repeatDelay && (c.repeatDelay = /* @__PURE__ */ N(c.repeatDelay)), c.from !== void 0 && (c.keyframes[0] = c.from);
+  let d = !1;
+  if ((c.type === !1 || c.duration === 0 && !c.repeatDelay) && (c.duration = 0, c.delay === 0 && (d = !0)), (j.instantAnimations || j.skipAnimations) && (d = !0, c.duration = 0, c.delay = 0), c.allowFlatten = !a.type && !a.ease, d && !i && t.get() !== void 0) {
+    const f = oa(c.keyframes, a);
+    if (f !== void 0) {
+      L.update(() => {
+        c.onUpdate(f), c.onComplete();
+      });
+      return;
+    }
+  }
+  return a.isSync ? new Dt(c) : new _i(c);
+};
+function pa({ protectedKeys: e, needsAnimating: t }, n) {
+  const s = e.hasOwnProperty(n) && t[n] !== !0;
+  return t[n] = !1, s;
+}
+function Ns(e, t, { delay: n = 0, transitionOverride: s, type: r } = {}) {
+  let { transition: i = e.getDefaultTransition(), transitionEnd: o, ...a } = t;
+  s && (i = s);
+  const u = [], l = r && e.animationState && e.animationState.getState()[r];
+  for (const c in a) {
+    const d = e.getValue(c, e.latestValues[c] ?? null), f = a[c];
+    if (f === void 0 || l && pa(l, c))
+      continue;
+    const h = {
+      delay: n,
+      ...ms(i || {}, c)
+    }, m = d.get();
+    if (m !== void 0 && !d.isAnimating && !Array.isArray(f) && f === m && !h.velocity)
+      continue;
+    let g = !1;
+    if (window.MotionHandoffAnimation) {
+      const p = ra(e);
+      if (p) {
+        const x = window.MotionHandoffAnimation(p, c, L);
+        x !== null && (h.startTime = x, g = !0);
+      }
+    }
+    sa(e, c), d.start(ha(c, d, f, e.shouldReduceMotion && gs.has(c) ? { type: !1 } : h, e, g));
+    const y = d.animation;
+    y && u.push(y);
+  }
+  return o && Promise.all(u).then(() => {
+    L.update(() => {
+      o && ta(e, o);
+    });
+  }), u;
+}
+function dt(e, t, n = {}) {
+  var u;
+  const s = xe(e, t, n.type === "exit" ? (u = e.presenceContext) == null ? void 0 : u.custom : void 0);
+  let { transition: r = e.getDefaultTransition() || {} } = s || {};
+  n.transitionOverride && (r = n.transitionOverride);
+  const i = s ? () => Promise.all(Ns(e, s, n)) : () => Promise.resolve(), o = e.variantChildren && e.variantChildren.size ? (l = 0) => {
+    const { delayChildren: c = 0, staggerChildren: d, staggerDirection: f } = r;
+    return ma(e, t, l, c, d, f, n);
+  } : () => Promise.resolve(), { when: a } = r;
+  if (a) {
+    const [l, c] = a === "beforeChildren" ? [i, o] : [o, i];
+    return l().then(() => c());
+  } else
+    return Promise.all([i(), o(n.delay)]);
+}
+function ma(e, t, n = 0, s = 0, r = 0, i = 1, o) {
+  const a = [], u = e.variantChildren.size, l = (u - 1) * r, c = typeof s == "function", d = c ? (f) => s(f, u) : (
+    // Support deprecated staggerChildren
+    i === 1 ? (f = 0) => f * r : (f = 0) => l - f * r
+  );
+  return Array.from(e.variantChildren).sort(ga).forEach((f, h) => {
+    f.notify("AnimationStart", t), a.push(dt(f, t, {
+      ...o,
+      delay: n + (c ? 0 : s) + d(h)
+    }).then(() => f.notify("AnimationComplete", t)));
+  }), Promise.all(a);
+}
+function ga(e, t) {
+  return e.sortNodePosition(t);
+}
+function ya(e, t, n = {}) {
+  e.notify("AnimationStart", t);
+  let s;
+  if (Array.isArray(t)) {
+    const r = t.map((i) => dt(e, i, n));
+    s = Promise.all(r);
+  } else if (typeof t == "string")
+    s = dt(e, t, n);
+  else {
+    const r = typeof t == "function" ? xe(e, t, n.custom) : t;
+    s = Promise.all(Ns(e, r, n));
+  }
+  return s.then(() => {
+    e.notify("AnimationComplete", t);
+  });
+}
+function Ks(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 ba = Bt.length;
+function $s(e) {
+  if (!e)
+    return;
+  if (!e.isControllingVariants) {
+    const n = e.parent ? $s(e.parent) || {} : {};
+    return e.props.initial !== void 0 && (n.initial = e.props.initial), n;
+  }
+  const t = {};
+  for (let n = 0; n < ba; n++) {
+    const s = Bt[n], r = e.props[s];
+    (we(r) || r === !1) && (t[s] = r);
+  }
+  return t;
+}
+const va = [...kt].reverse(), Ta = kt.length;
+function wa(e) {
+  return (t) => Promise.all(t.map(({ animation: n, options: s }) => ya(e, n, s)));
+}
+function xa(e) {
+  let t = wa(e), n = Tn(), s = !0;
+  const r = (u) => (l, c) => {
+    var f;
+    const d = xe(e, c, u === "exit" ? (f = e.presenceContext) == null ? void 0 : f.custom : void 0);
+    if (d) {
+      const { transition: h, transitionEnd: m, ...g } = d;
+      l = { ...l, ...g, ...m };
+    }
+    return l;
+  };
+  function i(u) {
+    t = u(e);
+  }
+  function o(u) {
+    const { props: l } = e, c = $s(e.parent) || {}, d = [], f = /* @__PURE__ */ new Set();
+    let h = {}, m = 1 / 0;
+    for (let y = 0; y < Ta; y++) {
+      const p = va[y], x = n[p], v = l[p] !== void 0 ? l[p] : c[p], A = we(v), S = p === u ? x.isActive : null;
+      S === !1 && (m = y);
+      let C = v === c[p] && v !== l[p] && A;
+      if (C && s && e.manuallyAnimateOnMount && (C = !1), x.protectedKeys = { ...h }, // If it isn't active and hasn't *just* been set as inactive
+      !x.isActive && S === null || // If we didn't and don't have any defined prop for this animation type
+      !v && !x.prevProp || // Or if the prop doesn't define an animation
+      je(v) || typeof v == "boolean")
+        continue;
+      const M = Sa(x.prevProp, v);
+      let V = M || // If we're making this variant active, we want to always make it active
+      p === u && x.isActive && !C && A || // If we removed a higher-priority variant (i is in reverse order)
+      y > m && A, F = !1;
+      const I = Array.isArray(v) ? v : [v];
+      let te = I.reduce(r(p), {});
+      S === !1 && (te = {});
+      const { prevResolvedValues: Gt = {} } = x, Xs = {
+        ...Gt,
+        ...te
+      }, Ut = (O) => {
+        V = !0, f.has(O) && (F = !0, f.delete(O)), x.needsAnimating[O] = !0;
+        const K = e.getValue(O);
+        K && (K.liveStyle = !1);
+      };
+      for (const O in Xs) {
+        const K = te[O], _e = Gt[O];
+        if (h.hasOwnProperty(O))
+          continue;
+        let He = !1;
+        ft(K) && ft(_e) ? He = !Ks(K, _e) : He = K !== _e, He ? K != null ? Ut(O) : f.add(O) : K !== void 0 && f.has(O) ? Ut(O) : x.protectedKeys[O] = !0;
+      }
+      x.prevProp = v, x.prevResolvedValues = te, x.isActive && (h = { ...h, ...te }), s && e.blockInitialAnimation && (V = !1), V && (!(C && M) || F) && d.push(...I.map((O) => ({
+        animation: O,
+        options: { type: p }
+      })));
+    }
+    if (f.size) {
+      const y = {};
+      if (typeof l.initial != "boolean") {
+        const p = xe(e, Array.isArray(l.initial) ? l.initial[0] : l.initial);
+        p && p.transition && (y.transition = p.transition);
+      }
+      f.forEach((p) => {
+        const x = e.getBaseTarget(p), v = e.getValue(p);
+        v && (v.liveStyle = !0), y[p] = x ?? null;
+      }), d.push({ animation: y });
+    }
+    let g = !!d.length;
+    return s && (l.initial === !1 || l.initial === l.animate) && !e.manuallyAnimateOnMount && (g = !1), s = !1, g ? t(d) : Promise.resolve();
+  }
+  function a(u, l) {
+    var d;
+    if (n[u].isActive === l)
+      return Promise.resolve();
+    (d = e.variantChildren) == null || d.forEach((f) => {
+      var h;
+      return (h = f.animationState) == null ? void 0 : h.setActive(u, l);
+    }), n[u].isActive = l;
+    const c = o(u);
+    for (const f in n)
+      n[f].protectedKeys = {};
+    return c;
+  }
+  return {
+    animateChanges: o,
+    setActive: a,
+    setAnimateFunction: i,
+    getState: () => n,
+    reset: () => {
+      n = Tn(), s = !0;
+    }
+  };
+}
+function Sa(e, t) {
+  return typeof t == "string" ? t !== e : Array.isArray(t) ? !Ks(t, e) : !1;
+}
+function Y(e = !1) {
+  return {
+    isActive: e,
+    protectedKeys: {},
+    needsAnimating: {},
+    prevResolvedValues: {}
+  };
+}
+function Tn() {
+  return {
+    animate: Y(!0),
+    whileInView: Y(),
+    whileHover: Y(),
+    whileTap: Y(),
+    whileDrag: Y(),
+    whileFocus: Y(),
+    exit: Y()
+  };
+}
+class me {
+  constructor(t) {
+    this.isMounted = !1, this.node = t;
+  }
+  update() {
+  }
+}
+class Va extends me {
+  /**
+   * 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 = xa(t));
+  }
+  updateAnimationControlsSubscription() {
+    const { animate: t } = this.node.getProps();
+    je(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 Ca = 0;
+class Aa extends me {
+  constructor() {
+    super(...arguments), this.id = Ca++;
+  }
+  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 r = this.node.animationState.setActive("exit", !t);
+    n && !t && r.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 Ma = {
+  animation: {
+    Feature: Va
+  },
+  exit: {
+    Feature: Aa
+  }
+};
+function wn(e, t, n, s = { passive: !0 }) {
+  return e.addEventListener(t, n, s), () => e.removeEventListener(t, n);
+}
+function js(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 Ra(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 xn = () => ({ min: 0, max: 0 }), Ws = () => ({
+  x: xn(),
+  y: xn()
+});
+function Fa(e, t) {
+  return Pa(Ra(e.getBoundingClientRect(), t));
+}
+function Sn(e, t, n) {
+  const { props: s } = e;
+  e.animationState && s.whileHover && e.animationState.setActive("whileHover", n === "Start");
+  const r = "onHover" + n, i = s[r];
+  i && L.postRender(() => i(t, js(t)));
+}
+class Da extends me {
+  mount() {
+    const { current: t } = this.node;
+    t && (this.unmount = uo(t, (n, s) => (Sn(this.node, s, "Start"), (r) => Sn(this.node, r, "End"))));
+  }
+  unmount() {
+  }
+}
+class Oa extends me {
+  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 = Ne(wn(this.node.current, "focus", () => this.onFocus()), wn(this.node.current, "blur", () => this.onBlur()));
+  }
+  unmount() {
+  }
+}
+function Vn(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 r = "onTap" + (n === "End" ? "" : n), i = s[r];
+  i && L.postRender(() => i(t, js(t)));
+}
+class Ea extends me {
+  mount() {
+    const { current: t } = this.node;
+    t && (this.unmount = mo(t, (n, s) => (Vn(this.node, s, "Start"), (r, { success: i }) => Vn(this.node, r, i ? "End" : "Cancel")), { useGlobalTarget: this.node.props.globalTapTarget }));
+  }
+  unmount() {
+  }
+}
+const ht = /* @__PURE__ */ new WeakMap(), Xe = /* @__PURE__ */ new WeakMap(), Ia = (e) => {
+  const t = ht.get(e.target);
+  t && t(e);
+}, ka = (e) => {
+  e.forEach(Ia);
+};
+function Ba({ root: e, ...t }) {
+  const n = e || document;
+  Xe.has(n) || Xe.set(n, {});
+  const s = Xe.get(n), r = JSON.stringify(t);
+  return s[r] || (s[r] = new IntersectionObserver(ka, { root: e, ...t })), s[r];
+}
+function La(e, t, n) {
+  const s = Ba(t);
+  return ht.set(e, n), s.observe(e), () => {
+    ht.delete(e), s.unobserve(e);
+  };
+}
+const Na = {
+  some: 0,
+  all: 1
+};
+class Ka extends me {
+  constructor() {
+    super(...arguments), this.hasEnteredView = !1, this.isInView = !1;
+  }
+  startObserver() {
+    this.unmount();
+    const { viewport: t = {} } = this.node.getProps(), { root: n, margin: s, amount: r = "some", once: i } = t, o = {
+      root: n ? n.current : void 0,
+      rootMargin: s,
+      threshold: typeof r == "number" ? r : Na[r]
+    }, a = (u) => {
+      const { isIntersecting: l } = u;
+      if (this.isInView === l || (this.isInView = l, i && !l && this.hasEnteredView))
+        return;
+      l && (this.hasEnteredView = !0), this.node.animationState && this.node.animationState.setActive("whileInView", l);
+      const { onViewportEnter: c, onViewportLeave: d } = this.node.getProps(), f = l ? c : d;
+      f && f(u);
+    };
+    return La(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($a(t, n)) && this.startObserver();
+  }
+  unmount() {
+  }
+}
+function $a({ viewport: e = {} }, { viewport: t = {} } = {}) {
+  return (n) => e[n] !== t[n];
+}
+const ja = {
+  inView: {
+    Feature: Ka
+  },
+  tap: {
+    Feature: Ea
+  },
+  focus: {
+    Feature: Oa
+  },
+  hover: {
+    Feature: Da
+  }
+}, pt = { current: null }, _s = { current: !1 };
+function Wa() {
+  if (_s.current = !0, !!Tt)
+    if (window.matchMedia) {
+      const e = window.matchMedia("(prefers-reduced-motion)"), t = () => pt.current = e.matches;
+      e.addEventListener("change", t), t();
+    } else
+      pt.current = !1;
+}
+const _a = /* @__PURE__ */ new WeakMap();
+function Ha(e, t, n) {
+  for (const s in t) {
+    const r = t[s], i = n[s];
+    if (E(r))
+      e.addValue(s, r);
+    else if (E(i))
+      e.addValue(s, Ie(r, { owner: e }));
+    else if (i !== r)
+      if (e.hasValue(s)) {
+        const o = e.getValue(s);
+        o.liveStyle === !0 ? o.jump(r) : o.hasAnimated || o.set(r);
+      } else {
+        const o = e.getStaticValue(s);
+        e.addValue(s, Ie(o !== void 0 ? o : r, { owner: e }));
+      }
+  }
+  for (const s in n)
+    t[s] === void 0 && e.removeValue(s);
+  return t;
+}
+const Cn = [
+  "AnimationStart",
+  "AnimationComplete",
+  "Update",
+  "BeforeLayoutMeasure",
+  "LayoutMeasure",
+  "LayoutAnimationStart",
+  "LayoutAnimationComplete"
+];
+class Ga {
+  /**
+   * 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: r, blockInitialAnimation: i, 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 = Ot, 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 = k.now();
+      this.renderScheduledAt < f && (this.renderScheduledAt = f, L.render(this.render, !1, !0));
+    };
+    const { latestValues: u, renderState: l } = o;
+    this.latestValues = u, this.baseTarget = { ...u }, this.initialValues = n.initial ? { ...u } : {}, this.renderState = l, this.parent = t, this.props = n, this.presenceContext = s, this.depth = t ? t.depth + 1 : 0, this.reducedMotionConfig = r, this.options = a, this.blockInitialAnimation = !!i, this.isControllingVariants = We(n), this.isVariantNode = As(n), this.isVariantNode && (this.variantChildren = /* @__PURE__ */ new Set()), this.manuallyAnimateOnMount = !!(t && t.current);
+    const { willChange: c, ...d } = this.scrapeMotionValuesFromProps(n, {}, this);
+    for (const f in d) {
+      const h = d[f];
+      u[f] !== void 0 && E(h) && h.set(u[f], !1);
+    }
+  }
+  mount(t) {
+    this.current = t, _a.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)), _s.current || Wa(), this.shouldReduceMotion = this.reducedMotionConfig === "never" ? !1 : this.reducedMotionConfig === "always" ? !0 : pt.current, process.env.NODE_ENV !== "production" && Nn(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(), Qe(this.notifyUpdate), Qe(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 = pe.has(t);
+    s && this.onBindTransform && this.onBindTransform();
+    const r = n.on("change", (a) => {
+      this.latestValues[t] = a, this.props.onUpdate && L.preRender(this.notifyUpdate), s && this.projection && (this.projection.isTransformDirty = !0);
+    }), i = n.on("renderRequest", this.scheduleRender);
+    let o;
+    window.MotionCheckAppearSync && (o = window.MotionCheckAppearSync(this, t, n)), this.valueSubscriptions.set(t, () => {
+      r(), i(), 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 oe) {
+      const n = oe[t];
+      if (!n)
+        continue;
+      const { isEnabled: s, Feature: r } = n;
+      if (!this.features[t] && r && s(this.props) && (this.features[t] = new r(this)), this.features[t]) {
+        const i = this.features[t];
+        i.isMounted ? i.update() : (i.mount(), i.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) : Ws();
+  }
+  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 < Cn.length; s++) {
+      const r = Cn[s];
+      this.propEventSubscriptions[r] && (this.propEventSubscriptions[r](), delete this.propEventSubscriptions[r]);
+      const i = "on" + r, o = t[i];
+      o && (this.propEventSubscriptions[r] = this.on(r, o));
+    }
+    this.prevMotionValues = Ha(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 = Ie(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" && (En(s) || In(s)) ? s = parseFloat(s) : !yo(s) && de.test(n) && (s = Ts(t, n)), this.setBaseTarget(t, E(s) ? s.get() : s)), E(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 i;
+    const { initial: n } = this.props;
+    let s;
+    if (typeof n == "string" || typeof n == "object") {
+      const o = jt(this.props, n, (i = this.presenceContext) == null ? void 0 : i.custom);
+      o && (s = o[t]);
+    }
+    if (n && s !== void 0)
+      return s;
+    const r = this.getBaseTargetFromProps(this.props, t);
+    return r !== void 0 && !E(r) ? r : this.initialValues[t] !== void 0 && s === void 0 ? void 0 : this.baseTarget[t];
+  }
+  on(t, n) {
+    return this.events[t] || (this.events[t] = new Bn()), this.events[t].add(n);
+  }
+  notify(t, ...n) {
+    this.events[t] && this.events[t].notify(...n);
+  }
+}
+class Hs extends Ga {
+  constructor() {
+    super(...arguments), this.KeyframeResolver = no;
+  }
+  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;
+    E(t) && (this.childSubscription = t.on("change", (n) => {
+      this.current && (this.current.textContent = `${n}`);
+    }));
+  }
+}
+function Gs(e, { style: t, vars: n }, s, r) {
+  const i = e.style;
+  let o;
+  for (o in t)
+    i[o] = t[o];
+  r == null || r.applyProjectionStyles(i, s);
+  for (o in n)
+    i.setProperty(o, n[o]);
+}
+function Ua(e) {
+  return window.getComputedStyle(e);
+}
+class za extends Hs {
+  constructor() {
+    super(...arguments), this.type = "html", this.renderInstance = Gs;
+  }
+  readValueFromInstance(t, n) {
+    var s;
+    if (pe.has(n))
+      return (s = this.projection) != null && s.isProjecting ? rt(n) : Ti(t, n);
+    {
+      const r = Ua(t), i = (Xn(n) ? r.getPropertyValue(n) : r[n]) || 0;
+      return typeof i == "string" ? i.trim() : i;
+    }
+  }
+  measureInstanceViewportBox(t, { transformPagePoint: n }) {
+    return Fa(t, n);
+  }
+  build(t, n, s) {
+    Nt(t, n, s.transformTemplate);
+  }
+  scrapeMotionValuesFromProps(t, n, s) {
+    return Wt(t, n, s);
+  }
+}
+const Us = /* @__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 Ya(e, t, n, s) {
+  Gs(e, t, void 0, s);
+  for (const r in t.attrs)
+    e.setAttribute(Us.has(r) ? r : Lt(r), t.attrs[r]);
+}
+class qa extends Hs {
+  constructor() {
+    super(...arguments), this.type = "svg", this.isSVGTag = !1, this.measureInstanceViewportBox = Ws;
+  }
+  getBaseTargetFromProps(t, n) {
+    return t[n];
+  }
+  readValueFromInstance(t, n) {
+    if (pe.has(n)) {
+      const s = vs(n);
+      return s && s.default || 0;
+    }
+    return n = Us.has(n) ? n : Lt(n), t.getAttribute(n);
+  }
+  scrapeMotionValuesFromProps(t, n, s) {
+    return Bs(t, n, s);
+  }
+  build(t, n, s) {
+    Os(t, n, this.isSVGTag, s.transformTemplate, s.style);
+  }
+  renderInstance(t, n, s, r) {
+    Ya(t, n, s, r);
+  }
+  mount(t) {
+    this.isSVGTag = Is(t.tagName), super.mount(t);
+  }
+}
+const Xa = (e, t) => $t(e) ? new qa(t) : new za(t, {
+  allowProjection: e !== Fn
+}), Qa = {
+  renderer: Xa,
+  ...Ma,
+  ...ja
+}, Za = {
   0: "5",
   1: "6",
   2: "8",
   3: "10"
-}, R = (t) => Array.isArray(t), I = (t) => typeof t == "object" && !Array.isArray(t) || typeof t == "string" || !t, le = (t) => {
-  const o = (a, c = []) => (l.Children.toArray(a).forEach((i) => {
-    l.isValidElement(i) && (i.props.value ? c.push(i) : i.props.children && o(i.props.children, c));
-  }), c);
-  return o(t).map((a) => {
-    var n;
-    const c = a;
+}, z = (e) => Array.isArray(e), ee = (e) => typeof e == "object" && !Array.isArray(e) || typeof e == "string" || !e, Ja = (e) => {
+  const t = (r, i = []) => (b.Children.toArray(r).forEach((a) => {
+    b.isValidElement(a) && (a.props.value ? i.push(a) : a.props.children && t(a.props.children, i));
+  }), i);
+  return t(e).map((r) => {
+    var o;
+    const i = r;
     return {
-      value: c.props.value,
-      label: ((n = c.props) == null ? void 0 : n.label) || c.props.children || c.props.value
+      value: i.props.value,
+      label: ((o = i.props) == null ? void 0 : o.label) || i.props.children || i.props.value
     };
   });
-}, C = (t, o) => {
-  if (t)
-    return o === !0 ? t == null ? void 0 : t.value : t;
-}, F = (t, o, e) => {
-  if (!t || !o || o.length === 0) return;
-  const r = o.find(
-    (a) => a.value === C(t, e)
+}, H = (e, t) => {
+  if (e)
+    return t === !0 ? e == null ? void 0 : e.value : e;
+}, mt = (e, t, n) => {
+  if (!e || !t || t.length === 0) return;
+  const s = t.find(
+    (r) => r.value === H(e, n)
   );
-  if (r)
-    return r;
-}, se = ({
-  children: t,
-  value: o,
-  searchQuery: e
+  if (s)
+    return s;
+}, ec = ({
+  children: e,
+  value: t,
+  searchQuery: n
 }) => {
-  const r = X(t);
-  return (o == null ? void 0 : o.toLowerCase().includes(e.toLowerCase())) || r.some(
-    (a) => a.toLowerCase().includes(e.toLowerCase())
+  const s = zs(e);
+  return (t == null ? void 0 : t.toLowerCase().includes(n.toLowerCase())) || s.some(
+    (r) => r.toLowerCase().includes(n.toLowerCase())
   );
-}, X = (t) => {
-  const o = l.Children.toArray(t), e = [];
-  return o.forEach((r) => {
-    typeof r == "string" && e.push(r), l.isValidElement(r) && r.props.children && e.push(...X(r.props.children));
-  }), e;
-}, ue = ({
-  icon: t = E.ChevronDown,
-  "aria-hidden": o = !0,
-  ...e
+}, zs = (e) => {
+  const t = b.Children.toArray(e), n = [];
+  return t.forEach((s) => {
+    typeof s == "string" && n.push(s), b.isValidElement(s) && s.props.children && n.push(...zs(s.props.children));
+  }), n;
+}, tc = /* @__PURE__ */ Ls("div"), _t = /* @__PURE__ */ Ls("span"), nc = ({
+  icon: e = sr,
+  "aria-hidden": t = !0,
+  ...n
 }) => {
-  const r = l.useContext(y);
-  return /* @__PURE__ */ s(
-    O.Icon,
+  const s = b.useContext(D);
+  return /* @__PURE__ */ w(
+    ae.Icon,
     {
-      as: P.span,
-      animate: { rotate: r.open ? 180 : 0 },
-      transition: { duration: 150, type: "spring" },
-      icon: t,
-      "aria-hidden": o,
-      ...e
+      as: _t,
+      animate: { rotate: s.open ? 180 : 0 },
+      transition: { duration: 0.15, type: "spring", bounce: 0 },
+      icon: e,
+      "aria-hidden": t,
+      ...n
     }
   );
-}, pe = ({
-  tooltipProps: t,
-  ...o
+}, sc = ({
+  tooltipProps: e,
+  ...t
 }) => {
-  const e = l.useContext(y), r = () => {
-    var c, n;
-    if (R(e.value)) {
-      const i = e.onValueChange;
-      i == null || i([]);
-    }
-    if (I(e.value)) {
-      const i = e.onValueChange;
-      i == null || i(void 0);
-    }
-    (n = (c = e.triggerRef) == null ? void 0 : c.current) == null || n.focus();
-  };
-  return l.useMemo(() => {
-    var c;
-    if (I(e.value))
-      return e.clearable && e.value;
-    if (R(e.value))
-      return e.clearable && ((c = e.value) == null ? void 0 : c.length) > 0;
-  }, [e.clearable, e.value]) ? /* @__PURE__ */ s(ie, { label: "Clear field", ...t, children: /* @__PURE__ */ s(
-    O,
+  const n = b.useContext(D), s = () => {
+    var i, o;
+    if (z(n.value)) {
+      const a = n.onValueChange;
+      a == null || a([]);
+    }
+    if (ee(n.value)) {
+      const a = n.onValueChange;
+      a == null || a(void 0);
+    }
+    (o = (i = n.triggerRef) == null ? void 0 : i.current) == null || o.focus();
+  };
+  return b.useMemo(() => {
+    var i;
+    if (ee(n.value))
+      return n.clearable && n.value;
+    if (z(n.value))
+      return n.clearable && ((i = n.value) == null ? void 0 : i.length) > 0;
+  }, [n.clearable, n.value]) ? /* @__PURE__ */ w(fr, { label: "Clear field", ...e, children: /* @__PURE__ */ w(
+    ae,
     {
       type: "button",
-      icon: { icon: E.X, alt: "Clear field" },
+      icon: { icon: yt, alt: "Clear field" },
       size: "1",
       variant: "ghost",
-      onClick: (c) => {
-        e.value && (c.stopPropagation(), r());
+      onClick: (i) => {
+        n.value && (i.stopPropagation(), s());
       },
-      onKeyDown: (c) => {
-        (c.key === "Enter" || c.key === " ") && (c.stopPropagation(), r());
+      onKeyDown: (i) => {
+        (i.key === "Enter" || i.key === " ") && (i.stopPropagation(), s());
       },
       "data-tgph-combobox-clear": !0,
       style: {
@@ -116,225 +3377,191 @@ const ce = {
         marginTop: "calc(-1 * var(--tgph-spacing-1)",
         marginBottom: "calc(-1 * var(--tgph-spacing-1)"
       },
-      ...o
+      ...t
     }
   ) }) : null;
-}, ge = ({
-  children: t,
-  ...o
+}, rc = ({
+  children: e,
+  ...t
 }) => {
-  const e = l.useContext(y), r = l.useMemo(() => {
-    var i;
-    if (!I(e.value)) return;
-    const a = F(
-      e.value,
-      e.options,
-      e.legacyBehavior
-    ), c = (a == null ? void 0 : a.label) || (a == null ? void 0 : a.value) || e.placeholder, n = e.legacyBehavior && ((i = e == null ? void 0 : e.value) == null ? void 0 : i.label);
-    return n || c;
+  const n = b.useContext(D), s = b.useMemo(() => {
+    var a;
+    if (!ee(n.value)) return;
+    const r = mt(
+      n.value,
+      n.options,
+      n.legacyBehavior
+    ), i = (r == null ? void 0 : r.label) || (r == null ? void 0 : r.value) || n.placeholder, o = n.legacyBehavior && ((a = n == null ? void 0 : n.value) == null ? void 0 : a.label);
+    return o || i;
   }, [
-    e.value,
-    e.options,
-    e.legacyBehavior,
-    e.placeholder
+    n.value,
+    n.options,
+    n.legacyBehavior,
+    n.placeholder
   ]);
-  return /* @__PURE__ */ s(Y, { children: /* @__PURE__ */ s(
-    O.Text,
+  return /* @__PURE__ */ w(Dn, { children: /* @__PURE__ */ w(
+    ae.Text,
     {
-      color: e.value ? "default" : "gray",
+      color: n.value ? "default" : "gray",
       textOverflow: "ellipsis",
       overflow: "hidden",
-      ...o,
-      children: t || r
+      ...t,
+      children: e || s
     }
   ) });
-}, fe = ({
-  children: t,
-  ...o
+}, ic = ({
+  children: e,
+  ...t
 }) => {
-  const e = l.useContext(y);
-  return /* @__PURE__ */ s(Y, { children: /* @__PURE__ */ s(
-    O.Text,
+  const n = b.useContext(D);
+  return /* @__PURE__ */ w(Dn, { children: /* @__PURE__ */ w(
+    ae.Text,
     {
       color: "gray",
       textOverflow: "ellipsis",
       overflow: "hidden",
-      ...o,
-      children: t || e.placeholder
+      ...t,
+      children: e || n.placeholder
     }
   ) });
-}, he = ({ children: t }) => {
-  const o = l.useContext(y);
-  if (!R(o.value)) return null;
-  const e = o.layout || "truncate", a = (o.value.length - 2).toString().split("");
-  return /* @__PURE__ */ w(
-    k,
+}, oc = ({ children: e }) => {
+  const t = b.useContext(D);
+  if (!z(t.value)) return null;
+  const n = t.layout || "truncate", r = (t.value.length - 2).toString().split("");
+  return /* @__PURE__ */ G(
+    ie,
     {
       gap: "1",
       w: "full",
-      wrap: e === "wrap" ? "wrap" : "nowrap",
+      wrap: n === "wrap" ? "wrap" : "nowrap",
       align: "center",
       style: {
         position: "relative",
         flexGrow: 1
       },
       children: [
-        /* @__PURE__ */ s(
-          M,
+        e,
+        n === "truncate" && t.value.length > 2 && /* @__PURE__ */ w(
+          ie,
           {
-            presenceMap: o.value.map((c) => ({
-              "tgph-motion-key": C(c, o.legacyBehavior) || "",
-              value: !0
-            })),
-            children: t
-          }
-        ),
-        /* @__PURE__ */ s(
-          M,
-          {
-            presenceMap: [
-              {
-                "tgph-motion-key": "combobox-more",
-                value: !0
-              }
-            ],
-            children: e === "truncate" && o.value.length > 2 && /* @__PURE__ */ s(
-              k,
-              {
-                as: P.div,
-                initial: { opacity: 0 },
-                animate: { opacity: 1 },
-                exit: { opacity: 0 },
-                transition: { duration: 100, type: "spring" },
-                h: "full",
-                pr: "1",
-                pl: "8",
-                align: "center",
-                "aria-label": `${o.value.length - 2} more selected`,
-                position: "absolute",
-                right: "0",
-                style: {
-                  backgroundImage: "linear-gradient(to left, var(--tgph-surface-1) 0 60%, transparent 90% 100%)"
+            as: tc,
+            initial: { opacity: 0 },
+            animate: { opacity: 1 },
+            exit: { opacity: 0 },
+            transition: { duration: 0.1, type: "spring", bounce: 0 },
+            h: "full",
+            pr: "1",
+            pl: "8",
+            align: "center",
+            "aria-label": `${t.value.length - 2} more selected`,
+            position: "absolute",
+            right: "0",
+            style: {
+              backgroundImage: "linear-gradient(to left, var(--tgph-surface-1) 0 60%, transparent 90% 100%)"
+            },
+            children: /* @__PURE__ */ G(gt, { as: "span", size: "1", style: { whiteSpace: "nowrap" }, children: [
+              "+",
+              r.map((i) => /* @__PURE__ */ w(
+                Pn,
+                {
+                  as: _t,
+                  initial: { opacity: 0 },
+                  animate: { opacity: 1 },
+                  exit: { opacity: 0 },
+                  transition: { duration: 0.1, type: "spring", bounce: 0 },
+                  w: "2",
+                  display: "inline-block",
+                  children: i
                 },
-                children: /* @__PURE__ */ w(H, { as: "span", size: "1", style: { whiteSpace: "nowrap" }, children: [
-                  "+",
-                  /* @__PURE__ */ w(
-                    M,
-                    {
-                      presenceMap: a.map((c) => ({
-                        "tgph-motion-key": c,
-                        value: !0
-                      })),
-                      children: [
-                        a.map((c) => /* @__PURE__ */ s(
-                          G,
-                          {
-                            as: P.span,
-                            initial: { opacity: 0 },
-                            animate: { opacity: 1 },
-                            exit: { opacity: 0 },
-                            transition: { duration: 100, type: "spring" },
-                            w: "2",
-                            display: "inline-block",
-                            "tgph-motion-key": c,
-                            children: c
-                          },
-                          c
-                        )),
-                        " "
-                      ]
-                    }
-                  ),
-                  "more"
-                ] })
-              }
-            )
+                i
+              )),
+              " ",
+              "more"
+            ] })
           }
         )
       ]
     }
   );
-}, j = l.createContext({
+}, Ht = b.createContext({
   value: ""
-}), de = ({
-  value: t,
-  children: o,
-  ...e
-}) => /* @__PURE__ */ s(j.Provider, { value: { value: t }, children: /* @__PURE__ */ s(
-  K.Root,
+}), ac = ({
+  value: e,
+  children: t,
+  ...n
+}) => /* @__PURE__ */ w(Ht.Provider, { value: { value: e }, children: /* @__PURE__ */ w(
+  vt.Root,
   {
-    as: P.span,
-    initializeWithAnimation: !1,
+    as: _t,
     initial: { opacity: 0, scale: 0.5 },
     animate: { opacity: 1, scale: 1 },
     exit: { opacity: 0, scale: 0.5 },
-    transition: { duration: 100, type: "spring" },
-    "tgph-motion-key": t,
+    transition: { duration: 0.1, type: "spring", bounce: 0 },
     size: "1",
     layout: "position",
-    ...e,
-    children: o
+    ...n,
+    children: t
   }
-) }), me = ({
-  children: t,
-  ...o
+) }), cc = ({
+  children: e,
+  ...t
 }) => {
-  const e = l.useContext(y), r = l.useContext(j), a = l.useMemo(() => {
-    const c = e.options.find(
-      (p) => p.value === r.value
+  const n = b.useContext(D), s = b.useContext(Ht), r = b.useMemo(() => {
+    const i = n.options.find(
+      (u) => u.value === s.value
     );
-    if (c) return c.label || c.value;
-    if (!e.value) return;
-    const i = e.value.find(
-      (p) => C(p, e.legacyBehavior) === r.value
+    if (i) return i.label || i.value;
+    if (!n.value) return;
+    const a = n.value.find(
+      (u) => H(u, n.legacyBehavior) === s.value
     );
-    if (i)
-      return i;
+    if (a)
+      return a;
   }, [
-    e.options,
-    e.value,
-    r.value,
-    e.legacyBehavior
+    n.options,
+    n.value,
+    s.value,
+    n.legacyBehavior
   ]);
-  return /* @__PURE__ */ s(K.Text, { ...o, children: t || a });
-}, ye = ({
-  children: t,
-  ...o
+  return /* @__PURE__ */ w(vt.Text, { ...t, children: e || r });
+}, uc = ({
+  children: e,
+  ...t
 }) => {
-  const e = l.useContext(y), r = l.useContext(j);
-  return /* @__PURE__ */ s(
-    K.Button,
+  const n = b.useContext(D), s = b.useContext(Ht);
+  return /* @__PURE__ */ w(
+    vt.Button,
     {
-      icon: { icon: E.X, alt: `Remove ${r.value}` },
-      onClick: (a) => {
-        if (!e.onValueChange) return;
-        const c = e.onValueChange, i = e.value.filter((p) => C(p, e.legacyBehavior) !== r.value);
-        c == null || c(i), a.stopPropagation(), a.preventDefault();
+      icon: { icon: yt, alt: `Remove ${s.value}` },
+      onClick: (r) => {
+        if (!n.onValueChange) return;
+        const i = n.onValueChange, a = n.value.filter((u) => H(u, n.legacyBehavior) !== s.value);
+        i == null || i(a), r.stopPropagation(), r.preventDefault();
       },
-      ...o,
-      children: t
+      ...t,
+      children: e
     }
   );
-}, be = ({
-  value: t,
-  children: o,
-  ...e
-}) => /* @__PURE__ */ w(D.Root, { value: t, ...e, children: [
-  /* @__PURE__ */ s(D.Text, { children: o }),
-  /* @__PURE__ */ s(D.Button, {})
-] }), D = {
-  Root: de,
-  Text: me,
-  Button: ye,
-  Default: be
-}, T = {
-  TriggerIndicator: ue,
-  TriggerClear: pe,
-  TriggerText: ge,
-  TriggerPlaceholder: fe,
-  TriggerTagsContainer: he,
-  TriggerTag: D
-}, ve = ["ArrowDown", "PageUp", "Home"], xe = ["ArrowUp", "PageDown", "End"], q = ["Enter", " "], y = l.createContext({
+}, lc = ({
+  value: e,
+  children: t,
+  ...n
+}) => /* @__PURE__ */ G(Re.Root, { value: e, ...n, children: [
+  /* @__PURE__ */ w(Re.Text, { children: t }),
+  /* @__PURE__ */ w(Re.Button, {})
+] }), Re = {
+  Root: ac,
+  Text: cc,
+  Button: uc,
+  Default: lc
+}, _ = {
+  TriggerIndicator: nc,
+  TriggerClear: sc,
+  TriggerText: rc,
+  TriggerPlaceholder: ic,
+  TriggerTagsContainer: oc,
+  TriggerTag: Re
+}, fc = ["ArrowDown", "PageUp", "Home"], dc = ["ArrowUp", "PageDown", "End"], Ys = ["Enter", " "], D = b.createContext({
   value: void 0,
   onValueChange: () => {
   },
@@ -349,379 +3576,379 @@ const ce = {
   disabled: !1,
   options: [],
   legacyBehavior: !1
-}), Ce = ({
-  modal: t = !0,
-  closeOnSelect: o = !0,
-  clearable: e = !1,
-  disabled: r = !1,
-  legacyBehavior: a = !1,
-  open: c,
-  onOpenChange: n,
-  defaultOpen: i,
-  value: p,
-  onValueChange: g,
-  errored: b,
-  placeholder: x,
-  layout: d,
-  children: u,
-  ...f
+}), hc = ({
+  modal: e = !0,
+  closeOnSelect: t = !0,
+  clearable: n = !1,
+  disabled: s = !1,
+  legacyBehavior: r = !1,
+  open: i,
+  onOpenChange: o,
+  defaultOpen: a,
+  value: u,
+  onValueChange: l,
+  errored: c,
+  placeholder: d,
+  layout: f,
+  children: h,
+  ...m
 }) => {
-  const m = l.useId(), v = l.useId(), h = l.useRef(null), S = l.useRef(null), L = l.useRef(null), V = l.useMemo(() => le(u), [u]), [W, N] = l.useState(""), [B = !1, A] = oe({
-    prop: c,
-    defaultProp: i ?? !1,
-    onChange: n
-  }), J = l.useCallback(() => {
-    A((Z) => !Z);
-  }, [A]);
-  return l.useEffect(() => {
-    B || N("");
-  }, [B]), /* @__PURE__ */ s(
-    y.Provider,
+  const g = b.useId(), y = b.useId(), p = b.useRef(null), x = b.useRef(null), v = b.useRef(null), A = b.useMemo(() => Ja(h), [h]), [S, C] = b.useState(""), [M = !1, V] = Js({
+    prop: i,
+    defaultProp: a ?? !1,
+    onChange: o
+  }), F = b.useCallback(() => {
+    V((I) => !I);
+  }, [V]);
+  return b.useEffect(() => {
+    M || C("");
+  }, [M]), /* @__PURE__ */ w(
+    D.Provider,
     {
       value: {
-        contentId: m,
-        triggerId: v,
-        value: p,
+        contentId: g,
+        triggerId: y,
+        value: u,
         // Need to cast this to avoid type errors
         // because the type of onValueChange is not
         // consistent with the value type
-        onValueChange: g,
-        placeholder: x,
-        open: B,
-        setOpen: A,
-        onOpenToggle: J,
-        closeOnSelect: o,
-        clearable: e,
-        disabled: r,
-        searchQuery: W,
-        setSearchQuery: N,
-        triggerRef: h,
-        searchRef: S,
-        contentRef: L,
-        errored: b,
-        layout: d,
-        options: V,
-        legacyBehavior: a
+        onValueChange: l,
+        placeholder: d,
+        open: M,
+        setOpen: V,
+        onOpenToggle: F,
+        closeOnSelect: t,
+        clearable: n,
+        disabled: s,
+        searchQuery: S,
+        setSearchQuery: C,
+        triggerRef: p,
+        searchRef: x,
+        contentRef: v,
+        errored: c,
+        layout: f,
+        options: A,
+        legacyBehavior: r
       },
-      children: /* @__PURE__ */ s(
-        Q.Root,
+      children: /* @__PURE__ */ w(
+        Be.Root,
         {
-          open: B,
-          onOpenChange: A,
-          modal: t,
-          ...f,
-          children: u
+          open: M,
+          onOpenChange: V,
+          modal: e,
+          ...m,
+          children: h
         }
       )
     }
   );
-}, Te = () => {
-  const t = l.useContext(y);
-  if (t.value && R(t.value)) {
-    const o = t.layout || "truncate";
-    return t.value.length === 0 ? /* @__PURE__ */ s(T.TriggerPlaceholder, {}) : /* @__PURE__ */ s(T.TriggerTagsContainer, { children: t.value.map((e, r) => {
-      const a = C(e, t.legacyBehavior);
-      if (a && (o === "truncate" && r <= 1 || o === "wrap"))
-        return /* @__PURE__ */ s(ne, { children: /* @__PURE__ */ s(T.TriggerTag.Default, { value: a }) }, a);
-    }) });
-  }
-  if (t && I(t.value))
-    return t.value ? /* @__PURE__ */ s(T.TriggerText, {}) : /* @__PURE__ */ s(T.TriggerPlaceholder, {});
-}, we = ({
-  size: t = "2",
-  children: o,
-  ...e
+}, pc = () => {
+  const e = b.useContext(D);
+  if (e.value && z(e.value)) {
+    const t = e.layout || "truncate";
+    return e.value.length === 0 ? /* @__PURE__ */ w(_.TriggerPlaceholder, {}) : /* @__PURE__ */ w(bo, { features: Qa, children: /* @__PURE__ */ w(_.TriggerTagsContainer, { children: e.value.map((n, s) => {
+      const r = H(n, e.legacyBehavior);
+      if (r && (t === "truncate" && s <= 1 || t === "wrap"))
+        return /* @__PURE__ */ w(tr, { children: /* @__PURE__ */ w(_.TriggerTag.Default, { value: r }) }, r);
+    }) }) });
+  }
+  if (e && ee(e.value))
+    return e.value ? /* @__PURE__ */ w(_.TriggerText, {}) : /* @__PURE__ */ w(_.TriggerPlaceholder, {});
+}, mc = ({
+  size: e = "2",
+  children: t,
+  ...n
 }) => {
-  const r = l.useContext(y), a = l.useMemo(() => {
-    if (r.value) {
-      if (I(r.value))
-        return F(
-          r.value,
-          r.options,
-          r.legacyBehavior
+  const s = b.useContext(D), r = b.useMemo(() => {
+    if (s.value) {
+      if (ee(s.value))
+        return mt(
+          s.value,
+          s.options,
+          s.legacyBehavior
         );
-      if (R(r.value))
-        return r.value.map(
-          (n) => F(n, r.options, r.legacyBehavior)
+      if (z(s.value))
+        return s.value.map(
+          (o) => mt(o, s.options, s.legacyBehavior)
         );
     }
-  }, [r.value, r.options, r.legacyBehavior]), c = l.useCallback(() => a ? I(a) ? (a == null ? void 0 : a.label) || (a == null ? void 0 : a.value) || r.placeholder : R(a) && a.map((n) => (n == null ? void 0 : n.label) || (n == null ? void 0 : n.value)).join(", ") || r.placeholder : r.placeholder, [a, r.placeholder]);
-  return /* @__PURE__ */ s(
-    Q.Trigger,
+  }, [s.value, s.options, s.legacyBehavior]), i = b.useCallback(() => r ? ee(r) ? (r == null ? void 0 : r.label) || (r == null ? void 0 : r.value) || s.placeholder : z(r) && r.map((o) => (o == null ? void 0 : o.label) || (o == null ? void 0 : o.value)).join(", ") || s.placeholder : s.placeholder, [r, s.placeholder]);
+  return /* @__PURE__ */ w(
+    Be.Trigger,
     {
-      ...e,
+      ...n,
       asChild: !0,
-      onClick: (n) => {
-        var i, p;
-        n.preventDefault(), r.onOpenToggle(), (p = (i = r.triggerRef) == null ? void 0 : i.current) == null || p.focus();
+      onClick: (o) => {
+        var a, u;
+        o.preventDefault(), s.onOpenToggle(), (u = (a = s.triggerRef) == null ? void 0 : a.current) == null || u.focus();
       },
-      onKeyDown: (n) => {
-        if (n.key === "Tab") {
-          n.stopPropagation();
+      onKeyDown: (o) => {
+        if (o.key === "Tab") {
+          o.stopPropagation();
           return;
         }
-        if (q.includes(n.key)) {
-          n.preventDefault();
+        if (Ys.includes(o.key)) {
+          o.preventDefault();
           return;
         }
-        if (n.key === "ArrowDown") {
-          n.stopPropagation(), n.preventDefault(), r.onOpenToggle();
+        if (o.key === "ArrowDown") {
+          o.stopPropagation(), o.preventDefault(), s.onOpenToggle();
           return;
         }
       },
-      tgphRef: r.triggerRef,
-      children: /* @__PURE__ */ w(
-        O.Root,
+      tgphRef: s.triggerRef,
+      children: /* @__PURE__ */ G(
+        ae.Root,
         {
-          id: r.triggerId,
+          id: s.triggerId,
           type: "button",
           bg: "surface-1",
           variant: "outline",
           align: "center",
-          minH: ce[t],
+          minH: Za[e],
           h: "full",
           w: "full",
           py: "1",
-          size: t,
-          color: r.errored ? "red" : "gray",
+          size: e,
+          color: s.errored ? "red" : "gray",
           justify: "space-between",
           role: "combobox",
-          "aria-label": c(),
-          "aria-controls": r.contentId,
-          "aria-expanded": r.open,
+          "aria-label": i(),
+          "aria-controls": s.contentId,
+          "aria-expanded": s.open,
           "aria-haspopup": "listbox",
           "data-tgph-combobox-trigger": !0,
-          "data-tgph-combobox-trigger-open": r.open,
-          disabled: r.disabled,
-          ...e,
+          "data-tgph-combobox-trigger-open": s.open,
+          disabled: s.disabled,
+          ...n,
           children: [
-            o ? typeof o == "function" ? o({ value: a }) : o : /* @__PURE__ */ s(Te, {}),
-            /* @__PURE__ */ w(k, { align: "center", gap: "1", children: [
-              /* @__PURE__ */ s(T.TriggerClear, {}),
-              /* @__PURE__ */ s(T.TriggerIndicator, {})
+            t ? typeof t == "function" ? t({ value: r }) : t : /* @__PURE__ */ w(pc, {}),
+            /* @__PURE__ */ G(ie, { align: "center", gap: "1", children: [
+              /* @__PURE__ */ w(_.TriggerClear, {}),
+              /* @__PURE__ */ w(_.TriggerIndicator, {})
             ] })
           ]
         }
       )
     }
   );
-}, Re = ({
-  style: t,
-  children: o,
-  tgphRef: e,
-  ...r
+}, gc = ({
+  style: e,
+  children: t,
+  tgphRef: n,
+  ...s
 }) => {
-  const a = l.useContext(y), c = l.useRef(!1), n = $(e, a.contentRef), i = l.useRef(null), [p, g] = l.useState(0), [b, x] = l.useState(!1), d = l.useCallback(
-    (u) => {
-      const f = u == null ? void 0 : u.getBoundingClientRect();
-      f && g(f.height), b || x(!0);
+  const r = b.useContext(D), i = b.useRef(!1), o = An(n, r.contentRef), a = b.useRef(null), [u, l] = b.useState(0), [c, d] = b.useState(!1), f = b.useCallback(
+    (h) => {
+      const m = h == null ? void 0 : h.getBoundingClientRect();
+      m && l(m.height), c || d(!0);
     },
-    [b]
+    [c]
   );
-  return l.useEffect(() => {
-    const u = new ResizeObserver((f) => {
-      for (const m of f) {
-        const v = m.target;
-        d(v);
+  return b.useEffect(() => {
+    const h = new ResizeObserver((m) => {
+      for (const g of m) {
+        const y = g.target;
+        f(y);
       }
     });
-    return i.current && b && u.observe(i.current), () => u.disconnect();
-  }, [b, d]), l.useEffect(() => {
-    b === !0 && a.open === !1 && x(!1);
-  }, [a.open, b]), l.useEffect(() => {
-    let u;
-    return a.open && (u = setTimeout(() => {
-      d(i.current);
-    }, 10)), () => u && clearTimeout(u);
-  }, [a.open, d]), /* @__PURE__ */ s(te.Root, { asChild: !0, children: /* @__PURE__ */ s(
-    ee,
+    return a.current && c && h.observe(a.current), () => h.disconnect();
+  }, [c, f]), b.useEffect(() => {
+    c === !0 && r.open === !1 && d(!1);
+  }, [r.open, c]), b.useEffect(() => {
+    let h;
+    return r.open && (h = setTimeout(() => {
+      f(a.current);
+    }, 10)), () => h && clearTimeout(h);
+  }, [r.open, f]), /* @__PURE__ */ w(Zs.Root, { asChild: !0, children: /* @__PURE__ */ w(
+    Qs,
     {
-      onEscapeKeyDown: (u) => {
-        a.open && (u.stopPropagation(), u.preventDefault(), a.setOpen(!1));
+      onEscapeKeyDown: (h) => {
+        r.open && (h.stopPropagation(), h.preventDefault(), r.setOpen(!1));
       },
-      children: /* @__PURE__ */ s(
-        Q.Content,
+      children: /* @__PURE__ */ w(
+        Be.Content,
         {
           className: "tgph",
           mt: "1",
-          onCloseAutoFocus: (u) => {
-            var f, m;
-            c.current || (m = (f = a.triggerRef) == null ? void 0 : f.current) == null || m.focus(), c.current = !1, u.preventDefault();
+          onCloseAutoFocus: (h) => {
+            var m, g;
+            i.current || (g = (m = r.triggerRef) == null ? void 0 : m.current) == null || g.focus(), i.current = !1, h.preventDefault();
           },
           bg: "surface-1",
           style: {
             width: "var(--tgph-combobox-trigger-width)",
             transition: "min-height 200ms ease-in-out",
-            minHeight: p ? `${p}px` : "0",
-            ...t,
+            minHeight: u ? `${u}px` : "0",
+            ...e,
             "--tgph-combobox-content-transform-origin": "var(--radix-popper-transform-origin)",
             "--tgph-combobox-content-available-width": "var(--radix-popper-available-width)",
             "--tgph-combobox-content-available-height": "calc(var(--radix-popper-available-height) - var(--tgph-spacing-8))",
             "--tgph-combobox-trigger-width": "var(--radix-popper-anchor-width)",
             "--tgph-combobox-trigger-height": "var(--radix-popper-anchor-height)"
           },
-          ...r,
-          tgphRef: n,
+          ...s,
+          tgphRef: o,
           "data-tgph-combobox-content": !0,
-          "data-tgph-combobox-content-open": a.open,
+          "data-tgph-combobox-content-open": r.open,
           role: void 0,
           "aria-orientation": void 0,
-          onKeyDown: (u) => {
-            var m, v, h, S;
-            u.stopPropagation();
-            const f = (v = (m = a.contentRef) == null ? void 0 : m.current) == null ? void 0 : v.querySelectorAll(
+          onKeyDown: (h) => {
+            var g, y, p, x;
+            h.stopPropagation();
+            const m = (y = (g = r.contentRef) == null ? void 0 : g.current) == null ? void 0 : y.querySelectorAll(
               "[data-tgph-combobox-option]"
             );
-            document.activeElement === (f == null ? void 0 : f[0]) && xe.includes(u.key) && ((S = (h = a.searchRef) == null ? void 0 : h.current) == null || S.focus());
+            document.activeElement === (m == null ? void 0 : m[0]) && dc.includes(h.key) && ((x = (p = r.searchRef) == null ? void 0 : p.current) == null || x.focus());
           },
-          children: /* @__PURE__ */ s(k, { direction: "column", gap: "1", tgphRef: i, children: o })
+          children: /* @__PURE__ */ w(ie, { direction: "column", gap: "1", tgphRef: a, children: t })
         }
       )
     }
   ) });
-}, Se = ({ ...t }) => {
-  const o = l.useContext(y);
-  return /* @__PURE__ */ s(
-    k,
+}, yc = ({ ...e }) => {
+  const t = b.useContext(D);
+  return /* @__PURE__ */ w(
+    ie,
     {
-      id: o.contentId,
+      id: t.contentId,
       direction: "column",
       gap: "1",
       style: {
         overflowY: "auto",
         // maxHeight defaults to available height - padding from edge of screen
-        "--max-height": t.maxHeight ? void 0 : "calc(var(--tgph-combobox-content-available-height) - var(--tgph-spacing-12))"
+        "--max-height": e.maxHeight ? void 0 : "calc(var(--tgph-combobox-content-available-height) - var(--tgph-spacing-12))"
       },
       role: "listbox",
-      ...t
+      ...e
     }
   );
-}, U = ({
-  value: t,
-  label: o,
-  selected: e,
-  onSelect: r,
-  children: a,
-  ...c
+}, qs = ({
+  value: e,
+  label: t,
+  selected: n,
+  onSelect: s,
+  children: r,
+  ...i
 }) => {
-  const n = l.useContext(y), [i, p] = l.useState(!1), g = n.value, b = !n.searchQuery || se({
-    children: o || a,
-    value: t,
-    searchQuery: n.searchQuery
-  }), x = R(g) ? g.some(
-    (u) => C(u, n.legacyBehavior) === t
-  ) : C(g, n.legacyBehavior) === t, d = (u) => {
-    var m, v;
-    u.stopPropagation();
-    const f = u;
-    if (!(f.key && !q.includes(f.key))) {
-      if (u.preventDefault(), n.closeOnSelect === !0 && n.setOpen(!1), r)
-        return r(u);
-      if (I(g)) {
-        const h = n.onValueChange;
-        n.legacyBehavior === !0 ? h == null || h({ value: t, label: o }) : h == null || h(t);
-      } else if (R(g)) {
-        const h = n.onValueChange, S = n.value, L = x ? S.filter(
-          (V) => C(V, n.legacyBehavior) !== t
+  const o = b.useContext(D), [a, u] = b.useState(!1), l = o.value, c = !o.searchQuery || ec({
+    children: t || r,
+    value: e,
+    searchQuery: o.searchQuery
+  }), d = z(l) ? l.some(
+    (h) => H(h, o.legacyBehavior) === e
+  ) : H(l, o.legacyBehavior) === e, f = (h) => {
+    var g, y;
+    h.stopPropagation();
+    const m = h;
+    if (!(m.key && !Ys.includes(m.key))) {
+      if (h.preventDefault(), o.closeOnSelect === !0 && o.setOpen(!1), s)
+        return s(h);
+      if (ee(l)) {
+        const p = o.onValueChange;
+        o.legacyBehavior === !0 ? p == null || p({ value: e, label: t }) : p == null || p(e);
+      } else if (z(l)) {
+        const p = o.onValueChange, x = o.value, v = d ? x.filter(
+          (A) => H(A, o.legacyBehavior) !== e
         ) : [
-          ...S,
+          ...x,
           // TODO: Remove this once { value, label } option is deprecated
-          n.legacyBehavior === !0 ? { value: t, label: o } : t
+          o.legacyBehavior === !0 ? { value: e, label: t } : e
         ];
-        h == null || h(L);
+        p == null || p(v);
       }
-      (v = (m = n.triggerRef) == null ? void 0 : m.current) == null || v.focus();
+      (y = (g = o.triggerRef) == null ? void 0 : g.current) == null || y.focus();
     }
   };
-  if (b)
-    return /* @__PURE__ */ s(
-      Q.Button,
+  if (c)
+    return /* @__PURE__ */ w(
+      Be.Button,
       {
         type: "button",
-        onSelect: d,
-        onKeyDown: d,
-        selected: e === null ? null : e ?? x,
-        onFocus: () => p(!0),
-        onBlur: () => p(!1),
+        onSelect: f,
+        onKeyDown: f,
+        selected: n === null ? null : n ?? d,
+        onFocus: () => u(!0),
+        onBlur: () => u(!1),
         role: "option",
-        "aria-selected": x ? "true" : "false",
+        "aria-selected": d ? "true" : "false",
         "data-tgph-combobox-option": !0,
-        "data-tgph-combobox-option-focused": i,
-        "data-tgph-combobox-option-value": t,
-        "data-tgph-combobox-option-label": o,
-        ...c,
-        children: o || a || t
+        "data-tgph-combobox-option-focused": a,
+        "data-tgph-combobox-option-value": e,
+        "data-tgph-combobox-option-label": t,
+        ...i,
+        children: t || r || e
       }
     );
-}, Ee = ({
-  label: t = "Search",
-  placeholder: o = "Search",
-  tgphRef: e,
-  value: r,
-  onValueChange: a,
-  ...c
+}, bc = ({
+  label: e = "Search",
+  placeholder: t = "Search",
+  tgphRef: n,
+  value: s,
+  onValueChange: r,
+  ...i
 }) => {
-  var x;
-  const n = l.useId(), i = l.useContext(y), p = $(e, i.searchRef), g = r ?? i.searchQuery, b = a ?? i.setSearchQuery;
-  return l.useEffect(() => {
-    var f;
-    const d = (m) => {
-      var v, h;
-      ve.includes(m.key) && ((h = (v = i.contentRef) == null ? void 0 : v.current) == null || h.focus({ preventScroll: !0 })), m.key === "Escape" && i.setOpen(!1), m.stopPropagation();
-    }, u = (f = i.searchRef) == null ? void 0 : f.current;
-    if (u)
-      return u.addEventListener("keydown", d), () => {
-        u.removeEventListener("keydown", d);
+  var d;
+  const o = b.useId(), a = b.useContext(D), u = An(n, a.searchRef), l = s ?? a.searchQuery, c = r ?? a.setSearchQuery;
+  return b.useEffect(() => {
+    var m;
+    const f = (g) => {
+      var y, p;
+      fc.includes(g.key) && ((p = (y = a.contentRef) == null ? void 0 : y.current) == null || p.focus({ preventScroll: !0 })), g.key === "Escape" && a.setOpen(!1), g.stopPropagation();
+    }, h = (m = a.searchRef) == null ? void 0 : m.current;
+    if (h)
+      return h.addEventListener("keydown", f), () => {
+        h.removeEventListener("keydown", f);
       };
-  }, [i]), /* @__PURE__ */ w(G, { borderBottom: "px", px: "1", pb: "1", children: [
-    /* @__PURE__ */ s(re.Root, { children: /* @__PURE__ */ s(H, { as: "label", htmlFor: n, children: t }) }),
-    /* @__PURE__ */ s(
-      ae,
+  }, [a]), /* @__PURE__ */ G(Pn, { borderBottom: "px", px: "1", pb: "1", children: [
+    /* @__PURE__ */ w(er.Root, { children: /* @__PURE__ */ w(gt, { as: "label", htmlFor: o, children: e }) }),
+    /* @__PURE__ */ w(
+      nr,
       {
-        id: n,
+        id: o,
         variant: "ghost",
-        placeholder: o,
-        value: g,
-        onChange: (d) => {
-          b(d.target.value);
+        placeholder: t,
+        value: l,
+        onChange: (f) => {
+          c(f.target.value);
         },
-        LeadingComponent: /* @__PURE__ */ s(z, { icon: E.Search, alt: "Search Icon" }),
-        TrailingComponent: i != null && i.searchQuery && ((x = i == null ? void 0 : i.searchQuery) == null ? void 0 : x.length) > 0 ? /* @__PURE__ */ s(
-          O,
+        LeadingComponent: /* @__PURE__ */ w(Mn, { icon: Rn, alt: "Search Icon" }),
+        TrailingComponent: a != null && a.searchQuery && ((d = a == null ? void 0 : a.searchQuery) == null ? void 0 : d.length) > 0 ? /* @__PURE__ */ w(
+          ae,
           {
             variant: "ghost",
             color: "gray",
-            icon: { icon: E.X, alt: "Clear Search Query" },
+            icon: { icon: yt, alt: "Clear Search Query" },
             onClick: () => {
-              var d;
-              return (d = i.setSearchQuery) == null ? void 0 : d.call(i, "");
+              var f;
+              return (f = a.setSearchQuery) == null ? void 0 : f.call(a, "");
             }
           }
         ) : null,
         autoFocus: !0,
         "data-tgph-combobox-search": !0,
-        "aria-controls": i.contentId,
-        ...c,
-        tgphRef: p
+        "aria-controls": a.contentId,
+        ...i,
+        tgphRef: u
       }
     )
   ] });
-}, Ie = ({
-  icon: t = { icon: E.Search, alt: "Search Icon" },
-  message: o = "No results found",
-  children: e,
-  ...r
+}, vc = ({
+  icon: e = { icon: Rn, alt: "Search Icon" },
+  message: t = "No results found",
+  children: n,
+  ...s
 }) => {
-  const a = l.useContext(y), [c, n] = l.useState(!1);
-  if (l.useEffect(() => {
-    var p, g;
-    const i = (g = (p = a.contentRef) == null ? void 0 : p.current) == null ? void 0 : g.querySelectorAll(
+  const r = b.useContext(D), [i, o] = b.useState(!1);
+  if (b.useEffect(() => {
+    var u, l;
+    const a = (l = (u = r.contentRef) == null ? void 0 : u.current) == null ? void 0 : l.querySelectorAll(
       "[data-tgph-combobox-option]"
     );
-    (i == null ? void 0 : i.length) === 0 ? n(!0) : n(!1);
-  }, [a.searchQuery, a.contentRef, e]), c)
-    return /* @__PURE__ */ w(
-      k,
+    (a == null ? void 0 : a.length) === 0 ? o(!0) : o(!1);
+  }, [r.searchQuery, r.contentRef, n]), i)
+    return /* @__PURE__ */ G(
+      ie,
       {
         gap: "1",
         align: "center",
@@ -729,59 +3956,59 @@ const ce = {
         w: "full",
         my: "8",
         "data-tgph-combobox-empty": !0,
-        ...r,
+        ...s,
         children: [
-          t === null ? /* @__PURE__ */ s(_, {}) : /* @__PURE__ */ s(z, { ...t }),
-          o === null ? /* @__PURE__ */ s(_, {}) : /* @__PURE__ */ s(H, { as: "span", children: o })
+          e === null ? /* @__PURE__ */ w(zt, {}) : /* @__PURE__ */ w(Mn, { ...e }),
+          t === null ? /* @__PURE__ */ w(zt, {}) : /* @__PURE__ */ w(gt, { as: "span", children: t })
         ]
       }
     );
-}, ke = ({
-  leadingText: t = "Create",
-  values: o,
-  onCreate: e,
-  selected: r = null,
-  legacyBehavior: a = !1,
-  ...c
+}, Tc = ({
+  leadingText: e = "Create",
+  values: t,
+  onCreate: n,
+  selected: s = null,
+  legacyBehavior: r = !1,
+  ...i
 }) => {
-  const n = l.useContext(y), i = l.useCallback(
-    (p) => !o || (o == null ? void 0 : o.length) === 0 ? !1 : o.some(
-      (g) => C(g, a) === p
+  const o = b.useContext(D), a = b.useCallback(
+    (u) => !t || (t == null ? void 0 : t.length) === 0 ? !1 : t.some(
+      (l) => H(l, r) === u
     ),
-    [o, a]
+    [t, r]
   );
-  if (n.searchQuery && !i(n.searchQuery))
-    return /* @__PURE__ */ s(
-      U,
+  if (o.searchQuery && !a(o.searchQuery))
+    return /* @__PURE__ */ w(
+      qs,
       {
-        leadingIcon: { icon: E.Plus, "aria-hidden": !0 },
+        leadingIcon: { icon: rr, "aria-hidden": !0 },
         mx: "1",
-        value: n.searchQuery,
-        label: `${t} "${n.searchQuery}"`,
-        selected: r,
+        value: o.searchQuery,
+        label: `${e} "${o.searchQuery}"`,
+        selected: s,
         onSelect: () => {
-          var p;
-          if (e && n.value && n.searchQuery) {
-            const g = a === !0 ? { value: n.searchQuery } : n.searchQuery;
-            e(g), (p = n.setSearchQuery) == null || p.call(n, "");
+          var u;
+          if (n && o.value && o.searchQuery) {
+            const l = r === !0 ? { value: o.searchQuery } : o.searchQuery;
+            n(l), (u = o.setSearchQuery) == null || u.call(o, "");
           }
         },
-        ...c
+        ...i
       }
     );
-}, Oe = {};
-Object.assign(Oe, {
-  Root: Ce,
-  Trigger: we,
-  Content: Re,
-  Options: Se,
-  Option: U,
-  Search: Ee,
-  Empty: Ie,
-  Create: ke,
-  Primitives: T
+}, wc = {};
+Object.assign(wc, {
+  Root: hc,
+  Trigger: mc,
+  Content: gc,
+  Options: yc,
+  Option: qs,
+  Search: bc,
+  Empty: vc,
+  Create: Tc,
+  Primitives: _
 });
 export {
-  Oe as Combobox
+  wc as Combobox
 };
 //# sourceMappingURL=index.mjs.map