@tanstack/react-router
Version:
Modern and scalable routing for React applications
242 lines (241 loc) • 7.6 kB
JavaScript
const require_runtime = require("./_virtual/_rolldown/runtime.cjs");
const require_useRouter = require("./useRouter.cjs");
let _tanstack_router_core = require("@tanstack/router-core");
let react = require("react");
react = require_runtime.__toESM(react);
let _tanstack_react_store = require("@tanstack/react-store");
let _tanstack_router_core_isServer = require("@tanstack/router-core/isServer");
//#region src/headContentUtils.tsx
function buildTagsFromMatches(router, nonce, matches, assetCrossOrigin) {
const routeMeta = matches.map((match) => match.meta).filter(Boolean);
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: (0, _tanstack_router_core.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();
const constructedLinks = matches.map((match) => match.links).filter(Boolean).flat(1).map((link) => ({
tag: "link",
attrs: {
...link,
nonce
}
}));
const manifest = router.ssr?.manifest;
const assetLinks = matches.map((match) => manifest?.routes[match.routeId]?.assets ?? []).filter(Boolean).flat(1).filter((asset) => asset.tag === "link").map((asset) => ({
tag: "link",
attrs: {
...asset.attrs,
crossOrigin: (0, _tanstack_router_core.getAssetCrossOrigin)(assetCrossOrigin, "stylesheet") ?? asset.attrs?.crossOrigin,
suppressHydrationWarning: true,
nonce
}
}));
const preloadLinks = [];
matches.map((match) => router.looseRoutesById[match.routeId]).forEach((route) => router.ssr?.manifest?.routes[route.id]?.preloads?.filter(Boolean).forEach((preload) => {
const preloadLink = (0, _tanstack_router_core.resolveManifestAssetLink)(preload);
preloadLinks.push({
tag: "link",
attrs: {
rel: "modulepreload",
href: preloadLink.href,
crossOrigin: (0, _tanstack_router_core.getAssetCrossOrigin)(assetCrossOrigin, "modulepreload") ?? preloadLink.crossOrigin,
nonce
}
});
}));
const styles = matches.map((match) => match.styles).flat(1).filter(Boolean).map(({ children, ...attrs }) => ({
tag: "style",
attrs: {
...attrs,
nonce
},
children
}));
const headScripts = matches.map((match) => match.headScripts).flat(1).filter(Boolean).map(({ children, ...script }) => ({
tag: "script",
attrs: {
...script,
nonce
},
children
}));
return uniqBy([
...resultMeta,
...preloadLinks,
...constructedLinks,
...assetLinks,
...styles,
...headScripts
], (d) => JSON.stringify(d));
}
/**
* Build the list of head/link/meta/script tags to render for active matches.
* Used internally by `HeadContent`.
*/
var useTags = (assetCrossOrigin) => {
const router = require_useRouter.useRouter();
const nonce = router.options.ssr?.nonce;
if (_tanstack_router_core_isServer.isServer ?? router.isServer) return buildTagsFromMatches(router, nonce, router.stores.activeMatchesSnapshot.state, assetCrossOrigin);
const routeMeta = (0, _tanstack_react_store.useStore)(router.stores.activeMatchesSnapshot, (matches) => {
return matches.map((match) => match.meta).filter(Boolean);
}, _tanstack_router_core.deepEqual);
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: (0, _tanstack_router_core.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 = (0, _tanstack_react_store.useStore)(router.stores.activeMatchesSnapshot, (matches) => {
const constructed = matches.map((match) => match.links).filter(Boolean).flat(1).map((link) => ({
tag: "link",
attrs: {
...link,
nonce
}
}));
const manifest = router.ssr?.manifest;
const assets = matches.map((match) => manifest?.routes[match.routeId]?.assets ?? []).filter(Boolean).flat(1).filter((asset) => asset.tag === "link").map((asset) => ({
tag: "link",
attrs: {
...asset.attrs,
crossOrigin: (0, _tanstack_router_core.getAssetCrossOrigin)(assetCrossOrigin, "stylesheet") ?? asset.attrs?.crossOrigin,
suppressHydrationWarning: true,
nonce
}
}));
return [...constructed, ...assets];
}, _tanstack_router_core.deepEqual);
const preloadLinks = (0, _tanstack_react_store.useStore)(router.stores.activeMatchesSnapshot, (matches) => {
const preloadLinks = [];
matches.map((match) => router.looseRoutesById[match.routeId]).forEach((route) => router.ssr?.manifest?.routes[route.id]?.preloads?.filter(Boolean).forEach((preload) => {
const preloadLink = (0, _tanstack_router_core.resolveManifestAssetLink)(preload);
preloadLinks.push({
tag: "link",
attrs: {
rel: "modulepreload",
href: preloadLink.href,
crossOrigin: (0, _tanstack_router_core.getAssetCrossOrigin)(assetCrossOrigin, "modulepreload") ?? preloadLink.crossOrigin,
nonce
}
});
}));
return preloadLinks;
}, _tanstack_router_core.deepEqual);
const styles = (0, _tanstack_react_store.useStore)(router.stores.activeMatchesSnapshot, (matches) => matches.map((match) => match.styles).flat(1).filter(Boolean).map(({ children, ...attrs }) => ({
tag: "style",
attrs: {
...attrs,
nonce
},
children
})), _tanstack_router_core.deepEqual);
const headScripts = (0, _tanstack_react_store.useStore)(router.stores.activeMatchesSnapshot, (matches) => matches.map((match) => match.headScripts).flat(1).filter(Boolean).map(({ children, ...script }) => ({
tag: "script",
attrs: {
...script,
nonce
},
children
})), _tanstack_router_core.deepEqual);
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;
});
}
//#endregion
exports.useTags = useTags;
//# sourceMappingURL=headContentUtils.cjs.map