browser-BpxEZgZC.d.ts 12 KB

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