@kasperrt/smolter 0.4.2 → 0.4.4

package/dist/preact/route-types.d.ts

@@ -1,20 +1,28 @@
 import type { DataArgs, RevalidationArgs, Route, Snapshot } from "../core/index.ts";
 import type { DataResponse } from "../core/responses.ts";
 import type { ComponentType, ReactNode } from "preact/compat";
+/** Request, route parameters and cancellation signal supplied to a loader. */
 export interface LoaderFunctionArgs extends DataArgs {
     context?: unknown;
 }
+/** Request, route parameters and cancellation signal supplied to an action. */
 export type ActionFunctionArgs = LoaderFunctionArgs;
+/** Loader arguments with a serverLoader callback for the server transport. */
 export interface ClientLoaderFunctionArgs extends LoaderFunctionArgs {
     serverLoader: <T = unknown>() => Promise<T>;
 }
+/** Action arguments with a serverAction callback for the server transport. */
 export interface ClientActionFunctionArgs extends LoaderFunctionArgs {
     serverAction: <T = unknown>() => Promise<T>;
 }
+/** Navigation or mutation context used to decide whether loader data should refresh. */
 export type ShouldRevalidateFunctionArgs = RevalidationArgs;
 type UnwrapData<T> = T extends DataResponse<infer V> ? V : T;
+/** Infer successful loader data, unwrapping promises and data responses. */
 export type RouteData<T> = T extends (...args: never[]) => infer R ? UnwrapData<Exclude<Awaited<R>, Response | Error>> : T;
+/** A document metadata descriptor, such as a title, meta tag or structured-data record. */
 export type MetaDescriptor = Record<string, unknown>;
+/** Loader data, error, parameters and location supplied to a route metadata function. */
 export interface MetaArgs<T> {
     data: RouteData<T> | undefined;
     loaderData: RouteData<T> | undefined;
@@ -22,8 +30,11 @@ export interface MetaArgs<T> {
     params: Record<string, string>;
     location: URL;
 }
+/** Derive document metadata descriptors from the current route data and location. */
 export type MetaFunction<T = unknown> = (args: MetaArgs<T>) => MetaDescriptor[];
+/** Return link descriptors rendered in the document head. */
 export type LinksFunction = () => Record<string, string>[];
+/** Data route with optional lazy component, preload and document metadata integration. */
 export interface AppRoute extends Route {
     resolveComponent?: () => ComponentType | undefined;
     preload?: () => Promise<void>;
@@ -31,6 +42,7 @@ export interface AppRoute extends Route {
     routePath?: string;
     meta?: MetaFunction;
 }
+/** Root document components, loader, metadata and revalidation policy for a Preact application. */
 export interface RootModule {
     /** Route identity used by targeted revalidation. Defaults to root. */
     id?: string;
@@ -46,10 +58,12 @@ export interface RootModule {
     meta?: MetaFunction;
     shouldRevalidate?: (args: RevalidationArgs) => boolean;
 }
+/** Serialized root data and route snapshot used to hydrate without repeating initial loaders. */
 export interface Hydration {
     rootError?: boolean;
     root: unknown;
     snapshot: Snapshot;
 }
+/** Transform a data transport response using the current request context. */
 export type HandleDataRequestFunction = (response: Response, args: LoaderFunctionArgs) => Response | Promise<Response>;
 export {};

package/dist/preact/router.d.ts

@@ -2,15 +2,18 @@
 import type { ReactNode } from "preact/compat";
 import { type ApplicationContext } from "./root-context.ts";
 import { createRootStore } from "./root-data.ts";
-import type { AppRoute } from "./route-types.ts";
+/** Optional children and context shared with descendants through useOutletContext. */
 export interface OutletProps {
     context?: unknown;
     children?: ReactNode;
 }
+/** Render supplied children or the active route, and provide outlet context to descendants. */
 export declare function Outlet({ context, children, }: OutletProps): import("preact").JSX.Element;
+/** Root data, document components and request-scoped router for an application. */
 export interface ApplicationProps extends ApplicationContext {
     document?: boolean;
     rootStore?: ReturnType<typeof createRootStore>;
 }
+/** Render a Preact root document and active route with shared root data and application context. */
 export declare function RouterApplication(props: ApplicationProps): import("preact").JSX.Element;
-export declare function prepareRoutes(routes: AppRoute[], preserveDeferred?: boolean): AppRoute[];
+export { prepareRoutes } from "../core/prepare-routes.ts";

package/dist/preact/router.js

@@ -1,11 +1,12 @@
-import { normalizeResult } from "../core/responses.js";
+import { createStore } from "../core/store.js";
 import { useContext, useMemo, useSyncExternalStore } from "./runtime.js";
 import { Application, OutletContext } from "./root-context.js";
 import { RouterProvider } from "./context.js";
-import { createStore } from "../core/store.js";
 import { Routes } from "./routes.js";
+import { prepareRoutes } from "../core/prepare-routes.js";
 import { jsx } from "preact/jsx-runtime";
 //#region .generated/preact/router.tsx
+/** Render supplied children or the active route, and provide outlet context to descendants. */
 function Outlet({ context, children }) {
 	const current = useContext(OutletContext);
 	return /* @__PURE__ */ jsx(OutletContext, {
@@ -16,6 +17,7 @@ function Outlet({ context, children }) {
 		}) })
 	});
 }
