@tanstack/solid-router 2.0.0-alpha.5 → 2.0.0-alpha.7

package/dist/cjs/Match.cjs

@@ -1,7 +1,6 @@
 const require_runtime = require("./_virtual/_rolldown/runtime.cjs");
 const require_CatchBoundary = require("./CatchBoundary.cjs");
 const require_useRouter = require("./useRouter.cjs");
-const require_useRouterState = require("./useRouterState.cjs");
 const require_matchContext = require("./matchContext.cjs");
 const require_SafeFragment = require("./SafeFragment.cjs");
 const require_not_found = require("./not-found.cjs");
@@ -17,306 +16,326 @@ let _tanstack_router_core_isServer = require("@tanstack/router-core/isServer");
 let tiny_invariant = require("tiny-invariant");
 tiny_invariant = require_runtime.__toESM(tiny_invariant);
 //#region src/Match.tsx
-var MatchContext = require_matchContext.matchContext;
+var NearestMatchContext = require_matchContext.nearestMatchContext;
 var Match = (props) => {
 	const router = require_useRouter.useRouter();
-	const matchState = require_useRouterState.useRouterState({ select: (s) => {
-		const match = s.matches.find((d) => d.id === props.matchId);
-		if (!match) return null;
+	const match = solid_js.createMemo(() => {
+		const id = props.matchId;
+		if (!id) return void 0;
+		return router.stores.activeMatchStoresById.get(id)?.state;
+	});
+	const rawMatchState = solid_js.createMemo(() => {
+		const currentMatch = match();
+		if (!currentMatch) return null;
+		const routeId = currentMatch.routeId;
+		const parentRouteId = router.routesById[routeId]?.parentRoute?.id;
 		return {
-			routeId: match.routeId,
-			ssr: match.ssr,
-			_displayPending: match._displayPending
+			matchId: currentMatch.id,
+			routeId,
+			ssr: currentMatch.ssr,
+			_displayPending: currentMatch._displayPending,
+			parentRouteId
 		};
-	} });
-	if (!solid_js.untrack(matchState)) return null;
-	const route = () => router.routesById[matchState().routeId];
-	const resolvePendingComponent = () => route().options.pendingComponent ?? router.options.defaultPendingComponent;
-	const routeErrorComponent = () => route().options.errorComponent ?? router.options.defaultErrorComponent;
-	const routeOnCatch = () => route().options.onCatch ?? router.options.defaultOnCatch;
-	const routeNotFoundComponent = () => route().isRoot ? route().options.notFoundComponent ?? router.options.notFoundRoute?.options.component : route().options.notFoundComponent;
-	const resolvedNoSsr = solid_js.createMemo(() => matchState().ssr === false || matchState().ssr === "data-only");
-	const ResolvedSuspenseBoundary = () => resolvedNoSsr() ? require_SafeFragment.SafeFragment : solid_js.Loading;
-	const ResolvedCatchBoundary = () => routeErrorComponent() ? require_CatchBoundary.CatchBoundary : require_SafeFragment.SafeFragment;
-	const ResolvedNotFoundBoundary = () => routeNotFoundComponent() ? require_not_found.CatchNotFound : require_SafeFragment.SafeFragment;
-	const resetKey = require_useRouterState.useRouterState({ select: (s) => s.loadedAt });
-	const parentRouteId = require_useRouterState.useRouterState({ select: (s) => {
-		const index = s.matches.findIndex((d) => d.id === props.matchId);
-		return s.matches[index - 1]?.routeId;
-	} });
-	const ShellComponent = solid_js.createMemo(() => route().isRoot ? route().options.shellComponent ?? require_SafeFragment.SafeFragment : require_SafeFragment.SafeFragment);
-	return (0, _solidjs_web.createComponent)(_solidjs_web.Dynamic, {
-		get component() {
-			return ShellComponent();
+	});
+	const nearestMatch = {
+		matchId: () => rawMatchState()?.matchId,
+		routeId: () => rawMatchState()?.routeId,
+		match,
+		hasPending: solid_js.createMemo(() => {
+			const currentRouteId = rawMatchState()?.routeId;
+			return currentRouteId ? Boolean(router.stores.pendingRouteIds.state[currentRouteId]) : false;
+		})
+	};
+	return (0, _solidjs_web.createComponent)(solid_js.Show, {
+		get when() {
+			return rawMatchState();
 		},
-		get children() {
-			return [(0, _solidjs_web.createComponent)(MatchContext, {
-				value: () => props.matchId,
+		children: (currentMatchState) => {
+			const route = solid_js.createMemo(() => router.routesById[currentMatchState().routeId]);
+			const resolvePendingComponent = solid_js.createMemo(() => route().options.pendingComponent ?? router.options.defaultPendingComponent);
+			const routeErrorComponent = solid_js.createMemo(() => route().options.errorComponent ?? router.options.defaultErrorComponent);
+			const routeOnCatch = solid_js.createMemo(() => route().options.onCatch ?? router.options.defaultOnCatch);
+			const routeNotFoundComponent = solid_js.createMemo(() => route().isRoot ? route().options.notFoundComponent ?? router.options.notFoundRoute?.options.component : route().options.notFoundComponent);
+			const resolvedNoSsr = solid_js.createMemo(() => currentMatchState().ssr === false || currentMatchState().ssr === "data-only");
+			const ResolvedSuspenseBoundary = solid_js.createMemo(() => resolvedNoSsr() ? require_SafeFragment.SafeFragment : solid_js.Loading);
+			const ResolvedCatchBoundary = solid_js.createMemo(() => routeErrorComponent() ? require_CatchBoundary.CatchBoundary : require_SafeFragment.SafeFragment);
+			const ResolvedNotFoundBoundary = solid_js.createMemo(() => routeNotFoundComponent() ? require_not_found.CatchNotFound : require_SafeFragment.SafeFragment);
+			const ShellComponent = solid_js.createMemo(() => route().isRoot ? route().options.shellComponent ?? require_SafeFragment.SafeFragment : require_SafeFragment.SafeFragment);
+			return (0, _solidjs_web.createComponent)(_solidjs_web.Dynamic, {
+				get component() {
+					return ShellComponent();
+				},
 				get children() {
-					return (0, _solidjs_web.createComponent)(_solidjs_web.Dynamic, {
-						get component() {
-							return ResolvedSuspenseBoundary();
-						},
-						get fallback() {
-							return (0, _solidjs_web.memo)(() => !!((_tanstack_router_core_isServer.isServer ?? router.isServer) || resolvedNoSsr()))() ? void 0 : (0, _solidjs_web.createComponent)(_solidjs_web.Dynamic, { get component() {
-								return resolvePendingComponent();
-							} });
-						},
+					return [(0, _solidjs_web.createComponent)(NearestMatchContext, {
+						value: nearestMatch,
 						get children() {
 							return (0, _solidjs_web.createComponent)(_solidjs_web.Dynamic, {
 								get component() {
-									return ResolvedCatchBoundary();
+									return ResolvedSuspenseBoundary();
 								},
-								getResetKey: () => resetKey(),
-								get errorComponent() {
-									return routeErrorComponent() || require_CatchBoundary.ErrorComponent;
-								},
-								onCatch: (error) => {
-									if ((0, _tanstack_router_core.isNotFound)(error)) throw error;
-									(0, tiny_warning.default)(false, `Error in route match: ${solid_js.untrack(matchState).routeId}`);
-									routeOnCatch()?.(error);
+								get fallback() {
+									return (0, _solidjs_web.memo)(() => !!((_tanstack_router_core_isServer.isServer ?? router.isServer) && resolvedNoSsr()))() ? void 0 : (0, _solidjs_web.createComponent)(_solidjs_web.Dynamic, { get component() {
+										return resolvePendingComponent();
+									} });
 								},
 								get children() {
 									return (0, _solidjs_web.createComponent)(_solidjs_web.Dynamic, {
 										get component() {
-											return ResolvedNotFoundBoundary();
+											return ResolvedCatchBoundary();
+										},
+										getResetKey: () => router.stores.loadedAt.state,
+										get errorComponent() {
+											return routeErrorComponent() || require_CatchBoundary.ErrorComponent;
 										},
-										fallback: (error) => {
-											if (!routeNotFoundComponent() || error.routeId && error.routeId !== matchState().routeId || !error.routeId && !route().isRoot) throw error;
-											return (0, _solidjs_web.createComponent)(_solidjs_web.Dynamic, (0, _solidjs_web.mergeProps)({ get component() {
-												return routeNotFoundComponent();
-											} }, error));
+										onCatch: (error) => {
+											if ((0, _tanstack_router_core.isNotFound)(error)) throw error;
+											(0, tiny_warning.default)(false, `Error in route match: ${currentMatchState().routeId}`);
+											routeOnCatch()?.(error);
 										},
 										get children() {
-											return (0, _solidjs_web.createComponent)(solid_js.Switch, { get children() {
-												return [(0, _solidjs_web.createComponent)(solid_js.Match, {
-													get when() {
-														return resolvedNoSsr();
-													},
-													get children() {
-														return (0, _solidjs_web.createComponent)(solid_js.Show, {
+											return (0, _solidjs_web.createComponent)(_solidjs_web.Dynamic, {
+												get component() {
+													return ResolvedNotFoundBoundary();
+												},
+												fallback: (error) => {
+													if (!routeNotFoundComponent() || error.routeId && error.routeId !== currentMatchState().routeId || !error.routeId && !route().isRoot) throw error;
+													return (0, _solidjs_web.createComponent)(_solidjs_web.Dynamic, (0, _solidjs_web.mergeProps)({ get component() {
+														return routeNotFoundComponent();
+													} }, error));
+												},
+												get children() {
+													return (0, _solidjs_web.createComponent)(solid_js.Switch, { get children() {
+														return [(0, _solidjs_web.createComponent)(solid_js.Match, {
 															get when() {
-																return !(_tanstack_router_core_isServer.isServer ?? router.isServer);
+																return resolvedNoSsr();
 															},
-															get fallback() {
-																return (0, _solidjs_web.createComponent)(_solidjs_web.Dynamic, { get component() {
-																	return resolvePendingComponent();
-																} });
+															get children() {
+																return (0, _solidjs_web.createComponent)(solid_js.Show, {
+																	get when() {
+																		return !(_tanstack_router_core_isServer.isServer ?? router.isServer);
+																	},
+																	get fallback() {
+																		return (0, _solidjs_web.createComponent)(_solidjs_web.Dynamic, { get component() {
+																			return resolvePendingComponent();
+																		} });
+																	},
+																	get children() {
+																		return (0, _solidjs_web.createComponent)(MatchInner, {});
+																	}
+																});
+															}
+														}), (0, _solidjs_web.createComponent)(solid_js.Match, {
+															get when() {
+																return !resolvedNoSsr();
 															},
 															get children() {
-																return (0, _solidjs_web.createComponent)(MatchInner, { get matchId() {
-																	return props.matchId;
-																} });
+																return (0, _solidjs_web.createComponent)(MatchInner, {});
 															}
-														});
-													}
-												}), (0, _solidjs_web.createComponent)(solid_js.Match, {
-													get when() {
-														return !resolvedNoSsr();
-													},
-													get children() {
-														return (0, _solidjs_web.createComponent)(MatchInner, { get matchId() {
-															return props.matchId;
-														} });
-													}
-												})];
-											} });
+														})];
+													} });
+												}
+											});
 										}
 									});
 								}
 							});
 						}
-					});
+					}), (0, _solidjs_web.memo)(() => (0, _solidjs_web.memo)(() => currentMatchState().parentRouteId === _tanstack_router_core.rootRouteId)() ? [(0, _solidjs_web.createComponent)(OnRendered, {}), (0, _solidjs_web.createComponent)(require_scroll_restoration.ScrollRestoration, {})] : null)];
 				}
-			}), (0, _solidjs_web.memo)(() => (0, _solidjs_web.memo)(() => parentRouteId() === _tanstack_router_core.rootRouteId)() ? [(0, _solidjs_web.createComponent)(OnRendered, {}), (0, _solidjs_web.createComponent)(require_scroll_restoration.ScrollRestoration, {})] : null)];
+			});
 		}
 	});
 };
 var lastOnRenderedKey = /* @__PURE__ */ new WeakMap();
 function OnRendered() {
 	const router = require_useRouter.useRouter();
-	const location = require_useRouterState.useRouterState({ select: (s) => {
-		return s.resolvedLocation?.state.__TSR_key;
-	} });
-	solid_js.createEffect(() => [location()], ([location]) => {
+	const location = solid_js.createMemo(() => router.stores.resolvedLocation.state?.state.__TSR_key);
+	const locationState = solid_js.createMemo(() => router.stores.location.state);
+	const resolvedLocationState = solid_js.createMemo(() => router.stores.resolvedLocation.state);
+	solid_js.createEffect(() => [
+		location(),
+		locationState(),
+		resolvedLocationState()
+	], ([location, currentLocationState, currentResolvedLocationState]) => {
 		if (!location) return;
 		if (lastOnRenderedKey.get(router) === location) return;
 		lastOnRenderedKey.set(router, location);
 		router.emit({
 			type: "onRendered",
-			...(0, _tanstack_router_core.getLocationChangeInfo)(router.state)
+			...(0, _tanstack_router_core.getLocationChangeInfo)(currentLocationState, currentResolvedLocationState)
 		});
 	});
 	return null;
 }
-var MatchInner = (props) => {
+var MatchInner = () => {
 	const router = require_useRouter.useRouter();
-	const matchState = require_useRouterState.useRouterState({ select: (s) => {
-		const match = s.matches.find((d) => d.id === props.matchId);
-		if (!match) return null;
-		const routeId = match.routeId;
+	const match = solid_js.useContext(require_matchContext.nearestMatchContext).match;
+	const rawMatchState = solid_js.createMemo(() => {
+		const currentMatch = match();
+		if (!currentMatch) return null;
+		const routeId = currentMatch.routeId;
 		const remountDeps = (router.routesById[routeId].options.remountDeps ?? router.options.defaultRemountDeps)?.({
 			routeId,
-			loaderDeps: match.loaderDeps,
-			params: match._strictParams,
-			search: match._strictSearch
+			loaderDeps: currentMatch.loaderDeps,
+			params: currentMatch._strictParams,
+			search: currentMatch._strictSearch
 		});
 		return {
 			key: remountDeps ? JSON.stringify(remountDeps) : void 0,
 			routeId,
 			match: {
-				id: match.id,
-				status: match.status,
-				error: match.error,
-				_forcePending: match._forcePending,
-				_displayPending: match._displayPending
+				id: currentMatch.id,
+				status: currentMatch.status,
+				error: currentMatch.error,
+				_forcePending: currentMatch._forcePending ?? false,
+				_displayPending: currentMatch._displayPending ?? false
 			}
 		};
-	} });
-	if (!solid_js.untrack(matchState)) return null;
-	const route = () => router.routesById[matchState().routeId];
-	const match = () => matchState().match;
-	const componentKey = () => matchState().key ?? matchState().match.id;
-	const out = () => {
-		const Comp = solid_js.untrack(route).options.component ?? router.options.defaultComponent;
-		if (Comp) return (0, _solidjs_web.createComponent)(Comp, {});
-		return (0, _solidjs_web.createComponent)(Outlet, {});
-	};
-	const keyedOut = () => (0, _solidjs_web.createComponent)(solid_js.Show, {
+	});
+	return (0, _solidjs_web.createComponent)(solid_js.Show, {
 		get when() {
-			return componentKey();
+			return rawMatchState();
 		},
-		keyed: true,
-		children: (_key) => out()
-	});
-	return (0, _solidjs_web.createComponent)(solid_js.Switch, { get children() {
-		return [
-			(0, _solidjs_web.createComponent)(solid_js.Match, {
-				get when() {
-					return match()._displayPending;
-				},
-				children: (_) => {
-					const matchId = solid_js.untrack(() => match().id);
-					return (0, _solidjs_web.memo)(solid_js.createMemo(() => router.getMatch(matchId)?._nonReactive.displayPendingPromise));
-				}
-			}),
-			(0, _solidjs_web.createComponent)(solid_js.Match, {
-				get when() {
-					return match()._forcePending;
-				},
-				children: (_) => {
-					const matchId = solid_js.untrack(() => match().id);
-					return (0, _solidjs_web.memo)(solid_js.createMemo(() => router.getMatch(matchId)?._nonReactive.minPendingPromise));
-				}
-			}),
-			(0, _solidjs_web.createComponent)(solid_js.Match, {
+		children: (currentMatchState) => {
+			const route = solid_js.createMemo(() => router.routesById[currentMatchState().routeId]);
+			const currentMatch = solid_js.createMemo(() => currentMatchState().match);
+			const componentKey = solid_js.createMemo(() => currentMatchState().key ?? currentMatchState().match.id);
+			const Comp = solid_js.createMemo(() => route().options.component ?? router.options.defaultComponent);
+			const OutComponent = solid_js.createMemo(() => {
+				return Comp() || Outlet;
+			});
+			const RenderOut = () => (0, _solidjs_web.createComponent)(_solidjs_web.Dynamic, { get component() {
+				return OutComponent();
+			} });
+			const keyedOut = () => (0, _solidjs_web.createComponent)(solid_js.Show, {
 				get when() {
-					return match().status === "pending";
+					return componentKey();
 				},
-				children: (_) => {
-					const currentMatch = solid_js.untrack(match);
-					const currentRoute = solid_js.untrack(route);
-					const pendingMinMs = currentRoute.options.pendingMinMs ?? router.options.defaultPendingMinMs;
-					if (pendingMinMs) {
-						const routerMatch = router.getMatch(currentMatch.id);
-						if (routerMatch && !routerMatch._nonReactive.minPendingPromise) {
-							if (!(_tanstack_router_core_isServer.isServer ?? router.isServer)) {
-								const minPendingPromise = (0, _tanstack_router_core.createControlledPromise)();
-								routerMatch._nonReactive.minPendingPromise = minPendingPromise;
-								setTimeout(() => {
-									minPendingPromise.resolve();
-									routerMatch._nonReactive.minPendingPromise = void 0;
-								}, pendingMinMs);
+				keyed: true,
+				children: (_key) => (0, _solidjs_web.createComponent)(RenderOut, {})
+			});
+			return (0, _solidjs_web.createComponent)(solid_js.Switch, { get children() {
+				return [
+					(0, _solidjs_web.createComponent)(solid_js.Match, {
+						get when() {
+							return currentMatch()._displayPending;
+						},
+						children: (_) => {
+							return (0, _solidjs_web.memo)(solid_js.createMemo(() => router.getMatch(currentMatch().id)?._nonReactive.displayPendingPromise));
+						}
+					}),
+					(0, _solidjs_web.createComponent)(solid_js.Match, {
+						get when() {
+							return currentMatch()._forcePending;
+						},
+						children: (_) => {
+							return (0, _solidjs_web.memo)(solid_js.createMemo(() => router.getMatch(currentMatch().id)?._nonReactive.minPendingPromise));
+						}
+					}),
+					(0, _solidjs_web.createComponent)(solid_js.Match, {
+						get when() {
+							return currentMatch().status === "pending";
+						},
+						children: (_) => {
+							const pendingMinMs = solid_js.untrack(() => route().options.pendingMinMs ?? router.options.defaultPendingMinMs);
+							if (pendingMinMs) {
+								const routerMatch = solid_js.untrack(() => router.getMatch(currentMatch().id));
+								if (routerMatch && !routerMatch._nonReactive.minPendingPromise) {
+									if (!(_tanstack_router_core_isServer.isServer ?? router.isServer)) {
+										const minPendingPromise = (0, _tanstack_router_core.createControlledPromise)();
+										routerMatch._nonReactive.minPendingPromise = minPendingPromise;
+										setTimeout(() => {
+											minPendingPromise.resolve();
+											routerMatch._nonReactive.minPendingPromise = void 0;
+										}, pendingMinMs);
+									}
+								}
 							}
+							const loaderResult = solid_js.createMemo(async () => {
+								await new Promise((r) => setTimeout(r, 0));
+								return router.getMatch(currentMatch().id)?._nonReactive.loadPromise;
+							});
+							const FallbackComponent = solid_js.untrack(() => route().options.pendingComponent ?? router.options.defaultPendingComponent);
+							return [FallbackComponent && pendingMinMs > 0 ? (0, _solidjs_web.createComponent)(_solidjs_web.Dynamic, { component: FallbackComponent }) : null, (0, _solidjs_web.memo)(loaderResult)];
 						}
-					}
-					const loaderResult = solid_js.createMemo(async () => {
-						await new Promise((r) => setTimeout(r, 0));
-						return router.getMatch(currentMatch.id)?._nonReactive.loadPromise;
-					});
-					const FallbackComponent = currentRoute.options.pendingComponent ?? router.options.defaultPendingComponent;
-					return [FallbackComponent && pendingMinMs > 0 ? (0, _solidjs_web.createComponent)(_solidjs_web.Dynamic, { component: FallbackComponent }) : null, (0, _solidjs_web.memo)(loaderResult)];
-				}
-			}),
-			(0, _solidjs_web.createComponent)(solid_js.Match, {
-				get when() {
-					return match().status === "notFound";
-				},
-				children: (_) => {
-					const currentMatch = solid_js.untrack(match);
-					const currentRoute = solid_js.untrack(route);
-					const currentRouteId = solid_js.untrack(() => matchState().routeId);
-					(0, tiny_invariant.default)((0, _tanstack_router_core.isNotFound)(currentMatch.error), "Expected a notFound error");
-					return (0, _solidjs_web.createComponent)(solid_js.Show, {
-						when: currentRouteId,
-						keyed: true,
-						children: (_routeId) => require_renderRouteNotFound.renderRouteNotFound(router, currentRoute, currentMatch.error)
-					});
-				}
-			}),
-			(0, _solidjs_web.createComponent)(solid_js.Match, {
-				get when() {
-					return match().status === "redirected";
-				},
-				children: (_) => {
-					const matchId = solid_js.untrack(() => match().id);
-					(0, tiny_invariant.default)((0, _tanstack_router_core.isRedirect)(solid_js.untrack(match).error), "Expected a redirect error");
-					return (0, _solidjs_web.memo)(solid_js.createMemo(async () => {
-						await new Promise((r) => setTimeout(r, 0));
-						return router.getMatch(matchId)?._nonReactive.loadPromise;
-					}));
-				}
-			}),
-			(0, _solidjs_web.createComponent)(solid_js.Match, {
-				get when() {
-					return match().status === "error";
-				},
-				children: (_) => {
-					if (_tanstack_router_core_isServer.isServer ?? router.isServer) {
-						const currentMatch = solid_js.untrack(match);
-						return (0, _solidjs_web.createComponent)((solid_js.untrack(route).options.errorComponent ?? router.options.defaultErrorComponent) || require_CatchBoundary.ErrorComponent, {
-							get error() {
-								return currentMatch.error;
-							},
-							info: { componentStack: "" }
-						});
-					}
-					throw solid_js.untrack(match).error;
-				}
-			}),
-			(0, _solidjs_web.createComponent)(solid_js.Match, {
-				get when() {
-					return match().status === "success";
-				},
-				get children() {
-					return keyedOut();
-				}
-			})
-		];
-	} });
+					}),
+					(0, _solidjs_web.createComponent)(solid_js.Match, {
+						get when() {
+							return currentMatch().status === "notFound";
+						},
+						children: (_) => {
+							const matchError = solid_js.untrack(() => currentMatch().error);
+							(0, tiny_invariant.default)((0, _tanstack_router_core.isNotFound)(matchError), "Expected a notFound error");
+							return (0, _solidjs_web.createComponent)(solid_js.Show, {
+								get when() {
+									return currentMatchState().routeId;
+								},
+								keyed: true,
+								children: (_routeId) => solid_js.untrack(() => require_renderRouteNotFound.renderRouteNotFound(router, route(), matchError))
+							});
+						}
+					}),
+					(0, _solidjs_web.createComponent)(solid_js.Match, {
+						get when() {
+							return currentMatch().status === "redirected";
+						},
+						children: (_) => {
+							(0, tiny_invariant.default)((0, _tanstack_router_core.isRedirect)(solid_js.untrack(() => currentMatch().error)), "Expected a redirect error");
+							return null;
+						}
+					}),
+					(0, _solidjs_web.createComponent)(solid_js.Match, {
+						get when() {
+							return currentMatch().status === "error";
+						},
+						children: (_) => {
+							const matchError = solid_js.untrack(() => currentMatch().error);
+							if (_tanstack_router_core_isServer.isServer ?? router.isServer) return (0, _solidjs_web.createComponent)((route().options.errorComponent ?? router.options.defaultErrorComponent) || require_CatchBoundary.ErrorComponent, {
+								error: matchError,
+								info: { componentStack: "" }
+							});
+							throw matchError;
+						}
+					}),
+					(0, _solidjs_web.createComponent)(solid_js.Match, {
+						get when() {
+							return currentMatch().status === "success";
+						},
+						get children() {
+							return keyedOut();
+						}
+					})
+				];
+			} });
+		}
+	});
 };
 var Outlet = () => {
 	const router = require_useRouter.useRouter();
-	const matchId = solid_js.useContext(require_matchContext.matchContext);
-	const routeId = require_useRouterState.useRouterState({ select: (s) => s.matches.find((d) => d.id === matchId())?.routeId });
-	const route = () => router.routesById[routeId()];
-	const parentGlobalNotFound = require_useRouterState.useRouterState({ select: (s) => {
-		const parentMatch = s.matches.find((d) => d.id === matchId());
-		if (!parentMatch) return false;
-		return parentMatch.globalNotFound;
-	} });
-	const childMatchId = require_useRouterState.useRouterState({ select: (s) => {
-		const matches = s.matches;
-		return matches[matches.findIndex((d) => d.id === matchId()) + 1]?.id;
-	} });
-	const childRouteId = require_useRouterState.useRouterState({ select: (s) => {
-		const matches = s.matches;
-		return matches[matches.findIndex((d) => d.id === matchId()) + 1]?.routeId;
-	} });
-	const childMatchStatus = require_useRouterState.useRouterState({ select: (s) => {
-		const matches = s.matches;
-		return matches[matches.findIndex((d) => d.id === matchId()) + 1]?.status;
-	} });
+	const nearestParentMatch = solid_js.useContext(require_matchContext.nearestMatchContext);
+	const parentMatch = nearestParentMatch.match;
+	const routeId = nearestParentMatch.routeId;
+	const route = solid_js.createMemo(() => routeId() ? router.routesById[routeId()] : void 0);
+	const parentGlobalNotFound = solid_js.createMemo(() => parentMatch()?.globalNotFound ?? false);
+	const childMatchId = solid_js.createMemo(() => {
+		const currentRouteId = routeId();
+		return currentRouteId ? router.stores.childMatchIdByRouteId.state[currentRouteId] : void 0;
+	});
+	const childRouteId = solid_js.createMemo(() => {
+		const id = childMatchId();
+		if (!id) return void 0;
+		return router.stores.activeMatchStoresById.get(id)?.state.routeId;
+	});
+	const childRoute = solid_js.createMemo(() => {
+		const id = childRouteId();
+		return id ? router.routesById[id] : void 0;
+	});
+	const childPendingComponent = solid_js.createMemo(() => childRoute()?.options.pendingComponent ?? router.options.defaultPendingComponent);
+	const childMatchStatus = solid_js.createMemo(() => {
+		const id = childMatchId();
+		if (!id) return void 0;
+		return router.stores.activeMatchStoresById.get(id)?.state.status;
+	});
 	const shouldShowNotFound = () => childMatchStatus() !== "redirected" && parentGlobalNotFound();
 	return (0, _solidjs_web.createComponent)(solid_js.Show, {
 		get when() {
@@ -325,15 +344,13 @@ var Outlet = () => {
 		get fallback() {
 			return (0, _solidjs_web.createComponent)(solid_js.Show, {
 				get when() {
-					return shouldShowNotFound();
+					return (0, _solidjs_web.memo)(() => !!shouldShowNotFound())() && route();
 				},
-				get children() {
-					return require_renderRouteNotFound.renderRouteNotFound(router, route(), void 0);
-				}
+				children: (resolvedRoute) => solid_js.untrack(() => require_renderRouteNotFound.renderRouteNotFound(router, resolvedRoute(), void 0))
 			});
 		},
-		children: (matchIdAccessor) => {
-			const currentMatchId = solid_js.createMemo(() => matchIdAccessor());
+		children: (childMatchIdAccessor) => {
+			const currentMatchId = solid_js.createMemo(() => childMatchIdAccessor());
 			return (0, _solidjs_web.createComponent)(solid_js.Show, {
 				get when() {
 					return routeId() === _tanstack_router_core.rootRouteId;
@@ -351,9 +368,9 @@ var Outlet = () => {
 						keyed: true,
 						children: (_routeId) => (0, _solidjs_web.createComponent)(solid_js.Loading, {
 							get fallback() {
-								return (0, _solidjs_web.createComponent)(_solidjs_web.Dynamic, { get component() {
-									return router.options.defaultPendingComponent;
-								} });
+								return (0, _solidjs_web.memo)(() => !!childPendingComponent())() ? (0, _solidjs_web.createComponent)(_solidjs_web.Dynamic, { get component() {
+									return childPendingComponent();
+								} }) : null;
 							},
 							get children() {
 								return (0, _solidjs_web.createComponent)(Match, { get matchId() {