"use strict";
Object.defineProperty(exports, "__esModule", {
    value: true
});
Object.defineProperty(exports, "DesktopTokenCell", {
    enumerable: true,
    get: function() {
        return DesktopTokenCell;
    }
});
const _jsxruntime = require("react/jsx-runtime");
const _icon = require("../../../icon");
const _spinner = require("../../../spinner");
const _text = require("../../../text");
const _useGetBalance = require("./useGetBalance");
const DesktopTokenCell = (props)=>{
    const { token } = props;
    const { balance, loading } = (0, _useGetBalance.useGetBalance)(token, props.fetchBalance);
    return /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
        className: "orderly-token-select-dropdown-menu-item orderly-cursor-pointer hover:orderly-bg-base-contrast/5 orderly-font-semibold orderly-p-3",
        children: [
            /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                className: "orderly-flex orderly-items-center orderly-h-[20px] orderly-rounded-sm",
                children: [
                    /*#__PURE__*/ (0, _jsxruntime.jsx)(_icon.NetworkImage, {
                        size: 16,
                        type: "token",
                        name: token.symbol,
                        rounded: true
                    }),
                    /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
                        className: "orderly-text-2xs orderly-text-base-contrast orderly-ml-2",
                        children: token.symbol
                    })
                ]
            }),
            /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                className: "orderly-flex orderly-items-center orderly-text-3xs orderly-text-base-contrast/50 orderly-leading-[20px]",
                children: [
                    /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                        className: "orderly-mr-1",
                        children: "Available:"
                    }),
                    loading ? /*#__PURE__*/ (0, _jsxruntime.jsx)(_spinner.Spinner, {
                        size: "small",
                        className: "orderly-w-[16px] orderly-h-[16px]"
                    }) : /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                        className: "orderly-flex orderly-items-center",
                        children: [
                            /*#__PURE__*/ (0, _jsxruntime.jsx)(_text.Numeral, {
                                precision: token.precision || 2,
                                padding: false,
                                children: balance
                            }),
                            /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                                className: "orderly-text-4xs orderly-ml-1",
                                children: token.symbol
                            })
                        ]
                    })
                ]
            })
        ]
    });
};

//# sourceMappingURL=tokenCell.desktop.js.map