ink-ui

๐Ÿงพ KeyValue

Aligned label/value row for detail panels and status summaries.

<KeyValue> renders a dimmed label and aligned value for detail panels, status summaries, and diagnostics.

import { KeyValue } from "@kud/ink-ui";

๐Ÿ”ง Props

PropTypeDefaultDescription
labelstringโ€”Dimmed row label
valueReact.ReactNodeโ€”Row value
labelWidthnumber12Fixed label column character

๐Ÿ’ก Examples

<KeyValue label="Interface" value="utun4 ยท MTU 1400" />

On this page