KQ-004 · CHECKBOX

Checkbox

The tick is drawn, not shown — a pathLength stroke on flick, an indeterminate dash that slides in, and group select-alls that cascade down the list.

KQ-004 · CHECKBOX
Sample prep

Install

One command — the source lands in your repo. Or copy it from the Code tab.

$ pnpm dlx shadcn@latest add @kinetiq/checkbox

Props

PropTypeDefaultDescription
checked / defaultCheckedbooleanControlled or uncontrolled checked state.
indeterminatebooleanfalseMixed state — dash visual plus native el.indeterminate.
onCheckedChange(checked: boolean) => voidFires with the next checked state.
label / descriptionReactNodeVisible label (required) and muted secondary line.
CheckboxGroupitems, value, onValueChange, selectAll, legend…Fieldset-based group with select-all parent (checked / unchecked / indeterminate) and cascading tick draws.