bss - npm Package Compare versions

Comparing version 1.1.8 to 1.1.9

bss.js

@@ -41,9 +41,9 @@ (function (global, factory) {
   w  : 'width'
-}
+};
 
 var shorts = Object.create(null);
 
-var cssProperties = Object.keys(
+var cssProperties = ['float'].concat(Object.keys(
   findWidth(document.documentElement.style)
-).filter(function (p) { return p.indexOf('-') === -1 && p !== 'length'; });
+).filter(function (p) { return p.indexOf('-') === -1 && p !== 'length'; }));
 
@@ -66,5 +66,5 @@ function findWidth(obj) {
   var last = ''
-    , prev;;
+    , prev;
 
-  return string.replace(/;/g, '\n').split('\n').reduce(function (acc, line) {
+  return string.trim().replace(/;/g, '\n').split('\n').reduce(function (acc, line) {
     line = last + line.trim();
@@ -84,4 +84,3 @@ last = line.slice(-1) === ',' ? line : '';
       prev = shorts[key] || key;
-
-      acc[prev] = tokens.filter(function (a) { return a; }).reduce(function (acc, t) { return acc + addPx(prev, t.trim()) + ' '; }, '').trim();
+      add(acc, prev, tokens.filter(function (a) { return a; }).reduce(function (acc, t) { return acc + addPx(prev, t.trim()) + ' '; }, '').trim());
     }
@@ -92,2 +91,12 @@ return acc
 
+function add(style, prop, value) {
+  if (!(prop in style))
+    { return style[prop] = value }
+
+  if (!style._fallback)
+    { Object.defineProperty(style, '_fallback', { configurable: true, value: Object.create(null, {}) }); }
+
+  add(style._fallback, prop, value);
+}
+
 var vendorMap = Object.create(null, {});
@@ -149,2 +158,8 @@ var vendorValuePrefix = Object.create(null, {});
 function assign(obj, obj2) {
+  if (obj2._fallback) {
+    obj._fallback
+      ? assign(obj._fallback, obj2._fallback)
+      : Object.defineProperty(obj, '_fallback', { value: obj2._fallback });
+  }
+
   for (var key in obj2) {
@@ -172,3 +187,3 @@ if (obj2.hasOwnProperty(key))
   var acronym = initials(prop)
-      , short = popular[acronym] && popular[acronym] !== prop ? prop : acronym;;
+      , short = popular[acronym] && popular[acronym] !== prop ? prop : acronym;
 
@@ -179,15 +194,18 @@ shorts[short] = prop;
 
-function objectToRules(style) {
-  var base = {}
-      , rules = [];;
 
-  var hasBase = false;
 
-  Object.keys(style).forEach(function (key) {
-    if (key.charAt(0) === '@') {
-      rules.push(key + '{' + objectToRules(style[key]) + '}');
-    } else if (key.charAt(0) === ' ' || key.charAt(0) === ':') {
-      rules.push(selectorBlock('.$' + key, style[key]));
+function objectToRules(style, prefix) {
+  if ( prefix === void 0 ) prefix = '';
+
+  var hasBase = false
+    , rules = [];
+
+  Object.keys(style).forEach(function (prop) {
+    if (prop.charAt(0) === '@') {
+      rules.push(prop + '{' + objectToRules(style[prop]) + '}');
+      delete style[prop];
+    } else if (typeof style[prop] === 'object') {
+      rules = rules.concat(objectToRules(style[prop], prefix + prop));
+      delete style[prop];
     } else {
-      base[key] = style[key];
       hasBase = true;
@@ -198,3 +216,3 @@ }
   if (hasBase)
-    { rules.unshift(selectorBlock('.$', base)); }
+    { rules.unshift(selectorBlock('.$' + prefix, style)); }
 
@@ -211,8 +229,11 @@ return rules
 function stylesToCss(style) {
-  return Object.keys(style).reduce(function (acc, k) { return acc + propToString(style, k); }, '')
+  return Object.keys(style).reduce(function (acc, prop) { return acc + propToString(prop, style[prop]); }
+  , '') + (style._fallback ? stylesToCss(style._fallback) : '')
 }
 
-function propToString(style, k) {
-  return (vendorRegex.test(k) ? '-' : '')
-  + camelCaseToHyphen(k) + ':' + style[k] + ';'
+
+
+function propToString(prop, value) {
+  return (vendorRegex.test(prop) ? '-' : '')
+  + camelCaseToHyphen(prop) + ':' + value + ';'
 }
@@ -231,3 +252,2 @@
 var document$1 = window.document;
-var classes = Object.create(null, {});
 var styleSheet = document$1 && document$1.createElement('style');
@@ -238,4 +258,5 @@ styleSheet && document$1.head.appendChild(styleSheet);
 var debug = false;
+var classes = Object.create(null, {});
 var rules = [];
-var count = 0;
+var count$1 = 0;
 
@@ -252,2 +273,3 @@ var classPrefix = 'b' + ('000' + ((Math.random() * 46656) | 0).toString(36)).slice(-3) +
   rules = [];
+  classes = Object.create(null, {});
   return content
@@ -275,3 +297,3 @@ }
   var rules = objectToRules(style)
-      , className = classPrefix + (++count);;
+      , className = classPrefix + (++count$1);
 
@@ -286,6 +308,6 @@ for(var i = 0; i < rules.length; i++)
 
-var count$1 = 0;
+var count = 0;
 var keyframeCache = {};
 
-function keyframes(props) {
+var keyframes = function(props) {
   var content = Object.keys(props).reduce(function (acc, key) { return acc + selectorBlock(key, props[key].style || props[key]); }
@@ -297,3 +319,3 @@ , '');
 
-  var name = classPrefix + ++count$1;
+  var name = classPrefix + ++count;
   keyframeCache[content] = name;
@@ -303,3 +325,3 @@ insert('@keyframes ' + name + '{' + content + '}');
   return name
-}
+};
 
@@ -361,3 +383,3 @@ var pseudos = [
   'grammar-error'
-]
+];
 
@@ -443,3 +465,3 @@ function bss(input, value) {
   if (value)
-    { this.style['@media ' + value] = parse(style); }
+    { add(this.style, '@media ' + value, parse(style)); }
 
@@ -451,3 +473,3 @@ return chain(this)
   if (value)
-    { this.style[(value.charAt(0) === ':' ? '' : ' ') + value] = parse(style); }
+    { add(this.style, (value.charAt(0) === ':' ? '' : ' ') + value, parse(style)); }
 
@@ -459,3 +481,3 @@ return chain(this)
     if (value || b)
-      { this.style[':' + name + (b ? '(' + value + ')' : '')] = parse(b || value); }
+      { add(this.style, ':' + name + (b ? '(' + value + ')' : ''), parse(b || value)); }
     return chain(this)
@@ -470,5 +492,6 @@ }); }
     } else if (arguments.length > 0) {
-      this.style[prop] = arguments.length === 1
+      add(this.style, prop, arguments.length === 1
         ? formatValue(prop, value)
-        : Array.prototype.slice.call(arguments).map(function (v) { return addPx(prop, v); }).join(' ');
+        : Array.prototype.slice.call(arguments).map(function (v) { return addPx(prop, v); }).join(' ')
+      );
     }
@@ -475,0 +498,0 @@

bss.min.js

@@ -1,2 +0,2 @@
-!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):t.b=e()}(this,function(){"use strict";var t={ai:"alignItems",b:"bottom",bc:"backgroundColor",br:"borderRadius",bs:"boxShadow",c:"color",d:"display",f:"float",fd:"flexDirection",ff:"fontFamily",fs:"fontSize",h:"height",jc:"justifyContent",l:"left",lh:"lineHeight",ls:"letterSpacing",m:"margin",mb:"marginBottom",ml:"marginLeft",mr:"marginRight",mt:"marginTop",o:"opacity",p:"padding",pb:"paddingBottom",pl:"paddingLeft",pr:"paddingRight",pt:"paddingTop",r:"right",t:"top",ta:"textAlign",td:"textDecoration",tt:"textTransform",w:"width"},e=Object.create(null),n=Object.keys(function t(e){return e.hasOwnProperty("width")?e:t(Object.getPrototypeOf(e))}(document.documentElement.style)).filter(function(t){return-1===t.indexOf("-")&&"length"!==t});var r=function(t,e){return void 0===e&&(e={}),function(n){return n in e?e[n]:e[n]=t(n)}},i=r(function(t){var n,r="";return t.replace(/;/g,"\n").split("\n").reduce(function(t,i){if(i=r+i.trim(),r=","===i.slice(-1)?i:"")return t;if(","===i.charAt(0))return t[n]+=i,t;var o=i.split(/[:\s]/);if(o.length>1){var c=s(o.shift().trim());t[n=e[c]||c]=o.filter(function(t){return t}).reduce(function(t,e){return t+y(n,e.trim())+" "},"").trim()}return t},{})}),o=Object.create(null,{}),c=Object.create(null,{}),a=/^(o|O|ms|MS|Ms|moz|Moz|webkit|Webkit|WebKit)([A-Z])/;function u(t,e){var n,r;return"string"==typeof t?"string"==typeof e||"number"==typeof e?((n={})[t]=e,n):i(t):Array.isArray(t)&&Array.isArray(t.raw)?(arguments[0]={raw:t},i(String.raw.apply(null,arguments))):t.style||(r=t,Object.keys(r).reduce(function(t,e){var n=r[e];return n||0===n||""===n?("content"===e&&'"'!==n.charAt(0)?t[e]='"'+n+'"':t[e in o?o[e]:e]=p(e,n),t):t},{}))}var l=r(function(t){var e=document.createElement("div");try{return e.style[t]="1px",e.style.setProperty(t,"1px"),"1px"===e.style[t].slice(-3)?"px":""}catch(t){return""}},{flex:""});function f(t,e){for(var n in e)e.hasOwnProperty(n)&&(t[n]=e[n])}function s(t){return t.slice("-"===t.charAt(0)?1:0).replace(/-([a-z])/g,function(t){return t[1].toUpperCase()})}function h(n){var r,i=(r=n).charAt(0)+(r.match(/([A-Z])/g)||[]).join("").toLowerCase(),o=t[i]&&t[i]!==n?n:i;return e[o]=n,o}function d(t,e){return t+"{"+function(t){return Object.keys(t).reduce(function(e,n){return e+function(t,e){return(a.test(e)?"-":"")+(n=e,n.replace(/([A-Z])/g,"-$1").toLowerCase())+":"+t[e]+";";var n}(t,n)},"")}("string"==typeof e?i(e):e)+"}"}function p(t,e){return e in c?c[e]:y(t,e)}function y(t,e){return e+(isNaN(e)?"":l(t))}var g=window.document,m=Object.create(null,{}),b=g&&g.createElement("style");b&&g.head.appendChild(b);var v=b&&b.sheet,j=!1,O=[],x=0,w="b"+("000"+(46656*Math.random()|0).toString(36)).slice(-3)+("000"+(46656*Math.random()|0).toString(36)).slice(-3);function A(t,e){if(O.push(t),j)return b.textContent=O.join("\n");v&&v.insertRule(t,arguments.length>1?e:v.cssRules.length)}function k(t){var e=JSON.stringify(t);if(e in m)return m[e];for(var n=function t(e){var n={},r=[],i=!1;return Object.keys(e).forEach(function(o){"@"===o.charAt(0)?r.push(o+"{"+t(e[o])+"}"):" "===o.charAt(0)||":"===o.charAt(0)?r.push(d(".$"+o,e[o])):(n[o]=e[o],i=!0)}),i&&r.unshift(d(".$",n)),r}(t),r=w+ ++x,i=0;i<n.length;i++)A(n[i].replace(/\.\$/,"."+r));return m[e]=r,r}var $=0,P={};function C(t,e){return f(C.style,u.apply(null,arguments)),E(C)}function S(t,e){Object.defineProperty(C,t,{configurable:!0,value:e})}function E(t){var e=Object.create(C,{style:{value:t.style,enumerable:!0}});return t===C&&(C.style={}),e}function L(t){return function(e){return e||0===e?arguments.length>0&&(this.style[t]=1===arguments.length?p(t,e):Array.prototype.slice.call(arguments).map(function(e){return y(t,e)}).join(" ")):delete this.style[t],E(this)}}return Object.defineProperty(C,"valueOf",{configurable:!0,writable:!0,value:function(){return"."+this.class}}),C.style={},S("setDebug",function(t){j=t}),S("$keyframes",function(t){var e=Object.keys(t).reduce(function(e,n){return e+d(n,t[n].style||t[n])},"");if(e in P)return P[e];var n=w+ ++$;return P[e]=n,A("@keyframes "+n+"{"+e+"}"),n}),S("getSheet",function(){var t=O.join("");return O=[],t}),S("helper",function t(e,n){if(1===arguments.length)return Object.keys(e).forEach(function(n){return t(n,e[n])});delete C[e];"object"==typeof n?Object.defineProperty(C,e,{configurable:!0,get:function(){return f(this.style,u(n)),E(this)}}):Object.defineProperty(C,e,{configurable:!0,value:function(){var t=n.apply(null,arguments);return f(this.style,t.style),E(this)}})}),S("css",function t(e,n){if(1===arguments.length)return Object.keys(e).forEach(function(n){return t(n,e[n])});A(d(e,u(n)),0)}),S("classPrefix",w),n.forEach(function(t){var e,r=t.match(a);if(r){var i=(e=t.replace(a,"$2")).charAt(0).toLowerCase()+e.slice(1);if(-1===n.indexOf(i))return"flexDirection"===i&&(c.flex="-"+r[1].toLowerCase()+"-flex"),o[i]=t,S(i,L(t)),void S(h(i),C[i])}S(t,L(t)),S(h(t),C[t])}),S("content",function(t){return this.style.content='"'+t+'"',E(this)}),Object.defineProperty(C,"class",{set:function(t){this.__class=t},get:function(){return this.__class||k(this.style)}}),S("$media",function(t,e){return t&&(this.style["@media "+t]=u(e)),E(this)}),S("$nest",function(t,e){return t&&(this.style[(":"===t.charAt(0)?"":" ")+t]=u(e)),E(this)}),["active","any","checked","default","disabled","empty","enabled","first","first-child","first-of-type","fullscreen","focus","hover","indeterminate","in-range","invalid","last-child","last-of-type","left","link","only-child","only-of-type","optional","out-of-range","read-only","read-write","required","right","root","scope","target","valid","visited","dir","lang","not","nth-child","nth-last-child","nth-last-of-type","nth-of-type","after","before","first-letter","first-line","selection","backdrop","placeholder","marker","spelling-error","grammar-error"].forEach(function(t){return S("$"+s(t),function(e,n){return(e||n)&&(this.style[":"+t+(n?"("+e+")":"")]=u(n||e)),E(this)})}),C.helper("$animate",function(t,e){return C.animation(C.$keyframes(e)+" "+t)}),C});
+!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):t.b=e()}(this,function(){"use strict";var t={ai:"alignItems",b:"bottom",bc:"backgroundColor",br:"borderRadius",bs:"boxShadow",c:"color",d:"display",f:"float",fd:"flexDirection",ff:"fontFamily",fs:"fontSize",h:"height",jc:"justifyContent",l:"left",lh:"lineHeight",ls:"letterSpacing",m:"margin",mb:"marginBottom",ml:"marginLeft",mr:"marginRight",mt:"marginTop",o:"opacity",p:"padding",pb:"paddingBottom",pl:"paddingLeft",pr:"paddingRight",pt:"paddingTop",r:"right",t:"top",ta:"textAlign",td:"textDecoration",tt:"textTransform",w:"width"},e=Object.create(null),n=["float"].concat(Object.keys(function t(e){return e.hasOwnProperty("width")?e:t(Object.getPrototypeOf(e))}(document.documentElement.style)).filter(function(t){return-1===t.indexOf("-")&&"length"!==t}));var r=function(t,e){return void 0===e&&(e={}),function(n){return n in e?e[n]:e[n]=t(n)}},i=r(function(t){var n,r="";return t.trim().replace(/;/g,"\n").split("\n").reduce(function(t,i){if(i=r+i.trim(),r=","===i.slice(-1)?i:"")return t;if(","===i.charAt(0))return t[n]+=i,t;var o=i.split(/[:\s]/);if(o.length>1){var c=d(o.shift().trim());a(t,n=e[c]||c,o.filter(function(t){return t}).reduce(function(t,e){return t+b(n,e.trim())+" "},"").trim())}return t},{})});function a(t,e,n){if(!(e in t))return t[e]=n;t._fallback||Object.defineProperty(t,"_fallback",{configurable:!0,value:Object.create(null,{})}),a(t._fallback,e,n)}var o=Object.create(null,{}),c=Object.create(null,{}),l=/^(o|O|ms|MS|Ms|moz|Moz|webkit|Webkit|WebKit)([A-Z])/;function f(t,e){var n,r;return"string"==typeof t?"string"==typeof e||"number"==typeof e?((n={})[t]=e,n):i(t):Array.isArray(t)&&Array.isArray(t.raw)?(arguments[0]={raw:t},i(String.raw.apply(null,arguments))):t.style||(r=t,Object.keys(r).reduce(function(t,e){var n=r[e];return n||0===n||""===n?("content"===e&&'"'!==n.charAt(0)?t[e]='"'+n+'"':t[e in o?o[e]:e]=y(e,n),t):t},{}))}var u=r(function(t){var e=document.createElement("div");try{return e.style[t]="1px",e.style.setProperty(t,"1px"),"1px"===e.style[t].slice(-3)?"px":""}catch(t){return""}},{flex:""});function s(t,e){for(var n in e._fallback&&(t._fallback?s(t._fallback,e._fallback):Object.defineProperty(t,"_fallback",{value:e._fallback})),e)e.hasOwnProperty(n)&&(t[n]=e[n])}function d(t){return t.slice("-"===t.charAt(0)?1:0).replace(/-([a-z])/g,function(t){return t[1].toUpperCase()})}function h(n){var r,i=(r=n).charAt(0)+(r.match(/([A-Z])/g)||[]).join("").toLowerCase(),a=t[i]&&t[i]!==n?n:i;return e[a]=n,a}function p(t,e){return t+"{"+function t(e){return Object.keys(e).reduce(function(t,n){return t+function(t,e){return(l.test(t)?"-":"")+(n=t,n.replace(/([A-Z])/g,"-$1").toLowerCase())+":"+e+";";var n}(n,e[n])},"")+(e._fallback?t(e._fallback):"")}("string"==typeof e?i(e):e)+"}"}function y(t,e){return e in c?c[e]:b(t,e)}function b(t,e){return e+(isNaN(e)?"":u(t))}var g=window.document,m=g&&g.createElement("style");m&&g.head.appendChild(m);var v=m&&m.sheet,j=!1,O=Object.create(null,{}),k=[],x=0,w="b"+("000"+(46656*Math.random()|0).toString(36)).slice(-3)+("000"+(46656*Math.random()|0).toString(36)).slice(-3);function A(t,e){if(k.push(t),j)return m.textContent=k.join("\n");v&&v.insertRule(t,arguments.length>1?e:v.cssRules.length)}function _(t){var e=JSON.stringify(t);if(e in O)return O[e];for(var n=function t(e,n){void 0===n&&(n="");var r=!1,i=[];return Object.keys(e).forEach(function(a){"@"===a.charAt(0)?(i.push(a+"{"+t(e[a])+"}"),delete e[a]):"object"==typeof e[a]?(i=i.concat(t(e[a],n+a)),delete e[a]):r=!0}),r&&i.unshift(p(".$"+n,e)),i}(t),r=w+ ++x,i=0;i<n.length;i++)A(n[i].replace(/\.\$/,"."+r));return O[e]=r,r}var P=0,$={};function C(t,e){return s(C.style,f.apply(null,arguments)),E(C)}function S(t,e){Object.defineProperty(C,t,{configurable:!0,value:e})}function E(t){var e=Object.create(C,{style:{value:t.style,enumerable:!0}});return t===C&&(C.style={}),e}function L(t){return function(e){return e||0===e?arguments.length>0&&a(this.style,t,1===arguments.length?y(t,e):Array.prototype.slice.call(arguments).map(function(e){return b(t,e)}).join(" ")):delete this.style[t],E(this)}}return Object.defineProperty(C,"valueOf",{configurable:!0,writable:!0,value:function(){return"."+this.class}}),C.style={},S("setDebug",function(t){j=t}),S("$keyframes",function(t){var e=Object.keys(t).reduce(function(e,n){return e+p(n,t[n].style||t[n])},"");if(e in $)return $[e];var n=w+ ++P;return $[e]=n,A("@keyframes "+n+"{"+e+"}"),n}),S("getSheet",function(){var t=k.join("");return k=[],O=Object.create(null,{}),t}),S("helper",function t(e,n){if(1===arguments.length)return Object.keys(e).forEach(function(n){return t(n,e[n])});delete C[e];"object"==typeof n?Object.defineProperty(C,e,{configurable:!0,get:function(){return s(this.style,f(n)),E(this)}}):Object.defineProperty(C,e,{configurable:!0,value:function(){var t=n.apply(null,arguments);return s(this.style,t.style),E(this)}})}),S("css",function t(e,n){if(1===arguments.length)return Object.keys(e).forEach(function(n){return t(n,e[n])});A(p(e,f(n)),0)}),S("classPrefix",w),n.forEach(function(t){var e,r=t.match(l);if(r){var i=(e=t.replace(l,"$2")).charAt(0).toLowerCase()+e.slice(1);if(-1===n.indexOf(i))return"flexDirection"===i&&(c.flex="-"+r[1].toLowerCase()+"-flex"),o[i]=t,S(i,L(t)),void S(h(i),C[i])}S(t,L(t)),S(h(t),C[t])}),S("content",function(t){return this.style.content='"'+t+'"',E(this)}),Object.defineProperty(C,"class",{set:function(t){this.__class=t},get:function(){return this.__class||_(this.style)}}),S("$media",function(t,e){return t&&a(this.style,"@media "+t,f(e)),E(this)}),S("$nest",function(t,e){return t&&a(this.style,(":"===t.charAt(0)?"":" ")+t,f(e)),E(this)}),["active","any","checked","default","disabled","empty","enabled","first","first-child","first-of-type","fullscreen","focus","hover","indeterminate","in-range","invalid","last-child","last-of-type","left","link","only-child","only-of-type","optional","out-of-range","read-only","read-write","required","right","root","scope","target","valid","visited","dir","lang","not","nth-child","nth-last-child","nth-last-of-type","nth-of-type","after","before","first-letter","first-line","selection","backdrop","placeholder","marker","spelling-error","grammar-error"].forEach(function(t){return S("$"+d(t),function(e,n){return(e||n)&&a(this.style,":"+t+(n?"("+e+")":""),f(n||e)),E(this)})}),C.helper("$animate",function(t,e){return C.animation(C.$keyframes(e)+" "+t)}),C});
 //# sourceMappingURL=bss.min.js.map

lib/index.js

@@ -24,3 +24,4 @@ import keyframes from './keyframes'
   short,
-  parse
+  parse,
+  add
 } from './utils'
@@ -107,3 +108,3 @@
   if (value)
-    this.style['@media ' + value] = parse(style)
+    add(this.style, '@media ' + value, parse(style))
 
@@ -115,3 +116,3 @@ return chain(this)
   if (value)
-    this.style[(value.charAt(0) === ':' ? '' : ' ') + value] = parse(style)
+    add(this.style, (value.charAt(0) === ':' ? '' : ' ') + value, parse(style))
 
@@ -124,3 +125,3 @@ return chain(this)
     if (value || b)
-      this.style[':' + name + (b ? '(' + value + ')' : '')] = parse(b || value)
+      add(this.style, ':' + name + (b ? '(' + value + ')' : ''), parse(b || value))
     return chain(this)
@@ -135,5 +136,6 @@ })
     } else if (arguments.length > 0) {
-      this.style[prop] = arguments.length === 1
+      add(this.style, prop, arguments.length === 1
         ? formatValue(prop, value)
         : Array.prototype.slice.call(arguments).map(v => addPx(prop, v)).join(' ')
+      )
     }
@@ -140,0 +142,0 @@

lib/sheet.js

@@ -6,3 +6,2 @@ import {
 const document = window.document
-const classes = Object.create(null, {})
 const styleSheet = document && document.createElement('style')
@@ -13,2 +12,3 @@ styleSheet && document.head.appendChild(styleSheet)
 let debug = false
+let classes = Object.create(null, {})
 let rules = []
@@ -27,2 +27,3 @@ let count = 0
   rules = []
+  classes = Object.create(null, {})
   return content
@@ -29,0 +30,0 @@ }

lib/utils.js

@@ -5,5 +5,5 @@ import popular from './popular'
 
-export const cssProperties = Object.keys(
+export const cssProperties = ['float'].concat(Object.keys(
   findWidth(document.documentElement.style)
-).filter(p => p.indexOf('-') === -1 && p !== 'length')
+).filter(p => p.indexOf('-') === -1 && p !== 'length'))
 
@@ -25,3 +25,3 @@ function findWidth(obj) {
 
-  return string.replace(/;/g, '\n').split('\n').reduce((acc, line) => {
+  return string.trim().replace(/;/g, '\n').split('\n').reduce((acc, line) => {
     line = last + line.trim()
@@ -41,4 +41,3 @@ last = line.slice(-1) === ',' ? line : ''
       prev = shorts[key] || key
-
-      acc[prev] = tokens.filter(a => a).reduce((acc, t) => acc + addPx(prev, t.trim()) + ' ', '').trim()
+      add(acc, prev, tokens.filter(a => a).reduce((acc, t) => acc + addPx(prev, t.trim()) + ' ', '').trim())
     }
@@ -49,2 +48,12 @@ return acc
 
+export function add(style, prop, value) {
+  if (!(prop in style))
+    return style[prop] = value
+
+  if (!style._fallback)
+    Object.defineProperty(style, '_fallback', { configurable: true, value: Object.create(null, {}) })
+
+  add(style._fallback, prop, value)
+}
+
 export const vendorMap = Object.create(null, {})
@@ -104,2 +113,8 @@ export const vendorValuePrefix = Object.create(null, {})
 export function assign(obj, obj2) {
+  if (obj2._fallback) {
+    obj._fallback
+      ? assign(obj._fallback, obj2._fallback)
+      : Object.defineProperty(obj, '_fallback', { value: obj2._fallback })
+  }
+
   for (const key in obj2) {
@@ -139,15 +154,14 @@ if (obj2.hasOwnProperty(key))
 
-export function objectToRules(style) {
-  const base = {}
-      , rules = []
-
+export function objectToRules(style, prefix = '') {
   let hasBase = false
+    , rules = []
 
-  Object.keys(style).forEach(key => {
-    if (key.charAt(0) === '@') {
-      rules.push(key + '{' + objectToRules(style[key]) + '}')
-    } else if (key.charAt(0) === ' ' || key.charAt(0) === ':') {
-      rules.push(selectorBlock('.$' + key, style[key]))
+  Object.keys(style).forEach(prop => {
+    if (prop.charAt(0) === '@') {
+      rules.push(prop + '{' + objectToRules(style[prop]) + '}')
+      delete style[prop]
+    } else if (typeof style[prop] === 'object') {
+      rules = rules.concat(objectToRules(style[prop], prefix + prop))
+      delete style[prop]
     } else {
-      base[key] = style[key]
       hasBase = true
@@ -158,3 +172,3 @@ }
   if (hasBase)
-    rules.unshift(selectorBlock('.$', base))
+    rules.unshift(selectorBlock('.$' + prefix, style))
 
@@ -171,3 +185,5 @@ return rules
 export function stylesToCss(style) {
-  return Object.keys(style).reduce((acc, k) => acc + propToString(style, k), '')
+  return Object.keys(style).reduce((acc, prop) =>
+    acc + propToString(prop, style[prop])
+  , '') + (style._fallback ? stylesToCss(style._fallback) : '')
 }
@@ -179,5 +195,5 @@
 
-function propToString(style, k) {
-  return (vendorRegex.test(k) ? '-' : '')
-  + camelCaseToHyphen(k) + ':' + style[k] + ';'
+function propToString(prop, value) {
+  return (vendorRegex.test(prop) ? '-' : '')
+  + camelCaseToHyphen(prop) + ':' + value + ';'
 }
@@ -184,0 +200,0 @@

package.json

 {
   "name": "bss",
-  "version": "1.1.8",
+  "version": "1.1.9",
   "description": "Better Style Sheets",
@@ -5,0 +5,0 @@ "main": "bss.js",

README.md

@@ -38,4 +38,3 @@ [![version](https://img.shields.io/npm/v/bss.svg)]() [![gzipped](http://img.badgesize.io/porsager/bss/master/bss.js.svg?compression=gzip&label=gzipped)]() [![license](https://img.shields.io/github/license/porsager/wright.svg)]()
 
-Here's a quick example of using bss togher with [mithril](https://github.com/mithriljs/mithril.js)
-See the example [live here](https://flems.io/#0=N4IgtglgJlA2CmIBcBWFA6AzCgNCA9gK4AuADicsQE6Hx4DO8CAxsfFMiOgFb0h4AzCAj5IA2qAB2AQzCIkXXvxDN8ktus4JiAAjU6AvDuq0AOpPNh0YIuoAUUfM0Jz16AEb4oATxw7g5jo6AG4Q8ADuSCGSXvCGAHw6YHYA5AAWAIwpOgDUOu4ezKlU7CkAlOhFKeFpEGzl6AL0dpgATBXE0qnM8OrwVOV+AZJBQfTE3ghRBe5F+gBk8zopAOYlvQ3jk3SBo2rMsBDMANZRdmUJeiNGAIRquwC+fikAEkyw+Drh+FSwUOXmB5lEAPAC6eEOkmOogkIEIv04aWIZHoSAA9GjCJJSMcVpV8GA0ZBiGkqMIAAIZdBUzDKCakeQgJR4UjSYjMNLwGFiDJ4dgASUkUHgAA9TCBlLsdModAAfWU6NnUfgZABsOFaAAYcJhMGrMDq9arMOCeXhWOxxTpFjK7FKgjLgjFhegODg1RqACyGjIATgNur9JpwZpAxAgwXgAFEEK5iOYZaMgvLorFXQT0KySuoY-A44YDEYdAASRzMdDSVgR6Ox3rxkajMoJvCmYgPcytgRYqtqfitb0ADgA7IbWnrR3rQaCnqB4bBEcjSKiMVicXjVIT3PQ+Hh6YylGCHkA)
+Here's a quick example of using bss together with [mithril](https://github.com/mithriljs/mithril.js) - see the example [live here](https://flems.io/#0=N4IgtglgJlA2CmIBcBWFA6AzCgNCA9gK4AuADicsQE6Hx4DO8CAxsfFMiOgFb0h4AzCAj5IA2qAB2AQzCIkXXvxDN8ktus4JiAAjU6AvDuq0AOpPNh0YIuoAUUfM0Jz16AEb4oATxw7g5jo6AG4Q8ADuSCGSXvCGAHw6YHYA5AAWAIwpOgDUOu4ezKlU7CkAlOhFKeFpEGzl6AL0dpgATBXE0qnM8OrwVOV+AZJBQfTE3ghRBe5F+gBk8zopAOYlvQ3jk3SBo2rMsBDMANZRdmUJeiNGAIRquwC+fikAEkyw+Drh+FSwUOXmB5lEAPAC6eEOkmOogkIEIv04aWIZHoSAA9GjCJJSMcVpV8GA0ZBiGkqMIAAIZdBUzDKCakeQgJR4UjSYjMNLwGFiDJ4dgASUkUHgAA9TCBlLsdModAAfWU6NnUfgZABsOFaAAYcJhMGrMDq9arMOCeXhWOxxTpFjK7FKgjLgjFhegODg1RqACyGjIATgNur9JpwZpAxAgwXgAFEEK5iOYZaMgvLorFXQT0KySuoY-A44YDEYdAASRzMdDSVgR6Ox3rxkajMoJvCmYgPcytgRYqtqfitb0ADgA7IbWnrR3rQaCnqB4bBEcjSKiMVicXjVIT3PQ+Hh6YylGCHkA)
 
@@ -165,3 +164,3 @@ ``` js
 
-## `.helper
+## `.helper`
 
@@ -168,0 +167,0 @@ Define your own helpers to work in a fashion similar to tachyons, or simply to make your life easier.

tests/index.js

@@ -31,2 +31,3 @@ const o = require('ospec')
     style: {
+      display: '',
       backgroundColor: '',
@@ -70,2 +71,6 @@ content: '',
 
+  o('recursive nest', function() {
+
+  })
+
   o('css class generation', function() {
@@ -76,2 +81,15 @@ const cls = b`foo: bar;`.class
 
+  o('same named properties string', function() {
+    const cls = b`
+      display -webkit-flex
+      display flex
+    `.class
+    o(b.getSheet()).equals(`.${cls}{display:-webkit-flex;display:flex;}`)
+  })
+
+  o('same named properties function', function() {
+    const cls = b.d('-webkit-flex').d('flex').class
+    o(b.getSheet()).equals(`.${cls}{display:-webkit-flex;display:flex;}`)
+  })
+
   o('pseudo', function() {
@@ -78,0 +96,0 @@ const cls = b.$hover(b.bc('green')).class

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

99854

increased by4.92%

Lines of code

1306

increased by3.82%

Worsened metrics

Number of lines in readme file

301

decreased by-0.33%

No dependency changes