@reckona/mreact-router 0.0.50 → 0.0.52

package/dist/build.js

@@ -28,6 +28,7 @@ export async function buildApp(options) {
     const shouldBuildCloudflare = buildTargets.includes("cloudflare");
     const shouldBuildAwsLambda = buildTargets.includes("aws-lambda");
     const routes = await scanAppRoutes({ appDir: project.routesDir });
+    const vitePlugins = options.viteConfig?.plugins;
     const files = await collectBuildFiles(project.projectRoot, project.allowedSourceDirs, project.routesDir);
     const serverDir = join(options.outDir, "server");
     const clientDir = join(options.outDir, "client");
@@ -42,7 +43,7 @@ export async function buildApp(options) {
     await mkdir(join(clientDir, ".vite"), { recursive: true });
     await mkdir(join(clientDir, "assets", "routes"), { recursive: true });
     await copyPublicAssets(project.publicDir, join(clientDir, "public"));
-    const appConventionPublicAssets = await copyAppFileConventionAssets(project.routesDir, join(clientDir, "public"));
+    const appConventionPublicAssets = await copyAppFileConventionAssets(project.routesDir, clientDir);
     await copyPublicAssets(project.publicDir, clientDir);
     const publicAssets = [
         ...new Set([...(await collectPublicAssetPaths(project.publicDir)), ...appConventionPublicAssets]),
@@ -60,6 +61,7 @@ export async function buildApp(options) {
         project,
         projectRoot: project.projectRoot,
         routes,
+        vitePlugins,
     });
     const generatedImportPolicy = buildGeneratedImportPolicy({
         files,
@@ -80,6 +82,7 @@ export async function buildApp(options) {
         route,
         sourceMapDir: join(options.outDir, "source-maps", "client"),
         sourceMaps: project.clientSourceMaps,
+        vitePlugins,
     })));
     const navigationRuntimeScript = clientRoutes.some((route) => route.navigation === true && !route.client)
         ? await writeNavigationRuntimeBundle(clientDir)
@@ -93,7 +96,9 @@ export async function buildApp(options) {
         appDir: project.routesDir,
         assetBaseUrl: project.assetBaseUrl,
         clientRoutes: clientManifestRoutes,
+        project,
         routes,
+        serverModules,
     });
     let cloudflareRouteModules;
     if (shouldBuildCloudflare) {
@@ -105,6 +110,7 @@ export async function buildApp(options) {
             routesDir: project.routesDir,
             routes,
             serverModules,
+            vitePlugins,
         });
     }
     const serverManifest = {
@@ -438,6 +444,15 @@ function isNodeError(error) {
 async function prerenderStaticRoutes(options) {
     const clientScripts = new Map(options.clientRoutes.flatMap((route) => route.client && route.script !== undefined ? [[route.path, route.script]] : []));
     const prerendered = {};
+    const importPolicy = {
+        allowedPackages: await readDeclaredProjectPackages(options.project.projectRoot),
+        allowedSourceDirs: options.project.allowedSourceDirs,
+        projectRoot: options.project.projectRoot,
+    };
+    const serverModuleMap = new Map(Object.entries(options.serverModules).map(([file, artifact]) => [
+        join(options.project.projectRoot, file),
+        artifact,
+    ]));
     for (const route of options.routes) {
         if (route.kind !== "page") {
             continue;
@@ -451,7 +466,9 @@ async function prerenderStaticRoutes(options) {
                 appDir: options.appDir,
                 assetBaseUrl: options.assetBaseUrl,
                 clientScripts,
+                importPolicy,
                 request: new Request(`http://mreact.local${pathname}`),
+                serverModules: serverModuleMap,
             });
             const headers = {};
             response.headers.forEach((value, key) => {
@@ -542,6 +559,7 @@ async function buildServerModuleArtifacts(options) {
                     code: stripRouteLoaderOnlyExports(source),
                     filename: absoluteFile,
                     importPolicy: requestModuleImportPolicy,
+                    vitePlugins: options.vitePlugins,
                 });
                 artifact.loader = {
                     code,
@@ -554,6 +572,7 @@ async function buildServerModuleArtifacts(options) {
                     code: stripRouteMetadataOnlyExports(source),
                     filename: absoluteFile,
                     importPolicy: requestModuleImportPolicy,
+                    vitePlugins: options.vitePlugins,
                 });
                 artifact.routeMetadata = {
                     code,
@@ -568,6 +587,7 @@ async function buildServerModuleArtifacts(options) {
                         importPolicy: requestModuleImportPolicy,
                         routeKind: route?.kind,
                         source,
+                        vitePlugins: options.vitePlugins,
                     }),
                     sourceHash: hashText(source),
                 };
@@ -728,6 +748,7 @@ async function buildRequestModuleArtifactCode(options) {
         code: stripRouteRequestOnlyExports(options.source),
         filename: options.filename,
         importPolicy: options.importPolicy,
+        vitePlugins: options.vitePlugins,
     });
 }
 async function bundleRouteLoaderModuleCode(options) {
@@ -747,6 +768,7 @@ async function bundleRouteRequestModuleCode(options) {
         code: options.code,
         filename: options.filename,
         platform: "node",
+        vitePlugins: options.vitePlugins,
         plugins: [
             createAppRouterImportPolicyPlugin({
                 appDir: options.appDir,
@@ -794,18 +816,24 @@ async function writeCloudflareRouteModules(options) {
         const routeId = routeIdForPath(route.path);
         const routeModuleFile = `routes/${routeId}.mjs`;
         let routeModuleExports;
-        if (route.kind === "server") {
+        if (route.kind === "server" || route.kind === "metadata") {
             try {
                 const routeOutput = await buildCloudflareServerRouteModule({
                     filename: route.file,
+                    vitePlugins: options.vitePlugins,
                 });
                 const serverRouteFile = `routes/${routeId}.${hashText(routeOutput).slice(0, 8)}.server.mjs`;
                 await writeFile(join(options.cloudflareDir, serverRouteFile), routeOutput);
                 const serverRouteImport = `./${serverRouteFile.split("/").pop() ?? serverRouteFile}`;
-                routeModuleExports = [`export * from ${JSON.stringify(serverRouteImport)};`];
+                routeModuleExports = [
+                    `export * from ${JSON.stringify(serverRouteImport)};`,
+                    ...(route.kind === "metadata"
+                        ? [`export { default } from ${JSON.stringify(serverRouteImport)};`]
+                        : []),
+                ];
             }
             catch (error) {
-                throw new Error(`Failed to build Cloudflare server route module for ${routeFile}: ${errorMessage(error)}`);
+                throw new Error(`Failed to build Cloudflare ${route.kind} route module for ${routeFile}: ${errorMessage(error)}`);
             }
             await writeFile(join(options.cloudflareDir, routeModuleFile), `${routeModuleExports.join("\n")}\n`);
             registryEntries.push(`${JSON.stringify(routeFile)}: () => import(${JSON.stringify(`./${routeModuleFile}`)})`);
@@ -827,12 +855,14 @@ async function writeCloudflareRouteModules(options) {
                     projectRoot: options.projectRoot,
                     routesDir: options.routesDir,
                     serverModules: options.serverModules,
+                    vitePlugins: options.vitePlugins,
                 })
                 : await buildCloudflareStringRouteComponentModule({
                     filename: route.file,
                     projectRoot: options.projectRoot,
                     routesDir: options.routesDir,
                     serverModules: options.serverModules,
+                    vitePlugins: options.vitePlugins,
                 });
             const componentFile = `routes/${routeId}.${hashText(componentOutput).slice(0, 8)}.component.mjs`;
             await writeFile(join(options.cloudflareDir, componentFile), componentOutput);
@@ -849,6 +879,7 @@ async function writeCloudflareRouteModules(options) {
                 const loaderOutput = await buildCloudflareRouteLoaderModule({
                     filename: route.file,
                     projectRoot: options.projectRoot,
+                    vitePlugins: options.vitePlugins,
                 });
                 const loaderFile = `routes/${routeId}.${hashText(loaderOutput).slice(0, 8)}.loader.mjs`;
                 await writeFile(join(options.cloudflareDir, loaderFile), loaderOutput);
@@ -873,15 +904,25 @@ async function writeCloudflareRouteModules(options) {
     return { registryFile: "route-modules.mjs" };
 }
 async function buildCloudflareServerComponentModule(options) {
+    const metadataModule = await buildCloudflareRouteMetadataExportModule({
+        filename: options.filename,
+        vitePlugins: options.vitePlugins,
+    });
     const entry = `import * as routeModule from ${JSON.stringify(options.filename)};
+${metadataModule === undefined ? "const metadataModule = {};" : 'import * as metadataModule from "mreact:metadata";'}
 
 const component = routeModule.default ?? routeModule.App ?? Object.values(routeModule).find((value) => typeof value === "function");
 export const App = component;
 export default component;
+export const generateMetadata = metadataModule.generateMetadata;
+export const metadata = metadataModule.metadata;
 export const slots = routeModule.slots;`;
-    return bundleCloudflareModule({
+    return bundleCloudflareVirtualModule({
         entry,
         filename: `${options.filename}.mreact-cloudflare-component.js`,
+        modules: metadataModule === undefined
+            ? new Map()
+            : new Map([["mreact:metadata", metadataModule]]),
         plugins: [
             cloudflareServerSourceTransformPlugin({
                 projectRoot: options.projectRoot,
@@ -891,6 +932,7 @@ export const slots = routeModule.slots;`;
             cloudflareWorkspaceRuntimePlugin(),
         ],
         resolveDir: dirname(options.filename),
+        vitePlugins: options.vitePlugins,
     });
 }
 async function buildCloudflareStringRouteComponentModule(options) {
@@ -901,6 +943,7 @@ async function buildCloudflareStringRouteComponentModule(options) {
             projectRoot: options.projectRoot,
             serverModules: options.serverModules,
             serverOutput: "string",
+            vitePlugins: options.vitePlugins,
         });
     }
     const pageModule = await buildCloudflareComponentExportModule({
@@ -908,15 +951,17 @@ async function buildCloudflareStringRouteComponentModule(options) {
         projectRoot: options.projectRoot,
         serverModules: options.serverModules,
         serverOutput: "string",
+        vitePlugins: options.vitePlugins,
     });
     const shellModules = await Promise.all(shellFiles.map((shell) => buildCloudflareComponentExportModule({
         filename: shell.file,
         projectRoot: options.projectRoot,
         serverModules: options.serverModules,
         serverOutput: "string",
+        vitePlugins: options.vitePlugins,
     })));
     const shellImports = shellFiles.map((_, index) => `import * as shell${index} from "mreact:shell-${index}";`);
-    const shellDefinitions = shellFiles.map((shell, index) => `{ component: selectComponent(shell${index}, ${JSON.stringify(shell.file)}), id: ${JSON.stringify(shell.id)}, kind: ${JSON.stringify(shell.kind)} }`);
+    const shellDefinitions = shellFiles.map((shell, index) => `{ component: selectComponent(shell${index}, ${JSON.stringify(shell.file)}), id: ${JSON.stringify(shell.id)}, kind: ${JSON.stringify(shell.kind)}, module: shell${index} }`);
     const entry = `import * as pageModule from "mreact:page";
 ${shellImports.join("\n")}
 
@@ -929,7 +974,8 @@ export default renderCloudflareStringRoute;
 async function renderCloudflareStringRoute(props) {
   const slotHtml = await renderRouteSlots(pageModule.slots, props);
   const layoutShells = await renderLayoutShells(shells, props, slotHtml);
-  let html = "<!DOCTYPE html>" + cloudflareRouteHeadTags(props.clientManifest, props.route.path);
+  const metadata = await resolveRouteMetadata([...shells.map((shell) => shell.module), pageModule], props);
+  let html = "<!DOCTYPE html>";
   for (const shell of layoutShells) {
     html += shell.prefix;
   }
@@ -937,6 +983,7 @@ async function renderCloudflareStringRoute(props) {
   for (const shell of [...layoutShells].reverse()) {
     html += shell.suffix;
   }
+  html = injectCloudflareHead(html, metadata, cloudflareRouteHeadTags(props.clientManifest, props.route.path));
   return new Response(html, {
     headers: {
       "content-type": "text/html; charset=utf-8"
@@ -973,6 +1020,7 @@ ${cloudflareShellRuntimeSource()}`;
         ]),
         plugins: [cloudflareWorkspaceRuntimePlugin()],
         resolveDir: dirname(options.filename),
+        vitePlugins: options.vitePlugins,
     });
 }
 async function buildCloudflareStreamRouteComponentModule(options) {
@@ -981,6 +1029,7 @@ async function buildCloudflareStreamRouteComponentModule(options) {
         projectRoot: options.projectRoot,
         serverModules: options.serverModules,
         serverOutput: "stream",
+        vitePlugins: options.vitePlugins,
     });
     const shellFiles = await cloudflareShellFilesForPage(options.routesDir, options.filename);
     const shellModules = await Promise.all(shellFiles.map((shell) => buildCloudflareComponentExportModule({
@@ -988,9 +1037,10 @@ async function buildCloudflareStreamRouteComponentModule(options) {
         projectRoot: options.projectRoot,
         serverModules: options.serverModules,
         serverOutput: "string",
+        vitePlugins: options.vitePlugins,
     })));
     const shellImports = shellFiles.map((_, index) => `import * as shell${index} from "mreact:shell-${index}";`);
-    const shellDefinitions = shellFiles.map((shell, index) => `{ component: selectComponent(shell${index}, ${JSON.stringify(shell.file)}), id: ${JSON.stringify(shell.id)}, kind: ${JSON.stringify(shell.kind)} }`);
+    const shellDefinitions = shellFiles.map((shell, index) => `{ component: selectComponent(shell${index}, ${JSON.stringify(shell.file)}), id: ${JSON.stringify(shell.id)}, kind: ${JSON.stringify(shell.kind)}, module: shell${index} }`);
     const entry = `import { createStringSink, renderOutOfOrderReorderScript, renderToReadableStream } from "@reckona/mreact-server";
 import * as pageModule from "mreact:page";
 ${shellImports.join("\n")}
@@ -1005,10 +1055,15 @@ function renderCloudflareStreamRoute(props) {
   const body = renderToReadableStream(async ($sink) => {
     const slotHtml = await renderRouteSlots(pageModule.slots, props);
     const layoutShells = await renderLayoutShells(shells, props, slotHtml);
+    const metadata = await resolveRouteMetadata([...shells.map((shell) => shell.module), pageModule], props);
+    const routeHeadTags = cloudflareRouteHeadTags(props.clientManifest, props.route.path);
     $sink.append("<!DOCTYPE html>");
-    $sink.append(cloudflareRouteHeadTags(props.clientManifest, props.route.path));
-    for (const shell of layoutShells) {
-      $sink.append(shell.prefix);
+    if (layoutShells.length === 0) {
+      $sink.append(injectCloudflareHead("", metadata, routeHeadTags));
+    }
+    for (let index = 0; index < layoutShells.length; index += 1) {
+      const shell = layoutShells[index];
+      $sink.append(index === 0 ? injectCloudflareHead(shell.prefix, metadata, routeHeadTags) : shell.prefix);
     }
     await pageComponent($sink, props);
     renderOutOfOrderReorderScript($sink);
@@ -1060,6 +1115,7 @@ ${cloudflareShellRuntimeSource()}`;
         ]),
         plugins: [cloudflareWorkspaceRuntimePlugin()],
         resolveDir: dirname(options.filename),
+        vitePlugins: options.vitePlugins,
     });
 }
 function cloudflareShellRuntimeSource() {
@@ -1128,6 +1184,160 @@ function readSlotName(attributes) {
   return match?.[1] ?? match?.[2];
 }
 
+async function resolveRouteMetadata(modules, props) {
+  const metadata = [];
+  const context = {
+    data: props.data,
+    params: props.params,
+    request: props.request
+  };
+  for (const module of modules) {
+    let next = module.metadata;
+    if (typeof module.generateMetadata === "function") {
+      const generated = await module.generateMetadata(context);
+      next = mergeRouteMetadata([next, generated].filter(Boolean));
+    }
+    if (next !== undefined) {
+      metadata.push(next);
+    }
+  }
+  return mergeRouteMetadata(metadata);
+}
+
+function mergeRouteMetadata(metadata) {
+  if (metadata.length === 0) {
+    return undefined;
+  }
+  return metadata.reduce((merged, next) => ({
+    ...merged,
+    ...next,
+    alternates: mergeObject(merged.alternates, next.alternates),
+    csp: mergeObject(merged.csp, next.csp),
+    head: mergeArrays(merged.head, next.head),
+    icons: mergeObject(merged.icons, next.icons),
+    openGraph: {
+      ...mergeObject(merged.openGraph, next.openGraph),
+      images: mergeArrays(merged.openGraph?.images, next.openGraph?.images),
+    },
+  }), {});
+}
+
+function mergeObject(left, right) {
+  if (left === undefined) {
+    return right;
+  }
+  if (right === undefined) {
+    return left;
+  }
+  return { ...left, ...right };
+}
+
+function mergeArrays(left, right) {
+  if (left === undefined || left.length === 0) {
+    return right;
+  }
+  if (right === undefined || right.length === 0) {
+    return left;
+  }
+  return [...left, ...right];
+}
+
+function injectCloudflareHead(html, metadata, routeHeadTags) {
+  const metadataTags = routeMetadataHeadTags(metadata);
+  const tags = routeHeadTags + metadataTags;
+  let nextHtml = metadata?.lang === undefined ? html : injectHtmlLangAttribute(html, metadataString(metadata.lang));
+
+  if (metadata?.title !== undefined) {
+    nextHtml = nextHtml.replace(/<title\\b[^>]*>[\\s\\S]*?<\\/title\\s*>/i, "");
+  }
+
+  if (tags === "") {
+    return nextHtml;
+  }
+  if (/<head(?:\\s[^>]*)?>/i.test(nextHtml)) {
+    return nextHtml.replace(/<head(\\s[^>]*)?>/i, (match) => \`\${match}\${tags}\`);
+  }
+  if (/<html(?:\\s[^>]*)?>/i.test(nextHtml)) {
+    return nextHtml.replace(/<html(\\s[^>]*)?>/i, (match) => \`\${match}<head>\${tags}</head>\`);
+  }
+  return \`<head>\${tags}</head>\${nextHtml}\`;
+}
+
+function routeMetadataHeadTags(metadata) {
+  if (metadata === undefined) {
+    return "";
+  }
+  const tags = [
+    metadata.title === undefined ? undefined : \`<title>\${escapeHtml(metadataString(metadata.title))}</title>\`,
+    metadata.description === undefined ? undefined : \`<meta name="description" content="\${escapeHtmlAttribute(metadataString(metadata.description))}">\`,
+    metadata.alternates?.canonical === undefined ? undefined : \`<link rel="canonical" href="\${escapeHtmlAttribute(metadataString(metadata.alternates.canonical))}">\`,
+    metadata.openGraph?.title === undefined ? undefined : \`<meta property="og:title" content="\${escapeHtmlAttribute(metadataString(metadata.openGraph.title))}">\`,
+    metadata.openGraph?.description === undefined ? undefined : \`<meta property="og:description" content="\${escapeHtmlAttribute(metadataString(metadata.openGraph.description))}">\`,
+    ...openGraphImages(metadata.openGraph).map((image) => \`<meta property="og:image" content="\${escapeHtmlAttribute(image)}">\`),
+    metadata.icons?.icon === undefined ? undefined : \`<link rel="icon" href="\${escapeHtmlAttribute(metadataString(metadata.icons.icon))}">\`,
+    metadata.icons?.apple === undefined ? undefined : \`<link rel="apple-touch-icon" href="\${escapeHtmlAttribute(metadataString(metadata.icons.apple))}">\`,
+    ...headDescriptorTags(metadata.head, metadata.csp?.nonce),
+  ];
+  return tags.filter((tag) => tag !== undefined).join("");
+}
+
+function openGraphImages(openGraph) {
+  if (openGraph?.images !== undefined && openGraph.images.length > 0) {
+    return openGraph.images.map(metadataImageUrl);
+  }
+  return openGraph?.image === undefined ? [] : [metadataImageUrl(openGraph.image)];
+}
+
+function headDescriptorTags(descriptors, nonce) {
+  return (descriptors ?? []).flatMap((descriptor) => {
+    const descriptorNonce = descriptor.nonce === true ? nonce : descriptor.nonce || undefined;
+    const attrs = {
+      ...descriptor.attrs,
+      ...(descriptorNonce === undefined ? {} : { nonce: descriptorNonce }),
+    };
+    const attrText = Object.entries(attrs)
+      .flatMap(([name, value]) => {
+        if (value === undefined || value === false) {
+          return [];
+        }
+        return value === true
+          ? [escapeHtmlAttribute(name)]
+          : [\`\${escapeHtmlAttribute(name)}="\${escapeHtmlAttribute(String(value))}"\`];
+      })
+      .join(" ");
+    const open = attrText === "" ? \`<\${descriptor.tag}>\` : \`<\${descriptor.tag} \${attrText}>\`;
+    if (descriptor.tag === "meta" || descriptor.tag === "link" || descriptor.tag === "base") {
+      return [open.slice(0, -1) + ">"];
+    }
+    return [\`\${open}\${String(descriptor.content ?? "").replaceAll("<", "\\\\u003c")}</\${descriptor.tag}>\`];
+  });
+}
+
+function injectHtmlLangAttribute(html, lang) {
+  const escapedLang = escapeHtmlAttribute(lang);
+  if (!/<html(?:\\s[^>]*)?>/i.test(html)) {
+    return html;
+  }
+  return html.replace(/<html(\\s[^>]*)?>/i, (_match, attrs = "") => {
+    const strippedAttrs = String(attrs).replace(/\\s+lang=(?:"[^"]*"|'[^']*'|[^\\s>]+)/i, "");
+    return \`<html lang="\${escapedLang}"\${strippedAttrs}>\`;
+  });
+}
+
+function metadataString(value) {
+  if (typeof value === "string" || typeof value === "number" || typeof value === "boolean") {
+    return String(value);
+  }
+  throw new Error("Invalid metadata field: expected string, number, or boolean.");
+}
+
+function metadataImageUrl(value) {
+  if (typeof value === "object" && value !== null && "url" in value) {
+    return metadataString(value.url);
+  }
+  return metadataString(value);
+}
+
 function cloudflareRouteHeadTags(manifest, routePath) {
   const route = manifest.routes.find((route) => route.path === routePath);
   const css = route?.css ?? [];
@@ -1146,18 +1356,35 @@ function escapeHtmlAttribute(value) {
     .replaceAll("&", "&amp;")
     .replaceAll('"', "&quot;")
     .replaceAll("<", "&lt;");
+}
+
+function escapeHtml(value) {
+  return String(value ?? "")
+    .replaceAll("&", "&amp;")
+    .replaceAll("<", "&lt;")
+    .replaceAll(">", "&gt;");
 }`;
 }
 async function buildCloudflareComponentExportModule(options) {
+    const metadataModule = await buildCloudflareRouteMetadataExportModule({
+        filename: options.filename,
+        vitePlugins: options.vitePlugins,
+    });
     const entry = `import * as routeModule from ${JSON.stringify(options.filename)};
+${metadataModule === undefined ? "const metadataModule = {};" : 'import * as metadataModule from "mreact:metadata";'}
 
 const component = routeModule.default ?? routeModule.App ?? Object.values(routeModule).find((value) => typeof value === "function");
 export const App = component;
 export default component;
+export const generateMetadata = metadataModule.generateMetadata;
+export const metadata = metadataModule.metadata;
 export const slots = routeModule.slots;`;
-    return bundleCloudflareModule({
+    return bundleCloudflareVirtualModule({
         entry,
         filename: `${options.filename}.mreact-cloudflare-${options.serverOutput}-component.js`,
+        modules: metadataModule === undefined
+            ? new Map()
+            : new Map([["mreact:metadata", metadataModule]]),
         plugins: [
             cloudflareServerSourceTransformPlugin({
                 projectRoot: options.projectRoot,
@@ -1167,6 +1394,7 @@ export const slots = routeModule.slots;`;
             cloudflareWorkspaceRuntimePlugin(),
         ],
         resolveDir: dirname(options.filename),
+        vitePlugins: options.vitePlugins,
     });
 }
 async function buildCloudflareRouteLoaderModule(options) {
@@ -1176,6 +1404,23 @@ async function buildCloudflareRouteLoaderModule(options) {
         filename: `${options.filename}.mreact-cloudflare-loader.js`,
         plugins: [cloudflareWorkspaceRuntimePlugin()],
         resolveDir: dirname(options.filename),
+        vitePlugins: options.vitePlugins,
+    });
+}
+async function buildCloudflareRouteMetadataExportModule(options) {
+    const source = await readFile(options.filename, "utf8");
+    if (!hasMetadataExport(source)) {
+        return undefined;
+    }
+    const entry = `import * as routeMetadataModule from ${JSON.stringify(options.filename)};
+export const generateMetadata = routeMetadataModule.generateMetadata;
+export const metadata = routeMetadataModule.metadata;`;
+    return bundleCloudflareModule({
+        entry,
+        filename: `${options.filename}.mreact-cloudflare-metadata.js`,
+        plugins: [cloudflareWorkspaceRuntimePlugin()],
+        resolveDir: dirname(options.filename),
+        vitePlugins: options.vitePlugins,
     });
 }
 async function buildCloudflareServerRouteModule(options) {
@@ -1196,6 +1441,7 @@ export default defaultHandler;`;
         filename: `${options.filename}.mreact-cloudflare-server-route.js`,
         plugins: [cloudflareWorkspaceRuntimePlugin()],
         resolveDir: dirname(options.filename),
+        vitePlugins: options.vitePlugins,
     });
 }
 async function bundleCloudflareModule(options) {
@@ -1207,6 +1453,7 @@ async function bundleCloudflareModule(options) {
         preserveExports: true,
         plugins: options.plugins,
         target: "es2022",
+        vitePlugins: options.vitePlugins,
     });
     const code = output.code;
     if (code === undefined) {
@@ -1242,6 +1489,7 @@ async function bundleCloudflareVirtualModule(options) {
             ...options.plugins,
         ],
         resolveDir: options.resolveDir,
+        vitePlugins: options.vitePlugins,
     });
 }
 async function cloudflareShellFilesForPage(routesDir, pageFile) {
@@ -1337,6 +1585,7 @@ function cloudflareWorkspaceRuntimePlugin() {
     });
     const routerCachePath = packageFile("router", "@reckona/mreact-router", "cache");
     const routerCookiesPath = packageFile("router", "@reckona/mreact-router", "cookies");
+    const routerCsrfPath = packageFile("router", "@reckona/mreact-router", "csrf");
     const routerDeferredPath = packageFile("router", "@reckona/mreact-router", "deferred");
     const routerI18nPath = packageFile("router", "@reckona/mreact-router", "i18n");
     const routerLinkPath = packageFile("router", "@reckona/mreact-router", "link");
@@ -1403,6 +1652,7 @@ export function escapeHtmlBatch(values) {
             buildApi.onLoad({ filter: /^index$/, namespace: "mreact-cloudflare-router-index" }, () => ({
                 contents: `export { cacheControl, revalidatePath } from ${JSON.stringify(routerCachePath)};
 export { deleteCookie, parseCookieHeader, serializeCookie, setCookie } from ${JSON.stringify(routerCookiesPath)};
+export { createFormCsrfToken, formCsrfCookie, formCsrfFieldName, serverActionCookie, validateFormCsrf } from ${JSON.stringify(routerCsrfPath)};
 export { defer, isDeferredLoaderData } from ${JSON.stringify(routerDeferredPath)};
 export { defineMessages, detectLocale } from ${JSON.stringify(routerI18nPath)};
 export { Link, linkProps } from ${JSON.stringify(routerLinkPath)};
@@ -1420,7 +1670,8 @@ export { cookies, headers, html, json, next, notFound, redirect, redirectExterna
     };
 }
 function cloudflareRouteRequiresGeneratedModule(route, prerenderedRoutes) {
-    return (route.kind === "server" ||
+    return (route.kind === "metadata" ||
+        route.kind === "server" ||
         (route.kind === "page" &&
             (route.segments.some((segment) => segment.kind !== "static") ||
                 prerenderedRoutes[route.path] === undefined)));
@@ -1455,6 +1706,7 @@ async function writeClientRouteBundle(options) {
         pageFile: route.file,
         projectRoot: options.projectRoot,
         routeId: routeIdForPath(route.path),
+        vitePlugins: options.vitePlugins,
     });
     const source = await readFile(route.file, "utf8");
     const clientSource = stripRouteClientOnlyExports(source);
@@ -1545,6 +1797,7 @@ async function writeRouteCssAssets(options) {
         filename: options.pageFile,
         minify: true,
         platform: "browser",
+        vitePlugins: options.vitePlugins,
     });
     const cssAssets = (output.assets ?? []).filter((asset) => asset.fileName.endsWith(".css"));
     const written = [];