UNPKG

@lifi/widget

Version:

LI.FI Widget for cross-chain bridging and swapping. It will drive your multi-chain strategy and attract new users from everywhere.

32 lines 1.78 kB
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime"; import ContentCopyRounded from '@mui/icons-material/ContentCopyRounded'; import OpenInNew from '@mui/icons-material/OpenInNew'; import { Box, Typography } from '@mui/material'; import { useTranslation } from 'react-i18next'; import { Card } from '../../components/Card/Card.js'; import { CardIconButton } from '../../components/Card/CardIconButton.js'; import { CardTitle } from '../../components/Card/CardTitle.js'; export const TransferIdCard = ({ transferId, txLink }) => { const { t } = useTranslation(); const copyTransferId = async () => { await navigator.clipboard.writeText(transferId); }; const openTransferIdInExplorer = () => { window.open(txLink, '_blank'); }; return (_jsxs(Card, { sx: { marginTop: 2 }, children: [_jsxs(Box, { sx: { display: 'flex', flex: 1, }, children: [_jsx(CardTitle, { flex: 1, children: t('main.transferId') }), _jsxs(Box, { sx: { gap: 1, display: 'flex', marginRight: 2, marginTop: 1, }, children: [_jsx(CardIconButton, { size: "small", onClick: copyTransferId, children: _jsx(ContentCopyRounded, { fontSize: "inherit" }) }), txLink ? (_jsx(CardIconButton, { size: "small", onClick: openTransferIdInExplorer, children: _jsx(OpenInNew, { fontSize: "inherit" }) })) : null] })] }), _jsx(Typography, { variant: "body2", sx: { pt: 1, pb: 2, px: 2, wordBreak: 'break-all', }, children: transferId })] })); }; //# sourceMappingURL=TransferIdCard.js.map