@kasperrt/smolter 0.4.2 → 0.4.4

package/.generated/react/route-hooks.ts

@@ -0,0 +1,159 @@
+import type { NavigateOptions, Router, SubmitOptions } from "../core/index.ts";
+import type { NavigationType } from "../core/navigation.ts";
+import { pendingLocation } from "../core/presentation.ts";
+import {
+  type Submission,
+  type SubmissionOptions,
+  submissionBody,
+  submissionSearch,
+} from "../core/submission.ts";
+import { useRouter, useSnapshot } from "./context.ts";
+import type { NavigateFunction } from "./navigation.ts";
+import { useNavigationSnapshot } from "./navigation-state.ts";
+import { useApplication } from "./root-context.ts";
+import type { RouteData } from "./route-types.ts";
+import { useCallback, useMemo } from "./runtime.ts";
+
+/** Read root loader data from the application context. */
+export function useRootData<T = unknown>(): RouteData<T> {
+  return useApplication().root as RouteData<T>;
+}
+
+/** Read root data or the active route's data by its manifest identifier. */
+export function useRouteLoaderData<T = unknown>(
+  id: string,
+): RouteData<T> | undefined {
+  const app = useApplication();
+  const snapshot = useSnapshot();
+
+  if (id === "root") return app.root as RouteData<T>;
+
+  const route = app.routes.find((item) => item.id === id);
+
+  if (!route || route.path !== snapshot.path) return undefined;
+
+  return snapshot.data as RouteData<T>;
+}
+
+export { useSnapshot };
+
+/** Read the current route error for an error boundary. */
+export function useRouteError(): Error | undefined {
+  return useSnapshot("error");
+}
+
+/** Read the current page navigation or submission state. */
+export function useNavigation(): {
+  state: "idle" | "loading" | "submitting";
+  location: URL | undefined;
+} {
+  const router = useRouter<Router>();
+  const snapshot = useSnapshot();
+  const location = pendingLocation(router);
+
+  return useMemo(
+    () => ({
+      state: snapshot.state,
+      location,
+    }),
+    [snapshot.state, location?.href],
+  );
+}
+
+/** Return a function that submits form data through the current router. */
+export function useSubmit(): (
+  value: Submission,
+  options?: SubmissionOptions,
+) => Promise<void> | Promise<import("../core/index.ts").Result<unknown>> {
+  const router = useRouter<Router>();
+
+  return useCallback(
+    (value: Submission, options: SubmissionOptions = {}) => {
+      const body = submissionBody(value, options.encType);
+      const method = options.method?.toUpperCase();
+      const target = options.action ?? router.getSnapshot().url;
+
+      if (method === "GET") {
+        const url = new URL(target, router.getSnapshot().url);
+        url.search = submissionSearch(body);
+
+        return router.navigate(url.href, options);
+      }
+
+      return router.submit(target, body, {
+        method: method as SubmitOptions["method"],
+      });
+    },
+    [router],
+  );
+}
+
+/** Read the current router location as a URL. */
+export function useURLLocation(): URL & { state: unknown; key: string } {
+  const href = useSnapshot("url");
+  const snapshot = useNavigationSnapshot(useRouter<Router>());
+
+  return useMemo(
+    () =>
+      Object.assign(new URL(href), {
+        state: snapshot.state,
+        key: snapshot.key,
+      }),
+    [href, snapshot.state, snapshot.key],
+  );
+}
+
+/** Return the application navigation function, including history offsets and relative destinations. */
+export function useNavigate(): NavigateFunction {
+  const router = useRouter<Router>();
+
+  return useCallback(
+    (to, options) => {
+      if (typeof to === "number") {
+        window.history.go(to);
+
+        return;
+      }
+
+      const current = new URL(router.getSnapshot().url);
+      const target =
+        typeof to === "string"
+          ? to
+          : `${to.pathname ?? current.pathname}${to.search ?? current.search}${to.hash ?? current.hash}`;
+      void router.navigate(target, options);
+    },
+    [router],
+  );
+}
+
+/** Read URL search parameters and update them through router navigation. */
+export function useSearchParams(): [
+  URLSearchParams,
+  (
+    value: URLSearchParams | Record<string, string>,
+    options?: NavigateOptions,
+  ) => void,
+] {
+  const location = useURLLocation();
+  const navigate = useNavigate();
+  const params = useMemo(
+    () => new URLSearchParams(location.search),
+    [location.search],
+  );
+  const set = useCallback(
+    (
+      value: URLSearchParams | Record<string, string>,
+      options?: NavigateOptions,
+    ) => {
+      navigate(`${location.pathname}?${new URLSearchParams(value)}`, options);
+    },
+    [location.pathname, navigate],
+  );
+
+  return [params, set];
+}
+
+/** Read the last browser history operation. */
+export function useNavigationType(): NavigationType {
+  return useNavigationSnapshot(useRouter<Router>()).type;
+}

