Skip to content

Checkbox

Overview

A checkbox built on Reka UI's CheckboxRoot, displaying a check icon when checked and a minus icon when indeterminate.

Theme entry: Checkbox

Props

NameTypeRequiredDefaultDescription
iconOverrideObjectnullA partial icon registry ({ [componentName]: { [iconName]: { component, props } } }) merged with inherited and default icon entries; scopes icon overrides to this component and its descendants.
themeOverrideString|Object|ArraynullA partial theme object merged with the component's default theme; accepts a class string, class array, or theme object.
classstring|array|objectundefinedAdditional CSS classes to apply to the checkbox root.
defaultValueboolean|stringundefinedThe default checked state when uncontrolled.
modelValueboolean|stringundefinedThe controlled checked state (used with v-model).
disabledbooleanundefinedWhether the checkbox is disabled.
valuestringundefinedThe value submitted with a form when checked.
idstringundefinedThe id applied to the underlying input element.
trueValueboolean|stringundefinedThe value representing the checked state.
falseValueboolean|stringundefinedThe value representing the unchecked state.
asstring|objectundefinedThe element or component to render as.
asChildbooleanfalseWhen true, merges props onto the child element instead of rendering a wrapper.
namestringundefinedThe name submitted with a form.
requiredbooleanundefinedWhether the field is required.

Slots

default

Scoped slot.

Events

NameDescription
update:modelValueEmitted when the value changes.

Full event reference

Source

client/lib/controls/checkbox/Checkbox.vue

Documents matching: server v3.0.0a1.post1client v3.0.0-alpha.2