The Checkbox component is controlled component input field that handles user events.
For more on controlled components [see here](https://reactjs.org/docs/forms.html#controlled-components).

All props, except for `extend`, will be passed through.

### Example

```jsx live=true
() => {
  const [checked, setChecked] = React.useState(true);
  return (
    <Checkbox
      checked={checked}
      onChange={e => setChecked(e.target.checked)}
    />
  );
};
```

### Invalid state

```jsx live=true
() => {
  const [checked, setChecked] = React.useState(true);
  return (
    <Checkbox
      isValid={false}
      checked={checked}
      onChange={e => setChecked(e.target.checked)}
    />
  );
};
```