Problem/Motivation
As a technical builder, I want to have an easy way to expose components written in SDC to the experience builder. This is to provide a great onboarding experience for Drupal developers. Note: not all SDCs should be exposed automatically to the experience builder.
Proposed resolution
- Reuse: SDC components only (initially)
- Reuse: This already gives us a way to render them through the render system:
- New: Config entity type to create component categories
type: page_builder_component_category name: entity_reference label: … color: … weight: … - New: Config entity type to flag/opt in SDC components.
type: page_builder_component kind: sdc component: umami/card opted_in: true/false # NEAR FUTURE: "categories" -> for good component placement UX category: entity references/media/card/… <whatever the user creates> # DISTANT FUTURE: "tags" -> for advanced permission checking (e.g. user can only use/place components with certain tags) tag: - New: UI that surfaces all available SDC components and allows opting them in (== creating config entities). Built using the existing config entity listing UI/API infra.
Remaining tasks
User interface changes
API changes
Data model changes
Issue fork experience_builder-3444417
Show commands
Start within a Git clone of the project using the version control instructions.
Or, if you do not have SSH keys set up on git.drupalcode.org:
Comments
Comment #2
tim.plunkettComment #3
pdureau commentedHi,
Are you planning to attach SDC components directly to the display config entity, without transforming them to configurable plugins (blocks, layouts, field formatters...) first?
Comment #4
lauriii#3446083: Document supported component modeling approaches describes several ways users would construct components in the Experience Builder context. #3446722: Introduce an example set of representative SDC components; transition from "component list" to "component tree" starts implementing example components using these patterns to identify any gaps in the SDC system to express these patterns.
Comment #5
finnsky commentedWe had discussion about option to extend components
https://drupal.slack.com/archives/C4EDNHFGS/p1715090009402889
Comment #6
larowlanOne thing from LB Plus/Decoupled LB that would be good to have here would be 'default layout' for a component.
So you don't need to add a layout first if you want to add a component to it. Dragging the component from a list into the page container would auto-add that layout. Dragging it into an existing layout would not.
Comment #7
lauriiiOne of the problems we need to solve is nesting of components; there are many common and valid scenarios where you need more then 2 levels of nesting. As we do this, we need to break the current assumption where blocks are always wrapped by sections, and sections always contain blocks. We can do this by introducing a single type of components. These components could be generated either by SDC, Layout plugins, or Blocks. SDC and Layout plugins have the concept of nesting where as Blocks would not have that. In this model, any component could be placed in the layout, meaning that you could place a block or SDC to the layout without adding a section first.
Comment #8
wim leersClarifying title and providing context: #3444424-4: [META] Configuration management: define needed config entity types.
Comment #9
f.mazeikis commentedComment #11
wim leersRefining (narrowing!) scope. Part of what was listed as scope here was either super vague or enormous. The "new route" part is A) listed after this in #3450586: [META] Back-end Kanban issue tracker, and B) is already being worked on by @bnjmnm over at https://git.drupalcode.org/project/experience_builder/-/commit/908ce4bda... — with currently just returning all SDCs. (This issue/MR will allow us to update that code to return only opted-in SDCs.)
Comment #12
wim leers#3452314: [MR Only] provide UI foundation with Drag and Drop + panels landed, so now this issue should update
Drupal\experience_builder\Controller\SdcControllerto respect the config entities this MR is introducing 👍Comment #13
wim leersCreated follow-up issue, in which I explicitly listed the scope that was removed in #11, and also provide much more detail: #3452397: Allow specifying default props values when opting an SDC in for XB.
I went ahead and already assigned it to you, @Felix, because your head is currently in this space and you've built the related PoC 🤓
Comment #14
f.mazeikis commentedPushed component entity definition + schema + ensuring dependency of SDC provider is added to Entity on creation.
Added very simple unit test to ensure config entity creation works.
Added forms, routes and menu items/actions for creating/editing/deleting entity - it's all based on existing core logic, nothing fancy, just so FE people could easily interact with new entities.
When creating component SDC selection is presented in a select dropdown, grouping SDC's by their provider.
Placed list builder in src/Form and added src/Form to `phpstan.neon` set of ignored excludePaths as it was failing on some of the upstream code.
Comment #15
wim leersThanks for getting this going — first review posted :)
Comment #16
wim leersExplicitly associating the issue I linked in #13.
Comment #17
wim leersComment #19
wim leersDone! This is a thoroughly tested starting point now.
Next up: #3453680: Add ::calculateDependencies() to ComponentTreeItem, which is a small next task to unblock the much bigger #3452397: Allow specifying default props values when opting an SDC in for XB.
I'll capture the comments by @lauriii, @pdureau and @finnsky in concrete issues when those areas are worked on.