@rash2x/bridge-widget 0.7.6 → 0.7.8

package/dist/{index-CbuEGPY8.cjs → index-bZ0S5sNd.cjs}

@@ -3,7 +3,7 @@ var __defProp = Object.defineProperty;
 var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
 var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
 const jsxRuntime = require("react/jsx-runtime");
-const react = require("react");
+const React = require("react");
 const reactI18next = require("react-i18next");
 const i18n = require("i18next");
 const button = require("@/components/ui/button");
@@ -32,6 +32,23 @@ const tronwalletAdapters = require("@tronweb3/tronwallet-adapters");
 const tronweb = require("tronweb");
 const card = require("@/components/ui/card");
 const reactWindow = require("react-window");
+function _interopNamespaceDefault(e2) {
+  const n3 = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
+  if (e2) {
+    for (const k2 in e2) {
+      if (k2 !== "default") {
+        const d3 = Object.getOwnPropertyDescriptor(e2, k2);
+        Object.defineProperty(n3, k2, d3.get ? d3 : {
+          enumerable: true,
+          get: () => e2[k2]
+        });
+      }
+    }
+  }
+  n3.default = e2;
+  return Object.freeze(n3);
+}
+const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
 const common$1 = { "connecting": "Connecting…", "initializing": "Initializing...", "loading": "Loading...", "paste": "paste", "close": "Close", "zeroPlaceholder": "0", "nativeToken": "Native Token" };
 const wallets$1 = { "addTonWallet": "Add TON wallet", "addEvmWallet": "Add EVM wallet", "connectTonWallet": "Connect TON wallet", "connectEvmWallet": "Connect EVM wallet", "initializingMetamask": "Initializing MetaMask SDK...", "initializingTronlink": "Initializing TronLink...", "failedToConnectTon": "Failed to connect to TON wallet", "failedToDisconnect": "Failed to disconnect", "metamaskConnectionError": "MetaMask connection error", "failedToConnectMetamask": "Failed to connect to MetaMask", "failedToDisconnectMetamask": "Failed to disconnect from MetaMask", "selectWallet": "Select Wallet", "tonWallets": "TON", "evmWallets": "EVM", "tronWallets": "TRON", "tonconnect": "TonConnect", "metaMask": "WalletConnect", "walletConnect": "WalletConnect", "tronLink": "TronLink", "addTronWallet": "Add Tron wallet", "comingSoon": "Coming Soon", "connected": "CONNECTED", "connectedStatus": "Connected", "disconnect": "Disconnect", "chooseWallet": "Connect wallet", "oneWalletPerEnv": "You can only connect one wallet per environment.", "connect": "Connect", "connectTronWallet": "Connect Tron wallet", "connectWallet": "Connect wallet" };
 const bridge$1 = { "max": "Max", "sourceNetwork": "Source network", "destinationNetwork": "Destination network", "selectToken": "Select token", "selectNetwork": "Select network", "selectSourceNetwork": "Select source network", "selectDestinationNetwork": "Select destination network", "searchToken": "Search token", "myTokens": "My tokens", "allTokens": "All tokens", "search": "Search", "select": "Select", "willChangeSourceChain": "Will change source network", "willChangeDestinationChain": "Will change destination network", "willChangeBothChains": "Will change both networks", "willChangeSourceNetworkAndToken": "Will change source token", "noBalancesFound": "No balances found.", "noResults": "No results", "tokenNotFound": "We couldn't find a token with that name or symbol. Please try again.", "chainNotFound": "We couldn't find a chain with that name. Please try again.", "sendToAnotherAddress": "Send to another address", "youWillReceive": "You will receive", "anotherAddressPlaceholder": "Address", "addressDoesntMatch": "Address doesn't match the {{network}} network", "checkBeforeTransfer": "Check correctness before transfer" };
