taro-css-to-react-native 3.5.0-theta.0 → 3.5.0-theta.1

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2018 
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/dist/css-to-react-native/index.js

@@ -5,14 +5,14 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.transformRawValue = exports.getStylesForProperty = exports.getPropertyName = exports["default"] = void 0;
 
-var _postcssValueParser = _interopRequireDefault(require("postcss-value-parser"));
-
 var _camelize = _interopRequireDefault(require("camelize"));
 
-var _index = _interopRequireDefault(require("./transforms/index"));
+var _postcssValueParser = _interopRequireDefault(require("postcss-value-parser"));
 
 var _TokenStream = _interopRequireDefault(require("./TokenStream"));
 
+var _index = _interopRequireDefault(require("./transforms/index"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 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; }
@@ -38,7 +38,7 @@ var transformRawValue = function transformRawValue(input) {
   }
 
   var boolMatch = input.match(boolRe);
-  if (boolMatch !== null) return boolMatch[0].toLowerCase() === 'true';
+  if (boolMatch !== null) return boolMatch[0].toLowerCase() === "true";
   var nullMatch = input.match(nullRe);
   if (nullMatch !== null) return null;
   var undefinedMatch = input.match(undefinedRe);
@@ -63,7 +63,7 @@ var checkBaseTransformShorthandValue = function checkBaseTransformShorthandValue
   }
 };
 
