@rangojs/router 0.0.0-experimental.130 → 0.0.0-experimental.132

package/src/ssr/index.tsx

@@ -1,6 +1,9 @@
 import React from "react";
 import { renderSegments } from "../segment-system.js";
-import { filterSegmentOrder } from "../browser/react/filter-segment-order.js";
+import {
+  filterSegmentOrder,
+  filterRouteSegmentIds,
+} from "../browser/react/filter-segment-order.js";
 import { ThemeProvider } from "../theme/ThemeProvider.js";
 import { NonceContext } from "../browser/react/nonce-context.js";
 import { NavigationStoreContext } from "../browser/react/context.js";
@@ -166,9 +169,7 @@ function createSsrEventController(opts: {
   const handleState = {
     data: opts.handleData ?? {},
     segmentOrder: filterSegmentOrder(rawMatched),
-    routeSegmentIds: rawMatched.filter(
-      (id) => !id.includes(".@") && !/D\d+\./.test(id),
-    ),
+    routeSegmentIds: filterRouteSegmentIds(rawMatched),
   };
   const state: DerivedNavigationState = {
     state: "idle",

package/src/testing/render-handler.ts

@@ -49,6 +49,8 @@ import {
 } from "./flight.js";
 import type { SegmentCacheStore } from "../cache/types.js";
 import type { CacheProfile } from "../cache/profile-registry.js";
+import type { ThemeConfig } from "../theme/types.js";
+import { resolveThemeConfig } from "../theme/constants.js";
 import {
   deserializeFlight,
   makeClientManifest,
@@ -114,6 +116,13 @@ export interface RenderHandlerOptions<TEnv = any> {
    * `"use cache: profileName"` resolution once a `cacheStore` is wired.
    */
   cacheProfiles?: Record<string, CacheProfile>;
+  /**
+   * Theme config in the same shape `createRouter({ theme })` takes (e.g. `true`
+   * or `{ themes: [...] }`). Without it `ctx.theme`/`ctx.setTheme` are inert,
+   * mirroring an app with no theme configured. Pass one to exercise a handler
+   * that reads `ctx.theme` or writes the theme cookie via `ctx.setTheme(...)`.
+   */
+  theme?: ThemeConfig | true;
 }
 
 /** Result of {@link renderHandler}. */
@@ -225,6 +234,8 @@ export async function renderHandler<TEnv = any>(
     version: opts.stateCookie?.version,
     cacheStore: opts.cacheStore,
     cacheProfiles: opts.cacheProfiles,
+    themeConfig:
+      opts.theme === undefined ? undefined : resolveThemeConfig(opts.theme),
   });
 
   const loaderSeeds = new Map<unknown, unknown>(opts.loaders ?? []);

package/src/vite/plugins/expose-id-utils.ts

@@ -243,6 +243,81 @@ export function findStatementEnd(code: string, pos: number): number {
   return i;
 }
 
-export function escapeRegExp(input: string): string {
-  return input.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+export { escapeRegExp } from "../../regex-escape.js";
+
+/**
+ * Given an index pointing just past a `create*` callee identifier, return the
+ * index of the call's opening `(`, accounting for an optional generic type
+ * argument list `<...>` with arbitrarily nested `<>`. Returns -1 when the next
+ * non-trivia token is neither `<` nor `(` (i.e. not a call site).
+ *
+ * Replaces the single-level `<[^>]*>` regex assumption, which stopped at the
+ * first `>` and so never reached `(` for `createRouter<Config<Env>>(`.
+ *
+ * Whitespace, comments, and strings between the callee and `(` are skipped via
+ * skipStringOrComment. The `<...>` scan only balances angle brackets; it does
+ * not attempt to parse full TS type syntax (sufficient for locating the paren).
+ */
+export function findCallParenAfterGenerics(
+  code: string,
+  afterCalleeIndex: number,
+): number {
+  let i = afterCalleeIndex;
+  // Skip leading whitespace/comments/strings before `<` or `(`.
+  while (i < code.length) {
+    const skipped = skipStringOrComment(code, i);
+    if (skipped > i) {
+      i = skipped;
+      continue;
+    }
+    if (/\s/.test(code[i])) {
+      i++;
+      continue;
+    }
+    break;
+  }
+
+  if (i >= code.length) return -1;
+
+  if (code[i] === "(") return i;
+
+  if (code[i] === "<") {
+    let depth = 0;
+    while (i < code.length) {
+      const skipped = skipStringOrComment(code, i);
+      if (skipped > i) {
+        i = skipped;
+        continue;
+      }
+      const ch = code[i];
+      if (ch === "<") {
+        depth++;
+      } else if (ch === ">") {
+        depth--;
+        if (depth === 0) {
+          i++;
+          break;
+        }
+      }
+      i++;
+    }
+    if (depth !== 0) return -1;
+    // After the balanced generic list, skip trivia and expect `(`.
+    while (i < code.length) {
+      const skipped = skipStringOrComment(code, i);
+      if (skipped > i) {
+        i = skipped;
+        continue;
+      }
+      if (/\s/.test(code[i])) {
+        i++;
+        continue;
+      }
+      break;
+    }
+    if (i < code.length && code[i] === "(") return i;
+    return -1;
+  }
+
+  return -1;
 }

package/src/vite/plugins/expose-ids/export-analysis.ts

@@ -5,6 +5,7 @@ import {
   findStatementEnd,
   buildExportMap,
   escapeRegExp,
+  findCallParenAfterGenerics,
 } from "../expose-id-utils.js";
 import { codeMatchIndices } from "../../../build/route-types/source-scan.js";
 import type { CreateExportBinding } from "./types.js";
@@ -50,18 +51,42 @@ export function isExportOnlyFile(
   return true;
 }
 
+// Matches the callee identifier only. The optional generic argument list
+// (which may be nested, e.g. createLoader<A<B>>(...)) and the call paren are
+// resolved per match via findCallParenAfterGenerics, so a nested `>` no longer
+// defeats the scan the way `<[^>]*>` did (it stopped at the first `>`).
 function createCallPattern(fnNames: string[]): RegExp {
-  return new RegExp(
-    `\\b(?:${fnNames.map(escapeRegExp).join("|")})\\s*(?:<[^>]*>\\s*)?\\(`,
-    "g",
+  return new RegExp(`\\b(?:${fnNames.map(escapeRegExp).join("|")})\\b`, "g");
+}
+
+/**
+ * Byte offsets of every create*-call site in real code: a callee-identifier
+ * match that is actually followed by a call `(` (after an optional nested
+ * generic list). Non-call references (type positions, the import specifier
+ * itself) yield -1 from findCallParenAfterGenerics and are dropped.
+ */
+function createCallStartIndices(code: string, fnNames: string[]): number[] {
+  return codeMatchIndices(code, createCallPattern(fnNames)).filter(
+    (index) =>
+      findCallParenAfterGenerics(
+        code,
+        index + matchedNameLength(code, index),
+      ) !== -1,
   );
 }
 
+// Length of the identifier match at `index` (run of identifier chars).
+function matchedNameLength(code: string, index: number): number {
+  let i = index;
+  while (i < code.length && /[A-Za-z0-9_$]/.test(code[i])) i++;
+  return i - index;
+}
+
 export function countCreateCallsForNames(
   code: string,
   fnNames: string[],
 ): number {
-  return codeMatchIndices(code, createCallPattern(fnNames)).length;
+  return createCallStartIndices(code, fnNames).length;
 }
 
 export function offsetToLineColumn(
@@ -86,7 +111,7 @@ export function findUnsupportedCreateCallSites(
   supportedBindings: CreateExportBinding[],
 ): Array<{ line: number; column: number }> {
   const supported = new Set(supportedBindings.map((b) => b.callExprStart));
-  return codeMatchIndices(code, createCallPattern(fnNames))
+  return createCallStartIndices(code, fnNames)
     .filter((index) => !supported.has(index))
     .map((index) => offsetToLineColumn(code, index));
 }

package/src/vite/plugins/expose-ids/router-transform.ts

@@ -2,26 +2,65 @@ import type { Plugin } from "vite";
 import MagicString from "magic-string";
 import path from "node:path";
 import { createHash } from "node:crypto";
-import { normalizePath, findMatchingParen } from "../expose-id-utils.js";
-import { getImportedFnNames } from "./export-analysis.js";
+import {
+  normalizePath,
+  findMatchingParen,
+  findCallParenAfterGenerics,
+  skipStringOrComment,
+} from "../expose-id-utils.js";
+import { escapeRegExp } from "../../../regex-escape.js";
+import {
+  getImportedFnNames,
+  buildUnsupportedShapeWarning,
+} from "./export-analysis.js";
 import { codeMatchIndices } from "../../../build/route-types/source-scan.js";
 import { createRangoDebugger, createCounter, NS } from "../../debug.js";
 
 const debug = createRangoDebugger(NS.transform);
 
+/**
+ * Advance past leading whitespace and a single leading line/block comment so a
+ * `createRouter(/* opts *\/ { ... })` call still resolves to its `{`. Only the
+ * first comment-or-whitespace run is skipped (enough for the common prefix
+ * case); a non-trivia token after it stops the scan.
+ */
+function skipLeadingTrivia(code: string, start: number, end: number): number {
+  let i = start;
+  while (i < end) {
+    const skipped = skipStringOrComment(code, i);
+    // skipStringOrComment only advances for strings/comments, not whitespace.
+    if (skipped > i) {
+      i = skipped;
+      continue;
+    }
+    if (/\s/.test(code[i])) {
+      i++;
+      continue;
+    }
+    break;
+  }
+  return i;
+}
+
 export function transformRouter(
   code: string,
   filePath: string,
   routerFnNames: string[],
   absolutePath?: string,
+  warn?: (message: string) => void,
 ): { code: string; map: ReturnType<MagicString["generateMap"]> } | null {
+  // Match only the callee identifier; the generic list (which may be nested,
+  // e.g. createRouter<Config<Env>>(...)) and the opening paren are located
+  // separately via findCallParenAfterGenerics so a nested `>` does not defeat
+  // the scan (a `<[^>]*>` regex stopped at the first `>`).
   const pat = new RegExp(
-    `\\b(?:${routerFnNames.map((n) => n.replace(/[.*+?^${}()|[\]\\]/g, "\\$&")).join("|")})\\s*(?:<[^>]*>)?\\s*\\(`,
+    `\\b(?:${routerFnNames.map(escapeRegExp).join("|")})\\b`,
     "g",
   );
   let match: RegExpExecArray | null;
   const s = new MagicString(code);
   let changed = false;
+  const unsupportedSites: Array<{ line: number; column: number }> = [];
 
   // Compute the import path for the generated route names file.
   // filePath is relative to project root (e.g., "src/router.tsx")
@@ -40,32 +79,58 @@ export function transformRouter(
   while ((match = pat.exec(code)) !== null) {
     if (!codeOffsets.has(match.index)) continue;
     const callStart = match.index;
-    const parenPos = match.index + match[0].length - 1;
+    const calleeEnd = match.index + match[0].length;
+
+    // Resolve the call's opening paren, skipping an optional (possibly nested)
+    // generic argument list. A non-call reference (e.g. a bare identifier or a
+    // type position) yields -1 and is skipped.
+    const parenPos = findCallParenAfterGenerics(code, calleeEnd);
+    if (parenPos === -1) continue;
 
     const closeParen = findMatchingParen(code, parenPos + 1);
     const callArgs = code.slice(parenPos + 1, closeParen);
 
     if (callArgs.includes("$$id")) continue;
 
+    const sourceFilePath = absolutePath ?? filePath;
     const lineNumber = code.slice(0, callStart).split("\n").length;
     const hash = createHash("sha256")
       .update(`${filePath}:${lineNumber}`)
       .digest("hex")
       .slice(0, 8);
-
-    changed = true;
-    const sourceFilePath = absolutePath ?? filePath;
     const injected = ` $$id: "${hash}", $$sourceFile: "${sourceFilePath}", $$routeNames: ${routeNamesVar},`;
 
-    const afterParen = callArgs.trimStart();
-    if (afterParen.startsWith("{")) {
-      const bracePos = code.indexOf("{", parenPos + 1);
-      s.appendRight(bracePos + 1, injected);
-    } else if (afterParen.startsWith(")")) {
+    // Skip a leading comment/whitespace run so `createRouter(/* c *\/ {...})`
+    // and a newline-then-comment prefix still resolve to the object literal.
+    // findMatchingParen returns one past the close `)`, so the matching paren
+    // sits at closeParen - 1 and empty args resolve to that `)`.
+    const argsContentStart = skipLeadingTrivia(code, parenPos + 1, closeParen);
+    const firstArgChar = code[argsContentStart];
+
+    if (firstArgChar === "{") {
+      changed = true;
+      s.appendRight(argsContentStart + 1, injected);
+    } else if (argsContentStart >= closeParen - 1) {
+      // Empty args: createRouter(). Wrap a fresh config object.
+      changed = true;
       s.appendRight(parenPos + 1, `{${injected} }`);
+    } else {
+      // Unsupported argument shape (bare identifier, spread, call, etc.). No
+      // stable $$id can be injected here. Record it so the plugin can warn —
+      // and crucially do NOT mark changed, so a dead named-routes.gen import is
+      // not prepended for a call we never touched.
+      const lastNl = code.lastIndexOf("\n", callStart - 1);
+      const column = callStart - (lastNl + 1) + 1;
+      unsupportedSites.push({ line: lineNumber, column });
     }
   }
 
+  if (unsupportedSites.length > 0 && warn) {
+    warn(
+      buildUnsupportedShapeWarning(filePath, "createRouter", unsupportedSites),
+    );
+  }
+
   if (!changed) return null;
 
   s.prepend(
@@ -110,11 +175,16 @@ export function exposeRouterId(): Plugin {
       try {
         const filePath = normalizePath(path.relative(projectRoot, id));
         const routerFnNames = getImportedFnNames(code, "createRouter");
+        const warn =
+          typeof this.warn === "function"
+            ? (message: string) => this.warn(message)
+            : undefined;
         return transformRouter(
           code,
           filePath,
           routerFnNames,
           normalizePath(id),
+          warn,
         );
       } finally {
         counter?.record(id, performance.now() - start);

package/src/vite/utils/prerender-utils.ts

@@ -9,9 +9,7 @@ import {
 } from "node:fs";
 import { resolve } from "node:path";
 
-export function escapeRegExp(str: string): string {
-  return str.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
-}
+import { escapeRegExp } from "../../regex-escape.js";
 
 export function encodePathParam(value: unknown): string {
   return String(value)