@samatech/vue3-eth NPM

Description

This library relies on the Vue3 composition API. Ethereum activity is handled by Ethers.

Currently, only Metamask is supported as a wallet provider, but work is in progress to integrate WalletConnect and others.

Usage

Install

We recommend PNPM for Javascript package management.

pnpm i -D @samatech/vue3-eth

Configuration

The only configuration is ethChainId, which is an optional string indicating the intended network to connect to. It's only used for error checking, which is skipped if left out.

import { useChain } from '@samatech/vue3-eth';

const chain = useChain({ ethChainId: 'ropsten' });

Callbacks

Callbacks are included in the object returned by useChain.

onSetupProvider

const { onSetupProvider } = useChain();

onSetupProvider((signer) => {
  // The eth provider is connected. Store the signer if you need it later
  // Make sure "signer" is NOT reactive, this will break ethers.js
});

onConnect

const { onConnect } = useChain();

onConnect((address) => {
  // ethers.js setup complete, you can now use all library functions
});

onDisconnect

const { onDisconnect } = useChain();

onDisconnect(() => {
  // Disconnected from blockchain
  // "connectWallet" or "reconnectWallet" must be called to use the library again
});

onChainChanged

const { onChainChanged } = useChain();

onChainChanged((chainId) => {
  // The user changed the blockchain/network
});

onAccountsChanged

const { onAccountsChanged } = useChain();

onAccountsChanged((accounts) => {
  // The user switched accounts
});

Reactive variables

loadingAccount - Boolean indicating whether a connection is in progress. (Default false)

connectError - String/key that represents the current error state. (Default null)

Error descriptions:

errors.no_metamask - Metamask is not available in the current browser context
errors.not_connected - A blockchain access function was called before a provider was connected
errors.user_rejected - The user rejected the transaction
errors.nonce_high - The Metamask account nonce doesn't match the expected value. This happens when a local testnet is reset after use, the solution is to go to Metamask options -> Advanced -> Reset Account
errors.tx_reverted - The transaction failed for some reason
errors.unknown - An unknown error occurred

wrongNetwork - Boolean, true if connected to a network not specified by ethChainId config

walletConnected - Boolean, true if currently connected (after onConnect, before onDisconnect)