react-router 7.15.1 → 8.0.0-pre.0

package/dist/development/lib/rsc/html-stream/browser.d.ts

@@ -0,0 +1,48 @@
+
+//#region lib/rsc/html-stream/browser.d.ts
+declare global {
+  interface Window {
+    __FLIGHT_DATA: any[];
+  }
+}
+/**
+ * Get the prerendered [RSC](https://react.dev/reference/rsc/server-components)
+ * stream for hydration. Usually passed directly to your
+ * `react-server-dom-xyz/client`'s `createFromReadableStream`.
+ *
+ * @example
+ * import { startTransition, StrictMode } from "react";
+ * import { hydrateRoot } from "react-dom/client";
+ * import {
+ *   unstable_getRSCStream as getRSCStream,
+ *   unstable_RSCHydratedRouter as RSCHydratedRouter,
+ * } from "react-router";
+ * import type { unstable_RSCPayload as RSCPayload } from "react-router";
+ *
+ * createFromReadableStream(getRSCStream()).then(
+ *   (payload: RSCServerPayload) => {
+ *     startTransition(async () => {
+ *       hydrateRoot(
+ *         document,
+ *         <StrictMode>
+ *           <RSCHydratedRouter {...props} />
+ *         </StrictMode>,
+ *         {
+ *           // Options
+ *         }
+ *       );
+ *     });
+ *   }
+ * );
+ *
+ * @name unstable_getRSCStream
+ * @public
+ * @category RSC
+ * @mode data
+ * @returns A [`ReadableStream`](https://developer.mozilla.org/en-US/docs/Web/API/ReadableStream)
+ * that contains the [RSC](https://react.dev/reference/rsc/server-components)
+ * data for hydration.
+ */
+declare function getRSCStream(): ReadableStream;
+//#endregion
+export { getRSCStream };

package/dist/development/lib/rsc/html-stream/browser.js

@@ -0,0 +1,74 @@
+/**
+ * react-router v8.0.0-pre.0
+ *
+ * Copyright (c) Remix Software Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE.md file in the root directory of this source tree.
+ *
+ * @license MIT
+ */
+//#region lib/rsc/html-stream/browser.ts
+/**
+* Get the prerendered [RSC](https://react.dev/reference/rsc/server-components)
+* stream for hydration. Usually passed directly to your
+* `react-server-dom-xyz/client`'s `createFromReadableStream`.
+*
+* @example
+* import { startTransition, StrictMode } from "react";
+* import { hydrateRoot } from "react-dom/client";
+* import {
+*   unstable_getRSCStream as getRSCStream,
+*   unstable_RSCHydratedRouter as RSCHydratedRouter,
+* } from "react-router";
+* import type { unstable_RSCPayload as RSCPayload } from "react-router";
+*
+* createFromReadableStream(getRSCStream()).then(
+*   (payload: RSCServerPayload) => {
+*     startTransition(async () => {
+*       hydrateRoot(
+*         document,
+*         <StrictMode>
+*           <RSCHydratedRouter {...props} />
+*         </StrictMode>,
+*         {
+*           // Options
+*         }
+*       );
+*     });
+*   }
+* );
+*
+* @name unstable_getRSCStream
+* @public
+* @category RSC
+* @mode data
+* @returns A [`ReadableStream`](https://developer.mozilla.org/en-US/docs/Web/API/ReadableStream)
+* that contains the [RSC](https://react.dev/reference/rsc/server-components)
+* data for hydration.
+*/
+function getRSCStream() {
+	let encoder = new TextEncoder();
+	let streamController = null;
+	let rscStream = new ReadableStream({ start(controller) {
+		if (typeof window === "undefined") return;
+		let handleChunk = (chunk) => {
+			if (typeof chunk === "string") controller.enqueue(encoder.encode(chunk));
+			else controller.enqueue(chunk);
+		};
+		window.__FLIGHT_DATA ||= [];
+		window.__FLIGHT_DATA.forEach(handleChunk);
+		window.__FLIGHT_DATA.push = (chunk) => {
+			handleChunk(chunk);
+			return 0;
+		};
+		streamController = controller;
+	} });
+	if (typeof document !== "undefined" && document.readyState === "loading") document.addEventListener("DOMContentLoaded", () => {
+		streamController?.close();
+	});
+	else streamController?.close();
+	return rscStream;
+}
+//#endregion
+export { getRSCStream };

