The `CheckBoxGroup` component provides a flexible and user-friendly way to display a group of checkboxes, with a dropdown view for option selection and a toggle mechanism that allows the user to either select or deselect multiple options. It is ideal for managing and displaying a set of checkboxes while maintaining a compact UI.
npm i @anakin-gbit/checkbox-group const [types, setTypes] = useState(['Enhancement', 'Problem'])
return <CheckBoxGroup
label="Type"
options={['Enhancement', 'Incident', 'Problem', 'Change', 'Request']}
selectedOptions={types}
setSelectedOptions={setTypes}
/>Selected types: Enhancement; Problem;
label | string | The label for the checkbox group, displayed above the options. |
options | string[] | An array of strings representing the available options to choose from. |
selectedOptions | string[] | An array of strings representing the selected options. |
setSelectedOptions | (newOptions: string[]) => void | A function that updates the selected options when a checkbox is toggled. |