@tanstack/router-core 1.123.0 → 1.124.0

package/dist/esm/ssr/ssr-client.js

@@ -106,6 +106,7 @@ async function hydrate(router) {
       match.meta = headFnContent == null ? void 0 : headFnContent.meta;
       match.links = headFnContent == null ? void 0 : headFnContent.links;
       match.headScripts = headFnContent == null ? void 0 : headFnContent.scripts;
+      match.styles = headFnContent == null ? void 0 : headFnContent.styles;
       match.scripts = scripts;
     })
   );

package/dist/esm/ssr/ssr-client.js.map

@@ -1 +1 @@
-{"version":3,"file":"ssr-client.js","sources":["../../../src/ssr/ssr-client.ts"],"sourcesContent":["import invariant from 'tiny-invariant'\nimport { isPlainObject } from '../utils'\nimport { tsrSerializer } from '../serializer'\nimport type { DeferredPromiseState } from '../defer'\nimport type { MakeRouteMatch } from '../Matches'\nimport type { AnyRouter, ControllablePromise } from '../router'\nimport type { Manifest } from '../manifest'\nimport type { RouteContextOptions } from '../route'\n\ndeclare global {\n  interface Window {\n    __TSR_SSR__?: TsrSsrGlobal\n  }\n}\n\nexport interface TsrSsrGlobal {\n  matches: Array<SsrMatch>\n  streamedValues: Record<\n    string,\n    {\n      value: any\n      parsed: any\n    }\n  >\n  cleanScripts: () => void\n  dehydrated?: any\n  initMatch: (match: SsrMatch) => void\n  resolvePromise: (opts: {\n    matchId: string\n    id: number\n    promiseState: DeferredPromiseState<any>\n  }) => void\n  injectChunk: (opts: { matchId: string; id: number; chunk: string }) => void\n  closeStream: (opts: { matchId: string; id: number }) => void\n}\n\nexport interface SsrMatch {\n  id: string\n  __beforeLoadContext: string\n  loaderData?: string\n  error?: string\n  extracted?: Array<ClientExtractedEntry>\n  updatedAt: MakeRouteMatch['updatedAt']\n  status: MakeRouteMatch['status']\n}\n\nexport type ClientExtractedEntry =\n  | ClientExtractedStream\n  | ClientExtractedPromise\n\nexport interface ClientExtractedPromise extends ClientExtractedBaseEntry {\n  type: 'promise'\n  value?: ControllablePromise<any>\n}\n\nexport interface ClientExtractedStream extends ClientExtractedBaseEntry {\n  type: 'stream'\n  value?: ReadableStream & { controller?: ReadableStreamDefaultController }\n}\n\nexport interface ClientExtractedBaseEntry {\n  type: string\n  path: Array<string>\n}\n\nexport interface ResolvePromiseState {\n  matchId: string\n  id: number\n  promiseState: DeferredPromiseState<any>\n}\n\nexport interface DehydratedRouter {\n  manifest: Manifest | undefined\n  dehydratedData: any\n  lastMatchId: string\n}\n\nexport async function hydrate(router: AnyRouter): Promise<any> {\n  invariant(\n    window.__TSR_SSR__?.dehydrated,\n    'Expected to find a dehydrated data on window.__TSR_SSR__.dehydrated... but we did not. Please file an issue!',\n  )\n\n  const { manifest, dehydratedData, lastMatchId } = tsrSerializer.parse(\n    window.__TSR_SSR__.dehydrated,\n  ) as DehydratedRouter\n\n  router.ssr = {\n    manifest,\n    serializer: tsrSerializer,\n  }\n\n  router.clientSsr = {\n    getStreamedValue: <T>(key: string): T | undefined => {\n      if (router.isServer) {\n        return undefined\n      }\n\n      const streamedValue = window.__TSR_SSR__?.streamedValues[key]\n\n      if (!streamedValue) {\n        return\n      }\n\n      if (!streamedValue.parsed) {\n        streamedValue.parsed = router.ssr!.serializer.parse(streamedValue.value)\n      }\n\n      return streamedValue.parsed\n    },\n  }\n\n  // Hydrate the router state\n  const matches = router.matchRoutes(router.state.location)\n\n  // kick off loading the route chunks\n  const routeChunkPromise = Promise.all(\n    matches.map((match) => {\n      const route = router.looseRoutesById[match.routeId]!\n      return router.loadRouteChunk(route)\n    }),\n  )\n\n  // Right after hydration and before the first render, we need to rehydrate each match\n  // First step is to reyhdrate loaderData and __beforeLoadContext\n  matches.forEach((match) => {\n    const dehydratedMatch = window.__TSR_SSR__!.matches.find(\n      (d) => d.id === match.id,\n    )\n\n    if (!dehydratedMatch) {\n      return\n    }\n\n    Object.assign(match, dehydratedMatch)\n\n    // Handle beforeLoadContext\n    if (dehydratedMatch.__beforeLoadContext) {\n      match.__beforeLoadContext = router.ssr!.serializer.parse(\n        dehydratedMatch.__beforeLoadContext,\n      ) as any\n    }\n\n    // Handle loaderData\n    if (dehydratedMatch.loaderData) {\n      match.loaderData = router.ssr!.serializer.parse(\n        dehydratedMatch.loaderData,\n      )\n    }\n\n    // Handle error\n    if (dehydratedMatch.error) {\n      match.error = router.ssr!.serializer.parse(dehydratedMatch.error)\n    }\n\n    // Handle extracted\n    ;(match as unknown as SsrMatch).extracted?.forEach((ex) => {\n      deepMutableSetByPath(match, ['loaderData', ...ex.path], ex.value)\n    })\n\n    return match\n  })\n\n  router.__store.setState((s) => {\n    return {\n      ...s,\n      matches,\n    }\n  })\n\n  // Allow the user to handle custom hydration data\n  await router.options.hydrate?.(dehydratedData)\n\n  // now that all necessary data is hydrated:\n  // 1) fully reconstruct the route context\n  // 2) execute `head()` and `scripts()` for each match\n  await Promise.all(\n    router.state.matches.map(async (match) => {\n      const route = router.looseRoutesById[match.routeId]!\n\n      const parentMatch = router.state.matches[match.index - 1]\n      const parentContext = parentMatch?.context ?? router.options.context ?? {}\n\n      // `context()` was already executed by `matchRoutes`, however route context was not yet fully reconstructed\n      // so run it again and merge route context\n      const contextFnContext: RouteContextOptions<any, any, any, any> = {\n        deps: match.loaderDeps,\n        params: match.params,\n        context: parentContext,\n        location: router.state.location,\n        navigate: (opts: any) =>\n          router.navigate({ ...opts, _fromLocation: router.state.location }),\n        buildLocation: router.buildLocation,\n        cause: match.cause,\n        abortController: match.abortController,\n        preload: false,\n        matches,\n      }\n      match.__routeContext = route.options.context?.(contextFnContext) ?? {}\n\n      match.context = {\n        ...parentContext,\n        ...match.__routeContext,\n        ...match.__beforeLoadContext,\n      }\n\n      const assetContext = {\n        matches: router.state.matches,\n        match,\n        params: match.params,\n        loaderData: match.loaderData,\n      }\n      const headFnContent = await route.options.head?.(assetContext)\n\n      const scripts = await route.options.scripts?.(assetContext)\n\n      match.meta = headFnContent?.meta\n      match.links = headFnContent?.links\n      match.headScripts = headFnContent?.scripts\n      match.scripts = scripts\n    }),\n  )\n\n  if (matches[matches.length - 1]!.id !== lastMatchId) {\n    return await Promise.all([routeChunkPromise, router.load()])\n  }\n\n  return routeChunkPromise\n}\n\nfunction deepMutableSetByPath<T>(obj: T, path: Array<string>, value: any) {\n  // mutable set by path retaining array and object references\n  if (path.length === 1) {\n    ;(obj as any)[path[0]!] = value\n  }\n\n  const [key, ...rest] = path\n\n  if (Array.isArray(obj)) {\n    deepMutableSetByPath(obj[Number(key)], rest, value)\n  } else if (isPlainObject(obj)) {\n    deepMutableSetByPath((obj as any)[key!], rest, value)\n  }\n}\n"],"names":["_a","_b","_c"],"mappings":";;;AA6EA,eAAsB,QAAQ,QAAiC;;AAC7D;AAAA,KACE,YAAO,gBAAP,mBAAoB;AAAA,IACpB;AAAA,EACF;AAEA,QAAM,EAAE,UAAU,gBAAgB,gBAAgB,cAAc;AAAA,IAC9D,OAAO,YAAY;AAAA,EACrB;AAEA,SAAO,MAAM;AAAA,IACX;AAAA,IACA,YAAY;AAAA,EACd;AAEA,SAAO,YAAY;AAAA,IACjB,kBAAkB,CAAI,QAA+B;;AACnD,UAAI,OAAO,UAAU;AACZ,eAAA;AAAA,MAAA;AAGT,YAAM,iBAAgBA,MAAA,OAAO,gBAAP,gBAAAA,IAAoB,eAAe;AAEzD,UAAI,CAAC,eAAe;AAClB;AAAA,MAAA;AAGE,UAAA,CAAC,cAAc,QAAQ;AACzB,sBAAc,SAAS,OAAO,IAAK,WAAW,MAAM,cAAc,KAAK;AAAA,MAAA;AAGzE,aAAO,cAAc;AAAA,IAAA;AAAA,EAEzB;AAGA,QAAM,UAAU,OAAO,YAAY,OAAO,MAAM,QAAQ;AAGxD,QAAM,oBAAoB,QAAQ;AAAA,IAChC,QAAQ,IAAI,CAAC,UAAU;AACrB,YAAM,QAAQ,OAAO,gBAAgB,MAAM,OAAO;AAC3C,aAAA,OAAO,eAAe,KAAK;AAAA,IACnC,CAAA;AAAA,EACH;AAIQ,UAAA,QAAQ,CAAC,UAAU;;AACnB,UAAA,kBAAkB,OAAO,YAAa,QAAQ;AAAA,MAClD,CAAC,MAAM,EAAE,OAAO,MAAM;AAAA,IACxB;AAEA,QAAI,CAAC,iBAAiB;AACpB;AAAA,IAAA;AAGK,WAAA,OAAO,OAAO,eAAe;AAGpC,QAAI,gBAAgB,qBAAqB;AACjC,YAAA,sBAAsB,OAAO,IAAK,WAAW;AAAA,QACjD,gBAAgB;AAAA,MAClB;AAAA,IAAA;AAIF,QAAI,gBAAgB,YAAY;AACxB,YAAA,aAAa,OAAO,IAAK,WAAW;AAAA,QACxC,gBAAgB;AAAA,MAClB;AAAA,IAAA;AAIF,QAAI,gBAAgB,OAAO;AACzB,YAAM,QAAQ,OAAO,IAAK,WAAW,MAAM,gBAAgB,KAAK;AAAA,IAAA;AAIhE,KAAAA,MAAA,MAA8B,cAA9B,gBAAAA,IAAyC,QAAQ,CAAC,OAAO;AACpC,2BAAA,OAAO,CAAC,cAAc,GAAG,GAAG,IAAI,GAAG,GAAG,KAAK;AAAA,IAAA;AAG3D,WAAA;AAAA,EAAA,CACR;AAEM,SAAA,QAAQ,SAAS,CAAC,MAAM;AACtB,WAAA;AAAA,MACL,GAAG;AAAA,MACH;AAAA,IACF;AAAA,EAAA,CACD;AAGK,UAAA,kBAAO,SAAQ,YAAf,4BAAyB;AAK/B,QAAM,QAAQ;AAAA,IACZ,OAAO,MAAM,QAAQ,IAAI,OAAO,UAAU;;AACxC,YAAM,QAAQ,OAAO,gBAAgB,MAAM,OAAO;AAElD,YAAM,cAAc,OAAO,MAAM,QAAQ,MAAM,QAAQ,CAAC;AACxD,YAAM,iBAAgB,2CAAa,YAAW,OAAO,QAAQ,WAAW,CAAC;AAIzE,YAAM,mBAA4D;AAAA,QAChE,MAAM,MAAM;AAAA,QACZ,QAAQ,MAAM;AAAA,QACd,SAAS;AAAA,QACT,UAAU,OAAO,MAAM;AAAA,QACvB,UAAU,CAAC,SACT,OAAO,SAAS,EAAE,GAAG,MAAM,eAAe,OAAO,MAAM,SAAA,CAAU;AAAA,QACnE,eAAe,OAAO;AAAA,QACtB,OAAO,MAAM;AAAA,QACb,iBAAiB,MAAM;AAAA,QACvB,SAAS;AAAA,QACT;AAAA,MACF;AACA,YAAM,mBAAiBC,OAAAD,MAAA,MAAM,SAAQ,YAAd,gBAAAC,IAAA,KAAAD,KAAwB,sBAAqB,CAAC;AAErE,YAAM,UAAU;AAAA,QACd,GAAG;AAAA,QACH,GAAG,MAAM;AAAA,QACT,GAAG,MAAM;AAAA,MACX;AAEA,YAAM,eAAe;AAAA,QACnB,SAAS,OAAO,MAAM;AAAA,QACtB;AAAA,QACA,QAAQ,MAAM;AAAA,QACd,YAAY,MAAM;AAAA,MACpB;AACA,YAAM,gBAAgB,QAAM,MAAAE,MAAA,MAAM,SAAQ,SAAd,wBAAAA,KAAqB;AAEjD,YAAM,UAAU,QAAM,iBAAM,SAAQ,YAAd,4BAAwB;AAE9C,YAAM,OAAO,+CAAe;AAC5B,YAAM,QAAQ,+CAAe;AAC7B,YAAM,cAAc,+CAAe;AACnC,YAAM,UAAU;AAAA,IACjB,CAAA;AAAA,EACH;AAEA,MAAI,QAAQ,QAAQ,SAAS,CAAC,EAAG,OAAO,aAAa;AAC5C,WAAA,MAAM,QAAQ,IAAI,CAAC,mBAAmB,OAAO,KAAA,CAAM,CAAC;AAAA,EAAA;AAGtD,SAAA;AACT;AAEA,SAAS,qBAAwB,KAAQ,MAAqB,OAAY;AAEpE,MAAA,KAAK,WAAW,GAAG;AACnB,QAAY,KAAK,CAAC,CAAE,IAAI;AAAA,EAAA;AAG5B,QAAM,CAAC,KAAK,GAAG,IAAI,IAAI;AAEnB,MAAA,MAAM,QAAQ,GAAG,GAAG;AACtB,yBAAqB,IAAI,OAAO,GAAG,CAAC,GAAG,MAAM,KAAK;AAAA,EAAA,WACzC,cAAc,GAAG,GAAG;AAC7B,yBAAsB,IAAY,GAAI,GAAG,MAAM,KAAK;AAAA,EAAA;AAExD;"}
+{"version":3,"file":"ssr-client.js","sources":["../../../src/ssr/ssr-client.ts"],"sourcesContent":["import invariant from 'tiny-invariant'\nimport { isPlainObject } from '../utils'\nimport { tsrSerializer } from '../serializer'\nimport type { DeferredPromiseState } from '../defer'\nimport type { MakeRouteMatch } from '../Matches'\nimport type { AnyRouter, ControllablePromise } from '../router'\nimport type { Manifest } from '../manifest'\nimport type { RouteContextOptions } from '../route'\n\ndeclare global {\n  interface Window {\n    __TSR_SSR__?: TsrSsrGlobal\n  }\n}\n\nexport interface TsrSsrGlobal {\n  matches: Array<SsrMatch>\n  streamedValues: Record<\n    string,\n    {\n      value: any\n      parsed: any\n    }\n  >\n  cleanScripts: () => void\n  dehydrated?: any\n  initMatch: (match: SsrMatch) => void\n  resolvePromise: (opts: {\n    matchId: string\n    id: number\n    promiseState: DeferredPromiseState<any>\n  }) => void\n  injectChunk: (opts: { matchId: string; id: number; chunk: string }) => void\n  closeStream: (opts: { matchId: string; id: number }) => void\n}\n\nexport interface SsrMatch {\n  id: string\n  __beforeLoadContext: string\n  loaderData?: string\n  error?: string\n  extracted?: Array<ClientExtractedEntry>\n  updatedAt: MakeRouteMatch['updatedAt']\n  status: MakeRouteMatch['status']\n}\n\nexport type ClientExtractedEntry =\n  | ClientExtractedStream\n  | ClientExtractedPromise\n\nexport interface ClientExtractedPromise extends ClientExtractedBaseEntry {\n  type: 'promise'\n  value?: ControllablePromise<any>\n}\n\nexport interface ClientExtractedStream extends ClientExtractedBaseEntry {\n  type: 'stream'\n  value?: ReadableStream & { controller?: ReadableStreamDefaultController }\n}\n\nexport interface ClientExtractedBaseEntry {\n  type: string\n  path: Array<string>\n}\n\nexport interface ResolvePromiseState {\n  matchId: string\n  id: number\n  promiseState: DeferredPromiseState<any>\n}\n\nexport interface DehydratedRouter {\n  manifest: Manifest | undefined\n  dehydratedData: any\n  lastMatchId: string\n}\n\nexport async function hydrate(router: AnyRouter): Promise<any> {\n  invariant(\n    window.__TSR_SSR__?.dehydrated,\n    'Expected to find a dehydrated data on window.__TSR_SSR__.dehydrated... but we did not. Please file an issue!',\n  )\n\n  const { manifest, dehydratedData, lastMatchId } = tsrSerializer.parse(\n    window.__TSR_SSR__.dehydrated,\n  ) as DehydratedRouter\n\n  router.ssr = {\n    manifest,\n    serializer: tsrSerializer,\n  }\n\n  router.clientSsr = {\n    getStreamedValue: <T>(key: string): T | undefined => {\n      if (router.isServer) {\n        return undefined\n      }\n\n      const streamedValue = window.__TSR_SSR__?.streamedValues[key]\n\n      if (!streamedValue) {\n        return\n      }\n\n      if (!streamedValue.parsed) {\n        streamedValue.parsed = router.ssr!.serializer.parse(streamedValue.value)\n      }\n\n      return streamedValue.parsed\n    },\n  }\n\n  // Hydrate the router state\n  const matches = router.matchRoutes(router.state.location)\n\n  // kick off loading the route chunks\n  const routeChunkPromise = Promise.all(\n    matches.map((match) => {\n      const route = router.looseRoutesById[match.routeId]!\n      return router.loadRouteChunk(route)\n    }),\n  )\n\n  // Right after hydration and before the first render, we need to rehydrate each match\n  // First step is to reyhdrate loaderData and __beforeLoadContext\n  matches.forEach((match) => {\n    const dehydratedMatch = window.__TSR_SSR__!.matches.find(\n      (d) => d.id === match.id,\n    )\n\n    if (!dehydratedMatch) {\n      return\n    }\n\n    Object.assign(match, dehydratedMatch)\n\n    // Handle beforeLoadContext\n    if (dehydratedMatch.__beforeLoadContext) {\n      match.__beforeLoadContext = router.ssr!.serializer.parse(\n        dehydratedMatch.__beforeLoadContext,\n      ) as any\n    }\n\n    // Handle loaderData\n    if (dehydratedMatch.loaderData) {\n      match.loaderData = router.ssr!.serializer.parse(\n        dehydratedMatch.loaderData,\n      )\n    }\n\n    // Handle error\n    if (dehydratedMatch.error) {\n      match.error = router.ssr!.serializer.parse(dehydratedMatch.error)\n    }\n\n    // Handle extracted\n    ;(match as unknown as SsrMatch).extracted?.forEach((ex) => {\n      deepMutableSetByPath(match, ['loaderData', ...ex.path], ex.value)\n    })\n\n    return match\n  })\n\n  router.__store.setState((s) => {\n    return {\n      ...s,\n      matches,\n    }\n  })\n\n  // Allow the user to handle custom hydration data\n  await router.options.hydrate?.(dehydratedData)\n\n  // now that all necessary data is hydrated:\n  // 1) fully reconstruct the route context\n  // 2) execute `head()` and `scripts()` for each match\n  await Promise.all(\n    router.state.matches.map(async (match) => {\n      const route = router.looseRoutesById[match.routeId]!\n\n      const parentMatch = router.state.matches[match.index - 1]\n      const parentContext = parentMatch?.context ?? router.options.context ?? {}\n\n      // `context()` was already executed by `matchRoutes`, however route context was not yet fully reconstructed\n      // so run it again and merge route context\n      const contextFnContext: RouteContextOptions<any, any, any, any> = {\n        deps: match.loaderDeps,\n        params: match.params,\n        context: parentContext,\n        location: router.state.location,\n        navigate: (opts: any) =>\n          router.navigate({ ...opts, _fromLocation: router.state.location }),\n        buildLocation: router.buildLocation,\n        cause: match.cause,\n        abortController: match.abortController,\n        preload: false,\n        matches,\n      }\n      match.__routeContext = route.options.context?.(contextFnContext) ?? {}\n\n      match.context = {\n        ...parentContext,\n        ...match.__routeContext,\n        ...match.__beforeLoadContext,\n      }\n\n      const assetContext = {\n        matches: router.state.matches,\n        match,\n        params: match.params,\n        loaderData: match.loaderData,\n      }\n      const headFnContent = await route.options.head?.(assetContext)\n\n      const scripts = await route.options.scripts?.(assetContext)\n\n      match.meta = headFnContent?.meta\n      match.links = headFnContent?.links\n      match.headScripts = headFnContent?.scripts\n      match.styles = headFnContent?.styles\n      match.scripts = scripts\n    }),\n  )\n\n  if (matches[matches.length - 1]!.id !== lastMatchId) {\n    return await Promise.all([routeChunkPromise, router.load()])\n  }\n\n  return routeChunkPromise\n}\n\nfunction deepMutableSetByPath<T>(obj: T, path: Array<string>, value: any) {\n  // mutable set by path retaining array and object references\n  if (path.length === 1) {\n    ;(obj as any)[path[0]!] = value\n  }\n\n  const [key, ...rest] = path\n\n  if (Array.isArray(obj)) {\n    deepMutableSetByPath(obj[Number(key)], rest, value)\n  } else if (isPlainObject(obj)) {\n    deepMutableSetByPath((obj as any)[key!], rest, value)\n  }\n}\n"],"names":["_a","_b","_c"],"mappings":"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"}

