// app.jsx — Wires everything together + Tweaks panel
const { useState: useStateA, useEffect: useEffectA } = React;
const TWEAK_DEFAULTS = /*EDITMODE-BEGIN*/{
"theme": "trader",
"headline": "A",
"density": "regular",
"showCalculator": true,
"showMarquee": true,
"showBackdrop": true,
"ctaLabel": "Quero ganhar em dólar todo dia"
}/*EDITMODE-END*/;
function App() {
const [t, setTweak] = useTweaks(TWEAK_DEFAULTS);
const [checkoutOpen, setCheckoutOpen] = useStateA(false);
// Apply theme + density to so CSS vars cascade
useEffectA(() => {
document.documentElement.setAttribute("data-theme", t.theme);
document.documentElement.setAttribute("data-density", t.density);
}, [t.theme, t.density]);
useReveal();
const openCheckout = () => setCheckoutOpen(true);
const closeCheckout = () => setCheckoutOpen(false);
return (
<>
{t.showBackdrop && }
{t.showCalculator && }
{t.showMarquee && }
{checkoutOpen && }
setTweak("theme", v)}
/>
setTweak("density", v)}
/>
setTweak("headline", v)}
/>
setTweak("ctaLabel", v)}
/>
setTweak("showMarquee", v)}
/>
setTweak("showCalculator", v)}
/>
setTweak("showBackdrop", v)}
/>
);
}
const root = ReactDOM.createRoot(document.getElementById("root"));
root.render();