bss - npm Package Compare versions

Comparing version 1.1.9 to 1.2.0

bss.js

 (function (global, factory) {
-	typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
-	typeof define === 'function' && define.amd ? define(factory) :
-	(global.b = factory());
+  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
+  typeof define === 'function' && define.amd ? define(factory) :
+  (global.b = factory());
 }(this, (function () { 'use strict';
 
-var popular = {
-  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'
-};
+  var popular = {
+    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'
+  };
 
-var shorts = Object.create(null);
+  var shorts = Object.create(null);
 
-var cssProperties = ['float'].concat(Object.keys(
-  findWidth(document.documentElement.style)
-).filter(function (p) { return p.indexOf('-') === -1 && p !== 'length'; }));
+  var cssProperties = ['float'].concat(Object.keys(
+    findWidth(document.documentElement.style)
+  ).filter(function (p) { return p.indexOf('-') === -1 && p !== 'length'; }));
 
-function findWidth(obj) {
-  return obj.hasOwnProperty('width')
-    ? obj
-    : findWidth(Object.getPrototypeOf(obj))
-}
+  function findWidth(obj) {
+    return obj.hasOwnProperty('width')
+      ? obj
+      : findWidth(Object.getPrototypeOf(obj))
+  }
 
-var memoize = function (fn, cache) {
-  if ( cache === void 0 ) cache = {};
+  var memoize = function (fn, cache) {
+    if ( cache === void 0 ) cache = {};
 
-  return function (item) { return item in cache
-    ? cache[item]
-    : cache[item] = fn(item); };
-};
+    return function (item) { return item in cache
+      ? cache[item]
+      : cache[item] = fn(item); };
+  };
 
-var stringToObject = memoize(function (string) {
-  var last = ''
-    , prev;
+  var stringToObject = memoize(function (string) {
+    var last = ''
+      , prev;
 
-  return string.trim().replace(/;/g, '\n').split('\n').reduce(function (acc, line) {
-    line = last + line.trim();
-    last = line.slice(-1) === ',' ? line : '';
-    if (last)
-      { return acc }
+    return string.trim().replace(/;/g, '\n').split('\n').reduce(function (acc, line) {
+      line = last + line.trim();
+      last = line.slice(-1) === ',' ? line : '';
+      if (last)
+        { return acc }
 
-    if (line.charAt(0) === ',') {
-      acc[prev] += line;
+      if (line.charAt(0) === ',') {
+        acc[prev] += line;
+        return acc
+      }
+
+      var tokens = line.split(/[:\s]/);
+      if (tokens.length > 1) {
+        var key = hyphenToCamelCase(tokens.shift().trim());
+        prev = shorts[key] || key;
+        add(acc, prev, tokens.filter(function (a) { return a; }).reduce(function (acc, t) { return acc + addPx(prev, t.trim()) + ' '; }, '').trim());
+      }
       return acc
-    }
+    }, {})
+  });
 
-    var tokens = line.split(/[:\s]/);
-    if (tokens.length > 1) {
-      var key = hyphenToCamelCase(tokens.shift().trim());
-      prev = shorts[key] || key;
-      add(acc, prev, tokens.filter(function (a) { return a; }).reduce(function (acc, t) { return acc + addPx(prev, t.trim()) + ' '; }, '').trim());
-    }
-    return acc
-  }, {})
-});
+  function add(style, prop, value) {
+    if (!(prop in style))
+      { return style[prop] = value }
 
-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, {}) }); }
 
-  if (!style._fallback)
-    { Object.defineProperty(style, '_fallback', { configurable: true, value: Object.create(null, {}) }); }
+    add(style._fallback, prop, value);
+  }
 
-  add(style._fallback, prop, value);
-}
+  var vendorMap = Object.create(null, {});
+  var vendorValuePrefix = Object.create(null, {});
 
-var vendorMap = Object.create(null, {});
-var vendorValuePrefix = Object.create(null, {});
+  var vendorRegex = /^(o|O|ms|MS|Ms|moz|Moz|webkit|Webkit|WebKit)([A-Z])/;
 
