A compact numeric control with native input semantics and plus/minus actions.
Stepper defines how EnterUI handles a compact numeric control with native input semantics and plus/minus actions, including default structure, accessible states, and token-driven styling.
Use Stepper for small bounded numeric adjustments.
<Stepper aria-label="Quantity" defaultValue={1} min={0} max={10} />import { Stepper } from "@froggdesign/enter-ui-react";<Stepper value={count} onValueChange={setCount} min={0} max={10} />The input remains a native number input. Increment and decrement buttons have accessible labels and clamp to min / max.
value / defaultValue support controlled and uncontrolled usage.min, max, and step control bounds.onValueChange receives the clamped number.inputProps passes attributes to the inner input.Uses .eui-stepper classes and the same hover/focus rhythm as EnterUI inputs.