function MainComponent({ email, onEmailChange, onJoinClick, joinedWaitlist }) { return /*#__PURE__*/ React.createElement("div", { className: "flex min-h-screen font-inter", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col justify-between items-start w-1/2 p-8", __source: { fileName: "", lineNumber: 4, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between w-full", __source: { fileName: "", lineNumber: 5, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "logo.png", alt: "Company logo", className: "w-[120px]", __source: { fileName: "", lineNumber: 6, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 7, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "twitter.png", alt: "Twitter logo", className: "w-[24px] mr-4", style: { filter: 'brightness(0) saturate(100%) invert(45%) sepia(86%) saturate(3971%) hue-rotate(184deg) brightness(103%) contrast(103%)' }, __source: { fileName: "", lineNumber: 8, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("img", { src: "discord.png", alt: "Discord logo", className: "w-[24px]", style: { filter: 'brightness(0) saturate(100%) invert(45%) sepia(86%) saturate(3971%) hue-rotate(184deg) brightness(103%) contrast(103%)' }, __source: { fileName: "", lineNumber: 9, columnNumber: 13 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col space-y-6 items-start w-full my-auto", __source: { fileName: "", lineNumber: 12, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-xs text-[#6171FF] bg-[#E9EBFF] rounded-md py-1 px-2 inline-block", __source: { fileName: "", lineNumber: 13, columnNumber: 11 }, __self: this }, "Launching December 2023"), /*#__PURE__*/ React.createElement("h1", { className: "text-4xl text-black", __source: { fileName: "", lineNumber: 14, columnNumber: 11 }, __self: this }, "A new way to build pages (like this one) in plain text."), /*#__PURE__*/ React.createElement("p", { className: "text-sm text-gray-600", __source: { fileName: "", lineNumber: 15, columnNumber: 11 }, __self: this }, "Add your info below to be added to our waitlist."), /*#__PURE__*/ React.createElement("input", { type: "email", name: "email", value: email, onChange: onEmailChange, placeholder: "Enter your email", className: "w-auto px-3 py-2 text-gray-700 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-[#6171FF]", __source: { fileName: "", lineNumber: 16, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("button", { onClick: onJoinClick, className: "bg-black text-white px-6 py-2 rounded-md text-sm", __source: { fileName: "", lineNumber: 24, columnNumber: 11 }, __self: this }, "Join waitlist"), joinedWaitlist && /*#__PURE__*/ React.createElement("p", { className: "text-sm text-gray-600", __source: { fileName: "", lineNumber: 31, columnNumber: 13 }, __self: this }, "Thank you for signing up. You have been added to our waitlist."))), /*#__PURE__*/ React.createElement("div", { className: "w-1/2", __source: { fileName: "", lineNumber: 35, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "ethereal-image.png", alt: "Ethereal background with light blue hues giving a hazy, dreamy feel", className: "w-full h-full object-cover", __source: { fileName: "", lineNumber: 36, columnNumber: 9 }, __self: this }))); } function StoryComponent() { const [email, setEmail] = React.useState(''); const [joinedWaitlist, setJoinedWaitlist] = React.useState(false); const handleEmailChange = (e)=>{ setEmail(e.target.value); }; const handleJoinClick = ()=>{ setEmail(''); setJoinedWaitlist(true); }; return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 56, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(MainComponent, { email: email, onEmailChange: handleEmailChange, onJoinClick: handleJoinClick, joinedWaitlist: joinedWaitlist, __source: { fileName: "", lineNumber: 57, columnNumber: 7 }, __self: this })); }