Put Radix states on more/different items of the component
Put Radix states on more/different items of the component
At a glance
The community members discuss the issue of the "checked" state in radio buttons and other UI components. The original poster suggests that the state should be applied to individual radio items rather than the parent group, to allow for more granular styling. Other community members agree, noting similar issues with the Accordion component. They propose that for Radio, the state should be moved to the Label, and for Accordion, the state should be added to the Item, to enable more flexible styling based on the component's state.
Take for example the radio buttons. The "checked" state exists only on the parent of a group of radios. This doesn't do me any good (maybe there's a use case). Rather I'd like to have the state styling option on an individual radio item. That way when a radio is checked, I can do something to the radio item.
Correct. I've also run into this use case in other radix components too. I believe accordion is at least one other that would benefit from having the state on additional elements
Switch does it right IMO cuz as you said, it has it on the parent and child . But I an referring to Radio and Accordion which only has it on one or the other. Radio has it only on the Radio Group (can't imagine a good use case for that) and Accordion only has it on the Item Trigger
I propose that for Radio, the state is moved to the Label (unless there is a use case to style the group of radios when one is checked, then have state on both)