UNPKG

12.9 kBTypeScriptView Raw
1import * as React from 'react';
2import { L as Location, C as ClientActionFunction, a as ClientLoaderFunction, b as LinksFunction, M as MetaFunction, S as ShouldRevalidateFunction, P as Params, c as RouterContextProvider, A as ActionFunction, H as HeadersFunction, d as LoaderFunction, e as RouterInit } from './instrumentation--6Pioq_G.js';
3
4declare function getRequest(): Request;
5type RSCRouteConfigEntryBase = {
6 action?: ActionFunction;
7 clientAction?: ClientActionFunction;
8 clientLoader?: ClientLoaderFunction;
9 ErrorBoundary?: React.ComponentType<any>;
10 handle?: any;
11 headers?: HeadersFunction;
12 HydrateFallback?: React.ComponentType<any>;
13 Layout?: React.ComponentType<any>;
14 links?: LinksFunction;
15 loader?: LoaderFunction;
16 meta?: MetaFunction;
17 shouldRevalidate?: ShouldRevalidateFunction;
18};
19type RSCRouteConfigEntry = RSCRouteConfigEntryBase & {
20 id: string;
21 path?: string;
22 Component?: React.ComponentType<any>;
23 lazy?: () => Promise<RSCRouteConfigEntryBase & ({
24 default?: React.ComponentType<any>;
25 Component?: never;
26 } | {
27 default?: never;
28 Component?: React.ComponentType<any>;
29 })>;
30} & ({
31 index: true;
32} | {
33 children?: RSCRouteConfigEntry[];
34});
35type RSCRouteConfig = Array<RSCRouteConfigEntry>;
36type RSCRouteManifest = {
37 clientAction?: ClientActionFunction;
38 clientLoader?: ClientLoaderFunction;
39 element?: React.ReactElement | false;
40 errorElement?: React.ReactElement;
41 handle?: any;
42 hasAction: boolean;
43 hasComponent: boolean;
44 hasErrorBoundary: boolean;
45 hasLoader: boolean;
46 hydrateFallbackElement?: React.ReactElement;
47 id: string;
48 index?: boolean;
49 links?: LinksFunction;
50 meta?: MetaFunction;
51 parentId?: string;
52 path?: string;
53 shouldRevalidate?: ShouldRevalidateFunction;
54};
55type RSCRouteMatch = RSCRouteManifest & {
56 params: Params;
57 pathname: string;
58 pathnameBase: string;
59};
60type RSCRenderPayload = {
61 type: "render";
62 actionData: Record<string, any> | null;
63 basename: string | undefined;
64 errors: Record<string, any> | null;
65 loaderData: Record<string, any>;
66 location: Location;
67 matches: RSCRouteMatch[];
68 patches?: RSCRouteManifest[];
69 nonce?: string;
70 formState?: unknown;
71};
72type RSCManifestPayload = {
73 type: "manifest";
74 patches: RSCRouteManifest[];
75};
76type RSCActionPayload = {
77 type: "action";
78 actionResult: Promise<unknown>;
79 rerender?: Promise<RSCRenderPayload | RSCRedirectPayload>;
80};
81type RSCRedirectPayload = {
82 type: "redirect";
83 status: number;
84 location: string;
85 replace: boolean;
86 reload: boolean;
87 actionResult?: Promise<unknown>;
88};
89type RSCPayload = RSCRenderPayload | RSCManifestPayload | RSCActionPayload | RSCRedirectPayload;
90type RSCMatch = {
91 statusCode: number;
92 headers: Headers;
93 payload: RSCPayload;
94};
95type DecodeActionFunction = (formData: FormData) => Promise<() => Promise<unknown>>;
96type DecodeFormStateFunction = (result: unknown, formData: FormData) => unknown;
97type DecodeReplyFunction = (reply: FormData | string, options: {
98 temporaryReferences: unknown;
99}) => Promise<unknown[]>;
100type LoadServerActionFunction = (id: string) => Promise<Function>;
101/**
102 * Matches the given routes to a [`Request`](https://developer.mozilla.org/en-US/docs/Web/API/Request)
103 * and returns an [RSC](https://react.dev/reference/rsc/server-components)
104 * [`Response`](https://developer.mozilla.org/en-US/docs/Web/API/Response)
105 * encoding an {@link unstable_RSCPayload} for consumption by an [RSC](https://react.dev/reference/rsc/server-components)
106 * enabled client router.
107 *
108 * @example
109 * import {
110 * createTemporaryReferenceSet,
111 * decodeAction,
112 * decodeReply,
113 * loadServerAction,
114 * renderToReadableStream,
115 * } from "@vitejs/plugin-rsc/rsc";
116 * import { unstable_matchRSCServerRequest as matchRSCServerRequest } from "react-router";
117 *
118 * matchRSCServerRequest({
119 * createTemporaryReferenceSet,
120 * decodeAction,
121 * decodeFormState,
122 * decodeReply,
123 * loadServerAction,
124 * request,
125 * routes: routes(),
126 * generateResponse(match) {
127 * return new Response(
128 * renderToReadableStream(match.payload),
129 * {
130 * status: match.statusCode,
131 * headers: match.headers,
132 * }
133 * );
134 * },
135 * });
136 *
137 * @name unstable_matchRSCServerRequest
138 * @public
139 * @category RSC
140 * @mode data
141 * @param opts Options
142 * @param opts.allowedActionOrigins Origin patterns that are allowed to execute actions.
143 * @param opts.basename The basename to use when matching the request.
144 * @param opts.createTemporaryReferenceSet A function that returns a temporary
145 * reference set for the request, used to track temporary references in the [RSC](https://react.dev/reference/rsc/server-components)
146 * stream.
147 * @param opts.decodeAction Your `react-server-dom-xyz/server`'s `decodeAction`
148 * function, responsible for loading a server action.
149 * @param opts.decodeFormState A function responsible for decoding form state for
150 * progressively enhanceable forms with React's [`useActionState`](https://react.dev/reference/react/useActionState)
151 * using your `react-server-dom-xyz/server`'s `decodeFormState`.
152 * @param opts.decodeReply Your `react-server-dom-xyz/server`'s `decodeReply`
153 * function, used to decode the server function's arguments and bind them to the
154 * implementation for invocation by the router.
155 * @param opts.generateResponse A function responsible for using your
156 * `renderToReadableStream` to generate a [`Response`](https://developer.mozilla.org/en-US/docs/Web/API/Response)
157 * encoding the {@link unstable_RSCPayload}.
158 * @param opts.loadServerAction Your `react-server-dom-xyz/server`'s
159 * `loadServerAction` function, used to load a server action by ID.
160 * @param opts.onError An optional error handler that will be called with any
161 * errors that occur during the request processing.
162 * @param opts.request The [`Request`](https://developer.mozilla.org/en-US/docs/Web/API/Request)
163 * to match against.
164 * @param opts.requestContext An instance of {@link RouterContextProvider}
165 * that should be created per request, to be passed to [`action`](../../start/data/route-object#action)s,
166 * [`loader`](../../start/data/route-object#loader)s and [middleware](../../how-to/middleware).
167 * @param opts.routes Your {@link unstable_RSCRouteConfigEntry | route definitions}.
168 * @returns A [`Response`](https://developer.mozilla.org/en-US/docs/Web/API/Response)
169 * that contains the [RSC](https://react.dev/reference/rsc/server-components)
170 * data for hydration.
171 */
172declare function matchRSCServerRequest({ allowedActionOrigins, createTemporaryReferenceSet, basename, decodeReply, requestContext, loadServerAction, decodeAction, decodeFormState, onError, request, routes, generateResponse, }: {
173 allowedActionOrigins?: string[];
174 createTemporaryReferenceSet: () => unknown;
175 basename?: string;
176 decodeReply?: DecodeReplyFunction;
177 decodeAction?: DecodeActionFunction;
178 decodeFormState?: DecodeFormStateFunction;
179 requestContext?: RouterContextProvider;
180 loadServerAction?: LoadServerActionFunction;
181 onError?: (error: unknown) => void;
182 request: Request;
183 routes: RSCRouteConfigEntry[];
184 generateResponse: (match: RSCMatch, { onError, temporaryReferences, }: {
185 onError(error: unknown): string | undefined;
186 temporaryReferences: unknown;
187 }) => Response;
188}): Promise<Response>;
189
190type BrowserCreateFromReadableStreamFunction = (body: ReadableStream<Uint8Array>, { temporaryReferences, }: {
191 temporaryReferences: unknown;
192}) => Promise<unknown>;
193type EncodeReplyFunction = (args: unknown[], options: {
194 temporaryReferences: unknown;
195}) => Promise<BodyInit>;
196/**
197 * Create a React `callServer` implementation for React Router.
198 *
199 * @example
200 * import {
201 * createFromReadableStream,
202 * createTemporaryReferenceSet,
203 * encodeReply,
204 * setServerCallback,
205 * } from "@vitejs/plugin-rsc/browser";
206 * import { unstable_createCallServer as createCallServer } from "react-router";
207 *
208 * setServerCallback(
209 * createCallServer({
210 * createFromReadableStream,
211 * createTemporaryReferenceSet,
212 * encodeReply,
213 * })
214 * );
215 *
216 * @name unstable_createCallServer
217 * @public
218 * @category RSC
219 * @mode data
220 * @param opts Options
221 * @param opts.createFromReadableStream Your `react-server-dom-xyz/client`'s
222 * `createFromReadableStream`. Used to decode payloads from the server.
223 * @param opts.createTemporaryReferenceSet A function that creates a temporary
224 * reference set for the [RSC](https://react.dev/reference/rsc/server-components)
225 * payload.
226 * @param opts.encodeReply Your `react-server-dom-xyz/client`'s `encodeReply`.
227 * Used when sending payloads to the server.
228 * @param opts.fetch Optional [Fetch API](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API)
229 * implementation. Defaults to global [`fetch`](https://developer.mozilla.org/en-US/docs/Web/API/fetch).
230 * @returns A function that can be used to call server actions.
231 */
232declare function createCallServer({ createFromReadableStream, createTemporaryReferenceSet, encodeReply, fetch: fetchImplementation, }: {
233 createFromReadableStream: BrowserCreateFromReadableStreamFunction;
234 createTemporaryReferenceSet: () => unknown;
235 encodeReply: EncodeReplyFunction;
236 fetch?: (request: Request) => Promise<Response>;
237}): (id: string, args: unknown[]) => Promise<unknown>;
238/**
239 * Props for the {@link unstable_RSCHydratedRouter} component.
240 *
241 * @name unstable_RSCHydratedRouterProps
242 * @category Types
243 */
244interface RSCHydratedRouterProps {
245 /**
246 * Your `react-server-dom-xyz/client`'s `createFromReadableStream` function,
247 * used to decode payloads from the server.
248 */
249 createFromReadableStream: BrowserCreateFromReadableStreamFunction;
250 /**
251 * Optional fetch implementation. Defaults to global [`fetch`](https://developer.mozilla.org/en-US/docs/Web/API/fetch).
252 */
253 fetch?: (request: Request) => Promise<Response>;
254 /**
255 * The decoded {@link unstable_RSCPayload} to hydrate.
256 */
257 payload: RSCPayload;
258 /**
259 * `"eager"` or `"lazy"` - Determines if links are eagerly discovered, or
260 * delayed until clicked.
261 */
262 routeDiscovery?: "eager" | "lazy";
263 /**
264 * A function that returns an {@link RouterContextProvider} instance
265 * which is provided as the `context` argument to client [`action`](../../start/data/route-object#action)s,
266 * [`loader`](../../start/data/route-object#loader)s and [middleware](../../how-to/middleware).
267 * This function is called to generate a fresh `context` instance on each
268 * navigation or fetcher call.
269 */
270 getContext?: RouterInit["getContext"];
271}
272/**
273 * Hydrates a server rendered {@link unstable_RSCPayload} in the browser.
274 *
275 * @example
276 * import { startTransition, StrictMode } from "react";
277 * import { hydrateRoot } from "react-dom/client";
278 * import {
279 * unstable_getRSCStream as getRSCStream,
280 * unstable_RSCHydratedRouter as RSCHydratedRouter,
281 * } from "react-router";
282 * import type { unstable_RSCPayload as RSCPayload } from "react-router";
283 *
284 * createFromReadableStream(getRSCStream()).then((payload) =>
285 * startTransition(async () => {
286 * hydrateRoot(
287 * document,
288 * <StrictMode>
289 * <RSCHydratedRouter
290 * createFromReadableStream={createFromReadableStream}
291 * payload={payload}
292 * />
293 * </StrictMode>,
294 * { formState: await getFormState(payload) },
295 * );
296 * }),
297 * );
298 *
299 * @name unstable_RSCHydratedRouter
300 * @public
301 * @category RSC
302 * @mode data
303 * @param props Props
304 * @param {unstable_RSCHydratedRouterProps.createFromReadableStream} props.createFromReadableStream n/a
305 * @param {unstable_RSCHydratedRouterProps.fetch} props.fetch n/a
306 * @param {unstable_RSCHydratedRouterProps.getContext} props.getContext n/a
307 * @param {unstable_RSCHydratedRouterProps.payload} props.payload n/a
308 * @param {unstable_RSCHydratedRouterProps.routeDiscovery} props.routeDiscovery n/a
309 * @returns A hydrated {@link DataRouter} that can be used to navigate and
310 * render routes.
311 */
312declare function RSCHydratedRouter({ createFromReadableStream, fetch: fetchImplementation, payload, routeDiscovery, getContext, }: RSCHydratedRouterProps): React.JSX.Element;
313
314export { type BrowserCreateFromReadableStreamFunction as B, type DecodeActionFunction as D, type EncodeReplyFunction as E, type LoadServerActionFunction as L, RSCHydratedRouter as R, type DecodeFormStateFunction as a, type DecodeReplyFunction as b, createCallServer as c, type RSCManifestPayload as d, type RSCPayload as e, type RSCRenderPayload as f, getRequest as g, type RSCHydratedRouterProps as h, type RSCMatch as i, type RSCRouteManifest as j, type RSCRouteMatch as k, type RSCRouteConfigEntry as l, matchRSCServerRequest as m, type RSCRouteConfig as n };