import { buildThemeScript, type ThemeBase } from "./themeConfig";

// Server component (NOT "use client"): renders an inline <script> that runs
// synchronously BEFORE first paint, so there is no flash of the wrong theme.
// From localStorage it migrates the retired theme/mode keys once and a stored
// retired base to "light", then sets `data-base` (the resolved light | dark
// ground) and `.dark` on <html>, the browser chrome colour, and — last — the
// `data-theme-ready` marker the e2e no-flash tests wait for. The script's
// source and its order are themeConfig.buildThemeScript (unit-tested in
// node:vm).
//
// The accent is not this script's business: the layout server-renders the
// site's own as `<html data-accent>`, and a reader's stored pick from before
// is not read. Works identically for static-export sites and the server
// editor. Pair with `suppressHydrationWarning` on <html>, since this mutates
// the element before React hydrates — and with ThemeProvider, which
// re-asserts the same attributes after hydration.
export function ThemeScript({ defaultBase = "system" }: { defaultBase?: ThemeBase }) {
  return (
    <script
      dangerouslySetInnerHTML={{ __html: buildThemeScript({ defaultBase }) }}
      suppressHydrationWarning
    />
  );
}