-var transformShorthandValue = process.env.NODE_ENV === 'production' ? baseTransformShorthandValue : checkBaseTransformShorthandValue;
+var transformShorthandValue = process.env.NODE_ENV === "production" ? baseTransformShorthandValue : checkBaseTransformShorthandValue;
 
 var getStylesForProperty = function getStylesForProperty(propName, inputValue, allowShorthand) {
   var isRawValue = allowShorthand === false || !(propName in _index["default"]);

package/dist/css-to-react-native/tokenTypes.js

@@ -5,26 +5,26 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.tokens = exports.regExpToken = void 0;
 
-var _postcssValueParser = require("postcss-value-parser");
-
 var _cssColorKeywords = _interopRequireDefault(require("css-color-keywords"));
 
+var _postcssValueParser = require("postcss-value-parser");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 var matchString = function matchString(node) {
-  if (node.type !== 'string') return null;
+  if (node.type !== "string") return null;
   return node.value.replace(/\\([0-9a-f]{1,6})(?:\s|$)/gi, function (match, charCode) {
     return String.fromCharCode(parseInt(charCode, 16));
-  }).replace(/\\/g, '');
+  }).replace(/\\/g, "");
 };
 
 var hexColorRe = /^(#(?:[0-9a-f]{3,4}){1,2})$/i;
 var cssFunctionNameRe = /^(rgba?|hsla?|hwb|lab|lch|gray|color)$/;
 
 var matchColor = function matchColor(node) {
-  if (node.type === 'word' && (hexColorRe.test(node.value) || node.value in _cssColorKeywords["default"] || node.value === 'transparent')) {
+  if (node.type === "word" && (hexColorRe.test(node.value) || node.value in _cssColorKeywords["default"] || node.value === "transparent")) {
     return node.value;
-  } else if (node.type === 'function' && cssFunctionNameRe.test(node.value)) {
+  } else if (node.type === "function" && cssFunctionNameRe.test(node.value)) {
     return (0, _postcssValueParser.stringify)(node);
   }
 
@@ -44,7 +44,7 @@ var percentRe = /^([+-]?(?:\d*\.)?\d+(?:[Ee][+-]?\d+)?%)$/;
 
 var noopToken = function noopToken(predicate) {
   return function (node) {
-    return predicate(node) ? '<token>' : null;
+    return predicate(node) ? "<token>" : null;
   };
 };
 
@@ -60,11 +60,11 @@ var functionValueForTypeToken = function functionValueForTypeToken(type) {
       // handle rgb(a) function value
       if (/^rgba?$/i.test(node.value)) {
         var result = node.nodes.filter(function (token) {
-          return token.type === 'word';
+          return token.type === "word";
         }).map(function (token) {
           return token.value;
         });
-        return "".concat(node.value, "(").concat(result.join(', '), ")");
+        return "".concat(node.value, "(").concat(result.join(", "), ")");
       }
     }
 
@@ -75,7 +75,7 @@ var functionValueForTypeToken = function functionValueForTypeToken(type) {
 var regExpToken = function regExpToken(regExp) {
   var transform = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : String;
   return function (node) {
-    if (node.type !== 'word') return null;
+    if (node.type !== "word") return null;
     var match = node.value.match(regExp);
     if (match === null) return null;
     var value = transform(match[1]);
@@ -91,16 +91,16 @@ var regExpToken = function regExpToken(regExp) {
 exports.regExpToken = regExpToken;
 var tokens = {
   SPACE: noopToken(function (node) {
-    return node.type === 'space';
+    return node.type === "space";
   }),
   SLASH: noopToken(function (node) {
-    return node.type === 'div' && node.value === '/';
+    return node.type === "div" && node.value === "/";
   }),
   COMMA: noopToken(function (node) {
-    return node.type === 'div' && node.value === ',';
+    return node.type === "div" && node.value === ",";
   }),
-  WORD: valueForTypeToken('word'),
-  FUNC: functionValueForTypeToken('function'),
+  WORD: valueForTypeToken("word"),
+  FUNC: functionValueForTypeToken("function"),
   NONE: regExpToken(noneRe),
   AUTO: regExpToken(autoRe),
   NUMBER: regExpToken(numberRe, Number),

package/dist/css-to-react-native/transforms/border.js

@@ -20,44 +20,44 @@ var WORD = _tokenTypes.tokens.WORD,
 function borderDirectionFactory() {
   var _anyOrderFactory;
 
-  var direction = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
+  var direction = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : "";
   var prefix = "border".concat(direction);
   return (0, _util.anyOrderFactory)((_anyOrderFactory = {}, _defineProperty(_anyOrderFactory, "".concat(prefix, "Width"), {
     tokens: [LENGTH, UNSUPPORTED_LENGTH_UNIT],
     "default": 1
   }), _defineProperty(_anyOrderFactory, "".concat(prefix, "Color"), {
     tokens: [COLOR],
-    "default": 'black'
+    "default": "black"
   }), _defineProperty(_anyOrderFactory, "".concat(prefix, "Style"), {
     tokens: [(0, _tokenTypes.regExpToken)(/^(solid|dashed|dotted)$/)],
-    "default": 'solid'
+    "default": "solid"
   }), _anyOrderFactory));
 }
 
 var border = borderDirectionFactory();
 exports.border = border;
-var borderTop = borderDirectionFactory('Top');
+var borderTop = borderDirectionFactory("Top");
 exports.borderTop = borderTop;
-var borderRight = borderDirectionFactory('Right');
+var borderRight = borderDirectionFactory("Right");
 exports.borderRight = borderRight;
-var borderBottom = borderDirectionFactory('Bottom');
+var borderBottom = borderDirectionFactory("Bottom");
 exports.borderBottom = borderBottom;
-var borderLeft = borderDirectionFactory('Left');
+var borderLeft = borderDirectionFactory("Left");
 exports.borderLeft = borderLeft;
 var borderColor = (0, _util.directionFactory)({
   types: [WORD, FUNC],
-  prefix: 'border',
-  suffix: 'Color'
+  prefix: "border",
+  suffix: "Color"
 });
 exports.borderColor = borderColor;
 var borderRadius = (0, _util.directionFactory)({
-  directions: ['TopLeft', 'TopRight', 'BottomRight', 'BottomLeft'],
-  prefix: 'border',
-  suffix: 'Radius'
+  directions: ["TopLeft", "TopRight", "BottomRight", "BottomLeft"],
+  prefix: "border",
+  suffix: "Radius"
 });
 exports.borderRadius = borderRadius;
 var borderWidth = (0, _util.directionFactory)({
-  prefix: 'border',
-  suffix: 'Width'
+  prefix: "border",
+  suffix: "Width"
 });
 exports.borderWidth = borderWidth;

package/dist/css-to-react-native/transforms/font.js

@@ -5,10 +5,10 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports["default"] = void 0;
 
-var _fontFamily = _interopRequireDefault(require("./fontFamily"));
-
 var _tokenTypes = require("../tokenTypes");
 
+var _fontFamily = _interopRequireDefault(require("./fontFamily"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 var SPACE = _tokenTypes.tokens.SPACE,
@@ -20,8 +20,8 @@ var NORMAL = (0, _tokenTypes.regExpToken)(/^(normal)$/);
 var STYLE = (0, _tokenTypes.regExpToken)(/^(italic)$/);
 var WEIGHT = (0, _tokenTypes.regExpToken)(/^([1-9]00|bold)$/);
 var VARIANT = (0, _tokenTypes.regExpToken)(/^(small-caps)$/);
-var defaultFontStyle = 'normal';
-var defaultFontWeight = 'normal';
+var defaultFontStyle = "normal";
+var defaultFontWeight = "normal";
 var defaultFontVariant = [];
 
 var _default = function _default(tokenStream) {
@@ -36,11 +36,11 @@ var _default = function _default(tokenStream) {
   while (numStyleWeightVariantMatched < 3 && tokenStream.hasTokens()) {
     if (tokenStream.matches(NORMAL)) {
       /* pass */
-    } else if (typeof fontStyle === 'undefined' && tokenStream.matches(STYLE)) {
+    } else if (typeof fontStyle === "undefined" && tokenStream.matches(STYLE)) {
       fontStyle = tokenStream.lastValue;
-    } else if (typeof fontWeight === 'undefined' && tokenStream.matches(WEIGHT)) {
+    } else if (typeof fontWeight === "undefined" && tokenStream.matches(WEIGHT)) {
       fontWeight = tokenStream.lastValue;
-    } else if (typeof fontVariant === 'undefined' && tokenStream.matches(VARIANT)) {
+    } else if (typeof fontVariant === "undefined" && tokenStream.matches(VARIANT)) {
       fontVariant = [tokenStream.lastValue];
     } else {
       break;
@@ -54,7 +54,7 @@ var _default = function _default(tokenStream) {
 
   if (tokenStream.matches(SLASH)) {
     if (tokenStream.matches(NUMBER)) {
-      var size = typeof fontSize === 'string' ? fontSize.replace(/scalePx2dp\((\d+)\)/, '$1') : fontSize;
+      var size = typeof fontSize === "string" ? fontSize.replace(/scalePx2dp\((\d+)\)/, "$1") : fontSize;
       lineHeight = size * tokenStream.lastValue;
     } else {
       lineHeight = tokenStream.expect(LENGTH, UNSUPPORTED_LENGTH_UNIT);
@@ -63,9 +63,9 @@ var _default = function _default(tokenStream) {
 
   tokenStream.expect(SPACE);
   var fontFamily = (0, _fontFamily["default"])(tokenStream);
-  if (typeof fontStyle === 'undefined') fontStyle = defaultFontStyle;
-  if (typeof fontWeight === 'undefined') fontWeight = defaultFontWeight;
-  if (typeof fontVariant === 'undefined') fontVariant = defaultFontVariant;
+  if (typeof fontStyle === "undefined") fontStyle = defaultFontStyle;
+  if (typeof fontWeight === "undefined") fontWeight = defaultFontWeight;
+  if (typeof fontVariant === "undefined") fontVariant = defaultFontVariant;
   var out = {
     fontStyle: fontStyle,
     fontWeight: fontWeight,
@@ -73,7 +73,7 @@ var _default = function _default(tokenStream) {
     fontSize: fontSize,
     fontFamily: fontFamily
   };
-  if (typeof lineHeight !== 'undefined') out.lineHeight = lineHeight;
+  if (typeof lineHeight !== "undefined") out.lineHeight = lineHeight;
   return {
     $merge: out
   };

package/dist/css-to-react-native/transforms/index.js

@@ -7,6 +7,8 @@ exports["default"] = void 0;
 
 var _tokenTypes = require("../tokenTypes");
 
+var _border = require("./border");
+
 var _boxShadow = _interopRequireDefault(require("./boxShadow"));
 
 var _flex = _interopRequireDefault(require("./flex"));
@@ -15,15 +17,13 @@ var _font = _interopRequireDefault(require("./font"));
 
 var _fontFamily = _interopRequireDefault(require("./fontFamily"));
 
-var _textShadow = _interopRequireDefault(require("./textShadow"));
-
 var _textDecoration = _interopRequireDefault(require("./textDecoration"));
 
 var _textDecorationLine = _interopRequireDefault(require("./textDecorationLine"));
 
-var _transform = _interopRequireDefault(require("./transform"));
+var _textShadow = _interopRequireDefault(require("./textShadow"));
 
-var _border = require("./border");
+var _transform = _interopRequireDefault(require("./transform"));
 
 var _util = require("./util");
 
@@ -47,19 +47,19 @@ var background = function background(tokenStream) {
 
 var margin = (0, _util.directionFactory)({
   types: [LENGTH, UNSUPPORTED_LENGTH_UNIT, PERCENT, AUTO],
-  prefix: 'margin'
+  prefix: "margin"
 });
 var padding = (0, _util.directionFactory)({
-  prefix: 'padding'
+  prefix: "padding"
 });
 var flexFlow = (0, _util.anyOrderFactory)({
   flexWrap: {
     tokens: [(0, _tokenTypes.regExpToken)(/(nowrap|wrap|wrap-reverse)/)],
-    "default": 'nowrap'
+    "default": "nowrap"
   },
   flexDirection: {
     tokens: [(0, _tokenTypes.regExpToken)(/(row|row-reverse|column|column-reverse)/)],
-    "default": 'row'
+    "default": "row"
   }
 });
 

package/dist/index.js

@@ -11,12 +11,12 @@ Object.defineProperty(exports, "transformCSS", {
   }
 });
 
+var _parse = _interopRequireDefault(require("css/lib/parse"));
+
 var _cssMediaquery = _interopRequireDefault(require("css-mediaquery"));
 
 var _cssToReactNative = _interopRequireDefault(require("./css-to-react-native"));
 
-var _parse = _interopRequireDefault(require("css/lib/parse"));
-
 var _features = require("./transforms/media-queries/features");
 
 var _types = require("./transforms/media-queries/types");
@@ -37,14 +37,14 @@ var lengthRe = /^(0$|(?:[+-]?(?:\d*\.)?\d+(?:[Ee][+-]?\d+)?)(?=px|rem$))/;
 var viewportUnitRe = /^([+-]?[0-9.]+)(vh|vw|vmin|vmax)$/;
 var percentRe = /^([+-]?(?:\d*\.)?\d+(?:[Ee][+-]?\d+)?%)$/;
 var unsupportedUnitRe = /^([+-]?(?:\d*\.)?\d+(?:[Ee][+-]?\d+)?(ch|em|ex|cm|mm|in|pc|pt))$/;
-var shorthandBorderProps = ['border-radius', 'border-width', 'border-color', 'border-style'];
+var shorthandBorderProps = ["border-radius", "border-width", "border-color", "border-style"];
 
 var transformDecls = function transformDecls(styles, declarations, result) {
   var options = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};
 
   for (var d in declarations) {
     var declaration = declarations[d];
-    if (declaration.type !== 'declaration') continue;
+    if (declaration.type !== "declaration") continue;
     var property = declaration.property;
     var value = (0, _rem.remToPx)(declaration.value);
     var isLengthUnit = lengthRe.test(value);
@@ -52,7 +52,7 @@ var transformDecls = function transformDecls(styles, declarations, result) {
     var isPercent = percentRe.test(value);
     var isUnsupportedUnit = unsupportedUnitRe.test(value);
 
-    if (property === 'line-height' && !isLengthUnit && !isViewportUnit && !isPercent && !isUnsupportedUnit) {
+    if (property === "line-height" && !isLengthUnit && !isViewportUnit && !isPercent && !isUnsupportedUnit) {
       // ignore invalid value avoid throw error cause app crash
       continue;
     }
@@ -63,13 +63,13 @@ var transformDecls = function transformDecls(styles, declarations, result) {
     // do not be wrapped by scalePx2dp function
 
 
-    if (typeof options.scalable === 'boolean' && !options.scalable && /(\d+)px/.test(value)) {
-      value = value.replace(/(\d+)px/g, '$1PX');
+    if (typeof options.scalable === "boolean" && !options.scalable && /(\d+)px/.test(value)) {
+      value = value.replace(/(\d+)px/g, "$1PX");
     } // expect value is legal so that remove !import
 
 
     if (/!import/i.test(value)) {
-      value = value.replace(/!import/, '');
+      value = value.replace(/!import/, "");
     }
 
     if (shorthandBorderProps.indexOf(property) > -1) {
@@ -102,7 +102,7 @@ var transform = function transform(css, options) {
     var rule = rules[r];
 
     for (var s in rule.selectors) {
-      if (rule.selectors[s] === ':export') {
+      if (rule.selectors[s] === ":export") {
         if (!result.__exportProps) {
           result.__exportProps = {};
         }
@@ -110,7 +110,7 @@ var transform = function transform(css, options) {
         rule.declarations.forEach(function (_ref) {
           var property = _ref.property,
               value = _ref.value;
-          var isAlreadyDefinedAsClass = typeof result[property] !== 'undefined' && typeof result.__exportProps[property] === 'undefined';
+          var isAlreadyDefinedAsClass = typeof result[property] !== "undefined" && typeof result.__exportProps[property] === "undefined";
 
           if (isAlreadyDefinedAsClass) {
             throw new Error("Failed to parse :export block because a CSS class in the same file is already using the name \"".concat(property, "\""));
@@ -121,16 +121,16 @@ var transform = function transform(css, options) {
         continue;
       }
 
-      if (rule.selectors[s].indexOf('.') !== 0 || rule.selectors[s].indexOf(':') !== -1 || rule.selectors[s].indexOf('[') !== -1 || rule.selectors[s].indexOf('~') !== -1 || rule.selectors[s].indexOf('>') !== -1 || rule.selectors[s].indexOf('+') !== -1 || rule.selectors[s].indexOf(' ') !== -1) {
+      if (rule.selectors[s].indexOf(".") !== 0 || rule.selectors[s].indexOf(":") !== -1 || rule.selectors[s].indexOf("[") !== -1 || rule.selectors[s].indexOf("~") !== -1 || rule.selectors[s].indexOf(">") !== -1 || rule.selectors[s].indexOf("+") !== -1 || rule.selectors[s].indexOf(" ") !== -1) {
         continue;
       }
 
-      var selector = rule.selectors[s].replace(/^\./, '');
+      var selector = rule.selectors[s].replace(/^\./, "");
       var styles = result[selector] = result[selector] || {};
       transformDecls(styles, rule.declarations, result, options);
     }
 
-    if (rule.type === 'media' && options != null && options.parseMediaQueries === true) {
+    if (rule.type === "media" && options != null && options.parseMediaQueries === true) {
       var parsed = _cssMediaquery["default"].parse(rule.media);
 
       parsed.forEach(function (mq) {
@@ -140,7 +140,7 @@ var transform = function transform(css, options) {
 
         mq.expressions.forEach(function (e) {
           var mf = e.modifier ? "".concat(e.modifier, "-").concat(e.feature) : e.feature;
-          var val = e.value ? ": ".concat(e.value) : '';
+          var val = e.value ? ": ".concat(e.value) : "";
 
           if (_features.mediaQueryFeatures.indexOf(e.feature) === -1) {
             throw new Error("Failed to parse media query feature \"".concat(mf, "\""));
@@ -151,7 +151,7 @@ var transform = function transform(css, options) {
           }
         });
       });
-      var media = '@media ' + rule.media;
+      var media = "@media " + rule.media;
       result.__mediaQueries = result.__mediaQueries || {};
       result.__mediaQueries[media] = parsed;
 
@@ -161,7 +161,7 @@ var transform = function transform(css, options) {
         for (var _s in ruleRule.selectors) {
           result[media] = result[media] || {};
 
-          var _selector = ruleRule.selectors[_s].replace(/^\./, '');
+          var _selector = ruleRule.selectors[_s].replace(/^\./, "");
 
           var mediaStyles = result[media][_selector] = result[media][_selector] || {};
           transformDecls(mediaStyles, ruleRule.declarations, result, options);

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "taro-css-to-react-native",
   "description": "Convert CSS text to a React Native stylesheet object",
-  "version": "3.5.0-theta.0",
+  "version": "3.5.0-theta.1",
   "main": "dist/index.js",
   "license": "MIT",
   "dependencies": {
@@ -11,10 +11,6 @@
     "css-mediaquery": "^0.1.2",
     "postcss-value-parser": "^3.3.0"
   },
-  "scripts": {
-    "build": "babel src --ignore *.spec.js --out-dir ./dist",
-    "test": "jest"
-  },
   "repository": {
     "type": "git",
     "url": "git+https://github.com/NervJS/taro.git"
@@ -62,5 +58,9 @@
     "index.d.ts",
     "CHANGELOG.md",
     "README.md"
-  ]
-}
+  ],
+  "scripts": {
+    "build": "babel src --ignore *.spec.js --out-dir ./dist",
+    "test": "jest"
+  }
+}

package/src/css-to-react-native/index.js

@@ -1,79 +1,89 @@
 /* eslint-disable no-param-reassign */
-import parse from 'postcss-value-parser'
-import camelizeStyleName from 'camelize'
-import transforms from './transforms/index'
-import TokenStream from './TokenStream'
+import camelizeStyleName from "camelize";
+import parse from "postcss-value-parser";
+
+import TokenStream from "./TokenStream";
+import transforms from "./transforms/index";
 
 // Note if this is wrong, you'll need to change tokenTypes.js too
-const numberOrLengthRe = /^([+-]?(?:\d*\.)?\d+(?:[Ee][+-]?\d+)?)(?:px)?$/i
-const boolRe = /^true|false$/i
-const nullRe = /^null$/i
-const undefinedRe = /^undefined$/i
+const numberOrLengthRe = /^([+-]?(?:\d*\.)?\d+(?:[Ee][+-]?\d+)?)(?:px)?$/i;
+const boolRe = /^true|false$/i;
+const nullRe = /^null$/i;
+const undefinedRe = /^undefined$/i;
 
 // Undocumented export
 export const transformRawValue = input => {
-  const value = input.trim()
+  const value = input.trim();
 
-  const numberMatch = value.match(numberOrLengthRe)
+  const numberMatch = value.match(numberOrLengthRe);
   if (numberMatch !== null) {
-    const num = Number(numberMatch[1])
+    const num = Number(numberMatch[1]);
     if (/(\d+)px/.test(value)) {
-      return `scalePx2dp(${num})`
+      return `scalePx2dp(${num})`;
     } else {
-      return num
+      return num;
     }
   }
 
-  const boolMatch = input.match(boolRe)
-  if (boolMatch !== null) return boolMatch[0].toLowerCase() === 'true'
+  const boolMatch = input.match(boolRe);
+  if (boolMatch !== null) return boolMatch[0].toLowerCase() === "true";
 
-  const nullMatch = input.match(nullRe)
-  if (nullMatch !== null) return null
+  const nullMatch = input.match(nullRe);
+  if (nullMatch !== null) return null;
 
-  const undefinedMatch = input.match(undefinedRe)
-  if (undefinedMatch !== null) return undefined
+  const undefinedMatch = input.match(undefinedRe);
+  if (undefinedMatch !== null) return undefined;
 
-  return value
-}
+  return value;
+};
 
 const baseTransformShorthandValue = (propName, inputValue) => {
   // const ast = parse(inputValue.trim().replace(/PX|Px|pX$/g, ""));
-  const ast = parse(inputValue)
-  const tokenStream = new TokenStream(ast.nodes)
-  return transforms[propName](tokenStream)
-}
+  const ast = parse(inputValue);
+  const tokenStream = new TokenStream(ast.nodes);
+  return transforms[propName](tokenStream);
+};
 
 const checkBaseTransformShorthandValue = (propName, inputValue) => {
   try {
-    return baseTransformShorthandValue(propName, inputValue)
+    return baseTransformShorthandValue(propName, inputValue);
   } catch (e) {
-    throw new Error(`${e.message} Failed to parse declaration "${propName}: ${inputValue}"`)
+    throw new Error(
+      `${e.message} Failed to parse declaration "${propName}: ${inputValue}"`,
+    );
   }
-}
+};
 
 const transformShorthandValue =
-  process.env.NODE_ENV === 'production'
+  process.env.NODE_ENV === "production"
     ? baseTransformShorthandValue
-    : checkBaseTransformShorthandValue
+    : checkBaseTransformShorthandValue;
 
 export const getStylesForProperty = (propName, inputValue, allowShorthand) => {
-  const isRawValue = allowShorthand === false || !(propName in transforms)
-  const propValue = isRawValue ? transformRawValue(inputValue) : transformShorthandValue(propName, inputValue.trim())
-  return propValue && propValue.$merge ? propValue.$merge : { [propName]: propValue }
-}
+  const isRawValue = allowShorthand === false || !(propName in transforms);
+  const propValue = isRawValue
+    ? transformRawValue(inputValue)
+    : transformShorthandValue(propName, inputValue.trim());
+  return propValue && propValue.$merge
+    ? propValue.$merge
+    : { [propName]: propValue };
+};
 
 export const getPropertyName = propName => {
-  const isCustomProp = /^--\w+/.test(propName)
+  const isCustomProp = /^--\w+/.test(propName);
   if (isCustomProp) {
-    return propName
+    return propName;
   }
-  return camelizeStyleName(propName)
-}
+  return camelizeStyleName(propName);
+};
 
 export default (rules, shorthandBlacklist = []) =>
   rules.reduce((accum, rule) => {
-    const propertyName = getPropertyName(rule[0])
-    const value = rule[1]
-    const allowShorthand = shorthandBlacklist.indexOf(propertyName) === -1
-    return Object.assign(accum, getStylesForProperty(propertyName, value, allowShorthand))
-  }, {})
+    const propertyName = getPropertyName(rule[0]);
+    const value = rule[1];
+    const allowShorthand = shorthandBlacklist.indexOf(propertyName) === -1;
+    return Object.assign(
+      accum,
+      getStylesForProperty(propertyName, value, allowShorthand),
+    );
+  }, {});