Search code examples
jsf-2composite-componentfacet

Output facet inside of nested composite component

I have a component that is used to add a container around its child elements. This component is used within other components without any issue. But I would like to be able to use a facet like so:

<!-- INTERFACE -->
<cc:interface>
    <cc:attribute name="detailTitle" />
    <cc:facet name="header"/>
</cc:interface>

<!-- IMPLEMENTATION -->
<cc:implementation>
    <li class="mvkcomp listItem listDetailToggle">
        <ezcomp:container>
            <div class="listItemBody">
                <div class="header">
                    <!-- Facet not being rendered -->
                    <cc:renderFacet name="header" />

                    <a href="#">Show/hide #{cc.attrs.detailTitle}</a>
                </div>
                <div class="detail">
                    <cc:insertChildren />
                </div>
            </div>
        </ezcomp:container>
    </li>
</cc:implementation>

This will however not render anything. It works as intended if the <cc:renderFacet> is moved outside of <ezcomp:container>. Is there an alternative I'm not seeing or do I simply have to move the li and ezcomp:container outside of the component to make it work? Is that the preffered alternative anyway?

Oh and the <cc:insertChildren> works as intended. Seems rather strange to me that one would fail but not the other.

Solution

  • The approach I selected to handle this was to implement the wrapper element as a template. I then use ui:decorate to output that template inside of a composite component. The original wrapper now only outputs the template before inserting it's children.