KQ-956 · ERROR/RATIO

Error Ratio

Good against bad on one rail. The two runs re-proportion on glide as each window arrives and the error ratio's digits roll on snap beside them, while a window whose bad share rose washes the bad run once on a three-keyframe tween and prints the word rising. The two legend controls are a roving-tabindex group where Left and Right step, Home and End jump, and Enter or Space latches the header reading to one side.

KQ-956 · ERROR/RATIO

last 60 ssteady

Window 1 of 10 · 0.31% · steady

Install

One command — the source lands in your repo. Or copy it from the Code tab.

$ pnpm dlx shadcn@latest add @kinetiq/error-ratio

Props

good: number; default —; Requests answered successfully in this window.
bad: number; default —; Requests that failed in this window.
warnAt: number; default 0.01; Error ratio at which the level word becomes elevated.
failAt: number; default 0.05; Error ratio at which the level word becomes breaking.
windowLabel: string; default "last 60 s"; The window's printed name; the meter never computes one from a clock.
label: string; default "Requests"; Names the meter for assistive technology.
held / defaultHeld: "good" | "bad" | null; default null; Controlled or initial side the header reading is latched to.
onHeldChange: (held: "good" | "bad" | null) => void; default —; Fires from the press that latched or released the header reading.
onLevelChange: (level: RatioLevel) => void; default —; Reports the level from the first commit as well as every change, because a level is a state.
onRise: (ratio: number) => void; default —; A settled event: fires when a window's bad share sits above the last one's.
format: (value: number) => string; default grouped integer; Renders every request count, so a host changes units in one place.

Prop	Type	Default	Description
good	number	—	Requests answered successfully in this window.
bad	number	—	Requests that failed in this window.
warnAt	number	0.01	Error ratio at which the level word becomes elevated.
failAt	number	0.05	Error ratio at which the level word becomes breaking.
windowLabel	string	"last 60 s"	The window's printed name; the meter never computes one from a clock.
label	string	"Requests"	Names the meter for assistive technology.
held / defaultHeld	"good" \| "bad" \| null	null	Controlled or initial side the header reading is latched to.
onHeldChange	(held: "good" \| "bad" \| null) => void	—	Fires from the press that latched or released the header reading.
onLevelChange	(level: RatioLevel) => void	—	Reports the level from the first commit as well as every change, because a level is a state.
onRise	(ratio: number) => void	—	A settled event: fires when a window's bad share sits above the last one's.
format	(value: number) => string	grouped integer	Renders every request count, so a host changes units in one place.