You're clicking on a checkbox label and another is selected!

You're workin' the checkboxes doing a fancy layout with your label element like this:

<label for="input-id">text</label>
<input type="checkbox" id="input-id" />

Now when you're clicking the label the input is selected.

Really nice! And very accessible.

BUT! Remember. If you add more checkboxes. Maybe with complicated names and ids. Make sure you don't have the same id on multiple checkboxes.

In that case the first checkbox with that ID will be selected.

That can be very confusing and lead you to question how React.useState works and other stuff.

Now you know!