<!-- Sample for now !! -->
<wolf:control id="button">
    <attr bindable="false" default="">id</attr>
    <attr>icon</attr>
    <attr>text</attr>
    <event>click</event>
    <attr default="icon">class</attr>
    <ui>
        <button id="$id" class="$class"><i class="material-icons">$icon</i>$text</button>
    </ui>
</wolf:control>

<wolf:define id="test">
    <ui>
        <button id="$id" class="$class"><i class="material-icons">$icon</i>$text</button>
    </ui>
    <script>
        var ui = {};

        this.define = function (definition) {
            definition.addAttribute("id", false, null);
        }

        this.init = function () {

        }
    </script>
</wolf:define>

<!-- usage -->
<wolf:button click="goAdd" icon="add" />
<wolf:button click="goAdd" icon="add" />