+/** Render a Preact root document and active route with shared root data and application context. */
 function RouterApplication(props) {
 	const rootStore = useMemo(() => props.rootStore ?? createStore(props.root), [props.rootStore, props.root]);
 	const root = useSyncExternalStore(rootStore.subscribe, rootStore.getSnapshot);
@@ -35,29 +37,5 @@ function RouterApplication(props) {
 		})
 	});
 }
-function prepareRoutes(routes, preserveDeferred = false) {
-	return routes.map((route) => {
-		const wrapped = {
-			...route,
-			path: route.routePath ?? route.path,
-			shouldRevalidate: (args) => {
-				const { currentUrl, nextUrl } = args;
-				if (args.reason === "navigation" && currentUrl.pathname === nextUrl.pathname && currentUrl.search === nextUrl.search && currentUrl.hash !== nextUrl.hash) return false;
-				return route.shouldRevalidate?.(args) ?? args.defaultShouldRevalidate;
-			}
-		};
-		for (const key of [
-			"loader",
-			"action",
-			"clientLoader",
-			"clientAction"
-		]) {
-			const handler = route[key];
-			if (!handler) continue;
-			wrapped[key] = (args) => Promise.resolve().then(() => handler(args)).then((value) => normalizeResult(value, !preserveDeferred), (error) => normalizeResult(error, !preserveDeferred));
-		}
-		return wrapped;
-	});
-}
 //#endregion
 export { Outlet, RouterApplication, prepareRoutes };

package/dist/react/client.d.ts

@@ -0,0 +1,20 @@
+/**
+ * React document hydration, browser history and deployment recovery.
+ *
+ * @module
+ */
+/** @jsxImportSource react */
+import { type DeploymentOptions } from "../client/index.ts";
+import { type Router } from "../core/index.ts";
+import type { AppRoute, RootModule } from "./route-types.ts";
+export * from "../client/index.ts";
+export { configureApplication } from "../core/environment.ts";
+/** Browser hydration settings for hash history, deployment recovery and deferred-data timeout. */
+export interface MountApplicationOptions {
+    hash?: boolean;
+    deployment?: DeploymentOptions | null;
+    /** Total initial deferred-data budget in integer milliseconds; not an inactivity timeout. Defaults to 30,000. */
+    deferredTimeout?: number;
+}
+/** Create the browser application router and hydrate the document, installing recovery before initial lazy loading. */
+export declare function mountApplication(routes: AppRoute[], rootModule?: RootModule, options?: boolean | MountApplicationOptions): Promise<Router>;

