Custom styled checkbox not working correctly when rendered as a selection checkbox in a table

# 🐛 Bug Report
When using a custom-styled checkbox (useCheckbox) as a selection checkbox in a table (useTable), it seems to get toggled twice so the row will never be selected. And for the (de)select all checkbox it seems to not getting triggered at all.

## 🤔 Expected Behavior
To function the same as a checkbox without custom styling.

## 😯 Current Behavior
The styled checkboxes are triggered twice and the select-all checkbox is not triggered at all. Whereas the non styled checkboxes are working fine. I made a reproduction of this issue based on the example snippets of the useTable and useCheckbox docs.
[Sandbox here](https://codesandbox.io/s/clever-haze-e6x6d)

## 💁 Possible Solution

## 🔦 Context
For our project, we need to have different styled checkboxes than the standard ones. But we want to have the features that this library brings, so that's why we use the useChecbox hook and add styles as shown in the examples.

## 💻 Code Sample
https://codesandbox.io/s/clever-haze-e6x6d

## 🌍 Your Environment

| Software | Version(s) |
| ---------------- | ---------- |
| react-spectrum | latest
| Browser | chrome, firefox, safari - all latest
| Operating System | macos - latest