@rash2x/bridge-widget 0.6.33 → 0.6.35

package/dist/evaa-bridge.cjs

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const index = require("./index-BpblK2_8.cjs");
+const index = require("./index-BXp-N4UF.cjs");
 exports.DEFAULT_SLIPPAGE_BPS = index.DEFAULT_SLIPPAGE_BPS;
 exports.EvaaBridge = index.EvaaBridge;
 exports.RoutePriority = index.RoutePriority;

package/dist/evaa-bridge.mjs

@@ -1,4 +1,4 @@
-import { U, d, f, e, H, B, F, X, N, z, $, G, A, D, Z, w, s, v, r, p, q, L, a2, aa, a4, a7, x, I, y, a5, J, a3, a8, a9, Y, a6, W, P, _, a1, ab, Q, S, a0, K, V, t, o, i, u, l, m, j, n, h, k } from "./index-Dmn03M61.js";
+import { U, d, f, e, H, B, F, X, N, z, $, G, A, D, Z, w, s, v, r, p, q, L, a2, aa, a4, a7, x, I, y, a5, J, a3, a8, a9, Y, a6, W, P, _, a1, ab, Q, S, a0, K, V, t, o, i, u, l, m, j, n, h, k } from "./index-DvKN7Y1C.js";
 export {
   U as DEFAULT_SLIPPAGE_BPS,
   d as EvaaBridge,

package/dist/{index-BpblK2_8.cjs → index-BXp-N4UF.cjs}

@@ -31,6 +31,7 @@ const viem = require("viem");
 const tronwalletAdapters = require("@tronweb3/tronwallet-adapters");
 const tronweb = require("tronweb");
 const card = require("@/components/ui/card");
+const reactWindow = require("react-window");
 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", "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" };
@@ -2055,59 +2056,6 @@ const SearchIcon = (props) => {
     }
   );
 };
