react-router 7.0.0-pre.0 → 7.0.0-pre.1

package/dist/index.mjs

@@ -1,5 +1,5 @@
 /**
- * React Router v7.0.0-pre.0
+ * React Router v7.0.0-pre.1
  *
  * Copyright (c) Remix Software Inc.
  *
@@ -1301,24 +1301,12 @@ function createRouter(init) {
     // 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));
     }
   }
   let router;
@@ -1385,9 +1373,6 @@ function createRouter(init) {
   // Store blocker functions in a separate Map outside of router state since
   // 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;
@@ -1801,7 +1786,7 @@ function createRouter(init) {
     // 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))) {
@@ -1901,15 +1886,12 @@ function createRouter(init) {
           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) {
@@ -2028,15 +2010,12 @@ function createRouter(init) {
           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) {
@@ -2153,17 +2132,9 @@ function createRouter(init) {
       loaderData,
       errors
     } = processLoaderData(state, matches, loaderResults, pendingActionResult, revalidatingFetchers, fetcherResults);
-    // With "partial hydration", preserve SSR errors for routes that don't re-run
+    // Preserve SSR errors during partial hydration
     if (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);
@@ -2278,10 +2249,7 @@ function createRouter(init) {
       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;
@@ -2452,10 +2420,7 @@ function createRouter(init) {
       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;
@@ -2813,12 +2778,12 @@ function createRouter(init) {
       blockers
     });
   }
-  function shouldBlockNavigation(_ref4) {
+  function shouldBlockNavigation(_ref2) {
     let {
       currentLocation,
       nextLocation,
       historyAction
-    } = _ref4;
+    } = _ref2;
     if (blockerFunctions.size === 0) {
       return;
     }
@@ -2860,16 +2825,6 @@ function createRouter(init) {
       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)
-      })
-    };
-  }
   // Opt in to capturing and reporting scroll positions during navigations,
   // used by the <ScrollRestoration> component
   function enableScrollRestoration(positions, getPosition, getKey) {
@@ -2944,12 +2899,26 @@ function createRouter(init) {
     };
   }
   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",
@@ -2963,7 +2932,7 @@ function createRouter(init) {
         // 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];
         }
       }
@@ -3531,8 +3500,8 @@ function normalizeNavigateOptions(isFetcher, path, opts) {
       }
       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 {
@@ -3620,25 +3589,36 @@ function normalizeNavigateOptions(isFetcher, path, opts) {
     submission
   };
 }
-// 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;
   }
-  return boundaryMatches;
+  let index = matches.findIndex(m => m.route.id === boundaryId);
+  if (index >= 0) {
+    return matches.slice(0, includeBoundary ? index + 1 : index);
+  }
+  return matches;
 }
-function getMatchesToLoad(history, state, matches, submission, location, isInitialLoad, isRevalidationRequired, cancelledFetcherLoads, fetchersQueuedForDeletion, fetchLoadMatches, fetchRedirectIds, routesToUse, basename, pendingActionResult) {
+function getMatchesToLoad(history, state, matches, submission, location, initialHydration, isRevalidationRequired, cancelledFetcherLoads, fetchersQueuedForDeletion, 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
   // `shouldRevalidate` via `actionResult`
@@ -3655,13 +3635,8 @@ function getMatchesToLoad(history, state, matches, submission, location, isIniti
     if (route.loader == null) {
       return false;
     }
-    if (isInitialLoad) {
-      if (typeof route.loader !== "function" || route.loader.hydrate) {
-        return true;
-      }
-      return !state.loaderData.hasOwnProperty(route.id) && (
-      // 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
     if (isNewLoader(state.loaderData, state.matches[index], match)) {
@@ -3692,10 +3667,11 @@ function getMatchesToLoad(history, state, matches, submission, location, isIniti
   let revalidatingFetchers = [];
   fetchLoadMatches.forEach((f, key) => {
     // Don't revalidate:
-    //  - on initial load (shouldn't be any fetchers then anyway)
-    //  - if fetcher no longer matches the URL
-    //  - if fetcher was unmounted
-    if (isInitialLoad || !matches.some(m => m.route.id === f.routeId) || fetchersQueuedForDeletion.has(key)) {
+    //  - 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 (initialHydration || !matches.some(m => m.route.id === f.routeId) || fetchersQueuedForDeletion.has(key)) {
       return;
     }
     let fetcherMatches = matchRoutes(routesToUse, f.path, basename);
@@ -3759,6 +3735,28 @@ function getMatchesToLoad(history, state, matches, submission, location, isIniti
   });
   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]
@@ -3790,33 +3788,6 @@ function shouldRevalidateLoader(loaderMatch, arg) {
   }
   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;
@@ -3907,10 +3878,10 @@ async function loadLazyRouteModule(route, mapRouteProperties, manifest) {
   }));
 }
 // 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, {
@@ -4340,11 +4311,11 @@ function processLoaderData(state, matches, results, pendingActionResult, revalid
 }
 function mergeLoaderData(loaderData, newLoaderData, matches, errors) {
   // Start with all new entries that are not being reset
-  let mergedLoaderData = Object.entries(newLoaderData).filter(_ref7 => {
-    let [, v] = _ref7;
+  let mergedLoaderData = Object.entries(newLoaderData).filter(_ref5 => {
+    let [, v] = _ref5;
     return v !== ResetLoaderDataSymbol;
-  }).reduce((merged, _ref8) => {
-    let [k, v] = _ref8;
+  }).reduce((merged, _ref6) => {
+    let [k, v] = _ref6;
     merged[k] = v;
     return merged;
   }, {});
@@ -4409,9 +4380,7 @@ function getInternalRouterError(status, _temp5) {
   let errorMessage = "Unknown @remix-run/router error";
   if (status === 400) {
     statusText = "Bad Request";
-    if (type === "route-discovery") {
-      errorMessage = "Unable to match URL \"" + pathname + "\" - the `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 === "invalid-body") {
       errorMessage = "Unable to encode submission body";
@@ -4469,9 +4438,6 @@ function isHashChangeOnly(a, b) {
   // /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);
 }
@@ -5404,7 +5370,7 @@ var DataRouterStateHook$1;
   DataRouterStateHook["UseRouteId"] = "useRouteId";
 })(DataRouterStateHook$1 || (DataRouterStateHook$1 = {}));
 function getDataRouterConsoleError$1(hookName) {
-  return hookName + " must be used within a data router.  See https://reactrouter.com/routers/picking-a-router.";
+  return hookName + " must be used within a data router.  See https://reactrouter.com/en/main/routers/picking-a-router.";
 }
 function useDataRouterContext$2(hookName) {
   let ctx = React.useContext(DataRouterContext);
@@ -7669,8 +7635,10 @@ function createClientRoutes(manifest, routeModulesCache, initialState, isSpaMode
         handle: routeModule.handle,
         shouldRevalidate: needsRevalidation ? wrapShouldRevalidateForHdr(route.id, routeModule.shouldRevalidate, needsRevalidation) : routeModule.shouldRevalidate
       }));
-      let initialData = initialState == null || (_initialState$loaderD = initialState.loaderData) == null ? void 0 : _initialState$loaderD[route.id];
-      let initialError = initialState == null || (_initialState$errors = initialState.errors) == null ? void 0 : _initialState$errors[route.id];
+      let hasInitialData = initialState && initialState.loaderData && route.id in initialState.loaderData;
+      let initialData = hasInitialData ? initialState == null || (_initialState$loaderD = initialState.loaderData) == null ? void 0 : _initialState$loaderD[route.id] : undefined;
+      let hasInitialError = initialState && initialState.errors && route.id in initialState.errors;
+      let initialError = hasInitialError ? initialState == null || (_initialState$errors = initialState.errors) == null ? void 0 : _initialState$errors[route.id] : undefined;
       let isHydrationRequest = needsRevalidation == null && (((_routeModule$clientLo = routeModule.clientLoader) == null ? void 0 : _routeModule$clientLo.hydrate) === true || !route.hasLoader);
       dataRoute.loader = async (_ref, singleFetch) => {
         let {
@@ -7692,10 +7660,12 @@ function createClientRoutes(manifest, routeModulesCache, initialState, isSpaMode
                 preventInvalidServerHandlerCall("loader", route, isSpaMode);
                 // On the first call, resolve with the server result
                 if (isHydrationRequest) {
-                  if (initialError !== undefined) {
+                  if (hasInitialData) {
+                    return initialData;
+                  }
+                  if (hasInitialError) {
                     throw initialError;
                   }
-                  return initialData;
                 }
                 // Call the server loader for client-side navigations
                 return fetchServerLoader(singleFetch);
@@ -9145,7 +9115,7 @@ var DataRouterStateHook;
 })(DataRouterStateHook || (DataRouterStateHook = {}));
 // Internal hooks
 function getDataRouterConsoleError(hookName) {
-  return hookName + " must be used within a data router.  See https://reactrouter.com/routers/picking-a-router.";
+  return hookName + " must be used within a data router.  See https://reactrouter.com/en/main/routers/picking-a-router.";
 }
 function useDataRouterContext(hookName) {
   let ctx = React.useContext(DataRouterContext);
@@ -10566,6 +10536,13 @@ function stripRoutesParam(request) {
   return new Request(url.href, init);
 }
 
+function invariant(value, message) {
+  if (value === false || value === null || typeof value === "undefined") {
+    console.error("The following error is a bug in Remix; please open an issue! https://github.com/remix-run/remix/issues/new");
+    throw new Error(message);
+  }
+}
+
 function groupRoutesByParentId(manifest) {
   let routes = {};
   Object.values(manifest).forEach(route => {
@@ -10607,7 +10584,29 @@ function createStaticHandlerDataRoutes(manifest, future, parentId, routesByParen
       path: route.path,
       // Need to use RR's version in the param typed here to permit the optional
       // context even though we know it'll always be provided in remix
-      loader: route.module.loader ? args => callRouteHandler(route.module.loader, args) : undefined,
+      loader: route.module.loader ? async args => {
+        // If we're prerendering, use the data passed in from prerendering
+        // the .data route so we dom't call loaders twice
+        if (args.request.headers.has("X-React-Router-Prerender-Data")) {
+          let encoded = args.request.headers.get("X-React-Router-Prerender-Data");
+          !encoded ? process.env.NODE_ENV !== "production" ? invariant(false, "Missing prerendered data for route") : invariant(false) : void 0;
+          let uint8array = new TextEncoder().encode(encoded);
+          let stream = new ReadableStream({
+            start(controller) {
+              controller.enqueue(uint8array);
+              controller.close();
+            }
+          });
+          let decoded = await decodeViaTurboStream(stream, global);
+          let data = decoded.value;
+          !(data && route.id in data) ? process.env.NODE_ENV !== "production" ? invariant(false, "Unable to decode prerendered data") : invariant(false) : void 0;
+          let result = data[route.id];
+          !("data" in result) ? process.env.NODE_ENV !== "production" ? invariant(false, "Unable to process prerendered data") : invariant(false) : void 0;
+          return result.data;
+        }
+        let val = await callRouteHandler(route.module.loader, args);
+        return val;
+      } : undefined,
       action: route.module.action ? args => callRouteHandler(route.module.action, args) : undefined,
       handle: route.module.handle
     };
@@ -10976,13 +10975,6 @@ function encodeViaTurboStream(data, requestSignal, streamTimeout, serverMode) {
   });
 }
 
-function invariant(value, message) {
-  if (value === false || value === null || typeof value === "undefined") {
-    console.error("The following error is a bug in Remix; please open an issue! https://github.com/remix-run/remix/issues/new");
-    throw new Error(message);
-  }
-}
-
 function derive(build, mode) {
   let routes = createRoutes(build.routes);
   let dataRoutes = createStaticHandlerDataRoutes(build.routes, build.future);