UNPKG

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