Main
 Installation Versioning Theming Typography Design tokens Schematics Migration guides
Components
 Accordion Actions panel AG grid Alert App Switcher Autocomplete Badge Breadcrumbs Button Button Group Button toggle Checkbox Clamped list Clamped text Code block Content panel Core Datepicker Description list Divider Dropdown Dynamic translation Empty state File upload Filter Bar Form field Icon Icon Button Icon Item Inline edit Input Layout flex Link List Markdown Modal Navbar Notification Center Overflow items Overlay Popover Progress bar Progress spinner Radio Resizer Scrollbar Search expandable Select Sidebar Sidepanel Skeleton Split button Splitter Table Tabs Tag Tag autocomplete Tag input Tag list Textarea Time range Timepicker Timezone Title Toast Toggle Tooltip Topbar Tree Tree select Username
Other
 Date formatter Filesize formatter Forms Number formatter Validation
Icons
CDK
 Key managers Keycodes
Interface and examples language
English
Version
19.7.0
Checkbox
Dual-state

Dual-state is applied using the boolean attribute [checked] to show whether the checkbox is checked or not.

Indeterminate state (partial selection)

The indeterminate state is applied using the boolean attribute [indeterminate] and can be used when you have a group of options and a higher-level checkbox should reflect their state:

  • If only some options in the group are selected, the higher-level checkbox appears partially selected ([indeterminate]="true").
  • If all are selected, the higher-level checkbox is shown as checked.
  • If none are selected, the higher-level checkbox appears unchecked.
Click action config

When the user clicks on a kbq-checkbox, the default behavior toggles the checked value and sets indeterminate to false. This behavior can be configured by providing a new value for KBQ_CHECKBOX_CLICK_ACTION on the checkbox.

providers: [
    { provide: KBQ_CHECKBOX_CLICK_ACTION, useValue: 'check' }
]

Possible values: noop, check, check-indeterminate

Pseudo checkbox
Multiline
Docs Feedback
If you have any questions or would like to contribute to writing the documentation, please create an issue in our GitHub repository.