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

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

import { jsxs, jsx } from 'react/jsx-runtime';
import { r as reactExports } from '../../_virtual/index4.js';
import { useState } from 'react';
import { Button } from '../ui/Button.js';
import Vt from '../../node_modules/react-hot-toast/dist/index.js';

function SocialLoginButtons({ callbackUrl = "/", className = "", }) {
    const [loadingProvider, setLoadingProvider] = useState(null);
    const handleSocialLogin = async (provider) => {
        try {
            setLoadingProvider(provider);
            await reactExports.signIn(provider, {
                callbackUrl,
                redirect: true,
            });
        }
        catch (error) {
            console.error(`${provider} login error:`, error);
            Vt.error(`${provider} 로그인 중 오류가 발생했습니다.`);
        }
        finally {
            setLoadingProvider(null);
        }
    };
    const providers = [
        {
            id: "google",
            name: "구글",
            bgColor: "bg-white hover:bg-gray-50",
            textColor: "text-gray-900",
            borderColor: "border-gray-300",
            icon: (jsxs("svg", { className: "w-5 h-5", 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" })] })),
        },
        {
            id: "kakao",
            name: "카카오",
            bgColor: "bg-yellow-400 hover:bg-yellow-500",
            textColor: "text-black",
            borderColor: "border-yellow-400",
            icon: (jsx("svg", { className: "w-5 h-5", viewBox: "0 0 24 24", fill: "currentColor", children: jsx("path", { 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.727-.11l-4.408 2.883c-.501.265-.678.236-.472-.413l.892-3.678c-2.88-1.46-4.785-3.99-4.785-6.866C1.5 6.665 6.201 3 12 3z" }) })),
        },
        {
            id: "naver",
            name: "네이버",
            bgColor: "bg-green-500 hover:bg-green-600",
            textColor: "text-white",
            borderColor: "border-green-500",
            icon: (jsx("svg", { className: "w-5 h-5", viewBox: "0 0 24 24", fill: "currentColor", children: jsx("path", { d: "M16.273 12.845 7.376 0H0v24h7.726V11.156L16.624 24H24V0h-7.727v12.845z" }) })),
        },
    ];
    return (jsx("div", { className: `space-y-3 ${className}`, children: providers.map((provider) => (jsxs(Button, { onClick: () => handleSocialLogin(provider.id), disabled: loadingProvider !== null, className: `
            w-full flex items-center justify-center gap-3 py-3 px-4 
            border ${provider.borderColor} ${provider.bgColor} ${provider.textColor}
            rounded-lg font-medium transition-colors duration-200
            disabled:opacity-50 disabled:cursor-not-allowed
          `, variant: "outline", children: [loadingProvider === provider.id ? (jsx("div", { className: "w-5 h-5 border-2 border-current border-t-transparent rounded-full animate-spin" })) : (provider.icon), jsx("span", { children: loadingProvider === provider.id
                        ? "로그인 중..."
                        : `${provider.name}로 계속하기` })] }, provider.id))) }));
}

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