@reckona/mreact-router 0.0.65 → 0.0.67

package/src/adapters/devtools.ts

@@ -0,0 +1,5 @@
+import { emitMreactDevtoolsEvent } from "@reckona/mreact-devtools";
+
+export function emitRouterDevtoolsEvent(event: { type: string } & Record<string, unknown>): void {
+  emitMreactDevtoolsEvent("@reckona/mreact-router", event);
+}

package/src/adapters/edge.ts

@@ -0,0 +1,70 @@
+import { emitRouterDevtoolsEvent } from "./devtools.js";
+import {
+  emitRouterLog,
+  logDurationMs,
+  logError,
+  logNow,
+  requestLogFields,
+  type AppRouterLogger,
+} from "../logger.js";
+
+export type EdgeRequestHandler = (request: Request) => Response | Promise<Response>;
+
+export interface EdgeRequestHandlerOptions {
+  logger?: AppRouterLogger | undefined;
+  onError?: ((error: unknown, request: Request) => Response | Promise<Response>) | undefined;
+  render: EdgeRequestHandler;
+}
+
+export function createEdgeRequestHandler(options: EdgeRequestHandlerOptions): EdgeRequestHandler {
+  return async (request) => {
+    const startedAt = logNow();
+    const logFields = requestLogFields(request, "edge");
+    emitRouterLog(options.logger, "info", {
+      ...logFields,
+      type: "router:request:start",
+    });
+    emitRouterDevtoolsEvent({
+      method: request.method,
+      type: "router:request:start",
+      url: request.url,
+    });
+
+    try {
+      const response = await options.render(request);
+      emitRouterDevtoolsEvent({
+        method: request.method,
+        status: response.status,
+        type: "router:request:end",
+        url: request.url,
+      });
+      emitRouterLog(options.logger, "info", {
+        ...logFields,
+        durationMs: logDurationMs(startedAt),
+        status: response.status,
+        type: "router:request:end",
+      });
+
+      return response;
+    } catch (error) {
+      emitRouterDevtoolsEvent({
+        method: request.method,
+        type: "router:request:error",
+        url: request.url,
+      });
+      emitRouterLog(options.logger, "error", {
+        ...logFields,
+        durationMs: logDurationMs(startedAt),
+        error: logError(error),
+        type: "router:request:error",
+      });
+
+      return options.onError === undefined
+        ? new Response("Internal Server Error", {
+            headers: { "content-type": "text/plain; charset=utf-8" },
+            status: 500,
+          })
+        : await options.onError(error, request);
+    }
+  };
+}

package/src/adapters/node.ts

