@dynamic-labs/sdk-react-core/src/lib/components/HardwareWalletToggle/HardwareWalletToggle.js

A React SDK for implementing wallet web3 authentication and authorization to your website.

'use client'
import { jsx } from 'react/jsx-runtime';
import { useState, useCallback } from 'react';
import '@dynamic-labs/sdk-api-core';
import '../../shared/logger.js';
import '@dynamic-labs/iconic';
import '@dynamic-labs/wallet-connector-core';
import { ReactComponent as SvgCheck } from '../../shared/assets/check.js';
import '../../context/ViewContext/ViewContext.js';
import '@dynamic-labs/wallet-book';
import '@dynamic-labs/utils';
import '../../utils/constants/colors.js';
import '../../utils/constants/values.js';
import '../../shared/consts/index.js';
import { Icon } from '../Icon/Icon.js';
import { ListTile } from '../ListTile/ListTile.js';
import { Toggle } from '../Toggle/Toggle.js';

const HardwareWalletToggle = ({ connectors, label, copykey, }) => {
    const [isEnabled, _setEnabled] = useState(connectors.some((connector) => connector.isHardwareWalletEnabled));
    const setEnabled = useCallback((enabled) => {
        _setEnabled(enabled);
        connectors.forEach((connector) => {
            connector.isHardwareWalletEnabled = enabled;
        });
    }, [connectors]);
    const toggle = (jsx(Toggle, { value: isEnabled, dataTestId: 'hardware-wallet-toggle', icon: jsx(Icon, { size: 'small', children: jsx(SvgCheck, {}) }), className: 'hardware-wallet-toggle__toggle' }));
    return (jsx(ListTile, { onClick: () => setEnabled(!isEnabled), trailing: toggle, children: jsx("span", { copykey, children: label }) }));
};

export { HardwareWalletToggle };