@restnfeel/agentc-starter-kit/dist/server.esm/components/auth/LoginButton.js

한국어 기업용 CMS 모듈 - Task Master AI와 함께 빠르게 웹사이트를 구현할 수 있는 재사용 가능한 컴포넌트 시스템

import { jsxs, jsx } from 'react/jsx-runtime';
import { forwardRef, useState } from 'react';
import { Button } from '../ui/Button.js';
import { useAuth } from '../../hooks/useAuth.js';

const LoginButton = forwardRef(({ className = "", provider, variant = "outline", size = "md", disabled = false, onSuccess, onError, callbackUrl, children, ...props }, ref) => {
    const { signIn, isLoading } = useAuth();
    const [isSigningIn, setIsSigningIn] = useState(false);
    const handleSignIn = async () => {
        if (isSigningIn || disabled)
            return;
        setIsSigningIn(true);
        try {
            await signIn(provider, { callbackUrl });
            onSuccess === null || onSuccess === void 0 ? void 0 : onSuccess(null); // We don't have user data immediately after sign in
        }
        catch (error) {
            console.error(`Sign in with ${provider} failed:`, error);
            onError === null || onError === void 0 ? void 0 : onError(error);
        }
        finally {
            setIsSigningIn(false);
        }
    };
    const getProviderIcon = () => {
        switch (provider) {
            case "google":
                return (jsxs("svg", { className: "w-5 h-5 mr-2", viewBox: "0 0 24 24", children: [jsx("path", { fill: "#4285F4", d: "M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92c-.26 1.37-1.04 2.53-2.21 3.31v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.09z" }), jsx("path", { fill: "#34A853", d: "M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z" }), jsx("path", { fill: "#FBBC05", d: "M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.07H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.93l2.85-2.22.81-.62z" }), jsx("path", { fill: "#EA4335", d: "M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z" })] }));
            case "kakao":
                return (jsx("svg", { className: "w-5 h-5 mr-2", viewBox: "0 0 24 24", children: jsx("path", { fill: "#FEE500", d: "M12 3c5.799 0 10.5 3.664 10.5 8.185 0 4.52-4.701 8.184-10.5 8.184a13.5 13.5 0 0 1-1.082-.043l-3.987 2.077c-.35.183-.749-.24-.574-.609l1.575-3.321C5.743 16.695 1.5 12.853 1.5 11.185 1.5 6.664 6.201 3 12 3z" }) }));
            case "naver":
                return (jsx("svg", { className: "w-5 h-5 mr-2", viewBox: "0 0 24 24", children: jsx("path", { fill: "#03C75A", d: "M16.273 12.845 7.376 0H0v24h7.727V11.155L16.624 24H24V0h-7.727v12.845z" }) }));
            case "email":
                return (jsx("svg", { className: "w-5 h-5 mr-2", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M3 8l7.89 4.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z" }) }));
            default:
                return null;
        }
    };
    const getProviderName = () => {
        switch (provider) {
            case "google":
                return "Google";
            case "kakao":
                return "Kakao";
            case "naver":
                return "Naver";
            case "email":
                return "Email";
            default:
                return "Provider";
        }
    };
    return (jsxs(Button, { ref: ref, variant: variant, size: size, disabled: disabled || isLoading || isSigningIn, loading: isSigningIn, onClick: handleSignIn, className: `justify-center ${className}`, ...props, children: [!isSigningIn && getProviderIcon(), children || `Continue with ${getProviderName()}`] }));
});
LoginButton.displayName = "LoginButton";

export { LoginButton };
//# sourceMappingURL=LoginButton.js.map