import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
/**
 * @license
 * Copyright 2025 Vybestack LLC
 * SPDX-License-Identifier: Apache-2.0
 */
import { useMemo, useCallback } from 'react';
import { Box, Text } from 'ink';
import { Colors } from '../../colors.js';
import { RadioButtonSelect, } from '../shared/RadioButtonSelect.js';
// Providers that support OAuth
const OAUTH_PROVIDERS = new Set([
    'anthropic',
    'openai',
    'gemini',
    'qwen',
    'codex',
]);
const API_KEY_URLS = {
    anthropic: 'console.anthropic.com/settings/keys',
    openai: 'platform.openai.com/api-keys',
    gemini: 'aistudio.google.com/app/apikey',
    deepseek: 'platform.deepseek.com/api_keys',
    qwen: 'dashscope.console.aliyun.com/apiKey',
};
export const AuthMethodStep = ({ provider, onSelect, onBack, error, isFocused = true, }) => {
    const supportsOAuth = OAUTH_PROVIDERS.has(provider);
    const apiKeyUrl = API_KEY_URLS[provider];
    const options = useMemo(() => {
        const opts = [];
        if (supportsOAuth) {
            opts.push({
                label: 'OAuth (Recommended - secure & easy)',
                value: 'oauth',
                key: 'oauth',
            });
        }
        opts.push({
            label: 'API Key',
            value: 'api_key',
            key: 'api_key',
        });
        opts.push({
            label: '← Back to provider selection',
            value: 'back',
            key: 'back',
        });
        return opts;
    }, [supportsOAuth]);
    const handleSelect = useCallback((value) => {
        if (value === 'back') {
            onBack();
        }
        else {
            onSelect(value);
        }
    }, [onBack, onSelect]);
    const providerDisplay = provider.charAt(0).toUpperCase() + provider.slice(1);
    return (_jsxs(Box, { flexDirection: "column", children: [_jsxs(Box, { flexDirection: "column", marginBottom: 1, children: [_jsx(Text, { bold: true, color: Colors.AccentCyan, children: "Step 3 of 5: Choose Authentication Method" }), _jsx(Text, { color: Colors.Foreground, children: " " }), _jsxs(Text, { color: Colors.Foreground, children: ["How would you like to authenticate with ", providerDisplay, "?"] })] }), error && (_jsx(Box, { marginBottom: 1, children: _jsx(Text, { color: Colors.AccentRed, children: error }) })), _jsx(RadioButtonSelect, { items: options, onSelect: handleSelect, isFocused: isFocused }), apiKeyUrl && (_jsx(Box, { marginTop: 1, children: _jsxs(Text, { color: Colors.Gray, children: ["Get API key at: ", apiKeyUrl] }) })), _jsx(Box, { marginTop: 1, children: _jsx(Text, { color: Colors.Gray, children: "Use \u2191\u2193 to navigate, Enter to select, Esc to skip" }) })] }));
};
//# sourceMappingURL=AuthMethodStep.js.map