10up Releases New Plugin That Shows How to Extend Gutenberg’s Document Panel Using SlotFill and Filters

If you’ve been looking for a way to add slots and controls to the Document panel in WordPress’ content editor, check out a new plugin released by 10up called Gutenberg SlotFill and Filter Demos.
SlotFill and Filters is a new take on the classic filters, actions, and hooks system in WordPress. Slot and Fill are React components that enable developers to inject items into predefined spaces in the new editor.
“SlotFill is a pattern for component extensibility, where a single Slot may be occupied by an indeterminate number of Fills elsewhere in the application,” Ryan Welcher said.

An Example of SlotFill in Action

In the demo screenshot above, 10up was able to stick to the Classic UI conventions in the mobile app while displaying the same information in the Document panel of the new editor.
SlotFill initially started as a GitHub repo where Welcher collected his findings. The repo eventually turned into a library of examples and explanations for SlotFill and JavaScript based filters.
In January, Welcher submitted a pull request to the Gutenberg repo asking for SlotFill to be added to the document sidebar.  » Read More