-var vendorRegex = /^(o|O|ms|MS|Ms|moz|Moz|webkit|Webkit|WebKit)([A-Z])/;
+  function parse(input, value) {
+    var obj;
 
-function parse(input, value) {
-  var obj;
+    if (typeof input === 'string') {
+      if (typeof value === 'string' || typeof value === 'number')
+        { return (( obj = {}, obj[input] = value, obj )) }
 
-  if (typeof input === 'string') {
-    if (typeof value === 'string' || typeof value === 'number')
-      { return (( obj = {}, obj[input] = value, obj)) }
+      return stringToObject(input)
+    } else if (Array.isArray(input) && Array.isArray(input.raw)) {
+      arguments[0] = { raw: input };
+      return stringToObject(String.raw.apply(null, arguments))
+    }
 
-    return stringToObject(input)
-  } else if (Array.isArray(input) && Array.isArray(input.raw)) {
-    arguments[0] = { raw: input };
-    return stringToObject(String.raw.apply(null, arguments))
+    return input.style || sanitize(input)
   }
 
-  return input.style || sanitize(input)
-}
+  var appendPx = memoize(function (prop) {
+    var el = document.createElement('div');
 
-var appendPx = memoize(function (prop) {
-  var el = document.createElement('div');
+    try {
+      el.style[prop] = '1px';
+      el.style.setProperty(prop, '1px');
+      return el.style[prop].slice(-3) === '1px' ? 'px' : ''
+    } catch (err) {
+      return ''
+    }
+  }, {
+    flex: ''
+  });
 
-  try {
-    el.style[prop] = '1px';
-    el.style.setProperty(prop, '1px');
-    return el.style[prop].slice(-3) === '1px' ? 'px' : ''
-  } catch (err) {
-    return ''
+  function lowercaseFirst(string) {
+    return string.charAt(0).toLowerCase() + string.slice(1)
   }
-}, {
-  flex: ''
-});
 
-function lowercaseFirst(string) {
-  return string.charAt(0).toLowerCase() + string.slice(1)
-}
+  function sanitize(styles) {
+    return Object.keys(styles).reduce(function (acc, key) {
+      var value = styles[key];
 
-function sanitize(styles) {
-  return Object.keys(styles).reduce(function (acc, key) {
-    var value = styles[key];
+      if (!value && value !== 0 && value !== '')
+        { return acc }
 
-    if (!value && value !== 0 && value !== '')
-      { return acc }
+      if (key === 'content' && value.charAt(0) !== '"')
+        { acc[key] = '"' + value + '"'; }
+      else
+        { acc[key in vendorMap ? vendorMap[key] : key] = formatValue(key, value); }
 
-    if (key === 'content' && value.charAt(0) !== '"')
-      { acc[key] = '"' + value + '"'; }
-    else
-      { acc[key in vendorMap ? vendorMap[key] : key] = formatValue(key, value); }
+      return acc
+    }, {})
+  }
 
-    return acc
-  }, {})
-}
+  function assign(obj, obj2) {
+    if (obj2._fallback) {
+      obj._fallback
+        ? assign(obj._fallback, obj2._fallback)
+        : Object.defineProperty(obj, '_fallback', { value: obj2._fallback });
+    }
 
-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) {
+      if (obj2.hasOwnProperty(key))
+        { obj[key] = obj2[key]; }
+    }
   }
 
-  for (var key in obj2) {
-    if (obj2.hasOwnProperty(key))
-      { obj[key] = obj2[key]; }
+  function hyphenToCamelCase(hyphen) {
+    return hyphen.slice(hyphen.charAt(0) === '-' ? 1 : 0).replace(/-([a-z])/g, function(match) {
+      return match[1].toUpperCase()
+    })
   }
-}
 
-function hyphenToCamelCase(hyphen) {
-  return hyphen.slice(hyphen.charAt(0) === '-' ? 1 : 0).replace(/-([a-z])/g, function(match) {
-    return match[1].toUpperCase()
-  })
-}
+  function camelCaseToHyphen(camelCase) {
+    return camelCase.replace(/([A-Z])/g, '-$1').toLowerCase()
+  }
 
-function camelCaseToHyphen(camelCase) {
-  return camelCase.replace(/([A-Z])/g, '-$1').toLowerCase()
-}
+  function initials(camelCase) {
+    return camelCase.charAt(0) + (camelCase.match(/([A-Z])/g) || []).join('').toLowerCase()
+  }
 
-function initials(camelCase) {
-  return camelCase.charAt(0) + (camelCase.match(/([A-Z])/g) || []).join('').toLowerCase()
-}
+  function short(prop) {
+    var acronym = initials(prop)
+        , short = popular[acronym] && popular[acronym] !== prop ? prop : acronym;
 
-function short(prop) {
-  var acronym = initials(prop)
-      , short = popular[acronym] && popular[acronym] !== prop ? prop : acronym;
+    shorts[short] = prop;
+    return short
+  }
 
-  shorts[short] = prop;
-  return short
-}
+  function objectToRules(style, suffix) {
+    if ( suffix === void 0 ) suffix = '';
 
+    var base = {};
 
+    var rules = [];
 
-function objectToRules(style, prefix) {
-  if ( prefix === void 0 ) prefix = '';
+    if (style._fallback)
+      { Object.defineProperty(base, '_fallback', { configurable: true, value: style._fallback }); }
 
-  var hasBase = false
-    , rules = [];
+    Object.keys(style).forEach(function (prop) {
+      if (prop.charAt(0) === '@')
+        { rules.push(prop + '{' + objectToRules(style[prop]) + '}'); }
+      else if (typeof style[prop] === 'object')
+        { rules = rules.concat(objectToRules(style[prop], suffix + prop)); }
+      else
+        { base[prop] = style[prop]; }
+    });
 
-  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 {
-      hasBase = true;
-    }
-  });
+    if (Object.keys(base).length)
+      { rules.unshift(selectorBlock((suffix.charAt(0) === ' ' ? '' : '.$' ) + '.$' + suffix, base)); }
 
-  if (hasBase)
-    { rules.unshift(selectorBlock('.$' + prefix, style)); }
+    return rules
+  }
 
