Package Exports

web3-react-wallet
web3-react-wallet/dist/index.js
web3-react-wallet/dist/web3-react-wallet.esm.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (web3-react-wallet) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

web3 react wallet

Web3 React Wallet (WRW) is a wrapper around Web3 React (WR) library, and for frameworks derived from React like NextJS.

What is Web3 React Wallet?

Configuring WR is time consuming, requires multiple libraries to be installed and to handle switch chains, TypeScript etc. needs few more lines of code. WRW provides all of these things in a single package.

Installation

React.js

web3 react wallet is available on npm. To install it, type:

$ npm install web3-react-wallet

Usage

Import the library in your code, and then follow these code snippets:

// App.js
import { providers, Web3ReactProvider } from 'web3-react-wallet';

const App = () => {
  const { getLibrary } = providers();

  return (
    <Web3ReactProvider getLibrary={getLibrary}>
      <Home />
    </Web3ReactProvider>
  );
};

// Home.js
import { ConnectorNames, useAuth } from 'web3-react-wallet';

function Home() {
  const { login, useWeb3React } = useAuth();
  const { account } = useWeb3React();

  const conf = {
    chainId: 1,
    infuraId: "abcd1234wxyz6789",
    websiteName: "Wonderful Swap",
    websiteDescription: "Low slippage and high liquidity",
    websiteIconURL: "https://i.ibb.co/QMLVML7/web3-react-wallet.png",
    websiteURL: "https://example.org"
  }

  return(
    <div>
      Website Logo
      <button onClick={() => {
        login(ConnectorNames.Injected, conf);
      }}>Connect MetaMask</button>
    </div>
  )
}

Supported wallets and chains

MetaMask and WalletConnect
Ethereum Mainnet and Ethereum Tesnet Rinkeby

Support for more chains is coming soon. To learn more please head over to example folder.