package/dist/development/lib/rsc/html-stream/server.js

@@ -0,0 +1,78 @@
+/**
+ * react-router v8.0.0-pre.0
+ *
+ * Copyright (c) Remix Software Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE.md file in the root directory of this source tree.
+ *
+ * @license MIT
+ */
+//#region lib/rsc/html-stream/server.ts
+const encoder = new TextEncoder();
+const trailer = "</body></html>";
+function injectRSCPayload(rscStream) {
+	let decoder = new TextDecoder();
+	let resolveFlightDataPromise;
+	let flightDataPromise = new Promise((resolve) => resolveFlightDataPromise = resolve);
+	let startedRSC = false;
+	let buffered = [];
+	let timeout = null;
+	function flushBufferedChunks(controller) {
+		for (let chunk of buffered) {
+			let buf = decoder.decode(chunk, { stream: true });
+			if (buf.endsWith(trailer)) buf = buf.slice(0, -14);
+			controller.enqueue(encoder.encode(buf));
+		}
+		buffered.length = 0;
+		timeout = null;
+	}
+	return new TransformStream({
+		transform(chunk, controller) {
+			buffered.push(chunk);
+			if (timeout) return;
+			timeout = setTimeout(async () => {
+				flushBufferedChunks(controller);
+				if (!startedRSC) {
+					startedRSC = true;
+					writeRSCStream(rscStream, controller).catch((err) => controller.error(err)).then(resolveFlightDataPromise);
+				}
+			}, 0);
+		},
+		async flush(controller) {
+			await flightDataPromise;
+			if (timeout) {
+				clearTimeout(timeout);
+				flushBufferedChunks(controller);
+			}
+			controller.enqueue(encoder.encode("</body></html>"));
+		}
+	});
+}
+async function writeRSCStream(rscStream, controller) {
+	let decoder = new TextDecoder("utf-8", { fatal: true });
+	const reader = rscStream.getReader();
+	try {
+		let read;
+		while ((read = await reader.read()) && !read.done) {
+			const chunk = read.value;
+			try {
+				writeChunk(JSON.stringify(decoder.decode(chunk, { stream: true })), controller);
+			} catch (e) {
+				writeChunk(`Uint8Array.from(atob(${JSON.stringify(btoa(String.fromCodePoint(...chunk)))}), m => m.codePointAt(0))`, controller);
+			}
+		}
+	} finally {
+		reader.releaseLock();
+	}
+	let remaining = decoder.decode();
+	if (remaining.length) writeChunk(JSON.stringify(remaining), controller);
+}
+function writeChunk(chunk, controller) {
+	controller.enqueue(encoder.encode(`<script>${escapeScript(`(self.__FLIGHT_DATA||=[]).push(${chunk})`)}<\/script>`));
+}
+function escapeScript(script) {
+	return script.replace(/<!--/g, "<\\!--").replace(/<\/(script)/gi, "</\\$1");
+}
+//#endregion
+export { injectRSCPayload };

package/dist/development/lib/rsc/route-modules.js

