@csstools/postcss-oklab-function 1.0.0 → 1.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/CHANGELOG.md +39 -0
- package/README.md +7 -6
- package/dist/index.cjs +4 -4
- package/dist/index.mjs +2 -2
- package/package.json +73 -63
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,44 @@
|
|
|
1
1
|
# Changes to PostCSS OKLab Function
|
|
2
2
|
|
|
3
|
+
### 1.1.0 (April 4, 2022)
|
|
4
|
+
|
|
5
|
+
- Allow percentage and number units in more color components.
|
|
6
|
+
|
|
7
|
+
```css
|
|
8
|
+
.percentages {
|
|
9
|
+
color-1: oklab(40% 0.309% 0.975%);
|
|
10
|
+
color-2: oklch(40% 31.718385875% 34.568626);
|
|
11
|
+
|
|
12
|
+
/* becomes */
|
|
13
|
+
|
|
14
|
+
color-1: rgb(73, 71, 69);
|
|
15
|
+
color-1: color(display-p3 0.28515 0.27983 0.27246);
|
|
16
|
+
color-2: rgb(126, 37, 15);
|
|
17
|
+
color-2: color(display-p3 0.45368 0.16978 0.09411);
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
.numbers {
|
|
21
|
+
color-1: oklab(0.40 0.001236 0.0039);
|
|
22
|
+
color-2: oklch(0.40 0.1268735435 34.568626);
|
|
23
|
+
|
|
24
|
+
/* becomes */
|
|
25
|
+
|
|
26
|
+
color-1: rgb(73, 71, 69);
|
|
27
|
+
color-1: color(display-p3 0.28515 0.27983 0.27246);
|
|
28
|
+
color-2: rgb(126, 37, 15);
|
|
29
|
+
color-2: color(display-p3 0.45368 0.16978 0.09411);
|
|
30
|
+
}
|
|
31
|
+
```
|
|
32
|
+
|
|
33
|
+
### 1.0.2 (March 8, 2022)
|
|
34
|
+
|
|
35
|
+
- Fix gamut mapping giving overly unsaturated colors.
|
|
36
|
+
- Implement powerless color components in gamut mapping.
|
|
37
|
+
|
|
38
|
+
### 1.0.1 (February 12, 2022)
|
|
39
|
+
|
|
40
|
+
- Updated `@csstools/postcss-progressive-custom-properties` to `1.1.0`.
|
|
41
|
+
|
|
3
42
|
### 1.0.0 (February 11, 2022)
|
|
4
43
|
|
|
5
44
|
- Initial version
|
package/README.md
CHANGED
|
@@ -1,11 +1,10 @@
|
|
|
1
1
|
# PostCSS OKLab 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-oklab-function.svg" height="20">][npm-url]
|
|
4
|
-
|
|
4
|
+
[<img alt="CSS Standard Status" src="https://cssdb.org/images/badges/oklab-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
6
|
[<img alt="Discord" src="https://shields.io/badge/Discord-5865F2?logo=discord&logoColor=white">][discord]
|
|
7
7
|
|
|
8
|
-
|
|
9
8
|
[PostCSS OKLab Function] lets you use `oklab` and `oklch` color functions in
|
|
10
9
|
CSS, following the [CSS Color] specification.
|
|
11
10
|
|
|
@@ -96,7 +95,7 @@ postcssOKLabFunction({ preserve: true })
|
|
|
96
95
|
The `enableProgressiveCustomProperties` option determines whether the original notation
|
|
97
96
|
is wrapped with `@supports` when used in Custom Properties. By default, it is enabled.
|
|
98
97
|
|
|
99
|
-
⚠️
|
|
98
|
+
⚠️ We only recommend disabling this when you set `preserve` to `false` or if you bring your own fix for Custom Properties. See what the plugin does in its [README](https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-progressive-custom-properties#readme).
|
|
100
99
|
|
|
101
100
|
```js
|
|
102
101
|
postcssOKLabFunction({ enableProgressiveCustomProperties: false })
|
|
@@ -120,9 +119,11 @@ postcssOKLabFunction({ enableProgressiveCustomProperties: false })
|
|
|
120
119
|
|
|
121
120
|
#### displayP3
|
|
122
121
|
|
|
123
|
-
The `subFeatures.displayP3` option determines if `color(display-p3 ...)` is used as a fallback
|
|
122
|
+
The `subFeatures.displayP3` option determines if `color(display-p3 ...)` is used as a fallback.<br>
|
|
124
123
|
By default, it is enabled.
|
|
125
124
|
|
|
125
|
+
`display-p3` can display wider gamut colors than `rgb` on some devices.
|
|
126
|
+
|
|
126
127
|
```js
|
|
127
128
|
postcssOKLabFunction({
|
|
128
129
|
subFeatures: {
|
|
@@ -154,7 +155,7 @@ postcssOKLabFunction({
|
|
|
154
155
|
## Out of gamut colors
|
|
155
156
|
|
|
156
157
|
Depending on the browser implementation out of gamut colors may be clipped, resulting in a different color.<br>
|
|
157
|
-
Fallback values generated by [PostCSS
|
|
158
|
+
Fallback values generated by [PostCSS OKLab Function] are always mapped to a close alternative in sRGB.
|
|
158
159
|
|
|
159
160
|
When setting `preserve` to `true` the original values will be used by some browsers and these may be clipped.<br>
|
|
160
161
|
Certain browsers will have an incorrect color if this occurs.
|
|
@@ -172,7 +173,7 @@ This software or document includes material copied from or derived from https://
|
|
|
172
173
|
[cli-url]: https://github.com/csstools/postcss-plugins/actions/workflows/test.yml?query=workflow/test
|
|
173
174
|
[css-url]: https://cssdb.org/#oklab-function
|
|
174
175
|
[discord]: https://discord.gg/bUadyRwkJS
|
|
175
|
-
[npm-url]: https://www.npmjs.com/package/postcss-oklab-function
|
|
176
|
+
[npm-url]: https://www.npmjs.com/package/@csstools/postcss-oklab-function
|
|
176
177
|
|
|
177
178
|
[CSS Color]: https://www.w3.org/TR/css-color-4/#specifying-oklab-oklch
|
|
178
179
|
[Gulp PostCSS]: https://github.com/postcss/gulp-postcss
|
package/dist/index.cjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";var e=require("@csstools/postcss-progressive-custom-properties"),
|
|
1
|
+
"use strict";var e=require("@csstools/postcss-progressive-custom-properties"),n=require("postcss-value-parser");function t(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r=t(e),u=t(n);
|
|
2
2
|
/**
|
|
3
3
|
* Simple matrix (and vector) multiplication
|
|
4
4
|
* Warning: No error handling for incompatible dimensions!
|
|
@@ -11,7 +11,7 @@
|
|
|
11
11
|
*
|
|
12
12
|
* @see https://github.com/w3c/csswg-drafts/blob/main/css-color-4/multiply-matrices.js
|
|
13
13
|
*/
|
|
14
|
-
function a(e,
|
|
14
|
+
function a(e,n){const t=e.length;let r,u;r=Array.isArray(e[0])?e:[e],Array.isArray(n[0])||(u=n.map((e=>[e])));const a=u[0].length,o=u[0].map(((e,n)=>u.map((e=>e[n]))));let i=r.map((e=>o.map((n=>Array.isArray(e)?e.reduce(((e,t,r)=>e+t*(n[r]||0)),0):n.reduce(((n,t)=>n+t*e),0)))));return 1===t&&(i=i[0]),1===a?i.map((e=>e[0])):i}
|
|
15
15
|
/**
|
|
16
16
|
* @license W3C
|
|
17
17
|
* https://www.w3.org/Consortium/Legal/2015/copyright-software-and-document
|
|
@@ -19,7 +19,7 @@ function a(e,t){const n=e.length;let r,u;r=Array.isArray(e[0])?e:[e],Array.isArr
|
|
|
19
19
|
* @copyright This software or document includes material copied from or derived from https://github.com/w3c/csswg-drafts/blob/main/css-color-4/conversions.js. Copyright © 2022 W3C® (MIT, ERCIM, Keio, Beihang).
|
|
20
20
|
*
|
|
21
21
|
* @see https://github.com/w3c/csswg-drafts/blob/main/css-color-4/conversions.js
|
|
22
|
-
*/function o(e){return e.map((function(e){const
|
|
22
|
+
*/function o(e){return e.map((function(e){const n=e<0?-1:1,t=Math.abs(e);return t<.04045?e/12.92:n*Math.pow((t+.055)/1.055,2.4)}))}function i(e){return e.map((function(e){const n=e<0?-1:1,t=Math.abs(e);return t>.0031308?n*(1.055*Math.pow(t,1/2.4)-.055):12.92*e}))}function l(e){return a([[.41239079926595934,.357584339383878,.1804807884018343],[.21263900587151027,.715168678767756,.07219231536073371],[.01933081871559182,.11919477979462598,.9505321522496607]],e)}function s(e){return a([[3.2409699419045226,-1.537383177570094,-.4986107602930034],[-.9692436362808796,1.8759675015077202,.04155505740717559],[.05563007969699366,-.20397695888897652,1.0569715142428786]],e)}function c(e){return o(e)}function f(e){return i(e)}function p(e){return a([[.4865709486482162,.26566769316909306,.1982172852343625],[.2289745640697488,.6917385218365064,.079286914093745],[0,.04511338185890264,1.043944368900976]],e)}function d(e){return a([[2.493496911941425,-.9313836179191239,-.40271078445071684],[-.8294889695615747,1.7626640603183463,.023624685841943577],[.03584583024378447,-.07617238926804182,.9568845240076872]],e)}function b(e){const n=a([[.8190224432164319,.3619062562801221,-.12887378261216414],[.0329836671980271,.9292868468965546,.03614466816999844],[.048177199566046255,.26423952494422764,.6335478258136937]],e);return a([[.2104542553,.793617785,-.0040720468],[1.9779984951,-2.428592205,.4505937099],[.0259040371,.7827717662,-.808675766]],n.map((e=>Math.cbrt(e))))}function v(e){const n=a([[.9999999984505198,.39633779217376786,.2158037580607588],[1.0000000088817609,-.10556134232365635,-.06385417477170591],[1.0000000546724108,-.08948418209496575,-1.2914855378640917]],e);return a([[1.2268798733741557,-.5578149965554813,.28139105017721583],[-.04057576262431372,1.1122868293970594,-.07171106666151701],[-.07637294974672142,-.4214933239627914,1.5869240244272418]],n.map((e=>e**3)))}function m(e){const n=180*Math.atan2(e[2],e[1])/Math.PI;return[e[0],Math.sqrt(e[1]**2+e[2]**2),n>=0?n:n+360]}function h(e){return[e[0],e[1]*Math.cos(e[2]*Math.PI/180),e[1]*Math.sin(e[2]*Math.PI/180)]}
|
|
23
23
|
/**
|
|
24
24
|
* @license W3C
|
|
25
25
|
* https://www.w3.org/Consortium/Legal/2015/copyright-software-and-document
|
|
@@ -27,4 +27,4 @@ function a(e,t){const n=e.length;let r,u;r=Array.isArray(e[0])?e:[e],Array.isArr
|
|
|
27
27
|
* @copyright This software or document includes material copied from or derived from https://github.com/w3c/csswg-drafts/blob/main/css-color-4/deltaEOK.js. Copyright © 2022 W3C® (MIT, ERCIM, Keio, Beihang).
|
|
28
28
|
*
|
|
29
29
|
* @see https://github.com/w3c/csswg-drafts/blob/main/css-color-4/deltaEOK.js
|
|
30
|
-
*/function y(e,
|
|
30
|
+
*/function y(e,n){const[t,r,u]=e,[a,o,i]=n,l=t-a,s=r-o,c=u-i;return Math.sqrt(l**2+s**2+c**2)}function g(e,n,t){return function(e,n,t){let r=0,u=e[1];const a=e;for(;u-r>1e-4;){const e=x(n(a));y(h(a),h(t(e)))-.02<1e-4?r=a[1]:u=a[1],a[1]=(u+r)/2}return x(n([...a]))}(e,n,t)}function x(e){return e.map((e=>e<0?0:e>1?1:e))}function F(e){const[n,t,r]=e;return n>=-1e-4&&n<=1.0001&&t>=-1e-4&&t<=1.0001&&r>=-1e-4&&r<=1.0001}function M(e){const[n,t,r]=e;let u=[Math.max(n,0),t,r],a=m(u);return a[0]<1e-6&&(a=[0,0,0]),a[0]>.999999&&(a=[1,0,0]),u=v(u),u=d(u),u=f(u),F(u)?[x(u),!0]:[g(a,(e=>f(e=d(e=v(e=h(e))))),(e=>m(e=b(e=p(e=c(e)))))),!1]}function k(e){const[n,t,r]=e,u=[Math.max(n,0),t,r%360];let a=u;return a[0]<1e-6&&(a=[0,0,0]),a[0]>.999999&&(a=[1,0,0]),a=h(a),a=v(a),a=d(a),a=f(a),F(a)?[x(a),!0]:[g(u,(e=>f(e=d(e=v(e=h(e))))),(e=>m(e=b(e=p(e=c(e)))))),!1]}function P(e){const[n,t,r]=e;let u=[Math.max(n,0),t,r],a=m(u);return a[0]<1e-6&&(a=[0,0,0]),a[0]>.999999&&(a=[1,0,0]),u=v(u),u=s(u),u=i(u),F(u)?x(u).map((e=>Math.round(255*e))):g(a,(e=>i(e=s(e=v(e=h(e))))),(e=>m(e=b(e=l(e=o(e)))))).map((e=>Math.round(255*e)))}function w(e){const[n,t,r]=e,u=[Math.max(n,0),t,r%360];let a=u;return a[0]<1e-6&&(a=[0,0,0]),a[0]>.999999&&(a=[1,0,0]),a=h(a),a=v(a),a=s(a),a=i(a),F(a)?x(a).map((e=>Math.round(255*e))):g(u,(e=>i(e=s(e=v(e=h(e))))),(e=>m(e=b(e=l(e=o(e)))))).map((e=>Math.round(255*e)))}function I(e){const n=e.value,t=e.nodes.slice().filter((e=>"comment"!==e.type&&"space"!==e.type));let r=null;if("oklab"===n?r=B(t):"oklch"===n&&(r=q(t)),!r)return;e.value="rgb",function(e,n,t){if(!n||!t)return;if(e.value="rgba",n.value=",",n.before="",!function(e){if(!e||"word"!==e.type)return!1;if(!D(e))return!1;const n=u.default.unit(e.value);if(!n)return!1;return!!n.number}(t))return;const r=u.default.unit(t.value);if(!r)return;"%"===r.unit&&(r.number=String(parseFloat(r.number)/100),t.value=String(r.number))}(e,r.slash,r.alpha);const[a,o,i]=j(r),[l,s,c]=C(r),f=("oklab"===n?P:w)([l.number,s.number,c.number].map((e=>parseFloat(e))));e.nodes.splice(e.nodes.indexOf(a)+1,0,{sourceIndex:0,sourceEndIndex:1,value:",",type:"div",before:"",after:""}),e.nodes.splice(e.nodes.indexOf(o)+1,0,{sourceIndex:0,sourceEndIndex:1,value:",",type:"div",before:"",after:""}),$(e.nodes,a,{...a,value:String(f[0])}),$(e.nodes,o,{...o,value:String(f[1])}),$(e.nodes,i,{...i,value:String(f[2])})}function N(e){if(!e||"word"!==e.type)return!1;if(!D(e))return!1;const n=u.default.unit(e.value);return!!n&&("%"===n.unit||""===n.unit)}function S(e){return e&&"function"===e.type&&"calc"===e.value}function O(e){return e&&"function"===e.type&&"var"===e.value}function A(e){return e&&"div"===e.type&&"/"===e.value}function q(e){if(!N(e[0]))return null;if(!N(e[1]))return null;if(!function(e){if(!e||"word"!==e.type)return!1;if(!D(e))return!1;const n=u.default.unit(e.value);return!(!n||!n.number||"deg"!==n.unit&&"grad"!==n.unit&&"rad"!==n.unit&&"turn"!==n.unit&&""!==n.unit)}(e[2]))return null;const n={l:u.default.unit(e[0].value),lNode:e[0],c:u.default.unit(e[1].value),cNode:e[1],h:u.default.unit(e[2].value),hNode:e[2]};return 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()}}(n.h),""!==n.h.unit?null:(A(e[3])&&(n.slash=e[3]),(N(e[4])||S(e[4])||O(e[4]))&&(n.alpha=e[4]),!(e.length>3)||n.slash&&n.alpha?("%"===n.l.unit&&(n.l.unit="",n.l.number=(parseFloat(n.l.number)/100).toFixed(10)),"%"===n.c.unit&&(n.c.unit="",n.c.number=(parseFloat(n.c.number)/100*.4).toFixed(10)),n):null)}function B(e){if(!N(e[0]))return null;if(!N(e[1]))return null;if(!N(e[2]))return null;const n={l:u.default.unit(e[0].value),lNode:e[0],a:u.default.unit(e[1].value),aNode:e[1],b:u.default.unit(e[2].value),bNode:e[2]};return A(e[3])&&(n.slash=e[3]),(N(e[4])||S(e[4])||O(e[4]))&&(n.alpha=e[4]),!(e.length>3)||n.slash&&n.alpha?("%"===n.l.unit&&(n.l.unit="",n.l.number=(parseFloat(n.l.number)/100).toFixed(10)),"%"===n.a.unit&&(n.a.unit="",n.a.number=(parseFloat(n.a.number)/100*.4).toFixed(10)),"%"===n.b.unit&&(n.b.unit="",n.b.number=(parseFloat(n.b.number)/100*.4).toFixed(10)),n):null}function E(e){return void 0!==e.a}function j(e){return E(e)?[e.lNode,e.aNode,e.bNode]:[e.lNode,e.cNode,e.hNode]}function C(e){return E(e)?[e.l,e.a,e.b]:[e.l,e.c,e.h]}function $(e,n,t){const r=e.indexOf(n);e[r]=t}function D(e){if(!e||!e.value)return!1;try{return!1!==u.default.unit(e.value)}catch(e){return!1}}function G(e,n,t,r){let a;try{a=u.default(e)}catch(r){n.warn(t,`Failed to parse value '${e}' as an oklab or oklch function. Leaving the original value intact.`)}if(void 0===a)return;a.walk((e=>{e.type&&"function"===e.type&&("oklab"!==e.value&&"oklch"!==e.value||I(e))}));const o=String(a);if(o===e)return;const i=u.default(e);i.walk((e=>{e.type&&"function"===e.type&&("oklab"!==e.value&&"oklch"!==e.value||function(e,n,t,r){const a=u.default.stringify(e),o=e.value,i=e.nodes.slice().filter((e=>"comment"!==e.type&&"space"!==e.type));let l=null;if("oklab"===o?l=B(i):"oklch"===o&&(l=q(i)),!l)return;if(i.length>3&&(!l.slash||!l.alpha))return;e.value="color";const[s,c,f]=j(l),[p,d,b]=C(l),v="oklab"===o?M:k,m=[p.number,d.number,b.number].map((e=>parseFloat(e))),[h,y]=v(m);!y&&r&&n.warn(t,`"${a}" is out of gamut for "display-p3". Given "preserve: true" is set, this will lead to unexpected results in some browsers.`),e.nodes.splice(0,0,{sourceIndex:0,sourceEndIndex:10,value:"display-p3",type:"word"}),e.nodes.splice(1,0,{sourceIndex:0,sourceEndIndex:1,value:" ",type:"space"}),$(e.nodes,s,{...s,value:h[0].toFixed(5)}),$(e.nodes,c,{...c,value:h[1].toFixed(5)}),$(e.nodes,f,{...f,value:h[2].toFixed(5)})}(e,n,t,r))}));return{rgb:o,displayP3:String(i)}}const L=e=>({postcssPlugin:"postcss-oklab-function",Declaration:(n,{result:t})=>{if(function(e){const n=e.parent;if(!n)return!1;const t=n.index(e);for(let r=0;r<t;r++){const t=n.nodes[r];if("decl"===t.type&&t.prop===e.prop)return!0}return!1}(n))return;if(function(e){let n=e.parent;for(;n;)if("atrule"===n.type){if("supports"===n.name){if(-1!==n.params.indexOf("oklab("))return!0;if(-1!==n.params.indexOf("oklch("))return!0}n=n.parent}else n=n.parent;return!1}(n))return;const r=n.value;if(!/(^|[^\w-])(oklab|oklch)\(/i.test(r))return;const u=G(r,n,t,e.preserve);void 0!==u&&(e.preserve?(n.cloneBefore({value:u.rgb}),e.subFeatures.displayP3&&n.cloneBefore({value:u.displayP3})):(n.cloneBefore({value:u.rgb}),e.subFeatures.displayP3&&n.cloneBefore({value:u.displayP3}),n.remove()))}});L.postcss=!0;const z=e=>{const n=Object.assign({enableProgressiveCustomProperties:!0,preserve:!1,subFeatures:{displayP3:!0}},e);return n.subFeatures=Object.assign({displayP3:!0},n.subFeatures),n.enableProgressiveCustomProperties&&(n.preserve||n.subFeatures.displayP3)?{postcssPlugin:"postcss-oklab-function",plugins:[r.default(),L(n)]}:L(n)};z.postcss=!0,module.exports=z;
|
package/dist/index.mjs
CHANGED
|
@@ -19,7 +19,7 @@ function t(e,n){const t=e.length;let r,u;r=Array.isArray(e[0])?e:[e],Array.isArr
|
|
|
19
19
|
* @copyright This software or document includes material copied from or derived from https://github.com/w3c/csswg-drafts/blob/main/css-color-4/conversions.js. Copyright © 2022 W3C® (MIT, ERCIM, Keio, Beihang).
|
|
20
20
|
*
|
|
21
21
|
* @see https://github.com/w3c/csswg-drafts/blob/main/css-color-4/conversions.js
|
|
22
|
-
*/function r(e){return e.map((function(e){const n=e<0?-1:1,t=Math.abs(e);return t<.04045?e/12.92:n*Math.pow((t+.055)/1.055,2.4)}))}function u(e){return e.map((function(e){const n=e<0?-1:1,t=Math.abs(e);return t>.0031308?n*(1.055*Math.pow(t,1/2.4)-.055):12.92*e}))}function o(e){return t([[.41239079926595934,.357584339383878,.1804807884018343],[.21263900587151027,.715168678767756,.07219231536073371],[.01933081871559182,.11919477979462598,.9505321522496607]],e)}function a(e){return t([[3.2409699419045226,-1.537383177570094,-.4986107602930034],[-.9692436362808796,1.8759675015077202,.04155505740717559],[.05563007969699366,-.20397695888897652,1.0569715142428786]],e)}function i(e){return r(e)}function s(e){return u(e)}function l(e){return t([[.4865709486482162,.26566769316909306,.1982172852343625],[.2289745640697488,.6917385218365064,.079286914093745],[0,.04511338185890264,1.043944368900976]],e)}function c(e){return t([[2.493496911941425,-.9313836179191239,-.40271078445071684],[-.8294889695615747,1.7626640603183463,.023624685841943577],[.03584583024378447,-.07617238926804182,.9568845240076872]],e)}function
|
|
22
|
+
*/function r(e){return e.map((function(e){const n=e<0?-1:1,t=Math.abs(e);return t<.04045?e/12.92:n*Math.pow((t+.055)/1.055,2.4)}))}function u(e){return e.map((function(e){const n=e<0?-1:1,t=Math.abs(e);return t>.0031308?n*(1.055*Math.pow(t,1/2.4)-.055):12.92*e}))}function o(e){return t([[.41239079926595934,.357584339383878,.1804807884018343],[.21263900587151027,.715168678767756,.07219231536073371],[.01933081871559182,.11919477979462598,.9505321522496607]],e)}function a(e){return t([[3.2409699419045226,-1.537383177570094,-.4986107602930034],[-.9692436362808796,1.8759675015077202,.04155505740717559],[.05563007969699366,-.20397695888897652,1.0569715142428786]],e)}function i(e){return r(e)}function s(e){return u(e)}function l(e){return t([[.4865709486482162,.26566769316909306,.1982172852343625],[.2289745640697488,.6917385218365064,.079286914093745],[0,.04511338185890264,1.043944368900976]],e)}function c(e){return t([[2.493496911941425,-.9313836179191239,-.40271078445071684],[-.8294889695615747,1.7626640603183463,.023624685841943577],[.03584583024378447,-.07617238926804182,.9568845240076872]],e)}function p(e){const n=t([[.8190224432164319,.3619062562801221,-.12887378261216414],[.0329836671980271,.9292868468965546,.03614466816999844],[.048177199566046255,.26423952494422764,.6335478258136937]],e);return t([[.2104542553,.793617785,-.0040720468],[1.9779984951,-2.428592205,.4505937099],[.0259040371,.7827717662,-.808675766]],n.map((e=>Math.cbrt(e))))}function f(e){const n=t([[.9999999984505198,.39633779217376786,.2158037580607588],[1.0000000088817609,-.10556134232365635,-.06385417477170591],[1.0000000546724108,-.08948418209496575,-1.2914855378640917]],e);return t([[1.2268798733741557,-.5578149965554813,.28139105017721583],[-.04057576262431372,1.1122868293970594,-.07171106666151701],[-.07637294974672142,-.4214933239627914,1.5869240244272418]],n.map((e=>e**3)))}function d(e){const n=180*Math.atan2(e[2],e[1])/Math.PI;return[e[0],Math.sqrt(e[1]**2+e[2]**2),n>=0?n:n+360]}function b(e){return[e[0],e[1]*Math.cos(e[2]*Math.PI/180),e[1]*Math.sin(e[2]*Math.PI/180)]}
|
|
23
23
|
/**
|
|
24
24
|
* @license W3C
|
|
25
25
|
* https://www.w3.org/Consortium/Legal/2015/copyright-software-and-document
|
|
@@ -27,4 +27,4 @@ function t(e,n){const t=e.length;let r,u;r=Array.isArray(e[0])?e:[e],Array.isArr
|
|
|
27
27
|
* @copyright This software or document includes material copied from or derived from https://github.com/w3c/csswg-drafts/blob/main/css-color-4/deltaEOK.js. Copyright © 2022 W3C® (MIT, ERCIM, Keio, Beihang).
|
|
28
28
|
*
|
|
29
29
|
* @see https://github.com/w3c/csswg-drafts/blob/main/css-color-4/deltaEOK.js
|
|
30
|
-
*/function m(e,n){const[t,r,u]=e,[o,a,i]=n,s=t-o,l=r-a,c=u-i;return Math.sqrt(s**2+l**2+c**2)}function
|
|
30
|
+
*/function m(e,n){const[t,r,u]=e,[o,a,i]=n,s=t-o,l=r-a,c=u-i;return Math.sqrt(s**2+l**2+c**2)}function v(e,n,t){return function(e,n,t){let r=0,u=e[1];const o=e;for(;u-r>1e-4;){const e=h(n(o));m(b(o),b(t(e)))-.02<1e-4?r=o[1]:u=o[1],o[1]=(u+r)/2}return h(n([...o]))}(e,n,t)}function h(e){return e.map((e=>e<0?0:e>1?1:e))}function y(e){const[n,t,r]=e;return n>=-1e-4&&n<=1.0001&&t>=-1e-4&&t<=1.0001&&r>=-1e-4&&r<=1.0001}function g(e){const[n,t,r]=e;let u=[Math.max(n,0),t,r],o=d(u);return o[0]<1e-6&&(o=[0,0,0]),o[0]>.999999&&(o=[1,0,0]),u=f(u),u=c(u),u=s(u),y(u)?[h(u),!0]:[v(o,(e=>s(e=c(e=f(e=b(e))))),(e=>d(e=p(e=l(e=i(e)))))),!1]}function x(e){const[n,t,r]=e,u=[Math.max(n,0),t,r%360];let o=u;return o[0]<1e-6&&(o=[0,0,0]),o[0]>.999999&&(o=[1,0,0]),o=b(o),o=f(o),o=c(o),o=s(o),y(o)?[h(o),!0]:[v(u,(e=>s(e=c(e=f(e=b(e))))),(e=>d(e=p(e=l(e=i(e)))))),!1]}function F(e){const[n,t,i]=e;let s=[Math.max(n,0),t,i],l=d(s);return l[0]<1e-6&&(l=[0,0,0]),l[0]>.999999&&(l=[1,0,0]),s=f(s),s=a(s),s=u(s),y(s)?h(s).map((e=>Math.round(255*e))):v(l,(e=>u(e=a(e=f(e=b(e))))),(e=>d(e=p(e=o(e=r(e)))))).map((e=>Math.round(255*e)))}function M(e){const[n,t,i]=e,s=[Math.max(n,0),t,i%360];let l=s;return l[0]<1e-6&&(l=[0,0,0]),l[0]>.999999&&(l=[1,0,0]),l=b(l),l=f(l),l=a(l),l=u(l),y(l)?h(l).map((e=>Math.round(255*e))):v(s,(e=>u(e=a(e=f(e=b(e))))),(e=>d(e=p(e=o(e=r(e)))))).map((e=>Math.round(255*e)))}function k(e){const t=e.value,r=e.nodes.slice().filter((e=>"comment"!==e.type&&"space"!==e.type));let u=null;if("oklab"===t?u=O(r):"oklch"===t&&(u=S(r)),!u)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(!q(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))}(e,u.slash,u.alpha);const[o,a,i]=B(u),[s,l,c]=E(u),p=("oklab"===t?F:M)([s.number,l.number,c.number].map((e=>parseFloat(e))));e.nodes.splice(e.nodes.indexOf(o)+1,0,{sourceIndex:0,sourceEndIndex:1,value:",",type:"div",before:"",after:""}),e.nodes.splice(e.nodes.indexOf(a)+1,0,{sourceIndex:0,sourceEndIndex:1,value:",",type:"div",before:"",after:""}),j(e.nodes,o,{...o,value:String(p[0])}),j(e.nodes,a,{...a,value:String(p[1])}),j(e.nodes,i,{...i,value:String(p[2])})}function P(e){if(!e||"word"!==e.type)return!1;if(!q(e))return!1;const t=n.unit(e.value);return!!t&&("%"===t.unit||""===t.unit)}function w(e){return e&&"function"===e.type&&"calc"===e.value}function I(e){return e&&"function"===e.type&&"var"===e.value}function N(e){return e&&"div"===e.type&&"/"===e.value}function S(e){if(!P(e[0]))return null;if(!P(e[1]))return null;if(!function(e){if(!e||"word"!==e.type)return!1;if(!q(e))return!1;const t=n.unit(e.value);return!(!t||!t.number||"deg"!==t.unit&&"grad"!==t.unit&&"rad"!==t.unit&&"turn"!==t.unit&&""!==t.unit)}(e[2]))return null;const t={l:n.unit(e[0].value),lNode:e[0],c:n.unit(e[1].value),cNode:e[1],h:n.unit(e[2].value),hNode:e[2]};return 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?null:(N(e[3])&&(t.slash=e[3]),(P(e[4])||w(e[4])||I(e[4]))&&(t.alpha=e[4]),!(e.length>3)||t.slash&&t.alpha?("%"===t.l.unit&&(t.l.unit="",t.l.number=(parseFloat(t.l.number)/100).toFixed(10)),"%"===t.c.unit&&(t.c.unit="",t.c.number=(parseFloat(t.c.number)/100*.4).toFixed(10)),t):null)}function O(e){if(!P(e[0]))return null;if(!P(e[1]))return null;if(!P(e[2]))return null;const t={l:n.unit(e[0].value),lNode:e[0],a:n.unit(e[1].value),aNode:e[1],b:n.unit(e[2].value),bNode:e[2]};return N(e[3])&&(t.slash=e[3]),(P(e[4])||w(e[4])||I(e[4]))&&(t.alpha=e[4]),!(e.length>3)||t.slash&&t.alpha?("%"===t.l.unit&&(t.l.unit="",t.l.number=(parseFloat(t.l.number)/100).toFixed(10)),"%"===t.a.unit&&(t.a.unit="",t.a.number=(parseFloat(t.a.number)/100*.4).toFixed(10)),"%"===t.b.unit&&(t.b.unit="",t.b.number=(parseFloat(t.b.number)/100*.4).toFixed(10)),t):null}function A(e){return void 0!==e.a}function B(e){return A(e)?[e.lNode,e.aNode,e.bNode]:[e.lNode,e.cNode,e.hNode]}function E(e){return A(e)?[e.l,e.a,e.b]:[e.l,e.c,e.h]}function j(e,n,t){const r=e.indexOf(n);e[r]=t}function q(e){if(!e||!e.value)return!1;try{return!1!==n.unit(e.value)}catch(e){return!1}}function C(e,t,r,u){let o;try{o=n(e)}catch(n){t.warn(r,`Failed to parse value '${e}' as an oklab or oklch function. Leaving the original value intact.`)}if(void 0===o)return;o.walk((e=>{e.type&&"function"===e.type&&("oklab"!==e.value&&"oklch"!==e.value||k(e))}));const a=String(o);if(a===e)return;const i=n(e);i.walk((e=>{e.type&&"function"===e.type&&("oklab"!==e.value&&"oklch"!==e.value||function(e,t,r,u){const o=n.stringify(e),a=e.value,i=e.nodes.slice().filter((e=>"comment"!==e.type&&"space"!==e.type));let s=null;if("oklab"===a?s=O(i):"oklch"===a&&(s=S(i)),!s)return;if(i.length>3&&(!s.slash||!s.alpha))return;e.value="color";const[l,c,p]=B(s),[f,d,b]=E(s),m="oklab"===a?g:x,v=[f.number,d.number,b.number].map((e=>parseFloat(e))),[h,y]=m(v);!y&&u&&t.warn(r,`"${o}" is out of gamut for "display-p3". Given "preserve: true" is set, this will lead to unexpected results in some browsers.`),e.nodes.splice(0,0,{sourceIndex:0,sourceEndIndex:10,value:"display-p3",type:"word"}),e.nodes.splice(1,0,{sourceIndex:0,sourceEndIndex:1,value:" ",type:"space"}),j(e.nodes,l,{...l,value:h[0].toFixed(5)}),j(e.nodes,c,{...c,value:h[1].toFixed(5)}),j(e.nodes,p,{...p,value:h[2].toFixed(5)})}(e,t,r,u))}));return{rgb:a,displayP3:String(i)}}const $=e=>({postcssPlugin:"postcss-oklab-function",Declaration:(n,{result:t})=>{if(function(e){const n=e.parent;if(!n)return!1;const t=n.index(e);for(let r=0;r<t;r++){const t=n.nodes[r];if("decl"===t.type&&t.prop===e.prop)return!0}return!1}(n))return;if(function(e){let n=e.parent;for(;n;)if("atrule"===n.type){if("supports"===n.name){if(-1!==n.params.indexOf("oklab("))return!0;if(-1!==n.params.indexOf("oklch("))return!0}n=n.parent}else n=n.parent;return!1}(n))return;const r=n.value;if(!/(^|[^\w-])(oklab|oklch)\(/i.test(r))return;const u=C(r,n,t,e.preserve);void 0!==u&&(e.preserve?(n.cloneBefore({value:u.rgb}),e.subFeatures.displayP3&&n.cloneBefore({value:u.displayP3})):(n.cloneBefore({value:u.rgb}),e.subFeatures.displayP3&&n.cloneBefore({value:u.displayP3}),n.remove()))}});$.postcss=!0;const D=n=>{const t=Object.assign({enableProgressiveCustomProperties:!0,preserve:!1,subFeatures:{displayP3:!0}},n);return t.subFeatures=Object.assign({displayP3:!0},t.subFeatures),t.enableProgressiveCustomProperties&&(t.preserve||t.subFeatures.displayP3)?{postcssPlugin:"postcss-oklab-function",plugins:[e(),$(t)]}:$(t)};D.postcss=!0;export{D as default};
|
package/package.json
CHANGED
|
@@ -1,65 +1,75 @@
|
|
|
1
1
|
{
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
2
|
+
"name": "@csstools/postcss-oklab-function",
|
|
3
|
+
"description": "Use oklab() and oklch() color functions in CSS",
|
|
4
|
+
"version": "1.1.0",
|
|
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
|
+
"LICENSE.md",
|
|
27
|
+
"README.md",
|
|
28
|
+
"dist"
|
|
29
|
+
],
|
|
30
|
+
"dependencies": {
|
|
31
|
+
"@csstools/postcss-progressive-custom-properties": "^1.1.0",
|
|
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-oklab-function#readme",
|
|
50
|
+
"repository": {
|
|
51
|
+
"type": "git",
|
|
52
|
+
"url": "https://github.com/csstools/postcss-plugins.git",
|
|
53
|
+
"directory": "plugins/postcss-oklab-function"
|
|
54
|
+
},
|
|
55
|
+
"bugs": "https://github.com/csstools/postcss-plugins/issues",
|
|
56
|
+
"keywords": [
|
|
57
|
+
"color",
|
|
58
|
+
"colors",
|
|
59
|
+
"css",
|
|
60
|
+
"design",
|
|
61
|
+
"display-p3",
|
|
62
|
+
"oklab",
|
|
63
|
+
"oklch",
|
|
64
|
+
"postcss",
|
|
65
|
+
"postcss-plugin",
|
|
66
|
+
"syntax"
|
|
67
|
+
],
|
|
68
|
+
"csstools": {
|
|
69
|
+
"exportName": "postcssOKLabFunction",
|
|
70
|
+
"humanReadableName": "PostCSS OKLab Function"
|
|
71
|
+
},
|
|
72
|
+
"volta": {
|
|
73
|
+
"extends": "../../package.json"
|
|
74
|
+
}
|
|
65
75
|
}
|