package/package.json

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

package/src/Matches.ts

@@ -109,6 +109,7 @@ export interface DefaultRouteMatchExtensions {
   links?: unknown
   headScripts?: unknown
   meta?: unknown
+  styles?: unknown
 }
 
 export interface RouteMatchExtensions extends DefaultRouteMatchExtensions {}

package/src/route.ts

@@ -1124,6 +1124,7 @@ export interface UpdatableRouteOptions<
     links?: AnyRouteMatch['links']
     scripts?: AnyRouteMatch['headScripts']
     meta?: AnyRouteMatch['meta']
+    styles?: AnyRouteMatch['styles']
   }>
   scripts?: (
     ctx: AssetFnContextOptions<

package/src/router.ts

@@ -1791,16 +1791,9 @@ export class RouterCore<
       location: this.latestLocation,
       pendingMatches,
       // If a cached moved to pendingMatches, remove it from cachedMatches
-      cachedMatches: s.cachedMatches.filter((cachedMatch) => {
-        const pendingMatch = pendingMatches.find((e) => e.id === cachedMatch.id)
-
-        if (!pendingMatch) return true
-
-        return (
-          cachedMatch.status === 'success' &&
-          (cachedMatch.isFetching || cachedMatch.loaderData !== undefined)
-        )
-      }),
+      cachedMatches: s.cachedMatches.filter(
+        (d) => !pendingMatches.find((e) => e.id === d.id),
+      ),
     }))
   }
 
