// Shared form, trust signals, equation tagline
function HeroForm({ tone = "light", cta = "Start My Site" }) {
const [url, setUrl] = React.useState("");
const [email, setEmail] = React.useState("");
const [expanded, setExpanded] = React.useState(false);
const [sent, setSent] = React.useState(false);
const formRef = React.useRef(null);
const expand = () => { if (!expanded) setExpanded(true); };
React.useEffect(() => {
if (!expanded) return;
const onDocPointer = (e) => {
if (!formRef.current || formRef.current.contains(e.target)) return;
if (!url && !email) setExpanded(false);
};
document.addEventListener("mousedown", onDocPointer);
return () => document.removeEventListener("mousedown", onDocPointer);
}, [expanded, url, email]);
const onSubmit = (e) => {
e.preventDefault();
if (!expanded) { setExpanded(true); return; }
if (!url || !email) return;
setSent(true);
setTimeout(() => setSent(false), 2400);
};
const isDark = tone === "dark";
const step = expanded ? 2 : 1;
return (
);
}
function Trust({ tone = "light", count = 2438 }) {
return (
No obligation
Free preview in 2 days
sites built
);
}
function CountUp({ end, duration = 1400 }) {
const [n, setN] = React.useState(0);
React.useEffect(() => {
let raf;
const t0 = performance.now();
const tick = (t) => {
const p = Math.min(1, (t - t0) / duration);
const eased = 1 - Math.pow(1 - p, 3);
setN(Math.floor(eased * end));
if (p < 1) raf = requestAnimationFrame(tick);
};
raf = requestAnimationFrame(tick);
return () => cancelAnimationFrame(raf);
}, [end]);
return {n.toLocaleString()};
}
function Equation({ accentA = "var(--indigo)", accentB = "var(--coral)" }) {
return (
AI efficiency+Expert attention=your dream site, in 2 days
);
}
window.HeroForm = HeroForm;
window.Trust = Trust;
window.Equation = Equation;
window.CountUp = CountUp;