-
9694368: Resolved an issue where the Rainbow Button styling was not exported. You can now import the styling in your project like so:
import "@rainbow-me/rainbow-button/styles.css";
-
Updated dependencies [2180ddd]
-
Updated dependencies [fea278a]
- @rainbow-me/rainbowkit@2.1.2
- Updated dependencies [725a376]
- Updated dependencies [9be5452]
- @rainbow-me/rainbowkit@2.1.1
- Updated dependencies [90d6931]
- Updated dependencies [82153ed]
- @rainbow-me/rainbowkit@2.1.0
- Updated dependencies [8841891]
- @rainbow-me/rainbowkit@2.0.8
- Updated dependencies [af4ea4e]
- Updated dependencies [f0b3b25]
- @rainbow-me/rainbowkit@2.0.7
- Updated dependencies [7ab6e50]
- Updated dependencies [515498f]
- @rainbow-me/rainbowkit@2.0.6
- Updated dependencies [81ba812]
- Updated dependencies [fc4d7e1]
- Updated dependencies [1a0f209]
- Updated dependencies [b11118f]
- Updated dependencies [4dd1e45]
- Updated dependencies [ec41346]
- @rainbow-me/rainbowkit@2.0.5
- Updated dependencies [77dcec3]
- Updated dependencies [6c240ba]
- Updated dependencies [34419b5]
- Updated dependencies [5c60239]
- @rainbow-me/rainbowkit@2.0.4
- Updated dependencies [b80e8fa]
- Updated dependencies [985b80b]
- Updated dependencies [b25db9a]
- @rainbow-me/rainbowkit@2.0.3
- Updated dependencies [524d7a0]
- Updated dependencies [2f637e4]
- Updated dependencies [c021746]
- Updated dependencies [df572f1]
- @rainbow-me/rainbowkit@2.0.2
- Updated dependencies [5149dbd]
- Updated dependencies [1e7d3f4]
- Updated dependencies [c16541a]
- Updated dependencies [dbca966]
- Updated dependencies [f69c0e1]
- Updated dependencies [bb56562]
- Updated dependencies [1a08977]
- @rainbow-me/rainbowkit@2.0.1
-
aa0269e: Breaking:
The wagmi and viem peer dependencies have reached
2.x.x
with breaking changes.Follow the steps below to migrate.
1. Upgrade Rainbow Button,
wagmi
, andviem
to their latest versions**npm i @rainbow-me/rainbow-button@2 wagmi@2 viem@2.x
2. Install
@tanstack/react-query
peer dependencyWith Wagmi v2, TanStack Query is now a required peer dependency.
Install it with the following command:
npm i @tanstack/react-query
3. Upgrade your Rainbow Button and Wagmi configurations
RainbowConnector
is nowrainbowConnector
, and requiresappName
and no longer accepts thechains
parameter.- import { RainbowConnector } from '@rainbow-me/rainbow-button' + import { rainbowConnector } from '@rainbow-me/rainbow-button' import { createConfig } from 'wagmi' const config = createConfig({ - connectors: [new RainbowConnector({ chains, projectId })], + connectors: [ + rainbowConnector({ + appName: "RainbowKit demo", + projectId: "YOUR_PROJECT_ID", + }), + ], })
Follow the Wagmi v2 Migration Guide for additional configuration changes.
4. Check for breaking changes in
wagmi
andviem
If you use
wagmi
hooks andviem
actions in your dApp, you will need to follow the full migration guides for v2:
- Updated dependencies [aa0269e]
- @rainbow-me/rainbowkit@2.0.0
- Updated dependencies [33a8266]
- @rainbow-me/rainbowkit@1.3.6
- Updated dependencies [2b0c7b3]
- @rainbow-me/rainbowkit@1.3.5
- Updated dependencies [c0a644a]
- Updated dependencies [41616b9]
- Updated dependencies [cf4955f]
- Updated dependencies [e5f5f03]
- Updated dependencies [c0bd68e]
- Updated dependencies [a79609b]
- @rainbow-me/rainbowkit@1.3.4
- Updated dependencies [24b5a88]
- Updated dependencies [7565fb2]
- Updated dependencies [5a184e9]
- @rainbow-me/rainbowkit@1.3.3
- Updated dependencies [7ba94f48]
- @rainbow-me/rainbowkit@1.3.2
- Updated dependencies [3feab0e6]
- Updated dependencies [c9a8e469]
- Updated dependencies [dba51779]
- @rainbow-me/rainbowkit@1.3.1
-
9ce75a65: The
RainbowButton
component is the simplest way to add support for Rainbow Wallet to dApps that usewagmi
and prefer a more custom connector experience over RainbowKit.1. Install
@rainbow-me/rainbow-button
and its peer dependenciesThe package is compatible with Next.js, React, and Vite. Ensure that you follow peer dependency warnings.
npm install @rainbow-me/rainbow-button wagmi viem
2. Configure with Wagmi and install the RainbowButton
Pass an instance of the
RainbowConnector
to your Wagmi connector list, and wrap your app in theRainbowButtonProvider
. Then drop-in theRainbowButton
component into your wallet list.import "@rainbow-me/rainbow-button/styles.css"; import { RainbowButtonProvider, RainbowConnector, } from "@rainbow-me/rainbow-button"; const config = createConfig({ connectors: [new RainbowConnector({ chains, projectId })], publicClient, }); function MyApp({ Component, pageProps }: AppProps) { return ( <WagmiConfig config={config}> <RainbowButtonProvider>{/* Your App */}</RainbowButtonProvider> </WagmiConfig> ); } export const YourApp = () => { return <RainbowButton />; };
You can also use the
RainbowButton.Custom
component for custom implementations and styling.<RainbowButton.Custom> {({ ready, connect }) => { return ( <button type="button" disabled={!ready} onClick={connect}> Connect Rainbow </button> ); }} </RainbowButton.Custom>
3. And that's it!
Now your users can enjoy a seamless connection experience for Rainbow β without any maintenance or headaches.
A
WalletButton
component is also available in RainbowKit if you'd like to adopt support for additional wallets.
- Updated dependencies [9ce75a65]
- @rainbow-me/rainbowkit@1.3.0
- Initial beta release