Number Field

A number field allows a user to enter a number, and increment or decrement the value using stepper buttons.

Installation

CLI

Copy & Paste

bash

npx @sly-cli/sly add draft-ui number-field

This is the default NumberField

Example

Code

Width

This is an example using the built-in NumberInputStepper.

Example

Code

Width

This is an example of a custom NumberField that makes the stepper buttons easier to press on touch devices.

Example

Code

Width

Use the isDisabled prop to make the NumberField disabled.

Example

Code

Width