<svg xmlns="http://www.w3.org/2000/svg" version="1.2" 
  xmlns:xlink="http://www.w3.org/1999/xlink">


<defs>
 <g id="#textInput"><rect x="0" y="0" width="1.2em" height="1.2em" fill="white" stroke="black"/><text editable="true" y="1em" x="0.2em"/></g>
</defs>
 <extensionDefs id="htmlWidgets" namespace="http://svg-components.com/widgets/html/0.1/" onload="init(evt.target)">
  <elementDef name="input">
   <prototype><use/></prototype>
   <script type="text/ecmascript"><![CDATA[
alert('a')


 svgNS='http://www.w3.org/2000/svg'
 xlinkNS="http://www.w3.org/1999/xlink"

function init(nd) {
 myNS=nd.getAttributeNS(null,"namespace")
 var els=nd.getElementsByTagNameNS(svgNS,"elementDef")
	for (i=0;i<els.length;i++) {
  var el=els.item(i)
  el.addEventListener("SVGBindEnd",new BindEnd(el),false)
  el.addEventListener("SVGBindBegin",new BindBegin(el),false)
	}
}

function BindEnd(el) {
 this.el=el
}

function BindBegin(el) {
 this.el=el
}
BindBegin.prototype.handleEvent = function(evt) {
alert('a')
 var el=evt.target
 var st=evt.target.shadowTree
 var elName=el.nodeName+''
 var myAppearance=''
 switch (elName) {
  case "input" : 
   elType=el.getAttributeNS(null,"type")
   switch (elType) {
    case "text" :
     myAppearance="#textInput"
    break;
   }
   break;
  case "..." :
  break;
 }
 var appearance=el.getAttributeNS(myNS,"appearance")
 if (appearance) myAppearance=appearance
 st.firstChild.setAttributeNS(xlink,"href",myAppearance)
alert('a')
alert(printNode(st))
}

BindEnd.prototype.handleEvent = function(evt) {
alert('a')
 var el=evt.target
 var st=evt.target.shadowTree
 var elName=el.nodeName+''
 switch (elName) {
  case "input" : 
   elType=el.getAttributeNS(null,"type")
   switch (elType) {
    case "text" :
    break;
   }
   break;
  case "..." :
  break;
 }
}


   ]]></script> 
  </elementDef>
 </extensionDefs>
  <extensionDefs xlink:href="#htmlWidgets" />
  <input type="text" value="Jim" size="10" />
</svg>

