@tanstack/vue-router/dist/esm/Scripts.js

Modern and scalable routing for Vue applications

import { useRouter } from "./useRouter.js";
import { useRouterState } from "./useRouterState.js";
import { Asset } from "./Asset.js";
import * as Vue from "vue";
import { Fragment, createVNode, mergeProps } from "vue";
//#region src/Scripts.tsx
var Scripts = Vue.defineComponent({
	name: "Scripts",
	setup() {
		const router = useRouter();
		const nonce = router.options.ssr?.nonce;
		const assetScripts = useRouterState({ select: (state) => {
			const assetScripts = [];
			const manifest = router.ssr?.manifest;
			if (!manifest) return [];
			state.matches.map((match) => router.looseRoutesById[match.routeId]).forEach((route) => manifest.routes[route.id]?.assets?.filter((d) => d.tag === "script").forEach((asset) => {
				assetScripts.push({
					tag: "script",
					attrs: {
						...asset.attrs,
						nonce
					},
					children: asset.children
				});
			}));
			return assetScripts;
		} });
		const scripts = useRouterState({ select: (state) => ({ scripts: state.matches.map((match) => match.scripts).flat(1).filter(Boolean).map(({ children, ...script }) => ({
			tag: "script",
			attrs: {
				...script,
				nonce
			},
			children
		})) }) });
		const mounted = Vue.ref(false);
		Vue.onMounted(() => {
			mounted.value = true;
		});
		return () => {
			const allScripts = [];
			if (router.serverSsr) {
				const serverBufferedScript = router.serverSsr.takeBufferedScripts();
				if (serverBufferedScript) allScripts.push(serverBufferedScript);
			} else if (router.ssr && !mounted.value) {
				allScripts.push({
					tag: "script",
					attrs: {
						nonce,
						"data-allow-mismatch": true
					},
					children: ""
				});
				allScripts.push({
					tag: "script",
					attrs: {
						nonce,
						id: "$tsr-stream-barrier",
						"data-allow-mismatch": true
					},
					children: ""
				});
				for (const asset of assetScripts.value) allScripts.push({
					tag: "script",
					attrs: {
						...asset.attrs,
						"data-allow-mismatch": true
					},
					children: ""
				});
			}
			for (const script of scripts.value.scripts) allScripts.push(script);
			if (mounted.value || router.serverSsr) for (const asset of assetScripts.value) allScripts.push(asset);
			return createVNode(Fragment, null, [allScripts.map((asset, i) => createVNode(Asset, mergeProps(asset, { "key": `tsr-scripts-${asset.tag}-${i}` }), null))]);
		};
	}
});
//#endregion
export { Scripts };

//# sourceMappingURL=Scripts.js.map