dappId
- [optional]apiKey
that identifies your application. You can generate a dappId
by visiting the Blocknative account page and create a free account. The dappid
enables Onboard to use Blocknative notification services to efficiently maintain address balance state. This is not required to use Onboard to connect wallets to Dapps. It is required to efficiently get an up to date wallet balance value via the balance
subscription or getState()
calls.networkId
- [required]Ethereum
network id that your application runs on. The following values are valid:1
main
Ethereum Network mainnet3
ropsten
Ethereum Network testnet4
rinkeby
Ethereum Network testnet5
goerli
Ethereum Network testnet28
boba-rinkeby
Boba Network Rinkeby testnet42
kovan
Ethereum Network testnet56
bsc
Binance Smart Chain Network mainnet100
xdai
xDai POA Network mainnet137
polygon
Polygon-Matic Network mainnet250
fantom-opera
Fantom Network mainnet288
boba
Boba Network mainnet4000
fantom-testnet
Fantom Network testnetnetworkName
- [optional] networkId
above for supported networks). For instance, if you set networkId: 56
for Binance smart chain and the user is connected to a different network, the wallet select modal will show local as the network to switch to. But if you specify networkName: "Binance Mainnet"
then this will display instead of local.darkMode
- [optional] - Default: false
blockPollingInterval
- [optional] - Default: 4000
hideBranding
- [optional]dappId
is provided, then "Powered by Blocknative" branding will be displayed on all modals. You can choose to hide the branding by setting hideBranding: true
. If you have included a dappId
then the branding will be hidden by default. If you would like the branding to display when including a dappId
then set hideBranding: false
.subscriptions
- [optional]address
- called with the user's current address [string]
ens
- called with the user's current ens name (if available) [object]
name
- The user's resolved ens name [string]
avatar
- A link to the user's avatar [string]
getText
- A function to retrieve the user's text records [function]
contentHash
- The user's content hash record [string]
network
- called with the user's current network id [number]
balance
- called with the user's current balance [string]
wallet
- called with the user's current wallet [object]
provider
- The JavaScript provider for interacting with the walletname
- The wallet display nameinstance
- If the wallet type is 'sdk'
then this is the initialized wallet instancetype
- The wallet type 'hardware' | 'injected' | 'sdk'
connect
- The function that initiates the wallet connection logicdashboard
- Some SDK wallets allow for opening to wallet dashboardicons
- [object]
Image strings for the wallet icon { svg, src, srcset }
walletSelect
- [optional]heading
- [optional] : A string that will be the wallet select modal headingdescription
- [optional] : A string that will be the wallet select modal descriptionexplanation
- [optional] : A string that will be included in the "What is a Wallet" section wallets
- [optional] : An array of wallet modules or wallet initialization objects that the user can select fromagreement
- [optional]: An object containing properties for use with terms of service agreementversion
- The current version of the terms that the user needs to agree to. When this value is updated the user's agreement is invalidated and they must re-agree upon next usage.termsUrl
- [optional]: A string that will be used for the terms of service url that a user can agree to before using onboardprivacyUrl
- [optional]: A string that will be used for the privacy policy url that a user can agree to before using onboardheading
and description
and wallets
that don't require initialization will be included for you.walletCheck
- [optional]initializationOptions
:onboard
library which contains the API functions below.networkId
that is not one of the supported networks all modals will refer to that network with the name unknown
. You can name unrecognized networks by also passing in a networkName
in to your initialization object:networkId
for that local network to a number that is not taken by other valid networks.
If you are using the ganache-cli
for instance, you can set the networkId
via the -i
flag:networkId
to 35
networkId
property to the same value:walletSelect
walletSelect
function to display the wallet select modal:true
. This means that the provider
subscription will have been called with the provider of the selected wallet and you can go ahead and instantiate your web3 library with the provider and also instantiate your contracts.walletSelect
function can also be called with a autoSelectWallet
string. If the string passed in is a valid walletName
, then Onboard will automatically select that wallet for the user. This enables saving the previously selected wallet in localStorage
and automatically selecting it for the user when they next visit your Dapp.walletCheck
walletCheck
function:walletCheck
modules that were passed in via initialization sequentially, making sure the user has passed the condition contained in each module and eventually resolves with true
if the user completed the sequence. This means that the user is ready to transact. This function is useful to call before every transaction to make sure that nothing has changed since the last time it was called.walletReset
walletReset
function to do this easily.accountSelect
accountSelect
function. For example you could display a button that allows the user switch accounts:getState
config
config
object in to the config
function:darkMode
- [boolean]
networkId
- [number]
walletSelect.wallets
parameter of the Onboard initialization object. The order of the array is the order that the wallets will be displayed. Mobile wallets will be displayed when a user is on a mobile device and desktop wallets are displayed when they are on a desktop device. preferred
- Boolean
Will define whether it is shown at the top of the selection screen. If any of the wallets are set to preferred
, then all other wallets that aren't, will be hidden until the user clicks the "Show More" button. If there are no wallets set to preferred
, then the first four wallets will be shown and the remaining wallets will be hidden until the show more button is clicked.label
- String
Will over ride the wallet name that is displayed on the button.svg
- String
An svg
string that will over ride the icon that is displayed on the button.iconSrc
- String
An alternative to providing the svg
string, by providing a url source.display
- Object
display: { desktop: true }
will not display this wallet on desktop.desktop
- Boolean
default: true
mobile
- Boolean
default: true
initializationObject
is listed for each wallet:detectedwallet
metamask - (desktop & mobile support)
authereum - (desktop & mobile support)
walletConnect - (desktop & mobile support)
portis - (desktop & mobile support)
fortmatic - (desktop & mobile support)
trust - (mobile only support)
coinbase - (mobile only support)
Desktop support for
Coinbase Wallet
can be found through
walletLink module
opera - (desktop & mobile support)
opera touch - (mobile only support)
status - (mobile only support)
torus - (desktop & mobile support)
trezor - (desktop & mobile support)
ledger - (desktop & mobile support)
LedgerTransport
parameter for when you are building an Electron app and need to pass in the node ledger transport module. You can also use this option to pass in whichever Ledger transport that you would like to use based on feature detection (eg. Windows 10 user might need WebUSB transport instead of the default U2F transport).lattice - (desktop & mobile support)
keepkey - (desktop only support)
cobovault - (desktop & mobile support)
keystone - (desktop & mobile support)
walletLink -
Coinbase Wallet
for desktop (desktop only support)
imToken - (mobile only support)
meetone - (mobile only support)
mykey - (mobile only support)
huobiwallet - (mobile only support)
hyperpay - (mobile only support)
wallet.io - (mobile only support)
atoken - (mobile only support)
frame - (mobile only support)
ownbit - (mobile only support)
alphawallet - (mobile only support)
gnosis - (desktop only support)
xdefi - (desktop & mobile support)
bitpie - (mobile only support)
liquality - (desktop only support)
binance - (desktop only support)
mewwallet - (mobile only support)
tally - (desktop only support)
blankwallet - (desktop only support)
mathwallet - (desktop & mobile support)
1inch - (mobile only support)
Did - (mobile only support)
ronin - (desktop only support)
127.0.0.1 dev.skymavis.one
in your hosts file /etc/hosts
and access dev.skymavis.one:<port>
instead of localhost:<port>
.customNetwork
object is passed to the Common
constructor of the @ethereumjs/common
library. This is then used to build the transaction that will be signed. Please refer to these instructions for more information.
Note: Currently only Trezor and Ledger support this functionality/walletCheck
parameter of the Onboard initialization object. The order of the array is the order that the checks will be performed. heading
- String
Will over ride the heading displayed in the wallet check modal.description
- String
Will over ride the description displayed in the wallet check modal.icon
- String
An svg
string that will over ride the icon displayed in the wallet check modal.button
- { text: String, onclick: () => void}
An object that defines an extra button's text and onclick function.html
- String
A html string that will be rendered in the modal as html markup underneath the description.connect
: Checks that the Dapp has access to the users' accounts and fires the connect function if the selected wallet has one to prompt the user to allow access.derivationPath
: Provides a UI to allow a user to select or input the derivation path they would like to use with their hardware wallet. Note: will only display if the connected wallet is of type "hardware".
Note: html
and button
customization parameters won't work for this module as it needs them itself for correct operation.accounts
: Provides a UI to allow a user to select and load accounts on their hardware wallet. Note: will only display if the connected wallet is of type "hardware".
Note: html
and button
customization parameters won't work for this module as it needs them itself for correct operation.network
: Checks that the users' wallet is connected to the network that the modules were initialized with.balance
: Checks that the users' account has the minimum balance as defined when initialized.dappId
is required when initializing Onboard. This feature is subject to our API Rate Limits.name
- [string][required]
wallet
- [function][required]
helpers
object that includes some helper functions that make it easier to create the return object. The helpers
object contains the following methods:getProviderName
- A function that takes a provider as an argument and will return the name of the most common providers.createLegacyProviderInterface
- A function that takes the provider as an argument and returns a walletInterface
. Legacy refers to a provider that has not implemented EIP-1102
.createModernProviderInterface
- A function that takes the provider as an argument and returns a walletInterface
. Modern refers to a provider that has implemented EIP-1102
. This will work for most providers and is a quick way to create an interface.getNetwork
- A function that takes a provider and will make a JSON-RPC
call to get the network.getAddress
- A function that takes a provider and will make a JSON-RPC
call to get the address.getBalance
- A function that takes a provider and will make a JSON-RPC
call to get the balance.wallet
function must return a Promise
that resolves to an object that has the following properties:provider
- the JavaScript provider for this wallet. [required]
instance
- for SDK
wallets instances that are separate from the provider
. [optional]
interface
- a walletInterface
or null
if the user's current provider is not this wallet (for extension and mobile wallets). [required]
walletInterface
Ethereum
JavaScript provider allowing interoperability with wallets and providers of any architecture. A valid walletInterface
implements the following methods and attributes: name
- The name of the wallet. [string][required]
connect
- A function that requests account access and returns a Promise
that resolves or rejects once the user confirms or rejects the request. [function][optional]
disconnect
- A function to clean up / destroy any instances (mostly for SDK
wallets). Will be called when a new wallet has been selected. [function][optional]
loading
- A function that returns a Promise
that resolves when the wallet has finished loading. This is to show a loading spinner as the wallet popup is loading (mostly for SDK
wallets). [function][optional]
address
- A stateSyncer
object (see below for details). The get
function on this stateSyncer
must return a string which is the wallet address.network
- A stateSyncer
object (see below for details). The get
function on this stateSyncer
must return a number which is the wallet network id.balance
- A stateSyncer
object (see below for details). The get
function on this stateSyncer
must return a string which is the wallet address balance.stateSyncer
get
function or a onChange
function and is used to keep user state in sync. The onChange
method is preferred as it doesn't require background polling to keep in sync.get
function returns a promise that resolves with a value. onChange
function takes a setState
function as an argument and is used to set the state. Often it is needed to use the setState
function to set the initial state and then register it to be called every time it changes.iconSrc
- [string][optional]
iconSrcSet
- [string][optional]
svg
- [string][optional]
svg
element string for the wallet logo icon.link
- [string][optional]
installMessage
- [function][optional]
wallet
function did not return a wallet interface
. This is generally only needed if this wallet injects the provider via an extension or mobile wallet and the user doesn't have the extension installed or is on the wrong mobile browser. The function will be called with an object that has two properties: currentWallet
(the name of the wallet that has been detected by Onboard) and selectedWallet
(the name of the selected wallet), and must return a string (that can include html
) that instructs the user to install this wallet.desktop
- [boolean][optional]
mobile
- [boolean][optional]
preferred
- [boolean][optional