@@ -0,0 +1,27 @@
+/**
+ * react-router v8.0.0-pre.0
+ *
+ * Copyright (c) Remix Software Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE.md file in the root directory of this source tree.
+ *
+ * @license MIT
+ */
+//#region lib/rsc/route-modules.ts
+function createRSCRouteModules(payload) {
+	const routeModules = {};
+	for (const match of payload.matches) populateRSCRouteModules(routeModules, match);
+	return routeModules;
+}
+function populateRSCRouteModules(routeModules, matches) {
+	matches = Array.isArray(matches) ? matches : [matches];
+	for (const match of matches) routeModules[match.id] = {
+		links: match.links,
+		meta: match.meta,
+		default: noopComponent
+	};
+}
+const noopComponent = () => null;
+//#endregion
+export { createRSCRouteModules, populateRSCRouteModules };

package/dist/development/lib/rsc/server.rsc.d.ts

@@ -0,0 +1,219 @@
+
+import { Location } from "../router/history.js";
+import { ActionFunction, LoaderFunction, Params, RouterContextProvider, ShouldRevalidateFunction } from "../router/utils.js";
+import { ClientActionFunction, ClientLoaderFunction, HeadersFunction, LinksFunction, MetaFunction } from "../dom/ssr/routeModules.js";
+import * as React$1 from "react";
+
+//#region lib/rsc/server.rsc.d.ts
+declare function getRequest(): Request;
+type RSCRouteConfigEntryBase = {
+  action?: ActionFunction;
+  clientAction?: ClientActionFunction;
+  clientLoader?: ClientLoaderFunction;
+  ErrorBoundary?: React$1.ComponentType<any>;
+  handle?: any;
+  headers?: HeadersFunction;
+  HydrateFallback?: React$1.ComponentType<any>;
+  Layout?: React$1.ComponentType<any>;
+  links?: LinksFunction;
+  loader?: LoaderFunction;
+  meta?: MetaFunction;
+  shouldRevalidate?: ShouldRevalidateFunction;
+};
+type RSCRouteConfigEntry = RSCRouteConfigEntryBase & {
+  id: string;
+  path?: string;
+  Component?: React$1.ComponentType<any>;
+  lazy?: () => Promise<RSCRouteConfigEntryBase & ({
+    default?: React$1.ComponentType<any>;
+    Component?: never;
+  } | {
+    default?: never;
+    Component?: React$1.ComponentType<any>;
+  })>;
+} & ({
+  index: true;
+} | {
+  children?: RSCRouteConfigEntry[];
+});
+type RSCRouteConfig = Array<RSCRouteConfigEntry>;
+type RSCRouteManifest = {
+  clientAction?: ClientActionFunction;
+  clientLoader?: ClientLoaderFunction;
+  element?: React$1.ReactElement | false;
+  errorElement?: React$1.ReactElement;
+  handle?: any;
+  hasAction: boolean;
+  hasComponent: boolean;
+  hasLoader: boolean;
+  hydrateFallbackElement?: React$1.ReactElement;
+  id: string;
+  index?: boolean;
+  links?: LinksFunction;
+  meta?: MetaFunction;
+  parentId?: string;
+  path?: string;
+  shouldRevalidate?: ShouldRevalidateFunction;
+};
+type RSCRouteMatch = RSCRouteManifest & {
+  params: Params;
+  pathname: string;
+  pathnameBase: string;
+};
+type RSCRenderPayload = {
+  type: "render";
+  actionData: Record<string, any> | null;
+  basename: string | undefined;
+  errors: Record<string, any> | null;
+  loaderData: Record<string, any>;
+  location: Location;
+  routeDiscovery: RouteDiscovery;
+  matches: RSCRouteMatch[];
+  patches?: Promise<RSCRouteManifest[]>;
+  nonce?: string;
+  formState?: unknown;
+};
+type RSCManifestPayload = {
+  type: "manifest";
+  patches: Promise<RSCRouteManifest[]>;
+};
+type RSCActionPayload = {
+  type: "action";
+  actionResult: Promise<unknown>;
+  rerender?: Promise<RSCRenderPayload | RSCRedirectPayload>;
+};
+type RSCRedirectPayload = {
+  type: "redirect";
+  status: number;
+  location: string;
+  replace: boolean;
+  reload: boolean;
+  actionResult?: Promise<unknown>;
+};
+type RSCPayload = RSCRenderPayload | RSCManifestPayload | RSCActionPayload | RSCRedirectPayload;
+type RSCMatch = {
+  statusCode: number;
+  headers: Headers;
+  payload: RSCPayload;
+};
+type DecodeActionFunction = (formData: FormData) => Promise<() => Promise<unknown>>;
+type DecodeFormStateFunction = (result: unknown, formData: FormData) => unknown;
+type DecodeReplyFunction = (reply: FormData | string, options: {
+  temporaryReferences: unknown;
+}) => Promise<unknown[]>;
+type LoadServerActionFunction = (id: string) => Promise<Function>;
+type RouteDiscovery = {
+  mode: "lazy";
+  manifestPath?: string | undefined;
+} | {
+  mode: "initial";
+};
+/**
+ * Matches the given routes to a [`Request`](https://developer.mozilla.org/en-US/docs/Web/API/Request)
+ * and returns an [RSC](https://react.dev/reference/rsc/server-components)
+ * [`Response`](https://developer.mozilla.org/en-US/docs/Web/API/Response)
+ * encoding an {@link unstable_RSCPayload} for consumption by an [RSC](https://react.dev/reference/rsc/server-components)
+ * enabled client router.
+ *
+ * @example
+ * import {
+ *   createTemporaryReferenceSet,
+ *   decodeAction,
+ *   decodeReply,
+ *   loadServerAction,
+ *   renderToReadableStream,
+ * } from "@vitejs/plugin-rsc/rsc";
+ * import { unstable_matchRSCServerRequest as matchRSCServerRequest } from "react-router";
+ *
+ * matchRSCServerRequest({
+ *   createTemporaryReferenceSet,
+ *   decodeAction,
+ *   decodeFormState,
+ *   decodeReply,
+ *   loadServerAction,
+ *   request,
+ *   routes: routes(),
+ *   generateResponse(match) {
+ *     return new Response(
+ *       renderToReadableStream(match.payload),
+ *       {
+ *         status: match.statusCode,
+ *         headers: match.headers,
+ *       }
+ *     );
+ *   },
+ * });
+ *
+ * @name unstable_matchRSCServerRequest
+ * @public
+ * @category RSC
+ * @mode data
+ * @param opts Options
+ * @param opts.allowedActionOrigins Origin patterns that are allowed to execute actions.
+ * @param opts.basename The basename to use when matching the request.
+ * @param opts.createTemporaryReferenceSet A function that returns a temporary
+ * reference set for the request, used to track temporary references in the [RSC](https://react.dev/reference/rsc/server-components)
+ * stream.
+ * @param opts.decodeAction Your `react-server-dom-xyz/server`'s `decodeAction`
+ * function, responsible for loading a server action.
+ * @param opts.decodeFormState A function responsible for decoding form state for
+ * progressively enhanceable forms with React's [`useActionState`](https://react.dev/reference/react/useActionState)
+ * using your `react-server-dom-xyz/server`'s `decodeFormState`.
+ * @param opts.decodeReply Your `react-server-dom-xyz/server`'s `decodeReply`
+ * function, used to decode the server function's arguments and bind them to the
+ * implementation for invocation by the router.
+ * @param opts.generateResponse A function responsible for using your
+ * `renderToReadableStream` to generate a [`Response`](https://developer.mozilla.org/en-US/docs/Web/API/Response)
+ * encoding the {@link unstable_RSCPayload}.
+ * @param opts.loadServerAction Your `react-server-dom-xyz/server`'s
+ * `loadServerAction` function, used to load a server action by ID.
+ * @param opts.onError An optional error handler that will be called with any
+ * errors that occur during the request processing.
+ * @param opts.request The [`Request`](https://developer.mozilla.org/en-US/docs/Web/API/Request)
+ * to match against.
+ * @param opts.requestContext An instance of {@link RouterContextProvider}
+ * that should be created per request, to be passed to [`action`](../../start/data/route-object#action)s,
+ * [`loader`](../../start/data/route-object#loader)s and [middleware](../../how-to/middleware).
+ * @param opts.routeDiscovery The route discovery configuration, used to determine how the router should discover new routes during navigations.
+ * @param opts.routes Your {@link unstable_RSCRouteConfigEntry | route definitions}.
+ * @returns A [`Response`](https://developer.mozilla.org/en-US/docs/Web/API/Response)
+ * that contains the [RSC](https://react.dev/reference/rsc/server-components)
+ * data for hydration.
+ */
+declare function matchRSCServerRequest({
+  allowedActionOrigins,
+  createTemporaryReferenceSet,
+  basename,
+  decodeReply,
+  requestContext,
+  routeDiscovery,
+  loadServerAction,
+  decodeAction,
+  decodeFormState,
+  onError,
+  request,
+  routes,
+  generateResponse
+}: {
+  allowedActionOrigins?: string[];
+  createTemporaryReferenceSet: () => unknown;
+  basename?: string;
+  decodeReply?: DecodeReplyFunction;
+  decodeAction?: DecodeActionFunction;
+  decodeFormState?: DecodeFormStateFunction;
+  requestContext?: RouterContextProvider;
+  loadServerAction?: LoadServerActionFunction;
+  onError?: (error: unknown) => void;
+  request: Request;
+  routes: RSCRouteConfigEntry[];
+  routeDiscovery?: RouteDiscovery;
+  generateResponse: (match: RSCMatch, {
+    onError,
+    temporaryReferences
+  }: {
+    onError(error: unknown): string | undefined;
+    temporaryReferences: unknown;
+  }) => Response;
+}): Promise<Response>;
+//#endregion
+export { DecodeActionFunction, DecodeFormStateFunction, DecodeReplyFunction, LoadServerActionFunction, RSCManifestPayload, RSCMatch, RSCPayload, RSCRenderPayload, RSCRouteConfig, RSCRouteConfigEntry, RSCRouteManifest, RSCRouteMatch, getRequest, matchRSCServerRequest };

