| 1 |  | 
| 2 |  | 
| 3 |  | 
| 4 |  | 
| 5 |  | 
| 6 |  | 
| 7 |  | 
| 8 |  | 
| 9 |  | 
| 10 | 
 | 
| 11 | import * as React from 'react';
 | 
| 12 | import { UNSAFE_invariant, joinPaths, matchPath, UNSAFE_decodePath, UNSAFE_getResolveToMatches, UNSAFE_warning, resolveTo, parsePath, matchRoutes, Action, UNSAFE_convertRouteMatchToUiMatch, stripBasename, IDLE_BLOCKER, isRouteErrorResponse, createMemoryHistory, AbortedDeferredError, createRouter } from '@remix-run/router';
 | 
| 13 | export { AbortedDeferredError, Action as NavigationType, createPath, defer, generatePath, isRouteErrorResponse, json, matchPath, matchRoutes, parsePath, redirect, redirectDocument, replace, resolvePath } from '@remix-run/router';
 | 
| 14 | 
 | 
| 15 | const DataRouterContext = React.createContext(null);
 | 
| 16 | {
 | 
| 17 |   DataRouterContext.displayName = "DataRouter";
 | 
| 18 | }
 | 
| 19 | const DataRouterStateContext = React.createContext(null);
 | 
| 20 | {
 | 
| 21 |   DataRouterStateContext.displayName = "DataRouterState";
 | 
| 22 | }
 | 
| 23 | const AwaitContext = React.createContext(null);
 | 
| 24 | {
 | 
| 25 |   AwaitContext.displayName = "Await";
 | 
| 26 | }
 | 
| 27 | const NavigationContext = React.createContext(null);
 | 
| 28 | {
 | 
| 29 |   NavigationContext.displayName = "Navigation";
 | 
| 30 | }
 | 
| 31 | const LocationContext = React.createContext(null);
 | 
| 32 | {
 | 
| 33 |   LocationContext.displayName = "Location";
 | 
| 34 | }
 | 
| 35 | const RouteContext = React.createContext({
 | 
| 36 |   outlet: null,
 | 
| 37 |   matches: [],
 | 
| 38 |   isDataRoute: false
 | 
| 39 | });
 | 
| 40 | {
 | 
| 41 |   RouteContext.displayName = "Route";
 | 
| 42 | }
 | 
| 43 | const RouteErrorContext = React.createContext(null);
 | 
| 44 | {
 | 
| 45 |   RouteErrorContext.displayName = "RouteError";
 | 
| 46 | }
 | 
| 47 | 
 | 
| 48 |  | 
| 49 |  | 
| 50 |  | 
| 51 |  | 
| 52 |  | 
| 53 | 
 | 
| 54 | function useHref(to, {
 | 
| 55 |   relative
 | 
| 56 | } = {}) {
 | 
| 57 |   !useInRouterContext() ? UNSAFE_invariant(false,
 | 
| 58 |   
 | 
| 59 |   
 | 
| 60 |   `useHref() may be used only in the context of a <Router> component.`)  : void 0;
 | 
| 61 |   let {
 | 
| 62 |     basename,
 | 
| 63 |     navigator
 | 
| 64 |   } = React.useContext(NavigationContext);
 | 
| 65 |   let {
 | 
| 66 |     hash,
 | 
| 67 |     pathname,
 | 
| 68 |     search
 | 
| 69 |   } = useResolvedPath(to, {
 | 
| 70 |     relative
 | 
| 71 |   });
 | 
| 72 |   let joinedPathname = pathname;
 | 
| 73 |   
 | 
| 74 |   
 | 
| 75 |   
 | 
| 76 |   
 | 
| 77 |   if (basename !== "/") {
 | 
| 78 |     joinedPathname = pathname === "/" ? basename : joinPaths([basename, pathname]);
 | 
| 79 |   }
 | 
| 80 |   return navigator.createHref({
 | 
| 81 |     pathname: joinedPathname,
 | 
| 82 |     search,
 | 
| 83 |     hash
 | 
| 84 |   });
 | 
| 85 | }
 | 
| 86 |  | 
| 87 |  | 
| 88 |  | 
| 89 |  | 
| 90 | 
 | 
| 91 | function useInRouterContext() {
 | 
| 92 |   return React.useContext(LocationContext) != null;
 | 
| 93 | }
 | 
| 94 |  | 
| 95 |  | 
| 96 |  | 
| 97 |  | 
| 98 |  | 
| 99 |  | 
| 100 |  | 
| 101 |  | 
| 102 |  | 
| 103 | 
 | 
| 104 | function useLocation() {
 | 
| 105 |   !useInRouterContext() ? UNSAFE_invariant(false,
 | 
| 106 |   
 | 
| 107 |   
 | 
| 108 |   `useLocation() may be used only in the context of a <Router> component.`)  : void 0;
 | 
| 109 |   return React.useContext(LocationContext).location;
 | 
| 110 | }
 | 
| 111 |  | 
| 112 |  | 
| 113 |  | 
| 114 |  | 
| 115 |  | 
| 116 | 
 | 
| 117 | function useNavigationType() {
 | 
| 118 |   return React.useContext(LocationContext).navigationType;
 | 
| 119 | }
 | 
| 120 |  | 
| 121 |  | 
| 122 |  | 
| 123 |  | 
| 124 |  | 
| 125 |  | 
| 126 | 
 | 
| 127 | function useMatch(pattern) {
 | 
| 128 |   !useInRouterContext() ? UNSAFE_invariant(false,
 | 
| 129 |   
 | 
| 130 |   
 | 
| 131 |   `useMatch() may be used only in the context of a <Router> component.`)  : void 0;
 | 
| 132 |   let {
 | 
| 133 |     pathname
 | 
| 134 |   } = useLocation();
 | 
| 135 |   return React.useMemo(() => matchPath(pattern, UNSAFE_decodePath(pathname)), [pathname, pattern]);
 | 
| 136 | }
 | 
| 137 | const navigateEffectWarning = `You should call navigate() in a React.useEffect(), not when ` + `your component is first rendered.`;
 | 
| 138 | 
 | 
| 139 | function useIsomorphicLayoutEffect(cb) {
 | 
| 140 |   let isStatic = React.useContext(NavigationContext).static;
 | 
| 141 |   if (!isStatic) {
 | 
| 142 |     
 | 
| 143 |     
 | 
| 144 |     
 | 
| 145 |     React.useLayoutEffect(cb);
 | 
| 146 |   }
 | 
| 147 | }
 | 
| 148 |  | 
| 149 |  | 
| 150 |  | 
| 151 |  | 
| 152 |  | 
| 153 | 
 | 
| 154 | function useNavigate() {
 | 
| 155 |   let {
 | 
| 156 |     isDataRoute
 | 
| 157 |   } = React.useContext(RouteContext);
 | 
| 158 |   
 | 
| 159 |   
 | 
| 160 |   return isDataRoute ? useNavigateStable() : useNavigateUnstable();
 | 
| 161 | }
 | 
| 162 | function useNavigateUnstable() {
 | 
| 163 |   !useInRouterContext() ? UNSAFE_invariant(false,
 | 
| 164 |   
 | 
| 165 |   
 | 
| 166 |   `useNavigate() may be used only in the context of a <Router> component.`)  : void 0;
 | 
| 167 |   let dataRouterContext = React.useContext(DataRouterContext);
 | 
| 168 |   let {
 | 
| 169 |     basename,
 | 
| 170 |     future,
 | 
| 171 |     navigator
 | 
| 172 |   } = React.useContext(NavigationContext);
 | 
| 173 |   let {
 | 
| 174 |     matches
 | 
| 175 |   } = React.useContext(RouteContext);
 | 
| 176 |   let {
 | 
| 177 |     pathname: locationPathname
 | 
| 178 |   } = useLocation();
 | 
| 179 |   let routePathnamesJson = JSON.stringify(UNSAFE_getResolveToMatches(matches, future.v7_relativeSplatPath));
 | 
| 180 |   let activeRef = React.useRef(false);
 | 
| 181 |   useIsomorphicLayoutEffect(() => {
 | 
| 182 |     activeRef.current = true;
 | 
| 183 |   });
 | 
| 184 |   let navigate = React.useCallback((to, options = {}) => {
 | 
| 185 |     UNSAFE_warning(activeRef.current, navigateEffectWarning) ;
 | 
| 186 |     
 | 
| 187 |     
 | 
| 188 |     if (!activeRef.current) return;
 | 
| 189 |     if (typeof to === "number") {
 | 
| 190 |       navigator.go(to);
 | 
| 191 |       return;
 | 
| 192 |     }
 | 
| 193 |     let path = resolveTo(to, JSON.parse(routePathnamesJson), locationPathname, options.relative === "path");
 | 
| 194 |     
 | 
| 195 |     
 | 
| 196 |     
 | 
| 197 |     
 | 
| 198 |     
 | 
| 199 |     
 | 
| 200 |     if (dataRouterContext == null && basename !== "/") {
 | 
| 201 |       path.pathname = path.pathname === "/" ? basename : joinPaths([basename, path.pathname]);
 | 
| 202 |     }
 | 
| 203 |     (!!options.replace ? navigator.replace : navigator.push)(path, options.state, options);
 | 
| 204 |   }, [basename, navigator, routePathnamesJson, locationPathname, dataRouterContext]);
 | 
| 205 |   return navigate;
 | 
| 206 | }
 | 
