swift-rust 1.2.1 → 1.4.0

package/bin/dev-server.mjs

@@ -2,9 +2,27 @@
 import { existsSync, statSync, readFileSync, readdirSync, writeFileSync, unlinkSync, watch as fsWatch } from "node:fs";
 import { join, resolve, extname, relative, dirname, basename, sep } from "node:path";
 import { pathToFileURL } from "node:url";
+import { createRequire } from "node:module";
 import { performance } from "node:perf_hooks";
 import { errorOverlayHTML as renderErrorOverlay } from "./error-overlay.mjs";
 
+// Locate the bundled local fonts. Prefers the installed @swift-rust/font
+// package (so it works when swift-rust is installed from npm), falling back to
+// the monorepo source dir during local development.
+let _localFontDir;
+export function resolveLocalFontDir() {
+  if (_localFontDir) return _localFontDir;
+  const candidates = [];
+  try {
+    const req = createRequire(import.meta.url);
+    const pkg = req.resolve("@swift-rust/font/package.json");
+    candidates.push(join(dirname(pkg), "src", "local"), join(dirname(pkg), "dist", "local"));
+  } catch {}
+  candidates.push(join(import.meta.dirname, "..", "..", "..", "packages", "font", "src", "local"));
+  _localFontDir = candidates.find((d) => existsSync(d)) ?? candidates[candidates.length - 1];
+  return _localFontDir;
+}
+
 const cwd = process.cwd();
 const args = process.argv.slice(2);
 
