Release 2.25.2

.github/workflows/docs.yml

@@ -40,7 +40,7 @@ jobs:
       - name: Setup Nodejs and yarn
         uses: actions/setup-node@v2
         with:
-          node-version: "16"
+          node-version: "18.18"
           cache: yarn
 
       - name: Install dependencies

docs/package.json

@@ -58,7 +58,7 @@
     "@web3-onboard/capsule": "^2.0.1",
     "@web3-onboard/cede-store": "^2.2.0",
     "@web3-onboard/coinbase": "^2.2.7",
-    "@web3-onboard/core": "^2.21.3",
+    "@web3-onboard/core": "^2.21.4",
     "@web3-onboard/dcent": "^2.2.7",
     "@web3-onboard/enkrypt": "^2.0.4",
     "@web3-onboard/fortmatic": "^2.0.19",

docs/src/routes/docs/[...1]overview/[...1]introduction/+page.md

@@ -32,9 +32,9 @@ Web3-Onboard is the quickest and easiest way to add multi-wallet and multi-chain
 
 - **Notify:** Real-time transaction notifications for all transaction states for the connected wallet address(es). In-notification speedups & cancels for hardware wallet connections.
 
-### Supported Networks
+### Natively Supported EVM Chains
 
-web3-onboard supports all EVM networks. Supporting a new network is simply a matter of adding its details in the Chains section upon initialization. For more information see [initialization options](../../modules/core.md#initialization).
+web3-onboard supports ALL EVM networks. Supporting a new network is simply a matter of adding its details in the Chains section upon initialization. For more information see [initialization options](../../modules/core.md#initialization).
 
 - Ethereum
 - Arbitrum One
@@ -126,6 +126,12 @@ const onboard = Onboard({
       token: 'ETH',
       label: 'Base',
       rpcUrl: 'https://mainnet.base.org'
+    },
+    {
+      id: '0xa4ec',
+      token: 'ETH',
+      label: 'Celo',
+      rpcUrl: 'https://1rpc.io/celo'
     }
   ]
 })

docs/src/routes/docs/[...3]modules/[...1]core/+page.md

