[d565449] | 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 { FutureConfig, Location, NavigateOptions, RelativeRoutingType, RouteObject, RouterProviderProps, To, unstable_PatchRoutesOnMissFunction } from "react-router";
|
---|
| 7 | import type { unstable_DataStrategyFunction, unstable_DataStrategyFunctionArgs, unstable_DataStrategyMatch, Fetcher, FormEncType, FormMethod, FutureConfig as RouterFutureConfig, GetScrollRestorationKeyFunction, History, HTMLFormMethod, HydrationState, Router as RemixRouter, V7_FormMethod, BlockerFunction } from "@remix-run/router";
|
---|
| 8 | import { UNSAFE_ErrorResponseImpl as ErrorResponseImpl } from "@remix-run/router";
|
---|
| 9 | import type { SubmitOptions, ParamKeyValuePair, URLSearchParamsInit, SubmitTarget, FetcherSubmitOptions } from "./dom";
|
---|
| 10 | import { createSearchParams } from "./dom";
|
---|
| 11 | export type { unstable_DataStrategyFunction, unstable_DataStrategyFunctionArgs, unstable_DataStrategyMatch, FormEncType, FormMethod, GetScrollRestorationKeyFunction, ParamKeyValuePair, SubmitOptions, URLSearchParamsInit, V7_FormMethod, };
|
---|
| 12 | export { createSearchParams, ErrorResponseImpl as UNSAFE_ErrorResponseImpl };
|
---|
| 13 | export type { ActionFunction, ActionFunctionArgs, AwaitProps, Blocker, BlockerFunction, DataRouteMatch, DataRouteObject, ErrorResponse, Fetcher, FutureConfig, Hash, IndexRouteObject, IndexRouteProps, JsonFunction, LazyRouteFunction, LayoutRouteProps, LoaderFunction, LoaderFunctionArgs, Location, MemoryRouterProps, NavigateFunction, NavigateOptions, NavigateProps, Navigation, Navigator, NonIndexRouteObject, OutletProps, Params, ParamParseKey, Path, PathMatch, Pathname, PathParam, PathPattern, PathRouteProps, RedirectFunction, RelativeRoutingType, RouteMatch, RouteObject, RouteProps, RouterProps, RouterProviderProps, RoutesProps, Search, ShouldRevalidateFunction, ShouldRevalidateFunctionArgs, To, UIMatch, unstable_HandlerResult, unstable_PatchRoutesOnMissFunction, } from "react-router";
|
---|
| 14 | export { AbortedDeferredError, Await, MemoryRouter, Navigate, NavigationType, Outlet, Route, Router, Routes, createMemoryRouter, createPath, createRoutesFromChildren, createRoutesFromElements, defer, isRouteErrorResponse, generatePath, json, matchPath, matchRoutes, parsePath, redirect, redirectDocument, replace, renderMatches, resolvePath, useActionData, useAsyncError, useAsyncValue, useBlocker, useHref, useInRouterContext, useLoaderData, useLocation, useMatch, useMatches, useNavigate, useNavigation, useNavigationType, useOutlet, useOutletContext, useParams, useResolvedPath, useRevalidator, useRouteError, useRouteLoaderData, useRoutes, } from "react-router";
|
---|
| 15 | /** @internal */
|
---|
| 16 | export { UNSAFE_DataRouterContext, UNSAFE_DataRouterStateContext, UNSAFE_NavigationContext, UNSAFE_LocationContext, UNSAFE_RouteContext, UNSAFE_useRouteId, } from "react-router";
|
---|
| 17 | declare global {
|
---|
| 18 | var __staticRouterHydrationData: HydrationState | undefined;
|
---|
| 19 | var __reactRouterVersion: string;
|
---|
| 20 | interface Document {
|
---|
| 21 | startViewTransition(cb: () => Promise<void> | void): ViewTransition;
|
---|
| 22 | }
|
---|
| 23 | }
|
---|
| 24 | interface DOMRouterOpts {
|
---|
| 25 | basename?: string;
|
---|
| 26 | future?: Partial<Omit<RouterFutureConfig, "v7_prependBasename">>;
|
---|
| 27 | hydrationData?: HydrationState;
|
---|
| 28 | unstable_dataStrategy?: unstable_DataStrategyFunction;
|
---|
| 29 | unstable_patchRoutesOnMiss?: unstable_PatchRoutesOnMissFunction;
|
---|
| 30 | window?: Window;
|
---|
| 31 | }
|
---|
| 32 | export declare function createBrowserRouter(routes: RouteObject[], opts?: DOMRouterOpts): RemixRouter;
|
---|
| 33 | export declare function createHashRouter(routes: RouteObject[], opts?: DOMRouterOpts): RemixRouter;
|
---|
| 34 | type ViewTransitionContextObject = {
|
---|
| 35 | isTransitioning: false;
|
---|
| 36 | } | {
|
---|
| 37 | isTransitioning: true;
|
---|
| 38 | flushSync: boolean;
|
---|
| 39 | currentLocation: Location;
|
---|
| 40 | nextLocation: Location;
|
---|
| 41 | };
|
---|
| 42 | declare const ViewTransitionContext: React.Context<ViewTransitionContextObject>;
|
---|
| 43 | export { ViewTransitionContext as UNSAFE_ViewTransitionContext };
|
---|
| 44 | type FetchersContextObject = Map<string, any>;
|
---|
| 45 | declare const FetchersContext: React.Context<FetchersContextObject>;
|
---|
| 46 | export { FetchersContext as UNSAFE_FetchersContext };
|
---|
| 47 | interface ViewTransition {
|
---|
| 48 | finished: Promise<void>;
|
---|
| 49 | ready: Promise<void>;
|
---|
| 50 | updateCallbackDone: Promise<void>;
|
---|
| 51 | skipTransition(): void;
|
---|
| 52 | }
|
---|
| 53 | /**
|
---|
| 54 | * Given a Remix Router instance, render the appropriate UI
|
---|
| 55 | */
|
---|
| 56 | export declare function RouterProvider({ fallbackElement, router, future, }: RouterProviderProps): React.ReactElement;
|
---|
| 57 | export interface BrowserRouterProps {
|
---|
| 58 | basename?: string;
|
---|
| 59 | children?: React.ReactNode;
|
---|
| 60 | future?: Partial<FutureConfig>;
|
---|
| 61 | window?: Window;
|
---|
| 62 | }
|
---|
| 63 | /**
|
---|
| 64 | * A `<Router>` for use in web browsers. Provides the cleanest URLs.
|
---|
| 65 | */
|
---|
| 66 | export declare function BrowserRouter({ basename, children, future, window, }: BrowserRouterProps): React.JSX.Element;
|
---|
| 67 | export interface HashRouterProps {
|
---|
| 68 | basename?: string;
|
---|
| 69 | children?: React.ReactNode;
|
---|
| 70 | future?: Partial<FutureConfig>;
|
---|
| 71 | window?: Window;
|
---|
| 72 | }
|
---|
| 73 | /**
|
---|
| 74 | * A `<Router>` for use in web browsers. Stores the location in the hash
|
---|
| 75 | * portion of the URL so it is not sent to the server.
|
---|
| 76 | */
|
---|
| 77 | export declare function HashRouter({ basename, children, future, window, }: HashRouterProps): React.JSX.Element;
|
---|
| 78 | export interface HistoryRouterProps {
|
---|
| 79 | basename?: string;
|
---|
| 80 | children?: React.ReactNode;
|
---|
| 81 | future?: FutureConfig;
|
---|
| 82 | history: History;
|
---|
| 83 | }
|
---|
| 84 | /**
|
---|
| 85 | * A `<Router>` that accepts a pre-instantiated history object. It's important
|
---|
| 86 | * to note that using your own history object is highly discouraged and may add
|
---|
| 87 | * two versions of the history library to your bundles unless you use the same
|
---|
| 88 | * version of the history library that React Router uses internally.
|
---|
| 89 | */
|
---|
| 90 | declare function HistoryRouter({ basename, children, future, history, }: HistoryRouterProps): React.JSX.Element;
|
---|
| 91 | declare namespace HistoryRouter {
|
---|
| 92 | var displayName: string;
|
---|
| 93 | }
|
---|
| 94 | export { HistoryRouter as unstable_HistoryRouter };
|
---|
| 95 | export interface LinkProps extends Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, "href"> {
|
---|
| 96 | reloadDocument?: boolean;
|
---|
| 97 | replace?: boolean;
|
---|
| 98 | state?: any;
|
---|
| 99 | preventScrollReset?: boolean;
|
---|
| 100 | relative?: RelativeRoutingType;
|
---|
| 101 | to: To;
|
---|
| 102 | unstable_viewTransition?: boolean;
|
---|
| 103 | }
|
---|
| 104 | /**
|
---|
| 105 | * The public API for rendering a history-aware `<a>`.
|
---|
| 106 | */
|
---|
| 107 | export declare const Link: React.ForwardRefExoticComponent<LinkProps & React.RefAttributes<HTMLAnchorElement>>;
|
---|
| 108 | export type NavLinkRenderProps = {
|
---|
| 109 | isActive: boolean;
|
---|
| 110 | isPending: boolean;
|
---|
| 111 | isTransitioning: boolean;
|
---|
| 112 | };
|
---|
| 113 | export interface NavLinkProps extends Omit<LinkProps, "className" | "style" | "children"> {
|
---|
| 114 | children?: React.ReactNode | ((props: NavLinkRenderProps) => React.ReactNode);
|
---|
| 115 | caseSensitive?: boolean;
|
---|
| 116 | className?: string | ((props: NavLinkRenderProps) => string | undefined);
|
---|
| 117 | end?: boolean;
|
---|
| 118 | style?: React.CSSProperties | ((props: NavLinkRenderProps) => React.CSSProperties | undefined);
|
---|
| 119 | }
|
---|
| 120 | /**
|
---|
| 121 | * A `<Link>` wrapper that knows if it's "active" or not.
|
---|
| 122 | */
|
---|
| 123 | export declare const NavLink: React.ForwardRefExoticComponent<NavLinkProps & React.RefAttributes<HTMLAnchorElement>>;
|
---|
| 124 | /**
|
---|
| 125 | * Form props shared by navigations and fetchers
|
---|
| 126 | */
|
---|
| 127 | interface SharedFormProps extends React.FormHTMLAttributes<HTMLFormElement> {
|
---|
| 128 | /**
|
---|
| 129 | * The HTTP verb to use when the form is submit. Supports "get", "post",
|
---|
| 130 | * "put", "delete", "patch".
|
---|
| 131 | */
|
---|
| 132 | method?: HTMLFormMethod;
|
---|
| 133 | /**
|
---|
| 134 | * `<form encType>` - enhancing beyond the normal string type and limiting
|
---|
| 135 | * to the built-in browser supported values
|
---|
| 136 | */
|
---|
| 137 | encType?: "application/x-www-form-urlencoded" | "multipart/form-data" | "text/plain";
|
---|
| 138 | /**
|
---|
| 139 | * Normal `<form action>` but supports React Router's relative paths.
|
---|
| 140 | */
|
---|
| 141 | action?: string;
|
---|
| 142 | /**
|
---|
| 143 | * Determines whether the form action is relative to the route hierarchy or
|
---|
| 144 | * the pathname. Use this if you want to opt out of navigating the route
|
---|
| 145 | * hierarchy and want to instead route based on /-delimited URL segments
|
---|
| 146 | */
|
---|
| 147 | relative?: RelativeRoutingType;
|
---|
| 148 | /**
|
---|
| 149 | * Prevent the scroll position from resetting to the top of the viewport on
|
---|
| 150 | * completion of the navigation when using the <ScrollRestoration> component
|
---|
| 151 | */
|
---|
| 152 | preventScrollReset?: boolean;
|
---|
| 153 | /**
|
---|
| 154 | * A function to call when the form is submitted. If you call
|
---|
| 155 | * `event.preventDefault()` then this form will not do anything.
|
---|
| 156 | */
|
---|
| 157 | onSubmit?: React.FormEventHandler<HTMLFormElement>;
|
---|
| 158 | }
|
---|
| 159 | /**
|
---|
| 160 | * Form props available to fetchers
|
---|
| 161 | */
|
---|
| 162 | export interface FetcherFormProps extends SharedFormProps {
|
---|
| 163 | }
|
---|
| 164 | /**
|
---|
| 165 | * Form props available to navigations
|
---|
| 166 | */
|
---|
| 167 | export interface FormProps extends SharedFormProps {
|
---|
| 168 | /**
|
---|
| 169 | * Indicate a specific fetcherKey to use when using navigate=false
|
---|
| 170 | */
|
---|
| 171 | fetcherKey?: string;
|
---|
| 172 | /**
|
---|
| 173 | * navigate=false will use a fetcher instead of a navigation
|
---|
| 174 | */
|
---|
| 175 | navigate?: boolean;
|
---|
| 176 | /**
|
---|
| 177 | * Forces a full document navigation instead of a fetch.
|
---|
| 178 | */
|
---|
| 179 | reloadDocument?: boolean;
|
---|
| 180 | /**
|
---|
| 181 | * Replaces the current entry in the browser history stack when the form
|
---|
| 182 | * navigates. Use this if you don't want the user to be able to click "back"
|
---|
| 183 | * to the page with the form on it.
|
---|
| 184 | */
|
---|
| 185 | replace?: boolean;
|
---|
| 186 | /**
|
---|
| 187 | * State object to add to the history stack entry for this navigation
|
---|
| 188 | */
|
---|
| 189 | state?: any;
|
---|
| 190 | /**
|
---|
| 191 | * Enable view transitions on this Form navigation
|
---|
| 192 | */
|
---|
| 193 | unstable_viewTransition?: boolean;
|
---|
| 194 | }
|
---|
| 195 | /**
|
---|
| 196 | * A `@remix-run/router`-aware `<form>`. It behaves like a normal form except
|
---|
| 197 | * that the interaction with the server is with `fetch` instead of new document
|
---|
| 198 | * requests, allowing components to add nicer UX to the page as the form is
|
---|
| 199 | * submitted and returns with data.
|
---|
| 200 | */
|
---|
| 201 | export declare const Form: React.ForwardRefExoticComponent<FormProps & React.RefAttributes<HTMLFormElement>>;
|
---|
| 202 | export interface ScrollRestorationProps {
|
---|
| 203 | getKey?: GetScrollRestorationKeyFunction;
|
---|
| 204 | storageKey?: string;
|
---|
| 205 | }
|
---|
| 206 | /**
|
---|
| 207 | * This component will emulate the browser's scroll restoration on location
|
---|
| 208 | * changes.
|
---|
| 209 | */
|
---|
| 210 | export declare function ScrollRestoration({ getKey, storageKey, }: ScrollRestorationProps): null;
|
---|
| 211 | export declare namespace ScrollRestoration {
|
---|
| 212 | var displayName: string;
|
---|
| 213 | }
|
---|
| 214 | /**
|
---|
| 215 | * Handles the click behavior for router `<Link>` components. This is useful if
|
---|
| 216 | * you need to create custom `<Link>` components with the same click behavior we
|
---|
| 217 | * use in our exported `<Link>`.
|
---|
| 218 | */
|
---|
| 219 | export declare function useLinkClickHandler<E extends Element = HTMLAnchorElement>(to: To, { target, replace: replaceProp, state, preventScrollReset, relative, unstable_viewTransition, }?: {
|
---|
| 220 | target?: React.HTMLAttributeAnchorTarget;
|
---|
| 221 | replace?: boolean;
|
---|
| 222 | state?: any;
|
---|
| 223 | preventScrollReset?: boolean;
|
---|
| 224 | relative?: RelativeRoutingType;
|
---|
| 225 | unstable_viewTransition?: boolean;
|
---|
| 226 | }): (event: React.MouseEvent<E, MouseEvent>) => void;
|
---|
| 227 | /**
|
---|
| 228 | * A convenient wrapper for reading and writing search parameters via the
|
---|
| 229 | * URLSearchParams interface.
|
---|
| 230 | */
|
---|
| 231 | export declare function useSearchParams(defaultInit?: URLSearchParamsInit): [URLSearchParams, SetURLSearchParams];
|
---|
| 232 | export type SetURLSearchParams = (nextInit?: URLSearchParamsInit | ((prev: URLSearchParams) => URLSearchParamsInit), navigateOpts?: NavigateOptions) => void;
|
---|
| 233 | /**
|
---|
| 234 | * Submits a HTML `<form>` to the server without reloading the page.
|
---|
| 235 | */
|
---|
| 236 | export interface SubmitFunction {
|
---|
| 237 | (
|
---|
| 238 | /**
|
---|
| 239 | * Specifies the `<form>` to be submitted to the server, a specific
|
---|
| 240 | * `<button>` or `<input type="submit">` to use to submit the form, or some
|
---|
| 241 | * arbitrary data to submit.
|
---|
| 242 | *
|
---|
| 243 | * Note: When using a `<button>` its `name` and `value` will also be
|
---|
| 244 | * included in the form data that is submitted.
|
---|
| 245 | */
|
---|
| 246 | target: SubmitTarget,
|
---|
| 247 | /**
|
---|
| 248 | * Options that override the `<form>`'s own attributes. Required when
|
---|
| 249 | * submitting arbitrary data without a backing `<form>`.
|
---|
| 250 | */
|
---|
| 251 | options?: SubmitOptions): void;
|
---|
| 252 | }
|
---|
| 253 | /**
|
---|
| 254 | * Submits a fetcher `<form>` to the server without reloading the page.
|
---|
| 255 | */
|
---|
| 256 | export interface FetcherSubmitFunction {
|
---|
| 257 | (target: SubmitTarget, options?: FetcherSubmitOptions): void;
|
---|
| 258 | }
|
---|
| 259 | /**
|
---|
| 260 | * Returns a function that may be used to programmatically submit a form (or
|
---|
| 261 | * some arbitrary data) to the server.
|
---|
| 262 | */
|
---|
| 263 | export declare function useSubmit(): SubmitFunction;
|
---|
| 264 | export declare function useFormAction(action?: string, { relative }?: {
|
---|
| 265 | relative?: RelativeRoutingType;
|
---|
| 266 | }): string;
|
---|
| 267 | export type FetcherWithComponents<TData> = Fetcher<TData> & {
|
---|
| 268 | Form: React.ForwardRefExoticComponent<FetcherFormProps & React.RefAttributes<HTMLFormElement>>;
|
---|
| 269 | submit: FetcherSubmitFunction;
|
---|
| 270 | load: (href: string, opts?: {
|
---|
| 271 | unstable_flushSync?: boolean;
|
---|
| 272 | }) => void;
|
---|
| 273 | };
|
---|
| 274 | /**
|
---|
| 275 | * Interacts with route loaders and actions without causing a navigation. Great
|
---|
| 276 | * for any interaction that stays on the same page.
|
---|
| 277 | */
|
---|
| 278 | export declare function useFetcher<TData = any>({ key, }?: {
|
---|
| 279 | key?: string;
|
---|
| 280 | }): FetcherWithComponents<TData>;
|
---|
| 281 | /**
|
---|
| 282 | * Provides all fetchers currently on the page. Useful for layouts and parent
|
---|
| 283 | * routes that need to provide pending/optimistic UI regarding the fetch.
|
---|
| 284 | */
|
---|
| 285 | export declare function useFetchers(): (Fetcher & {
|
---|
| 286 | key: string;
|
---|
| 287 | })[];
|
---|
| 288 | /**
|
---|
| 289 | * When rendered inside a RouterProvider, will restore scroll positions on navigations
|
---|
| 290 | */
|
---|
| 291 | declare function useScrollRestoration({ getKey, storageKey, }?: {
|
---|
| 292 | getKey?: GetScrollRestorationKeyFunction;
|
---|
| 293 | storageKey?: string;
|
---|
| 294 | }): void;
|
---|
| 295 | export { useScrollRestoration as UNSAFE_useScrollRestoration };
|
---|
| 296 | /**
|
---|
| 297 | * Setup a callback to be fired on the window's `beforeunload` event. This is
|
---|
| 298 | * useful for saving some data to `window.localStorage` just before the page
|
---|
| 299 | * refreshes.
|
---|
| 300 | *
|
---|
| 301 | * Note: The `callback` argument should be a function created with
|
---|
| 302 | * `React.useCallback()`.
|
---|
| 303 | */
|
---|
| 304 | export declare function useBeforeUnload(callback: (event: BeforeUnloadEvent) => any, options?: {
|
---|
| 305 | capture?: boolean;
|
---|
| 306 | }): void;
|
---|
| 307 | /**
|
---|
| 308 | * Wrapper around useBlocker to show a window.confirm prompt to users instead
|
---|
| 309 | * of building a custom UI with useBlocker.
|
---|
| 310 | *
|
---|
| 311 | * Warning: This has *a lot of rough edges* and behaves very differently (and
|
---|
| 312 | * very incorrectly in some cases) across browsers if user click addition
|
---|
| 313 | * back/forward navigations while the confirm is open. Use at your own risk.
|
---|
| 314 | */
|
---|
| 315 | declare function usePrompt({ when, message, }: {
|
---|
| 316 | when: boolean | BlockerFunction;
|
---|
| 317 | message: string;
|
---|
| 318 | }): void;
|
---|
| 319 | export { usePrompt as unstable_usePrompt };
|
---|
| 320 | /**
|
---|
| 321 | * Return a boolean indicating if there is an active view transition to the
|
---|
| 322 | * given href. You can use this value to render CSS classes or viewTransitionName
|
---|
| 323 | * styles onto your elements
|
---|
| 324 | *
|
---|
| 325 | * @param href The destination href
|
---|
| 326 | * @param [opts.relative] Relative routing type ("route" | "path")
|
---|
| 327 | */
|
---|
| 328 | declare function useViewTransitionState(to: To, opts?: {
|
---|
| 329 | relative?: RelativeRoutingType;
|
---|
| 330 | }): boolean;
|
---|
| 331 | export { useViewTransitionState as unstable_useViewTransitionState };
|
---|