Using Popup Component

From the examples/popup.jsp file in the MyFaces package, you'll find the following code snippet:

examples/popup.jsp

   <t:popup
      styleClass="popup"
      closePopupOnExitingElement="true"
      closePopupOnExitingPopup="true"
      displayAtDistanceX="10"
      displayAtDistanceY="10" >
      <h:outputText value="This is the second textual text situation."/>
      <f:facet name="popup">
         <h:panelGroup>
            <h:panelGrid columns="1" >
               <h:outputText value="Popup Text 2"/>
            </h:panelGrid>
         </h:panelGroup>
      </f:facet>
   </t:popup>

In a ShaleClay configuration file, it would look like the following:

{{{
...
<view>
...
<component...>
...
<element renderId="2" jsfid="t:popup">
<attributes>
<set name="styleClass" value="popup"/>
<set name="closePopupOnExitingElement" value="true"/>
<set name="closePopupOnExitingPopup" value="true"/>
<set name="displayAtDistanceX" value="10"/>
<set name="displayAtDistanceY" value="10"/>
</attributes>
<element renderId="1" jsfid="outputText">
<attributes>
<set name="value" value="This is the second textual text situation." />
</attributes>
</element>
<element renderId="2" jsfid="panelGroup" facetName="popup" >
<element renderId="1" jsfid="panelGrid">
<attributes>
<set name="columns" value="1"/>
</attributes>
<element renderId="1" jsfid="outputText">
<attributes>
<set name="value" value="Popup Text 2" />
</attributes>
</element>
</element>
</element>
</element>
...
</component...>

...
</view>
...