chore: update versions (alpha)

.changeset/pre.json

@@ -8,6 +8,7 @@
     "website": "0.0.1"
   },
   "changesets": [
-    "dirty-panthers-enjoy"
+    "dirty-panthers-enjoy",
+    "quick-squids-rush"
   ]
 }

packages/walletkit/CHANGELOG.md

@@ -1,13 +1,17 @@
 # @node-real/walletkit
 
+## 2.0.2-alpha.0
+
+### Patch Changes
+
+- 90846a4: fix: ssr no need to wait for the provider to be ready
 
 ## 2.0.1
 
 ### Patch Changes
 
 - 83c5001: feat: Upgrade wagmi & viem to 2.x
 
-
 ## 2.0.1-alpha.0
 
 ### Patch Changes

packages/walletkit/README.md

@@ -22,57 +22,69 @@ The following examples are provided in the [examples](./examples/) folder of thi
 ## Installation
 
 ```bash
-npm i @node-real/walletkit wagmi viem
-
+npm i @node-real/walletkit@^2 wagmi@^2 viem@^2 @tanstack/react-query@^5
 ```
 
 ## Usage
 
 ```tsx
 import '@node-real/walletkit/styles.css';
-import { WagmiConfig, createConfig } from 'wagmi';
-import { chains } from './chains';
+
+import { trustWallet, metaMask, walletConnect } from '@node-real/walletkit/wallets';
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import {
+  defaultWagmiConfig,
+  SwitchNetworkModal,
   WalletKitButton,
-  WalletKitProvider,
-  getDefaultConfig,
   WalletKitOptions,
-  SwitchNetworkModal,
+  WalletKitProvider,
+  ProfileModal,
+  ConnectModal,
 } from '@node-real/walletkit';
-import { metaMask, trustWallet, walletConnect } from '@node-real/walletkit/wallets';
+import { WagmiProvider } from 'wagmi';
+import { AppProps } from 'next/app';
+import { chains } from './chains';
 
-const config = createConfig(
-  getDefaultConfig({
-    autoConnect: true,
-    appName: 'WalletKit',
+const queryClient = new QueryClient();
 
-    // WalletConnect 2.0 requires a projectId which you can create quickly
-    // and easily for free over at WalletConnect Cloud https://cloud.walletconnect.com/sign-in
-    walletConnectProjectId: 'xxx',
+const config = defaultWagmiConfig({
+  appName: '[Your app name]', // Your app name
+  chains,
+  connectors: [trustWallet(), metaMask(), walletConnect()],
 
-    chains,
-    connectors: [trustWallet(), metaMask(), walletConnect()],
-  }),
-);
+  // WalletConnect 2.0 requires a projectId which you can create quickly
+  // and easily for free over at WalletConnect Cloud https://cloud.walletconnect.com/sign-in
+  walletConnectProjectId: 'xxx',
+});
 
 const options: WalletKitOptions = {
-  initialChainId: 56,
+  initialChainId: 1,
 };
 
-export default function App() {
+export default function App({ Component, pageProps }: AppProps) {
   return (
-    <WagmiConfig config={config}>
-      <WalletKitProvider options={options} mode="light">
-        <WalletKitButton />
-
-        {/*
-          👇 Here's the SwitchNetworkModal
-          If the user switches to a network that is not supported by our dApp,
-          this modal will be displayed to remind the user to switch to our supported networks.
-        */}
-        <SwitchNetworkModal />
-      </WalletKitProvider>
-    </WagmiConfig>
+    <WagmiProvider config={config} reconnectOnMount={true}>
+      <QueryClientProvider client={queryClient}>
+        <WalletKitProvider options={options} mode="light">
+          <Component {...pageProps} />
+
+          <WalletKitButton />
+          <ConnectModal />
+
+          {/* 
+            Profile modal shows some basic information about the current account,
+            if you don't need this modal, you can remove it.
+          */}
+          <ProfileModal />
+
+          {/* 👇 Here's the SwitchNetworkModal
+            If the user switches to a network that is not supported by our dApp,
+            this modal will be displayed to remind the user to switch to our supported networks.
+          */}
+          <SwitchNetworkModal />
+        </WalletKitProvider>
+      </QueryClientProvider>
+    </WagmiProvider>
   );
 }
 ```

packages/walletkit/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@node-real/walletkit",
-  "version": "2.0.1",
+  "version": "2.0.2-alpha.0",
   "author": "node-real",
   "private": false,
   "description": "WalletKit is a React component library for easily connecting a wallet to your dApp.",