stylis - npm Package Compare versions

Comparing version 0.6.1 to 0.6.2

package.json

@@ -5,3 +5,3 @@ {
 	"description": "stylis is a small css compiler",
-	"version": "0.6.1",
+	"version": "0.6.2",
 	"homepage": "https://github.com/thysultan/stylis.js",
@@ -8,0 +8,0 @@ "license": "MIT",

README.md

@@ -163,3 +163,3 @@ # Stylis
 ```html
-<script src=https://unpkg.com/stylis@0.6.1/stylis.min.js></script>
+<script src=https://unpkg.com/stylis@0.6.2/stylis.min.js></script>
 ```
@@ -166,0 +166,0 @@

stylis.js

@@ -32,6 +32,3 @@ /*!
 
-    // css selectors
-    var selectors = { '>': 1, '.': 1, '#': 1, '~': 1, '+': 1, '*': 1, ':': 1, '[': 2 };
 
-
     /**
@@ -49,19 +46,15 @@ * css compiler
     function stylis (selector, styles, namespaceAnimations, namespaceKeyframes) {
-        var sel = selector[0];
-        var type = selectors[sel];
+        var prefix = '';
+        var id = '';
+        var type = selector.charCodeAt(0);
 
-        var prefix;
-        var id;
-
-        // `>` or `.` or `#` or `:` or `~`
-        if (type === 1) {
-            prefix = selector;
-            id = selector.substring(1);
-        }
-        // `[` 
-        else if (type === 2) {
+        // [
+        if (type === 91) {
             var attr = selector.substring(1, selector.length-1).split('=');
-
             prefix = '['+ attr[0] + '=' + (id = attr[1]) +']';
         }
+        // `>` or `#` or `.`
+        else if (type === 62 || type === 35 || type === 46) {
+            id = (prefix = selector).substring(1);
+        }
         // i.e section 
@@ -78,4 +71,5 @@ else {
 
-        var len = styles.length;
-        var i = 0;
+        var len  = styles.length;
+        var i    = 0;
+        var flat = true;
 
@@ -89,9 +83,7 @@ // parse + compile
                 line += styles[i];
-
+                
                 var first = line.charCodeAt(0);
 
                 // only trim when the first character is ` `
-                if (first === 32) {
-                    first = (line = line.trim()).charCodeAt(0);
-                }
+                if (first === 32) { first = (line = line.trim()).charCodeAt(0); }
 
@@ -104,2 +96,5 @@ // / character, line comment
                 else if (first === 64) {
+                    // exit flat context
+                    if (flat) { flat = false; }
+
                     var second = line.charCodeAt(1) || 0;
@@ -203,41 +198,53 @@
                     }
+                    // selector declaration
+                    else if (code === 123) {
+                        // exit flat css context after with the first block context
+                        if (flat) {
+                            flat = false;
 
-                    else {
-                        // selector declaration
-                        if (code === 123) {
-                            var split = line.split(',');
-                            var _line = '';
+                            if (output.length !== 0) {
+                                output = prefix + '{' + output + '}';
+                            }
+                        }
 
-                            // iterate through characters and prefix multiple selectors with namesapces
-                            // i.e h1, h2, h3 --> [namespace] h1, [namespace] h1, ....
-                            for (var j = 0, length = split.length; j < length; j++) {
-                                var selector = split[j];
-                                var _first = selector.charCodeAt(0);
-                                var affix = '';
+                        var split = line.split(',');
+                        var _line = '';
 
-                                // first selector
-                                if (j === 0) {
-                                    // :, &, { characters
-                                    if (_first === 58 || _first === 38 || _first === 123) {
-                                        affix = prefix;
-                                    } else {
-                                        affix = prefix + ' ';
-                                    }
-                                } else {
-                                    affix = ',' + prefix;
-                                }
+                        // iterate through characters and prefix multiple selectors with namesapces
+                        // i.e h1, h2, h3 --> [namespace] h1, [namespace] h1, ....
+                        for (var j = 0, length = split.length; j < length; j++) {
+                            var selector = split[j];
+                            var _first = selector.charCodeAt(0);
+                            var affix = '';
 
-                                if (_first === 123) {
-                                    // { character
-                                    _line += affix + selector;
-                                } else if (_first === 38) {
-                                    // & character
-                                    _line += affix + selector.substring(1);
+                            // trim if first character is a space
+                            if (_first === 32) {
+                                _first = (selector = selector.trim()).charCodeAt(0);
+                            }
+
+
+                            // first selector
+                            if (j === 0) {
+                                // :, &, { characters
+                                if (_first === 58 || _first === 38 || _first === 123) {
+                                    affix = prefix;
                                 } else {
-                                    _line += affix + selector;
+                                    affix = prefix + ' ';
                                 }
+                            } else {
+                                affix = ',' + prefix + (_first !== 32 && first !== 38 ? ' ' : '');
                             }
 
-                            line = _line;
+                            if (_first === 123) {
+                                // { character
+                                _line += affix + selector;
+                            } else if (_first === 38) {
+                                // & character
+                                _line += affix + selector.substring(1);
+                            } else {
+                                _line += affix + selector;
+                            }
                         }
+
+                        line = _line;
                     }
@@ -258,3 +265,3 @@ }
 
-        return output;
+        return flat && output.length !== 0 ? prefix+'{'+output+'}' : output;
     }
@@ -261,0 +268,0 @@

stylis.min.js

@@ -1,1 +0,1 @@
-!function(e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e(global):"function"==typeof define&&define.amd?define(e(window)):window.stylis=e(window)}(function(e){"use strict";function i(e,i,f,l){var n,d,c=e[0],p=s[c];if(1===p)n=e,d=e.substring(1);else if(2===p){var b=e.substring(1,e.length-1).split("=");n="["+b[0]+"="+(d=b[1])+"]"}else d=n=e;for(var u="",v="",m=void 0===f||f===!0?d:"",g=void 0===l||l===!0?d:"",w=i.length,h=0;h<w;){var k=i.charCodeAt(h);if(123===k||125===k||59===k){v+=i[h];var A=v.charCodeAt(0);if(32===A&&(A=(v=v.trim()).charCodeAt(0)),47===A)v=125===k?"}":"";else if(64===A){var C=v.charCodeAt(1)||0;if(107===C||114===C){h++,v=107==C?v.substring(1,11)+m+v.substring(11):"";for(var $=0;h<w;){var y=i[h++],x=y.charCodeAt(0);if(9!==x&&13!==x&&10!==x){if(125===x){if(1===$)break;$=1}else 123===x&&($=0);v+=y}}v=v.replace(o,"").replace(t,"-webkit-$1-moz-$1-ms-$1$1"),v=107===C?"@-webkit-"+v+"}@-moz-"+v+"}@"+v+"}":v.replace(r,"@-webkit-$1}@-moz-$1}@$1}")}}else{var C=v.charCodeAt(1)||0,z=v.charCodeAt(2)||0;if(97===A&&110===C&&105===z){var j=v.replace(a,"$1").split(":");v=j[0]+":"+g+j[1].split(",").join(","+g),v="-webkit-"+v+"-moz-"+v+v}else if(97===A&&112===C&&112===z||102===A&&108===C&&101===z||111===A&&114===C&&100===z)v="-webkit-"+v+"-moz-"+v+v;else if(116===A&&114===C&&97===z||104===A&&121===C&&112===z||117===A&&115===C&&101===z&&115===v.charCodeAt(5))v="-webkit-"+v+"-moz-"+v+"-ms-"+v+v;else if(100===A&&105===C&&115===z)v.indexOf("flex")>-1&&(v="display:-webkit-flex; display:flex;");else if(123===k){for(var j=v.split(","),O="",q=0,B=j.length;q<B;q++){var e=j[q],D=e.charCodeAt(0),E="";E=0===q?58===D||38===D||123===D?n:n+" ":","+n,O+=123===D?E+e:38===D?E+e.substring(1):E+e}v=O}}u+=v,v=""}else 9!==k&&13!==k&&10!==k&&(v+=i[h]);h++}return u}var r=/@(keyframes +.*?}$)/g,t=/((?:transform|appearance):.*?;)/g,o=/  +/g,a=/(,|:) +/g,s={">":1,".":1,"#":1,"~":1,"+":1,"*":1,":":1,"[":2};return i});
+!function(e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e(global):"function"==typeof define&&define.amd?define(e(window)):window.stylis=e(window)}(function(e){"use strict";function i(e,i,s,f){var l="",n="",d=e.charCodeAt(0);if(91===d){var c=e.substring(1,e.length-1).split("=");l="["+c[0]+"="+(n=c[1])+"]"}else n=62===d||35===d||46===d?(l=e).substring(1):l=e;for(var p="",h="",b=void 0===s||s===!0?n:"",g=void 0===f||f===!0?n:"",m=i.length,u=0,v=!0;u<m;){var w=i.charCodeAt(u);if(123===w||125===w||59===w){h+=i[u];var A=h.charCodeAt(0);if(32===A&&(A=(h=h.trim()).charCodeAt(0)),47===A)h=125===w?"}":"";else if(64===A){v&&(v=!1);var C=h.charCodeAt(1)||0;if(107===C||114===C){u++,h=107==C?h.substring(1,11)+b+h.substring(11):"";for(var k=0;u<m;){var $=i[u++],y=$.charCodeAt(0);if(9!==y&&13!==y&&10!==y){if(125===y){if(1===k)break;k=1}else 123===y&&(k=0);h+=$}}h=h.replace(o,"").replace(t,"-webkit-$1-moz-$1-ms-$1$1"),h=107===C?"@-webkit-"+h+"}@-moz-"+h+"}@"+h+"}":h.replace(r,"@-webkit-$1}@-moz-$1}@$1}")}}else{var C=h.charCodeAt(1)||0,x=h.charCodeAt(2)||0;if(97===A&&110===C&&105===x){var z=h.replace(a,"$1").split(":");h=z[0]+":"+g+z[1].split(",").join(","+g),h="-webkit-"+h+"-moz-"+h+h}else if(97===A&&112===C&&112===x||102===A&&108===C&&101===x||111===A&&114===C&&100===x)h="-webkit-"+h+"-moz-"+h+h;else if(116===A&&114===C&&97===x||104===A&&121===C&&112===x||117===A&&115===C&&101===x&&115===h.charCodeAt(5))h="-webkit-"+h+"-moz-"+h+"-ms-"+h+h;else if(100===A&&105===C&&115===x)h.indexOf("flex")>-1&&(h="display:-webkit-flex; display:flex;");else if(123===w){v&&(v=!1,0!==p.length&&(p=l+"{"+p+"}"));for(var z=h.split(","),j="",O=0,q=z.length;O<q;O++){var e=z[O],B=e.charCodeAt(0),D="";32===B&&(B=(e=e.trim()).charCodeAt(0)),D=0===O?58===B||38===B||123===B?l:l+" ":","+l+(32!==B&&38!==A?" ":""),j+=123===B?D+e:38===B?D+e.substring(1):D+e}h=j}}p+=h,h=""}else 9!==w&&13!==w&&10!==w&&(h+=i[u]);u++}return v&&0!==p.length?l+"{"+p+"}":p}var r=/@(keyframes +.*?}$)/g,t=/((?:transform|appearance):.*?;)/g,o=/  +/g,a=/(,|:) +/g;return i});

No alert changes

Improved metrics

Total package byte prevSize

19532

increased by3.06%

Lines of code

225

increased by2.74%

No dependency changes