${appHtml}

\n \n \n\n`;\n}\n\n/**\n * Create the app handler.\n *\n * @param options - App configuration\n * @returns A fetch handler: (req: Request) => Promise\n *\n * @example\n * ```ts\n * import { createApp, defineRoutes } from \"https://esm.town/v/stevekrouse/react-router/mod.ts\";\n * import { Home } from \"./routes/Home.tsx\";\n *\n * // Must be a named export so the client can import it\n * export const routes = defineRoutes([\n * { path: \"/\", Component: Home },\n * ]);\n *\n * export default createApp({ routes });\n * ```\n */\nexport function createApp(\n options: AppOptions,\n): (req: Request) => Promise {\n const app = new Hono();\n // --- Static file serving ---\n // All project source files are served under /__src/ so the browser can import them.\n // This avoids conflicts with React Router page routes.\n app.get(\"/__src/*\", async (c) => {\n // Strip the /__src prefix to get the actual file path\n const filePath = c.req.path.replace(\"/__src\", \"\");\n\n const { serveFile } = await import(\"https://esm.town/v/std/utils/index.ts\");\n const resp = await serveFile(filePath);\n\n // Fix MIME type for extensionless files (e.g. jsx-runtime from @jsxImportSource).\n // The browser requires a valid JS MIME type for module scripts.\n const basename = filePath.split(\"/\").pop() || \"\";\n if (!basename.includes(\".\")) {\n const body = await resp.text();\n return c.body(body, {\n headers: { \"Content-Type\": \"application/javascript\" },\n });\n }\n return resp;\n });\n\n // --- Library files served under /__lib/ ---\n app.get(\"/__lib/client-runtime.ts\", async (c) => {\n const { serveFile } = await import(\"https://esm.town/v/std/utils/index.ts\");\n return serveFile(\"/client-runtime.ts\", import.meta.url);\n });\n app.get(\"/__lib/routes.ts\", async (c) => {\n const { serveFile } = await import(\"https://esm.town/v/std/utils/index.ts\");\n return serveFile(\"/routes.ts\", import.meta.url);\n });\n app.get(\"/__lib/types.ts\", async (c) => {\n const { serveFile } = await import(\"https://esm.town/v/std/utils/index.ts\");\n return serveFile(\"/types.ts\", import.meta.url);\n });\n\n // Serve the generated client bootstrap script.\n app.get(\"/__client.js\", (c) => {\n // Resolve the routes file path for the client to import.\n // If routesFile is provided, use it directly as a /__src/ path.\n // Otherwise, derive from VALTOWN_ENTRYPOINT.\n let routesSrc: string;\n if (options.routesFile) {\n // Normalize: strip leading \"./\" if present\n const cleaned = options.routesFile.replace(/^\\.\\//, \"\");\n routesSrc = `/__src/${cleaned}`;\n } else {\n // VALTOWN_ENTRYPOINT is a full esm.town URL like:\n // https://esm.town/v/handle/valName@version-branch/path/to/file.tsx\n // We need to extract just the project-relative path, e.g. \"/path/to/file.tsx\"\n const entrypoint = Deno.env.get(\"VALTOWN_ENTRYPOINT\") || \"\";\n const pathname = new URL(entrypoint).pathname;\n // Strip /v/handle/valName@version-branch prefix to get project-relative path\n const match = pathname.match(/^\\/v\\/[^/]+\\/[^/]+\\/(.*)/);\n const relativePath = match ? `/${match[1]}` : pathname;\n routesSrc = `/__src${relativePath}`;\n }\n\n const script = `\nimport { hydrate } from \"/__lib/client-runtime.ts\";\nimport { routes } from \"${routesSrc}\";\nhydrate(routes, \"${options.rootId || \"root\"}\");\n`;\n return c.body(script, {\n headers: { \"Content-Type\": \"application/javascript\" },\n });\n });\n\n // --- User escape hatch: Hono-level setup ---\n if (options.setup) {\n options.setup(app);\n }\n\n // --- React Router SSR ---\n const { query, dataRoutes } = createStaticHandler(options.routes);\n\n app.all(\"*\", async (c) => {\n const isDataRequest = c.req.header(\"X-Data-Request\") === \"true\";\n\n // Run loaders/actions on the server\n const context = await query(c.req.raw);\n\n // Direct Response (e.g., redirect from an action, or API route returning Response)\n if (context instanceof Response) {\n if (isDataRequest && context.status >= 300 && context.status < 400) {\n return Response.json({ redirect: context.headers.get(\"Location\") });\n }\n return context;\n }\n\n // Data-only request (client-side navigation)\n if (isDataRequest) {\n return Response.json({\n loaderData: context.loaderData,\n actionData: context.actionData,\n });\n }\n\n // Full SSR render\n const router = createStaticRouter(dataRoutes, context);\n\n // hydrate=false: we inject hydration data ourselves outside the root div,\n // so StaticRouterProvider shouldn't inject its own