@@ -671,6 +671,12 @@ const onboard = Onboard({
       token: 'OETH',
       label: 'Optimism',
       rpcUrl: 'https://mainnet.optimism.io'
+    },
+    {
+      id: '0xa4ec',
+      token: 'ETH',
+      label: 'Celo',
+      rpcUrl: 'https://1rpc.io/celo'
     }
   ],
   appMetadata: {
@@ -755,6 +761,10 @@ const onboard = Onboard({
 
 To initiate a user to select and connect a wallet you can call the `connectWallet` function on an initialized Onboard instance. It will return a `Promise` that will resolve when the user either successfully connects a wallet, or when they dismiss the UI. The resolved value from the promise will be the latest state of the `wallets` array. The order of the wallets array is last to first, so the most recently selected wallet will be the first item in the array and can be thought of as the "primary wallet". If no wallet was selected, then the `wallets` array will have the same state as it had before calling `connectWallet`.
 
+### Wallet Provider
+
+Wallets connected through web3-onboard are all passed to the dapp following the EIP-1193 standard. This allows for the same interaction between all wallets connected through web3-onboard and abstracts away the challenges of working with different wallet providers.
+
 ### Example
 
 ```javascript
@@ -766,6 +776,10 @@ async function connectWallet() {
 connectWallet()
 ```
 
+### Interacting with the providers - Transfer, Send, Sign using ethers.js
+
+For examples of interacting with the wallet providers please see our demo project [here](https://github.com/blocknative/web3-onboard/blob/9b871a1b3117e92a7c87285677fa5b35c544a8e0/packages/demo/src/App.svelte#L447)
+
 ### Auto Selecting a Wallet
 
 A common UX pattern is to remember the last wallet that a user has previously connected by storing it in localStorage and then automatically selecting them for the user next time they visit your app.

docs/src/routes/docs/[...4]wallets/[...14]injected/+page.md

@@ -4,10 +4,14 @@ title: Injected Wallets
 
 # {$frontmatter.title}
 
-This module lets web3-onboard automatically detect Browser Injected Wallets such as Metamask or Coinbase Wallet. We recommend you install this module to get the most out of your w3o implementation. This module supports [EIP-1193](https://eips.ethereum.org/EIPS/eip-1193) and [recognizes many injected wallets natively](#injected-wallets-supported-natively) as well as supports [EIP-6963](https://eips.ethereum.org/EIPS/eip-6963) and recognizes any wallet that has implemented 6963 support.
+This module lets web3-onboard automatically detect Browser Injected Wallets such as Metamask or Coinbase Wallet. We recommend you install this module to get the most out of your w3o implementation. This module supports [EIP-1193](https://eips.ethereum.org/EIPS/eip-1193) and [recognizes many injected wallets natively](#injected-wallets-supported-natively) as well as supports all [EIP-6963](https://eips.ethereum.org/EIPS/eip-6963) compatible wallets.
 
 Note: Make sure to install the core module before installing other modules to w3o.
 
+### Support all EIP-6963 Wallets out of the box
+
+Web3-Onboard supports all [EIP-6963](https://eips.ethereum.org/EIPS/eip-6963) compatible wallets out of the box and will automatically recognizes any wallet which has integrated 6963 support.
+
 ## Install
 
 <Tabs values={['yarn', 'npm']}>

docs/src/routes/examples/[...1]connect-wallet/+page.md

@@ -38,7 +38,6 @@ npm install @web3-onboard/react @web3-onboard/injected-wallets @web3-onboard/inf
   </TabPanel>
 </Tabs>
 
-
 ## Step 2: Import + Configure
 
 Import the libraries and any wallets you would like to use. For this example, we are going to use the injected wallets module. You can easily add more wallet support to your dapp via our other wallet modules. Additionally, we'll setup web3-onboard to support 2 chains: Ethereum mainnet and Polygon mainnet.
@@ -156,6 +155,12 @@ const chains = [
     token: 'ARB-ETH',
     label: 'Arbitrum',
     rpcUrl: 'https://rpc.ankr.com/arbitrum'
+  },
+  {
+    id: '0xa4ec',
+    token: 'ETH',
+    label: 'Celo',
+    rpcUrl: 'https://1rpc.io/celo'
   }
 ]
 
@@ -412,6 +417,12 @@ const chains = [
     token: 'ARB-ETH',
     label: 'Arbitrum',
     rpcUrl: 'https://rpc.ankr.com/arbitrum'
+  },
+  {
+    id: '0xa4ec',
+    token: 'ETH',
+    label: 'Celo',
+    rpcUrl: 'https://1rpc.io/celo'
   }
 ]
 
@@ -497,3 +508,7 @@ Now that we have our wallet connected, let's display some basic information, suc
 
   </TabPanel>
 </Tabs>
+
+## Interacting with the providers - Transfer, Send, Sign using ethers.js
+
+For examples of interacting with the wallet providers please see our demo project [here](https://github.com/blocknative/web3-onboard/blob/9b871a1b3117e92a7c87285677fa5b35c544a8e0/packages/demo/src/App.svelte#L447)

examples/with-nextjs-13/web3-onboard.ts

@@ -123,6 +123,12 @@ export default init({
       token: 'MATIC',
       label: 'Matic Mainnet',
       rpcUrl: 'https://matic-mainnet.chainstacklabs.com'
+    },
+    {
+      id: '0xa4ec',
+      token: 'ETH',
+      label: 'Celo',
+      rpcUrl: 'https://1rpc.io/celo'
     }
   ],
   appMetadata: {

examples/with-nextjs/pages/_app.js

@@ -23,17 +23,23 @@ const baseMainnet = {
   label: 'Base',
   rpcUrl: 'https://mainnet.base.org'
 }
+const celoMainnet = {
+  id: '0xa4ec',
+  token: 'ETH',
+  label: 'Celo',
+  rpcUrl: 'https://1rpc.io/celo'
+}
 
-const chains = [ethereumRopsten, polygonMainnet, baseMainnet]
+const chains = [ethereumRopsten, polygonMainnet, baseMainnet,celoMainnet]
 const wallets = [injectedModule()]
 
 const web3Onboard = init({
   wallets,
   chains,
   appMetadata: {
-    name: "Web3-Onboard Demo",
+    name: 'Web3-Onboard Demo',
     icon: '<svg>My App Icon</svg>',
-    description: "A demo of Web3-Onboard."
+    description: 'A demo of Web3-Onboard.'
   }
 })
 
@@ -45,4 +51,4 @@ function MyApp({ Component, pageProps }) {
   )
 }
 
-export default MyApp
+export default MyApp

examples/with-solidjs/src/providers/onboard-provider/options.ts

@@ -28,6 +28,12 @@ export const chains = [
     token: 'ETH',
     label: 'Base',
     rpcUrl: 'https://mainnet.base.org'
+  },
+  {
+    id: '0xa4ec',
+    token: 'ETH',
+    label: 'Celo',
+    rpcUrl: 'https://1rpc.io/celo'
   }
 ];
 

examples/with-sveltekit/package.json

@@ -35,7 +35,7 @@
     "@esbuild-plugins/node-modules-polyfill": "^0.2.2",
     "@fontsource/fira-mono": "^4.5.10",
     "@rollup/plugin-commonjs": "^25.0.7",
-    "@web3-onboard/core": "^2.21.3-alpha.1",
+    "@web3-onboard/core": "^2.21.4",
     "@web3-onboard/injected-wallets": "^2.8.5",
     "@web3-onboard/walletconnect": "^2.3.6",
     "assert": "^2.1.0",

examples/with-sveltekit/src/lib/web3-onboard.ts

@@ -33,6 +33,12 @@ const chains = [
     token: 'ETH',
     label: 'Base',
     rpcUrl: 'https://mainnet.base.org'
+  },
+  {
+    id: '0xa4ec',
+    token: 'ETH',
+    label: 'Celo',
+    rpcUrl: 'https://1rpc.io/celo'
   }
 ]
 

examples/with-vanilla-js/src/onboard.js

@@ -29,6 +29,12 @@ const chains = [
     token: 'ETH',
     label: 'Base',
     rpcUrl: 'https://mainnet.base.org'
+  },
+  {
+    id: '0xa4ec',
+    token: 'ETH',
+    label: 'Celo',
+    rpcUrl: 'https://1rpc.io/celo'
   }
 ]
 

examples/with-vite-react/src/web3-onboard.ts

@@ -33,14 +33,12 @@ const injected = injectedModule({
 
 const walletLink = coinbaseModule()
 
-const walletConnect = walletConnectModule(
-  {
-    version: 2,
-    // Replace with your apiKey
-    projectId: '4a49c32131502e8c12d54295295e2012',
-    dappUrl: 'https://onboard.blocknative.com/'
-  }
-)
+const walletConnect = walletConnectModule({
+  version: 2,
+  // Replace with your apiKey
+  projectId: '4a49c32131502e8c12d54295295e2012',
+  dappUrl: 'https://onboard.blocknative.com/'
+})
 const portis = portisModule({
   // Replace with your apiKey
   apiKey: 'b2b7586f-2b1e-4c30-a7fb-c2d1533b153b'
@@ -137,6 +135,12 @@ export default init({
       token: 'ETH',
       label: 'Base',
       rpcUrl: 'https://mainnet.base.org'
+    },
+    {
+      id: '0xa4ec',
+      token: 'ETH',
+      label: 'Celo',
+      rpcUrl: 'https://1rpc.io/celo'
     }
   ],
   appMetadata: {

examples/with-vuejs-v2/src/components/HelloWorld.vue

@@ -22,17 +22,17 @@
 </template>
 
 <script>
-import { init, useOnboard } from '@web3-onboard/vue';
-import injectedModule from '@web3-onboard/injected-wallets';
+import { init, useOnboard } from '@web3-onboard/vue'
+import injectedModule from '@web3-onboard/injected-wallets'
 
-const injected = injectedModule();
+const injected = injectedModule()
 // With vite
-const infuraKey = import.meta.env.VITE_INFURA_KEY;
+const infuraKey = import.meta.env.VITE_INFURA_KEY
 
 // Without vite
 //const infuraKey = process.env.INFURA_KEY;
 
-const rpcUrl = `https://mainnet.infura.io/v3/${infuraKey}`;
+const rpcUrl = `https://mainnet.infura.io/v3/${infuraKey}`
 
 const web3Onboard = init({
   wallets: [injected],
@@ -41,7 +41,7 @@ const web3Onboard = init({
       id: '0x1',
       token: 'ETH',
       label: 'Ethereum Mainnet',
-      rpcUrl,
+      rpcUrl
     },
     {
       id: 42161,
@@ -60,58 +60,64 @@ const web3Onboard = init({
       token: 'ETH',
       label: 'Base',
       rpcUrl: 'https://mainnet.base.org'
+    },
+    {
+      id: '0xa4ec',
+      token: 'ETH',
+      label: 'Celo',
+      rpcUrl: 'https://1rpc.io/celo'
     }
-  ],
-});
+  ]
+})
 
 const { wallets, connectWallet, disconnectConnectedWallet, connectedWallet } =
-  useOnboard();
+  useOnboard()
 
-const trunc = (address) =>
-  !!address ? address.slice(0, 6) + '...' + address.slice(-6) : null;
+const trunc = address =>
+  !!address ? address.slice(0, 6) + '...' + address.slice(-6) : null
 
 export default {
   props: {
-    msg: String,
+    msg: String
   },
   data() {
     return {
       connectedWallet,
-      count: 0,
-    };
+      count: 0
+    }
   },
   methods: {
     connect: () => connectWallet(),
-    disconnect: () => disconnectConnectedWallet(),
+    disconnect: () => disconnectConnectedWallet()
   },
   computed: {
     address: function () {
       if (
         this.connectedWallet.accounts &&
         this.connectedWallet.accounts[0].address
       ) {
-        console.log(this.connectedWallet.accounts[0].address);
-        return trunc(this.connectedWallet.accounts[0].address);
+        console.log(this.connectedWallet.accounts[0].address)
+        return trunc(this.connectedWallet.accounts[0].address)
       }
     },
     ens: function () {
       if (
         this.connectedWallet.accounts &&
         this.connectedWallet.accounts[0].ens?.name
       ) {
-        return trunc(this.connectedWallet.accounts[0].ens);
+        return trunc(this.connectedWallet.accounts[0].ens)
       }
     },
     uns: function () {
       if (
         this.connectedWallet.accounts &&
         this.connectedWallet.accounts[0].uns?.name
       ) {
-        return trunc(this.connectedWallet.accounts[0].uns);
+        return trunc(this.connectedWallet.accounts[0].uns)
       }
-    },
-  },
-};
+    }
+  }
+}
 </script>
 
 <style scoped>

examples/with-vuejs/src/App.vue

@@ -28,6 +28,12 @@ init({
       token: 'ARB',
       label: 'Arbitrum Nova',
       rpcUrl: 'https://nova.arbitrum.io/rpc'
+    },
+    {
+      id: '0xa4ec',
+      token: 'ETH',
+      label: 'Celo',
+      rpcUrl: 'https://1rpc.io/celo'
     }
   ]
 })

package.json

@@ -1,6 +1,6 @@
 {
   "name": "web3-onboard-monorepo",
-  "version": "2.25.1",
+  "version": "2.25.2",
   "private": true,
   "workspaces": {
     "packages": [