XBL Use Binding as Child in Other Within Same XML

Question

I have this xml binding:

<?xml version="1.0"?>
<!-- This Source Code Form is subject to the terms of the Mozilla Public
   - License, v. 2.0. If a copy of the MPL was not distributed with this
   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
<bindings xmlns="http://www.mozilla.org/xbl" xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" xmlns:xbl="http://www.mozilla.org/xbl">
    <binding id="tbb" role="xul:toolbarbutton" extends="chrome://global/content/bindings/button.xml#button-base">
        <resources>
<?xml version="1.0"?>
<!-- This Source Code Form is subject to the terms of the Mozilla Public
   - License, v. 2.0. If a copy of the MPL was not distributed with this
   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
<bindings xmlns="http://www.mozilla.org/xbl" xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" xmlns:xbl="http://www.mozilla.org/xbl">
    <binding id="tbb" role="xul:toolbarbutton" extends="chrome://global/content/bindings/button.xml#button-base">
        <resources>
            <stylesheet src="chrome://global/skin/toolbarbutton.css" />
        </resources>
        <content>
            <children includes="observes|template|menupopup|panel|tooltip" />
            <xul:image class="toolbarbutton-icon" xbl:inherits="validate,src=image,label" flex="0" />
            <xul:image class="profilist-badge" xbl:inherits="validate,src=badge,label" width="1" flex="0" />
            <xul:label class="toolbarbutton-text" crop="right" flex="1" xbl:inherits="value=label,accesskey,crop,wrap" />
            <xul:label class="toolbarbutton-multiline-text" flex="1" xbl:inherits="xbl:text=label,accesskey,wrap" />
        </content>
    </binding>
    <binding id="tbb-box">
        <content>
            <children/>
            <xul:box class="profilist-submenu">
                <xul:image class="profilist-closed" />
                <xul:image class="profilist-build" />
                <xul:image class="profilist-safe" />
                <xul:image class="profilist-default" />
                <xul:image class="profilist-rename" />
                <xul:image class="profilist-del" />
            </xul:box>
        </content>
    </binding>
</bindings>

What I want to do is put a toolbarbutton that uses the binding i defined above id'ed profilist-tbb. I would like to do this within XBL file. Rather than have css tell to apply the binding you know?

I tried this and the toolbarbutton isn't even getting creatd :(

<binding id="tbb-box">
    <resources>
        <stylesheet src="chrome://global/skin/toolbarbutton.css" />
    </resources>
    <content>
        <toolbarbutton class="rawr"></toolbarbutton>
        <xul:box class="profilist-submenu">
            <xul:image class="profilist-closed" />
            <xul:image class="profilist-build" />
            <xul:image class="profilist-safe" />
            <xul:image class="profilist-default" />
            <xul:image class="profilist-rename" />
            <xul:image class="profilist-del" />
        </xul:box>
    </content>
</binding>

Thx

Answer 1

I don't think this is the best solution but this is how I got it to work. I gave toolbarbutton a class in the xbl of the id profilist-tbb-box and then from css i applied binding to the toolbarbutton i created in it.

xbl.xml:

<?xml version="1.0"?>
<!-- This Source Code Form is subject to the terms of the Mozilla Public
   - License, v. 2.0. If a copy of the MPL was not distributed with this
   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
<bindings xmlns="http://www.mozilla.org/xbl" xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" xmlns:xbl="http://www.mozilla.org/xbl">
    <binding id="tbb" role="xul:toolbarbutton" extends="chrome://global/content/bindings/button.xml#button-base">
        <resources>
            <stylesheet src="chrome://global/skin/toolbarbutton.css" />
        </resources>
        <content>
            <children includes="observes|template|menupopup|panel|tooltip" />
            <xul:image class="toolbarbutton-icon" xbl:inherits="validate,src=image,label" flex="0" />
            <xul:image class="profilist-badge" xbl:inherits="validate,src=badge,label" width="1" flex="0" />
            <xul:label class="toolbarbutton-text" crop="right" flex="1" xbl:inherits="value=label,accesskey,crop,wrap" />
            <xul:label class="toolbarbutton-multiline-text" flex="1" xbl:inherits="xbl:text=label,accesskey,wrap" />
        </content>
    </binding>
    <binding id="tbb-box">
        <content>
            <toolbarbutton class="profilist-tbb" xbl:inherits="label,disabled"/>
            <xul:box class="profilist-submenu" xbl:inherits="disabled">
                <xul:image class="profilist-closed" xbl:inherits="disabled"/>
                <xul:image class="profilist-build"  xbl:inherits="disabled"/>
                <xul:image class="profilist-safe"  xbl:inherits="disabled"/>
                <xul:image class="profilist-default"  xbl:inherits="disabled"/>
                <xul:image class="profilist-rename"  xbl:inherits="disabled"/>
                <xul:image class="profilist-del"  xbl:inherits="disabled"/>
            </xul:box>
        </content>
    </binding>
</bindings>

from css:

.profilist-tbb-box {
  -moz-binding: url('chrome://profilist/content/xbl.xml#tbb-box');
}
.profilist-tbb {
  -moz-binding: url('chrome://profilist/content/xbl.xml#tbb');
}