| 207 | const OutletContext = React.createContext(null);
 | 
| 208 |  | 
| 209 |  | 
| 210 |  | 
| 211 |  | 
| 212 | 
 | 
| 213 | function useOutletContext() {
 | 
| 214 |   return React.useContext(OutletContext);
 | 
| 215 | }
 | 
| 216 |  | 
| 217 |  | 
| 218 |  | 
| 219 |  | 
| 220 |  | 
| 221 | 
 | 
| 222 | function useOutlet(context) {
 | 
| 223 |   let outlet = React.useContext(RouteContext).outlet;
 | 
| 224 |   if (outlet) {
 | 
| 225 |     return React.createElement(OutletContext.Provider, {
 | 
| 226 |       value: context
 | 
| 227 |     }, outlet);
 | 
| 228 |   }
 | 
| 229 |   return outlet;
 | 
| 230 | }
 | 
| 231 |  | 
| 232 |  | 
| 233 |  | 
| 234 |  | 
| 235 |  | 
| 236 | 
 | 
| 237 | function useParams() {
 | 
| 238 |   let {
 | 
| 239 |     matches
 | 
| 240 |   } = React.useContext(RouteContext);
 | 
| 241 |   let routeMatch = matches[matches.length - 1];
 | 
| 242 |   return routeMatch ? routeMatch.params : {};
 | 
| 243 | }
 | 
| 244 |  | 
| 245 |  | 
| 246 |  | 
| 247 |  | 
| 248 | 
 | 
| 249 | function useResolvedPath(to, {
 | 
| 250 |   relative
 | 
| 251 | } = {}) {
 | 
| 252 |   let {
 | 
| 253 |     future
 | 
| 254 |   } = React.useContext(NavigationContext);
 | 
| 255 |   let {
 | 
| 256 |     matches
 | 
| 257 |   } = React.useContext(RouteContext);
 | 
| 258 |   let {
 | 
| 259 |     pathname: locationPathname
 | 
| 260 |   } = useLocation();
 | 
| 261 |   let routePathnamesJson = JSON.stringify(UNSAFE_getResolveToMatches(matches, future.v7_relativeSplatPath));
 | 
| 262 |   return React.useMemo(() => resolveTo(to, JSON.parse(routePathnamesJson), locationPathname, relative === "path"), [to, routePathnamesJson, locationPathname, relative]);
 | 
| 263 | }
 | 
| 264 |  | 
| 265 |  | 
| 266 |  | 
| 267 |  | 
| 268 |  | 
| 269 |  | 
| 270 |  | 
| 271 | 
 | 
| 272 | function useRoutes(routes, locationArg) {
 | 
| 273 |   return useRoutesImpl(routes, locationArg);
 | 
| 274 | }
 | 
| 275 | 
 | 
