@react-motion-router/core 2.0.0-beta.sha-20ff5ff → 2.0.0-beta.sha-4c84f16

package/build/index.js

@@ -1,9 +1,9 @@
-import { jsx as b, jsxs as Ht, Fragment as ae } from "react/jsx-runtime";
-import { createContext as dt, Component as it, createRef as K, lazy as oe, cloneElement as Xt, Suspense as Tt, isValidElement as Zt, Children as Bt, useContext as ht, useDebugValue as le, useSyncExternalStore as ce, useRef as he, useEffect as ue, useCallback as de } from "react";
-const Yt = dt(null);
-class qe extends it {
-  ref = K();
-  static contextType = Yt;
+import { jsx as T, jsxs as ee, Fragment as ye } from "react/jsx-runtime";
+import Lt, { createContext as gt, Component as at, createRef as z, Suspense as xt, isValidElement as ne, cloneElement as ie, lazy as we, Children as Xt, useContext as ft, useDebugValue as Ee, useSyncExternalStore as re, useRef as Ft, useEffect as se, useCallback as be } from "react";
+const ae = gt(null);
+class Je extends at {
+  ref = z();
+  static contextType = ae;
   componentDidMount() {
     this.scene.addNode(this);
   }
@@ -44,7 +44,7 @@ class qe extends it {
     this.ref.current && (this.ref.current.style.visibility = "visible");
   }
   render() {
-    return /* @__PURE__ */ b(
+    return /* @__PURE__ */ T(
       "div",
       {
         ref: this.ref,
@@ -55,208 +55,34 @@ class qe extends it {
     );
   }
 }
-function bt(s, t) {
-  s.endsWith("*") || (s += "**");
-  const e = window.location.origin, n = new URLPattern(s, e).exec(t, e);
-  if (!n)
-    return null;
-  const a = Object.keys(n.pathname.groups).filter((o) => !isNaN(Number(o))).map((o) => n.pathname.groups[o]).filter((o) => o !== void 0).at(-1) ?? "";
-  return new URL(t.replace(a, ""), window.location.origin);
-}
-function _t(s, t, e = `${window.location.origin}/`, n = !0) {
-  n || (s = s.toLowerCase(), t = t.toLowerCase());
-  const r = bt(e, t)?.href;
-  if (!r)
-    return null;
-  const a = new URLPattern({ baseURL: r, pathname: s }).exec({ pathname: t, baseURL: r }), o = a?.pathname.groups ?? {};
-  return a ? {
-    params: o,
-    caseSensitive: n
-  } : null;
-}
-function ze(s, t, e = window.location.origin) {
-  return s.some(({ pattern: n, caseSensitive: r }) => _t(n, t, e, r));
-}
-function pe(s, t = window) {
-  return new Promise((e) => {
-    queueMicrotask(() => e(
-      t.dispatchEvent(s)
-    ));
-  });
-}
-function Ge(s) {
-  const t = oe(s);
-  return t.load = async () => (t.module ??= await s(), t.module), t;
-}
-function He() {
-  return !!window.navigation;
-}
-function Xe() {
-  return !!globalThis.URLPattern;
-}
-async function Ze() {
-  const { URLPattern: s } = await import(
-    /*webpackIgnore: true*/
-    "urlpattern-polyfill"
-  );
-  globalThis.URLPattern = s;
-}
-async function Ye() {
-  const { applyPolyfill: s } = await import(
-    /*webpackIgnore: true*/
-    "@virtualstate/navigation"
-  );
-  s({
-    history: !0,
-    interceptEvents: !0,
-    patch: !0,
-    persist: !0,
-    persistState: !0
-  });
-}
-async function fe(s) {
-  const t = [];
-  for (const e of s)
-    t.push(await e);
-  return t;
-}
-function me(s) {
-  return s.replace(/-([a-z])/g, (t) => t[1].toUpperCase());
-}
-function _e(s, t) {
-  return Xt(s, t);
-}
-class ge extends Event {
-  constructor() {
-    super("transition-start");
-  }
-}
-class ye extends Event {
-  constructor() {
-    super("transition-cancel");
-  }
-}
-class ve extends Event {
-  constructor() {
-    super("transition-end");
-  }
-}
-class Je extends Event {
-  constructor() {
-    super("motion-progress-start");
-  }
-}
-class Qe extends Event {
-  constructor() {
-    super("motion-progress-end");
-  }
-}
-class we extends Event {
-  #t = "load";
-  #e = !1;
-  #c = !0;
-  #h = !1;
-  #u = null;
-  #d = null;
-  #a;
-  #i;
-  #o = new AbortController();
-  #l = !1;
-  #n = [];
-  #s = null;
-  hasUAVisualTransition = !1;
-  constructor() {
-    super("navigate", { cancelable: !1, bubbles: !1, composed: !1 });
-    const t = window.navigation.currentEntry;
-    if (!t)
-      throw new Error("Current entry is null");
-    this.#a = {
-      getState() {
-        return t.getState();
-      },
-      url: t.url ?? new URL(window.location.href).href,
-      key: t.key,
-      index: t.index,
-      id: t.id,
-      sameDocument: !0
-    }, this.#i = this.#o.signal, window.navigation.addEventListener("navigate", this.#r, { signal: this.#i });
-  }
-  #r = (t) => {
-    t !== this ? this.#o.abort() : this.#n.length || window.navigation.removeEventListener("navigate", this.#r);
-  };
-  intercept(t) {
-    if (this.#l)
-      throw new DOMException("Failed to execute 'intercept' on 'NavigateEvent': intercept() may only be called while the navigate event is being dispatched.");
-    let e = null;
-    this.#s || (this.#s = {
-      finished: new Promise((r) => e = r),
-      from: window.navigation.currentEntry,
-      navigationType: "load"
-    });
-    const n = t?.handler?.();
-    n && this.#n.push(n), this.#n.length === 1 && fe(this.#n).then(() => {
-      this.#l = !0, window.removeEventListener("navigate", this.#r), e?.();
-    });
-  }
-  scroll() {
-    throw new Error("Method not implemented.");
-  }
-  get transition() {
-    return this.#s;
-  }
-  get navigationType() {
-    return this.#t;
-  }
-  get userInitiated() {
-    return this.#e;
-  }
-  get canIntercept() {
-    return this.#c;
-  }
-  get hashChange() {
-    return this.#h;
-  }
-  get formData() {
-    return this.#u;
-  }
-  get downloadRequest() {
-    return this.#d;
-  }
-  get destination() {
-    return this.#a;
-  }
-  get signal() {
-    return this.#i;
-  }
-}
-const Wt = dt(null);
-class Ee extends it {
-  ref = K();
-  static contextType = Wt;
-  index = 0;
+const Kt = gt(null), Qe = 2147483647, tn = 100, en = 0, nn = 0, rn = 1, oe = -1, O = 0, J = 1, sn = 0;
+class Te extends at {
+  ref = z();
+  static contextType = Kt;
+  index = O;
   exiting = !1;
   state = {
     zIndex: "unset"
   };
-  onAnimationEnd = () => {
+  onroutertransitionend() {
     this.ref.current && (this.ref.current.style.willChange = "auto", this.ref.current.style.pointerEvents = "auto");
-  };
-  onAnimationStart = () => {
+  }
+  onroutertransitionstart() {
     this.ref.current && (this.ref.current.style.willChange = "transform, opacity", this.ref.current.style.pointerEvents = "none");
-  };
+  }
   componentDidMount() {
-    this.props.navigation.addEventListener("transition-start", this.onAnimationStart), this.props.navigation.addEventListener("transition-end", this.onAnimationEnd), this.props.navigation.addEventListener("transition-cancel", this.onAnimationEnd);
+    this.props.navigation.addEventListener("routertransitionstart", this), this.props.navigation.addEventListener("routertransitionend", this), this.props.navigation.addEventListener("routertransitioncancel", this);
   }
   componentWillUnmount() {
-    this.props.navigation.removeEventListener("transition-start", this.onAnimationStart), this.props.navigation.removeEventListener("transition-end", this.onAnimationEnd), this.props.navigation.removeEventListener("transition-cancel", this.onAnimationEnd);
+    this.props.navigation.removeEventListener("routertransitionstart", this), this.props.navigation.removeEventListener("routertransitionend", this), this.props.navigation.removeEventListener("routertransitioncancel", this);
   }
   get animationEffect() {
-    const t = this.props.animation, { animation: e, direction: n, hasUAVisualTransition: r } = this.context, { timeline: a, playbackRate: o } = e, { index: l, exiting: m, ref: p } = this, w = this.context.screens.map((R) => R.current?.name);
+    const t = this.props.animation, { animation: e, direction: n, hasUAVisualTransition: r } = this.context, { timeline: a, playbackRate: o } = e, { index: l, exiting: f, ref: d } = this, m = this.context.screens.map((S) => S.current?.name);
     return t?.({
-      ref: p.current,
+      ref: d.current,
       index: l,
-      screens: w,
-      exiting: m,
+      screens: m,
+      exiting: f,
       timeline: a,
       direction: n,
       playbackRate: o,
@@ -268,7 +94,7 @@ class Ee extends it {
   }
   render() {
     const t = this.props.renderAs, e = this.props.focused ? void 0 : "";
-    return /* @__PURE__ */ b(
+    return /* @__PURE__ */ T(
       t,
       {
         id: this.props.id,
@@ -287,8 +113,8 @@ class Ee extends it {
     );
   }
 }
-const Jt = dt(null), pt = dt(null), Qt = dt(null);
-class Te {
+const le = gt(null), vt = gt(null), ce = gt(null);
+class Se {
   id;
   nodes = /* @__PURE__ */ new Map();
   getScreenRect = () => new DOMRect();
@@ -323,12 +149,12 @@ class Te {
     return !this.nodes.size;
   }
 }
-class be extends it {
+class Re extends at {
   sharedElementScene;
-  #t = K();
-  ref = K();
+  #t = z();
+  ref = z();
   nestedRouterData;
-  static contextType = pt;
+  static contextType = vt;
   state = {
     focused: !1,
     config: {},
@@ -336,7 +162,12 @@ class be extends it {
     elementType: "div"
   };
   constructor(t, e) {
-    super(t), this.sharedElementScene = new Te(`${this.name}-shared-element-scene`), this.sharedElementScene.getScreenRect = () => this.ref.current?.getBoundingClientRect() || new DOMRect(), this.nestedRouterData = { parentScreen: this, parentRouter: e };
+    super(t), this.sharedElementScene = new Se(
+      `${this.name}-shared-element-scene`
+    ), this.sharedElementScene.getScreenRect = () => this.ref.current?.getBoundingClientRect() || new DOMRect(), this.nestedRouterData = {
+      parentScreen: this,
+      parentRouter: e
+    };
   }
   setParams(t) {
     this.setState(({ params: e }) => ({ params: { ...e, ...t } }));
@@ -351,17 +182,21 @@ class be extends it {
     return this.props.name ? this.props.name.toLowerCase().replace(/[^\w-]/g, "-").replace(/-+/g, "-").replace(/^-|-$/g, "") : B(this.props.component) ? this.props.component.module?.default.name.toLowerCase() : this.props.component.name.toLowerCase();
   }
   blur() {
-    return new Promise((t) => this.setState({ focused: !1 }, t));
+    return new Promise((t) => {
+      this.setState({ focused: !1 }, t);
+    });
   }
   focus() {
-    return new Promise((t) => this.setState({ focused: !0 }, t));
+    return new Promise((t) => {
+      this.setState({ focused: !0 }, t);
+    });
   }
   async load(t) {
     const e = this.props.component, n = this.props.config?.header?.component, r = this.props.config?.footer?.component;
     let a;
     B(e) ? a = await e.load() : a = { default: e }, B(n) && await n.load(), B(r) && await r.load();
-    const o = this.context.navigation, l = this.routeProp, m = !1;
-    return await this.props.config?.onLoad?.({ navigation: o, route: l, signal: t, preloading: m }), a;
+    const o = this.context.navigation, l = this.routeProp, f = !1;
+    return await this.props.config?.onLoad?.({ navigation: o, route: l, signal: t, preloading: f }), a;
   }
   async onExited(t) {
     await this.routeProp.config.onExited?.({
@@ -403,8 +238,8 @@ class be extends it {
   }
   render() {
     const t = this.context.navigation, e = this.routeProp, n = this.props.component, r = e.config.header?.component, a = e.config.footer?.component;
-    return /* @__PURE__ */ b(
-      Ee,
+    return /* @__PURE__ */ T(
+      Te,
       {
         ref: this.#t,
         renderAs: this.state.elementType,
@@ -412,7 +247,7 @@ class be extends it {
         animation: e.config.animation,
         navigation: t,
         focused: this.state.focused,
-        children: /* @__PURE__ */ b(
+        children: /* @__PURE__ */ T(
           "div",
           {
             id: `${this.context.id}-${this.name}`,
@@ -425,10 +260,58 @@ class be extends it {
               flexDirection: "column",
               pointerEvents: "inherit"
             },
-            children: /* @__PURE__ */ b(Yt.Provider, { value: this.sharedElementScene, children: /* @__PURE__ */ b(Qt.Provider, { value: e, children: /* @__PURE__ */ Ht(Jt.Provider, { value: this.nestedRouterData, children: [
-              /* @__PURE__ */ b(Tt, { fallback: /* @__PURE__ */ b(Z, { component: e.config.header?.fallback, route: e, navigation: t }), children: /* @__PURE__ */ b(Z, { component: r, route: e, navigation: t }) }),
-              /* @__PURE__ */ b(Tt, { fallback: /* @__PURE__ */ b(Z, { component: this.props.fallback, route: e, navigation: t }), children: /* @__PURE__ */ b(Z, { component: n, route: e, navigation: t }) }),
-              /* @__PURE__ */ b(Tt, { fallback: /* @__PURE__ */ b(Z, { component: e.config.footer?.fallback, route: e, navigation: t }), children: /* @__PURE__ */ b(Z, { component: a, route: e, navigation: t }) })
+            children: /* @__PURE__ */ T(ae.Provider, { value: this.sharedElementScene, children: /* @__PURE__ */ T(ce.Provider, { value: e, children: /* @__PURE__ */ ee(le.Provider, { value: this.nestedRouterData, children: [
+              /* @__PURE__ */ T(xt, { fallback: /* @__PURE__ */ T(
+                _,
+                {
+                  component: e.config.header?.fallback,
+                  route: e,
+                  navigation: t
+                }
+              ), children: /* @__PURE__ */ T(
+                _,
+                {
+                  component: r,
+                  route: e,
+                  navigation: t
+                }
+              ) }),
+              /* @__PURE__ */ T(xt, { fallback: /* @__PURE__ */ T(
+                _,
+                {
+                  component: this.props.fallback,
+                  route: e,
+                  navigation: t
+                }
+              ), children: /* @__PURE__ */ T(
+                _,
+                {
+                  component: n,
+                  route: e,
+                  navigation: t
+                }
+              ) }),
+              /* @__PURE__ */ T(
+                xt,
+                {
+                  fallback: /* @__PURE__ */ T(
+                    _,
+                    {
+                      component: e.config.footer?.fallback,
+                      route: e,
+                      navigation: t
+                    }
+                  ),
+                  children: /* @__PURE__ */ T(
+                    _,
+                    {
+                      component: a,
+                      route: e,
+                      navigation: t
+                    }
+                  )
+                }
+              )
             ] }) }) })
           }
         )
@@ -436,41 +319,41 @@ class be extends it {
     );
   }
 }
-function Z({ component: s, route: t, navigation: e }) {
-  B(s) && s.module?.default && (s = s.module.default);
-  const n = s ?? null;
-  return typeof n == "function" || te(n) ? /* @__PURE__ */ b(
+function _({ component: i, route: t, navigation: e }) {
+  B(i) && i.module?.default && (i = i.module.default);
+  const n = i ?? null;
+  return typeof n == "function" || he(n) ? /* @__PURE__ */ T(
     n,
     {
       navigation: e,
       route: t
     }
-  ) : Zt(n) ? Xt(n, {
+  ) : ne(n) ? ie(n, {
     navigation: e,
     route: t
-  }) : /* @__PURE__ */ b(ae, { children: n });
+  }) : /* @__PURE__ */ T(ye, { children: n });
 }
-function Se(s) {
-  return Zt(s) ? Object.getPrototypeOf(s.type) === be : !1;
+function ke(i) {
+  return ne(i) ? Object.getPrototypeOf(i.type) === Re : !1;
 }
-function te(s) {
-  return typeof s == "object" && s !== null && s.$$typeof === Symbol.for("react.lazy");
+function he(i) {
+  return typeof i == "object" && i !== null && i.$$typeof === Symbol.for("react.lazy");
 }
-function B(s) {
-  return te(s) && "load" in s;
+function B(i) {
+  return he(i) && "load" in i;
 }
-function Re(s) {
-  return "style" in s && s.style instanceof CSSStyleDeclaration;
+function xe(i) {
+  return "style" in i && i.style instanceof CSSStyleDeclaration;
 }
-var ke = Object.defineProperty, xe = (s, t, e) => t in s ? ke(s, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : s[t] = e, j = (s, t, e) => (xe(s, typeof t != "symbol" ? t + "" : t, e), e), It = (s, t, e) => {
-  if (!t.has(s))
+var Ce = Object.defineProperty, Le = (i, t, e) => t in i ? Ce(i, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : i[t] = e, F = (i, t, e) => (Le(i, typeof t != "symbol" ? t + "" : t, e), e), Bt = (i, t, e) => {
+  if (!t.has(i))
     throw TypeError("Cannot " + e);
-}, i = (s, t, e) => (It(s, t, "read from private field"), e ? e.call(s) : t.get(s)), g = (s, t, e) => {
-  if (t.has(s))
+}, s = (i, t, e) => (Bt(i, t, "read from private field"), e ? e.call(i) : t.get(i)), v = (i, t, e) => {
+  if (t.has(i))
     throw TypeError("Cannot add the same private member more than once");
-  t instanceof WeakSet ? t.add(s) : t.set(s, e);
-}, c = (s, t, e, n) => (It(s, t, "write to private field"), n ? n.call(s, e) : t.set(s, e), e), f = (s, t, e) => (It(s, t, "access private method"), e);
-const ut = {
+  t instanceof WeakSet ? t.add(i) : t.set(i, e);
+}, c = (i, t, e, n) => (Bt(i, t, "write to private field"), n ? n.call(i, e) : t.set(i, e), e), g = (i, t, e) => (Bt(i, t, "access private method"), e);
+const pt = {
   delay: 0,
   direction: "normal",
   duration: "auto",
@@ -479,80 +362,80 @@ const ut = {
   fill: "auto",
   iterationStart: 0,
   iterations: 1
-}, $t = 1e3, Ce = window.Animation, ft = window.KeyframeEffect;
-function Ft(s) {
-  return Array.isArray(s);
+}, qt = 1e3, Me = window.Animation, yt = window.KeyframeEffect;
+function Yt(i) {
+  return Array.isArray(i);
 }
-function H(s) {
-  return typeof s == "object" && s === null;
+function Y(i) {
+  return typeof i == "object" && i === null;
 }
-function h(s, t) {
-  return H(s) || typeof s == "number" ? s : (t || ([t] = Object.keys(s.type())), s.to(t).value);
+function h(i, t) {
+  return Y(i) || typeof i == "number" ? i : (t || ([t] = Object.keys(i.type())), i.to(t).value);
 }
-function Me(s, t = ut) {
+function Pe(i, t = pt) {
   let { duration: e = "auto", iterations: n = 1, playbackRate: r = 1 } = t;
-  if (H(s))
-    return s;
-  if (typeof s == "number" || s.type().percent === void 0)
+  if (Y(i))
+    return i;
+  if (typeof i == "number" || i.type().percent === void 0)
     throw new DOMException(
       "CSSNumericValue must be a percentage for progress based animations.",
       "NotSupportedError"
     );
   if (e === "auto")
-    e = $t;
+    e = qt;
   else if (e instanceof CSSNumericValue)
     e = e.to("ms").value;
   else if (typeof e == "string")
     throw new TypeError("Unknown effect duration keyword.");
-  const { delay: a = 0, endDelay: o = 0 } = t, l = e / n * n / Math.abs(r), m = a + l + o;
-  return st(
-    s.to("percent").value,
+  const { delay: a = 0, endDelay: o = 0 } = t, l = e / n * n / Math.abs(r), f = a + l + o;
+  return ot(
+    i.to("percent").value,
     [0, 100],
-    [0, m]
+    [0, f]
   );
 }
-function Et(s) {
-  if (H(s) || typeof s == "number")
-    return s;
-  if (s.type().time !== void 0)
+function kt(i) {
+  if (Y(i) || typeof i == "number")
+    return i;
+  if (i.type().time !== void 0)
     throw new DOMException(
       "CSSNumericValue must be a time value for time based animations.",
       "NotSupportedError"
     );
-  return s.to("ms").value;
+  return i.to("ms").value;
 }
-function Kt(s, t) {
-  const e = t.length - 1, n = Math.floor(s * e), r = t[n], a = t[Math.min(n + 1, e)], o = s * e - n;
+function Zt(i, t) {
+  const e = t.length - 1, n = Math.floor(i * e), r = t[n], a = t[Math.min(n + 1, e)], o = i * e - n;
   return r + o * (a - r);
 }
-function Le(s, t, e) {
+function De(i, t, e) {
   let n = 0, r = 0;
-  for (const [a, o] of Object.entries(s)) {
-    const { min: l, max: m } = t, p = e[a] ?? 1, w = (o - l[a]) / (m[a] - l[a]) * p;
-    n += w, r += p;
+  for (const [a, o] of Object.entries(i)) {
+    const { min: l, max: f } = t, d = e[a] ?? 1, m = (o - l[a]) / (f[a] - l[a]) * d;
+    n += m, r += d;
   }
   return n / r;
 }
-function st(s, t, e, n = {}) {
+function ot(i, t, e, n = {}) {
   let r;
-  if (typeof s == "number" && Ft(t)) {
+  if (typeof i == "number" && Yt(t)) {
     const o = { x: t[0] }, l = { x: t[1] };
-    t = { min: o, max: l }, s = { x: s };
+    t = { min: o, max: l }, i = { x: i };
   } else
     throw new TypeError("Input and input range must have the same dimensions.");
-  if (r = Le(s, t, n), r = Pe(r, 0, 1), Ft(e))
-    return Kt(r, e);
+  if (r = De(i, t, n), r = Ne(r, 0, 1), Yt(e))
+    return Zt(r, e);
   const a = {};
   for (const o of Object.keys(e.min)) {
-    const l = e.min[o], m = e.max[o], p = [l, m];
-    a[o] = Kt(r, p);
+    const l = e.min[o], f = e.max[o], d = [l, f];
+    a[o] = Zt(r, d);
   }
   return a;
 }
-function Pe(s, t, e) {
-  return s < t ? t : e && s > e ? e : s;
+function Ne(i, t, e) {
+  return i < t ? t : e && i > e ? e : i;
 }
-function Ot(s) {
+function zt(i) {
   let {
     duration: t = "auto",
     iterations: e = 1,
@@ -561,37 +444,37 @@ function Ot(s) {
     endDelay: a = 0,
     localTime: o = null,
     progress: l = null
-  } = s;
-  const m = new CSSUnitValue(100, "percent");
+  } = i;
+  const f = new CSSUnitValue(100, "percent");
   if (t === "auto")
-    t = $t, r = 0, a = 0;
+    t = qt, r = 0, a = 0;
   else if (t instanceof CSSNumericValue)
     t = t.to("ms").value;
   else if (typeof t == "string")
     throw TypeError("Unknown effect duration keyword.");
-  const p = t / e, w = p * e / Math.abs(n), R = r + w + a;
-  t = new CSSUnitValue(p / R * 100, "percent");
-  const T = CSS.percent(t.to("percent").value * e / Math.abs(n));
-  return o !== null && (l = h(o, "percent") / m.value), {
-    ...s,
+  const d = t / e, m = d * e / Math.abs(n), S = r + m + a;
+  t = new CSSUnitValue(d / S * 100, "percent");
+  const E = CSS.percent(t.to("percent").value * e / Math.abs(n));
+  return o !== null && (l = h(o, "percent") / f.value), {
+    ...i,
     progress: l,
-    activeDuration: T,
+    activeDuration: E,
     duration: t,
     iterations: e,
     delay: r,
     endDelay: a,
-    endTime: m
+    endTime: f
   };
 }
-function ee(s, t) {
-  let { activeDuration: e = 0, localTime: n = null, endTime: r = 1 / 0, delay: a = 0 } = s;
+function ue(i, t) {
+  let { activeDuration: e = 0, localTime: n = null, endTime: r = 1 / 0, delay: a = 0 } = i;
   if (r = h(r), e = h(e), n = h(n), n == null || n === void 0)
     return "idle";
   const o = Math.max(Math.min(a, r), 0), l = Math.max(Math.min(a + e, r), 0);
   return n < o || t === "backwards" && n === o ? "before" : n > l || t === "forwards" && n === l ? "after" : "active";
 }
-function De(s, t) {
-  let { localTime: e = null, delay: n = 0, activeDuration: r = 0, fill: a } = s;
+function Ue(i, t) {
+  let { localTime: e = null, delay: n = 0, activeDuration: r = 0, fill: a } = i;
   if (r = h(r), e = h(e), e == null || e === void 0)
     return null;
   switch (t) {
@@ -605,50 +488,50 @@ function De(s, t) {
       return null;
   }
 }
-function Ae(s, t, e) {
-  const { duration: n = 0, iterations: r = 1, iterationStart: a = 0 } = s;
+function Ae(i, t, e) {
+  const { duration: n = 0, iterations: r = 1, iterationStart: a = 0 } = i;
   if (typeof n != "number")
     throw new TypeError("Duration cannot be unresolved");
   let o = 0;
-  return n === 0 ? t === "before" ? o = 0 : o = r : o = e / Et(n), o + a;
+  return n === 0 ? t === "before" ? o = 0 : o = r : o = e / kt(n), o + a;
 }
-function Ne(s, t, e, n) {
-  const { iterations: r = 1, iterationStart: a = 0, activeDuration: o = 0 } = s;
-  if (H(e))
+function Ie(i, t, e, n) {
+  const { iterations: r = 1, iterationStart: a = 0, activeDuration: o = 0 } = i;
+  if (Y(e))
     return null;
   let l = 0;
   return e === 1 / 0 && (l = a % 1), l === 0 && (t === "active" || t === "after") && o === n && r !== 0 && (l = 1), l;
 }
-function ne(s, t) {
-  const { iterations: e = 1 } = s, n = De(s, t);
-  if (H(n))
+function de(i, t) {
+  const { iterations: e = 1 } = i, n = Ue(i, t);
+  if (Y(n))
     return null;
   if (t === "after" && e === 1 / 0)
     return 1 / 0;
-  const r = Ae(s, t, n);
-  return Ne(s, t, r, n) === 1 ? Math.floor(r) - 1 : Math.floor(r);
+  const r = Ae(i, t, n);
+  return Ie(i, t, r, n) === 1 ? Math.floor(r) - 1 : Math.floor(r);
 }
-class Ue extends Event {
+class We extends Event {
   constructor(t) {
-    super("update", { bubbles: !1, cancelable: !1, composed: !1 }), j(this, "currentTime"), this.currentTime = t;
+    super("update", { bubbles: !1, cancelable: !1, composed: !1 }), F(this, "currentTime"), this.currentTime = t;
   }
 }
-var N, Y;
-class E extends EventTarget {
+var U, Q;
+class b extends EventTarget {
   constructor(t = { type: "swipe", axis: "x", rangeStart: 0, rangeEnd: window.screen.availWidth, source: document.body }) {
-    super(), g(this, N, void 0), g(this, Y, void 0), t.source.addEventListener(t.type, this.onGesture.bind(this)), c(this, Y, CSS.percent(0)), c(this, N, t);
+    super(), v(this, U, void 0), v(this, Q, void 0), t.source.addEventListener(t.type, this.onGesture.bind(this)), c(this, Q, CSS.percent(0)), c(this, U, t);
   }
   onGesture(t) {
-    const e = i(this, N).source.getBoundingClientRect();
+    const e = s(this, U).source.getBoundingClientRect();
     let n = 0;
     const r = {
       x: t.x - e.left,
       y: t.y - e.top
     };
-    switch (i(this, N).type) {
+    switch (s(this, U).type) {
       case "swipe": {
-        const { rangeStart: a, rangeEnd: o } = i(this, N), l = i(this, N).axis;
-        n = st(
+        const { rangeStart: a, rangeEnd: o } = s(this, U), l = s(this, U).axis;
+        n = ot(
           r[l],
           [h(a, "px"), h(o, "px")],
           [0, 100]
@@ -656,9 +539,9 @@ class E extends EventTarget {
         break;
       }
       case "pan": {
-        const { rangeStart: a, rangeEnd: o } = i(this, N), { x: l, y: m } = r;
-        n = st(
-          { x: l, y: m },
+        const { rangeStart: a, rangeEnd: o } = s(this, U), { x: l, y: f } = r;
+        n = ot(
+          { x: l, y: f },
           {
             min: { x: h(a.x, "px"), y: h(a.y, "px") },
             max: { x: h(o.x, "px"), y: h(o.y, "px") }
@@ -669,8 +552,8 @@ class E extends EventTarget {
         break;
       }
       case "pinch": {
-        const { rangeStart: a, rangeEnd: o } = i(this, N), { scale: l } = t;
-        n = st(
+        const { rangeStart: a, rangeEnd: o } = s(this, U), { scale: l } = t;
+        n = ot(
           l,
           [h(a, ""), h(o, "")],
           // figure out which unit
@@ -679,15 +562,15 @@ class E extends EventTarget {
         break;
       }
       case "rotate": {
-        const { rangeStart: a, rangeEnd: o } = i(this, N), { rotation: l } = t;
-        n = st(
+        const { rangeStart: a, rangeEnd: o } = s(this, U), { rotation: l } = t;
+        n = ot(
           l,
           [h(a, "deg"), h(o, "deg")],
           [0, 100]
         );
       }
     }
-    c(this, Y, CSS.percent(n)), this.dispatchEvent(new Ue(i(this, Y)));
+    c(this, Q, CSS.percent(n)), this.dispatchEvent(new We(s(this, Q)));
   }
   addEventListener(t, e, n) {
     super.addEventListener(t, e, n);
@@ -696,26 +579,26 @@ class E extends EventTarget {
     super.removeEventListener(t, e, n);
   }
   get currentTime() {
-    return i(this, Y);
+    return s(this, Q);
   }
   get phase() {
     return "active";
   }
 }
-N = /* @__PURE__ */ new WeakMap(), Y = /* @__PURE__ */ new WeakMap();
-const A = /* @__PURE__ */ new WeakMap();
-var rt;
-class mt extends ft {
+U = /* @__PURE__ */ new WeakMap(), Q = /* @__PURE__ */ new WeakMap();
+const N = /* @__PURE__ */ new WeakMap();
+var lt;
+class wt extends yt {
   constructor(t, e = null) {
-    super(t), g(this, rt, null), c(this, rt, e);
+    super(t), v(this, lt, null), c(this, lt, e);
   }
   get parent() {
-    return i(this, rt);
+    return s(this, lt);
   }
   getTiming() {
     var t;
     const e = super.getTiming();
-    if (((t = A.get(this)) == null ? void 0 : t.timeline) instanceof E) {
+    if (((t = N.get(this)) == null ? void 0 : t.timeline) instanceof b) {
       if (e.duration === 1 / 0)
         throw TypeError("Effect duration cannot be Infinity for non-monotonic timelines.");
       if (e.iterations === 1 / 0)
@@ -726,12 +609,12 @@ class mt extends ft {
   getComputedTiming() {
     var t;
     const e = super.getComputedTiming();
-    if (((t = A.get(this)) == null ? void 0 : t.timeline) instanceof E) {
+    if (((t = N.get(this)) == null ? void 0 : t.timeline) instanceof b) {
       if (e.duration === 1 / 0)
         throw TypeError("Effect duration cannot be Infinity for non-monotonic timelines.");
       if (e.iterations === 1 / 0)
         throw TypeError("Effect iterations cannot be Infinity for non-monotonic timelines.");
-      return Ot(e);
+      return zt(e);
     }
     return e;
   }
@@ -743,12 +626,12 @@ class mt extends ft {
       duration: n.duration instanceof CSSNumericValue ? n.duration.to("ms").value : n.duration,
       ...t
     };
-    let r = i(this, rt);
+    let r = s(this, lt);
     for (; r; ) {
       const a = r.getTiming();
       t != null && t.delay && (t.delay += a.delay ?? 0), t != null && t.endDelay && (t.endDelay += a.endDelay ?? 0), t != null && t.iterationStart && (t.iterationStart += a.iterationStart ?? 0), t != null && t.iterations && (t.iterations *= a.iterations ?? 1), t != null && t.playbackRate && (t.playbackRate *= a.playbackRate ?? 1), a.duration && typeof a.duration != "string" && t?.duration === "auto" && (t.duration = h(a.duration, "ms")), r = r.parent;
     }
-    if (((e = A.get(this)) == null ? void 0 : e.timeline) instanceof E) {
+    if (((e = N.get(this)) == null ? void 0 : e.timeline) instanceof b) {
       if (t?.duration === 1 / 0)
         throw TypeError("Effect duration cannot be Infinity for non-monotonic timelines.");
       if (t != null && t.iterations)
@@ -757,17 +640,17 @@ class mt extends ft {
     return super.updateTiming(t);
   }
 }
-rt = /* @__PURE__ */ new WeakMap();
-var U, _;
-const We = class gt {
+lt = /* @__PURE__ */ new WeakMap();
+var A, tt;
+const $e = class Et {
   constructor(t) {
-    g(this, U, []), g(this, _, null), c(this, U, t.map((e) => (e instanceof gt ? c(e, _, this) : e instanceof ft && (e = new mt(e, this)), e)));
+    v(this, A, []), v(this, tt, null), c(this, A, t.map((e) => (e instanceof Et ? c(e, tt, this) : e instanceof yt && (e = new wt(e, this)), e)));
   }
   get parent() {
-    return i(this, _);
+    return s(this, tt);
   }
   get children() {
-    const t = i(this, U);
+    const t = s(this, A);
     return {
       length: t.length,
       item(e) {
@@ -776,30 +659,30 @@ const We = class gt {
     };
   }
   get firstChild() {
-    return i(this, U).at(0) ?? null;
+    return s(this, A).at(0) ?? null;
   }
   get lastChild() {
-    return i(this, U).at(-1) ?? null;
+    return s(this, A).at(-1) ?? null;
   }
   clone() {
     return structuredClone(this);
   }
   append(...t) {
     t.forEach((e) => {
-      i(this, U).includes(e) || (e instanceof gt ? c(e, _, this) : e instanceof ft && (e = new mt(e, this)), i(this, U).push(e));
+      s(this, A).includes(e) || (e instanceof Et ? c(e, tt, this) : e instanceof yt && (e = new wt(e, this)), s(this, A).push(e));
     });
   }
   prepend(...t) {
     t.forEach((e) => {
-      i(this, U).includes(e) || (e instanceof gt ? c(e, _, this) : e instanceof ft && (e = new mt(e, this)), i(this, U).unshift(e));
+      s(this, A).includes(e) || (e instanceof Et ? c(e, tt, this) : e instanceof yt && (e = new wt(e, this)), s(this, A).unshift(e));
     });
   }
 };
-U = /* @__PURE__ */ new WeakMap(), _ = /* @__PURE__ */ new WeakMap();
-let Vt = We;
-class nt {
+A = /* @__PURE__ */ new WeakMap(), tt = /* @__PURE__ */ new WeakMap();
+let Ht = $e;
+class st {
   constructor() {
-    j(this, "promise"), j(this, "state"), j(this, "nativeResolve"), j(this, "nativeReject"), this.state = "pending", this.nativeResolve = this.nativeReject = null, this.promise = new Promise((t, e) => {
+    F(this, "promise"), F(this, "state"), F(this, "nativeResolve"), F(this, "nativeReject"), this.state = "pending", this.nativeResolve = this.nativeReject = null, this.promise = new Promise((t, e) => {
       this.nativeResolve = t, this.nativeReject = e;
     });
   }
@@ -813,11 +696,11 @@ class nt {
     }), (e = this.nativeReject) == null || e.call(this, t);
   }
 }
-var J, St, ie;
-class Ie extends Vt {
-  constructor(t, e = ut) {
-    super(t), g(this, St), g(this, J, void 0), c(this, J, {
-      ...ut,
+var et, Mt, fe;
+class Oe extends Ht {
+  constructor(t, e = pt) {
+    super(t), v(this, Mt), v(this, et, void 0), c(this, et, {
+      ...pt,
       ...e
     });
   }
@@ -828,31 +711,31 @@ class Ie extends Vt {
     super.append(...t), t.forEach((e) => e.updateTiming());
   }
   getTiming() {
-    return i(this, J);
+    return s(this, et);
   }
   getComputedTiming() {
     var t, e;
     const n = this.getTiming(), r = { ...n }, { delay: a = 0 } = ((t = this.children.item(0)) == null ? void 0 : t.getComputedTiming()) ?? {}, { endDelay: o = 0, endTime: l = 0 } = ((e = this.children.item(this.children.length - 1)) == null ? void 0 : e.getComputedTiming()) ?? {};
     n.delay = n.delay ? n.delay + a : a, n.endDelay = n.endDelay ? n.endDelay + o : o, r.endTime = l;
     for (let C = 0; C < this.children.length; C++) {
-      const M = this.children.item(C);
-      if (!M)
+      const L = this.children.item(C);
+      if (!L)
         continue;
       let {
-        duration: L = "auto",
-        activeDuration: jt = 0
-      } = M.getComputedTiming();
-      r.activeDuration = r.activeDuration ? h(r.activeDuration, "ms") + h(jt, "ms") : jt, n.duration = n.duration instanceof CSSNumericValue ? n.duration.to("ms").value : n.duration, L = L instanceof CSSNumericValue ? L.to("ms").value : L, typeof L != "string" && (n.duration === "auto" ? n.duration = h(L, "ms") : typeof n.duration != "string" && (n.duration = n.duration ? n.duration + L : L));
+        duration: M = "auto",
+        activeDuration: Gt = 0
+      } = L.getComputedTiming();
+      r.activeDuration = r.activeDuration ? h(r.activeDuration, "ms") + h(Gt, "ms") : Gt, n.duration = n.duration instanceof CSSNumericValue ? n.duration.to("ms").value : n.duration, M = M instanceof CSSNumericValue ? M.to("ms").value : M, typeof M != "string" && (n.duration === "auto" ? n.duration = h(M, "ms") : typeof n.duration != "string" && (n.duration = n.duration ? n.duration + M : M));
     }
-    const { timeline: m, startTime: p, currentTime: w } = A.get(this) ?? {}, R = m instanceof E ? "percent" : "ms";
-    let { duration: T = 0, iterations: X = 1 } = r;
-    if (T === "auto" && (T = 0), typeof T == "string")
+    const { timeline: f, startTime: d, currentTime: m } = N.get(this) ?? {}, S = f instanceof b ? "percent" : "ms";
+    let { duration: E = 0, iterations: Z = 1 } = r;
+    if (E === "auto" && (E = 0), typeof E == "string")
       throw new TypeError("Unknown effect duration keyword.");
-    return r.duration = T, r.activeDuration = Et(T) * X, r.startTime = p ?? void 0, r.localTime = w, r.currentIteration = ne(r, ee(r, i(this, St, ie))), m instanceof E ? Ot(r) : (m instanceof DocumentTimeline && (r.progress = w && h(w, R) / h(l, R)), r);
+    return r.duration = E, r.activeDuration = kt(E) * Z, r.startTime = d ?? void 0, r.localTime = m, r.currentIteration = de(r, ue(r, s(this, Mt, fe))), f instanceof b ? zt(r) : (f instanceof DocumentTimeline && (r.progress = m && h(m, S) / h(l, S)), r);
   }
   updateTiming(t) {
-    c(this, J, {
-      ...i(this, J),
+    c(this, et, {
+      ...s(this, et),
       ...t
     });
     for (let e = 0; e < this.children.length; e++) {
@@ -861,23 +744,23 @@ class Ie extends Vt {
     }
   }
 }
-J = /* @__PURE__ */ new WeakMap(), St = /* @__PURE__ */ new WeakSet(), ie = function() {
-  const { playbackRate: s = 1 } = A.get(this) ?? {};
-  return s < 0 ? "backwards" : "forwards";
+et = /* @__PURE__ */ new WeakMap(), Mt = /* @__PURE__ */ new WeakSet(), fe = function() {
+  const { playbackRate: i = 1 } = N.get(this) ?? {};
+  return i < 0 ? "backwards" : "forwards";
 };
-var d, x, ct, v, S, P, u, y, k, z, O, at, W, yt, Rt, Q, ot, q, tt, kt, qt, xt, zt, Ct, Gt, F, G, lt, vt, Mt, I, V, D, $, wt, Lt, Pt;
-const se = class extends EventTarget {
+var p, x, dt, w, R, P, u, y, k, G, V, ct, I, bt, Pt, nt, ht, H, it, Dt, _t, Nt, Jt, Ut, Qt, q, X, ut, Tt, At, W, j, D, $, St, It, Wt;
+const pe = class extends EventTarget {
   constructor(t, e) {
-    super(), g(this, yt), g(this, Q), g(this, q), g(this, kt), g(this, xt), g(this, Ct), g(this, F), g(this, vt), g(this, I), g(this, D), j(this, "id", ""), j(this, "oncancel", null), j(this, "onfinish", null), j(this, "onremove", null), g(this, d, void 0), g(this, x, void 0), g(this, ct, "active"), g(this, v, {
+    super(), v(this, bt), v(this, nt), v(this, H), v(this, Dt), v(this, Nt), v(this, Ut), v(this, q), v(this, Tt), v(this, W), v(this, D), F(this, "id", ""), F(this, "oncancel", null), F(this, "onfinish", null), F(this, "onremove", null), v(this, p, void 0), v(this, x, void 0), v(this, dt, "active"), v(this, w, {
       task: null,
       playbackRate: null
-    }), g(this, S, new nt()), g(this, P, new nt()), g(this, u, null), g(this, y, null), g(this, k, []), g(this, z, null), g(this, O, !1), g(this, at, 0), g(this, W, 1), g(this, lt, () => {
-      f(this, F, G).call(this);
-    }), g(this, wt, () => {
+    }), v(this, R, new st()), v(this, P, new st()), v(this, u, null), v(this, y, null), v(this, k, []), v(this, G, null), v(this, V, !1), v(this, ct, 0), v(this, I, 1), v(this, ut, () => {
+      g(this, q, X).call(this);
+    }), v(this, St, () => {
       var n;
-      if (i(this, P).state !== "pending" || this.playState !== "finished")
+      if (s(this, P).state !== "pending" || this.playState !== "finished")
         return;
-      i(this, P).resolve(this);
+      s(this, P).resolve(this);
       const r = this.currentTime, a = (n = this.timeline) == null ? void 0 : n.currentTime, o = new AnimationPlaybackEvent(
         "finish",
         {
@@ -893,7 +776,7 @@ const se = class extends EventTarget {
         var l;
         this.dispatchEvent(o), (l = this.onfinish) == null || l.call(this, o);
       });
-    }), g(this, Lt, () => {
+    }), v(this, It, () => {
       var n, r;
       const a = this.currentTime, o = (n = this.timeline) == null ? void 0 : n.currentTime, l = new AnimationPlaybackEvent(
         "cancel",
@@ -907,20 +790,20 @@ const se = class extends EventTarget {
         }
       );
       this.dispatchEvent(l), (r = this.oncancel) == null || r.call(this, l);
-    }), g(this, Pt, () => {
+    }), v(this, Wt, () => {
       var n;
       const r = new Event("remove");
       this.dispatchEvent(r), (n = this.onremove) == null || n.call(this, r);
-    }), i(this, S).resolve(this), c(this, x, t ?? null), c(this, d, e ?? document.timeline), i(this, x) && A.set(i(this, x), this), f(this, vt, Mt).call(this), e instanceof E && e.addEventListener("update", i(this, lt));
+    }), s(this, R).resolve(this), c(this, x, t ?? null), c(this, p, e ?? document.timeline), s(this, x) && N.set(s(this, x), this), g(this, Tt, At).call(this), e instanceof b && e.addEventListener("update", s(this, ut));
   }
   reverse() {
     var t;
-    const { endTime: e = 0 } = ((t = i(this, x)) == null ? void 0 : t.getComputedTiming()) ?? {}, n = i(this, v).playbackRate ?? i(this, W), r = h(this.currentTime), a = e === 1 / 0, o = n !== 0 && (n < 0 || r && r > 0 || !a);
-    if (!i(this, d) || !o) {
-      o && (i(this, v).playbackRate = -n);
+    const { endTime: e = 0 } = ((t = s(this, x)) == null ? void 0 : t.getComputedTiming()) ?? {}, n = s(this, w).playbackRate ?? s(this, I), r = h(this.currentTime), a = e === 1 / 0, o = n !== 0 && (n < 0 || r && r > 0 || !a);
+    if (!s(this, p) || !o) {
+      o && (s(this, w).playbackRate = -n);
       return;
     }
-    if (i(this, d).currentTime === null)
+    if (s(this, p).currentTime === null)
       throw new DOMException(
         "Cannot reverse an animation with no active timeline",
         "InvalidStateError"
@@ -928,58 +811,57 @@ const se = class extends EventTarget {
     this.updatePlaybackRate(-n), this.play();
   }
   play() {
-    const t = this.playState === "paused" && this.pending;
-    let e = this.currentTime;
-    (i(this, v).playbackRate ?? this.playbackRate) === 0 && e === null && c(this, y, 0), e === null && c(this, O, !0), (this.playState === "finished" || t) && (c(this, u, null), c(this, y, null), c(this, O, !0)), i(this, y) && c(this, u, null), i(this, v).task && (i(this, v).task = null), !(i(this, u) !== null && i(this, y) === null && !t && i(this, v).playbackRate === null) && (f(this, F, G).call(this), f(this, Q, ot).call(this), i(this, v).task = "play", f(this, I, V).call(this, !1));
+    const t = this.playState === "paused" && this.pending, e = this.currentTime;
+    (s(this, w).playbackRate ?? this.playbackRate) === 0 && e === null && c(this, y, 0), e === null && c(this, V, !0), (this.playState === "finished" || t) && (c(this, u, null), c(this, y, null), c(this, V, !0)), s(this, y) && c(this, u, null), s(this, w).task && (s(this, w).task = null), !(s(this, u) !== null && s(this, y) === null && !t && s(this, w).playbackRate === null) && (g(this, q, X).call(this), g(this, nt, ht).call(this), s(this, w).task = "play", g(this, W, j).call(this, !1));
   }
   pause() {
-    this.playState !== "paused" && (this.currentTime === null && c(this, O, !0), i(this, v).task && (i(this, v).task = null), f(this, Q, ot).call(this), i(this, v).task = "pause");
+    this.playState !== "paused" && (this.currentTime === null && c(this, V, !0), s(this, w).task && (s(this, w).task = null), g(this, nt, ht).call(this), s(this, w).task = "pause");
   }
   persist() {
-    i(this, k).forEach((t) => t.persist()), c(this, ct, "persisted");
+    s(this, k).forEach((t) => t.persist()), c(this, dt, "persisted");
   }
   finish() {
     var t;
-    const { endTime: e = 0 } = ((t = this.effect) == null ? void 0 : t.getComputedTiming()) ?? {}, n = i(this, v).playbackRate ?? i(this, W);
+    const { endTime: e = 0 } = ((t = this.effect) == null ? void 0 : t.getComputedTiming()) ?? {}, n = s(this, w).playbackRate ?? s(this, I);
     if (n === 0 || n > 0 && e === 1 / 0)
       throw new DOMException("InvalidStateError");
-    f(this, D, $).call(this);
+    g(this, D, $).call(this);
     let r;
-    if (n > 0 ? r = e : r = 0, f(this, yt, Rt).call(this, r), this.startTime === null && i(this, d) !== null && i(this, d).currentTime !== null && r !== null) {
-      const a = i(this, d) instanceof E ? "percent" : "ms";
+    if (n > 0 ? r = e : r = 0, g(this, bt, Pt).call(this, r), this.startTime === null && s(this, p) !== null && s(this, p).currentTime !== null && r !== null) {
+      const a = s(this, p) instanceof b ? "percent" : "ms";
       r = h(r, a);
-      const o = h(i(this, d).currentTime, a);
+      const o = h(s(this, p).currentTime, a);
       c(this, u, o - r / n);
     }
-    i(this, v).task === "pause" && i(this, u) !== null && (c(this, y, null), f(this, q, tt).call(this), i(this, S).resolve(this)), i(this, v).task === "play" && i(this, u) !== null && (f(this, q, tt).call(this), i(this, S).resolve(this)), f(this, I, V).call(this, !0), i(this, k).forEach((a) => a.finish());
+    s(this, w).task === "pause" && s(this, u) !== null && (c(this, y, null), g(this, H, it).call(this), s(this, R).resolve(this)), s(this, w).task === "play" && s(this, u) !== null && (g(this, H, it).call(this), s(this, R).resolve(this)), g(this, W, j).call(this, !0), s(this, k).forEach((a) => a.finish());
   }
   commitStyles() {
-    i(this, k).forEach((t) => {
-      t.effect instanceof mt && (t.effect.target === null || t.effect.pseudoElement !== null) || t.commitStyles();
+    s(this, k).forEach((t) => {
+      t.effect instanceof wt && (t.effect.target === null || t.effect.pseudoElement !== null) || t.commitStyles();
     });
   }
   cancel() {
-    this.playState !== "idle" && (f(this, D, $).call(this), i(this, S).reject(new DOMException("The user aborted a request", "AbortError")), f(this, q, tt).call(this), c(this, S, new nt()), i(this, P).state === "pending" && i(this, P).reject(new DOMException("The user aborted a request", "AbortError")), c(this, P, new nt()), i(this, k).forEach((t) => t.cancel())), c(this, u, null), c(this, y, null);
+    this.playState !== "idle" && (g(this, D, $).call(this), s(this, R).reject(new DOMException("The user aborted a request", "AbortError")), g(this, H, it).call(this), c(this, R, new st()), s(this, P).state === "pending" && s(this, P).reject(new DOMException("The user aborted a request", "AbortError")), c(this, P, new st()), s(this, k).forEach((t) => t.cancel())), c(this, u, null), c(this, y, null);
   }
   updatePlaybackRate(t) {
     var e;
-    i(this, v).playbackRate = t;
+    s(this, w).playbackRate = t;
     const n = this.playState;
-    if (i(this, S).state !== "pending")
+    if (s(this, R).state !== "pending")
       switch (n) {
         case "idle":
         case "paused":
-          f(this, D, $).call(this);
+          g(this, D, $).call(this);
           break;
         case "finished": {
-          const r = i(this, d) instanceof E ? "percent" : "ms", a = ((e = i(this, d)) == null ? void 0 : e.currentTime) ?? null;
+          const r = s(this, p) instanceof b ? "percent" : "ms", a = ((e = s(this, p)) == null ? void 0 : e.currentTime) ?? null;
           if (t === 0)
             c(this, u, h(a, r));
           else if (a !== null) {
             let o = null;
-            o = (h(a, r) - (i(this, u) ?? 0)) * this.playbackRate, i(this, u) !== null && o !== null && c(this, u, (h(a, r) - o) / t);
+            o = (h(a, r) - (s(this, u) ?? 0)) * this.playbackRate, s(this, u) !== null && o !== null && c(this, u, (h(a, r) - o) / t);
           }
-          f(this, D, $).call(this), f(this, I, V).call(this, !1), f(this, F, G).call(this);
+          g(this, D, $).call(this), g(this, W, j).call(this, !1), g(this, q, X).call(this);
           break;
         }
         default:
@@ -993,212 +875,210 @@ const se = class extends EventTarget {
     super.removeEventListener(t, e, n);
   }
   set playbackRate(t) {
-    c(this, W, t), i(this, k).forEach((e) => {
+    c(this, I, t), s(this, k).forEach((e) => {
       e.playbackRate *= t;
     });
   }
   set startTime(t) {
-    c(this, u, h(t)), i(this, k).forEach((e) => e.startTime = t);
+    c(this, u, h(t)), s(this, k).forEach((e) => e.startTime = t);
   }
   set currentTime(t) {
     var e;
-    const n = i(this, d) instanceof E ? "percent" : "ms", r = h(((e = i(this, d)) == null ? void 0 : e.currentTime) ?? null, n);
-    if (H(t) && !H(r))
+    const n = s(this, p) instanceof b ? "percent" : "ms", r = h(((e = s(this, p)) == null ? void 0 : e.currentTime) ?? null, n);
+    if (Y(t) && !Y(r))
       throw new TypeError("currentTime may not be changed from resolved to unresolved.");
-    c(this, O, !1), i(this, y) !== null || i(this, u) === null || r === null || this.playbackRate === 0 ? c(this, y, h(t, n)) : c(this, u, r - h(t, n) / this.playbackRate), (i(this, d) === null || r === null) && c(this, u, null), c(this, z, null), f(this, yt, Rt).call(this, t), i(this, v).task === "pause" && (c(this, y, h(t, n)), f(this, D, $).call(this), c(this, u, null), f(this, q, tt).call(this), i(this, S).resolve(this)), f(this, I, V).call(this, !0);
+    c(this, V, !1), s(this, y) !== null || s(this, u) === null || r === null || this.playbackRate === 0 ? c(this, y, h(t, n)) : c(this, u, r - h(t, n) / this.playbackRate), (s(this, p) === null || r === null) && c(this, u, null), c(this, G, null), g(this, bt, Pt).call(this, t), s(this, w).task === "pause" && (c(this, y, h(t, n)), g(this, D, $).call(this), c(this, u, null), g(this, H, it).call(this), s(this, R).resolve(this)), g(this, W, j).call(this, !0);
   }
   set timeline(t) {
     var e, n;
     const r = this.timeline;
     if (r === t)
       return;
-    i(this, d) instanceof E && i(this, d).removeEventListener("update", i(this, lt));
-    const a = this.playState, o = r instanceof E ? "percent" : "ms", l = h(this.currentTime, o), { progress: m = null, endTime: p = 0 } = ((e = i(this, x)) == null ? void 0 : e.getComputedTiming()) ?? {}, w = h(p, o), R = r instanceof E, T = t instanceof E, X = t instanceof DocumentTimeline, C = this.pending;
-    if (T)
-      c(this, d, t), t.addEventListener("update", i(this, lt)), f(this, D, $).call(this), c(this, O, !0), c(this, u, null), c(this, y, null), (a === "running" || a === "finished") && ((!i(this, S) || i(this, S).state === "resolved") && f(this, Q, ot).call(this), i(this, v).task = "play", i(this, k).forEach((M) => M.pause())), a === "paused" && m !== null && c(this, y, m * w), C && ((!i(this, S) || i(this, S).state === "resolved") && f(this, Q, ot).call(this), a === "paused" ? i(this, v).task = "pause" : i(this, v).task = "play"), i(this, u) !== null && c(this, y, null), f(this, I, V).call(this, !1);
-    else if (X) {
-      if (c(this, d, t), R) {
-        if (l !== null && m !== null) {
-          const { endTime: M = 0 } = ((n = i(this, x)) == null ? void 0 : n.getComputedTiming()) ?? {}, L = h(M, "ms");
-          this.currentTime = m * L;
+    s(this, p) instanceof b && s(this, p).removeEventListener("update", s(this, ut));
+    const a = this.playState, o = r instanceof b ? "percent" : "ms", l = h(this.currentTime, o), { progress: f = null, endTime: d = 0 } = ((e = s(this, x)) == null ? void 0 : e.getComputedTiming()) ?? {}, m = h(d, o), S = r instanceof b, E = t instanceof b, Z = t instanceof DocumentTimeline, C = this.pending;
+    if (E)
+      c(this, p, t), t.addEventListener("update", s(this, ut)), g(this, D, $).call(this), c(this, V, !0), c(this, u, null), c(this, y, null), (a === "running" || a === "finished") && ((!s(this, R) || s(this, R).state === "resolved") && g(this, nt, ht).call(this), s(this, w).task = "play", s(this, k).forEach((L) => L.pause())), a === "paused" && f !== null && c(this, y, f * m), C && ((!s(this, R) || s(this, R).state === "resolved") && g(this, nt, ht).call(this), a === "paused" ? s(this, w).task = "pause" : s(this, w).task = "play"), s(this, u) !== null && c(this, y, null), g(this, W, j).call(this, !1);
+    else if (Z) {
+      if (c(this, p, t), S) {
+        if (l !== null && f !== null) {
+          const { endTime: L = 0 } = ((n = s(this, x)) == null ? void 0 : n.getComputedTiming()) ?? {}, M = h(L, "ms");
+          this.currentTime = f * M;
         }
         switch (a) {
           case "paused":
-            i(this, k).forEach((M) => M.pause());
+            s(this, k).forEach((L) => L.pause());
             break;
           case "running":
           case "finished":
-            i(this, k).forEach((M) => M.play());
+            s(this, k).forEach((L) => L.play());
         }
       }
     } else
       throw TypeError("Unsupported timeline: " + t);
   }
   set effect(t) {
-    if (t !== i(this, x)) {
-      if (this.pending && f(this, q, tt).call(this), i(this, x) && A.delete(i(this, x)), t) {
-        const e = A.get(t);
-        e && (e.effect = null), A.set(t, this);
+    if (t !== s(this, x)) {
+      if (this.pending && g(this, H, it).call(this), s(this, x) && N.delete(s(this, x)), t) {
+        const e = N.get(t);
+        e && (e.effect = null), N.set(t, this);
       }
-      c(this, x, t), f(this, vt, Mt).call(this), f(this, I, V).call(this, !1);
+      c(this, x, t), g(this, Tt, At).call(this), g(this, W, j).call(this, !1);
     }
   }
   get ready() {
-    return i(this, S).promise;
+    return s(this, R).promise;
   }
   get finished() {
-    return i(this, P).promise;
+    return s(this, P).promise;
   }
   get playState() {
     var t;
     let { endTime: e = 0 } = ((t = this.effect) == null ? void 0 : t.getComputedTiming()) ?? {};
-    const n = i(this, d) instanceof E ? "percent" : "ms", r = h(this.startTime, n), a = h(this.currentTime, n);
-    return e = h(e, n), a === null && r === null && i(this, v).task === null ? "idle" : i(this, v).task === "pause" || r === null && i(this, v).task !== "play" ? "paused" : a !== null && (i(this, W) > 0 && a >= e || i(this, W) < 0 && a <= 0) ? "finished" : "running";
+    const n = s(this, p) instanceof b ? "percent" : "ms", r = h(this.startTime, n), a = h(this.currentTime, n);
+    return e = h(e, n), a === null && r === null && s(this, w).task === null ? "idle" : s(this, w).task === "pause" || r === null && s(this, w).task !== "play" ? "paused" : a !== null && (s(this, I) > 0 && a >= e || s(this, I) < 0 && a <= 0) ? "finished" : "running";
   }
   get playbackRate() {
-    return i(this, W);
+    return s(this, I);
   }
   get replaceState() {
-    return i(this, ct);
+    return s(this, dt);
   }
   get pending() {
-    return i(this, S).state === "pending";
+    return s(this, R).state === "pending";
   }
   get currentTime() {
     var t;
     const e = ((t = this.timeline) == null ? void 0 : t.currentTime) ?? null;
-    if (i(this, y)) {
+    if (s(this, y)) {
       if (typeof e == "number")
-        return i(this, y);
-      const a = i(this, d) instanceof E ? "percent" : "ms";
-      return new CSSUnitValue(i(this, y), a);
+        return s(this, y);
+      const a = s(this, p) instanceof b ? "percent" : "ms";
+      return new CSSUnitValue(s(this, y), a);
     }
-    if (e === null || i(this, u) === null)
+    if (e === null || s(this, u) === null)
       return null;
-    const n = i(this, d) instanceof E ? "percent" : "ms";
-    let r = (h(e, n) - i(this, u)) * this.playbackRate;
+    const n = s(this, p) instanceof b ? "percent" : "ms";
+    let r = (h(e, n) - s(this, u)) * this.playbackRate;
     return r === -0 && (r = 0), typeof e == "number" ? r : new CSSUnitValue(r, n);
   }
   get startTime() {
     var t;
-    if (i(this, u) === null)
+    if (s(this, u) === null)
       return null;
     if (typeof (((t = this.timeline) == null ? void 0 : t.currentTime) ?? null) == "number")
-      return i(this, u);
-    const e = i(this, d) instanceof E ? "percent" : "ms";
-    return new CSSUnitValue(i(this, u), e);
+      return s(this, u);
+    const e = s(this, p) instanceof b ? "percent" : "ms";
+    return new CSSUnitValue(s(this, u), e);
   }
   get timeline() {
-    return i(this, d);
+    return s(this, p);
   }
   get effect() {
-    return i(this, x);
+    return s(this, x);
   }
 };
-d = /* @__PURE__ */ new WeakMap(), x = /* @__PURE__ */ new WeakMap(), ct = /* @__PURE__ */ new WeakMap(), v = /* @__PURE__ */ new WeakMap(), S = /* @__PURE__ */ new WeakMap(), P = /* @__PURE__ */ new WeakMap(), u = /* @__PURE__ */ new WeakMap(), y = /* @__PURE__ */ new WeakMap(), k = /* @__PURE__ */ new WeakMap(), z = /* @__PURE__ */ new WeakMap(), O = /* @__PURE__ */ new WeakMap(), at = /* @__PURE__ */ new WeakMap(), W = /* @__PURE__ */ new WeakMap(), yt = /* @__PURE__ */ new WeakSet(), Rt = function(s) {
+p = /* @__PURE__ */ new WeakMap(), x = /* @__PURE__ */ new WeakMap(), dt = /* @__PURE__ */ new WeakMap(), w = /* @__PURE__ */ new WeakMap(), R = /* @__PURE__ */ new WeakMap(), P = /* @__PURE__ */ new WeakMap(), u = /* @__PURE__ */ new WeakMap(), y = /* @__PURE__ */ new WeakMap(), k = /* @__PURE__ */ new WeakMap(), G = /* @__PURE__ */ new WeakMap(), V = /* @__PURE__ */ new WeakMap(), ct = /* @__PURE__ */ new WeakMap(), I = /* @__PURE__ */ new WeakMap(), bt = /* @__PURE__ */ new WeakSet(), Pt = function(i) {
   var t;
-  const e = h(((t = i(this, d)) == null ? void 0 : t.currentTime) ?? null);
-  if (s === null && e !== null)
+  const e = h(((t = s(this, p)) == null ? void 0 : t.currentTime) ?? null);
+  if (i === null && e !== null)
     throw new TypeError();
-  s === null || e === null || (s = h(s), c(this, O, !1), i(this, y) !== null || i(this, u) === null || i(this, d) instanceof E && i(this, d).phase === "inactive" || i(this, W) === 0 ? c(this, y, s) : c(this, u, e - s / i(this, W)), i(this, d) instanceof E && i(this, d).phase === "inactive" && c(this, u, null), c(this, z, null));
-}, Q = /* @__PURE__ */ new WeakSet(), ot = function() {
-  i(this, S).state !== "pending" && c(this, S, new nt()), cancelAnimationFrame(i(this, at)), c(this, at, requestAnimationFrame(() => {
-    var s;
-    (((s = i(this, d)) == null ? void 0 : s.currentTime) ?? null) !== null && (f(this, Ct, Gt).call(this), i(this, v).task === "play" && (i(this, u) !== null || i(this, y) !== null) ? f(this, kt, qt).call(this) : i(this, v).task === "pause" && f(this, xt, zt).call(this), Promise.all(i(this, k).map((t) => t.finished)).then(i(this, wt)), Promise.all(i(this, k).map((t) => new Promise((e) => t.onremove = e))).then(i(this, Pt)), Promise.all(i(this, k).map((t) => new Promise((e) => t.oncancel = e))).then(i(this, Lt)).then(() => c(this, ct, "removed")));
+  i === null || e === null || (i = h(i), c(this, V, !1), s(this, y) !== null || s(this, u) === null || s(this, p) instanceof b && s(this, p).phase === "inactive" || s(this, I) === 0 ? c(this, y, i) : c(this, u, e - i / s(this, I)), s(this, p) instanceof b && s(this, p).phase === "inactive" && c(this, u, null), c(this, G, null));
+}, nt = /* @__PURE__ */ new WeakSet(), ht = function() {
+  s(this, R).state !== "pending" && c(this, R, new st()), cancelAnimationFrame(s(this, ct)), c(this, ct, requestAnimationFrame(() => {
+    var i;
+    (((i = s(this, p)) == null ? void 0 : i.currentTime) ?? null) !== null && (g(this, Ut, Qt).call(this), s(this, w).task === "play" && (s(this, u) !== null || s(this, y) !== null) ? g(this, Dt, _t).call(this) : s(this, w).task === "pause" && g(this, Nt, Jt).call(this), Promise.all(s(this, k).map((t) => t.finished)).then(s(this, St)), Promise.all(s(this, k).map((t) => new Promise((e) => t.onremove = e))).then(s(this, Wt)), Promise.all(s(this, k).map((t) => new Promise((e) => t.oncancel = e))).then(s(this, It)).then(() => c(this, dt, "removed")));
   }));
-}, q = /* @__PURE__ */ new WeakSet(), tt = function() {
-  cancelAnimationFrame(i(this, at)), i(this, v).task = null;
-}, kt = /* @__PURE__ */ new WeakSet(), qt = function() {
-  var s;
-  const t = ((s = this.timeline) == null ? void 0 : s.currentTime) ?? null;
+}, H = /* @__PURE__ */ new WeakSet(), it = function() {
+  cancelAnimationFrame(s(this, ct)), s(this, w).task = null;
+}, Dt = /* @__PURE__ */ new WeakSet(), _t = function() {
+  var i;
+  const t = ((i = this.timeline) == null ? void 0 : i.currentTime) ?? null;
   if (t === null)
     return;
-  const e = i(this, d) instanceof E ? "percent" : "ms";
-  if (i(this, y) !== null)
-    f(this, D, $).call(this), this.playbackRate === 0 ? c(this, u, h(t, e)) : (c(this, u, h(t, e) - i(this, y) / this.playbackRate), c(this, y, null));
-  else if (i(this, u) !== null && i(this, v).playbackRate !== null) {
-    const n = (h(t, e) - i(this, u)) * this.playbackRate;
-    f(this, D, $).call(this);
+  const e = s(this, p) instanceof b ? "percent" : "ms";
+  if (s(this, y) !== null)
+    g(this, D, $).call(this), this.playbackRate === 0 ? c(this, u, h(t, e)) : (c(this, u, h(t, e) - s(this, y) / this.playbackRate), c(this, y, null));
+  else if (s(this, u) !== null && s(this, w).playbackRate !== null) {
+    const n = (h(t, e) - s(this, u)) * this.playbackRate;
+    g(this, D, $).call(this);
     const r = this.playbackRate;
     r === 0 ? (c(this, y, null), c(this, u, h(t, e))) : c(this, u, h(t, e) - n / r);
   }
-  i(this, S).state === "pending" && i(this, S).resolve(this), f(this, I, V).call(this, !1), f(this, F, G).call(this), i(this, v).task = null, this.timeline instanceof DocumentTimeline && i(this, k).forEach((n) => n.play());
-}, xt = /* @__PURE__ */ new WeakSet(), zt = function() {
-  var s;
-  const t = ((s = this.timeline) == null ? void 0 : s.currentTime) ?? null;
+  s(this, R).state === "pending" && s(this, R).resolve(this), g(this, W, j).call(this, !1), g(this, q, X).call(this), s(this, w).task = null, this.timeline instanceof DocumentTimeline && s(this, k).forEach((n) => n.play());
+}, Nt = /* @__PURE__ */ new WeakSet(), Jt = function() {
+  var i;
+  const t = ((i = this.timeline) == null ? void 0 : i.currentTime) ?? null;
   if (t === null)
     return;
-  const e = i(this, d) instanceof E ? "percent" : "ms", n = t;
-  i(this, u) !== null && i(this, y) === null && c(this, y, (h(n, e) - i(this, u)) * this.playbackRate), f(this, D, $).call(this), c(this, u, null), i(this, S).resolve(this), f(this, I, V).call(this, !1), f(this, F, G).call(this), i(this, v).task = null, i(this, k).forEach((r) => r.pause());
-}, Ct = /* @__PURE__ */ new WeakSet(), Gt = function() {
-  if (i(this, O) && !(!i(this, d) || !i(this, d).currentTime) && !(this.playState === "idle" || this.playState === "paused" && i(this, y) !== null)) {
-    if (i(this, d) instanceof E) {
-      const s = i(this, v).playbackRate ?? this.playbackRate;
-      c(this, u, s >= 0 ? 0 : 100);
+  const e = s(this, p) instanceof b ? "percent" : "ms", n = t;
+  s(this, u) !== null && s(this, y) === null && c(this, y, (h(n, e) - s(this, u)) * this.playbackRate), g(this, D, $).call(this), c(this, u, null), s(this, R).resolve(this), g(this, W, j).call(this, !1), g(this, q, X).call(this), s(this, w).task = null, s(this, k).forEach((r) => r.pause());
+}, Ut = /* @__PURE__ */ new WeakSet(), Qt = function() {
+  if (s(this, V) && !(!s(this, p) || !s(this, p).currentTime) && !(this.playState === "idle" || this.playState === "paused" && s(this, y) !== null)) {
+    if (s(this, p) instanceof b) {
+      const i = s(this, w).playbackRate ?? this.playbackRate;
+      c(this, u, i >= 0 ? 0 : 100);
     } else
-      c(this, u, h(i(this, d).currentTime, "ms"));
+      c(this, u, h(s(this, p).currentTime, "ms"));
     c(this, y, null);
   }
-}, F = /* @__PURE__ */ new WeakSet(), G = function() {
-  var s;
-  const t = ((s = i(this, d)) == null ? void 0 : s.currentTime) ?? null;
+}, q = /* @__PURE__ */ new WeakSet(), X = function() {
+  var i;
+  const t = ((i = s(this, p)) == null ? void 0 : i.currentTime) ?? null;
   if (t === null)
     return;
-  const e = i(this, x), n = i(this, d) instanceof E ? Me(t, e?.getTiming()) : Et(t);
+  const e = s(this, x), n = s(this, p) instanceof b ? Pe(t, e?.getTiming()) : kt(t);
   let r = null;
-  if (i(this, u) !== null) {
+  if (s(this, u) !== null) {
     const a = h(t, "percent") === (this.playbackRate < 0 ? 0 : 100) ? this.playbackRate < 0 ? 1e-3 : -1e-3 : 0;
-    r = (n - i(this, u)) * this.playbackRate, r += a;
-  } else if (i(this, y) !== null)
-    r = i(this, y);
+    r = (n - s(this, u)) * this.playbackRate, r += a;
+  } else if (s(this, y) !== null)
+    r = s(this, y);
   else
     return;
-  i(this, k).forEach((a) => a.currentTime = r);
-}, lt = /* @__PURE__ */ new WeakMap(), vt = /* @__PURE__ */ new WeakSet(), Mt = function() {
-  var s;
-  let t = i(this, x);
-  const e = [];
-  if (t instanceof Vt)
+  s(this, k).forEach((a) => a.currentTime = r);
+}, ut = /* @__PURE__ */ new WeakMap(), Tt = /* @__PURE__ */ new WeakSet(), At = function() {
+  var i;
+  const t = s(this, x), e = [];
+  if (t instanceof Ht)
     for (let n = 0; n < t.children.length; n++) {
-      const r = new se(t.children.item(n));
-      if (t instanceof Ie && n > 0) {
-        const { endTime: a = null } = ((s = e[n - 1].effect) == null ? void 0 : s.getComputedTiming()) ?? {};
+      const r = new pe(t.children.item(n));
+      if (t instanceof Oe && n > 0) {
+        const { endTime: a = null } = ((i = e[n - 1].effect) == null ? void 0 : i.getComputedTiming()) ?? {};
         r.startTime = h(a, "ms");
       }
       e.push(r);
     }
   else {
-    const n = i(this, d) instanceof E ? document.timeline : i(this, d);
-    e.push(new Ce(t, n));
+    const n = s(this, p) instanceof b ? document.timeline : s(this, p);
+    e.push(new Me(t, n));
   }
   c(this, k, e);
-}, I = /* @__PURE__ */ new WeakSet(), V = function(s) {
+}, W = /* @__PURE__ */ new WeakSet(), j = function(i) {
   var t, e;
-  const n = ((t = i(this, d)) == null ? void 0 : t.currentTime) ?? null, r = i(this, d) instanceof E ? "percent" : "ms";
-  let a = h(this.currentTime, r);
-  if (a && i(this, u) !== null && !this.pending) {
-    let { delay: o = 0, endDelay: l = 0, iterations: m = 1, duration: p = "auto" } = ((e = i(this, x)) == null ? void 0 : e.getTiming()) ?? {};
-    const w = i(this, v).playbackRate ?? this.playbackRate;
-    if (p === "auto")
-      p = i(this, d) instanceof E ? $t : 0;
-    else if (p instanceof CSSNumericValue)
-      p = p.to("ms").value;
-    else if (typeof p == "string")
+  const n = ((t = s(this, p)) == null ? void 0 : t.currentTime) ?? null, r = s(this, p) instanceof b ? "percent" : "ms", a = h(this.currentTime, r);
+  if (a && s(this, u) !== null && !this.pending) {
+    let { delay: o = 0, endDelay: l = 0, iterations: f = 1, duration: d = "auto" } = ((e = s(this, x)) == null ? void 0 : e.getTiming()) ?? {};
+    const m = s(this, w).playbackRate ?? this.playbackRate;
+    if (d === "auto")
+      d = s(this, p) instanceof b ? qt : 0;
+    else if (d instanceof CSSNumericValue)
+      d = d.to("ms").value;
+    else if (typeof d == "string")
       throw new TypeError("Unknown effect duration keyword.");
-    const R = o + p * m + l;
-    let T = h(i(this, z), r);
-    w > 0 && a >= R && i(this, z) !== null ? ((T === null || T < R) && (T = R), c(this, y, s ? a : T)) : w < 0 && a <= 0 ? ((T === null || T > 0) && (T = 0), c(this, y, s ? a : T)) : w !== 0 && (s && i(this, y) !== null && (n !== null ? c(this, u, h(n, r) - i(this, y) / w) : c(this, u, null)), c(this, y, null));
+    const S = o + d * f + l;
+    let E = h(s(this, G), r);
+    m > 0 && a >= S && s(this, G) !== null ? ((E === null || E < S) && (E = S), c(this, y, i ? a : E)) : m < 0 && a <= 0 ? ((E === null || E > 0) && (E = 0), c(this, y, i ? a : E)) : m !== 0 && (i && s(this, y) !== null && (n !== null ? c(this, u, h(n, r) - s(this, y) / m) : c(this, u, null)), c(this, y, null));
   }
-  f(this, F, G).call(this), c(this, z, this.currentTime), this.playState === "finished" ? i(this, P).state === "pending" && i(this, wt).call(this) : i(this, P).state === "resolved" && c(this, P, new nt());
+  g(this, q, X).call(this), c(this, G, this.currentTime), this.playState === "finished" ? s(this, P).state === "pending" && s(this, St).call(this) : s(this, P).state === "resolved" && c(this, P, new st());
 }, D = /* @__PURE__ */ new WeakSet(), $ = function() {
-  i(this, v).playbackRate && (this.playbackRate = i(this, v).playbackRate), i(this, v).playbackRate = null;
-}, wt = /* @__PURE__ */ new WeakMap(), Lt = /* @__PURE__ */ new WeakMap(), Pt = /* @__PURE__ */ new WeakMap();
-let $e = se;
-var et, Dt, re;
-class At extends Vt {
-  constructor(t, e = ut) {
-    super(t), g(this, Dt), g(this, et, void 0), c(this, et, {
-      ...ut,
+  s(this, w).playbackRate && (this.playbackRate = s(this, w).playbackRate), s(this, w).playbackRate = null;
+}, St = /* @__PURE__ */ new WeakMap(), It = /* @__PURE__ */ new WeakMap(), Wt = /* @__PURE__ */ new WeakMap();
+let Ve = pe;
+var rt, $t, me;
+class Ot extends Ht {
+  constructor(t, e = pt) {
+    super(t), v(this, $t), v(this, rt, void 0), c(this, rt, {
+      ...pt,
       ...e
     }), t.forEach((n) => n.updateTiming());
   }
@@ -1209,32 +1089,32 @@ class At extends Vt {
     super.append(...t), t.forEach((e) => e.updateTiming());
   }
   getTiming() {
-    return i(this, et);
+    return s(this, rt);
   }
   getComputedTiming() {
     const t = this.getTiming(), e = { ...t };
-    for (let w = 0; w < this.children.length; w++) {
-      const R = this.children.item(w);
-      if (!R)
+    for (let m = 0; m < this.children.length; m++) {
+      const S = this.children.item(m);
+      if (!S)
         continue;
       let {
-        delay: T = 0,
-        endDelay: X = 0,
+        delay: E = 0,
+        endDelay: Z = 0,
         duration: C = "auto",
-        activeDuration: M = 0,
-        endTime: L = 0
-      } = R.getComputedTiming();
-      t.delay = t.delay ? Math.min(t.delay, T) : T, t.endDelay = t.endDelay ? Math.max(t.endDelay, X) : X, e.endTime = e.endTime ? Math.max(h(e.endTime, "ms"), h(L, "ms")) : L, e.activeDuration = e.activeDuration ? Math.max(h(e.activeDuration, "ms"), h(M, "ms")) : M, t.duration = t.duration instanceof CSSNumericValue ? t.duration.to("ms").value : t.duration, C = C instanceof CSSNumericValue ? C.to("ms").value : C, typeof C != "string" && (t.duration === "auto" ? t.duration = h(C, "ms") : typeof t.duration != "string" && (t.duration = t.duration ? Math.max(t.duration, C) : C));
+        activeDuration: L = 0,
+        endTime: M = 0
+      } = S.getComputedTiming();
+      t.delay = t.delay ? Math.min(t.delay, E) : E, t.endDelay = t.endDelay ? Math.max(t.endDelay, Z) : Z, e.endTime = e.endTime ? Math.max(h(e.endTime, "ms"), h(M, "ms")) : M, e.activeDuration = e.activeDuration ? Math.max(h(e.activeDuration, "ms"), h(L, "ms")) : L, t.duration = t.duration instanceof CSSNumericValue ? t.duration.to("ms").value : t.duration, C = C instanceof CSSNumericValue ? C.to("ms").value : C, typeof C != "string" && (t.duration === "auto" ? t.duration = h(C, "ms") : typeof t.duration != "string" && (t.duration = t.duration ? Math.max(t.duration, C) : C));
     }
-    const { timeline: n, startTime: r, currentTime: a } = A.get(this) ?? {}, o = n instanceof E ? "percent" : "ms";
-    let { duration: l = 0, iterations: m = 1, endTime: p = 0 } = e;
+    const { timeline: n, startTime: r, currentTime: a } = N.get(this) ?? {}, o = n instanceof b ? "percent" : "ms";
+    let { duration: l = 0, iterations: f = 1, endTime: d = 0 } = e;
     if (l === "auto" && (l = 0), typeof l == "string")
       throw new TypeError("Unknown effect duration keyword.");
-    return e.duration = l, e.activeDuration = Et(l) * m, e.startTime = r ?? void 0, e.localTime = a, e.currentIteration = ne(e, ee(e, i(this, Dt, re))), n instanceof E ? Ot(e) : (n instanceof DocumentTimeline && (e.progress = a && h(a, o) / h(p, o)), e);
+    return e.duration = l, e.activeDuration = kt(l) * f, e.startTime = r ?? void 0, e.localTime = a, e.currentIteration = de(e, ue(e, s(this, $t, me))), n instanceof b ? zt(e) : (n instanceof DocumentTimeline && (e.progress = a && h(a, o) / h(d, o)), e);
   }
   updateTiming(t) {
-    c(this, et, {
-      ...i(this, et),
+    c(this, rt, {
+      ...s(this, rt),
       ...t
     });
     for (let e = 0; e < this.children.length; e++) {
@@ -1243,12 +1123,135 @@ class At extends Vt {
     }
   }
 }
-et = /* @__PURE__ */ new WeakMap(), Dt = /* @__PURE__ */ new WeakSet(), re = function() {
-  const { playbackRate: s = 1 } = A.get(this) ?? {};
-  return s < 0 ? "backwards" : "forwards";
+rt = /* @__PURE__ */ new WeakMap(), $t = /* @__PURE__ */ new WeakSet(), me = function() {
+  const { playbackRate: i = 1 } = N.get(this) ?? {};
+  return i < 0 ? "backwards" : "forwards";
 };
-class Oe extends it {
-  ref = K();
+function Vt(i, t) {
+  i.endsWith("*") || (i += "**");
+  const e = window.location.origin, n = new URLPattern(i, e).exec(t, e);
+  if (!n)
+    return null;
+  const a = Object.keys(n.pathname.groups).filter((o) => !isNaN(Number(o))).map((o) => n.pathname.groups[o]).filter((o) => o !== void 0).at(oe) ?? "";
+  return new URL(
+    t.replace(a, ""),
+    window.location.origin
+  );
+}
+function te(i, t, e = `${window.location.origin}/`, n = !0) {
+  n || (i = i.toLowerCase(), t = t.toLowerCase());
+  const r = Vt(e, t)?.href;
+  if (!r)
+    return null;
+  const a = new URLPattern({
+    baseURL: r,
+    pathname: i
+  }).exec({ pathname: t, baseURL: r }), o = a?.pathname.groups ?? {};
+  return a ? {
+    params: o,
+    caseSensitive: n
+  } : null;
+}
+function je(i, t = window) {
+  return new Promise((e) => {
+    queueMicrotask(() => e(
+      t.dispatchEvent(i)
+    ));
+  });
+}
+function on(i) {
+  const t = we(i);
+  return t.load = async () => (t.module ??= await i(), t.module), t;
+}
+function ln() {
+  return !!window.navigation;
+}
+function cn() {
+  return !!globalThis.URLPattern;
+}
+async function hn() {
+  const { URLPattern: i } = await import("urlpattern-polyfill");
+  globalThis.URLPattern = i;
+}
+async function un() {
+  const { applyPolyfill: i } = await import("@virtualstate/navigation");
+  i({
+    history: !0,
+    interceptEvents: !0,
+    patch: !0,
+    persist: !0,
+    persistState: !0
+  });
+}
+async function Fe(i) {
+  const t = [];
+  for (const e of i)
+    t.push(await e);
+  return t;
+}
+function Ke(i) {
+  return i.replace(/-([a-z])/g, (t) => t[1].toUpperCase());
+}
+function dn(i, t) {
+  return ie(i, t);
+}
+function Be(i, t) {
+  const e = { ...i };
+  for (const n of t)
+    delete e[n];
+  return e;
+}
+function qe(i) {
+  return Object.create(
+    EventTarget.prototype,
+    {
+      id: {
+        value: i.id,
+        enumerable: !0,
+        writable: !1,
+        configurable: !1
+      },
+      key: {
+        value: i.key,
+        enumerable: !0,
+        writable: !1,
+        configurable: !1
+      },
+      url: {
+        value: i.url,
+        enumerable: !0,
+        writable: !1,
+        configurable: !1
+      },
+      index: {
+        value: i.index,
+        enumerable: !0,
+        writable: !1,
+        configurable: !1
+      },
+      sameDocument: {
+        value: i.sameDocument,
+        enumerable: !0,
+        writable: !1,
+        configurable: !1
+      },
+      getState: {
+        value: () => i.getState(),
+        enumerable: !1,
+        writable: !1,
+        configurable: !1
+      },
+      ondispose: {
+        value: null,
+        enumerable: !0,
+        writable: !0,
+        configurable: !1
+      }
+    }
+  );
+}
+class ze extends at {
+  ref = z();
   #t = null;
   #e = null;
   state = {
@@ -1270,12 +1273,12 @@ class Oe extends it {
     const n = {}, r = window.getComputedStyle(t);
     for (const a of e) {
       let o;
-      a === "offset" ? o = "cssOffset" : a === "float" ? o = "cssFloat" : o = me(a), n[o] = r.getPropertyValue(a);
+      a === "offset" ? o = "cssOffset" : a === "float" ? o = "cssFloat" : o = Ke(a), n[o] = r.getPropertyValue(a);
     }
     return n;
   }
   copyStyles(t, e, n) {
-    if (!Re(t))
+    if (!xe(t))
       return;
     const r = window.getComputedStyle(t);
     for (const a of n) {
@@ -1356,7 +1359,7 @@ class Oe extends it {
         );
         break;
       case "morph": {
-        const m = Array.from(/* @__PURE__ */ new Set([...t.instance.styles, ...e.instance.styles]));
+        const f = Array.from(/* @__PURE__ */ new Set([...t.instance.styles, ...e.instance.styles]));
         n.push(
           new KeyframeEffect(
             e.clone,
@@ -1369,7 +1372,7 @@ class Oe extends it {
               },
               {
                 ...Object.fromEntries((e.instance.ref.current?.firstElementChild).attributeStyleMap),
-                ...this.getKeyframeProperties(e.instance.ref.current?.firstElementChild, m),
+                ...this.getKeyframeProperties(e.instance.ref.current?.firstElementChild, f),
                 transform: l,
                 width: `${e.rect.width}px`,
                 height: `${e.rect.height}px`
@@ -1381,7 +1384,7 @@ class Oe extends it {
         break;
       }
     }
-    return new At(n);
+    return new Ot(n);
   }
   get animationEffect() {
     const t = this.outgoingScreen?.current?.sharedElementScene, e = this.incomingScreen?.current?.sharedElementScene;
@@ -1393,23 +1396,23 @@ class Oe extends it {
       const o = a.getBoundingClientRect(), l = t.nodes.get(r);
       if (!l?.canTransition || !a.canTransition)
         continue;
-      const m = l.getBoundingClientRect(), p = a.clone(), w = l.clone();
-      if (!w || !p)
+      const f = l.getBoundingClientRect(), d = a.clone(), m = l.clone();
+      if (!m || !d)
         continue;
-      const R = Array.from(/* @__PURE__ */ new Set([...l.styles, ...a.styles]));
-      a.transitionType !== "morph" ? (w.id = `${r}-start`, w.style.position = "absolute", w.style.gridArea = "1 / 1", w.style.margin = "0", this.copyStyles(l.ref.current?.firstElementChild, w, R), this.copyStyles(a.ref.current?.firstElementChild, p, R), w.style.width = `${m.width}px`, w.style.height = `${m.height}px`, p.style.width = `${o.width}px`, p.style.height = `${o.height}px`, this.ref.current?.prepend(w)) : (this.copyStyles(l.ref.current?.firstElementChild, p, R), p.style.width = `${m.width}px`, p.style.height = `${m.height}px`), p.id = `${r}${a.transitionType === "morph" ? "" : "-end"}`, p.style.position = "absolute", p.style.gridArea = "1 / 1", p.style.margin = "0", this.ref.current?.prepend(p), l.hide(), a.hide();
-      const T = async () => {
-        this.props.direction === "forwards" ? a.unhide() : l.unhide(), p.remove(), w.remove();
+      const S = Array.from(/* @__PURE__ */ new Set([...l.styles, ...a.styles]));
+      a.transitionType !== "morph" ? (m.id = `${r}-start`, m.style.position = "absolute", m.style.gridArea = "1 / 1", m.style.margin = "0", this.copyStyles(l.ref.current?.firstElementChild, m, S), this.copyStyles(a.ref.current?.firstElementChild, d, S), m.style.width = `${f.width}px`, m.style.height = `${f.height}px`, d.style.width = `${o.width}px`, d.style.height = `${o.height}px`, this.ref.current?.prepend(m)) : (this.copyStyles(l.ref.current?.firstElementChild, d, S), d.style.width = `${f.width}px`, d.style.height = `${f.height}px`), d.id = `${r}${a.transitionType === "morph" ? "" : "-end"}`, d.style.position = "absolute", d.style.gridArea = "1 / 1", d.style.margin = "0", this.ref.current?.prepend(d), l.hide(), a.hide();
+      const E = async () => {
+        this.props.direction === "forwards" ? a.unhide() : l.unhide(), d.remove(), m.remove();
       };
-      this.props.navigation.addEventListener("transition-end", T, { once: !0 }), this.props.navigation.addEventListener("transition-cancel", T, { once: !0 }), n.push(this.getAnimationEffect(
-        { instance: l, clone: w, rect: m },
-        { instance: a, clone: p, rect: o }
+      this.props.navigation.addEventListener("routertransitionend", E, { once: !0 }), this.props.navigation.addEventListener("routertransitioncancel", E, { once: !0 }), n.push(this.getAnimationEffect(
+        { instance: l, clone: m, rect: f },
+        { instance: a, clone: d, rect: o }
       ));
     }
-    return new At(n);
+    return new Ot(n);
   }
   render() {
-    return /* @__PURE__ */ b("dialog", { className: "shared-element-layer", ref: this.ref, style: {
+    return /* @__PURE__ */ T("dialog", { className: "shared-element-layer", ref: this.ref, style: {
       maxWidth: "unset",
       maxHeight: "unset",
       width: "100vw",
@@ -1419,28 +1422,30 @@ class Oe extends it {
       border: "none",
       backgroundColor: "transparent",
       isolation: "isolate"
-    }, children: /* @__PURE__ */ b("style", { children: `
-                    .shared-element-layer::backdrop {display: none}
-                    .shared-element-layer[open] {display:grid}
-                ` }) });
+    }, children: /* @__PURE__ */ T("style", { children: `
+            .shared-element-layer::backdrop {display: none}
+            .shared-element-layer[open] {display:grid}
+          ` }) });
   }
 }
-class Ve extends it {
-  sharedElementTransitionLayer = K();
-  animation = new $e();
+class He extends at {
+  sharedElementTransitionLayer = z();
+  animation = new Ve();
   #t = "normal";
   #e = [];
   state = {
     gestureNavigating: !1
   };
   onTransitionCancel() {
-    this.props.navigation.dispatchEvent(new ye());
+    this.props.navigation.dispatchEvent(
+      new TransitionEvent("routertransitioncancel")
+    );
   }
   onTransitionStart() {
-    this.props.navigation.dispatchEvent(new ge());
+    this.props.navigation.dispatchEvent(new TransitionEvent("routertransitionstart"));
   }
   onTransitionEnd() {
-    this.props.navigation.dispatchEvent(new ve());
+    this.props.navigation.dispatchEvent(new TransitionEvent("routertransitionend"));
   }
   get screens() {
     return this.#e;
@@ -1458,7 +1463,7 @@ class Ve extends it {
     return this.props.hasUAVisualTransition;
   }
   transition() {
-    const t = new At(
+    const t = new Ot(
       this.screens.map((r) => r.current?.transitionProvider?.current?.animationEffect ?? null).filter((r) => r !== null)
     ), e = this.sharedElementTransitionLayer.current?.animationEffect, n = t.getComputedTiming().duration;
     return e && (e.updateTiming({
@@ -1471,16 +1476,16 @@ class Ve extends it {
     }), this.animation;
   }
   render() {
-    return /* @__PURE__ */ Ht(Wt.Provider, { value: this, children: [
-      /* @__PURE__ */ b(
-        Oe,
+    return /* @__PURE__ */ ee(Kt.Provider, { value: this, children: [
+      /* @__PURE__ */ T(
+        ze,
         {
           ref: this.sharedElementTransitionLayer,
           navigation: this.props.navigation,
           direction: this.animation.playbackRate > 0 ? "forwards" : "backwards"
         }
       ),
-      /* @__PURE__ */ b(
+      /* @__PURE__ */ T(
         "div",
         {
           className: this.props.id,
@@ -1497,41 +1502,170 @@ class Ve extends it {
     ] });
   }
 }
-class Nt extends it {
-  ref = K();
-  screenTransitionLayer = K();
+class Ge {
+  promise;
+  state;
+  #t;
+  #e;
+  constructor() {
+    this.state = "pending", this.#t = this.#e = null, this.promise = new Promise((t, e) => {
+      this.#t = t, this.#e = e;
+    });
+  }
+  resolve(t) {
+    this.state = "resolved", this.#t?.(t);
+  }
+  reject(t) {
+    this.state = "rejected", this.promise.catch(() => {
+    }), this.#e?.(t);
+  }
+}
+class ge extends Event {
+  #t;
+  #e = !1;
+  #r = !0;
+  #n = !1;
+  #d = null;
+  #f = null;
+  #l;
+  #s;
+  #c = new AbortController();
+  #h = !1;
+  #i = [];
+  #a = null;
+  #u = new Ge();
+  hasUAVisualTransition = !1;
+  constructor(t, e) {
+    super("navigate", { cancelable: !1, bubbles: !1, composed: !1 }), this.#t = t;
+    const {
+      destination: n = window.navigation.currentEntry
+    } = e ?? {};
+    if (!n)
+      throw new Error("Destination is null");
+    this.#l = {
+      getState() {
+        return n.getState();
+      },
+      url: n.url ?? new URL(window.location.href).href,
+      key: n.key,
+      index: n.index,
+      id: n.id,
+      sameDocument: !0
+    }, this.#s = this.#c.signal, window.navigation.addEventListener(
+      "navigate",
+      this.#o,
+      { signal: this.#s }
+    );
+  }
+  #o = (t) => {
+    t !== this ? this.#c.abort() : this.#i.length || window.navigation.removeEventListener("navigate", this.#o);
+  };
+  intercept(t) {
+    if (this.#h)
+      throw new DOMException("Failed to execute 'intercept' on 'NavigateEvent': intercept() may only be called while the navigate event is being dispatched.");
+    const e = t?.handler?.();
+    e && this.#i.push(e), this.#i.length === J && Fe(this.#i).then(() => {
+      this.#h = !0, window.removeEventListener("navigate", this.#o), this.#u.resolve();
+    });
+  }
+  scroll() {
+    throw new Error("Method not implemented.");
+  }
+  get transition() {
+    return this.#a || (this.#a = {
+      finished: this.#u.promise,
+      from: window.navigation.currentEntry,
+      navigationType: this.#t
+    }), this.#a;
+  }
+  get navigationType() {
+    return this.#t;
+  }
+  get userInitiated() {
+    return this.#e;
+  }
+  get canIntercept() {
+    return this.#r;
+  }
+  get hashChange() {
+    return this.#n;
+  }
+  get formData() {
+    return this.#d;
+  }
+  get downloadRequest() {
+    return this.#f;
+  }
+  get destination() {
+    return this.#l;
+  }
+  get signal() {
+    return this.#s;
+  }
+}
+class Rt extends at {
+  ref = z();
+  screenTransitionLayer = z();
   parent = null;
   #t = null;
   loadDispatched = !1;
   hasUAVisualTransition = !1;
   parentScreen = null;
   static rootRouterRef = null;
-  static contextType = Jt;
+  static contextType = le;
   constructor(t, e) {
-    super(t), this.parentScreen = e?.parentScreen ?? null, this.parent = e?.parentRouter ?? null, this.parent && (this.parent.child = this), this.isRoot && (Nt.rootRouterRef = new WeakRef(this));
+    super(t), this.parentScreen = e?.parentScreen ?? null, this.parent = e?.parentRouter ?? null;
+  }
+  static get events() {
+    return Object.getOwnPropertyNames(this.prototype).filter((t) => /^on/.test(t)).map((t) => t.replace("on", ""));
   }
   componentDidMount() {
-    this.isRoot && window.navigation.addEventListener("navigate", this.handleNavigationDispatch), this.loadDispatched || (window.navigation.dispatchEvent(new we()), this.loadDispatched = !0);
+    if (this.parent)
+      this.parent.child = this;
+    else {
+      const t = Rt.rootRouterRef?.deref();
+      if (this !== t && t?.mounted)
+        throw new Error("It looks like you have two navigators at the same level. Try simplifying your navigation structure by using a nested router instead.");
+      Rt.rootRouterRef = new WeakRef(this), window.navigation.addEventListener(
+        "navigate",
+        this
+      );
+    }
+    this.#e(), this.loadDispatched || (window.navigation.dispatchEvent(new ge("load")), this.loadDispatched = !0);
   }
   componentWillUnmount() {
-    this.isRoot && window.navigation.removeEventListener("navigate", this.handleNavigationDispatch);
+    this.#r(), this.isRoot && window.navigation.removeEventListener(
+      "navigate",
+      this
+    );
   }
-  handleNavigationDispatch = (t) => {
-    const n = [...this.#e()].findLast((r) => r.canIntercept(t));
+  onnavigate(t) {
+    const n = [...this.#n()].findLast(
+      (r) => r.canIntercept(t)
+    );
     n && (n.intercept(t), this.hasUAVisualTransition = t.hasUAVisualTransition);
-  };
-  *#e() {
-    let t = this;
-    for (; t; )
-      yield t, t = t.child;
+  }
+  #e() {
+    this.constructor.events.forEach((e) => {
+      this.ref.current?.addEventListener(e, this);
+    });
+  }
+  #r() {
+    this.constructor.events.forEach((e) => {
+      this.ref.current?.removeEventListener(e, this);
+    });
+  }
+  *#n(t = Rt.rootRouterRef?.deref() ?? null) {
+    let e = t;
+    for (; e; )
+      yield e, e = e.child;
   }
   getRouterById(t, e) {
-    const n = e ?? Nt.rootRouterRef?.deref();
-    return n.id === t ? n ?? null : n?.child ? this.getRouterById(t, n.child) : null;
+    return [...this.#n(e)].find((r) => r.id === t) ?? null;
   }
   dispatchEvent(t) {
     const e = this.ref.current ?? void 0;
-    return pe(t, e);
+    return je(t, e);
   }
   addEventListener(t, e, n) {
     const r = this.ref.current;
@@ -1541,11 +1675,15 @@ class Nt extends it {
   removeEventListener(t, e, n) {
     return this.ref.current?.removeEventListener(t, e, n);
   }
+  handleEvent(t) {
+    const e = `on${t.type}`;
+    this[e]?.(t);
+  }
   screenChildFromPathname(t) {
-    for (const e of Bt.toArray(this.props.children)) {
-      if (!Se(e))
+    for (const e of Xt.toArray(this.props.children)) {
+      if (!ke(e))
         continue;
-      const n = _t(
+      const n = te(
         e.props.path,
         t,
         this.baseURLPattern.pathname,
@@ -1564,6 +1702,9 @@ class Nt extends it {
     return B(t.props.component) && n.push(t.props.component.load()), B(e?.header?.component) && n.push(e?.header?.component.load()), B(e?.footer?.component) && n.push(e?.footer?.component.load()), Promise.all(n).then(() => {
     });
   }
+  includesRoute(t, e = window.location.origin) {
+    return this.pathPatterns.some(({ pattern: n, caseSensitive: r }) => te(n, t, e, r));
+  }
   get id() {
     if (this.props.id)
       return this.props.id;
@@ -1574,14 +1715,20 @@ class Nt extends it {
     return !this.parent;
   }
   get baseURL() {
-    const t = this.isRoot ? window.location.pathname : this.parentScreen?.resolvedPathname, e = this.baseURLPattern.pathname;
-    return bt(e, t);
+    const t = this.isRoot ? window.location.pathname : this.parentScreen.resolvedPathname, e = this.baseURLPattern.pathname;
+    return Vt(e, t);
   }
   get baseURLPattern() {
     let t = window.location.origin + "/", e = this.props.config?.basePath;
     if (e || (this.isRoot ? e = "/" : e = "."), this.parent && this.parentScreen) {
-      const { resolvedPathname: n = window.location.pathname, path: r } = this.parentScreen, a = this.parent.baseURL?.href, o = new URLPattern({ baseURL: a, pathname: r });
-      t = bt(
+      const {
+        resolvedPathname: n = window.location.pathname,
+        path: r
+      } = this.parentScreen, a = this.parent.baseURL?.href, o = new URLPattern({
+        baseURL: a,
+        pathname: r
+      });
+      t = Vt(
         o.pathname,
         n
       ).href;
@@ -1589,7 +1736,10 @@ class Nt extends it {
     return new URLPattern({ baseURL: t, pathname: e });
   }
   get pathPatterns() {
-    return Bt.map(this.props.children, (t) => ({ pattern: t.props.path, caseSensitive: !!t.props.caseSensitive }));
+    return Xt.map(this.props.children, (t) => ({
+      pattern: t.props.path,
+      caseSensitive: !!t.props.caseSensitive
+    }));
   }
   get mounted() {
     return !!this.ref.current;
@@ -1599,21 +1749,21 @@ class Nt extends it {
   }
   set child(t) {
     const e = this.#t?.deref();
-    if (e && t?.id !== e.id && t?.parentScreen?.id === e.parentScreen?.id && e.mounted)
+    if (e && t !== e && t?.parentScreen?.id === e.parentScreen?.id && e.mounted)
       throw new Error("It looks like you have two navigators at the same level. Try simplifying your navigation structure by using a nested router instead.");
     t ? this.#t = new WeakRef(t) : this.#t = null;
   }
   render() {
     if (this.navigation)
-      return /* @__PURE__ */ b(
+      return /* @__PURE__ */ T(
         "div",
         {
           id: this.id,
           className: "react-motion-router",
           style: { width: "100%", height: "100%" },
           ref: this.ref,
-          children: /* @__PURE__ */ b(pt.Provider, { value: this, children: /* @__PURE__ */ b(
-            Ve,
+          children: /* @__PURE__ */ T(vt.Provider, { value: this, children: /* @__PURE__ */ T(
+            He,
             {
               id: `${this.id}-transition-layer`,
               ref: this.screenTransitionLayer,
@@ -1626,11 +1776,13 @@ class Nt extends it {
       );
   }
 }
-class je {
+class Xe {
   #t = /* @__PURE__ */ new Map();
   mutationObserver;
   constructor() {
-    this.mutationObserver = new MutationObserver(this.observeMutations.bind(this));
+    this.mutationObserver = new MutationObserver(
+      this.observeMutations.bind(this)
+    );
     const { head: t } = document;
     this.mutationObserver.observe(t, {
       childList: !0
@@ -1638,25 +1790,29 @@ class je {
       this.mutationObserver.observe(e, {
         attributes: !0
       });
-    }), Array.from(t.querySelectorAll("meta")).forEach(this.metaDataFromNode.bind(this));
+    }), Array.from(
+      t.querySelectorAll("meta")
+    ).forEach(
+      this.metaDataFromNode.bind(this)
+    );
   }
   get(t) {
-    const e = this.getMetaKey(t), n = this.#t.get(e);
+    const e = this.formatMetaKey(t), n = this.#t.get(e);
     if (!n)
       return;
     let r;
     return n.includes(",") && n.includes("=") ? r = n.split(/,\s*/).map((a) => a.split("=")) : r = n, r;
   }
   set(t, e) {
-    const n = this.getMetaKey(t), r = this.getMetaContent(e);
-    this.#t.set(n, r), this.updateMetaElement(n, r);
+    const n = this.formatMetaKey(t), r = this.formatMetaContent(e);
+    this.#t.set(n, r), typeof t == "string" && (t = ["name", t]), this.updateMetaElement(t, r);
   }
   has(t) {
-    const e = this.getMetaKey(t);
+    const e = this.formatMetaKey(t);
     return this.#t.has(e);
   }
   delete(t) {
-    const e = this.getMetaKey(t);
+    const e = this.formatMetaKey(t);
     this.#t.delete(e), document.head.querySelector(`meta[${e}]`)?.remove();
   }
   clear() {
@@ -1681,7 +1837,10 @@ class je {
         return;
       e.removedNodes.forEach((n) => {
         if (n.nodeName === "META") {
-          const [r] = Array.from(n.attributes).filter((l) => l.nodeName !== "content"), o = [r.nodeName, r.value].join("=");
+          const r = Array.from(n.attributes).find((l) => l.nodeName !== "content");
+          if (!r || !r.value)
+            return;
+          const a = [r.nodeName, r.value], o = this.formatMetaKey(a);
           this.#t.has(o) && this.#t.delete(o);
         }
       }), e.addedNodes.forEach((n) => {
@@ -1690,141 +1849,421 @@ class je {
     }
   }
   metaDataFromNode(t) {
-    const [e] = Array.from(t.attributes).filter((o) => o.nodeName !== "content"), [n] = Array.from(t.attributes).filter((o) => o.nodeName === "content"), a = [e.nodeName, e.value].join("=");
+    const e = Array.from(t.attributes).find((o) => o.nodeName !== "content"), n = Array.from(t.attributes).find((o) => o.nodeName === "content");
+    if (!e || !e.value)
+      return;
+    const r = [e.nodeName, e.value], a = this.formatMetaKey(r);
     this.#t.set(a, n?.value);
   }
-  getMetaKey(t) {
+  formatMetaKey(t) {
     let e;
-    return typeof t == "string" ? e = `name=${t}` : e = t.join("="), e;
+    if (typeof t == "string")
+      e = `name="${t}"`;
+    else {
+      const [n, r] = t;
+      e = `${n}="${r}"`;
+    }
+    return e;
   }
-  getMetaContent(t) {
+  formatMetaContent(t) {
     if (!t)
       return;
     let e;
     return typeof t == "string" ? e = t : e = t.map((n) => n.join("=")).join(", "), e;
   }
   updateMetaElement(t, e) {
-    const n = document.querySelector(`meta[${t}]`) || document.createElement("meta"), r = t.split("=");
-    n.setAttribute(...r), e ? n.setAttribute("content", e) : n.removeAttribute("content"), n.parentElement || document.head.appendChild(n);
+    const n = document.querySelector(`meta[${this.formatMetaKey(t)}]`) || document.createElement("meta"), [r, a] = t;
+    n.setAttribute(r, a), e ? n.setAttribute("content", e) : n.removeAttribute("content"), n.parentElement || document.head.appendChild(n);
   }
 }
-class Ut {
+class jt {
   static rootNavigatorRef = null;
-  metaData = new je();
-  constructor() {
-    const t = Ut.rootNavigatorRef?.deref();
-    (!t || !t.isInDocument) && (Ut.rootNavigatorRef = new WeakRef(this));
-  }
-  addEventListener(t, e, n) {
-    return this.router.addEventListener(t, e, n);
-  }
-  removeEventListener(t, e, n) {
-    return this.router.removeEventListener(t, e, n);
-  }
-  dispatchEvent(t) {
-    return this.router.dispatchEvent?.(t);
-  }
-  get parent() {
-    return this.router.parent?.navigation ?? null;
-  }
-  get routerId() {
-    return this.router.id;
-  }
-  get baseURL() {
-    return this.router.baseURL;
-  }
-  get baseURLPattern() {
-    return this.router.baseURLPattern;
+  metaData = new Xe();
+  addEventListener;
+  removeEventListener;
+  dispatchEvent;
+  parent;
+  routerId;
+  baseURL;
+  baseURLPattern;
+  getNavigatorById;
+  constructor(t) {
+    const e = jt.rootNavigatorRef?.deref();
+    (!e || !e.isInDocument) && (jt.rootNavigatorRef = new WeakRef(this)), this.addEventListener = t.addEventListener, this.removeEventListener = t.removeEventListener, this.dispatchEvent = t.dispatchEvent, this.parent = t.parent, this.routerId = t.routerId, this.baseURL = t.baseURL, this.baseURLPattern = t.baseURLPattern, this.getNavigatorById = t.getNavigatorById;
   }
-  getNavigatorById(t) {
-    return this.router.getRouterById(t)?.navigation ?? null;
+  preload(t, e) {
+    const n = new URL(t, this.baseURL).href, r = {
+      getState() {
+        return e;
+      },
+      index: oe,
+      sameDocument: !0,
+      url: n,
+      id: null,
+      key: null
+    }, a = new ge("preload", { destination: r });
+    window.navigation.dispatchEvent(a);
+    const o = qe(r);
+    return {
+      finished: a.transition.finished.then(() => o),
+      committed: Promise.resolve(o)
+    };
   }
   get isInDocument() {
     return !!document.getElementById(`${this.routerId}`);
   }
 }
-function en() {
-  const s = ht(pt);
-  if (s)
-    return s.navigation;
+function fn() {
+  const i = ft(vt);
+  if (i)
+    return i.navigation;
   throw new Error("Router is null. You may be trying to call useNavigation outside a Router.");
 }
-function nn() {
-  return ht(pt);
-}
-function sn() {
-  le("Motion");
-  const s = ht(pt), e = ht(Wt).animation, n = 1;
-  return ce(
-    (r) => s.addEventListener("transition-start", async () => {
-      do
-        await new Promise((a) => {
-          requestAnimationFrame(a);
-        }), r();
-      while (e.playState === "running");
-    }),
+function pn() {
+  return ft(vt);
+}
+function mn() {
+  Ee("Motion");
+  const i = ft(vt), e = ft(Kt).animation, n = 1;
+  return re(
+    (r) => {
+      const a = async () => {
+        do
+          await new Promise((o) => {
+            requestAnimationFrame(o);
+          }), r();
+        while (e.playState === "running");
+      };
+      return i.addEventListener("routertransitionstart", a), () => {
+        i.removeEventListener("routertransitionstart", a);
+      };
+    },
     () => {
       const { progress: r } = e?.effect?.getComputedTiming() ?? {};
       return r ?? n;
     }
   );
 }
-function Be() {
-  const s = ht(Qt);
-  if (s)
-    return s;
+function Ye() {
+  const i = ft(ce);
+  if (i)
+    return i;
   throw new Error("Router is null. You may be trying to call useRoute outside a Router.");
 }
-function rn(s, t) {
-  const e = Be(), n = t instanceof Function ? t() : t, r = he(e);
-  ue(() => {
+function gn(i, t) {
+  const e = Ye(), n = t instanceof Function ? t() : t, r = Ft(e);
+  se(() => {
     r.current = e;
   }, [e]);
-  const a = de((l) => {
-    const { params: m, setParams: p } = r.current;
-    l instanceof Function && (l = l(m[s] ?? n)), p({ [s]: l });
-  }, [n, s]);
-  return [e.params[s] ?? n, a];
+  const a = be((l) => {
+    const { params: f, setParams: d } = r.current;
+    l instanceof Function && (l = l(f[i] ?? n)), d({ [i]: l });
+  }, [n, i]);
+  return [e.params[i] ?? n, a];
+}
+const mt = "--rerender";
+function vn() {
+  return re(
+    (i) => (globalThis.addEventListener(
+      mt,
+      i,
+      { once: !0 }
+    ), () => {
+      globalThis.removeEventListener(mt, i);
+    }),
+    () => document.timeline.currentTime
+  );
+}
+function yn(i) {
+  const t = Ft(i);
+  t.current = i, se(() => {
+    const e = t.current;
+    return globalThis.addEventListener(mt, e), () => {
+      globalThis.removeEventListener(mt, e);
+    };
+  });
+}
+function wn() {
+  globalThis.dispatchEvent(new Event(mt));
+}
+function En(i, t) {
+  return Object.create(EventTarget.prototype, {
+    id: {
+      value: crypto.randomUUID(),
+      writable: !1,
+      enumerable: !0,
+      configurable: !1
+    },
+    key: {
+      value: crypto.randomUUID(),
+      writable: !1,
+      enumerable: !0,
+      configurable: !1
+    },
+    index: {
+      value: t,
+      writable: !1,
+      enumerable: !0,
+      configurable: !1
+    },
+    url: {
+      value: i,
+      writable: !1,
+      enumerable: !0,
+      configurable: !1
+    },
+    sameDocument: {
+      value: !0,
+      writable: !1,
+      enumerable: !0,
+      configurable: !1
+    },
+    ondispose: {
+      value: null,
+      writable: !0,
+      enumerable: !0,
+      configurable: !0
+    },
+    getState: {
+      value() {
+      },
+      writable: !1,
+      enumerable: !0,
+      configurable: !1
+    }
+  });
+}
+function bn() {
+  if (!window.navigation)
+    throw new Error("window.navigation is not available in this environment");
+}
+async function Tn() {
+  await new Promise((i) => {
+    window.navigation.addEventListener(
+      "navigatesuccess",
+      i,
+      { once: !0 }
+    );
+  });
+}
+async function Ct(i) {
+  await window.navigation.navigate(i).finished;
+}
+async function Sn(i) {
+  await window.navigation.traverseTo(i).finished;
+}
+async function Rn() {
+  const i = window.navigation.entries()[0];
+  await window.navigation.traverseTo(i.key).finished;
+}
+async function kn() {
+  await Ct("/one"), await Ct("/two"), await Ct("/three");
+}
+const ve = (i) => {
+  i.intercept({
+    handler() {
+      return Promise.resolve();
+    }
+  });
+};
+async function xn() {
+  window.navigation.addEventListener("navigate", ve);
+}
+async function Cn() {
+  window.navigation.removeEventListener("navigate", ve);
+}
+class K extends Lt.Component {
+  constructor(t) {
+    super(t), this.state = {
+      href: this.href
+    };
+  }
+  anchorRef = Lt.createRef();
+  static directionFromRel(t) {
+    return t?.split(" ").findLast((e) => e === "next" || e === "prev") ?? "prev";
+  }
+  static findClosestEntryByHref(t, e, n, r) {
+    if (!Array.isArray(n) || r < O || r >= n.length || n.length === J)
+      return;
+    let a = r - J, o = r + J;
+    const l = K.directionFromRel(e);
+    for (l === "next" && (a = O), l === "prev" && (o = n.length); a >= O || o < n.length; ) {
+      if (a >= O && n[a]?.url === t)
+        return n[a];
+      if (o < n.length && n[o]?.url === t)
+        return n[o];
+      a--, o++;
+    }
+  }
+  static findClosestEntry(t, e, n) {
+    switch (K.directionFromRel(t)) {
+      case "prev":
+        return e[n - J];
+      case "next":
+        return e[n + J];
+    }
+  }
+  componentDidMount() {
+    window.navigation?.addEventListener("navigatesuccess", this.onNavigate);
+  }
+  componentWillUnmount() {
+    window.navigation?.removeEventListener("navigatesuccess", this.onNavigate);
+  }
+  onNavigate = () => {
+    const { href: t } = this;
+    this.setState({ href: t });
+  };
+  get href() {
+    const { href: t, traverse: e, reload: n, historyEntryKey: r, rel: a } = this.props;
+    if (t === void 0 && e) {
+      let o;
+      return r ? o = window.navigation?.entries().find((l) => l.key === r) : a && (t ? o = K.findClosestEntryByHref(
+        t,
+        a,
+        window.navigation.entries(),
+        window.navigation.currentEntry?.index ?? O
+      ) : o = K.findClosestEntry(
+        a,
+        window.navigation.entries(),
+        window.navigation.currentEntry?.index ?? O
+      )), o?.url;
+    } else if (n)
+      return ".";
+    return t;
+  }
+  get search() {
+    return this.props.search ? this.props.search.startsWith("?") ? this.props.search : `?${this.props.search}` : "";
+  }
+  handleClick = (t) => {
+    if (this.props.onClick?.(t), t.defaultPrevented)
+      return;
+    t.preventDefault();
+    const e = window.navigation, {
+      rel: n,
+      historyEntryKey: r,
+      reload: a,
+      replace: o,
+      traverse: l,
+      navigateInfo: f,
+      navigateState: d
+    } = this.props, m = this.anchorRef.current?.href;
+    if (r) {
+      e.traverseTo(r, { info: f });
+      return;
+    }
+    if (l) {
+      const S = e.entries();
+      let E;
+      if (m ? E = K.findClosestEntryByHref(
+        m,
+        n,
+        S,
+        e.currentEntry?.index ?? O
+      ) : E = K.findClosestEntry(
+        n,
+        S,
+        e.currentEntry?.index ?? O
+      ), E) {
+        e.traverseTo(E.key, { info: f });
+        return;
+      }
+    }
+    if (o && m) {
+      e.navigate(m, { info: f, state: d, history: "replace" });
+      return;
+    }
+    if (a) {
+      e.reload({ info: f, state: d });
+      return;
+    }
+    m && e.navigate(m, { info: f, state: d });
+  };
+  render() {
+    const {
+      rel: t,
+      children: e
+    } = this.props, { href: n } = this.state, { search: r } = this, a = Be(this.props, [
+      "historyEntryKey",
+      "navigateInfo",
+      "navigateState",
+      "reload",
+      "replace",
+      "traverse"
+    ]);
+    return /* @__PURE__ */ T(
+      "a",
+      {
+        ...a,
+        ref: this.anchorRef,
+        href: n ? `${n}${r}` : void 0,
+        rel: t,
+        onClick: this.handleClick,
+        children: e
+      }
+    );
+  }
+}
+function Ln({ ref: i, ...t }) {
+  const e = Ft(null);
+  return Lt.useImperativeHandle(
+    i,
+    () => e.current?.anchorRef.current ?? null
+  ), /* @__PURE__ */ T(K, { ref: e, ...t });
 }
-const an = 2147483647, on = 100, ln = 0, cn = 0, hn = 1;
 export {
-  we as LoadEvent,
-  hn as MAX_NORM_PROGRESS,
-  on as MAX_PROGRESS,
-  an as MAX_Z_INDEX,
-  cn as MIN_NORM_PROGRESS,
-  ln as MIN_PROGRESS,
-  Qe as MotionProgressEndEvent,
-  Je as MotionProgressStartEvent,
-  Ut as NavigationBase,
-  Jt as NestedRouterContext,
-  fe as PromiseAllDynamic,
-  Nt as RouterBase,
-  pt as RouterContext,
-  be as ScreenBase,
-  qe as SharedElement,
-  ye as TransitionCancelEvent,
-  ve as TransitionEndEvent,
-  ge as TransitionStartEvent,
-  _e as cloneAndInject,
-  pe as dispatchEvent,
-  ze as includesRoute,
+  Ln as Anchor,
+  K as AnchorBase,
+  sn as EMPTY_COLLECTION_LENGTH,
+  O as FIRST_INDEX,
+  oe as LAST_INDEX,
+  ge as LoadEvent,
+  rn as MAX_NORM_PROGRESS,
+  tn as MAX_PROGRESS,
+  Qe as MAX_Z_INDEX,
+  nn as MIN_NORM_PROGRESS,
+  en as MIN_PROGRESS,
+  jt as NavigationBase,
+  le as NestedRouterContext,
+  Fe as PromiseAllSequential,
+  Ge as PromiseWrapper,
+  ce as RoutePropContext,
+  Rt as RouterBase,
+  vt as RouterContext,
+  J as SINGLE_ELEMENT_LENGTH,
+  Re as ScreenBase,
+  Je as SharedElement,
+  bn as assertNavigationAvailable,
+  dn as cloneAndInject,
+  En as createHistoryEntry,
+  je as dispatchEvent,
+  qe as historyEntryFromDestination,
+  xn as installInterceptor,
   B as isLazyExoticComponent,
-  te as isNativeLazyExoticComponent,
-  He as isNavigationSupported,
-  Re as isStylableElement,
-  Xe as isURLPatternSupported,
-  Se as isValidScreenChild,
-  Ge as lazy,
-  _t as matchRoute,
-  Ye as polyfillNavigation,
-  Ze as polyfillURLPattern,
-  bt as resolveBaseURLFromPattern,
-  me as toCamelCase,
-  sn as useMotion,
-  en as useNavigationBase,
-  rn as useParamsBase,
-  Be as useRouteBase,
-  nn as useRouterBase
+  he as isNativeLazyExoticComponent,
+  ln as isNavigationSupported,
+  xe as isStylableElement,
+  cn as isURLPatternSupported,
+  ke as isValidScreenChild,
+  on as lazy,
+  te as matchRoute,
+  Ct as navTo,
+  Be as omit,
+  un as polyfillNavigation,
+  hn as polyfillURLPattern,
+  Vt as resolveBaseURLFromPattern,
+  kn as seedHistory,
+  Ke as toCamelCase,
+  Sn as traverseTo,
+  Rn as traverseToStart,
+  wn as triggerRerender,
+  Cn as uninstallInterceptor,
+  mn as useMotion,
+  fn as useNavigationBase,
+  gn as useParamsBase,
+  vn as useRerender,
+  yn as useRerenderCallback,
+  Ye as useRouteBase,
+  pn as useRouterBase,
+  Tn as waitForNavigateSuccess
 };
 //# sourceMappingURL=index.js.map