@tanstack/react-router 1.147.2 → 1.147.3

package/dist/esm/headContentUtils.js

@@ -0,0 +1,168 @@
+import * as React from "react";
+import { escapeHtml } from "@tanstack/router-core";
+import { useRouter } from "./useRouter.js";
+import { useRouterState } from "./useRouterState.js";
+const useTags = () => {
+  const router = useRouter();
+  const nonce = router.options.ssr?.nonce;
+  const routeMeta = useRouterState({
+    select: (state) => {
+      return state.matches.map((match) => match.meta).filter(Boolean);
+    }
+  });
+  const meta = React.useMemo(() => {
+    const resultMeta = [];
+    const metaByAttribute = {};
+    let title;
+    for (let i = routeMeta.length - 1; i >= 0; i--) {
+      const metas = routeMeta[i];
+      for (let j = metas.length - 1; j >= 0; j--) {
+        const m = metas[j];
+        if (!m) continue;
+        if (m.title) {
+          if (!title) {
+            title = {
+              tag: "title",
+              children: m.title
+            };
+          }
+        } else if ("script:ld+json" in m) {
+          try {
+            const json = JSON.stringify(m["script:ld+json"]);
+            resultMeta.push({
+              tag: "script",
+              attrs: {
+                type: "application/ld+json"
+              },
+              children: escapeHtml(json)
+            });
+          } catch {
+          }
+        } else {
+          const attribute = m.name ?? m.property;
+          if (attribute) {
+            if (metaByAttribute[attribute]) {
+              continue;
+            } else {
+              metaByAttribute[attribute] = true;
+            }
+          }
+          resultMeta.push({
+            tag: "meta",
+            attrs: {
+              ...m,
+              nonce
+            }
+          });
+        }
+      }
+    }
+    if (title) {
+      resultMeta.push(title);
+    }
+    if (nonce) {
+      resultMeta.push({
+        tag: "meta",
+        attrs: {
+          property: "csp-nonce",
+          content: nonce
+        }
+      });
+    }
+    resultMeta.reverse();
+    return resultMeta;
+  }, [routeMeta, nonce]);
+  const links = useRouterState({
+    select: (state) => {
+      const constructed = state.matches.map((match) => match.links).filter(Boolean).flat(1).map((link) => ({
+        tag: "link",
+        attrs: {
+          ...link,
+          nonce
+        }
+      }));
+      const manifest = router.ssr?.manifest;
+      const assets = state.matches.map((match) => manifest?.routes[match.routeId]?.assets ?? []).filter(Boolean).flat(1).filter((asset) => asset.tag === "link").map(
+        (asset) => ({
+          tag: "link",
+          attrs: {
+            ...asset.attrs,
+            suppressHydrationWarning: true,
+            nonce
+          }
+        })
+      );
+      return [...constructed, ...assets];
+    },
+    structuralSharing: true
+  });
+  const preloadLinks = useRouterState({
+    select: (state) => {
+      const preloadLinks2 = [];
+      state.matches.map((match) => router.looseRoutesById[match.routeId]).forEach(
+        (route) => router.ssr?.manifest?.routes[route.id]?.preloads?.filter(Boolean).forEach((preload) => {
+          preloadLinks2.push({
+            tag: "link",
+            attrs: {
+              rel: "modulepreload",
+              href: preload,
+              nonce
+            }
+          });
+        })
+      );
+      return preloadLinks2;
+    },
+    structuralSharing: true
+  });
+  const styles = useRouterState({
+    select: (state) => state.matches.map((match) => match.styles).flat(1).filter(Boolean).map(({ children, ...attrs }) => ({
+      tag: "style",
+      attrs: {
+        ...attrs,
+        nonce
+      },
+      children
+    })),
+    structuralSharing: true
+  });
+  const headScripts = useRouterState({
+    select: (state) => state.matches.map((match) => match.headScripts).flat(1).filter(Boolean).map(({ children, ...script }) => ({
+      tag: "script",
+      attrs: {
+        ...script,
+        nonce
+      },
+      children
+    })),
+    structuralSharing: true
+  });
+  return uniqBy(
+    [
+      ...meta,
+      ...preloadLinks,
+      ...links,
+      ...styles,
+      ...headScripts
+    ],
+    (d) => {
+      return JSON.stringify(d);
+    }
+  );
+};
+function uniqBy(arr, fn) {
+  const seen = /* @__PURE__ */ new Set();
+  return arr.filter((item) => {
+    const key = fn(item);
+    if (seen.has(key)) {
+      return false;
+    }
+    seen.add(key);
+    return true;
+  });
+}
+export {
+  uniqBy,
+  useTags
+};
+//# sourceMappingURL=headContentUtils.js.map

