import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import copyToClipboard from "copy-to-clipboard";
import { memo } from "react";
import { useTranslation } from "react-i18next";
import { QRCode } from "react-qrcode-logo";
import { WALLET_CONNECT_LOGO } from "../interfaces";
function WalletConnect(props) {
    const { walletConnectUri } = props;
    const [t] = useTranslation();
    // TODO: show only wcAdapters of current chain
    return (_jsx("div", Object.assign({ className: "w3ajs-wallet-connect w3a-wallet-connect" }, { children: _jsx("div", Object.assign({ className: "w3ajs-wallet-connect__container w3a-wallet-connect__container" }, { children: _jsxs("div", Object.assign({ className: "w3a-wallet-connect__container-desktop" }, { children: [_jsx("div", { children: t("modal.external.walletconnect-subtitle") }), _jsx("div", Object.assign({ className: "w3ajs-wallet-connect-qr w3a-wallet-connect-qr", tabIndex: 0, role: "button", onClick: () => copyToClipboard(walletConnectUri), onKeyDown: () => copyToClipboard(walletConnectUri) }, { children: _jsx(QRCode, { size: 200, eyeRadius: 5, qrStyle: "dots", removeQrCodeBehindLogo: true, logoImage: WALLET_CONNECT_LOGO, value: walletConnectUri }) })), _jsx("div", { children: t("modal.external.walletconnect-copy") })] })) })) })));
}
export default memo(WalletConnect);
//# sourceMappingURL=WalletConnect.js.map