- Issue created by @roderik
- 🇦🇹Austria fago Vienna
I had the opportunity to dive into this a bit at DrupalDevDays. XB already does a great job rendering into components, so we should be able to re-use that and build upon it perfectly fine. There is the "hydated-component-tree" which we could use, see ComponentTreeHydrated. Or, we simply use the generated render-array consisting of nested components and blocks, and process into the tree of custom elements. (Similar to what we do with layout builder). Code-components are rendered as astro-islands, so could be output as astro-island component also.
I clarified with balint brews that we do not need to handle auto-saving storage or something, preview is going to work differently anyway. Then we should be able to do all this as simple CE-field formatter.
Created 📌 First-class experience builder support Active for the overall plan.
- 🇦🇹Austria fago Vienna
It seems 📌 Support for Experience Builder Active is the next step and the way to go. This will integrate with 📌 Improve mapping render-arrays to custom elements Active but does not depend on it - on the contrary, figuring out the conversion strategy for XB-component render trees might help getting the solution for 📌 Improve mapping render-arrays to custom elements Active right. So let's do the conversion for XB-render trees first.
- 🇦🇹Austria fago Vienna
For reference, this is a ultimatively simple render-array as produced by XB:
{ "a548b48d-58a8-4077-aa04-da9405a6f418": { "12345678-1234-1234-1234-123456789abc": { "#type": "component_container", "#component": { "#type": "component", "#component": "xb_test_sdc:props-no-slots", "#props": { "heading": "Hello from XB Component!", "xb_uuid": "12345678-1234-1234-1234-123456789abc", "xb_slot_ids": [], "xb_is_preview": false }, "#attached": { "library": [ "core\/components.xb_test_sdc--props-no-slots" ] }, "#cache": { "contexts": [], "tags": [ "config:experience_builder.component.sdc.xb_test_sdc.props-no-slots" ], "max-age": -1 } }, "#component_context": "Content Test Node (1), field field_component_tree", "#component_uuid": "12345678-1234-1234-1234-123456789abc", "#is_preview": false } }
Let's convert render arrays like this to custom elements as a first step.
- 🇦🇹Austria fago Vienna
I've added a MR with test-coverage which successfully renders the XB output into a tree of custom elements.
It's for sure not perfect, but it should lay the foundation on how we do it, so we can improve the output as later step.Next, we need to integrate this into the entity rendering pipeline either via auto-processing, a dedicated formatter, or global detection in the entity ce-display.
- 🇦🇹Austria fago Vienna
finally got it green on CI also. Getting CI work was a bit tricky since experience_builder only works with Drupal >11.2 now.
Disclosure: I've used AI (Claude Code) to help coding this, in particular the test case. I worked over all non-test code and reviewed all code changes of course.
- 🇸🇮Slovenia useernamee Ljubljana
Kernel test is very detailed and I think it thoroughly covers the XB to CE conversion.
- 🇦🇹Austria fago Vienna
Merged into 3.x-dev! Next step: 📌 Integrate experience builder with entity-custom-elements-generation Active