'use client'
'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var jsxRuntime = require('react/jsx-runtime');
var React = require('react');
var reactI18next = require('react-i18next');
var walletBook = require('@dynamic-labs/wallet-book');
var Icon = require('../../../../components/Icon/Icon.cjs');
var ModalHeader = require('../../../../components/ModalHeader/ModalHeader.cjs');
var Typography = require('../../../../components/Typography/Typography.cjs');
var TypographyButton = require('../../../../components/TypographyButton/TypographyButton.cjs');
var chevronDown = require('../../../../shared/assets/chevron-down.cjs');
require('@dynamic-labs/iconic');
require('../../../../context/ViewContext/ViewContext.cjs');
var shortenWalletAddress = require('../../../../shared/utils/functions/shortenWalletAddress/shortenWalletAddress.cjs');
require('../../../../context/DynamicContext/useDynamicContext/useDynamicContext.cjs');
var useInternalDynamicContext = require('../../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext/useInternalDynamicContext.cjs');
var DynamicWidgetContext = require('../../context/DynamicWidgetContext.cjs');
var createFundingButtons = require('../ReceiveWalletFunds/utils/createFundingButtons/createFundingButtons.cjs');
var CryptoTokenSelectScreen = require('./CryptoTokenSelectScreen/CryptoTokenSelectScreen.cjs');
var isTrustedImageUrl = require('./isTrustedImageUrl.cjs');
var useMoonPayOnramp = require('./useMoonPayOnramp.cjs');

