/* MIO — Tweaks (animations on/off) */
const { useEffect } = React;
const { TweaksPanel, TweakSection, TweakToggle, useTweaks } = window;

const TWEAK_DEFAULTS = /*EDITMODE-BEGIN*/{
  "animations": true
}/*EDITMODE-END*/;

function MioTweaks() {
  const [t, setTweak] = useTweaks(TWEAK_DEFAULTS);

  useEffect(() => {
    document.documentElement.setAttribute('data-anim', t.animations ? 'on' : 'off');
  }, [t.animations]);

  return (
    <TweaksPanel title="Tweaks">
      <TweakSection title="Movimento">
        <TweakToggle
          label="Animazioni"
          help="Sfondo che fluttua, pulsazioni, fade. Spegnile se preferisci tutto fermo."
          value={t.animations}
          onChange={v => setTweak('animations', v)}
        />
      </TweakSection>
    </TweaksPanel>
  );
}

ReactDOM.createRoot(document.getElementById('tweaks-root')).render(<MioTweaks />);