Components
React components for building mining application UIs
The @tetherto/mdk-react-devkit package provides production-ready React components organized by category.
Prerequisites
- Complete the installation
- Import the core styles in your app's entry point:
import '@tetherto/mdk-react-devkit/styles.css'Browse by category
| Category | Description |
|---|---|
| Actions | Buttons, action triggers, and export controls |
| Auth | Authentication and sign-in components |
| Branding | Logos, wordmarks, and brand elements |
| Cards | Card containers and card-based layouts |
| Charts | Data visualization and chart components |
| Dashboard | Dashboard layouts and containers |
| Dashboards | Pre-built dashboard compositions |
| Dialogs | Modal dialogs and confirmation prompts |
| Display | Data display and formatting components |
| Features | Feature-specific composite components |
| Feedback | Alerts, toasts, and user feedback |
| Filters | Filter controls and filter bars |
| Forms | Form inputs, selects, and validation |
| Layout | Page layouts, grids, and spacing |
| Media | Images, icons, and media display |
| Misc | Utility and miscellaneous components |
| Monitoring | System monitoring and status displays |
| Navigation | Sidebars, tabs, and navigation menus |
| Overlays | Popovers, tooltips, and overlay panels |
| Pages | Full-page layouts and page shells |
| Settings | Settings panels and preference controls |
| Tables | Data tables and table utilities |
| Widgets | Dashboard widgets and data cards |
Import pattern
Components are imported from the package root:
import { Button, Card, DataTable } from '@tetherto/mdk-react-devkit'Styling
Components use BEM-style CSS classes (e.g., .mdk-button, .mdk-card__header) for styling consistency. Every component forwards className to its root element.