TankRow | MDK

Single tank-list row used inside `TanksBox` to display per-tank temperature and pressure.

Single tank-list row used inside <TanksBox> to display per-tank temperature and pressure.

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

Prop	Status	Type	Default	Description
`label`	Required	`string`	—	—
`temperature`	Required	`number`	—	—
`unit`	Required	`string`	—	—
`oilPumpEnabled`	Required	`boolean`	—	—
`waterPumpEnabled`	Required	`boolean`	—	—
`color`	Required	`string`	—	—
`flash`	Optional	`boolean \| undefined`	—	—
`tooltip`	Optional	`string \| undefined`	—	—
`pressure`	Required	`Partial<{ value: number; flash: boolean; color: string; tooltip: string; }>`	—	—

Usage

TanksBox renders the full tank list for an immersion container, one TankRow per tank. Each row shows per-tank temperature, pressure, and oil/water pump running status.

TanksBox Props

Prop	Type	Required	Default	Description
`data`	`{ oil_pump: Tank[]; water_pump: WaterPump[]; pressure: TanksBoxPressure[] }`	no	—	Tank telemetry arrays; returns `null` when omitted.

TankRow Props

Prop	Type	Required	Default	Description
`label`	`string`	yes	—	Tank identifier label (e.g. "Tank 1").
`temperature`	`number`	yes	—	Current temperature value.
`unit`	`string`	yes	—	Temperature unit string (e.g. "°C").
`oilPumpEnabled`	`boolean`	yes	—	Running state for the oil pump.
`waterPumpEnabled`	`boolean`	yes	—	Running state for the water pump.
`color`	`string`	yes	—	CSS colour for the temperature value (threshold-driven).
`flash`	`boolean`	no	—	Enables flash animation on the temperature row.
`tooltip`	`string`	no	—	Tooltip text for the temperature value.
`pressure`	`TankRowPressure`	yes	—	Pressure reading with optional flash/colour/tooltip.

Minimal example

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

<TanksBox
  data={{
    oil_pump: [{ cold_temp_c: 45, enabled: true }],
    water_pump: [{ enabled: true }],
    pressure: [{ value: 1.2 }],
  }}
/>

Example

import { TanksBox } from '@tetherto/mdk-react-devkit'export const TanksBoxExample = () => (  <div className="mdk-example-row">    <TanksBox      data={{        oil_pump: [          { cold_temp_c: 45, enabled: true, color: 'green' },          { cold_temp_c: 48, enabled: true, color: 'yellow' },        ],        water_pump: [{ enabled: true }, { enabled: false }],        pressure: [{ value: 1.2 }, { value: 1.5 }],      }}    />  </div>)