@reservoir0x/relay-kit-ui
Version:
Relay is the Fastest and Cheapest Way to Bridge and Transact Across Chains.
42 lines • 2.97 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.TokenTrigger = void 0;
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const index_js_1 = require("../../../primitives/index.js");
const react_fontawesome_1 = require("@fortawesome/react-fontawesome");
const free_solid_svg_icons_1 = require("@fortawesome/free-solid-svg-icons");
const useRelayClient_js_1 = tslib_1.__importDefault(require("../../../../hooks/useRelayClient.js"));
const TokenTrigger = ({ token, locked, isSingleChainLocked, address }) => {
const relayClient = (0, useRelayClient_js_1.default)();
const chain = relayClient?.chains?.find((chain) => chain.id === token?.chainId);
return token ? ((0, jsx_runtime_1.jsxs)(index_js_1.Button, { color: "white", corners: "pill", disabled: locked, css: {
height: 50,
minHeight: 50,
width: 'max-content',
flexShrink: 0,
overflow: 'hidden',
px: '3',
py: '2',
backgroundColor: 'widget-selector-background',
border: 'none',
_hover: {
backgroundColor: 'widget-selector-hover-background'
},
_disabled: {
backgroundColor: 'widget-selector-background'
}
}, children: [(0, jsx_runtime_1.jsxs)(index_js_1.Flex, { align: "center", css: { gap: '2' }, children: [(0, jsx_runtime_1.jsx)(index_js_1.ChainTokenIcon, { chainId: token.chainId, tokenlogoURI: token.logoURI, tokenSymbol: token.symbol, css: { width: 32, height: 32 } }), (0, jsx_runtime_1.jsxs)(index_js_1.Flex, { direction: "column", align: "start", css: { maxWidth: 100, minWidth: 60 }, children: [(0, jsx_runtime_1.jsx)(index_js_1.Text, { style: "h6", ellipsify: true, css: { maxWidth: '100%' }, children: token.symbol }), (0, jsx_runtime_1.jsx)(index_js_1.Text, { style: "subtitle3", ellipsify: true, color: "subtle", css: { lineHeight: '15px', maxWidth: '100%' }, children: chain?.displayName })] })] }), locked ? null : ((0, jsx_runtime_1.jsx)(index_js_1.Box, { css: { color: 'gray11', width: 14, flexShrink: 0 }, children: (0, jsx_runtime_1.jsx)(react_fontawesome_1.FontAwesomeIcon, { icon: free_solid_svg_icons_1.faChevronRight, width: 14 }) }))] })) : ((0, jsx_runtime_1.jsxs)(index_js_1.Button, { color: address ? 'primary' : 'secondary', corners: "pill", css: {
height: 50,
minHeight: 50,
width: 'max-content',
flexShrink: 0,
overflow: 'hidden',
px: '3',
py: '2',
fontWeight: 700,
fontSize: '16px'
}, children: ["Select Token", (0, jsx_runtime_1.jsx)(index_js_1.Box, { css: { width: 14 }, children: (0, jsx_runtime_1.jsx)(react_fontawesome_1.FontAwesomeIcon, { icon: free_solid_svg_icons_1.faChevronRight, width: 14 }) })] }));
};
exports.TokenTrigger = TokenTrigger;
//# sourceMappingURL=TokenTrigger.js.map