microsite
Version:
<br /> <br />
46 lines (45 loc) • 2.62 kB
JavaScript
import { h, createContext, Fragment } from "preact";
import { useContext, useRef } from "preact/hooks";
import render from "preact-render-to-string";
import { generateHydrateScript } from "./utils/hydration.js";
export const __DocContext = createContext({
head: { current: [] },
});
export const Document = ({ manifest, preload = [], preconnect = [], debug = false, hasGlobalScript = false, children, }) => {
const head = useRef([]);
const subtree = render(h(__DocContext.Provider, { value: { head } }, children), {});
const styles = manifest.hydrateStyleBindings;
const scripts = manifest.hydrateBindings;
return (h("html", { lang: "en", dir: "ltr" },
h("head", null,
h("meta", Object.assign({}, { charset: "utf-8" })),
h("meta", { name: "viewport", content: "width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=5.0" }),
h(Fragment, null, head.current),
preconnect.map((href) => (h("link", { rel: "preconnect", href: href }))),
hasGlobalScript && (h("link", { rel: "modulepreload", href: "/_hydrate/chunks/_global.js" })),
preload.map((href) => (h("link", { rel: "modulepreload", href: href }))),
styles &&
styles.map((href) => (h("link", { rel: "preload", href: `/${href}`, as: "style" }))),
styles &&
styles.map((href) => h("link", { rel: "stylesheet", href: `/${href}` })),
scripts && (h(Fragment, null,
h("style", { dangerouslySetInnerHTML: {
__html: "[data-hydrate]{display:contents;}",
} })))),
h("body", null,
h("div", { id: "__microsite", dangerouslySetInnerHTML: { __html: subtree } }),
debug && (h("script", { dangerouslySetInnerHTML: {
__html: `window.__MICROSITE_DEBUG = true;`,
} })),
hasGlobalScript && (h("script", { type: "module", dangerouslySetInnerHTML: {
__html: `import global from '/_hydrate/chunks/_global.js';\nglobal();`,
} })),
scripts && (h("script", { type: "module", defer: true, async: true, dangerouslySetInnerHTML: { __html: generateHydrateScript(scripts) } })))));
};
export const Head = () => {
const { head } = useContext(__DocContext);
return (h("head", null,
h("meta", Object.assign({}, { charset: "utf-8" })),
h("meta", { name: "viewport", content: "width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=5.0" }),
h(Fragment, null, head.current)));
};