Data InputCheckbox19 props
Checkbox Input
CheckboxInput toggles a single on/off value. Use it for settings like "Enable notifications", terms acceptance, or opt-in choices. For multiple checkboxes in a group, use Checkb...
공식 문서 열기Preview
Send a notification when previews change.
Import
import {CheckboxInput} from '@astryxdesign/core/CheckboxInput';Astryx 문서 권장 방식대로 root barrel이 아니라 컴포넌트 subpath에서 가져옵니다.
When to use
CheckboxInput toggles a single on/off value. Use it for settings like "Enable notifications", terms acceptance, or opt-in choices. For multiple checkboxes in a group, use Checkb...
checkboxchecktoggletickindeterminatebooleantristate
Important props
valueboolean | indeterminaterequired
changeAction(checked: boolean, e: ChangeEvent<HTMLInputElement>) => void | Promise<void>optional
sizesm | mdoptional
status{ type: error | warning | success, message: string }optional
Theming targets
astryx-checkbox-inputastryx-checkbox
Best practices
- DoAlways provide a visible label so the user knows what they are toggling. Use isLabelHidden only when surrounding context makes it obvious.
- DoAdd a description for choices that need extra context, like explaining what "Share usage data" actually shares.
- DoUse the indeterminate state for "select all" checkboxes when only some items in a group are selected.
- Do notUse a checkbox for mutually exclusive choices; use RadioList when only one option can be selected.