New component: Scaffolding

To work with skeletons more easily.

Example:

<pe:scaffolding ready="#{not empty scaffoldingController.data}" id="scaffolding"
                loader="#{scaffoldingController.fetchData(2000)}">
    <f:facet name="loading">
        <p:skeleton width="3rem" height="3rem" shape="circle"/>
    </f:facet>
    <f:facet name="ready">
        <p:avatar label="#{scaffoldingController.data}" size="large" shape="circle" />
    </f:facet>
</pe:scaffolding>

See also https://discord.com/channels/787967399105134612/787969344768311296/859078890022371348

[jepsar]

I wonder if we should also add some option to actually trigger and AJAX request after page load similar to how p:outputPanel has the deferred=true and deferredMode https://primefaces.github.io/primefaces/10_0_0/#/components/outputpanel?id=outputpanel

So that way it will automatically trigger what replaces the skeleton?

Yes! That will be the next step. That will make using skeletons a lot more useful in the JSF world.

[melloware]

I actually like a combination of your two options. I like scaffolding but I like your facet names originally better.

<pe:scaffolding value="#{bean.dataObject}">
  <f:facet name="loading">Skeletons if dataObject is empty</f:facet>
  <f:facet name="ready">Actual UI if dataObject is loaded</f:facet>
</pe:scaffolding>