| 276 | function useRoutesImpl(routes, locationArg, dataRouterState, future) {
 | 
| 277 |   !useInRouterContext() ? UNSAFE_invariant(false,
 | 
| 278 |   
 | 
| 279 |   
 | 
| 280 |   `useRoutes() may be used only in the context of a <Router> component.`)  : void 0;
 | 
| 281 |   let {
 | 
| 282 |     navigator
 | 
| 283 |   } = React.useContext(NavigationContext);
 | 
| 284 |   let {
 | 
| 285 |     matches: parentMatches
 | 
| 286 |   } = React.useContext(RouteContext);
 | 
| 287 |   let routeMatch = parentMatches[parentMatches.length - 1];
 | 
| 288 |   let parentParams = routeMatch ? routeMatch.params : {};
 | 
| 289 |   let parentPathname = routeMatch ? routeMatch.pathname : "/";
 | 
| 290 |   let parentPathnameBase = routeMatch ? routeMatch.pathnameBase : "/";
 | 
| 291 |   let parentRoute = routeMatch && routeMatch.route;
 | 
| 292 |   {
 | 
| 293 |     
 | 
| 294 |     
 | 
| 295 |     
 | 
| 296 |     
 | 
| 297 |     
 | 
| 298 |     
 | 
| 299 |     
 | 
| 300 |     
 | 
| 301 |     
 | 
| 302 |     
 | 
| 303 |     
 | 
| 304 |     
 | 
| 305 |     
 | 
| 306 |     
 | 
| 307 |     
 | 
| 308 |     
 | 
| 309 |     
 | 
| 310 |     
 | 
| 311 |     
 | 
| 312 |     
 | 
| 313 |     let parentPath = parentRoute && parentRoute.path || "";
 | 
| 314 |     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}/*`}">.`);
 | 
| 315 |   }
 | 
| 316 |   let locationFromContext = useLocation();
 | 
| 317 |   let location;
 | 
| 318 |   if (locationArg) {
 | 
| 319 |     let parsedLocationArg = typeof locationArg === "string" ? parsePath(locationArg) : locationArg;
 | 
| 320 |     !(parentPathnameBase === "/" || parsedLocationArg.pathname?.startsWith(parentPathnameBase)) ? 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;
 | 
| 321 |     location = parsedLocationArg;
 | 
| 322 |   } else {
 | 
| 323 |     location = locationFromContext;
 | 
| 324 |   }
 | 
| 325 |   let pathname = location.pathname || "/";
 | 
| 326 |   let remainingPathname = pathname;
 | 
| 327 |   if (parentPathnameBase !== "/") {
 | 
| 328 |     
 | 
| 329 |     
 | 
| 330 |     
 | 
| 331 |     
 | 
| 332 |     
 | 
| 333 |     
 | 
| 334 |     
 | 
| 335 |     
 | 
| 336 |     
 | 
| 337 |     
 | 
| 338 |     
 | 
| 339 |     
 | 
| 340 |     
 | 
| 341 |     
 | 
| 342 |     let parentSegments = parentPathnameBase.replace(/^\//, "").split("/");
 | 
| 343 |     let segments = pathname.replace(/^\//, "").split("/");
 | 
| 344 |     remainingPathname = "/" + segments.slice(parentSegments.length).join("/");
 | 
| 345 |   }
 | 
| 346 |   let matches = matchRoutes(routes, {
 | 
| 347 |     pathname: remainingPathname
 | 
| 348 |   });
 | 
| 349 |   {
 | 
| 350 |     UNSAFE_warning(parentRoute || matches != null, `No routes matched location "${location.pathname}${location.search}${location.hash}" `) ;
 | 
| 351 |     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.`) ;
 | 
| 352 |   }
 | 
| 353 |   let renderedMatches = _renderMatches(matches && matches.map(match => Object.assign({}, match, {
 | 
| 354 |     params: Object.assign({}, parentParams, match.params),
 | 
| 355 |     pathname: joinPaths([parentPathnameBase,
 | 
| 356 |     
 | 
| 357 |     navigator.encodeLocation ? navigator.encodeLocation(match.pathname).pathname : match.pathname]),
 | 
| 358 |     pathnameBase: match.pathnameBase === "/" ? parentPathnameBase : joinPaths([parentPathnameBase,
 | 
| 359 |     
 | 
| 360 |     navigator.encodeLocation ? navigator.encodeLocation(match.pathnameBase).pathname : match.pathnameBase])
 | 
| 361 |   })), parentMatches, dataRouterState, future);
 | 
| 362 |   
 | 
| 363 |   
 | 
| 364 |   
 | 
| 365 |   if (locationArg && renderedMatches) {
 | 
| 366 |     return React.createElement(LocationContext.Provider, {
 | 
| 367 |       value: {
 | 
| 368 |         location: {
 | 
| 369 |           pathname: "/",
 | 
| 370 |           search: "",
 | 
| 371 |           hash: "",
 | 
| 372 |           state: null,
 | 
| 373 |           key: "default",
 | 
| 374 |           ...location
 | 
| 375 |         },
 | 
| 376 |         navigationType: Action.Pop
 | 
| 377 |       }
 | 
| 378 |     }, renderedMatches);
 | 
| 379 |   }
 | 
| 380 |   return renderedMatches;
 | 
| 381 | }
 | 
| 382 | function DefaultErrorComponent() {
 | 
| 383 |   let error = useRouteError();
 | 
| 384 |   let message = isRouteErrorResponse(error) ? `${error.status} ${error.statusText}` : error instanceof Error ? error.message : JSON.stringify(error);
 | 
| 385 |   let stack = error instanceof Error ? error.stack : null;
 | 
| 386 |   let lightgrey = "rgba(200,200,200, 0.5)";
 | 
| 387 |   let preStyles = {
 | 
| 388 |     padding: "0.5rem",
 | 
| 389 |     backgroundColor: lightgrey
 | 
| 390 |   };
 | 
| 391 |   let codeStyles = {
 | 
| 392 |     padding: "2px 4px",
 | 
| 393 |     backgroundColor: lightgrey
 | 
| 394 |   };
 | 
| 395 |   let devInfo = null;
 | 
| 396 |   {
 | 
| 397 |     console.error("Error handled by React Router default ErrorBoundary:", error);
 | 
| 398 |     devInfo = React.createElement(React.Fragment, null, React.createElement("p", null, "\uD83D\uDCBF Hey developer \uD83D\uDC4B"), React.createElement("p", null, "You can provide a way better UX than this when your app throws errors by providing your own ", React.createElement("code", {
 | 
| 399 |       style: codeStyles
 | 
| 400 |     }, "ErrorBoundary"), " or", " ", React.createElement("code", {
 | 
| 401 |       style: codeStyles
 | 
| 402 |     }, "errorElement"), " prop on your route."));
 | 
| 403 |   }
 | 
| 404 |   return React.createElement(React.Fragment, null, React.createElement("h2", null, "Unexpected Application Error!"), React.createElement("h3", {
 | 
| 405 |     style: {
 | 
| 406 |       fontStyle: "italic"
 | 
| 407 |     }
 | 
| 408 |   }, message), stack ? React.createElement("pre", {
 | 
| 409 |     style: preStyles
 | 
| 410 |   }, stack) : null, devInfo);
 | 
| 411 | }
 | 
| 412 | const defaultErrorElement = React.createElement(DefaultErrorComponent, null);
 | 
| 413 | class RenderErrorBoundary extends React.Component {
 | 
| 414 |   constructor(props) {
 | 
| 415 |     super(props);
 | 
| 416 |     this.state = {
 | 
| 417 |       location: props.location,
 | 
| 418 |       revalidation: props.revalidation,
 | 
| 419 |       error: props.error
 | 
| 420 |     };
 | 
| 421 |   }
 | 
| 422 |   static getDerivedStateFromError(error) {
 | 
| 423 |     return {
 | 
| 424 |       error: error
 | 
| 425 |     };
 | 
| 426 |   }
 | 
| 427 |   static getDerivedStateFromProps(props, state) {
 | 
| 428 |     
 | 
| 429 |     
 | 
| 430 |     
 | 
| 431 |     
 | 
| 432 |     
 | 
| 433 |     
 | 
| 434 |     
 | 
| 435 |     
 | 
| 436 |     if (state.location !== props.location || state.revalidation !== "idle" && props.revalidation === "idle") {
 | 
| 437 |       return {
 | 
| 438 |         error: props.error,
 | 
| 439 |         location: props.location,
 | 
| 440 |         revalidation: props.revalidation
 | 
| 441 |       };
 | 
| 442 |     }
 | 
| 443 |     
 | 
| 444 |     
 | 
| 445 |     
 | 
| 446 |     
 | 
| 447 |     return {
 | 
| 448 |       error: props.error !== undefined ? props.error : state.error,
 | 
| 449 |       location: state.location,
 | 
| 450 |       revalidation: props.revalidation || state.revalidation
 | 
| 451 |     };
 | 
| 452 |   }
 | 
| 453 |   componentDidCatch(error, errorInfo) {
 | 
| 454 |     console.error("React Router caught the following error during render", error, errorInfo);
 | 
| 455 |   }
 | 
| 456 |   render() {
 | 
| 457 |     return this.state.error !== undefined ? React.createElement(RouteContext.Provider, {
 | 
| 458 |       value: this.props.routeContext
 | 
| 459 |     }, React.createElement(RouteErrorContext.Provider, {
 | 
| 460 |       value: this.state.error,
 | 
| 461 |       children: this.props.component
 | 
| 462 |     })) : this.props.children;
 | 
| 463 |   }
 | 
| 464 | }
 | 
| 465 | function RenderedRoute({
 | 
| 466 |   routeContext,
 | 
| 467 |   match,
 | 
| 468 |   children
 | 
| 469 | }) {
 | 
| 470 |   let dataRouterContext = React.useContext(DataRouterContext);
 | 
| 471 |   
 | 
| 472 |   
 | 
| 473 |   if (dataRouterContext && dataRouterContext.static && dataRouterContext.staticContext && (match.route.errorElement || match.route.ErrorBoundary)) {
 | 
| 474 |     dataRouterContext.staticContext._deepestRenderedBoundaryId = match.route.id;
 | 
| 475 |   }
 | 
| 476 |   return React.createElement(RouteContext.Provider, {
 | 
| 477 |     value: routeContext
 | 
| 478 |   }, children);
 | 
| 479 | }
 | 
| 480 | function _renderMatches(matches, parentMatches = [], dataRouterState = null, future = null) {
 | 
| 481 |   if (matches == null) {
 | 
| 482 |     if (!dataRouterState) {
 | 
| 483 |       return null;
 | 
| 484 |     }
 | 
| 485 |     if (dataRouterState.errors) {
 | 
| 486 |       
 | 
| 487 |       
 | 
| 488 |       matches = dataRouterState.matches;
 | 
| 489 |     } else if (future?.v7_partialHydration && parentMatches.length === 0 && !dataRouterState.initialized && dataRouterState.matches.length > 0) {
 | 
| 490 |       
 | 
| 491 |       
 | 
| 492 |       
 | 
| 493 |       
 | 
| 494 |       
 | 
| 495 |       
 | 
| 496 |       matches = dataRouterState.matches;
 | 
| 497 |     } else {
 | 
| 498 |       return null;
 | 
| 499 |     }
 | 
| 500 |   }
 | 
| 501 |   let renderedMatches = matches;
 | 
| 502 |   
 | 
| 503 |   let errors = dataRouterState?.errors;
 | 
| 504 |   if (errors != null) {
 | 
| 505 |     let errorIndex = renderedMatches.findIndex(m => m.route.id && errors?.[m.route.id] !== undefined);
 | 
| 506 |     !(errorIndex >= 0) ? UNSAFE_invariant(false, `Could not find a matching route for errors on route IDs: ${Object.keys(errors).join(",")}`)  : void 0;
 | 
| 507 |     renderedMatches = renderedMatches.slice(0, Math.min(renderedMatches.length, errorIndex + 1));
 | 
| 508 |   }
 | 
| 509 |   
 | 
| 510 |   
 | 
| 511 |   let renderFallback = false;
 | 
| 512 |   let fallbackIndex = -1;
 | 
| 513 |   if (dataRouterState && future && future.v7_partialHydration) {
 | 
| 514 |     for (let i = 0; i < renderedMatches.length; i++) {
 | 
| 515 |       let match = renderedMatches[i];
 | 
| 516 |       
 | 
| 517 |       if (match.route.HydrateFallback || match.route.hydrateFallbackElement) {
 | 
| 518 |         fallbackIndex = i;
 | 
| 519 |       }
 | 
| 520 |       if (match.route.id) {
 | 
| 521 |         let {
 | 
| 522 |           loaderData,
 | 
| 523 |           errors: _errors
 | 
| 524 |         } = dataRouterState;
 | 
| 525 |         let needsToRunLoader = match.route.loader && loaderData[match.route.id] === undefined && (!_errors || _errors[match.route.id] === undefined);
 | 
| 526 |         if (match.route.lazy || needsToRunLoader) {
 | 
| 527 |           
 | 
| 528 |           
 | 
| 529 |           
 | 
| 530 |           renderFallback = true;
 | 
| 531 |           if (fallbackIndex >= 0) {
 | 
| 532 |             renderedMatches = renderedMatches.slice(0, fallbackIndex + 1);
 | 
| 533 |           } else {
 | 
| 534 |             renderedMatches = [renderedMatches[0]];
 | 
| 535 |           }
 | 
| 536 |           break;
 | 
| 537 |         }
 | 
| 538 |       }
 | 
| 539 |     }
 | 
| 540 |   }
 | 
| 541 |   return renderedMatches.reduceRight((outlet, match, index) => {
 | 
| 542 |     
 | 
| 543 |     let error;
 | 
| 544 |     let shouldRenderHydrateFallback = false;
 | 
| 545 |     let errorElement = null;
 | 
| 546 |     let hydrateFallbackElement = null;
 | 
| 547 |     if (dataRouterState) {
 | 
| 548 |       error = errors && match.route.id ? errors[match.route.id] : undefined;
 | 
| 549 |       errorElement = match.route.errorElement || defaultErrorElement;
 | 
| 550 |       if (renderFallback) {
 | 
| 551 |         if (fallbackIndex < 0 && index === 0) {
 | 
| 552 |           warningOnce("route-fallback", false, "No `HydrateFallback` element provided to render during initial hydration");
 | 
| 553 |           shouldRenderHydrateFallback = true;
 | 
| 554 |           hydrateFallbackElement = null;
 | 
| 555 |         } else if (fallbackIndex === index) {
 | 
| 556 |           shouldRenderHydrateFallback = true;
 | 
| 557 |           hydrateFallbackElement = match.route.hydrateFallbackElement || null;
 | 
| 558 |         }
 | 
| 559 |       }
 | 
| 560 |     }
 | 
| 561 |     let matches = parentMatches.concat(renderedMatches.slice(0, index + 1));
 | 
| 562 |     let getChildren = () => {
 | 
| 563 |       let children;
 | 
| 564 |       if (error) {
 | 
| 565 |         children = errorElement;
 | 
| 566 |       } else if (shouldRenderHydrateFallback) {
 | 
| 567 |         children = hydrateFallbackElement;
 | 
| 568 |       } else if (match.route.Component) {
 | 
| 569 |         
 | 
| 570 |         
 | 
| 571 |         
 | 
| 572 |         
 | 
| 573 |         
 | 
| 574 |         
 | 
| 575 |         children = React.createElement(match.route.Component, null);
 | 
| 576 |       } else if (match.route.element) {
 | 
| 577 |         children = match.route.element;
 | 
| 578 |       } else {
 | 
| 579 |         children = outlet;
 | 
| 580 |       }
 | 
| 581 |       return React.createElement(RenderedRoute, {
 | 
| 582 |         match: match,
 | 
| 583 |         routeContext: {
 | 
| 584 |           outlet,
 | 
| 585 |           matches,
 | 
| 586 |           isDataRoute: dataRouterState != null
 | 
| 587 |         },
 | 
| 588 |         children: children
 | 
| 589 |       });
 | 
| 590 |     };
 | 
| 591 |     
 | 
| 592 |     
 | 
| 593 |     
 | 
| 594 |     return dataRouterState && (match.route.ErrorBoundary || match.route.errorElement || index === 0) ? React.createElement(RenderErrorBoundary, {
 | 
| 595 |       location: dataRouterState.location,
 | 
| 596 |       revalidation: dataRouterState.revalidation,
 | 
| 597 |       component: errorElement,
 | 
| 598 |       error: error,
 | 
| 599 |       children: getChildren(),
 | 
| 600 |       routeContext: {
 | 
| 601 |         outlet: null,
 | 
| 602 |         matches,
 | 
| 603 |         isDataRoute: true
 | 
| 604 |       }
 | 
| 605 |     }) : getChildren();
 | 
| 606 |   }, null);
 | 
| 607 | }
 | 
| 608 | var DataRouterHook;
 | 
| 609 | (function (DataRouterHook) {
 | 
| 610 |   DataRouterHook["UseBlocker"] = "useBlocker";
 | 
| 611 |   DataRouterHook["UseRevalidator"] = "useRevalidator";
 | 
| 612 |   DataRouterHook["UseNavigateStable"] = "useNavigate";
 | 
| 613 | })(DataRouterHook || (DataRouterHook = {}));
 | 
| 614 | var DataRouterStateHook;
 | 
| 615 | (function (DataRouterStateHook) {
 | 
| 616 |   DataRouterStateHook["UseBlocker"] = "useBlocker";
 | 
| 617 |   DataRouterStateHook["UseLoaderData"] = "useLoaderData";
 | 
| 618 |   DataRouterStateHook["UseActionData"] = "useActionData";
 | 
| 619 |   DataRouterStateHook["UseRouteError"] = "useRouteError";
 | 
| 620 |   DataRouterStateHook["UseNavigation"] = "useNavigation";
 | 
| 621 |   DataRouterStateHook["UseRouteLoaderData"] = "useRouteLoaderData";
 | 
| 622 |   DataRouterStateHook["UseMatches"] = "useMatches";
 | 
| 623 |   DataRouterStateHook["UseRevalidator"] = "useRevalidator";
 | 
| 624 |   DataRouterStateHook["UseNavigateStable"] = "useNavigate";
 | 
| 625 |   DataRouterStateHook["UseRouteId"] = "useRouteId";
 | 
| 626 | })(DataRouterStateHook || (DataRouterStateHook = {}));
 | 
| 627 | function getDataRouterConsoleError(hookName) {
 | 
| 628 |   return `${hookName} must be used within a data router.  See https://reactrouter.com/routers/picking-a-router.`;
 | 
| 629 | }
 | 
| 630 | function useDataRouterContext(hookName) {
 | 
| 631 |   let ctx = React.useContext(DataRouterContext);
 | 
| 632 |   !ctx ? UNSAFE_invariant(false, getDataRouterConsoleError(hookName))  : void 0;
 | 
| 633 |   return ctx;
 | 
| 634 | }
 | 
| 635 | function useDataRouterState(hookName) {
 | 
| 636 |   let state = React.useContext(DataRouterStateContext);
 | 
| 637 |   !state ? UNSAFE_invariant(false, getDataRouterConsoleError(hookName))  : void 0;
 | 
| 638 |   return state;
 | 
| 639 | }
 | 
| 640 | function useRouteContext(hookName) {
 | 
| 641 |   let route = React.useContext(RouteContext);
 | 
| 642 |   !route ? UNSAFE_invariant(false, getDataRouterConsoleError(hookName))  : void 0;
 | 
| 643 |   return route;
 | 
| 644 | }
 | 
| 645 | 
 | 
| 646 | function useCurrentRouteId(hookName) {
 | 
| 647 |   let route = useRouteContext(hookName);
 | 
| 648 |   let thisRoute = route.matches[route.matches.length - 1];
 | 
| 649 |   !thisRoute.route.id ? UNSAFE_invariant(false, `${hookName} can only be used on routes that contain a unique "id"`)  : void 0;
 | 
| 650 |   return thisRoute.route.id;
 | 
| 651 | }
 | 
| 652 |  | 
| 653 |  | 
| 654 | 
 | 
| 655 | function useRouteId() {
 | 
| 656 |   return useCurrentRouteId(DataRouterStateHook.UseRouteId);
 | 
| 657 | }
 | 
| 658 |  | 
| 659 |  | 
| 660 |  | 
| 661 | 
 | 
| 662 | function useNavigation() {
 | 
| 663 |   let state = useDataRouterState(DataRouterStateHook.UseNavigation);
 | 
| 664 |   return state.navigation;
 | 
| 665 | }
 | 
| 666 |  | 
| 667 |  | 
| 668 |  | 
| 669 | 
 | 
| 670 | function useRevalidator() {
 | 
| 671 |   let dataRouterContext = useDataRouterContext(DataRouterHook.UseRevalidator);
 | 
| 672 |   let state = useDataRouterState(DataRouterStateHook.UseRevalidator);
 | 
| 673 |   return React.useMemo(() => ({
 | 
| 674 |     revalidate: dataRouterContext.router.revalidate,
 | 
| 675 |     state: state.revalidation
 | 
| 676 |   }), [dataRouterContext.router.revalidate, state.revalidation]);
 | 
| 677 | }
 | 
| 678 |  | 
| 679 |  | 
| 680 |  | 
| 681 | 
 | 
| 682 | function useMatches() {
 | 
| 683 |   let {
 | 
| 684 |     matches,
 | 
| 685 |     loaderData
 | 
| 686 |   } = useDataRouterState(DataRouterStateHook.UseMatches);
 | 
| 687 |   return React.useMemo(() => matches.map(m => UNSAFE_convertRouteMatchToUiMatch(m, loaderData)), [matches, loaderData]);
 | 
| 688 | }
 | 
| 689 |  | 
| 690 |  | 
| 691 | 
 | 
| 692 | function useLoaderData() {
 | 
| 693 |   let state = useDataRouterState(DataRouterStateHook.UseLoaderData);
 | 
| 694 |   let routeId = useCurrentRouteId(DataRouterStateHook.UseLoaderData);
 | 
| 695 |   if (state.errors && state.errors[routeId] != null) {
 | 
| 696 |     console.error(`You cannot \`useLoaderData\` in an errorElement (routeId: ${routeId})`);
 | 
| 697 |     return undefined;
 | 
| 698 |   }
 | 
| 699 |   return state.loaderData[routeId];
 | 
| 700 | }
 | 
| 701 |  | 
| 702 |  | 
| 703 | 
 | 
| 704 | function useRouteLoaderData(routeId) {
 | 
| 705 |   let state = useDataRouterState(DataRouterStateHook.UseRouteLoaderData);
 | 
| 706 |   return state.loaderData[routeId];
 | 
| 707 | }
 | 
| 708 |  | 
| 709 |  | 
| 710 | 
 | 
| 711 | function useActionData() {
 | 
| 712 |   let state = useDataRouterState(DataRouterStateHook.UseActionData);
 | 
| 713 |   let routeId = useCurrentRouteId(DataRouterStateHook.UseLoaderData);
 | 
| 714 |   return state.actionData ? state.actionData[routeId] : undefined;
 | 
| 715 | }
 | 
| 716 |  | 
| 717 |  | 
| 718 |  | 
| 719 |  | 
| 720 | 
 | 
| 721 | function useRouteError() {
 | 
| 722 |   let error = React.useContext(RouteErrorContext);
 | 
| 723 |   let state = useDataRouterState(DataRouterStateHook.UseRouteError);
 | 
| 724 |   let routeId = useCurrentRouteId(DataRouterStateHook.UseRouteError);
 | 
| 725 |   
 | 
| 726 |   
 | 
| 727 |   if (error !== undefined) {
 | 
| 728 |     return error;
 | 
| 729 |   }
 | 
| 730 |   
 | 
| 731 |   return state.errors?.[routeId];
 | 
| 732 | }
 | 
| 733 |  | 
| 734 |  | 
| 735 | 
 | 
| 736 | function useAsyncValue() {
 | 
| 737 |   let value = React.useContext(AwaitContext);
 | 
| 738 |   return value?._data;
 | 
| 739 | }
 | 
| 740 |  | 
| 741 |  | 
| 742 | 
 | 
| 743 | function useAsyncError() {
 | 
| 744 |   let value = React.useContext(AwaitContext);
 | 
| 745 |   return value?._error;
 | 
| 746 | }
 | 
| 747 | let blockerId = 0;
 | 
| 748 |  | 
| 749 |  | 
| 750 |  | 
| 751 |  | 
| 752 |  | 
| 753 | 
 | 
| 754 | function useBlocker(shouldBlock) {
 | 
| 755 |   let {
 | 
| 756 |     router,
 | 
| 757 |     basename
 | 
| 758 |   } = useDataRouterContext(DataRouterHook.UseBlocker);
 | 
| 759 |   let state = useDataRouterState(DataRouterStateHook.UseBlocker);
 | 
| 760 |   let [blockerKey, setBlockerKey] = React.useState("");
 | 
| 761 |   let blockerFunction = React.useCallback(arg => {
 | 
| 762 |     if (typeof shouldBlock !== "function") {
 | 
| 763 |       return !!shouldBlock;
 | 
| 764 |     }
 | 
| 765 |     if (basename === "/") {
 | 
| 766 |       return shouldBlock(arg);
 | 
| 767 |     }
 | 
| 768 |     
 | 
| 769 |     
 | 
| 770 |     
 | 
| 771 |     let {
 | 
| 772 |       currentLocation,
 | 
| 773 |       nextLocation,
 | 
| 774 |       historyAction
 | 
| 775 |     } = arg;
 | 
| 776 |     return shouldBlock({
 | 
| 777 |       currentLocation: {
 | 
| 778 |         ...currentLocation,
 | 
| 779 |         pathname: stripBasename(currentLocation.pathname, basename) || currentLocation.pathname
 | 
| 780 |       },
 | 
| 781 |       nextLocation: {
 | 
| 782 |         ...nextLocation,
 | 
| 783 |         pathname: stripBasename(nextLocation.pathname, basename) || nextLocation.pathname
 | 
| 784 |       },
 | 
| 785 |       historyAction
 | 
| 786 |     });
 | 
| 787 |   }, [basename, shouldBlock]);
 | 
| 788 |   
 | 
| 789 |   
 | 
| 790 |   React.useEffect(() => {
 | 
| 791 |     let key = String(++blockerId);
 | 
| 792 |     setBlockerKey(key);
 | 
| 793 |     return () => router.deleteBlocker(key);
 | 
| 794 |   }, [router]);
 | 
| 795 |   
 | 
| 796 |   
 | 
| 797 |   
 | 
| 798 |   
 | 
| 799 |   React.useEffect(() => {
 | 
| 800 |     if (blockerKey !== "") {
 | 
| 801 |       router.getBlocker(blockerKey, blockerFunction);
 | 
| 802 |     }
 | 
| 803 |   }, [router, blockerKey, blockerFunction]);
 | 
| 804 |   
 | 
| 805 |   
 | 
| 806 |   return blockerKey && state.blockers.has(blockerKey) ? state.blockers.get(blockerKey) : IDLE_BLOCKER;
 | 
| 807 | }
 | 
| 808 |  | 
| 809 |  | 
| 810 |  | 
| 811 | 
 | 
| 812 | function useNavigateStable() {
 | 
| 813 |   let {
 | 
| 814 |     router
 | 
| 815 |   } = useDataRouterContext(DataRouterHook.UseNavigateStable);
 | 
| 816 |   let id = useCurrentRouteId(DataRouterStateHook.UseNavigateStable);
 | 
| 817 |   let activeRef = React.useRef(false);
 | 
| 818 |   useIsomorphicLayoutEffect(() => {
 | 
| 819 |     activeRef.current = true;
 | 
| 820 |   });
 | 
| 821 |   let navigate = React.useCallback((to, options = {}) => {
 | 
| 822 |     UNSAFE_warning(activeRef.current, navigateEffectWarning) ;
 | 
| 823 |     
 | 
| 824 |     
 | 
| 825 |     if (!activeRef.current) return;
 | 
| 826 |     if (typeof to === "number") {
 | 
| 827 |       router.navigate(to);
 | 
| 828 |     } else {
 | 
| 829 |       router.navigate(to, {
 | 
| 830 |         fromRouteId: id,
 | 
| 831 |         ...options
 | 
| 832 |       });
 | 
| 833 |     }
 | 
| 834 |   }, [router, id]);
 | 
| 835 |   return navigate;
 | 
| 836 | }
 | 
| 837 | const alreadyWarned = {};
 | 
| 838 | function warningOnce(key, cond, message) {
 | 
| 839 |   if (!cond && !alreadyWarned[key]) {
 | 
| 840 |     alreadyWarned[key] = true;
 | 
| 841 |     UNSAFE_warning(false, message) ;
 | 
| 842 |   }
 | 
| 843 | }
 | 
| 844 | 
 | 
| 845 |  | 
| 846 |  | 
| 847 |  | 
| 848 |  | 
| 849 |  | 
| 850 |  | 
| 851 |  | 
| 852 |  | 
| 853 |  | 
| 854 |  | 
| 855 |  | 
| 856 |  | 
| 857 |  | 
| 858 |  | 
| 859 |  | 
| 860 |  | 
| 861 |  | 
| 862 |  | 
| 863 |  | 
| 864 |  | 
| 865 | 
 | 
| 866 | const START_TRANSITION = "startTransition";
 | 
| 867 | const startTransitionImpl = React[START_TRANSITION];
 | 
| 868 |  | 
| 869 |  | 
| 870 | 
 | 
| 871 | function RouterProvider({
 | 
| 872 |   fallbackElement,
 | 
| 873 |   router,
 | 
| 874 |   future
 | 
| 875 | }) {
 | 
| 876 |   let [state, setStateImpl] = React.useState(router.state);
 | 
| 877 |   let {
 | 
| 878 |     v7_startTransition
 | 
| 879 |   } = future || {};
 | 
| 880 |   let setState = React.useCallback(newState => {
 | 
| 881 |     if (v7_startTransition && startTransitionImpl) {
 | 
| 882 |       startTransitionImpl(() => setStateImpl(newState));
 | 
| 883 |     } else {
 | 
| 884 |       setStateImpl(newState);
 | 
| 885 |     }
 | 
| 886 |   }, [setStateImpl, v7_startTransition]);
 | 
| 887 |   
 | 
| 888 |   
 | 
| 889 |   React.useLayoutEffect(() => router.subscribe(setState), [router, setState]);
 | 
| 890 |   React.useEffect(() => {
 | 
| 891 |     UNSAFE_warning(fallbackElement == null || !router.future.v7_partialHydration, "`<RouterProvider fallbackElement>` is deprecated when using " + "`v7_partialHydration`, use a `HydrateFallback` component instead") ;
 | 
| 892 |     
 | 
| 893 |     
 | 
| 894 |   }, []);
 | 
| 895 |   let navigator = React.useMemo(() => {
 | 
| 896 |     return {
 | 
| 897 |       createHref: router.createHref,
 | 
| 898 |       encodeLocation: router.encodeLocation,
 | 
| 899 |       go: n => router.navigate(n),
 | 
| 900 |       push: (to, state, opts) => router.navigate(to, {
 | 
| 901 |         state,
 | 
| 902 |         preventScrollReset: opts?.preventScrollReset
 | 
| 903 |       }),
 | 
| 904 |       replace: (to, state, opts) => router.navigate(to, {
 | 
| 905 |         replace: true,
 | 
| 906 |         state,
 | 
| 907 |         preventScrollReset: opts?.preventScrollReset
 | 
| 908 |       })
 | 
| 909 |     };
 | 
| 910 |   }, [router]);
 | 
| 911 |   let basename = router.basename || "/";
 | 
| 912 |   let dataRouterContext = React.useMemo(() => ({
 | 
| 913 |     router,
 | 
| 914 |     navigator,
 | 
| 915 |     static: false,
 | 
| 916 |     basename
 | 
| 917 |   }), [router, navigator, basename]);
 | 
| 918 |   
 | 
| 919 |   
 | 
| 920 |   
 | 
| 921 |   
 | 
| 922 |   
 | 
| 923 |   
 | 
| 924 |   return React.createElement(React.Fragment, null, React.createElement(DataRouterContext.Provider, {
 | 
| 925 |     value: dataRouterContext
 | 
| 926 |   }, React.createElement(DataRouterStateContext.Provider, {
 | 
| 927 |     value: state
 | 
| 928 |   }, React.createElement(Router, {
 | 
| 929 |     basename: basename,
 | 
| 930 |     location: state.location,
 | 
| 931 |     navigationType: state.historyAction,
 | 
| 932 |     navigator: navigator,
 | 
| 933 |     future: {
 | 
| 934 |       v7_relativeSplatPath: router.future.v7_relativeSplatPath
 | 
| 935 |     }
 | 
| 936 |   }, state.initialized || router.future.v7_partialHydration ? React.createElement(DataRoutes, {
 | 
| 937 |     routes: router.routes,
 | 
| 938 |     future: router.future,
 | 
| 939 |     state: state
 | 
| 940 |   }) : fallbackElement))), null);
 | 
| 941 | }
 | 
| 942 | function DataRoutes({
 | 
| 943 |   routes,
 | 
| 944 |   future,
 | 
| 945 |   state
 | 
| 946 | }) {
 | 
| 947 |   return useRoutesImpl(routes, undefined, state, future);
 | 
| 948 | }
 | 
| 949 |  | 
| 950 |  | 
| 951 |  | 
| 952 |  | 
| 953 | 
 | 
| 954 | function MemoryRouter({
 | 
| 955 |   basename,
 | 
| 956 |   children,
 | 
| 957 |   initialEntries,
 | 
| 958 |   initialIndex,
 | 
| 959 |   future
 | 
| 960 | }) {
 | 
| 961 |   let historyRef = React.useRef();
 | 
| 962 |   if (historyRef.current == null) {
 | 
| 963 |     historyRef.current = createMemoryHistory({
 | 
| 964 |       initialEntries,
 | 
| 965 |       initialIndex,
 | 
| 966 |       v5Compat: true
 | 
| 967 |     });
 | 
| 968 |   }
 | 
| 969 |   let history = historyRef.current;
 | 
| 970 |   let [state, setStateImpl] = React.useState({
 | 
| 971 |     action: history.action,
 | 
| 972 |     location: history.location
 | 
| 973 |   });
 | 
| 974 |   let {
 | 
| 975 |     v7_startTransition
 | 
| 976 |   } = future || {};
 | 
| 977 |   let setState = React.useCallback(newState => {
 | 
| 978 |     v7_startTransition && startTransitionImpl ? startTransitionImpl(() => setStateImpl(newState)) : setStateImpl(newState);
 | 
| 979 |   }, [setStateImpl, v7_startTransition]);
 | 
| 980 |   React.useLayoutEffect(() => history.listen(setState), [history, setState]);
 | 
| 981 |   return React.createElement(Router, {
 | 
| 982 |     basename: basename,
 | 
| 983 |     children: children,
 | 
| 984 |     location: state.location,
 | 
| 985 |     navigationType: state.action,
 | 
| 986 |     navigator: history,
 | 
| 987 |     future: future
 | 
| 988 |   });
 | 
| 989 | }
 | 
| 990 |  | 
| 991 |  | 
| 992 |  | 
| 993 |  | 
| 994 |  | 
| 995 |  | 
| 996 |  | 
| 997 |  | 
| 998 | 
 | 
| 999 | function Navigate({
 | 
| 1000 |   to,
 | 
| 1001 |   replace,
 | 
| 1002 |   state,
 | 
| 1003 |   relative
 | 
| 1004 | }) {
 | 
| 1005 |   !useInRouterContext() ? UNSAFE_invariant(false,
 | 
| 1006 |   
 | 
| 1007 |   
 | 
| 1008 |   `<Navigate> may be used only in the context of a <Router> component.`)  : void 0;
 | 
| 1009 |   let {
 | 
| 1010 |     future,
 | 
| 1011 |     static: isStatic
 | 
| 1012 |   } = React.useContext(NavigationContext);
 | 
| 1013 |   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.`) ;
 | 
| 1014 |   let {
 | 
| 1015 |     matches
 | 
| 1016 |   } = React.useContext(RouteContext);
 | 
| 1017 |   let {
 | 
| 1018 |     pathname: locationPathname
 | 
| 1019 |   } = useLocation();
 | 
| 1020 |   let navigate = useNavigate();
 | 
| 1021 |   
 | 
| 1022 |   
 | 
| 1023 |   let path = resolveTo(to, UNSAFE_getResolveToMatches(matches, future.v7_relativeSplatPath), locationPathname, relative === "path");
 | 
| 1024 |   let jsonPath = JSON.stringify(path);
 | 
| 1025 |   React.useEffect(() => navigate(JSON.parse(jsonPath), {
 | 
| 1026 |     replace,
 | 
| 1027 |     state,
 | 
| 1028 |     relative
 | 
| 1029 |   }), [navigate, jsonPath, relative, replace, state]);
 | 
| 1030 |   return null;
 | 
| 1031 | }
 | 
| 1032 |  | 
| 1033 |  | 
| 1034 |  | 
| 1035 |  | 
| 1036 | 
 | 
| 1037 | function Outlet(props) {
 | 
| 1038 |   return useOutlet(props.context);
 | 
| 1039 | }
 | 
| 1040 |  | 
| 1041 |  | 
| 1042 |  | 
| 1043 |  | 
| 1044 | 
 | 
| 1045 | function Route(_props) {
 | 
| 1046 |   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>.`)  ;
 | 
| 1047 | }
 | 
| 1048 |  | 
| 1049 |  | 
| 1050 |  | 
| 1051 |  | 
| 1052 |  | 
| 1053 |  | 
| 1054 |  | 
| 1055 |  | 
| 1056 | 
 | 
| 1057 | function Router({
 | 
| 1058 |   basename: basenameProp = "/",
 | 
| 1059 |   children = null,
 | 
| 1060 |   location: locationProp,
 | 
| 1061 |   navigationType = Action.Pop,
 | 
| 1062 |   navigator,
 | 
| 1063 |   static: staticProp = false,
 | 
| 1064 |   future
 | 
| 1065 | }) {
 | 
| 1066 |   !!useInRouterContext() ? UNSAFE_invariant(false, `You cannot render a <Router> inside another <Router>.` + ` You should never have more than one in your app.`)  : void 0;
 | 
| 1067 |   
 | 
| 1068 |   
 | 
| 1069 |   let basename = basenameProp.replace(/^\/*/, "/");
 | 