@@ -0,0 +1,126 @@
+import type { IncomingMessage, ServerResponse } from "node:http";
+import type { AppRouterCache } from "../cache.js";
+import { nodeRequestToWebRequest, sendResponse } from "../http.js";
+import type { AppRouterServerActionOptions } from "../actions.js";
+import type { AppRouterImportPolicy } from "../import-policy.js";
+import {
+  emitRouterLog,
+  logDurationMs,
+  logError,
+  logNow,
+  nodeRequestPath,
+  requestLogFields,
+  type AppRouterLogger,
+} from "../logger.js";
+import type { AppRouterResponseHook } from "../render.js";
+import type { RouterInstrumentation } from "../trace.js";
+
+export type { RouterInstrumentation } from "../trace.js";
+import {
+  renderBuiltAppRequest,
+  resolveRequestHost,
+  warnIfImplicitHostTrust,
+  type AppRouterPrerenderStore,
+  type RequestHostPolicy,
+  type ResponseSinkStrategy,
+} from "../serve.js";
+
+export interface NodeRequestHandlerOptions {
+  allowedHosts?: readonly string[] | undefined;
+  errorHandler?:
+    | ((error: unknown) => {
+        body: string;
+        headers?: Record<string, string>;
+        status: number;
+      })
+    | undefined;
+  hostPolicy?: RequestHostPolicy | undefined;
+  hostname?: string | undefined;
+  importPolicy?: AppRouterImportPolicy | undefined;
+  instrumentation?: RouterInstrumentation | undefined;
+  logger?: AppRouterLogger | undefined;
+  onResponse?: AppRouterResponseHook | undefined;
+  outDir: string;
+  port?: number | undefined;
+  prerenderStore?: AppRouterPrerenderStore | undefined;
+  routeCache?: AppRouterCache | undefined;
+  serverActions?: AppRouterServerActionOptions | undefined;
+  sinkStrategy?: ResponseSinkStrategy | undefined;
+}
+
+export type NodeRequestHandler = (
+  incoming: IncomingMessage,
+  outgoing: ServerResponse,
+) => Promise<void>;
+
+export function createNodeRequestHandler(options: NodeRequestHandlerOptions): NodeRequestHandler {
+  warnIfImplicitHostTrust(options);
+
+  return async (incoming, outgoing) => {
+    const startedAt = logNow();
+    const fallbackRequestFields = {
+      method: incoming.method ?? "GET",
+      path: nodeRequestPath(incoming.url),
+      runtime: "node" as const,
+    };
+
+    try {
+      const fallbackHost = `${options.hostname ?? "127.0.0.1"}:${options.port ?? 80}`;
+      const host = resolveRequestHost({
+        allowedHosts: options.allowedHosts,
+        fallbackHost,
+        hostPolicy: options.hostPolicy,
+        rawHost: incoming.headers.host,
+      });
+      const request = nodeRequestToWebRequest(incoming, `http://${host}`);
+      const logFields = requestLogFields(request, "node");
+      emitRouterLog(options.logger, "info", {
+        ...logFields,
+        type: "router:request:start",
+      });
+      const response = await renderBuiltAppRequest({
+        outDir: options.outDir,
+        importPolicy: options.importPolicy,
+        instrumentation: options.instrumentation,
+        logger: options.logger,
+        onResponse: options.onResponse,
+        prerenderStore: options.prerenderStore,
+        request,
+        routeCache: options.routeCache,
+        serverActions: options.serverActions,
+        ...(options.sinkStrategy === undefined ? {} : { sinkStrategy: options.sinkStrategy }),
+      });
+      emitRouterLog(options.logger, "info", {
+        ...logFields,
+        durationMs: logDurationMs(startedAt),
+        status: response.status,
+        type: "router:request:end",
+      });
+
+      await sendResponse(outgoing, response);
+    } catch (error) {
+      emitRouterLog(options.logger, "error", {
+        ...fallbackRequestFields,
+        durationMs: logDurationMs(startedAt),
+        error: logError(error),
+        type: "router:request:error",
+      });
+      const payload = options.errorHandler
+        ? options.errorHandler(error)
+        : { body: "Internal Server Error", status: 500 };
+      outgoing.statusCode = payload.status;
+      outgoing.setHeader(
+        "content-type",
+        payload.headers?.["content-type"] ?? "text/plain; charset=utf-8",
+      );
+
+      for (const [name, value] of Object.entries(payload.headers ?? {})) {
+        if (name.toLowerCase() !== "content-type") {
+          outgoing.setHeader(name, value);
+        }
+      }
+
+      outgoing.end(payload.body);
+    }
+  };
+}

package/src/adapters/static.ts

@@ -0,0 +1,61 @@
+import { cp, mkdir, readFile, rm, writeFile } from "node:fs/promises";
+import { dirname, join } from "node:path";
+import type { BuiltPrerenderedRoute, BuiltServerManifest } from "../build.js";
+
+export interface StaticExportOptions {
+  exportDir: string;
+  outDir: string;
+  paths?: readonly string[] | undefined;
+}
+
+export interface StaticExportResult {
+  routes: string[];
+}
+
+export async function exportStaticApp(options: StaticExportOptions): Promise<StaticExportResult> {
+  const manifest = JSON.parse(
+    await readFile(join(options.outDir, "server", "manifest.json"), "utf8"),
+  ) as BuiltServerManifest;
+  const prerenderedRoutes = manifest.prerenderedRoutes ?? {};
+  const routes = [...(options.paths ?? Object.keys(prerenderedRoutes))].sort();
+
+  await rm(options.exportDir, { force: true, recursive: true });
+  await mkdir(options.exportDir, { recursive: true });
+
+  for (const route of routes) {
+    const entry = prerenderedRoutes[route];
+
+    if (entry === undefined) {
+      throw new Error(`Cannot export non-prerendered route: ${route}`);
+    }
+
+    await writePrerenderedRoute(options.exportDir, route, entry);
+  }
+
+  await cp(join(options.outDir, "client"), join(options.exportDir, "_mreact", "client"), {
+    recursive: true,
+  });
+
+  return { routes };
+}
+
+async function writePrerenderedRoute(
+  exportDir: string,
+  route: string,
+  entry: BuiltPrerenderedRoute,
+): Promise<void> {
+  if (entry.status < 200 || entry.status >= 300) {
+    throw new Error(`Cannot export route ${route} with status ${entry.status}.`);
+  }
+
+  const file = join(exportDir, routeToHtmlFile(route));
+  await mkdir(dirname(file), { recursive: true });
+  await writeFile(file, entry.html);
+}
+
+function routeToHtmlFile(route: string): string {
+  const pathname = route.split("?")[0] ?? "/";
+  const normalized = pathname.startsWith("/") ? pathname.slice(1) : pathname;
+
+  return normalized === "" ? "index.html" : join(normalized, "index.html");
+}

