@bractjs/bractjs 0.1.6 → 0.1.8

package/src/server/serve.ts

@@ -2,19 +2,29 @@ import { scanRoutes } from "./scanner.ts";
 import { buildTrie } from "./matcher.ts";
 import { handleRequest, type HandlerConfig } from "./request-handler.ts";
 import { type ServerManifest } from "./render.ts";
-import { isDev } from "./env.ts";
+import { isDev, isExplicitDev } from "./env.ts";
 import { loadManifest } from "../build/manifest.ts";
 import { serveStatic } from "./static.ts";
 import { handleImageRequest } from "../image/handler.ts";
 import { loadServerActions } from "./action-registry.ts";
 import { handleActionRequest } from "./action-handler.ts";
+import { BunAdapter, type BractAdapter } from "./adapter.ts";
 import { resolve, join } from "node:path";
 
+export interface I18nConfig {
+  locales: string[];
+  defaultLocale: string;
+}
+
 export interface BractJSConfig {
   port: number;
   appDir: string;
   publicDir: string;
   manifest: ServerManifest;
+  /** Optional custom adapter (Cloudflare Workers, Deno, Node, etc.). Defaults to Bun.serve(). */
+  adapter?: BractAdapter;
+  /** i18n locale prefix routing (E2). */
+  i18n?: I18nConfig;
   // Build options (used by src/build/bundler.ts)
   sourcemap?: "none" | "linked" | "inline" | "external";
   minify?: boolean;
@@ -47,18 +57,18 @@ async function readDevManifest(buildDir: string): Promise<ServerManifest> {
   };
 }
 