package/dist/react/client.js

@@ -0,0 +1,86 @@
+import { matchRoutes } from "../core/match.js";
+import { createDataRouter } from "../core/router.js";
+import { configureApplication } from "../core/environment.js";
+import { retainRoute } from "../core/presentation.js";
+import { connectNavigation } from "../core/navigation.js";
+import { RouterApplication } from "./router.js";
+import { attachRootData } from "../client/root-data.js";
+import { prepareRoutes } from "../core/prepare-routes.js";
+import { deserialize } from "../client/deserialize.js";
+import { recoverDeployment, watchDeployment } from "../client/deployment.js";
+import { serverRoute } from "../client/index.js";
+import { connectHashHistory } from "../client/hash-history.js";
+import { readHydration } from "../client/hydration.js";
+import { flushSync } from "react-dom";
+import { createRoot, hydrateRoot } from "react-dom/client";
+import { jsx } from "react/jsx-runtime";
+//#region .generated/react/client.tsx
+/**
+* React document hydration, browser history and deployment recovery.
+*
+* @module
+*/
+/** @jsxImportSource react */
+/** Create the browser application router and hydrate the document, installing recovery before initial lazy loading. */
+async function mountApplication(routes, rootModule, options = false) {
+	const { hash = false, deployment = null, deferredTimeout } = typeof options === "boolean" ? { hash: options } : options;
+	const initialURL = new URL(hash ? location.hash.slice(1) || "/" : location.href, location.origin);
+	await (matchRoutes(routes, initialURL.pathname)?.route)?.preload?.().catch(async (error) => {
+		await recoverDeployment(deployment, initialURL);
+		throw error;
+	});
+	routes = prepareRoutes(routes);
+	const element = document.getElementById("smolter-data");
+	const initial = element?.textContent ? readHydration(element.textContent, deferredTimeout) : void 0;
+	const hydration = initial?.hydration;
+	if (hydration?.snapshot.error) hydration.snapshot.error = Object.assign(new Error(hydration.snapshot.error.message), hydration.snapshot.error);
+	const router = createDataRouter(routes, {
+		browser: !hash,
+		url: hash ? new URL(location.hash.slice(1) || "/", location.origin).href : location.href,
+		...hydration && { hydrationData: hydration.snapshot }
+	});
+	const dispose = router.dispose;
+	router.dispose = () => {
+		initial?.dispose();
+		dispose();
+	};
+	watchDeployment(router, deployment);
+	if (hash) connectHashHistory(router);
+	retainRoute(router, flushSync);
+	connectNavigation(router);
+	const rootStore = attachRootData(router, hydration?.root, rootModule);
+	const props = {
+		routes,
+		router,
+		root: hydration?.root,
+		rootModule,
+		rootStore,
+		rootError: hydration?.rootError,
+		initialData: element?.textContent ?? void 0
+	};
+	if (hydration) {
+		const mounted = hydrateRoot(document, /* @__PURE__ */ jsx(RouterApplication, {
+			...props,
+			document: true
+		}));
+		const cleanup = router.dispose;
+		router.dispose = () => {
+			mounted.unmount();
+			cleanup();
+		};
+		return router;
+	}
+	const target = document.getElementById("root");
+	if (target) {
+		const mounted = createRoot(target);
+		mounted.render(/* @__PURE__ */ jsx(RouterApplication, { ...props }));
+		const cleanup = router.dispose;
+		router.dispose = () => {
+			mounted.unmount();
+			cleanup();
+		};
+	}
+	return router;
+}
+//#endregion
+export { configureApplication, deserialize, mountApplication, recoverDeployment, serverRoute, watchDeployment };

package/dist/react/document.d.ts

