Function: BlocksRenderer()

BlocksRenderer(props): Element

Defined in: packages/core/src/react/components/BlocksRenderer.tsx:37

The BlocksRenderer components provides an easy way to convert HTML markup into corresponding React components.

The BlocksRenderer component takes in arbitrary html markup and receives a list of react components as children that allows replacing dom nodes with React Components.

The html prop is sanitized through wpKsesPost so it's safe for rendering arbitrary html markup.

The children components must implement the BlockProps interface

Usage

Usage with the test function

<BlocksRenderer html={html}>
 <MyLinkBlock test={(node) => isAnchorTag(node, { isInternalLink: true })} />
</BlocksRenderer>

Usage with classList and tagName props

<BlocksRenderer html={html}>
  <MyLinkBlock tagName="a" classList="my-special-anchor" />
</BlocksRenderer>

Parameters

props

BlockRendererProps

Component properties

Returns

Element