@rash2x/bridge-widget 0.3.0 → 0.3.1

package/dist/evaa-bridge.mjs

@@ -31,7 +31,7 @@ import { CardHeader, CardTitle, CardAction, Card, CardContent, CardFooter } from
 import { Badge } from "@/components/ui/badge";
 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", "tronLink": "TronLink", "addTronWallet": "Add Tron wallet", "comingSoon": "Coming Soon", "connected": "CONNECTED", "disconnect": "Disconnect", "chooseWallet": "Choose 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", "searchToken": "Search token", "searchDestinationChain": "Search destination chain", "myTokens": "My tokens", "allTokens": "All tokens", "willChangeSourceChain": "Will change source network", "willChangeSourceNetworkAndToken": "Will change source network and token", "noBalancesFound": "No balances found.", "noResults": "No results", "sendToAnotherAddress": "Send to another address", "youWillReceive": "You will receive", "anotherAddressPlaceholder": "Address", "addressDoesntMatch": "Address doesn't match the {{network}} network", "checkBeforeTransfer": "Check correctness before transfer" };
+const bridge$1 = { "max": "Max", "sourceNetwork": "Source network", "destinationNetwork": "Destination network", "selectToken": "Select token", "selectNetwork": "Select network", "searchToken": "Search token", "searchDestinationChain": "Search destination chain", "myTokens": "My tokens", "allTokens": "All tokens", "willChangeSourceChain": "Will change source network", "willChangeSourceNetworkAndToken": "Will change source token", "noBalancesFound": "No balances found.", "noResults": "No results", "sendToAnotherAddress": "Send to another address", "youWillReceive": "You will receive", "anotherAddressPlaceholder": "Address", "addressDoesntMatch": "Address doesn't match the {{network}} network", "checkBeforeTransfer": "Check correctness before transfer" };
 const transaction$1 = { "enterAmount": "Enter amount", "transfer": "Transfer", "getQuote": "Get quote", "failed": "Transaction Failed", "confirm": "Confirm transaction", "signTransaction": "Sign in transaction in wallet", "quoting": "Quoting...", "inProgress": "Processing...", "checkingBalance": "Checking balance...", "insufficientBalance": "Insufficient balance", "amountTooSmall": "Min {{min}}", "amountTooLarge": "Max {{max}}", "success": "Success", "successTitle": "Success", "done": "Done", "hashCopied": "Hash copied to clipboard", "bridged": "Bridged", "transferTitle": "Transfer", "hash": "Hash", "finalFee": "Final Fee", "route": "Route", "estTime": "Est. Time", "slippage": "Slippage", "minimumReceived": "Minimum received", "totalFee": "Total Fee", "noRouteFound": "No route found", "notEnoughGas": "Not enough gas", "noRouteFoundForSettings": "No route found for current settings.", "tryAdjustSettings": "Try disabling Gas on Destination, or adjust amount/networks.", "quoteError": "Quote error" };
 const app$1 = { "stargateWidgetName": "Stargate Bridge Widget", "liveWidget": "Live Widget", "getStarted": "Get Started" };
 const settings$1 = { "title": "Settings", "gasOnDestination": "Gas on destination", "slippageTolerance": "Slippage tolerance", "routePriority": "Route Priority", "highSlippageWarning": "High slippage warning", "gasPresets": { "auto": "Auto", "none": "None", "medium": "Medium", "max": "Max" }, "routePresets": { "fastest": "Fastest", "cheapest": "Cheapest", "recommended": "Recommended" } };
