This repository aims to explore block interactivity patterns with the goal of absorbing as much complexity as possible from the final developers.

It's not a goal to do an in-depth analysis of the patterns, only to experiment with them in a controlled environment to assess their potential and then test them in the Gutenberg repository, where we will see if they are a good fit or not.

• 🎨 WordPress Directives Plugin

  • Main branch: main-wp-directives-plugin
  • Tracking Issue: Tracking issue: WordPress Directives Plugin 🎨

  An installable plugin that adds a set of basic directives and client-side navigation.

• 🧩 Custom Elements Hydration

  • Main branch: main-custom-elements-hydration
  • Tracking Issue: Tracking issue: Custom Elements Hydration 🧩

  This hydration method is based on custom elements (<wp-block>) that hydrates isolated islands. It interconnects those islands through synchronized bridges for APIs like context, Suspense or ErrorBoundary.

• ⚛️ Directives Hydration

  • Main branch: main-directives-hydration
  • Tracking Issue: Tracking issue: Directives Hydration ⚛

  This hydration method is based on the creation of a static virtual DOM from the root, where only the interactive islands are replaced by P/React components. It behaves like a single P/React application.

If you want to use these experiments on your blocks, they will need:

• To have a block.json file.
• To be registered on the server.
• A single node wrapper.

Feel free to clone this repository and inspect the code, open issues, submit PRs, suggest features or ask questions!

And if you are doing any other frontend-related work, please leave a comment in this Make Core post.