CheckboxGroup

Multiple checkboxes as one field with a string[] value. Includes label / hint / error chrome.


import { CheckboxGroup } from '@gg-software/ui';
 
<CheckboxGroup
    label="Notifications"
    options={[
        { label: 'Email', value: 'email' },
        { label: 'SMS', value: 'sms' },
    ]}
    value={channels}
    onChange={(values) => setChannels(values)}
/>;

Props

Prop	Type	Default
`options`*	`CheckboxGroupOption[]`	—
`value`	`string[]`	—
`defaultValue`	`string[]`	`[]`
`onChange`	`((value: string[]) => void)`	—
`disabled`	`boolean`	`false`
`direction`	`"horizontal" \| "vertical"`	`vertical`
`label`	`ReactNode`	—
`hint`	`ReactNode`	—
`error`	`ReactNode`	—
`required`	`boolean`	—
`name`	`string`	—
`className`	`string`	—

* required · generated from packages/ui/src/input/CheckboxGroup/CheckboxGroup.tsx

Types


type CheckboxGroupOption = {
    label: ReactNode;
    value: string;
    disabled?: boolean;
};