@@ -2208,7 +2201,15 @@ export class RouterCore<
 
                 // Wait for the beforeLoad to resolve before we continue
                 await existingMatch.beforeLoadPromise
-                executeBeforeLoad = this.getMatch(matchId)!.status === 'error'
+                const match = this.getMatch(matchId)!
+                if (match.status === 'error') {
+                  executeBeforeLoad = true
+                } else if (
+                  match.preload &&
+                  (match.status === 'redirected' || match.status === 'notFound')
+                ) {
+                  handleRedirectAndNotFound(match, match.error)
+                }
               }
               if (executeBeforeLoad) {
                 // If we are not in the middle of a load OR the previous load failed, start it
@@ -2337,14 +2338,23 @@ export class RouterCore<
             validResolvedMatches.forEach(({ id: matchId, routeId }, index) => {
               matchPromises.push(
                 (async () => {
-                  const { loaderPromise: prevLoaderPromise } =
-                    this.getMatch(matchId)!
-
                   let loaderShouldRunAsync = false
                   let loaderIsRunningAsync = false
 
-                  if (prevLoaderPromise) {
-                    await prevLoaderPromise
+                  const prevMatch = this.getMatch(matchId)!
+                  // there is a loaderPromise, so we are in the middle of a load
+                  if (prevMatch.loaderPromise) {
+                    // do not block if we already have stale data we can show
+                    // but only if the ongoing load is not a preload since error handling is different for preloads
+                    // and we don't want to swallow errors
+                    if (
+                      prevMatch.status === 'success' &&
+                      !sync &&
+                      !prevMatch.preload
+                    ) {
+                      return this.getMatch(matchId)!
+                    }
+                    await prevMatch.loaderPromise
                     const match = this.getMatch(matchId)!
                     if (match.error) {
                       handleRedirectAndNotFound(match, match.error)
@@ -2427,12 +2437,20 @@ export class RouterCore<
                       const meta = headFnContent?.meta
                       const links = headFnContent?.links
                       const headScripts = headFnContent?.scripts
+                      const styles = headFnContent?.styles
 
                       const scripts =
                         await route.options.scripts?.(assetContext)
                       const headers =
                         await route.options.headers?.(assetContext)
-                      return { meta, links, headScripts, headers, scripts }
+                      return {
+                        meta,
+                        links,
+                        headScripts,
+                        headers,
+                        scripts,
+                        styles,
+                      }
                     }
 
                     const runLoader = async () => {

package/src/ssr/ssr-client.ts

@@ -217,6 +217,7 @@ export async function hydrate(router: AnyRouter): Promise<any> {
       match.meta = headFnContent?.meta
       match.links = headFnContent?.links
       match.headScripts = headFnContent?.scripts
+      match.styles = headFnContent?.styles
       match.scripts = scripts
     }),
   )