feat(checkout): restrict to EVM chains and hide native gas token

- Force chains.types to EVM-only; cascades to chains, tokens, routes, wallets
- Hide native gas token in transfer/exchange/cash flows (IF can't accept it)
- Wallet menu now honors chains.types ecosystem allow/deny config

Author: tomiiide

.changeset/checkout-evm-only.md

@@ -0,0 +1,10 @@
+---
+"@lifi/widget-checkout": minor
+"@lifi/widget": minor
+---
+
+Restrict checkout to EVM chains and tokens, and hide the native gas token in deposit flows.
+
+Checkout now forces `chains.types` to EVM-only, so chain lists, token lists, route quotes, and wallet/recipient selection surface only EVM chains and their native + ERC20 tokens. The native gas token is hidden from source-token selection in the transfer/exchange/cash (Intent Factory) flows, which cannot accept it; the wallet flow keeps full token support.
+
+`@lifi/widget`'s wallet menu now honors the `chains.types` allow/deny config, so a restricted ecosystem set only offers wallets for the allowed chain types.

packages/widget-checkout/src/pages/SelectSourcePage/SelectSourcePage.tsx

@@ -38,6 +38,7 @@ import {
   DEFAULT_FROM_CHAIN_ID,
   DEFAULT_FROM_TOKEN_ADDRESS,
 } from '../../utils/checkoutDefaults.js'
+import { isNativeToken } from '../../utils/nativeToken.js'
 import { checkoutNavigationRoutes } from '../../utils/navigationRoutes.js'
 import { CheckoutActivitySection } from './CheckoutActivitySection.js'
 import { SelectSourceFundingOptions } from './SelectSourceFundingOptions.js'
@@ -164,8 +165,23 @@ export const SelectSourcePage: React.FC = () => {
   const handleTransferCrypto = useCallback(() => {
     overrideExchanges([...INTENT_FACTORY_ONLY])
     setFundingSource('transfer')
+    // IF deposits can't accept the native gas token; reset a carried-over pick.
+    if (isNativeToken(prevTokenAddress)) {
+      setFieldValue(FormKeyHelper.getChainKey('from'), DEFAULT_FROM_CHAIN_ID)
+      setFieldValue(
+        FormKeyHelper.getTokenKey('from'),
+        DEFAULT_FROM_TOKEN_ADDRESS
+      )
+      setFieldValue(FormKeyHelper.getAmountKey('from'), '')
+    }
     goToToken()
-  }, [goToToken, overrideExchanges, setFundingSource])
+  }, [
+    goToToken,
+    overrideExchanges,
+    prevTokenAddress,
+    setFieldValue,
+    setFundingSource,
+  ])
 
   const pinExchangeSource = useCallback(() => {
     overrideExchanges([...INTENT_FACTORY_ONLY])

packages/widget-checkout/src/pages/SelectTokenPage/SelectTokenList.tsx

@@ -17,6 +17,7 @@ import { Box } from '@mui/material'
 import type { RefObject } from 'react'
 import { type FC, memo, useCallback, useEffect, useMemo, useRef } from 'react'
 import { useCheckoutFlowStore } from '../../stores/useCheckoutFlowStore.js'
+import { isNativeToken } from '../../utils/nativeToken.js'
 
 export interface SelectTokenListProps {
   formType: FormType
@@ -38,6 +39,8 @@ type SharedListProps = Omit<SelectTokenListProps, 'isWalletFunded'> & {
   selectedTokenAddress?: string
   isAllNetworks: boolean
   tokenSearchFilter?: string
+  // IF deposit flows can't accept the native gas token; only the wallet flow keeps it.
+  excludeNative: boolean
 }
 
 type TokenListResult = ReturnType<typeof useTokenBalances>
@@ -47,6 +50,7 @@ const TokenListView: FC<SharedListProps & TokenListResult> = ({
   headerRef,
   afterTokenSelect,
   allowedSymbols,
+  excludeNative,
   selectedChainId,
   selectedTokenAddress,
   isAllNetworks,
@@ -75,15 +79,18 @@ const TokenListView: FC<SharedListProps & TokenListResult> = ({
   )
 
   const filteredTokens = useMemo(() => {
+    const withoutNative = excludeNative
+      ? tokens.filter((token) => !isNativeToken(token.address))
+      : tokens
     if (!allowedSymbols || allowedSymbols.size === 0) {
-      return tokens
+      return withoutNative
     }
     // Strip on-wallet amounts — the curated list funds from an exchange,
     // not the connected wallet — regardless of which hook fed the list.
-    return tokens
+    return withoutNative
       .filter((token) => allowedSymbols.has(token.symbol.toUpperCase()))
       .map((token) => ({ ...token, amount: undefined }))
-  }, [tokens, allowedSymbols])
+  }, [tokens, allowedSymbols, excludeNative])
 
   const showCategories =
     !allowedSymbols && withCategories && !tokenSearchFilter && !isAllNetworks
@@ -170,6 +177,7 @@ export const SelectTokenList: FC<SelectTokenListProps> = memo(
       headerRef,
       afterTokenSelect,
       allowedSymbols,
+      excludeNative: !isWalletFunded,
       selectedChainId,
       selectedTokenAddress,
       isAllNetworks,

packages/widget-checkout/src/pages/SelectTokenPage/SelectTokenPage.tsx

@@ -34,10 +34,8 @@ export const SelectTokenPage: React.FC = () => {
   const fundingSource = useCheckoutFlowStore((s) => s.fundingSource)
   const isWalletFunded = useIsWalletFundedFlow()
   const isExchangeFlow = fundingSource === 'exchange'
-  const exchangeAllowedSymbols = useMemo(
-    () => new Set(['USDC', 'USDT', 'ETH']),
-    []
-  )
+  // IF deposits can't accept the native gas token, so the curated set is ERC20-only.
+  const exchangeAllowedSymbols = useMemo(() => new Set(['USDC', 'USDT']), [])
   const hideChainSelect = hiddenUI?.chainSelect || isExchangeFlow
 
   const isMobile = useMediaQuery((theme: Theme) =>

packages/widget-checkout/src/utils/checkoutToWidgetConfig.test.ts

@@ -1,3 +1,4 @@
+import { ChainType } from '@lifi/sdk'
 import { describe, expect, it } from 'vitest'
 import type { CheckoutConfig } from '../types/config.js'
 import { checkoutConfigToWidgetConfig } from './checkoutToWidgetConfig.js'
@@ -57,4 +58,26 @@ describe('checkoutConfigToWidgetConfig', () => {
     const result = checkoutConfigToWidgetConfig(minimalCheckout)
     expect(result.integrator).toBe('test-integrator')
   })
+
+  it('forces EVM-only chain types', () => {
+    const result = checkoutConfigToWidgetConfig(minimalCheckout)
+    expect(result.chains?.types?.allow).toEqual([ChainType.EVM])
+  })
+
+  it('preserves integrator chain-id allow alongside the forced EVM type lock', () => {
+    const result = checkoutConfigToWidgetConfig({
+      integrator: 'x',
+      config: { chains: { allow: [1, 137] } },
+    })
+    expect(result.chains?.allow).toEqual([1, 137])
+    expect(result.chains?.types?.allow).toEqual([ChainType.EVM])
+  })
+
+  it('overrides an integrator-supplied non-EVM chain type', () => {
+    const result = checkoutConfigToWidgetConfig({
+      integrator: 'x',
+      config: { chains: { types: { allow: [ChainType.SVM] } } },
+    })
+    expect(result.chains?.types?.allow).toEqual([ChainType.EVM])
+  })
 })

packages/widget-checkout/src/utils/checkoutToWidgetConfig.ts

@@ -1,3 +1,4 @@
+import { ChainType } from '@lifi/sdk'
 import type { WidgetConfig } from '@lifi/widget/shared'
 import type { CheckoutConfig } from '../types/config.js'
 
@@ -15,6 +16,11 @@ export function checkoutConfigToWidgetConfig(
   // toChain/toToken/toAddress are required config; CheckoutConfigGuard blocks when missing.
   return {
     ...merged,
+    // EVM-only for now; cascades to chains, tokens, routes, and the wallet menu.
+    chains: {
+      ...merged.chains,
+      types: { allow: [ChainType.EVM] },
+    },
     hiddenUI: {
       ...merged.hiddenUI,
       toToken: true,

packages/widget-checkout/src/utils/nativeToken.test.ts

@@ -0,0 +1,27 @@
+import { describe, expect, it } from 'vitest'
+import { isNativeToken, NATIVE_TOKEN_ADDRESS } from './nativeToken.js'
+
+describe('isNativeToken', () => {
+  it('matches the zero sentinel address', () => {
+    expect(isNativeToken(NATIVE_TOKEN_ADDRESS)).toBe(true)
+  })
+
+  it('is case-insensitive', () => {
+    expect(isNativeToken('0x0000000000000000000000000000000000000000')).toBe(
+      true
+    )
+    expect(isNativeToken('0X0000000000000000000000000000000000000000')).toBe(
+      true
+    )
+  })
+
+  it('returns false for ERC20 addresses', () => {
+    expect(isNativeToken('0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48')).toBe(
+      false
+    )
+  })
+
+  it('returns false for undefined', () => {
+    expect(isNativeToken(undefined)).toBe(false)
+  })
+})

packages/widget-checkout/src/utils/nativeToken.ts

@@ -0,0 +1,4 @@
+export const NATIVE_TOKEN_ADDRESS = '0x0000000000000000000000000000000000000000'
+
+export const isNativeToken = (address?: string): boolean =>
+  address?.toLowerCase() === NATIVE_TOKEN_ADDRESS

packages/widget/src/providers/WalletProvider/WalletProvider.tsx

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