New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

react-router-dom

Package Overview
Dependencies
Maintainers
3
Versions
587
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 0.0.0-experimental-7b1bbb00 to 0.0.0-experimental-832a0ee6

66

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 @@

12

dist/dom.d.ts

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

/**
* Indicate a specific fetcherKey to use when using navigate=false
*/
fetcherKey?: string;
/**
* navigate=false will use a fetcher instead of a navigation
*/
navigate?: boolean;
/**
* Set `true` to replace the current entry in the browser's history stack

@@ -81,2 +89,6 @@ * instead of creating a new one (i.e. stay on "the same page"). Defaults

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

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

97

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, 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, } 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,28 @@ 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 };
type FetchersContextObject = {
data: Map<string, any>;
register: (key: string) => void;
unregister: (key: string) => void;
};
declare const FetchersContext: React.Context<FetchersContextObject | null>;
export { FetchersContext as UNSAFE_FetchersContext };
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 +105,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.
*/

@@ -136,2 +163,10 @@ export declare const NavLink: React.ForwardRefExoticComponent<NavLinkProps & React.RefAttributes<HTMLAnchorElement>>;

/**
* Indicate a specific fetcherKey to use when using navigate=false
*/
fetcherKey?: string;
/**
* navigate=false will use a fetcher instead of a navigation
*/
navigate?: boolean;
/**
* Forces a full document navigation instead of a fetch.

@@ -150,2 +185,6 @@ */

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

@@ -176,3 +215,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;

@@ -183,2 +222,3 @@ replace?: boolean;

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

@@ -225,5 +265,4 @@ /**

}): string;
declare function createFetcherForm(fetcherKey: string, routeId: string): React.ForwardRefExoticComponent<FetcherFormProps & React.RefAttributes<HTMLFormElement>>;
export type FetcherWithComponents<TData> = Fetcher<TData> & {
Form: ReturnType<typeof createFetcherForm>;
Form: React.ForwardRefExoticComponent<FetcherFormProps & React.RefAttributes<HTMLFormElement>>;
submit: FetcherSubmitFunction;

@@ -236,3 +275,5 @@ load: (href: string) => void;

*/
export declare function useFetcher<TData = any>(): FetcherWithComponents<TData>;
export declare function useFetcher<TData = any>({ key, }?: {
key?: string;
}): FetcherWithComponents<TData>;
/**

@@ -242,3 +283,3 @@ * Provides all fetchers currently on the page. Useful for layouts and parent

*/
export declare function useFetchers(): Fetcher[];
export declare function useFetchers(): Omit<Fetcher, "data">[];
/**

@@ -276,1 +317,13 @@ * When rendered inside a RouterProvider, will restore scroll positions on navigations

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 };

585

dist/index.js
/**
* React Router DOM v0.0.0-experimental-7b1bbb00
* React Router DOM v0.0.0-experimental-832a0ee6
*

@@ -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, UNSAFE_ErrorResponseImpl, 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, IDLE_FETCHER, matchPath } from '@remix-run/router';

@@ -210,5 +210,6 @@ 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 = ["fetcherKey", "navigate", "reloadDocument", "replace", "state", "method", "action", "onSubmit", "submit", "relative", "preventScrollReset", "unstable_viewTransition"],
_excluded4 = ["data"];
function createBrowserRouter(routes, opts) {

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

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

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

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

@@ -293,2 +296,12 @@ }

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

@@ -321,6 +334,223 @@ ////////////////////////////////////////////////////////////////////////////////

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 fetcherRefs = React.useRef(new Map());
let fetcherData = React.useRef(new Map());
let registerFetcher = React.useCallback(key => {
let count = fetcherRefs.current.get(key);
if (count == null) {
fetcherRefs.current.set(key, 1);
} else {
fetcherRefs.current.set(key, count + 1);
}
}, []);
let unregisterFetcher = React.useCallback(key => {
let count = fetcherRefs.current.get(key);
if (count == null || count <= 1) {
fetcherRefs.current.delete(key);
fetcherData.current.delete(key);
} else {
fetcherRefs.current.set(key, count - 1);
}
}, [fetcherData]);
let fetcherContext = React.useMemo(() => ({
data: fetcherData.current,
register: registerFetcher,
unregister: unregisterFetcher
}), [registerFetcher, unregisterFetcher]);
// console.log("fetcherRefs", fetcherRefs.current);
// console.log("fetcherData", fetcherData.current);
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;
newState.fetchers.forEach((fetcher, key) => {
if (fetcher.data !== undefined) {
fetcherData.current.set(key, fetcher.data);
}
});
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(FetchersContext.Provider, {
value: fetcherContext
}, /*#__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 {

@@ -331,3 +561,3 @@ basename,

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

@@ -364,3 +594,3 @@ if (historyRef.current == null) {

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

@@ -371,3 +601,3 @@ basename,

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

@@ -406,3 +636,3 @@ if (historyRef.current == null) {

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

@@ -413,3 +643,3 @@ basename,

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

@@ -440,5 +670,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 {

@@ -452,5 +682,6 @@ onClick,

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

@@ -492,3 +723,4 @@ basename

preventScrollReset,
relative
relative,
unstable_viewTransition
});

@@ -516,5 +748,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 {

@@ -527,5 +759,6 @@ "aria-current": ariaCurrentProp = "page",

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

@@ -539,2 +772,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;

@@ -550,9 +787,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 {

@@ -564,8 +803,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, {

@@ -576,7 +812,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);
});

@@ -602,4 +836,6 @@ if (process.env.NODE_ENV !== "production") {

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

@@ -613,5 +849,6 @@ replace,

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

@@ -628,7 +865,10 @@ let formAction = useFormAction(action, {

submit(submitter || event.currentTarget, {
fetcherKey,
method: submitMethod,
navigate,
replace,
state,
relative,
preventScrollReset
preventScrollReset,
unstable_viewTransition
});

@@ -650,7 +890,7 @@ };

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

@@ -673,7 +913,8 @@ getKey,

DataRouterHook["UseSubmit"] = "useSubmit";
DataRouterHook["UseSubmitFetcher"] = "useSubmitFetcher";
DataRouterHook["UseFetcher"] = "useFetcher";
DataRouterHook["useViewTransitionState"] = "useViewTransitionState";
})(DataRouterHook || (DataRouterHook = {}));
var DataRouterStateHook;
(function (DataRouterStateHook) {
DataRouterStateHook["UseFetcher"] = "useFetcher";
DataRouterStateHook["UseFetchers"] = "useFetchers";

@@ -706,3 +947,4 @@ DataRouterStateHook["UseScrollRestoration"] = "useScrollRestoration";

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

@@ -724,6 +966,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]);
}

@@ -757,2 +1000,4 @@ /**

}
let fetcherId = 0;
let getUniqueFetcherId = () => "__" + String(++fetcherId) + "__";
/**

@@ -782,46 +1027,26 @@ * Returns a function that may be used to programmatically submit a form (or

} = getFormSubmissionInfo(target, basename);
router.navigate(options.action || action, {
preventScrollReset: options.preventScrollReset,
formData,
body,
formMethod: options.method || method,
formEncType: options.encType || encType,
replace: options.replace,
state: options.state,
fromRouteId: currentRouteId
});
if (options.navigate === false) {
let key = options.fetcherKey || getUniqueFetcherId();
router.fetch(key, currentRouteId, options.action || action, {
preventScrollReset: options.preventScrollReset,
formData,
body,
formMethod: options.method || method,
formEncType: options.encType || encType
});
} else {
router.navigate(options.action || action, {
preventScrollReset: options.preventScrollReset,
formData,
body,
formMethod: options.method || method,
formEncType: options.encType || encType,
replace: options.replace,
state: options.state,
fromRouteId: currentRouteId,
unstable_viewTransition: options.unstable_viewTransition
});
}
}, [router, basename, currentRouteId]);
}
/**
* Returns the implementation for fetcher.submit
*/
function useSubmitFetcher(fetcherKey, fetcherRouteId) {
let {
router
} = useDataRouterContext(DataRouterHook.UseSubmitFetcher);
let {
basename
} = React.useContext(UNSAFE_NavigationContext);
return React.useCallback(function (target, options) {
if (options === void 0) {
options = {};
}
validateClientSideSubmission();
let {
action,
method,
encType,
formData,
body
} = getFormSubmissionInfo(target, basename);
!(fetcherRouteId != null) ? process.env.NODE_ENV !== "production" ? UNSAFE_invariant(false, "No routeId available for useFetcher()") : UNSAFE_invariant(false) : void 0;
router.fetch(fetcherKey, fetcherRouteId, options.action || action, {
preventScrollReset: options.preventScrollReset,
formData,
body,
formMethod: options.method || method,
formEncType: options.encType || encType
});
}, [router, basename, fetcherKey, fetcherRouteId]);
}
// v7: Eventually we should deprecate this entirely in favor of using the

