"use strict";
Object.defineProperty(exports, "__esModule", {
    value: true
});
Object.defineProperty(exports, "TokenSelect", {
    enumerable: true,
    get: function() {
        return TokenSelect;
    }
});
const _jsxruntime = require("react/jsx-runtime");
const _react = require("react");
const _types = require("@orderly.network/types");
const _hooks = require("@orderly.network/hooks");
const _tokenSelectmobile = require("./tokenSelect.mobile");
const _tokenSelectdesktop = require("./tokenSelect.desktop");
const _icon = require("../../../icon");
const _utils = require("../../../utils");
const TokenSelect = (props)=>{
    const { tokens } = props;
    const [open, setOpen] = (0, _react.useState)(false);
    const isMobile = (0, _hooks.useMediaQuery)(_types.MEDIA_TABLET);
    const token = (0, _react.useMemo)(()=>{
        if (!!props.token) {
            return props.token;
        }
        // default show USDC when no token selected
        return {
            symbol: "USDC"
        };
    }, [
        props.token
    ]);
    const disabled = (tokens?.length ?? 0) < 2 || props.disabled;
    const trigger = (0, _react.useMemo)(()=>{
        return /*#__PURE__*/ (0, _jsxruntime.jsxs)("button", {
            disabled: disabled,
            className: "orderly-token-select orderly-flex orderly-items-center orderly-gap-2 orderly-text-3xs orderly-text-base-contrast-80 orderly-mr-2 desktop:orderly-text-xs",
            onClick: (event)=>{
                event.preventDefault();
                event.stopPropagation();
                setOpen(!open);
            },
            children: [
                /*#__PURE__*/ (0, _jsxruntime.jsx)(_icon.NetworkImage, {
                    type: token ? "token" : "placeholder",
                    name: token?.symbol,
                    size: "small",
                    rounded: true
                }),
                /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                    children: token?.symbol
                }),
                tokens && tokens.length > 1 && /*#__PURE__*/ (0, _jsxruntime.jsx)(_icon.ArrowDownIcon, {
                    className: (0, _utils.cn)("orderly-transition orderly-duration-300", open ? "orderly-rotate-180" : "orderly-rotate-0"),
                    size: 16
                })
            ]
        });
    }, [
        tokens,
        token,
        disabled,
        open
    ]);
    const commonProps = {
        open,
        onOpenChange: setOpen,
        trigger,
        tokens: props.tokens,
        fetchBalance: props.fetchBalance,
        onTokenChange: props.onTokenChange,
        disabled
    };
    if (isMobile) {
        return /*#__PURE__*/ (0, _jsxruntime.jsx)(_tokenSelectmobile.MobileTokenSelect, {
            ...commonProps
        });
    }
    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_tokenSelectdesktop.DesktopTokenSelect, {
        ...commonProps
    });
};

//# sourceMappingURL=tokenSelect.js.map