New Research: Supply Chain Attack on Axios Pulls Malicious Dependency from npm.Details →
Socket
Book a DemoSign in
Socket
Book a DemoSign in

react-router-dom

Package Overview
Dependencies
Maintainers
3
Versions
1042
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

react-router-dom - npm Package Compare versions

Comparing version
6.15.0
 to
6.17.0
+66
-0
CHANGELOG.md
# `react-router-dom`
## 6.17.0
### Minor Changes
- Add experimental support for the [View Transitions API](https://developer.mozilla.org/en-US/docs/Web/API/ViewTransition) via `document.startViewTransition` to enable CSS animated transitions on SPA navigations in your application. ([#10916](https://github.com/remix-run/react-router/pull/10916))
The simplest approach to enabling a View Transition in your React Router app is via the new `<Link unstable_viewTransition>` prop. This will cause the navigation DOM update to be wrapped in `document.startViewTransition` which will enable transitions for the DOM update. Without any additional CSS styles, you'll get a basic cross-fade animation for your page.
If you need to apply more fine-grained styles for your animations, you can leverage the `unstable_useViewTransitionState` hook which will tell you when a transition is in progress and you can use that to apply classes or styles:
```jsx
function ImageLink(to, src, alt) {
let isTransitioning = unstable_useViewTransitionState(to);
return (
<Link to={to} unstable_viewTransition>
<img
src={src}
alt={alt}
style={{
viewTransitionName: isTransitioning ? "image-expand" : "",
}}
/>
</Link>
);
}
```
You can also use the `<NavLink unstable_viewTransition>` shorthand which will manage the hook usage for you and automatically add a `transitioning` class to the `<a>` during the transition:
```css
a.transitioning img {
view-transition-name: "image-expand";
}
```
```jsx
<NavLink to={to} unstable_viewTransition>
<img src={src} alt={alt} />
</NavLink>
```
For an example usage of View Transitions with React Router, check out [our fork](https://github.com/brophdawg11/react-router-records) of the [Astro Records](https://github.com/Charca/astro-records) demo.
For more information on using the View Transitions API, please refer to the [Smooth and simple transitions with the View Transitions API](https://developer.chrome.com/docs/web-platform/view-transitions/) guide from the Google Chrome team.
Please note, that because the `ViewTransition` API is a DOM API, we now export a specific `RouterProvider` from `react-router-dom` with this functionality. If you are importing `RouterProvider` from `react-router`, then it will not support view transitions. ([#10928](https://github.com/remix-run/react-router/pull/10928)
### Patch Changes
- Log a warning and fail gracefully in `ScrollRestoration` when `sessionStorage` is unavailable ([#10848](https://github.com/remix-run/react-router/pull/10848))
- Updated dependencies:
- `@remix-run/router@1.10.0`
- `react-router@6.17.0`
## 6.16.0
### Minor Changes
- Updated dependencies:
- `@remix-run/router@1.9.0`
- `react-router@6.16.0`
### Patch Changes
- Properly encode rendered URIs in server rendering to avoid hydration errors ([#10769](https://github.com/remix-run/react-router/pull/10769))
## 6.15.0

@@ -4,0 +70,0 @@ 

+4
-0
dist/dom.d.ts

@@ -80,2 +80,6 @@ import type { FormEncType, HTMLFormMethod, RelativeRoutingType } from "@remix-run/router";

preventScrollReset?: boolean;
/**
* Enable view transitions on this submission navigation
*/
unstable_viewTransition?: boolean;
}

@@ -82,0 +86,0 @@ export declare function getFormSubmissionInfo(target: SubmitTarget, basename: string): {

+55
-18
dist/index.d.ts

@@ -6,3 +6,3 @@ /**

import * as React from "react";
import type { FutureConfig, NavigateOptions, RelativeRoutingType, RouteObject, To } from "react-router";
import type { FutureConfig, Location, NavigateOptions, RelativeRoutingType, RouteObject, RouterProviderProps, To } from "react-router";
import type { Fetcher, FormEncType, FormMethod, FutureConfig as RouterFutureConfig, GetScrollRestorationKeyFunction, History, HTMLFormMethod, HydrationState, Router as RemixRouter, V7_FormMethod } from "@remix-run/router";

@@ -13,4 +13,4 @@ import type { SubmitOptions, ParamKeyValuePair, URLSearchParamsInit, SubmitTarget } from "./dom";

export { createSearchParams };
export type { ActionFunction, ActionFunctionArgs, AwaitProps, unstable_Blocker, unstable_BlockerFunction, DataRouteMatch, DataRouteObject, Fetcher, Hash, IndexRouteObject, IndexRouteProps, JsonFunction, LazyRouteFunction, LayoutRouteProps, LoaderFunction, LoaderFunctionArgs, Location, MemoryRouterProps, NavigateFunction, NavigateOptions, NavigateProps, Navigation, Navigator, NonIndexRouteObject, OutletProps, Params, ParamParseKey, Path, PathMatch, Pathname, PathPattern, PathRouteProps, RedirectFunction, RelativeRoutingType, RouteMatch, RouteObject, RouteProps, RouterProps, RouterProviderProps, RoutesProps, Search, ShouldRevalidateFunction, To, } from "react-router";
export { AbortedDeferredError, Await, MemoryRouter, Navigate, NavigationType, Outlet, Route, Router, RouterProvider, Routes, createMemoryRouter, createPath, createRoutesFromChildren, createRoutesFromElements, defer, isRouteErrorResponse, generatePath, json, matchPath, matchRoutes, parsePath, redirect, redirectDocument, renderMatches, resolvePath, useActionData, useAsyncError, useAsyncValue, unstable_useBlocker, useHref, useInRouterContext, useLoaderData, useLocation, useMatch, useMatches, useNavigate, useNavigation, useNavigationType, useOutlet, useOutletContext, useParams, useResolvedPath, useRevalidator, useRouteError, useRouteLoaderData, useRoutes, } from "react-router";
export type { ActionFunction, ActionFunctionArgs, AwaitProps, unstable_Blocker, unstable_BlockerFunction, DataRouteMatch, DataRouteObject, ErrorResponse, Fetcher, Hash, IndexRouteObject, IndexRouteProps, JsonFunction, LazyRouteFunction, LayoutRouteProps, LoaderFunction, LoaderFunctionArgs, Location, MemoryRouterProps, NavigateFunction, NavigateOptions, NavigateProps, Navigation, Navigator, NonIndexRouteObject, OutletProps, Params, ParamParseKey, Path, PathMatch, Pathname, PathPattern, PathRouteProps, RedirectFunction, RelativeRoutingType, RouteMatch, RouteObject, RouteProps, RouterProps, RouterProviderProps, RoutesProps, Search, ShouldRevalidateFunction, ShouldRevalidateFunctionArgs, To, UIMatch, } from "react-router";
export { AbortedDeferredError, Await, MemoryRouter, Navigate, NavigationType, Outlet, Route, Router, Routes, createMemoryRouter, createPath, createRoutesFromChildren, createRoutesFromElements, defer, isRouteErrorResponse, generatePath, json, matchPath, matchRoutes, parsePath, redirect, redirectDocument, renderMatches, resolvePath, useActionData, useAsyncError, useAsyncValue, unstable_useBlocker, useHref, useInRouterContext, useLoaderData, useLocation, useMatch, useMatches, useNavigate, useNavigation, useNavigationType, useOutlet, useOutletContext, useParams, useResolvedPath, useRevalidator, useRouteError, useRouteLoaderData, useRoutes, } from "react-router";
/** @internal */

@@ -20,2 +20,5 @@ export { UNSAFE_DataRouterContext, UNSAFE_DataRouterStateContext, UNSAFE_NavigationContext, UNSAFE_LocationContext, UNSAFE_RouteContext, UNSAFE_useRouteId, } from "react-router";

var __staticRouterHydrationData: HydrationState | undefined;
interface Document {
startViewTransition(cb: () => Promise<void> | void): ViewTransition;
}
}

@@ -30,2 +33,21 @@ interface DOMRouterOpts {

export declare function createHashRouter(routes: RouteObject[], opts?: DOMRouterOpts): RemixRouter;
type ViewTransitionContextObject = {
isTransitioning: false;
} | {
isTransitioning: true;
currentLocation: Location;
nextLocation: Location;
};
declare const ViewTransitionContext: React.Context<ViewTransitionContextObject>;
export { ViewTransitionContext as UNSAFE_ViewTransitionContext };
interface ViewTransition {
finished: Promise<void>;
ready: Promise<void>;
updateCallbackDone: Promise<void>;
skipTransition(): void;
}
/**
* Given a Remix Router instance, render the appropriate UI
*/
export declare function RouterProvider({ fallbackElement, router, future, }: RouterProviderProps): React.ReactElement;
export interface BrowserRouterProps {

@@ -76,25 +98,23 @@ basename?: string;

to: To;
unstable_viewTransition?: boolean;
}
/**
* The public API for rendering a history-aware <a>.
* The public API for rendering a history-aware `<a>`.
*/
export declare const Link: React.ForwardRefExoticComponent<LinkProps & React.RefAttributes<HTMLAnchorElement>>;
type NavLinkRenderProps = {
isActive: boolean;
isPending: boolean;
isTransitioning: boolean;
};
export interface NavLinkProps extends Omit<LinkProps, "className" | "style" | "children"> {
children?: React.ReactNode | ((props: {
isActive: boolean;
isPending: boolean;
}) => React.ReactNode);
children?: React.ReactNode | ((props: NavLinkRenderProps) => React.ReactNode);
caseSensitive?: boolean;
className?: string | ((props: {
isActive: boolean;
isPending: boolean;
}) => string | undefined);
className?: string | ((props: NavLinkRenderProps) => string | undefined);
end?: boolean;
style?: React.CSSProperties | ((props: {
isActive: boolean;
isPending: boolean;
}) => React.CSSProperties | undefined);
style?: React.CSSProperties | ((props: NavLinkRenderProps) => React.CSSProperties | undefined);
unstable_viewTransition?: boolean;
}
/**
* A <Link> wrapper that knows if it's "active" or not.
* A `<Link>` wrapper that knows if it's "active" or not.
*/

@@ -149,2 +169,6 @@ export declare const NavLink: React.ForwardRefExoticComponent<NavLinkProps & React.RefAttributes<HTMLAnchorElement>>;

state?: any;
/**
* Enable view transitions on this Form navigation
*/
unstable_viewTransition?: boolean;
}

@@ -175,3 +199,3 @@ /**

*/
export declare function useLinkClickHandler<E extends Element = HTMLAnchorElement>(to: To, { target, replace: replaceProp, state, preventScrollReset, relative, }?: {
export declare function useLinkClickHandler<E extends Element = HTMLAnchorElement>(to: To, { target, replace: replaceProp, state, preventScrollReset, relative, unstable_viewTransition, }?: {
target?: React.HTMLAttributeAnchorTarget;

@@ -182,2 +206,3 @@ replace?: boolean;

relative?: RelativeRoutingType;
unstable_viewTransition?: boolean;
}): (event: React.MouseEvent<E, MouseEvent>) => void;

@@ -272,1 +297,13 @@ /**

export { usePrompt as unstable_usePrompt };
/**
* Return a boolean indicating if there is an active view transition to the
* given href. You can use this value to render CSS classes or viewTransitionName
* styles onto your elements
*
* @param href The destination href
* @param [opts.relative] Relative routing type ("route" | "path")
*/
declare function useViewTransitionState(to: To, opts?: {
relative?: RelativeRoutingType;
}): boolean;
export { useViewTransitionState as unstable_useViewTransitionState };
+302
-55
dist/index.js
/**
* React Router DOM v6.15.0
* React Router DOM v6.17.0
*

@@ -12,5 +12,5 @@ * Copyright (c) Remix Software Inc.

import * as React from 'react';
import { UNSAFE_mapRouteProperties, Router, UNSAFE_NavigationContext, useHref, useResolvedPath, useLocation, UNSAFE_DataRouterStateContext, useNavigate, createPath, UNSAFE_useRouteId, UNSAFE_RouteContext, useMatches, useNavigation, unstable_useBlocker, UNSAFE_DataRouterContext } from 'react-router';
export { AbortedDeferredError, Await, MemoryRouter, Navigate, NavigationType, Outlet, Route, Router, RouterProvider, Routes, UNSAFE_DataRouterContext, UNSAFE_DataRouterStateContext, UNSAFE_LocationContext, UNSAFE_NavigationContext, UNSAFE_RouteContext, UNSAFE_useRouteId, createMemoryRouter, createPath, createRoutesFromChildren, createRoutesFromElements, defer, generatePath, isRouteErrorResponse, json, matchPath, matchRoutes, parsePath, redirect, redirectDocument, renderMatches, resolvePath, unstable_useBlocker, useActionData, useAsyncError, useAsyncValue, useHref, useInRouterContext, useLoaderData, useLocation, useMatch, useMatches, useNavigate, useNavigation, useNavigationType, useOutlet, useOutletContext, useParams, useResolvedPath, useRevalidator, useRouteError, useRouteLoaderData, useRoutes } from 'react-router';
import { stripBasename, UNSAFE_warning, createRouter, createBrowserHistory, createHashHistory, ErrorResponse, UNSAFE_invariant, joinPaths } from '@remix-run/router';
import { UNSAFE_mapRouteProperties, UNSAFE_DataRouterContext, UNSAFE_DataRouterStateContext, Router, UNSAFE_useRoutesImpl, UNSAFE_NavigationContext, useHref, useResolvedPath, useLocation, useNavigate, createPath, UNSAFE_useRouteId, UNSAFE_RouteContext, useMatches, useNavigation, unstable_useBlocker } from 'react-router';
export { AbortedDeferredError, Await, MemoryRouter, Navigate, NavigationType, Outlet, Route, Router, Routes, UNSAFE_DataRouterContext, UNSAFE_DataRouterStateContext, UNSAFE_LocationContext, UNSAFE_NavigationContext, UNSAFE_RouteContext, UNSAFE_useRouteId, createMemoryRouter, createPath, createRoutesFromChildren, createRoutesFromElements, defer, generatePath, isRouteErrorResponse, json, matchPath, matchRoutes, parsePath, redirect, redirectDocument, renderMatches, resolvePath, unstable_useBlocker, useActionData, useAsyncError, useAsyncValue, useHref, useInRouterContext, useLoaderData, useLocation, useMatch, useMatches, useNavigate, useNavigation, useNavigationType, useOutlet, useOutletContext, useParams, useResolvedPath, useRevalidator, useRouteError, useRouteLoaderData, useRoutes } from 'react-router';
import { stripBasename, UNSAFE_warning, createRouter, createBrowserHistory, createHashHistory, UNSAFE_ErrorResponseImpl, UNSAFE_invariant, joinPaths, matchPath } from '@remix-run/router';

@@ -210,5 +210,5 @@ function _extends() {

const _excluded = ["onClick", "relative", "reloadDocument", "replace", "state", "target", "to", "preventScrollReset"],
_excluded2 = ["aria-current", "caseSensitive", "className", "end", "style", "to", "children"],
_excluded3 = ["reloadDocument", "replace", "state", "method", "action", "onSubmit", "submit", "relative", "preventScrollReset"];
const _excluded = ["onClick", "relative", "reloadDocument", "replace", "state", "target", "to", "preventScrollReset", "unstable_viewTransition"],
_excluded2 = ["aria-current", "caseSensitive", "className", "end", "style", "to", "unstable_viewTransition", "children"],
_excluded3 = ["reloadDocument", "replace", "state", "method", "action", "onSubmit", "submit", "relative", "preventScrollReset", "unstable_viewTransition"];
function createBrowserRouter(routes, opts) {

@@ -225,3 +225,4 @@ return createRouter({

routes,
mapRouteProperties: UNSAFE_mapRouteProperties
mapRouteProperties: UNSAFE_mapRouteProperties,
window: opts == null ? void 0 : opts.window
}).initialize();

@@ -240,3 +241,4 @@ }

routes,
mapRouteProperties: UNSAFE_mapRouteProperties
mapRouteProperties: UNSAFE_mapRouteProperties,
window: opts == null ? void 0 : opts.window
}).initialize();

@@ -262,3 +264,3 @@ }

if (val && val.__type === "RouteErrorResponse") {
serialized[key] = new ErrorResponse(val.status, val.statusText, val.data, val.internal === true);
serialized[key] = new UNSAFE_ErrorResponseImpl(val.status, val.statusText, val.data, val.internal === true);
} else if (val && val.__type === "Error") {

@@ -294,2 +296,8 @@ // Attempt to reconstruct the right type of Error (i.e., ReferenceError)

}
const ViewTransitionContext = /*#__PURE__*/React.createContext({
isTransitioning: false
});
if (process.env.NODE_ENV !== "production") {
ViewTransitionContext.displayName = "ViewTransition";
}
//#endregion

@@ -322,6 +330,190 @@ ////////////////////////////////////////////////////////////////////////////////

const startTransitionImpl = React[START_TRANSITION];
function startTransitionSafe(cb) {
if (startTransitionImpl) {
startTransitionImpl(cb);
} else {
cb();
}
}
class Deferred {
constructor() {
this.status = "pending";
this.promise = new Promise((resolve, reject) => {
this.resolve = value => {
if (this.status === "pending") {
this.status = "resolved";
resolve(value);
}
};
this.reject = reason => {
if (this.status === "pending") {
this.status = "rejected";
reject(reason);
}
};
});
}
}
/**
* Given a Remix Router instance, render the appropriate UI
*/
function RouterProvider(_ref) {
let {
fallbackElement,
router,
future
} = _ref;
let [state, setStateImpl] = React.useState(router.state);
let [pendingState, setPendingState] = React.useState();
let [vtContext, setVtContext] = React.useState({
isTransitioning: false
});
let [renderDfd, setRenderDfd] = React.useState();
let [transition, setTransition] = React.useState();
let [interruption, setInterruption] = React.useState();
let {
v7_startTransition
} = future || {};
let optInStartTransition = React.useCallback(cb => {
if (v7_startTransition) {
startTransitionSafe(cb);
} else {
cb();
}
}, [v7_startTransition]);
let setState = React.useCallback((newState, _ref2) => {
let {
unstable_viewTransitionOpts: viewTransitionOpts
} = _ref2;
if (!viewTransitionOpts || router.window == null || typeof router.window.document.startViewTransition !== "function") {
// Mid-navigation state update, or startViewTransition isn't available
optInStartTransition(() => setStateImpl(newState));
} else if (transition && renderDfd) {
// Interrupting an in-progress transition, cancel and let everything flush
// out, and then kick off a new transition from the interruption state
renderDfd.resolve();
transition.skipTransition();
setInterruption({
state: newState,
currentLocation: viewTransitionOpts.currentLocation,
nextLocation: viewTransitionOpts.nextLocation
});
} else {
// Completed navigation update with opted-in view transitions, let 'er rip
setPendingState(newState);
setVtContext({
isTransitioning: true,
currentLocation: viewTransitionOpts.currentLocation,
nextLocation: viewTransitionOpts.nextLocation
});
}
}, [optInStartTransition, transition, renderDfd, router.window]);
// Need to use a layout effect here so we are subscribed early enough to
// pick up on any render-driven redirects/navigations (useEffect/<Navigate>)
React.useLayoutEffect(() => router.subscribe(setState), [router, setState]);
// When we start a view transition, create a Deferred we can use for the
// eventual "completed" render
React.useEffect(() => {
if (vtContext.isTransitioning) {
setRenderDfd(new Deferred());
}
}, [vtContext.isTransitioning]);
// Once the deferred is created, kick off startViewTransition() to update the
// DOM and then wait on the Deferred to resolve (indicating the DOM update has
// happened)
React.useEffect(() => {
if (renderDfd && pendingState && router.window) {
let newState = pendingState;
let renderPromise = renderDfd.promise;
let transition = router.window.document.startViewTransition(async () => {
optInStartTransition(() => setStateImpl(newState));
await renderPromise;
});
transition.finished.finally(() => {
setRenderDfd(undefined);
setTransition(undefined);
setPendingState(undefined);
setVtContext({
isTransitioning: false
});
});
setTransition(transition);
}
}, [optInStartTransition, pendingState, renderDfd, router.window]);
// When the new location finally renders and is committed to the DOM, this
// effect will run to resolve the transition
React.useEffect(() => {
if (renderDfd && pendingState && state.location.key === pendingState.location.key) {
renderDfd.resolve();
}
}, [renderDfd, transition, state.location, pendingState]);
// If we get interrupted with a new navigation during a transition, we skip
// the active transition, let it cleanup, then kick it off again here
React.useEffect(() => {
if (!vtContext.isTransitioning && interruption) {
setPendingState(interruption.state);
setVtContext({
isTransitioning: true,
currentLocation: interruption.currentLocation,
nextLocation: interruption.nextLocation
});
setInterruption(undefined);
}
}, [vtContext.isTransitioning, interruption]);
let navigator = React.useMemo(() => {
return {
createHref: router.createHref,
encodeLocation: router.encodeLocation,
go: n => router.navigate(n),
push: (to, state, opts) => router.navigate(to, {
state,
preventScrollReset: opts == null ? void 0 : opts.preventScrollReset
}),
replace: (to, state, opts) => router.navigate(to, {
replace: true,
state,
preventScrollReset: opts == null ? void 0 : opts.preventScrollReset
})
};
}, [router]);
let basename = router.basename || "/";
let dataRouterContext = React.useMemo(() => ({
router,
navigator,
static: false,
basename
}), [router, navigator, basename]);
// The fragment and {null} here are important! We need them to keep React 18's
// useId happy when we are server-rendering since we may have a <script> here
// containing the hydrated server-side staticContext (from StaticRouterProvider).
// useId relies on the component tree structure to generate deterministic id's
// so we need to ensure it remains the same on the client even though
// we don't need the <script> tag
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(UNSAFE_DataRouterContext.Provider, {
value: dataRouterContext
}, /*#__PURE__*/React.createElement(UNSAFE_DataRouterStateContext.Provider, {
value: state
}, /*#__PURE__*/React.createElement(ViewTransitionContext.Provider, {
value: vtContext
}, /*#__PURE__*/React.createElement(Router, {
basename: basename,
location: state.location,
navigationType: state.historyAction,
navigator: navigator
}, state.initialized ? /*#__PURE__*/React.createElement(DataRoutes, {
routes: router.routes,
state: state
}) : fallbackElement)))), null);
}
function DataRoutes(_ref3) {
let {
routes,
state
} = _ref3;
return UNSAFE_useRoutesImpl(routes, undefined, state);
}
/**
* A `<Router>` for use in web browsers. Provides the cleanest URLs.
*/
function BrowserRouter(_ref) {
function BrowserRouter(_ref4) {
let {

@@ -332,3 +524,3 @@ basename,

window
} = _ref;
} = _ref4;
let historyRef = React.useRef();

@@ -365,3 +557,3 @@ if (historyRef.current == null) {

*/
function HashRouter(_ref2) {
function HashRouter(_ref5) {
let {

@@ -372,3 +564,3 @@ basename,

window
} = _ref2;
} = _ref5;
let historyRef = React.useRef();

@@ -407,3 +599,3 @@ if (historyRef.current == null) {

*/
function HistoryRouter(_ref3) {
function HistoryRouter(_ref6) {
let {

@@ -414,3 +606,3 @@ basename,

history
} = _ref3;
} = _ref6;
let [state, setStateImpl] = React.useState({

@@ -441,5 +633,5 @@ action: history.action,

/**
* The public API for rendering a history-aware <a>.
* The public API for rendering a history-aware `<a>`.
*/
const Link = /*#__PURE__*/React.forwardRef(function LinkWithRef(_ref4, ref) {
const Link = /*#__PURE__*/React.forwardRef(function LinkWithRef(_ref7, ref) {
let {

@@ -453,5 +645,6 @@ onClick,

to,
preventScrollReset
} = _ref4,
rest = _objectWithoutPropertiesLoose(_ref4, _excluded);
preventScrollReset,
unstable_viewTransition
} = _ref7,
rest = _objectWithoutPropertiesLoose(_ref7, _excluded);
let {

@@ -493,3 +686,4 @@ basename

preventScrollReset,
relative
relative,
unstable_viewTransition
});

@@ -517,5 +711,5 @@ function handleClick(event) {

/**
* A <Link> wrapper that knows if it's "active" or not.
* A `<Link>` wrapper that knows if it's "active" or not.
*/
const NavLink = /*#__PURE__*/React.forwardRef(function NavLinkWithRef(_ref5, ref) {
const NavLink = /*#__PURE__*/React.forwardRef(function NavLinkWithRef(_ref8, ref) {
let {

@@ -528,5 +722,6 @@ "aria-current": ariaCurrentProp = "page",

to,
unstable_viewTransition,
children
} = _ref5,
rest = _objectWithoutPropertiesLoose(_ref5, _excluded2);
} = _ref8,
rest = _objectWithoutPropertiesLoose(_ref8, _excluded2);
let path = useResolvedPath(to, {

@@ -540,2 +735,6 @@ relative: rest.relative

} = React.useContext(UNSAFE_NavigationContext);
let isTransitioning = routerState != null &&
// Conditional usage is OK here because the usage of a data router is static
// eslint-disable-next-line react-hooks/rules-of-hooks
useViewTransitionState(path) && unstable_viewTransition === true;
let toPathname = navigator.encodeLocation ? navigator.encodeLocation(path).pathname : path.pathname;

@@ -551,9 +750,11 @@ let locationPathname = location.pathname;

let isPending = nextLocationPathname != null && (nextLocationPathname === toPathname || !end && nextLocationPathname.startsWith(toPathname) && nextLocationPathname.charAt(toPathname.length) === "/");
let renderProps = {
isActive,
isPending,
isTransitioning
};
let ariaCurrent = isActive ? ariaCurrentProp : undefined;
let className;
if (typeof classNameProp === "function") {
className = classNameProp({
isActive,
isPending
});
className = classNameProp(renderProps);
} else {

@@ -565,8 +766,5 @@ // If the className prop is not a function, we use a default `active`

// simple styling rules working as they currently do.
className = [classNameProp, isActive ? "active" : null, isPending ? "pending" : null].filter(Boolean).join(" ");
className = [classNameProp, isActive ? "active" : null, isPending ? "pending" : null, isTransitioning ? "transitioning" : null].filter(Boolean).join(" ");
}
let style = typeof styleProp === "function" ? styleProp({
isActive,
isPending
}) : styleProp;
let style = typeof styleProp === "function" ? styleProp(renderProps) : styleProp;
return /*#__PURE__*/React.createElement(Link, _extends({}, rest, {

@@ -577,7 +775,5 @@ "aria-current": ariaCurrent,

style: style,
to: to
}), typeof children === "function" ? children({
isActive,
isPending
}) : children);
to: to,
unstable_viewTransition: unstable_viewTransition
}), typeof children === "function" ? children(renderProps) : children);
});

@@ -603,3 +799,3 @@ if (process.env.NODE_ENV !== "production") {

}
const FormImpl = /*#__PURE__*/React.forwardRef((_ref6, forwardedRef) => {
const FormImpl = /*#__PURE__*/React.forwardRef((_ref9, forwardedRef) => {
let {

@@ -614,5 +810,6 @@ reloadDocument,

relative,
preventScrollReset
} = _ref6,
props = _objectWithoutPropertiesLoose(_ref6, _excluded3);
preventScrollReset,
unstable_viewTransition
} = _ref9,
props = _objectWithoutPropertiesLoose(_ref9, _excluded3);
let formMethod = method.toLowerCase() === "get" ? "get" : "post";

@@ -633,3 +830,4 @@ let formAction = useFormAction(action, {

relative,
preventScrollReset
preventScrollReset,
unstable_viewTransition
});

@@ -651,7 +849,7 @@ };

*/
function ScrollRestoration(_ref7) {
function ScrollRestoration(_ref10) {
let {
getKey,
storageKey
} = _ref7;
} = _ref10;
useScrollRestoration({

@@ -676,2 +874,3 @@ getKey,

DataRouterHook["UseFetcher"] = "useFetcher";
DataRouterHook["useViewTransitionState"] = "useViewTransitionState";
})(DataRouterHook || (DataRouterHook = {}));

@@ -707,3 +906,4 @@ var DataRouterStateHook;

preventScrollReset,
relative
relative,
unstable_viewTransition
} = _temp === void 0 ? {} : _temp;

@@ -725,6 +925,7 @@ let navigate = useNavigate();

preventScrollReset,
relative
relative,
unstable_viewTransition
});
}
}, [location, navigate, path, replaceProp, state, target, to, preventScrollReset, relative]);
}, [location, navigate, path, replaceProp, state, target, to, preventScrollReset, relative, unstable_viewTransition]);
}

@@ -790,3 +991,4 @@ /**

state: options.state,
fromRouteId: currentRouteId
fromRouteId: currentRouteId,
unstable_viewTransition: options.unstable_viewTransition
});

@@ -889,2 +1091,3 @@ }, [router, basename, currentRouteId]);

let fetcherId = 0;
// TODO: (v7) Change the useFetcher generic default from `any` to `unknown`
/**

@@ -978,3 +1181,7 @@ * Interacts with route loaders and actions without causing a navigation. Great

}
sessionStorage.setItem(storageKey || SCROLL_RESTORATION_STORAGE_KEY, JSON.stringify(savedScrollPositions));
try {
sessionStorage.setItem(storageKey || SCROLL_RESTORATION_STORAGE_KEY, JSON.stringify(savedScrollPositions));
} catch (error) {
process.env.NODE_ENV !== "production" ? UNSAFE_warning(false, "Failed to save scroll positions in sessionStorage, <ScrollRestoration /> will not work properly (" + error + ").") : void 0;
}
window.history.scrollRestoration = "auto";

@@ -1086,7 +1293,7 @@ }, [storageKey, getKey, navigation.state, location, matches]));

*/
function usePrompt(_ref8) {
function usePrompt(_ref11) {
let {
when,
message
} = _ref8;
} = _ref11;
let blocker = unstable_useBlocker(when);

@@ -1112,5 +1319,45 @@ React.useEffect(() => {

}
/**
* Return a boolean indicating if there is an active view transition to the
* given href. You can use this value to render CSS classes or viewTransitionName
* styles onto your elements
*
* @param href The destination href
* @param [opts.relative] Relative routing type ("route" | "path")
*/
function useViewTransitionState(to, opts) {
if (opts === void 0) {
opts = {};
}
let vtContext = React.useContext(ViewTransitionContext);
!(vtContext != null) ? process.env.NODE_ENV !== "production" ? UNSAFE_invariant(false, "`unstable_useViewTransitionState` must be used within `react-router-dom`'s `RouterProvider`. " + "Did you accidentally import `RouterProvider` from `react-router`?") : UNSAFE_invariant(false) : void 0;
let {
basename
} = useDataRouterContext(DataRouterHook.useViewTransitionState);
let path = useResolvedPath(to, {
relative: opts.relative
});
if (!vtContext.isTransitioning) {
return false;
}
let currentPath = stripBasename(vtContext.currentLocation.pathname, basename) || vtContext.currentLocation.pathname;
let nextPath = stripBasename(vtContext.nextLocation.pathname, basename) || vtContext.nextLocation.pathname;
// Transition is active if we're going to or coming from the indicated
// destination. This ensures that other PUSH navigations that reverse
// an indicated transition apply. I.e., on the list view you have:
//
// <NavLink to="/details/1" unstable_viewTransition>
//
// If you click the breadcrumb back to the list view:
//
// <NavLink to="/list" unstable_viewTransition>
//
// We should apply the transition because it's indicated as active going
// from /list -> /details/1 and therefore should be active on the reverse
// (even though this isn't strictly a POP reverse)
return matchPath(path.pathname, nextPath) != null || matchPath(path.pathname, currentPath) != null;
}
//#endregion
export { BrowserRouter, Form, HashRouter, Link, NavLink, ScrollRestoration, useScrollRestoration as UNSAFE_useScrollRestoration, createBrowserRouter, createHashRouter, createSearchParams, HistoryRouter as unstable_HistoryRouter, usePrompt as unstable_usePrompt, useBeforeUnload, useFetcher, useFetchers, useFormAction, useLinkClickHandler, useSearchParams, useSubmit };
export { BrowserRouter, Form, HashRouter, Link, NavLink, RouterProvider, ScrollRestoration, ViewTransitionContext as UNSAFE_ViewTransitionContext, useScrollRestoration as UNSAFE_useScrollRestoration, createBrowserRouter, createHashRouter, createSearchParams, HistoryRouter as unstable_HistoryRouter, usePrompt as unstable_usePrompt, useViewTransitionState as unstable_useViewTransitionState, useBeforeUnload, useFetcher, useFetchers, useFormAction, useLinkClickHandler, useSearchParams, useSubmit };
//# sourceMappingURL=index.js.map
+1
-1
dist/main.js
/**
* React Router DOM v6.15.0
* React Router DOM v6.17.0
*

@@ -4,0 +4,0 @@ * Copyright (c) Remix Software Inc.

+292
-31
dist/react-router-dom.development.js
/**
* React Router DOM v6.15.0
* React Router DOM v6.17.0
*

@@ -12,5 +12,5 @@ * Copyright (c) Remix Software Inc.

import * as React from 'react';
import { UNSAFE_mapRouteProperties, Router, UNSAFE_NavigationContext, useHref, useResolvedPath, useLocation, UNSAFE_DataRouterStateContext, useNavigate, createPath, UNSAFE_useRouteId, UNSAFE_RouteContext, useMatches, useNavigation, unstable_useBlocker, UNSAFE_DataRouterContext } from 'react-router';
export { AbortedDeferredError, Await, MemoryRouter, Navigate, NavigationType, Outlet, Route, Router, RouterProvider, Routes, UNSAFE_DataRouterContext, UNSAFE_DataRouterStateContext, UNSAFE_LocationContext, UNSAFE_NavigationContext, UNSAFE_RouteContext, UNSAFE_useRouteId, createMemoryRouter, createPath, createRoutesFromChildren, createRoutesFromElements, defer, generatePath, isRouteErrorResponse, json, matchPath, matchRoutes, parsePath, redirect, redirectDocument, renderMatches, resolvePath, unstable_useBlocker, useActionData, useAsyncError, useAsyncValue, useHref, useInRouterContext, useLoaderData, useLocation, useMatch, useMatches, useNavigate, useNavigation, useNavigationType, useOutlet, useOutletContext, useParams, useResolvedPath, useRevalidator, useRouteError, useRouteLoaderData, useRoutes } from 'react-router';
import { stripBasename, UNSAFE_warning, createRouter, createBrowserHistory, createHashHistory, ErrorResponse, UNSAFE_invariant, joinPaths } from '@remix-run/router';
import { UNSAFE_mapRouteProperties, UNSAFE_DataRouterContext, UNSAFE_DataRouterStateContext, Router, UNSAFE_useRoutesImpl, UNSAFE_NavigationContext, useHref, useResolvedPath, useLocation, useNavigate, createPath, UNSAFE_useRouteId, UNSAFE_RouteContext, useMatches, useNavigation, unstable_useBlocker } from 'react-router';
export { AbortedDeferredError, Await, MemoryRouter, Navigate, NavigationType, Outlet, Route, Router, Routes, UNSAFE_DataRouterContext, UNSAFE_DataRouterStateContext, UNSAFE_LocationContext, UNSAFE_NavigationContext, UNSAFE_RouteContext, UNSAFE_useRouteId, createMemoryRouter, createPath, createRoutesFromChildren, createRoutesFromElements, defer, generatePath, isRouteErrorResponse, json, matchPath, matchRoutes, parsePath, redirect, redirectDocument, renderMatches, resolvePath, unstable_useBlocker, useActionData, useAsyncError, useAsyncValue, useHref, useInRouterContext, useLoaderData, useLocation, useMatch, useMatches, useNavigate, useNavigation, useNavigationType, useOutlet, useOutletContext, useParams, useResolvedPath, useRevalidator, useRouteError, useRouteLoaderData, useRoutes } from 'react-router';
import { stripBasename, UNSAFE_warning, createRouter, createBrowserHistory, createHashHistory, UNSAFE_ErrorResponseImpl, UNSAFE_invariant, joinPaths, matchPath } from '@remix-run/router';

@@ -210,3 +210,4 @@ const defaultMethod = "get";

routes,
mapRouteProperties: UNSAFE_mapRouteProperties
mapRouteProperties: UNSAFE_mapRouteProperties,
window: opts?.window
}).initialize();

@@ -226,3 +227,4 @@ }

routes,
mapRouteProperties: UNSAFE_mapRouteProperties
mapRouteProperties: UNSAFE_mapRouteProperties,
window: opts?.window
}).initialize();

@@ -248,3 +250,3 @@ }

if (val && val.__type === "RouteErrorResponse") {
serialized[key] = new ErrorResponse(val.status, val.statusText, val.data, val.internal === true);
serialized[key] = new UNSAFE_ErrorResponseImpl(val.status, val.statusText, val.data, val.internal === true);
} else if (val && val.__type === "Error") {

@@ -284,2 +286,14 @@ // Attempt to reconstruct the right type of Error (i.e., ReferenceError)

////////////////////////////////////////////////////////////////////////////////
//#region Contexts
////////////////////////////////////////////////////////////////////////////////
const ViewTransitionContext = /*#__PURE__*/React.createContext({
isTransitioning: false
});
{
ViewTransitionContext.displayName = "ViewTransition";
}
//#endregion
////////////////////////////////////////////////////////////////////////////////
//#region Components

@@ -311,3 +325,196 @@ ////////////////////////////////////////////////////////////////////////////////

const startTransitionImpl = React[START_TRANSITION];
function startTransitionSafe(cb) {
if (startTransitionImpl) {
startTransitionImpl(cb);
} else {
cb();
}
}
class Deferred {
status = "pending";
// @ts-expect-error - no initializer
// @ts-expect-error - no initializer
constructor() {
this.promise = new Promise((resolve, reject) => {
this.resolve = value => {
if (this.status === "pending") {
this.status = "resolved";
resolve(value);
}
};
this.reject = reason => {
if (this.status === "pending") {
this.status = "rejected";
reject(reason);
}
};
});
}
}
/**
* Given a Remix Router instance, render the appropriate UI
*/
function RouterProvider({
fallbackElement,
router,
future
}) {
let [state, setStateImpl] = React.useState(router.state);
let [pendingState, setPendingState] = React.useState();
let [vtContext, setVtContext] = React.useState({
isTransitioning: false
});
let [renderDfd, setRenderDfd] = React.useState();
let [transition, setTransition] = React.useState();
let [interruption, setInterruption] = React.useState();
let {
v7_startTransition
} = future || {};
let optInStartTransition = React.useCallback(cb => {
if (v7_startTransition) {
startTransitionSafe(cb);
} else {
cb();
}
}, [v7_startTransition]);
let setState = React.useCallback((newState, {
unstable_viewTransitionOpts: viewTransitionOpts
}) => {
if (!viewTransitionOpts || router.window == null || typeof router.window.document.startViewTransition !== "function") {
// Mid-navigation state update, or startViewTransition isn't available
optInStartTransition(() => setStateImpl(newState));
} else if (transition && renderDfd) {
// Interrupting an in-progress transition, cancel and let everything flush
// out, and then kick off a new transition from the interruption state
renderDfd.resolve();
transition.skipTransition();
setInterruption({
state: newState,
currentLocation: viewTransitionOpts.currentLocation,
nextLocation: viewTransitionOpts.nextLocation
});
} else {
// Completed navigation update with opted-in view transitions, let 'er rip
setPendingState(newState);
setVtContext({
isTransitioning: true,
currentLocation: viewTransitionOpts.currentLocation,
nextLocation: viewTransitionOpts.nextLocation
});
}
}, [optInStartTransition, transition, renderDfd, router.window]);
// Need to use a layout effect here so we are subscribed early enough to
// pick up on any render-driven redirects/navigations (useEffect/<Navigate>)
React.useLayoutEffect(() => router.subscribe(setState), [router, setState]);
// When we start a view transition, create a Deferred we can use for the
// eventual "completed" render
React.useEffect(() => {
if (vtContext.isTransitioning) {
setRenderDfd(new Deferred());
}
}, [vtContext.isTransitioning]);
// Once the deferred is created, kick off startViewTransition() to update the
// DOM and then wait on the Deferred to resolve (indicating the DOM update has
// happened)
React.useEffect(() => {
if (renderDfd && pendingState && router.window) {
let newState = pendingState;
let renderPromise = renderDfd.promise;
let transition = router.window.document.startViewTransition(async () => {
optInStartTransition(() => setStateImpl(newState));
await renderPromise;
});
transition.finished.finally(() => {
setRenderDfd(undefined);
setTransition(undefined);
setPendingState(undefined);
setVtContext({
isTransitioning: false
});
});
setTransition(transition);
}
}, [optInStartTransition, pendingState, renderDfd, router.window]);
// When the new location finally renders and is committed to the DOM, this
// effect will run to resolve the transition
React.useEffect(() => {
if (renderDfd && pendingState && state.location.key === pendingState.location.key) {
renderDfd.resolve();
}
}, [renderDfd, transition, state.location, pendingState]);
// If we get interrupted with a new navigation during a transition, we skip
// the active transition, let it cleanup, then kick it off again here
React.useEffect(() => {
if (!vtContext.isTransitioning && interruption) {
setPendingState(interruption.state);
setVtContext({
isTransitioning: true,
currentLocation: interruption.currentLocation,
nextLocation: interruption.nextLocation
});
setInterruption(undefined);
}
}, [vtContext.isTransitioning, interruption]);
let navigator = React.useMemo(() => {
return {
createHref: router.createHref,
encodeLocation: router.encodeLocation,
go: n => router.navigate(n),
push: (to, state, opts) => router.navigate(to, {
state,
preventScrollReset: opts?.preventScrollReset
}),
replace: (to, state, opts) => router.navigate(to, {
replace: true,
state,
preventScrollReset: opts?.preventScrollReset
})
};
}, [router]);
let basename = router.basename || "/";
let dataRouterContext = React.useMemo(() => ({
router,
navigator,
static: false,
basename
}), [router, navigator, basename]);
// The fragment and {null} here are important! We need them to keep React 18's
// useId happy when we are server-rendering since we may have a <script> here
// containing the hydrated server-side staticContext (from StaticRouterProvider).
// useId relies on the component tree structure to generate deterministic id's
// so we need to ensure it remains the same on the client even though
// we don't need the <script> tag
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(UNSAFE_DataRouterContext.Provider, {
value: dataRouterContext
}, /*#__PURE__*/React.createElement(UNSAFE_DataRouterStateContext.Provider, {
value: state
}, /*#__PURE__*/React.createElement(ViewTransitionContext.Provider, {
value: vtContext
}, /*#__PURE__*/React.createElement(Router, {
basename: basename,
location: state.location,
navigationType: state.historyAction,
navigator: navigator
}, state.initialized ? /*#__PURE__*/React.createElement(DataRoutes, {
routes: router.routes,
state: state
}) : fallbackElement)))), null);
}
function DataRoutes({
routes,
state
}) {
return UNSAFE_useRoutesImpl(routes, undefined, state);
}
/**
* A `<Router>` for use in web browsers. Provides the cleanest URLs.

@@ -423,3 +630,3 @@ */

/**
* The public API for rendering a history-aware <a>.
* The public API for rendering a history-aware `<a>`.
*/

@@ -435,2 +642,3 @@ const Link = /*#__PURE__*/React.forwardRef(function LinkWithRef({

preventScrollReset,
unstable_viewTransition,
...rest

@@ -477,3 +685,4 @@ }, ref) {

preventScrollReset,
relative
relative,
unstable_viewTransition
});

@@ -501,3 +710,3 @@ function handleClick(event) {

/**
* A <Link> wrapper that knows if it's "active" or not.
* A `<Link>` wrapper that knows if it's "active" or not.
*/

@@ -511,2 +720,3 @@ const NavLink = /*#__PURE__*/React.forwardRef(function NavLinkWithRef({

to,
unstable_viewTransition,
children,

@@ -523,2 +733,6 @@ ...rest

} = React.useContext(UNSAFE_NavigationContext);
let isTransitioning = routerState != null &&
// Conditional usage is OK here because the usage of a data router is static
// eslint-disable-next-line react-hooks/rules-of-hooks
useViewTransitionState(path) && unstable_viewTransition === true;
let toPathname = navigator.encodeLocation ? navigator.encodeLocation(path).pathname : path.pathname;

@@ -534,9 +748,11 @@ let locationPathname = location.pathname;

let isPending = nextLocationPathname != null && (nextLocationPathname === toPathname || !end && nextLocationPathname.startsWith(toPathname) && nextLocationPathname.charAt(toPathname.length) === "/");
let renderProps = {
isActive,
isPending,
isTransitioning
};
let ariaCurrent = isActive ? ariaCurrentProp : undefined;
let className;
if (typeof classNameProp === "function") {
className = classNameProp({
isActive,
isPending
});
className = classNameProp(renderProps);
} else {

@@ -548,8 +764,5 @@ // If the className prop is not a function, we use a default `active`

// simple styling rules working as they currently do.
className = [classNameProp, isActive ? "active" : null, isPending ? "pending" : null].filter(Boolean).join(" ");
className = [classNameProp, isActive ? "active" : null, isPending ? "pending" : null, isTransitioning ? "transitioning" : null].filter(Boolean).join(" ");
}
let style = typeof styleProp === "function" ? styleProp({
isActive,
isPending
}) : styleProp;
let style = typeof styleProp === "function" ? styleProp(renderProps) : styleProp;
return /*#__PURE__*/React.createElement(Link, Object.assign({}, rest, {

@@ -560,7 +773,5 @@ "aria-current": ariaCurrent,

style: style,
to: to
}), typeof children === "function" ? children({
isActive,
isPending
}) : children);
to: to,
unstable_viewTransition: unstable_viewTransition
}), typeof children === "function" ? children(renderProps) : children);
});

@@ -596,2 +807,3 @@ {

preventScrollReset,
unstable_viewTransition,
...props

@@ -614,3 +826,4 @@ }, forwardedRef) => {

relative,
preventScrollReset
preventScrollReset,
unstable_viewTransition
});

@@ -655,2 +868,3 @@ };

DataRouterHook["UseFetcher"] = "useFetcher";
DataRouterHook["useViewTransitionState"] = "useViewTransitionState";
return DataRouterHook;

@@ -687,3 +901,4 @@ }(DataRouterHook || {});

preventScrollReset,
relative
relative,
unstable_viewTransition
} = {}) {

@@ -706,6 +921,7 @@ let navigate = useNavigate();

preventScrollReset,
relative
relative,
unstable_viewTransition
});
}
}, [location, navigate, path, replaceProp, state, target, to, preventScrollReset, relative]);
}, [location, navigate, path, replaceProp, state, target, to, preventScrollReset, relative, unstable_viewTransition]);
}

