Number input

A number input combines a text input field with buttons to provide users with a quick and effective way to enter and modify a numeric value.

Examples

Attribute	Applied to	Outcome
`aria-label="Plus"`, `aria-label="Minus"`	`.pf-v6-c-button.pf-m-control`	Provides an accessible name for the outer plus/minus buttons. Required
`min`	`input[type="number"].pf-v6-c-form-control`	Provides an optional minimum value for the input.
`max`	`input[type="number"].pf-v6-c-form-control`	Provides an optional maximum value for the input.

Class	Applied to	Outcome
`.pf-v6-c-number-input`	`<div>`	Initiates the number input component.
`.pf-v6-c-number-input__icon`	`<span>`	Initiates the number input icon.
`.pf-v6-c-number-input__unit`	`<span>`	Initiates the number input unit.
`.pf-m-status`	`.pf-v6-c-number-input`	Modifies the width to create enough space for a status icon to be included in the form control portion of the number input. Required if a status icon may be shown, even if the icon is not currently shown.
`--pf-v6-c-number-input--c-form-control--width-chars`	`.pf-v6-c-number-input`	Specifies the number of characters to show in the input.