How do i use the Rich text/html prop?

I have this component:

export function Text({ label }) {
  return <p>{label}</p>;
}

Builder.registerComponent(Text, {
  name: 'Text',
  inputs: [
    {
      name: 'text',
      type: 'html',
    },
  ],
});

The html is displayed as it is, with the tags.
how do i render the html/richtext as text?

If you’re using React you need to set the html, e.g.:

export function Text({ label }) {
  return <p dangerouslySetInnerHTML={{ __html: label }} />;
}

See here: https://react.dev/reference/react-dom/components/common#dangerously-setting-the-inner-html

1 Like