import type { ReactNode } from "react";
import { highlightThemeHref } from "@/client/highlight-theme";
import type { DocumentAssets } from "./assets";
type DocumentProps = {
title?: string;
assets: DocumentAssets;
needsHighlight?: boolean;
children: ReactNode;
};
const initialHighlightThemeHref = highlightThemeHref.dark || highlightThemeHref.light;
const themeBootstrap = `(function(){try{var saved=localStorage.getItem("theme");var theme=saved==="light"?"light":"dark";var root=document.documentElement;root.dataset.theme=theme;root.classList.toggle("dark",theme==="dark");var hljs=document.getElementById("hljs-theme");var darkHref="${highlightThemeHref.dark}";var lightHref="${highlightThemeHref.light}";if(hljs&&(darkHref||lightHref)){var nextHref=theme==="dark"?darkHref:lightHref;if(nextHref){hljs.setAttribute("href",nextHref);}else{hljs.removeAttribute("href");}}}catch(_err){document.documentElement.dataset.theme="dark";document.documentElement.classList.add("dark");}})();`;
const reactRefreshPreamble = `import RefreshRuntime from "/@react-refresh";RefreshRuntime.injectIntoGlobalHook(window);window.$RefreshReg$=()=>{};window.$RefreshSig$=()=>type=>type;window.__vite_plugin_react_preamble_installed__=true;`;
export function Document({ title, assets, needsHighlight = false, children }: DocumentProps) {
const pageTitle = title || "git-on-cloudflare";
return (
{pageTitle}
{needsHighlight && initialHighlightThemeHref ? (
) : null}
{import.meta.env.DEV ? (
) : null}
{assets.preloads.map((href) => (
))}
{assets.styles.map((href) => (
))}
{children}
{assets.moduleScripts.map((src) => (
))}
);
}