bss - npm Package Compare versions

Comparing version 3.0.0-beta2 to 3.0.0-beta3

.eslintrc.js

@@ -100,3 +100,3 @@ module.exports = {
     'no-self-compare': 2,
-    'no-sequences': 2,
+    'no-sequences': 0,
     'no-throw-literal': 2,
@@ -103,0 +103,0 @@ 'no-unmodified-loop-condition': 2,

dist/bss.esm.js

 var el = typeof document !== 'undefined' && document.createElement('div');
 
-function px(x, cache) {
+var cache = {
+  flex: 0,
+  border: 1,
+  transform: 1,
+  'line-height': 0,
+  'box-shadow': 1,
+  'border-top': 1,
+  'border-left': 1,
+  'border-right': 1,
+  'border-bottom': 1
+};
 
+function px(x) {
+  if (x in cache)
+    { return cache[x] }
+
   try {
     el.style[x] = '1px';
     el.style.setProperty(x, '1px');
-    return el.style[x].slice(-3) === '1px'
+    return cache[x] = el.style[x].slice(-3) === '1px'
   } catch (err) {
-    return false
+    return cache[x] = false
   }
@@ -103,52 +117,16 @@ }
   if ( ref === void 0 ) ref = {};
-  var root = ref.root; if ( root === void 0 ) root = doc && doc.documentElement.style;
-  var style = ref.style; if ( style === void 0 ) style = doc && typeof doc.querySelector === 'function' && doc.querySelector('.bss_style') || doc.createElement('style');
-  var sheet = ref.sheet; if ( sheet === void 0 ) sheet = style && style.sheet;
+  var style = ref.style; if ( style === void 0 ) style = doc && doc.querySelector && doc.querySelector('.bss_style') || doc.createElement('style');
   var prefix = ref.prefix; if ( prefix === void 0 ) prefix = style && style.getAttribute('id') || randomId();
-  var charset = ref.charset;
+  var append = ref.append; if ( append === void 0 ) append = true;
 
-  var cache = Map();
-  var supportsVar = root && typeof CSS !== 'undefined' && CSS.supports('color', 'var(--var)');
-
-  var transforms = []
+  var cache = {}
       , props = []
       , ats = [];
 
-  var imports = 0;
+  var b = bss();
 
-  function b(xs) {
-    var args = [], len = arguments.length - 1;
-    while ( len-- > 0 ) args[ len ] = arguments[ len + 1 ];
-
-    var x = cache.get(xs) || instance();
-    x.classes = [x.name];
-    if (cache.has(xs)) {
-      args.forEach(function (v, i) { return classes(x, v) || setVar(x.name + '-' + (i + 1), v); });
-      return x
-    }
-
-    var s = xs[0];
-    for (var i = 1; i < xs.length; i++) {
-      var value = args[i - 1];
-      if (!classes(x, value)) {
-        var prop = props.reduce(function (acc, fn) { return fn(acc); }, (s.match(/[;\s]\s+([a-z-]+)[:\s].*$/) || [])[1]);
-        s += setVar(x.name + '-' + i, value, prop, suffix(prop, s));
-      }
-      s += xs[i];
-    }
-
-    parse(removeComments(s), x).forEach(insert);
-
-    cache.set(xs, x);
-
-    return x
-  }
-
   b.count = 0;
   b.rules = style && style.textContent && style.textContent.split(b.prefix + '{}') || [];
-  b.rules.vars = [];
-  b.vars = {};
   b.debug = false;
   b.dev = false;
-  b.charset = charset;
   b.prefix = prefix;
@@ -158,5 +136,5 @@ b.properties = properties;
   b.prop = function (fn) { return props.unshift(fn); };
-  b.transform = function (fn) { return transforms.unshift(fn); };
   b.create = bss;
   b.ssr = ssr;
+  b.global = global;
 
@@ -166,3 +144,2 @@ b.prop(vendor);
 
-  style && doc.head && doc.head.appendChild(style);
   style && (style.id = b.prefix);
@@ -172,45 +149,65 @@
 
-  function ssr(str) {
-    var index = imports + (b.charset ? 1 : 0);
-    var rules = b.rules.slice(0, index)
-      .concat(
-        (str.match(new RegExp(b.prefix + '[0-9]+', 'g')) || [])
-        .filter(function (x, i, xs) { return xs.indexOf(x) === i; })
-        .map(function (x) { return b.rules[index + parseInt(x.slice(b.prefix.length)) - 1]; })
-      ).join(b.prefix + '{}');
+  function global() {
+    var style = b.apply(b, arguments);
+    parse(removeComments(style.content).trim(), '__raw').forEach(function (x) { return insert(x.replace(/.__raw/g, '').trim()); }
+    );
+  }
 
-    return {
-      sheet: '<style class="bss_style" id="' + b.prefix + '">' + rules + '</style>',
-      vars: Object.entries(b.vars).map(function (ref) {
-        var k = ref[0];
-        var v = ref[1];
+  function ValueOf() {
+    if (this.className)
+      { return this.className }
 
-        return '--' + k + ':' + v.value + ';';
-    })
-    }
+    this.className = b.prefix + ++b.count;
+    parse(removeComments(this.content).trim(), this.className).forEach(insert);
+    return this.className
   }
 
-  function classes(x, value) {
-    var ref, ref$1;
+  function bss(pre) {
+    return function(xs) {
+      var args = [], len = arguments.length - 1;
+      while ( len-- > 0 ) args[ len ] = arguments[ len + 1 ];
 
-    if (value && value.classes) {
-      (ref = x.classes).push.apply(ref, value.classes);
-      return true
+      var s = (pre || '') + xs[0];
+      for (var i = 1; i < xs.length; i++) {
+        var value = args[i - 1];
+        s += (value && value.toString === ValueOf
+          ? value.content
+          : typeof value === 'object'
+            ? keyframes(value)
+            : value) + xs[i];
+      }
+
+      if (s in cache)
+        { return cache[s] }
+
+      var x = bss('\n' + s + '\n');
+      x.toString = x.valueOf = ValueOf;
+      x.content = s;
+
+      cache[s] = x;
+
+      return x
     }
-    if (Array.isArray(value)) {
-      (ref$1 = x.classes).push.apply(ref$1, value.map(function (v) { return x.classes; }).flat());
-      return true
-    }
   }
 
-  function instance() {
-    var x = {
-      name: (b.prefix + ++b.count),
-      classes: [],
-      toString: function () { return x.classes.join(' '); },
-      valueOf: function () { return x.classes.join(' '); }
-    };
-    return x
+  function ssr(str) {
+    return '<style class="bss_style" id="' + b.prefix + '">' + b.rules.join(b.prefix + '{}') + '</style>'
   }
 
+  function keyframes(x) {
+    var name = b.prefix + ++b.count;
+    var content = '@keyframes ' + name + '{' +
+      Object.keys(x).reduce(function (acc, key) { return acc + key + '{' + propsParse(x[key].trim()) + '}'; }
+      , '')
+    + '}';
+
+    if (content in cache)
+      { return cache[content] }
+
+    cache[content] = name;
+    insert(content);
+
+    return name
+  }
+
   function vendor(x) {
@@ -227,14 +224,2 @@ if (properties.indexOf(x) === -1) {
 
-  function suffix(prop, s) {
-    if (prop === 'transform') {
-      return s.match(/translate(3D|X|Y)?\([^)]*$/)
-        ? 'px'
-        : s.match(/rotate(3D|X|Y)?\([^)]*$/)
-          ? 'deg'
-          : ''
-    }
-
-    return px(prop) && !s.match(/\([^)]*$/) ? 'px' : ''
-  }
-
   function removeComments(str) {
@@ -244,74 +229,18 @@ return str.replace(/\/\/.*?(\n|$)/g, '\n').replace(/\/\*[\s\S]*?\*\//g, '')
 
-  function getValue(value, suffix) {
-    return value + (value.match(/[^-0-9.]/) ? '' : suffix)
-  }
-
-  function setVar(name, raw, prop, suffix) {
-    if ( suffix === void 0 ) suffix = '';
-
-    var x = b.vars[name] || (b.vars[name] = {
-      name: name, prop: prop, suffix: suffix,
-      change: function (v) { return updateVar(x, prop, transforms.reduce(function (acc, fn) { return fn(acc, x.prop, x.change); }, v)); }
-    });
-
-    x.change(raw);
-    x.raw = raw;
-    return 'var(--' + name + ')'
-  }
-
-  function updateVar(x, prop, value) {
-    value = getValue(String(value), x.suffix);
-    if (x.value !== value) {
-      x.value = value;
-      supportsVar
-        ? root.setProperty('--' + x.name, value)
-        : x.raw && update(x.index);
+  function insert(rule) {
+    if (append) {
+      style && doc.head && doc.head.appendChild(style);
+      append = false;
     }
 
-    return x.value
-  }
-
-  function update(index, name, prop, value) {
-    index = index + imports + (b.charset ? 1 : 0);
-    if (b.dev) {
-      style.textContent = replaceVars(
-        (b.charset ? [b.charset] : []).concat(b.rules).map(pretty).join('\n'),
-        b.rules.vars[index],
-        index
-      );
-    } else {
-      try {
-        style.sheet.deleteRule(index);
-        style.sheet.insertRule(replaceVars(b.rules[index], b.rules.vars[index], index), index);
-      } catch (e) {
-        b.debug && console.log('Ignored error:', e);
-      }
-    }
-  }
-
-  function replaceVars(s, vars, index) {
-    index = index + imports + (b.charset ? 1 : 0);
-    return vars.reduce(function (acc, x) { return acc.replace(x, b.vars[x.slice(6, -1)].value); }
-    , s)
-  }
-
-  function insert(rule) {
     var isImport = rule.indexOf('@import') === 0
-        , index = isImport ? 0 : b.rules.length
-        , vars = !supportsVar && rule.match(/var\(--[a-z0-9-]+\)/g) || [];
+        , index = isImport ? 0 : b.rules.length;
 
-    vars.forEach(function (x) { return b.vars[x.slice(6, -1)].index = index; });
-    imports += isImport ? 1 : 0;
     index === 0 ? b.rules.unshift(rule) : b.rules.push(rule);
-    index === 0 ? b.rules.vars.unshift(vars) : b.rules.vars.push(vars);
 
     if (b.dev && style) {
-      style.textContent = replaceVars(
-        (b.charset ? [b.charset] : []).concat(b.rules).map(pretty).join('\n'),
-        vars,
-        index
-      );
+      style.textContent = b.rules.map(pretty).join('\n');
     } else if (style && style.sheet) {
       try {
-        style.sheet.insertRule(replaceVars(rule, vars, index), index + (b.charset ? 1 : 0));
+        style.sheet.insertRule(rule, index);
       } catch (e) {
@@ -346,3 +275,3 @@ b.debug && console.log('Ignored error:', e);
       if (i > 0 && name && !isClass(s[i])) {
-        x.name = s.slice(1, i) + '-' + x.name;
+        x = s.slice(1, i) + '-' + x;
         name = false;
@@ -354,6 +283,6 @@ }
       }
-      propsParseLoop(s, i, props);
+      propsParseLoop(s, i, s[i], props);
 
       if (s[i] === '}' || i === s.length - 1) {
-        parseAddProps(at || supports || rules, i, x.name, props, level);
+        parseAddProps(at || supports || rules, i, x, props, level);
 
@@ -371,3 +300,3 @@ if (at && !level.length) {
         var selector = s.slice(props.end, i).trim();
-        parseAddProps(at || supports || rules, i, x.name, props, level);
+        parseAddProps(at || supports || rules, i, x, props, level);
         props.prop = props.value = null;
@@ -388,4 +317,3 @@ selector.indexOf('@supports') === 0
     content && xs.push(
-      (
-       (!level.length || level[0][0] !== '&') && (!xs.selector || xs.selector.indexOf('@keyframes ')) !== 0
+      ((!level.length || level[0][0] !== '&') && (!xs.selector || xs.selector.indexOf('@keyframes ')) !== 0
         ? '.' + name + (level.length && level[0][0] !== ':' ? ' ' : '')
@@ -401,2 +329,10 @@ : ''
 
+  function propsParse(s) {
+    var x = propsState();
+    for (var i = 0; i <= s.length; i++)
+      { propsParseLoop(s, i, s[i], x); }
+
+    return x.out
+  }
+
   function propsState() {
@@ -414,21 +350,21 @@ return {
 
-  function propsParseLoop(s, i, x) {
-    if (!x.value && x.prop !== null && x.lean && s[i] === ':')
+  function propsParseLoop(s, i, v, x) {
+    if (!x.value && x.prop !== null && x.lean && v === ':')
       { x.lean = false; }
-    if (!x.value && x.prop !== null && s[i] === ',') {
+    if (!x.value && x.prop !== null && v === ',') {
       x.value = x.comma;
       x.prop = x.out[x.out.length - 1][0];
-    } else if (!x.value && x.prop === null && isProp(s[i])) {
+    } else if (!x.value && x.prop === null && isProp(v)) {
       x.prop = i;
-    } else if (typeof x.prop === 'number' && (i === s.length - 1 || (!x.value && (isPropEnd(s[i]) || (x.lean && s[i] === '\n'))))) {
+    } else if (typeof x.prop === 'number' && (i === s.length - 1 || (!x.value && (isPropEnd(v) || (x.lean && v === '\n'))))) {
       x.value = i + 1;
     }
-    propAdd(s, i, x);
+    propAdd(s, i, v, x);
   }
 
-  function propAdd(s, i, x) {
-    if (x.value && isQuote(s[i]))
+  function propAdd(s, i, v, x) {
+    if (x.value && isQuote(v))
       { x.quote = !x.quote; }
 
-    if (!x.quote && x.prop !== null && (i === s.length - 1 || s[i] === ';' || s[i + 1] === '}' || (x.lean && s[i - 1] !== ',' && s[i] === '\n'))) {
+    if (!x.quote && x.prop !== null && (i === s.length - 1 || v === ';' || s[i + 1] === '}' || (x.lean && s[i - 1] !== ',' && v === '\n'))) {
       x.out.push(
@@ -447,44 +383,31 @@ propParse(
   function propParse(ref) {
-    var prop = ref[0];
-    var s = ref[1];
+    var key = ref[0];
+    var value = ref[1];
 
-    prop = props.reduce(function (acc, fn) { return fn(acc); }, prop.trim());
+    key = props.reduce(function (acc, fn) { return fn(acc); }, key.trim());
 
-    if (!px(prop))
-      { return [prop, s.trim()] }
-
     var result = '';
     var end = 0;
-    var ignore = false;
-    for (var i = 0; i < s.length; i++) {
-      if (isValueSep(s[i]) || i === s.length - 1) {
-        var last = s.slice(end, i + 1).trim();
-        result += (ignore ? last : last.replace(/(^|[( ,])([-0-9.]+)([ ,)]|$)/g, '$1$2px$3').trim()) + (s[i] === ')' ? '' : ' ');
+    var unit = 'px';
+    for (var i = 0; i < value.length; i++) {
+      if (isValueSep(value[i]) || i === value.length - 1) {
+        var last = value.slice(end, i + 1).trim();
+        result += ((unit && px(key))
+          ? last.replace(/(^|[( ,])([-0-9.]+)([ ,)]|$)/g, '$1$2' + unit + '$3').trim()
+          : last) + (value[i] === ',' ? '' : ' ');
         end = i + 1;
       }
-      if (s[i] === '(' || s[i - 1] === ')')
-        { ignore = prop !== 'transform' || s.slice(end, i).indexOf('translate') !== 0; }
+      if (value[i] === '(' || value[i - 1] === ')') {
+        unit = value.slice(end, i).indexOf('translate') === 0
+          ? 'px'
+          : value.slice(end, i).indexOf('rotate') === 0
+            ? 'deg'
+            : '';
+      }
     }
 
-    return [prop, result.trim().replace(/[\n ]+/g, ' ')]
+    return [key, result.trim().replace(/[\n ]+/g, ' ')]
   }
-
 }
 
-function Map() {
-  var keys = []
-    , values = [];
-
-  var map = {
-    has: function (x) { return keys.indexOf(x) !== -1; },
-    get: function (x) { return values[keys.indexOf(x)]; },
-    set: function (x, v) { return (keys.push(x), values.push(v), map); },
-    delete: function (x) { return keys.indexOf(x) !== -1 && values.splice(keys.indexOf(values), 1); },
-    forEach: function (fn) { return keys.forEach(function (k, i) { return fn(values[i], k, map); }); },
-    clear: function () { return (keys = [], values = [], undefined); }
-  };
-
-  return map
-}
-
 var bss$1 = bss();
@@ -491,0 +414,0 @@ bss$1.create = bss;

dist/bss.js

@@ -9,10 +9,24 @@ (function (global, factory) {
 
-  function px(x, cache) {
+  var cache = {
+    flex: 0,
+    border: 1,
+    transform: 1,
+    'line-height': 0,
+    'box-shadow': 1,
+    'border-top': 1,
+    'border-left': 1,
+    'border-right': 1,
+    'border-bottom': 1
+  };
 
+  function px(x) {
+    if (x in cache)
+      { return cache[x] }
+
     try {
       el.style[x] = '1px';
       el.style.setProperty(x, '1px');
-      return el.style[x].slice(-3) === '1px'
+      return cache[x] = el.style[x].slice(-3) === '1px'
     } catch (err) {
-      return false
+      return cache[x] = false
     }
@@ -110,52 +124,16 @@ }
     if ( ref === void 0 ) ref = {};
-    var root = ref.root; if ( root === void 0 ) root = doc && doc.documentElement.style;
-    var style = ref.style; if ( style === void 0 ) style = doc && typeof doc.querySelector === 'function' && doc.querySelector('.bss_style') || doc.createElement('style');
-    var sheet = ref.sheet; if ( sheet === void 0 ) sheet = style && style.sheet;
+    var style = ref.style; if ( style === void 0 ) style = doc && doc.querySelector && doc.querySelector('.bss_style') || doc.createElement('style');
     var prefix = ref.prefix; if ( prefix === void 0 ) prefix = style && style.getAttribute('id') || randomId();
-    var charset = ref.charset;
+    var append = ref.append; if ( append === void 0 ) append = true;
 
-    var cache = Map();
-    var supportsVar = root && typeof CSS !== 'undefined' && CSS.supports('color', 'var(--var)');
-
-    var transforms = []
+    var cache = {}
         , props = []
         , ats = [];
 
-    var imports = 0;
+    var b = bss();
 
-    function b(xs) {
-      var args = [], len = arguments.length - 1;
-      while ( len-- > 0 ) args[ len ] = arguments[ len + 1 ];
-
-      var x = cache.get(xs) || instance();
-      x.classes = [x.name];
-      if (cache.has(xs)) {
-        args.forEach(function (v, i) { return classes(x, v) || setVar(x.name + '-' + (i + 1), v); });
-        return x
-      }
-
-      var s = xs[0];
-      for (var i = 1; i < xs.length; i++) {
-        var value = args[i - 1];
-        if (!classes(x, value)) {
-          var prop = props.reduce(function (acc, fn) { return fn(acc); }, (s.match(/[;\s]\s+([a-z-]+)[:\s].*$/) || [])[1]);
-          s += setVar(x.name + '-' + i, value, prop, suffix(prop, s));
-        }
-        s += xs[i];
-      }
-
-      parse(removeComments(s), x).forEach(insert);
-
-      cache.set(xs, x);
-
-      return x
-    }
-
     b.count = 0;
     b.rules = style && style.textContent && style.textContent.split(b.prefix + '{}') || [];
-    b.rules.vars = [];
-    b.vars = {};
     b.debug = false;
     b.dev = false;
-    b.charset = charset;
     b.prefix = prefix;
@@ -165,5 +143,5 @@ b.properties = properties;
     b.prop = function (fn) { return props.unshift(fn); };
-    b.transform = function (fn) { return transforms.unshift(fn); };
     b.create = bss;
     b.ssr = ssr;
+    b.global = global;
 
@@ -173,3 +151,2 @@ b.prop(vendor);
 
-    style && doc.head && doc.head.appendChild(style);
     style && (style.id = b.prefix);
@@ -179,45 +156,65 @@
 
-    function ssr(str) {
-      var index = imports + (b.charset ? 1 : 0);
-      var rules = b.rules.slice(0, index)
-        .concat(
-          (str.match(new RegExp(b.prefix + '[0-9]+', 'g')) || [])
-          .filter(function (x, i, xs) { return xs.indexOf(x) === i; })
-          .map(function (x) { return b.rules[index + parseInt(x.slice(b.prefix.length)) - 1]; })
-        ).join(b.prefix + '{}');
+    function global() {
+      var style = b.apply(b, arguments);
+      parse(removeComments(style.content).trim(), '__raw').forEach(function (x) { return insert(x.replace(/.__raw/g, '').trim()); }
+      );
+    }
 
-      return {
-        sheet: '<style class="bss_style" id="' + b.prefix + '">' + rules + '</style>',
-        vars: Object.entries(b.vars).map(function (ref) {
-          var k = ref[0];
-          var v = ref[1];
+    function ValueOf() {
+      if (this.className)
+        { return this.className }
 
-          return '--' + k + ':' + v.value + ';';
-      })
-      }
+      this.className = b.prefix + ++b.count;
+      parse(removeComments(this.content).trim(), this.className).forEach(insert);
+      return this.className
     }
 
-    function classes(x, value) {
-      var ref, ref$1;
+    function bss(pre) {
+      return function(xs) {
+        var args = [], len = arguments.length - 1;
+        while ( len-- > 0 ) args[ len ] = arguments[ len + 1 ];
 
-      if (value && value.classes) {
-        (ref = x.classes).push.apply(ref, value.classes);
-        return true
+        var s = (pre || '') + xs[0];
+        for (var i = 1; i < xs.length; i++) {
+          var value = args[i - 1];
+          s += (value && value.toString === ValueOf
+            ? value.content
+            : typeof value === 'object'
+              ? keyframes(value)
+              : value) + xs[i];
+        }
+
+        if (s in cache)
+          { return cache[s] }
+
+        var x = bss('\n' + s + '\n');
+        x.toString = x.valueOf = ValueOf;
+        x.content = s;
+
+        cache[s] = x;
+
+        return x
       }
-      if (Array.isArray(value)) {
-        (ref$1 = x.classes).push.apply(ref$1, value.map(function (v) { return x.classes; }).flat());
-        return true
-      }
     }
 
-    function instance() {
-      var x = {
-        name: (b.prefix + ++b.count),
-        classes: [],
-        toString: function () { return x.classes.join(' '); },
-        valueOf: function () { return x.classes.join(' '); }
-      };
-      return x
+    function ssr(str) {
+      return '<style class="bss_style" id="' + b.prefix + '">' + b.rules.join(b.prefix + '{}') + '</style>'
     }
 
+    function keyframes(x) {
+      var name = b.prefix + ++b.count;
+      var content = '@keyframes ' + name + '{' +
+        Object.keys(x).reduce(function (acc, key) { return acc + key + '{' + propsParse(x[key].trim()) + '}'; }
+        , '')
+      + '}';
+
+      if (content in cache)
+        { return cache[content] }
+
+      cache[content] = name;
+      insert(content);
+
+      return name
+    }
+
     function vendor(x) {
@@ -234,14 +231,2 @@ if (properties.indexOf(x) === -1) {
 
-    function suffix(prop, s) {
-      if (prop === 'transform') {
-        return s.match(/translate(3D|X|Y)?\([^)]*$/)
-          ? 'px'
-          : s.match(/rotate(3D|X|Y)?\([^)]*$/)
-            ? 'deg'
-            : ''
-      }
-
-      return px(prop) && !s.match(/\([^)]*$/) ? 'px' : ''
-    }
-
     function removeComments(str) {
@@ -251,74 +236,18 @@ return str.replace(/\/\/.*?(\n|$)/g, '\n').replace(/\/\*[\s\S]*?\*\//g, '')
 
-    function getValue(value, suffix) {
-      return value + (value.match(/[^-0-9.]/) ? '' : suffix)
-    }
-
-    function setVar(name, raw, prop, suffix) {
-      if ( suffix === void 0 ) suffix = '';
-
-      var x = b.vars[name] || (b.vars[name] = {
-        name: name, prop: prop, suffix: suffix,
-        change: function (v) { return updateVar(x, prop, transforms.reduce(function (acc, fn) { return fn(acc, x.prop, x.change); }, v)); }
-      });
-
-      x.change(raw);
-      x.raw = raw;
-      return 'var(--' + name + ')'
-    }
-
-    function updateVar(x, prop, value) {
-      value = getValue(String(value), x.suffix);
-      if (x.value !== value) {
-        x.value = value;
-        supportsVar
-          ? root.setProperty('--' + x.name, value)
-          : x.raw && update(x.index);
+    function insert(rule) {
+      if (append) {
+        style && doc.head && doc.head.appendChild(style);
+        append = false;
       }
 
-      return x.value
-    }
-
-    function update(index, name, prop, value) {
-      index = index + imports + (b.charset ? 1 : 0);
-      if (b.dev) {
-        style.textContent = replaceVars(
-          (b.charset ? [b.charset] : []).concat(b.rules).map(pretty).join('\n'),
-          b.rules.vars[index],
-          index
-        );
-      } else {
-        try {
-          style.sheet.deleteRule(index);
-          style.sheet.insertRule(replaceVars(b.rules[index], b.rules.vars[index], index), index);
-        } catch (e) {
-          b.debug && console.log('Ignored error:', e);
-        }
-      }
-    }
-
-    function replaceVars(s, vars, index) {
-      index = index + imports + (b.charset ? 1 : 0);
-      return vars.reduce(function (acc, x) { return acc.replace(x, b.vars[x.slice(6, -1)].value); }
-      , s)
-    }
-
-    function insert(rule) {
       var isImport = rule.indexOf('@import') === 0
-          , index = isImport ? 0 : b.rules.length
-          , vars = !supportsVar && rule.match(/var\(--[a-z0-9-]+\)/g) || [];
+          , index = isImport ? 0 : b.rules.length;
 
-      vars.forEach(function (x) { return b.vars[x.slice(6, -1)].index = index; });
-      imports += isImport ? 1 : 0;
       index === 0 ? b.rules.unshift(rule) : b.rules.push(rule);
-      index === 0 ? b.rules.vars.unshift(vars) : b.rules.vars.push(vars);
 
       if (b.dev && style) {
-        style.textContent = replaceVars(
-          (b.charset ? [b.charset] : []).concat(b.rules).map(pretty).join('\n'),
-          vars,
-          index
-        );
+        style.textContent = b.rules.map(pretty).join('\n');
       } else if (style && style.sheet) {
         try {
-          style.sheet.insertRule(replaceVars(rule, vars, index), index + (b.charset ? 1 : 0));
+          style.sheet.insertRule(rule, index);
         } catch (e) {
@@ -353,3 +282,3 @@ b.debug && console.log('Ignored error:', e);
         if (i > 0 && name && !isClass(s[i])) {
-          x.name = s.slice(1, i) + '-' + x.name;
+          x = s.slice(1, i) + '-' + x;
           name = false;
@@ -361,6 +290,6 @@ }
         }
-        propsParseLoop(s, i, props);
+        propsParseLoop(s, i, s[i], props);
 
         if (s[i] === '}' || i === s.length - 1) {
-          parseAddProps(at || supports || rules, i, x.name, props, level);
+          parseAddProps(at || supports || rules, i, x, props, level);
 
@@ -378,3 +307,3 @@ if (at && !level.length) {
           var selector = s.slice(props.end, i).trim();
-          parseAddProps(at || supports || rules, i, x.name, props, level);
+          parseAddProps(at || supports || rules, i, x, props, level);
           props.prop = props.value = null;
@@ -395,4 +324,3 @@ selector.indexOf('@supports') === 0
       content && xs.push(
-        (
-         (!level.length || level[0][0] !== '&') && (!xs.selector || xs.selector.indexOf('@keyframes ')) !== 0
+        ((!level.length || level[0][0] !== '&') && (!xs.selector || xs.selector.indexOf('@keyframes ')) !== 0
           ? '.' + name + (level.length && level[0][0] !== ':' ? ' ' : '')
@@ -408,2 +336,10 @@ : ''
 
+    function propsParse(s) {
+      var x = propsState();
+      for (var i = 0; i <= s.length; i++)
+        { propsParseLoop(s, i, s[i], x); }
+
+      return x.out
+    }
+
     function propsState() {
@@ -421,21 +357,21 @@ return {
 
-    function propsParseLoop(s, i, x) {
-      if (!x.value && x.prop !== null && x.lean && s[i] === ':')
+    function propsParseLoop(s, i, v, x) {
+      if (!x.value && x.prop !== null && x.lean && v === ':')
         { x.lean = false; }
-      if (!x.value && x.prop !== null && s[i] === ',') {
+      if (!x.value && x.prop !== null && v === ',') {
         x.value = x.comma;
         x.prop = x.out[x.out.length - 1][0];
-      } else if (!x.value && x.prop === null && isProp(s[i])) {
+      } else if (!x.value && x.prop === null && isProp(v)) {
         x.prop = i;
-      } else if (typeof x.prop === 'number' && (i === s.length - 1 || (!x.value && (isPropEnd(s[i]) || (x.lean && s[i] === '\n'))))) {
+      } else if (typeof x.prop === 'number' && (i === s.length - 1 || (!x.value && (isPropEnd(v) || (x.lean && v === '\n'))))) {
         x.value = i + 1;
       }
-      propAdd(s, i, x);
+      propAdd(s, i, v, x);
     }
 
-    function propAdd(s, i, x) {
-      if (x.value && isQuote(s[i]))
+    function propAdd(s, i, v, x) {
+      if (x.value && isQuote(v))
         { x.quote = !x.quote; }
 
-      if (!x.quote && x.prop !== null && (i === s.length - 1 || s[i] === ';' || s[i + 1] === '}' || (x.lean && s[i - 1] !== ',' && s[i] === '\n'))) {
+      if (!x.quote && x.prop !== null && (i === s.length - 1 || v === ';' || s[i + 1] === '}' || (x.lean && s[i - 1] !== ',' && v === '\n'))) {
         x.out.push(
@@ -454,44 +390,31 @@ propParse(
     function propParse(ref) {
-      var prop = ref[0];
-      var s = ref[1];
+      var key = ref[0];
+      var value = ref[1];
 
-      prop = props.reduce(function (acc, fn) { return fn(acc); }, prop.trim());
+      key = props.reduce(function (acc, fn) { return fn(acc); }, key.trim());
 
-      if (!px(prop))
-        { return [prop, s.trim()] }
-
       var result = '';
       var end = 0;
-      var ignore = false;
-      for (var i = 0; i < s.length; i++) {
-        if (isValueSep(s[i]) || i === s.length - 1) {
-          var last = s.slice(end, i + 1).trim();
-          result += (ignore ? last : last.replace(/(^|[( ,])([-0-9.]+)([ ,)]|$)/g, '$1$2px$3').trim()) + (s[i] === ')' ? '' : ' ');
+      var unit = 'px';
+      for (var i = 0; i < value.length; i++) {
+        if (isValueSep(value[i]) || i === value.length - 1) {
+          var last = value.slice(end, i + 1).trim();
+          result += ((unit && px(key))
+            ? last.replace(/(^|[( ,])([-0-9.]+)([ ,)]|$)/g, '$1$2' + unit + '$3').trim()
+            : last) + (value[i] === ',' ? '' : ' ');
           end = i + 1;
         }
-        if (s[i] === '(' || s[i - 1] === ')')
-          { ignore = prop !== 'transform' || s.slice(end, i).indexOf('translate') !== 0; }
+        if (value[i] === '(' || value[i - 1] === ')') {
+          unit = value.slice(end, i).indexOf('translate') === 0
+            ? 'px'
+            : value.slice(end, i).indexOf('rotate') === 0
+              ? 'deg'
+              : '';
+        }
       }
 
-      return [prop, result.trim().replace(/[\n ]+/g, ' ')]
+      return [key, result.trim().replace(/[\n ]+/g, ' ')]
     }
-
   }
 
-  function Map() {
-    var keys = []
-      , values = [];
-
-    var map = {
-      has: function (x) { return keys.indexOf(x) !== -1; },
-      get: function (x) { return values[keys.indexOf(x)]; },
-      set: function (x, v) { return (keys.push(x), values.push(v), map); },
-      delete: function (x) { return keys.indexOf(x) !== -1 && values.splice(keys.indexOf(values), 1); },
-      forEach: function (fn) { return keys.forEach(function (k, i) { return fn(values[i], k, map); }); },
-      clear: function () { return (keys = [], values = [], undefined); }
-    };
-
-    return map
-  }
-
   var bss$1 = bss();
@@ -498,0 +421,0 @@ bss$1.create = bss;

dist/bss.min.js

@@ -1,2 +0,2 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e=e||self).b=t()}(this,(function(){"use strict";var e="undefined"!=typeof document&&document.createElement("div");function t(t,n){try{return e.style[t]="1px",e.style.setProperty(t,"1px"),"1px"===e.style[t].slice(-3)}catch(e){return!1}}var n=/^(o|O|ms|MS|Ms|moz|Moz|webkit|Webkit|WebKit)([A-Z])/,r=function(e){return e.replace(/(\B[A-Z])/g,"-$1").toLowerCase()},o=function(e){return e?e.hasOwnProperty("width")?e:o(Object.getPrototypeOf(e)):{}},u=["float"].concat(Object.keys("undefined"==typeof document?{}:o(document.documentElement.style))).filter((function(e,t,n){return-1===e.indexOf("-")&&"length"!==e&&n.indexOf(e)===t})).map((function(e){return e.match(n)?"-"+r(e):r(e)})).sort(),i=function(e,t){var n;return Object.assign(e,((n={})[t.split("-").map((function(e){return e[0]})).join("")]=t,n))},a=Object.assign(u.reduce(i,{}),["align-items","bottom","background-color","border-radius","box-shadow","background-image","color","display","float","flex-direction","font-family","font-size","height","justify-content","left","line-height","letter-spacing","margin","margin-bottom","margin-left","margin-right","margin-top","opacity","padding","padding-bottom","padding-left","padding-right","padding-top","right","top","text-align","text-decoration","text-transform","width"].reduce(i,{}));function c(e){return a[e]||e}var s=window&&"object"==typeof window.document&&window.document,l=function(e,t){return t?function(t){return e.indexOf(t.toLowerCase())>-1}:function(t){return e.indexOf(t)>-1}},f=l("abcdefghijklmnopqrstuvwxyz-"),p=l("abcdefghijklmnopqrstuvwxyz0123456789-_",!0),d=l("'\""),h=l(" :"),g=l(" ,)"),m=Object.create(null,{}),v=Object.create(null,{}),x=function(){return"bss"+("000000"+(Math.random()*Math.pow(36,6)|0).toString(36)).slice(-6)};function y(e){void 0===e&&(e={});var n=e.root;void 0===n&&(n=s&&s.documentElement.style);var r=e.style;void 0===r&&(r=s&&"function"==typeof s.querySelector&&s.querySelector(".bss_style")||s.createElement("style"));var o=e.sheet;void 0===o&&(o=r&&r.sheet);var i=e.prefix;void 0===i&&(i=r&&r.getAttribute("id")||x());var a,l,v,b=e.charset,O=(a=[],l=[],v={has:function(e){return-1!==a.indexOf(e)},get:function(e){return l[a.indexOf(e)]},set:function(e,t){return a.push(e),l.push(t),v},delete:function(e){return-1!==a.indexOf(e)&&l.splice(a.indexOf(l),1)},forEach:function(e){return a.forEach((function(t,n){return e(l[n],t,v)}))},clear:function(){return a=[],void(l=[])}}),j=n&&"undefined"!=typeof CSS&&CSS.supports("color","var(--var)"),w=[],$=[],S=[],E=0;function k(e){for(var t=[],n=arguments.length-1;n-- >0;)t[n]=arguments[n+1];var r=O.get(e)||function(){var e={name:k.prefix+ ++k.count,classes:[],toString:function(){return e.classes.join(" ")},valueOf:function(){return e.classes.join(" ")}};return e}();if(r.classes=[r.name],O.has(e))return t.forEach((function(e,t){return z(r,e)||q(r.name+"-"+(t+1),e)})),r;for(var o,u=e[0],i=1;i<e.length;i++){var a=t[i-1];if(!z(r,a)){var c=$.reduce((function(e,t){return t(e)}),(u.match(/[;\s]\s+([a-z-]+)[:\s].*$/)||[])[1]);u+=q(r.name+"-"+i,a,c,C(c,u))}u+=e[i]}return function(e,t){for(var n=[],r={prop:null,value:null,out:[],lean:!0,comma:0,end:0,quote:!1},o=[],u=!1,i=!1,a=!1,c=0;c<e.length;c++)if(c>0&&a&&!p(e[c])&&(t.name=e.slice(1,c)+"-"+t.name,a=!1),a||0===c&&"."===e[c])a=!0;else if(D(e,c,r),"}"===e[c]||c===e.length-1)R(u||i||n,c,t.name,r,o),u&&!o.length&&((i||n).push(u.selector+"{"+u.join("")+"}"),u=!1),i&&!o.length&&(n.push(i.selector+"{"+i.join("")+"}"),i=!1),o.pop();else if("{"===e[c]){var s=e.slice(r.end,c).trim();R(u||i||n,c,t.name,r,o),r.prop=r.value=null,0===s.indexOf("@supports")?i=Object.assign([],{selector:s}):"@"===s[0]?u=Object.assign([],{selector:S.reduce((function(e,t){return t(e)}),s.trim())}):o.push(s)}return n}((o=u,o.replace(/\/\/.*?(\n|$)/g,"\n").replace(/\/\*[\s\S]*?\*\//g,"")),r).forEach(M),O.set(e,r),r}return k.count=0,k.rules=r&&r.textContent&&r.textContent.split(k.prefix+"{}")||[],k.rules.vars=[],k.vars={},k.debug=!1,k.dev=!1,k.charset=b,k.prefix=i,k.properties=u,k.at=function(e){return S.unshift("function"==typeof e?e:function(t){return e[t.slice(1)]||t})},k.prop=function(e){return $.unshift(e)},k.transform=function(e){return w.unshift(e)},k.create=y,k.ssr=function(e){var t=E+(k.charset?1:0),n=k.rules.slice(0,t).concat((e.match(new RegExp(k.prefix+"[0-9]+","g"))||[]).filter((function(e,t,n){return n.indexOf(e)===t})).map((function(e){return k.rules[t+parseInt(e.slice(k.prefix.length))-1]}))).join(k.prefix+"{}");return{sheet:'<style class="bss_style" id="'+k.prefix+'">'+n+"</style>",vars:Object.entries(k.vars).map((function(e){return"--"+e[0]+":"+e[1].value+";"}))}},k.prop((function(e){if(-1===u.indexOf(e)){if(m[e])return k.debug&&console.log(e,"prefixed to",m[e]),m[e];k.debug&&console.log(e,"not found")}return e})),k.prop(c),r&&s.head&&s.head.appendChild(r),r&&(r.id=k.prefix),k;function z(e,t){var n,r;return t&&t.classes?((n=e.classes).push.apply(n,t.classes),!0):Array.isArray(t)?((r=e.classes).push.apply(r,t.map((function(t){return e.classes})).flat()),!0):void 0}function C(e,n){return"transform"===e?n.match(/translate(3D|X|Y)?\([^)]*$/)?"px":n.match(/rotate(3D|X|Y)?\([^)]*$/)?"deg":"":t(e)&&!n.match(/\([^)]*$/)?"px":""}function q(e,t,o,u){void 0===u&&(u="");var i=k.vars[e]||(k.vars[e]={name:e,prop:o,suffix:u,change:function(e){return function(e,t,o){o=function(e,t){return e+(e.match(/[^-0-9.]/)?"":t)}(String(o),e.suffix),e.value!==o&&(e.value=o,j?n.setProperty("--"+e.name,o):e.raw&&function(e,t,n,o){if(e=e+E+(k.charset?1:0),k.dev)r.textContent=A((k.charset?[k.charset]:[]).concat(k.rules).map(P).join("\n"),k.rules.vars[e],e);else try{r.sheet.deleteRule(e),r.sheet.insertRule(A(k.rules[e],k.rules.vars[e],e),e)}catch(e){k.debug&&console.log("Ignored error:",e)}}(e.index));return e.value}(i,0,w.reduce((function(e,t){return t(e,i.prop,i.change)}),e))}});return i.change(t),i.raw=t,"var(--"+e+")"}function A(e,t,n){return n=n+E+(k.charset?1:0),t.reduce((function(e,t){return e.replace(t,k.vars[t.slice(6,-1)].value)}),e)}function M(e){var t=0===e.indexOf("@import"),n=t?0:k.rules.length,o=!j&&e.match(/var\(--[a-z0-9-]+\)/g)||[];if(o.forEach((function(e){return k.vars[e.slice(6,-1)].index=n})),E+=t?1:0,0===n?k.rules.unshift(e):k.rules.push(e),0===n?k.rules.vars.unshift(o):k.rules.vars.push(o),k.dev&&r)r.textContent=A((k.charset?[k.charset]:[]).concat(k.rules).map(P).join("\n"),o,n);else if(r&&r.sheet)try{r.sheet.insertRule(A(e,o,n),n+(k.charset?1:0))}catch(e){k.debug&&console.log("Ignored error:",e)}}function P(e){return e.replace(/{/g," {\n").replace(/([;{])\n*/g,"$1\n  ").replace(/(.*):(.*);/g,"$1: $2;").replace(/[\s]*}/g,"\n}\n").replace(/,\s*/g,", ").replace(/@.*{[\s\S]*?}[\s]*}/g,(function(e){return e.split("\n").reduce((function(e,t,n,r){return e+(n<r.length-1?"\n":"")+(n>1&&n<r.length-2?"  ":"")+t}),"")})).trim().replace("}\n\n}","}\n}")}function R(e,t,n,r,o){var u=r.out.length&&r.out.map((function(e){return e.join(":")})).join(";");u&&e.push((o.length&&"&"===o[0][0]||0===(!e.selector||e.selector.indexOf("@keyframes "))?"":"."+n+(o.length&&":"!==o[0][0]?" ":""))+o.join(" ").replace(/&/g,"."+n).replace(/ :/g,":")+"{"+u+";}"),r.end=t+1,r.out=[]}function D(e,n,r){!r.value&&null!==r.prop&&r.lean&&":"===e[n]&&(r.lean=!1),r.value||null===r.prop||","!==e[n]?!r.value&&null===r.prop&&f(e[n])?r.prop=n:"number"==typeof r.prop&&(n===e.length-1||!r.value&&(h(e[n])||r.lean&&"\n"===e[n]))&&(r.value=n+1):(r.value=r.comma,r.prop=r.out[r.out.length-1][0]),function(e,n,r){r.value&&d(e[n])&&(r.quote=!r.quote);!r.quote&&null!==r.prop&&(n===e.length-1||";"===e[n]||"}"===e[n+1]||r.lean&&","!==e[n-1]&&"\n"===e[n])&&(r.out.push(function(e){var n=e[0],r=e[1];if(!t(n=$.reduce((function(e,t){return t(e)}),n.trim())))return[n,r.trim()];for(var o="",u=0,i=!1,a=0;a<r.length;a++){if(g(r[a])||a===r.length-1){var c=r.slice(u,a+1).trim();o+=(i?c:c.replace(/(^|[( ,])([-0-9.]+)([ ,)]|$)/g,"$1$2px$3").trim())+(")"===r[a]?"":" "),u=a+1}"("!==r[a]&&")"!==r[a-1]||(i="transform"!==n||0!==r.slice(u,a).indexOf("translate"))}return[n,o.trim().replace(/[\n ]+/g," ")]}(e.slice(r.prop,n+1).match(/\s*([a-z-]+)[\s:]*([^;]+)/).slice(1))),r.end=n+1,r.comma=r.value,r.value=r.prop=null,r.lean=!0)}(e,n,r)}}u.forEach((function(e){var t=e.match(/-(ms|o|webkit|moz)-/g);if(t){var n=e.replace(/-(ms|o|webkit|moz)-/,"");if(-1===u.indexOf(n))return"flexDirection"===n&&(v.flex="-"+t[1].toLowerCase()+"-flex"),void(m[n]=e)}}));var b=y();return b.create=y,b}));
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e=e||self).b=t()}(this,(function(){"use strict";var e="undefined"!=typeof document&&document.createElement("div"),t={flex:0,border:1,transform:1,"line-height":0,"box-shadow":1,"border-top":1,"border-left":1,"border-right":1,"border-bottom":1};function n(n){if(n in t)return t[n];try{return e.style[n]="1px",e.style.setProperty(n,"1px"),t[n]="1px"===e.style[n].slice(-3)}catch(e){return t[n]=!1}}var r=/^(o|O|ms|MS|Ms|moz|Moz|webkit|Webkit|WebKit)([A-Z])/,o=function(e){return e.replace(/(\B[A-Z])/g,"-$1").toLowerCase()},i=function(e){return e?e.hasOwnProperty("width")?e:i(Object.getPrototypeOf(e)):{}},u=["float"].concat(Object.keys("undefined"==typeof document?{}:i(document.documentElement.style))).filter((function(e,t,n){return-1===e.indexOf("-")&&"length"!==e&&n.indexOf(e)===t})).map((function(e){return e.match(r)?"-"+o(e):o(e)})).sort(),l=function(e,t){var n;return Object.assign(e,((n={})[t.split("-").map((function(e){return e[0]})).join("")]=t,n))},c=Object.assign(u.reduce(l,{}),["align-items","bottom","background-color","border-radius","box-shadow","background-image","color","display","float","flex-direction","font-family","font-size","height","justify-content","left","line-height","letter-spacing","margin","margin-bottom","margin-left","margin-right","margin-top","opacity","padding","padding-bottom","padding-left","padding-right","padding-top","right","top","text-align","text-decoration","text-transform","width"].reduce(l,{}));function a(e){return c[e]||e}var s=window&&"object"==typeof window.document&&window.document,f=function(e,t){return t?function(t){return e.indexOf(t.toLowerCase())>-1}:function(t){return e.indexOf(t)>-1}},p=f("abcdefghijklmnopqrstuvwxyz-"),d=f("abcdefghijklmnopqrstuvwxyz0123456789-_",!0),g=f("'\""),m=f(" :"),h=f(" ,)"),v=Object.create(null,{}),b=Object.create(null,{}),x=function(){return"bss"+("000000"+(Math.random()*Math.pow(36,6)|0).toString(36)).slice(-6)};function y(e){void 0===e&&(e={});var t=e.style;void 0===t&&(t=s&&s.querySelector&&s.querySelector(".bss_style")||s.createElement("style"));var r=e.prefix;void 0===r&&(r=t&&t.getAttribute("id")||x());var o=e.append;void 0===o&&(o=!0);var i={},l=[],c=[],f=y();return f.count=0,f.rules=t&&t.textContent&&t.textContent.split(f.prefix+"{}")||[],f.debug=!1,f.dev=!1,f.prefix=r,f.properties=u,f.at=function(e){return c.unshift("function"==typeof e?e:function(t){return e[t.slice(1)]||t})},f.prop=function(e){return l.unshift(e)},f.create=y,f.ssr=function(e){return'<style class="bss_style" id="'+f.prefix+'">'+f.rules.join(f.prefix+"{}")+"</style>"},f.global=function(){q(j(f.apply(f,arguments).content).trim(),"__raw").forEach((function(e){return w(e.replace(/.__raw/g,"").trim())}))},f.prop((function(e){if(-1===u.indexOf(e)){if(v[e])return f.debug&&console.log(e,"prefixed to",v[e]),v[e];f.debug&&console.log(e,"not found")}return e})),f.prop(a),t&&(t.id=f.prefix),f;function b(){return this.className?this.className:(this.className=f.prefix+ ++f.count,q(j(this.content).trim(),this.className).forEach(w),this.className)}function y(e){return function(t){for(var n=[],r=arguments.length-1;r-- >0;)n[r]=arguments[r+1];for(var o=(e||"")+t[0],u=1;u<t.length;u++){var l=n[u-1];o+=(l&&l.toString===b?l.content:"object"==typeof l?O(l):l)+t[u]}if(o in i)return i[o];var c=y("\n"+o+"\n");return c.toString=c.valueOf=b,c.content=o,i[o]=c,c}}function O(e){var t=f.prefix+ ++f.count,n="@keyframes "+t+"{"+Object.keys(e).reduce((function(t,n){return t+n+"{"+function(e){for(var t={prop:null,value:null,out:[],lean:!0,comma:0,end:0,quote:!1},n=0;n<=e.length;n++)z(e,n,e[n],t);return t.out}(e[n].trim())+"}"}),"")+"}";return n in i?i[n]:(i[n]=t,w(n),t)}function j(e){return e.replace(/\/\/.*?(\n|$)/g,"\n").replace(/\/\*[\s\S]*?\*\//g,"")}function w(e){o&&(t&&s.head&&s.head.appendChild(t),o=!1);var n=0===e.indexOf("@import")?0:f.rules.length;if(0===n?f.rules.unshift(e):f.rules.push(e),f.dev&&t)t.textContent=f.rules.map(k).join("\n");else if(t&&t.sheet)try{t.sheet.insertRule(e,n)}catch(e){f.debug&&console.log("Ignored error:",e)}}function k(e){return e.replace(/{/g," {\n").replace(/([;{])\n*/g,"$1\n  ").replace(/(.*):(.*);/g,"$1: $2;").replace(/[\s]*}/g,"\n}\n").replace(/,\s*/g,", ").replace(/@.*{[\s\S]*?}[\s]*}/g,(function(e){return e.split("\n").reduce((function(e,t,n,r){return e+(n<r.length-1?"\n":"")+(n>1&&n<r.length-2?"  ":"")+t}),"")})).trim().replace("}\n\n}","}\n}")}function q(e,t){for(var n=[],r={prop:null,value:null,out:[],lean:!0,comma:0,end:0,quote:!1},o=[],i=!1,u=!1,l=!1,a=0;a<e.length;a++)if(a>0&&l&&!d(e[a])&&(t=e.slice(1,a)+"-"+t,l=!1),l||0===a&&"."===e[a])l=!0;else if(z(e,a,e[a],r),"}"===e[a]||a===e.length-1)$(i||u||n,a,t,r,o),i&&!o.length&&((u||n).push(i.selector+"{"+i.join("")+"}"),i=!1),u&&!o.length&&(n.push(u.selector+"{"+u.join("")+"}"),u=!1),o.pop();else if("{"===e[a]){var s=e.slice(r.end,a).trim();$(i||u||n,a,t,r,o),r.prop=r.value=null,0===s.indexOf("@supports")?u=Object.assign([],{selector:s}):"@"===s[0]?i=Object.assign([],{selector:c.reduce((function(e,t){return t(e)}),s.trim())}):o.push(s)}return n}function $(e,t,n,r,o){var i=r.out.length&&r.out.map((function(e){return e.join(":")})).join(";");i&&e.push((o.length&&"&"===o[0][0]||0===(!e.selector||e.selector.indexOf("@keyframes "))?"":"."+n+(o.length&&":"!==o[0][0]?" ":""))+o.join(" ").replace(/&/g,"."+n).replace(/ :/g,":")+"{"+i+";}"),r.end=t+1,r.out=[]}function z(e,t,r,o){!o.value&&null!==o.prop&&o.lean&&":"===r&&(o.lean=!1),o.value||null===o.prop||","!==r?!o.value&&null===o.prop&&p(r)?o.prop=t:"number"==typeof o.prop&&(t===e.length-1||!o.value&&(m(r)||o.lean&&"\n"===r))&&(o.value=t+1):(o.value=o.comma,o.prop=o.out[o.out.length-1][0]),function(e,t,r,o){o.value&&g(r)&&(o.quote=!o.quote);!o.quote&&null!==o.prop&&(t===e.length-1||";"===r||"}"===e[t+1]||o.lean&&","!==e[t-1]&&"\n"===r)&&(o.out.push(function(e){var t=e[0],r=e[1];t=l.reduce((function(e,t){return t(e)}),t.trim());for(var o="",i=0,u="px",c=0;c<r.length;c++){if(h(r[c])||c===r.length-1){var a=r.slice(i,c+1).trim();o+=(u&&n(t)?a.replace(/(^|[( ,])([-0-9.]+)([ ,)]|$)/g,"$1$2"+u+"$3").trim():a)+(","===r[c]?"":" "),i=c+1}"("!==r[c]&&")"!==r[c-1]||(u=0===r.slice(i,c).indexOf("translate")?"px":0===r.slice(i,c).indexOf("rotate")?"deg":"")}return[t,o.trim().replace(/[\n ]+/g," ")]}(e.slice(o.prop,t+1).match(/\s*([a-z-]+)[\s:]*([^;]+)/).slice(1))),o.end=t+1,o.comma=o.value,o.value=o.prop=null,o.lean=!0)}(e,t,r,o)}}u.forEach((function(e){var t=e.match(/-(ms|o|webkit|moz)-/g);if(t){var n=e.replace(/-(ms|o|webkit|moz)-/,"");if(-1===u.indexOf(n))return"flexDirection"===n&&(b.flex="-"+t[1].toLowerCase()+"-flex"),void(v[n]=e)}}));var O=y();return O.create=y,O}));
 //# sourceMappingURL=bss.min.js.map

lib/create.js

@@ -30,49 +30,16 @@ import px from './px.js'
 export default function bss({
-  root = doc && doc.documentElement.style,
-  style = doc && typeof doc.querySelector === 'function' && doc.querySelector('.bss_style') || doc.createElement('style'),
-  sheet = style && style.sheet,
+  style = doc && doc.querySelector && doc.querySelector('.bss_style') || doc.createElement('style'),
   prefix = style && style.getAttribute('id') || randomId(),
-  charset
+  append = true
 } = {}) {
-  const cache = Map()
-  const supportsVar = root && typeof CSS !== 'undefined' && CSS.supports('color', 'var(--var)')
-
-  const transforms = []
+  const cache = {}
       , props = []
       , ats = []
 
-  let imports = 0
+  const b = bss()
 
-  function b(xs, ...args) {
-    const x = cache.get(xs) || instance()
-    x.classes = [x.name]
-    if (cache.has(xs)) {
-      args.forEach((v, i) => classes(x, v) || setVar(x.name + '-' + (i + 1), v))
-      return x
-    }
-
-    let s = xs[0]
-    for (let i = 1; i < xs.length; i++) {
-      const value = args[i - 1]
-      if (!classes(x, value)) {
-        const prop = props.reduce((acc, fn) => fn(acc), (s.match(/[;\s]\s+([a-z-]+)[:\s].*$/) || [])[1])
-        s += setVar(x.name + '-' + i, value, prop, suffix(prop, s))
-      }
-      s += xs[i]
-    }
-
-    parse(removeComments(s), x).forEach(insert)
-
-    cache.set(xs, x)
-
-    return x
-  }
-
   b.count = 0
   b.rules = style && style.textContent && style.textContent.split(b.prefix + '{}') || []
-  b.rules.vars = []
-  b.vars = {}
   b.debug = false
   b.dev = false
-  b.charset = charset
   b.prefix = prefix
@@ -82,5 +49,5 @@ b.properties = properties
   b.prop = fn => props.unshift(fn)
-  b.transform = fn => transforms.unshift(fn)
   b.create = bss
   b.ssr = ssr
+  b.global = global
 
@@ -90,3 +57,2 @@ b.prop(vendor)
 
-  style && doc.head && doc.head.appendChild(style)
   style && (style.id = b.prefix)
@@ -96,38 +62,64 @@
 
-  function ssr(str) {
-    const index = imports + (b.charset ? 1 : 0)
-    const rules = b.rules.slice(0, index)
-      .concat(
-        (str.match(new RegExp(b.prefix + '[0-9]+', 'g')) || [])
-        .filter((x, i, xs) => xs.indexOf(x) === i)
-        .map(x => b.rules[index + parseInt(x.slice(b.prefix.length)) - 1])
-      ).join(b.prefix + '{}')
+  function global() {
+    const style = b.apply(b, arguments)
+    parse(removeComments(style.content).trim(), '__raw').forEach(x =>
+      insert(x.replace(/.__raw/g, '').trim())
+    )
+  }
 
-    return {
-      sheet: '<style class="bss_style" id="' + b.prefix + '">' + rules + '</style>',
-      vars: Object.entries(b.vars).map(([k, v]) => '--' + k + ':' + v.value + ';')
-    }
+  function ValueOf() {
+    if (this.className)
+      return this.className
+
+    this.className = b.prefix + ++b.count
+    parse(removeComments(this.content).trim(), this.className).forEach(insert)
+    return this.className
   }
 
-  function classes(x, value) {
-    if (value && value.classes) {
-      x.classes.push(...value.classes)
-      return true
+  function bss(pre) {
+    return function(xs, ...args) {
+      let s = (pre || '') + xs[0]
+      for (let i = 1; i < xs.length; i++) {
+        const value = args[i - 1]
+        s += (value && value.toString === ValueOf
+          ? value.content
+          : typeof value === 'object'
+            ? keyframes(value)
+            : value) + xs[i]
+      }
+
+      if (s in cache)
+        return cache[s]
+
+      const x = bss('\n' + s + '\n')
+      x.toString = x.valueOf = ValueOf
+      x.content = s
+
+      cache[s] = x
+
+      return x
     }
-    if (Array.isArray(value)) {
-      x.classes.push(...value.map(v => x.classes).flat())
-      return true
-    }
   }
 
-  function instance() {
-    const x = {
-      name: (b.prefix + ++b.count),
-      classes: [],
-      toString: () => x.classes.join(' '),
-      valueOf: () => x.classes.join(' ')
-    }
-    return x
+  function ssr(str) {
+    return '<style class="bss_style" id="' + b.prefix + '">' + b.rules.join(b.prefix + '{}') + '</style>'
   }
 
+  function keyframes(x) {
+    const name = b.prefix + ++b.count
+    const content = '@keyframes ' + name + '{' +
+      Object.keys(x).reduce((acc, key) =>
+        acc + key + '{' + propsParse(x[key].trim()) + '}'
+      , '')
+    + '}'
+
+    if (content in cache)
+      return cache[content]
+
+    cache[content] = name
+    insert(content)
+
+    return name
+  }
+
   function vendor(x) {
@@ -144,14 +136,2 @@ if (properties.indexOf(x) === -1) {
 
-  function suffix(prop, s) {
-    if (prop === 'transform') {
-      return s.match(/translate(3D|X|Y)?\([^)]*$/)
-        ? 'px'
-        : s.match(/rotate(3D|X|Y)?\([^)]*$/)
-          ? 'deg'
-          : ''
-    }
-
-    return px(prop) && !s.match(/\([^)]*$/) ? 'px' : ''
-  }
-
   function removeComments(str) {
@@ -161,73 +141,18 @@ return str.replace(/\/\/.*?(\n|$)/g, '\n').replace(/\/\*[\s\S]*?\*\//g, '')
 
-  function getValue(value, suffix) {
-    return value + (value.match(/[^-0-9.]/) ? '' : suffix)
-  }
-
-  function setVar(name, raw, prop, suffix = '') {
-    const x = b.vars[name] || (b.vars[name] = {
-      name, prop, suffix,
-      change: v => updateVar(x, prop, transforms.reduce((acc, fn) => fn(acc, x.prop, x.change), v))
-    })
-
-    x.change(raw)
-    x.raw = raw
-    return 'var(--' + name + ')'
-  }
-
-  function updateVar(x, prop, value) {
-    value = getValue(String(value), x.suffix)
-    if (x.value !== value) {
-      x.value = value
-      supportsVar
-        ? root.setProperty('--' + x.name, value)
-        : x.raw && update(x.index, x.name, prop, value)
+  function insert(rule) {
+    if (append) {
+      style && doc.head && doc.head.appendChild(style)
+      append = false
     }
 
-    return x.value
-  }
-
-  function update(index, name, prop, value) {
-    index = index + imports + (b.charset ? 1 : 0)
-    if (b.dev) {
-      style.textContent = replaceVars(
-        (b.charset ? [b.charset] : []).concat(b.rules).map(pretty).join('\n'),
-        b.rules.vars[index],
-        index
-      )
-    } else {
-      try {
-        style.sheet.deleteRule(index)
-        style.sheet.insertRule(replaceVars(b.rules[index], b.rules.vars[index], index), index)
-      } catch (e) {
-        b.debug && console.log('Ignored error:', e)
-      }
-    }
-  }
-
-  function replaceVars(s, vars, index) {
-    index = index + imports + (b.charset ? 1 : 0)
-    return vars.reduce((acc, x) =>
-      acc.replace(x, b.vars[x.slice(6, -1)].value)
-    , s)
-  }
-
-  function insert(rule) {
     const isImport = rule.indexOf('@import') === 0
         , index = isImport ? 0 : b.rules.length
-        , vars = !supportsVar && rule.match(/var\(--[a-z0-9-]+\)/g) || []
 
-    vars.forEach(x => b.vars[x.slice(6, -1)].index = index)
-    imports += isImport ? 1 : 0
     index === 0 ? b.rules.unshift(rule) : b.rules.push(rule)
-    index === 0 ? b.rules.vars.unshift(vars) : b.rules.vars.push(vars)
 
     if (b.dev && style) {
-      style.textContent = replaceVars(
-        (b.charset ? [b.charset] : []).concat(b.rules).map(pretty).join('\n'),
-        vars,
-        index
-      )
+      style.textContent = b.rules.map(pretty).join('\n')
     } else if (style && style.sheet) {
       try {
-        style.sheet.insertRule(replaceVars(rule, vars, index), index + (b.charset ? 1 : 0))
+        style.sheet.insertRule(rule, index)
       } catch (e) {
@@ -264,3 +189,3 @@ b.debug && console.log('Ignored error:', e)
       if (i > 0 && name && !isClass(s[i])) {
-        x.name = s.slice(1, i) + '-' + x.name
+        x = s.slice(1, i) + '-' + x
         name = false
@@ -272,6 +197,6 @@ }
       }
-      propsParseLoop(s, i, props)
+      propsParseLoop(s, i, s[i], props)
 
       if (s[i] === '}' || i === s.length - 1) {
-        parseAddProps(at || supports || rules, i, x.name, props, level)
+        parseAddProps(at || supports || rules, i, x, props, level)
 
@@ -289,3 +214,3 @@ if (at && !level.length) {
         const selector = s.slice(props.end, i).trim()
-        parseAddProps(at || supports || rules, i, x.name, props, level)
+        parseAddProps(at || supports || rules, i, x, props, level)
         props.prop = props.value = null
@@ -306,4 +231,3 @@ selector.indexOf('@supports') === 0
     content && xs.push(
-      (
-       (!level.length || level[0][0] !== '&') && (!xs.selector || xs.selector.indexOf('@keyframes ')) !== 0
+      ((!level.length || level[0][0] !== '&') && (!xs.selector || xs.selector.indexOf('@keyframes ')) !== 0
         ? '.' + name + (level.length && level[0][0] !== ':' ? ' ' : '')
@@ -322,3 +246,3 @@ : ''
     for (let i = 0; i <= s.length; i++)
-      propsParseLoop(s.trim(), i, x)
+      propsParseLoop(s, i, s[i], x)
 
@@ -340,21 +264,21 @@ return x.out
 
-  function propsParseLoop(s, i, x) {
-    if (!x.value && x.prop !== null && x.lean && s[i] === ':')
+  function propsParseLoop(s, i, v, x) {
+    if (!x.value && x.prop !== null && x.lean && v === ':')
       x.lean = false
-    if (!x.value && x.prop !== null && s[i] === ',') {
+    if (!x.value && x.prop !== null && v === ',') {
       x.value = x.comma
       x.prop = x.out[x.out.length - 1][0]
-    } else if (!x.value && x.prop === null && isProp(s[i])) {
+    } else if (!x.value && x.prop === null && isProp(v)) {
       x.prop = i
-    } else if (typeof x.prop === 'number' && (i === s.length - 1 || (!x.value && (isPropEnd(s[i]) || (x.lean && s[i] === '\n'))))) {
+    } else if (typeof x.prop === 'number' && (i === s.length - 1 || (!x.value && (isPropEnd(v) || (x.lean && v === '\n'))))) {
       x.value = i + 1
     }
-    propAdd(s, i, x)
+    propAdd(s, i, v, x)
   }
 
-  function propAdd(s, i, x) {
-    if (x.value && isQuote(s[i]))
+  function propAdd(s, i, v, x) {
+    if (x.value && isQuote(v))
       x.quote = !x.quote
 
-    if (!x.quote && x.prop !== null && (i === s.length - 1 || s[i] === ';' || s[i + 1] === '}' || (x.lean && s[i - 1] !== ',' && s[i] === '\n'))) {
+    if (!x.quote && x.prop !== null && (i === s.length - 1 || v === ';' || s[i + 1] === '}' || (x.lean && s[i - 1] !== ',' && v === '\n'))) {
       x.out.push(
@@ -372,40 +296,27 @@ propParse(
 
-  function propParse([prop, s]) {
-    prop = props.reduce((acc, fn) => fn(acc), prop.trim())
+  function propParse([key, value]) {
+    key = props.reduce((acc, fn) => fn(acc), key.trim())
 
-    if (!px(prop))
-      return [prop, s.trim()]
-
     let result = ''
     let end = 0
-    let ignore = false
-    for (let i = 0; i < s.length; i++) {
-      if (isValueSep(s[i]) || i === s.length - 1) {
-        const last = s.slice(end, i + 1).trim()
-        result += (ignore ? last : last.replace(/(^|[( ,])([-0-9.]+)([ ,)]|$)/g, '$1$2px$3').trim()) + (s[i] === ')' ? '' : ' ')
+    let unit = 'px'
+    for (let i = 0; i < value.length; i++) {
+      if (isValueSep(value[i]) || i === value.length - 1) {
+        const last = value.slice(end, i + 1).trim()
+        result += ((unit && px(key))
+          ? last.replace(/(^|[( ,])([-0-9.]+)([ ,)]|$)/g, '$1$2' + unit + '$3').trim()
+          : last) + (value[i] === ',' ? '' : ' ')
         end = i + 1
       }
-      if (s[i] === '(' || s[i - 1] === ')')
-        ignore = prop !== 'transform' || s.slice(end, i).indexOf('translate') !== 0
+      if (value[i] === '(' || value[i - 1] === ')') {
+        unit = value.slice(end, i).indexOf('translate') === 0
+          ? 'px'
+          : value.slice(end, i).indexOf('rotate') === 0
+            ? 'deg'
+            : ''
+      }
     }
 
-    return [prop, result.trim().replace(/[\n ]+/g, ' ')]
+    return [key, result.trim().replace(/[\n ]+/g, ' ')]
   }
-
 }
-
-function Map() {
-  let keys = []
-    , values = []
-
-  const map = {
-    has: x => keys.indexOf(x) !== -1,
-    get: x => values[keys.indexOf(x)],
-    set: (x, v) => (keys.push(x), values.push(v), map),
-    delete: x => keys.indexOf(x) !== -1 && values.splice(keys.indexOf(values), 1),
-    forEach: fn => keys.forEach((k, i) => fn(values[i], k, map)),
-    clear: () => (keys = [], values = [], undefined)
-  }
-
-  return map
-}

lib/px.js

 const el = typeof document !== 'undefined' && document.createElement('div')
 
-export default function(x, cache = {
+const cache = {
   flex: 0,
   border: 1,
+  transform: 1,
   'line-height': 0,
@@ -12,10 +13,15 @@ 'box-shadow': 1,
   'border-bottom': 1
-}) {
+}
+
+export default function(x) {
+  if (x in cache)
+    return cache[x]
+
   try {
     el.style[x] = '1px'
     el.style.setProperty(x, '1px')
-    return el.style[x].slice(-3) === '1px'
+    return cache[x] = el.style[x].slice(-3) === '1px'
   } catch (err) {
-    return false
+    return cache[x] = false
   }
 }

package.json

 {
   "name": "bss",
-  "version": "3.0.0-beta2",
+  "version": "3.0.0-beta3",
   "description": "Better Style Sheets",
@@ -5,0 +5,0 @@ "main": "dist/bss.js",

tests/index.js

@@ -13,2 +13,3 @@ const o = require('ospec')
     },
+    getAttribute: () => null,
     style: {
@@ -52,2 +53,3 @@ setProperty: (prop) => {
 global.window = {
+  document: global.document,
   navigator: {
@@ -64,22 +66,30 @@ userAgent: 'test'
 
-  o('Nested classes', () => {
-    const r = b`
-      ${
-        b`
-          c white
-          ${
-            b`
-              position relative
-            `
-          }
-        `
+  o('global', () => {
+    b.global`
+      html {
+        width 50
       }
-      bc blue
     `
-    o(r.classes.length).equals(3)
-    o(b.rules.pop().replace(/.*{/, '{')).equals('{background-color:blue;}')
-    o(b.rules.pop().replace(/.*{/, '{')).equals('{color:white;}')
-    o(b.rules.pop().replace(/.*{/, '{')).equals('{position:relative;}')
+    o(b.rules.pop()).equals('html{width:50px;}')
   })
 
+  o('Nested classes', () => {
+    b`
+      ${ b`
+        c white
+        ${ b`
+          position relative
+          ${ b`
+            font-size 20
+          `}
+        `}
+      `}
+      bc blue
+    `.toString()
+
+    o(b.rules.shift().replace(/.*{/, '{')).equals(
+      '{color:white;position:relative;font-size:20px;background-color:blue;}'
+    )
+  })
+
   o('Pseudo works', () => {
@@ -90,3 +100,3 @@ b`
       }
-    `
+    `.toString()
     o(b.rules.pop()).equals(cn() + ':hover{opacity:0.5;}')
@@ -99,4 +109,4 @@ })
                 rotate(${ 'sdfk' })
-    `
-    o(b.rules.pop()).equals(cn() + '{transform:translateY(20px);rotate:(var(--' + cn().slice(1) + '-1));}')
+    `.toString()
+    o(b.rules.pop()).equals(cn() + '{transform:translateY(20px);rotate:(sdfk);}')
   })
@@ -108,4 +118,4 @@
                  rotate(${ 'sdfk' });
-    `
-    o(b.rules.pop()).equals(cn() + '{transform:translateY(20px) rotate(var(--' + cn().slice(1) + '-1));}')
+    `.toString()
+    o(b.rules.pop()).equals(cn() + '{transform:translateY(20px) rotate(sdfk);}')
   })
@@ -121,4 +131,6 @@
       position:
-      absolute`
-    o(b.rules.pop()).equals(cn() + '{position:absolute;position:absolute;position:absolute;position:absolute;position:absolute;position:absolute;}')
+      absolute`.toString()
+    o(b.rules.pop()).equals(cn() +
+      '{position:absolute;position:absolute;position:absolute;position:absolute;position:absolute;position:absolute;}'
+    )
   })
@@ -129,3 +141,3 @@
       transform: translate(-50%, -50%)
-                  rotate(-45deg);`
+                  rotate(-45deg);`.toString()
     o(b.rules.pop()).equals(cn() + '{position:absolute;transform:translate(-50%, -50%) rotate(-45deg);}')
@@ -137,3 +149,3 @@ })
       transform: translate(-50%, -50%) // This is multi line
-                  rotate(-45deg); // And here it ends`
+                  rotate(-45deg); // And here it ends`.toString()
     o(b.rules.pop()).equals(cn() + '{position:absolute;transform:translate(-50%, -50%) rotate(-45deg);}')
@@ -149,3 +161,3 @@ })
       }
-    `
+    `.toString()
     o(b.rules.pop()).equals('@keyframes wat{from{margin-top:50px;}50%{margin-top:150px;}to{margin-top:100px;}}')
@@ -161,6 +173,25 @@ })
       }
-    `
+    `.toString()
     o(b.rules.pop()).equals('@media screen and (min-width: 900px){' + cn() + ' article{padding:1rem 3rem;}}')
   })
 
+  o('@media @media', () => {
+    b`
+      @media screen and (min-width: 900px) {
+        article {
+          padding: 1rem 3rem;
+        }
+      }
+
+      @media screen and (min-width: 1500px) {
+        article {
+          padding: 2rem 6rem;
+        }
+      }
+    `.toString()
+
+    o(b.rules.pop()).equals('@media screen and (min-width: 1500px){' + cn() + ' article{padding:2rem 6rem;}}')
+    o(b.rules.pop()).equals('@media screen and (min-width: 900px){' + cn() + ' article{padding:1rem 3rem;}}')
+  })
+
   o('@supports', () => {
@@ -173,3 +204,3 @@ b`
       }
-    `
+    `.toString()
     o(b.rules.pop()).equals('@supports (display: flex){' + cn() + ' article{display:flex;}}')
@@ -187,34 +218,33 @@ })
       }
-    `
-    o(b.rules.pop()).equals('@supports (display: flex){@media screen and (min-width: 900px){' + cn() + ' article{display:flex;}}}')
+    `.toString()
+    o(b.rules.pop()).equals(
+      '@supports (display: flex){@media screen and (min-width: 900px){' + cn() + ' article{display:flex;}}}'
+    )
   })
 
-/*
-  o('Inline animation', () => {
+
+  o('Auto px', () => {
     b`
-      animation 1s {
-        from { margin-bottom 0 },
-        50% { margin-top 50 },
-        to { margin-top 100 }
-      }
-    `
-    o(b.rules.pop()).equals('')
+      bc rgba(200,200,200,0.5)
+      border 10 solid rgb(255,0,0)
+      transform translate(60) rotate(40)
+    `.toString()
+    o(b.rules.pop()).equals(cn() + '{'
+      + 'background-color:rgba(200,200,200,0.5);'
+      + 'border:10px solid rgb(255,0,0);'
+      + 'transform:translate(60px) rotate(40deg);'
+      + '}'
+    )
   })
 
-  o('Multiple inline animation', () => {
-    b`
-      animation 1s {
-        from { margin-top 50px }
-        50%  { margin-top 150px }
-        to   { margin-top 100px }
-      }, {
-        20%  { transform translateX(50px) }
-        50%  { transform translateX(150px) }
-        80%  { transform translateX(100px) }
-      }
-    `
-    o(b.rules.pop()).equals('')
+  o('Inline animation', () => {
+    b`animation 1s ${{
+      from: 'margin-bottom 0',
+      '50%': 'margin-top 50',
+      to: 'margin-top 100'
+    }}
+    `.toString()
+    o(b.rules.pop()).equals(cn() + '{animation:1s ' + (b.prefix + (b.count - 1)) + ';}')
   })
-*/
 
 })

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

Worsened metrics

Total package byte prevSize

139467

decreased by-17.22%

Lines of code

1561

decreased by-10.95%

No dependency changes