Types don't appear to work

Why do the example UI Schema props throw type errors when trying to pass them into the form?

For example passing the following uiSchema into a JsonForm component:

{
“type”: “Control”,
“scope”: “#/properties/name”
}

Gets the type error:
Object literal may only specify known properties, and ‘“scope”’ does not exist in type ‘UISchemaElement’.ts(2322)

The same happens when I pass a Layout with elements etc…

[original thread by Chad Johnson]

[Benjamin Börngen-Schmidt]

Hey Chad,
you get an error because your schema is wrong. You need to have a Layout first and within a layout yout then have the Controls. See jsonforms-react-seed/uischema.json at master · eclipsesource/jsonforms-react-seed · GitHub

Hey Chad,
you get an error because your schema is wrong. You need to have a Layout first and within a layout yout then have the Controls. See jsonforms-react-seed/uischema.json at master · eclipsesource/jsonforms-react-seed · GitHub

Hi @benjamin-b-s(benjamin-b-s), this is not correct. The ui schema can also be a single control.

@chad-johnson(chad-johnson), we structured our types like this:

interface UISchemaElement {}
interface ControlElement extends UISchemaElement {}
interface Layout extends UISchemaElement {}

So you can just specifically tell TS which of these sub types you are using

const control: ControlElement = { type: "Control", scope: "#/properties/name" }
...
<JsonForms
  uischema={control}

or assert it in place

<JsonForms
uischema={myUiSchema as UISchemaElement}