@kasperrt/smolter 0.4.3 → 0.4.4

package/.generated/server/application.tsx

@@ -1,274 +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";
 
-/** SSR settings for CSP nonce and early deferred-data hydration. */
-export interface RenderApplicationOptions {
-  nonce?: string;
-  earlyHydration?: boolean;
-}
+export { dispatchRoute } from "./dispatch.ts";
+export type { RenderApplicationOptions } from "./render-application.ts";
 
-/** Render a Preact application response with root and route data, streaming deferred content when enabled. */
-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);
-}
-
-/** Dispatch a normalized application URL to its route loader or action and return an HTTP response. */
-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/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);
+}

package/.generated/server/index.ts

@@ -117,3 +117,5 @@ export async function handleRequest(
 ): Promise<Response> {
   return privateResponse(await dispatchRequest(routes, request));
 }
+
+export { dispatchRoute } from "./dispatch.ts";

package/.generated/server/react.ts

@@ -0,0 +1,34 @@
+/**
+ * React SSR rendering and route data dispatch.
+ * @module
+ */
+import type { AppRoute, RootModule } from "../react/route-types.ts";
+import { RouterApplication } from "../react/router.ts";
+import { createElement } from "react";
+import * as ReactDOMServer from "react-dom/server";
+import {
+  type RenderApplicationOptions,
+  renderDocument,
+} from "./render-application.ts";
+
+export * from "./index.ts";
+export type { RenderApplicationOptions } from "./render-application.ts";
+
+/** Render a React document with root and route data using React's streaming renderer. */
+export async function renderApplication(
+  request: Request,
+  routes: AppRoute[],
+  rootModule: RootModule,
+  entry: string,
+  options: RenderApplicationOptions = {},
+): Promise<Response> {
+  const { renderToReadableStream } = ReactDOMServer;
+  if (!renderToReadableStream)
+    throw new Error("renderApplication requires React DOM 19 or newer.");
+  return renderDocument(request, routes, rootModule, entry, options, (props) =>
+    renderToReadableStream(
+      createElement(RouterApplication, { ...props, rootModule }),
+      { nonce: options.nonce, signal: request.signal },
+    ),
+  );
+}

package/.generated/server/render-application.ts

@@ -0,0 +1,203 @@
+import type { DataArgs, Route, Router } from "../core/index.ts";
+import { createDataRouter, matchRoutes, safeWrapAsync } from "../core/index.ts";
+import { prepareRoutes } from "../core/prepare-routes.ts";
+import { normalizeResult } from "../core/responses.ts";
+import { loadRouter } from "./index.ts";
+import { deferredHydration } from "./deferred-hydration.ts";
+import { dispatchRoute } from "./dispatch.ts";
+
+interface ServerRoot {
+  loader?: (args: DataArgs) => unknown;
+  ErrorBoundary?: unknown;
+}
+
+export interface RenderProps {
+  router: Router;
+  routes: (Route & { routePath?: string })[];
+  root: unknown;
+  entry: string;
+  rootError: boolean;
+  streaming: boolean;
+  initialData?: string;
+  document: boolean;
+}
+
+import { progressiveDocument } from "./progressive-document.ts";
+import { resolveHydration, streamDocument } from "./stream-document.ts";
+
+/** SSR settings for CSP nonce and early deferred-data hydration. */
+export interface RenderApplicationOptions {
+  nonce?: string;
+  earlyHydration?: boolean;
+}
+
+/** Render a Preact application response with root and route data, streaming deferred content when enabled. */
+export async function renderDocument(
+  request: Request,
+  routes: (Route & { routePath?: string })[],
+  rootModule: ServerRoot,
+  entry: string,
+  options: RenderApplicationOptions,
+  render: (
+    props: RenderProps,
+  ) =>
+    | (ReadableStream<Uint8Array> & { allReady: Promise<unknown> })
+    | Promise<ReadableStream<Uint8Array> & { allReady: Promise<unknown> }>,
+): 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 = await Promise.resolve()
+    .then(() =>
+      render({
+        router,
+        routes,
+        root,
+        entry,
+        rootError: Boolean(rootError),
+        streaming: true,
+        initialData: deferred?.initial,
+        document: true,
+      }),
+    )
+    .catch(async (error: unknown) => {
+      router.dispose();
+      await deferred?.stream.cancel();
+      throw error;
+    });
+  // 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,
+    },
+  );
+}

package/.generated/vite/application/lazy-files.ts

@@ -12,6 +12,7 @@ interface ChunkMetadata {
 export function lazyFiles(
   directory: string,
   dataEndpoint = "/_smolter",
+  framework: "react" | "preact" = "preact",
 ): Plugin {
   let root: string;
   const modules = new Map<string, string>();
@@ -139,7 +140,7 @@ export function lazyFiles(
       }
 
       return [
-        'import { lazyRoute } from "@kasperrt/smolter/preact/lazy-route";',
+        `import { lazyRoute } from "@kasperrt/smolter/${framework}/lazy-route";`,
         `export default [${definitions.join(",\n")}];`,
       ].join("\n");
     },

package/.generated/vite/application/vite.ts

@@ -6,6 +6,7 @@ import { lazyFiles } from "./lazy-files.ts";
 
 export interface ApplicationOptions {
   directory?: string;
+  framework?: "react" | "preact";
   dataEndpoint?: string;
   ssr?: boolean;
   splitRoutes?: boolean;
@@ -43,6 +44,7 @@ export const preactConfig: UserConfig = {
 
 export function applicationPlugins({
   directory = "src/routes",
+  framework = "preact",
   dataEndpoint = "/_smolter",
   ssr = true,
   splitRoutes = true,
@@ -51,7 +53,13 @@ export function applicationPlugins({
   const application: Plugin = {
     name: "smolter-application",
     enforce: "pre",
-    config: () => preactConfig,
+    config: () =>
+      framework === "preact"
+        ? preactConfig
+        : {
+            resolve: { dedupe: ["react", "react-dom", "@kasperrt/smolter"] },
+            ssr: { noExternal: ["@kasperrt/smolter"] },
+          },
     transformIndexHtml: {
       order: "post",
       handler(html, context) {
@@ -93,7 +101,7 @@ export function applicationPlugins({
           const request = await webRequest(incoming, outgoing, target);
           const [{ default: routes }, { dispatchRoute }] = await Promise.all([
             server.ssrLoadModule("virtual:smolter/routes"),
-            server.ssrLoadModule("@kasperrt/smolter/preact/server"),
+            server.ssrLoadModule(`@kasperrt/smolter/${framework}/server`),
           ]);
           await send(await dispatchRoute(request, routes), outgoing);
         };
@@ -144,7 +152,7 @@ export function applicationPlugins({
   return [
     application,
     browserBoundary(),
-    ...(splitRoutes ? [lazyFiles(directory, dataEndpoint)] : []),
-    routerPlugin({ directory, framework: "preact", dataEndpoint }),
+    ...(splitRoutes ? [lazyFiles(directory, dataEndpoint, framework)] : []),
+    routerPlugin({ directory, framework, dataEndpoint }),
   ];
 }