# Requirements

#### Installation

Install the widget from your package registry:

`pnpm add @zofai/trading-widget` or `npm install @zofai/trading-widget` or `yarn add @zofai/trading-widget`

NPM:

{% embed url="<https://www.npmjs.com/package/@zofai/trading-widget>" %}

### Peer dependencies

Your app must install:

* `react` & `react-dom` (≥18)
* `jotai` (≥2)
* `@tanstack/react-query` (≥5)
* `@mysten/dapp-kit-react` (≥1) & `@mysten/sui` (≥2)
* `zo-sdk` (≥0.1)

#### Styling

The widget uses Tailwind-compatible utility classes (e.g. `flex`, `text-white`, `rounded-lg`). Either:

* Use **Tailwind CSS** or **UnoCSS** in your app so those classes resolve, or
* Import the bundled CSS once in your app: `import '@zofai/trading-widget/style.css'` . This file contains the compiled UnoCSS used by the widget.