draft: refactor project so it sits on top of a standalone app
This commit is contained in:
+110
@@ -0,0 +1,110 @@
|
||||
# 7.0.2
|
||||
|
||||
- Fixed: incorrect reduction of subtraction from zero ([#88](https://github.com/postcss/postcss-calc/issues/88))
|
||||
- Fixed: doesn't remove calc for single function
|
||||
- Fixed: relax parser on unknown units ([#76](https://github.com/postcss/postcss-calc/issues/76))
|
||||
- Fixed: handle numbers with exponen composed ([#83](https://github.com/postcss/postcss-calc/pull/83))
|
||||
- Fixed: handle plus sign before value ([#79](https://github.com/postcss/postcss-calc/pull/79))
|
||||
- Fixed: better handle precision for nested calc ([#75](https://github.com/postcss/postcss-calc/pull/75))
|
||||
- Fixed: properly handle nested add and sub expression inside sub expression ([#64](https://github.com/postcss/postcss-calc/issues/64))
|
||||
- Fixed: handle uppercase units and functions ([#71](https://github.com/postcss/postcss-calc/pull/71))
|
||||
- Fixed: do not break `calc` with single var ([cssnano/cssnano#725](https://github.com/cssnano/cssnano/issues/725))
|
||||
- Updated: `postcss` to 7.0.27 (patch)
|
||||
- Updated: `postcss-selector-parser` to 6.0.2
|
||||
- Updated: `postcss-value-parser` to 4.0.2
|
||||
|
||||
# 7.0.1
|
||||
|
||||
- Updated: `postcss` to 7.0.2 (patch)
|
||||
- Updated: `postcss-selector-parser` to 5.0.0-rc.4 (patch)
|
||||
- Updated: `postcss-value-parser` to 3.3.1 (patch)
|
||||
|
||||
# 7.0.0
|
||||
|
||||
- Changed: Updated postcss-selector-parser to version 5.0.0-rc.3
|
||||
- Changed: Dropped reduce-css-calc as a dependency
|
||||
- Fixed: Support constant() and env() ([#42](https://github.com/postcss/postcss-calc/issues/42), [#48](https://github.com/postcss/postcss-calc/issues/48))
|
||||
- Fixed: Support custom properties with "calc" in its name ([#50](https://github.com/postcss/postcss-calc/issues/50))
|
||||
- Fixed: Remove unnecessary whitespace around `*` and `/` ([cssnano#625](https://github.com/cssnano/cssnano/issues/625))
|
||||
- Fixed: Arithmetic bugs around subtraction ([#49](https://github.com/postcss/postcss-calc/issues/49))
|
||||
- Fixed: Handling of nested calc statements ([reduce-css-calc#49](https://github.com/MoOx/reduce-css-calc/issues/49))
|
||||
- Fixed: Bugs regarding complex calculations ([reduce-cs-calc#45](https://github.com/MoOx/reduce-css-calc/issues/45))
|
||||
- Fixed: `100%` incorrectly being transformed to `1` ([reduce-css-calc#44](https://github.com/MoOx/reduce-css-calc/issues/44))
|
||||
- Added: support for case-insensitive calc statements
|
||||
|
||||
# 6.0.2 - 2018-09-25
|
||||
|
||||
- Fixed: use PostCSS 7 (thanks to @douglasduteil)
|
||||
|
||||
# 6.0.1 - 2017-10-10
|
||||
|
||||
- Fixed: throwing error for attribute selectors without a value
|
||||
|
||||
# 6.0.0 - 2017-05-08
|
||||
|
||||
- Breaking: Updated PostCSS from v5.x to v6.x, and reduce-css-calc from v1.x
|
||||
to v2.x (thanks to @andyjansson).
|
||||
|
||||
# 5.3.1 - 2016-08-22
|
||||
|
||||
- Fixed: avoid security issue related to ``reduce-css-calc@< 1.2.4``.
|
||||
|
||||
# 5.3.0 - 2016-07-11
|
||||
|
||||
- Added: support for selector transformation via `selectors` option.
|
||||
([#29](https://github.com/postcss/postcss-calc/pull/29) - @uniquegestaltung)
|
||||
|
||||
# 5.2.1 - 2016-04-10
|
||||
|
||||
- Fixed: support for multiline value
|
||||
([#27](https://github.com/postcss/postcss-calc/pull/27))
|
||||
|
||||
# 5.2.0 - 2016-01-08
|
||||
|
||||
- Added: "mediaQueries" option for `@media` support
|
||||
([#22](https://github.com/postcss/postcss-calc/pull/22))
|
||||
|
||||
# 5.1.0 - 2016-01-07
|
||||
|
||||
- Added: "warnWhenCannotResolve" option to warn when calc() are not reduced to a single value
|
||||
([#20](https://github.com/postcss/postcss-calc/pull/20))
|
||||
|
||||
# 5.0.0 - 2015-08-25
|
||||
|
||||
- Removed: compatibility with postcss v4.x
|
||||
- Added: compatibility with postcss v5.x
|
||||
|
||||
# 4.1.0 - 2015-04-09
|
||||
|
||||
- Added: compatibility with postcss v4.1.x ([#12](https://github.com/postcss/postcss-calc/pull/12))
|
||||
|
||||
# 4.0.1 - 2015-04-09
|
||||
|
||||
- Fixed: `preserve` option does not create duplicated values ([#7](https://github.com/postcss/postcss-calc/issues/7))
|
||||
|
||||
# 4.0.0 - 2015-01-26
|
||||
|
||||
- Added: compatibility with postcss v4.x
|
||||
- Changed: partial compatiblity with postcss v3.x (stack traces have lost filename)
|
||||
|
||||
# 3.0.0 - 2014-11-24
|
||||
|
||||
- Added: GNU like exceptions ([#4](https://github.com/postcss/postcss-calc/issues/4))
|
||||
- Added: `precision` option ([#5](https://github.com/postcss/postcss-calc/issues/5))
|
||||
- Added: `preserve` option ([#6](https://github.com/postcss/postcss-calc/issues/6))
|
||||
|
||||
# 2.1.0 - 2014-10-15
|
||||
|
||||
- Added: source of the error (gnu like message) (fix [#3](https://github.com/postcss/postcss-calc/issues/3))
|
||||
|
||||
# 2.0.1 - 2014-08-10
|
||||
|
||||
- Fixed: correctly ignore unrecognized values (fix [#2](https://github.com/postcss/postcss-calc/issues/2))
|
||||
|
||||
# 2.0.0 - 2014-08-06
|
||||
|
||||
- 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))
|
||||
|
||||
# 1.0.0 - 2014-08-04
|
||||
|
||||
✨ 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))
|
||||
+20
@@ -0,0 +1,20 @@
|
||||
The MIT License (MIT)
|
||||
|
||||
Copyright (c) 2014 Maxime Thirouin
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy of
|
||||
this software and associated documentation files (the "Software"), to deal in
|
||||
the Software without restriction, including without limitation the rights to
|
||||
use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
|
||||
the Software, and to permit persons to whom the Software is furnished to do so,
|
||||
subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all
|
||||
copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
|
||||
FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
|
||||
COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
|
||||
IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
|
||||
CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
||||
+189
@@ -0,0 +1,189 @@
|
||||
# PostCSS Calc [<img src="https://postcss.github.io/postcss/logo.svg" alt="PostCSS" width="90" height="90" align="right">][PostCSS]
|
||||
|
||||
[![NPM Version][npm-img]][npm-url]
|
||||
[![Build Status][cli-img]][cli-url]
|
||||
[![Support Chat][git-img]][git-url]
|
||||
|
||||
[PostCSS Calc] lets you reduce `calc()` references whenever it's possible. This
|
||||
can be particularly useful with the [PostCSS Custom Properties] plugin.
|
||||
|
||||
When multiple units are mixed together in the same expression, the `calc()`
|
||||
statement is left as is, to fallback to the [W3C calc() implementation].
|
||||
|
||||
## Installation
|
||||
|
||||
```bash
|
||||
npm install postcss-calc
|
||||
```
|
||||
|
||||
## Usage
|
||||
|
||||
```js
|
||||
// dependencies
|
||||
var fs = require("fs")
|
||||
var postcss = require("postcss")
|
||||
var calc = require("postcss-calc")
|
||||
|
||||
// css to be processed
|
||||
var css = fs.readFileSync("input.css", "utf8")
|
||||
|
||||
// process css
|
||||
var output = postcss()
|
||||
.use(calc())
|
||||
.process(css)
|
||||
.css
|
||||
```
|
||||
|
||||
**Example** (with [PostCSS Custom Properties] enabled as well):
|
||||
|
||||
```js
|
||||
// dependencies
|
||||
var fs = require("fs")
|
||||
var postcss = require("postcss")
|
||||
var customProperties = require("postcss-custom-properties")
|
||||
var calc = require("postcss-calc")
|
||||
|
||||
// css to be processed
|
||||
var css = fs.readFileSync("input.css", "utf8")
|
||||
|
||||
// process css
|
||||
var output = postcss()
|
||||
.use(customProperties())
|
||||
.use(calc())
|
||||
.process(css)
|
||||
.css
|
||||
```
|
||||
|
||||
Using this `input.css`:
|
||||
|
||||
```css
|
||||
:root {
|
||||
--main-font-size: 16px;
|
||||
}
|
||||
|
||||
body {
|
||||
font-size: var(--main-font-size);
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: calc(var(--main-font-size) * 2);
|
||||
height: calc(100px - 2em);
|
||||
margin-bottom: calc(
|
||||
var(--main-font-size)
|
||||
* 1.5
|
||||
)
|
||||
}
|
||||
```
|
||||
|
||||
you will get:
|
||||
|
||||
```css
|
||||
body {
|
||||
font-size: 16px
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 32px;
|
||||
height: calc(100px - 2em);
|
||||
margin-bottom: 24px
|
||||
}
|
||||
```
|
||||
|
||||
Checkout [tests] for more examples.
|
||||
|
||||
### Options
|
||||
|
||||
#### `precision` (default: `5`)
|
||||
|
||||
Allow you to define the precision for decimal numbers.
|
||||
|
||||
```js
|
||||
var out = postcss()
|
||||
.use(calc({precision: 10}))
|
||||
.process(css)
|
||||
.css
|
||||
```
|
||||
|
||||
#### `preserve` (default: `false`)
|
||||
|
||||
Allow you to preserve calc() usage in output so browsers will handle decimal
|
||||
precision themselves.
|
||||
|
||||
```js
|
||||
var out = postcss()
|
||||
.use(calc({preserve: true}))
|
||||
.process(css)
|
||||
.css
|
||||
```
|
||||
|
||||
#### `warnWhenCannotResolve` (default: `false`)
|
||||
|
||||
Adds warnings when calc() are not reduced to a single value.
|
||||
|
||||
```js
|
||||
var out = postcss()
|
||||
.use(calc({warnWhenCannotResolve: true}))
|
||||
.process(css)
|
||||
.css
|
||||
```
|
||||
|
||||
#### `mediaQueries` (default: `false`)
|
||||
|
||||
Allows calc() usage as part of media query declarations.
|
||||
|
||||
```js
|
||||
var out = postcss()
|
||||
.use(calc({mediaQueries: true}))
|
||||
.process(css)
|
||||
.css
|
||||
```
|
||||
|
||||
#### `selectors` (default: `false`)
|
||||
|
||||
Allows calc() usage as part of selectors.
|
||||
|
||||
```js
|
||||
var out = postcss()
|
||||
.use(calc({selectors: true}))
|
||||
.process(css)
|
||||
.css
|
||||
```
|
||||
|
||||
Example:
|
||||
|
||||
```css
|
||||
div[data-size="calc(3*3)"] {
|
||||
width: 100px;
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Contributing
|
||||
|
||||
Work on a branch, install dev-dependencies, respect coding style & run tests
|
||||
before submitting a bug fix or a feature.
|
||||
|
||||
```bash
|
||||
git clone git@github.com:postcss/postcss-calc.git
|
||||
git checkout -b patch-1
|
||||
npm install
|
||||
npm test
|
||||
```
|
||||
|
||||
## [Changelog](CHANGELOG.md)
|
||||
|
||||
## [License](LICENSE)
|
||||
|
||||
[cli-img]: https://img.shields.io/travis/postcss/postcss-calc/master.svg
|
||||
[cli-url]: https://travis-ci.org/postcss/postcss-calc
|
||||
[git-img]: https://img.shields.io/badge/support-chat-blue.svg
|
||||
[git-url]: https://gitter.im/postcss/postcss
|
||||
[npm-img]: https://img.shields.io/npm/v/postcss-calc.svg
|
||||
[npm-url]: https://www.npmjs.com/package/postcss-calc
|
||||
|
||||
[PostCSS]: https://github.com/postcss
|
||||
[PostCSS Calc]: https://github.com/postcss/postcss-calc
|
||||
[PostCSS Custom Properties]: https://github.com/postcss/postcss-custom-properties
|
||||
[tests]: src/__tests__/index.js
|
||||
[W3C calc() implementation]: https://www.w3.org/TR/css3-values/#calc-notation
|
||||
+42
@@ -0,0 +1,42 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = void 0;
|
||||
|
||||
var _postcss = require("postcss");
|
||||
|
||||
var _transform = _interopRequireDefault(require("./lib/transform"));
|
||||
|
||||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
||||
|
||||
var _default = (0, _postcss.plugin)('postcss-calc', function (opts) {
|
||||
var options = Object.assign({
|
||||
precision: 5,
|
||||
preserve: false,
|
||||
warnWhenCannotResolve: false,
|
||||
mediaQueries: false,
|
||||
selectors: false
|
||||
}, opts);
|
||||
return function (css, result) {
|
||||
css.walk(function (node) {
|
||||
var type = node.type;
|
||||
|
||||
if (type === 'decl') {
|
||||
(0, _transform.default)(node, "value", options, result);
|
||||
}
|
||||
|
||||
if (type === 'atrule' && options.mediaQueries) {
|
||||
(0, _transform.default)(node, "params", options, result);
|
||||
}
|
||||
|
||||
if (type === 'rule' && options.selectors) {
|
||||
(0, _transform.default)(node, "selector", options, result);
|
||||
}
|
||||
});
|
||||
};
|
||||
});
|
||||
|
||||
exports.default = _default;
|
||||
module.exports = exports.default;
|
||||
+157
@@ -0,0 +1,157 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = void 0;
|
||||
var conversions = {
|
||||
// Absolute length units
|
||||
'px': {
|
||||
'px': 1,
|
||||
'cm': 96 / 2.54,
|
||||
'mm': 96 / 25.4,
|
||||
'q': 96 / 101.6,
|
||||
'in': 96,
|
||||
'pt': 96 / 72,
|
||||
'pc': 16
|
||||
},
|
||||
'cm': {
|
||||
'px': 2.54 / 96,
|
||||
'cm': 1,
|
||||
'mm': 0.1,
|
||||
'q': 0.025,
|
||||
'in': 2.54,
|
||||
'pt': 2.54 / 72,
|
||||
'pc': 2.54 / 6
|
||||
},
|
||||
'mm': {
|
||||
'px': 25.4 / 96,
|
||||
'cm': 10,
|
||||
'mm': 1,
|
||||
'q': 0.25,
|
||||
'in': 25.4,
|
||||
'pt': 25.4 / 72,
|
||||
'pc': 25.4 / 6
|
||||
},
|
||||
'q': {
|
||||
'px': 101.6 / 96,
|
||||
'cm': 40,
|
||||
'mm': 4,
|
||||
'q': 1,
|
||||
'in': 101.6,
|
||||
'pt': 101.6 / 72,
|
||||
'pc': 101.6 / 6
|
||||
},
|
||||
'in': {
|
||||
'px': 1 / 96,
|
||||
'cm': 1 / 2.54,
|
||||
'mm': 1 / 25.4,
|
||||
'q': 1 / 101.6,
|
||||
'in': 1,
|
||||
'pt': 1 / 72,
|
||||
'pc': 1 / 6
|
||||
},
|
||||
'pt': {
|
||||
'px': 0.75,
|
||||
'cm': 72 / 2.54,
|
||||
'mm': 72 / 25.4,
|
||||
'q': 72 / 101.6,
|
||||
'in': 72,
|
||||
'pt': 1,
|
||||
'pc': 12
|
||||
},
|
||||
'pc': {
|
||||
'px': 0.0625,
|
||||
'cm': 6 / 2.54,
|
||||
'mm': 6 / 25.4,
|
||||
'q': 6 / 101.6,
|
||||
'in': 6,
|
||||
'pt': 6 / 72,
|
||||
'pc': 1
|
||||
},
|
||||
// Angle units
|
||||
'deg': {
|
||||
'deg': 1,
|
||||
'grad': 0.9,
|
||||
'rad': 180 / Math.PI,
|
||||
'turn': 360
|
||||
},
|
||||
'grad': {
|
||||
'deg': 400 / 360,
|
||||
'grad': 1,
|
||||
'rad': 200 / Math.PI,
|
||||
'turn': 400
|
||||
},
|
||||
'rad': {
|
||||
'deg': Math.PI / 180,
|
||||
'grad': Math.PI / 200,
|
||||
'rad': 1,
|
||||
'turn': Math.PI * 2
|
||||
},
|
||||
'turn': {
|
||||
'deg': 1 / 360,
|
||||
'grad': 0.0025,
|
||||
'rad': 0.5 / Math.PI,
|
||||
'turn': 1
|
||||
},
|
||||
// Duration units
|
||||
's': {
|
||||
's': 1,
|
||||
'ms': 0.001
|
||||
},
|
||||
'ms': {
|
||||
's': 1000,
|
||||
'ms': 1
|
||||
},
|
||||
// Frequency units
|
||||
'hz': {
|
||||
'hz': 1,
|
||||
'khz': 1000
|
||||
},
|
||||
'khz': {
|
||||
'hz': 0.001,
|
||||
'khz': 1
|
||||
},
|
||||
// Resolution units
|
||||
'dpi': {
|
||||
'dpi': 1,
|
||||
'dpcm': 1 / 2.54,
|
||||
'dppx': 1 / 96
|
||||
},
|
||||
'dpcm': {
|
||||
'dpi': 2.54,
|
||||
'dpcm': 1,
|
||||
'dppx': 2.54 / 96
|
||||
},
|
||||
'dppx': {
|
||||
'dpi': 96,
|
||||
'dpcm': 96 / 2.54,
|
||||
'dppx': 1
|
||||
}
|
||||
};
|
||||
|
||||
function convertUnit(value, sourceUnit, targetUnit, precision) {
|
||||
var sourceUnitNormalized = sourceUnit.toLowerCase();
|
||||
var targetUnitNormalized = targetUnit.toLowerCase();
|
||||
|
||||
if (!conversions[targetUnitNormalized]) {
|
||||
throw new Error("Cannot convert to " + targetUnit);
|
||||
}
|
||||
|
||||
if (!conversions[targetUnitNormalized][sourceUnitNormalized]) {
|
||||
throw new Error("Cannot convert from " + sourceUnit + " to " + targetUnit);
|
||||
}
|
||||
|
||||
var converted = conversions[targetUnitNormalized][sourceUnitNormalized] * value;
|
||||
|
||||
if (precision !== false) {
|
||||
precision = Math.pow(10, parseInt(precision) || 5);
|
||||
return Math.round(converted * precision) / precision;
|
||||
}
|
||||
|
||||
return converted;
|
||||
}
|
||||
|
||||
var _default = convertUnit;
|
||||
exports.default = _default;
|
||||
module.exports = exports.default;
|
||||
+327
@@ -0,0 +1,327 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = void 0;
|
||||
|
||||
var _convertUnit = _interopRequireDefault(require("./convertUnit"));
|
||||
|
||||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
||||
|
||||
function isEqual(left, right) {
|
||||
return left.type === right.type && left.value === right.value;
|
||||
}
|
||||
|
||||
function isValueType(type) {
|
||||
switch (type) {
|
||||
case 'LengthValue':
|
||||
case 'AngleValue':
|
||||
case 'TimeValue':
|
||||
case 'FrequencyValue':
|
||||
case 'ResolutionValue':
|
||||
case 'EmValue':
|
||||
case 'ExValue':
|
||||
case 'ChValue':
|
||||
case 'RemValue':
|
||||
case 'VhValue':
|
||||
case 'VwValue':
|
||||
case 'VminValue':
|
||||
case 'VmaxValue':
|
||||
case 'PercentageValue':
|
||||
case 'Number':
|
||||
return true;
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
function flip(operator) {
|
||||
return operator === '+' ? '-' : '+';
|
||||
}
|
||||
|
||||
function flipValue(node) {
|
||||
if (isValueType(node.type)) {
|
||||
node.value = -node.value;
|
||||
} else if (node.type === 'MathExpression') {
|
||||
if (node.operator === '*' || node.operator === '/') {
|
||||
node.left = flipValue(node.left);
|
||||
} else {
|
||||
node.left = flipValue(node.left);
|
||||
node.right = flipValue(node.right);
|
||||
}
|
||||
}
|
||||
|
||||
return node;
|
||||
}
|
||||
|
||||
function reduceAddSubExpression(node, precision) {
|
||||
// something + 0 => something
|
||||
// something - 0 => something
|
||||
if (isValueType(node.right.type) && node.right.value === 0) {
|
||||
return node.left;
|
||||
} // 0 + something => something
|
||||
|
||||
|
||||
if (isValueType(node.left.type) && node.left.value === 0 && node.operator === "+") {
|
||||
return node.right;
|
||||
} // 0 - something => -something
|
||||
|
||||
|
||||
if (isValueType(node.left.type) && node.left.value === 0 && node.operator === "-" && node.right.type !== "Function") {
|
||||
return flipValue(node.right);
|
||||
} // value + value
|
||||
// value - value
|
||||
|
||||
|
||||
if (isValueType(node.left.type) && node.left.type === node.right.type) {
|
||||
var operator = node.operator;
|
||||
|
||||
var _covertNodesUnits = covertNodesUnits(node.left, node.right, precision),
|
||||
left = _covertNodesUnits.left,
|
||||
right = _covertNodesUnits.right;
|
||||
|
||||
if (operator === "+") {
|
||||
left.value += right.value;
|
||||
} else {
|
||||
left.value -= right.value;
|
||||
}
|
||||
|
||||
return left;
|
||||
} // value <op> (expr)
|
||||
|
||||
|
||||
if (node.right.type === 'MathExpression' && (node.right.operator === '+' || node.right.operator === '-')) {
|
||||
// something - (something + something) => something - something - something
|
||||
// something - (something - something) => something - something + something
|
||||
if ((node.right.operator === '+' || node.right.operator === '-') && node.operator === '-') {
|
||||
node.right.operator = flip(node.right.operator);
|
||||
}
|
||||
|
||||
if (isValueType(node.left.type)) {
|
||||
// value + (value + something) => value + something
|
||||
// value + (value - something) => value - something
|
||||
// value - (value + something) => value - something
|
||||
// value - (value - something) => value + something
|
||||
if (node.left.type === node.right.left.type) {
|
||||
var _left = node.left,
|
||||
_operator = node.operator,
|
||||
_right = node.right;
|
||||
node.left = reduce({
|
||||
type: 'MathExpression',
|
||||
operator: _operator,
|
||||
left: _left,
|
||||
right: _right.left
|
||||
});
|
||||
node.operator = _right.operator;
|
||||
node.right = _right.right;
|
||||
return reduce(node, precision);
|
||||
} // something + (something + value) => dimension + something
|
||||
// something + (something - value) => dimension + something
|
||||
// something - (something + value) => dimension - something
|
||||
// something - (something - value) => dimension - something
|
||||
|
||||
|
||||
if (node.left.type === node.right.right.type) {
|
||||
var _left2 = node.left,
|
||||
_right2 = node.right;
|
||||
node.left = reduce({
|
||||
type: 'MathExpression',
|
||||
operator: _right2.operator,
|
||||
left: _left2,
|
||||
right: _right2.right
|
||||
});
|
||||
node.right = _right2.left;
|
||||
return reduce(node, precision);
|
||||
}
|
||||
}
|
||||
} // (expr) <op> value
|
||||
|
||||
|
||||
if (node.left.type === 'MathExpression' && (node.left.operator === '+' || node.left.operator === '-') && isValueType(node.right.type)) {
|
||||
// (value + something) + value => value + something
|
||||
// (value - something) + value => value - something
|
||||
// (value + something) - value => value + something
|
||||
// (value - something) - value => value - something
|
||||
if (node.right.type === node.left.left.type) {
|
||||
var _left3 = node.left,
|
||||
_operator2 = node.operator,
|
||||
_right3 = node.right;
|
||||
_left3.left = reduce({
|
||||
type: 'MathExpression',
|
||||
operator: _operator2,
|
||||
left: _left3.left,
|
||||
right: _right3
|
||||
}, precision);
|
||||
return reduce(_left3, precision);
|
||||
} // (something + dimension) + dimension => something + dimension
|
||||
// (something - dimension) + dimension => something - dimension
|
||||
// (something + dimension) - dimension => something + dimension
|
||||
// (something - dimension) - dimension => something - dimension
|
||||
|
||||
|
||||
if (node.right.type === node.left.right.type) {
|
||||
var _left4 = node.left,
|
||||
_operator3 = node.operator,
|
||||
_right4 = node.right;
|
||||
|
||||
if (_left4.operator === '-') {
|
||||
_left4.operator = _operator3 === '-' ? '-' : '+';
|
||||
_left4.right = reduce({
|
||||
type: 'MathExpression',
|
||||
operator: _operator3 === '-' ? '+' : '-',
|
||||
left: _right4,
|
||||
right: _left4.right
|
||||
}, precision);
|
||||
} else {
|
||||
_left4.right = reduce({
|
||||
type: 'MathExpression',
|
||||
operator: _operator3,
|
||||
left: _left4.right,
|
||||
right: _right4
|
||||
}, precision);
|
||||
}
|
||||
|
||||
if (_left4.right.value < 0) {
|
||||
_left4.right.value *= -1;
|
||||
_left4.operator = _left4.operator === '-' ? '+' : '-';
|
||||
}
|
||||
|
||||
_left4.parenthesized = node.parenthesized;
|
||||
return reduce(_left4, precision);
|
||||
}
|
||||
} // (expr) + (expr) => number
|
||||
// (expr) - (expr) => number
|
||||
|
||||
|
||||
if (node.right.type === 'MathExpression' && node.left.type === 'MathExpression') {
|
||||
if (isEqual(node.left.right, node.right.right)) {
|
||||
var newNodes = covertNodesUnits(node.left.left, node.right.left, precision);
|
||||
node.left = newNodes.left;
|
||||
node.right = newNodes.right;
|
||||
return reduce(node);
|
||||
}
|
||||
|
||||
if (isEqual(node.left.right, node.right.left)) {
|
||||
var _newNodes = covertNodesUnits(node.left.left, node.right.right, precision);
|
||||
|
||||
node.left = _newNodes.left;
|
||||
node.right = _newNodes.right;
|
||||
return reduce(node);
|
||||
}
|
||||
}
|
||||
|
||||
return node;
|
||||
}
|
||||
|
||||
function reduceDivisionExpression(node) {
|
||||
if (!isValueType(node.right.type)) {
|
||||
return node;
|
||||
}
|
||||
|
||||
if (node.right.type !== 'Number') {
|
||||
throw new Error(`Cannot divide by "${node.right.unit}", number expected`);
|
||||
}
|
||||
|
||||
if (node.right.value === 0) {
|
||||
throw new Error('Cannot divide by zero');
|
||||
} // something / value
|
||||
|
||||
|
||||
if (isValueType(node.left.type)) {
|
||||
node.left.value /= node.right.value;
|
||||
return node.left;
|
||||
}
|
||||
|
||||
return node;
|
||||
}
|
||||
|
||||
function reduceMultiplicationExpression(node) {
|
||||
// (expr) * number
|
||||
if (node.left.type === 'MathExpression' && node.right.type === 'Number') {
|
||||
if (isValueType(node.left.left.type) && isValueType(node.left.right.type)) {
|
||||
node.left.left.value *= node.right.value;
|
||||
node.left.right.value *= node.right.value;
|
||||
return node.left;
|
||||
}
|
||||
} // something * number
|
||||
|
||||
|
||||
if (isValueType(node.left.type) && node.right.type === 'Number') {
|
||||
node.left.value *= node.right.value;
|
||||
return node.left;
|
||||
} // number * (expr)
|
||||
|
||||
|
||||
if (node.left.type === 'Number' && node.right.type === 'MathExpression') {
|
||||
if (isValueType(node.right.left.type) && isValueType(node.right.right.type)) {
|
||||
node.right.left.value *= node.left.value;
|
||||
node.right.right.value *= node.left.value;
|
||||
return node.right;
|
||||
}
|
||||
} // number * something
|
||||
|
||||
|
||||
if (node.left.type === 'Number' && isValueType(node.right.type)) {
|
||||
node.right.value *= node.left.value;
|
||||
return node.right;
|
||||
}
|
||||
|
||||
return node;
|
||||
}
|
||||
|
||||
function covertNodesUnits(left, right, precision) {
|
||||
switch (left.type) {
|
||||
case 'LengthValue':
|
||||
case 'AngleValue':
|
||||
case 'TimeValue':
|
||||
case 'FrequencyValue':
|
||||
case 'ResolutionValue':
|
||||
if (right.type === left.type && right.unit && left.unit) {
|
||||
var converted = (0, _convertUnit.default)(right.value, right.unit, left.unit, precision);
|
||||
right = {
|
||||
type: left.type,
|
||||
value: converted,
|
||||
unit: left.unit
|
||||
};
|
||||
}
|
||||
|
||||
return {
|
||||
left,
|
||||
right
|
||||
};
|
||||
|
||||
default:
|
||||
return {
|
||||
left,
|
||||
right
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
function reduce(node, precision) {
|
||||
if (node.type === "MathExpression") {
|
||||
node.left = reduce(node.left, precision);
|
||||
node.right = reduce(node.right, precision);
|
||||
|
||||
switch (node.operator) {
|
||||
case "+":
|
||||
case "-":
|
||||
return reduceAddSubExpression(node, precision);
|
||||
|
||||
case "/":
|
||||
return reduceDivisionExpression(node, precision);
|
||||
|
||||
case "*":
|
||||
return reduceMultiplicationExpression(node, precision);
|
||||
}
|
||||
|
||||
return node;
|
||||
}
|
||||
|
||||
return node;
|
||||
}
|
||||
|
||||
var _default = reduce;
|
||||
exports.default = _default;
|
||||
module.exports = exports.default;
|
||||
+81
@@ -0,0 +1,81 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = _default;
|
||||
var order = {
|
||||
"*": 0,
|
||||
"/": 0,
|
||||
"+": 1,
|
||||
"-": 1
|
||||
};
|
||||
|
||||
function round(value, prec) {
|
||||
if (prec !== false) {
|
||||
var precision = Math.pow(10, prec);
|
||||
return Math.round(value * precision) / precision;
|
||||
}
|
||||
|
||||
return value;
|
||||
}
|
||||
|
||||
function stringify(node, prec) {
|
||||
switch (node.type) {
|
||||
case "MathExpression":
|
||||
{
|
||||
var left = node.left,
|
||||
right = node.right,
|
||||
op = node.operator;
|
||||
var str = "";
|
||||
|
||||
if (left.type === 'MathExpression' && order[op] < order[left.operator]) {
|
||||
str += `(${stringify(left, prec)})`;
|
||||
} else {
|
||||
str += stringify(left, prec);
|
||||
}
|
||||
|
||||
str += order[op] ? ` ${node.operator} ` : node.operator;
|
||||
|
||||
if (right.type === 'MathExpression' && order[op] < order[right.operator]) {
|
||||
str += `(${stringify(right, prec)})`;
|
||||
} else {
|
||||
str += stringify(right, prec);
|
||||
}
|
||||
|
||||
return str;
|
||||
}
|
||||
|
||||
case 'Number':
|
||||
return round(node.value, prec);
|
||||
|
||||
case 'Function':
|
||||
return node.value;
|
||||
|
||||
default:
|
||||
return round(node.value, prec) + node.unit;
|
||||
}
|
||||
}
|
||||
|
||||
function _default(calc, node, originalValue, options, result, item) {
|
||||
var str = stringify(node, options.precision);
|
||||
var shouldPrintCalc = node.type === "MathExpression" || node.type === "Function";
|
||||
|
||||
if (shouldPrintCalc) {
|
||||
// if calc expression couldn't be resolved to a single value, re-wrap it as
|
||||
// a calc()
|
||||
str = `${calc}(${str})`; // if the warnWhenCannotResolve option is on, inform the user that the calc
|
||||
// expression could not be resolved to a single value
|
||||
|
||||
if (options.warnWhenCannotResolve) {
|
||||
result.warn("Could not reduce expression: " + originalValue, {
|
||||
plugin: 'postcss-calc',
|
||||
node: item
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
return str;
|
||||
}
|
||||
|
||||
module.exports = exports.default;
|
||||
+81
@@ -0,0 +1,81 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = void 0;
|
||||
|
||||
var _postcssSelectorParser = _interopRequireDefault(require("postcss-selector-parser"));
|
||||
|
||||
var _postcssValueParser = _interopRequireDefault(require("postcss-value-parser"));
|
||||
|
||||
var _parser = require("../parser");
|
||||
|
||||
var _reducer = _interopRequireDefault(require("./reducer"));
|
||||
|
||||
var _stringifier = _interopRequireDefault(require("./stringifier"));
|
||||
|
||||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
||||
|
||||
// eslint-disable-next-line import/no-unresolved
|
||||
var MATCH_CALC = /((?:-(moz|webkit)-)?calc)/i;
|
||||
|
||||
function transformValue(value, options, result, item) {
|
||||
return (0, _postcssValueParser.default)(value).walk(function (node) {
|
||||
// skip anything which isn't a calc() function
|
||||
if (node.type !== 'function' || !MATCH_CALC.test(node.value)) {
|
||||
return node;
|
||||
} // stringify calc expression and produce an AST
|
||||
|
||||
|
||||
var contents = _postcssValueParser.default.stringify(node.nodes);
|
||||
|
||||
var ast = _parser.parser.parse(contents); // reduce AST to its simplest form, that is, either to a single value
|
||||
// or a simplified calc expression
|
||||
|
||||
|
||||
var reducedAst = (0, _reducer.default)(ast, options.precision); // stringify AST and write it back
|
||||
|
||||
node.type = 'word';
|
||||
node.value = (0, _stringifier.default)(node.value, reducedAst, value, options, result, item);
|
||||
return false;
|
||||
}).toString();
|
||||
}
|
||||
|
||||
function transformSelector(value, options, result, item) {
|
||||
return (0, _postcssSelectorParser.default)(function (selectors) {
|
||||
selectors.walk(function (node) {
|
||||
// attribute value
|
||||
// e.g. the "calc(3*3)" part of "div[data-size="calc(3*3)"]"
|
||||
if (node.type === 'attribute' && node.value) {
|
||||
node.setValue(transformValue(node.value, options, result, item));
|
||||
} // tag value
|
||||
// e.g. the "calc(3*3)" part of "div:nth-child(2n + calc(3*3))"
|
||||
|
||||
|
||||
if (node.type === 'tag') {
|
||||
node.value = transformValue(node.value, options, result, item);
|
||||
}
|
||||
|
||||
return;
|
||||
});
|
||||
}).processSync(value);
|
||||
}
|
||||
|
||||
var _default = function _default(node, property, options, result) {
|
||||
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
|
||||
// transformed value into a cloned node which is inserted before the current
|
||||
// node, preserving the original value. Otherwise, overwrite the original
|
||||
// value.
|
||||
|
||||
if (options.preserve && node[property] !== value) {
|
||||
var clone = node.clone();
|
||||
clone[property] = value;
|
||||
node.parent.insertBefore(node, clone);
|
||||
} else {
|
||||
node[property] = value;
|
||||
}
|
||||
};
|
||||
|
||||
exports.default = _default;
|
||||
module.exports = exports.default;
|
||||
+3804
File diff suppressed because it is too large
Load Diff
+95
@@ -0,0 +1,95 @@
|
||||
{
|
||||
"_from": "postcss-calc@^7.0.1",
|
||||
"_id": "postcss-calc@7.0.2",
|
||||
"_inBundle": false,
|
||||
"_integrity": "sha512-rofZFHUg6ZIrvRwPeFktv06GdbDYLcGqh9EwiMutZg+a0oePCCw1zHOEiji6LCpyRcjTREtPASuUqeAvYlEVvQ==",
|
||||
"_location": "/postcss-calc",
|
||||
"_phantomChildren": {},
|
||||
"_requested": {
|
||||
"type": "range",
|
||||
"registry": true,
|
||||
"raw": "postcss-calc@^7.0.1",
|
||||
"name": "postcss-calc",
|
||||
"escapedName": "postcss-calc",
|
||||
"rawSpec": "^7.0.1",
|
||||
"saveSpec": null,
|
||||
"fetchSpec": "^7.0.1"
|
||||
},
|
||||
"_requiredBy": [
|
||||
"/cssnano-preset-default"
|
||||
],
|
||||
"_resolved": "https://registry.npmjs.org/postcss-calc/-/postcss-calc-7.0.2.tgz",
|
||||
"_shasum": "504efcd008ca0273120568b0792b16cdcde8aac1",
|
||||
"_spec": "postcss-calc@^7.0.1",
|
||||
"_where": "O:\\zero\\zero.Web\\node_modules\\cssnano-preset-default",
|
||||
"author": {
|
||||
"name": "Andy Jansson"
|
||||
},
|
||||
"ava": {
|
||||
"require": [
|
||||
"@babel/register",
|
||||
"@babel/polyfill"
|
||||
]
|
||||
},
|
||||
"bugs": {
|
||||
"url": "https://github.com/postcss/postcss-calc/issues"
|
||||
},
|
||||
"bundleDependencies": false,
|
||||
"dependencies": {
|
||||
"postcss": "^7.0.27",
|
||||
"postcss-selector-parser": "^6.0.2",
|
||||
"postcss-value-parser": "^4.0.2"
|
||||
},
|
||||
"deprecated": false,
|
||||
"description": "PostCSS plugin to reduce calc()",
|
||||
"devDependencies": {
|
||||
"@babel/cli": "^7.1.2",
|
||||
"@babel/core": "^7.1.2",
|
||||
"@babel/polyfill": "^7.0.0",
|
||||
"@babel/preset-env": "^7.1.0",
|
||||
"@babel/register": "^7.0.0",
|
||||
"ava": "^1.4.1",
|
||||
"babel-eslint": "^10.0.1",
|
||||
"babel-plugin-add-module-exports": "^1.0.0",
|
||||
"cross-env": "^5.2.0",
|
||||
"del-cli": "^1.1.0",
|
||||
"eslint": "^5.7.0",
|
||||
"eslint-config-i-am-meticulous": "^11.0.0",
|
||||
"eslint-plugin-babel": "^5.2.1",
|
||||
"eslint-plugin-import": "^2.14.0",
|
||||
"jison-gho": "^0.6.1-215"
|
||||
},
|
||||
"eslintConfig": {
|
||||
"parser": "babel-eslint",
|
||||
"extends": "eslint-config-i-am-meticulous",
|
||||
"rules": {
|
||||
"curly": "error"
|
||||
}
|
||||
},
|
||||
"files": [
|
||||
"dist",
|
||||
"LICENSE"
|
||||
],
|
||||
"homepage": "https://github.com/postcss/postcss-calc#readme",
|
||||
"keywords": [
|
||||
"css",
|
||||
"postcss",
|
||||
"postcss-plugin",
|
||||
"calculation",
|
||||
"calc"
|
||||
],
|
||||
"license": "MIT",
|
||||
"main": "dist/index.js",
|
||||
"name": "postcss-calc",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git+https://github.com/postcss/postcss-calc.git"
|
||||
},
|
||||
"scripts": {
|
||||
"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",
|
||||
"prepublish": "npm run build",
|
||||
"pretest": "npm run build && eslint src",
|
||||
"test": "ava"
|
||||
},
|
||||
"version": "7.0.2"
|
||||
}
|
||||
Reference in New Issue
Block a user