recursica-skill-checkbox

Compose all three components together: checkbox-group owns layout and spacing, checkbox-item pairs each option's label with a box, and checkbox owns the selection state. Never place bare checkbox instances in a form and call it a group.

Use checkboxes for zero-to-many independent selections that commit with the form. Use a radio group for exactly one mutually exclusive choice, and a switch when the change must apply the instant it is flipped.

Keep the group within 7 ± 2 options, biased lower when options are dissimilar or cognitively demanding. Above that ceiling, convert to a multi-select dropdown, though note the Recursica kit currently lacks a multi-select dropdown component.

Clicking an indeterminate header checkbox always goes to fully checked, never unchecked. From fully checked or unchecked, a click flips to the other state. Indeterminate is reachable only by selecting or deselecting individual rows.

No. Checkbox items must always stack vertically because horizontal rows make it unclear which box belongs to which label. The side-by-side layout option only controls group label placement, not item orientation; use selectable chips if a row is required.

Every item needs a real label as its accessible name, the group needs its own announced label, and checked and indeterminate states must be exposed programmatically. Space toggles the box, every checkbox is its own tab stop, and focus must never be moved for the user.