@flemo/react 1.0.0

package/dist/index.mjs

@@ -0,0 +1,1188 @@
+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 { createDecorator as tn, createRawDecorator as en, createRawTransition as nn, createTransition as rn } from "@flemo/core";
+function De() {
+  return at(() => {
+    const n = async (e) => {
+      if (ge())
+        return;
+      const o = e.state?.id, i = 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) {
+            u.abort();
+            return;
+          }
+          return h(i), b ? x("POPPING") : X ? (x("PUSHING"), $({
+            id: o,
+            pathname: _,
+            params: v,
+            transitionName: E,
+            layoutId: f
+          })) : H && (x("REPLACING"), $({
+            id: o,
+            pathname: _,
+            params: v,
+            transitionName: E,
+            layoutId: f
+          })), async () => {
+            b && C(s + 1), x("COMPLETED");
+          };
+        },
+        {
+          id: i,
+          control: {
+            manual: !0
+          }
+        }
+      )).result?.();
+    };
+    return window.addEventListener("popstate", n), () => {
+      window.removeEventListener("popstate", n);
+    };
+  }, []), null;
+}
+var Y = {}, Kt;
+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, "\\$&");
+  }
+  function a(r) {
+    return r.replace(/[.+*?^${}()[\]|/\\]/g, "\\$&");
+  }
+  class v {
+    constructor(c, m) {
+      this.tokens = c, this.originalPath = m;
+    }
+  }
+  Y.TokenData = v;
+  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;
+    }
+  }
+  Y.PathError = E;
+  function f(r, c = {}) {
+    const { encodePath: m = e } = c, p = [...r];
+    let l = 0;
+    function g(d) {
+      const P = [];
+      let w = "";
+      function D() {
+        w && (P.push({
+          type: "text",
+          value: m(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++];
+          continue;
+        }
+        if (I === ":" || I === "*") {
+          const M = I === ":" ? "param" : "wildcard";
+          let S = "";
+          if (o.test(p[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;
+                break;
+              }
+              p[l] === "\\" && l++, S += p[l];
+            }
+            if (k)
+              throw new E(`Unterminated quote at index ${k}`, r);
+          }
+          if (!S)
+            throw new E(`Missing parameter name at index ${l}`, r);
+          D(), P.push({ type: M, name: S });
+          continue;
+        }
+        if (I === "{") {
+          D(), 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 (d)
+        throw new E(`Unexpected end at index ${l}, expected ${d}`, r);
+      return D(), P;
+    }
+    return new v(g(""), r);
+  }
+  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);
+    return function(P = {}) {
+      const w = [], D = g(P, w);
+      if (w.length)
+        throw new TypeError(`Missing parameters: ${w.join(", ")}`);
+      return D;
+    };
+  }
+  function h(r, c, m) {
+    const p = r.map((l) => R(l, c, m));
+    return (l, g) => {
+      let d = "";
+      for (const P of p)
+        d += P(l, g);
+      return d;
+    };
+  }
+  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, "");
+      };
+    }
+    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`);
+      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]);
+      }
+      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);
+    };
+  }
+  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));
+    return function(w) {
+      const D = l.exec(w);
+      if (!D)
+        return !1;
+      const I = D[0], M = /* @__PURE__ */ Object.create(null);
+      for (let S = 1; S < D.length; S++) {
+        if (D[S] === void 0)
+          continue;
+        const k = g[S - 1], V = d[S - 1];
+        M[k.name] = V(D[S]);
+      }
+      return { path: I, params: M };
+    };
+  }
+  function C(r, c = {}) {
+    const { delimiter: m = n, end: p = !0, sensitive: l = !1, trailing: g = !0 } = c, d = [];
+    let P = "", w = 0;
+    function D(M) {
+      if (Array.isArray(M)) {
+        for (const k of M)
+          D(k);
+        return;
+      }
+      const S = typeof M == "object" ? M : f(M, c);
+      b(S.tokens, 0, [], (k) => {
+        if (w >= 256)
+          throw new E("Too many path combinations", S.originalPath);
+        w > 0 && (P += "|"), P += X(k, m, d, 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 };
+  }
+  function b(r, c, m, p) {
+    for (; c < r.length; ) {
+      const l = r[c++];
+      if (l.type === "group") {
+        const g = m.length;
+        b(l.tokens, 0, m, (d) => b(r, c, d, p)), m.length = g;
+        continue;
+      }
+      m.push(l);
+    }
+    p(m);
+  }
+  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)
+          return !0;
+        if (V.type === "text" && V.value.includes(c))
+          break;
+      }
+      return !1;
+    }
+    function M(S) {
+      let k = "";
+      for (; S < r.length; ) {
+        const V = r[S++];
+        if (V.type !== "text")
+          break;
+        k += V.value;
+      }
+      return k;
+    }
+    for (; D < r.length; ) {
+      const S = r[D++];
+      if (S.type === "text") {
+        l += a(S.value), g += S.value, P === 2 && (d += 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 = "";
+        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 _(r, c) {
+    let m = "";
+    for (; c < r.length; ) {
+      const p = r[c++];
+      if (p.type === "text") {
+        m += s(p.value);
+        continue;
+      }
+      if (p.type === "group") {
+        m += "{" + _(p.tokens, 0) + "}";
+        continue;
+      }
+      if (p.type === "param") {
+        m += ":" + O(p.name, r[c]);
+        continue;
+      }
+      if (p.type === "wildcard") {
+        m += "*" + O(p.name, r[c]);
+        continue;
+      }
+      throw new TypeError(`Unknown token type: ${p.type}`);
+    }
+    return m;
+  }
+  function dt(r) {
+    return _(r.tokens, 0);
+  }
+  function O(r, c) {
+    return !u.test(r) || c?.type === "text" && i.test(c.value[0]) ? JSON.stringify(r) : r;
+  }
+  return Y;
+}
+var Mt = Re();
+const re = Gt({
+  id: "",
+  isActive: !1,
+  isRoot: !0,
+  isPrev: !1,
+  zIndex: 0,
+  pathname: "",
+  params: {},
+  transitionName: "none",
+  prevTransitionName: "none",
+  layoutId: null,
+  routePath: ""
+});
+function pt() {
+  return Ut(re);
+}
+const oe = Gt({}), ie = Gt(() => {
+});
+function be(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 || {} });
+      });
+    };
+    return e && window.addEventListener("popstate", s), () => {
+      window.removeEventListener("popstate", s);
+    };
+  }, [e, u]), /* @__PURE__ */ L(ie.Provider, { value: u, children: /* @__PURE__ */ L(oe.Provider, { value: i, 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
+      )
+    )
+  ).map(([i], u) => /* @__PURE__ */ L(
+    re.Provider,
+    {
+      value: {
+        id: o[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,
+        routePath: we(
+          i.props.path,
+          o[u].pathname
+        )
+      },
+      children: /* @__PURE__ */ L(Le, { children: i })
+    },
+    o[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);
+};
+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();
+    };
+  }, [n, e]);
+}
+const Ce = [], ke = [];
+function Be({
+  children: n,
+  initPath: e = "/",
+  defaultTransitionName: o = "cupertino",
+  transitions: i = Ce,
+  decorators: u = ke
+}) {
+  const s = Ht() ? e || "/" : window.location.pathname, a = Ht() ? s.split("?")[1] || "" : window.location.search;
+  return Ot.setState({
+    defaultTransitionName: o
+  }), U.setState({
+    index: 0,
+    histories: [
+      {
+        id: "root",
+        pathname: s,
+        params: ve(
+          ee.toArray(n).map((v) => v.props.path).flat(),
+          s,
+          a
+        ),
+        transitionName: o,
+        layoutId: null
+      }
+    ]
+  }), Ne(i, u), at(() => {
+    window.history.state?.index || window.history.replaceState(
+      {
+        id: "root",
+        index: 0,
+        status: "IDLE",
+        params: {},
+        transitionName: o,
+        layoutId: null
+      },
+      "",
+      window.location.href
+    );
+  }, [o]), /* @__PURE__ */ At(fe, { children: [
+    /* @__PURE__ */ L(De, {}),
+    /* @__PURE__ */ L($e, { 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 ze() {
+  return {
+    push: async (i, u, s) => {
+      const { status: a } = q.getState();
+      if (a !== "COMPLETED" && a !== "IDLE")
+        return;
+      const { index: v, addHistory: E } = U.getState(), f = Ot.getState().defaultTransitionName, { transitionName: x = f, layoutId: h = null } = s ?? {}, R = G.generateTaskId();
+      (await G.addTask(
+        async () => {
+          const { setStatus: $, setTransitionTaskId: C } = q.getState();
+          $("PUSHING"), C(R);
+          const { pathname: b, toPathname: X } = Tt(i, u ?? {});
+          return window.history.pushState(
+            {
+              id: R,
+              index: v + 1,
+              status: "PUSHING",
+              params: u,
+              transitionName: x,
+              layoutId: h
+            },
+            "",
+            b
+          ), E({
+            id: R,
+            pathname: X,
+            params: u ?? {},
+            transitionName: x,
+            layoutId: h
+          }), () => {
+            $("COMPLETED");
+          };
+        },
+        {
+          id: R,
+          control: {
+            manual: !0
+          }
+        }
+      )).result?.();
+    },
+    replace: async (i, u, s) => {
+      const { status: a } = q.getState();
+      if (a !== "COMPLETED" && a !== "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();
+      (await G.addTask(
+        async () => {
+          const { setStatus: C, setTransitionTaskId: b } = q.getState();
+          C("REPLACING"), b($);
+          const { pathname: X, toPathname: H } = Tt(i, u ?? {});
+          return window.history.replaceState(
+            {
+              id: $,
+              index: v,
+              status: "REPLACING",
+              params: u,
+              transitionName: h,
+              layoutId: R
+            },
+            "",
+            X
+          ), E({
+            id: $,
+            pathname: H,
+            params: u ?? {},
+            transitionName: h,
+            layoutId: R
+          }), async () => {
+            f(v), C("COMPLETED");
+          };
+        },
+        {
+          id: $,
+          control: {
+            manual: !0
+          }
+        }
+      )).result?.();
+    },
+    pop: async () => {
+      const i = G.generateTaskId();
+      (await G.addTask(
+        async (u) => {
+          const { index: s, popHistory: a } = U.getState();
+          if (s <= 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");
+          };
+        },
+        {
+          id: i,
+          control: {
+            manual: !0
+          }
+        }
+      )).result?.();
+    }
+  };
+}
+function Ke() {
+  const { routePath: n } = pt(), e = Ut(ie);
+  return {
+    pushStep: async (s) => {
+      (await G.addTask(async () => {
+        const { pathname: a } = Tt(n, s);
+        return window.history.state?.step || window.history.replaceState(
+          {
+            ...window.history.state,
+            step: !0
+          },
+          "",
+          window.location.pathname
+        ), window.history.pushState(
+          {
+            ...window.history.state,
+            step: !0,
+            params: s
+          },
+          "",
+          a
+        ), async () => e({ type: "SET", params: s });
+      })).result?.();
+    },
+    replaceStep: async (s) => {
+      (await G.addTask(async () => {
+        const { pathname: a } = Tt(n, s);
+        return window.history.replaceState(
+          {
+            ...window.history.state,
+            step: !0,
+            params: s
+          },
+          "",
+          a
+        ), async () => e({ type: "SET", params: s });
+      })).result?.();
+    },
+    popStep: async () => {
+      const s = G.generateTaskId();
+      (await G.addTask(
+        async (a) => {
+          const v = new Promise((C) => {
+            window.addEventListener(
+              "popstate",
+              (b) => C(b.state),
+              { once: !0 }
+            );
+          }), E = new Promise(
+            (C) => setTimeout(() => C(void 0), 200)
+          );
+          ne(), window.history.back();
+          const f = await Promise.race([
+            v,
+            E
+          ]);
+          if (!f) {
+            a.abort();
+            return;
+          }
+          if (f.step) {
+            e({ type: "SET", params: f.params ?? {} }), a.abort();
+            return;
+          }
+          const { setStatus: x, setTransitionTaskId: h } = q.getState(), { index: R, popHistory: $ } = U.getState();
+          return x("POPPING"), h(s), async () => {
+            $(R), x("COMPLETED");
+          };
+        },
+        {
+          id: s,
+          control: {
+            manual: !0
+          }
+        }
+      )).result?.();
+    }
+  };
+}
+function We() {
+  return Ut(oe);
+}
+function Ae({ freeze: n, children: e }) {
+  const o = N(e);
+  return n || (o.current = e), /* @__PURE__ */ L(
+    "div",
+    {
+      style: {
+        display: n ? "none" : void 0
+      },
+      children: o.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(
+    "div",
+    {
+      ref: s,
+      "data-flemo-decorator": !0,
+      "data-flemo-decorator-name": f.name,
+      "data-flemo-status": a,
+      "data-flemo-active": i ? "true" : "false",
+      style: {
+        position: "absolute",
+        top: 0,
+        left: 0,
+        width: "100%",
+        height: "100%",
+        pointerEvents: "none",
+        zIndex: 1,
+        ...e
+      },
+      ...o
+    }
+  ) : null;
+}
+const Qt = (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 = e;
+      e = x ?? (typeof h != "object" || h === null) ? h : Object.assign({}, e, h), o.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(
+    n.subscribe,
+    gt.useCallback(() => e(n.getState()), [n, e]),
+    gt.useCallback(() => e(n.getInitialState()), [n, e])
+  );
+  return gt.useDebugValue(o), o;
+}
+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) => ({
+  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 };
+  })
+}));
+let Ct = 0;
+function Ve() {
+  const [n, e] = vt(0), [o, i] = vt(0);
+  return at(() => {
+    let u = 0;
+    const s = () => {
+      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);
+      });
+    };
+    return window.visualViewport?.addEventListener("resize", s), window.visualViewport?.addEventListener("scroll", s), () => {
+      cancelAnimationFrame(u), window.visualViewport?.removeEventListener("resize", s), window.visualViewport?.removeEventListener("scroll", s);
+    };
+  }, []), { viewportScrollHeight: n, changedViewportScrollHeight: o };
+}
+const Ye = (n) => typeof HTMLElement < "u" && n instanceof HTMLElement, St = (n, e) => {
+  n.style.transition = "";
+  {
+    n.style.removeProperty("transform"), n.style.removeProperty("opacity");
+    return;
+  }
+}, st = (n, e, o = {}) => {
+  if (!Ye(n)) return Promise.resolve();
+  const i = 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);
+    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) => {
+    let x = !1;
+    const h = () => {
+      x || (x = !0, i.removeEventListener("transitionend", R), f());
+    }, R = ($) => {
+      $.target === i && h();
+    };
+    i.addEventListener("transitionend", R), setTimeout(h, (s + a) * 1e3 + 60);
+  });
+}, te = q, kt = "data-flemo-skip-animation";
+function _e({
+  children: n,
+  statusBarHeight: e,
+  statusBarColor: o,
+  systemNavigationBarHeight: i,
+  systemNavigationBarColor: u,
+  sharedAppBar: s,
+  sharedNavigationBar: a,
+  appBar: v,
+  navigationBar: E,
+  hideStatusBar: f,
+  hideSystemNavigationBar: x,
+  backgroundColor: h = "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({
+    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;
+    return {
+      point: { x: t.clientX, y: t.clientY },
+      offset: {
+        x: t.clientX - Et.current.x,
+        y: t.clientY - Et.current.y
+      },
+      delta: { x: t.clientX - y.x, y: t.clientY - y.y },
+      velocity: xt.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
+      })
+    }) ? c("PENDING") : (c("IDLE"), Z.current = !1);
+  }, 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
+      })
+    }));
+  }, 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
+      })
+    }) ? (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"));
+  }, le = (t) => {
+    if (!(!X && b && O === "COMPLETED" && r === "IDLE" && !!d && D < 10))
+      return;
+    K.current = zt(t.target, {
+      direction: "x",
+      verifyByScroll: !0
+    }), tt.current = zt(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)
+      return;
+    if (Z.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));
+    }
+  }, Yt = (t) => {
+    z.current = !1, ct.current = !1, Z.current && ue(t.nativeEvent);
+  };
+  at(() => {
+    const t = B.current;
+    if (!t) return;
+    const y = (T) => {
+      ct.current && T.preventDefault(), T.target?.dataset.swipeAtEdgeBar === "true" && T.preventDefault();
+    };
+    return t.addEventListener("touchmove", y, {
+      passive: !1
+    }), () => {
+      t.removeEventListener("touchmove", y);
+    };
+  }, []), at(() => {
+    if (!b) {
+      O === "REPLACING" && dt !== _ && m("PENDING");
+      return;
+    }
+    if (O === "COMPLETED") {
+      c("IDLE"), m("IDLE");
+      return;
+    }
+    if (O === "IDLE") return;
+    const t = B.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);
+      return;
+    }
+    const ot = xe("screen", _, T), it = (j) => {
+      j.target === t && j.animationName === ot && (t.removeEventListener("animationend", it), y());
+    };
+    return t.addEventListener("animationend", it), () => {
+      t.removeEventListener("animationend", it);
+    };
+  }, [
+    O,
+    b,
+    C,
+    dt,
+    _,
+    l,
+    c,
+    m
+  ]), wt(() => {
+    const t = Rt.current;
+    if (!t) {
+      S(0);
+      return;
+    }
+    S(t.offsetHeight);
+    const y = new ResizeObserver(([T]) => {
+      S(T.contentRect.height);
+    });
+    return y.observe(t), () => {
+      y.disconnect();
+    };
+  }, [s]), wt(() => {
+    const t = bt.current;
+    if (!t) {
+      V(0);
+      return;
+    }
+    V(t.offsetHeight);
+    const y = new ResizeObserver(([T]) => {
+      V(T.contentRect.height);
+    });
+    return y.observe(t), () => {
+      y.disconnect();
+    };
+  }, [a]), wt(() => {
+    const { registerSharedBars: t, unregisterSharedBars: y } = et.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);
+    };
+    return Xt(), () => {
+      cancelAnimationFrame(Ft), j(y), j(T), it(y), it(T);
+    };
+  }, [
+    _t,
+    jt,
+    $t,
+    Nt,
+    b,
+    p,
+    l
+  ]);
+  const de = (() => {
+    if (!b) return {};
+    if (O !== "PUSHING" && O !== "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(
+    "div",
+    {
+      ref: Vt,
+      style: {
+        position: "fixed",
+        top: 0,
+        left: 0,
+        width: "100%",
+        height: "100%",
+        display: "flex",
+        // `contain: layout style` keeps layout/style scoped without `paint`,
+        // which would make this element the containing block for `position:
+        // fixed` descendants and trap consumer overlays (e.g. bottom sheets)
+        // inside the screen.
+        contain: "layout style",
+        flexDirection: "column",
+        boxSizing: "border-box",
+        overscrollBehavior: "contain"
+      },
+      children: [
+        /* @__PURE__ */ L(
+          "div",
+          {
+            "data-swipe-at-edge-bar": !0,
+            style: {
+              position: "fixed",
+              top: 0,
+              left: 0,
+              width: 8,
+              height: "100%",
+              zIndex: 1
+            }
+          }
+        ),
+        /* @__PURE__ */ At(
+          "div",
+          {
+            ref: B,
+            ...$,
+            onPointerDown: le,
+            onPointerMove: pe,
+            onPointerUp: Yt,
+            onPointerCancel: Yt,
+            "data-flemo-screen": !0,
+            "data-flemo-transition": _,
+            "data-flemo-status": O,
+            "data-flemo-active": b ? "true" : "false",
+            style: {
+              display: "flex",
+              flexDirection: "column",
+              height: "100%",
+              backgroundColor: h,
+              overflowY: R ? void 0 : "auto",
+              touchAction: d === "x" ? "pan-y" : d === "y" ? "pan-x" : "auto",
+              ...de,
+              ...$.style
+            },
+            children: [
+              !f && e && /* @__PURE__ */ L("div", { style: { minHeight: e }, children: /* @__PURE__ */ L(
+                "div",
+                {
+                  style: {
+                    position: "fixed",
+                    top: 0,
+                    width: "100%",
+                    minHeight: e,
+                    backgroundColor: o
+                  }
+                }
+              ) }),
+              s && /* @__PURE__ */ L(
+                "div",
+                {
+                  style: {
+                    width: "100%",
+                    minHeight: M
+                  }
+                }
+              ),
+              v,
+              /* @__PURE__ */ L(
+                "div",
+                {
+                  style: {
+                    display: "flex",
+                    flexDirection: "column",
+                    flexGrow: 1,
+                    overflowY: R ? "auto" : void 0
+                  },
+                  children: n
+                }
+              ),
+              E,
+              a && /* @__PURE__ */ L(
+                "div",
+                {
+                  style: {
+                    display: I ? "none" : void 0,
+                    width: "100%",
+                    minHeight: k
+                  }
+                }
+              ),
+              !x && i && /* @__PURE__ */ L(
+                "div",
+                {
+                  style: {
+                    display: I ? "none" : void 0,
+                    minHeight: i
+                  },
+                  children: /* @__PURE__ */ L(
+                    "div",
+                    {
+                      style: {
+                        position: "fixed",
+                        bottom: 0,
+                        width: "100%",
+                        minHeight: i,
+                        backgroundColor: u
+                      }
+                    }
+                  )
+                }
+              )
+            ]
+          }
+        ),
+        s && /* @__PURE__ */ L(
+          "div",
+          {
+            ref: Rt,
+            style: {
+              position: "fixed",
+              top: f ? 0 : e,
+              left: 0,
+              width: "100%",
+              zIndex: 1
+            },
+            children: s
+          }
+        ),
+        a && /* @__PURE__ */ L(
+          "div",
+          {
+            ref: bt,
+            style: {
+              display: I ? "none" : void 0,
+              position: "fixed",
+              bottom: x ? 0 : i,
+              left: 0,
+              width: "100%",
+              zIndex: 1
+            },
+            children: a
+          }
+        ),
+        w && /* @__PURE__ */ L(He, { ref: Q }),
+        /* @__PURE__ */ L(
+          "div",
+          {
+            "data-swipe-at-edge-bar": !0,
+            style: {
+              position: "fixed",
+              top: 0,
+              right: 0,
+              width: 8,
+              height: "100%",
+              zIndex: 1
+            }
+          }
+        )
+      ]
+    }
+  );
+}
+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 }) });
+}
+export {
+  qe as Route,
+  Be as Router,
+  Je as Screen,
+  re as ScreenContext,
+  He as ScreenDecorator,
+  Ae as ScreenFreeze,
+  _e 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,
+  Ke as useStep,
+  Ve as useViewportScrollHeight
+};