@@ -779,3 +995,4 @@

state: options.state,
fromRouteId: currentRouteId
fromRouteId: currentRouteId,
unstable_viewTransition: options.unstable_viewTransition
});

@@ -881,2 +1098,3 @@ }, [router, basename, currentRouteId]);

let fetcherId = 0;
// TODO: (v7) Change the useFetcher generic default from `any` to `unknown`
/**

@@ -973,3 +1191,7 @@ * Interacts with route loaders and actions without causing a navigation. Great

}
sessionStorage.setItem(storageKey || SCROLL_RESTORATION_STORAGE_KEY, JSON.stringify(savedScrollPositions));
try {
sessionStorage.setItem(storageKey || SCROLL_RESTORATION_STORAGE_KEY, JSON.stringify(savedScrollPositions));
} catch (error) {
UNSAFE_warning(false, `Failed to save scroll positions in sessionStorage, <ScrollRestoration /> will not work properly (${error}).`) ;
}
window.history.scrollRestoration = "auto";

@@ -1118,5 +1340,44 @@ }, [storageKey, getKey, navigation.state, location, matches]));

/**
* Return a boolean indicating if there is an active view transition to the
* given href. You can use this value to render CSS classes or viewTransitionName
* styles onto your elements
*
* @param href The destination href
* @param [opts.relative] Relative routing type ("route" | "path")
*/
function useViewTransitionState(to, opts = {}) {
let vtContext = React.useContext(ViewTransitionContext);
!(vtContext != null) ? UNSAFE_invariant(false, "`unstable_useViewTransitionState` must be used within `react-router-dom`'s `RouterProvider`. " + "Did you accidentally import `RouterProvider` from `react-router`?") : void 0;
let {
basename
} = useDataRouterContext(DataRouterHook.useViewTransitionState);
let path = useResolvedPath(to, {
relative: opts.relative
});
if (!vtContext.isTransitioning) {
return false;
}
let currentPath = stripBasename(vtContext.currentLocation.pathname, basename) || vtContext.currentLocation.pathname;
let nextPath = stripBasename(vtContext.nextLocation.pathname, basename) || vtContext.nextLocation.pathname;
// Transition is active if we're going to or coming from the indicated
// destination. This ensures that other PUSH navigations that reverse
// an indicated transition apply. I.e., on the list view you have:
//
// <NavLink to="/details/1" unstable_viewTransition>
//
// If you click the breadcrumb back to the list view:
//
// <NavLink to="/list" unstable_viewTransition>
//
// We should apply the transition because it's indicated as active going
// from /list -> /details/1 and therefore should be active on the reverse
// (even though this isn't strictly a POP reverse)
return matchPath(path.pathname, nextPath) != null || matchPath(path.pathname, currentPath) != null;
}
//#endregion
export { BrowserRouter, Form, HashRouter, Link, NavLink, ScrollRestoration, useScrollRestoration as UNSAFE_useScrollRestoration, createBrowserRouter, createHashRouter, createSearchParams, HistoryRouter as unstable_HistoryRouter, usePrompt as unstable_usePrompt, useBeforeUnload, useFetcher, useFetchers, useFormAction, useLinkClickHandler, useSearchParams, useSubmit };
export { BrowserRouter, Form, HashRouter, Link, NavLink, RouterProvider, ScrollRestoration, ViewTransitionContext as UNSAFE_ViewTransitionContext, useScrollRestoration as UNSAFE_useScrollRestoration, createBrowserRouter, createHashRouter, createSearchParams, HistoryRouter as unstable_HistoryRouter, usePrompt as unstable_usePrompt, useViewTransitionState as unstable_useViewTransitionState, useBeforeUnload, useFetcher, useFetchers, useFormAction, useLinkClickHandler, useSearchParams, useSubmit };
//# sourceMappingURL=react-router-dom.development.js.map
+2
-2
dist/react-router-dom.production.min.js
/**
* React Router DOM v6.15.0
* React Router DOM v6.17.0
*

@@ -11,3 +11,3 @@ * Copyright (c) Remix Software Inc.

*/
import*as e from"react";import{UNSAFE_mapRouteProperties as t,Router as r,UNSAFE_NavigationContext as n,useHref as o,useResolvedPath as a,useLocation as i,UNSAFE_DataRouterStateContext as s,useNavigate as u,createPath as l,UNSAFE_useRouteId as c,UNSAFE_RouteContext as f,useMatches as m,useNavigation as d,unstable_useBlocker as p,UNSAFE_DataRouterContext as h}from"react-router";export{AbortedDeferredError,Await,MemoryRouter,Navigate,NavigationType,Outlet,Route,Router,RouterProvider,Routes,UNSAFE_DataRouterContext,UNSAFE_DataRouterStateContext,UNSAFE_LocationContext,UNSAFE_NavigationContext,UNSAFE_RouteContext,UNSAFE_useRouteId,createMemoryRouter,createPath,createRoutesFromChildren,createRoutesFromElements,defer,generatePath,isRouteErrorResponse,json,matchPath,matchRoutes,parsePath,redirect,redirectDocument,renderMatches,resolvePath,unstable_useBlocker,useActionData,useAsyncError,useAsyncValue,useHref,useInRouterContext,useLoaderData,useLocation,useMatch,useMatches,useNavigate,useNavigation,useNavigationType,useOutlet,useOutletContext,useParams,useResolvedPath,useRevalidator,useRouteError,useRouteLoaderData,useRoutes}from"react-router";import{stripBasename as w,createRouter as y,createBrowserHistory as g,createHashHistory as b,ErrorResponse as v,UNSAFE_invariant as R,joinPaths as S}from"@remix-run/router";const E="application/x-www-form-urlencoded";function C(e){return null!=e&&"string"==typeof e.tagName}function x(e=""){return new URLSearchParams("string"==typeof e||Array.isArray(e)||e instanceof URLSearchParams?e:Object.keys(e).reduce(((t,r)=>{let n=e[r];return t.concat(Array.isArray(n)?n.map((e=>[r,e])):[[r,n]])}),[]))}let A=null;const L=new Set(["application/x-www-form-urlencoded","multipart/form-data","text/plain"]);function U(e){return null==e||L.has(e)?e:null}function _(e,t){let r,n,o,a,i;if(C(s=e)&&"form"===s.tagName.toLowerCase()){let i=e.getAttribute("action");n=i?w(i,t):null,r=e.getAttribute("method")||"get",o=U(e.getAttribute("enctype"))||E,a=new FormData(e)}else if(function(e){return C(e)&&"button"===e.tagName.toLowerCase()}(e)||function(e){return C(e)&&"input"===e.tagName.toLowerCase()}(e)&&("submit"===e.type||"image"===e.type)){let i=e.form;if(null==i)throw new Error('Cannot submit a <button> or <input type="submit"> without a <form>');let s=e.getAttribute("formaction")||i.getAttribute("action");if(n=s?w(s,t):null,r=e.getAttribute("formmethod")||i.getAttribute("method")||"get",o=U(e.getAttribute("formenctype"))||U(i.getAttribute("enctype"))||E,a=new FormData(i,e),!function(){if(null===A)try{new FormData(document.createElement("form"),0),A=!1}catch(e){A=!0}return A}()){let{name:t,type:r,value:n}=e;if("image"===r){let e=t?`${t}.`:"";a.append(`${e}x`,"0"),a.append(`${e}y`,"0")}else t&&a.append(t,n)}}else{if(C(e))throw new Error('Cannot submit element that is not <form>, <button>, or <input type="submit|image">');r="get",n=null,o=E,i=e}var s;return a&&"text/plain"===o&&(i=a,a=void 0),{action:n,method:r.toLowerCase(),encType:o,formData:a,body:i}}function F(e,r){return y({basename:r?.basename,future:{...r?.future,v7_prependBasename:!0},history:g({window:r?.window}),hydrationData:r?.hydrationData||T(),routes:e,mapRouteProperties:t}).initialize()}function D(e,r){return y({basename:r?.basename,future:{...r?.future,v7_prependBasename:!0},history:b({window:r?.window}),hydrationData:r?.hydrationData||T(),routes:e,mapRouteProperties:t}).initialize()}function T(){let e=window?.__staticRouterHydrationData;return e&&e.errors&&(e={...e,errors:N(e.errors)}),e}function N(e){if(!e)return null;let t=Object.entries(e),r={};for(let[o,a]of t)if(a&&"RouteErrorResponse"===a.__type)r[o]=new v(a.status,a.statusText,a.data,!0===a.internal);else if(a&&"Error"===a.__type){if(a.__subType){let e=window[a.__subType];if("function"==typeof e)try{let t=new e(a.message);t.stack="",r[o]=t}catch(n){}}if(null==r[o]){let e=new Error(a.message);e.stack="",r[o]=e}}else r[o]=a;return r}const P=e.startTransition;function k({basename:t,children:n,future:o,window:a}){let i=e.useRef();null==i.current&&(i.current=g({window:a,v5Compat:!0}));let s=i.current,[u,l]=e.useState({action:s.action,location:s.location}),{v7_startTransition:c}=o||{},f=e.useCallback((e=>{c&&P?P((()=>l(e))):l(e)}),[l,c]);return e.useLayoutEffect((()=>s.listen(f)),[s,f]),e.createElement(r,{basename:t,children:n,location:u.location,navigationType:u.action,navigator:s})}function O({basename:t,children:n,future:o,window:a}){let i=e.useRef();null==i.current&&(i.current=b({window:a,v5Compat:!0}));let s=i.current,[u,l]=e.useState({action:s.action,location:s.location}),{v7_startTransition:c}=o||{},f=e.useCallback((e=>{c&&P?P((()=>l(e))):l(e)}),[l,c]);return e.useLayoutEffect((()=>s.listen(f)),[s,f]),e.createElement(r,{basename:t,children:n,location:u.location,navigationType:u.action,navigator:s})}function K({basename:t,children:n,future:o,history:a}){let[i,s]=e.useState({action:a.action,location:a.location}),{v7_startTransition:u}=o||{},l=e.useCallback((e=>{u&&P?P((()=>s(e))):s(e)}),[s,u]);return e.useLayoutEffect((()=>a.listen(l)),[a,l]),e.createElement(r,{basename:t,children:n,location:i.location,navigationType:i.action,navigator:a})}const j="undefined"!=typeof window&&void 0!==window.document&&void 0!==window.document.createElement,M=/^(?:[a-z][a-z0-9+.-]*:|\/\/)/i,I=e.forwardRef((function({onClick:t,relative:r,reloadDocument:a,replace:i,state:s,target:u,to:l,preventScrollReset:c,...f},m){let d,{basename:p}=e.useContext(n),h=!1;if("string"==typeof l&&M.test(l)&&(d=l,j))try{let e=new URL(window.location.href),t=l.startsWith("//")?new URL(e.protocol+l):new URL(l),r=w(t.pathname,p);t.origin===e.origin&&null!=r?l=r+t.search+t.hash:h=!0}catch(b){}let y=o(l,{relative:r}),g=q(l,{replace:i,state:s,target:u,preventScrollReset:c,relative:r});return e.createElement("a",Object.assign({},f,{href:d||y,onClick:h||a?t:function(e){t&&t(e),e.defaultPrevented||g(e)},ref:m,target:u}))})),B=e.forwardRef((function({"aria-current":t="page",caseSensitive:r=!1,className:o="",end:u=!1,style:l,to:c,children:f,...m},d){let p=a(c,{relative:m.relative}),h=i(),w=e.useContext(s),{navigator:y}=e.useContext(n),g=y.encodeLocation?y.encodeLocation(p).pathname:p.pathname,b=h.pathname,v=w&&w.navigation&&w.navigation.location?w.navigation.location.pathname:null;r||(b=b.toLowerCase(),v=v?v.toLowerCase():null,g=g.toLowerCase());let R,S=b===g||!u&&b.startsWith(g)&&"/"===b.charAt(g.length),E=null!=v&&(v===g||!u&&v.startsWith(g)&&"/"===v.charAt(g.length)),C=S?t:void 0;R="function"==typeof o?o({isActive:S,isPending:E}):[o,S?"active":null,E?"pending":null].filter(Boolean).join(" ");let x="function"==typeof l?l({isActive:S,isPending:E}):l;return e.createElement(I,Object.assign({},m,{"aria-current":C,className:R,ref:d,style:x,to:c}),"function"==typeof f?f({isActive:S,isPending:E}):f)})),z=e.forwardRef(((t,r)=>{let n=X();return e.createElement($,Object.assign({},t,{submit:n,ref:r}))})),$=e.forwardRef((({reloadDocument:t,replace:r,state:n,method:o="get",action:a,onSubmit:i,submit:s,relative:u,preventScrollReset:l,...c},f)=>{let m="get"===o.toLowerCase()?"get":"post",d=ee(a,{relative:u});return e.createElement("form",Object.assign({ref:f,method:m,action:d,onSubmit:t?i:e=>{if(i&&i(e),e.defaultPrevented)return;e.preventDefault();let t=e.nativeEvent.submitter,a=t?.getAttribute("formmethod")||o;s(t||e.currentTarget,{method:a,replace:r,state:n,relative:u,preventScrollReset:l})}},c))}));function H({getKey:e,storageKey:t}){return ae({getKey:e,storageKey:t}),null}var W=function(e){return e.UseScrollRestoration="useScrollRestoration",e.UseSubmit="useSubmit",e.UseSubmitFetcher="useSubmitFetcher",e.UseFetcher="useFetcher",e}(W||{}),Y=function(e){return e.UseFetchers="useFetchers",e.UseScrollRestoration="useScrollRestoration",e}(Y||{});function J(t){let r=e.useContext(h);return r||R(!1),r}function V(t){let r=e.useContext(s);return r||R(!1),r}function q(t,{target:r,replace:n,state:o,preventScrollReset:s,relative:c}={}){let f=u(),m=i(),d=a(t,{relative:c});return e.useCallback((e=>{if(function(e,t){return!(0!==e.button||t&&"_self"!==t||function(e){return!!(e.metaKey||e.altKey||e.ctrlKey||e.shiftKey)}(e))}(e,r)){e.preventDefault();let r=void 0!==n?n:l(m)===l(d);f(t,{replace:r,state:o,preventScrollReset:s,relative:c})}}),[m,f,d,n,o,r,t,s,c])}function G(t){let r=e.useRef(x(t)),n=e.useRef(!1),o=i(),a=e.useMemo((()=>function(e,t){let r=x(e);return t&&t.forEach(((e,n)=>{r.has(n)||t.getAll(n).forEach((e=>{r.append(n,e)}))})),r}(o.search,n.current?null:r.current)),[o.search]),s=u(),l=e.useCallback(((e,t)=>{const r=x("function"==typeof e?e(a):e);n.current=!0,s("?"+r,t)}),[s,a]);return[a,l]}function Q(){if("undefined"==typeof document)throw new Error("You are calling submit during the server render. Try calling submit within a `useEffect` or callback instead.")}function X(){let{router:t}=J(W.UseSubmit),{basename:r}=e.useContext(n),o=c();return e.useCallback(((e,n={})=>{Q();let{action:a,method:i,encType:s,formData:u,body:l}=_(e,r);t.navigate(n.action||a,{preventScrollReset:n.preventScrollReset,formData:u,body:l,formMethod:n.method||i,formEncType:n.encType||s,replace:n.replace,state:n.state,fromRouteId:o})}),[t,r,o])}function Z(t,r){let{router:o}=J(W.UseSubmitFetcher),{basename:a}=e.useContext(n);return e.useCallback(((e,n={})=>{Q();let{action:i,method:s,encType:u,formData:l,body:c}=_(e,a);null==r&&R(!1),o.fetch(t,r,n.action||i,{preventScrollReset:n.preventScrollReset,formData:l,body:c,formMethod:n.method||s,formEncType:n.encType||u})}),[o,a,t,r])}function ee(t,{relative:r}={}){let{basename:o}=e.useContext(n),s=e.useContext(f);s||R(!1);let[u]=s.matches.slice(-1),c={...a(t||".",{relative:r})},m=i();if(null==t&&(c.search=m.search,u.route.index)){let e=new URLSearchParams(c.search);e.delete("index"),c.search=e.toString()?`?${e.toString()}`:""}return t&&"."!==t||!u.route.index||(c.search=c.search?c.search.replace(/^\?/,"?index&"):"?index"),"/"!==o&&(c.pathname="/"===c.pathname?o:S([o,c.pathname])),l(c)}let te=0;function re(){let{router:t}=J(W.UseFetcher),r=e.useContext(f);r||R(!1);let n=r.matches[r.matches.length-1]?.route.id;null==n&&R(!1);let[o]=e.useState((()=>String(++te))),[a]=e.useState((()=>(n||R(!1),function(t,r){return e.forwardRef(((n,o)=>{let a=Z(t,r);return e.createElement($,Object.assign({},n,{ref:o,submit:a}))}))}(o,n)))),[i]=e.useState((()=>e=>{t||R(!1),n||R(!1),t.fetch(o,n,e)})),s=Z(o,n),u=t.getFetcher(o),l=e.useMemo((()=>({Form:a,submit:s,load:i,...u})),[u,a,s,i]);return e.useEffect((()=>()=>{t?t.deleteFetcher(o):console.warn("No router available to clean up from useFetcher()")}),[t,o]),l}function ne(){return[...V(Y.UseFetchers).fetchers.values()]}let oe={};function ae({getKey:t,storageKey:r}={}){let{router:o}=J(W.UseScrollRestoration),{restoreScrollPosition:a,preventScrollReset:s}=V(Y.UseScrollRestoration),{basename:u}=e.useContext(n),l=i(),c=m(),f=d();e.useEffect((()=>(window.history.scrollRestoration="manual",()=>{window.history.scrollRestoration="auto"})),[]),function(t,r){let{capture:n}=r||{};e.useEffect((()=>{let e=null!=n?{capture:n}:void 0;return window.addEventListener("pagehide",t,e),()=>{window.removeEventListener("pagehide",t,e)}}),[t,n])}(e.useCallback((()=>{if("idle"===f.state){let e=(t?t(l,c):null)||l.key;oe[e]=window.scrollY}sessionStorage.setItem(r||"react-router-scroll-positions",JSON.stringify(oe)),window.history.scrollRestoration="auto"}),[r,t,f.state,l,c])),"undefined"!=typeof document&&(e.useLayoutEffect((()=>{try{let e=sessionStorage.getItem(r||"react-router-scroll-positions");e&&(oe=JSON.parse(e))}catch(e){}}),[r]),e.useLayoutEffect((()=>{let e=t&&"/"!==u?(e,r)=>t({...e,pathname:w(e.pathname,u)||e.pathname},r):t,r=o?.enableScrollRestoration(oe,(()=>window.scrollY),e);return()=>r&&r()}),[o,u,t]),e.useLayoutEffect((()=>{if(!1!==a)if("number"!=typeof a){if(l.hash){let e=document.getElementById(decodeURIComponent(l.hash.slice(1)));if(e)return void e.scrollIntoView()}!0!==s&&window.scrollTo(0,0)}else window.scrollTo(0,a)}),[l,a,s]))}function ie(t,r){let{capture:n}=r||{};e.useEffect((()=>{let e=null!=n?{capture:n}:void 0;return window.addEventListener("beforeunload",t,e),()=>{window.removeEventListener("beforeunload",t,e)}}),[t,n])}function se({when:t,message:r}){let n=p(t);e.useEffect((()=>{if("blocked"===n.state){window.confirm(r)?setTimeout(n.proceed,0):n.reset()}}),[n,r]),e.useEffect((()=>{"blocked"!==n.state||t||n.reset()}),[n,t])}export{k as BrowserRouter,z as Form,O as HashRouter,I as Link,B as NavLink,H as ScrollRestoration,ae as UNSAFE_useScrollRestoration,F as createBrowserRouter,D as createHashRouter,x as createSearchParams,K as unstable_HistoryRouter,se as unstable_usePrompt,ie as useBeforeUnload,re as useFetcher,ne as useFetchers,ee as useFormAction,q as useLinkClickHandler,G as useSearchParams,X as useSubmit};
import*as e from"react";import{UNSAFE_mapRouteProperties as t,UNSAFE_DataRouterContext as n,UNSAFE_DataRouterStateContext as r,Router as o,UNSAFE_useRoutesImpl as a,UNSAFE_NavigationContext as i,useHref as s,useResolvedPath as u,useLocation as l,useNavigate as c,createPath as f,UNSAFE_useRouteId as m,UNSAFE_RouteContext as d,useMatches as p,useNavigation as h,unstable_useBlocker as w}from"react-router";export{AbortedDeferredError,Await,MemoryRouter,Navigate,NavigationType,Outlet,Route,Router,Routes,UNSAFE_DataRouterContext,UNSAFE_DataRouterStateContext,UNSAFE_LocationContext,UNSAFE_NavigationContext,UNSAFE_RouteContext,UNSAFE_useRouteId,createMemoryRouter,createPath,createRoutesFromChildren,createRoutesFromElements,defer,generatePath,isRouteErrorResponse,json,matchPath,matchRoutes,parsePath,redirect,redirectDocument,renderMatches,resolvePath,unstable_useBlocker,useActionData,useAsyncError,useAsyncValue,useHref,useInRouterContext,useLoaderData,useLocation,useMatch,useMatches,useNavigate,useNavigation,useNavigationType,useOutlet,useOutletContext,useParams,useResolvedPath,useRevalidator,useRouteError,useRouteLoaderData,useRoutes}from"react-router";import{stripBasename as v,createRouter as g,createBrowserHistory as b,createHashHistory as y,UNSAFE_ErrorResponseImpl as R,UNSAFE_invariant as S,joinPaths as E,matchPath as T}from"@remix-run/router";const L="application/x-www-form-urlencoded";function C(e){return null!=e&&"string"==typeof e.tagName}function x(e=""){return new URLSearchParams("string"==typeof e||Array.isArray(e)||e instanceof URLSearchParams?e:Object.keys(e).reduce(((t,n)=>{let r=e[n];return t.concat(Array.isArray(r)?r.map((e=>[n,e])):[[n,r]])}),[]))}let _=null;const A=new Set(["application/x-www-form-urlencoded","multipart/form-data","text/plain"]);function F(e){return null==e||A.has(e)?e:null}function U(e,t){let n,r,o,a,i;if(C(s=e)&&"form"===s.tagName.toLowerCase()){let i=e.getAttribute("action");r=i?v(i,t):null,n=e.getAttribute("method")||"get",o=F(e.getAttribute("enctype"))||L,a=new FormData(e)}else if(function(e){return C(e)&&"button"===e.tagName.toLowerCase()}(e)||function(e){return C(e)&&"input"===e.tagName.toLowerCase()}(e)&&("submit"===e.type||"image"===e.type)){let i=e.form;if(null==i)throw new Error('Cannot submit a <button> or <input type="submit"> without a <form>');let s=e.getAttribute("formaction")||i.getAttribute("action");if(r=s?v(s,t):null,n=e.getAttribute("formmethod")||i.getAttribute("method")||"get",o=F(e.getAttribute("formenctype"))||F(i.getAttribute("enctype"))||L,a=new FormData(i,e),!function(){if(null===_)try{new FormData(document.createElement("form"),0),_=!1}catch(e){_=!0}return _}()){let{name:t,type:n,value:r}=e;if("image"===n){let e=t?`${t}.`:"";a.append(`${e}x`,"0"),a.append(`${e}y`,"0")}else t&&a.append(t,r)}}else{if(C(e))throw new Error('Cannot submit element that is not <form>, <button>, or <input type="submit|image">');n="get",r=null,o=L,i=e}var s;return a&&"text/plain"===o&&(i=a,a=void 0),{action:r,method:n.toLowerCase(),encType:o,formData:a,body:i}}function k(e,n){return g({basename:n?.basename,future:{...n?.future,v7_prependBasename:!0},history:b({window:n?.window}),hydrationData:n?.hydrationData||N(),routes:e,mapRouteProperties:t,window:n?.window}).initialize()}function D(e,n){return g({basename:n?.basename,future:{...n?.future,v7_prependBasename:!0},history:y({window:n?.window}),hydrationData:n?.hydrationData||N(),routes:e,mapRouteProperties:t,window:n?.window}).initialize()}function N(){let e=window?.__staticRouterHydrationData;return e&&e.errors&&(e={...e,errors:P(e.errors)}),e}function P(e){if(!e)return null;let t=Object.entries(e),n={};for(let[o,a]of t)if(a&&"RouteErrorResponse"===a.__type)n[o]=new R(a.status,a.statusText,a.data,!0===a.internal);else if(a&&"Error"===a.__type){if(a.__subType){let e=window[a.__subType];if("function"==typeof e)try{let t=new e(a.message);t.stack="",n[o]=t}catch(r){}}if(null==n[o]){let e=new Error(a.message);e.stack="",n[o]=e}}else n[o]=a;return n}const O=e.createContext({isTransitioning:!1}),j=e.startTransition;class M{status="pending";constructor(){this.promise=new Promise(((e,t)=>{this.resolve=t=>{"pending"===this.status&&(this.status="resolved",e(t))},this.reject=e=>{"pending"===this.status&&(this.status="rejected",t(e))}}))}}function K({fallbackElement:t,router:a,future:i}){let[s,u]=e.useState(a.state),[l,c]=e.useState(),[f,m]=e.useState({isTransitioning:!1}),[d,p]=e.useState(),[h,w]=e.useState(),[v,g]=e.useState(),{v7_startTransition:b}=i||{},y=e.useCallback((e=>{b?function(e){j?j(e):e()}(e):e()}),[b]),R=e.useCallback(((e,{unstable_viewTransitionOpts:t})=>{t&&null!=a.window&&"function"==typeof a.window.document.startViewTransition?h&&d?(d.resolve(),h.skipTransition(),g({state:e,currentLocation:t.currentLocation,nextLocation:t.nextLocation})):(c(e),m({isTransitioning:!0,currentLocation:t.currentLocation,nextLocation:t.nextLocation})):y((()=>u(e)))}),[y,h,d,a.window]);e.useLayoutEffect((()=>a.subscribe(R)),[a,R]),e.useEffect((()=>{f.isTransitioning&&p(new M)}),[f.isTransitioning]),e.useEffect((()=>{if(d&&l&&a.window){let e=l,t=d.promise,n=a.window.document.startViewTransition((async()=>{y((()=>u(e))),await t}));n.finished.finally((()=>{p(void 0),w(void 0),c(void 0),m({isTransitioning:!1})})),w(n)}}),[y,l,d,a.window]),e.useEffect((()=>{d&&l&&s.location.key===l.location.key&&d.resolve()}),[d,h,s.location,l]),e.useEffect((()=>{!f.isTransitioning&&v&&(c(v.state),m({isTransitioning:!0,currentLocation:v.currentLocation,nextLocation:v.nextLocation}),g(void 0))}),[f.isTransitioning,v]);let S=e.useMemo((()=>({createHref:a.createHref,encodeLocation:a.encodeLocation,go:e=>a.navigate(e),push:(e,t,n)=>a.navigate(e,{state:t,preventScrollReset:n?.preventScrollReset}),replace:(e,t,n)=>a.navigate(e,{replace:!0,state:t,preventScrollReset:n?.preventScrollReset})})),[a]),E=a.basename||"/",T=e.useMemo((()=>({router:a,navigator:S,static:!1,basename:E})),[a,S,E]);return e.createElement(e.Fragment,null,e.createElement(n.Provider,{value:T},e.createElement(r.Provider,{value:s},e.createElement(O.Provider,{value:f},e.createElement(o,{basename:E,location:s.location,navigationType:s.historyAction,navigator:S},s.initialized?e.createElement(V,{routes:a.routes,state:s}):t)))),null)}function V({routes:e,state:t}){return a(e,void 0,t)}function I({basename:t,children:n,future:r,window:a}){let i=e.useRef();null==i.current&&(i.current=b({window:a,v5Compat:!0}));let s=i.current,[u,l]=e.useState({action:s.action,location:s.location}),{v7_startTransition:c}=r||{},f=e.useCallback((e=>{c&&j?j((()=>l(e))):l(e)}),[l,c]);return e.useLayoutEffect((()=>s.listen(f)),[s,f]),e.createElement(o,{basename:t,children:n,location:u.location,navigationType:u.action,navigator:s})}function z({basename:t,children:n,future:r,window:a}){let i=e.useRef();null==i.current&&(i.current=y({window:a,v5Compat:!0}));let s=i.current,[u,l]=e.useState({action:s.action,location:s.location}),{v7_startTransition:c}=r||{},f=e.useCallback((e=>{c&&j?j((()=>l(e))):l(e)}),[l,c]);return e.useLayoutEffect((()=>s.listen(f)),[s,f]),e.createElement(o,{basename:t,children:n,location:u.location,navigationType:u.action,navigator:s})}function B({basename:t,children:n,future:r,history:a}){let[i,s]=e.useState({action:a.action,location:a.location}),{v7_startTransition:u}=r||{},l=e.useCallback((e=>{u&&j?j((()=>s(e))):s(e)}),[s,u]);return e.useLayoutEffect((()=>a.listen(l)),[a,l]),e.createElement(o,{basename:t,children:n,location:i.location,navigationType:i.action,navigator:a})}const H="undefined"!=typeof window&&void 0!==window.document&&void 0!==window.document.createElement,$=/^(?:[a-z][a-z0-9+.-]*:|\/\/)/i,W=e.forwardRef((function({onClick:t,relative:n,reloadDocument:r,replace:o,state:a,target:u,to:l,preventScrollReset:c,unstable_viewTransition:f,...m},d){let p,{basename:h}=e.useContext(i),w=!1;if("string"==typeof l&&$.test(l)&&(p=l,H))try{let e=new URL(window.location.href),t=l.startsWith("//")?new URL(e.protocol+l):new URL(l),n=v(t.pathname,h);t.origin===e.origin&&null!=n?l=n+t.search+t.hash:w=!0}catch(y){}let g=s(l,{relative:n}),b=te(l,{replace:o,state:a,target:u,preventScrollReset:c,relative:n,unstable_viewTransition:f});return e.createElement("a",Object.assign({},m,{href:p||g,onClick:w||r?t:function(e){t&&t(e),e.defaultPrevented||b(e)},ref:d,target:u}))})),Y=e.forwardRef((function({"aria-current":t="page",caseSensitive:n=!1,className:o="",end:a=!1,style:s,to:c,unstable_viewTransition:f,children:m,...d},p){let h=u(c,{relative:d.relative}),w=l(),v=e.useContext(r),{navigator:g}=e.useContext(i),b=null!=v&&pe(h)&&!0===f,y=g.encodeLocation?g.encodeLocation(h).pathname:h.pathname,R=w.pathname,S=v&&v.navigation&&v.navigation.location?v.navigation.location.pathname:null;n||(R=R.toLowerCase(),S=S?S.toLowerCase():null,y=y.toLowerCase());let E,T=R===y||!a&&R.startsWith(y)&&"/"===R.charAt(y.length),L=null!=S&&(S===y||!a&&S.startsWith(y)&&"/"===S.charAt(y.length)),C={isActive:T,isPending:L,isTransitioning:b},x=T?t:void 0;E="function"==typeof o?o(C):[o,T?"active":null,L?"pending":null,b?"transitioning":null].filter(Boolean).join(" ");let _="function"==typeof s?s(C):s;return e.createElement(W,Object.assign({},d,{"aria-current":x,className:E,ref:p,style:_,to:c,unstable_viewTransition:f}),"function"==typeof m?m(C):m)})),J=e.forwardRef(((t,n)=>{let r=oe();return e.createElement(q,Object.assign({},t,{submit:r,ref:n}))})),q=e.forwardRef((({reloadDocument:t,replace:n,state:r,method:o="get",action:a,onSubmit:i,submit:s,relative:u,preventScrollReset:l,unstable_viewTransition:c,...f},m)=>{let d="get"===o.toLowerCase()?"get":"post",p=ie(a,{relative:u});return e.createElement("form",Object.assign({ref:m,method:d,action:p,onSubmit:t?i:e=>{if(i&&i(e),e.defaultPrevented)return;e.preventDefault();let t=e.nativeEvent.submitter,a=t?.getAttribute("formmethod")||o;s(t||e.currentTarget,{method:a,replace:n,state:r,relative:u,preventScrollReset:l,unstable_viewTransition:c})}},f))}));function G({getKey:e,storageKey:t}){return fe({getKey:e,storageKey:t}),null}var Q=function(e){return e.UseScrollRestoration="useScrollRestoration",e.UseSubmit="useSubmit",e.UseSubmitFetcher="useSubmitFetcher",e.UseFetcher="useFetcher",e.useViewTransitionState="useViewTransitionState",e}(Q||{}),X=function(e){return e.UseFetchers="useFetchers",e.UseScrollRestoration="useScrollRestoration",e}(X||{});function Z(t){let r=e.useContext(n);return r||S(!1),r}function ee(t){let n=e.useContext(r);return n||S(!1),n}function te(t,{target:n,replace:r,state:o,preventScrollReset:a,relative:i,unstable_viewTransition:s}={}){let m=c(),d=l(),p=u(t,{relative:i});return e.useCallback((e=>{if(function(e,t){return!(0!==e.button||t&&"_self"!==t||function(e){return!!(e.metaKey||e.altKey||e.ctrlKey||e.shiftKey)}(e))}(e,n)){e.preventDefault();let n=void 0!==r?r:f(d)===f(p);m(t,{replace:n,state:o,preventScrollReset:a,relative:i,unstable_viewTransition:s})}}),[d,m,p,r,o,n,t,a,i,s])}function ne(t){let n=e.useRef(x(t)),r=e.useRef(!1),o=l(),a=e.useMemo((()=>function(e,t){let n=x(e);return t&&t.forEach(((e,r)=>{n.has(r)||t.getAll(r).forEach((e=>{n.append(r,e)}))})),n}(o.search,r.current?null:n.current)),[o.search]),i=c(),s=e.useCallback(((e,t)=>{const n=x("function"==typeof e?e(a):e);r.current=!0,i("?"+n,t)}),[i,a]);return[a,s]}function re(){if("undefined"==typeof document)throw new Error("You are calling submit during the server render. Try calling submit within a `useEffect` or callback instead.")}function oe(){let{router:t}=Z(Q.UseSubmit),{basename:n}=e.useContext(i),r=m();return e.useCallback(((e,o={})=>{re();let{action:a,method:i,encType:s,formData:u,body:l}=U(e,n);t.navigate(o.action||a,{preventScrollReset:o.preventScrollReset,formData:u,body:l,formMethod:o.method||i,formEncType:o.encType||s,replace:o.replace,state:o.state,fromRouteId:r,unstable_viewTransition:o.unstable_viewTransition})}),[t,n,r])}function ae(t,n){let{router:r}=Z(Q.UseSubmitFetcher),{basename:o}=e.useContext(i);return e.useCallback(((e,a={})=>{re();let{action:i,method:s,encType:u,formData:l,body:c}=U(e,o);null==n&&S(!1),r.fetch(t,n,a.action||i,{preventScrollReset:a.preventScrollReset,formData:l,body:c,formMethod:a.method||s,formEncType:a.encType||u})}),[r,o,t,n])}function ie(t,{relative:n}={}){let{basename:r}=e.useContext(i),o=e.useContext(d);o||S(!1);let[a]=o.matches.slice(-1),s={...u(t||".",{relative:n})},c=l();if(null==t&&(s.search=c.search,a.route.index)){let e=new URLSearchParams(s.search);e.delete("index"),s.search=e.toString()?`?${e.toString()}`:""}return t&&"."!==t||!a.route.index||(s.search=s.search?s.search.replace(/^\?/,"?index&"):"?index"),"/"!==r&&(s.pathname="/"===s.pathname?r:E([r,s.pathname])),f(s)}let se=0;function ue(){let{router:t}=Z(Q.UseFetcher),n=e.useContext(d);n||S(!1);let r=n.matches[n.matches.length-1]?.route.id;null==r&&S(!1);let[o]=e.useState((()=>String(++se))),[a]=e.useState((()=>(r||S(!1),function(t,n){return e.forwardRef(((r,o)=>{let a=ae(t,n);return e.createElement(q,Object.assign({},r,{ref:o,submit:a}))}))}(o,r)))),[i]=e.useState((()=>e=>{t||S(!1),r||S(!1),t.fetch(o,r,e)})),s=ae(o,r),u=t.getFetcher(o),l=e.useMemo((()=>({Form:a,submit:s,load:i,...u})),[u,a,s,i]);return e.useEffect((()=>()=>{t?t.deleteFetcher(o):console.warn("No router available to clean up from useFetcher()")}),[t,o]),l}function le(){return[...ee(X.UseFetchers).fetchers.values()]}let ce={};function fe({getKey:t,storageKey:n}={}){let{router:r}=Z(Q.UseScrollRestoration),{restoreScrollPosition:o,preventScrollReset:a}=ee(X.UseScrollRestoration),{basename:s}=e.useContext(i),u=l(),c=p(),f=h();e.useEffect((()=>(window.history.scrollRestoration="manual",()=>{window.history.scrollRestoration="auto"})),[]),function(t,n){let{capture:r}=n||{};e.useEffect((()=>{let e=null!=r?{capture:r}:void 0;return window.addEventListener("pagehide",t,e),()=>{window.removeEventListener("pagehide",t,e)}}),[t,r])}(e.useCallback((()=>{if("idle"===f.state){let e=(t?t(u,c):null)||u.key;ce[e]=window.scrollY}try{sessionStorage.setItem(n||"react-router-scroll-positions",JSON.stringify(ce))}catch(e){}window.history.scrollRestoration="auto"}),[n,t,f.state,u,c])),"undefined"!=typeof document&&(e.useLayoutEffect((()=>{try{let e=sessionStorage.getItem(n||"react-router-scroll-positions");e&&(ce=JSON.parse(e))}catch(e){}}),[n]),e.useLayoutEffect((()=>{let e=t&&"/"!==s?(e,n)=>t({...e,pathname:v(e.pathname,s)||e.pathname},n):t,n=r?.enableScrollRestoration(ce,(()=>window.scrollY),e);return()=>n&&n()}),[r,s,t]),e.useLayoutEffect((()=>{if(!1!==o)if("number"!=typeof o){if(u.hash){let e=document.getElementById(decodeURIComponent(u.hash.slice(1)));if(e)return void e.scrollIntoView()}!0!==a&&window.scrollTo(0,0)}else window.scrollTo(0,o)}),[u,o,a]))}function me(t,n){let{capture:r}=n||{};e.useEffect((()=>{let e=null!=r?{capture:r}:void 0;return window.addEventListener("beforeunload",t,e),()=>{window.removeEventListener("beforeunload",t,e)}}),[t,r])}function de({when:t,message:n}){let r=w(t);e.useEffect((()=>{if("blocked"===r.state){window.confirm(n)?setTimeout(r.proceed,0):r.reset()}}),[r,n]),e.useEffect((()=>{"blocked"!==r.state||t||r.reset()}),[r,t])}function pe(t,n={}){let r=e.useContext(O);null==r&&S(!1);let{basename:o}=Z(Q.useViewTransitionState),a=u(t,{relative:n.relative});if(!r.isTransitioning)return!1;let i=v(r.currentLocation.pathname,o)||r.currentLocation.pathname,s=v(r.nextLocation.pathname,o)||r.nextLocation.pathname;return null!=T(a.pathname,s)||null!=T(a.pathname,i)}export{I as BrowserRouter,J as Form,z as HashRouter,W as Link,Y as NavLink,K as RouterProvider,G as ScrollRestoration,O as UNSAFE_ViewTransitionContext,fe as UNSAFE_useScrollRestoration,k as createBrowserRouter,D as createHashRouter,x as createSearchParams,B as unstable_HistoryRouter,de as unstable_usePrompt,pe as unstable_useViewTransitionState,me as useBeforeUnload,ue as useFetcher,le as useFetchers,ie as useFormAction,te as useLinkClickHandler,ne as useSearchParams,oe as useSubmit};
//# sourceMappingURL=react-router-dom.production.min.js.map
+1
-1
dist/server.d.ts

