react-router 7.9.1 → 7.9.2-pre.0

package/dist/production/{chunk-P25HWPOZ.mjs → chunk-662O2YDJ.mjs}

@@ -1,5 +1,5 @@
 /**
- * react-router v7.9.1
+ * react-router v7.9.2-pre.0
  *
  * Copyright (c) Remix Software Inc.
  *
@@ -1054,7 +1054,7 @@ function createRouter(init) {
       }
     } else if (initialMatches.some((m) => m.route.lazy)) {
       initialized = false;
-    } else if (!initialMatches.some((m) => m.route.loader)) {
+    } else if (!initialMatches.some((m) => routeHasLoaderOrMiddleware(m.route))) {
       initialized = true;
     } else {
       let loaderData = init.hydrationData ? init.hydrationData.loaderData : null;
@@ -1756,7 +1756,9 @@ function createRouter(init) {
       pendingActionResult
     );
     pendingNavigationLoadId = ++incrementingLoadId;
-    if (!init.dataStrategy && !dsMatches.some((m) => m.shouldLoad) && !dsMatches.some((m) => m.route.middleware) && revalidatingFetchers.length === 0) {
+    if (!init.dataStrategy && !dsMatches.some((m) => m.shouldLoad) && !dsMatches.some(
+      (m) => m.route.middleware && m.route.middleware.length > 0
+    ) && revalidatingFetchers.length === 0) {
       let updatedFetchers2 = markFetchRedirectsDone();
       completeNavigation(
         location,
@@ -2437,6 +2439,10 @@ function createRouter(init) {
     }
     return state.fetchers.get(key) || IDLE_FETCHER;
   }
+  function resetFetcher(key, opts) {
+    abortFetcher(key, opts?.reason);
+    updateFetcherState(key, getDoneFetcher(null));
+  }
   function deleteFetcher(key) {
     let fetcher = state.fetchers.get(key);
     if (fetchControllers.has(key) && !(fetcher && fetcher.state === "loading" && fetchReloadIds.has(key))) {
@@ -2459,10 +2465,10 @@ function createRouter(init) {
     }
     updateState({ fetchers: new Map(state.fetchers) });
   }
-  function abortFetcher(key) {
+  function abortFetcher(key, reason) {
     let controller = fetchControllers.get(key);
     if (controller) {
-      controller.abort();
+      controller.abort(reason);
       fetchControllers.delete(key);
     }
   }
@@ -2726,6 +2732,7 @@ function createRouter(init) {
     createHref: (to) => init.history.createHref(to),
     encodeLocation: (to) => init.history.encodeLocation(to),
     getFetcher,
+    resetFetcher,
     deleteFetcher: queueFetcherForDeletion,
     dispose,
     getBlocker,
@@ -3541,7 +3548,7 @@ function getMatchesToLoad(request, scopedContext, mapRouteProperties2, manifest,
       forceShouldLoad = false;
     } else if (route.lazy) {
       forceShouldLoad = true;
-    } else if (route.loader == null) {
+    } else if (!routeHasLoaderOrMiddleware(route)) {
       forceShouldLoad = false;
     } else if (initialHydration) {
       forceShouldLoad = shouldLoadRouteOnHydration(
@@ -3673,11 +3680,14 @@ function getMatchesToLoad(request, scopedContext, mapRouteProperties2, manifest,
   });
   return { dsMatches, revalidatingFetchers };
 }
+function routeHasLoaderOrMiddleware(route) {
+  return route.loader != null || route.middleware != null && route.middleware.length > 0;
+}
 function shouldLoadRouteOnHydration(route, loaderData, errors) {
   if (route.lazy) {
     return true;
   }
-  if (!route.loader) {
+  if (!routeHasLoaderOrMiddleware(route)) {
     return false;
   }
   let hasData = loaderData != null && route.id in loaderData;
@@ -4006,9 +4016,15 @@ function runClientMiddlewarePipeline(args, handler) {
       let { matches } = args;
       let maxBoundaryIdx = Math.min(
         // Throwing route
-        matches.findIndex((m) => m.route.id === routeId) || 0,
+        Math.max(
+          matches.findIndex((m) => m.route.id === routeId),
+          0
+        ),
         // or the shallowest route that needs to load data
-        matches.findIndex((m) => m.unstable_shouldCallHandler()) || 0
+        Math.max(
+          matches.findIndex((m) => m.unstable_shouldCallHandler()),
+          0
+        )
       );
       let boundaryRouteId = findNearestBoundary(
         matches,
@@ -5056,10 +5072,10 @@ function useOutletContext() {
 }
 function useOutlet(context) {
   let outlet = React2.useContext(RouteContext).outlet;
-  if (outlet) {
-    return /* @__PURE__ */ React2.createElement(OutletContext.Provider, { value: context }, outlet);
-  }
-  return outlet;
+  return React2.useMemo(
+    () => outlet && /* @__PURE__ */ React2.createElement(OutletContext.Provider, { value: context }, outlet),
+    [outlet, context]
+  );
 }
 function useParams() {
   let { matches } = React2.useContext(RouteContext);
@@ -5143,13 +5159,23 @@ Please change the parent <Route path="${parentPath}"> to <Route path="${parentPa
         params: Object.assign({}, parentParams, match.params),
         pathname: joinPaths([
           parentPathnameBase,
-          // Re-encode pathnames that were decoded inside matchRoutes
-          navigator.encodeLocation ? navigator.encodeLocation(match.pathname).pathname : match.pathname
+          // Re-encode pathnames that were decoded inside matchRoutes.
+          // Pre-encode `?` and `#` ahead of `encodeLocation` because it uses
+          // `new URL()` internally and we need to prevent it from treating
+          // them as separators
+          navigator.encodeLocation ? navigator.encodeLocation(
+            match.pathname.replace(/\?/g, "%3F").replace(/#/g, "%23")
+          ).pathname : match.pathname
         ]),
         pathnameBase: match.pathnameBase === "/" ? parentPathnameBase : joinPaths([
           parentPathnameBase,
           // Re-encode pathnames that were decoded inside matchRoutes
-          navigator.encodeLocation ? navigator.encodeLocation(match.pathnameBase).pathname : match.pathnameBase
+          // Pre-encode `?` and `#` ahead of `encodeLocation` because it uses
+          // `new URL()` internally and we need to prevent it from treating
+          // them as separators
+          navigator.encodeLocation ? navigator.encodeLocation(
+            match.pathnameBase.replace(/\?/g, "%3F").replace(/#/g, "%23")
+          ).pathname : match.pathnameBase
         ])
       })
     ),
