Checkbox

Checkbox toggles a boolean. Pass checked and onChange to control it, or defaultChecked to leave it uncontrolled; onChange receives the next boolean directly. Provide a label (and optional description) to render the text beside it, fully wired for accessibility. Set indeterminate for the mixed state used by "select all" parents. Built on Headless UI for keyboard and focus handling.

Example

import { Checkbox } from '@officina/ui';
import { useState } from 'react';

function Example() {
  const [checked, setChecked] = useState(false);
  return (
    <Checkbox
      checked={checked}
      onChange={setChecked}
      label="Subscribe to updates"
      description="One email a week, no spam."
    />
  );
}

API