react-router 8.3.0 → 8.4.0

package/dist/development/lib/context.d.ts

@@ -1,7 +1,7 @@
 
 import { Action, History, Location, To } from "./router/history.js";
 import { RouteMatch, TrackedPromise } from "./router/utils.js";
-import { RelativeRoutingType, Router, RouterState, StaticHandlerContext } from "./router/router.js";
+import { RelativeRoutingType, Router, StaticHandlerContext } from "./router/router.js";
 import { ClientOnErrorFunction } from "./components.js";
 import * as React$1 from "react";
 
@@ -12,7 +12,12 @@ interface DataRouterContextObject extends Omit<NavigationContextObject, "future"
   onError?: ClientOnErrorFunction;
 }
 declare const DataRouterContext: React$1.Context<DataRouterContextObject | null>;
-declare const DataRouterStateContext: React$1.Context<RouterState | null>;
+type DataRouterDataContextObject = Pick<Router["state"], "loaderData" | "actionData" | "errors">;
+type DataRouterNavigationContextObject = Pick<Router["state"], "navigation" | "revalidation">;
+type DataRouterStateContextObject = Omit<Router["state"], keyof DataRouterDataContextObject | keyof DataRouterNavigationContextObject | "fetchers">;
+declare const DataRouterStateContext: React$1.Context<DataRouterStateContextObject | null>;
+declare const DataRouterDataContext: React$1.Context<DataRouterDataContextObject | null>;
+declare const DataRouterNavigationContext: React$1.Context<DataRouterNavigationContextObject | null>;
 type ViewTransitionContextObject = {
   isTransitioning: false;
 } | {
@@ -22,8 +27,11 @@ type ViewTransitionContextObject = {
   nextLocation: Location;
 };
 declare const ViewTransitionContext: React$1.Context<ViewTransitionContextObject>;
-type FetchersContextObject = Map<string, any>;
-declare const FetchersContext: React$1.Context<FetchersContextObject>;
+type FetchersContextObject = {
+  fetchers: Router["state"]["fetchers"];
+  fetcherData: Map<string, any>;
+};
+declare const FetchersContext: React$1.Context<FetchersContextObject | null>;
 declare const AwaitContext: React$1.Context<TrackedPromise | null>;
 declare const AwaitContextProvider: (props: React$1.ComponentProps<typeof AwaitContext.Provider>) => React$1.FunctionComponentElement<React$1.ProviderProps<TrackedPromise | null>>;
 interface NavigateOptions {
@@ -55,6 +63,7 @@ interface NavigateOptions {
  */
 interface Navigator {
   createHref: History["createHref"];
+  createURL?: History["createURL"];
   encodeLocation?: History["encodeLocation"];
   go: History["go"];
   push(to: To, state?: any, opts?: NavigateOptions): void;
@@ -80,4 +89,4 @@ interface RouteContextObject {
 }
 declare const RouteContext: React$1.Context<RouteContextObject>;
 //#endregion
-export { AwaitContextProvider, DataRouterContext, DataRouterStateContext, FetchersContext, LocationContext, NavigateOptions, NavigationContext, Navigator, RouteContext, ViewTransitionContext };
+export { AwaitContextProvider, DataRouterContext, DataRouterDataContext, DataRouterNavigationContext, DataRouterStateContext, FetchersContext, LocationContext, NavigateOptions, NavigationContext, Navigator, RouteContext, ViewTransitionContext };

package/dist/development/lib/context.js

@@ -1,5 +1,5 @@
 /**
- * react-router v8.3.0
+ * react-router v8.4.0
  *
  * Copyright (c) Remix Software Inc.
  *
@@ -14,13 +14,17 @@ const DataRouterContext = React$1.createContext(null);
 DataRouterContext.displayName = "DataRouter";
 const DataRouterStateContext = React$1.createContext(null);
 DataRouterStateContext.displayName = "DataRouterState";
+const DataRouterDataContext = React$1.createContext(null);
+DataRouterDataContext.displayName = "DataRouterData";
+const DataRouterNavigationContext = React$1.createContext(null);
+DataRouterNavigationContext.displayName = "DataRouterNavigation";
 const RSCRouterContext = React$1.createContext(false);
 function useIsRSCRouterContext() {
 	return React$1.useContext(RSCRouterContext);
 }
 const ViewTransitionContext = React$1.createContext({ isTransitioning: false });
 ViewTransitionContext.displayName = "ViewTransition";
-const FetchersContext = React$1.createContext(/* @__PURE__ */ new Map());
+const FetchersContext = React$1.createContext(null);
 FetchersContext.displayName = "Fetchers";
 const AwaitContext = React$1.createContext(null);
 AwaitContext.displayName = "Await";
@@ -35,7 +39,11 @@ const RouteContext = React$1.createContext({
 	isDataRoute: false
 });
 RouteContext.displayName = "Route";
+const IsDataRouteContext = React$1.createContext(false);
+IsDataRouteContext.displayName = "IsDataRoute";
+const RouteIdContext = React$1.createContext(void 0);
+RouteIdContext.displayName = "RouteId";
 const RouteErrorContext = React$1.createContext(null);
 RouteErrorContext.displayName = "RouteError";
 //#endregion
-export { AwaitContext, AwaitContextProvider, DataRouterContext, DataRouterStateContext, FetchersContext, LocationContext, NavigationContext, RSCRouterContext, RouteContext, RouteErrorContext, ViewTransitionContext, useIsRSCRouterContext };
+export { AwaitContext, AwaitContextProvider, DataRouterContext, DataRouterDataContext, DataRouterNavigationContext, DataRouterStateContext, FetchersContext, IsDataRouteContext, LocationContext, NavigationContext, RSCRouterContext, RouteContext, RouteErrorContext, RouteIdContext, ViewTransitionContext, useIsRSCRouterContext };

package/dist/development/lib/dom/dom.js

@@ -1,5 +1,5 @@
 /**
- * react-router v8.3.0
+ * react-router v8.4.0
  *
  * Copyright (c) Remix Software Inc.
  *
@@ -75,7 +75,7 @@ function isFormDataSubmitterSupported() {
 	if (_formDataSupportsSubmitter === null) try {
 		new FormData(document.createElement("form"), 0);
 		_formDataSupportsSubmitter = false;
-	} catch (e) {
+	} catch {
 		_formDataSupportsSubmitter = true;
 	}
 	return _formDataSupportsSubmitter;

package/dist/development/lib/dom/lib.js

@@ -1,5 +1,5 @@
 /**
- * react-router v8.3.0
+ * react-router v8.4.0
  *
  * Copyright (c) Remix Software Inc.
  *
@@ -12,8 +12,8 @@ import { ABSOLUTE_URL_REGEX } from "../router/url.js";
 import { createBrowserHistory, createHashHistory, createPath, invariant, warning } from "../router/history.js";
 import { ErrorResponseImpl, SUPPORTED_ERROR_TYPES, defaultMapRouteProperties, joinPaths, matchPath, parseToInfo, resolveTo, stripBasename } from "../router/utils.js";
 import { IDLE_FETCHER, createRouter } from "../router/router.js";
-import { DataRouterContext, DataRouterStateContext, FetchersContext, NavigationContext, RouteContext, ViewTransitionContext } from "../context.js";
-import { useBlocker, useHref, useLocation, useMatches, useNavigate, useNavigation, useResolvedPath, useRouteId } from "../hooks.js";
+import { DataRouterNavigationContext, NavigationContext, RouteContext, ViewTransitionContext } from "../context.js";
+import { useBlocker, useCurrentRouteId, useDataRouterContext, useDataRouterFetchers, useDataRouterState, useHref, useLocation, useMatches, useNavigate, useNavigation, useResolvedPath } from "../hooks.js";
 import { Router, hydrationRouteProperties } from "../components.js";
 import { createSearchParams, getFormSubmissionInfo, getSearchParamsForLocation, shouldProcessLinkClick } from "./dom.js";
 import { escapeHtml } from "./ssr/markup.js";
@@ -22,8 +22,8 @@ import * as React$1 from "react";
 //#region lib/dom/lib.tsx
 const isBrowser = typeof window !== "undefined" && typeof window.document !== "undefined" && typeof window.document.createElement !== "undefined";
 try {
-	if (isBrowser) window.__reactRouterVersion = "8.3.0";
-} catch (e) {}
+	if (isBrowser) window.__reactRouterVersion = "8";
+} catch {}
 /**
 * Create a new {@link DataRouter| data router} that manages the application
 * path via [`history.pushState`](https://developer.mozilla.org/en-US/docs/Web/API/History/pushState)
@@ -123,7 +123,7 @@ function deserializeErrors(errors) {
 				let error = new ErrorConstructor(val.message);
 				error.stack = "";
 				serialized[key] = error;
-			} catch (e) {}
+			} catch {}
 		}
 		if (serialized[key] == null) {
 			let error = new Error(val.message);
@@ -372,12 +372,12 @@ Link.displayName = "Link";
 const NavLink = React$1.forwardRef(function NavLinkWithRef({ "aria-current": ariaCurrentProp = "page", caseSensitive = false, className: classNameProp = "", end = false, style: styleProp, to, viewTransition, children, ...rest }, ref) {
 	let path = useResolvedPath(to, { relative: rest.relative });
 	let location = useLocation();
-	let routerState = React$1.useContext(DataRouterStateContext);
+	let routerNavigation = React$1.useContext(DataRouterNavigationContext);
 	let { navigator, basename } = React$1.useContext(NavigationContext);
-	let isTransitioning = routerState != null && useViewTransitionState(path) && viewTransition === true;
+	let isTransitioning = routerNavigation != null && useViewTransitionState(path) && viewTransition === true;
 	let toPathname = navigator.encodeLocation ? navigator.encodeLocation(path).pathname : path.pathname;
 	let locationPathname = location.pathname;
-	let nextLocationPathname = routerState && routerState.navigation && routerState.navigation.location ? routerState.navigation.location.pathname : null;
+	let nextLocationPathname = routerNavigation?.navigation.location ? routerNavigation.navigation.location.pathname : null;
 	if (!caseSensitive) {
 		locationPathname = locationPathname.toLowerCase();
 		nextLocationPathname = nextLocationPathname ? nextLocationPathname.toLowerCase() : null;
@@ -573,19 +573,6 @@ function ScrollRestoration({ getKey, storageKey, ...props }) {
 	});
 }
 ScrollRestoration.displayName = "ScrollRestoration";
-function getDataRouterConsoleError(hookName) {
-	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$1.useContext(DataRouterContext);
-	invariant(ctx, getDataRouterConsoleError(hookName));
-	return ctx;
-}
-function useDataRouterState(hookName) {
-	let state = React$1.useContext(DataRouterStateContext);
-	invariant(state, getDataRouterConsoleError(hookName));
-	return state;
-}
 /**
 * Handles the click behavior for router {@link Link | `<Link>`} components.This
 * is useful if you need to create custom {@link Link | `<Link>`} components with
@@ -788,7 +775,7 @@ let getUniqueFetcherId = () => `__${String(++fetcherId)}__`;
 function useSubmit() {
 	let { router } = useDataRouterContext("useSubmit");
 	let { basename } = React$1.useContext(NavigationContext);
-	let currentRouteId = useRouteId();
+	let currentRouteId = useCurrentRouteId("useSubmit");
 	let routerFetch = router.fetch;
 	let routerNavigate = router.navigate;
 	return React$1.useCallback(async (target, options = {}) => {
@@ -796,6 +783,7 @@ function useSubmit() {
 		if (options.navigate === false) await routerFetch(options.fetcherKey || getUniqueFetcherId(), currentRouteId, options.action || action, {
 			defaultShouldRevalidate: options.defaultShouldRevalidate,
 			preventScrollReset: options.preventScrollReset,
+			relative: options.relative,
 			formData,
 			body,
 			formMethod: options.method || method,
@@ -805,6 +793,7 @@ function useSubmit() {
 		else await routerNavigate(options.action || action, {
 			defaultShouldRevalidate: options.defaultShouldRevalidate,
 			preventScrollReset: options.preventScrollReset,
+			relative: options.relative,
 			formData,
 			body,
 			formMethod: options.method || method,
@@ -945,13 +934,8 @@ function useFormAction(action, { relative } = {}) {
 */
 function useFetcher({ key } = {}) {
 	let { router } = useDataRouterContext("useFetcher");
-	let state = useDataRouterState("useFetcher");
-	let fetcherData = React$1.useContext(FetchersContext);
-	let route = React$1.useContext(RouteContext);
-	let routeId = route.matches[route.matches.length - 1]?.route.id;
-	invariant(fetcherData, `useFetcher must be used inside a FetchersContext`);
-	invariant(route, `useFetcher must be used inside a RouteContext`);
-	invariant(routeId != null, `useFetcher can only be used on routes that contain a unique "id"`);
+	let fetchersContext = useDataRouterFetchers("useFetcher");
+	let routeId = useCurrentRouteId("useFetcher");
 	let defaultKey = React$1.useId();
 	let [fetcherKey, setFetcherKey] = React$1.useState(key || defaultKey);
 	if (key && key !== fetcherKey) setFetcherKey(key);
@@ -993,8 +977,8 @@ function useFetcher({ key } = {}) {
 		FetcherForm.displayName = "fetcher.Form";
 		return FetcherForm;
 	}, [fetcherKey]);
-	let fetcher = state.fetchers.get(fetcherKey) || IDLE_FETCHER;
-	let data = fetcherData.get(fetcherKey);
+	let fetcher = fetchersContext.fetchers.get(fetcherKey) || IDLE_FETCHER;
+	let data = fetchersContext.fetcherData.get(fetcherKey);
 	return React$1.useMemo(() => ({
 		Form: FetcherForm,
 		submit,
@@ -1034,11 +1018,11 @@ function useFetcher({ key } = {}) {
 * property.
 */
 function useFetchers() {
-	let state = useDataRouterState("useFetchers");
-	return React$1.useMemo(() => Array.from(state.fetchers.entries()).map(([key, fetcher]) => ({
+	let { fetchers } = useDataRouterFetchers("useFetchers");
+	return React$1.useMemo(() => Array.from(fetchers.entries()).map(([key, fetcher]) => ({
 		...fetcher,
 		key
-	})), [state.fetchers]);
+	})), [fetchers]);
 }
 const SCROLL_RESTORATION_STORAGE_KEY = "react-router-scroll-positions";
 let savedScrollPositions = {};
@@ -1087,6 +1071,9 @@ function useScrollRestoration({ getKey, storageKey } = {}) {
 			window.history.scrollRestoration = "auto";
 		};
 	}, []);
+	usePageShow(React$1.useCallback((event) => {
+		if (event.persisted) window.history.scrollRestoration = "manual";
+	}, []));
 	usePageHide(React$1.useCallback(() => {
 		if (navigation.state === "idle") {
 			let key = getScrollRestorationKey(location, matches, basename, getKey);
@@ -1111,7 +1098,7 @@ function useScrollRestoration({ getKey, storageKey } = {}) {
 			try {
 				let sessionPositions = sessionStorage.getItem(storageKey || SCROLL_RESTORATION_STORAGE_KEY);
 				if (sessionPositions) savedScrollPositions = JSON.parse(sessionPositions);
-			} catch (e) {}
+			} catch {}
 		}, [storageKey]);
 		React$1.useLayoutEffect(() => {
 			let disableScrollRestoration = router?.enableScrollRestoration(savedScrollPositions, () => window.scrollY, getKey ? (location, matches) => getScrollRestorationKey(location, matches, basename, getKey) : void 0);
@@ -1179,6 +1166,16 @@ function usePageHide(callback, options) {
 		};
 	}, [callback, capture]);
 }
+function usePageShow(callback, options) {
+	let { capture } = options || {};
+	React$1.useEffect(() => {
+		let opts = capture != null ? { capture } : void 0;
+		window.addEventListener("pageshow", callback, opts);
+		return () => {
+			window.removeEventListener("pageshow", callback, opts);
+		};
+	}, [callback, capture]);
+}
 /**
 * Wrapper around {@link useBlocker} to show a [`window.confirm`](https://developer.mozilla.org/en-US/docs/Web/API/Window/confirm)
 * prompt to users instead of building a custom UI with {@link useBlocker}.

package/dist/development/lib/dom/server.d.ts

@@ -127,10 +127,15 @@ declare function StaticRouterProvider({
  * `query`
  * @param opts Options
  * @param opts.future Future flags for the static {@link DataRouter}
- * @param opts.branches Optional pre-computed route branches
+ * @param opts.branches Deprecated optional pre-computed route branches. This option
+ * is no longer used because branch caching is done automatically inside the static router.
  * @returns A static {@link DataRouter} that can be used to render the provided routes
  */
 declare function createStaticRouter(routes: RouteObject[], context: StaticHandlerContext, opts?: {
+  /**
+   * @deprecated This option is no longer used because branch caching is done
+   * automatically inside the static router.
+   */
   branches?: RouteBranch<DataRouteObject>[];
   future?: Partial<FutureConfig>;
 }): Router;

package/dist/development/lib/dom/server.js

@@ -1,5 +1,5 @@
 /**
- * react-router v8.3.0
+ * react-router v8.4.0
  *
  * Copyright (c) Remix Software Inc.
  *
@@ -9,10 +9,10 @@
  * @license MIT
  */
 import { ABSOLUTE_URL_REGEX } from "../router/url.js";
-import { createPath, invariant, parsePath } from "../router/history.js";
+import { createPath, invariant, parsePath, warning } from "../router/history.js";
 import { convertRoutesToDataRoutes, isRouteErrorResponse } from "../router/utils.js";
 import { IDLE_BLOCKER, IDLE_FETCHER, IDLE_NAVIGATION } from "../router/router.js";
-import { DataRouterContext, DataRouterStateContext, FetchersContext, ViewTransitionContext } from "../context.js";
+import { DataRouterContext, DataRouterDataContext, DataRouterNavigationContext, DataRouterStateContext, FetchersContext, ViewTransitionContext } from "../context.js";
 import { DataRoutes, Router } from "../components.js";
 import { escapeHtml } from "./ssr/markup.js";
 import * as React$1 from "react";
@@ -91,7 +91,6 @@ function StaticRouterProvider({ context, router, hydrate = true, nonce }) {
 		staticContext: context,
 		basename: context.basename || "/"
 	};
-	let fetchersContext = /* @__PURE__ */ new Map();
 	let hydrateScript = "";
 	if (hydrate !== false) {
 		let data = {
@@ -102,7 +101,30 @@ function StaticRouterProvider({ context, router, hydrate = true, nonce }) {
 		hydrateScript = `window.__staticRouterHydrationData = JSON.parse(${escapeHtml(JSON.stringify(JSON.stringify(data)))});`;
 	}
 	let { state } = dataRouterContext.router;
-	return /* @__PURE__ */ React$1.createElement(React$1.Fragment, null, /* @__PURE__ */ React$1.createElement(DataRouterContext.Provider, { value: dataRouterContext }, /* @__PURE__ */ React$1.createElement(DataRouterStateContext.Provider, { value: state }, /* @__PURE__ */ React$1.createElement(FetchersContext.Provider, { value: fetchersContext }, /* @__PURE__ */ React$1.createElement(ViewTransitionContext.Provider, { value: { isTransitioning: false } }, /* @__PURE__ */ React$1.createElement(Router, {
+	let dataRouterState = {
+		historyAction: state.historyAction,
+		location: state.location,
+		matches: state.matches,
+		initialized: state.initialized,
+		renderFallback: state.renderFallback,
+		restoreScrollPosition: state.restoreScrollPosition,
+		preventScrollReset: state.preventScrollReset,
+		blockers: state.blockers
+	};
+	let dataRouterNavigation = {
+		navigation: state.navigation,
+		revalidation: state.revalidation
+	};
+	let dataRouterData = {
+		loaderData: state.loaderData,
+		actionData: state.actionData,
+		errors: state.errors
+	};
+	let fetchersContext = {
+		fetchers: state.fetchers,
+		fetcherData: /* @__PURE__ */ new Map()
+	};
+	return /* @__PURE__ */ React$1.createElement(React$1.Fragment, null, /* @__PURE__ */ React$1.createElement(DataRouterContext.Provider, { value: dataRouterContext }, /* @__PURE__ */ React$1.createElement(DataRouterStateContext.Provider, { value: dataRouterState }, /* @__PURE__ */ React$1.createElement(DataRouterNavigationContext.Provider, { value: dataRouterNavigation }, /* @__PURE__ */ React$1.createElement(DataRouterDataContext.Provider, { value: dataRouterData }, /* @__PURE__ */ React$1.createElement(FetchersContext.Provider, { value: fetchersContext }, /* @__PURE__ */ React$1.createElement(ViewTransitionContext.Provider, { value: { isTransitioning: false } }, /* @__PURE__ */ React$1.createElement(Router, {
 		basename: dataRouterContext.basename,
 		location: state.location,
 		navigationType: state.historyAction,
@@ -112,10 +134,9 @@ function StaticRouterProvider({ context, router, hydrate = true, nonce }) {
 	}, /* @__PURE__ */ React$1.createElement(DataRoutes, {
 		manifest: router.manifest,
 		routes: router.routes,
-		future: router.future,
 		state,
 		isStatic: true
-	})))))), hydrateScript ? /* @__PURE__ */ React$1.createElement("script", {
+	})))))))), hydrateScript ? /* @__PURE__ */ React$1.createElement("script", {
 		suppressHydrationWarning: true,
 		nonce,
 		dangerouslySetInnerHTML: { __html: hydrateScript }
@@ -185,26 +206,31 @@ function getStatelessNavigator() {
 * `query`
 * @param opts Options
 * @param opts.future Future flags for the static {@link DataRouter}
-* @param opts.branches Optional pre-computed route branches
+* @param opts.branches Deprecated optional pre-computed route branches. This option
+* is no longer used because branch caching is done automatically inside the static router.
 * @returns A static {@link DataRouter} that can be used to render the provided routes
 */
 function createStaticRouter(routes, context, opts = {}) {
+	warning(opts.branches == null, "`createStaticRouter({ branches })` is deprecated and no longer used. Branch caching is done automatically inside the static router.");
 	let manifest = {};
 	let dataRoutes = convertRoutesToDataRoutes(routes, void 0, void 0, manifest);
-	let matches = context.matches.map((match) => {
+	let future = { ...opts?.future };
+	let matchRoutes = context._match;
+	let mapRouteMatch = (match) => {
 		let route = manifest[match.route.id] || match.route;
 		return {
 			...match,
 			route
 		};
-	});
+	};
+	let matches = context.matches.map(mapRouteMatch);
 	let msg = (method) => `You cannot use router.${method}() on the server because it is a stateless environment`;
 	return {
 		get basename() {
 			return context.basename;
 		},
 		get future() {
-			return { ...opts?.future };
+			return future;
 		},
 		get state() {
 			return {
@@ -227,13 +253,13 @@ function createStaticRouter(routes, context, opts = {}) {
 		get routes() {
 			return dataRoutes;
 		},
-		get branches() {
-			return opts.branches;
-		},
 		get manifest() {
 			return manifest;
 		},
 		get window() {},
+		match(locationArg) {
+			return matchRoutes(locationArg)?.map(mapRouteMatch) ?? null;
+		},
 		initialize() {
 			throw msg("initialize");
 		},

package/dist/development/lib/dom/ssr/components.js

@@ -1,5 +1,5 @@
 /**
- * react-router v8.3.0
+ * react-router v8.4.0
  *
  * Copyright (c) Remix Software Inc.
  *
@@ -8,9 +8,8 @@
  *
  * @license MIT
  */
-import { matchRoutes } from "../../router/utils.js";
-import { DataRouterContext, DataRouterStateContext, useIsRSCRouterContext } from "../../context.js";
-import { useLocation } from "../../hooks.js";
+import { useIsRSCRouterContext } from "../../context.js";
+import { useDataRouterContext, useDataRouterData, useDataRouterState, useLocation } from "../../hooks.js";
 import { warnOnce } from "../../server-runtime/warnings.js";
 import invariant from "./invariant.js";
 import { getKeyedLinksForMatches, getKeyedPrefetchLinks, getModuleLinkHrefs, getNewMatchesForLinks, isPageLinkDescriptor } from "./links.js";
@@ -19,16 +18,6 @@ import { singleFetchUrl } from "./single-fetch.js";
 import { getPartialManifest, isFogOfWarEnabled } from "./fog-of-war.js";
 import * as React$1 from "react";
 //#region lib/dom/ssr/components.tsx
-function useDataRouterContext() {
-	let context = React$1.useContext(DataRouterContext);
-	invariant(context, "You must render this element inside a <DataRouterContext.Provider> element");
-	return context;
-}
-function useDataRouterStateContext() {
-	let context = React$1.useContext(DataRouterStateContext);
-	invariant(context, "You must render this element inside a <DataRouterStateContext.Provider> element");
-	return context;
-}
 const FrameworkContext = React$1.createContext(void 0);
 FrameworkContext.displayName = "FrameworkContext";
 function useFrameworkContext() {
@@ -142,7 +131,8 @@ const CRITICAL_CSS_DATA_ATTRIBUTE = "data-react-router-critical-css";
 */
 function Links({ nonce, crossOrigin }) {
 	let { isSpaMode, manifest, routeModules, criticalCss, nonce: contextNonce } = useFrameworkContext();
-	let { errors, matches: routerMatches } = useDataRouterStateContext();
+	let { matches: routerMatches } = useDataRouterState("Links");
+	let { errors } = useDataRouterData("Links");
 	let matches = getActiveMatches(routerMatches, errors, isSpaMode);
 	let keyedLinks = React$1.useMemo(() => getKeyedLinksForMatches(matches, routeModules, manifest), [
 		matches,
@@ -202,11 +192,11 @@ function Links({ nonce, crossOrigin }) {
 function PrefetchPageLinks({ page, ...linkProps }) {
 	let rsc = useIsRSCRouterContext();
 	let { nonce: contextNonce } = useFrameworkContext();
-	let { router } = useDataRouterContext();
-	let matches = React$1.useMemo(() => matchRoutes(router.routes, page, router.basename), [
+	let { router } = useDataRouterContext("PrefetchPageLinks");
+	let matches = React$1.useMemo(() => router.match(page), [
+		router,
 		router.routes,
-		page,
-		router.basename
+		page
 	]);
 	if (!matches) return null;
 	if (linkProps.nonce == null && contextNonce) linkProps = {
@@ -269,7 +259,8 @@ function RSCPrefetchPageLinksImpl({ page, matches: nextMatches, ...linkProps })
 function PrefetchPageLinksImpl({ page, matches: nextMatches, ...linkProps }) {
 	let location = useLocation();
 	let { manifest, routeModules } = useFrameworkContext();
-	let { loaderData, matches } = useDataRouterStateContext();
+	let { matches } = useDataRouterState("PrefetchPageLinks");
+	let { loaderData } = useDataRouterData("PrefetchPageLinks");
 	let newMatchesForData = React$1.useMemo(() => getNewMatchesForLinks(page, nextMatches, matches, manifest, location, "data"), [
 		page,
 		nextMatches,
@@ -355,7 +346,8 @@ function PrefetchPageLinksImpl({ page, matches: nextMatches, ...linkProps }) {
 */
 function Meta() {
 	let { isSpaMode, routeModules } = useFrameworkContext();
-	let { errors, matches: routerMatches, loaderData } = useDataRouterStateContext();
+	let { matches: routerMatches } = useDataRouterState("Meta");
+	let { errors, loaderData } = useDataRouterData("Meta");
 	let location = useLocation();
 	let _matches = getActiveMatches(routerMatches, errors, isSpaMode);
 	let error = null;
@@ -425,7 +417,7 @@ function Meta() {
 				type: "application/ld+json",
 				dangerouslySetInnerHTML: { __html: escapeHtml(json) }
 			});
-		} catch (e) {
+		} catch {
 			return null;
 		}
 		return /* @__PURE__ */ React$1.createElement("meta", {
@@ -480,8 +472,8 @@ function setIsHydrated() {
 */
 function Scripts(scriptProps) {
 	let { manifest, serverHandoffString, isSpaMode, renderMeta, routeDiscovery, ssr, nonce: contextNonce } = useFrameworkContext();
-	let { router, static: isStatic, staticContext } = useDataRouterContext();
-	let { matches: routerMatches } = useDataRouterStateContext();
+	let { router, static: isStatic, staticContext } = useDataRouterContext("Scripts");
+	let { matches: routerMatches } = useDataRouterState("Scripts");
 	let isRSCRouterContext = useIsRSCRouterContext();
 	let enableFogOfWar = isFogOfWarEnabled(routeDiscovery, ssr);
 	if (scriptProps.nonce == null && contextNonce) scriptProps = {

package/dist/development/lib/dom/ssr/data.js

@@ -1,5 +1,5 @@
 /**
- * react-router v8.3.0
+ * react-router v8.4.0
  *
  * Copyright (c) Remix Software Inc.
  *

package/dist/development/lib/dom/ssr/entry.d.ts

@@ -33,6 +33,10 @@ interface FrameworkContextObject {
   };
 }
 interface EntryContext extends FrameworkContextObject {
+  /**
+   * @deprecated This property was an internal implementation detail and was
+   * never intended for use in `entry.server.tsx`. It is always an empty array.
+   */
   branches: RouteBranch<DataRouteObject>[];
   staticHandlerContext: StaticHandlerContext;
   serverHandoffStream?: ReadableStream<Uint8Array>;

package/dist/development/lib/dom/ssr/errorBoundaries.js

@@ -1,5 +1,5 @@
 /**
- * react-router v8.3.0
+ * react-router v8.4.0
  *
  * Copyright (c) Remix Software Inc.
  *

package/dist/development/lib/dom/ssr/fallback.js

@@ -1,5 +1,5 @@
 /**
- * react-router v8.3.0
+ * react-router v8.4.0
  *
  * Copyright (c) Remix Software Inc.
  *

package/dist/development/lib/dom/ssr/fog-of-war.js

@@ -1,5 +1,5 @@
 /**
- * react-router v8.3.0
+ * react-router v8.4.0
  *
  * Copyright (c) Remix Software Inc.
  *
@@ -9,7 +9,7 @@
  * @license MIT
  */
 import { createPath } from "../../router/history.js";
-import { joinPaths, matchRoutesImpl } from "../../router/utils.js";
+import { joinPaths } from "../../router/utils.js";
 import { createClientRoutes } from "./routes.js";
 import * as React$1 from "react";
 //#region lib/dom/ssr/fog-of-war.ts
@@ -39,7 +39,7 @@ function getPartialManifest({ sri, ...manifest }, router) {
 		segments.pop();
 	}
 	paths.forEach((path) => {
-		let matches = matchRoutesImpl(router.routes, path, router.basename || "/", false, router.branches);
+		let matches = router.match(path);
 		if (matches) matches.forEach((m) => routeIds.add(m.route.id));
 	});
 	let initialRoutes = [...routeIds].reduce((acc, id) => Object.assign(acc, { [id]: manifest.routes[id] }), {});
@@ -110,7 +110,10 @@ function getManifestPath(_manifestPath, basename) {
 	return basename == null ? manifestPath : joinPaths([basename, manifestPath]);
 }
 const MANIFEST_VERSION_STORAGE_KEY = "react-router-manifest-version";
+const MANIFEST_RELOAD_TIMEOUT = 5e3;
+let pendingManifestReload;
 async function handleClientVersionMismatch(needsReload, version, errorReloadPath) {
+	if (pendingManifestReload) return pendingManifestReload;
 	if (!needsReload) {
 		try {
 			sessionStorage.removeItem(MANIFEST_VERSION_STORAGE_KEY);
@@ -121,17 +124,35 @@ async function handleClientVersionMismatch(needsReload, version, errorReloadPath
 		console.warn("Detected a manifest version mismatch during eager route discovery. The next navigation/fetch to an undiscovered route will result in a new document navigation to sync up with the latest manifest.");
 		return true;
 	}
+	let alreadyReloaded = false;
 	try {
-		if (sessionStorage.getItem(MANIFEST_VERSION_STORAGE_KEY) === version) {
-			console.error("Unable to discover routes due to manifest version mismatch.");
-			return true;
-		}
-		sessionStorage.setItem(MANIFEST_VERSION_STORAGE_KEY, version);
+		alreadyReloaded = sessionStorage.getItem(MANIFEST_VERSION_STORAGE_KEY) === version;
+		if (!alreadyReloaded) sessionStorage.setItem(MANIFEST_VERSION_STORAGE_KEY, version);
 	} catch {}
-	window.location.href = errorReloadPath;
-	console.warn("Detected manifest version mismatch, reloading...");
-	await new Promise(() => {});
-	return true;
+	if (alreadyReloaded) throw new Error("Unable to discover routes due to manifest version mismatch.");
+	let rejectReload;
+	let reloadPromise = new Promise((_, reject) => {
+		rejectReload = reject;
+	});
+	pendingManifestReload = reloadPromise;
+	let failReload = () => {
+		clearTimeout(timeout);
+		window.removeEventListener("pageshow", onPageShow);
+		pendingManifestReload = void 0;
+		rejectReload(/* @__PURE__ */ new Error("Unable to discover routes due to manifest version mismatch."));
+	};
+	let timeout = setTimeout(failReload, MANIFEST_RELOAD_TIMEOUT);
+	let onPageShow = (event) => {
+		if (event.persisted) failReload();
+	};
+	window.addEventListener("pageshow", onPageShow);
+	try {
+		window.location.href = errorReloadPath;
+		console.warn("Detected manifest version mismatch, reloading...");
+	} catch {
+		failReload();
+	}
+	return reloadPromise;
 }
 async function fetchAndApplyManifestPatches(paths, errorReloadPath, manifest, routeModules, ssr, isSpaMode, basename, manifestPath, patchRoutes, signal) {
 	paths = getPathsWithAncestors(paths);
@@ -154,6 +175,7 @@ async function fetchAndApplyManifestPatches(paths, errorReloadPath, manifest, ro
 		if (signal?.aborted) return;
 		throw e;
 	}
+	if (signal?.aborted) return;
 	let knownRoutes = new Set(Object.keys(manifest.routes));
 	let patches = Object.values(serverPatches).reduce((acc, route) => {
 		if (route && !knownRoutes.has(route.id)) acc[route.id] = route;