@@ -47,7 +47,7 @@ const en = {
 };
 const common = { "connecting": "Подключение…", "initializing": "Инициализация...", "loading": "Загрузка...", "paste": "вставить", "close": "Закрыть", "zeroPlaceholder": "0", "nativeToken": "Нативный токен" };
 const wallets = { "addTonWallet": "Добавить TON кошелёк", "addEvmWallet": "Добавить EVM кошелёк", "connectTonWallet": "Подключить TON кошелёк", "connectEvmWallet": "Подключить EVM кошелёк", "initializingMetamask": "Инициализация MetaMask SDK...", "initializingTronlink": "Инициализация TronLink...", "failedToConnectTon": "Не удалось подключиться к TON кошельку", "failedToDisconnect": "Не удалось отключиться", "metamaskConnectionError": "Ошибка подключения MetaMask", "failedToConnectMetamask": "Не удалось подключиться к MetaMask", "failedToDisconnectMetamask": "Не удалось отключиться от MetaMask", "selectWallet": "Выберите кошелёк", "tonWallets": "TON", "evmWallets": "EVM", "tronWallets": "TRON", "tonconnect": "TonConnect", "metaMask": "WalletConnect", "tronLink": "TronLink", "addTronWallet": "Добавить Tron кошелёк", "comingSoon": "Скоро", "connected": "ПОДКЛЮЧЕНО", "disconnect": "Отключить", "chooseWallet": "Выберите кошелёк", "oneWalletPerEnv": "Можно подключить только один кошелёк на окружение.", "connect": "Подключить", "connectTronWallet": "Подключить Tron кошелёк", "connectWallet": "Подключить кошелёк" };
-const bridge = { "max": "Макс", "sourceNetwork": "Исходная сеть", "destinationNetwork": "Целевая сеть", "selectToken": "Выбрать токен", "selectNetwork": "Выбрать сеть", "searchToken": "Поиск токена", "searchDestinationChain": "Поиск целевой сети", "myTokens": "Мои токены", "allTokens": "Все токены", "willChangeSourceChain": "Сменит исходную сеть", "willChangeSourceNetworkAndToken": "Сменит исходную сеть и токен", "noBalancesFound": "Балансы не найдены.", "noResults": "Нет результатов", "sendToAnotherAddress": "Отправить на другой адрес", "youWillReceive": "Вы получите", "anotherAddressPlaceholder": "Адрес", "addressDoesntMatch": "Адрес не соответствует сети {{network}}", "checkBeforeTransfer": "Проверьте корректность перед переводом" };
+const bridge = { "max": "Макс", "sourceNetwork": "Исходная сеть", "destinationNetwork": "Целевая сеть", "selectToken": "Выбрать токен", "selectNetwork": "Выбрать сеть", "searchToken": "Поиск токена", "searchDestinationChain": "Поиск целевой сети", "myTokens": "Мои токены", "allTokens": "Все токены", "willChangeSourceChain": "Сменит исходную сеть", "willChangeSourceNetworkAndToken": "Сменит исходный токен", "noBalancesFound": "Балансы не найдены.", "noResults": "Нет результатов", "sendToAnotherAddress": "Отправить на другой адрес", "youWillReceive": "Вы получите", "anotherAddressPlaceholder": "Адрес", "addressDoesntMatch": "Адрес не соответствует сети {{network}}", "checkBeforeTransfer": "Проверьте корректность перед переводом" };
 const transaction = { "enterAmount": "Введите сумму", "transfer": "Перевести", "getQuote": "Получить котировку", "quoting": "Расчет котировки...", "failed": "Ошибка транзакции", "confirm": "Подтвердите транзакцию", "signTransaction": "Подпишите транзакцию в кошельке", "inProgress": "Выполнение...", "checkingBalance": "Проверка баланса...", "insufficientBalance": "Недостаточно средств", "amountTooSmall": "Минимум {{min}}", "amountTooLarge": "Максимум {{max}}", "success": "Успех", "successTitle": "Успех", "done": "Готово", "hashCopied": "Хэш скопирован в буфер обмена", "bridged": "Переведено", "transferTitle": "Перевод", "hash": "Хэш", "finalFee": "Итоговая комиссия", "route": "Маршрут", "estTime": "Время", "slippage": "Проскальзывание", "minimumReceived": "Минимум к получению", "totalFee": "Общая комиссия", "noRouteFound": "Маршрут не найден", "notEnoughGas": "Недостаточно газа", "noRouteFoundForSettings": "Маршрут не найден для текущих настроек.", "tryAdjustSettings": "Попробуйте отключить Gas on Destination или измените сумму/сети.", "quoteError": "Ошибка котировки" };
 const app = { "stargateWidgetName": "Виджет Stargate Bridge", "liveWidget": "Живой виджет", "getStarted": "Начало работы" };
 const settings = { "title": "Настройки", "gasOnDestination": "Газ на назначении", "slippageTolerance": "Толерантность к проскальзыванию", "routePriority": "Приоритет маршрута", "highSlippageWarning": "Высокое проскальзывание", "gasPresets": { "auto": "Авто", "none": "Нет", "medium": "Средний", "max": "Макс" }, "routePresets": { "fastest": "Быстрейший", "cheapest": "Дешевейший", "recommended": "Рекомендуемый" } };
