Left & right disabled
Quantity field: Informs the user what the current value is.
Button: Allows users to increase or decrease a value.
Within the quantity toggle
Ensure that there is at least 16px of horizontal spacing withi the quantity toggle.
Quantity toggle should be used:
- When the numeric field needs to be adjusted by a small amount that can be done with only a few clicks.
Quantity toggle should not be used:
- The numeric field can take a large range of values.
Ensure that a default value is shown within the field.
List the current value of the input so that user is able to know how much the value should increase/decrease upon clicking on up/down button.
Enable the user to also choose to type a number in the field.
User may prefer to type the value instead of clicking on the buttons, so such options should remain enabled.