const TWEAK_DEFAULTS = /*EDITMODE-BEGIN*/{
    "accentColor": "#C8903A",
    "showMarquee": true
}/*EDITMODE-END*/;

function DaftarTweaks() {
    const { values, set } = useTweaks(TWEAK_DEFAULTS);
    React.useEffect(() => { document.documentElement.style.setProperty('--gold', values.accentColor); }, [values.accentColor]);
    React.useEffect(() => { const m = document.querySelector('.mq-wrap'); if(m) m.style.display = values.showMarquee ? '' : 'none'; }, [values.showMarquee]);
    return (
        <TweaksPanel title="Tweaks — Daftar">
            <TweakSection label="Couleurs"><TweakColor id="accentColor" label="Accent or" value={values.accentColor} onChange={v => set('accentColor', v)} /></TweakSection>
            <TweakSection label="Sections"><TweakToggle id="showMarquee" label="Bandeau défilant" value={values.showMarquee} onChange={v => set('showMarquee', v)} /></TweakSection>
        </TweaksPanel>
    );
}
ReactDOM.createRoot(document.getElementById('tweaks-root')).render(<DaftarTweaks />);