Skip to main content

Connect Wallet

Sequence is a very flexible wallet which allow users multiple ways to connect / access their wallet. This includes:

  1. On-demand Ethereum web wallet for new users via 0xsequence npm package + https://sequence.app -- this option allows developers to offer users an on-demand web3 wallet. No user install required -- any browser will just work, and users can on-board with a familiar Web2 experience. Think of it like Paypal / Stripe but for web3.

  2. Surf all of web3 via Sequence Wallet Chrome Extension -- users who have the Sequence Wallet Chrome Extension installed are able to access any Ethereum-compatible Dapp on the Web :) Just like how MetaMask works, but of course with a bunch of the benefits of Sequence.

  3. Mobile phone access via WalletConnect support within Sequence Wallet -- users are able to communicate with their wallets remotely via the awesome Wallet Connect protocol. This is an excellent option if using Sequence Wallet from your mobile phone and want to connect your wallet to a desktop dapp.

Sequence Wallet is built on Web Browser (W3C) and Ethereum web3 standards -- and is available everywhere that a modern browser is able to run. We've carefully designed the wallet for simple on-boarding, while maintaining security for users, and allowing users to progressively increase the level of their security through additional keys and measures.

This means, that if you've developed a dapp to work with MetaMask, then Sequence will work too without any changes. If you're using web3.js or ethers.js, Sequence will just work too. This is the beauty of interoperability on web3 :)

Connecting your dapp with 0xsequence

A delightful wallet without requiring your users to install anything :D

By integrating 0xsequence, users may access your dapp without having to install any special extensions, and the wallet also works on mobile browsers!

Your dapp can connect to your user's wallet by first instantiating the Wallet provider:

import { sequence } from "0xsequence";

// This assumes your dapp runs on Ethereum mainnet
const wallet = sequence.initWallet('mainnet')

// If your dapp runs on a different EVM-compatible blockchain, you can specify its name as the argument
// const wallet = sequence.initWallet('polygon')

Once you have the instance, you can connect to the wallet:

const wallet = sequence.getWallet()

const connectDetails = await wallet.connect({
app: 'Your Dapp name',
authorize: true,
// And pass settings if you would like to customize further
settings: {
theme: "light",
bannerUrl: "https://yoursite.com/banner-image.png", // 3:1 aspect ratio, 1200x400 works best
includedPaymentProviders: ["moonpay", "ramp"],
defaultFundingCurrency: "matic",
lockFundingCurrencyToDefault: false,
}
})

console.log('user accepted connect?', connectDetails.connected)
console.log('users signed connect proof to valid their account address:', connectDetails.proof)

After you connect, you can use wallet.openWallet() to open the wallet:

const wallet = sequence.getWallet()
wallet.openWallet();

You can also optionally pass a path, and use openWithOptions intent to pass settings when you open the wallet:

const settings: Settings = {
theme: "goldDark",
bannerUrl: "https://yoursite.com/banner-image.png", // 3:1 aspect ratio, 1200x400 works best
includedPaymentProviders: ["moonpay", "ramp"],
defaultFundingCurrency: "eth",
lockFundingCurrencyToDefault: false,
};

const intent: OpenWalletIntent = {
type: "openWithOptions",
options: {
settings: settings,
},
};

const wallet = sequence.getWallet()

const path = "wallet/add-funds";
wallet.openWallet(path, intent);
Check out some example Dapp source code

For a complete examples, see Demo-Dapp and Demo-Dapp-Web3Modal.

Avoid Browsers Blocking Sequence Popup

Most browsers will block popups if they are called outside of user-triggered event handlers like onclick, or when it takes too long to process between the user action and the actual window

Read more about browser popup-blocking here.

Sequence on-demand sign in

Sequence on-demand sign in, connect

Wallet Login and Connect Options

Dapps with direct sequence integration can specify the following settings:

theme

Name of one of the available theme provided by sequence the sequence wallet will be rendered with.

Example: settings: {theme: "light"}

bannerUrl

URL of a banner image users will see when connecting or loging into your dapp.The banner image should follow a 3:1 aspect ration where 1200x400 works best.

Example: settings: {bannerUrl: "https://yoursite.com/banner-image.png"}

includedPaymentProviders

List of payment providers users will be able to access. By default, users can access all payment providers integrated in Sequence.

Example: settings: {includedPaymentProviders: ["moonpay", "ramp"]}

defaultFundingCurrency

The tag of the default currency to show when users open the payment provider page. The currency has to be supported by the payment providers integrated in sequence.

Example: settings: {defaultFundingCurrency: "usdc"}

defaultPurchaseAmount

Use to specify a default purchase amount, as an integer, for prefilling the funding amount. If not specified, the default is 100.

Example: settings: {defaultPurchaseAmount: 200}

lockFundingCurrencyToDefault

Whether to only allow users to purchase the default currency specified by the defaultFundingCurrency option. If set to false, users will also be able to purchase other tokens. locking the default funding currency can be useful to prevent users from purchasing the wrong currency or the currency on the wrong chain.

Example: settings: {defaultFundingCurrency: true}

Connecting your dapp with web3.js or ethers.js

For a full example of a dapp which supports Sequence (on-demand + chrome extension), Metamask, and WalletConnect please see the Demo-Dapp-Web3Modal repo.

Sequence Web3Modal Integration

Connecting to any Ethereum dapp with the Sequence Wallet Chrome Extension

Sequence Chrome Extension: Install

Sequence Chrome Extension

Connecting via WalletConnect

Sequence already supports connecting to dapps via WalletConnect. If your dapp already supports WalletConnect, and you don't need Sequence-specific functionality, nothing more needs to be done. From the user's perspective, the WalletConnect flow behaves as follows.

Taking Uniswap as an example, the user is prompted to connect their wallet using one of multiple possible protocols.

The user selects the WalletConnect option.

A QR code is displayed, which can be scanned by Sequence. Alternatively, the user can also choose to copy the connection details via their OS clipboard.

Back in the Sequence interface, the user chooses "Scan".

The QR code from the dapp is scanned. Alternatively, the code is pasted from the OS clipboard if the user chose that previously.

The user confirms the connection request.

The connection succeeded, and the dapp is updated to reflect that.

While connected, the dapp is able to make signing requests to Sequence. Sequence will always prompt for confirmation from the user for any activity initiated by the dapp.

Once the user has finished using the dapp, they can disconnect the wallet via the session menu.