vue-multi-router 0.1.0 → 0.1.1

package/dist/index.js

@@ -1,4 +1,4 @@
-import { computed, defineComponent, getCurrentInstance, h, inject, onBeforeUnmount, provide, ref, shallowRef } from "vue";
+import { computed, defineComponent, getCurrentInstance, h, inject, onBeforeUnmount, provide, shallowRef, watch } from "vue";
 import { RouterLink, RouterView, createRouter, routeLocationKey, routerKey, routerViewLocationKey, viewDepthKey } from "vue-router";
 
 //#region src/history/storage/types.ts
@@ -23,6 +23,8 @@ function flatMapMaybePromise(value, fn) {
 const STACK_STORAGE_PREFIX = "__multiRouter_stack_";
 const ACTIVE_CONTEXT_STORAGE_KEY = "__multiRouterActiveContext";
 const ACTIVE_HISTORY_CONTEXT_STORAGE_KEY = "__multiRouterActiveHistoryContext";
+const CONTEXT_STACK_STORAGE_KEY = "__multiRouterContextStack";
+const HISTORY_CONTEXT_STACK_STORAGE_KEY = "__multiRouterHistoryContextStack";
 var SessionStorageAdapter = class {
 	getStackStorageKey(contextKey) {
 		return `${STACK_STORAGE_PREFIX}${contextKey}`;
@@ -34,9 +36,7 @@ var SessionStorageAdapter = class {
 				position: stack.position
 			};
 			sessionStorage.setItem(this.getStackStorageKey(contextKey), JSON.stringify(data));
-		} catch (e) {
-			console.warn("[SessionStorageAdapter] Failed to save stack:", e);
-		}
+		} catch (e) {}
 	}
 	restoreStack(contextKey) {
 		try {
@@ -50,24 +50,18 @@ var SessionStorageAdapter = class {
 					position
 				};
 			}
-		} catch (e) {
-			console.warn("[SessionStorageAdapter] Failed to restore stack:", e);
-		}
+		} catch (e) {}
 		return null;
 	}
 	clearStack(contextKey) {
 		try {
 			sessionStorage.removeItem(this.getStackStorageKey(contextKey));
-		} catch (e) {
-			console.warn("[SessionStorageAdapter] Failed to clear stack:", e);
-		}
+		} catch (e) {}
 	}
 	saveActiveContext(contextKey) {
 		try {
 			sessionStorage.setItem(ACTIVE_CONTEXT_STORAGE_KEY, contextKey);
-		} catch (e) {
-			console.warn("[SessionStorageAdapter] Failed to save active context:", e);
-		}
+		} catch (e) {}
 	}
 	getActiveContext() {
 		try {
@@ -76,12 +70,15 @@ var SessionStorageAdapter = class {
 			return null;
 		}
 	}
+	clearActiveContext() {
+		try {
+			sessionStorage.removeItem(ACTIVE_CONTEXT_STORAGE_KEY);
+		} catch (e) {}
+	}
 	saveActiveHistoryContext(contextKey) {
 		try {
 			sessionStorage.setItem(ACTIVE_HISTORY_CONTEXT_STORAGE_KEY, contextKey);
-		} catch (e) {
-			console.warn("[SessionStorageAdapter] Failed to save active history context:", e);
-		}
+		} catch (e) {}
 	}
 	getActiveHistoryContext() {
 		try {
@@ -90,21 +87,56 @@ var SessionStorageAdapter = class {
 			return null;
 		}
 	}
+	clearActiveHistoryContext() {
+		try {
+			sessionStorage.removeItem(ACTIVE_HISTORY_CONTEXT_STORAGE_KEY);
+		} catch (e) {}
+	}
+	saveContextStack(stack) {
+		try {
+			sessionStorage.setItem(CONTEXT_STACK_STORAGE_KEY, JSON.stringify(stack));
+		} catch (e) {}
+	}
+	getContextStack() {
+		try {
+			const stored = sessionStorage.getItem(CONTEXT_STACK_STORAGE_KEY);
+			if (!stored) return [];
+			const parsed = JSON.parse(stored);
+			return Array.isArray(parsed) ? parsed : [];
+		} catch {
+			return [];
+		}
+	}
+	saveHistoryContextStack(stack) {
+		try {
+			sessionStorage.setItem(HISTORY_CONTEXT_STACK_STORAGE_KEY, JSON.stringify(stack));
+		} catch (e) {}
+	}
+	getHistoryContextStack() {
+		try {
+			const stored = sessionStorage.getItem(HISTORY_CONTEXT_STACK_STORAGE_KEY);
+			if (!stored) return [];
+			const parsed = JSON.parse(stored);
+			return Array.isArray(parsed) ? parsed : [];
+		} catch {
+			return [];
+		}
+	}
 };
 
 //#endregion
 //#region src/history/types.ts