@@ -6083,6 +6109,7 @@ function createRoutesFromChildren(children, parentPath = []) {
       Component: element.props.Component,
       index: element.props.index,
       path: element.props.path,
+      middleware: element.props.middleware,
       loader: element.props.loader,
       action: element.props.action,
       hydrateFallbackElement: element.props.hydrateFallbackElement,
@@ -8262,7 +8289,7 @@ function getManifestPath(_manifestPath, basename) {
 var MANIFEST_VERSION_STORAGE_KEY = "react-router-manifest-version";
 async function fetchAndApplyManifestPatches(paths, errorReloadPath, manifest, routeModules, ssr, isSpaMode, basename, manifestPath, patchRoutes, signal) {
   const searchParams = new URLSearchParams();
-  paths.sort().forEach((path) => searchParams.append("p", path));
+  searchParams.set("paths", paths.sort().join(","));
   searchParams.set("version", manifest.version);
   let url = new URL(
     getManifestPath(manifestPath, basename),
@@ -8285,13 +8312,16 @@ async function fetchAndApplyManifestPatches(paths, errorReloadPath, manifest, ro
         );
         return;
       }
-      if (sessionStorage.getItem(MANIFEST_VERSION_STORAGE_KEY) === manifest.version) {
-        console.error(
-          "Unable to discover routes due to manifest version mismatch."
-        );
-        return;
+      try {
+        if (sessionStorage.getItem(MANIFEST_VERSION_STORAGE_KEY) === manifest.version) {
+          console.error(
+            "Unable to discover routes due to manifest version mismatch."
+          );
+          return;
+        }
+        sessionStorage.setItem(MANIFEST_VERSION_STORAGE_KEY, manifest.version);
+      } catch {
       }
-      sessionStorage.setItem(MANIFEST_VERSION_STORAGE_KEY, manifest.version);
       window.location.href = errorReloadPath;
       console.warn("Detected manifest version mismatch, reloading...");
       await new Promise(() => {
@@ -8299,7 +8329,10 @@ async function fetchAndApplyManifestPatches(paths, errorReloadPath, manifest, ro
     } else if (res.status >= 400) {
       throw new Error(await res.text());
     }
-    sessionStorage.removeItem(MANIFEST_VERSION_STORAGE_KEY);
+    try {
+      sessionStorage.removeItem(MANIFEST_VERSION_STORAGE_KEY);
+    } catch {
+    }
     serverPatches = await res.json();
   } catch (e) {
     if (signal?.aborted) return;
@@ -8964,7 +8997,7 @@ var isBrowser = typeof window !== "undefined" && typeof window.document !== "und
 try {
   if (isBrowser) {
     window.__reactRouterVersion = // @ts-expect-error
-    "7.9.1";
+    "7.9.2-pre.0";
   }
 } catch (e) {
 }
@@ -9578,6 +9611,7 @@ function useFetcher({
     },
     [fetcherKey, submitImpl]
   );
+  let unstable_reset = React10.useCallback((opts) => router.resetFetcher(fetcherKey, opts), [router, fetcherKey]);
   let FetcherForm = React10.useMemo(() => {
     let FetcherForm2 = React10.forwardRef(
       (props, ref) => {
@@ -9594,10 +9628,11 @@ function useFetcher({
       Form: FetcherForm,
       submit,
       load,
+      unstable_reset,
       ...fetcher,
       data: data2
     }),
-    [FetcherForm, submit, load, fetcher, data2]
+    [FetcherForm, submit, load, unstable_reset, fetcher, data2]
   );
   return fetcherWithComponents;
 }
@@ -10008,6 +10043,9 @@ function createStaticRouter(routes, context, opts = {}) {
     deleteFetcher() {
       throw msg("deleteFetcher");
     },
+    resetFetcher() {
+      throw msg("resetFetcher");
+    },
     dispose() {
       throw msg("dispose");
     },

package/dist/{development/chunk-SKNKB5VI.mjs → production/chunk-HAV7J4RO.mjs}

@@ -1,5 +1,5 @@
 /**
- * react-router v7.9.1
+ * react-router v7.9.2-pre.0
  *
  * Copyright (c) Remix Software Inc.
  *
@@ -59,7 +59,7 @@ import {
   withComponentProps,
   withErrorBoundaryProps,
   withHydrateFallbackProps
-} from "./chunk-B7RQU5TL.mjs";
+} from "./chunk-662O2YDJ.mjs";
 
 // lib/dom/ssr/server.tsx
 import * as React from "react";
@@ -192,6 +192,12 @@ function processRoutes(routes, context, manifest, routeModules, parentId) {
       ErrorBoundary: route.ErrorBoundary ? withErrorBoundaryProps(route.ErrorBoundary) : void 0,
       action: route.action ? (args) => route.action({ ...args, context }) : void 0,
       loader: route.loader ? (args) => route.loader({ ...args, context }) : void 0,
+      middleware: route.middleware ? route.middleware.map(
+        (mw) => (...args) => mw(
+          { ...args[0], context },
+          args[1]
+        )
+      ) : void 0,
       handle: route.handle,
       shouldRevalidate: route.shouldRevalidate
     };
@@ -1234,9 +1240,11 @@ async function handleManifestRequest(build, routes, url) {
     });
   }
   let patches = {};
-  if (url.searchParams.has("p")) {
+  if (url.searchParams.has("paths")) {
     let paths = /* @__PURE__ */ new Set();
-    url.searchParams.getAll("p").forEach((path) => {
+    let pathParam = url.searchParams.get("paths") || "";
+    let requestedPaths = pathParam.split(",").filter(Boolean);
+    requestedPaths.forEach((path) => {
       if (!path.startsWith("/")) {
         path = `/${path}`;
       }
@@ -2407,7 +2415,7 @@ function getManifestUrl(paths) {
     ""
   );
   let url = new URL(`${basename}/.manifest`, window.location.origin);
-  paths.sort().forEach((path) => url.searchParams.append("p", path));
+  url.searchParams.set("paths", paths.sort().join(","));
   return url;
 }
 async function fetchAndApplyManifestPatches(paths, createFromReadableStream, fetchImplementation, signal) {
@@ -2601,8 +2609,28 @@ async function routeRSCServerRequest({
       }
     });
   };
-  const getPayload = async () => {
-    return createFromReadableStream(createStream());
+  let deepestRenderedBoundaryId = null;
+  const getPayload = () => {
+    const payloadPromise = Promise.resolve(
+      createFromReadableStream(createStream())
+    );
+    return Object.defineProperties(payloadPromise, {
+      _deepestRenderedBoundaryId: {
+        get() {
+          return deepestRenderedBoundaryId;
+        },
+        set(boundaryId) {
+          deepestRenderedBoundaryId = boundaryId;
+        }
+      },
+      formState: {
+        get() {
+          return payloadPromise.then(
+            (payload) => payload.type === "render" ? payload.formState : void 0
+          );
+        }
+      }
+    });
   };
   try {
     if (!detectRedirectResponse.body) {
@@ -2626,7 +2654,7 @@ async function routeRSCServerRequest({
     }
     const html = await renderHTML(getPayload);
     const headers = new Headers(serverResponse.headers);
-    headers.set("Content-Type", "text/html");
+    headers.set("Content-Type", "text/html; charset=utf-8");
     if (!hydrate) {
       return new Response(html, {
         status: serverResponse.status,
@@ -2645,11 +2673,62 @@ async function routeRSCServerRequest({
     if (reason instanceof Response) {
       return reason;
     }
+    try {
+      const status = isRouteErrorResponse(reason) ? reason.status : 500;
+      const html = await renderHTML(() => {
+        const decoded = Promise.resolve(
+          createFromReadableStream(createStream())
+        );
+        const payloadPromise = decoded.then(
+          (payload) => Object.assign(payload, {
+            status,
+            errors: deepestRenderedBoundaryId ? {
+              [deepestRenderedBoundaryId]: reason
+            } : {}
+          })
+        );
+        return Object.defineProperties(payloadPromise, {
+          _deepestRenderedBoundaryId: {
+            get() {
+              return deepestRenderedBoundaryId;
+            },
+            set(boundaryId) {
+              deepestRenderedBoundaryId = boundaryId;
+            }
+          },
+          formState: {
+            get() {
+              return payloadPromise.then(
+                (payload) => payload.type === "render" ? payload.formState : void 0
+              );
+            }
+          }
+        });
+      });
+      const headers = new Headers(serverResponse.headers);
+      headers.set("Content-Type", "text/html");
+      if (!hydrate) {
+        return new Response(html, {
+          status,
+          headers
+        });
+      }
+      if (!serverResponseB?.body) {
+        throw new Error("Failed to clone server response");
+      }
+      const body2 = html.pipeThrough(injectRSCPayload(serverResponseB.body));
+      return new Response(body2, {
+        status,
+        headers
+      });
+    } catch {
+    }
     throw reason;
   }
 }
 function RSCStaticRouter({ getPayload }) {
-  const payload = useSafe(getPayload());
+  const decoded = getPayload();
+  const payload = useSafe(decoded);
   if (payload.type === "redirect") {
     throw new Response(null, {
       status: payload.status,
@@ -2671,6 +2750,12 @@ function RSCStaticRouter({ getPayload }) {
     }
   }
   const context = {
+    get _deepestRenderedBoundaryId() {
+      return decoded._deepestRenderedBoundaryId ?? null;
+    },
+    set _deepestRenderedBoundaryId(boundaryId) {
+      decoded._deepestRenderedBoundaryId = boundaryId;
+    },
     actionData: payload.actionData,
     actionHeaders: {},
     basename: payload.basename,