...
;
* }
* ```
*/
children: React.ReactNode | AwaitResolveRenderFunction;
/**
* The error element renders instead of the `children` when the [`Promise`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise)
* rejects.
*
* ```tsx
* Oops}
* resolve={reviewsPromise}
* >
*
*
* ```
*
* To provide a more contextual error, you can use the {@link useAsyncError} in a
* child component
*
* ```tsx
* }
* resolve={reviewsPromise}
* >
*
*
*
* function ReviewsError() {
* const error = useAsyncError();
* return Error loading reviews: {error.message}
;
* }
* ```
*
* If you do not provide an `errorElement`, the rejected value will bubble up
* to the nearest route-level [`ErrorBoundary`](../../start/framework/route-module#errorboundary)
* and be accessible via the {@link useRouteError} hook.
*/
errorElement?: React.ReactNode;
/**
* Takes a [`Promise`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise)
* returned from a [`loader`](../../start/framework/route-module#loader) to be
* resolved and rendered.
*
* ```tsx
* import { Await, useLoaderData } from "react-router";
*
* export async function loader() {
* let reviews = getReviews(); // not awaited
* let book = await getBook();
* return {
* book,
* reviews, // this is a promise
* };
* }
*
* export default function Book() {
* const {
* book,
* reviews, // this is the same promise
* } = useLoaderData();
*
* return (
*
*
{book.title}
*
{book.description}
*
}>
*
*
*
*
*
* );
* }
* ```
*/
resolve: Resolve;
}
/**
* Used to render promise values with automatic error handling.
*
* **Note:** `` expects to be rendered inside a [``](https://react.dev/reference/react/Suspense)
*
* @example
* import { Await, useLoaderData } from "react-router";
*
* export async function loader() {
* // not awaited
* const reviews = getReviews();
* // awaited (blocks the transition)
* const book = await fetch("/api/book").then((res) => res.json());
* return { book, reviews };
* }
*
* function Book() {
* const { book, reviews } = useLoaderData();
* return (
*
*
{book.title}
*
{book.description}
*
}>
*
Could not load reviews 😬
* }
* children={(resolvedReviews) => (
*
* )}
* />
*
*
* );
* }
*
* @public
* @category Components
* @mode framework
* @mode data
* @param props Props
* @param {AwaitProps.children} props.children n/a
* @param {AwaitProps.errorElement} props.errorElement n/a
* @param {AwaitProps.resolve} props.resolve n/a
* @returns React element for the rendered awaited value
*/
declare function Await({ children, errorElement, resolve, }: AwaitProps): React.JSX.Element;
/**
* Creates a route config from a React "children" object, which is usually
* either a `` element or an array of them. Used internally by
* `` to create a route config from its children.
*
* @category Utils
* @mode data
* @param children The React children to convert into a route config
* @param parentPath The path of the parent route, used to generate unique IDs.
* @returns An array of {@link RouteObject}s that can be used with a {@link DataRouter}
*/
declare function createRoutesFromChildren(children: React.ReactNode, parentPath?: number[]): RouteObject[];
/**
* Create route objects from JSX elements instead of arrays of objects.
*
* @example
* const routes = createRoutesFromElements(
* <>
*
*
*
* >
* );
*
* const router = createBrowserRouter(routes);
*
* function App() {
* return ;
* }
*
* @name createRoutesFromElements
* @public
* @category Utils
* @mode data
* @param children The React children to convert into a route config
* @param parentPath The path of the parent route, used to generate unique IDs.
* This is used for internal recursion and is not intended to be used by the
* application developer.
* @returns An array of {@link RouteObject}s that can be used with a {@link DataRouter}
*/
declare const createRoutesFromElements: typeof createRoutesFromChildren;
/**
* Renders the result of {@link matchRoutes} into a React element.
*
* @public
* @category Utils
* @param matches The array of {@link RouteMatch | route matches} to render
* @returns A React element that renders the matched routes or `null` if no matches
*/
declare function renderMatches(matches: RouteMatch[] | null): React.ReactElement | null;
declare function useRouteComponentProps(): {
params: Readonly>;
loaderData: any;
actionData: any;
matches: UIMatch[];
};
type RouteComponentProps = ReturnType;
type RouteComponentType = React.ComponentType;
declare function WithComponentProps({ children, }: {
children: React.ReactElement;
}): React.ReactElement>;
declare function withComponentProps(Component: RouteComponentType): () => React.ReactElement<{
params: Readonly>;
loaderData: any;
actionData: any;
matches: UIMatch[];
}, string | React.JSXElementConstructor>;
declare function useHydrateFallbackProps(): {
params: Readonly>;
loaderData: any;
actionData: any;
};
type HydrateFallbackProps = ReturnType;
type HydrateFallbackType = React.ComponentType;
declare function WithHydrateFallbackProps({ children, }: {
children: React.ReactElement;
}): React.ReactElement>;
declare function withHydrateFallbackProps(HydrateFallback: HydrateFallbackType): () => React.ReactElement<{
params: Readonly>;
loaderData: any;
actionData: any;
}, string | React.JSXElementConstructor>;
declare function useErrorBoundaryProps(): {
params: Readonly>;
loaderData: any;
actionData: any;
error: unknown;
};
type ErrorBoundaryProps = ReturnType;
type ErrorBoundaryType = React.ComponentType;
declare function WithErrorBoundaryProps({ children, }: {
children: React.ReactElement;
}): React.ReactElement>;
declare function withErrorBoundaryProps(ErrorBoundary: ErrorBoundaryType): () => React.ReactElement<{
params: Readonly>;
loaderData: any;
actionData: any;
error: unknown;
}, string | React.JSXElementConstructor>;
interface DataRouterContextObject extends Omit {
router: Router$1;
staticContext?: StaticHandlerContext;
onError?: ClientOnErrorFunction;
}
declare const DataRouterContext: React.Context;
declare const DataRouterStateContext: React.Context;
type ViewTransitionContextObject = {
isTransitioning: false;
} | {
isTransitioning: true;
flushSync: boolean;
currentLocation: Location;
nextLocation: Location;
};
declare const ViewTransitionContext: React.Context;
type FetchersContextObject = Map;
declare const FetchersContext: React.Context;
declare const AwaitContext: React.Context;
declare const AwaitContextProvider: (props: React.ComponentProps) => React.FunctionComponentElement>;
interface NavigateOptions {
/** Replace the current entry in the history stack instead of pushing a new one */
replace?: boolean;
/** Masked URL */
unstable_mask?: To;
/** Adds persistent client side routing state to the next location */
state?: any;
/** If you are using {@link ScrollRestoration ``}, prevent the scroll position from being reset to the top of the window when navigating */
preventScrollReset?: boolean;
/** Defines the relative path behavior for the link. "route" will use the route hierarchy so ".." will remove all URL segments of the current route pattern while "path" will use the URL path so ".." will remove one URL segment. */
relative?: RelativeRoutingType;
/** Wraps the initial state update for this navigation in a {@link https://react.dev/reference/react-dom/flushSync ReactDOM.flushSync} call instead of the default {@link https://react.dev/reference/react/startTransition React.startTransition} */
flushSync?: boolean;
/** Enables a {@link https://developer.mozilla.org/en-US/docs/Web/API/View_Transitions_API View Transition} for this navigation by wrapping the final state update in `document.startViewTransition()`. If you need to apply specific styles for this view transition, you will also need to leverage the {@link useViewTransitionState `useViewTransitionState()`} hook. */
viewTransition?: boolean;
/** Specifies the default revalidation behavior after this submission */
unstable_defaultShouldRevalidate?: boolean;
}
/**
* A Navigator is a "location changer"; it's how you get to different locations.
*
* Every history instance conforms to the Navigator interface, but the
* distinction is useful primarily when it comes to the low-level `` API
* where both the location and a navigator must be provided separately in order
* to avoid "tearing" that may occur in a suspense-enabled app if the action
* and/or location were to be read directly from the history instance.
*/
interface Navigator {
createHref: History["createHref"];
encodeLocation?: History["encodeLocation"];
go: History["go"];
push(to: To, state?: any, opts?: NavigateOptions): void;
replace(to: To, state?: any, opts?: NavigateOptions): void;
}
interface NavigationContextObject {
basename: string;
navigator: Navigator;
static: boolean;
unstable_useTransitions: boolean | undefined;
future: {};
}
declare const NavigationContext: React.Context;
interface LocationContextObject {
location: Location;
navigationType: Action;
}
declare const LocationContext: React.Context;
interface RouteContextObject {
outlet: React.ReactElement | null;
matches: RouteMatch[];
isDataRoute: boolean;
}
declare const RouteContext: React.Context;
export { createRoutesFromElements as $, AwaitContextProvider as A, type BlockerFunction as B, type ClientOnErrorFunction as C, type RouteProps as D, type RouterProps as E, type Fetcher as F, type GetScrollPositionFunction as G, type HydrationState as H, IDLE_NAVIGATION as I, type RoutesProps as J, Await as K, type LayoutRouteProps as L, type MemoryRouterOpts as M, type NavigateOptions as N, type OutletProps as O, type PathRouteProps as P, MemoryRouter as Q, type RouterInit as R, type StaticHandler as S, Navigate as T, Outlet as U, Route as V, Router as W, RouterProvider as X, Routes as Y, createMemoryRouter as Z, createRoutesFromChildren as _, type RouterProviderProps as a, renderMatches as a0, createRouter as a1, DataRouterContext as a2, DataRouterStateContext as a3, FetchersContext as a4, LocationContext as a5, NavigationContext as a6, RouteContext as a7, ViewTransitionContext as a8, hydrationRouteProperties as a9, mapRouteProperties as aa, WithComponentProps as ab, withComponentProps as ac, WithHydrateFallbackProps as ad, withHydrateFallbackProps as ae, WithErrorBoundaryProps as af, withErrorBoundaryProps as ag, type FutureConfig as ah, type CreateStaticHandlerOptions as ai, type Router$1 as b, type Blocker as c, type RelativeRoutingType as d, type Navigation as e, type RouterState as f, type GetScrollRestorationKeyFunction as g, type StaticHandlerContext as h, type NavigationStates as i, type RouterSubscriber as j, type RouterNavigateOptions as k, type RouterFetchOptions as l, type RevalidationState as m, type unstable_ServerInstrumentation as n, type unstable_InstrumentRequestHandlerFunction as o, type unstable_InstrumentRouterFunction as p, type unstable_InstrumentRouteFunction as q, type unstable_InstrumentationHandlerResult as r, IDLE_FETCHER as s, IDLE_BLOCKER as t, type unstable_ClientInstrumentation as u, type Navigator as v, type AwaitProps as w, type IndexRouteProps as x, type MemoryRouterProps as y, type NavigateProps as z };