Wagmi is an Ethereum Viem-based React library which can be used with MetaMask or TAILWIND.
Download TAILWIND extension
Download TAILWIND wallet adapter
yarn add @tailwindzone/connect-wagmi
Copy Viem chain information for sei
import { seimainnet } from "@tailwindzone/connect-wagmi/chains"
Use TAILWIND as an Ethereum Provider
import { tailwindConnector } from "@tailwindzone/connect-wagmi"; import { QueryClient, QueryClientProvider } from '@tanstack/react-query' import { createConfig } from "wagmi"; import { http } from "viem"; const config = createConfig({ chains: [seimainnet], connectors: [ tailwindConnector(), // other connectors metaMask(), coinbaseWallet() here ], transports: { [seimainnet.id]: http(), } }) function Provider() { const queryClient = new QueryClient() return ( <WagmiProvider config={config}> <QueryClientProvider client={queryClient}> { /* Your App goes here */ } <App /> </QueryClientProvider> </WagmiProvider> ) }
Sign a sample transaction
function App() { const { account, chainId, sendTransaction } = useWagmi() const handleClick = async () => { const result = await sendTransaction(config, { to: "0x332Ef165ee102525f943F267B2AbE08B93eD7D13", value: parseEther('0.01'), }) // display result hash here // console.log(result) } return ( <div> <button onClick={handleClick}>Send Transaction</button> </div> ) }
Done!