import { isServer } from '@tanstack/router-core/isServer';
import { createEffect } from 'solid-js';
import { useRouter } from './useRouter';
export function Asset({ tag, attrs, children, }) {
switch (tag) {
case 'title':
return ;
case 'meta':
return <meta {...attrs}/>;
case 'link':
return <link {...attrs}/>;
case 'style':
if (typeof children === 'string') {
return <style {...attrs} innerHTML={children}/>;
}
return <style {...attrs}/>;
case 'script':
return <Script attrs={attrs} children={children}/>;
default:
return null;
}
}
function Title(props) {
const router = useRouter();
const attrs = props.attrs;
const children = props.children;
// Server: render <title> normally
if (isServer ?? router.isServer) {
return <title {...attrs}>{children};
}
// Client: imperatively set document.title so it updates during
// client-side navigation (JSX in <head> doesn't reliably
// update the browser's document.title).
createEffect(() => children, (titleText) => {
document.title = typeof titleText === 'string' ? titleText : '';
});
// Still render the <title> element in the DOM for consistency,
// but the imperative assignment above is what actually drives the update.
return <title {...attrs}>{children};
}
function Script(props) {
const router = useRouter();
const attrs = props.attrs;
const children = props.children;
const dataScript = typeof attrs?.type === 'string' &&
attrs.type !== '' &&
attrs.type !== 'text/javascript' &&
attrs.type !== 'module';
// --- Server rendering ---
if (isServer ?? router.isServer) {
if (attrs?.src) {
return ;
}
if (typeof children === 'string') {
return