@@ -0,0 +1,25 @@
+/**
+ * React document metadata, resource links and hydration scripts.
+ *
+ * @module
+ */
+/** @jsxImportSource react */
+import type { ComponentProps } from "react";
+/** Render root or active-route metadata in the document head. */
+export declare function Meta(): import("react").ReactElement;
+/** Render stylesheet and other link descriptors from the application root. */
+export declare function Links(): import("react").ReactElement;
+/** Nonce and browser entry options for the document hydration scripts. */
+export interface ScriptProps {
+    nonce?: string;
+}
+/** Render the hydration snapshot and browser entry script with an optional CSP nonce. */
+export declare function Scripts({ nonce }: ScriptProps): import("react").ReactElement;
+/** Reset scroll after navigation unless the navigation requests preservation. */
+export declare function ScrollRestoration(_props: ScriptProps): null;
+/** HTML attributes for server markup and client document reconciliation. */
+export interface DocumentProps extends ComponentProps<"html"> {
+    "data-debug"?: boolean;
+}
+/** Render the server document and preserve client-managed theme classes on hydration. */
+export declare function Document(props: DocumentProps): import("react").ReactElement;

package/dist/react/document.js

@@ -0,0 +1,169 @@
+import { serializeData } from "../core/serialize.js";
+import { useSnapshot } from "./context.js";
+import { applicationEnvironment } from "../core/environment.js";
+import { scrollPositions } from "../core/navigation.js";
+import { useNavigationSnapshot } from "./navigation-state.js";
+import { useApplication } from "./root-context.js";
+import { Fragment, createElement, useEffect, useLayoutEffect, useRef, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region .generated/react/document.tsx
+/**
+* React document metadata, resource links and hydration scripts.
+*
+* @module
+*/
+/** @jsxImportSource react */
+function renderMeta(item, index) {
+	if (typeof item.title === "string") return /* @__PURE__ */ jsx("title", { children: item.title }, index);
+	if ("script:ld+json" in item) return /* @__PURE__ */ jsx("script", {
+		type: "application/ld+json",
+		dangerouslySetInnerHTML: { __html: serializeData(item["script:ld+json"]) }
+	}, index);
+	const { tagName, ...props } = item;
+	return createElement(tagName === "link" ? "link" : "meta", {
+		...props,
+		key: index
+	});
+}
+/** Render root or active-route metadata in the document head. */
+function Meta() {
+	const { routes, rootModule } = useApplication();
+	const snapshot = useSnapshot();
+	const route = routes.find((item) => item.path === snapshot.path);
+	const args = {
+		loaderData: snapshot.data,
+		data: snapshot.data,
+		params: snapshot.params,
+		error: snapshot.error,
+		location: new URL(snapshot.url)
+	};
+	const values = route?.meta?.(args) ?? rootModule?.meta?.(args) ?? [];
+	useEffect(() => {
+		const title = values.find((item) => typeof item.title === "string")?.title;
+		if (typeof title === "string") document.title = title;
+	}, [values]);
+	return /* @__PURE__ */ jsx(Fragment, { children: values.map(renderMeta) });
+}
+/** Render stylesheet and other link descriptors from the application root. */
+function Links() {
+	const { rootModule } = useApplication();
+	return /* @__PURE__ */ jsx(Fragment, { children: rootModule?.links?.().map((props, index) => /* @__PURE__ */ jsx("link", { ...props }, index)) });
+}
+/** Render the hydration snapshot and browser entry script with an optional CSP nonce. */
+function Scripts({ nonce }) {
+	const { root, rootError, router, entry, streaming, initialData } = useApplication();
+	const [json] = useState(() => {
+		if (initialData !== void 0) return initialData;
+		if (streaming) return "";
+		const current = router.getSnapshot();
+		const snapshot = {
+			...current,
+			error: current.error && {
+				...current.error,
+				name: current.error.name,
+				message: current.error.message
+			}
+		};
+		return serializeData({
+			root,
+			snapshot,
+			...rootError && { rootError }
+		});
+	});
+	return /* @__PURE__ */ jsxs(Fragment, { children: [
+		/* @__PURE__ */ jsx("script", {
+			...nonce && { nonce },
+			dangerouslySetInnerHTML: { __html: applicationEnvironment?.entryScript ?? "" }
+		}),
+		/* @__PURE__ */ jsx("script", {
+			id: "smolter-data",
+			type: "application/json",
+			...nonce && { nonce },
+			dangerouslySetInnerHTML: { __html: json }
+		}),
+		entry && /* @__PURE__ */ jsx("script", {
+			type: "module",
+			async: initialData !== void 0,
+			src: entry,
+			...nonce && { nonce }
+		})
+	] });
+}
+/** Reset scroll after navigation unless the navigation requests preservation. */
+function ScrollRestoration(_props) {
+	const { router } = useApplication();
+	const { url, state } = useSnapshot();
+	const navigation = useNavigationSnapshot(router);
+	const positions = scrollPositions(router);
+	const restoredLocation = useRef("");
+	useEffect(() => {
+		const previous = history.scrollRestoration;
+		history.scrollRestoration = "manual";
+		return () => {
+			history.scrollRestoration = previous;
+		};
+	}, []);
+	useLayoutEffect(() => {
+		if (state !== "idle") return;
+		if ((history.state?.key ?? "initial") !== navigation.key) return;
+		const locationKey = `${navigation.key}:${url}`;
+		if (restoredLocation.current === locationKey) return;
+		const frame = requestAnimationFrame(() => {
+			restoredLocation.current = locationKey;
+			const target = new URL(location.href);
+			const saved = navigation.type === "POP" && positions.get(navigation.key);
+			if (!saved && target.hash) {
+				document.getElementById(target.hash.slice(1))?.scrollIntoView();
+				return;
+			}
+			if (!saved && navigation.preventScrollReset) return;
+			const [left, top] = saved || [0, 0];
+			window.scrollTo({
+				left,
+				top,
+				behavior: "instant"
+			});
+		});
+		return () => cancelAnimationFrame(frame);
+	}, [
+		url,
+		state,
+		positions,
+		navigation.key,
+		navigation.type,
+		navigation.preventScrollReset
+	]);
+	return null;
+}
+/** Render the server document and preserve client-managed theme classes on hydration. */
+function Document(props) {
+	const { children, ...attributes } = props;
+	const className = String(props.className ?? "");
+	const previousClassName = useRef(className);
+	const lang = String(props.lang ?? "en");
+	const debug = String(props["data-debug"] ?? false);
+	useEffect(() => {
+		if (previousClassName.current !== className) {
+			const previous = previousClassName.current.split(/\s+/).filter(Boolean);
+			const next = className.split(/\s+/).filter(Boolean);
+			document.documentElement.classList.remove(...previous);
+			document.documentElement.classList.add(...next);
+			previousClassName.current = className;
+		}
+		document.documentElement.lang = lang;
+		document.documentElement.dataset.debug = debug;
+	}, [
+		className,
+		lang,
+		debug
+	]);
+	const classes = typeof document !== "undefined" && previousClassName.current !== className ? [...document.documentElement.classList].filter((value) => !previousClassName.current.split(/\s+/).includes(value)).concat(className.split(/\s+/).filter(Boolean)).join(" ") : props.className;
+	return /* @__PURE__ */ jsx("html", {
+		...attributes,
+		className: classes,
+		suppressHydrationWarning: true,
+		children
+	});
+}
+//#endregion
+export { Document, Links, Meta, Scripts, ScrollRestoration };

package/dist/react/fetcher.d.ts

@@ -2,11 +2,13 @@
  * React components and typed data hooks. Import from @kasperrt/smolter/react.
  * @module
  */
-import { type AnyDataFunction, type DataFunction, type DataOf, type FetcherSnapshot, type Result, type Route as RouteDefinition, type RouteModule, type SubmitOptions } from "../core/index.ts";
+import { type AnyDataFunction, type DataFunction, type DataOf, type FetcherSnapshot, type Result, type Route as RouteDefinition, type RouteModule } from "../core/index.ts";
+import { type Submission, type SubmissionOptions } from "../core/submission.ts";
 import { type FormProps } from "./form.ts";
+import type { RouteData } from "./route-types.ts";
 import { type ComponentType } from "./runtime.ts";
 /** Action method and optional explicit route URL for a fetcher submission. */
-export interface FetcherSubmitOptions extends SubmitOptions {
+export interface FetcherSubmitOptions extends SubmissionOptions {
     action?: string;
 }
 /** Typed independent request state, methods, and a bound Form component. */
@@ -14,9 +16,11 @@ export interface TypedFetcher<T> extends Omit<FetcherSnapshot, "data"> {
     data?: T;
     Form: ComponentType<FormProps>;
     load: (url?: string) => Promise<Result>;
-    submit: (body: FormData, options?: FetcherSubmitOptions) => Promise<Result>;
+    submit: (body: Submission, options?: FetcherSubmitOptions) => Promise<Result>;
 }
 /** Create a fetcher for independent route reads and mutations; its data stays local. */
 export declare function useFetcher<T extends RouteModule>(route: RouteDefinition<T>): TypedFetcher<DataOf<Extract<T["action"] | T["clientAction"], AnyDataFunction>> | DataOf<Extract<T["loader"] | T["clientLoader"], AnyDataFunction>>>;
 /** Create a fetcher for independent route reads and mutations; its data stays local. */
-export declare function useFetcher<T extends AnyDataFunction = DataFunction>(): TypedFetcher<DataOf<T>>;
+export declare function useFetcher<T = DataFunction>(): TypedFetcher<RouteData<T>>;
+/** A fetcher with a bound form and inferred result data. */
+export type FetcherWithComponents<T> = TypedFetcher<RouteData<T>>;

package/dist/react/fetcher.js

@@ -1,3 +1,4 @@
+import { submissionBody, submissionSearch } from "../core/submission.js";
 import { createElement, useEffect, useMemo, useSyncExternalStore } from "./runtime.js";
 import { useRouter } from "./context.js";
 import { Form } from "./form.js";
@@ -20,7 +21,17 @@ function useFetcher(route) {
 				fetcher: store
 			}),
 			load: (url) => store.load(url ?? target()),
-			submit: (body, options) => store.submit(options?.action ?? target(), body, options)
+			submit: (body, options = {}) => {
+				const action = options.action ?? target();
+				const data = submissionBody(body, options.encType);
+				const method = options.method?.toUpperCase();
+				if (method === "GET") {
+					const url = new URL(action, router.getSnapshot().url);
+					url.search = submissionSearch(data);
+					return store.load(url.href);
+				}
+				return store.submit(action, data, { method });
+			}
 		};
 	}, [router, path]);
 	useEffect(() => fetcher.dispose, [fetcher]);

