0.2.0 • Published 2 years ago

smartpkg v0.2.0

Weekly downloads
-
License
MIT
Repository
-
Last release
2 years ago

SmartPkg

Client to get Smart Contract ABI.

Why use SmartPkg?

We aim to improve developer experience in starting smart contract apps. Some problems we aim to solve:

  • Multi-chain smart contract development
  • Exploring smart contract ABI
  • Decoupling smart contract development from front/back-end development

Installation

npm install smartpkg

Usage

Here is an example of using smartpkg to get ABI.

import { ethers } from "ethers";
import smartpkg from "smartpkg";

const chainId = 1;
const address = "0x1f9840a85d5aF5bf1D1762F925BDADdC4201F984";

const abi = await smartpkg.getAbi(chainId, address);

// Use Smart Contract
const provider = new ethers.providers.Web3Provider(window.ethereum);
await provider.send("eth_requestAccounts", []);
const signer = provider.getSigner();
const contract = new ethers.Contract(address, abi, signer);
const symbol = await contract.symbol();
console.log(symbol);

For getting Smart Contract ABI,

const abi = await smartpkg.getAbi(chainId, address);

For directly calling a smart contract (deployed) function without ABI,

const contract = await smartpkg.contract(chainId, address, { signer });
const symbol = await contract.symbol();

For directly calling a smart contract function with ABI only,

const contract = await smartpkg.contract(chainId, address, { abi, signer });
const symbol = await contract.symbol();

SmartPkg Options

OptionsTypeDefaultDescription
debugbooleantrueDebug mode
signerSigner or ProviderundefinedSigner or provider from ethers.js
abiABIundefinedDebug mode
enableDevtoolsbooleantrueEnable devtools or not. Install @smartpkg/devtools
enableLoggingbooleantrueEnable logging or not.

SmartPkg devtools

Devtools help improve understanding smart contract function calls in your DApp.

npm install @smartpkg/devtools

In main.tsx, import devtool and add the component.

// main.tsx
import SmartpkgDevtool from '@smartpkg/devtools';

ReactDOM
  .createRoot(document.getElementById('root') as HTMLElement)
  .render(
    <React.StrictMode>
      <App />
      <SmartpkgDevtool />
    </React.StrictMode>
  );

Devtools

Devtools

Devtools Details

Devtools Details