@matchain/matchid-sdk-react 0.1.55-alpha.12 → 0.1.55-alpha.13

package/dist/components.js

@@ -58,7 +58,7 @@ __export(components_exports, {
 module.exports = __toCommonJS(components_exports);
 
 // src/components/EmailModal/index.tsx
-var import_react25 = require("react");
+var import_react26 = require("react");
 
 // src/ui/Modal/index.tsx
 var import_react3 = require("react");
@@ -1896,10 +1896,10 @@ var localStore = useLocalStore;
 var useLocalStore_default = useLocalStore;
 
 // src/hooks/useUserInfo.tsx
-var import_react23 = require("react");
+var import_react24 = require("react");
 
 // src/MatchContext.tsx
-var import_react22 = require("react");
+var import_react23 = require("react");
 
 // src/hooks/useMatchEvents.ts
 var import_react6 = require("react");
@@ -1950,11 +1950,11 @@ var useStore_default = useStore;
 // src/hooks/useWallet.tsx
 var import_accounts = require("viem/accounts");
 var import_viem3 = require("viem");
-var import_react11 = require("react");
+var import_react12 = require("react");
 var import_viem4 = require("viem");
 
 // src/context/ModalContext.tsx
-var import_react10 = __toESM(require("react"));
+var import_react11 = __toESM(require("react"));
 var import_react_dom = require("react-dom");
 
 // src/ui/Drawer/index.tsx
@@ -2147,7 +2147,7 @@ function HashPanel({
           /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("div", { className: `matchid-hashpanel-status`, style: {
             color: statusValue.color
           }, children: statusValue.text }),
-          statusValue.lottie ? /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(Lottie, { animationData: statusValue.lottie, style: {
+          statusValue.lottie ? /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(Lottie_default, { animationData: statusValue.lottie, style: {
             width: "96px",
             height: "96px"
           } }) : /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("img", { src: statusValue.icon, alt: statusValue.text, className: `matchid-hashpanel-img` }),
@@ -2256,20 +2256,25 @@ var import_jsx_runtime65 = require("react/jsx-runtime");
 var import_jsx_runtime66 = require("react/jsx-runtime");
 
 // src/ui/Lottie/index.tsx
-var import_lottie_react = __toESM(require("lottie-react"));
+var import_react10 = require("react");
 var import_jsx_runtime67 = require("react/jsx-runtime");
-function Lottie(props) {
-  console.log("Lottie", props);
-  const result = /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(import_lottie_react.default, { loop: true, autoplay: true, ...props });
-  console.log("result", result);
-  return result;
-}
+var LazyLottie = (props) => {
+  const [LottieReact, setLottieReact] = (0, import_react10.useState)(null);
+  (0, import_react10.useEffect)(() => {
+    import("lottie-react").then((mod) => {
+      setLottieReact(mod.default || mod);
+    });
+  }, []);
+  if (!LottieReact) return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { children: "Loading..." });
+  return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(LottieReact, { loop: true, autoplay: true, ...props });
+};
+var Lottie_default = LazyLottie;
 
 // src/context/ModalContext.tsx
 var import_jsx_runtime68 = require("react/jsx-runtime");
-var ModalContext = (0, import_react10.createContext)(null);
+var ModalContext = (0, import_react11.createContext)(null);
 function useModal() {
-  const context = (0, import_react10.useContext)(ModalContext);
+  const context = (0, import_react11.useContext)(ModalContext);
   if (!context) {
     throw new Error("useModal must be used within a ModalProvider");
   }
@@ -2358,7 +2363,7 @@ function useWallet() {
       throw error;
     }
   };
-  const evmAccount = (0, import_react11.useMemo)(() => {
+  const evmAccount = (0, import_react12.useMemo)(() => {
     try {
       return address ? (0, import_accounts.toAccount)({
         address,
@@ -2397,7 +2402,7 @@ function useWallet() {
       return void 0;
     }
   }, [address]);
-  (0, import_react11.useEffect)(() => {
+  (0, import_react12.useEffect)(() => {
     matchlog_default.log("qwe-evmAccount", evmAccount);
   }, [evmAccount]);
   const realCreateWalletClient = (parameters) => {
@@ -2540,14 +2545,14 @@ function useWallet() {
 
 // src/hooks/useCopyClipboard.ts
 var import_copy_to_clipboard = __toESM(require("copy-to-clipboard"));
-var import_react12 = require("react");
+var import_react13 = require("react");
 function useCopyClipboard(timeout = 500) {
-  const [isCopied, setIsCopied] = (0, import_react12.useState)(false);
-  const staticCopy = (0, import_react12.useCallback)((text) => {
+  const [isCopied, setIsCopied] = (0, import_react13.useState)(false);
+  const staticCopy = (0, import_react13.useCallback)((text) => {
     const didCopy = (0, import_copy_to_clipboard.default)(text);
     setIsCopied(didCopy);
   }, []);
-  (0, import_react12.useEffect)(() => {
+  (0, import_react13.useEffect)(() => {
     if (isCopied) {
       const hide = setTimeout(() => {
         setIsCopied(false);
@@ -2562,10 +2567,10 @@ function useCopyClipboard(timeout = 500) {
 }
 
 // src/context/ToastContext.tsx
-var import_react13 = require("react");
+var import_react14 = require("react");
 var import_react_dom2 = require("react-dom");
 var import_jsx_runtime70 = require("react/jsx-runtime");
-var ToastContext = (0, import_react13.createContext)(null);
+var ToastContext = (0, import_react14.createContext)(null);
 
 // src/hooks/api/wallet.ts
 var import_react_query2 = require("@tanstack/react-query");
@@ -2623,7 +2628,7 @@ function useImportTokenListQuery({
 }
 
 // src/hooks/useMatchChain.tsx
-var import_react14 = require("react");
+var import_react15 = require("react");
 var import_viem5 = require("viem");
 var import_react_intl3 = require("react-intl");
 var import_jsx_runtime71 = require("react/jsx-runtime");
@@ -2632,7 +2637,7 @@ function useMatchChain() {
   const modal = useModal();
   const intl = (0, import_react_intl3.useIntl)();
   const { chainId: storeChainId, setChainId } = useLocalStore_default();
-  const chainId = (0, import_react14.useMemo)(() => {
+  const chainId = (0, import_react15.useMemo)(() => {
     if (!chainListQuery.data || !chainListQuery.data.length) {
       return null;
     }
@@ -2641,7 +2646,7 @@ function useMatchChain() {
     }
     return chainListQuery.data[0].id;
   }, [storeChainId, chainListQuery.data]);
-  const chain = (0, import_react14.useMemo)(() => {
+  const chain = (0, import_react15.useMemo)(() => {
     if (!chainListQuery.data || !chainListQuery.data.length) {
       return null;
     }
@@ -2655,7 +2660,7 @@ function useMatchChain() {
     close
   }) {
     const { chainId: storeChainId2, setChainId: setChainId2 } = useLocalStore_default();
-    const [selectedChainId, setSelectedChainId] = (0, import_react14.useState)(storeChainId2);
+    const [selectedChainId, setSelectedChainId] = (0, import_react15.useState)(storeChainId2);
     const isDownMd = useDownMd();
     return /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: `matchid-change-network-box`, children: [
       /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: `matchid-change-network-list`, children: chainListQuery.data?.map((item, index) => {
@@ -2687,7 +2692,7 @@ function useMatchChain() {
       content: ChangeNetwork
     });
   };
-  const publicClient = (0, import_react14.useMemo)(() => {
+  const publicClient = (0, import_react15.useMemo)(() => {
     if (!chain) {
       return null;
     }
@@ -2715,7 +2720,7 @@ function useMatchChain() {
 
 // src/hooks/useMatchWallet.tsx
 var import_react_qrcode = require("react-qrcode");
-var import_react16 = require("react");
+var import_react17 = require("react");
 var import_react_query5 = require("@tanstack/react-query");
 
 // src/config/index.tsx
@@ -2786,7 +2791,7 @@ var useContractStore_default = useContractStore;
 var import_react_intl5 = require("react-intl");
 
 // src/components/ImportToken/index.tsx
-var import_react15 = require("react");
+var import_react16 = require("react");
 var import_react_intl4 = require("react-intl");
 var import_react_query4 = require("@tanstack/react-query");
 var import_viem7 = require("viem");
@@ -2801,12 +2806,12 @@ var import_jsx_runtime72 = require("react/jsx-runtime");
 // src/hooks/useMatchWallet.tsx
 var import_jsx_runtime73 = require("react/jsx-runtime");
 function useMatchWalletRecords() {
-  const [hasMore, setHasMore] = (0, import_react16.useState)(true);
-  const [items, setItems] = (0, import_react16.useState)([]);
+  const [hasMore, setHasMore] = (0, import_react17.useState)(true);
+  const [items, setItems] = (0, import_react17.useState)([]);
   const { chainId, publicClient } = useMatchChain();
   const { address } = useWallet();
-  const hasMoreRef = (0, import_react16.useRef)(hasMore);
-  const nextPageParamsRef = (0, import_react16.useRef)(void 0);
+  const hasMoreRef = (0, import_react17.useRef)(hasMore);
+  const nextPageParamsRef = (0, import_react17.useRef)(void 0);
   const { contracts, setContracts } = useContractStore_default();
   const fetchMoreData = async () => {
     const chainIdStr = chainId ? chainId.toString() : "";
@@ -2833,7 +2838,7 @@ function useMatchWalletRecords() {
     hasMoreRef.current = true;
     fetchMoreData();
   };
-  (0, import_react16.useEffect)(() => {
+  (0, import_react17.useEffect)(() => {
     if (chainId && address) {
       onInit();
     }
@@ -2889,7 +2894,7 @@ function useMatchWalletRecords() {
       setContracts(contractMap);
     }
   };
-  const list = (0, import_react16.useMemo)(() => {
+  const list = (0, import_react17.useMemo)(() => {
     const localTransactions = transactions[`${chainId}-${address}`] || [];
     const removeList = localTransactions.filter((n) => items.findIndex((m) => m.hash == n.hash) >= 0);
     removeList.forEach((item) => {
@@ -2931,7 +2936,7 @@ function useMatchWalletAssets({
     chainId: chainId || 0,
     ...assetListOptions
   });
-  const mergedAssets = (0, import_react16.useMemo)(() => {
+  const mergedAssets = (0, import_react17.useMemo)(() => {
     if (!assetListQuery.data && !importTokenQuery.data) return [];
     const assetList = (assetListQuery.data || []).map((asset) => ({
       ...asset,
@@ -3018,7 +3023,7 @@ function useMatchWalletAssetList({
     retry: 3
     // Retry up to 3 times if failed
   });
-  const erc20Tokens = (0, import_react16.useMemo)(() => list.filter((asset) => asset.address !== NATIVE_TOKEN_ADDRESS), [list]);
+  const erc20Tokens = (0, import_react17.useMemo)(() => list.filter((asset) => asset.address !== NATIVE_TOKEN_ADDRESS), [list]);
   const erc20BalanceQuery = (0, import_react_query5.useQuery)({
     queryKey: ["erc20Balances", erc20Tokens.map((token) => token.address)],
     queryFn: async () => {
@@ -3046,7 +3051,7 @@ function useMatchWalletAssetList({
     // Refresh every 15 seconds
     retry: 3
   });
-  const enrichedAssets = (0, import_react16.useMemo)(() => {
+  const enrichedAssets = (0, import_react17.useMemo)(() => {
     if (!list) return [];
     const erc20Balances = erc20BalanceQuery.data || [];
     return list.map((asset) => {
@@ -3068,7 +3073,7 @@ function useMatchWalletAssetList({
       return { ...asset, balance, value, balanceValue };
     });
   }, [list, nativeBalanceQuery.data, erc20BalanceQuery.data]);
-  (0, import_react16.useEffect)(() => {
+  (0, import_react17.useEffect)(() => {
     const list2 = enrichedAssets.sort((a, b) => {
       if (a.address === NATIVE_TOKEN_ADDRESS) return -1;
       if (b.address === NATIVE_TOKEN_ADDRESS) return 1;
@@ -3093,13 +3098,13 @@ function useMatchWalletAssetList({
 }
 
 // src/hooks/useReceipt.tsx
-var import_react17 = require("react");
+var import_react18 = require("react");
 var import_react_query6 = require("@tanstack/react-query");
 var import_viem9 = require("viem");
 var CACHE_TTL = 86400 * 30 * 1e3;
 
 // src/hooks/useTransaction.tsx
-var import_react18 = require("react");
+var import_react19 = require("react");
 var import_react_query7 = require("@tanstack/react-query");
 var import_viem10 = require("viem");
 var CACHE_TTL2 = 86400 * 30 * 1e3;
@@ -3190,7 +3195,7 @@ var useWalletModalStore = (0, import_zustand5.create)((set) => ({
 }));
 
 // src/components/CEXBindModal/index.tsx
-var import_react19 = require("react");
+var import_react20 = require("react");
 var import_react_intl6 = require("react-intl");
 var import_jsx_runtime75 = require("react/jsx-runtime");
 
@@ -3202,11 +3207,11 @@ var import_jsx_runtime76 = require("react/jsx-runtime");
 var import_jsx_runtime77 = require("react/jsx-runtime");
 
 // src/hooks/useWalletInit.ts
-var import_react20 = require("react");
+var import_react21 = require("react");
 var AppClientId2 = getAppClientId();
 
 // src/hooks/useInit.tsx
-var import_react21 = require("react");
+var import_react22 = require("react");
 
 // src/MatchContext.tsx
 var import_react_query9 = require("@tanstack/react-query");
@@ -3298,9 +3303,9 @@ var wagmiConfig = (0, import_rainbowkit.getDefaultConfig)({
   ],
   chains: [import_chains.mainnet, import_chains.polygon, import_chains.optimism, import_chains.arbitrum, import_chains.base, matchMain, matchTest, import_chains.bsc]
 });
-var MatchContext = (0, import_react22.createContext)(void 0);
+var MatchContext = (0, import_react23.createContext)(void 0);
 var useMatch = () => {
-  const context = (0, import_react22.useContext)(MatchContext);
+  const context = (0, import_react23.useContext)(MatchContext);
   if (context === void 0) {
     throw new Error("useMatch must be used within a MatchProvider");
   }
@@ -3334,7 +3339,7 @@ function useUserInfo() {
   const getRedirectUri = () => {
     return encodeURIComponent(window.location.href);
   };
-  const isLogin = (0, import_react23.useMemo)(() => !!token && !!overview, [token, overview]);
+  const isLogin = (0, import_react24.useMemo)(() => !!token && !!overview, [token, overview]);
   const logout = async () => {
     try {
       await toLogoutApi();
@@ -3605,23 +3610,23 @@ function useUserInfo() {
 }
 
 // src/components/EmailModal/StepVerify.tsx
-var import_react24 = require("react");
+var import_react25 = require("react");
 var import_react_intl8 = require("react-intl");
 var import_jsx_runtime79 = require("react/jsx-runtime");
 function StepVerify(props) {
   const intl = (0, import_react_intl8.useIntl)();
   const { getLoginEmailCode, loginByEmail } = useUserInfo();
-  const [error, setError] = (0, import_react24.useState)("");
-  const [code, setCode] = (0, import_react24.useState)("");
-  const [sending, setSending] = (0, import_react24.useState)(false);
-  const [submitting, setSubmitting] = (0, import_react24.useState)(false);
-  const sendTimeRef = (0, import_react24.useRef)(0);
-  const [sendBtnText, setSendBtnText] = (0, import_react24.useState)(intl.formatMessage({
+  const [error, setError] = (0, import_react25.useState)("");
+  const [code, setCode] = (0, import_react25.useState)("");
+  const [sending, setSending] = (0, import_react25.useState)(false);
+  const [submitting, setSubmitting] = (0, import_react25.useState)(false);
+  const sendTimeRef = (0, import_react25.useRef)(0);
+  const [sendBtnText, setSendBtnText] = (0, import_react25.useState)(intl.formatMessage({
     id: "send"
   }));
   const intervalTime = EMAIL_INTERVAL;
   const codeLength = EMAIL_CODE_LENGTH;
-  const intervalRef = (0, import_react24.useRef)(null);
+  const intervalRef = (0, import_react25.useRef)(null);
   const isDownMd = useDownMd();
   const onSend = async () => {
     if (sendTimeRef.current > 0) {
@@ -3652,7 +3657,7 @@ function StepVerify(props) {
       setSending(false);
     }
   };
-  (0, import_react24.useEffect)(() => {
+  (0, import_react25.useEffect)(() => {
     onSend();
     return () => {
       if (intervalRef.current) {
@@ -3660,7 +3665,7 @@ function StepVerify(props) {
       }
     };
   }, []);
-  const canContinue = (0, import_react24.useMemo)(() => {
+  const canContinue = (0, import_react25.useMemo)(() => {
     return code.length === codeLength;
   }, [code]);
   const onContinue = async () => {
@@ -3737,10 +3742,10 @@ function EmailModal({
   onBack,
   onLogin
 }) {
-  const [step, setStep] = (0, import_react25.useState)("input");
-  const [emailVal, setEmailVal] = (0, import_react25.useState)("");
+  const [step, setStep] = (0, import_react26.useState)("input");
+  const [emailVal, setEmailVal] = (0, import_react26.useState)("");
   const intl = (0, import_react_intl9.useIntl)();
-  (0, import_react25.useEffect)(() => {
+  (0, import_react26.useEffect)(() => {
     if (!isOpen) {
       setStep("input");
       setEmailVal("");
@@ -3765,7 +3770,7 @@ function EmailModal({
 }
 
 // src/components/LoginBox/index.tsx
-var import_react26 = require("react");
+var import_react27 = require("react");
 var import_react_intl10 = require("react-intl");
 
 // src/hooks/useAppConfig.ts
@@ -3836,7 +3841,7 @@ function LoginBox({
   inModal = false
 }) {
   const config = useAppConfig();
-  const methodConfig = (0, import_react26.useMemo)(() => {
+  const methodConfig = (0, import_react27.useMemo)(() => {
     if (recommendMethods || methods || walletMethods) {
       return {
         recommendMethods: recommendMethods ? recommendMethods : walletMethods ? ["wallet"] : [],
@@ -3878,9 +3883,9 @@ function LoginBox({
       walletMethods: walletMethodList
     };
   }, [config.platform, recommendMethods, methods, walletMethods]);
-  const [emailOpen, setEmailOpen] = (0, import_react26.useState)(false);
+  const [emailOpen, setEmailOpen] = (0, import_react27.useState)(false);
   const { login } = useUserInfo();
-  const [showWallet, setShowWallet] = (0, import_react26.useState)(false);
+  const [showWallet, setShowWallet] = (0, import_react27.useState)(false);
   const intl = (0, import_react_intl10.useIntl)();
   const isDownMd = useDownMd();
   const methodMap = {
@@ -4028,7 +4033,7 @@ function LoginBox({
 }
 
 // src/components/LoginButton/index.tsx
-var import_react28 = require("react");
+var import_react29 = require("react");
 
 // src/components/LoginPanel/index.tsx
 var import_react_intl11 = require("react-intl");
@@ -4071,7 +4076,7 @@ function LoginModal({
 }
 
 // src/components/UserPopover/index.tsx
-var import_react27 = require("react");
+var import_react28 = require("react");
 
 // src/assets/icon/ProfileIcon.tsx
 var import_jsx_runtime84 = require("react/jsx-runtime");
@@ -4103,7 +4108,7 @@ var import_react_intl12 = require("react-intl");
 var import_jsx_runtime85 = require("react/jsx-runtime");
 function UserContent() {
   const { logout, address, username } = useUserInfo();
-  const [logouting, setLogouting] = (0, import_react27.useState)(false);
+  const [logouting, setLogouting] = (0, import_react28.useState)(false);
   const onLogout = async () => {
     if (logouting) return;
     try {
@@ -4132,7 +4137,7 @@ function UserContent() {
   const UserDivider = () => {
     return /* @__PURE__ */ (0, import_jsx_runtime85.jsx)("div", { className: `matchid-user-popover-divider` });
   };
-  const [usernameOpen, setUsernameOpen] = (0, import_react27.useState)(false);
+  const [usernameOpen, setUsernameOpen] = (0, import_react28.useState)(false);
   const [copied, setCopied] = useCopyClipboard();
   const intl = (0, import_react_intl12.useIntl)();
   return /* @__PURE__ */ (0, import_jsx_runtime85.jsxs)("div", { className: "matchid-user-popover-content", children: [
@@ -4178,7 +4183,7 @@ function LoginButton({
 }) {
   const intl = (0, import_react_intl13.useIntl)();
   const { isLogin, username } = useUserInfo();
-  const [loginOpen, setLoginOpen] = (0, import_react28.useState)(false);
+  const [loginOpen, setLoginOpen] = (0, import_react29.useState)(false);
   if (!isLogin) {
     return /* @__PURE__ */ (0, import_jsx_runtime86.jsxs)(import_jsx_runtime86.Fragment, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(
@@ -4206,7 +4211,7 @@ function LoginButton({
 }
 
 // src/components/UsernameModal/index.tsx
-var import_react29 = require("react");
+var import_react30 = require("react");
 var import_react_intl14 = require("react-intl");
 var import_jsx_runtime87 = require("react/jsx-runtime");
 var ValidItem = ({
@@ -4227,23 +4232,23 @@ function UsernameModal({
 }) {
   const { username, refreshOverview } = useUserInfo();
   const { isLogin } = useUserInfo();
-  const [val, setVal] = (0, import_react29.useState)(username);
-  const [error, setError] = (0, import_react29.useState)("");
+  const [val, setVal] = (0, import_react30.useState)(username);
+  const [error, setError] = (0, import_react30.useState)("");
   const isDownMd = useDownMd();
-  (0, import_react29.useEffect)(() => {
+  (0, import_react30.useEffect)(() => {
     if (isOpen) {
       setVal(username);
       setError("");
     }
   }, [isOpen]);
-  const isValid = (0, import_react29.useMemo)(() => {
+  const isValid = (0, import_react30.useMemo)(() => {
     return isValidUsername(val);
   }, [val]);
-  const isLength = (0, import_react29.useMemo)(() => {
+  const isLength = (0, import_react30.useMemo)(() => {
     return val.length >= 2 && val.length <= 32;
   }, [val]);
   const isSafe = isValid && isLength;
-  const [isSubmitting, setIsSubmitting] = (0, import_react29.useState)(false);
+  const [isSubmitting, setIsSubmitting] = (0, import_react30.useState)(false);
   const onSubmit = async () => {
     if (isSubmitting) return;
     try {
@@ -4306,11 +4311,11 @@ function UsernameModal({
 }
 
 // src/components/EVMModal/index.tsx
-var import_react32 = require("react");
+var import_react33 = require("react");
 var import_react_intl15 = require("react-intl");
 
 // src/components/WalletModalContent/index.tsx
-var import_react30 = require("react");
+var import_react31 = require("react");
 
 // src/assets/wallet.ts
 var walletErrorImage = error_default;
@@ -4331,7 +4336,7 @@ function WalletModalContent({
   address,
   connected
 }) {
-  const pageData = (0, import_react30.useMemo)(() => {
+  const pageData = (0, import_react31.useMemo)(() => {
     if (status == "success") {
       return {
         btnText: "Disconnect Wallet",
@@ -4392,7 +4397,7 @@ function WalletModalContent({
   }, [visible, connected, status, error, address]);
   return /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("div", { className: "matchid-wallet-container", children: /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)("div", { className: `matchid-wallet-box`, children: [
     /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)("div", { className: `matchid-wallet-content`, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(Lottie, { animationData: pageData.statusImage, style: {
+      /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(Lottie_default, { animationData: pageData.statusImage, style: {
         width: 128,
         height: 128
       } }),
@@ -4412,8 +4417,8 @@ function WalletModalContent({
   ] }) });
 }
 function WalletModalContentV2(props) {
-  const [submitting, setSubmitting] = (0, import_react30.useState)(false);
-  const pageData = (0, import_react30.useMemo)(() => {
+  const [submitting, setSubmitting] = (0, import_react31.useState)(false);
+  const pageData = (0, import_react31.useMemo)(() => {
     const { status } = props;
     if (status == "success") {
       return {
@@ -4476,7 +4481,7 @@ function WalletModalContentV2(props) {
   }, [props, submitting]);
   return /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("div", { className: "matchid-wallet-container", children: /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)("div", { className: `matchid-wallet-box`, children: [
     /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)("div", { className: `matchid-wallet-content`, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(Lottie, { animationData: pageData.statusImage, style: {
+      /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(Lottie_default, { animationData: pageData.statusImage, style: {
         width: 128,
         height: 128
       } }),
@@ -4501,14 +4506,14 @@ var import_rainbowkit2 = require("@rainbow-me/rainbowkit");
 var import_wagmi3 = require("wagmi");
 
 // src/hooks/useWalletBox.ts
-var import_react31 = require("react");
+var import_react32 = require("react");
 function useWalletBox({
   onInit
 }) {
-  const [status, setStateStatus] = (0, import_react31.useState)("start");
-  const [error, setError] = (0, import_react31.useState)("");
-  const statusRef = (0, import_react31.useRef)(status);
-  const [nonce, setNonce] = (0, import_react31.useState)();
+  const [status, setStateStatus] = (0, import_react32.useState)("start");
+  const [error, setError] = (0, import_react32.useState)("");
+  const statusRef = (0, import_react32.useRef)(status);
+  const [nonce, setNonce] = (0, import_react32.useState)();
   const setStatus = (status2) => {
     statusRef.current = status2;
     setStateStatus(status2);
@@ -4517,7 +4522,7 @@ function useWalletBox({
     setError("");
     setNonce(null);
   };
-  (0, import_react31.useEffect)(() => {
+  (0, import_react32.useEffect)(() => {
     init();
     onInit({
       setStatus
@@ -4775,16 +4780,16 @@ function WalletContent({
   const { disconnectAsync } = (0, import_wagmi3.useDisconnect)({ config });
   const chainId = (0, import_wagmi3.useChainId)();
   const { events, login } = useMatch();
-  const [inited, setInited] = (0, import_react32.useState)(false);
+  const [inited, setInited] = (0, import_react33.useState)(false);
   const { status, setStatus, error, setError, statusRef, nonce, setNonce, init } = useWalletBox({
     onInit: async ({ setStatus: setStatus2 }) => {
       setStatus2("start");
     }
   });
-  (0, import_react32.useEffect)(() => {
+  (0, import_react33.useEffect)(() => {
     matchlog_default.log(`status=${status}`, `connectModalOpen=${connectModalOpen}`, `address=${address}`, `isConnected=${isConnected}`);
   }, [status, connectModalOpen, isConnected, address]);
-  (0, import_react32.useEffect)(() => {
+  (0, import_react33.useEffect)(() => {
     if (connectModalOpen) {
       setStatus("connecting");
       return;
@@ -4797,7 +4802,7 @@ function WalletContent({
       setStatus("start");
     }
   }, [connectModalOpen, address]);
-  (0, import_react32.useEffect)(() => {
+  (0, import_react33.useEffect)(() => {
     if (openConnectModal && !isConnected && !inited) {
       openConnectModal && openConnectModal();
       setInited(true);
@@ -4824,7 +4829,7 @@ function WalletContent({
       setError(error2.message);
     }
   };
-  const signature = (0, import_react32.useCallback)(async () => {
+  const signature = (0, import_react33.useCallback)(async () => {
     if (!nonce || status != "nonce") {
       return;
     }
@@ -4880,7 +4885,7 @@ function WalletContent({
       setError(error2.reason || error2.message);
     }
   }, [nonce, status, address]);
-  (0, import_react32.useEffect)(() => {
+  (0, import_react33.useEffect)(() => {
     if (signature) {
       signature();
     }
@@ -4951,7 +4956,7 @@ function EVMModal(props) {
 }
 
 // src/components/TRONModal/index.tsx
-var import_react34 = __toESM(require("react"));
+var import_react35 = __toESM(require("react"));
 var import_react_intl16 = require("react-intl");
 
 // src/lib/tron/TronLinkAdapter.ts
@@ -4985,7 +4990,7 @@ var TronLinkAdapter = class {
 };
 
 // src/hooks/useTRONWallet.ts
-var import_react33 = require("react");
+var import_react34 = require("react");
 
 // src/lib/tron/BitgetAdapter.ts
 var BitgetAdapter = class {
@@ -5030,9 +5035,9 @@ var OKXAdapter = class {
 // src/hooks/useTRONWallet.ts
 var useTRONWallet = () => {
   const wallets = [new TronLinkAdapter(), new BitgetAdapter(), new OKXAdapter()];
-  const [installedWallets, setInstalledWallets] = (0, import_react33.useState)([]);
-  const [address, setAddress] = (0, import_react33.useState)(null);
-  (0, import_react33.useEffect)(() => {
+  const [installedWallets, setInstalledWallets] = (0, import_react34.useState)([]);
+  const [address, setAddress] = (0, import_react34.useState)(null);
+  (0, import_react34.useEffect)(() => {
     const getInstalled = async () => {
       const installed = await Promise.all(wallets.map((wallet2) => wallet2.isInstalled().then((isInstalled) => ({
         wallet: wallet2,
@@ -5042,11 +5047,11 @@ var useTRONWallet = () => {
     };
     getInstalled();
   }, []);
-  const [wallet, chooseWallet] = (0, import_react33.useState)(null);
+  const [wallet, chooseWallet] = (0, import_react34.useState)(null);
   const onConnect = async () => {
     setAddress(await wallet.connect());
   };
-  (0, import_react33.useEffect)(() => {
+  (0, import_react34.useEffect)(() => {
     if (!wallet) {
       setAddress(null);
     }
@@ -5077,10 +5082,10 @@ function TRONConnectModal({
     okx: /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(OKXIcon, { size: isDownMd ? 36 : 40 })
   };
   const { events, login } = useMatch();
-  const [status, setStatus] = (0, import_react34.useState)("");
-  const statusRef = import_react34.default.useRef(status);
-  const [error, setError] = (0, import_react34.useState)("");
-  const connected = (0, import_react34.useMemo)(() => {
+  const [status, setStatus] = (0, import_react35.useState)("");
+  const statusRef = import_react35.default.useRef(status);
+  const [error, setError] = (0, import_react35.useState)("");
+  const connected = (0, import_react35.useMemo)(() => {
     return !!address;
   }, [address]);
   const disconnect = async () => {
@@ -5148,7 +5153,7 @@ function TRONConnectModal({
       statusRef.current = "";
     }
   };
-  (0, import_react34.useEffect)(() => {
+  (0, import_react35.useEffect)(() => {
     if (wallet) {
       console.log("onConnect");
       onConnect();
@@ -5156,12 +5161,12 @@ function TRONConnectModal({
       setStatus("");
     }
   }, [wallet]);
-  (0, import_react34.useEffect)(() => {
+  (0, import_react35.useEffect)(() => {
     if (address) {
       toLoginInWallet();
     }
   }, [address]);
-  (0, import_react34.useEffect)(() => {
+  (0, import_react35.useEffect)(() => {
     if (!props.isOpen) {
       disconnect();
     }
@@ -5219,7 +5224,7 @@ function TRONModal(props) {
 }
 
 // src/components/TONModal/index.tsx
-var import_react35 = __toESM(require("react"));
+var import_react36 = __toESM(require("react"));
 var import_react_intl17 = require("react-intl");
 var import_ui_react = require("@tonconnect/ui-react");
 var import_jsx_runtime91 = require("react/jsx-runtime");
@@ -5228,15 +5233,15 @@ function WalletContent2({
   type
 }) {
   const { events, login } = useMatch();
-  const [connected, setConnected] = (0, import_react35.useState)(false);
+  const [connected, setConnected] = (0, import_react36.useState)(false);
   const wallet = (0, import_ui_react.useTonWallet)();
   const userFriendlyAddress = (0, import_ui_react.useTonAddress)();
   const [tonConnectUI] = (0, import_ui_react.useTonConnectUI)();
   const { state, open, close } = (0, import_ui_react.useTonConnectModal)();
-  const [status, setStatus] = (0, import_react35.useState)("");
-  const statusRef = import_react35.default.useRef(status);
-  const [error, setError] = (0, import_react35.useState)("");
-  (0, import_react35.useEffect)(() => {
+  const [status, setStatus] = (0, import_react36.useState)("");
+  const statusRef = import_react36.default.useRef(status);
+  const [error, setError] = (0, import_react36.useState)("");
+  (0, import_react36.useEffect)(() => {
     const init = async () => {
       if (tonConnectUI.connected) {
         await tonConnectUI.disconnect();
@@ -5309,7 +5314,7 @@ function WalletContent2({
       }
     });
   }, []);
-  (0, import_react35.useEffect)(() => {
+  (0, import_react36.useEffect)(() => {
     if (wallet) {
       setConnected(true);
       console.log("Wallet connected:", wallet);
@@ -5320,7 +5325,7 @@ function WalletContent2({
       setStatus("");
     }
   }, [wallet]);
-  (0, import_react35.useEffect)(() => {
+  (0, import_react36.useEffect)(() => {
     console.log({
       state,
       wallet
@@ -5400,7 +5405,7 @@ function TONModal(props) {
 }
 
 // src/components/BTCModal/index.tsx
-var import_react37 = __toESM(require("react"));
+var import_react38 = __toESM(require("react"));
 var import_react_intl18 = require("react-intl");
 
 // src/lib/btc/UnisatAdapter.ts
@@ -5549,7 +5554,7 @@ var LeatherAdapter = class {
 };
 
 // src/hooks/useBTCWallet.ts
-var import_react36 = require("react");
+var import_react37 = require("react");
 
 // src/lib/btc/PhantomAdapter.ts
 var PhantomAdapter = class {
@@ -5587,9 +5592,9 @@ var PhantomAdapter = class {
 // src/hooks/useBTCWallet.ts
 var useBTCWallet = () => {
   const wallets = [new UnisatAdapter(), new XverseAdapter(), new LeatherAdapter(), new PhantomAdapter()];
-  const [installedWallets, setInstalledWallets] = (0, import_react36.useState)([]);
-  const [address, setAddress] = (0, import_react36.useState)(null);
-  (0, import_react36.useEffect)(() => {
+  const [installedWallets, setInstalledWallets] = (0, import_react37.useState)([]);
+  const [address, setAddress] = (0, import_react37.useState)(null);
+  (0, import_react37.useEffect)(() => {
     const getInstalled = async () => {
       const installed = await Promise.all(wallets.map((wallet2) => wallet2.isInstalled().then((isInstalled) => ({
         wallet: wallet2,
@@ -5599,11 +5604,11 @@ var useBTCWallet = () => {
     };
     getInstalled();
   }, []);
-  const [wallet, chooseWallet] = (0, import_react36.useState)(null);
+  const [wallet, chooseWallet] = (0, import_react37.useState)(null);
   const onConnect = async () => {
     setAddress(await wallet.connect());
   };
-  (0, import_react36.useEffect)(() => {
+  (0, import_react37.useEffect)(() => {
     if (!wallet) {
       setAddress(null);
     }
@@ -5635,10 +5640,10 @@ function BTCConnectModal({
     phantom: /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(PhantomIcon, { size: isDownMd ? 36 : 40 })
   };
   const { events, login } = useMatch();
-  const [status, setStatus] = (0, import_react37.useState)("");
-  const statusRef = import_react37.default.useRef(status);
-  const [error, setError] = (0, import_react37.useState)("");
-  const connected = (0, import_react37.useMemo)(() => {
+  const [status, setStatus] = (0, import_react38.useState)("");
+  const statusRef = import_react38.default.useRef(status);
+  const [error, setError] = (0, import_react38.useState)("");
+  const connected = (0, import_react38.useMemo)(() => {
     return !!address;
   }, [address]);
   const disconnect = async () => {
@@ -5702,7 +5707,7 @@ function BTCConnectModal({
       statusRef.current = "";
     }
   };
-  (0, import_react37.useEffect)(() => {
+  (0, import_react38.useEffect)(() => {
     if (wallet) {
       console.log("onConnect");
       try {
@@ -5715,12 +5720,12 @@ function BTCConnectModal({
       setStatus("");
     }
   }, [wallet]);
-  (0, import_react37.useEffect)(() => {
+  (0, import_react38.useEffect)(() => {
     if (address) {
       toLoginInWallet();
     }
   }, [address]);
-  (0, import_react37.useEffect)(() => {
+  (0, import_react38.useEffect)(() => {
     if (!props.isOpen) {
       disconnect();
     }
@@ -5785,7 +5790,7 @@ function BTCModal(props) {
 }
 
 // src/components/WalletModal/index.tsx
-var import_react38 = require("react");
+var import_react39 = require("react");
 var import_react_intl19 = require("react-intl");
 var import_jsx_runtime93 = require("react/jsx-runtime");
 function WalletConnectModal({
@@ -5797,7 +5802,7 @@ function WalletConnectModal({
   const { walletMap } = useWalletConfig();
   const { bind, login } = useUserInfo();
   const config = useAppConfig();
-  const methods = (0, import_react38.useMemo)(() => {
+  const methods = (0, import_react39.useMemo)(() => {
     if (_methods) return _methods;
     if (!config.platform) {
       return [];
@@ -5829,11 +5834,11 @@ function WalletModal(props) {
 }
 
 // src/components/AlphaAvatar/index.tsx
-var import_react39 = require("react");
+var import_react40 = require("react");
 var import_jsx_runtime94 = require("react/jsx-runtime");
 function AlphaAvatar2({ name, size = 40, className = "" }) {
-  const [avatar, setAvatar] = (0, import_react39.useState)(void 0);
-  (0, import_react39.useEffect)(() => {
+  const [avatar, setAvatar] = (0, import_react40.useState)(void 0);
+  (0, import_react40.useEffect)(() => {
     if (name) {
       const char = name[0].toUpperCase();
       setAvatar(char);
@@ -5930,7 +5935,7 @@ function WalletAsset({
 }
 
 // src/components/TokenSend/index.tsx
-var import_react40 = require("react");
+var import_react41 = require("react");
 var import_viem15 = require("viem");
 var import_react_intl20 = require("react-intl");
 var import_jsx_runtime96 = require("react/jsx-runtime");
@@ -5968,22 +5973,22 @@ function TokenSend({
   const intl = (0, import_react_intl20.useIntl)();
   const { createWalletClient: createWalletClient2 } = useWallet();
   const isNative = token.address.toLowerCase() == NATIVE_TOKEN_ADDRESS;
-  const chain = (0, import_react40.useMemo)(() => {
+  const chain = (0, import_react41.useMemo)(() => {
     return chainList?.find((m) => m.id.toString() === token.chain_id);
   }, [chainList, token.chain_id]);
-  const walletClient = (0, import_react40.useMemo)(() => {
+  const walletClient = (0, import_react41.useMemo)(() => {
     return createWalletClient2({
       // @ts-ignore
       chain: (0, import_viem15.defineChain)(chain),
       transport: (0, import_viem15.http)()
     });
   }, [chain]);
-  const [amount, setAmount] = (0, import_react40.useState)("");
-  const [address, setAddress] = (0, import_react40.useState)("");
-  const [loading, setLoading] = (0, import_react40.useState)(false);
-  const [sending, setSending] = (0, import_react40.useState)(false);
-  const [txError, setTxError] = (0, import_react40.useState)("");
-  const transaction = (0, import_react40.useMemo)(() => {
+  const [amount, setAmount] = (0, import_react41.useState)("");
+  const [address, setAddress] = (0, import_react41.useState)("");
+  const [loading, setLoading] = (0, import_react41.useState)(false);
+  const [sending, setSending] = (0, import_react41.useState)(false);
+  const [txError, setTxError] = (0, import_react41.useState)("");
+  const transaction = (0, import_react41.useMemo)(() => {
     const reg = /^0x[a-fA-F0-9]{40}$/;
     if (!amount || !address || !reg.test(address)) {
       return;
@@ -6014,7 +6019,7 @@ function TokenSend({
       setLoading(false);
     }
   };
-  const error = (0, import_react40.useMemo)(() => {
+  const error = (0, import_react41.useMemo)(() => {
     setTxError("");
     let amountError = "";
     let addressError = "";
@@ -6057,7 +6062,7 @@ function TokenSend({
       setAmount(value);
     }
   };
-  const canSend = (0, import_react40.useMemo)(() => {
+  const canSend = (0, import_react41.useMemo)(() => {
     return !error.amount && !error.address && amount && address;
   }, [error]);
   const onNext = async () => {
@@ -6067,7 +6072,7 @@ function TokenSend({
     }
     onClose();
   };
-  (0, import_react40.useEffect)(() => {
+  (0, import_react41.useEffect)(() => {
     const receiveMessage = (event) => {
       if (event.data) {
         if (event.data.source == "match-wallet") {
@@ -6199,7 +6204,7 @@ function TokenDetail({
 }
 
 // src/components/TokenSendList/index.tsx
-var import_react41 = require("react");
+var import_react42 = require("react");
 var import_react_intl22 = require("react-intl");
 var import_jsx_runtime98 = require("react/jsx-runtime");
 function TokenSendList({ close }) {
@@ -6209,7 +6214,7 @@ function TokenSendList({ close }) {
     list: walletAssets.mergedAssets
   });
   const { list } = useMatchChain();
-  const [checked, setChecked] = (0, import_react41.useState)();
+  const [checked, setChecked] = (0, import_react42.useState)();
   const modal = useModal();
   const onNext = () => {
     checked && modal.show((props) => {
@@ -6266,7 +6271,7 @@ function TokenSendList({ close }) {
 
 // src/components/TransactionList/index.tsx
 var import_react_infinite_scroll_component = __toESM(require("react-infinite-scroll-component"));
-var import_react42 = require("react");
+var import_react43 = require("react");
 var import_viem16 = require("viem");
 var import_viem17 = require("viem");
 var import_react_intl23 = require("react-intl");
@@ -6276,8 +6281,8 @@ var Item = ({ data }) => {
   const isOut = data.from.toLowerCase() == address.toLowerCase();
   const { chain, chainId, explorerLink, formatUnits: chainFormatUnits } = useMatchChain();
   const { contracts } = useContractStore_default();
-  const [shouldRefetch, setShouldRefetch] = (0, import_react42.useState)(true);
-  const transferType = (0, import_react42.useMemo)(() => {
+  const [shouldRefetch, setShouldRefetch] = (0, import_react43.useState)(true);
+  const transferType = (0, import_react43.useMemo)(() => {
     const methodId = data.input.substring(2, 10);
     if (methodId == "095ea7b3") {
       return "erc20_approve";
@@ -6287,7 +6292,7 @@ var Item = ({ data }) => {
     }
     return "unknown";
   }, [data.input]);
-  const to = (0, import_react42.useMemo)(() => {
+  const to = (0, import_react43.useMemo)(() => {
     if (!isOut) {
       return data.from;
     }
@@ -6300,7 +6305,7 @@ var Item = ({ data }) => {
     }
     return data.to;
   }, [data.input, transferType, data.to, isOut]);
-  const amount = (0, import_react42.useMemo)(() => {
+  const amount = (0, import_react43.useMemo)(() => {
     if (transferType == "erc20_transfer") {
       const decodeData = (0, import_viem16.decodeFunctionData)({
         abi: import_viem17.erc20Abi,
@@ -6318,7 +6323,7 @@ var Item = ({ data }) => {
     refetchInterval: shouldRefetch ? 3e3 : false,
     enabled: shouldRefetch && data.source == "local"
   });
-  const status = (0, import_react42.useMemo)(() => {
+  const status = (0, import_react43.useMemo)(() => {
     if (data.source == "matchain") {
       switch (data.extra.status) {
         case "ok":
@@ -6345,12 +6350,12 @@ var Item = ({ data }) => {
     }
     return "loading";
   }, [data.extra?.status, data.source, hashQuery.data]);
-  (0, import_react42.useEffect)(() => {
+  (0, import_react43.useEffect)(() => {
     if (data.hash) {
       setShouldRefetch(status == "loading");
     }
   }, [status, data.hash]);
-  const symbol = (0, import_react42.useMemo)(() => {
+  const symbol = (0, import_react43.useMemo)(() => {
     if (transferType == "erc20_transfer") {
       const contract = contracts[`${chainId}-${data.to.toLowerCase()}`];
       return contract?.symbol || contract?.name || "unknown";