@csstools/postcss-stepped-value-functions 1.0.1 → 2.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +8 -0
- package/README.md +9 -7
- package/dist/index.cjs +1 -1
- package/dist/index.d.ts +2 -4
- package/dist/index.mjs +1 -1
- package/dist/mod.d.ts +1 -1
- package/dist/options.d.ts +10 -0
- package/dist/rem.d.ts +1 -1
- package/dist/round.d.ts +1 -1
- package/dist/utils.d.ts +1 -1
- package/package.json +7 -5
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,13 @@
|
|
|
1
1
|
# Changes to PostCSS Stepped Value Functions
|
|
2
2
|
|
|
3
|
+
### 2.0.1 (January 28, 2023)
|
|
4
|
+
|
|
5
|
+
- Improve `types` declaration in `package.json`
|
|
6
|
+
|
|
7
|
+
### 2.0.0 (January 24, 2023)
|
|
8
|
+
|
|
9
|
+
- Updated: Support for Node v14+ (major).
|
|
10
|
+
|
|
3
11
|
### 1.0.1 (July 8, 2022)
|
|
4
12
|
|
|
5
13
|
- Fix case insensitive matching.
|
package/README.md
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
# PostCSS Stepped Value Functions [<img src="https://postcss.github.io/postcss/logo.svg" alt="PostCSS Logo" width="90" height="90" align="right">][
|
|
1
|
+
# PostCSS Stepped Value Functions [<img src="https://postcss.github.io/postcss/logo.svg" alt="PostCSS Logo" width="90" height="90" align="right">][PostCSS]
|
|
2
2
|
|
|
3
3
|
[<img alt="npm version" src="https://img.shields.io/npm/v/@csstools/postcss-stepped-value-functions.svg" height="20">][npm-url] [<img alt="CSS Standard Status" src="https://cssdb.org/images/badges/stepped-value-functions.svg" height="20">][css-url] [<img alt="Build Status" src="https://github.com/csstools/postcss-plugins/workflows/test/badge.svg" height="20">][cli-url] [<img alt="Discord" src="https://shields.io/badge/Discord-5865F2?logo=discord&logoColor=white">][discord]
|
|
4
4
|
|
|
@@ -50,8 +50,13 @@ postcss([
|
|
|
50
50
|
[PostCSS Stepped Value Functions] runs in all Node environments, with special
|
|
51
51
|
instructions for:
|
|
52
52
|
|
|
53
|
-
|
|
54
|
-
|
|
53
|
+
- [Node](INSTALL.md#node)
|
|
54
|
+
- [PostCSS CLI](INSTALL.md#postcss-cli)
|
|
55
|
+
- [PostCSS Load Config](INSTALL.md#postcss-load-config)
|
|
56
|
+
- [Webpack](INSTALL.md#webpack)
|
|
57
|
+
- [Next.js](INSTALL.md#nextjs)
|
|
58
|
+
- [Gulp](INSTALL.md#gulp)
|
|
59
|
+
- [Grunt](INSTALL.md#grunt)
|
|
55
60
|
|
|
56
61
|
## ⚠️ About custom properties
|
|
57
62
|
|
|
@@ -117,7 +122,7 @@ postcssSteppedValueFunctions({ onInvalid: 'warn' })
|
|
|
117
122
|
|
|
118
123
|
Will produce on the terminal:
|
|
119
124
|
|
|
120
|
-
```
|
|
125
|
+
```txt
|
|
121
126
|
[postcss-stepped-value-functions]: Failed to transform mod(18px, 5rem) as the units don't match
|
|
122
127
|
```
|
|
123
128
|
|
|
@@ -126,9 +131,6 @@ Will produce on the terminal:
|
|
|
126
131
|
[discord]: https://discord.gg/bUadyRwkJS
|
|
127
132
|
[npm-url]: https://www.npmjs.com/package/@csstools/postcss-stepped-value-functions
|
|
128
133
|
|
|
129
|
-
[Gulp PostCSS]: https://github.com/postcss/gulp-postcss
|
|
130
|
-
[Grunt PostCSS]: https://github.com/nDmitry/grunt-postcss
|
|
131
134
|
[PostCSS]: https://github.com/postcss/postcss
|
|
132
|
-
[PostCSS Loader]: https://github.com/postcss/postcss-loader
|
|
133
135
|
[PostCSS Stepped Value Functions]: https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-stepped-value-functions
|
|
134
136
|
[CSS Values 4]: https://www.w3.org/TR/css-values-4/#round-func
|
package/dist/index.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";
|
|
1
|
+
"use strict";var e=require("postcss-value-parser");function isVarNode(e){return"function"===e.type&&"var"===e.value.toLowerCase()}function validateArgumentsAndTypes(n,t,o,r){const u=[];let a=!1;if(n.nodes.forEach((e=>{"word"!==e.type?isVarNode(e)&&(a=!0):u.push(e)})),a)return void optionallyWarn(t,o,`Failed to transform ${t.value} as variables can't be processed.`,r);if(2!==u.length)return void optionallyWarn(t,o,`Failed to transform ${t.value} as it's expecting 2 arguments instead of ${u.length}`,r);const s=e.unit(u[0].value),i=e.unit(u[1].value);if(s&&i){if(s.unit===i.unit)return[s,i];optionallyWarn(t,o,`Failed to transform ${t.value} as the units don't match`,r)}}function optionallyWarn(e,n,t,o){"warn"===o.onInvalid&&e.warn(n,t)}function functionNodeToWordNode(e){delete e.nodes;const n=e;return n.type="word",n}const n="mod(";function transformModFunction(n,t,o){const r=e(n.value);return r.walk((e=>{if("function"!==e.type||"mod"!==e.value.toLowerCase())return;const r=validateArgumentsAndTypes(e,n,t,o);if(!r)return;const[u,a]=r,s=Number(u.number),i=Number(a.number),l=(s%i+i)%i;if("number"!=typeof l||isNaN(l))return;functionNodeToWordNode(e).value=0===l?"0":`${l}${u.unit}`}),!0),r.toString()}const t="rem(";function transformRemFunction(n,t,o){const r=e(n.value);return r.walk((e=>{if("function"!==e.type||"rem"!==e.value.toLowerCase())return;const r=validateArgumentsAndTypes(e,n,t,o);if(!r)return;const[u,a]=r,s=Number(u.number)%Number(a.number);if("number"!=typeof s&&!isNaN(s))return;functionNodeToWordNode(e).value=0===s?"0":`${s}${u.unit}`}),!0),r.toString()}const o="round(";var r;!function(e){e.Nearest="nearest",e.Up="up",e.Down="down",e.ToZero="to-zero"}(r||(r={}));const u=/^[a-z|-]+$/i;function transformRoundFunction(n,t,o){const a=e(n.value);return a.walk((a=>{if("function"!==a.type||"round"!==a.value.toLowerCase())return;if(3!==a.nodes.length&&5!==a.nodes.length)return void optionallyWarn(n,t,`Failed to transform ${n.value} as the amount of arguments isn't valid`,o);const s=a.nodes.filter((e=>"word"===e.type)),i=s[0].value;let l,c,d;if(u.test(i.toLowerCase())){var f,v;if(!Object.values(r).includes(i.toLowerCase()))return void optionallyWarn(n,t,`Failed to transform ${n.value} as ${i} is not a valid rounding strategy.`,o);l=i.toLowerCase(),c=e.unit((null==s||null==(f=s[1])?void 0:f.value)||""),d=e.unit((null==s||null==(v=s[2])?void 0:v.value)||"")}else{var m,p;l=r.Nearest,c=e.unit((null==s||null==(m=s[0])?void 0:m.value)||""),d=e.unit((null==s||null==(p=s[1])?void 0:p.value)||"")}if(!c||!d)return;if(c.unit!==d.unit)return void optionallyWarn(n,t,`Failed to transform ${n.value} as the units don't match`,o);const N=Number(c.number),b=Number(d.number);let w;switch(l){case r.Down:w=Math.floor(N/b)*b;break;case r.Up:w=Math.ceil(N/b)*b;break;case r.ToZero:w=Math.trunc(N/b)*b;break;case r.Nearest:default:w=Math.round(N/b)*b}if("number"!=typeof w||isNaN(w))return;functionNodeToWordNode(a).value=0===w?"0":`${w}${c.unit}`}),!0),a.toString()}const creator=e=>{const r=Object.assign({preserve:!1,onInvalid:""},e);return{postcssPlugin:"postcss-stepped-value-functions",Declaration(e,{result:u}){const a=[n,t,o].some((n=>e.value.toLowerCase().includes(n)));if(!e||!a)return;const s=e.clone();if(s.value.toLowerCase().includes(n)){const e=transformModFunction(s,u,r);e&&(s.value=e)}if(s.value.toLowerCase().includes(t)){const e=transformRemFunction(s,u,r);e&&(s.value=e)}if(s.value.toLowerCase().includes(o)){const e=transformRoundFunction(s,u,r);e&&(s.value=e)}e.value!==s.value&&(e.before(s),r.preserve||e.remove())}}};creator.postcss=!0,module.exports=creator;
|
package/dist/index.d.ts
CHANGED
|
@@ -1,7 +1,5 @@
|
|
|
1
1
|
import type { PluginCreator } from 'postcss';
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
onInvalid?: string;
|
|
5
|
-
};
|
|
2
|
+
import type { pluginOptions } from './options';
|
|
3
|
+
export type { pluginOptions } from './options';
|
|
6
4
|
declare const creator: PluginCreator<pluginOptions>;
|
|
7
5
|
export default creator;
|
package/dist/index.mjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import e from"postcss-value-parser";function
|
|
1
|
+
import e from"postcss-value-parser";function isVarNode(e){return"function"===e.type&&"var"===e.value.toLowerCase()}function validateArgumentsAndTypes(n,t,o,r){const a=[];let u=!1;if(n.nodes.forEach((e=>{"word"!==e.type?isVarNode(e)&&(u=!0):a.push(e)})),u)return void optionallyWarn(t,o,`Failed to transform ${t.value} as variables can't be processed.`,r);if(2!==a.length)return void optionallyWarn(t,o,`Failed to transform ${t.value} as it's expecting 2 arguments instead of ${a.length}`,r);const s=e.unit(a[0].value),i=e.unit(a[1].value);if(s&&i){if(s.unit===i.unit)return[s,i];optionallyWarn(t,o,`Failed to transform ${t.value} as the units don't match`,r)}}function optionallyWarn(e,n,t,o){"warn"===o.onInvalid&&e.warn(n,t)}function functionNodeToWordNode(e){delete e.nodes;const n=e;return n.type="word",n}const n="mod(";function transformModFunction(n,t,o){const r=e(n.value);return r.walk((e=>{if("function"!==e.type||"mod"!==e.value.toLowerCase())return;const r=validateArgumentsAndTypes(e,n,t,o);if(!r)return;const[a,u]=r,s=Number(a.number),i=Number(u.number),l=(s%i+i)%i;if("number"!=typeof l||isNaN(l))return;functionNodeToWordNode(e).value=0===l?"0":`${l}${a.unit}`}),!0),r.toString()}const t="rem(";function transformRemFunction(n,t,o){const r=e(n.value);return r.walk((e=>{if("function"!==e.type||"rem"!==e.value.toLowerCase())return;const r=validateArgumentsAndTypes(e,n,t,o);if(!r)return;const[a,u]=r,s=Number(a.number)%Number(u.number);if("number"!=typeof s&&!isNaN(s))return;functionNodeToWordNode(e).value=0===s?"0":`${s}${a.unit}`}),!0),r.toString()}const o="round(";var r;!function(e){e.Nearest="nearest",e.Up="up",e.Down="down",e.ToZero="to-zero"}(r||(r={}));const a=/^[a-z|-]+$/i;function transformRoundFunction(n,t,o){const u=e(n.value);return u.walk((u=>{if("function"!==u.type||"round"!==u.value.toLowerCase())return;if(3!==u.nodes.length&&5!==u.nodes.length)return void optionallyWarn(n,t,`Failed to transform ${n.value} as the amount of arguments isn't valid`,o);const s=u.nodes.filter((e=>"word"===e.type)),i=s[0].value;let l,c,d;if(a.test(i.toLowerCase())){var f,v;if(!Object.values(r).includes(i.toLowerCase()))return void optionallyWarn(n,t,`Failed to transform ${n.value} as ${i} is not a valid rounding strategy.`,o);l=i.toLowerCase(),c=e.unit((null==s||null==(f=s[1])?void 0:f.value)||""),d=e.unit((null==s||null==(v=s[2])?void 0:v.value)||"")}else{var m,p;l=r.Nearest,c=e.unit((null==s||null==(m=s[0])?void 0:m.value)||""),d=e.unit((null==s||null==(p=s[1])?void 0:p.value)||"")}if(!c||!d)return;if(c.unit!==d.unit)return void optionallyWarn(n,t,`Failed to transform ${n.value} as the units don't match`,o);const N=Number(c.number),b=Number(d.number);let w;switch(l){case r.Down:w=Math.floor(N/b)*b;break;case r.Up:w=Math.ceil(N/b)*b;break;case r.ToZero:w=Math.trunc(N/b)*b;break;case r.Nearest:default:w=Math.round(N/b)*b}if("number"!=typeof w||isNaN(w))return;functionNodeToWordNode(u).value=0===w?"0":`${w}${c.unit}`}),!0),u.toString()}const creator=e=>{const r=Object.assign({preserve:!1,onInvalid:""},e);return{postcssPlugin:"postcss-stepped-value-functions",Declaration(e,{result:a}){const u=[n,t,o].some((n=>e.value.toLowerCase().includes(n)));if(!e||!u)return;const s=e.clone();if(s.value.toLowerCase().includes(n)){const e=transformModFunction(s,a,r);e&&(s.value=e)}if(s.value.toLowerCase().includes(t)){const e=transformRemFunction(s,a,r);e&&(s.value=e)}if(s.value.toLowerCase().includes(o)){const e=transformRoundFunction(s,a,r);e&&(s.value=e)}e.value!==s.value&&(e.before(s),r.preserve||e.remove())}}};creator.postcss=!0;export{creator as default};
|
package/dist/mod.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import type { Declaration, Result } from 'postcss';
|
|
2
|
-
import { pluginOptions } from './
|
|
2
|
+
import type { pluginOptions } from './options';
|
|
3
3
|
declare const modFunctionCheck = "mod(";
|
|
4
4
|
declare function transformModFunction(decl: Declaration, result: Result, options: pluginOptions): string | undefined;
|
|
5
5
|
export { modFunctionCheck, transformModFunction };
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
/** postcss-stepped-value-functions plugin options */
|
|
2
|
+
export type pluginOptions = {
|
|
3
|
+
/** Preserve the original notation. default: false */
|
|
4
|
+
preserve?: boolean;
|
|
5
|
+
/**
|
|
6
|
+
* Set `warn` to get warnings when the usage of the functions is incorrect.
|
|
7
|
+
* default: _not set_
|
|
8
|
+
*/
|
|
9
|
+
onInvalid?: 'warn';
|
|
10
|
+
};
|
package/dist/rem.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import type { Declaration, Result } from 'postcss';
|
|
2
|
-
import { pluginOptions } from './
|
|
2
|
+
import type { pluginOptions } from './options';
|
|
3
3
|
declare const remFunctionCheck = "rem(";
|
|
4
4
|
declare function transformRemFunction(decl: Declaration, result: Result, options: pluginOptions): string | undefined;
|
|
5
5
|
export { remFunctionCheck, transformRemFunction };
|
package/dist/round.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import type { Declaration, Result } from 'postcss';
|
|
2
|
-
import { pluginOptions } from './
|
|
2
|
+
import type { pluginOptions } from './options';
|
|
3
3
|
declare const roundFunctionCheck = "round(";
|
|
4
4
|
declare function transformRoundFunction(decl: Declaration, result: Result, options: pluginOptions): string | undefined;
|
|
5
5
|
export { roundFunctionCheck, transformRoundFunction };
|
package/dist/utils.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import valueParser from 'postcss-value-parser';
|
|
2
2
|
import type { FunctionNode, Node, WordNode } from 'postcss-value-parser';
|
|
3
3
|
import type { Declaration, Result } from 'postcss';
|
|
4
|
-
import { pluginOptions } from './
|
|
4
|
+
import type { pluginOptions } from './options';
|
|
5
5
|
export declare function isVarNode(node: Node): boolean;
|
|
6
6
|
export declare function validateArgumentsAndTypes(node: FunctionNode, decl: Declaration, result: Result, options: pluginOptions): valueParser.Dimension[] | undefined;
|
|
7
7
|
export declare function optionallyWarn(decl: Declaration, result: Result, message: string, options: pluginOptions): void;
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@csstools/postcss-stepped-value-functions",
|
|
3
3
|
"description": "Use round, rem and mod functions in CSS",
|
|
4
|
-
"version": "
|
|
4
|
+
"version": "2.0.1",
|
|
5
5
|
"contributors": [
|
|
6
6
|
{
|
|
7
7
|
"name": "Antonio Laguna",
|
|
@@ -19,13 +19,14 @@
|
|
|
19
19
|
"url": "https://opencollective.com/csstools"
|
|
20
20
|
},
|
|
21
21
|
"engines": {
|
|
22
|
-
"node": "^
|
|
22
|
+
"node": "^14 || ^16 || >=18"
|
|
23
23
|
},
|
|
24
24
|
"main": "dist/index.cjs",
|
|
25
25
|
"module": "dist/index.mjs",
|
|
26
26
|
"types": "dist/index.d.ts",
|
|
27
27
|
"exports": {
|
|
28
28
|
".": {
|
|
29
|
+
"types": "./dist/index.d.ts",
|
|
29
30
|
"import": "./dist/index.mjs",
|
|
30
31
|
"require": "./dist/index.cjs",
|
|
31
32
|
"default": "./dist/index.mjs"
|
|
@@ -41,11 +42,12 @@
|
|
|
41
42
|
"postcss-value-parser": "^4.2.0"
|
|
42
43
|
},
|
|
43
44
|
"peerDependencies": {
|
|
44
|
-
"postcss": "^8.
|
|
45
|
+
"postcss": "^8.4"
|
|
45
46
|
},
|
|
46
47
|
"scripts": {
|
|
47
|
-
"
|
|
48
|
-
"
|
|
48
|
+
"prebuild": "npm run clean",
|
|
49
|
+
"build": "rollup -c ../../rollup/default.mjs",
|
|
50
|
+
"clean": "node -e \"fs.rmSync('./dist', { recursive: true, force: true }); fs.mkdirSync('./dist');\"",
|
|
49
51
|
"docs": "node ../../.github/bin/generate-docs/install.mjs && node ../../.github/bin/generate-docs/readme.mjs",
|
|
50
52
|
"lint": "npm run lint:eslint && npm run lint:package-json",
|
|
51
53
|
"lint:eslint": "eslint ./src --ext .js --ext .ts --ext .mjs --no-error-on-unmatched-pattern",
|