import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Input } from "../../../input";
import { useMemo } from "react";
import { ChainSelect } from "../chainPicker";
export const WalletPicker = (props)=>{
    const { chain, chains } = props;
    const address = useMemo(()=>{
        if (!props.address) return "--";
        return props.address.replace(/^(.{6})(.*)(.{4})$/, "$1......$3");
    }, [
        props.address
    ]);
    //
    return /*#__PURE__*/ _jsxs("div", {
        className: "orderly-flex orderly-gap-2",
        children: [
            /*#__PURE__*/ _jsx(Input, {
                className: "orderly-wallet-picker orderly-text-4xs orderly-text-base-contrast-36 desktop:orderly-text-3xs",
                containerClassName: "orderly-bg-base-500 orderly-rounded-borderRadius",
                disabled: true,
                value: address,
                fullWidth: true
            }),
            /*#__PURE__*/ _jsx(ChainSelect, {
                value: chain,
                onValueChange: props.onChainChange,
                onChainInited: props.onChainInited,
                settingChain: props.settingChain,
                chains: props.chains
            })
        ]
    });
};

//# sourceMappingURL=walletPicker.js.map