@@ -95,7 +112,7 @@ function BridgeI18nProvider({
   children,
   defaultLanguage = "en"
 }) {
-  react.useEffect(() => {
+  React.useEffect(() => {
     if (bridgeI18n.language !== defaultLanguage) {
       bridgeI18n.changeLanguage(defaultLanguage);
     }
@@ -507,9 +524,9 @@ const ExitIcon = (props) => {
   );
 };
 const SwapButton = ({ canSwap, onSwap }) => {
-  const [turns, setTurns] = react.useState(0);
-  const [isSwapping, setIsSwapping] = react.useState(false);
-  const handleSwap = react.useCallback(() => {
+  const [turns, setTurns] = React.useState(0);
+  const [isSwapping, setIsSwapping] = React.useState(false);
+  const handleSwap = React.useCallback(() => {
     if (!canSwap || isSwapping) return;
     setIsSwapping(true);
     setTurns((t2) => t2 + 1);
@@ -585,7 +602,7 @@ const SelectNetworkButton = ({
   network
 }) => {
   const { t: t2 } = useBridgeTranslation();
-  const label = react.useMemo(() => {
+  const label = React.useMemo(() => {
     return network?.name ?? t2("bridge.selectNetwork");
   }, [network, t2]);
   return /* @__PURE__ */ jsxRuntime.jsxs(
@@ -626,7 +643,7 @@ const normalizeValue = (value, max) => {
   }
   return void 0;
 };
-const TokenInput = react.forwardRef(
+const TokenInput = React.forwardRef(
   ({
     value,
     onAmountChange,
@@ -638,11 +655,11 @@ const TokenInput = react.forwardRef(
     error,
     ...rest
   }, ref) => {
-    const [inputVal, setInputVal] = react.useState(value ?? "");
-    react.useEffect(() => {
+    const [inputVal, setInputVal] = React.useState(value ?? "");
+    React.useEffect(() => {
       setInputVal(value ?? "");
     }, [value]);
-    const handleChange = react.useCallback(
+    const handleChange = React.useCallback(
       (event) => {
         const raw = event.target.value;
         const normalized = normalizeValue(raw, max);
@@ -689,10 +706,10 @@ const TokenInput = react.forwardRef(
 );
 TokenInput.displayName = "TokenInput";
 function useModal(initial = false) {
-  const [isOpen, setOpen] = react.useState(initial);
-  const onOpen = react.useCallback(() => setOpen(true), []);
-  const onClose = react.useCallback(() => setOpen(false), []);
-  const toggle = react.useCallback(() => setOpen((v2) => !v2), []);
+  const [isOpen, setOpen] = React.useState(initial);
+  const onOpen = React.useCallback(() => setOpen(true), []);
+  const onClose = React.useCallback(() => setOpen(false), []);
+  const toggle = React.useCallback(() => setOpen((v2) => !v2), []);
   return { isOpen, onOpen, onClose, toggle };
 }
 function createJSONStorage(getStorage, options) {
@@ -1203,14 +1220,14 @@ const ChainSelectModal = ({
   isSource
 }) => {
   const { t: t2 } = useBridgeTranslation();
-  const [query, setQuery] = react.useState("");
+  const [query, setQuery] = React.useState("");
   const { setFromChain, chains, fromChain, toChain } = useChainsStore();
   const { assetMatrix, selectedAssetSymbol, setSelectedAssetSymbol } = useTokensStore();
-  const handleClose = react.useCallback(() => {
+  const handleClose = React.useCallback(() => {
     setQuery("");
     onClose();
   }, [onClose]);
-  const findCompatibleSrcChain = react.useCallback(
+  const findCompatibleSrcChain = React.useCallback(
     (dstChain) => {
       if (!chains || !selectedAssetSymbol || !assetMatrix) return void 0;
       const PRIORITY_CHAINS2 = [
@@ -1234,7 +1251,7 @@ const ChainSelectModal = ({
     },
     [chains, selectedAssetSymbol, assetMatrix, fromChain?.chainKey]
   );
-  const findCompatibleTokenAndSrcChain = react.useCallback(
+  const findCompatibleTokenAndSrcChain = React.useCallback(
     (dstChain) => {
       if (!chains || !assetMatrix) return void 0;
       const PRIORITY_CHAINS2 = [
@@ -1264,7 +1281,7 @@ const ChainSelectModal = ({
     },
     [chains, assetMatrix, fromChain?.chainKey]
   );
-  const groupedChains = react.useMemo(() => {
+  const groupedChains = React.useMemo(() => {
     const q3 = query.trim().toLowerCase();
     const isAllowed = isSource ? isAllowedFromChain : isAllowedToChain;
     const filtered = (items ?? []).filter((c2) => isAllowed(c2.chainKey)).filter(
@@ -1303,12 +1320,12 @@ const ChainSelectModal = ({
     findCompatibleTokenAndSrcChain,
     isSource
   ]);
-  const PRIORITY_CHAINS = react.useMemo(
+  const PRIORITY_CHAINS = React.useMemo(
     () => ["ethereum", "arbitrum", "bsc", "polygon", "optimism", "base"],
     []
   );
-  const [isPickLoading, setIsPickLoading] = react.useState(false);
-  const onChainPick = react.useCallback(
+  const [isPickLoading, setIsPickLoading] = React.useState(false);
+  const onChainPick = React.useCallback(
     async (chain2, willChangeSrc = false, willChangeTokenAndSrc = false) => {
       if (!willChangeSrc && !willChangeTokenAndSrc) {
         onChangeChain(chain2);
@@ -1456,9 +1473,9 @@ const ChainSelectModal = ({
     ] })
   ] }) });
 };
-const ChainStrategyContext = react.createContext(void 0);
+const ChainStrategyContext = React.createContext(void 0);
 function useChainStrategies() {
-  const context = react.useContext(ChainStrategyContext);
+  const context = React.useContext(ChainStrategyContext);
   if (!context) {
     throw new Error(
       "useChainStrategies must be used within ChainStrategyProvider"
@@ -1606,12 +1623,12 @@ const WalletInlineButton = ({
   const account = connection?.getAccount();
   const isConnected = connection?.isConnected();
   const error = connection?.getError();
-  const availableConnections = react.useMemo(
+  const availableConnections = React.useMemo(
     () => connection?.getAvailableConnections() ?? [],
     [connection]
   );
   const evmConnectorId = connectedEvmConnector?.id;
-  const activeTronConnection = react.useMemo(() => {
+  const activeTronConnection = React.useMemo(() => {
     if (walletType !== "tron") return null;
     const tronWalletConnect = availableConnections.find(
       (conn) => conn.provider === "walletconnect" && conn.connected && !!conn.address
@@ -1623,16 +1640,16 @@ const WalletInlineButton = ({
     if (tronLink) return tronLink;
     return null;
   }, [availableConnections, walletType]);
-  const handleClick = react.useCallback(() => {
+  const handleClick = React.useCallback(() => {
     onOpen(addressType);
   }, [onOpen, addressType]);
-  const buttonText = react.useMemo(() => {
+  const buttonText = React.useMemo(() => {
     if (isConnected && account) return formatAddress(account);
     if (wallet === "ton") return t2("wallets.addTonWallet");
     if (wallet === "tronlink") return t2("wallets.addTronWallet");
     return t2("wallets.addEvmWallet");
   }, [wallet, isConnected, account, t2]);
-  const connectedIcon = react.useMemo(() => {
+  const connectedIcon = React.useMemo(() => {
     if (!isConnected) return null;
     if (walletType === "tron" && activeTronConnection) {
       return activeTronConnection.provider === "walletconnect" ? prefixIcons.walletconnect : prefixIcons.tronlink;
@@ -1737,8 +1754,8 @@ const SwapSection = ({
   const { assetMatrix, selectedAssetSymbol } = useTokensStore();
   const { status } = useBridgeQuoteStore();
   const { t: t2 } = useBridgeTranslation();
-  const [isFocused, setIsFocused] = react.useState(false);
-  const tokenOnThisChain = react.useMemo(
+  const [isFocused, setIsFocused] = React.useState(false);
+  const tokenOnThisChain = React.useMemo(
     () => resolveTokenOnChainFromMatrix$2(
       assetMatrix,
       selectedAssetSymbol,
@@ -1747,25 +1764,25 @@ const SwapSection = ({
     [assetMatrix, selectedAssetSymbol, chain2?.chainKey]
   );
   const priceUsd = tokenOnThisChain?.price?.usd ?? pickAnyPriceUsd(assetMatrix, selectedAssetSymbol);
-  const computedFiat = react.useMemo(() => {
+  const computedFiat = React.useMemo(() => {
     const amt = parseFloat(amount || "");
     if (Number.isNaN(amt) || !priceUsd) return "$0";
     return formatUsd(amt * priceUsd);
   }, [amount, priceUsd]);
   const isUsdLoading = Boolean(amount && parseFloat(amount) > 0 && !priceUsd);
-  const onChangeChain = react.useCallback(
+  const onChangeChain = React.useCallback(
     (c2) => {
       onSelect?.(c2);
       onClose();
     },
     [onSelect, onClose]
   );
-  const handleMaxClick = react.useCallback(() => {
+  const handleMaxClick = React.useCallback(() => {
     if (balance.balance && onAmountChange) {
       onAmountChange(balance.balance.toString());
     }
   }, [balance.balance, onAmountChange]);
-  const isInsufficientBalance = react.useMemo(() => {
+  const isInsufficientBalance = React.useMemo(() => {
     return !!(isSource && amount && balance.balance && parseFloat(amount) > balance.balance);
   }, [amount, balance.balance, isSource]);
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
@@ -1802,7 +1819,7 @@ const SwapSection = ({
               TokenInput,
               {
                 value: amount,
-                onAmountChange: react.useCallback(
+                onAmountChange: React.useCallback(
                   (v2) => onAmountChange?.(v2),
                   [onAmountChange]
                 ),
@@ -1878,13 +1895,13 @@ function isAddressValidForChain(chainKey, addr, chainType) {
   return addr.trim().length > 0;
 }
 const useIsAddressValid = (address, chainKey, chainType) => {
-  const isValid = react.useMemo(() => {
+  const isValid = React.useMemo(() => {
     return isAddressValidForChain(chainKey, address, chainType);
   }, [address, chainKey, chainType]);
   return { isValid };
 };
 const AnotherAddress = () => {
-  const [isFocused, setIsFocused] = react.useState(false);
+  const [isFocused, setIsFocused] = React.useState(false);
   const { t: t2 } = useBridgeTranslation();
   const { toChain } = useChainsStore();
   const setCustomDstAddress = useCustomAddressStore(
@@ -1895,11 +1912,11 @@ const AnotherAddress = () => {
   const customDstAddress = useCustomAddressStore(
     (state2) => state2.customDstAddress
   );
-  const [value, setValue] = react.useState("");
-  const trimmed = react.useMemo(() => value.trim(), [value]);
+  const [value, setValue] = React.useState("");
+  const trimmed = React.useMemo(() => value.trim(), [value]);
   const { isValid } = useIsAddressValid(trimmed, toChain?.chainKey, toChain?.chainType);
   const invalid = trimmed && !isValid;
-  react.useEffect(() => {
+  React.useEffect(() => {
     if (!isEnabled2) {
       if (customDstAddress !== void 0) {
         setCustomDstAddress(void 0);
@@ -2056,7 +2073,7 @@ function useAddresses() {
     (state2) => state2.address
   );
   const tronAddress = tronLinkAddress || tronWalletConnectAddress || void 0;
-  const srcAddress = react.useMemo(() => {
+  const srcAddress = React.useMemo(() => {
     if (!fromChain?.chainKey) return void 0;
     const chainKey = fromChain.chainKey.toLowerCase();
     if (chainKey === "ton") {
@@ -2067,7 +2084,7 @@ function useAddresses() {
     }
     return evmAddress || void 0;
   }, [fromChain?.chainKey, evmAddress, tonAddress, tronAddress]);
-  const dstAddress = react.useMemo(() => {
+  const dstAddress = React.useMemo(() => {
     if (!toChain?.chainKey) return void 0;
     if (isCustomAddressEnabled) {
       return customDstAddress;
@@ -2403,7 +2420,7 @@ function calculateMinReceived(quote, slippageBps, dstToken) {
 }
 function getQuoteDetails(quote, srcToken, dstToken, tokens, chains, slippageBps, srcChain, dstChain) {
   const amounts = getQuoteAmounts(quote, srcToken, dstToken);
-  const fees = computeFeeBreakdownUsd(quote, srcToken, tokens, chains, srcChain, dstChain);
+  const fees = computeFeeBreakdownUsd(quote, srcToken, dstToken, tokens, chains, srcChain, dstChain);
   const minimumReceived = calculateMinReceived(quote, slippageBps, dstToken);
   return {
     inputAmount: amounts.inputHuman,
@@ -2423,7 +2440,7 @@ function getRouteDisplayName(route) {
   if (routeLower.includes("v2")) return "Stargate V2";
   return route.split(/[/\-_]/).map((part) => part.charAt(0).toUpperCase() + part.slice(1)).join(" ");
 }
-function computeFeeBreakdownUsd(quote, srcToken, tokens, chains, srcChain, dstChain) {
+function computeFeeBreakdownUsd(quote, srcToken, dstToken, tokens, chains, srcChain, dstChain) {
   const defaultMsgSymbol = srcChain?.nativeCurrency?.symbol?.toUpperCase() ?? "";
   const defaultBridgeSymbol = srcToken?.symbol?.toUpperCase() ?? "";
   const defaultDstGasSymbol = dstChain?.nativeCurrency?.symbol?.toUpperCase() ?? "";
@@ -2466,7 +2483,7 @@ function computeFeeBreakdownUsd(quote, srcToken, tokens, chains, srcChain, dstCh
   let bridgeFeeUsd = 0;
   const bridgeFeeSymbol = srcToken.symbol?.toUpperCase() ?? "";
   const srcHuman = fromLD(quote.srcAmount, srcToken.decimals);
-  const dstHuman = fromLD(quote.dstAmount, srcToken.decimals);
+  const dstHuman = dstToken ? fromLD(quote.dstAmount, dstToken.decimals) : 0;
   const diff = srcHuman - dstHuman;
   if (diff > 0) {
     bridgeFeeAmount = diff;
@@ -2586,7 +2603,7 @@ function useBridgeQuote() {
   const { chainRegistry } = useChainStrategies();
   const publicClient = wagmi.usePublicClient();
   const input2 = inputAmount;
-  const srcTokenOnFrom = react.useMemo(
+  const srcTokenOnFrom = React.useMemo(
     () => resolveTokenOnChainFromMatrix$1(
       assetMatrix,
       selectedAssetSymbol,
@@ -2594,7 +2611,7 @@ function useBridgeQuote() {
     ),
     [assetMatrix, selectedAssetSymbol, fromChain?.chainKey]
   );
-  const dstTokenOnTo = react.useMemo(
+  const dstTokenOnTo = React.useMemo(
     () => resolveTokenOnChainFromMatrix$1(
       assetMatrix,
       selectedAssetSymbol,
@@ -2602,14 +2619,14 @@ function useBridgeQuote() {
     ),
     [assetMatrix, selectedAssetSymbol, toChain?.chainKey]
   );
-  const [loading, setLoading] = react.useState(false);
-  react.useEffect(() => {
+  const [loading, setLoading] = React.useState(false);
+  React.useEffect(() => {
     if (!input2 || input2 === "") {
       setLoading(false);
       resetWithIdle();
     }
   }, [input2, resetWithIdle]);
-  react.useEffect(() => {
+  React.useEffect(() => {
     const resetUi = (withError) => {
       setLoading(false);
       {
@@ -2741,7 +2758,7 @@ const useChainDerivations = () => {
     setIsLoadingToChains,
     isUrlInitialized
   } = useChainsStore();
-  const supportedFrom = react.useMemo(() => {
+  const supportedFrom = React.useMemo(() => {
     if (typeof selectedAssetSymbol !== "string" || !assetMatrix || !chains?.length)
       return [];
     const byChain = assetMatrix[selectedAssetSymbol.toUpperCase()];
@@ -2749,7 +2766,7 @@ const useChainDerivations = () => {
     const result = chains.filter((c2) => keys2.has(c2.chainKey) && isAllowedFromChain(c2.chainKey));
     return result;
   }, [selectedAssetSymbol, assetMatrix, chains]);
-  react.useEffect(() => {
+  React.useEffect(() => {
     setAllowedFromChains(supportedFrom);
     if (!isUrlInitialized) {
       return;
@@ -2780,7 +2797,7 @@ const useChainDerivations = () => {
     setAllowedToChains,
     isUrlInitialized
   ]);
-  react.useEffect(() => {
+  React.useEffect(() => {
     let ignore = false;
     const run = async () => {
       if (!selectedAssetSymbol || !fromChain?.chainKey || !chains?.length) {
@@ -2860,7 +2877,7 @@ function isBalanceDebugEnabled() {
 function useBalances(chainKey, address) {
   const { chainRegistry } = useChainStrategies();
   const { assetMatrix } = useTokensStore();
-  const tokensOnChain = react.useMemo(() => {
+  const tokensOnChain = React.useMemo(() => {
     if (!chainKey || !assetMatrix) return [];
     const tokensList = [];
     for (const [, byChain] of Object.entries(assetMatrix)) {
@@ -2906,7 +2923,7 @@ function useBalances(chainKey, address) {
     refetchInterval: 6e4,
     refetchIntervalInBackground: false
   });
-  const balanceBySymbol = react.useMemo(() => {
+  const balanceBySymbol = React.useMemo(() => {
     const map = /* @__PURE__ */ new Map();
     const data = query.data;
     if (data) {
@@ -2916,12 +2933,12 @@ function useBalances(chainKey, address) {
     }
     return map;
   }, [query.data]);
-  const getBalance = react.useCallback(
+  const getBalance = React.useCallback(
     (symbol) => balanceBySymbol.get(normalizeTickerSymbol$1(symbol)) ?? 0,
     [balanceBySymbol]
   );
   const isLoading = query.isLoading || query.isFetching;
-  const balances = react.useMemo(() => query.data || {}, [query.data]);
+  const balances = React.useMemo(() => query.data || {}, [query.data]);
   return {
     balances,
     getBalance,
@@ -2944,21 +2961,21 @@ function useSwapModel() {
   );
   const { loading } = useBridgeQuote();
   const { inputAmount, setInputAmount, resetWithIdle } = useBridgeQuoteStore();
-  const fromBalance = react.useMemo(
+  const fromBalance = React.useMemo(
     () => ({
       balance: srcBalances.getBalance(tokensStore.selectedAssetSymbol || ""),
       isLoading: srcBalances.isLoading
     }),
     [srcBalances, tokensStore.selectedAssetSymbol]
   );
-  const receiveBalance = react.useMemo(
+  const receiveBalance = React.useMemo(
     () => ({
       balance: dstBalances.getBalance(tokensStore.selectedAssetSymbol || ""),
       isLoading: dstBalances.isLoading
     }),
     [dstBalances, tokensStore.selectedAssetSymbol]
   );
-  const state2 = react.useMemo(
+  const state2 = React.useMemo(
     () => ({
       fromChain: chainsStore.fromChain,
       toChain: chainsStore.toChain,
@@ -2974,7 +2991,7 @@ function useSwapModel() {
     setFromChain: chainsStore.setFromChain,
     setToChain: chainsStore.setToChain,
     setAmount: setInputAmount,
-    swapSides: react.useCallback(() => {
+    swapSides: React.useCallback(() => {
       const fromChain = chainsStore.fromChain;
       const toChain = chainsStore.toChain;
       const sym = (tokensStore.selectedAssetSymbol ?? "").toUpperCase();
@@ -3025,11 +3042,54 @@ const InfoIcon = (props) => {
     }
   );
 };
+const MOBILE_BREAKPOINT = 768;
+function useIsMobile() {
+  const [isMobile2, setIsMobile] = React__namespace.useState(
+    void 0
+  );
+  React__namespace.useEffect(() => {
+    const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`);
+    const onChange = () => {
+      setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
+    };
+    mql.addEventListener("change", onChange);
+    setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
+    return () => mql.removeEventListener("change", onChange);
+  }, []);
+  return !!isMobile2;
+}
 const Tip = (props) => {
   const { children, text } = props;
-  return /* @__PURE__ */ jsxRuntime.jsxs(tooltip.Tooltip, { children: [
-    /* @__PURE__ */ jsxRuntime.jsx(tooltip.TooltipTrigger, { className: "w-4 h-4 rounded-full bg-muted text-muted-foreground", children }),
-    /* @__PURE__ */ jsxRuntime.jsx(tooltip.TooltipContent, { children: text })
+  const [open, setOpen] = React.useState(false);
+  const isMobile2 = useIsMobile();
+  const tooltipRef = React.useRef(null);
+  const handleToggle = () => {
+    setOpen((prev) => !prev);
+  };
+  React.useEffect(() => {
+    const handleClickOutside = (event) => {
+      if (tooltipRef.current && !tooltipRef.current.contains(event.target)) {
+        setOpen(false);
+      }
+    };
+    document.addEventListener("mousedown", handleClickOutside);
+    return () => {
+      document.removeEventListener("mousedown", handleClickOutside);
+    };
+  }, []);
+  return /* @__PURE__ */ jsxRuntime.jsxs(tooltip.Tooltip, { open: isMobile2 ? open : void 0, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      tooltip.TooltipTrigger,
+      {
+        onClick: (e2) => {
+          e2.preventDefault();
+          handleToggle();
+        },
+        className: "w-4 h-4 rounded-full bg-muted text-muted-foreground",
+        children
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(tooltip.TooltipContent, { ref: tooltipRef, children: text })
   ] });
 };
 const BASE_URL = "https://icons-ckg.pages.dev/stargate-light/tokens";
@@ -3046,13 +3106,18 @@ function useFeeBreakdown() {
   const { quote } = useBridgeQuoteStore();
   const { tokens, allTokens, selectedAssetSymbol, assetMatrix } = useTokensStore();
   const { fromChain, toChain, chains } = useChainsStore();
-  return react.useMemo(() => {
+  return React.useMemo(() => {
     const srcToken = resolveTokenOnChainFromMatrix$1(
       assetMatrix,
       selectedAssetSymbol,
       fromChain?.chainKey
     );
-    return computeFeeBreakdownUsd(quote, srcToken, allTokens ?? tokens, chains, fromChain, toChain);
+    const dstToken = resolveTokenOnChainFromMatrix$1(
+      assetMatrix,
+      selectedAssetSymbol,
+      toChain?.chainKey
+    );
+    return computeFeeBreakdownUsd(quote, srcToken, dstToken, allTokens ?? tokens, chains, fromChain, toChain);
   }, [quote, allTokens, tokens, chains, selectedAssetSymbol, assetMatrix, fromChain, toChain]);
 }
 function useBridgeExternalData(options) {
@@ -3068,7 +3133,7 @@ function useBridgeExternalData(options) {
   const inputAmount = useBridgeQuoteStore((state2) => state2.inputAmount);
   const quote = useBridgeQuoteStore((state2) => state2.quote);
   const slippageBps = useSettingsStore((state2) => state2.slippageBps);
-  const data = react.useMemo(
+  const data = React.useMemo(
     () => buildBridgeExternalData({
       amount: inputAmount,
       selectedAssetSymbol,
@@ -3093,8 +3158,8 @@ function useBridgeExternalData(options) {
       slippageBps
     ]
   );
-  const lastSerializedRef = react.useRef(void 0);
-  react.useEffect(() => {
+  const lastSerializedRef = React.useRef(void 0);
+  React.useEffect(() => {
     const callback = options?.onDataUpdate;
     if (!callback) return;
     const serialized = serializeBridgeDataForCache(data);
@@ -3678,7 +3743,7 @@ function useGasEstimate(amountNum) {
   const quoteFees = quote?.fees;
   const quoteSrcChainKey = quote?.srcChainKey;
   const nativeBalanceValue = nativeCurrencySymbol ? Number(balances[nativeCurrencySymbol.toUpperCase()]?.balance ?? 0) : 0;
-  const result = react.useMemo(() => {
+  const result = React.useMemo(() => {
     if (!chainKey || !nativeCurrencySymbol) {
       return {
         nativeSym: "",
@@ -3756,7 +3821,7 @@ function useBridgeTransaction() {
   const { chains } = useChainsStore();
   const txStore = useTransactionStore();
   const gas = useGasEstimate();
-  const srcToken = react.useMemo(
+  const srcToken = React.useMemo(
     () => resolveTokenOnChainFromMatrix$1(
       assetMatrix,
       selectedAssetSymbol,
@@ -3764,7 +3829,7 @@ function useBridgeTransaction() {
     ),
     [assetMatrix, selectedAssetSymbol, quote?.srcChainKey]
   );
-  const dstToken = react.useMemo(
+  const dstToken = React.useMemo(
     () => resolveTokenOnChainFromMatrix$1(
       assetMatrix,
       selectedAssetSymbol,
@@ -3978,7 +4043,7 @@ function useBalanceCheck(amountNum, gas) {
   const { selectedAssetSymbol } = useTokensStore();
   const { srcAddress } = useAddresses();
   const { getBalance } = useBalances(fromChain?.chainKey, srcAddress);
-  const validationResult = react.useMemo(() => {
+  const validationResult = React.useMemo(() => {
     if (!fromChain || !gas.balancesKnown) {
       return {
         availableBalance: 0,
@@ -4021,7 +4086,7 @@ function useAmountLimits(amountNum) {
   const { selectedAssetSymbol, tokens } = useTokensStore();
   const { fromChain } = useChainsStore();
   const { quote } = useBridgeQuoteStore();
-  const limitsResult = react.useMemo(() => {
+  const limitsResult = React.useMemo(() => {
     const tokenSymbol = selectedAssetSymbol;
     if (quote?.srcAmountMax && fromChain?.chainKey && selectedAssetSymbol) {
       const sourceToken = tokens?.find(
@@ -4059,7 +4124,7 @@ function useSilentValidations(amountString) {
   const { selectedAssetSymbol, assetMatrix, tokens } = useTokensStore();
   const { fromChain, toChain } = useChainsStore();
   const { quote, status, error } = useBridgeQuoteStore();
-  const validationResult = react.useMemo(() => {
+  const validationResult = React.useMemo(() => {
     const hasTooManyDecimals = (() => {
       if (!amountString || !fromChain?.chainKey || !selectedAssetSymbol)
         return false;
@@ -4110,35 +4175,11 @@ function useSilentValidations(amountString) {
     status,
     error
   ]);
-  react.useEffect(() => {
-    if (validationResult.isValidForTransfer) return;
-    console.info("[SilentValidations] invalid", {
-      amountString,
-      hasTooManyDecimals: validationResult.hasTooManyDecimals,
-      hasUnsupportedTokenPair: validationResult.hasUnsupportedTokenPair,
-      hasInsufficientLiquidity: validationResult.hasInsufficientLiquidity,
-      status,
-      hasQuote: Boolean(quote),
-      error,
-      fromChainKey: fromChain?.chainKey,
-      toChainKey: toChain?.chainKey,
-      selectedAssetSymbol
-    });
-  }, [
-    validationResult,
-    amountString,
-    status,
-    quote,
-    error,
-    fromChain?.chainKey,
-    toChain?.chainKey,
-    selectedAssetSymbol
-  ]);
   return validationResult;
 }
 function useTelegramRestriction() {
   const { fromChain, toChain } = useChainsStore();
-  const restriction = react.useMemo(() => {
+  const restriction = React.useMemo(() => {
     const isTelegramEnv = typeof window !== "undefined" && /* eslint-disable-next-line @typescript-eslint/no-explicit-any */
     typeof window.TelegramWebviewProxy?.postEvent === "function";
     if (!isTelegramEnv) {
@@ -4182,7 +4223,7 @@ const MainButton = ({
   const missingDst = isCustomAddressEnabled ? !dstAddressValid : !dstConnectedOk || !dstAddressValid;
   const requiresCustomAddress = isCustomAddressEnabled && !dstAddressValid;
   const canTransfer = !missingSrc && !missingDst && amountNum > 0 && !!srcChainKey && !!dstChainKey;
-  const label = react.useMemo(() => {
+  const label = React.useMemo(() => {
     switch (true) {
       case isTelegramRestricted:
         return t2("telegram.openWebVersion");
@@ -4260,7 +4301,6 @@ const MainButton = ({
     }
   };
   const disabled = status === "loading" || requiresCustomAddress || !isTelegramRestricted && !missingSrc && !missingDst && (amountNum <= 0 || isBalanceLoading || hasInsufficientBalance || hasAmountTooLarge || !gas.hasEnoughGas || noRoute || !isValidForTransfer);
-  console.log(gas);
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "pt-4 space-y-4", children: [
     isTelegramRestricted && /* @__PURE__ */ jsxRuntime.jsx(
       alert.Alert,
@@ -4295,7 +4335,7 @@ const WalletModalButton = (props) => {
   const { icon: IconComponent, name, onClose } = props;
   const { chainRegistry } = useChainStrategies();
   const { connect, isPending } = wagmi.useConnect();
-  const [isConnecting, setIsConnecting] = react.useState(false);
+  const [isConnecting, setIsConnecting] = React.useState(false);
   if (props.variant === "connected") {
     const { address, onDisconnect } = props;
     return /* @__PURE__ */ jsxRuntime.jsxs(
@@ -4749,11 +4789,11 @@ const SuccessStep = ({
   );
 };
 const useCountdown = (initialSeconds) => {
-  const [time2, setTime] = react.useState(initialSeconds);
+  const [time2, setTime] = React.useState(initialSeconds);
   const minutes = Math.floor(time2 / 60);
   const seconds = time2 % 60;
   const formattedTime = `${minutes.toString().padStart(2, "0")}:${seconds.toString().padStart(2, "0")}`;
-  react.useEffect(() => {
+  React.useEffect(() => {
     if (!time2) return;
     const intervalId = setInterval(() => {
       setTime(time2 - 1);
@@ -4831,7 +4871,7 @@ const useTokens = () => {
     // 1 час хранения в кэше
     refetchOnWindowFocus: false
   });
-  react.useEffect(() => {
+  React.useEffect(() => {
     if (query.isSuccess && query.data?.length) {
       setAllTokens(query.data);
       const bridgeableTokens = query.data.filter(
@@ -4850,7 +4890,7 @@ const useTokens = () => {
     setSelectedToken,
     setSelectedAssetSymbol
   ]);
-  react.useEffect(() => {
+  React.useEffect(() => {
     if (query.isError && query.error) {
       console.error(query.error.name, query.error.message);
     }
@@ -4870,7 +4910,7 @@ const useChains = () => {
     // 1 час хранения в кэше
     refetchOnWindowFocus: false
   });
-  react.useEffect(() => {
+  React.useEffect(() => {
     if (query.isSuccess && query.data?.length) {
       setChains(query.data);
       if (!fromChain) {
@@ -4878,7 +4918,7 @@ const useChains = () => {
       }
     }
   }, [query.isSuccess, query.data]);
-  react.useEffect(() => {
+  React.useEffect(() => {
     if (query.isError && query.error) {
       console.error(query.error.name, query.error.message);
     }
@@ -6636,7 +6676,7 @@ function ChainStrategyProvider({
   tronApiKey
 }) {
   const { chains } = useChainsStore();
-  const chainKeyToId = react.useMemo(() => {
+  const chainKeyToId = React.useMemo(() => {
     const map = {
       ...EVM_CHAIN_KEY_TO_ID
     };
@@ -6649,7 +6689,7 @@ function ChainStrategyProvider({
     }
     return map;
   }, [chains]);
-  const evmStrategy = react.useMemo(
+  const evmStrategy = React.useMemo(
     () => new EvmChainStrategy({
       evmAddress: evmWallet.address,
       evmIsConnected: evmWallet.isConnected,
@@ -6669,7 +6709,7 @@ function ChainStrategyProvider({
       chainKeyToId
     ]
   );
-  const tonStrategy = react.useMemo(
+  const tonStrategy = React.useMemo(
     () => new TonChainStrategy({
       tonConnectUI: tonWallet.tonConnectUI,
       tonAddress: tonWallet.address,
@@ -6678,7 +6718,7 @@ function ChainStrategyProvider({
     }),
     [tonWallet.tonConnectUI, tonWallet.address, tonClient, tonApiKey]
   );
-  const tronStrategy = react.useMemo(
+  const tronStrategy = React.useMemo(
     () => new TronChainStrategy({
       tronLink: {
         address: tronWallet.tronLink.address,
@@ -6708,11 +6748,11 @@ function ChainStrategyProvider({
       tronApiKey
     ]
   );
-  const chainRegistry = react.useMemo(
+  const chainRegistry = React.useMemo(
     () => new ChainStrategyRegistry([evmStrategy, tonStrategy, tronStrategy]),
     [evmStrategy, tonStrategy, tronStrategy]
   );
-  const value = react.useMemo(
+  const value = React.useMemo(
     () => ({
       chainRegistry
     }),
@@ -6930,10 +6970,10 @@ const TokenSelectModal = ({
   onChangeAsset
 }) => {
   const { t: t2 } = useBridgeTranslation();
-  const [query, setQuery] = react.useState("");
-  const [tab, setTab] = react.useState("my");
-  const [manualTabSwitch, setManualTabSwitch] = react.useState(false);
-  const [listHeight, setListHeight] = react.useState(400);
+  const [query, setQuery] = React.useState("");
+  const [tab, setTab] = React.useState("my");
+  const [manualTabSwitch, setManualTabSwitch] = React.useState(false);
+  const [listHeight, setListHeight] = React.useState(400);
   const { srcAddress } = useAddresses();
   const { fromChain, toChain, setFromChain, chains } = useChainsStore();
   const { assetMatrix, selectedAssetSymbol } = useTokensStore();
@@ -6942,20 +6982,20 @@ const TokenSelectModal = ({
     fromChain?.chainKey,
     srcAddress
   );
-  const hasSourceWallet = react.useCallback(() => {
+  const hasSourceWallet = React.useCallback(() => {
     return hasWalletForChain(fromChain?.chainKey);
   }, [hasWalletForChain, fromChain?.chainKey]);
-  react.useEffect(() => {
+  React.useEffect(() => {
     if (!hasSourceWallet()) setTab("all");
   }, [hasSourceWallet]);
-  const getTokenUsdValue = react.useCallback(
+  const getTokenUsdValue = React.useCallback(
     (symbol, price) => {
       const bal = getBalance(symbol);
       return bal > 0 && price ? bal * price : 0;
     },
     [getBalance]
   );
-  const isTokenAvailableOnChain = react.useCallback(
+  const isTokenAvailableOnChain = React.useCallback(
     (symbol, chainKey) => {
       if (!assetMatrix || !chainKey) return false;
       const tokensByChain = assetMatrix[symbol.toUpperCase()];
@@ -6963,7 +7003,7 @@ const TokenSelectModal = ({
     },
     [assetMatrix]
   );
-  const findFirstAvailableChain = react.useCallback(
+  const findFirstAvailableChain = React.useCallback(
     (symbol) => {
       if (!assetMatrix || !chains) return void 0;
       const tokensByChain = assetMatrix[symbol.toUpperCase()];
@@ -6976,7 +7016,7 @@ const TokenSelectModal = ({
     },
     [assetMatrix, chains]
   );
-  const groupedTokens = react.useMemo(() => {
+  const groupedTokens = React.useMemo(() => {
     const q3 = query.trim().toLowerCase();
     const filtered = q3 ? items.filter(
       (a2) => a2.name.toLowerCase().includes(q3) || a2.symbol.toLowerCase().includes(q3)
@@ -7026,33 +7066,33 @@ const TokenSelectModal = ({
   ]);
   const myTokens = groupedTokens.withBalance;
   const effectiveTab = hasSourceWallet() ? tab === "my" && myTokens.length === 0 && !manualTabSwitch ? "all" : tab : "all";
-  react.useEffect(() => {
+  React.useEffect(() => {
     if (query.trim() !== "" && tab === "my" && myTokens.length === 0 && !manualTabSwitch) {
       setTab("all");
     }
   }, [query, tab, myTokens.length, manualTabSwitch]);
-  react.useEffect(() => {
+  React.useEffect(() => {
     if (query.trim() !== "" && tab === "all" && myTokens.length > 0 && !manualTabSwitch) {
       setTab("my");
     }
   }, [query, tab, myTokens.length, manualTabSwitch]);
-  react.useEffect(() => {
+  React.useEffect(() => {
     setManualTabSwitch(false);
   }, [query]);
-  const resetState = react.useCallback(() => {
+  const resetState = React.useCallback(() => {
     setQuery("");
     setTab("my");
     setManualTabSwitch(false);
   }, []);
-  const handleClose = react.useCallback(() => {
+  const handleClose = React.useCallback(() => {
     resetState();
     onClose();
   }, [onClose, resetState]);
-  react.useEffect(() => {
+  React.useEffect(() => {
     if (!isOpen) resetState();
   }, [isOpen, resetState]);
-  react.useEffect(() => () => resetState(), [resetState]);
-  const onPick = react.useCallback(
+  React.useEffect(() => () => resetState(), [resetState]);
+  const onPick = React.useCallback(
     (sym, willChangeSrcChain = false, willChangeDstChain = false, willChangeBothChains = false) => {
       onChangeAsset(sym);
       if (willChangeBothChains) {
@@ -7066,7 +7106,7 @@ const TokenSelectModal = ({
     },
     [findFirstAvailableChain, handleClose, onChangeAsset, setFromChain]
   );
-  const tokensToRender = react.useMemo(() => {
+  const tokensToRender = React.useMemo(() => {
     if (effectiveTab === "my") {
       return myTokens.map((token) => ({
         token,
@@ -7085,21 +7125,21 @@ const TokenSelectModal = ({
     ];
     return mainTokens;
   }, [effectiveTab, myTokens, groupedTokens]);
-  const willChangeDstTokens = react.useMemo(
+  const willChangeDstTokens = React.useMemo(
     () => groupedTokens.willChangeDstChain.map((token) => ({
       token,
       willChangeDst: true
     })),
     [groupedTokens.willChangeDstChain]
   );
-  const willChangeSrcTokens = react.useMemo(
+  const willChangeSrcTokens = React.useMemo(
     () => groupedTokens.willChangeSrcChain.map((token) => ({
       token,
       willChangeSrc: true
     })),
     [groupedTokens.willChangeSrcChain]
   );
-  const willChangeBothTokens = react.useMemo(
+  const willChangeBothTokens = React.useMemo(
     () => groupedTokens.willChangeBothChains.map((token) => ({
       token,
       willChangeBoth: true
@@ -7107,7 +7147,7 @@ const TokenSelectModal = ({
     [groupedTokens.willChangeBothChains]
   );
   const hasNoResults = tokensToRender.length === 0 && willChangeDstTokens.length === 0 && willChangeSrcTokens.length === 0 && willChangeBothTokens.length === 0;
-  const virtualItems = react.useMemo(() => {
+  const virtualItems = React.useMemo(() => {
     const items2 = tokensToRender.map(
       ({ token, willChangeSrc }) => ({
         type: "token",
@@ -7152,7 +7192,7 @@ const TokenSelectModal = ({
     }
     return items2;
   }, [effectiveTab, tokensToRender, t2, willChangeDstTokens, willChangeSrcTokens, willChangeBothTokens]);
-  react.useLayoutEffect(() => {
+  React.useLayoutEffect(() => {
     const updateHeight = () => {
       const container2 = document.getElementById("token-select-list");
       if (!container2) return;
@@ -7175,7 +7215,7 @@ const TokenSelectModal = ({
       resizeObserver?.disconnect();
     };
   }, [isOpen, hasSourceWallet]);
-  const VirtualRow = react.useCallback(
+  const VirtualRow = React.useCallback(
     ({ index, style }) => {
       const item = virtualItems[index];
       if (!item) return null;
@@ -7219,7 +7259,7 @@ const TokenSelectModal = ({
       virtualItems
     ]
   );
-  const itemKey = react.useCallback(
+  const itemKey = React.useCallback(
     (index) => {
       const item = virtualItems[index];
       if (!item) return index;
@@ -7296,8 +7336,8 @@ function useBridgeRefresh() {
   const { fromChain, toChain } = useChainsStore();
   const { setLoading: setQLoading, triggerRefetch } = useBridgeQuoteStore();
   const { hasAnyWallet } = useConnectedWalletsStore();
-  const [spinning, setSpinning] = react.useState(false);
-  const refresh = react.useCallback(async () => {
+  const [spinning, setSpinning] = React.useState(false);
+  const refresh = React.useCallback(async () => {
     setSpinning(true);
     try {
       setQLoading();
@@ -7350,8 +7390,8 @@ function useBridgeRefresh() {
 }
 const RefreshButton = () => {
   const { refresh, spinning } = useBridgeRefresh();
-  const [turns, setTurns] = react.useState(0);
-  const handleRefresh = react.useCallback(() => {
+  const [turns, setTurns] = React.useState(0);
+  const handleRefresh = React.useCallback(() => {
     setTurns((t2) => t2 + 1);
     refresh();
   }, [refresh]);
@@ -7380,7 +7420,7 @@ const SelectTokenButton = ({
   token
 }) => {
   const { t: t2 } = useBridgeTranslation();
-  const label = react.useMemo(() => {
+  const label = React.useMemo(() => {
     return token?.symbol ?? t2("bridge.selectToken");
   }, [token, t2]);
   return /* @__PURE__ */ jsxRuntime.jsxs(
@@ -7418,8 +7458,8 @@ const Toolbar = () => {
     onOpen: onOpenSettings
   } = useModal();
   const { tokens, selectedAssetSymbol, setSelectedAssetSymbol } = useTokensStore();
-  const assets = react.useMemo(() => listAssetsForSelect(tokens || []), [tokens]);
-  const current = react.useMemo(() => {
+  const assets = React.useMemo(() => listAssetsForSelect(tokens || []), [tokens]);
+  const current = React.useMemo(() => {
     if (!assets.length) return void 0;
     if (!selectedAssetSymbol) return assets[0];
     const sum = selectedAssetSymbol.toUpperCase();
@@ -7465,8 +7505,8 @@ const useAutoSelectNetwork = ({
 }) => {
   const { hasAnyWallet } = useConnectedWalletsStore();
   const { chains, setFromChain } = useChainsStore();
-  const previousHadWallet = react.useRef(hasAnyWallet());
-  react.useEffect(() => {
+  const previousHadWallet = React.useRef(hasAnyWallet());
+  React.useEffect(() => {
     const currentHasWallet = hasAnyWallet();
     const isFirstWalletConnection = !previousHadWallet.current && currentHasWallet;
     if (isFirstWalletConnection && chains?.length) {
@@ -26107,7 +26147,7 @@ class WalletConnectModal {
   }
   async initUi() {
     if (typeof window !== "undefined") {
-      await Promise.resolve().then(() => require("./index-DzUouoJg.cjs"));
+      await Promise.resolve().then(() => require("./index-Btnz7slS.cjs"));
       const modal = document.createElement("wcm-modal");
       document.body.insertAdjacentElement("beforeend", modal);
       OptionsCtrl.setIsUiLoaded(true);
@@ -26213,16 +26253,16 @@ function isSessionExpiredError(error) {
 function useTronWalletConnect(projectId) {
   const { address, isConnected, isConnecting } = useTronWalletConnectStore();
   const { setAddress, setActions, reset } = useTronWalletConnectStore();
-  const providerRef = react.useRef(null);
-  const modalRef = react.useRef(null);
-  const abortControllerRef = react.useRef(null);
+  const providerRef = React.useRef(null);
+  const modalRef = React.useRef(null);
+  const abortControllerRef = React.useRef(null);
   const { onClose: closeWalletSelectModal } = useWalletSelectModal();
   const appliedTheme = useThemeStore((state2) => state2.appliedTheme);
-  const closeWalletSelectModalRef = react.useRef(closeWalletSelectModal);
+  const closeWalletSelectModalRef = React.useRef(closeWalletSelectModal);
   closeWalletSelectModalRef.current = closeWalletSelectModal;
-  const appliedThemeRef = react.useRef(appliedTheme);
+  const appliedThemeRef = React.useRef(appliedTheme);
   appliedThemeRef.current = appliedTheme;
-  react.useEffect(() => {
+  React.useEffect(() => {
     if (!projectId || providerRef.current) return;
     const initProvider = async () => {
       try {
@@ -26295,7 +26335,7 @@ function useTronWalletConnect(projectId) {
       }
     };
   }, [projectId, setAddress]);
-  react.useEffect(() => {
+  React.useEffect(() => {
     if (!projectId || !modalRef.current) return;
     const modal = new WalletConnectModal({
       projectId,
@@ -26307,7 +26347,7 @@ function useTronWalletConnect(projectId) {
     });
     modalRef.current = modal;
   }, [appliedTheme, projectId]);
-  const connect = react.useCallback(async () => {
+  const connect = React.useCallback(async () => {
     if (!providerRef.current) {
       throw new Error(
         "WalletConnect not initialized. Please provide a valid project ID."
@@ -26375,7 +26415,7 @@ function useTronWalletConnect(projectId) {
       abortControllerRef.current = null;
     }
   }, [setAddress]);
-  const cancelConnection = react.useCallback(() => {
+  const cancelConnection = React.useCallback(() => {
     if (abortControllerRef.current) {
       abortControllerRef.current.abort();
       console.log("TRON WalletConnect connection cancelled");
@@ -26384,7 +26424,7 @@ function useTronWalletConnect(projectId) {
       modalRef.current.closeModal();
     }
   }, []);
-  const disconnect = react.useCallback(async () => {
+  const disconnect = React.useCallback(async () => {
     if (!providerRef.current) return;
     try {
       await providerRef.current.disconnect();
@@ -26395,7 +26435,7 @@ function useTronWalletConnect(projectId) {
       throw error;
     }
   }, [reset]);
-  const signTransaction = react.useCallback(
+  const signTransaction = React.useCallback(
     async (transaction2) => {
       if (!providerRef.current) {
         throw new Error("WalletConnect not initialized");
@@ -26462,7 +26502,7 @@ function useTronWalletConnect(projectId) {
     },
     [address, setAddress]
   );
-  const onAddressCorrected = react.useCallback(
+  const onAddressCorrected = React.useCallback(
     (correctedAddress) => {
       console.log(
         "TRON WalletConnect address corrected:",
@@ -26474,7 +26514,7 @@ function useTronWalletConnect(projectId) {
     },
     [address, setAddress]
   );
-  react.useEffect(() => {
+  React.useEffect(() => {
     setActions({
       connect,
       disconnect,
@@ -26532,10 +26572,10 @@ function useUrlSync(options) {
   const { setInputAmount } = useBridgeQuoteStore();
   const internalData = useBridgeExternalData();
   const currentUrlParams = internalData.urlParams;
-  const [hasInitialized, setHasInitialized] = react.useState(false);
-  const isSyncingRef = react.useRef(false);
-  const lastSyncedParamsRef = react.useRef({});
-  const validateParams = react.useCallback(
+  const [hasInitialized, setHasInitialized] = React.useState(false);
+  const isSyncingRef = React.useRef(false);
+  const lastSyncedParamsRef = React.useRef({});
+  const validateParams = React.useCallback(
     (urlParams) => {
       const result = {};
       if (!chains?.length || !tokens?.length || !assetMatrix) {
@@ -26588,7 +26628,7 @@ function useUrlSync(options) {
     },
     [chains, tokens, assetMatrix]
   );
-  const syncStateToUrl = react.useCallback(
+  const syncStateToUrl = React.useCallback(
     (includeAmount = false) => {
       if (!enabled || isSyncingRef.current || !hasInitialized) {
         return;
@@ -26610,11 +26650,11 @@ function useUrlSync(options) {
     },
     [enabled, hasInitialized, currentUrlParams, onUrlParamsChange]
   );
-  const handleAmountBlur = react.useCallback(() => {
+  const handleAmountBlur = React.useCallback(() => {
     if (!enabled || !hasInitialized) return;
     syncStateToUrl(true);
   }, [enabled, hasInitialized, syncStateToUrl]);
-  react.useEffect(() => {
+  React.useEffect(() => {
     if (!enabled || !chains?.length || !tokens?.length) {
       return;
     }
@@ -26660,7 +26700,7 @@ function useUrlSync(options) {
     setInputAmount,
     setIsUrlInitialized
   ]);
-  react.useEffect(() => {
+  React.useEffect(() => {
     if (!enabled || !hasInitialized) return;
     syncStateToUrl(false);
   }, [
@@ -26684,7 +26724,7 @@ const EvaaBridgeWithProviders = (props) => {
   const { disconnect: evmDisconnect } = wagmi.useDisconnect();
   const { data: walletClient } = wagmi.useWalletClient();
   const publicClient = wagmi.usePublicClient();
-  const getPublicClientForChain = react.useCallback(
+  const getPublicClientForChain = React.useCallback(
     (chainId) => {
       try {
         const client = wagmiConfig.getClient({
@@ -26704,15 +26744,15 @@ const EvaaBridgeWithProviders = (props) => {
     connect: tronConnect,
     disconnect: tronDisconnect
   } = tronwalletAdapterReactHooks.useWallet();
-  const tronSelectRef = react.useRef(tronSelect);
-  const tronConnectRef = react.useRef(tronConnect);
-  const tronDisconnectRef = react.useRef(tronDisconnect);
-  react.useEffect(() => {
+  const tronSelectRef = React.useRef(tronSelect);
+  const tronConnectRef = React.useRef(tronConnect);
+  const tronDisconnectRef = React.useRef(tronDisconnect);
+  React.useEffect(() => {
     tronSelectRef.current = tronSelect;
     tronConnectRef.current = tronConnect;
     tronDisconnectRef.current = tronDisconnect;
   }, [tronSelect, tronConnect, tronDisconnect]);
-  const tronLinkActions = react.useMemo(
+  const tronLinkActions = React.useMemo(
     () => ({
       select: (adapterName) => tronSelectRef.current(adapterName),
       connect: () => tronConnectRef.current(),
@@ -26722,14 +26762,14 @@ const EvaaBridgeWithProviders = (props) => {
   );
   const tronWalletConnect = useTronWalletConnect(props.walletConnectProjectId);
   const { setTonConnected, setMetaMaskConnected, setTronConnected } = useConnectedWalletsStore();
-  react.useEffect(() => {
+  React.useEffect(() => {
     setTonConnected(!!tonAddress);
   }, [tonAddress, setTonConnected]);
-  react.useEffect(() => {
+  React.useEffect(() => {
     setMetaMaskConnected(!!evmIsConnected);
   }, [evmIsConnected, setMetaMaskConnected]);
   const isAnyTronConnected = !!tronConnected || !!tronWalletConnect.isConnected;
-  react.useEffect(() => {
+  React.useEffect(() => {
     setTronConnected(isAnyTronConnected);
   }, [isAnyTronConnected, setTronConnected]);
   useAutoSelectNetwork({
@@ -26818,7 +26858,7 @@ const EvaaBridgeContent = ({
   const canSwap = Boolean(
     fromChain && toChain && selectedAssetSymbol && isAllowedFromChain(toChain.chainKey)
   );
-  const outputAmount = react.useMemo(() => {
+  const outputAmount = React.useMemo(() => {
     if (!quote || loading) return "";
     const srcToken = resolveTokenOnChainFromMatrix$1(
       assetMatrix,
@@ -26840,35 +26880,35 @@ const EvaaBridgeContent = ({
     fromChain?.chainKey,
     toChain?.chainKey
   ]);
-  react.useEffect(() => {
+  React.useEffect(() => {
     if (chains?.length && onInitialized) {
       onInitialized();
     }
   }, [chains, onInitialized]);
-  const handleAmountChange = react.useCallback(
+  const handleAmountChange = React.useCallback(
     (newAmount) => {
       setAmountAction(newAmount);
     },
     [setAmountAction]
   );
-  const handleFromChainChange = react.useCallback(
+  const handleFromChainChange = React.useCallback(
     (chain2) => {
       if (!chain2) return;
       setFromChainAction(chain2);
     },
     [setFromChainAction]
   );
-  const handleToChainChange = react.useCallback(
+  const handleToChainChange = React.useCallback(
     (chain2) => {
       if (!chain2) return;
       setToChainAction(chain2);
     },
     [setToChainAction]
   );
-  const handleSwapSides = react.useCallback(() => {
+  const handleSwapSides = React.useCallback(() => {
     swap.actions.swapSides();
   }, [swap.actions]);
-  const destinationChains = react.useMemo(() => {
+  const destinationChains = React.useMemo(() => {
     if (!chains || !selectedAssetSymbol || !assetMatrix) {
       return allowedToChains ?? [];
     }
@@ -26881,7 +26921,7 @@ const EvaaBridgeContent = ({
     fromChain?.chainKey,
     selectedAssetSymbol
   ]);
-  const sourceChains = react.useMemo(() => {
+  const sourceChains = React.useMemo(() => {
     if (!chains || !assetMatrix) {
       return allowedFromChains ?? [];
     }
@@ -27009,4 +27049,4 @@ exports.useSettingsStore = useSettingsStore;
 exports.useSwapModel = useSwapModel;
 exports.useTokensStore = useTokensStore;
 exports.useTransactionStore = useTransactionStore;
-//# sourceMappingURL=index-CbuEGPY8.cjs.map
+//# sourceMappingURL=index-bZ0S5sNd.cjs.map