I solved the problem for my own component by removing all the code regarding the resolution of classnames in the origin RadioGroup.tsx file.
The strange thing is: the origin implementation of RadioGroup does so much about resolving classnames, and applying class names to each element in the component. But at the end it is not possible to adjust some basic styles by injecting additional class names. See this discussion. I wonder for what all the findStyleAsClassName calls are good for.
To me, it looks as if a lot of effort has been made to achieve a high degree of flexibility only internally, but without giving this flexibility to the outside.
But don’t get me wrong, the project is still brilliant.
The findStyleAsClassName calls resolve the class names out of the styling context which can be set up externally, see this guide on how to use it.
Sadly at the moment it can only be conveniently used to override styles in a form-wide manner. What’s missing is a way to locally merge in specific styles via the UI Schema. In the much newer vue-vanilla renderer set we consequently implemented this approach and made sure that there are no hard coded styles.
What we need is an overhaul of the React Vanilla renderer set to:
Remove all hard coded styles
Allow to configure classes for every single rendered element
Allow to merge in “local” classes via the UI Schema
For this we either need a professional support client to sponsor this topic or a high quality community contribution.
Regarding the findStyleAsClassName: Sadly this method is not exposed to the outside. However the getStyleAsClassName is exposed and can be used instead.