Make the search box in the stocks app show a search field

sky/framework/components/input.dart

Index: sky/framework/components/input.dart
diff --git a/sky/framework/components/input.dart b/sky/framework/components/input.dart
index 3de32adf13b97969d80adb25be23395144262454..e6e816de2938f133f28d089d370aa995201fd666 100644
--- a/sky/framework/components/input.dart
+++ b/sky/framework/components/input.dart
@@ -28,21 +28,15 @@ class Input extends Component {
 
   ValueChanged onChanged;
   String value;
+  bool focused = false;
 
-  bool _focused = false;
+  bool _isAttachedToKeyboard = false;
   EditableString _editableValue;
 
-  Input({Object key, this.value: ''}) : super(key: key, stateful: true) {
+  Input({Object key, this.value: '', this.focused})
+      : super(key: key, stateful: true) {
     _editableValue = new EditableString(text: value,
                                         onUpdated: _handleTextUpdated);
-    events.listen('click', _handleClick);
-  }
-
-  void _handleClick(_) {
-    keyboard.show(_editableValue.stub);
-    setState(() {
-      _focused = true;
-    });
   }
 
   void _handleTextUpdated() {
@@ -54,12 +48,22 @@ class Input extends Component {
     }
   }
 
+  void didUnmount() {
+    if (_isAttachedToKeyboard)
+      keyboard.hide();
+  }
+
   Node build() {
+    if (focused && !_isAttachedToKeyboard) {
+      keyboard.show(_editableValue.stub);
+      _isAttachedToKeyboard = true;
+    }
+
     return new Container(
       style: _style,
-      inlineStyle: _focused ? _focusedInlineStyle : null,
+      inlineStyle: focused ? _focusedInlineStyle : null,
       children: [
-        new EditableText(value: _editableValue, focused: _focused),
+        new EditableText(value: _editableValue, focused: focused),
       ]
     );
   }