@tanstack/router-core 1.131.13 → 1.131.16

package/dist/esm/router.js

@@ -1,7 +1,7 @@
 import { Store, batch } from "@tanstack/store";
 import { createMemoryHistory, createBrowserHistory, parseHref } from "@tanstack/history";
 import invariant from "tiny-invariant";
-import { pick, createControlledPromise, deepEqual, replaceEqualDeep, last, functionalUpdate } from "./utils.js";
+import { pick, createControlledPromise, isPromise, deepEqual, replaceEqualDeep, last, functionalUpdate } from "./utils.js";
 import { trimPath, resolvePath, cleanPath, matchPathname, trimPathRight, interpolatePath, joinPaths, trimPathLeft, parsePathname, SEGMENT_TYPE_PARAM, SEGMENT_TYPE_OPTIONAL_PARAM, SEGMENT_TYPE_WILDCARD, SEGMENT_TYPE_PATHNAME } from "./path.js";
 import { isNotFound } from "./not-found.js";
 import { setupScrollRestoration } from "./scroll-restoration.js";
@@ -703,518 +703,598 @@ class RouterCore {
       const findFn = (d) => d.id === matchId;
       return this.state.cachedMatches.find(findFn) ?? ((_a = this.state.pendingMatches) == null ? void 0 : _a.find(findFn)) ?? this.state.matches.find(findFn);
     };
