@tanstack/solid-router/dist/esm/headContentUtils.js

Modern and scalable routing for Solid applications

import { useRouter } from "./useRouter.js";
import { _getAssetMatches, appendUniqueUserTags, escapeHtml, getAssetCrossOrigin, getScriptPreloadAttrs, resolveManifestCssLink } from "@tanstack/router-core";
import * as Solid from "solid-js";
import { isServer } from "@tanstack/router-core/isServer";
//#region src/headContentUtils.tsx
/**
* Build the head/link/meta/script tags from the renderable presented prefix.
* Used internally by `HeadContent`.
*/
var useTags = (assetCrossOrigin) => {
	const router = useRouter();
	const nonce = router.options.ssr?.nonce;
	const activeMatches = Solid.createMemo(() => _getAssetMatches(router.stores.matches.get()));
	const routeMeta = Solid.createMemo(() => activeMatches().map((match) => match.meta).filter((meta) => meta !== void 0));
	const meta = Solid.createMemo(() => {
		const resultMeta = [];
		const metaByAttribute = {};
		let title;
		const routeMetasArray = routeMeta();
		for (let i = routeMetasArray.length - 1; i >= 0; i--) {
			const metas = routeMetasArray[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: escapeHtml(json)
					});
				} catch {}
				else {
					const attribute = m.name ?? m.property;
					if (attribute) {
						if (metaByAttribute[attribute]) continue;
						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;
	});
	const links = Solid.createMemo(() => {
		return activeMatches().flatMap((match) => match.links ?? []).filter((link) => link !== void 0).map((link) => ({
			tag: "link",
			attrs: {
				...link,
				nonce
			}
		}));
	});
	const retainedManifestCssTags = /* @__PURE__ */ new Map();
	const manifestCssTags = Solid.createMemo(() => {
		const manifest = router.ssr?.manifest;
		const tags = [];
		if (!manifest) return tags;
		for (const match of activeMatches()) for (const link of manifest.routes[match.routeId]?.css ?? []) {
			const resolvedLink = resolveManifestCssLink(link);
			const tag = {
				tag: "link",
				attrs: {
					rel: "stylesheet",
					...resolvedLink,
					crossOrigin: getAssetCrossOrigin(assetCrossOrigin, "stylesheet") ?? resolvedLink.crossOrigin,
					nonce
				}
			};
			const key = JSON.stringify(tag);
			if (!retainedManifestCssTags.has(key)) retainedManifestCssTags.set(key, tag);
		}
		tags.push(...retainedManifestCssTags.values());
		if (manifest.inlineStyle) tags.push({
			tag: "style",
			attrs: {
				...manifest.inlineStyle.attrs,
				nonce
			},
			children: manifest.inlineStyle.children,
			inlineCss: true
		});
		return tags;
	});
	const preloadLinks = Solid.createMemo(() => {
		const manifest = router.ssr?.manifest;
		const tags = [];
		for (const match of activeMatches()) for (const preload of manifest?.routes[match.routeId]?.preloads ?? []) {
			if (!preload) continue;
			tags.push({
				tag: "link",
				attrs: {
					...getScriptPreloadAttrs(manifest, preload, assetCrossOrigin),
					nonce
				}
			});
		}
		return tags;
	});
	const styles = Solid.createMemo(() => {
		return activeMatches().flatMap((match) => match.styles ?? []).filter((style) => style !== void 0).map(({ children, ...attrs }) => ({
			tag: "style",
			attrs: {
				...attrs,
				nonce
			},
			children
		}));
	});
	const headScripts = Solid.createMemo(() => {
		return activeMatches().flatMap((match) => match.headScripts ?? []).filter((script) => script !== void 0).map(({ children, ...attrs }) => ({
			tag: "script",
			attrs: {
				...attrs,
				nonce
			},
			children
		}));
	});
	return Solid.createMemo(() => {
		const next = [];
		appendUniqueUserTags(next, meta());
		appendUniqueUserTags(next, links());
		next.push(...manifestCssTags());
		next.push(...preloadLinks());
		appendUniqueUserTags(next, styles());
		appendUniqueUserTags(next, headScripts());
		return next;
	});
};
var INLINE_CSS_HYDRATION_ATTR = "data-tsr-inline-css";
/**
* Convert the router-managed tags into head registry descriptors for
* `useHead`. Pure data mapping — it is evaluated inside the registry's own
* flush boundary (server) / effect (client), so it must not allocate
* reactive owners.
*/
function toHeadTags(tags) {
	return tags.map(toHeadTag);
}
function toHeadTag(t) {
	const props = { ...t.attrs };
	let children = t.children;
	if (t.tag === "style" && t.inlineCss && (process.env.TSS_INLINE_CSS_ENABLED === "true" || process.env.TSS_INLINE_CSS_ENABLED === void 0 && isServer)) props[INLINE_CSS_HYDRATION_ATTR] = "";
	if (t.tag === "style" && t.inlineCss && children === void 0 && typeof document !== "undefined") children = document.querySelector(`style[${INLINE_CSS_HYDRATION_ATTR}]`)?.textContent ?? "";
	if (children !== void 0) props.children = children;
	const headTag = {
		tag: t.tag,
		props
	};
	if (t.tag === "style" || t.tag === "script" && props.src === void 0) headTag.key = `tsr-${hashString(t.tag + JSON.stringify(props))}`;
	return headTag;
}
function hashString(s) {
	let h = 5381;
	for (let i = 0; i < s.length; i++) h = (h << 5) + h + s.charCodeAt(i) | 0;
	return (h >>> 0).toString(36);
}
//#endregion
export { toHeadTags, useTags };

//# sourceMappingURL=headContentUtils.js.map