@@ -838,14 +1063,12 @@ // router method directly?

!routeContext ? process.env.NODE_ENV !== "production" ? UNSAFE_invariant(false, "useFormAction must be used inside a RouteContext") : UNSAFE_invariant(false) : void 0;
let location = useLocation();
let [match] = routeContext.matches.slice(-1);
// Shallow clone path so we can modify it below, otherwise we modify the
// object referenced by useMemo inside useResolvedPath
let path = _extends({}, useResolvedPath(action ? action : ".", {
let path = _extends({}, useResolvedPath(action != null ? action : location.pathname, {
relative
}));
// Previously we set the default action to ".". The problem with this is that
// `useResolvedPath(".")` excludes search params of the resolved URL. This is
// the intended behavior of when "." is specifically provided as
// the form action, but inconsistent w/ browsers when the action is omitted.
// If no action was specified, browsers will persist current search params
// when determining the path, so match that behavior
// https://github.com/remix-run/remix/issues/927
let location = useLocation();
if (action == null) {

@@ -876,16 +1099,3 @@ // Safe to write to this directly here since if action was undefined, we

}
function createFetcherForm(fetcherKey, routeId) {
let FetcherForm = /*#__PURE__*/React.forwardRef((props, ref) => {
let submit = useSubmitFetcher(fetcherKey, routeId);
return /*#__PURE__*/React.createElement(FormImpl, _extends({}, props, {
ref: ref,
submit: submit
}));
});
if (process.env.NODE_ENV !== "production") {
FetcherForm.displayName = "fetcher.Form";
}
return FetcherForm;
}
let fetcherId = 0;
// TODO: (v7) Change the useFetcher generic default from `any` to `unknown`
/**

@@ -895,41 +1105,69 @@ * Interacts with route loaders and actions without causing a navigation. Great

*/
function useFetcher() {
function useFetcher(_temp3) {
var _route$matches;
let {
key
} = _temp3 === void 0 ? {} : _temp3;
let {
router
} = useDataRouterContext(DataRouterHook.UseFetcher);
let state = useDataRouterState(DataRouterStateHook.UseFetcher);
let fetchersCtx = React.useContext(FetchersContext);
let route = React.useContext(UNSAFE_RouteContext);
let routeId = (_route$matches = route.matches[route.matches.length - 1]) == null ? void 0 : _route$matches.route.id;
let [fetcherKey, setFetcherKey] = React.useState(key || "");
if (!fetcherKey) {
setFetcherKey(getUniqueFetcherId());
}
!fetchersCtx ? process.env.NODE_ENV !== "production" ? UNSAFE_invariant(false, "useFetcher must be used inside a FetchersContext") : UNSAFE_invariant(false) : void 0;
!route ? process.env.NODE_ENV !== "production" ? UNSAFE_invariant(false, "useFetcher must be used inside a RouteContext") : UNSAFE_invariant(false) : void 0;
let routeId = (_route$matches = route.matches[route.matches.length - 1]) == null ? void 0 : _route$matches.route.id;
!(routeId != null) ? process.env.NODE_ENV !== "production" ? UNSAFE_invariant(false, "useFetcher can only be used on routes that contain a unique \"id\"") : UNSAFE_invariant(false) : void 0;
let [fetcherKey] = React.useState(() => String(++fetcherId));
let [Form] = React.useState(() => {
!routeId ? process.env.NODE_ENV !== "production" ? UNSAFE_invariant(false, "No routeId available for fetcher.Form()") : UNSAFE_invariant(false) : void 0;
return createFetcherForm(fetcherKey, routeId);
});
let [load] = React.useState(() => href => {
!router ? process.env.NODE_ENV !== "production" ? UNSAFE_invariant(false, "No router available for fetcher.load()") : UNSAFE_invariant(false) : void 0;
!routeId ? process.env.NODE_ENV !== "production" ? UNSAFE_invariant(false, "No routeId available for fetcher.load()") : UNSAFE_invariant(false) : void 0;
let {
data,
register,
unregister
} = fetchersCtx;
// Register/deregister with FetchersContext
React.useEffect(() => {
register(fetcherKey);
return () => unregister(fetcherKey);
}, [fetcherKey, register, unregister]);
// Fetcher additions
let load = React.useCallback(href => {
!routeId ? process.env.NODE_ENV !== "production" ? UNSAFE_invariant(false, "fetcher.load routeId unavailable") : UNSAFE_invariant(false) : void 0;
router.fetch(fetcherKey, routeId, href);
});
let submit = useSubmitFetcher(fetcherKey, routeId);
let fetcher = router.getFetcher(fetcherKey);
let fetcherWithComponents = React.useMemo(() => _extends({
Form,
submit,
load
}, fetcher), [fetcher, Form, submit, load]);
React.useEffect(() => {
// Is this busted when the React team gets real weird and calls effects
// twice on mount? We really just need to garbage collect here when this
// fetcher is no longer around.
return () => {
if (!router) {
console.warn("No router available to clean up from useFetcher()");
return;
}
router.deleteFetcher(fetcherKey);
};
}, [router, fetcherKey]);
return fetcherWithComponents;
}, [fetcherKey, routeId, router]);
let submitImpl = useSubmit();
let submit = React.useCallback((target, opts) => {
submitImpl(target, _extends({}, opts, {
navigate: false,
fetcherKey
}));
}, [fetcherKey, submitImpl]);
let Form = React.useMemo(() => {
let FetcherForm = /*#__PURE__*/React.forwardRef((props, ref) => {
return /*#__PURE__*/React.createElement(FormImpl, _extends({}, props, {
navigate: false,
fetcherKey: fetcherKey,
ref: ref,
submit: submit
}));
});
if (process.env.NODE_ENV !== "production") {
FetcherForm.displayName = "fetcher.Form";
}
return FetcherForm;
}, [fetcherKey, submit]);
return React.useMemo(() => {
// Prefer the fetcher from `state` not `router.state` since DataRouterContext
// is memoized so this ensures we update on fetcher state updates
let fetcher = fetcherKey ? state.fetchers.get(fetcherKey) || IDLE_FETCHER : IDLE_FETCHER;
return _extends({
Form,
submit,
load
}, fetcher, {
data: data.get(fetcherKey)
});
}, [Form, data, fetcherKey, load, state.fetchers, submit]);
}

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

let state = useDataRouterState(DataRouterStateHook.UseFetchers);
return [...state.fetchers.values()];
return [...state.fetchers.values()].map(fetcher => {
let rest = _objectWithoutPropertiesLoose(fetcher, _excluded4);
return rest;
});
}

@@ -950,7 +1191,7 @@ const SCROLL_RESTORATION_STORAGE_KEY = "react-router-scroll-positions";

*/
function useScrollRestoration(_temp3) {
function useScrollRestoration(_temp4) {
let {
getKey,
storageKey
} = _temp3 === void 0 ? {} : _temp3;
} = _temp4 === void 0 ? {} : _temp4;
let {

@@ -982,3 +1223,7 @@ router

}
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";

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

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

@@ -1116,5 +1361,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, FetchersContext as UNSAFE_FetchersContext, 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

2

dist/main.js
/**
* React Router DOM v0.0.0-experimental-7b1bbb00
* React Router DOM v0.0.0-experimental-832a0ee6
*

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

553

dist/react-router-dom.development.js
/**
* React Router DOM v0.0.0-experimental-7b1bbb00
* React Router DOM v0.0.0-experimental-832a0ee6
*

@@ -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, UNSAFE_ErrorResponseImpl, 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, IDLE_FETCHER, 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();

@@ -283,2 +285,21 @@ }

////////////////////////////////////////////////////////////////////////////////
//#region Contexts
////////////////////////////////////////////////////////////////////////////////
const ViewTransitionContext = /*#__PURE__*/React.createContext({
isTransitioning: false
});
{
ViewTransitionContext.displayName = "ViewTransition";
}
// TODO: (v7) Change the useFetcher data from `any` to `unknown`
const FetchersContext = /*#__PURE__*/React.createContext(null);
{
FetchersContext.displayName = "Fetchers";
}
//#endregion
////////////////////////////////////////////////////////////////////////////////
//#region Components

@@ -310,3 +331,231 @@ ////////////////////////////////////////////////////////////////////////////////

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 fetcherRefs = React.useRef(new Map());
let fetcherData = React.useRef(new Map());
let registerFetcher = React.useCallback(key => {
let count = fetcherRefs.current.get(key);
if (count == null) {
fetcherRefs.current.set(key, 1);
} else {
fetcherRefs.current.set(key, count + 1);
}
}, []);
let unregisterFetcher = React.useCallback(key => {
let count = fetcherRefs.current.get(key);
if (count == null || count <= 1) {
fetcherRefs.current.delete(key);
fetcherData.current.delete(key);
} else {
fetcherRefs.current.set(key, count - 1);
}
}, [fetcherData]);
let fetcherContext = React.useMemo(() => ({
data: fetcherData.current,
register: registerFetcher,
unregister: unregisterFetcher
}), [registerFetcher, unregisterFetcher]);
// console.log("fetcherRefs", fetcherRefs.current);
// console.log("fetcherData", fetcherData.current);
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
}) => {
newState.fetchers.forEach((fetcher, key) => {
if (fetcher.data !== undefined) {
fetcherData.current.set(key, fetcher.data);
}
});
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(FetchersContext.Provider, {
value: fetcherContext
}, /*#__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.

@@ -422,3 +671,3 @@ */

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

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

preventScrollReset,
unstable_viewTransition,
...rest

@@ -476,3 +726,4 @@ }, ref) {

preventScrollReset,
relative
relative,
unstable_viewTransition
});

@@ -500,3 +751,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.
*/

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

to,
unstable_viewTransition,
children,

@@ -522,2 +774,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;

@@ -533,9 +789,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 {

@@ -547,8 +805,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, {

@@ -559,7 +814,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);
});

