βš™
Configuration
LI.FI Widget supports default chains and tokens configuration, allowing you to preselect default source and destination chains and tokens as well as destination token amount.
The example below shows how to preconfigure default chains and tokens.
import { LiFiWidget, WidgetConfig } from '@lifi/widget';
import { useMemo } from 'react';
​
export const WidgetPage = () => {
const widgetConfig: WidgetConfig = useMemo(() => ({
// set source chain to Polygon
fromChain: 137,
// set destination chain to Optimism
toChain: 10,
// set source token to USDC (Polygon)
fromToken: '0x2791bca1f2de4661ed88a30c99a7a9449aa84174',
// set source token to USDC (Optimism)
toToken: '0x7f5c764cbc14f9669b88837ca1490cca17c31607',
// set source token amount to 10 USDC (Polygon)
fromAmount: 10,
}), []);
​
return <LiFiWidget config={widgetConfig} />;
};
There is also a disabledChains option to disable certain chains from being shown to the user.
import { LiFiWidget, WidgetConfig } from '@lifi/widget';
import { useMemo } from 'react';
​
export const WidgetPage = () => {
const widgetConfig: WidgetConfig = useMemo(() => ({
// set source chain to Polygon
fromChain: 137,
// set destination chain to Optimism
toChain: 10,
// set source token to USDC (Polygon)
fromToken: '0x2791bca1f2de4661ed88a30c99a7a9449aa84174',
// set source token to USDC (Optimism)
toToken: '0x7f5c764cbc14f9669b88837ca1490cca17c31607',
// set source token amount to 10 USDC (Polygon)
fromAmount: 10,
// disable BSC from being shown in the chains list
disabledChains: [56],
}), []);
​
return <LiFiWidget config={widgetConfig} />;
};
Find more configuration options in API Reference.
Copy link