Skip to content

Revert "Main" #59

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
Dargon789 merged 1 commit into from
Jan 4, 2026
Merged

Revert "Main" #59

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
62 changes: 51 additions & 11 deletions docs/src/routes/docs/[...4]wallets/[...14]injected/+page.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,9 +4,21 @@ 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).
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 Web3 Onboard implementation. This module supports [EIP-1193](https://eips.ethereum.org/EIPS/eip-1193), [recognizes many injected wallets natively](#injected-wallets-supported-natively), and 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.
Note: Make sure to install the core module before installing other modules to Web3 Onboard.

### 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.

### 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.

### 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

Expand Down Expand Up @@ -48,6 +60,18 @@ const onboard = Onboard({
label: 'Ethereum Mainnet',
rpcUrl: MAINNET_RPC_URL
},
{
id: 42161,
token: 'ARB-ETH',
label: 'Arbitrum One',
rpcUrl: 'https://rpc.ankr.com/arbitrum'
},
{
id: '0xa4ba',
token: 'ARB',
label: 'Arbitrum Nova',
rpcUrl: 'https://nova.arbitrum.io/rpc'
},
{
id: '0x2105',
token: 'ETH',
Expand Down Expand Up @@ -135,7 +159,7 @@ type Platform =

## Adding Custom Injected Wallets

If there is an injected wallet that you would like to support in your app, but is not yet included in this repo, you can add a custom wallet module in the `custom` field:
If there is an injected wallet that you would like to support in your dapp, but is not yet included in this repo, you can add a custom wallet module in the `custom` field:

```typescript
const equal = {
Expand Down Expand Up @@ -177,6 +201,19 @@ const onboard = Onboard({
})
```

### This module supports any injected wallet that has implemented support for [EIP-6963](https://eips.ethereum.org/EIPS/eip-6963)

This can be disabled by passing in `disable6963Support` as true within the injected module init object.

```ts
const injected = injectedModule({ disable6963Support: true })

const onboard = Onboard({
wallets: [injected],
...
})
```

## Display Unavailable Wallets

You may want to display injected wallets that are not currently available to the user and you can use the `displayUnavailable` option to do that:
Expand All @@ -191,8 +228,8 @@ const injected = injectedModule({
})
```

This can be set to an array top specify which unavailable injected wallets to show or set to true to display all unavailable injected wallets regardless of whether it has been detected in the window, happy days.
Then the issue of the order of wallets displayed becomes apparent when you have 21 injected wallets at the top of the wallets list. To solve this, all injected wallets are sorted **alphabetically** by default and there is an additional `sort` parameter which receives the final list of wallets and then returns the list to be rendered. This allows for example setting MetaMask and Coinbase first and then just the rest alphabetically:
This can be set to an array to specify which unavailable injected wallets to show, or set to true to display all unavailable injected wallets regardless of whether it has been detected in the window.
Then the issue of the order of wallets displayed becomes apparent when you have 21 injected wallets at the top of the wallets list. To solve this, all injected wallets are sorted **alphabetically** by default and there is an additional `sort` parameter which receives the final list of wallets and then returns the list to be rendered. This allows, for example, setting MetaMask and Coinbase first and then the rest are sorted alphabetically:

```javascript
const injected = injectedModule({
Expand All @@ -219,7 +256,7 @@ const injected = injectedModule({
})
```

You may want to display all unavailable injected wallets, but filter out specific wallets based on their availability. For example I may want to display all unavailable wallets except when Binance and Bitski wallet is unavailable, then don't show them, but if they are available, then do show them. To do this, the filters value has been extended to have a new value: `'unavailable'`, as in; remove this wallet if it is unavailable, even though `displayUnavailable` wallets is set:
You may want to display all unavailable injected wallets, but filter out specific wallets based on their availability. For example, I may want to display all unavailable wallets except when Binance and Bitski wallet is unavailable, then don't show them, but if they are available, then do show them. To do this, the filters value has been extended to have a new value: `'unavailable'`, as in; remove this wallet if it is unavailable, even though `displayUnavailable` wallets is set:

```javascript
const injected = injectedModule({
Expand Down Expand Up @@ -251,7 +288,7 @@ const injected = injectedModule({
})
```

If a wallet is selected, but is not available the default error message is: `Oops ${wallet.label} is unavailable! Please <a href="${wallet.externalUrl}" target="_blank">install</a>` if a download link is available for that wallet. If there isn't a download link for that wallet the default is: `Please install or enable ${walletName} to continue`. You may want to customize that message, so there is the `walletUnavailableMessage` parameter which is a function that takes the wallet object that is unavailable and returns a string which is the message to display:
If a wallet is selected, but is not available, the default error message is: `Oops ${wallet.label} is unavailable! Please <a href="${wallet.externalUrl}" target="_blank">install</a>` if a download link is available for that wallet. If there isn't a download link for that wallet the default is: `Please install or enable ${walletName} to continue`. You may want to customize that message, so there is the `walletUnavailableMessage` parameter which is a function that takes the wallet object that is unavailable and returns a string which is the message to display:

```javascript
const injected = injectedModule({
Expand Down Expand Up @@ -299,7 +336,7 @@ const injected = injectedModule({
- Trust - _Desktop & Mobile_
- SafePal - _Desktop & Mobile_
- Zerion - _Desktop & Mobile_
- OKX Wallet - _Desktop_
- OKX Wallet - _Desktop & Mobile_
- Taho (Previously named Tally Ho wallet) - _Desktop_
- Opera - _Desktop & Mobile_
- Status - _Mobile_
Expand All @@ -322,11 +359,10 @@ const injected = injectedModule({
- TP - _Mobile_
- 1inch - _Mobile_
- Tokenary - _Mobile_
- GameStop - _Desktop_
- Rabby - _Desktop_
- Rabby - _Desktop & Mobile_
- MathWallet - _Desktop & Mobile_
- Gamestop - _Desktop_
- Bitkeep - _Desktop & Mobile_
- BitGet Wallet - _Desktop & Mobile_
- Sequence - _Desktop & Mobile_
- Core - _Desktop_
- Bitski - _Desktop & Mobile_
Expand All @@ -345,6 +381,10 @@ const injected = injectedModule({
- Ronin Wallet - _Desktop & Mobile_
- Coin98 Wallet - _Desktop & Mobile_
- SubWallet - _Desktop & Mobile_
- Kayros - _Desktop_
- Lif3Wallet - _Mobile_
- StableWallet - _Mobile_
- Echooo - _Desktop & Mobile_

## Build Environments

Expand Down
1 change: 0 additions & 1 deletion examples/with-nextjs-13/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,6 @@
"@types/node": "18.11.11",
"@types/react": "18.0.26",
"@types/react-dom": "18.0.9",
"@vercel/analytics": "^1.3.1",
"@web3-onboard/coinbase": "^2.2.2",
"@web3-onboard/dcent": "^2.2.5",
"@web3-onboard/fortmatic": "^2.0.17",
Expand Down
4 changes: 0 additions & 4 deletions examples/with-nextjs-13/pages/_app.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,12 +1,8 @@
import '../styles/globals.css'
import type { AppProps } from 'next/app'
import { Analytics } from '@vercel/analytics/next'

export default function App({ Component, pageProps }: AppProps) {
return (
<>
<Component {...pageProps} />
<Analytics />
</>
)
}
1 change: 0 additions & 1 deletion examples/with-nextjs/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,6 @@
"lint": "next lint"
},
"dependencies": {
"@vercel/analytics": "^1.3.1",
"@web3-onboard/react": "2.8.11",
"next": "12.2.5",
"react": "18.2.0",
Expand Down
2 changes: 0 additions & 2 deletions examples/with-nextjs/pages/_app.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
import '../styles/globals.css'
import { Web3OnboardProvider, init } from '@web3-onboard/react'
import injectedModule from '@web3-onboard/injected-wallets'
import { Analytics } from '@vercel/analytics/next'

const INFURA_KEY = ''

Expand Down Expand Up @@ -54,7 +53,6 @@ function MyApp({ Component, pageProps }) {
return (
<Web3OnboardProvider web3Onboard={web3Onboard}>
<Component {...pageProps} />
<Analytics />
</Web3OnboardProvider>
)
}
Expand Down
159 changes: 104 additions & 55 deletions packages/demo/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,69 +1,118 @@
{
"name": "demo",
"version": "2.0.9",
"version": "1.0.7",
"private": true,
"scripts": {
"clean": "polkadot-dev-clean-build",
"build": "yarn clean && yarn polkadot-exec-webpack --config webpack.config.cjs --mode production",
"start": "yarn webpack-dev-server --config webpack.watch.cjs --mode development",
"lint": "polkadot-dev-run-lint"
},
"dependencies": {
"@0xsequence/network": "^1.2.9",
"@ant-design/icons": "^5.2.6",
"@ethereumjs/common": "^4.1.0",
"@ethersproject/keccak256": "^5.7.0",
"@subwallet-connect/arcana-auth": "^1.0.7",
"@subwallet-connect/bitget": "^1.0.7",
"@subwallet-connect/blocto": "^1.0.7",
"@subwallet-connect/cede-store": "^1.0.7",
"@subwallet-connect/coinbase": "^1.0.7",
"@subwallet-connect/dcent": "^1.0.7",
"@subwallet-connect/enkrypt": "^1.0.7",
"@subwallet-connect/fortmatic": "^1.0.7",
"@subwallet-connect/frame": "^1.0.7",
"@subwallet-connect/frontier": "^1.0.7",
"@subwallet-connect/gas": "^1.0.7",
"@subwallet-connect/gnosis": "^1.0.7",
"@subwallet-connect/infinity-wallet": "^1.0.7",
"@subwallet-connect/injected-wallets": "^1.0.7",
"@subwallet-connect/keepkey": "^1.0.7",
"@subwallet-connect/keystone": "^1.0.7",
"@subwallet-connect/ledger": "^1.0.7",
"@subwallet-connect/ledger-polkadot": "^1.0.7",
"@subwallet-connect/magic": "^1.0.7",
"@subwallet-connect/metamask": "^1.0.7",
"@subwallet-connect/mew-wallet": "^1.0.7",
"@subwallet-connect/phantom": "^1.0.7",
"@subwallet-connect/portis": "^1.0.7",
"@subwallet-connect/react": "^1.0.7",
"@subwallet-connect/sequence": "^1.0.7",
"@subwallet-connect/taho": "^1.0.7",
"@subwallet-connect/torus": "^1.0.7",
"@subwallet-connect/transaction-preview": "^1.0.7",
"@subwallet-connect/trezor": "^1.0.7",
"@subwallet-connect/trust": "^1.0.7",
"@subwallet-connect/uauth": "^1.0.7",
"@subwallet-connect/venly": "^1.0.7",
"@subwallet-connect/walletconnect": "^1.0.7",
"@subwallet-connect/walletconnect-polkadot": "^1.0.7",
"@subwallet-connect/walletlink": "^1.0.7",
"@subwallet-connect/web3auth": "^1.0.7",
"@subwallet-connect/xdefi": "^1.0.7",
"@subwallet-connect/zeal": "^1.0.7",
"@subwallet-connect/subwallet": "^1.0.7",
"@subwallet-connect/subwallet-polkadot": "^1.0.7",
"@subwallet-connect/talisman": "^1.0.7",
"@subwallet-connect/polkadot-js": "^1.0.7",
"@subwallet-connect/polkadot-vault": "^1.0.7",
"@subwallet-connect/openbit": "^1.0.7",
"@subwallet/chain-list": "^0.2.39",
"@testing-library/jest-dom": "^5.14.1",
"@testing-library/react": "^12.0.0",
"@testing-library/user-event": "^13.2.1",
"@phosphor-icons/react": "2.0.15",
"antd": "^5.11.1",
"ethers": "^5.7.2",
"classnames": "^2.3.2",
"react": "^18.0.0",
"react-dom": "^18.0.0",
"react-router-dom": "^6.18.0",
"react-scripts": "5.0.1",
"typescript": "^4.5.5",
"web-vitals": "^3.5.0",
"web3": "^4.2.2",
"eth-sig-util": "^3.0.1",
"styled-components": "^5.3.6",
"rxjs": "^7.8.1",
"usehooks-ts": "^2.15.1",
"bignumber.js": "^9.1.2",
"@types/bn.js": "^5.1.5",
"bn.js": "^4.11.9",
"eventemitter3": "^4.0.7"
},
"devDependencies": {
"@types/jest": "^29.5.8",
"@types/node": "^18.11.11",
"@types/react": "^18.0.2",
"@types/react-dom": "^18.0.2",
"@subwallet/react-ui": "5.1.2-b74",
"@types/styled-components": "^5.1.34",
"@polkadot/dev": "^0.66.28",
"assert": "^2.0.0",
"browserify-zlib": "^0.2.0",
"babel-loader": "^8.2.3",
"browser-resolve": "^2.0.0",
"buffer": "^6.0.3",
"cross-env": "^7.0.3",
"copy-webpack-plugin": "^10.2.0",
"crypto-browserify": "^3.12.0",
"css-loader": "^5.0.1",
"http": "^0.0.1-security",
"css-loader": "^6.7.1",
"eth-sig-util": "^3.0.1",
"extract-loader": "^5.1.0",
"file-loader": "^6.2.0",
"html-loader": "^3.1.0",
"html-webpack-plugin": "^5.5.0",
"https-browserify": "^1.0.0",
"mini-css-extract-plugin": "^1.3.4",
"node-sass": "^9.0.0",
"os-browserify": "^0.3.0",
"path-browserify": "^1.0.1",
"process": "^0.11.10",
"sass-loader": "^13.0.0",
"stream-browserify": "^3.0.0",
"stream-http": "^3.2.0",
"svelte": "^3.49.0",
"svelte-loader": "^3.0.0",
"util": "^0.12.4",
"webpack": "^5.76.0",
"webpack-cli": "^4.4.0",
"webpack-dev-server": "4.7.4"
},
"dependencies": {
"@web3-onboard/arcana-auth": "^2.0.0",
"@web3-onboard/cede-store": "^2.1.0",
"@web3-onboard/blocto": "2.0.0",
"@web3-onboard/coinbase": "^2.2.5",
"@web3-onboard/core": "^2.21.0-alpha.1",
"@web3-onboard/dcent": "^2.2.7",
"@web3-onboard/enkrypt": "^2.0.3",
"@web3-onboard/fortmatic": "^2.0.18",
"@web3-onboard/frame": "^2.0.2",
"@web3-onboard/frontier": "^2.0.3",
"@web3-onboard/gas": "^2.1.7",
"@web3-onboard/gnosis": "^2.1.9",
"@web3-onboard/infinity-wallet": "^2.0.3",
"@web3-onboard/injected-wallets": "^2.10.5-alpha.2",
"@web3-onboard/keepkey": "^2.3.7",
"@web3-onboard/keystone": "^2.3.7",
"@web3-onboard/ledger": "^2.5.2",
"@web3-onboard/magic": "^2.1.6",
"@web3-onboard/mew-wallet": "^2.0.3",
"@web3-onboard/phantom": "^2.0.3",
"@web3-onboard/portis": "^2.1.6",
"@web3-onboard/sequence": "^2.0.7",
"@web3-onboard/taho": "^2.0.5",
"@web3-onboard/torus": "^2.2.4",
"@web3-onboard/transaction-preview": "^2.0.7",
"@web3-onboard/trezor": "^2.4.2",
"@web3-onboard/trust": "^2.0.3",
"@web3-onboard/uauth": "^2.1.2",
"@web3-onboard/venly": "^2.0.0",
"@web3-onboard/walletconnect": "^2.4.5-alpha.1",
"@web3-onboard/web3auth": "^2.2.2",
"@web3-onboard/xdefi": "^2.0.3",
"@web3-onboard/zeal": "^2.0.3",
"@blocto/dappauth": "^2.1.0",
"vconsole": "^3.15.1"
},
"license": "MIT",
"scripts": {
"build": "cross-env NODE_ENV=production webpack",
"dev": "webpack serve",
"type-check": "exit 0"
"thread-loader": "^3.0.4",
"url-loader": "^4.1.1",
"webpack": "^5.65.0",
"webpack-cli": "^4.9.1",
"webpack-dev-server": "^4.9.0"
}
}
Loading