-let NavigationType = /* @__PURE__ */ function(NavigationType$1) {
-	NavigationType$1["pop"] = "pop";
-	NavigationType$1["push"] = "push";
-	return NavigationType$1;
-}({});
-let NavigationDirection = /* @__PURE__ */ function(NavigationDirection$1) {
-	NavigationDirection$1["back"] = "back";
-	NavigationDirection$1["forward"] = "forward";
-	NavigationDirection$1["unknown"] = "";
-	return NavigationDirection$1;
-}({});
+var NavigationType = /* @__PURE__ */ ((NavigationType2) => {
+	NavigationType2["pop"] = "pop";
+	NavigationType2["push"] = "push";
+	return NavigationType2;
+})(NavigationType || {});
+var NavigationDirection = /* @__PURE__ */ ((NavigationDirection2) => {
+	NavigationDirection2["back"] = "back";
+	NavigationDirection2["forward"] = "forward";
+	NavigationDirection2["unknown"] = "";
+	return NavigationDirection2;
+})(NavigationDirection || {});
 
 //#endregion
 //#region src/history/storage.ts
@@ -134,6 +166,24 @@ var VirtualStackStorage = class {
 	getActiveHistoryContext() {
 		return this.adapter.getActiveHistoryContext();
 	}
+	clearActiveContext() {
+		return this.adapter.clearActiveContext();
+	}
+	clearActiveHistoryContext() {
+		return this.adapter.clearActiveHistoryContext();
+	}
+	saveContextStack(stack) {
+		return this.adapter.saveContextStack(stack);
+	}
+	getContextStack() {
+		return this.adapter.getContextStack();
+	}
+	saveHistoryContextStack(stack) {
+		return this.adapter.saveHistoryContextStack(stack);
+	}
+	getHistoryContextStack() {
+		return this.adapter.getHistoryContextStack();
+	}
 	resolveValue = resolveValue;
 };
 
