@react-motion-router/core 2.0.0-beta.sha-01914d6 → 2.0.0-beta.sha-20ff5ff

package/build/index.js

@@ -1,9 +1,9 @@
-import { jsx as b, jsxs as Gt, Fragment as oe } from "react/jsx-runtime";
-import { createContext as it, Component as st, createRef as K, lazy as le, cloneElement as Ht, Suspense as bt, isValidElement as Xt, Children as jt, useContext as vt, useDebugValue as ce, useRef as he, useEffect as ue, useCallback as de } from "react";
-const Zt = it(null);
-class ze extends st {
+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 = Zt;
+  static contextType = Yt;
   componentDidMount() {
     this.scene.addNode(this);
   }
@@ -55,7 +55,7 @@ class ze extends st {
     );
   }
 }
-function Tt(s, t) {
+function bt(s, t) {
   s.endsWith("*") || (s += "**");
   const e = window.location.origin, n = new URLPattern(s, e).exec(t, e);
   if (!n)
@@ -63,9 +63,9 @@ function Tt(s, t) {
   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 Yt(s, t, e = `${window.location.origin}/`, n = !0) {
+function _t(s, t, e = `${window.location.origin}/`, n = !0) {
   n || (s = s.toLowerCase(), t = t.toLowerCase());
-  const r = Tt(e, t)?.href;
+  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 ?? {};
@@ -74,8 +74,8 @@ function Yt(s, t, e = `${window.location.origin}/`, n = !0) {
     caseSensitive: n
   } : null;
 }
-function Ge(s, t, e = window.location.origin) {
-  return s.some(({ pattern: n, caseSensitive: r }) => Yt(n, t, e, r));
+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) => {
@@ -84,24 +84,24 @@ function pe(s, t = window) {
     ));
   });
 }
-function He(s) {
-  const t = le(s);
+function Ge(s) {
+  const t = oe(s);
   return t.load = async () => (t.module ??= await s(), t.module), t;
 }
-function Xe() {
+function He() {
   return !!window.navigation;
 }
-function Ze() {
+function Xe() {
   return !!globalThis.URLPattern;
 }
-async function Ye() {
+async function Ze() {
   const { URLPattern: s } = await import(
     /*webpackIgnore: true*/
     "urlpattern-polyfill"
   );
   globalThis.URLPattern = s;
 }
-async function _e() {
+async function Ye() {
   const { applyPolyfill: s } = await import(
     /*webpackIgnore: true*/
     "@virtualstate/navigation"
@@ -123,8 +123,8 @@ async function fe(s) {
 function me(s) {
   return s.replace(/-([a-z])/g, (t) => t[1].toUpperCase());
 }
-function Je(s, t) {
-  return Ht(s, t);
+function _e(s, t) {
+  return Xt(s, t);
 }
 class ge extends Event {
   constructor() {
@@ -141,23 +141,17 @@ class ve extends Event {
     super("transition-end");
   }
 }
-class Qe extends Event {
+class Je extends Event {
   constructor() {
     super("motion-progress-start");
   }
 }
-class we extends Event {
-  progress;
-  constructor(t) {
-    super("motion-progress"), this.progress = t;
-  }
-}
-class tn extends Event {
+class Qe extends Event {
   constructor() {
     super("motion-progress-end");
   }
 }
-class Ee extends Event {
+class we extends Event {
   #t = "load";
   #e = !1;
   #c = !0;
@@ -235,10 +229,10 @@ class Ee extends Event {
     return this.#i;
   }
 }
-const _t = it(null);
-class be extends st {
+const Wt = dt(null);
+class Ee extends it {
   ref = K();
-  static contextType = _t;
+  static contextType = Wt;
   index = 0;
   exiting = !1;
   state = {
@@ -293,7 +287,7 @@ class be extends st {
     );
   }
 }
-const Jt = it(null), wt = it(null), Qt = it(null);
+const Jt = dt(null), pt = dt(null), Qt = dt(null);
 class Te {
   id;
   nodes = /* @__PURE__ */ new Map();
@@ -329,12 +323,12 @@ class Te {
     return !this.nodes.size;
   }
 }
-class Se extends st {
+class be extends it {
   sharedElementScene;
   #t = K();
   ref = K();
   nestedRouterData;
-  static contextType = wt;
+  static contextType = pt;
   state = {
     focused: !1,
     config: {},
@@ -354,7 +348,7 @@ class Se extends st {
     return this.state.focused;
   }
   get name() {
-    return this.props.name ? this.props.name.toLowerCase().replace(/[^\w-]/g, "-").replace(/-+/g, "-").replace(/^-|-$/g, "") : F(this.props.component) ? this.props.component.module?.default.name.toLowerCase() : this.props.component.name.toLowerCase();
+    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));
@@ -365,7 +359,7 @@ class Se extends st {
   async load(t) {
     const e = this.props.component, n = this.props.config?.header?.component, r = this.props.config?.footer?.component;
     let a;
-    F(e) ? a = await e.load() : a = { default: e }, F(n) && await n.load(), F(r) && await r.load();
+    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;
   }
@@ -410,7 +404,7 @@ class Se extends st {
   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(
-      be,
+      Ee,
       {
         ref: this.#t,
         renderAs: this.state.elementType,
@@ -431,10 +425,10 @@ class Se extends st {
               flexDirection: "column",
               pointerEvents: "inherit"
             },
-            children: /* @__PURE__ */ b(Zt.Provider, { value: this.sharedElementScene, children: /* @__PURE__ */ b(Qt.Provider, { value: e, children: /* @__PURE__ */ Gt(Jt.Provider, { value: this.nestedRouterData, children: [
-              /* @__PURE__ */ b(bt, { 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(bt, { fallback: /* @__PURE__ */ b(Z, { component: this.props.fallback, route: e, navigation: t }), children: /* @__PURE__ */ b(Z, { component: n, route: e, navigation: t }) }),
-              /* @__PURE__ */ b(bt, { 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__ */ 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 }) })
             ] }) }) })
           }
         )
@@ -443,7 +437,7 @@ class Se extends st {
   }
 }
 function Z({ component: s, route: t, navigation: e }) {
-  F(s) && s.module?.default && (s = s.module.default);
+  B(s) && s.module?.default && (s = s.module.default);
   const n = s ?? null;
   return typeof n == "function" || te(n) ? /* @__PURE__ */ b(
     n,
@@ -451,31 +445,31 @@ function Z({ component: s, route: t, navigation: e }) {
       navigation: e,
       route: t
     }
-  ) : Xt(n) ? Ht(n, {
+  ) : Zt(n) ? Xt(n, {
     navigation: e,
     route: t
-  }) : /* @__PURE__ */ b(oe, { children: n });
+  }) : /* @__PURE__ */ b(ae, { children: n });
 }
-function Re(s) {
-  return Xt(s) ? Object.getPrototypeOf(s.type) === Se : !1;
+function Se(s) {
+  return Zt(s) ? Object.getPrototypeOf(s.type) === be : !1;
 }
 function te(s) {
   return typeof s == "object" && s !== null && s.$$typeof === Symbol.for("react.lazy");
 }
-function F(s) {
+function B(s) {
   return te(s) && "load" in s;
 }
-function ke(s) {
+function Re(s) {
   return "style" in s && s.style instanceof CSSStyleDeclaration;
 }
-var xe = Object.defineProperty, Ce = (s, t, e) => t in s ? xe(s, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : s[t] = e, j = (s, t, e) => (Ce(s, typeof t != "symbol" ? t + "" : t, e), e), Wt = (s, t, e) => {
+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))
     throw TypeError("Cannot " + e);
-}, i = (s, t, e) => (Wt(s, t, "read from private field"), e ? e.call(s) : t.get(s)), g = (s, t, 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))
     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) => (Wt(s, t, "write to private field"), n ? n.call(s, e) : t.set(s, e), e), f = (s, t, e) => (Wt(s, t, "access private method"), 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 = {
   delay: 0,
   direction: "normal",
@@ -485,7 +479,7 @@ const ut = {
   fill: "auto",
   iterationStart: 0,
   iterations: 1
-}, It = 1e3, Me = window.Animation, dt = window.KeyframeEffect;
+}, $t = 1e3, Ce = window.Animation, ft = window.KeyframeEffect;
 function Ft(s) {
   return Array.isArray(s);
 }
@@ -495,7 +489,7 @@ function H(s) {
 function h(s, t) {
   return H(s) || typeof s == "number" ? s : (t || ([t] = Object.keys(s.type())), s.to(t).value);
 }
-function Le(s, t = ut) {
+function Me(s, t = ut) {
   let { duration: e = "auto", iterations: n = 1, playbackRate: r = 1 } = t;
   if (H(s))
     return s;
@@ -505,13 +499,13 @@ function Le(s, t = ut) {
       "NotSupportedError"
     );
   if (e === "auto")
-    e = It;
+    e = $t;
   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 rt(
+  return st(
     s.to("percent").value,
     [0, 100],
     [0, m]
@@ -527,11 +521,11 @@ function Et(s) {
     );
   return s.to("ms").value;
 }
-function Bt(s, t) {
+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;
   return r + o * (a - r);
 }
-function Pe(s, t, e) {
+function Le(s, 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;
@@ -539,26 +533,26 @@ function Pe(s, t, e) {
   }
   return n / r;
 }
-function rt(s, t, e, n = {}) {
+function st(s, t, e, n = {}) {
   let r;
   if (typeof s == "number" && Ft(t)) {
     const o = { x: t[0] }, l = { x: t[1] };
     t = { min: o, max: l }, s = { x: s };
   } else
     throw new TypeError("Input and input range must have the same dimensions.");
-  if (r = Pe(s, t, n), r = De(r, 0, 1), Ft(e))
-    return Bt(r, e);
+  if (r = Le(s, t, n), r = Pe(r, 0, 1), Ft(e))
+    return Kt(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] = Bt(r, p);
+    a[o] = Kt(r, p);
   }
   return a;
 }
-function De(s, t, e) {
+function Pe(s, t, e) {
   return s < t ? t : e && s > e ? e : s;
 }
-function $t(s) {
+function Ot(s) {
   let {
     duration: t = "auto",
     iterations: e = 1,
@@ -570,7 +564,7 @@ function $t(s) {
   } = s;
   const m = new CSSUnitValue(100, "percent");
   if (t === "auto")
-    t = It, r = 0, a = 0;
+    t = $t, r = 0, a = 0;
   else if (t instanceof CSSNumericValue)
     t = t.to("ms").value;
   else if (typeof t == "string")
@@ -596,7 +590,7 @@ function ee(s, t) {
   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 Ae(s, t) {
+function De(s, t) {
   let { localTime: e = null, delay: n = 0, activeDuration: r = 0, fill: a } = s;
   if (r = h(r), e = h(e), e == null || e === void 0)
     return null;
@@ -611,14 +605,14 @@ function Ae(s, t) {
       return null;
   }
 }
-function Ne(s, t, e) {
+function Ae(s, t, e) {
   const { duration: n = 0, iterations: r = 1, iterationStart: a = 0 } = s;
   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;
 }
-function Ue(s, t, e, n) {
+function Ne(s, t, e, n) {
   const { iterations: r = 1, iterationStart: a = 0, activeDuration: o = 0 } = s;
   if (H(e))
     return null;
@@ -626,15 +620,15 @@ function Ue(s, t, e, n) {
   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 = Ae(s, t);
+  const { iterations: e = 1 } = s, n = De(s, t);
   if (H(n))
     return null;
   if (t === "after" && e === 1 / 0)
     return 1 / 0;
-  const r = Ne(s, t, n);
-  return Ue(s, t, r, n) === 1 ? Math.floor(r) - 1 : Math.floor(r);
+  const r = Ae(s, t, n);
+  return Ne(s, t, r, n) === 1 ? Math.floor(r) - 1 : Math.floor(r);
 }
-class We extends Event {
+class Ue extends Event {
   constructor(t) {
     super("update", { bubbles: !1, cancelable: !1, composed: !1 }), j(this, "currentTime"), this.currentTime = t;
   }
@@ -654,7 +648,7 @@ class E extends EventTarget {
     switch (i(this, N).type) {
       case "swipe": {
         const { rangeStart: a, rangeEnd: o } = i(this, N), l = i(this, N).axis;
-        n = rt(
+        n = st(
           r[l],
           [h(a, "px"), h(o, "px")],
           [0, 100]
@@ -663,7 +657,7 @@ class E extends EventTarget {
       }
       case "pan": {
         const { rangeStart: a, rangeEnd: o } = i(this, N), { x: l, y: m } = r;
-        n = rt(
+        n = st(
           { x: l, y: m },
           {
             min: { x: h(a.x, "px"), y: h(a.y, "px") },
@@ -676,7 +670,7 @@ class E extends EventTarget {
       }
       case "pinch": {
         const { rangeStart: a, rangeEnd: o } = i(this, N), { scale: l } = t;
-        n = rt(
+        n = st(
           l,
           [h(a, ""), h(o, "")],
           // figure out which unit
@@ -686,14 +680,14 @@ class E extends EventTarget {
       }
       case "rotate": {
         const { rangeStart: a, rangeEnd: o } = i(this, N), { rotation: l } = t;
-        n = rt(
+        n = st(
           l,
           [h(a, "deg"), h(o, "deg")],
           [0, 100]
         );
       }
     }
-    c(this, Y, CSS.percent(n)), this.dispatchEvent(new We(i(this, Y)));
+    c(this, Y, CSS.percent(n)), this.dispatchEvent(new Ue(i(this, Y)));
   }
   addEventListener(t, e, n) {
     super.addEventListener(t, e, n);
@@ -710,13 +704,13 @@ class E extends EventTarget {
 }
 N = /* @__PURE__ */ new WeakMap(), Y = /* @__PURE__ */ new WeakMap();
 const A = /* @__PURE__ */ new WeakMap();
-var at;
-class pt extends dt {
+var rt;
+class mt extends ft {
   constructor(t, e = null) {
-    super(t), g(this, at, null), c(this, at, e);
+    super(t), g(this, rt, null), c(this, rt, e);
   }
   get parent() {
-    return i(this, at);
+    return i(this, rt);
   }
   getTiming() {
     var t;
@@ -737,7 +731,7 @@ class pt extends dt {
         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 $t(e);
+      return Ot(e);
     }
     return e;
   }
@@ -749,7 +743,7 @@ class pt extends dt {
       duration: n.duration instanceof CSSNumericValue ? n.duration.to("ms").value : n.duration,
       ...t
     };
-    let r = i(this, at);
+    let r = i(this, rt);
     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;
@@ -763,11 +757,11 @@ class pt extends dt {
     return super.updateTiming(t);
   }
 }
-at = /* @__PURE__ */ new WeakMap();
+rt = /* @__PURE__ */ new WeakMap();
 var U, _;
-const Ie = class ft {
+const We = class gt {
   constructor(t) {
-    g(this, U, []), g(this, _, null), c(this, U, t.map((e) => (e instanceof ft ? c(e, _, this) : e instanceof dt && (e = new pt(e, this)), e)));
+    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)));
   }
   get parent() {
     return i(this, _);
@@ -792,17 +786,17 @@ const Ie = class ft {
   }
   append(...t) {
     t.forEach((e) => {
-      i(this, U).includes(e) || (e instanceof ft ? c(e, _, this) : e instanceof dt && (e = new pt(e, this)), i(this, U).push(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));
     });
   }
   prepend(...t) {
     t.forEach((e) => {
-      i(this, U).includes(e) || (e instanceof ft ? c(e, _, this) : e instanceof dt && (e = new pt(e, this)), i(this, U).unshift(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));
     });
   }
 };
 U = /* @__PURE__ */ new WeakMap(), _ = /* @__PURE__ */ new WeakMap();
-let Ot = Ie;
+let Vt = We;
 class nt {
   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) => {
@@ -820,7 +814,7 @@ class nt {
   }
 }
 var J, St, ie;
-class $e extends Ot {
+class Ie extends Vt {
   constructor(t, e = ut) {
     super(t), g(this, St), g(this, J, void 0), c(this, J, {
       ...ut,
@@ -846,15 +840,15 @@ class $e extends Ot {
         continue;
       let {
         duration: L = "auto",
-        activeDuration: Vt = 0
+        activeDuration: jt = 0
       } = M.getComputedTiming();
-      r.activeDuration = r.activeDuration ? h(r.activeDuration, "ms") + h(Vt, "ms") : Vt, 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));
+      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));
     }
     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")
       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 ? $t(r) : (m instanceof DocumentTimeline && (r.progress = w && h(w, R) / h(l, R)), r);
+    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);
   }
   updateTiming(t) {
     c(this, J, {
@@ -871,15 +865,15 @@ J = /* @__PURE__ */ new WeakMap(), St = /* @__PURE__ */ new WeakSet(), ie = func
   const { playbackRate: s = 1 } = A.get(this) ?? {};
   return s < 0 ? "backwards" : "forwards";
 };
-var d, x, ht, v, S, P, u, y, k, z, O, ot, W, mt, Rt, Q, lt, q, tt, kt, Kt, xt, qt, Ct, zt, B, G, ct, gt, Mt, I, V, D, $, yt, Lt, Pt;
+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 {
   constructor(t, e) {
-    super(), g(this, mt), g(this, Q), g(this, q), g(this, kt), g(this, xt), g(this, Ct), g(this, B), g(this, gt), 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, ht, "active"), g(this, v, {
+    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, {
       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, ot, 0), g(this, W, 1), g(this, ct, () => {
-      f(this, B, G).call(this);
-    }), g(this, yt, () => {
+    }), 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, () => {
       var n;
       if (i(this, P).state !== "pending" || this.playState !== "finished")
         return;
@@ -917,7 +911,7 @@ const se = class extends EventTarget {
       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, gt, Mt).call(this), e instanceof E && e.addEventListener("update", i(this, ct));
+    }), 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));
   }
   reverse() {
     var t;
@@ -936,13 +930,13 @@ const se = class extends EventTarget {
   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, B, G).call(this), f(this, Q, lt).call(this), i(this, v).task = "play", f(this, I, V).call(this, !1));
+    (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));
   }
   pause() {
-    this.playState !== "paused" && (this.currentTime === null && c(this, O, !0), i(this, v).task && (i(this, v).task = null), f(this, Q, lt).call(this), i(this, v).task = "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");
   }
   persist() {
-    i(this, k).forEach((t) => t.persist()), c(this, ht, "persisted");
+    i(this, k).forEach((t) => t.persist()), c(this, ct, "persisted");
   }
   finish() {
     var t;
@@ -951,7 +945,7 @@ const se = class extends EventTarget {
       throw new DOMException("InvalidStateError");
     f(this, D, $).call(this);
     let r;
-    if (n > 0 ? r = e : r = 0, f(this, mt, Rt).call(this, r), this.startTime === null && i(this, d) !== null && i(this, d).currentTime !== null && r !== null) {
+    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";
       r = h(r, a);
       const o = h(i(this, d).currentTime, a);
@@ -961,7 +955,7 @@ const se = class extends EventTarget {
   }
   commitStyles() {
     i(this, k).forEach((t) => {
-      t.effect instanceof pt && (t.effect.target === null || t.effect.pseudoElement !== null) || t.commitStyles();
+      t.effect instanceof mt && (t.effect.target === null || t.effect.pseudoElement !== null) || t.commitStyles();
     });
   }
   cancel() {
@@ -985,7 +979,7 @@ const se = class extends EventTarget {
             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);
           }
-          f(this, D, $).call(this), f(this, I, V).call(this, !1), f(this, B, G).call(this);
+          f(this, D, $).call(this), f(this, I, V).call(this, !1), f(this, F, G).call(this);
           break;
         }
         default:
@@ -1011,17 +1005,17 @@ const se = class extends EventTarget {
     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))
       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, mt, 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, 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);
   }
   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, ct));
+    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, ct)), 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, lt).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, lt).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);
+      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) {
@@ -1046,7 +1040,7 @@ const se = class extends EventTarget {
         const e = A.get(t);
         e && (e.effect = null), A.set(t, this);
       }
-      c(this, x, t), f(this, gt, Mt).call(this), f(this, I, V).call(this, !1);
+      c(this, x, t), f(this, vt, Mt).call(this), f(this, I, V).call(this, !1);
     }
   }
   get ready() {
@@ -1065,7 +1059,7 @@ const se = class extends EventTarget {
     return i(this, W);
   }
   get replaceState() {
-    return i(this, ht);
+    return i(this, ct);
   }
   get pending() {
     return i(this, S).state === "pending";
@@ -1101,20 +1095,20 @@ const se = class extends EventTarget {
     return i(this, x);
   }
 };
-d = /* @__PURE__ */ new WeakMap(), x = /* @__PURE__ */ new WeakMap(), ht = /* @__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(), ot = /* @__PURE__ */ new WeakMap(), W = /* @__PURE__ */ new WeakMap(), mt = /* @__PURE__ */ new WeakSet(), Rt = function(s) {
+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) {
   var t;
   const e = h(((t = i(this, d)) == null ? void 0 : t.currentTime) ?? null);
   if (s === 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(), lt = function() {
-  i(this, S).state !== "pending" && c(this, S, new nt()), cancelAnimationFrame(i(this, ot)), c(this, ot, requestAnimationFrame(() => {
+}, 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, zt).call(this), i(this, v).task === "play" && (i(this, u) !== null || i(this, y) !== null) ? f(this, kt, Kt).call(this) : i(this, v).task === "pause" && f(this, xt, qt).call(this), Promise.all(i(this, k).map((t) => t.finished)).then(i(this, yt)), 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, ht, "removed")));
+    (((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")));
   }));
 }, q = /* @__PURE__ */ new WeakSet(), tt = function() {
-  cancelAnimationFrame(i(this, ot)), i(this, v).task = null;
-}, kt = /* @__PURE__ */ new WeakSet(), Kt = 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;
   if (t === null)
@@ -1128,15 +1122,15 @@ d = /* @__PURE__ */ new WeakMap(), x = /* @__PURE__ */ new WeakMap(), ht = /* @_
     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, B, G).call(this), i(this, v).task = null, this.timeline instanceof DocumentTimeline && i(this, k).forEach((n) => n.play());
-}, xt = /* @__PURE__ */ new WeakSet(), qt = function() {
+  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;
   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, B, G).call(this), i(this, v).task = null, i(this, k).forEach((r) => r.pause());
-}, Ct = /* @__PURE__ */ new WeakSet(), zt = function() {
+  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;
@@ -1145,12 +1139,12 @@ d = /* @__PURE__ */ new WeakMap(), x = /* @__PURE__ */ new WeakMap(), ht = /* @_
       c(this, u, h(i(this, d).currentTime, "ms"));
     c(this, y, null);
   }
-}, B = /* @__PURE__ */ new WeakSet(), G = function() {
+}, F = /* @__PURE__ */ new WeakSet(), G = function() {
   var s;
   const t = ((s = i(this, d)) == null ? void 0 : s.currentTime) ?? null;
   if (t === null)
     return;
-  const e = i(this, x), n = i(this, d) instanceof E ? Le(t, e?.getTiming()) : Et(t);
+  const e = i(this, x), n = i(this, d) instanceof E ? Me(t, e?.getTiming()) : Et(t);
   let r = null;
   if (i(this, u) !== null) {
     const a = h(t, "percent") === (this.playbackRate < 0 ? 0 : 100) ? this.playbackRate < 0 ? 1e-3 : -1e-3 : 0;
@@ -1160,14 +1154,14 @@ d = /* @__PURE__ */ new WeakMap(), x = /* @__PURE__ */ new WeakMap(), ht = /* @_
   else
     return;
   i(this, k).forEach((a) => a.currentTime = r);
-}, ct = /* @__PURE__ */ new WeakMap(), gt = /* @__PURE__ */ new WeakSet(), Mt = function() {
+}, lt = /* @__PURE__ */ new WeakMap(), vt = /* @__PURE__ */ new WeakSet(), Mt = function() {
   var s;
   let t = i(this, x);
   const e = [];
-  if (t instanceof Ot)
+  if (t instanceof Vt)
     for (let n = 0; n < t.children.length; n++) {
       const r = new se(t.children.item(n));
-      if (t instanceof $e && n > 0) {
+      if (t instanceof Ie && n > 0) {
         const { endTime: a = null } = ((s = e[n - 1].effect) == null ? void 0 : s.getComputedTiming()) ?? {};
         r.startTime = h(a, "ms");
       }
@@ -1175,7 +1169,7 @@ d = /* @__PURE__ */ new WeakMap(), x = /* @__PURE__ */ new WeakMap(), ht = /* @_
     }
   else {
     const n = i(this, d) instanceof E ? document.timeline : i(this, d);
-    e.push(new Me(t, n));
+    e.push(new Ce(t, n));
   }
   c(this, k, e);
 }, I = /* @__PURE__ */ new WeakSet(), V = function(s) {
@@ -1186,7 +1180,7 @@ d = /* @__PURE__ */ new WeakMap(), x = /* @__PURE__ */ new WeakMap(), ht = /* @_
     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 ? It : 0;
+      p = i(this, d) instanceof E ? $t : 0;
     else if (p instanceof CSSNumericValue)
       p = p.to("ms").value;
     else if (typeof p == "string")
@@ -1195,13 +1189,13 @@ d = /* @__PURE__ */ new WeakMap(), x = /* @__PURE__ */ new WeakMap(), ht = /* @_
     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));
   }
-  f(this, B, G).call(this), c(this, z, this.currentTime), this.playState === "finished" ? i(this, P).state === "pending" && i(this, yt).call(this) : i(this, P).state === "resolved" && c(this, P, new nt());
+  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());
 }, D = /* @__PURE__ */ new WeakSet(), $ = function() {
   i(this, v).playbackRate && (this.playbackRate = i(this, v).playbackRate), i(this, v).playbackRate = null;
-}, yt = /* @__PURE__ */ new WeakMap(), Lt = /* @__PURE__ */ new WeakMap(), Pt = /* @__PURE__ */ new WeakMap();
-let Oe = se;
+}, wt = /* @__PURE__ */ new WeakMap(), Lt = /* @__PURE__ */ new WeakMap(), Pt = /* @__PURE__ */ new WeakMap();
+let $e = se;
 var et, Dt, re;
-class At extends Ot {
+class At extends Vt {
   constructor(t, e = ut) {
     super(t), g(this, Dt), g(this, et, void 0), c(this, et, {
       ...ut,
@@ -1236,7 +1230,7 @@ class At extends Ot {
     let { duration: l = 0, iterations: m = 1, endTime: p = 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 ? $t(e) : (n instanceof DocumentTimeline && (e.progress = a && h(a, o) / h(p, o)), e);
+    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);
   }
   updateTiming(t) {
     c(this, et, {
@@ -1253,7 +1247,7 @@ et = /* @__PURE__ */ new WeakMap(), Dt = /* @__PURE__ */ new WeakSet(), re = fun
   const { playbackRate: s = 1 } = A.get(this) ?? {};
   return s < 0 ? "backwards" : "forwards";
 };
-class Ve extends st {
+class Oe extends it {
   ref = K();
   #t = null;
   #e = null;
@@ -1281,7 +1275,7 @@ class Ve extends st {
     return n;
   }
   copyStyles(t, e, n) {
-    if (!ke(t))
+    if (!Re(t))
       return;
     const r = window.getComputedStyle(t);
     for (const a of n) {
@@ -1431,32 +1425,23 @@ class Ve extends st {
                 ` }) });
   }
 }
-const ae = it(0);
-class je extends st {
+class Ve extends it {
   sharedElementTransitionLayer = K();
-  animation = new Oe();
+  animation = new $e();
   #t = "normal";
   #e = [];
   state = {
-    gestureNavigating: !1,
-    progress: 1
+    gestureNavigating: !1
   };
-  onAnimationFrame() {
-    const t = this.animation.effect?.getComputedTiming().progress;
-    t && this.onProgress(t), this.animation.playState === "running" && requestAnimationFrame(this.onAnimationFrame.bind(this));
-  }
   onTransitionCancel() {
     this.props.navigation.dispatchEvent(new ye());
   }
   onTransitionStart() {
-    this.props.navigation.dispatchEvent(new ge()), this.onAnimationFrame();
+    this.props.navigation.dispatchEvent(new ge());
   }
   onTransitionEnd() {
     this.props.navigation.dispatchEvent(new ve());
   }
-  onProgress(t) {
-    this.setState({ progress: t }), this.props.navigation.dispatchEvent(new we(t));
-  }
   get screens() {
     return this.#e;
   }
@@ -1482,12 +1467,13 @@ class je extends st {
       this.sharedElementTransitionLayer.current?.ref.current?.close(), this.onTransitionCancel(), this.animation.effect = null;
     }, this.animation.finished.then(() => {
       this.animation.commitStyles(), this.onTransitionEnd(), this.sharedElementTransitionLayer.current?.ref.current?.close(), this.animation.effect = null;
+    }).catch(() => {
     }), this.animation;
   }
   render() {
-    return /* @__PURE__ */ Gt(_t.Provider, { value: this, children: [
+    return /* @__PURE__ */ Ht(Wt.Provider, { value: this, children: [
       /* @__PURE__ */ b(
-        Ve,
+        Oe,
         {
           ref: this.sharedElementTransitionLayer,
           navigation: this.props.navigation,
@@ -1503,16 +1489,15 @@ class je extends st {
             height: "100%",
             display: "grid",
             contain: "layout",
-            isolation: "isolate",
-            "--motion-progress": this.state.progress
+            isolation: "isolate"
           },
-          children: /* @__PURE__ */ b(ae.Provider, { value: this.state.progress, children: this.props.children })
+          children: this.props.children
         }
       )
     ] });
   }
 }
-class Nt extends st {
+class Nt extends it {
   ref = K();
   screenTransitionLayer = K();
   parent = null;
@@ -1526,7 +1511,7 @@ class Nt extends st {
     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));
   }
   componentDidMount() {
-    this.isRoot && window.navigation.addEventListener("navigate", this.handleNavigationDispatch), this.loadDispatched || (window.navigation.dispatchEvent(new Ee()), this.loadDispatched = !0);
+    this.isRoot && window.navigation.addEventListener("navigate", this.handleNavigationDispatch), this.loadDispatched || (window.navigation.dispatchEvent(new we()), this.loadDispatched = !0);
   }
   componentWillUnmount() {
     this.isRoot && window.navigation.removeEventListener("navigate", this.handleNavigationDispatch);
@@ -1549,16 +1534,18 @@ class Nt extends st {
     return pe(t, e);
   }
   addEventListener(t, e, n) {
-    return this.ref.current?.addEventListener(t, e, n);
+    const r = this.ref.current;
+    return r ? (r.addEventListener(t, e, n), () => r.removeEventListener(t, e, n)) : () => {
+    };
   }
   removeEventListener(t, e, n) {
     return this.ref.current?.removeEventListener(t, e, n);
   }
   screenChildFromPathname(t) {
-    for (const e of jt.toArray(this.props.children)) {
-      if (!Re(e))
+    for (const e of Bt.toArray(this.props.children)) {
+      if (!Se(e))
         continue;
-      const n = Yt(
+      const n = _t(
         e.props.path,
         t,
         this.baseURLPattern.pathname,
@@ -1574,7 +1561,7 @@ class Nt extends st {
   }
   preloadScreen(t) {
     const e = t.props.config, n = [];
-    return F(t.props.component) && n.push(t.props.component.load()), F(e?.header?.component) && n.push(e?.header?.component.load()), F(e?.footer?.component) && n.push(e?.footer?.component.load()), Promise.all(n).then(() => {
+    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(() => {
     });
   }
   get id() {
@@ -1588,13 +1575,13 @@ class Nt extends st {
   }
   get baseURL() {
     const t = this.isRoot ? window.location.pathname : this.parentScreen?.resolvedPathname, e = this.baseURLPattern.pathname;
-    return Tt(e, t);
+    return bt(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 = Tt(
+      t = bt(
         o.pathname,
         n
       ).href;
@@ -1602,7 +1589,7 @@ class Nt extends st {
     return new URLPattern({ baseURL: t, pathname: e });
   }
   get pathPatterns() {
-    return jt.map(this.props.children, (t) => ({ pattern: t.props.path, caseSensitive: !!t.props.caseSensitive }));
+    return Bt.map(this.props.children, (t) => ({ pattern: t.props.path, caseSensitive: !!t.props.caseSensitive }));
   }
   get mounted() {
     return !!this.ref.current;
@@ -1625,10 +1612,10 @@ class Nt extends st {
           className: "react-motion-router",
           style: { width: "100%", height: "100%" },
           ref: this.ref,
-          children: /* @__PURE__ */ b(wt.Provider, { value: this, children: /* @__PURE__ */ b(
-            je,
+          children: /* @__PURE__ */ b(pt.Provider, { value: this, children: /* @__PURE__ */ b(
+            Ve,
             {
-              id: `${this.id}-transition-provider`,
+              id: `${this.id}-transition-layer`,
               ref: this.screenTransitionLayer,
               navigation: this.navigation,
               hasUAVisualTransition: this.hasUAVisualTransition,
@@ -1639,7 +1626,7 @@ class Nt extends st {
       );
   }
 }
-class Fe {
+class je {
   #t = /* @__PURE__ */ new Map();
   mutationObserver;
   constructor() {
@@ -1723,13 +1710,13 @@ class Fe {
 }
 class Ut {
   static rootNavigatorRef = null;
-  metaData = new Fe();
+  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), () => this.router.removeEventListener(t, e, n);
+    return this.router.addEventListener(t, e, n);
   }
   removeEventListener(t, e, n) {
     return this.router.removeEventListener(t, e, n);
@@ -1756,25 +1743,39 @@ class Ut {
     return !!document.getElementById(`${this.routerId}`);
   }
 }
-function nn() {
-  const s = vt(wt);
+function en() {
+  const s = ht(pt);
   if (s)
     return s.navigation;
   throw new Error("Router is null. You may be trying to call useNavigation outside a Router.");
 }
-function sn() {
-  return vt(wt);
+function nn() {
+  return ht(pt);
 }
-function rn() {
-  return ce("Motion"), vt(ae);
+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");
+    }),
+    () => {
+      const { progress: r } = e?.effect?.getComputedTiming() ?? {};
+      return r ?? n;
+    }
+  );
 }
 function Be() {
-  const s = vt(Qt);
+  const s = ht(Qt);
   if (s)
     return s;
   throw new Error("Router is null. You may be trying to call useRoute outside a Router.");
 }
-function an(s, t) {
+function rn(s, t) {
   const e = Be(), n = t instanceof Function ? t() : t, r = he(e);
   ue(() => {
     r.current = e;
@@ -1785,47 +1786,45 @@ function an(s, t) {
   }, [n, s]);
   return [e.params[s] ?? n, a];
 }
-const on = 2147483647, ln = 100, cn = 0, hn = 0, un = 1;
+const an = 2147483647, on = 100, ln = 0, cn = 0, hn = 1;
 export {
-  Ee as LoadEvent,
-  un as MAX_NORM_PROGRESS,
-  ln as MAX_PROGRESS,
-  on as MAX_Z_INDEX,
-  hn as MIN_NORM_PROGRESS,
-  cn as MIN_PROGRESS,
-  ae as MotionContext,
-  tn as MotionProgressEndEvent,
-  we as MotionProgressEvent,
-  Qe as MotionProgressStartEvent,
+  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,
-  wt as RouterContext,
-  Se as ScreenBase,
-  ze as SharedElement,
+  pt as RouterContext,
+  be as ScreenBase,
+  qe as SharedElement,
   ye as TransitionCancelEvent,
   ve as TransitionEndEvent,
   ge as TransitionStartEvent,
-  Je as cloneAndInject,
+  _e as cloneAndInject,
   pe as dispatchEvent,
-  Ge as includesRoute,
-  F as isLazyExoticComponent,
+  ze as includesRoute,
+  B as isLazyExoticComponent,
   te as isNativeLazyExoticComponent,
-  Xe as isNavigationSupported,
-  ke as isStylableElement,
-  Ze as isURLPatternSupported,
-  Re as isValidScreenChild,
-  He as lazy,
-  Yt as matchRoute,
-  _e as polyfillNavigation,
-  Ye as polyfillURLPattern,
-  Tt as resolveBaseURLFromPattern,
+  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,
-  rn as useMotion,
-  nn as useNavigationBase,
-  an as useParamsBase,
+  sn as useMotion,
+  en as useNavigationBase,
+  rn as useParamsBase,
   Be as useRouteBase,
-  sn as useRouterBase
+  nn as useRouterBase
 };
 //# sourceMappingURL=index.js.map