package/dist/react/form.js

@@ -1,6 +1,6 @@
+import { submitForm } from "../core/submission.js";
 import { createElement } from "./runtime.js";
 import { useRouter } from "./context.js";
-import { submitForm } from "../core/submission.js";
 //#region .generated/react/form.ts
 /** Submit form data to a registered route without a document reload. */
 function Form(options) {

package/dist/react/hooks.d.ts

@@ -2,19 +2,20 @@
  * React components and typed data hooks. Import from @kasperrt/smolter/react.
  * @module
  */
-import type { AnyDataFunction, DataOf, RouteModule, Router, Snapshot } from "../core/index.ts";
+import type { AnyDataFunction, RouteModule, Router, Snapshot } from "../core/index.ts";
+import type { RouteData } from "./route-types.ts";
 /** A route module or loader function used for data inference. */
 export type LoaderSource = RouteModule | AnyDataFunction;
 /** Infer server and client loader data from a route module or function. */
-export type LoaderData<T> = T extends AnyDataFunction ? DataOf<T> : T extends RouteModule ? DataOf<Extract<T["loader"] | T["clientLoader"], AnyDataFunction>> : unknown;
+export type LoaderData<T> = T extends AnyDataFunction ? RouteData<T> : T extends RouteModule ? RouteData<Extract<T["loader"] | T["clientLoader"], AnyDataFunction>> : RouteData<T>;
 /** Infer server and client action data from a route module or function. */
-export type ActionData<T> = T extends AnyDataFunction ? DataOf<T> : T extends RouteModule ? DataOf<Extract<T["action"] | T["clientAction"], AnyDataFunction>> : unknown;
+export type ActionData<T> = T extends AnyDataFunction ? RouteData<T> : T extends RouteModule ? RouteData<Extract<T["action"] | T["clientAction"], AnyDataFunction>> : RouteData<T>;
 /** Pass a route for inference, or use useLoaderData<typeof loader>() in its module. */
-export declare function useLoaderData<T extends LoaderSource = RouteModule>(route?: T): LoaderData<T> | undefined;
+export declare function useLoaderData<T = RouteModule>(route?: T & LoaderSource): LoaderData<T>;
 /** Read the last page action result, optionally inferring its type from a route. */
-export declare function useActionData<T extends LoaderSource = RouteModule>(route?: T): ActionData<T> | undefined;
+export declare function useActionData<T = RouteModule>(route?: T & LoaderSource): ActionData<T> | undefined;
 /** Read path parameters for the active route. */
-export declare function useParams(): Snapshot["params"];
+export declare function useParams<T extends Snapshot["params"] = Snapshot["params"]>(): T;
 /** Read the current path, search, and hash together with the navigate function. */
 export declare function useLocation(): readonly [string, Router["navigate"]];
 /** Get the function that revalidates the current loader subject to shouldRevalidate. */

package/dist/react/index.d.ts

@@ -1,9 +1,20 @@
-/** Framework components and typed data hooks. @module */
+/**
+ * React routing components, typed data hooks and forms.
+ *
+ * @module
+ */
 export type * from "../core/index.ts";
 export { createDataRouter, createRouter, defineRoute, } from "../core/index.ts";
+export type { ApplicationEnvironment } from "../core/environment.ts";
+export * from "../core/responses.ts";
+export { readSubmission, type Submission, type SubmissionOptions, } from "../core/submission.ts";
 export { RouterProvider, type RouterProviderProps, useRouter, } from "./context.ts";
 export * from "./fetcher.ts";
 export * from "./form.ts";
 export * from "./hooks.ts";
-export * from "./link.ts";
+export * from "./navigation.ts";
+export { Outlet, type OutletProps, useMatches, useOutletContext, } from "./outlet.ts";
+export { useNavigation, useRootData, useRouteError, useRouteLoaderData, useSubmit, } from "./route-hooks.ts";
+export * from "./route-types.ts";
+export { type ApplicationProps, RouterApplication } from "./router.ts";
 export * from "./routes.ts";

package/dist/react/index.js

@@ -1,10 +1,15 @@
 import { defineRoute } from "../core/match.js";
 import { createRouter } from "../core/navigation-router.js";
 import { createDataRouter } from "../core/router.js";
+import { data, isRouteErrorResponse, normalizeResult, redirect, resolveData } from "../core/responses.js";
+import { readSubmission } from "../core/submission.js";
 import { RouterProvider, useRouter } from "./context.js";
 import { Form } from "./form.js";
 import { useFetcher } from "./fetcher.js";
 import { useActionData, useLoaderData, useLocation, useParams, useRevalidator } from "./hooks.js";
-import { Link } from "./link.js";
+import { useNavigate, useNavigation, useNavigationType, useRootData, useRouteError, useRouteLoaderData, useSearchParams, useSubmit, useURLLocation } from "./route-hooks.js";
+import { Link, NavLink } from "./navigation.js";
 import { Routes } from "./routes.js";
-export { Form, Link, RouterProvider, Routes, createDataRouter, createRouter, defineRoute, useActionData, useFetcher, useLoaderData, useLocation, useParams, useRevalidator, useRouter };
+import { Outlet, useMatches, useOutletContext } from "./outlet.js";
+import { RouterApplication } from "./router.js";
+export { Form, Link, NavLink, Outlet, RouterApplication, RouterProvider, Routes, createDataRouter, createRouter, data, defineRoute, isRouteErrorResponse, normalizeResult, readSubmission, redirect, resolveData, useActionData, useFetcher, useLoaderData, useLocation, useMatches, useNavigate, useNavigation, useNavigationType, useOutletContext, useParams, useRevalidator, useRootData, useRouteError, useRouteLoaderData, useRouter, useSearchParams, useSubmit, useURLLocation };

package/dist/react/lazy-route.d.ts

@@ -0,0 +1,22 @@
+import type { RouteModule } from "../core/index.ts";
+import type { AppRoute } from "./route-types.ts";
+import { type ComponentType } from "./runtime.ts";
+/** Lazy route path, server transport endpoint and available handler capabilities. */
+export interface LazyRouteOptions {
+    path: string;
+    dataEndpoint?: string;
+    id?: string;
+    loader?: boolean;
+    action?: boolean;
+    clientAction?: boolean;
+    meta?: boolean;
+    shouldRevalidate?: boolean;
+    ErrorBoundary?: boolean;
+}
+type LoadedRoute = RouteModule & Pick<AppRoute, "meta">;
+interface LazyAppRoute extends AppRoute {
+    resolveComponent: () => ComponentType | undefined;
+}
+/** Create a route that imports its module on demand and shares the import with intent prefetching. */
+export declare function lazyRoute(options: LazyRouteOptions, importer: () => Promise<LoadedRoute>): LazyAppRoute;
+export {};

package/dist/react/lazy-route.js

@@ -0,0 +1,57 @@
+import { createElement, useSyncExternalStore } from "./runtime.js";
+import { useRouter } from "./context.js";
+import { serverRoute } from "../client/index.js";
+//#region .generated/react/lazy-route.ts
+/**
+* On-demand React route modules with shared intent prefetching.
+*
+* @module
+*/
+function LazyView() {
+	const router = useRouter();
+	const { path } = useSyncExternalStore(router.subscribe, router.getSnapshot, router.getSnapshot);
+	const Component = router.routes.find((item) => item.path === path)?.resolveComponent();
+	return Component && createElement(Component, {});
+}
+/** Create a route that imports its module on demand and shares the import with intent prefetching. */
+function lazyRoute(options, importer) {
+	let module;
+	let pending;
+	function preload() {
+		pending ??= importer().then((loaded) => {
+			module = serverRoute(options.path, loaded, {
+				loader: options.loader,
+				action: options.action,
+				dataEndpoint: options.dataEndpoint
+			});
+		}).catch((error) => {
+			pending = void 0;
+			throw error;
+		});
+		return pending;
+	}
+	async function run(args, action = false) {
+		await preload();
+		if (args.signal.aborted) return /* @__PURE__ */ new Error("Navigation cancelled");
+		return (action ? module.clientAction ?? module.action : module.clientLoader ?? module.loader)?.(args);
+	}
+	function ErrorBoundary(props) {
+		const Component = module?.ErrorBoundary;
+		if (!Component) return props.error.message;
+		return createElement(Component, props);
+	}
+	return {
+		path: options.path,
+		id: options.id,
+		preload,
+		default: LazyView,
+		resolveComponent: () => module?.default,
+		clientLoader: (args) => run(args),
+		...(options.action || options.clientAction) && { clientAction: (args) => run(args, true) },
+		...options.meta && { meta: (args) => module?.meta?.(args) ?? [] },
+		...options.shouldRevalidate && { shouldRevalidate: (args) => module?.shouldRevalidate?.(args) ?? true },
+		...options.ErrorBoundary && { ErrorBoundary }
+	};
+}
+//#endregion
+export { lazyRoute };