UNPKG

@reservoir0x/relay-kit-ui

Version:

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

18 lines 1.47 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.BalanceDisplay = void 0; const jsx_runtime_1 = require("react/jsx-runtime"); const index_js_1 = require("../primitives/index.js"); const numbers_js_1 = require("../../utils/numbers.js"); const BalanceDisplay = ({ balance, decimals, symbol, isLoading, hasInsufficientBalance, displaySymbol = true, isConnected, pending }) => { const compactBalance = Boolean(balance && decimals && balance.toString().length - decimals > 4); if (pending) { return ((0, jsx_runtime_1.jsx)(index_js_1.Flex, { css: { height: 18 }, children: (0, jsx_runtime_1.jsx)(index_js_1.Text, { style: "subtitle3", color: 'red', children: "Balance: pending" }) })); } return ((0, jsx_runtime_1.jsx)(index_js_1.Flex, { css: { height: 18 }, children: isConnected ? ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: isLoading ? ((0, jsx_runtime_1.jsx)(index_js_1.Skeleton, { css: { mt: '6px' } })) : ((0, jsx_runtime_1.jsxs)(index_js_1.Text, { style: "subtitle3", color: hasInsufficientBalance ? 'red' : 'subtleSecondary', children: ["Balance:", ' ', balance !== undefined ? (0, numbers_js_1.formatBN)(balance ?? 0n, 5, decimals, compactBalance) + (displaySymbol && symbol ? ` ${symbol}` : '') : '-', ' '] })) })) : null })); }; exports.BalanceDisplay = BalanceDisplay; //# sourceMappingURL=BalanceDisplay.js.map