@csstools/postcss-hwb-function 1.0.0 → 1.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 CHANGED
@@ -1,5 +1,9 @@
1
1
  # Changes to PostCSS HWB Function
2
2
 
3
+ ### 1.0.01 (May 18, 2022)
4
+
5
+ - Fix grayscale conversions.
6
+
3
7
  ### 1.0.0 (January 22, 2022)
4
8
 
5
9
  - Initial version
package/INSTALL.md CHANGED
@@ -1,7 +1,6 @@
1
1
  # Installing PostCSS HWB Function
2
2
 
3
- [PostCSS HWB Function] runs in all Node environments, with special
4
- instructions for:
3
+ [PostCSS HWB Function] runs in all Node environments, with special instructions for:
5
4
 
6
5
  | [Node](#node) | [PostCSS CLI](#postcss-cli) | [Webpack](#webpack) | [Create React App](#create-react-app) | [Gulp](#gulp) | [Grunt](#grunt) |
7
6
  | --- | --- | --- | --- | --- | --- |
@@ -21,7 +20,7 @@ const postcss = require('postcss');
21
20
  const postcssHWBFunction = require('@csstools/postcss-hwb-function');
22
21
 
23
22
  postcss([
24
- postcssHWBFunction(/* pluginOptions */)
23
+ postcssHWBFunction(/* pluginOptions */)
25
24
  ]).process(YOUR_CSS /*, processOptions */);
26
25
  ```
27
26
 
@@ -30,54 +29,65 @@ postcss([
30
29
  Add [PostCSS CLI] to your project:
31
30
 
32
31
  ```bash
33
- npm install postcss-cli --save-dev
32
+ npm install postcss-cli @csstools/postcss-hwb-function --save-dev
34
33
  ```
35
34
 
36
- Use [PostCSS HWB Function] in your `postcss.config.js` configuration
37
- file:
35
+ Use [PostCSS HWB Function] in your `postcss.config.js` configuration file:
38
36
 
39
37
  ```js
40
38
  const postcssHWBFunction = require('@csstools/postcss-hwb-function');
41
39
 
42
40
  module.exports = {
43
- plugins: [
44
- postcssHWBFunction(/* pluginOptions */)
45
- ]
41
+ plugins: [
42
+ postcssHWBFunction(/* pluginOptions */)
43
+ ]
46
44
  }
47
45
  ```
48
46
 
49
47
  ## Webpack
50
48
 
49
+ _Webpack version 5_
50
+
51
51
  Add [PostCSS Loader] to your project:
52
52
 
53
53
  ```bash
54
- npm install postcss-loader --save-dev
54
+ npm install postcss-loader @csstools/postcss-hwb-function --save-dev
55
55
  ```
56
56
 
57
57
  Use [PostCSS HWB Function] in your Webpack configuration:
58
58
 
59
59
  ```js
60
- const postcssHWBFunction = require('@csstools/postcss-hwb-function');
61
-
62
60
  module.exports = {
63
- module: {
64
- rules: [
65
- {
66
- test: /\.css$/,
67
- use: [
68
- 'style-loader',
69
- { loader: 'css-loader', options: { importLoaders: 1 } },
70
- { loader: 'postcss-loader', options: {
71
- ident: 'postcss',
72
- plugins: () => [
73
- postcssHWBFunction(/* pluginOptions */)
74
- ]
75
- } }
76
- ]
77
- }
78
- ]
79
- }
80
- }
61
+ module: {
62
+ rules: [
63
+ {
64
+ test: /\.css$/i,
65
+ use: [
66
+ "style-loader",
67
+ {
68
+ loader: "css-loader",
69
+ options: { importLoaders: 1 },
70
+ },
71
+ {
72
+ loader: "postcss-loader",
73
+ options: {
74
+ postcssOptions: {
75
+ plugins: [
76
+ [
77
+ "@csstools/postcss-hwb-function",
78
+ {
79
+ // Options
80
+ },
81
+ ],
82
+ ],
83
+ },
84
+ },
85
+ },
86
+ ],
87
+ },
88
+ ],
89
+ },
90
+ };
81
91
  ```
82
92
 
83
93
  ## Create React App
@@ -85,7 +95,7 @@ module.exports = {
85
95
  Add [React App Rewired] and [React App Rewire PostCSS] to your project:
86
96
 
87
97
  ```bash
