react-router-dom 6.4.0-pre.3 → 6.4.0-pre.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +6 -0
- package/LICENSE.md +22 -0
- package/dist/dom.d.ts +68 -0
- package/dist/index.d.ts +202 -0
- package/dist/index.js +811 -0
- package/dist/index.js.map +1 -0
- package/dist/main.js +19 -0
- package/dist/react-router-dom.development.js +759 -0
- package/dist/react-router-dom.development.js.map +1 -0
- package/dist/react-router-dom.production.min.js +12 -0
- package/dist/react-router-dom.production.min.js.map +1 -0
- package/dist/server.d.ts +23 -0
- package/dist/server.js +125 -0
- package/dist/server.mjs +101 -0
- package/dist/umd/react-router-dom.development.js +1027 -0
- package/dist/umd/react-router-dom.development.js.map +1 -0
- package/dist/umd/react-router-dom.production.min.js +12 -0
- package/dist/umd/react-router-dom.production.min.js.map +1 -0
- package/package.json +25 -16
- package/server.d.ts +23 -0
- package/server.js +125 -0
- package/server.mjs +101 -0
- package/.eslintrc +0 -12
- package/__tests__/DataBrowserRouter-test.tsx +0 -2199
- package/__tests__/custom-environment.js +0 -19
- package/__tests__/data-static-router-test.tsx +0 -194
- package/__tests__/exports-test.tsx +0 -10
- package/__tests__/link-click-test.tsx +0 -255
- package/__tests__/link-href-test.tsx +0 -547
- package/__tests__/link-push-test.tsx +0 -225
- package/__tests__/nav-link-active-test.tsx +0 -626
- package/__tests__/navigate-encode-params-test.tsx +0 -96
- package/__tests__/search-params-test.tsx +0 -69
- package/__tests__/setup.ts +0 -15
- package/__tests__/static-link-test.tsx +0 -36
- package/__tests__/static-location-test.tsx +0 -60
- package/__tests__/static-navigate-test.tsx +0 -32
- package/__tests__/useLinkClickHandler-test.tsx +0 -202
- package/dom.ts +0 -240
- package/index.tsx +0 -1009
- package/jest-transformer.js +0 -10
- package/jest.config.js +0 -10
- package/node-main.js +0 -7
- package/server.tsx +0 -148
- package/tsconfig.json +0 -20
package/CHANGELOG.md
CHANGED
package/LICENSE.md
ADDED
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) React Training 2015-2019
|
|
4
|
+
Copyright (c) Remix Software 2020-2022
|
|
5
|
+
|
|
6
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
7
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
8
|
+
in the Software without restriction, including without limitation the rights
|
|
9
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
10
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
11
|
+
furnished to do so, subject to the following conditions:
|
|
12
|
+
|
|
13
|
+
The above copyright notice and this permission notice shall be included in all
|
|
14
|
+
copies or substantial portions of the Software.
|
|
15
|
+
|
|
16
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
17
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
18
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
19
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
20
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
21
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
22
|
+
SOFTWARE.
|
package/dist/dom.d.ts
ADDED
|
@@ -0,0 +1,68 @@
|
|
|
1
|
+
import type { FormEncType, FormMethod } from "@remix-run/router";
|
|
2
|
+
export declare const defaultMethod = "get";
|
|
3
|
+
export declare function isHtmlElement(object: any): object is HTMLElement;
|
|
4
|
+
export declare function isButtonElement(object: any): object is HTMLButtonElement;
|
|
5
|
+
export declare function isFormElement(object: any): object is HTMLFormElement;
|
|
6
|
+
export declare function isInputElement(object: any): object is HTMLInputElement;
|
|
7
|
+
declare type LimitedMouseEvent = Pick<MouseEvent, "button" | "metaKey" | "altKey" | "ctrlKey" | "shiftKey">;
|
|
8
|
+
export declare function shouldProcessLinkClick(event: LimitedMouseEvent, target?: string): boolean;
|
|
9
|
+
export declare type ParamKeyValuePair = [string, string];
|
|
10
|
+
export declare type URLSearchParamsInit = string | ParamKeyValuePair[] | Record<string, string | string[]> | URLSearchParams;
|
|
11
|
+
/**
|
|
12
|
+
* Creates a URLSearchParams object using the given initializer.
|
|
13
|
+
*
|
|
14
|
+
* This is identical to `new URLSearchParams(init)` except it also
|
|
15
|
+
* supports arrays as values in the object form of the initializer
|
|
16
|
+
* instead of just strings. This is convenient when you need multiple
|
|
17
|
+
* values for a given key, but don't want to use an array initializer.
|
|
18
|
+
*
|
|
19
|
+
* For example, instead of:
|
|
20
|
+
*
|
|
21
|
+
* let searchParams = new URLSearchParams([
|
|
22
|
+
* ['sort', 'name'],
|
|
23
|
+
* ['sort', 'price']
|
|
24
|
+
* ]);
|
|
25
|
+
*
|
|
26
|
+
* you can do:
|
|
27
|
+
*
|
|
28
|
+
* let searchParams = createSearchParams({
|
|
29
|
+
* sort: ['name', 'price']
|
|
30
|
+
* });
|
|
31
|
+
*/
|
|
32
|
+
export declare function createSearchParams(init?: URLSearchParamsInit): URLSearchParams;
|
|
33
|
+
export declare function getSearchParamsForLocation(locationSearch: string, defaultSearchParams: URLSearchParams): URLSearchParams;
|
|
34
|
+
export interface SubmitOptions {
|
|
35
|
+
/**
|
|
36
|
+
* The HTTP method used to submit the form. Overrides `<form method>`.
|
|
37
|
+
* Defaults to "GET".
|
|
38
|
+
*/
|
|
39
|
+
method?: FormMethod;
|
|
40
|
+
/**
|
|
41
|
+
* The action URL path used to submit the form. Overrides `<form action>`.
|
|
42
|
+
* Defaults to the path of the current route.
|
|
43
|
+
*
|
|
44
|
+
* Note: It is assumed the path is already resolved. If you need to resolve a
|
|
45
|
+
* relative path, use `useFormAction`.
|
|
46
|
+
*/
|
|
47
|
+
action?: string;
|
|
48
|
+
/**
|
|
49
|
+
* The action URL used to submit the form. Overrides `<form encType>`.
|
|
50
|
+
* Defaults to "application/x-www-form-urlencoded".
|
|
51
|
+
*/
|
|
52
|
+
encType?: FormEncType;
|
|
53
|
+
/**
|
|
54
|
+
* Set `true` to replace the current entry in the browser's history stack
|
|
55
|
+
* instead of creating a new one (i.e. stay on "the same page"). Defaults
|
|
56
|
+
* to `false`.
|
|
57
|
+
*/
|
|
58
|
+
replace?: boolean;
|
|
59
|
+
}
|
|
60
|
+
export declare function getFormSubmissionInfo(target: HTMLFormElement | HTMLButtonElement | HTMLInputElement | FormData | URLSearchParams | {
|
|
61
|
+
[name: string]: string;
|
|
62
|
+
} | null, defaultAction: string, options: SubmitOptions): {
|
|
63
|
+
url: URL;
|
|
64
|
+
method: string;
|
|
65
|
+
encType: string;
|
|
66
|
+
formData: FormData;
|
|
67
|
+
};
|
|
68
|
+
export {};
|
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,202 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* NOTE: If you refactor this to split up the modules into separate files,
|
|
3
|
+
* you'll need to update the rollup config for react-router-dom-v5-compat.
|
|
4
|
+
*/
|
|
5
|
+
import * as React from "react";
|
|
6
|
+
import type { To } from "react-router";
|
|
7
|
+
import type { Fetcher, FormMethod, History, HydrationState, GetScrollRestorationKeyFunction, RouteObject } from "@remix-run/router";
|
|
8
|
+
import type { SubmitOptions, ParamKeyValuePair, URLSearchParamsInit } from "./dom";
|
|
9
|
+
import { createSearchParams } from "./dom";
|
|
10
|
+
export type { ParamKeyValuePair, URLSearchParamsInit };
|
|
11
|
+
export { createSearchParams };
|
|
12
|
+
export type { ActionFunction, DataMemoryRouterProps, DataRouteMatch, Fetcher, Hash, IndexRouteProps, JsonFunction, LayoutRouteProps, LoaderFunction, Location, MemoryRouterProps, NavigateFunction, NavigateOptions, NavigateProps, Navigation, Navigator, OutletProps, Params, Path, PathMatch, Pathname, PathPattern, PathRouteProps, RedirectFunction, RouteMatch, RouteObject, RouteProps, RouterProps, RoutesProps, Search, ShouldRevalidateFunction, To, } from "react-router";
|
|
13
|
+
export { DataMemoryRouter, MemoryRouter, Navigate, NavigationType, Outlet, Route, Router, Routes, createPath, createRoutesFromChildren, isRouteErrorResponse, generatePath, json, matchPath, matchRoutes, parsePath, redirect, renderMatches, resolvePath, useActionData, useHref, useInRouterContext, useLoaderData, useLocation, useMatch, useMatches, useNavigate, useNavigation, useNavigationType, useOutlet, useOutletContext, useParams, useResolvedPath, useRevalidator, useRouteError, useRouteLoaderData, useRoutes, } from "react-router";
|
|
14
|
+
/** @internal */
|
|
15
|
+
export { UNSAFE_NavigationContext, UNSAFE_LocationContext, UNSAFE_RouteContext, UNSAFE_DataRouterContext, UNSAFE_DataRouterStateContext, useRenderDataRouter, } from "react-router";
|
|
16
|
+
export interface DataBrowserRouterProps {
|
|
17
|
+
children?: React.ReactNode;
|
|
18
|
+
hydrationData?: HydrationState;
|
|
19
|
+
fallbackElement?: React.ReactNode;
|
|
20
|
+
routes?: RouteObject[];
|
|
21
|
+
window?: Window;
|
|
22
|
+
}
|
|
23
|
+
export declare function DataBrowserRouter({ children, fallbackElement, hydrationData, routes, window, }: DataBrowserRouterProps): React.ReactElement;
|
|
24
|
+
export interface DataHashRouterProps {
|
|
25
|
+
children?: React.ReactNode;
|
|
26
|
+
hydrationData?: HydrationState;
|
|
27
|
+
fallbackElement?: React.ReactNode;
|
|
28
|
+
routes?: RouteObject[];
|
|
29
|
+
window?: Window;
|
|
30
|
+
}
|
|
31
|
+
export declare function DataHashRouter({ children, hydrationData, fallbackElement, routes, window, }: DataBrowserRouterProps): React.ReactElement;
|
|
32
|
+
export interface BrowserRouterProps {
|
|
33
|
+
basename?: string;
|
|
34
|
+
children?: React.ReactNode;
|
|
35
|
+
window?: Window;
|
|
36
|
+
}
|
|
37
|
+
/**
|
|
38
|
+
* A `<Router>` for use in web browsers. Provides the cleanest URLs.
|
|
39
|
+
*/
|
|
40
|
+
export declare function BrowserRouter({ basename, children, window, }: BrowserRouterProps): JSX.Element;
|
|
41
|
+
export interface HashRouterProps {
|
|
42
|
+
basename?: string;
|
|
43
|
+
children?: React.ReactNode;
|
|
44
|
+
window?: Window;
|
|
45
|
+
}
|
|
46
|
+
/**
|
|
47
|
+
* A `<Router>` for use in web browsers. Stores the location in the hash
|
|
48
|
+
* portion of the URL so it is not sent to the server.
|
|
49
|
+
*/
|
|
50
|
+
export declare function HashRouter({ basename, children, window }: HashRouterProps): JSX.Element;
|
|
51
|
+
export interface HistoryRouterProps {
|
|
52
|
+
basename?: string;
|
|
53
|
+
children?: React.ReactNode;
|
|
54
|
+
history: History;
|
|
55
|
+
}
|
|
56
|
+
/**
|
|
57
|
+
* A `<Router>` that accepts a pre-instantiated history object. It's important
|
|
58
|
+
* to note that using your own history object is highly discouraged and may add
|
|
59
|
+
* two versions of the history library to your bundles unless you use the same
|
|
60
|
+
* version of the history library that React Router uses internally.
|
|
61
|
+
*/
|
|
62
|
+
declare function HistoryRouter({ basename, children, history }: HistoryRouterProps): JSX.Element;
|
|
63
|
+
declare namespace HistoryRouter {
|
|
64
|
+
var displayName: string;
|
|
65
|
+
}
|
|
66
|
+
export { HistoryRouter as unstable_HistoryRouter };
|
|
67
|
+
export interface LinkProps extends Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, "href"> {
|
|
68
|
+
reloadDocument?: boolean;
|
|
69
|
+
replace?: boolean;
|
|
70
|
+
state?: any;
|
|
71
|
+
resetScroll?: boolean;
|
|
72
|
+
to: To;
|
|
73
|
+
}
|
|
74
|
+
/**
|
|
75
|
+
* The public API for rendering a history-aware <a>.
|
|
76
|
+
*/
|
|
77
|
+
export declare const Link: React.ForwardRefExoticComponent<LinkProps & React.RefAttributes<HTMLAnchorElement>>;
|
|
78
|
+
export interface NavLinkProps extends Omit<LinkProps, "className" | "style" | "children"> {
|
|
79
|
+
children?: React.ReactNode | ((props: {
|
|
80
|
+
isActive: boolean;
|
|
81
|
+
isPending: boolean;
|
|
82
|
+
}) => React.ReactNode);
|
|
83
|
+
caseSensitive?: boolean;
|
|
84
|
+
className?: string | ((props: {
|
|
85
|
+
isActive: boolean;
|
|
86
|
+
isPending: boolean;
|
|
87
|
+
}) => string | undefined);
|
|
88
|
+
end?: boolean;
|
|
89
|
+
style?: React.CSSProperties | ((props: {
|
|
90
|
+
isActive: boolean;
|
|
91
|
+
isPending: boolean;
|
|
92
|
+
}) => React.CSSProperties | undefined);
|
|
93
|
+
}
|
|
94
|
+
/**
|
|
95
|
+
* A <Link> wrapper that knows if it's "active" or not.
|
|
96
|
+
*/
|
|
97
|
+
export declare const NavLink: React.ForwardRefExoticComponent<NavLinkProps & React.RefAttributes<HTMLAnchorElement>>;
|
|
98
|
+
export interface FormProps extends React.FormHTMLAttributes<HTMLFormElement> {
|
|
99
|
+
/**
|
|
100
|
+
* The HTTP verb to use when the form is submit. Supports "get", "post",
|
|
101
|
+
* "put", "delete", "patch".
|
|
102
|
+
*/
|
|
103
|
+
method?: FormMethod;
|
|
104
|
+
/**
|
|
105
|
+
* Normal `<form action>` but supports React Router's relative paths.
|
|
106
|
+
*/
|
|
107
|
+
action?: string;
|
|
108
|
+
/**
|
|
109
|
+
* Replaces the current entry in the browser history stack when the form
|
|
110
|
+
* navigates. Use this if you don't want the user to be able to click "back"
|
|
111
|
+
* to the page with the form on it.
|
|
112
|
+
*/
|
|
113
|
+
replace?: boolean;
|
|
114
|
+
/**
|
|
115
|
+
* A function to call when the form is submitted. If you call
|
|
116
|
+
* `event.preventDefault()` then this form will not do anything.
|
|
117
|
+
*/
|
|
118
|
+
onSubmit?: React.FormEventHandler<HTMLFormElement>;
|
|
119
|
+
}
|
|
120
|
+
/**
|
|
121
|
+
* A `@remix-run/router`-aware `<form>`. It behaves like a normal form except
|
|
122
|
+
* that the interaction with the server is with `fetch` instead of new document
|
|
123
|
+
* requests, allowing components to add nicer UX to the page as the form is
|
|
124
|
+
* submitted and returns with data.
|
|
125
|
+
*/
|
|
126
|
+
export declare const Form: React.ForwardRefExoticComponent<FormProps & React.RefAttributes<HTMLFormElement>>;
|
|
127
|
+
interface ScrollRestorationProps {
|
|
128
|
+
getKey?: GetScrollRestorationKeyFunction;
|
|
129
|
+
storageKey?: string;
|
|
130
|
+
}
|
|
131
|
+
/**
|
|
132
|
+
* This component will emulate the browser's scroll restoration on location
|
|
133
|
+
* changes.
|
|
134
|
+
*/
|
|
135
|
+
export declare function ScrollRestoration({ getKey, storageKey, }: ScrollRestorationProps): null;
|
|
136
|
+
export declare namespace ScrollRestoration {
|
|
137
|
+
var displayName: string;
|
|
138
|
+
}
|
|
139
|
+
/**
|
|
140
|
+
* Handles the click behavior for router `<Link>` components. This is useful if
|
|
141
|
+
* you need to create custom `<Link>` components with the same click behavior we
|
|
142
|
+
* use in our exported `<Link>`.
|
|
143
|
+
*/
|
|
144
|
+
export declare function useLinkClickHandler<E extends Element = HTMLAnchorElement>(to: To, { target, replace: replaceProp, state, resetScroll, }?: {
|
|
145
|
+
target?: React.HTMLAttributeAnchorTarget;
|
|
146
|
+
replace?: boolean;
|
|
147
|
+
state?: any;
|
|
148
|
+
resetScroll?: boolean;
|
|
149
|
+
}): (event: React.MouseEvent<E, MouseEvent>) => void;
|
|
150
|
+
/**
|
|
151
|
+
* A convenient wrapper for reading and writing search parameters via the
|
|
152
|
+
* URLSearchParams interface.
|
|
153
|
+
*/
|
|
154
|
+
export declare function useSearchParams(defaultInit?: URLSearchParamsInit): readonly [URLSearchParams, (nextInit: URLSearchParamsInit, navigateOptions?: {
|
|
155
|
+
replace?: boolean;
|
|
156
|
+
state?: any;
|
|
157
|
+
}) => void];
|
|
158
|
+
/**
|
|
159
|
+
* Submits a HTML `<form>` to the server without reloading the page.
|
|
160
|
+
*/
|
|
161
|
+
export interface SubmitFunction {
|
|
162
|
+
(
|
|
163
|
+
/**
|
|
164
|
+
* Specifies the `<form>` to be submitted to the server, a specific
|
|
165
|
+
* `<button>` or `<input type="submit">` to use to submit the form, or some
|
|
166
|
+
* arbitrary data to submit.
|
|
167
|
+
*
|
|
168
|
+
* Note: When using a `<button>` its `name` and `value` will also be
|
|
169
|
+
* included in the form data that is submitted.
|
|
170
|
+
*/
|
|
171
|
+
target: HTMLFormElement | HTMLButtonElement | HTMLInputElement | FormData | URLSearchParams | {
|
|
172
|
+
[name: string]: string;
|
|
173
|
+
} | null,
|
|
174
|
+
/**
|
|
175
|
+
* Options that override the `<form>`'s own attributes. Required when
|
|
176
|
+
* submitting arbitrary data without a backing `<form>`.
|
|
177
|
+
*/
|
|
178
|
+
options?: SubmitOptions): void;
|
|
179
|
+
}
|
|
180
|
+
/**
|
|
181
|
+
* Returns a function that may be used to programmatically submit a form (or
|
|
182
|
+
* some arbitrary data) to the server.
|
|
183
|
+
*/
|
|
184
|
+
export declare function useSubmit(): SubmitFunction;
|
|
185
|
+
declare function useSubmitImpl(fetcherKey?: string): SubmitFunction;
|
|
186
|
+
export declare function useFormAction(action?: string): string;
|
|
187
|
+
declare function createFetcherForm(fetcherKey: string): React.ForwardRefExoticComponent<FormProps & React.RefAttributes<HTMLFormElement>>;
|
|
188
|
+
declare type FetcherWithComponents<TData> = Fetcher<TData> & {
|
|
189
|
+
Form: ReturnType<typeof createFetcherForm>;
|
|
190
|
+
submit: ReturnType<typeof useSubmitImpl>;
|
|
191
|
+
load: (href: string) => void;
|
|
192
|
+
};
|
|
193
|
+
/**
|
|
194
|
+
* Interacts with route loaders and actions without causing a navigation. Great
|
|
195
|
+
* for any interaction that stays on the same page.
|
|
196
|
+
*/
|
|
197
|
+
export declare function useFetcher<TData = any>(): FetcherWithComponents<TData>;
|
|
198
|
+
/**
|
|
199
|
+
* Provides all fetchers currently on the page. Useful for layouts and parent
|
|
200
|
+
* routes that need to provide pending/optimistic UI regarding the fetch.
|
|
201
|
+
*/
|
|
202
|
+
export declare function useFetchers(): Fetcher[];
|