@depup/tanstack__react-router 1.168.2-depup.0 → 1.168.3-depup.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (29) hide show
  1. package/README.md +2 -2
  2. package/changes.json +1 -1
  3. package/dist/cjs/HeadContent.cjs +2 -2
  4. package/dist/cjs/HeadContent.cjs.map +1 -1
  5. package/dist/cjs/HeadContent.d.cts +5 -1
  6. package/dist/cjs/HeadContent.dev.cjs +2 -2
  7. package/dist/cjs/HeadContent.dev.cjs.map +1 -1
  8. package/dist/cjs/HeadContent.dev.d.cts +2 -1
  9. package/dist/cjs/Match.cjs.map +1 -1
  10. package/dist/cjs/headContentUtils.cjs +11 -5
  11. package/dist/cjs/headContentUtils.cjs.map +1 -1
  12. package/dist/cjs/headContentUtils.d.cts +2 -2
  13. package/dist/esm/HeadContent.d.ts +5 -1
  14. package/dist/esm/HeadContent.dev.d.ts +2 -1
  15. package/dist/esm/HeadContent.dev.js +2 -2
  16. package/dist/esm/HeadContent.dev.js.map +1 -1
  17. package/dist/esm/HeadContent.js +2 -2
  18. package/dist/esm/HeadContent.js.map +1 -1
  19. package/dist/esm/Match.js.map +1 -1
  20. package/dist/esm/headContentUtils.d.ts +2 -2
  21. package/dist/esm/headContentUtils.js +12 -6
  22. package/dist/esm/headContentUtils.js.map +1 -1
  23. package/dist/llms/rules/guide.d.ts +1 -1
  24. package/dist/llms/rules/guide.js +18 -0
  25. package/package.json +4 -4
  26. package/src/HeadContent.dev.tsx +3 -2
  27. package/src/HeadContent.tsx +7 -2
  28. package/src/Match.tsx +1 -2
  29. package/src/headContentUtils.tsx +29 -5