-    this.loadMatches = async ({
-      location,
-      matches,
-      preload: allPreload,
-      onReady,
-      updateMatch = this.updateMatch,
-      sync
-    }) => {
-      let firstBadMatchIndex;
-      let rendered = false;
-      const triggerOnReady = async () => {
-        if (!rendered) {
-          rendered = true;
-          await (onReady == null ? void 0 : onReady());
+    this.triggerOnReady = (innerLoadContext) => {
+      var _a;
+      if (!innerLoadContext.rendered) {
+        innerLoadContext.rendered = true;
+        return (_a = innerLoadContext.onReady) == null ? void 0 : _a.call(innerLoadContext);
+      }
+    };
+    this.resolvePreload = (innerLoadContext, matchId) => {
+      return !!(innerLoadContext.preload && !this.state.matches.some((d) => d.id === matchId));
+    };
+    this.handleRedirectAndNotFound = (innerLoadContext, match, err) => {
+      var _a, _b, _c;
+      if (!isRedirect(err) && !isNotFound(err)) return;
+      if (isRedirect(err) && err.redirectHandled && !err.options.reloadDocument) {
+        throw err;
+      }
+      if (match) {
+        (_a = match._nonReactive.beforeLoadPromise) == null ? void 0 : _a.resolve();
+        (_b = match._nonReactive.loaderPromise) == null ? void 0 : _b.resolve();
+        match._nonReactive.beforeLoadPromise = void 0;
+        match._nonReactive.loaderPromise = void 0;
+        const status = isRedirect(err) ? "redirected" : "notFound";
+        innerLoadContext.updateMatch(match.id, (prev) => ({
+          ...prev,
+          status,
+          isFetching: false,
+          error: err
+        }));
+        if (isNotFound(err) && !err.routeId) {
+          err.routeId = match.routeId;
+        }
+        (_c = match._nonReactive.loadPromise) == null ? void 0 : _c.resolve();
+      }
+      if (isRedirect(err)) {
+        innerLoadContext.rendered = true;
+        err.options._fromLocation = innerLoadContext.location;
+        err.redirectHandled = true;
+        err = this.resolveRedirect(err);
+        throw err;
+      } else {
+        this._handleNotFound(innerLoadContext, err);
+        throw err;
+      }
+    };
+    this.shouldSkipLoader = (matchId) => {
+      const match = this.getMatch(matchId);
+      if (!this.isServer && match._nonReactive.dehydrated) {
+        return true;
+      }
+      if (this.isServer) {
+        if (match.ssr === false) {
+          return true;
+        }
+      }
+      return false;
+    };
+    this.handleSerialError = (innerLoadContext, index, err, routerCode) => {
+      var _a, _b;
+      const { id: matchId, routeId } = innerLoadContext.matches[index];
+      const route = this.looseRoutesById[routeId];
+      if (err instanceof Promise) {
+        throw err;
+      }
+      err.routerCode = routerCode;
+      innerLoadContext.firstBadMatchIndex ?? (innerLoadContext.firstBadMatchIndex = index);
+      this.handleRedirectAndNotFound(
+        innerLoadContext,
+        this.getMatch(matchId),
+        err
+      );
+      try {
+        (_b = (_a = route.options).onError) == null ? void 0 : _b.call(_a, err);
+      } catch (errorHandlerErr) {
+        err = errorHandlerErr;
+        this.handleRedirectAndNotFound(
+          innerLoadContext,
+          this.getMatch(matchId),
+          err
+        );
+      }
+      innerLoadContext.updateMatch(matchId, (prev) => {
+        var _a2, _b2;
+        (_a2 = prev._nonReactive.beforeLoadPromise) == null ? void 0 : _a2.resolve();
+        prev._nonReactive.beforeLoadPromise = void 0;
+        (_b2 = prev._nonReactive.loadPromise) == null ? void 0 : _b2.resolve();
+        return {
+          ...prev,
+          error: err,
+          status: "error",
+          isFetching: false,
+          updatedAt: Date.now(),
+          abortController: new AbortController()
+        };
+      });
+    };
+    this.isBeforeLoadSsr = (innerLoadContext, matchId, index, route) => {
+      var _a;
+      const existingMatch = this.getMatch(matchId);
+      const parentMatchId = (_a = innerLoadContext.matches[index - 1]) == null ? void 0 : _a.id;
+      const parentMatch = parentMatchId ? this.getMatch(parentMatchId) : void 0;
+      if (this.isShell()) {
+        existingMatch.ssr = matchId === rootRouteId;
+        return;
+      }
+      if ((parentMatch == null ? void 0 : parentMatch.ssr) === false) {
+        existingMatch.ssr = false;
+        return;
+      }
+      const parentOverride = (tempSsr2) => {
+        if (tempSsr2 === true && (parentMatch == null ? void 0 : parentMatch.ssr) === "data-only") {
+          return "data-only";
         }
+        return tempSsr2;
       };
-      const resolvePreload = (matchId) => {
-        return !!(allPreload && !this.state.matches.some((d) => d.id === matchId));
+      const defaultSsr = this.options.defaultSsr ?? true;
+      if (route.options.ssr === void 0) {
+        existingMatch.ssr = parentOverride(defaultSsr);
+        return;
+      }
+      if (typeof route.options.ssr !== "function") {
+        existingMatch.ssr = parentOverride(route.options.ssr);
+        return;
+      }
+      const { search, params } = this.getMatch(matchId);
+      const ssrFnContext = {
+        search: makeMaybe(search, existingMatch.searchError),
+        params: makeMaybe(params, existingMatch.paramsError),
+        location: innerLoadContext.location,
+        matches: innerLoadContext.matches.map((match) => ({
+          index: match.index,
+          pathname: match.pathname,
+          fullPath: match.fullPath,
+          staticData: match.staticData,
+          id: match.id,
+          routeId: match.routeId,
+          search: makeMaybe(match.search, match.searchError),
+          params: makeMaybe(match.params, match.paramsError),
+          ssr: match.ssr
+        }))
       };
-      if (!this.isServer && this.state.matches.some((d) => d._forcePending)) {
-        triggerOnReady();
+      const tempSsr = route.options.ssr(ssrFnContext);
+      if (isPromise(tempSsr)) {
+        return tempSsr.then((ssr) => {
+          existingMatch.ssr = parentOverride(ssr ?? defaultSsr);
+        });
       }
-      const handleRedirectAndNotFound = (match, err) => {
-        var _a, _b, _c;
-        if (!isRedirect(err) && !isNotFound(err)) return;
-        if (isRedirect(err) && err.redirectHandled && !err.options.reloadDocument) {
-          throw err;
+      existingMatch.ssr = parentOverride(tempSsr ?? defaultSsr);
+      return;
+    };
+    this.setupPendingTimeout = (innerLoadContext, matchId, route) => {
+      var _a;
+      const pendingMs = route.options.pendingMs ?? this.options.defaultPendingMs;
+      const shouldPending = !!(innerLoadContext.onReady && !this.isServer && !this.resolvePreload(innerLoadContext, matchId) && (route.options.loader || route.options.beforeLoad || routeNeedsPreload(route)) && typeof pendingMs === "number" && pendingMs !== Infinity && (route.options.pendingComponent ?? ((_a = this.options) == null ? void 0 : _a.defaultPendingComponent)));
+      const match = this.getMatch(matchId);
+      if (shouldPending && match._nonReactive.pendingTimeout === void 0) {
+        const pendingTimeout = setTimeout(() => {
+          try {
+            this.triggerOnReady(innerLoadContext);
+          } catch {
+          }
+        }, pendingMs);
+        match._nonReactive.pendingTimeout = pendingTimeout;
+      }
+    };
+    this.shouldExecuteBeforeLoad = (innerLoadContext, matchId, route) => {
+      const existingMatch = this.getMatch(matchId);
+      if (!existingMatch._nonReactive.beforeLoadPromise && !existingMatch._nonReactive.loaderPromise)
+        return true;
+      this.setupPendingTimeout(innerLoadContext, matchId, route);
+      const then = () => {
+        let shouldExecuteBeforeLoad = true;
+        const match = this.getMatch(matchId);
+        if (match.status === "error") {
+          shouldExecuteBeforeLoad = true;
+        } else if (match.preload && (match.status === "redirected" || match.status === "notFound")) {
+          this.handleRedirectAndNotFound(innerLoadContext, match, match.error);
         }
-        if (match) {
-          (_a = match._nonReactive.beforeLoadPromise) == null ? void 0 : _a.resolve();
-          (_b = match._nonReactive.loaderPromise) == null ? void 0 : _b.resolve();
-          match._nonReactive.beforeLoadPromise = void 0;
-          match._nonReactive.loaderPromise = void 0;
-          const status = isRedirect(err) ? "redirected" : "notFound";
-          updateMatch(match.id, (prev) => ({
+        return shouldExecuteBeforeLoad;
+      };
+      return existingMatch._nonReactive.beforeLoadPromise ? existingMatch._nonReactive.beforeLoadPromise.then(then) : then();
+    };
+    this.executeBeforeLoad = (innerLoadContext, matchId, index, route) => {
+      var _a, _b, _c;
+      const resolve = () => {
+        innerLoadContext.updateMatch(matchId, (prev) => {
+          var _a2;
+          (_a2 = prev._nonReactive.beforeLoadPromise) == null ? void 0 : _a2.resolve();
+          prev._nonReactive.beforeLoadPromise = void 0;
+          return {
             ...prev,
-            status,
-            isFetching: false,
-            error: err
-          }));
-          if (isNotFound(err) && !err.routeId) {
-            err.routeId = match.routeId;
-          }
-          (_c = match._nonReactive.loadPromise) == null ? void 0 : _c.resolve();
+            isFetching: false
+          };
+        });
+      };
+      try {
+        const match = this.getMatch(matchId);
+        match._nonReactive.beforeLoadPromise = createControlledPromise();
+        const prevLoadPromise = match._nonReactive.loadPromise;
+        match._nonReactive.loadPromise = createControlledPromise(() => {
+          prevLoadPromise == null ? void 0 : prevLoadPromise.resolve();
+        });
+        const { paramsError, searchError } = this.getMatch(matchId);
+        if (paramsError) {
+          this.handleSerialError(
+            innerLoadContext,
+            index,
+            paramsError,
+            "PARSE_PARAMS"
+          );
         }
-        if (isRedirect(err)) {
-          rendered = true;
-          err.options._fromLocation = location;
-          err.redirectHandled = true;
-          err = this.resolveRedirect(err);
-          throw err;
+        if (searchError) {
+          this.handleSerialError(
+            innerLoadContext,
+            index,
+            searchError,
+            "VALIDATE_SEARCH"
+          );
+        }
+        this.setupPendingTimeout(innerLoadContext, matchId, route);
+        const abortController = new AbortController();
+        const parentMatchId = (_a = innerLoadContext.matches[index - 1]) == null ? void 0 : _a.id;
+        const parentMatch = parentMatchId ? this.getMatch(parentMatchId) : void 0;
+        const parentMatchContext = (parentMatch == null ? void 0 : parentMatch.context) ?? this.options.context ?? void 0;
+        innerLoadContext.updateMatch(matchId, (prev) => ({
+          ...prev,
+          isFetching: "beforeLoad",
+          fetchCount: prev.fetchCount + 1,
+          abortController,
+          context: {
+            ...parentMatchContext,
+            ...prev.__routeContext
+          }
+        }));
+        const { search, params, context, cause } = this.getMatch(matchId);
+        const preload = this.resolvePreload(innerLoadContext, matchId);
+        const beforeLoadFnContext = {
+          search,
+          abortController,
+          params,
+          preload,
+          context,
+          location: innerLoadContext.location,
+          navigate: (opts) => this.navigate({ ...opts, _fromLocation: innerLoadContext.location }),
+          buildLocation: this.buildLocation,
+          cause: preload ? "preload" : cause,
+          matches: innerLoadContext.matches
+        };
+        const updateContext = (beforeLoadContext2) => {
+          if (isRedirect(beforeLoadContext2) || isNotFound(beforeLoadContext2)) {
+            this.handleSerialError(
+              innerLoadContext,
+              index,
+              beforeLoadContext2,
+              "BEFORE_LOAD"
+            );
+          }
+          innerLoadContext.updateMatch(matchId, (prev) => ({
+            ...prev,
+            __beforeLoadContext: beforeLoadContext2,
+            context: {
+              ...parentMatchContext,
+              ...prev.__routeContext,
+              ...beforeLoadContext2
+            },
+            abortController
+          }));
+        };
+        const beforeLoadContext = (_c = (_b = route.options).beforeLoad) == null ? void 0 : _c.call(_b, beforeLoadFnContext);
+        if (isPromise(beforeLoadContext)) {
+          return beforeLoadContext.then(updateContext).catch((err) => {
+            this.handleSerialError(innerLoadContext, index, err, "BEFORE_LOAD");
+          }).then(resolve);
         } else {
-          this._handleNotFound(matches, err, updateMatch);
-          throw err;
+          updateContext(beforeLoadContext);
+        }
+      } catch (err) {
+        this.handleSerialError(innerLoadContext, index, err, "BEFORE_LOAD");
+      }
+      resolve();
+      return;
+    };
+    this.handleBeforeLoad = (innerLoadContext, index) => {
+      const { id: matchId, routeId } = innerLoadContext.matches[index];
+      const route = this.looseRoutesById[routeId];
+      const serverSsr = () => {
+        if (this.isServer) {
+          const maybePromise = this.isBeforeLoadSsr(
+            innerLoadContext,
+            matchId,
+            index,
+            route
+          );
+          if (isPromise(maybePromise)) return maybePromise.then(queueExecution);
         }
+        return queueExecution();
+      };
+      const queueExecution = () => {
+        if (this.shouldSkipLoader(matchId)) return;
+        const shouldExecuteBeforeLoadResult = this.shouldExecuteBeforeLoad(
+          innerLoadContext,
+          matchId,
+          route
+        );
+        return isPromise(shouldExecuteBeforeLoadResult) ? shouldExecuteBeforeLoadResult.then(execute) : execute(shouldExecuteBeforeLoadResult);
+      };
+      const execute = (shouldExecuteBeforeLoad) => {
+        if (shouldExecuteBeforeLoad) {
+          return this.executeBeforeLoad(innerLoadContext, matchId, index, route);
+        }
+        return;
+      };
+      return serverSsr();
+    };
+    this.executeHead = (innerLoadContext, matchId, route) => {
+      var _a, _b, _c, _d, _e, _f;
+      const match = this.getMatch(matchId);
+      if (!match) {
+        return;
+      }
+      if (!route.options.head && !route.options.scripts && !route.options.headers) {
+        return;
+      }
+      const assetContext = {
+        matches: innerLoadContext.matches,
+        match,
+        params: match.params,
+        loaderData: match.loaderData
+      };
+      return Promise.all([
+        (_b = (_a = route.options).head) == null ? void 0 : _b.call(_a, assetContext),
+        (_d = (_c = route.options).scripts) == null ? void 0 : _d.call(_c, assetContext),
+        (_f = (_e = route.options).headers) == null ? void 0 : _f.call(_e, assetContext)
+      ]).then(([headFnContent, scripts, headers]) => {
+        const meta = headFnContent == null ? void 0 : headFnContent.meta;
+        const links = headFnContent == null ? void 0 : headFnContent.links;
+        const headScripts = headFnContent == null ? void 0 : headFnContent.scripts;
+        const styles = headFnContent == null ? void 0 : headFnContent.styles;
+        return {
+          meta,
+          links,
+          headScripts,
+          headers,
+          scripts,
+          styles
+        };
+      });
+    };
+    this.potentialPendingMinPromise = (matchId) => {
+      const latestMatch = this.getMatch(matchId);
+      return latestMatch._nonReactive.minPendingPromise;
+    };
+    this.getLoaderContext = (innerLoadContext, matchId, index, route) => {
+      const parentMatchPromise = innerLoadContext.matchPromises[index - 1];
+      const { params, loaderDeps, abortController, context, cause } = this.getMatch(matchId);
+      const preload = this.resolvePreload(innerLoadContext, matchId);
+      return {
+        params,
+        deps: loaderDeps,
+        preload: !!preload,
+        parentMatchPromise,
+        abortController,
+        context,
+        location: innerLoadContext.location,
+        navigate: (opts) => this.navigate({ ...opts, _fromLocation: innerLoadContext.location }),
+        cause: preload ? "preload" : cause,
+        route
       };
-      const shouldSkipLoader = (matchId) => {
+    };
+    this.runLoader = async (innerLoadContext, matchId, index, route) => {
+      var _a, _b, _c, _d;
+      try {
+        try {
+          if (!this.isServer || this.getMatch(matchId).ssr === true) {
+            this.loadRouteChunk(route);
+          }
+          const loaderResult = (_b = (_a = route.options).loader) == null ? void 0 : _b.call(
+            _a,
+            this.getLoaderContext(innerLoadContext, matchId, index, route)
+          );
+          const loaderResultIsPromise = route.options.loader && isPromise(loaderResult);
+          const willLoadSomething = !!(loaderResultIsPromise || route._lazyPromise || route._componentsPromise || route.options.head || route.options.scripts || route.options.headers || this.getMatch(matchId)._nonReactive.minPendingPromise);
+          if (willLoadSomething) {
+            innerLoadContext.updateMatch(matchId, (prev) => ({
+              ...prev,
+              isFetching: "loader"
+            }));
+          }
+          if (route.options.loader) {
+            const loaderData = loaderResultIsPromise ? await loaderResult : loaderResult;
+            this.handleRedirectAndNotFound(
+              innerLoadContext,
+              this.getMatch(matchId),
+              loaderData
+            );
+            innerLoadContext.updateMatch(matchId, (prev) => ({
+              ...prev,
+              loaderData
+            }));
+          }
+          if (route._lazyPromise) await route._lazyPromise;
+          const headResult = this.executeHead(innerLoadContext, matchId, route);
+          const head = headResult ? await headResult : void 0;
+          const pendingPromise = this.potentialPendingMinPromise(matchId);
+          if (pendingPromise) await pendingPromise;
+          if (route._componentsPromise) await route._componentsPromise;
+          innerLoadContext.updateMatch(matchId, (prev) => ({
+            ...prev,
+            error: void 0,
+            status: "success",
+            isFetching: false,
+            updatedAt: Date.now(),
+            ...head
+          }));
+        } catch (e) {
+          let error = e;
+          await this.potentialPendingMinPromise(matchId);
+          this.handleRedirectAndNotFound(
+            innerLoadContext,
+            this.getMatch(matchId),
+            e
+          );
+          try {
+            (_d = (_c = route.options).onError) == null ? void 0 : _d.call(_c, e);
+          } catch (onErrorError) {
+            error = onErrorError;
+            this.handleRedirectAndNotFound(
+              innerLoadContext,
+              this.getMatch(matchId),
+              onErrorError
+            );
+          }
+          const headResult = this.executeHead(innerLoadContext, matchId, route);
+          const head = headResult ? await headResult : void 0;
+          innerLoadContext.updateMatch(matchId, (prev) => ({
+            ...prev,
+            error,
+            status: "error",
+            isFetching: false,
+            ...head
+          }));
+        }
+      } catch (err) {
         const match = this.getMatch(matchId);
-        if (!this.isServer && match._nonReactive.dehydrated) {
-          return true;
+        if (match) {
+          const headResult = this.executeHead(innerLoadContext, matchId, route);
+          if (headResult) {
+            const head = await headResult;
+            innerLoadContext.updateMatch(matchId, (prev) => ({
+              ...prev,
+              ...head
+            }));
+          }
+          match._nonReactive.loaderPromise = void 0;
         }
+        this.handleRedirectAndNotFound(innerLoadContext, match, err);
+      }
+    };
+    this.loadRouteMatch = async (innerLoadContext, index) => {
+      var _a, _b;
+      const { id: matchId, routeId } = innerLoadContext.matches[index];
+      let loaderShouldRunAsync = false;
+      let loaderIsRunningAsync = false;
+      const route = this.looseRoutesById[routeId];
+      const prevMatch = this.getMatch(matchId);
+      if (this.shouldSkipLoader(matchId)) {
         if (this.isServer) {
-          if (match.ssr === false) {
-            return true;
+          const headResult = this.executeHead(innerLoadContext, matchId, route);
+          if (headResult) {
+            const head = await headResult;
+            innerLoadContext.updateMatch(matchId, (prev) => ({
+              ...prev,
+              ...head
+            }));
           }
+          return this.getMatch(matchId);
         }
-        return false;
-      };
+      } else if (prevMatch._nonReactive.loaderPromise) {
+        if (prevMatch.status === "success" && !innerLoadContext.sync && !prevMatch.preload) {
+          return this.getMatch(matchId);
+        }
+        await prevMatch._nonReactive.loaderPromise;
+        const match = this.getMatch(matchId);
+        if (match.error) {
+          this.handleRedirectAndNotFound(innerLoadContext, match, match.error);
+        }
+      } else {
+        const age = Date.now() - this.getMatch(matchId).updatedAt;
+        const preload = this.resolvePreload(innerLoadContext, matchId);
+        const staleAge = preload ? route.options.preloadStaleTime ?? this.options.defaultPreloadStaleTime ?? 3e4 : route.options.staleTime ?? this.options.defaultStaleTime ?? 0;
+        const shouldReloadOption = route.options.shouldReload;
+        const shouldReload = typeof shouldReloadOption === "function" ? shouldReloadOption(
+          this.getLoaderContext(innerLoadContext, matchId, index, route)
+        ) : shouldReloadOption;
+        innerLoadContext.updateMatch(matchId, (prev) => {
+          prev._nonReactive.loaderPromise = createControlledPromise();
+          return {
+            ...prev,
+            preload: !!preload && !this.state.matches.some((d) => d.id === matchId)
+          };
+        });
+        const { status, invalid } = this.getMatch(matchId);
+        loaderShouldRunAsync = status === "success" && (invalid || (shouldReload ?? age > staleAge));
+        if (preload && route.options.preload === false) ;
+        else if (loaderShouldRunAsync && !innerLoadContext.sync) {
+          loaderIsRunningAsync = true;
+          (async () => {
+            var _a2, _b2;
+            try {
+              await this.runLoader(innerLoadContext, matchId, index, route);
+              const match = this.getMatch(matchId);
+              (_a2 = match._nonReactive.loaderPromise) == null ? void 0 : _a2.resolve();
+              (_b2 = match._nonReactive.loadPromise) == null ? void 0 : _b2.resolve();
+              match._nonReactive.loaderPromise = void 0;
+            } catch (err) {
+              if (isRedirect(err)) {
+                await this.navigate(err.options);
+              }
+            }
+          })();
+        } else if (status !== "success" || loaderShouldRunAsync && innerLoadContext.sync) {
+          await this.runLoader(innerLoadContext, matchId, index, route);
+        } else {
+          const headResult = this.executeHead(innerLoadContext, matchId, route);
+          if (headResult) {
+            const head = await headResult;
+            innerLoadContext.updateMatch(matchId, (prev) => ({
+              ...prev,
+              ...head
+            }));
+          }
+        }
+      }
+      if (!loaderIsRunningAsync) {
+        const match = this.getMatch(matchId);
+        (_a = match._nonReactive.loaderPromise) == null ? void 0 : _a.resolve();
+        (_b = match._nonReactive.loadPromise) == null ? void 0 : _b.resolve();
+      }
+      innerLoadContext.updateMatch(matchId, (prev) => {
+        clearTimeout(prev._nonReactive.pendingTimeout);
+        prev._nonReactive.pendingTimeout = void 0;
+        if (!loaderIsRunningAsync) prev._nonReactive.loaderPromise = void 0;
+        prev._nonReactive.dehydrated = void 0;
+        return {
+          ...prev,
+          isFetching: loaderIsRunningAsync ? prev.isFetching : false,
+          invalid: false
+        };
+      });
+      return this.getMatch(matchId);
+    };
+    this.loadMatches = async (baseContext) => {
+      const innerLoadContext = baseContext;
+      innerLoadContext.updateMatch ?? (innerLoadContext.updateMatch = this.updateMatch);
+      innerLoadContext.matchPromises = [];
+      if (!this.isServer && this.state.matches.some((d) => d._forcePending)) {
+        this.triggerOnReady(innerLoadContext);
+      }
       try {
         await new Promise((resolveAll, rejectAll) => {
           ;
           (async () => {
-            var _a, _b, _c, _d;
             try {
-              const handleSerialError = (index, err, routerCode) => {
-                var _a2, _b2;
-                const { id: matchId, routeId } = matches[index];
-                const route = this.looseRoutesById[routeId];
-                if (err instanceof Promise) {
-                  throw err;
-                }
-                err.routerCode = routerCode;
-                firstBadMatchIndex = firstBadMatchIndex ?? index;
-                handleRedirectAndNotFound(this.getMatch(matchId), err);
-                try {
-                  (_b2 = (_a2 = route.options).onError) == null ? void 0 : _b2.call(_a2, err);
-                } catch (errorHandlerErr) {
-                  err = errorHandlerErr;
-                  handleRedirectAndNotFound(this.getMatch(matchId), err);
-                }
-                updateMatch(matchId, (prev) => {
-                  var _a3, _b3;
-                  (_a3 = prev._nonReactive.beforeLoadPromise) == null ? void 0 : _a3.resolve();
-                  prev._nonReactive.beforeLoadPromise = void 0;
-                  (_b3 = prev._nonReactive.loadPromise) == null ? void 0 : _b3.resolve();
-                  return {
-                    ...prev,
-                    error: err,
-                    status: "error",
-                    isFetching: false,
-                    updatedAt: Date.now(),
-                    abortController: new AbortController()
-                  };
-                });
-              };
-              for (const [index, { id: matchId, routeId }] of matches.entries()) {
-                const existingMatch = this.getMatch(matchId);
-                const parentMatchId = (_a = matches[index - 1]) == null ? void 0 : _a.id;
-                const parentMatch = parentMatchId ? this.getMatch(parentMatchId) : void 0;
-                const route = this.looseRoutesById[routeId];
-                const pendingMs = route.options.pendingMs ?? this.options.defaultPendingMs;
-                if (this.isServer) {
-                  let ssr;
-                  if (this.isShell()) {
-                    ssr = matchId === rootRouteId;
-                  } else {
-                    const defaultSsr = this.options.defaultSsr ?? true;
-                    if ((parentMatch == null ? void 0 : parentMatch.ssr) === false) {
-                      ssr = false;
-                    } else {
-                      let tempSsr;
-                      if (route.options.ssr === void 0) {
-                        tempSsr = defaultSsr;
-                      } else if (typeof route.options.ssr === "function") {
-                        let makeMaybe = function(value, error) {
-                          if (error) {
-                            return { status: "error", error };
-                          }
-                          return { status: "success", value };
-                        };
-                        const { search, params } = this.getMatch(matchId);
-                        const ssrFnContext = {
-                          search: makeMaybe(search, existingMatch.searchError),
-                          params: makeMaybe(params, existingMatch.paramsError),
-                          location,
-                          matches: matches.map((match) => ({
-                            index: match.index,
-                            pathname: match.pathname,
-                            fullPath: match.fullPath,
-                            staticData: match.staticData,
-                            id: match.id,
-                            routeId: match.routeId,
-                            search: makeMaybe(match.search, match.searchError),
-                            params: makeMaybe(match.params, match.paramsError),
-                            ssr: match.ssr
-                          }))
-                        };
-                        tempSsr = await route.options.ssr(ssrFnContext) ?? defaultSsr;
-                      } else {
-                        tempSsr = route.options.ssr;
-                      }
-                      if (tempSsr === true && (parentMatch == null ? void 0 : parentMatch.ssr) === "data-only") {
-                        ssr = "data-only";
-                      } else {
-                        ssr = tempSsr;
-                      }
-                    }
-                  }
-                  existingMatch.ssr = ssr;
-                }
-                if (shouldSkipLoader(matchId)) {
-                  continue;
-                }
-                const shouldPending = !!(onReady && !this.isServer && !resolvePreload(matchId) && (route.options.loader || route.options.beforeLoad || routeNeedsPreload(route)) && typeof pendingMs === "number" && pendingMs !== Infinity && (route.options.pendingComponent ?? ((_b = this.options) == null ? void 0 : _b.defaultPendingComponent)));
-                let executeBeforeLoad = true;
-                const setupPendingTimeout = () => {
-                  const match = this.getMatch(matchId);
-                  if (shouldPending && match._nonReactive.pendingTimeout === void 0) {
-                    const pendingTimeout = setTimeout(() => {
-                      try {
-                        triggerOnReady();
-                      } catch {
-                      }
-                    }, pendingMs);
-                    match._nonReactive.pendingTimeout = pendingTimeout;
-                  }
-                };
-                if (
-                  // If we are in the middle of a load, either of these will be present
-                  // (not to be confused with `loadPromise`, which is always defined)
-                  existingMatch._nonReactive.beforeLoadPromise || existingMatch._nonReactive.loaderPromise
-                ) {
-                  setupPendingTimeout();
-                  await existingMatch._nonReactive.beforeLoadPromise;
-                  const match = this.getMatch(matchId);
-                  if (match.status === "error") {
-                    executeBeforeLoad = true;
-                  } else if (match.preload && (match.status === "redirected" || match.status === "notFound")) {
-                    handleRedirectAndNotFound(match, match.error);
-                  }
-                }
-                if (executeBeforeLoad) {
-                  try {
-                    const match = this.getMatch(matchId);
-                    match._nonReactive.beforeLoadPromise = createControlledPromise();
-                    const prevLoadPromise = match._nonReactive.loadPromise;
-                    match._nonReactive.loadPromise = createControlledPromise(() => {
-                      prevLoadPromise == null ? void 0 : prevLoadPromise.resolve();
-                    });
-                    const { paramsError, searchError } = this.getMatch(matchId);
-                    if (paramsError) {
-                      handleSerialError(index, paramsError, "PARSE_PARAMS");
-                    }
-                    if (searchError) {
-                      handleSerialError(index, searchError, "VALIDATE_SEARCH");
-                    }
-                    setupPendingTimeout();
-                    const abortController = new AbortController();
-                    const parentMatchContext = (parentMatch == null ? void 0 : parentMatch.context) ?? this.options.context ?? void 0;
-                    updateMatch(matchId, (prev) => ({
-                      ...prev,
-                      isFetching: "beforeLoad",
-                      fetchCount: prev.fetchCount + 1,
-                      abortController,
-                      context: {
-                        ...parentMatchContext,
-                        ...prev.__routeContext
-                      }
-                    }));
-                    const { search, params, context, cause } = this.getMatch(matchId);
-                    const preload = resolvePreload(matchId);
-                    const beforeLoadFnContext = {
-                      search,
-                      abortController,
-                      params,
-                      preload,
-                      context,
-                      location,
-                      navigate: (opts) => this.navigate({ ...opts, _fromLocation: location }),
-                      buildLocation: this.buildLocation,
-                      cause: preload ? "preload" : cause,
-                      matches
-                    };
-                    const beforeLoadContext = await ((_d = (_c = route.options).beforeLoad) == null ? void 0 : _d.call(_c, beforeLoadFnContext));
-                    if (isRedirect(beforeLoadContext) || isNotFound(beforeLoadContext)) {
-                      handleSerialError(index, beforeLoadContext, "BEFORE_LOAD");
-                    }
-                    updateMatch(matchId, (prev) => {
-                      return {
-                        ...prev,
-                        __beforeLoadContext: beforeLoadContext,
-                        context: {
-                          ...parentMatchContext,
-                          ...prev.__routeContext,
-                          ...beforeLoadContext
-                        },
-                        abortController
-                      };
-                    });
-                  } catch (err) {
-                    handleSerialError(index, err, "BEFORE_LOAD");
-                  }
-                  updateMatch(matchId, (prev) => {
-                    var _a2;
-                    (_a2 = prev._nonReactive.beforeLoadPromise) == null ? void 0 : _a2.resolve();
-                    prev._nonReactive.beforeLoadPromise = void 0;
-                    return {
-                      ...prev,
-                      isFetching: false
-                    };
-                  });
-                }
+              for (let i = 0; i < innerLoadContext.matches.length; i++) {
+                const beforeLoad = this.handleBeforeLoad(innerLoadContext, i);
+                if (isPromise(beforeLoad)) await beforeLoad;
               }
-              const validResolvedMatches = matches.slice(0, firstBadMatchIndex);
-              const matchPromises = [];
-              validResolvedMatches.forEach(({ id: matchId, routeId }, index) => {
-                matchPromises.push(
-                  (async () => {
-                    var _a2, _b2;
-                    let loaderShouldRunAsync = false;
-                    let loaderIsRunningAsync = false;
-                    const route = this.looseRoutesById[routeId];
-                    const executeHead = () => {
-                      var _a3, _b3, _c2, _d2, _e, _f;
-                      const match = this.getMatch(matchId);
-                      if (!match) {
-                        return;
-                      }
-                      if (!route.options.head && !route.options.scripts && !route.options.headers) {
-                        return;
-                      }
-                      const assetContext = {
-                        matches,
-                        match,
-                        params: match.params,
-                        loaderData: match.loaderData
-                      };
-                      return Promise.all([
-                        (_b3 = (_a3 = route.options).head) == null ? void 0 : _b3.call(_a3, assetContext),
-                        (_d2 = (_c2 = route.options).scripts) == null ? void 0 : _d2.call(_c2, assetContext),
-                        (_f = (_e = route.options).headers) == null ? void 0 : _f.call(_e, assetContext)
-                      ]).then(([headFnContent, scripts, headers]) => {
-                        const meta = headFnContent == null ? void 0 : headFnContent.meta;
-                        const links = headFnContent == null ? void 0 : headFnContent.links;
-                        const headScripts = headFnContent == null ? void 0 : headFnContent.scripts;
-                        const styles = headFnContent == null ? void 0 : headFnContent.styles;
-                        return {
-                          meta,
-                          links,
-                          headScripts,
-                          headers,
-                          scripts,
-                          styles
-                        };
-                      });
-                    };
-                    const potentialPendingMinPromise = async () => {
-                      const latestMatch = this.getMatch(matchId);
-                      if (latestMatch._nonReactive.minPendingPromise) {
-                        await latestMatch._nonReactive.minPendingPromise;
-                      }
-                    };
-                    const prevMatch = this.getMatch(matchId);
-                    if (shouldSkipLoader(matchId)) {
-                      if (this.isServer) {
-                        const headResult = executeHead();
-                        if (headResult) {
-                          const head = await headResult;
-                          updateMatch(matchId, (prev) => ({
-                            ...prev,
-                            ...head
-                          }));
-                        }
-                        return this.getMatch(matchId);
-                      }
-                    } else if (prevMatch._nonReactive.loaderPromise) {
-                      if (prevMatch.status === "success" && !sync && !prevMatch.preload) {
-                        return this.getMatch(matchId);
-                      }
-                      await prevMatch._nonReactive.loaderPromise;
-                      const match = this.getMatch(matchId);
-                      if (match.error) {
-                        handleRedirectAndNotFound(match, match.error);
-                      }
-                    } else {
-                      const parentMatchPromise = matchPromises[index - 1];
-                      const getLoaderContext = () => {
-                        const {
-                          params,
-                          loaderDeps,
-                          abortController,
-                          context,
-                          cause
-                        } = this.getMatch(matchId);
-                        const preload2 = resolvePreload(matchId);
-                        return {
-                          params,
-                          deps: loaderDeps,
-                          preload: !!preload2,
-                          parentMatchPromise,
-                          abortController,
-                          context,
-                          location,
-                          navigate: (opts) => this.navigate({ ...opts, _fromLocation: location }),
-                          cause: preload2 ? "preload" : cause,
-                          route
-                        };
-                      };
-                      const age = Date.now() - this.getMatch(matchId).updatedAt;
-                      const preload = resolvePreload(matchId);
-                      const staleAge = preload ? route.options.preloadStaleTime ?? this.options.defaultPreloadStaleTime ?? 3e4 : route.options.staleTime ?? this.options.defaultStaleTime ?? 0;
-                      const shouldReloadOption = route.options.shouldReload;
-                      const shouldReload = typeof shouldReloadOption === "function" ? shouldReloadOption(getLoaderContext()) : shouldReloadOption;
-                      updateMatch(matchId, (prev) => {
-                        prev._nonReactive.loaderPromise = createControlledPromise();
-                        return {
-                          ...prev,
-                          preload: !!preload && !this.state.matches.some((d) => d.id === matchId)
-                        };
-                      });
-                      const runLoader = async () => {
-                        var _a3, _b3, _c2, _d2;
-                        try {
-                          try {
-                            if (!this.isServer || this.isServer && this.getMatch(matchId).ssr === true) {
-                              this.loadRouteChunk(route);
-                            }
-                            updateMatch(matchId, (prev) => ({
-                              ...prev,
-                              isFetching: "loader"
-                            }));
-                            const loaderData = await ((_b3 = (_a3 = route.options).loader) == null ? void 0 : _b3.call(_a3, getLoaderContext()));
-                            handleRedirectAndNotFound(
-                              this.getMatch(matchId),
-                              loaderData
-                            );
-                            updateMatch(matchId, (prev) => ({
-                              ...prev,
-                              loaderData
-                            }));
-                            await route._lazyPromise;
-                            const headResult = executeHead();
-                            const head = headResult ? await headResult : void 0;
-                            await potentialPendingMinPromise();
-                            await route._componentsPromise;
-                            updateMatch(matchId, (prev) => ({
-                              ...prev,
-                              error: void 0,
-                              status: "success",
-                              isFetching: false,
-                              updatedAt: Date.now(),
-                              ...head
-                            }));
-                          } catch (e) {
-                            let error = e;
-                            await potentialPendingMinPromise();
-                            handleRedirectAndNotFound(this.getMatch(matchId), e);
-                            try {
-                              (_d2 = (_c2 = route.options).onError) == null ? void 0 : _d2.call(_c2, e);
-                            } catch (onErrorError) {
-                              error = onErrorError;
-                              handleRedirectAndNotFound(
-                                this.getMatch(matchId),
-                                onErrorError
-                              );
-                            }
-                            const headResult = executeHead();
-                            const head = headResult ? await headResult : void 0;
-                            updateMatch(matchId, (prev) => ({
-                              ...prev,
-                              error,
-                              status: "error",
-                              isFetching: false,
-                              ...head
-                            }));
-                          }
-                        } catch (err) {
-                          const match = this.getMatch(matchId);
-                          if (match) {
-                            const headResult = executeHead();
-                            if (headResult) {
-                              const head = await headResult;
-                              updateMatch(matchId, (prev) => ({
-                                ...prev,
-                                ...head
-                              }));
-                            }
-                            match._nonReactive.loaderPromise = void 0;
-                          }
-                          handleRedirectAndNotFound(match, err);
-                        }
-                      };
-                      const { status, invalid } = this.getMatch(matchId);
-                      loaderShouldRunAsync = status === "success" && (invalid || (shouldReload ?? age > staleAge));
-                      if (preload && route.options.preload === false) {
-                      } else if (loaderShouldRunAsync && !sync) {
-                        loaderIsRunningAsync = true;
-                        (async () => {
-                          var _a3, _b3;
-                          try {
-                            await runLoader();
-                            const match = this.getMatch(matchId);
-                            (_a3 = match._nonReactive.loaderPromise) == null ? void 0 : _a3.resolve();
-                            (_b3 = match._nonReactive.loadPromise) == null ? void 0 : _b3.resolve();
-                            match._nonReactive.loaderPromise = void 0;
-                          } catch (err) {
-                            if (isRedirect(err)) {
-                              await this.navigate(err.options);
-                            }
-                          }
-                        })();
-                      } else if (status !== "success" || loaderShouldRunAsync && sync) {
-                        await runLoader();
-                      } else {
-                        const headResult = executeHead();
-                        if (headResult) {
-                          const head = await headResult;
-                          updateMatch(matchId, (prev) => ({
-                            ...prev,
-                            ...head
-                          }));
-                        }
-                      }
-                    }
-                    if (!loaderIsRunningAsync) {
-                      const match = this.getMatch(matchId);
-                      (_a2 = match._nonReactive.loaderPromise) == null ? void 0 : _a2.resolve();
-                      (_b2 = match._nonReactive.loadPromise) == null ? void 0 : _b2.resolve();
-                    }
-                    updateMatch(matchId, (prev) => {
-                      clearTimeout(prev._nonReactive.pendingTimeout);
-                      prev._nonReactive.pendingTimeout = void 0;
-                      if (!loaderIsRunningAsync)
-                        prev._nonReactive.loaderPromise = void 0;
-                      prev._nonReactive.dehydrated = void 0;
-                      return {
-                        ...prev,
-                        isFetching: loaderIsRunningAsync ? prev.isFetching : false,
-                        invalid: false
-                      };
-                    });
-                    return this.getMatch(matchId);
-                  })()
+              const max = innerLoadContext.firstBadMatchIndex ?? innerLoadContext.matches.length;
+              for (let i = 0; i < max; i++) {
+                innerLoadContext.matchPromises.push(
+                  this.loadRouteMatch(innerLoadContext, i)
                 );
-              });
-              await Promise.all(matchPromises);
+              }
+              await Promise.all(innerLoadContext.matchPromises);
               resolveAll();
             } catch (err) {
               rejectAll(err);
             }
           })();
         });
-        await triggerOnReady();
+        const readyPromise = this.triggerOnReady(innerLoadContext);
+        if (isPromise(readyPromise)) await readyPromise;
       } catch (err) {
-        if (isRedirect(err) || isNotFound(err)) {
-          if (isNotFound(err) && !allPreload) {
-            await triggerOnReady();
-          }
+        if (isNotFound(err) && !innerLoadContext.preload) {
+          const readyPromise = this.triggerOnReady(innerLoadContext);
+          if (isPromise(readyPromise)) await readyPromise;
+          throw err;
+        }
+        if (isRedirect(err)) {
           throw err;
         }
       }
-      return matches;
+      return innerLoadContext.matches;
     };
     this.invalidate = (opts) => {
       const invalidate = (d) => {
@@ -1285,27 +1365,36 @@ class RouterCore {
       this.clearCache({ filter });
     };
     this.loadRouteChunk = (route) => {
-      if (route._lazyPromise === void 0) {
+      if (!route._lazyLoaded && route._lazyPromise === void 0) {
         if (route.lazyFn) {
           route._lazyPromise = route.lazyFn().then((lazyRoute) => {
             const { id: _id, ...options2 } = lazyRoute.options;
             Object.assign(route.options, options2);
+            route._lazyLoaded = true;
+            route._lazyPromise = void 0;
           });
         } else {
-          route._lazyPromise = Promise.resolve();
+          route._lazyLoaded = true;
         }
       }
-      if (route._componentsPromise === void 0) {
-        route._componentsPromise = route._lazyPromise.then(
-          () => Promise.all(
-            componentTypes.map(async (type) => {
-              const component = route.options[type];
-              if (component == null ? void 0 : component.preload) {
-                await component.preload();
-              }
-            })
-          )
-        );
+      if (!route._componentsLoaded && route._componentsPromise === void 0) {
+        const loadComponents = () => {
+          var _a;
+          const preloads = [];
+          for (const type of componentTypes) {
+            const preload = (_a = route.options[type]) == null ? void 0 : _a.preload;
+            if (preload) preloads.push(preload());
+          }
+          if (preloads.length)
+            return Promise.all(preloads).then(() => {
+              route._componentsLoaded = true;
+              route._componentsPromise = void 0;
+            });
+          route._componentsLoaded = true;
+          route._componentsPromise = void 0;
+          return;
+        };
+        route._componentsPromise = route._lazyPromise ? route._lazyPromise.then(loadComponents) : loadComponents();
       }
       return route._componentsPromise;
     };
@@ -1403,11 +1492,11 @@ class RouterCore {
       }
       return match;
     };
-    this._handleNotFound = (matches, err, updateMatch = this.updateMatch) => {
+    this._handleNotFound = (innerLoadContext, err) => {
       var _a;
       const routeCursor = this.routesById[err.routeId ?? ""] ?? this.routeTree;
       const matchesByRouteId = {};
-      for (const match of matches) {
+      for (const match of innerLoadContext.matches) {
         matchesByRouteId[match.routeId] = match;
       }
       if (!routeCursor.options.notFoundComponent && ((_a = this.options) == null ? void 0 : _a.defaultNotFoundComponent)) {
@@ -1422,7 +1511,7 @@ class RouterCore {
         matchForRoute,
         "Could not find match for route: " + routeCursor.id
       );
-      updateMatch(matchForRoute.id, (prev) => ({
+      innerLoadContext.updateMatch(matchForRoute.id, (prev) => ({
         ...prev,
         status: "notFound",
         error: err,
@@ -1430,7 +1519,7 @@ class RouterCore {
       }));
       if (err.routerCode === "BEFORE_LOAD" && routeCursor.parentRoute) {
         err.routeId = routeCursor.parentRoute.id;
-        this._handleNotFound(matches, err, updateMatch);
+        this._handleNotFound(innerLoadContext, err);
       }
     };
     this.hasNotFoundMatch = () => {
@@ -1669,6 +1758,12 @@ class SearchParamError extends Error {
 }
 class PathParamError extends Error {
 }
+function makeMaybe(value, error) {
+  if (error) {
+    return { status: "error", error };
+  }
+  return { status: "success", value };
+}
 const normalize = (str) => str.endsWith("/") && str.length > 1 ? str.slice(0, -1) : str;
 function comparePaths(a, b) {
   return normalize(a) === normalize(b);