const MoonPayOnramp = ({ onBack, hideBackButton = false, onPaymentCreated, token: initialToken, merchantName, walletAddress: walletAddressOverride, }) => {
    var _a;
    const { t } = reactI18next.useTranslation();
    const { setShowAuthFlow, setShowDynamicUserProfile } = useInternalDynamicContext.useInternalDynamicContext();
    const { setDynamicWidgetView } = DynamicWidgetContext.useWidgetContext();
    const { primaryWallet, availableTokens, tokensLoading, tokensError, selectedToken, setSelectedToken, isOpening, error, effectiveWalletAddress, openMoonPay, } = useMoonPayOnramp.useMoonPayOnramp({
        initialToken,
        merchantName,
        onPaymentCreated,
        walletAddressOverride,
    });
    const [showTokenSelect, setShowTokenSelect] = React.useState(false);
    // createFundingButtons calls onBack directly when provided, so this default
    // only runs when no onBack prop was passed.
    const handleBack = React.useCallback(() => {
        setDynamicWidgetView('choose-onramp-provider');
    }, [setDynamicWidgetView]);
    const { backButton, closeButton } = createFundingButtons.createFundingButtons({
        defaultBackAction: handleBack,
        hideBackButton,
        onBack,
        setShowAuthFlow,
        setShowDynamicUserProfile,
    });
    if (!primaryWallet)
        return null;
    if (showTokenSelect) {
        return (jsxRuntime.jsx(CryptoTokenSelectScreen.CryptoTokenSelectScreen, { tokens: availableTokens, currentToken: selectedToken, onClose: () => setShowTokenSelect(false), onSelectToken: (tokenCode) => {
                setSelectedToken(tokenCode);
                setShowTokenSelect(false);
            } }));
    }
    const selectedTokenData = availableTokens.find((tok) => tok.code === selectedToken);
    const selectedTokenName = (_a = selectedTokenData === null || selectedTokenData === void 0 ? void 0 : selectedTokenData.name) !== null && _a !== void 0 ? _a : selectedToken;
    const selectedTokenIcon = selectedTokenData === null || selectedTokenData === void 0 ? void 0 : selectedTokenData.icon;
    const tokenSelectorContent = (() => {
        if (tokensLoading) {
            return (jsxRuntime.jsx(Typography.Typography, { variant: 'body_small', weight: 'medium', children: t('dyn_moonpay_onramp.loading_tokens', 'Loading tokens...') }));
        }
        if (tokensError) {
            return (jsxRuntime.jsx(Typography.Typography, { variant: 'body_small', color: 'error-1', weight: 'medium', children: t('dyn_moonpay_onramp.tokens_error', 'Failed to load tokens') }));
        }
        return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [isTrustedImageUrl.isTrustedImageUrl(selectedTokenIcon) && (jsxRuntime.jsx("img", { src: selectedTokenIcon, alt: selectedTokenName, className: 'fund-from-wallet__content__currency-selector__dropdown__content__icon', "aria-hidden": 'true' })), jsxRuntime.jsx(Typography.Typography, { variant: 'body_small', weight: 'medium', children: selectedTokenName })] }));
    })();
    return (jsxRuntime.jsxs("div", { className: 'fund-from-wallet fund-from-wallet--moonpay', children: [jsxRuntime.jsx(ModalHeader.ModalHeader, { leading: backButton, trailing: closeButton, children: jsxRuntime.jsx(Typography.Typography, { variant: 'title', copykey: 'dyn_moonpay_onramp.title', children: t('dyn_moonpay_onramp.title', 'Buy Crypto') }) }), jsxRuntime.jsxs("div", { className: 'fund-from-wallet__content', children: [error && (jsxRuntime.jsx(Typography.Typography, { color: 'error-1', variant: 'body_normal', weight: 'medium', className: 'fund-from-wallet__content__error', children: error })), jsxRuntime.jsxs("div", { className: 'fund-from-wallet__content__currency-selector', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_small', weight: 'medium', color: 'secondary', copykey: 'dyn_moonpay_onramp.token_label', children: t('dyn_moonpay_onramp.token_label', 'Select Token') }), jsxRuntime.jsxs("div", { className: 'fund-from-wallet__content__currency-selector__dropdown', onClick: () => !tokensLoading && !tokensError && setShowTokenSelect(true), role: 'button', tabIndex: 0, onKeyDown: (e) => {
                                    if (e.key === 'Enter' || e.key === ' ') {
                                        e.preventDefault();
                                        if (!tokensLoading && !tokensError) {
                                            setShowTokenSelect(true);
                                        }
                                    }
                                }, "aria-label": t('dyn_moonpay_onramp.select_token', 'Select Token'), "aria-expanded": showTokenSelect, "aria-haspopup": 'dialog', "data-testid": 'token-select-dropdown', children: [jsxRuntime.jsx("div", { className: 'fund-from-wallet__content__currency-selector__dropdown__content', children: tokenSelectorContent }), jsxRuntime.jsx("div", { className: 'fund-from-wallet__content__currency-selector__dropdown__icon', children: jsxRuntime.jsx(Icon.Icon, { color: 'text-tertiary', size: 'small', children: jsxRuntime.jsx(chevronDown.ReactComponent, {}) }) })] })] }), jsxRuntime.jsx("div", { className: 'fund-from-wallet__content__wallet-card', children: jsxRuntime.jsxs("div", { className: 'fund-from-wallet__content__wallet-card__wallet-details', children: [jsxRuntime.jsx(walletBook.WalletIcon, { icon: primaryWallet.connector.metadata.icon, walletKey: primaryWallet.connector.key, className: 'fund-from-wallet__content__wallet-card__wallet-details__icon' }), jsxRuntime.jsxs("div", { className: 'fund-from-wallet__content__wallet-card__wallet-details__rows', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_small', weight: 'medium', copykey: 'dyn_moonpay_onramp.wallet_detail_to', children: t('dyn_moonpay_onramp.wallet_detail_to', 'Tokens will be sent to') }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_small', color: 'secondary', weight: 'medium', children: shortenWalletAddress.shortenWalletAddress(effectiveWalletAddress) })] })] }) })] }), jsxRuntime.jsx(TypographyButton.TypographyButton, { dataTestId: 'confirm-button', buttonVariant: 'brand-primary', buttonPadding: 'large', typographyProps: { color: 'white' }, className: 'fund-from-wallet__confirm-button', disabled: isOpening ||
                    tokensLoading ||
                    tokensError ||
                    !selectedToken ||
                    availableTokens.length === 0 ||
                    !effectiveWalletAddress, onClick: openMoonPay, children: isOpening
                    ? t('dyn_moonpay_onramp.opening', 'Opening MoonPay...')
                    : t('dyn_moonpay_onramp.continue', 'Continue to MoonPay') })] }));
};

exports.MoonPayOnramp = MoonPayOnramp;