package/dist/esm/headContentUtils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"headContentUtils.js","sources":["../../src/headContentUtils.tsx"],"sourcesContent":["import * as React from 'react'\nimport { escapeHtml } from '@tanstack/router-core'\nimport { useRouter } from './useRouter'\nimport { useRouterState } from './useRouterState'\nimport type { RouterManagedTag } from '@tanstack/router-core'\n\n/**\n * Build the list of head/link/meta/script tags to render for active matches.\n * Used internally by `HeadContent`.\n */\nexport const useTags = () => {\n  const router = useRouter()\n  const nonce = router.options.ssr?.nonce\n  const routeMeta = useRouterState({\n    select: (state) => {\n      return state.matches.map((match) => match.meta!).filter(Boolean)\n    },\n  })\n\n  const meta: Array<RouterManagedTag> = React.useMemo(() => {\n    const resultMeta: Array<RouterManagedTag> = []\n    const metaByAttribute: Record<string, true> = {}\n    let title: RouterManagedTag | undefined\n    for (let i = routeMeta.length - 1; i >= 0; i--) {\n      const metas = routeMeta[i]!\n      for (let j = metas.length - 1; j >= 0; j--) {\n        const m = metas[j]\n        if (!m) continue\n\n        if (m.title) {\n          if (!title) {\n            title = {\n              tag: 'title',\n              children: m.title,\n            }\n          }\n        } else if ('script:ld+json' in m) {\n          // Handle JSON-LD structured data\n          // Content is HTML-escaped to prevent XSS when injected via dangerouslySetInnerHTML\n          try {\n            const json = JSON.stringify(m['script:ld+json'])\n            resultMeta.push({\n              tag: 'script',\n              attrs: {\n                type: 'application/ld+json',\n              },\n              children: escapeHtml(json),\n            })\n          } catch {\n            // Skip invalid JSON-LD objects\n          }\n        } else {\n          const attribute = m.name ?? m.property\n          if (attribute) {\n            if (metaByAttribute[attribute]) {\n              continue\n            } else {\n              metaByAttribute[attribute] = true\n            }\n          }\n\n          resultMeta.push({\n            tag: 'meta',\n            attrs: {\n              ...m,\n              nonce,\n            },\n          })\n        }\n      }\n    }\n\n    if (title) {\n      resultMeta.push(title)\n    }\n\n    if (nonce) {\n      resultMeta.push({\n        tag: 'meta',\n        attrs: {\n          property: 'csp-nonce',\n          content: nonce,\n        },\n      })\n    }\n    resultMeta.reverse()\n\n    return resultMeta\n  }, [routeMeta, nonce])\n\n  const links = useRouterState({\n    select: (state) => {\n      const constructed = state.matches\n        .map((match) => match.links!)\n        .filter(Boolean)\n        .flat(1)\n        .map((link) => ({\n          tag: 'link',\n          attrs: {\n            ...link,\n            nonce,\n          },\n        })) satisfies Array<RouterManagedTag>\n\n      const manifest = router.ssr?.manifest\n\n      // These are the assets extracted from the ViteManifest\n      // using the `startManifestPlugin`\n      const assets = state.matches\n        .map((match) => manifest?.routes[match.routeId]?.assets ?? [])\n        .filter(Boolean)\n        .flat(1)\n        .filter((asset) => asset.tag === 'link')\n        .map(\n          (asset) =>\n            ({\n              tag: 'link',\n              attrs: {\n                ...asset.attrs,\n                suppressHydrationWarning: true,\n                nonce,\n              },\n            }) satisfies RouterManagedTag,\n        )\n\n      return [...constructed, ...assets]\n    },\n    structuralSharing: true as any,\n  })\n\n  const preloadLinks = useRouterState({\n    select: (state) => {\n      const preloadLinks: Array<RouterManagedTag> = []\n\n      state.matches\n        .map((match) => router.looseRoutesById[match.routeId]!)\n        .forEach((route) =>\n          router.ssr?.manifest?.routes[route.id]?.preloads\n            ?.filter(Boolean)\n            .forEach((preload) => {\n              preloadLinks.push({\n                tag: 'link',\n                attrs: {\n                  rel: 'modulepreload',\n                  href: preload,\n                  nonce,\n                },\n              })\n            }),\n        )\n\n      return preloadLinks\n    },\n    structuralSharing: true as any,\n  })\n\n  const styles = useRouterState({\n    select: (state) =>\n      (\n        state.matches\n          .map((match) => match.styles!)\n          .flat(1)\n          .filter(Boolean) as Array<RouterManagedTag>\n      ).map(({ children, ...attrs }) => ({\n        tag: 'style',\n        attrs: {\n          ...attrs,\n          nonce,\n        },\n        children,\n      })),\n    structuralSharing: true as any,\n  })\n\n  const headScripts: Array<RouterManagedTag> = useRouterState({\n    select: (state) =>\n      (\n        state.matches\n          .map((match) => match.headScripts!)\n          .flat(1)\n          .filter(Boolean) as Array<RouterManagedTag>\n      ).map(({ children, ...script }) => ({\n        tag: 'script',\n        attrs: {\n          ...script,\n          nonce,\n        },\n        children,\n      })),\n    structuralSharing: true as any,\n  })\n\n  return uniqBy(\n    [\n      ...meta,\n      ...preloadLinks,\n      ...links,\n      ...styles,\n      ...headScripts,\n    ] as Array<RouterManagedTag>,\n    (d) => {\n      return JSON.stringify(d)\n    },\n  )\n}\n\nexport function uniqBy<T>(arr: Array<T>, fn: (item: T) => string) {\n  const seen = new Set<string>()\n  return arr.filter((item) => {\n    const key = fn(item)\n    if (seen.has(key)) {\n      return false\n    }\n    seen.add(key)\n    return true\n  })\n}\n"],"names":["preloadLinks"],"mappings":"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"}