-  return rules
-}
+  function selectorBlock(selector, style) {
+    return selector + '{'
+      + stylesToCss((typeof style === 'string' ? stringToObject(style) : style))
+      + '}'
+  }
 
-function selectorBlock(selector, style) {
-  return selector + '{'
-    + stylesToCss((typeof style === 'string' ? stringToObject(style) : style))
-    + '}'
-}
+  var selectorSplit = /,(?=(?:(?:[^"]*"){2})*[^"]*$)/;
 
-function stylesToCss(style) {
-  return Object.keys(style).reduce(function (acc, prop) { return acc + propToString(prop, style[prop]); }
-  , '') + (style._fallback ? stylesToCss(style._fallback) : '')
-}
+  function stylesToCss(style) {
+    return Object.keys(style).reduce(function (acc, prop) { return acc + propToString(prop, style[prop]); }
+    , '') + (style._fallback ? stylesToCss(style._fallback) : '')
+  }
 
+  function propToString(prop, value) {
+    return (vendorRegex.test(prop) ? '-' : '')
+    + camelCaseToHyphen(prop) + ':' + value + ';'
+  }
 
+  function formatValue(key, value) {
+    return value in vendorValuePrefix
+      ? vendorValuePrefix[value]
+      : addPx(key, value)
+  }
 
-function propToString(prop, value) {
-  return (vendorRegex.test(prop) ? '-' : '')
-  + camelCaseToHyphen(prop) + ':' + value + ';'
-}
+  function addPx(key, value) {
+    return value + (isNaN(value) ? '' : appendPx(key))
+  }
 
-function formatValue(key, value) {
-  return value in vendorValuePrefix
-    ? vendorValuePrefix[value]
-    : addPx(key, value)
-}
+  var document$1 = window.document;
+  var styleSheet = document$1 && document$1.createElement('style');
+  styleSheet && document$1.head.appendChild(styleSheet);
+  var sheet = styleSheet && styleSheet.sheet;
 
-function addPx(key, value) {
-  return value + (isNaN(value) ? '' : appendPx(key))
-}
+  var debug = false;
+  var classes = Object.create(null, {});
+  var rules = [];
+  var count = 0;
 
-var document$1 = window.document;
-var styleSheet = document$1 && document$1.createElement('style');
-styleSheet && document$1.head.appendChild(styleSheet);
-var sheet = styleSheet && styleSheet.sheet;
+  var classPrefix = 'b' + ('000' + ((Math.random() * 46656) | 0).toString(36)).slice(-3) +
+                      ('000' + ((Math.random() * 46656) | 0).toString(36)).slice(-3);
 
-var debug = false;
-var classes = Object.create(null, {});
-var rules = [];
-var count$1 = 0;
+  function setDebug(d) {
+    debug = d;
+  }
 
-var classPrefix = 'b' + ('000' + ((Math.random() * 46656) | 0).toString(36)).slice(-3) +
-                    ('000' + ((Math.random() * 46656) | 0).toString(36)).slice(-3);
+  function getSheet() {
+    var content = rules.join('');
+    rules = [];
+    classes = Object.create(null, {});
+    return content
+  }
 
-function setDebug(d) {
-  debug = d;
-}
+  function insert(rule, index) {
+    rules.push(rule);
 
-function getSheet() {
-  var content = rules.join('');
-  rules = [];
-  classes = Object.create(null, {});
-  return content
-}
+    if (debug)
+      { return styleSheet.textContent = rules.join('\n') }
 
-function insert(rule, index) {
-  rules.push(rule);
+    sheet && sheet.insertRule(rule, arguments.length > 1
+      ? index
+      : sheet.cssRules.length
+    );
+  }
 
-  if (debug)
-    { return styleSheet.textContent = rules.join('\n') }
+  function createClass(style) {
+    var json = JSON.stringify(style);
 
-  sheet && sheet.insertRule(rule, arguments.length > 1
-    ? index
-    : sheet.cssRules.length
-  );
-}
+    if (json in classes)
+      { return classes[json] }
 
-function createClass(style) {
-  var json = JSON.stringify(style);
+    var rules = objectToRules(style)
+        , className = classPrefix + (++count);
 
-  if (json in classes)
-    { return classes[json] }
+    for (var i = 0; i < rules.length; i++)
+      { insert(rules[i].replace(/\.\$/g, '.' + className)); }
 
-  var rules = objectToRules(style)
-      , className = classPrefix + (++count$1);
+    classes[json] = className;
 
-  for(var i = 0; i < rules.length; i++)
-    { insert(rules[i].replace(/\.\$/, '.' + className)); }
+    return className
+  }
 
-  classes[json] = className;
+  var count$1 = 0;
+  var keyframeCache = {};
 
-  return className
-}
+  function keyframes(props) {
+    var content = Object.keys(props).reduce(function (acc, key) { return acc + selectorBlock(key, props[key].style || props[key]); }
+    , '');
 
-var count = 0;
-var keyframeCache = {};
+    if (content in keyframeCache)
+      { return keyframeCache[content] }
 
-var keyframes = function(props) {
-  var content = Object.keys(props).reduce(function (acc, key) { return acc + selectorBlock(key, props[key].style || props[key]); }
-  , '');
+    var name = classPrefix + ++count$1;
+    keyframeCache[content] = name;
+    insert('@keyframes ' + name + '{' + content + '}');
 
-  if (content in keyframeCache)
-    { return keyframeCache[content] }
+    return name
+  }
 
-  var name = classPrefix + ++count;
-  keyframeCache[content] = name;
-  insert('@keyframes ' + name + '{' + content + '}');
+  var pseudos = [
+    ':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',
 
-  return name
-};
+    // With value
+    ':dir',
+    ':lang',
+    ':not',
+    ':nth-child',
+    ':nth-last-child',
+    ':nth-last-of-type',
+    ':nth-of-type',
 
-var pseudos = [
-  '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',
+    // Elements
+    '::after',
+    '::before',
+    '::first-letter',
+    '::first-line',
+    '::selection',
+    '::backdrop',
+    '::placeholder',
+    '::marker',
+    '::spelling-error',
+    '::grammar-error'
+  ];
 
-  // With value
-  'dir',
-  'lang',
-  'not',
-  'nth-child',
-  'nth-last-child',
-  'nth-last-of-type',
-  'nth-of-type',
+  function bss(input, value) {
+    assign(bss.style, parse.apply(null, arguments));
+    return chain(bss)
+  }
 
-  // Elements
-  'after',
-  'before',
-  'first-letter',
-  'first-line',
-  'selection',
-  'backdrop',
-  'placeholder',
-  'marker',
-  'spelling-error',
-  'grammar-error'
-];
+  function setProp(prop, value) {
+    Object.defineProperty(bss, prop, {
+      configurable: true,
+      value: value
+    });
+  }
 
-function bss(input, value) {
-  assign(bss.style, parse.apply(null, arguments));
-  return chain(bss)
-}
-
-function setProp(prop, value) {
-  Object.defineProperty(bss, prop, {
+  Object.defineProperty(bss, 'valueOf', {
     configurable: true,
-    value: value
+    writable: true,
+    value: function ValueOf() {
+      return '.' + this.class
+    }
   });
-}
 
-Object.defineProperty(bss, 'valueOf', {
-  configurable: true,
-  writable: true,
-  value: function ValueOf() {
-    return '.' + this.class
-  }
-});
+  bss.style = {};
 
-bss.style = {};
+  setProp('setDebug', setDebug);
 
-setProp('setDebug', setDebug);
+  setProp('$keyframes', keyframes);
+  setProp('getSheet', getSheet);
+  setProp('helper', helper);
+  setProp('css', css);
+  setProp('classPrefix', classPrefix);
 
-setProp('$keyframes', keyframes);
-setProp('getSheet', getSheet);
-setProp('helper', helper);
-setProp('css', css);
-setProp('classPrefix', classPrefix);
+  function chain(instance) {
+    var newInstance = Object.create(bss, {
+      style: {
+        value: instance.style,
+        enumerable: true
+      }
+    });
 
-function chain(instance) {
-  var newInstance = Object.create(bss, {
-    style: {
-      value: instance.style,
-      enumerable: true
-    }
-  });
+    if (instance === bss)
+      { bss.style = {}; }
 
-  if (instance === bss)
-    { bss.style = {}; }
+    return newInstance
+  }
 
-  return newInstance
-}
+  cssProperties.forEach(function (prop) {
+    var vendor = prop.match(vendorRegex);
+    if (vendor) {
+      var unprefixed = lowercaseFirst(prop.replace(vendorRegex, '$2'));
+      if (cssProperties.indexOf(unprefixed) === -1) {
+        if (unprefixed === 'flexDirection')
+          { vendorValuePrefix.flex = '-' + vendor[1].toLowerCase() + '-flex'; }
 
-cssProperties.forEach(function (prop) {
-  var vendor = prop.match(vendorRegex);
-  if (vendor) {
-    var unprefixed = lowercaseFirst(prop.replace(vendorRegex, '$2'));
-    if (cssProperties.indexOf(unprefixed) === -1) {
-      if (unprefixed === 'flexDirection')
-        { vendorValuePrefix.flex = '-' + vendor[1].toLowerCase() + '-flex'; }
-
-      vendorMap[unprefixed] = prop;
-      setProp(unprefixed, setter(prop));
-      setProp(short(unprefixed), bss[unprefixed]);
-      return
+        vendorMap[unprefixed] = prop;
+        setProp(unprefixed, setter(prop));
+        setProp(short(unprefixed), bss[unprefixed]);
+        return
+      }
     }
-  }
 
-  setProp(prop, setter(prop));
-  setProp(short(prop), bss[prop]);
-});
+    setProp(prop, setter(prop));
+    setProp(short(prop), bss[prop]);
+  });
 
-setProp('content', function Content(arg) {
-  this.style.content = '"' + arg + '"';
-  return chain(this)
-});
+  setProp('content', function Content(arg) {
+    this.style.content = '"' + arg + '"';
+    return chain(this)
+  });
 
-Object.defineProperty(bss, 'class', {
-  set: function(value) {
-    this.__class = value;
-  },
-  get: function() {
-    return this.__class || createClass(this.style)
-  }
-});
+  Object.defineProperty(bss, 'class', {
+    set: function(value) {
+      this.__class = value;
+    },
+    get: function() {
+      return this.__class || createClass(this.style)
+    }
+  });
 
-setProp('$media', function Media(value, style) {
-  if (value)
-    { add(this.style, '@media ' + value, parse(style)); }
+  setProp('$media', function Media(value, style) {
+    if (value)
+      { add(this.style, '@media ' + value, parse(style)); }
 
-  return chain(this)
-});
+    return chain(this)
+  });
 
-setProp('$nest', function Nest(value, style) {
-  if (value)
-    { add(this.style, (value.charAt(0) === ':' ? '' : ' ') + value, parse(style)); }
+  setProp('$nest', function Nest(value, style) {
+    var this$1 = this;
 
-  return chain(this)
-});
+    if (arguments.length === 1)
+      { Object.keys(value).forEach(function (x) { return this$1.$nest(x, value[x]); }); }
+    else if (value)
+      { value.split(selectorSplit).map(function (x) { return x.trim(); }).forEach(function (x) { return add(this$1.style, (x.charAt(0) === ':' ? '' : ' ') + x, parse(style)); }); }
 
-pseudos.forEach(function (name) { return setProp('$' + hyphenToCamelCase(name), function Pseudo(value, b) {
-    if (value || b)
-      { add(this.style, ':' + name + (b ? '(' + value + ')' : ''), parse(b || value)); }
     return chain(this)
-  }); }
-);
+  });
 
-function setter(prop) {
-  return function CssProperty(value) {
-    if (!value && value !== 0) {
-      delete this.style[prop];
-    } else if (arguments.length > 0) {
-      add(this.style, prop, arguments.length === 1
-        ? formatValue(prop, value)
-        : Array.prototype.slice.call(arguments).map(function (v) { return addPx(prop, v); }).join(' ')
-      );
+  pseudos.forEach(function (name) { return setProp('$' + hyphenToCamelCase(name.replace(/:/g, '')), function Pseudo(value, b) {
+      if (value || b)
+        { add(this.style, name + (b ? '(' + value + ')' : ''), parse(b || value)); }
+      return chain(this)
+    }); }
+  );
+
+  function setter(prop) {
+    return function CssProperty(value) {
+      if (!value && value !== 0) {
+        delete this.style[prop];
+      } else if (arguments.length > 0) {
+        add(this.style, prop, arguments.length === 1
+          ? formatValue(prop, value)
+          : Array.prototype.slice.call(arguments).map(function (v) { return addPx(prop, v); }).join(' ')
+        );
+      }
+
+      return chain(this)
     }
-
-    return chain(this)
   }
-}
 
-function css(selector, style) {
-  if (arguments.length === 1)
-    { return Object.keys(selector).forEach(function (key) { return css(key, selector[key]); }) }
+  function css(selector, style) {
+    if (arguments.length === 1)
+      { return Object.keys(selector).forEach(function (key) { return css(key, selector[key]); }) }
 
-  insert(selectorBlock(selector, parse(style)), 0);
-}
+    insert(selectorBlock(selector, parse(style)), 0);
+  }
 
-function helper(name, styling) {
-  if (arguments.length === 1)
-    { return Object.keys(name).forEach(function (key) { return helper(key, name[key]); }) }
+  function helper(name, styling) {
+    if (arguments.length === 1)
+      { return Object.keys(name).forEach(function (key) { return helper(key, name[key]); }) }
 
-  delete bss[name]; // Needed to avoid weird get calls in chrome
-  typeof styling === 'object'
-    ?
-    Object.defineProperty(bss, name, {
-      configurable: true,
-      get: function() {
-        assign(this.style, parse(styling));
-        return chain(this)
-      }
-    })
-    :
-    Object.defineProperty(bss, name, {
-      configurable: true,
-      value: function Helper() {
-        var result = styling.apply(null, arguments);
-        assign(this.style, result.style);
-        return chain(this)
-      }
-    });
-}
+    delete bss[name]; // Needed to avoid weird get calls in chrome
+    typeof styling === 'object'
+      ?
+      Object.defineProperty(bss, name, {
+        configurable: true,
+        get: function() {
+          assign(this.style, parse(styling));
+          return chain(this)
+        }
+      })
+      :
+      Object.defineProperty(bss, name, {
+        configurable: true,
+        value: function Helper() {
+          var result = styling.apply(null, arguments);
+          assign(this.style, result.style);
+          return chain(this)
+        }
+      });
+  }
 
-bss.helper('$animate', function (value, props) { return bss.animation(bss.$keyframes(props) + ' ' + value); }
-);
+  bss.helper('$animate', function (value, props) { return bss.animation(bss.$keyframes(props) + ' ' + value); }
+  );
 
-return bss;
+  return bss;
 
 })));
 //# sourceMappingURL=bss.js.map

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=["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});
+!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 i={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"},c=Object.create(null),a=["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 t=function(e,n){return void 0===n&&(n={}),function(t){return t in n?n[t]:n[t]=e(t)}},o=t(function(t){var i,a="";return t.trim().replace(/;/g,"\n").split("\n").reduce(function(t,e){if(e=a+e.trim(),a=","===e.slice(-1)?e:"")return t;if(","===e.charAt(0))return t[i]+=e,t;var n=e.split(/[:\s]/);if(1<n.length){var r=p(n.shift().trim());l(t,i=c[r]||r,n.filter(function(t){return t}).reduce(function(t,e){return t+v(i,e.trim())+" "},"").trim())}return t},{})});function l(t,e,n){if(!(e in t))return t[e]=n;t._fallback||Object.defineProperty(t,"_fallback",{configurable:!0,value:Object.create(null,{})}),l(t._fallback,e,n)}var f=Object.create(null,{}),u=Object.create(null,{}),s=/^(o|O|ms|MS|Ms|moz|Moz|webkit|Webkit|WebKit)([A-Z])/;function h(t,e){var n,r;return"string"==typeof t?"string"==typeof e||"number"==typeof e?((n={})[t]=e,n):o(t):Array.isArray(t)&&Array.isArray(t.raw)?(t={raw:t},o(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 f?f[e]:e]=m(e,n)),t},{}))}var n=t(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 d(t,e){for(var n in e._fallback&&(t._fallback?d(t._fallback,e._fallback):Object.defineProperty(t,"_fallback",{value:e._fallback})),e)e.hasOwnProperty(n)&&(t[n]=e[n])}function p(t){return t.slice("-"===t.charAt(0)?1:0).replace(/-([a-z])/g,function(t){return t[1].toUpperCase()})}function y(t){var e,n=(e=t).charAt(0)+(e.match(/([A-Z])/g)||[]).join("").toLowerCase(),r=i[n]&&i[n]!==t?t:n;return c[r]=t,r}function b(t,e){return t+"{"+function t(i){return Object.keys(i).reduce(function(t,e){return t+(r=i[n=e],(s.test(n)?"-":"")+n.replace(/([A-Z])/g,"-$1").toLowerCase()+":"+r+";");var n,r},"")+(i._fallback?t(i._fallback):"")}("string"==typeof e?o(e):e)+"}"}var g=/,(?=(?:(?:[^"]*"){2})*[^"]*$)/;function m(t,e){return e in u?u[e]:v(t,e)}function v(t,e){return e+(isNaN(e)?"":n(t))}var e=window.document,r=e&&e.createElement("style");r&&e.head.appendChild(r);var j=r&&r.sheet,k=!1,O=Object.create(null,{}),x=[],w=0,_="b"+("000"+(46656*Math.random()|0).toString(36)).slice(-3)+("000"+(46656*Math.random()|0).toString(36)).slice(-3);function A(t,e){if(x.push(t),k)return r.textContent=x.join("\n");j&&j.insertRule(t,1<arguments.length?e:j.cssRules.length)}function P(t){var e=JSON.stringify(t);if(e in O)return O[e];for(var n=function e(n,r){void 0===r&&(r="");var i={},a=[];return n._fallback&&Object.defineProperty(i,"_fallback",{configurable:!0,value:n._fallback}),Object.keys(n).forEach(function(t){"@"===t.charAt(0)?a.push(t+"{"+e(n[t])+"}"):"object"==typeof n[t]?a=a.concat(e(n[t],r+t)):i[t]=n[t]}),Object.keys(i).length&&a.unshift(b((" "===r.charAt(0)?"":".$")+".$"+r,i)),a}(t),r=_+ ++w,i=0;i<n.length;i++)A(n[i].replace(/\.\$/g,"."+r));return O[e]=r}var $=0,E={};function C(t,e){return d(C.style,h.apply(null,arguments)),L(C)}function S(t,e){Object.defineProperty(C,t,{configurable:!0,value:e})}function L(t){var e=Object.create(C,{style:{value:t.style,enumerable:!0}});return t===C&&(C.style={}),e}function M(e){return function(t){return t||0===t?0<arguments.length&&l(this.style,e,1===arguments.length?m(e,t):Array.prototype.slice.call(arguments).map(function(t){return v(e,t)}).join(" ")):delete this.style[e],L(this)}}return Object.defineProperty(C,"valueOf",{configurable:!0,writable:!0,value:function(){return"."+this.class}}),C.style={},S("setDebug",function(t){k=t}),S("$keyframes",function(n){var t=Object.keys(n).reduce(function(t,e){return t+b(e,n[e].style||n[e])},"");if(t in E)return E[t];var e=_+ ++$;return A("@keyframes "+(E[t]=e)+"{"+t+"}"),e}),S("getSheet",function(){var t=x.join("");return x=[],O=Object.create(null,{}),t}),S("helper",function e(n,r){if(1===arguments.length)return Object.keys(n).forEach(function(t){return e(t,n[t])});delete C[n];"object"==typeof r?Object.defineProperty(C,n,{configurable:!0,get:function(){return d(this.style,h(r)),L(this)}}):Object.defineProperty(C,n,{configurable:!0,value:function(){var t=r.apply(null,arguments);return d(this.style,t.style),L(this)}})}),S("css",function e(n,t){if(1===arguments.length)return Object.keys(n).forEach(function(t){return e(t,n[t])});A(b(n,h(t)),0)}),S("classPrefix",_),a.forEach(function(t){var e,n=t.match(s);if(n){var r=(e=t.replace(s,"$2")).charAt(0).toLowerCase()+e.slice(1);if(-1===a.indexOf(r))return"flexDirection"===r&&(u.flex="-"+n[1].toLowerCase()+"-flex"),S(r,M(f[r]=t)),void S(y(r),C[r])}S(t,M(t)),S(y(t),C[t])}),S("content",function(t){return this.style.content='"'+t+'"',L(this)}),Object.defineProperty(C,"class",{set:function(t){this.__class=t},get:function(){return this.__class||P(this.style)}}),S("$media",function(t,e){return t&&l(this.style,"@media "+t,h(e)),L(this)}),S("$nest",function(e,n){var r=this;return 1===arguments.length?Object.keys(e).forEach(function(t){return r.$nest(t,e[t])}):e&&e.split(g).map(function(t){return t.trim()}).forEach(function(t){return l(r.style,(":"===t.charAt(0)?"":" ")+t,h(n))}),L(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(n){return S("$"+p(n.replace(/:/g,"")),function(t,e){return(t||e)&&l(this.style,n+(e?"("+t+")":""),h(e||t)),L(this)})}),C.helper("$animate",function(t,e){return C.animation(C.$keyframes(e)+" "+t)}),C});
 //# sourceMappingURL=bss.min.js.map

CHANGELOG.md

 ## [Unreleased]
 
+## 1.2.0 -
+Fix missing pseudo/nest objects on instance reuse
+Fix pseduo element support by using `::`
+Fix consecutive selectors in `$nest` being applied as globals
+Fix common specificity issue by using double class names
+Add object overload to $nest
+Fix multiple definitions in @media blocks
+Fix Edge missing `float` detection
+Support multiple same named props
+Add support for recursive $nest
+
 ## 1.1.8 -
@@ -4,0 +15,0 @@ Automatically add vendor prefix to display: flex value (eg. -webkit-flex)

lib/index.js

@@ -16,2 +16,3 @@ import keyframes from './keyframes'
   lowercaseFirst,
+  selectorSplit,
   selectorBlock,
@@ -114,4 +115,6 @@ cssProperties,
 setProp('$nest', function Nest(value, style) {
-  if (value)
-    add(this.style, (value.charAt(0) === ':' ? '' : ' ') + value, parse(style))
+  if (arguments.length === 1)
+    Object.keys(value).forEach(x => this.$nest(x, value[x]))
+  else if (value)
+    value.split(selectorSplit).map(x => x.trim()).forEach(x => add(this.style, (x.charAt(0) === ':' ? '' : ' ') + x, parse(style)))
 
@@ -122,5 +125,5 @@ return chain(this)
 pseudos.forEach(name =>
-  setProp('$' + hyphenToCamelCase(name), function Pseudo(value, b) {
+  setProp('$' + hyphenToCamelCase(name.replace(/:/g, '')), function Pseudo(value, b) {
     if (value || b)
-      add(this.style, ':' + name + (b ? '(' + value + ')' : ''), parse(b || value))
+      add(this.style, name + (b ? '(' + value + ')' : ''), parse(b || value))
     return chain(this)
@@ -127,0 +130,0 @@ })

lib/pseudos.js

 export default [
-  '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',
+  ':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',
 
   // With value
-  'dir',
-  'lang',
-  'not',
-  'nth-child',
-  'nth-last-child',
-  'nth-last-of-type',
-  'nth-of-type',
+  ':dir',
+  ':lang',
+  ':not',
+  ':nth-child',
+  ':nth-last-child',
+  ':nth-last-of-type',
+  ':nth-of-type',
 
   // Elements
-  'after',
-  'before',
-  'first-letter',
-  'first-line',
-  'selection',
-  'backdrop',
-  'placeholder',
-  'marker',
-  'spelling-error',
-  'grammar-error'
+  '::after',
+  '::before',
+  '::first-letter',
+  '::first-line',
+  '::selection',
+  '::backdrop',
+  '::placeholder',
+  '::marker',
+  '::spelling-error',
+  '::grammar-error'
 ]

lib/sheet.js

@@ -50,4 +50,4 @@ import {
 
-  for(let i = 0; i < rules.length; i++)
-    insert(rules[i].replace(/\.\$/, '.' + className))
+  for (let i = 0; i < rules.length; i++)
+    insert(rules[i].replace(/\.\$/g, '.' + className))
 
@@ -54,0 +54,0 @@ classes[json] = className

lib/utils.js

@@ -143,26 +143,21 @@ import popular from './popular'
 
-export function getStyleSheetText(classes) {
-  return Object.keys(classes).sort().reduce((acc, key) =>
-    acc + key.replace(/CLASS_NAME/g, classes[key])
-  , '')
-}
+export function objectToRules(style, suffix = '') {
+  const base = {}
 
-export function objectToRules(style, prefix = '') {
-  let hasBase = false
-    , rules = []
+  let rules = []
 
+  if (style._fallback)
+    Object.defineProperty(base, '_fallback', { configurable: true, value: style._fallback })
+
   Object.keys(style).forEach(prop => {
-    if (prop.charAt(0) === '@') {
+    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 {
-      hasBase = true
-    }
+    else if (typeof style[prop] === 'object')
+      rules = rules.concat(objectToRules(style[prop], suffix + prop))
+    else
+      base[prop] = style[prop]
   })
 
-  if (hasBase)
-    rules.unshift(selectorBlock('.$' + prefix, style))
+  if (Object.keys(base).length)
+    rules.unshift(selectorBlock((suffix.charAt(0) === ' ' ? '' : '.$' ) + '.$' + suffix, base))
 
@@ -178,2 +173,4 @@ return rules
 
+export const selectorSplit = /,(?=(?:(?:[^"]*"){2})*[^"]*$)/
+
 export function stylesToCss(style) {
@@ -180,0 +177,0 @@ return Object.keys(style).reduce((acc, prop) =>

package.json

 {
   "name": "bss",
-  "version": "1.1.9",
+  "version": "1.2.0",
   "description": "Better Style Sheets",
@@ -16,8 +16,8 @@ "main": "bss.js",
   "devDependencies": {
-    "rollup": "0.56.0",
+    "ospec": "3.0.1",
+    "rollup": "0.62.0",
     "rollup-plugin-buble": "0.19.2",
-    "rollup-plugin-filesize": "1.5.0",
-    "rollup-plugin-uglify": "3.0.0",
-    "ospec": "1.4.0"
+    "rollup-plugin-filesize": "2.0.0",
+    "rollup-plugin-uglify": "4.0.0"
   }
 }

rollup.config.js

 import buble from 'rollup-plugin-buble'
-import uglify from 'rollup-plugin-uglify'
+import { uglify } from 'rollup-plugin-uglify'
 import filesize from 'rollup-plugin-filesize'
@@ -4,0 +4,0 @@

tests/index.js

@@ -74,7 +74,12 @@ const o = require('ospec')
 
-  o('css class generation', function() {
+  o('css doulbe class for specificity generation', function() {
     const cls = b`foo: bar;`.class
-    o(b.getSheet()).equals(`.${cls}{foo:bar;}`)
+    o(b.getSheet()).equals(`.${cls}.${cls}{foo:bar;}`)
   })
 
+  o('pseudo', function() {
+    const cls = b.$hover(b.bc('green')).class
+    o(b.getSheet()).equals(`.${cls}.${cls}:hover{background-color:green;}`)
+  })
+
   o('same named properties string', function() {
@@ -85,3 +90,3 @@ const cls = b`
     `.class
-    o(b.getSheet()).equals(`.${cls}{display:-webkit-flex;display:flex;}`)
+    o(b.getSheet()).equals(`.${cls}.${cls}{display:-webkit-flex;display:flex;}`)
   })
@@ -91,13 +96,8 @@
     const cls = b.d('-webkit-flex').d('flex').class
-    o(b.getSheet()).equals(`.${cls}{display:-webkit-flex;display:flex;}`)
+    o(b.getSheet()).equals(`.${cls}.${cls}{display:-webkit-flex;display:flex;}`)
   })
 
-  o('pseudo', function() {
-    const cls = b.$hover(b.bc('green')).class
-    o(b.getSheet()).equals(`.${cls}:hover{background-color:green;}`)
-  })
-
   o('empty content string is set to ""', function() {
     const cls = b.$before(b.content('')).$after(b({ content: '' })).class
-    o(b.getSheet()).equals(`.${cls}:before{content:"";}.${cls}:after{content:"";}`)
+    o(b.getSheet()).equals(`.${cls}.${cls}::before{content:"";}.${cls}.${cls}::after{content:"";}`)
   })
@@ -107,5 +107,15 @@
     const cls = b('-webkit-overflow-scrolling touch').class
-    o(b.getSheet()).equals(`.${cls}{-webkit-overflow-scrolling:touch;}`)
+    o(b.getSheet()).equals(`.${cls}.${cls}{-webkit-overflow-scrolling:touch;}`)
   })
 
+  o('single class for less specificity when using $nest', function() {
+    const cls = b.$nest('li', b('-webkit-overflow-scrolling touch')).class
+    o(b.getSheet()).equals(`.${cls} li{-webkit-overflow-scrolling:touch;}`)
+  })
+
+  o('nest multiple selectors', function() {
+    const cls = b.$nest('th, tr', b('background blue')).class
+    o(b.getSheet()).equals(`.${cls} th{background:blue;}.${cls} tr{background:blue;}`)
+  })
+
   o('add px', function() {
@@ -112,0 +122,0 @@ o(b`w 1`.style).deepEquals({ width: '1px' })

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

104101

increased by4.25%

Lines of code

1317

increased by0.84%

No dependency changes