postcss-calc 7.0.3 → 8.1.0
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/index.js +30 -21
- package/dist/lib/convertUnit.js +4 -4
- package/dist/lib/reducer.js +175 -201
- package/dist/lib/stringifier.js +10 -8
- package/dist/lib/transform.js +24 -14
- package/package.json +28 -30
- package/CHANGELOG.md +0 -114
package/dist/index.js
CHANGED
|
@@ -5,38 +5,47 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
7
|
|
|
8
|
-
var _postcss = require("postcss");
|
|
9
|
-
|
|
10
8
|
var _transform = _interopRequireDefault(require("./lib/transform"));
|
|
11
9
|
|
|
12
10
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
11
|
|
|
14
|
-
|
|
15
|
-
|
|
12
|
+
function pluginCreator(opts) {
|
|
13
|
+
const options = Object.assign({
|
|
16
14
|
precision: 5,
|
|
17
15
|
preserve: false,
|
|
18
16
|
warnWhenCannotResolve: false,
|
|
19
17
|
mediaQueries: false,
|
|
20
18
|
selectors: false
|
|
21
19
|
}, opts);
|
|
22
|
-
return
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
20
|
+
return {
|
|
21
|
+
postcssPlugin: 'postcss-calc',
|
|
22
|
+
|
|
23
|
+
OnceExit(css, {
|
|
24
|
+
result
|
|
25
|
+
}) {
|
|
26
|
+
css.walk(node => {
|
|
27
|
+
const {
|
|
28
|
+
type
|
|
29
|
+
} = node;
|
|
30
|
+
|
|
31
|
+
if (type === 'decl') {
|
|
32
|
+
(0, _transform.default)(node, "value", options, result);
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
if (type === 'atrule' && options.mediaQueries) {
|
|
36
|
+
(0, _transform.default)(node, "params", options, result);
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
if (type === 'rule' && options.selectors) {
|
|
40
|
+
(0, _transform.default)(node, "selector", options, result);
|
|
41
|
+
}
|
|
42
|
+
});
|
|
43
|
+
}
|
|
44
|
+
|
|
38
45
|
};
|
|
39
|
-
}
|
|
46
|
+
}
|
|
40
47
|
|
|
48
|
+
pluginCreator.postcss = true;
|
|
49
|
+
var _default = pluginCreator;
|
|
41
50
|
exports.default = _default;
|
|
42
51
|
module.exports = exports.default;
|
package/dist/lib/convertUnit.js
CHANGED
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
|
-
|
|
7
|
+
const conversions = {
|
|
8
8
|
// Absolute length units
|
|
9
9
|
'px': {
|
|
10
10
|
'px': 1,
|
|
@@ -131,8 +131,8 @@ var conversions = {
|
|
|
131
131
|
};
|
|
132
132
|
|
|
133
133
|
function convertUnit(value, sourceUnit, targetUnit, precision) {
|
|
134
|
-
|
|
135
|
-
|
|
134
|
+
const sourceUnitNormalized = sourceUnit.toLowerCase();
|
|
135
|
+
const targetUnitNormalized = targetUnit.toLowerCase();
|
|
136
136
|
|
|
137
137
|
if (!conversions[targetUnitNormalized]) {
|
|
138
138
|
throw new Error("Cannot convert to " + targetUnit);
|
|
@@ -142,7 +142,7 @@ function convertUnit(value, sourceUnit, targetUnit, precision) {
|
|
|
142
142
|
throw new Error("Cannot convert from " + sourceUnit + " to " + targetUnit);
|
|
143
143
|
}
|
|
144
144
|
|
|
145
|
-
|
|
145
|
+
const converted = conversions[targetUnitNormalized][sourceUnitNormalized] * value;
|
|
146
146
|
|
|
147
147
|
if (precision !== false) {
|
|
148
148
|
precision = Math.pow(10, parseInt(precision) || 5);
|
package/dist/lib/reducer.js
CHANGED
|
@@ -9,10 +9,6 @@ var _convertUnit = _interopRequireDefault(require("./convertUnit"));
|
|
|
9
9
|
|
|
10
10
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
11
11
|
|
|
12
|
-
function isEqual(left, right) {
|
|
13
|
-
return left.type === right.type && left.value === right.value;
|
|
14
|
-
}
|
|
15
|
-
|
|
16
12
|
function isValueType(type) {
|
|
17
13
|
switch (type) {
|
|
18
14
|
case 'LengthValue':
|
|
@@ -40,178 +36,126 @@ function flip(operator) {
|
|
|
40
36
|
return operator === '+' ? '-' : '+';
|
|
41
37
|
}
|
|
42
38
|
|
|
43
|
-
function
|
|
44
|
-
|
|
45
|
-
node.value = -node.value;
|
|
46
|
-
} else if (node.type === 'MathExpression') {
|
|
47
|
-
if (node.operator === '*' || node.operator === '/') {
|
|
48
|
-
node.left = flipValue(node.left);
|
|
49
|
-
} else {
|
|
50
|
-
node.left = flipValue(node.left);
|
|
51
|
-
node.right = flipValue(node.right);
|
|
52
|
-
}
|
|
53
|
-
}
|
|
54
|
-
|
|
55
|
-
return node;
|
|
39
|
+
function isAddSubOperator(operator) {
|
|
40
|
+
return operator === '+' || operator === '-';
|
|
56
41
|
}
|
|
57
42
|
|
|
58
|
-
function
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
return node.left;
|
|
63
|
-
} // 0 + something => something
|
|
43
|
+
function collectAddSubItems(preOperator, node, collected, precision) {
|
|
44
|
+
if (!isAddSubOperator(preOperator)) {
|
|
45
|
+
throw new Error(`invalid operator ${preOperator}`);
|
|
46
|
+
}
|
|
64
47
|
|
|
48
|
+
const type = node.type;
|
|
65
49
|
|
|
66
|
-
if (isValueType(
|
|
67
|
-
|
|
68
|
-
} // 0 - something => -something
|
|
50
|
+
if (isValueType(type)) {
|
|
51
|
+
const itemIndex = collected.findIndex(x => x.node.type === type);
|
|
69
52
|
|
|
53
|
+
if (itemIndex >= 0) {
|
|
54
|
+
if (node.value === 0) {
|
|
55
|
+
return;
|
|
56
|
+
}
|
|
70
57
|
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
58
|
+
const {
|
|
59
|
+
left: reducedNode,
|
|
60
|
+
right: current
|
|
61
|
+
} = covertNodesUnits(collected[itemIndex].node, node, precision);
|
|
75
62
|
|
|
63
|
+
if (collected[itemIndex].preOperator === '-') {
|
|
64
|
+
collected[itemIndex].preOperator = '+';
|
|
65
|
+
reducedNode.value *= -1;
|
|
66
|
+
}
|
|
76
67
|
|
|
77
|
-
|
|
78
|
-
|
|
68
|
+
if (preOperator === "+") {
|
|
69
|
+
reducedNode.value += current.value;
|
|
70
|
+
} else {
|
|
71
|
+
reducedNode.value -= current.value;
|
|
72
|
+
} // make sure reducedNode.value >= 0
|
|
79
73
|
|
|
80
|
-
var _covertNodesUnits = covertNodesUnits(node.left, node.right, precision),
|
|
81
|
-
left = _covertNodesUnits.left,
|
|
82
|
-
right = _covertNodesUnits.right;
|
|
83
74
|
|
|
84
|
-
|
|
85
|
-
|
|
75
|
+
if (reducedNode.value >= 0) {
|
|
76
|
+
collected[itemIndex] = {
|
|
77
|
+
node: reducedNode,
|
|
78
|
+
preOperator: '+'
|
|
79
|
+
};
|
|
80
|
+
} else {
|
|
81
|
+
reducedNode.value *= -1;
|
|
82
|
+
collected[itemIndex] = {
|
|
83
|
+
node: reducedNode,
|
|
84
|
+
preOperator: '-'
|
|
85
|
+
};
|
|
86
|
+
}
|
|
86
87
|
} else {
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
if (node.right.type === 'MathExpression' && (node.right.operator === '+' || node.right.operator === '-')) {
|
|
95
|
-
// something - (something + something) => something - something - something
|
|
96
|
-
// something - (something - something) => something - something + something
|
|
97
|
-
if ((node.right.operator === '+' || node.right.operator === '-') && node.operator === '-') {
|
|
98
|
-
node.right.operator = flip(node.right.operator);
|
|
99
|
-
}
|
|
100
|
-
|
|
101
|
-
if (isValueType(node.left.type)) {
|
|
102
|
-
// value + (value + something) => value + something
|
|
103
|
-
// value + (value - something) => value - something
|
|
104
|
-
// value - (value + something) => value - something
|
|
105
|
-
// value - (value - something) => value + something
|
|
106
|
-
if (node.left.type === node.right.left.type) {
|
|
107
|
-
var _left = node.left,
|
|
108
|
-
_operator = node.operator,
|
|
109
|
-
_right = node.right;
|
|
110
|
-
node.left = reduce({
|
|
111
|
-
type: 'MathExpression',
|
|
112
|
-
operator: _operator,
|
|
113
|
-
left: _left,
|
|
114
|
-
right: _right.left
|
|
88
|
+
// make sure node.value >= 0
|
|
89
|
+
if (node.value >= 0) {
|
|
90
|
+
collected.push({
|
|
91
|
+
node,
|
|
92
|
+
preOperator
|
|
115
93
|
});
|
|
116
|
-
|
|
117
|
-
node.
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
// something - (something + value) => dimension - something
|
|
122
|
-
// something - (something - value) => dimension - something
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
if (node.left.type === node.right.right.type) {
|
|
126
|
-
var _left2 = node.left,
|
|
127
|
-
_right2 = node.right;
|
|
128
|
-
node.left = reduce({
|
|
129
|
-
type: 'MathExpression',
|
|
130
|
-
operator: _right2.operator,
|
|
131
|
-
left: _left2,
|
|
132
|
-
right: _right2.right
|
|
94
|
+
} else {
|
|
95
|
+
node.value *= -1;
|
|
96
|
+
collected.push({
|
|
97
|
+
node,
|
|
98
|
+
preOperator: flip(preOperator)
|
|
133
99
|
});
|
|
134
|
-
node.right = _right2.left;
|
|
135
|
-
return reduce(node, precision);
|
|
136
100
|
}
|
|
137
101
|
}
|
|
138
|
-
}
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
if (node.right.type === node.left.left.type) {
|
|
147
|
-
var _left3 = node.left,
|
|
148
|
-
_operator2 = node.operator,
|
|
149
|
-
_right3 = node.right;
|
|
150
|
-
_left3.left = reduce({
|
|
151
|
-
type: 'MathExpression',
|
|
152
|
-
operator: _operator2,
|
|
153
|
-
left: _left3.left,
|
|
154
|
-
right: _right3
|
|
155
|
-
}, precision);
|
|
156
|
-
return reduce(_left3, precision);
|
|
157
|
-
} // (something + dimension) + dimension => something + dimension
|
|
158
|
-
// (something - dimension) + dimension => something - dimension
|
|
159
|
-
// (something + dimension) - dimension => something + dimension
|
|
160
|
-
// (something - dimension) - dimension => something - dimension
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
if (node.right.type === node.left.right.type) {
|
|
164
|
-
var _left4 = node.left,
|
|
165
|
-
_operator3 = node.operator,
|
|
166
|
-
_right4 = node.right;
|
|
167
|
-
|
|
168
|
-
if (_left4.operator === '-') {
|
|
169
|
-
_left4.operator = _operator3 === '-' ? '-' : '+';
|
|
170
|
-
_left4.right = reduce({
|
|
171
|
-
type: 'MathExpression',
|
|
172
|
-
operator: _operator3 === '-' ? '+' : '-',
|
|
173
|
-
left: _right4,
|
|
174
|
-
right: _left4.right
|
|
175
|
-
}, precision);
|
|
176
|
-
} else {
|
|
177
|
-
_left4.right = reduce({
|
|
178
|
-
type: 'MathExpression',
|
|
179
|
-
operator: _operator3,
|
|
180
|
-
left: _left4.right,
|
|
181
|
-
right: _right4
|
|
182
|
-
}, precision);
|
|
183
|
-
}
|
|
102
|
+
} else if (type === "MathExpression") {
|
|
103
|
+
if (isAddSubOperator(node.operator)) {
|
|
104
|
+
collectAddSubItems(preOperator, node.left, collected, precision);
|
|
105
|
+
const collectRightOperator = preOperator === '-' ? flip(node.operator) : node.operator;
|
|
106
|
+
collectAddSubItems(collectRightOperator, node.right, collected, precision);
|
|
107
|
+
} else {
|
|
108
|
+
// * or /
|
|
109
|
+
const reducedNode = reduce(node, precision); // prevent infinite recursive call
|
|
184
110
|
|
|
185
|
-
if (
|
|
186
|
-
|
|
187
|
-
|
|
111
|
+
if (reducedNode.type !== "MathExpression" || isAddSubOperator(reducedNode.operator)) {
|
|
112
|
+
collectAddSubItems(preOperator, reducedNode, collected, precision);
|
|
113
|
+
} else {
|
|
114
|
+
collected.push({
|
|
115
|
+
node: reducedNode,
|
|
116
|
+
preOperator
|
|
117
|
+
});
|
|
188
118
|
}
|
|
189
|
-
|
|
190
|
-
_left4.parenthesized = node.parenthesized;
|
|
191
|
-
return reduce(_left4, precision);
|
|
192
119
|
}
|
|
193
|
-
}
|
|
194
|
-
|
|
195
|
-
|
|
120
|
+
} else {
|
|
121
|
+
collected.push({
|
|
122
|
+
node,
|
|
123
|
+
preOperator
|
|
124
|
+
});
|
|
125
|
+
}
|
|
126
|
+
}
|
|
196
127
|
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
128
|
+
function reduceAddSubExpression(node, precision) {
|
|
129
|
+
const collected = [];
|
|
130
|
+
collectAddSubItems('+', node, collected, precision);
|
|
131
|
+
const withoutZeroItem = collected.filter(item => !(isValueType(item.node.type) && item.node.value === 0));
|
|
132
|
+
const firstNonZeroItem = withoutZeroItem[0]; // could be undefined
|
|
133
|
+
// prevent producing "calc(-var(--a))" or "calc()"
|
|
134
|
+
// which is invalid css
|
|
135
|
+
|
|
136
|
+
if (!firstNonZeroItem || firstNonZeroItem.preOperator === '-' && !isValueType(firstNonZeroItem.node.type)) {
|
|
137
|
+
const firstZeroItem = collected.find(item => isValueType(item.node.type) && item.node.value === 0);
|
|
138
|
+
withoutZeroItem.unshift(firstZeroItem);
|
|
139
|
+
} // make sure the preOperator of the first item is +
|
|
140
|
+
|
|
141
|
+
|
|
142
|
+
if (withoutZeroItem[0].preOperator === '-' && isValueType(withoutZeroItem[0].node.type)) {
|
|
143
|
+
withoutZeroItem[0].node.value *= -1;
|
|
144
|
+
withoutZeroItem[0].preOperator = '+';
|
|
145
|
+
}
|
|
204
146
|
|
|
205
|
-
|
|
206
|
-
var _newNodes = covertNodesUnits(node.left.left, node.right.right, precision);
|
|
147
|
+
let root = withoutZeroItem[0].node;
|
|
207
148
|
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
149
|
+
for (let i = 1; i < withoutZeroItem.length; i++) {
|
|
150
|
+
root = {
|
|
151
|
+
type: 'MathExpression',
|
|
152
|
+
operator: withoutZeroItem[i].preOperator,
|
|
153
|
+
left: root,
|
|
154
|
+
right: withoutZeroItem[i].node
|
|
155
|
+
};
|
|
212
156
|
}
|
|
213
157
|
|
|
214
|
-
return
|
|
158
|
+
return root;
|
|
215
159
|
}
|
|
216
160
|
|
|
217
161
|
function reduceDivisionExpression(node) {
|
|
@@ -223,51 +167,93 @@ function reduceDivisionExpression(node) {
|
|
|
223
167
|
throw new Error(`Cannot divide by "${node.right.unit}", number expected`);
|
|
224
168
|
}
|
|
225
169
|
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
} // something / value
|
|
170
|
+
return applyNumberDivision(node.left, node.right.value);
|
|
171
|
+
} // apply (expr) / number
|
|
229
172
|
|
|
230
173
|
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
174
|
+
function applyNumberDivision(node, divisor) {
|
|
175
|
+
if (divisor === 0) {
|
|
176
|
+
throw new Error('Cannot divide by zero');
|
|
234
177
|
}
|
|
235
178
|
|
|
236
|
-
|
|
179
|
+
if (isValueType(node.type)) {
|
|
180
|
+
node.value /= divisor;
|
|
181
|
+
return node;
|
|
182
|
+
}
|
|
183
|
+
|
|
184
|
+
if (node.type === "MathExpression" && isAddSubOperator(node.operator)) {
|
|
185
|
+
// turn (a + b) / num into a/num + b/num
|
|
186
|
+
// is good for further reduction
|
|
187
|
+
// checkout the test case
|
|
188
|
+
// "should reduce division before reducing additions"
|
|
189
|
+
return {
|
|
190
|
+
type: "MathExpression",
|
|
191
|
+
operator: node.operator,
|
|
192
|
+
left: applyNumberDivision(node.left, divisor),
|
|
193
|
+
right: applyNumberDivision(node.right, divisor)
|
|
194
|
+
};
|
|
195
|
+
} // it is impossible to reduce it into a single value
|
|
196
|
+
// .e.g the node contains css variable
|
|
197
|
+
// so we just preserve the division and let browser do it
|
|
198
|
+
|
|
199
|
+
|
|
200
|
+
return {
|
|
201
|
+
type: "MathExpression",
|
|
202
|
+
operator: '/',
|
|
203
|
+
left: node,
|
|
204
|
+
right: {
|
|
205
|
+
type: "Number",
|
|
206
|
+
value: divisor
|
|
207
|
+
}
|
|
208
|
+
};
|
|
237
209
|
}
|
|
238
210
|
|
|
239
211
|
function reduceMultiplicationExpression(node) {
|
|
240
212
|
// (expr) * number
|
|
241
|
-
if (node.
|
|
242
|
-
|
|
243
|
-
node.left.left.value *= node.right.value;
|
|
244
|
-
node.left.right.value *= node.right.value;
|
|
245
|
-
return node.left;
|
|
246
|
-
}
|
|
247
|
-
} // something * number
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
if (isValueType(node.left.type) && node.right.type === 'Number') {
|
|
251
|
-
node.left.value *= node.right.value;
|
|
252
|
-
return node.left;
|
|
213
|
+
if (node.right.type === 'Number') {
|
|
214
|
+
return applyNumberMultiplication(node.left, node.right.value);
|
|
253
215
|
} // number * (expr)
|
|
254
216
|
|
|
255
217
|
|
|
256
|
-
if (node.left.type === 'Number'
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
} // number * something
|
|
218
|
+
if (node.left.type === 'Number') {
|
|
219
|
+
return applyNumberMultiplication(node.right, node.left.value);
|
|
220
|
+
}
|
|
221
|
+
|
|
222
|
+
return node;
|
|
223
|
+
} // apply (expr) / number
|
|
263
224
|
|
|
264
225
|
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
226
|
+
function applyNumberMultiplication(node, multiplier) {
|
|
227
|
+
if (isValueType(node.type)) {
|
|
228
|
+
node.value *= multiplier;
|
|
229
|
+
return node;
|
|
268
230
|
}
|
|
269
231
|
|
|
270
|
-
|
|
232
|
+
if (node.type === "MathExpression" && isAddSubOperator(node.operator)) {
|
|
233
|
+
// turn (a + b) * num into a*num + b*num
|
|
234
|
+
// is good for further reduction
|
|
235
|
+
// checkout the test case
|
|
236
|
+
// "should reduce multiplication before reducing additions"
|
|
237
|
+
return {
|
|
238
|
+
type: "MathExpression",
|
|
239
|
+
operator: node.operator,
|
|
240
|
+
left: applyNumberMultiplication(node.left, multiplier),
|
|
241
|
+
right: applyNumberMultiplication(node.right, multiplier)
|
|
242
|
+
};
|
|
243
|
+
} // it is impossible to reduce it into a single value
|
|
244
|
+
// .e.g the node contains css variable
|
|
245
|
+
// so we just preserve the division and let browser do it
|
|
246
|
+
|
|
247
|
+
|
|
248
|
+
return {
|
|
249
|
+
type: "MathExpression",
|
|
250
|
+
operator: '*',
|
|
251
|
+
left: node,
|
|
252
|
+
right: {
|
|
253
|
+
type: "Number",
|
|
254
|
+
value: multiplier
|
|
255
|
+
}
|
|
256
|
+
};
|
|
271
257
|
}
|
|
272
258
|
|
|
273
259
|
function covertNodesUnits(left, right, precision) {
|
|
@@ -278,7 +264,7 @@ function covertNodesUnits(left, right, precision) {
|
|
|
278
264
|
case 'FrequencyValue':
|
|
279
265
|
case 'ResolutionValue':
|
|
280
266
|
if (right.type === left.type && right.unit && left.unit) {
|
|
281
|
-
|
|
267
|
+
const converted = (0, _convertUnit.default)(right.value, right.unit, left.unit, precision);
|
|
282
268
|
right = {
|
|
283
269
|
type: left.type,
|
|
284
270
|
value: converted,
|
|
@@ -301,14 +287,15 @@ function covertNodesUnits(left, right, precision) {
|
|
|
301
287
|
|
|
302
288
|
function reduce(node, precision) {
|
|
303
289
|
if (node.type === "MathExpression") {
|
|
290
|
+
if (isAddSubOperator(node.operator)) {
|
|
291
|
+
// reduceAddSubExpression will call reduce recursively
|
|
292
|
+
return reduceAddSubExpression(node, precision);
|
|
293
|
+
}
|
|
294
|
+
|
|
304
295
|
node.left = reduce(node.left, precision);
|
|
305
296
|
node.right = reduce(node.right, precision);
|
|
306
297
|
|
|
307
298
|
switch (node.operator) {
|
|
308
|
-
case "+":
|
|
309
|
-
case "-":
|
|
310
|
-
return reduceAddSubExpression(node, precision);
|
|
311
|
-
|
|
312
299
|
case "/":
|
|
313
300
|
return reduceDivisionExpression(node, precision);
|
|
314
301
|
|
|
@@ -324,17 +311,4 @@ function reduce(node, precision) {
|
|
|
324
311
|
|
|
325
312
|
var _default = reduce;
|
|
326
313
|
exports.default = _default;
|
|
327
|
-
|
|
328
|
-
function isCSSFunction(node) {
|
|
329
|
-
if (node.type === "Function") {
|
|
330
|
-
return true;
|
|
331
|
-
}
|
|
332
|
-
|
|
333
|
-
if (node.type === "MathExpression") {
|
|
334
|
-
return isCSSFunction(node.left) || isCSSFunction(node.right);
|
|
335
|
-
}
|
|
336
|
-
|
|
337
|
-
return false;
|
|
338
|
-
}
|
|
339
|
-
|
|
340
314
|
module.exports = exports.default;
|
package/dist/lib/stringifier.js
CHANGED
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.default = _default;
|
|
7
|
-
|
|
7
|
+
const order = {
|
|
8
8
|
"*": 0,
|
|
9
9
|
"/": 0,
|
|
10
10
|
"+": 1,
|
|
@@ -13,7 +13,7 @@ var order = {
|
|
|
13
13
|
|
|
14
14
|
function round(value, prec) {
|
|
15
15
|
if (prec !== false) {
|
|
16
|
-
|
|
16
|
+
const precision = Math.pow(10, prec);
|
|
17
17
|
return Math.round(value * precision) / precision;
|
|
18
18
|
}
|
|
19
19
|
|
|
@@ -24,10 +24,12 @@ function stringify(node, prec) {
|
|
|
24
24
|
switch (node.type) {
|
|
25
25
|
case "MathExpression":
|
|
26
26
|
{
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
27
|
+
const {
|
|
28
|
+
left,
|
|
29
|
+
right,
|
|
30
|
+
operator: op
|
|
31
|
+
} = node;
|
|
32
|
+
let str = "";
|
|
31
33
|
|
|
32
34
|
if (left.type === 'MathExpression' && order[op] < order[left.operator]) {
|
|
33
35
|
str += `(${stringify(left, prec)})`;
|
|
@@ -58,8 +60,8 @@ function stringify(node, prec) {
|
|
|
58
60
|
}
|
|
59
61
|
|
|
60
62
|
function _default(calc, node, originalValue, options, result, item) {
|
|
61
|
-
|
|
62
|
-
|
|
63
|
+
let str = stringify(node, options.precision);
|
|
64
|
+
const shouldPrintCalc = node.type === "MathExpression" || node.type === "Function";
|
|
63
65
|
|
|
64
66
|
if (shouldPrintCalc) {
|
|
65
67
|
// if calc expression couldn't be resolved to a single value, re-wrap it as
|
package/dist/lib/transform.js
CHANGED
|
@@ -18,42 +18,42 @@ var _stringifier = _interopRequireDefault(require("./stringifier"));
|
|
|
18
18
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
19
19
|
|
|
20
20
|
// eslint-disable-next-line import/no-unresolved
|
|
21
|
-
|
|
21
|
+
const MATCH_CALC = /((?:-(moz|webkit)-)?calc)/i;
|
|
22
22
|
|
|
23
23
|
function transformValue(value, options, result, item) {
|
|
24
|
-
return (0, _postcssValueParser.default)(value).walk(
|
|
24
|
+
return (0, _postcssValueParser.default)(value).walk(node => {
|
|
25
25
|
// skip anything which isn't a calc() function
|
|
26
|
-
if (node.type !==
|
|
26
|
+
if (node.type !== "function" || !MATCH_CALC.test(node.value)) {
|
|
27
27
|
return node;
|
|
28
28
|
} // stringify calc expression and produce an AST
|
|
29
29
|
|
|
30
30
|
|
|
31
|
-
|
|
31
|
+
const contents = _postcssValueParser.default.stringify(node.nodes);
|
|
32
32
|
|
|
33
|
-
|
|
33
|
+
const ast = _parser.parser.parse(contents); // reduce AST to its simplest form, that is, either to a single value
|
|
34
34
|
// or a simplified calc expression
|
|
35
35
|
|
|
36
36
|
|
|
37
|
-
|
|
37
|
+
const reducedAst = (0, _reducer.default)(ast, options.precision); // stringify AST and write it back
|
|
38
38
|
|
|
39
|
-
node.type =
|
|
39
|
+
node.type = "word";
|
|
40
40
|
node.value = (0, _stringifier.default)(node.value, reducedAst, value, options, result, item);
|
|
41
41
|
return false;
|
|
42
42
|
}).toString();
|
|
43
43
|
}
|
|
44
44
|
|
|
45
45
|
function transformSelector(value, options, result, item) {
|
|
46
|
-
return (0, _postcssSelectorParser.default)(
|
|
47
|
-
selectors.walk(
|
|
46
|
+
return (0, _postcssSelectorParser.default)(selectors => {
|
|
47
|
+
selectors.walk(node => {
|
|
48
48
|
// attribute value
|
|
49
49
|
// e.g. the "calc(3*3)" part of "div[data-size="calc(3*3)"]"
|
|
50
|
-
if (node.type ===
|
|
50
|
+
if (node.type === "attribute" && node.value) {
|
|
51
51
|
node.setValue(transformValue(node.value, options, result, item));
|
|
52
52
|
} // tag value
|
|
53
53
|
// e.g. the "calc(3*3)" part of "div:nth-child(2n + calc(3*3))"
|
|
54
54
|
|
|
55
55
|
|
|
56
|
-
if (node.type ===
|
|
56
|
+
if (node.type === "tag") {
|
|
57
57
|
node.value = transformValue(node.value, options, result, item);
|
|
58
58
|
}
|
|
59
59
|
|
|
@@ -62,14 +62,24 @@ function transformSelector(value, options, result, item) {
|
|
|
62
62
|
}).processSync(value);
|
|
63
63
|
}
|
|
64
64
|
|
|
65
|
-
var _default =
|
|
66
|
-
|
|
65
|
+
var _default = (node, property, options, result) => {
|
|
66
|
+
let value = node[property];
|
|
67
|
+
|
|
68
|
+
try {
|
|
69
|
+
value = property === "selector" ? transformSelector(node[property], options, result, node) : transformValue(node[property], options, result, node);
|
|
70
|
+
} catch (error) {
|
|
71
|
+
result.warn(error.message, {
|
|
72
|
+
node
|
|
73
|
+
});
|
|
74
|
+
return;
|
|
75
|
+
} // if the preserve option is enabled and the value has changed, write the
|
|
67
76
|
// transformed value into a cloned node which is inserted before the current
|
|
68
77
|
// node, preserving the original value. Otherwise, overwrite the original
|
|
69
78
|
// value.
|
|
70
79
|
|
|
80
|
+
|
|
71
81
|
if (options.preserve && node[property] !== value) {
|
|
72
|
-
|
|
82
|
+
const clone = node.clone();
|
|
73
83
|
clone[property] = value;
|
|
74
84
|
node.parent.insertBefore(node, clone);
|
|
75
85
|
} else {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "postcss-calc",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "8.1.0",
|
|
4
4
|
"description": "PostCSS plugin to reduce calc()",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"css",
|
|
@@ -14,48 +14,46 @@
|
|
|
14
14
|
"dist",
|
|
15
15
|
"LICENSE"
|
|
16
16
|
],
|
|
17
|
-
"scripts": {
|
|
18
|
-
"prepublish": "npm run build",
|
|
19
|
-
"build": "del-cli dist && cross-env BABEL_ENV=publish babel src --out-dir dist --ignore src/__tests__/**/*.js && jison src/parser.jison -o dist/parser.js",
|
|
20
|
-
"pretest": "npm run build && eslint src",
|
|
21
|
-
"test": "ava"
|
|
22
|
-
},
|
|
23
17
|
"author": "Andy Jansson",
|
|
24
18
|
"license": "MIT",
|
|
25
19
|
"repository": "https://github.com/postcss/postcss-calc.git",
|
|
26
20
|
"eslintConfig": {
|
|
27
|
-
"
|
|
28
|
-
|
|
21
|
+
"extends": [
|
|
22
|
+
"eslint:recommended",
|
|
23
|
+
"plugin:import/recommended"
|
|
24
|
+
],
|
|
29
25
|
"rules": {
|
|
30
26
|
"curly": "error"
|
|
31
27
|
}
|
|
32
28
|
},
|
|
33
29
|
"devDependencies": {
|
|
34
|
-
"@babel
|
|
35
|
-
"@babel/
|
|
36
|
-
"@babel/
|
|
37
|
-
"@babel/
|
|
38
|
-
"
|
|
39
|
-
"ava": "^1.4.1",
|
|
40
|
-
"babel-eslint": "^10.0.1",
|
|
30
|
+
"@ava/babel": "^2.0.0",
|
|
31
|
+
"@babel/cli": "^7.16.0",
|
|
32
|
+
"@babel/core": "^7.16.5",
|
|
33
|
+
"@babel/plugin-transform-modules-commonjs": "^7.16.5",
|
|
34
|
+
"ava": "^3.15.0",
|
|
41
35
|
"babel-plugin-add-module-exports": "^1.0.0",
|
|
42
|
-
"
|
|
43
|
-
"
|
|
44
|
-
"
|
|
45
|
-
"
|
|
46
|
-
"
|
|
47
|
-
"eslint-plugin-import": "^2.14.0",
|
|
48
|
-
"jison-gho": "^0.6.1-215"
|
|
36
|
+
"eslint": "^8.5.0",
|
|
37
|
+
"eslint-plugin-import": "^2.25.3",
|
|
38
|
+
"jison-gho": "^0.6.1-216",
|
|
39
|
+
"postcss": "^8.2.2",
|
|
40
|
+
"rimraf": "^3.0.2"
|
|
49
41
|
},
|
|
50
42
|
"dependencies": {
|
|
51
|
-
"postcss": "^7.0.27",
|
|
52
43
|
"postcss-selector-parser": "^6.0.2",
|
|
53
44
|
"postcss-value-parser": "^4.0.2"
|
|
54
45
|
},
|
|
46
|
+
"peerDependencies": {
|
|
47
|
+
"postcss": "^8.2.2"
|
|
48
|
+
},
|
|
55
49
|
"ava": {
|
|
56
|
-
"
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
50
|
+
"babel": true
|
|
51
|
+
},
|
|
52
|
+
"scripts": {
|
|
53
|
+
"build": "rimraf dist && babel src --out-dir dist --ignore src/__tests__/**/*.js && jison src/parser.jison -o dist/parser.js",
|
|
54
|
+
"lint": "eslint src",
|
|
55
|
+
"pretest": "pnpm run build",
|
|
56
|
+
"test": "ava"
|
|
57
|
+
},
|
|
58
|
+
"readme": "# PostCSS Calc [<img src=\"https://postcss.github.io/postcss/logo.svg\" alt=\"PostCSS\" width=\"90\" height=\"90\" align=\"right\">][PostCSS]\n\n[![NPM Version][npm-img]][npm-url]\n[![Build Status][cli-img]][cli-url]\n[![Support Chat][git-img]][git-url]\n\n[PostCSS Calc] lets you reduce `calc()` references whenever it's possible. This\ncan be particularly useful with the [PostCSS Custom Properties] plugin.\n\nWhen multiple units are mixed together in the same expression, the `calc()`\nstatement is left as is, to fallback to the [W3C calc() implementation].\n\n## Installation\n\n```bash\nnpm install postcss-calc\n```\n\n## Usage\n\n```js\n// dependencies\nvar fs = require(\"fs\")\nvar postcss = require(\"postcss\")\nvar calc = require(\"postcss-calc\")\n\n// css to be processed\nvar css = fs.readFileSync(\"input.css\", \"utf8\")\n\n// process css\nvar output = postcss()\n .use(calc())\n .process(css)\n .css\n```\n\n**Example** (with [PostCSS Custom Properties] enabled as well):\n\n```js\n// dependencies\nvar fs = require(\"fs\")\nvar postcss = require(\"postcss\")\nvar customProperties = require(\"postcss-custom-properties\")\nvar calc = require(\"postcss-calc\")\n\n// css to be processed\nvar css = fs.readFileSync(\"input.css\", \"utf8\")\n\n// process css\nvar output = postcss()\n .use(customProperties())\n .use(calc())\n .process(css)\n .css\n```\n\nUsing this `input.css`:\n\n```css\n:root {\n --main-font-size: 16px;\n}\n\nbody {\n font-size: var(--main-font-size);\n}\n\nh1 {\n font-size: calc(var(--main-font-size) * 2);\n height: calc(100px - 2em);\n margin-bottom: calc(\n var(--main-font-size)\n * 1.5\n )\n}\n```\n\nyou will get:\n\n```css\nbody {\n font-size: 16px\n}\n\nh1 {\n font-size: 32px;\n height: calc(100px - 2em);\n margin-bottom: 24px\n}\n```\n\nCheckout [tests] for more examples.\n\n### Options\n\n#### `precision` (default: `5`)\n\nAllow you to define the precision for decimal numbers.\n\n```js\nvar out = postcss()\n .use(calc({precision: 10}))\n .process(css)\n .css\n```\n\n#### `preserve` (default: `false`)\n\nAllow you to preserve calc() usage in output so browsers will handle decimal\nprecision themselves.\n\n```js\nvar out = postcss()\n .use(calc({preserve: true}))\n .process(css)\n .css\n```\n\n#### `warnWhenCannotResolve` (default: `false`)\n\nAdds warnings when calc() are not reduced to a single value.\n\n```js\nvar out = postcss()\n .use(calc({warnWhenCannotResolve: true}))\n .process(css)\n .css\n```\n\n#### `mediaQueries` (default: `false`)\n\nAllows calc() usage as part of media query declarations.\n\n```js\nvar out = postcss()\n .use(calc({mediaQueries: true}))\n .process(css)\n .css\n```\n\n#### `selectors` (default: `false`)\n\nAllows calc() usage as part of selectors.\n\n```js\nvar out = postcss()\n .use(calc({selectors: true}))\n .process(css)\n .css\n```\n\nExample:\n\n```css\ndiv[data-size=\"calc(3*3)\"] {\n width: 100px;\n}\n```\n\n---\n\n## Contributing\n\nWork on a branch, install dev-dependencies, respect coding style & run tests\nbefore submitting a bug fix or a feature.\n\n```bash\ngit clone git@github.com:postcss/postcss-calc.git\ngit checkout -b patch-1\nnpm install\nnpm test\n```\n\n## [Changelog](CHANGELOG.md)\n\n## [License](LICENSE)\n\n[cli-img]: https://img.shields.io/travis/postcss/postcss-calc/master.svg\n[cli-url]: https://travis-ci.org/postcss/postcss-calc\n[git-img]: https://img.shields.io/badge/support-chat-blue.svg\n[git-url]: https://gitter.im/postcss/postcss\n[npm-img]: https://img.shields.io/npm/v/postcss-calc.svg\n[npm-url]: https://www.npmjs.com/package/postcss-calc\n\n[PostCSS]: https://github.com/postcss\n[PostCSS Calc]: https://github.com/postcss/postcss-calc\n[PostCSS Custom Properties]: https://github.com/postcss/postcss-custom-properties\n[tests]: src/__tests__/index.js\n[W3C calc() implementation]: https://www.w3.org/TR/css3-values/#calc-notation\n"
|
|
59
|
+
}
|
package/CHANGELOG.md
DELETED
|
@@ -1,114 +0,0 @@
|
|
|
1
|
-
# 7.0.3
|
|
2
|
-
|
|
3
|
-
- Fixed: substracted css-variable from zero ([#111](https://github.com/postcss/postcss-calc/issues/111))
|
|
4
|
-
|
|
5
|
-
# 7.0.2
|
|
6
|
-
|
|
7
|
-
- Fixed: incorrect reduction of subtraction from zero ([#88](https://github.com/postcss/postcss-calc/issues/88))
|
|
8
|
-
- Fixed: doesn't remove calc for single function
|
|
9
|
-
- Fixed: relax parser on unknown units ([#76](https://github.com/postcss/postcss-calc/issues/76))
|
|
10
|
-
- Fixed: handle numbers with exponen composed ([#83](https://github.com/postcss/postcss-calc/pull/83))
|
|
11
|
-
- Fixed: handle plus sign before value ([#79](https://github.com/postcss/postcss-calc/pull/79))
|
|
12
|
-
- Fixed: better handle precision for nested calc ([#75](https://github.com/postcss/postcss-calc/pull/75))
|
|
13
|
-
- Fixed: properly handle nested add and sub expression inside sub expression ([#64](https://github.com/postcss/postcss-calc/issues/64))
|
|
14
|
-
- Fixed: handle uppercase units and functions ([#71](https://github.com/postcss/postcss-calc/pull/71))
|
|
15
|
-
- Fixed: do not break `calc` with single var ([cssnano/cssnano#725](https://github.com/cssnano/cssnano/issues/725))
|
|
16
|
-
- Updated: `postcss` to 7.0.27 (patch)
|
|
17
|
-
- Updated: `postcss-selector-parser` to 6.0.2
|
|
18
|
-
- Updated: `postcss-value-parser` to 4.0.2
|
|
19
|
-
|
|
20
|
-
# 7.0.1
|
|
21
|
-
|
|
22
|
-
- Updated: `postcss` to 7.0.2 (patch)
|
|
23
|
-
- Updated: `postcss-selector-parser` to 5.0.0-rc.4 (patch)
|
|
24
|
-
- Updated: `postcss-value-parser` to 3.3.1 (patch)
|
|
25
|
-
|
|
26
|
-
# 7.0.0
|
|
27
|
-
|
|
28
|
-
- Changed: Updated postcss-selector-parser to version 5.0.0-rc.3
|
|
29
|
-
- Changed: Dropped reduce-css-calc as a dependency
|
|
30
|
-
- Fixed: Support constant() and env() ([#42](https://github.com/postcss/postcss-calc/issues/42), [#48](https://github.com/postcss/postcss-calc/issues/48))
|
|
31
|
-
- Fixed: Support custom properties with "calc" in its name ([#50](https://github.com/postcss/postcss-calc/issues/50))
|
|
32
|
-
- Fixed: Remove unnecessary whitespace around `*` and `/` ([cssnano#625](https://github.com/cssnano/cssnano/issues/625))
|
|
33
|
-
- Fixed: Arithmetic bugs around subtraction ([#49](https://github.com/postcss/postcss-calc/issues/49))
|
|
34
|
-
- Fixed: Handling of nested calc statements ([reduce-css-calc#49](https://github.com/MoOx/reduce-css-calc/issues/49))
|
|
35
|
-
- Fixed: Bugs regarding complex calculations ([reduce-cs-calc#45](https://github.com/MoOx/reduce-css-calc/issues/45))
|
|
36
|
-
- Fixed: `100%` incorrectly being transformed to `1` ([reduce-css-calc#44](https://github.com/MoOx/reduce-css-calc/issues/44))
|
|
37
|
-
- Added: support for case-insensitive calc statements
|
|
38
|
-
|
|
39
|
-
# 6.0.2 - 2018-09-25
|
|
40
|
-
|
|
41
|
-
- Fixed: use PostCSS 7 (thanks to @douglasduteil)
|
|
42
|
-
|
|
43
|
-
# 6.0.1 - 2017-10-10
|
|
44
|
-
|
|
45
|
-
- Fixed: throwing error for attribute selectors without a value
|
|
46
|
-
|
|
47
|
-
# 6.0.0 - 2017-05-08
|
|
48
|
-
|
|
49
|
-
- Breaking: Updated PostCSS from v5.x to v6.x, and reduce-css-calc from v1.x
|
|
50
|
-
to v2.x (thanks to @andyjansson).
|
|
51
|
-
|
|
52
|
-
# 5.3.1 - 2016-08-22
|
|
53
|
-
|
|
54
|
-
- Fixed: avoid security issue related to ``reduce-css-calc@< 1.2.4``.
|
|
55
|
-
|
|
56
|
-
# 5.3.0 - 2016-07-11
|
|
57
|
-
|
|
58
|
-
- Added: support for selector transformation via `selectors` option.
|
|
59
|
-
([#29](https://github.com/postcss/postcss-calc/pull/29) - @uniquegestaltung)
|
|
60
|
-
|
|
61
|
-
# 5.2.1 - 2016-04-10
|
|
62
|
-
|
|
63
|
-
- Fixed: support for multiline value
|
|
64
|
-
([#27](https://github.com/postcss/postcss-calc/pull/27))
|
|
65
|
-
|
|
66
|
-
# 5.2.0 - 2016-01-08
|
|
67
|
-
|
|
68
|
-
- Added: "mediaQueries" option for `@media` support
|
|
69
|
-
([#22](https://github.com/postcss/postcss-calc/pull/22))
|
|
70
|
-
|
|
71
|
-
# 5.1.0 - 2016-01-07
|
|
72
|
-
|
|
73
|
-
- Added: "warnWhenCannotResolve" option to warn when calc() are not reduced to a single value
|
|
74
|
-
([#20](https://github.com/postcss/postcss-calc/pull/20))
|
|
75
|
-
|
|
76
|
-
# 5.0.0 - 2015-08-25
|
|
77
|
-
|
|
78
|
-
- Removed: compatibility with postcss v4.x
|
|
79
|
-
- Added: compatibility with postcss v5.x
|
|
80
|
-
|
|
81
|
-
# 4.1.0 - 2015-04-09
|
|
82
|
-
|
|
83
|
-
- Added: compatibility with postcss v4.1.x ([#12](https://github.com/postcss/postcss-calc/pull/12))
|
|
84
|
-
|
|
85
|
-
# 4.0.1 - 2015-04-09
|
|
86
|
-
|
|
87
|
-
- Fixed: `preserve` option does not create duplicated values ([#7](https://github.com/postcss/postcss-calc/issues/7))
|
|
88
|
-
|
|
89
|
-
# 4.0.0 - 2015-01-26
|
|
90
|
-
|
|
91
|
-
- Added: compatibility with postcss v4.x
|
|
92
|
-
- Changed: partial compatiblity with postcss v3.x (stack traces have lost filename)
|
|
93
|
-
|
|
94
|
-
# 3.0.0 - 2014-11-24
|
|
95
|
-
|
|
96
|
-
- Added: GNU like exceptions ([#4](https://github.com/postcss/postcss-calc/issues/4))
|
|
97
|
-
- Added: `precision` option ([#5](https://github.com/postcss/postcss-calc/issues/5))
|
|
98
|
-
- Added: `preserve` option ([#6](https://github.com/postcss/postcss-calc/issues/6))
|
|
99
|
-
|
|
100
|
-
# 2.1.0 - 2014-10-15
|
|
101
|
-
|
|
102
|
-
- Added: source of the error (gnu like message) (fix [#3](https://github.com/postcss/postcss-calc/issues/3))
|
|
103
|
-
|
|
104
|
-
# 2.0.1 - 2014-08-10
|
|
105
|
-
|
|
106
|
-
- Fixed: correctly ignore unrecognized values (fix [#2](https://github.com/postcss/postcss-calc/issues/2))
|
|
107
|
-
|
|
108
|
-
# 2.0.0 - 2014-08-06
|
|
109
|
-
|
|
110
|
-
- Changed: Plugin now return a function to have a consistent api. ([ref 1](https://github.com/ianstormtaylor/rework-color-function/issues/6), [ref 2](https://twitter.com/jongleberry/status/496552790416576513))
|
|
111
|
-
|
|
112
|
-
# 1.0.0 - 2014-08-04
|
|
113
|
-
|
|
114
|
-
✨ First release based on [rework-calc](https://github.com/reworkcss/rework-calc) v1.1.0 (code mainly exported to [`reduce-css-calc`](https://github.com/MoOx/reduce-css-calc))
|