@lifi/widget 4.3.1 → 4.5.0

package/src/hooks/useTokenBalances.ts

@@ -1,14 +1,13 @@
 import { useMemo } from 'react'
 import { useWidgetConfig } from '../providers/WidgetProvider/WidgetProvider.js'
 import type { FormType } from '../stores/form/types.js'
-import { usePinnedTokensStore } from '../stores/pinnedTokens/PinnedTokensStore.js'
 import { useSettings } from '../stores/settings/useSettings.js'
 import type { TokenAmount } from '../types/token.js'
 import { formatTokenPrice } from '../utils/format.js'
-import { isSearchMatch, processTokenBalances } from '../utils/tokenList.js'
+import { isSearchMatch, processTokenList } from '../utils/tokenList.js'
 import { useAccountsBalancesData } from './useAccountsBalancesData.js'
+import { useDisplayedTokens } from './useDisplayedTokens.js'
 import { useTokenBalancesQueries } from './useTokenBalancesQueries.js'
-import { useTokens } from './useTokens.js'
 
 export const useTokenBalances = (
   selectedChainId?: number,
@@ -23,12 +22,14 @@ export const useTokenBalances = (
   isSearchLoading: boolean
   isBalanceLoading: boolean
 } => {
-  const { hiddenUI } = useWidgetConfig()
+  const { hiddenUI, tokens: configTokens } = useWidgetConfig()
   const {
     allTokens,
-    isLoading: isTokensLoading,
+    displayedTokensList,
+    isPinnedToken,
+    isTokensLoading,
     isSearchLoading,
-  } = useTokens(formType, search, isAllNetworks ? undefined : selectedChainId)
+  } = useDisplayedTokens(selectedChainId, formType, isAllNetworks, search)
 
   const { data: accountsWithAllTokens, isLoading: isAccountsLoading } =
     useAccountsBalancesData(selectedChainId, formType, isAllNetworks, allTokens)
@@ -39,58 +40,12 @@ export const useTokenBalances = (
   const { data: allTokensWithBalances, isLoading: isBalanceQueriesLoading } =
     useTokenBalancesQueries(accountsWithAllTokens, isBalanceLoadingEnabled)
 
-  const { tokens: configTokens } = useWidgetConfig()
   const { smallBalanceThreshold } = useSettings(['smallBalanceThreshold'])
 
-  const pinnedTokens = usePinnedTokensStore((state) => state.pinnedTokens)
-
   const isBalanceLoading =
     (isBalanceQueriesLoading || isAccountsLoading) &&
     !allTokensWithBalances?.length
 
-  // Create function to check if token is pinned
-  const isPinnedToken = useMemo(() => {
-    if (isAllNetworks) {
-      // For all networks, check all pinned tokens
-      const allPinned: Array<{ chainId: number; tokenAddress: string }> = []
-      Object.entries(pinnedTokens).forEach(([chainIdStr, addresses]) => {
-        const chainId = Number.parseInt(chainIdStr, 10)
-        addresses.forEach((address) => {
-          allPinned.push({ chainId, tokenAddress: address })
-        })
-      })
-      const pinnedSet = new Set(
-        allPinned.map((p) => `${p.chainId}-${p.tokenAddress.toLowerCase()}`)
-      )
-      return (chainId: number, tokenAddress: string) => {
-        const key = `${chainId}-${tokenAddress.toLowerCase()}`
-        return pinnedSet.has(key)
-      }
-    } else if (selectedChainId) {
-      // For single chain, check only selected chain
-      const chainPinnedTokens = pinnedTokens[selectedChainId] || []
-      const pinnedSet = new Set(
-        chainPinnedTokens.map((addr) => addr.toLowerCase())
-      )
-      return (chainId: number, tokenAddress: string) => {
-        return (
-          chainId === selectedChainId &&
-          pinnedSet.has(tokenAddress.toLowerCase())
-        )
-      }
-    }
-    return undefined
-  }, [isAllNetworks, selectedChainId, pinnedTokens])
-
-  const displayedTokensList = useMemo(() => {
-    const tokensByChain = isAllNetworks
-      ? Object.values(allTokens ?? {}).flat()
-      : selectedChainId
-        ? allTokens?.[selectedChainId]
-        : undefined
-    return tokensByChain?.filter((t) => isSearchMatch(t, search)) ?? []
-  }, [allTokens, isAllNetworks, selectedChainId, search])
-
   const displayedTokensWithBalances = useMemo(() => {
     const balancesByChain = isAllNetworks
       ? allTokensWithBalances
@@ -160,7 +115,7 @@ export const useTokenBalances = (
   ])
 
   const { processedTokens, withCategories, withPinnedTokens } = useMemo(() => {
-    return processTokenBalances(
+    return processTokenList(
       isBalanceLoading,
       isAllNetworks || !!search,
       configTokens,

package/src/hooks/useTokenBalancesQueries.ts

@@ -1,5 +1,5 @@
 import { getTokenBalances, type TokenExtended } from '@lifi/sdk'
-import { useQueries } from '@tanstack/react-query'
+import { keepPreviousData, useQueries } from '@tanstack/react-query'
 import { useMemo, useRef } from 'react'
 import { useSDKClient } from '../providers/SDKClientProvider.js'
 import { useWidgetConfig } from '../providers/WidgetProvider/WidgetProvider.js'
@@ -7,6 +7,10 @@ import type { TokenAmount, TokenAmountExtended } from '../types/token.js'
 import { getQueryKey } from '../utils/queries.js'
 
 const defaultRefetchInterval = 32_000
+// Max time to hold the skeleton before revealing balances in the multi-chain view.
+// Sits just below the typical full-settle time so the list reveals once, sorted,
+// instead of reordering as each chain streams in.
+const balanceRevealTimeout = 2_000
 
 export const useTokenBalancesQueries = (
   accountsWithTokens?: Record<string, Record<number, TokenExtended[]>>,
@@ -44,7 +48,10 @@ export const useTokenBalancesQueries = (
             enabled: isBalanceLoadingEnabled,
             refetchInterval: defaultRefetchInterval,
             staleTime: defaultRefetchInterval,
-            keepPreviousData: true,
+            placeholderData: keepPreviousData,
+            // Resolve a failed chain immediately instead of retrying past the reveal
+            // window (retries would pop the chain in late and re-sort the list).
+            retry: false,
           }
         })
     )
@@ -74,8 +81,9 @@ export const useTokenBalancesQueries = (
         ? now - firstLoadStartRef.current
         : 0
 
-      // Return results if all complete OR if 500ms have passed since first query started
-      const shouldReturnResults = allComplete || timeSinceStart >= 500
+      // Return results once all queries complete, or once the reveal timeout elapses
+      const shouldReturnResults =
+        allComplete || timeSinceStart >= balanceRevealTimeout
 
       if (shouldReturnResults) {
         const data: TokenAmount[] = results

package/src/hooks/useTokenList.ts

@@ -0,0 +1,59 @@
+import { useMemo } from 'react'
+import { useWidgetConfig } from '../providers/WidgetProvider/WidgetProvider.js'
+import type { FormType } from '../stores/form/types.js'
+import type { TokenAmount } from '../types/token.js'
+import { processTokenList } from '../utils/tokenList.js'
+import { useDisplayedTokens } from './useDisplayedTokens.js'
+
+/**
+ * Token-selection list without wallet balances - No accounts are resolved and no balance queries are fired.
+ */
+export const useTokenList = (
+  selectedChainId?: number,
+  formType?: FormType,
+  isAllNetworks?: boolean,
+  search?: string
+): {
+  tokens: TokenAmount[]
+  withCategories: boolean
+  withPinnedTokens: boolean
+  isTokensLoading: boolean
+  isSearchLoading: boolean
+} => {
+  const { tokens: configTokens } = useWidgetConfig()
+  const {
+    displayedTokensList,
+    isPinnedToken,
+    isTokensLoading,
+    isSearchLoading,
+  } = useDisplayedTokens(selectedChainId, formType, isAllNetworks, search)
+
+  const { processedTokens, withCategories, withPinnedTokens } = useMemo(
+    () =>
+      processTokenList(
+        /* withoutBalances */ true,
+        isAllNetworks || !!search,
+        configTokens,
+        selectedChainId,
+        displayedTokensList,
+        undefined,
+        isPinnedToken
+      ),
+    [
+      isAllNetworks,
+      search,
+      configTokens,
+      selectedChainId,
+      displayedTokensList,
+      isPinnedToken,
+    ]
+  )
+
+  return {
+    tokens: processedTokens ?? [],
+    withCategories,
+    withPinnedTokens,
+    isTokensLoading,
+    isSearchLoading,
+  }
+}

package/src/hooks/useTransactionDetails.ts

@@ -59,9 +59,7 @@ export const useTransactionDetails = (
         if (fromAddress) {
           queryClient.setQueryData<StatusResponse[]>(
             [transactionHistoryQueryKey, fromAddress],
-            (data) => {
-              return [...data!, transaction!]
-            }
+            (data) => (data ? [...data, transaction!] : [transaction!])
           )
         }
 

package/src/providers/WalletProvider/WalletProvider.tsx

@@ -10,6 +10,7 @@ import {
 import { useTranslation } from 'react-i18next'
 import { useAvailableChains } from '../../hooks/useAvailableChains.js'
 import { useInitializeSDKProviders } from '../../hooks/useInitializeSDKProviders.js'
+import { getConfigItemSets, isItemAllowedForSets } from '../../utils/item.js'
 import { useWidgetConfig } from '../WidgetProvider/WidgetProvider.js'
 import { useExternalWalletProvider } from './useExternalWalletProvider.js'
 
@@ -21,12 +22,23 @@ export const WalletProvider = ({
   children,
   providers,
 }: PropsWithChildren<WalletProviderProps>): JSX.Element => {
-  const { walletConfig } = useWidgetConfig()
+  const { walletConfig, chains: chainsConfig } = useWidgetConfig()
   const { chains } = useAvailableChains()
   const { i18n } = useTranslation()
   const { useExternalWalletProvidersOnly, internalChainTypes } =
     useExternalWalletProvider()
 
+  // Restrict offered wallets to the ecosystems allowed by chains.types config.
+  const enabledChainTypes = useMemo(() => {
+    const chainTypeSets = getConfigItemSets(
+      chainsConfig?.types,
+      (items) => new Set(items)
+    )
+    return internalChainTypes.filter((chainType) =>
+      isItemAllowedForSets(chainType, chainTypeSets)
+    )
+  }, [internalChainTypes, chainsConfig?.types])
+
   if (
     !providers.length &&
     !useExternalWalletProvidersOnly &&
@@ -40,12 +52,12 @@ export const WalletProvider = ({
   const walletManagementConfig = useMemo(
     () => ({
       locale: i18n.resolvedLanguage as never,
-      enabledChainTypes: internalChainTypes,
+      enabledChainTypes,
       walletEcosystemsOrder: walletConfig?.walletEcosystemsOrder,
     }),
     [
       i18n.resolvedLanguage,
-      internalChainTypes,
+      enabledChainTypes,
       walletConfig?.walletEcosystemsOrder,
     ]
   )

package/src/shared.ts

@@ -0,0 +1,191 @@
+// ─────────────────────────────────────────────────────────────────────────────
+// @lifi/widget/shared
+//
+// Internal surface shared with sibling packages (currently @lifi/widget-checkout).
+// These exports are NOT part of the public widget API. They may change in any
+// release without notice. Application code must not depend on this subpath.
+// ─────────────────────────────────────────────────────────────────────────────
+
+// Propagate widget's MUI theme augmentations (theme.vars, custom palette keys,
+// component variants) to any consumer that imports through this subpath.
+import type {} from '@mui/material/themeCssVarsAugmentation'
+import type {} from './themes/types.js'
+
+// ── components ───────────────────────────────────────────────────────────────
+export { ActionRow } from './components/ActionRow/ActionRow.js'
+export {
+  FormControl,
+  Input,
+} from './components/AmountInput/AmountInput.style.js'
+export { AmountInputEndAdornment } from './components/AmountInput/AmountInputEndAdornment.js'
+export { InputPriceButton } from './components/AmountInput/PriceFormHelperText.style.js'
+export { AvatarBadgedDefault } from './components/Avatar/Avatar.js'
+export { TokenAvatar } from './components/Avatar/TokenAvatar.js'
+export { BaseTransactionButton } from './components/BaseTransactionButton/BaseTransactionButton.js'
+export type { BottomSheetBase } from './components/BottomSheet/types.js'
+export { ButtonTertiary } from './components/ButtonTertiary.js'
+export { Card } from './components/Card/Card.js'
+export { CardIconButton } from './components/Card/CardIconButton.js'
+export { CardTitle } from './components/Card/CardTitle.js'
+export { InputCard } from './components/Card/InputCard.js'
+export { ChainSelect } from './components/ChainSelect/ChainSelect.js'
+export { ChainAvatar } from './components/ChainSelect/ChainSelect.style.js'
+export { ContractComponent } from './components/ContractComponent/ContractComponent.js'
+export { ExecutionStatusCard } from './components/ExecutionStatusCard/ExecutionStatusCard.js'
+export { StatusIcon } from './components/ExecutionStatusCard/StatusIcon.js'
+export { FeeBreakdownTooltip } from './components/FeeBreakdownTooltip.js'
+export { IconCircle } from './components/IconCircle/IconCircle.js'
+export { IconTypography } from './components/IconTypography.js'
+export { ListItemButton } from './components/ListItem/ListItemButton.js'
+export { WarningMessages } from './components/Messages/WarningMessages.js'
+export { PageContainer } from './components/PageContainer.js'
+export { PoweredBy } from './components/PoweredBy/PoweredBy.js'
+export { ProgressToNextUpdate } from './components/ProgressToNextUpdate.js'
+export { RouteCard } from './components/RouteCard/RouteCard.js'
+export { RouteCardSkeleton } from './components/RouteCard/RouteCardSkeleton.js'
+export { RouteDetails } from './components/RouteCard/RouteDetails.js'
+export {
+  DetailInfoIcon,
+  DetailLabel,
+  DetailLabelContainer,
+  DetailRow,
+  DetailValue,
+} from './components/RouteCard/RouteDetails.style.js'
+export { RouteNotFoundCard } from './components/RouteCard/RouteNotFoundCard.js'
+export { RouteTokens } from './components/RouteCard/RouteTokens.js'
+export { SearchInput } from './components/Search/SearchInput.js'
+export { SendToWalletButton } from './components/SendToWallet/SendToWalletButton.js'
+export {
+  type ExecutionRow,
+  useExecutionRows,
+} from './components/StepActions/executionRows.js'
+export { SentToWalletRow } from './components/StepActions/SentToWalletRow.js'
+export { ExternalLink } from './components/StepActions/StepActionRow.style.js'
+export { StepActionsList } from './components/StepActions/StepActionsList.js'
+export { Token } from './components/Token/Token.js'
+export { TokenNotFound } from './components/TokenList/TokenNotFound.js'
+export { useTokenSelect } from './components/TokenList/useTokenSelect.js'
+export { VirtualizedTokenList } from './components/TokenList/VirtualizedTokenList.js'
+export { TokenRate } from './components/TokenRate/TokenRate.js'
+export {
+  DateLabelContainer,
+  DateLabelText,
+} from './components/TransactionCard/TransactionCard.style.js'
+// ── hooks ────────────────────────────────────────────────────────────────────
+export { useAddressActivity } from './hooks/useAddressActivity.js'
+export {
+  AddressType,
+  useAddressValidation,
+} from './hooks/useAddressValidation.js'
+export { useAvailableChains } from './hooks/useAvailableChains.js'
+export { useChain } from './hooks/useChain.js'
+export { useContactSupport } from './hooks/useContactSupport.js'
+export { useDebouncedWatch } from './hooks/useDebouncedWatch.js'
+export { useExplorer } from './hooks/useExplorer.js'
+export { useHeader } from './hooks/useHeader.js'
+export { useListHeight } from './hooks/useListHeight.js'
+export { useNavigateBack } from './hooks/useNavigateBack.js'
+export { useRouteExecution } from './hooks/useRouteExecution.js'
+export { useRouteExecutionMessage } from './hooks/useRouteExecutionMessage.js'
+export { useRoutes } from './hooks/useRoutes.js'
+export { useToAddressRequirements } from './hooks/useToAddressRequirements.js'
+export { useToken } from './hooks/useToken.js'
+export { useTokenAddressBalance } from './hooks/useTokenAddressBalance.js'
+export { useTokenBalances } from './hooks/useTokenBalances.js'
+export { useTokenList } from './hooks/useTokenList.js'
+export { useTools } from './hooks/useTools.js'
+export { useWidgetEvents } from './hooks/useWidgetEvents.js'
+// ── pages ────────────────────────────────────────────────────────────────────
+export { MainWarningMessages } from './pages/MainPage/MainWarningMessages.js'
+export { Stack } from './pages/RoutesPage/RoutesPage.style.js'
+export { SelectChainPage } from './pages/SelectChainPage/SelectChainPage.js'
+export { SearchTokenInput } from './pages/SelectTokenPage/SearchTokenInput.js'
+export { ContactSupportButton } from './pages/TransactionDetailsPage/ContactSupportButton.js'
+export { ConfirmToAddressSheet } from './pages/TransactionPage/ConfirmToAddressSheet.js'
+export {
+  ExchangeRateBottomSheet,
+  type ExchangeRateBottomSheetBase,
+} from './pages/TransactionPage/ExchangeRateBottomSheet.js'
+export { ExecutionDoneCard } from './pages/TransactionPage/ExecutionDoneCard.js'
+export { RouteTracker } from './pages/TransactionPage/RouteTracker.js'
+export { StartTransactionButton } from './pages/TransactionPage/StartTransactionButton.js'
+export { TokenValueBottomSheet } from './pages/TransactionPage/TokenValueBottomSheet.js'
+export { TransactionDoneButtons } from './pages/TransactionPage/TransactionDoneButtons.js'
+export {
+  calculateValueLossPercentage,
+  getTokenValueLossThreshold,
+} from './pages/TransactionPage/utils.js'
+
+// ── providers ────────────────────────────────────────────────────────────────
+export { I18nProvider } from './providers/I18nProvider/I18nProvider.js'
+export { QueryClientProvider } from './providers/QueryClientProvider.js'
+export {
+  SDKClientProvider,
+  useSDKClient,
+} from './providers/SDKClientProvider.js'
+export { WalletProvider } from './providers/WalletProvider/WalletProvider.js'
+export {
+  useWidgetConfig,
+  WidgetProvider,
+} from './providers/WidgetProvider/WidgetProvider.js'
+
+// ── stores ───────────────────────────────────────────────────────────────────
+export { BookmarkStoreProvider } from './stores/bookmarks/BookmarkStore.js'
+export { useChainOrderStore } from './stores/chains/ChainOrderStore.js'
+export {
+  FormKeyHelper,
+  type FormType,
+  type FormTypeProps,
+} from './stores/form/types.js'
+export { useFieldActions } from './stores/form/useFieldActions.js'
+export { useFieldValues } from './stores/form/useFieldValues.js'
+export {
+  useHeaderStore,
+  useSetHeaderHeight,
+} from './stores/header/useHeaderStore.js'
+export { useInputModeStore } from './stores/inputMode/useInputModeStore.js'
+export {
+  useRouteExecutionStore,
+  useRouteExecutionStoreContext,
+} from './stores/routes/RouteExecutionStore.js'
+export { RouteExecutionStatus } from './stores/routes/types.js'
+export {
+  getSourceTxHash,
+  isRouteActive,
+  isRouteDone,
+  isRouteFailed,
+} from './stores/routes/utils.js'
+export { StoreProvider } from './stores/StoreProvider.js'
+export {
+  SettingsStoreProvider,
+  useSettingsStoreContext,
+} from './stores/settings/SettingsStore.js'
+
+// ── themes ───────────────────────────────────────────────────────────────────
+export { createTheme } from './themes/createTheme.js'
+
+// ── types ────────────────────────────────────────────────────────────────────
+export { WidgetEvent } from './types/events.js'
+export type {
+  FormRef,
+  WidgetConfig,
+  WidgetTheme,
+} from './types/widget.js'
+
+// ── utils ────────────────────────────────────────────────────────────────────
+export { buildRouteFromTxHistory } from './utils/converters.js'
+export { createElementId, ElementId } from './utils/elements.js'
+export { hasEnumFlag } from './utils/enum.js'
+export { getAccumulatedFeeCostsBreakdown } from './utils/fees.js'
+export {
+  formatDuration,
+  formatInputAmount,
+  formatTokenAmount,
+  formatTokenPrice,
+  priceToTokenAmount,
+  usdDecimals,
+} from './utils/format.js'
+export { getPriceImpact } from './utils/getPriceImpact.js'
+export { fitInputText } from './utils/input.js'
+export { navigationRoutes } from './utils/navigationRoutes.js'
+export { shortenAddress } from './utils/wallet.js'

package/src/stores/form/createFormStore.ts

@@ -13,6 +13,7 @@ import type {
 export const formDefaultValues: DefaultValues = {
   fromAmount: '',
   toAmount: '',
+  cashFiatAmount: '',
   tokenSearchFilter: '',
   priceInverted: false,
   validUntil: DEFAULT_VALID_UNTIL_SECONDS,

package/src/stores/form/types.ts

@@ -12,6 +12,7 @@ export interface DefaultFieldValues {
 }
 
 export interface DefaultValues extends DefaultFieldValues {
+  cashFiatAmount: string
   contractCalls?: ContractCall[]
   tokenSearchFilter: string
   /** Limit-order: when true, the price is displayed/entered inverted. */

package/src/utils/tokenList.ts

@@ -1,8 +1,4 @@
-import {
-  formatUnits,
-  type TokenExtended,
-  type WalletTokenExtended,
-} from '@lifi/sdk'
+import { formatUnits, type TokenExtended } from '@lifi/sdk'
 import type { TokenAmount, TokenAmountExtended } from '../types/token.js'
 import type { WidgetTokens } from '../types/widget.js'
 
@@ -15,8 +11,8 @@ const sortByBalances = (a: TokenAmount, b: TokenAmount) =>
 const sortByVolume = (a: TokenExtended, b: TokenExtended) =>
   (b.volumeUSD24H ?? 0) - (a.volumeUSD24H ?? 0)
 
-export const processTokenBalances = (
-  isBalanceLoading: boolean,
+export const processTokenList = (
+  withoutBalances: boolean,
   noCategories: boolean,
   configTokens?: WidgetTokens,
   selectedChainId?: number,
@@ -28,7 +24,7 @@ export const processTokenBalances = (
   withCategories: boolean
   withPinnedTokens: boolean
 } => {
-  if (isBalanceLoading) {
+  if (withoutBalances) {
     if (noCategories) {
       const sortedTokens = [...(tokens ?? [])].sort(sortByVolume)
       // Separate pinned tokens
@@ -278,7 +274,3 @@ export const isSearchMatch = (
     token.address?.toLowerCase().includes(searchLowerCase)
   )
 }
-
-export const isSupportedToken = (token: WalletTokenExtended): boolean => {
-  return Boolean(token.name && token.symbol && token.priceUSD && token.chainId)
-}

package/dist/esm/hooks/useFilteredByTokenBalances.js

@@ -1,74 +0,0 @@
-import { getConfigItemSets, isFormItemAllowed } from "../utils/item.js";
-import { useWidgetConfig } from "../providers/WidgetProvider/WidgetProvider.js";
-import { useSDKClient } from "../providers/SDKClientProvider.js";
-import { getVerifiedTokensSets } from "../utils/token.js";
-import { isSupportedToken } from "../utils/tokenList.js";
-import { ChainType, getWalletBalances } from "@lifi/sdk";
-import { useMemo } from "react";
-import { useQuery } from "@tanstack/react-query";
-//#region src/hooks/useFilteredByTokenBalances.ts
-const useFilteredTokensByBalance = (accountsWithTokens, formType) => {
-	const { tokens: configTokens } = useWidgetConfig();
-	const sdkClient = useSDKClient();
-	const evmAddress = useMemo(() => {
-		return Object.entries(accountsWithTokens ?? {}).find(([_, { chainType }]) => chainType === ChainType.EVM)?.[0];
-	}, [accountsWithTokens]);
-	const { data: existingBalances, isLoading } = useQuery({
-		queryKey: ["existing-evm-balances", evmAddress],
-		queryFn: () => getWalletBalances(sdkClient, evmAddress ?? ""),
-		enabled: !!evmAddress,
-		refetchInterval: 3e4,
-		staleTime: 3e4,
-		retry: false
-	});
-	return {
-		data: useMemo(() => {
-			if (!accountsWithTokens) return;
-			const result = {};
-			if (!existingBalances) {
-				for (const [address, { tokens }] of Object.entries(accountsWithTokens)) result[address] = tokens;
-				return result;
-			}
-			const verifiedTokensSets = getVerifiedTokensSets(configTokens);
-			for (const [address, { tokens }] of Object.entries(accountsWithTokens)) {
-				result[address] = {};
-				for (const [chainIdStr, chainTokens] of Object.entries(tokens)) {
-					const chainId = Number(chainIdStr);
-					const verifiedAddresses = verifiedTokensSets?.get(chainId);
-					const balances = existingBalances?.[chainId];
-					if (!balances?.length) {
-						if (chainTokens.length) result[address][chainId] = chainTokens;
-						continue;
-					}
-					const balanceSet = new Set(balances.map((balance) => balance.address.toLowerCase()));
-					const filteredTokens = chainTokens.filter((token) => {
-						const tokenKey = token.address.toLowerCase();
-						return balanceSet.has(tokenKey);
-					});
-					const chainTokenSet = new Set(chainTokens.map((token) => token.address.toLowerCase()));
-					const allowedAddressesConfig = getConfigItemSets(configTokens, (tokens) => new Set(tokens.filter((t) => Number(t.chainId) === chainId).map((t) => t.address.toLowerCase())), formType);
-					const additionalTokens = balances.filter((balance) => {
-						const balanceKey = balance.address.toLowerCase();
-						return !chainTokenSet.has(balanceKey) && isSupportedToken(balance) && isFormItemAllowed(balance, allowedAddressesConfig, formType, (t) => t.address.toLowerCase());
-					}).map((token) => ({
-						...token,
-						verified: verifiedAddresses?.has(token.address.toLowerCase()) ?? false
-					}));
-					const allTokens = [...filteredTokens, ...additionalTokens];
-					if (allTokens.length) result[address][chainId] = allTokens;
-				}
-			}
-			return result;
-		}, [
-			accountsWithTokens,
-			existingBalances,
-			configTokens,
-			formType
-		]),
-		isLoading
-	};
-};
-//#endregion
-export { useFilteredTokensByBalance };
-
-//# sourceMappingURL=useFilteredByTokenBalances.js.map

package/dist/esm/hooks/useFilteredByTokenBalances.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useFilteredByTokenBalances.js","names":[],"sources":["../../../src/hooks/useFilteredByTokenBalances.ts"],"sourcesContent":["import {\n  type BaseToken,\n  ChainType,\n  getWalletBalances,\n  type TokenExtended,\n  type WalletTokenExtended,\n} from '@lifi/sdk'\nimport { useQuery } from '@tanstack/react-query'\nimport { useMemo } from 'react'\nimport { useSDKClient } from '../providers/SDKClientProvider.js'\nimport { useWidgetConfig } from '../providers/WidgetProvider/WidgetProvider.js'\nimport type { FormType } from '../stores/form/types.js'\nimport { getConfigItemSets, isFormItemAllowed } from '../utils/item.js'\nimport { getVerifiedTokensSets } from '../utils/token.js'\nimport { isSupportedToken } from '../utils/tokenList.js'\n\nexport const useFilteredTokensByBalance = (\n  accountsWithTokens?: Record<\n    string,\n    { chainType: ChainType; tokens: Record<number, TokenExtended[]> }\n  >,\n  formType?: FormType\n): {\n  data: Record<string, Record<number, TokenExtended[]>> | undefined\n  isLoading: boolean\n} => {\n  const { tokens: configTokens } = useWidgetConfig()\n  const sdkClient = useSDKClient()\n\n  const evmAddress = useMemo(() => {\n    const evmAccount = Object.entries(accountsWithTokens ?? {}).find(\n      ([_, { chainType }]) => chainType === ChainType.EVM\n    )\n    return evmAccount?.[0]\n  }, [accountsWithTokens])\n\n  const { data: existingBalances, isLoading } = useQuery({\n    queryKey: ['existing-evm-balances', evmAddress],\n    queryFn: () => getWalletBalances(sdkClient, evmAddress ?? ''),\n    enabled: !!evmAddress,\n    refetchInterval: 30_000, // 30 seconds\n    staleTime: 30_000, // 30 seconds\n    retry: false,\n  })\n\n  const accountsWithFilteredTokens = useMemo(() => {\n    if (!accountsWithTokens) {\n      return undefined\n    }\n\n    // Early return if no existing balances - return all tokens\n    const result: Record<string, Record<number, TokenExtended[]>> = {}\n    if (!existingBalances) {\n      for (const [address, { tokens }] of Object.entries(accountsWithTokens)) {\n        result[address] = tokens\n      }\n      return result\n    }\n\n    const verifiedTokensSets = getVerifiedTokensSets(configTokens)\n\n    for (const [address, { tokens }] of Object.entries(accountsWithTokens)) {\n      result[address] = {}\n\n      for (const [chainIdStr, chainTokens] of Object.entries(tokens)) {\n        const chainId = Number(chainIdStr)\n        const verifiedAddresses = verifiedTokensSets?.get(chainId)\n        // Get balances for this specific chain\n        const balances = existingBalances?.[chainId]\n        // If no balances, RPC all tokens of the chain\n        if (!balances?.length) {\n          if (chainTokens.length) {\n            result[address][chainId] = chainTokens\n          }\n          continue\n        }\n\n        // Optimize token matching with Set for O(1) lookup\n        const balanceSet = new Set(\n          balances.map((balance: WalletTokenExtended) =>\n            balance.address.toLowerCase()\n          )\n        )\n\n        // Get tokens that are in chainTokens and have balances\n        const filteredTokens = chainTokens.filter((token) => {\n          const tokenKey = token.address.toLowerCase()\n          return balanceSet.has(tokenKey)\n        })\n\n        // Get tokens that are in balances but not in chainTokens\n        const chainTokenSet = new Set(\n          chainTokens.map((token) => token.address.toLowerCase())\n        )\n\n        // Get allowed addresses from config tokens\n        const allowedAddressesConfig = getConfigItemSets(\n          configTokens,\n          (tokens: BaseToken[]) =>\n            new Set(\n              tokens\n                .filter((t) => Number(t.chainId) === chainId)\n                .map((t) => t.address.toLowerCase())\n            ),\n          formType\n        )\n\n        const additionalTokens = balances\n          .filter((balance: WalletTokenExtended) => {\n            const balanceKey = balance.address.toLowerCase()\n            return (\n              !chainTokenSet.has(balanceKey) &&\n              isSupportedToken(balance) &&\n              isFormItemAllowed(\n                balance,\n                allowedAddressesConfig,\n                formType,\n                (t) => t.address.toLowerCase()\n              )\n            )\n          })\n          // Mark tokens from wallet balances as unverified unless allowlisted\n          .map((token: WalletTokenExtended) => ({\n            ...token,\n            verified:\n              verifiedAddresses?.has(token.address.toLowerCase()) ?? false,\n          })) as TokenExtended[]\n\n        // Combine both sets of tokens - convert WalletTokenExtended to TokenAmount\n        const allTokens = [\n          ...filteredTokens,\n          ...additionalTokens,\n        ] as TokenExtended[]\n\n        if (allTokens.length) {\n          result[address][chainId] = allTokens\n        }\n      }\n    }\n\n    return result\n  }, [accountsWithTokens, existingBalances, configTokens, formType])\n\n  return { data: accountsWithFilteredTokens, isLoading }\n}\n"],"mappings":";;;;;;;;;AAgBA,MAAa,8BACX,oBAIA,aAIG;CACH,MAAM,EAAE,QAAQ,iBAAiB,gBAAgB;CACjD,MAAM,YAAY,aAAa;CAE/B,MAAM,aAAa,cAAc;EAI/B,OAHmB,OAAO,QAAQ,sBAAsB,CAAC,CAAC,CAAC,CAAC,MACzD,CAAC,GAAG,EAAE,iBAAiB,cAAc,UAAU,GAElC,CAAC,GAAG;CACtB,GAAG,CAAC,kBAAkB,CAAC;CAEvB,MAAM,EAAE,MAAM,kBAAkB,cAAc,SAAS;EACrD,UAAU,CAAC,yBAAyB,UAAU;EAC9C,eAAe,kBAAkB,WAAW,cAAc,EAAE;EAC5D,SAAS,CAAC,CAAC;EACX,iBAAiB;EACjB,WAAW;EACX,OAAO;CACT,CAAC;CAoGD,OAAO;EAAE,MAlG0B,cAAc;GAC/C,IAAI,CAAC,oBACH;GAIF,MAAM,SAA0D,CAAC;GACjE,IAAI,CAAC,kBAAkB;IACrB,KAAK,MAAM,CAAC,SAAS,EAAE,aAAa,OAAO,QAAQ,kBAAkB,GACnE,OAAO,WAAW;IAEpB,OAAO;GACT;GAEA,MAAM,qBAAqB,sBAAsB,YAAY;GAE7D,KAAK,MAAM,CAAC,SAAS,EAAE,aAAa,OAAO,QAAQ,kBAAkB,GAAG;IACtE,OAAO,WAAW,CAAC;IAEnB,KAAK,MAAM,CAAC,YAAY,gBAAgB,OAAO,QAAQ,MAAM,GAAG;KAC9D,MAAM,UAAU,OAAO,UAAU;KACjC,MAAM,oBAAoB,oBAAoB,IAAI,OAAO;KAEzD,MAAM,WAAW,mBAAmB;KAEpC,IAAI,CAAC,UAAU,QAAQ;MACrB,IAAI,YAAY,QACd,OAAO,QAAQ,CAAC,WAAW;MAE7B;KACF;KAGA,MAAM,aAAa,IAAI,IACrB,SAAS,KAAK,YACZ,QAAQ,QAAQ,YAAY,CAC9B,CACF;KAGA,MAAM,iBAAiB,YAAY,QAAQ,UAAU;MACnD,MAAM,WAAW,MAAM,QAAQ,YAAY;MAC3C,OAAO,WAAW,IAAI,QAAQ;KAChC,CAAC;KAGD,MAAM,gBAAgB,IAAI,IACxB,YAAY,KAAK,UAAU,MAAM,QAAQ,YAAY,CAAC,CACxD;KAGA,MAAM,yBAAyB,kBAC7B,eACC,WACC,IAAI,IACF,OACG,QAAQ,MAAM,OAAO,EAAE,OAAO,MAAM,OAAO,CAAC,CAC5C,KAAK,MAAM,EAAE,QAAQ,YAAY,CAAC,CACvC,GACF,QACF;KAEA,MAAM,mBAAmB,SACtB,QAAQ,YAAiC;MACxC,MAAM,aAAa,QAAQ,QAAQ,YAAY;MAC/C,OACE,CAAC,cAAc,IAAI,UAAU,KAC7B,iBAAiB,OAAO,KACxB,kBACE,SACA,wBACA,WACC,MAAM,EAAE,QAAQ,YAAY,CAC/B;KAEJ,CAAC,CAAC,CAED,KAAK,WAAgC;MACpC,GAAG;MACH,UACE,mBAAmB,IAAI,MAAM,QAAQ,YAAY,CAAC,KAAK;KAC3D,EAAE;KAGJ,MAAM,YAAY,CAChB,GAAG,gBACH,GAAG,gBACL;KAEA,IAAI,UAAU,QACZ,OAAO,QAAQ,CAAC,WAAW;IAE/B;GACF;GAEA,OAAO;EACT,GAAG;GAAC;GAAoB;GAAkB;GAAc;EAAQ,CAExB;EAAG;CAAU;AACvD"}