Implement <sky-input>

sky/examples/widgets/index.sky

Index: sky/examples/widgets/index.sky
diff --git a/sky/examples/widgets/index.sky b/sky/examples/widgets/index.sky
index 29c967882d6668ab61ef8602cab60f43094f935d..8e74c77c71974ecb4c1e20ba511c73fa92c52198 100644
--- a/sky/examples/widgets/index.sky
+++ b/sky/examples/widgets/index.sky
@@ -4,10 +4,11 @@
 // found in the LICENSE file.
 -->
 <sky>
-<import src="/sky/framework/sky-element/sky-element.sky" as="SkyElement"/>
-<import src="/sky/framework/sky-button/sky-button.sky"/>
 <import src="/sky/framework/sky-box/sky-box.sky"/>
+<import src="/sky/framework/sky-button/sky-button.sky"/>
 <import src="/sky/framework/sky-checkbox/sky-checkbox.sky"/>
+<import src="/sky/framework/sky-element/sky-element.sky" as="SkyElement"/>
+<import src="/sky/framework/sky-input.sky"/>
 <import src="/sky/framework/sky-radio/sky-radio.sky"/>
 <sky-element name="widget-root">
 <template>
@@ -24,6 +25,8 @@
   }
   </style>
 
+  <sky-input id="text" value="Ready" />
+
   <sky-box title='Buttons'>
     <sky-button id='button' on-click='handleClick'>Button</sky-button>
     <div>highlight: {{ myButton.highlight }}</div>
@@ -56,10 +59,12 @@ module.exports = class extends SkyElement {
   attached() {
     this.myButton = this.shadowRoot.getElementById('button');
     this.myCheckbox = this.shadowRoot.getElementById('checkbox');
+    this.myText = this.shadowRoot.getElementById('text');
     this.clickCount = 0;
   }
   handleClick(event) {
     this.clickCount++;
+    this.myText.value = "Moar clicking " + this.clickCount;
   }
 }.register();
 </script>