@remix-run/router 1.19.2 → 1.20.0-pre.1

package/dist/router.umd.js

@@ -1,5 +1,5 @@
 /**
- * @remix-run/router v1.19.2
+ * @remix-run/router v1.20.0-pre.1
  *
  * Copyright (c) Remix Software Inc.
  *
@@ -1713,8 +1713,8 @@
     let dataRoutes = convertRoutesToDataRoutes(init.routes, mapRouteProperties, undefined, manifest);
     let inFlightDataRoutes;
     let basename = init.basename || "/";
-    let dataStrategyImpl = init.unstable_dataStrategy || defaultDataStrategy;
-    let patchRoutesOnNavigationImpl = init.unstable_patchRoutesOnNavigation;
+    let dataStrategyImpl = init.dataStrategy || defaultDataStrategy;
+    let patchRoutesOnNavigationImpl = init.patchRoutesOnNavigation;
 
     // Config driven behavior flags
     let future = _extends({
@@ -1729,10 +1729,6 @@
     let unlistenHistory = null;
     // Externally-provided functions to call on all state changes
     let subscribers = new Set();
-    // FIFO queue of previously discovered routes to prevent re-calling on
-    // subsequent navigations to the same path
-    let discoveredRoutesMaxSize = 1000;
-    let discoveredRoutes = new Set();
     // Externally-provided object to hold scroll restoration locations during routing
     let savedScrollPositions = null;
     // Externally-provided function to get scroll restoration keys
@@ -1803,25 +1799,12 @@
       // were marked for explicit hydration
       let loaderData = init.hydrationData ? init.hydrationData.loaderData : null;
       let errors = init.hydrationData ? init.hydrationData.errors : null;
-      let isRouteInitialized = m => {
-        // No loader, nothing to initialize
-        if (!m.route.loader) {
-          return true;
-        }
-        // Explicitly opting-in to running on hydration
-        if (typeof m.route.loader === "function" && m.route.loader.hydrate === true) {
-          return false;
-        }
-        // Otherwise, initialized if hydrated with data or an error
-        return loaderData && loaderData[m.route.id] !== undefined || errors && errors[m.route.id] !== undefined;
-      };
-
       // If errors exist, don't consider routes below the boundary
       if (errors) {
         let idx = initialMatches.findIndex(m => errors[m.route.id] !== undefined);
-        initialized = initialMatches.slice(0, idx + 1).every(isRouteInitialized);
+        initialized = initialMatches.slice(0, idx + 1).every(m => !shouldLoadRouteOnHydration(m.route, loaderData, errors));
       } else {
-        initialized = initialMatches.every(isRouteInitialized);
+        initialized = initialMatches.every(m => !shouldLoadRouteOnHydration(m.route, loaderData, errors));
       }
     } else {
       // Without partial hydration - we're initialized if we were provided any
@@ -1921,10 +1904,6 @@
     // we don't need to update UI state if they change
     let blockerFunctions = new Map();
 
-    // Map of pending patchRoutesOnNavigation() promises (keyed by path/matches) so
-    // that we only kick them off once for a given combo
-    let pendingPatchRoutes = new Map();
-
     // Flag to ignore the next history update, so we can revert the URL change on
     // a POP navigation that was blocked by the user without touching router state
     let unblockBlockerHistoryUpdate = undefined;
@@ -2062,8 +2041,8 @@
       // we don't get ourselves into a loop calling the new subscriber immediately
       [...subscribers].forEach(subscriber => subscriber(state, {
         deletedFetchers: deletedFetchersKeys,
-        unstable_viewTransitionOpts: opts.viewTransitionOpts,
-        unstable_flushSync: opts.flushSync === true
+        viewTransitionOpts: opts.viewTransitionOpts,
+        flushSync: opts.flushSync === true
       }));
 
       // Remove idle fetchers from state since we only care about in-flight fetchers.
@@ -2223,7 +2202,7 @@
         historyAction = Action.Replace;
       }
       let preventScrollReset = opts && "preventScrollReset" in opts ? opts.preventScrollReset === true : undefined;
-      let flushSync = (opts && opts.unstable_flushSync) === true;
+      let flushSync = (opts && opts.flushSync) === true;
       let blockerKey = shouldBlockNavigation({
         currentLocation,
         nextLocation,
@@ -2261,7 +2240,7 @@
         pendingError: error,
         preventScrollReset,
         replace: opts && opts.replace,
-        enableViewTransition: opts && opts.unstable_viewTransition,
+        enableViewTransition: opts && opts.viewTransition,
         flushSync
       });
     }
@@ -2349,7 +2328,7 @@
       // Short circuit if it's only a hash change and not a revalidation or
       // mutation submission.
       //
-      // Ignore on initial page loads because since the initial load will always
+      // Ignore on initial page loads because since the initial hydration will always
       // be "same hash".  For example, on /page#hash and submit a <Form method="post">
       // which will default to a navigation to /page
       if (state.initialized && !isRevalidationRequired && isHashChangeOnly(state.location, location) && !(opts && opts.submission && isMutationMethod(opts.submission.formMethod))) {
@@ -2456,15 +2435,12 @@
             shortCircuited: true
           };
         } else if (discoverResult.type === "error") {
-          let {
-            boundaryId,
-            error
-          } = handleDiscoverRouteError(location.pathname, discoverResult);
+          let boundaryId = findNearestBoundary(discoverResult.partialMatches).route.id;
           return {
             matches: discoverResult.partialMatches,
             pendingActionResult: [boundaryId, {
               type: ResultType.error,
-              error
+              error: discoverResult.error
             }]
           };
         } else if (!discoverResult.matches) {
@@ -2594,15 +2570,12 @@
             shortCircuited: true
           };
         } else if (discoverResult.type === "error") {
-          let {
-            boundaryId,
-            error
-          } = handleDiscoverRouteError(location.pathname, discoverResult);
+          let boundaryId = findNearestBoundary(discoverResult.partialMatches).route.id;
           return {
             matches: discoverResult.partialMatches,
             loaderData: {},
             errors: {
-              [boundaryId]: error
+              [boundaryId]: discoverResult.error
             }
           };
         } else if (!discoverResult.matches) {
@@ -2668,9 +2641,7 @@
         });
       }
       revalidatingFetchers.forEach(rf => {
-        if (fetchControllers.has(rf.key)) {
-          abortFetcher(rf.key);
-        }
+        abortFetcher(rf.key);
         if (rf.controller) {
           // Fetchers use an independent AbortController so that aborting a fetcher
           // (via deleteFetcher) does not abort the triggering navigation that
@@ -2730,7 +2701,7 @@
       let {
         loaderData,
         errors
-      } = processLoaderData(state, matches, matchesToLoad, loaderResults, pendingActionResult, revalidatingFetchers, fetcherResults, activeDeferreds);
+      } = processLoaderData(state, matches, loaderResults, pendingActionResult, revalidatingFetchers, fetcherResults, activeDeferreds);
 
       // Wire up subscribers to update loaderData as promises settle
       activeDeferreds.forEach((deferredData, routeId) => {
@@ -2744,17 +2715,9 @@
         });
       });
 
-      // During partial hydration, preserve SSR errors for routes that don't re-run
+      // Preserve SSR errors during partial hydration
       if (future.v7_partialHydration && initialHydration && state.errors) {
-        Object.entries(state.errors).filter(_ref2 => {
-          let [id] = _ref2;
-          return !matchesToLoad.some(m => m.route.id === id);
-        }).forEach(_ref3 => {
-          let [routeId, error] = _ref3;
-          errors = Object.assign(errors || {}, {
-            [routeId]: error
-          });
-        });
+        errors = _extends({}, state.errors, errors);
       }
       let updatedFetchers = markFetchRedirectsDone();
       let didAbortFetchLoads = abortStaleFetchLoads(pendingNavigationLoadId);
@@ -2797,8 +2760,8 @@
       if (isServer) {
         throw new Error("router.fetch() was called during the server render, but it shouldn't be. " + "You are likely calling a useFetcher() method in the body of your component. " + "Try moving it to a useEffect or a callback.");
       }
-      if (fetchControllers.has(key)) abortFetcher(key);
-      let flushSync = (opts && opts.unstable_flushSync) === true;
+      abortFetcher(key);
+      let flushSync = (opts && opts.flushSync) === true;
       let routesToUse = inFlightDataRoutes || dataRoutes;
       let normalizedPath = normalizeTo(state.location, state.matches, basename, future.v7_prependBasename, href, future.v7_relativeSplatPath, routeId, opts == null ? void 0 : opts.relative);
       let matches = matchRoutes(routesToUse, normalizedPath, basename);
@@ -2826,9 +2789,9 @@
         return;
       }
       let match = getTargetMatch(matches, path);
-      pendingPreventScrollReset = (opts && opts.preventScrollReset) === true;
+      let preventScrollReset = (opts && opts.preventScrollReset) === true;
       if (submission && isMutationMethod(submission.formMethod)) {
-        handleFetcherAction(key, routeId, path, match, matches, fogOfWar.active, flushSync, submission);
+        handleFetcherAction(key, routeId, path, match, matches, fogOfWar.active, flushSync, preventScrollReset, submission);
         return;
       }
 
@@ -2838,12 +2801,12 @@
         routeId,
         path
       });
-      handleFetcherLoader(key, routeId, path, match, matches, fogOfWar.active, flushSync, submission);
+      handleFetcherLoader(key, routeId, path, match, matches, fogOfWar.active, flushSync, preventScrollReset, submission);
     }
 
     // Call the action for the matched fetcher.submit(), and then handle redirects,
     // errors, and revalidation
-    async function handleFetcherAction(key, routeId, path, match, requestMatches, isFogOfWar, flushSync, submission) {
+    async function handleFetcherAction(key, routeId, path, match, requestMatches, isFogOfWar, flushSync, preventScrollReset, submission) {
       interruptActiveLoads();
       fetchLoadMatches.delete(key);
       function detectAndHandle405Error(m) {
@@ -2876,10 +2839,7 @@
         if (discoverResult.type === "aborted") {
           return;
         } else if (discoverResult.type === "error") {
-          let {
-            error
-          } = handleDiscoverRouteError(path, discoverResult);
-          setFetcherError(key, routeId, error, {
+          setFetcherError(key, routeId, discoverResult.error, {
             flushSync
           });
           return;
@@ -2936,7 +2896,8 @@
             fetchRedirectIds.add(key);
             updateFetcherState(key, getLoadingFetcher(submission));
             return startRedirectNavigation(fetchRequest, actionResult, false, {
-              fetcherSubmission: submission
+              fetcherSubmission: submission,
+              preventScrollReset
             });
           }
         }
@@ -2974,9 +2935,7 @@
         let existingFetcher = state.fetchers.get(staleKey);
         let revalidatingFetcher = getLoadingFetcher(undefined, existingFetcher ? existingFetcher.data : undefined);
         state.fetchers.set(staleKey, revalidatingFetcher);
-        if (fetchControllers.has(staleKey)) {
-          abortFetcher(staleKey);
-        }
+        abortFetcher(staleKey);
         if (rf.controller) {
           fetchControllers.set(staleKey, rf.controller);
         }
@@ -2999,7 +2958,9 @@
       revalidatingFetchers.forEach(r => fetchControllers.delete(r.key));
       let redirect = findRedirect(loaderResults);
       if (redirect) {
-        return startRedirectNavigation(revalidationRequest, redirect.result, false);
+        return startRedirectNavigation(revalidationRequest, redirect.result, false, {
+          preventScrollReset
+        });
       }
       redirect = findRedirect(fetcherResults);
       if (redirect) {
@@ -3007,14 +2968,16 @@
         // fetchRedirectIds so it doesn't get revalidated on the next set of
         // loader executions
         fetchRedirectIds.add(redirect.key);
-        return startRedirectNavigation(revalidationRequest, redirect.result, false);
+        return startRedirectNavigation(revalidationRequest, redirect.result, false, {
+          preventScrollReset
+        });
       }
 
       // Process and commit output from loaders
       let {
         loaderData,
         errors
-      } = processLoaderData(state, matches, matchesToLoad, loaderResults, undefined, revalidatingFetchers, fetcherResults, activeDeferreds);
+      } = processLoaderData(state, matches, loaderResults, undefined, revalidatingFetchers, fetcherResults, activeDeferreds);
 
       // Since we let revalidations complete even if the submitting fetcher was
       // deleted, only put it back to idle if it hasn't been deleted
@@ -3050,7 +3013,7 @@
     }
 
     // Call the matched loader for fetcher.load(), handling redirects, errors, etc.
-    async function handleFetcherLoader(key, routeId, path, match, matches, isFogOfWar, flushSync, submission) {
+    async function handleFetcherLoader(key, routeId, path, match, matches, isFogOfWar, flushSync, preventScrollReset, submission) {
       let existingFetcher = state.fetchers.get(key);
       updateFetcherState(key, getLoadingFetcher(submission, existingFetcher ? existingFetcher.data : undefined), {
         flushSync
@@ -3062,10 +3025,7 @@
         if (discoverResult.type === "aborted") {
           return;
         } else if (discoverResult.type === "error") {
-          let {
-            error
-          } = handleDiscoverRouteError(path, discoverResult);
-          setFetcherError(key, routeId, error, {
+          setFetcherError(key, routeId, discoverResult.error, {
             flushSync
           });
           return;
@@ -3121,7 +3081,9 @@
           return;
         } else {
           fetchRedirectIds.add(key);
-          await startRedirectNavigation(fetchRequest, result, false);
+          await startRedirectNavigation(fetchRequest, result, false, {
+            preventScrollReset
+          });
           return;
         }
       }
@@ -3160,6 +3122,7 @@
       let {
         submission,
         fetcherSubmission,
+        preventScrollReset,
         replace
       } = _temp2 === void 0 ? {} : _temp2;
       if (redirect.response.headers.has("X-Remix-Revalidate")) {
@@ -3220,7 +3183,7 @@
             formAction: location
           }),
           // Preserve these flags across redirects
-          preventScrollReset: pendingPreventScrollReset,
+          preventScrollReset: preventScrollReset || pendingPreventScrollReset,
           enableViewTransition: isNavigation ? pendingViewTransitionEnabled : undefined
         });
       } else {
@@ -3232,7 +3195,7 @@
           // Send fetcher submissions through for shouldRevalidate
           fetcherSubmission,
           // Preserve these flags across redirects
-          preventScrollReset: pendingPreventScrollReset,
+          preventScrollReset: preventScrollReset || pendingPreventScrollReset,
           enableViewTransition: isNavigation ? pendingViewTransitionEnabled : undefined
         });
       }
@@ -3313,8 +3276,8 @@
       fetchLoadMatches.forEach((_, key) => {
         if (fetchControllers.has(key)) {
           cancelledFetcherLoads.add(key);
-          abortFetcher(key);
         }
+        abortFetcher(key);
       });
     }
     function updateFetcherState(key, fetcher, opts) {
@@ -3387,9 +3350,10 @@
     }
     function abortFetcher(key) {
       let controller = fetchControllers.get(key);
-      invariant(controller, "Expected fetch controller: " + key);
-      controller.abort();
-      fetchControllers.delete(key);
+      if (controller) {
+        controller.abort();
+        fetchControllers.delete(key);
+      }
     }
     function markFetchersDone(keys) {
       for (let key of keys) {
@@ -3454,12 +3418,12 @@
         blockers
       });
     }
-    function shouldBlockNavigation(_ref4) {
+    function shouldBlockNavigation(_ref2) {
       let {
         currentLocation,
         nextLocation,
         historyAction
-      } = _ref4;
+      } = _ref2;
       if (blockerFunctions.size === 0) {
         return;
       }
@@ -3506,16 +3470,6 @@
         error
       };
     }
-    function handleDiscoverRouteError(pathname, discoverResult) {
-      return {
-        boundaryId: findNearestBoundary(discoverResult.partialMatches).route.id,
-        error: getInternalRouterError(400, {
-          type: "route-discovery",
-          pathname,
-          message: discoverResult.error != null && "message" in discoverResult.error ? discoverResult.error : String(discoverResult.error)
-        })
-      };
-    }
     function cancelActiveDeferreds(predicate) {
       let cancelledRouteIds = [];
       activeDeferreds.forEach((dfd, routeId) => {
@@ -3581,15 +3535,6 @@
     }
     function checkFogOfWar(matches, routesToUse, pathname) {
       if (patchRoutesOnNavigationImpl) {
-        // Don't bother re-calling patchRouteOnMiss for a path we've already
-        // processed.  the last execution would have patched the route tree
-        // accordingly so `matches` here are already accurate.
-        if (discoveredRoutes.has(pathname)) {
-          return {
-            active: false,
-            matches
-          };
-        }
         if (!matches) {
           let fogMatches = matchRoutesImpl(routesToUse, pathname, basename, true);
           return {
@@ -3615,12 +3560,26 @@
       };
     }
     async function discoverRoutes(matches, pathname, signal) {
+      if (!patchRoutesOnNavigationImpl) {
+        return {
+          type: "success",
+          matches
+        };
+      }
       let partialMatches = matches;
       while (true) {
         let isNonHMR = inFlightDataRoutes == null;
         let routesToUse = inFlightDataRoutes || dataRoutes;
+        let localManifest = manifest;
         try {
-          await loadLazyRouteChildren(patchRoutesOnNavigationImpl, pathname, partialMatches, routesToUse, manifest, mapRouteProperties, pendingPatchRoutes, signal);
+          await patchRoutesOnNavigationImpl({
+            path: pathname,
+            matches: partialMatches,
+            patch: (routeId, children) => {
+              if (signal.aborted) return;
+              patchRoutesImpl(routeId, children, routesToUse, localManifest, mapRouteProperties);
+            }
+          });
         } catch (e) {
           return {
             type: "error",
@@ -3634,7 +3593,7 @@
           // trigger a re-run of memoized `router.routes` dependencies.
           // HMR will already update the identity and reflow when it lands
           // `inFlightDataRoutes` in `completeNavigation`
-          if (isNonHMR) {
+          if (isNonHMR && !signal.aborted) {
             dataRoutes = [...dataRoutes];
           }
         }
@@ -3645,7 +3604,6 @@
         }
         let newMatches = matchRoutes(routesToUse, pathname, basename);
         if (newMatches) {
-          addToFifoQueue(pathname, discoveredRoutes);
           return {
             type: "success",
             matches: newMatches
@@ -3655,7 +3613,6 @@
 
         // Avoid loops if the second pass results in the same partial matches
         if (!newPartialMatches || partialMatches.length === newPartialMatches.length && partialMatches.every((m, i) => m.route.id === newPartialMatches[i].route.id)) {
-          addToFifoQueue(pathname, discoveredRoutes);
           return {
             type: "success",
             matches: null
@@ -3664,13 +3621,6 @@
         partialMatches = newPartialMatches;
       }
     }
-    function addToFifoQueue(path, queue) {
-      if (queue.size >= discoveredRoutesMaxSize) {
-        let first = queue.values().next().value;
-        queue.delete(first);
-      }
-      queue.add(path);
-    }
     function _internalSetRoutes(newRoutes) {
       manifest = {};
       inFlightDataRoutes = convertRoutesToDataRoutes(newRoutes, mapRouteProperties, undefined, manifest);
@@ -3795,7 +3745,7 @@
       let {
         requestContext,
         skipLoaderErrorBubbling,
-        unstable_dataStrategy
+        dataStrategy
       } = _temp3 === void 0 ? {} : _temp3;
       let url = new URL(request.url);
       let method = request.method;
@@ -3848,7 +3798,7 @@
           activeDeferreds: null
         };
       }
-      let result = await queryImpl(request, location, matches, requestContext, unstable_dataStrategy || null, skipLoaderErrorBubbling === true, null);
+      let result = await queryImpl(request, location, matches, requestContext, dataStrategy || null, skipLoaderErrorBubbling === true, null);
       if (isResponse(result)) {
         return result;
       }
@@ -3892,7 +3842,7 @@
       let {
         routeId,
         requestContext,
-        unstable_dataStrategy
+        dataStrategy
       } = _temp4 === void 0 ? {} : _temp4;
       let url = new URL(request.url);
       let method = request.method;
@@ -3921,7 +3871,7 @@
           pathname: location.pathname
         });
       }
-      let result = await queryImpl(request, location, matches, requestContext, unstable_dataStrategy || null, false, match);
+      let result = await queryImpl(request, location, matches, requestContext, dataStrategy || null, false, match);
       if (isResponse(result)) {
         return result;
       }
@@ -3948,14 +3898,14 @@
       }
       return undefined;
     }
-    async function queryImpl(request, location, matches, requestContext, unstable_dataStrategy, skipLoaderErrorBubbling, routeMatch) {
+    async function queryImpl(request, location, matches, requestContext, dataStrategy, skipLoaderErrorBubbling, routeMatch) {
       invariant(request.signal, "query()/queryRoute() requests must contain an AbortController signal");
       try {
         if (isMutationMethod(request.method.toLowerCase())) {
-          let result = await submit(request, matches, routeMatch || getTargetMatch(matches, location), requestContext, unstable_dataStrategy, skipLoaderErrorBubbling, routeMatch != null);
+          let result = await submit(request, matches, routeMatch || getTargetMatch(matches, location), requestContext, dataStrategy, skipLoaderErrorBubbling, routeMatch != null);
           return result;
         }
-        let result = await loadRouteData(request, matches, requestContext, unstable_dataStrategy, skipLoaderErrorBubbling, routeMatch);
+        let result = await loadRouteData(request, matches, requestContext, dataStrategy, skipLoaderErrorBubbling, routeMatch);
         return isResponse(result) ? result : _extends({}, result, {
           actionData: null,
           actionHeaders: {}
@@ -3978,7 +3928,7 @@
         throw e;
       }
     }
-    async function submit(request, matches, actionMatch, requestContext, unstable_dataStrategy, skipLoaderErrorBubbling, isRouteRequest) {
+    async function submit(request, matches, actionMatch, requestContext, dataStrategy, skipLoaderErrorBubbling, isRouteRequest) {
       let result;
       if (!actionMatch.route.action && !actionMatch.route.lazy) {
         let error = getInternalRouterError(405, {
@@ -3994,7 +3944,7 @@
           error
         };
       } else {
-        let results = await callDataStrategy("action", request, [actionMatch], matches, isRouteRequest, requestContext, unstable_dataStrategy);
+        let results = await callDataStrategy("action", request, [actionMatch], matches, isRouteRequest, requestContext, dataStrategy);
         result = results[actionMatch.route.id];
         if (request.signal.aborted) {
           throwStaticHandlerAbortedError(request, isRouteRequest, future);
@@ -4056,7 +4006,7 @@
         // Store off the pending error - we use it to determine which loaders
         // to call and will commit it when we complete the navigation
         let boundaryMatch = skipLoaderErrorBubbling ? actionMatch : findNearestBoundary(matches, actionMatch.route.id);
-        let context = await loadRouteData(loaderRequest, matches, requestContext, unstable_dataStrategy, skipLoaderErrorBubbling, null, [boundaryMatch.route.id, result]);
+        let context = await loadRouteData(loaderRequest, matches, requestContext, dataStrategy, skipLoaderErrorBubbling, null, [boundaryMatch.route.id, result]);
 
         // action status codes take precedence over loader status codes
         return _extends({}, context, {
@@ -4067,7 +4017,7 @@
           } : {})
         });
       }
-      let context = await loadRouteData(loaderRequest, matches, requestContext, unstable_dataStrategy, skipLoaderErrorBubbling, null);
+      let context = await loadRouteData(loaderRequest, matches, requestContext, dataStrategy, skipLoaderErrorBubbling, null);
       return _extends({}, context, {
         actionData: {
           [actionMatch.route.id]: result.data
@@ -4080,7 +4030,7 @@
         } : {}
       });
     }
-    async function loadRouteData(request, matches, requestContext, unstable_dataStrategy, skipLoaderErrorBubbling, routeMatch, pendingActionResult) {
+    async function loadRouteData(request, matches, requestContext, dataStrategy, skipLoaderErrorBubbling, routeMatch, pendingActionResult) {
       let isRouteRequest = routeMatch != null;
 
       // Short circuit if we have no loaders to run (queryRoute())
@@ -4110,7 +4060,7 @@
           activeDeferreds: null
         };
       }
-      let results = await callDataStrategy("loader", request, matchesToLoad, matches, isRouteRequest, requestContext, unstable_dataStrategy);
+      let results = await callDataStrategy("loader", request, matchesToLoad, matches, isRouteRequest, requestContext, dataStrategy);
       if (request.signal.aborted) {
         throwStaticHandlerAbortedError(request, isRouteRequest, future);
       }
@@ -4134,8 +4084,8 @@
 
     // Utility wrapper for calling dataStrategy server-side without having to
     // pass around the manifest, mapRouteProperties, etc.
-    async function callDataStrategy(type, request, matchesToLoad, matches, isRouteRequest, requestContext, unstable_dataStrategy) {
-      let results = await callDataStrategyImpl(unstable_dataStrategy || defaultDataStrategy, type, null, request, matchesToLoad, matches, null, manifest, mapRouteProperties, requestContext);
+    async function callDataStrategy(type, request, matchesToLoad, matches, isRouteRequest, requestContext, dataStrategy) {
+      let results = await callDataStrategyImpl(dataStrategy || defaultDataStrategy, type, null, request, matchesToLoad, matches, null, manifest, mapRouteProperties, requestContext);
       let dataResults = {};
       await Promise.all(matches.map(async match => {
         if (!(match.route.id in results)) {
@@ -4222,9 +4172,21 @@
       path.hash = location.hash;
     }
 
-    // Add an ?index param for matched index routes if we don't already have one
-    if ((to == null || to === "" || to === ".") && activeRouteMatch && activeRouteMatch.route.index && !hasNakedIndexQuery(path.search)) {
-      path.search = path.search ? path.search.replace(/^\?/, "?index&") : "?index";
+    // Account for `?index` params when routing to the current location
+    if ((to == null || to === "" || to === ".") && activeRouteMatch) {
+      let nakedIndex = hasNakedIndexQuery(path.search);
+      if (activeRouteMatch.route.index && !nakedIndex) {
+        // Add one when we're targeting an index route
+        path.search = path.search ? path.search.replace(/^\?/, "?index&") : "?index";
+      } else if (!activeRouteMatch.route.index && nakedIndex) {
+        // Remove existing ones when we're not
+        let params = new URLSearchParams(path.search);
+        let indexValues = params.getAll("index");
+        params.delete("index");
+        indexValues.filter(v => v).forEach(v => params.append("index", v));
+        let qs = params.toString();
+        path.search = qs ? "?" + qs : "";
+      }
     }
 
     // If we're operating within a basename, prepend it to the pathname.  If
@@ -4273,8 +4235,8 @@
         }
         let text = typeof opts.body === "string" ? opts.body : opts.body instanceof FormData || opts.body instanceof URLSearchParams ?
         // https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#plain-text-form-data
-        Array.from(opts.body.entries()).reduce((acc, _ref5) => {
-          let [name, value] = _ref5;
+        Array.from(opts.body.entries()).reduce((acc, _ref3) => {
+          let [name, value] = _ref3;
           return "" + acc + name + "=" + value + "\n";
         }, "") : String(opts.body);
         return {
@@ -4364,26 +4326,37 @@
     };
   }
 
-  // Filter out all routes below any caught error as they aren't going to
+  // Filter out all routes at/below any caught error as they aren't going to
   // render so we don't need to load them
-  function getLoaderMatchesUntilBoundary(matches, boundaryId) {
-    let boundaryMatches = matches;
-    if (boundaryId) {
-      let index = matches.findIndex(m => m.route.id === boundaryId);
-      if (index >= 0) {
-        boundaryMatches = matches.slice(0, index);
-      }
+  function getLoaderMatchesUntilBoundary(matches, boundaryId, includeBoundary) {
+    if (includeBoundary === void 0) {
+      includeBoundary = false;
+    }
+    let index = matches.findIndex(m => m.route.id === boundaryId);
+    if (index >= 0) {
+      return matches.slice(0, includeBoundary ? index + 1 : index);
     }
-    return boundaryMatches;
+    return matches;
   }
-  function getMatchesToLoad(history, state, matches, submission, location, isInitialLoad, skipActionErrorRevalidation, isRevalidationRequired, cancelledDeferredRoutes, cancelledFetcherLoads, deletedFetchers, fetchLoadMatches, fetchRedirectIds, routesToUse, basename, pendingActionResult) {
+  function getMatchesToLoad(history, state, matches, submission, location, initialHydration, skipActionErrorRevalidation, isRevalidationRequired, cancelledDeferredRoutes, cancelledFetcherLoads, deletedFetchers, fetchLoadMatches, fetchRedirectIds, routesToUse, basename, pendingActionResult) {
     let actionResult = pendingActionResult ? isErrorResult(pendingActionResult[1]) ? pendingActionResult[1].error : pendingActionResult[1].data : undefined;
     let currentUrl = history.createURL(state.location);
     let nextUrl = history.createURL(location);
 
     // Pick navigation matches that are net-new or qualify for revalidation
-    let boundaryId = pendingActionResult && isErrorResult(pendingActionResult[1]) ? pendingActionResult[0] : undefined;
-    let boundaryMatches = boundaryId ? getLoaderMatchesUntilBoundary(matches, boundaryId) : matches;
+    let boundaryMatches = matches;
+    if (initialHydration && state.errors) {
+      // On initial hydration, only consider matches up to _and including_ the boundary.
+      // This is inclusive to handle cases where a server loader ran successfully,
+      // a child server loader bubbled up to this route, but this route has
+      // `clientLoader.hydrate` so we want to still run the `clientLoader` so that
+      // we have a complete version of `loaderData`
+      boundaryMatches = getLoaderMatchesUntilBoundary(matches, Object.keys(state.errors)[0], true);
+    } else if (pendingActionResult && isErrorResult(pendingActionResult[1])) {
+      // If an action threw an error, we call loaders up to, but not including the
+      // boundary
+      boundaryMatches = getLoaderMatchesUntilBoundary(matches, pendingActionResult[0]);
+    }
 
     // Don't revalidate loaders by default after action 4xx/5xx responses
     // when the flag is enabled.  They can still opt-into revalidation via
@@ -4401,13 +4374,8 @@
       if (route.loader == null) {
         return false;
       }
-      if (isInitialLoad) {
-        if (typeof route.loader !== "function" || route.loader.hydrate) {
-          return true;
-        }
-        return state.loaderData[route.id] === undefined && (
-        // Don't re-run if the loader ran and threw an error
-        !state.errors || state.errors[route.id] === undefined);
+      if (initialHydration) {
+        return shouldLoadRouteOnHydration(route, state.loaderData, state.errors);
       }
 
       // Always call the loader on new route instances and pending defer cancellations
@@ -4441,11 +4409,11 @@
     let revalidatingFetchers = [];
     fetchLoadMatches.forEach((f, key) => {
       // Don't revalidate:
-      //  - on initial load (shouldn't be any fetchers then anyway)
+      //  - on initial hydration (shouldn't be any fetchers then anyway)
       //  - if fetcher won't be present in the subsequent render
       //    - no longer matches the URL (v7_fetcherPersist=false)
       //    - was unmounted but persisted due to v7_fetcherPersist=true
-      if (isInitialLoad || !matches.some(m => m.route.id === f.routeId) || deletedFetchers.has(key)) {
+      if (initialHydration || !matches.some(m => m.route.id === f.routeId) || deletedFetchers.has(key)) {
         return;
       }
       let fetcherMatches = matchRoutes(routesToUse, f.path, basename);
@@ -4511,6 +4479,32 @@
     });
     return [navigationMatches, revalidatingFetchers];
   }
+  function shouldLoadRouteOnHydration(route, loaderData, errors) {
+    // We dunno if we have a loader - gotta find out!
+    if (route.lazy) {
+      return true;
+    }
+
+    // No loader, nothing to initialize
+    if (!route.loader) {
+      return false;
+    }
+    let hasData = loaderData != null && loaderData[route.id] !== undefined;
+    let hasError = errors != null && errors[route.id] !== undefined;
+
+    // Don't run if we error'd during SSR
+    if (!hasData && hasError) {
+      return false;
+    }
+
+    // Explicitly opting-in to running on hydration
+    if (typeof route.loader === "function" && route.loader.hydrate === true) {
+      return true;
+    }
+
+    // Otherwise, run if we're not yet initialized with anything
+    return !hasData && !hasError;
+  }
   function isNewLoader(currentLoaderData, currentMatch, match) {
     let isNew =
     // [a] -> [a, b]
@@ -4544,49 +4538,50 @@
     }
     return arg.defaultShouldRevalidate;
   }
-
-  /**
-   * Idempotent utility to execute patchRoutesOnNavigation() to lazily load route
-   * definitions and update the routes/routeManifest
-   */
-  async function loadLazyRouteChildren(patchRoutesOnNavigationImpl, path, matches, routes, manifest, mapRouteProperties, pendingRouteChildren, signal) {
-    let key = [path, ...matches.map(m => m.route.id)].join("-");
-    try {
-      let pending = pendingRouteChildren.get(key);
-      if (!pending) {
-        pending = patchRoutesOnNavigationImpl({
-          path,
-          matches,
-          patch: (routeId, children) => {
-            if (!signal.aborted) {
-              patchRoutesImpl(routeId, children, routes, manifest, mapRouteProperties);
-            }
-          }
-        });
-        pendingRouteChildren.set(key, pending);
-      }
-      if (pending && isPromise(pending)) {
-        await pending;
-      }
-    } finally {
-      pendingRouteChildren.delete(key);
-    }
-  }
   function patchRoutesImpl(routeId, children, routesToUse, manifest, mapRouteProperties) {
+    var _childrenToPatch;
+    let childrenToPatch;
     if (routeId) {
-      var _route$children;
       let route = manifest[routeId];
       invariant(route, "No route found to patch children into: routeId = " + routeId);
-      let dataChildren = convertRoutesToDataRoutes(children, mapRouteProperties, [routeId, "patch", String(((_route$children = route.children) == null ? void 0 : _route$children.length) || "0")], manifest);
-      if (route.children) {
-        route.children.push(...dataChildren);
-      } else {
-        route.children = dataChildren;
+      if (!route.children) {
+        route.children = [];
       }
+      childrenToPatch = route.children;
     } else {
-      let dataChildren = convertRoutesToDataRoutes(children, mapRouteProperties, ["patch", String(routesToUse.length || "0")], manifest);
-      routesToUse.push(...dataChildren);
+      childrenToPatch = routesToUse;
     }
+
+    // Don't patch in routes we already know about so that `patch` is idempotent
+    // to simplify user-land code. This is useful because we re-call the
+    // `patchRoutesOnNavigation` function for matched routes with params.
+    let uniqueChildren = children.filter(newRoute => !childrenToPatch.some(existingRoute => isSameRoute(newRoute, existingRoute)));
+    let newRoutes = convertRoutesToDataRoutes(uniqueChildren, mapRouteProperties, [routeId || "_", "patch", String(((_childrenToPatch = childrenToPatch) == null ? void 0 : _childrenToPatch.length) || "0")], manifest);
+    childrenToPatch.push(...newRoutes);
+  }
+  function isSameRoute(newRoute, existingRoute) {
+    // Most optimal check is by id
+    if ("id" in newRoute && "id" in existingRoute && newRoute.id === existingRoute.id) {
+      return true;
+    }
+
+    // Second is by pathing differences
+    if (!(newRoute.index === existingRoute.index && newRoute.path === existingRoute.path && newRoute.caseSensitive === existingRoute.caseSensitive)) {
+      return false;
+    }
+
+    // Pathless layout routes are trickier since we need to check children.
+    // If they have no children then they're the same as far as we can tell
+    if ((!newRoute.children || newRoute.children.length === 0) && (!existingRoute.children || existingRoute.children.length === 0)) {
+      return true;
+    }
+
+    // Otherwise, we look to see if every child in the new route is already
+    // represented in the existing route's children
+    return newRoute.children.every((aChild, i) => {
+      var _existingRoute$childr;
+      return (_existingRoute$childr = existingRoute.children) == null ? void 0 : _existingRoute$childr.some(bChild => isSameRoute(aChild, bChild));
+    });
   }
 
   /**
@@ -4643,10 +4638,10 @@
   }
 
   // Default implementation of `dataStrategy` which fetches all loaders in parallel
-  async function defaultDataStrategy(_ref6) {
+  async function defaultDataStrategy(_ref4) {
     let {
       matches
-    } = _ref6;
+    } = _ref4;
     let matchesToLoad = matches.filter(m => m.shouldLoad);
     let results = await Promise.all(matchesToLoad.map(m => m.resolve()));
     return results.reduce((acc, result, i) => Object.assign(acc, {
@@ -4860,7 +4855,7 @@
           };
         }
 
-        // Convert thrown unstable_data() to ErrorResponse instances
+        // Convert thrown data() to ErrorResponse instances
         result = new ErrorResponseImpl(((_result$init2 = result.init) == null ? void 0 : _result$init2.status) || 500, undefined, result.data);
       }
       return {
@@ -5060,7 +5055,7 @@
       loaderHeaders
     };
   }
-  function processLoaderData(state, matches, matchesToLoad, results, pendingActionResult, revalidatingFetchers, fetcherResults, activeDeferreds) {
+  function processLoaderData(state, matches, results, pendingActionResult, revalidatingFetchers, fetcherResults, activeDeferreds) {
     let {
       loaderData,
       errors
@@ -5175,9 +5170,7 @@
     let errorMessage = "Unknown @remix-run/router error";
     if (status === 400) {
       statusText = "Bad Request";
-      if (type === "route-discovery") {
-        errorMessage = "Unable to match URL \"" + pathname + "\" - the `unstable_patchRoutesOnNavigation()` " + ("function threw the following error:\n" + message);
-      } else if (method && pathname && routeId) {
+      if (method && pathname && routeId) {
         errorMessage = "You made a " + method + " request to \"" + pathname + "\" but " + ("did not provide a `loader` for route \"" + routeId + "\", ") + "so there is no way to handle the request.";
       } else if (type === "defer-action") {
         errorMessage = "defer() is not supported in actions";
@@ -5239,9 +5232,6 @@
     // /page#hash -> /page
     return false;
   }
-  function isPromise(val) {
-    return typeof val === "object" && val != null && "then" in val;
-  }
   function isDataStrategyResult(result) {
     return result != null && typeof result === "object" && "type" in result && "result" in result && (result.type === ResultType.data || result.type === ResultType.error);
   }
@@ -5559,6 +5549,7 @@
   exports.createPath = createPath;
   exports.createRouter = createRouter;
   exports.createStaticHandler = createStaticHandler;
+  exports.data = data;
   exports.defer = defer;
   exports.generatePath = generatePath;
   exports.getStaticContextFromError = getStaticContextFromError;
@@ -5578,7 +5569,6 @@
   exports.resolvePath = resolvePath;
   exports.resolveTo = resolveTo;
   exports.stripBasename = stripBasename;
-  exports.unstable_data = data;
 
   Object.defineProperty(exports, '__esModule', { value: true });