function MainComponent() { const [formData, setFormData] = React.useState({ name: '', email: '' }); const handleChange = (e)=>{ const { name, value } = e.target; setFormData((prev)=>({ ...prev, [name]: value })); }; const handleSubmit = async (e)=>{ e.preventDefault(); const { name, email } = formData; const alertMessage = `New signup from ${name} with email ${email}.`; const emailPayload = { email: 'dhruv@create.xyz', alertMessage }; const response = await fetch('/api/zapier-email-alert', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(emailPayload) }); if (response.ok) { alert('Thank you for signing up!'); } else { alert('There was an error. Please try again.'); } }; return /*#__PURE__*/ React.createElement("div", { className: "bg-[#0b0b0b] min-h-screen flex flex-col justify-center items-center text-white font-sans", __source: { fileName: "", lineNumber: 35, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center mb-8", __source: { fileName: "", lineNumber: 36, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "your-logo-path.svg", alt: "AlignUI logo", className: "w-[80px] mx-auto mb-4", __source: { fileName: "", lineNumber: 37, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("h1", { className: "text-4xl mb-4", __source: { fileName: "", lineNumber: 38, columnNumber: 9 }, __self: this }, "Join the waitlist for the ", /*#__PURE__*/ React.createElement("span", { className: "text-transparent bg-clip-text bg-gradient-to-r from-[#d87d56] to-[#9b59d0]", __source: { fileName: "", lineNumber: 38, columnNumber: 65 }, __self: this }, "Design System!")), /*#__PURE__*/ React.createElement("p", { className: "text-lg", __source: { fileName: "", lineNumber: 39, columnNumber: 9 }, __self: this }, "AlignUI Design System")), /*#__PURE__*/ React.createElement("div", { className: "bg-[#1a1a1a] p-8 rounded-lg w-[400px] shadow-lg", __source: { fileName: "", lineNumber: 41, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("form", { className: "space-y-4", onSubmit: handleSubmit, __source: { fileName: "", lineNumber: 42, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center bg-[#252525] p-2 rounded", __source: { fileName: "", lineNumber: 43, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fa fa-user text-gray-500", __source: { fileName: "", lineNumber: 44, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "text", name: "name", placeholder: "Name", className: "bg-transparent border-none focus:outline-none w-full text-sm pl-2", onChange: handleChange, __source: { fileName: "", lineNumber: 45, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex items-center bg-[#252525] p-2 rounded", __source: { fileName: "", lineNumber: 47, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fa fa-envelope text-gray-500", __source: { fileName: "", lineNumber: 48, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "email", name: "email", placeholder: "Email", className: "bg-transparent border-none focus:outline-none w-full text-sm pl-2", onChange: handleChange, __source: { fileName: "", lineNumber: 49, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "bg-[#252525] text-white py-2 w-full rounded flex items-center justify-center hover:bg-[#343434]", __source: { fileName: "", lineNumber: 51, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 52, columnNumber: 13 }, __self: this }, "Join the waitlist"), /*#__PURE__*/ React.createElement("i", { className: "fa fa-arrow-right ml-2", __source: { fileName: "", lineNumber: 53, columnNumber: 13 }, __self: this })))), /*#__PURE__*/ React.createElement("footer", { className: "mt-8 text-gray-500 text-sm text-center", __source: { fileName: "", lineNumber: 57, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 58, columnNumber: 9 }, __self: this }, "AlignUI is coming to Figma soon."), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 59, columnNumber: 9 }, __self: this }, "Designed by @ersad.work to give you back your time."), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 60, columnNumber: 9 }, __self: this }, "Forms by ", /*#__PURE__*/ React.createElement("b", { __source: { fileName: "", lineNumber: 60, columnNumber: 21 }, __self: this }, "formcarry"), "."))); }

Join the waitlist for the Design System!