@@ -261,6 +311,24 @@ var VirtualStackManager = class {
 	getStoredActiveHistoryContext() {
 		return this.storage.getActiveHistoryContext();
 	}
+	clearActiveContext() {
+		return this.storage.clearActiveContext();
+	}
+	clearActiveHistoryContext() {
+		return this.storage.clearActiveHistoryContext();
+	}
+	saveContextStack(stack) {
+		return this.storage.saveContextStack(stack);
+	}
+	getContextStack() {
+		return this.storage.getContextStack();
+	}
+	saveHistoryContextStack(stack) {
+		return this.storage.saveHistoryContextStack(stack);
+	}
+	getHistoryContextStack() {
+		return this.storage.getHistoryContextStack();
+	}
 	entries() {
 		return this.contexts.entries();
 	}
@@ -308,6 +376,7 @@ var MultiRouterHistoryManager = class {
 	stacks;
 	activeHistoryContextKey = null;
 	historyContextStack = [];
+	contextStack = [];
 	baseHistoryCleanup = null;
 	contextSwitchMode;
 	onContextActivate;
@@ -317,6 +386,15 @@ var MultiRouterHistoryManager = class {
 		this.contextSwitchMode = options?.contextSwitchMode ?? "replace";
 		this.onContextActivate = options?.onContextActivate;
 		this.baseHistoryCleanup = this.baseHistory.listen(this.handlePopState.bind(this));
+		this.restoreContextStacks();
+	}
+	restoreContextStacks() {
+		mapMaybePromise(this.stacks.getContextStack(), (stack) => {
+			this.contextStack = stack;
+		});
+		mapMaybePromise(this.stacks.getHistoryContextStack(), (stack) => {
+			this.historyContextStack = stack;
+		});
 	}
 	get base() {
 		return this.baseHistory.base;
@@ -334,10 +412,6 @@ var MultiRouterHistoryManager = class {
 			const isLastActive = lastActiveContext === contextKey;
 			if (location) {
 				const virtualStack = this.createInitialVirtualStack(location);
-				console.debug("[MultiRouterHistory] Created context with forced location", {
-					contextKey,
-					location
-				});
 				return this.finalizeContextCreation(contextKey, virtualStack, isLastActive, historyEnabled);
 			}
 			return mapMaybePromise(this.stacks.restore(contextKey), (restoredStack) => {
@@ -349,31 +423,15 @@ var MultiRouterHistoryManager = class {
 							location: browserUrl,
 							state: this.baseHistory.state ?? {}
 						};
-						console.debug("[MultiRouterHistory] Restored from storage with browser URL", {
-							contextKey,
-							browserUrl
-						});
-					} else console.debug("[MultiRouterHistory] Restored from storage", {
-						contextKey,
-						historyEnabled
-					});
+					}
 					virtualStack = restoredStack;
 				} else if (isLastActive && historyEnabled) {
 					const browserUrl = this.baseHistory.location;
 					virtualStack = this.createInitialVirtualStack(browserUrl);
-					console.debug("[MultiRouterHistory] Created with browser URL (last active)", {
-						contextKey,
-						browserUrl
-					});
-				} else if (initialLocation) {
-					virtualStack = this.createInitialVirtualStack(initialLocation);
-					console.debug("[MultiRouterHistory] Created with initialLocation", {
-						contextKey,
-						initialLocation
-					});
-				} else {
-					virtualStack = this.createInitialVirtualStack();
-					console.debug("[MultiRouterHistory] Created with default location", { contextKey });
+				} else if (initialLocation) virtualStack = this.createInitialVirtualStack(initialLocation);
+				else {
+					const browserUrl = this.baseHistory.location;
+					virtualStack = this.createInitialVirtualStack(browserUrl);
 				}
 				return this.finalizeContextCreation(contextKey, virtualStack, isLastActive, historyEnabled);
 			});
@@ -401,6 +459,9 @@ var MultiRouterHistoryManager = class {
 		this.stacks.remove(contextKey);
 		if (this.activeHistoryContextKey === contextKey) this.fallbackToPreviousHistoryContext();
 		this.historyContextStack = this.historyContextStack.filter((k) => k !== contextKey);
+		this.stacks.saveHistoryContextStack(this.historyContextStack);
+		this.contextStack = this.contextStack.filter((k) => k !== contextKey);
+		this.stacks.saveContextStack(this.contextStack);
 	}
 	setActiveHistoryContext(contextKey) {
 		if (!this.stacks.has(contextKey)) throw new Error(`[MultiRouterHistory] Context "${contextKey}" not registered`);
@@ -410,14 +471,12 @@ var MultiRouterHistoryManager = class {
 			this.historyContextStack = this.historyContextStack.filter((k) => k !== previousKey);
 			this.historyContextStack.push(previousKey);
 		}
+		this.historyContextStack = this.historyContextStack.filter((k) => k !== contextKey);
+		this.stacks.saveHistoryContextStack(this.historyContextStack);
 		this.activeHistoryContextKey = contextKey;
 		this.stacks.saveActiveContext(contextKey);
 		this.stacks.saveActiveHistoryContext(contextKey);
 		this.restoreUrlFromVirtualStack(contextKey);
-		console.debug("[MultiRouterHistory] setActiveHistoryContext", {
-			from: previousKey,
-			to: contextKey
-		});
 	}
 	clearActiveHistoryContext(contextKey) {
 		if (this.activeHistoryContextKey !== contextKey) return;
@@ -426,14 +485,57 @@ var MultiRouterHistoryManager = class {
 	saveActiveContext(contextKey) {
 		this.stacks.saveActiveContext(contextKey);
 	}
+	/**
+	* Push the current active context to the context stack before switching to a new one.
+	* This allows fallback to the previous context when the current one is removed.
+	*/
+	pushToContextStack(contextKey) {
+		this.contextStack = this.contextStack.filter((k) => k !== contextKey);
+		this.contextStack.push(contextKey);
+		this.stacks.saveContextStack(this.contextStack);
+	}
+	/**
+	* Get the previous context from the stack (for fallback when current context is removed).
+	* Returns null if no previous context exists.
+	*/
+	popFromContextStack() {
+		const previousKey = this.contextStack.pop() ?? null;
+		this.stacks.saveContextStack(this.contextStack);
+		return previousKey;
+	}
+	/**
+	* Remove a context from the context stack (when the context is unregistered).
+	*/
+	removeFromContextStack(contextKey) {
+		this.contextStack = this.contextStack.filter((k) => k !== contextKey);
+		this.stacks.saveContextStack(this.contextStack);
+	}
+	/**
+	* Clear the active context from storage (when no contexts are left).
+	*/
+	clearActiveContext() {
+		this.stacks.clearActiveContext();
+	}
 	getActiveHistoryContextKey() {
 		return this.activeHistoryContextKey;
 	}
 	fallbackToPreviousHistoryContext() {
-		const previousKey = this.historyContextStack.pop();
-		if (previousKey && this.stacks.has(previousKey)) this.activeHistoryContextKey = previousKey;
-		else this.activeHistoryContextKey = null;
-		console.debug("[MultiRouterHistory] fallbackToPreviousHistoryContext", { to: this.activeHistoryContextKey });
+		let previousKey = this.historyContextStack.pop();
+		while (previousKey && !this.stacks.has(previousKey)) previousKey = this.historyContextStack.pop();
+		if (!previousKey) {
+			for (const [key, context] of this.stacks.entries()) if (context.historyEnabled) {
+				previousKey = key;
+				break;
+			}
+		}
+		if (previousKey && this.stacks.has(previousKey)) {
+			this.activeHistoryContextKey = previousKey;
+			this.stacks.saveActiveHistoryContext(previousKey);
+		} else {
+			this.activeHistoryContextKey = null;
+			this.stacks.clearActiveHistoryContext();
+		}
+		this.stacks.saveHistoryContextStack(this.historyContextStack);
 	}
 	createInitialVirtualStack(initialLocation) {
 		return {
@@ -462,17 +564,6 @@ var MultiRouterHistoryManager = class {
 	handlePopState(to, from, info) {
 		const stateContextKey = this.baseHistory.state?.[CONTEXT_KEY_STATE];
 		const stateStackIndex = this.baseHistory.state?.[STACK_INDEX_STATE];
-		console.debug("[MultiRouterHistory] popstate raw", {
-			stateContextKey,
-			stateStackIndex,
-			browserTo: to,
-			browserFrom: from,
-			delta: info.delta,
-			virtualStacks: Object.fromEntries(Array.from(this.stacks.entries()).map(([k, v]) => [k, {
-				position: v.virtualStack.position,
-				entries: v.virtualStack.entries.map((e) => e.location)
-			}]))
-		});
 		let ownerContextKey = null;
 		let targetStackIndex = null;
 		if (stateContextKey && this.stacks.has(stateContextKey)) {
@@ -490,15 +581,6 @@ var MultiRouterHistoryManager = class {
 			const previousLocation = context.virtualStack.entries[context.virtualStack.position]?.location ?? from;
 			this.stacks.setPosition(ownerContextKey, newPosition);
 			const targetLocation = context.virtualStack.entries[newPosition]?.location ?? to;
-			console.debug("[MultiRouterHistory] popstate result", {
-				ownerContext: ownerContextKey,
-				activeContext: this.activeHistoryContextKey,
-				browserUrl: to,
-				contextUrl: targetLocation,
-				targetStackIndex: newPosition,
-				previousLocation,
-				delta: info.delta
-			});
 			if (this.onContextActivate) this.onContextActivate(ownerContextKey);
 			this.stacks.notifyListeners(ownerContextKey, targetLocation, previousLocation, info);
 		}
@@ -511,13 +593,6 @@ var MultiRouterHistoryManager = class {
 			[CONTEXT_KEY_STATE]: contextKey,
 			[STACK_INDEX_STATE]: stackIndex
 		});
-		console.debug("[MultiRouterHistory] push", {
-			contextKey,
-			to,
-			stackIndex,
-			isActive: this.activeHistoryContextKey === contextKey,
-			historyEnabled
-		});
 	}
 	replace(contextKey, to, data) {
 		const stackIndex = this.stacks.replace(contextKey, to, data ?? {});
@@ -527,13 +602,6 @@ var MultiRouterHistoryManager = class {
 			[CONTEXT_KEY_STATE]: contextKey,
 			[STACK_INDEX_STATE]: stackIndex
 		});
-		console.debug("[MultiRouterHistory] replace", {
-			contextKey,
-			to,
-			stackIndex,
-			isActive: this.activeHistoryContextKey === contextKey,
-			historyEnabled
-		});
 	}
 	go(contextKey, delta, triggerListeners = true) {
 		if (!this.stacks.has(contextKey)) throw new Error(`[MultiRouterHistory] Context "${contextKey}" not registered`);
@@ -575,23 +643,27 @@ var MultiRouterHistoryManager = class {
 //#endregion
 //#region src/contextManager.ts
 var MultiRouterManagerInstance = class {
-	started = false;
-	activeContext = shallowRef();
-	activeHistoryContext = shallowRef();
-	registered = /* @__PURE__ */ new Map();
-	onContextInitListeners = [];
-	historyManager;
-	constructor(app, types, historyManagerOptions, makeRouter) {
-		this.types = types;
+	constructor(app, historyManagerOptions, makeRouter) {
 		this.makeRouter = makeRouter;
 		const { historyBuilder, ...historyOptions } = historyManagerOptions;
 		this.historyManager = new MultiRouterHistoryManager(historyBuilder, {
 			...historyOptions,
 			onContextActivate: (contextKey) => {
 				this.setActive(contextKey, false);
+				const context = this.registered.get(contextKey);
+				if (context?.historyEnabled && this.activeHistoryContext.value?.key !== contextKey) this.activeHistoryContext.value = {
+					key: contextKey,
+					context
+				};
 			}
 		});
 	}
+	started = false;
+	activeContext = shallowRef();
+	activeHistoryContext = shallowRef();
+	registered = /* @__PURE__ */ new Map();
+	onContextInitListeners = [];
+	historyManager;
 	getHistoryManager() {
 		return this.historyManager;
 	}
@@ -612,6 +684,8 @@ var MultiRouterManagerInstance = class {
 		if (!item) throw new Error(`[MultiRouter] Context "${key}" not found`);
 		let modified = false;
 		if (this.activeContext.value?.key !== key) {
+			if (this.activeContext.value?.key) this.historyManager.pushToContextStack(this.activeContext.value.key);
+			this.historyManager.removeFromContextStack(key);
 			this.activeContext.value = {
 				key,
 				context: item
@@ -625,11 +699,7 @@ var MultiRouterManagerInstance = class {
 				this.historyManager.setActiveHistoryContext(key);
 			}
 		}
-		if (modified) console.debug("[MultiRouterContextManager] setActive", {
-			key,
-			updateHistory,
-			historyEnabled: item.historyEnabled
-		});
+		if (modified) {}
 		return modified;
 	}
 	clearHistoryContext(key) {
@@ -655,7 +725,6 @@ var MultiRouterManagerInstance = class {
 		return this.registered.has(key);
 	}
 	register(type, key, options) {
-		if (!this.types[type]) throw new Error(`[MultiRouter] Context type "${type}" not found`);
 		const historyEnabled = options?.historyEnabled ?? true;
 		const isDefault = options?.default ?? false;
 		return mapMaybePromise(this.historyManager.createContextHistory(key, {
@@ -671,30 +740,20 @@ var MultiRouterManagerInstance = class {
 				initialized: false,
 				historyEnabled
 			});
-			router.push(history.location).catch((err) => {
-				console.warn("Unexpected error when starting the router:", err);
-			});
+			router.push(history.location).catch((err) => {});
 			router.isReady().then(() => {
 				this.markAsStarted();
 				mapMaybePromise(this.historyManager.tryRestoreActiveHistoryContext(key), (restored) => {
-					if (restored && !this.activeHistoryContext.value) {
-						console.debug("[MultiRouterContextManager] Restored activeHistoryContext", { key });
-						this.activeHistoryContext.value = {
-							key,
-							context: this.registered.get(key)
-						};
-					}
+					if (restored && !this.activeHistoryContext.value) this.activeHistoryContext.value = {
+						key,
+						context: this.registered.get(key)
+					};
 				});
 				mapMaybePromise(this.historyManager.getLastActiveContextKey(), (resolvedLastActiveKey) => {
-					if (resolvedLastActiveKey === key && !this.activeContext.value) {
-						console.debug("[MultiRouterContextManager] Auto-activating last active context", { key });
-						this.setActive(key, true);
-					} else if (isDefault && !resolvedLastActiveKey && !this.activeContext.value) {
-						console.debug("[MultiRouterContextManager] Activating default context", {
-							key,
-							historyEnabled
-						});
-						this.setActive(key, true);
+					if (resolvedLastActiveKey === key && !this.activeContext.value) this.setActive(key, true);
+					else if (!this.activeContext.value) {
+						if (!(resolvedLastActiveKey && this.registered.has(resolvedLastActiveKey))) if (isDefault || !resolvedLastActiveKey) this.setActive(key, true);
+						else this.activateFromStackOrFallback(key);
 					}
 				});
 			});
@@ -708,11 +767,41 @@ var MultiRouterManagerInstance = class {
 	}
 	unregister(key) {
 		if (this.registered.get(key)) {
-			console.debug("[MultiRouterContextManager] unregister", { key });
+			if (this.activeContext.value?.key === key) this.fallbackToPreviousContext();
+			if (this.activeHistoryContext.value?.key === key) this.clearHistoryContext(key);
 			this.historyManager.removeContextHistory(key);
 			this.registered.delete(key);
 		}
 	}
+	activateFromStackOrFallback(fallbackKey) {
+		if (this.activeContext.value) return;
+		let contextKey = this.historyManager.popFromContextStack();
+		while (contextKey && !this.registered.has(contextKey)) contextKey = this.historyManager.popFromContextStack();
+		if (!contextKey) contextKey = fallbackKey;
+		if (contextKey && this.registered.has(contextKey)) this.setActive(contextKey, true);
+	}
+	fallbackToPreviousContext() {
+		let previousKey = this.historyManager.popFromContextStack();
+		while (previousKey && !this.registered.has(previousKey)) previousKey = this.historyManager.popFromContextStack();
+		if (!previousKey) {
+			const historyContextKey = this.activeHistoryContext.value?.key;
+			if (historyContextKey && this.registered.has(historyContextKey)) previousKey = historyContextKey;
+		}
+		if (!previousKey && this.registered.size > 0) previousKey = this.registered.keys().next().value ?? null;
+		if (previousKey) {
+			const previousContext = this.registered.get(previousKey);
+			if (previousContext) {
+				this.activeContext.value = {
+					key: previousKey,
+					context: previousContext
+				};
+				this.historyManager.saveActiveContext(previousKey);
+				return;
+			}
+		}
+		this.activeContext.value = void 0;
+		this.historyManager.clearActiveContext();
+	}
 	initialize(key) {
 		this.registered.get(key).initialized = true;
 		this.onContextInitListeners.forEach((fn) => fn(key));
@@ -725,13 +814,15 @@ var MultiRouterManagerInstance = class {
 
 //#endregion
 //#region src/symbols.ts
-const multiRouterContextManager = Symbol("multi-router-context-manager");
-const multiRouterContext = Symbol("multi-router-context-key");
+const multiRouterContextManager = /* @__PURE__ */ Symbol("multi-router-context-manager");
+const multiRouterContext = /* @__PURE__ */ Symbol("multi-router-context-key");
 
 //#endregion
 //#region src/injectionSymbols.ts
 const multiRouterContextManagerKey = multiRouterContextManager;
 const multiRouterContextKey = multiRouterContext;
+const multiRouterContextActivateCallbacksKey = /* @__PURE__ */ Symbol("multi-router-context-activated-callbacks");
+const multiRouterOriginalDepthKey = /* @__PURE__ */ Symbol();
 
 //#endregion
 //#region src/multi-router.ts
@@ -792,6 +883,24 @@ function installContextAwareRouterResolvers(app, contextManager) {
 	Object.defineProperty(app.config.globalProperties, "$router", routerProperty);
 	Object.defineProperty(app._context.provides, routeLocationKey, routeProperty);
 	Object.defineProperty(app.config.globalProperties, "$route", routeProperty);
+	Object.defineProperty(app._context.provides, viewDepthKey, {
+		enumerable: true,
+		configurable: true,
+		get() {
+			const instance = getCurrentInstance$1();
+			const originalDepthRef = instance?.provides[multiRouterOriginalDepthKey];
+			return computed(() => {
+				const originalDepth = originalDepthRef?.value || 0;
+				const indexOfLastRoot = (instance?.provides[routerViewLocationKey].value).matched.findLastIndex((route) => route.meta.multiRouterRoot);
+				if (originalDepth < indexOfLastRoot) return indexOfLastRoot;
+				return originalDepth;
+			});
+		},
+		set(value) {
+			const instance = getCurrentInstance$1();
+			instance.provides[multiRouterOriginalDepthKey] = value;
+		}
+	});
 	Object.defineProperty(app._context.provides, routerViewLocationKey, {
 		enumerable: true,
 		configurable: true,
@@ -807,32 +916,6 @@ function installComponents(app) {
 	app.component("RouterLink", RouterLink);
 	app.component("RouterView", RouterView);
 }
-const contextTemplateWindows = { window: {
-	canUseAsHistoryContext: true,
-	single: false
-} };
-const contextTemplateTabs = { tab: {
-	canUseAsHistoryContext: true,
-	single: false
-} };
-const contextTemplateMainWithWindows = {
-	main: {
-		canUseAsHistoryContext: true,
-		single: true
-	},
-	...contextTemplateWindows
-};
-const contextTemplateDesktopWithWindows = {
-	desktop: {
-		canUseAsHistoryContext: false,
-		single: true
-	},
-	...contextTemplateWindows
-};
-const contextTemplateTabsWithWindows = {
-	...contextTemplateTabs,
-	...contextTemplateWindows
-};
 function createMultiRouter(options) {
 	let contextManager;
 	return {
@@ -848,7 +931,7 @@ function createMultiRouter(options) {
 				Object.assign(router, { contextKey });
 				return router;
 			};
-			contextManager = new MultiRouterManagerInstance(app, options.types, {
+			contextManager = new MultiRouterManagerInstance(app, {
 				historyBuilder: options.history,
 				...options.historyOptions
 			}, makeRouter);
@@ -859,8 +942,76 @@ function createMultiRouter(options) {
 	};
 }
 
+//#endregion
+//#region src/composables/useMultiRouter.ts
+function useMultiRouter() {
+	const manager = inject(multiRouterContextManagerKey);
+	if (!manager) throw new Error("[useMultiRouter] Must be used within MultiRouterContextProvider");
+	const activeContextKey = computed(() => manager.getActiveContextRef().value?.key);
+	const activeHistoryContextKey = computed(() => manager.getActiveHistoryContextRef().value?.key);
+	const setActive = (contextKey, updateHistory = true) => {
+		manager.setActive(contextKey, updateHistory);
+	};
+	const hasContext = (contextKey) => {
+		return manager.has(contextKey);
+	};
+	return {
+		manager,
+		activeContextKey,
+		activeHistoryContextKey,
+		setActive,
+		hasContext
+	};
+}
+
+//#endregion
+//#region src/composables/useMultiRouterContext.ts
+function useMultiRouterContext() {
+	const { manager, activeContextKey, activeHistoryContextKey, setActive, hasContext } = useMultiRouter();
+	const contextKey = inject(multiRouterContextKey);
+	if (!contextKey) throw new Error("[useMultiRouterContext] Must be used within MultiRouterContext");
+	const isActive = computed(() => activeContextKey.value === contextKey);
+	const isHistoryActive = computed(() => activeHistoryContextKey.value === contextKey);
+	const historyEnabled = computed(() => manager.getContextHistoryEnabled(contextKey));
+	const activate = (updateHistory = true) => {
+		setActive(contextKey, updateHistory);
+	};
+	return {
+		manager,
+		contextKey,
+		isActive,
+		isHistoryActive,
+		activeContextKey,
+		activeHistoryContextKey,
+		historyEnabled,
+		activate,
+		setActive,
+		hasContext
+	};
+}
+
+//#endregion
+//#region src/hooks.ts
+function onMultiRouterContextActivate(callback) {
+	const { isActive, contextKey } = useMultiRouterContext();
+	const multiRouterActivateCallbacks = inject(multiRouterContextActivateCallbacksKey);
+	if (!multiRouterActivateCallbacks) return;
+	if (isActive.value) callback(contextKey);
+	multiRouterActivateCallbacks.push(callback);
+	onBeforeUnmount(() => {
+		multiRouterActivateCallbacks.splice(multiRouterActivateCallbacks.indexOf(callback), 1);
+	});
+}
+
 //#endregion
 //#region src/components/MultiRouterContext.vue?vue&type=script&lang.ts
+function withContextActivateCallbacks(name, activeContextKey) {
+	const multiRouterActivatedCallbacks = [];
+	provide(multiRouterContextActivateCallbacksKey, multiRouterActivatedCallbacks);
+	watch(activeContextKey, (newName) => {
+		if (newName === name) multiRouterActivatedCallbacks.forEach((callback) => callback(name));
+	});
+}
 const MultiRouterContextInner = defineComponent({
 	name: "MultiRouterContextInner",
 	props: {
@@ -887,20 +1038,19 @@ const MultiRouterContextInner = defineComponent({
 		default: {
 			type: Boolean,
 			default: false
+		},
+		activator: {
+			type: Boolean,
+			default: true
+		},
+		preventClass: {
+			type: String,
+			default: null
 		}
 	},
 	setup(props, { slots }) {
-		const manager = inject(multiRouterContextManagerKey);
-		console.debug("[MultiRouterContext] setup", {
-			type: props.type,
-			name: props.name,
-			location: props.location,
-			initialLocation: props.initialLocation
-		});
-		if (manager.has(props.name)) {
-			console.warn(`[MultiRouterContext] Context "${props.name}" already registered, skipping`);
-			return () => slots.default?.();
-		}
+		const { manager, activeContextKey } = useMultiRouter();
+		if (manager.has(props.name)) return () => slots.default?.();
 		manager.register(props.type, props.name, {
 			location: props.location,
 			initialLocation: props.initialLocation,
@@ -908,11 +1058,25 @@ const MultiRouterContextInner = defineComponent({
 			default: props.default
 		});
 		provide(multiRouterContext, props.name);
-		provide(viewDepthKey, ref(0));
+		withContextActivateCallbacks(props.name, activeContextKey);
 		onBeforeUnmount(() => {
 			manager.unregister(props.name);
 		});
-		return () => slots.default?.();
+		if (!props.activator) return () => slots.default?.();
+		const onActivate = (e) => {
+			e.stopPropagation();
+			let shouldActivate = true;
+			const target = e.target;
+			if (props.preventClass && target?.closest("." + props.preventClass)) shouldActivate = false;
+			if (shouldActivate) {
+				if (manager.setActive(props.name, true)) {}
+			}
+		};
+		return () => {
+			const children = slots.default?.();
+			if (children && children.length === 1) return h(children[0], { onMousedown: onActivate });
+			return h("div", { onMousedown: onActivate }, children);
+		};
 	}
 });
 var MultiRouterContext_vue_vue_type_script_lang_default = defineComponent({
@@ -941,6 +1105,14 @@ var MultiRouterContext_vue_vue_type_script_lang_default = defineComponent({
 		default: {
 			type: Boolean,
 			default: false
+		},
+		activator: {
+			type: Boolean,
+			default: true
+		},
+		preventClass: {
+			type: String,
+			default: null
 		}
 	},
 	setup(props, { slots }) {
@@ -951,7 +1123,9 @@ var MultiRouterContext_vue_vue_type_script_lang_default = defineComponent({
 			location: props.location,
 			initialLocation: props.initialLocation,
 			historyEnabled: props.historyEnabled,
-			default: props.default
+			default: props.default,
+			activator: props.activator,
+			preventClass: props.preventClass
 		}, slots.default);
 	}
 });
@@ -963,26 +1137,35 @@ var MultiRouterContext_default = MultiRouterContext_vue_vue_type_script_lang_def
 //#endregion
 //#region src/components/MultiRouterContextActivator.vue?vue&type=script&lang.ts
 var MultiRouterContextActivator_vue_vue_type_script_lang_default = defineComponent({
-	props: { as: {
-		type: String,
-		default: null
-	} },
+	props: {
+		as: {
+			type: String,
+			default: null
+		},
+		preventClass: {
+			type: String,
+			default: null,
+			required: false
+		}
+	},
 	setup(props, { slots }) {
 		const contextKey = inject(multiRouterContextKey);
 		const manager = inject(multiRouterContextManagerKey);
-		if (!contextKey || !manager) {
-			console.warn("[MultiRouterContextActivator] Must be used within MultiRouterContext");
-			return () => slots.default?.();
-		}
+		if (!contextKey || !manager) return () => slots.default?.();
 		const onActivate = (e) => {
 			e.stopPropagation();
-			if (manager.setActive(contextKey, true)) console.debug("[MultiRouterContextActivator] activated", contextKey);
+			let shouldActivate = true;
+			const target = e.target;
+			if (props.preventClass && target?.closest("." + props.preventClass)) shouldActivate = false;
+			if (shouldActivate) {
+				if (manager.setActive(contextKey, true)) {}
+			}
 		};
 		return () => {
 			const children = slots.default?.();
 			if (!props.as) {
 				if (children && children.length === 1) return h(children[0], { onMousedown: onActivate });
-				return h("span", { onMousedown: onActivate }, children);
+				return h("div", { onMousedown: onActivate }, children);
 			}
 			return h(props.as, { onMousedown: onActivate }, children);
 		};
@@ -994,35 +1177,4 @@ var MultiRouterContextActivator_vue_vue_type_script_lang_default = defineCompone
 var MultiRouterContextActivator_default = MultiRouterContextActivator_vue_vue_type_script_lang_default;
 
 //#endregion
-//#region src/composables/useMultiRouterContext.ts
-function useMultiRouterContext() {
-	const manager = inject(multiRouterContextManagerKey);
-	const contextKey = inject(multiRouterContextKey);
-	if (!manager) throw new Error("[useMultiRouterContext] Must be used within MultiRouterContextProvider");
-	if (!contextKey) throw new Error("[useMultiRouterContext] Must be used within MultiRouterContext");
-	const router = computed(() => manager.getRouter(contextKey));
-	const route = computed(() => router.value.currentRoute.value);
-	const isActive = computed(() => manager.getActiveContextRef().value?.key === contextKey);
-	const activeContextKey = computed(() => manager.getActiveContextRef().value?.key);
-	const activeHistoryContextKey = computed(() => manager.getActiveHistoryContextRef().value?.key);
-	const isHistoryActive = computed(() => manager.getActiveHistoryContextRef().value?.key === contextKey);
-	const historyEnabled = computed(() => manager.getContextHistoryEnabled(contextKey));
-	const activate = (updateHistory = true) => {
-		manager.setActive(contextKey, updateHistory);
-	};
-	return {
-		manager,
-		contextKey,
-		router,
-		route,
-		isActive,
-		isHistoryActive,
-		activeContextKey,
-		activeHistoryContextKey,
-		historyEnabled,
-		activate
-	};
-}
-
-//#endregion
-export { MultiRouterContext_default as MultiRouterContext, MultiRouterContextActivator_default as MultiRouterContextActivator, contextTemplateDesktopWithWindows, contextTemplateMainWithWindows, contextTemplateTabs, contextTemplateTabsWithWindows, contextTemplateWindows, createMultiRouter, multiRouterContextKey, multiRouterContextManagerKey, useMultiRouterContext };
+export { MultiRouterContext_default as MultiRouterContext, MultiRouterContextActivator_default as MultiRouterContextActivator, createMultiRouter, multiRouterContextKey, multiRouterContextManagerKey, onMultiRouterContextActivate, useMultiRouter, useMultiRouterContext };