function MainComponent({ backgroundColor, primaryColor, textColor, accentColor, placeholderColor, termsColor, formValues, handleChange, handleSubmit, handleHover }) { return /*#__PURE__*/ React.createElement("div", { className: `${backgroundColor} min-h-screen flex items-center justify-center p-4`, __source: { fileName: "", lineNumber: 14, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `w-full max-w-4xl flex flex-col md:flex-row shadow-lg rounded-lg overflow-hidden`, __source: { fileName: "", lineNumber: 15, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `w-full md:w-1/2 p-8 order-last md:order-first bg-[#1D2115]`, __source: { fileName: "", lineNumber: 16, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col justify-center h-full", __source: { fileName: "", lineNumber: 17, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `font-open-sans px-2 py-1 inline-block mb-6`, __source: { fileName: "", lineNumber: 18, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "./mangaverse-studio-logo.png", alt: "MangaVerse Studio logo", className: "h-24", __source: { fileName: "", lineNumber: 19, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("h2", { className: `font-open-sans text-[#2E3521] text-4xl font-bold mb-6`, __source: { fileName: "", lineNumber: 21, columnNumber: 13 }, __self: this }, "Sign Up"), /*#__PURE__*/ React.createElement("form", { className: "font-open-sans", noValidate: true, onSubmit: handleSubmit, __source: { fileName: "", lineNumber: 22, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 23, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", name: "fullName", className: `w-full border-b-2 bg-[#F3E3AC] pb-1 font-open-sans text-lg text-[#726950]`, placeholder: "Full Name", value: formValues.fullName, onChange: handleChange, __source: { fileName: "", lineNumber: 24, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 34, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "email", name: "email", className: `w-full border-b-2 bg-[#F3E3AC] pb-1 font-open-sans text-lg text-[#726950]`, placeholder: "Email Address", value: formValues.email, onChange: handleChange, __source: { fileName: "", lineNumber: 35, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-6", __source: { fileName: "", lineNumber: 45, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "password", name: "password", className: `w-full border-b-2 bg-[#F3E3AC] pb-1 font-open-sans text-lg text-[#726950]`, placeholder: "Password", value: formValues.password, onChange: handleChange, __source: { fileName: "", lineNumber: 46, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("p", { className: `text-sm text-[#726950] mb-6`, __source: { fileName: "", lineNumber: 56, columnNumber: 15 }, __self: this }, "By signing up, you agree to MangaVerse Studio's", /*#__PURE__*/ React.createElement("span", { className: "text-[#F3E3AC]", __source: { fileName: "", lineNumber: 58, columnNumber: 17 }, __self: this }, " Terms & Conditions"), " and", /*#__PURE__*/ React.createElement("span", { className: "text-[#F3E3AC]", __source: { fileName: "", lineNumber: 59, columnNumber: 17 }, __self: this }, " Privacy Policy"), "."), /*#__PURE__*/ React.createElement("button", { type: "submit", className: `bg-[#2E3521] text-[#F3E3AC] w-full py-2 font-bold font-open-sans`, onMouseEnter: handleHover, onMouseLeave: handleHover, style: { transition: 'background-color 0.3s' }, __source: { fileName: "", lineNumber: 61, columnNumber: 15 }, __self: this }, "Create Account")))), /*#__PURE__*/ React.createElement("div", { className: `w-full md:w-1/2 md:order-last bg-[#1D2115]`, __source: { fileName: "", lineNumber: 73, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "./thematic-signup-image.png", alt: "MangaVerse Studio sign-up themed image", className: "object-cover w-full h-full", __source: { fileName: "", lineNumber: 74, columnNumber: 11 }, __self: this })))); } function StoryComponent() { const formValues = { fullName: '', email: '', password: '' }; const handleChange = ()=>{}; const handleSubmit = ()=>{}; const handleHover = ()=>{}; return /*#__PURE__*/ React.createElement(MainComponent, { backgroundColor: "bg-[#1D2115]", primaryColor: "text-[#2E3521]", textColor: "text-[#2E3521]", accentColor: "border-[#F3E3AC]", placeholderColor: "text-[#726950]", termsColor: "text-[#726950]", formValues: formValues, handleChange: handleChange, handleSubmit: handleSubmit, handleHover: handleHover, __source: { fileName: "", lineNumber: 92, columnNumber: 5 }, __self: this }); }