Meter
限额或配额:标签和数值、6px 胶囊轨道、阈值刻度和说明文字。工作进度请用 Progress。
Monthly budget$32.10 of $50.00
Resets in 12 days
<Meter className="w-400" label="Monthly budget" value={0.642} valueLabel="$32.10 of $50.00" thresholds={[0.8]} caption="Resets in 12 days" />import { Meter, Progress } from "@logicplanes/kaeso-ui";属性
aria-labelstring无障碍名称,用于没有可见标签的情况。
captionReactNode“12 天后重置”
labelReactNode进度条上方的标签。
leadingReactNode标签行中的前置内容(一个图标)。
thresholdsnumber[] = []以比例表示的告警阈值,绘制为刻度:[0.5, 0.8]。
tone"neutral" | "auto" = auto按填充程度为进度条着色(
auto),或保持中性。trailingReactNode标签行末尾的内容,例如数值。
valuenumber0–1(超出限额时可更大)。
valueLabelReactNode“$32.10 / $50.00”