Stub out InkWell and implement Sky’s fn2 menu item

sky/sdk/lib/framework/components2/menu_item.dart

 // Copyright 2015 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
+import 'dart:sky' as sky;
 import '../fn2.dart';
+import '../rendering/box.dart';
+import '../rendering/flex.dart';
 import 'button_base.dart';
 import 'icon.dart';
 import 'ink_well.dart';
 
 class MenuItem extends ButtonBase {
-  static final Style _style = new Style('''
-    align-items: center;
-    height: 48px;
-    -webkit-user-select: none;'''
-  );
-
-  static final Style _highlightStyle = new Style('''
-    align-items: center;
-    height: 48px;
-    background: rgba(153, 153, 153, 0.4);
-    -webkit-user-select: none;'''
-  );
-
-  static final Style _iconStyle = new Style('''
-    padding: 0px 16px;'''
-  );
-
-  static final Style _labelStyle = new Style('''
-    padding: 0px 16px;'''
-  );
-
-  static final FlexBoxParentData _labelFlex = new FlexBoxParentData()..flex = 1;
+  static final BoxDecoration highlightDecoration = new BoxDecoration(

[Hixie, 2015/06/04 17:53:08]

Can you make this const?

[jackson, 2015/06/04 18:03:24]

Done.

+    backgroundColor: const sky.Color.fromARGB(102, 153, 153, 153)
+  ); 
 
   List<UINode> children;
   String icon;
   GestureEventListener onGestureTap;
 
   MenuItem({ Object key, this.icon, this.children, this.onGestureTap }) : super(key: key);
 
   UINode buildContent() {
     return new EventListenerNode(
-      new StyleNode(
-        new InkWell(
+      new Container(
+        child: new InkWell(
           children: [
-            new StyleNode(
-              new Icon(
-                size: 24,
-                type: "${icon}_grey600"
+            new Padding(
+              child: new Icon(type: "${icon}_grey600", size: 24),
+              padding: const EdgeDims.symmetric(0.0, 16.0)),
+            new FlexExpandingChild(
+              new Padding(
+                child: new FlexContainer(
+                  direction: FlexDirection.Horizontal,
+                  children: children
+                ),
+                padding: const EdgeDims.symmetric(0.0, 16.0)
               ),
-              _iconStyle
-            ),
-            new ParentDataNode(
-              new FlexContainer(
-                direction: FlexDirection.Row,
-                style: _labelStyle,
-                children: children
-              ),
-              _labelFlex
+              1
             )
           ]
         ),
-        highlight ? _highlightStyle : _style
+        desiredSize: const sky.Size.fromHeight(48.0),
+        decoration: highlight ? highlightDecoration : null
       ),
       onGestureTap: onGestureTap
     );
   }
 }