| 1070 |   let navigationContext = React.useMemo(() => ({
 | 
| 1071 |     basename,
 | 
| 1072 |     navigator,
 | 
| 1073 |     static: staticProp,
 | 
| 1074 |     future: {
 | 
| 1075 |       v7_relativeSplatPath: false,
 | 
| 1076 |       ...future
 | 
| 1077 |     }
 | 
| 1078 |   }), [basename, future, navigator, staticProp]);
 | 
| 1079 |   if (typeof locationProp === "string") {
 | 
| 1080 |     locationProp = parsePath(locationProp);
 | 
| 1081 |   }
 | 
| 1082 |   let {
 | 
| 1083 |     pathname = "/",
 | 
| 1084 |     search = "",
 | 
| 1085 |     hash = "",
 | 
| 1086 |     state = null,
 | 
| 1087 |     key = "default"
 | 
| 1088 |   } = locationProp;
 | 
| 1089 |   let locationContext = React.useMemo(() => {
 | 
| 1090 |     let trailingPathname = stripBasename(pathname, basename);
 | 
| 1091 |     if (trailingPathname == null) {
 | 
| 1092 |       return null;
 | 
| 1093 |     }
 | 
| 1094 |     return {
 | 
| 1095 |       location: {
 | 
| 1096 |         pathname: trailingPathname,
 | 
| 1097 |         search,
 | 
| 1098 |         hash,
 | 
| 1099 |         state,
 | 
| 1100 |         key
 | 
| 1101 |       },
 | 
| 1102 |       navigationType
 | 
| 1103 |     };
 | 
| 1104 |   }, [basename, pathname, search, hash, state, key, navigationType]);
 | 
