MDK Logo
UI Kitreact-devkitComponentsFoundationWidgets

StatusItem

Compact labelled status pill used inside container panels for boolean or enum readings. Displays a label with a colored status indicator.

Compact labelled status pill used inside container panels for boolean or enum readings.

Displays a label with a colored status indicator.

import { StatusItem } from "@tetherto/mdk-react-devkit";
PropStatusTypeDefaultDescription
labelOptionalstring | undefinedStatus label text
statusOptional"warning" | "normal" | "fault" | "unavailable" | undefinedStatus type

Usage

Compact labelled status pill used inside BitMain container panels for boolean or enum readings. Renders a label alongside a coloured indicator driven by the status value.

Minimal example

import { StatusItem } from "@tetherto/mdk-react-devkit";

<StatusItem label="Circulation Pump" status="running" />

Example

import { StatusItem } from '@tetherto/mdk-react-devkit'export const StatusItemExample = () => (  <div className="mdk-example-row">    <StatusItem label="Circulation Pump" status="normal" />    <StatusItem label="Exhaust Fan" status="fault" />    <StatusItem label="Dry Cooler" status="warning" />  </div>)