UI Reference
Complete API reference for MDK UI packages
Complete API reference for the MDK UI packages: @tetherto/mdk-react-devkit, @tetherto/mdk-react-adapter, and @tetherto/mdk-ui-foundation.
Quick links
| Section | Description | Count |
|---|---|---|
| Components | React components for building UIs | 158 components |
| Hooks | React hooks for state and data | 33 hooks |
| Query Helpers | TanStack Query helpers for data fetching | 7 queryHelpers |
| Stores | Zustand stores for state management | 4 stores |
| Types | TypeScript type definitions | 126 types |
| Utilities | Helper functions and formatters | 80 utilities |
Package overview
@tetherto/mdk-react-devkit
The main UI component library. Provides:
- Production-ready React components
- Component-specific hooks
- TypeScript types for all components
import { Button, DataTable, SiteStatsBar } from '@tetherto/mdk-react-devkit'@tetherto/mdk-react-adapter
React bindings for the foundation layer. Provides:
MdkProvider, which resolves the API base URL and publishes the auth provider to everything below it- Zustand store access hooks
- Authentication hooks
- Permission hooks
- Hooks that project dashboard state
Hooks that reach the Gateway go through the provider's query client, so wrap your app in MdkProvider first.
Install and wire the React packages covers the setup.
import { MdkProvider, useAuth, useDevices, useGetAvailableDevices } from '@tetherto/mdk-react-adapter'@tetherto/mdk-ui-foundation
Framework-agnostic foundation layer. Provides:
- Zustand stores
- TanStack Query helpers
- Utility functions
- TypeScript types
import { checkPermission, isMiner } from '@tetherto/mdk-ui-foundation'Get started
- Install the packages
- Import styles:
import '@tetherto/mdk-react-devkit/styles.css', thenimport '@tetherto/mdk-react-devkit/styles-domain.css'if you use the mining-domain components. Styling covers both - Browse components by category or search for specific APIs