CoreBlock

The CoreBlock can be used to display any of the blocks supported by wp-block-components. When using the CoreBlock, you only need to import one component and it will take care of the rest.

Importing the component

import { CoreBlock } from 'wp-block-components';

Props

This component has one prop called block which accepts an object.

Example of a Heading block:

{
  __typename: '??_CoreHeadingBlock',
  attributes: {
    align: 'left',
    anchor: null,
    className: null,
    content: 'This is a heading',
    level: 2,
  },
}

The ??_ in the __typename property will vary depending on your setup. As long as the __typename ends with CoreHeadingBlock, it will work.

Example usage

{blocks.map((block, index) => {
  return <CoreBlock key={index} block={block} />
})}