UNPKG

56.5 kBJavaScriptView Raw
1/**
2 * React Router v6.22.0
3 *
4 * Copyright (c) Remix Software Inc.
5 *
6 * This source code is licensed under the MIT license found in the
7 * LICENSE.md file in the root directory of this source tree.
8 *
9 * @license MIT
10 */
11import * as React from 'react';
12import { UNSAFE_invariant, joinPaths, matchPath, UNSAFE_getResolveToMatches, UNSAFE_warning, resolveTo, parsePath, matchRoutes, Action, UNSAFE_convertRouteMatchToUiMatch, stripBasename, IDLE_BLOCKER, isRouteErrorResponse, createMemoryHistory, AbortedDeferredError, createRouter } from '@remix-run/router';
13export { AbortedDeferredError, Action as NavigationType, createPath, defer, generatePath, isRouteErrorResponse, json, matchPath, matchRoutes, parsePath, redirect, redirectDocument, resolvePath } from '@remix-run/router';
14
15function _extends() {
16 _extends = Object.assign ? Object.assign.bind() : function (target) {
17 for (var i = 1; i < arguments.length; i++) {
18 var source = arguments[i];
19 for (var key in source) {
20 if (Object.prototype.hasOwnProperty.call(source, key)) {
21 target[key] = source[key];
22 }
23 }
24 }
25 return target;
26 };
27 return _extends.apply(this, arguments);
28}
29
30// Create react-specific types from the agnostic types in @remix-run/router to
31// export from react-router
32const DataRouterContext = /*#__PURE__*/React.createContext(null);
33if (process.env.NODE_ENV !== "production") {
34 DataRouterContext.displayName = "DataRouter";
35}
36const DataRouterStateContext = /*#__PURE__*/React.createContext(null);
37if (process.env.NODE_ENV !== "production") {
38 DataRouterStateContext.displayName = "DataRouterState";
39}
40const AwaitContext = /*#__PURE__*/React.createContext(null);
41if (process.env.NODE_ENV !== "production") {
42 AwaitContext.displayName = "Await";
43}
44
45/**
46 * A Navigator is a "location changer"; it's how you get to different locations.
47 *
48 * Every history instance conforms to the Navigator interface, but the
49 * distinction is useful primarily when it comes to the low-level `<Router>` API
50 * where both the location and a navigator must be provided separately in order
51 * to avoid "tearing" that may occur in a suspense-enabled app if the action
52 * and/or location were to be read directly from the history instance.
53 */
54
55const NavigationContext = /*#__PURE__*/React.createContext(null);
56if (process.env.NODE_ENV !== "production") {
57 NavigationContext.displayName = "Navigation";
58}
59const LocationContext = /*#__PURE__*/React.createContext(null);
60if (process.env.NODE_ENV !== "production") {
61 LocationContext.displayName = "Location";
62}
63const RouteContext = /*#__PURE__*/React.createContext({
64 outlet: null,
65 matches: [],
66 isDataRoute: false
67});
68if (process.env.NODE_ENV !== "production") {
69 RouteContext.displayName = "Route";
70}
71const RouteErrorContext = /*#__PURE__*/React.createContext(null);
72if (process.env.NODE_ENV !== "production") {
73 RouteErrorContext.displayName = "RouteError";
74}
75
76/**
77 * Returns the full href for the given "to" value. This is useful for building
78 * custom links that are also accessible and preserve right-click behavior.
79 *
80 * @see https://reactrouter.com/hooks/use-href
81 */
82function useHref(to, _temp) {
83 let {
84 relative
85 } = _temp === void 0 ? {} : _temp;
86 !useInRouterContext() ? process.env.NODE_ENV !== "production" ? UNSAFE_invariant(false, // TODO: This error is probably because they somehow have 2 versions of the
87 // router loaded. We can help them understand how to avoid that.
88 "useHref() may be used only in the context of a <Router> component.") : UNSAFE_invariant(false) : void 0;
89 let {
90 basename,
91 navigator
92 } = React.useContext(NavigationContext);
93 let {
94 hash,
95 pathname,
96 search
97 } = useResolvedPath(to, {
98 relative
99 });
100 let joinedPathname = pathname;
101
102 // If we're operating within a basename, prepend it to the pathname prior
103 // to creating the href. If this is a root navigation, then just use the raw
104 // basename which allows the basename to have full control over the presence
105 // of a trailing slash on root links
106 if (basename !== "/") {
107 joinedPathname = pathname === "/" ? basename : joinPaths([basename, pathname]);
108 }
109 return navigator.createHref({
110 pathname: joinedPathname,
111 search,
112 hash
113 });
114}
115
116/**
117 * Returns true if this component is a descendant of a `<Router>`.
118 *
119 * @see https://reactrouter.com/hooks/use-in-router-context
120 */
121function useInRouterContext() {
122 return React.useContext(LocationContext) != null;
123}
124
125/**
126 * Returns the current location object, which represents the current URL in web
127 * browsers.
128 *
129 * Note: If you're using this it may mean you're doing some of your own
130 * "routing" in your app, and we'd like to know what your use case is. We may
131 * be able to provide something higher-level to better suit your needs.
132 *
133 * @see https://reactrouter.com/hooks/use-location
134 */
135function useLocation() {
136 !useInRouterContext() ? process.env.NODE_ENV !== "production" ? UNSAFE_invariant(false, // TODO: This error is probably because they somehow have 2 versions of the
137 // router loaded. We can help them understand how to avoid that.
138 "useLocation() may be used only in the context of a <Router> component.") : UNSAFE_invariant(false) : void 0;
139 return React.useContext(LocationContext).location;
140}
141
142/**
143 * Returns the current navigation action which describes how the router came to
144 * the current location, either by a pop, push, or replace on the history stack.
145 *
146 * @see https://reactrouter.com/hooks/use-navigation-type
147 */
148function useNavigationType() {
149 return React.useContext(LocationContext).navigationType;
150}
151
152/**
153 * Returns a PathMatch object if the given pattern matches the current URL.
154 * This is useful for components that need to know "active" state, e.g.
155 * `<NavLink>`.
156 *
157 * @see https://reactrouter.com/hooks/use-match
158 */
159function useMatch(pattern) {
160 !useInRouterContext() ? process.env.NODE_ENV !== "production" ? UNSAFE_invariant(false, // TODO: This error is probably because they somehow have 2 versions of the
161 // router loaded. We can help them understand how to avoid that.
162 "useMatch() may be used only in the context of a <Router> component.") : UNSAFE_invariant(false) : void 0;
163 let {
164 pathname
165 } = useLocation();
166 return React.useMemo(() => matchPath(pattern, pathname), [pathname, pattern]);
167}
168
169/**
170 * The interface for the navigate() function returned from useNavigate().
171 */
172
173const navigateEffectWarning = "You should call navigate() in a React.useEffect(), not when " + "your component is first rendered.";
174
175// Mute warnings for calls to useNavigate in SSR environments
176function useIsomorphicLayoutEffect(cb) {
177 let isStatic = React.useContext(NavigationContext).static;
178 if (!isStatic) {
179 // We should be able to get rid of this once react 18.3 is released
180 // See: https://github.com/facebook/react/pull/26395
181 // eslint-disable-next-line react-hooks/rules-of-hooks
182 React.useLayoutEffect(cb);
183 }
184}
185
186/**
187 * Returns an imperative method for changing the location. Used by `<Link>`s, but
188 * may also be used by other elements to change the location.
189 *
190 * @see https://reactrouter.com/hooks/use-navigate
191 */
192function useNavigate() {
193 let {
194 isDataRoute
195 } = React.useContext(RouteContext);
196 // Conditional usage is OK here because the usage of a data router is static
197 // eslint-disable-next-line react-hooks/rules-of-hooks
198 return isDataRoute ? useNavigateStable() : useNavigateUnstable();
199}
200function useNavigateUnstable() {
201 !useInRouterContext() ? process.env.NODE_ENV !== "production" ? UNSAFE_invariant(false, // TODO: This error is probably because they somehow have 2 versions of the
202 // router loaded. We can help them understand how to avoid that.
203 "useNavigate() may be used only in the context of a <Router> component.") : UNSAFE_invariant(false) : void 0;
204 let dataRouterContext = React.useContext(DataRouterContext);
205 let {
206 basename,
207 future,
208 navigator
209 } = React.useContext(NavigationContext);
210 let {
211 matches
212 } = React.useContext(RouteContext);
213 let {
214 pathname: locationPathname
215 } = useLocation();
216 let routePathnamesJson = JSON.stringify(UNSAFE_getResolveToMatches(matches, future.v7_relativeSplatPath));
217 let activeRef = React.useRef(false);
218 useIsomorphicLayoutEffect(() => {
219 activeRef.current = true;
220 });
221 let navigate = React.useCallback(function (to, options) {
222 if (options === void 0) {
223 options = {};
224 }
225 process.env.NODE_ENV !== "production" ? UNSAFE_warning(activeRef.current, navigateEffectWarning) : void 0;
226
227 // Short circuit here since if this happens on first render the navigate
228 // is useless because we haven't wired up our history listener yet
229 if (!activeRef.current) return;
230 if (typeof to === "number") {
231 navigator.go(to);
232 return;
233 }
234 let path = resolveTo(to, JSON.parse(routePathnamesJson), locationPathname, options.relative === "path");
235
236 // If we're operating within a basename, prepend it to the pathname prior
237 // to handing off to history (but only if we're not in a data router,
238 // otherwise it'll prepend the basename inside of the router).
239 // If this is a root navigation, then we navigate to the raw basename
240 // which allows the basename to have full control over the presence of a
241 // trailing slash on root links
242 if (dataRouterContext == null && basename !== "/") {
243 path.pathname = path.pathname === "/" ? basename : joinPaths([basename, path.pathname]);
244 }
245 (!!options.replace ? navigator.replace : navigator.push)(path, options.state, options);
246 }, [basename, navigator, routePathnamesJson, locationPathname, dataRouterContext]);
247 return navigate;
248}
249const OutletContext = /*#__PURE__*/React.createContext(null);
250
251/**
252 * Returns the context (if provided) for the child route at this level of the route
253 * hierarchy.
254 * @see https://reactrouter.com/hooks/use-outlet-context
255 */
256function useOutletContext() {
257 return React.useContext(OutletContext);
258}
259
260/**
261 * Returns the element for the child route at this level of the route
262 * hierarchy. Used internally by `<Outlet>` to render child routes.
263 *
264 * @see https://reactrouter.com/hooks/use-outlet
265 */
266function useOutlet(context) {
267 let outlet = React.useContext(RouteContext).outlet;
268 if (outlet) {
269 return /*#__PURE__*/React.createElement(OutletContext.Provider, {
270 value: context
271 }, outlet);
272 }
273 return outlet;
274}
275
276/**
277 * Returns an object of key/value pairs of the dynamic params from the current
278 * URL that were matched by the route path.
279 *
280 * @see https://reactrouter.com/hooks/use-params
281 */
282function useParams() {
283 let {
284 matches
285 } = React.useContext(RouteContext);
286 let routeMatch = matches[matches.length - 1];
287 return routeMatch ? routeMatch.params : {};
288}
289
290/**
291 * Resolves the pathname of the given `to` value against the current location.
292 *
293 * @see https://reactrouter.com/hooks/use-resolved-path
294 */
295function useResolvedPath(to, _temp2) {
296 let {
297 relative
298 } = _temp2 === void 0 ? {} : _temp2;
299 let {
300 future
301 } = React.useContext(NavigationContext);
302 let {
303 matches
304 } = React.useContext(RouteContext);
305 let {
306 pathname: locationPathname
307 } = useLocation();
308 let routePathnamesJson = JSON.stringify(UNSAFE_getResolveToMatches(matches, future.v7_relativeSplatPath));
309 return React.useMemo(() => resolveTo(to, JSON.parse(routePathnamesJson), locationPathname, relative === "path"), [to, routePathnamesJson, locationPathname, relative]);
310}
311
312/**
313 * Returns the element of the route that matched the current location, prepared
314 * with the correct context to render the remainder of the route tree. Route
315 * elements in the tree must render an `<Outlet>` to render their child route's
316 * element.
317 *
318 * @see https://reactrouter.com/hooks/use-routes
319 */
320function useRoutes(routes, locationArg) {
321 return useRoutesImpl(routes, locationArg);
322}
323
324// Internal implementation with accept optional param for RouterProvider usage
325function useRoutesImpl(routes, locationArg, dataRouterState, future) {
326 !useInRouterContext() ? process.env.NODE_ENV !== "production" ? UNSAFE_invariant(false, // TODO: This error is probably because they somehow have 2 versions of the
327 // router loaded. We can help them understand how to avoid that.
328 "useRoutes() may be used only in the context of a <Router> component.") : UNSAFE_invariant(false) : void 0;
329 let {
330 navigator
331 } = React.useContext(NavigationContext);
332 let {
333 matches: parentMatches
334 } = React.useContext(RouteContext);
335 let routeMatch = parentMatches[parentMatches.length - 1];
336 let parentParams = routeMatch ? routeMatch.params : {};
337 let parentPathname = routeMatch ? routeMatch.pathname : "/";
338 let parentPathnameBase = routeMatch ? routeMatch.pathnameBase : "/";
339 let parentRoute = routeMatch && routeMatch.route;
340 if (process.env.NODE_ENV !== "production") {
341 // You won't get a warning about 2 different <Routes> under a <Route>
342 // without a trailing *, but this is a best-effort warning anyway since we
343 // cannot even give the warning unless they land at the parent route.
344 //
345 // Example:
346 //
347 // <Routes>
348 // {/* This route path MUST end with /* because otherwise
349 // it will never match /blog/post/123 */}
350 // <Route path="blog" element={<Blog />} />
351 // <Route path="blog/feed" element={<BlogFeed />} />
352 // </Routes>
353 //
354 // function Blog() {
355 // return (
356 // <Routes>
357 // <Route path="post/:id" element={<Post />} />
358 // </Routes>
359 // );
360 // }
361 let parentPath = parentRoute && parentRoute.path || "";
362 warningOnce(parentPathname, !parentRoute || parentPath.endsWith("*"), "You rendered descendant <Routes> (or called `useRoutes()`) at " + ("\"" + parentPathname + "\" (under <Route path=\"" + parentPath + "\">) but the ") + "parent route path has no trailing \"*\". This means if you navigate " + "deeper, the parent won't match anymore and therefore the child " + "routes will never render.\n\n" + ("Please change the parent <Route path=\"" + parentPath + "\"> to <Route ") + ("path=\"" + (parentPath === "/" ? "*" : parentPath + "/*") + "\">."));
363 }
364 let locationFromContext = useLocation();
365 let location;
366 if (locationArg) {
367 var _parsedLocationArg$pa;
368 let parsedLocationArg = typeof locationArg === "string" ? parsePath(locationArg) : locationArg;
369 !(parentPathnameBase === "/" || ((_parsedLocationArg$pa = parsedLocationArg.pathname) == null ? void 0 : _parsedLocationArg$pa.startsWith(parentPathnameBase))) ? process.env.NODE_ENV !== "production" ? UNSAFE_invariant(false, "When overriding the location using `<Routes location>` or `useRoutes(routes, location)`, " + "the location pathname must begin with the portion of the URL pathname that was " + ("matched by all parent routes. The current pathname base is \"" + parentPathnameBase + "\" ") + ("but pathname \"" + parsedLocationArg.pathname + "\" was given in the `location` prop.")) : UNSAFE_invariant(false) : void 0;
370 location = parsedLocationArg;
371 } else {
372 location = locationFromContext;
373 }
374 let pathname = location.pathname || "/";
375 let remainingPathname = parentPathnameBase === "/" ? pathname : pathname.slice(parentPathnameBase.length) || "/";
376 let matches = matchRoutes(routes, {
377 pathname: remainingPathname
378 });
379 if (process.env.NODE_ENV !== "production") {
380 process.env.NODE_ENV !== "production" ? UNSAFE_warning(parentRoute || matches != null, "No routes matched location \"" + location.pathname + location.search + location.hash + "\" ") : void 0;
381 process.env.NODE_ENV !== "production" ? UNSAFE_warning(matches == null || matches[matches.length - 1].route.element !== undefined || matches[matches.length - 1].route.Component !== undefined || matches[matches.length - 1].route.lazy !== undefined, "Matched leaf route at location \"" + location.pathname + location.search + location.hash + "\" " + "does not have an element or Component. This means it will render an <Outlet /> with a " + "null value by default resulting in an \"empty\" page.") : void 0;
382 }
383 let renderedMatches = _renderMatches(matches && matches.map(match => Object.assign({}, match, {
384 params: Object.assign({}, parentParams, match.params),
385 pathname: joinPaths([parentPathnameBase,
386 // Re-encode pathnames that were decoded inside matchRoutes
387 navigator.encodeLocation ? navigator.encodeLocation(match.pathname).pathname : match.pathname]),
388 pathnameBase: match.pathnameBase === "/" ? parentPathnameBase : joinPaths([parentPathnameBase,
389 // Re-encode pathnames that were decoded inside matchRoutes
390 navigator.encodeLocation ? navigator.encodeLocation(match.pathnameBase).pathname : match.pathnameBase])
391 })), parentMatches, dataRouterState, future);
392
393 // When a user passes in a `locationArg`, the associated routes need to
394 // be wrapped in a new `LocationContext.Provider` in order for `useLocation`
395 // to use the scoped location instead of the global location.
396 if (locationArg && renderedMatches) {
397 return /*#__PURE__*/React.createElement(LocationContext.Provider, {
398 value: {
399 location: _extends({
400 pathname: "/",
401 search: "",
402 hash: "",
403 state: null,
404 key: "default"
405 }, location),
406 navigationType: Action.Pop
407 }
408 }, renderedMatches);
409 }
410 return renderedMatches;
411}
412function DefaultErrorComponent() {
413 let error = useRouteError();
414 let message = isRouteErrorResponse(error) ? error.status + " " + error.statusText : error instanceof Error ? error.message : JSON.stringify(error);
415 let stack = error instanceof Error ? error.stack : null;
416 let lightgrey = "rgba(200,200,200, 0.5)";
417 let preStyles = {
418 padding: "0.5rem",
419 backgroundColor: lightgrey
420 };
421 let codeStyles = {
422 padding: "2px 4px",
423 backgroundColor: lightgrey
424 };
425 let devInfo = null;
426 if (process.env.NODE_ENV !== "production") {
427 console.error("Error handled by React Router default ErrorBoundary:", error);
428 devInfo = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("p", null, "\uD83D\uDCBF Hey developer \uD83D\uDC4B"), /*#__PURE__*/React.createElement("p", null, "You can provide a way better UX than this when your app throws errors by providing your own ", /*#__PURE__*/React.createElement("code", {
429 style: codeStyles
430 }, "ErrorBoundary"), " or", " ", /*#__PURE__*/React.createElement("code", {
431 style: codeStyles
432 }, "errorElement"), " prop on your route."));
433 }
434 return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("h2", null, "Unexpected Application Error!"), /*#__PURE__*/React.createElement("h3", {
435 style: {
436 fontStyle: "italic"
437 }
438 }, message), stack ? /*#__PURE__*/React.createElement("pre", {
439 style: preStyles
440 }, stack) : null, devInfo);
441}
442const defaultErrorElement = /*#__PURE__*/React.createElement(DefaultErrorComponent, null);
443class RenderErrorBoundary extends React.Component {
444 constructor(props) {
445 super(props);
446 this.state = {
447 location: props.location,
448 revalidation: props.revalidation,
449 error: props.error
450 };
451 }
452 static getDerivedStateFromError(error) {
453 return {
454 error: error
455 };
456 }
457 static getDerivedStateFromProps(props, state) {
458 // When we get into an error state, the user will likely click "back" to the
459 // previous page that didn't have an error. Because this wraps the entire
460 // application, that will have no effect--the error page continues to display.
461 // This gives us a mechanism to recover from the error when the location changes.
462 //
463 // Whether we're in an error state or not, we update the location in state
464 // so that when we are in an error state, it gets reset when a new location
465 // comes in and the user recovers from the error.
466 if (state.location !== props.location || state.revalidation !== "idle" && props.revalidation === "idle") {
467 return {
468 error: props.error,
469 location: props.location,
470 revalidation: props.revalidation
471 };
472 }
473
474 // If we're not changing locations, preserve the location but still surface
475 // any new errors that may come through. We retain the existing error, we do
476 // this because the error provided from the app state may be cleared without
477 // the location changing.
478 return {
479 error: props.error !== undefined ? props.error : state.error,
480 location: state.location,
481 revalidation: props.revalidation || state.revalidation
482 };
483 }
484 componentDidCatch(error, errorInfo) {
485 console.error("React Router caught the following error during render", error, errorInfo);
486 }
487 render() {
488 return this.state.error !== undefined ? /*#__PURE__*/React.createElement(RouteContext.Provider, {
489 value: this.props.routeContext
490 }, /*#__PURE__*/React.createElement(RouteErrorContext.Provider, {
491 value: this.state.error,
492 children: this.props.component
493 })) : this.props.children;
494 }
495}
496function RenderedRoute(_ref) {
497 let {
498 routeContext,
499 match,
500 children
501 } = _ref;
502 let dataRouterContext = React.useContext(DataRouterContext);
503
504 // Track how deep we got in our render pass to emulate SSR componentDidCatch
505 // in a DataStaticRouter
506 if (dataRouterContext && dataRouterContext.static && dataRouterContext.staticContext && (match.route.errorElement || match.route.ErrorBoundary)) {
507 dataRouterContext.staticContext._deepestRenderedBoundaryId = match.route.id;
508 }
509 return /*#__PURE__*/React.createElement(RouteContext.Provider, {
510 value: routeContext
511 }, children);
512}
513function _renderMatches(matches, parentMatches, dataRouterState, future) {
514 var _dataRouterState2;
515 if (parentMatches === void 0) {
516 parentMatches = [];
517 }
518 if (dataRouterState === void 0) {
519 dataRouterState = null;
520 }
521 if (future === void 0) {
522 future = null;
523 }
524 if (matches == null) {
525 var _dataRouterState;
526 if ((_dataRouterState = dataRouterState) != null && _dataRouterState.errors) {
527 // Don't bail if we have data router errors so we can render them in the
528 // boundary. Use the pre-matched (or shimmed) matches
529 matches = dataRouterState.matches;
530 } else {
531 return null;
532 }
533 }
534 let renderedMatches = matches;
535
536 // If we have data errors, trim matches to the highest error boundary
537 let errors = (_dataRouterState2 = dataRouterState) == null ? void 0 : _dataRouterState2.errors;
538 if (errors != null) {
539 let errorIndex = renderedMatches.findIndex(m => m.route.id && (errors == null ? void 0 : errors[m.route.id]));
540 !(errorIndex >= 0) ? process.env.NODE_ENV !== "production" ? UNSAFE_invariant(false, "Could not find a matching route for errors on route IDs: " + Object.keys(errors).join(",")) : UNSAFE_invariant(false) : void 0;
541 renderedMatches = renderedMatches.slice(0, Math.min(renderedMatches.length, errorIndex + 1));
542 }
543
544 // If we're in a partial hydration mode, detect if we need to render down to
545 // a given HydrateFallback while we load the rest of the hydration data
546 let renderFallback = false;
547 let fallbackIndex = -1;
548 if (dataRouterState && future && future.v7_partialHydration) {
549 for (let i = 0; i < renderedMatches.length; i++) {
550 let match = renderedMatches[i];
551 // Track the deepest fallback up until the first route without data
552 if (match.route.HydrateFallback || match.route.hydrateFallbackElement) {
553 fallbackIndex = i;
554 }
555 if (match.route.id) {
556 let {
557 loaderData,
558 errors
559 } = dataRouterState;
560 let needsToRunLoader = match.route.loader && loaderData[match.route.id] === undefined && (!errors || errors[match.route.id] === undefined);
561 if (match.route.lazy || needsToRunLoader) {
562 // We found the first route that's not ready to render (waiting on
563 // lazy, or has a loader that hasn't run yet). Flag that we need to
564 // render a fallback and render up until the appropriate fallback
565 renderFallback = true;
566 if (fallbackIndex >= 0) {
567 renderedMatches = renderedMatches.slice(0, fallbackIndex + 1);
568 } else {
569 renderedMatches = [renderedMatches[0]];
570 }
571 break;
572 }
573 }
574 }
575 }
576 return renderedMatches.reduceRight((outlet, match, index) => {
577 // Only data routers handle errors/fallbacks
578 let error;
579 let shouldRenderHydrateFallback = false;
580 let errorElement = null;
581 let hydrateFallbackElement = null;
582 if (dataRouterState) {
583 error = errors && match.route.id ? errors[match.route.id] : undefined;
584 errorElement = match.route.errorElement || defaultErrorElement;
585 if (renderFallback) {
586 if (fallbackIndex < 0 && index === 0) {
587 warningOnce("route-fallback", false, "No `HydrateFallback` element provided to render during initial hydration");
588 shouldRenderHydrateFallback = true;
589 hydrateFallbackElement = null;
590 } else if (fallbackIndex === index) {
591 shouldRenderHydrateFallback = true;
592 hydrateFallbackElement = match.route.hydrateFallbackElement || null;
593 }
594 }
595 }
596 let matches = parentMatches.concat(renderedMatches.slice(0, index + 1));
597 let getChildren = () => {
598 let children;
599 if (error) {
600 children = errorElement;
601 } else if (shouldRenderHydrateFallback) {
602 children = hydrateFallbackElement;
603 } else if (match.route.Component) {
604 // Note: This is a de-optimized path since React won't re-use the
605 // ReactElement since it's identity changes with each new
606 // React.createElement call. We keep this so folks can use
607 // `<Route Component={...}>` in `<Routes>` but generally `Component`
608 // usage is only advised in `RouterProvider` when we can convert it to
609 // `element` ahead of time.
610 children = /*#__PURE__*/React.createElement(match.route.Component, null);
611 } else if (match.route.element) {
612 children = match.route.element;
613 } else {
614 children = outlet;
615 }
616 return /*#__PURE__*/React.createElement(RenderedRoute, {
617 match: match,
618 routeContext: {
619 outlet,
620 matches,
621 isDataRoute: dataRouterState != null
622 },
623 children: children
624 });
625 };
626 // Only wrap in an error boundary within data router usages when we have an
627 // ErrorBoundary/errorElement on this route. Otherwise let it bubble up to
628 // an ancestor ErrorBoundary/errorElement
629 return dataRouterState && (match.route.ErrorBoundary || match.route.errorElement || index === 0) ? /*#__PURE__*/React.createElement(RenderErrorBoundary, {
630 location: dataRouterState.location,
631 revalidation: dataRouterState.revalidation,
632 component: errorElement,
633 error: error,
634 children: getChildren(),
635 routeContext: {
636 outlet: null,
637 matches,
638 isDataRoute: true
639 }
640 }) : getChildren();
641 }, null);
642}
643var DataRouterHook = /*#__PURE__*/function (DataRouterHook) {
644 DataRouterHook["UseBlocker"] = "useBlocker";
645 DataRouterHook["UseRevalidator"] = "useRevalidator";
646 DataRouterHook["UseNavigateStable"] = "useNavigate";
647 return DataRouterHook;
648}(DataRouterHook || {});
649var DataRouterStateHook = /*#__PURE__*/function (DataRouterStateHook) {
650 DataRouterStateHook["UseBlocker"] = "useBlocker";
651 DataRouterStateHook["UseLoaderData"] = "useLoaderData";
652 DataRouterStateHook["UseActionData"] = "useActionData";
653 DataRouterStateHook["UseRouteError"] = "useRouteError";
654 DataRouterStateHook["UseNavigation"] = "useNavigation";
655 DataRouterStateHook["UseRouteLoaderData"] = "useRouteLoaderData";
656 DataRouterStateHook["UseMatches"] = "useMatches";
657 DataRouterStateHook["UseRevalidator"] = "useRevalidator";
658 DataRouterStateHook["UseNavigateStable"] = "useNavigate";
659 DataRouterStateHook["UseRouteId"] = "useRouteId";
660 return DataRouterStateHook;
661}(DataRouterStateHook || {});
662function getDataRouterConsoleError(hookName) {
663 return hookName + " must be used within a data router. See https://reactrouter.com/routers/picking-a-router.";
664}
665function useDataRouterContext(hookName) {
666 let ctx = React.useContext(DataRouterContext);
667 !ctx ? process.env.NODE_ENV !== "production" ? UNSAFE_invariant(false, getDataRouterConsoleError(hookName)) : UNSAFE_invariant(false) : void 0;
668 return ctx;
669}
670function useDataRouterState(hookName) {
671 let state = React.useContext(DataRouterStateContext);
672 !state ? process.env.NODE_ENV !== "production" ? UNSAFE_invariant(false, getDataRouterConsoleError(hookName)) : UNSAFE_invariant(false) : void 0;
673 return state;
674}
675function useRouteContext(hookName) {
676 let route = React.useContext(RouteContext);
677 !route ? process.env.NODE_ENV !== "production" ? UNSAFE_invariant(false, getDataRouterConsoleError(hookName)) : UNSAFE_invariant(false) : void 0;
678 return route;
679}
680
681// Internal version with hookName-aware debugging
682function useCurrentRouteId(hookName) {
683 let route = useRouteContext(hookName);
684 let thisRoute = route.matches[route.matches.length - 1];
685 !thisRoute.route.id ? process.env.NODE_ENV !== "production" ? UNSAFE_invariant(false, hookName + " can only be used on routes that contain a unique \"id\"") : UNSAFE_invariant(false) : void 0;
686 return thisRoute.route.id;
687}
688
689/**
690 * Returns the ID for the nearest contextual route
691 */
692function useRouteId() {
693 return useCurrentRouteId(DataRouterStateHook.UseRouteId);
694}
695
696/**
697 * Returns the current navigation, defaulting to an "idle" navigation when
698 * no navigation is in progress
699 */
700function useNavigation() {
701 let state = useDataRouterState(DataRouterStateHook.UseNavigation);
702 return state.navigation;
703}
704
705/**
706 * Returns a revalidate function for manually triggering revalidation, as well
707 * as the current state of any manual revalidations
708 */
709function useRevalidator() {
710 let dataRouterContext = useDataRouterContext(DataRouterHook.UseRevalidator);
711 let state = useDataRouterState(DataRouterStateHook.UseRevalidator);
712 return React.useMemo(() => ({
713 revalidate: dataRouterContext.router.revalidate,
714 state: state.revalidation
715 }), [dataRouterContext.router.revalidate, state.revalidation]);
716}
717
718/**
719 * Returns the active route matches, useful for accessing loaderData for
720 * parent/child routes or the route "handle" property
721 */
722function useMatches() {
723 let {
724 matches,
725 loaderData
726 } = useDataRouterState(DataRouterStateHook.UseMatches);
727 return React.useMemo(() => matches.map(m => UNSAFE_convertRouteMatchToUiMatch(m, loaderData)), [matches, loaderData]);
728}
729
730/**
731 * Returns the loader data for the nearest ancestor Route loader
732 */
733function useLoaderData() {
734 let state = useDataRouterState(DataRouterStateHook.UseLoaderData);
735 let routeId = useCurrentRouteId(DataRouterStateHook.UseLoaderData);
736 if (state.errors && state.errors[routeId] != null) {
737 console.error("You cannot `useLoaderData` in an errorElement (routeId: " + routeId + ")");
738 return undefined;
739 }
740 return state.loaderData[routeId];
741}
742
743/**
744 * Returns the loaderData for the given routeId
745 */
746function useRouteLoaderData(routeId) {
747 let state = useDataRouterState(DataRouterStateHook.UseRouteLoaderData);
748 return state.loaderData[routeId];
749}
750
751/**
752 * Returns the action data for the nearest ancestor Route action
753 */
754function useActionData() {
755 let state = useDataRouterState(DataRouterStateHook.UseActionData);
756 let routeId = useCurrentRouteId(DataRouterStateHook.UseLoaderData);
757 return state.actionData ? state.actionData[routeId] : undefined;
758}
759
760/**
761 * Returns the nearest ancestor Route error, which could be a loader/action
762 * error or a render error. This is intended to be called from your
763 * ErrorBoundary/errorElement to display a proper error message.
764 */
765function useRouteError() {
766 var _state$errors;
767 let error = React.useContext(RouteErrorContext);
768 let state = useDataRouterState(DataRouterStateHook.UseRouteError);
769 let routeId = useCurrentRouteId(DataRouterStateHook.UseRouteError);
770
771 // If this was a render error, we put it in a RouteError context inside
772 // of RenderErrorBoundary
773 if (error !== undefined) {
774 return error;
775 }
776
777 // Otherwise look for errors from our data router state
778 return (_state$errors = state.errors) == null ? void 0 : _state$errors[routeId];
779}
780
781/**
782 * Returns the happy-path data from the nearest ancestor `<Await />` value
783 */
784function useAsyncValue() {
785 let value = React.useContext(AwaitContext);
786 return value == null ? void 0 : value._data;
787}
788
789/**
790 * Returns the error from the nearest ancestor `<Await />` value
791 */
792function useAsyncError() {
793 let value = React.useContext(AwaitContext);
794 return value == null ? void 0 : value._error;
795}
796let blockerId = 0;
797
798/**
799 * Allow the application to block navigations within the SPA and present the
800 * user a confirmation dialog to confirm the navigation. Mostly used to avoid
801 * using half-filled form data. This does not handle hard-reloads or
802 * cross-origin navigations.
803 */
804function useBlocker(shouldBlock) {
805 let {
806 router,
807 basename
808 } = useDataRouterContext(DataRouterHook.UseBlocker);
809 let state = useDataRouterState(DataRouterStateHook.UseBlocker);
810 let [blockerKey, setBlockerKey] = React.useState("");
811 let blockerFunction = React.useCallback(arg => {
812 if (typeof shouldBlock !== "function") {
813 return !!shouldBlock;
814 }
815 if (basename === "/") {
816 return shouldBlock(arg);
817 }
818
819 // If they provided us a function and we've got an active basename, strip
820 // it from the locations we expose to the user to match the behavior of
821 // useLocation
822 let {
823 currentLocation,
824 nextLocation,
825 historyAction
826 } = arg;
827 return shouldBlock({
828 currentLocation: _extends({}, currentLocation, {
829 pathname: stripBasename(currentLocation.pathname, basename) || currentLocation.pathname
830 }),
831 nextLocation: _extends({}, nextLocation, {
832 pathname: stripBasename(nextLocation.pathname, basename) || nextLocation.pathname
833 }),
834 historyAction
835 });
836 }, [basename, shouldBlock]);
837
838 // This effect is in charge of blocker key assignment and deletion (which is
839 // tightly coupled to the key)
840 React.useEffect(() => {
841 let key = String(++blockerId);
842 setBlockerKey(key);
843 return () => router.deleteBlocker(key);
844 }, [router]);
845
846 // This effect handles assigning the blockerFunction. This is to handle
847 // unstable blocker function identities, and happens only after the prior
848 // effect so we don't get an orphaned blockerFunction in the router with a
849 // key of "". Until then we just have the IDLE_BLOCKER.
850 React.useEffect(() => {
851 if (blockerKey !== "") {
852 router.getBlocker(blockerKey, blockerFunction);
853 }
854 }, [router, blockerKey, blockerFunction]);
855
856 // Prefer the blocker from `state` not `router.state` since DataRouterContext
857 // is memoized so this ensures we update on blocker state updates
858 return blockerKey && state.blockers.has(blockerKey) ? state.blockers.get(blockerKey) : IDLE_BLOCKER;
859}
860
861/**
862 * Stable version of useNavigate that is used when we are in the context of
863 * a RouterProvider.
864 */
865function useNavigateStable() {
866 let {
867 router
868 } = useDataRouterContext(DataRouterHook.UseNavigateStable);
869 let id = useCurrentRouteId(DataRouterStateHook.UseNavigateStable);
870 let activeRef = React.useRef(false);
871 useIsomorphicLayoutEffect(() => {
872 activeRef.current = true;
873 });
874 let navigate = React.useCallback(function (to, options) {
875 if (options === void 0) {
876 options = {};
877 }
878 process.env.NODE_ENV !== "production" ? UNSAFE_warning(activeRef.current, navigateEffectWarning) : void 0;
879
880 // Short circuit here since if this happens on first render the navigate
881 // is useless because we haven't wired up our router subscriber yet
882 if (!activeRef.current) return;
883 if (typeof to === "number") {
884 router.navigate(to);
885 } else {
886 router.navigate(to, _extends({
887 fromRouteId: id
888 }, options));
889 }
890 }, [router, id]);
891 return navigate;
892}
893const alreadyWarned = {};
894function warningOnce(key, cond, message) {
895 if (!cond && !alreadyWarned[key]) {
896 alreadyWarned[key] = true;
897 process.env.NODE_ENV !== "production" ? UNSAFE_warning(false, message) : void 0;
898 }
899}
900
901/**
902 Webpack + React 17 fails to compile on any of the following because webpack
903 complains that `startTransition` doesn't exist in `React`:
904 * import { startTransition } from "react"
905 * import * as React from from "react";
906 "startTransition" in React ? React.startTransition(() => setState()) : setState()
907 * import * as React from from "react";
908 "startTransition" in React ? React["startTransition"](() => setState()) : setState()
909
910 Moving it to a constant such as the following solves the Webpack/React 17 issue:
911 * import * as React from from "react";
912 const START_TRANSITION = "startTransition";
913 START_TRANSITION in React ? React[START_TRANSITION](() => setState()) : setState()
914
915 However, that introduces webpack/terser minification issues in production builds
916 in React 18 where minification/obfuscation ends up removing the call of
917 React.startTransition entirely from the first half of the ternary. Grabbing
918 this exported reference once up front resolves that issue.
919
920 See https://github.com/remix-run/react-router/issues/10579
921*/
922const START_TRANSITION = "startTransition";
923const startTransitionImpl = React[START_TRANSITION];
924
925/**
926 * Given a Remix Router instance, render the appropriate UI
927 */
928function RouterProvider(_ref) {
929 let {
930 fallbackElement,
931 router,
932 future
933 } = _ref;
934 let [state, setStateImpl] = React.useState(router.state);
935 let {
936 v7_startTransition
937 } = future || {};
938 let setState = React.useCallback(newState => {
939 if (v7_startTransition && startTransitionImpl) {
940 startTransitionImpl(() => setStateImpl(newState));
941 } else {
942 setStateImpl(newState);
943 }
944 }, [setStateImpl, v7_startTransition]);
945
946 // Need to use a layout effect here so we are subscribed early enough to
947 // pick up on any render-driven redirects/navigations (useEffect/<Navigate>)
948 React.useLayoutEffect(() => router.subscribe(setState), [router, setState]);
949 React.useEffect(() => {
950 process.env.NODE_ENV !== "production" ? UNSAFE_warning(fallbackElement == null || !router.future.v7_partialHydration, "`<RouterProvider fallbackElement>` is deprecated when using " + "`v7_partialHydration`, use a `HydrateFallback` component instead") : void 0;
951 // Only log this once on initial mount
952 // eslint-disable-next-line react-hooks/exhaustive-deps
953 }, []);
954 let navigator = React.useMemo(() => {
955 return {
956 createHref: router.createHref,
957 encodeLocation: router.encodeLocation,
958 go: n => router.navigate(n),
959 push: (to, state, opts) => router.navigate(to, {
960 state,
961 preventScrollReset: opts == null ? void 0 : opts.preventScrollReset
962 }),
963 replace: (to, state, opts) => router.navigate(to, {
964 replace: true,
965 state,
966 preventScrollReset: opts == null ? void 0 : opts.preventScrollReset
967 })
968 };
969 }, [router]);
970 let basename = router.basename || "/";
971 let dataRouterContext = React.useMemo(() => ({
972 router,
973 navigator,
974 static: false,
975 basename
976 }), [router, navigator, basename]);
977
978 // The fragment and {null} here are important! We need them to keep React 18's
979 // useId happy when we are server-rendering since we may have a <script> here
980 // containing the hydrated server-side staticContext (from StaticRouterProvider).
981 // useId relies on the component tree structure to generate deterministic id's
982 // so we need to ensure it remains the same on the client even though
983 // we don't need the <script> tag
984 return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(DataRouterContext.Provider, {
985 value: dataRouterContext
986 }, /*#__PURE__*/React.createElement(DataRouterStateContext.Provider, {
987 value: state
988 }, /*#__PURE__*/React.createElement(Router, {
989 basename: basename,
990 location: state.location,
991 navigationType: state.historyAction,
992 navigator: navigator,
993 future: {
994 v7_relativeSplatPath: router.future.v7_relativeSplatPath
995 }
996 }, state.initialized || router.future.v7_partialHydration ? /*#__PURE__*/React.createElement(DataRoutes, {
997 routes: router.routes,
998 future: router.future,
999 state: state
1000 }) : fallbackElement))), null);
1001}
1002function DataRoutes(_ref2) {
1003 let {
1004 routes,
1005 future,
1006 state
1007 } = _ref2;
1008 return useRoutesImpl(routes, undefined, state, future);
1009}
1010/**
1011 * A `<Router>` that stores all entries in memory.
1012 *
1013 * @see https://reactrouter.com/router-components/memory-router
1014 */
1015function MemoryRouter(_ref3) {
1016 let {
1017 basename,
1018 children,
1019 initialEntries,
1020 initialIndex,
1021 future
1022 } = _ref3;
1023 let historyRef = React.useRef();
1024 if (historyRef.current == null) {
1025 historyRef.current = createMemoryHistory({
1026 initialEntries,
1027 initialIndex,
1028 v5Compat: true
1029 });
1030 }
1031 let history = historyRef.current;
1032 let [state, setStateImpl] = React.useState({
1033 action: history.action,
1034 location: history.location
1035 });
1036 let {
1037 v7_startTransition
1038 } = future || {};
1039 let setState = React.useCallback(newState => {
1040 v7_startTransition && startTransitionImpl ? startTransitionImpl(() => setStateImpl(newState)) : setStateImpl(newState);
1041 }, [setStateImpl, v7_startTransition]);
1042 React.useLayoutEffect(() => history.listen(setState), [history, setState]);
1043 return /*#__PURE__*/React.createElement(Router, {
1044 basename: basename,
1045 children: children,
1046 location: state.location,
1047 navigationType: state.action,
1048 navigator: history,
1049 future: future
1050 });
1051}
1052/**
1053 * Changes the current location.
1054 *
1055 * Note: This API is mostly useful in React.Component subclasses that are not
1056 * able to use hooks. In functional components, we recommend you use the
1057 * `useNavigate` hook instead.
1058 *
1059 * @see https://reactrouter.com/components/navigate
1060 */
1061function Navigate(_ref4) {
1062 let {
1063 to,
1064 replace,
1065 state,
1066 relative
1067 } = _ref4;
1068 !useInRouterContext() ? process.env.NODE_ENV !== "production" ? UNSAFE_invariant(false, // TODO: This error is probably because they somehow have 2 versions of
1069 // the router loaded. We can help them understand how to avoid that.
1070 "<Navigate> may be used only in the context of a <Router> component.") : UNSAFE_invariant(false) : void 0;
1071 let {
1072 future,
1073 static: isStatic
1074 } = React.useContext(NavigationContext);
1075 process.env.NODE_ENV !== "production" ? UNSAFE_warning(!isStatic, "<Navigate> must not be used on the initial render in a <StaticRouter>. " + "This is a no-op, but you should modify your code so the <Navigate> is " + "only ever rendered in response to some user interaction or state change.") : void 0;
1076 let {
1077 matches
1078 } = React.useContext(RouteContext);
1079 let {
1080 pathname: locationPathname
1081 } = useLocation();
1082 let navigate = useNavigate();
1083
1084 // Resolve the path outside of the effect so that when effects run twice in
1085 // StrictMode they navigate to the same place
1086 let path = resolveTo(to, UNSAFE_getResolveToMatches(matches, future.v7_relativeSplatPath), locationPathname, relative === "path");
1087 let jsonPath = JSON.stringify(path);
1088 React.useEffect(() => navigate(JSON.parse(jsonPath), {
1089 replace,
1090 state,
1091 relative
1092 }), [navigate, jsonPath, relative, replace, state]);
1093 return null;
1094}
1095/**
1096 * Renders the child route's element, if there is one.
1097 *
1098 * @see https://reactrouter.com/components/outlet
1099 */
1100function Outlet(props) {
1101 return useOutlet(props.context);
1102}
1103/**
1104 * Declares an element that should be rendered at a certain URL path.
1105 *
1106 * @see https://reactrouter.com/components/route
1107 */
1108function Route(_props) {
1109 process.env.NODE_ENV !== "production" ? UNSAFE_invariant(false, "A <Route> is only ever to be used as the child of <Routes> element, " + "never rendered directly. Please wrap your <Route> in a <Routes>.") : UNSAFE_invariant(false) ;
1110}
1111/**
1112 * Provides location context for the rest of the app.
1113 *
1114 * Note: You usually won't render a `<Router>` directly. Instead, you'll render a
1115 * router that is more specific to your environment such as a `<BrowserRouter>`
1116 * in web browsers or a `<StaticRouter>` for server rendering.
1117 *
1118 * @see https://reactrouter.com/router-components/router
1119 */
1120function Router(_ref5) {
1121 let {
1122 basename: basenameProp = "/",
1123 children = null,
1124 location: locationProp,
1125 navigationType = Action.Pop,
1126 navigator,
1127 static: staticProp = false,
1128 future
1129 } = _ref5;
1130 !!useInRouterContext() ? process.env.NODE_ENV !== "production" ? UNSAFE_invariant(false, "You cannot render a <Router> inside another <Router>." + " You should never have more than one in your app.") : UNSAFE_invariant(false) : void 0;
1131
1132 // Preserve trailing slashes on basename, so we can let the user control
1133 // the enforcement of trailing slashes throughout the app
1134 let basename = basenameProp.replace(/^\/*/, "/");
1135 let navigationContext = React.useMemo(() => ({
1136 basename,
1137 navigator,
1138 static: staticProp,
1139 future: _extends({
1140 v7_relativeSplatPath: false
1141 }, future)
1142 }), [basename, future, navigator, staticProp]);
1143 if (typeof locationProp === "string") {
1144 locationProp = parsePath(locationProp);
1145 }
1146 let {
1147 pathname = "/",
1148 search = "",
1149 hash = "",
1150 state = null,
1151 key = "default"
1152 } = locationProp;
1153 let locationContext = React.useMemo(() => {
1154 let trailingPathname = stripBasename(pathname, basename);
1155 if (trailingPathname == null) {
1156 return null;
1157 }
1158 return {
1159 location: {
1160 pathname: trailingPathname,
1161 search,
1162 hash,
1163 state,
1164 key
1165 },
1166 navigationType
1167 };
1168 }, [basename, pathname, search, hash, state, key, navigationType]);
1169 process.env.NODE_ENV !== "production" ? UNSAFE_warning(locationContext != null, "<Router basename=\"" + basename + "\"> is not able to match the URL " + ("\"" + pathname + search + hash + "\" because it does not start with the ") + "basename, so the <Router> won't render anything.") : void 0;
1170 if (locationContext == null) {
1171 return null;
1172 }
1173 return /*#__PURE__*/React.createElement(NavigationContext.Provider, {
1174 value: navigationContext
1175 }, /*#__PURE__*/React.createElement(LocationContext.Provider, {
1176 children: children,
1177 value: locationContext
1178 }));
1179}
1180/**
1181 * A container for a nested tree of `<Route>` elements that renders the branch
1182 * that best matches the current location.
1183 *
1184 * @see https://reactrouter.com/components/routes
1185 */
1186function Routes(_ref6) {
1187 let {
1188 children,
1189 location
1190 } = _ref6;
1191 return useRoutes(createRoutesFromChildren(children), location);
1192}
1193/**
1194 * Component to use for rendering lazily loaded data from returning defer()
1195 * in a loader function
1196 */
1197function Await(_ref7) {
1198 let {
1199 children,
1200 errorElement,
1201 resolve
1202 } = _ref7;
1203 return /*#__PURE__*/React.createElement(AwaitErrorBoundary, {
1204 resolve: resolve,
1205 errorElement: errorElement
1206 }, /*#__PURE__*/React.createElement(ResolveAwait, null, children));
1207}
1208var AwaitRenderStatus = /*#__PURE__*/function (AwaitRenderStatus) {
1209 AwaitRenderStatus[AwaitRenderStatus["pending"] = 0] = "pending";
1210 AwaitRenderStatus[AwaitRenderStatus["success"] = 1] = "success";
1211 AwaitRenderStatus[AwaitRenderStatus["error"] = 2] = "error";
1212 return AwaitRenderStatus;
1213}(AwaitRenderStatus || {});
1214const neverSettledPromise = new Promise(() => {});
1215class AwaitErrorBoundary extends React.Component {
1216 constructor(props) {
1217 super(props);
1218 this.state = {
1219 error: null
1220 };
1221 }
1222 static getDerivedStateFromError(error) {
1223 return {
1224 error
1225 };
1226 }
1227 componentDidCatch(error, errorInfo) {
1228 console.error("<Await> caught the following error during render", error, errorInfo);
1229 }
1230 render() {
1231 let {
1232 children,
1233 errorElement,
1234 resolve
1235 } = this.props;
1236 let promise = null;
1237 let status = AwaitRenderStatus.pending;
1238 if (!(resolve instanceof Promise)) {
1239 // Didn't get a promise - provide as a resolved promise
1240 status = AwaitRenderStatus.success;
1241 promise = Promise.resolve();
1242 Object.defineProperty(promise, "_tracked", {
1243 get: () => true
1244 });
1245 Object.defineProperty(promise, "_data", {
1246 get: () => resolve
1247 });
1248 } else if (this.state.error) {
1249 // Caught a render error, provide it as a rejected promise
1250 status = AwaitRenderStatus.error;
1251 let renderError = this.state.error;
1252 promise = Promise.reject().catch(() => {}); // Avoid unhandled rejection warnings
1253 Object.defineProperty(promise, "_tracked", {
1254 get: () => true
1255 });
1256 Object.defineProperty(promise, "_error", {
1257 get: () => renderError
1258 });
1259 } else if (resolve._tracked) {
1260 // Already tracked promise - check contents
1261 promise = resolve;
1262 status = promise._error !== undefined ? AwaitRenderStatus.error : promise._data !== undefined ? AwaitRenderStatus.success : AwaitRenderStatus.pending;
1263 } else {
1264 // Raw (untracked) promise - track it
1265 status = AwaitRenderStatus.pending;
1266 Object.defineProperty(resolve, "_tracked", {
1267 get: () => true
1268 });
1269 promise = resolve.then(data => Object.defineProperty(resolve, "_data", {
1270 get: () => data
1271 }), error => Object.defineProperty(resolve, "_error", {
1272 get: () => error
1273 }));
1274 }
1275 if (status === AwaitRenderStatus.error && promise._error instanceof AbortedDeferredError) {
1276 // Freeze the UI by throwing a never resolved promise
1277 throw neverSettledPromise;
1278 }
1279 if (status === AwaitRenderStatus.error && !errorElement) {
1280 // No errorElement, throw to the nearest route-level error boundary
1281 throw promise._error;
1282 }
1283 if (status === AwaitRenderStatus.error) {
1284 // Render via our errorElement
1285 return /*#__PURE__*/React.createElement(AwaitContext.Provider, {
1286 value: promise,
1287 children: errorElement
1288 });
1289 }
1290 if (status === AwaitRenderStatus.success) {
1291 // Render children with resolved value
1292 return /*#__PURE__*/React.createElement(AwaitContext.Provider, {
1293 value: promise,
1294 children: children
1295 });
1296 }
1297
1298 // Throw to the suspense boundary
1299 throw promise;
1300 }
1301}
1302
1303/**
1304 * @private
1305 * Indirection to leverage useAsyncValue for a render-prop API on `<Await>`
1306 */
1307function ResolveAwait(_ref8) {
1308 let {
1309 children
1310 } = _ref8;
1311 let data = useAsyncValue();
1312 let toRender = typeof children === "function" ? children(data) : children;
1313 return /*#__PURE__*/React.createElement(React.Fragment, null, toRender);
1314}
1315
1316///////////////////////////////////////////////////////////////////////////////
1317// UTILS
1318///////////////////////////////////////////////////////////////////////////////
1319
1320/**
1321 * Creates a route config from a React "children" object, which is usually
1322 * either a `<Route>` element or an array of them. Used internally by
1323 * `<Routes>` to create a route config from its children.
1324 *
1325 * @see https://reactrouter.com/utils/create-routes-from-children
1326 */
1327function createRoutesFromChildren(children, parentPath) {
1328 if (parentPath === void 0) {
1329 parentPath = [];
1330 }
1331 let routes = [];
1332 React.Children.forEach(children, (element, index) => {
1333 if (! /*#__PURE__*/React.isValidElement(element)) {
1334 // Ignore non-elements. This allows people to more easily inline
1335 // conditionals in their route config.
1336 return;
1337 }
1338 let treePath = [...parentPath, index];
1339 if (element.type === React.Fragment) {
1340 // Transparently support React.Fragment and its children.
1341 routes.push.apply(routes, createRoutesFromChildren(element.props.children, treePath));
1342 return;
1343 }
1344 !(element.type === Route) ? process.env.NODE_ENV !== "production" ? UNSAFE_invariant(false, "[" + (typeof element.type === "string" ? element.type : element.type.name) + "] is not a <Route> component. All component children of <Routes> must be a <Route> or <React.Fragment>") : UNSAFE_invariant(false) : void 0;
1345 !(!element.props.index || !element.props.children) ? process.env.NODE_ENV !== "production" ? UNSAFE_invariant(false, "An index route cannot have child routes.") : UNSAFE_invariant(false) : void 0;
1346 let route = {
1347 id: element.props.id || treePath.join("-"),
1348 caseSensitive: element.props.caseSensitive,
1349 element: element.props.element,
1350 Component: element.props.Component,
1351 index: element.props.index,
1352 path: element.props.path,
1353 loader: element.props.loader,
1354 action: element.props.action,
1355 errorElement: element.props.errorElement,
1356 ErrorBoundary: element.props.ErrorBoundary,
1357 hasErrorBoundary: element.props.ErrorBoundary != null || element.props.errorElement != null,
1358 shouldRevalidate: element.props.shouldRevalidate,
1359 handle: element.props.handle,
1360 lazy: element.props.lazy
1361 };
1362 if (element.props.children) {
1363 route.children = createRoutesFromChildren(element.props.children, treePath);
1364 }
1365 routes.push(route);
1366 });
1367 return routes;
1368}
1369
1370/**
1371 * Renders the result of `matchRoutes()` into a React element.
1372 */
1373function renderMatches(matches) {
1374 return _renderMatches(matches);
1375}
1376
1377function mapRouteProperties(route) {
1378 let updates = {
1379 // Note: this check also occurs in createRoutesFromChildren so update
1380 // there if you change this -- please and thank you!
1381 hasErrorBoundary: route.ErrorBoundary != null || route.errorElement != null
1382 };
1383 if (route.Component) {
1384 if (process.env.NODE_ENV !== "production") {
1385 if (route.element) {
1386 process.env.NODE_ENV !== "production" ? UNSAFE_warning(false, "You should not include both `Component` and `element` on your route - " + "`Component` will be used.") : void 0;
1387 }
1388 }
1389 Object.assign(updates, {
1390 element: /*#__PURE__*/React.createElement(route.Component),
1391 Component: undefined
1392 });
1393 }
1394 if (route.HydrateFallback) {
1395 if (process.env.NODE_ENV !== "production") {
1396 if (route.hydrateFallbackElement) {
1397 process.env.NODE_ENV !== "production" ? UNSAFE_warning(false, "You should not include both `HydrateFallback` and `hydrateFallbackElement` on your route - " + "`HydrateFallback` will be used.") : void 0;
1398 }
1399 }
1400 Object.assign(updates, {
1401 hydrateFallbackElement: /*#__PURE__*/React.createElement(route.HydrateFallback),
1402 HydrateFallback: undefined
1403 });
1404 }
1405 if (route.ErrorBoundary) {
1406 if (process.env.NODE_ENV !== "production") {
1407 if (route.errorElement) {
1408 process.env.NODE_ENV !== "production" ? UNSAFE_warning(false, "You should not include both `ErrorBoundary` and `errorElement` on your route - " + "`ErrorBoundary` will be used.") : void 0;
1409 }
1410 }
1411 Object.assign(updates, {
1412 errorElement: /*#__PURE__*/React.createElement(route.ErrorBoundary),
1413 ErrorBoundary: undefined
1414 });
1415 }
1416 return updates;
1417}
1418function createMemoryRouter(routes, opts) {
1419 return createRouter({
1420 basename: opts == null ? void 0 : opts.basename,
1421 future: _extends({}, opts == null ? void 0 : opts.future, {
1422 v7_prependBasename: true
1423 }),
1424 history: createMemoryHistory({
1425 initialEntries: opts == null ? void 0 : opts.initialEntries,
1426 initialIndex: opts == null ? void 0 : opts.initialIndex
1427 }),
1428 hydrationData: opts == null ? void 0 : opts.hydrationData,
1429 routes,
1430 mapRouteProperties
1431 }).initialize();
1432}
1433
1434export { Await, MemoryRouter, Navigate, Outlet, Route, Router, RouterProvider, Routes, DataRouterContext as UNSAFE_DataRouterContext, DataRouterStateContext as UNSAFE_DataRouterStateContext, LocationContext as UNSAFE_LocationContext, NavigationContext as UNSAFE_NavigationContext, RouteContext as UNSAFE_RouteContext, mapRouteProperties as UNSAFE_mapRouteProperties, useRouteId as UNSAFE_useRouteId, useRoutesImpl as UNSAFE_useRoutesImpl, createMemoryRouter, createRoutesFromChildren, createRoutesFromChildren as createRoutesFromElements, renderMatches, useActionData, useAsyncError, useAsyncValue, useBlocker, useHref, useInRouterContext, useLoaderData, useLocation, useMatch, useMatches, useNavigate, useNavigation, useNavigationType, useOutlet, useOutletContext, useParams, useResolvedPath, useRevalidator, useRouteError, useRouteLoaderData, useRoutes };
1435//# sourceMappingURL=index.js.map