전체 카탈로그
Data InputCheckbox13 props

Checkbox List

CheckboxList shows a small group of checkboxes so users can turn several options on or off at once. Place it in settings pages, filter panels, or forms where every choice should...

공식 문서 열기
live previewData Input

Preview

Notification channels

Import

import {CheckboxList} from '@astryxdesign/core/CheckboxList';

Astryx 문서 권장 방식대로 root barrel이 아니라 컴포넌트 subpath에서 가져옵니다.

When to use

CheckboxList shows a small group of checkboxes so users can turn several options on or off at once. Place it in settings pages, filter panels, or forms where every choice should...

checkboxlistcheckboxcheckboxgroupmultichoicemultiselectchecklist

Important props

changeAction(values: string[]) => void | Promise<void>optional
densitycompact | balanced | spaciousoptional

Theming targets

이 항목은 공개 theming target이 문서화되어 있지 않습니다.

Best practices

  • DoKeep the list short: three to seven options is the sweet spot. Beyond that, switch to MultiSelector which adds search and scrolling.
  • DoTurn on dividers (hasDividers) when items have helper text underneath; without them the labels and descriptions blur together.
  • DoWrite a group label that says what the choices represent: "Export formats" tells users more than "Options".
  • Do notShow a CheckboxList when the user can only pick one thing; that is what RadioList is for.