How to change the variant of fields throughout the UI Schema


I’ve wrapped my JsonForm with theme and style customization. Could I change the variant of fields throughout the UI schema? I want to have different variant options inside the theme and, throughout the UI schema, just specify which variant option I want for each field. Can I actually do that?

Hi @namchilo,

In our React Material renderers we just consume the variant information from the Material UI theme. So this is not possible out of the box.

However you can solve this via custom renderers which can be implemented to respect a variant option in the UI Schema. These custom renderer should be very simple to implement: You basically just need to call the off-the-shelf renderer and just wrap it in another theme with the configured variant.

In fact the use case is so generic that you can get away with a very generic custom renderer which takes over the rendering of all fields. It checks the options in the ui schema, removes itself from the renderers list and then just dispatches again to JSON Forms with the element wrapper in your theme.