SelectionControl

Компонент, который представляет собой базовую обертку для переключателей (checkbox, radio, switch). Лежит в основе таких компонентов как Radio, Checkbox и Switch.

Загружается...

Применение компонента

С помощью данного компонента можно более гибко контролировать поведение и стилизацию всех типов переключателей. Может быть полезно, если вы хотите задать специфичную цветовую тему компонентов или изменить порядок текстовых элементов.

Структура

Компонент SelectionControl служит обёрткой для всего контента.

Подкомпонент SelectionControl.Label вкладывается в SelectionControl и используется для задания заголовка и подзаголовка переключателя.

Также в SelectionControl необходимо вложить нужный переключатель, для этого используйте соответствующие компоненты Checkbox.Input, Radio.Input или Switch.

Переключатели и подкомпонент SelectionControl.Label можно располагать в любом порядке.

Загружается...

Свойства и методы

SelectionControl

Свойство	Описание
`activeMode`	`StateModeLiteral` Стиль подсветки active-состояния. Если передать произвольную строку, она добавится как css-класс во время active. По умолчанию: `-`
`focusVisibleMode`	`FocusVisibleMode` Стиль аутлайна focus visible. Если передать произвольную строку, она добавится как css-класс при :focus-visible По умолчанию: `-`
`getRootRef`	`Ref<HTMLLabelElement>` По умолчанию: `-`
`hasActive`	`boolean` Указывает, должен ли компонент реагировать на `active`-состояние. По умолчанию: `-`
`hasHover`	`boolean` Указывает, должен ли компонент реагировать на `hover`-состояние. По умолчанию: `-`
`hoverMode`	`StateModeLiteral` Стиль подсветки hover-состояния. Если передать произвольную строку, она добавится как css-класс во время hover. По умолчанию: `-`

SelectionControl.Label

Свойство	Описание
`description`	`ReactNode` По умолчанию: `-`
`titleAfter`	`ReactNode` По умолчанию: `-`

Tappable