@lifi/widget 4.4.0 → 4.6.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 (329) hide show
  1. package/dist/esm/App.js.map +1 -1
  2. package/dist/esm/AppDrawer.js +2 -1
  3. package/dist/esm/AppDrawer.js.map +1 -1
  4. package/dist/esm/AppLayout.js.map +1 -1
  5. package/dist/esm/AppProvider.js.map +1 -1
  6. package/dist/esm/components/ActionRow/ActionRow.js.map +1 -1
  7. package/dist/esm/components/AmountInput/AmountInput.js +13 -7
  8. package/dist/esm/components/AmountInput/AmountInput.js.map +1 -1
  9. package/dist/esm/components/AmountInput/AmountInputEndAdornment.js +2 -13
  10. package/dist/esm/components/AmountInput/AmountInputEndAdornment.js.map +1 -1
  11. package/dist/esm/components/AmountInput/PriceFormHelperText.js.map +1 -1
  12. package/dist/esm/components/AmountInputCard/AmountInputCardPair.js.map +1 -1
  13. package/dist/esm/components/AmountInputCard/BalanceDisplay.js.map +1 -1
  14. package/dist/esm/components/AmountInputCard/FiatValueToggle.js.map +1 -1
  15. package/dist/esm/components/AmountInputCard/PercentageChips.js +2 -13
  16. package/dist/esm/components/AmountInputCard/PercentageChips.js.map +1 -1
  17. package/dist/esm/components/AmountInputCard/PercentageChips.style.js +1 -1
  18. package/dist/esm/components/AmountInputCard/PercentageChips.style.js.map +1 -1
  19. package/dist/esm/components/AmountInputCard/ReceiveAmountCard.js.map +1 -1
  20. package/dist/esm/components/AmountInputCard/SendAmountCard.js +13 -6
  21. package/dist/esm/components/AmountInputCard/SendAmountCard.js.map +1 -1
  22. package/dist/esm/components/AppContainer.js.map +1 -1
  23. package/dist/esm/components/Avatar/AccountAvatar.js.map +1 -1
  24. package/dist/esm/components/Avatar/Avatar.js.map +1 -1
  25. package/dist/esm/components/Avatar/ChainBadgeContent.js.map +1 -1
  26. package/dist/esm/components/Avatar/TokenAvatar.js.map +1 -1
  27. package/dist/esm/components/BaseTransactionButton/BaseTransactionButton.js.map +1 -1
  28. package/dist/esm/components/Card/CardButton.js.map +1 -1
  29. package/dist/esm/components/ChainSelect/ChainSelect.js.map +1 -1
  30. package/dist/esm/components/Chains/AllChainsAvatar.js +7 -1
  31. package/dist/esm/components/Chains/AllChainsAvatar.js.map +1 -1
  32. package/dist/esm/components/Chains/ChainList.js.map +1 -1
  33. package/dist/esm/components/Chains/ChainListItem.js.map +1 -1
  34. package/dist/esm/components/Chains/ChainsExpanded.js.map +1 -1
  35. package/dist/esm/components/Chains/PinChainButton.js.map +1 -1
  36. package/dist/esm/components/Chains/SelectChainExpansionContent.js.map +1 -1
  37. package/dist/esm/components/Chains/SelectChainPageContent.js.map +1 -1
  38. package/dist/esm/components/Chains/VirtualizedChainList.js.map +1 -1
  39. package/dist/esm/components/ContextMenu.js.map +1 -1
  40. package/dist/esm/components/ContractComponent/NFT/NFTBase.js.map +1 -1
  41. package/dist/esm/components/Dialog/Dialog.js +2 -1
  42. package/dist/esm/components/Dialog/Dialog.js.map +1 -1
  43. package/dist/esm/components/ExecutionStatusCard/ExecutionChecklist.js.map +1 -1
  44. package/dist/esm/components/ExecutionStatusCard/ExecutionStatusCard.js.map +1 -1
  45. package/dist/esm/components/ExecutionStatusCard/StaggeredRevealTypography.js.map +1 -1
  46. package/dist/esm/components/ExecutionStatusCard/StatusIcon.js.map +1 -1
  47. package/dist/esm/components/Expansion/Expansion.js +4 -3
  48. package/dist/esm/components/Expansion/Expansion.js.map +1 -1
  49. package/dist/esm/components/Expansion/ExpansionTransition.js.map +1 -1
  50. package/dist/esm/components/FeeBreakdownTooltip.js.map +1 -1
  51. package/dist/esm/components/Header/ActivitiesButton.js.map +1 -1
  52. package/dist/esm/components/Header/BackButton.js.map +1 -1
  53. package/dist/esm/components/Header/CloseDrawerButton.js.map +1 -1
  54. package/dist/esm/components/Header/DisconnectIconButton.js.map +1 -1
  55. package/dist/esm/components/Header/HeaderTabs.js.map +1 -1
  56. package/dist/esm/components/Header/NavigationHeader.js.map +1 -1
  57. package/dist/esm/components/Header/SettingsButton.js +2 -1
  58. package/dist/esm/components/Header/SettingsButton.js.map +1 -1
  59. package/dist/esm/components/Header/WalletHeader.js.map +1 -1
  60. package/dist/esm/components/Header/WalletMenu.js.map +1 -1
  61. package/dist/esm/components/IconCircle/IconCircle.js +2 -1
  62. package/dist/esm/components/IconCircle/IconCircle.js.map +1 -1
  63. package/dist/esm/components/LimitOrderSettings/LimitOrderSettings.js.map +1 -1
  64. package/dist/esm/components/LimitPriceCard/LimitPriceCard.js.map +1 -1
  65. package/dist/esm/components/LimitPriceCard/LimitPricePresets.js.map +1 -1
  66. package/dist/esm/components/Messages/AccountDeployedMessage.js.map +1 -1
  67. package/dist/esm/components/Messages/AccountNotDeployedMessage.js.map +1 -1
  68. package/dist/esm/components/Messages/AlertMessage.js.map +1 -1
  69. package/dist/esm/components/Messages/FundsSufficiencyMessage.js.map +1 -1
  70. package/dist/esm/components/Messages/GasRefuelMessage.js.map +1 -1
  71. package/dist/esm/components/Messages/GasSufficiencyMessage.js.map +1 -1
  72. package/dist/esm/components/Messages/MinFromAmountUSDMessage.js.map +1 -1
  73. package/dist/esm/components/Messages/MissingRouteRequiredAccountMessage.js.map +1 -1
  74. package/dist/esm/components/Messages/UnsupportedToAddressMessage.js +27 -0
  75. package/dist/esm/components/Messages/UnsupportedToAddressMessage.js.map +1 -0
  76. package/dist/esm/components/Messages/WarningMessages.d.ts.map +1 -1
  77. package/dist/esm/components/Messages/WarningMessages.js +2 -0
  78. package/dist/esm/components/Messages/WarningMessages.js.map +1 -1
  79. package/dist/esm/components/Messages/useMessageQueue.js +6 -1
  80. package/dist/esm/components/Messages/useMessageQueue.js.map +1 -1
  81. package/dist/esm/components/NotFound.js.map +1 -1
  82. package/dist/esm/components/PoweredBy/PoweredBy.js.map +1 -1
  83. package/dist/esm/components/ProgressToNextUpdate.js.map +1 -1
  84. package/dist/esm/components/ReverseTokensButton/ReverseTokensButton.js.map +1 -1
  85. package/dist/esm/components/RouteCard/RouteCard.js.map +1 -1
  86. package/dist/esm/components/RouteCard/RouteCardEssentials.js.map +1 -1
  87. package/dist/esm/components/RouteCard/RouteCardSkeleton.js.map +1 -1
  88. package/dist/esm/components/RouteCard/RouteDetails.js +2 -1
  89. package/dist/esm/components/RouteCard/RouteDetails.js.map +1 -1
  90. package/dist/esm/components/RouteCard/RouteNotFoundCard.js.map +1 -1
  91. package/dist/esm/components/RouteCard/RouteProviderCard.js.map +1 -1
  92. package/dist/esm/components/RouteCard/RouteToken.js.map +1 -1
  93. package/dist/esm/components/RouteCard/RouteTokens.js.map +1 -1
  94. package/dist/esm/components/Routes/LimitOrderRoutes.js +2 -2
  95. package/dist/esm/components/Routes/LimitOrderRoutes.js.map +1 -1
  96. package/dist/esm/components/Routes/Routes.js.map +1 -1
  97. package/dist/esm/components/Routes/RoutesContent.js +2 -2
  98. package/dist/esm/components/Routes/RoutesContent.js.map +1 -1
  99. package/dist/esm/components/Routes/RoutesExpanded.js.map +1 -1
  100. package/dist/esm/components/Search/SearchInput.js.map +1 -1
  101. package/dist/esm/components/SelectChainAndToken.js.map +1 -1
  102. package/dist/esm/components/SelectTokenButton/SelectTokenButton.js.map +1 -1
  103. package/dist/esm/components/SendToWallet/SendToWalletButton.js.map +1 -1
  104. package/dist/esm/components/SendToWallet/SendToWalletExpandButton.js +2 -2
  105. package/dist/esm/components/SendToWallet/SendToWalletExpandButton.js.map +1 -1
  106. package/dist/esm/components/SettingsPanel/SettingsPanel.js.map +1 -1
  107. package/dist/esm/components/Skeleton/WidgetSkeleton.js +2 -1
  108. package/dist/esm/components/Skeleton/WidgetSkeleton.js.map +1 -1
  109. package/dist/esm/components/Step/StepActions.js +18 -16
  110. package/dist/esm/components/Step/StepActions.js.map +1 -1
  111. package/dist/esm/components/StepActions/SentToWalletRow.js.map +1 -1
  112. package/dist/esm/components/StepActions/StepActionRow.js +2 -1
  113. package/dist/esm/components/StepActions/StepActionRow.js.map +1 -1
  114. package/dist/esm/components/StepActions/StepActionsList.js.map +1 -1
  115. package/dist/esm/components/SwapButton/SwapButton.js.map +1 -1
  116. package/dist/esm/components/Switch.js +1 -1
  117. package/dist/esm/components/Switch.js.map +1 -1
  118. package/dist/esm/components/Tabs/Tabs.style.js +4 -2
  119. package/dist/esm/components/Tabs/Tabs.style.js.map +1 -1
  120. package/dist/esm/components/TextFitter/TextFitter.js.map +1 -1
  121. package/dist/esm/components/Timer/StepStatusTimer.js.map +1 -1
  122. package/dist/esm/components/Token/Token.js.map +1 -1
  123. package/dist/esm/components/TokenList/PinTokenButton.js.map +1 -1
  124. package/dist/esm/components/TokenList/TokenDetailsSheet.js.map +1 -1
  125. package/dist/esm/components/TokenList/TokenDetailsSheetContent.js.map +1 -1
  126. package/dist/esm/components/TokenList/TokenList.js.map +1 -1
  127. package/dist/esm/components/TokenList/TokenListItem.js +46 -8
  128. package/dist/esm/components/TokenList/TokenListItem.js.map +1 -1
  129. package/dist/esm/components/TokenList/VirtualizedTokenList.js +22 -9
  130. package/dist/esm/components/TokenList/VirtualizedTokenList.js.map +1 -1
  131. package/dist/esm/components/TokenPillButton/TokenPillButton.js.map +1 -1
  132. package/dist/esm/components/TokenRate/TokenRate.js +2 -1
  133. package/dist/esm/components/TokenRate/TokenRate.js.map +1 -1
  134. package/dist/esm/components/Tools/ToolItem.js.map +1 -1
  135. package/dist/esm/components/Tools/Tools.js.map +1 -1
  136. package/dist/esm/components/TransactionCard/ActiveTransactionCard.js +22 -21
  137. package/dist/esm/components/TransactionCard/ActiveTransactionCard.js.map +1 -1
  138. package/dist/esm/components/TransactionCard/TransactionCard.js.map +1 -1
  139. package/dist/esm/components/TransactionCard/TransactionCardSkeleton.js.map +1 -1
  140. package/dist/esm/config/version.d.ts +1 -1
  141. package/dist/esm/config/version.js +1 -1
  142. package/dist/esm/config/version.js.map +1 -1
  143. package/dist/esm/hooks/timer/time.js +2 -2
  144. package/dist/esm/hooks/timer/time.js.map +1 -1
  145. package/dist/esm/hooks/useAccountsBalancesData.js +1 -14
  146. package/dist/esm/hooks/useAccountsBalancesData.js.map +1 -1
  147. package/dist/esm/hooks/useAvailableChains.d.ts.map +1 -1
  148. package/dist/esm/hooks/useAvailableChains.js +2 -1
  149. package/dist/esm/hooks/useAvailableChains.js.map +1 -1
  150. package/dist/esm/hooks/useExplorer.d.ts.map +1 -1
  151. package/dist/esm/hooks/useExplorer.js +4 -0
  152. package/dist/esm/hooks/useExplorer.js.map +1 -1
  153. package/dist/esm/hooks/useFlaggedTokenGuard.js +28 -0
  154. package/dist/esm/hooks/useFlaggedTokenGuard.js.map +1 -0
  155. package/dist/esm/hooks/useGasSufficiency.js +3 -1
  156. package/dist/esm/hooks/useGasSufficiency.js.map +1 -1
  157. package/dist/esm/hooks/useMaxSendAmount.js +15 -0
  158. package/dist/esm/hooks/useMaxSendAmount.js.map +1 -0
  159. package/dist/esm/hooks/usePacedRouteExecution.js +3 -2
  160. package/dist/esm/hooks/usePacedRouteExecution.js.map +1 -1
  161. package/dist/esm/hooks/useRouteExecutionMessage.js +3 -2
  162. package/dist/esm/hooks/useRouteExecutionMessage.js.map +1 -1
  163. package/dist/esm/hooks/useRoutes.d.ts.map +1 -1
  164. package/dist/esm/hooks/useRoutes.js +3 -1
  165. package/dist/esm/hooks/useRoutes.js.map +1 -1
  166. package/dist/esm/hooks/useToAddressAutoPopulate.js.map +1 -1
  167. package/dist/esm/hooks/useToAddressRequirements.d.ts +2 -0
  168. package/dist/esm/hooks/useToAddressRequirements.d.ts.map +1 -1
  169. package/dist/esm/hooks/useToAddressRequirements.js +7 -1
  170. package/dist/esm/hooks/useToAddressRequirements.js.map +1 -1
  171. package/dist/esm/hooks/useTokenBalances.d.ts.map +1 -1
  172. package/dist/esm/hooks/useTokenBalances.js +7 -2
  173. package/dist/esm/hooks/useTokenBalances.js.map +1 -1
  174. package/dist/esm/hooks/useTokenBalancesQueries.js +32 -29
  175. package/dist/esm/hooks/useTokenBalancesQueries.js.map +1 -1
  176. package/dist/esm/hooks/useTokenSearch.js +3 -5
  177. package/dist/esm/hooks/useTokenSearch.js.map +1 -1
  178. package/dist/esm/hooks/useTokens.js +14 -10
  179. package/dist/esm/hooks/useTokens.js.map +1 -1
  180. package/dist/esm/hooks/useWideVariant.js +2 -1
  181. package/dist/esm/hooks/useWideVariant.js.map +1 -1
  182. package/dist/esm/i18n/bn.json +3 -1
  183. package/dist/esm/i18n/de.json +3 -1
  184. package/dist/esm/i18n/en.json +12 -3
  185. package/dist/esm/i18n/es.json +3 -1
  186. package/dist/esm/i18n/fr.json +3 -1
  187. package/dist/esm/i18n/hi.json +3 -1
  188. package/dist/esm/i18n/id.json +3 -1
  189. package/dist/esm/i18n/it.json +3 -1
  190. package/dist/esm/i18n/ja.json +3 -1
  191. package/dist/esm/i18n/ko.json +3 -1
  192. package/dist/esm/i18n/pl.json +3 -1
  193. package/dist/esm/i18n/pt.json +3 -1
  194. package/dist/esm/i18n/th.json +3 -1
  195. package/dist/esm/i18n/tr.json +3 -1
  196. package/dist/esm/i18n/uk.json +3 -1
  197. package/dist/esm/i18n/vi.json +3 -1
  198. package/dist/esm/i18n/zh.json +3 -1
  199. package/dist/esm/pages/ActivitiesPage/ActivitiesPage.js.map +1 -1
  200. package/dist/esm/pages/ActivitiesPage/ActivitiesPageMenuButton.js.map +1 -1
  201. package/dist/esm/pages/LanguagesPage.js.map +1 -1
  202. package/dist/esm/pages/MainPage/LimitPageContent.js.map +1 -1
  203. package/dist/esm/pages/MainPage/MainPage.js +2 -1
  204. package/dist/esm/pages/MainPage/MainPage.js.map +1 -1
  205. package/dist/esm/pages/MainPage/MainPageActions.js.map +1 -1
  206. package/dist/esm/pages/MainPage/ReviewButton.js +2 -2
  207. package/dist/esm/pages/MainPage/ReviewButton.js.map +1 -1
  208. package/dist/esm/pages/RoutePriorityPage.js.map +1 -1
  209. package/dist/esm/pages/RoutesPage/RoutesPage.js +2 -2
  210. package/dist/esm/pages/RoutesPage/RoutesPage.js.map +1 -1
  211. package/dist/esm/pages/SelectChainPage/SelectChainPage.js +13 -12
  212. package/dist/esm/pages/SelectChainPage/SelectChainPage.js.map +1 -1
  213. package/dist/esm/pages/SelectEnabledToolsPage.js +8 -5
  214. package/dist/esm/pages/SelectEnabledToolsPage.js.map +1 -1
  215. package/dist/esm/pages/SelectTokenPage/SelectTokenPage.js +2 -1
  216. package/dist/esm/pages/SelectTokenPage/SelectTokenPage.js.map +1 -1
  217. package/dist/esm/pages/SendToWallet/BookmarkAddressSheet.js.map +1 -1
  218. package/dist/esm/pages/SendToWallet/BookmarksPage.js.map +1 -1
  219. package/dist/esm/pages/SendToWallet/ConfirmAddressSheet.js.map +1 -1
  220. package/dist/esm/pages/SendToWallet/ConnectedWalletsPage.js.map +1 -1
  221. package/dist/esm/pages/SendToWallet/RecentWalletsPage.js.map +1 -1
  222. package/dist/esm/pages/SendToWallet/SendToConfiguredWalletPage.js.map +1 -1
  223. package/dist/esm/pages/SendToWallet/SendToWalletPage.js.map +1 -1
  224. package/dist/esm/pages/SettingsPage/BridgeAndExchangeSettings.js.map +1 -1
  225. package/dist/esm/pages/SettingsPage/GasPriceSettings.js.map +1 -1
  226. package/dist/esm/pages/SettingsPage/LanguageSetting.js.map +1 -1
  227. package/dist/esm/pages/SettingsPage/ResetSettingsButton.js.map +1 -1
  228. package/dist/esm/pages/SettingsPage/RoutePrioritySettings.js.map +1 -1
  229. package/dist/esm/pages/SettingsPage/SettingsCard/BadgedValue.js.map +1 -1
  230. package/dist/esm/pages/SettingsPage/SettingsCard/SettingCardExpandable.js.map +1 -1
  231. package/dist/esm/pages/SettingsPage/SettingsPage.js.map +1 -1
  232. package/dist/esm/pages/SettingsPage/SlippageSettings/SlippagePage.js.map +1 -1
  233. package/dist/esm/pages/SettingsPage/SlippageSettings/SlippageSettings.js.map +1 -1
  234. package/dist/esm/pages/SettingsPage/SmallBalanceFilterSettings.js +2 -1
  235. package/dist/esm/pages/SettingsPage/SmallBalanceFilterSettings.js.map +1 -1
  236. package/dist/esm/pages/SettingsPage/ThemeSettings.js.map +1 -1
  237. package/dist/esm/pages/TransactionDetailsPage/ContactSupportButton.js +2 -1
  238. package/dist/esm/pages/TransactionDetailsPage/ContactSupportButton.js.map +1 -1
  239. package/dist/esm/pages/TransactionDetailsPage/ReceiptsCard.js.map +1 -1
  240. package/dist/esm/pages/TransactionDetailsPage/TransactionDetailsPage.js +2 -1
  241. package/dist/esm/pages/TransactionDetailsPage/TransactionDetailsPage.js.map +1 -1
  242. package/dist/esm/pages/TransactionDetailsPage/TransactionDetailsSkeleton.js.map +1 -1
  243. package/dist/esm/pages/TransactionDetailsPage/TransferIdCard.js.map +1 -1
  244. package/dist/esm/pages/TransactionPage/ConfirmToAddressSheet.js.map +1 -1
  245. package/dist/esm/pages/TransactionPage/ExchangeRateBottomSheet.js.map +1 -1
  246. package/dist/esm/pages/TransactionPage/ExecutionDoneCard.js.map +1 -1
  247. package/dist/esm/pages/TransactionPage/StartTransactionButton.js +4 -3
  248. package/dist/esm/pages/TransactionPage/StartTransactionButton.js.map +1 -1
  249. package/dist/esm/pages/TransactionPage/TokenValueBottomSheet.js.map +1 -1
  250. package/dist/esm/pages/TransactionPage/TokenVerificationBottomSheet.js +64 -0
  251. package/dist/esm/pages/TransactionPage/TokenVerificationBottomSheet.js.map +1 -0
  252. package/dist/esm/pages/TransactionPage/TransactionDoneButtons.js.map +1 -1
  253. package/dist/esm/pages/TransactionPage/TransactionExecutionContent.js +19 -16
  254. package/dist/esm/pages/TransactionPage/TransactionExecutionContent.js.map +1 -1
  255. package/dist/esm/pages/TransactionPage/TransactionFailedButtons.js +3 -1
  256. package/dist/esm/pages/TransactionPage/TransactionFailedButtons.js.map +1 -1
  257. package/dist/esm/pages/TransactionPage/TransactionPage.js.map +1 -1
  258. package/dist/esm/pages/TransactionPage/TransactionReview.js +24 -2
  259. package/dist/esm/pages/TransactionPage/TransactionReview.js.map +1 -1
  260. package/dist/esm/providers/I18nProvider/I18nProvider.js +37 -36
  261. package/dist/esm/providers/I18nProvider/I18nProvider.js.map +1 -1
  262. package/dist/esm/providers/I18nProvider/types.d.ts.map +1 -1
  263. package/dist/esm/providers/ThemeProvider/ThemeProvider.js +2 -1
  264. package/dist/esm/providers/ThemeProvider/ThemeProvider.js.map +1 -1
  265. package/dist/esm/providers/WalletProvider/WalletProvider.js +10 -9
  266. package/dist/esm/providers/WalletProvider/WalletProvider.js.map +1 -1
  267. package/dist/esm/providers/WalletProvider/useExternalWalletProvider.js +7 -3
  268. package/dist/esm/providers/WalletProvider/useExternalWalletProvider.js.map +1 -1
  269. package/dist/esm/stores/StoreProvider.js.map +1 -1
  270. package/dist/esm/stores/form/FormStore.js.map +1 -1
  271. package/dist/esm/stores/form/FormUpdater.js.map +1 -1
  272. package/dist/esm/stores/navigationTabs/useNavigationTabsStore.js.map +1 -1
  273. package/dist/esm/stores/routes/useRouteExecutionIndicator.js +4 -3
  274. package/dist/esm/stores/routes/useRouteExecutionIndicator.js.map +1 -1
  275. package/dist/esm/types/token.d.ts +4 -1
  276. package/dist/esm/types/token.d.ts.map +1 -1
  277. package/dist/esm/utils/compactNumberFormatter.js +1 -3
  278. package/dist/esm/utils/compactNumberFormatter.js.map +1 -1
  279. package/dist/esm/utils/customReceiver.js +7 -0
  280. package/dist/esm/utils/customReceiver.js.map +1 -0
  281. package/dist/esm/utils/gas.js +24 -0
  282. package/dist/esm/utils/gas.js.map +1 -0
  283. package/dist/esm/utils/getErrorMessage.js +0 -1
  284. package/dist/esm/utils/getErrorMessage.js.map +1 -1
  285. package/dist/esm/utils/limitOrder.js +1 -1
  286. package/dist/esm/utils/limitOrder.js.map +1 -1
  287. package/dist/esm/utils/token.js +21 -4
  288. package/dist/esm/utils/token.js.map +1 -1
  289. package/dist/esm/utils/tokenList.js +37 -23
  290. package/dist/esm/utils/tokenList.js.map +1 -1
  291. package/package.json +15 -15
  292. package/src/components/AmountInput/AmountInputEndAdornment.tsx +2 -21
  293. package/src/components/AmountInputCard/PercentageChips.tsx +2 -18
  294. package/src/components/Chains/AllChainsAvatar.tsx +7 -1
  295. package/src/components/Messages/UnsupportedToAddressMessage.tsx +24 -0
  296. package/src/components/Messages/WarningMessages.tsx +3 -0
  297. package/src/components/Messages/useMessageQueue.ts +9 -0
  298. package/src/components/Routes/LimitOrderRoutes.tsx +5 -2
  299. package/src/components/Routes/RoutesContent.tsx +5 -2
  300. package/src/components/SendToWallet/SendToWalletExpandButton.tsx +2 -1
  301. package/src/components/TokenList/TokenListItem.tsx +68 -9
  302. package/src/components/TokenList/VirtualizedTokenList.tsx +33 -9
  303. package/src/components/TokenList/types.ts +4 -0
  304. package/src/config/version.ts +1 -1
  305. package/src/hooks/useAccountsBalancesData.ts +4 -31
  306. package/src/hooks/useAvailableChains.ts +1 -0
  307. package/src/hooks/useExplorer.ts +2 -0
  308. package/src/hooks/useFlaggedTokenGuard.ts +33 -0
  309. package/src/hooks/useGasSufficiency.ts +9 -1
  310. package/src/hooks/useMaxSendAmount.ts +21 -0
  311. package/src/hooks/useRoutes.ts +7 -0
  312. package/src/hooks/useToAddressRequirements.ts +17 -1
  313. package/src/hooks/useTokenBalances.ts +18 -2
  314. package/src/hooks/useTokenBalancesQueries.ts +12 -4
  315. package/src/hooks/useTokenSearch.ts +1 -5
  316. package/src/hooks/useTokens.ts +28 -13
  317. package/src/pages/MainPage/ReviewButton.tsx +6 -2
  318. package/src/pages/RoutesPage/RoutesPage.tsx +5 -2
  319. package/src/pages/TransactionPage/TokenVerificationBottomSheet.tsx +93 -0
  320. package/src/pages/TransactionPage/TransactionReview.tsx +28 -1
  321. package/src/providers/WalletProvider/useExternalWalletProvider.ts +9 -1
  322. package/src/types/token.ts +6 -3
  323. package/src/utils/customReceiver.ts +7 -0
  324. package/src/utils/gas.ts +41 -0
  325. package/src/utils/token.ts +53 -9
  326. package/src/utils/tokenList.ts +27 -7
  327. package/dist/esm/hooks/useFilteredByTokenBalances.js +0 -74
  328. package/dist/esm/hooks/useFilteredByTokenBalances.js.map +0 -1
  329. package/src/hooks/useFilteredByTokenBalances.ts +0 -145
