learningequality
Make it easier (or unecessary) to style the KCheckbox label slot in alternate states (e.g. "disabled")
Product
Anywhere
Desired behavior
The KCheckbox can force an opinionated style like color: $themeTokens.disabled to the default slot. Or else just provide some kind of class like kcheckbox-disabled to the default slot when disabled so that some styles can be applied from the parent component.
Current behavior
See this PR, where I had to switch from using the label prop to use providing content to the default slot.
When you switch filling the label tag with the default slot, the label contents are not styled when the disabled prop is true.
To restore that behavior, I needed to mimic the inline style that is given here, but not applied to content in the slot.
(Optional) The Value Add
In the simple case where a user for some reason just uses a span in the default slot instead of the label prop, the component will work the same.
(Optional) Possible Tradeoffs
Add labels
Please choose the appropriate label(s) from our existing label list to ensure that your issue is properly categorized. This will help us to better understand and address your issue!
@MisRob to investigate; will basically either close the issue as wontfix or to update it with clearer guidance
I looked into this and since the default slot is meant to be an alternative to label prop for when more customization is needed, which is exactly the case this issue describes, I think we can close. This is a common pattern in KDS. I think we may consider some simplifications if we needed to override styling in this way frequently, but to the best of my knowledge, as of now it's rather an exception.
