W3M Custom QR

This library is a fork of @web3modal/ethers5 with additional features to control the modal window itself, such as adding new wallet connection buttons

Usage

import {createWeb3Modal, defaultConfig} from "w3m-custom-qr/ethers5";
import { walletBase, desktopBase, mobileBase } from 'w3m-custom-qr';
import "w3m-custom-qr/react";

export const w3m_nets = [
  {
    chainId: 56,
    name: 'BSC mainnet',
    currency: 'BNB',
    explorerUrl: 'https://bscscan.com/',
    rpcUrl: 'https://bsc-dataseed1.binance.org/'
  },
  {
    chainId: 97,
    name: 'BSC testnet',
    currency: 'tBNB',
    explorerUrl: 'https://testnet.bscscan.com/',
    rpcUrl: 'https://data-seed-prebsc-1-s1.binance.org:8545/'
  },
];

const customWallet = {
  mobile: mobileBase({
    name: "Custom Mobile", 
    img: "",
    order: 10,
    mobile_link: "metamask://"
  }),
  desktop: desktopBase({
    img: "",
    name: "Custom  Desktop"
  })
}

walletBase([customWallet])

createWeb3Modal({
  ethersConfig: defaultConfig({metadata: {
    name: 'test',
    description: 'test',
    url: 'https://example.com/',
    icons: ['https://example.com/icons/logo.png']
  }}),
  chains: w3m_nets,
  projectId: YOUR_PROJ_ID
})

mobileBase

mobileBase({
  name, 
  img,
  order,
  mobile_link
})

Generates a wallet object for a mobile wallet.

name - name of the wallet
img - logo image URL
order - display order
mobile_link - deep link to open wallet on mobile
Returns wallet object for use in wallet selector

desktopBase

desktopBase({
  img,
  name 
})

Generates a desktop wallet object.

img - logo image URL
name - wallet name
Returns desktop wallet object

setInjected

setInjected(bool)

Set to false if you don't want to show Metamask injected connector

setWalletConnect

setWalletConnect(bool)

Set to false if you don't want to show WalletConnect button

walletBase

walletBase(bases)

Sets additional wallets to the modal window

bases - array of wallet objects with mobileBase and/or desktopBase