taro-css-to-react-native 3.5.0-canary.0 → 3.5.0-theta.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/css-to-react-native/TokenStream.js +1 -1
- package/dist/css-to-react-native/index.js +6 -6
- package/dist/css-to-react-native/tokenTypes.js +31 -12
- package/dist/css-to-react-native/transforms/border.js +63 -0
- package/dist/css-to-react-native/transforms/font.js +12 -12
- package/dist/css-to-react-native/transforms/index.js +16 -38
- package/dist/css-to-react-native/transforms/util.js +1 -1
- package/dist/index.js +23 -17
- package/dist/transforms/media-queries/types.js +1 -1
- package/package.json +6 -7
- package/src/css-to-react-native/index.js +53 -43
- package/src/css-to-react-native/tokenTypes.js +58 -38
- package/src/css-to-react-native/transforms/border.js +46 -0
- package/src/css-to-react-native/transforms/font.js +46 -37
- package/src/css-to-react-native/transforms/index.js +41 -52
- package/src/index.js +96 -93
|
@@ -9,7 +9,7 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
|
|
|
9
9
|
|
|
10
10
|
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); } }
|
|
11
11
|
|
|
12
|
-
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
|
|
12
|
+
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
|
|
13
13
|
|
|
14
14
|
var SYMBOL_MATCH = 'SYMBOL_MATCH';
|
|
15
15
|
|
|
@@ -3,16 +3,16 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports
|
|
7
|
-
|
|
8
|
-
var _postcssValueParser = _interopRequireDefault(require("postcss-value-parser"));
|
|
6
|
+
exports.transformRawValue = exports.getStylesForProperty = exports.getPropertyName = exports["default"] = void 0;
|
|
9
7
|
|
|
10
8
|
var _camelize = _interopRequireDefault(require("camelize"));
|
|
11
9
|
|
|
12
|
-
var
|
|
10
|
+
var _postcssValueParser = _interopRequireDefault(require("postcss-value-parser"));
|
|
13
11
|
|
|
14
12
|
var _TokenStream = _interopRequireDefault(require("./TokenStream"));
|
|
15
13
|
|
|
14
|
+
var _index = _interopRequireDefault(require("./transforms/index"));
|
|
15
|
+
|
|
16
16
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
17
17
|
|
|
18
18
|
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) {
|
|
|
38
38
|
}
|
|
39
39
|
|
|
40
40
|
var boolMatch = input.match(boolRe);
|
|
41
|
-
if (boolMatch !== null) return boolMatch[0].toLowerCase() ===
|
|
41
|
+
if (boolMatch !== null) return boolMatch[0].toLowerCase() === "true";
|
|
42
42
|
var nullMatch = input.match(nullRe);
|
|
43
43
|
if (nullMatch !== null) return null;
|
|
44
44
|
var undefinedMatch = input.match(undefinedRe);
|
|
@@ -63,7 +63,7 @@ var checkBaseTransformShorthandValue = function checkBaseTransformShorthandValue
|
|
|
63
63
|
}
|
|
64
64
|
};
|
|
65
65
|
|
|
66
|
-
var transformShorthandValue = process.env.NODE_ENV ===
|
|
66
|
+
var transformShorthandValue = process.env.NODE_ENV === "production" ? baseTransformShorthandValue : checkBaseTransformShorthandValue;
|
|
67
67
|
|
|
68
68
|
var getStylesForProperty = function getStylesForProperty(propName, inputValue, allowShorthand) {
|
|
69
69
|
var isRawValue = allowShorthand === false || !(propName in _index["default"]);
|
|
@@ -5,26 +5,26 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports.tokens = exports.regExpToken = void 0;
|
|
7
7
|
|
|
8
|
-
var _postcssValueParser = require("postcss-value-parser");
|
|
9
|
-
|
|
10
8
|
var _cssColorKeywords = _interopRequireDefault(require("css-color-keywords"));
|
|
11
9
|
|
|
10
|
+
var _postcssValueParser = require("postcss-value-parser");
|
|
11
|
+
|
|
12
12
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
13
13
|
|
|
14
14
|
var matchString = function matchString(node) {
|
|
15
|
-
if (node.type !==
|
|
15
|
+
if (node.type !== "string") return null;
|
|
16
16
|
return node.value.replace(/\\([0-9a-f]{1,6})(?:\s|$)/gi, function (match, charCode) {
|
|
17
17
|
return String.fromCharCode(parseInt(charCode, 16));
|
|
18
|
-
}).replace(/\\/g,
|
|
18
|
+
}).replace(/\\/g, "");
|
|
19
19
|
};
|
|
20
20
|
|
|
21
21
|
var hexColorRe = /^(#(?:[0-9a-f]{3,4}){1,2})$/i;
|
|
22
22
|
var cssFunctionNameRe = /^(rgba?|hsla?|hwb|lab|lch|gray|color)$/;
|
|
23
23
|
|
|
24
24
|
var matchColor = function matchColor(node) {
|
|
25
|
-
if (node.type ===
|
|
25
|
+
if (node.type === "word" && (hexColorRe.test(node.value) || node.value in _cssColorKeywords["default"] || node.value === "transparent")) {
|
|
26
26
|
return node.value;
|
|
27
|
-
} else if (node.type ===
|
|
27
|
+
} else if (node.type === "function" && cssFunctionNameRe.test(node.value)) {
|
|
28
28
|
return (0, _postcssValueParser.stringify)(node);
|
|
29
29
|
}
|
|
30
30
|
|
|
@@ -44,7 +44,7 @@ var percentRe = /^([+-]?(?:\d*\.)?\d+(?:[Ee][+-]?\d+)?%)$/;
|
|
|
44
44
|
|
|
45
45
|
var noopToken = function noopToken(predicate) {
|
|
46
46
|
return function (node) {
|
|
47
|
-
return predicate(node) ?
|
|
47
|
+
return predicate(node) ? "<token>" : null;
|
|
48
48
|
};
|
|
49
49
|
};
|
|
50
50
|
|
|
@@ -54,10 +54,28 @@ var valueForTypeToken = function valueForTypeToken(type) {
|
|
|
54
54
|
};
|
|
55
55
|
};
|
|
56
56
|
|
|
57
|
+
var functionValueForTypeToken = function functionValueForTypeToken(type) {
|
|
58
|
+
return function (node) {
|
|
59
|
+
if (node.type === type) {
|
|
60
|
+
// handle rgb(a) function value
|
|
61
|
+
if (/^rgba?$/i.test(node.value)) {
|
|
62
|
+
var result = node.nodes.filter(function (token) {
|
|
63
|
+
return token.type === "word";
|
|
64
|
+
}).map(function (token) {
|
|
65
|
+
return token.value;
|
|
66
|
+
});
|
|
67
|
+
return "".concat(node.value, "(").concat(result.join(", "), ")");
|
|
68
|
+
}
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
return null;
|
|
72
|
+
};
|
|
73
|
+
};
|
|
74
|
+
|
|
57
75
|
var regExpToken = function regExpToken(regExp) {
|
|
58
76
|
var transform = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : String;
|
|
59
77
|
return function (node) {
|
|
60
|
-
if (node.type !==
|
|
78
|
+
if (node.type !== "word") return null;
|
|
61
79
|
var match = node.value.match(regExp);
|
|
62
80
|
if (match === null) return null;
|
|
63
81
|
var value = transform(match[1]);
|
|
@@ -73,15 +91,16 @@ var regExpToken = function regExpToken(regExp) {
|
|
|
73
91
|
exports.regExpToken = regExpToken;
|
|
74
92
|
var tokens = {
|
|
75
93
|
SPACE: noopToken(function (node) {
|
|
76
|
-
return node.type ===
|
|
94
|
+
return node.type === "space";
|
|
77
95
|
}),
|
|
78
96
|
SLASH: noopToken(function (node) {
|
|
79
|
-
return node.type ===
|
|
97
|
+
return node.type === "div" && node.value === "/";
|
|
80
98
|
}),
|
|
81
99
|
COMMA: noopToken(function (node) {
|
|
82
|
-
return node.type ===
|
|
100
|
+
return node.type === "div" && node.value === ",";
|
|
83
101
|
}),
|
|
84
|
-
WORD: valueForTypeToken(
|
|
102
|
+
WORD: valueForTypeToken("word"),
|
|
103
|
+
FUNC: functionValueForTypeToken("function"),
|
|
85
104
|
NONE: regExpToken(noneRe),
|
|
86
105
|
AUTO: regExpToken(autoRe),
|
|
87
106
|
NUMBER: regExpToken(numberRe, Number),
|
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.borderWidth = exports.borderTop = exports.borderRight = exports.borderRadius = exports.borderLeft = exports.borderColor = exports.borderBottom = exports.border = void 0;
|
|
7
|
+
|
|
8
|
+
var _tokenTypes = require("../tokenTypes");
|
|
9
|
+
|
|
10
|
+
var _util = require("./util");
|
|
11
|
+
|
|
12
|
+
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; }
|
|
13
|
+
|
|
14
|
+
var WORD = _tokenTypes.tokens.WORD,
|
|
15
|
+
FUNC = _tokenTypes.tokens.FUNC,
|
|
16
|
+
COLOR = _tokenTypes.tokens.COLOR,
|
|
17
|
+
LENGTH = _tokenTypes.tokens.LENGTH,
|
|
18
|
+
UNSUPPORTED_LENGTH_UNIT = _tokenTypes.tokens.UNSUPPORTED_LENGTH_UNIT;
|
|
19
|
+
|
|
20
|
+
function borderDirectionFactory() {
|
|
21
|
+
var _anyOrderFactory;
|
|
22
|
+
|
|
23
|
+
var direction = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : "";
|
|
24
|
+
var prefix = "border".concat(direction);
|
|
25
|
+
return (0, _util.anyOrderFactory)((_anyOrderFactory = {}, _defineProperty(_anyOrderFactory, "".concat(prefix, "Width"), {
|
|
26
|
+
tokens: [LENGTH, UNSUPPORTED_LENGTH_UNIT],
|
|
27
|
+
"default": 1
|
|
28
|
+
}), _defineProperty(_anyOrderFactory, "".concat(prefix, "Color"), {
|
|
29
|
+
tokens: [COLOR],
|
|
30
|
+
"default": "black"
|
|
31
|
+
}), _defineProperty(_anyOrderFactory, "".concat(prefix, "Style"), {
|
|
32
|
+
tokens: [(0, _tokenTypes.regExpToken)(/^(solid|dashed|dotted)$/)],
|
|
33
|
+
"default": "solid"
|
|
34
|
+
}), _anyOrderFactory));
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
var border = borderDirectionFactory();
|
|
38
|
+
exports.border = border;
|
|
39
|
+
var borderTop = borderDirectionFactory("Top");
|
|
40
|
+
exports.borderTop = borderTop;
|
|
41
|
+
var borderRight = borderDirectionFactory("Right");
|
|
42
|
+
exports.borderRight = borderRight;
|
|
43
|
+
var borderBottom = borderDirectionFactory("Bottom");
|
|
44
|
+
exports.borderBottom = borderBottom;
|
|
45
|
+
var borderLeft = borderDirectionFactory("Left");
|
|
46
|
+
exports.borderLeft = borderLeft;
|
|
47
|
+
var borderColor = (0, _util.directionFactory)({
|
|
48
|
+
types: [WORD, FUNC],
|
|
49
|
+
prefix: "border",
|
|
50
|
+
suffix: "Color"
|
|
51
|
+
});
|
|
52
|
+
exports.borderColor = borderColor;
|
|
53
|
+
var borderRadius = (0, _util.directionFactory)({
|
|
54
|
+
directions: ["TopLeft", "TopRight", "BottomRight", "BottomLeft"],
|
|
55
|
+
prefix: "border",
|
|
56
|
+
suffix: "Radius"
|
|
57
|
+
});
|
|
58
|
+
exports.borderRadius = borderRadius;
|
|
59
|
+
var borderWidth = (0, _util.directionFactory)({
|
|
60
|
+
prefix: "border",
|
|
61
|
+
suffix: "Width"
|
|
62
|
+
});
|
|
63
|
+
exports.borderWidth = borderWidth;
|
|
@@ -5,10 +5,10 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports["default"] = void 0;
|
|
7
7
|
|
|
8
|
-
var _fontFamily = _interopRequireDefault(require("./fontFamily"));
|
|
9
|
-
|
|
10
8
|
var _tokenTypes = require("../tokenTypes");
|
|
11
9
|
|
|
10
|
+
var _fontFamily = _interopRequireDefault(require("./fontFamily"));
|
|
11
|
+
|
|
12
12
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
13
13
|
|
|
14
14
|
var SPACE = _tokenTypes.tokens.SPACE,
|
|
@@ -20,8 +20,8 @@ var NORMAL = (0, _tokenTypes.regExpToken)(/^(normal)$/);
|
|
|
20
20
|
var STYLE = (0, _tokenTypes.regExpToken)(/^(italic)$/);
|
|
21
21
|
var WEIGHT = (0, _tokenTypes.regExpToken)(/^([1-9]00|bold)$/);
|
|
22
22
|
var VARIANT = (0, _tokenTypes.regExpToken)(/^(small-caps)$/);
|
|
23
|
-
var defaultFontStyle =
|
|
24
|
-
var defaultFontWeight =
|
|
23
|
+
var defaultFontStyle = "normal";
|
|
24
|
+
var defaultFontWeight = "normal";
|
|
25
25
|
var defaultFontVariant = [];
|
|
26
26
|
|
|
27
27
|
var _default = function _default(tokenStream) {
|
|
@@ -36,11 +36,11 @@ var _default = function _default(tokenStream) {
|
|
|
36
36
|
while (numStyleWeightVariantMatched < 3 && tokenStream.hasTokens()) {
|
|
37
37
|
if (tokenStream.matches(NORMAL)) {
|
|
38
38
|
/* pass */
|
|
39
|
-
} else if (typeof fontStyle ===
|
|
39
|
+
} else if (typeof fontStyle === "undefined" && tokenStream.matches(STYLE)) {
|
|
40
40
|
fontStyle = tokenStream.lastValue;
|
|
41
|
-
} else if (typeof fontWeight ===
|
|
41
|
+
} else if (typeof fontWeight === "undefined" && tokenStream.matches(WEIGHT)) {
|
|
42
42
|
fontWeight = tokenStream.lastValue;
|
|
43
|
-
} else if (typeof fontVariant ===
|
|
43
|
+
} else if (typeof fontVariant === "undefined" && tokenStream.matches(VARIANT)) {
|
|
44
44
|
fontVariant = [tokenStream.lastValue];
|
|
45
45
|
} else {
|
|
46
46
|
break;
|
|
@@ -54,7 +54,7 @@ var _default = function _default(tokenStream) {
|
|
|
54
54
|
|
|
55
55
|
if (tokenStream.matches(SLASH)) {
|
|
56
56
|
if (tokenStream.matches(NUMBER)) {
|
|
57
|
-
var size = typeof fontSize ===
|
|
57
|
+
var size = typeof fontSize === "string" ? fontSize.replace(/scalePx2dp\((\d+)\)/, "$1") : fontSize;
|
|
58
58
|
lineHeight = size * tokenStream.lastValue;
|
|
59
59
|
} else {
|
|
60
60
|
lineHeight = tokenStream.expect(LENGTH, UNSUPPORTED_LENGTH_UNIT);
|
|
@@ -63,9 +63,9 @@ var _default = function _default(tokenStream) {
|
|
|
63
63
|
|
|
64
64
|
tokenStream.expect(SPACE);
|
|
65
65
|
var fontFamily = (0, _fontFamily["default"])(tokenStream);
|
|
66
|
-
if (typeof fontStyle ===
|
|
67
|
-
if (typeof fontWeight ===
|
|
68
|
-
if (typeof fontVariant ===
|
|
66
|
+
if (typeof fontStyle === "undefined") fontStyle = defaultFontStyle;
|
|
67
|
+
if (typeof fontWeight === "undefined") fontWeight = defaultFontWeight;
|
|
68
|
+
if (typeof fontVariant === "undefined") fontVariant = defaultFontVariant;
|
|
69
69
|
var out = {
|
|
70
70
|
fontStyle: fontStyle,
|
|
71
71
|
fontWeight: fontWeight,
|
|
@@ -73,7 +73,7 @@ var _default = function _default(tokenStream) {
|
|
|
73
73
|
fontSize: fontSize,
|
|
74
74
|
fontFamily: fontFamily
|
|
75
75
|
};
|
|
76
|
-
if (typeof lineHeight !==
|
|
76
|
+
if (typeof lineHeight !== "undefined") out.lineHeight = lineHeight;
|
|
77
77
|
return {
|
|
78
78
|
$merge: out
|
|
79
79
|
};
|
|
@@ -7,6 +7,8 @@ exports["default"] = void 0;
|
|
|
7
7
|
|
|
8
8
|
var _tokenTypes = require("../tokenTypes");
|
|
9
9
|
|
|
10
|
+
var _border = require("./border");
|
|
11
|
+
|
|
10
12
|
var _boxShadow = _interopRequireDefault(require("./boxShadow"));
|
|
11
13
|
|
|
12
14
|
var _flex = _interopRequireDefault(require("./flex"));
|
|
@@ -15,12 +17,12 @@ var _font = _interopRequireDefault(require("./font"));
|
|
|
15
17
|
|
|
16
18
|
var _fontFamily = _interopRequireDefault(require("./fontFamily"));
|
|
17
19
|
|
|
18
|
-
var _textShadow = _interopRequireDefault(require("./textShadow"));
|
|
19
|
-
|
|
20
20
|
var _textDecoration = _interopRequireDefault(require("./textDecoration"));
|
|
21
21
|
|
|
22
22
|
var _textDecorationLine = _interopRequireDefault(require("./textDecorationLine"));
|
|
23
23
|
|
|
24
|
+
var _textShadow = _interopRequireDefault(require("./textShadow"));
|
|
25
|
+
|
|
24
26
|
var _transform = _interopRequireDefault(require("./transform"));
|
|
25
27
|
|
|
26
28
|
var _util = require("./util");
|
|
@@ -43,49 +45,21 @@ var background = function background(tokenStream) {
|
|
|
43
45
|
};
|
|
44
46
|
};
|
|
45
47
|
|
|
46
|
-
var border = (0, _util.anyOrderFactory)({
|
|
47
|
-
borderWidth: {
|
|
48
|
-
tokens: [LENGTH, UNSUPPORTED_LENGTH_UNIT],
|
|
49
|
-
"default": 1
|
|
50
|
-
},
|
|
51
|
-
borderColor: {
|
|
52
|
-
tokens: [COLOR],
|
|
53
|
-
"default": 'black'
|
|
54
|
-
},
|
|
55
|
-
borderStyle: {
|
|
56
|
-
tokens: [(0, _tokenTypes.regExpToken)(/^(solid|dashed|dotted)$/)],
|
|
57
|
-
"default": 'solid'
|
|
58
|
-
}
|
|
59
|
-
});
|
|
60
|
-
var borderColor = (0, _util.directionFactory)({
|
|
61
|
-
types: [WORD],
|
|
62
|
-
prefix: 'border',
|
|
63
|
-
suffix: 'Color'
|
|
64
|
-
});
|
|
65
|
-
var borderRadius = (0, _util.directionFactory)({
|
|
66
|
-
directions: ['TopLeft', 'TopRight', 'BottomRight', 'BottomLeft'],
|
|
67
|
-
prefix: 'border',
|
|
68
|
-
suffix: 'Radius'
|
|
69
|
-
});
|
|
70
|
-
var borderWidth = (0, _util.directionFactory)({
|
|
71
|
-
prefix: 'border',
|
|
72
|
-
suffix: 'Width'
|
|
73
|
-
});
|
|
74
48
|
var margin = (0, _util.directionFactory)({
|
|
75
49
|
types: [LENGTH, UNSUPPORTED_LENGTH_UNIT, PERCENT, AUTO],
|
|
76
|
-
prefix:
|
|
50
|
+
prefix: "margin"
|
|
77
51
|
});
|
|
78
52
|
var padding = (0, _util.directionFactory)({
|
|
79
|
-
prefix:
|
|
53
|
+
prefix: "padding"
|
|
80
54
|
});
|
|
81
55
|
var flexFlow = (0, _util.anyOrderFactory)({
|
|
82
56
|
flexWrap: {
|
|
83
57
|
tokens: [(0, _tokenTypes.regExpToken)(/(nowrap|wrap|wrap-reverse)/)],
|
|
84
|
-
"default":
|
|
58
|
+
"default": "nowrap"
|
|
85
59
|
},
|
|
86
60
|
flexDirection: {
|
|
87
61
|
tokens: [(0, _tokenTypes.regExpToken)(/(row|row-reverse|column|column-reverse)/)],
|
|
88
|
-
"default":
|
|
62
|
+
"default": "row"
|
|
89
63
|
}
|
|
90
64
|
});
|
|
91
65
|
|
|
@@ -102,10 +76,14 @@ var shadowOffset = (0, _util.shadowOffsetFactory)();
|
|
|
102
76
|
var textShadowOffset = (0, _util.shadowOffsetFactory)();
|
|
103
77
|
var _default = {
|
|
104
78
|
background: background,
|
|
105
|
-
border: border,
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
79
|
+
border: _border.border,
|
|
80
|
+
borderTop: _border.borderTop,
|
|
81
|
+
borderRight: _border.borderRight,
|
|
82
|
+
borderBottom: _border.borderBottom,
|
|
83
|
+
borderLeft: _border.borderLeft,
|
|
84
|
+
borderColor: _border.borderColor,
|
|
85
|
+
borderRadius: _border.borderRadius,
|
|
86
|
+
borderWidth: _border.borderWidth,
|
|
109
87
|
boxShadow: _boxShadow["default"],
|
|
110
88
|
flex: _flex["default"],
|
|
111
89
|
flexFlow: flexFlow,
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.
|
|
6
|
+
exports.shadowOffsetFactory = exports.parseShadow = exports.directionFactory = exports.anyOrderFactory = void 0;
|
|
7
7
|
|
|
8
8
|
var _tokenTypes = require("../tokenTypes");
|
|
9
9
|
|
package/dist/index.js
CHANGED
|
@@ -3,20 +3,20 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
+
exports["default"] = void 0;
|
|
6
7
|
Object.defineProperty(exports, "transformCSS", {
|
|
7
8
|
enumerable: true,
|
|
8
9
|
get: function get() {
|
|
9
10
|
return _cssToReactNative["default"];
|
|
10
11
|
}
|
|
11
12
|
});
|
|
12
|
-
|
|
13
|
+
|
|
14
|
+
var _parse = _interopRequireDefault(require("css/lib/parse"));
|
|
13
15
|
|
|
14
16
|
var _cssMediaquery = _interopRequireDefault(require("css-mediaquery"));
|
|
15
17
|
|
|
16
18
|
var _cssToReactNative = _interopRequireDefault(require("./css-to-react-native"));
|
|
17
19
|
|
|
18
|
-
var _parse = _interopRequireDefault(require("css/lib/parse"));
|
|
19
|
-
|
|
20
20
|
var _features = require("./transforms/media-queries/features");
|
|
21
21
|
|
|
22
22
|
var _types = require("./transforms/media-queries/types");
|
|
@@ -37,14 +37,14 @@ var lengthRe = /^(0$|(?:[+-]?(?:\d*\.)?\d+(?:[Ee][+-]?\d+)?)(?=px|rem$))/;
|
|
|
37
37
|
var viewportUnitRe = /^([+-]?[0-9.]+)(vh|vw|vmin|vmax)$/;
|
|
38
38
|
var percentRe = /^([+-]?(?:\d*\.)?\d+(?:[Ee][+-]?\d+)?%)$/;
|
|
39
39
|
var unsupportedUnitRe = /^([+-]?(?:\d*\.)?\d+(?:[Ee][+-]?\d+)?(ch|em|ex|cm|mm|in|pc|pt))$/;
|
|
40
|
-
var shorthandBorderProps = [
|
|
40
|
+
var shorthandBorderProps = ["border-radius", "border-width", "border-color", "border-style"];
|
|
41
41
|
|
|
42
42
|
var transformDecls = function transformDecls(styles, declarations, result) {
|
|
43
43
|
var options = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};
|
|
44
44
|
|
|
45
45
|
for (var d in declarations) {
|
|
46
46
|
var declaration = declarations[d];
|
|
47
|
-
if (declaration.type !==
|
|
47
|
+
if (declaration.type !== "declaration") continue;
|
|
48
48
|
var property = declaration.property;
|
|
49
49
|
var value = (0, _rem.remToPx)(declaration.value);
|
|
50
50
|
var isLengthUnit = lengthRe.test(value);
|
|
@@ -52,8 +52,9 @@ var transformDecls = function transformDecls(styles, declarations, result) {
|
|
|
52
52
|
var isPercent = percentRe.test(value);
|
|
53
53
|
var isUnsupportedUnit = unsupportedUnitRe.test(value);
|
|
54
54
|
|
|
55
|
-
if (property ===
|
|
56
|
-
|
|
55
|
+
if (property === "line-height" && !isLengthUnit && !isViewportUnit && !isPercent && !isUnsupportedUnit) {
|
|
56
|
+
// ignore invalid value avoid throw error cause app crash
|
|
57
|
+
continue;
|
|
57
58
|
}
|
|
58
59
|
|
|
59
60
|
if (!result.__viewportUnits && isViewportUnit) {
|
|
@@ -62,8 +63,13 @@ var transformDecls = function transformDecls(styles, declarations, result) {
|
|
|
62
63
|
// do not be wrapped by scalePx2dp function
|
|
63
64
|
|
|
64
65
|
|
|
65
|
-
if (
|
|
66
|
-
value = value.replace(/(\d+)px
|
|
66
|
+
if (typeof options.scalable === "boolean" && !options.scalable && /(\d+)px/.test(value)) {
|
|
67
|
+
value = value.replace(/(\d+)px/g, "$1PX");
|
|
68
|
+
} // expect value is legal so that remove !import
|
|
69
|
+
|
|
70
|
+
|
|
71
|
+
if (/!import/i.test(value)) {
|
|
72
|
+
value = value.replace(/!import/, "");
|
|
67
73
|
}
|
|
68
74
|
|
|
69
75
|
if (shorthandBorderProps.indexOf(property) > -1) {
|
|
@@ -96,7 +102,7 @@ var transform = function transform(css, options) {
|
|
|
96
102
|
var rule = rules[r];
|
|
97
103
|
|
|
98
104
|
for (var s in rule.selectors) {
|
|
99
|
-
if (rule.selectors[s] ===
|
|
105
|
+
if (rule.selectors[s] === ":export") {
|
|
100
106
|
if (!result.__exportProps) {
|
|
101
107
|
result.__exportProps = {};
|
|
102
108
|
}
|
|
@@ -104,7 +110,7 @@ var transform = function transform(css, options) {
|
|
|
104
110
|
rule.declarations.forEach(function (_ref) {
|
|
105
111
|
var property = _ref.property,
|
|
106
112
|
value = _ref.value;
|
|
107
|
-
var isAlreadyDefinedAsClass = typeof result[property] !==
|
|
113
|
+
var isAlreadyDefinedAsClass = typeof result[property] !== "undefined" && typeof result.__exportProps[property] === "undefined";
|
|
108
114
|
|
|
109
115
|
if (isAlreadyDefinedAsClass) {
|
|
110
116
|
throw new Error("Failed to parse :export block because a CSS class in the same file is already using the name \"".concat(property, "\""));
|
|
@@ -115,16 +121,16 @@ var transform = function transform(css, options) {
|
|
|
115
121
|
continue;
|
|
116
122
|
}
|
|
117
123
|
|
|
118
|
-
if (rule.selectors[s].indexOf(
|
|
124
|
+
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) {
|
|
119
125
|
continue;
|
|
120
126
|
}
|
|
121
127
|
|
|
122
|
-
var selector = rule.selectors[s].replace(/^\./,
|
|
128
|
+
var selector = rule.selectors[s].replace(/^\./, "");
|
|
123
129
|
var styles = result[selector] = result[selector] || {};
|
|
124
130
|
transformDecls(styles, rule.declarations, result, options);
|
|
125
131
|
}
|
|
126
132
|
|
|
127
|
-
if (rule.type ===
|
|
133
|
+
if (rule.type === "media" && options != null && options.parseMediaQueries === true) {
|
|
128
134
|
var parsed = _cssMediaquery["default"].parse(rule.media);
|
|
129
135
|
|
|
130
136
|
parsed.forEach(function (mq) {
|
|
@@ -134,7 +140,7 @@ var transform = function transform(css, options) {
|
|
|
134
140
|
|
|
135
141
|
mq.expressions.forEach(function (e) {
|
|
136
142
|
var mf = e.modifier ? "".concat(e.modifier, "-").concat(e.feature) : e.feature;
|
|
137
|
-
var val = e.value ? ": ".concat(e.value) :
|
|
143
|
+
var val = e.value ? ": ".concat(e.value) : "";
|
|
138
144
|
|
|
139
145
|
if (_features.mediaQueryFeatures.indexOf(e.feature) === -1) {
|
|
140
146
|
throw new Error("Failed to parse media query feature \"".concat(mf, "\""));
|
|
@@ -145,7 +151,7 @@ var transform = function transform(css, options) {
|
|
|
145
151
|
}
|
|
146
152
|
});
|
|
147
153
|
});
|
|
148
|
-
var media =
|
|
154
|
+
var media = "@media " + rule.media;
|
|
149
155
|
result.__mediaQueries = result.__mediaQueries || {};
|
|
150
156
|
result.__mediaQueries[media] = parsed;
|
|
151
157
|
|
|
@@ -155,7 +161,7 @@ var transform = function transform(css, options) {
|
|
|
155
161
|
for (var _s in ruleRule.selectors) {
|
|
156
162
|
result[media] = result[media] || {};
|
|
157
163
|
|
|
158
|
-
var _selector = ruleRule.selectors[_s].replace(/^\./,
|
|
164
|
+
var _selector = ruleRule.selectors[_s].replace(/^\./, "");
|
|
159
165
|
|
|
160
166
|
var mediaStyles = result[media][_selector] = result[media][_selector] || {};
|
|
161
167
|
transformDecls(mediaStyles, ruleRule.declarations, result, options);
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.
|
|
6
|
+
exports.reactNativeMediaQueryTypes = exports.mediaQueryTypes = exports.defaultTypes = exports.cssnextMediaQueryTypes = void 0;
|
|
7
7
|
var defaultTypes = ['all', 'braille', 'embossed', 'handheld', 'print', 'projection', 'screen', 'speech', 'tty', 'tv'];
|
|
8
8
|
exports.defaultTypes = defaultTypes;
|
|
9
9
|
var cssnextMediaQueryTypes = ['pointer', 'hover', 'block-overflow'];
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "taro-css-to-react-native",
|
|
3
3
|
"description": "Convert CSS text to a React Native stylesheet object",
|
|
4
|
-
"version": "3.5.0-
|
|
4
|
+
"version": "3.5.0-theta.1",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"license": "MIT",
|
|
7
7
|
"dependencies": {
|
|
@@ -11,10 +11,6 @@
|
|
|
11
11
|
"css-mediaquery": "^0.1.2",
|
|
12
12
|
"postcss-value-parser": "^3.3.0"
|
|
13
13
|
},
|
|
14
|
-
"scripts": {
|
|
15
|
-
"build": "babel src --ignore *.spec.js --out-dir ./dist",
|
|
16
|
-
"test": "jest"
|
|
17
|
-
},
|
|
18
14
|
"repository": {
|
|
19
15
|
"type": "git",
|
|
20
16
|
"url": "git+https://github.com/NervJS/taro.git"
|
|
@@ -63,5 +59,8 @@
|
|
|
63
59
|
"CHANGELOG.md",
|
|
64
60
|
"README.md"
|
|
65
61
|
],
|
|
66
|
-
"
|
|
67
|
-
|
|
62
|
+
"scripts": {
|
|
63
|
+
"build": "babel src --ignore *.spec.js --out-dir ./dist",
|
|
64
|
+
"test": "jest"
|
|
65
|
+
}
|
|
66
|
+
}
|