@lifi/widget 4.0.0-beta.17 → 4.0.0-beta.19
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/esm/App.js.map +1 -1
- package/dist/esm/AppDefault.js.map +1 -1
- package/dist/esm/AppDrawer.js.map +1 -1
- package/dist/esm/AppLayout.js.map +1 -1
- package/dist/esm/AppProvider.js.map +1 -1
- package/dist/esm/components/AmountInput/AmountInput.js.map +1 -1
- package/dist/esm/components/AmountInput/AmountInputEndAdornment.js.map +1 -1
- package/dist/esm/components/AmountInput/AmountInputStartAdornment.js.map +1 -1
- package/dist/esm/components/AmountInput/PriceFormHelperText.js.map +1 -1
- package/dist/esm/components/AppContainer.js.map +1 -1
- package/dist/esm/components/Avatar/AccountAvatar.js.map +1 -1
- package/dist/esm/components/Avatar/Avatar.js.map +1 -1
- package/dist/esm/components/Avatar/Avatar.style.js.map +1 -1
- package/dist/esm/components/Avatar/ChainBadgeContent.js.map +1 -1
- package/dist/esm/components/Avatar/SmallAvatar.js.map +1 -1
- package/dist/esm/components/Avatar/TokenAvatar.js.map +1 -1
- package/dist/esm/components/Avatar/utils.js.map +1 -1
- package/dist/esm/components/BaseTransactionButton/BaseTransactionButton.js.map +1 -1
- package/dist/esm/components/BottomSheet/BottomSheet.js.map +1 -1
- package/dist/esm/components/Card/Card.js.map +1 -1
- package/dist/esm/components/Card/CardIconButton.js.map +1 -1
- package/dist/esm/components/ChainSelect/ChainSelect.js.map +1 -1
- package/dist/esm/components/ChainSelect/ChainSelect.style.js.map +1 -1
- package/dist/esm/components/ChainSelect/useChainSelect.js.map +1 -1
- package/dist/esm/components/Chains/AllChainsAvatar.js +1 -1
- package/dist/esm/components/Chains/AllChainsAvatar.js.map +1 -1
- package/dist/esm/components/Chains/ChainList.js.map +1 -1
- package/dist/esm/components/Chains/ChainList.style.js.map +1 -1
- package/dist/esm/components/Chains/ChainListItem.js.map +1 -1
- package/dist/esm/components/Chains/ChainSearchInput.js.map +1 -1
- package/dist/esm/components/Chains/ChainsExpanded.js.map +1 -1
- package/dist/esm/components/Chains/PinChainButton.js.map +1 -1
- package/dist/esm/components/Chains/SelectChainContent.js.map +1 -1
- package/dist/esm/components/Chains/VirtualizedChainList.js.map +1 -1
- package/dist/esm/components/ContextMenu.js.map +1 -1
- package/dist/esm/components/ContractComponent/ContractComponent.js.map +1 -1
- package/dist/esm/components/ContractComponent/ItemPrice.js.map +1 -1
- package/dist/esm/components/ContractComponent/NFT/NFT.js.map +1 -1
- package/dist/esm/components/ContractComponent/NFT/NFTBase.js.map +1 -1
- package/dist/esm/components/Dialog/Dialog.js.map +1 -1
- package/dist/esm/components/Expansion/Expansion.js.map +1 -1
- package/dist/esm/components/Expansion/ExpansionTransition.js.map +1 -1
- package/dist/esm/components/FeeBreakdownTooltip.js.map +1 -1
- package/dist/esm/components/Header/ActivitiesButton.js.map +1 -1
- package/dist/esm/components/Header/BackButton.js.map +1 -1
- package/dist/esm/components/Header/CloseDrawerButton.js.map +1 -1
- package/dist/esm/components/Header/DisconnectIconButton.js.map +1 -1
- package/dist/esm/components/Header/Header.js.map +1 -1
- package/dist/esm/components/Header/Header.style.js.map +1 -1
- package/dist/esm/components/Header/NavigationHeader.js.map +1 -1
- package/dist/esm/components/Header/SettingsButton.js.map +1 -1
- package/dist/esm/components/Header/SettingsButton.style.js.map +1 -1
- package/dist/esm/components/Header/SplitNavigationTabs.js.map +1 -1
- package/dist/esm/components/Header/WalletHeader.js.map +1 -1
- package/dist/esm/components/Header/WalletMenu.js.map +1 -1
- package/dist/esm/components/IconCircle/IconCircle.js.map +1 -1
- package/dist/esm/components/IconCircle/IconCircle.style.js.map +1 -1
- package/dist/esm/components/Initializer.js.map +1 -1
- package/dist/esm/components/ListItemButton.js.map +1 -1
- package/dist/esm/components/Messages/AccountDeployedMessage.js.map +1 -1
- package/dist/esm/components/Messages/AccountNotDeployedMessage.js.map +1 -1
- package/dist/esm/components/Messages/FundsSufficiencyMessage.js.map +1 -1
- package/dist/esm/components/Messages/GasRefuelMessage.js.map +1 -1
- package/dist/esm/components/Messages/GasSufficiencyMessage.js.map +1 -1
- package/dist/esm/components/Messages/MinFromAmountUSDMessage.js.map +1 -1
- package/dist/esm/components/Messages/MissingRouteRequiredAccountMessage.js.map +1 -1
- package/dist/esm/components/Messages/WarningMessages.js.map +1 -1
- package/dist/esm/components/Messages/useMessageQueue.js.map +1 -1
- package/dist/esm/components/NotFound.js.map +1 -1
- package/dist/esm/components/PageEntered.js.map +1 -1
- package/dist/esm/components/PoweredBy/PoweredBy.js.map +1 -1
- package/dist/esm/components/ProgressToNextUpdate.js.map +1 -1
- package/dist/esm/components/ReverseTokensButton/ReverseTokensButton.js.map +1 -1
- package/dist/esm/components/ReverseTokensButton/ReverseTokensButton.style.js.map +1 -1
- package/dist/esm/components/RouteCard/RouteCard.js.map +1 -1
- package/dist/esm/components/RouteCard/RouteCardEssentials.js.map +1 -1
- package/dist/esm/components/RouteCard/RouteCardSkeleton.js.map +1 -1
- package/dist/esm/components/RouteCard/RouteDetails.js.map +1 -1
- package/dist/esm/components/RouteCard/RouteNotFoundCard.js.map +1 -1
- package/dist/esm/components/RouteCard/RouteToken.js.map +1 -1
- package/dist/esm/components/RouteCard/RouteTokens.js.map +1 -1
- package/dist/esm/components/RouteCard/getMatchingLabels.js.map +1 -1
- package/dist/esm/components/Routes/Routes.js.map +1 -1
- package/dist/esm/components/Routes/RoutesContent.js.map +1 -1
- package/dist/esm/components/Routes/RoutesExpanded.js.map +1 -1
- package/dist/esm/components/Routes/RoutesExpanded.style.js.map +1 -1
- package/dist/esm/components/Search/SearchInput.js.map +1 -1
- package/dist/esm/components/SelectChainAndToken.js.map +1 -1
- package/dist/esm/components/SelectTokenButton/SelectTokenButton.js.map +1 -1
- package/dist/esm/components/SelectTokenButton/SelectTokenButton.style.js.map +1 -1
- package/dist/esm/components/SendToWallet/SendToWalletButton.js +1 -1
- package/dist/esm/components/SendToWallet/SendToWalletButton.js.map +1 -1
- package/dist/esm/components/SendToWallet/SendToWalletExpandButton.js.map +1 -1
- package/dist/esm/components/Skeleton/WidgetSkeleton.js.map +1 -1
- package/dist/esm/components/Skeleton/WidgetSkeleton.style.js.map +1 -1
- package/dist/esm/components/Step/CircularProgress.js.map +1 -1
- package/dist/esm/components/Step/CircularProgress.style.js.map +1 -1
- package/dist/esm/components/Step/DestinationWalletAddress.js.map +1 -1
- package/dist/esm/components/Step/Step.js.map +1 -1
- package/dist/esm/components/Step/StepAction.js.map +1 -1
- package/dist/esm/components/Step/StepActions.js.map +1 -1
- package/dist/esm/components/Step/StepList.js.map +1 -1
- package/dist/esm/components/StepActions/StepActions.js.map +1 -1
- package/dist/esm/components/StepDivider/StepDivider.js.map +1 -1
- package/dist/esm/components/Tabs/Tabs.style.js.map +1 -1
- package/dist/esm/components/TextFitter/TextFitter.js.map +1 -1
- package/dist/esm/components/Timer/StepTimer.js.map +1 -1
- package/dist/esm/components/Timer/TimerContent.js.map +1 -1
- package/dist/esm/components/Token/Token.js.map +1 -1
- package/dist/esm/components/TokenList/PinTokenButton.js.map +1 -1
- package/dist/esm/components/TokenList/TokenDetailsSheet.js.map +1 -1
- package/dist/esm/components/TokenList/TokenDetailsSheetContent.js.map +1 -1
- package/dist/esm/components/TokenList/TokenList.js.map +1 -1
- package/dist/esm/components/TokenList/TokenListItem.js.map +1 -1
- package/dist/esm/components/TokenList/TokenNotFound.js.map +1 -1
- package/dist/esm/components/TokenList/VirtualizedTokenList.js.map +1 -1
- package/dist/esm/components/TokenList/useTokenSelect.js.map +1 -1
- package/dist/esm/components/TokenRate/TokenRate.js.map +1 -1
- package/dist/esm/components/Tools/ToolItem.js.map +1 -1
- package/dist/esm/components/Tools/Tools.js.map +1 -1
- package/dist/esm/components/TransactionCard/ActiveTransactionCard.js.map +1 -1
- package/dist/esm/components/TransactionCard/TransactionCard.js.map +1 -1
- package/dist/esm/components/TransactionCard/TransactionCardSkeleton.js.map +1 -1
- package/dist/esm/components/TransactionDetails.js.map +1 -1
- package/dist/esm/config/version.d.ts +1 -1
- package/dist/esm/config/version.js +1 -1
- package/dist/esm/config/version.js.map +1 -1
- package/dist/esm/hooks/timer/time.js.map +1 -1
- package/dist/esm/hooks/timer/useExecutionTimer.js.map +1 -1
- package/dist/esm/hooks/timer/useInterval.js.map +1 -1
- package/dist/esm/hooks/timer/useTimer.js.map +1 -1
- package/dist/esm/hooks/timer/validate.js.map +1 -1
- package/dist/esm/hooks/useAccountsBalancesData.js.map +1 -1
- package/dist/esm/hooks/useActionMessage.js +2 -2
- package/dist/esm/hooks/useActionMessage.js.map +1 -1
- package/dist/esm/hooks/useAddressActivity.js.map +1 -1
- package/dist/esm/hooks/useAddressValidation.js.map +1 -1
- package/dist/esm/hooks/useAvailableChains.js.map +1 -1
- package/dist/esm/hooks/useChain.js.map +1 -1
- package/dist/esm/hooks/useChains.js.map +1 -1
- package/dist/esm/hooks/useContactSupport.js.map +1 -1
- package/dist/esm/hooks/useDebouncedWatch.js.map +1 -1
- package/dist/esm/hooks/useDefaultElementId.js.map +1 -1
- package/dist/esm/hooks/useExplorer.js.map +1 -1
- package/dist/esm/hooks/useFilteredByTokenBalances.js.map +1 -1
- package/dist/esm/hooks/useFromAmountThreshold.js.map +1 -1
- package/dist/esm/hooks/useFromTokenSufficiency.js.map +1 -1
- package/dist/esm/hooks/useGasRecommendation.js.map +1 -1
- package/dist/esm/hooks/useGasRefuel.js.map +1 -1
- package/dist/esm/hooks/useGasSufficiency.js.map +1 -1
- package/dist/esm/hooks/useHasChainExpansion.js.map +1 -1
- package/dist/esm/hooks/useHeader.js.map +1 -1
- package/dist/esm/hooks/useInitializeSDKProviders.js.map +1 -1
- package/dist/esm/hooks/useInitializer.js.map +1 -1
- package/dist/esm/hooks/useIsBatchingSupported.js.map +1 -1
- package/dist/esm/hooks/useIsContractAddress.js.map +1 -1
- package/dist/esm/hooks/useLanguages.js.map +1 -1
- package/dist/esm/hooks/useListHeight.js.map +1 -1
- package/dist/esm/hooks/useLongPress.js.map +1 -1
- package/dist/esm/hooks/useNavigateBack.js.map +1 -1
- package/dist/esm/hooks/useRouteExecution.js +0 -2
- package/dist/esm/hooks/useRouteExecution.js.map +1 -1
- package/dist/esm/hooks/useRouteRequiredAccountConnection.js.map +1 -1
- package/dist/esm/hooks/useRoutes.js.map +1 -1
- package/dist/esm/hooks/useScrollableContainer.js.map +1 -1
- package/dist/esm/hooks/useSetContentHeight.js.map +1 -1
- package/dist/esm/hooks/useSettingMonitor.js.map +1 -1
- package/dist/esm/hooks/useSwapOnly.js.map +1 -1
- package/dist/esm/hooks/useToAddressAutoPopulate.js.map +1 -1
- package/dist/esm/hooks/useToAddressRequirements.js.map +1 -1
- package/dist/esm/hooks/useToAddressReset.js.map +1 -1
- package/dist/esm/hooks/useToken.js.map +1 -1
- package/dist/esm/hooks/useTokenAddressBalance.js.map +1 -1
- package/dist/esm/hooks/useTokenBalance.js.map +1 -1
- package/dist/esm/hooks/useTokenBalances.js.map +1 -1
- package/dist/esm/hooks/useTokenBalancesQueries.js.map +1 -1
- package/dist/esm/hooks/useTokenRateText.js.map +1 -1
- package/dist/esm/hooks/useTokenSearch.js.map +1 -1
- package/dist/esm/hooks/useTokens.js.map +1 -1
- package/dist/esm/hooks/useTools.js.map +1 -1
- package/dist/esm/hooks/useTransactionDetails.js.map +1 -1
- package/dist/esm/hooks/useTransactionHistory.js.map +1 -1
- package/dist/esm/hooks/useTransactionList.js.map +1 -1
- package/dist/esm/hooks/useWideVariant.js.map +1 -1
- package/dist/esm/hooks/useWidgetChains.js.map +1 -1
- package/dist/esm/hooks/useWidgetEvents.js.map +1 -1
- package/dist/esm/i18n/bn.json +3 -0
- package/dist/esm/i18n/de.json +3 -0
- package/dist/esm/i18n/es.json +3 -0
- package/dist/esm/i18n/fr.json +3 -0
- package/dist/esm/i18n/hi.json +3 -0
- package/dist/esm/i18n/id.json +3 -0
- package/dist/esm/i18n/it.json +3 -0
- package/dist/esm/i18n/ja.json +3 -0
- package/dist/esm/i18n/ko.json +3 -0
- package/dist/esm/i18n/pl.json +3 -0
- package/dist/esm/i18n/pt.json +3 -0
- package/dist/esm/i18n/th.json +3 -0
- package/dist/esm/i18n/tr.json +3 -0
- package/dist/esm/i18n/uk.json +3 -0
- package/dist/esm/i18n/vi.json +3 -0
- package/dist/esm/i18n/zh.json +3 -0
- package/dist/esm/pages/ActivitiesPage/ActiveTransactionItem.js.map +1 -1
- package/dist/esm/pages/ActivitiesPage/ActivitiesPage.js.map +1 -1
- package/dist/esm/pages/ActivitiesPage/ActivitiesPageMenuButton.js.map +1 -1
- package/dist/esm/pages/ActivitiesPage/TransactionHistoryEmpty.js.map +1 -1
- package/dist/esm/pages/ActivitiesPage/TransactionHistoryItem.js.map +1 -1
- package/dist/esm/pages/LanguagesPage.js.map +1 -1
- package/dist/esm/pages/MainPage/MainPage.js.map +1 -1
- package/dist/esm/pages/MainPage/MainWarningMessages.js.map +1 -1
- package/dist/esm/pages/MainPage/ReviewButton.js.map +1 -1
- package/dist/esm/pages/RoutesPage/RoutesPage.js.map +1 -1
- package/dist/esm/pages/SelectChainPage/SelectChainPage.js.map +1 -1
- package/dist/esm/pages/SelectEnabledToolsPage.js.map +1 -1
- package/dist/esm/pages/SelectTokenPage/SearchTokenInput.js.map +1 -1
- package/dist/esm/pages/SelectTokenPage/SelectTokenPage.js.map +1 -1
- package/dist/esm/pages/SendToWallet/BookmarkAddressSheet.js.map +1 -1
- package/dist/esm/pages/SendToWallet/BookmarksPage.js.map +1 -1
- package/dist/esm/pages/SendToWallet/ConfirmAddressSheet.js.map +1 -1
- package/dist/esm/pages/SendToWallet/ConnectedWalletsPage.js.map +1 -1
- package/dist/esm/pages/SendToWallet/RecentWalletsPage.js.map +1 -1
- package/dist/esm/pages/SendToWallet/SendToConfiguredWalletPage.js.map +1 -1
- package/dist/esm/pages/SendToWallet/SendToWalletPage.js.map +1 -1
- package/dist/esm/pages/SettingsPage/BridgeAndExchangeSettings.js.map +1 -1
- package/dist/esm/pages/SettingsPage/GasPriceSettings.js.map +1 -1
- package/dist/esm/pages/SettingsPage/LanguageSetting.js.map +1 -1
- package/dist/esm/pages/SettingsPage/ResetSettingsButton.js.map +1 -1
- package/dist/esm/pages/SettingsPage/RoutePrioritySettings.js.map +1 -1
- package/dist/esm/pages/SettingsPage/SettingsCard/SettingCardExpandable.js.map +1 -1
- package/dist/esm/pages/SettingsPage/SettingsCard/SettingsAccordian.js.map +1 -1
- package/dist/esm/pages/SettingsPage/SettingsPage.js.map +1 -1
- package/dist/esm/pages/SettingsPage/SlippageSettings/SlippageSettings.js.map +1 -1
- package/dist/esm/pages/SettingsPage/SlippageSettings/SlippageSettings.style.js.map +1 -1
- package/dist/esm/pages/SettingsPage/SmallBalanceFilterSettings.js.map +1 -1
- package/dist/esm/pages/SettingsPage/ThemeSettings.js.map +1 -1
- package/dist/esm/pages/TransactionDetailsPage/ActionRow.js.map +1 -1
- package/dist/esm/pages/TransactionDetailsPage/ContactSupportButton.js.map +1 -1
- package/dist/esm/pages/TransactionDetailsPage/ReceiptsCard.js.map +1 -1
- package/dist/esm/pages/TransactionDetailsPage/SentToWalletRow.js.map +1 -1
- package/dist/esm/pages/TransactionDetailsPage/StepActionRow.js +2 -2
- package/dist/esm/pages/TransactionDetailsPage/StepActionRow.js.map +1 -1
- package/dist/esm/pages/TransactionDetailsPage/StepActionsList.js +11 -5
- package/dist/esm/pages/TransactionDetailsPage/StepActionsList.js.map +1 -1
- package/dist/esm/pages/TransactionDetailsPage/TransactionDetailsPage.js.map +1 -1
- package/dist/esm/pages/TransactionDetailsPage/TransactionDetailsSkeleton.js.map +1 -1
- package/dist/esm/pages/TransactionDetailsPage/TransferIdCard.js.map +1 -1
- package/dist/esm/pages/TransactionPage/ConfirmToAddressSheet.js.map +1 -1
- package/dist/esm/pages/TransactionPage/ExchangeRateBottomSheet.js.map +1 -1
- package/dist/esm/pages/TransactionPage/RouteTracker.js.map +1 -1
- package/dist/esm/pages/TransactionPage/StartTransactionButton.js.map +1 -1
- package/dist/esm/pages/TransactionPage/StatusBottomSheet.js.map +1 -1
- package/dist/esm/pages/TransactionPage/StatusBottomSheet.style.js.map +1 -1
- package/dist/esm/pages/TransactionPage/TokenValueBottomSheet.js.map +1 -1
- package/dist/esm/pages/TransactionPage/TransactionPage.js.map +1 -1
- package/dist/esm/pages/TransactionPage/utils.js.map +1 -1
- package/dist/esm/providers/I18nProvider/I18nProvider.js.map +1 -1
- package/dist/esm/providers/I18nProvider/i18n.js.map +1 -1
- package/dist/esm/providers/QueryClientProvider.js.map +1 -1
- package/dist/esm/providers/SDKClientProvider.js.map +1 -1
- package/dist/esm/providers/ThemeProvider/ThemeProvider.js.map +1 -1
- package/dist/esm/providers/WalletProvider/WalletProvider.js.map +1 -1
- package/dist/esm/providers/WalletProvider/useExternalWalletProvider.js.map +1 -1
- package/dist/esm/providers/WidgetProvider/WidgetProvider.js.map +1 -1
- package/dist/esm/stores/StoreProvider.js.map +1 -1
- package/dist/esm/stores/bookmarks/BookmarkStore.js.map +1 -1
- package/dist/esm/stores/bookmarks/createBookmarkStore.js.map +1 -1
- package/dist/esm/stores/bookmarks/useBookmarkActions.js.map +1 -1
- package/dist/esm/stores/bookmarks/useBookmarks.js.map +1 -1
- package/dist/esm/stores/chains/ChainOrderStore.js.map +1 -1
- package/dist/esm/stores/chains/createChainOrderStore.js.map +1 -1
- package/dist/esm/stores/chains/useChainOrder.js.map +1 -1
- package/dist/esm/stores/form/FormStore.js.map +1 -1
- package/dist/esm/stores/form/FormUpdater.js.map +1 -1
- package/dist/esm/stores/form/URLSearchParamsBuilder.js.map +1 -1
- package/dist/esm/stores/form/createFormStore.js.map +1 -1
- package/dist/esm/stores/form/getDefaultValuesFromQueryString.js.map +1 -1
- package/dist/esm/stores/form/useFieldActions.js.map +1 -1
- package/dist/esm/stores/form/useFieldValues.js.map +1 -1
- package/dist/esm/stores/form/useFormRef.js.map +1 -1
- package/dist/esm/stores/form/useFormStore.js.map +1 -1
- package/dist/esm/stores/form/useTouchedFields.js.map +1 -1
- package/dist/esm/stores/header/useHeaderStore.js.map +1 -1
- package/dist/esm/stores/inputMode/useInputModeStore.js.map +1 -1
- package/dist/esm/stores/pinnedTokens/PinnedTokensStore.js.map +1 -1
- package/dist/esm/stores/pinnedTokens/createPinnedTokensStore.js.map +1 -1
- package/dist/esm/stores/routes/RouteExecutionStore.js.map +1 -1
- package/dist/esm/stores/routes/createRouteExecutionStore.js.map +1 -1
- package/dist/esm/stores/routes/useIntermediateRoutesStore.js.map +1 -1
- package/dist/esm/stores/routes/useRouteExecutionIndicator.js.map +1 -1
- package/dist/esm/stores/routes/useSetExecutableRoute.js.map +1 -1
- package/dist/esm/stores/routes/utils.js.map +1 -1
- package/dist/esm/stores/settings/SettingsStore.js.map +1 -1
- package/dist/esm/stores/settings/createSettingsStore.js.map +1 -1
- package/dist/esm/stores/settings/useSettings.js.map +1 -1
- package/dist/esm/stores/settings/useSettingsActions.js.map +1 -1
- package/dist/esm/stores/settings/useSplitSubvariantStore.js.map +1 -1
- package/dist/esm/themes/createTheme.js.map +1 -1
- package/dist/esm/themes/utils.js.map +1 -1
- package/dist/esm/types/events.js.map +1 -1
- package/dist/esm/types/widget.js.map +1 -1
- package/dist/esm/utils/compactNumberFormatter.js.map +1 -1
- package/dist/esm/utils/converters.js.map +1 -1
- package/dist/esm/utils/currencyExtendedFormatter.js.map +1 -1
- package/dist/esm/utils/deepEqual.js.map +1 -1
- package/dist/esm/utils/deepMerge.js.map +1 -1
- package/dist/esm/utils/fees.js.map +1 -1
- package/dist/esm/utils/format.js.map +1 -1
- package/dist/esm/utils/getActionMessage.js.map +1 -1
- package/dist/esm/utils/getErrorMessage.js.map +1 -1
- package/dist/esm/utils/getPriceImpact.js.map +1 -1
- package/dist/esm/utils/input.js.map +1 -1
- package/dist/esm/utils/item.js.map +1 -1
- package/dist/esm/utils/percentFormatter.js.map +1 -1
- package/dist/esm/utils/prepareActions.js.map +1 -1
- package/dist/esm/utils/timer.js.map +1 -1
- package/dist/esm/utils/token.js.map +1 -1
- package/dist/esm/utils/tokenList.js.map +1 -1
- package/dist/esm/utils/variant.js.map +1 -1
- package/dist/esm/utils/widgetSize.js.map +1 -1
- package/package.json +12 -12
- package/src/components/Chains/AllChainsAvatar.tsx +1 -1
- package/src/components/SendToWallet/SendToWalletButton.tsx +1 -1
- package/src/config/version.ts +1 -1
- package/src/hooks/useActionMessage.ts +4 -3
- package/src/hooks/useRouteExecution.ts +0 -2
- package/src/pages/TransactionDetailsPage/StepActionRow.tsx +3 -2
- package/src/pages/TransactionDetailsPage/StepActionsList.tsx +19 -12
|
@@ -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,gBAAgB;CAC9B,MAAM,EAAE,uBAAuB,UAAU,mBAAmB;CAC5D,MAAM,CAAC,MAAM,WAAW,SAAS,MAAM;CAEvC,MAAM,eAAe,kBAAkB;
|
|
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,gBAAgB;CAC9B,MAAM,EAAE,uBAAuB,UAAU,mBAAmB;CAC5D,MAAM,CAAC,MAAM,WAAW,SAAS,MAAM;CAEvC,MAAM,eAAe,kBAAkB;EACrC,SAAS,SAAS,CAAC,KAAK;IACvB,EAAE,CAAC;CAEN,MAAM,oBAAoB;EACxB,OAAO;EACP,cAAc;;CAGhB,IAAI,CAAC,uBACH,OAAO;CAGT,OACE,oBAAC,KAAD;EACE,IAAI,EACF,IAAI,GACL;YAED,qBAAC,sBAAD,EAAA,UAAA;GACE,qBAAC,KAAD;IACE,IAAI;KACF,SAAS;KACT,cAAc;KACf;cAJH,CAME,oBAAC,aAAD,EACE,IAAI,EACF,aAAa,OACd,EACD,CAAA,EACF,oBAAC,KAAD;KACE,IAAI,EACF,UAAU,IACX;eAEA,EAAE,yBAAyB;KACxB,CAAA,CACF;;GACN,oBAAC,QAAD;IAAQ,SAAS;IAAc,WAAA;cAC5B,EAAE,uBAAuB;IACnB,CAAA;GAET,oBAACA,UAAD;IAAc;IAAM,SAAS;cAC3B,qBAAC,iBAAD,EAAA,UAAA;KACE,oBAACC,eAAD,EAAA,UAAc,EAAE,8BAA8B,EAAe,CAAA;KAC7D,oBAACC,iBAAD,EAAA,UACE,oBAACC,qBAAD,EAAA,UACG,EAAE,gCAAgC,EACjB,CAAA,EACN,CAAA;KAChB,qBAACC,iBAAD,EAAA,UAAA,CACE,oBAAC,QAAD;MAAQ,SAAS;gBAAe,EAAE,gBAAgB;MAAU,CAAA,EAC5D,oBAAC,QAAD;MAAQ,SAAQ;MAAY,SAAS;MAAa,WAAA;gBAC/C,EAAE,eAAe;MACX,CAAA,CACK,EAAA,CAAA;KACA,EAAA,CAAA;IACX,CAAA;GACY,EAAA,CAAA;EACnB,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RoutePrioritySettings.js","names":[],"sources":["../../../../src/pages/SettingsPage/RoutePrioritySettings.tsx"],"sourcesContent":["import type { Order } from '@lifi/sdk'\nimport Route from '@mui/icons-material/Route'\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\nconst Priorities: Order[] = ['CHEAPEST', 'FASTEST']\n\nexport const RoutePrioritySettings: React.FC = () => {\n const { t } = useTranslation()\n const { setValue } = useSettingsActions()\n const { isRoutePriorityChanged } = useSettingMonitor()\n const { routePriority } = useSettings(['routePriority'])\n const currentRoutePriority = routePriority ?? ''\n\n const handleRoutePriorityChange = (\n _: React.SyntheticEvent,\n routePriority: Order\n ) => {\n setValue('routePriority', routePriority)\n }\n\n return (\n <SettingCardExpandable\n value={\n <BadgedValue badgeColor=\"info\" showBadge={isRoutePriorityChanged}>\n {t(`main.tags.${currentRoutePriority.toLowerCase()}` as any)}\n </BadgedValue>\n }\n icon={<Route />}\n title={t('settings.routePriority')}\n >\n <CardTabs\n value={currentRoutePriority}\n aria-label=\"tabs\"\n indicatorColor=\"primary\"\n onChange={handleRoutePriorityChange}\n sx={{ mt: 1.5 }}\n >\n {Priorities.map((priority) => {\n return (\n <Tab\n key={priority}\n label={t(`main.tags.${priority.toLowerCase()}` as any)}\n value={priority}\n disableRipple\n />\n )\n })}\n </CardTabs>\n </SettingCardExpandable>\n )\n}\n"],"mappings":";;;;;;;;;;AAUA,MAAM,aAAsB,CAAC,YAAY,UAAU;AAEnD,MAAa,8BAAwC;CACnD,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,EAAE,aAAa,oBAAoB;CACzC,MAAM,EAAE,2BAA2B,mBAAmB;CACtD,MAAM,EAAE,kBAAkB,YAAY,CAAC,gBAAgB,CAAC;CACxD,MAAM,uBAAuB,iBAAiB;CAE9C,MAAM,6BACJ,GACA,kBACG;
|
|
1
|
+
{"version":3,"file":"RoutePrioritySettings.js","names":[],"sources":["../../../../src/pages/SettingsPage/RoutePrioritySettings.tsx"],"sourcesContent":["import type { Order } from '@lifi/sdk'\nimport Route from '@mui/icons-material/Route'\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\nconst Priorities: Order[] = ['CHEAPEST', 'FASTEST']\n\nexport const RoutePrioritySettings: React.FC = () => {\n const { t } = useTranslation()\n const { setValue } = useSettingsActions()\n const { isRoutePriorityChanged } = useSettingMonitor()\n const { routePriority } = useSettings(['routePriority'])\n const currentRoutePriority = routePriority ?? ''\n\n const handleRoutePriorityChange = (\n _: React.SyntheticEvent,\n routePriority: Order\n ) => {\n setValue('routePriority', routePriority)\n }\n\n return (\n <SettingCardExpandable\n value={\n <BadgedValue badgeColor=\"info\" showBadge={isRoutePriorityChanged}>\n {t(`main.tags.${currentRoutePriority.toLowerCase()}` as any)}\n </BadgedValue>\n }\n icon={<Route />}\n title={t('settings.routePriority')}\n >\n <CardTabs\n value={currentRoutePriority}\n aria-label=\"tabs\"\n indicatorColor=\"primary\"\n onChange={handleRoutePriorityChange}\n sx={{ mt: 1.5 }}\n >\n {Priorities.map((priority) => {\n return (\n <Tab\n key={priority}\n label={t(`main.tags.${priority.toLowerCase()}` as any)}\n value={priority}\n disableRipple\n />\n )\n })}\n </CardTabs>\n </SettingCardExpandable>\n )\n}\n"],"mappings":";;;;;;;;;;AAUA,MAAM,aAAsB,CAAC,YAAY,UAAU;AAEnD,MAAa,8BAAwC;CACnD,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,EAAE,aAAa,oBAAoB;CACzC,MAAM,EAAE,2BAA2B,mBAAmB;CACtD,MAAM,EAAE,kBAAkB,YAAY,CAAC,gBAAgB,CAAC;CACxD,MAAM,uBAAuB,iBAAiB;CAE9C,MAAM,6BACJ,GACA,kBACG;EACH,SAAS,iBAAiB,cAAc;;CAG1C,OACE,oBAAC,uBAAD;EACE,OACE,oBAAC,aAAD;GAAa,YAAW;GAAO,WAAW;aACvC,EAAE,aAAa,qBAAqB,aAAa,GAAU;GAChD,CAAA;EAEhB,MAAM,oBAAC,OAAD,EAAS,CAAA;EACf,OAAO,EAAE,yBAAyB;YAElC,oBAAC,UAAD;GACE,OAAO;GACP,cAAW;GACX,gBAAe;GACf,UAAU;GACV,IAAI,EAAE,IAAI,KAAK;aAEd,WAAW,KAAK,aAAa;IAC5B,OACE,oBAAC,KAAD;KAEE,OAAO,EAAE,aAAa,SAAS,aAAa,GAAU;KACtD,OAAO;KACP,eAAA;KACA,EAJK,SAIL;KAEJ;GACO,CAAA;EACW,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 { PropsWithChildren, ReactNode } from 'react'\nimport {\n type ForwardRefExoticComponent,\n forwardRef,\n type RefAttributes,\n useId,\n useImperativeHandle,\n useRef,\n} 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: ForwardRefExoticComponent<\n PropsWithChildren<SettingCardExpandableProps> &\n RefAttributes<SettingCardExpandableRef>\n> = forwardRef<\n SettingCardExpandableRef,\n PropsWithChildren<SettingCardExpandableProps>\n>(\n (\n { icon, title, value, children, disabled, keepValueVisible, onEntered },\n ref\n ) => {\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)\n"],"mappings":";;;;;;;AAgCA,MAAa,wBAGT,YAKA,EAAE,MAAM,OAAO,OAAO,UAAU,UAAU,kBAAkB,aAC5D,QACG;CACH,MAAM,EAAE,UAAU,mBAAmB,2BAA2B;CAChE,MAAM,WAAW,OAAO;CACxB,MAAM,aAAa,OAAO;CAC1B,MAAM,YAAY,OAA0B,KAAK;
|
|
1
|
+
{"version":3,"file":"SettingCardExpandable.js","names":["Card"],"sources":["../../../../../src/pages/SettingsPage/SettingsCard/SettingCardExpandable.tsx"],"sourcesContent":["import { Collapse } from '@mui/material'\nimport type { PropsWithChildren, ReactNode } from 'react'\nimport {\n type ForwardRefExoticComponent,\n forwardRef,\n type RefAttributes,\n useId,\n useImperativeHandle,\n useRef,\n} 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: ForwardRefExoticComponent<\n PropsWithChildren<SettingCardExpandableProps> &\n RefAttributes<SettingCardExpandableRef>\n> = forwardRef<\n SettingCardExpandableRef,\n PropsWithChildren<SettingCardExpandableProps>\n>(\n (\n { icon, title, value, children, disabled, keepValueVisible, onEntered },\n ref\n ) => {\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)\n"],"mappings":";;;;;;;AAgCA,MAAa,wBAGT,YAKA,EAAE,MAAM,OAAO,OAAO,UAAU,UAAU,kBAAkB,aAC5D,QACG;CACH,MAAM,EAAE,UAAU,mBAAmB,2BAA2B;CAChE,MAAM,WAAW,OAAO;CACxB,MAAM,aAAa,OAAO;CAC1B,MAAM,YAAY,OAA0B,KAAK;CAEjD,oBACE,YACO;EACL,SAAS,UAAU;EACnB,YAAY;EACZ;EACD,GACD,CAAC,UAAU,eAAe,CAC3B;CAED,OACE,qBAACA,QAAD;EAAM,IAAI,EAAE,GAAG,GAAG;YAAlB,CACE,qBAAC,eAAD;GACE,KAAK;GACL,IAAI;GACJ,iBAAe;GACf,iBAAe;GACf,SAAS,WAAW,KAAA,UAAkB,gBAAgB;GACtD,eAAA;GACA,IAAI;IAAE,GAAG;IAAG,QAAQ,WAAW,YAAY;IAAW;aAPxD,CASE,qBAAC,oBAAD,EAAA,UAAA,CACG,MACD,oBAAC,WAAD,EAAA,UAAY,OAAkB,CAAA,CACX,EAAA,CAAA,GACnB,CAAC,YAAY,qBAAqB,MACtB;MAChB,oBAAC,UAAD;GACE,IAAI;GACJ,MAAK;GACL,mBAAiB;GACjB,IAAI;GACJ,cAAA;GACA,eAAA;GACW;GAEV;GACQ,CAAA,CACN;;EAGZ"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SettingsAccordian.js","names":[],"sources":["../../../../../src/pages/SettingsPage/SettingsCard/SettingsAccordian.tsx"],"sourcesContent":["import type { PropsWithChildren } from 'react'\nimport { createContext, useContext, useEffect, useId, useState } from 'react'\n\nconst SettingsAccordionContext = createContext({\n setOpenCard: (_id: string) => {},\n openCard: '',\n})\n\nexport const SettingsCardAccordion: React.FC<PropsWithChildren> = ({\n children,\n}) => {\n const [openCard, setOpenCard] = useState('')\n\n return (\n <SettingsAccordionContext.Provider value={{ openCard, setOpenCard }}>\n {children}\n </SettingsAccordionContext.Provider>\n )\n}\n\nexport const useSettingsCardExpandable = (): {\n expanded: boolean\n toggleExpanded: (forceExpanded?: boolean) => void\n} => {\n const settingCardExpandableId = useId()\n const [expanded, setExpanded] = useState(false)\n const { openCard, setOpenCard } = useContext(SettingsAccordionContext)\n\n const toggleExpanded = (forceExpanded?: boolean) => {\n const newExpanded = forceExpanded ?? !expanded\n setExpanded(newExpanded)\n\n if (newExpanded && openCard !== settingCardExpandableId) {\n setOpenCard(settingCardExpandableId)\n }\n }\n\n useEffect(() => {\n if (openCard !== settingCardExpandableId) {\n setExpanded(false)\n }\n }, [settingCardExpandableId, openCard])\n\n return {\n expanded: expanded,\n toggleExpanded: toggleExpanded,\n }\n}\n"],"mappings":";;;AAGA,MAAM,2BAA2B,cAAc;CAC7C,cAAc,QAAgB;CAC9B,UAAU;CACX,CAAC;AAEF,MAAa,yBAAsD,EACjE,eACI;CACJ,MAAM,CAAC,UAAU,eAAe,SAAS,GAAG;
|
|
1
|
+
{"version":3,"file":"SettingsAccordian.js","names":[],"sources":["../../../../../src/pages/SettingsPage/SettingsCard/SettingsAccordian.tsx"],"sourcesContent":["import type { PropsWithChildren } from 'react'\nimport { createContext, useContext, useEffect, useId, useState } from 'react'\n\nconst SettingsAccordionContext = createContext({\n setOpenCard: (_id: string) => {},\n openCard: '',\n})\n\nexport const SettingsCardAccordion: React.FC<PropsWithChildren> = ({\n children,\n}) => {\n const [openCard, setOpenCard] = useState('')\n\n return (\n <SettingsAccordionContext.Provider value={{ openCard, setOpenCard }}>\n {children}\n </SettingsAccordionContext.Provider>\n )\n}\n\nexport const useSettingsCardExpandable = (): {\n expanded: boolean\n toggleExpanded: (forceExpanded?: boolean) => void\n} => {\n const settingCardExpandableId = useId()\n const [expanded, setExpanded] = useState(false)\n const { openCard, setOpenCard } = useContext(SettingsAccordionContext)\n\n const toggleExpanded = (forceExpanded?: boolean) => {\n const newExpanded = forceExpanded ?? !expanded\n setExpanded(newExpanded)\n\n if (newExpanded && openCard !== settingCardExpandableId) {\n setOpenCard(settingCardExpandableId)\n }\n }\n\n useEffect(() => {\n if (openCard !== settingCardExpandableId) {\n setExpanded(false)\n }\n }, [settingCardExpandableId, openCard])\n\n return {\n expanded: expanded,\n toggleExpanded: toggleExpanded,\n }\n}\n"],"mappings":";;;AAGA,MAAM,2BAA2B,cAAc;CAC7C,cAAc,QAAgB;CAC9B,UAAU;CACX,CAAC;AAEF,MAAa,yBAAsD,EACjE,eACI;CACJ,MAAM,CAAC,UAAU,eAAe,SAAS,GAAG;CAE5C,OACE,oBAAC,yBAAyB,UAA1B;EAAmC,OAAO;GAAE;GAAU;GAAa;EAChE;EACiC,CAAA;;AAIxC,MAAa,kCAGR;CACH,MAAM,0BAA0B,OAAO;CACvC,MAAM,CAAC,UAAU,eAAe,SAAS,MAAM;CAC/C,MAAM,EAAE,UAAU,gBAAgB,WAAW,yBAAyB;CAEtE,MAAM,kBAAkB,kBAA4B;EAClD,MAAM,cAAc,iBAAiB,CAAC;EACtC,YAAY,YAAY;EAExB,IAAI,eAAe,aAAa,yBAC9B,YAAY,wBAAwB;;CAIxC,gBAAgB;EACd,IAAI,aAAa,yBACf,YAAY,MAAM;IAEnB,CAAC,yBAAyB,SAAS,CAAC;CAEvC,OAAO;EACK;EACM;EACjB"}
|
|
@@ -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 { HiddenUI } from '../../types/widget.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 bottomGutters>\n <SettingsList>\n <SettingsCardAccordion>\n <ThemeSettings />\n <LanguageSetting />\n <RoutePrioritySettings />\n <GasPriceSettings />\n <SlippageSettings />\n {!hiddenUI?.includes(HiddenUI.HideSmallBalances) && (\n <SmallBalanceFilterSettings />\n )}\n <BridgeAndExchangeSettings type=\"Bridges\" />\n <BridgeAndExchangeSettings type=\"Exchanges\" />\n </SettingsCardAccordion>\n </SettingsList>\n <ResetSettingsButton />\n </PageContainer>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;AAiBA,MAAa,qBAAkC;CAC7C,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,EAAE,aAAa,iBAAiB;
|
|
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 { HiddenUI } from '../../types/widget.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 bottomGutters>\n <SettingsList>\n <SettingsCardAccordion>\n <ThemeSettings />\n <LanguageSetting />\n <RoutePrioritySettings />\n <GasPriceSettings />\n <SlippageSettings />\n {!hiddenUI?.includes(HiddenUI.HideSmallBalances) && (\n <SmallBalanceFilterSettings />\n )}\n <BridgeAndExchangeSettings type=\"Bridges\" />\n <BridgeAndExchangeSettings type=\"Exchanges\" />\n </SettingsCardAccordion>\n </SettingsList>\n <ResetSettingsButton />\n </PageContainer>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;AAiBA,MAAa,qBAAkC;CAC7C,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,EAAE,aAAa,iBAAiB;CACtC,UAAU,EAAE,kBAAkB,CAAC;CAE/B,OACE,qBAAC,eAAD;EAAe,eAAA;YAAf,CACE,oBAAC,cAAD,EAAA,UACE,qBAAC,uBAAD,EAAA,UAAA;GACE,oBAAC,eAAD,EAAiB,CAAA;GACjB,oBAAC,iBAAD,EAAmB,CAAA;GACnB,oBAAC,uBAAD,EAAyB,CAAA;GACzB,oBAAC,kBAAD,EAAoB,CAAA;GACpB,oBAAC,kBAAD,EAAoB,CAAA;GACnB,CAAC,UAAU,SAAA,oBAAoC,IAC9C,oBAAC,4BAAD,EAA8B,CAAA;GAEhC,oBAAC,2BAAD,EAA2B,MAAK,WAAY,CAAA;GAC5C,oBAAC,2BAAD,EAA2B,MAAK,aAAc,CAAA;GACxB,EAAA,CAAA,EACX,CAAA,EACf,oBAAC,qBAAD,EAAuB,CAAA,CACT"}
|
|
@@ -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 WarningRounded from '@mui/icons-material/WarningRounded'\nimport { Box, Typography } from '@mui/material'\nimport type { ChangeEventHandler, FocusEventHandler } from 'react'\nimport { useRef, useState } from 'react'\nimport { useTranslation } from 'react-i18next'\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 { BadgedValue } from '../SettingsCard/BadgedValue.js'\nimport { SettingCardExpandable } from '../SettingsCard/SettingCardExpandable.js'\nimport {\n SettingsCustomInput,\n SettingsDefaultButton,\n SettingsFieldSet,\n SlippageLimitsWarningContainer,\n} from './SlippageSettings.style.js'\n\nconst defaultSlippageInputValue = '0.5'\nconst maxFractionDigits = 5\n\nexport const SlippageSettings: React.FC = () => {\n const { t } = useTranslation()\n const {\n isSlippageNotRecommended,\n isSlippageUnderRecommendedLimits,\n isSlippageOutsideRecommendedLimits,\n isSlippageChanged,\n } = useSettingMonitor()\n const { slippage } = useSettings(['slippage'])\n const { setValue } = useSettingsActions()\n const defaultValue = useRef(slippage)\n const [focused, setFocused] = useState<'input' | 'button'>()\n\n const customInputValue =\n !slippage || slippage === defaultSlippage\n ? defaultSlippageInputValue\n : slippage\n\n const [inputValue, setInputValue] = useState(customInputValue)\n\n const handleDefaultClick = () => {\n setValue('slippage', defaultSlippage)\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 setFocused('input')\n formatAndSetSlippage(event.target.value)\n }\n\n const handleInputBlur: FocusEventHandler<HTMLInputElement> = (event) => {\n setFocused(undefined)\n formatAndSetSlippage(event.target.value)\n }\n\n const badgeColor = isSlippageNotRecommended\n ? 'warning'\n : isSlippageChanged\n ? 'info'\n : undefined\n\n const slippageWarningText = isSlippageOutsideRecommendedLimits\n ? t('warning.message.slippageOutsideRecommendedLimits')\n : isSlippageUnderRecommendedLimits\n ? t('warning.message.slippageUnderRecommendedLimits')\n : ''\n\n return (\n <SettingCardExpandable\n value={\n <BadgedValue badgeColor={badgeColor} showBadge={!!badgeColor}>\n {slippage ? `${slippage}%` : t('button.auto')}\n </BadgedValue>\n }\n icon={<Percent />}\n title={t('settings.slippage')}\n >\n <Box\n sx={{\n mt: 1.5,\n }}\n >\n <SettingsFieldSet>\n <SettingsDefaultButton\n selected={defaultSlippage === slippage && focused !== 'input'}\n onFocus={() => {\n setFocused('button')\n }}\n onBlur={() => {\n setFocused(undefined)\n }}\n onClick={handleDefaultClick}\n disableRipple\n >\n {t('button.auto')}\n </SettingsDefaultButton>\n <SettingsCustomInput\n selected={defaultSlippage !== slippage && focused !== 'button'}\n placeholder={focused === 'input' ? '' : t('settings.custom')}\n inputProps={{\n inputMode: 'decimal',\n }}\n onChange={handleInputUpdate}\n onFocus={handleInputFocus}\n value={inputValue}\n autoComplete=\"off\"\n onBlur={handleInputBlur}\n />\n </SettingsFieldSet>\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 </SettingCardExpandable>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;AAoBA,MAAM,4BAA4B;AAClC,MAAM,oBAAoB;AAE1B,MAAa,yBAAmC;CAC9C,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,EACJ,0BACA,kCACA,oCACA,sBACE,mBAAmB;CACvB,MAAM,EAAE,aAAa,YAAY,CAAC,WAAW,CAAC;CAC9C,MAAM,EAAE,aAAa,oBAAoB;CACzC,MAAM,eAAe,OAAO,SAAS;CACrC,MAAM,CAAC,SAAS,cAAc,UAA8B;CAO5D,MAAM,CAAC,YAAY,iBAAiB,SAJlC,CAAC,YAAY,aAAA,KAAA,IACT,4BACA,SAEwD;CAE9D,MAAM,2BAA2B;
|
|
1
|
+
{"version":3,"file":"SlippageSettings.js","names":[],"sources":["../../../../../src/pages/SettingsPage/SlippageSettings/SlippageSettings.tsx"],"sourcesContent":["import Percent from '@mui/icons-material/Percent'\nimport WarningRounded from '@mui/icons-material/WarningRounded'\nimport { Box, Typography } from '@mui/material'\nimport type { ChangeEventHandler, FocusEventHandler } from 'react'\nimport { useRef, useState } from 'react'\nimport { useTranslation } from 'react-i18next'\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 { BadgedValue } from '../SettingsCard/BadgedValue.js'\nimport { SettingCardExpandable } from '../SettingsCard/SettingCardExpandable.js'\nimport {\n SettingsCustomInput,\n SettingsDefaultButton,\n SettingsFieldSet,\n SlippageLimitsWarningContainer,\n} from './SlippageSettings.style.js'\n\nconst defaultSlippageInputValue = '0.5'\nconst maxFractionDigits = 5\n\nexport const SlippageSettings: React.FC = () => {\n const { t } = useTranslation()\n const {\n isSlippageNotRecommended,\n isSlippageUnderRecommendedLimits,\n isSlippageOutsideRecommendedLimits,\n isSlippageChanged,\n } = useSettingMonitor()\n const { slippage } = useSettings(['slippage'])\n const { setValue } = useSettingsActions()\n const defaultValue = useRef(slippage)\n const [focused, setFocused] = useState<'input' | 'button'>()\n\n const customInputValue =\n !slippage || slippage === defaultSlippage\n ? defaultSlippageInputValue\n : slippage\n\n const [inputValue, setInputValue] = useState(customInputValue)\n\n const handleDefaultClick = () => {\n setValue('slippage', defaultSlippage)\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 setFocused('input')\n formatAndSetSlippage(event.target.value)\n }\n\n const handleInputBlur: FocusEventHandler<HTMLInputElement> = (event) => {\n setFocused(undefined)\n formatAndSetSlippage(event.target.value)\n }\n\n const badgeColor = isSlippageNotRecommended\n ? 'warning'\n : isSlippageChanged\n ? 'info'\n : undefined\n\n const slippageWarningText = isSlippageOutsideRecommendedLimits\n ? t('warning.message.slippageOutsideRecommendedLimits')\n : isSlippageUnderRecommendedLimits\n ? t('warning.message.slippageUnderRecommendedLimits')\n : ''\n\n return (\n <SettingCardExpandable\n value={\n <BadgedValue badgeColor={badgeColor} showBadge={!!badgeColor}>\n {slippage ? `${slippage}%` : t('button.auto')}\n </BadgedValue>\n }\n icon={<Percent />}\n title={t('settings.slippage')}\n >\n <Box\n sx={{\n mt: 1.5,\n }}\n >\n <SettingsFieldSet>\n <SettingsDefaultButton\n selected={defaultSlippage === slippage && focused !== 'input'}\n onFocus={() => {\n setFocused('button')\n }}\n onBlur={() => {\n setFocused(undefined)\n }}\n onClick={handleDefaultClick}\n disableRipple\n >\n {t('button.auto')}\n </SettingsDefaultButton>\n <SettingsCustomInput\n selected={defaultSlippage !== slippage && focused !== 'button'}\n placeholder={focused === 'input' ? '' : t('settings.custom')}\n inputProps={{\n inputMode: 'decimal',\n }}\n onChange={handleInputUpdate}\n onFocus={handleInputFocus}\n value={inputValue}\n autoComplete=\"off\"\n onBlur={handleInputBlur}\n />\n </SettingsFieldSet>\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 </SettingCardExpandable>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;AAoBA,MAAM,4BAA4B;AAClC,MAAM,oBAAoB;AAE1B,MAAa,yBAAmC;CAC9C,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,EACJ,0BACA,kCACA,oCACA,sBACE,mBAAmB;CACvB,MAAM,EAAE,aAAa,YAAY,CAAC,WAAW,CAAC;CAC9C,MAAM,EAAE,aAAa,oBAAoB;CACzC,MAAM,eAAe,OAAO,SAAS;CACrC,MAAM,CAAC,SAAS,cAAc,UAA8B;CAO5D,MAAM,CAAC,YAAY,iBAAiB,SAJlC,CAAC,YAAY,aAAA,KAAA,IACT,4BACA,SAEwD;CAE9D,MAAM,2BAA2B;EAC/B,SAAS,YAAA,KAAA,EAA4B;;CAGvC,MAAM,wBAAwB,OAAe,gBAAgB,UAAU;EACrE,MAAM,oBAAoB,eACxB,OACA,aAAa,SACb,cACD;EACD,MAAM,iBACJ,OAAO,kBAAkB,KAAK,KAAK,CAAC,gBAChC,MACA,kBAAkB,mBAAmB,mBAAmB,cAAc;EAC5E,MAAM,YACJ,OAAO,eAAe,GAAG,KACrB,oBAAoB,IACpB,oBAAoB;EAC1B,MAAM,cAAc,eAAe,MAAM,GAAG,UAAU;EACtD,cAAc,YAAY;EAC1B,SAAS,YAAY,YAAY,SAAS,cAAA,KAAA,EAA8B;;CAG1E,MAAM,qBAA2D,UAAU;EACzE,qBAAqB,MAAM,OAAO,OAAO,KAAK;;CAGhD,MAAM,oBAAyD,UAAU;EACvE,WAAW,QAAQ;EACnB,qBAAqB,MAAM,OAAO,MAAM;;CAG1C,MAAM,mBAAwD,UAAU;EACtE,WAAW,KAAA,EAAU;EACrB,qBAAqB,MAAM,OAAO,MAAM;;CAG1C,MAAM,aAAa,2BACf,YACA,oBACE,SACA,KAAA;CAEN,MAAM,sBAAsB,qCACxB,EAAE,mDAAmD,GACrD,mCACE,EAAE,iDAAiD,GACnD;CAEN,OACE,oBAAC,uBAAD;EACE,OACE,oBAAC,aAAD;GAAyB;GAAY,WAAW,CAAC,CAAC;aAC/C,WAAW,GAAG,SAAS,KAAK,EAAE,cAAc;GACjC,CAAA;EAEhB,MAAM,oBAAC,SAAD,EAAW,CAAA;EACjB,OAAO,EAAE,oBAAoB;YAE7B,qBAAC,KAAD;GACE,IAAI,EACF,IAAI,KACL;aAHH,CAKE,qBAAC,kBAAD,EAAA,UAAA,CACE,oBAAC,uBAAD;IACE,UAAA,KAAA,MAA8B,YAAY,YAAY;IACtD,eAAe;KACb,WAAW,SAAS;;IAEtB,cAAc;KACZ,WAAW,KAAA,EAAU;;IAEvB,SAAS;IACT,eAAA;cAEC,EAAE,cAAc;IACK,CAAA,EACxB,oBAAC,qBAAD;IACE,UAAA,KAAA,MAA8B,YAAY,YAAY;IACtD,aAAa,YAAY,UAAU,KAAK,EAAE,kBAAkB;IAC5D,YAAY,EACV,WAAW,WACZ;IACD,UAAU;IACV,SAAS;IACT,OAAO;IACP,cAAa;IACb,QAAQ;IACR,CAAA,CACe,EAAA,CAAA,EAClB,4BACC,qBAAC,gCAAD,EAAA,UAAA,CACE,oBAAC,gBAAD,EAAgB,OAAM,WAAY,CAAA,EAClC,oBAAC,YAAD;IACE,IAAI;KACF,UAAU;KACV,YAAY;KACb;cAEA;IACU,CAAA,CACkB,EAAA,CAAA,CAE/B;;EACgB,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SlippageSettings.style.js","names":[],"sources":["../../../../../src/pages/SettingsPage/SlippageSettings/SlippageSettings.style.tsx"],"sourcesContent":["import type { Theme } from '@mui/material'\nimport {\n Box,\n ButtonBase,\n InputBase,\n inputBaseClasses,\n styled,\n} from '@mui/material'\nimport type React from 'react'\n\nexport const SettingsFieldSet: React.FC<\n React.ComponentProps<typeof Box> & SettingsControlProps\n> = styled(Box)(({ theme }) => ({\n display: 'flex',\n borderRadius: theme.vars.shape.borderRadius,\n padding: theme.spacing(0.5),\n gap: theme.spacing(0.5),\n height: '3.5rem',\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.common.onBackground} 4%, transparent)`,\n ...theme.applyStyles('dark', {\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.common.onBackground} 8%, transparent)`,\n }),\n}))\n\nconst settingsControlSelected = (theme: Theme) => ({\n backgroundColor: theme.vars.palette.background.paper,\n boxShadow: `0px 2px 4px color-mix(in srgb, ${theme.vars.palette.common.onBackground} 4%, transparent)`,\n ...theme.applyStyles('dark', {\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.common.background} 56%, transparent)`,\n boxShadow: `0px 2px 4px color-mix(in srgb, ${theme.vars.palette.common.background} 4%, transparent)`,\n }),\n borderRadius: `calc(${theme.vars.shape.borderRadius} - 4px)`,\n})\n\ninterface SettingsControlProps {\n selected?: boolean\n}\n\nexport const SettingsDefaultButton: React.FC<\n React.ComponentProps<typeof ButtonBase> & SettingsControlProps\n> = styled(ButtonBase)<SettingsControlProps>(({ theme, selected }) => {\n const settingsControlSelectedStyles = settingsControlSelected(theme)\n const selectedStyle = selected\n ? {\n '&:not(:focus)': {\n ...settingsControlSelectedStyles,\n },\n }\n : {}\n\n return {\n height: '100%',\n width: '100%',\n fontSize: '1rem',\n fontWeight: 700,\n '&:focus': {\n ...settingsControlSelectedStyles,\n },\n ...selectedStyle,\n }\n})\n\nexport const SettingsCustomInput: React.FC<\n React.ComponentProps<typeof InputBase> & SettingsControlProps\n> = styled(InputBase)<SettingsControlProps>(({ theme, selected }) => {\n const settingsControlSelectedStyles = settingsControlSelected(theme)\n const selectedStyle = selected\n ? {\n '&:not(:focus)': {\n ...settingsControlSelectedStyles,\n },\n }\n : {}\n\n return {\n height: '100%',\n width: '100%',\n [`.${inputBaseClasses.input}`]: {\n height: '100%',\n width: '100%',\n padding: 0,\n textAlign: 'center',\n '&::placeholder': {\n fontSize: '1rem',\n fontWeight: 700,\n opacity: 1,\n },\n '&:focus': {\n ...settingsControlSelectedStyles,\n },\n ...selectedStyle,\n },\n }\n})\n\nexport const SlippageLimitsWarningContainer: React.FC<\n React.ComponentProps<typeof Box>\n> = styled(Box)(({ theme }) => ({\n display: 'flex',\n gap: theme.spacing(1.25),\n marginTop: theme.spacing(1.5),\n}))\n"],"mappings":";;AAUA,MAAa,mBAET,OAAO,IAAI,EAAE,EAAE,aAAa;CAC9B,SAAS;CACT,cAAc,MAAM,KAAK,MAAM;CAC/B,SAAS,MAAM,QAAQ,GAAI;CAC3B,KAAK,MAAM,QAAQ,GAAI;CACvB,QAAQ;CACR,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,OAAO,aAAa;CAC9E,GAAG,MAAM,YAAY,QAAQ,EAC3B,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,OAAO,aAAa,oBAC/E,CAAC;CACH,EAAE;AAEH,MAAM,2BAA2B,WAAkB;CACjD,iBAAiB,MAAM,KAAK,QAAQ,WAAW;CAC/C,WAAW,kCAAkC,MAAM,KAAK,QAAQ,OAAO,aAAa;CACpF,GAAG,MAAM,YAAY,QAAQ;EAC3B,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,OAAO,WAAW;EAC5E,WAAW,kCAAkC,MAAM,KAAK,QAAQ,OAAO,WAAW;EACnF,CAAC;CACF,cAAc,QAAQ,MAAM,KAAK,MAAM,aAAa;CACrD;AAMD,MAAa,wBAET,OAAO,WAAW,EAAwB,EAAE,OAAO,eAAe;CACpE,MAAM,gCAAgC,wBAAwB,MAAM;CACpE,MAAM,gBAAgB,WAClB,EACE,iBAAiB,EACf,GAAG,+BACJ,EACF,GACD,EAAE;
|
|
1
|
+
{"version":3,"file":"SlippageSettings.style.js","names":[],"sources":["../../../../../src/pages/SettingsPage/SlippageSettings/SlippageSettings.style.tsx"],"sourcesContent":["import type { Theme } from '@mui/material'\nimport {\n Box,\n ButtonBase,\n InputBase,\n inputBaseClasses,\n styled,\n} from '@mui/material'\nimport type React from 'react'\n\nexport const SettingsFieldSet: React.FC<\n React.ComponentProps<typeof Box> & SettingsControlProps\n> = styled(Box)(({ theme }) => ({\n display: 'flex',\n borderRadius: theme.vars.shape.borderRadius,\n padding: theme.spacing(0.5),\n gap: theme.spacing(0.5),\n height: '3.5rem',\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.common.onBackground} 4%, transparent)`,\n ...theme.applyStyles('dark', {\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.common.onBackground} 8%, transparent)`,\n }),\n}))\n\nconst settingsControlSelected = (theme: Theme) => ({\n backgroundColor: theme.vars.palette.background.paper,\n boxShadow: `0px 2px 4px color-mix(in srgb, ${theme.vars.palette.common.onBackground} 4%, transparent)`,\n ...theme.applyStyles('dark', {\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.common.background} 56%, transparent)`,\n boxShadow: `0px 2px 4px color-mix(in srgb, ${theme.vars.palette.common.background} 4%, transparent)`,\n }),\n borderRadius: `calc(${theme.vars.shape.borderRadius} - 4px)`,\n})\n\ninterface SettingsControlProps {\n selected?: boolean\n}\n\nexport const SettingsDefaultButton: React.FC<\n React.ComponentProps<typeof ButtonBase> & SettingsControlProps\n> = styled(ButtonBase)<SettingsControlProps>(({ theme, selected }) => {\n const settingsControlSelectedStyles = settingsControlSelected(theme)\n const selectedStyle = selected\n ? {\n '&:not(:focus)': {\n ...settingsControlSelectedStyles,\n },\n }\n : {}\n\n return {\n height: '100%',\n width: '100%',\n fontSize: '1rem',\n fontWeight: 700,\n '&:focus': {\n ...settingsControlSelectedStyles,\n },\n ...selectedStyle,\n }\n})\n\nexport const SettingsCustomInput: React.FC<\n React.ComponentProps<typeof InputBase> & SettingsControlProps\n> = styled(InputBase)<SettingsControlProps>(({ theme, selected }) => {\n const settingsControlSelectedStyles = settingsControlSelected(theme)\n const selectedStyle = selected\n ? {\n '&:not(:focus)': {\n ...settingsControlSelectedStyles,\n },\n }\n : {}\n\n return {\n height: '100%',\n width: '100%',\n [`.${inputBaseClasses.input}`]: {\n height: '100%',\n width: '100%',\n padding: 0,\n textAlign: 'center',\n '&::placeholder': {\n fontSize: '1rem',\n fontWeight: 700,\n opacity: 1,\n },\n '&:focus': {\n ...settingsControlSelectedStyles,\n },\n ...selectedStyle,\n },\n }\n})\n\nexport const SlippageLimitsWarningContainer: React.FC<\n React.ComponentProps<typeof Box>\n> = styled(Box)(({ theme }) => ({\n display: 'flex',\n gap: theme.spacing(1.25),\n marginTop: theme.spacing(1.5),\n}))\n"],"mappings":";;AAUA,MAAa,mBAET,OAAO,IAAI,EAAE,EAAE,aAAa;CAC9B,SAAS;CACT,cAAc,MAAM,KAAK,MAAM;CAC/B,SAAS,MAAM,QAAQ,GAAI;CAC3B,KAAK,MAAM,QAAQ,GAAI;CACvB,QAAQ;CACR,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,OAAO,aAAa;CAC9E,GAAG,MAAM,YAAY,QAAQ,EAC3B,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,OAAO,aAAa,oBAC/E,CAAC;CACH,EAAE;AAEH,MAAM,2BAA2B,WAAkB;CACjD,iBAAiB,MAAM,KAAK,QAAQ,WAAW;CAC/C,WAAW,kCAAkC,MAAM,KAAK,QAAQ,OAAO,aAAa;CACpF,GAAG,MAAM,YAAY,QAAQ;EAC3B,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,OAAO,WAAW;EAC5E,WAAW,kCAAkC,MAAM,KAAK,QAAQ,OAAO,WAAW;EACnF,CAAC;CACF,cAAc,QAAQ,MAAM,KAAK,MAAM,aAAa;CACrD;AAMD,MAAa,wBAET,OAAO,WAAW,EAAwB,EAAE,OAAO,eAAe;CACpE,MAAM,gCAAgC,wBAAwB,MAAM;CACpE,MAAM,gBAAgB,WAClB,EACE,iBAAiB,EACf,GAAG,+BACJ,EACF,GACD,EAAE;CAEN,OAAO;EACL,QAAQ;EACR,OAAO;EACP,UAAU;EACV,YAAY;EACZ,WAAW,EACT,GAAG,+BACJ;EACD,GAAG;EACJ;EACD;AAEF,MAAa,sBAET,OAAO,UAAU,EAAwB,EAAE,OAAO,eAAe;CACnE,MAAM,gCAAgC,wBAAwB,MAAM;CACpE,MAAM,gBAAgB,WAClB,EACE,iBAAiB,EACf,GAAG,+BACJ,EACF,GACD,EAAE;CAEN,OAAO;EACL,QAAQ;EACR,OAAO;GACN,IAAI,iBAAiB,UAAU;GAC9B,QAAQ;GACR,OAAO;GACP,SAAS;GACT,WAAW;GACX,kBAAkB;IAChB,UAAU;IACV,YAAY;IACZ,SAAS;IACV;GACD,WAAW,EACT,GAAG,+BACJ;GACD,GAAG;GACJ;EACF;EACD;AAEF,MAAa,iCAET,OAAO,IAAI,EAAE,EAAE,aAAa;CAC9B,SAAS;CACT,KAAK,MAAM,QAAQ,KAAK;CACxB,WAAW,MAAM,QAAQ,IAAI;CAC9B,EAAE"}
|
|
@@ -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,gBAAgB;CAC9B,MAAM,EAAE,0BAA0B,YAAY,CAAC,wBAAwB,CAAC;CACxE,MAAM,EAAE,aAAa,oBAAoB;CACzC,MAAM,CAAC,YAAY,iBAAiB,SAClC,yBAAyB,iBAC1B;CACD,MAAM,YAAY,OAAiC,KAAK;CACxD,MAAM,WAAW,OAAyB,KAAK;CAE/C,MAAM,yBAAyB,YAAoB,gBAAgB,UAAU;EAE3E,MAAM,iBAAiB,kBADT,WAAW,QAAQ,KAAK,
|
|
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,gBAAgB;CAC9B,MAAM,EAAE,0BAA0B,YAAY,CAAC,wBAAwB,CAAC;CACxE,MAAM,EAAE,aAAa,oBAAoB;CACzC,MAAM,CAAC,YAAY,iBAAiB,SAClC,yBAAyB,iBAC1B;CACD,MAAM,YAAY,OAAiC,KAAK;CACxD,MAAM,WAAW,OAAyB,KAAK;CAE/C,MAAM,yBAAyB,YAAoB,gBAAgB,UAAU;EAE3E,MAAM,iBAAiB,kBADT,WAAW,QAAQ,KAAK,GACQ,EAAA,GAAe,cAAc;EAC3E,IAAI,eACF,cAAc,eAAe;OACxB;GACL,MAAM,qBAAqB,kBAAkB;GAC7C,cAAc,mBAAmB;GACjC,SAAS,yBAAyB,mBAAmB;;;CAIzD,MAAM,qBAA2D,UAAU;EACzE,sBAAsB,MAAM,OAAO,OAAO,KAAK;;CAGjD,MAAM,mBAAwD,UAAU;EACtE,sBAAsB,MAAM,OAAO,OAAO,MAAM;;CAGlD,MAAM,iCACJ,UACG;EACH,SACE,yBACA,MAAM,OAAO,UAAU,mBAAmB,KAAA,EAC3C;EACD,IAAI,UAAU,SACZ,UAAU,SAAS,eAAe,MAAM,OAAO,QAAQ;;CAI3D,MAAM,uBAAuB;EAC3B,IAAI,SAAS,SACX,SAAS,QAAQ,OAAO;;CAI5B,gBAAgB;EACd,cAAc,yBAAyB,iBAAiB;IACvD,CAAC,sBAAsB,CAAC;CAE3B,OACE,oBAAC,uBAAD;EACE,KAAK;EACL,OACE,oBAACA,UAAD;GACE,SAAS,CAAC,CAAC;GACX,UAAU;GACV,cAAY,EAAE,6BAA6B;GAC3C,CAAA;EAEJ,MAAM,oBAAC,aAAD,EAAe,CAAA;EACrB,OAAO,EAAE,6BAA6B;EACtC,UAAU,CAAC;EACX,kBAAA;EACA,WAAW;YAEX,oBAAC,KAAD;GACE,IAAI,EACF,IAAI,KACL;aAED,oBAAC,kBAAD,EAAA,UACE,oBAAC,qBAAD;IACY;IACV,UAAA;IACA,YAAY,EACV,WAAW,WACZ;IACD,UAAU;IACV,QAAQ;IACR,OAAO,IAAI;IACX,cAAa;IACb,CAAA,EACe,CAAA;GACf,CAAA;EACgB,CAAA"}
|
|
@@ -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 { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport type { Appearance } from '../../types/widget.js'\nimport { HiddenUI } 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 { hiddenUI } = useWidgetConfig()\n\n if (hiddenUI?.includes(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 }\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":";;;;;;;;;;;;AAYA,MAAM,aAAa;CACjB,OAAO;CACP,MAAM;CACN,QAAQ;CACT;AAUD,MAAM,YAAqC,EACzC,OACA,OACA,MACA,GAAG,YAEH,oBAAC,SAAD;CAAgB;WACd,oBAACA,OAAD;EAAK,MAAM;EAAa;EAAO,GAAI;EAAO,eAAA;EAAgB,CAAA;CAClD,CAAA;AAGZ,MAAa,sBAAgC;CAC3C,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,EAAE,MAAM,YAAY,gBAAgB;CAC1C,MAAM,EAAE,aAAa,iBAAiB;
|
|
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 { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport type { Appearance } from '../../types/widget.js'\nimport { HiddenUI } 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 { hiddenUI } = useWidgetConfig()\n\n if (hiddenUI?.includes(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 }\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":";;;;;;;;;;;;AAYA,MAAM,aAAa;CACjB,OAAO;CACP,MAAM;CACN,QAAQ;CACT;AAUD,MAAM,YAAqC,EACzC,OACA,OACA,MACA,GAAG,YAEH,oBAAC,SAAD;CAAgB;WACd,oBAACA,OAAD;EAAK,MAAM;EAAa;EAAO,GAAI;EAAO,eAAA;EAAgB,CAAA;CAClD,CAAA;AAGZ,MAAa,sBAAgC;CAC3C,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,EAAE,MAAM,YAAY,gBAAgB;CAC1C,MAAM,EAAE,aAAa,iBAAiB;CAEtC,IAAI,UAAU,SAAA,aAA6B,EACzC,OAAO;CAGT,MAAM,aAAa,QAAQ;CAE3B,MAAM,YAAY,WAAW;CAE7B,MAAM,qBACJ,GACA,eACG;EACH,QAAQ,WAAW;;CAGrB,OACE,oBAAC,uBAAD;EACE,OAAO,qBAAC,WAAD,EAAA,UAAA,CAAY,EAAE,UAAU,aAAa,EAAC,IAAa,EAAA,CAAA;EAC1D,MAAM,oBAAC,WAAD,EAAa,CAAA;EACnB,OAAO,EAAE,sBAAsB;YAE/B,oBAAC,UAAD;GACE,OAAO;GACP,cAAW;GACX,gBAAe;GACf,UAAU;GACV,IAAI,EAAE,IAAI,KAAK;aAEd,OAAO,QAAQ,WAAW,CAAC,KAAK,CAAC,OAAO,UAAU;IACjD,MAAM,uBAAuB;IAE7B,OACE,oBAAC,UAAD;KAEE,OAAO,EAAE,UAAU,uBAAuB;KAC1C,OAAO;KACP,MAAM,oBAAC,MAAD,EAAQ,CAAA;KACd,EAJK,qBAIL;KAEJ;GACO,CAAA;EACW,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ActionRow.js","names":[],"sources":["../../../../src/pages/TransactionDetailsPage/ActionRow.tsx"],"sourcesContent":["import type { FC, ReactNode } from 'react'\nimport { ActionRowContainer, ActionRowLabel } from './ActionRow.style.js'\n\ninterface ActionRowProps {\n message: string\n startAdornment: ReactNode\n endAdornment?: ReactNode\n}\n\nexport const ActionRow: FC<ActionRowProps> = ({\n message,\n startAdornment,\n endAdornment,\n}) => {\n return (\n <ActionRowContainer>\n {startAdornment}\n <ActionRowLabel>{message}</ActionRowLabel>\n {endAdornment}\n </ActionRowContainer>\n )\n}\n"],"mappings":";;;AASA,MAAa,aAAiC,EAC5C,SACA,gBACA,mBACI;
|
|
1
|
+
{"version":3,"file":"ActionRow.js","names":[],"sources":["../../../../src/pages/TransactionDetailsPage/ActionRow.tsx"],"sourcesContent":["import type { FC, ReactNode } from 'react'\nimport { ActionRowContainer, ActionRowLabel } from './ActionRow.style.js'\n\ninterface ActionRowProps {\n message: string\n startAdornment: ReactNode\n endAdornment?: ReactNode\n}\n\nexport const ActionRow: FC<ActionRowProps> = ({\n message,\n startAdornment,\n endAdornment,\n}) => {\n return (\n <ActionRowContainer>\n {startAdornment}\n <ActionRowLabel>{message}</ActionRowLabel>\n {endAdornment}\n </ActionRowContainer>\n )\n}\n"],"mappings":";;;AASA,MAAa,aAAiC,EAC5C,SACA,gBACA,mBACI;CACJ,OACE,qBAAC,oBAAD,EAAA,UAAA;EACG;EACD,oBAAC,gBAAD,EAAA,UAAiB,SAAyB,CAAA;EACzC;EACkB,EAAA,CAAA"}
|
|
@@ -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,gBAAgB;
|
|
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,gBAAgB;CAG9B,OACE,oBAAC,YAAD;EAAY,SAHe,kBAAkB,UAGJ;YACtC,EAAE,wBAAwB;EAChB,CAAA"}
|
|
@@ -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 './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,gBAAgB;CAC9B,MAAM,YAAY,MAAM;
|
|
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 './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,gBAAgB;CAC9B,MAAM,YAAY,MAAM;CAExB,OACE,qBAAC,MAAD;EAAM,MAAK;EAAU,UAAA;YAArB,CACE,oBAAC,WAAD;GAAW,IAAI;IAAE,SAAS;IAAG,IAAI;IAAG;aAAG,EAAE,gBAAgB;GAAa,CAAA,EACtE,oBAAC,iBAAD;GAAwB;GAAkB;GAAa,CAAA,CAClD"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SentToWalletRow.js","names":[],"sources":["../../../../src/pages/TransactionDetailsPage/SentToWalletRow.tsx"],"sourcesContent":["import ContentCopyRounded from '@mui/icons-material/ContentCopyRounded'\nimport OpenInNew from '@mui/icons-material/OpenInNew'\nimport Wallet from '@mui/icons-material/Wallet'\nimport { Box, IconButton } from '@mui/material'\nimport type { MouseEvent } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useExplorer } from '../../hooks/useExplorer.js'\nimport { shortenAddress } from '../../utils/wallet.js'\nimport { ActionRow } from './ActionRow.js'\nimport { ActionIconCircle } from './ActionRow.style.js'\nimport { ExternalLink } from './ReceiptsCard.style.js'\n\ninterface SentToWalletRowProps {\n toAddress: string\n toChainId: number\n}\n\nexport const SentToWalletRow: React.FC<SentToWalletRowProps> = ({\n toAddress,\n toChainId,\n}) => {\n const { t } = useTranslation()\n const { getAddressLink } = useExplorer()\n const addressLink = getAddressLink(toAddress, toChainId)\n\n const handleCopy = (e: MouseEvent) => {\n e.stopPropagation()\n navigator.clipboard.writeText(toAddress)\n }\n\n return (\n <ActionRow\n startAdornment={\n <ActionIconCircle>\n <Wallet color=\"success\" sx={{ fontSize: 16 }} />\n </ActionIconCircle>\n }\n message={`${t('main.sentToWallet')}: ${shortenAddress(toAddress)}`}\n endAdornment={\n <Box sx={{ display: 'flex', alignItems: 'center', gap: 0.5 }}>\n <IconButton size=\"small\" onClick={handleCopy} sx={{ p: 0.5 }}>\n <ContentCopyRounded sx={{ fontSize: 16 }} />\n </IconButton>\n {addressLink ? (\n <ExternalLink\n href={addressLink}\n target=\"_blank\"\n rel=\"nofollow noreferrer\"\n >\n <OpenInNew sx={{ fontSize: 16 }} />\n </ExternalLink>\n ) : undefined}\n </Box>\n }\n />\n )\n}\n"],"mappings":";;;;;;;;;;;;AAiBA,MAAa,mBAAmD,EAC9D,WACA,gBACI;CACJ,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,EAAE,mBAAmB,aAAa;CACxC,MAAM,cAAc,eAAe,WAAW,UAAU;CAExD,MAAM,cAAc,MAAkB;
|
|
1
|
+
{"version":3,"file":"SentToWalletRow.js","names":[],"sources":["../../../../src/pages/TransactionDetailsPage/SentToWalletRow.tsx"],"sourcesContent":["import ContentCopyRounded from '@mui/icons-material/ContentCopyRounded'\nimport OpenInNew from '@mui/icons-material/OpenInNew'\nimport Wallet from '@mui/icons-material/Wallet'\nimport { Box, IconButton } from '@mui/material'\nimport type { MouseEvent } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useExplorer } from '../../hooks/useExplorer.js'\nimport { shortenAddress } from '../../utils/wallet.js'\nimport { ActionRow } from './ActionRow.js'\nimport { ActionIconCircle } from './ActionRow.style.js'\nimport { ExternalLink } from './ReceiptsCard.style.js'\n\ninterface SentToWalletRowProps {\n toAddress: string\n toChainId: number\n}\n\nexport const SentToWalletRow: React.FC<SentToWalletRowProps> = ({\n toAddress,\n toChainId,\n}) => {\n const { t } = useTranslation()\n const { getAddressLink } = useExplorer()\n const addressLink = getAddressLink(toAddress, toChainId)\n\n const handleCopy = (e: MouseEvent) => {\n e.stopPropagation()\n navigator.clipboard.writeText(toAddress)\n }\n\n return (\n <ActionRow\n startAdornment={\n <ActionIconCircle>\n <Wallet color=\"success\" sx={{ fontSize: 16 }} />\n </ActionIconCircle>\n }\n message={`${t('main.sentToWallet')}: ${shortenAddress(toAddress)}`}\n endAdornment={\n <Box sx={{ display: 'flex', alignItems: 'center', gap: 0.5 }}>\n <IconButton size=\"small\" onClick={handleCopy} sx={{ p: 0.5 }}>\n <ContentCopyRounded sx={{ fontSize: 16 }} />\n </IconButton>\n {addressLink ? (\n <ExternalLink\n href={addressLink}\n target=\"_blank\"\n rel=\"nofollow noreferrer\"\n >\n <OpenInNew sx={{ fontSize: 16 }} />\n </ExternalLink>\n ) : undefined}\n </Box>\n }\n />\n )\n}\n"],"mappings":";;;;;;;;;;;;AAiBA,MAAa,mBAAmD,EAC9D,WACA,gBACI;CACJ,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,EAAE,mBAAmB,aAAa;CACxC,MAAM,cAAc,eAAe,WAAW,UAAU;CAExD,MAAM,cAAc,MAAkB;EACpC,EAAE,iBAAiB;EACnB,UAAU,UAAU,UAAU,UAAU;;CAG1C,OACE,oBAAC,WAAD;EACE,gBACE,oBAAC,kBAAD,EAAA,UACE,oBAAC,QAAD;GAAQ,OAAM;GAAU,IAAI,EAAE,UAAU,IAAI;GAAI,CAAA,EAC/B,CAAA;EAErB,SAAS,GAAG,EAAE,oBAAoB,CAAC,IAAI,eAAe,UAAU;EAChE,cACE,qBAAC,KAAD;GAAK,IAAI;IAAE,SAAS;IAAQ,YAAY;IAAU,KAAK;IAAK;aAA5D,CACE,oBAAC,YAAD;IAAY,MAAK;IAAQ,SAAS;IAAY,IAAI,EAAE,GAAG,IAAK;cAC1D,oBAAC,oBAAD,EAAoB,IAAI,EAAE,UAAU,IAAI,EAAI,CAAA;IACjC,CAAA,EACZ,cACC,oBAAC,cAAD;IACE,MAAM;IACN,QAAO;IACP,KAAI;cAEJ,oBAAC,WAAD,EAAW,IAAI,EAAE,UAAU,IAAI,EAAI,CAAA;IACtB,CAAA,GACb,KAAA,EACA;;EAER,CAAA"}
|
|
@@ -5,8 +5,8 @@ import { ActionRow } from "./ActionRow.js";
|
|
|
5
5
|
import { jsx } from "react/jsx-runtime";
|
|
6
6
|
import OpenInNew from "@mui/icons-material/OpenInNew";
|
|
7
7
|
//#region src/pages/TransactionDetailsPage/StepActionRow.tsx
|
|
8
|
-
const StepActionRow = ({ step, action, href }) => {
|
|
9
|
-
const { title } = useActionMessage(step, action);
|
|
8
|
+
const StepActionRow = ({ step, action, href, defaultLabelsOnly }) => {
|
|
9
|
+
const { title } = useActionMessage(step, action, defaultLabelsOnly);
|
|
10
10
|
return /* @__PURE__ */ jsx(ActionRow, {
|
|
11
11
|
startAdornment: /* @__PURE__ */ jsx(IconCircle, {
|
|
12
12
|
status: action?.status === "FAILED" ? "error" : "success",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"StepActionRow.js","names":[],"sources":["../../../../src/pages/TransactionDetailsPage/StepActionRow.tsx"],"sourcesContent":["import type { ExecutionAction, LiFiStepExtended } from '@lifi/sdk'\nimport OpenInNew from '@mui/icons-material/OpenInNew'\nimport type React from 'react'\nimport { IconCircle } from '../../components/IconCircle/IconCircle.js'\nimport { useActionMessage } from '../../hooks/useActionMessage.js'\nimport { ActionRow } from './ActionRow.js'\nimport { ExternalLink } from './ReceiptsCard.style.js'\n\nexport const StepActionRow: React.FC<{\n step: LiFiStepExtended\n action: ExecutionAction\n href: string\n}> = ({ step, action, href }) => {\n const { title } = useActionMessage(step, action)\n const isFailed = action?.status === 'FAILED'\n return (\n <ActionRow\n startAdornment={\n <IconCircle status={isFailed ? 'error' : 'success'} size={24} />\n }\n message={title ?? ''}\n endAdornment={\n <ExternalLink href={href} target=\"_blank\" rel=\"nofollow noreferrer\">\n <OpenInNew sx={{ fontSize: 16 }} />\n </ExternalLink>\n }\n />\n )\n}\n"],"mappings":";;;;;;;AAQA,MAAa,
|
|
1
|
+
{"version":3,"file":"StepActionRow.js","names":[],"sources":["../../../../src/pages/TransactionDetailsPage/StepActionRow.tsx"],"sourcesContent":["import type { ExecutionAction, LiFiStepExtended } from '@lifi/sdk'\nimport OpenInNew from '@mui/icons-material/OpenInNew'\nimport type React from 'react'\nimport { IconCircle } from '../../components/IconCircle/IconCircle.js'\nimport { useActionMessage } from '../../hooks/useActionMessage.js'\nimport { ActionRow } from './ActionRow.js'\nimport { ExternalLink } from './ReceiptsCard.style.js'\n\nexport const StepActionRow: React.FC<{\n step: LiFiStepExtended\n action: ExecutionAction\n href: string\n defaultLabelsOnly?: boolean\n}> = ({ step, action, href, defaultLabelsOnly }) => {\n const { title } = useActionMessage(step, action, defaultLabelsOnly)\n const isFailed = action?.status === 'FAILED'\n return (\n <ActionRow\n startAdornment={\n <IconCircle status={isFailed ? 'error' : 'success'} size={24} />\n }\n message={title ?? ''}\n endAdornment={\n <ExternalLink href={href} target=\"_blank\" rel=\"nofollow noreferrer\">\n <OpenInNew sx={{ fontSize: 16 }} />\n </ExternalLink>\n }\n />\n )\n}\n"],"mappings":";;;;;;;AAQA,MAAa,iBAKP,EAAE,MAAM,QAAQ,MAAM,wBAAwB;CAClD,MAAM,EAAE,UAAU,iBAAiB,MAAM,QAAQ,kBAAkB;CAEnE,OACE,oBAAC,WAAD;EACE,gBACE,oBAAC,YAAD;GAAY,QAJD,QAAQ,WAAW,WAIC,UAAU;GAAW,MAAM;GAAM,CAAA;EAElE,SAAS,SAAS;EAClB,cACE,oBAAC,cAAD;GAAoB;GAAM,QAAO;GAAS,KAAI;aAC5C,oBAAC,WAAD,EAAW,IAAI,EAAE,UAAU,IAAI,EAAI,CAAA;GACtB,CAAA;EAEjB,CAAA"}
|
|
@@ -29,11 +29,17 @@ const StepActionsList = ({ route, toAddress }) => {
|
|
|
29
29
|
};
|
|
30
30
|
}).filter(({ rows }) => rows.length > 0);
|
|
31
31
|
if (!stepRows?.length) return null;
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
32
|
+
const lastStepIndex = stepRows.length - 1;
|
|
33
|
+
return /* @__PURE__ */ jsxs(TransactionList, { children: [stepRows.map(({ step, rows }, stepIndex) => {
|
|
34
|
+
const lastRowIndex = rows.length - 1;
|
|
35
|
+
const isLastStep = stepIndex === lastStepIndex;
|
|
36
|
+
return /* @__PURE__ */ jsx(TransactionList, { children: rows.map(({ action, href }, rowIndex) => /* @__PURE__ */ jsx(StepActionRow, {
|
|
37
|
+
step,
|
|
38
|
+
action,
|
|
39
|
+
href,
|
|
40
|
+
defaultLabelsOnly: !(isLastStep && rowIndex === lastRowIndex)
|
|
41
|
+
}, rowIndex)) }, step.id);
|
|
42
|
+
}), toAddress ? /* @__PURE__ */ jsx(SentToWalletRow, {
|
|
37
43
|
toAddress,
|
|
38
44
|
toChainId: route.toChainId
|
|
39
45
|
}) : null] });
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"StepActionsList.js","names":[],"sources":["../../../../src/pages/TransactionDetailsPage/StepActionsList.tsx"],"sourcesContent":["import type { RouteExtended } from '@lifi/sdk'\nimport { useExplorer } from '../../hooks/useExplorer.js'\nimport { prepareActions } from '../../utils/prepareActions.js'\nimport { TransactionList } from './ReceiptsCard.style.js'\nimport { SentToWalletRow } from './SentToWalletRow.js'\nimport { StepActionRow } from './StepActionRow.js'\n\ninterface StepActionsListProps {\n route: RouteExtended\n toAddress?: string\n}\n\nexport const StepActionsList: React.FC<StepActionsListProps> = ({\n route,\n toAddress,\n}) => {\n const { getTransactionLink } = useExplorer()\n const stepRows = route.steps\n .map((step) => {\n const rows = prepareActions(step.execution?.actions ?? [])\n .map((actionsGroup) => {\n const action = actionsGroup.at(-1)\n const href = action?.txHash\n ? getTransactionLink({\n txHash: action.txHash,\n chain: action.chainId,\n })\n : action?.txLink\n ? getTransactionLink({\n txLink: action.txLink,\n chain: action.chainId,\n })\n : undefined\n return { action, href }\n })\n .filter(({ action, href }) => {\n const doneOrFailed =\n action?.status === 'DONE' || action?.status === 'FAILED'\n return Boolean(href && doneOrFailed)\n })\n return { step, rows }\n })\n .filter(({ rows }) => rows.length > 0)\n\n if (!stepRows?.length) {\n return null\n }\n\n return (\n <TransactionList>\n {stepRows.map(({ step, rows }) => (\n
|
|
1
|
+
{"version":3,"file":"StepActionsList.js","names":[],"sources":["../../../../src/pages/TransactionDetailsPage/StepActionsList.tsx"],"sourcesContent":["import type { RouteExtended } from '@lifi/sdk'\nimport { useExplorer } from '../../hooks/useExplorer.js'\nimport { prepareActions } from '../../utils/prepareActions.js'\nimport { TransactionList } from './ReceiptsCard.style.js'\nimport { SentToWalletRow } from './SentToWalletRow.js'\nimport { StepActionRow } from './StepActionRow.js'\n\ninterface StepActionsListProps {\n route: RouteExtended\n toAddress?: string\n}\n\nexport const StepActionsList: React.FC<StepActionsListProps> = ({\n route,\n toAddress,\n}) => {\n const { getTransactionLink } = useExplorer()\n const stepRows = route.steps\n .map((step) => {\n const rows = prepareActions(step.execution?.actions ?? [])\n .map((actionsGroup) => {\n const action = actionsGroup.at(-1)\n const href = action?.txHash\n ? getTransactionLink({\n txHash: action.txHash,\n chain: action.chainId,\n })\n : action?.txLink\n ? getTransactionLink({\n txLink: action.txLink,\n chain: action.chainId,\n })\n : undefined\n return { action, href }\n })\n .filter(({ action, href }) => {\n const doneOrFailed =\n action?.status === 'DONE' || action?.status === 'FAILED'\n return Boolean(href && doneOrFailed)\n })\n return { step, rows }\n })\n .filter(({ rows }) => rows.length > 0)\n\n if (!stepRows?.length) {\n return null\n }\n\n const lastStepIndex = stepRows.length - 1\n\n return (\n <TransactionList>\n {stepRows.map(({ step, rows }, stepIndex) => {\n const lastRowIndex = rows.length - 1\n const isLastStep = stepIndex === lastStepIndex\n return (\n <TransactionList key={step.id}>\n {rows.map(({ action, href }, rowIndex) => (\n <StepActionRow\n key={rowIndex}\n step={step}\n action={action!}\n href={href!}\n defaultLabelsOnly={!(isLastStep && rowIndex === lastRowIndex)}\n />\n ))}\n </TransactionList>\n )\n })}\n {toAddress ? (\n <SentToWalletRow toAddress={toAddress} toChainId={route.toChainId} />\n ) : null}\n </TransactionList>\n )\n}\n"],"mappings":";;;;;;;AAYA,MAAa,mBAAmD,EAC9D,OACA,gBACI;CACJ,MAAM,EAAE,uBAAuB,aAAa;CAC5C,MAAM,WAAW,MAAM,MACpB,KAAK,SAAS;EAsBb,OAAO;GAAE;GAAM,MArBF,eAAe,KAAK,WAAW,WAAW,EAAE,CAAC,CACvD,KAAK,iBAAiB;IACrB,MAAM,SAAS,aAAa,GAAG,GAAG;IAYlC,OAAO;KAAE;KAAQ,MAXJ,QAAQ,SACjB,mBAAmB;MACjB,QAAQ,OAAO;MACf,OAAO,OAAO;MACf,CAAC,GACF,QAAQ,SACN,mBAAmB;MACjB,QAAQ,OAAO;MACf,OAAO,OAAO;MACf,CAAC,GACF,KAAA;KACiB;KACvB,CACD,QAAQ,EAAE,QAAQ,WAAW;IAC5B,MAAM,eACJ,QAAQ,WAAW,UAAU,QAAQ,WAAW;IAClD,OAAO,QAAQ,QAAQ,aAAa;KAErB;GAAE;GACrB,CACD,QAAQ,EAAE,WAAW,KAAK,SAAS,EAAE;CAExC,IAAI,CAAC,UAAU,QACb,OAAO;CAGT,MAAM,gBAAgB,SAAS,SAAS;CAExC,OACE,qBAAC,iBAAD,EAAA,UAAA,CACG,SAAS,KAAK,EAAE,MAAM,QAAQ,cAAc;EAC3C,MAAM,eAAe,KAAK,SAAS;EACnC,MAAM,aAAa,cAAc;EACjC,OACE,oBAAC,iBAAD,EAAA,UACG,KAAK,KAAK,EAAE,QAAQ,QAAQ,aAC3B,oBAAC,eAAD;GAEQ;GACE;GACF;GACN,mBAAmB,EAAE,cAAc,aAAa;GAChD,EALK,SAKL,CACF,EACc,EAVI,KAAK,GAUT;GAEpB,EACD,YACC,oBAAC,iBAAD;EAA4B;EAAW,WAAW,MAAM;EAAa,CAAA,GACnE,KACY,EAAA,CAAA"}
|
|
@@ -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 {\n subvariant,\n subvariantOptions,\n contractSecondaryComponent,\n 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 subvariant === 'custom'\n ? t(`header.${subvariantOptions?.custom ?? '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 const routeExecution = buildRouteFromTxHistory(\n transaction as FullStatusData,\n tools\n )\n return routeExecution\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 bottomGutters\n sx={{ display: 'flex', flexDirection: 'column', gap: 2 }}\n >\n <TransactionCard route={routeExecution.route} date={startedAt} />\n {subvariant === '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,gBAAgB;CAC9B,MAAM,WAAW,aAAa;CAC9B,MAAM,EACJ,YACA,mBACA,4BACA,iBACE,iBAAiB;CACrB,MAAM,EAAE,WAAgB,aAAa;CACrC,MAAM,EAAE,UAAU,UAAU;CAC5B,MAAM,EAAE,uBAAuB,aAAa;CAC5C,MAAM,uBAAuB,wBAAwB,UACnD,QAAQ,UAAU,MAAM,OAAO,OAAO,WAAW,KAAA,EAClD;CACD,MAAM,EAAE,aAAa,cAAc,sBACjC,CAAC,wBAAwB,QAAQ,gBAClC;
|
|
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 {\n subvariant,\n subvariantOptions,\n contractSecondaryComponent,\n 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 subvariant === 'custom'\n ? t(`header.${subvariantOptions?.custom ?? '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 const routeExecution = buildRouteFromTxHistory(\n transaction as FullStatusData,\n tools\n )\n return routeExecution\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 bottomGutters\n sx={{ display: 'flex', flexDirection: 'column', gap: 2 }}\n >\n <TransactionCard route={routeExecution.route} date={startedAt} />\n {subvariant === '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,gBAAgB;CAC9B,MAAM,WAAW,aAAa;CAC9B,MAAM,EACJ,YACA,mBACA,4BACA,iBACE,iBAAiB;CACrB,MAAM,EAAE,WAAgB,aAAa;CACrC,MAAM,EAAE,UAAU,UAAU;CAC5B,MAAM,EAAE,uBAAuB,aAAa;CAC5C,MAAM,uBAAuB,wBAAwB,UACnD,QAAQ,UAAU,MAAM,OAAO,OAAO,WAAW,KAAA,EAClD;CACD,MAAM,EAAE,aAAa,cAAc,sBACjC,CAAC,wBAAwB,QAAQ,gBAClC;CAMD,UAHE,eAAe,WACX,EAAE,UAAU,mBAAmB,UAAU,WAAW,SAAS,GAC7D,EAAE,4BAA4B,CACpB;CAEhB,MAAM,iBAAiB,cAAc;EACnC,IAAI,sBACF,OAAO;EAET,IAAI,WACF;EAEF,IAAI,aAKF,OAJuB,wBACrB,aACA,MAEmB;IAEtB;EAAC;EAAW;EAAsB;EAAO;EAAY,CAAC;CAEzD,gBAAgB;EACd,IAAI,CAAC,aAAa,CAAC,gBACjB,SAAS,EAAE,IAAI,iBAAiB,MAAM,CAAC;IAExC;EAAC;EAAW;EAAU;EAAe,CAAC;CAEzC,MAAM,cAAc,cAAc,WAAW;CAC7C,MAAM,MAAM,OAAO,gBAAgB,WAAW,cAAc,aAAa;CAGzE,IAAI,YADiB,gBAAgB,gBAAgB,MACzB,IAAI,gBAAgB,MAAM,MAAM;CAE5D,MAAM,iBACJ,gBAAgB,OAAO,OAAO,GAAG,GAAG,EAAE,WAAW;CACnD,MAAM,iBACJ,gBAAgB,OAAO,OAAO,GAAG,GAAG,EAAE,WAAW;CAEnD,MAAM,UACH,MACG,gBAAgB,QAAA,sBAA6B,IAAI,GACjD,mBACJ,kBACA,mBAAmB,EAAE,QAAQ,WAAW,CAAC;CAE3C,IAAI,QAAQ,IAAI,aAAa,eAC3B,aAAa,IAAI,gBAAgB,MAAM;CAGzC,MAAM,YAAY,IAAI,KACpB,gBAAgB,MAAM,MAAM,GAAG,WAAW,aAAa,EACxD;CAED,IAAI,aAAa,CAAC,sBAChB,OAAO,oBAAC,4BAAD,EAA8B,CAAA;CAGvC,IAAI,CAAC,gBAAgB,OACnB,OAAO;CAGT,OACE,qBAAC,eAAD;EACE,eAAA;EACA,IAAI;GAAE,SAAS;GAAQ,eAAe;GAAU,KAAK;GAAG;YAF1D;GAIE,oBAAC,iBAAD;IAAiB,OAAO,eAAe;IAAO,MAAM;IAAa,CAAA;GAChE,eAAe,YAAY,6BAC1B,oBAAC,mBAAD,EAAA,UAAoB,4BAA+C,CAAA,GACjE;GACJ,oBAAC,cAAD,EAAc,OAAO,eAAe,OAAS,CAAA;GAC5C,YACC,oBAAC,gBAAD;IAAgB,YAAY;IAAmB;IAAU,CAAA,GACvD;GACU"}
|
|
@@ -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>\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;
|
|
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>\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,EAAA,UAAA,CACE,qBAAC,KAAD;EACE,IAAI;GACF,IAAI;GACJ,IAAI;GACJ,SAAS;GACT,MAAM;GACN,gBAAgB;GACjB;YAPH,CASE,oBAAC,UAAD;GAAU,OAAO;GAAI,QAAQ;GAAI,SAAQ;GAAS,CAAA,EAClD,oBAAC,UAAD;GAAU,OAAO;GAAI,QAAQ;GAAI,SAAQ;GAAS,CAAA,CAC9C;KACN,qBAACA,QAAD;EAAM,IAAI;GAAE,UAAU;GAAG,cAAc;GAAG;YAA1C,CACE,oBAAC,KAAD;GACE,IAAI,EACF,IAAI,KACL;aAED,oBAAC,UAAD;IAAU,OAAO;IAAI,QAAQ;IAAI,SAAQ;IAAY,CAAA;GACjD,CAAA,EACN,qBAAC,KAAD;GACE,IAAI,EACF,IAAI,GACL;aAHH;IAME,oBAAC,KAAD;KACE,IAAI,EACF,IAAI,GACL;eAED,oBAAC,eAAD,EAAiB,CAAA;KACb,CAAA;IAEN,oBAAC,KAAD;KACE,IAAI,EACF,IAAI,GACL;eAED,oBAAC,eAAD,EAAe,oBAAA,MAAqB,CAAA;KAChC,CAAA;IAEL,MAAM,KAAK,EAAE,QAAQ,GAAG,CAAC,CAAC,KAAK,GAAG,QACjC,qBAAC,KAAD;KAEE,IAAI;MACF,IAAI;MACJ,SAAS;MACT,YAAY;MACb;eANH,CAQE,oBAAC,UAAD;MACE,SAAQ;MACR,OAAO;MACP,QAAQ;MACR,IAAI,EACF,cAAc,QACf;MACD,CAAA,EACF,oBAAC,UAAD;MACE,IAAI,EACF,IAAI,GACL;MACD,OAAO;MACP,QAAQ;MACR,SAAQ;MACR,CAAA,CACE;OAvBC,IAuBD,CACN;IAEF,oBAAC,KAAD;KACE,IAAI,EACF,IAAI,GACL;eAED,oBAAC,eAAD,EAAiB,CAAA;KACb,CAAA;IACF;KACD;IACO,EAAA,CAAA"}
|
|
@@ -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 { HiddenUI } from '../../types/widget.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?.includes(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":";;;;;;;;;;;;AAiBA,MAAa,kBAAkB,EAC7B,YACA,aACsC;CACtC,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,EAAE,aAAa,iBAAiB;CAEtC,MAAM,iBAAiB,YAAY;
|
|
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 { HiddenUI } from '../../types/widget.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?.includes(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":";;;;;;;;;;;;AAiBA,MAAa,kBAAkB,EAC7B,YACA,aACsC;CACtC,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,EAAE,aAAa,iBAAiB;CAEtC,MAAM,iBAAiB,YAAY;EACjC,MAAM,UAAU,UAAU,UAAU,WAAW;;CAGjD,MAAM,iCAAiC;EACrC,OAAO,KAAK,QAAQ,SAAS;;CAG/B,OACE,qBAACA,QAAD;EAAM,MAAK;EAAU,UAAA;YAArB,CACE,qBAAC,KAAD;GACE,IAAI;IACF,SAAS;IACT,YAAY;IACZ,gBAAgB;IACjB;aALH,CAOE,oBAAC,WAAD;IAAW,IAAI,EAAE,GAAG,GAAG;cAAG,EAAE,kBAAkB;IAAa,CAAA,EAC3D,qBAAC,KAAD;IACE,IAAI;KACF,KAAK;KACL,SAAS;KACV;cAJH;KAME,oBAAC,gBAAD;MAAgB,MAAK;MAAQ,SAAS;gBACpC,oBAAC,oBAAD,EAAoB,UAAS,WAAY,CAAA;MAC1B,CAAA;KAChB,SACC,oBAAC,gBAAD;MAAgB,MAAK;MAAQ,SAAS;gBACpC,oBAAC,WAAD,EAAW,UAAS,WAAY,CAAA;MACjB,CAAA,GACf;KACH,CAAC,UAAU,SAAA,iBAAiC,GAC3C,oBAAC,sBAAD,EAAsB,WAAW,YAAc,CAAA,GAC7C;KACA;MACF;MACN,oBAAC,YAAD;GACE,SAAQ;GACR,IAAI;IACF,IAAI;IACJ,WAAW;IACZ;aAEA;GACU,CAAA,CACR"}
|
|
@@ -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 { ForwardRefExoticComponent, RefAttributes, RefObject } from 'react'\nimport { forwardRef, 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: ForwardRefExoticComponent<\n ConfirmToAddressSheetProps & RefAttributes<BottomSheetBase>\n> = forwardRef<BottomSheetBase, ConfirmToAddressSheetProps>((props, ref) => {\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,wBAET,YAAyD,OAAO,QAAQ;CAC1E,MAAM,oBAAoB;
|
|
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 { ForwardRefExoticComponent, RefAttributes, RefObject } from 'react'\nimport { forwardRef, 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: ForwardRefExoticComponent<\n ConfirmToAddressSheetProps & RefAttributes<BottomSheetBase>\n> = forwardRef<BottomSheetBase, ConfirmToAddressSheetProps>((props, ref) => {\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,wBAET,YAAyD,OAAO,QAAQ;CAC1E,MAAM,oBAAoB;EACvB,IAAoC,SAAS,OAAO;;CAGvD,OACE,oBAAC,aAAD;EAAkB;YAChB,oBAAC,8BAAD;GAA8B,GAAI;GAAO,SAAS;GAAe,CAAA;EACrD,CAAA;EAEhB;AAEF,MAAM,gCAED,EAAE,YAAY,SAAS,WAAW,gBAAgB;CACrD,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,EAAE,UAAU,SAAS,UAAU;CACrC,MAAM,UAAU,iBAAiB;CACjC,MAAM,MAAM,OAAoB,KAAK;CACrC,oBAAoB,IAAI;CAExB,MAAM,uBAAuB;EAC3B,QAAQ,KAAA,+BAA8C;GACpD,SAAS;GACT,SAAS;GACV,CAAC;EACF,SAAS;EACT,YAAY;;CAGd,OACE,qBAAC,4BAAD;EAAiC;YAAjC;GACE,oBAAC,eAAD,EAAA,UACE,oBAAC,QAAD,EAAQ,IAAI,EAAE,UAAU,IAAI,EAAI,CAAA,EAClB,CAAA;GAChB,oBAAC,YAAD;IAAY,SAAQ;IAAK,IAAI;KAAE,WAAW;KAAU,IAAI;KAAG;cACxD,EAAE,mCAAmC;IAC3B,CAAA;GACb,oBAAC,uBAAD,EAAA,UACE,oBAAC,YAAD,EAAA,UAAa,WAAuB,CAAA,EACd,CAAA;GACxB,oBAAC,cAAD;IACE,UAAS;IACT,OACE,oBAAC,YAAD;KAAY,SAAQ;KAAQ,IAAI,EAAE,OAAO,gBAAgB;eACtD,EAAE,sCAAsC,EACvC,WAAW,OAAO,MACnB,CAAC;KACS,CAAA;IAEf,MAAM,oBAAC,gBAAD,EAAkB,CAAA;IACxB,WAAA;IACA,CAAA;GACF,qBAAC,uBAAD,EAAA,UAAA,CACE,oBAAC,QAAD;IAAQ,SAAQ;IAAO,SAAS;IAAS,WAAA;cACtC,EAAE,gBAAgB;IACZ,CAAA,EACT,oBAAC,QAAD;IAAQ,SAAQ;IAAY,SAAS;IAAgB,WAAA;cAClD,EAAE,kBAAkB;IACd,CAAA,CACa,EAAA,CAAA;GACG"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ExchangeRateBottomSheet.js","names":[],"sources":["../../../../src/pages/TransactionPage/ExchangeRateBottomSheet.tsx"],"sourcesContent":["import type { ExchangeRateUpdateParams } from '@lifi/sdk'\nimport WarningRounded from '@mui/icons-material/WarningRounded'\nimport { Box, Button, Typography } from '@mui/material'\nimport type { ForwardRefExoticComponent, RefAttributes, RefObject } from 'react'\nimport {\n forwardRef,\n useCallback,\n useImperativeHandle,\n useRef,\n useState,\n} from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { BottomSheet } from '../../components/BottomSheet/BottomSheet.js'\nimport type { BottomSheetBase } from '../../components/BottomSheet/types.js'\nimport { useSetContentHeight } from '../../hooks/useSetContentHeight.js'\nimport { formatTokenAmount } from '../../utils/format.js'\nimport { CenterContainer, IconCircle } from './StatusBottomSheet.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: ForwardRefExoticComponent<\n ExchangeRateBottomSheetProps & RefAttributes<ExchangeRateBottomSheetBase>\n> = forwardRef<ExchangeRateBottomSheetBase, ExchangeRateBottomSheetProps>(\n ({ onContinue, onCancel }, ref) => {\n const [data, setData] = useState<ExchangeRateUpdateParams>()\n const bottomSheetRef = useRef<BottomSheetBase>(null)\n const resolverRef = useRef<(value: boolean) => void>(null)\n\n const handleContinue = () => {\n ;(ref as RefObject<ExchangeRateBottomSheetBase>).current?.close(true)\n onContinue?.()\n }\n\n const handleCancel = useCallback(() => {\n ;(ref as RefObject<ExchangeRateBottomSheetBase>).current?.close(false)\n onCancel?.()\n }, [onCancel, ref])\n\n const handleClose = useCallback(() => {\n ;(ref as RefObject<ExchangeRateBottomSheetBase>).current?.close(\n false,\n false\n )\n onCancel?.()\n }, [onCancel, ref])\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: (value = false, bottomSheetClose = true) => {\n resolverRef.current?.(value)\n if (bottomSheetClose) {\n bottomSheetRef.current?.close()\n }\n },\n }),\n []\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)\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 <WarningRounded color=\"warning\" />\n </IconCircle>\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":";;;;;;;;;;AA8BA,MAAa,0BAET,YACD,EAAE,YAAY,YAAY,QAAQ;CACjC,MAAM,CAAC,MAAM,WAAW,UAAoC;CAC5D,MAAM,iBAAiB,OAAwB,KAAK;CACpD,MAAM,cAAc,OAAiC,KAAK;CAE1D,MAAM,uBAAuB;
|
|
1
|
+
{"version":3,"file":"ExchangeRateBottomSheet.js","names":[],"sources":["../../../../src/pages/TransactionPage/ExchangeRateBottomSheet.tsx"],"sourcesContent":["import type { ExchangeRateUpdateParams } from '@lifi/sdk'\nimport WarningRounded from '@mui/icons-material/WarningRounded'\nimport { Box, Button, Typography } from '@mui/material'\nimport type { ForwardRefExoticComponent, RefAttributes, RefObject } from 'react'\nimport {\n forwardRef,\n useCallback,\n useImperativeHandle,\n useRef,\n useState,\n} from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { BottomSheet } from '../../components/BottomSheet/BottomSheet.js'\nimport type { BottomSheetBase } from '../../components/BottomSheet/types.js'\nimport { useSetContentHeight } from '../../hooks/useSetContentHeight.js'\nimport { formatTokenAmount } from '../../utils/format.js'\nimport { CenterContainer, IconCircle } from './StatusBottomSheet.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: ForwardRefExoticComponent<\n ExchangeRateBottomSheetProps & RefAttributes<ExchangeRateBottomSheetBase>\n> = forwardRef<ExchangeRateBottomSheetBase, ExchangeRateBottomSheetProps>(\n ({ onContinue, onCancel }, ref) => {\n const [data, setData] = useState<ExchangeRateUpdateParams>()\n const bottomSheetRef = useRef<BottomSheetBase>(null)\n const resolverRef = useRef<(value: boolean) => void>(null)\n\n const handleContinue = () => {\n ;(ref as RefObject<ExchangeRateBottomSheetBase>).current?.close(true)\n onContinue?.()\n }\n\n const handleCancel = useCallback(() => {\n ;(ref as RefObject<ExchangeRateBottomSheetBase>).current?.close(false)\n onCancel?.()\n }, [onCancel, ref])\n\n const handleClose = useCallback(() => {\n ;(ref as RefObject<ExchangeRateBottomSheetBase>).current?.close(\n false,\n false\n )\n onCancel?.()\n }, [onCancel, ref])\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: (value = false, bottomSheetClose = true) => {\n resolverRef.current?.(value)\n if (bottomSheetClose) {\n bottomSheetRef.current?.close()\n }\n },\n }),\n []\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)\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 <WarningRounded color=\"warning\" />\n </IconCircle>\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":";;;;;;;;;;AA8BA,MAAa,0BAET,YACD,EAAE,YAAY,YAAY,QAAQ;CACjC,MAAM,CAAC,MAAM,WAAW,UAAoC;CAC5D,MAAM,iBAAiB,OAAwB,KAAK;CACpD,MAAM,cAAc,OAAiC,KAAK;CAE1D,MAAM,uBAAuB;EAC1B,IAAgD,SAAS,MAAM,KAAK;EACrE,cAAc;;CAGhB,MAAM,eAAe,kBAAkB;EACpC,IAAgD,SAAS,MAAM,MAAM;EACtE,YAAY;IACX,CAAC,UAAU,IAAI,CAAC;CAEnB,MAAM,cAAc,kBAAkB;EACnC,IAAgD,SAAS,MACxD,OACA,MACD;EACD,YAAY;IACX,CAAC,UAAU,IAAI,CAAC;CAEnB,oBACE,YACO;EACL,cAAc,eAAe,SAAS,QAAQ;EAC9C,OAAO,UAAU,SAAS;GACxB,QAAQ,KAAK;GACb,YAAY,UAAU;GACtB,eAAe,SAAS,MAAM;;EAEhC,QAAQ,QAAQ,OAAO,mBAAmB,SAAS;GACjD,YAAY,UAAU,MAAM;GAC5B,IAAI,kBACF,eAAe,SAAS,OAAO;;EAGpC,GACD,EAAE,CACH;CAED,OACE,oBAAC,aAAD;EAAa,KAAK;EAAgB,SAAS;YACzC,oBAAC,gCAAD;GACQ;GACN,YAAY;GACZ,UAAU;GACV,CAAA;EACU,CAAA;EAGnB;AAED,MAAM,kCAED,EAAE,MAAM,UAAU,iBAAiB;CACtC,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,MAAM,OAAoB,KAAK;CACrC,oBAAoB,IAAI;CAExB,IAAI,CAAC,MACH;CAGF,MAAM,YAAY,OAAO,KAAK,eAAe,EAAE;CAC/C,MAAM,cACH,OAAQ,OAAO,KAAK,eAAe,EAAE,GAAG,WAAc,UAAU,GAC/D,MACA,MACF,KACA,QAAQ,EAAE;CAEZ,OACE,qBAAC,KAAD;EACO;EACL,IAAI,EACF,GAAG,GACJ;YAJH;GAME,qBAAC,iBAAD,EAAA,UAAA,CACE,oBAAC,YAAD;IAAY,QAAO;IAAU,IAAI,EAAE,IAAI,GAAG;cACxC,oBAAC,gBAAD,EAAgB,OAAM,WAAY,CAAA;IACvB,CAAA,EACb,oBAAC,YAAD;IACE,IAAI;KACF,IAAI;KACJ,UAAU;KACV,YAAY;KACb;cAEA,EAAE,4BAA4B;IACpB,CAAA,CACG,EAAA,CAAA;GAClB,oBAAC,YAAD;IACE,IAAI,EACF,IAAI,GACL;cAEA,EAAE,8BAA8B;IACtB,CAAA;GACb,qBAAC,KAAD;IACE,IAAI;KACF,SAAS;KACT,gBAAgB;KAChB,IAAI;KACL;cALH,CAOE,oBAAC,YAAD,EAAA,UAAa,EAAE,oBAAoB,EAAc,CAAA,EACjD,qBAAC,YAAD;KACE,IAAI,EACF,YAAY,KACb;eAHH;MAKG,EAAE,sBAAsB,EACvB,OAAO,kBACL,OAAO,KAAK,YAAY,EACxB,KAAK,QAAQ,SACd,EACF,CAAC;MAAE;MACH,MAAM,QAAQ;MACJ;OACT;;GACN,qBAAC,KAAD;IACE,IAAI;KACF,SAAS;KACT,gBAAgB;KAChB,IAAI;KACL;cALH,CAOE,oBAAC,YAAD,EAAA,UAAa,EAAE,qBAAqB,EAAc,CAAA,EAClD,qBAAC,YAAD;KACE,IAAI,EACF,YAAY,KACb;eAHH;MAKG,EAAE,sBAAsB,EACvB,OAAO,kBACL,OAAO,MAAM,YAAY,EACzB,MAAM,QAAQ,SACf,EACF,CAAC;MAAE;MACH,MAAM,QAAQ;MACJ;OACT;;GACN,qBAAC,KAAD;IACE,IAAI;KACF,SAAS;KACT,gBAAgB;KAChB,IAAI;KACL;cALH,CAOE,oBAAC,YAAD,EAAA,UAAa,EAAE,kBAAkB,EAAc,CAAA,EAC/C,qBAAC,YAAD;KACE,IAAI,EACF,YAAY,KACb;eAHH,CAKG,YAAW,IACD;OACT;;GACN,qBAAC,KAAD;IACE,IAAI;KACF,SAAS;KACT,IAAI;KACL;cAJH;KAME,oBAAC,QAAD;MAAQ,SAAQ;MAAO,SAAS;MAAU,WAAA;gBACvC,EAAE,gBAAgB;MACZ,CAAA;KACT,oBAAC,KAAD,EACE,IAAI;MACF,SAAS;MACT,GAAG;MACJ,EACD,CAAA;KACF,oBAAC,QAAD;MAAQ,SAAQ;MAAY,SAAS;MAAY,WAAA;gBAC9C,EAAE,kBAAkB;MACd,CAAA;KACL;;GACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RouteTracker.js","names":[],"sources":["../../../../src/pages/TransactionPage/RouteTracker.tsx"],"sourcesContent":["import type { Dispatch, JSX, SetStateAction } from 'react'\nimport { useEffect, useRef, useState } from 'react'\nimport { ProgressToNextUpdate } from '../../components/ProgressToNextUpdate.js'\nimport { useRoutes } from '../../hooks/useRoutes.js'\nimport { useRouteExecutionStoreContext } from '../../stores/routes/RouteExecutionStore.js'\nimport { useSetExecutableRoute } from '../../stores/routes/useSetExecutableRoute.js'\n\ninterface RouteTrackerProps {\n observableRouteId: string\n onChange: Dispatch<SetStateAction<string>>\n onFetching: Dispatch<SetStateAction<boolean>>\n}\n\nexport const RouteTracker = ({\n observableRouteId,\n onChange,\n onFetching,\n}: RouteTrackerProps): JSX.Element => {\n const routeExecutionStore = useRouteExecutionStoreContext()\n const setExecutableRoute = useSetExecutableRoute()\n const [observableRoute] = useState(\n () => routeExecutionStore.getState().routes[observableRouteId]?.route\n )\n const observableRouteIdRef = useRef(observableRoute?.id)\n const { routes, isFetching, dataUpdatedAt, refetchTime, refetch } = useRoutes(\n { observableRoute }\n )\n const currentRoute = routes?.[0]\n\n /**\n * The reviewable route is the route that the user currently sees on the review page.\n * The observable route is the route for which we track bridges and exchanges.\n * This allows us to query the route using the same tool each time we refresh.\n * The observable and reviewable routes can be the same when we first enter the review page.\n */\n // biome-ignore lint/correctness/useExhaustiveDependencies: run only when currentRoute changes\n useEffect(() => {\n if (\n observableRouteIdRef.current &&\n currentRoute &&\n observableRouteIdRef.current !== currentRoute.id\n ) {\n const reviewableRouteId = observableRouteIdRef.current\n observableRouteIdRef.current = currentRoute.id\n setExecutableRoute(currentRoute, [observableRouteId, reviewableRouteId])\n onChange(currentRoute.id)\n }\n }, [currentRoute?.id, observableRouteId])\n\n useEffect(() => {\n onFetching(isFetching)\n }, [isFetching, onFetching])\n\n const handleRefetch = () => {\n refetch()\n }\n\n return (\n <ProgressToNextUpdate\n updatedAt={dataUpdatedAt || Date.now()}\n timeToUpdate={refetchTime}\n isLoading={isFetching}\n onClick={handleRefetch}\n sx={{ marginRight: -1 }}\n size=\"medium\"\n />\n )\n}\n"],"mappings":";;;;;;;AAaA,MAAa,gBAAgB,EAC3B,mBACA,UACA,iBACoC;CACpC,MAAM,sBAAsB,+BAA+B;CAC3D,MAAM,qBAAqB,uBAAuB;CAClD,MAAM,CAAC,mBAAmB,eAClB,oBAAoB,UAAU,CAAC,OAAO,oBAAoB,MACjE;CACD,MAAM,uBAAuB,OAAO,iBAAiB,GAAG;CACxD,MAAM,EAAE,QAAQ,YAAY,eAAe,aAAa,YAAY,UAClE,EAAE,iBAAiB,CACpB;CACD,MAAM,eAAe,SAAS;;;;;;;
|
|
1
|
+
{"version":3,"file":"RouteTracker.js","names":[],"sources":["../../../../src/pages/TransactionPage/RouteTracker.tsx"],"sourcesContent":["import type { Dispatch, JSX, SetStateAction } from 'react'\nimport { useEffect, useRef, useState } from 'react'\nimport { ProgressToNextUpdate } from '../../components/ProgressToNextUpdate.js'\nimport { useRoutes } from '../../hooks/useRoutes.js'\nimport { useRouteExecutionStoreContext } from '../../stores/routes/RouteExecutionStore.js'\nimport { useSetExecutableRoute } from '../../stores/routes/useSetExecutableRoute.js'\n\ninterface RouteTrackerProps {\n observableRouteId: string\n onChange: Dispatch<SetStateAction<string>>\n onFetching: Dispatch<SetStateAction<boolean>>\n}\n\nexport const RouteTracker = ({\n observableRouteId,\n onChange,\n onFetching,\n}: RouteTrackerProps): JSX.Element => {\n const routeExecutionStore = useRouteExecutionStoreContext()\n const setExecutableRoute = useSetExecutableRoute()\n const [observableRoute] = useState(\n () => routeExecutionStore.getState().routes[observableRouteId]?.route\n )\n const observableRouteIdRef = useRef(observableRoute?.id)\n const { routes, isFetching, dataUpdatedAt, refetchTime, refetch } = useRoutes(\n { observableRoute }\n )\n const currentRoute = routes?.[0]\n\n /**\n * The reviewable route is the route that the user currently sees on the review page.\n * The observable route is the route for which we track bridges and exchanges.\n * This allows us to query the route using the same tool each time we refresh.\n * The observable and reviewable routes can be the same when we first enter the review page.\n */\n // biome-ignore lint/correctness/useExhaustiveDependencies: run only when currentRoute changes\n useEffect(() => {\n if (\n observableRouteIdRef.current &&\n currentRoute &&\n observableRouteIdRef.current !== currentRoute.id\n ) {\n const reviewableRouteId = observableRouteIdRef.current\n observableRouteIdRef.current = currentRoute.id\n setExecutableRoute(currentRoute, [observableRouteId, reviewableRouteId])\n onChange(currentRoute.id)\n }\n }, [currentRoute?.id, observableRouteId])\n\n useEffect(() => {\n onFetching(isFetching)\n }, [isFetching, onFetching])\n\n const handleRefetch = () => {\n refetch()\n }\n\n return (\n <ProgressToNextUpdate\n updatedAt={dataUpdatedAt || Date.now()}\n timeToUpdate={refetchTime}\n isLoading={isFetching}\n onClick={handleRefetch}\n sx={{ marginRight: -1 }}\n size=\"medium\"\n />\n )\n}\n"],"mappings":";;;;;;;AAaA,MAAa,gBAAgB,EAC3B,mBACA,UACA,iBACoC;CACpC,MAAM,sBAAsB,+BAA+B;CAC3D,MAAM,qBAAqB,uBAAuB;CAClD,MAAM,CAAC,mBAAmB,eAClB,oBAAoB,UAAU,CAAC,OAAO,oBAAoB,MACjE;CACD,MAAM,uBAAuB,OAAO,iBAAiB,GAAG;CACxD,MAAM,EAAE,QAAQ,YAAY,eAAe,aAAa,YAAY,UAClE,EAAE,iBAAiB,CACpB;CACD,MAAM,eAAe,SAAS;;;;;;;CAS9B,gBAAgB;EACd,IACE,qBAAqB,WACrB,gBACA,qBAAqB,YAAY,aAAa,IAC9C;GACA,MAAM,oBAAoB,qBAAqB;GAC/C,qBAAqB,UAAU,aAAa;GAC5C,mBAAmB,cAAc,CAAC,mBAAmB,kBAAkB,CAAC;GACxE,SAAS,aAAa,GAAG;;IAE1B,CAAC,cAAc,IAAI,kBAAkB,CAAC;CAEzC,gBAAgB;EACd,WAAW,WAAW;IACrB,CAAC,YAAY,WAAW,CAAC;CAE5B,MAAM,sBAAsB;EAC1B,SAAS;;CAGX,OACE,oBAAC,sBAAD;EACE,WAAW,iBAAiB,KAAK,KAAK;EACtC,cAAc;EACd,WAAW;EACX,SAAS;EACT,IAAI,EAAE,aAAa,IAAI;EACvB,MAAK;EACL,CAAA"}
|
|
@@ -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,KAAK;
|
|
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,KAAK;CAM5D,OACE,oBAAC,uBAAD;EACW;EACH;EACN,UARsB,cAAc;GACtC,OAAO,SAAS,MAAM,YAAY,QAAQ,OAAO,mBAAmB;KACnE,CAAC,SAAS,CAMkB;EAC3B,SAAS,aAAa;EACf;EACP,CAAA"}
|