88
- npm install react-app-rewired react-app-rewire-postcss --save-dev
98
+ npm install react-app-rewired react-app-rewire-postcss @csstools/postcss-hwb-function --save-dev
89
99
  ```
90
100
 
91
101
  Use [React App Rewire PostCSS] and [PostCSS HWB Function] in your
@@ -96,9 +106,9 @@ const reactAppRewirePostcss = require('react-app-rewire-postcss');
96
106
  const postcssHWBFunction = require('@csstools/postcss-hwb-function');
97
107
 
98
108
  module.exports = config => reactAppRewirePostcss(config, {
99
- plugins: () => [
100
- postcssHWBFunction(/* pluginOptions */)
101
- ]
109
+ plugins: () => [
110
+ postcssHWBFunction(/* pluginOptions */)
111
+ ]
102
112
  });
103
113
  ```
104
114
 
@@ -107,7 +117,7 @@ module.exports = config => reactAppRewirePostcss(config, {
107
117
  Add [Gulp PostCSS] to your project:
108
118
 
109
119
  ```bash
110
- npm install gulp-postcss --save-dev
120
+ npm install gulp-postcss @csstools/postcss-hwb-function --save-dev
111
121
  ```
112
122
 
113
123
  Use [PostCSS HWB Function] in your Gulpfile:
@@ -116,13 +126,15 @@ Use [PostCSS HWB Function] in your Gulpfile:
116
126
  const postcss = require('gulp-postcss');
117
127
  const postcssHWBFunction = require('@csstools/postcss-hwb-function');
118
128
 
119
- gulp.task('css', () => gulp.src('./src/*.css').pipe(
120
- postcss([
121
- postcssHWBFunction(/* pluginOptions */)
122
- ])
123
- ).pipe(
124
- gulp.dest('.')
125
- ));
129
+ gulp.task('css', function () {
130
+ var plugins = [
131
+ postcssHWBFunction(/* pluginOptions */)
132
+ ];
133
+
134
+ return gulp.src('./src/*.css')
135
+ .pipe(postcss(plugins))
136
+ .pipe(gulp.dest('.'));
137
+ });
126
138
  ```
127
139
 
128
140
  ## Grunt
@@ -130,7 +142,7 @@ gulp.task('css', () => gulp.src('./src/*.css').pipe(
130
142
  Add [Grunt PostCSS] to your project:
131
143
 
132
144
  ```bash
133
- npm install grunt-postcss --save-dev
145
+ npm install grunt-postcss @csstools/postcss-hwb-function --save-dev
134
146
  ```
135
147
 
136
148
  Use [PostCSS HWB Function] in your Gruntfile:
@@ -141,16 +153,16 @@ const postcssHWBFunction = require('@csstools/postcss-hwb-function');
141
153
  grunt.loadNpmTasks('grunt-postcss');
142
154
 
143
155
  grunt.initConfig({
144
- postcss: {
145
- options: {
146
- use: [
147
- postcssHWBFunction(/* pluginOptions */)
148
- ]
149
- },
150
- dist: {
151
- src: '*.css'
152
- }
153
- }
156
+ postcss: {
157
+ options: {
158
+ processors: [
159
+ postcssHWBFunction(/* pluginOptions */)
160
+ ]
161
+ },
162
+ dist: {
163
+ src: '*.css'
164
+ }
165
+ }
154
166
  });
155
167
  ```
156
168
 
package/README.md CHANGED
@@ -1,9 +1,9 @@
1
1
  # PostCSS HWB Function [<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-hwb-function.svg" height="20">][npm-url]
4
- [<img alt="CSS Standard Status" src="https://cssdb.org/badge/hwb-function.svg" height="20">][css-url]
4
+ [<img alt="CSS Standard Status" src="https://cssdb.org/images/badges/hwb-function.svg" height="20">][css-url]
5
5
  [<img alt="Build Status" src="https://github.com/csstools/postcss-plugins/workflows/test/badge.svg" height="20">][cli-url]
6
- [<img alt="support chat" src="https://img.shields.io/badge/support-chat-blue.svg" height="20">][git-url]
6
+ [<img alt="Discord" src="https://shields.io/badge/Discord-5865F2?logo=discord&logoColor=white">][discord]
7
7
 
8
8
 
9
9
  [PostCSS HWB Function] lets you use `hwb` color functions in
@@ -77,7 +77,7 @@ a {
77
77
 
78
78
  [cli-url]: https://github.com/csstools/postcss-plugins/actions/workflows/test.yml?query=workflow/test
79
79
  [css-url]: https://cssdb.org/#hwb-function
80
- [git-url]: https://gitter.im/postcss/postcss
80
+ [discord]: https://discord.gg/bUadyRwkJS
81
81
  [npm-url]: https://www.npmjs.com/package/@csstools/postcss-hwb-function
82
82
 
83
83
  [CSS Color]: https://drafts.csswg.org/css-color/#the-hwb-notation
package/dist/index.cjs CHANGED
@@ -1 +1 @@
1
- "use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=e(require("postcss-value-parser"));function t(e){const n=e[0];let t=e[1],r=e[2];if(t/=100,r/=100,t+r>=1){const e=t/(t+r);return[e,e,e]}const u=function(e){let n=e[0],t=e[1],r=e[2];n%=360,n<0&&(n+=360);function u(e){const u=(e+n/30)%12,a=t*Math.min(r,1-r);return r-a*Math.max(-1,Math.min(u-3,9-u,1))}return t/=100,r/=100,[u(0),u(8),u(4)]}([n,100,50]);for(let e=0;e<3;e++)u[e]*=1-t-r,u[e]+=t;return u.map((e=>Math.round(255*e)))}function r(e){const r=e.nodes.slice().filter((e=>"comment"!==e.type&&"space"!==e.type)),l=function(e){if(!function(e){if(!e||"word"!==e.type)return!1;if(!o(e))return!1;const t=n.default.unit(e.value);if(!t)return!1;return!!t.number&&("deg"===t.unit||"grad"===t.unit||"rad"===t.unit||"turn"===t.unit||""===t.unit)}(e[0]))return null;if(!u(e[1]))return null;if(!u(e[2]))return null;const t={h:n.default.unit(e[0].value),hNode:e[0],w:n.default.unit(e[1].value),wNode:e[1],b:n.default.unit(e[2].value),bNode:e[2]};if(function(e){switch(e.unit){case"deg":return void(e.unit="");case"rad":return e.unit="",void(e.number=(180*parseFloat(e.number)/Math.PI).toString());case"grad":return e.unit="",void(e.number=(.9*parseFloat(e.number)).toString());case"turn":e.unit="",e.number=(360*parseFloat(e.number)).toString()}}(t.h),""!==t.h.unit)return null;i(t.w),i(t.b),function(e){return e&&"div"===e.type&&"/"===e.value}(e[3])&&(t.slash=e[3]);(u(e[4])||function(e){return e&&"function"===e.type&&"calc"===e.value}(e[4])||function(e){return e&&"function"===e.type&&"var"===e.value}(e[4]))&&(t.alpha=e[4]);return t}(r);if(!l)return;if(r.length>3&&(!l.slash||!l.alpha))return;e.value="rgb",function(e,t,r){if(!t||!r)return;if(e.value="rgba",t.value=",",t.before="",!function(e){if(!e||"word"!==e.type)return!1;if(!o(e))return!1;const t=n.default.unit(e.value);if(!t)return!1;return!!t.number}(r))return;const u=n.default.unit(r.value);if(!u)return;"%"===u.unit&&(u.number=String(parseFloat(u.number)/100),r.value=String(u.number))}(e,l.slash,l.alpha);const[s,c,f]=[(d=l).hNode,d.wNode,d.bNode];var d;const[p,v,b]=function(e){return[e.h,e.w,e.b]}(l),m=t([p.number,v.number,b.number].map((e=>parseFloat(e))));e.nodes.splice(e.nodes.indexOf(s)+1,0,{sourceIndex:0,sourceEndIndex:1,value:",",type:"div",before:"",after:""}),e.nodes.splice(e.nodes.indexOf(c)+1,0,{sourceIndex:0,sourceEndIndex:1,value:",",type:"div",before:"",after:""}),a(e.nodes,s,{...s,value:String(m[0])}),a(e.nodes,c,{...c,value:String(m[1])}),a(e.nodes,f,{...f,value:String(m[2])})}function u(e){if(!e||"word"!==e.type)return!1;if(!o(e))return!1;const t=n.default.unit(e.value);return!!t&&("%"===t.unit||""===t.unit)}function a(e,n,t){const r=e.indexOf(n);e[r]=t}function i(e){if("%"!==e.unit)return e.unit="%",void(e.number=(100*parseFloat(e.number)).toString())}function o(e){if(!e||!e.value)return!1;try{return!1!==n.default.unit(e.value)}catch(e){return!1}}const l=e=>{const t="preserve"in Object(e)&&Boolean(e.preserve);return{postcssPlugin:"postcss-hwb-function",Declaration:(e,{result:u,postcss:a})=>{if(t&&function(e){let n=e.parent;for(;n;)if("atrule"===n.type){if("supports"===n.name&&-1!==n.params.indexOf("(color: hwb(0% 0 0))"))return!0;n=n.parent}else n=n.parent;return!1}(e))return;const i=e.value;if(!i.includes("hwb"))return;const o=function(e,t,u){let a;try{a=n.default(e)}catch(n){t.warn(u,`Failed to parse value '${e}' as a hwb function. Leaving the original value intact.`)}if(void 0===a)return;a.walk((e=>{e.type&&"function"===e.type&&"hwb"===e.value&&r(e)}));const i=String(a);if(i===e)return;return i}(i,e,u);if(void 0!==o)if(e.variable&&t){const n=e.parent,t=a.atRule({name:"supports",params:"(color: hwb(0% 0 0))",source:e.source}),r=n.clone();r.removeAll(),r.append(e.clone()),t.append(r),function(e,n,t){let r=n,u=n.next();for(;r&&u&&"atrule"===u.type&&"supports"===u.name&&u.params===t;)r=u,u=u.next();r.after(e)}(t,n,"(color: hwb(0% 0 0))"),e.value=o}else t?e.cloneBefore({value:o}):e.value=o}}};l.postcss=!0,module.exports=l;
1
+ "use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=e(require("postcss-value-parser"));function t(e){const n=e[0];let t=e[1],r=e[2];if(t/=100,r/=100,t+r>=1){const e=t/(t+r);return[e,e,e].map((e=>Math.round(255*e)))}const u=function(e){let n=e[0],t=e[1],r=e[2];n%=360,n<0&&(n+=360);function u(e){const u=(e+n/30)%12,a=t*Math.min(r,1-r);return r-a*Math.max(-1,Math.min(u-3,9-u,1))}return t/=100,r/=100,[u(0),u(8),u(4)]}([n,100,50]);for(let e=0;e<3;e++)u[e]*=1-t-r,u[e]+=t;return u.map((e=>Math.round(255*e)))}function r(e){const r=e.nodes.slice().filter((e=>"comment"!==e.type&&"space"!==e.type)),l=function(e){if(!function(e){if(!e||"word"!==e.type)return!1;if(!o(e))return!1;const t=n.default.unit(e.value);if(!t)return!1;return!!t.number&&("deg"===t.unit||"grad"===t.unit||"rad"===t.unit||"turn"===t.unit||""===t.unit)}(e[0]))return null;if(!u(e[1]))return null;if(!u(e[2]))return null;const t={h:n.default.unit(e[0].value),hNode:e[0],w:n.default.unit(e[1].value),wNode:e[1],b:n.default.unit(e[2].value),bNode:e[2]};if(function(e){switch(e.unit){case"deg":return void(e.unit="");case"rad":return e.unit="",void(e.number=(180*parseFloat(e.number)/Math.PI).toString());case"grad":return e.unit="",void(e.number=(.9*parseFloat(e.number)).toString());case"turn":e.unit="",e.number=(360*parseFloat(e.number)).toString()}}(t.h),""!==t.h.unit)return null;i(t.w),i(t.b),function(e){return e&&"div"===e.type&&"/"===e.value}(e[3])&&(t.slash=e[3]);(u(e[4])||function(e){return e&&"function"===e.type&&"calc"===e.value}(e[4])||function(e){return e&&"function"===e.type&&"var"===e.value}(e[4]))&&(t.alpha=e[4]);return t}(r);if(!l)return;if(r.length>3&&(!l.slash||!l.alpha))return;e.value="rgb",function(e,t,r){if(!t||!r)return;if(e.value="rgba",t.value=",",t.before="",!function(e){if(!e||"word"!==e.type)return!1;if(!o(e))return!1;const t=n.default.unit(e.value);if(!t)return!1;return!!t.number}(r))return;const u=n.default.unit(r.value);if(!u)return;"%"===u.unit&&(u.number=String(parseFloat(u.number)/100),r.value=String(u.number))}(e,l.slash,l.alpha);const[s,c,f]=[(d=l).hNode,d.wNode,d.bNode];var d;const[p,v,b]=function(e){return[e.h,e.w,e.b]}(l),m=t([p.number,v.number,b.number].map((e=>parseFloat(e))));e.nodes.splice(e.nodes.indexOf(s)+1,0,{sourceIndex:0,sourceEndIndex:1,value:",",type:"div",before:"",after:""}),e.nodes.splice(e.nodes.indexOf(c)+1,0,{sourceIndex:0,sourceEndIndex:1,value:",",type:"div",before:"",after:""}),a(e.nodes,s,{...s,value:String(m[0])}),a(e.nodes,c,{...c,value:String(m[1])}),a(e.nodes,f,{...f,value:String(m[2])})}function u(e){if(!e||"word"!==e.type)return!1;if(!o(e))return!1;const t=n.default.unit(e.value);return!!t&&("%"===t.unit||""===t.unit)}function a(e,n,t){const r=e.indexOf(n);e[r]=t}function i(e){if("%"!==e.unit)return e.unit="%",void(e.number=(100*parseFloat(e.number)).toString())}function o(e){if(!e||!e.value)return!1;try{return!1!==n.default.unit(e.value)}catch(e){return!1}}const l=e=>{const t="preserve"in Object(e)&&Boolean(e.preserve);return{postcssPlugin:"postcss-hwb-function",Declaration:(e,{result:u,postcss:a})=>{if(t&&function(e){let n=e.parent;for(;n;)if("atrule"===n.type){if("supports"===n.name&&-1!==n.params.indexOf("(color: hwb(0% 0 0))"))return!0;n=n.parent}else n=n.parent;return!1}(e))return;const i=e.value;if(!i.includes("hwb"))return;const o=function(e,t,u){let a;try{a=n.default(e)}catch(n){t.warn(u,`Failed to parse value '${e}' as a hwb function. Leaving the original value intact.`)}if(void 0===a)return;a.walk((e=>{e.type&&"function"===e.type&&"hwb"===e.value&&r(e)}));const i=String(a);if(i===e)return;return i}(i,e,u);if(void 0!==o)if(e.variable&&t){const n=e.parent,t=a.atRule({name:"supports",params:"(color: hwb(0% 0 0))",source:e.source}),r=n.clone();r.removeAll(),r.append(e.clone()),t.append(r),function(e,n,t){let r=n,u=n.next();for(;r&&u&&"atrule"===u.type&&"supports"===u.name&&u.params===t;)r=u,u=u.next();r.after(e)}(t,n,"(color: hwb(0% 0 0))"),e.value=o}else t?e.cloneBefore({value:o}):e.value=o}}};l.postcss=!0,module.exports=l;
package/dist/index.mjs CHANGED
@@ -1 +1 @@
1
- import n from"postcss-value-parser";function e(n){const e=n[0];let t=n[1],r=n[2];if(t/=100,r/=100,t+r>=1){const n=t/(t+r);return[n,n,n]}const u=function(n){let e=n[0],t=n[1],r=n[2];e%=360,e<0&&(e+=360);function u(n){const u=(n+e/30)%12,i=t*Math.min(r,1-r);return r-i*Math.max(-1,Math.min(u-3,9-u,1))}return t/=100,r/=100,[u(0),u(8),u(4)]}([e,100,50]);for(let n=0;n<3;n++)u[n]*=1-t-r,u[n]+=t;return u.map((n=>Math.round(255*n)))}function t(t){const a=t.nodes.slice().filter((n=>"comment"!==n.type&&"space"!==n.type)),s=function(e){if(!function(e){if(!e||"word"!==e.type)return!1;if(!o(e))return!1;const t=n.unit(e.value);if(!t)return!1;return!!t.number&&("deg"===t.unit||"grad"===t.unit||"rad"===t.unit||"turn"===t.unit||""===t.unit)}(e[0]))return null;if(!r(e[1]))return null;if(!r(e[2]))return null;const t={h:n.unit(e[0].value),hNode:e[0],w:n.unit(e[1].value),wNode:e[1],b:n.unit(e[2].value),bNode:e[2]};if(function(n){switch(n.unit){case"deg":return void(n.unit="");case"rad":return n.unit="",void(n.number=(180*parseFloat(n.number)/Math.PI).toString());case"grad":return n.unit="",void(n.number=(.9*parseFloat(n.number)).toString());case"turn":n.unit="",n.number=(360*parseFloat(n.number)).toString()}}(t.h),""!==t.h.unit)return null;i(t.w),i(t.b),function(n){return n&&"div"===n.type&&"/"===n.value}(e[3])&&(t.slash=e[3]);(r(e[4])||function(n){return n&&"function"===n.type&&"calc"===n.value}(e[4])||function(n){return n&&"function"===n.type&&"var"===n.value}(e[4]))&&(t.alpha=e[4]);return t}(a);if(!s)return;if(a.length>3&&(!s.slash||!s.alpha))return;t.value="rgb",function(e,t,r){if(!t||!r)return;if(e.value="rgba",t.value=",",t.before="",!function(e){if(!e||"word"!==e.type)return!1;if(!o(e))return!1;const t=n.unit(e.value);if(!t)return!1;return!!t.number}(r))return;const u=n.unit(r.value);if(!u)return;"%"===u.unit&&(u.number=String(parseFloat(u.number)/100),r.value=String(u.number))}(t,s.slash,s.alpha);const[l,c,f]=[(p=s).hNode,p.wNode,p.bNode];var p;const[d,v,b]=function(n){return[n.h,n.w,n.b]}(s),m=e([d.number,v.number,b.number].map((n=>parseFloat(n))));t.nodes.splice(t.nodes.indexOf(l)+1,0,{sourceIndex:0,sourceEndIndex:1,value:",",type:"div",before:"",after:""}),t.nodes.splice(t.nodes.indexOf(c)+1,0,{sourceIndex:0,sourceEndIndex:1,value:",",type:"div",before:"",after:""}),u(t.nodes,l,{...l,value:String(m[0])}),u(t.nodes,c,{...c,value:String(m[1])}),u(t.nodes,f,{...f,value:String(m[2])})}function r(e){if(!e||"word"!==e.type)return!1;if(!o(e))return!1;const t=n.unit(e.value);return!!t&&("%"===t.unit||""===t.unit)}function u(n,e,t){const r=n.indexOf(e);n[r]=t}function i(n){if("%"!==n.unit)return n.unit="%",void(n.number=(100*parseFloat(n.number)).toString())}function o(e){if(!e||!e.value)return!1;try{return!1!==n.unit(e.value)}catch(n){return!1}}const a=e=>{const r="preserve"in Object(e)&&Boolean(e.preserve);return{postcssPlugin:"postcss-hwb-function",Declaration:(e,{result:u,postcss:i})=>{if(r&&function(n){let e=n.parent;for(;e;)if("atrule"===e.type){if("supports"===e.name&&-1!==e.params.indexOf("(color: hwb(0% 0 0))"))return!0;e=e.parent}else e=e.parent;return!1}(e))return;const o=e.value;if(!o.includes("hwb"))return;const a=function(e,r,u){let i;try{i=n(e)}catch(n){r.warn(u,`Failed to parse value '${e}' as a hwb function. Leaving the original value intact.`)}if(void 0===i)return;i.walk((n=>{n.type&&"function"===n.type&&"hwb"===n.value&&t(n)}));const o=String(i);if(o===e)return;return o}(o,e,u);if(void 0!==a)if(e.variable&&r){const n=e.parent,t=i.atRule({name:"supports",params:"(color: hwb(0% 0 0))",source:e.source}),r=n.clone();r.removeAll(),r.append(e.clone()),t.append(r),function(n,e,t){let r=e,u=e.next();for(;r&&u&&"atrule"===u.type&&"supports"===u.name&&u.params===t;)r=u,u=u.next();r.after(n)}(t,n,"(color: hwb(0% 0 0))"),e.value=a}else r?e.cloneBefore({value:a}):e.value=a}}};a.postcss=!0;export{a as default};
1
+ import n from"postcss-value-parser";function e(n){const e=n[0];let t=n[1],r=n[2];if(t/=100,r/=100,t+r>=1){const n=t/(t+r);return[n,n,n].map((n=>Math.round(255*n)))}const u=function(n){let e=n[0],t=n[1],r=n[2];e%=360,e<0&&(e+=360);function u(n){const u=(n+e/30)%12,o=t*Math.min(r,1-r);return r-o*Math.max(-1,Math.min(u-3,9-u,1))}return t/=100,r/=100,[u(0),u(8),u(4)]}([e,100,50]);for(let n=0;n<3;n++)u[n]*=1-t-r,u[n]+=t;return u.map((n=>Math.round(255*n)))}function t(t){const a=t.nodes.slice().filter((n=>"comment"!==n.type&&"space"!==n.type)),s=function(e){if(!function(e){if(!e||"word"!==e.type)return!1;if(!i(e))return!1;const t=n.unit(e.value);if(!t)return!1;return!!t.number&&("deg"===t.unit||"grad"===t.unit||"rad"===t.unit||"turn"===t.unit||""===t.unit)}(e[0]))return null;if(!r(e[1]))return null;if(!r(e[2]))return null;const t={h:n.unit(e[0].value),hNode:e[0],w:n.unit(e[1].value),wNode:e[1],b:n.unit(e[2].value),bNode:e[2]};if(function(n){switch(n.unit){case"deg":return void(n.unit="");case"rad":return n.unit="",void(n.number=(180*parseFloat(n.number)/Math.PI).toString());case"grad":return n.unit="",void(n.number=(.9*parseFloat(n.number)).toString());case"turn":n.unit="",n.number=(360*parseFloat(n.number)).toString()}}(t.h),""!==t.h.unit)return null;o(t.w),o(t.b),function(n){return n&&"div"===n.type&&"/"===n.value}(e[3])&&(t.slash=e[3]);(r(e[4])||function(n){return n&&"function"===n.type&&"calc"===n.value}(e[4])||function(n){return n&&"function"===n.type&&"var"===n.value}(e[4]))&&(t.alpha=e[4]);return t}(a);if(!s)return;if(a.length>3&&(!s.slash||!s.alpha))return;t.value="rgb",function(e,t,r){if(!t||!r)return;if(e.value="rgba",t.value=",",t.before="",!function(e){if(!e||"word"!==e.type)return!1;if(!i(e))return!1;const t=n.unit(e.value);if(!t)return!1;return!!t.number}(r))return;const u=n.unit(r.value);if(!u)return;"%"===u.unit&&(u.number=String(parseFloat(u.number)/100),r.value=String(u.number))}(t,s.slash,s.alpha);const[l,c,f]=[(p=s).hNode,p.wNode,p.bNode];var p;const[d,v,b]=function(n){return[n.h,n.w,n.b]}(s),m=e([d.number,v.number,b.number].map((n=>parseFloat(n))));t.nodes.splice(t.nodes.indexOf(l)+1,0,{sourceIndex:0,sourceEndIndex:1,value:",",type:"div",before:"",after:""}),t.nodes.splice(t.nodes.indexOf(c)+1,0,{sourceIndex:0,sourceEndIndex:1,value:",",type:"div",before:"",after:""}),u(t.nodes,l,{...l,value:String(m[0])}),u(t.nodes,c,{...c,value:String(m[1])}),u(t.nodes,f,{...f,value:String(m[2])})}function r(e){if(!e||"word"!==e.type)return!1;if(!i(e))return!1;const t=n.unit(e.value);return!!t&&("%"===t.unit||""===t.unit)}function u(n,e,t){const r=n.indexOf(e);n[r]=t}function o(n){if("%"!==n.unit)return n.unit="%",void(n.number=(100*parseFloat(n.number)).toString())}function i(e){if(!e||!e.value)return!1;try{return!1!==n.unit(e.value)}catch(n){return!1}}const a=e=>{const r="preserve"in Object(e)&&Boolean(e.preserve);return{postcssPlugin:"postcss-hwb-function",Declaration:(e,{result:u,postcss:o})=>{if(r&&function(n){let e=n.parent;for(;e;)if("atrule"===e.type){if("supports"===e.name&&-1!==e.params.indexOf("(color: hwb(0% 0 0))"))return!0;e=e.parent}else e=e.parent;return!1}(e))return;const i=e.value;if(!i.includes("hwb"))return;const a=function(e,r,u){let o;try{o=n(e)}catch(n){r.warn(u,`Failed to parse value '${e}' as a hwb function. Leaving the original value intact.`)}if(void 0===o)return;o.walk((n=>{n.type&&"function"===n.type&&"hwb"===n.value&&t(n)}));const i=String(o);if(i===e)return;return i}(i,e,u);if(void 0!==a)if(e.variable&&r){const n=e.parent,t=o.atRule({name:"supports",params:"(color: hwb(0% 0 0))",source:e.source}),r=n.clone();r.removeAll(),r.append(e.clone()),t.append(r),function(n,e,t){let r=e,u=e.next();for(;r&&u&&"atrule"===u.type&&"supports"===u.name&&u.params===t;)r=u,u=u.next();r.after(n)}(t,n,"(color: hwb(0% 0 0))"),e.value=a}else r?e.cloneBefore({value:a}):e.value=a}}};a.postcss=!0;export{a as default};
package/package.json CHANGED
@@ -1,70 +1,81 @@
1
1
  {
2
- "name": "@csstools/postcss-hwb-function",
3
- "version": "1.0.0",
4
- "description": "Use hwb() color functions in CSS",
5
- "author": "Jonathan Neal <jonathantneal@hotmail.com>",
6
- "license": "CC0-1.0",
7
- "homepage": "https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-hwb-function#readme",
8
- "bugs": "https://github.com/csstools/postcss-plugins/issues",
9
- "main": "dist/index.cjs",
10
- "module": "dist/index.mjs",
11
- "types": "./dist/index.d.ts",
12
- "exports": {
13
- ".": {
14
- "import": "./dist/index.mjs",
15
- "require": "./dist/index.cjs",
16
- "default": "./dist/index.mjs"
17
- }
18
- },
19
- "files": [
20
- "CHANGELOG.md",
21
- "INSTALL.md",
22
- "LICENSE.md",
23
- "README.md",
24
- "dist"
25
- ],
26
- "scripts": {
27
- "build": "rollup -c ../../rollup/default.js",
28
- "clean": "node -e \"fs.rmSync('./dist', { recursive: true, force: true });\"",
29
- "lint": "eslint ./src --ext .js --ext .ts --ext .mjs --no-error-on-unmatched-pattern",
30
- "prepublishOnly": "npm run clean && npm run build && npm run test",
31
- "stryker": "stryker run --logLevel error",
32
- "test": "node .tape.mjs && npm run test:exports",
33
- "test:exports": "node ./test/_import.mjs && node ./test/_require.cjs"
34
- },
35
- "engines": {
36
- "node": "^12 || ^14 || >=16"
37
- },
38
- "dependencies": {
39
- "postcss-value-parser": "^4.2.0"
40
- },
41
- "peerDependencies": {
42
- "postcss": "^8.3"
43
- },
44
- "keywords": [
45
- "postcss",
46
- "css",
47
- "postcss-plugin",
48
- "color",
49
- "colors",
50
- "rgb",
51
- "rgba",
52
- "hsl",
53
- "hsla",
54
- "hwb",
55
- "functional",
56
- "notation",
57
- "design",
58
- "syntax",
59
- "space",
60
- "comma"
61
- ],
62
- "repository": {
63
- "type": "git",
64
- "url": "https://github.com/csstools/postcss-plugins.git",
65
- "directory": "plugins/postcss-hwb-function"
66
- },
67
- "volta": {
68
- "extends": "../../package.json"
69
- }
2
+ "name": "@csstools/postcss-hwb-function",
3
+ "description": "Use hwb() color functions in CSS",
4
+ "version": "1.0.1",
5
+ "author": "Jonathan Neal <jonathantneal@hotmail.com>",
6
+ "license": "CC0-1.0",
7
+ "funding": {
8
+ "type": "opencollective",
9
+ "url": "https://opencollective.com/csstools"
10
+ },
11
+ "engines": {
12
+ "node": "^12 || ^14 || >=16"
13
+ },
14
+ "main": "dist/index.cjs",
15
+ "module": "dist/index.mjs",
16
+ "types": "./dist/index.d.ts",
17
+ "exports": {
18
+ ".": {
19
+ "import": "./dist/index.mjs",
20
+ "require": "./dist/index.cjs",
21
+ "default": "./dist/index.mjs"
22
+ }
23
+ },
24
+ "files": [
25
+ "CHANGELOG.md",
26
+ "INSTALL.md",
27
+ "LICENSE.md",
28
+ "README.md",
29
+ "dist"
30
+ ],
31
+ "dependencies": {
32
+ "postcss-value-parser": "^4.2.0"
33
+ },
34
+ "peerDependencies": {
35
+ "postcss": "^8.4"
36
+ },
37
+ "scripts": {
38
+ "build": "rollup -c ../../rollup/default.js",
39
+ "clean": "node -e \"fs.rmSync('./dist', { recursive: true, force: true });\"",
40
+ "docs": "node ../../.github/bin/generate-docs/install.mjs",
41
+ "lint": "npm run lint:eslint && npm run lint:package-json",
42
+ "lint:eslint": "eslint ./src --ext .js --ext .ts --ext .mjs --no-error-on-unmatched-pattern",
43
+ "lint:package-json": "node ../../.github/bin/format-package-json.mjs",
44
+ "prepublishOnly": "npm run clean && npm run build && npm run test",
45
+ "test": "node .tape.mjs && npm run test:exports",
46
+ "test:exports": "node ./test/_import.mjs && node ./test/_require.cjs",
47
+ "test:rewrite-expects": "REWRITE_EXPECTS=true node .tape.mjs"
48
+ },
49
+ "homepage": "https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-hwb-function#readme",
50
+ "repository": {
51
+ "type": "git",
52
+ "url": "https://github.com/csstools/postcss-plugins.git",
53
+ "directory": "plugins/postcss-hwb-function"
54
+ },
55
+ "bugs": "https://github.com/csstools/postcss-plugins/issues",
56
+ "keywords": [
57
+ "color",
58
+ "colors",
59
+ "comma",
60
+ "css",
61
+ "design",
62
+ "functional",
63
+ "hsl",
64
+ "hsla",
65
+ "hwb",
66
+ "notation",
67
+ "postcss",
68
+ "postcss-plugin",
69
+ "rgb",
70
+ "rgba",
71
+ "space",
72
+ "syntax"
73
+ ],
74
+ "csstools": {
75
+ "exportName": "postcssHWBFunction",
76
+ "humanReadableName": "PostCSS HWB Function"
77
+ },
78
+ "volta": {
79
+ "extends": "../../package.json"
80
+ }
70
81
  }