@rash2x/bridge-widget 0.3.1 → 0.3.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/evaa-bridge.cjs +175 -48
- package/dist/evaa-bridge.cjs.map +1 -1
- package/dist/evaa-bridge.mjs +177 -50
- package/dist/evaa-bridge.mjs.map +1 -1
- package/dist/styles.css +1 -1
- package/package.json +1 -1
package/dist/evaa-bridge.mjs
CHANGED
|
@@ -2,10 +2,10 @@ var __defProp = Object.defineProperty;
|
|
|
2
2
|
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
3
3
|
var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
|
4
4
|
import { jsx, jsxs, Fragment } from "react/jsx-runtime";
|
|
5
|
-
import { useEffect, useMemo, createContext, useContext, useState, useCallback, forwardRef } from "react";
|
|
5
|
+
import { useEffect, useMemo, createContext, useContext, useState, useCallback, forwardRef, useRef } from "react";
|
|
6
6
|
import { initReactI18next, I18nextProvider, useTranslation } from "react-i18next";
|
|
7
7
|
import i18n from "i18next";
|
|
8
|
-
import { Button } from "@/components/ui/button";
|
|
8
|
+
import { Button, buttonVariants } from "@/components/ui/button";
|
|
9
9
|
import { create } from "zustand";
|
|
10
10
|
import { useAccount, usePublicClient, useConnect, useDisconnect, useWalletClient } from "wagmi";
|
|
11
11
|
import { useWallet } from "@tronweb3/tronwallet-adapter-react-hooks";
|
|
@@ -31,7 +31,7 @@ import { CardHeader, CardTitle, CardAction, Card, CardContent, CardFooter } from
|
|
|
31
31
|
import { Badge } from "@/components/ui/badge";
|
|
32
32
|
const common$1 = { "connecting": "Connecting…", "initializing": "Initializing...", "loading": "Loading...", "paste": "paste", "close": "Close", "zeroPlaceholder": "0", "nativeToken": "Native Token" };
|
|
33
33
|
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" };
|
|
34
|
-
const bridge$1 = { "max": "Max", "sourceNetwork": "Source network", "destinationNetwork": "Destination network", "selectToken": "Select token", "selectNetwork": "Select network", "
|
|
34
|
+
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" };
|
|
35
35
|
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" };
|
|
36
36
|
const app$1 = { "stargateWidgetName": "Stargate Bridge Widget", "liveWidget": "Live Widget", "getStarted": "Get Started" };
|
|
37
37
|
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 = {
|
|
|
47
47
|
};
|
|
48
48
|
const common = { "connecting": "Подключение…", "initializing": "Инициализация...", "loading": "Загрузка...", "paste": "вставить", "close": "Закрыть", "zeroPlaceholder": "0", "nativeToken": "Нативный токен" };
|
|
49
49
|
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": "Подключить кошелёк" };
|
|
50
|
-
const bridge = { "max": "Макс", "sourceNetwork": "Исходная сеть", "destinationNetwork": "Целевая сеть", "selectToken": "Выбрать токен", "selectNetwork": "Выбрать сеть", "
|
|
50
|
+
const bridge = { "max": "Макс", "sourceNetwork": "Исходная сеть", "destinationNetwork": "Целевая сеть", "selectToken": "Выбрать токен", "selectNetwork": "Выбрать сеть", "selectSourceNetwork": "Выбрать исходную сеть", "selectDestinationNetwork": "Выбрать целевую сеть", "searchToken": "Поиск токена", "myTokens": "Мои токены", "allTokens": "Все токены", "search": "Поиск", "select": "Выбрать", "willChangeSourceChain": "Сменит исходную сеть", "willChangeSourceNetworkAndToken": "Сменит исходный токен", "noBalancesFound": "Балансы не найдены.", "noResults": "Нет результатов", "tokenNotFound": "Мы не смогли найти токен с таким названием или символом. Пожалуйста, попробуйте снова.", "chainNotFound": "Мы не смогли найти сеть с таким названием. Пожалуйста, попробуйте снова.", "sendToAnotherAddress": "Отправить на другой адрес", "youWillReceive": "Вы получите", "anotherAddressPlaceholder": "Адрес", "addressDoesntMatch": "Адрес не соответствует сети {{network}}", "checkBeforeTransfer": "Проверьте корректность перед переводом" };
|
|
51
51
|
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": "Ошибка котировки" };
|
|
52
52
|
const app = { "stargateWidgetName": "Виджет Stargate Bridge", "liveWidget": "Живой виджет", "getStarted": "Начало работы" };
|
|
53
53
|
const settings = { "title": "Настройки", "gasOnDestination": "Газ на назначении", "slippageTolerance": "Толерантность к проскальзыванию", "routePriority": "Приоритет маршрута", "highSlippageWarning": "Высокое проскальзывание", "gasPresets": { "auto": "Авто", "none": "Нет", "medium": "Средний", "max": "Макс" }, "routePresets": { "fastest": "Быстрейший", "cheapest": "Дешевейший", "recommended": "Рекомендуемый" } };
|
|
@@ -2262,7 +2262,7 @@ const SwapButton = () => {
|
|
|
2262
2262
|
variant: "secondary",
|
|
2263
2263
|
size: "sm",
|
|
2264
2264
|
className: cn(
|
|
2265
|
-
"backdrop-blur-md h-9 w-9",
|
|
2265
|
+
"backdrop-blur-md h-9 w-9 p-0",
|
|
2266
2266
|
"absolute top-1/2 -translate-y-1/2 left-1/2 -translate-x-1/2",
|
|
2267
2267
|
!canSwap || isSwapping ? "opacity-50 cursor-not-allowed" : "hover:scale-110"
|
|
2268
2268
|
),
|
|
@@ -2299,7 +2299,7 @@ const WalletBalance = (props) => {
|
|
|
2299
2299
|
variant: "ghost",
|
|
2300
2300
|
size: "sm",
|
|
2301
2301
|
onClick: onMaxClick,
|
|
2302
|
-
className: "h-auto p-0 px-0 text-xs font-medium
|
|
2302
|
+
className: "h-auto p-0 px-0 text-xs text-link font-medium underline hover:opacity-70 cursor-pointer rounded-none",
|
|
2303
2303
|
children: t("bridge.max")
|
|
2304
2304
|
}
|
|
2305
2305
|
)
|
|
@@ -2387,7 +2387,7 @@ const TokenInput = forwardRef(
|
|
|
2387
2387
|
[max, onAmountChange]
|
|
2388
2388
|
);
|
|
2389
2389
|
if (showSkeleton && readOnly) {
|
|
2390
|
-
return /* @__PURE__ */ jsx(Skeleton, { className: cn("h-8 my-2 w-1/3 rounded-md", className) });
|
|
2390
|
+
return /* @__PURE__ */ jsx(Skeleton, { className: cn("h-8 my-2 w-1/3 bg-secondary rounded-md", className) });
|
|
2391
2391
|
}
|
|
2392
2392
|
return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
|
|
2393
2393
|
Input,
|
|
@@ -2431,7 +2431,7 @@ const SearchInput = ({
|
|
|
2431
2431
|
{
|
|
2432
2432
|
placeholder,
|
|
2433
2433
|
className: cn(
|
|
2434
|
-
"w-full outline-none px-5 py-4 relative z-10 pl-16 bg-input border-
|
|
2434
|
+
"w-full outline-none px-5 py-4 relative z-10 pl-16 bg-input border transition-all border-transparent rounded-xs ring-0 leading-0 h-13 text-base focus-visible:border focus-visible:border-ring",
|
|
2435
2435
|
className
|
|
2436
2436
|
),
|
|
2437
2437
|
value,
|
|
@@ -2569,7 +2569,7 @@ const ChainSelectModal = ({
|
|
|
2569
2569
|
onClick: () => onChainPick(chain, willChangeSrc, willChangeTokenAndSrc),
|
|
2570
2570
|
className: cn(
|
|
2571
2571
|
"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",
|
|
2572
|
-
isSelected ? "
|
|
2572
|
+
isSelected ? "border border-ring" : "",
|
|
2573
2573
|
willChangeSrc || willChangeTokenAndSrc ? "opacity-50 hover:opacity-100" : ""
|
|
2574
2574
|
),
|
|
2575
2575
|
children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
|
|
@@ -2587,12 +2587,15 @@ const ChainSelectModal = ({
|
|
|
2587
2587
|
chain.chainKey
|
|
2588
2588
|
);
|
|
2589
2589
|
};
|
|
2590
|
-
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
|
|
2591
|
-
/* @__PURE__ */ jsx(DialogHeader, { className: "text-left", children: /* @__PURE__ */ jsx(DialogTitle, { className: "text-
|
|
2590
|
+
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: [
|
|
2591
|
+
/* @__PURE__ */ jsx(DialogHeader, { className: "text-left pb-0", children: /* @__PURE__ */ jsx(DialogTitle, { className: "text-xl leading-8", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-0", children: [
|
|
2592
|
+
/* @__PURE__ */ jsx("div", { children: t("bridge.select") }),
|
|
2593
|
+
/* @__PURE__ */ jsx("div", { children: t(isSource ? "bridge.sourceNetwork" : "bridge.destinationNetwork") })
|
|
2594
|
+
] }) }) }),
|
|
2592
2595
|
/* @__PURE__ */ jsx(
|
|
2593
2596
|
SearchInput,
|
|
2594
2597
|
{
|
|
2595
|
-
placeholder: t("bridge.
|
|
2598
|
+
placeholder: t("bridge.search"),
|
|
2596
2599
|
value: query,
|
|
2597
2600
|
onChange: setQuery,
|
|
2598
2601
|
className: "text-foreground placeholder:text-muted-foreground"
|
|
@@ -2624,7 +2627,7 @@ const ChainSelectModal = ({
|
|
|
2624
2627
|
(c) => renderChainItem(c, false, true)
|
|
2625
2628
|
)
|
|
2626
2629
|
] }),
|
|
2627
|
-
groupedChains.available.length === 0 && groupedChains.willChangeSrc.length === 0 && groupedChains.willChangeTokenAndSrc.length === 0 && /* @__PURE__ */ jsx("div", { className: "px-
|
|
2630
|
+
groupedChains.available.length === 0 && groupedChains.willChangeSrc.length === 0 && groupedChains.willChangeTokenAndSrc.length === 0 && /* @__PURE__ */ jsx("div", { className: "text-sm text-muted-foreground px-12 py-2 h-28 flex items-center justify-center text-center", children: t("bridge.chainNotFound") })
|
|
2628
2631
|
] })
|
|
2629
2632
|
] }) });
|
|
2630
2633
|
};
|
|
@@ -2634,6 +2637,52 @@ const useWalletSelectModal = create((set) => ({
|
|
|
2634
2637
|
onOpen: (addressType) => set({ isOpen: true, addressType }),
|
|
2635
2638
|
onClose: () => set({ isOpen: false, addressType: void 0 })
|
|
2636
2639
|
}));
|
|
2640
|
+
const EditIcon = (props) => {
|
|
2641
|
+
return /* @__PURE__ */ jsxs(
|
|
2642
|
+
"svg",
|
|
2643
|
+
{
|
|
2644
|
+
width: "18",
|
|
2645
|
+
height: "18",
|
|
2646
|
+
viewBox: "0 0 18 18",
|
|
2647
|
+
fill: "none",
|
|
2648
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
2649
|
+
...props,
|
|
2650
|
+
children: [
|
|
2651
|
+
/* @__PURE__ */ jsxs("g", { "clip-path": "url(#clip0_551_3851)", children: [
|
|
2652
|
+
/* @__PURE__ */ jsx(
|
|
2653
|
+
"path",
|
|
2654
|
+
{
|
|
2655
|
+
d: "M9.76159 5.01068L4.91742 9.85489C4.72585 10.0465 4.54793 10.4023 4.50687 10.6622L4.24687 12.5096C4.15108 13.1801 4.61636 13.6454 5.28688 13.5496L7.13425 13.2896C7.39425 13.2486 7.76372 13.0707 7.94161 12.8791L12.7858 8.03491C13.6206 7.20018 14.0174 6.2286 12.7858 4.99702C11.5679 3.77913 10.5963 4.17594 9.76159 5.01068Z",
|
|
2656
|
+
stroke: "currentColor",
|
|
2657
|
+
"stroke-miterlimit": "10",
|
|
2658
|
+
"stroke-linecap": "round",
|
|
2659
|
+
"stroke-linejoin": "round"
|
|
2660
|
+
}
|
|
2661
|
+
),
|
|
2662
|
+
/* @__PURE__ */ jsx(
|
|
2663
|
+
"path",
|
|
2664
|
+
{
|
|
2665
|
+
d: "M9.0625 5.70312C9.47303 7.18102 10.6225 8.33049 12.1004 8.74101",
|
|
2666
|
+
stroke: "currentColor",
|
|
2667
|
+
"stroke-miterlimit": "10",
|
|
2668
|
+
"stroke-linecap": "round",
|
|
2669
|
+
"stroke-linejoin": "round"
|
|
2670
|
+
}
|
|
2671
|
+
)
|
|
2672
|
+
] }),
|
|
2673
|
+
/* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsx("clipPath", { id: "clip0_551_3851", children: /* @__PURE__ */ jsx(
|
|
2674
|
+
"rect",
|
|
2675
|
+
{
|
|
2676
|
+
width: "12",
|
|
2677
|
+
height: "12",
|
|
2678
|
+
fill: "white",
|
|
2679
|
+
transform: "translate(3 3)"
|
|
2680
|
+
}
|
|
2681
|
+
) }) })
|
|
2682
|
+
]
|
|
2683
|
+
}
|
|
2684
|
+
);
|
|
2685
|
+
};
|
|
2637
2686
|
const prefixIcons = {
|
|
2638
2687
|
tronlink: /* @__PURE__ */ jsx(TronLinkIcon, { className: "w-5 h-5" }),
|
|
2639
2688
|
metamask: /* @__PURE__ */ jsx(MetaMaskIcon, { className: "w-5 h-5" }),
|
|
@@ -2691,7 +2740,8 @@ const WalletInlineButton = ({
|
|
|
2691
2740
|
className: "flex gap-1 cursor-pointer hover:opacity-60 hover:bg-transparent !px-0 pr-1 h-5",
|
|
2692
2741
|
children: [
|
|
2693
2742
|
/* @__PURE__ */ jsx("span", { children: isConnected ? prefixIcons[wallet] : null }),
|
|
2694
|
-
/* @__PURE__ */ jsx("span", { className: "leading-3 text-sm border-b border-dotted border-link text-link", children: buttonText })
|
|
2743
|
+
/* @__PURE__ */ jsx("span", { className: "leading-3 text-sm border-b border-dotted border-link text-link", children: buttonText }),
|
|
2744
|
+
isConnected && /* @__PURE__ */ jsx(EditIcon, { className: "text-link -ml-0.5" })
|
|
2695
2745
|
]
|
|
2696
2746
|
}
|
|
2697
2747
|
),
|
|
@@ -3107,12 +3157,12 @@ const Details = () => {
|
|
|
3107
3157
|
);
|
|
3108
3158
|
const symbol = (selectedAssetSymbol ?? dstToken?.symbol ?? "—").toUpperCase();
|
|
3109
3159
|
const isLoading = status === "loading";
|
|
3110
|
-
const receiveText = quoteDetails.outputAmount != null ? Number(quoteDetails.outputAmount).toFixed(6) : "0.00";
|
|
3160
|
+
const receiveText = quoteDetails.outputAmount != null ? Number(quoteDetails.outputAmount).toFixed(quote ? 6 : 2) : "0.00";
|
|
3111
3161
|
const etaText = quoteDetails.etaSeconds != null ? `≈ ${Math.max(1, Math.round(quoteDetails.etaSeconds / 60))}m` : "—";
|
|
3112
|
-
const totalFeeDisplay = gas.requiredNative > 0 ? `${gas.requiredNative.toFixed(6)} ${gas.nativeSym}` : "—";
|
|
3113
|
-
const currentSlippageText = formatPercentage(slippageBps);
|
|
3162
|
+
const totalFeeDisplay = !quote ? "—" : gas.requiredNative > 0 ? `${gas.requiredNative.toFixed(6)} ${gas.nativeSym}` : "—";
|
|
3163
|
+
const currentSlippageText = !quote ? "—" : formatPercentage(slippageBps);
|
|
3114
3164
|
const routeText = quote?.route ? getRouteDisplayName(quote.route) : t(`settings.routePresets.${routePriority}`);
|
|
3115
|
-
return /* @__PURE__ */ jsx(Accordion, { type: "single", collapsible: true, className: "w-full", children: /* @__PURE__ */ jsxs(AccordionItem, { value: "item-1", className: "bg-
|
|
3165
|
+
return /* @__PURE__ */ jsx(Accordion, { type: "single", collapsible: true, className: "w-full border-b-0", children: /* @__PURE__ */ jsxs(AccordionItem, { value: "item-1", className: "bg-card/50 rounded-sm", children: [
|
|
3116
3166
|
/* @__PURE__ */ jsx(AccordionTrigger, { className: "w-full gap-1 items-center py-6 px-5 rounded-b-sm data-[state=open]:pb-3", children: /* @__PURE__ */ jsxs("div", { className: "w-full flex items-center justify-between", children: [
|
|
3117
3167
|
/* @__PURE__ */ jsx("p", { className: "text-sm font-normal text-priority leading-4", children: t("bridge.youWillReceive", { defaultValue: "You will receive" }) }),
|
|
3118
3168
|
/* @__PURE__ */ jsxs("div", { className: "bg-transparent hover:bg-transparent shadow-none h-4 p-0 px-0 py-0 flex items-center gap-2", children: [
|
|
@@ -3808,7 +3858,6 @@ const SubmitButton = () => {
|
|
|
3808
3858
|
}
|
|
3809
3859
|
) });
|
|
3810
3860
|
};
|
|
3811
|
-
const buttonBaseClasses = "w-full bg-transparent flex shadow-none items-center justify-start gap-3 px-3 py-3 h-auto rounded-md hover:bg-accent hover:scale-100";
|
|
3812
3861
|
const WalletModalButton = (props) => {
|
|
3813
3862
|
const { t } = useTranslation();
|
|
3814
3863
|
const { icon: IconComponent, name, onClose } = props;
|
|
@@ -3817,24 +3866,33 @@ const WalletModalButton = (props) => {
|
|
|
3817
3866
|
const [isConnecting, setIsConnecting] = useState(false);
|
|
3818
3867
|
if (props.variant === "connected") {
|
|
3819
3868
|
const { address, onDisconnect } = props;
|
|
3820
|
-
return /* @__PURE__ */ jsx("div", { className: "-mx-3", children: /* @__PURE__ */ jsxs(
|
|
3821
|
-
|
|
3822
|
-
|
|
3823
|
-
|
|
3824
|
-
|
|
3825
|
-
|
|
3826
|
-
|
|
3827
|
-
|
|
3828
|
-
|
|
3829
|
-
|
|
3830
|
-
|
|
3831
|
-
|
|
3832
|
-
},
|
|
3833
|
-
|
|
3834
|
-
|
|
3835
|
-
|
|
3836
|
-
|
|
3837
|
-
|
|
3869
|
+
return /* @__PURE__ */ jsx("div", { className: "-mx-3", children: /* @__PURE__ */ jsxs(
|
|
3870
|
+
"div",
|
|
3871
|
+
{
|
|
3872
|
+
className: cn(
|
|
3873
|
+
buttonVariants({ variant: "ghost", size: "default" }),
|
|
3874
|
+
"rounded-xs w-full"
|
|
3875
|
+
),
|
|
3876
|
+
children: [
|
|
3877
|
+
/* @__PURE__ */ jsx(IconComponent, { className: "min-w-8 min-h-8" }),
|
|
3878
|
+
/* @__PURE__ */ jsxs("div", { className: "flex flex-col items-start min-w-0", children: [
|
|
3879
|
+
/* @__PURE__ */ jsx("p", { className: "font-semibold text-foreground text-sm leading-4 truncate", children: formatAddress(address) }),
|
|
3880
|
+
/* @__PURE__ */ jsx("div", { className: "text-xs leading-3 font-medium text-muted-foreground", children: name })
|
|
3881
|
+
] }),
|
|
3882
|
+
/* @__PURE__ */ jsx(
|
|
3883
|
+
"div",
|
|
3884
|
+
{
|
|
3885
|
+
onClick: () => {
|
|
3886
|
+
onDisconnect();
|
|
3887
|
+
onClose?.();
|
|
3888
|
+
},
|
|
3889
|
+
className: "text-sm ml-auto font-medium text-muted-foreground cursor-pointer hover:text-foreground transition-colors",
|
|
3890
|
+
children: /* @__PURE__ */ jsx(ExitIcon, { className: "w-6 h-6" })
|
|
3891
|
+
}
|
|
3892
|
+
)
|
|
3893
|
+
]
|
|
3894
|
+
}
|
|
3895
|
+
) });
|
|
3838
3896
|
}
|
|
3839
3897
|
const { walletId, connector } = props;
|
|
3840
3898
|
const handleConnect = async () => {
|
|
@@ -3862,14 +3920,15 @@ const WalletModalButton = (props) => {
|
|
|
3862
3920
|
Button,
|
|
3863
3921
|
{
|
|
3864
3922
|
type: "button",
|
|
3923
|
+
variant: "ghost",
|
|
3865
3924
|
onClick: handleConnect,
|
|
3866
3925
|
disabled: isDisabled,
|
|
3867
|
-
className:
|
|
3926
|
+
className: `w-full rounded-xs flex justify-start gap-3`,
|
|
3868
3927
|
children: [
|
|
3869
3928
|
/* @__PURE__ */ jsx(IconComponent, { className: "min-w-8 min-h-8" }),
|
|
3870
3929
|
/* @__PURE__ */ jsxs("div", { className: "flex flex-col items-start min-w-0", children: [
|
|
3871
3930
|
/* @__PURE__ */ jsx("p", { className: "font-semibold text-foreground text-sm leading-4 truncate", children: name }),
|
|
3872
|
-
/* @__PURE__ */ jsx("div", { className: "text-xs leading-3 font-
|
|
3931
|
+
/* @__PURE__ */ jsx("div", { className: "text-xs leading-3 font-medium text-muted-foreground", children: t("wallets.connect") })
|
|
3873
3932
|
] })
|
|
3874
3933
|
]
|
|
3875
3934
|
}
|
|
@@ -3967,14 +4026,14 @@ const WalletSelectModal = () => {
|
|
|
3967
4026
|
wallets: tronWallets.filter(notConnected)
|
|
3968
4027
|
}
|
|
3969
4028
|
].filter((category) => category.wallets.length > 0);
|
|
3970
|
-
return /* @__PURE__ */ jsx(Dialog, { open: isOpen, onOpenChange: (open) => !open && onClose(), children: /* @__PURE__ */ jsxs(DialogContent, {
|
|
4029
|
+
return /* @__PURE__ */ jsx(Dialog, { open: isOpen, onOpenChange: (open) => !open && onClose(), children: /* @__PURE__ */ jsxs(DialogContent, { children: [
|
|
3971
4030
|
/* @__PURE__ */ jsxs(DialogHeader, { className: "text-left", children: [
|
|
3972
4031
|
/* @__PURE__ */ jsx(DialogTitle, { className: "text-2xl leading-8", children: t("wallets.chooseWallet") }),
|
|
3973
4032
|
/* @__PURE__ */ jsx(DialogDescription, { children: t("wallets.oneWalletPerEnv") })
|
|
3974
4033
|
] }),
|
|
3975
4034
|
/* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4", children: [
|
|
3976
4035
|
connectedWallets.length > 0 && /* @__PURE__ */ jsxs("div", { children: [
|
|
3977
|
-
/* @__PURE__ */ jsx("div", { className: "py-
|
|
4036
|
+
/* @__PURE__ */ jsx("div", { className: "py-1 text-muted-foreground uppercase", children: t("wallets.connected") }),
|
|
3978
4037
|
/* @__PURE__ */ jsx("div", { children: connectedWallets.map((wallet) => /* @__PURE__ */ jsx(
|
|
3979
4038
|
WalletModalButton,
|
|
3980
4039
|
{
|
|
@@ -3989,7 +4048,7 @@ const WalletSelectModal = () => {
|
|
|
3989
4048
|
)) })
|
|
3990
4049
|
] }),
|
|
3991
4050
|
categories.map((category) => /* @__PURE__ */ jsxs("div", { children: [
|
|
3992
|
-
/* @__PURE__ */ jsx("div", { className: "py-
|
|
4051
|
+
/* @__PURE__ */ jsx("div", { className: "py-1 text-muted-foreground uppercase", children: category.title }),
|
|
3993
4052
|
/* @__PURE__ */ jsx("div", { className: "-mx-3", children: category.wallets.map((wallet) => {
|
|
3994
4053
|
const isEvmConnector = category.title === t("wallets.evmWallets");
|
|
3995
4054
|
const connector = isEvmConnector ? connectors.find((c) => c.id === wallet.id) : void 0;
|
|
@@ -6046,7 +6105,7 @@ const SettingsModal = ({ isOpen, onClose }) => {
|
|
|
6046
6105
|
);
|
|
6047
6106
|
const activeBtn = "bg-primary hover:bg-primary/80 text-primary-foreground transition-colors";
|
|
6048
6107
|
const notActiveBtn = "bg-accent hover:bg-accent/80 text-accent-foreground transition-colors";
|
|
6049
|
-
return /* @__PURE__ */ jsx(Dialog, { open: isOpen, onOpenChange: (open) => !open && onClose(), children: /* @__PURE__ */ jsxs(DialogContent, { onOpenAutoFocus: (e) => e.preventDefault(),
|
|
6108
|
+
return /* @__PURE__ */ jsx(Dialog, { open: isOpen, onOpenChange: (open) => !open && onClose(), children: /* @__PURE__ */ jsxs(DialogContent, { onOpenAutoFocus: (e) => e.preventDefault(), children: [
|
|
6050
6109
|
/* @__PURE__ */ jsx(DialogHeader, { className: "text-left", children: /* @__PURE__ */ jsx(DialogTitle, { className: "text-2xl leading-8", children: t("settings.title") }) }),
|
|
6051
6110
|
/* @__PURE__ */ jsxs("div", { className: "space-y-5", children: [
|
|
6052
6111
|
/* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-5", children: [
|
|
@@ -6151,7 +6210,7 @@ const TokenRow = ({
|
|
|
6151
6210
|
Button,
|
|
6152
6211
|
{
|
|
6153
6212
|
onClick: onPick,
|
|
6154
|
-
className: `w-full px-5 rounded-xs bg-transparent flex items-center justify-between gap-3 hover:bg-accent hover:scale-100 ${isSelected ? "
|
|
6213
|
+
className: `w-full px-5 rounded-xs bg-transparent flex items-center justify-between gap-3 hover:bg-accent hover:scale-100 ${isSelected ? "border border-ring" : ""}`,
|
|
6155
6214
|
children: [
|
|
6156
6215
|
/* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
|
|
6157
6216
|
/* @__PURE__ */ jsx(
|
|
@@ -6187,6 +6246,7 @@ const TokenSelectModal = ({
|
|
|
6187
6246
|
const { t } = useBridgeTranslation();
|
|
6188
6247
|
const [query, setQuery] = useState("");
|
|
6189
6248
|
const [tab, setTab] = useState("my");
|
|
6249
|
+
const [manualTabSwitch, setManualTabSwitch] = useState(false);
|
|
6190
6250
|
const { srcAddress } = useAddresses();
|
|
6191
6251
|
const { fromChain, setFromChain, chains } = useChainsStore();
|
|
6192
6252
|
const { assetMatrix, selectedAssetSymbol } = useTokensStore();
|
|
@@ -6268,9 +6328,23 @@ const TokenSelectModal = ({
|
|
|
6268
6328
|
() => groupedTokens.withBalance,
|
|
6269
6329
|
[groupedTokens.withBalance]
|
|
6270
6330
|
);
|
|
6331
|
+
useEffect(() => {
|
|
6332
|
+
if (query.trim() !== "" && tab === "my" && myTokens.length === 0 && !manualTabSwitch) {
|
|
6333
|
+
setTab("all");
|
|
6334
|
+
}
|
|
6335
|
+
}, [query, tab, myTokens.length, manualTabSwitch]);
|
|
6336
|
+
useEffect(() => {
|
|
6337
|
+
if (query.trim() !== "" && tab === "all" && myTokens.length > 0 && !manualTabSwitch) {
|
|
6338
|
+
setTab("my");
|
|
6339
|
+
}
|
|
6340
|
+
}, [query, tab, myTokens.length, manualTabSwitch]);
|
|
6341
|
+
useEffect(() => {
|
|
6342
|
+
setManualTabSwitch(false);
|
|
6343
|
+
}, [query]);
|
|
6271
6344
|
const resetState = useCallback(() => {
|
|
6272
6345
|
setQuery("");
|
|
6273
6346
|
setTab("my");
|
|
6347
|
+
setManualTabSwitch(false);
|
|
6274
6348
|
}, []);
|
|
6275
6349
|
const handleClose = useCallback(() => {
|
|
6276
6350
|
resetState();
|
|
@@ -6315,7 +6389,7 @@ const TokenSelectModal = ({
|
|
|
6315
6389
|
[groupedTokens.willChangeSrcChain]
|
|
6316
6390
|
);
|
|
6317
6391
|
const hasNoResults = tokensToRender.length === 0 && willChangeSrcTokens.length === 0;
|
|
6318
|
-
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
|
|
6392
|
+
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: [
|
|
6319
6393
|
/* @__PURE__ */ jsx(DialogHeader, { className: "text-left", children: /* @__PURE__ */ jsx(DialogTitle, { className: "text-2xl leading-8", children: t("bridge.selectToken") }) }),
|
|
6320
6394
|
/* @__PURE__ */ jsx(
|
|
6321
6395
|
SearchInput,
|
|
@@ -6330,9 +6404,15 @@ const TokenSelectModal = ({
|
|
|
6330
6404
|
Button,
|
|
6331
6405
|
{
|
|
6332
6406
|
variant: tab === "my" ? "default" : "ghost",
|
|
6333
|
-
onClick: () =>
|
|
6407
|
+
onClick: () => {
|
|
6408
|
+
setTab("my");
|
|
6409
|
+
setManualTabSwitch(true);
|
|
6410
|
+
},
|
|
6334
6411
|
size: "sm",
|
|
6335
|
-
className: cn(
|
|
6412
|
+
className: cn(
|
|
6413
|
+
"px-4 cursor-pointer",
|
|
6414
|
+
tab !== "my" && "bg-muted hover:bg-accent"
|
|
6415
|
+
),
|
|
6336
6416
|
children: t("bridge.myTokens")
|
|
6337
6417
|
}
|
|
6338
6418
|
),
|
|
@@ -6340,17 +6420,20 @@ const TokenSelectModal = ({
|
|
|
6340
6420
|
Button,
|
|
6341
6421
|
{
|
|
6342
6422
|
variant: tab === "all" ? "default" : "ghost",
|
|
6343
|
-
onClick: () =>
|
|
6423
|
+
onClick: () => {
|
|
6424
|
+
setTab("all");
|
|
6425
|
+
setManualTabSwitch(true);
|
|
6426
|
+
},
|
|
6344
6427
|
size: "sm",
|
|
6345
6428
|
className: cn(
|
|
6346
|
-
"px-4",
|
|
6429
|
+
"px-4 cursor-pointer",
|
|
6347
6430
|
tab !== "all" && "bg-muted hover:bg-accent"
|
|
6348
6431
|
),
|
|
6349
6432
|
children: t("bridge.allTokens")
|
|
6350
6433
|
}
|
|
6351
6434
|
)
|
|
6352
6435
|
] }),
|
|
6353
|
-
/* @__PURE__ */ jsx("div", { className: "flex-1 overflow-y-auto -mx-5", children: hasNoResults ? /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground px-
|
|
6436
|
+
/* @__PURE__ */ jsx("div", { className: "flex-1 overflow-y-auto -mx-5", children: hasNoResults ? /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground px-12 py-2 h-28 flex items-center justify-center text-center", children: t("bridge.tokenNotFound") }) : /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
6354
6437
|
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") }),
|
|
6355
6438
|
tokensToRender.map(({ token, willChangeSrc }) => {
|
|
6356
6439
|
const bal = getBalance(token.symbol);
|
|
@@ -6567,6 +6650,45 @@ const Toolbar = () => {
|
|
|
6567
6650
|
/* @__PURE__ */ jsx(SettingsModal, { isOpen: isOpenSettings, onClose: onCloseSettings })
|
|
6568
6651
|
] });
|
|
6569
6652
|
};
|
|
6653
|
+
const useAutoSelectNetwork = ({
|
|
6654
|
+
tonAddress,
|
|
6655
|
+
tronConnected,
|
|
6656
|
+
evmIsConnected
|
|
6657
|
+
}) => {
|
|
6658
|
+
const { hasAnyWallet } = useConnectedWalletsStore();
|
|
6659
|
+
const { chains, setFromChain } = useChainsStore();
|
|
6660
|
+
const previousHadWallet = useRef(hasAnyWallet());
|
|
6661
|
+
useEffect(() => {
|
|
6662
|
+
const currentHasWallet = hasAnyWallet();
|
|
6663
|
+
const isFirstWalletConnection = !previousHadWallet.current && currentHasWallet;
|
|
6664
|
+
if (isFirstWalletConnection && chains?.length) {
|
|
6665
|
+
let targetChainKey = null;
|
|
6666
|
+
if (tonAddress) {
|
|
6667
|
+
targetChainKey = "ton";
|
|
6668
|
+
} else if (tronConnected) {
|
|
6669
|
+
targetChainKey = "tron";
|
|
6670
|
+
} else if (evmIsConnected) {
|
|
6671
|
+
targetChainKey = "ethereum";
|
|
6672
|
+
}
|
|
6673
|
+
if (targetChainKey) {
|
|
6674
|
+
const matchingChain = chains.find(
|
|
6675
|
+
(chain) => chain.chainKey.toLowerCase() === targetChainKey
|
|
6676
|
+
);
|
|
6677
|
+
if (matchingChain) {
|
|
6678
|
+
setFromChain(matchingChain);
|
|
6679
|
+
}
|
|
6680
|
+
}
|
|
6681
|
+
}
|
|
6682
|
+
previousHadWallet.current = currentHasWallet;
|
|
6683
|
+
}, [
|
|
6684
|
+
tonAddress,
|
|
6685
|
+
tronConnected,
|
|
6686
|
+
evmIsConnected,
|
|
6687
|
+
hasAnyWallet,
|
|
6688
|
+
chains,
|
|
6689
|
+
setFromChain
|
|
6690
|
+
]);
|
|
6691
|
+
};
|
|
6570
6692
|
const EvaaBridgeWithProviders = (props) => {
|
|
6571
6693
|
const [tonConnectUI] = useTonConnectUI();
|
|
6572
6694
|
const tonAddress = useTonAddress();
|
|
@@ -6591,6 +6713,11 @@ const EvaaBridgeWithProviders = (props) => {
|
|
|
6591
6713
|
useEffect(() => {
|
|
6592
6714
|
setTronConnected(!!tronConnected);
|
|
6593
6715
|
}, [tronConnected, setTronConnected]);
|
|
6716
|
+
useAutoSelectNetwork({
|
|
6717
|
+
tonAddress,
|
|
6718
|
+
tronConnected,
|
|
6719
|
+
evmIsConnected
|
|
6720
|
+
});
|
|
6594
6721
|
return /* @__PURE__ */ jsx(BridgeI18nProvider, { defaultLanguage: props.defaultLanguage, children: /* @__PURE__ */ jsx(
|
|
6595
6722
|
ChainStrategyProvider,
|
|
6596
6723
|
{
|