Client library to onboard users to web3 apps
MIT License
Published by aaronbarnardsound over 2 years ago
This release updates the core
package to the latest version which includes the new Account Center UI.
Changelog:
Published by aaronbarnardsound over 2 years ago
This release includes a new Account Center UI that allows for easy management of connected wallets and accounts. The UI is opt out, so simply upgrading to this version will add the new UI:
Minimized UI:
Maximized UI:
There are some new initialization options for the account center UI that allow for customizing it's position on the page as well as a way to disable the UI if you like:
import Onboard from '@web3-onboard/core'
import injectedModule from '@web3-onboard/injected-wallets'
const injected = injectedModule()
const onboard = Onboard({
wallets: [injected],
accountCenter: {
desktop: {
enabled: true,
position: 'topRight'
}
}
chains: [
{
id: '0x1',
token: 'ETH',
label: 'Ethereum Mainnet',
rpcUrl: `https://mainnet.infura.io/v3/${INFURA_ID}`,
icon: '<MAINNET_ICON_SVG_STRING>',
color: '#627EEA'
}
],
appMetadata: {
name: 'Token Swap',
icon: myIcon, // svg string icon
logo: myLogo, // svg string logo
description: 'Swap tokens for other tokens',
recommendedInjectedWallets: [
{ name: 'MetaMask', url: 'https://metamask.io' },
{ name: 'Coinbase', url: 'https://wallet.coinbase.com/' }
]
}
})
The chain object that is passed in to initialization also has two new optional parameters: icon
and color
. These parameters are used for displaying the connected chain in the account center UI. There are a number of chains that have icons and colors that work out of the box which can be found here. You can override the icon and color for any of those chains or leave them out if you like the defaults.
Changelog:
Published by aaronbarnardsound over 2 years ago
This release updates the provider flag that is used to detect Brave wallet.
Changelog:
Published by aaronbarnardsound over 2 years ago
The WalletLink package is now deprecated in favor of the new Coinbase Wallet SDK package.
Changelog:
Published by aaronbarnardsound over 2 years ago
This release includes a new package for the Coinbase wallet sdk that replaces the now deprecated WalletLink package. If you are running the WalletLink package, please swap it out for this one.
Thanks to @erin-at-work for the PR.
Changelog:
Published by aaronbarnardsound over 2 years ago
This release adds a small build change so that the en.json
file is copied over to the dist
folder to prevent types breaking in some Vite builds. Thanks to @gdixon for the PR!
Changelog:
Published by aaronbarnardsound over 2 years ago
A small release to update to the latest core version
Changelog:
Published by aaronbarnardsound over 2 years ago
This release includes a new feature allowing for dynamic updating of the wallet modules that are displayed to the user in the wallet select modal, without needing to re-initialize. To enable this, a new actions
object has been added to the state
object, exposing a setWalletModules
function. Example usage below:
import Onboard from '@web3-onboard/core'
import injectedModule from '@web3-onboard/injected-wallets'
import ledgerModule from '@web3-onboard/ledger'
import trezorModule from '@web3-onboard/trezor'
const injected = injectedModule()
const ledger = ledgerModule()
const trezor = trezorModule({
email: '<EMAIL_CONTACT>',
appUrl: '<APP_URL>'
})
// initialize with injected and hardware wallets
const onboard = Onboard({
wallets: [injected, trezor, ledger],
chains: [
{
id: '0x1',
token: 'ETH',
label: 'Ethereum Mainnet',
rpcUrl: `https://mainnet.infura.io/v3/${INFURA_ID}`
}
]
})
// then after a user action, you may decide to only display hardware wallets on the next call to onboard.connectWallet
onboard.state.actions.setWalletModules([ledger, trezor])
Changelog:
Published by aaronbarnardsound over 2 years ago
This release adds a provider request
function that passes on any RPC requests to the RPC URL that are not explicitly patched.
Changelog:
Published by aaronbarnardsound over 2 years ago
This release adds a provider request
function that passes on any RPC requests to the RPC URL that are not explicitly patched.
Changelog:
Published by aaronbarnardsound over 2 years ago
This release adds a provider request
function that passes on any RPC requests to the RPC URL that are not explicitly patched.
Changelog:
Published by aaronbarnardsound over 2 years ago
The release of the Ledger includes two important bugfixes:
request
function to proxy any RPC requests that are not explicitly patched.Changelog:
Published by Adamj1232 over 2 years ago
This release includes a fix for handling initial state more reliably when components using the hooks render before a wallet is set.
This gives initial state to all the hooks using the web3-onboard api strengthening reliability and uniform functionality throughout your application using the hooks.
Published by Adamj1232 over 2 years ago
This release includes incremented version for the web3-onboard core and common packages in the react hook package.
These updates include a new instance
prop in the walletInterface type to allow passing of a wallet instance along with the provider in certain wallet modules.
This is beneficial for wallets that have extra methods built in to the walletInstance that is not standard across wallets.
e.g. Magic wallet has methods userMetaData()
and resetEmail()
that are exposed through the instance property
type WalletInterface = {
provider: EIP1193Provider,
instance?: unknown
}
Changelog:
Published by Adamj1232 over 2 years ago
The Magic module provides email login support for the Magic Wallet through web3-onboard.
npm i @web3-onboard/magic
Head over to https://magic.link/ and signup to get an API key for your DApp
type magicOptions = {
apiKey: string
}
import Onboard from '@web3-onboard/core'
import magicModule from '@web3-onboard/magic'
const magic = magicModule({ apiKey: 'API_KEY' })
const onboard = Onboard({
// ... other Onboard options
wallets: [
magic
//... other wallets
]
})
const connectedWallets = await onboard.connectWallet()
console.log(connectedWallets)
When a Magic wallet is connect the Magic instance is exposed.
This can be used to get information such as user Metadata, update a user's email address or handle the user's token.
const [magicWallet] = await onboard.connectWallet()
try {
const { email, publicAddress } = await magicWallet.instance.user.getMetadata();
} catch {
// Handle errors if required!
}
For full documentation and examples please visit Magic's official docs
Changelog:
Published by Adamj1232 over 2 years ago
This release includes a bug fix that was not allowing the provider to properly reset and patch after wallet_switchEthereumChain
is called
Changelog:
Published by Adamj1232 over 2 years ago
Handling of the new instance
prop in the walletInterface type to allow for passing of a wallet instance with the provider in certain wallet.
This is beneficial for wallets that have extra methods built in to the walletInstance that is not standard across wallets.
e.g. Magic wallet has methods userMetaData()
and resetEmail()
that are exposed through the instance property
type WalletInterface = {
provider: EIP1193Provider,
instance?: unknown
}
Changelog:
Published by Adamj1232 over 2 years ago
Addition of the instance
prop to walletInterface type to allow for passing of a wallet instance with the provider in certain wallet.
This is beneficial for wallets that have extra methods built in to the walletInstance that are not standard across wallets.
e.g. Magic wallet has methods userMetaData()
and resetEmail()
that are exposed through the instance property.
type WalletInterface = {
provider: EIP1193Provider,
instance?: unknown
}
Changelog:
Published by aaronbarnardsound over 2 years ago
A small release that adds a CSS var for all modals z-index
property which can be modified via --onboard-modal-z-index: <new value>
Changelog:
Published by aaronbarnardsound over 2 years ago
Two small releases for the torus
and fortmatic
modules which fixes bugs where calls to parseInt
with hex string values were incorrectly using a radix of 10
.
Changelog: