"use client"; import { useEffect, useState } from "react"; import { THEME_KEY, THEME_META as META, THEME_ORDER as ORDER, type Theme, coerceTheme, nextTheme, } from "@/lib/theme"; export type { Theme }; export function applyTheme(t: Theme) { document.documentElement.dataset.theme = t; try { localStorage.setItem(THEME_KEY, t); } catch { /* private mode — non-fatal */ } } /** Inline, runs before paint to avoid a theme flash. Injected in . */ export const themeBootScript = `(function(){try{var t=localStorage.getItem(${JSON.stringify( THEME_KEY, )})||'dark';document.documentElement.dataset.theme=t;}catch(e){document.documentElement.dataset.theme='dark';}})();`; export function ThemeToggle({ compact = false }: { compact?: boolean }) { const [theme, setTheme] = useState("dark"); useEffect(() => { setTheme(coerceTheme(document.documentElement.dataset.theme)); }, []); function pick(t: Theme) { setTheme(t); applyTheme(t); } if (compact) { // Cycle button for tight headers. const next = nextTheme(theme); return ( ); } return (

{ORDER.map((t) => ( ))}

); }