in main post feedback for components we talked about so many different ideas I think it is about time we have seperate topic about Nestable Components because it is very important that it deserves having its own topic.
. Why We Need Nestable Components ?
Long story short:
1 - We need nestable components for complete Component based workflows.
2 - Nestable components will make bricks builder more scalable and agency/enterprise ready.
. Explanation and Examples
Right now we have dynamic components but those components can only be used as they are we cant nest other components under each other or under layout components.
Idea is to have (atleast for the layout elements) nesting the components under other components. This way we can create our layout components, section components, loop ready, condition readyā¦etc components and then emergently/procedurally use all of them with nesting.
This gives us chance to hide the native elements and force interns, teams, departments and client teams to use components only and protect the CI. This way we can create Complete Component based workflow and protect the websites design rules and corporate identity rules easily.
I completely agree, but to avoid confusion, I think this should be named āSlotableā instead of āNestableā. Currently, itās possible to place components inside components, which is being called āNested Componentsā by the changelog / docs of 2.0.
My view on this feature: add a Slot element inside a component, and display all nested / slotted elements at the location of the slot. This might also open up possibilities for multiple slots per component, but Iām not sure how this could be implemented UI/UX-wise. Maybe add a ānameā or āIDā field to the properties of the slot element, and then display these slots as fixed elements underneath the component element? Example:
This also allows for Query Loop components / re-usable Query Loop in the form of components.
Btw, my proposed solution is heavily inspired on the way Vue handles slots: Slots | Vue.js, it just needs a visual implementation to fit inside the builder.
Especially with clients, this is a key feature. Just look at this Webflow exampleāsee how they allow nesting. Currently, the ānestable componentsā are not truly nestable. I donāt understand the integration. Just let us nest them like Cwicly or Webflow.
Iām not sure if I understand this - can you elaborate a bit more on this, how would that help with the reusable query loop? You can already connect query loop to the component.
Iām referring to something thatās similar to - or at least a workaround for - the idea over here: Idea board ā Bricks
Currently, the components indeed do support connecting a query loop. However, what Iām looking for is a way to save a Query Loop itself, instead of having a Component to which a Query Loop has to be connected.
For example, when building a WooCommerce site, Iāve got multiple places where I want to add a rather advanced Query Loop which loads a specific set of products. Currently, Iād have to either manually copy the Query Loopās settings, or programmatically add a custom Query Loop which has the same settings.
With Component slots, Iād be able to create a simple Div component, put my Query Loop on it, and add a Slot inside the div. I can then use that component anywhere Iād want to like a regular div, but the Query Loop would automatically be set. This would also save a lot of time and effort when having to change the Query Loop, as youād only have to change the Component.
Of course, a dedicated Global Query Loop manager (which is what they meant in the Idea I linked to above) or something like that would be the ultimate feature to handle this, but this can also be one of the possibilities with Component Slots
@Panag thatās what I meant in my first reply above: for regular elements, āNestedā means that sub elements can be added to the main element, whereas āNested Componentsā in 2.0 means that Components can be added inside other Components (but only when editing them). I get that in terms of linguistics itās both correct, but I also understand that itās quite confusing at the moment.
% agree
