/chains

Support your networks with "opstack-kit"

install: npm i opstack-kit
type: /chains
import: opstack-kit/chains

import { sepolia, optimismSepolia } from 'opstack-kit/chains'

Support networks

L1

L1 - Testnet
sepolia, holesky

L1 - Mainnet
mainnet

L2

L2 - Testnet
optimismSepolia, baseSepolia, zoraSepolia, fraxtalHolesky, modeTestnet, soneiumMinato, garnetHolesky, unichainSepolia, inkSepolia

L2 - Mainnet
optimism, base, zora, fraxtal, mode, redstone

Check out the github for more.

Custom Network Chains

Opstack Kit works with OP Stack chains. By adding viem can quickly add your chain and use it right away.

customChains.tsx

import { defineChain } from 'viem'
import { chainConfig } from 'viem/op-stack'

const sourceId = 123 // number = L1

export const customChains = defineChain({ // string = Name
  ...chainConfig,
  id: 111222333, // number
  name: 'customChains', // string = Name
  nativeCurrency: { name: 'XXX', symbol: 'XXX', decimals: 18 }, // string
  rpcUrls: {
    default: {
      http: ['https://xxxURL-RPCxxx.com'], // string = url
    },
  },
  blockExplorers: {
    default: {
      name: 'ExampleChain Scan', // string
      url: 'https://xxxURLxxx.com/', // string = url
      apiUrl: 'https://xxxURLxxx.com/api', // string = url
    },
  },
  contracts: {
    ...chainConfig.contracts,
    l2OutputOracle: {
      [sourceId]: {
        address: '0xXXX', // string
      },
    },
    portal: {
      [sourceId]: {
        address: '0xXXX', // string
      },
    },
    l1StandardBridge: {
      [sourceId]: {
        address: '0xXXX', // string
      },
    },

    // Others - add your want SmartContarct L2

    // multicall3: {
    //   [sourceId]: {
    //     address: '0xXXX', // string
    //   },
    // },

    // disputeGameFactory: {
    //   [sourceId]: {
    //     address: '0xXXX', // string
    //   },
    // },
  },
  testnet: true,
  sourceId,
});

main/config.ts

//** main.ts */
...
// import file = customChains
import { customChains } from './customChains'

...
...
...
const config = getDefaultConfig({
  appName: 'My RainbowKit App',
  projectId: import.meta.env.VITE_SOME_KEY,
  chains: [sepolia, customChains], // place
  ssr: true,
});

---------------------------------------------------------

//** config.ts */
import { createConfig, http } from 'wagmi'
import { sepolia, optimismSepolia } from 'opstack-kit/chains'
// import file = customChains
import { customChains } from './customChains'

export const config = createConfig({
  chains: [sepolia, customChains], // place
  transports: {
    [sepolia.id]: http(),
    [customChains.id]: http(), // place
  },
})

Template starter: react+rainbowkit