package/src/app-router-globals.ts

@@ -0,0 +1,19 @@
+import type { ReactCompatElement, ReactCompatNode } from "@reckona/mreact-compat";
+
+declare global {
+  function Await<T>(props: {
+    children?: (value: Awaited<T>) => ReactCompatNode;
+    catch?: (error: Error) => ReactCompatNode;
+    placeholder?: ReactCompatNode;
+    placeholderAs?: string;
+    value: T | PromiseLike<T>;
+  }): ReactCompatElement;
+
+  function Slot(props?: {
+    children?: ReactCompatNode;
+    name?: string;
+    [attribute: string]: unknown;
+  }): ReactCompatElement;
+}
+
+export {};

package/src/assets.ts

@@ -0,0 +1,113 @@
+export interface AssetManifestEntry {
+  assets?: readonly string[];
+  css?: readonly string[];
+  file: string;
+  imports?: readonly string[];
+}
+
+export type AssetManifest = Readonly<Record<string, AssetManifestEntry>>;
+
+export interface AssetHelperOptions {
+  base?: string;
+}
+
+export interface AssetLinkDescriptor {
+  attrs: Record<string, string>;
+  tag: "link";
+}
+
+export function assetHref(
+  manifest: AssetManifest,
+  key: string,
+  options: AssetHelperOptions = {},
+): string {
+  return assetPath(manifestEntry(manifest, key).file, options.base);
+}
+
+export function assetPreloadLinks(
+  manifest: AssetManifest,
+  keys: readonly string[] | string,
+  options: AssetHelperOptions = {},
+): AssetLinkDescriptor[] {
+  const seen = new Set<string>();
+  const links: AssetLinkDescriptor[] = [];
+
+  for (const key of Array.isArray(keys) ? keys : [keys]) {
+    const entry = manifestEntry(manifest, key);
+
+    pushUniqueLink(seen, links, {
+      attrs: {
+        href: assetPath(entry.file, options.base),
+        rel: entry.file.endsWith(".js") ? "modulepreload" : "preload",
+      },
+      tag: "link",
+    });
+
+    for (const css of entry.css ?? []) {
+      pushUniqueLink(seen, links, {
+        attrs: {
+          href: assetPath(css, options.base),
+          rel: "stylesheet",
+        },
+        tag: "link",
+      });
+    }
+
+    for (const asset of entry.assets ?? []) {
+      pushUniqueLink(seen, links, {
+        attrs: {
+          as: preloadAs(asset),
+          href: assetPath(asset, options.base),
+          rel: "preload",
+        },
+        tag: "link",
+      });
+    }
+  }
+
+  return links;
+}
+
+function manifestEntry(manifest: AssetManifest, key: string): AssetManifestEntry {
+  const entry = manifest[key];
+
+  if (entry === undefined) {
+    throw new Error(`Asset manifest entry not found: ${key}`);
+  }
+
+  return entry;
+}
+
+export function assetPath(file: string, base = "/"): string {
+  const normalizedBase = base.endsWith("/") ? base : `${base}/`;
+  const normalizedFile = file.startsWith("/") ? file.slice(1) : file;
+
+  return `${normalizedBase}${normalizedFile}`;
+}
+
+function pushUniqueLink(
+  seen: Set<string>,
+  links: AssetLinkDescriptor[],
+  link: AssetLinkDescriptor,
+): void {
+  const key = JSON.stringify(link);
+
+  if (seen.has(key)) {
+    return;
+  }
+
+  seen.add(key);
+  links.push(link);
+}
+
+function preloadAs(file: string): string {
+  if (/\.(?:avif|gif|jpe?g|png|svg|webp)$/i.test(file)) {
+    return "image";
+  }
+
+  if (/\.(?:woff2?|ttf|otf)$/i.test(file)) {
+    return "font";
+  }
+
+  return "fetch";
+}