package/dist/esm/index.d.ts

@@ -48,6 +48,7 @@ export type { ValidateFromPath, ValidateToPath, ValidateSearch, ValidateParams,
 export { ScriptOnce } from './ScriptOnce.js';
 export { Asset } from './Asset.js';
 export { HeadContent } from './HeadContent.js';
+export { useTags } from './headContentUtils.js';
 export { Scripts } from './Scripts.js';
 export type * from './ssr/serializer.js';
 export { composeRewrites } from '@tanstack/router-core';

package/dist/esm/index.dev.d.ts

@@ -0,0 +1,2 @@
+export * from './index.js';
+export { HeadContent } from './HeadContent.dev';

package/dist/esm/index.dev.js

@@ -0,0 +1,144 @@
+import { PathParamError, SearchParamError, TSR_DEFERRED_PROMISE, cleanPath, componentTypes, composeRewrites, createControlledPromise, createRouterConfig, createSerializationAdapter, deepEqual, defaultParseSearch, defaultSerializeError, defaultStringifySearch, defer, functionalUpdate, getInitialRouterState, interpolatePath, isMatch, isNotFound, isPlainArray, isPlainObject, isRedirect, joinPaths, lazyFn, notFound, parseSearchWith, redirect, replaceEqualDeep, resolvePath, retainSearchParams, rootRouteId, stringifySearchWith, stripSearchParams, trimPath, trimPathLeft, trimPathRight } from "@tanstack/router-core";
+import { createBrowserHistory, createHashHistory, createHistory, createMemoryHistory } from "@tanstack/history";
+import { Await, useAwaited } from "./awaited.js";
+import { CatchBoundary, ErrorComponent } from "./CatchBoundary.js";
+import { ClientOnly, useHydrated } from "./ClientOnly.js";
+import { FileRoute, FileRouteLoader, LazyRoute, createFileRoute, createLazyFileRoute, createLazyRoute } from "./fileRoute.js";
+import { lazyRouteComponent } from "./lazyRouteComponent.js";
+import { Link, createLink, linkOptions, useLinkProps } from "./link.js";
+import { MatchRoute, Matches, useChildMatches, useMatchRoute, useMatches, useParentMatches } from "./Matches.js";
+import { matchContext } from "./matchContext.js";
+import { Match, Outlet } from "./Match.js";
+import { useMatch } from "./useMatch.js";
+import { useLoaderDeps } from "./useLoaderDeps.js";
+import { useLoaderData } from "./useLoaderData.js";
+import { NotFoundRoute, RootRoute, Route, RouteApi, createRootRoute, createRootRouteWithContext, createRoute, createRouteMask, getRouteApi, rootRouteWithContext } from "./route.js";
+import { Router, createRouter } from "./router.js";
+import { RouterContextProvider, RouterProvider } from "./RouterProvider.js";
+import { ScrollRestoration, useElementScrollRestoration } from "./ScrollRestoration.js";
+import { Block, useBlocker } from "./useBlocker.js";
+import { Navigate, useNavigate } from "./useNavigate.js";
+import { useParams } from "./useParams.js";
+import { useSearch } from "./useSearch.js";
+import { getRouterContext } from "./routerContext.js";
+import { useRouteContext } from "./useRouteContext.js";
+import { useRouter } from "./useRouter.js";
+import { useRouterState } from "./useRouterState.js";
+import { useLocation } from "./useLocation.js";
+import { useCanGoBack } from "./useCanGoBack.js";
+import { useLayoutEffect, useStableCallback } from "./utils.js";
+import { CatchNotFound, DefaultGlobalNotFound } from "./not-found.js";
+import { ScriptOnce } from "./ScriptOnce.js";
+import { Asset } from "./Asset.js";
+import { useTags } from "./headContentUtils.js";
+import { Scripts } from "./Scripts.js";
+import { HeadContent } from "./HeadContent.dev.js";
+export {
+  Asset,
+  Await,
+  Block,
+  CatchBoundary,
+  CatchNotFound,
+  ClientOnly,
+  DefaultGlobalNotFound,
+  ErrorComponent,
+  FileRoute,
+  FileRouteLoader,
+  HeadContent,
+  LazyRoute,
+  Link,
+  Match,
+  MatchRoute,
+  Matches,
+  Navigate,
+  NotFoundRoute,
+  Outlet,
+  PathParamError,
+  RootRoute,
+  Route,
+  RouteApi,
+  Router,
+  RouterContextProvider,
+  RouterProvider,
+  ScriptOnce,
+  Scripts,
+  ScrollRestoration,
+  SearchParamError,
+  TSR_DEFERRED_PROMISE,
+  cleanPath,
+  componentTypes,
+  composeRewrites,
+  createBrowserHistory,
+  createControlledPromise,
+  createFileRoute,
+  createHashHistory,
+  createHistory,
+  createLazyFileRoute,
+  createLazyRoute,
+  createLink,
+  createMemoryHistory,
+  createRootRoute,
+  createRootRouteWithContext,
+  createRoute,
+  createRouteMask,
+  createRouter,
+  createRouterConfig,
+  createSerializationAdapter,
+  deepEqual,
+  defaultParseSearch,
+  defaultSerializeError,
+  defaultStringifySearch,
+  defer,
+  functionalUpdate,
+  getInitialRouterState,
+  getRouteApi,
+  getRouterContext,
+  interpolatePath,
+  isMatch,
+  isNotFound,
+  isPlainArray,
+  isPlainObject,
+  isRedirect,
+  joinPaths,
+  lazyFn,
+  lazyRouteComponent,
+  linkOptions,
+  matchContext,
+  notFound,
+  parseSearchWith,
+  redirect,
+  replaceEqualDeep,
+  resolvePath,
+  retainSearchParams,
+  rootRouteId,
+  rootRouteWithContext,
+  stringifySearchWith,
+  stripSearchParams,
+  trimPath,
+  trimPathLeft,
+  trimPathRight,
+  useAwaited,
+  useBlocker,
+  useCanGoBack,
+  useChildMatches,
+  useElementScrollRestoration,
+  useHydrated,
+  useLayoutEffect,
+  useLinkProps,
+  useLoaderData,
+  useLoaderDeps,
+  useLocation,
+  useMatch,
+  useMatchRoute,
+  useMatches,
+  useNavigate,
+  useParams,
+  useParentMatches,
+  useRouteContext,
+  useRouter,
+  useRouterState,
+  useSearch,
+  useStableCallback,
+  useTags
+};
+//# sourceMappingURL=index.dev.js.map

package/dist/esm/index.dev.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.dev.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/esm/index.js

@@ -31,6 +31,7 @@ import { CatchNotFound, DefaultGlobalNotFound } from "./not-found.js";
 import { ScriptOnce } from "./ScriptOnce.js";
 import { Asset } from "./Asset.js";
 import { HeadContent } from "./HeadContent.js";
+import { useTags } from "./headContentUtils.js";
 import { Scripts } from "./Scripts.js";
 export {
   Asset,
@@ -137,6 +138,7 @@ export {
   useRouter,
   useRouterState,
   useSearch,
-  useStableCallback
+  useStableCallback,
+  useTags
 };
 //# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tanstack/react-router",
-  "version": "1.147.2",
+  "version": "1.147.3",
   "description": "Modern and scalable routing for React applications",
   "author": "Tanner Linsley",
   "license": "MIT",
@@ -31,10 +31,12 @@
     ".": {
       "import": {
         "types": "./dist/esm/index.d.ts",
+        "development": "./dist/esm/index.dev.js",
         "default": "./dist/esm/index.js"
       },
       "require": {
         "types": "./dist/cjs/index.d.cts",
+        "development": "./dist/cjs/index.dev.cjs",
         "default": "./dist/cjs/index.cjs"
       }
     },
@@ -79,8 +81,8 @@
     "isbot": "^5.1.22",
     "tiny-invariant": "^1.3.3",
     "tiny-warning": "^1.0.3",
-    "@tanstack/router-core": "1.147.1",
-    "@tanstack/history": "1.145.7"
+    "@tanstack/history": "1.145.7",
+    "@tanstack/router-core": "1.147.1"
   },
   "devDependencies": {
     "@testing-library/jest-dom": "^6.6.3",

package/src/HeadContent.dev.tsx

@@ -0,0 +1,46 @@
+import * as React from 'react'
+import { Asset } from './Asset'
+import { useRouter } from './useRouter'
+import { useHydrated } from './ClientOnly'
+import { useTags } from './headContentUtils'
+
+const DEV_STYLES_ATTR = 'data-tanstack-router-dev-styles'
+
+/**
+ * Render route-managed head tags (title, meta, links, styles, head scripts).
+ * Place inside the document head of your app shell.
+ *
+ * Development version: filters out dev styles link after hydration and
+ * includes a fallback cleanup effect for hydration mismatch cases.
+ *
+ * @link https://tanstack.com/router/latest/docs/framework/react/guide/document-head-management
+ */
+export function HeadContent() {
+  const tags = useTags()
+  const router = useRouter()
+  const nonce = router.options.ssr?.nonce
+  const hydrated = useHydrated()
+
+  // Fallback cleanup for hydration mismatch cases
+  // Runs when hydration completes to remove any orphaned dev styles links from DOM
+  React.useEffect(() => {
+    if (hydrated) {
+      document
+        .querySelectorAll(`link[${DEV_STYLES_ATTR}]`)
+        .forEach((el) => el.remove())
+    }
+  }, [hydrated])
+
+  // Filter out dev styles after hydration
+  const filteredTags = hydrated
+    ? tags.filter((tag) => !tag.attrs?.[DEV_STYLES_ATTR])
+    : tags
+
+  return (
+    <>
+      {filteredTags.map((tag) => (
+        <Asset {...tag} key={`tsr-meta-${JSON.stringify(tag)}`} nonce={nonce} />
+      ))}
+    </>
+  )
+}