@lazycatcloud/vue-router-stack 0.0.6 → 0.0.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +64 -11
- package/dist/components/RouterOutlet.d.ts +1 -0
- package/dist/components/StackPageScope.d.ts +47 -0
- package/dist/composables/usePageHistoryState.d.ts +14 -0
- package/dist/index.d.ts +4 -2
- package/dist/router/pageHistory.d.ts +33 -0
- package/dist/vue-router-stack.cjs +1 -1
- package/dist/vue-router-stack.js +583 -361
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -140,27 +140,37 @@ stackRouter.push("/detail", {
|
|
|
140
140
|
可以通过 `defineStackTransition` 注册自定义动画:
|
|
141
141
|
|
|
142
142
|
```ts
|
|
143
|
-
import {
|
|
143
|
+
import {
|
|
144
|
+
createStackRouter,
|
|
145
|
+
defineStackTransition,
|
|
146
|
+
} from "@lazycatcloud/vue-router-stack";
|
|
144
147
|
|
|
145
148
|
export const router = createStackRouter({
|
|
146
149
|
history: createWebHistory(),
|
|
147
150
|
transition: "slide",
|
|
148
151
|
transitions: {
|
|
149
|
-
sheet: defineStackTransition(({ direction }) =>
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
152
|
+
sheet: defineStackTransition(({ direction }) =>
|
|
153
|
+
direction === "back"
|
|
154
|
+
? {
|
|
155
|
+
leaving: [
|
|
156
|
+
{ transform: "translateY(0)" },
|
|
157
|
+
{ transform: "translateY(100%)" },
|
|
158
|
+
],
|
|
159
|
+
}
|
|
160
|
+
: {
|
|
161
|
+
entering: [
|
|
162
|
+
{ transform: "translateY(100%)" },
|
|
163
|
+
{ transform: "translateY(0)" },
|
|
164
|
+
],
|
|
165
|
+
},
|
|
166
|
+
),
|
|
159
167
|
},
|
|
160
168
|
routes,
|
|
161
169
|
});
|
|
162
170
|
```
|
|
163
171
|
|
|
172
|
+
上面的 `sheet` 动画保持底层页面不动,只让新页面从底部上滑;返回时只让上层页面下滑。
|
|
173
|
+
|
|
164
174
|
返回时会优先使用离开页面进入时记录的动画。例如用 `sheet` 打开详情页,返回时会按 `sheet` 收起。
|
|
165
175
|
|
|
166
176
|
## 转场决策
|
|
@@ -187,6 +197,49 @@ export const router = createStackRouter({
|
|
|
187
197
|
- `stack`:由 `stackRouter.push/back/popTo/resetRoot` 等库 API 触发。
|
|
188
198
|
- `external`:由浏览器 history 或系统手势等外部来源触发。
|
|
189
199
|
|
|
200
|
+
## 页面内历史状态
|
|
201
|
+
|
|
202
|
+
图片预览、抽屉等没有独立 URL 的界面,可以通过 `usePageHistoryState` 接入浏览器历史。
|
|
203
|
+
它必须在 `RouterOutlet` 管理的页面或后代组件的 `setup()` 中调用;`key` 在同一个页面实例内必须唯一。
|
|
204
|
+
|
|
205
|
+
```ts
|
|
206
|
+
import { ref } from "vue";
|
|
207
|
+
import { usePageHistoryState } from "@lazycatcloud/vue-router-stack";
|
|
208
|
+
|
|
209
|
+
const visible = ref(false);
|
|
210
|
+
const selectedId = ref("");
|
|
211
|
+
const historyState = usePageHistoryState<string>({
|
|
212
|
+
key: "detail",
|
|
213
|
+
onChange(state) {
|
|
214
|
+
visible.value = state.active;
|
|
215
|
+
if (state.active) selectedId.value = state.value;
|
|
216
|
+
},
|
|
217
|
+
});
|
|
218
|
+
|
|
219
|
+
function open(id: string) {
|
|
220
|
+
selectedId.value = id;
|
|
221
|
+
visible.value = true;
|
|
222
|
+
historyState.pushState(id);
|
|
223
|
+
}
|
|
224
|
+
|
|
225
|
+
function close() {
|
|
226
|
+
visible.value = false;
|
|
227
|
+
historyState.removeState();
|
|
228
|
+
}
|
|
229
|
+
```
|
|
230
|
+
|
|
231
|
+
- `pushState(value)` 增加同 URL 的历史条目,同一状态重复打开不会重复入栈。
|
|
232
|
+
- `removeState()` 消耗当前状态的历史条目;关闭后立即打开或导航,会先等待本次历史返回完成。
|
|
233
|
+
- `replaceState(value)` 更新当前条目的数据,不增加返回步骤,例如详情内切换图片。
|
|
234
|
+
- `onChange` 接收浏览器后退和前进产生的开关通知。主动调用上述方法不会重复通知业务。
|
|
235
|
+
- `active` 表示这个状态是否打开;`isCurrentPage` 表示所属页面实例是否在前台,可用于控制快捷键和媒体播放。
|
|
236
|
+
|
|
237
|
+
同 URL 的页面内状态不创建页面栈实例,也不触发路由守卫、路由完成回调和页面转场。
|
|
238
|
+
只有通过这个接口登记的状态才使用这条规则,普通同 URL 历史仍交给 Vue Router 处理。
|
|
239
|
+
状态绑定具体页面实例,页面缓存期间保持;组件销毁时注销,并清理它拥有的状态。
|
|
240
|
+
状态数据属于当前运行会话,不用于刷新恢复或可分享链接;需要这些能力时应使用独立路由。
|
|
241
|
+
支持浏览器 history 和 hash history,也可用于 memory history。
|
|
242
|
+
|
|
190
243
|
## 页面生命周期
|
|
191
244
|
|
|
192
245
|
页面被栈缓存时不会频繁卸载,可以使用页面生命周期处理进入和离开:
|
|
@@ -16,6 +16,7 @@ interface ViewItem {
|
|
|
16
16
|
export declare const RouterOutlet: import("vue").DefineComponent<{}, {
|
|
17
17
|
injectedRoute: import("vue-router").RouteLocationNormalizedLoadedGeneric;
|
|
18
18
|
viewItems: import("vue").ShallowRef<ViewItem[], ViewItem[]>;
|
|
19
|
+
activeViewId: Ref<string, string>;
|
|
19
20
|
registerStackPage: (viewItem: ViewItem, element: HTMLElement) => void;
|
|
20
21
|
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
|
|
21
22
|
export {};
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
import { type ComputedRef, type PropType } from "vue";
|
|
2
|
+
import type { RouteInfo } from "../router/types";
|
|
3
|
+
export interface StackPageScope {
|
|
4
|
+
id: string;
|
|
5
|
+
routeId: ComputedRef<string>;
|
|
6
|
+
fullPath: ComputedRef<string>;
|
|
7
|
+
routeIds: ComputedRef<ReadonlySet<string>>;
|
|
8
|
+
isActive: ComputedRef<boolean>;
|
|
9
|
+
}
|
|
10
|
+
export declare function useStackPageScope(): StackPageScope;
|
|
11
|
+
export declare const StackPageScope: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
|
|
12
|
+
id: {
|
|
13
|
+
type: StringConstructor;
|
|
14
|
+
required: true;
|
|
15
|
+
};
|
|
16
|
+
routeInfo: {
|
|
17
|
+
type: PropType<RouteInfo>;
|
|
18
|
+
required: true;
|
|
19
|
+
};
|
|
20
|
+
routeIds: {
|
|
21
|
+
type: PropType<Set<string>>;
|
|
22
|
+
required: true;
|
|
23
|
+
};
|
|
24
|
+
active: {
|
|
25
|
+
type: BooleanConstructor;
|
|
26
|
+
required: true;
|
|
27
|
+
};
|
|
28
|
+
}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
|
29
|
+
[key: string]: any;
|
|
30
|
+
}>[], {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
|
|
31
|
+
id: {
|
|
32
|
+
type: StringConstructor;
|
|
33
|
+
required: true;
|
|
34
|
+
};
|
|
35
|
+
routeInfo: {
|
|
36
|
+
type: PropType<RouteInfo>;
|
|
37
|
+
required: true;
|
|
38
|
+
};
|
|
39
|
+
routeIds: {
|
|
40
|
+
type: PropType<Set<string>>;
|
|
41
|
+
required: true;
|
|
42
|
+
};
|
|
43
|
+
active: {
|
|
44
|
+
type: BooleanConstructor;
|
|
45
|
+
required: true;
|
|
46
|
+
};
|
|
47
|
+
}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import type { PageHistoryState, PageHistoryValue } from "../router/pageHistory";
|
|
2
|
+
export interface UsePageHistoryStateOptions<T extends PageHistoryValue> {
|
|
3
|
+
/** Unique within a page instance. */
|
|
4
|
+
key: string;
|
|
5
|
+
/** Browser back/forward changes; programmatic pushes/removals do not echo. */
|
|
6
|
+
onChange: (state: PageHistoryState<T>) => void;
|
|
7
|
+
}
|
|
8
|
+
export declare function usePageHistoryState<T extends PageHistoryValue>(options: UsePageHistoryStateOptions<T>): {
|
|
9
|
+
active: Readonly<import("vue").Ref<boolean, boolean>>;
|
|
10
|
+
isCurrentPage: import("vue").ComputedRef<boolean>;
|
|
11
|
+
pushState: (value: T) => void;
|
|
12
|
+
removeState: () => void;
|
|
13
|
+
replaceState: (value: T) => void;
|
|
14
|
+
};
|
package/dist/index.d.ts
CHANGED
|
@@ -1,10 +1,12 @@
|
|
|
1
1
|
import "./styles/core.css";
|
|
2
|
-
export { createStackRouter, stackRouterKey
|
|
2
|
+
export { createStackRouter, stackRouterKey } from "./router/createStackRouter";
|
|
3
3
|
export { type RouteAction, type RouteDirection, type RouteInfo, type StackNavigationOptions, type StackNavigationSource, type StackRouter, type StackRouterNavigation, type StackRouterOptions, type StackShouldTransition, type StackShouldTransitionContext, type StackTransitionContext, type StackTransitionDefinition, type StackTransitionFactory, type StackTransitionName, type StackTransitionRegistry, type StackVueRouter, } from "./router/types";
|
|
4
4
|
export { defineStackTransition } from "./router/transitions";
|
|
5
5
|
export { RouterOutlet } from "./components/RouterOutlet";
|
|
6
6
|
export { RouterPage } from "./components/RouterPage";
|
|
7
7
|
export { StackRouterDebugPanel } from "./components/StackRouterDebugPanel";
|
|
8
|
-
export { useStackRouter, type UseStackRouterResult } from "./composables/useStackRouter";
|
|
8
|
+
export { useStackRouter, type UseStackRouterResult, } from "./composables/useStackRouter";
|
|
9
|
+
export { usePageHistoryState, type UsePageHistoryStateOptions, } from "./composables/usePageHistoryState";
|
|
10
|
+
export { type PageHistoryState, type PageHistoryValue, } from "./router/pageHistory";
|
|
9
11
|
export { onPageDidEnter, onPageDidLeave, onPageWillEnter, onPageWillLeave, } from "./composables/lifecycle";
|
|
10
12
|
export { createWebHashHistory, createWebHistory, createMemoryHistory, RouterLink, RouterView, useRoute, useRouter, } from "vue-router";
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import type { HistoryState, RouterHistory } from "vue-router";
|
|
2
|
+
import type { InjectionKey } from "vue";
|
|
3
|
+
import type { StackPageScope } from "../components/StackPageScope";
|
|
4
|
+
export declare const pageHistoryKey: InjectionKey<PageHistory>;
|
|
5
|
+
export type PageHistoryValue = HistoryState[string];
|
|
6
|
+
export type PageHistoryState<T extends PageHistoryValue> = {
|
|
7
|
+
active: false;
|
|
8
|
+
} | {
|
|
9
|
+
active: true;
|
|
10
|
+
value: T;
|
|
11
|
+
};
|
|
12
|
+
interface Registration {
|
|
13
|
+
scope: StackPageScope;
|
|
14
|
+
key: string;
|
|
15
|
+
active: boolean;
|
|
16
|
+
value: PageHistoryValue;
|
|
17
|
+
change: (state: PageHistoryState<PageHistoryValue>, notify: boolean) => void;
|
|
18
|
+
}
|
|
19
|
+
/** Page-local history entries share a URL, but never become route-stack entries. */
|
|
20
|
+
export declare function createPageHistory(history: RouterHistory, onStateNavigation: () => void, onPositionChange: (position: number) => void): {
|
|
21
|
+
readonly position: number;
|
|
22
|
+
whenSettled: () => Promise<void>;
|
|
23
|
+
restoreCurrent(): void;
|
|
24
|
+
register(scope: StackPageScope, key: string, change: Registration["change"]): {
|
|
25
|
+
push: (value: PageHistoryValue) => void;
|
|
26
|
+
remove: () => void;
|
|
27
|
+
replace(value: PageHistoryValue): void;
|
|
28
|
+
restore(): void;
|
|
29
|
+
dispose(): void;
|
|
30
|
+
};
|
|
31
|
+
};
|
|
32
|
+
export type PageHistory = ReturnType<typeof createPageHistory>;
|
|
33
|
+
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("vue"),k=require("vue-router"),Y={};function X(e="route"){const a=(Y[e]??0)+1;return Y[e]=a,`${e}-${a}`}const Q="slide",oe="cubic-bezier(0.3, 0, 0.66, 1)";function ne(e){return e}const ae=({direction:e})=>e==="back"?{leaving:[{transform:"translateX(0)"},{transform:"translateX(100%)"}]}:{entering:[{transform:"translateX(100%)"},{transform:"translateX(0)"}]},ce=()=>({entering:[{opacity:0},{opacity:1}],leaving:[{opacity:1},{opacity:0}]}),ie=({direction:e})=>{const a=e==="back";return{entering:a?[{transform:"scale(0.98)",opacity:0},{transform:"scale(1)",opacity:1}]:[{transform:"scale(1.04)",opacity:0},{transform:"scale(1)",opacity:1}],leaving:a?[{transform:"scale(1)",opacity:1},{transform:"scale(1.04)",opacity:0}]:[{transform:"scale(1)",opacity:1},{transform:"scale(0.98)",opacity:0}]}},se=()=>({}),ue={slide:ae,fade:ce,scale:ie,none:se};function le(e,a){const c=a[e];return c||a[Q]}function Z(e,a,c){if(!a||!e.animate||Number(c.duration)<=0)return Promise.resolve();const l=e.animate(a,c);return l.finished.then(()=>l.cancel())}async function de(e,a){const c=e(a),l={duration:a.duration,easing:a.easing,fill:"both",...c.options};await Promise.all([Z(a.enteringElement,c.entering,l),Z(a.leavingElement,c.leaving,l)])}const C=Symbol("stack-router");function fe(){const e=window.history.state;return typeof(e==null?void 0:e.position)=="number"?e.position:window.history.length}function q(e,a){return a||(e==="pop"?"back":e==="replace"?"none":"forward")}function he(e){const a=k.createRouter(e),c=[],l=u.shallowRef(),f=e.transitionDuration??210,g=e.transitionEasing??oe,w=e.transition??Q,y={...ue,...e.transitions},P=e.maxStackSize??30;let h=-1,s,E=!1;const b=(n,r,i,d,m=!1,R="stack")=>{s={action:n,direction:q(n,r),source:R,delta:i,reuse:d==null?void 0:d.reuse,transition:d==null?void 0:d.transition,duration:d==null?void 0:d.duration,easing:d==null?void 0:d.easing,resetRoot:m}},K=(n,r)=>{const i=(s==null?void 0:s.action)??"push",d=q(i,s==null?void 0:s.direction),m=l.value,R=i==="push"&&d==="forward",M=T(n);return{id:X("route"),key:n.fullPath,fullPath:n.fullPath,pathname:n.path,params:n.params,query:n.query,action:i,direction:d,reuse:(s==null?void 0:s.reuse)??!1,source:(s==null?void 0:s.source)??"stack",entryDirection:d,lastPathname:(m==null?void 0:m.pathname)||(r.name?r.path:void 0),pushedByRoute:R?m==null?void 0:m.pathname:m==null?void 0:m.pushedByRoute,position:fe(),delta:s==null?void 0:s.delta,transition:(s==null?void 0:s.transition)??w,transitionDuration:(s==null?void 0:s.duration)??f,transitionEasing:(s==null?void 0:s.easing)??g,cache:M}},T=n=>{const r=n.meta.stack;return n.meta.stackCache!==!1&&(r==null?void 0:r.cache)!==!1},W=()=>{if(P<=0||c.length<=P)return;const n=c.length-P;c.splice(0,n),h=Math.max(0,h-n)},G=n=>{if(n.action==="pop"){let r=-1;if(n.direction==="forward"||(n.delta??0)>0){for(let i=h+1;i<c.length;i++)if(c[i].key===n.key){r=i;break}}else for(let i=h-1;i>=0;i--)if(c[i].key===n.key){r=i;break}if(r>=0){const i=c[r];c[r]={...i,...n,id:i.id,reuse:i.reuse,source:n.source,entryDirection:i.entryDirection,transition:i.transition,transitionDuration:i.transitionDuration,transitionEasing:i.transitionEasing},h=r}else c.push({...n,direction:"none",entryDirection:"none",transition:"none",isStackFallback:!0}),h=c.length-1}else if(n.action==="replace"){if(s!=null&&s.resetRoot){c.splice(0,c.length,n),h=0,l.value=c[h];return}h>=0?c[h]=n:(c.push(n),h=0)}else h<c.length-1&&c.splice(h+1),c.push(n),h=c.length-1;W(),l.value=c[h]};e.history.listen((n,r,i)=>{const d="delta"in i?i.delta:void 0,m=i.direction==="back"?"back":i.direction==="forward"?"forward":void 0;s?(s.delta=d,s.direction=q(s.action,s.direction??m)):b(i.type==="pop"?"pop":i.type,m,d,void 0,!1,"external")}),a.beforeEach(n=>!((s==null?void 0:s.action)==="pop"&&E&&!c.some(r=>r.fullPath===n.fullPath))),a.afterEach((n,r,i)=>{if(i){s=void 0;return}G(K(n,r)),s=void 0});const L=a.push.bind(a),I=a.replace.bind(a),$=a.back.bind(a),x=a.forward.bind(a),z=a.go.bind(a),A=(n,r)=>(b("push",(r==null?void 0:r.direction)??"forward",void 0,r),L(n)),j=(n,r)=>(b("replace",(r==null?void 0:r.direction)??"root",void 0,r),I(n)),B=(n,r)=>{const i=a.resolve(n).fullPath;let d=-1;for(let R=h;R>=0;R--)if(c[R].fullPath===i){d=R;break}if(d<0)return!1;const m=d-h;return m===0||(b("pop",(r==null?void 0:r.direction)??"back",m,r),z(m)),!0},V=(n,r)=>{const i=a.resolve(n).fullPath;if(h>=0&&a.currentRoute.value.fullPath===i){const d=c[h],m={...d,id:X("route"),action:"replace",direction:(r==null?void 0:r.direction)??"root",source:"stack",entryDirection:(r==null?void 0:r.direction)??"root",delta:void 0,reuse:(r==null?void 0:r.reuse)??d.reuse,transition:(r==null?void 0:r.transition)??d.transition,transitionDuration:(r==null?void 0:r.duration)??d.transitionDuration,transitionEasing:(r==null?void 0:r.easing)??d.transitionEasing,cache:!0,isStackFallback:!1};return c.splice(0,c.length,m),h=0,E=!0,l.value=m,Promise.resolve(void 0)}return b("replace",(r==null?void 0:r.direction)??"root",void 0,r,!0),E=!0,I(n)},_=()=>{b("pop","back",-1),$()},H=()=>{b("pop","forward",1),x()},p=a;p.push=A,p.replace=j,p.popTo=B,p.resetRoot=V,p.back=_,p.forward=H;const t={router:p,transitionDuration:f,transitionEasing:g,transition:w,transitions:y,maxStackSize:P,shouldTransition:e.shouldTransition,current:l,get history(){return c},canGoBack:(n=1)=>h-n>=0,push:A,replace:j,popTo:B,resetRoot:V,back:_,forward:H},o=a.install.bind(a);return a.install=n=>{n.provide(C,t),o(n)},p}const v="onPageWillEnter",J="onPageDidEnter",N="onPageWillLeave",O="onPageDidLeave";function me(e,a,c){if(!c)throw new Error(`${e} must be called inside setup().`);const l=c.proxy,f=l[e]??[];f.push(()=>{c.isUnmounted||a()}),l[e]=f,c.exposed&&(c.exposed[e]=f)}function F(e){return(a,c=u.getCurrentInstance())=>me(e,a,c)}const ye=F(v),ke=F(J),Re=F(N),be=F(O);function pe(){const e=u.inject(C);if(!e)throw new Error("useStackRouter must be used after createStackRouter().");return{router:e.router,canGoBack:e.canGoBack,push:e.push,replace:e.replace,popTo:e.popTo,resetRoot:e.resetRoot,back:e.back,forward:e.forward}}function ee(){const e=u.inject(C);if(!e)throw new Error("RouterOutlet must be used with createStackRouter().");return e}function S(e,a){const c=e.value;if(!c)return;const l=c[a];Array.isArray(l)?l.forEach(f=>f()):typeof l=="function"&&l.call(c)}function D(e){e.classList.remove("rs-page-hidden","rs-page-invisible"),e.removeAttribute("aria-hidden")}function U(e){e.classList.add("rs-page-hidden"),e.setAttribute("aria-hidden","true")}function te(e){var a;return(a=e.components)==null?void 0:a.default}function Pe(e){const a=te(e);return a!==void 0&&typeof a=="object"&&"name"in a&&a.name==="RouterView"}const we=u.defineComponent({name:"RouterOutlet",setup(){const e=ee(),a=k.useRoute(),c=u.inject(k.routeLocationKey),l=u.inject(k.matchedRouteKey,void 0),f=u.computed(()=>{const t=l==null?void 0:l.value;if(!t)return 0;const o=a.matched.findIndex(n=>n===t);return o>=0?o+1:0}),g=u.computed(()=>a.matched[f.value]),w=u.computed(()=>{for(let t=f.value;t<a.matched.length;t++){const o=a.matched[t];if(!Pe(o))return o}return g.value}),y=u.shallowRef([]),P=u.ref("");let h=0;u.provide(k.matchedRouteKey,w);const s=t=>y.value.find(o=>o.id===t),E=t=>y.value.find(o=>o.routeIds.has(t)),b=t=>y.value.find(o=>o.routeKey===t),K=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?D(o.pageElement):U(o.pageElement))})},W=t=>{const o=e.history.findIndex(r=>r.id===t.routeInfo.id);if(o<0)return;const n=new Set(e.history.slice(0,o+1).map(r=>r.id));y.value.forEach(r=>{r.routeIds=new Set([...r.routeIds].filter(i=>n.has(i)))}),y.value=y.value.filter(r=>r===t||r.routeIds.size>0)},G=t=>{y.value=y.value.filter(o=>o!==t)},L=t=>{const o=new Set(e.history.map(n=>n.id));y.value.forEach(n=>{n.routeIds=new Set([...n.routeIds].filter(r=>o.has(r)))}),y.value=y.value.filter(n=>n===t||n.routeInfo.cache&&n.routeIds.size>0)},I=t=>{var n;const o=t.props.default;return o?o===!0?((n=e.current.value)==null?void 0:n.params)??{}:typeof o=="function"?o(c):o:{}},$=(t,o)=>t.routeInfo.action==="pop"?o.routeInfo.transition??t.routeInfo.transition??e.transition:t.routeInfo.transition??e.transition,x=t=>t.entryDirection==="none"||t.entryDirection==="root"||t.transition==="none",z=(t,o)=>t.routeInfo.direction==="forward"?x(t.routeInfo):x(o.routeInfo),A=(t,o)=>!(t.routeInfo.isStackFallback||t.routeInfo.direction==="none"||t.routeInfo.direction==="root"||t.routeInfo.action==="pop"&&z(t,o)),j=(t,o)=>{var r;const n=A(t,o);return((r=e.shouldTransition)==null?void 0:r.call(e,{action:t.routeInfo.action,direction:t.routeInfo.direction,source:t.routeInfo.source,entering:t.routeInfo,leaving:o.routeInfo,defaultResult:n}))??n},B=(t,o)=>t.routeInfo.action==="pop"?o.routeInfo.transitionDuration??t.routeInfo.transitionDuration??e.transitionDuration:t.routeInfo.transitionDuration??e.transitionDuration,V=(t,o)=>t.routeInfo.action==="pop"?o.routeInfo.transitionEasing??t.routeInfo.transitionEasing??e.transitionEasing:t.routeInfo.transitionEasing??e.transitionEasing,_=async(t,o)=>{const n=++h;await u.nextTick();const r=t.pageElement;if(!r)return;if(S(t.componentRef,v),!o||o===t||!o.pageElement){D(r),S(t.componentRef,J),L(t),T(t);return}const i=o.pageElement,d=j(t,o),m=d?$(t,o):"none",R=d?B(t,o):0,M=V(t,o),re=le(m||Q,e.transitions);S(o.componentRef,N),D(r),D(i),await de(re,{direction:t.routeInfo.direction,action:t.routeInfo.action,routeInfo:t.routeInfo,enteringElement:r,leavingElement:i,duration:R,easing:M}),n===h&&(U(i),S(o.componentRef,O),S(t.componentRef,J),t.routeInfo.action==="pop"?W(t):t.routeInfo.action==="replace"&&G(o),L(t),T(t))},H=async()=>{const t=w.value,o=e.current.value;if(!t||!o)return;const n=te(t);if(!n)return;const r=s(P.value);let i=E(o.id);!i&&!K(o)&&(i=b(o.key)),i?(i.routeIds.add(o.id),i.routeKey=o.key,i.routeInfo=o,i.matchedRoute=t,i.component=n,i.props=I(t),i.mounted=!0):(i={id:X("view"),routeKey:o.key,routeIds:new Set([o.id]),routeInfo:o,matchedRoute:t,component:n,props:I(t),componentRef:u.ref(),mounted:!0},y.value=[...y.value,i]),P.value=i.id,await _(i,r)};return u.watch(()=>{var t;return[(t=e.current.value)==null?void 0:t.id,w.value]},()=>{H()},{immediate:!0}),u.onUnmounted(()=>{h++,y.value=[]}),{injectedRoute:c,viewItems:y,registerStackPage:(t,o)=>{t.pageElement=o,t.id===P.value?D(o):U(o)}}},render(){return u.h("div",{class:"rs-outlet"},this.viewItems.filter(e=>e.mounted).map(e=>u.h(e.component,{key:e.id,ref:e.componentRef,...e.props,registerStackPage:a=>this.registerStackPage(e,a)})))}}),Ee=u.defineComponent({name:"RouterPage",props:{registerStackPage:{type:Function,default:void 0}},setup(e,{attrs:a,slots:c}){const l=u.ref();return u.onMounted(()=>{var f;l.value&&((f=e.registerStackPage)==null||f.call(e,l.value))}),()=>{var f;return u.h("section",{...a,ref:l,class:["rs-page",a.class]},(f=c.default)==null?void 0:f.call(c))}}}),Ie=u.defineComponent({name:"StackRouterDebugPanel",props:{initialOpen:{type:Boolean,default:!1}},setup(e){const a=ee(),c=u.ref(e.initialOpen);return()=>{const l=a.current.value;return u.h("aside",{class:"rs-debug-panel"},[u.h("button",{class:"rs-debug-toggle",type:"button",onClick:()=>{c.value=!c.value}},c.value?"Stack x":"Stack"),c.value?u.h("section",{class:"rs-debug-body"},[u.h("header",[u.h("strong","Router Stack"),u.h("span",`${a.history.length} pages`)]),u.h("dl",[u.h("dt","current"),u.h("dd",(l==null?void 0:l.fullPath)??"-"),u.h("dt","canGoBack"),u.h("dd",String(a.canGoBack()))]),u.h("ol",a.history.map(f=>u.h("li",{key:f.id,class:{"rs-debug-active":f.id===(l==null?void 0:l.id),"rs-debug-no-cache":!f.cache}},[u.h("code",f.fullPath),u.h("span",[`${f.action}/${f.direction}`,` source:${f.source}`,` entry:${f.entryDirection}`,` cache:${f.cache?"yes":"no"}`,` transition:${f.transition??"-"}`])])))]):void 0])}}});Object.defineProperty(exports,"RouterLink",{enumerable:!0,get:()=>k.RouterLink});Object.defineProperty(exports,"RouterView",{enumerable:!0,get:()=>k.RouterView});Object.defineProperty(exports,"createMemoryHistory",{enumerable:!0,get:()=>k.createMemoryHistory});Object.defineProperty(exports,"createWebHashHistory",{enumerable:!0,get:()=>k.createWebHashHistory});Object.defineProperty(exports,"createWebHistory",{enumerable:!0,get:()=>k.createWebHistory});Object.defineProperty(exports,"useRoute",{enumerable:!0,get:()=>k.useRoute});Object.defineProperty(exports,"useRouter",{enumerable:!0,get:()=>k.useRouter});exports.RouterOutlet=we;exports.RouterPage=Ee;exports.StackRouterDebugPanel=Ie;exports.createStackRouter=he;exports.defineStackTransition=ne;exports.onPageDidEnter=ke;exports.onPageDidLeave=be;exports.onPageWillEnter=ye;exports.onPageWillLeave=Re;exports.stackRouterKey=C;exports.useStackRouter=pe;
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("vue"),D=require("vue-router"),Z={};function M(e="route"){const r=(Z[e]??0)+1;return Z[e]=r,`${e}-${r}`}const U="__stack_page_state__",O=Symbol("stack-page-history");function ae(e,r){return e.states.length===r.states.length&&e.states.every((i,p)=>{const h=r.states[p];return i.ownerId===h.ownerId&&i.key===h.key&&Object.is(i.value,h.value)})}function ce(e,r,i){const p=e.push.bind(e),h=e.replace.bind(e),E=e.go.bind(e),T=e.listen.bind(e),w=e.destroy.bind(e),k=new Set,c=new Map,P=new Map,R=new Set,y=new Set,I=new Map,x=[];let S=0,A=0;const L=a=>{const f=a[U];return typeof f=="string"&&c.has(f)?f:""},v=()=>P.has(S)?P.get(S):"",_=()=>{const a=new Set(P.values());for(const f of c.keys())a.has(f)||c.delete(f)},H=a=>{const f=M("page-state");return c.set(f,a),{[U]:f}},B=(a,f,t)=>{const o=f.states.findIndex(n=>n.ownerId===a.scope.id&&n.key===a.key),l=o>=0,s=a.active!==l||l&&!Object.is(a.value,f.states[o].value);a.active=l,l&&(a.value=f.states[o].value),a.change(l?{active:!0,value:f.states[o].value}:{active:!1},t&&s)},C=(a,f)=>{for(const t of R)t.scope.routeIds.value.has(a.routeId)&&B(t,a,f)};e.push=(a,f={})=>{p(a,f),S++;for(const t of P.keys())t>S&&P.delete(t);P.set(S,L(f)),_()},e.replace=(a,f={})=>{h(a,{...f,[U]:L(f)}),P.set(S,L(f)),_()},e.go=(a,f=!0)=>{f||(S+=a),E(a,f)},e.listen=a=>(k.add(a),()=>k.delete(a));const V=a=>{for(const t of a)y.delete(t);if(y.size>0)return;const f=[...I];I.clear();for(const[t,o]of f)K(t,o);for(const t of x.splice(0))t()};T((a,f,t)=>{const o=[...y],l=v();S+=t.delta;const s=v();if(a===f&&c.has(l)&&c.has(s)&&c.get(l).routeId===c.get(s).routeId){const d=Math.sign(t.delta);if(o.length===0&&d!==0&&P.has(S+d)&&ae(c.get(l),c.get(s))){A+=t.delta,e.go(d);return}A=0,r(),i(S),C(c.get(s),!0),V(o);return}V(o);const n={...t,delta:t.delta+A};A=0;for(const d of k)d(a,f,n)}),e.destroy=()=>{k.clear(),R.clear(),c.clear(),P.clear(),I.clear(),y.clear();for(const a of x.splice(0))a();w()};function K(a,f){if(!a.scope.isActive.value||e.location!==a.scope.fullPath.value)return;if(y.size>0){I.set(a,f);return}if(a.active)return;const t=a.scope.routeId.value,o=v(),l=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,...H(l)});const s={routeId:t,states:[...l.states,{ownerId:a.scope.id,key:a.key,value:f}]};e.push(e.location,H(s)),i(S),C(s,!1)}function F(a){if(I.delete(a),!a.active)return;a.active=!1,a.change({active:!1},!1);const f=v();if(!a.scope.isActive.value||e.location!==a.scope.fullPath.value||!c.has(f)){j(a);return}const t=c.get(f);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?(y.add(a),e.go(-1)):j(a))}function j(a){for(const f of c.values())f.states=f.states.filter(t=>t.ownerId!==a.scope.id||t.key!==a.key)}return{get position(){return S},whenSettled:()=>y.size===0?Promise.resolve():new Promise(a=>x.push(a)),restoreCurrent(){const a=v();c.has(a)&&C(c.get(a),!0)},register(a,f,t){for(const l of R)if(l.scope===a&&l.key===f)throw new Error(`Duplicate page history state key: ${f}`);const o={scope:a,key:f,active:!1,value:null,change:t};return R.add(o),{push:l=>K(o,l),remove:()=>F(o),replace(l){const s=v();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(d=>d.ownerId===a.id&&d.key===f?{...d,value:l}:d),B(o,n,!1)},restore(){const l=v();c.has(l)&&a.routeIds.value.has(c.get(l).routeId)&&B(o,c.get(l),!0)},dispose(){F(o),R.delete(o),I.delete(o),j(o)}}}}}const Y="slide",ue="cubic-bezier(0.3, 0, 0.66, 1)";function ie(e){return e}const le=({direction:e})=>e==="back"?{leaving:[{transform:"translateX(0)"},{transform:"translateX(100%)"}]}:{entering:[{transform:"translateX(100%)"},{transform:"translateX(0)"}]},de=()=>({entering:[{opacity:0},{opacity:1}],leaving:[{opacity:1},{opacity:0}]}),fe=({direction:e})=>{const r=e==="back";return{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:r?[{transform:"scale(1)",opacity:1},{transform:"scale(1.04)",opacity:0}]:[{transform:"scale(1)",opacity:1},{transform:"scale(0.98)",opacity:0}]}},he=()=>({}),pe={slide:le,fade:de,scale:fe,none:he};function ke(e,r){const i=r[e];return i||r[Y]}function N(e,r,i){if(!r||!e.animate||Number(i.duration)<=0)return Promise.resolve();const p=e.animate(r,i);return p.finished.then(()=>p.cancel())}async function me(e,r){const i=e(r),p={duration:r.duration,easing:r.easing,fill:"both",...i.options};await Promise.all([N(r.enteringElement,i.entering,p),N(r.leavingElement,i.leaving,p)])}const $=Symbol("stack-router");function X(e,r){return r||(e==="pop"?"back":e==="replace"?"none":"forward")}function ye(e){const r=[],i=u.shallowRef(),p=e.transitionDuration??210,h=e.transitionEasing??ue,E=e.transition??Y,T={...pe,...e.transitions},w=e.maxStackSize??30;let k=-1,c,P=!1;const R=ce(e.history,()=>{c=void 0},s=>{k>=0&&(r[k].position=s)}),y=D.createRouter(e),I=(s,n,d,m,b=!1,g="stack")=>{c={action:s,direction:X(s,n),source:g,delta:d,reuse:m==null?void 0:m.reuse,transition:m==null?void 0:m.transition,duration:m==null?void 0:m.duration,easing:m==null?void 0:m.easing,resetRoot:b}},x=(s,n)=>{const d=(c==null?void 0:c.action)??"push",m=X(d,c==null?void 0:c.direction),b=i.value,g=d==="push"&&m==="forward",q=S(s);return{id:M("route"),key:s.fullPath,fullPath:s.fullPath,pathname:s.path,params:s.params,query:s.query,action:d,direction:m,reuse:(c==null?void 0:c.reuse)??!1,source:(c==null?void 0:c.source)??"stack",entryDirection:m,lastPathname:(b==null?void 0:b.pathname)||(n.name?n.path:void 0),pushedByRoute:g?b==null?void 0:b.pathname:b==null?void 0:b.pushedByRoute,position:R.position,delta:c==null?void 0:c.delta,transition:(c==null?void 0:c.transition)??E,transitionDuration:(c==null?void 0:c.duration)??p,transitionEasing:(c==null?void 0:c.easing)??h,cache:q}},S=s=>{const n=s.meta.stack;return s.meta.stackCache!==!1&&(n==null?void 0:n.cache)!==!1},A=()=>{if(w<=0||r.length<=w)return;const s=r.length-w;r.splice(0,s),k=Math.max(0,k-s)},L=s=>{if(s.action==="pop"){let n=-1;if(s.direction==="forward"||(s.delta??0)>0){for(let d=k+1;d<r.length;d++)if(r[d].key===s.key){n=d;break}}else for(let d=k-1;d>=0;d--)if(r[d].key===s.key){n=d;break}if(n>=0){const d=r[n];r[n]={...d,...s,id:d.id,reuse:d.reuse,source:s.source,entryDirection:d.entryDirection,transition:d.transition,transitionDuration:d.transitionDuration,transitionEasing:d.transitionEasing},k=n}else r.push({...s,direction:"none",entryDirection:"none",transition:"none",isStackFallback:!0}),k=r.length-1}else if(s.action==="replace"){if(c!=null&&c.resetRoot){r.splice(0,r.length,s),k=0,i.value=r[k];return}k>=0?r[k]=s:(r.push(s),k=0)}else k<r.length-1&&r.splice(k+1),r.push(s),k=r.length-1;A(),i.value=r[k]};e.history.listen((s,n,d)=>{const m="delta"in d?d.delta:void 0,b=d.direction==="back"?"back":d.direction==="forward"?"forward":void 0;c?(c.delta=m,c.direction=X(c.action,c.direction??b)):I(d.type==="pop"?"pop":d.type,b,m,void 0,!1,"external")}),y.beforeEach(s=>!((c==null?void 0:c.action)==="pop"&&P&&!r.some(n=>n.fullPath===s.fullPath))),y.afterEach((s,n,d)=>{if(d){c=void 0;return}L(x(s,n)),c=void 0,R.restoreCurrent()});const v=y.push.bind(y),_=y.replace.bind(y),H=y.back.bind(y),B=y.forward.bind(y),C=y.go.bind(y),V=async(s,n)=>(await R.whenSettled(),I("push",(n==null?void 0:n.direction)??"forward",void 0,n),v(s)),K=async(s,n)=>(await R.whenSettled(),I("replace",(n==null?void 0:n.direction)??"root",void 0,n),_(s)),F=(s,n)=>{const d=y.resolve(s).fullPath;let m=-1;for(let g=k;g>=0;g--)if(r[g].fullPath===d){m=g;break}if(m<0)return!1;const b=r[m];return R.whenSettled().then(()=>{const g=b.position-R.position;g!==0&&(I("pop",(n==null?void 0:n.direction)??"back",g,n),C(g))}),!0},j=async(s,n)=>{await R.whenSettled();const d=y.resolve(s).fullPath;if(k>=0&&y.currentRoute.value.fullPath===d){const m=r[k],b={...m,id:M("route"),action:"replace",direction:(n==null?void 0:n.direction)??"root",source:"stack",entryDirection:(n==null?void 0:n.direction)??"root",delta:void 0,reuse:(n==null?void 0:n.reuse)??m.reuse,transition:(n==null?void 0:n.transition)??m.transition,transitionDuration:(n==null?void 0:n.duration)??m.transitionDuration,transitionEasing:(n==null?void 0:n.easing)??m.transitionEasing,cache:!0,isStackFallback:!1};return r.splice(0,r.length,b),k=0,P=!0,i.value=b,Promise.resolve(void 0)}return I("replace",(n==null?void 0:n.direction)??"root",void 0,n,!0),P=!0,_(s)},a=()=>{R.whenSettled().then(()=>{I("pop","back",-1),H()})},f=()=>{R.whenSettled().then(()=>{I("pop","forward",1),B()})},t=y;t.push=V,t.replace=K,t.popTo=F,t.resetRoot=j,t.back=a,t.forward=f;const o={router:t,transitionDuration:p,transitionEasing:h,transition:E,transitions:T,maxStackSize:w,shouldTransition:e.shouldTransition,current:i,get history(){return r},canGoBack:(s=1)=>k-s>=0,push:V,replace:K,popTo:F,resetRoot:j,back:a,forward:f},l=y.install.bind(y);return y.install=s=>{s.provide($,o),s.provide(O,R),l(s)},t}const ee="onPageWillEnter",Q="onPageDidEnter",te="onPageWillLeave",oe="onPageDidLeave";function we(e,r,i){if(!i)throw new Error(`${e} must be called inside setup().`);const p=i.proxy,h=p[e]??[];h.push(()=>{i.isUnmounted||r()}),p[e]=h,i.exposed&&(i.exposed[e]=h)}function z(e){return(r,i=u.getCurrentInstance())=>we(e,r,i)}const be=z(ee),Re=z(Q),Ie=z(te),Se=z(oe);function Pe(){const e=u.inject($);if(!e)throw new Error("useStackRouter must be used after createStackRouter().");return{router:e.router,canGoBack:e.canGoBack,push:e.push,replace:e.replace,popTo:e.popTo,resetRoot:e.resetRoot,back:e.back,forward:e.forward}}function re(){const e=u.inject($);if(!e)throw new Error("RouterOutlet must be used with createStackRouter().");return e}function G(e,r){const i=e.value;if(!i)return;const p=i[r];Array.isArray(p)?p.forEach(h=>h()):typeof p=="function"&&p.call(i)}const ne=Symbol("stack-page-scope");function ge(){const e=u.inject(ne);if(!e)throw new Error("Page history state must be used inside RouterOutlet.");return e}const Ee=u.defineComponent({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 i=u.ref(!1);return u.onBeforeUnmount(()=>{i.value=!0}),u.provide(ne,{id:e.id,routeId:u.computed(()=>e.routeInfo.id),fullPath:u.computed(()=>e.routeInfo.fullPath),routeIds:u.computed(()=>e.routeIds),isActive:u.computed(()=>e.active&&!i.value)}),()=>r.default()}});function W(e){e.classList.remove("rs-page-hidden","rs-page-invisible"),e.removeAttribute("aria-hidden")}function J(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 se(e){var r;return(r=e.components)==null?void 0:r.default}function ve(e){const r=se(e);return r!==void 0&&typeof r=="object"&&"name"in r&&r.name==="RouterView"}const De=u.defineComponent({name:"RouterOutlet",setup(){const e=re(),r=D.useRoute(),i=u.inject(D.routeLocationKey),p=u.inject(D.matchedRouteKey,void 0),h=u.computed(()=>{const t=p==null?void 0:p.value;if(!t)return 0;const o=r.matched.findIndex(l=>l===t);return o>=0?o+1:0}),E=u.computed(()=>r.matched[h.value]),T=u.computed(()=>{for(let t=h.value;t<r.matched.length;t++){const o=r.matched[t];if(!ve(o))return o}return E.value}),w=u.shallowRef([]),k=u.ref("");let c=0;u.provide(D.matchedRouteKey,T);const P=t=>w.value.find(o=>o.id===t),R=t=>w.value.find(o=>o.routeIds.has(t)),y=t=>w.value.find(o=>o.routeKey===t),I=t=>t.action==="push"&&t.direction==="forward"&&!t.reuse&&w.value.some(o=>o.routeKey===t.key),x=t=>{w.value.forEach(o=>{o.pageElement&&(o===t?W(o.pageElement):J(o.pageElement))})},S=t=>{const o=e.history.findIndex(s=>s.id===t.routeInfo.id);if(o<0)return;const l=new Set(e.history.slice(0,o+1).map(s=>s.id));w.value.forEach(s=>{s.routeIds=new Set([...s.routeIds].filter(n=>l.has(n)))}),w.value=w.value.filter(s=>s===t||s.routeIds.size>0)},A=t=>{w.value=w.value.filter(o=>o!==t)},L=t=>{const o=new Set(e.history.map(l=>l.id));w.value.forEach(l=>{l.routeIds=new Set([...l.routeIds].filter(s=>o.has(s)))}),w.value=w.value.filter(l=>l===t||l.routeInfo.cache&&l.routeIds.size>0)},v=t=>{var l;const o=t.props.default;return o?o===!0?((l=e.current.value)==null?void 0:l.params)??{}:typeof o=="function"?o(i):o:{}},_=(t,o)=>t.routeInfo.action==="pop"?o.routeInfo.transition??t.routeInfo.transition??e.transition:t.routeInfo.transition??e.transition,H=t=>t.entryDirection==="none"||t.entryDirection==="root"||t.transition==="none",B=(t,o)=>t.routeInfo.direction==="forward"?H(t.routeInfo):H(o.routeInfo),C=(t,o)=>!(t.routeInfo.isStackFallback||t.routeInfo.direction==="none"||t.routeInfo.direction==="root"||t.routeInfo.action==="pop"&&B(t,o)),V=(t,o)=>{var s;const l=C(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:o.routeInfo,defaultResult:l}))??l},K=(t,o)=>t.routeInfo.action==="pop"?o.routeInfo.transitionDuration??t.routeInfo.transitionDuration??e.transitionDuration:t.routeInfo.transitionDuration??e.transitionDuration,F=(t,o)=>t.routeInfo.action==="pop"?o.routeInfo.transitionEasing??t.routeInfo.transitionEasing??e.transitionEasing:t.routeInfo.transitionEasing??e.transitionEasing,j=async(t,o)=>{const l=++c;await u.nextTick();const s=t.pageElement;if(!s)return;if(G(t.componentRef,ee),!o||o===t||!o.pageElement){W(s),G(t.componentRef,Q),L(t),x(t);return}const n=o.pageElement,d=V(t,o),m=d?_(t,o):"none",b=d?K(t,o):0,g=F(t,o),q=ke(m||Y,e.transitions);G(o.componentRef,te),W(s),W(n),await me(q,{direction:t.routeInfo.direction,action:t.routeInfo.action,routeInfo:t.routeInfo,enteringElement:s,leavingElement:n,duration:b,easing:g}),l===c&&(J(n),G(o.componentRef,oe),G(t.componentRef,Q),t.routeInfo.action==="pop"?S(t):t.routeInfo.action==="replace"&&A(o),L(t),x(t))},a=async()=>{const t=T.value,o=e.current.value;if(!t||!o)return;const l=se(t);if(!l)return;const s=P(k.value);let n=R(o.id);!n&&!I(o)&&(n=y(o.key)),n?(n.routeIds.add(o.id),n.routeKey=o.key,n.routeInfo=o,n.matchedRoute=t,n.component=l,n.props=v(t),n.mounted=!0):(n={id:M("view"),routeKey:o.key,routeIds:new Set([o.id]),routeInfo:o,matchedRoute:t,component:l,props:v(t),componentRef:u.ref(),mounted:!0},w.value=[...w.value,n]),k.value=n.id,await j(n,s)};return u.watch(()=>{var t;return[(t=e.current.value)==null?void 0:t.id,T.value]},()=>{a()},{immediate:!0}),u.onUnmounted(()=>{c++,w.value=[]}),{injectedRoute:i,viewItems:w,activeViewId:k,registerStackPage:(t,o)=>{t.pageElement=o,t.id===k.value?W(o):J(o)}}},render(){return u.h("div",{class:"rs-outlet"},this.viewItems.filter(e=>e.mounted).map(e=>u.h(Ee,{key:e.id,id:e.id,routeInfo:e.routeInfo,routeIds:e.routeIds,active:e.id===this.activeViewId},{default:()=>u.h(e.component,{ref:e.componentRef,...e.props,registerStackPage:r=>this.registerStackPage(e,r)})})))}}),Te=u.defineComponent({name:"RouterPage",props:{registerStackPage:{type:Function,default:void 0}},setup(e,{attrs:r,slots:i}){const p=u.ref();return u.onMounted(()=>{var h;p.value&&((h=e.registerStackPage)==null||h.call(e,p.value))}),()=>{var h;return u.h("section",{...r,ref:p,class:["rs-page",r.class]},(h=i.default)==null?void 0:h.call(i))}}}),xe=u.defineComponent({name:"StackRouterDebugPanel",props:{initialOpen:{type:Boolean,default:!1}},setup(e){const r=re(),i=u.ref(e.initialOpen);return()=>{const p=r.current.value;return u.h("aside",{class:"rs-debug-panel"},[u.h("button",{class:"rs-debug-toggle",type:"button",onClick:()=>{i.value=!i.value}},i.value?"Stack x":"Stack"),i.value?u.h("section",{class:"rs-debug-body"},[u.h("header",[u.h("strong","Router Stack"),u.h("span",`${r.history.length} pages`)]),u.h("dl",[u.h("dt","current"),u.h("dd",(p==null?void 0:p.fullPath)??"-"),u.h("dt","canGoBack"),u.h("dd",String(r.canGoBack()))]),u.h("ol",r.history.map(h=>u.h("li",{key:h.id,class:{"rs-debug-active":h.id===(p==null?void 0:p.id),"rs-debug-no-cache":!h.cache}},[u.h("code",h.fullPath),u.h("span",[`${h.action}/${h.direction}`,` source:${h.source}`,` entry:${h.entryDirection}`,` cache:${h.cache?"yes":"no"}`,` transition:${h.transition??"-"}`])])))]):void 0])}}});function Ae(e){const r=ge(),i=u.inject(O);if(!i)throw new Error("usePageHistoryState must be used after createStackRouter().");const p=u.ref(!1),h=i.register(r,e.key,(E,T)=>{p.value=E.active,T&&e.onChange(E)});return u.onMounted(h.restore),u.onBeforeUnmount(h.dispose),{active:u.readonly(p),isCurrentPage:r.isActive,pushState:E=>h.push(E),removeState:h.remove,replaceState:E=>h.replace(E)}}Object.defineProperty(exports,"RouterLink",{enumerable:!0,get:()=>D.RouterLink});Object.defineProperty(exports,"RouterView",{enumerable:!0,get:()=>D.RouterView});Object.defineProperty(exports,"createMemoryHistory",{enumerable:!0,get:()=>D.createMemoryHistory});Object.defineProperty(exports,"createWebHashHistory",{enumerable:!0,get:()=>D.createWebHashHistory});Object.defineProperty(exports,"createWebHistory",{enumerable:!0,get:()=>D.createWebHistory});Object.defineProperty(exports,"useRoute",{enumerable:!0,get:()=>D.useRoute});Object.defineProperty(exports,"useRouter",{enumerable:!0,get:()=>D.useRouter});exports.RouterOutlet=De;exports.RouterPage=Te;exports.StackRouterDebugPanel=xe;exports.createStackRouter=ye;exports.defineStackTransition=ie;exports.onPageDidEnter=Re;exports.onPageDidLeave=Se;exports.onPageWillEnter=be;exports.onPageWillLeave=Ie;exports.stackRouterKey=$;exports.usePageHistoryState=Ae;exports.useStackRouter=Pe;
|