@richie-router/react 0.1.4 → 0.1.6

package/dist/cjs/router.cjs

@@ -541,7 +541,7 @@ class Router {
     return response.head;
   }
   async fetchRouteHead(route, params, search) {
-    const basePath = this.options.headBasePath ?? prependBasePathToHref("/head-api", this.basePath);
+    const basePath = prependBasePathToHref(import_core.resolveHostedRoutingConfig(this.routeTree.hostedRouting).headBasePath, this.basePath);
     const searchParams = new URLSearchParams({
       routeId: route.fullPath,
       params: JSON.stringify(params),
@@ -557,7 +557,7 @@ class Router {
     return await response.json();
   }
   async fetchDocumentHead(location) {
-    const basePath = this.options.headBasePath ?? prependBasePathToHref("/head-api", this.basePath);
+    const basePath = prependBasePathToHref(import_core.resolveHostedRoutingConfig(this.routeTree.hostedRouting).headBasePath, this.basePath);
     const searchParams = new URLSearchParams({
       href: prependBasePathToHref(location.href, this.basePath)
     });

package/dist/cjs/router.test.cjs

@@ -45,6 +45,12 @@ function createTestRouteTree(options) {
     component: () => null
   });
   aboutRoute._setServerHead(options?.serverHead);
+  if (options?.headBasePath) {
+    rootRoute._setHostedRouting({
+      headBasePath: options.headBasePath,
+      passthrough: [options.headBasePath]
+    });
+  }
   return rootRoute._addFileChildren({
     index: indexRoute,
     about: aboutRoute
@@ -129,6 +135,21 @@ function createLinkTestRouteTree(component) {
     posts: postsRoute
   });
 }
+function createStaticAndDynamicSiblingRouteTree() {
+  const rootRoute = import_router.createRootRoute({
+    component: () => null
+  });
+  const registerRoute = import_router.createFileRoute("/register")({
+    component: () => null
+  });
+  const usernameRoute = import_router.createFileRoute("/$username")({
+    component: () => null
+  });
+  return rootRoute._addFileChildren({
+    register: registerRoute,
+    username: usernameRoute
+  });
+}
 function renderLinkMarkup(initialEntry, component) {
   const history = import_router.createMemoryHistory({
     initialEntries: [initialEntry]
@@ -234,6 +255,38 @@ import_bun_test.describe("createRouter basePath", () => {
       globalThis.fetch = originalFetch;
     }
   });
+  import_bun_test.test("uses the route tree headBasePath for document head requests", async () => {
+    const history = import_router.createMemoryHistory({
+      initialEntries: ["/project/about"]
+    });
+    const fetchCalls = [];
+    const originalFetch = globalThis.fetch;
+    globalThis.fetch = async (input) => {
+      fetchCalls.push(typeof input === "string" ? input : input instanceof URL ? input.toString() : input.url);
+      return new Response(JSON.stringify({
+        head: [],
+        routeHeads: [
+          { routeId: "/about", head: [] }
+        ]
+      }), {
+        status: 200,
+        headers: {
+          "content-type": "application/json"
+        }
+      });
+    };
+    try {
+      const router = import_router.createRouter({
+        routeTree: createTestRouteTree({ serverHead: true, headBasePath: "/meta" }),
+        history,
+        basePath: "/project"
+      });
+      await router.load();
+      import_bun_test.expect(fetchCalls).toEqual(["/project/meta?href=%2Fproject%2Fabout"]);
+    } finally {
+      globalThis.fetch = originalFetch;
+    }
+  });
   import_bun_test.test("uses one document head request and preserves inline head precedence", async () => {
     const history = import_router.createMemoryHistory({
       initialEntries: ["/posts/alpha"]
@@ -534,6 +587,28 @@ import_bun_test.describe("Link active state", () => {
     import_bun_test.expect(markup).not.toContain('class="active"');
   });
 });
+import_bun_test.describe("route matching precedence", () => {
+  import_bun_test.test("prefers a static sibling over a dynamic sibling", () => {
+    const router = import_router.createRouter({
+      routeTree: createStaticAndDynamicSiblingRouteTree(),
+      history: import_router.createMemoryHistory({
+        initialEntries: ["/register"]
+      })
+    });
+    import_bun_test.expect(router.state.matches.at(-1)?.route.fullPath).toBe("/register");
+    import_bun_test.expect(router.state.matches.at(-1)?.params).toEqual({});
+  });
+  import_bun_test.test("falls back to the dynamic sibling when no static sibling matches", () => {
+    const router = import_router.createRouter({
+      routeTree: createStaticAndDynamicSiblingRouteTree(),
+      history: import_router.createMemoryHistory({
+        initialEntries: ["/richie"]
+      })
+    });
+    import_bun_test.expect(router.state.matches.at(-1)?.route.fullPath).toBe("/$username");
+    import_bun_test.expect(router.state.matches.at(-1)?.params).toEqual({ username: "richie" });
+  });
+});
 import_bun_test.describe("useMatchRoute", () => {
   import_bun_test.test("returns matched params for exact matches", () => {
     const markup = renderLinkMarkup("/posts/alpha", () => {

package/dist/esm/router.mjs

@@ -14,7 +14,8 @@ import {
   matchRouteTree,
   notFound,
   redirect,
-  resolveHeadConfig
+  resolveHeadConfig,
+  resolveHostedRoutingConfig
 } from "@richie-router/core";
 import {
   createBrowserHistory,
@@ -464,7 +465,7 @@ class Router {
     return response.head;
   }
   async fetchRouteHead(route, params, search) {
-    const basePath = this.options.headBasePath ?? prependBasePathToHref("/head-api", this.basePath);
+    const basePath = prependBasePathToHref(resolveHostedRoutingConfig(this.routeTree.hostedRouting).headBasePath, this.basePath);
     const searchParams = new URLSearchParams({
       routeId: route.fullPath,
       params: JSON.stringify(params),
@@ -480,7 +481,7 @@ class Router {
     return await response.json();
   }
   async fetchDocumentHead(location) {
-    const basePath = this.options.headBasePath ?? prependBasePathToHref("/head-api", this.basePath);
+    const basePath = prependBasePathToHref(resolveHostedRoutingConfig(this.routeTree.hostedRouting).headBasePath, this.basePath);
     const searchParams = new URLSearchParams({
       href: prependBasePathToHref(location.href, this.basePath)
     });

package/dist/esm/router.test.mjs

@@ -23,6 +23,12 @@ function createTestRouteTree(options) {
     component: () => null
   });
   aboutRoute._setServerHead(options?.serverHead);
+  if (options?.headBasePath) {
+    rootRoute._setHostedRouting({
+      headBasePath: options.headBasePath,
+      passthrough: [options.headBasePath]
+    });
+  }
   return rootRoute._addFileChildren({
     index: indexRoute,
     about: aboutRoute
@@ -107,6 +113,21 @@ function createLinkTestRouteTree(component) {
     posts: postsRoute
   });
 }
+function createStaticAndDynamicSiblingRouteTree() {
+  const rootRoute = createRootRoute({
+    component: () => null
+  });
+  const registerRoute = createFileRoute("/register")({
+    component: () => null
+  });
+  const usernameRoute = createFileRoute("/$username")({
+    component: () => null
+  });
+  return rootRoute._addFileChildren({
+    register: registerRoute,
+    username: usernameRoute
+  });
+}
 function renderLinkMarkup(initialEntry, component) {
   const history = createMemoryHistory({
     initialEntries: [initialEntry]
@@ -212,6 +233,38 @@ describe("createRouter basePath", () => {
       globalThis.fetch = originalFetch;
     }
   });
+  test("uses the route tree headBasePath for document head requests", async () => {
+    const history = createMemoryHistory({
+      initialEntries: ["/project/about"]
+    });
+    const fetchCalls = [];
+    const originalFetch = globalThis.fetch;
+    globalThis.fetch = async (input) => {
+      fetchCalls.push(typeof input === "string" ? input : input instanceof URL ? input.toString() : input.url);
+      return new Response(JSON.stringify({
+        head: [],
+        routeHeads: [
+          { routeId: "/about", head: [] }
+        ]
+      }), {
+        status: 200,
+        headers: {
+          "content-type": "application/json"
+        }
+      });
+    };
+    try {
+      const router = createRouter({
+        routeTree: createTestRouteTree({ serverHead: true, headBasePath: "/meta" }),
+        history,
+        basePath: "/project"
+      });
+      await router.load();
+      expect(fetchCalls).toEqual(["/project/meta?href=%2Fproject%2Fabout"]);
+    } finally {
+      globalThis.fetch = originalFetch;
+    }
+  });
   test("uses one document head request and preserves inline head precedence", async () => {
     const history = createMemoryHistory({
       initialEntries: ["/posts/alpha"]
@@ -512,6 +565,28 @@ describe("Link active state", () => {
     expect(markup).not.toContain('class="active"');
   });
 });
+describe("route matching precedence", () => {
+  test("prefers a static sibling over a dynamic sibling", () => {
+    const router = createRouter({
+      routeTree: createStaticAndDynamicSiblingRouteTree(),
+      history: createMemoryHistory({
+        initialEntries: ["/register"]
+      })
+    });
+    expect(router.state.matches.at(-1)?.route.fullPath).toBe("/register");
+    expect(router.state.matches.at(-1)?.params).toEqual({});
+  });
+  test("falls back to the dynamic sibling when no static sibling matches", () => {
+    const router = createRouter({
+      routeTree: createStaticAndDynamicSiblingRouteTree(),
+      history: createMemoryHistory({
+        initialEntries: ["/richie"]
+      })
+    });
+    expect(router.state.matches.at(-1)?.route.fullPath).toBe("/$username");
+    expect(router.state.matches.at(-1)?.params).toEqual({ username: "richie" });
+  });
+});
 describe("useMatchRoute", () => {
   test("returns matched params for exact matches", () => {
     const markup = renderLinkMarkup("/posts/alpha", () => {

package/dist/types/router.d.ts

@@ -150,7 +150,6 @@ export interface RouterOptions<TRouteTree extends AnyRoute> {
     defaultErrorComponent?: AnyComponent;
     scrollRestoration?: boolean;
     scrollToTopSelectors?: string[];
-    headBasePath?: string;
     trailingSlash?: 'always' | 'never' | 'preserve';
     parseSearch?: (searchStr: string) => Record<string, unknown>;
     stringifySearch?: (search: Record<string, unknown>) => string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@richie-router/react",
-  "version": "0.1.4",
+  "version": "0.1.6",
   "description": "React runtime, components, and hooks for Richie Router",
   "sideEffects": false,
   "exports": {
@@ -13,7 +13,7 @@
     }
   },
   "dependencies": {
-    "@richie-router/core": "^0.1.3"
+    "@richie-router/core": "^0.1.5"
   },
   "peerDependencies": {
     "react": "^19"