@tanstack/react-router 1.81.13 → 1.82.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tanstack/react-router",
-  "version": "1.81.13",
+  "version": "1.82.0",
   "description": "Modern and scalable routing for React applications",
   "author": "Tanner Linsley",
   "license": "MIT",

package/src/route.ts

@@ -434,7 +434,10 @@ export interface UpdatableRouteOptions<
       TLoaderDeps
     >,
   ) => void
-  meta?: (ctx: {
+  headers?: (ctx: {
+    loaderData: ResolveLoaderData<TLoaderFn>
+  }) => Record<string, string>
+  head?: (ctx: {
     matches: Array<
       RouteMatch<
         TRouteId,
@@ -466,13 +469,12 @@ export interface UpdatableRouteOptions<
       TLoaderDeps
     >
     params: ResolveAllParamsFromParent<TParentRoute, TParams>
-    loaderData: ResolveLoaderData<TLoaderFn>
-  }) => Array<React.JSX.IntrinsicElements['meta']>
-  links?: () => Array<React.JSX.IntrinsicElements['link']>
-  scripts?: () => Array<React.JSX.IntrinsicElements['script']>
-  headers?: (ctx: {
-    loaderData: ResolveLoaderData<TLoaderFn>
-  }) => Record<string, string>
+    loaderData: ResolveLoaderData<TLoaderFn> | undefined
+  }) => {
+    links?: Array<React.JSX.IntrinsicElements['link']> | undefined
+    scripts?: Array<React.JSX.IntrinsicElements['script']> | undefined
+    meta?: Array<React.JSX.IntrinsicElements['meta']> | undefined
+  }
   ssr?: boolean
 }
 

package/src/router.ts

@@ -1298,25 +1298,30 @@ export class Router<
             : loaderDeps,
           invalid: false,
           preload: false,
-          links: route.options.links?.(),
-          scripts: route.options.scripts?.(),
+          links: undefined,
+          scripts: undefined,
+          meta: undefined,
           staticData: route.options.staticData || {},
           loadPromise: createControlledPromise(),
           fullPath: route.fullPath,
         }
       }
 
-      // If it's already a success, update the meta and headers
+      const headFnContent = route.options.head?.({
+        matches,
+        match,
+        params: match.params,
+        loaderData: match.loaderData ?? undefined,
+      })
+
+      match.links = headFnContent?.links
+      match.scripts = headFnContent?.scripts
+      match.meta = headFnContent?.meta
+
+      // If it's already a success, update the headers
       // These may get updated again if the match is refreshed
       // due to being stale
       if (match.status === 'success') {
-        match.meta = route.options.meta?.({
-          matches,
-          match,
-          params: match.params,
-          loaderData: match.loaderData,
-        })
-
         match.headers = route.options.headers?.({
           loaderData: match.loaderData,
         })
@@ -2516,12 +2521,13 @@ export class Router<
 
                           await potentialPendingMinPromise()
 
-                          const meta = route.options.meta?.({
+                          const headFnContent = route.options.head?.({
                             matches,
                             match: this.getMatch(matchId)!,
                             params: this.getMatch(matchId)!.params,
                             loaderData,
                           })
+                          const meta = headFnContent?.meta
 
                           const headers = route.options.headers?.({
                             loaderData,
@@ -2933,7 +2939,7 @@ export class Router<
   }
 
   injectedHtml: Array<() => string> = []
-  injectHtml: (html: string) => void = (html) => {
+  injectHtml = (html: string) => {
     const cb = () => {
       this.injectedHtml = this.injectedHtml.filter((d) => d !== cb)
       return html
@@ -2941,16 +2947,17 @@ export class Router<
 
     this.injectedHtml.push(cb)
   }
-  injectScript: (script: string) => void = (script) => {
+  injectScript = (script: string, opts?: { logScript?: boolean }) => {
     this.injectHtml(
       `<script class='tsr-once'>${script}${
-        process.env.NODE_ENV === 'development'
+        process.env.NODE_ENV === 'development' && (opts?.logScript ?? true)
           ? `; console.info(\`Injected From Server:
 ${script}\`)`
           : ''
       }; __TSR__.cleanScripts()</script>`,
     )
   }
+
   streamedKeys: Set<string> = new Set()
 
   getStreamedValue = <T>(key: string): T | undefined => {