Releases: rainbow-me/rainbowkit
@rainbow-me/[email protected]
Patch Changes
- f542876: The
metaMaskWallet
wallet connector now utilizes the MetaMask SDK for more reliable, faster connections on mobile
@rainbow-me/[email protected]
Patch Changes
- a147620: Fixed error handling when connect requests are rejected on mobile.
- 10090d2: Mitigated
WalletConnect Core is already initialized
warnings that began appearing with recent distributions of Wagmi and WalletConnect. - 50c7f13: Added missing
rdns
metadata for wallet connectors that now support EIP-6963. - 15ddd4a: Improved QR Code error correction and rendering with
cuer
@rainbow-me/[email protected]
Patch Changes
-
624a38a: The
coinbaseWallet
connector now supports additional SDK configuration options to enable Paymasters and Sub Accounts for your dapp.import { coinbaseWallet } from "@rainbow-me/rainbowkit/wallets"; // Configure Paymaster for gas sponsorship coinbaseWallet.paymasterUrls = { [base.id]: "...", }; // Enable Sub Accounts coinbaseWallet.subAccounts = { enableAutoSubAccounts: true, defaultSpendLimits: { // ... }, };
-
f6ad6aa: Added support for Superposition chain
@rainbow-me/[email protected]
Patch Changes
- 03ae0d0: Added xPortal Wallet support with
xPortalWallet
wallet connector - 3d73508: Added ZilPay Wallet support with
zilPayWallet
wallet connector - 5b54649: MEW Wallet now supports WalletConnect on mobile
- c5a9cc1: Fixed SVG encoding in wallet connector icons for Cool Mode
- 8515fd3: Resolved a warning for mismatched dApp url metadata on recent versions of WalletConnect
@rainbow-me/[email protected]
Patch Changes
- f5a7cec: Added support for Unichain
- a765cfc: Added support for ApeChain, Berachain, Degen, Gravity, Ink, Linea, and Sanko
- 9c9c491: Added Backpack support with
backpackWallet
wallet connector - f89eb92: Improved support for the Binance Wallet dApp browser
- a765cfc: Updated icons for Arbitrum, Blast, Gnosis, Scroll, and zkSync
- e4547b8: Added icon for HyperEVM chain
@rainbow-me/[email protected]
Patch Changes
- b5a7878: Updated OP Mainnet branding
@rainbow-me/[email protected]
Patch Changes
- f533ac2: Support for React 19.
@rainbow-me/[email protected]
Patch Changes
- 5b8e146: Added
de-DE
andde
locale support for the German language. - 7fceab8: Added
ms-MY
andms
locale support for the Malay language. - 9dd23d9: Added BeraSig support with
berasigWallet
wallet connector - 3469982: Added Wigwam support with
wigwamWallet
wallet connector - 0c6af55: Added icon for Flow chain
@rainbow-me/[email protected]
Minor Changes
-
f02bced: The Authentication API now supports ERC-1271 and ERC-6492 for smart contract signature verification to enable Sign-in with Ethereum for Smart Contract Wallets, including Coinbase Smart Wallet and Argent.
We have also deprecated the
siwe
andethers
peer dependencies in favor ofviem/siwe
to make RainbowKit even more seamless.No changes are necessary for dApps that don't rely on the Authentication API.
Follow the appropriate steps below to migrate.
NextAuth Authentication
- Remove
siwe
andethers
npm uninstall siwe ethers
- Upgrade RainbowKit,
rainbowkit-siwe-next-auth
, andviem
npm i @rainbow-me/rainbowkit@^2.2.0 rainbow-me/rainbowkit-siwe-next-auth@^0.5.0 viem@^2.12.0
- Create a Public Client
This allows
viem
to verify smart contract signatures.const config = getDefaultConfig({ /* your config */ }); + const publicClient = config.getClient().extend(publicActions);
- Adjust your
authorize
implementation in/api/auth/[...nextauth].ts
- import { SiweMessage } from 'siwe'; + import { + type SiweMessage, + parseSiweMessage, + validateSiweMessage, + } from 'viem/siwe'; export function getAuthOptions(req: IncomingMessage): NextAuthOptions { const providers = [ CredentialsProvider({ async authorize(credentials: any) { - const siwe = new SiweMessage( - JSON.parse(credentials?.message || '{}'), - ); + const siweMessage = parseSiweMessage( + credentials?.message, + ) as SiweMessage; + if (!validateSiweMessage({ + address: siweMessage?.address, + message: siweMessage, + })) { + return null; + } /* ... */ - await siwe.verify({ signature: credentials?.signature || '' }); + const valid = await publicClient.verifyMessage({ + address: siweMessage?.address, + message: credentials?.message, + signature: credentials?.signature, + }); + if (!valid) { + return null; + } }, /* ... */ }) ] }
Reference the with-next-siwe-next-auth example for more guidance.
Custom Authentication
- Remove
siwe
andethers
npm uninstall siwe ethers
- Upgrade RainbowKit and
viem
npm i @rainbow-me/rainbowkit@^2.2.0 viem@^2.12.0
- Create a Public Client
This allows
viem
to verify smart contract signatures.const config = getDefaultConfig({ /* your config */ }); + const publicClient = config.getClient().extend(publicActions);
- Adjust your
createAuthenticationAdapter
implementation
- import { SiweMessage } from 'siwe'; + import { createSiweMessage } from 'viem/siwe'; createAuthenticationAdapter({ getNonce: async () => { const response = await fetch('/api/nonce'); return await response.text(); }, createMessage: ({ nonce, address, chainId }) => { - return new SiweMessage({ + return createSiweMessage({ domain: window.location.host, address, statement: 'Sign in with Ethereum to the app.', uri: window.location.origin, version: '1', chainId, nonce, }); }, - getMessageBody: ({ message }) => { - return message.prepareMessage(); - }, /* ... */ })
- Adopt
generateSiweNonce
- import { generateNonce } from 'siwe'; + import { generateSiweNonce } from 'viem/siwe'; - req.session.nonce = generateNonce(); + req.session.nonce = generateSiweNonce();
- Adopt
parseSiweMessage
andverifyMessage
if your Verify handler
- import { SiweMessage } from 'siwe'; + import { parseSiweMessage, type SiweMessage } from 'viem/siwe'; const { message, signature } = req.body; - const siweMessage = new SiweMessage(message); - const { success, error, data } = await siweMessage.verify({ - signature, - }); + const siweMessage = parseSiweMessage(message) as SiweMessage; + const success = await publicClient.verifyMessage({ + address: siweMessage.address, + message, + signature, + }); - if (!success) throw error; + if (!success) throw new Error('Invalid signature.'); - if (data.nonce !== req.session.nonce) + if (siweMessage.nonce !== req.session.nonce) + return res.status(422).json({ message: 'Invalid nonce.' });
Reference the with-next-siwe-iron-session example for more guidance.
- Remove
@rainbow-me/[email protected]
Minor Changes
-
f02bced: The Authentication API now supports ERC-1271 and ERC-6492 for smart contract signature verification to enable Sign-in with Ethereum for Smart Contract Wallets.
We have also deprecated the
siwe
andethers
peer dependencies in favor ofviem/siwe
.Follow the appropriate steps below to migrate.
- Remove
siwe
andethers
npm uninstall siwe ethers
- Upgrade RainbowKit,
rainbowkit-siwe-next-auth
, andviem
npm i @rainbow-me/rainbowkit@^2.2.0 rainbow-me/rainbowkit-siwe-next-auth@^0.5.0 viem@^2.12.0
- Create a Public Client
This allows
viem
to verify smart contract signatures.const config = getDefaultConfig({ /* your config */ }); + const publicClient = config.getClient().extend(publicActions);
- Adjust your
authorize
implementation in/api/auth/[...nextauth].ts
- import { SiweMessage } from 'siwe'; + import { + type SiweMessage, + parseSiweMessage, + validateSiweMessage, + } from 'viem/siwe'; export function getAuthOptions(req: IncomingMessage): NextAuthOptions { const providers = [ CredentialsProvider({ async authorize(credentials: any) { - const siwe = new SiweMessage( - JSON.parse(credentials?.message || '{}'), - ); + const siweMessage = parseSiweMessage( + credentials?.message, + ) as SiweMessage; + if (!validateSiweMessage({ + address: siweMessage?.address, + message: siweMessage, + })) { + return null; + } /* ... */ - await siwe.verify({ signature: credentials?.signature || '' }); + const valid = await publicClient.verifyMessage({ + address: siweMessage?.address, + message: credentials?.message, + signature: credentials?.signature, + }); + if (!valid) { + return null; + } }, /* ... */ }) ] }
Reference the with-next-siwe-next-auth example for more guidance.
- Remove