Closed michaltaberski closed 4 months ago
you can use the parent's data attribute to style the child via css only. as I usually use tailwind I would use the group modifier
You can't "read" the internal state of the components, but you can create your own controlled components and use that state as the source of truth. In the case of radio group items, you'd also need to pass down the current value from root to the items via React context.
For example, see the Segmented Control component in Radix Themes which is built on top of the Toggle Group primitive. Instead of "reading" the primitive state, it bases its state on the value props and passes them down to the primitive.
Hi,
I wonder what's the desired pattern to read the internal state of the primitives. It's possible to style components conditionally because of the state is exposed to DOM through data-attributes.
That's cool, but what is the pattern for following scenario:
Preconditions
1) Build radio cards 2) Option can have different look for "checked" and "unchecked" state. eg:
I would look for something to be able to do:
So far I couldn't find a better approach than a hack component:
However this is obvious hack - surly I am not getting something from the library philosophy.