What would be the easiest way to override default renderers for a given type?

General
1

For example, I want all string types to use one of our existing components rather than the default renderers.

Basically I’d like to map all the common types to existing React components in our app. Can this be done in a straightforward way?

2

Hi @CarlosNZ,

You need to register a custom renderer with higher priority than the existing ones. This custom renderer can then use your custom components. Depending on what you consider “string types” and how they should be handled this is more or less effort. For example you could only overwrite the simple MaterialTextControl for type: string inputs, but also the time, date-time and date renderers.

In any case this is usually not that much effort.

3

Thanks Stefan, appreciate the response.

I’m finding the docs a bit unclear when it comes to doing things beyond what is in the tutorials. For example, in this case, I’m assuming I’d want to create a tester function for my custom component that will match for the data type being “string”. The tutorial example uses the scopeEndsWith method, but what method would I use to match data type? Is there a list somewhere of all the available methods and what exactly they do? The API docs don’t seem to have them all clearly listed in way I can make sense of – maybe I’m just missing something lol.

In particular, I’m interested in:

  • the available methods for Testers
  • the available methods/options for Conditions
1 Like
4

Actually, I’ve found the schemaTypeIs('string') method which does what we want for overriding default renderers. :+1:

5

Hi @CarlosNZ,

testers are simply functions adhering to this interface.

type RankedTester = (uischema, schema, rootSchema) => number

All the utils like schemaMatches, schemaTypeIs etc. are just helpers. Whenever something is missing you can always just implement this function.

1 Like