bs-nice - npm Package Compare versions

Comparing version 0.1.2 to 0.1.3

lib/es6/__tests__/nice_test.js

 // Generated by BUCKLESCRIPT VERSION 2.1.0, PLEASE EDIT WITH CARE
 'use strict';
 
-import * as Jest from "bs-jest/lib/es6/src/jest.js";
+import * as Jest    from "bs-jest/lib/es6/src/jest.js";
+import * as Nice    from "../src/nice.js";
+import * as Block   from "bs-platform/lib/es6/block.js";
+import * as Hashtbl from "bs-platform/lib/es6/hashtbl.js";
 
+function serialized_rule_cache() {
+  return Hashtbl.fold((function (k, v, acc) {
+                return /* :: */[
+                        /* tuple */[
+                          k,
+                          v
+                        ],
+                        acc
+                      ];
+              }), Nice.rule_cache, /* [] */0);
+}
+
+function serialized_global_cache() {
+  return Hashtbl.fold((function (k, v, acc) {
+                return /* :: */[
+                        /* tuple */[
+                          k,
+                          v
+                        ],
+                        acc
+                      ];
+              }), Nice.global_cache, /* [] */0);
+}
+
 describe("Nice", (function () {
-        return Jest.test("toBe", (function () {
-                      return Jest.Expect[/* toMatchSnapshot */16](Jest.Expect[/* expect */0](3));
+        afterEach(Nice.flush);
+        Jest.test("css", (function () {
+                return Jest.Expect[/* toMatchSnapshot */16](Jest.Expect[/* expect */0](/* tuple */[
+                                Nice.css(/* :: */[
+                                      /* Display */Block.__(0, [/* Flex */5]),
+                                      /* :: */[
+                                        /* Width */Block.__(1, [/* Px */Block.__(0, [23])]),
+                                        /* [] */0
+                                      ]
+                                    ]),
+                                serialized_rule_cache(/* () */0)
+                              ]));
+              }));
+        return Jest.test("global", (function () {
+                      Nice.$$global("html, body", /* :: */[
+                            /* Padding */Block.__(18, [/* Px */Block.__(0, [20])]),
+                            /* [] */0
+                          ]);
+                      return Jest.Expect[/* toMatchSnapshot */16](Jest.Expect[/* expect */0](serialized_global_cache(/* () */0)));
                     }));
@@ -13,4 +57,6 @@ }));
 export {
+  serialized_rule_cache   ,
+  serialized_global_cache ,
   
 }
 /*  Not a pure module */

lib/es6/site/demo.js

@@ -12,3 +12,3 @@ // Generated by BUCKLESCRIPT VERSION 2.1.0, PLEASE EDIT WITH CARE
         /* :: */[
-          /* MediaQuery */Block.__(83, [
+          /* MediaQuery */Block.__(82, [
               "screen",
@@ -20,3 +20,3 @@ /* :: */[
                   /* :: */[
-                    /* Select */Block.__(85, [
+                    /* Select */Block.__(84, [
                         ":hover",
@@ -30,3 +30,3 @@ /* :: */[
                               /* :: */[
-                                /* Supports */Block.__(84, [
+                                /* Supports */Block.__(83, [
                                     "(display: flex)",
@@ -39,3 +39,3 @@ /* :: */[
                                 /* :: */[
-                                  /* Select */Block.__(85, [
+                                  /* Select */Block.__(84, [
                                       ":hover",
@@ -47,3 +47,3 @@ /* :: */[
                                           /* :: */[
-                                            /* Select */Block.__(85, [
+                                            /* Select */Block.__(84, [
                                                 ".ie6 &",
@@ -50,0 +50,0 @@ /* :: */[

lib/es6/src/nice_prefix.js

@@ -7,14 +7,14 @@ // Generated by BUCKLESCRIPT VERSION 2.1.0, PLEASE EDIT WITH CARE
 
-function flex(style) {
-  if (style.tag) {
+function flex(x) {
+  if (x.tag) {
     return /* :: */[
-            style,
+            x,
             /* [] */0
           ];
   } else {
-    var match = style[0];
+    var match = x[0];
     if (match !== 4) {
       if (match >= 5) {
         return List.map((function (x) {
-                      return /* Raw */Block.__(86, [
+                      return /* Raw */Block.__(88, [
                                 "display",
@@ -41,3 +41,3 @@ x
         return /* :: */[
-                style,
+                x,
                 /* [] */0
@@ -48,3 +48,3 @@ ];
       return List.map((function (x) {
-                    return /* Raw */Block.__(86, [
+                    return /* Raw */Block.__(88, [
                               "display",
@@ -51,0 +51,0 @@ x

lib/es6/src/nice.js

@@ -15,4 +15,12 @@ // Generated by BUCKLESCRIPT VERSION 2.1.0, PLEASE EDIT WITH CARE
 
-function string_of_position(position) {
-  switch (position) {
+var match = +(( typeof window !== 'undefined' ) === true);
+
+var isBrowser = match !== 0 ? /* true */1 : /* false */0;
+
+var match$1 = +(( process.env.NODE_ENV === 'test' ) === true);
+
+var isTest = match$1 !== 0 ? /* true */1 : /* false */0;
+
+function string_of_position(param) {
+  switch (param) {
     case 0 : 
@@ -30,4 +38,4 @@ return "absolute";
 
-function string_of_flexDirection(direction) {
-  switch (direction) {
+function string_of_flexDirection(param) {
+  switch (param) {
     case 0 : 
@@ -45,4 +53,4 @@ return "row";
 
-function string_of_flexWrap(wrap) {
-  if (wrap !== 0) {
+function string_of_flexWrap(param) {
+  if (param !== 0) {
     return "nowrap";
@@ -54,4 +62,4 @@ } else {
 
-function string_of_justifyContent(justify) {
-  switch (justify) {
+function string_of_justifyContent(param) {
+  switch (param) {
     case 0 : 
@@ -71,4 +79,4 @@ return "flex-start";
 
-function string_of_alignItems(align) {
-  switch (align) {
+function string_of_alignItems(param) {
+  switch (param) {
     case 0 : 
@@ -88,4 +96,4 @@ return "flex-start";
 
-function string_of_alignSelf(align) {
-  switch (align) {
+function string_of_alignSelf(param) {
+  switch (param) {
     case 0 : 
@@ -107,16 +115,36 @@ return "auto";
 
-function string_of_alignContent(align) {
-  switch (align) {
+function string_of_alignContent(param) {
+  switch (param) {
     case 0 : 
+        return "start";
+    case 1 : 
+        return "end";
+    case 2 : 
         return "flex-start";
-    case 1 : 
+    case 3 : 
         return "flex-end";
-    case 2 : 
+    case 4 : 
+        return "left";
+    case 5 : 
+        return "right";
+    case 6 : 
         return "center";
-    case 3 : 
+    case 7 : 
         return "stretch";
-    case 4 : 
+    case 8 : 
         return "space-between";
-    case 5 : 
+    case 9 : 
         return "space-around";
+    case 10 : 
+        return "baseline";
+    case 11 : 
+        return "first baseline";
+    case 12 : 
+        return "last baseline";
+    case 13 : 
+        return "space-evenly";
+    case 14 : 
+        return "safe-center";
+    case 15 : 
+        return "unsafe-center";
     
@@ -126,4 +154,4 @@ }
 
-function string_of_overflow(overflow) {
-  switch (overflow) {
+function string_of_overflow(param) {
+  switch (param) {
     case 0 : 
@@ -139,4 +167,4 @@ return "visible";
 
-function string_of_display(display) {
-  switch (display) {
+function string_of_display(param) {
+  switch (param) {
     case 0 : 
@@ -157,12 +185,12 @@ return "none";
 
-function string_of_dimension(value) {
-  switch (value.tag | 0) {
+function string_of_dimension(param) {
+  switch (param.tag | 0) {
     case 0 : 
-        return Pervasives.string_of_int(value[0]) + "px";
+        return "" + (String(param[0]) + "px");
     case 1 : 
-        return "" + (String(value[0]) + "") + "em";
+        return "" + (String(param[0]) + "em");
     case 2 : 
-        return "" + (String(value[0]) + "") + "%";
+        return "" + (String(param[0]) + "%");
     case 3 : 
-        return "calc(" + (value[0] + ")");
+        return "calc(" + (param[0] + ")");
     
@@ -172,4 +200,4 @@ }
 
-function string_of_flexBasis(basis) {
-  switch (basis) {
+function string_of_flexBasis(param) {
+  switch (param) {
     case 0 : 
@@ -185,8 +213,2 @@ return "auto";
         return "content";
-    case 5 : 
-        return "inherit";
-    case 6 : 
-        return "initital";
-    case 7 : 
-        return "unset";
     
@@ -196,42 +218,42 @@ }
 
-function string_of_angle(angle) {
-  if (angle.tag) {
-    return "" + (String(angle[0]) + "") + "rad";
+function string_of_angle(param) {
+  if (param.tag) {
+    return "" + (String(param[0]) + "rad");
   } else {
-    return "" + (String(angle[0]) + "") + "deg";
+    return "" + (String(param[0]) + "deg");
   }
 }
 
-function string_of_transform(transform) {
-  switch (transform.tag | 0) {
+function string_of_transform(param) {
+  switch (param.tag | 0) {
     case 0 : 
-        return "perspective(" + ("" + (String(transform[0]) + "") + ")");
+        return "perspective(" + (String(param[0]) + ")");
     case 1 : 
-        return "rotate(" + (string_of_angle(transform[0]) + ")");
+        return "rotate(" + (string_of_angle(param[0]) + ")");
     case 2 : 
-        return "rotateX(" + (string_of_angle(transform[0]) + ")");
+        return "rotateX(" + (string_of_angle(param[0]) + ")");
     case 3 : 
-        return "rotateY(" + (string_of_angle(transform[0]) + ")");
+        return "rotateY(" + (string_of_angle(param[0]) + ")");
     case 4 : 
-        return "rotateZ(" + (string_of_angle(transform[0]) + ")");
+        return "rotateZ(" + (string_of_angle(param[0]) + ")");
     case 5 : 
-        return "scale(" + ("" + (String(transform[0]) + "") + ")");
+        return "scale(" + ("" + (String(param[0]) + "") + ")");
     case 6 : 
-        return "scaleX(" + ("" + (String(transform[0]) + "") + ")");
+        return "scaleX(" + ("" + (String(param[0]) + "") + ")");
     case 7 : 
-        return "scaleY(" + ("" + (String(transform[0]) + "") + ")");
+        return "scaleY(" + ("" + (String(param[0]) + "") + ")");
     case 8 : 
-        return "scaleZ(" + ("" + (String(transform[0]) + "") + ")");
+        return "scaleZ(" + ("" + (String(param[0]) + "") + ")");
     case 9 : 
-        return "translate(" + ("" + (String(transform[0]) + "") + (", " + ("" + (String(transform[1]) + "") + ")")));
+        return "translate(" + ("" + (String(param[0]) + "") + (", " + ("" + (String(param[1]) + "") + ")")));
     case 10 : 
-        return "translateX(" + ("" + (String(transform[0]) + "") + ")");
+        return "translateX(" + ("" + (String(param[0]) + "") + ")");
     case 11 : 
-        return "translateY(" + ("" + (String(transform[0]) + "") + ")");
+        return "translateY(" + ("" + (String(param[0]) + "") + ")");
     case 12 : 
-        return "translateZ(" + ("" + (String(transform[0]) + "") + ")");
+        return "translateZ(" + ("" + (String(param[0]) + "") + ")");
     case 13 : 
-        return "skewX(" + (string_of_angle(transform[0]) + ")");
+        return "skewX(" + (string_of_angle(param[0]) + ")");
     case 14 : 
-        return "skewY(" + (string_of_angle(transform[0]) + ")");
+        return "skewY(" + (string_of_angle(param[0]) + ")");
     
@@ -241,5 +263,5 @@ }
 
-function string_of_color(color) {
-  if (typeof color === "number") {
-    switch (color) {
+function string_of_color(param) {
+  if (typeof param === "number") {
+    switch (param) {
       case 0 : 
@@ -540,9 +562,11 @@ return "transparent";
   } else {
-    switch (color.tag | 0) {
+    switch (param.tag | 0) {
       case 0 : 
+          return "rgba(" + (String(param[0]) + ("," + (String(param[1]) + ("," + (String(param[2]) + "")))));
+      case 1 : 
+          return "rgba(" + (String(param[0]) + ("," + (String(param[1]) + ("," + (String(param[2]) + ("," + (String(param[3]) + ")")))))));
       case 2 : 
-          return Pervasives.string_of_int(color[0]) + ("," + (Pervasives.string_of_int(color[1]) + ("," + Pervasives.string_of_int(color[2]))));
-      case 1 : 
+          return "hsl(" + (String(param[0]) + ("," + (String(param[1]) + ("," + (String(param[2]) + "")))));
       case 3 : 
-          return Pervasives.string_of_int(color[0]) + ("," + (Pervasives.string_of_int(color[1]) + ("," + (Pervasives.string_of_int(color[2]) + ("," + ("" + (String(color[3]) + "")))))));
+          return "hsla(" + (String(param[0]) + ("," + (String(param[1]) + ("," + (String(param[2]) + ("," + (String(param[3]) + "")))))));
       
@@ -553,4 +577,4 @@ }
 
-function string_of_fontWeight(weight) {
-  switch (weight) {
+function string_of_fontWeight(param) {
+  switch (param) {
     case 0 : 
@@ -582,4 +606,4 @@ return "normal";
 
-function string_of_backfaceVisibilty(backfaceVisibilty) {
-  if (backfaceVisibilty !== 0) {
+function string_of_backfaceVisibilty(param) {
+  if (param !== 0) {
     return "hidden";
@@ -591,4 +615,4 @@ } else {
 
-function string_of_borderStyle(borderStyle) {
-  switch (borderStyle) {
+function string_of_borderStyle(param) {
+  switch (param) {
     case 0 : 
@@ -604,4 +628,4 @@ return "solid";
 
-function string_of_fontStyle(fontStyle) {
-  if (fontStyle !== 0) {
+function string_of_fontStyle(param) {
+  if (param !== 0) {
     return "italic";
@@ -613,4 +637,4 @@ } else {
 
-function string_of_fontVariant(fontVariant) {
-  switch (fontVariant) {
+function string_of_fontVariant(param) {
+  switch (param) {
     case 0 : 
@@ -630,4 +654,4 @@ return "small-caps";
 
-function string_of_textAlign(textAlign) {
-  switch (textAlign) {
+function string_of_textAlign(param) {
+  switch (param) {
     case 0 : 
@@ -647,4 +671,4 @@ return "auto";
 
-function string_of_textAlignVertical(textAlignVertical) {
-  switch (textAlignVertical) {
+function string_of_textAlignVertical(param) {
+  switch (param) {
     case 0 : 
@@ -662,4 +686,4 @@ return "auto";
 
-function string_of_textDecorationLine(textDecorationLine) {
-  switch (textDecorationLine) {
+function string_of_textDecorationLine(param) {
+  switch (param) {
     case 0 : 
@@ -677,4 +701,4 @@ return "none";
 
-function string_of_textDecorationStyle(textDecorationStyle) {
-  switch (textDecorationStyle) {
+function string_of_textDecorationStyle(param) {
+  switch (param) {
     case 0 : 
@@ -692,4 +716,4 @@ return "solid";
 
-function string_of_writingDirection(writingDirection) {
-  switch (writingDirection) {
+function string_of_writingDirection(param) {
+  switch (param) {
     case 0 : 
@@ -705,4 +729,4 @@ return "auto";
 
-function string_of_resizeMode(resizeMode) {
-  switch (resizeMode) {
+function string_of_resizeMode(param) {
+  switch (param) {
     case 0 : 
@@ -722,170 +746,176 @@ return "contain";
 
-function string_of_style(style) {
-  switch (style.tag | 0) {
+function string_of_style(param) {
+  switch (param.tag | 0) {
     case 0 : 
-        return "display:" + string_of_display(style[0]);
+        return "display:" + string_of_display(param[0]);
     case 1 : 
-        return "width:" + string_of_dimension(style[0]);
+        return "width:" + string_of_dimension(param[0]);
     case 2 : 
-        return "height:" + string_of_dimension(style[0]);
+        return "height:" + string_of_dimension(param[0]);
     case 3 : 
-        return "top:" + string_of_dimension(style[0]);
+        return "top:" + string_of_dimension(param[0]);
     case 4 : 
-        return "bottom:" + string_of_dimension(style[0]);
+        return "bottom:" + string_of_dimension(param[0]);
     case 5 : 
-        return "left:" + string_of_dimension(style[0]);
+        return "left:" + string_of_dimension(param[0]);
     case 6 : 
-        return "right:" + string_of_dimension(style[0]);
+        return "right:" + string_of_dimension(param[0]);
     case 7 : 
-        return "min-width:" + string_of_dimension(style[0]);
+        return "min-width:" + string_of_dimension(param[0]);
     case 8 : 
-        return "max-width:" + string_of_dimension(style[0]);
+        return "max-width:" + string_of_dimension(param[0]);
     case 9 : 
-        return "minheight:" + string_of_dimension(style[0]);
+        return "minheight:" + string_of_dimension(param[0]);
     case 10 : 
-        return "maxheight:" + string_of_dimension(style[0]);
+        return "maxheight:" + string_of_dimension(param[0]);
     case 11 : 
-        return "margin:" + string_of_dimension(style[0]);
+        return "margin:" + string_of_dimension(param[0]);
     case 12 : 
-        return "margin-vertical:" + string_of_dimension(style[0]);
+        return "margin-vertical:" + string_of_dimension(param[0]);
     case 13 : 
-        return "margin-horizontal:" + string_of_dimension(style[0]);
+        return "margin-horizontal:" + string_of_dimension(param[0]);
     case 14 : 
-        return "margin-top:" + string_of_dimension(style[0]);
+        return "margin-top:" + string_of_dimension(param[0]);
     case 15 : 
-        return "margin-bottom:" + string_of_dimension(style[0]);
+        return "margin-bottom:" + string_of_dimension(param[0]);
     case 16 : 
-        return "margin-left:" + string_of_dimension(style[0]);
+        return "margin-left:" + string_of_dimension(param[0]);
     case 17 : 
-        return "margin-right:" + string_of_dimension(style[0]);
+        return "margin-right:" + string_of_dimension(param[0]);
     case 18 : 
-        return "padding:" + string_of_dimension(style[0]);
+        return "padding:" + string_of_dimension(param[0]);
     case 19 : 
-        return "padding-vertical:" + string_of_dimension(style[0]);
+        return "padding-vertical:" + string_of_dimension(param[0]);
     case 20 : 
-        return "padding-horizontal:" + string_of_dimension(style[0]);
+        return "padding-horizontal:" + string_of_dimension(param[0]);
     case 21 : 
-        return "padding-top:" + string_of_dimension(style[0]);
+        return "padding-top:" + string_of_dimension(param[0]);
     case 22 : 
-        return "padding-bottom:" + string_of_dimension(style[0]);
+        return "padding-bottom:" + string_of_dimension(param[0]);
     case 23 : 
-        return "padding-left:" + string_of_dimension(style[0]);
+        return "padding-left:" + string_of_dimension(param[0]);
     case 24 : 
-        return "padding-right:" + string_of_dimension(style[0]);
+        return "padding-right:" + string_of_dimension(param[0]);
     case 25 : 
-        return "border-width:" + string_of_dimension(style[0]);
+        return "border-width:" + string_of_dimension(param[0]);
     case 26 : 
-        return "border-top-width:" + string_of_dimension(style[0]);
+        return "border-top-width:" + string_of_dimension(param[0]);
     case 27 : 
-        return "border-bottom-width:" + string_of_dimension(style[0]);
+        return "border-bottom-width:" + string_of_dimension(param[0]);
     case 28 : 
-        return "border-left-width:" + string_of_dimension(style[0]);
+        return "border-left-width:" + string_of_dimension(param[0]);
     case 29 : 
-        return "border-right-width:" + string_of_dimension(style[0]);
+        return "border-right-width:" + string_of_dimension(param[0]);
     case 30 : 
-        return "position:" + string_of_position(style[0]);
+        return "position:" + string_of_position(param[0]);
     case 31 : 
-        return "flex-direction:" + string_of_flexDirection(style[0]);
+        return "flex-direction:" + string_of_flexDirection(param[0]);
     case 32 : 
-        return "flex-wrap:" + string_of_flexWrap(style[0]);
+        return "flex-wrap:" + string_of_flexWrap(param[0]);
     case 33 : 
-        return "justify-content:" + string_of_justifyContent(style[0]);
+        return "justify-content:" + string_of_justifyContent(param[0]);
     case 34 : 
-        return "align-items:" + string_of_alignItems(style[0]);
+        return "align-items:" + string_of_alignItems(param[0]);
     case 35 : 
-        return "align-self:" + string_of_alignSelf(style[0]);
+        return "align-self:" + string_of_alignSelf(param[0]);
     case 36 : 
-        return "align-content:" + string_of_alignContent(style[0]);
+        return "align-content:" + string_of_alignContent(param[0]);
     case 37 : 
-        return "overflow:" + string_of_overflow(style[0]);
+        return "overflow:" + string_of_overflow(param[0]);
     case 38 : 
-        return "flex:" + Pervasives.string_of_int(style[0]);
+        return "flex:" + Pervasives.string_of_int(param[0]);
     case 39 : 
-        return "flex-grow:" + Pervasives.string_of_int(style[0]);
+        return "flex-grow:" + Pervasives.string_of_int(param[0]);
     case 40 : 
-        return "flex-shrink:" + Pervasives.string_of_int(style[0]);
+        return "flex-shrink:" + Pervasives.string_of_int(param[0]);
     case 41 : 
-        return "flex-basis:" + Pervasives.string_of_int(style[0]);
+        return "flex-basis:" + Pervasives.string_of_int(param[0]);
     case 42 : 
-        return "flex-basis:" + string_of_flexBasis(style[0]);
+        return "flex-basis:" + string_of_flexBasis(param[0]);
     case 43 : 
-        return "shadow-color:" + string_of_color(style[0]);
+        return "shadow-color:" + string_of_color(param[0]);
     case 44 : 
-        return "shadow-offset:" + (Pervasives.string_of_int(style[0]) + ("," + Pervasives.string_of_int(style[1])));
+        return "shadow-offset:" + (Pervasives.string_of_int(param[0]) + ("," + Pervasives.string_of_int(param[1])));
     case 45 : 
-        return "shadow-opacity:" + ("" + (String(style[0]) + ""));
+        return "shadow-opacity:" + ("" + (String(param[0]) + ""));
     case 46 : 
-        return "shadow-radius:" + ("" + (String(style[0]) + ""));
+        return "shadow-radius:" + ("" + (String(param[0]) + ""));
     case 47 : 
-        return "transform:" + $$String.concat(",", List.map(string_of_transform, style[0]));
+        return "transform:" + $$String.concat(",", List.map(string_of_transform, param[0]));
     case 48 : 
-        return "backface-visibilty:" + string_of_backfaceVisibilty(style[0]);
+        return "backface-visibilty:" + string_of_backfaceVisibilty(param[0]);
     case 49 : 
-        return "background-color:" + string_of_color(style[0]);
+        return "background-color:" + string_of_color(param[0]);
     case 50 : 
-        return "border-color:" + string_of_color(style[0]);
+        return "border-color:" + string_of_color(param[0]);
     case 51 : 
-        return "border-top-color:" + string_of_color(style[0]);
+        return "border-top-color:" + string_of_color(param[0]);
     case 52 : 
-        return "border-bottom-color:" + string_of_color(style[0]);
+        return "border-bottom-color:" + string_of_color(param[0]);
     case 53 : 
-        return "border-left-color:" + string_of_color(style[0]);
+        return "border-left-color:" + string_of_color(param[0]);
     case 54 : 
-        return "border-right-color:" + string_of_color(style[0]);
+        return "border-right-color:" + string_of_color(param[0]);
     case 55 : 
-        return "border-radius:" + string_of_dimension(style[0]);
+        return "border-radius:" + string_of_dimension(param[0]);
     case 56 : 
-        return "border-top-right-radius:" + string_of_dimension(style[0]);
+        return "border-top-right-radius:" + string_of_dimension(param[0]);
     case 57 : 
-        return "border-bottom-left-radius:" + string_of_dimension(style[0]);
+        return "border-bottom-left-radius:" + string_of_dimension(param[0]);
     case 58 : 
-        return "border-bottom-right-radius:" + string_of_dimension(style[0]);
+        return "border-bottom-right-radius:" + string_of_dimension(param[0]);
     case 59 : 
-        return "border-top-left-radius:" + string_of_dimension(style[0]);
+        return "border-top-left-radius:" + string_of_dimension(param[0]);
     case 60 : 
-        return "border-style:" + string_of_borderStyle(style[0]);
+        return "border-style:" + string_of_borderStyle(param[0]);
     case 61 : 
-        return "opacity:" + ("" + (String(style[0]) + ""));
+        return "opacity:" + ("" + (String(param[0]) + ""));
     case 62 : 
-        return "elevation:" + ("" + (String(style[0]) + ""));
+        return "elevation:" + ("" + (String(param[0]) + ""));
     case 63 : 
-        return "color:" + string_of_color(style[0]);
+        return "color:" + string_of_color(param[0]);
     case 64 : 
-        return "font-family:" + style[0];
+        return "font-family:" + param[0];
     case 65 : 
-        return "font-size:" + ("" + (String(style[0]) + ""));
+        return "font-size:" + ("" + (String(param[0]) + ""));
     case 66 : 
-        return "font-style:" + string_of_fontStyle(style[0]);
+        return "font-style:" + string_of_fontStyle(param[0]);
     case 67 : 
-        return "font-weight:" + string_of_fontWeight(style[0]);
+        return "font-weight:" + string_of_fontWeight(param[0]);
     case 68 : 
-        return "font-variant:" + string_of_fontVariant(style[0]);
+        return "font-variant:" + string_of_fontVariant(param[0]);
+    case 69 : 
+        return "text-shadow-radius:" + ("" + (String(param[0]) + ""));
     case 70 : 
-        return "text-shadow-radius:" + ("" + (String(style[0]) + ""));
+        return "text-shadow-color:" + string_of_color(param[0]);
     case 71 : 
-        return "text-shadow-color:" + string_of_color(style[0]);
+        return "letter-spacing:" + ("" + (String(param[0]) + ""));
     case 72 : 
-        return "letter-spacing:" + ("" + (String(style[0]) + ""));
+        return "line-height:" + ("" + (String(param[0]) + ""));
     case 73 : 
-        return "line-height:" + ("" + (String(style[0]) + ""));
+        return "text-align:" + string_of_textAlign(param[0]);
     case 74 : 
-        return "text-align:" + string_of_textAlign(style[0]);
+        return "text-align-vertical:" + string_of_textAlignVertical(param[0]);
     case 75 : 
-        return "text-align-vertical:" + string_of_textAlignVertical(style[0]);
+        return "includefontpadding:" + Pervasives.string_of_bool(param[0]);
     case 76 : 
-        return "includefontpadding:" + Pervasives.string_of_bool(style[0]);
+        return "text-decoration-line:" + string_of_textDecorationLine(param[0]);
     case 77 : 
-        return "text-decoration-line:" + string_of_textDecorationLine(style[0]);
+        return "text-decoration-color:" + string_of_color(param[0]);
     case 78 : 
-        return "text-decoration-color:" + string_of_color(style[0]);
+        return "writing-direction:" + string_of_writingDirection(param[0]);
     case 79 : 
-        return "writing-direction:" + string_of_writingDirection(style[0]);
+        return "resizemode:" + string_of_resizeMode(param[0]);
     case 80 : 
-        return "resizemode:" + string_of_resizeMode(style[0]);
+        return "tintcolor:" + string_of_color(param[0]);
     case 81 : 
-        return "tintcolor:" + string_of_color(style[0]);
-    case 82 : 
-        return "overlay-color" + string_of_color(style[0]);
+        return "overlay-color" + string_of_color(param[0]);
+    case 85 : 
+        return param[0] + ":unset";
     case 86 : 
-        return style[0] + (":" + style[1]);
+        return param[0] + ":initial";
+    case 87 : 
+        return param[0] + ":inherit";
+    case 88 : 
+        return param[0] + (":" + param[1]);
     default:
@@ -896,2 +926,4 @@ throw Caml_builtin_exceptions.not_found;
 
+var selectorTokenizer = (/[(),]|"(?:\\.|[^"\n])*"|'(?:\\.|[^'\n])*'|\/\*[\s\S]*?\*\//g);
+
 var splitSelector = (
@@ -989,3 +1021,3 @@ function(selector) {
                 switch (style.tag | 0) {
-                  case 83 : 
+                  case 82 : 
                       return List.concat(/* :: */[
@@ -1011,3 +1043,3 @@ acc,
                                 ]);
-                  case 84 : 
+                  case 83 : 
                       return List.concat(/* :: */[
@@ -1033,3 +1065,3 @@ acc,
                                 ]);
-                  case 85 : 
+                  case 84 : 
                       return List.concat(/* :: */[
@@ -1142,4 +1174,13 @@ acc,
 
-var injected = Hashtbl.create(/* None */0, 100);
+var global_cache = Hashtbl.create(/* None */0, 100);
 
+var injected_cache = Hashtbl.create(/* None */0, 100);
+
+var rule_cache = Hashtbl.create(/* None */0, 100);
+
+function flush() {
+  Hashtbl.reset(injected_cache);
+  return Hashtbl.reset(rule_cache);
+}
+
 var insertRule = (function(rule){
@@ -1156,3 +1197,3 @@ if(typeof window === "undefined"){
       if(process.env.NODE_ENV === 'production'){
-        tag.sheet.insertRule(rule, tag.sheet.cssRules.length);
+
       } else {
@@ -1163,14 +1204,8 @@ tag.appendChild(document.createTextNode(rule));
 
-function flush() {
-  return Hashtbl.reset(injected);
-}
+var alphabet = "0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ";
 
-function symbols(param) {
-  return Caml_string.get("0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ", param);
-}
-
 function base62_of_int($$int) {
   var fn = function (n, c) {
     if (n !== 0) {
-      return fn(n / 62 | 0, Char.escaped(symbols(n - Caml_int32.imul(62, n / 62 | 0) | 0))) + c;
+      return fn(n / 62 | 0, Char.escaped(Caml_string.get(alphabet, n - Caml_int32.imul(62, n / 62 | 0) | 0))) + c;
     } else {
@@ -1184,3 +1219,3 @@ return c;
 function insert(nodes, hash) {
-  if (Hashtbl.mem(injected, nodes)) {
+  if (Hashtbl.mem(injected_cache, hash)) {
     return 0;
@@ -1193,4 +1228,8 @@ } else {
                 }))(nodes));
-    List.map(insertRule, cssRules);
-    return Hashtbl.add(injected, nodes, /* true */1);
+    if (isBrowser && !isTest) {
+      List.map(insertRule, cssRules);
+    } else {
+      Hashtbl.add(rule_cache, hash, cssRules);
+    }
+    return Hashtbl.add(injected_cache, hash, /* true */1);
   }
@@ -1208,6 +1247,37 @@ }
   var flattened = group(walk(decls, blankScope));
-  insert(flattened, select);
-  return /* () */0;
+  var hash = ".raw-" + base62_of_int(Hashtbl.hash(flattened));
+  if (Hashtbl.mem(injected_cache, hash)) {
+    return 0;
+  } else {
+    var cssRules = List.map((function (param) {
+            return string_of_scope(param[0], select, $$String.concat(";", List.map(string_of_style, param[1])));
+          }), List.filter((function (param) {
+                  return +(param[1] !== /* [] */0);
+                }))(flattened));
+    if (isBrowser && !isTest) {
+      List.map(insertRule, cssRules);
+    } else {
+      Hashtbl.add(global_cache, hash, cssRules);
+    }
+    return Hashtbl.add(injected_cache, hash, /* true */1);
+  }
 }
 
+function raw(css) {
+  var hash = ".raw-" + base62_of_int(Hashtbl.hash(css));
+  if (Hashtbl.mem(injected_cache, hash)) {
+    return 0;
+  } else {
+    Hashtbl.add(injected_cache, hash, /* true */1);
+    if (isBrowser && !isTest) {
+      return Curry._1(insertRule, css);
+    } else {
+      return Hashtbl.add(global_cache, hash, /* :: */[
+                  css,
+                  /* [] */0
+                ]);
+    }
+  }
+}
+
 function keyframes() {
@@ -1230,3 +1300,6 @@ return /* () */0;
 function extract() {
-  return /* [] */0;
+  return /* record */[
+          /* css : [] */0,
+          /* ids : [] */0
+        ];
 }
@@ -1243,2 +1316,4 @@
 export {
+  isBrowser                     ,
+  isTest                        ,
   string_of_position            ,
@@ -1270,2 +1345,3 @@ string_of_flexDirection       ,
   string_of_style               ,
+  selectorTokenizer             ,
   splitSelector                 ,
@@ -1279,6 +1355,8 @@ replace                       ,
   flatten                       ,
-  injected                      ,
+  global_cache                  ,
+  injected_cache                ,
+  rule_cache                    ,
+  flush                         ,
   insertRule                    ,
-  flush                         ,
-  symbols                       ,
+  alphabet                      ,
   base62_of_int                 ,
@@ -1288,2 +1366,3 @@ insert                        ,
   $$global                      ,
+  raw                           ,
   keyframes                     ,
@@ -1297,2 +1376,2 @@ animation                     ,
 }
-/* splitSelector Not a pure module */
+/* match Not a pure module */

lib/js/__tests__/nice_test.js

 // Generated by BUCKLESCRIPT VERSION 2.1.0, PLEASE EDIT WITH CARE
 'use strict';
 
-var Jest = require("bs-jest/lib/js/src/jest.js");
+var Jest    = require("bs-jest/lib/js/src/jest.js");
+var Nice    = require("../src/nice.js");
+var Block   = require("bs-platform/lib/js/block.js");
+var Hashtbl = require("bs-platform/lib/js/hashtbl.js");
 
+function serialized_rule_cache() {
+  return Hashtbl.fold((function (k, v, acc) {
+                return /* :: */[
+                        /* tuple */[
+                          k,
+                          v
+                        ],
+                        acc
+                      ];
+              }), Nice.rule_cache, /* [] */0);
+}
+
+function serialized_global_cache() {
+  return Hashtbl.fold((function (k, v, acc) {
+                return /* :: */[
+                        /* tuple */[
+                          k,
+                          v
+                        ],
+                        acc
+                      ];
+              }), Nice.global_cache, /* [] */0);
+}
+
 describe("Nice", (function () {
-        return Jest.test("toBe", (function () {
-                      return Jest.Expect[/* toMatchSnapshot */16](Jest.Expect[/* expect */0](3));
+        afterEach(Nice.flush);
+        Jest.test("css", (function () {
+                return Jest.Expect[/* toMatchSnapshot */16](Jest.Expect[/* expect */0](/* tuple */[
+                                Nice.css(/* :: */[
+                                      /* Display */Block.__(0, [/* Flex */5]),
+                                      /* :: */[
+                                        /* Width */Block.__(1, [/* Px */Block.__(0, [23])]),
+                                        /* [] */0
+                                      ]
+                                    ]),
+                                serialized_rule_cache(/* () */0)
+                              ]));
+              }));
+        return Jest.test("global", (function () {
+                      Nice.$$global("html, body", /* :: */[
+                            /* Padding */Block.__(18, [/* Px */Block.__(0, [20])]),
+                            /* [] */0
+                          ]);
+                      return Jest.Expect[/* toMatchSnapshot */16](Jest.Expect[/* expect */0](serialized_global_cache(/* () */0)));
                     }));
       }));
 
+exports.serialized_rule_cache   = serialized_rule_cache;
+exports.serialized_global_cache = serialized_global_cache;
 /*  Not a pure module */

lib/js/site/demo.js

@@ -12,3 +12,3 @@ // Generated by BUCKLESCRIPT VERSION 2.1.0, PLEASE EDIT WITH CARE
         /* :: */[
-          /* MediaQuery */Block.__(83, [
+          /* MediaQuery */Block.__(82, [
               "screen",
@@ -20,3 +20,3 @@ /* :: */[
                   /* :: */[
-                    /* Select */Block.__(85, [
+                    /* Select */Block.__(84, [
                         ":hover",
@@ -30,3 +30,3 @@ /* :: */[
                               /* :: */[
-                                /* Supports */Block.__(84, [
+                                /* Supports */Block.__(83, [
                                     "(display: flex)",
@@ -39,3 +39,3 @@ /* :: */[
                                 /* :: */[
-                                  /* Select */Block.__(85, [
+                                  /* Select */Block.__(84, [
                                       ":hover",
@@ -47,3 +47,3 @@ /* :: */[
                                           /* :: */[
-                                            /* Select */Block.__(85, [
+                                            /* Select */Block.__(84, [
                                                 ".ie6 &",
@@ -50,0 +50,0 @@ /* :: */[

lib/js/src/nice_prefix.js

@@ -7,14 +7,14 @@ // Generated by BUCKLESCRIPT VERSION 2.1.0, PLEASE EDIT WITH CARE
 
-function flex(style) {
-  if (style.tag) {
+function flex(x) {
+  if (x.tag) {
     return /* :: */[
-            style,
+            x,
             /* [] */0
           ];
   } else {
-    var match = style[0];
+    var match = x[0];
     if (match !== 4) {
       if (match >= 5) {
         return List.map((function (x) {
-                      return /* Raw */Block.__(86, [
+                      return /* Raw */Block.__(88, [
                                 "display",
@@ -41,3 +41,3 @@ x
         return /* :: */[
-                style,
+                x,
                 /* [] */0
@@ -48,3 +48,3 @@ ];
       return List.map((function (x) {
-                    return /* Raw */Block.__(86, [
+                    return /* Raw */Block.__(88, [
                               "display",
@@ -51,0 +51,0 @@ x

lib/js/src/nice.js

@@ -15,4 +15,12 @@ // Generated by BUCKLESCRIPT VERSION 2.1.0, PLEASE EDIT WITH CARE
 
-function string_of_position(position) {
-  switch (position) {
+var match = +(( typeof window !== 'undefined' ) === true);
+
+var isBrowser = match !== 0 ? /* true */1 : /* false */0;
+
+var match$1 = +(( process.env.NODE_ENV === 'test' ) === true);
+
+var isTest = match$1 !== 0 ? /* true */1 : /* false */0;
+
+function string_of_position(param) {
+  switch (param) {
     case 0 : 
@@ -30,4 +38,4 @@ return "absolute";
 
-function string_of_flexDirection(direction) {
-  switch (direction) {
+function string_of_flexDirection(param) {
+  switch (param) {
     case 0 : 
@@ -45,4 +53,4 @@ return "row";
 
-function string_of_flexWrap(wrap) {
-  if (wrap !== 0) {
+function string_of_flexWrap(param) {
+  if (param !== 0) {
     return "nowrap";
@@ -54,4 +62,4 @@ } else {
 
-function string_of_justifyContent(justify) {
-  switch (justify) {
+function string_of_justifyContent(param) {
+  switch (param) {
     case 0 : 
@@ -71,4 +79,4 @@ return "flex-start";
 
-function string_of_alignItems(align) {
-  switch (align) {
+function string_of_alignItems(param) {
+  switch (param) {
     case 0 : 
@@ -88,4 +96,4 @@ return "flex-start";
 
-function string_of_alignSelf(align) {
-  switch (align) {
+function string_of_alignSelf(param) {
+  switch (param) {
     case 0 : 
@@ -107,16 +115,36 @@ return "auto";
 
-function string_of_alignContent(align) {
-  switch (align) {
+function string_of_alignContent(param) {
+  switch (param) {
     case 0 : 
+        return "start";
+    case 1 : 
+        return "end";
+    case 2 : 
         return "flex-start";
-    case 1 : 
+    case 3 : 
         return "flex-end";
-    case 2 : 
+    case 4 : 
+        return "left";
+    case 5 : 
+        return "right";
+    case 6 : 
         return "center";
-    case 3 : 
+    case 7 : 
         return "stretch";
-    case 4 : 
+    case 8 : 
         return "space-between";
-    case 5 : 
+    case 9 : 
         return "space-around";
+    case 10 : 
+        return "baseline";
+    case 11 : 
+        return "first baseline";
+    case 12 : 
+        return "last baseline";
+    case 13 : 
+        return "space-evenly";
+    case 14 : 
+        return "safe-center";
+    case 15 : 
+        return "unsafe-center";
     
@@ -126,4 +154,4 @@ }
 
-function string_of_overflow(overflow) {
-  switch (overflow) {
+function string_of_overflow(param) {
+  switch (param) {
     case 0 : 
@@ -139,4 +167,4 @@ return "visible";
 
-function string_of_display(display) {
-  switch (display) {
+function string_of_display(param) {
+  switch (param) {
     case 0 : 
@@ -157,12 +185,12 @@ return "none";
 
-function string_of_dimension(value) {
-  switch (value.tag | 0) {
+function string_of_dimension(param) {
+  switch (param.tag | 0) {
     case 0 : 
-        return Pervasives.string_of_int(value[0]) + "px";
+        return "" + (String(param[0]) + "px");
     case 1 : 
-        return "" + (String(value[0]) + "") + "em";
+        return "" + (String(param[0]) + "em");
     case 2 : 
-        return "" + (String(value[0]) + "") + "%";
+        return "" + (String(param[0]) + "%");
     case 3 : 
-        return "calc(" + (value[0] + ")");
+        return "calc(" + (param[0] + ")");
     
@@ -172,4 +200,4 @@ }
 
-function string_of_flexBasis(basis) {
-  switch (basis) {
+function string_of_flexBasis(param) {
+  switch (param) {
     case 0 : 
@@ -185,8 +213,2 @@ return "auto";
         return "content";
-    case 5 : 
-        return "inherit";
-    case 6 : 
-        return "initital";
-    case 7 : 
-        return "unset";
     
@@ -196,42 +218,42 @@ }
 
-function string_of_angle(angle) {
-  if (angle.tag) {
-    return "" + (String(angle[0]) + "") + "rad";
+function string_of_angle(param) {
+  if (param.tag) {
+    return "" + (String(param[0]) + "rad");
   } else {
-    return "" + (String(angle[0]) + "") + "deg";
+    return "" + (String(param[0]) + "deg");
   }
 }
 
-function string_of_transform(transform) {
-  switch (transform.tag | 0) {
+function string_of_transform(param) {
+  switch (param.tag | 0) {
     case 0 : 
-        return "perspective(" + ("" + (String(transform[0]) + "") + ")");
+        return "perspective(" + (String(param[0]) + ")");
     case 1 : 
-        return "rotate(" + (string_of_angle(transform[0]) + ")");
+        return "rotate(" + (string_of_angle(param[0]) + ")");
     case 2 : 
-        return "rotateX(" + (string_of_angle(transform[0]) + ")");
+        return "rotateX(" + (string_of_angle(param[0]) + ")");
     case 3 : 
-        return "rotateY(" + (string_of_angle(transform[0]) + ")");
+        return "rotateY(" + (string_of_angle(param[0]) + ")");
     case 4 : 
-        return "rotateZ(" + (string_of_angle(transform[0]) + ")");
+        return "rotateZ(" + (string_of_angle(param[0]) + ")");
     case 5 : 
-        return "scale(" + ("" + (String(transform[0]) + "") + ")");
+        return "scale(" + ("" + (String(param[0]) + "") + ")");
     case 6 : 
-        return "scaleX(" + ("" + (String(transform[0]) + "") + ")");
+        return "scaleX(" + ("" + (String(param[0]) + "") + ")");
     case 7 : 
-        return "scaleY(" + ("" + (String(transform[0]) + "") + ")");
+        return "scaleY(" + ("" + (String(param[0]) + "") + ")");
     case 8 : 
-        return "scaleZ(" + ("" + (String(transform[0]) + "") + ")");
+        return "scaleZ(" + ("" + (String(param[0]) + "") + ")");
     case 9 : 
-        return "translate(" + ("" + (String(transform[0]) + "") + (", " + ("" + (String(transform[1]) + "") + ")")));
+        return "translate(" + ("" + (String(param[0]) + "") + (", " + ("" + (String(param[1]) + "") + ")")));
     case 10 : 
-        return "translateX(" + ("" + (String(transform[0]) + "") + ")");
+        return "translateX(" + ("" + (String(param[0]) + "") + ")");
     case 11 : 
-        return "translateY(" + ("" + (String(transform[0]) + "") + ")");
+        return "translateY(" + ("" + (String(param[0]) + "") + ")");
     case 12 : 
-        return "translateZ(" + ("" + (String(transform[0]) + "") + ")");
+        return "translateZ(" + ("" + (String(param[0]) + "") + ")");
     case 13 : 
-        return "skewX(" + (string_of_angle(transform[0]) + ")");
+        return "skewX(" + (string_of_angle(param[0]) + ")");
     case 14 : 
-        return "skewY(" + (string_of_angle(transform[0]) + ")");
+        return "skewY(" + (string_of_angle(param[0]) + ")");
     
@@ -241,5 +263,5 @@ }
 
-function string_of_color(color) {
-  if (typeof color === "number") {
-    switch (color) {
+function string_of_color(param) {
+  if (typeof param === "number") {
+    switch (param) {
       case 0 : 
@@ -540,9 +562,11 @@ return "transparent";
   } else {
-    switch (color.tag | 0) {
+    switch (param.tag | 0) {
       case 0 : 
+          return "rgba(" + (String(param[0]) + ("," + (String(param[1]) + ("," + (String(param[2]) + "")))));
+      case 1 : 
+          return "rgba(" + (String(param[0]) + ("," + (String(param[1]) + ("," + (String(param[2]) + ("," + (String(param[3]) + ")")))))));
       case 2 : 
-          return Pervasives.string_of_int(color[0]) + ("," + (Pervasives.string_of_int(color[1]) + ("," + Pervasives.string_of_int(color[2]))));
-      case 1 : 
+          return "hsl(" + (String(param[0]) + ("," + (String(param[1]) + ("," + (String(param[2]) + "")))));
       case 3 : 
-          return Pervasives.string_of_int(color[0]) + ("," + (Pervasives.string_of_int(color[1]) + ("," + (Pervasives.string_of_int(color[2]) + ("," + ("" + (String(color[3]) + "")))))));
+          return "hsla(" + (String(param[0]) + ("," + (String(param[1]) + ("," + (String(param[2]) + ("," + (String(param[3]) + "")))))));
       
@@ -553,4 +577,4 @@ }
 
-function string_of_fontWeight(weight) {
-  switch (weight) {
+function string_of_fontWeight(param) {
+  switch (param) {
     case 0 : 
@@ -582,4 +606,4 @@ return "normal";
 
-function string_of_backfaceVisibilty(backfaceVisibilty) {
-  if (backfaceVisibilty !== 0) {
+function string_of_backfaceVisibilty(param) {
+  if (param !== 0) {
     return "hidden";
@@ -591,4 +615,4 @@ } else {
 
-function string_of_borderStyle(borderStyle) {
-  switch (borderStyle) {
+function string_of_borderStyle(param) {
+  switch (param) {
     case 0 : 
@@ -604,4 +628,4 @@ return "solid";
 
-function string_of_fontStyle(fontStyle) {
-  if (fontStyle !== 0) {
+function string_of_fontStyle(param) {
+  if (param !== 0) {
     return "italic";
@@ -613,4 +637,4 @@ } else {
 
-function string_of_fontVariant(fontVariant) {
-  switch (fontVariant) {
+function string_of_fontVariant(param) {
+  switch (param) {
     case 0 : 
@@ -630,4 +654,4 @@ return "small-caps";
 
-function string_of_textAlign(textAlign) {
-  switch (textAlign) {
+function string_of_textAlign(param) {
+  switch (param) {
     case 0 : 
@@ -647,4 +671,4 @@ return "auto";
 
-function string_of_textAlignVertical(textAlignVertical) {
-  switch (textAlignVertical) {
+function string_of_textAlignVertical(param) {
+  switch (param) {
     case 0 : 
@@ -662,4 +686,4 @@ return "auto";
 
-function string_of_textDecorationLine(textDecorationLine) {
-  switch (textDecorationLine) {
+function string_of_textDecorationLine(param) {
+  switch (param) {
     case 0 : 
@@ -677,4 +701,4 @@ return "none";
 
-function string_of_textDecorationStyle(textDecorationStyle) {
-  switch (textDecorationStyle) {
+function string_of_textDecorationStyle(param) {
+  switch (param) {
     case 0 : 
@@ -692,4 +716,4 @@ return "solid";
 
-function string_of_writingDirection(writingDirection) {
-  switch (writingDirection) {
+function string_of_writingDirection(param) {
+  switch (param) {
     case 0 : 
@@ -705,4 +729,4 @@ return "auto";
 
-function string_of_resizeMode(resizeMode) {
-  switch (resizeMode) {
+function string_of_resizeMode(param) {
+  switch (param) {
     case 0 : 
@@ -722,170 +746,176 @@ return "contain";
 
-function string_of_style(style) {
-  switch (style.tag | 0) {
+function string_of_style(param) {
+  switch (param.tag | 0) {
     case 0 : 
-        return "display:" + string_of_display(style[0]);
+        return "display:" + string_of_display(param[0]);
     case 1 : 
-        return "width:" + string_of_dimension(style[0]);
+        return "width:" + string_of_dimension(param[0]);
     case 2 : 
-        return "height:" + string_of_dimension(style[0]);
+        return "height:" + string_of_dimension(param[0]);
     case 3 : 
-        return "top:" + string_of_dimension(style[0]);
+        return "top:" + string_of_dimension(param[0]);
     case 4 : 
-        return "bottom:" + string_of_dimension(style[0]);
+        return "bottom:" + string_of_dimension(param[0]);
     case 5 : 
-        return "left:" + string_of_dimension(style[0]);
+        return "left:" + string_of_dimension(param[0]);
     case 6 : 
-        return "right:" + string_of_dimension(style[0]);
+        return "right:" + string_of_dimension(param[0]);
     case 7 : 
-        return "min-width:" + string_of_dimension(style[0]);
+        return "min-width:" + string_of_dimension(param[0]);
     case 8 : 
-        return "max-width:" + string_of_dimension(style[0]);
+        return "max-width:" + string_of_dimension(param[0]);
     case 9 : 
-        return "minheight:" + string_of_dimension(style[0]);
+        return "minheight:" + string_of_dimension(param[0]);
     case 10 : 
-        return "maxheight:" + string_of_dimension(style[0]);
+        return "maxheight:" + string_of_dimension(param[0]);
     case 11 : 
-        return "margin:" + string_of_dimension(style[0]);
+        return "margin:" + string_of_dimension(param[0]);
     case 12 : 
-        return "margin-vertical:" + string_of_dimension(style[0]);
+        return "margin-vertical:" + string_of_dimension(param[0]);
     case 13 : 
-        return "margin-horizontal:" + string_of_dimension(style[0]);
+        return "margin-horizontal:" + string_of_dimension(param[0]);
     case 14 : 
-        return "margin-top:" + string_of_dimension(style[0]);
+        return "margin-top:" + string_of_dimension(param[0]);
     case 15 : 
-        return "margin-bottom:" + string_of_dimension(style[0]);
+        return "margin-bottom:" + string_of_dimension(param[0]);
     case 16 : 
-        return "margin-left:" + string_of_dimension(style[0]);
+        return "margin-left:" + string_of_dimension(param[0]);
     case 17 : 
-        return "margin-right:" + string_of_dimension(style[0]);
+        return "margin-right:" + string_of_dimension(param[0]);
     case 18 : 
-        return "padding:" + string_of_dimension(style[0]);
+        return "padding:" + string_of_dimension(param[0]);
     case 19 : 
-        return "padding-vertical:" + string_of_dimension(style[0]);
+        return "padding-vertical:" + string_of_dimension(param[0]);
     case 20 : 
-        return "padding-horizontal:" + string_of_dimension(style[0]);
+        return "padding-horizontal:" + string_of_dimension(param[0]);
     case 21 : 
-        return "padding-top:" + string_of_dimension(style[0]);
+        return "padding-top:" + string_of_dimension(param[0]);
     case 22 : 
-        return "padding-bottom:" + string_of_dimension(style[0]);
+        return "padding-bottom:" + string_of_dimension(param[0]);
     case 23 : 
-        return "padding-left:" + string_of_dimension(style[0]);
+        return "padding-left:" + string_of_dimension(param[0]);
     case 24 : 
-        return "padding-right:" + string_of_dimension(style[0]);
+        return "padding-right:" + string_of_dimension(param[0]);
     case 25 : 
-        return "border-width:" + string_of_dimension(style[0]);
+        return "border-width:" + string_of_dimension(param[0]);
     case 26 : 
-        return "border-top-width:" + string_of_dimension(style[0]);
+        return "border-top-width:" + string_of_dimension(param[0]);
     case 27 : 
-        return "border-bottom-width:" + string_of_dimension(style[0]);
+        return "border-bottom-width:" + string_of_dimension(param[0]);
     case 28 : 
-        return "border-left-width:" + string_of_dimension(style[0]);
+        return "border-left-width:" + string_of_dimension(param[0]);
     case 29 : 
-        return "border-right-width:" + string_of_dimension(style[0]);
+        return "border-right-width:" + string_of_dimension(param[0]);
     case 30 : 
-        return "position:" + string_of_position(style[0]);
+        return "position:" + string_of_position(param[0]);
     case 31 : 
-        return "flex-direction:" + string_of_flexDirection(style[0]);
+        return "flex-direction:" + string_of_flexDirection(param[0]);
     case 32 : 
-        return "flex-wrap:" + string_of_flexWrap(style[0]);
+        return "flex-wrap:" + string_of_flexWrap(param[0]);
     case 33 : 
-        return "justify-content:" + string_of_justifyContent(style[0]);
+        return "justify-content:" + string_of_justifyContent(param[0]);
     case 34 : 
-        return "align-items:" + string_of_alignItems(style[0]);
+        return "align-items:" + string_of_alignItems(param[0]);
     case 35 : 
-        return "align-self:" + string_of_alignSelf(style[0]);
+        return "align-self:" + string_of_alignSelf(param[0]);
     case 36 : 
-        return "align-content:" + string_of_alignContent(style[0]);
+        return "align-content:" + string_of_alignContent(param[0]);
     case 37 : 
-        return "overflow:" + string_of_overflow(style[0]);
+        return "overflow:" + string_of_overflow(param[0]);
     case 38 : 
-        return "flex:" + Pervasives.string_of_int(style[0]);
+        return "flex:" + Pervasives.string_of_int(param[0]);
     case 39 : 
-        return "flex-grow:" + Pervasives.string_of_int(style[0]);
+        return "flex-grow:" + Pervasives.string_of_int(param[0]);
     case 40 : 
-        return "flex-shrink:" + Pervasives.string_of_int(style[0]);
+        return "flex-shrink:" + Pervasives.string_of_int(param[0]);
     case 41 : 
-        return "flex-basis:" + Pervasives.string_of_int(style[0]);
+        return "flex-basis:" + Pervasives.string_of_int(param[0]);
     case 42 : 
-        return "flex-basis:" + string_of_flexBasis(style[0]);
+        return "flex-basis:" + string_of_flexBasis(param[0]);
     case 43 : 
-        return "shadow-color:" + string_of_color(style[0]);
+        return "shadow-color:" + string_of_color(param[0]);
     case 44 : 
-        return "shadow-offset:" + (Pervasives.string_of_int(style[0]) + ("," + Pervasives.string_of_int(style[1])));
+        return "shadow-offset:" + (Pervasives.string_of_int(param[0]) + ("," + Pervasives.string_of_int(param[1])));
     case 45 : 
-        return "shadow-opacity:" + ("" + (String(style[0]) + ""));
+        return "shadow-opacity:" + ("" + (String(param[0]) + ""));
     case 46 : 
-        return "shadow-radius:" + ("" + (String(style[0]) + ""));
+        return "shadow-radius:" + ("" + (String(param[0]) + ""));
     case 47 : 
-        return "transform:" + $$String.concat(",", List.map(string_of_transform, style[0]));
+        return "transform:" + $$String.concat(",", List.map(string_of_transform, param[0]));
     case 48 : 
-        return "backface-visibilty:" + string_of_backfaceVisibilty(style[0]);
+        return "backface-visibilty:" + string_of_backfaceVisibilty(param[0]);
     case 49 : 
-        return "background-color:" + string_of_color(style[0]);
+        return "background-color:" + string_of_color(param[0]);
     case 50 : 
-        return "border-color:" + string_of_color(style[0]);
+        return "border-color:" + string_of_color(param[0]);
     case 51 : 
-        return "border-top-color:" + string_of_color(style[0]);
+        return "border-top-color:" + string_of_color(param[0]);
     case 52 : 
-        return "border-bottom-color:" + string_of_color(style[0]);
+        return "border-bottom-color:" + string_of_color(param[0]);
     case 53 : 
-        return "border-left-color:" + string_of_color(style[0]);
+        return "border-left-color:" + string_of_color(param[0]);
     case 54 : 
-        return "border-right-color:" + string_of_color(style[0]);
+        return "border-right-color:" + string_of_color(param[0]);
     case 55 : 
-        return "border-radius:" + string_of_dimension(style[0]);
+        return "border-radius:" + string_of_dimension(param[0]);
     case 56 : 
-        return "border-top-right-radius:" + string_of_dimension(style[0]);
+        return "border-top-right-radius:" + string_of_dimension(param[0]);
     case 57 : 
-        return "border-bottom-left-radius:" + string_of_dimension(style[0]);
+        return "border-bottom-left-radius:" + string_of_dimension(param[0]);
     case 58 : 
-        return "border-bottom-right-radius:" + string_of_dimension(style[0]);
+        return "border-bottom-right-radius:" + string_of_dimension(param[0]);
     case 59 : 
-        return "border-top-left-radius:" + string_of_dimension(style[0]);
+        return "border-top-left-radius:" + string_of_dimension(param[0]);
     case 60 : 
-        return "border-style:" + string_of_borderStyle(style[0]);
+        return "border-style:" + string_of_borderStyle(param[0]);
     case 61 : 
-        return "opacity:" + ("" + (String(style[0]) + ""));
+        return "opacity:" + ("" + (String(param[0]) + ""));
     case 62 : 
-        return "elevation:" + ("" + (String(style[0]) + ""));
+        return "elevation:" + ("" + (String(param[0]) + ""));
     case 63 : 
-        return "color:" + string_of_color(style[0]);
+        return "color:" + string_of_color(param[0]);
     case 64 : 
-        return "font-family:" + style[0];
+        return "font-family:" + param[0];
     case 65 : 
-        return "font-size:" + ("" + (String(style[0]) + ""));
+        return "font-size:" + ("" + (String(param[0]) + ""));
     case 66 : 
-        return "font-style:" + string_of_fontStyle(style[0]);
+        return "font-style:" + string_of_fontStyle(param[0]);
     case 67 : 
-        return "font-weight:" + string_of_fontWeight(style[0]);
+        return "font-weight:" + string_of_fontWeight(param[0]);
     case 68 : 
-        return "font-variant:" + string_of_fontVariant(style[0]);
+        return "font-variant:" + string_of_fontVariant(param[0]);
+    case 69 : 
+        return "text-shadow-radius:" + ("" + (String(param[0]) + ""));
     case 70 : 
-        return "text-shadow-radius:" + ("" + (String(style[0]) + ""));
+        return "text-shadow-color:" + string_of_color(param[0]);
     case 71 : 
-        return "text-shadow-color:" + string_of_color(style[0]);
+        return "letter-spacing:" + ("" + (String(param[0]) + ""));
     case 72 : 
-        return "letter-spacing:" + ("" + (String(style[0]) + ""));
+        return "line-height:" + ("" + (String(param[0]) + ""));
     case 73 : 
-        return "line-height:" + ("" + (String(style[0]) + ""));
+        return "text-align:" + string_of_textAlign(param[0]);
     case 74 : 
-        return "text-align:" + string_of_textAlign(style[0]);
+        return "text-align-vertical:" + string_of_textAlignVertical(param[0]);
     case 75 : 
-        return "text-align-vertical:" + string_of_textAlignVertical(style[0]);
+        return "includefontpadding:" + Pervasives.string_of_bool(param[0]);
     case 76 : 
-        return "includefontpadding:" + Pervasives.string_of_bool(style[0]);
+        return "text-decoration-line:" + string_of_textDecorationLine(param[0]);
     case 77 : 
-        return "text-decoration-line:" + string_of_textDecorationLine(style[0]);
+        return "text-decoration-color:" + string_of_color(param[0]);
     case 78 : 
-        return "text-decoration-color:" + string_of_color(style[0]);
+        return "writing-direction:" + string_of_writingDirection(param[0]);
     case 79 : 
-        return "writing-direction:" + string_of_writingDirection(style[0]);
+        return "resizemode:" + string_of_resizeMode(param[0]);
     case 80 : 
-        return "resizemode:" + string_of_resizeMode(style[0]);
+        return "tintcolor:" + string_of_color(param[0]);
     case 81 : 
-        return "tintcolor:" + string_of_color(style[0]);
-    case 82 : 
-        return "overlay-color" + string_of_color(style[0]);
+        return "overlay-color" + string_of_color(param[0]);
+    case 85 : 
+        return param[0] + ":unset";
     case 86 : 
-        return style[0] + (":" + style[1]);
+        return param[0] + ":initial";
+    case 87 : 
+        return param[0] + ":inherit";
+    case 88 : 
+        return param[0] + (":" + param[1]);
     default:
@@ -896,2 +926,4 @@ throw Caml_builtin_exceptions.not_found;
 
+var selectorTokenizer = (/[(),]|"(?:\\.|[^"\n])*"|'(?:\\.|[^'\n])*'|\/\*[\s\S]*?\*\//g);
+
 var splitSelector = (
@@ -989,3 +1021,3 @@ function(selector) {
                 switch (style.tag | 0) {
-                  case 83 : 
+                  case 82 : 
                       return List.concat(/* :: */[
@@ -1011,3 +1043,3 @@ acc,
                                 ]);
-                  case 84 : 
+                  case 83 : 
                       return List.concat(/* :: */[
@@ -1033,3 +1065,3 @@ acc,
                                 ]);
-                  case 85 : 
+                  case 84 : 
                       return List.concat(/* :: */[
@@ -1142,4 +1174,13 @@ acc,
 
-var injected = Hashtbl.create(/* None */0, 100);
+var global_cache = Hashtbl.create(/* None */0, 100);
 
+var injected_cache = Hashtbl.create(/* None */0, 100);
+
+var rule_cache = Hashtbl.create(/* None */0, 100);
+
+function flush() {
+  Hashtbl.reset(injected_cache);
+  return Hashtbl.reset(rule_cache);
+}
+
 var insertRule = (function(rule){
@@ -1156,3 +1197,3 @@ if(typeof window === "undefined"){
       if(process.env.NODE_ENV === 'production'){
-        tag.sheet.insertRule(rule, tag.sheet.cssRules.length);
+
       } else {
@@ -1163,14 +1204,8 @@ tag.appendChild(document.createTextNode(rule));
 
-function flush() {
-  return Hashtbl.reset(injected);
-}
+var alphabet = "0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ";
 
-function symbols(param) {
-  return Caml_string.get("0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ", param);
-}
-
 function base62_of_int($$int) {
   var fn = function (n, c) {
     if (n !== 0) {
-      return fn(n / 62 | 0, Char.escaped(symbols(n - Caml_int32.imul(62, n / 62 | 0) | 0))) + c;
+      return fn(n / 62 | 0, Char.escaped(Caml_string.get(alphabet, n - Caml_int32.imul(62, n / 62 | 0) | 0))) + c;
     } else {
@@ -1184,3 +1219,3 @@ return c;
 function insert(nodes, hash) {
-  if (Hashtbl.mem(injected, nodes)) {
+  if (Hashtbl.mem(injected_cache, hash)) {
     return 0;
@@ -1193,4 +1228,8 @@ } else {
                 }))(nodes));
-    List.map(insertRule, cssRules);
-    return Hashtbl.add(injected, nodes, /* true */1);
+    if (isBrowser && !isTest) {
+      List.map(insertRule, cssRules);
+    } else {
+      Hashtbl.add(rule_cache, hash, cssRules);
+    }
+    return Hashtbl.add(injected_cache, hash, /* true */1);
   }
@@ -1208,6 +1247,37 @@ }
   var flattened = group(walk(decls, blankScope));
-  insert(flattened, select);
-  return /* () */0;
+  var hash = ".raw-" + base62_of_int(Hashtbl.hash(flattened));
+  if (Hashtbl.mem(injected_cache, hash)) {
+    return 0;
+  } else {
+    var cssRules = List.map((function (param) {
+            return string_of_scope(param[0], select, $$String.concat(";", List.map(string_of_style, param[1])));
+          }), List.filter((function (param) {
+                  return +(param[1] !== /* [] */0);
+                }))(flattened));
+    if (isBrowser && !isTest) {
+      List.map(insertRule, cssRules);
+    } else {
+      Hashtbl.add(global_cache, hash, cssRules);
+    }
+    return Hashtbl.add(injected_cache, hash, /* true */1);
+  }
 }
 
+function raw(css) {
+  var hash = ".raw-" + base62_of_int(Hashtbl.hash(css));
+  if (Hashtbl.mem(injected_cache, hash)) {
+    return 0;
+  } else {
+    Hashtbl.add(injected_cache, hash, /* true */1);
+    if (isBrowser && !isTest) {
+      return Curry._1(insertRule, css);
+    } else {
+      return Hashtbl.add(global_cache, hash, /* :: */[
+                  css,
+                  /* [] */0
+                ]);
+    }
+  }
+}
+
 function keyframes() {
@@ -1230,3 +1300,6 @@ return /* () */0;
 function extract() {
-  return /* [] */0;
+  return /* record */[
+          /* css : [] */0,
+          /* ids : [] */0
+        ];
 }
@@ -1242,2 +1315,4 @@
 
+exports.isBrowser                     = isBrowser;
+exports.isTest                        = isTest;
 exports.string_of_position            = string_of_position;
@@ -1269,2 +1344,3 @@ exports.string_of_flexDirection       = string_of_flexDirection;
 exports.string_of_style               = string_of_style;
+exports.selectorTokenizer             = selectorTokenizer;
 exports.splitSelector                 = splitSelector;
@@ -1278,6 +1354,8 @@ exports.replace                       = replace;
 exports.flatten                       = flatten;
-exports.injected                      = injected;
+exports.global_cache                  = global_cache;
+exports.injected_cache                = injected_cache;
+exports.rule_cache                    = rule_cache;
+exports.flush                         = flush;
 exports.insertRule                    = insertRule;
-exports.flush                         = flush;
-exports.symbols                       = symbols;
+exports.alphabet                      = alphabet;
 exports.base62_of_int                 = base62_of_int;
@@ -1287,2 +1365,3 @@ exports.insert                        = insert;
 exports.$$global                      = $$global;
+exports.raw                           = raw;
 exports.keyframes                     = keyframes;
@@ -1294,2 +1373,2 @@ exports.animation                     = animation;
 exports.Presets                       = Presets;
-/* splitSelector Not a pure module */
+/* match Not a pure module */

package.json

 {
   "name": "bs-nice",
-  "version": "0.1.2",
+  "version": "0.1.3",
   "description": "css-in-reason",
@@ -10,3 +10,4 @@ "scripts": {
     "site": "parcel site/index.html",
-    "size": "rollup -c rollup.config.js | uglifyjs -mc | gzip | wc -c"
+    "size": "rollup -c rollup.config.js | google-closure-compiler-js | gzip | wc -c",
+    "test": "jest"
   },
@@ -25,2 +26,3 @@ "keywords": [
     "bs-platform": "2.1.0",
+    "google-closure-compiler-js": "^20180101.0.0",
     "parcel-bundler": "^1.2.1",
@@ -27,0 +29,0 @@ "rollup": "^0.54.0",

README.md

@@ -27,5 +27,5 @@ (work in progress)
 
+* vendor prefixing
 * keyframes / animations
 * font-faces
-* vendor prefixing
 * better types
@@ -32,0 +32,0 @@ * ~ hot reloading

No alert changes

Improved metrics

Total package byte prevSize

280627

increased by1.91%

Lines of code

2957

increased by2.28%

Worsened metrics

Dev dependency count

6

increased by20%

Number of package files

21

decreased by-12.5%

Number of low supply chain risk alerts

5

increased by66.67%

No dependency changes