css-to-react-native - npm Package Compare versions

Comparing version 2.3.2 to 3.0.0

index.js

 'use strict';
 
-var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+Object.defineProperty(exports, '__esModule', {
+  value: true
+});
 
-var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
-
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
-function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
 function _interopDefault(ex) {
-  return ex && (typeof ex === 'undefined' ? 'undefined' : _typeof(ex)) === 'object' && 'default' in ex ? ex['default'] : ex;
+  return ex && typeof ex === 'object' && 'default' in ex ? ex['default'] : ex;
 }
 
 var parse = require('postcss-value-parser');
+
 var parse__default = _interopDefault(parse);
-var cssColorKeywords = _interopDefault(require('css-color-keywords'));
+
 var camelizeStyleName = _interopDefault(require('camelize'));
 
+var cssColorKeywords = _interopDefault(require('css-color-keywords'));
+
 var matchString = function matchString(node) {
@@ -40,2 +35,3 @@ if (node.type !== 'string') return null;
   }
+
   return null;
@@ -46,11 +42,11 @@ };
 var autoRe = /^(auto)$/i;
-var identRe = /(^-?[_a-z][_a-z0-9-]*$)/i;
-// Note if these are wrong, you'll need to change index.js too
-var numberRe = /^([+-]?(?:\d*\.)?\d+(?:[Ee][+-]?\d+)?)$/;
-// Note lengthRe is sneaky: you can omit units for 0
-var lengthRe = /^(0$|(?:[+-]?(?:\d*\.)?\d+(?:[Ee][+-]?\d+)?)(?=px$))/;
-var unsupportedUnitRe = /^([+-]?(?:\d*\.)?\d+(?:[Ee][+-]?\d+)?(ch|em|ex|rem|vh|vw|vmin|vmax|cm|mm|in|pc|pt))$/;
-var angleRe = /^([+-]?(?:\d*\.)?\d+(?:[Ee][+-]?\d+)?(?:deg|rad))$/;
-var percentRe = /^([+-]?(?:\d*\.)?\d+(?:[Ee][+-]?\d+)?%)$/;
+var identRe = /(^-?[_a-z][_a-z0-9-]*$)/i; // Note if these are wrong, you'll need to change index.js too
 
