Checkbox

<Checkbox defaultChecked>Remember me</Checkbox>
<Checkbox>Subscribe to newsletter</Checkbox>
<Checkbox disabled>Disabled option</Checkbox>

const [items, setItems] = React.useState([true, false]);
const all = items.every(Boolean);
const some = items.some(Boolean) && !all;

<Checkbox
  checked={all}
  indeterminate={some}
  onCheckedChange={(next) => setItems(items.map(() => next))}
>
  Select all
</Checkbox>
{items.map((checked, i) => (
  <Checkbox
    key={i}
    checked={checked}
    onCheckedChange={(next) =>
      setItems(items.map((v, j) => (j === i ? next : v)))
    }
  >
    Item {i + 1}
  </Checkbox>
))}

<Checkbox size="sm">Small</Checkbox>
<Checkbox size="md">Medium</Checkbox>
<Checkbox size="lg">Large</Checkbox>
<Checkbox invalid>You must accept the terms</Checkbox>