Segment
Набор компонентов для создания группы сегментов. Структура для сегментов похожа на структуру маркированных списков.
Быстрый старт
Оберните в SegmentProvider компонент, в котором будут использованы SegmentGroup с SegmentItem.
Внутри данного провайдера есть доступ к хуку useSegment.
- Uncontrolled
- Controlled
Можно задать выбранные по умолчанию сегменты с помощью свойства defaultSelected.
Оно передается в SegmentProvider, в виде массива value элементов.
Для управляемого режима используйте свойства selected и onChangeSelected.
Управление внешним видом
- Orientation
- Pilled
- Size
Для смены ориентации передаем orientation: 'vertical'
Для скругленных углов используйте свойство pilled
Размер сегмента (высота, отступы, шрифт) задаёт size на SegmentItem.
size на SegmentGroup меняет только скругление контейнера и отступы стрелок прокрутки.
Передавайте одинаковый size в группу и в элементы.
Доступные размеры: xs, s.
Обязательный активный SegmentItem
С помощью свойства singleSelectedRequired задается поведение,
при котором один сегмент должен быть активным.
Сегменты только с иконкой
Для отображения сегментов с только иконкой, необходимо использовать SegmentIconItem