+var numberRe = /^([+-]?(?:\d*\.)?\d+(?:e[+-]?\d+)?)$/i; // Note lengthRe is sneaky: you can omit units for 0
+
+var lengthRe = /^(0$|(?:[+-]?(?:\d*\.)?\d+(?:e[+-]?\d+)?)(?=px$))/i;
+var unsupportedUnitRe = /^([+-]?(?:\d*\.)?\d+(?:e[+-]?\d+)?(ch|em|ex|rem|vh|vw|vmin|vmax|cm|mm|in|pc|pt))$/i;
+var angleRe = /^([+-]?(?:\d*\.)?\d+(?:e[+-]?\d+)?(?:deg|rad))$/i;
+var percentRe = /^([+-]?(?:\d*\.)?\d+(?:e[+-]?\d+)?%)$/i;
+
 var noopToken = function noopToken(predicate) {
@@ -68,12 +64,12 @@ return function (node) {
 
-var regExpToken = function regExpToken(regExp) {
-  var transform = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : String;
+var regExpToken = function regExpToken(regExp, transform) {
+  if (transform === void 0) {
+    transform = String;
+  }
+
   return function (node) {
     if (node.type !== 'word') return null;
-
     var match = node.value.match(regExp);
     if (match === null) return null;
-
     var value = transform(match[1]);
-
     return value;
@@ -83,35 +79,26 @@ };
 
-var tokens = {
-  SPACE: noopToken(function (node) {
-    return node.type === 'space';
-  }),
-  SLASH: noopToken(function (node) {
-    return node.type === 'div' && node.value === '/';
-  }),
-  COMMA: noopToken(function (node) {
-    return node.type === 'div' && node.value === ',';
-  }),
-  WORD: valueForTypeToken('word'),
-  NONE: regExpToken(noneRe),
-  AUTO: regExpToken(autoRe),
-  NUMBER: regExpToken(numberRe, Number),
-  LENGTH: regExpToken(lengthRe, Number),
-  UNSUPPORTED_LENGTH_UNIT: regExpToken(unsupportedUnitRe),
-  ANGLE: regExpToken(angleRe),
-  PERCENT: regExpToken(percentRe),
-  IDENT: regExpToken(identRe),
-  STRING: matchString,
-  COLOR: matchColor,
-  LINE: regExpToken(/^(none|underline|line-through)$/i)
-};
-
-var NONE = tokens.NONE,
-    COLOR = tokens.COLOR,
-    LENGTH = tokens.LENGTH,
-    UNSUPPORTED_LENGTH_UNIT = tokens.UNSUPPORTED_LENGTH_UNIT,
-    SPACE = tokens.SPACE;
-
-
+var SPACE = noopToken(function (node) {
+  return node.type === 'space';
+});
+var SLASH = noopToken(function (node) {
+  return node.type === 'div' && node.value === '/';
+});
+var COMMA = noopToken(function (node) {
+  return node.type === 'div' && node.value === ',';
+});
+var WORD = valueForTypeToken('word');
+var NONE = regExpToken(noneRe);
+var AUTO = regExpToken(autoRe);
+var NUMBER = regExpToken(numberRe, Number);
+var LENGTH = regExpToken(lengthRe, Number);
+var UNSUPPORTED_LENGTH_UNIT = regExpToken(unsupportedUnitRe);
+var ANGLE = regExpToken(angleRe, function (angle) {
+  return angle.toLowerCase();
+});
+var PERCENT = regExpToken(percentRe);
+var IDENT = regExpToken(identRe);
+var STRING = matchString;
+var COLOR = matchColor;
+var LINE = regExpToken(/^(none|underline|line-through)$/i);
 var BORDER_STYLE = regExpToken(/^(solid|dashed|dotted)$/);
-
 var defaultBorderWidth = 1;
@@ -122,16 +109,21 @@ var defaultBorderColor = 'black';
 var border = function border(tokenStream) {
-  var borderWidth = void 0;
-  var borderColor = void 0;
-  var borderStyle = void 0;
+  var borderWidth;
+  var borderColor;
+  var borderStyle;
 
   if (tokenStream.matches(NONE)) {
     tokenStream.expectEmpty();
-    return { borderWidth: 0, borderColor: 'black', borderStyle: 'solid' };
+    return {
+      borderWidth: 0,
+      borderColor: 'black',
+      borderStyle: 'solid'
+    };
   }
 
   var partsParsed = 0;
+
   while (partsParsed < 3 && tokenStream.hasTokens()) {
     if (partsParsed !== 0) tokenStream.expect(SPACE);
 
-    if (borderWidth === undefined && tokenStream.matches(LENGTH) || tokenStream.matches(UNSUPPORTED_LENGTH_UNIT)) {
+    if (borderWidth === undefined && tokenStream.matches(LENGTH, UNSUPPORTED_LENGTH_UNIT)) {
       borderWidth = tokenStream.lastValue;
@@ -143,3 +135,3 @@ } else if (borderColor === undefined && tokenStream.matches(COLOR)) {
     } else {
-      tokenStream.throw();
+      tokenStream["throw"]();
     }
@@ -151,56 +143,47 @@
   tokenStream.expectEmpty();
-
   if (borderWidth === undefined) borderWidth = defaultBorderWidth;
   if (borderColor === undefined) borderColor = defaultBorderColor;
   if (borderStyle === undefined) borderStyle = defaultBorderStyle;
-
-  return { borderWidth: borderWidth, borderColor: borderColor, borderStyle: borderStyle };
+  return {
+    borderWidth: borderWidth,
+    borderColor: borderColor,
+    borderStyle: borderStyle
+  };
 };
 
-var LENGTH$1 = tokens.LENGTH,
-    UNSUPPORTED_LENGTH_UNIT$1 = tokens.UNSUPPORTED_LENGTH_UNIT,
-    PERCENT = tokens.PERCENT,
-    COLOR$1 = tokens.COLOR,
-    SPACE$1 = tokens.SPACE,
-    NONE$1 = tokens.NONE;
-
-
 var directionFactory = function directionFactory(_ref) {
   var _ref$types = _ref.types,
-      types = _ref$types === undefined ? [LENGTH$1, UNSUPPORTED_LENGTH_UNIT$1, PERCENT] : _ref$types,
+      types = _ref$types === void 0 ? [LENGTH, UNSUPPORTED_LENGTH_UNIT, PERCENT] : _ref$types,
       _ref$directions = _ref.directions,
-      directions = _ref$directions === undefined ? ['Top', 'Right', 'Bottom', 'Left'] : _ref$directions,
+      directions = _ref$directions === void 0 ? ['Top', 'Right', 'Bottom', 'Left'] : _ref$directions,
       _ref$prefix = _ref.prefix,
-      prefix = _ref$prefix === undefined ? '' : _ref$prefix,
+      prefix = _ref$prefix === void 0 ? '' : _ref$prefix,
       _ref$suffix = _ref.suffix,
-      suffix = _ref$suffix === undefined ? '' : _ref$suffix;
+      suffix = _ref$suffix === void 0 ? '' : _ref$suffix;
   return function (tokenStream) {
     var _ref2;
 
-    var values = [];
+    var values = []; // borderWidth doesn't currently allow a percent value, but may do in the future
 
-    // borderWidth doesn't currently allow a percent value, but may do in the future
-    values.push(tokenStream.expect.apply(tokenStream, _toConsumableArray(types)));
+    values.push(tokenStream.expect.apply(tokenStream, types));
 
     while (values.length < 4 && tokenStream.hasTokens()) {
-      tokenStream.expect(SPACE$1);
-      values.push(tokenStream.expect.apply(tokenStream, _toConsumableArray(types)));
+      tokenStream.expect(SPACE);
+      values.push(tokenStream.expect.apply(tokenStream, types));
     }
 
     tokenStream.expectEmpty();
-
     var top = values[0],
         _values$ = values[1],
-        right = _values$ === undefined ? top : _values$,
+        right = _values$ === void 0 ? top : _values$,
         _values$2 = values[2],
-        bottom = _values$2 === undefined ? top : _values$2,
+        bottom = _values$2 === void 0 ? top : _values$2,
         _values$3 = values[3],
-        left = _values$3 === undefined ? right : _values$3;
+        left = _values$3 === void 0 ? right : _values$3;
 
-
     var keyFor = function keyFor(n) {
-      return '' + prefix + directions[n] + suffix;
+      return "" + prefix + directions[n] + suffix;
     };
 
-    return _ref2 = {}, _defineProperty(_ref2, keyFor(0), top), _defineProperty(_ref2, keyFor(1), right), _defineProperty(_ref2, keyFor(2), bottom), _defineProperty(_ref2, keyFor(3), left), _ref2;
+    return _ref2 = {}, _ref2[keyFor(0)] = top, _ref2[keyFor(1)] = right, _ref2[keyFor(2)] = bottom, _ref2[keyFor(3)] = left, _ref2;
   };
@@ -210,18 +193,24 @@ };
 var parseShadowOffset = function parseShadowOffset(tokenStream) {
-  var width = tokenStream.expect(LENGTH$1);
-  var height = tokenStream.matches(SPACE$1) ? tokenStream.expect(LENGTH$1) : width;
+  var width = tokenStream.expect(LENGTH);
+  var height = tokenStream.matches(SPACE) ? tokenStream.expect(LENGTH) : width;
   tokenStream.expectEmpty();
-  return { width: width, height: height };
+  return {
+    width: width,
+    height: height
+  };
 };
 
 var parseShadow = function parseShadow(tokenStream) {
-  var offsetX = void 0;
-  var offsetY = void 0;
-  var radius = void 0;
-  var color = void 0;
+  var offsetX;
+  var offsetY;
+  var radius;
+  var color;
 
-  if (tokenStream.matches(NONE$1)) {
+  if (tokenStream.matches(NONE)) {
     tokenStream.expectEmpty();
     return {
-      offset: { width: 0, height: 0 },
+      offset: {
+        width: 0,
+        height: 0
+      },
       radius: 0,
@@ -233,12 +222,13 @@ color: 'black'
   var didParseFirst = false;
+
   while (tokenStream.hasTokens()) {
-    if (didParseFirst) tokenStream.expect(SPACE$1);
+    if (didParseFirst) tokenStream.expect(SPACE);
 
-    if (offsetX === undefined && tokenStream.matches(LENGTH$1, UNSUPPORTED_LENGTH_UNIT$1)) {
+    if (offsetX === undefined && tokenStream.matches(LENGTH, UNSUPPORTED_LENGTH_UNIT)) {
       offsetX = tokenStream.lastValue;
-      tokenStream.expect(SPACE$1);
-      offsetY = tokenStream.expect(LENGTH$1, UNSUPPORTED_LENGTH_UNIT$1);
+      tokenStream.expect(SPACE);
+      offsetY = tokenStream.expect(LENGTH, UNSUPPORTED_LENGTH_UNIT);
+      tokenStream.saveRewindPoint();
 
-      tokenStream.saveRewindPoint();
-      if (tokenStream.matches(SPACE$1) && tokenStream.matches(LENGTH$1, UNSUPPORTED_LENGTH_UNIT$1)) {
+      if (tokenStream.matches(SPACE) && tokenStream.matches(LENGTH, UNSUPPORTED_LENGTH_UNIT)) {
         radius = tokenStream.lastValue;
@@ -248,6 +238,6 @@ } else {
       }
-    } else if (color === undefined && tokenStream.matches(COLOR$1)) {
+    } else if (color === undefined && tokenStream.matches(COLOR)) {
       color = tokenStream.lastValue;
     } else {
-      tokenStream.throw();
+      tokenStream["throw"]();
     }
@@ -258,6 +248,8 @@
 
-  if (offsetX === undefined) tokenStream.throw();
-
+  if (offsetX === undefined) tokenStream["throw"]();
   return {
-    offset: { width: offsetX, height: offsetY },
+    offset: {
+      width: offsetX,
+      height: offsetY
+    },
     radius: radius !== undefined ? radius : 0,
@@ -282,9 +274,2 @@ color: color !== undefined ? color : 'black'
 
-var NONE$2 = tokens.NONE,
-    AUTO = tokens.AUTO,
-    NUMBER = tokens.NUMBER,
-    LENGTH$2 = tokens.LENGTH,
-    SPACE$2 = tokens.SPACE;
-
-
 var defaultFlexGrow = 1;
@@ -295,26 +280,36 @@ var defaultFlexShrink = 1;
 var flex = function flex(tokenStream) {
-  var flexGrow = void 0;
-  var flexShrink = void 0;
-  var flexBasis = void 0;
+  var flexGrow;
+  var flexShrink;
+  var flexBasis;
 
-  if (tokenStream.matches(NONE$2)) {
+  if (tokenStream.matches(NONE)) {
     tokenStream.expectEmpty();
-    return { flexGrow: 0, flexShrink: 0, flexBasis: 'auto' };
+    return {
+      flexGrow: 0,
+      flexShrink: 0,
+      flexBasis: 'auto'
+    };
   }
 
   tokenStream.saveRewindPoint();
+
   if (tokenStream.matches(AUTO) && !tokenStream.hasTokens()) {
-    return { flexGrow: 1, flexShrink: 1, flexBasis: 'auto' };
+    return {
+      flexGrow: 1,
+      flexShrink: 1,
+      flexBasis: 'auto'
+    };
   }
+
   tokenStream.rewind();
+  var partsParsed = 0;
 
-  var partsParsed = 0;
   while (partsParsed < 2 && tokenStream.hasTokens()) {
-    if (partsParsed !== 0) tokenStream.expect(SPACE$2);
+    if (partsParsed !== 0) tokenStream.expect(SPACE);
 
     if (flexGrow === undefined && tokenStream.matches(NUMBER)) {
       flexGrow = tokenStream.lastValue;
+      tokenStream.saveRewindPoint();
 
-      tokenStream.saveRewindPoint();
-      if (tokenStream.matches(SPACE$2) && tokenStream.matches(NUMBER)) {
+      if (tokenStream.matches(SPACE) && tokenStream.matches(NUMBER)) {
         flexShrink = tokenStream.lastValue;
@@ -324,3 +319,3 @@ } else {
       }
-    } else if (flexBasis === undefined && tokenStream.matches(LENGTH$2)) {
+    } else if (flexBasis === undefined && tokenStream.matches(LENGTH, UNSUPPORTED_LENGTH_UNIT, PERCENT)) {
       flexBasis = tokenStream.lastValue;
@@ -330,3 +325,3 @@ } else if (flexBasis === undefined && tokenStream.matches(AUTO)) {
     } else {
-      tokenStream.throw();
+      tokenStream["throw"]();
     }
@@ -338,16 +333,14 @@
   tokenStream.expectEmpty();
-
   if (flexGrow === undefined) flexGrow = defaultFlexGrow;
   if (flexShrink === undefined) flexShrink = defaultFlexShrink;
   if (flexBasis === undefined) flexBasis = defaultFlexBasis;
-
-  return { flexGrow: flexGrow, flexShrink: flexShrink, flexBasis: flexBasis };
+  return {
+    flexGrow: flexGrow,
+    flexShrink: flexShrink,
+    flexBasis: flexBasis
+  };
 };
 
-var SPACE$3 = tokens.SPACE;
-
-
 var FLEX_WRAP = regExpToken(/(nowrap|wrap|wrap-reverse)/);
 var FLEX_DIRECTION = regExpToken(/(row|row-reverse|column|column-reverse)/);
-
 var defaultFlexWrap = 'nowrap';
@@ -357,8 +350,8 @@ var defaultFlexDirection = 'row';
 var flexFlow = function flexFlow(tokenStream) {
-  var flexWrap = void 0;
-  var flexDirection = void 0;
+  var flexWrap;
+  var flexDirection;
+  var partsParsed = 0;
 
-  var partsParsed = 0;
   while (partsParsed < 2 && tokenStream.hasTokens()) {
-    if (partsParsed !== 0) tokenStream.expect(SPACE$3);
+    if (partsParsed !== 0) tokenStream.expect(SPACE);
 
@@ -370,3 +363,3 @@ if (flexWrap === undefined && tokenStream.matches(FLEX_WRAP)) {
     } else {
-      tokenStream.throw();
+      tokenStream["throw"]();
     }
@@ -378,17 +371,13 @@
   tokenStream.expectEmpty();
-
   if (flexWrap === undefined) flexWrap = defaultFlexWrap;
   if (flexDirection === undefined) flexDirection = defaultFlexDirection;
-
-  return { flexWrap: flexWrap, flexDirection: flexDirection };
+  return {
+    flexWrap: flexWrap,
+    flexDirection: flexDirection
+  };
 };
 
-var SPACE$4 = tokens.SPACE,
-    IDENT = tokens.IDENT,
-    STRING = tokens.STRING;
+var fontFamily = function fontFamily(tokenStream) {
+  var fontFamily;
 
-
-var parseFontFamily = function parseFontFamily(tokenStream) {
-  var fontFamily = void 0;
-
   if (tokenStream.matches(STRING)) {
@@ -398,6 +387,7 @@ fontFamily = tokenStream.lastValue;
     fontFamily = tokenStream.expect(IDENT);
+
     while (tokenStream.hasTokens()) {
-      tokenStream.expect(SPACE$4);
+      tokenStream.expect(SPACE);
       var nextIdent = tokenStream.expect(IDENT);
-      fontFamily += ' ' + nextIdent;
+      fontFamily += " " + nextIdent;
     }
@@ -407,12 +397,7 @@ }
   tokenStream.expectEmpty();
-
-  return { fontFamily: fontFamily };
+  return {
+    fontFamily: fontFamily
+  };
 };
 
-var SPACE$5 = tokens.SPACE,
-    LENGTH$3 = tokens.LENGTH,
-    UNSUPPORTED_LENGTH_UNIT$2 = tokens.UNSUPPORTED_LENGTH_UNIT,
-    NUMBER$1 = tokens.NUMBER,
-    SLASH = tokens.SLASH;
-
 var NORMAL = regExpToken(/^(normal)$/);
@@ -422,3 +407,2 @@ var STYLE = regExpToken(/^(italic)$/);
 var VARIANT = regExpToken(/^(small-caps)$/);
-
 var defaultFontStyle = 'normal';
@@ -429,14 +413,12 @@ var defaultFontWeight = 'normal';
 var font = function font(tokenStream) {
-  var fontStyle = void 0;
-  var fontWeight = void 0;
-  var fontVariant = void 0;
-  // let fontSize;
-  var lineHeight = void 0;
-  // let fontFamily;
+  var fontStyle;
+  var fontWeight;
+  var fontVariant; // let fontSize;
 
+  var lineHeight; // let fontFamily;
+
   var numStyleWeightVariantMatched = 0;
+
   while (numStyleWeightVariantMatched < 3 && tokenStream.hasTokens()) {
-    if (tokenStream.matches(NORMAL)) {
-      /* pass */
-    } else if (fontStyle === undefined && tokenStream.matches(STYLE)) {
+    if (tokenStream.matches(NORMAL)) ;else if (fontStyle === undefined && tokenStream.matches(STYLE)) {
       fontStyle = tokenStream.lastValue;
@@ -450,21 +432,16 @@ } else if (fontWeight === undefined && tokenStream.matches(WEIGHT)) {
     }
-
-    tokenStream.expect(SPACE$5);
+    tokenStream.expect(SPACE);
     numStyleWeightVariantMatched += 1;
   }
 
-  var fontSize = tokenStream.expect(LENGTH$3, UNSUPPORTED_LENGTH_UNIT$2);
+  var fontSize = tokenStream.expect(LENGTH, UNSUPPORTED_LENGTH_UNIT);
 
   if (tokenStream.matches(SLASH)) {
-    if (tokenStream.matches(NUMBER$1)) {
-      lineHeight = fontSize * tokenStream.lastValue;
-    } else {
-      lineHeight = tokenStream.expect(LENGTH$3, UNSUPPORTED_LENGTH_UNIT$2);
-    }
+    lineHeight = tokenStream.expect(LENGTH, UNSUPPORTED_LENGTH_UNIT);
   }
 
-  tokenStream.expect(SPACE$5);
+  tokenStream.expect(SPACE);
 
-  var _parseFontFamily = parseFontFamily(tokenStream),
-      fontFamily = _parseFontFamily.fontFamily;
+  var _fontFamily = fontFamily(tokenStream),
+      fontFamily$1 = _fontFamily.fontFamily;
 
@@ -474,16 +451,35 @@ if (fontStyle === undefined) fontStyle = defaultFontStyle;
   if (fontVariant === undefined) fontVariant = defaultFontVariant;
-
-  var out = { fontStyle: fontStyle, fontWeight: fontWeight, fontVariant: fontVariant, fontSize: fontSize, fontFamily: fontFamily };
+  var out = {
+    fontStyle: fontStyle,
+    fontWeight: fontWeight,
+    fontVariant: fontVariant,
+    fontSize: fontSize,
+    fontFamily: fontFamily$1
+  };
   if (lineHeight !== undefined) out.lineHeight = lineHeight;
-
   return out;
 };
 
-var SPACE$6 = tokens.SPACE,
-    LINE = tokens.LINE,
-    COLOR$2 = tokens.COLOR;
+var ALIGN_CONTENT = regExpToken(/(flex-(?:start|end)|center|stretch|space-(?:between|around))/);
+var JUSTIFY_CONTENT = regExpToken(/(flex-(?:start|end)|center|space-(?:between|around|evenly))/);
 
+var placeContent = function placeContent(tokenStream) {
+  var alignContent = tokenStream.expect(ALIGN_CONTENT);
+  var justifyContent;
 
+  if (tokenStream.hasTokens()) {
+    tokenStream.expect(SPACE);
+    justifyContent = tokenStream.expect(JUSTIFY_CONTENT);
+  } else {
+    justifyContent = 'stretch';
+  }
+
+  tokenStream.expectEmpty();
+  return {
+    alignContent: alignContent,
+    justifyContent: justifyContent
+  };
+};
+
 var STYLE$1 = regExpToken(/^(solid|double|dotted|dashed)$/);
-
 var defaultTextDecorationLine = 'none';
@@ -494,17 +490,17 @@ var defaultTextDecorationStyle = 'solid';
 var textDecoration = function textDecoration(tokenStream) {
-  var line = void 0;
-  var style = void 0;
-  var color = void 0;
+  var line;
+  var style;
+  var color;
+  var didParseFirst = false;
 
-  var didParseFirst = false;
   while (tokenStream.hasTokens()) {
-    if (didParseFirst) tokenStream.expect(SPACE$6);
+    if (didParseFirst) tokenStream.expect(SPACE);
 
     if (line === undefined && tokenStream.matches(LINE)) {
       var lines = [tokenStream.lastValue.toLowerCase()];
+      tokenStream.saveRewindPoint();
 
-      tokenStream.saveRewindPoint();
-      if (lines[0] !== 'none' && tokenStream.matches(SPACE$6) && tokenStream.matches(LINE)) {
-        lines.push(tokenStream.lastValue.toLowerCase());
-        // Underline comes before line-through
+      if (lines[0] !== 'none' && tokenStream.matches(SPACE) && tokenStream.matches(LINE)) {
+        lines.push(tokenStream.lastValue.toLowerCase()); // Underline comes before line-through
+
         lines.sort().reverse();
@@ -518,6 +514,6 @@ } else {
       style = tokenStream.lastValue;
-    } else if (color === undefined && tokenStream.matches(COLOR$2)) {
+    } else if (color === undefined && tokenStream.matches(COLOR)) {
       color = tokenStream.lastValue;
     } else {
-      tokenStream.throw();
+      tokenStream["throw"]();
     }
@@ -535,15 +531,9 @@
 
-var SPACE$7 = tokens.SPACE,
-    LINE$1 = tokens.LINE;
-
-
 var textDecorationLine = function textDecorationLine(tokenStream) {
   var lines = [];
+  var didParseFirst = false;
 
-  var didParseFirst = false;
   while (tokenStream.hasTokens()) {
-    if (didParseFirst) tokenStream.expect(SPACE$7);
-
-    lines.push(tokenStream.expect(LINE$1).toLowerCase());
-
+    if (didParseFirst) tokenStream.expect(SPACE);
+    lines.push(tokenStream.expect(LINE).toLowerCase());
     didParseFirst = true;
@@ -553,4 +543,5 @@ }
   lines.sort().reverse();
-
-  return { textDecorationLine: lines.join(' ') };
+  return {
+    textDecorationLine: lines.join(' ')
+  };
 };
@@ -571,9 +562,2 @@
 
-var SPACE$8 = tokens.SPACE,
-    COMMA = tokens.COMMA,
-    LENGTH$4 = tokens.LENGTH,
-    NUMBER$2 = tokens.NUMBER,
-    ANGLE = tokens.ANGLE;
-
-
 var oneOfType = function oneOfType(tokenType) {
@@ -587,11 +571,14 @@ return function (functionStream) {
 
-var singleNumber = oneOfType(NUMBER$2);
-var singleLength = oneOfType(LENGTH$4);
+var singleNumber = oneOfType(NUMBER);
+var singleLength = oneOfType(LENGTH);
 var singleAngle = oneOfType(ANGLE);
+
 var xyTransformFactory = function xyTransformFactory(tokenType) {
   return function (key, valueIfOmitted) {
     return function (functionStream) {
+      var _ref3, _ref4;
+
       var x = functionStream.expect(tokenType);
+      var y;
 
-      var y = void 0;
       if (functionStream.hasTokens()) {
@@ -609,11 +596,10 @@ functionStream.expect(COMMA);
       functionStream.expectEmpty();
-
-      return [_defineProperty({}, key + 'Y', y), _defineProperty({}, key + 'X', x)];
+      return [(_ref3 = {}, _ref3[key + "Y"] = y, _ref3), (_ref4 = {}, _ref4[key + "X"] = x, _ref4)];
     };
   };
 };
-var xyNumber = xyTransformFactory(NUMBER$2);
-var xyLength = xyTransformFactory(LENGTH$4);
+
+var xyNumber = xyTransformFactory(NUMBER);
+var xyLength = xyTransformFactory(LENGTH);
 var xyAngle = xyTransformFactory(ANGLE);
-
 var partTransforms = {
@@ -638,38 +624,33 @@ perspective: singleNumber,
   var transforms = [];
+  var didParseFirst = false;
 
-  var didParseFirst = false;
   while (tokenStream.hasTokens()) {
-    if (didParseFirst) tokenStream.expect(SPACE$8);
-
+    if (didParseFirst) tokenStream.expect(SPACE);
     var functionStream = tokenStream.expectFunction();
     var functionName = functionStream.functionName;
+    var transformedValues = partTransforms[functionName](functionStream);
 
-    var transformedValues = partTransforms[functionName](functionStream);
     if (!Array.isArray(transformedValues)) {
-      transformedValues = [_defineProperty({}, functionName, transformedValues)];
+      var _ref5;
+
+      transformedValues = [(_ref5 = {}, _ref5[functionName] = transformedValues, _ref5)];
     }
+
     transforms = transformedValues.concat(transforms);
-
     didParseFirst = true;
   }
 
-  return { transform: transforms };
+  return {
+    transform: transforms
+  };
 };
 
-var IDENT$1 = tokens.IDENT,
-    WORD = tokens.WORD,
-    COLOR$3 = tokens.COLOR,
-    LENGTH$5 = tokens.LENGTH,
-    UNSUPPORTED_LENGTH_UNIT$3 = tokens.UNSUPPORTED_LENGTH_UNIT,
-    PERCENT$1 = tokens.PERCENT,
-    AUTO$1 = tokens.AUTO;
-
-
 var background = function background(tokenStream) {
   return {
-    backgroundColor: tokenStream.expect(COLOR$3)
+    backgroundColor: tokenStream.expect(COLOR)
   };
 };
+
 var borderColor = directionFactory({
-  types: [COLOR$3],
+  types: [COLOR],
   prefix: 'border',
@@ -683,18 +664,27 @@ suffix: 'Color'
 });
-var borderWidth = directionFactory({ prefix: 'border', suffix: 'Width' });
+var borderWidth = directionFactory({
+  prefix: 'border',
+  suffix: 'Width'
+});
 var margin = directionFactory({
-  types: [LENGTH$5, UNSUPPORTED_LENGTH_UNIT$3, PERCENT$1, AUTO$1],
+  types: [LENGTH, UNSUPPORTED_LENGTH_UNIT, PERCENT, AUTO],
   prefix: 'margin'
 });
-var padding = directionFactory({ prefix: 'padding' });
+var padding = directionFactory({
+  prefix: 'padding'
+});
+
 var fontVariant = function fontVariant(tokenStream) {
   return {
-    fontVariant: [tokenStream.expect(IDENT$1)]
+    fontVariant: [tokenStream.expect(IDENT)]
   };
 };
+
 var fontWeight = function fontWeight(tokenStream) {
   return {
     fontWeight: tokenStream.expect(WORD) // Also match numbers as strings
+
   };
 };
+
 var shadowOffset = function shadowOffset(tokenStream) {
@@ -705,2 +695,3 @@ return {
 };
+
 var textShadowOffset = function textShadowOffset(tokenStream) {
@@ -722,3 +713,3 @@ return {
   font: font,
-  fontFamily: parseFontFamily,
+  fontFamily: fontFamily,
   fontVariant: fontVariant,
@@ -728,2 +719,3 @@ fontWeight: fontWeight,
   padding: padding,
+  placeContent: placeContent,
   shadowOffset: shadowOffset,
@@ -736,9 +728,15 @@ textShadow: textShadow,
 };
+var propertiesWithoutUnits;
 
+if (process.env.NODE_ENV !== 'production') {
+  propertiesWithoutUnits = ['aspectRatio', 'elevation', 'flexGrow', 'flexShrink', 'opacity', 'shadowOpacity', 'zIndex'];
+}
+
+var devPropertiesWithUnitsRegExp = propertiesWithoutUnits != null ? new RegExp(propertiesWithoutUnits.join('|')) : null;
 var SYMBOL_MATCH = 'SYMBOL_MATCH';
 
-var TokenStream = function () {
+var TokenStream =
+/*#__PURE__*/
+function () {
   function TokenStream(nodes, parent) {
-    _classCallCheck(this, TokenStream);
-
     this.index = 0;
@@ -751,80 +749,69 @@ this.nodes = nodes;
 
-  _createClass(TokenStream, [{
-    key: 'hasTokens',
-    value: function hasTokens() {
-      return this.index <= this.nodes.length - 1;
-    }
-  }, {
-    key: SYMBOL_MATCH,
-    value: function value() {
-      if (!this.hasTokens()) return null;
+  var _proto = TokenStream.prototype;
 
-      var node = this.nodes[this.index];
+  _proto.hasTokens = function hasTokens() {
+    return this.index <= this.nodes.length - 1;
+  };
 
-      for (var i = 0; i < arguments.length; i += 1) {
-        var tokenDescriptor = arguments.length <= i ? undefined : arguments[i];
-        var value = tokenDescriptor(node);
-        if (value !== null) {
-          this.index += 1;
-          this.lastValue = value;
-          return value;
-        }
+  _proto[SYMBOL_MATCH] = function () {
+    if (!this.hasTokens()) return null;
+    var node = this.nodes[this.index];
+
+    for (var i = 0; i < arguments.length; i += 1) {
+      var tokenDescriptor = i < 0 || arguments.length <= i ? undefined : arguments[i];
+      var value = tokenDescriptor(node);
+
+      if (value !== null) {
+        this.index += 1;
+        this.lastValue = value;
+        return value;
       }
-
-      return null;
     }
-  }, {
-    key: 'matches',
-    value: function matches() {
-      return this[SYMBOL_MATCH].apply(this, arguments) !== null;
-    }
-  }, {
-    key: 'expect',
-    value: function expect() {
-      var value = this[SYMBOL_MATCH].apply(this, arguments);
-      return value !== null ? value : this.throw();
-    }
-  }, {
-    key: 'matchesFunction',
-    value: function matchesFunction() {
-      var node = this.nodes[this.index];
-      if (node.type !== 'function') return null;
-      var value = new TokenStream(node.nodes, node);
-      this.index += 1;
-      this.lastValue = null;
-      return value;
-    }
-  }, {
-    key: 'expectFunction',
-    value: function expectFunction() {
-      var value = this.matchesFunction();
-      return value !== null ? value : this.throw();
-    }
-  }, {
-    key: 'expectEmpty',
-    value: function expectEmpty() {
-      if (this.hasTokens()) this.throw();
-    }
-  }, {
-    key: 'throw',
-    value: function _throw() {
-      throw new Error('Unexpected token type: ' + this.nodes[this.index].type);
-    }
-  }, {
-    key: 'saveRewindPoint',
-    value: function saveRewindPoint() {
-      this.rewindIndex = this.index;
-    }
-  }, {
-    key: 'rewind',
-    value: function rewind() {
-      if (this.rewindIndex === -1) throw new Error('Internal error');
-      this.index = this.rewindIndex;
-      this.lastValue = null;
-    }
-  }]);
 
+    return null;
+  };
+
+  _proto.matches = function matches() {
+    return this[SYMBOL_MATCH].apply(this, arguments) !== null;
+  };
+
+  _proto.expect = function expect() {
+    var value = this[SYMBOL_MATCH].apply(this, arguments);
+    return value !== null ? value : this["throw"]();
+  };
+
+  _proto.matchesFunction = function matchesFunction() {
+    var node = this.nodes[this.index];
+    if (node.type !== 'function') return null;
+    var value = new TokenStream(node.nodes, node);
+    this.index += 1;
+    this.lastValue = null;
+    return value;
+  };
+
+  _proto.expectFunction = function expectFunction() {
+    var value = this.matchesFunction();
+    return value !== null ? value : this["throw"]();
+  };
+
+  _proto.expectEmpty = function expectEmpty() {
+    if (this.hasTokens()) this["throw"]();
+  };
+
+  _proto["throw"] = function _throw() {
+    throw new Error("Unexpected token type: " + this.nodes[this.index].type);
+  };
+
+  _proto.saveRewindPoint = function saveRewindPoint() {
+    this.rewindIndex = this.index;
+  };
+
+  _proto.rewind = function rewind() {
+    if (this.rewindIndex === -1) throw new Error('Internal error');
+    this.index = this.rewindIndex;
+    this.lastValue = null;
+  };
+
   return TokenStream;
 }();
-
 /* eslint-disable no-param-reassign */
@@ -834,28 +821,37 @@ // Note if this is wrong, you'll need to change tokenTypes.js too
 
-var numberOrLengthRe = /^([+-]?(?:\d*\.)?\d+(?:[Ee][+-]?\d+)?)(?:px)?$/i;
+var numberOrLengthRe = /^([+-]?(?:\d*\.)?\d+(?:e[+-]?\d+)?)(?:px)?$/i;
+var numberOnlyRe = /^[+-]?(?:\d*\.\d*|[1-9]\d*)(?:e[+-]?\d+)?$/i;
 var boolRe = /^true|false$/i;
 var nullRe = /^null$/i;
-var undefinedRe = /^undefined$/i;
+var undefinedRe = /^undefined$/i; // Undocumented export
 
-// Undocumented export
-var transformRawValue = function transformRawValue(input) {
-  var value = input.trim();
+var transformRawValue = function transformRawValue(propName, value) {
+  if (process.env.NODE_ENV !== 'production') {
+    var needsUnit = !devPropertiesWithUnitsRegExp.test(propName);
+    var isNumberWithoutUnit = numberOnlyRe.test(value);
 
+    if (needsUnit && isNumberWithoutUnit) {
+      // eslint-disable-next-line no-console
+      console.warn("Expected style \"" + propName + ": " + value + "\" to contain units");
+    }
+
+    if (!needsUnit && value !== '0' && !isNumberWithoutUnit) {
+      // eslint-disable-next-line no-console
+      console.warn("Expected style \"" + propName + ": " + value + "\" to be unitless");
+    }
+  }
+
   var numberMatch = value.match(numberOrLengthRe);
   if (numberMatch !== null) return Number(numberMatch[1]);
-
-  var boolMatch = input.match(boolRe);
+  var boolMatch = value.match(boolRe);
   if (boolMatch !== null) return boolMatch[0].toLowerCase() === 'true';
-
-  var nullMatch = input.match(nullRe);
+  var nullMatch = value.match(nullRe);
   if (nullMatch !== null) return null;
-
-  var undefinedMatch = input.match(undefinedRe);
+  var undefinedMatch = value.match(undefinedRe);
   if (undefinedMatch !== null) return undefined;
-
   return value;
 };
 
-var baseTransformShorthandValue = function baseTransformShorthandValue(propName, inputValue) {
-  var ast = parse__default(inputValue.trim());
+var baseTransformShorthandValue = function baseTransformShorthandValue(propName, value) {
+  var ast = parse__default(value);
   var tokenStream = new TokenStream(ast.nodes);
@@ -865,7 +861,7 @@ return transforms[propName](tokenStream);
 
-var transformShorthandValue = process.env.NODE_ENV === 'production' ? baseTransformShorthandValue : function (propName, inputValue) {
+var transformShorthandValue = process.env.NODE_ENV === 'production' ? baseTransformShorthandValue : function (propName, value) {
   try {
-    return baseTransformShorthandValue(propName, inputValue);
+    return baseTransformShorthandValue(propName, value);
   } catch (e) {
-    throw new Error('Failed to parse declaration "' + propName + ': ' + inputValue + '"');
+    throw new Error("Failed to parse declaration \"" + propName + ": " + value + "\"");
   }
@@ -875,5 +871,7 @@ };
 var getStylesForProperty = function getStylesForProperty(propName, inputValue, allowShorthand) {
+  var _ref6;
+
   var isRawValue = allowShorthand === false || !(propName in transforms);
-  var propValues = isRawValue ? _defineProperty({}, propName, transformRawValue(inputValue)) : transformShorthandValue(propName, inputValue.trim());
-
+  var value = inputValue.trim();
+  var propValues = isRawValue ? (_ref6 = {}, _ref6[propName] = transformRawValue(propName, value), _ref6) : transformShorthandValue(propName, value);
   return propValues;
@@ -884,10 +882,15 @@ };
   var isCustomProp = /^--\w+/.test(propName);
+
   if (isCustomProp) {
     return propName;
   }
+
   return camelizeStyleName(propName);
 };
 
-var index = function index(rules) {
-  var shorthandBlacklist = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
+var index = function index(rules, shorthandBlacklist) {
+  if (shorthandBlacklist === void 0) {
+    shorthandBlacklist = [];
+  }
+
   return rules.reduce(function (accum, rule) {
@@ -901,5 +904,5 @@ var propertyName = getPropertyName(rule[0]);
 
+exports["default"] = index;
+exports.getPropertyName = getPropertyName;
+exports.getStylesForProperty = getStylesForProperty;
 exports.transformRawValue = transformRawValue;
-exports.getStylesForProperty = getStylesForProperty;
-exports.getPropertyName = getPropertyName;
-exports.default = index;

package.json

 {
   "name": "css-to-react-native",
-  "version": "2.3.2",
+  "version": "3.0.0",
   "description": "Convert CSS text to a React Native stylesheet object",
@@ -40,4 +40,4 @@ "main": "index.js",
   "devDependencies": {
-    "babel-cli": "^6.26.0",
-    "babel-preset-es2015": "^6.24.1",
+    "@babel/cli": "^7.6.2",
+    "@babel/preset-env": "^7.6.2",
     "eslint": "^4.17.0",
@@ -48,6 +48,6 @@ "eslint-config-airbnb-base": "^12.1.0",
     "eslint-plugin-prettier": "^2.6.0",
-    "jest": "^22.2.2",
+    "jest": "^24.9.0",
     "lint-staged": "^6.1.0",
-    "prettier": "^1.10.2",
-    "rollup": "^0.55.5"
+    "prettier": "^1.18.2",
+    "rollup": "^1.22.0"
   },
@@ -57,3 +57,3 @@ "dependencies": {
     "css-color-keywords": "^1.0.0",
-    "postcss-value-parser": "^3.3.0"
+    "postcss-value-parser": "^4.0.2"
   },
@@ -60,0 +60,0 @@ "lint-staged": {

src/__tests__/border.js

@@ -74,1 +74,13 @@ import transformCss from '..'
 })
+
+it('transforms border for unsupported units', () => {
+  expect(transformCss([['border', '3em solid black']])).toEqual({
+    borderWidth: '3em',
+    borderColor: 'black',
+    borderStyle: 'solid',
+  })
+})
+
+it('does not transform border with percentage width', () => {
+  expect(() => transformCss([['border', '3% solid black']])).toThrow()
+})

src/__tests__/flex.js

@@ -80,2 +80,18 @@ import transformCss from '..'
 
+it('transforms flex shorthand with flex-basis set to percent', () => {
+  expect(transformCss([['flex', '1 2 30%']])).toEqual({
+    flexGrow: 1,
+    flexShrink: 2,
+    flexBasis: '30%',
+  })
+})
+
+it('transforms flex shorthand with flex-basis set to unsupported unit', () => {
+  expect(transformCss([['flex', '1 2 30em']])).toEqual({
+    flexGrow: 1,
+    flexShrink: 2,
+    flexBasis: '30em',
+  })
+})
+
 it('transforms flex shorthand with flex-basis set to auto appearing first', () => {
@@ -82,0 +98,0 @@ expect(transformCss([['flex', 'auto 0 1']])).toEqual({

src/__tests__/font.js

@@ -100,11 +100,6 @@ import transformCss from '..'
 
-it('allows line height as multiple', () => {
-  expect(transformCss([['font', '16px/1.5 "Helvetica"']])).toEqual({
-    fontFamily: 'Helvetica',
-    fontSize: 16,
-    fontWeight: 'normal',
-    fontStyle: 'normal',
-    fontVariant: [],
-    lineHeight: 24,
-  })
+it('does not allow line height as multiple', () => {
+  expect(() => {
+    transformCss([['font', '16px/1.5 "Helvetica"']])
+  }).toThrow()
 })
@@ -111,0 +106,0 @@

src/__tests__/index.js

 import transformCss, { getStylesForProperty } from '..'
 
 it('transforms numbers', () => {
-  expect(
-    transformCss([['top', '0'], ['left', '0'], ['right', '0'], ['bottom', '0']])
-  ).toEqual({
-    top: 0,
-    left: 0,
-    right: 0,
-    bottom: 0,
-  })
+  expect(transformCss([['z-index', '0']])).toEqual({ zIndex: 0 })
 })
 
+it('warns if missing units on unspecialized transform', () => {
+  const consoleSpy = jest
+    .spyOn(global.console, 'warn')
+    .mockImplementation(() => {
+      // Silence the warning from the test output
+    })
+
+  transformCss([['top', '1']])
+  expect(consoleSpy).toHaveBeenCalledWith(
+    'Expected style "top: 1" to contain units'
+  )
+
+  consoleSpy.mockRestore()
+})
+
+it('does not warn for unitless 0 length on unspecialized transform', () => {
+  const consoleSpy = jest.spyOn(global.console, 'warn')
+
+  transformCss([['top', '0']])
+  expect(consoleSpy).not.toHaveBeenCalled()
+
+  consoleSpy.mockRestore()
+})
+
+it('warns if adding etraneous units on unspecialized transform', () => {
+  const consoleSpy = jest
+    .spyOn(global.console, 'warn')
+    .mockImplementation(() => {
+      // Silence the warning from the test output
+    })
+
+  transformCss([['opacity', '1px']])
+  expect(consoleSpy).toHaveBeenCalledWith(
+    'Expected style "opacity: 1px" to be unitless'
+  )
+
+  consoleSpy.mockRestore()
+})
+
+it('does not warn for unitless 0 length on unitless transform', () => {
+  const consoleSpy = jest.spyOn(global.console, 'warn')
+
+  transformCss([['opacity', '0']])
+  expect(consoleSpy).not.toHaveBeenCalled()
+
+  consoleSpy.mockRestore()
+})
+
 it('allows pixels in unspecialized transform', () => {
@@ -89,2 +130,9 @@ expect(transformCss([['top', '0px']])).toEqual({ top: 0 })
 
+it('allows uppercase units', () => {
+  expect(transformCss([['top', '0PX']])).toEqual({ top: 0 })
+  expect(transformCss([['transform', 'rotate(30DEG)']])).toEqual({
+    transform: [{ rotate: '30deg' }],
+  })
+})
+
 it('allows percent values in transformed values', () => {
@@ -91,0 +139,0 @@ expect(transformCss([['margin', '10%']])).toEqual({

src/index.js

@@ -5,6 +5,8 @@ /* eslint-disable no-param-reassign */
 import transforms from './transforms/index'
+import devPropertiesWithoutUnitsRegExp from './devPropertiesWithoutUnitsRegExp'
 import TokenStream from './TokenStream'
 
 // Note if this is wrong, you'll need to change tokenTypes.js too
-const numberOrLengthRe = /^([+-]?(?:\d*\.)?\d+(?:[Ee][+-]?\d+)?)(?:px)?$/i
+const numberOrLengthRe = /^([+-]?(?:\d*\.)?\d+(?:e[+-]?\d+)?)(?:px)?$/i
+const numberOnlyRe = /^[+-]?(?:\d*\.\d*|[1-9]\d*)(?:e[+-]?\d+)?$/i
 const boolRe = /^true|false$/i
@@ -15,4 +17,15 @@ const nullRe = /^null$/i
 // Undocumented export
-export const transformRawValue = input => {
-  const value = input.trim()
+export const transformRawValue = (propName, value) => {
+  if (process.env.NODE_ENV !== 'production') {
+    const needsUnit = !devPropertiesWithoutUnitsRegExp.test(propName)
+    const isNumberWithoutUnit = numberOnlyRe.test(value)
+    if (needsUnit && isNumberWithoutUnit) {
+      // eslint-disable-next-line no-console
+      console.warn(`Expected style "${propName}: ${value}" to contain units`)
+    }
+    if (!needsUnit && value !== '0' && !isNumberWithoutUnit) {
+      // eslint-disable-next-line no-console
+      console.warn(`Expected style "${propName}: ${value}" to be unitless`)
+    }
+  }
 
@@ -22,9 +35,9 @@ const numberMatch = value.match(numberOrLengthRe)
 
-  const boolMatch = input.match(boolRe)
+  const boolMatch = value.match(boolRe)
   if (boolMatch !== null) return boolMatch[0].toLowerCase() === 'true'
 
-  const nullMatch = input.match(nullRe)
+  const nullMatch = value.match(nullRe)
   if (nullMatch !== null) return null
 
-  const undefinedMatch = input.match(undefinedRe)
+  const undefinedMatch = value.match(undefinedRe)
   if (undefinedMatch !== null) return undefined
@@ -35,4 +48,4 @@
 
-const baseTransformShorthandValue = (propName, inputValue) => {
-  const ast = parse(inputValue.trim())
+const baseTransformShorthandValue = (propName, value) => {
+  const ast = parse(value)
   const tokenStream = new TokenStream(ast.nodes)
@@ -45,9 +58,7 @@ return transforms[propName](tokenStream)
     ? baseTransformShorthandValue
-    : (propName, inputValue) => {
+    : (propName, value) => {
         try {
-          return baseTransformShorthandValue(propName, inputValue)
+          return baseTransformShorthandValue(propName, value)
         } catch (e) {
-          throw new Error(
-            `Failed to parse declaration "${propName}: ${inputValue}"`
-          )
+          throw new Error(`Failed to parse declaration "${propName}: ${value}"`)
         }
@@ -58,5 +69,7 @@ }
   const isRawValue = allowShorthand === false || !(propName in transforms)
+  const value = inputValue.trim()
+
   const propValues = isRawValue
-    ? { [propName]: transformRawValue(inputValue) }
-    : transformShorthandValue(propName, inputValue.trim())
+    ? { [propName]: transformRawValue(propName, value) }
+    : transformShorthandValue(propName, value)
 
@@ -63,0 +76,0 @@ return propValues

src/tokenTypes.js

@@ -34,8 +34,8 @@ import { stringify } from 'postcss-value-parser'
 // Note if these are wrong, you'll need to change index.js too
-const numberRe = /^([+-]?(?:\d*\.)?\d+(?:[Ee][+-]?\d+)?)$/
+const numberRe = /^([+-]?(?:\d*\.)?\d+(?:e[+-]?\d+)?)$/i
 // Note lengthRe is sneaky: you can omit units for 0
-const lengthRe = /^(0$|(?:[+-]?(?:\d*\.)?\d+(?:[Ee][+-]?\d+)?)(?=px$))/
-const unsupportedUnitRe = /^([+-]?(?:\d*\.)?\d+(?:[Ee][+-]?\d+)?(ch|em|ex|rem|vh|vw|vmin|vmax|cm|mm|in|pc|pt))$/
-const angleRe = /^([+-]?(?:\d*\.)?\d+(?:[Ee][+-]?\d+)?(?:deg|rad))$/
-const percentRe = /^([+-]?(?:\d*\.)?\d+(?:[Ee][+-]?\d+)?%)$/
+const lengthRe = /^(0$|(?:[+-]?(?:\d*\.)?\d+(?:e[+-]?\d+)?)(?=px$))/i
+const unsupportedUnitRe = /^([+-]?(?:\d*\.)?\d+(?:e[+-]?\d+)?(ch|em|ex|rem|vh|vw|vmin|vmax|cm|mm|in|pc|pt))$/i
+const angleRe = /^([+-]?(?:\d*\.)?\d+(?:e[+-]?\d+)?(?:deg|rad))$/i
+const percentRe = /^([+-]?(?:\d*\.)?\d+(?:e[+-]?\d+)?%)$/i
 
@@ -58,18 +58,20 @@ const noopToken = predicate => node => (predicate(node) ? '<token>' : null)
 
-export const tokens = {
-  SPACE: noopToken(node => node.type === 'space'),
-  SLASH: noopToken(node => node.type === 'div' && node.value === '/'),
-  COMMA: noopToken(node => node.type === 'div' && node.value === ','),
-  WORD: valueForTypeToken('word'),
-  NONE: regExpToken(noneRe),
-  AUTO: regExpToken(autoRe),
-  NUMBER: regExpToken(numberRe, Number),
-  LENGTH: regExpToken(lengthRe, Number),
-  UNSUPPORTED_LENGTH_UNIT: regExpToken(unsupportedUnitRe),
-  ANGLE: regExpToken(angleRe),
-  PERCENT: regExpToken(percentRe),
-  IDENT: regExpToken(identRe),
-  STRING: matchString,
-  COLOR: matchColor,
-  LINE: regExpToken(/^(none|underline|line-through)$/i),
-}
+export const SPACE = noopToken(node => node.type === 'space')
+export const SLASH = noopToken(
+  node => node.type === 'div' && node.value === '/'
+)
+export const COMMA = noopToken(
+  node => node.type === 'div' && node.value === ','
+)
+export const WORD = valueForTypeToken('word')
+export const NONE = regExpToken(noneRe)
+export const AUTO = regExpToken(autoRe)
+export const NUMBER = regExpToken(numberRe, Number)
+export const LENGTH = regExpToken(lengthRe, Number)
+export const UNSUPPORTED_LENGTH_UNIT = regExpToken(unsupportedUnitRe)
+export const ANGLE = regExpToken(angleRe, angle => angle.toLowerCase())
+export const PERCENT = regExpToken(percentRe)
+export const IDENT = regExpToken(identRe)
+export const STRING = matchString
+export const COLOR = matchColor
+export const LINE = regExpToken(/^(none|underline|line-through)$/i)

src/transforms/border.js

@@ -1,5 +0,10 @@
-import { regExpToken, tokens } from '../tokenTypes'
+import {
+  regExpToken,
+  NONE,
+  COLOR,
+  LENGTH,
+  UNSUPPORTED_LENGTH_UNIT,
+  SPACE,
+} from '../tokenTypes'
 
-const { NONE, COLOR, LENGTH, UNSUPPORTED_LENGTH_UNIT, SPACE } = tokens
-
 const BORDER_STYLE = regExpToken(/^(solid|dashed|dotted)$/)
@@ -26,4 +31,4 @@
     if (
-      (borderWidth === undefined && tokenStream.matches(LENGTH)) ||
-      tokenStream.matches(UNSUPPORTED_LENGTH_UNIT)
+      borderWidth === undefined &&
+      tokenStream.matches(LENGTH, UNSUPPORTED_LENGTH_UNIT)
     ) {
@@ -30,0 +35,0 @@ borderWidth = tokenStream.lastValue

src/transforms/flex.js

@@ -1,5 +0,11 @@
-import { tokens } from '../tokenTypes'
+import {
+  NONE,
+  AUTO,
+  NUMBER,
+  LENGTH,
+  UNSUPPORTED_LENGTH_UNIT,
+  PERCENT,
+  SPACE,
+} from '../tokenTypes'
 
-const { NONE, AUTO, NUMBER, LENGTH, SPACE } = tokens
-
 const defaultFlexGrow = 1
@@ -38,3 +44,6 @@ const defaultFlexShrink = 1
       }
-    } else if (flexBasis === undefined && tokenStream.matches(LENGTH)) {
+    } else if (
+      flexBasis === undefined &&
+      tokenStream.matches(LENGTH, UNSUPPORTED_LENGTH_UNIT, PERCENT)
+    ) {
       flexBasis = tokenStream.lastValue
@@ -41,0 +50,0 @@ } else if (flexBasis === undefined && tokenStream.matches(AUTO)) {

src/transforms/flexFlow.js

@@ -1,5 +0,3 @@
-import { regExpToken, tokens } from '../tokenTypes'
+import { regExpToken, SPACE } from '../tokenTypes'
 
-const { SPACE } = tokens
-
 const FLEX_WRAP = regExpToken(/(nowrap|wrap|wrap-reverse)/)
@@ -6,0 +4,0 @@ const FLEX_DIRECTION = regExpToken(/(row|row-reverse|column|column-reverse)/)

src/transforms/font.js

 import parseFontFamily from './fontFamily'
-import { regExpToken, tokens } from '../tokenTypes'
+import {
+  regExpToken,
+  SPACE,
+  LENGTH,
+  UNSUPPORTED_LENGTH_UNIT,
+  SLASH,
+} from '../tokenTypes'
 
-const { SPACE, LENGTH, UNSUPPORTED_LENGTH_UNIT, NUMBER, SLASH } = tokens
 const NORMAL = regExpToken(/^(normal)$/)
@@ -43,7 +48,3 @@ const STYLE = regExpToken(/^(italic)$/)
   if (tokenStream.matches(SLASH)) {
-    if (tokenStream.matches(NUMBER)) {
-      lineHeight = fontSize * tokenStream.lastValue
-    } else {
-      lineHeight = tokenStream.expect(LENGTH, UNSUPPORTED_LENGTH_UNIT)
-    }
+    lineHeight = tokenStream.expect(LENGTH, UNSUPPORTED_LENGTH_UNIT)
   }
@@ -50,0 +51,0 @@

src/transforms/fontFamily.js

@@ -1,5 +0,3 @@
-import { tokens } from '../tokenTypes'
+import { SPACE, IDENT, STRING } from '../tokenTypes'
 
-const { SPACE, IDENT, STRING } = tokens
-
 export default tokenStream => {
@@ -6,0 +4,0 @@ let fontFamily

src/transforms/index.js

@@ -1,2 +0,10 @@
-import { tokens } from '../tokenTypes'
+import {
+  IDENT,
+  WORD,
+  COLOR,
+  LENGTH,
+  UNSUPPORTED_LENGTH_UNIT,
+  PERCENT,
+  AUTO,
+} from '../tokenTypes'
 import border from './border'
@@ -8,2 +16,3 @@ import boxShadow from './boxShadow'
 import fontFamily from './fontFamily'
+import placeContent from './placeContent'
 import textDecoration from './textDecoration'
@@ -15,12 +24,2 @@ import textDecorationLine from './textDecorationLine'
 
-const {
-  IDENT,
-  WORD,
-  COLOR,
-  LENGTH,
-  UNSUPPORTED_LENGTH_UNIT,
-  PERCENT,
-  AUTO,
-} = tokens
-
 const background = tokenStream => ({
@@ -73,2 +72,3 @@ backgroundColor: tokenStream.expect(COLOR),
   padding,
+  placeContent,
   shadowOffset,
@@ -75,0 +75,0 @@ textShadow,

src/transforms/textDecoration.js

@@ -1,5 +0,3 @@
-import { regExpToken, tokens } from '../tokenTypes'
+import { regExpToken, SPACE, LINE, COLOR } from '../tokenTypes'
 
-const { SPACE, LINE, COLOR } = tokens
-
 const STYLE = regExpToken(/^(solid|double|dotted|dashed)$/)
@@ -6,0 +4,0 @@

src/transforms/textDecorationLine.js

@@ -1,5 +0,3 @@
-import { tokens } from '../tokenTypes'
+import { SPACE, LINE } from '../tokenTypes'
 
-const { SPACE, LINE } = tokens
-
 export default tokenStream => {
@@ -6,0 +4,0 @@ const lines = []

src/transforms/transform.js

@@ -1,5 +0,3 @@
-import { tokens } from '../tokenTypes'
+import { SPACE, COMMA, LENGTH, NUMBER, ANGLE } from '../tokenTypes'
 
-const { SPACE, COMMA, LENGTH, NUMBER, ANGLE } = tokens
-
 const oneOfType = tokenType => functionStream => {
@@ -6,0 +4,0 @@ const value = functionStream.expect(tokenType)

src/transforms/util.js

@@ -1,5 +0,10 @@
-import { tokens } from '../tokenTypes'
+import {
+  LENGTH,
+  UNSUPPORTED_LENGTH_UNIT,
+  PERCENT,
+  COLOR,
+  SPACE,
+  NONE,
+} from '../tokenTypes'
 
-const { LENGTH, UNSUPPORTED_LENGTH_UNIT, PERCENT, COLOR, SPACE, NONE } = tokens
-
 export const directionFactory = ({
@@ -6,0 +11,0 @@ types = [LENGTH, UNSUPPORTED_LENGTH_UNIT, PERCENT],

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

87770

increased by2.84%

Number of package files

40

increased by8.11%

Lines of code

2556

increased by6.37%

Worsened metrics

Number of low supply chain risk alerts

5

increased by150%

Dependency changes

• + Addedpostcss-value-parser@4.2.0(transitive)

• - Removedpostcss-value-parser@3.3.1(transitive)

• Updatedpostcss-value-parser@^4.0.2