import { Checkbox } from "@brijbyte/md3-react/checkbox";@import "@brijbyte/md3-react/checkbox.css";Let people pick any number of options from a list, not just one — including the
indeterminate state for a "select all" row whose children are only partly checked. It
renders on Base UI's Checkbox primitive, so keyboard toggling and aria-checked (including
"mixed" for indeterminate) work correctly without extra wiring.
Flag an invalid selection without hand-picking colors: the error prop switches every
color role to the error palette and sets aria-invalid in one step. Disabled state still
wins if both apply.
Native form validation gets the same styling for free, so there's no need to wire up the
error prop by hand. Inside a Base UI Field,
constraints like required mark the checkbox with data-invalid, which the stylesheet
treats identically to the error prop. Uncheck the box below to trigger its required
constraint.
import { Field } from "@base-ui/react/field";