@tz-contrib/react-wallet-provider

Provider for tezos wallet for react apps

Usage no npm install needed!

<script type="module">
  import tzContribReactWalletProvider from 'https://cdn.skypack.dev/@tz-contrib/react-wallet-provider';
</script>

README

@tz-contrib/react-wallet-provider

A react provider for Dapps to easily setup connection to Beacon/Taquito wallets

npm (scoped) npm bundle size (scoped)

Installation

  • Npm
npm install --save @tz-contrib/react-wallet-provider @airgap/beacon-sdk @taquito/beacon-wallet
  • Yarn
yarn add @tz-contrib/react-wallet-provider @airgap/beacon-sdk @taquito/beacon-wallet

Example usage

import { WalletProvider, useWallet } from '@tz-contrib/react-wallet-provider';

export default function App() {
  return (
    <WalletProvider name="my-example-app" clientType="beacon">
      <Example />
    </WalletProvider>
  );
}

function Example() {
  const { connected, activeAccount, connect, disconnect } = useWallet();
  return (
    <div>
      <header>
        {!connected && <button onClick={connect}>Connect</button>}
        {connected && (
          <button onClick={disconnect}>Disconnect from {activeAccount?.address}</button>
        )}
      </header>
    </div>
  );
}