Improved context handling

[jramke]

• first we cant and shouldnt no longer use __context_COMPONENT variables

• maybe we can handle this with the viewhelperVariableContainer

• need to cover more complex scenarios like:
  we have a carousel maybe as primitive and more lowlevel and a marquee as consumer component. Lets say the marquee.root renders the carousel.root and content and stuff as controlled with a custom rootId. The marquee.item renders a carousel.item. The carousel.item (rendered by the marquee.item) currently has no access to the carousel.root context that was rendered by the marquee.root

[joost-slim]

The issue with the scenario described below is that carousel.item does not know about the context coming from carousel.root. Thats because we append the context inside the renderComponent method to the parentRenderingContext. The problem is that the parent rendering context from the testimonial.root and the testimonial.item are the same (eg. a controller action template). The carousels parent rendering contexts are the rendering contexts of the dedicated testimonial components we create in the renderComponent method. So the created context of the carousel is just added to the testimonial.root rendering context but the testimonial.item / carousel.item then dont not know about the renderingContext of the testimonial.root.

I think this needs changes in fluids core so this could be possible. Will have to take a look.

Current workaround: define the testimonial component as closed component with an items prop.

Scenario:
A composable testimonial component that uses a primitive/low-level carousel component. The carousel component is also used for other slider-like components like a logo marquee.

<ui:testimonials.root>
    <ui:testimonials.item>
        Hello world
    </ui:testimonials.item>
</ui:testimonials.root>

testimonial.root renders a controlled carousel.root

<div {ui:ref(name: 'root' )}>
    <ui:carousel.root controlled="{true}" rootId="testimonials-{context.rootId}">
        <f:slot />
    </ui:carousel.root>
</div>

testimonial.item renders a carousel.item

<ui:carousel.item>
    <f:slot />
</ui:carousel.item>