Checkbox
Checkbox is a UI element that allows users to make a binary choice, typically represented as a square box that can be checked (selected) or unchecked (deselected).
Loading Code Block...
Installation
Section titled “Installation”To get started, install Butterfly DS via aqua:
Loading Code Block...
Loading Code Block...
sm
Loading Code Block...
Disabled
Section titled “Disabled”Loading Code Block...
Indeterminate
Section titled “Indeterminate”Loading Code Block...
Props | Default | Type | Description |
---|---|---|---|
size | md | 'sm' | 'md' | The size of the checkbox |
colorScheme | primary | 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'info' | The color scheme of the checkbox |
title | - | string | The title of the checkbox |
titleBold | true | boolean | Whether the title should be bold |
supportingText | - | string | Additional text to support the checkbox |
alignment | left | 'left' | 'right' | Alignment of the checkbox and text |
disabled | false | boolean | Whether the checkbox is disabled |
indeterminate | false | boolean | Whether the checkbox is in an indeterminate state |
name | - | string | The name attribute for the checkbox input |
id | - | string | The id attribute for the checkbox input |
value | - | string | number | boolean | The value of the checkbox input |
onChange | - | function | Function to call when the checkbox state changes |
className | - | string | Custom CSS class for additional styling |