rwsdk/dist/runtime/client/client.d.ts

Build fast, server-driven webapps on Cloudflare with SSR, RSC, and realtime

import "./setWebpackRequire";
export { default as React } from "react";
export type { Dispatch, MutableRefObject, SetStateAction } from "react";
export { ClientOnly } from "./ClientOnly.js";
export { initClientNavigation, navigate } from "./navigation.js";
export type { ActionResponseData } from "./types";
import type { ActionResponseData, HydrationOptions, Transport } from "./types";
export declare const fetchTransport: Transport;
/**
 * Initializes the React client and hydrates the RSC payload.
 *
 * This function sets up client-side hydration for React Server Components,
 * making the page interactive. Call this from your client entry point.
 *
 * @param transport - Custom transport for server communication (defaults to fetchTransport)
 * @param hydrateRootOptions - Options passed to React's `hydrateRoot`. Supports all React hydration options including:
 *                             - `onUncaughtError`: Handler for uncaught errors (async errors, event handler errors).
 *                               If not provided, defaults to logging errors to console.
 *                             - `onCaughtError`: Handler for errors caught by error boundaries
 *                             - `onRecoverableError`: Handler for recoverable errors
 * @param handleResponse - Custom response handler for navigation errors (navigation GETs)
 * @param onHydrationUpdate - Callback invoked after a new RSC payload has been committed on the client
 * @param onActionResponse - Optional hook invoked when an action returns a Response;
 *                           return true to signal that the response has been handled and
 *                           default behaviour (e.g. redirects) should be skipped
 *
 * @example
 * // Basic usage
 * import { initClient } from "rwsdk/client";
 *
 * initClient();
 *
 * @example
 * // With client-side navigation
 * import { initClient, initClientNavigation } from "rwsdk/client";
 *
 * const { handleResponse } = initClientNavigation();
 * initClient({ handleResponse });
 *
 * @example
 * // With error handling
 * initClient({
 *   hydrateRootOptions: {
 *     onUncaughtError: (error, errorInfo) => {
 *       console.error("Uncaught error:", error);
 *       // Send to monitoring service
 *       sendToSentry(error, errorInfo);
 *     },
 *     onCaughtError: (error, errorInfo) => {
 *       console.error("Caught error:", error);
 *       // Handle errors from error boundaries
 *       sendToSentry(error, errorInfo);
 *     },
 *   },
 * });
 *
 * @example
 * // With custom React hydration options
 * initClient({
 *   hydrateRootOptions: {
 *     onRecoverableError: (error) => {
 *       console.warn("Recoverable error:", error);
 *     },
 *   },
 * });
 */
export declare const initClient: ({ transport, hydrateRootOptions, handleResponse, onHydrationUpdate, onActionResponse, }?: {
    transport?: Transport;
    hydrateRootOptions?: HydrationOptions;
    handleResponse?: (response: Response) => boolean;
    onHydrationUpdate?: () => void;
    onActionResponse?: (actionResponse: ActionResponseData) => boolean | void;
}) => Promise<void>;