@emkodev/emroute 1.6.6-beta.2 → 1.6.6-beta.4

package/server/build.util.ts

@@ -0,0 +1,168 @@
+/**
+ * Build Utilities
+ *
+ * Standalone client bundling — extracted from Runtime so that build is a
+ * separate concern from storage. Call `buildClientBundles()` before
+ * `createEmrouteServer()` to produce emroute.js + app.js.
+ *
+ * Requires esbuild as a devDependency in the consumer project.
+ */
+
+import { readFile } from 'node:fs/promises';
+import { createRequire } from 'node:module';
+import { resolve } from 'node:path';
+import type { Runtime } from '../runtime/abstract.runtime.ts';
+import { DEFAULT_ROUTES_DIR, DEFAULT_WIDGETS_DIR } from '../runtime/abstract.runtime.ts';
+import { createManifestPlugin } from './esbuild-manifest.plugin.ts';
+import { createRuntimeLoaderPlugin } from '../runtime/bun/esbuild-runtime-loader.plugin.ts';
+import { generateMainTs } from './codegen.util.ts';
+import type { SpaMode } from '../src/type/widget.type.ts';
+
+export const EMROUTE_EXTERNALS = [
+  '@emkodev/emroute/spa',
+  '@emkodev/emroute/overlay',
+  '@emkodev/emroute',
+  '@emkodev/emroute/server',
+  '@emkodev/emroute/runtime/fetch',
+] as const;
+
+/** esbuild namespace for virtual `emroute:routes` / `emroute:widgets` modules. */
+export const EMROUTE_VIRTUAL_NS = 'emroute';
+
+export interface BuildOptions {
+  /** Runtime instance to read manifests and source files from. */
+  runtime: Runtime;
+  /** Filesystem root for esbuild resolution (e.g. process.cwd() or the app directory). */
+  root: string;
+  /** SPA mode — skips bundling when 'none'. */
+  spa: SpaMode;
+  /** Consumer's SPA entry point (e.g. '/main.ts'). When absent, auto-generates one. */
+  entryPoint?: string;
+  /** Output paths for the bundles. */
+  bundlePaths?: { emroute: string; app: string };
+}
+
+const DEFAULT_BUNDLE_PATHS = { emroute: '/emroute.js', app: '/app.js' };
+
+/**
+ * Build client bundles and write them into the runtime.
+ *
+ * Produces:
+ * - emroute.js — pre-built from dist/ (no esbuild needed for this)
+ * - app.js — consumer entry point with routeTree, FetchRuntime, createEmrouteApp
+ * - index.html — shell with import map + script tags (if not already present)
+ */
+export async function buildClientBundles(options: BuildOptions): Promise<void> {
+  const { runtime, root, spa, entryPoint } = options;
+  if (spa === 'none') return;
+
+  const paths = options.bundlePaths ?? DEFAULT_BUNDLE_PATHS;
+
+  // Copy pre-built emroute.js from the package dist/
+  const consumerRequire = createRequire(root + '/');
+  const emrouteJsPath = resolvePrebuiltBundle(consumerRequire);
+  const emrouteJs = await readFile(emrouteJsPath);
+  await runtime.command(paths.emroute, { body: emrouteJs });
+
+  // App bundle — generate main.ts if absent, virtual plugin resolves manifests
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  const esbuild = await loadEsbuild() as any;
+  const ep = entryPoint ?? '/main.ts';
+  if ((await runtime.query(ep)).status === 404) {
+    const hasRoutes = (await runtime.query((runtime.config.routesDir ?? DEFAULT_ROUTES_DIR) + '/')).status !== 404;
+    const hasWidgets = (await runtime.query((runtime.config.widgetsDir ?? DEFAULT_WIDGETS_DIR) + '/')).status !== 404;
+    const code = generateMainTs(spa, hasRoutes, hasWidgets, '@emkodev/emroute');
+    await runtime.command(ep, { body: code });
+  }
+
+  const manifestPlugin = createManifestPlugin({ runtime, resolveDir: root });
+  const runtimeLoader = createRuntimeLoaderPlugin({ runtime, root });
+
+  const result = await esbuild.build({
+    bundle: true,
+    write: false,
+    format: 'esm' as const,
+    platform: 'browser' as const,
+    entryPoints: [`${root}${ep}`],
+    outfile: `${root}${paths.app}`,
+    external: [...EMROUTE_EXTERNALS],
+    plugins: [manifestPlugin, runtimeLoader],
+  });
+
+  for (const file of result.outputFiles) {
+    const runtimePath = file.path.startsWith(root)
+      ? file.path.slice(root.length)
+      : '/' + file.path;
+    await runtime.command(runtimePath, { body: file.contents as unknown as BodyInit });
+  }
+
+  // Write shell (index.html) if not already present
+  await writeShell(runtime, paths, ep);
+
+  await esbuild.stop();
+}
+
+/**
+ * Resolve the pre-built dist/emroute.js from the consumer's node_modules.
+ * Falls back to the local dist/ when running from the source repo.
+ */
+function resolvePrebuiltBundle(require: NodeRequire): string {
+  try {
+    const spaEntry = require.resolve('@emkodev/emroute/spa');
+    // Compiled: .../dist/src/renderer/spa/mod.js → .../dist/emroute.js
+    const distMatch = spaEntry.match(/^(.+\/dist\/)src\/renderer\/spa\/mod\.js$/);
+    if (distMatch) return distMatch[1] + 'emroute.js';
+    // Source (Bun): .../src/renderer/spa/mod.ts → .../dist/emroute.js
+    const srcMatch = spaEntry.match(/^(.+\/)src\/renderer\/spa\/mod\.ts$/);
+    if (srcMatch) return srcMatch[1] + 'dist/emroute.js';
+  } catch { /* not installed as dependency */ }
+  // Last resort
+  return resolve(process.cwd(), 'dist/emroute.js');
+}
+
+// ── Shell generation ──────────────────────────────────────────────────
+
+async function writeShell(
+  runtime: Runtime,
+  paths: { emroute: string; app: string },
+  entryPoint: string,
+): Promise<void> {
+  if ((await runtime.query('/index.html')).status !== 404) return;
+
+  const imports: Record<string, string> = {};
+  for (const pkg of EMROUTE_EXTERNALS) {
+    imports[pkg] = paths.emroute;
+  }
+  const importMap = JSON.stringify({ imports }, null, 2);
+
+  const scripts = [
+    `<script type="importmap">\n${importMap}\n  </script>`,
+  ];
+  if (entryPoint) {
+    scripts.push(`<script type="module" src="${paths.app}"></script>`);
+  }
+
+  const html = `<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <title>emroute</title>
+  <style>@view-transition { navigation: auto; } router-slot { display: contents; }</style>
+</head>
+<body>
+  <router-slot></router-slot>
+  ${scripts.join('\n  ')}
+</body>
+</html>`;
+
+  await runtime.command('/index.html', { body: html });
+}
+
+// ── esbuild loader ────────────────────────────────────────────────────
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+async function loadEsbuild(): Promise<any> {
+  const consumerRequire = createRequire(process.cwd() + '/');
+  return consumerRequire('esbuild');
+}

