function OutlineButton({ text, onClick, bgColor = 'bg-white' }) { const textColor = bgColor === 'bg-white' ? 'text-black' : 'text-white'; return /*#__PURE__*/ React.createElement("button", { className: `px-8 py-2 rounded-full border border-current ${textColor} font-inter bg-transparent hover:bg-opacity-10 transition-colors duration-300 w-[240px] h-[60px]`, onClick: onClick, __source: { fileName: "", lineNumber: 5, columnNumber: 5 }, __self: this }, text); } function OutlineButtonStory() { return /*#__PURE__*/ React.createElement("div", { className: "p-4 flex flex-col space-y-4 justify-center items-center h-screen bg-gray-100", __source: { fileName: "", lineNumber: 16, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(OutlineButton, { text: "Click me", onClick: ()=>alert('Button clicked!'), __source: { fileName: "", lineNumber: 17, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(OutlineButton, { text: "Dark version", onClick: ()=>alert('Dark button clicked!'), bgColor: "bg-black", __source: { fileName: "", lineNumber: 18, columnNumber: 7 }, __self: this })); } function MainComponent() { const [loading, setLoading] = useState(false); const { signInWithGoogle } = useAuth(); const handleGoogleSignIn = async ()=>{ setLoading(true); try { await signInWithGoogle({ callbackUrl: "/home", redirect: true }); } catch (error) { console.error('Authentication failed:', error); setLoading(false); } }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-white flex flex-col items-center justify-center p-4", __source: { fileName: "", lineNumber: 19, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-md w-full space-y-12 text-center", __source: { fileName: "", lineNumber: 20, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-6xl font-inter", __source: { fileName: "", lineNumber: 21, columnNumber: 9 }, __self: this }, "Welcome to Butt Sahb"), loading ? /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center space-y-4", __source: { fileName: "", lineNumber: 26, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-8 h-8 border-4 border-black border-t-transparent rounded-full animate-spin", __source: { fileName: "", lineNumber: 27, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("p", { className: "text-lg font-inter", __source: { fileName: "", lineNumber: 28, columnNumber: 13 }, __self: this }, "Signing you in...")) : /*#__PURE__*/ React.createElement("button", { onClick: handleGoogleSignIn, className: "w-full max-w-sm mx-auto h-14 border border-black rounded-none flex items-center justify-center space-x-3 hover:bg-black hover:text-white transition-colors duration-300", __source: { fileName: "", lineNumber: 31, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fab fa-google text-xl", __source: { fileName: "", lineNumber: 35, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "font-inter", __source: { fileName: "", lineNumber: 36, columnNumber: 13 }, __self: this }, "Sign in with Google")))); }