Initial commit of Effen reactive framework experiment for Sky

sky/examples/fn/widgets/box.dart

Index: sky/examples/fn/widgets/box.dart
diff --git a/sky/examples/fn/widgets/box.dart b/sky/examples/fn/widgets/box.dart
new file mode 100644
index 0000000000000000000000000000000000000000..cfddab1a3bf735d76c4407637f7f333a935cd82f
--- /dev/null
+++ b/sky/examples/fn/widgets/box.dart
@@ -0,0 +1,47 @@
+part of widgets;
+
+class Box extends Component {
+
+  static Style _style = new Style('''
+    display: flex;
+    flex-direction: column;
+    border-radius: 4px;
+    border: 1px solid gray;
+    margin: 10px;'''
+  );
+
+  static Style _titleStyle = new Style('''
+    flex: 1;
+    text-align: center;
+    font-size: 10px;
+    padding: 8px 8px 4px 8px;'''
+  );
+
+  static Style _contentStyle = new Style('''
+    flex: 1;
+    padding: 4px 8px 8px 8px;'''
+  );
+
+  String title;
+  List<Node> children;
+
+  Box({String key, this.title, this.children }) : super(key: key);
+
+  Node render() {
+    return new Container(
+      style: _style,
+      children: [
+        new Container(
+          key: 'Title',
+          style: _titleStyle,
+          children: [new Text(title)]
+        ),
+        new Container(
+          key: 'Content',
+          style: _contentStyle,
+          children: children
+        ),
+      ]
+    );
+  }
+}