@lazycatcloud/vue-router-stack 0.0.7 → 0.0.8

package/dist/vue-router-stack.js

@@ -1,16 +1,167 @@
-import { shallowRef as te, getCurrentInstance as ie, inject as C, defineComponent as Y, h as y, computed as U, ref as G, provide as ue, watch as le, onUnmounted as de, nextTick as fe, onMounted as he } from "vue";
-import { createRouter as me, useRoute as ye, routeLocationKey as ke, matchedRouteKey as v } from "vue-router";
-import { RouterLink as je, RouterView as Me, createMemoryHistory as Ue, createWebHashHistory as Xe, createWebHistory as qe, useRoute as Je, useRouter as Qe } from "vue-router";
-const O = {};
-function J(e = "route") {
-  const o = (O[e] ?? 0) + 1;
-  return O[e] = o, `${e}-${o}`;
+import { shallowRef as re, getCurrentInstance as pe, inject as $, defineComponent as q, ref as z, onBeforeUnmount as ne, provide as se, computed as G, h as I, watch as ke, onUnmounted as me, nextTick as ye, onMounted as ae, readonly as we } from "vue";
+import { createRouter as Ie, useRoute as Se, routeLocationKey as Re, matchedRouteKey as ee } from "vue-router";
+import { RouterLink as Ze, RouterView as Ne, createMemoryHistory as Oe, createWebHashHistory as et, createWebHistory as tt, useRoute as ot, useRouter as rt } from "vue-router";
+const te = {};
+function W(e = "route") {
+  const r = (te[e] ?? 0) + 1;
+  return te[e] = r, `${e}-${r}`;
 }
-const Z = "slide", Re = "cubic-bezier(0.3, 0, 0.66, 1)";
-function Ae(e) {
+const J = "__stack_page_state__", ce = Symbol("stack-page-history");
+function be(e, r) {
+  return e.states.length === r.states.length && e.states.every((u, h) => {
+    const f = r.states[h];
+    return u.ownerId === f.ownerId && u.key === f.key && Object.is(u.value, f.value);
+  });
+}
+function Pe(e, r, u) {
+  const h = e.push.bind(e), f = e.replace.bind(e), v = e.go.bind(e), D = e.listen.bind(e), y = e.destroy.bind(e), p = /* @__PURE__ */ new Set(), c = /* @__PURE__ */ new Map(), P = /* @__PURE__ */ new Map(), S = /* @__PURE__ */ new Set(), m = /* @__PURE__ */ new Set(), R = /* @__PURE__ */ new Map(), T = [];
+  let b = 0, x = 0;
+  const A = (a) => {
+    const d = a[J];
+    return typeof d == "string" && c.has(d) ? d : "";
+  }, g = () => P.has(b) ? P.get(b) : "", _ = () => {
+    const a = new Set(P.values());
+    for (const d of c.keys())
+      a.has(d) || c.delete(d);
+  }, B = (a) => {
+    const d = W("page-state");
+    return c.set(d, a), { [J]: d };
+  }, C = (a, d, t) => {
+    const o = d.states.findIndex(
+      (n) => n.ownerId === a.scope.id && n.key === a.key
+    ), i = o >= 0, s = a.active !== i || i && !Object.is(a.value, d.states[o].value);
+    a.active = i, i && (a.value = d.states[o].value), a.change(
+      i ? { active: !0, value: d.states[o].value } : { active: !1 },
+      t && s
+    );
+  }, H = (a, d) => {
+    for (const t of S)
+      t.scope.routeIds.value.has(a.routeId) && C(t, a, d);
+  };
+  e.push = (a, d = {}) => {
+    h(a, d), b++;
+    for (const t of P.keys())
+      t > b && P.delete(t);
+    P.set(b, A(d)), _();
+  }, e.replace = (a, d = {}) => {
+    f(a, { ...d, [J]: A(d) }), P.set(b, A(d)), _();
+  }, e.go = (a, d = !0) => {
+    d || (b += a), v(a, d);
+  }, e.listen = (a) => (p.add(a), () => p.delete(a));
+  const V = (a) => {
+    for (const t of a) m.delete(t);
+    if (m.size > 0) return;
+    const d = [...R];
+    R.clear();
+    for (const [t, o] of d) F(t, o);
+    for (const t of T.splice(0)) t();
+  };
+  D((a, d, t) => {
+    const o = [...m], i = g();
+    b += t.delta;
+    const s = g();
+    if (a === d && c.has(i) && c.has(s) && c.get(i).routeId === c.get(s).routeId) {
+      const l = Math.sign(t.delta);
+      if (o.length === 0 && l !== 0 && P.has(b + l) && be(c.get(i), c.get(s))) {
+        x += t.delta, e.go(l);
+        return;
+      }
+      x = 0, r(), u(b), H(c.get(s), !0), V(o);
+      return;
+    }
+    V(o);
+    const n = { ...t, delta: t.delta + x };
+    x = 0;
+    for (const l of p) l(a, d, n);
+  }), e.destroy = () => {
+    p.clear(), S.clear(), c.clear(), P.clear(), R.clear(), m.clear();
+    for (const a of T.splice(0)) a();
+    y();
+  };
+  function F(a, d) {
+    if (!a.scope.isActive.value || e.location !== a.scope.fullPath.value)
+      return;
+    if (m.size > 0) {
+      R.set(a, d);
+      return;
+    }
+    if (a.active) return;
+    const t = a.scope.routeId.value, o = g(), i = c.has(o) && c.get(o).routeId === t ? c.get(o) : { routeId: t, states: [] };
+    (!c.has(o) || c.get(o).routeId !== t) && e.replace(e.location, { ...e.state, ...B(i) });
+    const s = {
+      routeId: t,
+      states: [
+        ...i.states,
+        { ownerId: a.scope.id, key: a.key, value: d }
+      ]
+    };
+    e.push(e.location, B(s)), u(b), H(s, !1);
+  }
+  function K(a) {
+    if (R.delete(a), !a.active) return;
+    a.active = !1, a.change({ active: !1 }, !1);
+    const d = g();
+    if (!a.scope.isActive.value || e.location !== a.scope.fullPath.value || !c.has(d)) {
+      L(a);
+      return;
+    }
+    const t = c.get(d);
+    a.scope.routeIds.value.has(t.routeId) && (t.states.length > 0 && t.states[t.states.length - 1].ownerId === a.scope.id && t.states[t.states.length - 1].key === a.key ? (m.add(a), e.go(-1)) : L(a));
+  }
+  function L(a) {
+    for (const d of c.values())
+      d.states = d.states.filter(
+        (t) => t.ownerId !== a.scope.id || t.key !== a.key
+      );
+  }
+  return {
+    get position() {
+      return b;
+    },
+    whenSettled: () => m.size === 0 ? Promise.resolve() : new Promise((a) => T.push(a)),
+    restoreCurrent() {
+      const a = g();
+      c.has(a) && H(c.get(a), !0);
+    },
+    register(a, d, t) {
+      for (const i of S)
+        if (i.scope === a && i.key === d)
+          throw new Error(`Duplicate page history state key: ${d}`);
+      const o = {
+        scope: a,
+        key: d,
+        active: !1,
+        value: null,
+        change: t
+      };
+      return S.add(o), {
+        push: (i) => F(o, i),
+        remove: () => K(o),
+        replace(i) {
+          const s = g();
+          if (!a.isActive.value || e.location !== a.fullPath.value || !o.active || !c.has(s))
+            return;
+          const n = c.get(s);
+          n.states = n.states.map(
+            (l) => l.ownerId === a.id && l.key === d ? { ...l, value: i } : l
+          ), C(o, n, !1);
+        },
+        restore() {
+          const i = g();
+          c.has(i) && a.routeIds.value.has(c.get(i).routeId) && C(o, c.get(i), !0);
+        },
+        dispose() {
+          K(o), S.delete(o), R.delete(o), L(o);
+        }
+      };
+    }
+  };
+}
+const N = "slide", Ee = "cubic-bezier(0.3, 0, 0.66, 1)";
+function Ke(e) {
   return e;
 }
-const pe = ({ direction: e }) => e === "back" ? {
+const ve = ({ direction: e }) => e === "back" ? {
   leaving: [
     { transform: "translateX(0)" },
     { transform: "translateX(100%)" }
@@ -20,20 +171,20 @@ const pe = ({ direction: e }) => e === "back" ? {
     { transform: "translateX(100%)" },
     { transform: "translateX(0)" }
   ]
-}, we = () => ({
+}, ge = () => ({
   entering: [{ opacity: 0 }, { opacity: 1 }],
   leaving: [{ opacity: 1 }, { opacity: 0 }]
-}), Ee = ({ direction: e }) => {
-  const o = e === "back";
+}), De = ({ direction: e }) => {
+  const r = e === "back";
   return {
-    entering: o ? [
+    entering: r ? [
       { transform: "scale(0.98)", opacity: 0 },
       { transform: "scale(1)", opacity: 1 }
     ] : [
       { transform: "scale(1.04)", opacity: 0 },
       { transform: "scale(1)", opacity: 1 }
     ],
-    leaving: o ? [
+    leaving: r ? [
       { transform: "scale(1)", opacity: 1 },
       { transform: "scale(1.04)", opacity: 0 }
     ] : [
@@ -41,254 +192,266 @@ const pe = ({ direction: e }) => e === "back" ? {
       { transform: "scale(0.98)", opacity: 0 }
     ]
   };
-}, be = () => ({}), Ie = {
-  slide: pe,
-  fade: we,
-  scale: Ee,
-  none: be
+}, Te = () => ({}), xe = {
+  slide: ve,
+  fade: ge,
+  scale: De,
+  none: Te
 };
-function Pe(e, o) {
-  const c = o[e];
-  return c || o[Z];
+function Ae(e, r) {
+  const u = r[e];
+  return u || r[N];
 }
-function ee(e, o, c) {
-  if (!o || !e.animate || Number(c.duration) <= 0)
+function oe(e, r, u) {
+  if (!r || !e.animate || Number(u.duration) <= 0)
     return Promise.resolve();
-  const u = e.animate(o, c);
-  return u.finished.then(() => u.cancel());
+  const h = e.animate(r, u);
+  return h.finished.then(() => h.cancel());
 }
-async function Se(e, o) {
-  const c = e(o), u = {
-    duration: o.duration,
-    easing: o.easing,
+async function Le(e, r) {
+  const u = e(r), h = {
+    duration: r.duration,
+    easing: r.easing,
     fill: "both",
-    ...c.options
+    ...u.options
   };
   await Promise.all([
-    ee(o.enteringElement, c.entering, u),
-    ee(o.leavingElement, c.leaving, u)
+    oe(r.enteringElement, u.entering, h),
+    oe(r.leavingElement, u.leaving, h)
   ]);
 }
-const N = Symbol("stack-router");
-function De() {
-  const e = window.history.state;
-  return typeof (e == null ? void 0 : e.position) == "number" ? e.position : window.history.length;
-}
-function X(e, o) {
-  return o || (e === "pop" ? "back" : e === "replace" ? "none" : "forward");
+const O = Symbol("stack-router");
+function Q(e, r) {
+  return r || (e === "pop" ? "back" : e === "replace" ? "none" : "forward");
 }
-function Be(e) {
-  const o = me(e), c = [], u = te(), d = e.transitionDuration ?? 210, D = e.transitionEasing ?? Re, E = e.transition ?? Z, m = {
-    ...Ie,
+function Ge(e) {
+  const r = [], u = re(), h = e.transitionDuration ?? 210, f = e.transitionEasing ?? Ee, v = e.transition ?? N, D = {
+    ...xe,
     ...e.transitions
-  }, w = e.maxStackSize ?? 30;
-  let f = -1, i, b = !1;
-  const R = (a, r, s, l, h = !1, k = "stack") => {
-    i = {
-      action: a,
-      direction: X(a, r),
-      source: k,
-      delta: s,
-      reuse: l == null ? void 0 : l.reuse,
-      transition: l == null ? void 0 : l.transition,
-      duration: l == null ? void 0 : l.duration,
-      easing: l == null ? void 0 : l.easing,
-      resetRoot: h
+  }, y = e.maxStackSize ?? 30;
+  let p = -1, c, P = !1;
+  const S = Pe(
+    e.history,
+    () => {
+      c = void 0;
+    },
+    (s) => {
+      p >= 0 && (r[p].position = s);
+    }
+  ), m = Ie(e), R = (s, n, l, k, w = !1, E = "stack") => {
+    c = {
+      action: s,
+      direction: Q(s, n),
+      source: E,
+      delta: l,
+      reuse: k == null ? void 0 : k.reuse,
+      transition: k == null ? void 0 : k.transition,
+      duration: k == null ? void 0 : k.duration,
+      easing: k == null ? void 0 : k.easing,
+      resetRoot: w
     };
-  }, K = (a, r) => {
-    const s = (i == null ? void 0 : i.action) ?? "push", l = X(s, i == null ? void 0 : i.direction), h = u.value, k = s === "push" && l === "forward", M = T(a);
+  }, T = (s, n) => {
+    const l = (c == null ? void 0 : c.action) ?? "push", k = Q(l, c == null ? void 0 : c.direction), w = u.value, E = l === "push" && k === "forward", X = b(s);
     return {
-      id: J("route"),
-      key: a.fullPath,
-      fullPath: a.fullPath,
-      pathname: a.path,
-      params: a.params,
-      query: a.query,
-      action: s,
-      direction: l,
-      reuse: (i == null ? void 0 : i.reuse) ?? !1,
-      source: (i == null ? void 0 : i.source) ?? "stack",
-      entryDirection: l,
-      lastPathname: (h == null ? void 0 : h.pathname) || (r.name ? r.path : void 0),
-      pushedByRoute: k ? h == null ? void 0 : h.pathname : h == null ? void 0 : h.pushedByRoute,
-      position: De(),
-      delta: i == null ? void 0 : i.delta,
-      transition: (i == null ? void 0 : i.transition) ?? E,
-      transitionDuration: (i == null ? void 0 : i.duration) ?? d,
-      transitionEasing: (i == null ? void 0 : i.easing) ?? D,
-      cache: M
+      id: W("route"),
+      key: s.fullPath,
+      fullPath: s.fullPath,
+      pathname: s.path,
+      params: s.params,
+      query: s.query,
+      action: l,
+      direction: k,
+      reuse: (c == null ? void 0 : c.reuse) ?? !1,
+      source: (c == null ? void 0 : c.source) ?? "stack",
+      entryDirection: k,
+      lastPathname: (w == null ? void 0 : w.pathname) || (n.name ? n.path : void 0),
+      pushedByRoute: E ? w == null ? void 0 : w.pathname : w == null ? void 0 : w.pushedByRoute,
+      position: S.position,
+      delta: c == null ? void 0 : c.delta,
+      transition: (c == null ? void 0 : c.transition) ?? v,
+      transitionDuration: (c == null ? void 0 : c.duration) ?? h,
+      transitionEasing: (c == null ? void 0 : c.easing) ?? f,
+      cache: X
     };
-  }, T = (a) => {
-    const r = a.meta.stack;
-    return a.meta.stackCache !== !1 && (r == null ? void 0 : r.cache) !== !1;
-  }, $ = () => {
-    if (w <= 0 || c.length <= w) return;
-    const a = c.length - w;
-    c.splice(0, a), f = Math.max(0, f - a);
-  }, W = (a) => {
-    if (a.action === "pop") {
-      let r = -1;
-      if (a.direction === "forward" || (a.delta ?? 0) > 0) {
-        for (let s = f + 1; s < c.length; s++)
-          if (c[s].key === a.key) {
-            r = s;
+  }, b = (s) => {
+    const n = s.meta.stack;
+    return s.meta.stackCache !== !1 && (n == null ? void 0 : n.cache) !== !1;
+  }, x = () => {
+    if (y <= 0 || r.length <= y) return;
+    const s = r.length - y;
+    r.splice(0, s), p = Math.max(0, p - s);
+  }, A = (s) => {
+    if (s.action === "pop") {
+      let n = -1;
+      if (s.direction === "forward" || (s.delta ?? 0) > 0) {
+        for (let l = p + 1; l < r.length; l++)
+          if (r[l].key === s.key) {
+            n = l;
             break;
           }
       } else
-        for (let s = f - 1; s >= 0; s--)
-          if (c[s].key === a.key) {
-            r = s;
+        for (let l = p - 1; l >= 0; l--)
+          if (r[l].key === s.key) {
+            n = l;
             break;
           }
-      if (r >= 0) {
-        const s = c[r];
-        c[r] = {
+      if (n >= 0) {
+        const l = r[n];
+        r[n] = {
+          ...l,
           ...s,
-          ...a,
-          id: s.id,
-          reuse: s.reuse,
-          source: a.source,
-          entryDirection: s.entryDirection,
-          transition: s.transition,
-          transitionDuration: s.transitionDuration,
-          transitionEasing: s.transitionEasing
-        }, f = r;
+          id: l.id,
+          reuse: l.reuse,
+          source: s.source,
+          entryDirection: l.entryDirection,
+          transition: l.transition,
+          transitionDuration: l.transitionDuration,
+          transitionEasing: l.transitionEasing
+        }, p = n;
       } else
-        c.push({
-          ...a,
+        r.push({
+          ...s,
           direction: "none",
           entryDirection: "none",
           transition: "none",
           isStackFallback: !0
-        }), f = c.length - 1;
-    } else if (a.action === "replace") {
-      if (i != null && i.resetRoot) {
-        c.splice(0, c.length, a), f = 0, u.value = c[f];
+        }), p = r.length - 1;
+    } else if (s.action === "replace") {
+      if (c != null && c.resetRoot) {
+        r.splice(0, r.length, s), p = 0, u.value = r[p];
         return;
       }
-      f >= 0 ? c[f] = a : (c.push(a), f = 0);
+      p >= 0 ? r[p] = s : (r.push(s), p = 0);
     } else
-      f < c.length - 1 && c.splice(f + 1), c.push(a), f = c.length - 1;
-    $(), u.value = c[f];
+      p < r.length - 1 && r.splice(p + 1), r.push(s), p = r.length - 1;
+    x(), u.value = r[p];
   };
-  e.history.listen((a, r, s) => {
-    const l = "delta" in s ? s.delta : void 0, h = s.direction === "back" ? "back" : s.direction === "forward" ? "forward" : void 0;
-    i ? (i.delta = l, i.direction = X(
-      i.action,
-      i.direction ?? h
+  e.history.listen((s, n, l) => {
+    const k = "delta" in l ? l.delta : void 0, w = l.direction === "back" ? "back" : l.direction === "forward" ? "forward" : void 0;
+    c ? (c.delta = k, c.direction = Q(
+      c.action,
+      c.direction ?? w
     )) : R(
-      s.type === "pop" ? "pop" : s.type,
-      h,
-      l,
+      l.type === "pop" ? "pop" : l.type,
+      w,
+      k,
       void 0,
       !1,
       "external"
     );
-  }), o.beforeEach((a) => !((i == null ? void 0 : i.action) === "pop" && b && !c.some((r) => r.fullPath === a.fullPath))), o.afterEach((a, r, s) => {
-    if (s) {
-      i = void 0;
+  }), m.beforeEach((s) => !((c == null ? void 0 : c.action) === "pop" && P && !r.some((n) => n.fullPath === s.fullPath))), m.afterEach((s, n, l) => {
+    if (l) {
+      c = void 0;
       return;
     }
-    W(K(a, r)), i = void 0;
+    A(T(s, n)), c = void 0, S.restoreCurrent();
   });
-  const g = o.push.bind(o), I = o.replace.bind(o), z = o.back.bind(o), x = o.forward.bind(o), j = o.go.bind(o), L = (a, r) => (R(
+  const g = m.push.bind(m), _ = m.replace.bind(m), B = m.back.bind(m), C = m.forward.bind(m), H = m.go.bind(m), V = async (s, n) => (await S.whenSettled(), R(
     "push",
-    (r == null ? void 0 : r.direction) ?? "forward",
+    (n == null ? void 0 : n.direction) ?? "forward",
     void 0,
-    r
-  ), g(a)), A = (a, r) => (R(
+    n
+  ), g(s)), F = async (s, n) => (await S.whenSettled(), R(
     "replace",
-    (r == null ? void 0 : r.direction) ?? "root",
+    (n == null ? void 0 : n.direction) ?? "root",
     void 0,
-    r
-  ), I(a)), B = (a, r) => {
-    const s = o.resolve(a).fullPath;
-    let l = -1;
-    for (let k = f; k >= 0; k--)
-      if (c[k].fullPath === s) {
-        l = k;
+    n
+  ), _(s)), K = (s, n) => {
+    const l = m.resolve(s).fullPath;
+    let k = -1;
+    for (let E = p; E >= 0; E--)
+      if (r[E].fullPath === l) {
+        k = E;
         break;
       }
-    if (l < 0) return !1;
-    const h = l - f;
-    return h === 0 || (R(
-      "pop",
-      (r == null ? void 0 : r.direction) ?? "back",
-      h,
-      r
-    ), j(h)), !0;
-  }, _ = (a, r) => {
-    const s = o.resolve(a).fullPath;
-    if (f >= 0 && o.currentRoute.value.fullPath === s) {
-      const l = c[f], h = {
-        ...l,
-        id: J("route"),
+    if (k < 0) return !1;
+    const w = r[k];
+    return S.whenSettled().then(() => {
+      const E = w.position - S.position;
+      E !== 0 && (R(
+        "pop",
+        (n == null ? void 0 : n.direction) ?? "back",
+        E,
+        n
+      ), H(E));
+    }), !0;
+  }, L = async (s, n) => {
+    await S.whenSettled();
+    const l = m.resolve(s).fullPath;
+    if (p >= 0 && m.currentRoute.value.fullPath === l) {
+      const k = r[p], w = {
+        ...k,
+        id: W("route"),
         action: "replace",
-        direction: (r == null ? void 0 : r.direction) ?? "root",
+        direction: (n == null ? void 0 : n.direction) ?? "root",
         source: "stack",
-        entryDirection: (r == null ? void 0 : r.direction) ?? "root",
+        entryDirection: (n == null ? void 0 : n.direction) ?? "root",
         delta: void 0,
-        reuse: (r == null ? void 0 : r.reuse) ?? l.reuse,
-        transition: (r == null ? void 0 : r.transition) ?? l.transition,
-        transitionDuration: (r == null ? void 0 : r.duration) ?? l.transitionDuration,
-        transitionEasing: (r == null ? void 0 : r.easing) ?? l.transitionEasing,
+        reuse: (n == null ? void 0 : n.reuse) ?? k.reuse,
+        transition: (n == null ? void 0 : n.transition) ?? k.transition,
+        transitionDuration: (n == null ? void 0 : n.duration) ?? k.transitionDuration,
+        transitionEasing: (n == null ? void 0 : n.easing) ?? k.transitionEasing,
         cache: !0,
         isStackFallback: !1
       };
-      return c.splice(0, c.length, h), f = 0, b = !0, u.value = h, Promise.resolve(void 0);
+      return r.splice(0, r.length, w), p = 0, P = !0, u.value = w, Promise.resolve(void 0);
     }
     return R(
       "replace",
-      (r == null ? void 0 : r.direction) ?? "root",
+      (n == null ? void 0 : n.direction) ?? "root",
       void 0,
-      r,
+      n,
       !0
-    ), b = !0, I(a);
-  }, V = () => {
-    R("pop", "back", -1), z();
-  }, F = () => {
-    R("pop", "forward", 1), x();
-  }, p = o;
-  p.push = L, p.replace = A, p.popTo = B, p.resetRoot = _, p.back = V, p.forward = F;
-  const t = {
-    router: p,
-    transitionDuration: d,
-    transitionEasing: D,
-    transition: E,
-    transitions: m,
-    maxStackSize: w,
+    ), P = !0, _(s);
+  }, a = () => {
+    S.whenSettled().then(() => {
+      R("pop", "back", -1), B();
+    });
+  }, d = () => {
+    S.whenSettled().then(() => {
+      R("pop", "forward", 1), C();
+    });
+  }, t = m;
+  t.push = V, t.replace = F, t.popTo = K, t.resetRoot = L, t.back = a, t.forward = d;
+  const o = {
+    router: t,
+    transitionDuration: h,
+    transitionEasing: f,
+    transition: v,
+    transitions: D,
+    maxStackSize: y,
     shouldTransition: e.shouldTransition,
     current: u,
     get history() {
-      return c;
+      return r;
     },
-    canGoBack: (a = 1) => f - a >= 0,
-    push: L,
-    replace: A,
-    popTo: B,
-    resetRoot: _,
-    back: V,
-    forward: F
-  }, n = o.install.bind(o);
-  return o.install = (a) => {
-    a.provide(N, t), n(a);
-  }, p;
+    canGoBack: (s = 1) => p - s >= 0,
+    push: V,
+    replace: F,
+    popTo: K,
+    resetRoot: L,
+    back: a,
+    forward: d
+  }, i = m.install.bind(m);
+  return m.install = (s) => {
+    s.provide(O, o), s.provide(ce, S), i(s);
+  }, t;
 }
-const re = "onPageWillEnter", Q = "onPageDidEnter", oe = "onPageWillLeave", ne = "onPageDidLeave";
-function Te(e, o, c) {
-  if (!c)
+const ue = "onPageWillEnter", Z = "onPageDidEnter", ie = "onPageWillLeave", le = "onPageDidLeave";
+function _e(e, r, u) {
+  if (!u)
     throw new Error(`${e} must be called inside setup().`);
-  const u = c.proxy, d = u[e] ?? [];
-  d.push(() => {
-    c.isUnmounted || o();
-  }), u[e] = d, c.exposed && (c.exposed[e] = d);
+  const h = u.proxy, f = h[e] ?? [];
+  f.push(() => {
+    u.isUnmounted || r();
+  }), h[e] = f, u.exposed && (u.exposed[e] = f);
 }
-function H(e) {
-  return (o, c = ie()) => Te(e, o, c);
+function U(e) {
+  return (r, u = pe()) => _e(e, r, u);
 }
-const _e = H(re), Ve = H(Q), Fe = H(oe), Ce = H(ne);
-function Ge() {
-  const e = C(N);
+const $e = U(ue), ze = U(Z), je = U(ie), Me = U(le);
+function We() {
+  const e = $(O);
   if (!e)
     throw new Error("useStackRouter must be used after createStackRouter().");
   return {
@@ -302,175 +465,215 @@ function Ge() {
     forward: e.forward
   };
 }
-function ae() {
-  const e = C(N);
+function de() {
+  const e = $(O);
   if (!e)
     throw new Error("RouterOutlet must be used with createStackRouter().");
   return e;
 }
-function P(e, o) {
-  const c = e.value;
-  if (!c) return;
-  const u = c[o];
-  Array.isArray(u) ? u.forEach((d) => d()) : typeof u == "function" && u.call(c);
+function j(e, r) {
+  const u = e.value;
+  if (!u) return;
+  const h = u[r];
+  Array.isArray(h) ? h.forEach((f) => f()) : typeof h == "function" && h.call(u);
+}
+const fe = Symbol("stack-page-scope");
+function Be() {
+  const e = $(fe);
+  if (!e)
+    throw new Error("Page history state must be used inside RouterOutlet.");
+  return e;
 }
-function S(e) {
+const Ce = q({
+  name: "StackPageScope",
+  props: {
+    id: { type: String, required: !0 },
+    routeInfo: { type: Object, required: !0 },
+    routeIds: { type: Object, required: !0 },
+    active: { type: Boolean, required: !0 }
+  },
+  setup(e, { slots: r }) {
+    const u = z(!1);
+    return ne(() => {
+      u.value = !0;
+    }), se(fe, {
+      id: e.id,
+      routeId: G(() => e.routeInfo.id),
+      fullPath: G(() => e.routeInfo.fullPath),
+      routeIds: G(() => e.routeIds),
+      isActive: G(() => e.active && !u.value)
+    }), () => r.default();
+  }
+});
+function M(e) {
   e.classList.remove("rs-page-hidden", "rs-page-invisible"), e.removeAttribute("aria-hidden");
 }
-function q(e) {
-  const o = e.ownerDocument.activeElement;
-  o instanceof HTMLElement && e.contains(o) && o.blur(), e.classList.add("rs-page-hidden"), e.setAttribute("aria-hidden", "true");
+function Y(e) {
+  const r = e.ownerDocument.activeElement;
+  r instanceof HTMLElement && e.contains(r) && r.blur(), e.classList.add("rs-page-hidden"), e.setAttribute("aria-hidden", "true");
 }
-function ce(e) {
-  var o;
-  return (o = e.components) == null ? void 0 : o.default;
+function he(e) {
+  var r;
+  return (r = e.components) == null ? void 0 : r.default;
 }
-function ge(e) {
-  const o = ce(e);
-  return o !== void 0 && typeof o == "object" && "name" in o && o.name === "RouterView";
+function He(e) {
+  const r = he(e);
+  return r !== void 0 && typeof r == "object" && "name" in r && r.name === "RouterView";
 }
-const He = Y({
+const qe = q({
   name: "RouterOutlet",
   setup() {
-    const e = ae(), o = ye(), c = C(ke), u = C(v, void 0), d = U(() => {
-      const t = u == null ? void 0 : u.value;
+    const e = de(), r = Se(), u = $(Re), h = $(ee, void 0), f = G(() => {
+      const t = h == null ? void 0 : h.value;
       if (!t) return 0;
-      const n = o.matched.findIndex(
-        (a) => a === t
+      const o = r.matched.findIndex(
+        (i) => i === t
       );
-      return n >= 0 ? n + 1 : 0;
-    }), D = U(() => o.matched[d.value]), E = U(() => {
-      for (let t = d.value; t < o.matched.length; t++) {
-        const n = o.matched[t];
-        if (!ge(n))
-          return n;
+      return o >= 0 ? o + 1 : 0;
+    }), v = G(() => r.matched[f.value]), D = G(() => {
+      for (let t = f.value; t < r.matched.length; t++) {
+        const o = r.matched[t];
+        if (!He(o))
+          return o;
       }
-      return D.value;
-    }), m = te([]), w = G("");
-    let f = 0;
-    ue(v, E);
-    const i = (t) => m.value.find((n) => n.id === t), b = (t) => m.value.find((n) => n.routeIds.has(t)), R = (t) => m.value.find((n) => n.routeKey === t), K = (t) => t.action === "push" && t.direction === "forward" && !t.reuse && m.value.some((n) => n.routeKey === t.key), T = (t) => {
-      m.value.forEach((n) => {
-        n.pageElement && (n === t ? S(n.pageElement) : q(n.pageElement));
+      return v.value;
+    }), y = re([]), p = z("");
+    let c = 0;
+    se(ee, D);
+    const P = (t) => y.value.find((o) => o.id === t), S = (t) => y.value.find((o) => o.routeIds.has(t)), m = (t) => y.value.find((o) => o.routeKey === t), R = (t) => t.action === "push" && t.direction === "forward" && !t.reuse && y.value.some((o) => o.routeKey === t.key), T = (t) => {
+      y.value.forEach((o) => {
+        o.pageElement && (o === t ? M(o.pageElement) : Y(o.pageElement));
       });
-    }, $ = (t) => {
-      const n = e.history.findIndex(
-        (r) => r.id === t.routeInfo.id
+    }, b = (t) => {
+      const o = e.history.findIndex(
+        (s) => s.id === t.routeInfo.id
       );
-      if (n < 0) return;
-      const a = new Set(
-        e.history.slice(0, n + 1).map((r) => r.id)
+      if (o < 0) return;
+      const i = new Set(
+        e.history.slice(0, o + 1).map((s) => s.id)
       );
-      m.value.forEach((r) => {
-        r.routeIds = new Set(
-          [...r.routeIds].filter((s) => a.has(s))
+      y.value.forEach((s) => {
+        s.routeIds = new Set(
+          [...s.routeIds].filter((n) => i.has(n))
         );
-      }), m.value = m.value.filter(
-        (r) => r === t || r.routeIds.size > 0
+      }), y.value = y.value.filter(
+        (s) => s === t || s.routeIds.size > 0
       );
-    }, W = (t) => {
-      m.value = m.value.filter((n) => n !== t);
-    }, g = (t) => {
-      const n = new Set(
-        e.history.map((a) => a.id)
+    }, x = (t) => {
+      y.value = y.value.filter((o) => o !== t);
+    }, A = (t) => {
+      const o = new Set(
+        e.history.map((i) => i.id)
       );
-      m.value.forEach((a) => {
-        a.routeIds = new Set(
-          [...a.routeIds].filter((r) => n.has(r))
+      y.value.forEach((i) => {
+        i.routeIds = new Set(
+          [...i.routeIds].filter((s) => o.has(s))
         );
-      }), m.value = m.value.filter(
-        (a) => a === t || a.routeInfo.cache && a.routeIds.size > 0
+      }), y.value = y.value.filter(
+        (i) => i === t || i.routeInfo.cache && i.routeIds.size > 0
       );
-    }, I = (t) => {
-      var a;
-      const n = t.props.default;
-      return n ? n === !0 ? ((a = e.current.value) == null ? void 0 : a.params) ?? {} : typeof n == "function" ? n(c) : n : {};
-    }, z = (t, n) => t.routeInfo.action === "pop" ? n.routeInfo.transition ?? t.routeInfo.transition ?? e.transition : t.routeInfo.transition ?? e.transition, x = (t) => t.entryDirection === "none" || t.entryDirection === "root" || t.transition === "none", j = (t, n) => t.routeInfo.direction === "forward" ? x(t.routeInfo) : x(n.routeInfo), L = (t, n) => !(t.routeInfo.isStackFallback || t.routeInfo.direction === "none" || t.routeInfo.direction === "root" || t.routeInfo.action === "pop" && j(t, n)), A = (t, n) => {
-      var r;
-      const a = L(t, n);
-      return ((r = e.shouldTransition) == null ? void 0 : r.call(e, {
+    }, g = (t) => {
+      var i;
+      const o = t.props.default;
+      return o ? o === !0 ? ((i = e.current.value) == null ? void 0 : i.params) ?? {} : typeof o == "function" ? o(u) : o : {};
+    }, _ = (t, o) => t.routeInfo.action === "pop" ? o.routeInfo.transition ?? t.routeInfo.transition ?? e.transition : t.routeInfo.transition ?? e.transition, B = (t) => t.entryDirection === "none" || t.entryDirection === "root" || t.transition === "none", C = (t, o) => t.routeInfo.direction === "forward" ? B(t.routeInfo) : B(o.routeInfo), H = (t, o) => !(t.routeInfo.isStackFallback || t.routeInfo.direction === "none" || t.routeInfo.direction === "root" || t.routeInfo.action === "pop" && C(t, o)), V = (t, o) => {
+      var s;
+      const i = H(t, o);
+      return ((s = e.shouldTransition) == null ? void 0 : s.call(e, {
         action: t.routeInfo.action,
         direction: t.routeInfo.direction,
         source: t.routeInfo.source,
         entering: t.routeInfo,
-        leaving: n.routeInfo,
-        defaultResult: a
-      })) ?? a;
-    }, B = (t, n) => t.routeInfo.action === "pop" ? n.routeInfo.transitionDuration ?? t.routeInfo.transitionDuration ?? e.transitionDuration : t.routeInfo.transitionDuration ?? e.transitionDuration, _ = (t, n) => t.routeInfo.action === "pop" ? n.routeInfo.transitionEasing ?? t.routeInfo.transitionEasing ?? e.transitionEasing : t.routeInfo.transitionEasing ?? e.transitionEasing, V = async (t, n) => {
-      const a = ++f;
-      await fe();
-      const r = t.pageElement;
-      if (!r) return;
-      if (P(t.componentRef, re), !n || n === t || !n.pageElement) {
-        S(r), P(t.componentRef, Q), g(t), T(t);
+        leaving: o.routeInfo,
+        defaultResult: i
+      })) ?? i;
+    }, F = (t, o) => t.routeInfo.action === "pop" ? o.routeInfo.transitionDuration ?? t.routeInfo.transitionDuration ?? e.transitionDuration : t.routeInfo.transitionDuration ?? e.transitionDuration, K = (t, o) => t.routeInfo.action === "pop" ? o.routeInfo.transitionEasing ?? t.routeInfo.transitionEasing ?? e.transitionEasing : t.routeInfo.transitionEasing ?? e.transitionEasing, L = async (t, o) => {
+      const i = ++c;
+      await ye();
+      const s = t.pageElement;
+      if (!s) return;
+      if (j(t.componentRef, ue), !o || o === t || !o.pageElement) {
+        M(s), j(t.componentRef, Z), A(t), T(t);
         return;
       }
-      const s = n.pageElement, l = A(t, n), h = l ? z(t, n) : "none", k = l ? B(t, n) : 0, M = _(t, n), se = Pe(
-        h || Z,
+      const n = o.pageElement, l = V(t, o), k = l ? _(t, o) : "none", w = l ? F(t, o) : 0, E = K(t, o), X = Ae(
+        k || N,
         e.transitions
       );
-      P(n.componentRef, oe), S(r), S(s), await Se(se, {
+      j(o.componentRef, ie), M(s), M(n), await Le(X, {
         direction: t.routeInfo.direction,
         action: t.routeInfo.action,
         routeInfo: t.routeInfo,
-        enteringElement: r,
-        leavingElement: s,
-        duration: k,
-        easing: M
-      }), a === f && (q(s), P(n.componentRef, ne), P(t.componentRef, Q), t.routeInfo.action === "pop" ? $(t) : t.routeInfo.action === "replace" && W(n), g(t), T(t));
-    }, F = async () => {
-      const t = E.value, n = e.current.value;
-      if (!t || !n) return;
-      const a = ce(t);
-      if (!a) return;
-      const r = i(w.value);
-      let s = b(n.id);
-      !s && !K(n) && (s = R(n.key)), s ? (s.routeIds.add(n.id), s.routeKey = n.key, s.routeInfo = n, s.matchedRoute = t, s.component = a, s.props = I(t), s.mounted = !0) : (s = {
-        id: J("view"),
-        routeKey: n.key,
-        routeIds: /* @__PURE__ */ new Set([n.id]),
-        routeInfo: n,
+        enteringElement: s,
+        leavingElement: n,
+        duration: w,
+        easing: E
+      }), i === c && (Y(n), j(o.componentRef, le), j(t.componentRef, Z), t.routeInfo.action === "pop" ? b(t) : t.routeInfo.action === "replace" && x(o), A(t), T(t));
+    }, a = async () => {
+      const t = D.value, o = e.current.value;
+      if (!t || !o) return;
+      const i = he(t);
+      if (!i) return;
+      const s = P(p.value);
+      let n = S(o.id);
+      !n && !R(o) && (n = m(o.key)), n ? (n.routeIds.add(o.id), n.routeKey = o.key, n.routeInfo = o, n.matchedRoute = t, n.component = i, n.props = g(t), n.mounted = !0) : (n = {
+        id: W("view"),
+        routeKey: o.key,
+        routeIds: /* @__PURE__ */ new Set([o.id]),
+        routeInfo: o,
         matchedRoute: t,
-        component: a,
-        props: I(t),
-        componentRef: G(),
+        component: i,
+        props: g(t),
+        componentRef: z(),
         mounted: !0
-      }, m.value = [...m.value, s]), w.value = s.id, await V(s, r);
+      }, y.value = [...y.value, n]), p.value = n.id, await L(n, s);
     };
-    return le(
+    return ke(
       () => {
         var t;
-        return [(t = e.current.value) == null ? void 0 : t.id, E.value];
+        return [(t = e.current.value) == null ? void 0 : t.id, D.value];
       },
       () => {
-        F();
+        a();
       },
       { immediate: !0 }
-    ), de(() => {
-      f++, m.value = [];
+    ), me(() => {
+      c++, y.value = [];
     }), {
-      injectedRoute: c,
-      viewItems: m,
-      registerStackPage: (t, n) => {
-        t.pageElement = n, t.id === w.value ? S(n) : q(n);
+      injectedRoute: u,
+      viewItems: y,
+      activeViewId: p,
+      registerStackPage: (t, o) => {
+        t.pageElement = o, t.id === p.value ? M(o) : Y(o);
       }
     };
   },
   render() {
-    return y(
+    return I(
       "div",
       { class: "rs-outlet" },
       this.viewItems.filter((e) => e.mounted).map(
-        (e) => y(e.component, {
-          key: e.id,
-          ref: e.componentRef,
-          ...e.props,
-          registerStackPage: (o) => this.registerStackPage(e, o)
-        })
+        (e) => I(
+          Ce,
+          {
+            key: e.id,
+            id: e.id,
+            routeInfo: e.routeInfo,
+            routeIds: e.routeIds,
+            active: e.id === this.activeViewId
+          },
+          {
+            default: () => I(e.component, {
+              ref: e.componentRef,
+              ...e.props,
+              registerStackPage: (r) => this.registerStackPage(e, r)
+            })
+          }
+        )
       )
     );
   }
-}), Ke = Y({
+}), Ue = q({
   name: "RouterPage",
   props: {
     registerStackPage: {
@@ -478,25 +681,25 @@ const He = Y({
       default: void 0
     }
   },
-  setup(e, { attrs: o, slots: c }) {
-    const u = G();
-    return he(() => {
-      var d;
-      u.value && ((d = e.registerStackPage) == null || d.call(e, u.value));
+  setup(e, { attrs: r, slots: u }) {
+    const h = z();
+    return ae(() => {
+      var f;
+      h.value && ((f = e.registerStackPage) == null || f.call(e, h.value));
     }), () => {
-      var d;
-      return y(
+      var f;
+      return I(
         "section",
         {
-          ...o,
-          ref: u,
-          class: ["rs-page", o.class]
+          ...r,
+          ref: h,
+          class: ["rs-page", r.class]
         },
-        (d = c.default) == null ? void 0 : d.call(c)
+        (f = u.default) == null ? void 0 : f.call(u)
       );
     };
   }
-}), $e = Y({
+}), Xe = q({
   name: "StackRouterDebugPanel",
   props: {
     initialOpen: {
@@ -505,52 +708,52 @@ const He = Y({
     }
   },
   setup(e) {
-    const o = ae(), c = G(e.initialOpen);
+    const r = de(), u = z(e.initialOpen);
     return () => {
-      const u = o.current.value;
-      return y("aside", { class: "rs-debug-panel" }, [
-        y(
+      const h = r.current.value;
+      return I("aside", { class: "rs-debug-panel" }, [
+        I(
           "button",
           {
             class: "rs-debug-toggle",
             type: "button",
             onClick: () => {
-              c.value = !c.value;
+              u.value = !u.value;
             }
           },
-          c.value ? "Stack x" : "Stack"
+          u.value ? "Stack x" : "Stack"
         ),
-        c.value ? y("section", { class: "rs-debug-body" }, [
-          y("header", [
-            y("strong", "Router Stack"),
-            y("span", `${o.history.length} pages`)
+        u.value ? I("section", { class: "rs-debug-body" }, [
+          I("header", [
+            I("strong", "Router Stack"),
+            I("span", `${r.history.length} pages`)
           ]),
-          y("dl", [
-            y("dt", "current"),
-            y("dd", (u == null ? void 0 : u.fullPath) ?? "-"),
-            y("dt", "canGoBack"),
-            y("dd", String(o.canGoBack()))
+          I("dl", [
+            I("dt", "current"),
+            I("dd", (h == null ? void 0 : h.fullPath) ?? "-"),
+            I("dt", "canGoBack"),
+            I("dd", String(r.canGoBack()))
           ]),
-          y(
+          I(
             "ol",
-            o.history.map(
-              (d) => y(
+            r.history.map(
+              (f) => I(
                 "li",
                 {
-                  key: d.id,
+                  key: f.id,
                   class: {
-                    "rs-debug-active": d.id === (u == null ? void 0 : u.id),
-                    "rs-debug-no-cache": !d.cache
+                    "rs-debug-active": f.id === (h == null ? void 0 : h.id),
+                    "rs-debug-no-cache": !f.cache
                   }
                 },
                 [
-                  y("code", d.fullPath),
-                  y("span", [
-                    `${d.action}/${d.direction}`,
-                    ` source:${d.source}`,
-                    ` entry:${d.entryDirection}`,
-                    ` cache:${d.cache ? "yes" : "no"}`,
-                    ` transition:${d.transition ?? "-"}`
+                  I("code", f.fullPath),
+                  I("span", [
+                    `${f.action}/${f.direction}`,
+                    ` source:${f.source}`,
+                    ` entry:${f.entryDirection}`,
+                    ` cache:${f.cache ? "yes" : "no"}`,
+                    ` transition:${f.transition ?? "-"}`
                   ])
                 ]
               )
@@ -561,23 +764,41 @@ const He = Y({
     };
   }
 });
+function Je(e) {
+  const r = Be(), u = $(ce);
+  if (!u)
+    throw new Error(
+      "usePageHistoryState must be used after createStackRouter()."
+    );
+  const h = z(!1), f = u.register(r, e.key, (v, D) => {
+    h.value = v.active, D && e.onChange(v);
+  });
+  return ae(f.restore), ne(f.dispose), {
+    active: we(h),
+    isCurrentPage: r.isActive,
+    pushState: (v) => f.push(v),
+    removeState: f.remove,
+    replaceState: (v) => f.replace(v)
+  };
+}
 export {
-  je as RouterLink,
-  He as RouterOutlet,
-  Ke as RouterPage,
-  Me as RouterView,
-  $e as StackRouterDebugPanel,
-  Ue as createMemoryHistory,
-  Be as createStackRouter,
-  Xe as createWebHashHistory,
-  qe as createWebHistory,
-  Ae as defineStackTransition,
-  Ve as onPageDidEnter,
-  Ce as onPageDidLeave,
-  _e as onPageWillEnter,
-  Fe as onPageWillLeave,
-  N as stackRouterKey,
-  Je as useRoute,
-  Qe as useRouter,
-  Ge as useStackRouter
+  Ze as RouterLink,
+  qe as RouterOutlet,
+  Ue as RouterPage,
+  Ne as RouterView,
+  Xe as StackRouterDebugPanel,
+  Oe as createMemoryHistory,
+  Ge as createStackRouter,
+  et as createWebHashHistory,
+  tt as createWebHistory,
+  Ke as defineStackTransition,
+  ze as onPageDidEnter,
+  Me as onPageDidLeave,
+  $e as onPageWillEnter,
+  je as onPageWillLeave,
+  O as stackRouterKey,
+  Je as usePageHistoryState,
+  ot as useRoute,
+  rt as useRouter,
+  We as useStackRouter
 };