-export function createServer(config?: Partial<BractJSConfig>): {
-  server: ReturnType<typeof Bun.serve>;
-  stop(): void;
-} {
-  const port = config?.port ?? 3000;
-  const appDir = resolve(config?.appDir ?? "./app");
-  const publicDir = resolve(config?.publicDir ?? "./public");
-  const buildDir = resolve(config?.buildDir ?? "./build");
-  const imageCacheDir = resolve(config?.imageCacheDir ?? ".bract-image-cache");
+/**
+ * Build the core application fetch handler.
+ * This is adapter-agnostic: it returns a (request) => Promise<Response> function
+ * that any adapter can call.
+ */
+export function buildFetchHandler(config: Partial<BractJSConfig>) {
+  const appDir = resolve(config.appDir ?? "./app");
+  const publicDir = resolve(config.publicDir ?? "./public");
+  const buildDir = resolve(config.buildDir ?? "./build");
+  const imageCacheDir = resolve(config.imageCacheDir ?? ".bract-image-cache");
 
-  // In production, load the pre-built manifest; otherwise use provided or default
-  const manifestReady: Promise<ServerManifest> = !isDev() && !config?.manifest
+  const manifestReady: Promise<ServerManifest> = !isDev() && !config.manifest
     ? loadManifest(buildDir).then((m) => ({
         clientEntry: m.clientEntry,
         rootChunk: m.rootChunk,
@@ -66,62 +76,99 @@ export function createServer(config?: Partial<BractJSConfig>): {
           Object.entries(m.routes).map(([pat, e]) => [pat, { file: e.chunk, chunk: e.chunk }]),
         ),
       }))
-    : Promise.resolve(config?.manifest ?? DEFAULT_MANIFEST);
+    : Promise.resolve(config.manifest ?? DEFAULT_MANIFEST);
 
-  // Build route trie and register server actions concurrently at startup.
   const trieReady = scanRoutes(appDir).then(buildTrie);
   const actionsReady = loadServerActions(appDir);
 
-  const server = Bun.serve({
-    port,
-    async fetch(request) {
-      const url = new URL(request.url);
-      const { pathname } = url;
+  return async function fetch(request: Request): Promise<Response> {
+    const url = new URL(request.url);
+    const { pathname } = url;
 
-      // Dev-only: on-demand module compilation for HMR module swap
-      if (isDev() && pathname === "/_hmr/module") {
-        const { handleHmrModuleRequest } = await import("../dev/hmr-module-handler.ts");
-        return handleHmrModuleRequest(url, appDir);
-      }
+    // Dev-only: on-demand module compilation for HMR module swap.
+    // SECURITY(high): use isExplicitDev() (NODE_ENV === "development") rather
+    // than isDev() (NODE_ENV !== "production"). An operator who forgets to set
+    // NODE_ENV would otherwise expose /_hmr/module in production, letting
+    // anyone compile and download arbitrary appDir .ts/.tsx files as JS.
+    if (isExplicitDev() && pathname === "/_hmr/module") {
+      const { handleHmrModuleRequest } = await import("../dev/hmr-module-handler.ts");
+      return handleHmrModuleRequest(url, appDir);
+    }
 
-      // Server actions endpoint
-      if (pathname.startsWith("/_action")) {
-        await actionsReady;
-        const actionRes = await handleActionRequest(request);
-        if (actionRes) return actionRes;
-      }
+    // Typed API routes (registered via bract.route())
+    if (pathname.startsWith("/api")) {
+      const { handleApiRequest } = await import("./api-route.ts");
+      const apiRes = await handleApiRequest(request);
+      if (apiRes) return apiRes;
+    }
 
-      // Image optimization endpoint
-      if (pathname === "/_image") {
-        const imgRes = await handleImageRequest(request, publicDir, imageCacheDir);
-        if (imgRes) return imgRes;
-      }
+    // Server actions endpoint (exact path; handler also validates).
+    if (pathname === "/_action") {
+      await actionsReady;
+      const actionRes = await handleActionRequest(request);
+      if (actionRes) return actionRes;
+    }
 
-      // Serve hashed client assets + public/ with correct cache headers
-      const staticRes = await serveStatic(pathname, buildDir, publicDir);
-      if (staticRes) return staticRes;
+    // SSE streaming endpoint for async-generator server actions.
+    if (pathname === "/_stream") {
+      await actionsReady;
+      const { handleStreamRequest } = await import("./stream-handler.ts");
+      const streamRes = await handleStreamRequest(request);
+      if (streamRes) return streamRes;
+    }
 
-      const trie = await trieReady;
-      const manifest = isDev() ? await readDevManifest(buildDir) : await manifestReady;
-      const handlerConfig: HandlerConfig = { appDir, publicDir, manifest };
-      return handleRequest(request, trie, handlerConfig);
-    },
-    // Return JSON for any uncaught exception so the client's r.json() never sees
-    // plain-text "Internal Server Error" bodies → prevents JSON.parse errors.
-    error(err: Error) {
-      console.error("[bractjs] unhandled server error:", err);
-      return new Response(JSON.stringify({ error: err.message }), {
-        status: 500,
-        headers: { "Content-Type": "application/json; charset=utf-8" },
-      });
-    },
-  });
+    // Image optimization endpoint
+    if (pathname === "/_image") {
+      const imgRes = await handleImageRequest(request, publicDir, imageCacheDir);
+      if (imgRes) return imgRes;
+    }
+
+    // Serve hashed client assets + public/ with correct cache headers
+    const staticRes = await serveStatic(pathname, buildDir, publicDir);
+    if (staticRes) return staticRes;
+
+    const trie = await trieReady;
+    const manifest = isDev() ? await readDevManifest(buildDir) : await manifestReady;
+    const handlerConfig: HandlerConfig = { appDir, publicDir, manifest };
+    return handleRequest(request, trie, handlerConfig);
+  };
+}
+
+export function createServer(config?: Partial<BractJSConfig>): {
+  stop(): void;
+} {
+  const port = config?.port ?? 3000;
+
+  const fetchHandler = buildFetchHandler(config ?? {});
+
+  // Use provided adapter or fall back to the default Bun adapter.
+  const adapter = config?.adapter ?? new BunAdapter();
+
+  if (adapter instanceof BunAdapter) {
+    adapter.setHandler(fetchHandler);
+    adapter.listen(port);
+
+    console.log(`[bract] Server running at http://localhost:${port}`);
+
+    return {
+      stop() { adapter.stop(); },
+    };
+  }
+
+  // Custom adapter: wire fetch handler in and call listen if available.
+  if ("setHandler" in adapter && typeof (adapter as unknown as { setHandler: unknown }).setHandler === "function") {
+    (adapter as unknown as { setHandler: (h: (r: Request) => Promise<Response>) => void }).setHandler(fetchHandler);
+  }
+  adapter.listen?.(port);
 
   console.log(`[bract] Server running at http://localhost:${port}`);
 
   return {
-    server,
-    stop() { server.stop(); },
+    stop() {
+      if ("stop" in adapter && typeof (adapter as unknown as { stop: unknown }).stop === "function") {
+        (adapter as unknown as { stop: () => void }).stop();
+      }
+    },
   };
 }
 

package/src/server/session.ts

@@ -80,6 +80,7 @@ function makeSession(data: SessionData): InternalSession {
 
 // ── Public API ──────────────────────────────────────────────────────────────
 
+// SECURITY(medium): caller can opt out of the Secure flag by passing secure:false; this is safe only on HTTP-only local dev — never use in production without HTTPS.
 export function createCookieSession(options: CookieSessionOptions): SessionStorage {
   const { name, secrets, maxAge, secure = true, sameSite = "Lax" } = options;
   if (!Array.isArray(secrets) || secrets.length === 0) {

package/src/server/static.ts

@@ -25,12 +25,19 @@ async function safeRealpath(root: string, requested: string): Promise<string | n
  * Returns null if the path doesn't match or the file isn't found.
  * Guards against path traversal AND symlink escape.
  */
+// Reject only `..` as a full path segment (e.g. "/a/../b"), not legitimate
+// filenames that happen to contain ".." as a substring like "file..backup.txt".
+// safeRealpath() is the authoritative escape check; this is defense-in-depth.
+function hasDotDotSegment(pathname: string): boolean {
+  return pathname.split("/").includes("..");
+}
+
 export async function serveStatic(
   pathname: string,
   buildDir: string,
   publicDir: string,
 ): Promise<Response | null> {
-  if (pathname.includes("..")) return null;
+  if (hasDotDotSegment(pathname)) return null;
 
   if (pathname.startsWith("/build/client/")) {
     const rel = pathname.slice("/build/client/".length);

package/src/server/stream-handler.ts

@@ -0,0 +1,111 @@
+import { resolveAction } from "./action-registry.ts";
+import { isExplicitDev } from "./env.ts";
+import { isAllowedMutation } from "./csrf.ts";
+
+// ── SSE helpers ────────────────────────────────────────────────────────────
+
+function sseChunk(event: string, data: unknown): string {
+  return `event: ${event}\ndata: ${JSON.stringify(data)}\n\n`;
+}
+
+// ── Handler ────────────────────────────────────────────────────────────────
+
+/**
+ * Handles `GET /_stream?id=<actionId>` requests.
+ *
+ * The action identified by `id` must be an async generator function registered
+ * in the action registry.  Each yielded value is sent as an SSE `data` event.
+ * The stream closes when the generator returns.
+ *
+ * Security: only IDs present in the registry are resolved — no path traversal.
+ */
+export async function handleStreamRequest(request: Request): Promise<Response | null> {
+  const url = new URL(request.url);
+  // SECURITY(medium): exact-match prevents URL confusion.
+  if (url.pathname !== "/_stream") return null;
+
+  // SECURITY(high): server actions can have side effects. A cross-origin
+  // <script>/<img>/<link rel=prefetch> pointing at /_stream?id=… would
+  // otherwise invoke any registered action with the user's cookies. Require
+  // the same gate as /_action: either a same-origin Origin header, or the
+  // client-issued X-BractJS-Action header (blocked cross-origin by CORS).
+  if (!isAllowedMutation(request)) {
+    return new Response(sseChunk("error", { message: "Forbidden" }), {
+      status: 403,
+      headers: {
+        "Content-Type": "text/event-stream",
+        "Cache-Control": "no-cache",
+        Connection: "keep-alive",
+      },
+    });
+  }
+
+  const actionId = url.searchParams.get("id");
+  // Guard: reject missing or clearly invalid IDs before registry lookup.
+  if (!actionId || !/^[0-9a-f]{16}$/.test(actionId)) {
+    return new Response(sseChunk("error", { message: "Invalid action ID" }), {
+      status: 400,
+      headers: {
+        "Content-Type": "text/event-stream",
+        "Cache-Control": "no-cache",
+        Connection: "keep-alive",
+      },
+    });
+  }
+
+  const action = resolveAction(actionId);
+  if (!action) {
+    return new Response(sseChunk("error", { message: "Action not found" }), {
+      status: 404,
+      headers: {
+        "Content-Type": "text/event-stream",
+        "Cache-Control": "no-cache",
+        Connection: "keep-alive",
+      },
+    });
+  }
+
+  const stream = new ReadableStream({
+    async start(controller) {
+      const encoder = new TextEncoder();
+      try {
+        const result = await action();
+        // If the action is an async generator, stream each value.
+        if (result && typeof (result as AsyncIterable<unknown>)[Symbol.asyncIterator] === "function") {
+          // SECURITY(medium): no per-stream yield cap. A malicious or buggy
+          // generator that yields forever holds a connection open and pegs
+          // serialization CPU. The Bun.serve runtime aborts when the client
+          // disconnects, so the worst case is a slow attacker keeping their
+          // own connection open — bounded by OS fd limits, not memory.
+          // Apps wanting hard bounds should wrap their generator with a
+          // count/time limit before exporting it as an action.
+          for await (const value of result as AsyncIterable<unknown>) {
+            controller.enqueue(encoder.encode(sseChunk("data", value)));
+          }
+        } else {
+          // Plain return value: emit once then close.
+          controller.enqueue(encoder.encode(sseChunk("data", result)));
+        }
+        controller.enqueue(encoder.encode("event: done\ndata: {}\n\n"));
+      } catch (err) {
+        // Never expose internal error details to clients in production.
+        const message = isExplicitDev()
+          ? (err instanceof Error ? err.message : String(err))
+          : "Internal server error";
+        console.error("[bractjs] stream action error:", err);
+        controller.enqueue(encoder.encode(sseChunk("error", { message })));
+      } finally {
+        controller.close();
+      }
+    },
+  });
+
+  return new Response(stream, {
+    headers: {
+      "Content-Type": "text/event-stream",
+      "Cache-Control": "no-cache",
+      Connection: "keep-alive",
+      "X-Accel-Buffering": "no",
+    },
+  });
+}

package/src/server/validate.ts

@@ -0,0 +1,89 @@
+// ── Duck-typed schema interface ────────────────────────────────────────────
+
+interface SchemaWithParse<T> {
+  parse(input: unknown): T;
+}
+
+interface SafeParseResult<T> {
+  success: boolean;
+  data?: T;
+  error?: { issues?: Array<{ path: (string | number)[]; message: string }> };
+}
+
+interface SchemaWithSafeParse<T> {
+  safeParse(input: unknown): SafeParseResult<T> | Promise<SafeParseResult<T>>;
+}
+
+type Schema<T> = SchemaWithParse<T> | SchemaWithSafeParse<T>;
+
+// ── Field error shape ─────────────────────────────────────────────────────
+
+export interface FieldErrors {
+  [field: string]: string[];
+}
+
+export class ValidationError extends Error {
+  readonly status = 400;
+  constructor(public readonly fieldErrors: FieldErrors) {
+    super("Validation failed");
+  }
+}
+
+// ── validate() ────────────────────────────────────────────────────────────
+
+function toPlainObject(input: FormData | Record<string, unknown>): Record<string, unknown> {
+  if (input instanceof FormData) {
+    const out: Record<string, unknown> = {};
+    for (const [key, value] of input.entries()) {
+      if (key in out) {
+        const existing = out[key];
+        out[key] = Array.isArray(existing) ? [...existing, value] : [existing, value];
+      } else {
+        out[key] = value;
+      }
+    }
+    return out;
+  }
+  return input;
+}
+
+/**
+ * Validate `input` against a Zod-compatible or Valibot-compatible schema.
+ *
+ * - If the schema has `.safeParse()`: uses it to collect field errors and throws
+ *   a typed `ValidationError` on failure (which the framework converts to a 400).
+ * - If the schema only has `.parse()`: wraps it and re-throws the error as a
+ *   `ValidationError` with a single `_` field containing the error message.
+ *
+ * Returns the parsed (coerced) data on success.
+ */
+export async function validate<T>(
+  schema: Schema<T>,
+  input: FormData | Record<string, unknown>,
+): Promise<T> {
+  const plain = toPlainObject(input);
+
+  if ("safeParse" in schema && typeof schema.safeParse === "function") {
+    const result = await schema.safeParse(plain);
+    if ((result as SafeParseResult<T>).success) {
+      return (result as SafeParseResult<T>).data as T;
+    }
+    const issues = (result as SafeParseResult<T>).error?.issues ?? [];
+    const fieldErrors: FieldErrors = {};
+    for (const issue of issues) {
+      const key = issue.path.join(".") || "_";
+      (fieldErrors[key] ??= []).push(issue.message);
+    }
+    const err = new ValidationError(fieldErrors);
+    throw Response.json({ errors: fieldErrors }, { status: 400, statusText: err.message });
+  }
+
+  // Fallback: plain .parse() — wrap any thrown error.
+  try {
+    return (schema as SchemaWithParse<T>).parse(plain);
+  } catch (err) {
+    const message = err instanceof Error ? err.message : String(err);
+    const fieldErrors: FieldErrors = { _: [message] };
+    throw Response.json({ errors: fieldErrors }, { status: 400, statusText: "Validation failed" });
+  }
+}

package/src/shared/route-types.ts

@@ -33,10 +33,21 @@ export type MetaFunction<T = unknown> = (
   args: MetaArgs<T>
 ) => MetaDescriptor[];
 
+export interface BeforeLoadArgs {
+  params: Record<string, string>;
+  context: Record<string, unknown>;
+  location: { pathname: string; search: string };
+}
+
+export type BeforeLoadFunction = (
+  args: BeforeLoadArgs,
+) => void | Response | Promise<void | Response>;
+
 export interface RouteModule<TLoader = unknown, TAction = unknown> {
   loader?: LoaderFunction<TLoader>;
   action?: ActionFunction<TAction>;
   meta?: MetaFunction<TLoader>;
+  beforeLoad?: BeforeLoadFunction;
   handle?: Record<string, unknown>;
   ErrorBoundary?: React.ComponentType<{ error: unknown }>;
   default?: React.ComponentType;

package/types/index.d.ts

@@ -80,12 +80,50 @@ export declare function requestLogger(): MiddlewareFn;
 export declare function cors(options: CorsOptions): MiddlewareFn;
 export declare function authGuard(options: AuthGuardOptions): MiddlewareFn;
 
+// ── API routes (C1) ───────────────────────────────────────────────────────
+export type HttpMethod = "GET" | "POST" | "PUT" | "PATCH" | "DELETE";
+export interface ApiRouteDefinition<TMethod extends HttpMethod, TPath extends string, TInput, TOutput> {
+  method: TMethod;
+  path: TPath;
+  handler: (input: TInput, request: Request) => TOutput | Promise<TOutput>;
+}
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+export declare function route<TMethod extends HttpMethod, TPath extends string, TInput, TOutput>(
+  method: TMethod,
+  path: TPath,
+  handler: (input: TInput, request: Request) => TOutput | Promise<TOutput>,
+): ApiRouteDefinition<TMethod, TPath, TInput, TOutput>;
+export type AppApiRoutes = never; // users extend this via codegen
+
+type UnwrapPromise<T> = T extends Promise<infer U> ? U : T;
+type ApiClient<TRoutes extends { method: string; path: string; input: unknown; output: unknown }> = {
+  [TPath in TRoutes["path"]]: {
+    [TMethod in Extract<TRoutes, { path: TPath }>["method"]]: (
+      input?: Extract<TRoutes, { path: TPath; method: TMethod }>["input"],
+    ) => Promise<UnwrapPromise<Extract<TRoutes, { path: TPath; method: TMethod }>["output"]>>;
+  };
+};
+export declare function createClient<
+  TRoutes extends { method: string; path: string; input: unknown; output: unknown },
+>(baseUrl?: string): ApiClient<TRoutes>;
+
+// ── Validate (C2) ────────────────────────────────────────────────────────
+export interface FieldErrors { [field: string]: string[] }
+export declare class ValidationError extends Error {
+  readonly status: 400;
+  readonly fieldErrors: FieldErrors;
+}
+export declare function validate<T>(
+  schema: { safeParse?(i: unknown): unknown } | { parse(i: unknown): T },
+  input: FormData | Record<string, unknown>,
+): Promise<T>;
+
 // ── Client components ─────────────────────────────────────────────────────
 export declare function Scripts(): null;
 export declare function LiveReload(): ReactNode;
 export declare function Outlet(): ReactNode;
 
-export interface LinkProps { to: string; prefetch?: "hover" | "none"; children?: ReactNode; className?: string; [key: string]: unknown; }
+export interface LinkProps { to: string; prefetch?: "hover" | "none"; viewTransition?: boolean; children?: ReactNode; className?: string; [key: string]: unknown; }
 export declare function Link(props: LinkProps): ReactNode;
 
 export interface FormProps { method?: "post" | "put" | "delete"; action?: string; children?: ReactNode; [key: string]: unknown; }
@@ -106,4 +144,59 @@ export interface FetcherResult {
   load(path: string): Promise<void>;
   submit(path: string, opts: { method: string; body: FormData | Record<string, string> }): Promise<void>;
 }
+export interface StreamFetcherResult<T = unknown> {
+  events: AsyncGenerator<T>;
+  connect(actionId: string): AsyncGenerator<T>;
+}
 export declare function useFetcher(): FetcherResult;
+export declare function useFetcher<T>(opts: { stream: true }): StreamFetcherResult<T>;
+
+export interface SearchParamsResult<T extends Record<string, string> = Record<string, string>> {
+  searchParams: URLSearchParams;
+  getParam<K extends keyof T & string>(key: K): T[K] | null;
+  setSearchParams(updater: Record<string, string> | ((prev: URLSearchParams) => URLSearchParams)): void;
+}
+export declare function useSearchParams<T extends Record<string, string> = Record<string, string>>(): SearchParamsResult<T>;
+
+// ── Typed route context ───────────────────────────────────────────────────
+export declare function defineContext<T>(
+  factory: (args: { request: Request; params: Record<string, string> }) => T | Promise<T>
+): ContextFactory<T>;
+export interface ContextFactory<T> {
+  _factory: (args: { request: Request; params: Record<string, string> }) => T | Promise<T>;
+}
+
+// ── beforeLoad / useBlocker ───────────────────────────────────────────────
+export declare function useBlocker(shouldBlock: () => boolean): void;
+
+// ── i18n routing (E2) ────────────────────────────────────────────────────
+export declare function useLocale(defaultLocale?: string): string;
+export declare function useLocalizedLink(defaultLocale?: string): (path: string) => string;
+export interface I18nConfig { locales: string[]; defaultLocale: string; }
+
+// ── Adapter (D1) ──────────────────────────────────────────────────────────
+export interface BractAdapter {
+  fetch(request: Request): Promise<Response>;
+  listen?(port: number): void;
+}
+export declare class BunAdapter implements BractAdapter {
+  setHandler(handler: (request: Request) => Promise<Response>): void;
+  fetch(request: Request): Promise<Response>;
+  listen(port: number): void;
+  stop(): void;
+}
+
+// ── Cloudflare adapter (D2) ───────────────────────────────────────────────
+export declare function createCloudflareAdapter(
+  handler: (request: Request) => Promise<Response>,
+): BractAdapter & { fetch(request: Request, env: Record<string, unknown>, ctx: unknown): Promise<Response> };
+export declare function makeCloudflareHandler(
+  handler: (request: Request) => Promise<Response>,
+): { fetch(request: Request, env: Record<string, unknown>, ctx: unknown): Promise<Response> };
+
+// ── CSS Modules (D3) ─────────────────────────────────────────────────────
+export declare const cssModulesPlugin: unknown; // BunPlugin
+export declare function transformCssModule(filePath: string): Promise<{ map: Record<string, string>; css: string }>;
+
+// ── buildFetchHandler (D1) ───────────────────────────────────────────────
+export declare function buildFetchHandler(config: Partial<import("./config.d.ts").BractJSConfig>): (request: Request) => Promise<Response>;

package/types/route.d.ts

@@ -31,10 +31,21 @@ export type ActionFunction<T = unknown> = (
 
 export type MetaFunction<T = unknown> = (args: MetaArgs<T>) => MetaDescriptor[];
 
+export interface BeforeLoadArgs {
+  params: Record<string, string>;
+  context: Record<string, unknown>;
+  location: { pathname: string; search: string };
+}
+
+export type BeforeLoadFunction = (
+  args: BeforeLoadArgs,
+) => void | Response | Promise<void | Response>;
+
 export interface RouteModule<TLoader = unknown, TAction = unknown> {
   loader?: LoaderFunction<TLoader>;
   action?: ActionFunction<TAction>;
   meta?: MetaFunction<TLoader>;
+  beforeLoad?: BeforeLoadFunction;
   handle?: Record<string, unknown>;
   ErrorBoundary?: ComponentType<{ error: unknown }>;
   default?: ComponentType;