My first pluggable widget breaks as soon as I add <systemProperty key="Label" />

[GielAmsterdam]

Please use the form below, leaving the prefilled data to help us. Thank you.

Page link: build-a-pluggable-web-widget-part-1

Document link: create-a-pluggable-widget-one.md

My Issue/Suggestion

I am following https://docs.mendix.com/howto/extensibility/create-a-pluggable-widget-one to build my firtst widget, but as soon as I add <systemProperty key="Label" /> to the widget xml the properties “class” and “style” are removed from the generated interface “TextBoxContainerProps” and an error appears in Textbox.tsx and TextInput.tsx:

"Type 'Element' is not assignable to type 'ReactElement<any, string | JSXElementConstructor>'."

I have followed the instructions from "create-a-pluggable-widget-one" and removed the lines style={props.style} and className={props.class} from TextBox.tsx, so the export function in Textbox.tsx looks like:

export function TextBox(props: TextBoxContainerProps): ReactElement { const value = props.textAttribute.value || ""; return <TextInput value={value} tabIndex={props.tabIndex} />; }

However, this doesn't solve the issue. I have also removed the style and className references in TextInput.jsx, with no result. Something goes wrong when I add systemProperty key="Label" /> to the widget properties. Please update the page andor let me know how to solve this and add a label to my widget.

Thanks.