@flemo/react 1.0.0 → 1.0.2

package/dist/index.mjs

@@ -1,38 +1,38 @@
-import { jsx as L, jsxs as At, Fragment as fe } from "react/jsx-runtime";
-import gt, { useEffect as at, createContext as Gt, useContext as Ut, useReducer as me, Children as ee, useInsertionEffect as ye, useRef as N, useImperativeHandle as he, useState as vt, useLayoutEffect as wt } from "react";
-import { consumeSelfInducedPop as ge, TaskManger as G, useNavigateStore as q, useHistoryStore as U, getMatchedPathPattern as we, transitionMap as nt, decoratorMap as lt, isServer as Ht, compileTransitionStyles as Se, useTransitionStore as Ot, getParams as ve, markSelfInducedPop as ne, targetToDecls as Te, easingToCss as Ee, variantHasAnimation as Pe, animationName as xe, collectAnimatedProperties as Ie, findScrollable as zt } from "@flemo/core";
+import { jsx as N, jsxs as Ht, Fragment as fe } from "react/jsx-runtime";
+import Pt, { useEffect as lt, createContext as Gt, useContext as Yt, useReducer as me, Children as te, useInsertionEffect as he, useRef as L, useImperativeHandle as ye, useState as bt, useLayoutEffect as xt } from "react";
+import { consumeSelfInducedPop as ge, TaskManger as G, useNavigateStore as K, useHistoryStore as O, getMatchedPathPattern as we, transitionMap as it, decoratorMap as ft, isServer as Mt, compileTransitionStyles as Se, useTransitionStore as Ot, getParams as ve, markSelfInducedPop as ee, targetToDecls as Te, easingToCss as Ee, variantHasAnimation as Pe, animationName as xe, findScrollable as qt, collectAnimatedProperties as be } from "@flemo/core";
 import { createDecorator as tn, createRawDecorator as en, createRawTransition as nn, createTransition as rn } from "@flemo/core";
