function RoundedButtonDesign({ children, onClick }) { return /*#__PURE__*/ React.createElement("button", { className: "font-inter font-medium text-[#0E0F10] bg-[#E4E4E4] rounded-[8px] px-4 py-2 hover:bg-white transition-colors duration-200", onClick: onClick, __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, children); } function RoundedButtonDesignStory() { return /*#__PURE__*/ React.createElement("div", { className: "p-4 space-y-4", __source: { fileName: "", lineNumber: 14, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(RoundedButtonDesign, { onClick: ()=>console.log('Button clicked'), __source: { fileName: "", lineNumber: 15, columnNumber: 7 }, __self: this }, "Click me"), /*#__PURE__*/ React.createElement(RoundedButtonDesign, { onClick: ()=>console.log('Another button clicked'), __source: { fileName: "", lineNumber: 18, columnNumber: 7 }, __self: this }, "Another button")); } function MainComponent() { const [error, setError] = useState(null); const [loading, setLoading] = useState(false); const [email, setEmail] = useState(""); const [password, setPassword] = useState(""); const [isSidebarOpen, setIsSidebarOpen] = useState(false); const { signUpWithCredentials } = useAuth(); const onSubmit = async (e)=>{ e.preventDefault(); setLoading(true); setError(null); if (!email || !password) { setError("Please fill in all fields"); setLoading(false); return; } try { await signUpWithCredentials({ email, password, callbackUrl: "/", redirect: true }); } catch (err) { const errorMessages = { OAuthSignin: "Couldn't start sign-up. Please try again or use a different method.", OAuthCallback: "Sign-up failed after redirecting. Please try again.", OAuthCreateAccount: "Couldn't create an account with this sign-up option. Try another one.", EmailCreateAccount: "This email can't be used. It may already be registered.", Callback: "Something went wrong during sign-up. Please try again.", OAuthAccountNotLinked: "This account is linked to a different sign-in method. Try using that instead.", CredentialsSignin: "Invalid email or password. If you already have an account, try signing in instead.", AccessDenied: "You don't have permission to sign up.", Configuration: "Sign-up isn't working right now. Please try again later.", Verification: "Your sign-up link has expired. Request a new one." }; setError(errorMessages[err.message] || "Something went wrong. Please try again."); setLoading(false); } }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gradient-to-b from-[#141415] to-[#1d2124] font-inter", __source: { fileName: "", lineNumber: 48, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "fixed top-0 left-0 right-0 bg-[#141415] border-b border-[#B6B7B7]/10 text-white h-[40px] flex items-center justify-between px-4 z-[60]", __source: { fileName: "", lineNumber: 49, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/", className: "text-white hover:text-[#B6B7B7] transition-all duration-300 font-semibold", __source: { fileName: "", lineNumber: 50, columnNumber: 9 }, __self: this }, "Create"), /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-4", __source: { fileName: "", lineNumber: 53, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/account/signin", className: "text-sm hover:text-[#B6B7B7] hover:opacity-80 transition-all duration-300", __source: { fileName: "", lineNumber: 54, columnNumber: 11 }, __self: this }, "Sign In"))), /*#__PURE__*/ React.createElement("div", { className: "md:hidden fixed top-[40px] left-0 right-0 bg-[#141415]/95 backdrop-blur-xl border-b border-[#B6B7B7]/10 z-[55]", __source: { fileName: "", lineNumber: 60, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between p-4", __source: { fileName: "", lineNumber: 61, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setIsSidebarOpen(!isSidebarOpen), className: "text-white transition-all duration-300", __source: { fileName: "", lineNumber: 62, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `fas fa-${isSidebarOpen ? "times" : "bars"} text-xs`, __source: { fileName: "", lineNumber: 63, columnNumber: 13 }, __self: this })))), /*#__PURE__*/ React.createElement("div", { className: `fixed top-[40px] left-0 h-[calc(100vh-40px)] w-52 bg-[#141415]/95 backdrop-blur-xl border-r border-[#B6B7B7]/10 transform transition-all duration-300 ease-in-out z-[50] ${isSidebarOpen ? "translate-x-0" : "-translate-x-full md:translate-x-0"}`, __source: { fileName: "", lineNumber: 68, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("nav", { className: "h-[calc(100vh-40px)] overflow-y-auto px-4 py-6 space-y-2", __source: { fileName: "", lineNumber: 69, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/", className: "flex items-center px-4 py-2 rounded-lg text-[#B6B7B7] hover:bg-[#1d2124]/60 hover:text-white transition-all duration-300", __source: { fileName: "", lineNumber: 70, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-home text-xs mr-3", __source: { fileName: "", lineNumber: 71, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "font-medium", __source: { fileName: "", lineNumber: 72, columnNumber: 13 }, __self: this }, "Home")), /*#__PURE__*/ React.createElement("a", { href: "/app", className: "flex items-center px-4 py-2 rounded-lg text-[#B6B7B7] hover:bg-[#1d2124]/60 hover:text-white transition-all duration-300", __source: { fileName: "", lineNumber: 74, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-magic text-xs mr-3", __source: { fileName: "", lineNumber: 75, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "font-medium", __source: { fileName: "", lineNumber: 76, columnNumber: 13 }, __self: this }, "AI Generator")), /*#__PURE__*/ React.createElement("a", { href: "/explore", className: "flex items-center px-4 py-2 rounded-lg text-[#B6B7B7] hover:bg-[#1d2124]/60 hover:text-white transition-all duration-300", __source: { fileName: "", lineNumber: 78, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-compass text-xs mr-3", __source: { fileName: "", lineNumber: 79, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "font-medium", __source: { fileName: "", lineNumber: 80, columnNumber: 13 }, __self: this }, "Explore")), /*#__PURE__*/ React.createElement("a", { href: "/prompt-library", className: "flex items-center px-4 py-2 rounded-lg text-[#B6B7B7] hover:bg-[#1d2124]/60 hover:text-white transition-all duration-300", __source: { fileName: "", lineNumber: 82, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-book text-xs mr-3", __source: { fileName: "", lineNumber: 83, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "font-medium", __source: { fileName: "", lineNumber: 84, columnNumber: 13 }, __self: this }, "Prompt Library")))), /*#__PURE__*/ React.createElement("main", { className: "md:pl-52 pt-24 md:pt-[52px] transition-all duration-300", __source: { fileName: "", lineNumber: 89, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex min-h-[calc(100vh-40px)] w-full items-center justify-center p-4", __source: { fileName: "", lineNumber: 90, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("form", { noValidate: true, onSubmit: onSubmit, className: "w-full max-w-md rounded-2xl bg-[#1d2124] p-8", __source: { fileName: "", lineNumber: 91, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "mb-8 text-center text-3xl font-bold text-white", __source: { fileName: "", lineNumber: 92, columnNumber: 13 }, __self: this }, "Create Account"), /*#__PURE__*/ React.createElement("div", { className: "space-y-6", __source: { fileName: "", lineNumber: 93, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "space-y-2", __source: { fileName: "", lineNumber: 94, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium text-[#B6B7B7]", __source: { fileName: "", lineNumber: 95, columnNumber: 17 }, __self: this }, "Email"), /*#__PURE__*/ React.createElement("div", { className: "overflow-hidden rounded-lg border border-[#B6B7B7]/20 bg-[#141415] px-4 py-3 focus-within:border-[#7C4DFF] focus-within:ring-1 focus-within:ring-[#7C4DFF]", __source: { fileName: "", lineNumber: 96, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("input", { required: true, name: "email", type: "email", value: email, onChange: (e)=>setEmail(e.target.value), placeholder: "Enter your email", className: "w-full bg-transparent text-lg text-white outline-none", __source: { fileName: "", lineNumber: 97, columnNumber: 19 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "space-y-2", __source: { fileName: "", lineNumber: 108, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium text-[#B6B7B7]", __source: { fileName: "", lineNumber: 109, columnNumber: 17 }, __self: this }, "Password"), /*#__PURE__*/ React.createElement("div", { className: "overflow-hidden rounded-lg border border-[#B6B7B7]/20 bg-[#141415] px-4 py-3 focus-within:border-[#7C4DFF] focus-within:ring-1 focus-within:ring-[#7C4DFF]", __source: { fileName: "", lineNumber: 110, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("input", { required: true, name: "password", type: "password", value: password, onChange: (e)=>setPassword(e.target.value), className: "w-full bg-transparent text-lg text-white outline-none", placeholder: "Enter your password", __source: { fileName: "", lineNumber: 111, columnNumber: 19 }, __self: this }))), error && /*#__PURE__*/ React.createElement("div", { className: "rounded-lg bg-red-500/10 p-3 text-sm text-red-400", __source: { fileName: "", lineNumber: 124, columnNumber: 17 }, __self: this }, error), /*#__PURE__*/ React.createElement("button", { type: "submit", disabled: loading, className: "w-full rounded-lg bg-[#7C4DFF] px-4 py-3 text-base font-medium text-white transition-colors hover:bg-[#6A1B9A] focus:outline-none focus:ring-2 focus:ring-[#7C4DFF] focus:ring-offset-2 disabled:opacity-50", __source: { fileName: "", lineNumber: 127, columnNumber: 15 }, __self: this }, loading ? "Loading..." : "Sign Up"), /*#__PURE__*/ React.createElement("p", { className: "text-center text-sm text-[#B6B7B7]", __source: { fileName: "", lineNumber: 134, columnNumber: 15 }, __self: this }, "Already have an account?", " ", /*#__PURE__*/ React.createElement("a", { href: "/account/signin", className: "text-[#7C4DFF] hover:text-[#6A1B9A]", __source: { fileName: "", lineNumber: 136, columnNumber: 17 }, __self: this }, "Sign in")))))), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 142, columnNumber: 7 }, __self: this }, ` @keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } } form { animation: fadeIn 0.5s ease-out forwards; } `)); }