| 1105 |   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.`) ;
 | 
| 1106 |   if (locationContext == null) {
 | 
| 1107 |     return null;
 | 
| 1108 |   }
 | 
| 1109 |   return React.createElement(NavigationContext.Provider, {
 | 
| 1110 |     value: navigationContext
 | 
| 1111 |   }, React.createElement(LocationContext.Provider, {
 | 
| 1112 |     children: children,
 | 
| 1113 |     value: locationContext
 | 
| 1114 |   }));
 | 
| 1115 | }
 | 
| 1116 |  | 
| 1117 |  | 
| 1118 |  | 
| 1119 |  | 
| 1120 |  | 
| 1121 | 
 | 
| 1122 | function Routes({
 | 
| 1123 |   children,
 | 
| 1124 |   location
 | 
| 1125 | }) {
 | 
| 1126 |   return useRoutes(createRoutesFromChildren(children), location);
 | 
| 1127 | }
 | 
| 1128 |  | 
| 1129 |  | 
| 1130 |  | 
| 1131 | 
 | 
| 1132 | function Await({
 | 
| 1133 |   children,
 | 
| 1134 |   errorElement,
 | 
| 1135 |   resolve
 | 
| 1136 | }) {
 | 
| 1137 |   return React.createElement(AwaitErrorBoundary, {
 | 
| 1138 |     resolve: resolve,
 | 
| 1139 |     errorElement: errorElement
 | 
| 1140 |   }, React.createElement(ResolveAwait, null, children));
 | 
| 1141 | }
 | 
| 1142 | var AwaitRenderStatus;
 | 
| 1143 | (function (AwaitRenderStatus) {
 | 
| 1144 |   AwaitRenderStatus[AwaitRenderStatus["pending"] = 0] = "pending";
 | 
| 1145 |   AwaitRenderStatus[AwaitRenderStatus["success"] = 1] = "success";
 | 
| 1146 |   AwaitRenderStatus[AwaitRenderStatus["error"] = 2] = "error";
 | 
| 1147 | })(AwaitRenderStatus || (AwaitRenderStatus = {}));
 | 
| 1148 | const neverSettledPromise = new Promise(() => {});
 | 
| 1149 | class AwaitErrorBoundary extends React.Component {
 | 
| 1150 |   constructor(props) {
 | 
| 1151 |     super(props);
 | 
| 1152 |     this.state = {
 | 
| 1153 |       error: null
 | 
| 1154 |     };
 | 
| 1155 |   }
 | 
| 1156 |   static getDerivedStateFromError(error) {
 | 
| 1157 |     return {
 | 
| 1158 |       error
 | 
| 1159 |     };
 | 
| 1160 |   }
 | 
| 1161 |   componentDidCatch(error, errorInfo) {
 | 
| 1162 |     console.error("<Await> caught the following error during render", error, errorInfo);
 | 
| 1163 |   }
 | 
| 1164 |   render() {
 | 
| 1165 |     let {
 | 
| 1166 |       children,
 | 
| 1167 |       errorElement,
 | 
| 1168 |       resolve
 | 
| 1169 |     } = this.props;
 | 
| 1170 |     let promise = null;
 | 
| 1171 |     let status = AwaitRenderStatus.pending;
 | 
| 1172 |     if (!(resolve instanceof Promise)) {
 | 
| 1173 |       
 | 
| 1174 |       status = AwaitRenderStatus.success;
 | 
| 1175 |       promise = Promise.resolve();
 | 
| 1176 |       Object.defineProperty(promise, "_tracked", {
 | 
| 1177 |         get: () => true
 | 
| 1178 |       });
 | 
| 1179 |       Object.defineProperty(promise, "_data", {
 | 
| 1180 |         get: () => resolve
 | 
| 1181 |       });
 | 
| 1182 |     } else if (this.state.error) {
 | 
| 1183 |       
 | 
| 1184 |       status = AwaitRenderStatus.error;
 | 
| 1185 |       let renderError = this.state.error;
 | 
| 1186 |       promise = Promise.reject().catch(() => {}); 
 | 
| 1187 |       Object.defineProperty(promise, "_tracked", {
 | 
| 1188 |         get: () => true
 | 
| 1189 |       });
 | 
| 1190 |       Object.defineProperty(promise, "_error", {
 | 
| 1191 |         get: () => renderError
 | 
| 1192 |       });
 | 
| 1193 |     } else if (resolve._tracked) {
 | 
| 1194 |       
 | 
| 1195 |       promise = resolve;
 | 
| 1196 |       status = "_error" in promise ? AwaitRenderStatus.error : "_data" in promise ? AwaitRenderStatus.success : AwaitRenderStatus.pending;
 | 
| 1197 |     } else {
 | 
| 1198 |       
 | 
| 1199 |       status = AwaitRenderStatus.pending;
 | 
| 1200 |       Object.defineProperty(resolve, "_tracked", {
 | 
| 1201 |         get: () => true
 | 
| 1202 |       });
 | 
| 1203 |       promise = resolve.then(data => Object.defineProperty(resolve, "_data", {
 | 
| 1204 |         get: () => data
 | 
| 1205 |       }), error => Object.defineProperty(resolve, "_error", {
 | 
| 1206 |         get: () => error
 | 
| 1207 |       }));
 | 
| 1208 |     }
 | 
| 1209 |     if (status === AwaitRenderStatus.error && promise._error instanceof AbortedDeferredError) {
 | 
| 1210 |       
 | 
| 1211 |       throw neverSettledPromise;
 | 
| 1212 |     }
 | 
| 1213 |     if (status === AwaitRenderStatus.error && !errorElement) {
 | 
| 1214 |       
 | 
| 1215 |       throw promise._error;
 | 
| 1216 |     }
 | 
| 1217 |     if (status === AwaitRenderStatus.error) {
 | 
| 1218 |       
 | 
| 1219 |       return React.createElement(AwaitContext.Provider, {
 | 
| 1220 |         value: promise,
 | 
| 1221 |         children: errorElement
 | 
| 1222 |       });
 | 
| 1223 |     }
 | 
| 1224 |     if (status === AwaitRenderStatus.success) {
 | 
| 1225 |       
 | 
| 1226 |       return React.createElement(AwaitContext.Provider, {
 | 
| 1227 |         value: promise,
 | 
| 1228 |         children: children
 | 
| 1229 |       });
 | 
| 1230 |     }
 | 
| 1231 |     
 | 
| 1232 |     throw promise;
 | 
| 1233 |   }
 | 
| 1234 | }
 | 
| 1235 |  | 
| 1236 |  | 
| 1237 |  | 
| 1238 | 
 | 
| 1239 | function ResolveAwait({
 | 
| 1240 |   children
 | 
| 1241 | }) {
 | 
| 1242 |   let data = useAsyncValue();
 | 
| 1243 |   let toRender = typeof children === "function" ? children(data) : children;
 | 
| 1244 |   return React.createElement(React.Fragment, null, toRender);
 | 
| 1245 | }
 | 
| 1246 | 
 | 
| 1247 | 
 | 
| 1248 | 
 | 
| 1249 |  | 
| 1250 |  | 
| 1251 |  | 
| 1252 |  | 
| 1253 |  | 
| 1254 |  | 
| 1255 | 
 | 
| 1256 | function createRoutesFromChildren(children, parentPath = []) {
 | 
| 1257 |   let routes = [];
 | 
| 1258 |   React.Children.forEach(children, (element, index) => {
 | 
| 1259 |     if (! React.isValidElement(element)) {
 | 
| 1260 |       
 | 
| 1261 |       
 | 
| 1262 |       return;
 | 
| 1263 |     }
 | 
| 1264 |     let treePath = [...parentPath, index];
 | 
| 1265 |     if (element.type === React.Fragment) {
 | 
| 1266 |       
 | 
| 1267 |       routes.push.apply(routes, createRoutesFromChildren(element.props.children, treePath));
 | 
| 1268 |       return;
 | 
| 1269 |     }
 | 
| 1270 |     !(element.type === Route) ? 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;
 | 
| 1271 |     !(!element.props.index || !element.props.children) ? UNSAFE_invariant(false, "An index route cannot have child routes.")  : void 0;
 | 
| 1272 |     let route = {
 | 
| 1273 |       id: element.props.id || treePath.join("-"),
 | 
| 1274 |       caseSensitive: element.props.caseSensitive,
 | 
| 1275 |       element: element.props.element,
 | 
| 1276 |       Component: element.props.Component,
 | 
| 1277 |       index: element.props.index,
 | 
| 1278 |       path: element.props.path,
 | 
| 1279 |       loader: element.props.loader,
 | 
| 1280 |       action: element.props.action,
 | 
| 1281 |       errorElement: element.props.errorElement,
 | 
| 1282 |       ErrorBoundary: element.props.ErrorBoundary,
 | 
| 1283 |       hasErrorBoundary: element.props.ErrorBoundary != null || element.props.errorElement != null,
 | 
| 1284 |       shouldRevalidate: element.props.shouldRevalidate,
 | 
| 1285 |       handle: element.props.handle,
 | 
| 1286 |       lazy: element.props.lazy
 | 
| 1287 |     };
 | 
| 1288 |     if (element.props.children) {
 | 
| 1289 |       route.children = createRoutesFromChildren(element.props.children, treePath);
 | 
| 1290 |     }
 | 
| 1291 |     routes.push(route);
 | 
| 1292 |   });
 | 
| 1293 |   return routes;
 | 
| 1294 | }
 | 
| 1295 |  | 
| 1296 |  | 
| 1297 | 
 | 
| 1298 | function renderMatches(matches) {
 | 
| 1299 |   return _renderMatches(matches);
 | 
| 1300 | }
 | 
| 1301 | 
 | 
| 1302 | function mapRouteProperties(route) {
 | 
| 1303 |   let updates = {
 | 
| 1304 |     
 | 
| 1305 |     
 | 
| 1306 |     hasErrorBoundary: route.ErrorBoundary != null || route.errorElement != null
 | 
| 1307 |   };
 | 
| 1308 |   if (route.Component) {
 | 
| 1309 |     {
 | 
| 1310 |       if (route.element) {
 | 
| 1311 |         UNSAFE_warning(false, "You should not include both `Component` and `element` on your route - " + "`Component` will be used.") ;
 | 
| 1312 |       }
 | 
| 1313 |     }
 | 
| 1314 |     Object.assign(updates, {
 | 
| 1315 |       element: React.createElement(route.Component),
 | 
| 1316 |       Component: undefined
 | 
| 1317 |     });
 | 
| 1318 |   }
 | 
| 1319 |   if (route.HydrateFallback) {
 | 
| 1320 |     {
 | 
| 1321 |       if (route.hydrateFallbackElement) {
 | 
| 1322 |         UNSAFE_warning(false, "You should not include both `HydrateFallback` and `hydrateFallbackElement` on your route - " + "`HydrateFallback` will be used.") ;
 | 
| 1323 |       }
 | 
| 1324 |     }
 | 
| 1325 |     Object.assign(updates, {
 | 
| 1326 |       hydrateFallbackElement: React.createElement(route.HydrateFallback),
 | 
| 1327 |       HydrateFallback: undefined
 | 
| 1328 |     });
 | 
| 1329 |   }
 | 
| 1330 |   if (route.ErrorBoundary) {
 | 
| 1331 |     {
 | 
| 1332 |       if (route.errorElement) {
 | 
| 1333 |         UNSAFE_warning(false, "You should not include both `ErrorBoundary` and `errorElement` on your route - " + "`ErrorBoundary` will be used.") ;
 | 
| 1334 |       }
 | 
| 1335 |     }
 | 
| 1336 |     Object.assign(updates, {
 | 
| 1337 |       errorElement: React.createElement(route.ErrorBoundary),
 | 
| 1338 |       ErrorBoundary: undefined
 | 
| 1339 |     });
 | 
| 1340 |   }
 | 
| 1341 |   return updates;
 | 
| 1342 | }
 | 
| 1343 | function createMemoryRouter(routes, opts) {
 | 
| 1344 |   return createRouter({
 | 
| 1345 |     basename: opts?.basename,
 | 
| 1346 |     future: {
 | 
| 1347 |       ...opts?.future,
 | 
| 1348 |       v7_prependBasename: true
 | 
| 1349 |     },
 | 
| 1350 |     history: createMemoryHistory({
 | 
| 1351 |       initialEntries: opts?.initialEntries,
 | 
| 1352 |       initialIndex: opts?.initialIndex
 | 
| 1353 |     }),
 | 
| 1354 |     hydrationData: opts?.hydrationData,
 | 
| 1355 |     routes,
 | 
| 1356 |     mapRouteProperties,
 | 
| 1357 |     dataStrategy: opts?.dataStrategy,
 | 
| 1358 |     patchRoutesOnNavigation: opts?.patchRoutesOnNavigation
 | 
| 1359 |   }).initialize();
 | 
| 1360 | }
 | 
| 1361 | 
 | 
| 1362 | export { 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 };
 | 
| 1363 | 
 |