package/dist/llms/rules/guide.js CHANGED
@@ -2923,6 +2923,24 @@ The \`<HeadContent />\` component is **required** to render the head, title, met
2923
2923
 
2924
2924
  It should be **rendered either in the \`<head>\` tag of your root layout or as high up in the component tree as possible** if your application doesn't or can't manage the \`<head>\` tag.
2925
2925
 
2926
+ For manifest-managed assets, you can also set \`crossorigin\` values on emitted
2927
+ \`modulepreload\` and stylesheet links:
2928
+
2929
+ \`\`\`tsx
2930
+ <HeadContent assetCrossOrigin="anonymous" />
2931
+
2932
+ <HeadContent
2933
+ assetCrossOrigin={{
2934
+ modulepreload: 'anonymous',
2935
+ stylesheet: 'use-credentials',
2936
+ }}
2937
+ />
2938
+ \`\`\`
2939
+
2940
+ \`assetCrossOrigin\` only applies to manifest-managed asset links emitted by Start.
2941
+ If you also set \`crossOrigin\` via \`transformAssets\` (either the object shorthand
2942
+ or a callback return value), \`assetCrossOrigin\` wins.
2943
+
2926
2944
  ### Start/Full-Stack Applications
2927
2945
 
2928
2946
  <!-- ::start:framework -->
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@depup/tanstack__react-router",
3
- "version": "1.168.2-depup.0",
3
+ "version": "1.168.3-depup.0",
4
4
  "description": "Modern and scalable routing for React applications (with updated dependencies)",
5
5
  "author": "Tanner Linsley",
6
6
  "license": "MIT",
@@ -88,7 +88,7 @@
88
88
  "@tanstack/react-store": "^0.9.2",
89
89
  "isbot": "^5.1.36",
90
90
  "@tanstack/history": "1.161.6",
91
- "@tanstack/router-core": "1.168.2"
91
+ "@tanstack/router-core": "1.168.3"
92
92
  },
93
93
  "devDependencies": {
94
94
  "@testing-library/jest-dom": "^6.6.3",
@@ -133,8 +133,8 @@
133
133
  },
134
134
  "depsUpdated": 1,
135
135
  "originalPackage": "@tanstack/react-router",
136
- "originalVersion": "1.168.2",
137
- "processedAt": "2026-03-22T12:15:25.312Z",
136
+ "originalVersion": "1.168.3",
137
+ "processedAt": "2026-03-23T16:28:17.589Z",
138
138
  "smokeTest": "passed"
139
139
  }
140
140
  }
package/src/HeadContent.dev.tsx CHANGED
@@ -3,6 +3,7 @@ import { Asset } from './Asset'
3
3
  import { useRouter } from './useRouter'
4
4
  import { useHydrated } from './ClientOnly'
5
5
  import { useTags } from './headContentUtils'
6
+ import type { HeadContentProps } from './HeadContent'
6
7
 
7
8
  const DEV_STYLES_ATTR = 'data-tanstack-router-dev-styles'
8
9
 
@@ -15,8 +16,8 @@ const DEV_STYLES_ATTR = 'data-tanstack-router-dev-styles'
15
16
  *
16
17
  * @link https://tanstack.com/router/latest/docs/framework/react/guide/document-head-management
17
18
  */
18
- export function HeadContent() {
19
- const tags = useTags()
19
+ export function HeadContent(props: HeadContentProps) {
20
+ const tags = useTags(props.assetCrossOrigin)
20
21
  const router = useRouter()
21
22
  const nonce = router.options.ssr?.nonce
22
23
  const hydrated = useHydrated()
package/src/HeadContent.tsx CHANGED
@@ -2,14 +2,19 @@ import * as React from 'react'
2
2
  import { Asset } from './Asset'
3
3
  import { useRouter } from './useRouter'
4
4
  import { useTags } from './headContentUtils'
5
+ import type { AssetCrossOriginConfig } from '@tanstack/router-core'
6
+
7
+ export interface HeadContentProps {
8
+ assetCrossOrigin?: AssetCrossOriginConfig
9
+ }
5
10
 
6
11
  /**
7
12
  * Render route-managed head tags (title, meta, links, styles, head scripts).
8
13
  * Place inside the document head of your app shell.
9
14
  * @link https://tanstack.com/router/latest/docs/framework/react/guide/document-head-management
10
15
  */
11
- export function HeadContent() {
12
- const tags = useTags()
16
+ export function HeadContent(props: HeadContentProps) {
17
+ const tags = useTags(props.assetCrossOrigin)
13
18
  const router = useRouter()
14
19
  const nonce = router.options.ssr?.nonce
15
20
  return (
package/src/Match.tsx CHANGED
@@ -64,7 +64,7 @@ export const Match = React.memo(function MatchImpl({
64
64
  // Subscribe directly to the match store from the pool.
65
65
  // The matchId prop is stable for this component's lifetime (set by Outlet),
66
66
  // and reconcileMatchPool reuses stores for the same matchId.
67
- // eslint-disable-next-line react-hooks/rules-of-hooks
67
+
68
68
  const matchStore = router.stores.activeMatchStoresById.get(matchId)
69
69
  if (!matchStore) {
70
70
  if (process.env.NODE_ENV !== 'production') {
@@ -338,7 +338,6 @@ export const MatchInner = React.memo(function MatchInnerImpl({
338
338
  return out
339
339
  }
340
340
 
341
- // eslint-disable-next-line react-hooks/rules-of-hooks
342
341
  const matchStore = router.stores.activeMatchStoresById.get(matchId)
343
342
  if (!matchStore) {
344
343
  if (process.env.NODE_ENV !== 'production') {
package/src/headContentUtils.tsx CHANGED
@@ -1,14 +1,23 @@
1
1
  import * as React from 'react'
2
2
  import { useStore } from '@tanstack/react-store'
3
- import { deepEqual, escapeHtml } from '@tanstack/router-core'
3
+ import {
4
+ deepEqual,
5
+ escapeHtml,
6
+ getAssetCrossOrigin,
7
+ resolveManifestAssetLink,
8
+ } from '@tanstack/router-core'
4
9
  import { isServer } from '@tanstack/router-core/isServer'
5
10
  import { useRouter } from './useRouter'
6
- import type { RouterManagedTag } from '@tanstack/router-core'
11
+ import type {
12
+ AssetCrossOriginConfig,
13
+ RouterManagedTag,
14
+ } from '@tanstack/router-core'
7
15
 
8
16
  function buildTagsFromMatches(
9
17
  router: ReturnType<typeof useRouter>,
10
18
  nonce: string | undefined,
11
19
  matches: Array<any>,
20
+ assetCrossOrigin?: AssetCrossOriginConfig,
12
21
  ): Array<RouterManagedTag> {
13
22
  const routeMeta = matches.map((match) => match.meta!).filter(Boolean)
14
23
 
@@ -101,6 +110,9 @@ function buildTagsFromMatches(
101
110
  tag: 'link',
102
111
  attrs: {
103
112
  ...asset.attrs,
113
+ crossOrigin:
114
+ getAssetCrossOrigin(assetCrossOrigin, 'stylesheet') ??
115
+ asset.attrs?.crossOrigin,
104
116
  suppressHydrationWarning: true,
105
117
  nonce,
106
118
  },
@@ -114,11 +126,15 @@ function buildTagsFromMatches(
114
126
  router.ssr?.manifest?.routes[route.id]?.preloads
115
127
  ?.filter(Boolean)
116
128
  .forEach((preload) => {
129
+ const preloadLink = resolveManifestAssetLink(preload)
117
130
  preloadLinks.push({
118
131
  tag: 'link',
119
132
  attrs: {
120
133
  rel: 'modulepreload',
121
- href: preload,
134
+ href: preloadLink.href,
135
+ crossOrigin:
136
+ getAssetCrossOrigin(assetCrossOrigin, 'modulepreload') ??
137
+ preloadLink.crossOrigin,
122
138
  nonce,
123
139
  },
124
140
  })
@@ -170,7 +186,7 @@ function buildTagsFromMatches(
170
186
  * Build the list of head/link/meta/script tags to render for active matches.
171
187
  * Used internally by `HeadContent`.
172
188
  */
173
- export const useTags = () => {
189
+ export const useTags = (assetCrossOrigin?: AssetCrossOriginConfig) => {
174
190
  const router = useRouter()
175
191
  const nonce = router.options.ssr?.nonce
176
192
 
@@ -179,6 +195,7 @@ export const useTags = () => {
179
195
  router,
180
196
  nonce,
181
197
  router.stores.activeMatchesSnapshot.state,
198
+ assetCrossOrigin,
182
199
  )
183
200
  }
184
201
 
@@ -294,6 +311,9 @@ export const useTags = () => {
294
311
  tag: 'link',
295
312
  attrs: {
296
313
  ...asset.attrs,
314
+ crossOrigin:
315
+ getAssetCrossOrigin(assetCrossOrigin, 'stylesheet') ??
316
+ asset.attrs?.crossOrigin,
297
317
  suppressHydrationWarning: true,
298
318
  nonce,
299
319
  },
@@ -317,11 +337,15 @@ export const useTags = () => {
317
337
  router.ssr?.manifest?.routes[route.id]?.preloads
318
338
  ?.filter(Boolean)
319
339
  .forEach((preload) => {
340
+ const preloadLink = resolveManifestAssetLink(preload)
320
341
  preloadLinks.push({
321
342
  tag: 'link',
322
343
  attrs: {
323
344
  rel: 'modulepreload',
324
- href: preload,
345
+ href: preloadLink.href,
346
+ crossOrigin:
347
+ getAssetCrossOrigin(assetCrossOrigin, 'modulepreload') ??
348
+ preloadLink.crossOrigin,
325
349
  nonce,
326
350
  },
327
351
  })