Stepper

Набор компонентов для создания элементов управления количеством, суммой и другими численными показателями.

Storybook

Комплексный компонент – Stepper

Доступность

Для добавления доступности по стандарту ARIA, необходимо указать значения пропсов ariaLabelDecrement, ariaLabelRemove, ariaLabelIncrement, которые попадут в соотвествующие aria-label атрибуты для кнопок уменьшения, удаления и добавления значения.

Пример

Live Editor

Result

Компоненты для кастомной сборки степпера

Используйте скомпанованный компонент Stepper, либо составные части, где корневым будет StepperRoot.

Модификаторы

При использовании модификатора showRemove, по достижению минимального количества кнопка минус заменяется на удалить. По нажатию на кнопку удалить вызывается обработчик удаления.

Компоненты для кастомной сборки степпера

StepperRoot

StepperButton

StepperValue

Доступность

Для добавления доступности по стандарту ARIA, необходимо указать атрибуты aria-label для кнопок уменьшения, удаления и добавления значения.

Пример

Live Editor

Result