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

Features

• 🪝 8+ hooks for interfacing with Keplr Wallet (connecting, view balances, etc.)
• 📚 Built-in caching, request deduplication, and all the good stuff from react-query and zustand
• 🔄 Auto refresh on wallet and network change
• 👏 Fully typed and tree-shakeable
• ...and many more ✨

---

🚧 Currently in development and might not be ready for production use, expect breaking changes until we reach version 1.x 🚧

---

Installing

# using npm
npm install graz

# using yarn
yarn add graz

Quick start

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

import { GrazProvider } from "graz";

function App() {
  return (
    <GrazProvider>
      <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(undefined) : connect(mainnetChains.cosmos);
  }

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

View an example app at https://graz-example.vercel.app

API

Read more on available hooks and other imports at API.md.

Maintainers

• Griko Nibras (@grikomsn)
• Nur Fikri (@codingki)

License

MIT License, Copyright (c) 2022 Strangelove Ventures