package/dist/development/lib/rsc/server.ssr.d.ts

@@ -0,0 +1,129 @@
+
+import { RSCPayload } from "./server.rsc.js";
+import * as React$1 from "react";
+
+//#region lib/rsc/server.ssr.d.ts
+type DecodedPayload = Promise<RSCPayload> & {
+  _deepestRenderedBoundaryId?: string | null;
+  formState: Promise<any>;
+};
+type SSRCreateFromReadableStreamFunction = (body: ReadableStream<Uint8Array>) => Promise<unknown>;
+/**
+ * Routes the incoming [`Request`](https://developer.mozilla.org/en-US/docs/Web/API/Request)
+ * to the [RSC](https://react.dev/reference/rsc/server-components) server and
+ * appropriately proxies the server response for data / resource requests, or
+ * renders to HTML for a document request.
+ *
+ * @example
+ * import { createFromReadableStream } from "@vitejs/plugin-rsc/ssr";
+ * import * as ReactDomServer from "react-dom/server.edge";
+ * import {
+ *   unstable_RSCStaticRouter as RSCStaticRouter,
+ *   unstable_routeRSCServerRequest as routeRSCServerRequest,
+ * } from "react-router";
+ *
+ * routeRSCServerRequest({
+ *   request,
+ *   serverResponse,
+ *   createFromReadableStream,
+ *   async renderHTML(getPayload) {
+ *     const payload = getPayload();
+ *
+ *     return await renderHTMLToReadableStream(
+ *       <RSCStaticRouter getPayload={getPayload} />,
+ *       {
+ *         bootstrapScriptContent,
+ *         formState: await payload.formState,
+ *       }
+ *     );
+ *   },
+ * });
+ *
+ * @name unstable_routeRSCServerRequest
+ * @public
+ * @category RSC
+ * @mode data
+ * @param opts Options
+ * @param opts.createFromReadableStream Your `react-server-dom-xyz/client`'s
+ * `createFromReadableStream` function, used to decode payloads from the server.
+ * @param opts.serverResponse A Response or partial response generated by the [RSC](https://react.dev/reference/rsc/server-components) handler containing a serialized {@link unstable_RSCPayload}.
+ * @param opts.hydrate Whether to hydrate the server response with the RSC payload.
+ * Defaults to `true`.
+ * @param opts.renderHTML A function that renders the {@link unstable_RSCPayload} to
+ * HTML, usually using a {@link unstable_RSCStaticRouter | `<RSCStaticRouter>`}.
+ * @param opts.request The request to route.
+ * @returns A [`Response`](https://developer.mozilla.org/en-US/docs/Web/API/Response)
+ * that either contains the [RSC](https://react.dev/reference/rsc/server-components)
+ * payload for data requests, or renders the HTML for document requests.
+ */
+declare function routeRSCServerRequest({
+  request,
+  serverResponse,
+  createFromReadableStream,
+  renderHTML,
+  hydrate
+}: {
+  request: Request;
+  serverResponse: Response;
+  createFromReadableStream: SSRCreateFromReadableStreamFunction;
+  renderHTML: (getPayload: () => DecodedPayload, options: {
+    onError(error: unknown): string | undefined;
+    onHeaders(headers: Headers): void;
+  }) => ReadableStream<Uint8Array> | Promise<ReadableStream<Uint8Array>>;
+  hydrate?: boolean;
+}): Promise<Response>;
+/**
+ * Props for the {@link unstable_RSCStaticRouter} component.
+ *
+ * @name unstable_RSCStaticRouterProps
+ * @category Types
+ */
+interface RSCStaticRouterProps {
+  /**
+   * A function that starts decoding of the {@link unstable_RSCPayload}. Usually passed
+   * through from {@link unstable_routeRSCServerRequest}'s `renderHTML`.
+   */
+  getPayload: () => DecodedPayload;
+}
+/**
+ * Pre-renders an {@link unstable_RSCPayload} to HTML. Usually used in
+ * {@link unstable_routeRSCServerRequest}'s `renderHTML` callback.
+ *
+ * @example
+ * import { createFromReadableStream } from "@vitejs/plugin-rsc/ssr";
+ * import * as ReactDomServer from "react-dom/server.edge";
+ * import {
+ *   unstable_RSCStaticRouter as RSCStaticRouter,
+ *   unstable_routeRSCServerRequest as routeRSCServerRequest,
+ * } from "react-router";
+ *
+ * routeRSCServerRequest({
+ *   request,
+ *   serverResponse,
+ *   createFromReadableStream,
+ *   async renderHTML(getPayload) {
+ *     const payload = getPayload();
+ *
+ *     return await renderHTMLToReadableStream(
+ *       <RSCStaticRouter getPayload={getPayload} />,
+ *       {
+ *         bootstrapScriptContent,
+ *         formState: await payload.formState,
+ *       }
+ *     );
+ *   },
+ * });
+ *
+ * @name unstable_RSCStaticRouter
+ * @public
+ * @category RSC
+ * @mode data
+ * @param props Props
+ * @param {unstable_RSCStaticRouterProps.getPayload} props.getPayload n/a
+ * @returns A React component that renders the {@link unstable_RSCPayload} as HTML.
+ */
+declare function RSCStaticRouter({
+  getPayload
+}: RSCStaticRouterProps): React$1.JSX.Element | null;
+//#endregion
+export { RSCStaticRouter, RSCStaticRouterProps, SSRCreateFromReadableStreamFunction, routeRSCServerRequest };