Limiting the block count for InnerBlocks

One of the most versatile components that Gutenberg block developers have is the <InnerBlocks/> component. This component allows other blocks to be inserted into it. WordPress Core ships with the Group and Columns blocks that both use InnerBlocks internally to allow the creation of very complex block structures.

The InnerBlocks component solves some interesting problems for custom blocks, for example creating a list of ordered items. By leveraging InnerBlocks, one can skip having to build a bespoke system and rely on Gutenberg to handle the insertion, deletion, and ordering of items. It is very flexible and easy to use. However, while working with it I discovered that there is no built-in way to limit the number of blocks that can be inserted.

The renderAppender prop will allow us to solve this issue

Continue reading “Limiting the block count for InnerBlocks”