Checkbox
Независимый флажок с подписью.
onChange получает checked, value и исходное событие. indeterminate показывает частичный выбор.
Живой пример
Настройки примера
Использование
'use client';
import { Checkbox } from '@prosazhin/pbcomponents';
import { useState } from 'react';
function Example() {
const [checked, setChecked] = useState(false);
return (
<Checkbox
value='one'
checked={checked}
onChange={setChecked}
>
Label
</Checkbox>
);
}API компонента
| Prop | Тип / варианты | Назначение | По умолчанию |
|---|---|---|---|
children | string | Содержимое компонента. | — |
size | 's' | 'm's · m | Размер компонента. | m |
labelPlace | 'left' | 'right'left · right | Положение подписи относительно контрола. | right |
checked | boolean | Текущее выбранное состояние. | false |
disabled | boolean | Блокирует взаимодействие. | false |
indeterminate | boolean | Промежуточное состояние, например при частичном выборе. | false |
value | string | Значение пункта формы. | — |
onChange | (checked: boolean, value: string, event: InputEvent) => void | Сообщает новое состояние и значение пункта. | — |
className | string | Класс корневого элемента. | — |
wrapperClassName | string | Класс внешней обёртки. | — |
textClassName | string | Класс текстовой части. | — |
Нативные HTML-атрибуты поддерживаются там, где компонент рендерит соответствующий элемент. Параметры className управляют только оформлением.