Rainbow logo
RainbowKit
2.1.6

Redes

Redes

Ícones de cadeia personalizados

RainbowKit é projetado para integrar com objeto chain do wagmi. Confira a lista de redes suportadas aqui.

Por padrão, o RainbowKit se conectará à primeira rede em seu array chains para garantir que os usuários não sejam imediatamente apresentados ao estado "Rede errada". Esse comportamento pode ser personalizado através da propriedade initialChain.

A cadeia inicial pode ser configurada usando um ID de cadeia.

<RainbowKitProvider initialChain={1}>

Para sua conveniência, você também pode passar um objeto de cadeia.

<RainbowKitProvider initialChain={mainnet}>

Vários ícones de cadeia são fornecidos por padrão, mas você pode personalizar o ícone para cada cadeia usando a propriedade iconUrl.

Exemplo com getDefaultConfig

import { mainnet, optimism } from 'wagmi/chains';
const config = getDefaultConfig({
chains: [
{
...mainnet,
iconBackground: '#000',
iconUrl: 'https://example.com/icons/ethereum.png',
},
{
...optimism,
iconBackground: '#ff0000',
iconUrl: 'https://example.com/icons/optimism.png',
},
],
});

Exemplo com createConfig

import { mainnet, optimism } from 'wagmi/chains';
import { Chain } from '@rainbow-me/rainbowkit';
const chains: readonly [Chain, ...Chain[]] = [
{
...mainnet,
iconBackground: '#000',
iconUrl: 'https://example.com/icons/ethereum.png',
},
{
...optimism,
iconBackground: '#ff0000',
iconUrl: 'https://example.com/icons/optimism.png',
},
];
const config = createConfig({
chains,
});