/* Tweaks panel React app — shared across pages. Expects TWEAK_DEFAULTS global. */
function App() {
  const [t, setTweak] = window.useTweaks(TWEAK_DEFAULTS);
  React.useEffect(() => { window.__applyTweaks(t); }, [t]);
  return (
    <window.TweaksPanel title="Tweaks">
        <window.TweakSection label="Accent">
          <window.TweakColor label="Accent color" value={t.accent} onChange={(v) => setTweak('accent', v)}
            options={['#2E5AAA', '#0B4DA2', '#0E62C7', '#C8102E', '#1E8C61', '#1F2832']} />
        </window.TweakSection>
      <window.TweakSection label="Tone">
        <window.TweakRadio label="Theme tone" value={t.tone} onChange={(v) => setTweak('tone', v)}
          options={[{ label: 'Navy', value: 'navy' }, { label: 'Black', value: 'black' }, { label: 'Green', value: 'green' }]} />
      </window.TweakSection>
    </window.TweaksPanel>
  );
}
ReactDOM.createRoot(document.getElementById('tweaks-root')).render(<App />);