-const StargateIcon = (props) => {
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    "svg",
-    {
-      width: "16",
-      height: "16",
-      viewBox: "0 0 16 16",
-      fill: "none",
-      xmlns: "http://www.w3.org/2000/svg",
-      ...props,
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("g", { clipPath: "url(#clip0_13294_89003)", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            "path",
-            {
-              d: "M9.58707 0.636789L10.0135 1.63492C10.8488 3.59268 12.4067 5.15059 14.3644 5.98584L15.3626 6.41231C15.6232 6.52489 15.8365 6.68184 15.9994 6.87438C15.4988 3.31131 12.6851 0.494623 9.125 0C9.31455 0.1629 9.47449 0.376148 9.58707 0.636789Z",
-              fill: "#999999"
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            "path",
-            {
-              d: "M0.636791 6.41231L1.63492 5.98584C3.59268 5.15059 5.15059 3.59268 5.98876 1.63492L6.41528 0.636789C6.52781 0.376148 6.68775 0.1629 6.8773 0C3.31131 0.494623 0.497584 3.31131 0 6.87139C0.1629 6.68184 0.37615 6.52189 0.636791 6.40937V6.41231Z",
-              fill: "#999999"
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            "path",
-            {
-              d: "M15.3626 9.58017L14.3644 10.0067C12.4067 10.8419 10.8488 12.4028 10.0135 14.3606L9.58707 15.3557C9.47449 15.6164 9.31455 15.8296 9.125 15.9925C12.6851 15.4949 15.4988 12.6812 15.9964 9.12109C15.8335 9.31065 15.6203 9.47059 15.3596 9.58317L15.3626 9.58017Z",
-              fill: "#999999"
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            "path",
-            {
-              d: "M6.4153 15.3587L5.98878 14.3635C5.15355 12.4057 3.59268 10.8478 1.63492 10.0096L0.636789 9.58311C0.37615 9.47059 0.1629 9.31359 0 9.12109C0.497584 12.6812 3.31131 15.4979 6.87139 15.9925C6.68184 15.8296 6.52189 15.6164 6.40937 15.3557L6.4153 15.3587Z",
-              fill: "#999999"
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            "path",
-            {
-              d: "M4.37473 7.21715L4.86639 7.00685C5.83193 6.59514 6.59903 5.82804 7.01074 4.86248L7.22104 4.37082C7.51425 3.68368 8.49163 3.68368 8.78489 4.37082L8.99514 4.86248C9.40685 5.82804 10.1739 6.59514 11.1395 7.00685L11.6312 7.21715C12.3183 7.51036 12.3183 8.4848 11.6312 8.78095L11.1395 8.99125C10.1739 9.40296 9.40685 10.1701 8.99514 11.1356L8.78489 11.6273C8.49163 12.3144 7.51425 12.3144 7.22104 11.6273L7.01074 11.1356C6.59903 10.1701 5.83193 9.40296 4.86639 8.99125L4.37473 8.78095C3.68759 8.48774 3.68759 7.5133 4.37473 7.21715Z",
-              fill: "currentColor"
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsx("defs", { children: /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip0_13294_89003", children: /* @__PURE__ */ jsxRuntime.jsx("rect", { width: "16", height: "16", fill: "white" }) }) })
-      ]
-    }
-  );
-};
 const MetaMaskIcon = (props) => {
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "svg",
@@ -3444,10 +3392,7 @@ const Details = () => {
         DetailsRow,
         {
           label: t2("transaction.route"),
-          value: /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center gap-2", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(StargateIcon, { className: "w-4 h-4" }),
-            /* @__PURE__ */ jsxRuntime.jsx("p", { className: "", children: routeText })
-          ] })
+          value: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex items-center gap-2", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "", children: routeText }) })
         }
       ),
       /* @__PURE__ */ jsxRuntime.jsx(
@@ -6771,6 +6716,7 @@ const SettingsModal = ({ isOpen, onClose }) => {
     }
   ) });
 };
+const TOKEN_ROW_HEIGHT = 52;
 const TokenRow = ({
   symbol,
   name,
@@ -6822,17 +6768,21 @@ const TokenSelectModal = ({
   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, setFromChain, chains } = useChainsStore();
   const { assetMatrix, selectedAssetSymbol } = useTokensStore();
-  const { hasAnyWallet } = useConnectedWalletsStore();
+  const { hasAnyWallet, hasWalletForChain } = useConnectedWalletsStore();
   const { getBalance, query: balancesQuery } = useBalances(
     fromChain?.chainKey,
     srcAddress
   );
+  const hasSourceWallet = react.useCallback(() => {
+    return hasWalletForChain(fromChain?.chainKey);
+  }, [hasWalletForChain, fromChain?.chainKey]);
   react.useEffect(() => {
-    if (!hasAnyWallet()) setTab("all");
-  }, [hasAnyWallet]);
+    if (!hasSourceWallet()) setTab("all");
+  }, [hasSourceWallet]);
   const getTokenUsdValue = react.useCallback(
     (symbol, price) => {
       const bal = getBalance(symbol);
@@ -6899,7 +6849,7 @@ const TokenSelectModal = ({
     getTokenUsdValue
   ]);
   const myTokens = groupedTokens.withBalance;
-  const effectiveTab = hasAnyWallet() ? tab : "all";
+  const effectiveTab = hasSourceWallet() ? tab === "my" && myTokens.length === 0 && !manualTabSwitch ? "all" : tab : "all";
   react.useEffect(() => {
     if (query.trim() !== "" && tab === "my" && myTokens.length === 0 && !manualTabSwitch) {
       setTab("all");
@@ -6926,14 +6876,17 @@ const TokenSelectModal = ({
     if (!isOpen) resetState();
   }, [isOpen, resetState]);
   react.useEffect(() => () => resetState(), [resetState]);
-  const onPick = (sym, willChangeSrcChain = false) => {
-    if (willChangeSrcChain) {
-      const newChain = findFirstAvailableChain(sym);
-      if (newChain && setFromChain) setFromChain(newChain);
-    }
-    onChangeAsset(sym);
-    handleClose();
-  };
+  const onPick = react.useCallback(
+    (sym, willChangeSrcChain = false) => {
+      if (willChangeSrcChain) {
+        const newChain = findFirstAvailableChain(sym);
+        if (newChain && setFromChain) setFromChain(newChain);
+      }
+      onChangeAsset(sym);
+      handleClose();
+    },
+    [findFirstAvailableChain, handleClose, onChangeAsset, setFromChain]
+  );
   const tokensToRender = react.useMemo(() => {
     if (effectiveTab === "my") {
       return myTokens.map((token) => ({
@@ -6961,6 +6914,103 @@ const TokenSelectModal = ({
     [groupedTokens.willChangeSrcChain]
   );
   const hasNoResults = tokensToRender.length === 0 && willChangeSrcTokens.length === 0;
+  const virtualItems = react.useMemo(() => {
+    const items2 = tokensToRender.map(
+      ({ token, willChangeSrc }) => ({
+        type: "token",
+        data: { token, willChangeSrc }
+      })
+    );
+    if (effectiveTab === "all" && willChangeSrcTokens.length > 0) {
+      items2.push({
+        type: "header",
+        text: t2("bridge.willChangeSourceChain")
+      });
+      items2.push(
+        ...willChangeSrcTokens.map(({ token, willChangeSrc }) => ({
+          type: "token",
+          data: { token, willChangeSrc }
+        }))
+      );
+    }
+    return items2;
+  }, [effectiveTab, tokensToRender, t2, willChangeSrcTokens]);
+  react.useLayoutEffect(() => {
+    const updateHeight = () => {
+      const container2 = document.getElementById("token-select-list");
+      console.log("CONTAINER", container2);
+      if (!container2) return;
+      const height = container2.getBoundingClientRect().height;
+      if (height > 0) {
+        setListHeight(height);
+      }
+    };
+    updateHeight();
+    const timeout1 = setTimeout(updateHeight, 0);
+    const timeout2 = setTimeout(updateHeight, 300);
+    const resizeObserver = typeof ResizeObserver !== "undefined" ? new ResizeObserver(() => {
+      updateHeight();
+    }) : void 0;
+    const container = document.getElementById("token-select-list");
+    if (container) resizeObserver?.observe(container);
+    return () => {
+      clearTimeout(timeout1);
+      clearTimeout(timeout2);
+      resizeObserver?.disconnect();
+    };
+  }, [isOpen, hasSourceWallet]);
+  const VirtualRow = react.useCallback(
+    ({ index, style }) => {
+      const item = virtualItems[index];
+      if (!item) return null;
+      if (item.type === "header") {
+        return /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            style: { ...style, height: TOKEN_ROW_HEIGHT },
+            className: "px-5 flex leading-4 text-base py-2 text-muted-foreground uppercase mt-8",
+            children: /* @__PURE__ */ jsxRuntime.jsx("p", { children: item.text })
+          }
+        );
+      }
+      const { token, willChangeSrc } = item.data;
+      const bal = getBalance(token.symbol);
+      const usd = getTokenUsdValue(token.symbol, token.price?.usd);
+      const isSelected = selectedAssetSymbol?.toUpperCase() === token.symbol.toUpperCase();
+      return /* @__PURE__ */ jsxRuntime.jsx("div", { style: { ...style, height: TOKEN_ROW_HEIGHT }, children: /* @__PURE__ */ jsxRuntime.jsx(
+        TokenRow,
+        {
+          symbol: token.symbol,
+          name: token.name,
+          isSelected: !!isSelected,
+          hasAnyWallet: hasAnyWallet(),
+          balance: bal,
+          usdValue: usd,
+          isBalanceLoading: balancesQuery.isLoading || balancesQuery.isFetching,
+          onPick: () => onPick(token.symbol, willChangeSrc)
+        }
+      ) });
+    },
+    [
+      balancesQuery.isFetching,
+      balancesQuery.isLoading,
+      getBalance,
+      getTokenUsdValue,
+      hasAnyWallet,
+      onPick,
+      selectedAssetSymbol,
+      virtualItems
+    ]
+  );
+  const itemKey = react.useCallback(
+    (index) => {
+      const item = virtualItems[index];
+      if (!item) return index;
+      if (item.type === "header") return `header-${index}-${item.text}`;
+      return `${effectiveTab}:${item.data.token.symbol}:${item.data.willChangeSrc ? "will" : "on"}`;
+    },
+    [effectiveTab, virtualItems]
+  );
   return /* @__PURE__ */ jsxRuntime.jsx(dialog.Dialog, { open: isOpen, onOpenChange: (open) => !open && handleClose(), children: /* @__PURE__ */ jsxRuntime.jsxs(dialog.DialogContent, { className: "max-h-[90dvh] h-[90dvh] overflow-hidden flex flex-col p-10 pt-7", children: [
     /* @__PURE__ */ jsxRuntime.jsx(dialog.DialogHeader, { className: "text-left", children: /* @__PURE__ */ jsxRuntime.jsx(dialog.DialogTitle, { className: "text-2xl leading-8", children: t2("bridge.selectToken") }) }),
     /* @__PURE__ */ jsxRuntime.jsx(
@@ -6971,11 +7021,11 @@ const TokenSelectModal = ({
         onChange: setQuery
       }
     ),
-    hasAnyWallet() && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-2", children: [
-      myTokens.length !== 0 && /* @__PURE__ */ jsxRuntime.jsx(
+    hasSourceWallet() && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
         button.Button,
         {
-          variant: tab === "my" ? "default" : "ghost",
+          variant: effectiveTab === "my" ? "default" : "ghost",
           onClick: () => {
             setTab("my");
             setManualTabSwitch(true);
@@ -6983,7 +7033,7 @@ const TokenSelectModal = ({
           size: "sm",
           className: utils$1.cn(
             "px-4 cursor-pointer",
-            tab !== "my" && "bg-muted hover:bg-accent"
+            effectiveTab !== "my" && "bg-muted hover:bg-accent"
           ),
           children: t2("bridge.myTokens")
         }
@@ -6991,7 +7041,7 @@ const TokenSelectModal = ({
       /* @__PURE__ */ jsxRuntime.jsx(
         button.Button,
         {
-          variant: tab === "all" ? "default" : "ghost",
+          variant: effectiveTab === "all" ? "default" : "ghost",
           onClick: () => {
             setTab("all");
             setManualTabSwitch(true);
@@ -6999,58 +7049,27 @@ const TokenSelectModal = ({
           size: "sm",
           className: utils$1.cn(
             "px-4 cursor-pointer",
-            tab !== "all" && "bg-muted hover:bg-accent"
+            effectiveTab !== "all" && "bg-muted hover:bg-accent"
           ),
           children: t2("bridge.allTokens")
         }
       )
     ] }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 overflow-y-auto -mx-5", children: hasNoResults ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground px-12 py-2 h-28 flex items-center justify-center text-center", children: t2("bridge.tokenNotFound") }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { id: "token-select-list", className: "flex-1 -mx-5 min-h-0", children: hasNoResults ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground px-12 py-2 h-28 flex items-center justify-center text-center", children: t2("bridge.tokenNotFound") }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
       effectiveTab === "my" && myTokens.length === 0 && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "leading-4 px-5 text-base text-muted-foreground uppercase py-2", children: t2("bridge.noBalancesFound") }),
-      tokensToRender.map(({ token, willChangeSrc }) => {
-        const bal = getBalance(token.symbol);
-        const usd = getTokenUsdValue(token.symbol, token.price?.usd);
-        const isSelected = selectedAssetSymbol?.toUpperCase() === token.symbol.toUpperCase();
-        return /* @__PURE__ */ jsxRuntime.jsx(
-          TokenRow,
-          {
-            symbol: token.symbol,
-            name: token.name,
-            isSelected: !!isSelected,
-            hasAnyWallet: hasAnyWallet(),
-            balance: bal,
-            usdValue: usd,
-            isBalanceLoading: balancesQuery.isLoading || balancesQuery.isFetching,
-            onPick: () => onPick(token.symbol, willChangeSrc)
-          },
-          `${effectiveTab}:${token.symbol}`
-        );
-      }),
-      effectiveTab === "all" && willChangeSrcTokens.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-5 flex leading-4 text-base py-2 text-muted-foreground uppercase mt-8", children: /* @__PURE__ */ jsxRuntime.jsx("p", { children: t2("bridge.willChangeSourceChain") }) }),
-        willChangeSrcTokens.map(({ token, willChangeSrc }) => {
-          const bal = getBalance(token.symbol);
-          const usd = getTokenUsdValue(
-            token.symbol,
-            token.price?.usd
-          );
-          const isSelected = selectedAssetSymbol?.toUpperCase() === token.symbol.toUpperCase();
-          return /* @__PURE__ */ jsxRuntime.jsx(
-            TokenRow,
-            {
-              symbol: token.symbol,
-              name: token.name,
-              isSelected: !!isSelected,
-              hasAnyWallet: hasAnyWallet(),
-              balance: bal,
-              usdValue: usd,
-              isBalanceLoading: balancesQuery.isLoading || balancesQuery.isFetching,
-              onPick: () => onPick(token.symbol, willChangeSrc)
-            },
-            `will:${token.symbol}`
-          );
-        })
-      ] })
+      /* @__PURE__ */ jsxRuntime.jsx(
+        reactWindow.FixedSizeList,
+        {
+          height: listHeight,
+          itemCount: virtualItems.length,
+          itemSize: TOKEN_ROW_HEIGHT,
+          width: "100%",
+          itemKey,
+          className: "[&::-webkit-scrollbar]:w-1 [&::-webkit-scrollbar-track]:bg-transparent [&::-webkit-scrollbar-thumb]:bg-muted-foreground/20 [&::-webkit-scrollbar-thumb]:rounded-full hover:[&::-webkit-scrollbar-thumb]:bg-muted-foreground/30",
+          overscanCount: 5,
+          children: VirtualRow
+        }
+      )
     ] }) })
   ] }) });
 };
@@ -25896,7 +25915,7 @@ class WalletConnectModal {
   }
   async initUi() {
     if (typeof window !== "undefined") {
-      await Promise.resolve().then(() => require("./index-CsqeJOar.cjs"));
+      await Promise.resolve().then(() => require("./index-DJbbVeMD.cjs"));
       const modal = document.createElement("wcm-modal");
       document.body.insertAdjacentElement("beforeend", modal);
       OptionsCtrl.setIsUiLoaded(true);
@@ -26618,4 +26637,4 @@ exports.useSettingsStore = useSettingsStore;
 exports.useSwapModel = useSwapModel;
 exports.useTokensStore = useTokensStore;
 exports.useTransactionStore = useTransactionStore;
-//# sourceMappingURL=index-BpblK2_8.cjs.map
+//# sourceMappingURL=index-BXp-N4UF.cjs.map