@@ -586,2 +839,4 @@ {

const FormImpl = /*#__PURE__*/React.forwardRef(({
fetcherKey,
navigate,
reloadDocument,

@@ -596,2 +851,3 @@ replace,

preventScrollReset,
unstable_viewTransition,
...props

@@ -610,7 +866,10 @@ }, forwardedRef) => {

submit(submitter || event.currentTarget, {
fetcherKey,
method: submitMethod,
navigate,
replace,
state,
relative,
preventScrollReset
preventScrollReset,
unstable_viewTransition
});

@@ -653,7 +912,8 @@ };

DataRouterHook["UseSubmit"] = "useSubmit";
DataRouterHook["UseSubmitFetcher"] = "useSubmitFetcher";
DataRouterHook["UseFetcher"] = "useFetcher";
DataRouterHook["useViewTransitionState"] = "useViewTransitionState";
return DataRouterHook;
}(DataRouterHook || {});
var DataRouterStateHook = /*#__PURE__*/function (DataRouterStateHook) {
DataRouterStateHook["UseFetcher"] = "useFetcher";
DataRouterStateHook["UseFetchers"] = "useFetchers";

@@ -687,3 +947,4 @@ DataRouterStateHook["UseScrollRestoration"] = "useScrollRestoration";

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

@@ -706,6 +967,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]);
}

@@ -749,2 +1011,4 @@

}
let fetcherId = 0;
let getUniqueFetcherId = () => `__${String(++fetcherId)}__`;

