@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.
Files changed (311) hide show
  1. package/App.js +21 -0
  2. package/cjs/App.js +21 -0
  3. package/cjs/components/ActiveSwaps/ActiveSwapItem.d.ts +5 -0
  4. package/cjs/components/ActiveSwaps/ActiveSwapItem.js +45 -0
  5. package/cjs/components/{SwapInProgress/SwapInProgress.d.ts → ActiveSwaps/ActiveSwaps.d.ts} +1 -1
  6. package/cjs/components/ActiveSwaps/ActiveSwaps.js +30 -0
  7. package/cjs/components/ActiveSwaps/ActiveSwaps.style.d.ts +78 -0
  8. package/cjs/components/ActiveSwaps/ActiveSwaps.style.js +40 -0
  9. package/cjs/components/ActiveSwaps/index.d.ts +2 -0
  10. package/cjs/components/ActiveSwaps/index.js +18 -0
  11. package/cjs/components/Card/Card.d.ts +7 -4
  12. package/cjs/components/Card/Card.js +38 -28
  13. package/cjs/{pages/SelectTokenPage → components/ChainSelect}/ChainSelect.d.ts +1 -1
  14. package/cjs/components/ChainSelect/ChainSelect.js +35 -0
  15. package/cjs/components/{SwapInProgress/SwapInProgress.style.d.ts → ChainSelect/ChainSelect.style.d.ts} +10 -19
  16. package/cjs/components/ChainSelect/ChainSelect.style.js +19 -0
  17. package/cjs/components/ChainSelect/index.d.ts +2 -0
  18. package/cjs/components/ChainSelect/index.js +18 -0
  19. package/cjs/components/ChainSelect/useChainSelect.d.ts +8 -0
  20. package/cjs/components/ChainSelect/useChainSelect.js +33 -0
  21. package/cjs/components/Header/Header.js +3 -11
  22. package/cjs/components/Header/NavigationHeader.js +10 -17
  23. package/cjs/components/Header/WalletHeader.js +4 -5
  24. package/cjs/components/PoweredBy/PoweredBy.style.d.ts +1 -1
  25. package/cjs/components/PoweredBy/PoweredBy.style.js +1 -0
  26. package/cjs/components/ReverseTokensButton/ReverseTokensButton.js +10 -10
  27. package/cjs/components/SelectTokenButton/SelectTokenButton.d.ts +1 -1
  28. package/cjs/components/SelectTokenButton/SelectTokenButton.js +3 -3
  29. package/{components/SwapInProgress/SwapInProgress.d.ts → cjs/components/SendToWallet/SendToWallet.d.ts} +1 -1
  30. package/cjs/components/SendToWallet/SendToWallet.js +53 -0
  31. package/cjs/components/SendToWallet/SendToWallet.style.d.ts +19 -0
  32. package/cjs/components/SendToWallet/SendToWallet.style.js +15 -0
  33. package/cjs/components/SendToWallet/index.d.ts +1 -0
  34. package/cjs/components/{SwapInProgress → SendToWallet}/index.js +1 -1
  35. package/cjs/components/Step/CircularProgress.js +1 -1
  36. package/cjs/components/Step/CircularProgress.style.js +1 -1
  37. package/cjs/components/Step/StepProcess.js +1 -5
  38. package/cjs/components/Step/StepProcess.style.d.ts +1 -1
  39. package/cjs/components/Step/StepTimer.d.ts +1 -0
  40. package/cjs/components/Step/StepTimer.js +6 -6
  41. package/cjs/components/SwapButton/SwapButton.js +10 -14
  42. package/cjs/components/SwapButton/types.d.ts +2 -2
  43. package/cjs/components/SwapInput/FormPriceHelperText.d.ts +1 -1
  44. package/cjs/components/SwapInput/FormPriceHelperText.js +4 -4
  45. package/cjs/components/SwapInput/SwapInput.d.ts +1 -1
  46. package/cjs/components/SwapInput/SwapInput.js +4 -4
  47. package/cjs/components/SwapInput/SwapInputAdornment.d.ts +1 -1
  48. package/cjs/components/SwapInput/SwapInputAdornment.js +4 -4
  49. package/cjs/components/SwapRouteCard/SwapRouteCard.js +5 -4
  50. package/cjs/components/SwapRouteCard/SwapRouteCard.style.js +3 -3
  51. package/cjs/components/TokenAvatar/TokenAvatar.style.js +0 -3
  52. package/cjs/components/TokenList/TokenList.js +14 -11
  53. package/cjs/components/TokenList/types.d.ts +1 -1
  54. package/cjs/config/theme.js +24 -23
  55. package/cjs/config/version.d.ts +1 -1
  56. package/cjs/config/version.js +1 -1
  57. package/cjs/hooks/index.d.ts +3 -0
  58. package/cjs/hooks/index.js +3 -0
  59. package/cjs/hooks/useChains.d.ts +1 -97
  60. package/cjs/hooks/useChains.js +8 -15
  61. package/cjs/hooks/useNavigateBack.d.ts +4 -0
  62. package/cjs/hooks/useNavigateBack.js +18 -0
  63. package/cjs/{components/Step/utils.d.ts → hooks/useProcessMessage.d.ts} +4 -0
  64. package/cjs/{components/Step/utils.js → hooks/useProcessMessage.js} +16 -10
  65. package/cjs/hooks/useRouteExecution.d.ts +1 -1
  66. package/cjs/hooks/useRouteExecution.js +20 -29
  67. package/cjs/hooks/useSwapRoutes.js +18 -7
  68. package/cjs/hooks/useWidgetEvents.d.ts +3 -0
  69. package/cjs/hooks/useWidgetEvents.js +13 -0
  70. package/cjs/i18n/en/translation.json +25 -15
  71. package/cjs/i18n/index.d.ts +20 -10
  72. package/cjs/index.d.ts +1 -0
  73. package/cjs/index.js +3 -1
  74. package/cjs/pages/ActiveSwapsPage/ActiveSwapsEmpty.d.ts +2 -0
  75. package/cjs/pages/ActiveSwapsPage/ActiveSwapsEmpty.js +18 -0
  76. package/cjs/pages/ActiveSwapsPage/ActiveSwapsPage.d.ts +2 -0
  77. package/cjs/pages/ActiveSwapsPage/ActiveSwapsPage.js +21 -0
  78. package/cjs/pages/ActiveSwapsPage/index.d.ts +1 -0
  79. package/cjs/pages/ActiveSwapsPage/index.js +17 -0
  80. package/cjs/pages/MainPage/MainPage.js +2 -2
  81. package/cjs/pages/MainPage/MainSwapButton.js +3 -1
  82. package/cjs/pages/MainPage/SwapRoutes.js +4 -1
  83. package/cjs/pages/SelectChainPage/SelectChainPage.d.ts +3 -0
  84. package/cjs/pages/SelectChainPage/SelectChainPage.js +33 -0
  85. package/cjs/pages/SelectChainPage/SelectChainPage.style.d.ts +21 -0
  86. package/cjs/pages/SelectChainPage/SelectChainPage.style.js +20 -0
  87. package/cjs/pages/SelectChainPage/index.d.ts +1 -0
  88. package/cjs/pages/SelectChainPage/index.js +17 -0
  89. package/cjs/pages/SelectTokenPage/SearchTokenInput.js +3 -3
  90. package/cjs/pages/SelectTokenPage/SelectTokenPage.d.ts +2 -4
  91. package/cjs/pages/SelectTokenPage/SelectTokenPage.js +4 -8
  92. package/cjs/pages/SelectWalletPage/SelectWalletPage.js +10 -10
  93. package/cjs/pages/SelectWalletPage/SelectWalletPage.style.d.ts +2 -27
  94. package/cjs/pages/SelectWalletPage/SelectWalletPage.style.js +4 -14
  95. package/cjs/pages/SettingsPage/AdvancedPreferences.js +2 -2
  96. package/cjs/pages/SettingsPage/ColorSchemeButtonGroup.js +2 -2
  97. package/cjs/pages/SettingsPage/ColorSchemeButtonGroup.style.d.ts +1 -1
  98. package/cjs/pages/SettingsPage/EnabledBridgesSelect.js +3 -6
  99. package/cjs/pages/SettingsPage/EnabledExchangesSelect.js +3 -5
  100. package/cjs/pages/SettingsPage/RoutePrioritySelect.js +5 -1
  101. package/cjs/pages/SettingsPage/SettingsPage.js +2 -1
  102. package/cjs/pages/SettingsPage/ShowDestinationWallet.d.ts +2 -0
  103. package/cjs/pages/SettingsPage/ShowDestinationWallet.js +22 -0
  104. package/cjs/pages/SwapDetailsPage/SwapDetailsPage.js +4 -3
  105. package/cjs/pages/SwapHistoryPage/SwapHistoryPage.js +2 -2
  106. package/cjs/pages/SwapPage/StatusBottomSheet.js +29 -41
  107. package/cjs/pages/SwapPage/SwapPage.js +7 -3
  108. package/cjs/pages/SwapRoutesPage/SwapRoutesPage.js +1 -1
  109. package/cjs/providers/SwapFormProvider/SwapFormProvider.d.ts +1 -0
  110. package/cjs/providers/SwapFormProvider/SwapFormProvider.js +43 -9
  111. package/cjs/providers/SwapFormProvider/types.d.ts +3 -1
  112. package/cjs/providers/SwapFormProvider/types.js +1 -0
  113. package/cjs/providers/WalletProvider/WalletProvider.js +10 -4
  114. package/cjs/providers/WalletProvider/types.d.ts +4 -2
  115. package/cjs/providers/WidgetProvider/WidgetProvider.js +3 -7
  116. package/cjs/providers/index.d.ts +4 -0
  117. package/cjs/providers/index.js +20 -0
  118. package/cjs/stores/chains/index.d.ts +4 -0
  119. package/cjs/stores/chains/index.js +20 -0
  120. package/cjs/stores/chains/types.d.ts +8 -0
  121. package/cjs/stores/chains/types.js +2 -0
  122. package/cjs/stores/chains/useChainOrder.d.ts +1 -0
  123. package/cjs/stores/chains/useChainOrder.js +12 -0
  124. package/cjs/stores/chains/useChainOrderStore.d.ts +19 -0
  125. package/cjs/stores/chains/useChainOrderStore.js +42 -0
  126. package/cjs/stores/chains/useInitializeChainOrder.d.ts +1 -0
  127. package/cjs/stores/chains/useInitializeChainOrder.js +12 -0
  128. package/cjs/stores/route/index.d.ts +2 -1
  129. package/cjs/stores/route/index.js +2 -1
  130. package/cjs/stores/route/useExecutingRoutesIds.d.ts +1 -0
  131. package/cjs/stores/route/useExecutingRoutesIds.js +20 -0
  132. package/cjs/stores/route/useRouteStore.js +5 -4
  133. package/cjs/stores/route/utils.d.ts +4 -0
  134. package/cjs/stores/route/utils.js +21 -0
  135. package/cjs/stores/settings/types.d.ts +2 -1
  136. package/cjs/stores/settings/useSettingsStore.d.ts +4 -2
  137. package/cjs/stores/settings/useSettingsStore.js +6 -2
  138. package/cjs/types/events.d.ts +5 -0
  139. package/cjs/types/events.js +9 -0
  140. package/cjs/types/index.d.ts +1 -0
  141. package/cjs/types/index.js +1 -0
  142. package/cjs/types/widget.d.ts +3 -1
  143. package/cjs/utils/format.js +7 -2
  144. package/cjs/utils/navigationRoutes.d.ts +5 -0
  145. package/cjs/utils/navigationRoutes.js +31 -4
  146. package/components/ActiveSwaps/ActiveSwapItem.d.ts +5 -0
  147. package/components/ActiveSwaps/ActiveSwapItem.js +41 -0
  148. package/components/ActiveSwaps/ActiveSwaps.d.ts +3 -0
  149. package/components/ActiveSwaps/ActiveSwaps.js +26 -0
  150. package/components/ActiveSwaps/ActiveSwaps.style.d.ts +78 -0
  151. package/components/ActiveSwaps/ActiveSwaps.style.js +37 -0
  152. package/components/ActiveSwaps/index.d.ts +2 -0
  153. package/components/ActiveSwaps/index.js +2 -0
  154. package/components/Card/Card.d.ts +7 -4
  155. package/components/Card/Card.js +39 -29
  156. package/{pages/SelectTokenPage → components/ChainSelect}/ChainSelect.d.ts +1 -1
  157. package/components/ChainSelect/ChainSelect.js +31 -0
  158. package/components/{SwapInProgress/SwapInProgress.style.d.ts → ChainSelect/ChainSelect.style.d.ts} +10 -19
  159. package/components/ChainSelect/ChainSelect.style.js +16 -0
  160. package/components/ChainSelect/index.d.ts +2 -0
  161. package/components/ChainSelect/index.js +2 -0
  162. package/components/ChainSelect/useChainSelect.d.ts +8 -0
  163. package/components/ChainSelect/useChainSelect.js +29 -0
  164. package/components/Header/Header.js +2 -10
  165. package/components/Header/NavigationHeader.js +11 -18
  166. package/components/Header/WalletHeader.js +1 -2
  167. package/components/PoweredBy/PoweredBy.style.d.ts +1 -1
  168. package/components/PoweredBy/PoweredBy.style.js +1 -0
  169. package/components/ReverseTokensButton/ReverseTokensButton.js +1 -1
  170. package/components/SelectTokenButton/SelectTokenButton.d.ts +1 -1
  171. package/components/SelectTokenButton/SelectTokenButton.js +1 -1
  172. package/components/SendToWallet/SendToWallet.d.ts +3 -0
  173. package/components/SendToWallet/SendToWallet.js +49 -0
  174. package/components/SendToWallet/SendToWallet.style.d.ts +19 -0
  175. package/components/SendToWallet/SendToWallet.style.js +12 -0
  176. package/components/SendToWallet/index.d.ts +1 -0
  177. package/components/SendToWallet/index.js +1 -0
  178. package/components/Step/CircularProgress.js +3 -3
  179. package/components/Step/CircularProgress.style.js +1 -1
  180. package/components/Step/StepProcess.js +2 -6
  181. package/components/Step/StepProcess.style.d.ts +1 -1
  182. package/components/Step/StepTimer.d.ts +1 -0
  183. package/components/Step/StepTimer.js +6 -6
  184. package/components/SwapButton/SwapButton.js +7 -11
  185. package/components/SwapButton/types.d.ts +2 -2
  186. package/components/SwapInput/FormPriceHelperText.d.ts +1 -1
  187. package/components/SwapInput/FormPriceHelperText.js +1 -1
  188. package/components/SwapInput/SwapInput.d.ts +1 -1
  189. package/components/SwapInput/SwapInput.js +1 -1
  190. package/components/SwapInput/SwapInputAdornment.d.ts +1 -1
  191. package/components/SwapInput/SwapInputAdornment.js +1 -1
  192. package/components/SwapRouteCard/SwapRouteCard.js +5 -4
  193. package/components/SwapRouteCard/SwapRouteCard.style.js +3 -3
  194. package/components/TokenAvatar/TokenAvatar.style.js +0 -3
  195. package/components/TokenList/TokenList.js +7 -4
  196. package/components/TokenList/types.d.ts +1 -1
  197. package/config/theme.js +24 -23
  198. package/config/version.d.ts +1 -1
  199. package/config/version.js +1 -1
  200. package/hooks/index.d.ts +3 -0
  201. package/hooks/index.js +3 -0
  202. package/hooks/useChains.d.ts +1 -97
  203. package/hooks/useChains.js +8 -15
  204. package/hooks/useNavigateBack.d.ts +4 -0
  205. package/hooks/useNavigateBack.js +14 -0
  206. package/{components/Step/utils.d.ts → hooks/useProcessMessage.d.ts} +4 -0
  207. package/{pages/SwapPage/utils.js → hooks/useProcessMessage.js} +15 -10
  208. package/hooks/useRouteExecution.d.ts +1 -1
  209. package/hooks/useRouteExecution.js +21 -30
  210. package/hooks/useSwapRoutes.js +18 -7
  211. package/hooks/useWidgetEvents.d.ts +3 -0
  212. package/hooks/useWidgetEvents.js +6 -0
  213. package/i18n/en/translation.json +25 -15
  214. package/i18n/index.d.ts +20 -10
  215. package/index.d.ts +1 -0
  216. package/index.js +1 -0
  217. package/package.json +17 -19
  218. package/pages/ActiveSwapsPage/ActiveSwapsEmpty.d.ts +2 -0
  219. package/pages/ActiveSwapsPage/ActiveSwapsEmpty.js +14 -0
  220. package/pages/ActiveSwapsPage/ActiveSwapsPage.d.ts +2 -0
  221. package/pages/ActiveSwapsPage/ActiveSwapsPage.js +17 -0
  222. package/pages/ActiveSwapsPage/index.d.ts +1 -0
  223. package/pages/ActiveSwapsPage/index.js +1 -0
  224. package/pages/MainPage/MainPage.js +2 -2
  225. package/pages/MainPage/MainSwapButton.js +3 -1
  226. package/pages/MainPage/SwapRoutes.js +4 -1
  227. package/pages/SelectChainPage/SelectChainPage.d.ts +3 -0
  228. package/pages/SelectChainPage/SelectChainPage.js +29 -0
  229. package/pages/SelectChainPage/SelectChainPage.style.d.ts +21 -0
  230. package/pages/SelectChainPage/SelectChainPage.style.js +17 -0
  231. package/pages/SelectChainPage/index.d.ts +1 -0
  232. package/pages/SelectChainPage/index.js +1 -0
  233. package/pages/SelectTokenPage/SearchTokenInput.js +1 -1
  234. package/pages/SelectTokenPage/SelectTokenPage.d.ts +2 -4
  235. package/pages/SelectTokenPage/SelectTokenPage.js +5 -9
  236. package/pages/SelectWalletPage/SelectWalletPage.js +10 -10
  237. package/pages/SelectWalletPage/SelectWalletPage.style.d.ts +2 -27
  238. package/pages/SelectWalletPage/SelectWalletPage.style.js +4 -14
  239. package/pages/SettingsPage/AdvancedPreferences.js +2 -2
  240. package/pages/SettingsPage/ColorSchemeButtonGroup.js +1 -1
  241. package/pages/SettingsPage/ColorSchemeButtonGroup.style.d.ts +1 -1
  242. package/pages/SettingsPage/EnabledBridgesSelect.js +4 -7
  243. package/pages/SettingsPage/EnabledExchangesSelect.js +4 -6
  244. package/pages/SettingsPage/RoutePrioritySelect.js +5 -1
  245. package/pages/SettingsPage/SettingsPage.js +2 -1
  246. package/pages/SettingsPage/ShowDestinationWallet.d.ts +2 -0
  247. package/pages/SettingsPage/ShowDestinationWallet.js +18 -0
  248. package/pages/SwapDetailsPage/SwapDetailsPage.js +5 -4
  249. package/pages/SwapHistoryPage/SwapHistoryPage.js +1 -1
  250. package/pages/SwapPage/StatusBottomSheet.js +30 -42
  251. package/pages/SwapPage/SwapPage.js +9 -5
  252. package/pages/SwapRoutesPage/SwapRoutesPage.js +1 -1
  253. package/providers/SwapFormProvider/SwapFormProvider.d.ts +1 -0
  254. package/providers/SwapFormProvider/SwapFormProvider.js +43 -9
  255. package/providers/SwapFormProvider/types.d.ts +3 -1
  256. package/providers/SwapFormProvider/types.js +1 -0
  257. package/providers/WalletProvider/WalletProvider.js +10 -4
  258. package/providers/WalletProvider/types.d.ts +4 -2
  259. package/providers/WidgetProvider/WidgetProvider.js +3 -7
  260. package/providers/index.d.ts +4 -0
  261. package/providers/index.js +4 -0
  262. package/stores/chains/index.d.ts +4 -0
  263. package/stores/chains/index.js +4 -0
  264. package/stores/chains/types.d.ts +8 -0
  265. package/stores/chains/types.js +1 -0
  266. package/stores/chains/useChainOrder.d.ts +1 -0
  267. package/stores/chains/useChainOrder.js +5 -0
  268. package/stores/chains/useChainOrderStore.d.ts +19 -0
  269. package/stores/chains/useChainOrderStore.js +36 -0
  270. package/stores/chains/useInitializeChainOrder.d.ts +1 -0
  271. package/stores/chains/useInitializeChainOrder.js +5 -0
  272. package/stores/route/index.d.ts +2 -1
  273. package/stores/route/index.js +2 -1
  274. package/stores/route/useExecutingRoutesIds.d.ts +1 -0
  275. package/stores/route/useExecutingRoutesIds.js +13 -0
  276. package/stores/route/useRouteStore.js +5 -4
  277. package/stores/route/utils.d.ts +4 -0
  278. package/stores/route/utils.js +15 -0
  279. package/stores/settings/types.d.ts +2 -1
  280. package/stores/settings/useSettingsStore.d.ts +4 -2
  281. package/stores/settings/useSettingsStore.js +6 -2
  282. package/tsconfig.cjs.tsbuildinfo +1 -1
  283. package/types/events.d.ts +5 -0
  284. package/types/events.js +6 -0
  285. package/types/index.d.ts +1 -0
  286. package/types/index.js +1 -0
  287. package/types/widget.d.ts +3 -1
  288. package/utils/format.js +7 -2
  289. package/utils/navigationRoutes.d.ts +5 -0
  290. package/utils/navigationRoutes.js +30 -3
  291. package/cjs/components/SwapButton/SwapButton.style.d.ts +0 -65
  292. package/cjs/components/SwapButton/SwapButton.style.js +0 -15
  293. package/cjs/components/SwapInProgress/SwapInProgress.js +0 -29
  294. package/cjs/components/SwapInProgress/SwapInProgress.style.js +0 -17
  295. package/cjs/components/SwapInProgress/index.d.ts +0 -1
  296. package/cjs/pages/SelectTokenPage/ChainSelect.js +0 -32
  297. package/cjs/pages/SwapPage/utils.d.ts +0 -6
  298. package/cjs/pages/SwapPage/utils.js +0 -93
  299. package/cjs/stores/route/useExecutingRoutes.d.ts +0 -2
  300. package/cjs/stores/route/useExecutingRoutes.js +0 -13
  301. package/components/Step/utils.js +0 -89
  302. package/components/SwapButton/SwapButton.style.d.ts +0 -65
  303. package/components/SwapButton/SwapButton.style.js +0 -12
  304. package/components/SwapInProgress/SwapInProgress.js +0 -25
  305. package/components/SwapInProgress/SwapInProgress.style.js +0 -14
  306. package/components/SwapInProgress/index.d.ts +0 -1
  307. package/components/SwapInProgress/index.js +0 -1
  308. package/pages/SelectTokenPage/ChainSelect.js +0 -28
  309. package/pages/SwapPage/utils.d.ts +0 -6
  310. package/stores/route/useExecutingRoutes.d.ts +0 -2
  311. package/stores/route/useExecutingRoutes.js +0 -6