package/server/codegen.util.ts

@@ -12,6 +12,9 @@ import type { SpaMode } from '../src/type/widget.type.ts';
 /**
  * Generate a main.ts entry point for SPA bootstrapping.
  *
+ * For `root`/`only` modes: creates an EmrouteServer with FetchRuntime
+ * in the browser and wires it to Navigation API via `createEmrouteApp`.
+ *
  * Imports route tree and widget manifests from virtual `emroute:` specifiers
  * that the esbuild manifest plugin resolves at bundle time.
  */
@@ -27,23 +30,23 @@ export function generateMainTs(
 
   const spaImport = `${importPath}/spa`;
 
-  if (hasRoutes) {
-    imports.push(`import { routeTree, moduleLoaders } from 'emroute:routes';`);
-  }
-
   if (hasWidgets) {
-    imports.push(`import { ComponentElement } from '${spaImport}';`);
+    imports.push(`import { ComponentElement, WidgetRegistry } from '${spaImport}';`);
     imports.push(`import { widgetsManifest } from 'emroute:widgets';`);
+    body.push('const widgets = new WidgetRegistry();');
     body.push('for (const entry of widgetsManifest.widgets) {');
     body.push(
       '  const mod = await widgetsManifest.moduleLoaders![entry.modulePath]() as Record<string, unknown>;',
     );
     body.push('  for (const exp of Object.values(mod)) {');
     body.push("    if (exp && typeof exp === 'object' && 'getData' in exp) {");
+    body.push('      widgets.add(exp as any);');
     body.push('      ComponentElement.register(exp as any, entry.files);');
     body.push('      break;');
     body.push('    }');
     body.push("    if (typeof exp === 'function' && exp.prototype?.getData) {");
+    body.push('      const instance = new (exp as new () => any)();');
+    body.push('      widgets.add(instance);');
     body.push(
       '      ComponentElement.registerClass(exp as new () => any, entry.name, entry.files);',
     );
@@ -54,14 +57,29 @@ export function generateMainTs(
   }
 
   if ((spa === 'root' || spa === 'only') && hasRoutes) {
-    imports.push(`import { RouteTrie } from '${importPath}';`);
-    imports.push(`import { createSpaHtmlRouter } from '${spaImport}';`);
+    imports.push(`import { routeTree, moduleLoaders } from 'emroute:routes';`);
+    imports.push(`import { createEmrouteServer } from '${importPath}/server';`);
+    imports.push(`import { FetchRuntime } from '${importPath}/runtime/fetch';`);
+    imports.push(`import { createEmrouteApp } from '${spaImport}';`);
+
+    body.push('const runtime = new FetchRuntime(location.origin);');
+
+    // Merge route + widget module loaders so the browser never calls runtime.loadModule()
+    const loadersExpr = hasWidgets
+      ? '{ ...moduleLoaders, ...widgetsManifest.moduleLoaders }'
+      : 'moduleLoaders';
 
-    body.push('const resolver = new RouteTrie(routeTree);');
+    const configParts = ['routeTree', `moduleLoaders: ${loadersExpr}`];
+    if (hasWidgets) configParts.push('widgets');
+    if (basePath) {
+      configParts.push(`basePath: { html: '${basePath.html}', md: '${basePath.md}', app: '${basePath.app}' }`);
+    }
+    body.push(`const server = await createEmrouteServer({ ${configParts.join(', ')} }, runtime);`);
 
-    const bpOpt = basePath ? `basePath: { html: '${basePath.html}', md: '${basePath.md}' }` : '';
-    const optsInner = [bpOpt, 'moduleLoaders'].filter(Boolean).join(', ');
-    body.push(`await createSpaHtmlRouter(resolver, { ${optsInner} });`);
+    const appOpts = basePath
+      ? `{ basePath: { html: '${basePath.html}', md: '${basePath.md}', app: '${basePath.app}' } }`
+      : '';
+    body.push(`await createEmrouteApp(server${appOpts ? ', ' + appOpts : ''});`);
   }
 
   return `/** Auto-generated entry point — do not edit. */\n${imports.join('\n')}\n\n${

package/server/emroute.server.ts

@@ -37,6 +37,7 @@ import type { WidgetManifestEntry } from '../src/type/widget.type.ts';
 import { WidgetRegistry } from '../src/widget/widget.registry.ts';
 import type { WidgetComponent } from '../src/component/widget.component.ts';
 import { escapeHtml } from '../src/util/html.util.ts';
+import { rewriteMdLinks } from '../src/util/md.util.ts';
 import {
   ROUTES_MANIFEST_PATH,
   Runtime,
@@ -58,7 +59,8 @@ function createModuleLoaders(
   const paths = new Set<string>();
 
   function walk(node: RouteNode): void {
-    if (node.files?.ts) paths.add(node.files.ts);
+    const modulePath = node.files?.ts ?? node.files?.js;
+    if (modulePath) paths.add(modulePath);
     if (node.redirect) paths.add(node.redirect);
     if (node.errorBoundary) paths.add(node.errorBoundary);
 
@@ -106,6 +108,7 @@ async function importWidgets(
   widgetFiles: Record<string, { html?: string; md?: string; css?: string }>;
 }> {
   const registry = new WidgetRegistry();
+  const widgetFiles: Record<string, { html?: string; md?: string; css?: string }> = {};
 
   for (const entry of entries) {
     try {
@@ -117,8 +120,17 @@ async function importWidgets(
       const instance = extractWidgetExport(mod);
       if (!instance) continue;
       registry.add(instance);
+
+      // Prefer inlined __files from merged module over manifest paths
+      const inlined = mod.__files;
+      if (inlined && typeof inlined === 'object') {
+        widgetFiles[entry.name] = inlined as { html?: string; md?: string; css?: string };
+      } else if (entry.files) {
+        widgetFiles[entry.name] = entry.files;
+      }
     } catch (e) {
       console.error(`[emroute] Failed to load widget ${entry.modulePath}:`, e);
+      if (entry.files) widgetFiles[entry.name] = entry.files;
     }
   }
 
@@ -128,21 +140,17 @@ async function importWidgets(
     }
   }
 
-  const widgetFiles: Record<string, { html?: string; md?: string; css?: string }> = {};
-  for (const entry of entries) {
-    if (entry.files) widgetFiles[entry.name] = entry.files;
-  }
-
   return { registry, widgetFiles };
 }
 
 // ── HTML shell ─────────────────────────────────────────────────────────
 
 /** Build a default HTML shell. */
-function buildHtmlShell(title: string): string {
+function buildHtmlShell(title: string, htmlBase: string): string {
+  const baseTag = htmlBase ? `\n  <base href="${escapeHtml(htmlBase)}/">` : '';
   return `<!DOCTYPE html>
 <html>
-<head>
+<head>${baseTag}
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <title>${escapeHtml(title)}</title>
@@ -178,10 +186,11 @@ function injectSsrContent(
 async function resolveShell(
   runtime: Runtime,
   title: string,
+  htmlBase: string,
 ): Promise<string> {
   const response = await runtime.query('/index.html');
   if (response.status !== 404) return await response.text();
-  return buildHtmlShell(title);
+  return buildHtmlShell(title, htmlBase);
 }
 
 // ── More path helpers ─────────────────────────────────────────────────
@@ -201,10 +210,7 @@ export async function createEmrouteServer(
     spa = 'root',
   } = config;
 
-  // Let the runtime know the SPA mode so bundle() can skip when 'none'.
-  runtime.config.spa = spa;
-
-  const { html: htmlBase, md: mdBase } = config.basePath ?? DEFAULT_BASE_PATH;
+  const { html: htmlBase, md: mdBase, app: appBase } = config.basePath ?? DEFAULT_BASE_PATH;
 
   // ── Route tree (read from runtime) ──────────────────────────────────
 
@@ -223,7 +229,7 @@ export async function createEmrouteServer(
     routeTree = await manifestResponse.json();
   }
 
-  const moduleLoaders = createModuleLoaders(routeTree, runtime);
+  const moduleLoaders = config.moduleLoaders ?? createModuleLoaders(routeTree, runtime);
   const resolver = new RouteTrie(routeTree);
 
   // ── Widgets (read from runtime) ────────────────────────────────────
@@ -235,9 +241,17 @@ export async function createEmrouteServer(
   const widgetsResponse = await runtime.query(WIDGETS_MANIFEST_PATH);
   if (widgetsResponse.status !== 404) {
     discoveredWidgetEntries = await widgetsResponse.json();
-    const imported = await importWidgets(discoveredWidgetEntries, runtime, config.widgets);
-    widgets = imported.registry;
-    widgetFiles = imported.widgetFiles;
+    if (config.widgets) {
+      // Widgets pre-provided (e.g. browser bundle) — just collect file paths
+      widgets = config.widgets;
+      for (const entry of discoveredWidgetEntries) {
+        if (entry.files) widgetFiles[entry.name] = entry.files;
+      }
+    } else {
+      const imported = await importWidgets(discoveredWidgetEntries, runtime);
+      widgets = imported.registry;
+      widgetFiles = imported.widgetFiles;
+    }
   }
 
   // ── SSR routers ──────────────────────────────────────────────────────
@@ -254,7 +268,6 @@ export async function createEmrouteServer(
 
     ssrHtmlRouter = new SsrHtmlRouter(resolver, {
       fileReader: (path) => runtime.query(path, { as: 'text' }),
-      basePath: htmlBase,
       moduleLoaders,
       markdownRenderer: config.markdownRenderer,
       extendContext: config.extendContext,
@@ -264,7 +277,6 @@ export async function createEmrouteServer(
 
     ssrMdRouter = new SsrMdRouter(resolver, {
       fileReader: (path) => runtime.query(path, { as: 'text' }),
-      basePath: mdBase,
       moduleLoaders,
       extendContext: config.extendContext,
       widgets,
@@ -274,14 +286,10 @@ export async function createEmrouteServer(
 
   buildSsrRouters();
 
-  // ── Bundling (runtime decides whether/how to bundle) ────────────────
-
-  await runtime.bundle();
-
   // ── HTML shell ───────────────────────────────────────────────────────
 
   const title = config.title ?? 'emroute';
-  let shell = await resolveShell(runtime, title);
+  let shell = await resolveShell(runtime, title, htmlBase);
 
   // Auto-discover main.css and inject <link> into <head>
   if ((await runtime.query('/main.css')).status !== 404) {
@@ -296,6 +304,7 @@ export async function createEmrouteServer(
 
     const mdPrefix = mdBase + '/';
     const htmlPrefix = htmlBase + '/';
+    const appPrefix = appBase + '/';
 
     // SSR Markdown: /md/*
     if (
@@ -309,12 +318,13 @@ export async function createEmrouteServer(
         return Response.redirect(new URL(canonical, url.origin), 301);
       }
       try {
-        const { content, status, redirect } = await ssrMdRouter.render(routePath);
+        const routeUrl = new URL(routePath + url.search, url.origin);
+        const { content, status, redirect } = await ssrMdRouter.render(routeUrl, req.signal);
         if (redirect) {
           const target = redirect.startsWith('/') ? mdBase + redirect : redirect;
           return Response.redirect(new URL(target, url.origin), status);
         }
-        return new Response(content, {
+        return new Response(rewriteMdLinks(content, mdBase, [mdBase, htmlBase]), {
           status,
           headers: { 'Content-Type': 'text/markdown; charset=utf-8; variant=CommonMark' },
         });
@@ -336,7 +346,8 @@ export async function createEmrouteServer(
         return Response.redirect(new URL(canonical, url.origin), 301);
       }
       try {
-        const result = await ssrHtmlRouter.render(routePath);
+        const routeUrl = new URL(routePath + url.search, url.origin);
+        const result = await ssrHtmlRouter.render(routeUrl, req.signal);
         if (result.redirect) {
           const target = result.redirect.startsWith('/') ? htmlBase + result.redirect : result.redirect;
           return Response.redirect(new URL(target, url.origin), result.status);
@@ -353,7 +364,15 @@ export async function createEmrouteServer(
       }
     }
 
-    // /html/* or /md/* that wasn't handled by SSR (e.g. 'only' mode) — serve SPA shell
+    // /app/* — serve shell (browser JS takes over via createEmrouteApp)
+    if (pathname.startsWith(appPrefix) || pathname === appBase) {
+      return new Response(shell, {
+        status: 200,
+        headers: { 'Content-Type': 'text/html; charset=utf-8' },
+      });
+    }
+
+    // /html/* or /md/* that wasn't handled by SSR (e.g. 'only' mode) — serve shell
     if (
       pathname.startsWith(htmlPrefix) || pathname === htmlBase ||
       pathname.startsWith(mdPrefix) || pathname === mdBase
@@ -372,9 +391,10 @@ export async function createEmrouteServer(
       return null;
     }
 
-    // Bare paths — redirect to /html/* in all modes.
+    // Bare paths — redirect to /app/* in root/only modes, /html/* otherwise.
+    const base = (spa === 'root' || spa === 'only') ? appBase : htmlBase;
     const bare = pathname === '/' ? '' : pathname.slice(1).replace(/\/$/, '');
-    return Response.redirect(new URL(`${htmlBase}/${bare}`, url.origin), 302);
+    return Response.redirect(new URL(`${base}/${bare}`, url.origin), 302);
   }
 
   // ── Return ───────────────────────────────────────────────────────────

package/server/esbuild-manifest.plugin.ts

@@ -11,6 +11,7 @@
 
 import type { Runtime } from '../runtime/abstract.runtime.ts';
 import { ROUTES_MANIFEST_PATH, WIDGETS_MANIFEST_PATH } from '../runtime/abstract.runtime.ts';
+import { EMROUTE_VIRTUAL_NS } from './build.util.ts';
 
 /** Escape a string for use inside a single-quoted JS/TS string literal. */
 function esc(value: string): string {
@@ -46,12 +47,12 @@ export function createManifestPlugin(options: ManifestPluginOptions): EsbuildPlu
       build.onResolve(
         { filter: /^emroute:/ },
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        (args: any) => ({ path: args.path, namespace: 'emroute' }),
+        (args: any) => ({ path: args.path, namespace: EMROUTE_VIRTUAL_NS }),
       );
 
       // ── Load virtual modules ────────────────────────────────────────
       build.onLoad(
-        { filter: /.*/, namespace: 'emroute' },
+        { filter: /.*/, namespace: EMROUTE_VIRTUAL_NS },
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         async (args: any) => {
           if (args.path === 'emroute:routes') {
@@ -108,7 +109,8 @@ ${moduleLoadersCode}
    */
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   function collectModulePaths(node: any, paths: Set<string>): void {
-    if (node.files?.ts) paths.add(node.files.ts);
+    const modulePath = node.files?.ts ?? node.files?.js;
+    if (modulePath) paths.add(modulePath);
     if (node.errorBoundary) paths.add(node.errorBoundary);
     if (node.redirect) paths.add(node.redirect);
     if (node.children) {

package/server/server-api.type.ts

@@ -58,6 +58,13 @@ export interface EmrouteServerConfig {
 
   /** Enrich every ComponentContext with app-level services. */
   extendContext?: ContextProvider;
+
+  /**
+   * Pre-bundled module loaders (route + widget modules).
+   * When provided, skips `runtime.loadModule()` — used in the browser
+   * where modules are already bundled into app.js.
+   */
+  moduleLoaders?: Record<string, () => Promise<unknown>>;
 }
 
 /**

package/src/component/abstract.component.ts

@@ -17,7 +17,7 @@ import { escapeHtml } from '../util/html.util.ts';
 
 /**
  * Context passed to components during rendering.
- * Extends RouteInfo (pathname, pattern, params, searchParams)
+ * Extends RouteInfo (pathname, pattern, params)
  * with pre-loaded file content and an abort signal.
  *
  * Consumers can extend this interface via module augmentation
@@ -27,12 +27,14 @@ import { escapeHtml } from '../util/html.util.ts';
 export type FileContents = { html?: string; md?: string; css?: string };
 
 export interface ComponentContext extends RouteInfo {
+  /** @deprecated Use context.url.pathname */
+  readonly pathname: string;
+  /** @deprecated Use context.url.searchParams */
+  readonly searchParams: URLSearchParams;
   readonly files?: Readonly<FileContents>;
   readonly signal?: AbortSignal;
   /** True when this component is the leaf (matched) route, false when rendered as a layout parent. */
   readonly isLeaf?: boolean;
-  /** Base path for SSR HTML links (e.g. '/html'). */
-  readonly basePath?: string;
 }
 
 /**

package/src/element/component.element.ts

@@ -155,11 +155,12 @@ export class ComponentElement<TParams, TData> extends HTMLElementBase {
     const files = await this.loadFiles();
     if (signal.aborted) return;
 
+    const currentUrl = globalThis.location ? new URL(location.href) : new URL('http://localhost/');
     const base: ComponentContext = {
-      pathname: globalThis.location?.pathname ?? '/',
-      pattern: '',
-      params: {},
-      searchParams: new URLSearchParams(globalThis.location?.search ?? ''),
+      url: currentUrl,
+      pathname: currentUrl.pathname,
+      searchParams: currentUrl.searchParams,
+      params: this.params ?? {},
       files: (files.html || files.md || files.css) ? files : undefined,
     };
     this.context = ComponentElement.extendContext ? ComponentElement.extendContext(base) : base;

package/src/renderer/spa/mod.ts

@@ -2,7 +2,7 @@
  * SPA (Browser) Module
  *
  * Everything needed for the browser bundle:
- * - SPA router with client-side navigation
+ * - EmrouteApp: Navigation API glue wired to an EmrouteServer
  * - Custom elements for rendering and hydrating SSR islands
  * - Widget registry (built-in widgets are opt-in)
  */
@@ -12,13 +12,7 @@ import { MarkdownElement } from '../../element/markdown.element.ts';
 import { ComponentElement } from '../../element/component.element.ts';
 import { WidgetRegistry } from '../../widget/widget.registry.ts';
 
-export { createSpaHtmlRouter, SpaHtmlRouter, type SpaHtmlRouterOptions } from './html.renderer.ts';
-export {
-  createHashRouter,
-  type HashRouteConfig,
-  HashRouter,
-  type HashRouterOptions,
-} from './hash.renderer.ts';
+export { createEmrouteApp, EmrouteApp, type EmrouteAppOptions } from './thin-client.ts';
 export { ComponentElement, MarkdownElement, RouterSlot, WidgetRegistry };
 export type { SpaMode, WidgetsManifest } from '../../type/widget.type.ts';