@@ -10,3 +10,3 @@ import * as React from "react";

/**
* A <Router> that may not navigate to any other location. This is useful
* A `<Router>` that may not navigate to any other location. This is useful
* on the server where there is no stateful UI.

@@ -13,0 +13,0 @@ */

+15
-7
dist/server.js

@@ -31,3 +31,3 @@ 'use strict';

/**
* A <Router> that may not navigate to any other location. This is useful
* A `<Router>` that may not navigate to any other location. This is useful
* on the server where there is no stateful UI.

@@ -100,2 +100,6 @@ */

value: state
}, /*#__PURE__*/React__namespace.createElement(reactRouterDom.UNSAFE_ViewTransitionContext.Provider, {
value: {
isTransitioning: false
}
}, /*#__PURE__*/React__namespace.createElement(reactRouterDom.Router, {

@@ -110,3 +114,3 @@ basename: dataRouterContext.basename,

state: state
})))), hydrateScript ? /*#__PURE__*/React__namespace.createElement("script", {
}))))), hydrateScript ? /*#__PURE__*/React__namespace.createElement("script", {
suppressHydrationWarning: true,

@@ -219,2 +223,5 @@ nonce: nonce,

},
get window() {
return undefined;
},
initialize() {

@@ -266,10 +273,11 @@ throw msg("initialize");

function encodeLocation(to) {
// Locations should already be encoded on the server, so just return as-is
let path = typeof to === "string" ? reactRouterDom.parsePath(to) : to;
let href = typeof to === "string" ? to : reactRouterDom.createPath(to);
let encoded = ABSOLUTE_URL_REGEX.test(href) ? new URL(href) : new URL(href, "http://localhost");
return {
pathname: path.pathname || "",
search: path.search || "",
hash: path.hash || ""
pathname: encoded.pathname,
search: encoded.search,
hash: encoded.hash
};
}
const ABSOLUTE_URL_REGEX = /^(?:[a-z][a-z0-9+.-]*:|\/\/)/i;
// This utility is based on https://github.com/zertosh/htmlescape

@@ -276,0 +284,0 @@ // License: https://github.com/zertosh/htmlescape/blob/0527ca7156a524d256101bb310a9f970f63078ad/LICENSE

+16
-8
dist/server.mjs
import * as React from 'react';
import { Action, UNSAFE_invariant, isRouteErrorResponse, createStaticHandler as createStaticHandler$1, UNSAFE_convertRoutesToDataRoutes, IDLE_NAVIGATION, IDLE_FETCHER, IDLE_BLOCKER } from '@remix-run/router';
import { UNSAFE_useRoutesImpl, UNSAFE_mapRouteProperties } from 'react-router';
import { parsePath, Router, UNSAFE_DataRouterContext, UNSAFE_DataRouterStateContext, createPath } from 'react-router-dom';
import { parsePath, Router, UNSAFE_DataRouterContext, UNSAFE_DataRouterStateContext, UNSAFE_ViewTransitionContext, createPath } from 'react-router-dom';
/**
* A <Router> that may not navigate to any other location. This is useful
* A `<Router>` that may not navigate to any other location. This is useful
* on the server where there is no stateful UI.

@@ -75,2 +75,6 @@ */

value: state
}, /*#__PURE__*/React.createElement(UNSAFE_ViewTransitionContext.Provider, {
value: {
isTransitioning: false
}
}, /*#__PURE__*/React.createElement(Router, {

@@ -85,3 +89,3 @@ basename: dataRouterContext.basename,

state: state
})))), hydrateScript ? /*#__PURE__*/React.createElement("script", {
}))))), hydrateScript ? /*#__PURE__*/React.createElement("script", {
suppressHydrationWarning: true,

@@ -195,2 +199,5 @@ nonce: nonce,

},
get window() {
return undefined;
},
initialize() {

@@ -242,10 +249,11 @@ throw msg("initialize");

function encodeLocation(to) {
// Locations should already be encoded on the server, so just return as-is
let path = typeof to === "string" ? parsePath(to) : to;
let href = typeof to === "string" ? to : createPath(to);
let encoded = ABSOLUTE_URL_REGEX.test(href) ? new URL(href) : new URL(href, "http://localhost");
return {
pathname: path.pathname || "",
search: path.search || "",
hash: path.hash || ""
pathname: encoded.pathname,
search: encoded.search,
hash: encoded.hash
};
}
const ABSOLUTE_URL_REGEX = /^(?:[a-z][a-z0-9+.-]*:|\/\/)/i;

@@ -252,0 +260,0 @@ // This utility is based on https://github.com/zertosh/htmlescape

+320
-55
dist/umd/react-router-dom.development.js
/**
* React Router DOM v6.15.0
* React Router DOM v6.17.0
*

@@ -239,5 +239,5 @@ * Copyright (c) Remix Software Inc.

const _excluded = ["onClick", "relative", "reloadDocument", "replace", "state", "target", "to", "preventScrollReset"],
_excluded2 = ["aria-current", "caseSensitive", "className", "end", "style", "to", "children"],
_excluded3 = ["reloadDocument", "replace", "state", "method", "action", "onSubmit", "submit", "relative", "preventScrollReset"];
const _excluded = ["onClick", "relative", "reloadDocument", "replace", "state", "target", "to", "preventScrollReset", "unstable_viewTransition"],
_excluded2 = ["aria-current", "caseSensitive", "className", "end", "style", "to", "unstable_viewTransition", "children"],
_excluded3 = ["reloadDocument", "replace", "state", "method", "action", "onSubmit", "submit", "relative", "preventScrollReset", "unstable_viewTransition"];
//#endregion

@@ -259,3 +259,4 @@

routes,
mapRouteProperties: reactRouter.UNSAFE_mapRouteProperties
mapRouteProperties: reactRouter.UNSAFE_mapRouteProperties,
window: opts == null ? void 0 : opts.window
}).initialize();

@@ -274,3 +275,4 @@ }

routes,
mapRouteProperties: reactRouter.UNSAFE_mapRouteProperties
mapRouteProperties: reactRouter.UNSAFE_mapRouteProperties,
window: opts == null ? void 0 : opts.window
}).initialize();

@@ -296,3 +298,3 @@ }

if (val && val.__type === "RouteErrorResponse") {
serialized[key] = new router.ErrorResponse(val.status, val.statusText, val.data, val.internal === true);
serialized[key] = new router.UNSAFE_ErrorResponseImpl(val.status, val.statusText, val.data, val.internal === true);
} else if (val && val.__type === "Error") {

@@ -332,2 +334,14 @@ // Attempt to reconstruct the right type of Error (i.e., ReferenceError)

////////////////////////////////////////////////////////////////////////////////
//#region Contexts
////////////////////////////////////////////////////////////////////////////////
const ViewTransitionContext = /*#__PURE__*/React__namespace.createContext({
isTransitioning: false
});
{
ViewTransitionContext.displayName = "ViewTransition";
}
//#endregion
////////////////////////////////////////////////////////////////////////////////
//#region Components

@@ -359,6 +373,201 @@ ////////////////////////////////////////////////////////////////////////////////

const startTransitionImpl = React__namespace[START_TRANSITION];
function startTransitionSafe(cb) {
if (startTransitionImpl) {
startTransitionImpl(cb);
} else {
cb();
}
}
class Deferred {
// @ts-expect-error - no initializer
// @ts-expect-error - no initializer
constructor() {
this.status = "pending";
this.promise = new Promise((resolve, reject) => {
this.resolve = value => {
if (this.status === "pending") {
this.status = "resolved";
resolve(value);
}
};
this.reject = reason => {
if (this.status === "pending") {
this.status = "rejected";
reject(reason);
}
};
});
}
}
/**
* Given a Remix Router instance, render the appropriate UI
*/
function RouterProvider(_ref) {
let {
fallbackElement,
router,
future
} = _ref;
let [state, setStateImpl] = React__namespace.useState(router.state);
let [pendingState, setPendingState] = React__namespace.useState();
let [vtContext, setVtContext] = React__namespace.useState({
isTransitioning: false
});
let [renderDfd, setRenderDfd] = React__namespace.useState();
let [transition, setTransition] = React__namespace.useState();
let [interruption, setInterruption] = React__namespace.useState();
let {
v7_startTransition
} = future || {};
let optInStartTransition = React__namespace.useCallback(cb => {
if (v7_startTransition) {
startTransitionSafe(cb);
} else {
cb();
}
}, [v7_startTransition]);
let setState = React__namespace.useCallback((newState, _ref2) => {
let {
unstable_viewTransitionOpts: viewTransitionOpts
} = _ref2;
if (!viewTransitionOpts || router.window == null || typeof router.window.document.startViewTransition !== "function") {
// Mid-navigation state update, or startViewTransition isn't available
optInStartTransition(() => setStateImpl(newState));
} else if (transition && renderDfd) {
// Interrupting an in-progress transition, cancel and let everything flush
// out, and then kick off a new transition from the interruption state
renderDfd.resolve();
transition.skipTransition();
setInterruption({
state: newState,
currentLocation: viewTransitionOpts.currentLocation,
nextLocation: viewTransitionOpts.nextLocation
});
} else {
// Completed navigation update with opted-in view transitions, let 'er rip
setPendingState(newState);
setVtContext({
isTransitioning: true,
currentLocation: viewTransitionOpts.currentLocation,
nextLocation: viewTransitionOpts.nextLocation
});
}
}, [optInStartTransition, transition, renderDfd, router.window]);
// Need to use a layout effect here so we are subscribed early enough to
// pick up on any render-driven redirects/navigations (useEffect/<Navigate>)
React__namespace.useLayoutEffect(() => router.subscribe(setState), [router, setState]);
// When we start a view transition, create a Deferred we can use for the
// eventual "completed" render
React__namespace.useEffect(() => {
if (vtContext.isTransitioning) {
setRenderDfd(new Deferred());
}
}, [vtContext.isTransitioning]);
// Once the deferred is created, kick off startViewTransition() to update the
// DOM and then wait on the Deferred to resolve (indicating the DOM update has
// happened)
React__namespace.useEffect(() => {
if (renderDfd && pendingState && router.window) {
let newState = pendingState;
let renderPromise = renderDfd.promise;
let transition = router.window.document.startViewTransition(async () => {
optInStartTransition(() => setStateImpl(newState));
await renderPromise;
});
transition.finished.finally(() => {
setRenderDfd(undefined);
setTransition(undefined);
setPendingState(undefined);
setVtContext({
isTransitioning: false
});
});
setTransition(transition);
}
}, [optInStartTransition, pendingState, renderDfd, router.window]);
// When the new location finally renders and is committed to the DOM, this
// effect will run to resolve the transition
React__namespace.useEffect(() => {
if (renderDfd && pendingState && state.location.key === pendingState.location.key) {
renderDfd.resolve();
}
}, [renderDfd, transition, state.location, pendingState]);
// If we get interrupted with a new navigation during a transition, we skip
// the active transition, let it cleanup, then kick it off again here
React__namespace.useEffect(() => {
if (!vtContext.isTransitioning && interruption) {
setPendingState(interruption.state);
setVtContext({
isTransitioning: true,
currentLocation: interruption.currentLocation,
nextLocation: interruption.nextLocation
});
setInterruption(undefined);
}
}, [vtContext.isTransitioning, interruption]);
let navigator = React__namespace.useMemo(() => {
return {
createHref: router.createHref,
encodeLocation: router.encodeLocation,
go: n => router.navigate(n),
push: (to, state, opts) => router.navigate(to, {
state,
preventScrollReset: opts == null ? void 0 : opts.preventScrollReset
}),
replace: (to, state, opts) => router.navigate(to, {
replace: true,
state,
preventScrollReset: opts == null ? void 0 : opts.preventScrollReset
})
};
}, [router]);
let basename = router.basename || "/";
let dataRouterContext = React__namespace.useMemo(() => ({
router,
navigator,
static: false,
basename
}), [router, navigator, basename]);
// The fragment and {null} here are important! We need them to keep React 18's
// useId happy when we are server-rendering since we may have a <script> here
// containing the hydrated server-side staticContext (from StaticRouterProvider).
// useId relies on the component tree structure to generate deterministic id's
// so we need to ensure it remains the same on the client even though
// we don't need the <script> tag
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement(reactRouter.UNSAFE_DataRouterContext.Provider, {
value: dataRouterContext
}, /*#__PURE__*/React__namespace.createElement(reactRouter.UNSAFE_DataRouterStateContext.Provider, {
value: state
}, /*#__PURE__*/React__namespace.createElement(ViewTransitionContext.Provider, {
value: vtContext
}, /*#__PURE__*/React__namespace.createElement(reactRouter.Router, {
basename: basename,
location: state.location,
navigationType: state.historyAction,
navigator: navigator
}, state.initialized ? /*#__PURE__*/React__namespace.createElement(DataRoutes, {
routes: router.routes,
state: state
}) : fallbackElement)))), null);
}
function DataRoutes(_ref3) {
let {
routes,
state
} = _ref3;
return reactRouter.UNSAFE_useRoutesImpl(routes, undefined, state);
}
/**
* A `<Router>` for use in web browsers. Provides the cleanest URLs.
*/
function BrowserRouter(_ref) {
function BrowserRouter(_ref4) {
let {

@@ -369,3 +578,3 @@ basename,

window
} = _ref;
} = _ref4;
let historyRef = React__namespace.useRef();

@@ -402,3 +611,3 @@ if (historyRef.current == null) {

*/
function HashRouter(_ref2) {
function HashRouter(_ref5) {
let {

@@ -409,3 +618,3 @@ basename,

window
} = _ref2;
} = _ref5;
let historyRef = React__namespace.useRef();

@@ -444,3 +653,3 @@ if (historyRef.current == null) {

*/
function HistoryRouter(_ref3) {
function HistoryRouter(_ref6) {
let {

@@ -451,3 +660,3 @@ basename,

history
} = _ref3;
} = _ref6;
let [state, setStateImpl] = React__namespace.useState({

@@ -479,5 +688,5 @@ action: history.action,

/**
* The public API for rendering a history-aware <a>.
* The public API for rendering a history-aware `<a>`.
*/
const Link = /*#__PURE__*/React__namespace.forwardRef(function LinkWithRef(_ref4, ref) {
const Link = /*#__PURE__*/React__namespace.forwardRef(function LinkWithRef(_ref7, ref) {
let {

@@ -491,5 +700,6 @@ onClick,

to,
preventScrollReset
} = _ref4,
rest = _objectWithoutPropertiesLoose(_ref4, _excluded);
preventScrollReset,
unstable_viewTransition
} = _ref7,
rest = _objectWithoutPropertiesLoose(_ref7, _excluded);
let {

@@ -534,3 +744,4 @@ basename

preventScrollReset,
relative
relative,
unstable_viewTransition
});

@@ -558,5 +769,5 @@ function handleClick(event) {

/**
* A <Link> wrapper that knows if it's "active" or not.
* A `<Link>` wrapper that knows if it's "active" or not.
*/
const NavLink = /*#__PURE__*/React__namespace.forwardRef(function NavLinkWithRef(_ref5, ref) {
const NavLink = /*#__PURE__*/React__namespace.forwardRef(function NavLinkWithRef(_ref8, ref) {
let {

@@ -569,5 +780,6 @@ "aria-current": ariaCurrentProp = "page",

to,
unstable_viewTransition,
children
} = _ref5,
rest = _objectWithoutPropertiesLoose(_ref5, _excluded2);
} = _ref8,
rest = _objectWithoutPropertiesLoose(_ref8, _excluded2);
let path = reactRouter.useResolvedPath(to, {

@@ -581,2 +793,6 @@ relative: rest.relative

} = React__namespace.useContext(reactRouter.UNSAFE_NavigationContext);
let isTransitioning = routerState != null &&
// Conditional usage is OK here because the usage of a data router is static
// eslint-disable-next-line react-hooks/rules-of-hooks
useViewTransitionState(path) && unstable_viewTransition === true;
let toPathname = navigator.encodeLocation ? navigator.encodeLocation(path).pathname : path.pathname;

@@ -592,9 +808,11 @@ let locationPathname = location.pathname;

let isPending = nextLocationPathname != null && (nextLocationPathname === toPathname || !end && nextLocationPathname.startsWith(toPathname) && nextLocationPathname.charAt(toPathname.length) === "/");
let renderProps = {
isActive,
isPending,
isTransitioning
};
let ariaCurrent = isActive ? ariaCurrentProp : undefined;
let className;
if (typeof classNameProp === "function") {
className = classNameProp({
isActive,
isPending
});
className = classNameProp(renderProps);
} else {

@@ -606,8 +824,5 @@ // If the className prop is not a function, we use a default `active`

// simple styling rules working as they currently do.
className = [classNameProp, isActive ? "active" : null, isPending ? "pending" : null].filter(Boolean).join(" ");
className = [classNameProp, isActive ? "active" : null, isPending ? "pending" : null, isTransitioning ? "transitioning" : null].filter(Boolean).join(" ");
}
let style = typeof styleProp === "function" ? styleProp({
isActive,
isPending
}) : styleProp;
let style = typeof styleProp === "function" ? styleProp(renderProps) : styleProp;
return /*#__PURE__*/React__namespace.createElement(Link, _extends({}, rest, {

@@ -618,7 +833,5 @@ "aria-current": ariaCurrent,

style: style,
to: to
}), typeof children === "function" ? children({
isActive,
isPending
}) : children);
to: to,
unstable_viewTransition: unstable_viewTransition
}), typeof children === "function" ? children(renderProps) : children);
});

@@ -644,3 +857,3 @@ {

}
const FormImpl = /*#__PURE__*/React__namespace.forwardRef((_ref6, forwardedRef) => {
const FormImpl = /*#__PURE__*/React__namespace.forwardRef((_ref9, forwardedRef) => {
let {

@@ -655,5 +868,6 @@ reloadDocument,

relative,
preventScrollReset
} = _ref6,
props = _objectWithoutPropertiesLoose(_ref6, _excluded3);
preventScrollReset,
unstable_viewTransition
} = _ref9,
props = _objectWithoutPropertiesLoose(_ref9, _excluded3);
let formMethod = method.toLowerCase() === "get" ? "get" : "post";

@@ -674,3 +888,4 @@ let formAction = useFormAction(action, {

relative,
preventScrollReset
preventScrollReset,
unstable_viewTransition
});

@@ -692,7 +907,7 @@ };

*/
function ScrollRestoration(_ref7) {
function ScrollRestoration(_ref10) {
let {
getKey,
storageKey
} = _ref7;
} = _ref10;
useScrollRestoration({

@@ -717,2 +932,3 @@ getKey,

DataRouterHook["UseFetcher"] = "useFetcher";
DataRouterHook["useViewTransitionState"] = "useViewTransitionState";
return DataRouterHook;

@@ -750,3 +966,4 @@ }(DataRouterHook || {});

preventScrollReset,
relative
relative,
unstable_viewTransition
} = _temp === void 0 ? {} : _temp;

@@ -769,6 +986,7 @@ let navigate = reactRouter.useNavigate();

preventScrollReset,
relative
relative,
unstable_viewTransition
});
}
}, [location, navigate, path, replaceProp, state, target, to, preventScrollReset, relative]);
}, [location, navigate, path, replaceProp, state, target, to, preventScrollReset, relative, unstable_viewTransition]);
}

@@ -845,3 +1063,4 @@

state: options.state,
fromRouteId: currentRouteId
fromRouteId: currentRouteId,
unstable_viewTransition: options.unstable_viewTransition
});

@@ -949,2 +1168,3 @@ }, [router, basename, currentRouteId]);

let fetcherId = 0;
// TODO: (v7) Change the useFetcher generic default from `any` to `unknown`
/**

@@ -1042,3 +1262,7 @@ * Interacts with route loaders and actions without causing a navigation. Great

}
sessionStorage.setItem(storageKey || SCROLL_RESTORATION_STORAGE_KEY, JSON.stringify(savedScrollPositions));
try {
sessionStorage.setItem(storageKey || SCROLL_RESTORATION_STORAGE_KEY, JSON.stringify(savedScrollPositions));
} catch (error) {
router.UNSAFE_warning(false, "Failed to save scroll positions in sessionStorage, <ScrollRestoration /> will not work properly (" + error + ").") ;
}
window.history.scrollRestoration = "auto";

@@ -1160,7 +1384,7 @@ }, [storageKey, getKey, navigation.state, location, matches]));

*/
function usePrompt(_ref8) {
function usePrompt(_ref11) {
let {
when,
message
} = _ref8;
} = _ref11;
let blocker = reactRouter.unstable_useBlocker(when);

@@ -1187,2 +1411,44 @@ React__namespace.useEffect(() => {

/**
* Return a boolean indicating if there is an active view transition to the
* given href. You can use this value to render CSS classes or viewTransitionName
* styles onto your elements
*
* @param href The destination href
* @param [opts.relative] Relative routing type ("route" | "path")
*/
function useViewTransitionState(to, opts) {
if (opts === void 0) {
opts = {};
}
let vtContext = React__namespace.useContext(ViewTransitionContext);
!(vtContext != null) ? router.UNSAFE_invariant(false, "`unstable_useViewTransitionState` must be used within `react-router-dom`'s `RouterProvider`. " + "Did you accidentally import `RouterProvider` from `react-router`?") : void 0;
let {
basename
} = useDataRouterContext(DataRouterHook.useViewTransitionState);
let path = reactRouter.useResolvedPath(to, {
relative: opts.relative
});
if (!vtContext.isTransitioning) {
return false;
}
let currentPath = router.stripBasename(vtContext.currentLocation.pathname, basename) || vtContext.currentLocation.pathname;
let nextPath = router.stripBasename(vtContext.nextLocation.pathname, basename) || vtContext.nextLocation.pathname;
// Transition is active if we're going to or coming from the indicated
// destination. This ensures that other PUSH navigations that reverse
// an indicated transition apply. I.e., on the list view you have:
//
// <NavLink to="/details/1" unstable_viewTransition>
//
// If you click the breadcrumb back to the list view:
//
// <NavLink to="/list" unstable_viewTransition>
//
// We should apply the transition because it's indicated as active going
// from /list -> /details/1 and therefore should be active on the reverse
// (even though this isn't strictly a POP reverse)
return router.matchPath(path.pathname, nextPath) != null || router.matchPath(path.pathname, currentPath) != null;
}
//#endregion

@@ -1222,6 +1488,2 @@

});
Object.defineProperty(exports, 'RouterProvider', {
enumerable: true,
get: function () { return reactRouter.RouterProvider; }
});
Object.defineProperty(exports, 'Routes', {

@@ -1404,3 +1666,5 @@ enumerable: true,

exports.NavLink = NavLink;
exports.RouterProvider = RouterProvider;
exports.ScrollRestoration = ScrollRestoration;
exports.UNSAFE_ViewTransitionContext = ViewTransitionContext;
exports.UNSAFE_useScrollRestoration = useScrollRestoration;

@@ -1412,2 +1676,3 @@ exports.createBrowserRouter = createBrowserRouter;

exports.unstable_usePrompt = usePrompt;
exports.unstable_useViewTransitionState = useViewTransitionState;
exports.useBeforeUnload = useBeforeUnload;

@@ -1414,0 +1679,0 @@ exports.useFetcher = useFetcher;

+2
-2
dist/umd/react-router-dom.production.min.js
/**
* React Router DOM v6.15.0
* React Router DOM v6.17.0
*

@@ -11,3 +11,3 @@ * Copyright (c) Remix Software Inc.

*/
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("react-router"),require("@remix-run/router")):"function"==typeof define&&define.amd?define(["exports","react","react-router","@remix-run/router"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).ReactRouterDOM={},e.React,e.ReactRouter,e.RemixRouter)}(this,(function(e,t,r,n){"use strict";function o(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var a=o(t);function u(){return u=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e},u.apply(this,arguments)}function i(e,t){if(null==e)return{};var r,n,o={},a=Object.keys(e);for(n=0;n<a.length;n++)r=a[n],t.indexOf(r)>=0||(o[r]=e[r]);return o}const c="get",s="application/x-www-form-urlencoded";function l(e){return null!=e&&"string"==typeof e.tagName}function f(e){return void 0===e&&(e=""),new URLSearchParams("string"==typeof e||Array.isArray(e)||e instanceof URLSearchParams?e:Object.keys(e).reduce(((t,r)=>{let n=e[r];return t.concat(Array.isArray(n)?n.map((e=>[r,e])):[[r,n]])}),[]))}let d=null;const m=new Set(["application/x-www-form-urlencoded","multipart/form-data","text/plain"]);function b(e){return null==e||m.has(e)?e:null}function p(e,t){let r,o,a,u,i;if(l(f=e)&&"form"===f.tagName.toLowerCase()){let i=e.getAttribute("action");o=i?n.stripBasename(i,t):null,r=e.getAttribute("method")||c,a=b(e.getAttribute("enctype"))||s,u=new FormData(e)}else if(function(e){return l(e)&&"button"===e.tagName.toLowerCase()}(e)||function(e){return l(e)&&"input"===e.tagName.toLowerCase()}(e)&&("submit"===e.type||"image"===e.type)){let i=e.form;if(null==i)throw new Error('Cannot submit a <button> or <input type="submit"> without a <form>');let l=e.getAttribute("formaction")||i.getAttribute("action");if(o=l?n.stripBasename(l,t):null,r=e.getAttribute("formmethod")||i.getAttribute("method")||c,a=b(e.getAttribute("formenctype"))||b(i.getAttribute("enctype"))||s,u=new FormData(i,e),!function(){if(null===d)try{new FormData(document.createElement("form"),0),d=!1}catch(e){d=!0}return d}()){let{name:t,type:r,value:n}=e;if("image"===r){let e=t?t+".":"";u.append(e+"x","0"),u.append(e+"y","0")}else t&&u.append(t,n)}}else{if(l(e))throw new Error('Cannot submit element that is not <form>, <button>, or <input type="submit|image">');r=c,o=null,a=s,i=e}var f;return u&&"text/plain"===a&&(i=u,u=void 0),{action:o,method:r.toLowerCase(),encType:a,formData:u,body:i}}const y=["onClick","relative","reloadDocument","replace","state","target","to","preventScrollReset"],g=["aria-current","caseSensitive","className","end","style","to","children"],h=["reloadDocument","replace","state","method","action","onSubmit","submit","relative","preventScrollReset"];function v(){var e;let t=null==(e=window)?void 0:e.__staticRouterHydrationData;return t&&t.errors&&(t=u({},t,{errors:R(t.errors)})),t}function R(e){if(!e)return null;let t=Object.entries(e),r={};for(let[e,o]of t)if(o&&"RouteErrorResponse"===o.__type)r[e]=new n.ErrorResponse(o.status,o.statusText,o.data,!0===o.internal);else if(o&&"Error"===o.__type){if(o.__subType){let t=window[o.__subType];if("function"==typeof t)try{let n=new t(o.message);n.stack="",r[e]=n}catch(e){}}if(null==r[e]){let t=new Error(o.message);t.stack="",r[e]=t}}else r[e]=o;return r}const w=a.startTransition;const P="undefined"!=typeof window&&void 0!==window.document&&void 0!==window.document.createElement,S=/^(?:[a-z][a-z0-9+.-]*:|\/\/)/i,E=a.forwardRef((function(e,t){let o,{onClick:c,relative:s,reloadDocument:l,replace:f,state:d,target:m,to:b,preventScrollReset:p}=e,g=i(e,y),{basename:h}=a.useContext(r.UNSAFE_NavigationContext),v=!1;if("string"==typeof b&&S.test(b)&&(o=b,P))try{let e=new URL(window.location.href),t=b.startsWith("//")?new URL(e.protocol+b):new URL(b),r=n.stripBasename(t.pathname,h);t.origin===e.origin&&null!=r?b=r+t.search+t.hash:v=!0}catch(e){}let R=r.useHref(b,{relative:s}),w=U(b,{replace:f,state:d,target:m,preventScrollReset:p,relative:s});return a.createElement("a",u({},g,{href:o||R,onClick:v||l?c:function(e){c&&c(e),e.defaultPrevented||w(e)},ref:t,target:m}))})),O=a.forwardRef((function(e,t){let{"aria-current":n="page",caseSensitive:o=!1,className:c="",end:s=!1,style:l,to:f,children:d}=e,m=i(e,g),b=r.useResolvedPath(f,{relative:m.relative}),p=r.useLocation(),y=a.useContext(r.UNSAFE_DataRouterStateContext),{navigator:h}=a.useContext(r.UNSAFE_NavigationContext),v=h.encodeLocation?h.encodeLocation(b).pathname:b.pathname,R=p.pathname,w=y&&y.navigation&&y.navigation.location?y.navigation.location.pathname:null;o||(R=R.toLowerCase(),w=w?w.toLowerCase():null,v=v.toLowerCase());let P,S=R===v||!s&&R.startsWith(v)&&"/"===R.charAt(v.length),O=null!=w&&(w===v||!s&&w.startsWith(v)&&"/"===w.charAt(v.length)),j=S?n:void 0;P="function"==typeof c?c({isActive:S,isPending:O}):[c,S?"active":null,O?"pending":null].filter(Boolean).join(" ");let N="function"==typeof l?l({isActive:S,isPending:O}):l;return a.createElement(E,u({},m,{"aria-current":j,className:P,ref:t,style:N,to:f}),"function"==typeof d?d({isActive:S,isPending:O}):d)})),j=a.forwardRef(((e,t)=>{let r=L();return a.createElement(N,u({},e,{submit:r,ref:t}))})),N=a.forwardRef(((e,t)=>{let{reloadDocument:r,replace:n,state:o,method:s=c,action:l,onSubmit:f,submit:d,relative:m,preventScrollReset:b}=e,p=i(e,h),y="get"===s.toLowerCase()?"get":"post",g=T(l,{relative:m});return a.createElement("form",u({ref:t,method:y,action:g,onSubmit:r?f:e=>{if(f&&f(e),e.defaultPrevented)return;e.preventDefault();let t=e.nativeEvent.submitter,r=(null==t?void 0:t.getAttribute("formmethod"))||s;d(t||e.currentTarget,{method:r,replace:n,state:o,relative:m,preventScrollReset:b})}},p))}));var A=function(e){return e.UseScrollRestoration="useScrollRestoration",e.UseSubmit="useSubmit",e.UseSubmitFetcher="useSubmitFetcher",e.UseFetcher="useFetcher",e}(A||{}),C=function(e){return e.UseFetchers="useFetchers",e.UseScrollRestoration="useScrollRestoration",e}(C||{});function _(e){let t=a.useContext(r.UNSAFE_DataRouterContext);return t||n.UNSAFE_invariant(!1),t}function F(e){let t=a.useContext(r.UNSAFE_DataRouterStateContext);return t||n.UNSAFE_invariant(!1),t}function U(e,t){let{target:n,replace:o,state:u,preventScrollReset:i,relative:c}=void 0===t?{}:t,s=r.useNavigate(),l=r.useLocation(),f=r.useResolvedPath(e,{relative:c});return a.useCallback((t=>{if(function(e,t){return!(0!==e.button||t&&"_self"!==t||function(e){return!!(e.metaKey||e.altKey||e.ctrlKey||e.shiftKey)}(e))}(t,n)){t.preventDefault();let n=void 0!==o?o:r.createPath(l)===r.createPath(f);s(e,{replace:n,state:u,preventScrollReset:i,relative:c})}}),[l,s,f,o,u,n,e,i,c])}function x(){if("undefined"==typeof document)throw new Error("You are calling submit during the server render. Try calling submit within a `useEffect` or callback instead.")}function L(){let{router:e}=_(A.UseSubmit),{basename:t}=a.useContext(r.UNSAFE_NavigationContext),n=r.UNSAFE_useRouteId();return a.useCallback((function(r,o){void 0===o&&(o={}),x();let{action:a,method:u,encType:i,formData:c,body:s}=p(r,t);e.navigate(o.action||a,{preventScrollReset:o.preventScrollReset,formData:c,body:s,formMethod:o.method||u,formEncType:o.encType||i,replace:o.replace,state:o.state,fromRouteId:n})}),[e,t,n])}function D(e,t){let{router:o}=_(A.UseSubmitFetcher),{basename:u}=a.useContext(r.UNSAFE_NavigationContext);return a.useCallback((function(r,a){void 0===a&&(a={}),x();let{action:i,method:c,encType:s,formData:l,body:f}=p(r,u);null==t&&n.UNSAFE_invariant(!1),o.fetch(e,t,a.action||i,{preventScrollReset:a.preventScrollReset,formData:l,body:f,formMethod:a.method||c,formEncType:a.encType||s})}),[o,u,e,t])}function T(e,t){let{relative:o}=void 0===t?{}:t,{basename:i}=a.useContext(r.UNSAFE_NavigationContext),c=a.useContext(r.UNSAFE_RouteContext);c||n.UNSAFE_invariant(!1);let[s]=c.matches.slice(-1),l=u({},r.useResolvedPath(e||".",{relative:o})),f=r.useLocation();if(null==e&&(l.search=f.search,s.route.index)){let e=new URLSearchParams(l.search);e.delete("index"),l.search=e.toString()?"?"+e.toString():""}return e&&"."!==e||!s.route.index||(l.search=l.search?l.search.replace(/^\?/,"?index&"):"?index"),"/"!==i&&(l.pathname="/"===l.pathname?i:n.joinPaths([i,l.pathname])),r.createPath(l)}let k=0;const M="react-router-scroll-positions";let B={};function H(e){let{getKey:t,storageKey:o}=void 0===e?{}:e,{router:i}=_(A.UseScrollRestoration),{restoreScrollPosition:c,preventScrollReset:s}=F(C.UseScrollRestoration),{basename:l}=a.useContext(r.UNSAFE_NavigationContext),f=r.useLocation(),d=r.useMatches(),m=r.useNavigation();a.useEffect((()=>(window.history.scrollRestoration="manual",()=>{window.history.scrollRestoration="auto"})),[]),function(e,t){let{capture:r}=t||{};a.useEffect((()=>{let t=null!=r?{capture:r}:void 0;return window.addEventListener("pagehide",e,t),()=>{window.removeEventListener("pagehide",e,t)}}),[e,r])}(a.useCallback((()=>{if("idle"===m.state){let e=(t?t(f,d):null)||f.key;B[e]=window.scrollY}sessionStorage.setItem(o||M,JSON.stringify(B)),window.history.scrollRestoration="auto"}),[o,t,m.state,f,d])),"undefined"!=typeof document&&(a.useLayoutEffect((()=>{try{let e=sessionStorage.getItem(o||M);e&&(B=JSON.parse(e))}catch(e){}}),[o]),a.useLayoutEffect((()=>{let e=t&&"/"!==l?(e,r)=>t(u({},e,{pathname:n.stripBasename(e.pathname,l)||e.pathname}),r):t,r=null==i?void 0:i.enableScrollRestoration(B,(()=>window.scrollY),e);return()=>r&&r()}),[i,l,t]),a.useLayoutEffect((()=>{if(!1!==c)if("number"!=typeof c){if(f.hash){let e=document.getElementById(decodeURIComponent(f.hash.slice(1)));if(e)return void e.scrollIntoView()}!0!==s&&window.scrollTo(0,0)}else window.scrollTo(0,c)}),[f,c,s]))}Object.defineProperty(e,"AbortedDeferredError",{enumerable:!0,get:function(){return r.AbortedDeferredError}}),Object.defineProperty(e,"Await",{enumerable:!0,get:function(){return r.Await}}),Object.defineProperty(e,"MemoryRouter",{enumerable:!0,get:function(){return r.MemoryRouter}}),Object.defineProperty(e,"Navigate",{enumerable:!0,get:function(){return r.Navigate}}),Object.defineProperty(e,"NavigationType",{enumerable:!0,get:function(){return r.NavigationType}}),Object.defineProperty(e,"Outlet",{enumerable:!0,get:function(){return r.Outlet}}),Object.defineProperty(e,"Route",{enumerable:!0,get:function(){return r.Route}}),Object.defineProperty(e,"Router",{enumerable:!0,get:function(){return r.Router}}),Object.defineProperty(e,"RouterProvider",{enumerable:!0,get:function(){return r.RouterProvider}}),Object.defineProperty(e,"Routes",{enumerable:!0,get:function(){return r.Routes}}),Object.defineProperty(e,"UNSAFE_DataRouterContext",{enumerable:!0,get:function(){return r.UNSAFE_DataRouterContext}}),Object.defineProperty(e,"UNSAFE_DataRouterStateContext",{enumerable:!0,get:function(){return r.UNSAFE_DataRouterStateContext}}),Object.defineProperty(e,"UNSAFE_LocationContext",{enumerable:!0,get:function(){return r.UNSAFE_LocationContext}}),Object.defineProperty(e,"UNSAFE_NavigationContext",{enumerable:!0,get:function(){return r.UNSAFE_NavigationContext}}),Object.defineProperty(e,"UNSAFE_RouteContext",{enumerable:!0,get:function(){return r.UNSAFE_RouteContext}}),Object.defineProperty(e,"UNSAFE_useRouteId",{enumerable:!0,get:function(){return r.UNSAFE_useRouteId}}),Object.defineProperty(e,"createMemoryRouter",{enumerable:!0,get:function(){return r.createMemoryRouter}}),Object.defineProperty(e,"createPath",{enumerable:!0,get:function(){return r.createPath}}),Object.defineProperty(e,"createRoutesFromChildren",{enumerable:!0,get:function(){return r.createRoutesFromChildren}}),Object.defineProperty(e,"createRoutesFromElements",{enumerable:!0,get:function(){return r.createRoutesFromElements}}),Object.defineProperty(e,"defer",{enumerable:!0,get:function(){return r.defer}}),Object.defineProperty(e,"generatePath",{enumerable:!0,get:function(){return r.generatePath}}),Object.defineProperty(e,"isRouteErrorResponse",{enumerable:!0,get:function(){return r.isRouteErrorResponse}}),Object.defineProperty(e,"json",{enumerable:!0,get:function(){return r.json}}),Object.defineProperty(e,"matchPath",{enumerable:!0,get:function(){return r.matchPath}}),Object.defineProperty(e,"matchRoutes",{enumerable:!0,get:function(){return r.matchRoutes}}),Object.defineProperty(e,"parsePath",{enumerable:!0,get:function(){return r.parsePath}}),Object.defineProperty(e,"redirect",{enumerable:!0,get:function(){return r.redirect}}),Object.defineProperty(e,"redirectDocument",{enumerable:!0,get:function(){return r.redirectDocument}}),Object.defineProperty(e,"renderMatches",{enumerable:!0,get:function(){return r.renderMatches}}),Object.defineProperty(e,"resolvePath",{enumerable:!0,get:function(){return r.resolvePath}}),Object.defineProperty(e,"unstable_useBlocker",{enumerable:!0,get:function(){return r.unstable_useBlocker}}),Object.defineProperty(e,"useActionData",{enumerable:!0,get:function(){return r.useActionData}}),Object.defineProperty(e,"useAsyncError",{enumerable:!0,get:function(){return r.useAsyncError}}),Object.defineProperty(e,"useAsyncValue",{enumerable:!0,get:function(){return r.useAsyncValue}}),Object.defineProperty(e,"useHref",{enumerable:!0,get:function(){return r.useHref}}),Object.defineProperty(e,"useInRouterContext",{enumerable:!0,get:function(){return r.useInRouterContext}}),Object.defineProperty(e,"useLoaderData",{enumerable:!0,get:function(){return r.useLoaderData}}),Object.defineProperty(e,"useLocation",{enumerable:!0,get:function(){return r.useLocation}}),Object.defineProperty(e,"useMatch",{enumerable:!0,get:function(){return r.useMatch}}),Object.defineProperty(e,"useMatches",{enumerable:!0,get:function(){return r.useMatches}}),Object.defineProperty(e,"useNavigate",{enumerable:!0,get:function(){return r.useNavigate}}),Object.defineProperty(e,"useNavigation",{enumerable:!0,get:function(){return r.useNavigation}}),Object.defineProperty(e,"useNavigationType",{enumerable:!0,get:function(){return r.useNavigationType}}),Object.defineProperty(e,"useOutlet",{enumerable:!0,get:function(){return r.useOutlet}}),Object.defineProperty(e,"useOutletContext",{enumerable:!0,get:function(){return r.useOutletContext}}),Object.defineProperty(e,"useParams",{enumerable:!0,get:function(){return r.useParams}}),Object.defineProperty(e,"useResolvedPath",{enumerable:!0,get:function(){return r.useResolvedPath}}),Object.defineProperty(e,"useRevalidator",{enumerable:!0,get:function(){return r.useRevalidator}}),Object.defineProperty(e,"useRouteError",{enumerable:!0,get:function(){return r.useRouteError}}),Object.defineProperty(e,"useRouteLoaderData",{enumerable:!0,get:function(){return r.useRouteLoaderData}}),Object.defineProperty(e,"useRoutes",{enumerable:!0,get:function(){return r.useRoutes}}),e.BrowserRouter=function(e){let{basename:t,children:o,future:u,window:i}=e,c=a.useRef();null==c.current&&(c.current=n.createBrowserHistory({window:i,v5Compat:!0}));let s=c.current,[l,f]=a.useState({action:s.action,location:s.location}),{v7_startTransition:d}=u||{},m=a.useCallback((e=>{d&&w?w((()=>f(e))):f(e)}),[f,d]);return a.useLayoutEffect((()=>s.listen(m)),[s,m]),a.createElement(r.Router,{basename:t,children:o,location:l.location,navigationType:l.action,navigator:s})},e.Form=j,e.HashRouter=function(e){let{basename:t,children:o,future:u,window:i}=e,c=a.useRef();null==c.current&&(c.current=n.createHashHistory({window:i,v5Compat:!0}));let s=c.current,[l,f]=a.useState({action:s.action,location:s.location}),{v7_startTransition:d}=u||{},m=a.useCallback((e=>{d&&w?w((()=>f(e))):f(e)}),[f,d]);return a.useLayoutEffect((()=>s.listen(m)),[s,m]),a.createElement(r.Router,{basename:t,children:o,location:l.location,navigationType:l.action,navigator:s})},e.Link=E,e.NavLink=O,e.ScrollRestoration=function(e){let{getKey:t,storageKey:r}=e;return H({getKey:t,storageKey:r}),null},e.UNSAFE_useScrollRestoration=H,e.createBrowserRouter=function(e,t){return n.createRouter({basename:null==t?void 0:t.basename,future:u({},null==t?void 0:t.future,{v7_prependBasename:!0}),history:n.createBrowserHistory({window:null==t?void 0:t.window}),hydrationData:(null==t?void 0:t.hydrationData)||v(),routes:e,mapRouteProperties:r.UNSAFE_mapRouteProperties}).initialize()},e.createHashRouter=function(e,t){return n.createRouter({basename:null==t?void 0:t.basename,future:u({},null==t?void 0:t.future,{v7_prependBasename:!0}),history:n.createHashHistory({window:null==t?void 0:t.window}),hydrationData:(null==t?void 0:t.hydrationData)||v(),routes:e,mapRouteProperties:r.UNSAFE_mapRouteProperties}).initialize()},e.createSearchParams=f,e.unstable_HistoryRouter=function(e){let{basename:t,children:n,future:o,history:u}=e,[i,c]=a.useState({action:u.action,location:u.location}),{v7_startTransition:s}=o||{},l=a.useCallback((e=>{s&&w?w((()=>c(e))):c(e)}),[c,s]);return a.useLayoutEffect((()=>u.listen(l)),[u,l]),a.createElement(r.Router,{basename:t,children:n,location:i.location,navigationType:i.action,navigator:u})},e.unstable_usePrompt=function(e){let{when:t,message:n}=e,o=r.unstable_useBlocker(t);a.useEffect((()=>{if("blocked"===o.state){window.confirm(n)?setTimeout(o.proceed,0):o.reset()}}),[o,n]),a.useEffect((()=>{"blocked"!==o.state||t||o.reset()}),[o,t])},e.useBeforeUnload=function(e,t){let{capture:r}=t||{};a.useEffect((()=>{let t=null!=r?{capture:r}:void 0;return window.addEventListener("beforeunload",e,t),()=>{window.removeEventListener("beforeunload",e,t)}}),[e,r])},e.useFetcher=function(){var e;let{router:t}=_(A.UseFetcher),o=a.useContext(r.UNSAFE_RouteContext);o||n.UNSAFE_invariant(!1);let i=null==(e=o.matches[o.matches.length-1])?void 0:e.route.id;null==i&&n.UNSAFE_invariant(!1);let[c]=a.useState((()=>String(++k))),[s]=a.useState((()=>(i||n.UNSAFE_invariant(!1),function(e,t){return a.forwardRef(((r,n)=>{let o=D(e,t);return a.createElement(N,u({},r,{ref:n,submit:o}))}))}(c,i)))),[l]=a.useState((()=>e=>{t||n.UNSAFE_invariant(!1),i||n.UNSAFE_invariant(!1),t.fetch(c,i,e)})),f=D(c,i),d=t.getFetcher(c),m=a.useMemo((()=>u({Form:s,submit:f,load:l},d)),[d,s,f,l]);return a.useEffect((()=>()=>{t?t.deleteFetcher(c):console.warn("No router available to clean up from useFetcher()")}),[t,c]),m},e.useFetchers=function(){return[...F(C.UseFetchers).fetchers.values()]},e.useFormAction=T,e.useLinkClickHandler=U,e.useSearchParams=function(e){let t=a.useRef(f(e)),n=a.useRef(!1),o=r.useLocation(),u=a.useMemo((()=>function(e,t){let r=f(e);return t&&t.forEach(((e,n)=>{r.has(n)||t.getAll(n).forEach((e=>{r.append(n,e)}))})),r}(o.search,n.current?null:t.current)),[o.search]),i=r.useNavigate(),c=a.useCallback(((e,t)=>{const r=f("function"==typeof e?e(u):e);n.current=!0,i("?"+r,t)}),[i,u]);return[u,c]},e.useSubmit=L,Object.defineProperty(e,"__esModule",{value:!0})}));
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("react-router"),require("@remix-run/router")):"function"==typeof define&&define.amd?define(["exports","react","react-router","@remix-run/router"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).ReactRouterDOM={},e.React,e.ReactRouter,e.RemixRouter)}(this,(function(e,t,n,r){"use strict";function o(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(n){if("default"!==n){var r=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,r.get?r:{enumerable:!0,get:function(){return e[n]}})}})),t.default=e,Object.freeze(t)}var a=o(t);function i(){return i=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},i.apply(this,arguments)}function u(e,t){if(null==e)return{};var n,r,o={},a=Object.keys(e);for(r=0;r<a.length;r++)n=a[r],t.indexOf(n)>=0||(o[n]=e[n]);return o}const s="get",c="application/x-www-form-urlencoded";function l(e){return null!=e&&"string"==typeof e.tagName}function f(e){return void 0===e&&(e=""),new URLSearchParams("string"==typeof e||Array.isArray(e)||e instanceof URLSearchParams?e:Object.keys(e).reduce(((t,n)=>{let r=e[n];return t.concat(Array.isArray(r)?r.map((e=>[n,e])):[[n,r]])}),[]))}let d=null;const m=new Set(["application/x-www-form-urlencoded","multipart/form-data","text/plain"]);function p(e){return null==e||m.has(e)?e:null}function b(e,t){let n,o,a,i,u;if(l(f=e)&&"form"===f.tagName.toLowerCase()){let u=e.getAttribute("action");o=u?r.stripBasename(u,t):null,n=e.getAttribute("method")||s,a=p(e.getAttribute("enctype"))||c,i=new FormData(e)}else if(function(e){return l(e)&&"button"===e.tagName.toLowerCase()}(e)||function(e){return l(e)&&"input"===e.tagName.toLowerCase()}(e)&&("submit"===e.type||"image"===e.type)){let u=e.form;if(null==u)throw new Error('Cannot submit a <button> or <input type="submit"> without a <form>');let l=e.getAttribute("formaction")||u.getAttribute("action");if(o=l?r.stripBasename(l,t):null,n=e.getAttribute("formmethod")||u.getAttribute("method")||s,a=p(e.getAttribute("formenctype"))||p(u.getAttribute("enctype"))||c,i=new FormData(u,e),!function(){if(null===d)try{new FormData(document.createElement("form"),0),d=!1}catch(e){d=!0}return d}()){let{name:t,type:n,value:r}=e;if("image"===n){let e=t?t+".":"";i.append(e+"x","0"),i.append(e+"y","0")}else t&&i.append(t,r)}}else{if(l(e))throw new Error('Cannot submit element that is not <form>, <button>, or <input type="submit|image">');n=s,o=null,a=c,u=e}var f;return i&&"text/plain"===a&&(u=i,i=void 0),{action:o,method:n.toLowerCase(),encType:a,formData:i,body:u}}const v=["onClick","relative","reloadDocument","replace","state","target","to","preventScrollReset","unstable_viewTransition"],h=["aria-current","caseSensitive","className","end","style","to","unstable_viewTransition","children"],g=["reloadDocument","replace","state","method","action","onSubmit","submit","relative","preventScrollReset","unstable_viewTransition"];function y(){var e;let t=null==(e=window)?void 0:e.__staticRouterHydrationData;return t&&t.errors&&(t=i({},t,{errors:w(t.errors)})),t}function w(e){if(!e)return null;let t=Object.entries(e),n={};for(let[e,o]of t)if(o&&"RouteErrorResponse"===o.__type)n[e]=new r.UNSAFE_ErrorResponseImpl(o.status,o.statusText,o.data,!0===o.internal);else if(o&&"Error"===o.__type){if(o.__subType){let t=window[o.__subType];if("function"==typeof t)try{let r=new t(o.message);r.stack="",n[e]=r}catch(e){}}if(null==n[e]){let t=new Error(o.message);t.stack="",n[e]=t}}else n[e]=o;return n}const R=a.createContext({isTransitioning:!1}),S=a.startTransition;class E{constructor(){this.status="pending",this.promise=new Promise(((e,t)=>{this.resolve=t=>{"pending"===this.status&&(this.status="resolved",e(t))},this.reject=e=>{"pending"===this.status&&(this.status="rejected",t(e))}}))}}function P(e){let{routes:t,state:r}=e;return n.UNSAFE_useRoutesImpl(t,void 0,r)}const _="undefined"!=typeof window&&void 0!==window.document&&void 0!==window.document.createElement,O=/^(?:[a-z][a-z0-9+.-]*:|\/\/)/i,N=a.forwardRef((function(e,t){let o,{onClick:s,relative:c,reloadDocument:l,replace:f,state:d,target:m,to:p,preventScrollReset:b,unstable_viewTransition:h}=e,g=u(e,v),{basename:y}=a.useContext(n.UNSAFE_NavigationContext),w=!1;if("string"==typeof p&&O.test(p)&&(o=p,_))try{let e=new URL(window.location.href),t=p.startsWith("//")?new URL(e.protocol+p):new URL(p),n=r.stripBasename(t.pathname,y);t.origin===e.origin&&null!=n?p=n+t.search+t.hash:w=!0}catch(e){}let R=n.useHref(p,{relative:c}),S=L(p,{replace:f,state:d,target:m,preventScrollReset:b,relative:c,unstable_viewTransition:h});return a.createElement("a",i({},g,{href:o||R,onClick:w||l?s:function(e){s&&s(e),e.defaultPrevented||S(e)},ref:t,target:m}))})),A=a.forwardRef((function(e,t){let{"aria-current":r="page",caseSensitive:o=!1,className:s="",end:c=!1,style:l,to:f,unstable_viewTransition:d,children:m}=e,p=u(e,h),b=n.useResolvedPath(f,{relative:p.relative}),v=n.useLocation(),g=a.useContext(n.UNSAFE_DataRouterStateContext),{navigator:y}=a.useContext(n.UNSAFE_NavigationContext),w=null!=g&&z(b)&&!0===d,R=y.encodeLocation?y.encodeLocation(b).pathname:b.pathname,S=v.pathname,E=g&&g.navigation&&g.navigation.location?g.navigation.location.pathname:null;o||(S=S.toLowerCase(),E=E?E.toLowerCase():null,R=R.toLowerCase());let P,_=S===R||!c&&S.startsWith(R)&&"/"===S.charAt(R.length),O=null!=E&&(E===R||!c&&E.startsWith(R)&&"/"===E.charAt(R.length)),A={isActive:_,isPending:O,isTransitioning:w},j=_?r:void 0;P="function"==typeof s?s(A):[s,_?"active":null,O?"pending":null,w?"transitioning":null].filter(Boolean).join(" ");let C="function"==typeof l?l(A):l;return a.createElement(N,i({},p,{"aria-current":j,className:P,ref:t,style:C,to:f,unstable_viewTransition:d}),"function"==typeof m?m(A):m)})),j=a.forwardRef(((e,t)=>{let n=k();return a.createElement(C,i({},e,{submit:n,ref:t}))})),C=a.forwardRef(((e,t)=>{let{reloadDocument:n,replace:r,state:o,method:c=s,action:l,onSubmit:f,submit:d,relative:m,preventScrollReset:p,unstable_viewTransition:b}=e,v=u(e,g),h="get"===c.toLowerCase()?"get":"post",y=B(l,{relative:m});return a.createElement("form",i({ref:t,method:h,action:y,onSubmit:n?f:e=>{if(f&&f(e),e.defaultPrevented)return;e.preventDefault();let t=e.nativeEvent.submitter,n=(null==t?void 0:t.getAttribute("formmethod"))||c;d(t||e.currentTarget,{method:n,replace:r,state:o,relative:m,preventScrollReset:p,unstable_viewTransition:b})}},v))}));var x=function(e){return e.UseScrollRestoration="useScrollRestoration",e.UseSubmit="useSubmit",e.UseSubmitFetcher="useSubmitFetcher",e.UseFetcher="useFetcher",e.useViewTransitionState="useViewTransitionState",e}(x||{}),F=function(e){return e.UseFetchers="useFetchers",e.UseScrollRestoration="useScrollRestoration",e}(F||{});function T(e){let t=a.useContext(n.UNSAFE_DataRouterContext);return t||r.UNSAFE_invariant(!1),t}function U(e){let t=a.useContext(n.UNSAFE_DataRouterStateContext);return t||r.UNSAFE_invariant(!1),t}function L(e,t){let{target:r,replace:o,state:i,preventScrollReset:u,relative:s,unstable_viewTransition:c}=void 0===t?{}:t,l=n.useNavigate(),f=n.useLocation(),d=n.useResolvedPath(e,{relative:s});return a.useCallback((t=>{if(function(e,t){return!(0!==e.button||t&&"_self"!==t||function(e){return!!(e.metaKey||e.altKey||e.ctrlKey||e.shiftKey)}(e))}(t,r)){t.preventDefault();let r=void 0!==o?o:n.createPath(f)===n.createPath(d);l(e,{replace:r,state:i,preventScrollReset:u,relative:s,unstable_viewTransition:c})}}),[f,l,d,o,i,r,e,u,s,c])}function D(){if("undefined"==typeof document)throw new Error("You are calling submit during the server render. Try calling submit within a `useEffect` or callback instead.")}function k(){let{router:e}=T(x.UseSubmit),{basename:t}=a.useContext(n.UNSAFE_NavigationContext),r=n.UNSAFE_useRouteId();return a.useCallback((function(n,o){void 0===o&&(o={}),D();let{action:a,method:i,encType:u,formData:s,body:c}=b(n,t);e.navigate(o.action||a,{preventScrollReset:o.preventScrollReset,formData:s,body:c,formMethod:o.method||i,formEncType:o.encType||u,replace:o.replace,state:o.state,fromRouteId:r,unstable_viewTransition:o.unstable_viewTransition})}),[e,t,r])}function M(e,t){let{router:o}=T(x.UseSubmitFetcher),{basename:i}=a.useContext(n.UNSAFE_NavigationContext);return a.useCallback((function(n,a){void 0===a&&(a={}),D();let{action:u,method:s,encType:c,formData:l,body:f}=b(n,i);null==t&&r.UNSAFE_invariant(!1),o.fetch(e,t,a.action||u,{preventScrollReset:a.preventScrollReset,formData:l,body:f,formMethod:a.method||s,formEncType:a.encType||c})}),[o,i,e,t])}function B(e,t){let{relative:o}=void 0===t?{}:t,{basename:u}=a.useContext(n.UNSAFE_NavigationContext),s=a.useContext(n.UNSAFE_RouteContext);s||r.UNSAFE_invariant(!1);let[c]=s.matches.slice(-1),l=i({},n.useResolvedPath(e||".",{relative:o})),f=n.useLocation();if(null==e&&(l.search=f.search,c.route.index)){let e=new URLSearchParams(l.search);e.delete("index"),l.search=e.toString()?"?"+e.toString():""}return e&&"."!==e||!c.route.index||(l.search=l.search?l.search.replace(/^\?/,"?index&"):"?index"),"/"!==u&&(l.pathname="/"===l.pathname?u:r.joinPaths([u,l.pathname])),n.createPath(l)}let H=0;const I="react-router-scroll-positions";let K={};function V(e){let{getKey:t,storageKey:o}=void 0===e?{}:e,{router:u}=T(x.UseScrollRestoration),{restoreScrollPosition:s,preventScrollReset:c}=U(F.UseScrollRestoration),{basename:l}=a.useContext(n.UNSAFE_NavigationContext),f=n.useLocation(),d=n.useMatches(),m=n.useNavigation();a.useEffect((()=>(window.history.scrollRestoration="manual",()=>{window.history.scrollRestoration="auto"})),[]),function(e,t){let{capture:n}=t||{};a.useEffect((()=>{let t=null!=n?{capture:n}:void 0;return window.addEventListener("pagehide",e,t),()=>{window.removeEventListener("pagehide",e,t)}}),[e,n])}(a.useCallback((()=>{if("idle"===m.state){let e=(t?t(f,d):null)||f.key;K[e]=window.scrollY}try{sessionStorage.setItem(o||I,JSON.stringify(K))}catch(e){}window.history.scrollRestoration="auto"}),[o,t,m.state,f,d])),"undefined"!=typeof document&&(a.useLayoutEffect((()=>{try{let e=sessionStorage.getItem(o||I);e&&(K=JSON.parse(e))}catch(e){}}),[o]),a.useLayoutEffect((()=>{let e=t&&"/"!==l?(e,n)=>t(i({},e,{pathname:r.stripBasename(e.pathname,l)||e.pathname}),n):t,n=null==u?void 0:u.enableScrollRestoration(K,(()=>window.scrollY),e);return()=>n&&n()}),[u,l,t]),a.useLayoutEffect((()=>{if(!1!==s)if("number"!=typeof s){if(f.hash){let e=document.getElementById(decodeURIComponent(f.hash.slice(1)));if(e)return void e.scrollIntoView()}!0!==c&&window.scrollTo(0,0)}else window.scrollTo(0,s)}),[f,s,c]))}function z(e,t){void 0===t&&(t={});let o=a.useContext(R);null==o&&r.UNSAFE_invariant(!1);let{basename:i}=T(x.useViewTransitionState),u=n.useResolvedPath(e,{relative:t.relative});if(!o.isTransitioning)return!1;let s=r.stripBasename(o.currentLocation.pathname,i)||o.currentLocation.pathname,c=r.stripBasename(o.nextLocation.pathname,i)||o.nextLocation.pathname;return null!=r.matchPath(u.pathname,c)||null!=r.matchPath(u.pathname,s)}Object.defineProperty(e,"AbortedDeferredError",{enumerable:!0,get:function(){return n.AbortedDeferredError}}),Object.defineProperty(e,"Await",{enumerable:!0,get:function(){return n.Await}}),Object.defineProperty(e,"MemoryRouter",{enumerable:!0,get:function(){return n.MemoryRouter}}),Object.defineProperty(e,"Navigate",{enumerable:!0,get:function(){return n.Navigate}}),Object.defineProperty(e,"NavigationType",{enumerable:!0,get:function(){return n.NavigationType}}),Object.defineProperty(e,"Outlet",{enumerable:!0,get:function(){return n.Outlet}}),Object.defineProperty(e,"Route",{enumerable:!0,get:function(){return n.Route}}),Object.defineProperty(e,"Router",{enumerable:!0,get:function(){return n.Router}}),Object.defineProperty(e,"Routes",{enumerable:!0,get:function(){return n.Routes}}),Object.defineProperty(e,"UNSAFE_DataRouterContext",{enumerable:!0,get:function(){return n.UNSAFE_DataRouterContext}}),Object.defineProperty(e,"UNSAFE_DataRouterStateContext",{enumerable:!0,get:function(){return n.UNSAFE_DataRouterStateContext}}),Object.defineProperty(e,"UNSAFE_LocationContext",{enumerable:!0,get:function(){return n.UNSAFE_LocationContext}}),Object.defineProperty(e,"UNSAFE_NavigationContext",{enumerable:!0,get:function(){return n.UNSAFE_NavigationContext}}),Object.defineProperty(e,"UNSAFE_RouteContext",{enumerable:!0,get:function(){return n.UNSAFE_RouteContext}}),Object.defineProperty(e,"UNSAFE_useRouteId",{enumerable:!0,get:function(){return n.UNSAFE_useRouteId}}),Object.defineProperty(e,"createMemoryRouter",{enumerable:!0,get:function(){return n.createMemoryRouter}}),Object.defineProperty(e,"createPath",{enumerable:!0,get:function(){return n.createPath}}),Object.defineProperty(e,"createRoutesFromChildren",{enumerable:!0,get:function(){return n.createRoutesFromChildren}}),Object.defineProperty(e,"createRoutesFromElements",{enumerable:!0,get:function(){return n.createRoutesFromElements}}),Object.defineProperty(e,"defer",{enumerable:!0,get:function(){return n.defer}}),Object.defineProperty(e,"generatePath",{enumerable:!0,get:function(){return n.generatePath}}),Object.defineProperty(e,"isRouteErrorResponse",{enumerable:!0,get:function(){return n.isRouteErrorResponse}}),Object.defineProperty(e,"json",{enumerable:!0,get:function(){return n.json}}),Object.defineProperty(e,"matchPath",{enumerable:!0,get:function(){return n.matchPath}}),Object.defineProperty(e,"matchRoutes",{enumerable:!0,get:function(){return n.matchRoutes}}),Object.defineProperty(e,"parsePath",{enumerable:!0,get:function(){return n.parsePath}}),Object.defineProperty(e,"redirect",{enumerable:!0,get:function(){return n.redirect}}),Object.defineProperty(e,"redirectDocument",{enumerable:!0,get:function(){return n.redirectDocument}}),Object.defineProperty(e,"renderMatches",{enumerable:!0,get:function(){return n.renderMatches}}),Object.defineProperty(e,"resolvePath",{enumerable:!0,get:function(){return n.resolvePath}}),Object.defineProperty(e,"unstable_useBlocker",{enumerable:!0,get:function(){return n.unstable_useBlocker}}),Object.defineProperty(e,"useActionData",{enumerable:!0,get:function(){return n.useActionData}}),Object.defineProperty(e,"useAsyncError",{enumerable:!0,get:function(){return n.useAsyncError}}),Object.defineProperty(e,"useAsyncValue",{enumerable:!0,get:function(){return n.useAsyncValue}}),Object.defineProperty(e,"useHref",{enumerable:!0,get:function(){return n.useHref}}),Object.defineProperty(e,"useInRouterContext",{enumerable:!0,get:function(){return n.useInRouterContext}}),Object.defineProperty(e,"useLoaderData",{enumerable:!0,get:function(){return n.useLoaderData}}),Object.defineProperty(e,"useLocation",{enumerable:!0,get:function(){return n.useLocation}}),Object.defineProperty(e,"useMatch",{enumerable:!0,get:function(){return n.useMatch}}),Object.defineProperty(e,"useMatches",{enumerable:!0,get:function(){return n.useMatches}}),Object.defineProperty(e,"useNavigate",{enumerable:!0,get:function(){return n.useNavigate}}),Object.defineProperty(e,"useNavigation",{enumerable:!0,get:function(){return n.useNavigation}}),Object.defineProperty(e,"useNavigationType",{enumerable:!0,get:function(){return n.useNavigationType}}),Object.defineProperty(e,"useOutlet",{enumerable:!0,get:function(){return n.useOutlet}}),Object.defineProperty(e,"useOutletContext",{enumerable:!0,get:function(){return n.useOutletContext}}),Object.defineProperty(e,"useParams",{enumerable:!0,get:function(){return n.useParams}}),Object.defineProperty(e,"useResolvedPath",{enumerable:!0,get:function(){return n.useResolvedPath}}),Object.defineProperty(e,"useRevalidator",{enumerable:!0,get:function(){return n.useRevalidator}}),Object.defineProperty(e,"useRouteError",{enumerable:!0,get:function(){return n.useRouteError}}),Object.defineProperty(e,"useRouteLoaderData",{enumerable:!0,get:function(){return n.useRouteLoaderData}}),Object.defineProperty(e,"useRoutes",{enumerable:!0,get:function(){return n.useRoutes}}),e.BrowserRouter=function(e){let{basename:t,children:o,future:i,window:u}=e,s=a.useRef();null==s.current&&(s.current=r.createBrowserHistory({window:u,v5Compat:!0}));let c=s.current,[l,f]=a.useState({action:c.action,location:c.location}),{v7_startTransition:d}=i||{},m=a.useCallback((e=>{d&&S?S((()=>f(e))):f(e)}),[f,d]);return a.useLayoutEffect((()=>c.listen(m)),[c,m]),a.createElement(n.Router,{basename:t,children:o,location:l.location,navigationType:l.action,navigator:c})},e.Form=j,e.HashRouter=function(e){let{basename:t,children:o,future:i,window:u}=e,s=a.useRef();null==s.current&&(s.current=r.createHashHistory({window:u,v5Compat:!0}));let c=s.current,[l,f]=a.useState({action:c.action,location:c.location}),{v7_startTransition:d}=i||{},m=a.useCallback((e=>{d&&S?S((()=>f(e))):f(e)}),[f,d]);return a.useLayoutEffect((()=>c.listen(m)),[c,m]),a.createElement(n.Router,{basename:t,children:o,location:l.location,navigationType:l.action,navigator:c})},e.Link=N,e.NavLink=A,e.RouterProvider=function(e){let{fallbackElement:t,router:r,future:o}=e,[i,u]=a.useState(r.state),[s,c]=a.useState(),[l,f]=a.useState({isTransitioning:!1}),[d,m]=a.useState(),[p,b]=a.useState(),[v,h]=a.useState(),{v7_startTransition:g}=o||{},y=a.useCallback((e=>{g?function(e){S?S(e):e()}(e):e()}),[g]),w=a.useCallback(((e,t)=>{let{unstable_viewTransitionOpts:n}=t;n&&null!=r.window&&"function"==typeof r.window.document.startViewTransition?p&&d?(d.resolve(),p.skipTransition(),h({state:e,currentLocation:n.currentLocation,nextLocation:n.nextLocation})):(c(e),f({isTransitioning:!0,currentLocation:n.currentLocation,nextLocation:n.nextLocation})):y((()=>u(e)))}),[y,p,d,r.window]);a.useLayoutEffect((()=>r.subscribe(w)),[r,w]),a.useEffect((()=>{l.isTransitioning&&m(new E)}),[l.isTransitioning]),a.useEffect((()=>{if(d&&s&&r.window){let e=s,t=d.promise,n=r.window.document.startViewTransition((async()=>{y((()=>u(e))),await t}));n.finished.finally((()=>{m(void 0),b(void 0),c(void 0),f({isTransitioning:!1})})),b(n)}}),[y,s,d,r.window]),a.useEffect((()=>{d&&s&&i.location.key===s.location.key&&d.resolve()}),[d,p,i.location,s]),a.useEffect((()=>{!l.isTransitioning&&v&&(c(v.state),f({isTransitioning:!0,currentLocation:v.currentLocation,nextLocation:v.nextLocation}),h(void 0))}),[l.isTransitioning,v]);let _=a.useMemo((()=>({createHref:r.createHref,encodeLocation:r.encodeLocation,go:e=>r.navigate(e),push:(e,t,n)=>r.navigate(e,{state:t,preventScrollReset:null==n?void 0:n.preventScrollReset}),replace:(e,t,n)=>r.navigate(e,{replace:!0,state:t,preventScrollReset:null==n?void 0:n.preventScrollReset})})),[r]),O=r.basename||"/",N=a.useMemo((()=>({router:r,navigator:_,static:!1,basename:O})),[r,_,O]);return a.createElement(a.Fragment,null,a.createElement(n.UNSAFE_DataRouterContext.Provider,{value:N},a.createElement(n.UNSAFE_DataRouterStateContext.Provider,{value:i},a.createElement(R.Provider,{value:l},a.createElement(n.Router,{basename:O,location:i.location,navigationType:i.historyAction,navigator:_},i.initialized?a.createElement(P,{routes:r.routes,state:i}):t)))),null)},e.ScrollRestoration=function(e){let{getKey:t,storageKey:n}=e;return V({getKey:t,storageKey:n}),null},e.UNSAFE_ViewTransitionContext=R,e.UNSAFE_useScrollRestoration=V,e.createBrowserRouter=function(e,t){return r.createRouter({basename:null==t?void 0:t.basename,future:i({},null==t?void 0:t.future,{v7_prependBasename:!0}),history:r.createBrowserHistory({window:null==t?void 0:t.window}),hydrationData:(null==t?void 0:t.hydrationData)||y(),routes:e,mapRouteProperties:n.UNSAFE_mapRouteProperties,window:null==t?void 0:t.window}).initialize()},e.createHashRouter=function(e,t){return r.createRouter({basename:null==t?void 0:t.basename,future:i({},null==t?void 0:t.future,{v7_prependBasename:!0}),history:r.createHashHistory({window:null==t?void 0:t.window}),hydrationData:(null==t?void 0:t.hydrationData)||y(),routes:e,mapRouteProperties:n.UNSAFE_mapRouteProperties,window:null==t?void 0:t.window}).initialize()},e.createSearchParams=f,e.unstable_HistoryRouter=function(e){let{basename:t,children:r,future:o,history:i}=e,[u,s]=a.useState({action:i.action,location:i.location}),{v7_startTransition:c}=o||{},l=a.useCallback((e=>{c&&S?S((()=>s(e))):s(e)}),[s,c]);return a.useLayoutEffect((()=>i.listen(l)),[i,l]),a.createElement(n.Router,{basename:t,children:r,location:u.location,navigationType:u.action,navigator:i})},e.unstable_usePrompt=function(e){let{when:t,message:r}=e,o=n.unstable_useBlocker(t);a.useEffect((()=>{if("blocked"===o.state){window.confirm(r)?setTimeout(o.proceed,0):o.reset()}}),[o,r]),a.useEffect((()=>{"blocked"!==o.state||t||o.reset()}),[o,t])},e.unstable_useViewTransitionState=z,e.useBeforeUnload=function(e,t){let{capture:n}=t||{};a.useEffect((()=>{let t=null!=n?{capture:n}:void 0;return window.addEventListener("beforeunload",e,t),()=>{window.removeEventListener("beforeunload",e,t)}}),[e,n])},e.useFetcher=function(){var e;let{router:t}=T(x.UseFetcher),o=a.useContext(n.UNSAFE_RouteContext);o||r.UNSAFE_invariant(!1);let u=null==(e=o.matches[o.matches.length-1])?void 0:e.route.id;null==u&&r.UNSAFE_invariant(!1);let[s]=a.useState((()=>String(++H))),[c]=a.useState((()=>(u||r.UNSAFE_invariant(!1),function(e,t){return a.forwardRef(((n,r)=>{let o=M(e,t);return a.createElement(C,i({},n,{ref:r,submit:o}))}))}(s,u)))),[l]=a.useState((()=>e=>{t||r.UNSAFE_invariant(!1),u||r.UNSAFE_invariant(!1),t.fetch(s,u,e)})),f=M(s,u),d=t.getFetcher(s),m=a.useMemo((()=>i({Form:c,submit:f,load:l},d)),[d,c,f,l]);return a.useEffect((()=>()=>{t?t.deleteFetcher(s):console.warn("No router available to clean up from useFetcher()")}),[t,s]),m},e.useFetchers=function(){return[...U(F.UseFetchers).fetchers.values()]},e.useFormAction=B,e.useLinkClickHandler=L,e.useSearchParams=function(e){let t=a.useRef(f(e)),r=a.useRef(!1),o=n.useLocation(),i=a.useMemo((()=>function(e,t){let n=f(e);return t&&t.forEach(((e,r)=>{n.has(r)||t.getAll(r).forEach((e=>{n.append(r,e)}))})),n}(o.search,r.current?null:t.current)),[o.search]),u=n.useNavigate(),s=a.useCallback(((e,t)=>{const n=f("function"==typeof e?e(i):e);r.current=!0,u("?"+n,t)}),[u,i]);return[i,s]},e.useSubmit=k,Object.defineProperty(e,"__esModule",{value:!0})}));
//# sourceMappingURL=react-router-dom.production.min.js.map
+3
-3
package.json
{
"name": "react-router-dom",
"version": "6.15.0",
"version": "6.17.0",
"description": "Declarative routing for React web applications",

@@ -26,4 +26,4 @@ "keywords": [

"dependencies": {
"@remix-run/router": "1.8.0",
"react-router": "6.15.0"
"@remix-run/router": "1.10.0",
"react-router": "6.17.0"
},

@@ -30,0 +30,0 @@ "devDependencies": {

+1
-1
server.d.ts

@@ -10,3 +10,3 @@ import * as React from "react";

/**
* A <Router> that may not navigate to any other location. This is useful
* A `<Router>` that may not navigate to any other location. This is useful
* on the server where there is no stateful UI.

@@ -13,0 +13,0 @@ */

+15
-7
server.js

@@ -31,3 +31,3 @@ 'use strict';

/**
* A <Router> that may not navigate to any other location. This is useful
* A `<Router>` that may not navigate to any other location. This is useful
* on the server where there is no stateful UI.

@@ -100,2 +100,6 @@ */

value: state
}, /*#__PURE__*/React__namespace.createElement(reactRouterDom.UNSAFE_ViewTransitionContext.Provider, {
value: {
isTransitioning: false
}
}, /*#__PURE__*/React__namespace.createElement(reactRouterDom.Router, {

@@ -110,3 +114,3 @@ basename: dataRouterContext.basename,

state: state
})))), hydrateScript ? /*#__PURE__*/React__namespace.createElement("script", {
}))))), hydrateScript ? /*#__PURE__*/React__namespace.createElement("script", {
suppressHydrationWarning: true,

@@ -219,2 +223,5 @@ nonce: nonce,

},
get window() {
return undefined;
},
initialize() {

@@ -266,10 +273,11 @@ throw msg("initialize");

function encodeLocation(to) {
// Locations should already be encoded on the server, so just return as-is
let path = typeof to === "string" ? reactRouterDom.parsePath(to) : to;
let href = typeof to === "string" ? to : reactRouterDom.createPath(to);
let encoded = ABSOLUTE_URL_REGEX.test(href) ? new URL(href) : new URL(href, "http://localhost");
return {
pathname: path.pathname || "",
search: path.search || "",
hash: path.hash || ""
pathname: encoded.pathname,
search: encoded.search,
hash: encoded.hash
};
}
const ABSOLUTE_URL_REGEX = /^(?:[a-z][a-z0-9+.-]*:|\/\/)/i;
// This utility is based on https://github.com/zertosh/htmlescape

@@ -276,0 +284,0 @@ // License: https://github.com/zertosh/htmlescape/blob/0527ca7156a524d256101bb310a9f970f63078ad/LICENSE

+16
-8
server.mjs
import * as React from 'react';
import { Action, UNSAFE_invariant, isRouteErrorResponse, createStaticHandler as createStaticHandler$1, UNSAFE_convertRoutesToDataRoutes, IDLE_NAVIGATION, IDLE_FETCHER, IDLE_BLOCKER } from '@remix-run/router';
import { UNSAFE_useRoutesImpl, UNSAFE_mapRouteProperties } from 'react-router';
import { parsePath, Router, UNSAFE_DataRouterContext, UNSAFE_DataRouterStateContext, createPath } from 'react-router-dom';
import { parsePath, Router, UNSAFE_DataRouterContext, UNSAFE_DataRouterStateContext, UNSAFE_ViewTransitionContext, createPath } from 'react-router-dom';
/**
* A <Router> that may not navigate to any other location. This is useful
* A `<Router>` that may not navigate to any other location. This is useful
* on the server where there is no stateful UI.

@@ -75,2 +75,6 @@ */

value: state
}, /*#__PURE__*/React.createElement(UNSAFE_ViewTransitionContext.Provider, {
value: {
isTransitioning: false
}
}, /*#__PURE__*/React.createElement(Router, {

@@ -85,3 +89,3 @@ basename: dataRouterContext.basename,

state: state
})))), hydrateScript ? /*#__PURE__*/React.createElement("script", {
}))))), hydrateScript ? /*#__PURE__*/React.createElement("script", {
suppressHydrationWarning: true,

@@ -195,2 +199,5 @@ nonce: nonce,

},
get window() {
return undefined;
},
initialize() {

@@ -242,10 +249,11 @@ throw msg("initialize");

function encodeLocation(to) {
// Locations should already be encoded on the server, so just return as-is
let path = typeof to === "string" ? parsePath(to) : to;
let href = typeof to === "string" ? to : createPath(to);
let encoded = ABSOLUTE_URL_REGEX.test(href) ? new URL(href) : new URL(href, "http://localhost");
return {
pathname: path.pathname || "",
search: path.search || "",
hash: path.hash || ""
pathname: encoded.pathname,
search: encoded.search,
hash: encoded.hash
};
}
const ABSOLUTE_URL_REGEX = /^(?:[a-z][a-z0-9+.-]*:|\/\/)/i;

@@ -252,0 +260,0 @@ // This utility is based on https://github.com/zertosh/htmlescape

dist/index.js.map

Sorry, the diff of this file is too big to display

dist/react-router-dom.development.js.map

Sorry, the diff of this file is too big to display

dist/react-router-dom.production.min.js.map

Sorry, the diff of this file is too big to display

dist/umd/react-router-dom.development.js.map

Sorry, the diff of this file is too big to display

dist/umd/react-router-dom.production.min.js.map

Sorry, the diff of this file is too big to display