@@ -590,8 +608,12 @@ async function scanFontsFromLayouts() {
 }
 
 function buildGoogleFontsLinkTag() {
-  if (GOOGLE_FONT_FAMILIES.size === 0) return "";
-  const families = Array.from(GOOGLE_FONT_FAMILIES)
+  // Layout-scanned families + families any factory registered during this
+  // render (globalThis.__SR_GOOGLE_FONTS__), so page-only fonts get a <link>.
+  const registered = globalThis.__SR_GOOGLE_FONTS__ instanceof Set ? globalThis.__SR_GOOGLE_FONTS__ : null;
+  const all = registered ? new Set([...GOOGLE_FONT_FAMILIES, ...registered]) : GOOGLE_FONT_FAMILIES;
+  if (all.size === 0) return "";
+  const families = Array.from(all)
     .map((f) => `family=${encodeURIComponent(f).replace(/%20/g, "+")}:wght@300..900`)
     .join("&");
   return `<link rel="preconnect" href="https://fonts.googleapis.com" />
@@ -740,7 +762,44 @@ export function isClientPage(file) {
     for (const raw of readFileSync(file, "utf8").split("\n")) {
       const t = raw.trim();
       if (!t || t.startsWith("//") || t.startsWith("/*") || t.startsWith("*")) continue;
-      return /^["']use client["'];?$/.test(t);
+      if (/^["']use client["'];?$/.test(t)) return true;
+      // allow other leading directives (e.g. 'use bun') before 'use client'
+      if (/^["']use [a-z]+["'];?$/.test(t)) continue;
+      return false;
+    }
+  } catch {}
+  return false;
+}
+
+const VALID_RUNTIMES = new Set(["bun", "edge", "node", "worker"]);
+
+// Detect a `'use bun' | 'use edge' | 'use node'` directive among a file's
+// leading string-literal directives (alongside an optional 'use client').
+export function detectRuntimeDirective(file) {
+  try {
+    for (const raw of readFileSync(file, "utf8").split("\n")) {
+      const t = raw.trim();
+      if (!t || t.startsWith("//") || t.startsWith("/*") || t.startsWith("*")) continue;
+      const m = t.match(/^["']use (bun|edge|node|worker)["'];?$/);
+      if (m) return m[1];
+      if (/^["']use [a-z]+["'];?$/.test(t)) continue; // other directive, keep scanning
+      return null; // first non-directive line ends the directive prologue
+    }
+  } catch {}
+  return null;
+}
+
+// True if a file declares a `'use <name>'` directive among its leading
+// string-literal directives (coexists with 'use client' / 'use bun' / etc.).
+export function hasUseDirective(file, name) {
+  try {
+    const re = new RegExp(`^["']use ${name}["'];?$`);
+    for (const raw of readFileSync(file, "utf8").split("\n")) {
+      const t = raw.trim();
+      if (!t || t.startsWith("//") || t.startsWith("/*") || t.startsWith("*")) continue;
+      if (re.test(t)) return true;
+      if (/^["']use [a-z]+["'];?$/.test(t)) continue;
+      return false;
     }
   } catch {}
   return false;
@@ -883,7 +942,7 @@ function buildRouteCtx(req, url, params, searchParams) {
     cookies,
     params,
     searchParams,
-    runtime: "node",
+    runtime: "bun",
     locals: { get: (k) => localsMap.get(k), set: (k, v) => localsMap.set(k, v) },
     request: req,
     __setCookies: setCookies,
@@ -903,19 +962,85 @@ function applyControl(c) {
   throw e;
 }
 
-/** Merge config.ts along the chain (inner overrides outer). */
-async function readMergedConfig(chain) {
+// swift-rust.config.json (read once) — provides the project default runtime.
+let _globalConfig;
+function loadGlobalConfig() {
+  if (_globalConfig !== undefined) return _globalConfig;
+  try {
+    _globalConfig = existsSync(SWIFT_RUST_CONFIG) ? JSON.parse(readFileSync(SWIFT_RUST_CONFIG, "utf8")) : {};
+  } catch {
+    _globalConfig = {};
+  }
+  return _globalConfig;
+}
+
+// Resolve a `'use bun'|'use edge'|'use node'` directive for a route's tree:
+// the page wins, then layouts innermost → outermost.
+function resolveTreeRuntimeDirective(route, chain) {
+  if (route?.file) {
+    const d = detectRuntimeDirective(route.file);
+    if (d) return d;
+  }
+  const layouts = collectRouteFiles(chain, "layout"); // outer → inner
+  for (let i = layouts.length - 1; i >= 0; i--) {
+    const d = detectRuntimeDirective(layouts[i].file);
+    if (d) return d;
+  }
+  return null;
+}
+
+// guard.ts runs only when explicitly opted in: a `'use guard'` directive in the
+// route tree (page/layout/config), config.ts `{ guard: true }`, or the global
+// `autoApplyGuard: true`. Default is off (autoApplyGuard defaults to false).
+function shouldRunGuard(route, chain, config) {
+  if (route?.file && hasUseDirective(route.file, "guard")) return true;
+  for (const { file } of collectRouteFiles(chain, "layout")) {
+    if (hasUseDirective(file, "guard")) return true;
+  }
+  for (const { file } of collectRouteFiles(chain, "config")) {
+    if (hasUseDirective(file, "guard")) return true;
+  }
+  if (config?.guard === true) return true;
+  if (loadGlobalConfig().autoApplyGuard === true) return true;
+  return false;
+}
+
+/** Merge config.ts along the chain (inner overrides outer) + resolve runtime. */
+async function readMergedConfig(chain, route) {
   let config = {};
   for (const { file } of collectRouteFiles(chain, "config")) {
     const mod = await loadModuleFresh(file);
     const c = mod.config ?? mod.default;
     if (c && typeof c === "object") config = { ...config, ...c, headers: { ...config.headers, ...c.headers } };
   }
-  // edge.ts / worker.ts force a runtime.
+  // edge.ts / worker.ts force a runtime (file-based, like a directive).
   const edge = await collectFirst(chain, "edge");
   if (edge && (edge.edge || edge.default)) config.runtime = "edge";
   const worker = await collectFirst(chain, "worker");
   if (worker && (worker.default || worker.bindings)) config.runtime = "worker";
+
+  // Runtime resolution (highest priority first):
+  //   'use bun|edge|node' directive  →  config.ts / edge.ts / worker.ts
+  //   →  swift-rust.config.json "runtime"  →  default "bun".
+  const explicitRuntime = config.runtime != null; // set by config.ts / edge / worker
+  const directive = resolveTreeRuntimeDirective(route, chain);
+  const fromJson = loadGlobalConfig().runtime;
+  let runtime = directive ?? config.runtime ?? fromJson ?? "bun";
+  if (!VALID_RUNTIMES.has(runtime)) {
+    process.stderr.write(
+      `  ${paint("yellow", "⚠")} invalid runtime ${JSON.stringify(runtime)} — falling back to "bun"\n`,
+    );
+    runtime = "bun";
+  }
+  config.runtime = runtime;
+  // A route is "dynamic" (emitted as a request-time function) when it explicitly
+  // opts into a runtime via a directive, config.ts/edge/worker, or config.dynamic.
+  config.dynamic = Boolean(directive) || explicitRuntime || config.dynamic === true;
+  config.headers = {
+    "x-swift-rust-runtime": runtime,
+    ...(config.dynamic ? { "x-swift-rust-dynamic": "1" } : {}),
+    ...config.headers,
+  };
   return config;
 }
 
@@ -961,7 +1086,8 @@ async function runRoutePipeline(route, ctx) {
   }
 
   // config.ts — merged, applied to the response by the caller.
-  const config = await readMergedConfig(chain);
+  const config = await readMergedConfig(chain, route);
+  ctx.runtime = config.runtime;
 
   // i18n.ts — resolve the active locale into locals (cookie/header/default).
   const i18nMod = await collectFirst(chain, "i18n");
@@ -994,19 +1120,23 @@ async function runRoutePipeline(route, ctx) {
     }
   }
 
-  // guard.ts — outer → inner
-  for (const { file } of collectRouteFiles(chain, "guard")) {
-    const mod = await loadModuleFresh(file);
-    const fn = mod.default ?? mod.guard;
-    if (typeof fn === "function") {
-      try {
-        applyControl(await fn(ctx));
-      } catch (e) {
-        if (e?.digest || e?.__response) throw e;
-        throw new RoutingFileError("guard", file, e);
+  // guard.ts — outer → inner. Opt-in via 'use guard' / config.guard /
+  // global autoApplyGuard (see shouldRunGuard).
+  if (shouldRunGuard(route, chain, config)) {
+    config.headers = { ...config.headers, "x-swift-rust-guard": "1" };
+    for (const { file } of collectRouteFiles(chain, "guard")) {
+      const mod = await loadModuleFresh(file);
+      const fn = mod.default ?? mod.guard;
+      if (typeof fn === "function") {
+        try {
+          applyControl(await fn(ctx));
+        } catch (e) {
+          if (e?.digest || e?.__response) throw e;
+          throw new RoutingFileError("guard", file, e);
+        }
+      } else if (mod.default !== undefined || mod.guard !== undefined) {
+        warnRoutingFile(file, `guard.ts must export a function (default export). ${relative(cwd, file)}`);
       }
-    } else if (mod.default !== undefined || mod.guard !== undefined) {
-      warnRoutingFile(file, `guard.ts must export a function (default export). ${relative(cwd, file)}`);
     }
   }
 
@@ -1126,6 +1256,98 @@ function cacheControlFromPlan(plan) {
   return null;
 }
 
+// ── Parallel routes (@slot dirs → fragment / fallback / default) ────────────
+function findDynamicChild(dir) {
+  try {
+    for (const e of readdirSync(dir, { withFileTypes: true })) {
+      if (e.isDirectory() && /^\[.+\]$/.test(e.name)) return join(dir, e.name);
+    }
+  } catch {}
+  return null;
+}
+
+// Resolve one @slot dir against the URL segments below its layout. Returns a
+// React element (the slot's matched page/fragment, its default.tsx, wrapped in
+// any slot layouts + a fallback.tsx Suspense boundary) or null.
+async function resolveSlotElement(slotDir, segs) {
+  const React = await import("react");
+  let cur = slotDir;
+  const slotLayouts = [];
+  let matched = true;
+  for (let i = 0; i < segs.length; i++) {
+    const layoutFile = findFile(cur, "layout");
+    if (layoutFile) slotLayouts.push(layoutFile);
+    let next = join(cur, segs[i]);
+    if (!existsSync(next) || !statSync(next).isDirectory()) {
+      const dyn = findDynamicChild(cur);
+      if (dyn) next = dyn;
+      else {
+        matched = false;
+        break;
+      }
+    }
+    cur = next;
+  }
+  let leafFile = null;
+  if (matched) {
+    const layoutFile = findFile(cur, "layout");
+    if (layoutFile && !slotLayouts.includes(layoutFile)) slotLayouts.push(layoutFile);
+    leafFile = findFile(cur, "page") || findFile(cur, "fragment");
+  }
+  if (!leafFile) {
+    // Unmatched slot → default.tsx (Next.js semantics), else nothing.
+    const def = findFile(slotDir, "default");
+    if (!def) return null;
+    leafFile = def;
+    slotLayouts.length = 0;
+    const rootLayout = findFile(slotDir, "layout");
+    if (rootLayout) slotLayouts.push(rootLayout);
+  }
+  let mod;
+  try {
+    mod = await loadModuleFresh(leafFile);
+  } catch {
+    return null;
+  }
+  const Comp = mod.default ?? mod.Page ?? mod.Fragment ?? mod.page ?? mod.fragment;
+  if (!Comp) return null;
+  let el = React.createElement(Comp, {});
+  for (let i = slotLayouts.length - 1; i >= 0; i--) {
+    try {
+      const lm = await loadModuleFresh(slotLayouts[i]);
+      const L = lm.default ?? lm.Layout ?? lm.layout;
+      if (L) el = React.createElement(L, null, el);
+    } catch {}
+  }
+  const fallbackFile = findFile(slotDir, "fallback");
+  if (fallbackFile) {
+    try {
+      const fb = await loadModuleFresh(fallbackFile);
+      const Fallback = fb.default ?? fb.Fallback;
+      if (Fallback) el = React.createElement(React.Suspense, { fallback: React.createElement(Fallback, {}) }, el);
+    } catch {}
+  }
+  return el;
+}
+
+// Collect all @slot dirs of a layout dir into named props for the layout.
+async function resolveParallelSlots(dir, segs) {
+  const slots = {};
+  let entries;
+  try {
+    entries = readdirSync(dir, { withFileTypes: true });
+  } catch {
+    return slots;
+  }
+  for (const e of entries) {
+    if (e.isDirectory() && e.name.startsWith("@")) {
+      const el = await resolveSlotElement(join(dir, e.name), segs);
+      if (el) slots[e.name.slice(1)] = el;
+    }
+  }
+  return slots;
+}
+
 async function renderRoute(urlPath, req) {
   const segments = urlToRouteSegments(urlPath);
   const route = resolvePageRoute(segments);
@@ -1137,6 +1359,10 @@ async function renderRoute(urlPath, req) {
   const errorFile = findErrorBoundary(segments);
   const loadingFile = findLoading(segments);
 
+  // Reset per-render Google font registry so each page only requests the
+  // families it actually uses (factories re-register during render).
+  globalThis.__SR_GOOGLE_FONTS__ = new Set();
+
   try {
     const React = await import("react");
     const url = req ? new URL(req.url) : new URL(urlPath, "http://localhost");
@@ -1199,15 +1425,48 @@ async function renderRoute(urlPath, req) {
         tree,
       );
     }
-    for (let i = layouts.length - 1; i >= 0; i--) {
-      const layoutMod = await loadModuleFresh(layouts[i].file);
-      const Layout = layoutMod.default ?? layoutMod.Layout ?? layoutMod.layout;
-      if (Layout) tree = React.createElement(Layout, null, tree);
+    // Wrap the page with each segment's template then layout, innermost dir
+    // first, so the nesting is layout > template > children (Next.js order).
+    // template.tsx re-mounts on navigation; on the server it just wraps.
+    const dirChain = route.dirChain && route.dirChain.length ? route.dirChain : [APP_DIR];
+    for (let i = dirChain.length - 1; i >= 0; i--) {
+      const dir = dirChain[i];
+      const templateFile = findFile(dir, "template");
+      if (templateFile) {
+        const tmod = await loadModuleFresh(templateFile);
+        const Template = tmod.default ?? tmod.Template ?? tmod.template;
+        if (Template) tree = React.createElement(Template, null, tree);
+      }
+      const layoutFile = findFile(dir, "layout");
+      if (layoutFile) {
+        const layoutMod = await loadModuleFresh(layoutFile);
+        const Layout = layoutMod.default ?? layoutMod.Layout ?? layoutMod.layout;
+        if (Layout) {
+          // Parallel routes: @slot subdirs of this layout become named props.
+          const slotProps = await resolveParallelSlots(dir, segments.slice(i));
+          tree = React.createElement(Layout, slotProps, tree);
+        }
+      }
+    }
+    // shell.tsx — root-only. Lets the app own the outer document
+    // (<html>/<body>/providers); the framework injects head assets + body
+    // scripts into what it renders (see the fullDocument branch in handleFetch).
+    let fullDocument = false;
+    const shellFile = findFile(APP_DIR, "shell");
+    if (shellFile) {
+      try {
+        const sm = await loadModuleFresh(shellFile);
+        const Shell = sm.default ?? sm.Shell ?? sm.shell;
+        if (Shell) {
+          tree = React.createElement(Shell, null, tree);
+          fullDocument = true;
+        }
+      } catch {}
     }
     const html = await renderToStringCompat(tree);
     if (runtime?.__setRouteContext) runtime.__setRouteContext(null);
     const metadata = await resolveMetadata(layouts.map((l) => l.file), route.file, route.params, segments);
-    return { status: 200, html, metadata, error: null, clientPage, pageFile: route.file, layoutFiles: layouts.map((l) => l.file), notFoundFile, errorFile, loadingFile, segments, setCookies: pipeline.setCookies, actionData: pipeline.actionData, config: pipeline.config, revalidatePlan: pipeline.revalidatePlan, seoHead: pipeline.seoHead, serverState: pipeline.serverState };
+    return { status: 200, html, metadata, error: null, clientPage, pageFile: route.file, layoutFiles: layouts.map((l) => l.file), notFoundFile, errorFile, loadingFile, segments, setCookies: pipeline.setCookies, actionData: pipeline.actionData, config: pipeline.config, revalidatePlan: pipeline.revalidatePlan, seoHead: pipeline.seoHead, serverState: pipeline.serverState, fullDocument };
   } catch (err) {
     const rt = await routerRuntime();
     if (rt?.__setRouteContext) rt.__setRouteContext(null);
@@ -1257,10 +1516,93 @@ async function renderRoute(urlPath, req) {
         }
       } catch {}
     }
+    // global-error.tsx — root-level boundary. It renders its own <html>/<body>,
+    // so it replaces the whole document. Only kicks in for uncaught errors when
+    // no closer error/error-recovery boundary handled them.
+    const globalErrorFile = findFile(APP_DIR, "global-error");
+    if (globalErrorFile) {
+      try {
+        const React = await import("react");
+        const mod = await loadModule(globalErrorFile, { bust: true });
+        const GlobalError = mod.default ?? mod.GlobalError;
+        if (GlobalError) {
+          const inner = await renderToStringCompat(
+            React.createElement(GlobalError, { error: err, reset: () => {} }),
+          );
+          // status:200 here only gates past the dev error overlay; the
+          // rawResponse carries the real 500 to the client.
+          return {
+            status: 200,
+            html: null,
+            error: null,
+            segments,
+            rawResponse: new Response(`<!DOCTYPE html>${inner}`, {
+              status: 500,
+              headers: { "Content-Type": "text/html; charset=utf-8" },
+            }),
+          };
+        }
+      } catch {}
+    }
     return { status: 500, html: null, error: err, segments, pageFile: route.file };
   }
 }
 
+async function resolveTransitionConfig(segments) {
+  const file = findRouteFileUp(segments || [], "transition");
+  if (!file) return null;
+  try {
+    const mod = await loadModuleFresh(file);
+    const cfg = mod.default && typeof mod.default === "object" ? mod.default : {};
+    const type = mod.type ?? cfg.type ?? "fade";
+    const out = { type };
+    const duration = mod.duration ?? cfg.duration;
+    if (duration) out.duration = Number(duration);
+    return out;
+  } catch {
+    return null;
+  }
+}
+
+async function resolvePrefetchConfig(segments) {
+  const file = findRouteFileUp(segments || [], "prefetch");
+  if (!file) return null;
+  try {
+    const mod = await loadModuleFresh(file);
+    const cfg = mod.default && typeof mod.default === "object" ? mod.default : {};
+    const strategy = mod.strategy ?? cfg.strategy ?? "hover";
+    const out = { strategy };
+    const margin = mod.margin ?? cfg.margin;
+    if (margin) out.margin = String(margin);
+    return out;
+  } catch {
+    return null;
+  }
+}
+
+const pendingOverlayCache = new Map();
+async function renderPendingOverlay(segments) {
+  const file = findRouteFileUp(segments || [], "pending");
+  if (!file) return "";
+  try {
+    let inner;
+    const cached = pendingOverlayCache.get(file);
+    if (cached && cached.gen === buildGeneration) {
+      inner = cached.html;
+    } else {
+      const React = await import("react");
+      const mod = await loadModuleFresh(file);
+      const Pending = mod.default ?? mod.Pending ?? mod.pending;
+      if (!Pending) return "";
+      inner = await renderToStringCompat(React.createElement(Pending, {}));
+      pendingOverlayCache.set(file, { gen: buildGeneration, html: inner });
+    }
+    return `<div id="__sr-pending" data-sr-pending hidden style="position:fixed;top:0;left:0;right:0;z-index:2147483646;pointer-events:none">${inner}</div>`;
+  } catch {
+    return "";
+  }
+}
+
 async function renderNotFound(segments) {
   const notFoundFile = findNotFound(segments);
   if (!notFoundFile) {
@@ -1349,6 +1691,7 @@ async function wrapInDocumentAsync({ head, body }) {
 <meta charset="utf-8" />
 <meta name="viewport" content="width=device-width, initial-scale=1" />
 ${fullHead}
+<script src="/_swift-rust/navigator.js" defer></script>
 <script src="/_swift-rust/hmr-client.js" defer></script>
 </head>
 <body>${body}</body>
@@ -1364,6 +1707,15 @@ async function tryHmrClient() {
   }
 }
 
+function readNavigatorClient() {
+  try {
+    const file = join(dirname(new URL(import.meta.url).pathname), "runtime", "navigator.js");
+    return readFileSync(file, "utf8");
+  } catch {
+    return null;
+  }
+}
+
 function shouldIgnoreFile(filename) {
   if (!filename) return true;
   const base = filename.split(sep).pop();
@@ -1530,15 +1882,8 @@ async function handleRequest(req, res) {
 
   if (pathname.startsWith("/_swift-rust/fonts/")) {
     const fontPath = join(
-      import.meta.dirname,
-      "..",
-      "..",
-      "..",
-      "packages",
-      "font",
-      "src",
-      "local",
-      decodeURIComponent(pathname.replace("/_swift-rust/fonts/", ""))
+      resolveLocalFontDir(),
+      decodeURIComponent(pathname.replace("/_swift-rust/fonts/", "")),
     );
     if (existsSync(fontPath) && statSync(fontPath).isFile()) {
       const ext = extname(fontPath).toLowerCase();
@@ -1747,6 +2092,14 @@ async function handleFetch(req) {
     return new Response("Not found", { status: 404 });
   }
 
+  if (pathname === "/_swift-rust/navigator.js") {
+    const client = readNavigatorClient();
+    if (client) {
+      return new Response(client, { headers: { "Content-Type": "application/javascript; charset=utf-8" } });
+    }
+    return new Response("// navigator unavailable", { status: 404, headers: { "Content-Type": "application/javascript" } });
+  }
+
   if (pathname === "/_swift-rust/image") {
     const target = url.searchParams.get("url");
     const w = parseInt(url.searchParams.get("w") || "0", 10);
@@ -1979,7 +2332,19 @@ async function handleFetch(req) {
   await scanFontsFromLayouts();
   // seo.tsx head + metadata head
   const headExtra = [metadataToHead(renderResult.metadata), renderResult.seoHead || ""].filter(Boolean).join("\n");
-  let doc = await wrapInDocumentAsync({ head: headExtra, body: renderResult.html || "" });
+  let doc;
+  if (renderResult.fullDocument) {
+    // shell.tsx already rendered <html>/<head>/<body>. Inject framework head
+    // assets (metadata, fonts, globals CSS, navigator/HMR scripts) into its
+    // <head>; body scripts below still append before </body>.
+    const inject = `${await buildHead(headExtra)}\n<script src="/_swift-rust/navigator.js" defer></script>\n<script src="/_swift-rust/hmr-client.js" defer></script>`;
+    doc = renderResult.html || "";
+    if (!/^\s*<!doctype/i.test(doc)) doc = `<!DOCTYPE html>${doc}`;
+    if (doc.includes("</head>")) doc = doc.replace("</head>", `${inject}\n</head>`);
+    else doc = doc.replace(/<body([\s>])/i, `<head>${inject}</head><body$1`);
+  } else {
+    doc = await wrapInDocumentAsync({ head: headExtra, body: renderResult.html || "" });
+  }
   // state.ts → window.__SR_STATE__ for client stores
   if (renderResult.serverState !== undefined) {
     const json = JSON.stringify(renderResult.serverState).replace(/</g, "\\u003c");
@@ -1989,6 +2354,22 @@ async function handleFetch(req) {
     const src = `/_swift-rust/island.js?p=${encodeURIComponent(renderResult.pageFile)}`;
     doc = doc.replace("</body>", `<script type="module" src="${src}"></script>\n</body>`);
   }
+  // pending.tsx → hidden overlay the client navigator reveals while a
+  // navigation is in flight (see runtime/navigator.js).
+  const pendingOverlay = await renderPendingOverlay(renderResult.segments);
+  if (pendingOverlay) doc = doc.replace("</body>", `${pendingOverlay}\n</body>`);
+  // prefetch.ts → client prefetch strategy for the navigator.
+  const prefetchCfg = await resolvePrefetchConfig(renderResult.segments);
+  if (prefetchCfg) {
+    const json = JSON.stringify(prefetchCfg).replace(/</g, "\\u003c");
+    doc = doc.replace("</body>", `<script>window.__SR_PREFETCH__=${json}</script>\n</body>`);
+  }
+  // transition.tsx → View Transitions config for the navigator's swap.
+  const transitionCfg = await resolveTransitionConfig(renderResult.segments);
+  if (transitionCfg) {
+    const json = JSON.stringify(transitionCfg).replace(/</g, "\\u003c");
+    doc = doc.replace("</body>", `<script>window.__SR_TRANSITION__=${json}</script>\n</body>`);
+  }
   const headers = new Headers({ "Content-Type": "text/html; charset=utf-8" });
   for (const c of renderResult.setCookies || []) headers.append("Set-Cookie", c);
   // config.ts headers