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 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
- var _default = (0, _postcss.plugin)('postcss-calc', function (opts) {
15
- var options = Object.assign({
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 function (css, result) {
23
- css.walk(function (node) {
24
- var type = node.type;
25
-
26
- if (type === 'decl') {
27
- (0, _transform.default)(node, "value", options, result);
28
- }
29
-
30
- if (type === 'atrule' && options.mediaQueries) {
31
- (0, _transform.default)(node, "params", options, result);
32
- }
33
-
34
- if (type === 'rule' && options.selectors) {
35
- (0, _transform.default)(node, "selector", options, result);
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;
@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.default = void 0;
7
- var conversions = {
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
- var sourceUnitNormalized = sourceUnit.toLowerCase();
135
- var targetUnitNormalized = targetUnit.toLowerCase();
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
- var converted = conversions[targetUnitNormalized][sourceUnitNormalized] * value;
145
+ const converted = conversions[targetUnitNormalized][sourceUnitNormalized] * value;
146
146
 
147
147
  if (precision !== false) {
148
148
  precision = Math.pow(10, parseInt(precision) || 5);
@@ -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 flipValue(node) {
44
- if (isValueType(node.type)) {
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 reduceAddSubExpression(node, precision) {
59
- // something + 0 => something
60
- // something - 0 => something
61
- if (isValueType(node.right.type) && node.right.value === 0) {
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(node.left.type) && node.left.value === 0 && node.operator === "+") {
67
- return node.right;
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
- if (isValueType(node.left.type) && node.left.value === 0 && node.operator === "-" && !isCSSFunction(node.right)) {
72
- return flipValue(node.right);
73
- } // value + value
74
- // value - value
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
- if (isValueType(node.left.type) && node.left.type === node.right.type) {
78
- var operator = node.operator;
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
- if (operator === "+") {
85
- left.value += right.value;
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
- left.value -= right.value;
88
- }
89
-
90
- return left;
91
- } // value <op> (expr)
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
- node.operator = _right.operator;
117
- node.right = _right.right;
118
- return reduce(node, precision);
119
- } // something + (something + value) => dimension + something
120
- // something + (something - value) => dimension + something
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
- } // (expr) <op> value
139
-
140
-
141
- if (node.left.type === 'MathExpression' && (node.left.operator === '+' || node.left.operator === '-') && isValueType(node.right.type)) {
142
- // (value + something) + value => value + something
143
- // (value - something) + value => value - something
144
- // (value + something) - value => value + something
145
- // (value - something) - value => value - something
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 (_left4.right.value < 0) {
186
- _left4.right.value *= -1;
187
- _left4.operator = _left4.operator === '-' ? '+' : '-';
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
- } // (expr) + (expr) => number
194
- // (expr) - (expr) => number
195
-
120
+ } else {
121
+ collected.push({
122
+ node,
123
+ preOperator
124
+ });
125
+ }
126
+ }
196
127
 
197
- if (node.right.type === 'MathExpression' && node.left.type === 'MathExpression') {
198
- if (isEqual(node.left.right, node.right.right)) {
199
- var newNodes = covertNodesUnits(node.left.left, node.right.left, precision);
200
- node.left = newNodes.left;
201
- node.right = newNodes.right;
202
- return reduce(node);
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
- if (isEqual(node.left.right, node.right.left)) {
206
- var _newNodes = covertNodesUnits(node.left.left, node.right.right, precision);
147
+ let root = withoutZeroItem[0].node;
207
148
 
208
- node.left = _newNodes.left;
209
- node.right = _newNodes.right;
210
- return reduce(node);
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 node;
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
- if (node.right.value === 0) {
227
- throw new Error('Cannot divide by zero');
228
- } // something / value
170
+ return applyNumberDivision(node.left, node.right.value);
171
+ } // apply (expr) / number
229
172
 
230
173
 
231
- if (isValueType(node.left.type)) {
232
- node.left.value /= node.right.value;
233
- return node.left;
174
+ function applyNumberDivision(node, divisor) {
175
+ if (divisor === 0) {
176
+ throw new Error('Cannot divide by zero');
234
177
  }
235
178
 
236
- return node;
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.left.type === 'MathExpression' && node.right.type === 'Number') {
242
- if (isValueType(node.left.left.type) && isValueType(node.left.right.type)) {
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' && node.right.type === 'MathExpression') {
257
- if (isValueType(node.right.left.type) && isValueType(node.right.right.type)) {
258
- node.right.left.value *= node.left.value;
259
- node.right.right.value *= node.left.value;
260
- return node.right;
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
- if (node.left.type === 'Number' && isValueType(node.right.type)) {
266
- node.right.value *= node.left.value;
267
- return node.right;
226
+ function applyNumberMultiplication(node, multiplier) {
227
+ if (isValueType(node.type)) {
228
+ node.value *= multiplier;
229
+ return node;
268
230
  }
269
231
 
270
- return node;
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
- var converted = (0, _convertUnit.default)(right.value, right.unit, left.unit, precision);
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;
@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.default = _default;
7
- var order = {
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
- var precision = Math.pow(10, prec);
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
- var left = node.left,
28
- right = node.right,
29
- op = node.operator;
30
- var str = "";
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
- var str = stringify(node, options.precision);
62
- var shouldPrintCalc = node.type === "MathExpression" || node.type === "Function";
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
@@ -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
- var MATCH_CALC = /((?:-(moz|webkit)-)?calc)/i;
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(function (node) {
24
+ return (0, _postcssValueParser.default)(value).walk(node => {
25
25
  // skip anything which isn't a calc() function
26
- if (node.type !== 'function' || !MATCH_CALC.test(node.value)) {
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
- var contents = _postcssValueParser.default.stringify(node.nodes);
31
+ const contents = _postcssValueParser.default.stringify(node.nodes);
32
32
 
33
- var ast = _parser.parser.parse(contents); // reduce AST to its simplest form, that is, either to a single value
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
- var reducedAst = (0, _reducer.default)(ast, options.precision); // stringify AST and write it back
37
+ const reducedAst = (0, _reducer.default)(ast, options.precision); // stringify AST and write it back
38
38
 
39
- node.type = 'word';
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)(function (selectors) {
47
- selectors.walk(function (node) {
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 === 'attribute' && node.value) {
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 === 'tag') {
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 = function _default(node, property, options, result) {
66
- var value = property === "selector" ? transformSelector(node[property], options, result, node) : transformValue(node[property], options, result, node); // if the preserve option is enabled and the value has changed, write the
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
- var clone = node.clone();
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": "7.0.3",
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
- "parser": "babel-eslint",
28
- "extends": "eslint-config-i-am-meticulous",
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/cli": "^7.1.2",
35
- "@babel/core": "^7.1.2",
36
- "@babel/polyfill": "^7.0.0",
37
- "@babel/preset-env": "^7.1.0",
38
- "@babel/register": "^7.0.0",
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
- "cross-env": "^5.2.0",
43
- "del-cli": "^1.1.0",
44
- "eslint": "^5.7.0",
45
- "eslint-config-i-am-meticulous": "^11.0.0",
46
- "eslint-plugin-babel": "^5.2.1",
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
- "require": [
57
- "@babel/register",
58
- "@babel/polyfill"
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))