'use client'
import { jsx } from 'react/jsx-runtime';
import '@dynamic-labs/iconic';
import '@dynamic-labs/wallet-connector-core';
import 'react';
import { ReactComponent as SvgWalletConnectLogo } from '../../../shared/assets/wallet-connect-logo.js';
import '../../../context/ViewContext/ViewContext.js';
import '../../../shared/logger.js';
import '@dynamic-labs/wallet-book';
import '@dynamic-labs/utils';
import '../../../utils/constants/colors.js';
import '../../../utils/constants/values.js';
import '@dynamic-labs/sdk-api-core';
import '../../../shared/consts/index.js';
import '../../../../../_virtual/_tslib.js';
import '@dynamic-labs/multi-wallet';
import 'react-international-phone';
import '../../../store/state/nonce/nonce.js';
import { pixelToRem } from '../../../utils/functions/pixelToRem/pixelToRem.js';
import '@dynamic-labs-wallet/browser-wallet-client';
import '@dynamic-labs-sdk/client/core';
import 'eventemitter3';
import '@dynamic-labs-sdk/client';
import '../../../config/ApiEndpoint.js';
import '../../../events/dynamicEvents.js';
import '@dynamic-labs/locale';
import '../../../store/state/dynamicContextProps/dynamicContextProps.js';
import '../../../store/state/primaryWalletId/primaryWalletId.js';
import '../../../store/state/connectedWalletsInfo/connectedWalletsInfo.js';
import '../../../utils/functions/getWaasAddressTypeLabel/getWaasAddressTypeLabel.js';

const Indicator = ({ indicator, iconSize }) => {
    const walletConnectSizes = {
        container: (iconSize * 4) / 15,
        icon: (iconSize * 3) / 15,
    };
    const connectedSizes = {
        container: iconSize / 6,
        icon: iconSize / 9,
    };
    if (indicator === 'walletConnect') {
        return (jsx("div", { className: 'indicator__wallet-connect', style: {
                height: pixelToRem(walletConnectSizes.container),
                width: pixelToRem(walletConnectSizes.container),
            }, children: jsx(SvgWalletConnectLogo, { style: {
                    height: pixelToRem(walletConnectSizes.icon),
                    width: pixelToRem(walletConnectSizes.icon),
                } }) }));
    }
    return (jsx("div", { className: 'indicator__container indicator__container--connected', style: {
            height: pixelToRem(connectedSizes.container),
            width: pixelToRem(connectedSizes.container),
        }, "data-testid": 'connected-indicator', children: jsx("div", { className: 'indicator__icon', style: {
                height: pixelToRem(connectedSizes.icon),
                width: pixelToRem(connectedSizes.icon),
            } }) }));
};

export { Indicator };
