Get started with React

TL;DR

One provider, zero Redux: install and wrap your app in <MdkProvider> so connected foundation components and adapter hooks share the same stores and API client
Presentational /core and /foundation imports can work without the provider
Anything that reads app state needs the provider

Choose your path

Quickstart

Install all three packages, wrap in MdkProvider, wire stores and theming⏱️ <3 min

Explore the demo

Single copy/paste to clone the monorepo and browse the full demo app in your browser⏱️ <1 min

Tutorial

Step-by-step app scaffold with MdkProvider, adapter hooks, and foundation components⏱️ <5 min

Build dashboards with your AI agent

Wire Cursor or Claude to MDK with the UI CLI, then build from plain-language prompts

Prerequisites

Node.js >=24
npm >=11
React 19+ and react-dom 19+

About the React stack

The React UI Kit is published as three workspace packages in the MDK monorepo:

@tetherto/mdk-ui-core — headless state (Zustand vanilla stores), a TanStack QueryClient factory, telemetry primitives, and the command state machine. No React.
@tetherto/mdk-react-adapter — React bindings: <MdkProvider>, store hooks (useAuth, useDevices, useNotifications, useTimezone, useActions) and re-exports of useQuery / useMutation.
@tetherto/mdk-react-devkit — the React UI library: ./core primitives and ./foundation mining-domain components, hooks, and styles.

@tetherto/mdk-ui-core is framework-agnostic; the adapter and devkit are React-specific. Add all three to your app’s package.json, then wrap the tree once in <MdkProvider> from @tetherto/mdk-react-adapter.

Next steps

Explore the Core primitives in @tetherto/mdk-react-devkit/core: buttons, forms, charts, and themes
Explore the Foundation components in @tetherto/mdk-react-devkit/foundation: mining-domain components and hooks
See the UI Kit overview for how the headless layer fits other frameworks
Browse the Hooks reference — state, component, and utility hooks