Added htmlFor prop for CustomInput

[Dakkers]

• Bug fix
• New feature
• Chore
• Breaking change
• There is an open issue which this change addresses
• I have read the CONTRIBUTING document.
• My commits follow the Git Commit Guidelines
• My code follows the code style of this project.
• My change requires a change to the documentation.
• • I have updated the documentation accordingly.
• I have added tests to cover my changes.
• All new and existing tests passed.

I have a niche scenario where I'm using a custom input but don't want the label to be bound to the checkbox. The way I did this with regular inputs is overriding the htmlFor, but I couldn't do that with the custom ones. So I've added that here, along with some tests.

[Dakkers]

@eddywashere @TheSharpieOne is there anything I'm missing here? 👀

[TheSharpieOne]

I suppose nothing is missing, but the use-case goes against best practices and a11y and will prevent the component from working as it's intended to if the label isn't tied to the input via htmlFor.
Without a label bound to the input, there is no way for the user to check the checkbox. The checkbox itself is hidden, the one you see if fake (part of the label). The standard (non-custom) checkboxes work since the checkbox itself is visible and can be checked.
I wonder if you really need the CustomInput or if you are just need another custom component.

@Dakkers if you confirmed that you have tried this solution with your use-case and that it works as expected, I will merge it since it really shouldn't affect anyone due to it being opt-in via the htmlFor prop. But I believe that setting this prop can only have negative impacts so I want to make sure that you validated it has a positive impact for your use-case.

[Dakkers]

@TheSharpieOne I understand un-binding it will prevent the checkbox from working on its own - my use case is that I have a container surrounding the checkbox which is clickable. Let me confirm this works (I have to use my fork as an npm dependency) and I'll comment back.

[Dakkers]

Additionally, unsetting htmlFor manually worked fine with the regular checkboxes, which I was using before, but now I have to use the custom checkboxes (unfortunately).

[Dakkers]

@TheSharpieOne I can confirm this fixes my issue. I can add some documentation regarding the a11y violation if you'd like too (where would I put that?)

[danconnell]

Is it possible to have a release published with this change, @TheSharpieOne?

Thanks!