Provide a general summary of the issue here

Sequential presses to a Radio or Checkbox component will call onBlur upon the second press.

🤔 Expected Behavior?

onBlur shouldn't be called on sequential presses of the "input" element (red border)

😯 Current Behavior

If a checkbox or radio is already focused, pressing on the element a second time will call onBlur (since it is technically the label getting pressed, not the actual input).

💁 Possible Solution

Other input elements (eg. TextField) leave the rendering of the Label and Input elements up to the consumer.

🔦 Context

This is technically expected based on default HTML behaviour and the structure of the components, but unexpected for a user (since it looks like they are pressing on the input).

As a side effect, my validation for these components is running unexpectedly when hooked into a form.

🖥️ Steps to Reproduce

https://codesandbox.io/p/sandbox/exciting-nightingale-wjx2jz

Version

[email protected]

What browsers are you seeing the problem on?

Microsoft Edge, Safari, Chrome, Firefox

If other, please specify.

No response

What operating system are you using?

MacOS

🧢 Your Company/Team

No response

🕷 Tracking Issue

No response