package/.generated/react/route-types.ts

@@ -0,0 +1,91 @@
+import type {
+  DataArgs,
+  RevalidationArgs,
+  Route,
+  Snapshot,
+} from "../core/index.ts";
+import type { DataResponse } from "../core/responses.ts";
+import type { ComponentType, ReactNode } from "./runtime.ts";
+
+/** 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;
+  error?: unknown;
+  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>;
+  id?: string;
+  routePath?: string;
+  meta?: MetaFunction;
+}
+
+/** Root document components, loader, metadata and revalidation policy for a React application. */
+export interface RootModule {
+  /** Route identity used by targeted revalidation. Defaults to root. */
+  id?: string;
+  /** Optional registered route URL used to revalidate root data after mutations. */
+  loaderPath?: string;
+  ErrorBoundary?: ComponentType;
+  default: ComponentType;
+  Layout: ComponentType<{ children: ReactNode }>;
+  loader?: (args: LoaderFunctionArgs) => unknown;
+  links?: LinksFunction;
+  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>;

package/.generated/react/router.ts

@@ -0,0 +1,50 @@
+import { createStore } from "../core/store.ts";
+import { RouterProvider } from "./context.ts";
+import { Outlet } from "./outlet.ts";
+import { Application, type ApplicationContext } from "./root-context.ts";
+import {
+  createElement,
+  type ReactNode,
+  useMemo,
+  useSyncExternalStore,
+} from "./runtime.ts";
+
+/** Root data, document components and request-scoped router for an application. */
+export interface ApplicationProps extends ApplicationContext {
+  document?: boolean;
+  rootStore?: ReturnType<typeof createStore>;
+}
+
+/** Compose a persistent root layout with route views and observable root loader data. */
+export function RouterApplication(props: ApplicationProps): ReactNode {
+  const store = useMemo(
+    () => props.rootStore ?? createStore(props.root),
+    [props.rootStore, props.root],
+  );
+  const root = useSyncExternalStore(
+    store.subscribe,
+    store.getSnapshot,
+    store.getSnapshot,
+  );
+  const snapshot = useSyncExternalStore(
+    props.router.subscribe,
+    props.router.getSnapshot,
+    props.router.getSnapshot,
+  );
+  const route = props.routes.find((item) => item.path === snapshot.path);
+  const Root =
+    snapshot.error && (props.rootError || !route?.ErrorBoundary)
+      ? (props.rootModule?.ErrorBoundary ?? Outlet)
+      : (props.rootModule?.default ?? Outlet);
+  const Layout = props.rootModule?.Layout;
+  const children = createElement(Root);
+  return createElement(
+    RouterProvider,
+    { router: props.router },
+    createElement(
+      Application.Provider,
+      { value: { ...props, root } },
+      props.document && Layout ? createElement(Layout, { children }) : children,
+    ),
+  );
+}

package/.generated/react/runtime.ts

@@ -11,6 +11,7 @@ export type {
 export {
   createContext,
   createElement,
+  useCallback,
   useContext,
   useEffect,
   useMemo,

package/.generated/server/application.tsx

@@ -1,271 +1,39 @@
 /** @jsxImportSource preact */
-
-import { createDataRouter, matchRoutes, safeWrapAsync } from "../core/index.ts";
-import {
-  type DataResponse,
-  normalizeResult,
-  resolveData,
-} from "../core/responses.ts";
 import type { AppRoute, RootModule } from "../preact/route-types.ts";
-import { prepareRoutes, RouterApplication } from "../preact/router.tsx";
-import { loadRouter } from "./index.ts";
+import { RouterApplication } from "../preact/router.tsx";
 import type { ComponentChildren } from "preact";
 import { Suspense } from "preact/compat";
 import { renderToReadableStream } from "preact-render-to-string/stream";
-import { deferredHydration } from "./deferred-hydration.ts";
-import { privateResponse } from "./private-response.ts";
-import { progressiveDocument } from "./progressive-document.ts";
-import { resolveHydration, streamDocument } from "./stream-document.ts";
+import {
+  type RenderApplicationOptions,
+  renderDocument,
+} from "./render-application.ts";
 
-export interface RenderApplicationOptions {
-  nonce?: string;
-  earlyHydration?: boolean;
-}
+export { dispatchRoute } from "./dispatch.ts";
+export type { RenderApplicationOptions } from "./render-application.ts";
 
-export async function renderApplication(
+/** Render a Preact application response with root data and optional early deferred hydration. */
+export function renderApplication(
   request: Request,
   routes: AppRoute[],
   rootModule: RootModule,
   entry: string,
   options: RenderApplicationOptions = {},
 ): Promise<Response> {
-  routes = routes.map((route) => ({
-    ...route,
-    path: route.routePath ?? route.path,
-  }));
-  const match = matchRoutes(routes, new URL(request.url).pathname);
-
-  if (match && !match.route.default)
-    return dispatchRoute(request, routes, true);
-
-  let actionResponse: Response | undefined;
-  let actionData: unknown;
-
-  if (request.method !== "GET" && request.method !== "HEAD") {
-    actionResponse = await dispatchRoute(request, routes, true);
-
-    if (
-      actionResponse.headers.has("Location") ||
-      !actionResponse.headers.get("Content-Type")?.includes("application/json")
-    )
-      return actionResponse;
-
-    actionData = await normalizeResult(await actionResponse.json());
-  }
-
-  const rootResult = safeWrapAsync(() =>
-    Promise.resolve()
-      .then(() =>
-        rootModule.loader?.({ request, params: {}, signal: request.signal }),
-      )
-      .then(
-        (value) => normalizeResult(value, false),
-        (error: unknown) =>
-          error instanceof Response
-            ? normalizeResult(error, false)
-            : error instanceof Error
-              ? error
-              : new Error(String(error), { cause: error }),
-      ),
-  );
-  let redirectResponse: Response | undefined;
-  const prepared = prepareRoutes(
-    routes.map((route) => ({
-      ...route,
-      ErrorBoundary: route.ErrorBoundary ?? rootModule.ErrorBoundary,
-    })),
-    true,
-  ).map((route) => {
-    if (!route.loader) return route;
-
-    const loader = route.loader;
-
-    return {
-      ...route,
-      loader: async (args: Parameters<typeof loader>[0]) => {
-        const value = await loader(args);
-
-        if (value instanceof Response && value.headers.has("Location"))
-          redirectResponse = value;
-
-        return value;
-      },
-    };
-  });
-  const [rootState, loadedRouter] = await Promise.all([
-    rootResult,
-    loadRouter(prepared, request),
-  ]);
-  let router = loadedRouter;
-  const rootError =
-    rootState.error ??
-    (rootState.data instanceof Error ? rootState.data : undefined);
-  const root = rootError ? undefined : rootState.data;
-
-  if (root instanceof Response && root.headers.has("Location")) {
-    router.dispose();
-    return root;
-  }
-
-  if (redirectResponse) {
-    router.dispose();
-
-    return redirectResponse;
-  }
-
-  if (actionResponse || rootError) {
-    const hydrationData = {
-      ...router.getSnapshot(),
-      actionData: actionData instanceof Error ? undefined : actionData,
-      ...(actionData instanceof Error && { error: actionData }),
-      ...(rootError && { error: rootError }),
-    };
-    router.dispose();
-    router = createDataRouter(router.routes, { hydrationData });
-  }
-
-  const snapshot = router.getSnapshot();
-  const hydrationData = {
-    root,
-    snapshot: {
-      ...snapshot,
-      error: snapshot.error && {
-        ...snapshot.error,
-        name: snapshot.error.name,
-        message: snapshot.error.message,
-      },
-    },
-    ...(rootError && { rootError: true }),
-  };
-  const deferred = options.earlyHydration
-    ? deferredHydration(hydrationData, options.nonce)
-    : undefined;
-  const stream = renderToReadableStream(
-    <RouterApplication
-      router={router}
-      routes={routes}
-      root={root}
-      rootModule={rootModule}
-      entry={entry}
-      rootError={Boolean(rootError)}
-      streaming
-      deferredBoundary={options.earlyHydration ? undefined : deferredBoundary}
-      initialData={deferred?.initial}
-      document
-    />,
-    options,
-  );
-  // The renderer reports the same rejection through its stream reader.
-  void stream.allReady.catch(() => {});
-  const headers = new Headers(actionResponse?.headers);
-  headers.delete("Content-Length");
-  headers.delete("Content-Encoding");
-  headers.set("Content-Type", "text/html; charset=utf-8");
-  headers.set("Cache-Control", "no-store");
-
-  return new Response(
-    deferred
-      ? progressiveDocument(stream, deferred.stream, {
-          signal: request.signal,
-          dispose: () => router.dispose(),
-        })
-      : streamDocument(stream, {
-          hydration: resolveHydration(hydrationData),
-          signal: request.signal,
-          nonce: options.nonce,
-          dispose: () => router.dispose(),
-        }),
-    {
-      status: snapshot.error
-        ? Number("status" in snapshot.error ? snapshot.error.status : 500)
-        : (actionResponse?.status ?? 200),
-      headers,
-    },
+  return renderDocument(request, routes, rootModule, entry, options, (props) =>
+    renderToReadableStream(
+      <RouterApplication
+        {...props}
+        rootModule={rootModule}
+        deferredBoundary={options.earlyHydration ? undefined : deferredBoundary}
+      />,
+      options,
+    ),
   );
 }
-
 function deferredBoundary(
   children: ComponentChildren,
   fallback: ComponentChildren,
 ) {
   return <Suspense fallback={fallback}>{children}</Suspense>;
 }
-
-async function dispatch(
-  request: Request,
-  routes: AppRoute[],
-  document = false,
-): Promise<Response> {
-  const match = matchRoutes(
-    routes.map((route) => ({ ...route, path: route.routePath ?? route.path })),
-    new URL(request.url).pathname,
-  );
-
-  if (!match) return Response.json({ error: "No route" }, { status: 404 });
-
-  const handler =
-    request.method === "GET" || request.method === "HEAD"
-      ? match.route.loader
-      : match.route.action;
-
-  if (!handler) return Response.json({ error: "No handler" }, { status: 405 });
-
-  const value = await Promise.resolve()
-    .then(() =>
-      handler({ request, params: match.params, signal: request.signal }),
-    )
-    .then(
-      (result) => result,
-      (error: unknown) => error,
-    );
-
-  if (value instanceof Response) {
-    const location = value.headers.get("Location");
-
-    if (document) return value;
-
-    if (!location) {
-      if (value.ok) return value;
-
-      return Response.json({
-        __routeError: {
-          message: await value.text(),
-          status: value.status,
-          statusText: value.statusText,
-        },
-      });
-    }
-
-    const headers = new Headers(value.headers);
-    headers.delete("Location");
-    headers.set("X-Smolter-Redirect", location);
-
-    return new Response(null, { headers });
-  }
-
-  if (value instanceof Error)
-    return Response.json({
-      __routeError: { ...value, message: value.message },
-    });
-
-  if (value && typeof value === "object" && "__routeData" in value) {
-    const result = value as DataResponse<unknown>;
-
-    return Response.json(
-      await resolveData(result.value),
-      document ? result.init : { headers: result.init.headers },
-    );
-  }
-
-  return Response.json((await normalizeResult(value)) ?? null);
-}
-
-export async function dispatchRoute(
-  request: Request,
-  routes: AppRoute[],
-  document = false,
-): Promise<Response> {
-  const response = await dispatch(request, routes, document);
-
-  return document ? response : privateResponse(response);
-}

package/.generated/server/assets.ts

@@ -1,11 +1,18 @@
+/**
+ * Production route asset discovery for SSR preload hints.
+ *
+ * @module
+ */
 import { matchRoutes } from "../core/index.ts";
 
+/** Emitted JavaScript and stylesheet URLs associated with a route. */
 export interface RouteAssets {
   path: string;
   files: string[];
   styles?: string[];
 }
 
+/** Collect matched-route JavaScript and stylesheet assets from the production route manifest. */
 export function routePreloads(
   routes: RouteAssets[],
   pathname: string,

package/.generated/server/dispatch.ts

@@ -0,0 +1,87 @@
+import { matchRoutes, type Route } from "../core/index.ts";
+import {
+  type DataResponse,
+  normalizeResult,
+  resolveData,
+} from "../core/responses.ts";
+import { privateResponse } from "./private-response.ts";
+
+async function dispatch(
+  request: Request,
+  routes: readonly (Route & { routePath?: string })[],
+  document = false,
+): Promise<Response> {
+  const match = matchRoutes(
+    routes.map((route) => ({ ...route, path: route.routePath ?? route.path })),
+    new URL(request.url).pathname,
+  );
+
+  if (!match) return Response.json({ error: "No route" }, { status: 404 });
+
+  const handler =
+    request.method === "GET" || request.method === "HEAD"
+      ? match.route.loader
+      : match.route.action;
+
+  if (!handler) return Response.json({ error: "No handler" }, { status: 405 });
+
+  const value = await Promise.resolve()
+    .then(() =>
+      handler({ request, params: match.params, signal: request.signal }),
+    )
+    .then(
+      (result) => result,
+      (error: unknown) => error,
+    );
+
+  if (value instanceof Response) {
+    const location = value.headers.get("Location");
+
+    if (document) return value;
+
+    if (!location) {
+      if (value.ok) return value;
+
+      return Response.json({
+        __routeError: {
+          message: await value.text(),
+          status: value.status,
+          statusText: value.statusText,
+        },
+      });
+    }
+
+    const headers = new Headers(value.headers);
+    headers.delete("Location");
+    headers.set("X-Smolter-Redirect", location);
+
+    return new Response(null, { headers });
+  }
+
+  if (value instanceof Error)
+    return Response.json({
+      __routeError: { ...value, message: value.message },
+    });
+
+  if (value && typeof value === "object" && "__routeData" in value) {
+    const result = value as DataResponse<unknown>;
+
+    return Response.json(
+      await resolveData(result.value),
+      document ? result.init : { headers: result.init.headers },
+    );
+  }
+
+  return Response.json((await normalizeResult(value)) ?? null);
+}
+
+/** Dispatch a normalized application URL to its route loader or action and return an HTTP response. */
+export async function dispatchRoute(
+  request: Request,
+  routes: readonly (Route & { routePath?: string })[],
+  document = false,
+): Promise<Response> {
+  const response = await dispatch(request, routes, document);
+
+  return document ? response : privateResponse(response);
+}