@josefleventon/graz

0.0.0 • Public • Published

graz

npm/v npm/dt stars

graz-interchain adds multiple chain support for graz.

graz is a collection of React hooks containing everything you need to start working with the Cosmos ecosystem.

Features

  • 🪝 20+ hooks for interfacing with wallets, clients, signers, etc. (connecting, view balances, send tokens, etc.)
  • 💳 Multiple wallet supports (Keplr, Leap, Cosmostation, WalletConnect )
  • ⚙️ Generate mainnet & testnet ChainInfo from chain registry
  • 📚 Built-in caching, request deduplication, and all the good stuff from @tanstack/react-query and zustand
  • 🔄 Auto refresh on wallet and network change
  • 👏 Fully typed and tree-shakeable
  • ...and many more ✨

Requirements

graz requires react@>=17 due to using function components and hooks and the new JSX transform.

Installing

Install graz using npm, yarn, or pnpm:

# using npm
npm install graz

# using yarn
yarn add graz

# using pnpm
pnpm add graz

Quick start

Wrap your React app with <GrazProvider /> and use available graz hooks anywhere:

import { GrazProvider, mainnetChains } from "graz";

function App() {
  return (
    <GrazProvider
      // optional
      grazOptions={{
        defaultChain: mainnetChains.cosmos,
      }}
    >
      <Wallet />
    </GrazProvider>
  );
}
import { mainnetChains, useAccount, useConnect, useDisconnect } from "graz";

function Wallet() {
  const { connect, status } = useConnect();
  const { data: account, isConnected } = useAccount();
  const { disconnect } = useDisconnect();

  function handleConnect() {
    return isConnected ? disconnect() : connect();
  }

  return (
    <div>
      {account ? `Connected to ${account.bech32Address}` : status}
      <button onClick={handleConnect}>{isConnected ? "Disconnect" : "Connect"}</button>
    </div>
  );
}

Examples

Third-party dependencies

graz uses various dependencies such as @cosmjs/cosmwasm-stargate and @keplr-wallet/types.

Rather than importing those packages directly, you can import from graz/dist/cosmjs and graz/dist/keplr which re-exports all respective dependencies:

- import type { CosmWasmClient } from "@cosmjs/cosmwasm-stargate";
+ import type { CosmWasmClient } from "graz/dist/cosmjs";

But if you prefer importing from their respective pacakges, you can install dependencies that graz uses for better intellisense:

# using pnpm
pnpm add @cosmjs/cosmwasm-stargate @cosmjs/proto-signing @cosmjs/stargate @keplr-wallet/types

API

You can read more about available hooks and exports on Documentation Site or via paka.dev.

Maintainers

License

MIT License, Copyright (c) 2023 Graz

Readme

Keywords

none

Package Sidebar

Install

npm i @josefleventon/graz

Weekly Downloads

0

Version

0.0.0

License

MIT

Unpacked Size

5.28 MB

Total Files

258

Last publish

Collaborators

  • josefleventon