@@ -772,45 +1036,27 @@ /**

} = getFormSubmissionInfo(target, basename);
router.navigate(options.action || action, {
preventScrollReset: options.preventScrollReset,
formData,
body,
formMethod: options.method || method,
formEncType: options.encType || encType,
replace: options.replace,
state: options.state,
fromRouteId: currentRouteId
});
if (options.navigate === false) {
let key = options.fetcherKey || getUniqueFetcherId();
router.fetch(key, currentRouteId, options.action || action, {
preventScrollReset: options.preventScrollReset,
formData,
body,
formMethod: options.method || method,
formEncType: options.encType || encType
});
} else {
router.navigate(options.action || action, {
preventScrollReset: options.preventScrollReset,
formData,
body,
formMethod: options.method || method,
formEncType: options.encType || encType,
replace: options.replace,
state: options.state,
fromRouteId: currentRouteId,
unstable_viewTransition: options.unstable_viewTransition
});
}
}, [router, basename, currentRouteId]);
}
/**
* Returns the implementation for fetcher.submit
*/
function useSubmitFetcher(fetcherKey, fetcherRouteId) {
let {
router
} = useDataRouterContext(DataRouterHook.UseSubmitFetcher);
let {
basename
} = React.useContext(UNSAFE_NavigationContext);
return React.useCallback((target, options = {}) => {
validateClientSideSubmission();
let {
action,
method,
encType,
formData,
body
} = getFormSubmissionInfo(target, basename);
!(fetcherRouteId != null) ? UNSAFE_invariant(false, "No routeId available for useFetcher()") : void 0;
router.fetch(fetcherKey, fetcherRouteId, options.action || action, {
preventScrollReset: options.preventScrollReset,
formData,
body,
formMethod: options.method || method,
formEncType: options.encType || encType
});
}, [router, basename, fetcherKey, fetcherRouteId]);
}
// v7: Eventually we should deprecate this entirely in favor of using the

@@ -826,2 +1072,3 @@ // router method directly?

!routeContext ? UNSAFE_invariant(false, "useFormAction must be used inside a RouteContext") : void 0;
let location = useLocation();
let [match] = routeContext.matches.slice(-1);

@@ -831,3 +1078,3 @@ // Shallow clone path so we can modify it below, otherwise we modify the

