Rendering `markdown` into `label`

Hi, it would be great a configurable way to support markdown in label or something like that.
Which is the best way to do it?

[original thread by Roberto Polli]

Hey! Do you mean the Label ui schema element? To support markdown there you can register a custom renderer which is capable of rendering markdown.

If you mean the label properties in controls I’m not so sure whether rendering markdown there is a benefit as the labels should be short and concise. To do it you also need to go the custom renderer route and register an own custom renderer for each control. The most straightforward way would be to just copy the approach of the framework where we have a common input component which is configured for each control differently.

[Roberto Polli]

@sdirix I mean the “label” property: I have then to “fork” jsonforms duplicating code, right? Can’t I ‘extend’ the classes?

Another solution could be to define a new ui-element (eg. type: Text, or type: Markdown) where to put stuff inside. Is that a viable solution?

I’m not sure we’re talking about the same thing. With label property I meant the control labels, e.g. First Name in the example form on If you want to render markdown instead you don’t need to fork jsonforms but you will need to provide a custom renderer for each and every control as each of them is responsible for their own label. Of course you can import and reuse a lot of code of the material-renderers so I don’t think you need to copy/fork everything.

If you just want to render a Markdown block somewhere in the form I would go with a custom ui element (I like the suggested type: Markdown) and register a custom renderer for it.

[Roberto Polli]

@sdirix I just implemented that :stuck_out_tongue: jsonforms-react-seed/Markdown.tsx at master · ioggstream/jsonforms-react-seed · GitHub I think that such a feature could be intesting for jsonforms. I implemented it as a Control but probably another Class would be a better choice.

That’s pretty cool! In general this is certainly interesting for JSON Forms however we need a proper concept of optional dependencies as I would like to avoid forcing every user of JSON Forms to also install react-markdown if they are not using it. We recently did something like this (exposing extendedMaterialRenderers) for Autocomplete to avoid forcing the @material-ui/lab dependency, so maybe we can come up with a more general way of render configuration for the user.

[Roberto Polli]

Let me know how to pack the MarkdownRender.

[Roberto Polli]


I’ll let you know once we have a concept ready :slight_smile: Feel free to suggest one if you have something in mind :wink: