Verbatim Tag Displayed In Wrong Place

[James Ellis <el...@hotmail.com>]

I have the following tree2 tag working:

<t:tree2 id="clientTree" value="#{treeBacker.treeData}" var="node" 
varNodeToggler="t" showRootNode="false" >

    <f:facet name="folder">
    <h:panelGroup>
    <f:facet name="expand">
<t:graphicImage value="images/yellow-folder-open.png" 
rendered="#{t.nodeExpanded}" border="0"/>
    </f:facet>
    <f:facet name="collapse">
<t:graphicImage value="images/yellow-folder-closed.png" 
rendered="#{!t.nodeExpanded}" border="0"/>
    </f:facet>

    <h:outputText value="#{node.description}" styleClass="description"/>
    <h:outputText value=" (#{node.childCount})" styleClass="description" 
rendered="#{!empty node.children}"/>
</h:panelGroup>
    </f:facet>

    <f:facet name="entry">
<h:panelGroup>
<%/*
Both identifier and description are set in TreeBacker.java.
Identifier is the url and description is the value displayed to user.
*/%>

<t:graphicImage value="images/document.png" border="0"/>
<h:outputLink value="#{node.identifier}" styleClass="description">
   <h:outputText value="#{node.description}"/>
</h:outputLink>

</h:panelGroup>
        </f:facet>

   </t:tree2>



The problem is that I want the text "1." to go right before the 
yellow-folder-open.png or yellow-folder-closed.png and the verbatim tag is 
not being displayed where I'd expect it when I include it in the code like 
this:

<t:tree2 id="clientTree" value="#{treeBacker.treeData}" var="node" 
varNodeToggler="t" showRootNode="false" >



    <f:facet name="folder">
    <h:panelGroup>
    <%/*IGNORED CODE BELOW */%>
    <f:verbatim>
<b>1.</b>
    </f:verbatim>

    <f:facet name="expand">
<t:graphicImage value="images/yellow-folder-open.png" 
rendered="#{t.nodeExpanded}" border="0"/>
    </f:facet>
    <f:facet name="collapse">
<t:graphicImage value="images/yellow-folder-closed.png" 
rendered="#{!t.nodeExpanded}" border="0"/>
    </f:facet>

    <h:outputText value="#{node.description}" styleClass="description"/>
    <h:outputText value=" (#{node.childCount})" styleClass="description" 
rendered="#{!empty node.children}"/>
</h:panelGroup>
    </f:facet>

    <f:facet name="entry">
<h:panelGroup>
<%/*
Both identifier and description are set in TreeBacker.java.
Identifier is the url and description is the value displayed to user.
*/%>

<t:graphicImage value="images/document.png" border="0"/>
<h:outputLink value="#{node.identifier}" styleClass="description">
   <h:outputText value="#{node.description}"/>
</h:outputLink>

</h:panelGroup>
        </f:facet>

   </t:tree2>



In this case it prints after the yellow-folder-open.png (or 
yellow-folder-closed.png) and before the first h:outputText. I want it to 
print <b>before<b> the yellow-folder-open.png. How do I get this html 
displayed in the correct place?