npm - @lifi/widget - Versions diffs - 4.0.0 → 4.1.0 - Mend

@lifi/widget 4.0.0 → 4.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (324) hide show

package/dist/esm/components/TokenList/TokenListItem.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TokenListItem.js","names":["ListItem","IconButton","ListItemButton"],"sources":["../../../../src/components/TokenList/TokenListItem.tsx"],"sourcesContent":["import type { StaticToken } from '@lifi/sdk'\nimport { ChainType } from '@lifi/sdk'\nimport InfoOutlinedIcon from '@mui/icons-material/InfoOutlined'\nimport WarningRounded from '@mui/icons-material/WarningRounded'\nimport {\n Avatar,\n Box,\n ListItemAvatar,\n ListItemText,\n listItemSecondaryActionClasses,\n Skeleton,\n Slide,\n Tooltip,\n Typography,\n} from '@mui/material'\nimport type { JSX, MouseEventHandler } from 'react'\nimport { memo, useMemo, useRef, useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useLongPress } from '../../hooks/useLongPress.js'\nimport { formatTokenAmount, formatTokenPrice } from '../../utils/format.js'\nimport { shortenAddress } from '../../utils/wallet.js'\nimport { TokenAvatar } from '../Avatar/TokenAvatar.js'\nimport { ListItemButton } from '../ListItem/ListItemButton.js'\nimport { PinTokenButton } from './PinTokenButton.js'\nimport { IconButton, ListItem } from './TokenList.style.js'\nimport type {\n TokenListItemAvatarProps,\n TokenListItemButtonProps,\n TokenListItemProps,\n} from './types.js'\n\nexport const TokenListItem: React.FC<TokenListItemProps> = memo(\n ({\n onClick,\n size,\n start,\n token,\n chain,\n isBalanceLoading,\n startAdornment,\n endAdornment,\n selected,\n onShowTokenDetails,\n }) => {\n return (\n <ListItem\n style={{\n height: `${size}px`,\n transform: `translateY(${start}px)`,\n padding: 0,\n }}\n >\n {startAdornment}\n <TokenListItemButton\n token={token}\n isBalanceLoading={isBalanceLoading}\n onClick={onClick}\n chain={chain}\n selected={selected}\n onShowTokenDetails={onShowTokenDetails}\n />\n {endAdornment}\n </ListItem>\n )\n }\n)\n\nconst TokenListItemAvatar = memo(({ token }: TokenListItemAvatarProps) => {\n const [isImageLoading, setIsImageLoading] = useState(true)\n\n return (\n <Avatar\n src={token.logoURI}\n alt={token.symbol}\n sx={(theme) =>\n isImageLoading ? { bgcolor: theme.vars.palette.grey[300] } : null\n }\n onLoad={() => setIsImageLoading(false)}\n >\n {token.symbol?.[0]}\n </Avatar>\n )\n})\n\ninterface OpenTokenDetailsButtonProps {\n tokenAddress: string \| undefined\n withoutContractAddress: boolean\n chainId: number\n onClick: (\n tokenAddress: string,\n withoutContractAddress: boolean,\n chainId: number\n ) => void\n}\n\nconst OpenTokenDetailsButton = ({\n tokenAddress,\n withoutContractAddress,\n chainId,\n onClick,\n}: OpenTokenDetailsButtonProps) => {\n if (!tokenAddress) {\n return null\n }\n return (\n <IconButton\n size=\"small\"\n onClick={(e) => {\n e.stopPropagation()\n e.currentTarget.blur() // Remove focus to prevent accessibility issues when opening drawer\n onClick(tokenAddress, withoutContractAddress, chainId)\n }}\n >\n <InfoOutlinedIcon />\n </IconButton>\n )\n}\n\nconst TokenListItemButton: React.FC<TokenListItemButtonProps> = memo(\n ({\n onClick,\n token,\n chain,\n isBalanceLoading,\n selected,\n onShowTokenDetails,\n }) => {\n const { t } = useTranslation()\n const container = useRef(null)\n const timeoutId = useRef<ReturnType<typeof setTimeout>>(undefined)\n const [showAddress, setShowAddress] = useState(false)\n\n const withoutContractAddress = chain?.chainType === ChainType.UTXO\n\n const onMouseEnter = () => {\n timeoutId.current = setTimeout(() => {\n if (token.address) {\n setShowAddress(true)\n }\n }, 350)\n }\n\n const onMouseLeave = () => {\n clearTimeout(timeoutId.current)\n if (showAddress) {\n setShowAddress(false)\n }\n }\n\n const handleClick: MouseEventHandler<HTMLDivElement> = (e) => {\n e.stopPropagation()\n onClick?.(token.address, token.chainId)\n }\n\n const tokenAmount = useMemo(\n () => formatTokenAmount(token.amount, token.decimals),\n [token.amount, token.decimals]\n )\n\n const tokenPrice = useMemo(\n () => formatTokenPrice(token.amount, token.priceUSD, token.decimals),\n [token.amount, token.priceUSD, token.decimals]\n )\n\n const longPressEvents = useLongPress(() =>\n onShowTokenDetails(token.address, withoutContractAddress, token.chainId)\n )\n\n return (\n <ListItemButton\n onClick={handleClick}\n onMouseEnter={onMouseEnter}\n onMouseLeave={onMouseLeave}\n {...longPressEvents}\n dense\n selected={selected}\n sx={{\n height: 60,\n marginBottom: '4px',\n }}\n >\n <ListItemAvatar>\n {chain ? (\n <TokenAvatar\n token={token as StaticToken}\n chain={chain}\n tokenAvatarSize={40}\n chainAvatarSize={16}\n />\n ) : (\n <TokenListItemAvatar token={token} />\n )}\n </ListItemAvatar>\n <ListItemText\n primary={\n <Box sx={{ display: 'flex', alignItems: 'center', gap: 0.5 }}>\n {token.symbol}\n {!token.verified && (\n <Tooltip\n title={t('warning.message.unverifiedToken')}\n placement=\"top\"\n arrow\n >\n <WarningRounded\n sx={{\n display: 'flex',\n fontSize: 16,\n color: 'warning.main',\n cursor: 'help',\n }}\n />\n </Tooltip>\n )}\n </Box>\n }\n slotProps={{\n secondary: {\n component: 'div',\n },\n }}\n secondary={\n withoutContractAddress ? (\n <Box\n ref={container}\n sx={{\n height: 20,\n display: 'flex',\n }}\n >\n <Box\n sx={{\n pt: 0.25,\n }}\n >\n {token.name}\n </Box>\n <Box\n sx={{\n position: 'relative',\n }}\n >\n <Slide\n direction=\"up\"\n in={showAddress}\n container={container.current}\n style={{\n position: 'absolute',\n }}\n appear={false}\n mountOnEnter\n >\n <Box>\n <OpenTokenDetailsButton\n tokenAddress={token.address}\n withoutContractAddress={withoutContractAddress}\n chainId={token.chainId}\n onClick={onShowTokenDetails}\n />\n <PinTokenButton\n chainId={token.chainId}\n tokenAddress={token.address}\n />\n </Box>\n </Slide>\n </Box>\n </Box>\n ) : (\n <Box\n ref={container}\n sx={{\n position: 'relative',\n height: 20,\n }}\n >\n <Slide\n direction=\"down\"\n in={!showAddress}\n container={container.current}\n style={{\n position: 'absolute',\n }}\n appear={false}\n >\n <Box\n sx={{\n pt: 0.25,\n }}\n >\n {token.name}\n </Box>\n </Slide>\n <Slide\n direction=\"up\"\n in={showAddress}\n container={container.current}\n style={{\n position: 'absolute',\n }}\n appear={false}\n mountOnEnter\n >\n <Box\n sx={{\n display: 'flex',\n alignItems: 'center',\n gap: 0.5,\n }}\n >\n <Box\n sx={{\n display: 'flex',\n alignItems: 'center',\n pt: 0.125,\n }}\n >\n {shortenAddress(token.address)}\n </Box>\n <Box>\n <OpenTokenDetailsButton\n tokenAddress={token.address}\n withoutContractAddress={withoutContractAddress}\n chainId={token.chainId}\n onClick={onShowTokenDetails}\n />\n <PinTokenButton\n chainId={token.chainId}\n tokenAddress={token.address}\n />\n </Box>\n </Box>\n </Slide>\n </Box>\n )\n }\n />\n {isBalanceLoading ? (\n <TokenAmountSkeleton />\n ) : (\n <Box sx={{ textAlign: 'right' }}>\n {token.amount ? (\n <Typography\n noWrap\n sx={{\n fontWeight: 600,\n }}\n title={tokenAmount}\n >\n {t('format.tokenAmount', {\n value: tokenAmount,\n })}\n </Typography>\n ) : null}\n {token.amount && token.priceUSD ? (\n <Typography\n data-price={token.priceUSD}\n sx={{\n fontWeight: 500,\n fontSize: 12,\n color: 'text.secondary',\n }}\n >\n {t('format.currency', {\n value: tokenPrice,\n })}\n </Typography>\n ) : null}\n </Box>\n )}\n </ListItemButton>\n )\n }\n)\n\nexport const TokenListItemSkeleton = (): JSX.Element => {\n return (\n <ListItem\n secondaryAction={<TokenAmountSkeleton />}\n disablePadding\n sx={(theme) => ({\n position: 'relative',\n flexDirection: 'row',\n alignItems: 'center',\n padding: 0,\n [`& .${listItemSecondaryActionClasses.root}`]: {\n right: theme.spacing(1.5),\n },\n })}\n >\n <ListItemAvatar>\n <Skeleton\n variant=\"circular\"\n width={40}\n height={40}\n sx={{ marginLeft: 1.5, marginRight: 2 }}\n />\n </ListItemAvatar>\n <ListItemText\n primary={<Skeleton variant=\"text\" width={56} height={24} />}\n secondary={<Skeleton variant=\"text\" width={96} height={16} />}\n />\n </ListItem>\n )\n}\n\nconst TokenAmountSkeleton: React.FC = () => {\n return (\n <Box\n sx={{\n display: 'flex',\n flexDirection: 'column',\n alignItems: 'flex-end',\n }}\n >\n <Skeleton variant=\"text\" width={56} height={24} />\n <Skeleton variant=\"text\" width={48} height={16} />\n </Box>\n )\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"TokenListItem.js","names":["ListItem","IconButton","InfoOutlinedIcon","ListItemButton"],"sources":["../../../../src/components/TokenList/TokenListItem.tsx"],"sourcesContent":["import type { StaticToken } from '@lifi/sdk'\nimport { ChainType } from '@lifi/sdk'\nimport InfoOutlinedIcon from '@mui/icons-material/InfoOutlined'\nimport WarningRounded from '@mui/icons-material/WarningRounded'\nimport {\n Avatar,\n Box,\n ListItemAvatar,\n ListItemText,\n listItemSecondaryActionClasses,\n Skeleton,\n Slide,\n Tooltip,\n Typography,\n} from '@mui/material'\nimport type { JSX, MouseEventHandler } from 'react'\nimport { memo, useMemo, useRef, useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useLongPress } from '../../hooks/useLongPress.js'\nimport { formatTokenAmount, formatTokenPrice } from '../../utils/format.js'\nimport { shortenAddress } from '../../utils/wallet.js'\nimport { TokenAvatar } from '../Avatar/TokenAvatar.js'\nimport { ListItemButton } from '../ListItem/ListItemButton.js'\nimport { PinTokenButton } from './PinTokenButton.js'\nimport { IconButton, ListItem } from './TokenList.style.js'\nimport type {\n TokenListItemAvatarProps,\n TokenListItemButtonProps,\n TokenListItemProps,\n} from './types.js'\n\nexport const TokenListItem: React.FC<TokenListItemProps> = memo(\n ({\n onClick,\n size,\n start,\n token,\n chain,\n isBalanceLoading,\n startAdornment,\n endAdornment,\n selected,\n onShowTokenDetails,\n }) => {\n return (\n <ListItem\n style={{\n height: `${size}px`,\n transform: `translateY(${start}px)`,\n padding: 0,\n }}\n >\n {startAdornment}\n <TokenListItemButton\n token={token}\n isBalanceLoading={isBalanceLoading}\n onClick={onClick}\n chain={chain}\n selected={selected}\n onShowTokenDetails={onShowTokenDetails}\n />\n {endAdornment}\n </ListItem>\n )\n }\n)\n\nconst TokenListItemAvatar = memo(({ token }: TokenListItemAvatarProps) => {\n const [isImageLoading, setIsImageLoading] = useState(true)\n\n return (\n <Avatar\n src={token.logoURI}\n alt={token.symbol}\n sx={(theme) =>\n isImageLoading ? { bgcolor: theme.vars.palette.grey[300] } : null\n }\n onLoad={() => setIsImageLoading(false)}\n >\n {token.symbol?.[0]}\n </Avatar>\n )\n})\n\ninterface OpenTokenDetailsButtonProps {\n tokenAddress: string \| undefined\n withoutContractAddress: boolean\n chainId: number\n onClick: (\n tokenAddress: string,\n withoutContractAddress: boolean,\n chainId: number\n ) => void\n}\n\nconst OpenTokenDetailsButton = ({\n tokenAddress,\n withoutContractAddress,\n chainId,\n onClick,\n}: OpenTokenDetailsButtonProps) => {\n if (!tokenAddress) {\n return null\n }\n return (\n <IconButton\n size=\"small\"\n onClick={(e) => {\n e.stopPropagation()\n e.currentTarget.blur() // Remove focus to prevent accessibility issues when opening drawer\n onClick(tokenAddress, withoutContractAddress, chainId)\n }}\n >\n <InfoOutlinedIcon />\n </IconButton>\n )\n}\n\nconst TokenListItemButton: React.FC<TokenListItemButtonProps> = memo(\n ({\n onClick,\n token,\n chain,\n isBalanceLoading,\n selected,\n onShowTokenDetails,\n }) => {\n const { t } = useTranslation()\n const container = useRef(null)\n const timeoutId = useRef<ReturnType<typeof setTimeout>>(undefined)\n const [showAddress, setShowAddress] = useState(false)\n\n const withoutContractAddress = chain?.chainType === ChainType.UTXO\n\n const onMouseEnter = () => {\n timeoutId.current = setTimeout(() => {\n if (token.address) {\n setShowAddress(true)\n }\n }, 350)\n }\n\n const onMouseLeave = () => {\n clearTimeout(timeoutId.current)\n if (showAddress) {\n setShowAddress(false)\n }\n }\n\n const handleClick: MouseEventHandler<HTMLDivElement> = (e) => {\n e.stopPropagation()\n onClick?.(token.address, token.chainId)\n }\n\n const tokenAmount = useMemo(\n () => formatTokenAmount(token.amount, token.decimals),\n [token.amount, token.decimals]\n )\n\n const tokenPrice = useMemo(\n () => formatTokenPrice(token.amount, token.priceUSD, token.decimals),\n [token.amount, token.priceUSD, token.decimals]\n )\n\n const longPressEvents = useLongPress(() =>\n onShowTokenDetails(token.address, withoutContractAddress, token.chainId)\n )\n\n return (\n <ListItemButton\n onClick={handleClick}\n onMouseEnter={onMouseEnter}\n onMouseLeave={onMouseLeave}\n {...longPressEvents}\n dense\n selected={selected}\n sx={{\n height: 60,\n marginBottom: '4px',\n }}\n >\n <ListItemAvatar>\n {chain ? (\n <TokenAvatar\n token={token as StaticToken}\n chain={chain}\n tokenAvatarSize={40}\n chainAvatarSize={16}\n />\n ) : (\n <TokenListItemAvatar token={token} />\n )}\n </ListItemAvatar>\n <ListItemText\n primary={\n <Box sx={{ display: 'flex', alignItems: 'center', gap: 0.5 }}>\n {token.symbol}\n {!token.verified && (\n <Tooltip\n title={t('warning.message.unverifiedToken')}\n placement=\"top\"\n arrow\n >\n <WarningRounded\n sx={{\n display: 'flex',\n fontSize: 16,\n color: 'warning.main',\n cursor: 'help',\n }}\n />\n </Tooltip>\n )}\n </Box>\n }\n slotProps={{\n secondary: {\n component: 'div',\n },\n }}\n secondary={\n withoutContractAddress ? (\n <Box\n ref={container}\n sx={{\n height: 20,\n display: 'flex',\n }}\n >\n <Box\n sx={{\n pt: 0.25,\n }}\n >\n {token.name}\n </Box>\n <Box\n sx={{\n position: 'relative',\n }}\n >\n <Slide\n direction=\"up\"\n in={showAddress}\n container={container.current}\n style={{\n position: 'absolute',\n }}\n appear={false}\n mountOnEnter\n >\n <Box>\n <OpenTokenDetailsButton\n tokenAddress={token.address}\n withoutContractAddress={withoutContractAddress}\n chainId={token.chainId}\n onClick={onShowTokenDetails}\n />\n <PinTokenButton\n chainId={token.chainId}\n tokenAddress={token.address}\n />\n </Box>\n </Slide>\n </Box>\n </Box>\n ) : (\n <Box\n ref={container}\n sx={{\n position: 'relative',\n height: 20,\n }}\n >\n <Slide\n direction=\"down\"\n in={!showAddress}\n container={container.current}\n style={{\n position: 'absolute',\n }}\n appear={false}\n >\n <Box\n sx={{\n pt: 0.25,\n }}\n >\n {token.name}\n </Box>\n </Slide>\n <Slide\n direction=\"up\"\n in={showAddress}\n container={container.current}\n style={{\n position: 'absolute',\n }}\n appear={false}\n mountOnEnter\n >\n <Box\n sx={{\n display: 'flex',\n alignItems: 'center',\n gap: 0.5,\n }}\n >\n <Box\n sx={{\n display: 'flex',\n alignItems: 'center',\n pt: 0.125,\n }}\n >\n {shortenAddress(token.address)}\n </Box>\n <Box>\n <OpenTokenDetailsButton\n tokenAddress={token.address}\n withoutContractAddress={withoutContractAddress}\n chainId={token.chainId}\n onClick={onShowTokenDetails}\n />\n <PinTokenButton\n chainId={token.chainId}\n tokenAddress={token.address}\n />\n </Box>\n </Box>\n </Slide>\n </Box>\n )\n }\n />\n {isBalanceLoading ? (\n <TokenAmountSkeleton />\n ) : (\n <Box sx={{ textAlign: 'right' }}>\n {token.amount ? (\n <Typography\n noWrap\n sx={{\n fontWeight: 600,\n }}\n title={tokenAmount}\n >\n {t('format.tokenAmount', {\n value: tokenAmount,\n })}\n </Typography>\n ) : null}\n {token.amount && token.priceUSD ? (\n <Typography\n data-price={token.priceUSD}\n sx={{\n fontWeight: 500,\n fontSize: 12,\n color: 'text.secondary',\n }}\n >\n {t('format.currency', {\n value: tokenPrice,\n })}\n </Typography>\n ) : null}\n </Box>\n )}\n </ListItemButton>\n )\n }\n)\n\nexport const TokenListItemSkeleton = (): JSX.Element => {\n return (\n <ListItem\n secondaryAction={<TokenAmountSkeleton />}\n disablePadding\n sx={(theme) => ({\n position: 'relative',\n flexDirection: 'row',\n alignItems: 'center',\n padding: 0,\n [`& .${listItemSecondaryActionClasses.root}`]: {\n right: theme.spacing(1.5),\n },\n })}\n >\n <ListItemAvatar>\n <Skeleton\n variant=\"circular\"\n width={40}\n height={40}\n sx={{ marginLeft: 1.5, marginRight: 2 }}\n />\n </ListItemAvatar>\n <ListItemText\n primary={<Skeleton variant=\"text\" width={56} height={24} />}\n secondary={<Skeleton variant=\"text\" width={96} height={16} />}\n />\n </ListItem>\n )\n}\n\nconst TokenAmountSkeleton: React.FC = () => {\n return (\n <Box\n sx={{\n display: 'flex',\n flexDirection: 'column',\n alignItems: 'flex-end',\n }}\n >\n <Skeleton variant=\"text\" width={56} height={24} />\n <Skeleton variant=\"text\" width={48} height={16} />\n </Box>\n )\n}\n"],"mappings":"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"}

package/dist/esm/components/TokenList/VirtualizedTokenList.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"VirtualizedTokenList.js","names":["List"],"sources":["../../../../src/components/TokenList/VirtualizedTokenList.tsx"],"sourcesContent":["import { Typography } from '@mui/material'\nimport { useVirtualizer } from '@tanstack/react-virtual'\nimport type { FC } from 'react'\nimport { useCallback, useEffect, useMemo, useRef } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useAvailableChains } from '../../hooks/useAvailableChains.js'\nimport type { TokenAmount } from '../../types/token.js'\nimport { TokenDetailsSheet } from './TokenDetailsSheet.js'\nimport { List } from './TokenList.style.js'\nimport { TokenListItem, TokenListItemSkeleton } from './TokenListItem.js'\nimport type {\n TokenDetailsSheetBase,\n VirtualizedTokenListProps,\n} from './types.js'\n\nconst tokenItemHeight = 64 // 60 + 4px margin-bottom\n\nexport const VirtualizedTokenList: FC<VirtualizedTokenListProps> = ({\n tokens,\n scrollElementRef,\n chainId,\n selectedTokenAddress,\n isLoading,\n isBalanceLoading,\n showCategories,\n showPinnedTokens,\n onClick,\n isAllNetworks,\n}) => {\n const { t } = useTranslation()\n\n const { chains } = useAvailableChains()\n\n // Create Set for O(1) chain lookup instead of O(n) find\n const chainsSet = useMemo(() => {\n if (!chains) {\n return undefined\n }\n return new Map(chains.map((chain) => [chain.id, chain]))\n }, [chains])\n\n const tokenDetailsSheetRef = useRef<TokenDetailsSheetBase>(null)\n\n const onShowTokenDetails = useCallback(\n (tokenAddress: string, noContractAddress: boolean, chainId: number) => {\n tokenDetailsSheetRef.current?.open(\n tokenAddress,\n noContractAddress,\n chainId\n )\n },\n []\n )\n\n const getItemKey = useCallback(\n (index: number) => {\n const token = tokens[index]\n return `${token.chainId}-${token.address}-${index}`\n },\n [tokens]\n )\n\n const estimateSize = useCallback(\n (index: number) => {\n const currentToken = tokens[index]\n const previousToken = tokens[index - 1]\n let size = tokenItemHeight\n\n // Pinned tokens (always shown, even in all networks mode)\n if (currentToken.pinned && index === 0) {\n size += 24\n }\n if (previousToken?.pinned && !currentToken.pinned) {\n size += 32\n }\n\n if (!showCategories) {\n return size\n }\n\n if (currentToken.featured && !currentToken.pinned && index === 0) {\n size += 24\n }\n\n // Category transition (excluding pinned tokens)\n const isNotPinned = !currentToken.pinned && !previousToken?.pinned\n if (\n isNotPinned &&\n ((previousToken?.amount && !currentToken.amount) \|\|\n (previousToken?.featured && !currentToken.featured) \|\|\n (previousToken?.popular && !currentToken.popular))\n ) {\n size += 32\n }\n\n return size\n },\n [tokens, showCategories]\n )\n\n const virtualizerConfig = useMemo(\n () => ({\n count: tokens.length,\n overscan: 5,\n getScrollElement: () => scrollElementRef.current,\n estimateSize,\n getItemKey,\n paddingEnd: 8,\n }),\n [tokens.length, estimateSize, getItemKey, scrollElementRef]\n )\n\n const { getVirtualItems, getTotalSize, scrollToIndex, measure } =\n useVirtualizer(virtualizerConfig)\n\n // Address the issue of disappearing tokens on rerender\n useEffect(() => {\n if (scrollElementRef.current) {\n measure()\n }\n }, [measure, scrollElementRef.current])\n\n // biome-ignore lint/correctness/useExhaustiveDependencies: run only when chainId changes\n useEffect(() => {\n // Scroll to the top of the list when switching the chains\n if (getVirtualItems().length) {\n scrollToIndex(0, { align: 'start' })\n }\n // Close the token details sheet when switching the chains\n tokenDetailsSheetRef.current?.close()\n }, [scrollToIndex, isAllNetworks, chainId, getVirtualItems])\n\n return (\n <>\n <List\n className=\"long-list\"\n style={{ height: getTotalSize() }}\n disablePadding\n >\n {getVirtualItems().map((item) => {\n const currentToken = tokens[item.index]\n const previousToken: TokenAmount \| undefined = tokens[item.index - 1]\n const chain = chainsSet?.get(currentToken.chainId)\n\n const isNotPinned = !currentToken.pinned\n const isFirstPinnedToken = currentToken.pinned && item.index === 0\n const isTransitionFromPinned = previousToken?.pinned && isNotPinned\n\n // Category transitions (excluding pinned)\n const isTransitionFromFeatured =\n previousToken?.featured && !currentToken.featured && isNotPinned\n const isTransitionFromMyTokens =\n previousToken?.amount && !currentToken.amount && isNotPinned\n const isTransitionFromPopular =\n previousToken?.popular && !currentToken.popular && isNotPinned\n\n // Determine which category label to show\n const startAdornmentLabel = (() => {\n if (showPinnedTokens && isFirstPinnedToken) {\n return t('main.pinnedTokens')\n }\n if (showPinnedTokens && !showCategories && isTransitionFromPinned) {\n return t('main.allTokens')\n }\n if (!showCategories) {\n return null\n }\n\n if (\n (isTransitionFromPinned && currentToken.featured) \|\|\n (currentToken.featured && isNotPinned && item.index === 0)\n ) {\n return t('main.featuredTokens')\n }\n if (\n (isTransitionFromFeatured \|\| isTransitionFromPinned) &&\n currentToken.amount &&\n isNotPinned\n ) {\n return t('main.myTokens')\n }\n if (\n (isTransitionFromFeatured \|\|\n isTransitionFromMyTokens \|\|\n isTransitionFromPinned) &&\n currentToken.popular &&\n isNotPinned\n ) {\n return t('main.popularTokens')\n }\n if (\n isTransitionFromMyTokens \|\|\n isTransitionFromFeatured \|\|\n isTransitionFromPinned \|\|\n isTransitionFromPopular\n ) {\n return t('main.allTokens')\n }\n return null\n })()\n\n const isSelected =\n selectedTokenAddress === currentToken.address &&\n chainId === currentToken.chainId\n\n return (\n <TokenListItem\n key={item.key}\n onClick={onClick}\n size={item.size}\n start={item.start}\n token={currentToken}\n chain={isAllNetworks ? chain : undefined}\n selected={isSelected}\n onShowTokenDetails={onShowTokenDetails}\n isBalanceLoading={isBalanceLoading}\n startAdornment={\n startAdornmentLabel ? (\n <Typography\n sx={{\n fontSize: 14,\n fontWeight: 600,\n lineHeight: '16px',\n px: 1.5,\n pt:\n isFirstPinnedToken \|\|\n (currentToken.featured &&\n isNotPinned &&\n item.index === 0)\n ? 0\n : 1,\n pb: 1,\n }}\n >\n {startAdornmentLabel}\n </Typography>\n ) : null\n }\n />\n )\n })}\n </List>\n <TokenDetailsSheet ref={tokenDetailsSheetRef} />\n {isLoading && (\n <List disablePadding sx={{ cursor: 'default' }}>\n {Array.from({ length: 3 }).map((_, index) => (\n <TokenListItemSkeleton key={index} />\n ))}\n </List>\n )}\n </>\n )\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"VirtualizedTokenList.js","names":["List"],"sources":["../../../../src/components/TokenList/VirtualizedTokenList.tsx"],"sourcesContent":["import { Typography } from '@mui/material'\nimport { useVirtualizer } from '@tanstack/react-virtual'\nimport type { FC } from 'react'\nimport { useCallback, useEffect, useMemo, useRef } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useAvailableChains } from '../../hooks/useAvailableChains.js'\nimport type { TokenAmount } from '../../types/token.js'\nimport { TokenDetailsSheet } from './TokenDetailsSheet.js'\nimport { List } from './TokenList.style.js'\nimport { TokenListItem, TokenListItemSkeleton } from './TokenListItem.js'\nimport type {\n TokenDetailsSheetBase,\n VirtualizedTokenListProps,\n} from './types.js'\n\nconst tokenItemHeight = 64 // 60 + 4px margin-bottom\n\nexport const VirtualizedTokenList: FC<VirtualizedTokenListProps> = ({\n tokens,\n scrollElementRef,\n chainId,\n selectedTokenAddress,\n isLoading,\n isBalanceLoading,\n showCategories,\n showPinnedTokens,\n onClick,\n isAllNetworks,\n}) => {\n const { t } = useTranslation()\n\n const { chains } = useAvailableChains()\n\n // Create Set for O(1) chain lookup instead of O(n) find\n const chainsSet = useMemo(() => {\n if (!chains) {\n return undefined\n }\n return new Map(chains.map((chain) => [chain.id, chain]))\n }, [chains])\n\n const tokenDetailsSheetRef = useRef<TokenDetailsSheetBase>(null)\n\n const onShowTokenDetails = useCallback(\n (tokenAddress: string, noContractAddress: boolean, chainId: number) => {\n tokenDetailsSheetRef.current?.open(\n tokenAddress,\n noContractAddress,\n chainId\n )\n },\n []\n )\n\n const getItemKey = useCallback(\n (index: number) => {\n const token = tokens[index]\n return `${token.chainId}-${token.address}-${index}`\n },\n [tokens]\n )\n\n const estimateSize = useCallback(\n (index: number) => {\n const currentToken = tokens[index]\n const previousToken = tokens[index - 1]\n let size = tokenItemHeight\n\n // Pinned tokens (always shown, even in all networks mode)\n if (currentToken.pinned && index === 0) {\n size += 24\n }\n if (previousToken?.pinned && !currentToken.pinned) {\n size += 32\n }\n\n if (!showCategories) {\n return size\n }\n\n if (currentToken.featured && !currentToken.pinned && index === 0) {\n size += 24\n }\n\n // Category transition (excluding pinned tokens)\n const isNotPinned = !currentToken.pinned && !previousToken?.pinned\n if (\n isNotPinned &&\n ((previousToken?.amount && !currentToken.amount) \|\|\n (previousToken?.featured && !currentToken.featured) \|\|\n (previousToken?.popular && !currentToken.popular))\n ) {\n size += 32\n }\n\n return size\n },\n [tokens, showCategories]\n )\n\n const virtualizerConfig = useMemo(\n () => ({\n count: tokens.length,\n overscan: 5,\n getScrollElement: () => scrollElementRef.current,\n estimateSize,\n getItemKey,\n paddingEnd: 8,\n }),\n [tokens.length, estimateSize, getItemKey, scrollElementRef]\n )\n\n const { getVirtualItems, getTotalSize, scrollToIndex, measure } =\n useVirtualizer(virtualizerConfig)\n\n // Address the issue of disappearing tokens on rerender\n useEffect(() => {\n if (scrollElementRef.current) {\n measure()\n }\n }, [measure, scrollElementRef.current])\n\n // biome-ignore lint/correctness/useExhaustiveDependencies: run only when chainId changes\n useEffect(() => {\n // Scroll to the top of the list when switching the chains\n if (getVirtualItems().length) {\n scrollToIndex(0, { align: 'start' })\n }\n // Close the token details sheet when switching the chains\n tokenDetailsSheetRef.current?.close()\n }, [scrollToIndex, isAllNetworks, chainId, getVirtualItems])\n\n return (\n <>\n <List\n className=\"long-list\"\n style={{ height: getTotalSize() }}\n disablePadding\n >\n {getVirtualItems().map((item) => {\n const currentToken = tokens[item.index]\n const previousToken: TokenAmount \| undefined = tokens[item.index - 1]\n const chain = chainsSet?.get(currentToken.chainId)\n\n const isNotPinned = !currentToken.pinned\n const isFirstPinnedToken = currentToken.pinned && item.index === 0\n const isTransitionFromPinned = previousToken?.pinned && isNotPinned\n\n // Category transitions (excluding pinned)\n const isTransitionFromFeatured =\n previousToken?.featured && !currentToken.featured && isNotPinned\n const isTransitionFromMyTokens =\n previousToken?.amount && !currentToken.amount && isNotPinned\n const isTransitionFromPopular =\n previousToken?.popular && !currentToken.popular && isNotPinned\n\n // Determine which category label to show\n const startAdornmentLabel = (() => {\n if (showPinnedTokens && isFirstPinnedToken) {\n return t('main.pinnedTokens')\n }\n if (showPinnedTokens && !showCategories && isTransitionFromPinned) {\n return t('main.allTokens')\n }\n if (!showCategories) {\n return null\n }\n\n if (\n (isTransitionFromPinned && currentToken.featured) \|\|\n (currentToken.featured && isNotPinned && item.index === 0)\n ) {\n return t('main.featuredTokens')\n }\n if (\n (isTransitionFromFeatured \|\| isTransitionFromPinned) &&\n currentToken.amount &&\n isNotPinned\n ) {\n return t('main.myTokens')\n }\n if (\n (isTransitionFromFeatured \|\|\n isTransitionFromMyTokens \|\|\n isTransitionFromPinned) &&\n currentToken.popular &&\n isNotPinned\n ) {\n return t('main.popularTokens')\n }\n if (\n isTransitionFromMyTokens \|\|\n isTransitionFromFeatured \|\|\n isTransitionFromPinned \|\|\n isTransitionFromPopular\n ) {\n return t('main.allTokens')\n }\n return null\n })()\n\n const isSelected =\n selectedTokenAddress === currentToken.address &&\n chainId === currentToken.chainId\n\n return (\n <TokenListItem\n key={item.key}\n onClick={onClick}\n size={item.size}\n start={item.start}\n token={currentToken}\n chain={isAllNetworks ? chain : undefined}\n selected={isSelected}\n onShowTokenDetails={onShowTokenDetails}\n isBalanceLoading={isBalanceLoading}\n startAdornment={\n startAdornmentLabel ? (\n <Typography\n sx={{\n fontSize: 14,\n fontWeight: 600,\n lineHeight: '16px',\n px: 1.5,\n pt:\n isFirstPinnedToken \|\|\n (currentToken.featured &&\n isNotPinned &&\n item.index === 0)\n ? 0\n : 1,\n pb: 1,\n }}\n >\n {startAdornmentLabel}\n </Typography>\n ) : null\n }\n />\n )\n })}\n </List>\n <TokenDetailsSheet ref={tokenDetailsSheetRef} />\n {isLoading && (\n <List disablePadding sx={{ cursor: 'default' }}>\n {Array.from({ length: 3 }).map((_, index) => (\n <TokenListItemSkeleton key={index} />\n ))}\n </List>\n )}\n </>\n )\n}\n"],"mappings":";;;;;;;;;;AAeA,MAAM,kBAAkB;AAExB,MAAa,wBAAuD,EAClE,QACA,kBACA,SACA,sBACA,WACA,kBACA,gBACA,kBACA,SACA,oBACI;CACJ,MAAM,EAAE,MAAM,eAAe;CAE7B,MAAM,EAAE,WAAW,mBAAmB;CAGtC,MAAM,YAAY,cAAc;EAC9B,IAAI,CAAC,QACH;EAEF,OAAO,IAAI,IAAI,OAAO,KAAK,UAAU,CAAC,MAAM,IAAI,KAAK,CAAC,CAAC;CACzD,GAAG,CAAC,MAAM,CAAC;CAEX,MAAM,uBAAuB,OAA8B,IAAI;CAE/D,MAAM,qBAAqB,aACxB,cAAsB,mBAA4B,YAAoB;EACrE,qBAAqB,SAAS,KAC5B,cACA,mBACA,OACF;CACF,GACA,CAAC,CACH;CAEA,MAAM,aAAa,aAChB,UAAkB;EACjB,MAAM,QAAQ,OAAO;EACrB,OAAO,GAAG,MAAM,QAAQ,GAAG,MAAM,QAAQ,GAAG;CAC9C,GACA,CAAC,MAAM,CACT;CAEA,MAAM,eAAe,aAClB,UAAkB;EACjB,MAAM,eAAe,OAAO;EAC5B,MAAM,gBAAgB,OAAO,QAAQ;EACrC,IAAI,OAAO;EAGX,IAAI,aAAa,UAAU,UAAU,GACnC,QAAQ;EAEV,IAAI,eAAe,UAAU,CAAC,aAAa,QACzC,QAAQ;EAGV,IAAI,CAAC,gBACH,OAAO;EAGT,IAAI,aAAa,YAAY,CAAC,aAAa,UAAU,UAAU,GAC7D,QAAQ;EAKV,IADoB,CAAC,aAAa,UAAU,CAAC,eAAe,WAGxD,eAAe,UAAU,CAAC,aAAa,UACtC,eAAe,YAAY,CAAC,aAAa,YACzC,eAAe,WAAW,CAAC,aAAa,UAE3C,QAAQ;EAGV,OAAO;CACT,GACA,CAAC,QAAQ,cAAc,CACzB;CAcA,MAAM,EAAE,iBAAiB,cAAc,eAAe,YACpD,eAbwB,eACjB;EACL,OAAO,OAAO;EACd,UAAU;EACV,wBAAwB,iBAAiB;EACzC;EACA;EACA,YAAY;CACd,IACA;EAAC,OAAO;EAAQ;EAAc;EAAY;CAAgB,CAI3B,CAAC;CAGlC,gBAAgB;EACd,IAAI,iBAAiB,SACnB,QAAQ;CAEZ,GAAG,CAAC,SAAS,iBAAiB,OAAO,CAAC;CAGtC,gBAAgB;EAEd,IAAI,gBAAgB,CAAC,CAAC,QACpB,cAAc,GAAG,EAAE,OAAO,QAAQ,CAAC;EAGrC,qBAAqB,SAAS,MAAM;CACtC,GAAG;EAAC;EAAe;EAAe;EAAS;CAAe,CAAC;CAE3D,OACE,qBAAA,YAAA,EAAA,UAAA;EACE,oBAACA,QAAD;GACE,WAAU;GACV,OAAO,EAAE,QAAQ,aAAa,EAAE;GAChC,gBAAA;aAEC,gBAAgB,CAAC,CAAC,KAAK,SAAS;IAC/B,MAAM,eAAe,OAAO,KAAK;IACjC,MAAM,gBAAyC,OAAO,KAAK,QAAQ;IACnE,MAAM,QAAQ,WAAW,IAAI,aAAa,OAAO;IAEjD,MAAM,cAAc,CAAC,aAAa;IAClC,MAAM,qBAAqB,aAAa,UAAU,KAAK,UAAU;IACjE,MAAM,yBAAyB,eAAe,UAAU;IAGxD,MAAM,2BACJ,eAAe,YAAY,CAAC,aAAa,YAAY;IACvD,MAAM,2BACJ,eAAe,UAAU,CAAC,aAAa,UAAU;IACnD,MAAM,0BACJ,eAAe,WAAW,CAAC,aAAa,WAAW;IAGrD,MAAM,6BAA6B;KACjC,IAAI,oBAAoB,oBACtB,OAAO,EAAE,mBAAmB;KAE9B,IAAI,oBAAoB,CAAC,kBAAkB,wBACzC,OAAO,EAAE,gBAAgB;KAE3B,IAAI,CAAC,gBACH,OAAO;KAGT,IACG,0BAA0B,aAAa,YACvC,aAAa,YAAY,eAAe,KAAK,UAAU,GAExD,OAAO,EAAE,qBAAqB;KAEhC,KACG,4BAA4B,2BAC7B,aAAa,UACb,aAEA,OAAO,EAAE,eAAe;KAE1B,KACG,4BACC,4BACA,2BACF,aAAa,WACb,aAEA,OAAO,EAAE,oBAAoB;KAE/B,IACE,4BACA,4BACA,0BACA,yBAEA,OAAO,EAAE,gBAAgB;KAE3B,OAAO;IACT,EAAA,CAAG;IAEH,MAAM,aACJ,yBAAyB,aAAa,WACtC,YAAY,aAAa;IAE3B,OACE,oBAAC,eAAD;KAEW;KACT,MAAM,KAAK;KACX,OAAO,KAAK;KACZ,OAAO;KACP,OAAO,gBAAgB,QAAQ,KAAA;KAC/B,UAAU;KACU;KACF;KAClB,gBACE,sBACE,oBAAC,YAAD;MACE,IAAI;OACF,UAAU;OACV,YAAY;OACZ,YAAY;OACZ,IAAI;OACJ,IACE,sBACC,aAAa,YACZ,eACA,KAAK,UAAU,IACb,IACA;OACN,IAAI;MACN;gBAEC;KACS,CAAA,IACV;IAEP,GA/BM,KAAK,GA+BX;GAEL,CAAC;EACG,CAAA;EACN,oBAAC,mBAAD,EAAmB,KAAK,qBAAuB,CAAA;EAC9C,aACC,oBAACA,QAAD;GAAM,gBAAA;GAAe,IAAI,EAAE,QAAQ,UAAU;aAC1C,MAAM,KAAK,EAAE,QAAQ,EAAE,CAAC,CAAC,CAAC,KAAK,GAAG,UACjC,oBAAC,uBAAD,CAAoC,GAAR,KAAQ,CACrC;EACG,CAAA;CAER,EAAA,CAAA;AAEN"}

package/dist/esm/components/TokenList/useTokenSelect.js CHANGED Viewed

@@ -1,8 +1,8 @@
 import { useWidgetEvents } from "../../hooks/useWidgetEvents.js";
 import "../../types/events.js";
-import { useWidgetConfig } from "../../providers/WidgetProvider/WidgetProvider.js";
-import { useSplitModeStore } from "../../stores/settings/useSplitModeStore.js";
 import { isItemAllowed } from "../../utils/item.js";
+import { useWidgetConfig } from "../../providers/WidgetProvider/WidgetProvider.js";
+import { useSplitMode } from "../../stores/navigationTabs/useNavigationTabsStore.js";
 import { useFieldActions } from "../../stores/form/useFieldActions.js";
 import { useChainOrderStore } from "../../stores/chains/ChainOrderStore.js";
 import { FormKeyHelper } from "../../stores/form/types.js";
@@ -11,7 +11,7 @@ import { useCallback } from "react";
 //#region src/components/TokenList/useTokenSelect.ts
 const useTokenSelect = (formType, onClick) => {
 	const { mode, disabledUI, chains: chainsConfig } = useWidgetConfig();
-	const splitMode = useSplitModeStore((store) => store.state);
+	const splitMode = useSplitMode();
 	const emitter = useWidgetEvents();
 	const { setFieldValue, getFieldValues } = useFieldActions();
 	const autoPopulateToAddress = useToAddressAutoPopulate();

package/dist/esm/components/TokenList/useTokenSelect.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useTokenSelect.js","names":[],"sources":["../../../../src/components/TokenList/useTokenSelect.ts"],"sourcesContent":["import { useCallback } from 'react'\nimport { useToAddressAutoPopulate } from '../../hooks/useToAddressAutoPopulate.js'\nimport { useWidgetEvents } from '../../hooks/useWidgetEvents.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { useChainOrderStore } from '../../stores/chains/ChainOrderStore.js'\nimport type { FormType } from '../../stores/form/types.js'\nimport { FormKeyHelper } from '../../stores/form/types.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport { ~~useSplitModeStore~~ } from '../../stores/~~settings~~/~~useSplitModeStore~~.js'\nimport { WidgetEvent } from '../../types/events.js'\nimport type { DisabledUIConfig } from '../../types/widget.js'\nimport { isItemAllowed } from '../../utils/item.js'\n\nexport const useTokenSelect = (\n formType: FormType,\n onClick?: () => void\n): ((tokenAddress: string, chainId?: number) => void) => {\n const { mode, disabledUI, chains: chainsConfig } = useWidgetConfig()\n const splitMode = ~~useSplitModeStore~~(~~(store~~) ~~=> store.state)~~\n const emitter = useWidgetEvents()\n const { setFieldValue, getFieldValues } = useFieldActions()\n const autoPopulateToAddress = useToAddressAutoPopulate()\n const [setChain, setIsAllNetworks] = useChainOrderStore((state) => [\n state.setChain,\n state.setIsAllNetworks,\n ])\n\n const tokenKey = FormKeyHelper.getTokenKey(formType)\n\n return useCallback(\n (tokenAddress: string, chainId?: number) => {\n setFieldValue(tokenKey, tokenAddress, { isDirty: true, isTouched: true })\n const selectedChainId =\n chainId ?? getFieldValues(FormKeyHelper.getChainKey(formType))[0]\n // Set chain again to trigger URL builder update\n setFieldValue(FormKeyHelper.getChainKey(formType), selectedChainId, {\n isDirty: true,\n isTouched: true,\n })\n const amountKey = FormKeyHelper.getAmountKey(formType)\n if (!disabledUI?.[amountKey as keyof DisabledUIConfig]) {\n setFieldValue(amountKey, '')\n }\n const oppositeFormType = formType === 'from' ? 'to' : 'from'\n const [\n selectedOppositeTokenAddress,\n selectedOppositeChainId,\n selectedToAddress,\n ] = getFieldValues(\n FormKeyHelper.getTokenKey(oppositeFormType),\n FormKeyHelper.getChainKey(oppositeFormType),\n 'toAddress'\n )\n\n // TODO: remove when we enable same chain/token transfers\n const isSameTokenTransfer =\n selectedOppositeTokenAddress === tokenAddress &&\n selectedOppositeChainId === selectedChainId\n\n const isBridgeToSameChain =\n mode === 'split' &&\n splitMode === 'bridge' &&\n selectedOppositeChainId === selectedChainId\n\n if ((isSameTokenTransfer \|\| isBridgeToSameChain) && mode !== 'custom') {\n setFieldValue(FormKeyHelper.getTokenKey(oppositeFormType), '', {\n isDirty: true,\n isTouched: true,\n })\n }\n\n // If no opposite token is selected, synchronize the opposite chain\n // to match the currently selected chain (if allowed).\n // In default exchange mode, also collapse \"All Networks\" on the opposite\n // side - same-chain swap is the most common action.\n if (\n !selectedOppositeTokenAddress &&\n selectedChainId &&\n isItemAllowed(selectedChainId, chainsConfig?.[oppositeFormType])\n ) {\n const isDefaultExchange = !mode \|\| mode === 'default'\n if (isDefaultExchange) {\n setIsAllNetworks(false, oppositeFormType)\n }\n setFieldValue(\n FormKeyHelper.getChainKey(oppositeFormType),\n selectedChainId,\n {\n isDirty: true,\n isTouched: true,\n }\n )\n setChain(selectedChainId, oppositeFormType)\n }\n\n // Automatically populate toAddress field if bridging across ecosystems and compatible wallet is connected\n autoPopulateToAddress({\n formType,\n selectedToAddress,\n selectedChainId,\n selectedOppositeChainId,\n selectedOppositeTokenAddress,\n })\n\n const eventToEmit =\n formType === 'from'\n ? WidgetEvent.SourceChainTokenSelected\n : WidgetEvent.DestinationChainTokenSelected\n\n if (selectedChainId) {\n emitter.emit(eventToEmit, {\n chainId: selectedChainId,\n tokenAddress,\n })\n }\n\n onClick?.()\n },\n [\n autoPopulateToAddress,\n disabledUI,\n emitter,\n formType,\n getFieldValues,\n onClick,\n setChain,\n setIsAllNetworks,\n setFieldValue,\n mode,\n splitMode,\n tokenKey,\n chainsConfig,\n ]\n )\n}\n"],"mappings":";;;;;;;;;;;AAaA,MAAa,kBACX,UACA,YACuD;CACvD,MAAM,EAAE,MAAM,YAAY,QAAQ,iBAAiB,gBAAgB;CACnE,MAAM,YAAY,~~mBAAmB,UAAU,MAAM,KAAK~~;~~CAC1D~~,MAAM,UAAU,gBAAgB;CAChC,MAAM,EAAE,eAAe,mBAAmB,gBAAgB;CAC1D,MAAM,wBAAwB,yBAAyB;CACvD,MAAM,CAAC,UAAU,oBAAoB,oBAAoB,UAAU,CACjE,MAAM,UACN,MAAM,gBACR,CAAC;CAED,MAAM,WAAW,cAAc,YAAY,QAAQ;CAEnD,OAAO,aACJ,cAAsB,YAAqB;EAC1C,cAAc,UAAU,cAAc;GAAE,SAAS;GAAM,WAAW;EAAK,CAAC;EACxE,MAAM,kBACJ,WAAW,eAAe,cAAc,YAAY,QAAQ,CAAC,~~EAAE~~;EAEjE,cAAc,cAAc,YAAY,QAAQ,GAAG,iBAAiB;GAClE,SAAS;GACT,WAAW;EACb,CAAC;EACD,MAAM,YAAY,cAAc,aAAa,QAAQ;EACrD,IAAI,CAAC,aAAa,YAChB,cAAc,WAAW,EAAE;EAE7B,MAAM,mBAAmB,aAAa,SAAS,OAAO;EACtD,MAAM,CACJ,8BACA,yBACA,qBACE,eACF,cAAc,YAAY,gBAAgB,GAC1C,cAAc,YAAY,gBAAgB,GAC1C,WACF;EAYA,KARE,iCAAiC,gBACjC,4BAA4B,mBAG5B,SAAS,WACT,cAAc,YACd,4BAA4B,oBAEsB,SAAS,UAC3D,cAAc,cAAc,YAAY,gBAAgB,GAAG,IAAI;GAC7D,SAAS;GACT,WAAW;EACb,CAAC;EAOH,IACE,CAAC,gCACD,mBACA,cAAc,iBAAiB,eAAe,iBAAiB,GAC/D;GAEA,IAD0B,CAAC,QAAQ,SAAS,WAE1C,iBAAiB,OAAO,gBAAgB;GAE1C,cACE,cAAc,YAAY,gBAAgB,GAC1C,iBACA;IACE,SAAS;IACT,WAAW;GACb,CACF;GACA,SAAS,iBAAiB,gBAAgB;EAC5C;EAGA,sBAAsB;GACpB;GACA;GACA;GACA;GACA;EACF,CAAC;EAED,MAAM,cACJ,aAAa,SAAA,6BAAA;EAIf,IAAI,iBACF,QAAQ,KAAK,aAAa;GACxB,SAAS;GACT;EACF,CAAC;EAGH,UAAU;CACZ,GACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CACF;AACF"}
1	+ {"version":3,"file":"useTokenSelect.js","names":[],"sources":["../../../../src/components/TokenList/useTokenSelect.ts"],"sourcesContent":["import { useCallback } from 'react'\nimport { useToAddressAutoPopulate } from '../../hooks/useToAddressAutoPopulate.js'\nimport { useWidgetEvents } from '../../hooks/useWidgetEvents.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { useChainOrderStore } from '../../stores/chains/ChainOrderStore.js'\nimport type { FormType } from '../../stores/form/types.js'\nimport { FormKeyHelper } from '../../stores/form/types.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport { useSplitMode } from '../../stores/navigationTabs/useNavigationTabsStore.js'\nimport { WidgetEvent } from '../../types/events.js'\nimport type { DisabledUIConfig } from '../../types/widget.js'\nimport { isItemAllowed } from '../../utils/item.js'\n\nexport const useTokenSelect = (\n formType: FormType,\n onClick?: () => void\n): ((tokenAddress: string, chainId?: number) => void) => {\n const { mode, disabledUI, chains: chainsConfig } = useWidgetConfig()\n const splitMode = useSplitMode()\n const emitter = useWidgetEvents()\n const { setFieldValue, getFieldValues } = useFieldActions()\n const autoPopulateToAddress = useToAddressAutoPopulate()\n const [setChain, setIsAllNetworks] = useChainOrderStore((state) => [\n state.setChain,\n state.setIsAllNetworks,\n ])\n\n const tokenKey = FormKeyHelper.getTokenKey(formType)\n\n return useCallback(\n (tokenAddress: string, chainId?: number) => {\n setFieldValue(tokenKey, tokenAddress, { isDirty: true, isTouched: true })\n const selectedChainId =\n chainId ?? getFieldValues(FormKeyHelper.getChainKey(formType))[0]\n // Set chain again to trigger URL builder update\n setFieldValue(FormKeyHelper.getChainKey(formType), selectedChainId, {\n isDirty: true,\n isTouched: true,\n })\n const amountKey = FormKeyHelper.getAmountKey(formType)\n if (!disabledUI?.[amountKey as keyof DisabledUIConfig]) {\n setFieldValue(amountKey, '')\n }\n const oppositeFormType = formType === 'from' ? 'to' : 'from'\n const [\n selectedOppositeTokenAddress,\n selectedOppositeChainId,\n selectedToAddress,\n ] = getFieldValues(\n FormKeyHelper.getTokenKey(oppositeFormType),\n FormKeyHelper.getChainKey(oppositeFormType),\n 'toAddress'\n )\n\n // TODO: remove when we enable same chain/token transfers\n const isSameTokenTransfer =\n selectedOppositeTokenAddress === tokenAddress &&\n selectedOppositeChainId === selectedChainId\n\n const isBridgeToSameChain =\n mode === 'split' &&\n splitMode === 'bridge' &&\n selectedOppositeChainId === selectedChainId\n\n if ((isSameTokenTransfer \|\| isBridgeToSameChain) && mode !== 'custom') {\n setFieldValue(FormKeyHelper.getTokenKey(oppositeFormType), '', {\n isDirty: true,\n isTouched: true,\n })\n }\n\n // If no opposite token is selected, synchronize the opposite chain\n // to match the currently selected chain (if allowed).\n // In default exchange mode, also collapse \"All Networks\" on the opposite\n // side - same-chain swap is the most common action.\n if (\n !selectedOppositeTokenAddress &&\n selectedChainId &&\n isItemAllowed(selectedChainId, chainsConfig?.[oppositeFormType])\n ) {\n const isDefaultExchange = !mode \|\| mode === 'default'\n if (isDefaultExchange) {\n setIsAllNetworks(false, oppositeFormType)\n }\n setFieldValue(\n FormKeyHelper.getChainKey(oppositeFormType),\n selectedChainId,\n {\n isDirty: true,\n isTouched: true,\n }\n )\n setChain(selectedChainId, oppositeFormType)\n }\n\n // Automatically populate toAddress field if bridging across ecosystems and compatible wallet is connected\n autoPopulateToAddress({\n formType,\n selectedToAddress,\n selectedChainId,\n selectedOppositeChainId,\n selectedOppositeTokenAddress,\n })\n\n const eventToEmit =\n formType === 'from'\n ? WidgetEvent.SourceChainTokenSelected\n : WidgetEvent.DestinationChainTokenSelected\n\n if (selectedChainId) {\n emitter.emit(eventToEmit, {\n chainId: selectedChainId,\n tokenAddress,\n })\n }\n\n onClick?.()\n },\n [\n autoPopulateToAddress,\n disabledUI,\n emitter,\n formType,\n getFieldValues,\n onClick,\n setChain,\n setIsAllNetworks,\n setFieldValue,\n mode,\n splitMode,\n tokenKey,\n chainsConfig,\n ]\n )\n}\n"],"mappings":";;;;;;;;;;;AAaA,MAAa,kBACX,UACA,YACuD;CACvD,MAAM,EAAE,MAAM,YAAY,QAAQ,iBAAiB,gBAAgB;CACnE,MAAM,YAAY,aAAa;CAC/B,MAAM,UAAU,gBAAgB;CAChC,MAAM,EAAE,eAAe,mBAAmB,gBAAgB;CAC1D,MAAM,wBAAwB,yBAAyB;CACvD,MAAM,CAAC,UAAU,oBAAoB,oBAAoB,UAAU,CACjE,MAAM,UACN,MAAM,gBACR,CAAC;CAED,MAAM,WAAW,cAAc,YAAY,QAAQ;CAEnD,OAAO,aACJ,cAAsB,YAAqB;EAC1C,cAAc,UAAU,cAAc;GAAE,SAAS;GAAM,WAAW;EAAK,CAAC;EACxE,MAAM,kBACJ,WAAW,eAAe,cAAc,YAAY,QAAQ,CAAC,CAAC,CAAC;EAEjE,cAAc,cAAc,YAAY,QAAQ,GAAG,iBAAiB;GAClE,SAAS;GACT,WAAW;EACb,CAAC;EACD,MAAM,YAAY,cAAc,aAAa,QAAQ;EACrD,IAAI,CAAC,aAAa,YAChB,cAAc,WAAW,EAAE;EAE7B,MAAM,mBAAmB,aAAa,SAAS,OAAO;EACtD,MAAM,CACJ,8BACA,yBACA,qBACE,eACF,cAAc,YAAY,gBAAgB,GAC1C,cAAc,YAAY,gBAAgB,GAC1C,WACF;EAYA,KARE,iCAAiC,gBACjC,4BAA4B,mBAG5B,SAAS,WACT,cAAc,YACd,4BAA4B,oBAEsB,SAAS,UAC3D,cAAc,cAAc,YAAY,gBAAgB,GAAG,IAAI;GAC7D,SAAS;GACT,WAAW;EACb,CAAC;EAOH,IACE,CAAC,gCACD,mBACA,cAAc,iBAAiB,eAAe,iBAAiB,GAC/D;GAEA,IAD0B,CAAC,QAAQ,SAAS,WAE1C,iBAAiB,OAAO,gBAAgB;GAE1C,cACE,cAAc,YAAY,gBAAgB,GAC1C,iBACA;IACE,SAAS;IACT,WAAW;GACb,CACF;GACA,SAAS,iBAAiB,gBAAgB;EAC5C;EAGA,sBAAsB;GACpB;GACA;GACA;GACA;GACA;EACF,CAAC;EAED,MAAM,cACJ,aAAa,SAAA,6BAAA;EAIf,IAAI,iBACF,QAAQ,KAAK,aAAa;GACxB,SAAS;GACT;EACF,CAAC;EAGH,UAAU;CACZ,GACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CACF;AACF"}

package/dist/esm/components/TokenRate/TokenRate.style.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TokenRate.style.js","names":[],"sources":["../../../../src/components/TokenRate/TokenRate.style.ts"],"sourcesContent":["import { styled, Typography } from '@mui/material'\nimport type React from 'react'\n\nexport const TokenRateTypography: React.FC<\n React.ComponentProps<typeof Typography>\n> = styled(Typography)(({ theme }) => ({\n fontSize: 14,\n lineHeight: 1.429,\n fontWeight: 500,\n color: theme.vars.palette.text.primary,\n cursor: 'pointer',\n '&:hover': {\n opacity: 1,\n },\n opacity: 0.56,\n transition: theme.transitions.create(['opacity'], {\n duration: theme.transitions.duration.enteringScreen,\n easing: theme.transitions.easing.easeOut,\n }),\n}))\n"],"mappings":";;AAGA,MAAa,sBAET,OAAO,UAAU,~~GAAG~~,EAAE,aAAa;CACrC,UAAU;CACV,YAAY;CACZ,YAAY;CACZ,OAAO,MAAM,KAAK,QAAQ,KAAK;CAC/B,QAAQ;CACR,WAAW,EACT,SAAS,EACX;CACA,SAAS;CACT,YAAY,MAAM,YAAY,OAAO,CAAC,SAAS,GAAG;EAChD,UAAU,MAAM,YAAY,SAAS;EACrC,QAAQ,MAAM,YAAY,OAAO;CACnC,CAAC;AACH,EAAE"}
1	+ {"version":3,"file":"TokenRate.style.js","names":[],"sources":["../../../../src/components/TokenRate/TokenRate.style.ts"],"sourcesContent":["import { styled, Typography } from '@mui/material'\nimport type React from 'react'\n\nexport const TokenRateTypography: React.FC<\n React.ComponentProps<typeof Typography>\n> = styled(Typography)(({ theme }) => ({\n fontSize: 14,\n lineHeight: 1.429,\n fontWeight: 500,\n color: theme.vars.palette.text.primary,\n cursor: 'pointer',\n '&:hover': {\n opacity: 1,\n },\n opacity: 0.56,\n transition: theme.transitions.create(['opacity'], {\n duration: theme.transitions.duration.enteringScreen,\n easing: theme.transitions.easing.easeOut,\n }),\n}))\n"],"mappings":";;AAGA,MAAa,sBAET,OAAO,UAAU,CAAC,EAAE,EAAE,aAAa;CACrC,UAAU;CACV,YAAY;CACZ,YAAY;CACZ,OAAO,MAAM,KAAK,QAAQ,KAAK;CAC/B,QAAQ;CACR,WAAW,EACT,SAAS,EACX;CACA,SAAS;CACT,YAAY,MAAM,YAAY,OAAO,CAAC,SAAS,GAAG;EAChD,UAAU,MAAM,YAAY,SAAS;EACrC,QAAQ,MAAM,YAAY,OAAO;CACnC,CAAC;AACH,EAAE"}

package/dist/esm/components/TransactionCard/ActiveTransactionCard.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ActiveTransactionCard.js","names":["Card"],"sources":["../../../../src/components/TransactionCard/ActiveTransactionCard.tsx"],"sourcesContent":["import type { RouteExtended } from '@lifi/sdk'\nimport DeleteOutline from '@mui/icons-material/DeleteOutlined'\nimport { Tooltip, Typography } from '@mui/material'\nimport type { JSX, MouseEvent } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useActionMessage } from '../../hooks/useActionMessage.js'\nimport { RouteExecutionStatus } from '../../stores/routes/types.js'\nimport { getExpiryTimestamp } from '../../utils/timer.js'\nimport { ActionRow } from '../ActionRow/ActionRow.js'\nimport { Card } from '../Card/Card.js'\nimport { IconCircle } from '../IconCircle/IconCircle.js'\nimport { RouteTokens } from '../RouteCard/RouteTokens.js'\nimport { ExecutionTimerText } from '../Timer/ExecutionTimerText.js'\nimport { CircularProgressPending } from '../Timer/StepStatusTimer.style.js'\nimport { DeleteButton, PendingCircle } from './ActiveTransactionCard.style.js'\n\ninterface ActiveTransactionCardProps {\n route: RouteExtended\n status?: RouteExecutionStatus\n onClick: () => void\n onDelete: (e: MouseEvent) => void\n}\n\nexport const ActiveTransactionCard = ({\n route,\n status,\n onClick,\n onDelete,\n}: ActiveTransactionCardProps): JSX.Element => {\n const { t } = useTranslation()\n\n const lastActiveStep = route.steps.findLast((step) => step.execution)\n const lastActiveAction = lastActiveStep?.execution?.actions?.at(-1)\n const { title } = useActionMessage(lastActiveStep, lastActiveAction)\n\n const isFailed = status === RouteExecutionStatus.Failed\n\n const statusIcon = (() => {\n if (isFailed) {\n return <IconCircle status=\"error\" size={24} />\n }\n if (\n ['ACTION_REQUIRED', 'MESSAGE_REQUIRED', 'RESET_REQUIRED'].includes(\n lastActiveAction?.status ?? ''\n )\n ) {\n return <IconCircle status=\"info\" size={24} />\n }\n return (\n <PendingCircle>\n <CircularProgressPending size={24} sx={{ top: -2, left: -2 }} />\n </PendingCircle>\n )\n })()\n\n return (\n <Card onClick={onClick} indented>\n <ActionRow\n sx={{ mb: 1.5 }}\n startAdornment={statusIcon}\n message={title ?? ''}\n endAdornment={\n isFailed ? (\n <Tooltip title={t('button.clearTransaction')}>\n <DeleteButton size=\"small\" onClick={onDelete}>\n <DeleteOutline sx={{ fontSize: 16 }} />\n </DeleteButton>\n </Tooltip>\n ) : lastActiveStep?.execution?.signedAt ? (\n <Typography sx={{ fontSize: 12, fontWeight: 600 }}>\n <ExecutionTimerText\n expiryTimestamp={getExpiryTimestamp(lastActiveStep)}\n />\n </Typography>\n ) : undefined\n }\n />\n <RouteTokens route={route} />\n </Card>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;AAuBA,MAAa,yBAAyB,EACpC,OACA,QACA,SACA,eAC6C;CAC7C,MAAM,EAAE,MAAM,eAAe;CAE7B,MAAM,iBAAiB,MAAM,MAAM,UAAU,SAAS,KAAK,SAAS;CACpE,MAAM,mBAAmB,gBAAgB,WAAW,SAAS,GAAG,EAAE;CAClE,MAAM,EAAE,UAAU,iBAAiB,gBAAgB,gBAAgB;CAEnE,MAAM,WAAW,WAAA;CAoBjB,OACE,qBAACA,QAAD;EAAe;EAAS,UAAA;YAAxB,CACE,oBAAC,WAAD;GACE,IAAI,EAAE,IAAI,IAAI;GACd,uBAtBoB;IACxB,IAAI,UACF,OAAO,oBAAC,YAAD;KAAY,QAAO;KAAQ,MAAM;IAAK,CAAA;IAE/C,IACE;KAAC;KAAmB;KAAoB;IAAgB,~~EAAE~~,SACxD,kBAAkB,UAAU,EAC9B,GAEA,OAAO,oBAAC,YAAD;KAAY,QAAO;KAAO,MAAM;IAAK,CAAA;IAE9C,OACE,oBAAC,eAAD,EAAA,UACE,oBAAC,yBAAD;KAAyB,MAAM;KAAI,IAAI;MAAE,KAAK;MAAI,MAAM;KAAG;IAAI,CAAA,EAClD,CAAA;GAEnB,~~GAM~~+B;GACzB,SAAS,SAAS;GAClB,cACE,WACE,oBAAC,SAAD;IAAS,OAAO,EAAE,yBAAyB;cACzC,oBAAC,cAAD;KAAc,MAAK;KAAQ,SAAS;eAClC,oBAAC,eAAD,EAAe,IAAI,EAAE,UAAU,GAAG,EAAI,CAAA;IAC1B,CAAA;GACP,CAAA,IACP,gBAAgB,WAAW,WAC7B,oBAAC,YAAD;IAAY,IAAI;KAAE,UAAU;KAAI,YAAY;IAAI;cAC9C,oBAAC,oBAAD,EACE,iBAAiB,mBAAmB,cAAc,EACnD,CAAA;GACS,CAAA,IACV,KAAA;EAEP,CAAA,GACD,oBAAC,aAAD,EAAoB,MAAQ,CAAA,CACxB;;AAEV"}
1	+ {"version":3,"file":"ActiveTransactionCard.js","names":["Card"],"sources":["../../../../src/components/TransactionCard/ActiveTransactionCard.tsx"],"sourcesContent":["import type { RouteExtended } from '@lifi/sdk'\nimport DeleteOutline from '@mui/icons-material/DeleteOutlined'\nimport { Tooltip, Typography } from '@mui/material'\nimport type { JSX, MouseEvent } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useActionMessage } from '../../hooks/useActionMessage.js'\nimport { RouteExecutionStatus } from '../../stores/routes/types.js'\nimport { getExpiryTimestamp } from '../../utils/timer.js'\nimport { ActionRow } from '../ActionRow/ActionRow.js'\nimport { Card } from '../Card/Card.js'\nimport { IconCircle } from '../IconCircle/IconCircle.js'\nimport { RouteTokens } from '../RouteCard/RouteTokens.js'\nimport { ExecutionTimerText } from '../Timer/ExecutionTimerText.js'\nimport { CircularProgressPending } from '../Timer/StepStatusTimer.style.js'\nimport { DeleteButton, PendingCircle } from './ActiveTransactionCard.style.js'\n\ninterface ActiveTransactionCardProps {\n route: RouteExtended\n status?: RouteExecutionStatus\n onClick: () => void\n onDelete: (e: MouseEvent) => void\n}\n\nexport const ActiveTransactionCard = ({\n route,\n status,\n onClick,\n onDelete,\n}: ActiveTransactionCardProps): JSX.Element => {\n const { t } = useTranslation()\n\n const lastActiveStep = route.steps.findLast((step) => step.execution)\n const lastActiveAction = lastActiveStep?.execution?.actions?.at(-1)\n const { title } = useActionMessage(lastActiveStep, lastActiveAction)\n\n const isFailed = status === RouteExecutionStatus.Failed\n\n const statusIcon = (() => {\n if (isFailed) {\n return <IconCircle status=\"error\" size={24} />\n }\n if (\n ['ACTION_REQUIRED', 'MESSAGE_REQUIRED', 'RESET_REQUIRED'].includes(\n lastActiveAction?.status ?? ''\n )\n ) {\n return <IconCircle status=\"info\" size={24} />\n }\n return (\n <PendingCircle>\n <CircularProgressPending size={24} sx={{ top: -2, left: -2 }} />\n </PendingCircle>\n )\n })()\n\n return (\n <Card onClick={onClick} indented>\n <ActionRow\n sx={{ mb: 1.5 }}\n startAdornment={statusIcon}\n message={title ?? ''}\n endAdornment={\n isFailed ? (\n <Tooltip title={t('button.clearTransaction')}>\n <DeleteButton size=\"small\" onClick={onDelete}>\n <DeleteOutline sx={{ fontSize: 16 }} />\n </DeleteButton>\n </Tooltip>\n ) : lastActiveStep?.execution?.signedAt ? (\n <Typography sx={{ fontSize: 12, fontWeight: 600 }}>\n <ExecutionTimerText\n expiryTimestamp={getExpiryTimestamp(lastActiveStep)}\n />\n </Typography>\n ) : undefined\n }\n />\n <RouteTokens route={route} />\n </Card>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;AAuBA,MAAa,yBAAyB,EACpC,OACA,QACA,SACA,eAC6C;CAC7C,MAAM,EAAE,MAAM,eAAe;CAE7B,MAAM,iBAAiB,MAAM,MAAM,UAAU,SAAS,KAAK,SAAS;CACpE,MAAM,mBAAmB,gBAAgB,WAAW,SAAS,GAAG,EAAE;CAClE,MAAM,EAAE,UAAU,iBAAiB,gBAAgB,gBAAgB;CAEnE,MAAM,WAAW,WAAA;CAoBjB,OACE,qBAACA,QAAD;EAAe;EAAS,UAAA;YAAxB,CACE,oBAAC,WAAD;GACE,IAAI,EAAE,IAAI,IAAI;GACd,uBAtBoB;IACxB,IAAI,UACF,OAAO,oBAAC,YAAD;KAAY,QAAO;KAAQ,MAAM;IAAK,CAAA;IAE/C,IACE;KAAC;KAAmB;KAAoB;IAAgB,CAAC,CAAC,SACxD,kBAAkB,UAAU,EAC9B,GAEA,OAAO,oBAAC,YAAD;KAAY,QAAO;KAAO,MAAM;IAAK,CAAA;IAE9C,OACE,oBAAC,eAAD,EAAA,UACE,oBAAC,yBAAD;KAAyB,MAAM;KAAI,IAAI;MAAE,KAAK;MAAI,MAAM;KAAG;IAAI,CAAA,EAClD,CAAA;GAEnB,EAAA,CAM+B;GACzB,SAAS,SAAS;GAClB,cACE,WACE,oBAAC,SAAD;IAAS,OAAO,EAAE,yBAAyB;cACzC,oBAAC,cAAD;KAAc,MAAK;KAAQ,SAAS;eAClC,oBAAC,eAAD,EAAe,IAAI,EAAE,UAAU,GAAG,EAAI,CAAA;IAC1B,CAAA;GACP,CAAA,IACP,gBAAgB,WAAW,WAC7B,oBAAC,YAAD;IAAY,IAAI;KAAE,UAAU;KAAI,YAAY;IAAI;cAC9C,oBAAC,oBAAD,EACE,iBAAiB,mBAAmB,cAAc,EACnD,CAAA;GACS,CAAA,IACV,KAAA;EAEP,CAAA,GACD,oBAAC,aAAD,EAAoB,MAAQ,CAAA,CACxB;;AAEV"}

package/dist/esm/components/TransactionCard/ActiveTransactionCard.style.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ActiveTransactionCard.style.js","names":[],"sources":["../../../../src/components/TransactionCard/ActiveTransactionCard.style.tsx"],"sourcesContent":["import { Box, IconButton, styled } from '@mui/material'\nimport type React from 'react'\n\nexport const PendingCircle: React.FC<React.ComponentProps<typeof Box>> = styled(\n Box\n)(({ theme }) => ({\n position: 'relative',\n width: 24,\n height: 24,\n flexShrink: 0,\n borderRadius: '50%',\n border: `2px solid ${theme.vars.palette.grey[300]}`,\n ...theme.applyStyles('dark', {\n borderColor: theme.vars.palette.grey[800],\n }),\n}))\n\nexport const DeleteButton: React.FC<React.ComponentProps<typeof IconButton>> =\n styled(IconButton)(({ theme }) => ({\n padding: theme.spacing(0.5),\n backgroundColor: theme.vars.palette.background.paper,\n width: 24,\n height: 24,\n }))\n"],"mappings":";;AAGA,MAAa,gBAA4D,OACvE,GACF,~~GAAG~~,EAAE,aAAa;CAChB,UAAU;CACV,OAAO;CACP,QAAQ;CACR,YAAY;CACZ,cAAc;CACd,QAAQ,aAAa,MAAM,KAAK,QAAQ,KAAK;CAC7C,GAAG,MAAM,YAAY,QAAQ,EAC3B,aAAa,MAAM,KAAK,QAAQ,KAAK,KACvC,CAAC;AACH,EAAE;AAEF,MAAa,eACX,OAAO,UAAU,~~GAAG~~,EAAE,aAAa;CACjC,SAAS,MAAM,QAAQ,EAAG;CAC1B,iBAAiB,MAAM,KAAK,QAAQ,WAAW;CAC/C,OAAO;CACP,QAAQ;AACV,EAAE"}
1	+ {"version":3,"file":"ActiveTransactionCard.style.js","names":[],"sources":["../../../../src/components/TransactionCard/ActiveTransactionCard.style.tsx"],"sourcesContent":["import { Box, IconButton, styled } from '@mui/material'\nimport type React from 'react'\n\nexport const PendingCircle: React.FC<React.ComponentProps<typeof Box>> = styled(\n Box\n)(({ theme }) => ({\n position: 'relative',\n width: 24,\n height: 24,\n flexShrink: 0,\n borderRadius: '50%',\n border: `2px solid ${theme.vars.palette.grey[300]}`,\n ...theme.applyStyles('dark', {\n borderColor: theme.vars.palette.grey[800],\n }),\n}))\n\nexport const DeleteButton: React.FC<React.ComponentProps<typeof IconButton>> =\n styled(IconButton)(({ theme }) => ({\n padding: theme.spacing(0.5),\n backgroundColor: theme.vars.palette.background.paper,\n width: 24,\n height: 24,\n }))\n"],"mappings":";;AAGA,MAAa,gBAA4D,OACvE,GACF,CAAC,EAAE,EAAE,aAAa;CAChB,UAAU;CACV,OAAO;CACP,QAAQ;CACR,YAAY;CACZ,cAAc;CACd,QAAQ,aAAa,MAAM,KAAK,QAAQ,KAAK;CAC7C,GAAG,MAAM,YAAY,QAAQ,EAC3B,aAAa,MAAM,KAAK,QAAQ,KAAK,KACvC,CAAC;AACH,EAAE;AAEF,MAAa,eACX,OAAO,UAAU,CAAC,EAAE,EAAE,aAAa;CACjC,SAAS,MAAM,QAAQ,EAAG;CAC1B,iBAAiB,MAAM,KAAK,QAAQ,WAAW;CAC/C,OAAO;CACP,QAAQ;AACV,EAAE"}

package/dist/esm/components/TransactionCard/TransactionCard.style.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TransactionCard.style.js","names":[],"sources":["../../../../src/components/TransactionCard/TransactionCard.style.tsx"],"sourcesContent":["import { Box, styled, Typography } from '@mui/material'\nimport type React from 'react'\n\nexport const DateLabelContainer: React.FC<React.ComponentProps<typeof Box>> =\n styled(Box)({\n display: 'flex',\n justifyContent: 'space-between',\n })\n\nexport const DateLabelText: React.FC<React.ComponentProps<typeof Typography>> =\n styled(Typography)({\n fontSize: 12,\n fontWeight: 500,\n })\n"],"mappings":";;AAGA,MAAa,qBACX,OAAO,GAAG,~~EAAE~~;CACV,SAAS;CACT,gBAAgB;AAClB,CAAC;AAEH,MAAa,gBACX,OAAO,UAAU,~~EAAE~~;CACjB,UAAU;CACV,YAAY;AACd,CAAC"}
1	+ {"version":3,"file":"TransactionCard.style.js","names":[],"sources":["../../../../src/components/TransactionCard/TransactionCard.style.tsx"],"sourcesContent":["import { Box, styled, Typography } from '@mui/material'\nimport type React from 'react'\n\nexport const DateLabelContainer: React.FC<React.ComponentProps<typeof Box>> =\n styled(Box)({\n display: 'flex',\n justifyContent: 'space-between',\n })\n\nexport const DateLabelText: React.FC<React.ComponentProps<typeof Typography>> =\n styled(Typography)({\n fontSize: 12,\n fontWeight: 500,\n })\n"],"mappings":";;AAGA,MAAa,qBACX,OAAO,GAAG,CAAC,CAAC;CACV,SAAS;CACT,gBAAgB;AAClB,CAAC;AAEH,MAAa,gBACX,OAAO,UAAU,CAAC,CAAC;CACjB,UAAU;CACV,YAAY;AACd,CAAC"}

package/dist/esm/config/version.d.ts CHANGED Viewed

@@ -1,6 +1,6 @@
 //#region src/config/version.d.ts
 declare const name = "@lifi/widget";
-declare const version = "4.0.0";
+declare const version = "4.1.0";
 //#endregion
 export { name, version };
 //# sourceMappingURL=version.d.ts.map

package/dist/esm/config/version.js CHANGED Viewed

@@ -1,6 +1,6 @@
 //#region src/config/version.ts
 const name = "@lifi/widget";
-const version = "4.0.0";
+const version = "4.1.0";
 //#endregion
 export { name, version };

package/dist/esm/config/version.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"version.js","names":[],"sources":["../../../src/config/version.ts"],"sourcesContent":["export const name = '@lifi/widget'\nexport const version = '4.0.0'\n"],"mappings":";AAAA,MAAa,OAAO;AACpB,MAAa,UAAU"}
1	+ {"version":3,"file":"version.js","names":[],"sources":["../../../src/config/version.ts"],"sourcesContent":["export const name = '@lifi/widget'\nexport const version = '4.1.0'\n"],"mappings":";AAAA,MAAa,OAAO;AACpB,MAAa,UAAU"}

package/dist/esm/hooks/timer/validate.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"validate.js","names":[],"sources":["../../../../src/hooks/timer/validate.ts"],"sourcesContent":["export function validateExpiryTimestamp(expiryTimestamp: Date): boolean {\n const isValid = new Date(expiryTimestamp).getTime() > 0\n if (!isValid) {\n console.warn('useTimer Invalid expiryTimestamp settings', expiryTimestamp)\n }\n return isValid\n}\n\nexport function validateOnExpire(onExpire: () => void): boolean {\n const isValid = onExpire && typeof onExpire === 'function'\n if (onExpire && !isValid) {\n console.warn('useTimer Invalid onExpire settings function', onExpire)\n }\n return isValid\n}\n"],"mappings":";AAAA,SAAgB,wBAAwB,iBAAgC;CACtE,MAAM,UAAU,IAAI,KAAK,eAAe,~~EAAE~~,QAAQ,IAAI;CACtD,IAAI,CAAC,SACH,QAAQ,KAAK,6CAA6C,eAAe;CAE3E,OAAO;AACT;AAEA,SAAgB,iBAAiB,UAA+B;CAC9D,MAAM,UAAU,YAAY,OAAO,aAAa;CAChD,IAAI,YAAY,CAAC,SACf,QAAQ,KAAK,+CAA+C,QAAQ;CAEtE,OAAO;AACT"}
1	+ {"version":3,"file":"validate.js","names":[],"sources":["../../../../src/hooks/timer/validate.ts"],"sourcesContent":["export function validateExpiryTimestamp(expiryTimestamp: Date): boolean {\n const isValid = new Date(expiryTimestamp).getTime() > 0\n if (!isValid) {\n console.warn('useTimer Invalid expiryTimestamp settings', expiryTimestamp)\n }\n return isValid\n}\n\nexport function validateOnExpire(onExpire: () => void): boolean {\n const isValid = onExpire && typeof onExpire === 'function'\n if (onExpire && !isValid) {\n console.warn('useTimer Invalid onExpire settings function', onExpire)\n }\n return isValid\n}\n"],"mappings":";AAAA,SAAgB,wBAAwB,iBAAgC;CACtE,MAAM,UAAU,IAAI,KAAK,eAAe,CAAC,CAAC,QAAQ,IAAI;CACtD,IAAI,CAAC,SACH,QAAQ,KAAK,6CAA6C,eAAe;CAE3E,OAAO;AACT;AAEA,SAAgB,iBAAiB,UAA+B;CAC9D,MAAM,UAAU,YAAY,OAAO,aAAa;CAChD,IAAI,YAAY,CAAC,SACf,QAAQ,KAAK,+CAA+C,QAAQ;CAEtE,OAAO;AACT"}

package/dist/esm/hooks/useAccountsBalancesData.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useAccountsBalancesData.js","names":[],"sources":["../../../src/hooks/useAccountsBalancesData.ts"],"sourcesContent":["import type { ChainType, TokenExtended } from '@lifi/sdk'\nimport { useAccount } from '@lifi/wallet-management'\nimport { useMemo } from 'react'\nimport type { FormType } from '../stores/form/types.js'\nimport { useChains } from './useChains.js'\nimport { useFilteredTokensByBalance } from './useFilteredByTokenBalances.js'\n\nexport const useAccountsBalancesData = (\n selectedChainId?: number,\n formType?: FormType,\n isAllNetworks?: boolean,\n allTokens?: Record<number, TokenExtended[]>\n): {\n data: Record<string, Record<number, TokenExtended[]>> \| undefined\n isLoading: boolean\n} => {\n const { data: accountsWithTokens, isLoading: isAccountsLoading } =\n useAccountsData(selectedChainId, formType, isAllNetworks, allTokens)\n\n // Filter out EVM tokens that do not have balances\n const { data: filteredTokens, isLoading: isCachedBalancesLoading } =\n useFilteredTokensByBalance(accountsWithTokens, formType)\n\n return {\n data: filteredTokens,\n isLoading: isAccountsLoading \|\| isCachedBalancesLoading,\n }\n}\n\nconst useAccountsData = (\n selectedChainId?: number,\n formType?: FormType,\n isAllNetworks?: boolean,\n allTokens?: Record<number, TokenExtended[]>\n) => {\n const {\n chains: allChains,\n isLoading: isChainsLoading,\n getChainById,\n } = useChains(formType)\n const currentChain = useMemo(() => {\n return selectedChainId\n ? getChainById(selectedChainId, allChains)\n : undefined\n }, [selectedChainId, allChains, getChainById])\n const chains = useMemo(() => {\n return isAllNetworks ? allChains : currentChain ? [currentChain] : undefined\n }, [allChains, isAllNetworks, currentChain])\n\n const { accounts: allAccounts, account: currentAccount } = useAccount(\n isAllNetworks ? undefined : { chainType: currentChain?.chainType }\n )\n const accounts = useMemo(() => {\n return isAllNetworks\n ? allAccounts\n : currentAccount\n ? [currentAccount]\n : undefined\n }, [allAccounts, currentAccount, isAllNetworks])\n\n const accountsWithTokens = useMemo(() => {\n if (!chains \|\| !allTokens \|\| !accounts?.length) {\n return undefined\n }\n return accounts\n ?.filter((account) => account.address)\n .reduce(\n (acc, account) => {\n if (account.address) {\n const accountChains = chains?.filter(\n (chain) => account.chainType === chain?.chainType\n )\n if (accountChains) {\n const chainIdSet = new Set(accountChains.map((chain) => chain.id))\n const filteredTokens = Object.entries(allTokens).reduce(\n (tokenAcc, [chainIdStr, tokens]) => {\n const chainId = Number(chainIdStr)\n if (chainIdSet.has(chainId)) {\n tokenAcc[chainId] = tokens\n }\n return tokenAcc\n },\n {} as { [chainId: number]: TokenExtended[] }\n )\n acc[account.address] = {\n chainType: account.chainType,\n tokens: filteredTokens,\n }\n }\n }\n return acc\n },\n {} as Record<\n string,\n { chainType: ChainType; tokens: Record<number, TokenExtended[]> }\n >\n )\n }, [accounts, chains, allTokens])\n\n return {\n data: accountsWithTokens,\n isLoading: isChainsLoading,\n }\n}\n"],"mappings":";;;;;AAOA,MAAa,2BACX,iBACA,UACA,eACA,cAIG;CACH,MAAM,EAAE,MAAM,oBAAoB,WAAW,sBAC3C,gBAAgB,iBAAiB,UAAU,eAAe,SAAS;CAGrE,MAAM,EAAE,MAAM,gBAAgB,WAAW,4BACvC,2BAA2B,oBAAoB,QAAQ;CAEzD,OAAO;EACL,MAAM;EACN,WAAW,qBAAqB;CAClC;AACF;AAEA,MAAM,mBACJ,iBACA,UACA,eACA,cACG;CACH,MAAM,EACJ,QAAQ,WACR,WAAW,iBACX,iBACE,UAAU,QAAQ;CACtB,MAAM,eAAe,cAAc;EACjC,OAAO,kBACH,aAAa,iBAAiB,SAAS,IACvC,KAAA;CACN,GAAG;EAAC;EAAiB;EAAW;CAAY,CAAC;CAC7C,MAAM,SAAS,cAAc;EAC3B,OAAO,gBAAgB,YAAY,eAAe,CAAC,YAAY,IAAI,KAAA;CACrE,GAAG;EAAC;EAAW;EAAe;CAAY,CAAC;CAE3C,MAAM,EAAE,UAAU,aAAa,SAAS,mBAAmB,WACzD,gBAAgB,KAAA,IAAY,EAAE,WAAW,cAAc,UAAU,CACnE;CACA,MAAM,WAAW,cAAc;EAC7B,OAAO,gBACH,cACA,iBACE,CAAC,cAAc,IACf,KAAA;CACR,GAAG;EAAC;EAAa;EAAgB;CAAa,CAAC;CAyC/C,OAAO;EACL,MAxCyB,cAAc;GACvC,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,UAAU,QACtC;GAEF,OAAO,UACH,QAAQ,YAAY,QAAQ,OAAO,~~EACpC~~,QACE,KAAK,YAAY;IAChB,IAAI,QAAQ,SAAS;KACnB,MAAM,gBAAgB,QAAQ,QAC3B,UAAU,QAAQ,cAAc,OAAO,SAC1C;KACA,IAAI,eAAe;MACjB,MAAM,aAAa,IAAI,IAAI,cAAc,KAAK,UAAU,MAAM,EAAE,CAAC;MACjE,MAAM,iBAAiB,OAAO,QAAQ,SAAS,~~EAAE~~,QAC9C,UAAU,CAAC,YAAY,YAAY;OAClC,MAAM,UAAU,OAAO,UAAU;OACjC,IAAI,WAAW,IAAI,OAAO,GACxB,SAAS,WAAW;OAEtB,OAAO;MACT,GACA,CAAC,CACH;MACA,IAAI,QAAQ,WAAW;OACrB,WAAW,QAAQ;OACnB,QAAQ;MACV;KACF;IACF;IACA,OAAO;GACT,GACA,CAAC,CAIH;EACJ,GAAG;GAAC;GAAU;GAAQ;EAAS,CAGN;EACvB,WAAW;CACb;AACF"}
1	+ {"version":3,"file":"useAccountsBalancesData.js","names":[],"sources":["../../../src/hooks/useAccountsBalancesData.ts"],"sourcesContent":["import type { ChainType, TokenExtended } from '@lifi/sdk'\nimport { useAccount } from '@lifi/wallet-management'\nimport { useMemo } from 'react'\nimport type { FormType } from '../stores/form/types.js'\nimport { useChains } from './useChains.js'\nimport { useFilteredTokensByBalance } from './useFilteredByTokenBalances.js'\n\nexport const useAccountsBalancesData = (\n selectedChainId?: number,\n formType?: FormType,\n isAllNetworks?: boolean,\n allTokens?: Record<number, TokenExtended[]>\n): {\n data: Record<string, Record<number, TokenExtended[]>> \| undefined\n isLoading: boolean\n} => {\n const { data: accountsWithTokens, isLoading: isAccountsLoading } =\n useAccountsData(selectedChainId, formType, isAllNetworks, allTokens)\n\n // Filter out EVM tokens that do not have balances\n const { data: filteredTokens, isLoading: isCachedBalancesLoading } =\n useFilteredTokensByBalance(accountsWithTokens, formType)\n\n return {\n data: filteredTokens,\n isLoading: isAccountsLoading \|\| isCachedBalancesLoading,\n }\n}\n\nconst useAccountsData = (\n selectedChainId?: number,\n formType?: FormType,\n isAllNetworks?: boolean,\n allTokens?: Record<number, TokenExtended[]>\n) => {\n const {\n chains: allChains,\n isLoading: isChainsLoading,\n getChainById,\n } = useChains(formType)\n const currentChain = useMemo(() => {\n return selectedChainId\n ? getChainById(selectedChainId, allChains)\n : undefined\n }, [selectedChainId, allChains, getChainById])\n const chains = useMemo(() => {\n return isAllNetworks ? allChains : currentChain ? [currentChain] : undefined\n }, [allChains, isAllNetworks, currentChain])\n\n const { accounts: allAccounts, account: currentAccount } = useAccount(\n isAllNetworks ? undefined : { chainType: currentChain?.chainType }\n )\n const accounts = useMemo(() => {\n return isAllNetworks\n ? allAccounts\n : currentAccount\n ? [currentAccount]\n : undefined\n }, [allAccounts, currentAccount, isAllNetworks])\n\n const accountsWithTokens = useMemo(() => {\n if (!chains \|\| !allTokens \|\| !accounts?.length) {\n return undefined\n }\n return accounts\n ?.filter((account) => account.address)\n .reduce(\n (acc, account) => {\n if (account.address) {\n const accountChains = chains?.filter(\n (chain) => account.chainType === chain?.chainType\n )\n if (accountChains) {\n const chainIdSet = new Set(accountChains.map((chain) => chain.id))\n const filteredTokens = Object.entries(allTokens).reduce(\n (tokenAcc, [chainIdStr, tokens]) => {\n const chainId = Number(chainIdStr)\n if (chainIdSet.has(chainId)) {\n tokenAcc[chainId] = tokens\n }\n return tokenAcc\n },\n {} as { [chainId: number]: TokenExtended[] }\n )\n acc[account.address] = {\n chainType: account.chainType,\n tokens: filteredTokens,\n }\n }\n }\n return acc\n },\n {} as Record<\n string,\n { chainType: ChainType; tokens: Record<number, TokenExtended[]> }\n >\n )\n }, [accounts, chains, allTokens])\n\n return {\n data: accountsWithTokens,\n isLoading: isChainsLoading,\n }\n}\n"],"mappings":";;;;;AAOA,MAAa,2BACX,iBACA,UACA,eACA,cAIG;CACH,MAAM,EAAE,MAAM,oBAAoB,WAAW,sBAC3C,gBAAgB,iBAAiB,UAAU,eAAe,SAAS;CAGrE,MAAM,EAAE,MAAM,gBAAgB,WAAW,4BACvC,2BAA2B,oBAAoB,QAAQ;CAEzD,OAAO;EACL,MAAM;EACN,WAAW,qBAAqB;CAClC;AACF;AAEA,MAAM,mBACJ,iBACA,UACA,eACA,cACG;CACH,MAAM,EACJ,QAAQ,WACR,WAAW,iBACX,iBACE,UAAU,QAAQ;CACtB,MAAM,eAAe,cAAc;EACjC,OAAO,kBACH,aAAa,iBAAiB,SAAS,IACvC,KAAA;CACN,GAAG;EAAC;EAAiB;EAAW;CAAY,CAAC;CAC7C,MAAM,SAAS,cAAc;EAC3B,OAAO,gBAAgB,YAAY,eAAe,CAAC,YAAY,IAAI,KAAA;CACrE,GAAG;EAAC;EAAW;EAAe;CAAY,CAAC;CAE3C,MAAM,EAAE,UAAU,aAAa,SAAS,mBAAmB,WACzD,gBAAgB,KAAA,IAAY,EAAE,WAAW,cAAc,UAAU,CACnE;CACA,MAAM,WAAW,cAAc;EAC7B,OAAO,gBACH,cACA,iBACE,CAAC,cAAc,IACf,KAAA;CACR,GAAG;EAAC;EAAa;EAAgB;CAAa,CAAC;CAyC/C,OAAO;EACL,MAxCyB,cAAc;GACvC,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,UAAU,QACtC;GAEF,OAAO,UACH,QAAQ,YAAY,QAAQ,OAAO,CAAC,CACrC,QACE,KAAK,YAAY;IAChB,IAAI,QAAQ,SAAS;KACnB,MAAM,gBAAgB,QAAQ,QAC3B,UAAU,QAAQ,cAAc,OAAO,SAC1C;KACA,IAAI,eAAe;MACjB,MAAM,aAAa,IAAI,IAAI,cAAc,KAAK,UAAU,MAAM,EAAE,CAAC;MACjE,MAAM,iBAAiB,OAAO,QAAQ,SAAS,CAAC,CAAC,QAC9C,UAAU,CAAC,YAAY,YAAY;OAClC,MAAM,UAAU,OAAO,UAAU;OACjC,IAAI,WAAW,IAAI,OAAO,GACxB,SAAS,WAAW;OAEtB,OAAO;MACT,GACA,CAAC,CACH;MACA,IAAI,QAAQ,WAAW;OACrB,WAAW,QAAQ;OACnB,QAAQ;MACV;KACF;IACF;IACA,OAAO;GACT,GACA,CAAC,CAIH;EACJ,GAAG;GAAC;GAAU;GAAQ;EAAS,CAGN;EACvB,WAAW;CACb;AACF"}

package/dist/esm/hooks/useAvailableChains.js CHANGED Viewed

@@ -1,5 +1,5 @@
-import { useWidgetConfig } from "../providers/WidgetProvider/WidgetProvider.js";
 import { getConfigItemSets, isItemAllowedForSets } from "../utils/item.js";
+import { useWidgetConfig } from "../providers/WidgetProvider/WidgetProvider.js";
 import { useSDKClient } from "../providers/SDKClientProvider.js";
 import { getQueryKey } from "../utils/queries.js";
 import { ChainType, createClient, getChains } from "@lifi/sdk";

package/dist/esm/hooks/useChainSearch.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useChainSearch.js","names":[],"sources":["../../../src/hooks/useChainSearch.ts"],"sourcesContent":["import type { ExtendedChain } from '@lifi/sdk'\nimport { debounce } from '@mui/material'\nimport type { RefObject } from 'react'\nimport { useCallback, useMemo, useState } from 'react'\nimport { useChainSelect } from '../components/ChainSelect/useChainSelect.js'\nimport { FormKeyHelper, type FormType } from '../stores/form/types.js'\nimport { useFieldValues } from '../stores/form/useFieldValues.js'\n\nexport function useChainSearch(\n formType: FormType,\n listRef: RefObject<HTMLDivElement \| null>,\n inputRef: RefObject<HTMLInputElement \| null>\n): {\n filteredChains: ExtendedChain[]\n isLoading: boolean\n selectedChainId: number \| undefined\n onSelectChainFallback: (chain: ExtendedChain) => void\n onChange: () => void\n onClear: () => void\n} {\n const { chains, isLoading, setCurrentChain } = useChainSelect(formType)\n const [selectedChainId] = useFieldValues(FormKeyHelper.getChainKey(formType))\n const [debouncedSearchValue, setDebouncedSearchValue] = useState('')\n\n const filteredChains = useMemo(() => {\n const value = debouncedSearchValue.toLowerCase()\n return value\n ? (chains?.filter((chain) => chain.name.toLowerCase().includes(value)) ??\n [])\n : (chains ?? [])\n }, [chains, debouncedSearchValue])\n\n const debouncedFilterChains = useMemo(\n () =>\n debounce((value: string) => {\n setDebouncedSearchValue(value)\n listRef.current?.scrollTo(0, 0)\n }, 250),\n [listRef]\n )\n\n const onSelectChainFallback = useCallback(\n (chain: ExtendedChain) => {\n setCurrentChain(chain.id)\n },\n [setCurrentChain]\n )\n\n const onChange = useCallback(() => {\n const value = inputRef.current?.value \|\| ''\n debouncedFilterChains(value)\n }, [debouncedFilterChains, inputRef])\n\n const onClear = useCallback(() => {\n if (inputRef.current) {\n inputRef.current.value = ''\n }\n setDebouncedSearchValue('')\n listRef.current?.scrollTo(0, 0)\n }, [inputRef, listRef])\n\n return {\n filteredChains,\n isLoading,\n selectedChainId,\n onSelectChainFallback,\n onChange,\n onClear,\n }\n}\n"],"mappings":";;;;;;AAQA,SAAgB,eACd,UACA,SACA,UAQA;CACA,MAAM,EAAE,QAAQ,WAAW,oBAAoB,eAAe,QAAQ;CACtE,MAAM,CAAC,mBAAmB,eAAe,cAAc,YAAY,QAAQ,CAAC;CAC5E,MAAM,CAAC,sBAAsB,2BAA2B,SAAS,EAAE;CAEnE,MAAM,iBAAiB,cAAc;EACnC,MAAM,QAAQ,qBAAqB,YAAY;EAC/C,OAAO,QACF,QAAQ,QAAQ,UAAU,MAAM,KAAK,YAAY,~~EAAE~~,SAAS,KAAK,CAAC,KACjE,CAAC,IACF,UAAU,CAAC;CAClB,GAAG,CAAC,QAAQ,oBAAoB,CAAC;CAEjC,MAAM,wBAAwB,cAE1B,UAAU,UAAkB;EAC1B,wBAAwB,KAAK;EAC7B,QAAQ,SAAS,SAAS,GAAG,CAAC;CAChC,GAAG,GAAG,GACR,CAAC,OAAO,CACV;CAsBA,OAAO;EACL;EACA;EACA;EACA,uBAxB4B,aAC3B,UAAyB;GACxB,gBAAgB,MAAM,EAAE;EAC1B,GACA,CAAC,eAAe,CAoBI;EACpB,UAlBe,kBAAkB;GAEjC,sBADc,SAAS,SAAS,SAAS,EACd;EAC7B,GAAG,CAAC,uBAAuB,QAAQ,CAe1B;EACP,SAdc,kBAAkB;GAChC,IAAI,SAAS,SACX,SAAS,QAAQ,QAAQ;GAE3B,wBAAwB,EAAE;GAC1B,QAAQ,SAAS,SAAS,GAAG,CAAC;EAChC,GAAG,CAAC,UAAU,OAAO,CAQb;CACR;AACF"}
1	+ {"version":3,"file":"useChainSearch.js","names":[],"sources":["../../../src/hooks/useChainSearch.ts"],"sourcesContent":["import type { ExtendedChain } from '@lifi/sdk'\nimport { debounce } from '@mui/material'\nimport type { RefObject } from 'react'\nimport { useCallback, useMemo, useState } from 'react'\nimport { useChainSelect } from '../components/ChainSelect/useChainSelect.js'\nimport { FormKeyHelper, type FormType } from '../stores/form/types.js'\nimport { useFieldValues } from '../stores/form/useFieldValues.js'\n\nexport function useChainSearch(\n formType: FormType,\n listRef: RefObject<HTMLDivElement \| null>,\n inputRef: RefObject<HTMLInputElement \| null>\n): {\n filteredChains: ExtendedChain[]\n isLoading: boolean\n selectedChainId: number \| undefined\n onSelectChainFallback: (chain: ExtendedChain) => void\n onChange: () => void\n onClear: () => void\n} {\n const { chains, isLoading, setCurrentChain } = useChainSelect(formType)\n const [selectedChainId] = useFieldValues(FormKeyHelper.getChainKey(formType))\n const [debouncedSearchValue, setDebouncedSearchValue] = useState('')\n\n const filteredChains = useMemo(() => {\n const value = debouncedSearchValue.toLowerCase()\n return value\n ? (chains?.filter((chain) => chain.name.toLowerCase().includes(value)) ??\n [])\n : (chains ?? [])\n }, [chains, debouncedSearchValue])\n\n const debouncedFilterChains = useMemo(\n () =>\n debounce((value: string) => {\n setDebouncedSearchValue(value)\n listRef.current?.scrollTo(0, 0)\n }, 250),\n [listRef]\n )\n\n const onSelectChainFallback = useCallback(\n (chain: ExtendedChain) => {\n setCurrentChain(chain.id)\n },\n [setCurrentChain]\n )\n\n const onChange = useCallback(() => {\n const value = inputRef.current?.value \|\| ''\n debouncedFilterChains(value)\n }, [debouncedFilterChains, inputRef])\n\n const onClear = useCallback(() => {\n if (inputRef.current) {\n inputRef.current.value = ''\n }\n setDebouncedSearchValue('')\n listRef.current?.scrollTo(0, 0)\n }, [inputRef, listRef])\n\n return {\n filteredChains,\n isLoading,\n selectedChainId,\n onSelectChainFallback,\n onChange,\n onClear,\n }\n}\n"],"mappings":";;;;;;AAQA,SAAgB,eACd,UACA,SACA,UAQA;CACA,MAAM,EAAE,QAAQ,WAAW,oBAAoB,eAAe,QAAQ;CACtE,MAAM,CAAC,mBAAmB,eAAe,cAAc,YAAY,QAAQ,CAAC;CAC5E,MAAM,CAAC,sBAAsB,2BAA2B,SAAS,EAAE;CAEnE,MAAM,iBAAiB,cAAc;EACnC,MAAM,QAAQ,qBAAqB,YAAY;EAC/C,OAAO,QACF,QAAQ,QAAQ,UAAU,MAAM,KAAK,YAAY,CAAC,CAAC,SAAS,KAAK,CAAC,KACjE,CAAC,IACF,UAAU,CAAC;CAClB,GAAG,CAAC,QAAQ,oBAAoB,CAAC;CAEjC,MAAM,wBAAwB,cAE1B,UAAU,UAAkB;EAC1B,wBAAwB,KAAK;EAC7B,QAAQ,SAAS,SAAS,GAAG,CAAC;CAChC,GAAG,GAAG,GACR,CAAC,OAAO,CACV;CAsBA,OAAO;EACL;EACA;EACA;EACA,uBAxB4B,aAC3B,UAAyB;GACxB,gBAAgB,MAAM,EAAE;EAC1B,GACA,CAAC,eAAe,CAoBI;EACpB,UAlBe,kBAAkB;GAEjC,sBADc,SAAS,SAAS,SAAS,EACd;EAC7B,GAAG,CAAC,uBAAuB,QAAQ,CAe1B;EACP,SAdc,kBAAkB;GAChC,IAAI,SAAS,SACX,SAAS,QAAQ,QAAQ;GAE3B,wBAAwB,EAAE;GAC1B,QAAQ,SAAS,SAAS,GAAG,CAAC;EAChC,GAAG,CAAC,UAAU,OAAO,CAQb;CACR;AACF"}

package/dist/esm/hooks/useChains.js CHANGED Viewed

@@ -1,5 +1,5 @@
-import { useWidgetConfig } from "../providers/WidgetProvider/WidgetProvider.js";
 import { getConfigItemSets, isFormItemAllowed } from "../utils/item.js";
+import { useWidgetConfig } from "../providers/WidgetProvider/WidgetProvider.js";
 import { useAvailableChains } from "./useAvailableChains.js";
 import { useMemo } from "react";
 //#region src/hooks/useChains.ts

package/dist/esm/hooks/useExplorer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useExplorer.js","names":[],"sources":["../../../src/hooks/useExplorer.ts"],"sourcesContent":["import type { Chain } from '@lifi/sdk'\nimport { ChainId, ChainType, isHex } from '@lifi/sdk'\nimport { useCallback } from 'react'\nimport { internalExplorerUrl } from '../config/constants.js'\nimport { useAvailableChains } from '../hooks/useAvailableChains.js'\nimport { useWidgetConfig } from '../providers/WidgetProvider/WidgetProvider.js'\n\nconst sanitiseBaseUrl = (baseUrl: string) => baseUrl.trim().replace(/\\/+$/, '')\n\nconst explorerPathOverrides: Partial<\n Record<ChainType \| ChainId, { txPath: string; addressPath: string }>\n> = {\n [ChainId.SUI]: { txPath: 'txblock', addressPath: 'coin' },\n [ChainId.LTR]: { txPath: 'logs', addressPath: 'accounts' },\n [ChainType.TVM]: { txPath: '#/transaction', addressPath: '#/address' },\n}\n\ntype TransactionLinkProps = {\n chain?: Chain \| number\n txHash?: string\n txLink?: string\n}\n\nexport const useExplorer = (): {\n getTransactionLink: (props: TransactionLinkProps) => string \| undefined\n getAddressLink: (address: string, chain?: Chain \| number) => string\n} => {\n const { explorerUrls } = useWidgetConfig()\n const { getChainById } = useAvailableChains()\n\n const getExplorerConfig = useCallback(\n (chain?: Chain \| number) => {\n const resolvedChain = Number.isFinite(chain)\n ? getChainById(chain as number)\n : (chain as Chain)\n\n const explorerUrl =\n (resolvedChain\n ? (explorerUrls?.[resolvedChain.id]?.[0] ??\n resolvedChain.metamask.blockExplorerUrls[0])\n : explorerUrls?.internal?.[0]) \|\| internalExplorerUrl\n\n const baseUrl =\n typeof explorerUrl === 'string' ? explorerUrl : explorerUrl.url\n\n const overrides =\n explorerPathOverrides[resolvedChain?.id as ChainId] ??\n explorerPathOverrides[resolvedChain?.chainType as ChainType]\n\n const defaultTxPath = overrides?.txPath ?? 'tx'\n const defaultAddressPath = overrides?.addressPath ?? 'address'\n const txPath =\n typeof explorerUrl === 'string'\n ? defaultTxPath\n : explorerUrl.txPath \|\| defaultTxPath\n const addressPath =\n typeof explorerUrl === 'string'\n ? defaultAddressPath\n : explorerUrl.addressPath \|\| defaultAddressPath\n\n return {\n url: sanitiseBaseUrl(baseUrl),\n txPath,\n addressPath,\n resolvedChain,\n hasOverride: Boolean(overrides),\n }\n },\n [explorerUrls, getChainById]\n )\n\n const getTransactionLink = useCallback(\n ({ txHash, txLink, chain }: TransactionLinkProps): string \| undefined => {\n if (txHash) {\n const config = getExplorerConfig(chain)\n // For EVM chains, sanity-check the transaction hash as some relayers return custom task hashes that are not visible on-chain.\n // Skip the check when a chain-specific path override is registered — that's an explicit signal the chain's\n // explorer accepts a non-hex hash (e.g. Lighter, whose hash has no 0x prefix).\n const validForEvm =\n config.resolvedChain?.chainType !== ChainType.EVM \|\|\n config.hasOverride \|\|\n isHex(txHash, { strict: true })\n if (validForEvm) {\n return `${config.url}/${config.txPath}/${txHash}`\n }\n }\n return txLink\n },\n [getExplorerConfig]\n )\n\n const getAddressLink = useCallback(\n (address: string, chain?: Chain \| number) => {\n const config = getExplorerConfig(chain)\n return `${config.url}/${config.addressPath}/${address}`\n },\n [getExplorerConfig]\n )\n\n return {\n getTransactionLink,\n getAddressLink,\n }\n}\n"],"mappings":";;;;;;AAOA,MAAM,mBAAmB,YAAoB,QAAQ,KAAK,~~EAAE~~,QAAQ,QAAQ,EAAE;AAE9E,MAAM,wBAEF;EACD,QAAQ,MAAM;EAAE,QAAQ;EAAW,aAAa;CAAO;EACvD,QAAQ,MAAM;EAAE,QAAQ;EAAQ,aAAa;CAAW;EACxD,UAAU,MAAM;EAAE,QAAQ;EAAiB,aAAa;CAAY;AACvE;AAQA,MAAa,oBAGR;CACH,MAAM,EAAE,iBAAiB,gBAAgB;CACzC,MAAM,EAAE,iBAAiB,mBAAmB;CAE5C,MAAM,oBAAoB,aACvB,UAA2B;EAC1B,MAAM,gBAAgB,OAAO,SAAS,KAAK,IACvC,aAAa,KAAe,IAC3B;EAEL,MAAM,eACH,gBACI,eAAe,cAAc,~~MAAM~~,MACpC,cAAc,SAAS,kBAAkB,KACzC,cAAc,WAAW,OAAA;EAE/B,MAAM,UACJ,OAAO,gBAAgB,WAAW,cAAc,YAAY;EAE9D,MAAM,YACJ,sBAAsB,eAAe,OACrC,sBAAsB,eAAe;EAEvC,MAAM,gBAAgB,WAAW,UAAU;EAC3C,MAAM,qBAAqB,WAAW,eAAe;EACrD,MAAM,SACJ,OAAO,gBAAgB,WACnB,gBACA,YAAY,UAAU;EAC5B,MAAM,cACJ,OAAO,gBAAgB,WACnB,qBACA,YAAY,eAAe;EAEjC,OAAO;GACL,KAAK,gBAAgB,OAAO;GAC5B;GACA;GACA;GACA,aAAa,QAAQ,SAAS;EAChC;CACF,GACA,CAAC,cAAc,YAAY,CAC7B;CA8BA,OAAO;EACL,oBA7ByB,aACxB,EAAE,QAAQ,QAAQ,YAAsD;GACvE,IAAI,QAAQ;IACV,MAAM,SAAS,kBAAkB,KAAK;IAQtC,IAHE,OAAO,eAAe,cAAc,UAAU,OAC9C,OAAO,eACP,MAAM,QAAQ,EAAE,QAAQ,KAAK,CAAC,GAE9B,OAAO,GAAG,OAAO,IAAI,GAAG,OAAO,OAAO,GAAG;GAE7C;GACA,OAAO;EACT,GACA,CAAC,iBAAiB,CAYD;EACjB,gBAVqB,aACpB,SAAiB,UAA2B;GAC3C,MAAM,SAAS,kBAAkB,KAAK;GACtC,OAAO,GAAG,OAAO,IAAI,GAAG,OAAO,YAAY,GAAG;EAChD,GACA,CAAC,iBAAiB,CAKL;CACf;AACF"}
1	+ {"version":3,"file":"useExplorer.js","names":[],"sources":["../../../src/hooks/useExplorer.ts"],"sourcesContent":["import type { Chain } from '@lifi/sdk'\nimport { ChainId, ChainType, isHex } from '@lifi/sdk'\nimport { useCallback } from 'react'\nimport { internalExplorerUrl } from '../config/constants.js'\nimport { useAvailableChains } from '../hooks/useAvailableChains.js'\nimport { useWidgetConfig } from '../providers/WidgetProvider/WidgetProvider.js'\n\nconst sanitiseBaseUrl = (baseUrl: string) => baseUrl.trim().replace(/\\/+$/, '')\n\nconst explorerPathOverrides: Partial<\n Record<ChainType \| ChainId, { txPath: string; addressPath: string }>\n> = {\n [ChainId.SUI]: { txPath: 'txblock', addressPath: 'coin' },\n [ChainId.LTR]: { txPath: 'logs', addressPath: 'accounts' },\n [ChainType.TVM]: { txPath: '#/transaction', addressPath: '#/address' },\n}\n\ntype TransactionLinkProps = {\n chain?: Chain \| number\n txHash?: string\n txLink?: string\n}\n\nexport const useExplorer = (): {\n getTransactionLink: (props: TransactionLinkProps) => string \| undefined\n getAddressLink: (address: string, chain?: Chain \| number) => string\n} => {\n const { explorerUrls } = useWidgetConfig()\n const { getChainById } = useAvailableChains()\n\n const getExplorerConfig = useCallback(\n (chain?: Chain \| number) => {\n const resolvedChain = Number.isFinite(chain)\n ? getChainById(chain as number)\n : (chain as Chain)\n\n const explorerUrl =\n (resolvedChain\n ? (explorerUrls?.[resolvedChain.id]?.[0] ??\n resolvedChain.metamask.blockExplorerUrls[0])\n : explorerUrls?.internal?.[0]) \|\| internalExplorerUrl\n\n const baseUrl =\n typeof explorerUrl === 'string' ? explorerUrl : explorerUrl.url\n\n const overrides =\n explorerPathOverrides[resolvedChain?.id as ChainId] ??\n explorerPathOverrides[resolvedChain?.chainType as ChainType]\n\n const defaultTxPath = overrides?.txPath ?? 'tx'\n const defaultAddressPath = overrides?.addressPath ?? 'address'\n const txPath =\n typeof explorerUrl === 'string'\n ? defaultTxPath\n : explorerUrl.txPath \|\| defaultTxPath\n const addressPath =\n typeof explorerUrl === 'string'\n ? defaultAddressPath\n : explorerUrl.addressPath \|\| defaultAddressPath\n\n return {\n url: sanitiseBaseUrl(baseUrl),\n txPath,\n addressPath,\n resolvedChain,\n hasOverride: Boolean(overrides),\n }\n },\n [explorerUrls, getChainById]\n )\n\n const getTransactionLink = useCallback(\n ({ txHash, txLink, chain }: TransactionLinkProps): string \| undefined => {\n if (txHash) {\n const config = getExplorerConfig(chain)\n // For EVM chains, sanity-check the transaction hash as some relayers return custom task hashes that are not visible on-chain.\n // Skip the check when a chain-specific path override is registered — that's an explicit signal the chain's\n // explorer accepts a non-hex hash (e.g. Lighter, whose hash has no 0x prefix).\n const validForEvm =\n config.resolvedChain?.chainType !== ChainType.EVM \|\|\n config.hasOverride \|\|\n isHex(txHash, { strict: true })\n if (validForEvm) {\n return `${config.url}/${config.txPath}/${txHash}`\n }\n }\n return txLink\n },\n [getExplorerConfig]\n )\n\n const getAddressLink = useCallback(\n (address: string, chain?: Chain \| number) => {\n const config = getExplorerConfig(chain)\n return `${config.url}/${config.addressPath}/${address}`\n },\n [getExplorerConfig]\n )\n\n return {\n getTransactionLink,\n getAddressLink,\n }\n}\n"],"mappings":";;;;;;AAOA,MAAM,mBAAmB,YAAoB,QAAQ,KAAK,CAAC,CAAC,QAAQ,QAAQ,EAAE;AAE9E,MAAM,wBAEF;EACD,QAAQ,MAAM;EAAE,QAAQ;EAAW,aAAa;CAAO;EACvD,QAAQ,MAAM;EAAE,QAAQ;EAAQ,aAAa;CAAW;EACxD,UAAU,MAAM;EAAE,QAAQ;EAAiB,aAAa;CAAY;AACvE;AAQA,MAAa,oBAGR;CACH,MAAM,EAAE,iBAAiB,gBAAgB;CACzC,MAAM,EAAE,iBAAiB,mBAAmB;CAE5C,MAAM,oBAAoB,aACvB,UAA2B;EAC1B,MAAM,gBAAgB,OAAO,SAAS,KAAK,IACvC,aAAa,KAAe,IAC3B;EAEL,MAAM,eACH,gBACI,eAAe,cAAc,GAAG,GAAG,MACpC,cAAc,SAAS,kBAAkB,KACzC,cAAc,WAAW,OAAA;EAE/B,MAAM,UACJ,OAAO,gBAAgB,WAAW,cAAc,YAAY;EAE9D,MAAM,YACJ,sBAAsB,eAAe,OACrC,sBAAsB,eAAe;EAEvC,MAAM,gBAAgB,WAAW,UAAU;EAC3C,MAAM,qBAAqB,WAAW,eAAe;EACrD,MAAM,SACJ,OAAO,gBAAgB,WACnB,gBACA,YAAY,UAAU;EAC5B,MAAM,cACJ,OAAO,gBAAgB,WACnB,qBACA,YAAY,eAAe;EAEjC,OAAO;GACL,KAAK,gBAAgB,OAAO;GAC5B;GACA;GACA;GACA,aAAa,QAAQ,SAAS;EAChC;CACF,GACA,CAAC,cAAc,YAAY,CAC7B;CA8BA,OAAO;EACL,oBA7ByB,aACxB,EAAE,QAAQ,QAAQ,YAAsD;GACvE,IAAI,QAAQ;IACV,MAAM,SAAS,kBAAkB,KAAK;IAQtC,IAHE,OAAO,eAAe,cAAc,UAAU,OAC9C,OAAO,eACP,MAAM,QAAQ,EAAE,QAAQ,KAAK,CAAC,GAE9B,OAAO,GAAG,OAAO,IAAI,GAAG,OAAO,OAAO,GAAG;GAE7C;GACA,OAAO;EACT,GACA,CAAC,iBAAiB,CAYD;EACjB,gBAVqB,aACpB,SAAiB,UAA2B;GAC3C,MAAM,SAAS,kBAAkB,KAAK;GACtC,OAAO,GAAG,OAAO,IAAI,GAAG,OAAO,YAAY,GAAG;EAChD,GACA,CAAC,iBAAiB,CAKL;CACf;AACF"}

package/dist/esm/hooks/useFilteredByTokenBalances.js CHANGED Viewed

@@ -1,5 +1,5 @@
-import { useWidgetConfig } from "../providers/WidgetProvider/WidgetProvider.js";
 import { getConfigItemSets, isFormItemAllowed } from "../utils/item.js";
+import { useWidgetConfig } from "../providers/WidgetProvider/WidgetProvider.js";
 import { useSDKClient } from "../providers/SDKClientProvider.js";
 import { isSupportedToken } from "../utils/tokenList.js";
 import { ChainType, getWalletBalances } from "@lifi/sdk";

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

	@@ -1 +1 @@
1	- {"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 { 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 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 // 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\n .map((token: WalletTokenExtended) => ({\n ...token,\n verified: 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":";;;;;;;;AAeA,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,~~EAAE~~,MACzD,CAAC,GAAG,EAAE,iBAAiB,cAAc,UAAU,GAElC,~~IAAI~~;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;CAgGD,OAAO;EAAE,MA9F0B,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,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;KAEjC,MAAM,WAAW,mBAAmB;KAEpC,IAAI,CAAC,UAAU,QAAQ;MACrB,IAAI,YAAY,QACd,OAAO,~~SAAS~~,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,~~EAC3C~~,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,~~EAEA~~,KAAK,WAAgC;MACpC,GAAG;MACH,UAAU;KACZ,EAAE;KAGJ,MAAM,YAAY,CAChB,GAAG,gBACH,GAAG,gBACL;KAEA,IAAI,UAAU,QACZ,OAAO,~~SAAS~~,WAAW;IAE/B;GACF;GAEA,OAAO;EACT,GAAG;GAAC;GAAoB;GAAkB;GAAc;EAAQ,CAExB;EAAG;CAAU;AACvD"}
1	+ {"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 { 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 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 // 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\n .map((token: WalletTokenExtended) => ({\n ...token,\n verified: 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":";;;;;;;;AAeA,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;CAgGD,OAAO;EAAE,MA9F0B,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,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;KAEjC,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,UAAU;KACZ,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"}

package/dist/esm/hooks/useFromTokenSufficiency.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useFromTokenSufficiency.js","names":[],"sources":["../../../src/hooks/useFromTokenSufficiency.ts"],"sourcesContent":["import { parseUnits, type RouteExtended } from '@lifi/sdk'\nimport { useAccount } from '@lifi/wallet-management'\nimport { keepPreviousData, useQuery } from '@tanstack/react-query'\nimport { useSDKClient } from '../providers/SDKClientProvider.js'\nimport { useWidgetConfig } from '../providers/WidgetProvider/WidgetProvider.js'\nimport { useFieldValues } from '../stores/form/useFieldValues.js'\nimport { isRouteDone } from '../stores/routes/utils.js'\nimport { getQueryKey } from '../utils/queries.js'\nimport { useTokenAddressBalance } from './useTokenAddressBalance.js'\nimport { getTokenBalancesWithRetry } from './useTokenBalance.js'\n\nconst refetchInterval = 30_000\n\nexport const useFromTokenSufficiency = (\n route?: RouteExtended\n): {\n insufficientFromToken: boolean \| undefined\n isLoading: boolean\n} => {\n const [fromChainId, fromTokenAddress, fromAmount] = useFieldValues(\n 'fromChain',\n 'fromToken',\n 'fromAmount'\n )\n const { keyPrefix } = useWidgetConfig()\n const sdkClient = useSDKClient()\n\n let chainId = fromChainId\n let tokenAddress = fromTokenAddress\n if (route) {\n chainId = route.fromToken.chainId\n tokenAddress = route.fromToken.address\n }\n\n const {\n token,\n chain,\n isLoading: isTokenAddressBalanceLoading,\n } = useTokenAddressBalance(chainId, tokenAddress)\n\n const { account } = useAccount({ chainType: chain?.chainType })\n\n const { data: insufficientFromToken, isLoading } = useQuery({\n queryKey: [\n getQueryKey('from-token-sufficiency-check', keyPrefix),\n account.address,\n chainId,\n tokenAddress,\n route?.id ?? fromAmount,\n ] as const,\n queryFn: async ({ queryKey: [, accountAddress] }) => {\n if (!accountAddress \|\| !token) {\n return\n }\n const parsedFromAmount = parseUnits(fromAmount, token.decimals)\n let currentTokenBalance = token.amount ?? 0n\n\n if (!route \|\| isRouteDone(route)) {\n const insufficientFunds = currentTokenBalance < parsedFromAmount\n return insufficientFunds\n }\n\n const currentAction = route.steps.filter(\n (step) => step.execution?.status !== 'DONE'\n )[0]?.action\n\n if (\n token.chainId === currentAction.fromToken.chainId &&\n token.address === currentAction.fromToken.address &&\n currentTokenBalance > 0\n ) {\n const insufficientFunds = BigInt(route.fromAmount) > currentTokenBalance\n return insufficientFunds\n }\n\n const tokenBalances = await getTokenBalancesWithRetry(\n sdkClient,\n accountAddress,\n [currentAction.fromToken]\n )\n\n currentTokenBalance = tokenBalances?.[0]?.amount ?? 0n\n const insufficientFunds =\n BigInt(currentAction.fromAmount) > currentTokenBalance\n return insufficientFunds\n },\n\n enabled: Boolean(account.address && token && !isTokenAddressBalanceLoading),\n refetchInterval,\n staleTime: refetchInterval,\n placeholderData: account.address ? keepPreviousData : undefined,\n })\n\n return {\n insufficientFromToken,\n isLoading,\n }\n}\n"],"mappings":";;;;;;;;;;;AAWA,MAAM,kBAAkB;AAExB,MAAa,2BACX,UAIG;CACH,MAAM,CAAC,aAAa,kBAAkB,cAAc,eAClD,aACA,aACA,YACF;CACA,MAAM,EAAE,cAAc,gBAAgB;CACtC,MAAM,YAAY,aAAa;CAE/B,IAAI,UAAU;CACd,IAAI,eAAe;CACnB,IAAI,OAAO;EACT,UAAU,MAAM,UAAU;EAC1B,eAAe,MAAM,UAAU;CACjC;CAEA,MAAM,EACJ,OACA,OACA,WAAW,iCACT,uBAAuB,SAAS,YAAY;CAEhD,MAAM,EAAE,YAAY,WAAW,EAAE,WAAW,OAAO,UAAU,CAAC;CAE9D,MAAM,EAAE,MAAM,uBAAuB,cAAc,SAAS;EAC1D,UAAU;GACR,YAAY,gCAAgC,SAAS;GACrD,QAAQ;GACR;GACA;GACA,OAAO,MAAM;EACf;EACA,SAAS,OAAO,EAAE,UAAU,GAAG,sBAAsB;GACnD,IAAI,CAAC,kBAAkB,CAAC,OACtB;GAEF,MAAM,mBAAmB,WAAW,YAAY,MAAM,QAAQ;GAC9D,IAAI,sBAAsB,MAAM,UAAU;GAE1C,IAAI,CAAC,SAAS,YAAY,KAAK,GAE7B,OAD0B,sBAAsB;GAIlD,MAAM,gBAAgB,MAAM,MAAM,QAC/B,SAAS,KAAK,WAAW,WAAW,MACvC,EAAE,~~IAAI~~;GAEN,IACE,MAAM,YAAY,cAAc,UAAU,WAC1C,MAAM,YAAY,cAAc,UAAU,WAC1C,sBAAsB,GAGtB,OAD0B,OAAO,MAAM,UAAU,IAAI;GAUvD,uBAAsB,MANM,0BAC1B,WACA,gBACA,CAAC,cAAc,SAAS,CAC1B,~~KAEsC~~,~~IAAI~~,UAAU;GAGpD,OADE,OAAO,cAAc,UAAU,IAAI;EAEvC;EAEA,SAAS,QAAQ,QAAQ,WAAW,SAAS,CAAC,4BAA4B;EAC1E;EACA,WAAW;EACX,iBAAiB,QAAQ,UAAU,mBAAmB,KAAA;CACxD,CAAC;CAED,OAAO;EACL;EACA;CACF;AACF"}
1	+ {"version":3,"file":"useFromTokenSufficiency.js","names":[],"sources":["../../../src/hooks/useFromTokenSufficiency.ts"],"sourcesContent":["import { parseUnits, type RouteExtended } from '@lifi/sdk'\nimport { useAccount } from '@lifi/wallet-management'\nimport { keepPreviousData, useQuery } from '@tanstack/react-query'\nimport { useSDKClient } from '../providers/SDKClientProvider.js'\nimport { useWidgetConfig } from '../providers/WidgetProvider/WidgetProvider.js'\nimport { useFieldValues } from '../stores/form/useFieldValues.js'\nimport { isRouteDone } from '../stores/routes/utils.js'\nimport { getQueryKey } from '../utils/queries.js'\nimport { useTokenAddressBalance } from './useTokenAddressBalance.js'\nimport { getTokenBalancesWithRetry } from './useTokenBalance.js'\n\nconst refetchInterval = 30_000\n\nexport const useFromTokenSufficiency = (\n route?: RouteExtended\n): {\n insufficientFromToken: boolean \| undefined\n isLoading: boolean\n} => {\n const [fromChainId, fromTokenAddress, fromAmount] = useFieldValues(\n 'fromChain',\n 'fromToken',\n 'fromAmount'\n )\n const { keyPrefix } = useWidgetConfig()\n const sdkClient = useSDKClient()\n\n let chainId = fromChainId\n let tokenAddress = fromTokenAddress\n if (route) {\n chainId = route.fromToken.chainId\n tokenAddress = route.fromToken.address\n }\n\n const {\n token,\n chain,\n isLoading: isTokenAddressBalanceLoading,\n } = useTokenAddressBalance(chainId, tokenAddress)\n\n const { account } = useAccount({ chainType: chain?.chainType })\n\n const { data: insufficientFromToken, isLoading } = useQuery({\n queryKey: [\n getQueryKey('from-token-sufficiency-check', keyPrefix),\n account.address,\n chainId,\n tokenAddress,\n route?.id ?? fromAmount,\n ] as const,\n queryFn: async ({ queryKey: [, accountAddress] }) => {\n if (!accountAddress \|\| !token) {\n return\n }\n const parsedFromAmount = parseUnits(fromAmount, token.decimals)\n let currentTokenBalance = token.amount ?? 0n\n\n if (!route \|\| isRouteDone(route)) {\n const insufficientFunds = currentTokenBalance < parsedFromAmount\n return insufficientFunds\n }\n\n const currentAction = route.steps.filter(\n (step) => step.execution?.status !== 'DONE'\n )[0]?.action\n\n if (\n token.chainId === currentAction.fromToken.chainId &&\n token.address === currentAction.fromToken.address &&\n currentTokenBalance > 0\n ) {\n const insufficientFunds = BigInt(route.fromAmount) > currentTokenBalance\n return insufficientFunds\n }\n\n const tokenBalances = await getTokenBalancesWithRetry(\n sdkClient,\n accountAddress,\n [currentAction.fromToken]\n )\n\n currentTokenBalance = tokenBalances?.[0]?.amount ?? 0n\n const insufficientFunds =\n BigInt(currentAction.fromAmount) > currentTokenBalance\n return insufficientFunds\n },\n\n enabled: Boolean(account.address && token && !isTokenAddressBalanceLoading),\n refetchInterval,\n staleTime: refetchInterval,\n placeholderData: account.address ? keepPreviousData : undefined,\n })\n\n return {\n insufficientFromToken,\n isLoading,\n }\n}\n"],"mappings":";;;;;;;;;;;AAWA,MAAM,kBAAkB;AAExB,MAAa,2BACX,UAIG;CACH,MAAM,CAAC,aAAa,kBAAkB,cAAc,eAClD,aACA,aACA,YACF;CACA,MAAM,EAAE,cAAc,gBAAgB;CACtC,MAAM,YAAY,aAAa;CAE/B,IAAI,UAAU;CACd,IAAI,eAAe;CACnB,IAAI,OAAO;EACT,UAAU,MAAM,UAAU;EAC1B,eAAe,MAAM,UAAU;CACjC;CAEA,MAAM,EACJ,OACA,OACA,WAAW,iCACT,uBAAuB,SAAS,YAAY;CAEhD,MAAM,EAAE,YAAY,WAAW,EAAE,WAAW,OAAO,UAAU,CAAC;CAE9D,MAAM,EAAE,MAAM,uBAAuB,cAAc,SAAS;EAC1D,UAAU;GACR,YAAY,gCAAgC,SAAS;GACrD,QAAQ;GACR;GACA;GACA,OAAO,MAAM;EACf;EACA,SAAS,OAAO,EAAE,UAAU,GAAG,sBAAsB;GACnD,IAAI,CAAC,kBAAkB,CAAC,OACtB;GAEF,MAAM,mBAAmB,WAAW,YAAY,MAAM,QAAQ;GAC9D,IAAI,sBAAsB,MAAM,UAAU;GAE1C,IAAI,CAAC,SAAS,YAAY,KAAK,GAE7B,OAD0B,sBAAsB;GAIlD,MAAM,gBAAgB,MAAM,MAAM,QAC/B,SAAS,KAAK,WAAW,WAAW,MACvC,CAAC,CAAC,EAAE,EAAE;GAEN,IACE,MAAM,YAAY,cAAc,UAAU,WAC1C,MAAM,YAAY,cAAc,UAAU,WAC1C,sBAAsB,GAGtB,OAD0B,OAAO,MAAM,UAAU,IAAI;GAUvD,uBAAsB,MANM,0BAC1B,WACA,gBACA,CAAC,cAAc,SAAS,CAC1B,EAAA,GAEsC,EAAE,EAAE,UAAU;GAGpD,OADE,OAAO,cAAc,UAAU,IAAI;EAEvC;EAEA,SAAS,QAAQ,QAAQ,WAAW,SAAS,CAAC,4BAA4B;EAC1E;EACA,WAAW;EACX,iBAAiB,QAAQ,UAAU,mBAAmB,KAAA;CACxD,CAAC;CAED,OAAO;EACL;EACA;CACF;AACF"}

package/dist/esm/hooks/useGasSufficiency.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useGasSufficiency.js","names":[],"sources":["../../../src/hooks/useGasSufficiency.ts"],"sourcesContent":["import type { EVMChain, RouteExtended, Token, TokenAmount } from '@lifi/sdk'\nimport { ChainType } from '@lifi/sdk'\nimport { useAccount } from '@lifi/wallet-management'\nimport { useQuery } from '@tanstack/react-query'\nimport { useMemo } from 'react'\nimport { useSDKClient } from '../providers/SDKClientProvider.js'\nimport { useWidgetConfig } from '../providers/WidgetProvider/WidgetProvider.js'\nimport { getQueryKey } from '../utils/queries.js'\nimport { useAvailableChains } from './useAvailableChains.js'\nimport { useIsContractAddress } from './useIsContractAddress.js'\nimport { getTokenBalancesWithRetry } from './useTokenBalance.js'\n\nexport interface GasSufficiency {\n gasAmount: bigint\n tokenAmount?: bigint\n insufficientAmount?: bigint\n insufficient?: boolean\n token: Token\n chain?: EVMChain\n}\n\nconst refetchInterval = 30_000\n\nexport const useGasSufficiency = (\n route?: RouteExtended\n): {\n insufficientGas: GasSufficiency[] \| undefined\n isLoading: boolean\n} => {\n const { getChainById } = useAvailableChains()\n const { account: EVMAccount, accounts } = useAccount({\n chainType: ChainType.EVM,\n })\n const { keyPrefix, hiddenUI } = useWidgetConfig()\n const sdkClient = useSDKClient()\n\n const { relevantAccounts, relevantAccountsQueryKey } = useMemo(() => {\n const chainTypes = route?.steps.reduce((acc, step) => {\n const chainType = getChainById(step.action.fromChainId)?.chainType\n if (chainType) {\n acc.add(chainType)\n }\n return acc\n }, new Set<ChainType>())\n\n const relevantAccounts = accounts.filter(\n (account) =>\n account.isConnected &&\n account.address &&\n chainTypes?.has(account.chainType)\n )\n return {\n relevantAccounts,\n relevantAccountsQueryKey: relevantAccounts\n .map((account) => account.address)\n .join(','),\n }\n }, [accounts, route?.steps, getChainById])\n\n const { isContractAddress, isLoading: isContractAddressLoading } =\n useIsContractAddress(\n EVMAccount.address,\n route?.fromChainId,\n EVMAccount.chainType\n )\n\n const { data: insufficientGas, isLoading } = useQuery<GasSufficiency[]>({\n queryKey: [\n getQueryKey('gas-sufficiency-check', keyPrefix),\n relevantAccountsQueryKey,\n route?.id,\n isContractAddress,\n ] as const,\n queryFn: async () => {\n if (!route) {\n return []\n }\n\n // Filter out steps that are relayer steps or have primaryType 'Permit' or 'Order'\n const filteredSteps = route.steps.filter(\n (step) =>\n !step.typedData?.some(\n (t) => t.primaryType === 'Permit' \|\| t.primaryType === 'Order'\n )\n )\n\n // If all steps are filtered out, we don't need to check for gas sufficiency\n if (!filteredSteps.length) {\n return []\n }\n\n // We assume that LI.Fuel protocol always refuels the destination chain\n const hasRefuelStep = route.steps\n .flatMap((step) => step.includedSteps)\n .some((includedStep) => includedStep.tool === 'gasZip')\n\n const gasCosts = filteredSteps\n .filter((step) => step.execution?.status !== 'DONE')\n .reduce(\n (groupedGasCosts, step) => {\n // We need to avoid destination chain step sufficiency check if we have LI.Fuel protocol sub-step\n const skipDueToRefuel =\n step.action.fromChainId === route.toChainId && hasRefuelStep\n if (step.estimate.gasCosts && !skipDueToRefuel) {\n const { token } = step.estimate.gasCosts[0]\n const gasCostAmount = step.estimate.gasCosts.reduce(\n (amount, gasCost) =>\n amount + BigInt(Number(gasCost.amount).toFixed(0)),\n 0n\n )\n if (gasCostAmount > 0n) {\n groupedGasCosts[token.chainId] = {\n gasAmount: groupedGasCosts[token.chainId]\n ? groupedGasCosts[token.chainId].gasAmount + gasCostAmount\n : gasCostAmount,\n token,\n chain: getChainById(token.chainId),\n }\n }\n }\n // Add fees paid in native tokens to gas sufficiency check (included: false)\n const nonIncludedFeeCosts = step.estimate.feeCosts?.filter(\n (feeCost) => !feeCost.included\n )\n if (nonIncludedFeeCosts?.length) {\n const { token } = nonIncludedFeeCosts[0]\n const feeCostAmount = nonIncludedFeeCosts.reduce(\n (amount, feeCost) =>\n amount + BigInt(Number(feeCost.amount).toFixed(0)),\n 0n\n )\n if (feeCostAmount > 0n) {\n groupedGasCosts[token.chainId] = {\n gasAmount: groupedGasCosts[token.chainId]\n ? groupedGasCosts[token.chainId].gasAmount + feeCostAmount\n : feeCostAmount,\n token,\n chain: getChainById(token.chainId),\n }\n }\n }\n return groupedGasCosts\n },\n {} as Record<string, GasSufficiency>\n )\n\n // Check whether we are sending a native token\n // For native tokens we want to check for the total amount, including the network fee\n if (\n route.fromToken.address === gasCosts[route.fromChainId]?.token.address\n ) {\n gasCosts[route.fromChainId].tokenAmount =\n gasCosts[route.fromChainId]?.gasAmount + BigInt(route.fromAmount)\n }\n\n const gasCostsValues = Object.values(gasCosts)\n\n const balanceChecks = await Promise.allSettled(\n relevantAccounts.map((account) => {\n const relevantTokens = gasCostsValues\n .filter((gasCost) => gasCost.chain?.chainType === account.chainType)\n .map((item) => item.token)\n\n return getTokenBalancesWithRetry(\n sdkClient,\n account.address!,\n relevantTokens\n )\n })\n )\n\n const tokenBalances = balanceChecks\n .filter(\n (result): result is PromiseFulfilledResult<TokenAmount[]> =>\n result.status === 'fulfilled' && Boolean(result.value)\n )\n .flatMap((result) => result.value)\n\n if (!tokenBalances?.length) {\n return []\n }\n\n Object.keys(gasCosts).forEach((chainId) => {\n if (gasCosts[chainId]) {\n const gasTokenBalance =\n tokenBalances?.find(\n (t) =>\n t.chainId === gasCosts[chainId].token.chainId &&\n t.address === gasCosts[chainId].token.address\n )?.amount ?? 0n\n const insufficient =\n gasTokenBalance <= 0n \|\|\n gasTokenBalance < gasCosts[chainId].gasAmount \|\|\n gasTokenBalance < (gasCosts[chainId].tokenAmount ?? 0n)\n\n const insufficientAmount = insufficient\n ? gasCosts[chainId].tokenAmount\n ? gasCosts[chainId].tokenAmount! - gasTokenBalance\n : gasCosts[chainId].gasAmount - gasTokenBalance\n : undefined\n\n gasCosts[chainId] = {\n ...gasCosts[chainId],\n insufficient,\n insufficientAmount,\n chain: insufficient ? getChainById(Number(chainId)) : undefined,\n }\n }\n })\n\n const gasCostResult = Object.values(gasCosts).filter(\n (gasCost) => gasCost.insufficient\n )\n\n return gasCostResult\n },\n\n enabled: Boolean(\n !isContractAddress &&\n !isContractAddressLoading &&\n relevantAccounts.length > 0 &&\n route &&\n !hiddenUI?.insufficientGasMessage\n ),\n refetchInterval,\n staleTime: refetchInterval,\n })\n\n return {\n insufficientGas,\n isLoading,\n }\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"useGasSufficiency.js","names":[],"sources":["../../../src/hooks/useGasSufficiency.ts"],"sourcesContent":["import type { EVMChain, RouteExtended, Token, TokenAmount } from '@lifi/sdk'\nimport { ChainType } from '@lifi/sdk'\nimport { useAccount } from '@lifi/wallet-management'\nimport { useQuery } from '@tanstack/react-query'\nimport { useMemo } from 'react'\nimport { useSDKClient } from '../providers/SDKClientProvider.js'\nimport { useWidgetConfig } from '../providers/WidgetProvider/WidgetProvider.js'\nimport { getQueryKey } from '../utils/queries.js'\nimport { useAvailableChains } from './useAvailableChains.js'\nimport { useIsContractAddress } from './useIsContractAddress.js'\nimport { getTokenBalancesWithRetry } from './useTokenBalance.js'\n\nexport interface GasSufficiency {\n gasAmount: bigint\n tokenAmount?: bigint\n insufficientAmount?: bigint\n insufficient?: boolean\n token: Token\n chain?: EVMChain\n}\n\nconst refetchInterval = 30_000\n\nexport const useGasSufficiency = (\n route?: RouteExtended\n): {\n insufficientGas: GasSufficiency[] \| undefined\n isLoading: boolean\n} => {\n const { getChainById } = useAvailableChains()\n const { account: EVMAccount, accounts } = useAccount({\n chainType: ChainType.EVM,\n })\n const { keyPrefix, hiddenUI } = useWidgetConfig()\n const sdkClient = useSDKClient()\n\n const { relevantAccounts, relevantAccountsQueryKey } = useMemo(() => {\n const chainTypes = route?.steps.reduce((acc, step) => {\n const chainType = getChainById(step.action.fromChainId)?.chainType\n if (chainType) {\n acc.add(chainType)\n }\n return acc\n }, new Set<ChainType>())\n\n const relevantAccounts = accounts.filter(\n (account) =>\n account.isConnected &&\n account.address &&\n chainTypes?.has(account.chainType)\n )\n return {\n relevantAccounts,\n relevantAccountsQueryKey: relevantAccounts\n .map((account) => account.address)\n .join(','),\n }\n }, [accounts, route?.steps, getChainById])\n\n const { isContractAddress, isLoading: isContractAddressLoading } =\n useIsContractAddress(\n EVMAccount.address,\n route?.fromChainId,\n EVMAccount.chainType\n )\n\n const { data: insufficientGas, isLoading } = useQuery<GasSufficiency[]>({\n queryKey: [\n getQueryKey('gas-sufficiency-check', keyPrefix),\n relevantAccountsQueryKey,\n route?.id,\n isContractAddress,\n ] as const,\n queryFn: async () => {\n if (!route) {\n return []\n }\n\n // Filter out steps that are relayer steps or have primaryType 'Permit' or 'Order'\n const filteredSteps = route.steps.filter(\n (step) =>\n !step.typedData?.some(\n (t) => t.primaryType === 'Permit' \|\| t.primaryType === 'Order'\n )\n )\n\n // If all steps are filtered out, we don't need to check for gas sufficiency\n if (!filteredSteps.length) {\n return []\n }\n\n // We assume that LI.Fuel protocol always refuels the destination chain\n const hasRefuelStep = route.steps\n .flatMap((step) => step.includedSteps)\n .some((includedStep) => includedStep.tool === 'gasZip')\n\n const gasCosts = filteredSteps\n .filter((step) => step.execution?.status !== 'DONE')\n .reduce(\n (groupedGasCosts, step) => {\n // We need to avoid destination chain step sufficiency check if we have LI.Fuel protocol sub-step\n const skipDueToRefuel =\n step.action.fromChainId === route.toChainId && hasRefuelStep\n if (step.estimate.gasCosts && !skipDueToRefuel) {\n const { token } = step.estimate.gasCosts[0]\n const gasCostAmount = step.estimate.gasCosts.reduce(\n (amount, gasCost) =>\n amount + BigInt(Number(gasCost.amount).toFixed(0)),\n 0n\n )\n if (gasCostAmount > 0n) {\n groupedGasCosts[token.chainId] = {\n gasAmount: groupedGasCosts[token.chainId]\n ? groupedGasCosts[token.chainId].gasAmount + gasCostAmount\n : gasCostAmount,\n token,\n chain: getChainById(token.chainId),\n }\n }\n }\n // Add fees paid in native tokens to gas sufficiency check (included: false)\n const nonIncludedFeeCosts = step.estimate.feeCosts?.filter(\n (feeCost) => !feeCost.included\n )\n if (nonIncludedFeeCosts?.length) {\n const { token } = nonIncludedFeeCosts[0]\n const feeCostAmount = nonIncludedFeeCosts.reduce(\n (amount, feeCost) =>\n amount + BigInt(Number(feeCost.amount).toFixed(0)),\n 0n\n )\n if (feeCostAmount > 0n) {\n groupedGasCosts[token.chainId] = {\n gasAmount: groupedGasCosts[token.chainId]\n ? groupedGasCosts[token.chainId].gasAmount + feeCostAmount\n : feeCostAmount,\n token,\n chain: getChainById(token.chainId),\n }\n }\n }\n return groupedGasCosts\n },\n {} as Record<string, GasSufficiency>\n )\n\n // Check whether we are sending a native token\n // For native tokens we want to check for the total amount, including the network fee\n if (\n route.fromToken.address === gasCosts[route.fromChainId]?.token.address\n ) {\n gasCosts[route.fromChainId].tokenAmount =\n gasCosts[route.fromChainId]?.gasAmount + BigInt(route.fromAmount)\n }\n\n const gasCostsValues = Object.values(gasCosts)\n\n const balanceChecks = await Promise.allSettled(\n relevantAccounts.map((account) => {\n const relevantTokens = gasCostsValues\n .filter((gasCost) => gasCost.chain?.chainType === account.chainType)\n .map((item) => item.token)\n\n return getTokenBalancesWithRetry(\n sdkClient,\n account.address!,\n relevantTokens\n )\n })\n )\n\n const tokenBalances = balanceChecks\n .filter(\n (result): result is PromiseFulfilledResult<TokenAmount[]> =>\n result.status === 'fulfilled' && Boolean(result.value)\n )\n .flatMap((result) => result.value)\n\n if (!tokenBalances?.length) {\n return []\n }\n\n Object.keys(gasCosts).forEach((chainId) => {\n if (gasCosts[chainId]) {\n const gasTokenBalance =\n tokenBalances?.find(\n (t) =>\n t.chainId === gasCosts[chainId].token.chainId &&\n t.address === gasCosts[chainId].token.address\n )?.amount ?? 0n\n const insufficient =\n gasTokenBalance <= 0n \|\|\n gasTokenBalance < gasCosts[chainId].gasAmount \|\|\n gasTokenBalance < (gasCosts[chainId].tokenAmount ?? 0n)\n\n const insufficientAmount = insufficient\n ? gasCosts[chainId].tokenAmount\n ? gasCosts[chainId].tokenAmount! - gasTokenBalance\n : gasCosts[chainId].gasAmount - gasTokenBalance\n : undefined\n\n gasCosts[chainId] = {\n ...gasCosts[chainId],\n insufficient,\n insufficientAmount,\n chain: insufficient ? getChainById(Number(chainId)) : undefined,\n }\n }\n })\n\n const gasCostResult = Object.values(gasCosts).filter(\n (gasCost) => gasCost.insufficient\n )\n\n return gasCostResult\n },\n\n enabled: Boolean(\n !isContractAddress &&\n !isContractAddressLoading &&\n relevantAccounts.length > 0 &&\n route &&\n !hiddenUI?.insufficientGasMessage\n ),\n refetchInterval,\n staleTime: refetchInterval,\n })\n\n return {\n insufficientGas,\n isLoading,\n }\n}\n"],"mappings":"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"}

package/dist/esm/hooks/useLanguages.js CHANGED Viewed

@@ -1,8 +1,8 @@
 import { allLanguages } from "../providers/I18nProvider/constants.js";
 import { loadLocale } from "../providers/I18nProvider/i18n.js";
+import { getConfigItemSets, isItemAllowedForSets } from "../utils/item.js";
 import { useSettingsActions } from "../stores/settings/useSettingsActions.js";
 import { useWidgetConfig } from "../providers/WidgetProvider/WidgetProvider.js";
-import { getConfigItemSets, isItemAllowedForSets } from "../utils/item.js";
 import { useSettings } from "../stores/settings/useSettings.js";
 import { useCallback, useMemo } from "react";
 import { useTranslation } from "react-i18next";
@@ -14,7 +14,7 @@ const useLanguages = () => {
 	const { setValues } = useSettingsActions();
 	const sortedLanguages = useMemo(() => {
 		const loadedLanguageKeys = Object.keys(i18n.store.data);
-		const allLanguagesWithCustom = [...new Set([...allLanguages, ...loadedLanguageKeys])];
+		const allLanguagesWithCustom = [.../* @__PURE__ */ new Set([...allLanguages, ...loadedLanguageKeys])];
 		let supportedLanguages = [];
 		if (!languagesConfig) supportedLanguages = allLanguagesWithCustom;
 		else {

package/dist/esm/hooks/useLanguages.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useLanguages.js","names":[],"sources":["../../../src/hooks/useLanguages.ts"],"sourcesContent":["import { useCallback, useMemo } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { allLanguages } from '../providers/I18nProvider/constants.js'\nimport { loadLocale } from '../providers/I18nProvider/i18n.js'\nimport type {\n LanguageKey,\n LanguageResource,\n} from '../providers/I18nProvider/types.js'\nimport { useWidgetConfig } from '../providers/WidgetProvider/WidgetProvider.js'\nimport { useSettings } from '../stores/settings/useSettings.js'\nimport { useSettingsActions } from '../stores/settings/useSettingsActions.js'\nimport { getConfigItemSets, isItemAllowedForSets } from '../utils/item.js'\n\nexport const useLanguages = (): {\n availableLanguages: LanguageKey[]\n selectedLanguageCode: LanguageKey \| string\n setLanguageWithCode: (languageCode: LanguageKey) => void\n} => {\n const { i18n } = useTranslation()\n const { languages: languagesConfig, languageResources } = useWidgetConfig()\n const { language } = useSettings(['language'])\n const { setValues } = useSettingsActions()\n\n const sortedLanguages = useMemo(() => {\n const loadedLanguageKeys = Object.keys(i18n.store.data)\n // NB: custom language resources added statically to i18n might not exist in allLanguages (language files)\n const allLanguagesWithCustom = [\n ...new Set([...allLanguages, ...loadedLanguageKeys]),\n ]\n let supportedLanguages: (LanguageKey \| string)[] = []\n if (!languagesConfig) {\n supportedLanguages = allLanguagesWithCustom\n } else {\n const languagesConfigSets = getConfigItemSets(\n languagesConfig,\n (languages) => new Set(languages)\n )\n supportedLanguages = allLanguagesWithCustom.filter((language) =>\n isItemAllowedForSets(language, languagesConfigSets)\n )\n }\n return supportedLanguages.sort()\n }, [languagesConfig, i18n.store.data])\n\n const handleLanguageChange = useCallback(\n async (languageKey: string) => {\n // Cache the language resource to prevent blinking\n // after switching languages and reloading the page.\n let newLanguageCache: LanguageResource \| undefined\n if (\n !i18n.hasResourceBundle(languageKey, 'translation') &&\n languageKey !== 'en'\n ) {\n await loadLocale(\n languageKey as LanguageKey,\n languageResources?.[languageKey as LanguageKey]\n ).then((languageResource) => {\n i18n.addResourceBundle(\n languageKey,\n 'translation',\n languageResource,\n true,\n true\n )\n newLanguageCache = languageResource\n })\n } else {\n // If the language is already loaded, just cache the existing resource\n newLanguageCache = i18n.getResourceBundle(languageKey, 'translation')\n }\n\n // Set the new language and language cache to the settings store.\n setValues({ language: languageKey, languageCache: newLanguageCache })\n\n // Update the i18n instance to the new language.\n if (languageKey !== i18n.language) {\n await i18n.changeLanguage(languageKey)\n }\n },\n [i18n, languageResources, setValues]\n )\n\n const selectedLanguage = language \|\| i18n.resolvedLanguage \|\| ''\n const selectedLanguageCode = sortedLanguages.includes(selectedLanguage)\n ? selectedLanguage\n : languagesConfig?.default \|\| 'en'\n\n return {\n availableLanguages: sortedLanguages as LanguageKey[],\n selectedLanguageCode: selectedLanguageCode,\n setLanguageWithCode: handleLanguageChange,\n }\n}\n"],"mappings":";;;;;;;;;AAaA,MAAa,qBAIR;CACH,MAAM,EAAE,SAAS,eAAe;CAChC,MAAM,EAAE,WAAW,iBAAiB,sBAAsB,gBAAgB;CAC1E,MAAM,EAAE,aAAa,YAAY,CAAC,UAAU,CAAC;CAC7C,MAAM,EAAE,cAAc,mBAAmB;CAEzC,MAAM,kBAAkB,cAAc;EACpC,MAAM,qBAAqB,OAAO,KAAK,KAAK,MAAM,IAAI;EAEtD,MAAM,yBAAyB,CAC7B,~~GAAG~~,IAAI,IAAI,CAAC,GAAG,cAAc,GAAG,kBAAkB,CAAC,CACrD;EACA,IAAI,qBAA+C,CAAC;EACpD,IAAI,CAAC,iBACH,qBAAqB;OAChB;GACL,MAAM,sBAAsB,kBAC1B,kBACC,cAAc,IAAI,IAAI,SAAS,CAClC;GACA,qBAAqB,uBAAuB,QAAQ,aAClD,qBAAqB,UAAU,mBAAmB,CACpD;EACF;EACA,OAAO,mBAAmB,KAAK;CACjC,GAAG,CAAC,iBAAiB,KAAK,MAAM,IAAI,CAAC;CAErC,MAAM,uBAAuB,YAC3B,OAAO,gBAAwB;EAG7B,IAAI;EACJ,IACE,CAAC,KAAK,kBAAkB,aAAa,aAAa,KAClD,gBAAgB,MAEhB,MAAM,WACJ,aACA,oBAAoB,YACtB,~~EAAE~~,MAAM,qBAAqB;GAC3B,KAAK,kBACH,aACA,eACA,kBACA,MACA,IACF;GACA,mBAAmB;EACrB,CAAC;OAGD,mBAAmB,KAAK,kBAAkB,aAAa,aAAa;EAItE,UAAU;GAAE,UAAU;GAAa,eAAe;EAAiB,CAAC;EAGpE,IAAI,gBAAgB,KAAK,UACvB,MAAM,KAAK,eAAe,WAAW;CAEzC,GACA;EAAC;EAAM;EAAmB;CAAS,CACrC;CAEA,MAAM,mBAAmB,YAAY,KAAK,oBAAoB;CAK9D,OAAO;EACL,oBAAoB;EACpB,sBAN2B,gBAAgB,SAAS,gBAAgB,IAClE,mBACA,iBAAiB,WAAW;EAK9B,qBAAqB;CACvB;AACF"}
1	+ {"version":3,"file":"useLanguages.js","names":[],"sources":["../../../src/hooks/useLanguages.ts"],"sourcesContent":["import { useCallback, useMemo } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { allLanguages } from '../providers/I18nProvider/constants.js'\nimport { loadLocale } from '../providers/I18nProvider/i18n.js'\nimport type {\n LanguageKey,\n LanguageResource,\n} from '../providers/I18nProvider/types.js'\nimport { useWidgetConfig } from '../providers/WidgetProvider/WidgetProvider.js'\nimport { useSettings } from '../stores/settings/useSettings.js'\nimport { useSettingsActions } from '../stores/settings/useSettingsActions.js'\nimport { getConfigItemSets, isItemAllowedForSets } from '../utils/item.js'\n\nexport const useLanguages = (): {\n availableLanguages: LanguageKey[]\n selectedLanguageCode: LanguageKey \| string\n setLanguageWithCode: (languageCode: LanguageKey) => void\n} => {\n const { i18n } = useTranslation()\n const { languages: languagesConfig, languageResources } = useWidgetConfig()\n const { language } = useSettings(['language'])\n const { setValues } = useSettingsActions()\n\n const sortedLanguages = useMemo(() => {\n const loadedLanguageKeys = Object.keys(i18n.store.data)\n // NB: custom language resources added statically to i18n might not exist in allLanguages (language files)\n const allLanguagesWithCustom = [\n ...new Set([...allLanguages, ...loadedLanguageKeys]),\n ]\n let supportedLanguages: (LanguageKey \| string)[] = []\n if (!languagesConfig) {\n supportedLanguages = allLanguagesWithCustom\n } else {\n const languagesConfigSets = getConfigItemSets(\n languagesConfig,\n (languages) => new Set(languages)\n )\n supportedLanguages = allLanguagesWithCustom.filter((language) =>\n isItemAllowedForSets(language, languagesConfigSets)\n )\n }\n return supportedLanguages.sort()\n }, [languagesConfig, i18n.store.data])\n\n const handleLanguageChange = useCallback(\n async (languageKey: string) => {\n // Cache the language resource to prevent blinking\n // after switching languages and reloading the page.\n let newLanguageCache: LanguageResource \| undefined\n if (\n !i18n.hasResourceBundle(languageKey, 'translation') &&\n languageKey !== 'en'\n ) {\n await loadLocale(\n languageKey as LanguageKey,\n languageResources?.[languageKey as LanguageKey]\n ).then((languageResource) => {\n i18n.addResourceBundle(\n languageKey,\n 'translation',\n languageResource,\n true,\n true\n )\n newLanguageCache = languageResource\n })\n } else {\n // If the language is already loaded, just cache the existing resource\n newLanguageCache = i18n.getResourceBundle(languageKey, 'translation')\n }\n\n // Set the new language and language cache to the settings store.\n setValues({ language: languageKey, languageCache: newLanguageCache })\n\n // Update the i18n instance to the new language.\n if (languageKey !== i18n.language) {\n await i18n.changeLanguage(languageKey)\n }\n },\n [i18n, languageResources, setValues]\n )\n\n const selectedLanguage = language \|\| i18n.resolvedLanguage \|\| ''\n const selectedLanguageCode = sortedLanguages.includes(selectedLanguage)\n ? selectedLanguage\n : languagesConfig?.default \|\| 'en'\n\n return {\n availableLanguages: sortedLanguages as LanguageKey[],\n selectedLanguageCode: selectedLanguageCode,\n setLanguageWithCode: handleLanguageChange,\n }\n}\n"],"mappings":";;;;;;;;;AAaA,MAAa,qBAIR;CACH,MAAM,EAAE,SAAS,eAAe;CAChC,MAAM,EAAE,WAAW,iBAAiB,sBAAsB,gBAAgB;CAC1E,MAAM,EAAE,aAAa,YAAY,CAAC,UAAU,CAAC;CAC7C,MAAM,EAAE,cAAc,mBAAmB;CAEzC,MAAM,kBAAkB,cAAc;EACpC,MAAM,qBAAqB,OAAO,KAAK,KAAK,MAAM,IAAI;EAEtD,MAAM,yBAAyB,CAC7B,mBAAG,IAAI,IAAI,CAAC,GAAG,cAAc,GAAG,kBAAkB,CAAC,CACrD;EACA,IAAI,qBAA+C,CAAC;EACpD,IAAI,CAAC,iBACH,qBAAqB;OAChB;GACL,MAAM,sBAAsB,kBAC1B,kBACC,cAAc,IAAI,IAAI,SAAS,CAClC;GACA,qBAAqB,uBAAuB,QAAQ,aAClD,qBAAqB,UAAU,mBAAmB,CACpD;EACF;EACA,OAAO,mBAAmB,KAAK;CACjC,GAAG,CAAC,iBAAiB,KAAK,MAAM,IAAI,CAAC;CAErC,MAAM,uBAAuB,YAC3B,OAAO,gBAAwB;EAG7B,IAAI;EACJ,IACE,CAAC,KAAK,kBAAkB,aAAa,aAAa,KAClD,gBAAgB,MAEhB,MAAM,WACJ,aACA,oBAAoB,YACtB,CAAC,CAAC,MAAM,qBAAqB;GAC3B,KAAK,kBACH,aACA,eACA,kBACA,MACA,IACF;GACA,mBAAmB;EACrB,CAAC;OAGD,mBAAmB,KAAK,kBAAkB,aAAa,aAAa;EAItE,UAAU;GAAE,UAAU;GAAa,eAAe;EAAiB,CAAC;EAGpE,IAAI,gBAAgB,KAAK,UACvB,MAAM,KAAK,eAAe,WAAW;CAEzC,GACA;EAAC;EAAM;EAAmB;CAAS,CACrC;CAEA,MAAM,mBAAmB,YAAY,KAAK,oBAAoB;CAK9D,OAAO;EACL,oBAAoB;EACpB,sBAN2B,gBAAgB,SAAS,gBAAgB,IAClE,mBACA,iBAAiB,WAAW;EAK9B,qBAAqB;CACvB;AACF"}