fela - npm Package Compare versions

Comparing version 1.0.2 to 1.0.3

dist/fela.js

@@ -199,10 +199,23 @@ (function (global, factory) {
           if (!renderer.rendered.hasOwnProperty(className)) {
-            var style = renderer._processStyle(rule(props));
-            renderer._renderStyle(className, style, renderer.base[ruleId]);
+            var diffedStyle = renderer._diffStyle(rule(props), renderer.base[ruleId]);
 
-            renderer.rendered[className] = renderer._didChange;
+            if (Object.keys(diffedStyle).length > 0) {
+              var style = renderer._processStyle(diffedStyle, {
+                type: 'rule',
+                className: className,
+                id: ruleId,
+                props: props,
+                rule: rule
+              });
 
-            if (renderer._didChange) {
-              renderer._didChange = false;
-              renderer._emitChange();
+              renderer._renderStyle(className, style);
+
+              renderer.rendered[className] = renderer._didChange;
+
+              if (renderer._didChange) {
+                renderer._didChange = false;
+                renderer._emitChange();
+              }
+            } else {
+              renderer.rendered[className] = false;
             }
@@ -212,3 +225,3 @@
             if (className === 'c' + ruleId) {
-              renderer.base[ruleId] = style;
+              renderer.base[ruleId] = rule(props);
             }
@@ -249,3 +262,9 @@ }
           if (!renderer.rendered.hasOwnProperty(animationName)) {
-            var processedKeyframe = renderer._processStyle(keyframe(props));
+            var processedKeyframe = renderer._processStyle(keyframe(props), {
+              type: 'keyframe',
+              keyframe: keyframe,
+              props: props,
+              animationName: animationName,
+              id: renderer.ids.indexOf(keyframe)
+            });
             var css = cssifyKeyframe(processedKeyframe, animationName, renderer.keyframePrefixes);
@@ -312,3 +331,7 @@ renderer.rendered[animationName] = true;
             } else {
-              renderer.statics += selector + '{' + cssifyObject(renderer._processStyle(style)) + '}';
+              var processedStyle = renderer._processStyle(style, {
+                selector: selector,
+                type: 'static'
+              });
+              renderer.statics += selector + '{' + cssifyObject(processedStyle) + '}';
             }
@@ -384,7 +407,8 @@
          * @param {Object} style - style object to process
+         * @param {Object} meta - additional meta data
          * @return {Object} processed style
          */
-        _processStyle: function _processStyle(style) {
+        _processStyle: function _processStyle(style, meta) {
           return renderer.plugins.reduce(function (processedStyle, plugin) {
-            return plugin(processedStyle);
+            return plugin(processedStyle, meta);
           }, style);
@@ -395,2 +419,37 @@ },
         /**
+         * diffs a style object against a base style object
+         *
+         * @param {Object} style - style object which is diffed
+         * @param {Object?} base - base style object
+         */
+        _diffStyle: function _diffStyle(style) {
+          var _this = this;
+
+          var base = arguments.length <= 1 || arguments[1] === undefined ? {} : arguments[1];
+
+          return Object.keys(style).reduce(function (diff, property) {
+            var value = style[property];
+            // recursive object iteration in order to render
+            // pseudo class and media class declarations
+            if (value instanceof Object && !Array.isArray(value)) {
+              var nestedDiff = _this._diffStyle(value, base[property]);
+              if (Object.keys(nestedDiff).length > 0) {
+                diff[property] = nestedDiff;
+              }
+            } else {
+              // diff styles with the base styles to only extract dynamic styles
+              if (value !== undefined && !base.hasOwnProperty(property) || base[property] !== value) {
+                // remove concatenated string values including `undefined`
+                if (typeof value === 'string' && value.indexOf('undefined') > -1) {
+                  return diff;
+                }
+                diff[property] = value;
+              }
+            }
+            return diff;
+          }, {});
+        },
+
+
+        /**
          * iterates a style object and renders each rule to the cache
@@ -400,8 +459,6 @@ *
          * @param {Object} style - style object which is rendered
-         * @param {Object`} base - base style subset for diffing
          */
         _renderStyle: function _renderStyle(className, style) {
-          var base = arguments.length <= 2 || arguments[2] === undefined ? {} : arguments[2];
-          var pseudo = arguments.length <= 3 || arguments[3] === undefined ? '' : arguments[3];
-          var media = arguments.length <= 4 || arguments[4] === undefined ? '' : arguments[4];
+          var pseudo = arguments.length <= 2 || arguments[2] === undefined ? '' : arguments[2];
+          var media = arguments.length <= 3 || arguments[3] === undefined ? '' : arguments[3];
 
@@ -414,3 +471,3 @@ var ruleset = Object.keys(style).reduce(function (ruleset, property) {
               if (property.charAt(0) === ':') {
-                renderer._renderStyle(className, value, base[property], pseudo + property, media);
+                renderer._renderStyle(className, value, pseudo + property, media);
               } else if (property.substr(0, 6) === '@media') {
@@ -420,13 +477,6 @@ // combine media query rules with an `and`
                 var combinedMedia = media.length > 0 ? media + ' and ' + query : query;
-                renderer._renderStyle(className, value, base[property], pseudo, combinedMedia);
+                renderer._renderStyle(className, value, pseudo, combinedMedia);
               }
             } else {
-              // diff styles with the base styles to only extract dynamic styles
-              if (value !== undefined && !base.hasOwnProperty(property) || base[property] !== value) {
-                // remove concatenated string values including `undefined`
-                if (typeof value === 'string' && value.indexOf('undefined') > -1) {
-                  return ruleset;
-                }
-                ruleset[property] = value;
-              }
+              ruleset[property] = value;
             }
@@ -433,0 +483,0 @@ return ruleset;

dist/fela.min.js

@@ -1,1 +0,1 @@
-!function(e,r){"object"==typeof exports&&"undefined"!=typeof module?module.exports=r():"function"==typeof define&&define.amd?define(r):e.Fela=r()}(this,function(){"use strict";function e(e,r){return r={exports:{}},e(r,r.exports),r.exports}function r(e){var r=0,n=0,t=void 0,i=e.length;if(0===i)return"";for(;n<i;++n)t=e.charCodeAt(n),r=(r<<5)-r+t,r|=0;return"-"+r.toString(36)}function n(e){return Object.keys(e).sort().reduce(function(r,n){return r+n+e[n]},"")}function t(e){return Object.keys(l).reduce(function(r,n){return e.indexOf(n)>-1&&(r=l[n]),r},void 0)}function i(e){return Object.keys(e).reduce(function(r,n){return r.length>0&&(r+=";"),r+=p(n)+":"+e[n]},"")}function o(e,r){var n=arguments.length<=2||void 0===arguments[2]?[""]:arguments[2],t=Object.keys(e).reduce(function(r,n){return r+n+"{"+i(e[n])+"}"},"");return n.reduce(function(e,n){return e+"@"+n+"keyframes "+r+"{"+t+"}"},"")}function u(){var e=arguments.length<=0||void 0===arguments[0]?{}:arguments[0],u={listeners:[],keyframePrefixes:e.keyframePrefixes||["-webkit-","-moz-"],plugins:e.plugins||[],clear:function(){u.fontFaces="",u.keyframes="",u.statics="",u.rules="",u.mediaRules={},u.rendered={},u.base={},u.ids=[],u._emitChange()},renderRule:function(e){var r=arguments.length<=1||void 0===arguments[1]?{}:arguments[1];u.ids.indexOf(e)<0&&(u.ids.push(e),u.renderRule(e,{}));var n=u.ids.indexOf(e),t="c"+n+u._generatePropsReference(r);if(!u.rendered.hasOwnProperty(t)){var i=u._processStyle(e(r));u._renderStyle(t,i,u.base[n]),u.rendered[t]=u._didChange,u._didChange&&(u._didChange=!1,u._emitChange()),t==="c"+n&&(u.base[n]=i)}var o="c"+n;return u.rendered[t]?t!==o?o+" "+t:t:o},renderKeyframe:function(e){var r=arguments.length<=1||void 0===arguments[1]?{}:arguments[1];u.ids.indexOf(e)<0&&u.ids.push(e);var n=u._generatePropsReference(r),t="k"+u.ids.indexOf(e)+n;if(!u.rendered.hasOwnProperty(t)){var i=u._processStyle(e(r)),f=o(i,t,u.keyframePrefixes);u.rendered[t]=!0,u.keyframes+=f,u._emitChange()}return t},renderFont:function(e,r){var n=arguments.length<=2||void 0===arguments[2]?{}:arguments[2];return u.rendered.hasOwnProperty(e)||!function(){var o={fontFamily:"'"+e+"'",src:r.map(function(e){return"url('"+e+"') format('"+t(e)+"')"}).join(",")},f=["fontVariant","fontWeight","fontStretch","fontStyle","unicodeRange"];Object.keys(n).filter(function(e){return f.indexOf(e)>-1}).forEach(function(e){return o[e]=n[e]});var s="@font-face{"+i(o)+"}";u.rendered[e]=!0,u.fontFaces+=s,u._emitChange()}(),e},renderStatic:function(e,r){var t="string"==typeof e?e:r+n(e);u.rendered.hasOwnProperty(t)||("string"==typeof e?u.statics+=e.replace(/\s{2,}/g,""):u.statics+=r+"{"+i(u._processStyle(e))+"}",u.rendered[t]=!0,u._emitChange())},renderToString:function(){var e=u.fontFaces+u.statics+u.rules;for(var r in u.mediaRules)e+="@media "+r+"{"+u.mediaRules[r]+"}";return e+u.keyframes},subscribe:function(e){return u.listeners.push(e),{unsubscribe:function(){return u.listeners.splice(u.listeners.indexOf(e),1)}}},_emitChange:function(){var e=u.renderToString();u.listeners.forEach(function(r){return r(e)})},_generatePropsReference:function(e){return r(n(e))},_processStyle:function(e){return u.plugins.reduce(function(e,r){return r(e)},e)},_renderStyle:function(e,r){var n=arguments.length<=2||void 0===arguments[2]?{}:arguments[2],t=arguments.length<=3||void 0===arguments[3]?"":arguments[3],o=arguments.length<=4||void 0===arguments[4]?"":arguments[4],f=Object.keys(r).reduce(function(i,f){var s=r[f];if(s instanceof Object&&!Array.isArray(s)){if(":"===f.charAt(0))u._renderStyle(e,s,n[f],t+f,o);else if("@media"===f.substr(0,6)){var c=f.slice(6).trim(),a=o.length>0?o+" and "+c:c;u._renderStyle(e,s,n[f],t,a)}}else if(void 0!==s&&!n.hasOwnProperty(f)||n[f]!==s){if("string"==typeof s&&s.indexOf("undefined")>-1)return i;i[f]=s}return i},{});if(Object.keys(f).length>0){var s="."+e+t+"{"+i(f)+"}";u._didChange=!0,o.length>0?(u.mediaRules.hasOwnProperty(o)||(u.mediaRules[o]=""),u.mediaRules[o]+=s):u.rules+=s}}};return u.keyframePrefixes.push(""),u.clear(),u}function f(e){for(var r=arguments.length,n=Array(r>1?r-1:0),t=1;t<r;t++)n[t-1]=arguments[t];return n.reduce(function(e,r){for(var n in r){var t=r[n];e[n]instanceof Object&&t instanceof Object?e[n]=f({},e[n],t):e[n]=t}return e},e)}function s(){for(var e=arguments.length,r=Array(e),n=0;n<e;n++)r[n]=arguments[n];return function(e){return r.reduce(function(r,n){return f(r,n(e))},{})}}function c(){for(var e=arguments.length,r=Array(e),n=0;n<e;n++)r[n]=arguments[n];return function(e){return function(){return r.reduce(function(e,r){return r(e)},e.apply(void 0,arguments))}}}function a(e,r){if(!r||r.nodeType!==h)throw new Error("You need to specify a valid element node (nodeType = 1) to render into.");r.setAttribute("data-fela-stylesheet",""),e.subscribe(function(e){return r.textContent=e});var n=e.renderToString();r.textContent!==n&&(r.textContent=n)}var d={};d["typeof"]="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol?"symbol":typeof e},d["extends"]=Object.assign||function(e){for(var r=1;r<arguments.length;r++){var n=arguments[r];for(var t in n)Object.prototype.hasOwnProperty.call(n,t)&&(e[t]=n[t])}return e};var l={".woff":"woff",".eof":"eof",".ttf":"truetype",".svg":"svg"},y=e(function(e){function r(e){return e.replace(n,"-$&").toLowerCase().replace(t,"-ms-")}var n=/[A-Z]/g,t=/^ms-/;e.exports=r}),p=y&&"object"==typeof y&&"default"in y?y["default"]:y,h=1,v={createRenderer:u,combineRules:s,enhance:c,render:a};return v});
+!function(e,r){"object"==typeof exports&&"undefined"!=typeof module?module.exports=r():"function"==typeof define&&define.amd?define(r):e.Fela=r()}(this,function(){"use strict";function e(e,r){return r={exports:{}},e(r,r.exports),r.exports}function r(e){var r=0,n=0,t=void 0,i=e.length;if(0===i)return"";for(;n<i;++n)t=e.charCodeAt(n),r=(r<<5)-r+t,r|=0;return"-"+r.toString(36)}function n(e){return Object.keys(e).sort().reduce(function(r,n){return r+n+e[n]},"")}function t(e){return Object.keys(l).reduce(function(r,n){return e.indexOf(n)>-1&&(r=l[n]),r},void 0)}function i(e){return Object.keys(e).reduce(function(r,n){return r.length>0&&(r+=";"),r+=p(n)+":"+e[n]},"")}function o(e,r){var n=arguments.length<=2||void 0===arguments[2]?[""]:arguments[2],t=Object.keys(e).reduce(function(r,n){return r+n+"{"+i(e[n])+"}"},"");return n.reduce(function(e,n){return e+"@"+n+"keyframes "+r+"{"+t+"}"},"")}function f(){var e=arguments.length<=0||void 0===arguments[0]?{}:arguments[0],f={listeners:[],keyframePrefixes:e.keyframePrefixes||["-webkit-","-moz-"],plugins:e.plugins||[],clear:function(){f.fontFaces="",f.keyframes="",f.statics="",f.rules="",f.mediaRules={},f.rendered={},f.base={},f.ids=[],f._emitChange()},renderRule:function(e){var r=arguments.length<=1||void 0===arguments[1]?{}:arguments[1];f.ids.indexOf(e)<0&&(f.ids.push(e),f.renderRule(e,{}));var n=f.ids.indexOf(e),t="c"+n+f._generatePropsReference(r);if(!f.rendered.hasOwnProperty(t)){var i=f._diffStyle(e(r),f.base[n]);if(Object.keys(i).length>0){var o=f._processStyle(i,{type:"rule",className:t,id:n,props:r,rule:e});f._renderStyle(t,o),f.rendered[t]=f._didChange,f._didChange&&(f._didChange=!1,f._emitChange())}else f.rendered[t]=!1;t==="c"+n&&(f.base[n]=e(r))}var u="c"+n;return f.rendered[t]?t!==u?u+" "+t:t:u},renderKeyframe:function(e){var r=arguments.length<=1||void 0===arguments[1]?{}:arguments[1];f.ids.indexOf(e)<0&&f.ids.push(e);var n=f._generatePropsReference(r),t="k"+f.ids.indexOf(e)+n;if(!f.rendered.hasOwnProperty(t)){var i=f._processStyle(e(r),{type:"keyframe",keyframe:e,props:r,animationName:t,id:f.ids.indexOf(e)}),u=o(i,t,f.keyframePrefixes);f.rendered[t]=!0,f.keyframes+=u,f._emitChange()}return t},renderFont:function(e,r){var n=arguments.length<=2||void 0===arguments[2]?{}:arguments[2];return f.rendered.hasOwnProperty(e)||!function(){var o={fontFamily:"'"+e+"'",src:r.map(function(e){return"url('"+e+"') format('"+t(e)+"')"}).join(",")},u=["fontVariant","fontWeight","fontStretch","fontStyle","unicodeRange"];Object.keys(n).filter(function(e){return u.indexOf(e)>-1}).forEach(function(e){return o[e]=n[e]});var s="@font-face{"+i(o)+"}";f.rendered[e]=!0,f.fontFaces+=s,f._emitChange()}(),e},renderStatic:function(e,r){var t="string"==typeof e?e:r+n(e);if(!f.rendered.hasOwnProperty(t)){if("string"==typeof e)f.statics+=e.replace(/\s{2,}/g,"");else{var o=f._processStyle(e,{selector:r,type:"static"});f.statics+=r+"{"+i(o)+"}"}f.rendered[t]=!0,f._emitChange()}},renderToString:function(){var e=f.fontFaces+f.statics+f.rules;for(var r in f.mediaRules)e+="@media "+r+"{"+f.mediaRules[r]+"}";return e+f.keyframes},subscribe:function(e){return f.listeners.push(e),{unsubscribe:function(){return f.listeners.splice(f.listeners.indexOf(e),1)}}},_emitChange:function(){var e=f.renderToString();f.listeners.forEach(function(r){return r(e)})},_generatePropsReference:function(e){return r(n(e))},_processStyle:function(e,r){return f.plugins.reduce(function(e,n){return n(e,r)},e)},_diffStyle:function(e){var r=this,n=arguments.length<=1||void 0===arguments[1]?{}:arguments[1];return Object.keys(e).reduce(function(t,i){var o=e[i];if(o instanceof Object&&!Array.isArray(o)){var f=r._diffStyle(o,n[i]);Object.keys(f).length>0&&(t[i]=f)}else if(void 0!==o&&!n.hasOwnProperty(i)||n[i]!==o){if("string"==typeof o&&o.indexOf("undefined")>-1)return t;t[i]=o}return t},{})},_renderStyle:function(e,r){var n=arguments.length<=2||void 0===arguments[2]?"":arguments[2],t=arguments.length<=3||void 0===arguments[3]?"":arguments[3],o=Object.keys(r).reduce(function(i,o){var u=r[o];if(u instanceof Object&&!Array.isArray(u)){if(":"===o.charAt(0))f._renderStyle(e,u,n+o,t);else if("@media"===o.substr(0,6)){var s=o.slice(6).trim(),a=t.length>0?t+" and "+s:s;f._renderStyle(e,u,n,a)}}else i[o]=u;return i},{});if(Object.keys(o).length>0){var u="."+e+n+"{"+i(o)+"}";f._didChange=!0,t.length>0?(f.mediaRules.hasOwnProperty(t)||(f.mediaRules[t]=""),f.mediaRules[t]+=u):f.rules+=u}}};return f.keyframePrefixes.push(""),f.clear(),f}function u(e){for(var r=arguments.length,n=Array(r>1?r-1:0),t=1;t<r;t++)n[t-1]=arguments[t];return n.reduce(function(e,r){for(var n in r){var t=r[n];e[n]instanceof Object&&t instanceof Object?e[n]=u({},e[n],t):e[n]=t}return e},e)}function s(){for(var e=arguments.length,r=Array(e),n=0;n<e;n++)r[n]=arguments[n];return function(e){return r.reduce(function(r,n){return u(r,n(e))},{})}}function a(){for(var e=arguments.length,r=Array(e),n=0;n<e;n++)r[n]=arguments[n];return function(e){return function(){return r.reduce(function(e,r){return r(e)},e.apply(void 0,arguments))}}}function c(e,r){if(!r||r.nodeType!==v)throw new Error("You need to specify a valid element node (nodeType = 1) to render into.");r.setAttribute("data-fela-stylesheet",""),e.subscribe(function(e){return r.textContent=e});var n=e.renderToString();r.textContent!==n&&(r.textContent=n)}var d={};d["typeof"]="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol?"symbol":typeof e},d["extends"]=Object.assign||function(e){for(var r=1;r<arguments.length;r++){var n=arguments[r];for(var t in n)Object.prototype.hasOwnProperty.call(n,t)&&(e[t]=n[t])}return e};var l={".woff":"woff",".eof":"eof",".ttf":"truetype",".svg":"svg"},y=e(function(e){function r(e){return e.replace(n,"-$&").toLowerCase().replace(t,"-ms-")}var n=/[A-Z]/g,t=/^ms-/;e.exports=r}),p=y&&"object"==typeof y&&"default"in y?y["default"]:y,v=1,h={createRenderer:f,combineRules:s,enhance:a,render:c};return h});

lib/createRenderer.js

@@ -83,10 +83,23 @@ 'use strict';
       if (!renderer.rendered.hasOwnProperty(className)) {
-        var style = renderer._processStyle(rule(props));
-        renderer._renderStyle(className, style, renderer.base[ruleId]);
+        var diffedStyle = renderer._diffStyle(rule(props), renderer.base[ruleId]);
 
-        renderer.rendered[className] = renderer._didChange;
+        if (Object.keys(diffedStyle).length > 0) {
+          var style = renderer._processStyle(diffedStyle, {
+            type: 'rule',
+            className: className,
+            id: ruleId,
+            props: props,
+            rule: rule
+          });
 
-        if (renderer._didChange) {
-          renderer._didChange = false;
-          renderer._emitChange();
+          renderer._renderStyle(className, style);
+
+          renderer.rendered[className] = renderer._didChange;
+
+          if (renderer._didChange) {
+            renderer._didChange = false;
+            renderer._emitChange();
+          }
+        } else {
+          renderer.rendered[className] = false;
         }
@@ -96,3 +109,3 @@
         if (className === 'c' + ruleId) {
-          renderer.base[ruleId] = style;
+          renderer.base[ruleId] = rule(props);
         }
@@ -133,3 +146,9 @@ }
       if (!renderer.rendered.hasOwnProperty(animationName)) {
-        var processedKeyframe = renderer._processStyle(keyframe(props));
+        var processedKeyframe = renderer._processStyle(keyframe(props), {
+          type: 'keyframe',
+          keyframe: keyframe,
+          props: props,
+          animationName: animationName,
+          id: renderer.ids.indexOf(keyframe)
+        });
         var css = (0, _cssifyKeyframe2.default)(processedKeyframe, animationName, renderer.keyframePrefixes);
@@ -196,3 +215,7 @@ renderer.rendered[animationName] = true;
         } else {
-          renderer.statics += selector + '{' + (0, _cssifyObject2.default)(renderer._processStyle(style)) + '}';
+          var processedStyle = renderer._processStyle(style, {
+            selector: selector,
+            type: 'static'
+          });
+          renderer.statics += selector + '{' + (0, _cssifyObject2.default)(processedStyle) + '}';
         }
@@ -268,7 +291,8 @@
      * @param {Object} style - style object to process
+     * @param {Object} meta - additional meta data
      * @return {Object} processed style
      */
-    _processStyle: function _processStyle(style) {
+    _processStyle: function _processStyle(style, meta) {
       return renderer.plugins.reduce(function (processedStyle, plugin) {
-        return plugin(processedStyle);
+        return plugin(processedStyle, meta);
       }, style);
@@ -279,2 +303,37 @@ },
     /**
+     * diffs a style object against a base style object
+     *
+     * @param {Object} style - style object which is diffed
+     * @param {Object?} base - base style object
+     */
+    _diffStyle: function _diffStyle(style) {
+      var _this = this;
+
+      var base = arguments.length <= 1 || arguments[1] === undefined ? {} : arguments[1];
+
+      return Object.keys(style).reduce(function (diff, property) {
+        var value = style[property];
+        // recursive object iteration in order to render
+        // pseudo class and media class declarations
+        if (value instanceof Object && !Array.isArray(value)) {
+          var nestedDiff = _this._diffStyle(value, base[property]);
+          if (Object.keys(nestedDiff).length > 0) {
+            diff[property] = nestedDiff;
+          }
+        } else {
+          // diff styles with the base styles to only extract dynamic styles
+          if (value !== undefined && !base.hasOwnProperty(property) || base[property] !== value) {
+            // remove concatenated string values including `undefined`
+            if (typeof value === 'string' && value.indexOf('undefined') > -1) {
+              return diff;
+            }
+            diff[property] = value;
+          }
+        }
+        return diff;
+      }, {});
+    },
+
+
+    /**
      * iterates a style object and renders each rule to the cache
@@ -284,8 +343,6 @@ *
      * @param {Object} style - style object which is rendered
-     * @param {Object`} base - base style subset for diffing
      */
     _renderStyle: function _renderStyle(className, style) {
-      var base = arguments.length <= 2 || arguments[2] === undefined ? {} : arguments[2];
-      var pseudo = arguments.length <= 3 || arguments[3] === undefined ? '' : arguments[3];
-      var media = arguments.length <= 4 || arguments[4] === undefined ? '' : arguments[4];
+      var pseudo = arguments.length <= 2 || arguments[2] === undefined ? '' : arguments[2];
+      var media = arguments.length <= 3 || arguments[3] === undefined ? '' : arguments[3];
 
@@ -298,3 +355,3 @@ var ruleset = Object.keys(style).reduce(function (ruleset, property) {
           if (property.charAt(0) === ':') {
-            renderer._renderStyle(className, value, base[property], pseudo + property, media);
+            renderer._renderStyle(className, value, pseudo + property, media);
           } else if (property.substr(0, 6) === '@media') {
@@ -304,13 +361,6 @@ // combine media query rules with an `and`
             var combinedMedia = media.length > 0 ? media + ' and ' + query : query;
-            renderer._renderStyle(className, value, base[property], pseudo, combinedMedia);
+            renderer._renderStyle(className, value, pseudo, combinedMedia);
           }
         } else {
-          // diff styles with the base styles to only extract dynamic styles
-          if (value !== undefined && !base.hasOwnProperty(property) || base[property] !== value) {
-            // remove concatenated string values including `undefined`
-            if (typeof value === 'string' && value.indexOf('undefined') > -1) {
-              return ruleset;
-            }
-            ruleset[property] = value;
-          }
+          ruleset[property] = value;
         }
@@ -317,0 +367,0 @@ return ruleset;

lib/plugins/logger.js

@@ -1,2 +0,2 @@
-"use strict";
+'use strict';
 
@@ -7,5 +7,22 @@ Object.defineProperty(exports, "__esModule", {
 
+var _assign = require('../utils/assign');
+
+var _assign2 = _interopRequireDefault(_assign);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 exports.default = function () {
-  return function (style) {
-    console.log(style); // eslint-disable-line
+  var options = arguments.length <= 0 || arguments[0] === undefined ? {} : arguments[0];
+  return function (style, meta) {
+    var logMetaData = options.logMetaData || false;
+
+    var currentStyle = (0, _assign2.default)({}, style);
+
+    if (logMetaData) {
+      var reference = meta.className || meta.selector || meta.animationName;
+      console.log(meta.type.toUpperCase() + ' ' + reference, currentStyle, meta); // eslint-disable-line
+    } else {
+      console.log(currentStyle); // eslint-disable-line
+    }
+
     return style;
@@ -15,2 +32,2 @@ };
 
-module.exports = exports["default"];
+module.exports = exports['default'];

lib/plugins/prefixer.js

@@ -7,5 +7,5 @@ 'use strict';
 
-var _inlineStylePrefixAll = require('inline-style-prefix-all');
+var _static = require('inline-style-prefixer/static');
 
-var _inlineStylePrefixAll2 = _interopRequireDefault(_inlineStylePrefixAll);
+var _static2 = _interopRequireDefault(_static);
 
@@ -16,3 +16,3 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
   return function (style) {
-    return (0, _inlineStylePrefixAll2.default)(style);
+    return (0, _static2.default)(style);
   };
@@ -19,0 +19,0 @@ };

package.json

 {
   "name": "fela",
-  "version": "1.0.2",
-  "description": "Fast, tiny & dynamic low-level API to handle Styling in JavaScript",
+  "version": "1.0.3",
+  "description": "Fast & Dynamic Styling in JavaScript",
   "main": "index.js",
@@ -23,3 +23,3 @@ "files": [
   "dependencies": {
-    "hyphenate-style-name": "^1.0.1"
+    "hyphenate-style-name": "1.0.1"
   },
@@ -26,0 +26,0 @@ "author": "Robin Frischmann",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

92294

increased by10.65%

Number of package files

31

increased by3.33%

Lines of code

1330

increased by7.61%

Dependency changes

• + Addedhyphenate-style-name@1.0.1(transitive)

• - Removedhyphenate-style-name@1.1.0(transitive)

• Updatedhyphenate-style-name@1.0.1