let path = {
...useResolvedPath(action ? action : ".", {
...useResolvedPath(action != null ? action : location.pathname, {
relative

@@ -837,8 +1084,5 @@ })

// Previously we set the default action to ".". The problem with this is that
// `useResolvedPath(".")` excludes search params of the resolved URL. This is
// the intended behavior of when "." is specifically provided as
// the form action, but inconsistent w/ browsers when the action is omitted.
// If no action was specified, browsers will persist current search params
// when determining the path, so match that behavior
// https://github.com/remix-run/remix/issues/927
let location = useLocation();
if (action == null) {

@@ -871,16 +1115,3 @@ // Safe to write to this directly here since if action was undefined, we

}
function createFetcherForm(fetcherKey, routeId) {
let FetcherForm = /*#__PURE__*/React.forwardRef((props, ref) => {
let submit = useSubmitFetcher(fetcherKey, routeId);
return /*#__PURE__*/React.createElement(FormImpl, Object.assign({}, props, {
ref: ref,
submit: submit
}));
});
{
FetcherForm.displayName = "fetcher.Form";
}
return FetcherForm;
}
let fetcherId = 0;
// TODO: (v7) Change the useFetcher generic default from `any` to `unknown`
/**

@@ -890,41 +1121,70 @@ * Interacts with route loaders and actions without causing a navigation. Great

*/
function useFetcher() {
function useFetcher({
key
} = {}) {
let {
router
} = useDataRouterContext(DataRouterHook.UseFetcher);
let state = useDataRouterState(DataRouterStateHook.UseFetcher);
let fetchersCtx = React.useContext(FetchersContext);
let route = React.useContext(UNSAFE_RouteContext);
let routeId = route.matches[route.matches.length - 1]?.route.id;
let [fetcherKey, setFetcherKey] = React.useState(key || "");
if (!fetcherKey) {
setFetcherKey(getUniqueFetcherId());
}
!fetchersCtx ? UNSAFE_invariant(false, `useFetcher must be used inside a FetchersContext`) : void 0;
!route ? UNSAFE_invariant(false, `useFetcher must be used inside a RouteContext`) : void 0;
let routeId = route.matches[route.matches.length - 1]?.route.id;
!(routeId != null) ? UNSAFE_invariant(false, `useFetcher can only be used on routes that contain a unique "id"`) : void 0;
let [fetcherKey] = React.useState(() => String(++fetcherId));
let [Form] = React.useState(() => {
!routeId ? UNSAFE_invariant(false, `No routeId available for fetcher.Form()`) : void 0;
return createFetcherForm(fetcherKey, routeId);
});
let [load] = React.useState(() => href => {
!router ? UNSAFE_invariant(false, "No router available for fetcher.load()") : void 0;
!routeId ? UNSAFE_invariant(false, "No routeId available for fetcher.load()") : void 0;
let {
data,
register,
unregister
} = fetchersCtx;
// Register/deregister with FetchersContext
React.useEffect(() => {
register(fetcherKey);
return () => unregister(fetcherKey);
}, [fetcherKey, register, unregister]);
// Fetcher additions
let load = React.useCallback(href => {
!routeId ? UNSAFE_invariant(false, `fetcher.load routeId unavailable`) : void 0;
router.fetch(fetcherKey, routeId, href);
});
let submit = useSubmitFetcher(fetcherKey, routeId);
let fetcher = router.getFetcher(fetcherKey);
let fetcherWithComponents = React.useMemo(() => ({
Form,
submit,
load,
...fetcher
}), [fetcher, Form, submit, load]);
React.useEffect(() => {
// Is this busted when the React team gets real weird and calls effects
// twice on mount? We really just need to garbage collect here when this
// fetcher is no longer around.
return () => {
if (!router) {
console.warn(`No router available to clean up from useFetcher()`);
return;
}
router.deleteFetcher(fetcherKey);
}, [fetcherKey, routeId, router]);
let submitImpl = useSubmit();
let submit = React.useCallback((target, opts) => {
submitImpl(target, {
...opts,
navigate: false,
fetcherKey
});
}, [fetcherKey, submitImpl]);
let Form = React.useMemo(() => {
let FetcherForm = /*#__PURE__*/React.forwardRef((props, ref) => {
return /*#__PURE__*/React.createElement(FormImpl, Object.assign({}, props, {
navigate: false,
fetcherKey: fetcherKey,
ref: ref,
submit: submit
}));
});
{
FetcherForm.displayName = "fetcher.Form";
}
return FetcherForm;
}, [fetcherKey, submit]);
return React.useMemo(() => {
// Prefer the fetcher from `state` not `router.state` since DataRouterContext
// is memoized so this ensures we update on fetcher state updates
let fetcher = fetcherKey ? state.fetchers.get(fetcherKey) || IDLE_FETCHER : IDLE_FETCHER;
return {
Form,
submit,
load,
...fetcher,
data: data.get(fetcherKey)
};
}, [router, fetcherKey]);
return fetcherWithComponents;
}, [Form, data, fetcherKey, load, state.fetchers, submit]);
}

@@ -938,3 +1198,9 @@

let state = useDataRouterState(DataRouterStateHook.UseFetchers);
return [...state.fetchers.values()];
return [...state.fetchers.values()].map(fetcher => {
let {
data,
...rest
} = fetcher;
return rest;
});
}

@@ -979,3 +1245,7 @@ const SCROLL_RESTORATION_STORAGE_KEY = "react-router-scroll-positions";

}
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";

@@ -1124,5 +1394,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, FetchersContext as UNSAFE_FetchersContext, 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

4

dist/react-router-dom.production.min.js
/**
* React Router DOM v0.0.0-experimental-7b1bbb00
* React Router DOM v0.0.0-experimental-832a0ee6
*

@@ -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,UNSAFE_ErrorResponseImpl 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 a,UNSAFE_useRoutesImpl as o,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 y,createHashHistory as b,UNSAFE_ErrorResponseImpl as R,UNSAFE_invariant as E,joinPaths as S,IDLE_FETCHER as T,matchPath as C}from"@remix-run/router";const L="application/x-www-form-urlencoded";function x(e){return null!=e&&"string"==typeof e.tagName}function _(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 A=null;const k=new Set(["application/x-www-form-urlencoded","multipart/form-data","text/plain"]);function U(e){return null==e||k.has(e)?e:null}function F(e,t){let n,r,a,o,i;if(x(s=e)&&"form"===s.tagName.toLowerCase()){let i=e.getAttribute("action");r=i?v(i,t):null,n=e.getAttribute("method")||"get",a=U(e.getAttribute("enctype"))||L,o=new FormData(e)}else if(function(e){return x(e)&&"button"===e.tagName.toLowerCase()}(e)||function(e){return x(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",a=U(e.getAttribute("formenctype"))||U(i.getAttribute("enctype"))||L,o=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:n,value:r}=e;if("image"===n){let e=t?`${t}.`:"";o.append(`${e}x`,"0"),o.append(`${e}y`,"0")}else t&&o.append(t,r)}}else{if(x(e))throw new Error('Cannot submit element that is not <form>, <button>, or <input type="submit|image">');n="get",r=null,a=L,i=e}var s;return o&&"text/plain"===a&&(i=o,o=void 0),{action:r,method:n.toLowerCase(),encType:a,formData:o,body:i}}function D(e,n){return g({basename:n?.basename,future:{...n?.future,v7_prependBasename:!0},history:y({window:n?.window}),hydrationData:n?.hydrationData||P(),routes:e,mapRouteProperties:t,window:n?.window}).initialize()}function N(e,n){return g({basename:n?.basename,future:{...n?.future,v7_prependBasename:!0},history:b({window:n?.window}),hydrationData:n?.hydrationData||P(),routes:e,mapRouteProperties:t,window:n?.window}).initialize()}function P(){let e=window?.__staticRouterHydrationData;return e&&e.errors&&(e={...e,errors:K(e.errors)}),e}function K(e){if(!e)return null;let t=Object.entries(e),n={};for(let[a,o]of t)if(o&&"RouteErrorResponse"===o.__type)n[a]=new R(o.status,o.statusText,o.data,!0===o.internal);else if(o&&"Error"===o.__type){if(o.__subType){let e=window[o.__subType];if("function"==typeof e)try{let t=new e(o.message);t.stack="",n[a]=t}catch(r){}}if(null==n[a]){let e=new Error(o.message);e.stack="",n[a]=e}}else n[a]=o;return n}const M=e.createContext({isTransitioning:!1}),O=e.createContext(null),j=e.startTransition;class V{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 I({fallbackElement:t,router:o,future:i}){let[s,u]=e.useState(o.state),[l,c]=e.useState(),[f,m]=e.useState({isTransitioning:!1}),[d,p]=e.useState(),[h,w]=e.useState(),[v,g]=e.useState(),y=e.useRef(new Map),b=e.useRef(new Map),R=e.useCallback((e=>{let t=y.current.get(e);null==t?y.current.set(e,1):y.current.set(e,t+1)}),[]),E=e.useCallback((e=>{let t=y.current.get(e);null==t||t<=1?(y.current.delete(e),b.current.delete(e)):y.current.set(e,t-1)}),[b]),S=e.useMemo((()=>({data:b.current,register:R,unregister:E})),[R,E]),{v7_startTransition:T}=i||{},C=e.useCallback((e=>{T?function(e){j?j(e):e()}(e):e()}),[T]),L=e.useCallback(((e,{unstable_viewTransitionOpts:t})=>{e.fetchers.forEach(((e,t)=>{void 0!==e.data&&b.current.set(t,e.data)})),t&&null!=o.window&&"function"==typeof o.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})):C((()=>u(e)))}),[C,h,d,o.window]);e.useLayoutEffect((()=>o.subscribe(L)),[o,L]),e.useEffect((()=>{f.isTransitioning&&p(new V)}),[f.isTransitioning]),e.useEffect((()=>{if(d&&l&&o.window){let e=l,t=d.promise,n=o.window.document.startViewTransition((async()=>{C((()=>u(e))),await t}));n.finished.finally((()=>{p(void 0),w(void 0),c(void 0),m({isTransitioning:!1})})),w(n)}}),[C,l,d,o.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 x=e.useMemo((()=>({createHref:o.createHref,encodeLocation:o.encodeLocation,go:e=>o.navigate(e),push:(e,t,n)=>o.navigate(e,{state:t,preventScrollReset:n?.preventScrollReset}),replace:(e,t,n)=>o.navigate(e,{replace:!0,state:t,preventScrollReset:n?.preventScrollReset})})),[o]),_=o.basename||"/",A=e.useMemo((()=>({router:o,navigator:x,static:!1,basename:_})),[o,x,_]);return e.createElement(e.Fragment,null,e.createElement(n.Provider,{value:A},e.createElement(r.Provider,{value:s},e.createElement(O.Provider,{value:S},e.createElement(M.Provider,{value:f},e.createElement(a,{basename:_,location:s.location,navigationType:s.historyAction,navigator:x},s.initialized?e.createElement(z,{routes:o.routes,state:s}):t))))),null)}function z({routes:e,state:t}){return o(e,void 0,t)}function B({basename:t,children:n,future:r,window:o}){let i=e.useRef();null==i.current&&(i.current=y({window:o,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(a,{basename:t,children:n,location:u.location,navigationType:u.action,navigator:s})}function H({basename:t,children:n,future:r,window:o}){let i=e.useRef();null==i.current&&(i.current=b({window:o,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(a,{basename:t,children:n,location:u.location,navigationType:u.action,navigator:s})}function $({basename:t,children:n,future:r,history:o}){let[i,s]=e.useState({action:o.action,location:o.location}),{v7_startTransition:u}=r||{},l=e.useCallback((e=>{u&&j?j((()=>s(e))):s(e)}),[s,u]);return e.useLayoutEffect((()=>o.listen(l)),[o,l]),e.createElement(a,{basename:t,children:n,location:i.location,navigationType:i.action,navigator:o})}const W="undefined"!=typeof window&&void 0!==window.document&&void 0!==window.document.createElement,Y=/^(?:[a-z][a-z0-9+.-]*:|\/\/)/i,J=e.forwardRef((function({onClick:t,relative:n,reloadDocument:r,replace:a,state:o,target:u,to:l,preventScrollReset:c,unstable_viewTransition:f,...m},d){let p,{basename:h}=e.useContext(i),w=!1;if("string"==typeof l&&Y.test(l)&&(p=l,W))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(b){}let g=s(l,{relative:n}),y=re(l,{replace:a,state:o,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||y(e)},ref:d,target:u}))})),q=e.forwardRef((function({"aria-current":t="page",caseSensitive:n=!1,className:a="",end:o=!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),y=null!=v&&he(h)&&!0===f,b=g.encodeLocation?g.encodeLocation(h).pathname:h.pathname,R=w.pathname,E=v&&v.navigation&&v.navigation.location?v.navigation.location.pathname:null;n||(R=R.toLowerCase(),E=E?E.toLowerCase():null,b=b.toLowerCase());let S,T=R===b||!o&&R.startsWith(b)&&"/"===R.charAt(b.length),C=null!=E&&(E===b||!o&&E.startsWith(b)&&"/"===E.charAt(b.length)),L={isActive:T,isPending:C,isTransitioning:y},x=T?t:void 0;S="function"==typeof a?a(L):[a,T?"active":null,C?"pending":null,y?"transitioning":null].filter(Boolean).join(" ");let _="function"==typeof s?s(L):s;return e.createElement(J,Object.assign({},d,{"aria-current":x,className:S,ref:p,style:_,to:c,unstable_viewTransition:f}),"function"==typeof m?m(L):m)})),G=e.forwardRef(((t,n)=>{let r=se();return e.createElement(Q,Object.assign({},t,{submit:r,ref:n}))})),Q=e.forwardRef((({fetcherKey:t,navigate:n,reloadDocument:r,replace:a,state:o,method:i="get",action:s,onSubmit:u,submit:l,relative:c,preventScrollReset:f,unstable_viewTransition:m,...d},p)=>{let h="get"===i.toLowerCase()?"get":"post",w=ue(s,{relative:c});return e.createElement("form",Object.assign({ref:p,method:h,action:w,onSubmit:r?u:e=>{if(u&&u(e),e.defaultPrevented)return;e.preventDefault();let r=e.nativeEvent.submitter,s=r?.getAttribute("formmethod")||i;l(r||e.currentTarget,{fetcherKey:t,method:s,navigate:n,replace:a,state:o,relative:c,preventScrollReset:f,unstable_viewTransition:m})}},d))}));function X({getKey:e,storageKey:t}){return me({getKey:e,storageKey:t}),null}var Z=function(e){return e.UseScrollRestoration="useScrollRestoration",e.UseSubmit="useSubmit",e.UseFetcher="useFetcher",e.useViewTransitionState="useViewTransitionState",e}(Z||{}),ee=function(e){return e.UseFetcher="useFetcher",e.UseFetchers="useFetchers",e.UseScrollRestoration="useScrollRestoration",e}(ee||{});function te(t){let r=e.useContext(n);return r||E(!1),r}function ne(t){let n=e.useContext(r);return n||E(!1),n}function re(t,{target:n,replace:r,state:a,preventScrollReset:o,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:a,preventScrollReset:o,relative:i,unstable_viewTransition:s})}}),[d,m,p,r,a,n,t,o,i,s])}function ae(t){let n=e.useRef(_(t)),r=e.useRef(!1),a=l(),o=e.useMemo((()=>function(e,t){let n=_(e);return t&&t.forEach(((e,r)=>{n.has(r)||t.getAll(r).forEach((e=>{n.append(r,e)}))})),n}(a.search,r.current?null:n.current)),[a.search]),i=c(),s=e.useCallback(((e,t)=>{const n=_("function"==typeof e?e(o):e);r.current=!0,i("?"+n,t)}),[i,o]);return[o,s]}let oe=0,ie=()=>`__${String(++oe)}__`;function se(){let{router:t}=te(Z.UseSubmit),{basename:n}=e.useContext(i),r=m();return e.useCallback(((e,a={})=>{!function(){if("undefined"==typeof document)throw new Error("You are calling submit during the server render. Try calling submit within a `useEffect` or callback instead.")}();let{action:o,method:i,encType:s,formData:u,body:l}=F(e,n);if(!1===a.navigate){let e=a.fetcherKey||ie();t.fetch(e,r,a.action||o,{preventScrollReset:a.preventScrollReset,formData:u,body:l,formMethod:a.method||i,formEncType:a.encType||s})}else t.navigate(a.action||o,{preventScrollReset:a.preventScrollReset,formData:u,body:l,formMethod:a.method||i,formEncType:a.encType||s,replace:a.replace,state:a.state,fromRouteId:r,unstable_viewTransition:a.unstable_viewTransition})}),[t,n,r])}function ue(t,{relative:n}={}){let{basename:r}=e.useContext(i),a=e.useContext(d);a||E(!1);let o=l(),[s]=a.matches.slice(-1),c={...u(null!=t?t:o.pathname,{relative:n})};if(null==t&&(c.search=o.search,s.route.index)){let e=new URLSearchParams(c.search);e.delete("index"),c.search=e.toString()?`?${e.toString()}`:""}return t&&"."!==t||!s.route.index||(c.search=c.search?c.search.replace(/^\?/,"?index&"):"?index"),"/"!==r&&(c.pathname="/"===c.pathname?r:S([r,c.pathname])),f(c)}function le({key:t}={}){let{router:n}=te(Z.UseFetcher),r=ne(ee.UseFetcher),a=e.useContext(O),o=e.useContext(d),i=o.matches[o.matches.length-1]?.route.id,[s,u]=e.useState(t||"");s||u(ie()),a||E(!1),o||E(!1),null==i&&E(!1);let{data:l,register:c,unregister:f}=a;e.useEffect((()=>(c(s),()=>f(s))),[s,c,f]);let m=e.useCallback((e=>{i||E(!1),n.fetch(s,i,e)}),[s,i,n]),p=se(),h=e.useCallback(((e,t)=>{p(e,{...t,navigate:!1,fetcherKey:s})}),[s,p]),w=e.useMemo((()=>e.forwardRef(((t,n)=>e.createElement(Q,Object.assign({},t,{navigate:!1,fetcherKey:s,ref:n,submit:h}))))),[s,h]);return e.useMemo((()=>{let e=s&&r.fetchers.get(s)||T;return{Form:w,submit:h,load:m,...e,data:l.get(s)}}),[w,l,s,m,r.fetchers,h])}function ce(){return[...ne(ee.UseFetchers).fetchers.values()].map((e=>{let{data:t,...n}=e;return n}))}let fe={};function me({getKey:t,storageKey:n}={}){let{router:r}=te(Z.UseScrollRestoration),{restoreScrollPosition:a,preventScrollReset:o}=ne(ee.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;fe[e]=window.scrollY}try{sessionStorage.setItem(n||"react-router-scroll-positions",JSON.stringify(fe))}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&&(fe=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(fe,(()=>window.scrollY),e);return()=>n&&n()}),[r,s,t]),e.useLayoutEffect((()=>{if(!1!==a)if("number"!=typeof a){if(u.hash){let e=document.getElementById(decodeURIComponent(u.hash.slice(1)));if(e)return void e.scrollIntoView()}!0!==o&&window.scrollTo(0,0)}else window.scrollTo(0,a)}),[u,a,o]))}function de(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 pe({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 he(t,n={}){let r=e.useContext(M);null==r&&E(!1);let{basename:a}=te(Z.useViewTransitionState),o=u(t,{relative:n.relative});if(!r.isTransitioning)return!1;let i=v(r.currentLocation.pathname,a)||r.currentLocation.pathname,s=v(r.nextLocation.pathname,a)||r.nextLocation.pathname;return null!=C(o.pathname,s)||null!=C(o.pathname,i)}export{B as BrowserRouter,G as Form,H as HashRouter,J as Link,q as NavLink,I as RouterProvider,X as ScrollRestoration,O as UNSAFE_FetchersContext,M as UNSAFE_ViewTransitionContext,me as UNSAFE_useScrollRestoration,D as createBrowserRouter,N as createHashRouter,_ as createSearchParams,$ as unstable_HistoryRouter,pe as unstable_usePrompt,he as unstable_useViewTransitionState,de as useBeforeUnload,le as useFetcher,ce as useFetchers,ue as useFormAction,re as useLinkClickHandler,ae as useSearchParams,se as useSubmit};
//# sourceMappingURL=react-router-dom.production.min.js.map

2

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 @@ */

14

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() {

@@ -240,5 +247,2 @@ throw msg("initialize");

encodeLocation,
getFetcher() {
return router.IDLE_FETCHER;
},
deleteFetcher() {

@@ -245,0 +249,0 @@ throw msg("deleteFetcher");

4

dist/umd/react-router-dom.production.min.js
/**
* React Router DOM v0.0.0-experimental-7b1bbb00
* React Router DOM v0.0.0-experimental-832a0ee6
*

@@ -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.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 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"],g=["aria-current","caseSensitive","className","end","style","to","unstable_viewTransition","children"],h=["fetcherKey","navigate","reloadDocument","replace","state","method","action","onSubmit","submit","relative","preventScrollReset","unstable_viewTransition"],y=["data"];function w(){var e;let t=null==(e=window)?void 0:e.__staticRouterHydrationData;return t&&t.errors&&(t=i({},t,{errors:R(t.errors)})),t}function R(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 E=a.createContext({isTransitioning:!1}),S=a.createContext(null),P=a.startTransition;class _{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 O(e){let{routes:t,state:r}=e;return n.UNSAFE_useRoutesImpl(t,void 0,r)}const C="undefined"!=typeof window&&void 0!==window.document&&void 0!==window.document.createElement,j=/^(?:[a-z][a-z0-9+.-]*:|\/\/)/i,A=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:g}=e,h=u(e,v),{basename:y}=a.useContext(n.UNSAFE_NavigationContext),w=!1;if("string"==typeof p&&j.test(p)&&(o=p,C))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}),E=k(p,{replace:f,state:d,target:m,preventScrollReset:b,relative:c,unstable_viewTransition:g});return a.createElement("a",i({},h,{href:o||R,onClick:w||l?s:function(e){s&&s(e),e.defaultPrevented||E(e)},ref:t,target:m}))})),N=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,g),b=n.useResolvedPath(f,{relative:p.relative}),v=n.useLocation(),h=a.useContext(n.UNSAFE_DataRouterStateContext),{navigator:y}=a.useContext(n.UNSAFE_NavigationContext),w=null!=h&&q(b)&&!0===d,R=y.encodeLocation?y.encodeLocation(b).pathname:b.pathname,E=v.pathname,S=h&&h.navigation&&h.navigation.location?h.navigation.location.pathname:null;o||(E=E.toLowerCase(),S=S?S.toLowerCase():null,R=R.toLowerCase());let P,_=E===R||!c&&E.startsWith(R)&&"/"===E.charAt(R.length),O=null!=S&&(S===R||!c&&S.startsWith(R)&&"/"===S.charAt(R.length)),C={isActive:_,isPending:O,isTransitioning:w},j=_?r:void 0;P="function"==typeof s?s(C):[s,_?"active":null,O?"pending":null,w?"transitioning":null].filter(Boolean).join(" ");let N="function"==typeof l?l(C):l;return a.createElement(A,i({},p,{"aria-current":j,className:P,ref:t,style:N,to:f,unstable_viewTransition:d}),"function"==typeof m?m(C):m)})),x=a.forwardRef(((e,t)=>{let n=H();return a.createElement(F,i({},e,{submit:n,ref:t}))})),F=a.forwardRef(((e,t)=>{let{fetcherKey:n,navigate:r,reloadDocument:o,replace:c,state:l,method:f=s,action:d,onSubmit:m,submit:p,relative:b,preventScrollReset:v,unstable_viewTransition:g}=e,y=u(e,h),w="get"===f.toLowerCase()?"get":"post",R=K(d,{relative:b});return a.createElement("form",i({ref:t,method:w,action:R,onSubmit:o?m:e=>{if(m&&m(e),e.defaultPrevented)return;e.preventDefault();let t=e.nativeEvent.submitter,o=(null==t?void 0:t.getAttribute("formmethod"))||f;p(t||e.currentTarget,{fetcherKey:n,method:o,navigate:r,replace:c,state:l,relative:b,preventScrollReset:v,unstable_viewTransition:g})}},y))}));var T=function(e){return e.UseScrollRestoration="useScrollRestoration",e.UseSubmit="useSubmit",e.UseFetcher="useFetcher",e.useViewTransitionState="useViewTransitionState",e}(T||{}),L=function(e){return e.UseFetcher="useFetcher",e.UseFetchers="useFetchers",e.UseScrollRestoration="useScrollRestoration",e}(L||{});function U(e){let t=a.useContext(n.UNSAFE_DataRouterContext);return t||r.UNSAFE_invariant(!1),t}function D(e){let t=a.useContext(n.UNSAFE_DataRouterStateContext);return t||r.UNSAFE_invariant(!1),t}function k(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])}let M=0,B=()=>"__"+String(++M)+"__";function H(){let{router:e}=U(T.UseSubmit),{basename:t}=a.useContext(n.UNSAFE_NavigationContext),r=n.UNSAFE_useRouteId();return a.useCallback((function(n,o){void 0===o&&(o={}),function(){if("undefined"==typeof document)throw new Error("You are calling submit during the server render. Try calling submit within a `useEffect` or callback instead.")}();let{action:a,method:i,encType:u,formData:s,body:c}=b(n,t);if(!1===o.navigate){let t=o.fetcherKey||B();e.fetch(t,r,o.action||a,{preventScrollReset:o.preventScrollReset,formData:s,body:c,formMethod:o.method||i,formEncType:o.encType||u})}else 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 K(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=n.useLocation(),[l]=s.matches.slice(-1),f=i({},n.useResolvedPath(null!=e?e:c.pathname,{relative:o}));if(null==e&&(f.search=c.search,l.route.index)){let e=new URLSearchParams(f.search);e.delete("index"),f.search=e.toString()?"?"+e.toString():""}return e&&"."!==e||!l.route.index||(f.search=f.search?f.search.replace(/^\?/,"?index&"):"?index"),"/"!==u&&(f.pathname="/"===f.pathname?u:r.joinPaths([u,f.pathname])),n.createPath(f)}const I="react-router-scroll-positions";let V={};function z(e){let{getKey:t,storageKey:o}=void 0===e?{}:e,{router:u}=U(T.UseScrollRestoration),{restoreScrollPosition:s,preventScrollReset:c}=D(L.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;V[e]=window.scrollY}try{sessionStorage.setItem(o||I,JSON.stringify(V))}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&&(V=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(V,(()=>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 q(e,t){void 0===t&&(t={});let o=a.useContext(E);null==o&&r.UNSAFE_invariant(!1);let{basename:i}=U(T.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&&P?P((()=>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=x,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&&P?P((()=>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=A,e.NavLink=N,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,g]=a.useState(),h=a.useRef(new Map),y=a.useRef(new Map),w=a.useCallback((e=>{let t=h.current.get(e);null==t?h.current.set(e,1):h.current.set(e,t+1)}),[]),R=a.useCallback((e=>{let t=h.current.get(e);null==t||t<=1?(h.current.delete(e),y.current.delete(e)):h.current.set(e,t-1)}),[y]),C=a.useMemo((()=>({data:y.current,register:w,unregister:R})),[w,R]),{v7_startTransition:j}=o||{},A=a.useCallback((e=>{j?function(e){P?P(e):e()}(e):e()}),[j]),N=a.useCallback(((e,t)=>{let{unstable_viewTransitionOpts:n}=t;e.fetchers.forEach(((e,t)=>{void 0!==e.data&&y.current.set(t,e.data)})),n&&null!=r.window&&"function"==typeof r.window.document.startViewTransition?p&&d?(d.resolve(),p.skipTransition(),g({state:e,currentLocation:n.currentLocation,nextLocation:n.nextLocation})):(c(e),f({isTransitioning:!0,currentLocation:n.currentLocation,nextLocation:n.nextLocation})):A((()=>u(e)))}),[A,p,d,r.window]);a.useLayoutEffect((()=>r.subscribe(N)),[r,N]),a.useEffect((()=>{l.isTransitioning&&m(new _)}),[l.isTransitioning]),a.useEffect((()=>{if(d&&s&&r.window){let e=s,t=d.promise,n=r.window.document.startViewTransition((async()=>{A((()=>u(e))),await t}));n.finished.finally((()=>{m(void 0),b(void 0),c(void 0),f({isTransitioning:!1})})),b(n)}}),[A,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}),g(void 0))}),[l.isTransitioning,v]);let x=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]),F=r.basename||"/",T=a.useMemo((()=>({router:r,navigator:x,static:!1,basename:F})),[r,x,F]);return a.createElement(a.Fragment,null,a.createElement(n.UNSAFE_DataRouterContext.Provider,{value:T},a.createElement(n.UNSAFE_DataRouterStateContext.Provider,{value:i},a.createElement(S.Provider,{value:C},a.createElement(E.Provider,{value:l},a.createElement(n.Router,{basename:F,location:i.location,navigationType:i.historyAction,navigator:x},i.initialized?a.createElement(O,{routes:r.routes,state:i}):t))))),null)},e.ScrollRestoration=function(e){let{getKey:t,storageKey:n}=e;return z({getKey:t,storageKey:n}),null},e.UNSAFE_FetchersContext=S,e.UNSAFE_ViewTransitionContext=E,e.UNSAFE_useScrollRestoration=z,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)||w(),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)||w(),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&&P?P((()=>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=q,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(e){var t;let{key:o}=void 0===e?{}:e,{router:u}=U(T.UseFetcher),s=D(L.UseFetcher),c=a.useContext(S),l=a.useContext(n.UNSAFE_RouteContext),f=null==(t=l.matches[l.matches.length-1])?void 0:t.route.id,[d,m]=a.useState(o||"");d||m(B()),c||r.UNSAFE_invariant(!1),l||r.UNSAFE_invariant(!1),null==f&&r.UNSAFE_invariant(!1);let{data:p,register:b,unregister:v}=c;a.useEffect((()=>(b(d),()=>v(d))),[d,b,v]);let g=a.useCallback((e=>{f||r.UNSAFE_invariant(!1),u.fetch(d,f,e)}),[d,f,u]),h=H(),y=a.useCallback(((e,t)=>{h(e,i({},t,{navigate:!1,fetcherKey:d}))}),[d,h]),w=a.useMemo((()=>a.forwardRef(((e,t)=>a.createElement(F,i({},e,{navigate:!1,fetcherKey:d,ref:t,submit:y}))))),[d,y]);return a.useMemo((()=>{let e=d&&s.fetchers.get(d)||r.IDLE_FETCHER;return i({Form:w,submit:y,load:g},e,{data:p.get(d)})}),[w,p,d,g,s.fetchers,y])},e.useFetchers=function(){return[...D(L.UseFetchers).fetchers.values()].map((e=>u(e,y)))},e.useFormAction=K,e.useLinkClickHandler=k,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=H,Object.defineProperty(e,"__esModule",{value:!0})}));
//# sourceMappingURL=react-router-dom.production.min.js.map

6

package.json
{
"name": "react-router-dom",
"version": "0.0.0-experimental-7b1bbb00",
"version": "0.0.0-experimental-832a0ee6",
"description": "Declarative routing for React web applications",

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

"dependencies": {
"@remix-run/router": "0.0.0-experimental-7b1bbb00",
"react-router": "0.0.0-experimental-7b1bbb00"
"@remix-run/router": "0.0.0-experimental-832a0ee6",
"react-router": "0.0.0-experimental-832a0ee6"
},

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

2

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 @@ */

14

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() {

@@ -240,5 +247,2 @@ throw msg("initialize");

encodeLocation,
getFetcher() {
return router.IDLE_FETCHER;
},
deleteFetcher() {

@@ -245,0 +249,0 @@ throw msg("deleteFetcher");

dist/index.js.map

Sorry, the diff of this file is not supported yet

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

Sorry, the diff of this file is not supported yet

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

Sorry, the diff of this file is not supported yet

dist/server.mjs

Sorry, the diff of this file is not supported yet

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

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 not supported yet

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

Sorry, the diff of this file is not supported yet

server.mjs

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc