Checkbox with label fills all available space

[tobiaslilja2]

Please do not disclose security vulnerabilities as issues. See our security policy for responsible disclosures.

Describe the bug

You are able to click the checkbox outside of the actual checkbox + label. I would expect the input to be toggled only when the checkbox or the attached label is clicked.

To reproduce

Steps to reproduce the behavior:

1. Navigate to a page with a Checkbox + Label (eg. System -> Network -> IPv4)
2. Toggle a checkbox by clicking outside of it 

Screenshots

Environment

• Axis device model: A8207-VE Mk2
• Axis device firmware version: 11.3.18
• Stack trace or logs: [e.g. Axis device system logs]
• OS and version: macOS v12.2.1
• Version: Practical React Components: v1.11.0

Additional context

Add any other context about the problem here.