// Yew — app root
// Wires together Landing + Dashboard with shared theme state + Tweaks.
const TWEAK_DEFAULTS = /*EDITMODE-BEGIN*/{
"palette": "yew",
"twilight": false,
"tagline": 0,
"accent": "restrained",
"view": "landing"
}/*EDITMODE-END*/;
function YewApp() {
const [t, setTweak] = useTweaks(TWEAK_DEFAULTS);
// Apply theme attributes to so palette/dark vars cascade everywhere.
React.useEffect(() => {
const html = document.documentElement;
html.setAttribute("data-palette", t.palette || "yew");
html.setAttribute("data-theme", t.twilight ? "twilight" : "light");
html.setAttribute("data-accent", t.accent || "restrained");
}, [t.palette, t.twilight, t.accent]);
const view = t.view || "landing";
const setView = (v) => setTweak("view", v);
// Cycle taglines every 6s on landing if "auto" (we keep it static — Tweaks controls index)
const taglineIdx = (t.tagline || 0) % TAGLINES.length;
return (
{view === "landing"
? setView("dashboard")}
taglineIdx={taglineIdx}
setTaglineIdx={(i) => setTweak("tagline", i)}
/>
: setView("landing")} />
}
setView(v)}
/>
setTweak("palette", v)}
/>
setTweak("twilight", v)}
/>
x.primary)}
onChange={(v) => setTweak("tagline", TAGLINES.findIndex(x => x.primary === v))}
/>
);
}
const root = ReactDOM.createRoot(document.getElementById("root"));
root.render();