@@ -0,0 +1,5 @@
1
+ export declare enum WidgetEvent {
2
+ SwapStarted = "swapStarted",
3
+ SwapCompleted = "swapCompleted",
4
+ SwapFailed = "swapFailed"
5
+ }
@@ -0,0 +1,6 @@
1
+ export var WidgetEvent;
2
+ (function (WidgetEvent) {
3
+ WidgetEvent["SwapStarted"] = "swapStarted";
4
+ WidgetEvent["SwapCompleted"] = "swapCompleted";
5
+ WidgetEvent["SwapFailed"] = "swapFailed";
6
+ })(WidgetEvent || (WidgetEvent = {}));
package/types/index.d.ts CHANGED
@@ -1,2 +1,3 @@
1
+ export * from './events';
1
2
  export * from './token';
2
3
  export * from './widget';
package/types/index.js CHANGED
@@ -1,2 +1,3 @@
1
+ export * from './events';
1
2
  export * from './token';
2
3
  export * from './widget';
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
- if (returnInitial) {
64
- return amount;
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: 'select-wallet',
3
+ selectWallet: 'wallet',
4
4
  settings: 'settings',
5
- fromToken: 'select-from-token',
6
- toToken: 'select-to-token',
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,2 +0,0 @@
1
- import type { RouteExecution } from './types';
2
- export declare const useExecutingRoutes: (address?: string) => RouteExecution[];
@@ -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;
@@ -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';