@lifi/widget 1.14.1 → 1.16.0
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/App.js +21 -0
- package/cjs/App.js +21 -0
- package/cjs/components/ActiveSwaps/ActiveSwapItem.d.ts +5 -0
- package/cjs/components/ActiveSwaps/ActiveSwapItem.js +45 -0
- package/cjs/components/{SwapInProgress/SwapInProgress.d.ts → ActiveSwaps/ActiveSwaps.d.ts} +1 -1
- package/cjs/components/ActiveSwaps/ActiveSwaps.js +30 -0
- package/cjs/components/ActiveSwaps/ActiveSwaps.style.d.ts +78 -0
- package/cjs/components/ActiveSwaps/ActiveSwaps.style.js +40 -0
- package/cjs/components/ActiveSwaps/index.d.ts +2 -0
- package/cjs/components/ActiveSwaps/index.js +18 -0
- package/cjs/components/Card/Card.d.ts +7 -4
- package/cjs/components/Card/Card.js +38 -28
- package/cjs/{pages/SelectTokenPage → components/ChainSelect}/ChainSelect.d.ts +1 -1
- package/cjs/components/ChainSelect/ChainSelect.js +35 -0
- package/cjs/components/{SwapInProgress/SwapInProgress.style.d.ts → ChainSelect/ChainSelect.style.d.ts} +10 -19
- package/cjs/components/ChainSelect/ChainSelect.style.js +19 -0
- package/cjs/components/ChainSelect/index.d.ts +2 -0
- package/cjs/components/ChainSelect/index.js +18 -0
- package/cjs/components/ChainSelect/useChainSelect.d.ts +8 -0
- package/cjs/components/ChainSelect/useChainSelect.js +33 -0
- package/cjs/components/Header/Header.js +3 -11
- package/cjs/components/Header/NavigationHeader.js +10 -17
- package/cjs/components/Header/WalletHeader.js +4 -5
- package/cjs/components/PoweredBy/PoweredBy.style.d.ts +1 -1
- package/cjs/components/PoweredBy/PoweredBy.style.js +1 -0
- package/cjs/components/ReverseTokensButton/ReverseTokensButton.js +10 -10
- package/cjs/components/SelectTokenButton/SelectTokenButton.d.ts +1 -1
- package/cjs/components/SelectTokenButton/SelectTokenButton.js +3 -3
- package/{components/SwapInProgress/SwapInProgress.d.ts → cjs/components/SendToWallet/SendToWallet.d.ts} +1 -1
- package/cjs/components/SendToWallet/SendToWallet.js +53 -0
- package/cjs/components/SendToWallet/SendToWallet.style.d.ts +19 -0
- package/cjs/components/SendToWallet/SendToWallet.style.js +15 -0
- package/cjs/components/SendToWallet/index.d.ts +1 -0
- package/cjs/components/{SwapInProgress → SendToWallet}/index.js +1 -1
- package/cjs/components/Step/CircularProgress.js +1 -1
- package/cjs/components/Step/CircularProgress.style.js +1 -1
- package/cjs/components/Step/StepProcess.js +1 -5
- package/cjs/components/Step/StepProcess.style.d.ts +1 -1
- package/cjs/components/Step/StepTimer.d.ts +1 -0
- package/cjs/components/Step/StepTimer.js +6 -6
- package/cjs/components/SwapButton/SwapButton.js +10 -14
- package/cjs/components/SwapButton/types.d.ts +2 -2
- package/cjs/components/SwapInput/FormPriceHelperText.d.ts +1 -1
- package/cjs/components/SwapInput/FormPriceHelperText.js +4 -4
- package/cjs/components/SwapInput/SwapInput.d.ts +1 -1
- package/cjs/components/SwapInput/SwapInput.js +4 -4
- package/cjs/components/SwapInput/SwapInputAdornment.d.ts +1 -1
- package/cjs/components/SwapInput/SwapInputAdornment.js +4 -4
- package/cjs/components/SwapRouteCard/SwapRouteCard.js +5 -4
- package/cjs/components/SwapRouteCard/SwapRouteCard.style.js +3 -3
- package/cjs/components/TokenAvatar/TokenAvatar.style.js +0 -3
- package/cjs/components/TokenList/TokenList.js +14 -11
- package/cjs/components/TokenList/types.d.ts +1 -1
- package/cjs/config/theme.js +24 -23
- package/cjs/config/version.d.ts +1 -1
- package/cjs/config/version.js +1 -1
- package/cjs/hooks/index.d.ts +3 -0
- package/cjs/hooks/index.js +3 -0
- package/cjs/hooks/useChains.d.ts +1 -97
- package/cjs/hooks/useChains.js +8 -15
- package/cjs/hooks/useNavigateBack.d.ts +4 -0
- package/cjs/hooks/useNavigateBack.js +18 -0
- package/cjs/{components/Step/utils.d.ts → hooks/useProcessMessage.d.ts} +4 -0
- package/cjs/{components/Step/utils.js → hooks/useProcessMessage.js} +16 -10
- package/cjs/hooks/useRouteExecution.d.ts +1 -1
- package/cjs/hooks/useRouteExecution.js +20 -29
- package/cjs/hooks/useSwapRoutes.js +18 -7
- package/cjs/hooks/useWidgetEvents.d.ts +3 -0
- package/cjs/hooks/useWidgetEvents.js +13 -0
- package/cjs/i18n/en/translation.json +25 -15
- package/cjs/i18n/index.d.ts +20 -10
- package/cjs/index.d.ts +1 -0
- package/cjs/index.js +3 -1
- package/cjs/pages/ActiveSwapsPage/ActiveSwapsEmpty.d.ts +2 -0
- package/cjs/pages/ActiveSwapsPage/ActiveSwapsEmpty.js +18 -0
- package/cjs/pages/ActiveSwapsPage/ActiveSwapsPage.d.ts +2 -0
- package/cjs/pages/ActiveSwapsPage/ActiveSwapsPage.js +21 -0
- package/cjs/pages/ActiveSwapsPage/index.d.ts +1 -0
- package/cjs/pages/ActiveSwapsPage/index.js +17 -0
- package/cjs/pages/MainPage/MainPage.js +2 -2
- package/cjs/pages/MainPage/MainSwapButton.js +3 -1
- package/cjs/pages/MainPage/SwapRoutes.js +4 -1
- package/cjs/pages/SelectChainPage/SelectChainPage.d.ts +3 -0
- package/cjs/pages/SelectChainPage/SelectChainPage.js +33 -0
- package/cjs/pages/SelectChainPage/SelectChainPage.style.d.ts +21 -0
- package/cjs/pages/SelectChainPage/SelectChainPage.style.js +20 -0
- package/cjs/pages/SelectChainPage/index.d.ts +1 -0
- package/cjs/pages/SelectChainPage/index.js +17 -0
- package/cjs/pages/SelectTokenPage/SearchTokenInput.js +3 -3
- package/cjs/pages/SelectTokenPage/SelectTokenPage.d.ts +2 -4
- package/cjs/pages/SelectTokenPage/SelectTokenPage.js +4 -8
- package/cjs/pages/SelectWalletPage/SelectWalletPage.js +10 -10
- package/cjs/pages/SelectWalletPage/SelectWalletPage.style.d.ts +2 -27
- package/cjs/pages/SelectWalletPage/SelectWalletPage.style.js +4 -14
- package/cjs/pages/SettingsPage/AdvancedPreferences.js +2 -2
- package/cjs/pages/SettingsPage/ColorSchemeButtonGroup.js +2 -2
- package/cjs/pages/SettingsPage/ColorSchemeButtonGroup.style.d.ts +1 -1
- package/cjs/pages/SettingsPage/EnabledBridgesSelect.js +3 -6
- package/cjs/pages/SettingsPage/EnabledExchangesSelect.js +3 -5
- package/cjs/pages/SettingsPage/RoutePrioritySelect.js +5 -1
- package/cjs/pages/SettingsPage/SettingsPage.js +2 -1
- package/cjs/pages/SettingsPage/ShowDestinationWallet.d.ts +2 -0
- package/cjs/pages/SettingsPage/ShowDestinationWallet.js +22 -0
- package/cjs/pages/SwapDetailsPage/SwapDetailsPage.js +4 -3
- package/cjs/pages/SwapHistoryPage/SwapHistoryPage.js +2 -2
- package/cjs/pages/SwapPage/StatusBottomSheet.js +29 -41
- package/cjs/pages/SwapPage/SwapPage.js +7 -3
- package/cjs/pages/SwapRoutesPage/SwapRoutesPage.js +1 -1
- package/cjs/providers/SwapFormProvider/SwapFormProvider.d.ts +1 -0
- package/cjs/providers/SwapFormProvider/SwapFormProvider.js +43 -9
- package/cjs/providers/SwapFormProvider/types.d.ts +3 -1
- package/cjs/providers/SwapFormProvider/types.js +1 -0
- package/cjs/providers/WalletProvider/WalletProvider.js +10 -4
- package/cjs/providers/WalletProvider/types.d.ts +4 -2
- package/cjs/providers/WidgetProvider/WidgetProvider.js +3 -7
- package/cjs/providers/index.d.ts +4 -0
- package/cjs/providers/index.js +20 -0
- package/cjs/stores/chains/index.d.ts +4 -0
- package/cjs/stores/chains/index.js +20 -0
- package/cjs/stores/chains/types.d.ts +8 -0
- package/cjs/stores/chains/types.js +2 -0
- package/cjs/stores/chains/useChainOrder.d.ts +1 -0
- package/cjs/stores/chains/useChainOrder.js +12 -0
- package/cjs/stores/chains/useChainOrderStore.d.ts +19 -0
- package/cjs/stores/chains/useChainOrderStore.js +42 -0
- package/cjs/stores/chains/useInitializeChainOrder.d.ts +1 -0
- package/cjs/stores/chains/useInitializeChainOrder.js +12 -0
- package/cjs/stores/route/index.d.ts +2 -1
- package/cjs/stores/route/index.js +2 -1
- package/cjs/stores/route/useExecutingRoutesIds.d.ts +1 -0
- package/cjs/stores/route/useExecutingRoutesIds.js +20 -0
- package/cjs/stores/route/useRouteStore.js +5 -4
- package/cjs/stores/route/utils.d.ts +4 -0
- package/cjs/stores/route/utils.js +21 -0
- package/cjs/stores/settings/types.d.ts +2 -1
- package/cjs/stores/settings/useSettingsStore.d.ts +4 -2
- package/cjs/stores/settings/useSettingsStore.js +6 -2
- package/cjs/types/events.d.ts +5 -0
- package/cjs/types/events.js +9 -0
- package/cjs/types/index.d.ts +1 -0
- package/cjs/types/index.js +1 -0
- package/cjs/types/widget.d.ts +3 -1
- package/cjs/utils/format.js +7 -2
- package/cjs/utils/navigationRoutes.d.ts +5 -0
- package/cjs/utils/navigationRoutes.js +31 -4
- package/components/ActiveSwaps/ActiveSwapItem.d.ts +5 -0
- package/components/ActiveSwaps/ActiveSwapItem.js +41 -0
- package/components/ActiveSwaps/ActiveSwaps.d.ts +3 -0
- package/components/ActiveSwaps/ActiveSwaps.js +26 -0
- package/components/ActiveSwaps/ActiveSwaps.style.d.ts +78 -0
- package/components/ActiveSwaps/ActiveSwaps.style.js +37 -0
- package/components/ActiveSwaps/index.d.ts +2 -0
- package/components/ActiveSwaps/index.js +2 -0
- package/components/Card/Card.d.ts +7 -4
- package/components/Card/Card.js +39 -29
- package/{pages/SelectTokenPage → components/ChainSelect}/ChainSelect.d.ts +1 -1
- package/components/ChainSelect/ChainSelect.js +31 -0
- package/components/{SwapInProgress/SwapInProgress.style.d.ts → ChainSelect/ChainSelect.style.d.ts} +10 -19
- package/components/ChainSelect/ChainSelect.style.js +16 -0
- package/components/ChainSelect/index.d.ts +2 -0
- package/components/ChainSelect/index.js +2 -0
- package/components/ChainSelect/useChainSelect.d.ts +8 -0
- package/components/ChainSelect/useChainSelect.js +29 -0
- package/components/Header/Header.js +2 -10
- package/components/Header/NavigationHeader.js +11 -18
- package/components/Header/WalletHeader.js +1 -2
- package/components/PoweredBy/PoweredBy.style.d.ts +1 -1
- package/components/PoweredBy/PoweredBy.style.js +1 -0
- package/components/ReverseTokensButton/ReverseTokensButton.js +1 -1
- package/components/SelectTokenButton/SelectTokenButton.d.ts +1 -1
- package/components/SelectTokenButton/SelectTokenButton.js +1 -1
- package/components/SendToWallet/SendToWallet.d.ts +3 -0
- package/components/SendToWallet/SendToWallet.js +49 -0
- package/components/SendToWallet/SendToWallet.style.d.ts +19 -0
- package/components/SendToWallet/SendToWallet.style.js +12 -0
- package/components/SendToWallet/index.d.ts +1 -0
- package/components/SendToWallet/index.js +1 -0
- package/components/Step/CircularProgress.js +3 -3
- package/components/Step/CircularProgress.style.js +1 -1
- package/components/Step/StepProcess.js +2 -6
- package/components/Step/StepProcess.style.d.ts +1 -1
- package/components/Step/StepTimer.d.ts +1 -0
- package/components/Step/StepTimer.js +6 -6
- package/components/SwapButton/SwapButton.js +7 -11
- package/components/SwapButton/types.d.ts +2 -2
- package/components/SwapInput/FormPriceHelperText.d.ts +1 -1
- package/components/SwapInput/FormPriceHelperText.js +1 -1
- package/components/SwapInput/SwapInput.d.ts +1 -1
- package/components/SwapInput/SwapInput.js +1 -1
- package/components/SwapInput/SwapInputAdornment.d.ts +1 -1
- package/components/SwapInput/SwapInputAdornment.js +1 -1
- package/components/SwapRouteCard/SwapRouteCard.js +5 -4
- package/components/SwapRouteCard/SwapRouteCard.style.js +3 -3
- package/components/TokenAvatar/TokenAvatar.style.js +0 -3
- package/components/TokenList/TokenList.js +7 -4
- package/components/TokenList/types.d.ts +1 -1
- package/config/theme.js +24 -23
- package/config/version.d.ts +1 -1
- package/config/version.js +1 -1
- package/hooks/index.d.ts +3 -0
- package/hooks/index.js +3 -0
- package/hooks/useChains.d.ts +1 -97
- package/hooks/useChains.js +8 -15
- package/hooks/useNavigateBack.d.ts +4 -0
- package/hooks/useNavigateBack.js +14 -0
- package/{components/Step/utils.d.ts → hooks/useProcessMessage.d.ts} +4 -0
- package/{pages/SwapPage/utils.js → hooks/useProcessMessage.js} +15 -10
- package/hooks/useRouteExecution.d.ts +1 -1
- package/hooks/useRouteExecution.js +21 -30
- package/hooks/useSwapRoutes.js +18 -7
- package/hooks/useWidgetEvents.d.ts +3 -0
- package/hooks/useWidgetEvents.js +6 -0
- package/i18n/en/translation.json +25 -15
- package/i18n/index.d.ts +20 -10
- package/index.d.ts +1 -0
- package/index.js +1 -0
- package/package.json +17 -19
- package/pages/ActiveSwapsPage/ActiveSwapsEmpty.d.ts +2 -0
- package/pages/ActiveSwapsPage/ActiveSwapsEmpty.js +14 -0
- package/pages/ActiveSwapsPage/ActiveSwapsPage.d.ts +2 -0
- package/pages/ActiveSwapsPage/ActiveSwapsPage.js +17 -0
- package/pages/ActiveSwapsPage/index.d.ts +1 -0
- package/pages/ActiveSwapsPage/index.js +1 -0
- package/pages/MainPage/MainPage.js +2 -2
- package/pages/MainPage/MainSwapButton.js +3 -1
- package/pages/MainPage/SwapRoutes.js +4 -1
- package/pages/SelectChainPage/SelectChainPage.d.ts +3 -0
- package/pages/SelectChainPage/SelectChainPage.js +29 -0
- package/pages/SelectChainPage/SelectChainPage.style.d.ts +21 -0
- package/pages/SelectChainPage/SelectChainPage.style.js +17 -0
- package/pages/SelectChainPage/index.d.ts +1 -0
- package/pages/SelectChainPage/index.js +1 -0
- package/pages/SelectTokenPage/SearchTokenInput.js +1 -1
- package/pages/SelectTokenPage/SelectTokenPage.d.ts +2 -4
- package/pages/SelectTokenPage/SelectTokenPage.js +5 -9
- package/pages/SelectWalletPage/SelectWalletPage.js +10 -10
- package/pages/SelectWalletPage/SelectWalletPage.style.d.ts +2 -27
- package/pages/SelectWalletPage/SelectWalletPage.style.js +4 -14
- package/pages/SettingsPage/AdvancedPreferences.js +2 -2
- package/pages/SettingsPage/ColorSchemeButtonGroup.js +1 -1
- package/pages/SettingsPage/ColorSchemeButtonGroup.style.d.ts +1 -1
- package/pages/SettingsPage/EnabledBridgesSelect.js +4 -7
- package/pages/SettingsPage/EnabledExchangesSelect.js +4 -6
- package/pages/SettingsPage/RoutePrioritySelect.js +5 -1
- package/pages/SettingsPage/SettingsPage.js +2 -1
- package/pages/SettingsPage/ShowDestinationWallet.d.ts +2 -0
- package/pages/SettingsPage/ShowDestinationWallet.js +18 -0
- package/pages/SwapDetailsPage/SwapDetailsPage.js +5 -4
- package/pages/SwapHistoryPage/SwapHistoryPage.js +1 -1
- package/pages/SwapPage/StatusBottomSheet.js +30 -42
- package/pages/SwapPage/SwapPage.js +9 -5
- package/pages/SwapRoutesPage/SwapRoutesPage.js +1 -1
- package/providers/SwapFormProvider/SwapFormProvider.d.ts +1 -0
- package/providers/SwapFormProvider/SwapFormProvider.js +43 -9
- package/providers/SwapFormProvider/types.d.ts +3 -1
- package/providers/SwapFormProvider/types.js +1 -0
- package/providers/WalletProvider/WalletProvider.js +10 -4
- package/providers/WalletProvider/types.d.ts +4 -2
- package/providers/WidgetProvider/WidgetProvider.js +3 -7
- package/providers/index.d.ts +4 -0
- package/providers/index.js +4 -0
- package/stores/chains/index.d.ts +4 -0
- package/stores/chains/index.js +4 -0
- package/stores/chains/types.d.ts +8 -0
- package/stores/chains/types.js +1 -0
- package/stores/chains/useChainOrder.d.ts +1 -0
- package/stores/chains/useChainOrder.js +5 -0
- package/stores/chains/useChainOrderStore.d.ts +19 -0
- package/stores/chains/useChainOrderStore.js +36 -0
- package/stores/chains/useInitializeChainOrder.d.ts +1 -0
- package/stores/chains/useInitializeChainOrder.js +5 -0
- package/stores/route/index.d.ts +2 -1
- package/stores/route/index.js +2 -1
- package/stores/route/useExecutingRoutesIds.d.ts +1 -0
- package/stores/route/useExecutingRoutesIds.js +13 -0
- package/stores/route/useRouteStore.js +5 -4
- package/stores/route/utils.d.ts +4 -0
- package/stores/route/utils.js +15 -0
- package/stores/settings/types.d.ts +2 -1
- package/stores/settings/useSettingsStore.d.ts +4 -2
- package/stores/settings/useSettingsStore.js +6 -2
- package/tsconfig.cjs.tsbuildinfo +1 -1
- package/types/events.d.ts +5 -0
- package/types/events.js +6 -0
- package/types/index.d.ts +1 -0
- package/types/index.js +1 -0
- package/types/widget.d.ts +3 -1
- package/utils/format.js +7 -2
- package/utils/navigationRoutes.d.ts +5 -0
- package/utils/navigationRoutes.js +30 -3
- package/cjs/components/SwapButton/SwapButton.style.d.ts +0 -65
- package/cjs/components/SwapButton/SwapButton.style.js +0 -15
- package/cjs/components/SwapInProgress/SwapInProgress.js +0 -29
- package/cjs/components/SwapInProgress/SwapInProgress.style.js +0 -17
- package/cjs/components/SwapInProgress/index.d.ts +0 -1
- package/cjs/pages/SelectTokenPage/ChainSelect.js +0 -32
- package/cjs/pages/SwapPage/utils.d.ts +0 -6
- package/cjs/pages/SwapPage/utils.js +0 -93
- package/cjs/stores/route/useExecutingRoutes.d.ts +0 -2
- package/cjs/stores/route/useExecutingRoutes.js +0 -13
- package/components/Step/utils.js +0 -89
- package/components/SwapButton/SwapButton.style.d.ts +0 -65
- package/components/SwapButton/SwapButton.style.js +0 -12
- package/components/SwapInProgress/SwapInProgress.js +0 -25
- package/components/SwapInProgress/SwapInProgress.style.js +0 -14
- package/components/SwapInProgress/index.d.ts +0 -1
- package/components/SwapInProgress/index.js +0 -1
- package/pages/SelectTokenPage/ChainSelect.js +0 -28
- package/pages/SwapPage/utils.d.ts +0 -6
- package/stores/route/useExecutingRoutes.d.ts +0 -2
- package/stores/route/useExecutingRoutes.js +0 -6
package/types/events.js
ADDED
package/types/index.d.ts
CHANGED
package/types/index.js
CHANGED
package/types/widget.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type { ChainKey, Token } from '@lifi/sdk';
|
|
1
|
+
import type { ChainKey, ConfigUpdate, Token } from '@lifi/sdk';
|
|
2
2
|
import type { PaletteMode, PaletteOptions, Shape } from '@mui/material';
|
|
3
3
|
import type { TypographyOptions } from '@mui/material/styles/createTypography';
|
|
4
4
|
import type { Signer } from 'ethers';
|
|
@@ -19,6 +19,7 @@ export interface WidgetWalletManagement {
|
|
|
19
19
|
}
|
|
20
20
|
interface WidgetConfigBase {
|
|
21
21
|
fromAmount?: number | string;
|
|
22
|
+
toAddress?: string;
|
|
22
23
|
containerStyle?: CSSProperties;
|
|
23
24
|
theme?: ThemeConfig;
|
|
24
25
|
appearance?: Appearance;
|
|
@@ -28,6 +29,7 @@ interface WidgetConfigBase {
|
|
|
28
29
|
integrator?: string;
|
|
29
30
|
disabledChains?: number[];
|
|
30
31
|
featuredTokens?: Token[];
|
|
32
|
+
sdkConfig?: ConfigUpdate;
|
|
31
33
|
}
|
|
32
34
|
declare type WidgetFromTokenConfig = {
|
|
33
35
|
fromChain: `${ChainKey}` | number;
|
package/utils/format.js
CHANGED
|
@@ -60,8 +60,13 @@ export const formatAmount = (amount = '', returnInitial = false) => {
|
|
|
60
60
|
if (parsedAmount < 0) {
|
|
61
61
|
return Math.abs(parsedAmount).toString();
|
|
62
62
|
}
|
|
63
|
-
|
|
64
|
-
|
|
63
|
+
try {
|
|
64
|
+
if (returnInitial && Big(amount)) {
|
|
65
|
+
return amount;
|
|
66
|
+
}
|
|
67
|
+
}
|
|
68
|
+
catch (_a) {
|
|
69
|
+
return '';
|
|
65
70
|
}
|
|
66
71
|
return Big(parsedAmount).toString();
|
|
67
72
|
};
|
|
@@ -4,10 +4,15 @@ export declare const navigationRoutes: {
|
|
|
4
4
|
settings: string;
|
|
5
5
|
fromToken: string;
|
|
6
6
|
toToken: string;
|
|
7
|
+
fromChain: string;
|
|
8
|
+
toChain: string;
|
|
7
9
|
swapRoutes: string;
|
|
8
10
|
swapExecution: string;
|
|
9
11
|
swapHistory: string;
|
|
12
|
+
activeSwaps: string;
|
|
10
13
|
swapDetails: string;
|
|
11
14
|
};
|
|
12
15
|
export declare const navigationRoutesValues: string[];
|
|
16
|
+
export declare const stickyHeaderRoutes: string[];
|
|
17
|
+
export declare const backButtonRoutes: string[];
|
|
13
18
|
export declare type NavigationRouteType = keyof typeof navigationRoutes;
|
|
@@ -1,12 +1,39 @@
|
|
|
1
1
|
export const navigationRoutes = {
|
|
2
2
|
home: '/',
|
|
3
|
-
selectWallet: '
|
|
3
|
+
selectWallet: 'wallet',
|
|
4
4
|
settings: 'settings',
|
|
5
|
-
fromToken: '
|
|
6
|
-
toToken: '
|
|
5
|
+
fromToken: 'from-token',
|
|
6
|
+
toToken: 'to-token',
|
|
7
|
+
fromChain: 'from-chain',
|
|
8
|
+
toChain: 'to-chain',
|
|
7
9
|
swapRoutes: 'swap-routes',
|
|
8
10
|
swapExecution: 'swap-execution',
|
|
9
11
|
swapHistory: 'swap-history',
|
|
12
|
+
activeSwaps: 'active-swaps',
|
|
10
13
|
swapDetails: 'swap-details',
|
|
11
14
|
};
|
|
12
15
|
export const navigationRoutesValues = Object.values(navigationRoutes);
|
|
16
|
+
export const stickyHeaderRoutes = [
|
|
17
|
+
navigationRoutes.selectWallet,
|
|
18
|
+
navigationRoutes.fromChain,
|
|
19
|
+
navigationRoutes.toChain,
|
|
20
|
+
navigationRoutes.settings,
|
|
21
|
+
navigationRoutes.swapRoutes,
|
|
22
|
+
navigationRoutes.swapExecution,
|
|
23
|
+
navigationRoutes.swapHistory,
|
|
24
|
+
navigationRoutes.activeSwaps,
|
|
25
|
+
navigationRoutes.swapDetails,
|
|
26
|
+
];
|
|
27
|
+
export const backButtonRoutes = [
|
|
28
|
+
navigationRoutes.selectWallet,
|
|
29
|
+
navigationRoutes.settings,
|
|
30
|
+
navigationRoutes.swapHistory,
|
|
31
|
+
navigationRoutes.activeSwaps,
|
|
32
|
+
navigationRoutes.fromToken,
|
|
33
|
+
navigationRoutes.toToken,
|
|
34
|
+
navigationRoutes.fromChain,
|
|
35
|
+
navigationRoutes.toChain,
|
|
36
|
+
navigationRoutes.swapRoutes,
|
|
37
|
+
navigationRoutes.swapExecution,
|
|
38
|
+
navigationRoutes.swapDetails,
|
|
39
|
+
];
|
|
@@ -1,65 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
export declare const Button: import("@emotion/styled").StyledComponent<{
|
|
3
|
-
classes?: (Partial<import("@mui/material").ButtonClasses> & {
|
|
4
|
-
root?: string | undefined;
|
|
5
|
-
loading?: string | undefined;
|
|
6
|
-
loadingIndicator?: string | undefined;
|
|
7
|
-
loadingIndicatorCenter?: string | undefined;
|
|
8
|
-
loadingIndicatorStart?: string | undefined;
|
|
9
|
-
loadingIndicatorEnd?: string | undefined;
|
|
10
|
-
endIconLoadingEnd?: string | undefined;
|
|
11
|
-
startIconLoadingStart?: string | undefined;
|
|
12
|
-
}) | undefined;
|
|
13
|
-
loading?: boolean | undefined;
|
|
14
|
-
loadingIndicator?: import("react").ReactNode;
|
|
15
|
-
loadingPosition?: "center" | "end" | "start" | undefined;
|
|
16
|
-
sx?: import("@mui/material/styles").SxProps<import("@mui/material/styles").Theme> | undefined;
|
|
17
|
-
} & Omit<{
|
|
18
|
-
children?: import("react").ReactNode;
|
|
19
|
-
classes?: Partial<import("@mui/material").ButtonClasses> | undefined;
|
|
20
|
-
color?: "inherit" | "primary" | "secondary" | "error" | "warning" | "info" | "success" | undefined;
|
|
21
|
-
disabled?: boolean | undefined;
|
|
22
|
-
disableElevation?: boolean | undefined;
|
|
23
|
-
disableFocusRipple?: boolean | undefined;
|
|
24
|
-
endIcon?: import("react").ReactNode;
|
|
25
|
-
fullWidth?: boolean | undefined;
|
|
26
|
-
href?: string | undefined;
|
|
27
|
-
size?: "small" | "medium" | "large" | undefined;
|
|
28
|
-
startIcon?: import("react").ReactNode;
|
|
29
|
-
sx?: import("@mui/material/styles").SxProps<import("@mui/material/styles").Theme> | undefined;
|
|
30
|
-
variant?: "text" | "outlined" | "contained" | undefined;
|
|
31
|
-
} & Omit<{
|
|
32
|
-
action?: import("react").Ref<import("@mui/material").ButtonBaseActions> | undefined;
|
|
33
|
-
centerRipple?: boolean | undefined;
|
|
34
|
-
children?: import("react").ReactNode;
|
|
35
|
-
classes?: Partial<import("@mui/material").ButtonBaseClasses> | undefined;
|
|
36
|
-
disabled?: boolean | undefined;
|
|
37
|
-
disableRipple?: boolean | undefined;
|
|
38
|
-
disableTouchRipple?: boolean | undefined;
|
|
39
|
-
focusRipple?: boolean | undefined;
|
|
40
|
-
focusVisibleClassName?: string | undefined;
|
|
41
|
-
LinkComponent?: import("react").ElementType<any> | undefined;
|
|
42
|
-
onFocusVisible?: import("react").FocusEventHandler<any> | undefined;
|
|
43
|
-
sx?: import("@mui/material/styles").SxProps<import("@mui/material/styles").Theme> | undefined;
|
|
44
|
-
tabIndex?: number | undefined;
|
|
45
|
-
TouchRippleProps?: Partial<import("@mui/material/ButtonBase/TouchRipple").TouchRippleProps> | undefined;
|
|
46
|
-
touchRippleRef?: import("react").Ref<import("@mui/material/ButtonBase/TouchRipple").TouchRippleActions> | undefined;
|
|
47
|
-
}, "classes">, "classes"> & Omit<{
|
|
48
|
-
action?: import("react").Ref<import("@mui/material").ButtonBaseActions> | undefined;
|
|
49
|
-
centerRipple?: boolean | undefined;
|
|
50
|
-
children?: import("react").ReactNode;
|
|
51
|
-
classes?: Partial<import("@mui/material").ButtonBaseClasses> | undefined;
|
|
52
|
-
disabled?: boolean | undefined;
|
|
53
|
-
disableRipple?: boolean | undefined;
|
|
54
|
-
disableTouchRipple?: boolean | undefined;
|
|
55
|
-
focusRipple?: boolean | undefined;
|
|
56
|
-
focusVisibleClassName?: string | undefined;
|
|
57
|
-
LinkComponent?: import("react").ElementType<any> | undefined;
|
|
58
|
-
onFocusVisible?: import("react").FocusEventHandler<any> | undefined;
|
|
59
|
-
sx?: import("@mui/material/styles").SxProps<import("@mui/material/styles").Theme> | undefined;
|
|
60
|
-
tabIndex?: number | undefined;
|
|
61
|
-
TouchRippleProps?: Partial<import("@mui/material/ButtonBase/TouchRipple").TouchRippleProps> | undefined;
|
|
62
|
-
touchRippleRef?: import("react").Ref<import("@mui/material/ButtonBase/TouchRipple").TouchRippleActions> | undefined;
|
|
63
|
-
}, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Pick<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "key" | keyof import("react").ButtonHTMLAttributes<HTMLButtonElement>> & {
|
|
64
|
-
ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
|
|
65
|
-
}, keyof import("@mui/material/OverridableComponent").CommonProps | "tabIndex" | "color" | "children" | "action" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "TouchRippleProps" | "touchRippleRef" | "href" | "disableElevation" | "disableFocusRipple" | "endIcon" | "fullWidth" | "size" | "startIcon" | "variant" | "loading" | "loadingIndicator" | "loadingPosition"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.Button = void 0;
|
|
4
|
-
const lab_1 = require("@mui/lab");
|
|
5
|
-
const LoadingButton_1 = require("@mui/lab/LoadingButton");
|
|
6
|
-
const styles_1 = require("@mui/material/styles");
|
|
7
|
-
const utils_1 = require("../../utils");
|
|
8
|
-
exports.Button = (0, styles_1.styled)(lab_1.LoadingButton)(({ theme }) => ({
|
|
9
|
-
[`&.${LoadingButton_1.loadingButtonClasses.loading}`]: {
|
|
10
|
-
color: 'transparent',
|
|
11
|
-
},
|
|
12
|
-
[`.${LoadingButton_1.loadingButtonClasses.loadingIndicator}`]: {
|
|
13
|
-
color: (0, utils_1.getContrastAlphaColor)(theme, '70%'),
|
|
14
|
-
},
|
|
15
|
-
}));
|
|
@@ -1,29 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.SwapInProgress = void 0;
|
|
4
|
-
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
5
|
-
const icons_material_1 = require("@mui/icons-material");
|
|
6
|
-
const material_1 = require("@mui/material");
|
|
7
|
-
const react_1 = require("react");
|
|
8
|
-
const react_i18next_1 = require("react-i18next");
|
|
9
|
-
const react_router_dom_1 = require("react-router-dom");
|
|
10
|
-
const WalletProvider_1 = require("../../providers/WalletProvider");
|
|
11
|
-
const stores_1 = require("../../stores");
|
|
12
|
-
const utils_1 = require("../../utils");
|
|
13
|
-
const Card_1 = require("../Card");
|
|
14
|
-
const TokenAvatar_1 = require("../TokenAvatar");
|
|
15
|
-
const SwapInProgress_style_1 = require("./SwapInProgress.style");
|
|
16
|
-
const SwapInProgress = (props) => {
|
|
17
|
-
const { t } = (0, react_i18next_1.useTranslation)();
|
|
18
|
-
const navigate = (0, react_router_dom_1.useNavigate)();
|
|
19
|
-
const { account } = (0, WalletProvider_1.useWallet)();
|
|
20
|
-
const executingRoutes = (0, stores_1.useExecutingRoutes)(account.address);
|
|
21
|
-
const handleCardClick = (0, react_1.useCallback)((routeId) => {
|
|
22
|
-
navigate(utils_1.navigationRoutes.swapExecution, { state: { routeId } });
|
|
23
|
-
}, [navigate]);
|
|
24
|
-
if (!(executingRoutes === null || executingRoutes === void 0 ? void 0 : executingRoutes.length)) {
|
|
25
|
-
return null;
|
|
26
|
-
}
|
|
27
|
-
return ((0, jsx_runtime_1.jsxs)(SwapInProgress_style_1.ProgressCard, Object.assign({}, props, { children: [(0, jsx_runtime_1.jsx)(Card_1.CardTitle, { children: t('swap.inProgress') }), (0, jsx_runtime_1.jsx)(material_1.Stack, Object.assign({ spacing: 2, py: 2 }, { children: executingRoutes.map(({ route, status }) => ((0, jsx_runtime_1.jsx)(SwapInProgress_style_1.RouteCard, { onClick: () => handleCardClick(route.id), avatar: (0, jsx_runtime_1.jsxs)(TokenAvatar_1.TokenAvatarGroup, Object.assign({ total: 2 }, { children: [(0, jsx_runtime_1.jsx)(TokenAvatar_1.TokenAvatar, { token: route.fromToken }), (0, jsx_runtime_1.jsx)(TokenAvatar_1.TokenAvatar, { token: route.toToken })] })), action: (0, jsx_runtime_1.jsx)(icons_material_1.KeyboardArrowRight, {}), title: (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ sx: { display: 'flex', alignItems: 'center' } }, { children: [route.fromToken.symbol, (0, jsx_runtime_1.jsx)(icons_material_1.ArrowForward, { fontSize: "small", sx: { paddingX: 0.5 } }), route.toToken.symbol] })) }, route.id))) }))] })));
|
|
28
|
-
};
|
|
29
|
-
exports.SwapInProgress = SwapInProgress;
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.RouteCard = exports.ProgressCard = void 0;
|
|
4
|
-
const styles_1 = require("@mui/material/styles");
|
|
5
|
-
const Card_1 = require("../Card");
|
|
6
|
-
exports.ProgressCard = (0, styles_1.styled)(Card_1.Card)(({ theme }) => ({
|
|
7
|
-
borderColor: (0, styles_1.alpha)(theme.palette.secondary.main, 0.48),
|
|
8
|
-
background: (0, styles_1.alpha)(theme.palette.secondary.main, 0.2),
|
|
9
|
-
'&:hover': {
|
|
10
|
-
background: (0, styles_1.alpha)(theme.palette.secondary.main, 0.2),
|
|
11
|
-
},
|
|
12
|
-
}));
|
|
13
|
-
exports.RouteCard = (0, styles_1.styled)(Card_1.CardHeader)(({ theme }) => ({
|
|
14
|
-
cursor: 'pointer',
|
|
15
|
-
paddingTop: 0,
|
|
16
|
-
paddingBottom: 0,
|
|
17
|
-
}));
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export * from './SwapInProgress';
|
|
@@ -1,32 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.ChainSelect = void 0;
|
|
4
|
-
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
5
|
-
const icons_material_1 = require("@mui/icons-material");
|
|
6
|
-
const material_1 = require("@mui/material");
|
|
7
|
-
const react_hook_form_1 = require("react-hook-form");
|
|
8
|
-
const react_i18next_1 = require("react-i18next");
|
|
9
|
-
const Card_1 = require("../../components/Card");
|
|
10
|
-
const Select_1 = require("../../components/Select");
|
|
11
|
-
const hooks_1 = require("../../hooks");
|
|
12
|
-
const SwapFormProvider_1 = require("../../providers/SwapFormProvider");
|
|
13
|
-
const WidgetProvider_1 = require("../../providers/WidgetProvider");
|
|
14
|
-
const ChainSelect = ({ formType }) => {
|
|
15
|
-
const { t } = (0, react_i18next_1.useTranslation)();
|
|
16
|
-
const { setValue, register } = (0, react_hook_form_1.useFormContext)();
|
|
17
|
-
const { fromChain, toChain } = (0, WidgetProvider_1.useWidgetConfig)();
|
|
18
|
-
const { chains, isLoading } = (0, hooks_1.useChains)();
|
|
19
|
-
const chainKey = SwapFormProvider_1.SwapFormKeyHelper.getChainKey(formType);
|
|
20
|
-
const [chainId] = (0, react_hook_form_1.useWatch)({
|
|
21
|
-
name: [chainKey],
|
|
22
|
-
});
|
|
23
|
-
const { onChange, onBlur, name, ref } = register(chainKey);
|
|
24
|
-
const handleChain = (event) => {
|
|
25
|
-
onChange(event);
|
|
26
|
-
setValue(SwapFormProvider_1.SwapFormKeyHelper.getTokenKey(formType), '');
|
|
27
|
-
setValue(SwapFormProvider_1.SwapFormKeyHelper.getAmountKey(formType), '');
|
|
28
|
-
setValue(SwapFormProvider_1.SwapFormKey.TokenSearchFilter, '');
|
|
29
|
-
};
|
|
30
|
-
return !isLoading ? ((0, jsx_runtime_1.jsxs)(Card_1.Card, { children: [(0, jsx_runtime_1.jsx)(Card_1.CardTitle, { children: t(`swap.selectChain`) }), (0, jsx_runtime_1.jsx)(material_1.FormControl, Object.assign({ fullWidth: true }, { children: (0, jsx_runtime_1.jsx)(Select_1.Select, Object.assign({ ref: ref, labelId: chainKey, name: name, MenuProps: { elevation: 2 }, defaultValue: formType === 'from' ? fromChain : toChain, value: chainId, onChange: handleChain, onBlur: onBlur, IconComponent: icons_material_1.KeyboardArrowDown }, { children: chains === null || chains === void 0 ? void 0 : chains.map((chain) => ((0, jsx_runtime_1.jsxs)(material_1.MenuItem, Object.assign({ value: chain.id }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemAvatar, { children: (0, jsx_runtime_1.jsx)(material_1.Avatar, Object.assign({ src: chain.logoURI, alt: chain.key }, { children: chain.name[0] })) }), chain.name] }), chain.key))) })) }))] })) : ((0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "rectangular", width: "100%", height: 98, sx: { borderRadius: 1 } }));
|
|
31
|
-
};
|
|
32
|
-
exports.ChainSelect = ChainSelect;
|
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
import type { EVMChain, Process, Step } from '@lifi/sdk';
|
|
2
|
-
import type { TFunction } from 'react-i18next';
|
|
3
|
-
export declare function getProcessMessage(t: TFunction<'translation', undefined>, getChainById: (chainId: number) => EVMChain | undefined, step: Step, process: Process): {
|
|
4
|
-
title?: string;
|
|
5
|
-
message?: string;
|
|
6
|
-
};
|
|
@@ -1,93 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.getProcessMessage = void 0;
|
|
4
|
-
const sdk_1 = require("@lifi/sdk");
|
|
5
|
-
const utils_1 = require("../../utils");
|
|
6
|
-
const formatProcessMessage = (initialMessage, args = {}) => {
|
|
7
|
-
return Object.keys(args).reduce((message, key) => {
|
|
8
|
-
return message.replace(`{${key}}`, args[key]);
|
|
9
|
-
}, initialMessage);
|
|
10
|
-
};
|
|
11
|
-
const processMessages = {
|
|
12
|
-
TOKEN_ALLOWANCE: {
|
|
13
|
-
STARTED: (t) => t(`swap.process.tokenAllowance.started`),
|
|
14
|
-
PENDING: (t) => t(`swap.process.tokenAllowance.pending`),
|
|
15
|
-
DONE: (t) => t(`swap.process.tokenAllowance.done`),
|
|
16
|
-
},
|
|
17
|
-
SWITCH_CHAIN: {
|
|
18
|
-
PENDING: (t) => t(`swap.process.switchChain.pending`),
|
|
19
|
-
DONE: (t) => t(`swap.process.switchChain.done`),
|
|
20
|
-
},
|
|
21
|
-
SWAP: {
|
|
22
|
-
STARTED: (t) => t(`swap.process.swap.started`),
|
|
23
|
-
ACTION_REQUIRED: (t) => t(`swap.process.swap.actionRequired`),
|
|
24
|
-
PENDING: (t) => t(`swap.process.swap.pending`),
|
|
25
|
-
DONE: (t) => t(`swap.process.swap.done`),
|
|
26
|
-
},
|
|
27
|
-
CROSS_CHAIN: {
|
|
28
|
-
STARTED: (t) => t(`swap.process.crossChain.started`),
|
|
29
|
-
ACTION_REQUIRED: (t) => t(`swap.process.crossChain.actionRequired`),
|
|
30
|
-
PENDING: (t) => t(`swap.process.crossChain.pending`),
|
|
31
|
-
DONE: (t) => t(`swap.process.crossChain.done`),
|
|
32
|
-
},
|
|
33
|
-
RECEIVING_CHAIN: {
|
|
34
|
-
PENDING: (t) => t(`swap.process.receivingChain.pending`),
|
|
35
|
-
DONE: (t) => t(`swap.process.receivingChain.done`),
|
|
36
|
-
},
|
|
37
|
-
TRANSACTION: {},
|
|
38
|
-
};
|
|
39
|
-
function getProcessMessage(t, getChainById, step, process) {
|
|
40
|
-
var _a, _b, _c, _d;
|
|
41
|
-
if (process.error && process.status === 'FAILED') {
|
|
42
|
-
const getTransactionNotSentMessage = () => {
|
|
43
|
-
var _a, _b;
|
|
44
|
-
return t(`swap.error.message.transactionNotSent`, {
|
|
45
|
-
amount: (0, utils_1.formatTokenAmount)(step.action.fromAmount, step.action.fromToken.decimals),
|
|
46
|
-
tokenSymbol: step.action.fromToken.symbol,
|
|
47
|
-
chainName: (_b = (_a = getChainById(step.action.fromChainId)) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : '',
|
|
48
|
-
});
|
|
49
|
-
};
|
|
50
|
-
let title = '';
|
|
51
|
-
let message = '';
|
|
52
|
-
switch (process.error.code) {
|
|
53
|
-
case sdk_1.LifiErrorCode.ChainSwitchError:
|
|
54
|
-
title = t(`swap.error.title.chainSwitch`);
|
|
55
|
-
message = getTransactionNotSentMessage();
|
|
56
|
-
break;
|
|
57
|
-
case sdk_1.LifiErrorCode.TransactionFailed:
|
|
58
|
-
title = t(`swap.error.title.transactionFailed`);
|
|
59
|
-
message = t(`swap.error.message.transactionFailed`);
|
|
60
|
-
break;
|
|
61
|
-
case sdk_1.LifiErrorCode.TransactionUnderpriced:
|
|
62
|
-
title = t(`swap.error.title.transactionUnderpriced`);
|
|
63
|
-
message = getTransactionNotSentMessage();
|
|
64
|
-
break;
|
|
65
|
-
case sdk_1.LifiErrorCode.TransactionUnprepared:
|
|
66
|
-
title = t(`swap.error.title.transactionUnprepared`);
|
|
67
|
-
message = getTransactionNotSentMessage();
|
|
68
|
-
break;
|
|
69
|
-
case sdk_1.LifiErrorCode.SlippageError:
|
|
70
|
-
title = t(`swap.error.title.slippageTooLarge`);
|
|
71
|
-
message = t(`swap.error.message.slippageTooLarge`);
|
|
72
|
-
break;
|
|
73
|
-
case sdk_1.MetaMaskProviderErrorCode.userRejectedRequest:
|
|
74
|
-
title = t(`swap.error.title.userRejectedSignatureRequest`);
|
|
75
|
-
message = t(`swap.error.message.signatureRequired`, {
|
|
76
|
-
amount: (0, utils_1.formatTokenAmount)(step.action.fromAmount, step.action.fromToken.decimals),
|
|
77
|
-
tokenSymbol: step.action.fromToken.symbol,
|
|
78
|
-
chainName: (_b = (_a = getChainById(step.action.fromChainId)) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : '',
|
|
79
|
-
});
|
|
80
|
-
break;
|
|
81
|
-
default:
|
|
82
|
-
title = t(`swap.error.title.unknown`);
|
|
83
|
-
if (process.txLink) {
|
|
84
|
-
message = t(`swap.error.message.transactionFailed`);
|
|
85
|
-
}
|
|
86
|
-
break;
|
|
87
|
-
}
|
|
88
|
-
return { title, message };
|
|
89
|
-
}
|
|
90
|
-
const title = (_d = (_c = processMessages[process.type])[process.status]) === null || _d === void 0 ? void 0 : _d.call(_c, t);
|
|
91
|
-
return { title };
|
|
92
|
-
}
|
|
93
|
-
exports.getProcessMessage = getProcessMessage;
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
exports.useExecutingRoutes = void 0;
|
|
7
|
-
const shallow_1 = __importDefault(require("zustand/shallow"));
|
|
8
|
-
const useRouteStore_1 = require("./useRouteStore");
|
|
9
|
-
const useExecutingRoutes = (address) => {
|
|
10
|
-
return (0, useRouteStore_1.useRouteStore)((state) => Object.values(state.routes).filter((item) => (item === null || item === void 0 ? void 0 : item.route.fromAddress) === address &&
|
|
11
|
-
((item === null || item === void 0 ? void 0 : item.status) === 'loading' || (item === null || item === void 0 ? void 0 : item.status) === 'error')), shallow_1.default);
|
|
12
|
-
};
|
|
13
|
-
exports.useExecutingRoutes = useExecutingRoutes;
|
package/components/Step/utils.js
DELETED
|
@@ -1,89 +0,0 @@
|
|
|
1
|
-
import { LifiErrorCode, MetaMaskProviderErrorCode } from '@lifi/sdk';
|
|
2
|
-
import { formatTokenAmount } from '../../utils';
|
|
3
|
-
const formatProcessMessage = (initialMessage, args = {}) => {
|
|
4
|
-
return Object.keys(args).reduce((message, key) => {
|
|
5
|
-
return message.replace(`{${key}}`, args[key]);
|
|
6
|
-
}, initialMessage);
|
|
7
|
-
};
|
|
8
|
-
const processMessages = {
|
|
9
|
-
TOKEN_ALLOWANCE: {
|
|
10
|
-
STARTED: (t) => t(`swap.process.tokenAllowance.started`),
|
|
11
|
-
PENDING: (t) => t(`swap.process.tokenAllowance.pending`),
|
|
12
|
-
DONE: (t) => t(`swap.process.tokenAllowance.done`),
|
|
13
|
-
},
|
|
14
|
-
SWITCH_CHAIN: {
|
|
15
|
-
PENDING: (t) => t(`swap.process.switchChain.pending`),
|
|
16
|
-
DONE: (t) => t(`swap.process.switchChain.done`),
|
|
17
|
-
},
|
|
18
|
-
SWAP: {
|
|
19
|
-
STARTED: (t) => t(`swap.process.swap.started`),
|
|
20
|
-
ACTION_REQUIRED: (t) => t(`swap.process.swap.actionRequired`),
|
|
21
|
-
PENDING: (t) => t(`swap.process.swap.pending`),
|
|
22
|
-
DONE: (t) => t(`swap.process.swap.done`),
|
|
23
|
-
},
|
|
24
|
-
CROSS_CHAIN: {
|
|
25
|
-
STARTED: (t) => t(`swap.process.crossChain.started`),
|
|
26
|
-
ACTION_REQUIRED: (t) => t(`swap.process.crossChain.actionRequired`),
|
|
27
|
-
PENDING: (t) => t(`swap.process.crossChain.pending`),
|
|
28
|
-
DONE: (t) => t(`swap.process.crossChain.done`),
|
|
29
|
-
},
|
|
30
|
-
RECEIVING_CHAIN: {
|
|
31
|
-
PENDING: (t) => t(`swap.process.receivingChain.pending`),
|
|
32
|
-
DONE: (t) => t(`swap.process.receivingChain.done`),
|
|
33
|
-
},
|
|
34
|
-
TRANSACTION: {},
|
|
35
|
-
};
|
|
36
|
-
export function getProcessMessage(t, getChainById, step, process) {
|
|
37
|
-
var _a, _b, _c, _d;
|
|
38
|
-
if (process.error && process.status === 'FAILED') {
|
|
39
|
-
const getTransactionNotSentMessage = () => {
|
|
40
|
-
var _a, _b;
|
|
41
|
-
return t(`swap.error.message.transactionNotSent`, {
|
|
42
|
-
amount: formatTokenAmount(step.action.fromAmount, step.action.fromToken.decimals),
|
|
43
|
-
tokenSymbol: step.action.fromToken.symbol,
|
|
44
|
-
chainName: (_b = (_a = getChainById(step.action.fromChainId)) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : '',
|
|
45
|
-
});
|
|
46
|
-
};
|
|
47
|
-
let title = '';
|
|
48
|
-
let message = '';
|
|
49
|
-
switch (process.error.code) {
|
|
50
|
-
case LifiErrorCode.ChainSwitchError:
|
|
51
|
-
title = t(`swap.error.title.chainSwitch`);
|
|
52
|
-
message = getTransactionNotSentMessage();
|
|
53
|
-
break;
|
|
54
|
-
case LifiErrorCode.TransactionFailed:
|
|
55
|
-
title = t(`swap.error.title.transactionFailed`);
|
|
56
|
-
message = t(`swap.error.message.transactionFailed`);
|
|
57
|
-
break;
|
|
58
|
-
case LifiErrorCode.TransactionUnderpriced:
|
|
59
|
-
title = t(`swap.error.title.transactionUnderpriced`);
|
|
60
|
-
message = getTransactionNotSentMessage();
|
|
61
|
-
break;
|
|
62
|
-
case LifiErrorCode.TransactionUnprepared:
|
|
63
|
-
title = t(`swap.error.title.transactionUnprepared`);
|
|
64
|
-
message = getTransactionNotSentMessage();
|
|
65
|
-
break;
|
|
66
|
-
case LifiErrorCode.SlippageError:
|
|
67
|
-
title = t(`swap.error.title.slippageTooLarge`);
|
|
68
|
-
message = t(`swap.error.message.slippageTooLarge`);
|
|
69
|
-
break;
|
|
70
|
-
case MetaMaskProviderErrorCode.userRejectedRequest:
|
|
71
|
-
title = t(`swap.error.title.userRejectedSignatureRequest`);
|
|
72
|
-
message = t(`swap.error.message.signatureRequired`, {
|
|
73
|
-
amount: formatTokenAmount(step.action.fromAmount, step.action.fromToken.decimals),
|
|
74
|
-
tokenSymbol: step.action.fromToken.symbol,
|
|
75
|
-
chainName: (_b = (_a = getChainById(step.action.fromChainId)) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : '',
|
|
76
|
-
});
|
|
77
|
-
break;
|
|
78
|
-
default:
|
|
79
|
-
title = t(`swap.error.title.unknown`);
|
|
80
|
-
if (process.txLink) {
|
|
81
|
-
message = t(`swap.error.message.transactionFailed`);
|
|
82
|
-
}
|
|
83
|
-
break;
|
|
84
|
-
}
|
|
85
|
-
return { title, message };
|
|
86
|
-
}
|
|
87
|
-
const title = (_d = (_c = processMessages[process.type])[process.status]) === null || _d === void 0 ? void 0 : _d.call(_c, t);
|
|
88
|
-
return { title };
|
|
89
|
-
}
|
|
@@ -1,65 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
export declare const Button: import("@emotion/styled").StyledComponent<{
|
|
3
|
-
classes?: (Partial<import("@mui/material").ButtonClasses> & {
|
|
4
|
-
root?: string | undefined;
|
|
5
|
-
loading?: string | undefined;
|
|
6
|
-
loadingIndicator?: string | undefined;
|
|
7
|
-
loadingIndicatorCenter?: string | undefined;
|
|
8
|
-
loadingIndicatorStart?: string | undefined;
|
|
9
|
-
loadingIndicatorEnd?: string | undefined;
|
|
10
|
-
endIconLoadingEnd?: string | undefined;
|
|
11
|
-
startIconLoadingStart?: string | undefined;
|
|
12
|
-
}) | undefined;
|
|
13
|
-
loading?: boolean | undefined;
|
|
14
|
-
loadingIndicator?: import("react").ReactNode;
|
|
15
|
-
loadingPosition?: "center" | "end" | "start" | undefined;
|
|
16
|
-
sx?: import("@mui/material/styles").SxProps<import("@mui/material/styles").Theme> | undefined;
|
|
17
|
-
} & Omit<{
|
|
18
|
-
children?: import("react").ReactNode;
|
|
19
|
-
classes?: Partial<import("@mui/material").ButtonClasses> | undefined;
|
|
20
|
-
color?: "inherit" | "primary" | "secondary" | "error" | "warning" | "info" | "success" | undefined;
|
|
21
|
-
disabled?: boolean | undefined;
|
|
22
|
-
disableElevation?: boolean | undefined;
|
|
23
|
-
disableFocusRipple?: boolean | undefined;
|
|
24
|
-
endIcon?: import("react").ReactNode;
|
|
25
|
-
fullWidth?: boolean | undefined;
|
|
26
|
-
href?: string | undefined;
|
|
27
|
-
size?: "small" | "medium" | "large" | undefined;
|
|
28
|
-
startIcon?: import("react").ReactNode;
|
|
29
|
-
sx?: import("@mui/material/styles").SxProps<import("@mui/material/styles").Theme> | undefined;
|
|
30
|
-
variant?: "text" | "outlined" | "contained" | undefined;
|
|
31
|
-
} & Omit<{
|
|
32
|
-
action?: import("react").Ref<import("@mui/material").ButtonBaseActions> | undefined;
|
|
33
|
-
centerRipple?: boolean | undefined;
|
|
34
|
-
children?: import("react").ReactNode;
|
|
35
|
-
classes?: Partial<import("@mui/material").ButtonBaseClasses> | undefined;
|
|
36
|
-
disabled?: boolean | undefined;
|
|
37
|
-
disableRipple?: boolean | undefined;
|
|
38
|
-
disableTouchRipple?: boolean | undefined;
|
|
39
|
-
focusRipple?: boolean | undefined;
|
|
40
|
-
focusVisibleClassName?: string | undefined;
|
|
41
|
-
LinkComponent?: import("react").ElementType<any> | undefined;
|
|
42
|
-
onFocusVisible?: import("react").FocusEventHandler<any> | undefined;
|
|
43
|
-
sx?: import("@mui/material/styles").SxProps<import("@mui/material/styles").Theme> | undefined;
|
|
44
|
-
tabIndex?: number | undefined;
|
|
45
|
-
TouchRippleProps?: Partial<import("@mui/material/ButtonBase/TouchRipple").TouchRippleProps> | undefined;
|
|
46
|
-
touchRippleRef?: import("react").Ref<import("@mui/material/ButtonBase/TouchRipple").TouchRippleActions> | undefined;
|
|
47
|
-
}, "classes">, "classes"> & Omit<{
|
|
48
|
-
action?: import("react").Ref<import("@mui/material").ButtonBaseActions> | undefined;
|
|
49
|
-
centerRipple?: boolean | undefined;
|
|
50
|
-
children?: import("react").ReactNode;
|
|
51
|
-
classes?: Partial<import("@mui/material").ButtonBaseClasses> | undefined;
|
|
52
|
-
disabled?: boolean | undefined;
|
|
53
|
-
disableRipple?: boolean | undefined;
|
|
54
|
-
disableTouchRipple?: boolean | undefined;
|
|
55
|
-
focusRipple?: boolean | undefined;
|
|
56
|
-
focusVisibleClassName?: string | undefined;
|
|
57
|
-
LinkComponent?: import("react").ElementType<any> | undefined;
|
|
58
|
-
onFocusVisible?: import("react").FocusEventHandler<any> | undefined;
|
|
59
|
-
sx?: import("@mui/material/styles").SxProps<import("@mui/material/styles").Theme> | undefined;
|
|
60
|
-
tabIndex?: number | undefined;
|
|
61
|
-
TouchRippleProps?: Partial<import("@mui/material/ButtonBase/TouchRipple").TouchRippleProps> | undefined;
|
|
62
|
-
touchRippleRef?: import("react").Ref<import("@mui/material/ButtonBase/TouchRipple").TouchRippleActions> | undefined;
|
|
63
|
-
}, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Pick<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "key" | keyof import("react").ButtonHTMLAttributes<HTMLButtonElement>> & {
|
|
64
|
-
ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
|
|
65
|
-
}, keyof import("@mui/material/OverridableComponent").CommonProps | "tabIndex" | "color" | "children" | "action" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "TouchRippleProps" | "touchRippleRef" | "href" | "disableElevation" | "disableFocusRipple" | "endIcon" | "fullWidth" | "size" | "startIcon" | "variant" | "loading" | "loadingIndicator" | "loadingPosition"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import { LoadingButton } from '@mui/lab';
|
|
2
|
-
import { loadingButtonClasses } from '@mui/lab/LoadingButton';
|
|
3
|
-
import { styled } from '@mui/material/styles';
|
|
4
|
-
import { getContrastAlphaColor } from '../../utils';
|
|
5
|
-
export const Button = styled(LoadingButton)(({ theme }) => ({
|
|
6
|
-
[`&.${loadingButtonClasses.loading}`]: {
|
|
7
|
-
color: 'transparent',
|
|
8
|
-
},
|
|
9
|
-
[`.${loadingButtonClasses.loadingIndicator}`]: {
|
|
10
|
-
color: getContrastAlphaColor(theme, '70%'),
|
|
11
|
-
},
|
|
12
|
-
}));
|
|
@@ -1,25 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { ArrowForward as ArrowForwardIcon, KeyboardArrowRight as KeyboardArrowRightIcon, } from '@mui/icons-material';
|
|
3
|
-
import { Box, Stack } from '@mui/material';
|
|
4
|
-
import { useCallback } from 'react';
|
|
5
|
-
import { useTranslation } from 'react-i18next';
|
|
6
|
-
import { useNavigate } from 'react-router-dom';
|
|
7
|
-
import { useWallet } from '../../providers/WalletProvider';
|
|
8
|
-
import { useExecutingRoutes } from '../../stores';
|
|
9
|
-
import { navigationRoutes } from '../../utils';
|
|
10
|
-
import { CardTitle } from '../Card';
|
|
11
|
-
import { TokenAvatar, TokenAvatarGroup } from '../TokenAvatar';
|
|
12
|
-
import { ProgressCard, RouteCard } from './SwapInProgress.style';
|
|
13
|
-
export const SwapInProgress = (props) => {
|
|
14
|
-
const { t } = useTranslation();
|
|
15
|
-
const navigate = useNavigate();
|
|
16
|
-
const { account } = useWallet();
|
|
17
|
-
const executingRoutes = useExecutingRoutes(account.address);
|
|
18
|
-
const handleCardClick = useCallback((routeId) => {
|
|
19
|
-
navigate(navigationRoutes.swapExecution, { state: { routeId } });
|
|
20
|
-
}, [navigate]);
|
|
21
|
-
if (!(executingRoutes === null || executingRoutes === void 0 ? void 0 : executingRoutes.length)) {
|
|
22
|
-
return null;
|
|
23
|
-
}
|
|
24
|
-
return (_jsxs(ProgressCard, Object.assign({}, props, { children: [_jsx(CardTitle, { children: t('swap.inProgress') }), _jsx(Stack, Object.assign({ spacing: 2, py: 2 }, { children: executingRoutes.map(({ route, status }) => (_jsx(RouteCard, { onClick: () => handleCardClick(route.id), avatar: _jsxs(TokenAvatarGroup, Object.assign({ total: 2 }, { children: [_jsx(TokenAvatar, { token: route.fromToken }), _jsx(TokenAvatar, { token: route.toToken })] })), action: _jsx(KeyboardArrowRightIcon, {}), title: _jsxs(Box, Object.assign({ sx: { display: 'flex', alignItems: 'center' } }, { children: [route.fromToken.symbol, _jsx(ArrowForwardIcon, { fontSize: "small", sx: { paddingX: 0.5 } }), route.toToken.symbol] })) }, route.id))) }))] })));
|
|
25
|
-
};
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
import { alpha, styled } from '@mui/material/styles';
|
|
2
|
-
import { Card, CardHeader } from '../Card';
|
|
3
|
-
export const ProgressCard = styled(Card)(({ theme }) => ({
|
|
4
|
-
borderColor: alpha(theme.palette.secondary.main, 0.48),
|
|
5
|
-
background: alpha(theme.palette.secondary.main, 0.2),
|
|
6
|
-
'&:hover': {
|
|
7
|
-
background: alpha(theme.palette.secondary.main, 0.2),
|
|
8
|
-
},
|
|
9
|
-
}));
|
|
10
|
-
export const RouteCard = styled(CardHeader)(({ theme }) => ({
|
|
11
|
-
cursor: 'pointer',
|
|
12
|
-
paddingTop: 0,
|
|
13
|
-
paddingBottom: 0,
|
|
14
|
-
}));
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export * from './SwapInProgress';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export * from './SwapInProgress';
|