Code block in JSONForm

General
1

Hi!
I’m working with React and JSONForm (new to this great project) and I’m trying to create a field for code (sql for example). I’ve created my own renderer and I use CodeMirror inside, but I encounter a lot of different problems, mainly of customizing the code block inside the form itself.

  1. Is there any built-in code field renderer?
  1. If not, do you know some examples I can refer to?

The picture shows where I stand, and I’m trying to fix that for days but keep failing. Be glad for tips. Thanks!

Screenshot 2023-01-04 at 18.57.25
Screenshot 2023-01-04 at 18.57.252274×448 64.8 KB

2

Hi @Omri,

  1. Is there any built-in code field renderer?

We don’t offer a built-in code editor with the off-the-shelf renderer sets.

  • I could not find anything for react, but I did find this “ace” editor https://github.com/jsonform/jsonform/wiki#code-javascript-json-the-ace-type which is exactly what I want but I can’t figure out how or if I can use that with React.

This is not our repository but a similarly named framework with a similar scope/purpose as our framework.

  1. If not, do you know some examples I can refer to?

We integrated the Monaco Editor via a custom renderer into the JSON Forms editor.

image
image934×487 26.4 KB

3

Thank you, this is really helpful!