@suiware/kit
TypeScript icon, indicating that this package has built-in type declarations

0.7.0 • Public • Published

@suiware/kit

Opinionated React components and hooks for building Sui dApps.

Demo

Installation

pnpm add @suiware/kit @mysten/dapp-kit @mysten/sui @mysten/suins @mysten/wallet-standard @tanstack/react-query

Usage

1. Import styles once in a higher order component

import '@mysten/dapp-kit/dist/index.css'
import '@suiware/kit/main.css'

Like so:

import '@mysten/dapp-kit/dist/index.css'
import '@suiware/kit/main.css'

function App() {
  return (
    <div className="main">
      Hey there!
    </div>
  )
}

2. Wrap your main component into SuiProvider

import '@mysten/dapp-kit/dist/index.css'
import '@suiware/kit/main.css'
import { SuiProvider } from '@suiware/kit'

function App() {
  return (
    <SuiProvider>
      <div className="main">
        Hey there!
      </div>
    </SuiProvider>
  )
}

3. Use @suiware/kit components and hooks

import '@mysten/dapp-kit/dist/index.css'
import '@suiware/kit/main.css'
import { SuiProvider, Balance } from '@suiware/kit'

function App() {
  return (
    <SuiProvider>
      <div className="main">
        Hey there! Your SUI balance is <Balance />
      </div>
    </SuiProvider>
  )
}

API reference

Providers

Components

Hooks

Package Sidebar

Install

npm i @suiware/kit

Weekly Downloads

48

Version

0.7.0

License

MIT

Unpacked Size

400 kB

Total Files

153

Last publish

Collaborators

  • kkomelin