Make Stocks app search actually search

sky/examples/stocks-fn/stocksapp.dart

 library stocksapp;
 
 import '../../framework/fn.dart';
 import '../../framework/components/drawer.dart';
 import '../../framework/components/drawer_header.dart';
 import '../../framework/components/fixed_height_scrollable.dart';
 import '../../framework/components/floating_action_button.dart';
 import '../../framework/components/icon.dart';
 import '../../framework/components/input.dart';
 import '../../framework/components/material.dart';
@@ skipping 24 matching lines @@
     margin: 0 4px;'''
   );
 
   static Style _titleStyle = new Style('''
     flex: 1;
     margin: 0 4px;'''
   );
 
   List<Stock> _sortedStocks;
   bool _isSearching = false;
+  String _searchQuery;
 
   StocksApp() : super() {
     _sortedStocks = oracle.stocks;
     _sortedStocks.sort((a, b) => a.symbol.compareTo(b.symbol));
   }
 
   void _handleSearchClick(_) {
     setState(() {
       _isSearching = !_isSearching;
     });
   }
 
+  void _handleSearchQueryChanged(query) {
+    setState(() {
+      _searchQuery = query;
+    });
+  }
+
   Node build() {
     var drawer = new Drawer(
       animation: _drawerAnimation,
       children: [
         new DrawerHeader(
           children: [new Text('Stocks')]
         ),
         new MenuItem(
           key: 'Inbox',
           icon: 'content/inbox',
@@ skipping 12 matching lines @@
           children: [new Text('Settings')]
         ),
         new MenuItem(
           key: 'Help & Feedback',
           icon: 'action/help',
           children: [new Text('Help & Feedback')]
         )
       ]
     );
 
-    Node title = _isSearching
-        ? new Input(focused: true, placeholder: 'Search stocks')
-        : new Text('I am a stocks app');
+    Node title;
+    if (_isSearching) {
+      title = new Input(focused: true, placeholder: 'Search stocks',
+          onChanged: _handleSearchQueryChanged);
+    } else {
+      title = new Text('I am a stocks app');
+    }
 
     var toolbar = new Toolbar(
       children: [
         new Icon(key: 'menu', style: _iconStyle,
             size: 24,
             type: 'navigation/menu_white')
           ..events.listen('click', _drawerAnimation.toggle),
         new Container(
           style: _titleStyle,
           children: [title]
         ),
         new Icon(key: 'search', style: _iconStyle,
             size: 24,
             type: 'action/search_white')
           ..events.listen('click', _handleSearchClick),
         new Icon(key: 'more_white', style: _iconStyle,
             size: 24,
             type: 'navigation/more_vert_white')
       ]
     );
 
+    var list = new Stocklist(stocks: _sortedStocks, query: _searchQuery);
+
     var fab = new FloatingActionButton(content: new Icon(
       type: 'content/add_white', size: 24));
 
     return new Container(
       key: 'StocksApp',
       children: [
         new Container(
           key: 'Content',
           style: _style,
-          children: [toolbar, new Stocklist(stocks: _sortedStocks)]
+          children: [toolbar, list]
         ),
         fab,
         drawer,
       ]
     );
   }
 }