HubSpot/draft-convert

Custom components require props.children to render even when a block only contains data

Opened this issue · 1 comments

Right now, if you pass a custom React component to blockToHTML, it requires you to include props.children in the render function otherwise it fails with the following error:

Error: convertToHTML: Element of type function KeepReading() {
  return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
    __source: {
      fileName: _jsxFileName,
      lineNumber: 5
    },
    __self: this
  });
} must render children

However, many custom blocks types (for instance, in our codebase, images, embeds, and a few other specialized block types), there is no actual text that needs to be rendered - it is all based upon block-level data where information like the image source are saved. In these cases we have to render the children and add styles to hide them to prevent excess spacing from ending up in the app. It would be nice if rendering props.children was not required for blocks where only the block-level data is needed for the block to render correctly.

this is also causing me an issue for React components that don't allow children through prop.types, like material-ui

Any thoughts on how to work around this issue?