function MainComponent({ logoSrc, onLogin, onSignUp, onForgotPassword, onLoginWithSocialMedia, onStravaConnect }) { return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col h-screen bg-black", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "flex justify-center items-center p-4 bg-black text-white", __source: { fileName: "", lineNumber: 4, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl font-sans", __source: { fileName: "", lineNumber: 5, columnNumber: 9 }, __self: this }, "Cycling Community")), /*#__PURE__*/ React.createElement("main", { className: "flex-grow flex justify-center items-center px-4", __source: { fileName: "", lineNumber: 7, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("form", { className: "bg-white p-8 rounded-3xl shadow-xl w-full max-w-md", onSubmit: onLogin, __source: { fileName: "", lineNumber: 8, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", name: "email_username", placeholder: "Email or Username", className: "mb-4 w-full p-4 rounded-full border border-gray-300 shadow-sm placeholder-gray-400", __source: { fileName: "", lineNumber: 9, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "password", name: "password", placeholder: "Password", className: "mb-4 w-full p-4 rounded-full border border-gray-300 shadow-sm placeholder-gray-400", __source: { fileName: "", lineNumber: 10, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center mb-4", __source: { fileName: "", lineNumber: 11, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "flex items-center text-gray-700", __source: { fileName: "", lineNumber: 12, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "checkbox", name: "rememberMe", className: "mr-2", __source: { fileName: "", lineNumber: 13, columnNumber: 15 }, __self: this }), "Remember Me"), /*#__PURE__*/ React.createElement("button", { onClick: onForgotPassword, className: "text-sm text-black hover:text-gray-700", __source: { fileName: "", lineNumber: 16, columnNumber: 13 }, __self: this }, "Forgot Password?")), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "text-black bg-white border border-black hover:bg-gray-300 font-bold py-2 w-full rounded-full mb-4", __source: { fileName: "", lineNumber: 18, columnNumber: 11 }, __self: this }, "Log In"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>onLoginWithSocialMedia('Facebook'), className: "text-black bg-white border border-black hover:bg-gray-300 font-bold py-2 rounded-full w-full mb-2", __source: { fileName: "", lineNumber: 21, columnNumber: 11 }, __self: this }, "Log In with Facebook"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>onLoginWithSocialMedia('Google'), className: "text-black bg-white border border-black hover:bg-gray-300 font-bold py-2 rounded-full w-full mb-2", __source: { fileName: "", lineNumber: 24, columnNumber: 11 }, __self: this }, "Log In with Google"), /*#__PURE__*/ React.createElement("button", { onClick: onStravaConnect, className: "text-black bg-white border border-black hover:bg-gray-300 font-bold py-2 w-full rounded-full", __source: { fileName: "", lineNumber: 27, columnNumber: 11 }, __self: this }, "Connect with Strava"), /*#__PURE__*/ React.createElement("p", { className: "text-center text-gray-400 font-medium pt-4", __source: { fileName: "", lineNumber: 30, columnNumber: 11 }, __self: this }, "Discover the world of cycling with our community app."))), /*#__PURE__*/ React.createElement("footer", { className: "text-center p-4 bg-black text-white", __source: { fileName: "", lineNumber: 33, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "#", className: "mx-2 text-sm hover:text-gray-400", __source: { fileName: "", lineNumber: 34, columnNumber: 9 }, __self: this }, "About Us"), /*#__PURE__*/ React.createElement("a", { href: "#", className: "mx-2 text-sm hover:text-gray-400", __source: { fileName: "", lineNumber: 35, columnNumber: 9 }, __self: this }, "Privacy Policy"), /*#__PURE__*/ React.createElement("a", { href: "#", className: "mx-2 text-sm hover:text-gray-400", __source: { fileName: "", lineNumber: 36, columnNumber: 9 }, __self: this }, "Terms of Service"))); } function StoryComponent() { return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 44, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(MainComponent, { logoSrc: "/images/logo.png", onLogin: (e)=>{ e.preventDefault(); alert("Logging in..."); }, onSignUp: ()=>alert("Navigating to sign up..."), onForgotPassword: ()=>alert("Navigating to forgot password..."), onLoginWithSocialMedia: (service)=>alert(`Logging in with ${service}...`), onStravaConnect: ()=>alert("Connecting with Strava..."), __source: { fileName: "", lineNumber: 45, columnNumber: 7 }, __self: this })); }