UNPKG

@tanstack/react-router

Version:

Modern and scalable routing for React applications

1 lines 8.39 kB
{"version":3,"file":"Asset.cjs","names":[],"sources":["../../src/Asset.tsx"],"sourcesContent":["import * as React from 'react'\nimport { isServer } from '@tanstack/router-core/isServer'\nimport { useRouter } from './useRouter'\nimport { useHydrated } from './ClientOnly'\nimport type { RouterManagedTag } from '@tanstack/router-core'\n\ninterface ScriptAttrs {\n [key: string]: string | boolean | undefined\n src?: string\n suppressHydrationWarning?: boolean\n}\n\nexport function Asset({\n tag,\n attrs,\n children,\n nonce,\n}: RouterManagedTag & { nonce?: string }): React.ReactElement | null {\n switch (tag) {\n case 'title':\n return (\n <title {...attrs} suppressHydrationWarning>\n {children}\n </title>\n )\n case 'meta':\n return <meta {...attrs} suppressHydrationWarning />\n case 'link':\n return <link {...attrs} nonce={nonce} suppressHydrationWarning />\n case 'style':\n return (\n <style\n {...attrs}\n dangerouslySetInnerHTML={{ __html: children as string }}\n nonce={nonce}\n />\n )\n case 'script':\n return <Script attrs={attrs}>{children}</Script>\n default:\n return null\n }\n}\n\nfunction Script({\n attrs,\n children,\n}: {\n attrs?: ScriptAttrs\n children?: string\n}) {\n const router = useRouter()\n const hydrated = useHydrated()\n const dataScript =\n typeof attrs?.type === 'string' &&\n attrs.type !== '' &&\n attrs.type !== 'text/javascript' &&\n attrs.type !== 'module'\n\n if (\n process.env.NODE_ENV !== 'production' &&\n attrs?.src &&\n typeof children === 'string' &&\n children.trim().length\n ) {\n console.warn(\n '[TanStack Router] <Script> received both `src` and `children`. The `children` content will be ignored. Remove `children` or remove `src`.',\n )\n }\n\n React.useEffect(() => {\n if (dataScript) return\n\n if (attrs?.src) {\n const normSrc = (() => {\n try {\n const base = document.baseURI || window.location.href\n return new URL(attrs.src, base).href\n } catch {\n return attrs.src\n }\n })()\n const existingScript = Array.from(\n document.querySelectorAll('script[src]'),\n ).find((el) => (el as HTMLScriptElement).src === normSrc)\n\n if (existingScript) {\n return\n }\n\n const script = document.createElement('script')\n\n for (const [key, value] of Object.entries(attrs)) {\n if (\n key !== 'suppressHydrationWarning' &&\n value !== undefined &&\n value !== false\n ) {\n script.setAttribute(\n key,\n typeof value === 'boolean' ? '' : String(value),\n )\n }\n }\n\n document.head.appendChild(script)\n\n return () => {\n if (script.parentNode) {\n script.parentNode.removeChild(script)\n }\n }\n }\n\n if (typeof children === 'string') {\n const typeAttr =\n typeof attrs?.type === 'string' ? attrs.type : 'text/javascript'\n const nonceAttr =\n typeof attrs?.nonce === 'string' ? attrs.nonce : undefined\n const existingScript = Array.from(\n document.querySelectorAll('script:not([src])'),\n ).find((el) => {\n if (!(el instanceof HTMLScriptElement)) return false\n const sType = el.getAttribute('type') ?? 'text/javascript'\n const sNonce = el.getAttribute('nonce') ?? undefined\n return (\n el.textContent === children &&\n sType === typeAttr &&\n sNonce === nonceAttr\n )\n })\n\n if (existingScript) {\n return\n }\n\n const script = document.createElement('script')\n script.textContent = children\n\n if (attrs) {\n for (const [key, value] of Object.entries(attrs)) {\n if (\n key !== 'suppressHydrationWarning' &&\n value !== undefined &&\n value !== false\n ) {\n script.setAttribute(\n key,\n typeof value === 'boolean' ? '' : String(value),\n )\n }\n }\n }\n\n document.head.appendChild(script)\n\n return () => {\n if (script.parentNode) {\n script.parentNode.removeChild(script)\n }\n }\n }\n\n return undefined\n }, [attrs, children, dataScript])\n\n // --- Server rendering ---\n if (isServer ?? router.isServer) {\n if (attrs?.src) {\n return <script {...attrs} suppressHydrationWarning />\n }\n\n if (typeof children === 'string') {\n return (\n <script\n {...attrs}\n dangerouslySetInnerHTML={{ __html: children }}\n suppressHydrationWarning\n />\n )\n }\n\n return null\n }\n\n // --- Client rendering ---\n\n // Data scripts (e.g. application/ld+json) are rendered in the tree;\n // the useEffect intentionally skips them.\n if (dataScript && typeof children === 'string') {\n return (\n <script\n {...attrs}\n suppressHydrationWarning\n dangerouslySetInnerHTML={{ __html: children }}\n />\n )\n }\n\n // During hydration (before useEffect has fired), render the script element\n // to match the server-rendered HTML and avoid structural hydration mismatches.\n // After hydration, return null — the useEffect handles imperative injection.\n if (!hydrated) {\n if (attrs?.src) {\n return <script {...attrs} suppressHydrationWarning />\n }\n if (typeof children === 'string') {\n return (\n <script\n {...attrs}\n dangerouslySetInnerHTML={{ __html: children }}\n suppressHydrationWarning\n />\n )\n }\n }\n\n return null\n}\n"],"mappings":"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"}