Allow Effen Styles to be extendable

sky/framework/fn.dart

Index: sky/framework/fn.dart
diff --git a/sky/framework/fn.dart b/sky/framework/fn.dart
index 12bcb888f4cf2b0d6c7c850c218830d8bf0a17c1..e21deba7c66b24383b576aabc7c1dc8921a5b53c 100644
--- a/sky/framework/fn.dart
+++ b/sky/framework/fn.dart
@@ -44,29 +44,47 @@ class EventMap {
 
 class Style {
   final String _className;
+  final String _styles;
+  final List<String> _classList;
+
   static final Map<String, Style> _cache = new HashMap<String, Style>();
 
-  static int nextStyleId = 1;
+  static int _nextStyleId = 1;
 
-  static String nextClassName(String styles) {
-    assert(sky.document != null);
-    String className = "style$nextStyleId";
-    nextStyleId++;
+  static String _getNextClassName() { return "style${_nextStyleId++}"; }
 
-    sky.Element styleNode = sky.document.createElement('style');
-    styleNode.setChild(new sky.Text(".$className { $styles }"));
-    sky.document.appendChild(styleNode);
+  factory Style(String styles) {
+    return _getOrCreateStyle(styles, null);
+  }
 
-    return className;
+  Style extendFromStyles(String styles) {
+    return _getOrCreateStyle(styles, _classList);
   }
 
-  factory Style(String styles) {
-    return _cache.putIfAbsent(styles, () {
-      return new Style._internal(nextClassName(styles));
+  Style extend(Style other) {
+    return this.extendFromStyles(other._styles);
+  }
+
+  static Style _getOrCreateStyle(String styles, List<String> inherited) {
+    var cacheId = inherited != null ? "${inherited.join('.')}-$styles"
+        : styles;
+    return _cache.putIfAbsent(cacheId, () {
+      var className = _getNextClassName();
+      List<String> classList = inherited == null ? [ className ]
+          : new List.from(inherited)..add(className);
+
+      var selector = ".${classList.join('.')}";
+      sky.Element styleNode = sky.document.createElement('style');
+      styleNode.setChild(new sky.Text("$selector { $styles }"));
+      sky.document.appendChild(styleNode);
+
+      return new Style._internal(styles, classList);
     });
   }
 
-  Style._internal(this._className);
+  Style._internal(this._styles, List<String> classList)
+    : _classList = classList,
+      _className = classList.join(' ');
 }
 
 void _parentInsertBefore(sky.ParentNode parent,
@@ -140,11 +158,11 @@ abstract class Element extends Node {
   Element({
     Object key,
     List<Node> children,
-    List<Style> styles,
+    Style style,
 
     this.inlineStyle
   }) : super(key:key) {
-    _class = styles == null ? '' : styles.map((s) => s._className).join(' ');
+    _class = style == null ? '' : style._className;
     _children = children == null ? _emptyList : children;
 
     if (_isInCheckedMode) {
@@ -412,12 +430,12 @@ class Container extends Element {
   Container({
     Object key,
     List<Node> children,
-    List<Style> styles,
+    Style style,
     String inlineStyle
   }) : super(
     key: key,
     children: children,
-    styles: styles,
+    style: style,
     inlineStyle: inlineStyle
   );
 }
@@ -436,7 +454,7 @@ class Image extends Element {
   Image({
     Object key,
     List<Node> children,
-    List<Style> styles,
+    Style style,
     String inlineStyle,
     this.width,
     this.height,
@@ -444,7 +462,7 @@ class Image extends Element {
   }) : super(
     key: key,
     children: children,
-    styles: styles,
+    style: style,
     inlineStyle: inlineStyle
   );
 
@@ -480,7 +498,7 @@ class Anchor extends Element {
   Anchor({
     Object key,
     List<Node> children,
-    List<Style> styles,
+    Style style,
     String inlineStyle,
     this.width,
     this.height,
@@ -488,7 +506,7 @@ class Anchor extends Element {
   }) : super(
     key: key,
     children: children,
-    styles: styles,
+    style: style,
     inlineStyle: inlineStyle
   );