-function De() {
-  return at(() => {
+function Ie() {
+  return lt(() => {
     const n = async (e) => {
       if (ge())
         return;
-      const o = e.state?.id, i = G.generateTaskId();
+      const r = e.state?.id, a = G.generateTaskId();
       (await G.addTask(
         async (u) => {
-          const s = e.state?.index, a = e.state?.status, v = e.state?.params, E = e.state?.transitionName, f = e.state?.layoutId, { setStatus: x, setTransitionTaskId: h } = q.getState(), { index: R, addHistory: $, popHistory: C } = U.getState(), b = s < R, X = a === "PUSHING" && s > R, H = a === "REPLACING" && s > R, _ = window.location.pathname;
-          if (!b && !X && !H) {
+          const i = e.state?.index, s = e.state?.status, T = e.state?.params, E = e.state?.transitionName, m = e.state?.layoutId, { setStatus: x, setTransitionTaskId: y } = K.getState(), { index: R, addHistory: $, popHistory: C } = O.getState(), D = i < R, F = s === "PUSHING" && i > R, M = s === "REPLACING" && i > R, Y = window.location.pathname;
+          if (!D && !F && !M) {
             u.abort();
             return;
           }
-          return h(i), b ? x("POPPING") : X ? (x("PUSHING"), $({
-            id: o,
-            pathname: _,
-            params: v,
+          return y(a), D ? x("POPPING") : F ? (x("PUSHING"), $({
+            id: r,
+            pathname: Y,
+            params: T,
             transitionName: E,
-            layoutId: f
-          })) : H && (x("REPLACING"), $({
-            id: o,
-            pathname: _,
-            params: v,
+            layoutId: m
+          })) : M && (x("REPLACING"), $({
+            id: r,
+            pathname: Y,
+            params: T,
             transitionName: E,
-            layoutId: f
+            layoutId: m
           })), async () => {
-            b && C(s + 1), x("COMPLETED");
+            D && C(i + 1), x("COMPLETED");
           };
         },
         {
-          id: i,
+          id: a,
           control: {
             manual: !0
           }
@@ -44,267 +44,267 @@ function De() {
     };
   }, []), null;
 }
-var Y = {}, Kt;
+var j = {}, zt;
 function Re() {
-  if (Kt) return Y;
-  Kt = 1, Object.defineProperty(Y, "__esModule", { value: !0 }), Y.PathError = Y.TokenData = void 0, Y.parse = f, Y.compile = x, Y.match = $, Y.pathToRegexp = C, Y.stringify = dt;
-  const n = "/", e = (r) => r, o = /^[$_\p{ID_Start}]$/u, i = /^[$\u200c\u200d\p{ID_Continue}]$/u, u = /^[$_\p{ID_Start}][$\u200c\u200d\p{ID_Continue}]*$/u;
-  function s(r) {
-    return r.replace(/[{}()\[\]+?!:*\\]/g, "\\$&");
+  if (zt) return j;
+  zt = 1, Object.defineProperty(j, "__esModule", { value: !0 }), j.PathError = j.TokenData = void 0, j.parse = m, j.compile = x, j.match = $, j.pathToRegexp = C, j.stringify = ht;
+  const n = "/", e = (o) => o, r = /^[$_\p{ID_Start}]$/u, a = /^[$\u200c\u200d\p{ID_Continue}]$/u, u = /^[$_\p{ID_Start}][$\u200c\u200d\p{ID_Continue}]*$/u;
+  function i(o) {
+    return o.replace(/[{}()\[\]+?!:*\\]/g, "\\$&");
   }
-  function a(r) {
-    return r.replace(/[.+*?^${}()[\]|/\\]/g, "\\$&");
+  function s(o) {
+    return o.replace(/[.+*?^${}()[\]|/\\]/g, "\\$&");
   }
-  class v {
-    constructor(c, m) {
-      this.tokens = c, this.originalPath = m;
+  class T {
+    constructor(c, h) {
+      this.tokens = c, this.originalPath = h;
     }
   }
-  Y.TokenData = v;
+  j.TokenData = T;
   class E extends TypeError {
-    constructor(c, m) {
-      let p = c;
-      m && (p += `: ${m}`), p += "; visit https://git.new/pathToRegexpError for info", super(p), this.originalPath = m;
+    constructor(c, h) {
+      let d = c;
+      h && (d += `: ${h}`), d += "; visit https://git.new/pathToRegexpError for info", super(d), this.originalPath = h;
     }
   }
-  Y.PathError = E;
-  function f(r, c = {}) {
-    const { encodePath: m = e } = c, p = [...r];
+  j.PathError = E;
+  function m(o, c = {}) {
+    const { encodePath: h = e } = c, d = [...o];
     let l = 0;
-    function g(d) {
+    function g(p) {
       const P = [];
       let w = "";
-      function D() {
+      function I() {
         w && (P.push({
           type: "text",
-          value: m(w)
+          value: h(w)
         }), w = "");
       }
-      for (; l < p.length; ) {
-        const I = p[l++];
-        if (I === d)
-          return D(), P;
-        if (I === "\\") {
-          if (l === p.length)
-            throw new E(`Unexpected end after \\ at index ${l}`, r);
-          w += p[l++];
+      for (; l < d.length; ) {
+        const b = d[l++];
+        if (b === p)
+          return I(), P;
+        if (b === "\\") {
+          if (l === d.length)
+            throw new E(`Unexpected end after \\ at index ${l}`, o);
+          w += d[l++];
           continue;
         }
-        if (I === ":" || I === "*") {
-          const M = I === ":" ? "param" : "wildcard";
+        if (b === ":" || b === "*") {
+          const U = b === ":" ? "param" : "wildcard";
           let S = "";
-          if (o.test(p[l]))
+          if (r.test(d[l]))
             do
-              S += p[l++];
-            while (i.test(p[l]));
-          else if (p[l] === '"') {
-            let k = l;
-            for (; l < p.length; ) {
-              if (p[++l] === '"') {
-                l++, k = 0;
+              S += d[l++];
+            while (a.test(d[l]));
+          else if (d[l] === '"') {
+            let H = l;
+            for (; l < d.length; ) {
+              if (d[++l] === '"') {
+                l++, H = 0;
                 break;
               }
-              p[l] === "\\" && l++, S += p[l];
+              d[l] === "\\" && l++, S += d[l];
             }
-            if (k)
-              throw new E(`Unterminated quote at index ${k}`, r);
+            if (H)
+              throw new E(`Unterminated quote at index ${H}`, o);
           }
           if (!S)
-            throw new E(`Missing parameter name at index ${l}`, r);
-          D(), P.push({ type: M, name: S });
+            throw new E(`Missing parameter name at index ${l}`, o);
+          I(), P.push({ type: U, name: S });
           continue;
         }
-        if (I === "{") {
-          D(), P.push({
+        if (b === "{") {
+          I(), P.push({
             type: "group",
             tokens: g("}")
           });
           continue;
         }
-        if (I === "}" || I === "(" || I === ")" || I === "[" || I === "]" || I === "+" || I === "?" || I === "!")
-          throw new E(`Unexpected ${I} at index ${l - 1}`, r);
-        w += I;
+        if (b === "}" || b === "(" || b === ")" || b === "[" || b === "]" || b === "+" || b === "?" || b === "!")
+          throw new E(`Unexpected ${b} at index ${l - 1}`, o);
+        w += b;
       }
-      if (d)
-        throw new E(`Unexpected end at index ${l}, expected ${d}`, r);
-      return D(), P;
+      if (p)
+        throw new E(`Unexpected end at index ${l}, expected ${p}`, o);
+      return I(), P;
     }
-    return new v(g(""), r);
+    return new T(g(""), o);
   }
-  function x(r, c = {}) {
-    const { encode: m = encodeURIComponent, delimiter: p = n } = c, l = typeof r == "object" ? r : f(r, c), g = h(l.tokens, p, m);
+  function x(o, c = {}) {
+    const { encode: h = encodeURIComponent, delimiter: d = n } = c, l = typeof o == "object" ? o : m(o, c), g = y(l.tokens, d, h);
     return function(P = {}) {
-      const w = [], D = g(P, w);
+      const w = [], I = g(P, w);
       if (w.length)
         throw new TypeError(`Missing parameters: ${w.join(", ")}`);
-      return D;
+      return I;
     };
   }
-  function h(r, c, m) {
-    const p = r.map((l) => R(l, c, m));
+  function y(o, c, h) {
+    const d = o.map((l) => R(l, c, h));
     return (l, g) => {
-      let d = "";
-      for (const P of p)
-        d += P(l, g);
-      return d;
+      let p = "";
+      for (const P of d)
+        p += P(l, g);
+      return p;
     };
   }
-  function R(r, c, m) {
-    if (r.type === "text")
-      return () => r.value;
-    if (r.type === "group") {
-      const l = h(r.tokens, c, m);
-      return (g, d) => {
-        const P = d.length, w = l(g, d);
-        return d.length === P ? w : (d.length = P, "");
+  function R(o, c, h) {
+    if (o.type === "text")
+      return () => o.value;
+    if (o.type === "group") {
+      const l = y(o.tokens, c, h);
+      return (g, p) => {
+        const P = p.length, w = l(g, p);
+        return p.length === P ? w : (p.length = P, "");
       };
     }
-    const p = m || e;
-    return r.type === "wildcard" && m !== !1 ? (l, g) => {
-      const d = l[r.name];
-      if (d == null)
-        return g.push(r.name), "";
-      if (!Array.isArray(d) || d.length === 0)
-        throw new TypeError(`Expected "${r.name}" to be a non-empty array`);
+    const d = h || e;
+    return o.type === "wildcard" && h !== !1 ? (l, g) => {
+      const p = l[o.name];
+      if (p == null)
+        return g.push(o.name), "";
+      if (!Array.isArray(p) || p.length === 0)
+        throw new TypeError(`Expected "${o.name}" to be a non-empty array`);
       let P = "";
-      for (let w = 0; w < d.length; w++) {
-        if (typeof d[w] != "string")
-          throw new TypeError(`Expected "${r.name}/${w}" to be a string`);
-        w > 0 && (P += c), P += p(d[w]);
+      for (let w = 0; w < p.length; w++) {
+        if (typeof p[w] != "string")
+          throw new TypeError(`Expected "${o.name}/${w}" to be a string`);
+        w > 0 && (P += c), P += d(p[w]);
       }
       return P;
     } : (l, g) => {
-      const d = l[r.name];
-      if (d == null)
-        return g.push(r.name), "";
-      if (typeof d != "string")
-        throw new TypeError(`Expected "${r.name}" to be a string`);
-      return p(d);
+      const p = l[o.name];
+      if (p == null)
+        return g.push(o.name), "";
+      if (typeof p != "string")
+        throw new TypeError(`Expected "${o.name}" to be a string`);
+      return d(p);
     };
   }
-  function $(r, c = {}) {
-    const { decode: m = decodeURIComponent, delimiter: p = n } = c, { regexp: l, keys: g } = C(r, c), d = g.map((P) => m === !1 ? e : P.type === "param" ? m : (w) => w.split(p).map(m));
+  function $(o, c = {}) {
+    const { decode: h = decodeURIComponent, delimiter: d = n } = c, { regexp: l, keys: g } = C(o, c), p = g.map((P) => h === !1 ? e : P.type === "param" ? h : (w) => w.split(d).map(h));
     return function(w) {
-      const D = l.exec(w);
-      if (!D)
+      const I = l.exec(w);
+      if (!I)
         return !1;
-      const I = D[0], M = /* @__PURE__ */ Object.create(null);
-      for (let S = 1; S < D.length; S++) {
-        if (D[S] === void 0)
+      const b = I[0], U = /* @__PURE__ */ Object.create(null);
+      for (let S = 1; S < I.length; S++) {
+        if (I[S] === void 0)
           continue;
-        const k = g[S - 1], V = d[S - 1];
-        M[k.name] = V(D[S]);
+        const H = g[S - 1], _ = p[S - 1];
+        U[H.name] = _(I[S]);
       }
-      return { path: I, params: M };
+      return { path: b, params: U };
     };
   }
-  function C(r, c = {}) {
-    const { delimiter: m = n, end: p = !0, sensitive: l = !1, trailing: g = !0 } = c, d = [];
+  function C(o, c = {}) {
+    const { delimiter: h = n, end: d = !0, sensitive: l = !1, trailing: g = !0 } = c, p = [];
     let P = "", w = 0;
-    function D(M) {
-      if (Array.isArray(M)) {
-        for (const k of M)
-          D(k);
+    function I(U) {
+      if (Array.isArray(U)) {
+        for (const H of U)
+          I(H);
         return;
       }
-      const S = typeof M == "object" ? M : f(M, c);
-      b(S.tokens, 0, [], (k) => {
+      const S = typeof U == "object" ? U : m(U, c);
+      D(S.tokens, 0, [], (H) => {
         if (w >= 256)
           throw new E("Too many path combinations", S.originalPath);
-        w > 0 && (P += "|"), P += X(k, m, d, S.originalPath), w++;
+        w > 0 && (P += "|"), P += F(H, h, p, S.originalPath), w++;
       });
     }
-    D(r);
-    let I = `^(?:${P})`;
-    return g && (I += "(?:" + a(m) + "$)?"), I += p ? "$" : "(?=" + a(m) + "|$)", { regexp: new RegExp(I, l ? "" : "i"), keys: d };
+    I(o);
+    let b = `^(?:${P})`;
+    return g && (b += "(?:" + s(h) + "$)?"), b += d ? "$" : "(?=" + s(h) + "|$)", { regexp: new RegExp(b, l ? "" : "i"), keys: p };
   }
-  function b(r, c, m, p) {
-    for (; c < r.length; ) {
-      const l = r[c++];
+  function D(o, c, h, d) {
+    for (; c < o.length; ) {
+      const l = o[c++];
       if (l.type === "group") {
-        const g = m.length;
-        b(l.tokens, 0, m, (d) => b(r, c, d, p)), m.length = g;
+        const g = h.length;
+        D(l.tokens, 0, h, (p) => D(o, c, p, d)), h.length = g;
         continue;
       }
-      m.push(l);
+      h.push(l);
     }
-    p(m);
+    d(h);
   }
-  function X(r, c, m, p) {
-    let l = "", g = "", d = "", P = 0, w = 0, D = 0;
-    function I(S, k) {
-      for (; S < r.length; ) {
-        const V = r[S++];
-        if (V.type === k)
+  function F(o, c, h, d) {
+    let l = "", g = "", p = "", P = 0, w = 0, I = 0;
+    function b(S, H) {
+      for (; S < o.length; ) {
+        const _ = o[S++];
+        if (_.type === H)
           return !0;
-        if (V.type === "text" && V.value.includes(c))
+        if (_.type === "text" && _.value.includes(c))
           break;
       }
       return !1;
     }
-    function M(S) {
-      let k = "";
-      for (; S < r.length; ) {
-        const V = r[S++];
-        if (V.type !== "text")
+    function U(S) {
+      let H = "";
+      for (; S < o.length; ) {
+        const _ = o[S++];
+        if (_.type !== "text")
           break;
-        k += V.value;
+        H += _.value;
       }
-      return k;
+      return H;
     }
-    for (; D < r.length; ) {
-      const S = r[D++];
+    for (; I < o.length; ) {
+      const S = o[I++];
       if (S.type === "text") {
-        l += a(S.value), g += S.value, P === 2 && (d += S.value), S.value.includes(c) && (w = 0);
+        l += s(S.value), g += S.value, P === 2 && (p += S.value), S.value.includes(c) && (w = 0);
         continue;
       }
       if (S.type === "param" || S.type === "wildcard") {
         if (P && !g)
-          throw new E(`Missing text before "${S.name}" ${S.type}`, p);
-        S.type === "param" ? (l += w & 2 ? `(${H(c, g)}+)` : I(D, "wildcard") ? `(${H(c, M(D))}+)` : w & 1 ? `(${H(c, g)}+|${a(g)})` : `(${H(c, "")}+)`, w |= P = 1) : (l += w & 2 ? `(${H(g, "")}+)` : d ? `(${H(d, "")}+|${H(c, "")}+)` : "([^]+)", d = "", w |= P = 2), m.push(S), g = "";
+          throw new E(`Missing text before "${S.name}" ${S.type}`, d);
+        S.type === "param" ? (l += w & 2 ? `(${M(c, g)}+)` : b(I, "wildcard") ? `(${M(c, U(I))}+)` : w & 1 ? `(${M(c, g)}+|${s(g)})` : `(${M(c, "")}+)`, w |= P = 1) : (l += w & 2 ? `(${M(g, "")}+)` : p ? `(${M(p, "")}+|${M(c, "")}+)` : "([^]+)", p = "", w |= P = 2), h.push(S), g = "";
         continue;
       }
       throw new TypeError(`Unknown token type: ${S.type}`);
     }
     return l;
   }
-  function H(r, c) {
-    return c.length > r.length ? H(c, r) : (r === c && (c = ""), c.length > 1 ? `(?:(?!${a(r)}|${a(c)})[^])` : r.length > 1 ? `(?:(?!${a(r)})[^${a(c)}])` : `[^${a(r + c)}]`);
+  function M(o, c) {
+    return c.length > o.length ? M(c, o) : (o === c && (c = ""), c.length > 1 ? `(?:(?!${s(o)}|${s(c)})[^])` : o.length > 1 ? `(?:(?!${s(o)})[^${s(c)}])` : `[^${s(o + c)}]`);
   }
-  function _(r, c) {
-    let m = "";
-    for (; c < r.length; ) {
-      const p = r[c++];
-      if (p.type === "text") {
-        m += s(p.value);
+  function Y(o, c) {
+    let h = "";
+    for (; c < o.length; ) {
+      const d = o[c++];
+      if (d.type === "text") {
+        h += i(d.value);
         continue;
       }
-      if (p.type === "group") {
-        m += "{" + _(p.tokens, 0) + "}";
+      if (d.type === "group") {
+        h += "{" + Y(d.tokens, 0) + "}";
         continue;
       }
-      if (p.type === "param") {
-        m += ":" + O(p.name, r[c]);
+      if (d.type === "param") {
+        h += ":" + B(d.name, o[c]);
         continue;
       }
-      if (p.type === "wildcard") {
-        m += "*" + O(p.name, r[c]);
+      if (d.type === "wildcard") {
+        h += "*" + B(d.name, o[c]);
         continue;
       }
-      throw new TypeError(`Unknown token type: ${p.type}`);
+      throw new TypeError(`Unknown token type: ${d.type}`);
     }
-    return m;
+    return h;
   }
-  function dt(r) {
-    return _(r.tokens, 0);
+  function ht(o) {
+    return Y(o.tokens, 0);
   }
-  function O(r, c) {
-    return !u.test(r) || c?.type === "text" && i.test(c.value[0]) ? JSON.stringify(r) : r;
+  function B(o, c) {
+    return !u.test(o) || c?.type === "text" && a.test(c.value[0]) ? JSON.stringify(o) : o;
   }
-  return Y;
+  return j;
 }
-var Mt = Re();
-const re = Gt({
+var Bt = Re();
+const ne = Gt({
   id: "",
   isActive: !1,
   isRoot: !0,
@@ -317,160 +317,160 @@ const re = Gt({
   layoutId: null,
   routePath: ""
 });
-function pt() {
-  return Ut(re);
+function mt() {
+  return Yt(ne);
 }
-const oe = Gt({}), ie = Gt(() => {
+const re = Gt({}), oe = Gt(() => {
 });
-function be(n, e) {
+function De(n, e) {
   return e.type === "SET" ? e.params : n;
 }
 function Le({ children: n }) {
-  const { isActive: e, params: o } = pt(), [i, u] = me(be, o);
-  return at(() => {
-    const s = async (a) => {
-      a.state?.step && await G.addTask(async () => {
-        u({ type: "SET", params: a.state?.params || {} });
+  const { isActive: e, params: r } = mt(), [a, u] = me(De, r);
+  return lt(() => {
+    const i = async (s) => {
+      s.state?.step && await G.addTask(async () => {
+        u({ type: "SET", params: s.state?.params || {} });
       });
     };
-    return e && window.addEventListener("popstate", s), () => {
-      window.removeEventListener("popstate", s);
+    return e && window.addEventListener("popstate", i), () => {
+      window.removeEventListener("popstate", i);
     };
-  }, [e, u]), /* @__PURE__ */ L(ie.Provider, { value: u, children: /* @__PURE__ */ L(oe.Provider, { value: i, children: n }) });
+  }, [e, u]), /* @__PURE__ */ N(oe.Provider, { value: u, children: /* @__PURE__ */ N(re.Provider, { value: a, children: n }) });
 }
-function $e({ children: n }) {
-  const e = U((i) => i.index), o = U((i) => i.histories);
-  return o.map(
-    (i) => ee.toArray(n).filter(
-      (u) => Mt.pathToRegexp(u.props.path).regexp.test(
-        i.pathname
+function Ne({ children: n }) {
+  const e = O((a) => a.index), r = O((a) => a.histories);
+  return r.map(
+    (a) => te.toArray(n).filter(
+      (u) => Bt.pathToRegexp(u.props.path).regexp.test(
+        a.pathname
       )
     )
-  ).map(([i], u) => /* @__PURE__ */ L(
-    re.Provider,
+  ).map(([a], u) => /* @__PURE__ */ N(
+    ne.Provider,
     {
       value: {
-        id: o[u].id,
+        id: r[u].id,
         isActive: u === e,
         isRoot: u === 0,
         isPrev: u < e - 1,
         zIndex: u,
-        pathname: o[u].pathname,
-        params: o[u].params,
-        transitionName: o[e].transitionName,
-        prevTransitionName: o[e - 1]?.transitionName,
-        layoutId: o[u].layoutId,
+        pathname: r[u].pathname,
+        params: r[u].params,
+        transitionName: r[e].transitionName,
+        prevTransitionName: r[e - 1]?.transitionName,
+        layoutId: r[u].layoutId,
         routePath: we(
-          i.props.path,
-          o[u].pathname
+          a.props.path,
+          r[u].pathname
         )
       },
-      children: /* @__PURE__ */ L(Le, { children: i })
+      children: /* @__PURE__ */ N(Le, { children: a })
     },
-    o[u].id
+    r[u].id
   ));
 }
-const Wt = "data-flemo", Jt = () => {
-  if (Ht()) return;
-  const n = Se(nt.values(), lt.values());
-  let e = document.head.querySelector(`style[${Wt}]`);
-  e || (e = document.createElement("style"), e.setAttribute(Wt, ""), document.head.appendChild(e)), e.textContent !== n && (e.textContent = n);
+const Kt = "data-flemo", Wt = () => {
+  if (Mt()) return;
+  const n = Se(it.values(), ft.values());
+  let e = document.head.querySelector(`style[${Kt}]`);
+  e || (e = document.createElement("style"), e.setAttribute(Kt, ""), document.head.appendChild(e)), e.textContent !== n && (e.textContent = n);
 };
-function Ne(n, e) {
-  ye(() => {
-    for (const o of n) nt.set(o.name, o);
-    for (const o of e) lt.set(o.name, o);
-    return Jt(), () => {
-      for (const o of n) nt.delete(o.name);
-      for (const o of e) lt.delete(o.name);
-      Jt();
+function $e(n, e) {
+  he(() => {
+    for (const r of n) it.set(r.name, r);
+    for (const r of e) ft.set(r.name, r);
+    return Wt(), () => {
+      for (const r of n) it.delete(r.name);
+      for (const r of e) ft.delete(r.name);
+      Wt();
     };
   }, [n, e]);
 }
-const Ce = [], ke = [];
-function Be({
+const Ae = [], ke = [];
+function Fe({
   children: n,
   initPath: e = "/",
-  defaultTransitionName: o = "cupertino",
-  transitions: i = Ce,
+  defaultTransitionName: r = "cupertino",
+  transitions: a = Ae,
   decorators: u = ke
 }) {
-  const s = Ht() ? e || "/" : window.location.pathname, a = Ht() ? s.split("?")[1] || "" : window.location.search;
+  const i = Mt() ? e || "/" : window.location.pathname, s = Mt() ? i.split("?")[1] || "" : window.location.search;
   return Ot.setState({
-    defaultTransitionName: o
-  }), U.setState({
+    defaultTransitionName: r
+  }), O.setState({
     index: 0,
     histories: [
       {
         id: "root",
-        pathname: s,
+        pathname: i,
         params: ve(
-          ee.toArray(n).map((v) => v.props.path).flat(),
-          s,
-          a
+          te.toArray(n).map((T) => T.props.path).flat(),
+          i,
+          s
         ),
-        transitionName: o,
+        transitionName: r,
         layoutId: null
       }
     ]
-  }), Ne(i, u), at(() => {
+  }), $e(a, u), lt(() => {
     window.history.state?.index || window.history.replaceState(
       {
         id: "root",
         index: 0,
         status: "IDLE",
         params: {},
-        transitionName: o,
+        transitionName: r,
         layoutId: null
       },
       "",
       window.location.href
     );
-  }, [o]), /* @__PURE__ */ At(fe, { children: [
-    /* @__PURE__ */ L(De, {}),
-    /* @__PURE__ */ L($e, { children: n })
+  }, [r]), /* @__PURE__ */ Ht(fe, { children: [
+    /* @__PURE__ */ N(Ie, {}),
+    /* @__PURE__ */ N(Ne, { children: n })
   ] });
 }
 function qe({ element: n }) {
   return n;
 }
-function Tt(n, e) {
-  const o = e ?? {}, i = Mt.compile(n), u = Object.fromEntries(
-    Object.entries(o).map(([h, R]) => [h, String(R)])
-  ), s = i(u), v = (typeof n == "string" ? Mt.parse(n) : n).tokens.filter((h) => h.type === "param").map((h) => h.name), E = Object.fromEntries(
-    Object.entries(o).filter(([h]) => !v.includes(h))
-  ), f = new URLSearchParams(E).toString();
-  return { pathname: `${s}${f ? `?${f}` : ""}`, toPathname: s };
+function It(n, e) {
+  const r = e ?? {}, a = Bt.compile(n), u = Object.fromEntries(
+    Object.entries(r).map(([y, R]) => [y, String(R)])
+  ), i = a(u), T = (typeof n == "string" ? Bt.parse(n) : n).tokens.filter((y) => y.type === "param").map((y) => y.name), E = Object.fromEntries(
+    Object.entries(r).filter(([y]) => !T.includes(y))
+  ), m = new URLSearchParams(E).toString();
+  return { pathname: `${i}${m ? `?${m}` : ""}`, toPathname: i };
 }
 function ze() {
   return {
-    push: async (i, u, s) => {
-      const { status: a } = q.getState();
-      if (a !== "COMPLETED" && a !== "IDLE")
+    push: async (a, u, i) => {
+      const { status: s } = K.getState();
+      if (s !== "COMPLETED" && s !== "IDLE")
         return;
-      const { index: v, addHistory: E } = U.getState(), f = Ot.getState().defaultTransitionName, { transitionName: x = f, layoutId: h = null } = s ?? {}, R = G.generateTaskId();
+      const { index: T, addHistory: E } = O.getState(), m = Ot.getState().defaultTransitionName, { transitionName: x = m, layoutId: y = null } = i ?? {}, R = G.generateTaskId();
       (await G.addTask(
         async () => {
-          const { setStatus: $, setTransitionTaskId: C } = q.getState();
+          const { setStatus: $, setTransitionTaskId: C } = K.getState();
           $("PUSHING"), C(R);
-          const { pathname: b, toPathname: X } = Tt(i, u ?? {});
+          const { pathname: D, toPathname: F } = It(a, u ?? {});
           return window.history.pushState(
             {
               id: R,
-              index: v + 1,
+              index: T + 1,
               status: "PUSHING",
               params: u,
               transitionName: x,
-              layoutId: h
+              layoutId: y
             },
             "",
-            b
+            D
           ), E({
             id: R,
-            pathname: X,
+            pathname: F,
             params: u ?? {},
             transitionName: x,
-            layoutId: h
+            layoutId: y
           }), () => {
             $("COMPLETED");
           };
@@ -483,35 +483,35 @@ function ze() {
         }
       )).result?.();
     },
-    replace: async (i, u, s) => {
-      const { status: a } = q.getState();
-      if (a !== "COMPLETED" && a !== "IDLE")
+    replace: async (a, u, i) => {
+      const { status: s } = K.getState();
+      if (s !== "COMPLETED" && s !== "IDLE")
         return;
-      const { index: v, addHistory: E } = U.getState(), f = U.getState().replaceHistory, x = Ot.getState().defaultTransitionName, { transitionName: h = x, layoutId: R = null } = s ?? {}, $ = G.generateTaskId();
+      const { index: T, addHistory: E } = O.getState(), m = O.getState().replaceHistory, x = Ot.getState().defaultTransitionName, { transitionName: y = x, layoutId: R = null } = i ?? {}, $ = G.generateTaskId();
       (await G.addTask(
         async () => {
-          const { setStatus: C, setTransitionTaskId: b } = q.getState();
-          C("REPLACING"), b($);
-          const { pathname: X, toPathname: H } = Tt(i, u ?? {});
+          const { setStatus: C, setTransitionTaskId: D } = K.getState();
+          C("REPLACING"), D($);
+          const { pathname: F, toPathname: M } = It(a, u ?? {});
           return window.history.replaceState(
             {
               id: $,
-              index: v,
+              index: T,
               status: "REPLACING",
               params: u,
-              transitionName: h,
+              transitionName: y,
               layoutId: R
             },
             "",
-            X
+            F
           ), E({
             id: $,
-            pathname: H,
+            pathname: M,
             params: u ?? {},
-            transitionName: h,
+            transitionName: y,
             layoutId: R
           }), async () => {
-            f(v), C("COMPLETED");
+            m(T), C("COMPLETED");
           };
         },
         {
@@ -523,21 +523,21 @@ function ze() {
       )).result?.();
     },
     pop: async () => {
-      const i = G.generateTaskId();
+      const a = G.generateTaskId();
       (await G.addTask(
         async (u) => {
-          const { index: s, popHistory: a } = U.getState();
-          if (s <= 0) {
+          const { index: i, popHistory: s } = O.getState();
+          if (i <= 0) {
             u.abort();
             return;
           }
-          const { setStatus: v, setTransitionTaskId: E } = q.getState();
-          return v("POPPING"), E(i), ne(), window.history.back(), async () => {
-            a(s), v("COMPLETED");
+          const { setStatus: T, setTransitionTaskId: E } = K.getState();
+          return T("POPPING"), E(a), ee(), window.history.back(), async () => {
+            s(i), T("COMPLETED");
           };
         },
         {
-          id: i,
+          id: a,
           control: {
             manual: !0
           }
@@ -547,11 +547,11 @@ function ze() {
   };
 }
 function Ke() {
-  const { routePath: n } = pt(), e = Ut(ie);
+  const { routePath: n } = mt(), e = Yt(oe);
   return {
-    pushStep: async (s) => {
+    pushStep: async (i) => {
       (await G.addTask(async () => {
-        const { pathname: a } = Tt(n, s);
+        const { pathname: s } = It(n, i);
         return window.history.state?.step || window.history.replaceState(
           {
             ...window.history.state,
@@ -563,60 +563,60 @@ function Ke() {
           {
             ...window.history.state,
             step: !0,
-            params: s
+            params: i
           },
           "",
-          a
-        ), async () => e({ type: "SET", params: s });
+          s
+        ), async () => e({ type: "SET", params: i });
       })).result?.();
     },
-    replaceStep: async (s) => {
+    replaceStep: async (i) => {
       (await G.addTask(async () => {
-        const { pathname: a } = Tt(n, s);
+        const { pathname: s } = It(n, i);
         return window.history.replaceState(
           {
             ...window.history.state,
             step: !0,
-            params: s
+            params: i
           },
           "",
-          a
-        ), async () => e({ type: "SET", params: s });
+          s
+        ), async () => e({ type: "SET", params: i });
       })).result?.();
     },
     popStep: async () => {
-      const s = G.generateTaskId();
+      const i = G.generateTaskId();
       (await G.addTask(
-        async (a) => {
-          const v = new Promise((C) => {
+        async (s) => {
+          const T = new Promise((C) => {
             window.addEventListener(
               "popstate",
-              (b) => C(b.state),
+              (D) => C(D.state),
               { once: !0 }
             );
           }), E = new Promise(
             (C) => setTimeout(() => C(void 0), 200)
           );
-          ne(), window.history.back();
-          const f = await Promise.race([
-            v,
+          ee(), window.history.back();
+          const m = await Promise.race([
+            T,
             E
           ]);
-          if (!f) {
-            a.abort();
+          if (!m) {
+            s.abort();
             return;
           }
-          if (f.step) {
-            e({ type: "SET", params: f.params ?? {} }), a.abort();
+          if (m.step) {
+            e({ type: "SET", params: m.params ?? {} }), s.abort();
             return;
           }
-          const { setStatus: x, setTransitionTaskId: h } = q.getState(), { index: R, popHistory: $ } = U.getState();
-          return x("POPPING"), h(s), async () => {
+          const { setStatus: x, setTransitionTaskId: y } = K.getState(), { index: R, popHistory: $ } = O.getState();
+          return x("POPPING"), y(i), async () => {
             $(R), x("COMPLETED");
           };
         },
         {
-          id: s,
+          id: i,
           control: {
             manual: !0
           }
@@ -626,32 +626,32 @@ function Ke() {
   };
 }
 function We() {
-  return Ut(oe);
+  return Yt(re);
 }
-function Ae({ freeze: n, children: e }) {
-  const o = N(e);
-  return n || (o.current = e), /* @__PURE__ */ L(
+function Ce({ freeze: n, children: e }) {
+  const r = L(e);
+  return n || (r.current = e), /* @__PURE__ */ N(
     "div",
     {
       style: {
         display: n ? "none" : void 0
       },
-      children: o.current
+      children: r.current
     }
   );
 }
-function He({ ref: n, style: e, ...o }) {
-  const { isActive: i, transitionName: u } = pt(), s = N(null);
-  he(n, () => s.current);
-  const a = q((x) => x.status), v = nt.get(u) ?? nt.get("none"), { decoratorName: E } = v, f = lt.get(E);
-  return f ? /* @__PURE__ */ L(
+function He({ ref: n, style: e, ...r }) {
+  const { isActive: a, transitionName: u } = mt(), i = L(null);
+  ye(n, () => i.current);
+  const s = K((x) => x.status), T = it.get(u) ?? it.get("none"), { decoratorName: E } = T, m = ft.get(E);
+  return m ? /* @__PURE__ */ N(
     "div",
     {
-      ref: s,
+      ref: i,
       "data-flemo-decorator": !0,
-      "data-flemo-decorator-name": f.name,
-      "data-flemo-status": a,
-      "data-flemo-active": i ? "true" : "false",
+      "data-flemo-decorator-name": m.name,
+      "data-flemo-status": s,
+      "data-flemo-active": a ? "true" : "false",
       style: {
         position: "absolute",
         top: 0,
@@ -662,332 +662,350 @@ function He({ ref: n, style: e, ...o }) {
         zIndex: 1,
         ...e
       },
-      ...o
+      ...r
     }
   ) : null;
 }
-const Qt = (n) => {
+const Jt = (n) => {
   let e;
-  const o = /* @__PURE__ */ new Set(), i = (f, x) => {
-    const h = typeof f == "function" ? f(e) : f;
-    if (!Object.is(h, e)) {
+  const r = /* @__PURE__ */ new Set(), a = (m, x) => {
+    const y = typeof m == "function" ? m(e) : m;
+    if (!Object.is(y, e)) {
       const R = e;
-      e = x ?? (typeof h != "object" || h === null) ? h : Object.assign({}, e, h), o.forEach(($) => $(e, R));
+      e = x ?? (typeof y != "object" || y === null) ? y : Object.assign({}, e, y), r.forEach(($) => $(e, R));
     }
-  }, u = () => e, v = { setState: i, getState: u, getInitialState: () => E, subscribe: (f) => (o.add(f), () => o.delete(f)) }, E = e = n(i, u, v);
-  return v;
-}, Oe = ((n) => n ? Qt(n) : Qt), Me = (n) => n;
-function Ge(n, e = Me) {
-  const o = gt.useSyncExternalStore(
+  }, u = () => e, T = { setState: a, getState: u, getInitialState: () => E, subscribe: (m) => (r.add(m), () => r.delete(m)) }, E = e = n(a, u, T);
+  return T;
+}, Me = ((n) => n ? Jt(n) : Jt), Oe = (n) => n;
+function Be(n, e = Oe) {
+  const r = Pt.useSyncExternalStore(
     n.subscribe,
-    gt.useCallback(() => e(n.getState()), [n, e]),
-    gt.useCallback(() => e(n.getInitialState()), [n, e])
+    Pt.useCallback(() => e(n.getState()), [n, e]),
+    Pt.useCallback(() => e(n.getInitialState()), [n, e])
   );
-  return gt.useDebugValue(o), o;
+  return Pt.useDebugValue(r), r;
 }
-const Zt = (n) => {
-  const e = Oe(n), o = (i) => Ge(e, i);
-  return Object.assign(o, e), o;
-}, Ue = ((n) => n ? Zt(n) : Zt), et = Ue((n) => ({
+const Qt = (n) => {
+  const e = Me(n), r = (a) => Be(e, a);
+  return Object.assign(r, e), r;
+}, Ue = ((n) => n ? Qt(n) : Qt), Q = Ue((n) => ({
   dragStatus: "IDLE",
   replaceTransitionStatus: "IDLE",
   sharedBars: {},
   setDragStatus: (e) => n({ dragStatus: e }),
   setReplaceTransitionStatus: (e) => n({ replaceTransitionStatus: e }),
-  registerSharedBars: (e, o) => n((i) => ({ sharedBars: { ...i.sharedBars, [e]: o } })),
-  unregisterSharedBars: (e) => n((o) => {
-    const i = { ...o.sharedBars };
-    return delete i[e], { sharedBars: i };
+  registerSharedBars: (e, r) => n((a) => ({ sharedBars: { ...a.sharedBars, [e]: r } })),
+  unregisterSharedBars: (e) => n((r) => {
+    const a = { ...r.sharedBars };
+    return delete a[e], { sharedBars: a };
   })
 }));
 let Ct = 0;
-function Ve() {
-  const [n, e] = vt(0), [o, i] = vt(0);
-  return at(() => {
+function Ge() {
+  const [n, e] = bt(0), [r, a] = bt(0);
+  return lt(() => {
     let u = 0;
-    const s = () => {
+    const i = () => {
       cancelAnimationFrame(u), u = requestAnimationFrame(() => {
-        let a = document.documentElement.scrollHeight - (window.visualViewport?.height || 0);
-        a = a < 0 ? 0 : a;
-        let v = a - Ct;
-        v = v < 0 ? 0 : v, Ct || (Ct = a), i(v), e(a);
+        let s = document.documentElement.scrollHeight - (window.visualViewport?.height || 0);
+        s = s < 0 ? 0 : s;
+        let T = s - Ct;
+        T = T < 0 ? 0 : T, Ct || (Ct = s), a(T), e(s);
       });
     };
-    return window.visualViewport?.addEventListener("resize", s), window.visualViewport?.addEventListener("scroll", s), () => {
-      cancelAnimationFrame(u), window.visualViewport?.removeEventListener("resize", s), window.visualViewport?.removeEventListener("scroll", s);
+    return window.visualViewport?.addEventListener("resize", i), window.visualViewport?.addEventListener("scroll", i), () => {
+      cancelAnimationFrame(u), window.visualViewport?.removeEventListener("resize", i), window.visualViewport?.removeEventListener("scroll", i);
     };
-  }, []), { viewportScrollHeight: n, changedViewportScrollHeight: o };
+  }, []), { viewportScrollHeight: n, changedViewportScrollHeight: r };
 }
-const Ye = (n) => typeof HTMLElement < "u" && n instanceof HTMLElement, St = (n, e) => {
+const Ye = (n) => typeof HTMLElement < "u" && n instanceof HTMLElement, Ut = /* @__PURE__ */ new WeakMap(), Zt = (n, e) => {
+  let r = Ut.get(n);
+  r || (r = /* @__PURE__ */ new Set(), Ut.set(n, r)), r.add(e);
+}, J = (n, e) => {
   n.style.transition = "";
-  {
-    n.style.removeProperty("transform"), n.style.removeProperty("opacity");
+  const r = Ut.get(n);
+  if (r && r.size > 0) {
+    for (const a of r)
+      n.style.removeProperty(a);
+    r.clear();
     return;
   }
-}, st = (n, e, o = {}) => {
+  n.style.removeProperty("transform"), n.style.removeProperty("opacity");
+}, ct = (n, e, r = {}) => {
   if (!Ye(n)) return Promise.resolve();
-  const i = n, u = Te(e);
+  const a = n, u = Te(e);
   if (u.length === 0) return Promise.resolve();
-  const s = typeof o.duration == "number" ? o.duration : 0, a = typeof o.delay == "number" && o.delay > 0 ? o.delay : 0, v = Ee(o.ease);
-  if (s <= 0 && a <= 0) {
-    i.style.transition = "none";
-    for (const f of u) i.style.setProperty(f.property, f.value);
+  const i = typeof r.duration == "number" ? r.duration : 0, s = typeof r.delay == "number" && r.delay > 0 ? r.delay : 0, T = Ee(r.ease);
+  if (i <= 0 && s <= 0) {
+    a.style.transition = "none";
+    for (const m of u)
+      a.style.setProperty(m.property, m.value), Zt(a, m.property);
     return Promise.resolve();
   }
-  const E = u.map((f) => `${f.property} ${s}s ${v} ${a}s`).join(", ");
-  i.style.transition = E, i.offsetWidth;
-  for (const f of u) i.style.setProperty(f.property, f.value);
-  return new Promise((f) => {
+  const E = u.map((m) => `${m.property} ${i}s ${T} ${s}s`).join(", ");
+  a.style.transition = E, a.offsetWidth;
+  for (const m of u)
+    a.style.setProperty(m.property, m.value), Zt(a, m.property);
+  return new Promise((m) => {
     let x = !1;
-    const h = () => {
-      x || (x = !0, i.removeEventListener("transitionend", R), f());
+    const y = () => {
+      x || (x = !0, a.removeEventListener("transitionend", R), m());
     }, R = ($) => {
-      $.target === i && h();
+      $.target === a && y();
     };
-    i.addEventListener("transitionend", R), setTimeout(h, (s + a) * 1e3 + 60);
+    a.addEventListener("transitionend", R), setTimeout(y, (i + s) * 1e3 + 60);
   });
-}, te = q, kt = "data-flemo-skip-animation";
-function _e({
+}, ut = K, pt = "data-flemo-skip-animation";
+function Ve({
   children: n,
   statusBarHeight: e,
-  statusBarColor: o,
-  systemNavigationBarHeight: i,
+  statusBarColor: r,
+  systemNavigationBarHeight: a,
   systemNavigationBarColor: u,
-  sharedAppBar: s,
-  sharedNavigationBar: a,
-  appBar: v,
+  sharedAppBar: i,
+  sharedNavigationBar: s,
+  appBar: T,
   navigationBar: E,
-  hideStatusBar: f,
+  hideStatusBar: m,
   hideSystemNavigationBar: x,
-  backgroundColor: h = "white",
+  backgroundColor: y = "white",
   contentScrollable: R = !0,
   ...$
 }) {
-  const { id: C, isActive: b, isRoot: X, zIndex: H, transitionName: _, prevTransitionName: dt } = pt(), O = te((t) => t.status), r = et((t) => t.dragStatus), c = et.getState().setDragStatus, m = et.getState().setReplaceTransitionStatus, p = U((t) => t.index), l = nt.get(_) ?? nt.get("none"), { initial: g, swipeDirection: d, decoratorName: P } = l, w = lt.get(P), { viewportScrollHeight: D } = Ve(), I = D > 0, [M, S] = vt(0), [k, V] = vt(0), Vt = N(null), B = N(null), J = N(null), Q = N(null), rt = N(null), z = N(!1), ct = N(!1), Z = N(!1), se = N(0), Et = N({ x: 0, y: 0 }), ft = N({ x: 0, y: 0 }), Pt = N(0), xt = N({ x: 0, y: 0 }), K = N({
+  const { id: C, isActive: D, isRoot: F, zIndex: M, transitionName: Y, prevTransitionName: ht } = mt(), B = ut((t) => t.status), o = Q((t) => t.dragStatus), c = Q.getState().setDragStatus, h = Q.getState().setReplaceTransitionStatus, d = O((t) => t.index), l = it.get(Y) ?? it.get("none"), { initial: g, swipeDirection: p, decoratorName: P } = l, w = ft.get(P), { viewportScrollHeight: I } = Ge(), b = I > 0, [U, S] = bt(0), [H, _] = bt(0), Vt = L(null), V = L(null), Z = L(null), q = L(null), st = L(null), W = L({
+    current: [],
+    prev: []
+  }), tt = L(!1), dt = L(!1), rt = L(!1), ae = L(0), Rt = L({ x: 0, y: 0 }), yt = L({ x: 0, y: 0 }), Dt = L(0), Lt = L({ x: 0, y: 0 }), et = L({
     element: null,
     hasMarker: !1
-  }), tt = N({ element: null, hasMarker: !1 }), It = N(0), Dt = N(0), Rt = N(null), bt = N(null), Lt = (t) => {
-    const y = ft.current;
+  }), ot = L({ element: null, hasMarker: !1 }), Nt = L(0), $t = L(0), gt = L(null), wt = L(null), At = (t) => {
+    const f = yt.current;
     return {
       point: { x: t.clientX, y: t.clientY },
       offset: {
-        x: t.clientX - Et.current.x,
-        y: t.clientY - Et.current.y
+        x: t.clientX - Rt.current.x,
+        y: t.clientY - Rt.current.y
       },
-      delta: { x: t.clientX - y.x, y: t.clientY - y.y },
-      velocity: xt.current
+      delta: { x: t.clientX - f.x, y: t.clientY - f.y },
+      velocity: Lt.current
     };
-  }, ae = (t) => {
-    const y = t.timeStamp, T = Math.max(1, y - Pt.current), A = ft.current;
-    xt.current = {
-      x: (t.clientX - A.x) / T * 1e3,
-      y: (t.clientY - A.y) / T * 1e3
-    }, ft.current = { x: t.clientX, y: t.clientY }, Pt.current = y;
-  }, mt = async (t) => {
-    if (!d || D > 10) return;
-    const y = B.current;
-    if (!y) return;
-    const T = Vt.current?.parentElement?.previousElementSibling;
-    if (J.current = T?.querySelector("[data-flemo-screen]") ?? null, rt.current = T?.querySelector("[data-flemo-decorator]") ?? null, !J.current) return;
-    Z.current = !0, se.current = t.timeStamp, Et.current = { x: t.clientX, y: t.clientY }, ft.current = { x: t.clientX, y: t.clientY }, Pt.current = t.timeStamp, xt.current = { x: 0, y: 0 }, y.setPointerCapture(t.pointerId), await l?.onSwipeStart(t, Lt(t), {
-      animate: st,
-      currentScreen: y,
-      prevScreen: J.current,
-      onStart: (W) => w?.onSwipeStart?.(W, {
-        animate: st,
-        currentDecorator: Q.current,
-        prevDecorator: rt.current
+  }, ie = (t) => {
+    const f = t.timeStamp, v = Math.max(1, f - Dt.current), k = yt.current;
+    Lt.current = {
+      x: (t.clientX - k.x) / v * 1e3,
+      y: (t.clientY - k.y) / v * 1e3
+    }, yt.current = { x: t.clientX, y: t.clientY }, Dt.current = f;
+  }, kt = (t, f, v) => {
+    const k = ct(t, f, v);
+    if (t === V.current)
+      for (const A of W.current.current)
+        ct(A, f, v);
+    else if (t === Z.current)
+      for (const A of W.current.prev)
+        ct(A, f, v);
+    return k;
+  }, se = (t) => {
+    const f = D ? O.getState().histories[d - 1]?.id : O.getState().histories[d]?.id, v = f ? Q.getState().sharedBars[f] : void 0, k = [], A = gt.current, at = wt.current;
+    A && vt && !v?.appBar && k.push(A), at && Tt && !v?.navigationBar && k.push(at);
+    const X = [];
+    if (t) {
+      const nt = t.querySelector('[data-flemo-bar="app"]'), Ft = t.querySelector('[data-flemo-bar="nav"]');
+      nt && !vt && X.push(nt), Ft && !Tt && X.push(Ft);
+    }
+    W.current = { current: k, prev: X };
+    const Et = be(l).join(", ");
+    for (const nt of k) nt.style.willChange = Et;
+    for (const nt of X) nt.style.willChange = Et;
+  }, _t = () => {
+    for (const t of W.current.current)
+      J(t), t.style.removeProperty("will-change");
+    for (const t of W.current.prev)
+      J(t), t.style.removeProperty("will-change");
+    W.current = { current: [], prev: [] };
+  }, St = async (t) => {
+    if (!p || I > 10) return;
+    const f = V.current;
+    if (!f) return;
+    const v = Vt.current?.parentElement?.previousElementSibling;
+    if (Z.current = v?.querySelector("[data-flemo-screen]") ?? null, st.current = v?.querySelector("[data-flemo-decorator]") ?? null, !Z.current) return;
+    rt.current = !0, ae.current = t.timeStamp, Rt.current = { x: t.clientX, y: t.clientY }, yt.current = { x: t.clientX, y: t.clientY }, Dt.current = t.timeStamp, Lt.current = { x: 0, y: 0 }, f.setPointerCapture(t.pointerId), se(v), await l?.onSwipeStart(t, At(t), {
+      animate: kt,
+      currentScreen: f,
+      prevScreen: Z.current,
+      onStart: (A) => w?.onSwipeStart?.(A, {
+        animate: ct,
+        currentDecorator: q.current,
+        prevDecorator: st.current
       })
-    }) ? c("PENDING") : (c("IDLE"), Z.current = !1);
+    }) ? c("PENDING") : (c("IDLE"), rt.current = !1, _t());
   }, ce = (t) => {
-    !d || !Z.current || D > 10 || (ae(t), l.onSwipe(t, Lt(t), {
-      animate: st,
-      currentScreen: B.current,
-      prevScreen: J.current,
-      onProgress: (y, T) => w?.onSwipe?.(y, T, {
-        animate: st,
-        currentDecorator: Q.current,
-        prevDecorator: rt.current
+    !p || !rt.current || I > 10 || (ie(t), l.onSwipe(t, At(t), {
+      animate: kt,
+      currentScreen: V.current,
+      prevScreen: Z.current,
+      onProgress: (f, v) => w?.onSwipe?.(f, v, {
+        animate: ct,
+        currentDecorator: q.current,
+        prevDecorator: st.current
       })
     }));
   }, ue = async (t) => {
-    if (!d || !Z.current) return;
-    Z.current = !1;
-    const y = B.current;
-    y && y.hasPointerCapture(t.pointerId) && y.releasePointerCapture(t.pointerId);
-    const T = Lt(t);
-    await l?.onSwipeEnd(t, T, {
-      animate: st,
-      currentScreen: B.current,
-      prevScreen: J.current,
-      onStart: (W) => w?.onSwipeEnd?.(W, {
-        animate: st,
-        currentDecorator: Q.current,
-        prevDecorator: rt.current
+    if (!p || !rt.current) return;
+    rt.current = !1;
+    const f = V.current;
+    f && f.hasPointerCapture(t.pointerId) && f.releasePointerCapture(t.pointerId);
+    const v = At(t);
+    if (await l?.onSwipeEnd(t, v, {
+      animate: kt,
+      currentScreen: V.current,
+      prevScreen: Z.current,
+      onStart: (A) => w?.onSwipeEnd?.(A, {
+        animate: ct,
+        currentDecorator: q.current,
+        prevDecorator: st.current
       })
-    }) ? (B.current?.setAttribute(kt, "true"), Q.current?.setAttribute(kt, "true"), window.history.back()) : (St(B.current), J.current && St(J.current), Q.current && St(Q.current), rt.current && St(rt.current), c("IDLE"));
+    })) {
+      V.current?.setAttribute(pt, "true"), q.current?.setAttribute(pt, "true");
+      for (const A of W.current.current)
+        A.style.removeProperty("will-change");
+      for (const A of W.current.prev)
+        J(A), A.style.removeProperty("will-change");
+      W.current = { current: [], prev: [] }, window.history.back();
+    } else
+      J(V.current), Z.current && J(Z.current), q.current && J(q.current), st.current && J(st.current), _t(), c("IDLE");
   }, le = (t) => {
-    if (!(!X && b && O === "COMPLETED" && r === "IDLE" && !!d && D < 10))
+    if (!(!F && D && B === "COMPLETED" && o === "IDLE" && !!p && I < 10))
       return;
-    K.current = zt(t.target, {
+    et.current = qt(t.target, {
       direction: "x",
       verifyByScroll: !0
-    }), tt.current = zt(t.target, {
+    }), ot.current = qt(t.target, {
       direction: "y",
       verifyByScroll: !0
-    }), It.current = t.clientX, Dt.current = t.clientY, (!K.current.element && !tt.current.element || K.current.element || tt.current.element) && (z.current = !0);
-  }, pe = (t) => {
-    if (D > 10)
+    }), Nt.current = t.clientX, $t.current = t.clientY, (!et.current.element && !ot.current.element || et.current.element || ot.current.element) && (tt.current = !0);
+  }, de = (t) => {
+    if (I > 10)
       return;
-    if (Z.current) {
+    if (rt.current) {
       ce(t.nativeEvent);
       return;
     }
-    const y = !K.current.element && !tt.current.element;
-    if (z.current && y) {
-      z.current = !1, ct.current = !0;
-      const T = t.clientY - Dt.current, A = t.clientX - It.current;
-      (d === "y" && T > 0 || d === "x" && A > 0) && mt(t.nativeEvent);
-    } else if (z.current && !y) {
-      const T = t.clientX - It.current, A = t.clientY - Dt.current, W = tt.current.element && tt.current.element.scrollTop <= 0, ot = K.current.element && K.current.element.scrollLeft <= 0 && K.current.hasMarker;
-      (d === "y" && (W || K.current.element) && A > 0 && Math.abs(T) < 2 || d === "x" && (ot || tt.current.element) && T > 0 && Math.abs(A) < 2) && (z.current = !1, ct.current = !0, mt(t.nativeEvent));
+    const f = !et.current.element && !ot.current.element;
+    if (tt.current && f) {
+      tt.current = !1, dt.current = !0;
+      const v = t.clientY - $t.current, k = t.clientX - Nt.current;
+      (p === "y" && v > 0 || p === "x" && k > 0) && St(t.nativeEvent);
+    } else if (tt.current && !f) {
+      const v = t.clientX - Nt.current, k = t.clientY - $t.current, A = ot.current.element && ot.current.element.scrollTop <= 0, at = et.current.element && et.current.element.scrollLeft <= 0 && et.current.hasMarker;
+      (p === "y" && (A || et.current.element) && k > 0 && Math.abs(v) < 2 || p === "x" && (at || ot.current.element) && v > 0 && Math.abs(k) < 2) && (tt.current = !1, dt.current = !0, St(t.nativeEvent));
     }
-  }, Yt = (t) => {
-    z.current = !1, ct.current = !1, Z.current && ue(t.nativeEvent);
+  }, jt = (t) => {
+    tt.current = !1, dt.current = !1, rt.current && ue(t.nativeEvent);
   };
-  at(() => {
-    const t = B.current;
+  lt(() => {
+    const t = V.current;
     if (!t) return;
-    const y = (T) => {
-      ct.current && T.preventDefault(), T.target?.dataset.swipeAtEdgeBar === "true" && T.preventDefault();
+    const f = (v) => {
+      dt.current && v.preventDefault(), v.target?.dataset.swipeAtEdgeBar === "true" && v.preventDefault();
     };
-    return t.addEventListener("touchmove", y, {
+    return t.addEventListener("touchmove", f, {
       passive: !1
     }), () => {
-      t.removeEventListener("touchmove", y);
+      t.removeEventListener("touchmove", f);
     };
-  }, []), at(() => {
-    if (!b) {
-      O === "REPLACING" && dt !== _ && m("PENDING");
+  }, []), lt(() => {
+    if (!D) {
+      B === "REPLACING" && ht !== Y && h("PENDING");
       return;
     }
-    if (O === "COMPLETED") {
-      c("IDLE"), m("IDLE");
+    if (B === "COMPLETED") {
+      c("IDLE"), h("IDLE"), V.current && (J(V.current), V.current.removeAttribute(pt)), q.current && (J(q.current), q.current.removeAttribute(pt));
       return;
     }
-    if (O === "IDLE") return;
-    const t = B.current;
+    if (B === "IDLE") return;
+    const t = V.current;
     if (!t) return;
-    const y = () => {
-      const j = te.getState().transitionTaskId;
-      j && G.resolveTask(j);
-    }, T = `${O}-true`;
-    if (!(!(t.getAttribute(kt) === "true") && Pe(l, T))) {
-      queueMicrotask(y);
+    const f = () => {
+      const z = ut.getState().transitionTaskId;
+      z && G.resolveTask(z);
+    }, v = `${B}-true`;
+    if (!(!(t.getAttribute(pt) === "true") && Pe(l, v))) {
+      queueMicrotask(f);
       return;
     }
-    const ot = xe("screen", _, T), it = (j) => {
-      j.target === t && j.animationName === ot && (t.removeEventListener("animationend", it), y());
+    const at = xe("screen", Y, v), X = (z) => {
+      z.target === t && z.animationName === at && (t.removeEventListener("animationend", X), f());
     };
-    return t.addEventListener("animationend", it), () => {
-      t.removeEventListener("animationend", it);
+    return t.addEventListener("animationend", X), () => {
+      t.removeEventListener("animationend", X);
     };
   }, [
-    O,
-    b,
+    B,
+    D,
     C,
-    dt,
-    _,
+    ht,
+    Y,
     l,
     c,
-    m
-  ]), wt(() => {
-    const t = Rt.current;
+    h
+  ]), xt(() => {
+    const t = gt.current;
     if (!t) {
       S(0);
       return;
     }
     S(t.offsetHeight);
-    const y = new ResizeObserver(([T]) => {
-      S(T.contentRect.height);
+    const f = new ResizeObserver(([v]) => {
+      S(v.contentRect.height);
     });
-    return y.observe(t), () => {
-      y.disconnect();
+    return f.observe(t), () => {
+      f.disconnect();
     };
-  }, [s]), wt(() => {
-    const t = bt.current;
+  }, [i]), xt(() => {
+    const t = wt.current;
     if (!t) {
-      V(0);
+      _(0);
       return;
     }
-    V(t.offsetHeight);
-    const y = new ResizeObserver(([T]) => {
-      V(T.contentRect.height);
+    _(t.offsetHeight);
+    const f = new ResizeObserver(([v]) => {
+      _(v.contentRect.height);
     });
-    return y.observe(t), () => {
-      y.disconnect();
+    return f.observe(t), () => {
+      f.disconnect();
     };
-  }, [a]), wt(() => {
-    const { registerSharedBars: t, unregisterSharedBars: y } = et.getState();
+  }, [s]), xt(() => {
+    const { registerSharedBars: t, unregisterSharedBars: f } = Q.getState();
     return t(C, {
-      appBar: !!s,
-      navigationBar: !!a
-    }), () => y(C);
-  }, [C, s, a]);
-  const _t = O === "PUSHING" || O === "POPPING" || O === "REPLACING" || r === "PENDING", jt = b || H === p - 1, $t = !!s, Nt = !!a;
-  wt(() => {
-    if (!_t || !jt || !$t && !Nt) return;
-    const t = B.current;
-    if (!t) return;
-    const y = Rt.current, T = bt.current, A = Ie(l);
-    if (A.length === 0) return;
-    const W = A.join(", "), ot = (F) => {
-      F && (F.style.willChange = W);
-    }, it = (F) => {
-      F && F.style.removeProperty("will-change");
-    };
-    ot(y), ot(T);
-    const j = (F) => {
-      if (F)
-        for (const yt of A)
-          F.style.removeProperty(yt);
-    };
-    let Ft = 0;
-    const Xt = () => {
-      const F = b ? U.getState().histories[p - 1]?.id : U.getState().histories[p]?.id, yt = F ? et.getState().sharedBars[F] : void 0, Bt = $t && !yt?.appBar, qt = Nt && !yt?.navigationBar, ht = Bt || qt ? getComputedStyle(t) : null;
-      if (y)
-        if (Bt && ht)
-          for (const ut of A)
-            y.style.setProperty(ut, ht.getPropertyValue(ut));
-        else
-          j(y);
-      if (T)
-        if (qt && ht)
-          for (const ut of A)
-            T.style.setProperty(ut, ht.getPropertyValue(ut));
-        else
-          j(T);
-      Ft = requestAnimationFrame(Xt);
+      appBar: !!i,
+      navigationBar: !!s
+    }), () => f(C);
+  }, [C, i, s]);
+  const Xt = D || M === d - 1, vt = !!i, Tt = !!s;
+  xt(() => {
+    const t = gt.current, f = wt.current;
+    if (!t && !f) return;
+    const v = () => {
+      if (!(ut.getState().status === "PUSHING" || ut.getState().status === "POPPING" || ut.getState().status === "REPLACING") || !Xt) {
+        t?.removeAttribute("data-flemo-bar-riding"), f?.removeAttribute("data-flemo-bar-riding");
+        return;
+      }
+      const X = D ? O.getState().histories[d - 1]?.id : O.getState().histories[d]?.id, z = X ? Q.getState().sharedBars[X] : void 0, Et = vt && !z?.appBar, nt = Tt && !z?.navigationBar;
+      t && t.setAttribute("data-flemo-bar-riding", Et ? "true" : "false"), f && f.setAttribute("data-flemo-bar-riding", nt ? "true" : "false");
     };
-    return Xt(), () => {
-      cancelAnimationFrame(Ft), j(y), j(T), it(y), it(T);
+    v();
+    const k = Q.subscribe(v), A = ut.subscribe(v);
+    return () => {
+      k(), A(), t?.removeAttribute("data-flemo-bar-riding"), f?.removeAttribute("data-flemo-bar-riding");
     };
-  }, [
-    _t,
-    jt,
-    $t,
-    Nt,
-    b,
-    p,
-    l
-  ]);
-  const de = (() => {
-    if (!b) return {};
-    if (O !== "PUSHING" && O !== "REPLACING") return {};
+  }, [Xt, D, d, vt, Tt]);
+  const pe = (() => {
+    if (!D) return {};
+    if (B !== "PUSHING" && B !== "REPLACING") return {};
     const t = {};
     return typeof g.x == "number" && (t.transform = `translateX(${g.x}px)`), typeof g.x == "string" && (t.transform = `translateX(${g.x})`), typeof g.y == "number" && (t.transform = `translateY(${g.y}px)`), typeof g.y == "string" && (t.transform = `translateY(${g.y})`), typeof g.opacity == "number" && (t.opacity = `${g.opacity}`), t;
   })();
-  return /* @__PURE__ */ At(
+  return /* @__PURE__ */ Ht(
     "div",
     {
       ref: Vt,
@@ -1008,7 +1026,7 @@ function _e({
         overscrollBehavior: "contain"
       },
       children: [
-        /* @__PURE__ */ L(
+        /* @__PURE__ */ N(
           "div",
           {
             "data-swipe-at-edge-bar": !0,
@@ -1022,31 +1040,31 @@ function _e({
             }
           }
         ),
-        /* @__PURE__ */ At(
+        /* @__PURE__ */ Ht(
           "div",
           {
-            ref: B,
+            ref: V,
             ...$,
             onPointerDown: le,
-            onPointerMove: pe,
-            onPointerUp: Yt,
-            onPointerCancel: Yt,
+            onPointerMove: de,
+            onPointerUp: jt,
+            onPointerCancel: jt,
             "data-flemo-screen": !0,
-            "data-flemo-transition": _,
-            "data-flemo-status": O,
-            "data-flemo-active": b ? "true" : "false",
+            "data-flemo-transition": Y,
+            "data-flemo-status": B,
+            "data-flemo-active": D ? "true" : "false",
             style: {
               display: "flex",
               flexDirection: "column",
               height: "100%",
-              backgroundColor: h,
+              backgroundColor: y,
               overflowY: R ? void 0 : "auto",
-              touchAction: d === "x" ? "pan-y" : d === "y" ? "pan-x" : "auto",
-              ...de,
+              touchAction: p === "x" ? "pan-y" : p === "y" ? "pan-x" : "auto",
+              ...pe,
               ...$.style
             },
             children: [
-              !f && e && /* @__PURE__ */ L("div", { style: { minHeight: e }, children: /* @__PURE__ */ L(
+              !m && e && /* @__PURE__ */ N("div", { style: { minHeight: e }, children: /* @__PURE__ */ N(
                 "div",
                 {
                   style: {
@@ -1054,21 +1072,21 @@ function _e({
                     top: 0,
                     width: "100%",
                     minHeight: e,
-                    backgroundColor: o
+                    backgroundColor: r
                   }
                 }
               ) }),
-              s && /* @__PURE__ */ L(
+              i && /* @__PURE__ */ N(
                 "div",
                 {
                   style: {
                     width: "100%",
-                    minHeight: M
+                    minHeight: U
                   }
                 }
               ),
-              v,
-              /* @__PURE__ */ L(
+              T,
+              /* @__PURE__ */ N(
                 "div",
                 {
                   style: {
@@ -1081,31 +1099,31 @@ function _e({
                 }
               ),
               E,
-              a && /* @__PURE__ */ L(
+              s && /* @__PURE__ */ N(
                 "div",
                 {
                   style: {
-                    display: I ? "none" : void 0,
+                    display: b ? "none" : void 0,
                     width: "100%",
-                    minHeight: k
+                    minHeight: H
                   }
                 }
               ),
-              !x && i && /* @__PURE__ */ L(
+              !x && a && /* @__PURE__ */ N(
                 "div",
                 {
                   style: {
-                    display: I ? "none" : void 0,
-                    minHeight: i
+                    display: b ? "none" : void 0,
+                    minHeight: a
                   },
-                  children: /* @__PURE__ */ L(
+                  children: /* @__PURE__ */ N(
                     "div",
                     {
                       style: {
                         position: "fixed",
                         bottom: 0,
                         width: "100%",
-                        minHeight: i,
+                        minHeight: a,
                         backgroundColor: u
                       }
                     }
@@ -1115,37 +1133,45 @@ function _e({
             ]
           }
         ),
-        s && /* @__PURE__ */ L(
+        i && /* @__PURE__ */ N(
           "div",
           {
-            ref: Rt,
+            ref: gt,
+            "data-flemo-bar": "app",
+            "data-flemo-bar-transition": Y,
+            "data-flemo-bar-status": B,
+            "data-flemo-bar-active": D ? "true" : "false",
             style: {
               position: "fixed",
-              top: f ? 0 : e,
+              top: m ? 0 : e,
               left: 0,
               width: "100%",
               zIndex: 1
             },
-            children: s
+            children: i
           }
         ),
-        a && /* @__PURE__ */ L(
+        s && /* @__PURE__ */ N(
           "div",
           {
-            ref: bt,
+            ref: wt,
+            "data-flemo-bar": "nav",
+            "data-flemo-bar-transition": Y,
+            "data-flemo-bar-status": B,
+            "data-flemo-bar-active": D ? "true" : "false",
             style: {
-              display: I ? "none" : void 0,
+              display: b ? "none" : void 0,
               position: "fixed",
-              bottom: x ? 0 : i,
+              bottom: x ? 0 : a,
               left: 0,
               width: "100%",
               zIndex: 1
             },
-            children: a
+            children: s
           }
         ),
-        w && /* @__PURE__ */ L(He, { ref: Q }),
-        /* @__PURE__ */ L(
+        w && /* @__PURE__ */ N(He, { ref: q }),
+        /* @__PURE__ */ N(
           "div",
           {
             "data-swipe-at-edge-bar": !0,
@@ -1164,25 +1190,25 @@ function _e({
   );
 }
 function Je({ children: n, ...e }) {
-  const { isActive: o, isPrev: i, zIndex: u } = pt(), s = U((h) => h.index), a = q((h) => h.status), v = et((h) => h.dragStatus), E = et((h) => h.replaceTransitionStatus), x = !o && (a === "COMPLETED" && v === "IDLE") || i && s - 2 <= u && E === "IDLE" || i && s - 2 > u;
-  return /* @__PURE__ */ L(Ae, { freeze: x, children: /* @__PURE__ */ L(_e, { ...e, children: n }) });
+  const { isActive: r, isPrev: a, zIndex: u } = mt(), i = O((y) => y.index), s = K((y) => y.status), T = Q((y) => y.dragStatus), E = Q((y) => y.replaceTransitionStatus), x = !r && (s === "COMPLETED" && T === "IDLE") || a && i - 2 <= u && E === "IDLE" || a && i - 2 > u;
+  return /* @__PURE__ */ N(Ce, { freeze: x, children: /* @__PURE__ */ N(Ve, { ...e, children: n }) });
 }
 export {
   qe as Route,
-  Be as Router,
+  Fe as Router,
   Je as Screen,
-  re as ScreenContext,
+  ne as ScreenContext,
   He as ScreenDecorator,
-  Ae as ScreenFreeze,
-  _e as ScreenMotion,
+  Ce as ScreenFreeze,
+  Ve as ScreenMotion,
   tn as createDecorator,
   en as createRawDecorator,
   nn as createRawTransition,
   rn as createTransition,
   ze as useNavigate,
   We as useParams,
-  pt as useScreen,
-  et as useScreenStore,
+  mt as useScreen,
+  Q as useScreenStore,
   Ke as useStep,
-  Ve as useViewportScrollHeight
+  Ge as useViewportScrollHeight
 };