@@ -1 +1 @@
1
- {"version":3,"file":"BridgeAndExchangeSettings.js","names":["SwapHoriz"],"sources":["../../../../src/pages/SettingsPage/BridgeAndExchangeSettings.tsx"],"sourcesContent":["import AirlineStops from '@mui/icons-material/AirlineStops'\nimport SwapHoriz from '@mui/icons-material/SwapHoriz'\nimport { useNavigate } from '@tanstack/react-router'\nimport { useTranslation } from 'react-i18next'\nimport { CardButton } from '../../components/Card/CardButton.js'\nimport { useSettingMonitor } from '../../hooks/useSettingMonitor.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { useSettingsStore } from '../../stores/settings/SettingsStore.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { BadgedValue } from './SettingsCard/BadgedValue.js'\n\nconst supportedIcons = {\n Bridges: AirlineStops,\n Exchanges: SwapHoriz,\n}\n\nexport const BridgeAndExchangeSettings: React.FC<{\n type: 'Bridges' | 'Exchanges'\n}> = ({ type }) => {\n const { isBridgesChanged, isExchangesChanged } = useSettingMonitor()\n const { t } = useTranslation()\n const navigate = useNavigate()\n const [enabledTools, tools] = useSettingsStore((state) => {\n const enabledTools = Object.values(state[`_enabled${type}`])\n return [enabledTools.filter(Boolean).length, enabledTools.length]\n })\n\n const { hiddenUI } = useWidgetConfig()\n\n if (type === 'Bridges' && hiddenUI?.bridgesSettings) {\n return null\n }\n\n const customisationLookUp = {\n Bridges: isBridgesChanged,\n Exchanges: isExchangesChanged,\n }\n\n const handleClick = () => {\n navigate({\n to: navigationRoutes[type.toLowerCase() as 'bridges' | 'exchanges'],\n })\n }\n\n const Icon = supportedIcons[type]\n\n return (\n <CardButton\n onClick={handleClick}\n icon={<Icon />}\n title={t(`settings.enabled${type}`)}\n >\n <BadgedValue\n badgeColor=\"info\"\n showBadge={customisationLookUp[type]}\n >{`${enabledTools}/${tools}`}</BadgedValue>\n </CardButton>\n )\n}\n"],"mappings":";;;;;;;;;;;;AAWA,MAAM,iBAAiB;CACrB,SAAS;CACT,WAAWA;AACb;AAEA,MAAa,6BAEP,EAAE,WAAW;CACjB,MAAM,EAAE,kBAAkB,uBAAuB,kBAAkB;CACnE,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,WAAW,YAAY;CAC7B,MAAM,CAAC,cAAc,SAAS,kBAAkB,UAAU;EACxD,MAAM,eAAe,OAAO,OAAO,MAAM,WAAW,OAAO;EAC3D,OAAO,CAAC,aAAa,OAAO,OAAO,CAAC,CAAC,QAAQ,aAAa,MAAM;CAClE,CAAC;CAED,MAAM,EAAE,aAAa,gBAAgB;CAErC,IAAI,SAAS,aAAa,UAAU,iBAClC,OAAO;CAGT,MAAM,sBAAsB;EAC1B,SAAS;EACT,WAAW;CACb;CAEA,MAAM,oBAAoB;EACxB,SAAS,EACP,IAAI,iBAAiB,KAAK,YAAY,GACxC,CAAC;CACH;CAEA,MAAM,OAAO,eAAe;CAE5B,OACE,oBAAC,YAAD;EACE,SAAS;EACT,MAAM,oBAAC,MAAD,CAAO,CAAA;EACb,OAAO,EAAE,mBAAmB,MAAM;YAElC,oBAAC,aAAD;GACE,YAAW;GACX,WAAW,oBAAoB;aAC/B,GAAG,aAAa,GAAG;EAAqB,CAAA;CAChC,CAAA;AAEhB"}
1
+ {"version":3,"file":"BridgeAndExchangeSettings.js","names":["SwapHoriz"],"sources":["../../../../src/pages/SettingsPage/BridgeAndExchangeSettings.tsx"],"sourcesContent":["import AirlineStops from '@mui/icons-material/AirlineStops'\nimport SwapHoriz from '@mui/icons-material/SwapHoriz'\nimport { useNavigate } from '@tanstack/react-router'\nimport { useTranslation } from 'react-i18next'\nimport { CardButton } from '../../components/Card/CardButton.js'\nimport { useSettingMonitor } from '../../hooks/useSettingMonitor.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { useSettingsStore } from '../../stores/settings/SettingsStore.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { BadgedValue } from './SettingsCard/BadgedValue.js'\n\nconst supportedIcons = {\n Bridges: AirlineStops,\n Exchanges: SwapHoriz,\n}\n\nexport const BridgeAndExchangeSettings: React.FC<{\n type: 'Bridges' | 'Exchanges'\n}> = ({ type }) => {\n const { isBridgesChanged, isExchangesChanged } = useSettingMonitor()\n const { t } = useTranslation()\n const navigate = useNavigate()\n const [enabledTools, tools] = useSettingsStore((state) => {\n const enabledTools = Object.values(state[`_enabled${type}`])\n return [enabledTools.filter(Boolean).length, enabledTools.length]\n })\n\n const { hiddenUI } = useWidgetConfig()\n\n if (type === 'Bridges' && hiddenUI?.bridgesSettings) {\n return null\n }\n\n const customisationLookUp = {\n Bridges: isBridgesChanged,\n Exchanges: isExchangesChanged,\n }\n\n const handleClick = () => {\n navigate({\n to: navigationRoutes[type.toLowerCase() as 'bridges' | 'exchanges'],\n })\n }\n\n const Icon = supportedIcons[type]\n\n return (\n <CardButton\n onClick={handleClick}\n icon={<Icon />}\n title={t(`settings.enabled${type}`)}\n >\n <BadgedValue\n badgeColor=\"info\"\n showBadge={customisationLookUp[type]}\n >{`${enabledTools}/${tools}`}</BadgedValue>\n </CardButton>\n )\n}\n"],"mappings":";;;;;;;;;;;;AAWA,MAAM,iBAAiB;CACrB,SAAS;CACT,WAAWA;AACb;AAEA,MAAa,6BAEP,EAAE,WAAW;CACjB,MAAM,EAAE,kBAAkB,uBAAuB,kBAAkB;CACnE,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,WAAW,YAAY;CAC7B,MAAM,CAAC,cAAc,SAAS,kBAAkB,UAAU;EACxD,MAAM,eAAe,OAAO,OAAO,MAAM,WAAW,OAAO;EAC3D,OAAO,CAAC,aAAa,OAAO,OAAO,CAAC,CAAC,QAAQ,aAAa,MAAM;CAClE,CAAC;CAED,MAAM,EAAE,aAAa,gBAAgB;CAErC,IAAI,SAAS,aAAa,UAAU,iBAClC,OAAO;CAGT,MAAM,sBAAsB;EAC1B,SAAS;EACT,WAAW;CACb;CAEA,MAAM,oBAAoB;EACxB,SAAS,EACP,IAAI,iBAAiB,KAAK,YAAY,GACxC,CAAC;CACH;CAEA,MAAM,OAAO,eAAe;CAE5B,OACE,oBAAC,YAAD;EACE,SAAS;EACT,MAAM,oBAAC,MAAD,CAAO,CAAA;EACb,OAAO,EAAE,mBAAmB,MAAM;EAElC,UAAA,oBAAC,aAAD;GACE,YAAW;GACX,WAAW,oBAAoB;GAC/B,UAAA,GAAG,aAAa,GAAG;EAAqB,CAAA;CAChC,CAAA;AAEhB"}
@@ -1 +1 @@
1
- {"version":3,"file":"GasPriceSettings.js","names":[],"sources":["../../../../src/pages/SettingsPage/GasPriceSettings.tsx"],"sourcesContent":["import EvStation from '@mui/icons-material/EvStation'\nimport { useTranslation } from 'react-i18next'\nimport { CardTabs, Tab } from '../../components/Tabs/Tabs.style.js'\nimport { useSettingMonitor } from '../../hooks/useSettingMonitor.js'\nimport { useSettings } from '../../stores/settings/useSettings.js'\nimport { useSettingsActions } from '../../stores/settings/useSettingsActions.js'\nimport { BadgedValue } from './SettingsCard/BadgedValue.js'\nimport { SettingCardExpandable } from './SettingsCard/SettingCardExpandable.js'\n\nexport const GasPriceSettings: React.FC = () => {\n const { t } = useTranslation()\n const { setValue } = useSettingsActions()\n const { isGasPriceChanged } = useSettingMonitor()\n const { gasPrice } = useSettings(['gasPrice'])\n\n const handleGasPriceChange = (_: React.SyntheticEvent, gasPrice: string) => {\n setValue('gasPrice', gasPrice)\n }\n\n return (\n <SettingCardExpandable\n value={\n <BadgedValue badgeColor=\"info\" showBadge={isGasPriceChanged}>\n {t(`settings.gasPrice.${gasPrice}` as any)}\n </BadgedValue>\n }\n icon={<EvStation />}\n title={t('settings.gasPrice.title')}\n >\n <CardTabs\n value={gasPrice}\n aria-label=\"tabs\"\n indicatorColor=\"primary\"\n onChange={handleGasPriceChange}\n sx={{ mt: 1.5 }}\n >\n <Tab label={t('settings.gasPrice.slow')} value=\"slow\" disableRipple />\n <Tab\n label={t('settings.gasPrice.normal')}\n value=\"normal\"\n disableRipple\n />\n <Tab label={t('settings.gasPrice.fast')} value=\"fast\" disableRipple />\n </CardTabs>\n </SettingCardExpandable>\n )\n}\n"],"mappings":";;;;;;;;;;AASA,MAAa,yBAAmC;CAC9C,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,EAAE,aAAa,mBAAmB;CACxC,MAAM,EAAE,sBAAsB,kBAAkB;CAChD,MAAM,EAAE,aAAa,YAAY,CAAC,UAAU,CAAC;CAE7C,MAAM,wBAAwB,GAAyB,aAAqB;EAC1E,SAAS,YAAY,QAAQ;CAC/B;CAEA,OACE,oBAAC,uBAAD;EACE,OACE,oBAAC,aAAD;GAAa,YAAW;GAAO,WAAW;aACvC,EAAE,qBAAqB,UAAiB;EAC9B,CAAA;EAEf,MAAM,oBAAC,WAAD,CAAY,CAAA;EAClB,OAAO,EAAE,yBAAyB;YAElC,qBAAC,UAAD;GACE,OAAO;GACP,cAAW;GACX,gBAAe;GACf,UAAU;GACV,IAAI,EAAE,IAAI,IAAI;aALhB;IAOE,oBAAC,KAAD;KAAK,OAAO,EAAE,wBAAwB;KAAG,OAAM;KAAO,eAAA;IAAe,CAAA;IACrE,oBAAC,KAAD;KACE,OAAO,EAAE,0BAA0B;KACnC,OAAM;KACN,eAAA;IACD,CAAA;IACD,oBAAC,KAAD;KAAK,OAAO,EAAE,wBAAwB;KAAG,OAAM;KAAO,eAAA;IAAe,CAAA;GAC7D;;CACW,CAAA;AAE3B"}
1
+ {"version":3,"file":"GasPriceSettings.js","names":[],"sources":["../../../../src/pages/SettingsPage/GasPriceSettings.tsx"],"sourcesContent":["import EvStation from '@mui/icons-material/EvStation'\nimport { useTranslation } from 'react-i18next'\nimport { CardTabs, Tab } from '../../components/Tabs/Tabs.style.js'\nimport { useSettingMonitor } from '../../hooks/useSettingMonitor.js'\nimport { useSettings } from '../../stores/settings/useSettings.js'\nimport { useSettingsActions } from '../../stores/settings/useSettingsActions.js'\nimport { BadgedValue } from './SettingsCard/BadgedValue.js'\nimport { SettingCardExpandable } from './SettingsCard/SettingCardExpandable.js'\n\nexport const GasPriceSettings: React.FC = () => {\n const { t } = useTranslation()\n const { setValue } = useSettingsActions()\n const { isGasPriceChanged } = useSettingMonitor()\n const { gasPrice } = useSettings(['gasPrice'])\n\n const handleGasPriceChange = (_: React.SyntheticEvent, gasPrice: string) => {\n setValue('gasPrice', gasPrice)\n }\n\n return (\n <SettingCardExpandable\n value={\n <BadgedValue badgeColor=\"info\" showBadge={isGasPriceChanged}>\n {t(`settings.gasPrice.${gasPrice}` as any)}\n </BadgedValue>\n }\n icon={<EvStation />}\n title={t('settings.gasPrice.title')}\n >\n <CardTabs\n value={gasPrice}\n aria-label=\"tabs\"\n indicatorColor=\"primary\"\n onChange={handleGasPriceChange}\n sx={{ mt: 1.5 }}\n >\n <Tab label={t('settings.gasPrice.slow')} value=\"slow\" disableRipple />\n <Tab\n label={t('settings.gasPrice.normal')}\n value=\"normal\"\n disableRipple\n />\n <Tab label={t('settings.gasPrice.fast')} value=\"fast\" disableRipple />\n </CardTabs>\n </SettingCardExpandable>\n )\n}\n"],"mappings":";;;;;;;;;;AASA,MAAa,yBAAmC;CAC9C,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,EAAE,aAAa,mBAAmB;CACxC,MAAM,EAAE,sBAAsB,kBAAkB;CAChD,MAAM,EAAE,aAAa,YAAY,CAAC,UAAU,CAAC;CAE7C,MAAM,wBAAwB,GAAyB,aAAqB;EAC1E,SAAS,YAAY,QAAQ;CAC/B;CAEA,OACE,oBAAC,uBAAD;EACE,OACE,oBAAC,aAAD;GAAa,YAAW;GAAO,WAAW;GACvC,UAAA,EAAE,qBAAqB,UAAiB;EAC9B,CAAA;EAEf,MAAM,oBAAC,WAAD,CAAY,CAAA;EAClB,OAAO,EAAE,yBAAyB;EAElC,UAAA,qBAAC,UAAD;GACE,OAAO;GACP,cAAW;GACX,gBAAe;GACf,UAAU;GACV,IAAI,EAAE,IAAI,IAAI;GALhB,UAAA;IAOE,oBAAC,KAAD;KAAK,OAAO,EAAE,wBAAwB;KAAG,OAAM;KAAO,eAAA;IAAe,CAAA;IACrE,oBAAC,KAAD;KACE,OAAO,EAAE,0BAA0B;KACnC,OAAM;KACN,eAAA;IACD,CAAA;IACD,oBAAC,KAAD;KAAK,OAAO,EAAE,wBAAwB;KAAG,OAAM;KAAO,eAAA;IAAe,CAAA;GAC7D;;CACW,CAAA;AAE3B"}
@@ -1 +1 @@
1
- {"version":3,"file":"LanguageSetting.js","names":[],"sources":["../../../../src/pages/SettingsPage/LanguageSetting.tsx"],"sourcesContent":["import Language from '@mui/icons-material/Language'\nimport { useNavigate } from '@tanstack/react-router'\nimport { useTranslation } from 'react-i18next'\nimport { CardButton } from '../../components/Card/CardButton.js'\nimport { CardValue } from '../../components/Card/CardButton.style.js'\nimport { useLanguages } from '../../hooks/useLanguages.js'\nimport { languageNames } from '../../providers/I18nProvider/constants.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\n\nexport const LanguageSetting: React.FC = () => {\n const { t } = useTranslation()\n const navigate = useNavigate()\n const { hiddenUI } = useWidgetConfig()\n const { selectedLanguageCode } = useLanguages()\n\n if (hiddenUI?.language) {\n return null\n }\n\n const handleClick = () => {\n navigate({ to: navigationRoutes.languages })\n }\n\n return (\n <CardButton\n onClick={handleClick}\n icon={<Language />}\n title={t('language.title')}\n >\n <CardValue>\n {languageNames[selectedLanguageCode as keyof typeof languageNames] ||\n t('language.name', {\n lng: selectedLanguageCode,\n }) ||\n selectedLanguageCode}\n </CardValue>\n </CardButton>\n )\n}\n"],"mappings":";;;;;;;;;;;AAUA,MAAa,wBAAkC;CAC7C,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,WAAW,YAAY;CAC7B,MAAM,EAAE,aAAa,gBAAgB;CACrC,MAAM,EAAE,yBAAyB,aAAa;CAE9C,IAAI,UAAU,UACZ,OAAO;CAGT,MAAM,oBAAoB;EACxB,SAAS,EAAE,IAAI,iBAAiB,UAAU,CAAC;CAC7C;CAEA,OACE,oBAAC,YAAD;EACE,SAAS;EACT,MAAM,oBAAC,UAAD,CAAW,CAAA;EACjB,OAAO,EAAE,gBAAgB;YAEzB,oBAAC,WAAD,EAAA,UACG,cAAc,yBACb,EAAE,iBAAiB,EACjB,KAAK,qBACP,CAAC,KACD,qBACO,CAAA;CACD,CAAA;AAEhB"}
1
+ {"version":3,"file":"LanguageSetting.js","names":[],"sources":["../../../../src/pages/SettingsPage/LanguageSetting.tsx"],"sourcesContent":["import Language from '@mui/icons-material/Language'\nimport { useNavigate } from '@tanstack/react-router'\nimport { useTranslation } from 'react-i18next'\nimport { CardButton } from '../../components/Card/CardButton.js'\nimport { CardValue } from '../../components/Card/CardButton.style.js'\nimport { useLanguages } from '../../hooks/useLanguages.js'\nimport { languageNames } from '../../providers/I18nProvider/constants.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\n\nexport const LanguageSetting: React.FC = () => {\n const { t } = useTranslation()\n const navigate = useNavigate()\n const { hiddenUI } = useWidgetConfig()\n const { selectedLanguageCode } = useLanguages()\n\n if (hiddenUI?.language) {\n return null\n }\n\n const handleClick = () => {\n navigate({ to: navigationRoutes.languages })\n }\n\n return (\n <CardButton\n onClick={handleClick}\n icon={<Language />}\n title={t('language.title')}\n >\n <CardValue>\n {languageNames[selectedLanguageCode as keyof typeof languageNames] ||\n t('language.name', {\n lng: selectedLanguageCode,\n }) ||\n selectedLanguageCode}\n </CardValue>\n </CardButton>\n )\n}\n"],"mappings":";;;;;;;;;;;AAUA,MAAa,wBAAkC;CAC7C,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,WAAW,YAAY;CAC7B,MAAM,EAAE,aAAa,gBAAgB;CACrC,MAAM,EAAE,yBAAyB,aAAa;CAE9C,IAAI,UAAU,UACZ,OAAO;CAGT,MAAM,oBAAoB;EACxB,SAAS,EAAE,IAAI,iBAAiB,UAAU,CAAC;CAC7C;CAEA,OACE,oBAAC,YAAD;EACE,SAAS;EACT,MAAM,oBAAC,UAAD,CAAW,CAAA;EACjB,OAAO,EAAE,gBAAgB;EAEzB,UAAA,oBAAC,WAAD,EAAA,UACG,cAAc,yBACb,EAAE,iBAAiB,EACjB,KAAK,qBACP,CAAC,KACD,qBACO,CAAA;CACD,CAAA;AAEhB"}
@@ -1 +1 @@
1
- {"version":3,"file":"ResetSettingsButton.js","names":["Dialog","DialogTitle","DialogContent","DialogContentText","DialogActions"],"sources":["../../../../src/pages/SettingsPage/ResetSettingsButton.tsx"],"sourcesContent":["import InfoRounded from '@mui/icons-material/InfoRounded'\nimport { Box, Button } from '@mui/material'\nimport { useCallback, useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { Dialog } from '../../components/Dialog/Dialog.js'\nimport {\n DialogActions,\n DialogContainer,\n DialogContent,\n DialogContentText,\n DialogTitle,\n} from '../../components/Dialog/Dialog.style.js'\nimport { useSettingMonitor } from '../../hooks/useSettingMonitor.js'\nimport { ResetButtonContainer } from './ResetSettingsButton.style.js'\n\nexport const ResetSettingsButton: React.FC = () => {\n const { t } = useTranslation()\n const { isCustomRouteSettings, reset } = useSettingMonitor()\n const [open, setOpen] = useState(false)\n\n const toggleDialog = useCallback(() => {\n setOpen((open) => !open)\n }, [])\n\n const handleReset = () => {\n reset()\n toggleDialog()\n }\n\n if (!isCustomRouteSettings) {\n return null\n }\n\n return (\n <Box\n sx={{\n mt: 2,\n }}\n >\n <ResetButtonContainer>\n <Box\n sx={{\n display: 'flex',\n marginBottom: '12px',\n }}\n >\n <InfoRounded\n sx={{\n marginRight: '8px',\n }}\n />\n <Box\n sx={{\n fontSize: 14,\n }}\n >\n {t('settings.resetSettings')}\n </Box>\n </Box>\n <Button onClick={toggleDialog} fullWidth>\n {t('button.resetSettings')}\n </Button>\n\n <Dialog open={open} onClose={toggleDialog}>\n <DialogContainer>\n <DialogTitle>{t('warning.title.resetSettings')}</DialogTitle>\n <DialogContent>\n <DialogContentText>\n {t('warning.message.resetSettings')}\n </DialogContentText>\n </DialogContent>\n <DialogActions>\n <Button onClick={toggleDialog}>{t('button.cancel')}</Button>\n <Button variant=\"contained\" onClick={handleReset} autoFocus>\n {t('button.reset')}\n </Button>\n </DialogActions>\n </DialogContainer>\n </Dialog>\n </ResetButtonContainer>\n </Box>\n )\n}\n"],"mappings":";;;;;;;;;;AAeA,MAAa,4BAAsC;CACjD,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,EAAE,uBAAuB,UAAU,kBAAkB;CAC3D,MAAM,CAAC,MAAM,WAAW,SAAS,KAAK;CAEtC,MAAM,eAAe,kBAAkB;EACrC,SAAS,SAAS,CAAC,IAAI;CACzB,GAAG,CAAC,CAAC;CAEL,MAAM,oBAAoB;EACxB,MAAM;EACN,aAAa;CACf;CAEA,IAAI,CAAC,uBACH,OAAO;CAGT,OACE,oBAAC,KAAD;EACE,IAAI,EACF,IAAI,EACN;YAEA,qBAAC,sBAAD,EAAA,UAAA;GACE,qBAAC,KAAD;IACE,IAAI;KACF,SAAS;KACT,cAAc;IAChB;cAJF,CAME,oBAAC,aAAD,EACE,IAAI,EACF,aAAa,MACf,EACD,CAAA,GACD,oBAAC,KAAD;KACE,IAAI,EACF,UAAU,GACZ;eAEC,EAAE,wBAAwB;IACxB,CAAA,CACF;;GACL,oBAAC,QAAD;IAAQ,SAAS;IAAc,WAAA;cAC5B,EAAE,sBAAsB;GACnB,CAAA;GAER,oBAACA,UAAD;IAAc;IAAM,SAAS;cAC3B,qBAAC,iBAAD,EAAA,UAAA;KACE,oBAACC,eAAD,EAAA,UAAc,EAAE,6BAA6B,EAAe,CAAA;KAC5D,oBAACC,iBAAD,EAAA,UACE,oBAACC,qBAAD,EAAA,UACG,EAAE,+BAA+B,EACjB,CAAA,EACN,CAAA;KACf,qBAACC,iBAAD,EAAA,UAAA,CACE,oBAAC,QAAD;MAAQ,SAAS;gBAAe,EAAE,eAAe;KAAU,CAAA,GAC3D,oBAAC,QAAD;MAAQ,SAAQ;MAAY,SAAS;MAAa,WAAA;gBAC/C,EAAE,cAAc;KACX,CAAA,CACK,EAAA,CAAA;IACA,EAAA,CAAA;GACX,CAAA;EACY,EAAA,CAAA;CACnB,CAAA;AAET"}
1
+ {"version":3,"file":"ResetSettingsButton.js","names":["Dialog","DialogTitle","DialogContent","DialogContentText","DialogActions"],"sources":["../../../../src/pages/SettingsPage/ResetSettingsButton.tsx"],"sourcesContent":["import InfoRounded from '@mui/icons-material/InfoRounded'\nimport { Box, Button } from '@mui/material'\nimport { useCallback, useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { Dialog } from '../../components/Dialog/Dialog.js'\nimport {\n DialogActions,\n DialogContainer,\n DialogContent,\n DialogContentText,\n DialogTitle,\n} from '../../components/Dialog/Dialog.style.js'\nimport { useSettingMonitor } from '../../hooks/useSettingMonitor.js'\nimport { ResetButtonContainer } from './ResetSettingsButton.style.js'\n\nexport const ResetSettingsButton: React.FC = () => {\n const { t } = useTranslation()\n const { isCustomRouteSettings, reset } = useSettingMonitor()\n const [open, setOpen] = useState(false)\n\n const toggleDialog = useCallback(() => {\n setOpen((open) => !open)\n }, [])\n\n const handleReset = () => {\n reset()\n toggleDialog()\n }\n\n if (!isCustomRouteSettings) {\n return null\n }\n\n return (\n <Box\n sx={{\n mt: 2,\n }}\n >\n <ResetButtonContainer>\n <Box\n sx={{\n display: 'flex',\n marginBottom: '12px',\n }}\n >\n <InfoRounded\n sx={{\n marginRight: '8px',\n }}\n />\n <Box\n sx={{\n fontSize: 14,\n }}\n >\n {t('settings.resetSettings')}\n </Box>\n </Box>\n <Button onClick={toggleDialog} fullWidth>\n {t('button.resetSettings')}\n </Button>\n\n <Dialog open={open} onClose={toggleDialog}>\n <DialogContainer>\n <DialogTitle>{t('warning.title.resetSettings')}</DialogTitle>\n <DialogContent>\n <DialogContentText>\n {t('warning.message.resetSettings')}\n </DialogContentText>\n </DialogContent>\n <DialogActions>\n <Button onClick={toggleDialog}>{t('button.cancel')}</Button>\n <Button variant=\"contained\" onClick={handleReset} autoFocus>\n {t('button.reset')}\n </Button>\n </DialogActions>\n </DialogContainer>\n </Dialog>\n </ResetButtonContainer>\n </Box>\n )\n}\n"],"mappings":";;;;;;;;;;AAeA,MAAa,4BAAsC;CACjD,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,EAAE,uBAAuB,UAAU,kBAAkB;CAC3D,MAAM,CAAC,MAAM,WAAW,SAAS,KAAK;CAEtC,MAAM,eAAe,kBAAkB;EACrC,SAAS,SAAS,CAAC,IAAI;CACzB,GAAG,CAAC,CAAC;CAEL,MAAM,oBAAoB;EACxB,MAAM;EACN,aAAa;CACf;CAEA,IAAI,CAAC,uBACH,OAAO;CAGT,OACE,oBAAC,KAAD;EACE,IAAI,EACF,IAAI,EACN;EAEA,UAAA,qBAAC,sBAAD,EAAA,UAAA;GACE,qBAAC,KAAD;IACE,IAAI;KACF,SAAS;KACT,cAAc;IAChB;IAJF,UAAA,CAME,oBAAC,aAAD,EACE,IAAI,EACF,aAAa,MACf,EACD,CAAA,GACD,oBAAC,KAAD;KACE,IAAI,EACF,UAAU,GACZ;KAEC,UAAA,EAAE,wBAAwB;IACxB,CAAA,CACF;;GACL,oBAAC,QAAD;IAAQ,SAAS;IAAc,WAAA;IAC5B,UAAA,EAAE,sBAAsB;GACnB,CAAA;GAER,oBAACA,UAAD;IAAc;IAAM,SAAS;IAC3B,UAAA,qBAAC,iBAAD,EAAA,UAAA;KACE,oBAACC,eAAD,EAAA,UAAc,EAAE,6BAA6B,EAAe,CAAA;KAC5D,oBAACC,iBAAD,EAAA,UACE,oBAACC,qBAAD,EAAA,UACG,EAAE,+BAA+B,EACjB,CAAA,EACN,CAAA;KACf,qBAACC,iBAAD,EAAA,UAAA,CACE,oBAAC,QAAD;MAAQ,SAAS;MAAe,UAAA,EAAE,eAAe;KAAU,CAAA,GAC3D,oBAAC,QAAD;MAAQ,SAAQ;MAAY,SAAS;MAAa,WAAA;MAC/C,UAAA,EAAE,cAAc;KACX,CAAA,CACK,EAAA,CAAA;IACA,EAAA,CAAA;GACX,CAAA;EACY,EAAA,CAAA;CACnB,CAAA;AAET"}
@@ -1 +1 @@
1
- {"version":3,"file":"RoutePrioritySettings.js","names":[],"sources":["../../../../src/pages/SettingsPage/RoutePrioritySettings.tsx"],"sourcesContent":["import Route from '@mui/icons-material/Route'\nimport { useNavigate } from '@tanstack/react-router'\nimport { useTranslation } from 'react-i18next'\nimport { CardButton } from '../../components/Card/CardButton.js'\nimport { useSettingMonitor } from '../../hooks/useSettingMonitor.js'\nimport { useSettings } from '../../stores/settings/useSettings.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { BadgedValue } from './SettingsCard/BadgedValue.js'\n\nexport const RoutePrioritySettings: React.FC = () => {\n const { t } = useTranslation()\n const navigate = useNavigate()\n const { isRoutePriorityChanged } = useSettingMonitor()\n const { routePriority } = useSettings(['routePriority'])\n\n const handleClick = () => {\n navigate({ to: navigationRoutes.routePriority })\n }\n\n return (\n <CardButton\n onClick={handleClick}\n icon={<Route />}\n title={t('settings.routePriority')}\n >\n <BadgedValue badgeColor=\"info\" showBadge={isRoutePriorityChanged}>\n {routePriority === 'FASTEST'\n ? t('settings.routePriorityOptions.fastest.title')\n : t('settings.routePriorityOptions.cheapest.title')}\n </BadgedValue>\n </CardButton>\n )\n}\n"],"mappings":";;;;;;;;;;AASA,MAAa,8BAAwC;CACnD,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,WAAW,YAAY;CAC7B,MAAM,EAAE,2BAA2B,kBAAkB;CACrD,MAAM,EAAE,kBAAkB,YAAY,CAAC,eAAe,CAAC;CAEvD,MAAM,oBAAoB;EACxB,SAAS,EAAE,IAAI,iBAAiB,cAAc,CAAC;CACjD;CAEA,OACE,oBAAC,YAAD;EACE,SAAS;EACT,MAAM,oBAAC,OAAD,CAAQ,CAAA;EACd,OAAO,EAAE,wBAAwB;YAEjC,oBAAC,aAAD;GAAa,YAAW;GAAO,WAAW;aACvC,kBAAkB,YACf,EAAE,6CAA6C,IAC/C,EAAE,8CAA8C;EACzC,CAAA;CACH,CAAA;AAEhB"}
1
+ {"version":3,"file":"RoutePrioritySettings.js","names":[],"sources":["../../../../src/pages/SettingsPage/RoutePrioritySettings.tsx"],"sourcesContent":["import Route from '@mui/icons-material/Route'\nimport { useNavigate } from '@tanstack/react-router'\nimport { useTranslation } from 'react-i18next'\nimport { CardButton } from '../../components/Card/CardButton.js'\nimport { useSettingMonitor } from '../../hooks/useSettingMonitor.js'\nimport { useSettings } from '../../stores/settings/useSettings.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { BadgedValue } from './SettingsCard/BadgedValue.js'\n\nexport const RoutePrioritySettings: React.FC = () => {\n const { t } = useTranslation()\n const navigate = useNavigate()\n const { isRoutePriorityChanged } = useSettingMonitor()\n const { routePriority } = useSettings(['routePriority'])\n\n const handleClick = () => {\n navigate({ to: navigationRoutes.routePriority })\n }\n\n return (\n <CardButton\n onClick={handleClick}\n icon={<Route />}\n title={t('settings.routePriority')}\n >\n <BadgedValue badgeColor=\"info\" showBadge={isRoutePriorityChanged}>\n {routePriority === 'FASTEST'\n ? t('settings.routePriorityOptions.fastest.title')\n : t('settings.routePriorityOptions.cheapest.title')}\n </BadgedValue>\n </CardButton>\n )\n}\n"],"mappings":";;;;;;;;;;AASA,MAAa,8BAAwC;CACnD,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,WAAW,YAAY;CAC7B,MAAM,EAAE,2BAA2B,kBAAkB;CACrD,MAAM,EAAE,kBAAkB,YAAY,CAAC,eAAe,CAAC;CAEvD,MAAM,oBAAoB;EACxB,SAAS,EAAE,IAAI,iBAAiB,cAAc,CAAC;CACjD;CAEA,OACE,oBAAC,YAAD;EACE,SAAS;EACT,MAAM,oBAAC,OAAD,CAAQ,CAAA;EACd,OAAO,EAAE,wBAAwB;EAEjC,UAAA,oBAAC,aAAD;GAAa,YAAW;GAAO,WAAW;GACvC,UAAA,kBAAkB,YACf,EAAE,6CAA6C,IAC/C,EAAE,8CAA8C;EACzC,CAAA;CACH,CAAA;AAEhB"}
@@ -1 +1 @@
1
- {"version":3,"file":"BadgedValue.js","names":[],"sources":["../../../../../src/pages/SettingsPage/SettingsCard/BadgedValue.tsx"],"sourcesContent":["import type { BadgeProps } from '@mui/material'\nimport type { PropsWithChildren } from 'react'\nimport { CardValue } from '../../../components/Card/CardButton.style.js'\nimport { Badge } from './SettingCard.style.js'\n\ninterface BadgedValueProps {\n showBadge: boolean\n badgeColor?: BadgeProps['color']\n}\n\nexport const BadgedValue: React.FC<PropsWithChildren<BadgedValueProps>> = ({\n showBadge,\n badgeColor,\n children,\n}) =>\n showBadge && badgeColor ? (\n <Badge variant=\"dot\" color={badgeColor}>\n <CardValue>{children}</CardValue>\n </Badge>\n ) : (\n <CardValue>{children}</CardValue>\n )\n"],"mappings":";;;;AAUA,MAAa,eAA8D,EACzE,WACA,YACA,eAEA,aAAa,aACX,oBAAC,OAAD;CAAO,SAAQ;CAAM,OAAO;WAC1B,oBAAC,WAAD,EAAY,SAAoB,CAAA;AAC3B,CAAA,IAEP,oBAAC,WAAD,EAAY,SAAoB,CAAA"}
1
+ {"version":3,"file":"BadgedValue.js","names":[],"sources":["../../../../../src/pages/SettingsPage/SettingsCard/BadgedValue.tsx"],"sourcesContent":["import type { BadgeProps } from '@mui/material'\nimport type { PropsWithChildren } from 'react'\nimport { CardValue } from '../../../components/Card/CardButton.style.js'\nimport { Badge } from './SettingCard.style.js'\n\ninterface BadgedValueProps {\n showBadge: boolean\n badgeColor?: BadgeProps['color']\n}\n\nexport const BadgedValue: React.FC<PropsWithChildren<BadgedValueProps>> = ({\n showBadge,\n badgeColor,\n children,\n}) =>\n showBadge && badgeColor ? (\n <Badge variant=\"dot\" color={badgeColor}>\n <CardValue>{children}</CardValue>\n </Badge>\n ) : (\n <CardValue>{children}</CardValue>\n )\n"],"mappings":";;;;AAUA,MAAa,eAA8D,EACzE,WACA,YACA,eAEA,aAAa,aACX,oBAAC,OAAD;CAAO,SAAQ;CAAM,OAAO;CAC1B,UAAA,oBAAC,WAAD,EAAY,SAAoB,CAAA;AAC3B,CAAA,IAEP,oBAAC,WAAD,EAAY,SAAoB,CAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"SettingCardExpandable.js","names":["Card"],"sources":["../../../../../src/pages/SettingsPage/SettingsCard/SettingCardExpandable.tsx"],"sourcesContent":["import { Collapse } from '@mui/material'\nimport type { JSX, PropsWithChildren, ReactNode, Ref } from 'react'\nimport { useId, useImperativeHandle, useRef } from 'react'\nimport { Card } from '../../../components/Card/Card.js'\nimport {\n CardRowButton,\n CardTitleContainer,\n CardValue,\n} from '../../../components/Card/CardButton.style.js'\nimport { useSettingsCardExpandable } from './SettingsAccordian.js'\nimport type { SettingCardTitle } from './types.js'\n\ninterface SettingCardExpandableProps extends SettingCardTitle {\n value: ReactNode\n disabled?: boolean\n keepValueVisible?: boolean\n onEntered?: () => void\n}\n\nexport interface SettingCardExpandableRef {\n element: HTMLButtonElement | null\n isExpanded: boolean\n toggleExpanded: (forceExpanded?: boolean) => void\n}\n\nexport const SettingCardExpandable = ({\n icon,\n title,\n value,\n children,\n disabled,\n keepValueVisible,\n onEntered,\n ref,\n}: PropsWithChildren<SettingCardExpandableProps> & {\n ref?: Ref<SettingCardExpandableRef>\n}): JSX.Element => {\n const { expanded, toggleExpanded } = useSettingsCardExpandable()\n const buttonId = useId()\n const collapseId = useId()\n const buttonRef = useRef<HTMLButtonElement>(null)\n\n useImperativeHandle(\n ref,\n () => ({\n element: buttonRef.current,\n isExpanded: expanded,\n toggleExpanded,\n }),\n [expanded, toggleExpanded]\n )\n\n return (\n <Card sx={{ p: 1 }}>\n <CardRowButton\n ref={buttonRef}\n id={buttonId}\n aria-expanded={expanded}\n aria-controls={collapseId}\n onClick={disabled ? undefined : () => toggleExpanded()}\n disableRipple\n sx={{ p: 1, cursor: disabled ? 'default' : 'pointer' }}\n >\n <CardTitleContainer>\n {icon}\n <CardValue>{title}</CardValue>\n </CardTitleContainer>\n {(!expanded || keepValueVisible) && value}\n </CardRowButton>\n <Collapse\n id={collapseId}\n role=\"region\"\n aria-labelledby={buttonId}\n in={expanded}\n mountOnEnter\n unmountOnExit\n onEntered={onEntered}\n >\n {children}\n </Collapse>\n </Card>\n )\n}\n"],"mappings":";;;;;;;AAyBA,MAAa,yBAAyB,EACpC,MACA,OACA,OACA,UACA,UACA,kBACA,WACA,UAGiB;CACjB,MAAM,EAAE,UAAU,mBAAmB,0BAA0B;CAC/D,MAAM,WAAW,MAAM;CACvB,MAAM,aAAa,MAAM;CACzB,MAAM,YAAY,OAA0B,IAAI;CAEhD,oBACE,YACO;EACL,SAAS,UAAU;EACnB,YAAY;EACZ;CACF,IACA,CAAC,UAAU,cAAc,CAC3B;CAEA,OACE,qBAACA,QAAD;EAAM,IAAI,EAAE,GAAG,EAAE;YAAjB,CACE,qBAAC,eAAD;GACE,KAAK;GACL,IAAI;GACJ,iBAAe;GACf,iBAAe;GACf,SAAS,WAAW,KAAA,UAAkB,eAAe;GACrD,eAAA;GACA,IAAI;IAAE,GAAG;IAAG,QAAQ,WAAW,YAAY;GAAU;aAPvD,CASE,qBAAC,oBAAD,EAAA,UAAA,CACG,MACD,oBAAC,WAAD,EAAA,UAAY,MAAiB,CAAA,CACX,EAAA,CAAA,IAClB,CAAC,YAAY,qBAAqB,KACvB;MACf,oBAAC,UAAD;GACE,IAAI;GACJ,MAAK;GACL,mBAAiB;GACjB,IAAI;GACJ,cAAA;GACA,eAAA;GACW;GAEV;EACO,CAAA,CACN;;AAEV"}
1
+ {"version":3,"file":"SettingCardExpandable.js","names":["Card"],"sources":["../../../../../src/pages/SettingsPage/SettingsCard/SettingCardExpandable.tsx"],"sourcesContent":["import { Collapse } from '@mui/material'\nimport type { JSX, PropsWithChildren, ReactNode, Ref } from 'react'\nimport { useId, useImperativeHandle, useRef } from 'react'\nimport { Card } from '../../../components/Card/Card.js'\nimport {\n CardRowButton,\n CardTitleContainer,\n CardValue,\n} from '../../../components/Card/CardButton.style.js'\nimport { useSettingsCardExpandable } from './SettingsAccordian.js'\nimport type { SettingCardTitle } from './types.js'\n\ninterface SettingCardExpandableProps extends SettingCardTitle {\n value: ReactNode\n disabled?: boolean\n keepValueVisible?: boolean\n onEntered?: () => void\n}\n\nexport interface SettingCardExpandableRef {\n element: HTMLButtonElement | null\n isExpanded: boolean\n toggleExpanded: (forceExpanded?: boolean) => void\n}\n\nexport const SettingCardExpandable = ({\n icon,\n title,\n value,\n children,\n disabled,\n keepValueVisible,\n onEntered,\n ref,\n}: PropsWithChildren<SettingCardExpandableProps> & {\n ref?: Ref<SettingCardExpandableRef>\n}): JSX.Element => {\n const { expanded, toggleExpanded } = useSettingsCardExpandable()\n const buttonId = useId()\n const collapseId = useId()\n const buttonRef = useRef<HTMLButtonElement>(null)\n\n useImperativeHandle(\n ref,\n () => ({\n element: buttonRef.current,\n isExpanded: expanded,\n toggleExpanded,\n }),\n [expanded, toggleExpanded]\n )\n\n return (\n <Card sx={{ p: 1 }}>\n <CardRowButton\n ref={buttonRef}\n id={buttonId}\n aria-expanded={expanded}\n aria-controls={collapseId}\n onClick={disabled ? undefined : () => toggleExpanded()}\n disableRipple\n sx={{ p: 1, cursor: disabled ? 'default' : 'pointer' }}\n >\n <CardTitleContainer>\n {icon}\n <CardValue>{title}</CardValue>\n </CardTitleContainer>\n {(!expanded || keepValueVisible) && value}\n </CardRowButton>\n <Collapse\n id={collapseId}\n role=\"region\"\n aria-labelledby={buttonId}\n in={expanded}\n mountOnEnter\n unmountOnExit\n onEntered={onEntered}\n >\n {children}\n </Collapse>\n </Card>\n )\n}\n"],"mappings":";;;;;;;AAyBA,MAAa,yBAAyB,EACpC,MACA,OACA,OACA,UACA,UACA,kBACA,WACA,UAGiB;CACjB,MAAM,EAAE,UAAU,mBAAmB,0BAA0B;CAC/D,MAAM,WAAW,MAAM;CACvB,MAAM,aAAa,MAAM;CACzB,MAAM,YAAY,OAA0B,IAAI;CAEhD,oBACE,YACO;EACL,SAAS,UAAU;EACnB,YAAY;EACZ;CACF,IACA,CAAC,UAAU,cAAc,CAC3B;CAEA,OACE,qBAACA,QAAD;EAAM,IAAI,EAAE,GAAG,EAAE;EAAjB,UAAA,CACE,qBAAC,eAAD;GACE,KAAK;GACL,IAAI;GACJ,iBAAe;GACf,iBAAe;GACf,SAAS,WAAW,KAAA,UAAkB,eAAe;GACrD,eAAA;GACA,IAAI;IAAE,GAAG;IAAG,QAAQ,WAAW,YAAY;GAAU;GAPvD,UAAA,CASE,qBAAC,oBAAD,EAAA,UAAA,CACG,MACD,oBAAC,WAAD,EAAA,UAAY,MAAiB,CAAA,CACX,EAAA,CAAA,IAClB,CAAC,YAAY,qBAAqB,KACvB;EACf,CAAA,GAAA,oBAAC,UAAD;GACE,IAAI;GACJ,MAAK;GACL,mBAAiB;GACjB,IAAI;GACJ,cAAA;GACA,eAAA;GACW;GAEV;EACO,CAAA,CACN;;AAEV"}
@@ -1 +1 @@
1
- {"version":3,"file":"SettingsPage.js","names":[],"sources":["../../../../src/pages/SettingsPage/SettingsPage.tsx"],"sourcesContent":["import type { JSX } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { PageContainer } from '../../components/PageContainer.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { BridgeAndExchangeSettings } from './BridgeAndExchangeSettings.js'\nimport { GasPriceSettings } from './GasPriceSettings.js'\nimport { LanguageSetting } from './LanguageSetting.js'\nimport { ResetSettingsButton } from './ResetSettingsButton.js'\nimport { RoutePrioritySettings } from './RoutePrioritySettings.js'\nimport { SettingsList } from './SettingsCard/SettingCard.style.js'\nimport { SettingsCardAccordion } from './SettingsCard/SettingsAccordian.js'\nimport { SlippageSettings } from './SlippageSettings/SlippageSettings.js'\nimport { SmallBalanceFilterSettings } from './SmallBalanceFilterSettings.js'\nimport { ThemeSettings } from './ThemeSettings.js'\n\nexport const SettingsPage = (): JSX.Element => {\n const { t } = useTranslation()\n const { hiddenUI } = useWidgetConfig()\n useHeader(t('header.settings'))\n\n return (\n <PageContainer topGutters bottomGutters>\n <SettingsList>\n <SettingsCardAccordion>\n <ThemeSettings />\n <LanguageSetting />\n <RoutePrioritySettings />\n <GasPriceSettings />\n <SlippageSettings />\n {!hiddenUI?.hideSmallBalances && <SmallBalanceFilterSettings />}\n <BridgeAndExchangeSettings type=\"Bridges\" />\n <BridgeAndExchangeSettings type=\"Exchanges\" />\n </SettingsCardAccordion>\n </SettingsList>\n <ResetSettingsButton />\n </PageContainer>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;AAgBA,MAAa,qBAAkC;CAC7C,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,EAAE,aAAa,gBAAgB;CACrC,UAAU,EAAE,iBAAiB,CAAC;CAE9B,OACE,qBAAC,eAAD;EAAe,YAAA;EAAW,eAAA;YAA1B,CACE,oBAAC,cAAD,EAAA,UACE,qBAAC,uBAAD,EAAA,UAAA;GACE,oBAAC,eAAD,CAAgB,CAAA;GAChB,oBAAC,iBAAD,CAAkB,CAAA;GAClB,oBAAC,uBAAD,CAAwB,CAAA;GACxB,oBAAC,kBAAD,CAAmB,CAAA;GACnB,oBAAC,kBAAD,CAAmB,CAAA;GAClB,CAAC,UAAU,qBAAqB,oBAAC,4BAAD,CAA6B,CAAA;GAC9D,oBAAC,2BAAD,EAA2B,MAAK,UAAW,CAAA;GAC3C,oBAAC,2BAAD,EAA2B,MAAK,YAAa,CAAA;EACxB,EAAA,CAAA,EACX,CAAA,GACd,oBAAC,qBAAD,CAAsB,CAAA,CACT;;AAEnB"}
1
+ {"version":3,"file":"SettingsPage.js","names":[],"sources":["../../../../src/pages/SettingsPage/SettingsPage.tsx"],"sourcesContent":["import type { JSX } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { PageContainer } from '../../components/PageContainer.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { BridgeAndExchangeSettings } from './BridgeAndExchangeSettings.js'\nimport { GasPriceSettings } from './GasPriceSettings.js'\nimport { LanguageSetting } from './LanguageSetting.js'\nimport { ResetSettingsButton } from './ResetSettingsButton.js'\nimport { RoutePrioritySettings } from './RoutePrioritySettings.js'\nimport { SettingsList } from './SettingsCard/SettingCard.style.js'\nimport { SettingsCardAccordion } from './SettingsCard/SettingsAccordian.js'\nimport { SlippageSettings } from './SlippageSettings/SlippageSettings.js'\nimport { SmallBalanceFilterSettings } from './SmallBalanceFilterSettings.js'\nimport { ThemeSettings } from './ThemeSettings.js'\n\nexport const SettingsPage = (): JSX.Element => {\n const { t } = useTranslation()\n const { hiddenUI } = useWidgetConfig()\n useHeader(t('header.settings'))\n\n return (\n <PageContainer topGutters bottomGutters>\n <SettingsList>\n <SettingsCardAccordion>\n <ThemeSettings />\n <LanguageSetting />\n <RoutePrioritySettings />\n <GasPriceSettings />\n <SlippageSettings />\n {!hiddenUI?.hideSmallBalances && <SmallBalanceFilterSettings />}\n <BridgeAndExchangeSettings type=\"Bridges\" />\n <BridgeAndExchangeSettings type=\"Exchanges\" />\n </SettingsCardAccordion>\n </SettingsList>\n <ResetSettingsButton />\n </PageContainer>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;AAgBA,MAAa,qBAAkC;CAC7C,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,EAAE,aAAa,gBAAgB;CACrC,UAAU,EAAE,iBAAiB,CAAC;CAE9B,OACE,qBAAC,eAAD;EAAe,YAAA;EAAW,eAAA;EAA1B,UAAA,CACE,oBAAC,cAAD,EAAA,UACE,qBAAC,uBAAD,EAAA,UAAA;GACE,oBAAC,eAAD,CAAgB,CAAA;GAChB,oBAAC,iBAAD,CAAkB,CAAA;GAClB,oBAAC,uBAAD,CAAwB,CAAA;GACxB,oBAAC,kBAAD,CAAmB,CAAA;GACnB,oBAAC,kBAAD,CAAmB,CAAA;GAClB,CAAC,UAAU,qBAAqB,oBAAC,4BAAD,CAA6B,CAAA;GAC9D,oBAAC,2BAAD,EAA2B,MAAK,UAAW,CAAA;GAC3C,oBAAC,2BAAD,EAA2B,MAAK,YAAa,CAAA;EACxB,EAAA,CAAA,EACX,CAAA,GACd,oBAAC,qBAAD,CAAsB,CAAA,CACT;;AAEnB"}
@@ -1 +1 @@
1
- {"version":3,"file":"SlippagePage.js","names":["ListItemText"],"sources":["../../../../../src/pages/SettingsPage/SlippageSettings/SlippagePage.tsx"],"sourcesContent":["import Check from '@mui/icons-material/Check'\nimport CloseRounded from '@mui/icons-material/CloseRounded'\nimport WarningRounded from '@mui/icons-material/WarningRounded'\nimport { Box, Collapse, List, Typography } from '@mui/material'\nimport type { ChangeEventHandler, FocusEventHandler } from 'react'\nimport { useRef, useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { ListItemText } from '../../../components/ListItemText.js'\nimport { PageContainer } from '../../../components/PageContainer.js'\nimport { SettingsListItemButton } from '../../../components/SettingsListItemButton.js'\nimport { useHeader } from '../../../hooks/useHeader.js'\nimport { useListHeight } from '../../../hooks/useListHeight.js'\nimport { useSettingMonitor } from '../../../hooks/useSettingMonitor.js'\nimport { defaultSlippage } from '../../../stores/settings/createSettingsStore.js'\nimport { useSettings } from '../../../stores/settings/useSettings.js'\nimport { useSettingsActions } from '../../../stores/settings/useSettingsActions.js'\nimport { formatInputAmount, formatSlippage } from '../../../utils/format.js'\nimport {\n SlippageClearButton,\n SlippageInput,\n SlippageLimitsWarningContainer,\n} from './SlippageSettings.style.js'\n\nconst slippagePresets = ['0.5', '1']\nconst maxFractionDigits = 5\n\nexport const SlippagePage: React.FC = () => {\n const { t } = useTranslation()\n const {\n isSlippageNotRecommended,\n isSlippageUnderRecommendedLimits,\n isSlippageOutsideRecommendedLimits,\n } = useSettingMonitor()\n const { slippage } = useSettings(['slippage'])\n const { setValue } = useSettingsActions()\n const defaultValue = useRef(slippage)\n const listParentRef = useRef<HTMLUListElement | null>(null)\n const { listHeight } = useListHeight({ listParentRef })\n\n useHeader(t('settings.slippage'))\n\n const isAuto = !slippage || slippage === defaultSlippage\n const isPreset = !!slippage && slippagePresets.includes(slippage)\n const isCustom = !isAuto && !isPreset\n\n const [customMode, setCustomMode] = useState(isCustom)\n const [inputValue, setInputValue] = useState(isCustom ? (slippage ?? '') : '')\n\n const handleAuto = () => {\n setCustomMode(false)\n setInputValue('')\n setValue('slippage', defaultSlippage)\n }\n\n const handlePreset = (preset: string) => {\n setCustomMode(false)\n setValue('slippage', preset)\n }\n\n const handleCustom = () => {\n setCustomMode(true)\n const initialValue = slippage || ''\n if (initialValue) {\n setInputValue(initialValue)\n setValue('slippage', initialValue)\n }\n }\n\n const formatAndSetSlippage = (value: string, returnInitial = false) => {\n const formattedSlippage = formatSlippage(\n value,\n defaultValue.current,\n returnInitial\n )\n const formattedValue =\n Number(formattedSlippage) === 0 && !returnInitial\n ? '0'\n : formatInputAmount(formattedSlippage, maxFractionDigits, returnInitial)\n const maxLength =\n Number(formattedValue) < 10\n ? maxFractionDigits + 2\n : maxFractionDigits + 3\n const slicedValue = formattedValue.slice(0, maxLength)\n setInputValue(slicedValue)\n setValue('slippage', slicedValue.length ? slicedValue : defaultSlippage)\n }\n\n const handleInputUpdate: ChangeEventHandler<HTMLInputElement> = (event) => {\n formatAndSetSlippage(event.target.value, true)\n }\n\n const handleInputFocus: FocusEventHandler<HTMLInputElement> = (event) => {\n formatAndSetSlippage(event.target.value)\n }\n\n const handleInputBlur: FocusEventHandler<HTMLInputElement> = (event) => {\n formatAndSetSlippage(event.target.value)\n }\n\n const slippageWarningText = isSlippageOutsideRecommendedLimits\n ? t('warning.message.slippageOutsideRecommendedLimits')\n : isSlippageUnderRecommendedLimits\n ? t('warning.message.slippageUnderRecommendedLimits')\n : ''\n\n return (\n <PageContainer disableGutters>\n <List\n className=\"long-list\"\n ref={listParentRef}\n style={{ height: listHeight, overflow: 'auto' }}\n sx={{\n padding: 1.5,\n }}\n >\n <SettingsListItemButton onClick={handleAuto}>\n <ListItemText\n primary={t('button.auto')}\n secondary={t('settings.slippageAutoDescription')}\n />\n {!customMode && isAuto && <Check color=\"primary\" />}\n </SettingsListItemButton>\n {slippagePresets.map((preset) => (\n <SettingsListItemButton\n key={preset}\n onClick={() => handlePreset(preset)}\n >\n <ListItemText primary={`${preset}%`} />\n {!customMode && slippage === preset && <Check color=\"primary\" />}\n </SettingsListItemButton>\n ))}\n <SettingsListItemButton onClick={handleCustom}>\n <ListItemText primary={t('settings.custom')} />\n {customMode && <Check color=\"primary\" />}\n </SettingsListItemButton>\n <Collapse in={customMode}>\n <Box sx={{ px: 1.5, pt: 1 }}>\n <SlippageInput\n placeholder=\"0.5\"\n inputProps={{ inputMode: 'decimal' }}\n value={inputValue}\n onChange={handleInputUpdate}\n onFocus={handleInputFocus}\n onBlur={handleInputBlur}\n autoComplete=\"off\"\n endAdornment={\n !isAuto && (\n <SlippageClearButton\n size=\"small\"\n onClick={handleAuto}\n aria-label=\"Clear\"\n >\n <CloseRounded fontSize=\"small\" />\n </SlippageClearButton>\n )\n }\n />\n {isSlippageNotRecommended && (\n <SlippageLimitsWarningContainer>\n <WarningRounded color=\"warning\" />\n <Typography\n sx={{\n fontSize: 13,\n fontWeight: 400,\n }}\n >\n {slippageWarningText}\n </Typography>\n </SlippageLimitsWarningContainer>\n )}\n </Box>\n </Collapse>\n </List>\n </PageContainer>\n )\n}\n"],"mappings":"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"}
1
+ {"version":3,"file":"SlippagePage.js","names":["ListItemText"],"sources":["../../../../../src/pages/SettingsPage/SlippageSettings/SlippagePage.tsx"],"sourcesContent":["import Check from '@mui/icons-material/Check'\nimport CloseRounded from '@mui/icons-material/CloseRounded'\nimport WarningRounded from '@mui/icons-material/WarningRounded'\nimport { Box, Collapse, List, Typography } from '@mui/material'\nimport type { ChangeEventHandler, FocusEventHandler } from 'react'\nimport { useRef, useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { ListItemText } from '../../../components/ListItemText.js'\nimport { PageContainer } from '../../../components/PageContainer.js'\nimport { SettingsListItemButton } from '../../../components/SettingsListItemButton.js'\nimport { useHeader } from '../../../hooks/useHeader.js'\nimport { useListHeight } from '../../../hooks/useListHeight.js'\nimport { useSettingMonitor } from '../../../hooks/useSettingMonitor.js'\nimport { defaultSlippage } from '../../../stores/settings/createSettingsStore.js'\nimport { useSettings } from '../../../stores/settings/useSettings.js'\nimport { useSettingsActions } from '../../../stores/settings/useSettingsActions.js'\nimport { formatInputAmount, formatSlippage } from '../../../utils/format.js'\nimport {\n SlippageClearButton,\n SlippageInput,\n SlippageLimitsWarningContainer,\n} from './SlippageSettings.style.js'\n\nconst slippagePresets = ['0.5', '1']\nconst maxFractionDigits = 5\n\nexport const SlippagePage: React.FC = () => {\n const { t } = useTranslation()\n const {\n isSlippageNotRecommended,\n isSlippageUnderRecommendedLimits,\n isSlippageOutsideRecommendedLimits,\n } = useSettingMonitor()\n const { slippage } = useSettings(['slippage'])\n const { setValue } = useSettingsActions()\n const defaultValue = useRef(slippage)\n const listParentRef = useRef<HTMLUListElement | null>(null)\n const { listHeight } = useListHeight({ listParentRef })\n\n useHeader(t('settings.slippage'))\n\n const isAuto = !slippage || slippage === defaultSlippage\n const isPreset = !!slippage && slippagePresets.includes(slippage)\n const isCustom = !isAuto && !isPreset\n\n const [customMode, setCustomMode] = useState(isCustom)\n const [inputValue, setInputValue] = useState(isCustom ? (slippage ?? '') : '')\n\n const handleAuto = () => {\n setCustomMode(false)\n setInputValue('')\n setValue('slippage', defaultSlippage)\n }\n\n const handlePreset = (preset: string) => {\n setCustomMode(false)\n setValue('slippage', preset)\n }\n\n const handleCustom = () => {\n setCustomMode(true)\n const initialValue = slippage || ''\n if (initialValue) {\n setInputValue(initialValue)\n setValue('slippage', initialValue)\n }\n }\n\n const formatAndSetSlippage = (value: string, returnInitial = false) => {\n const formattedSlippage = formatSlippage(\n value,\n defaultValue.current,\n returnInitial\n )\n const formattedValue =\n Number(formattedSlippage) === 0 && !returnInitial\n ? '0'\n : formatInputAmount(formattedSlippage, maxFractionDigits, returnInitial)\n const maxLength =\n Number(formattedValue) < 10\n ? maxFractionDigits + 2\n : maxFractionDigits + 3\n const slicedValue = formattedValue.slice(0, maxLength)\n setInputValue(slicedValue)\n setValue('slippage', slicedValue.length ? slicedValue : defaultSlippage)\n }\n\n const handleInputUpdate: ChangeEventHandler<HTMLInputElement> = (event) => {\n formatAndSetSlippage(event.target.value, true)\n }\n\n const handleInputFocus: FocusEventHandler<HTMLInputElement> = (event) => {\n formatAndSetSlippage(event.target.value)\n }\n\n const handleInputBlur: FocusEventHandler<HTMLInputElement> = (event) => {\n formatAndSetSlippage(event.target.value)\n }\n\n const slippageWarningText = isSlippageOutsideRecommendedLimits\n ? t('warning.message.slippageOutsideRecommendedLimits')\n : isSlippageUnderRecommendedLimits\n ? t('warning.message.slippageUnderRecommendedLimits')\n : ''\n\n return (\n <PageContainer disableGutters>\n <List\n className=\"long-list\"\n ref={listParentRef}\n style={{ height: listHeight, overflow: 'auto' }}\n sx={{\n padding: 1.5,\n }}\n >\n <SettingsListItemButton onClick={handleAuto}>\n <ListItemText\n primary={t('button.auto')}\n secondary={t('settings.slippageAutoDescription')}\n />\n {!customMode && isAuto && <Check color=\"primary\" />}\n </SettingsListItemButton>\n {slippagePresets.map((preset) => (\n <SettingsListItemButton\n key={preset}\n onClick={() => handlePreset(preset)}\n >\n <ListItemText primary={`${preset}%`} />\n {!customMode && slippage === preset && <Check color=\"primary\" />}\n </SettingsListItemButton>\n ))}\n <SettingsListItemButton onClick={handleCustom}>\n <ListItemText primary={t('settings.custom')} />\n {customMode && <Check color=\"primary\" />}\n </SettingsListItemButton>\n <Collapse in={customMode}>\n <Box sx={{ px: 1.5, pt: 1 }}>\n <SlippageInput\n placeholder=\"0.5\"\n inputProps={{ inputMode: 'decimal' }}\n value={inputValue}\n onChange={handleInputUpdate}\n onFocus={handleInputFocus}\n onBlur={handleInputBlur}\n autoComplete=\"off\"\n endAdornment={\n !isAuto && (\n <SlippageClearButton\n size=\"small\"\n onClick={handleAuto}\n aria-label=\"Clear\"\n >\n <CloseRounded fontSize=\"small\" />\n </SlippageClearButton>\n )\n }\n />\n {isSlippageNotRecommended && (\n <SlippageLimitsWarningContainer>\n <WarningRounded color=\"warning\" />\n <Typography\n sx={{\n fontSize: 13,\n fontWeight: 400,\n }}\n >\n {slippageWarningText}\n </Typography>\n </SlippageLimitsWarningContainer>\n )}\n </Box>\n </Collapse>\n </List>\n </PageContainer>\n )\n}\n"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"SlippageSettings.js","names":[],"sources":["../../../../../src/pages/SettingsPage/SlippageSettings/SlippageSettings.tsx"],"sourcesContent":["import Percent from '@mui/icons-material/Percent'\nimport { useNavigate } from '@tanstack/react-router'\nimport { useTranslation } from 'react-i18next'\nimport { CardButton } from '../../../components/Card/CardButton.js'\nimport { useSettingMonitor } from '../../../hooks/useSettingMonitor.js'\nimport { useSettings } from '../../../stores/settings/useSettings.js'\nimport { navigationRoutes } from '../../../utils/navigationRoutes.js'\nimport { BadgedValue } from '../SettingsCard/BadgedValue.js'\n\nexport const SlippageSettings: React.FC = () => {\n const { t } = useTranslation()\n const navigate = useNavigate()\n const { isSlippageNotRecommended, isSlippageChanged } = useSettingMonitor()\n const { slippage } = useSettings(['slippage'])\n\n const badgeColor = isSlippageNotRecommended\n ? 'warning'\n : isSlippageChanged\n ? 'info'\n : undefined\n\n const handleClick = () => {\n navigate({ to: navigationRoutes.slippage })\n }\n\n return (\n <CardButton\n onClick={handleClick}\n icon={<Percent />}\n title={t('settings.slippage')}\n >\n <BadgedValue badgeColor={badgeColor} showBadge={!!badgeColor}>\n {slippage ? `${slippage}%` : t('button.auto')}\n </BadgedValue>\n </CardButton>\n )\n}\n"],"mappings":";;;;;;;;;;AASA,MAAa,yBAAmC;CAC9C,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,WAAW,YAAY;CAC7B,MAAM,EAAE,0BAA0B,sBAAsB,kBAAkB;CAC1E,MAAM,EAAE,aAAa,YAAY,CAAC,UAAU,CAAC;CAE7C,MAAM,aAAa,2BACf,YACA,oBACE,SACA,KAAA;CAEN,MAAM,oBAAoB;EACxB,SAAS,EAAE,IAAI,iBAAiB,SAAS,CAAC;CAC5C;CAEA,OACE,oBAAC,YAAD;EACE,SAAS;EACT,MAAM,oBAAC,SAAD,CAAU,CAAA;EAChB,OAAO,EAAE,mBAAmB;YAE5B,oBAAC,aAAD;GAAyB;GAAY,WAAW,CAAC,CAAC;aAC/C,WAAW,GAAG,SAAS,KAAK,EAAE,aAAa;EACjC,CAAA;CACH,CAAA;AAEhB"}
1
+ {"version":3,"file":"SlippageSettings.js","names":[],"sources":["../../../../../src/pages/SettingsPage/SlippageSettings/SlippageSettings.tsx"],"sourcesContent":["import Percent from '@mui/icons-material/Percent'\nimport { useNavigate } from '@tanstack/react-router'\nimport { useTranslation } from 'react-i18next'\nimport { CardButton } from '../../../components/Card/CardButton.js'\nimport { useSettingMonitor } from '../../../hooks/useSettingMonitor.js'\nimport { useSettings } from '../../../stores/settings/useSettings.js'\nimport { navigationRoutes } from '../../../utils/navigationRoutes.js'\nimport { BadgedValue } from '../SettingsCard/BadgedValue.js'\n\nexport const SlippageSettings: React.FC = () => {\n const { t } = useTranslation()\n const navigate = useNavigate()\n const { isSlippageNotRecommended, isSlippageChanged } = useSettingMonitor()\n const { slippage } = useSettings(['slippage'])\n\n const badgeColor = isSlippageNotRecommended\n ? 'warning'\n : isSlippageChanged\n ? 'info'\n : undefined\n\n const handleClick = () => {\n navigate({ to: navigationRoutes.slippage })\n }\n\n return (\n <CardButton\n onClick={handleClick}\n icon={<Percent />}\n title={t('settings.slippage')}\n >\n <BadgedValue badgeColor={badgeColor} showBadge={!!badgeColor}>\n {slippage ? `${slippage}%` : t('button.auto')}\n </BadgedValue>\n </CardButton>\n )\n}\n"],"mappings":";;;;;;;;;;AASA,MAAa,yBAAmC;CAC9C,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,WAAW,YAAY;CAC7B,MAAM,EAAE,0BAA0B,sBAAsB,kBAAkB;CAC1E,MAAM,EAAE,aAAa,YAAY,CAAC,UAAU,CAAC;CAE7C,MAAM,aAAa,2BACf,YACA,oBACE,SACA,KAAA;CAEN,MAAM,oBAAoB;EACxB,SAAS,EAAE,IAAI,iBAAiB,SAAS,CAAC;CAC5C;CAEA,OACE,oBAAC,YAAD;EACE,SAAS;EACT,MAAM,oBAAC,SAAD,CAAU,CAAA;EAChB,OAAO,EAAE,mBAAmB;EAE5B,UAAA,oBAAC,aAAD;GAAyB;GAAY,WAAW,CAAC,CAAC;GAC/C,UAAA,WAAW,GAAG,SAAS,KAAK,EAAE,aAAa;EACjC,CAAA;CACH,CAAA;AAEhB"}
@@ -19,7 +19,8 @@ const SmallBalanceFilterSettings = () => {
19
19
  const buttonRef = useRef(null);
20
20
  const inputRef = useRef(null);
21
21
  const formatAndSetThreshold = (inputValue, returnInitial = false) => {
22
- const formattedValue = formatInputAmount(inputValue.replace("$", ""), 2, returnInitial);
22
+ const value = inputValue.replace("$", "");
23
+ const formattedValue = formatInputAmount(value, 2, returnInitial);
23
24
  if (returnInitial) setInputValue(formattedValue);
24
25
  else {
25
26
  const formattedOrDefault = formattedValue || defaultThreshold;
@@ -1 +1 @@
1
- {"version":3,"file":"SmallBalanceFilterSettings.js","names":["Switch"],"sources":["../../../../src/pages/SettingsPage/SmallBalanceFilterSettings.tsx"],"sourcesContent":["import AttachMoney from '@mui/icons-material/AttachMoney'\nimport { Box } from '@mui/material'\nimport {\n type ChangeEvent,\n type ChangeEventHandler,\n type FocusEventHandler,\n useEffect,\n useRef,\n useState,\n} from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { Switch } from '../../components/Switch.js'\nimport { useSettings } from '../../stores/settings/useSettings.js'\nimport { useSettingsActions } from '../../stores/settings/useSettingsActions.js'\nimport { formatInputAmount, usdDecimals } from '../../utils/format.js'\nimport {\n SettingCardExpandable,\n type SettingCardExpandableRef,\n} from './SettingsCard/SettingCardExpandable.js'\nimport {\n SettingsCustomInput,\n SettingsFieldSet,\n} from './SlippageSettings/SlippageSettings.style.js'\n\nconst defaultThreshold = '0.01'\n\nexport const SmallBalanceFilterSettings: React.FC = () => {\n const { t } = useTranslation()\n const { smallBalanceThreshold } = useSettings(['smallBalanceThreshold'])\n const { setValue } = useSettingsActions()\n const [inputValue, setInputValue] = useState(\n smallBalanceThreshold ?? defaultThreshold\n )\n const buttonRef = useRef<SettingCardExpandableRef>(null)\n const inputRef = useRef<HTMLInputElement>(null)\n\n const formatAndSetThreshold = (inputValue: string, returnInitial = false) => {\n const value = inputValue.replace('$', '')\n const formattedValue = formatInputAmount(value, usdDecimals, returnInitial)\n if (returnInitial) {\n setInputValue(formattedValue)\n } else {\n const formattedOrDefault = formattedValue || defaultThreshold\n setInputValue(formattedOrDefault)\n setValue('smallBalanceThreshold', formattedOrDefault)\n }\n }\n\n const handleInputUpdate: ChangeEventHandler<HTMLInputElement> = (event) => {\n formatAndSetThreshold(event.target.value, true)\n }\n\n const handleInputBlur: FocusEventHandler<HTMLInputElement> = (event) => {\n formatAndSetThreshold(event.target.value, false)\n }\n\n const handleHideSmallBalancesChange = (\n event: ChangeEvent<HTMLInputElement>\n ) => {\n setValue(\n 'smallBalanceThreshold',\n event.target.checked ? defaultThreshold : undefined\n )\n if (buttonRef.current) {\n buttonRef.current?.toggleExpanded(event.target.checked)\n }\n }\n\n const handleExpanded = () => {\n if (inputRef.current) {\n inputRef.current.focus()\n }\n }\n\n useEffect(() => {\n setInputValue(smallBalanceThreshold ?? defaultThreshold)\n }, [smallBalanceThreshold])\n\n return (\n <SettingCardExpandable\n ref={buttonRef}\n value={\n <Switch\n checked={!!smallBalanceThreshold}\n onChange={handleHideSmallBalancesChange}\n aria-label={t('settings.hideSmallBalances')}\n />\n }\n icon={<AttachMoney />}\n title={t('settings.hideSmallBalances')}\n disabled={!smallBalanceThreshold}\n keepValueVisible\n onEntered={handleExpanded}\n >\n <Box\n sx={{\n mt: 1.5,\n }}\n >\n <SettingsFieldSet>\n <SettingsCustomInput\n inputRef={inputRef}\n selected\n inputProps={{\n inputMode: 'decimal',\n }}\n onChange={handleInputUpdate}\n onBlur={handleInputBlur}\n value={`$${inputValue}`}\n autoComplete=\"off\"\n />\n </SettingsFieldSet>\n </Box>\n </SettingCardExpandable>\n )\n}\n"],"mappings":";;;;;;;;;;;;AAwBA,MAAM,mBAAmB;AAEzB,MAAa,mCAA6C;CACxD,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,EAAE,0BAA0B,YAAY,CAAC,uBAAuB,CAAC;CACvE,MAAM,EAAE,aAAa,mBAAmB;CACxC,MAAM,CAAC,YAAY,iBAAiB,SAClC,yBAAyB,gBAC3B;CACA,MAAM,YAAY,OAAiC,IAAI;CACvD,MAAM,WAAW,OAAyB,IAAI;CAE9C,MAAM,yBAAyB,YAAoB,gBAAgB,UAAU;EAE3E,MAAM,iBAAiB,kBADT,WAAW,QAAQ,KAAK,EACO,GAAA,GAAgB,aAAa;EAC1E,IAAI,eACF,cAAc,cAAc;OACvB;GACL,MAAM,qBAAqB,kBAAkB;GAC7C,cAAc,kBAAkB;GAChC,SAAS,yBAAyB,kBAAkB;EACtD;CACF;CAEA,MAAM,qBAA2D,UAAU;EACzE,sBAAsB,MAAM,OAAO,OAAO,IAAI;CAChD;CAEA,MAAM,mBAAwD,UAAU;EACtE,sBAAsB,MAAM,OAAO,OAAO,KAAK;CACjD;CAEA,MAAM,iCACJ,UACG;EACH,SACE,yBACA,MAAM,OAAO,UAAU,mBAAmB,KAAA,CAC5C;EACA,IAAI,UAAU,SACZ,UAAU,SAAS,eAAe,MAAM,OAAO,OAAO;CAE1D;CAEA,MAAM,uBAAuB;EAC3B,IAAI,SAAS,SACX,SAAS,QAAQ,MAAM;CAE3B;CAEA,gBAAgB;EACd,cAAc,yBAAyB,gBAAgB;CACzD,GAAG,CAAC,qBAAqB,CAAC;CAE1B,OACE,oBAAC,uBAAD;EACE,KAAK;EACL,OACE,oBAACA,UAAD;GACE,SAAS,CAAC,CAAC;GACX,UAAU;GACV,cAAY,EAAE,4BAA4B;EAC3C,CAAA;EAEH,MAAM,oBAAC,aAAD,CAAc,CAAA;EACpB,OAAO,EAAE,4BAA4B;EACrC,UAAU,CAAC;EACX,kBAAA;EACA,WAAW;YAEX,oBAAC,KAAD;GACE,IAAI,EACF,IAAI,IACN;aAEA,oBAAC,kBAAD,EAAA,UACE,oBAAC,qBAAD;IACY;IACV,UAAA;IACA,YAAY,EACV,WAAW,UACb;IACA,UAAU;IACV,QAAQ;IACR,OAAO,IAAI;IACX,cAAa;GACd,CAAA,EACe,CAAA;EACf,CAAA;CACgB,CAAA;AAE3B"}
1
+ {"version":3,"file":"SmallBalanceFilterSettings.js","names":["Switch"],"sources":["../../../../src/pages/SettingsPage/SmallBalanceFilterSettings.tsx"],"sourcesContent":["import AttachMoney from '@mui/icons-material/AttachMoney'\nimport { Box } from '@mui/material'\nimport {\n type ChangeEvent,\n type ChangeEventHandler,\n type FocusEventHandler,\n useEffect,\n useRef,\n useState,\n} from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { Switch } from '../../components/Switch.js'\nimport { useSettings } from '../../stores/settings/useSettings.js'\nimport { useSettingsActions } from '../../stores/settings/useSettingsActions.js'\nimport { formatInputAmount, usdDecimals } from '../../utils/format.js'\nimport {\n SettingCardExpandable,\n type SettingCardExpandableRef,\n} from './SettingsCard/SettingCardExpandable.js'\nimport {\n SettingsCustomInput,\n SettingsFieldSet,\n} from './SlippageSettings/SlippageSettings.style.js'\n\nconst defaultThreshold = '0.01'\n\nexport const SmallBalanceFilterSettings: React.FC = () => {\n const { t } = useTranslation()\n const { smallBalanceThreshold } = useSettings(['smallBalanceThreshold'])\n const { setValue } = useSettingsActions()\n const [inputValue, setInputValue] = useState(\n smallBalanceThreshold ?? defaultThreshold\n )\n const buttonRef = useRef<SettingCardExpandableRef>(null)\n const inputRef = useRef<HTMLInputElement>(null)\n\n const formatAndSetThreshold = (inputValue: string, returnInitial = false) => {\n const value = inputValue.replace('$', '')\n const formattedValue = formatInputAmount(value, usdDecimals, returnInitial)\n if (returnInitial) {\n setInputValue(formattedValue)\n } else {\n const formattedOrDefault = formattedValue || defaultThreshold\n setInputValue(formattedOrDefault)\n setValue('smallBalanceThreshold', formattedOrDefault)\n }\n }\n\n const handleInputUpdate: ChangeEventHandler<HTMLInputElement> = (event) => {\n formatAndSetThreshold(event.target.value, true)\n }\n\n const handleInputBlur: FocusEventHandler<HTMLInputElement> = (event) => {\n formatAndSetThreshold(event.target.value, false)\n }\n\n const handleHideSmallBalancesChange = (\n event: ChangeEvent<HTMLInputElement>\n ) => {\n setValue(\n 'smallBalanceThreshold',\n event.target.checked ? defaultThreshold : undefined\n )\n if (buttonRef.current) {\n buttonRef.current?.toggleExpanded(event.target.checked)\n }\n }\n\n const handleExpanded = () => {\n if (inputRef.current) {\n inputRef.current.focus()\n }\n }\n\n useEffect(() => {\n setInputValue(smallBalanceThreshold ?? defaultThreshold)\n }, [smallBalanceThreshold])\n\n return (\n <SettingCardExpandable\n ref={buttonRef}\n value={\n <Switch\n checked={!!smallBalanceThreshold}\n onChange={handleHideSmallBalancesChange}\n aria-label={t('settings.hideSmallBalances')}\n />\n }\n icon={<AttachMoney />}\n title={t('settings.hideSmallBalances')}\n disabled={!smallBalanceThreshold}\n keepValueVisible\n onEntered={handleExpanded}\n >\n <Box\n sx={{\n mt: 1.5,\n }}\n >\n <SettingsFieldSet>\n <SettingsCustomInput\n inputRef={inputRef}\n selected\n inputProps={{\n inputMode: 'decimal',\n }}\n onChange={handleInputUpdate}\n onBlur={handleInputBlur}\n value={`$${inputValue}`}\n autoComplete=\"off\"\n />\n </SettingsFieldSet>\n </Box>\n </SettingCardExpandable>\n )\n}\n"],"mappings":";;;;;;;;;;;;AAwBA,MAAM,mBAAmB;AAEzB,MAAa,mCAA6C;CACxD,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,EAAE,0BAA0B,YAAY,CAAC,uBAAuB,CAAC;CACvE,MAAM,EAAE,aAAa,mBAAmB;CACxC,MAAM,CAAC,YAAY,iBAAiB,SAClC,yBAAyB,gBAC3B;CACA,MAAM,YAAY,OAAiC,IAAI;CACvD,MAAM,WAAW,OAAyB,IAAI;CAE9C,MAAM,yBAAyB,YAAoB,gBAAgB,UAAU;EAC3E,MAAM,QAAQ,WAAW,QAAQ,KAAK,EAAE;EACxC,MAAM,iBAAiB,kBAAkB,OAAA,GAAoB,aAAa;EAC1E,IAAI,eACF,cAAc,cAAc;OACvB;GACL,MAAM,qBAAqB,kBAAkB;GAC7C,cAAc,kBAAkB;GAChC,SAAS,yBAAyB,kBAAkB;EACtD;CACF;CAEA,MAAM,qBAA2D,UAAU;EACzE,sBAAsB,MAAM,OAAO,OAAO,IAAI;CAChD;CAEA,MAAM,mBAAwD,UAAU;EACtE,sBAAsB,MAAM,OAAO,OAAO,KAAK;CACjD;CAEA,MAAM,iCACJ,UACG;EACH,SACE,yBACA,MAAM,OAAO,UAAU,mBAAmB,KAAA,CAC5C;EACA,IAAI,UAAU,SACZ,UAAU,SAAS,eAAe,MAAM,OAAO,OAAO;CAE1D;CAEA,MAAM,uBAAuB;EAC3B,IAAI,SAAS,SACX,SAAS,QAAQ,MAAM;CAE3B;CAEA,gBAAgB;EACd,cAAc,yBAAyB,gBAAgB;CACzD,GAAG,CAAC,qBAAqB,CAAC;CAE1B,OACE,oBAAC,uBAAD;EACE,KAAK;EACL,OACE,oBAACA,UAAD;GACE,SAAS,CAAC,CAAC;GACX,UAAU;GACV,cAAY,EAAE,4BAA4B;EAC3C,CAAA;EAEH,MAAM,oBAAC,aAAD,CAAc,CAAA;EACpB,OAAO,EAAE,4BAA4B;EACrC,UAAU,CAAC;EACX,kBAAA;EACA,WAAW;EAEX,UAAA,oBAAC,KAAD;GACE,IAAI,EACF,IAAI,IACN;GAEA,UAAA,oBAAC,kBAAD,EAAA,UACE,oBAAC,qBAAD;IACY;IACV,UAAA;IACA,YAAY,EACV,WAAW,UACb;IACA,UAAU;IACV,QAAQ;IACR,OAAO,IAAI;IACX,cAAa;GACd,CAAA,EACe,CAAA;EACf,CAAA;CACgB,CAAA;AAE3B"}
@@ -1 +1 @@
1
- {"version":3,"file":"ThemeSettings.js","names":["Tab"],"sources":["../../../../src/pages/SettingsPage/ThemeSettings.tsx"],"sourcesContent":["import BrightnessAuto from '@mui/icons-material/BrightnessAuto'\nimport LightMode from '@mui/icons-material/LightMode'\nimport Nightlight from '@mui/icons-material/Nightlight'\nimport { Tooltip, useColorScheme } from '@mui/material'\nimport { useTranslation } from 'react-i18next'\nimport { CardValue } from '../../components/Card/CardButton.style.js'\nimport { CardTabs, Tab } from '../../components/Tabs/Tabs.style.js'\nimport { useWidgetEvents } from '../../hooks/useWidgetEvents.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { WidgetEvent } from '../../types/events.js'\nimport type { Appearance } from '../../types/widget.js'\nimport { SettingCardExpandable } from './SettingsCard/SettingCardExpandable.js'\n\nconst themeIcons = {\n light: LightMode,\n dark: Nightlight,\n system: BrightnessAuto,\n}\n\ninterface ThemeTabProps {\n title: string\n value: Appearance\n Icon: React.ReactElement\n}\n\n// If the Tab is not the direct child of the Tabs component you can loose the switching\n// The component passes the props to the Tab component so switching isn't lost\nconst ThemeTab: React.FC<ThemeTabProps> = ({\n title,\n value,\n Icon,\n ...props\n}) => (\n <Tooltip title={title}>\n <Tab icon={Icon} value={value} {...props} disableRipple />\n </Tooltip>\n)\n\nexport const ThemeSettings: React.FC = () => {\n const { t } = useTranslation()\n const { mode, setMode } = useColorScheme()\n const widgetEvents = useWidgetEvents()\n const { hiddenUI } = useWidgetConfig()\n\n if (hiddenUI?.appearance) {\n return null\n }\n\n const appearance = mode ?? 'system'\n\n const ThemeIcon = themeIcons[appearance]\n\n const handleThemeChange = (\n _: React.SyntheticEvent,\n appearance: Appearance\n ) => {\n setMode(appearance)\n widgetEvents.emit(WidgetEvent.AppearanceChanged, appearance)\n }\n\n return (\n <SettingCardExpandable\n value={<CardValue>{t(`button.${appearance}`)} </CardValue>}\n icon={<ThemeIcon />}\n title={t('settings.appearance')}\n >\n <CardTabs\n value={appearance}\n aria-label=\"tabs\"\n indicatorColor=\"primary\"\n onChange={handleThemeChange}\n sx={{ mt: 1.5 }}\n >\n {Object.entries(themeIcons).map(([theme, Icon]) => {\n const supportedThemeOption = theme as Appearance\n\n return (\n <ThemeTab\n key={supportedThemeOption}\n title={t(`button.${supportedThemeOption}`)}\n value={supportedThemeOption}\n Icon={<Icon />}\n />\n )\n })}\n </CardTabs>\n </SettingCardExpandable>\n )\n}\n"],"mappings":";;;;;;;;;;;;;AAaA,MAAM,aAAa;CACjB,OAAO;CACP,MAAM;CACN,QAAQ;AACV;AAUA,MAAM,YAAqC,EACzC,OACA,OACA,MACA,GAAG,YAEH,oBAAC,SAAD;CAAgB;WACd,oBAACA,OAAD;EAAK,MAAM;EAAa;EAAO,GAAI;EAAO,eAAA;CAAe,CAAA;AAClD,CAAA;AAGX,MAAa,sBAAgC;CAC3C,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,EAAE,MAAM,YAAY,eAAe;CACzC,MAAM,eAAe,gBAAgB;CACrC,MAAM,EAAE,aAAa,gBAAgB;CAErC,IAAI,UAAU,YACZ,OAAO;CAGT,MAAM,aAAa,QAAQ;CAE3B,MAAM,YAAY,WAAW;CAE7B,MAAM,qBACJ,GACA,eACG;EACH,QAAQ,UAAU;EAClB,aAAa,KAAA,qBAAoC,UAAU;CAC7D;CAEA,OACE,oBAAC,uBAAD;EACE,OAAO,qBAAC,WAAD,EAAA,UAAA,CAAY,EAAE,UAAU,YAAY,GAAE,GAAY,EAAA,CAAA;EACzD,MAAM,oBAAC,WAAD,CAAY,CAAA;EAClB,OAAO,EAAE,qBAAqB;YAE9B,oBAAC,UAAD;GACE,OAAO;GACP,cAAW;GACX,gBAAe;GACf,UAAU;GACV,IAAI,EAAE,IAAI,IAAI;aAEb,OAAO,QAAQ,UAAU,CAAC,CAAC,KAAK,CAAC,OAAO,UAAU;IACjD,MAAM,uBAAuB;IAE7B,OACE,oBAAC,UAAD;KAEE,OAAO,EAAE,UAAU,sBAAsB;KACzC,OAAO;KACP,MAAM,oBAAC,MAAD,CAAO,CAAA;IACd,GAJM,oBAIN;GAEL,CAAC;EACO,CAAA;CACW,CAAA;AAE3B"}
1
+ {"version":3,"file":"ThemeSettings.js","names":["Tab"],"sources":["../../../../src/pages/SettingsPage/ThemeSettings.tsx"],"sourcesContent":["import BrightnessAuto from '@mui/icons-material/BrightnessAuto'\nimport LightMode from '@mui/icons-material/LightMode'\nimport Nightlight from '@mui/icons-material/Nightlight'\nimport { Tooltip, useColorScheme } from '@mui/material'\nimport { useTranslation } from 'react-i18next'\nimport { CardValue } from '../../components/Card/CardButton.style.js'\nimport { CardTabs, Tab } from '../../components/Tabs/Tabs.style.js'\nimport { useWidgetEvents } from '../../hooks/useWidgetEvents.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { WidgetEvent } from '../../types/events.js'\nimport type { Appearance } from '../../types/widget.js'\nimport { SettingCardExpandable } from './SettingsCard/SettingCardExpandable.js'\n\nconst themeIcons = {\n light: LightMode,\n dark: Nightlight,\n system: BrightnessAuto,\n}\n\ninterface ThemeTabProps {\n title: string\n value: Appearance\n Icon: React.ReactElement\n}\n\n// If the Tab is not the direct child of the Tabs component you can loose the switching\n// The component passes the props to the Tab component so switching isn't lost\nconst ThemeTab: React.FC<ThemeTabProps> = ({\n title,\n value,\n Icon,\n ...props\n}) => (\n <Tooltip title={title}>\n <Tab icon={Icon} value={value} {...props} disableRipple />\n </Tooltip>\n)\n\nexport const ThemeSettings: React.FC = () => {\n const { t } = useTranslation()\n const { mode, setMode } = useColorScheme()\n const widgetEvents = useWidgetEvents()\n const { hiddenUI } = useWidgetConfig()\n\n if (hiddenUI?.appearance) {\n return null\n }\n\n const appearance = mode ?? 'system'\n\n const ThemeIcon = themeIcons[appearance]\n\n const handleThemeChange = (\n _: React.SyntheticEvent,\n appearance: Appearance\n ) => {\n setMode(appearance)\n widgetEvents.emit(WidgetEvent.AppearanceChanged, appearance)\n }\n\n return (\n <SettingCardExpandable\n value={<CardValue>{t(`button.${appearance}`)} </CardValue>}\n icon={<ThemeIcon />}\n title={t('settings.appearance')}\n >\n <CardTabs\n value={appearance}\n aria-label=\"tabs\"\n indicatorColor=\"primary\"\n onChange={handleThemeChange}\n sx={{ mt: 1.5 }}\n >\n {Object.entries(themeIcons).map(([theme, Icon]) => {\n const supportedThemeOption = theme as Appearance\n\n return (\n <ThemeTab\n key={supportedThemeOption}\n title={t(`button.${supportedThemeOption}`)}\n value={supportedThemeOption}\n Icon={<Icon />}\n />\n )\n })}\n </CardTabs>\n </SettingCardExpandable>\n )\n}\n"],"mappings":";;;;;;;;;;;;;AAaA,MAAM,aAAa;CACjB,OAAO;CACP,MAAM;CACN,QAAQ;AACV;AAUA,MAAM,YAAqC,EACzC,OACA,OACA,MACA,GAAG,YAEH,oBAAC,SAAD;CAAgB;CACd,UAAA,oBAACA,OAAD;EAAK,MAAM;EAAa;EAAO,GAAI;EAAO,eAAA;CAAe,CAAA;AAClD,CAAA;AAGX,MAAa,sBAAgC;CAC3C,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,EAAE,MAAM,YAAY,eAAe;CACzC,MAAM,eAAe,gBAAgB;CACrC,MAAM,EAAE,aAAa,gBAAgB;CAErC,IAAI,UAAU,YACZ,OAAO;CAGT,MAAM,aAAa,QAAQ;CAE3B,MAAM,YAAY,WAAW;CAE7B,MAAM,qBACJ,GACA,eACG;EACH,QAAQ,UAAU;EAClB,aAAa,KAAA,qBAAoC,UAAU;CAC7D;CAEA,OACE,oBAAC,uBAAD;EACE,OAAO,qBAAC,WAAD,EAAA,UAAA,CAAY,EAAE,UAAU,YAAY,GAAE,GAAY,EAAA,CAAA;EACzD,MAAM,oBAAC,WAAD,CAAY,CAAA;EAClB,OAAO,EAAE,qBAAqB;EAE9B,UAAA,oBAAC,UAAD;GACE,OAAO;GACP,cAAW;GACX,gBAAe;GACf,UAAU;GACV,IAAI,EAAE,IAAI,IAAI;GAEb,UAAA,OAAO,QAAQ,UAAU,CAAC,CAAC,KAAK,CAAC,OAAO,UAAU;IACjD,MAAM,uBAAuB;IAE7B,OACE,oBAAC,UAAD;KAEE,OAAO,EAAE,UAAU,sBAAsB;KACzC,OAAO;KACP,MAAM,oBAAC,MAAD,CAAO,CAAA;IACd,GAJM,oBAIN;GAEL,CAAC;EACO,CAAA;CACW,CAAA;AAE3B"}
@@ -5,8 +5,9 @@ import { useTranslation } from "react-i18next";
5
5
  //#region src/pages/TransactionDetailsPage/ContactSupportButton.tsx
6
6
  const ContactSupportButton = ({ supportId }) => {
7
7
  const { t } = useTranslation();
8
+ const handleContactSupport = useContactSupport(supportId);
8
9
  return /* @__PURE__ */ jsx(ButtonChip, {
9
- onClick: useContactSupport(supportId),
10
+ onClick: handleContactSupport,
10
11
  children: t("button.contactSupport")
11
12
  });
12
13
  };
@@ -1 +1 @@
1
- {"version":3,"file":"ContactSupportButton.js","names":[],"sources":["../../../../src/pages/TransactionDetailsPage/ContactSupportButton.tsx"],"sourcesContent":["import type { JSX } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useContactSupport } from '../../hooks/useContactSupport.js'\nimport { ButtonChip } from './ContactSupportButton.style.js'\n\ninterface ContactSupportButtonProps {\n supportId?: string\n}\n\nexport const ContactSupportButton = ({\n supportId,\n}: ContactSupportButtonProps): JSX.Element => {\n const { t } = useTranslation()\n const handleContactSupport = useContactSupport(supportId)\n\n return (\n <ButtonChip onClick={handleContactSupport}>\n {t('button.contactSupport')}\n </ButtonChip>\n )\n}\n"],"mappings":";;;;;AASA,MAAa,wBAAwB,EACnC,gBAC4C;CAC5C,MAAM,EAAE,MAAM,eAAe;CAG7B,OACE,oBAAC,YAAD;EAAY,SAHe,kBAAkB,SAGL;YACrC,EAAE,uBAAuB;CAChB,CAAA;AAEhB"}
1
+ {"version":3,"file":"ContactSupportButton.js","names":[],"sources":["../../../../src/pages/TransactionDetailsPage/ContactSupportButton.tsx"],"sourcesContent":["import type { JSX } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useContactSupport } from '../../hooks/useContactSupport.js'\nimport { ButtonChip } from './ContactSupportButton.style.js'\n\ninterface ContactSupportButtonProps {\n supportId?: string\n}\n\nexport const ContactSupportButton = ({\n supportId,\n}: ContactSupportButtonProps): JSX.Element => {\n const { t } = useTranslation()\n const handleContactSupport = useContactSupport(supportId)\n\n return (\n <ButtonChip onClick={handleContactSupport}>\n {t('button.contactSupport')}\n </ButtonChip>\n )\n}\n"],"mappings":";;;;;AASA,MAAa,wBAAwB,EACnC,gBAC4C;CAC5C,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,uBAAuB,kBAAkB,SAAS;CAExD,OACE,oBAAC,YAAD;EAAY,SAAS;EAClB,UAAA,EAAE,uBAAuB;CAChB,CAAA;AAEhB"}
@@ -1 +1 @@
1
- {"version":3,"file":"ReceiptsCard.js","names":[],"sources":["../../../../src/pages/TransactionDetailsPage/ReceiptsCard.tsx"],"sourcesContent":["import type { RouteExtended } from '@lifi/sdk'\nimport type { JSX } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { Card } from '../../components/Card/Card.js'\nimport { CardTitle } from '../../components/Card/CardTitle.js'\nimport { StepActionsList } from '../../components/StepActions/StepActionsList.js'\n\ninterface ReceiptsCardProps {\n route: RouteExtended\n}\n\nexport const ReceiptsCard = ({ route }: ReceiptsCardProps): JSX.Element => {\n const { t } = useTranslation()\n const toAddress = route.toAddress\n\n return (\n <Card type=\"default\" indented>\n <CardTitle sx={{ padding: 0, mb: 2 }}>{t('main.receipts')}</CardTitle>\n <StepActionsList route={route} toAddress={toAddress} />\n </Card>\n )\n}\n"],"mappings":";;;;;;AAWA,MAAa,gBAAgB,EAAE,YAA4C;CACzE,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,YAAY,MAAM;CAExB,OACE,qBAAC,MAAD;EAAM,MAAK;EAAU,UAAA;YAArB,CACE,oBAAC,WAAD;GAAW,IAAI;IAAE,SAAS;IAAG,IAAI;GAAE;aAAI,EAAE,eAAe;EAAa,CAAA,GACrE,oBAAC,iBAAD;GAAwB;GAAkB;EAAY,CAAA,CAClD;;AAEV"}
1
+ {"version":3,"file":"ReceiptsCard.js","names":[],"sources":["../../../../src/pages/TransactionDetailsPage/ReceiptsCard.tsx"],"sourcesContent":["import type { RouteExtended } from '@lifi/sdk'\nimport type { JSX } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { Card } from '../../components/Card/Card.js'\nimport { CardTitle } from '../../components/Card/CardTitle.js'\nimport { StepActionsList } from '../../components/StepActions/StepActionsList.js'\n\ninterface ReceiptsCardProps {\n route: RouteExtended\n}\n\nexport const ReceiptsCard = ({ route }: ReceiptsCardProps): JSX.Element => {\n const { t } = useTranslation()\n const toAddress = route.toAddress\n\n return (\n <Card type=\"default\" indented>\n <CardTitle sx={{ padding: 0, mb: 2 }}>{t('main.receipts')}</CardTitle>\n <StepActionsList route={route} toAddress={toAddress} />\n </Card>\n )\n}\n"],"mappings":";;;;;;AAWA,MAAa,gBAAgB,EAAE,YAA4C;CACzE,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,YAAY,MAAM;CAExB,OACE,qBAAC,MAAD;EAAM,MAAK;EAAU,UAAA;EAArB,UAAA,CACE,oBAAC,WAAD;GAAW,IAAI;IAAE,SAAS;IAAG,IAAI;GAAE;GAAI,UAAA,EAAE,eAAe;EAAa,CAAA,GACrE,oBAAC,iBAAD;GAAwB;GAAkB;EAAY,CAAA,CAClD;;AAEV"}
@@ -28,7 +28,8 @@ const TransactionDetailsPage = () => {
28
28
  const { getTransactionLink } = useExplorer();
29
29
  const storedRouteExecution = useRouteExecutionStore((store) => search?.routeId ? store.routes[search.routeId] : void 0);
30
30
  const { transaction, isLoading } = useTransactionDetails(!storedRouteExecution && search?.transactionHash);
31
- useHeader(mode === "custom" ? t(`header.${modeOptions?.custom?.type ?? "checkout"}Details`) : t("header.transactionDetails"));
31
+ const title = mode === "custom" ? t(`header.${modeOptions?.custom?.type ?? "checkout"}Details`) : t("header.transactionDetails");
32
+ useHeader(title);
32
33
  const routeExecution = useMemo(() => {
33
34
  if (storedRouteExecution) return storedRouteExecution;
34
35
  if (isLoading) return;
@@ -1 +1 @@
1
- {"version":3,"file":"TransactionDetailsPage.js","names":[],"sources":["../../../../src/pages/TransactionDetailsPage/TransactionDetailsPage.tsx"],"sourcesContent":["import type { FullStatusData } from '@lifi/sdk'\nimport { useLocation, useNavigate } from '@tanstack/react-router'\nimport { useEffect, useMemo } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { ContractComponent } from '../../components/ContractComponent/ContractComponent.js'\nimport { PageContainer } from '../../components/PageContainer.js'\nimport { TransactionCard } from '../../components/TransactionCard/TransactionCard.js'\nimport { internalExplorerUrl } from '../../config/constants.js'\nimport { useExplorer } from '../../hooks/useExplorer.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useTools } from '../../hooks/useTools.js'\nimport { useTransactionDetails } from '../../hooks/useTransactionDetails.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { useRouteExecutionStore } from '../../stores/routes/RouteExecutionStore.js'\nimport { getSourceTxHash } from '../../stores/routes/utils.js'\nimport { buildRouteFromTxHistory } from '../../utils/converters.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { ReceiptsCard } from './ReceiptsCard.js'\nimport { TransactionDetailsSkeleton } from './TransactionDetailsSkeleton.js'\nimport { TransferIdCard } from './TransferIdCard.js'\n\nexport const TransactionDetailsPage: React.FC = () => {\n const { t } = useTranslation()\n const navigate = useNavigate()\n const { mode, modeOptions, contractSecondaryComponent, explorerUrls } =\n useWidgetConfig()\n const { search }: any = useLocation()\n const { tools } = useTools()\n const { getTransactionLink } = useExplorer()\n const storedRouteExecution = useRouteExecutionStore((store) =>\n search?.routeId ? store.routes[search.routeId] : undefined\n )\n const { transaction, isLoading } = useTransactionDetails(\n !storedRouteExecution && search?.transactionHash\n )\n\n const title =\n mode === 'custom'\n ? t(`header.${modeOptions?.custom?.type ?? 'checkout'}Details`)\n : t('header.transactionDetails')\n useHeader(title)\n\n const routeExecution = useMemo(() => {\n if (storedRouteExecution) {\n return storedRouteExecution\n }\n if (isLoading) {\n return\n }\n if (transaction) {\n return buildRouteFromTxHistory(transaction as FullStatusData, tools)\n }\n }, [isLoading, storedRouteExecution, tools, transaction])\n\n useEffect(() => {\n if (!isLoading && !routeExecution) {\n navigate({ to: navigationRoutes.home })\n }\n }, [isLoading, navigate, routeExecution])\n\n const explorerUrl = explorerUrls?.internal?.[0]\n const url = typeof explorerUrl === 'string' ? explorerUrl : explorerUrl?.url\n\n const sourceTxHash = getSourceTxHash(routeExecution?.route)\n let supportId = sourceTxHash ?? routeExecution?.route.id ?? ''\n\n const internalTxLink =\n routeExecution?.route?.steps?.at(-1)?.execution?.internalTxLink\n const externalTxLink =\n routeExecution?.route?.steps?.at(-1)?.execution?.externalTxLink\n\n const txLink =\n (url\n ? internalTxLink?.replace(internalExplorerUrl, url)\n : internalTxLink) ||\n externalTxLink ||\n getTransactionLink({ txHash: supportId })\n\n if (process.env.NODE_ENV === 'development') {\n supportId += `_${routeExecution?.route.id}`\n }\n\n const startedAt = new Date(\n routeExecution?.route.steps[0].execution?.startedAt ?? 0\n )\n\n if (isLoading && !storedRouteExecution) {\n return <TransactionDetailsSkeleton />\n }\n\n if (!routeExecution?.route) {\n return null\n }\n\n return (\n <PageContainer\n topGutters\n bottomGutters\n sx={{ display: 'flex', flexDirection: 'column', gap: 2 }}\n >\n <TransactionCard route={routeExecution.route} date={startedAt} />\n {mode === 'custom' && contractSecondaryComponent ? (\n <ContractComponent>{contractSecondaryComponent}</ContractComponent>\n ) : null}\n <ReceiptsCard route={routeExecution.route} />\n {supportId ? (\n <TransferIdCard transferId={supportId} txLink={txLink} />\n ) : null}\n </PageContainer>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAqBA,MAAa,+BAAyC;CACpD,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,WAAW,YAAY;CAC7B,MAAM,EAAE,MAAM,aAAa,4BAA4B,iBACrD,gBAAgB;CAClB,MAAM,EAAE,WAAgB,YAAY;CACpC,MAAM,EAAE,UAAU,SAAS;CAC3B,MAAM,EAAE,uBAAuB,YAAY;CAC3C,MAAM,uBAAuB,wBAAwB,UACnD,QAAQ,UAAU,MAAM,OAAO,OAAO,WAAW,KAAA,CACnD;CACA,MAAM,EAAE,aAAa,cAAc,sBACjC,CAAC,wBAAwB,QAAQ,eACnC;CAMA,UAHE,SAAS,WACL,EAAE,UAAU,aAAa,QAAQ,QAAQ,WAAW,QAAQ,IAC5D,EAAE,2BAA2B,CACpB;CAEf,MAAM,iBAAiB,cAAc;EACnC,IAAI,sBACF,OAAO;EAET,IAAI,WACF;EAEF,IAAI,aACF,OAAO,wBAAwB,aAA+B,KAAK;CAEvE,GAAG;EAAC;EAAW;EAAsB;EAAO;CAAW,CAAC;CAExD,gBAAgB;EACd,IAAI,CAAC,aAAa,CAAC,gBACjB,SAAS,EAAE,IAAI,iBAAiB,KAAK,CAAC;CAE1C,GAAG;EAAC;EAAW;EAAU;CAAc,CAAC;CAExC,MAAM,cAAc,cAAc,WAAW;CAC7C,MAAM,MAAM,OAAO,gBAAgB,WAAW,cAAc,aAAa;CAGzE,IAAI,YADiB,gBAAgB,gBAAgB,KAC1B,KAAK,gBAAgB,MAAM,MAAM;CAE5D,MAAM,iBACJ,gBAAgB,OAAO,OAAO,GAAG,EAAE,CAAC,EAAE,WAAW;CACnD,MAAM,iBACJ,gBAAgB,OAAO,OAAO,GAAG,EAAE,CAAC,EAAE,WAAW;CAEnD,MAAM,UACH,MACG,gBAAgB,QAAA,sBAA6B,GAAG,IAChD,mBACJ,kBACA,mBAAmB,EAAE,QAAQ,UAAU,CAAC;CAE1C,IAAI,QAAQ,IAAI,aAAa,eAC3B,aAAa,IAAI,gBAAgB,MAAM;CAGzC,MAAM,YAAY,IAAI,KACpB,gBAAgB,MAAM,MAAM,EAAE,CAAC,WAAW,aAAa,CACzD;CAEA,IAAI,aAAa,CAAC,sBAChB,OAAO,oBAAC,4BAAD,CAA6B,CAAA;CAGtC,IAAI,CAAC,gBAAgB,OACnB,OAAO;CAGT,OACE,qBAAC,eAAD;EACE,YAAA;EACA,eAAA;EACA,IAAI;GAAE,SAAS;GAAQ,eAAe;GAAU,KAAK;EAAE;YAHzD;GAKE,oBAAC,iBAAD;IAAiB,OAAO,eAAe;IAAO,MAAM;GAAY,CAAA;GAC/D,SAAS,YAAY,6BACpB,oBAAC,mBAAD,EAAA,UAAoB,2BAA8C,CAAA,IAChE;GACJ,oBAAC,cAAD,EAAc,OAAO,eAAe,MAAQ,CAAA;GAC3C,YACC,oBAAC,gBAAD;IAAgB,YAAY;IAAmB;GAAS,CAAA,IACtD;EACS;;AAEnB"}
1
+ {"version":3,"file":"TransactionDetailsPage.js","names":[],"sources":["../../../../src/pages/TransactionDetailsPage/TransactionDetailsPage.tsx"],"sourcesContent":["import type { FullStatusData } from '@lifi/sdk'\nimport { useLocation, useNavigate } from '@tanstack/react-router'\nimport { useEffect, useMemo } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { ContractComponent } from '../../components/ContractComponent/ContractComponent.js'\nimport { PageContainer } from '../../components/PageContainer.js'\nimport { TransactionCard } from '../../components/TransactionCard/TransactionCard.js'\nimport { internalExplorerUrl } from '../../config/constants.js'\nimport { useExplorer } from '../../hooks/useExplorer.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useTools } from '../../hooks/useTools.js'\nimport { useTransactionDetails } from '../../hooks/useTransactionDetails.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { useRouteExecutionStore } from '../../stores/routes/RouteExecutionStore.js'\nimport { getSourceTxHash } from '../../stores/routes/utils.js'\nimport { buildRouteFromTxHistory } from '../../utils/converters.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { ReceiptsCard } from './ReceiptsCard.js'\nimport { TransactionDetailsSkeleton } from './TransactionDetailsSkeleton.js'\nimport { TransferIdCard } from './TransferIdCard.js'\n\nexport const TransactionDetailsPage: React.FC = () => {\n const { t } = useTranslation()\n const navigate = useNavigate()\n const { mode, modeOptions, contractSecondaryComponent, explorerUrls } =\n useWidgetConfig()\n const { search }: any = useLocation()\n const { tools } = useTools()\n const { getTransactionLink } = useExplorer()\n const storedRouteExecution = useRouteExecutionStore((store) =>\n search?.routeId ? store.routes[search.routeId] : undefined\n )\n const { transaction, isLoading } = useTransactionDetails(\n !storedRouteExecution && search?.transactionHash\n )\n\n const title =\n mode === 'custom'\n ? t(`header.${modeOptions?.custom?.type ?? 'checkout'}Details`)\n : t('header.transactionDetails')\n useHeader(title)\n\n const routeExecution = useMemo(() => {\n if (storedRouteExecution) {\n return storedRouteExecution\n }\n if (isLoading) {\n return\n }\n if (transaction) {\n return buildRouteFromTxHistory(transaction as FullStatusData, tools)\n }\n }, [isLoading, storedRouteExecution, tools, transaction])\n\n useEffect(() => {\n if (!isLoading && !routeExecution) {\n navigate({ to: navigationRoutes.home })\n }\n }, [isLoading, navigate, routeExecution])\n\n const explorerUrl = explorerUrls?.internal?.[0]\n const url = typeof explorerUrl === 'string' ? explorerUrl : explorerUrl?.url\n\n const sourceTxHash = getSourceTxHash(routeExecution?.route)\n let supportId = sourceTxHash ?? routeExecution?.route.id ?? ''\n\n const internalTxLink =\n routeExecution?.route?.steps?.at(-1)?.execution?.internalTxLink\n const externalTxLink =\n routeExecution?.route?.steps?.at(-1)?.execution?.externalTxLink\n\n const txLink =\n (url\n ? internalTxLink?.replace(internalExplorerUrl, url)\n : internalTxLink) ||\n externalTxLink ||\n getTransactionLink({ txHash: supportId })\n\n if (process.env.NODE_ENV === 'development') {\n supportId += `_${routeExecution?.route.id}`\n }\n\n const startedAt = new Date(\n routeExecution?.route.steps[0].execution?.startedAt ?? 0\n )\n\n if (isLoading && !storedRouteExecution) {\n return <TransactionDetailsSkeleton />\n }\n\n if (!routeExecution?.route) {\n return null\n }\n\n return (\n <PageContainer\n topGutters\n bottomGutters\n sx={{ display: 'flex', flexDirection: 'column', gap: 2 }}\n >\n <TransactionCard route={routeExecution.route} date={startedAt} />\n {mode === 'custom' && contractSecondaryComponent ? (\n <ContractComponent>{contractSecondaryComponent}</ContractComponent>\n ) : null}\n <ReceiptsCard route={routeExecution.route} />\n {supportId ? (\n <TransferIdCard transferId={supportId} txLink={txLink} />\n ) : null}\n </PageContainer>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAqBA,MAAa,+BAAyC;CACpD,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,WAAW,YAAY;CAC7B,MAAM,EAAE,MAAM,aAAa,4BAA4B,iBACrD,gBAAgB;CAClB,MAAM,EAAE,WAAgB,YAAY;CACpC,MAAM,EAAE,UAAU,SAAS;CAC3B,MAAM,EAAE,uBAAuB,YAAY;CAC3C,MAAM,uBAAuB,wBAAwB,UACnD,QAAQ,UAAU,MAAM,OAAO,OAAO,WAAW,KAAA,CACnD;CACA,MAAM,EAAE,aAAa,cAAc,sBACjC,CAAC,wBAAwB,QAAQ,eACnC;CAEA,MAAM,QACJ,SAAS,WACL,EAAE,UAAU,aAAa,QAAQ,QAAQ,WAAW,QAAQ,IAC5D,EAAE,2BAA2B;CACnC,UAAU,KAAK;CAEf,MAAM,iBAAiB,cAAc;EACnC,IAAI,sBACF,OAAO;EAET,IAAI,WACF;EAEF,IAAI,aACF,OAAO,wBAAwB,aAA+B,KAAK;CAEvE,GAAG;EAAC;EAAW;EAAsB;EAAO;CAAW,CAAC;CAExD,gBAAgB;EACd,IAAI,CAAC,aAAa,CAAC,gBACjB,SAAS,EAAE,IAAI,iBAAiB,KAAK,CAAC;CAE1C,GAAG;EAAC;EAAW;EAAU;CAAc,CAAC;CAExC,MAAM,cAAc,cAAc,WAAW;CAC7C,MAAM,MAAM,OAAO,gBAAgB,WAAW,cAAc,aAAa;CAGzE,IAAI,YADiB,gBAAgB,gBAAgB,KAC1B,KAAK,gBAAgB,MAAM,MAAM;CAE5D,MAAM,iBACJ,gBAAgB,OAAO,OAAO,GAAG,EAAE,CAAC,EAAE,WAAW;CACnD,MAAM,iBACJ,gBAAgB,OAAO,OAAO,GAAG,EAAE,CAAC,EAAE,WAAW;CAEnD,MAAM,UACH,MACG,gBAAgB,QAAA,sBAA6B,GAAG,IAChD,mBACJ,kBACA,mBAAmB,EAAE,QAAQ,UAAU,CAAC;CAE1C,IAAI,QAAQ,IAAI,aAAa,eAC3B,aAAa,IAAI,gBAAgB,MAAM;CAGzC,MAAM,YAAY,IAAI,KACpB,gBAAgB,MAAM,MAAM,EAAE,CAAC,WAAW,aAAa,CACzD;CAEA,IAAI,aAAa,CAAC,sBAChB,OAAO,oBAAC,4BAAD,CAA6B,CAAA;CAGtC,IAAI,CAAC,gBAAgB,OACnB,OAAO;CAGT,OACE,qBAAC,eAAD;EACE,YAAA;EACA,eAAA;EACA,IAAI;GAAE,SAAS;GAAQ,eAAe;GAAU,KAAK;EAAE;EAHzD,UAAA;GAKE,oBAAC,iBAAD;IAAiB,OAAO,eAAe;IAAO,MAAM;GAAY,CAAA;GAC/D,SAAS,YAAY,6BACpB,oBAAC,mBAAD,EAAA,UAAoB,2BAA8C,CAAA,IAChE;GACJ,oBAAC,cAAD,EAAc,OAAO,eAAe,MAAQ,CAAA;GAC3C,YACC,oBAAC,gBAAD;IAAgB,YAAY;IAAmB;GAAS,CAAA,IACtD;EACS;;AAEnB"}
@@ -1 +1 @@
1
- {"version":3,"file":"TransactionDetailsSkeleton.js","names":["Card"],"sources":["../../../../src/pages/TransactionDetailsPage/TransactionDetailsSkeleton.tsx"],"sourcesContent":["import { Box, Skeleton } from '@mui/material'\nimport type { JSX } from 'react'\nimport { Card } from '../../components/Card/Card.js'\nimport { PageContainer } from '../../components/PageContainer.js'\nimport { TokenSkeleton } from '../../components/Token/Token.js'\n\nexport const TransactionDetailsSkeleton = (): JSX.Element => {\n return (\n <PageContainer topGutters>\n <Box\n sx={{\n pb: 1,\n pt: 0.75,\n display: 'flex',\n flex: 1,\n justifyContent: 'space-between',\n }}\n >\n <Skeleton width={96} height={20} variant=\"text\" />\n <Skeleton width={40} height={20} variant=\"text\" />\n </Box>\n <Card sx={{ paddingX: 2, marginBottom: 3 }}>\n <Box\n sx={{\n pt: 2.5,\n }}\n >\n <Skeleton width={64} height={12} variant=\"rounded\" />\n </Box>\n <Box\n sx={{\n py: 1,\n }}\n >\n {/* Token skeleton */}\n <Box\n sx={{\n py: 1,\n }}\n >\n <TokenSkeleton />\n </Box>\n {/* Bridge skeleton */}\n <Box\n sx={{\n py: 1,\n }}\n >\n <TokenSkeleton disableDescription />\n </Box>\n {/* Steps skeleton */}\n {Array.from({ length: 3 }).map((_, key) => (\n <Box\n key={key}\n sx={{\n py: 1,\n display: 'flex',\n alignItems: 'center',\n }}\n >\n <Skeleton\n variant=\"rounded\"\n width={40}\n height={40}\n sx={{\n borderRadius: '100%',\n }}\n />\n <Skeleton\n sx={{\n ml: 2,\n }}\n width={96}\n height={24}\n variant=\"text\"\n />\n </Box>\n ))}\n {/* Receiving Token skeleton */}\n <Box\n sx={{\n py: 1,\n }}\n >\n <TokenSkeleton />\n </Box>\n </Box>\n </Card>\n </PageContainer>\n )\n}\n"],"mappings":";;;;;;AAMA,MAAa,mCAAgD;CAC3D,OACE,qBAAC,eAAD;EAAe,YAAA;YAAf,CACE,qBAAC,KAAD;GACE,IAAI;IACF,IAAI;IACJ,IAAI;IACJ,SAAS;IACT,MAAM;IACN,gBAAgB;GAClB;aAPF,CASE,oBAAC,UAAD;IAAU,OAAO;IAAI,QAAQ;IAAI,SAAQ;GAAQ,CAAA,GACjD,oBAAC,UAAD;IAAU,OAAO;IAAI,QAAQ;IAAI,SAAQ;GAAQ,CAAA,CAC9C;MACL,qBAACA,QAAD;GAAM,IAAI;IAAE,UAAU;IAAG,cAAc;GAAE;aAAzC,CACE,oBAAC,KAAD;IACE,IAAI,EACF,IAAI,IACN;cAEA,oBAAC,UAAD;KAAU,OAAO;KAAI,QAAQ;KAAI,SAAQ;IAAW,CAAA;GACjD,CAAA,GACL,qBAAC,KAAD;IACE,IAAI,EACF,IAAI,EACN;cAHF;KAME,oBAAC,KAAD;MACE,IAAI,EACF,IAAI,EACN;gBAEA,oBAAC,eAAD,CAAgB,CAAA;KACb,CAAA;KAEL,oBAAC,KAAD;MACE,IAAI,EACF,IAAI,EACN;gBAEA,oBAAC,eAAD,EAAe,oBAAA,KAAoB,CAAA;KAChC,CAAA;KAEJ,MAAM,KAAK,EAAE,QAAQ,EAAE,CAAC,CAAC,CAAC,KAAK,GAAG,QACjC,qBAAC,KAAD;MAEE,IAAI;OACF,IAAI;OACJ,SAAS;OACT,YAAY;MACd;gBANF,CAQE,oBAAC,UAAD;OACE,SAAQ;OACR,OAAO;OACP,QAAQ;OACR,IAAI,EACF,cAAc,OAChB;MACD,CAAA,GACD,oBAAC,UAAD;OACE,IAAI,EACF,IAAI,EACN;OACA,OAAO;OACP,QAAQ;OACR,SAAQ;MACT,CAAA,CACE;QAvBE,GAuBF,CACN;KAED,oBAAC,KAAD;MACE,IAAI,EACF,IAAI,EACN;gBAEA,oBAAC,eAAD,CAAgB,CAAA;KACb,CAAA;IACF;KACD;IACO;;AAEnB"}
1
+ {"version":3,"file":"TransactionDetailsSkeleton.js","names":["Card"],"sources":["../../../../src/pages/TransactionDetailsPage/TransactionDetailsSkeleton.tsx"],"sourcesContent":["import { Box, Skeleton } from '@mui/material'\nimport type { JSX } from 'react'\nimport { Card } from '../../components/Card/Card.js'\nimport { PageContainer } from '../../components/PageContainer.js'\nimport { TokenSkeleton } from '../../components/Token/Token.js'\n\nexport const TransactionDetailsSkeleton = (): JSX.Element => {\n return (\n <PageContainer topGutters>\n <Box\n sx={{\n pb: 1,\n pt: 0.75,\n display: 'flex',\n flex: 1,\n justifyContent: 'space-between',\n }}\n >\n <Skeleton width={96} height={20} variant=\"text\" />\n <Skeleton width={40} height={20} variant=\"text\" />\n </Box>\n <Card sx={{ paddingX: 2, marginBottom: 3 }}>\n <Box\n sx={{\n pt: 2.5,\n }}\n >\n <Skeleton width={64} height={12} variant=\"rounded\" />\n </Box>\n <Box\n sx={{\n py: 1,\n }}\n >\n {/* Token skeleton */}\n <Box\n sx={{\n py: 1,\n }}\n >\n <TokenSkeleton />\n </Box>\n {/* Bridge skeleton */}\n <Box\n sx={{\n py: 1,\n }}\n >\n <TokenSkeleton disableDescription />\n </Box>\n {/* Steps skeleton */}\n {Array.from({ length: 3 }).map((_, key) => (\n <Box\n key={key}\n sx={{\n py: 1,\n display: 'flex',\n alignItems: 'center',\n }}\n >\n <Skeleton\n variant=\"rounded\"\n width={40}\n height={40}\n sx={{\n borderRadius: '100%',\n }}\n />\n <Skeleton\n sx={{\n ml: 2,\n }}\n width={96}\n height={24}\n variant=\"text\"\n />\n </Box>\n ))}\n {/* Receiving Token skeleton */}\n <Box\n sx={{\n py: 1,\n }}\n >\n <TokenSkeleton />\n </Box>\n </Box>\n </Card>\n </PageContainer>\n )\n}\n"],"mappings":";;;;;;AAMA,MAAa,mCAAgD;CAC3D,OACE,qBAAC,eAAD;EAAe,YAAA;EAAf,UAAA,CACE,qBAAC,KAAD;GACE,IAAI;IACF,IAAI;IACJ,IAAI;IACJ,SAAS;IACT,MAAM;IACN,gBAAgB;GAClB;GAPF,UAAA,CASE,oBAAC,UAAD;IAAU,OAAO;IAAI,QAAQ;IAAI,SAAQ;GAAQ,CAAA,GACjD,oBAAC,UAAD;IAAU,OAAO;IAAI,QAAQ;IAAI,SAAQ;GAAQ,CAAA,CAC9C;EACL,CAAA,GAAA,qBAACA,QAAD;GAAM,IAAI;IAAE,UAAU;IAAG,cAAc;GAAE;GAAzC,UAAA,CACE,oBAAC,KAAD;IACE,IAAI,EACF,IAAI,IACN;IAEA,UAAA,oBAAC,UAAD;KAAU,OAAO;KAAI,QAAQ;KAAI,SAAQ;IAAW,CAAA;GACjD,CAAA,GACL,qBAAC,KAAD;IACE,IAAI,EACF,IAAI,EACN;IAHF,UAAA;KAME,oBAAC,KAAD;MACE,IAAI,EACF,IAAI,EACN;MAEA,UAAA,oBAAC,eAAD,CAAgB,CAAA;KACb,CAAA;KAEL,oBAAC,KAAD;MACE,IAAI,EACF,IAAI,EACN;MAEA,UAAA,oBAAC,eAAD,EAAe,oBAAA,KAAoB,CAAA;KAChC,CAAA;KAEJ,MAAM,KAAK,EAAE,QAAQ,EAAE,CAAC,CAAC,CAAC,KAAK,GAAG,QACjC,qBAAC,KAAD;MAEE,IAAI;OACF,IAAI;OACJ,SAAS;OACT,YAAY;MACd;MANF,UAAA,CAQE,oBAAC,UAAD;OACE,SAAQ;OACR,OAAO;OACP,QAAQ;OACR,IAAI,EACF,cAAc,OAChB;MACD,CAAA,GACD,oBAAC,UAAD;OACE,IAAI,EACF,IAAI,EACN;OACA,OAAO;OACP,QAAQ;OACR,SAAQ;MACT,CAAA,CACE;KAvBE,GAAA,GAuBF,CACN;KAED,oBAAC,KAAD;MACE,IAAI,EACF,IAAI,EACN;MAEA,UAAA,oBAAC,eAAD,CAAgB,CAAA;KACb,CAAA;IACF;GACD,CAAA,CAAA;EACO,CAAA,CAAA;;AAEnB"}
@@ -1 +1 @@
1
- {"version":3,"file":"TransferIdCard.js","names":["Card"],"sources":["../../../../src/pages/TransactionDetailsPage/TransferIdCard.tsx"],"sourcesContent":["import ContentCopyRounded from '@mui/icons-material/ContentCopyRounded'\nimport OpenInNew from '@mui/icons-material/OpenInNew'\nimport { Box, Typography } from '@mui/material'\nimport type { JSX } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { Card } from '../../components/Card/Card.js'\nimport { CardIconButton } from '../../components/Card/CardIconButton.js'\nimport { CardTitle } from '../../components/Card/CardTitle.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { ContactSupportButton } from './ContactSupportButton.js'\n\ninterface TransferIdCardProps {\n transferId: string\n txLink?: string\n}\n\nexport const TransferIdCard = ({\n transferId,\n txLink,\n}: TransferIdCardProps): JSX.Element => {\n const { t } = useTranslation()\n const { hiddenUI } = useWidgetConfig()\n\n const copyTransferId = async () => {\n await navigator.clipboard.writeText(transferId)\n }\n\n const openTransferIdInExplorer = () => {\n window.open(txLink, '_blank')\n }\n\n return (\n <Card type=\"default\" indented>\n <Box\n sx={{\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'space-between',\n }}\n >\n <CardTitle sx={{ p: 0 }}>{t('main.transferId')}</CardTitle>\n <Box\n sx={{\n gap: 1,\n display: 'flex',\n }}\n >\n <CardIconButton size=\"small\" onClick={copyTransferId}>\n <ContentCopyRounded fontSize=\"inherit\" />\n </CardIconButton>\n {txLink ? (\n <CardIconButton size=\"small\" onClick={openTransferIdInExplorer}>\n <OpenInNew fontSize=\"inherit\" />\n </CardIconButton>\n ) : null}\n {!hiddenUI?.contactSupport ? (\n <ContactSupportButton supportId={transferId} />\n ) : null}\n </Box>\n </Box>\n <Typography\n variant=\"body2\"\n sx={{\n pt: 2,\n wordBreak: 'break-all',\n }}\n >\n {transferId}\n </Typography>\n </Card>\n )\n}\n"],"mappings":";;;;;;;;;;;AAgBA,MAAa,kBAAkB,EAC7B,YACA,aACsC;CACtC,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,EAAE,aAAa,gBAAgB;CAErC,MAAM,iBAAiB,YAAY;EACjC,MAAM,UAAU,UAAU,UAAU,UAAU;CAChD;CAEA,MAAM,iCAAiC;EACrC,OAAO,KAAK,QAAQ,QAAQ;CAC9B;CAEA,OACE,qBAACA,QAAD;EAAM,MAAK;EAAU,UAAA;YAArB,CACE,qBAAC,KAAD;GACE,IAAI;IACF,SAAS;IACT,YAAY;IACZ,gBAAgB;GAClB;aALF,CAOE,oBAAC,WAAD;IAAW,IAAI,EAAE,GAAG,EAAE;cAAI,EAAE,iBAAiB;GAAa,CAAA,GAC1D,qBAAC,KAAD;IACE,IAAI;KACF,KAAK;KACL,SAAS;IACX;cAJF;KAME,oBAAC,gBAAD;MAAgB,MAAK;MAAQ,SAAS;gBACpC,oBAAC,oBAAD,EAAoB,UAAS,UAAW,CAAA;KAC1B,CAAA;KACf,SACC,oBAAC,gBAAD;MAAgB,MAAK;MAAQ,SAAS;gBACpC,oBAAC,WAAD,EAAW,UAAS,UAAW,CAAA;KACjB,CAAA,IACd;KACH,CAAC,UAAU,iBACV,oBAAC,sBAAD,EAAsB,WAAW,WAAa,CAAA,IAC5C;IACD;KACF;MACL,oBAAC,YAAD;GACE,SAAQ;GACR,IAAI;IACF,IAAI;IACJ,WAAW;GACb;aAEC;EACS,CAAA,CACR;;AAEV"}
1
+ {"version":3,"file":"TransferIdCard.js","names":["Card"],"sources":["../../../../src/pages/TransactionDetailsPage/TransferIdCard.tsx"],"sourcesContent":["import ContentCopyRounded from '@mui/icons-material/ContentCopyRounded'\nimport OpenInNew from '@mui/icons-material/OpenInNew'\nimport { Box, Typography } from '@mui/material'\nimport type { JSX } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { Card } from '../../components/Card/Card.js'\nimport { CardIconButton } from '../../components/Card/CardIconButton.js'\nimport { CardTitle } from '../../components/Card/CardTitle.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { ContactSupportButton } from './ContactSupportButton.js'\n\ninterface TransferIdCardProps {\n transferId: string\n txLink?: string\n}\n\nexport const TransferIdCard = ({\n transferId,\n txLink,\n}: TransferIdCardProps): JSX.Element => {\n const { t } = useTranslation()\n const { hiddenUI } = useWidgetConfig()\n\n const copyTransferId = async () => {\n await navigator.clipboard.writeText(transferId)\n }\n\n const openTransferIdInExplorer = () => {\n window.open(txLink, '_blank')\n }\n\n return (\n <Card type=\"default\" indented>\n <Box\n sx={{\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'space-between',\n }}\n >\n <CardTitle sx={{ p: 0 }}>{t('main.transferId')}</CardTitle>\n <Box\n sx={{\n gap: 1,\n display: 'flex',\n }}\n >\n <CardIconButton size=\"small\" onClick={copyTransferId}>\n <ContentCopyRounded fontSize=\"inherit\" />\n </CardIconButton>\n {txLink ? (\n <CardIconButton size=\"small\" onClick={openTransferIdInExplorer}>\n <OpenInNew fontSize=\"inherit\" />\n </CardIconButton>\n ) : null}\n {!hiddenUI?.contactSupport ? (\n <ContactSupportButton supportId={transferId} />\n ) : null}\n </Box>\n </Box>\n <Typography\n variant=\"body2\"\n sx={{\n pt: 2,\n wordBreak: 'break-all',\n }}\n >\n {transferId}\n </Typography>\n </Card>\n )\n}\n"],"mappings":";;;;;;;;;;;AAgBA,MAAa,kBAAkB,EAC7B,YACA,aACsC;CACtC,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,EAAE,aAAa,gBAAgB;CAErC,MAAM,iBAAiB,YAAY;EACjC,MAAM,UAAU,UAAU,UAAU,UAAU;CAChD;CAEA,MAAM,iCAAiC;EACrC,OAAO,KAAK,QAAQ,QAAQ;CAC9B;CAEA,OACE,qBAACA,QAAD;EAAM,MAAK;EAAU,UAAA;EAArB,UAAA,CACE,qBAAC,KAAD;GACE,IAAI;IACF,SAAS;IACT,YAAY;IACZ,gBAAgB;GAClB;GALF,UAAA,CAOE,oBAAC,WAAD;IAAW,IAAI,EAAE,GAAG,EAAE;IAAI,UAAA,EAAE,iBAAiB;GAAa,CAAA,GAC1D,qBAAC,KAAD;IACE,IAAI;KACF,KAAK;KACL,SAAS;IACX;IAJF,UAAA;KAME,oBAAC,gBAAD;MAAgB,MAAK;MAAQ,SAAS;MACpC,UAAA,oBAAC,oBAAD,EAAoB,UAAS,UAAW,CAAA;KAC1B,CAAA;KACf,SACC,oBAAC,gBAAD;MAAgB,MAAK;MAAQ,SAAS;MACpC,UAAA,oBAAC,WAAD,EAAW,UAAS,UAAW,CAAA;KACjB,CAAA,IACd;KACH,CAAC,UAAU,iBACV,oBAAC,sBAAD,EAAsB,WAAW,WAAa,CAAA,IAC5C;IACD;GACF,CAAA,CAAA;EACL,CAAA,GAAA,oBAAC,YAAD;GACE,SAAQ;GACR,IAAI;IACF,IAAI;IACJ,WAAW;GACb;GAEC,UAAA;EACS,CAAA,CACR;;AAEV"}
@@ -1 +1 @@
1
- {"version":3,"file":"ConfirmToAddressSheet.js","names":[],"sources":["../../../../src/pages/TransactionPage/ConfirmToAddressSheet.tsx"],"sourcesContent":["import Wallet from '@mui/icons-material/Wallet'\nimport WarningRounded from '@mui/icons-material/WarningRounded'\nimport { Button, Typography } from '@mui/material'\nimport type { JSX, Ref, RefObject } from 'react'\nimport { useRef } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { BottomSheet } from '../../components/BottomSheet/BottomSheet.js'\nimport type { BottomSheetBase } from '../../components/BottomSheet/types.js'\nimport { AlertMessage } from '../../components/Messages/AlertMessage.js'\nimport { useChain } from '../../hooks/useChain.js'\nimport { useSetContentHeight } from '../../hooks/useSetContentHeight.js'\nimport { useWidgetEvents } from '../../hooks/useWidgetEvents.js'\nimport { WidgetEvent } from '../../types/events.js'\nimport {\n IconContainer,\n SendToWalletButtonRow,\n SendToWalletSheetContainer,\n SheetAddressContainer,\n} from '../SendToWallet/SendToWalletPage.style.js'\n\ninterface ConfirmToAddressSheetProps {\n onContinue: () => void\n toAddress: string\n toChainId: number\n}\n\ninterface ConfirmToAddressSheetContentProps extends ConfirmToAddressSheetProps {\n onClose: () => void\n}\n\nexport const ConfirmToAddressSheet = ({\n ref,\n ...props\n}: ConfirmToAddressSheetProps & {\n ref?: Ref<BottomSheetBase>\n}): JSX.Element => {\n const handleClose = () => {\n ;(ref as RefObject<BottomSheetBase>).current?.close()\n }\n\n return (\n <BottomSheet ref={ref}>\n <ConfirmToAddressSheetContent {...props} onClose={handleClose} />\n </BottomSheet>\n )\n}\n\nconst ConfirmToAddressSheetContent: React.FC<\n ConfirmToAddressSheetContentProps\n> = ({ onContinue, onClose, toAddress, toChainId }) => {\n const { t } = useTranslation()\n const { chain } = useChain(toChainId)\n const emitter = useWidgetEvents()\n const ref = useRef<HTMLElement>(null)\n useSetContentHeight(ref)\n\n const handleContinue = () => {\n emitter.emit(WidgetEvent.LowAddressActivityConfirmed, {\n address: toAddress,\n chainId: toChainId,\n })\n onClose()\n onContinue()\n }\n\n return (\n <SendToWalletSheetContainer ref={ref}>\n <IconContainer>\n <Wallet sx={{ fontSize: 40 }} />\n </IconContainer>\n <Typography variant=\"h6\" sx={{ textAlign: 'center', mb: 2 }}>\n {t('warning.title.lowAddressActivity')}\n </Typography>\n <SheetAddressContainer>\n <Typography>{toAddress}</Typography>\n </SheetAddressContainer>\n <AlertMessage\n severity=\"warning\"\n title={\n <Typography variant=\"body2\" sx={{ color: 'text.primary' }}>\n {t('warning.message.lowAddressActivity', {\n chainName: chain?.name,\n })}\n </Typography>\n }\n icon={<WarningRounded />}\n multiline\n />\n <SendToWalletButtonRow>\n <Button variant=\"text\" onClick={onClose} fullWidth>\n {t('button.cancel')}\n </Button>\n <Button variant=\"contained\" onClick={handleContinue} fullWidth>\n {t('button.continue')}\n </Button>\n </SendToWalletButtonRow>\n </SendToWalletSheetContainer>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;AA8BA,MAAa,yBAAyB,EACpC,KACA,GAAG,YAGc;CACjB,MAAM,oBAAoB;EACvB,IAAoC,SAAS,MAAM;CACtD;CAEA,OACE,oBAAC,aAAD;EAAkB;YAChB,oBAAC,8BAAD;GAA8B,GAAI;GAAO,SAAS;EAAc,CAAA;CACrD,CAAA;AAEjB;AAEA,MAAM,gCAED,EAAE,YAAY,SAAS,WAAW,gBAAgB;CACrD,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,EAAE,UAAU,SAAS,SAAS;CACpC,MAAM,UAAU,gBAAgB;CAChC,MAAM,MAAM,OAAoB,IAAI;CACpC,oBAAoB,GAAG;CAEvB,MAAM,uBAAuB;EAC3B,QAAQ,KAAA,+BAA8C;GACpD,SAAS;GACT,SAAS;EACX,CAAC;EACD,QAAQ;EACR,WAAW;CACb;CAEA,OACE,qBAAC,4BAAD;EAAiC;YAAjC;GACE,oBAAC,eAAD,EAAA,UACE,oBAAC,QAAD,EAAQ,IAAI,EAAE,UAAU,GAAG,EAAI,CAAA,EAClB,CAAA;GACf,oBAAC,YAAD;IAAY,SAAQ;IAAK,IAAI;KAAE,WAAW;KAAU,IAAI;IAAE;cACvD,EAAE,kCAAkC;GAC3B,CAAA;GACZ,oBAAC,uBAAD,EAAA,UACE,oBAAC,YAAD,EAAA,UAAa,UAAsB,CAAA,EACd,CAAA;GACvB,oBAAC,cAAD;IACE,UAAS;IACT,OACE,oBAAC,YAAD;KAAY,SAAQ;KAAQ,IAAI,EAAE,OAAO,eAAe;eACrD,EAAE,sCAAsC,EACvC,WAAW,OAAO,KACpB,CAAC;IACS,CAAA;IAEd,MAAM,oBAAC,gBAAD,CAAiB,CAAA;IACvB,WAAA;GACD,CAAA;GACD,qBAAC,uBAAD,EAAA,UAAA,CACE,oBAAC,QAAD;IAAQ,SAAQ;IAAO,SAAS;IAAS,WAAA;cACtC,EAAE,eAAe;GACZ,CAAA,GACR,oBAAC,QAAD;IAAQ,SAAQ;IAAY,SAAS;IAAgB,WAAA;cAClD,EAAE,iBAAiB;GACd,CAAA,CACa,EAAA,CAAA;EACG;;AAEhC"}
1
+ {"version":3,"file":"ConfirmToAddressSheet.js","names":[],"sources":["../../../../src/pages/TransactionPage/ConfirmToAddressSheet.tsx"],"sourcesContent":["import Wallet from '@mui/icons-material/Wallet'\nimport WarningRounded from '@mui/icons-material/WarningRounded'\nimport { Button, Typography } from '@mui/material'\nimport type { JSX, Ref, RefObject } from 'react'\nimport { useRef } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { BottomSheet } from '../../components/BottomSheet/BottomSheet.js'\nimport type { BottomSheetBase } from '../../components/BottomSheet/types.js'\nimport { AlertMessage } from '../../components/Messages/AlertMessage.js'\nimport { useChain } from '../../hooks/useChain.js'\nimport { useSetContentHeight } from '../../hooks/useSetContentHeight.js'\nimport { useWidgetEvents } from '../../hooks/useWidgetEvents.js'\nimport { WidgetEvent } from '../../types/events.js'\nimport {\n IconContainer,\n SendToWalletButtonRow,\n SendToWalletSheetContainer,\n SheetAddressContainer,\n} from '../SendToWallet/SendToWalletPage.style.js'\n\ninterface ConfirmToAddressSheetProps {\n onContinue: () => void\n toAddress: string\n toChainId: number\n}\n\ninterface ConfirmToAddressSheetContentProps extends ConfirmToAddressSheetProps {\n onClose: () => void\n}\n\nexport const ConfirmToAddressSheet = ({\n ref,\n ...props\n}: ConfirmToAddressSheetProps & {\n ref?: Ref<BottomSheetBase>\n}): JSX.Element => {\n const handleClose = () => {\n ;(ref as RefObject<BottomSheetBase>).current?.close()\n }\n\n return (\n <BottomSheet ref={ref}>\n <ConfirmToAddressSheetContent {...props} onClose={handleClose} />\n </BottomSheet>\n )\n}\n\nconst ConfirmToAddressSheetContent: React.FC<\n ConfirmToAddressSheetContentProps\n> = ({ onContinue, onClose, toAddress, toChainId }) => {\n const { t } = useTranslation()\n const { chain } = useChain(toChainId)\n const emitter = useWidgetEvents()\n const ref = useRef<HTMLElement>(null)\n useSetContentHeight(ref)\n\n const handleContinue = () => {\n emitter.emit(WidgetEvent.LowAddressActivityConfirmed, {\n address: toAddress,\n chainId: toChainId,\n })\n onClose()\n onContinue()\n }\n\n return (\n <SendToWalletSheetContainer ref={ref}>\n <IconContainer>\n <Wallet sx={{ fontSize: 40 }} />\n </IconContainer>\n <Typography variant=\"h6\" sx={{ textAlign: 'center', mb: 2 }}>\n {t('warning.title.lowAddressActivity')}\n </Typography>\n <SheetAddressContainer>\n <Typography>{toAddress}</Typography>\n </SheetAddressContainer>\n <AlertMessage\n severity=\"warning\"\n title={\n <Typography variant=\"body2\" sx={{ color: 'text.primary' }}>\n {t('warning.message.lowAddressActivity', {\n chainName: chain?.name,\n })}\n </Typography>\n }\n icon={<WarningRounded />}\n multiline\n />\n <SendToWalletButtonRow>\n <Button variant=\"text\" onClick={onClose} fullWidth>\n {t('button.cancel')}\n </Button>\n <Button variant=\"contained\" onClick={handleContinue} fullWidth>\n {t('button.continue')}\n </Button>\n </SendToWalletButtonRow>\n </SendToWalletSheetContainer>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;AA8BA,MAAa,yBAAyB,EACpC,KACA,GAAG,YAGc;CACjB,MAAM,oBAAoB;EACvB,IAAoC,SAAS,MAAM;CACtD;CAEA,OACE,oBAAC,aAAD;EAAkB;EAChB,UAAA,oBAAC,8BAAD;GAA8B,GAAI;GAAO,SAAS;EAAc,CAAA;CACrD,CAAA;AAEjB;AAEA,MAAM,gCAED,EAAE,YAAY,SAAS,WAAW,gBAAgB;CACrD,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,EAAE,UAAU,SAAS,SAAS;CACpC,MAAM,UAAU,gBAAgB;CAChC,MAAM,MAAM,OAAoB,IAAI;CACpC,oBAAoB,GAAG;CAEvB,MAAM,uBAAuB;EAC3B,QAAQ,KAAA,+BAA8C;GACpD,SAAS;GACT,SAAS;EACX,CAAC;EACD,QAAQ;EACR,WAAW;CACb;CAEA,OACE,qBAAC,4BAAD;EAAiC;EAAjC,UAAA;GACE,oBAAC,eAAD,EAAA,UACE,oBAAC,QAAD,EAAQ,IAAI,EAAE,UAAU,GAAG,EAAI,CAAA,EAClB,CAAA;GACf,oBAAC,YAAD;IAAY,SAAQ;IAAK,IAAI;KAAE,WAAW;KAAU,IAAI;IAAE;IACvD,UAAA,EAAE,kCAAkC;GAC3B,CAAA;GACZ,oBAAC,uBAAD,EAAA,UACE,oBAAC,YAAD,EAAA,UAAa,UAAsB,CAAA,EACd,CAAA;GACvB,oBAAC,cAAD;IACE,UAAS;IACT,OACE,oBAAC,YAAD;KAAY,SAAQ;KAAQ,IAAI,EAAE,OAAO,eAAe;KACrD,UAAA,EAAE,sCAAsC,EACvC,WAAW,OAAO,KACpB,CAAC;IACS,CAAA;IAEd,MAAM,oBAAC,gBAAD,CAAiB,CAAA;IACvB,WAAA;GACD,CAAA;GACD,qBAAC,uBAAD,EAAA,UAAA,CACE,oBAAC,QAAD;IAAQ,SAAQ;IAAO,SAAS;IAAS,WAAA;IACtC,UAAA,EAAE,eAAe;GACZ,CAAA,GACR,oBAAC,QAAD;IAAQ,SAAQ;IAAY,SAAS;IAAgB,WAAA;IAClD,UAAA,EAAE,iBAAiB;GACd,CAAA,CACa,EAAA,CAAA;EACG;;AAEhC"}
@@ -1 +1 @@
1
- {"version":3,"file":"ExchangeRateBottomSheet.js","names":[],"sources":["../../../../src/pages/TransactionPage/ExchangeRateBottomSheet.tsx"],"sourcesContent":["import type { ExchangeRateUpdateParams } from '@lifi/sdk'\nimport { Box, Button, Typography } from '@mui/material'\nimport type { JSX, Ref } from 'react'\nimport { useCallback, useImperativeHandle, useRef, useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { BottomSheet } from '../../components/BottomSheet/BottomSheet.js'\nimport type { BottomSheetBase } from '../../components/BottomSheet/types.js'\nimport { IconCircle } from '../../components/IconCircle/IconCircle.js'\nimport { useSetContentHeight } from '../../hooks/useSetContentHeight.js'\nimport { formatTokenAmount } from '../../utils/format.js'\nimport { CenterContainer } from './ExchangeRateBottomSheet.style.js'\n\nexport interface ExchangeRateBottomSheetBase {\n isOpen(): void\n open(resolver: (value: boolean) => void, data: ExchangeRateUpdateParams): void\n close(value?: boolean, bottomSheetClose?: boolean): void\n}\n\ninterface ExchangeRateBottomSheetProps {\n data?: ExchangeRateUpdateParams\n onContinue?(): void\n onCancel?(): void\n}\n\nexport const ExchangeRateBottomSheet = ({\n onContinue,\n onCancel,\n ref,\n}: ExchangeRateBottomSheetProps & {\n ref?: Ref<ExchangeRateBottomSheetBase>\n}): JSX.Element => {\n const [data, setData] = useState<ExchangeRateUpdateParams>()\n const bottomSheetRef = useRef<BottomSheetBase>(null)\n const resolverRef = useRef<(value: boolean) => void>(null)\n\n const close = useCallback((value = false, bottomSheetClose = true) => {\n resolverRef.current?.(value)\n if (bottomSheetClose) {\n bottomSheetRef.current?.close()\n }\n }, [])\n\n const handleContinue = useCallback(() => {\n close(true)\n onContinue?.()\n }, [close, onContinue])\n\n const handleCancel = useCallback(() => {\n close(false)\n onCancel?.()\n }, [close, onCancel])\n\n const handleClose = useCallback(() => {\n close(false, false)\n onCancel?.()\n }, [close, onCancel])\n\n useImperativeHandle(\n ref,\n () => ({\n isOpen: () => bottomSheetRef.current?.isOpen(),\n open: (resolver, data) => {\n setData(data)\n resolverRef.current = resolver\n bottomSheetRef.current?.open()\n },\n close,\n }),\n [close]\n )\n\n return (\n <BottomSheet ref={bottomSheetRef} onClose={handleClose}>\n <ExchangeRateBottomSheetContent\n data={data}\n onContinue={handleContinue}\n onCancel={handleCancel}\n />\n </BottomSheet>\n )\n}\n\nconst ExchangeRateBottomSheetContent: React.FC<\n ExchangeRateBottomSheetProps\n> = ({ data, onCancel, onContinue }) => {\n const { t } = useTranslation()\n const ref = useRef<HTMLElement>(null)\n useSetContentHeight(ref)\n\n if (!data) {\n return\n }\n\n const oldAmount = BigInt(data.oldToAmount || 1)\n const rateChange = (\n (Number((BigInt(data.newToAmount || 0) * 1_000_000n) / oldAmount) /\n 1_000_000) *\n 100 -\n 100\n ).toFixed(2)\n\n return (\n <Box\n ref={ref}\n sx={{\n p: 3,\n }}\n >\n <CenterContainer>\n <IconCircle status=\"warning\" sx={{ mb: 1 }} />\n <Typography\n sx={{\n py: 1,\n fontSize: 18,\n fontWeight: 700,\n }}\n >\n {t('warning.title.rateChanged')}\n </Typography>\n </CenterContainer>\n <Typography\n sx={{\n py: 1,\n }}\n >\n {t('warning.message.rateChanged')}\n </Typography>\n <Box\n sx={{\n display: 'flex',\n justifyContent: 'space-between',\n mt: 1,\n }}\n >\n <Typography>{t('main.quotedAmount')}</Typography>\n <Typography\n sx={{\n fontWeight: 600,\n }}\n >\n {t('format.tokenAmount', {\n value: formatTokenAmount(\n BigInt(data.oldToAmount),\n data.toToken.decimals\n ),\n })}{' '}\n {data?.toToken.symbol}\n </Typography>\n </Box>\n <Box\n sx={{\n display: 'flex',\n justifyContent: 'space-between',\n mt: 0.25,\n }}\n >\n <Typography>{t('main.currentAmount')}</Typography>\n <Typography\n sx={{\n fontWeight: 600,\n }}\n >\n {t('format.tokenAmount', {\n value: formatTokenAmount(\n BigInt(data?.newToAmount),\n data?.toToken.decimals\n ),\n })}{' '}\n {data?.toToken.symbol}\n </Typography>\n </Box>\n <Box\n sx={{\n display: 'flex',\n justifyContent: 'space-between',\n mt: 0.25,\n }}\n >\n <Typography>{t('main.rateChange')}</Typography>\n <Typography\n sx={{\n fontWeight: 600,\n }}\n >\n {rateChange}%\n </Typography>\n </Box>\n <Box\n sx={{\n display: 'flex',\n mt: 3,\n }}\n >\n <Button variant=\"text\" onClick={onCancel} fullWidth>\n {t('button.cancel')}\n </Button>\n <Box\n sx={{\n display: 'flex',\n p: 1,\n }}\n />\n <Button variant=\"contained\" onClick={onContinue} fullWidth>\n {t('button.continue')}\n </Button>\n </Box>\n </Box>\n )\n}\n"],"mappings":"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"}
1
+ {"version":3,"file":"ExchangeRateBottomSheet.js","names":[],"sources":["../../../../src/pages/TransactionPage/ExchangeRateBottomSheet.tsx"],"sourcesContent":["import type { ExchangeRateUpdateParams } from '@lifi/sdk'\nimport { Box, Button, Typography } from '@mui/material'\nimport type { JSX, Ref } from 'react'\nimport { useCallback, useImperativeHandle, useRef, useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { BottomSheet } from '../../components/BottomSheet/BottomSheet.js'\nimport type { BottomSheetBase } from '../../components/BottomSheet/types.js'\nimport { IconCircle } from '../../components/IconCircle/IconCircle.js'\nimport { useSetContentHeight } from '../../hooks/useSetContentHeight.js'\nimport { formatTokenAmount } from '../../utils/format.js'\nimport { CenterContainer } from './ExchangeRateBottomSheet.style.js'\n\nexport interface ExchangeRateBottomSheetBase {\n isOpen(): void\n open(resolver: (value: boolean) => void, data: ExchangeRateUpdateParams): void\n close(value?: boolean, bottomSheetClose?: boolean): void\n}\n\ninterface ExchangeRateBottomSheetProps {\n data?: ExchangeRateUpdateParams\n onContinue?(): void\n onCancel?(): void\n}\n\nexport const ExchangeRateBottomSheet = ({\n onContinue,\n onCancel,\n ref,\n}: ExchangeRateBottomSheetProps & {\n ref?: Ref<ExchangeRateBottomSheetBase>\n}): JSX.Element => {\n const [data, setData] = useState<ExchangeRateUpdateParams>()\n const bottomSheetRef = useRef<BottomSheetBase>(null)\n const resolverRef = useRef<(value: boolean) => void>(null)\n\n const close = useCallback((value = false, bottomSheetClose = true) => {\n resolverRef.current?.(value)\n if (bottomSheetClose) {\n bottomSheetRef.current?.close()\n }\n }, [])\n\n const handleContinue = useCallback(() => {\n close(true)\n onContinue?.()\n }, [close, onContinue])\n\n const handleCancel = useCallback(() => {\n close(false)\n onCancel?.()\n }, [close, onCancel])\n\n const handleClose = useCallback(() => {\n close(false, false)\n onCancel?.()\n }, [close, onCancel])\n\n useImperativeHandle(\n ref,\n () => ({\n isOpen: () => bottomSheetRef.current?.isOpen(),\n open: (resolver, data) => {\n setData(data)\n resolverRef.current = resolver\n bottomSheetRef.current?.open()\n },\n close,\n }),\n [close]\n )\n\n return (\n <BottomSheet ref={bottomSheetRef} onClose={handleClose}>\n <ExchangeRateBottomSheetContent\n data={data}\n onContinue={handleContinue}\n onCancel={handleCancel}\n />\n </BottomSheet>\n )\n}\n\nconst ExchangeRateBottomSheetContent: React.FC<\n ExchangeRateBottomSheetProps\n> = ({ data, onCancel, onContinue }) => {\n const { t } = useTranslation()\n const ref = useRef<HTMLElement>(null)\n useSetContentHeight(ref)\n\n if (!data) {\n return\n }\n\n const oldAmount = BigInt(data.oldToAmount || 1)\n const rateChange = (\n (Number((BigInt(data.newToAmount || 0) * 1_000_000n) / oldAmount) /\n 1_000_000) *\n 100 -\n 100\n ).toFixed(2)\n\n return (\n <Box\n ref={ref}\n sx={{\n p: 3,\n }}\n >\n <CenterContainer>\n <IconCircle status=\"warning\" sx={{ mb: 1 }} />\n <Typography\n sx={{\n py: 1,\n fontSize: 18,\n fontWeight: 700,\n }}\n >\n {t('warning.title.rateChanged')}\n </Typography>\n </CenterContainer>\n <Typography\n sx={{\n py: 1,\n }}\n >\n {t('warning.message.rateChanged')}\n </Typography>\n <Box\n sx={{\n display: 'flex',\n justifyContent: 'space-between',\n mt: 1,\n }}\n >\n <Typography>{t('main.quotedAmount')}</Typography>\n <Typography\n sx={{\n fontWeight: 600,\n }}\n >\n {t('format.tokenAmount', {\n value: formatTokenAmount(\n BigInt(data.oldToAmount),\n data.toToken.decimals\n ),\n })}{' '}\n {data?.toToken.symbol}\n </Typography>\n </Box>\n <Box\n sx={{\n display: 'flex',\n justifyContent: 'space-between',\n mt: 0.25,\n }}\n >\n <Typography>{t('main.currentAmount')}</Typography>\n <Typography\n sx={{\n fontWeight: 600,\n }}\n >\n {t('format.tokenAmount', {\n value: formatTokenAmount(\n BigInt(data?.newToAmount),\n data?.toToken.decimals\n ),\n })}{' '}\n {data?.toToken.symbol}\n </Typography>\n </Box>\n <Box\n sx={{\n display: 'flex',\n justifyContent: 'space-between',\n mt: 0.25,\n }}\n >\n <Typography>{t('main.rateChange')}</Typography>\n <Typography\n sx={{\n fontWeight: 600,\n }}\n >\n {rateChange}%\n </Typography>\n </Box>\n <Box\n sx={{\n display: 'flex',\n mt: 3,\n }}\n >\n <Button variant=\"text\" onClick={onCancel} fullWidth>\n {t('button.cancel')}\n </Button>\n <Box\n sx={{\n display: 'flex',\n p: 1,\n }}\n />\n <Button variant=\"contained\" onClick={onContinue} fullWidth>\n {t('button.continue')}\n </Button>\n </Box>\n </Box>\n )\n}\n"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"ExecutionDoneCard.js","names":["Card"],"sources":["../../../../src/pages/TransactionPage/ExecutionDoneCard.tsx"],"sourcesContent":["import type { RouteExtended } from '@lifi/sdk'\nimport { Box } from '@mui/material'\nimport type React from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { Card } from '../../components/Card/Card.js'\nimport { CardTitle } from '../../components/Card/CardTitle.js'\nimport { Token } from '../../components/Token/Token.js'\nimport { RouteExecutionStatus } from '../../stores/routes/types.js'\nimport { hasEnumFlag } from '../../utils/enum.js'\nimport { getExecutionToToken } from '../../utils/token.js'\n\ninterface ExecutionDoneCardProps {\n route: RouteExtended\n status: RouteExecutionStatus\n}\n\nexport const ExecutionDoneCard: React.FC<ExecutionDoneCardProps> = ({\n route,\n status,\n}) => {\n const { t } = useTranslation()\n\n const toToken = getExecutionToToken(route)\n\n return (\n <Card type=\"default\" indented>\n <Box\n sx={{\n display: 'flex',\n justifyContent: 'space-between',\n alignItems: 'center',\n }}\n >\n <CardTitle sx={{ padding: 0, mb: 2 }}>\n {hasEnumFlag(status, RouteExecutionStatus.Refunded)\n ? t('header.refunded')\n : t('header.received')}\n </CardTitle>\n </Box>\n <Token token={toToken} disableDescription={false} />\n </Card>\n )\n}\n"],"mappings":";;;;;;;;;;AAgBA,MAAa,qBAAuD,EAClE,OACA,aACI;CACJ,MAAM,EAAE,MAAM,eAAe;CAE7B,MAAM,UAAU,oBAAoB,KAAK;CAEzC,OACE,qBAACA,QAAD;EAAM,MAAK;EAAU,UAAA;YAArB,CACE,oBAAC,KAAD;GACE,IAAI;IACF,SAAS;IACT,gBAAgB;IAChB,YAAY;GACd;aAEA,oBAAC,WAAD;IAAW,IAAI;KAAE,SAAS;KAAG,IAAI;IAAE;cAChC,YAAY,QAAA,EAAqC,IAC9C,EAAE,iBAAiB,IACnB,EAAE,iBAAiB;GACd,CAAA;EACR,CAAA,GACL,oBAAC,OAAD;GAAO,OAAO;GAAS,oBAAoB;EAAQ,CAAA,CAC/C;;AAEV"}
1
+ {"version":3,"file":"ExecutionDoneCard.js","names":["Card"],"sources":["../../../../src/pages/TransactionPage/ExecutionDoneCard.tsx"],"sourcesContent":["import type { RouteExtended } from '@lifi/sdk'\nimport { Box } from '@mui/material'\nimport type React from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { Card } from '../../components/Card/Card.js'\nimport { CardTitle } from '../../components/Card/CardTitle.js'\nimport { Token } from '../../components/Token/Token.js'\nimport { RouteExecutionStatus } from '../../stores/routes/types.js'\nimport { hasEnumFlag } from '../../utils/enum.js'\nimport { getExecutionToToken } from '../../utils/token.js'\n\ninterface ExecutionDoneCardProps {\n route: RouteExtended\n status: RouteExecutionStatus\n}\n\nexport const ExecutionDoneCard: React.FC<ExecutionDoneCardProps> = ({\n route,\n status,\n}) => {\n const { t } = useTranslation()\n\n const toToken = getExecutionToToken(route)\n\n return (\n <Card type=\"default\" indented>\n <Box\n sx={{\n display: 'flex',\n justifyContent: 'space-between',\n alignItems: 'center',\n }}\n >\n <CardTitle sx={{ padding: 0, mb: 2 }}>\n {hasEnumFlag(status, RouteExecutionStatus.Refunded)\n ? t('header.refunded')\n : t('header.received')}\n </CardTitle>\n </Box>\n <Token token={toToken} disableDescription={false} />\n </Card>\n )\n}\n"],"mappings":";;;;;;;;;;AAgBA,MAAa,qBAAuD,EAClE,OACA,aACI;CACJ,MAAM,EAAE,MAAM,eAAe;CAE7B,MAAM,UAAU,oBAAoB,KAAK;CAEzC,OACE,qBAACA,QAAD;EAAM,MAAK;EAAU,UAAA;EAArB,UAAA,CACE,oBAAC,KAAD;GACE,IAAI;IACF,SAAS;IACT,gBAAgB;IAChB,YAAY;GACd;GAEA,UAAA,oBAAC,WAAD;IAAW,IAAI;KAAE,SAAS;KAAG,IAAI;IAAE;IAChC,UAAA,YAAY,QAAA,EAAqC,IAC9C,EAAE,iBAAiB,IACnB,EAAE,iBAAiB;GACd,CAAA;EACR,CAAA,GACL,oBAAC,OAAD;GAAO,OAAO;GAAS,oBAAoB;EAAQ,CAAA,CAC/C;;AAEV"}
@@ -5,12 +5,13 @@ import { jsx } from "react/jsx-runtime";
5
5
  //#region src/pages/TransactionPage/StartTransactionButton.tsx
6
6
  const StartTransactionButton = ({ onClick, route, text, loading }) => {
7
7
  const { messages, isLoading } = useMessageQueue(route, true);
8
+ const hasNonGasMessages = useMemo(() => {
9
+ return messages.some((message) => message.id !== "INSUFFICIENT_GAS");
10
+ }, [messages]);
8
11
  return /* @__PURE__ */ jsx(BaseTransactionButton, {
9
12
  onClick,
10
13
  text,
11
- disabled: useMemo(() => {
12
- return messages.some((message) => message.id !== "INSUFFICIENT_GAS");
13
- }, [messages]),
14
+ disabled: hasNonGasMessages,
14
15
  loading: isLoading || loading,
15
16
  route
16
17
  });
@@ -1 +1 @@
1
- {"version":3,"file":"StartTransactionButton.js","names":[],"sources":["../../../../src/pages/TransactionPage/StartTransactionButton.tsx"],"sourcesContent":["import { useMemo } from 'react'\nimport { BaseTransactionButton } from '../../components/BaseTransactionButton/BaseTransactionButton.js'\nimport { useMessageQueue } from '../../components/Messages/useMessageQueue.js'\nimport type { StartTransactionButtonProps } from './types.js'\n\nexport const StartTransactionButton: React.FC<StartTransactionButtonProps> = ({\n onClick,\n route,\n text,\n loading,\n}) => {\n const { messages, isLoading } = useMessageQueue(route, true)\n\n const hasNonGasMessages = useMemo(() => {\n return messages.some((message) => message.id !== 'INSUFFICIENT_GAS')\n }, [messages])\n\n return (\n <BaseTransactionButton\n onClick={onClick}\n text={text}\n disabled={hasNonGasMessages}\n loading={isLoading || loading}\n route={route}\n />\n )\n}\n"],"mappings":";;;;;AAKA,MAAa,0BAAiE,EAC5E,SACA,OACA,MACA,cACI;CACJ,MAAM,EAAE,UAAU,cAAc,gBAAgB,OAAO,IAAI;CAM3D,OACE,oBAAC,uBAAD;EACW;EACH;EACN,UARsB,cAAc;GACtC,OAAO,SAAS,MAAM,YAAY,QAAQ,OAAO,kBAAkB;EACrE,GAAG,CAAC,QAAQ,CAMkB;EAC1B,SAAS,aAAa;EACf;CACR,CAAA;AAEL"}
1
+ {"version":3,"file":"StartTransactionButton.js","names":[],"sources":["../../../../src/pages/TransactionPage/StartTransactionButton.tsx"],"sourcesContent":["import { useMemo } from 'react'\nimport { BaseTransactionButton } from '../../components/BaseTransactionButton/BaseTransactionButton.js'\nimport { useMessageQueue } from '../../components/Messages/useMessageQueue.js'\nimport type { StartTransactionButtonProps } from './types.js'\n\nexport const StartTransactionButton: React.FC<StartTransactionButtonProps> = ({\n onClick,\n route,\n text,\n loading,\n}) => {\n const { messages, isLoading } = useMessageQueue(route, true)\n\n const hasNonGasMessages = useMemo(() => {\n return messages.some((message) => message.id !== 'INSUFFICIENT_GAS')\n }, [messages])\n\n return (\n <BaseTransactionButton\n onClick={onClick}\n text={text}\n disabled={hasNonGasMessages}\n loading={isLoading || loading}\n route={route}\n />\n )\n}\n"],"mappings":";;;;;AAKA,MAAa,0BAAiE,EAC5E,SACA,OACA,MACA,cACI;CACJ,MAAM,EAAE,UAAU,cAAc,gBAAgB,OAAO,IAAI;CAE3D,MAAM,oBAAoB,cAAc;EACtC,OAAO,SAAS,MAAM,YAAY,QAAQ,OAAO,kBAAkB;CACrE,GAAG,CAAC,QAAQ,CAAC;CAEb,OACE,oBAAC,uBAAD;EACW;EACH;EACN,UAAU;EACV,SAAS,aAAa;EACf;CACR,CAAA;AAEL"}
@@ -1 +1 @@
1
- {"version":3,"file":"TokenValueBottomSheet.js","names":[],"sources":["../../../../src/pages/TransactionPage/TokenValueBottomSheet.tsx"],"sourcesContent":["import type { Route } from '@lifi/sdk'\nimport { Button, Checkbox, FormControlLabel } from '@mui/material'\nimport type { JSX, Ref, RefObject } from 'react'\nimport { useRef, useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { BottomSheet } from '../../components/BottomSheet/BottomSheet.js'\nimport type { BottomSheetBase } from '../../components/BottomSheet/types.js'\nimport { FeeBreakdownTooltip } from '../../components/FeeBreakdownTooltip.js'\nimport { IconCircle } from '../../components/IconCircle/IconCircle.js'\nimport { useSetContentHeight } from '../../hooks/useSetContentHeight.js'\nimport { getAccumulatedFeeCostsBreakdown } from '../../utils/fees.js'\nimport {\n ButtonRow,\n CenterContainer,\n ContentContainer,\n DetailLabel,\n DetailRow,\n DetailValue,\n WarningMessage,\n WarningTitle,\n} from './TokenValueBottomSheet.style.js'\nimport { calculateValueLossPercentage } from './utils.js'\n\ninterface TokenValueBottomSheetProps {\n route: Route\n onContinue(): void\n onCancel?(): void\n}\n\nexport const TokenValueBottomSheet = ({\n route,\n onContinue,\n onCancel,\n ref,\n}: TokenValueBottomSheetProps & {\n ref?: Ref<BottomSheetBase>\n}): JSX.Element => {\n const handleCancel = () => {\n ;(ref as RefObject<BottomSheetBase>).current?.close()\n onCancel?.()\n }\n\n return (\n <BottomSheet ref={ref} onClose={onCancel}>\n <TokenValueBottomSheetContent\n route={route}\n onContinue={onContinue}\n onCancel={handleCancel}\n />\n </BottomSheet>\n )\n}\n\nconst TokenValueBottomSheetContent: React.FC<TokenValueBottomSheetProps> = ({\n route,\n onCancel,\n onContinue,\n}) => {\n const [accepted, setAccepted] = useState(false)\n const { t } = useTranslation()\n const ref = useRef<HTMLElement>(null)\n useSetContentHeight(ref)\n const { gasCosts, feeCosts, gasCostUSD, feeCostUSD } =\n getAccumulatedFeeCostsBreakdown(route)\n const fromAmountUSD = Number.parseFloat(route.fromAmountUSD)\n const toAmountUSD = Number.parseFloat(route.toAmountUSD)\n\n return (\n <ContentContainer ref={ref}>\n <CenterContainer>\n <IconCircle status=\"warning\" sx={{ mb: 2.5 }} />\n <WarningTitle>{t('warning.title.highValueLoss')}</WarningTitle>\n </CenterContainer>\n <WarningMessage>{t('warning.message.highValueLoss')}</WarningMessage>\n <DetailRow>\n <DetailLabel>{t('main.sending')}</DetailLabel>\n <DetailValue>\n {t('format.currency', { value: route.fromAmountUSD })}\n </DetailValue>\n </DetailRow>\n <DetailRow>\n <DetailLabel>{t('main.fees.network')}</DetailLabel>\n <FeeBreakdownTooltip gasCosts={gasCosts} gasless={!gasCostUSD}>\n <DetailValue>\n {!gasCostUSD\n ? t('main.fees.free')\n : t('format.currency', { value: gasCostUSD })}\n </DetailValue>\n </FeeBreakdownTooltip>\n </DetailRow>\n {feeCostUSD ? (\n <DetailRow>\n <DetailLabel>{t('main.fees.provider')}</DetailLabel>\n <FeeBreakdownTooltip feeCosts={feeCosts}>\n <DetailValue>\n {t('format.currency', { value: feeCostUSD })}\n </DetailValue>\n </FeeBreakdownTooltip>\n </DetailRow>\n ) : null}\n <DetailRow>\n <DetailLabel>{t('main.receiving')}</DetailLabel>\n <DetailValue>\n {t('format.currency', { value: route.toAmountUSD })}\n </DetailValue>\n </DetailRow>\n <DetailRow>\n <DetailLabel>{t('main.valueLoss')}</DetailLabel>\n <DetailValue>\n {calculateValueLossPercentage(\n fromAmountUSD,\n toAmountUSD,\n gasCostUSD,\n feeCostUSD\n )}\n %\n </DetailValue>\n </DetailRow>\n <FormControlLabel\n control={\n <Checkbox\n checked={accepted}\n onChange={(_, checked) => setAccepted(checked)}\n />\n }\n label={t('warning.checkbox.highValueLoss')}\n sx={{ mt: 1 }}\n />\n <ButtonRow>\n <Button variant=\"text\" onClick={onCancel} fullWidth>\n {t('button.cancel')}\n </Button>\n <Button\n variant=\"contained\"\n onClick={onContinue}\n disabled={!accepted}\n fullWidth\n >\n {t('button.continue')}\n </Button>\n </ButtonRow>\n </ContentContainer>\n )\n}\n"],"mappings":"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"}
1
+ {"version":3,"file":"TokenValueBottomSheet.js","names":[],"sources":["../../../../src/pages/TransactionPage/TokenValueBottomSheet.tsx"],"sourcesContent":["import type { Route } from '@lifi/sdk'\nimport { Button, Checkbox, FormControlLabel } from '@mui/material'\nimport type { JSX, Ref, RefObject } from 'react'\nimport { useRef, useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { BottomSheet } from '../../components/BottomSheet/BottomSheet.js'\nimport type { BottomSheetBase } from '../../components/BottomSheet/types.js'\nimport { FeeBreakdownTooltip } from '../../components/FeeBreakdownTooltip.js'\nimport { IconCircle } from '../../components/IconCircle/IconCircle.js'\nimport { useSetContentHeight } from '../../hooks/useSetContentHeight.js'\nimport { getAccumulatedFeeCostsBreakdown } from '../../utils/fees.js'\nimport {\n ButtonRow,\n CenterContainer,\n ContentContainer,\n DetailLabel,\n DetailRow,\n DetailValue,\n WarningMessage,\n WarningTitle,\n} from './TokenValueBottomSheet.style.js'\nimport { calculateValueLossPercentage } from './utils.js'\n\ninterface TokenValueBottomSheetProps {\n route: Route\n onContinue(): void\n onCancel?(): void\n}\n\nexport const TokenValueBottomSheet = ({\n route,\n onContinue,\n onCancel,\n ref,\n}: TokenValueBottomSheetProps & {\n ref?: Ref<BottomSheetBase>\n}): JSX.Element => {\n const handleCancel = () => {\n ;(ref as RefObject<BottomSheetBase>).current?.close()\n onCancel?.()\n }\n\n return (\n <BottomSheet ref={ref} onClose={onCancel}>\n <TokenValueBottomSheetContent\n route={route}\n onContinue={onContinue}\n onCancel={handleCancel}\n />\n </BottomSheet>\n )\n}\n\nconst TokenValueBottomSheetContent: React.FC<TokenValueBottomSheetProps> = ({\n route,\n onCancel,\n onContinue,\n}) => {\n const [accepted, setAccepted] = useState(false)\n const { t } = useTranslation()\n const ref = useRef<HTMLElement>(null)\n useSetContentHeight(ref)\n const { gasCosts, feeCosts, gasCostUSD, feeCostUSD } =\n getAccumulatedFeeCostsBreakdown(route)\n const fromAmountUSD = Number.parseFloat(route.fromAmountUSD)\n const toAmountUSD = Number.parseFloat(route.toAmountUSD)\n\n return (\n <ContentContainer ref={ref}>\n <CenterContainer>\n <IconCircle status=\"warning\" sx={{ mb: 2.5 }} />\n <WarningTitle>{t('warning.title.highValueLoss')}</WarningTitle>\n </CenterContainer>\n <WarningMessage>{t('warning.message.highValueLoss')}</WarningMessage>\n <DetailRow>\n <DetailLabel>{t('main.sending')}</DetailLabel>\n <DetailValue>\n {t('format.currency', { value: route.fromAmountUSD })}\n </DetailValue>\n </DetailRow>\n <DetailRow>\n <DetailLabel>{t('main.fees.network')}</DetailLabel>\n <FeeBreakdownTooltip gasCosts={gasCosts} gasless={!gasCostUSD}>\n <DetailValue>\n {!gasCostUSD\n ? t('main.fees.free')\n : t('format.currency', { value: gasCostUSD })}\n </DetailValue>\n </FeeBreakdownTooltip>\n </DetailRow>\n {feeCostUSD ? (\n <DetailRow>\n <DetailLabel>{t('main.fees.provider')}</DetailLabel>\n <FeeBreakdownTooltip feeCosts={feeCosts}>\n <DetailValue>\n {t('format.currency', { value: feeCostUSD })}\n </DetailValue>\n </FeeBreakdownTooltip>\n </DetailRow>\n ) : null}\n <DetailRow>\n <DetailLabel>{t('main.receiving')}</DetailLabel>\n <DetailValue>\n {t('format.currency', { value: route.toAmountUSD })}\n </DetailValue>\n </DetailRow>\n <DetailRow>\n <DetailLabel>{t('main.valueLoss')}</DetailLabel>\n <DetailValue>\n {calculateValueLossPercentage(\n fromAmountUSD,\n toAmountUSD,\n gasCostUSD,\n feeCostUSD\n )}\n %\n </DetailValue>\n </DetailRow>\n <FormControlLabel\n control={\n <Checkbox\n checked={accepted}\n onChange={(_, checked) => setAccepted(checked)}\n />\n }\n label={t('warning.checkbox.highValueLoss')}\n sx={{ mt: 1 }}\n />\n <ButtonRow>\n <Button variant=\"text\" onClick={onCancel} fullWidth>\n {t('button.cancel')}\n </Button>\n <Button\n variant=\"contained\"\n onClick={onContinue}\n disabled={!accepted}\n fullWidth\n >\n {t('button.continue')}\n </Button>\n </ButtonRow>\n </ContentContainer>\n )\n}\n"],"mappings":"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"}