@@ -2262,7 +2262,7 @@ const SwapButton = () => {
       variant: "secondary",
       size: "sm",
       className: cn(
-        "bg-card text-card-foreground hover:text-card-foreground backdrop-blur-md h-9",
+        "backdrop-blur-md h-9 w-9",
         "absolute top-1/2 -translate-y-1/2 left-1/2 -translate-x-1/2",
         !canSwap || isSwapping ? "opacity-50 cursor-not-allowed" : "hover:scale-110"
       ),
@@ -2452,7 +2452,6 @@ const ChainSelectModal = ({
   const [query, setQuery] = useState("");
   const { setFromChain, chains, fromChain, toChain } = useChainsStore();
   const { assetMatrix, selectedAssetSymbol, setSelectedAssetSymbol } = useTokensStore();
-  console.log("allowedItems", allowedItems);
   const handleClose = useCallback(() => {
     setQuery("");
     onClose();
@@ -2516,7 +2515,11 @@ const ChainSelectModal = ({
     const filtered = q ? (items ?? []).filter(
       (c) => c.name.toLowerCase().includes(q) || c.chainKey.toLowerCase().includes(q)
     ) : items ?? [];
-    const groups = { available: [], willChangeSrc: [], willChangeTokenAndSrc: [] };
+    const groups = {
+      available: [],
+      willChangeSrc: [],
+      willChangeTokenAndSrc: []
+    };
     for (const chain of filtered) {
       const isAllowed = allowedItems?.some((c) => c.chainKey === chain.chainKey) || false;
       if (isAllowed) {
@@ -2537,7 +2540,13 @@ const ChainSelectModal = ({
     groups.willChangeSrc.sort((a, b) => a.name.localeCompare(b.name));
     groups.willChangeTokenAndSrc.sort((a, b) => a.name.localeCompare(b.name));
     return groups;
-  }, [items, query, allowedItems, findCompatibleSrcChain, findCompatibleTokenAndSrcChain]);
+  }, [
+    items,
+    query,
+    allowedItems,
+    findCompatibleSrcChain,
+    findCompatibleTokenAndSrcChain
+  ]);
   const onChainPick = (chain, willChangeSrc = false, willChangeTokenAndSrc = false) => {
     if (willChangeTokenAndSrc) {
       const result = findCompatibleTokenAndSrcChain(chain);
@@ -2558,7 +2567,11 @@ const ChainSelectModal = ({
       Button,
       {
         onClick: () => onChainPick(chain, willChangeSrc, willChangeTokenAndSrc),
-        className: `w-full cursor-pointer flex shadow-none rounded-xs items-center justify-between gap-3 px-5 py-4 h-13 font-semibold capitalize bg-transparent hover:scale-100 hover:bg-accent ${isSelected ? "border border-ring" : ""}`,
+        className: cn(
+          "w-full cursor-pointer flex shadow-none rounded-xs items-center justify-between gap-3 px-5 py-4 h-13 font-semibold capitalize bg-transparent hover:scale-100 hover:bg-accent",
+          isSelected ? "bg-accent" : "",
+          willChangeSrc || willChangeTokenAndSrc ? "opacity-50 hover:opacity-100" : ""
+        ),
         children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
           /* @__PURE__ */ jsx(
             NetworkSymbol,
@@ -2574,8 +2587,8 @@ const ChainSelectModal = ({
       chain.chainKey
     );
   };
-  return /* @__PURE__ */ jsx(Dialog, { open: isOpen, onOpenChange: (open) => !open && handleClose(), children: /* @__PURE__ */ jsxs(DialogContent, { className: "md:max-h-[90dvh] md:h-[90dvh] overflow-hidden flex flex-col", children: [
-    /* @__PURE__ */ jsx(DialogHeader, { className: "text-left", children: /* @__PURE__ */ jsx(DialogTitle, { children: t("bridge.selectNetwork") }) }),
+  return /* @__PURE__ */ jsx(Dialog, { open: isOpen, onOpenChange: (open) => !open && handleClose(), children: /* @__PURE__ */ jsxs(DialogContent, { className: "md:max-h-[90dvh] md:h-[90dvh] overflow-hidden flex flex-col p-10", children: [
+    /* @__PURE__ */ jsx(DialogHeader, { className: "text-left", children: /* @__PURE__ */ jsx(DialogTitle, { className: "text-2xl leading-8", children: t("bridge.selectNetwork") }) }),
     /* @__PURE__ */ jsx(
       SearchInput,
       {
@@ -2588,13 +2601,25 @@ const ChainSelectModal = ({
     /* @__PURE__ */ jsxs("div", { className: "flex-1 overflow-y-auto", children: [
       groupedChains.available.length > 0 && groupedChains.available.map((c) => renderChainItem(c, false)),
       groupedChains.willChangeSrc.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsx("p", { className: `px-5 py-2 leading-4 text-base font-semibold text-muted-foreground uppercase ${groupedChains.available.length > 0 ? "mt-10" : ""}`, children: t("bridge.willChangeSourceChain") }),
+        /* @__PURE__ */ jsx(
+          "p",
+          {
+            className: `px-5 py-2 leading-4 text-base font-semibold text-muted-foreground uppercase ${groupedChains.available.length > 0 ? "mt-10" : ""}`,
+            children: t("bridge.willChangeSourceChain")
+          }
+        ),
         groupedChains.willChangeSrc.map(
           (c) => renderChainItem(c, true, false)
         )
       ] }),
       groupedChains.willChangeTokenAndSrc.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsx("p", { className: `px-5 py-2 leading-4 text-base font-semibold text-muted-foreground uppercase ${groupedChains.available.length > 0 || groupedChains.willChangeSrc.length > 0 ? "mt-10" : ""}`, children: t("bridge.willChangeSourceNetworkAndToken") }),
+        /* @__PURE__ */ jsx(
+          "p",
+          {
+            className: `px-5 py-2 leading-4 text-base font-semibold text-muted-foreground uppercase ${groupedChains.available.length > 0 || groupedChains.willChangeSrc.length > 0 ? "mt-10" : ""}`,
+            children: t("bridge.willChangeSourceNetworkAndToken")
+          }
+        ),
         groupedChains.willChangeTokenAndSrc.map(
           (c) => renderChainItem(c, false, true)
         )
@@ -3942,9 +3967,9 @@ const WalletSelectModal = () => {
       wallets: tronWallets.filter(notConnected)
     }
   ].filter((category) => category.wallets.length > 0);
-  return /* @__PURE__ */ jsx(Dialog, { open: isOpen, onOpenChange: (open) => !open && onClose(), children: /* @__PURE__ */ jsxs(DialogContent, { children: [
+  return /* @__PURE__ */ jsx(Dialog, { open: isOpen, onOpenChange: (open) => !open && onClose(), children: /* @__PURE__ */ jsxs(DialogContent, { className: "p-10", children: [
     /* @__PURE__ */ jsxs(DialogHeader, { className: "text-left", children: [
-      /* @__PURE__ */ jsx(DialogTitle, { children: t("wallets.chooseWallet") }),
+      /* @__PURE__ */ jsx(DialogTitle, { className: "text-2xl leading-8", children: t("wallets.chooseWallet") }),
       /* @__PURE__ */ jsx(DialogDescription, { children: t("wallets.oneWalletPerEnv") })
     ] }),
     /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4", children: [
@@ -6021,8 +6046,8 @@ const SettingsModal = ({ isOpen, onClose }) => {
   );
   const activeBtn = "bg-primary hover:bg-primary/80 text-primary-foreground transition-colors";
   const notActiveBtn = "bg-accent hover:bg-accent/80 text-accent-foreground transition-colors";
-  return /* @__PURE__ */ jsx(Dialog, { open: isOpen, onOpenChange: (open) => !open && onClose(), children: /* @__PURE__ */ jsxs(DialogContent, { onOpenAutoFocus: (e) => e.preventDefault(), children: [
-    /* @__PURE__ */ jsx(DialogHeader, { className: "text-left", children: /* @__PURE__ */ jsx(DialogTitle, { children: t("settings.title") }) }),
+  return /* @__PURE__ */ jsx(Dialog, { open: isOpen, onOpenChange: (open) => !open && onClose(), children: /* @__PURE__ */ jsxs(DialogContent, { onOpenAutoFocus: (e) => e.preventDefault(), className: "p-10", children: [
+    /* @__PURE__ */ jsx(DialogHeader, { className: "text-left", children: /* @__PURE__ */ jsx(DialogTitle, { className: "text-2xl leading-8", children: t("settings.title") }) }),
     /* @__PURE__ */ jsxs("div", { className: "space-y-5", children: [
       /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-5", children: [
         /* @__PURE__ */ jsxs("div", { className: "flex justify-between items-center", children: [
@@ -6050,9 +6075,8 @@ const SettingsModal = ({ isOpen, onClose }) => {
             Badge,
             {
               onClick: () => setGasPreset(g),
-              size: "lg",
               className: cn(
-                "cursor-pointer",
+                "cursor-pointer h-7 rounded px-2",
                 gasPreset === g ? activeBtn : notActiveBtn
               ),
               children: t(`settings.gasPresets.${g}`)
@@ -6077,13 +6101,12 @@ const SettingsModal = ({ isOpen, onClose }) => {
           /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2", children: slippagePresets.map((p) => /* @__PURE__ */ jsx(
             Badge,
             {
-              size: "lg",
               onClick: () => {
                 const bps = parseFloat(p.replace("%", "")) * 100;
                 setSlippageBps(bps);
               },
               className: cn(
-                "cursor-pointer",
+                "cursor-pointer h-7 rounded px-2",
                 activeSlippagePreset === p ? activeBtn : notActiveBtn
               ),
               children: p
@@ -6101,10 +6124,9 @@ const SettingsModal = ({ isOpen, onClose }) => {
         /* @__PURE__ */ jsx("div", { className: "flex items-center justify-end gap-2", children: routePresets.map((r) => /* @__PURE__ */ jsx(
           Badge,
           {
-            size: "lg",
             onClick: () => setRoutePriority(r),
             className: cn(
-              "cursor-pointer",
+              "cursor-pointer h-7 rounded px-2",
               routePriority === r ? activeBtn : notActiveBtn
             ),
             children: t(`settings.routePresets.${r}`)
@@ -6129,7 +6151,7 @@ const TokenRow = ({
     Button,
     {
       onClick: onPick,
-      className: `w-full rounded-xs bg-transparent flex items-center justify-between gap-3 px-3 hover:bg-accent hover:scale-100 ${isSelected ? "bg-accent hover:bg-accent/50" : ""}`,
+      className: `w-full px-5 rounded-xs bg-transparent flex items-center justify-between gap-3 hover:bg-accent hover:scale-100 ${isSelected ? "bg-accent hover:bg-accent/50" : ""}`,
       children: [
         /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
           /* @__PURE__ */ jsx(
@@ -6141,15 +6163,15 @@ const TokenRow = ({
             }
           ),
           /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-start gap-1", children: [
-            /* @__PURE__ */ jsx("p", { className: "font-semibold text-foreground text-lg leading-4 truncate flex items-center gap-1", children: symbol }),
-            /* @__PURE__ */ jsx("div", { className: "text-xs leading-3 font-semibold text-muted-foreground truncate", children: name })
+            /* @__PURE__ */ jsx("p", { className: "font-semibold text-foreground text-sm leading-4 truncate flex items-center gap-1", children: symbol }),
+            /* @__PURE__ */ jsx("div", { className: "text-xs leading-3 text-muted-foreground truncate", children: name })
           ] })
         ] }),
         /* @__PURE__ */ jsx("div", { className: "text-right space-y-1", children: isBalanceLoading && hasAnyWallet ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-end gap-1", children: [
           /* @__PURE__ */ jsx(Skeleton, { className: "h-5 w-16 rounded-md" }),
           /* @__PURE__ */ jsx(Skeleton, { className: "h-3 w-12 rounded-md" })
         ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
-          /* @__PURE__ */ jsx("div", { className: "font-semibold text-foreground text-lg leading-4 truncate", children: hasAnyWallet ? formatBalance(balance) : "—" }),
+          /* @__PURE__ */ jsx("div", { className: "font-semibold text-foreground text-sm leading-4 truncate", children: hasAnyWallet ? formatBalance(balance) : "—" }),
           /* @__PURE__ */ jsx("div", { className: "text-xs leading-3 text-muted-foreground/50", children: hasAnyWallet && balance > 0 && usdValue > 0 ? formatUsd(usdValue) : "—" })
         ] }) })
       ]
@@ -6293,8 +6315,8 @@ const TokenSelectModal = ({
     [groupedTokens.willChangeSrcChain]
   );
   const hasNoResults = tokensToRender.length === 0 && willChangeSrcTokens.length === 0;
-  return /* @__PURE__ */ jsx(Dialog, { open: isOpen, onOpenChange: (open) => !open && handleClose(), children: /* @__PURE__ */ jsxs(DialogContent, { className: "md:max-h-[90dvh] md:h-[90dvh] overflow-hidden flex flex-col", children: [
-    /* @__PURE__ */ jsx(DialogHeader, { className: "text-left", children: /* @__PURE__ */ jsx(DialogTitle, { children: t("bridge.selectToken") }) }),
+  return /* @__PURE__ */ jsx(Dialog, { open: isOpen, onOpenChange: (open) => !open && handleClose(), children: /* @__PURE__ */ jsxs(DialogContent, { className: "md:max-h-[90dvh] md:h-[90dvh] overflow-hidden flex flex-col p-10", children: [
+    /* @__PURE__ */ jsx(DialogHeader, { className: "text-left", children: /* @__PURE__ */ jsx(DialogTitle, { className: "text-2xl leading-8", children: t("bridge.selectToken") }) }),
     /* @__PURE__ */ jsx(
       SearchInput,
       {
@@ -6310,7 +6332,7 @@ const TokenSelectModal = ({
           variant: tab === "my" ? "default" : "ghost",
           onClick: () => setTab("my"),
           size: "sm",
-          className: cn(tab !== "my" && "bg-muted hover:bg-accent"),
+          className: cn("px-4", tab !== "my" && "bg-muted hover:bg-accent"),
           children: t("bridge.myTokens")
         }
       ),
@@ -6320,13 +6342,16 @@ const TokenSelectModal = ({
           variant: tab === "all" ? "default" : "ghost",
           onClick: () => setTab("all"),
           size: "sm",
-          className: cn(tab !== "all" && "bg-muted hover:bg-accent"),
+          className: cn(
+            "px-4",
+            tab !== "all" && "bg-muted hover:bg-accent"
+          ),
           children: t("bridge.allTokens")
         }
       )
     ] }),
-    /* @__PURE__ */ jsx("div", { className: "flex-1 overflow-auto px-1", children: hasNoResults ? /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground px-5 py-4", children: t("bridge.noResults") }) : /* @__PURE__ */ jsxs(Fragment, { children: [
-      effectiveTab === "my" && myTokens.length === 0 && /* @__PURE__ */ jsx("p", { className: "leading-4 text-base font-semibold text-muted-foreground uppercase py-2", children: t("bridge.noBalancesFound") }),
+    /* @__PURE__ */ jsx("div", { className: "flex-1 overflow-y-auto -mx-5", children: hasNoResults ? /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground px-5 py-4", children: t("bridge.noResults") }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+      effectiveTab === "my" && myTokens.length === 0 && /* @__PURE__ */ jsx("p", { className: "leading-4 px-5 text-base text-muted-foreground uppercase py-2", children: t("bridge.noBalancesFound") }),
       tokensToRender.map(({ token, willChangeSrc }) => {
         const bal = getBalance(token.symbol);
         const usd = getTokenUsdValue(token.symbol, token.price?.usd);
@@ -6347,7 +6372,7 @@ const TokenSelectModal = ({
         );
       }),
       effectiveTab === "all" && willChangeSrcTokens.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsx("div", { className: "px-5 flex leading-4 text-base py-2 font-semibold text-muted-foreground uppercase mt-8", children: /* @__PURE__ */ jsx("p", { children: t("bridge.willChangeSourceChain") }) }),
+        /* @__PURE__ */ jsx("div", { className: "px-5 flex leading-4 text-base py-2 text-muted-foreground uppercase mt-8", children: /* @__PURE__ */ jsx("p", { children: t("bridge.willChangeSourceChain") }) }),
         willChangeSrcTokens.map(({ token, willChangeSrc }) => {
           const bal = getBalance(token.symbol);
           const usd = getTokenUsdValue(