@reservoir0x/relay-kit-ui/_esm/src/components/primitives/ChainIcon.js

Relay is the Fastest and Cheapest Way to Bridge and Transact Across Chains.

import { jsx as _jsx } from "react/jsx-runtime";
import { useContext } from 'react';
import { Flex } from './index.js';
import useRelayClient from '../../hooks/useRelayClient.js';
import { ProviderOptionsContext } from '../../providers/RelayKitProvider.js';
const ChainIcon = ({ chainId, css = {}, height = 14, width = 14, square = true }) => {
    const providerOptions = useContext(ProviderOptionsContext);
    const client = useRelayClient();
    const chain = chainId
        ? client?.chains?.find((chain) => chain.id === chainId)
        : null;
    const icon = chain
        ? providerOptions.themeScheme === 'dark'
            ? chain.icon?.dark || chain.icon?.light
            : chain.icon?.light
        : null;
    const iconUrl = square && icon ? icon.replace('/icons/', '/icons/square/') : icon;
    return iconUrl ? (_jsx(Flex, { css: {
            display: 'flex',
            flexShrink: 0,
            ...css
        }, style: {
            height: height,
            width: width
        }, children: iconUrl ? (_jsx("img", { src: iconUrl, alt: `Chain #${chainId}`, style: {
                borderRadius: square ? 4 : 0,
                width: css && css.width ? Number(css.width) : '100%',
                height: css && css.height ? Number(css.height) : '100%'
            } })) : null })) : null;
};
export default ChainIcon;
//# sourceMappingURL=ChainIcon.js.map