KasyKasy

Number Field

Live preview and documentation for the Number Field component.

Preview

componentPreview.loading

About

A numeric field with +/ steppers instead of free typing — the value only changes via the buttons and is read-only. Inherits label, description, error, and focus outline from the kit's standard text field.

  • value / onChanged: controlled; onChanged receives the new int.
  • min / max: bound the steppers and dim the button once the limit is reached.
  • step: increment/decrement per tap (default 1).
  • label, hint, description, errorText, isInvalid, showRequiredIndicator: the same fields as a regular KasyTextField.
  • variant: reuses KasyTextFieldVariant (the same visual variants as the text field).
  • enabled: disables the whole field.
  • showFocusRing: when true (default), tapping +/ focuses the entire field and lights up the outline; false disables that outline.

Tapping either stepper focuses the whole field (not an isolated ring on the button), so the focus outline lights up around the entire field, just like clicking to type.

Last updated on 08/23/2026

On this page