@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.
41 lines • 2.3 kB
JavaScript
import { jsx as _jsx } from "react/jsx-runtime";
import Wallet from '@mui/icons-material/Wallet';
import { Button, Tooltip } from '@mui/material';
import { useTranslation } from 'react-i18next';
import { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js';
import { useWidgetEvents } from '../../hooks/useWidgetEvents.js';
import { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js';
import { useBookmarkActions } from '../../stores/bookmarks/useBookmarkActions.js';
import { useFieldActions } from '../../stores/form/useFieldActions.js';
import { useFieldValues } from '../../stores/form/useFieldValues.js';
import { sendToWalletStore, useSendToWalletStore, } from '../../stores/settings/useSendToWalletStore.js';
import { WidgetEvent } from '../../types/events.js';
import { DisabledUI, HiddenUI } from '../../types/widget.js';
export const SendToWalletExpandButton = () => {
const { t } = useTranslation();
const { disabledUI, hiddenUI } = useWidgetConfig();
const { setFieldValue } = useFieldActions();
const { setSelectedBookmark } = useBookmarkActions();
const emitter = useWidgetEvents();
const { showSendToWallet, setSendToWallet } = useSendToWalletStore((state) => state);
const [toAddressFieldValue] = useFieldValues('toAddress');
const { requiredToAddress } = useToAddressRequirements();
if (requiredToAddress || hiddenUI?.includes(HiddenUI.ToAddress)) {
return null;
}
const handleClick = () => {
if (showSendToWallet && !disabledUI?.includes(DisabledUI.ToAddress)) {
setFieldValue('toAddress', '', { isTouched: true });
setSelectedBookmark();
}
setSendToWallet(!showSendToWallet);
emitter.emit(WidgetEvent.SendToWalletToggled, sendToWalletStore.getState().showSendToWallet);
};
const buttonVariant = showSendToWallet || Boolean(toAddressFieldValue) ? 'contained' : 'text';
return (_jsx(Tooltip, { title: t('main.sendToWallet'), placement: "bottom-end", children: _jsx(Button, { variant: buttonVariant, onClick: handleClick, sx: {
minWidth: 48,
width: 48,
height: 48,
}, children: _jsx(Wallet, {}) }) }));
};
//# sourceMappingURL=SendToWalletExpandButton.js.map