// app.jsx — VENTI Airbnb-style composition
const { useState, useEffect } = React;
const TWEAK_DEFAULTS = /*EDITMODE-BEGIN*/{
"lang": "en",
"heroLayout": "sidebyside",
"heroPhoto": "assets/photos/house-pool-hero.jpeg"
}/*EDITMODE-END*/;
function App() {
const [t, setTweak] = useTweaks(TWEAK_DEFAULTS);
const [lang, setLang] = useState(t.lang || "en");
useEffect(() => { setLang(t.lang); }, [t.lang]);
const strings = (window.I18N && window.I18N[lang]) || window.I18N.en;
const onLang = (l) => { setLang(l); setTweak("lang", l); };
// Scroll reveals (simple, IntersectionObserver)
useEffect(() => {
const els = document.querySelectorAll(".reveal:not(.in)");
const vh = window.innerHeight;
els.forEach((el) => {
const r = el.getBoundingClientRect();
if (r.top < vh * 0.95 && r.bottom > 0) el.classList.add("in");
});
const io = new IntersectionObserver((entries) => {
entries.forEach((e) => {
if (e.isIntersecting) { e.target.classList.add("in"); io.unobserve(e.target); }
});
}, { threshold: 0.05, rootMargin: "0px 0px -4% 0px" });
els.forEach((el) => io.observe(el));
const safety = setTimeout(() => {
document.querySelectorAll(".reveal:not(.in)").forEach((el) => el.classList.add("in"));
}, 1200);
return () => { io.disconnect(); clearTimeout(safety); };
}, [lang]);
return (
<>
onLang(v)}
/>
setTweak("heroLayout", v)}
/>
setTweak("heroPhoto", v)}
/>
);
}
ReactDOM.createRoot(document.getElementById("root")).render();