@lifi/widget 0.0.0-preview-6cc63bac → 0.0.0-preview-fe8dc5e6
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.d.ts +4 -2
- package/dist/esm/App.d.ts.map +1 -1
- package/dist/esm/App.js +4 -4
- package/dist/esm/App.js.map +1 -1
- package/dist/esm/AppDrawer.d.ts +1 -1
- package/dist/esm/AppDrawer.d.ts.map +1 -1
- package/dist/esm/AppDrawer.js +5 -6
- package/dist/esm/AppDrawer.js.map +1 -1
- package/dist/esm/AppDrawerContext.js +2 -2
- package/dist/esm/AppDrawerContext.js.map +1 -1
- package/dist/esm/components/ActionRow/ActionRow.style.js.map +1 -1
- package/dist/esm/components/AmountInput/AmountInput.js.map +1 -1
- package/dist/esm/components/AmountInput/AmountInput.style.js.map +1 -1
- package/dist/esm/components/AmountInput/AmountInputEndAdornment.style.js.map +1 -1
- package/dist/esm/components/AmountInput/PriceFormHelperText.style.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.style.js.map +1 -1
- package/dist/esm/components/Avatar/SmallAvatar.js.map +1 -1
- package/dist/esm/components/BottomSheet/BottomSheet.js +3 -3
- package/dist/esm/components/BottomSheet/BottomSheet.js.map +1 -1
- package/dist/esm/components/ButtonTertiary.js.map +1 -1
- package/dist/esm/components/Card/Card.js.map +1 -1
- package/dist/esm/components/Card/CardButton.style.js.map +1 -1
- package/dist/esm/components/Card/CardHeader.js.map +1 -1
- package/dist/esm/components/Card/CardIconButton.js.map +1 -1
- package/dist/esm/components/Card/CardLabel.js.map +1 -1
- package/dist/esm/components/Card/CardTitle.js.map +1 -1
- package/dist/esm/components/Card/InputCard.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.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/ChainsExpanded.style.js.map +1 -1
- package/dist/esm/components/Chains/VirtualizedChainList.js.map +1 -1
- package/dist/esm/components/ContextMenu.style.js.map +1 -1
- package/dist/esm/components/ContractComponent/NFT/NFT.style.js.map +1 -1
- package/dist/esm/components/Dialog/Dialog.style.js.map +1 -1
- package/dist/esm/components/EmptyListIndicator/EmptyListIndicator.style.js.map +1 -1
- package/dist/esm/components/ExecutionStatusCard/StatusIcon.js.map +1 -1
- package/dist/esm/components/ExecutionStatusCard/StatusIcon.style.js.map +1 -1
- package/dist/esm/components/ExecutionStatusCard/iconKey.js.map +1 -1
- package/dist/esm/components/Expansion/Expansion.style.js.map +1 -1
- package/dist/esm/components/Header/ActivitiesButton.style.js.map +1 -1
- package/dist/esm/components/Header/Header.js +7 -10
- 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/HeaderNavigationTabs.js +26 -0
- package/dist/esm/components/Header/HeaderNavigationTabs.js.map +1 -0
- package/dist/esm/components/Header/HeaderTabs.js +33 -0
- package/dist/esm/components/Header/HeaderTabs.js.map +1 -0
- package/dist/esm/components/Header/NavigationHeader.js +7 -5
- package/dist/esm/components/Header/NavigationHeader.js.map +1 -1
- package/dist/esm/components/Header/SettingsButton.style.js.map +1 -1
- package/dist/esm/components/Header/WalletMenu.style.js.map +1 -1
- package/dist/esm/components/IconCircle/IconCircle.style.js.map +1 -1
- package/dist/esm/components/IconTypography.js.map +1 -1
- package/dist/esm/components/Input.js.map +1 -1
- package/dist/esm/components/ListItem/ListItem.js.map +1 -1
- package/dist/esm/components/ListItem/ListItemButton.js.map +1 -1
- package/dist/esm/components/ListItemButton.js.map +1 -1
- package/dist/esm/components/ListItemText.js.map +1 -1
- package/dist/esm/components/Menu.js.map +1 -1
- package/dist/esm/components/Messages/AlertMessage.style.js.map +1 -1
- package/dist/esm/components/Messages/GasRefuelMessage.style.js.map +1 -1
- package/dist/esm/components/Messages/WarningMessages.js.map +1 -1
- package/dist/esm/components/PageContainer.js.map +1 -1
- package/dist/esm/components/PoweredBy/PoweredBy.js.map +1 -1
- package/dist/esm/components/PoweredBy/PoweredBy.style.js.map +1 -1
- package/dist/esm/components/ReverseTokensButton/ReverseTokensButton.style.js.map +1 -1
- package/dist/esm/components/RouteCard/RouteDetails.js.map +1 -1
- package/dist/esm/components/RouteCard/RouteDetails.style.js +2 -2
- package/dist/esm/components/RouteCard/RouteDetails.style.js.map +1 -1
- package/dist/esm/components/RouteCard/RouteToken.style.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/RoutesContent.js.map +1 -1
- package/dist/esm/components/Routes/RoutesExpanded.style.js.map +1 -1
- package/dist/esm/components/Search/SearchInput.style.js.map +1 -1
- package/dist/esm/components/Search/SearchNotFound.style.js.map +1 -1
- package/dist/esm/components/SelectTokenButton/SelectTokenButton.style.js.map +1 -1
- package/dist/esm/components/SendToWallet/SendToWalletButton.style.js.map +1 -1
- package/dist/esm/components/SettingsListItemButton.js.map +1 -1
- package/dist/esm/components/Skeleton/WidgetSkeleton.style.js.map +1 -1
- package/dist/esm/components/Step/StepActions.js.map +1 -1
- package/dist/esm/components/Step/StepActions.style.js.map +1 -1
- package/dist/esm/components/StepActions/SentToWalletRow.style.js.map +1 -1
- package/dist/esm/components/StepActions/StepActionRow.style.js.map +1 -1
- package/dist/esm/components/Switch.js.map +1 -1
- package/dist/esm/components/Tabs/NavigationTabs.js +3 -0
- package/dist/esm/components/Tabs/NavigationTabs.js.map +1 -1
- package/dist/esm/components/Tabs/Tabs.style.js.map +1 -1
- package/dist/esm/components/Timer/StepStatusTimer.style.js.map +1 -1
- package/dist/esm/components/Token/Token.style.js.map +1 -1
- package/dist/esm/components/TokenList/PinTokenButton.js.map +1 -1
- package/dist/esm/components/TokenList/TokenDetailsSheet.js +4 -4
- package/dist/esm/components/TokenList/TokenDetailsSheet.js.map +1 -1
- package/dist/esm/components/TokenList/TokenDetailsSheetContent.js +4 -4
- package/dist/esm/components/TokenList/TokenDetailsSheetContent.js.map +1 -1
- package/dist/esm/components/TokenList/TokenDetailsSheetContent.style.js.map +1 -1
- package/dist/esm/components/TokenList/TokenList.style.js.map +1 -1
- package/dist/esm/components/TokenList/TokenListItem.js +2 -2
- package/dist/esm/components/TokenList/TokenListItem.js.map +1 -1
- package/dist/esm/components/TokenList/VirtualizedTokenList.js.map +1 -1
- package/dist/esm/components/TokenList/useTokenSelect.js +3 -3
- package/dist/esm/components/TokenList/useTokenSelect.js.map +1 -1
- package/dist/esm/components/TokenRate/TokenRate.style.js.map +1 -1
- package/dist/esm/components/TransactionCard/ActiveTransactionCard.js.map +1 -1
- package/dist/esm/components/TransactionCard/ActiveTransactionCard.style.js.map +1 -1
- package/dist/esm/components/TransactionCard/TransactionCard.style.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/validate.js.map +1 -1
- package/dist/esm/hooks/useAccountsBalancesData.js.map +1 -1
- package/dist/esm/hooks/useAvailableChains.js +1 -1
- package/dist/esm/hooks/useChainSearch.js.map +1 -1
- package/dist/esm/hooks/useChains.js +1 -1
- package/dist/esm/hooks/useExplorer.js.map +1 -1
- package/dist/esm/hooks/useFilteredByTokenBalances.js +1 -1
- package/dist/esm/hooks/useFilteredByTokenBalances.js.map +1 -1
- package/dist/esm/hooks/useFromTokenSufficiency.js.map +1 -1
- package/dist/esm/hooks/useGasSufficiency.js.map +1 -1
- package/dist/esm/hooks/useLanguages.js +2 -2
- package/dist/esm/hooks/useLanguages.js.map +1 -1
- package/dist/esm/hooks/useRouteExecution.js.map +1 -1
- package/dist/esm/hooks/useRouteExecutionMessage.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/useSwapOnly.js +2 -4
- package/dist/esm/hooks/useSwapOnly.js.map +1 -1
- package/dist/esm/hooks/useToAddressRequirements.js +2 -2
- package/dist/esm/hooks/useToAddressRequirements.js.map +1 -1
- package/dist/esm/hooks/useToken.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/useTokenSearch.js +1 -1
- package/dist/esm/hooks/useTokenSearch.js.map +1 -1
- package/dist/esm/hooks/useTokens.js +1 -1
- package/dist/esm/hooks/useTokens.js.map +1 -1
- package/dist/esm/hooks/useTools.js +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/i18n/en.json +3 -0
- package/dist/esm/index.d.ts +2 -2
- package/dist/esm/pages/ActivitiesPage/ActivitiesPage.js.map +1 -1
- package/dist/esm/pages/MainPage/ReviewButton.js +2 -2
- package/dist/esm/pages/MainPage/ReviewButton.js.map +1 -1
- package/dist/esm/pages/RoutesPage/RoutesPage.js.map +1 -1
- package/dist/esm/pages/RoutesPage/RoutesPage.style.js.map +1 -1
- package/dist/esm/pages/SelectEnabledToolsPage.js.map +1 -1
- package/dist/esm/pages/SendToWallet/BookmarkAddressSheet.js +3 -3
- package/dist/esm/pages/SendToWallet/BookmarkAddressSheet.js.map +1 -1
- package/dist/esm/pages/SendToWallet/ConfirmAddressSheet.js +3 -3
- package/dist/esm/pages/SendToWallet/ConfirmAddressSheet.js.map +1 -1
- package/dist/esm/pages/SendToWallet/SendToWalletPage.js.map +1 -1
- package/dist/esm/pages/SendToWallet/SendToWalletPage.style.js.map +1 -1
- package/dist/esm/pages/SettingsPage/BridgeAndExchangeSettings.js.map +1 -1
- package/dist/esm/pages/SettingsPage/GasPriceSettings.js +1 -1
- package/dist/esm/pages/SettingsPage/ResetSettingsButton.style.js.map +1 -1
- package/dist/esm/pages/SettingsPage/RoutePrioritySettings.js +1 -1
- package/dist/esm/pages/SettingsPage/SettingsCard/SettingCard.style.js.map +1 -1
- package/dist/esm/pages/SettingsPage/SettingsCard/SettingCardExpandable.js +3 -3
- package/dist/esm/pages/SettingsPage/SettingsCard/SettingCardExpandable.js.map +1 -1
- package/dist/esm/pages/SettingsPage/SettingsCard/SettingsAccordian.js +3 -3
- package/dist/esm/pages/SettingsPage/SettingsCard/SettingsAccordian.js.map +1 -1
- package/dist/esm/pages/SettingsPage/SlippageSettings/SlippageSettings.style.js.map +1 -1
- package/dist/esm/pages/SettingsPage/ThemeSettings.js.map +1 -1
- package/dist/esm/pages/TransactionDetailsPage/ContactSupportButton.style.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/TransactionPage/ConfirmToAddressSheet.js +3 -3
- package/dist/esm/pages/TransactionPage/ConfirmToAddressSheet.js.map +1 -1
- package/dist/esm/pages/TransactionPage/ExchangeRateBottomSheet.js +16 -15
- package/dist/esm/pages/TransactionPage/ExchangeRateBottomSheet.js.map +1 -1
- package/dist/esm/pages/TransactionPage/ExchangeRateBottomSheet.style.js.map +1 -1
- package/dist/esm/pages/TransactionPage/RouteTracker.js.map +1 -1
- package/dist/esm/pages/TransactionPage/TokenValueBottomSheet.js +3 -3
- package/dist/esm/pages/TransactionPage/TokenValueBottomSheet.js.map +1 -1
- package/dist/esm/pages/TransactionPage/TokenValueBottomSheet.style.js.map +1 -1
- package/dist/esm/pages/TransactionPage/TransactionExecutionContent.js +27 -31
- package/dist/esm/pages/TransactionPage/TransactionExecutionContent.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 +2 -2
- package/dist/esm/providers/QueryClientProvider.js.map +1 -1
- package/dist/esm/providers/SDKClientProvider.js +26 -27
- package/dist/esm/providers/SDKClientProvider.js.map +1 -1
- package/dist/esm/providers/WidgetProvider/WidgetProvider.js +25 -27
- package/dist/esm/providers/WidgetProvider/WidgetProvider.js.map +1 -1
- package/dist/esm/stores/StoreProvider.js +3 -4
- package/dist/esm/stores/StoreProvider.js.map +1 -1
- package/dist/esm/stores/bookmarks/BookmarkStore.js +3 -3
- package/dist/esm/stores/bookmarks/BookmarkStore.js.map +1 -1
- package/dist/esm/stores/bookmarks/createBookmarkStore.js.map +1 -1
- package/dist/esm/stores/chains/ChainOrderStore.js +4 -4
- package/dist/esm/stores/chains/ChainOrderStore.js.map +1 -1
- package/dist/esm/stores/chains/createChainOrderStore.js.map +1 -1
- package/dist/esm/stores/form/FormStore.js +1 -1
- package/dist/esm/stores/form/FormStore.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 +2 -2
- package/dist/esm/stores/form/useFormStore.js.map +1 -1
- package/dist/esm/stores/header/useHeaderStore.js +3 -3
- package/dist/esm/stores/header/useHeaderStore.js.map +1 -1
- package/dist/esm/stores/inputMode/useInputModeStore.js.map +1 -1
- package/dist/esm/stores/navigationTabs/useNavigationTabLabel.js +22 -0
- package/dist/esm/stores/navigationTabs/useNavigationTabLabel.js.map +1 -0
- package/dist/esm/stores/navigationTabs/useNavigationTabsStore.js +62 -0
- package/dist/esm/stores/navigationTabs/useNavigationTabsStore.js.map +1 -0
- package/dist/esm/stores/navigationTabs/utils.js +92 -0
- package/dist/esm/stores/navigationTabs/utils.js.map +1 -0
- package/dist/esm/stores/pinnedTokens/PinnedTokensStore.js +3 -3
- 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 +3 -3
- 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/utils.js.map +1 -1
- package/dist/esm/stores/settings/SettingsStore.js +3 -3
- package/dist/esm/stores/settings/SettingsStore.js.map +1 -1
- package/dist/esm/stores/settings/createSettingsStore.js +122 -96
- package/dist/esm/stores/settings/createSettingsStore.js.map +1 -1
- package/dist/esm/stores/settings/types.d.ts +0 -2
- package/dist/esm/stores/settings/types.d.ts.map +1 -1
- package/dist/esm/stores/settings/types.js.map +1 -1
- package/dist/esm/stores/settings/useSettingsActions.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/widget.d.ts +19 -2
- package/dist/esm/types/widget.d.ts.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/deepEqual.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/item.js.map +1 -1
- package/dist/esm/utils/{variant.js → mode.js} +2 -2
- package/dist/esm/utils/mode.js.map +1 -0
- package/dist/esm/utils/prepareActions.js +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 +1 -1
- package/dist/esm/utils/token.js.map +1 -1
- package/dist/esm/utils/tokenList.js.map +1 -1
- package/package.json +11 -11
- package/src/App.tsx +7 -7
- package/src/AppDrawer.tsx +77 -78
- package/src/AppDrawerContext.ts +2 -2
- package/src/components/BottomSheet/BottomSheet.tsx +56 -52
- package/src/components/Header/Header.tsx +20 -18
- package/src/components/Header/HeaderNavigationTabs.tsx +25 -0
- package/src/components/Header/HeaderTabs.tsx +48 -0
- package/src/components/Header/NavigationHeader.tsx +11 -8
- package/src/components/Tabs/NavigationTabs.tsx +3 -0
- package/src/components/TokenList/TokenDetailsSheet.tsx +9 -7
- package/src/components/TokenList/TokenDetailsSheetContent.tsx +176 -177
- package/src/components/TokenList/useTokenSelect.ts +2 -2
- package/src/config/version.ts +1 -1
- package/src/hooks/useSwapOnly.ts +2 -5
- package/src/hooks/useToAddressRequirements.ts +2 -2
- package/src/pages/MainPage/ReviewButton.tsx +2 -2
- package/src/pages/SendToWallet/BookmarkAddressSheet.tsx +176 -185
- package/src/pages/SendToWallet/ConfirmAddressSheet.tsx +9 -6
- package/src/pages/SettingsPage/SettingsCard/SettingCardExpandable.tsx +58 -65
- package/src/pages/SettingsPage/SettingsCard/SettingsAccordian.tsx +4 -4
- package/src/pages/TransactionPage/ConfirmToAddressSheet.tsx +9 -6
- package/src/pages/TransactionPage/ExchangeRateBottomSheet.tsx +53 -58
- package/src/pages/TransactionPage/TokenValueBottomSheet.tsx +24 -21
- package/src/pages/TransactionPage/TransactionExecutionContent.tsx +8 -6
- package/src/providers/QueryClientProvider.tsx +2 -2
- package/src/providers/SDKClientProvider.tsx +3 -7
- package/src/providers/WidgetProvider/WidgetProvider.tsx +6 -7
- package/src/stores/StoreProvider.tsx +3 -10
- package/src/stores/bookmarks/BookmarkStore.tsx +4 -4
- package/src/stores/chains/ChainOrderStore.tsx +4 -4
- package/src/stores/form/FormStore.tsx +2 -2
- package/src/stores/form/useFormStore.ts +2 -2
- package/src/stores/header/useHeaderStore.tsx +3 -5
- package/src/stores/navigationTabs/types.ts +27 -0
- package/src/stores/navigationTabs/useNavigationTabLabel.ts +28 -0
- package/src/stores/navigationTabs/useNavigationTabsStore.tsx +108 -0
- package/src/stores/navigationTabs/utils.ts +134 -0
- package/src/stores/pinnedTokens/PinnedTokensStore.tsx +4 -4
- package/src/stores/routes/RouteExecutionStore.tsx +4 -4
- package/src/stores/settings/SettingsStore.tsx +4 -4
- package/src/stores/settings/createSettingsStore.ts +48 -12
- package/src/stores/settings/types.ts +1 -16
- package/src/types/widget.ts +31 -1
- package/dist/esm/components/Header/SplitNavigationTabs.js +0 -33
- package/dist/esm/components/Header/SplitNavigationTabs.js.map +0 -1
- package/dist/esm/stores/settings/useSplitModeStore.js +0 -36
- package/dist/esm/stores/settings/useSplitModeStore.js.map +0 -1
- package/dist/esm/utils/variant.js.map +0 -1
- package/src/components/Header/SplitNavigationTabs.tsx +0 -32
- package/src/stores/settings/useSplitModeStore.tsx +0 -58
- /package/src/utils/{variant.ts → mode.ts} +0 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"createChainOrderStore.js","names":[],"sources":["../../../../src/stores/chains/createChainOrderStore.ts"],"sourcesContent":["import type { StoreApi, UseBoundStore } from 'zustand'\nimport { create } from 'zustand'\nimport { persist } from 'zustand/middleware'\nimport { widgetEvents } from '../../hooks/useWidgetEvents.js'\nimport { WidgetEvent } from '../../types/events.js'\nimport type { PersistStoreProps } from '../types.js'\nimport type { ChainOrderState } from './types.js'\n\n// (10 tiles: 9 + 1 for \"All chains\")\nexport const maxGridItemsToShow = 10\nexport const maxChainsToShow: number = maxGridItemsToShow - 1\n// If there are more than maxChainsToShow chains to show,\n// -1 tile to show a button \"+ N\" more chains\nexport const maxChainsToOrder: number = maxChainsToShow - 1\n\nconst defaultChainState = {\n from: [],\n to: [],\n}\n\nexport const createChainOrderStore = ({\n namePrefix,\n}: PersistStoreProps): UseBoundStore<StoreApi<ChainOrderState>> =>\n create<ChainOrderState>()(\n persist(\n (set, get) => ({\n chainOrder: defaultChainState,\n fromIsAllNetworks: true,\n toIsAllNetworks: true,\n fromShowAllNetworks: true,\n toShowAllNetworks: true,\n availableChains: defaultChainState,\n pinnedChains: [],\n initializeChains: (chainIds, type) => {\n set((state: ChainOrderState) => {\n const chainOrder = state.chainOrder[type].filter((chainId) =>\n chainIds.includes(chainId)\n )\n const chainsToAdd = chainIds.filter(\n (chainId) => !chainOrder.includes(chainId)\n )\n if (chainOrder.length === maxChainsToOrder || !chainsToAdd.length) {\n return {\n availableChains: {\n ...state.availableChains,\n [type]: chainIds,\n },\n chainOrder: {\n ...state.chainOrder,\n [type]: chainOrder,\n },\n }\n }\n const chainsToAddLength = maxChainsToOrder - chainOrder.length\n for (let index = 0; index < chainsToAddLength; index++) {\n chainOrder.push(chainsToAdd[index])\n }\n return {\n availableChains: {\n ...state.availableChains,\n [type]: chainIds,\n },\n chainOrder: {\n ...state.chainOrder,\n [type]: chainOrder,\n },\n }\n })\n return get().chainOrder[type].slice(0, maxChainsToOrder)\n },\n setChain: (chainId, type) => {\n const state = get()\n if (\n state.chainOrder[type].includes(chainId) ||\n !state.availableChains[type].includes(chainId)\n ) {\n return\n }\n set((state: ChainOrderState) => {\n const chainOrder = [chainId, ...state.chainOrder[type]].slice(\n 0,\n maxChainsToOrder\n )\n return {\n chainOrder: {\n ...state.chainOrder,\n [type]: chainOrder,\n },\n }\n })\n },\n setIsAllNetworks: (isAllNetworks, formType) => {\n set({ [`${formType}IsAllNetworks`]: isAllNetworks })\n },\n setShowAllNetworks: (showAllNetworks, formType) => {\n set({ [`${formType}ShowAllNetworks`]: showAllNetworks })\n },\n setPinnedChain: (chainId) => {\n const currentPinnedChains = get().pinnedChains\n const wasAlreadyPinned = currentPinnedChains.includes(chainId)\n set((state: ChainOrderState) => {\n const pinnedChains = [...state.pinnedChains]\n if (wasAlreadyPinned) {\n return {\n pinnedChains: pinnedChains.filter((id) => id !== chainId),\n }\n }\n pinnedChains.push(chainId)\n return {\n pinnedChains,\n }\n })\n widgetEvents.emit(WidgetEvent.ChainPinned, {\n chainId,\n pinned: !wasAlreadyPinned,\n })\n },\n }),\n {\n name: `${namePrefix || 'li.fi'}-widget-chains-order`,\n version: 4,\n partialize: (state) => ({\n chainOrder: state.chainOrder,\n pinnedChains: state.pinnedChains,\n }),\n }\n )\n )\n"],"mappings":";;;;AAeA,MAAM,oBAAoB;CACxB,MAAM,CAAC;CACP,IAAI,CAAC;AACP;AAEA,MAAa,yBAAyB,EACpC,iBAEA,OAAwB,
|
|
1
|
+
{"version":3,"file":"createChainOrderStore.js","names":[],"sources":["../../../../src/stores/chains/createChainOrderStore.ts"],"sourcesContent":["import type { StoreApi, UseBoundStore } from 'zustand'\nimport { create } from 'zustand'\nimport { persist } from 'zustand/middleware'\nimport { widgetEvents } from '../../hooks/useWidgetEvents.js'\nimport { WidgetEvent } from '../../types/events.js'\nimport type { PersistStoreProps } from '../types.js'\nimport type { ChainOrderState } from './types.js'\n\n// (10 tiles: 9 + 1 for \"All chains\")\nexport const maxGridItemsToShow = 10\nexport const maxChainsToShow: number = maxGridItemsToShow - 1\n// If there are more than maxChainsToShow chains to show,\n// -1 tile to show a button \"+ N\" more chains\nexport const maxChainsToOrder: number = maxChainsToShow - 1\n\nconst defaultChainState = {\n from: [],\n to: [],\n}\n\nexport const createChainOrderStore = ({\n namePrefix,\n}: PersistStoreProps): UseBoundStore<StoreApi<ChainOrderState>> =>\n create<ChainOrderState>()(\n persist(\n (set, get) => ({\n chainOrder: defaultChainState,\n fromIsAllNetworks: true,\n toIsAllNetworks: true,\n fromShowAllNetworks: true,\n toShowAllNetworks: true,\n availableChains: defaultChainState,\n pinnedChains: [],\n initializeChains: (chainIds, type) => {\n set((state: ChainOrderState) => {\n const chainOrder = state.chainOrder[type].filter((chainId) =>\n chainIds.includes(chainId)\n )\n const chainsToAdd = chainIds.filter(\n (chainId) => !chainOrder.includes(chainId)\n )\n if (chainOrder.length === maxChainsToOrder || !chainsToAdd.length) {\n return {\n availableChains: {\n ...state.availableChains,\n [type]: chainIds,\n },\n chainOrder: {\n ...state.chainOrder,\n [type]: chainOrder,\n },\n }\n }\n const chainsToAddLength = maxChainsToOrder - chainOrder.length\n for (let index = 0; index < chainsToAddLength; index++) {\n chainOrder.push(chainsToAdd[index])\n }\n return {\n availableChains: {\n ...state.availableChains,\n [type]: chainIds,\n },\n chainOrder: {\n ...state.chainOrder,\n [type]: chainOrder,\n },\n }\n })\n return get().chainOrder[type].slice(0, maxChainsToOrder)\n },\n setChain: (chainId, type) => {\n const state = get()\n if (\n state.chainOrder[type].includes(chainId) ||\n !state.availableChains[type].includes(chainId)\n ) {\n return\n }\n set((state: ChainOrderState) => {\n const chainOrder = [chainId, ...state.chainOrder[type]].slice(\n 0,\n maxChainsToOrder\n )\n return {\n chainOrder: {\n ...state.chainOrder,\n [type]: chainOrder,\n },\n }\n })\n },\n setIsAllNetworks: (isAllNetworks, formType) => {\n set({ [`${formType}IsAllNetworks`]: isAllNetworks })\n },\n setShowAllNetworks: (showAllNetworks, formType) => {\n set({ [`${formType}ShowAllNetworks`]: showAllNetworks })\n },\n setPinnedChain: (chainId) => {\n const currentPinnedChains = get().pinnedChains\n const wasAlreadyPinned = currentPinnedChains.includes(chainId)\n set((state: ChainOrderState) => {\n const pinnedChains = [...state.pinnedChains]\n if (wasAlreadyPinned) {\n return {\n pinnedChains: pinnedChains.filter((id) => id !== chainId),\n }\n }\n pinnedChains.push(chainId)\n return {\n pinnedChains,\n }\n })\n widgetEvents.emit(WidgetEvent.ChainPinned, {\n chainId,\n pinned: !wasAlreadyPinned,\n })\n },\n }),\n {\n name: `${namePrefix || 'li.fi'}-widget-chains-order`,\n version: 4,\n partialize: (state) => ({\n chainOrder: state.chainOrder,\n pinnedChains: state.pinnedChains,\n }),\n }\n )\n )\n"],"mappings":";;;;AAeA,MAAM,oBAAoB;CACxB,MAAM,CAAC;CACP,IAAI,CAAC;AACP;AAEA,MAAa,yBAAyB,EACpC,iBAEA,OAAwB,CAAC,CACvB,SACG,KAAK,SAAS;CACb,YAAY;CACZ,mBAAmB;CACnB,iBAAiB;CACjB,qBAAqB;CACrB,mBAAmB;CACnB,iBAAiB;CACjB,cAAc,CAAC;CACf,mBAAmB,UAAU,SAAS;EACpC,KAAK,UAA2B;GAC9B,MAAM,aAAa,MAAM,WAAW,KAAK,CAAC,QAAQ,YAChD,SAAS,SAAS,OAAO,CAC3B;GACA,MAAM,cAAc,SAAS,QAC1B,YAAY,CAAC,WAAW,SAAS,OAAO,CAC3C;GACA,IAAI,WAAW,WAAA,KAA+B,CAAC,YAAY,QACzD,OAAO;IACL,iBAAiB;KACf,GAAG,MAAM;MACR,OAAO;IACV;IACA,YAAY;KACV,GAAG,MAAM;MACR,OAAO;IACV;GACF;GAEF,MAAM,oBAAA,IAAuC,WAAW;GACxD,KAAK,IAAI,QAAQ,GAAG,QAAQ,mBAAmB,SAC7C,WAAW,KAAK,YAAY,MAAM;GAEpC,OAAO;IACL,iBAAiB;KACf,GAAG,MAAM;MACR,OAAO;IACV;IACA,YAAY;KACV,GAAG,MAAM;MACR,OAAO;IACV;GACF;EACF,CAAC;EACD,OAAO,IAAI,CAAC,CAAC,WAAW,KAAK,CAAC,MAAM,GAAA,CAAmB;CACzD;CACA,WAAW,SAAS,SAAS;EAC3B,MAAM,QAAQ,IAAI;EAClB,IACE,MAAM,WAAW,KAAK,CAAC,SAAS,OAAO,KACvC,CAAC,MAAM,gBAAgB,KAAK,CAAC,SAAS,OAAO,GAE7C;EAEF,KAAK,UAA2B;GAC9B,MAAM,aAAa,CAAC,SAAS,GAAG,MAAM,WAAW,KAAK,CAAC,CAAC,MACtD,GAAA,CAEF;GACA,OAAO,EACL,YAAY;IACV,GAAG,MAAM;KACR,OAAO;GACV,EACF;EACF,CAAC;CACH;CACA,mBAAmB,eAAe,aAAa;EAC7C,IAAI,GAAG,GAAG,SAAS,iBAAiB,cAAc,CAAC;CACrD;CACA,qBAAqB,iBAAiB,aAAa;EACjD,IAAI,GAAG,GAAG,SAAS,mBAAmB,gBAAgB,CAAC;CACzD;CACA,iBAAiB,YAAY;EAE3B,MAAM,mBADsB,IAAI,CAAC,CAAC,aACW,SAAS,OAAO;EAC7D,KAAK,UAA2B;GAC9B,MAAM,eAAe,CAAC,GAAG,MAAM,YAAY;GAC3C,IAAI,kBACF,OAAO,EACL,cAAc,aAAa,QAAQ,OAAO,OAAO,OAAO,EAC1D;GAEF,aAAa,KAAK,OAAO;GACzB,OAAO,EACL,aACF;EACF,CAAC;EACD,aAAa,KAAA,eAA8B;GACzC;GACA,QAAQ,CAAC;EACX,CAAC;CACH;AACF,IACA;CACE,MAAM,GAAG,cAAc,QAAQ;CAC/B,SAAS;CACT,aAAa,WAAW;EACtB,YAAY,MAAM;EAClB,cAAc,MAAM;CACtB;AACF,CACF,CACF"}
|
|
@@ -61,7 +61,7 @@ const FormStoreProvider = ({ children, formRef }) => {
|
|
|
61
61
|
}));
|
|
62
62
|
}
|
|
63
63
|
useFormRef(storeRef.current, formRef);
|
|
64
|
-
return /* @__PURE__ */ jsxs(FormStoreContext
|
|
64
|
+
return /* @__PURE__ */ jsxs(FormStoreContext, {
|
|
65
65
|
value: storeRef.current,
|
|
66
66
|
children: [children, /* @__PURE__ */ jsx(FormUpdater, { reactiveFormValues })]
|
|
67
67
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormStore.js","names":[],"sources":["../../../../src/stores/form/FormStore.tsx"],"sourcesContent":["import type { PropsWithChildren } from 'react'\nimport { useMemo, useRef } from 'react'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport type { FormRef } from '../../types/widget.js'\nimport { createFormStore, formDefaultValues } from './createFormStore.js'\nimport { FormStoreContext } from './FormStoreContext.js'\nimport { FormUpdater } from './FormUpdater.js'\nimport { getDefaultValuesFromQueryString } from './getDefaultValuesFromQueryString.js'\nimport type { DefaultValues, FormStoreStore } from './types.js'\nimport { useFormRef } from './useFormRef.js'\n\n// decorates and initialise the form date for use in the form store\nconst initialiseDefaultValues = (defaultValues: Partial<DefaultValues>) => ({\n ...formDefaultValues,\n ...defaultValues,\n fromAmount:\n (typeof defaultValues.fromAmount === 'number'\n ? (defaultValues.fromAmount as number)?.toPrecision?.()\n : defaultValues.fromAmount) || formDefaultValues.fromAmount,\n toAmount:\n (typeof defaultValues.toAmount === 'number'\n ? (defaultValues.toAmount as number)?.toPrecision?.()\n : defaultValues.toAmount) || formDefaultValues.toAmount,\n // Prevent setting address when the field is hidden\n toAddress: defaultValues.toAddress || formDefaultValues.toAddress,\n})\n\ninterface FormStoreProviderProps extends PropsWithChildren {\n formRef?: FormRef\n}\n\nexport const FormStoreProvider: React.FC<FormStoreProviderProps> = ({\n children,\n formRef,\n}) => {\n const widgetConfig = useWidgetConfig()\n\n const {\n fromChain,\n fromToken,\n toChain,\n toToken,\n fromAmount,\n toAmount,\n toAddress,\n formUpdateKey,\n buildUrl,\n } = widgetConfig\n\n const storeRef = useRef<FormStoreStore>(null)\n\n const configHasFromChain = Object.hasOwn(widgetConfig, 'fromChain')\n const configHasFromToken = Object.hasOwn(widgetConfig, 'fromToken')\n const configHasFromAmount = Object.hasOwn(widgetConfig, 'fromAmount')\n const configHasToAmount = Object.hasOwn(widgetConfig, 'toAmount')\n const configHasToAddress = Object.hasOwn(widgetConfig, 'toAddress')\n const configHasToChain = Object.hasOwn(widgetConfig, 'toChain')\n const configHasToToken = Object.hasOwn(widgetConfig, 'toToken')\n\n // We use the presence/absence of a property to decide if the form values in state need to be updated\n // We only build and set a property on the memoized form values here if they are included in the\n // config - undefined is considered a valid value that will reset that form field\n // biome-ignore lint/correctness/useExhaustiveDependencies: formUpdateKey is needed here.\n const reactiveFormValues = useMemo(\n () => ({\n ...(configHasFromChain ? { fromChain } : undefined),\n ...(configHasFromToken ? { fromToken } : undefined),\n ...(configHasFromAmount\n ? {\n fromAmount:\n (typeof fromAmount === 'number'\n ? fromAmount?.toPrecision()\n : fromAmount) || formDefaultValues.fromAmount,\n }\n : undefined),\n ...(configHasToAmount\n ? {\n toAmount:\n (typeof toAmount === 'number'\n ? toAmount?.toPrecision()\n : toAmount) || formDefaultValues.toAmount,\n }\n : undefined),\n ...(configHasToChain ? { toChain } : undefined),\n ...(configHasToToken ? { toToken } : undefined),\n ...(configHasToAddress\n ? {\n toAddress: toAddress?.address || formDefaultValues.toAddress,\n }\n : undefined),\n }),\n [\n fromAmount,\n toAmount,\n fromChain,\n fromToken,\n toAddress,\n toChain,\n toToken,\n // formUpdateKey should be a randomly assigned unique key. It can be used to force updates for the form field values\n formUpdateKey,\n configHasFromChain,\n configHasFromToken,\n configHasFromAmount,\n configHasToAmount,\n configHasToAddress,\n configHasToChain,\n configHasToToken,\n ]\n )\n\n if (!storeRef.current) {\n const queryDefaults = getDefaultValuesFromQueryString({\n buildUrl,\n includeToAddress: false,\n })\n storeRef.current = createFormStore(\n initialiseDefaultValues({\n ...reactiveFormValues,\n ...queryDefaults,\n })\n )\n }\n\n useFormRef(storeRef.current, formRef)\n\n return (\n <FormStoreContext
|
|
1
|
+
{"version":3,"file":"FormStore.js","names":[],"sources":["../../../../src/stores/form/FormStore.tsx"],"sourcesContent":["import type { PropsWithChildren } from 'react'\nimport { useMemo, useRef } from 'react'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport type { FormRef } from '../../types/widget.js'\nimport { createFormStore, formDefaultValues } from './createFormStore.js'\nimport { FormStoreContext } from './FormStoreContext.js'\nimport { FormUpdater } from './FormUpdater.js'\nimport { getDefaultValuesFromQueryString } from './getDefaultValuesFromQueryString.js'\nimport type { DefaultValues, FormStoreStore } from './types.js'\nimport { useFormRef } from './useFormRef.js'\n\n// decorates and initialise the form date for use in the form store\nconst initialiseDefaultValues = (defaultValues: Partial<DefaultValues>) => ({\n ...formDefaultValues,\n ...defaultValues,\n fromAmount:\n (typeof defaultValues.fromAmount === 'number'\n ? (defaultValues.fromAmount as number)?.toPrecision?.()\n : defaultValues.fromAmount) || formDefaultValues.fromAmount,\n toAmount:\n (typeof defaultValues.toAmount === 'number'\n ? (defaultValues.toAmount as number)?.toPrecision?.()\n : defaultValues.toAmount) || formDefaultValues.toAmount,\n // Prevent setting address when the field is hidden\n toAddress: defaultValues.toAddress || formDefaultValues.toAddress,\n})\n\ninterface FormStoreProviderProps extends PropsWithChildren {\n formRef?: FormRef\n}\n\nexport const FormStoreProvider: React.FC<FormStoreProviderProps> = ({\n children,\n formRef,\n}) => {\n const widgetConfig = useWidgetConfig()\n\n const {\n fromChain,\n fromToken,\n toChain,\n toToken,\n fromAmount,\n toAmount,\n toAddress,\n formUpdateKey,\n buildUrl,\n } = widgetConfig\n\n const storeRef = useRef<FormStoreStore>(null)\n\n const configHasFromChain = Object.hasOwn(widgetConfig, 'fromChain')\n const configHasFromToken = Object.hasOwn(widgetConfig, 'fromToken')\n const configHasFromAmount = Object.hasOwn(widgetConfig, 'fromAmount')\n const configHasToAmount = Object.hasOwn(widgetConfig, 'toAmount')\n const configHasToAddress = Object.hasOwn(widgetConfig, 'toAddress')\n const configHasToChain = Object.hasOwn(widgetConfig, 'toChain')\n const configHasToToken = Object.hasOwn(widgetConfig, 'toToken')\n\n // We use the presence/absence of a property to decide if the form values in state need to be updated\n // We only build and set a property on the memoized form values here if they are included in the\n // config - undefined is considered a valid value that will reset that form field\n // biome-ignore lint/correctness/useExhaustiveDependencies: formUpdateKey is needed here.\n const reactiveFormValues = useMemo(\n () => ({\n ...(configHasFromChain ? { fromChain } : undefined),\n ...(configHasFromToken ? { fromToken } : undefined),\n ...(configHasFromAmount\n ? {\n fromAmount:\n (typeof fromAmount === 'number'\n ? fromAmount?.toPrecision()\n : fromAmount) || formDefaultValues.fromAmount,\n }\n : undefined),\n ...(configHasToAmount\n ? {\n toAmount:\n (typeof toAmount === 'number'\n ? toAmount?.toPrecision()\n : toAmount) || formDefaultValues.toAmount,\n }\n : undefined),\n ...(configHasToChain ? { toChain } : undefined),\n ...(configHasToToken ? { toToken } : undefined),\n ...(configHasToAddress\n ? {\n toAddress: toAddress?.address || formDefaultValues.toAddress,\n }\n : undefined),\n }),\n [\n fromAmount,\n toAmount,\n fromChain,\n fromToken,\n toAddress,\n toChain,\n toToken,\n // formUpdateKey should be a randomly assigned unique key. It can be used to force updates for the form field values\n formUpdateKey,\n configHasFromChain,\n configHasFromToken,\n configHasFromAmount,\n configHasToAmount,\n configHasToAddress,\n configHasToChain,\n configHasToToken,\n ]\n )\n\n if (!storeRef.current) {\n const queryDefaults = getDefaultValuesFromQueryString({\n buildUrl,\n includeToAddress: false,\n })\n storeRef.current = createFormStore(\n initialiseDefaultValues({\n ...reactiveFormValues,\n ...queryDefaults,\n })\n )\n }\n\n useFormRef(storeRef.current, formRef)\n\n return (\n <FormStoreContext value={storeRef.current}>\n {children}\n <FormUpdater reactiveFormValues={reactiveFormValues} />\n </FormStoreContext>\n )\n}\n"],"mappings":";;;;;;;;;AAYA,MAAM,2BAA2B,mBAA2C;CAC1E,GAAG;CACH,GAAG;CACH,aACG,OAAO,cAAc,eAAe,WAChC,cAAc,YAAuB,cAAc,IACpD,cAAc,eAAe,kBAAkB;CACrD,WACG,OAAO,cAAc,aAAa,WAC9B,cAAc,UAAqB,cAAc,IAClD,cAAc,aAAa,kBAAkB;CAEnD,WAAW,cAAc,aAAa,kBAAkB;AAC1D;AAMA,MAAa,qBAAuD,EAClE,UACA,cACI;CACJ,MAAM,eAAe,gBAAgB;CAErC,MAAM,EACJ,WACA,WACA,SACA,SACA,YACA,UACA,WACA,eACA,aACE;CAEJ,MAAM,WAAW,OAAuB,IAAI;CAE5C,MAAM,qBAAqB,OAAO,OAAO,cAAc,WAAW;CAClE,MAAM,qBAAqB,OAAO,OAAO,cAAc,WAAW;CAClE,MAAM,sBAAsB,OAAO,OAAO,cAAc,YAAY;CACpE,MAAM,oBAAoB,OAAO,OAAO,cAAc,UAAU;CAChE,MAAM,qBAAqB,OAAO,OAAO,cAAc,WAAW;CAClE,MAAM,mBAAmB,OAAO,OAAO,cAAc,SAAS;CAC9D,MAAM,mBAAmB,OAAO,OAAO,cAAc,SAAS;CAM9D,MAAM,qBAAqB,eAClB;EACL,GAAI,qBAAqB,EAAE,UAAU,IAAI,KAAA;EACzC,GAAI,qBAAqB,EAAE,UAAU,IAAI,KAAA;EACzC,GAAI,sBACA,EACE,aACG,OAAO,eAAe,WACnB,YAAY,YAAY,IACxB,eAAe,kBAAkB,WACzC,IACA,KAAA;EACJ,GAAI,oBACA,EACE,WACG,OAAO,aAAa,WACjB,UAAU,YAAY,IACtB,aAAa,kBAAkB,SACvC,IACA,KAAA;EACJ,GAAI,mBAAmB,EAAE,QAAQ,IAAI,KAAA;EACrC,GAAI,mBAAmB,EAAE,QAAQ,IAAI,KAAA;EACrC,GAAI,qBACA,EACE,WAAW,WAAW,WAAW,kBAAkB,UACrD,IACA,KAAA;CACN,IACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CACF;CAEA,IAAI,CAAC,SAAS,SAAS;EACrB,MAAM,gBAAgB,gCAAgC;GACpD;GACA,kBAAkB;EACpB,CAAC;EACD,SAAS,UAAU,gBACjB,wBAAwB;GACtB,GAAG;GACH,GAAG;EACL,CAAC,CACH;CACF;CAEA,WAAW,SAAS,SAAS,OAAO;CAEpC,OACE,qBAAC,kBAAD;EAAkB,OAAO,SAAS;YAAlC,CACG,UACD,oBAAC,aAAD,EAAiC,mBAAqB,CAAA,CACtC;;AAEtB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"URLSearchParamsBuilder.js","names":[],"sources":["../../../../src/stores/form/URLSearchParamsBuilder.tsx"],"sourcesContent":["import { useLocation } from '@tanstack/react-router'\nimport { useEffect } from 'react'\nimport { useAddressValidation } from '../../hooks/useAddressValidation.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { useBookmarkActions } from '../bookmarks/useBookmarkActions.js'\nimport type { FormFieldNames } from '../form/types.js'\nimport { useFieldActions } from '../form/useFieldActions.js'\nimport { useFieldValues } from '../form/useFieldValues.js'\nimport { useTouchedFields } from '../form/useTouchedFields.js'\nimport { getDefaultValuesFromQueryString } from './getDefaultValuesFromQueryString.js'\n\nconst formValueKeys: FormFieldNames[] = [\n 'fromAmount',\n 'fromChain',\n 'fromToken',\n 'toAddress',\n 'toChain',\n 'toToken',\n]\n\nexport const URLSearchParamsBuilder = () => {\n const { pathname } = useLocation()\n const touchedFields = useTouchedFields()\n const values = useFieldValues(...formValueKeys)\n const { setSelectedBookmark, addRecentWallet } = useBookmarkActions()\n const { validateAddress } = useAddressValidation()\n const { buildUrl } = useWidgetConfig()\n // Using these methods as trying to use the touchedFields and values above\n // often has a lag that can effect the widgets initialisation sequence\n // and accidentally cause values to be wiped from the query string\n const { getFieldValues, isTouched, setUserAndDefaultValues } =\n useFieldActions()\n\n useEffect(() => {\n // get the initial values from the querystring\n const formValues = getDefaultValuesFromQueryString({ buildUrl })\n const { toAddress, ...initialFormValues } = formValues\n\n /**\n * When URL builder is enabled and user opens a page with toAddress parameter,\n * validate the address and set it up as a bookmark. This allows direct linking\n * to the widget with a pre-filled destination address that will be treated the\n * same way as a manually entered and validated address.\n */\n const initializeFromAddress = async () => {\n if (toAddress) {\n try {\n const validationResult = await validateAddress({\n value: toAddress,\n })\n if (validationResult.isValid && toAddress) {\n const bookmark = {\n address: validationResult.address,\n chainType: validationResult.chainType,\n }\n setUserAndDefaultValues({ toAddress })\n setSelectedBookmark(bookmark)\n addRecentWallet(bookmark)\n }\n } catch (_) {\n // Address validation failed\n }\n }\n }\n\n setUserAndDefaultValues(initialFormValues)\n initializeFromAddress()\n }, [\n setUserAndDefaultValues,\n validateAddress,\n setSelectedBookmark,\n addRecentWallet,\n buildUrl,\n ])\n\n // biome-ignore lint/correctness/useExhaustiveDependencies: run only when pathname changes\n useEffect(() => {\n // set the values on the querysting\n const url = new URL(window.location as any)\n formValueKeys.forEach((key, _index) => {\n const value = getFieldValues(key)[0]\n if (isTouched(key) && value) {\n url.searchParams.set(key, value.toString())\n } else if (url.searchParams.has(key) && !value) {\n url.searchParams.delete(key)\n }\n })\n url.searchParams.sort()\n window.history.replaceState(window.history.state, '', url)\n }, [pathname, touchedFields, values, isTouched, getFieldValues])\n\n return null\n}\n"],"mappings":";;;;;;;;;;AAWA,MAAM,gBAAkC;CACtC;CACA;CACA;CACA;CACA;CACA;AACF;AAEA,MAAa,+BAA+B;CAC1C,MAAM,EAAE,aAAa,YAAY;CACjC,MAAM,gBAAgB,iBAAiB;CACvC,MAAM,SAAS,eAAe,GAAG,aAAa;CAC9C,MAAM,EAAE,qBAAqB,oBAAoB,mBAAmB;CACpE,MAAM,EAAE,oBAAoB,qBAAqB;CACjD,MAAM,EAAE,aAAa,gBAAgB;CAIrC,MAAM,EAAE,gBAAgB,WAAW,4BACjC,gBAAgB;CAElB,gBAAgB;EAGd,MAAM,EAAE,WAAW,GAAG,sBADH,gCAAgC,EAAE,SAAS,CACT;;;;;;;EAQrD,MAAM,wBAAwB,YAAY;GACxC,IAAI,WACF,IAAI;IACF,MAAM,mBAAmB,MAAM,gBAAgB,EAC7C,OAAO,UACT,CAAC;IACD,IAAI,iBAAiB,WAAW,WAAW;KACzC,MAAM,WAAW;MACf,SAAS,iBAAiB;MAC1B,WAAW,iBAAiB;KAC9B;KACA,wBAAwB,EAAE,UAAU,CAAC;KACrC,oBAAoB,QAAQ;KAC5B,gBAAgB,QAAQ;IAC1B;GACF,SAAS,GAAG,CAEZ;EAEJ;EAEA,wBAAwB,iBAAiB;EACzC,sBAAsB;CACxB,GAAG;EACD;EACA;EACA;EACA;EACA;CACF,CAAC;CAGD,gBAAgB;EAEd,MAAM,MAAM,IAAI,IAAI,OAAO,QAAe;EAC1C,cAAc,SAAS,KAAK,WAAW;GACrC,MAAM,QAAQ,eAAe,GAAG,
|
|
1
|
+
{"version":3,"file":"URLSearchParamsBuilder.js","names":[],"sources":["../../../../src/stores/form/URLSearchParamsBuilder.tsx"],"sourcesContent":["import { useLocation } from '@tanstack/react-router'\nimport { useEffect } from 'react'\nimport { useAddressValidation } from '../../hooks/useAddressValidation.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { useBookmarkActions } from '../bookmarks/useBookmarkActions.js'\nimport type { FormFieldNames } from '../form/types.js'\nimport { useFieldActions } from '../form/useFieldActions.js'\nimport { useFieldValues } from '../form/useFieldValues.js'\nimport { useTouchedFields } from '../form/useTouchedFields.js'\nimport { getDefaultValuesFromQueryString } from './getDefaultValuesFromQueryString.js'\n\nconst formValueKeys: FormFieldNames[] = [\n 'fromAmount',\n 'fromChain',\n 'fromToken',\n 'toAddress',\n 'toChain',\n 'toToken',\n]\n\nexport const URLSearchParamsBuilder = () => {\n const { pathname } = useLocation()\n const touchedFields = useTouchedFields()\n const values = useFieldValues(...formValueKeys)\n const { setSelectedBookmark, addRecentWallet } = useBookmarkActions()\n const { validateAddress } = useAddressValidation()\n const { buildUrl } = useWidgetConfig()\n // Using these methods as trying to use the touchedFields and values above\n // often has a lag that can effect the widgets initialisation sequence\n // and accidentally cause values to be wiped from the query string\n const { getFieldValues, isTouched, setUserAndDefaultValues } =\n useFieldActions()\n\n useEffect(() => {\n // get the initial values from the querystring\n const formValues = getDefaultValuesFromQueryString({ buildUrl })\n const { toAddress, ...initialFormValues } = formValues\n\n /**\n * When URL builder is enabled and user opens a page with toAddress parameter,\n * validate the address and set it up as a bookmark. This allows direct linking\n * to the widget with a pre-filled destination address that will be treated the\n * same way as a manually entered and validated address.\n */\n const initializeFromAddress = async () => {\n if (toAddress) {\n try {\n const validationResult = await validateAddress({\n value: toAddress,\n })\n if (validationResult.isValid && toAddress) {\n const bookmark = {\n address: validationResult.address,\n chainType: validationResult.chainType,\n }\n setUserAndDefaultValues({ toAddress })\n setSelectedBookmark(bookmark)\n addRecentWallet(bookmark)\n }\n } catch (_) {\n // Address validation failed\n }\n }\n }\n\n setUserAndDefaultValues(initialFormValues)\n initializeFromAddress()\n }, [\n setUserAndDefaultValues,\n validateAddress,\n setSelectedBookmark,\n addRecentWallet,\n buildUrl,\n ])\n\n // biome-ignore lint/correctness/useExhaustiveDependencies: run only when pathname changes\n useEffect(() => {\n // set the values on the querysting\n const url = new URL(window.location as any)\n formValueKeys.forEach((key, _index) => {\n const value = getFieldValues(key)[0]\n if (isTouched(key) && value) {\n url.searchParams.set(key, value.toString())\n } else if (url.searchParams.has(key) && !value) {\n url.searchParams.delete(key)\n }\n })\n url.searchParams.sort()\n window.history.replaceState(window.history.state, '', url)\n }, [pathname, touchedFields, values, isTouched, getFieldValues])\n\n return null\n}\n"],"mappings":";;;;;;;;;;AAWA,MAAM,gBAAkC;CACtC;CACA;CACA;CACA;CACA;CACA;AACF;AAEA,MAAa,+BAA+B;CAC1C,MAAM,EAAE,aAAa,YAAY;CACjC,MAAM,gBAAgB,iBAAiB;CACvC,MAAM,SAAS,eAAe,GAAG,aAAa;CAC9C,MAAM,EAAE,qBAAqB,oBAAoB,mBAAmB;CACpE,MAAM,EAAE,oBAAoB,qBAAqB;CACjD,MAAM,EAAE,aAAa,gBAAgB;CAIrC,MAAM,EAAE,gBAAgB,WAAW,4BACjC,gBAAgB;CAElB,gBAAgB;EAGd,MAAM,EAAE,WAAW,GAAG,sBADH,gCAAgC,EAAE,SAAS,CACT;;;;;;;EAQrD,MAAM,wBAAwB,YAAY;GACxC,IAAI,WACF,IAAI;IACF,MAAM,mBAAmB,MAAM,gBAAgB,EAC7C,OAAO,UACT,CAAC;IACD,IAAI,iBAAiB,WAAW,WAAW;KACzC,MAAM,WAAW;MACf,SAAS,iBAAiB;MAC1B,WAAW,iBAAiB;KAC9B;KACA,wBAAwB,EAAE,UAAU,CAAC;KACrC,oBAAoB,QAAQ;KAC5B,gBAAgB,QAAQ;IAC1B;GACF,SAAS,GAAG,CAEZ;EAEJ;EAEA,wBAAwB,iBAAiB;EACzC,sBAAsB;CACxB,GAAG;EACD;EACA;EACA;EACA;EACA;CACF,CAAC;CAGD,gBAAgB;EAEd,MAAM,MAAM,IAAI,IAAI,OAAO,QAAe;EAC1C,cAAc,SAAS,KAAK,WAAW;GACrC,MAAM,QAAQ,eAAe,GAAG,CAAC,CAAC;GAClC,IAAI,UAAU,GAAG,KAAK,OACpB,IAAI,aAAa,IAAI,KAAK,MAAM,SAAS,CAAC;QACrC,IAAI,IAAI,aAAa,IAAI,GAAG,KAAK,CAAC,OACvC,IAAI,aAAa,OAAO,GAAG;EAE/B,CAAC;EACD,IAAI,aAAa,KAAK;EACtB,OAAO,QAAQ,aAAa,OAAO,QAAQ,OAAO,IAAI,GAAG;CAC3D,GAAG;EAAC;EAAU;EAAe;EAAQ;EAAW;CAAc,CAAC;CAE/D,OAAO;AACT"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"createFormStore.js","names":[],"sources":["../../../../src/stores/form/createFormStore.ts"],"sourcesContent":["import type { StoreApi, UseBoundStore } from 'zustand'\nimport { create } from 'zustand'\n\nimport type {\n DefaultValues,\n FormFieldArray,\n FormFieldNames,\n FormValueControl,\n FormValues,\n FormValuesState,\n} from './types.js'\n\nexport const formDefaultValues: DefaultValues = {\n fromAmount: '',\n toAmount: '',\n tokenSearchFilter: '',\n}\n\nconst defaultValueToFormValue = <T>(value: T): FormValueControl<T> => ({\n isTouched: false,\n isDirty: false,\n value,\n})\n\nconst valuesToFormValues = (defaultValues: DefaultValues): FormValues => {\n return (Object.keys(defaultValues) as FormFieldNames[]).reduce(\n (accum, key) => {\n accum[key] = defaultValueToFormValue(defaultValues[key]) as never\n return accum\n },\n {} as FormValues\n )\n}\n\nconst isString = (str: any) => typeof str === 'string' || str instanceof String\n\nconst getUpdatedTouchedFields = (userValues: FormValues) => {\n return (Object.keys(userValues) as FormFieldNames[]).reduce(\n (accum, key) => {\n if (userValues[key]?.isTouched) {\n accum[key] = true\n }\n return accum\n },\n {} as Record<FormFieldNames, boolean>\n )\n}\n\nconst mergeDefaultFormValues = (\n userValues: FormValues,\n defaultValues: FormValues\n) =>\n (Object.keys(defaultValues) as FormFieldNames[]).reduce<FormValues>(\n (accum, key) => {\n const formValue = {\n isTouched: !!(\n userValues[key]?.isTouched || defaultValues[key]?.isTouched\n ),\n isDirty: !!(userValues[key]?.isDirty || defaultValues[key]?.isTouched),\n value:\n userValues[key]?.value || Number.isFinite(userValues[key]?.value)\n ? userValues[key]?.value\n : defaultValues[key]?.value,\n }\n accum[key] = formValue as never\n return accum\n },\n { ...valuesToFormValues(formDefaultValues) }\n )\n\nexport const createFormStore = (\n defaultValues?: DefaultValues\n): UseBoundStore<StoreApi<FormValuesState>> =>\n create<FormValuesState>((set, get) => {\n const _defaultValues = valuesToFormValues({\n ...formDefaultValues,\n ...defaultValues,\n })\n return {\n defaultValues: _defaultValues,\n userValues: _defaultValues,\n touchedFields: {},\n isValid: true,\n isValidating: false,\n errors: {},\n validation: {},\n setDefaultValues: (defaultValue) => {\n const defaultFormValues = valuesToFormValues(defaultValue)\n set((state) => ({\n defaultValues: defaultFormValues,\n userValues: mergeDefaultFormValues(\n state.userValues,\n defaultFormValues\n ),\n }))\n },\n setUserAndDefaultValues: (formValues) => {\n const currentUserValues = get().userValues\n ;(Object.keys(formValues) as FormFieldNames[]).forEach((key) => {\n if (formValues[key] !== currentUserValues[key]?.value) {\n get().resetField(key, { defaultValue: formValues[key] })\n get().setFieldValue(key, formValues[key], { isTouched: true })\n }\n })\n },\n isTouched: (fieldName: FormFieldNames) =>\n !!get().userValues[fieldName]?.isTouched,\n isDirty: (fieldName: FormFieldNames) =>\n !!get().userValues[fieldName]?.isDirty,\n setAsTouched: (fieldName: FormFieldNames) => {\n const userValues = {\n ...get().userValues,\n [fieldName]: {\n ...get().userValues[fieldName],\n isTouched: true,\n },\n }\n\n const touchedFields = getUpdatedTouchedFields(userValues)\n\n set(() => ({\n userValues,\n touchedFields,\n }))\n },\n resetField: (fieldName, { defaultValue } = {}) => {\n if (defaultValue) {\n const fieldValues = {\n ...get().defaultValues[fieldName],\n value: defaultValue,\n }\n const defaultValues = {\n ...get().defaultValues,\n [fieldName]: { ...fieldValues },\n }\n const userValues = {\n ...get().userValues,\n [fieldName]: { ...fieldValues },\n }\n const touchedFields = getUpdatedTouchedFields(userValues)\n\n set(() => {\n return {\n defaultValues,\n userValues,\n touchedFields,\n }\n })\n } else {\n const userValues = {\n ...get().userValues,\n [fieldName]: { ...get().defaultValues[fieldName] },\n }\n const touchedFields = getUpdatedTouchedFields(userValues)\n\n set(() => ({\n userValues,\n touchedFields,\n }))\n }\n },\n setFieldValue: (fieldName, value, { isDirty, isTouched } = {}) => {\n const userValues = {\n ...get().userValues,\n [fieldName]: {\n value,\n isDirty:\n isDirty === undefined\n ? get().userValues[fieldName]?.isDirty\n : isDirty,\n isTouched:\n isTouched === undefined\n ? get().userValues[fieldName]?.isTouched\n : isTouched,\n },\n }\n\n const touchedFields = getUpdatedTouchedFields(userValues)\n\n set(() => ({\n userValues,\n touchedFields,\n }))\n },\n getFieldValues: <T extends FormFieldNames[]>(...names: T) =>\n names.map((name) => get().userValues[name]?.value) as FormFieldArray<T>,\n addFieldValidation: (name, validationFn) => {\n set((state) => ({\n validation: {\n ...state.validation,\n [name]: validationFn,\n },\n }))\n },\n triggerFieldValidation: async (name) => {\n try {\n let valid = true\n set(() => ({ isValid: false, isValidating: true }))\n\n const validationFn = get().validation[name]\n\n if (validationFn) {\n const result = await validationFn(get().userValues?.[name]?.value)\n if (isString(result)) {\n valid = false\n set((state) => ({\n errors: {\n ...state.errors,\n [name]: result,\n },\n }))\n } else {\n valid = result as boolean\n if (valid) {\n get().clearErrors(name)\n }\n }\n }\n\n set(() => ({ isValid: valid, isValidating: false }))\n return valid\n } catch (err) {\n set(() => ({ isValidating: false }))\n throw err\n }\n },\n clearErrors: (name) => {\n const newErrors = { ...get().errors }\n\n delete newErrors[name]\n\n set(() => ({\n errors: newErrors,\n }))\n },\n }\n })\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"createFormStore.js","names":[],"sources":["../../../../src/stores/form/createFormStore.ts"],"sourcesContent":["import type { StoreApi, UseBoundStore } from 'zustand'\nimport { create } from 'zustand'\n\nimport type {\n DefaultValues,\n FormFieldArray,\n FormFieldNames,\n FormValueControl,\n FormValues,\n FormValuesState,\n} from './types.js'\n\nexport const formDefaultValues: DefaultValues = {\n fromAmount: '',\n toAmount: '',\n tokenSearchFilter: '',\n}\n\nconst defaultValueToFormValue = <T>(value: T): FormValueControl<T> => ({\n isTouched: false,\n isDirty: false,\n value,\n})\n\nconst valuesToFormValues = (defaultValues: DefaultValues): FormValues => {\n return (Object.keys(defaultValues) as FormFieldNames[]).reduce(\n (accum, key) => {\n accum[key] = defaultValueToFormValue(defaultValues[key]) as never\n return accum\n },\n {} as FormValues\n )\n}\n\nconst isString = (str: any) => typeof str === 'string' || str instanceof String\n\nconst getUpdatedTouchedFields = (userValues: FormValues) => {\n return (Object.keys(userValues) as FormFieldNames[]).reduce(\n (accum, key) => {\n if (userValues[key]?.isTouched) {\n accum[key] = true\n }\n return accum\n },\n {} as Record<FormFieldNames, boolean>\n )\n}\n\nconst mergeDefaultFormValues = (\n userValues: FormValues,\n defaultValues: FormValues\n) =>\n (Object.keys(defaultValues) as FormFieldNames[]).reduce<FormValues>(\n (accum, key) => {\n const formValue = {\n isTouched: !!(\n userValues[key]?.isTouched || defaultValues[key]?.isTouched\n ),\n isDirty: !!(userValues[key]?.isDirty || defaultValues[key]?.isTouched),\n value:\n userValues[key]?.value || Number.isFinite(userValues[key]?.value)\n ? userValues[key]?.value\n : defaultValues[key]?.value,\n }\n accum[key] = formValue as never\n return accum\n },\n { ...valuesToFormValues(formDefaultValues) }\n )\n\nexport const createFormStore = (\n defaultValues?: DefaultValues\n): UseBoundStore<StoreApi<FormValuesState>> =>\n create<FormValuesState>((set, get) => {\n const _defaultValues = valuesToFormValues({\n ...formDefaultValues,\n ...defaultValues,\n })\n return {\n defaultValues: _defaultValues,\n userValues: _defaultValues,\n touchedFields: {},\n isValid: true,\n isValidating: false,\n errors: {},\n validation: {},\n setDefaultValues: (defaultValue) => {\n const defaultFormValues = valuesToFormValues(defaultValue)\n set((state) => ({\n defaultValues: defaultFormValues,\n userValues: mergeDefaultFormValues(\n state.userValues,\n defaultFormValues\n ),\n }))\n },\n setUserAndDefaultValues: (formValues) => {\n const currentUserValues = get().userValues\n ;(Object.keys(formValues) as FormFieldNames[]).forEach((key) => {\n if (formValues[key] !== currentUserValues[key]?.value) {\n get().resetField(key, { defaultValue: formValues[key] })\n get().setFieldValue(key, formValues[key], { isTouched: true })\n }\n })\n },\n isTouched: (fieldName: FormFieldNames) =>\n !!get().userValues[fieldName]?.isTouched,\n isDirty: (fieldName: FormFieldNames) =>\n !!get().userValues[fieldName]?.isDirty,\n setAsTouched: (fieldName: FormFieldNames) => {\n const userValues = {\n ...get().userValues,\n [fieldName]: {\n ...get().userValues[fieldName],\n isTouched: true,\n },\n }\n\n const touchedFields = getUpdatedTouchedFields(userValues)\n\n set(() => ({\n userValues,\n touchedFields,\n }))\n },\n resetField: (fieldName, { defaultValue } = {}) => {\n if (defaultValue) {\n const fieldValues = {\n ...get().defaultValues[fieldName],\n value: defaultValue,\n }\n const defaultValues = {\n ...get().defaultValues,\n [fieldName]: { ...fieldValues },\n }\n const userValues = {\n ...get().userValues,\n [fieldName]: { ...fieldValues },\n }\n const touchedFields = getUpdatedTouchedFields(userValues)\n\n set(() => {\n return {\n defaultValues,\n userValues,\n touchedFields,\n }\n })\n } else {\n const userValues = {\n ...get().userValues,\n [fieldName]: { ...get().defaultValues[fieldName] },\n }\n const touchedFields = getUpdatedTouchedFields(userValues)\n\n set(() => ({\n userValues,\n touchedFields,\n }))\n }\n },\n setFieldValue: (fieldName, value, { isDirty, isTouched } = {}) => {\n const userValues = {\n ...get().userValues,\n [fieldName]: {\n value,\n isDirty:\n isDirty === undefined\n ? get().userValues[fieldName]?.isDirty\n : isDirty,\n isTouched:\n isTouched === undefined\n ? get().userValues[fieldName]?.isTouched\n : isTouched,\n },\n }\n\n const touchedFields = getUpdatedTouchedFields(userValues)\n\n set(() => ({\n userValues,\n touchedFields,\n }))\n },\n getFieldValues: <T extends FormFieldNames[]>(...names: T) =>\n names.map((name) => get().userValues[name]?.value) as FormFieldArray<T>,\n addFieldValidation: (name, validationFn) => {\n set((state) => ({\n validation: {\n ...state.validation,\n [name]: validationFn,\n },\n }))\n },\n triggerFieldValidation: async (name) => {\n try {\n let valid = true\n set(() => ({ isValid: false, isValidating: true }))\n\n const validationFn = get().validation[name]\n\n if (validationFn) {\n const result = await validationFn(get().userValues?.[name]?.value)\n if (isString(result)) {\n valid = false\n set((state) => ({\n errors: {\n ...state.errors,\n [name]: result,\n },\n }))\n } else {\n valid = result as boolean\n if (valid) {\n get().clearErrors(name)\n }\n }\n }\n\n set(() => ({ isValid: valid, isValidating: false }))\n return valid\n } catch (err) {\n set(() => ({ isValidating: false }))\n throw err\n }\n },\n clearErrors: (name) => {\n const newErrors = { ...get().errors }\n\n delete newErrors[name]\n\n set(() => ({\n errors: newErrors,\n }))\n },\n }\n })\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"getDefaultValuesFromQueryString.js","names":[],"sources":["../../../../src/stores/form/getDefaultValuesFromQueryString.ts"],"sourcesContent":["import { formatInputAmount } from '../../utils/format.js'\nimport type { DefaultValues } from './types.js'\n\ninterface GetDefaultValuesFromQueryStringOptions {\n includeToAddress?: boolean\n buildUrl?: boolean\n}\n\nexport const getDefaultValuesFromQueryString = ({\n buildUrl = false,\n includeToAddress = true,\n}: GetDefaultValuesFromQueryStringOptions): Partial<DefaultValues> => {\n if (typeof window === 'undefined') {\n return {}\n }\n\n if (!buildUrl) {\n return {}\n }\n\n const searchParams = Object.fromEntries(\n new URLSearchParams(window.location.search)\n )\n\n // Prevent using fromToken/toToken params if chain is not selected.\n ;(['from', 'to'] as const).forEach((key) => {\n if (searchParams[`${key}Token`] && !searchParams[`${key}Chain`]) {\n delete searchParams[`${key}Token`]\n }\n })\n\n return {\n ...(Number.isFinite(Number.parseInt(searchParams.fromChain, 10))\n ? { fromChain: Number.parseInt(searchParams.fromChain, 10) }\n : {}),\n ...(Number.isFinite(Number.parseInt(searchParams.toChain, 10))\n ? { toChain: Number.parseInt(searchParams.toChain, 10) }\n : {}),\n ...(searchParams.fromToken ? { fromToken: searchParams.fromToken } : {}),\n ...(searchParams.toToken ? { toToken: searchParams.toToken } : {}),\n ...(Number.isFinite(Number.parseFloat(searchParams.fromAmount))\n ? { fromAmount: formatInputAmount(searchParams.fromAmount) }\n : {}),\n ...(includeToAddress && searchParams.toAddress\n ? { toAddress: searchParams.toAddress }\n : {}),\n }\n}\n"],"mappings":";;AAQA,MAAa,mCAAmC,EAC9C,WAAW,OACX,mBAAmB,WACiD;CACpE,IAAI,OAAO,WAAW,aACpB,OAAO,CAAC;CAGV,IAAI,CAAC,UACH,OAAO,CAAC;CAGV,MAAM,eAAe,OAAO,YAC1B,IAAI,gBAAgB,OAAO,SAAS,MAAM,CAC5C;CAGC,CAAE,QAAQ,IAAI,
|
|
1
|
+
{"version":3,"file":"getDefaultValuesFromQueryString.js","names":[],"sources":["../../../../src/stores/form/getDefaultValuesFromQueryString.ts"],"sourcesContent":["import { formatInputAmount } from '../../utils/format.js'\nimport type { DefaultValues } from './types.js'\n\ninterface GetDefaultValuesFromQueryStringOptions {\n includeToAddress?: boolean\n buildUrl?: boolean\n}\n\nexport const getDefaultValuesFromQueryString = ({\n buildUrl = false,\n includeToAddress = true,\n}: GetDefaultValuesFromQueryStringOptions): Partial<DefaultValues> => {\n if (typeof window === 'undefined') {\n return {}\n }\n\n if (!buildUrl) {\n return {}\n }\n\n const searchParams = Object.fromEntries(\n new URLSearchParams(window.location.search)\n )\n\n // Prevent using fromToken/toToken params if chain is not selected.\n ;(['from', 'to'] as const).forEach((key) => {\n if (searchParams[`${key}Token`] && !searchParams[`${key}Chain`]) {\n delete searchParams[`${key}Token`]\n }\n })\n\n return {\n ...(Number.isFinite(Number.parseInt(searchParams.fromChain, 10))\n ? { fromChain: Number.parseInt(searchParams.fromChain, 10) }\n : {}),\n ...(Number.isFinite(Number.parseInt(searchParams.toChain, 10))\n ? { toChain: Number.parseInt(searchParams.toChain, 10) }\n : {}),\n ...(searchParams.fromToken ? { fromToken: searchParams.fromToken } : {}),\n ...(searchParams.toToken ? { toToken: searchParams.toToken } : {}),\n ...(Number.isFinite(Number.parseFloat(searchParams.fromAmount))\n ? { fromAmount: formatInputAmount(searchParams.fromAmount) }\n : {}),\n ...(includeToAddress && searchParams.toAddress\n ? { toAddress: searchParams.toAddress }\n : {}),\n }\n}\n"],"mappings":";;AAQA,MAAa,mCAAmC,EAC9C,WAAW,OACX,mBAAmB,WACiD;CACpE,IAAI,OAAO,WAAW,aACpB,OAAO,CAAC;CAGV,IAAI,CAAC,UACH,OAAO,CAAC;CAGV,MAAM,eAAe,OAAO,YAC1B,IAAI,gBAAgB,OAAO,SAAS,MAAM,CAC5C;CAGC,CAAE,QAAQ,IAAI,CAAC,CAAW,SAAS,QAAQ;EAC1C,IAAI,aAAa,GAAG,IAAI,WAAW,CAAC,aAAa,GAAG,IAAI,SACtD,OAAO,aAAa,GAAG,IAAI;CAE/B,CAAC;CAED,OAAO;EACL,GAAI,OAAO,SAAS,OAAO,SAAS,aAAa,WAAW,EAAE,CAAC,IAC3D,EAAE,WAAW,OAAO,SAAS,aAAa,WAAW,EAAE,EAAE,IACzD,CAAC;EACL,GAAI,OAAO,SAAS,OAAO,SAAS,aAAa,SAAS,EAAE,CAAC,IACzD,EAAE,SAAS,OAAO,SAAS,aAAa,SAAS,EAAE,EAAE,IACrD,CAAC;EACL,GAAI,aAAa,YAAY,EAAE,WAAW,aAAa,UAAU,IAAI,CAAC;EACtE,GAAI,aAAa,UAAU,EAAE,SAAS,aAAa,QAAQ,IAAI,CAAC;EAChE,GAAI,OAAO,SAAS,OAAO,WAAW,aAAa,UAAU,CAAC,IAC1D,EAAE,YAAY,kBAAkB,aAAa,UAAU,EAAE,IACzD,CAAC;EACL,GAAI,oBAAoB,aAAa,YACjC,EAAE,WAAW,aAAa,UAAU,IACpC,CAAC;CACP;AACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useFieldActions.js","names":[],"sources":["../../../../src/stores/form/useFieldActions.ts"],"sourcesContent":["import { useCallback } from 'react'\nimport { useWidgetEvents } from '../../hooks/useWidgetEvents.js'\nimport type { FormFieldChanged } from '../../types/events.js'\nimport { WidgetEvent } from '../../types/events.js'\nimport type {\n DefaultValues,\n FormActions,\n FormFieldNames,\n GenericFormValue,\n SetOptions,\n} from './types.js'\nimport { useFormStore } from './useFormStore.js'\n\nexport const useFieldActions = (): FormActions => {\n const emitter = useWidgetEvents()\n const actions = useFormStore<FormActions>((store) => ({\n getFieldValues: store.getFieldValues,\n isTouched: store.isTouched,\n isDirty: store.isDirty,\n resetField: store.resetField,\n setAsTouched: store.setAsTouched,\n setDefaultValues: store.setDefaultValues,\n setFieldValue: store.setFieldValue,\n setUserAndDefaultValues: store.setUserAndDefaultValues,\n }))\n\n const setFieldValueWithEmittedEvents = useCallback(\n (\n fieldName: FormFieldNames,\n newValue: GenericFormValue,\n options?: SetOptions\n ) => {\n const oldValue = actions.getFieldValues(fieldName)[0]\n\n actions.setFieldValue(fieldName, newValue, options)\n\n if (newValue !== oldValue) {\n emitter.emit(WidgetEvent.FormFieldChanged, {\n fieldName,\n newValue,\n oldValue,\n } as FormFieldChanged)\n }\n },\n [actions, emitter]\n )\n\n const setUserAndDefaultValuesWithEmittedEvents = useCallback(\n (formValues: Partial<DefaultValues>) => {\n const formValuesKeys = Object.keys(formValues) as FormFieldNames[]\n\n const changedValues = formValuesKeys.reduce(\n (accum, fieldName) => {\n const oldValue = actions.getFieldValues(fieldName)[0]\n const newValue = formValues[fieldName]\n\n if (newValue !== oldValue) {\n accum.push({ fieldName, newValue, oldValue })\n }\n\n return accum\n },\n [] as {\n fieldName: FormFieldNames\n newValue: GenericFormValue\n oldValue: GenericFormValue\n }[]\n )\n\n actions.setUserAndDefaultValues(formValues)\n\n changedValues.forEach(({ fieldName, newValue, oldValue }) => {\n emitter.emit(WidgetEvent.FormFieldChanged, {\n fieldName,\n newValue,\n oldValue,\n } as FormFieldChanged)\n })\n },\n [actions, emitter]\n )\n\n return {\n getFieldValues: actions.getFieldValues,\n isTouched: actions.isTouched,\n isDirty: actions.isDirty,\n resetField: actions.resetField,\n setAsTouched: actions.setAsTouched,\n setDefaultValues: actions.setDefaultValues,\n setFieldValue: setFieldValueWithEmittedEvents,\n setUserAndDefaultValues: setUserAndDefaultValuesWithEmittedEvents,\n }\n}\n"],"mappings":";;;;;AAaA,MAAa,wBAAqC;CAChD,MAAM,UAAU,gBAAgB;CAChC,MAAM,UAAU,cAA2B,WAAW;EACpD,gBAAgB,MAAM;EACtB,WAAW,MAAM;EACjB,SAAS,MAAM;EACf,YAAY,MAAM;EAClB,cAAc,MAAM;EACpB,kBAAkB,MAAM;EACxB,eAAe,MAAM;EACrB,yBAAyB,MAAM;CACjC,EAAE;CAEF,MAAM,iCAAiC,aAEnC,WACA,UACA,YACG;EACH,MAAM,WAAW,QAAQ,eAAe,SAAS,
|
|
1
|
+
{"version":3,"file":"useFieldActions.js","names":[],"sources":["../../../../src/stores/form/useFieldActions.ts"],"sourcesContent":["import { useCallback } from 'react'\nimport { useWidgetEvents } from '../../hooks/useWidgetEvents.js'\nimport type { FormFieldChanged } from '../../types/events.js'\nimport { WidgetEvent } from '../../types/events.js'\nimport type {\n DefaultValues,\n FormActions,\n FormFieldNames,\n GenericFormValue,\n SetOptions,\n} from './types.js'\nimport { useFormStore } from './useFormStore.js'\n\nexport const useFieldActions = (): FormActions => {\n const emitter = useWidgetEvents()\n const actions = useFormStore<FormActions>((store) => ({\n getFieldValues: store.getFieldValues,\n isTouched: store.isTouched,\n isDirty: store.isDirty,\n resetField: store.resetField,\n setAsTouched: store.setAsTouched,\n setDefaultValues: store.setDefaultValues,\n setFieldValue: store.setFieldValue,\n setUserAndDefaultValues: store.setUserAndDefaultValues,\n }))\n\n const setFieldValueWithEmittedEvents = useCallback(\n (\n fieldName: FormFieldNames,\n newValue: GenericFormValue,\n options?: SetOptions\n ) => {\n const oldValue = actions.getFieldValues(fieldName)[0]\n\n actions.setFieldValue(fieldName, newValue, options)\n\n if (newValue !== oldValue) {\n emitter.emit(WidgetEvent.FormFieldChanged, {\n fieldName,\n newValue,\n oldValue,\n } as FormFieldChanged)\n }\n },\n [actions, emitter]\n )\n\n const setUserAndDefaultValuesWithEmittedEvents = useCallback(\n (formValues: Partial<DefaultValues>) => {\n const formValuesKeys = Object.keys(formValues) as FormFieldNames[]\n\n const changedValues = formValuesKeys.reduce(\n (accum, fieldName) => {\n const oldValue = actions.getFieldValues(fieldName)[0]\n const newValue = formValues[fieldName]\n\n if (newValue !== oldValue) {\n accum.push({ fieldName, newValue, oldValue })\n }\n\n return accum\n },\n [] as {\n fieldName: FormFieldNames\n newValue: GenericFormValue\n oldValue: GenericFormValue\n }[]\n )\n\n actions.setUserAndDefaultValues(formValues)\n\n changedValues.forEach(({ fieldName, newValue, oldValue }) => {\n emitter.emit(WidgetEvent.FormFieldChanged, {\n fieldName,\n newValue,\n oldValue,\n } as FormFieldChanged)\n })\n },\n [actions, emitter]\n )\n\n return {\n getFieldValues: actions.getFieldValues,\n isTouched: actions.isTouched,\n isDirty: actions.isDirty,\n resetField: actions.resetField,\n setAsTouched: actions.setAsTouched,\n setDefaultValues: actions.setDefaultValues,\n setFieldValue: setFieldValueWithEmittedEvents,\n setUserAndDefaultValues: setUserAndDefaultValuesWithEmittedEvents,\n }\n}\n"],"mappings":";;;;;AAaA,MAAa,wBAAqC;CAChD,MAAM,UAAU,gBAAgB;CAChC,MAAM,UAAU,cAA2B,WAAW;EACpD,gBAAgB,MAAM;EACtB,WAAW,MAAM;EACjB,SAAS,MAAM;EACf,YAAY,MAAM;EAClB,cAAc,MAAM;EACpB,kBAAkB,MAAM;EACxB,eAAe,MAAM;EACrB,yBAAyB,MAAM;CACjC,EAAE;CAEF,MAAM,iCAAiC,aAEnC,WACA,UACA,YACG;EACH,MAAM,WAAW,QAAQ,eAAe,SAAS,CAAC,CAAC;EAEnD,QAAQ,cAAc,WAAW,UAAU,OAAO;EAElD,IAAI,aAAa,UACf,QAAQ,KAAA,oBAAmC;GACzC;GACA;GACA;EACF,CAAqB;CAEzB,GACA,CAAC,SAAS,OAAO,CACnB;CAEA,MAAM,2CAA2C,aAC9C,eAAuC;EAGtC,MAAM,gBAFiB,OAAO,KAAK,UAEA,CAAC,CAAC,QAClC,OAAO,cAAc;GACpB,MAAM,WAAW,QAAQ,eAAe,SAAS,CAAC,CAAC;GACnD,MAAM,WAAW,WAAW;GAE5B,IAAI,aAAa,UACf,MAAM,KAAK;IAAE;IAAW;IAAU;GAAS,CAAC;GAG9C,OAAO;EACT,GACA,CAAC,CAKH;EAEA,QAAQ,wBAAwB,UAAU;EAE1C,cAAc,SAAS,EAAE,WAAW,UAAU,eAAe;GAC3D,QAAQ,KAAA,oBAAmC;IACzC;IACA;IACA;GACF,CAAqB;EACvB,CAAC;CACH,GACA,CAAC,SAAS,OAAO,CACnB;CAEA,OAAO;EACL,gBAAgB,QAAQ;EACxB,WAAW,QAAQ;EACnB,SAAS,QAAQ;EACjB,YAAY,QAAQ;EACpB,cAAc,QAAQ;EACtB,kBAAkB,QAAQ;EAC1B,eAAe;EACf,yBAAyB;CAC3B;AACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useFieldValues.js","names":[],"sources":["../../../../src/stores/form/useFieldValues.ts"],"sourcesContent":["import type { FormFieldArray, FormFieldNames } from './types.js'\nimport { useFormStore } from './useFormStore.js'\n\n// We should return a strongly-typed array based on the specific field names we pass to the function.\nexport const useFieldValues = <T extends FormFieldNames[]>(\n ...names: T\n): FormFieldArray<T> => {\n const values = useFormStore(\n (store) =>\n names.map((name) => store.userValues[name]?.value) as FormFieldArray<T>\n )\n\n return values\n}\n"],"mappings":";;AAIA,MAAa,kBACX,GAAG,UACmB;CAMtB,OALe,cACZ,UACC,MAAM,KAAK,SAAS,MAAM,WAAW,
|
|
1
|
+
{"version":3,"file":"useFieldValues.js","names":[],"sources":["../../../../src/stores/form/useFieldValues.ts"],"sourcesContent":["import type { FormFieldArray, FormFieldNames } from './types.js'\nimport { useFormStore } from './useFormStore.js'\n\n// We should return a strongly-typed array based on the specific field names we pass to the function.\nexport const useFieldValues = <T extends FormFieldNames[]>(\n ...names: T\n): FormFieldArray<T> => {\n const values = useFormStore(\n (store) =>\n names.map((name) => store.userValues[name]?.value) as FormFieldArray<T>\n )\n\n return values\n}\n"],"mappings":";;AAIA,MAAa,kBACX,GAAG,UACmB;CAMtB,OALe,cACZ,UACC,MAAM,KAAK,SAAS,MAAM,WAAW,KAAK,EAAE,KAAK,CAGzC;AACd"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useFormRef.js","names":[],"sources":["../../../../src/stores/form/useFormRef.ts"],"sourcesContent":["import { useImperativeHandle } from 'react'\nimport { widgetEvents } from '../../hooks/useWidgetEvents.js'\nimport { useBookmarkActions } from '../../stores/bookmarks/useBookmarkActions.js'\nimport { formDefaultValues } from '../../stores/form/createFormStore.js'\nimport type { FormFieldChanged } from '../../types/events.js'\nimport { WidgetEvent } from '../../types/events.js'\nimport type { FormRef } from '../../types/widget.js'\nimport type {\n FormFieldNames,\n FormStoreStore,\n GenericFormValue,\n} from './types.js'\n\nexport const useFormRef = (\n formStore: FormStoreStore,\n formRef?: FormRef\n): void => {\n const { setSelectedBookmark } = useBookmarkActions()\n\n useImperativeHandle(formRef, () => {\n const sanitizeValue: {\n [key: string]: (value: any) => GenericFormValue\n } = {\n fromAmount: (value) =>\n (typeof value === 'number' ? value?.toPrecision() : value) ||\n formDefaultValues.fromAmount,\n toAmount: (value) =>\n (typeof value === 'number' ? value?.toPrecision() : value) ||\n formDefaultValues.toAmount,\n toAddress: (value) => {\n const isToAddressObj = typeof value !== 'string'\n\n const address =\n (isToAddressObj ? value?.address : value) ||\n formDefaultValues.toAddress\n\n // we can assume that the toAddress has been passed as ToAddress object\n // and display it accordingly - this ensures that if a name is included\n // that it is displayed in the Send To Wallet form field correctly\n if (isToAddressObj) {\n setSelectedBookmark(value)\n }\n\n return address\n },\n }\n\n return {\n setFieldValue: (fieldName, value, options) => {\n const sanitizedValue = (\n sanitizeValue[fieldName] ? sanitizeValue[fieldName](value) : value\n ) as GenericFormValue\n\n const fieldValueOptions = options?.setUrlSearchParam\n ? { isTouched: options?.setUrlSearchParam }\n : undefined\n\n const oldValue = formStore\n .getState()\n .getFieldValues(fieldName as FormFieldNames)[0]\n\n formStore\n .getState()\n .setFieldValue(fieldName, sanitizedValue, fieldValueOptions)\n\n if (sanitizedValue !== oldValue) {\n widgetEvents.emit(WidgetEvent.FormFieldChanged, {\n fieldName,\n newValue: sanitizedValue,\n oldValue,\n } as FormFieldChanged)\n }\n },\n }\n }, [formStore, setSelectedBookmark])\n}\n"],"mappings":";;;;;;AAaA,MAAa,cACX,WACA,YACS;CACT,MAAM,EAAE,wBAAwB,mBAAmB;CAEnD,oBAAoB,eAAe;EACjC,MAAM,gBAEF;GACF,aAAa,WACV,OAAO,UAAU,WAAW,OAAO,YAAY,IAAI,UACpD,kBAAkB;GACpB,WAAW,WACR,OAAO,UAAU,WAAW,OAAO,YAAY,IAAI,UACpD,kBAAkB;GACpB,YAAY,UAAU;IACpB,MAAM,iBAAiB,OAAO,UAAU;IAExC,MAAM,WACH,iBAAiB,OAAO,UAAU,UACnC,kBAAkB;IAKpB,IAAI,gBACF,oBAAoB,KAAK;IAG3B,OAAO;GACT;EACF;EAEA,OAAO,EACL,gBAAgB,WAAW,OAAO,YAAY;GAC5C,MAAM,iBACJ,cAAc,aAAa,cAAc,
|
|
1
|
+
{"version":3,"file":"useFormRef.js","names":[],"sources":["../../../../src/stores/form/useFormRef.ts"],"sourcesContent":["import { useImperativeHandle } from 'react'\nimport { widgetEvents } from '../../hooks/useWidgetEvents.js'\nimport { useBookmarkActions } from '../../stores/bookmarks/useBookmarkActions.js'\nimport { formDefaultValues } from '../../stores/form/createFormStore.js'\nimport type { FormFieldChanged } from '../../types/events.js'\nimport { WidgetEvent } from '../../types/events.js'\nimport type { FormRef } from '../../types/widget.js'\nimport type {\n FormFieldNames,\n FormStoreStore,\n GenericFormValue,\n} from './types.js'\n\nexport const useFormRef = (\n formStore: FormStoreStore,\n formRef?: FormRef\n): void => {\n const { setSelectedBookmark } = useBookmarkActions()\n\n useImperativeHandle(formRef, () => {\n const sanitizeValue: {\n [key: string]: (value: any) => GenericFormValue\n } = {\n fromAmount: (value) =>\n (typeof value === 'number' ? value?.toPrecision() : value) ||\n formDefaultValues.fromAmount,\n toAmount: (value) =>\n (typeof value === 'number' ? value?.toPrecision() : value) ||\n formDefaultValues.toAmount,\n toAddress: (value) => {\n const isToAddressObj = typeof value !== 'string'\n\n const address =\n (isToAddressObj ? value?.address : value) ||\n formDefaultValues.toAddress\n\n // we can assume that the toAddress has been passed as ToAddress object\n // and display it accordingly - this ensures that if a name is included\n // that it is displayed in the Send To Wallet form field correctly\n if (isToAddressObj) {\n setSelectedBookmark(value)\n }\n\n return address\n },\n }\n\n return {\n setFieldValue: (fieldName, value, options) => {\n const sanitizedValue = (\n sanitizeValue[fieldName] ? sanitizeValue[fieldName](value) : value\n ) as GenericFormValue\n\n const fieldValueOptions = options?.setUrlSearchParam\n ? { isTouched: options?.setUrlSearchParam }\n : undefined\n\n const oldValue = formStore\n .getState()\n .getFieldValues(fieldName as FormFieldNames)[0]\n\n formStore\n .getState()\n .setFieldValue(fieldName, sanitizedValue, fieldValueOptions)\n\n if (sanitizedValue !== oldValue) {\n widgetEvents.emit(WidgetEvent.FormFieldChanged, {\n fieldName,\n newValue: sanitizedValue,\n oldValue,\n } as FormFieldChanged)\n }\n },\n }\n }, [formStore, setSelectedBookmark])\n}\n"],"mappings":";;;;;;AAaA,MAAa,cACX,WACA,YACS;CACT,MAAM,EAAE,wBAAwB,mBAAmB;CAEnD,oBAAoB,eAAe;EACjC,MAAM,gBAEF;GACF,aAAa,WACV,OAAO,UAAU,WAAW,OAAO,YAAY,IAAI,UACpD,kBAAkB;GACpB,WAAW,WACR,OAAO,UAAU,WAAW,OAAO,YAAY,IAAI,UACpD,kBAAkB;GACpB,YAAY,UAAU;IACpB,MAAM,iBAAiB,OAAO,UAAU;IAExC,MAAM,WACH,iBAAiB,OAAO,UAAU,UACnC,kBAAkB;IAKpB,IAAI,gBACF,oBAAoB,KAAK;IAG3B,OAAO;GACT;EACF;EAEA,OAAO,EACL,gBAAgB,WAAW,OAAO,YAAY;GAC5C,MAAM,iBACJ,cAAc,aAAa,cAAc,UAAU,CAAC,KAAK,IAAI;GAG/D,MAAM,oBAAoB,SAAS,oBAC/B,EAAE,WAAW,SAAS,kBAAkB,IACxC,KAAA;GAEJ,MAAM,WAAW,UACd,SAAS,CAAC,CACV,eAAe,SAA2B,CAAC,CAAC;GAE/C,UACG,SAAS,CAAC,CACV,cAAc,WAAW,gBAAgB,iBAAiB;GAE7D,IAAI,mBAAmB,UACrB,aAAa,KAAA,oBAAmC;IAC9C;IACA,UAAU;IACV;GACF,CAAqB;EAEzB,EACF;CACF,GAAG,CAAC,WAAW,mBAAmB,CAAC;AACrC"}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { FormStoreContext } from "./FormStoreContext.js";
|
|
2
|
-
import {
|
|
2
|
+
import { use } from "react";
|
|
3
3
|
import { useShallow } from "zustand/shallow";
|
|
4
4
|
//#region src/stores/form/useFormStore.ts
|
|
5
5
|
function useFormStore(selector) {
|
|
6
|
-
const useStore =
|
|
6
|
+
const useStore = use(FormStoreContext);
|
|
7
7
|
if (!useStore) throw new Error("You forgot to wrap your component in <FormStoreProvider>.");
|
|
8
8
|
return useStore(useShallow(selector));
|
|
9
9
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useFormStore.js","names":[],"sources":["../../../../src/stores/form/useFormStore.ts"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"useFormStore.js","names":[],"sources":["../../../../src/stores/form/useFormStore.ts"],"sourcesContent":["import { use } from 'react'\nimport { useShallow } from 'zustand/shallow'\nimport { FormStoreContext } from './FormStoreContext.js'\nimport type { FormValuesState } from './types.js'\n\nexport function useFormStore<T>(selector: (state: FormValuesState) => T): T {\n const useStore = use(FormStoreContext)\n\n if (!useStore) {\n throw new Error('You forgot to wrap your component in <FormStoreProvider>.')\n }\n\n return useStore(useShallow(selector))\n}\n"],"mappings":";;;;AAKA,SAAgB,aAAgB,UAA4C;CAC1E,MAAM,WAAW,IAAI,gBAAgB;CAErC,IAAI,CAAC,UACH,MAAM,IAAI,MAAM,2DAA2D;CAG7E,OAAO,SAAS,WAAW,QAAQ,CAAC;AACtC"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { createContext,
|
|
1
|
+
import { createContext, use, useRef } from "react";
|
|
2
2
|
import { create } from "zustand";
|
|
3
3
|
import { useShallow } from "zustand/shallow";
|
|
4
4
|
import { jsx } from "react/jsx-runtime";
|
|
@@ -7,13 +7,13 @@ const HeaderStoreContext = createContext(null);
|
|
|
7
7
|
function HeaderStoreProvider({ children }) {
|
|
8
8
|
const storeRef = useRef(null);
|
|
9
9
|
if (!storeRef.current) storeRef.current = createHeaderStore();
|
|
10
|
-
return /* @__PURE__ */ jsx(HeaderStoreContext
|
|
10
|
+
return /* @__PURE__ */ jsx(HeaderStoreContext, {
|
|
11
11
|
value: storeRef.current,
|
|
12
12
|
children
|
|
13
13
|
});
|
|
14
14
|
}
|
|
15
15
|
function useHeaderStoreContext() {
|
|
16
|
-
const useStore =
|
|
16
|
+
const useStore = use(HeaderStoreContext);
|
|
17
17
|
if (!useStore) throw new Error(`You forgot to wrap your component in <${HeaderStoreProvider.name}>.`);
|
|
18
18
|
return useStore;
|
|
19
19
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useHeaderStore.js","names":[],"sources":["../../../../src/stores/header/useHeaderStore.tsx"],"sourcesContent":["import { createContext,
|
|
1
|
+
{"version":3,"file":"useHeaderStore.js","names":[],"sources":["../../../../src/stores/header/useHeaderStore.tsx"],"sourcesContent":["import { createContext, use, useRef } from 'react'\nimport { create } from 'zustand'\nimport { useShallow } from 'zustand/shallow'\nimport type { PersistStoreProviderProps } from '../types.js'\nimport type { HeaderState, HeaderStore } from './types.js'\n\nconst HeaderStoreContext = createContext<HeaderStore | null>(null)\n\nexport function HeaderStoreProvider({\n children,\n}: PersistStoreProviderProps): any {\n const storeRef = useRef<HeaderStore>(null)\n if (!storeRef.current) {\n storeRef.current = createHeaderStore()\n }\n return (\n <HeaderStoreContext value={storeRef.current}>{children}</HeaderStoreContext>\n )\n}\n\nfunction useHeaderStoreContext() {\n const useStore = use(HeaderStoreContext)\n if (!useStore) {\n throw new Error(\n `You forgot to wrap your component in <${HeaderStoreProvider.name}>.`\n )\n }\n return useStore\n}\n\nexport function useHeaderStore<T>(selector: (state: HeaderState) => T): T {\n const useStore = useHeaderStoreContext()\n return useStore(useShallow(selector))\n}\n\n// We use fixed position on the header when Widget is in Full Height layout.\n// We do this to get it to work like the sticky header does in the other layout modes.\n// As the header is position fixed its not in the document flow anymore.\n// To prevent the remaining page content from appearing behind the header we need to\n// pass the headers height so that the position of the page content can be adjusted\nexport function useHeaderHeight(): any {\n const headerHeight = useHeaderStore((state) => state.headerHeight)\n\n return {\n headerHeight,\n }\n}\n\nexport function useSetHeaderHeight(): any {\n const setHeaderHeight = useHeaderStore((state) => state.setHeaderHeight)\n\n return {\n setHeaderHeight,\n }\n}\n\nconst createHeaderStore = () =>\n create<HeaderState>((set, get) => ({\n headerHeight: 108, // default header height\n setAction: (element) => {\n set(() => ({\n element,\n }))\n return get().removeAction\n },\n setTitle: (title) => {\n set(() => ({\n title,\n }))\n return get().removeTitle\n },\n removeAction: () => {\n set(() => ({\n element: null,\n }))\n },\n removeTitle: () => {\n set(() => ({\n title: undefined,\n }))\n },\n setHeaderHeight: (headerHeight) => {\n set(() => ({\n headerHeight,\n }))\n },\n setBackAction: (action) => {\n set(() => ({\n backAction: action,\n }))\n },\n executeBackAction: () => {\n const { backAction } = get()\n if (backAction) {\n backAction()\n set(() => ({\n backAction: undefined,\n }))\n }\n },\n }))\n"],"mappings":";;;;;AAMA,MAAM,qBAAqB,cAAkC,IAAI;AAEjE,SAAgB,oBAAoB,EAClC,YACiC;CACjC,MAAM,WAAW,OAAoB,IAAI;CACzC,IAAI,CAAC,SAAS,SACZ,SAAS,UAAU,kBAAkB;CAEvC,OACE,oBAAC,oBAAD;EAAoB,OAAO,SAAS;EAAU;CAA6B,CAAA;AAE/E;AAEA,SAAS,wBAAwB;CAC/B,MAAM,WAAW,IAAI,kBAAkB;CACvC,IAAI,CAAC,UACH,MAAM,IAAI,MACR,yCAAyC,oBAAoB,KAAK,GACpE;CAEF,OAAO;AACT;AAEA,SAAgB,eAAkB,UAAwC;CAExE,OADiB,sBACH,CAAC,CAAC,WAAW,QAAQ,CAAC;AACtC;AAOA,SAAgB,kBAAuB;CAGrC,OAAO,EACL,cAHmB,gBAAgB,UAAU,MAAM,YAGxC,EACb;AACF;AAEA,SAAgB,qBAA0B;CAGxC,OAAO,EACL,iBAHsB,gBAAgB,UAAU,MAAM,eAGxC,EAChB;AACF;AAEA,MAAM,0BACJ,QAAqB,KAAK,SAAS;CACjC,cAAc;CACd,YAAY,YAAY;EACtB,WAAW,EACT,QACF,EAAE;EACF,OAAO,IAAI,CAAC,CAAC;CACf;CACA,WAAW,UAAU;EACnB,WAAW,EACT,MACF,EAAE;EACF,OAAO,IAAI,CAAC,CAAC;CACf;CACA,oBAAoB;EAClB,WAAW,EACT,SAAS,KACX,EAAE;CACJ;CACA,mBAAmB;EACjB,WAAW,EACT,OAAO,KAAA,EACT,EAAE;CACJ;CACA,kBAAkB,iBAAiB;EACjC,WAAW,EACT,aACF,EAAE;CACJ;CACA,gBAAgB,WAAW;EACzB,WAAW,EACT,YAAY,OACd,EAAE;CACJ;CACA,yBAAyB;EACvB,MAAM,EAAE,eAAe,IAAI;EAC3B,IAAI,YAAY;GACd,WAAW;GACX,WAAW,EACT,YAAY,KAAA,EACd,EAAE;EACJ;CACF;AACF,EAAE"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useInputModeStore.js","names":[],"sources":["../../../../src/stores/inputMode/useInputModeStore.ts"],"sourcesContent":["import type { StoreApi, UseBoundStore } from 'zustand'\nimport { create } from 'zustand'\nimport type { FormTypeProps } from '../form/types.js'\n\ntype InputMode = 'amount' | 'price'\n\ninterface InputModeState {\n inputMode: Record<'from' | 'to', InputMode>\n setInputMode: (formType: FormTypeProps['formType'], mode: InputMode) => void\n toggleInputMode: (formType: FormTypeProps['formType']) => void\n}\n\nexport const useInputModeStore: UseBoundStore<StoreApi<InputModeState>> =\n create<InputModeState>((set, get) => ({\n inputMode: {\n from: 'amount',\n to: 'amount',\n },\n setInputMode: (formType, mode) =>\n set((state) => ({\n inputMode: {\n ...state.inputMode,\n [formType]: mode,\n },\n })),\n toggleInputMode: (formType) => {\n const currentMode = get().inputMode[formType]\n const newMode = currentMode === 'amount' ? 'price' : 'amount'\n get().setInputMode(formType, newMode)\n },\n }))\n"],"mappings":";;AAYA,MAAa,oBACX,QAAwB,KAAK,SAAS;CACpC,WAAW;EACT,MAAM;EACN,IAAI;CACN;CACA,eAAe,UAAU,SACvB,KAAK,WAAW,EACd,WAAW;EACT,GAAG,MAAM;GACR,WAAW;CACd,EACF,EAAE;CACJ,kBAAkB,aAAa;EAE7B,MAAM,UADc,IAAI,
|
|
1
|
+
{"version":3,"file":"useInputModeStore.js","names":[],"sources":["../../../../src/stores/inputMode/useInputModeStore.ts"],"sourcesContent":["import type { StoreApi, UseBoundStore } from 'zustand'\nimport { create } from 'zustand'\nimport type { FormTypeProps } from '../form/types.js'\n\ntype InputMode = 'amount' | 'price'\n\ninterface InputModeState {\n inputMode: Record<'from' | 'to', InputMode>\n setInputMode: (formType: FormTypeProps['formType'], mode: InputMode) => void\n toggleInputMode: (formType: FormTypeProps['formType']) => void\n}\n\nexport const useInputModeStore: UseBoundStore<StoreApi<InputModeState>> =\n create<InputModeState>((set, get) => ({\n inputMode: {\n from: 'amount',\n to: 'amount',\n },\n setInputMode: (formType, mode) =>\n set((state) => ({\n inputMode: {\n ...state.inputMode,\n [formType]: mode,\n },\n })),\n toggleInputMode: (formType) => {\n const currentMode = get().inputMode[formType]\n const newMode = currentMode === 'amount' ? 'price' : 'amount'\n get().setInputMode(formType, newMode)\n },\n }))\n"],"mappings":";;AAYA,MAAa,oBACX,QAAwB,KAAK,SAAS;CACpC,WAAW;EACT,MAAM;EACN,IAAI;CACN;CACA,eAAe,UAAU,SACvB,KAAK,WAAW,EACd,WAAW;EACT,GAAG,MAAM;GACR,WAAW;CACd,EACF,EAAE;CACJ,kBAAkB,aAAa;EAE7B,MAAM,UADc,IAAI,CAAC,CAAC,UAAU,cACJ,WAAW,UAAU;EACrD,IAAI,CAAC,CAAC,aAAa,UAAU,OAAO;CACtC;AACF,EAAE"}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { useTranslation } from "react-i18next";
|
|
2
|
+
//#region src/stores/navigationTabs/useNavigationTabLabel.ts
|
|
3
|
+
const useNavigationTabLabel = () => {
|
|
4
|
+
const { t } = useTranslation();
|
|
5
|
+
return (key) => {
|
|
6
|
+
switch (key) {
|
|
7
|
+
case "default": return t("header.swapAndBridge");
|
|
8
|
+
case "private": return t("header.private");
|
|
9
|
+
case "refuel": return t("header.gas");
|
|
10
|
+
case "swap":
|
|
11
|
+
case "swap-advanced": return t("header.swap");
|
|
12
|
+
case "bridge":
|
|
13
|
+
case "bridge-advanced": return t("header.bridge");
|
|
14
|
+
case "limit": return t("header.limit");
|
|
15
|
+
default: return t("header.swapAndBridge");
|
|
16
|
+
}
|
|
17
|
+
};
|
|
18
|
+
};
|
|
19
|
+
//#endregion
|
|
20
|
+
export { useNavigationTabLabel };
|
|
21
|
+
|
|
22
|
+
//# sourceMappingURL=useNavigationTabLabel.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useNavigationTabLabel.js","names":[],"sources":["../../../../src/stores/navigationTabs/useNavigationTabLabel.ts"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport type { NavigationTabKey } from '../../types/widget.js'\n\nexport const useNavigationTabLabel = (): ((\n key: NavigationTabKey\n) => string) => {\n const { t } = useTranslation()\n return (key: NavigationTabKey) => {\n switch (key) {\n case 'default':\n return t('header.swapAndBridge')\n case 'private':\n return t('header.private')\n case 'refuel':\n return t('header.gas')\n case 'swap':\n case 'swap-advanced':\n return t('header.swap')\n case 'bridge':\n case 'bridge-advanced':\n return t('header.bridge')\n case 'limit':\n return t('header.limit')\n default:\n return t('header.swapAndBridge')\n }\n }\n}\n"],"mappings":";;AAGA,MAAa,8BAEG;CACd,MAAM,EAAE,MAAM,eAAe;CAC7B,QAAQ,QAA0B;EAChC,QAAQ,KAAR;GACE,KAAK,WACH,OAAO,EAAE,sBAAsB;GACjC,KAAK,WACH,OAAO,EAAE,gBAAgB;GAC3B,KAAK,UACH,OAAO,EAAE,YAAY;GACvB,KAAK;GACL,KAAK,iBACH,OAAO,EAAE,aAAa;GACxB,KAAK;GACL,KAAK,mBACH,OAAO,EAAE,eAAe;GAC1B,KAAK,SACH,OAAO,EAAE,cAAc;GACzB,SACE,OAAO,EAAE,sBAAsB;EACnC;CACF;AACF"}
|
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
import { WidgetContext, useWidgetConfig } from "../../providers/WidgetProvider/WidgetProvider.js";
|
|
2
|
+
import { getInitialActiveTab, getNavigationTabKeys, getTabMode, getTabModeOptions, getTabSplitMode, getTabVariant } from "./utils.js";
|
|
3
|
+
import { createContext, use, useMemo, useRef } from "react";
|
|
4
|
+
import { create } from "zustand";
|
|
5
|
+
import { useShallow } from "zustand/shallow";
|
|
6
|
+
import { jsx } from "react/jsx-runtime";
|
|
7
|
+
//#region src/stores/navigationTabs/useNavigationTabsStore.tsx
|
|
8
|
+
const NavigationTabsStoreContext = createContext(null);
|
|
9
|
+
function NavigationTabsStoreProvider({ children, config }) {
|
|
10
|
+
const tabs = getNavigationTabKeys(config);
|
|
11
|
+
const initialActiveTab = getInitialActiveTab(config);
|
|
12
|
+
const signature = `${tabs.join(",")}|${initialActiveTab ?? ""}`;
|
|
13
|
+
const storeRef = useRef(null);
|
|
14
|
+
const signatureRef = useRef(signature);
|
|
15
|
+
let store = storeRef.current;
|
|
16
|
+
if (!store || signatureRef.current !== signature) {
|
|
17
|
+
store = createNavigationTabsStore(tabs, initialActiveTab);
|
|
18
|
+
storeRef.current = store;
|
|
19
|
+
signatureRef.current = signature;
|
|
20
|
+
}
|
|
21
|
+
const widgetConfig = useWidgetConfig();
|
|
22
|
+
const activeTab = store((state) => state.activeTab);
|
|
23
|
+
const tabConfig = useMemo(() => {
|
|
24
|
+
if (!activeTab) return widgetConfig;
|
|
25
|
+
return {
|
|
26
|
+
...widgetConfig,
|
|
27
|
+
mode: getTabMode(widgetConfig, activeTab),
|
|
28
|
+
variant: getTabVariant(widgetConfig, activeTab),
|
|
29
|
+
modeOptions: getTabModeOptions(widgetConfig, activeTab)
|
|
30
|
+
};
|
|
31
|
+
}, [widgetConfig, activeTab]);
|
|
32
|
+
return /* @__PURE__ */ jsx(NavigationTabsStoreContext, {
|
|
33
|
+
value: store,
|
|
34
|
+
children: /* @__PURE__ */ jsx(WidgetContext, {
|
|
35
|
+
value: tabConfig,
|
|
36
|
+
children
|
|
37
|
+
})
|
|
38
|
+
});
|
|
39
|
+
}
|
|
40
|
+
function useNavigationTabsStoreContext() {
|
|
41
|
+
const useStore = use(NavigationTabsStoreContext);
|
|
42
|
+
if (!useStore) throw new Error(`You forgot to wrap your component in <${NavigationTabsStoreProvider.name}>.`);
|
|
43
|
+
return useStore;
|
|
44
|
+
}
|
|
45
|
+
function useNavigationTabsStore(selector) {
|
|
46
|
+
return useNavigationTabsStoreContext()(useShallow(selector));
|
|
47
|
+
}
|
|
48
|
+
/** Effective split mode derived from the active tab. */
|
|
49
|
+
function useSplitMode() {
|
|
50
|
+
return useNavigationTabsStore((state) => getTabSplitMode(state.activeTab));
|
|
51
|
+
}
|
|
52
|
+
const createNavigationTabsStore = (tabs, initialActiveTab) => create((set) => ({
|
|
53
|
+
tabs,
|
|
54
|
+
activeTab: initialActiveTab,
|
|
55
|
+
setActiveTab(activeTab) {
|
|
56
|
+
set({ activeTab });
|
|
57
|
+
}
|
|
58
|
+
}));
|
|
59
|
+
//#endregion
|
|
60
|
+
export { NavigationTabsStoreProvider, useNavigationTabsStore, useSplitMode };
|
|
61
|
+
|
|
62
|
+
//# sourceMappingURL=useNavigationTabsStore.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useNavigationTabsStore.js","names":[],"sources":["../../../../src/stores/navigationTabs/useNavigationTabsStore.tsx"],"sourcesContent":["import {\n createContext,\n type JSX,\n type PropsWithChildren,\n use,\n useMemo,\n useRef,\n} from 'react'\nimport { create } from 'zustand'\nimport { useShallow } from 'zustand/shallow'\nimport {\n useWidgetConfig,\n WidgetContext,\n} from '../../providers/WidgetProvider/WidgetProvider.js'\nimport type {\n NavigationTabKey,\n SplitMode,\n WidgetConfig,\n} from '../../types/widget.js'\nimport type { NavigationTabsState, NavigationTabsStore } from './types.js'\nimport {\n getInitialActiveTab,\n getNavigationTabKeys,\n getTabMode,\n getTabModeOptions,\n getTabSplitMode,\n getTabVariant,\n} from './utils.js'\n\nconst NavigationTabsStoreContext = createContext<NavigationTabsStore | null>(\n null\n)\n\nexport function NavigationTabsStoreProvider({\n children,\n config,\n}: PropsWithChildren<{ config: WidgetConfig }>): JSX.Element {\n const tabs = getNavigationTabKeys(config)\n const initialActiveTab = getInitialActiveTab(config)\n // Recreate (re-seeding tabs + active tab) only when the config-driven inputs\n // change — not on runtime tab clicks, which must be preserved.\n const signature = `${tabs.join(',')}|${initialActiveTab ?? ''}`\n const storeRef = useRef<NavigationTabsStore>(null)\n const signatureRef = useRef(signature)\n let store = storeRef.current\n if (!store || signatureRef.current !== signature) {\n store = createNavigationTabsStore(tabs, initialActiveTab)\n storeRef.current = store\n signatureRef.current = signature\n }\n\n // Override the widget config with the active tab's mode, variant and\n // modeOptions (each falling back to the config), so the rest of the widget\n // reads tab-driven config transparently. No-op when there is no active tab.\n const widgetConfig = useWidgetConfig()\n const activeTab = store((state) => state.activeTab)\n const tabConfig = useMemo(() => {\n if (!activeTab) {\n return widgetConfig\n }\n return {\n ...widgetConfig,\n mode: getTabMode(widgetConfig, activeTab),\n variant: getTabVariant(widgetConfig, activeTab),\n modeOptions: getTabModeOptions(widgetConfig, activeTab),\n }\n }, [widgetConfig, activeTab])\n\n return (\n <NavigationTabsStoreContext value={store}>\n <WidgetContext value={tabConfig}>{children}</WidgetContext>\n </NavigationTabsStoreContext>\n )\n}\n\nfunction useNavigationTabsStoreContext(): NavigationTabsStore {\n const useStore = use(NavigationTabsStoreContext)\n if (!useStore) {\n throw new Error(\n `You forgot to wrap your component in <${NavigationTabsStoreProvider.name}>.`\n )\n }\n return useStore\n}\n\nexport function useNavigationTabsStore<T>(\n selector: (state: NavigationTabsState) => T\n): T {\n const useStore = useNavigationTabsStoreContext()\n return useStore(useShallow(selector))\n}\n\n/** Effective split mode derived from the active tab. */\nexport function useSplitMode(): SplitMode | undefined {\n return useNavigationTabsStore((state) => getTabSplitMode(state.activeTab))\n}\n\nconst createNavigationTabsStore = (\n tabs: NavigationTabKey[],\n initialActiveTab?: NavigationTabKey\n): NavigationTabsStore =>\n create<NavigationTabsState>((set) => ({\n tabs,\n activeTab: initialActiveTab,\n setActiveTab(activeTab) {\n set({ activeTab })\n },\n }))\n"],"mappings":";;;;;;;AA6BA,MAAM,6BAA6B,cACjC,IACF;AAEA,SAAgB,4BAA4B,EAC1C,UACA,UAC2D;CAC3D,MAAM,OAAO,qBAAqB,MAAM;CACxC,MAAM,mBAAmB,oBAAoB,MAAM;CAGnD,MAAM,YAAY,GAAG,KAAK,KAAK,GAAG,EAAE,GAAG,oBAAoB;CAC3D,MAAM,WAAW,OAA4B,IAAI;CACjD,MAAM,eAAe,OAAO,SAAS;CACrC,IAAI,QAAQ,SAAS;CACrB,IAAI,CAAC,SAAS,aAAa,YAAY,WAAW;EAChD,QAAQ,0BAA0B,MAAM,gBAAgB;EACxD,SAAS,UAAU;EACnB,aAAa,UAAU;CACzB;CAKA,MAAM,eAAe,gBAAgB;CACrC,MAAM,YAAY,OAAO,UAAU,MAAM,SAAS;CAClD,MAAM,YAAY,cAAc;EAC9B,IAAI,CAAC,WACH,OAAO;EAET,OAAO;GACL,GAAG;GACH,MAAM,WAAW,cAAc,SAAS;GACxC,SAAS,cAAc,cAAc,SAAS;GAC9C,aAAa,kBAAkB,cAAc,SAAS;EACxD;CACF,GAAG,CAAC,cAAc,SAAS,CAAC;CAE5B,OACE,oBAAC,4BAAD;EAA4B,OAAO;YACjC,oBAAC,eAAD;GAAe,OAAO;GAAY;EAAwB,CAAA;CAChC,CAAA;AAEhC;AAEA,SAAS,gCAAqD;CAC5D,MAAM,WAAW,IAAI,0BAA0B;CAC/C,IAAI,CAAC,UACH,MAAM,IAAI,MACR,yCAAyC,4BAA4B,KAAK,GAC5E;CAEF,OAAO;AACT;AAEA,SAAgB,uBACd,UACG;CAEH,OADiB,8BACH,CAAC,CAAC,WAAW,QAAQ,CAAC;AACtC;;AAGA,SAAgB,eAAsC;CACpD,OAAO,wBAAwB,UAAU,gBAAgB,MAAM,SAAS,CAAC;AAC3E;AAEA,MAAM,6BACJ,MACA,qBAEA,QAA6B,SAAS;CACpC;CACA,WAAW;CACX,aAAa,WAAW;EACtB,IAAI,EAAE,UAAU,CAAC;CACnB;AACF,EAAE"}
|
|
@@ -0,0 +1,92 @@
|
|
|
1
|
+
import { getSplitMode } from "../../utils/mode.js";
|
|
2
|
+
//#region src/stores/navigationTabs/utils.ts
|
|
3
|
+
/** Configured navigation tabs by key. Labels are resolved from the key by a hook. */
|
|
4
|
+
const navigationTabsByKey = {
|
|
5
|
+
default: {
|
|
6
|
+
key: "default",
|
|
7
|
+
variant: "wide",
|
|
8
|
+
mode: "default"
|
|
9
|
+
},
|
|
10
|
+
private: {
|
|
11
|
+
key: "private",
|
|
12
|
+
variant: "compact",
|
|
13
|
+
mode: "split",
|
|
14
|
+
modeOptions: { split: "swap" }
|
|
15
|
+
},
|
|
16
|
+
refuel: {
|
|
17
|
+
key: "refuel",
|
|
18
|
+
variant: "wide",
|
|
19
|
+
mode: "refuel"
|
|
20
|
+
},
|
|
21
|
+
limit: {
|
|
22
|
+
key: "limit",
|
|
23
|
+
variant: "compact",
|
|
24
|
+
mode: "limit"
|
|
25
|
+
},
|
|
26
|
+
"swap-advanced": {
|
|
27
|
+
key: "swap-advanced",
|
|
28
|
+
variant: "wide",
|
|
29
|
+
mode: "split",
|
|
30
|
+
modeOptions: { split: "swap" }
|
|
31
|
+
},
|
|
32
|
+
"bridge-advanced": {
|
|
33
|
+
key: "bridge-advanced",
|
|
34
|
+
variant: "wide",
|
|
35
|
+
mode: "split",
|
|
36
|
+
modeOptions: { split: "bridge" }
|
|
37
|
+
}
|
|
38
|
+
};
|
|
39
|
+
/** Split-mode tabs (Swap / Bridge), shown when no navigation tabs are configured. */
|
|
40
|
+
const splitTabs = [{
|
|
41
|
+
key: "swap",
|
|
42
|
+
mode: "split",
|
|
43
|
+
modeOptions: { split: "swap" }
|
|
44
|
+
}, {
|
|
45
|
+
key: "bridge",
|
|
46
|
+
mode: "split",
|
|
47
|
+
modeOptions: { split: "bridge" }
|
|
48
|
+
}];
|
|
49
|
+
const splitTabsByKey = Object.fromEntries(splitTabs.map((tab) => [tab.key, tab]));
|
|
50
|
+
/** Combined lookup across configured and split tabs. */
|
|
51
|
+
const tabByKey = {
|
|
52
|
+
...navigationTabsByKey,
|
|
53
|
+
...splitTabsByKey
|
|
54
|
+
};
|
|
55
|
+
/** Tab keys shown in split mode when no navigation tabs are configured. */
|
|
56
|
+
const splitTabKeys = splitTabs.map((tab) => tab.key);
|
|
57
|
+
/** Resolves which navigation tabs the header should render from the config. */
|
|
58
|
+
const getNavigationTabKeys = (config) => {
|
|
59
|
+
if (config._navigationTabs?.length) return config._navigationTabs;
|
|
60
|
+
if (config.mode === "split" && typeof config.modeOptions?.split !== "string") return splitTabKeys;
|
|
61
|
+
return [];
|
|
62
|
+
};
|
|
63
|
+
/**
|
|
64
|
+
* The tab the store seeds as active from the config. With navigation tabs it's
|
|
65
|
+
* the first configured tab; otherwise split mode's selection is itself a tab
|
|
66
|
+
* (`swap`/`bridge`), so it seeds the active tab too.
|
|
67
|
+
*/
|
|
68
|
+
const getInitialActiveTab = (config) => {
|
|
69
|
+
if (config._navigationTabs?.length) return config._navigationTabs[0];
|
|
70
|
+
return config.mode === "split" ? getSplitMode(config.modeOptions?.split) : void 0;
|
|
71
|
+
};
|
|
72
|
+
/** Split mode (`swap`/`bridge`) implied by a tab, or `undefined` if not split. */
|
|
73
|
+
const getTabSplitMode = (key) => {
|
|
74
|
+
const tab = key ? tabByKey[key] : void 0;
|
|
75
|
+
return tab?.mode === "split" ? getSplitMode(tab.modeOptions?.split) : void 0;
|
|
76
|
+
};
|
|
77
|
+
/** Variant for a tab, falling back to the widget config's variant when unset. */
|
|
78
|
+
const getTabVariant = (config, key) => {
|
|
79
|
+
return (key ? tabByKey[key] : void 0)?.variant ?? config.variant;
|
|
80
|
+
};
|
|
81
|
+
/** Mode for a tab, falling back to the widget config's mode when unset. */
|
|
82
|
+
const getTabMode = (config, key) => {
|
|
83
|
+
return (key ? tabByKey[key] : void 0)?.mode ?? config.mode;
|
|
84
|
+
};
|
|
85
|
+
/** Mode options for a tab, falling back to the widget config's when unset. */
|
|
86
|
+
const getTabModeOptions = (config, key) => {
|
|
87
|
+
return (key ? tabByKey[key] : void 0)?.modeOptions ?? config.modeOptions;
|
|
88
|
+
};
|
|
89
|
+
//#endregion
|
|
90
|
+
export { getInitialActiveTab, getNavigationTabKeys, getTabMode, getTabModeOptions, getTabSplitMode, getTabVariant };
|
|
91
|
+
|
|
92
|
+
//# sourceMappingURL=utils.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"utils.js","names":[],"sources":["../../../../src/stores/navigationTabs/utils.ts"],"sourcesContent":["import type {\n InternalNavigationTabKey,\n ModeOptions,\n NavigationTabKey,\n SplitMode,\n SplitNavigationTabKey,\n WidgetConfig,\n WidgetMode,\n WidgetVariant,\n} from '../../types/widget.js'\nimport { getSplitMode } from '../../utils/mode.js'\nimport type { NavigationTab } from './types.js'\n\n/** Configured navigation tabs by key. Labels are resolved from the key by a hook. */\nconst navigationTabsByKey: Record<InternalNavigationTabKey, NavigationTab> = {\n default: { key: 'default', variant: 'wide', mode: 'default' },\n private: {\n key: 'private',\n variant: 'compact',\n mode: 'split',\n modeOptions: { split: 'swap' },\n },\n refuel: { key: 'refuel', variant: 'wide', mode: 'refuel' },\n limit: { key: 'limit', variant: 'compact', mode: 'limit' },\n 'swap-advanced': {\n key: 'swap-advanced',\n variant: 'wide',\n mode: 'split',\n modeOptions: { split: 'swap' },\n },\n 'bridge-advanced': {\n key: 'bridge-advanced',\n variant: 'wide',\n mode: 'split',\n modeOptions: { split: 'bridge' },\n },\n}\n\n/** Split-mode tabs (Swap / Bridge), shown when no navigation tabs are configured. */\nconst splitTabs: NavigationTab[] = [\n {\n key: 'swap',\n mode: 'split',\n modeOptions: { split: 'swap' },\n },\n {\n key: 'bridge',\n mode: 'split',\n modeOptions: { split: 'bridge' },\n },\n]\n\nconst splitTabsByKey = Object.fromEntries(\n splitTabs.map((tab) => [tab.key, tab])\n) as Record<SplitNavigationTabKey, NavigationTab>\n\n/** Combined lookup across configured and split tabs. */\nconst tabByKey: Record<NavigationTabKey, NavigationTab> = {\n ...navigationTabsByKey,\n ...splitTabsByKey,\n}\n\n/** Tab keys shown in split mode when no navigation tabs are configured. */\nexport const splitTabKeys: NavigationTabKey[] = splitTabs.map((tab) => tab.key)\n\n/** Resolves which navigation tabs the header should render from the config. */\nexport const getNavigationTabKeys = (\n config: WidgetConfig\n): NavigationTabKey[] => {\n if (config._navigationTabs?.length) {\n return config._navigationTabs\n }\n // Split mode shows Swap / Bridge tabs unless pinned to a single side.\n if (\n config.mode === 'split' &&\n typeof config.modeOptions?.split !== 'string'\n ) {\n return splitTabKeys\n }\n return []\n}\n\n/**\n * The tab the store seeds as active from the config. With navigation tabs it's\n * the first configured tab; otherwise split mode's selection is itself a tab\n * (`swap`/`bridge`), so it seeds the active tab too.\n */\nexport const getInitialActiveTab = (\n config: WidgetConfig\n): NavigationTabKey | undefined => {\n if (config._navigationTabs?.length) {\n return config._navigationTabs[0]\n }\n return config.mode === 'split'\n ? getSplitMode(config.modeOptions?.split)\n : undefined\n}\n\n/** Split mode (`swap`/`bridge`) implied by a tab, or `undefined` if not split. */\nexport const getTabSplitMode = (\n key?: NavigationTabKey\n): SplitMode | undefined => {\n const tab = key ? tabByKey[key] : undefined\n return tab?.mode === 'split'\n ? getSplitMode(tab.modeOptions?.split)\n : undefined\n}\n\n/** Variant for a tab, falling back to the widget config's variant when unset. */\nexport const getTabVariant = (\n config: WidgetConfig,\n key?: NavigationTabKey\n): WidgetVariant | undefined => {\n const tab = key ? tabByKey[key] : undefined\n return tab?.variant ?? config.variant\n}\n\n/** Mode for a tab, falling back to the widget config's mode when unset. */\nexport const getTabMode = (\n config: WidgetConfig,\n key?: NavigationTabKey\n): WidgetMode | undefined => {\n const tab = key ? tabByKey[key] : undefined\n return tab?.mode ?? config.mode\n}\n\n/** Mode options for a tab, falling back to the widget config's when unset. */\nexport const getTabModeOptions = (\n config: WidgetConfig,\n key?: NavigationTabKey\n): ModeOptions | undefined => {\n const tab = key ? tabByKey[key] : undefined\n return tab?.modeOptions ?? config.modeOptions\n}\n"],"mappings":";;;AAcA,MAAM,sBAAuE;CAC3E,SAAS;EAAE,KAAK;EAAW,SAAS;EAAQ,MAAM;CAAU;CAC5D,SAAS;EACP,KAAK;EACL,SAAS;EACT,MAAM;EACN,aAAa,EAAE,OAAO,OAAO;CAC/B;CACA,QAAQ;EAAE,KAAK;EAAU,SAAS;EAAQ,MAAM;CAAS;CACzD,OAAO;EAAE,KAAK;EAAS,SAAS;EAAW,MAAM;CAAQ;CACzD,iBAAiB;EACf,KAAK;EACL,SAAS;EACT,MAAM;EACN,aAAa,EAAE,OAAO,OAAO;CAC/B;CACA,mBAAmB;EACjB,KAAK;EACL,SAAS;EACT,MAAM;EACN,aAAa,EAAE,OAAO,SAAS;CACjC;AACF;;AAGA,MAAM,YAA6B,CACjC;CACE,KAAK;CACL,MAAM;CACN,aAAa,EAAE,OAAO,OAAO;AAC/B,GACA;CACE,KAAK;CACL,MAAM;CACN,aAAa,EAAE,OAAO,SAAS;AACjC,CACF;AAEA,MAAM,iBAAiB,OAAO,YAC5B,UAAU,KAAK,QAAQ,CAAC,IAAI,KAAK,GAAG,CAAC,CACvC;;AAGA,MAAM,WAAoD;CACxD,GAAG;CACH,GAAG;AACL;;AAGA,MAAa,eAAmC,UAAU,KAAK,QAAQ,IAAI,GAAG;;AAG9E,MAAa,wBACX,WACuB;CACvB,IAAI,OAAO,iBAAiB,QAC1B,OAAO,OAAO;CAGhB,IACE,OAAO,SAAS,WAChB,OAAO,OAAO,aAAa,UAAU,UAErC,OAAO;CAET,OAAO,CAAC;AACV;;;;;;AAOA,MAAa,uBACX,WACiC;CACjC,IAAI,OAAO,iBAAiB,QAC1B,OAAO,OAAO,gBAAgB;CAEhC,OAAO,OAAO,SAAS,UACnB,aAAa,OAAO,aAAa,KAAK,IACtC,KAAA;AACN;;AAGA,MAAa,mBACX,QAC0B;CAC1B,MAAM,MAAM,MAAM,SAAS,OAAO,KAAA;CAClC,OAAO,KAAK,SAAS,UACjB,aAAa,IAAI,aAAa,KAAK,IACnC,KAAA;AACN;;AAGA,MAAa,iBACX,QACA,QAC8B;CAE9B,QADY,MAAM,SAAS,OAAO,KAAA,EAAA,EACtB,WAAW,OAAO;AAChC;;AAGA,MAAa,cACX,QACA,QAC2B;CAE3B,QADY,MAAM,SAAS,OAAO,KAAA,EAAA,EACtB,QAAQ,OAAO;AAC7B;;AAGA,MAAa,qBACX,QACA,QAC4B;CAE5B,QADY,MAAM,SAAS,OAAO,KAAA,EAAA,EACtB,eAAe,OAAO;AACpC"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { createPinnedTokensStore } from "./createPinnedTokensStore.js";
|
|
2
|
-
import { createContext,
|
|
2
|
+
import { createContext, use, useRef } from "react";
|
|
3
3
|
import { useShallow } from "zustand/shallow";
|
|
4
4
|
import { jsx } from "react/jsx-runtime";
|
|
5
5
|
//#region src/stores/pinnedTokens/PinnedTokensStore.tsx
|
|
@@ -7,13 +7,13 @@ const PinnedTokensStoreContext = createContext(null);
|
|
|
7
7
|
const PinnedTokensStoreProvider = ({ children, ...props }) => {
|
|
8
8
|
const storeRef = useRef(null);
|
|
9
9
|
if (!storeRef.current) storeRef.current = createPinnedTokensStore(props);
|
|
10
|
-
return /* @__PURE__ */ jsx(PinnedTokensStoreContext
|
|
10
|
+
return /* @__PURE__ */ jsx(PinnedTokensStoreContext, {
|
|
11
11
|
value: storeRef.current,
|
|
12
12
|
children
|
|
13
13
|
});
|
|
14
14
|
};
|
|
15
15
|
function usePinnedTokensStore(selector) {
|
|
16
|
-
const useStore =
|
|
16
|
+
const useStore = use(PinnedTokensStoreContext);
|
|
17
17
|
if (!useStore) throw new Error(`You forgot to wrap your component in <${PinnedTokensStoreProvider.name}>.`);
|
|
18
18
|
return useStore(useShallow(selector));
|
|
19
19
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PinnedTokensStore.js","names":[],"sources":["../../../../src/stores/pinnedTokens/PinnedTokensStore.tsx"],"sourcesContent":["import { createContext,
|
|
1
|
+
{"version":3,"file":"PinnedTokensStore.js","names":[],"sources":["../../../../src/stores/pinnedTokens/PinnedTokensStore.tsx"],"sourcesContent":["import { createContext, use, useRef } from 'react'\nimport { useShallow } from 'zustand/shallow'\nimport type { PersistStoreProviderProps } from '../types.js'\nimport { createPinnedTokensStore } from './createPinnedTokensStore.js'\nimport type { PinnedTokensState, PinnedTokensStore } from './types.js'\n\nconst PinnedTokensStoreContext = createContext<PinnedTokensStore | null>(null)\n\nexport const PinnedTokensStoreProvider: React.FC<PersistStoreProviderProps> = ({\n children,\n ...props\n}) => {\n const storeRef = useRef<PinnedTokensStore>(null)\n\n if (!storeRef.current) {\n storeRef.current = createPinnedTokensStore(props)\n }\n\n return (\n <PinnedTokensStoreContext value={storeRef.current}>\n {children}\n </PinnedTokensStoreContext>\n )\n}\n\nexport function usePinnedTokensStore<T>(\n selector: (store: PinnedTokensState) => T\n): T {\n const useStore = use(PinnedTokensStoreContext)\n\n if (!useStore) {\n throw new Error(\n `You forgot to wrap your component in <${PinnedTokensStoreProvider.name}>.`\n )\n }\n\n return useStore(useShallow(selector))\n}\n"],"mappings":";;;;;AAMA,MAAM,2BAA2B,cAAwC,IAAI;AAE7E,MAAa,6BAAkE,EAC7E,UACA,GAAG,YACC;CACJ,MAAM,WAAW,OAA0B,IAAI;CAE/C,IAAI,CAAC,SAAS,SACZ,SAAS,UAAU,wBAAwB,KAAK;CAGlD,OACE,oBAAC,0BAAD;EAA0B,OAAO,SAAS;EACvC;CACuB,CAAA;AAE9B;AAEA,SAAgB,qBACd,UACG;CACH,MAAM,WAAW,IAAI,wBAAwB;CAE7C,IAAI,CAAC,UACH,MAAM,IAAI,MACR,yCAAyC,0BAA0B,KAAK,GAC1E;CAGF,OAAO,SAAS,WAAW,QAAQ,CAAC;AACtC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"createPinnedTokensStore.js","names":[],"sources":["../../../../src/stores/pinnedTokens/createPinnedTokensStore.ts"],"sourcesContent":["import type { StoreApi, UseBoundStore } from 'zustand'\nimport { create } from 'zustand'\nimport { persist } from 'zustand/middleware'\nimport type { PersistStoreProps } from '../types.js'\nimport type { PinnedTokensState } from './types.js'\n\nexport const createPinnedTokensStore = ({\n namePrefix,\n}: PersistStoreProps): UseBoundStore<StoreApi<PinnedTokensState>> =>\n create<PinnedTokensState>()(\n persist(\n (set, get) => ({\n pinnedTokens: {},\n pinToken: (chainId: number, tokenAddress: string) => {\n set((state) => {\n const normalizedAddress = tokenAddress.toLowerCase()\n const chainTokens = state.pinnedTokens[chainId] || []\n if (!chainTokens.includes(normalizedAddress)) {\n return {\n pinnedTokens: {\n ...state.pinnedTokens,\n [chainId]: [...chainTokens, normalizedAddress],\n },\n }\n }\n return state\n })\n },\n unpinToken: (chainId: number, tokenAddress: string) => {\n set((state) => {\n const normalizedAddress = tokenAddress.toLowerCase()\n const chainTokens = state.pinnedTokens[chainId] || []\n if (chainTokens.includes(normalizedAddress)) {\n return {\n pinnedTokens: {\n ...state.pinnedTokens,\n [chainId]: chainTokens.filter(\n (addr) => addr !== normalizedAddress\n ),\n },\n }\n }\n return state\n })\n },\n isPinned: (chainId: number, tokenAddress: string) => {\n const normalizedAddress = tokenAddress.toLowerCase()\n const chainTokens = get().pinnedTokens[chainId] || []\n return chainTokens.includes(normalizedAddress)\n },\n getPinnedTokens: (chainId: number) => {\n return get().pinnedTokens[chainId] || []\n },\n getAllPinnedTokens: () => {\n const allPinned: Array<{ chainId: number; tokenAddress: string }> = []\n const pinnedTokens = get().pinnedTokens\n Object.entries(pinnedTokens).forEach(([chainIdStr, addresses]) => {\n const chainId = Number.parseInt(chainIdStr, 10)\n addresses.forEach((address) => {\n allPinned.push({ chainId, tokenAddress: address })\n })\n })\n return allPinned\n },\n }),\n {\n name: `${namePrefix || 'li.fi'}-pinned-tokens`,\n version: 0,\n partialize: (state) => ({\n pinnedTokens: state.pinnedTokens,\n }),\n }\n )\n )\n"],"mappings":";;;AAMA,MAAa,2BAA2B,EACtC,iBAEA,OAA0B,
|
|
1
|
+
{"version":3,"file":"createPinnedTokensStore.js","names":[],"sources":["../../../../src/stores/pinnedTokens/createPinnedTokensStore.ts"],"sourcesContent":["import type { StoreApi, UseBoundStore } from 'zustand'\nimport { create } from 'zustand'\nimport { persist } from 'zustand/middleware'\nimport type { PersistStoreProps } from '../types.js'\nimport type { PinnedTokensState } from './types.js'\n\nexport const createPinnedTokensStore = ({\n namePrefix,\n}: PersistStoreProps): UseBoundStore<StoreApi<PinnedTokensState>> =>\n create<PinnedTokensState>()(\n persist(\n (set, get) => ({\n pinnedTokens: {},\n pinToken: (chainId: number, tokenAddress: string) => {\n set((state) => {\n const normalizedAddress = tokenAddress.toLowerCase()\n const chainTokens = state.pinnedTokens[chainId] || []\n if (!chainTokens.includes(normalizedAddress)) {\n return {\n pinnedTokens: {\n ...state.pinnedTokens,\n [chainId]: [...chainTokens, normalizedAddress],\n },\n }\n }\n return state\n })\n },\n unpinToken: (chainId: number, tokenAddress: string) => {\n set((state) => {\n const normalizedAddress = tokenAddress.toLowerCase()\n const chainTokens = state.pinnedTokens[chainId] || []\n if (chainTokens.includes(normalizedAddress)) {\n return {\n pinnedTokens: {\n ...state.pinnedTokens,\n [chainId]: chainTokens.filter(\n (addr) => addr !== normalizedAddress\n ),\n },\n }\n }\n return state\n })\n },\n isPinned: (chainId: number, tokenAddress: string) => {\n const normalizedAddress = tokenAddress.toLowerCase()\n const chainTokens = get().pinnedTokens[chainId] || []\n return chainTokens.includes(normalizedAddress)\n },\n getPinnedTokens: (chainId: number) => {\n return get().pinnedTokens[chainId] || []\n },\n getAllPinnedTokens: () => {\n const allPinned: Array<{ chainId: number; tokenAddress: string }> = []\n const pinnedTokens = get().pinnedTokens\n Object.entries(pinnedTokens).forEach(([chainIdStr, addresses]) => {\n const chainId = Number.parseInt(chainIdStr, 10)\n addresses.forEach((address) => {\n allPinned.push({ chainId, tokenAddress: address })\n })\n })\n return allPinned\n },\n }),\n {\n name: `${namePrefix || 'li.fi'}-pinned-tokens`,\n version: 0,\n partialize: (state) => ({\n pinnedTokens: state.pinnedTokens,\n }),\n }\n )\n )\n"],"mappings":";;;AAMA,MAAa,2BAA2B,EACtC,iBAEA,OAA0B,CAAC,CACzB,SACG,KAAK,SAAS;CACb,cAAc,CAAC;CACf,WAAW,SAAiB,iBAAyB;EACnD,KAAK,UAAU;GACb,MAAM,oBAAoB,aAAa,YAAY;GACnD,MAAM,cAAc,MAAM,aAAa,YAAY,CAAC;GACpD,IAAI,CAAC,YAAY,SAAS,iBAAiB,GACzC,OAAO,EACL,cAAc;IACZ,GAAG,MAAM;KACR,UAAU,CAAC,GAAG,aAAa,iBAAiB;GAC/C,EACF;GAEF,OAAO;EACT,CAAC;CACH;CACA,aAAa,SAAiB,iBAAyB;EACrD,KAAK,UAAU;GACb,MAAM,oBAAoB,aAAa,YAAY;GACnD,MAAM,cAAc,MAAM,aAAa,YAAY,CAAC;GACpD,IAAI,YAAY,SAAS,iBAAiB,GACxC,OAAO,EACL,cAAc;IACZ,GAAG,MAAM;KACR,UAAU,YAAY,QACpB,SAAS,SAAS,iBACrB;GACF,EACF;GAEF,OAAO;EACT,CAAC;CACH;CACA,WAAW,SAAiB,iBAAyB;EACnD,MAAM,oBAAoB,aAAa,YAAY;EAEnD,QADoB,IAAI,CAAC,CAAC,aAAa,YAAY,CAAC,EAAA,CACjC,SAAS,iBAAiB;CAC/C;CACA,kBAAkB,YAAoB;EACpC,OAAO,IAAI,CAAC,CAAC,aAAa,YAAY,CAAC;CACzC;CACA,0BAA0B;EACxB,MAAM,YAA8D,CAAC;EACrE,MAAM,eAAe,IAAI,CAAC,CAAC;EAC3B,OAAO,QAAQ,YAAY,CAAC,CAAC,SAAS,CAAC,YAAY,eAAe;GAChE,MAAM,UAAU,OAAO,SAAS,YAAY,EAAE;GAC9C,UAAU,SAAS,YAAY;IAC7B,UAAU,KAAK;KAAE;KAAS,cAAc;IAAQ,CAAC;GACnD,CAAC;EACH,CAAC;EACD,OAAO;CACT;AACF,IACA;CACE,MAAM,GAAG,cAAc,QAAQ;CAC/B,SAAS;CACT,aAAa,WAAW,EACtB,cAAc,MAAM,aACtB;AACF,CACF,CACF"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { createRouteExecutionStore } from "./createRouteExecutionStore.js";
|
|
2
|
-
import { createContext,
|
|
2
|
+
import { createContext, use, useRef } from "react";
|
|
3
3
|
import { useShallow } from "zustand/shallow";
|
|
4
4
|
import { jsx } from "react/jsx-runtime";
|
|
5
5
|
//#region src/stores/routes/RouteExecutionStore.tsx
|
|
@@ -7,13 +7,13 @@ const RouteExecutionStoreContext = createContext(null);
|
|
|
7
7
|
function RouteExecutionStoreProvider({ children, ...props }) {
|
|
8
8
|
const storeRef = useRef(null);
|
|
9
9
|
if (!storeRef.current) storeRef.current = createRouteExecutionStore(props);
|
|
10
|
-
return /* @__PURE__ */ jsx(RouteExecutionStoreContext
|
|
10
|
+
return /* @__PURE__ */ jsx(RouteExecutionStoreContext, {
|
|
11
11
|
value: storeRef.current,
|
|
12
12
|
children
|
|
13
13
|
});
|
|
14
14
|
}
|
|
15
15
|
function useRouteExecutionStoreContext() {
|
|
16
|
-
const useStore =
|
|
16
|
+
const useStore = use(RouteExecutionStoreContext);
|
|
17
17
|
if (!useStore) throw new Error(`You forgot to wrap your component in <${RouteExecutionStoreProvider.name}>.`);
|
|
18
18
|
return useStore;
|
|
19
19
|
}
|