manifest / editor / wp-block-editor-labs

Block Editor Labs

Small, focused experiments for the WordPress block editor.

by Sérgio Santos · github.com/s3rgiosan/wp-block-editor-labs · website

★ 1stars

0forks

Install

No release zip yet. The repository archive installs, but the folder name will carry the branch suffix and updates will not flow:

wp plugin install https://github.com/s3rgiosan/wp-block-editor-labs/archive/refs/heads/main.zip

Declares an update source (https://s3rgiosan.dev/), so updates arrive through the plugin's own updater.

Readme

Block Editor Labs

Small, focused experiments for the WordPress block editor.

Description

A single plugin housing multiple experimental blocks. Each experiment lives in src/<slug>/ and registers itself as a regular block. Companion blog posts coming soon.

Experiments

Block	Topic
`richtext-anywhere`	`RichText` outside a block — `InspectorControls` + `Modal`

`richtext-anywhere`

Two RichText fields rendered outside a block's edit context: one inside InspectorControls (block sidebar), one inside a Modal. Both reuse the same RichTextField component (src/richtext-anywhere/RichTextField.jsx). Three adjustments make it work:

Local SlotFillProvider. Format-toolbar buttons are emitted through BlockControls. Inside a selected block, those fills are captured by the parent block's toolbar slot and disappear from view. Wrapping the field in its own SlotFillProvider isolates the slot graph so the fills resolve locally.
inlineToolbar + z-index bump. inlineToolbar renders the toolbar near the caret. In a Modal, a CSS rule lifts the popover above the modal:
```
 body:has(.richtext-anywhere-modal) .block-editor-rich-text__inline-format-toolbar {
     z-index: 1000001;
 }
```
Manual isSelected + click-outside. RichText's default selection logic depends on the block selection store, which is empty here. A small useEffect deselects on outside click, ignoring the inline toolbar and any popovers (link URL input, etc.).

Requirements

WordPress 6.7 or later
PHP 8.0 or later

Development

npm install
composer install
npm run build

For watch mode: npm run start.

The plugin auto-registers every build/*/block.json it finds — drop a new block under src/<slug>/ and rebuild.

License

GPL-3.0-or-later. See LICENSE.

Read the full README on GitHub →