@csstools/postcss-relative-color-syntax 2.0.7 → 2.0.9
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 +17 -68
- package/README.md +4 -1
- package/dist/index.cjs +1 -1
- package/dist/index.d.ts +5 -1
- package/dist/index.mjs +1 -1
- package/package.json +14 -31
- package/dist/has-fallback-decl.d.ts +0 -2
- package/dist/has-supports-at-rule-ancestor.d.ts +0 -2
package/CHANGELOG.md
CHANGED
|
@@ -1,79 +1,28 @@
|
|
|
1
1
|
# Changes to PostCSS Relative Color Syntax
|
|
2
2
|
|
|
3
|
-
### 2.0.
|
|
4
|
-
|
|
5
|
-
_October 9, 2023_
|
|
6
|
-
|
|
7
|
-
- Updated [`@csstools/css-color-parser`](https://github.com/csstools/postcss-plugins/tree/main/packages/css-color-parser) to [`1.4.0`](https://github.com/csstools/postcss-plugins/tree/main/packages/css-color-parser/CHANGELOG.md#140) (minor)
|
|
8
|
-
- Updated [`@csstools/postcss-progressive-custom-properties`](https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-progressive-custom-properties) to [`3.0.2`](https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-progressive-custom-properties/CHANGELOG.md#302) (patch)
|
|
9
|
-
|
|
10
|
-
### 2.0.6
|
|
11
|
-
|
|
12
|
-
_October 2, 2023_
|
|
13
|
-
|
|
14
|
-
- Updated [`@csstools/css-color-parser`](https://github.com/csstools/postcss-plugins/tree/main/packages/css-color-parser) to [`1.3.3`](https://github.com/csstools/postcss-plugins/tree/main/packages/css-color-parser/CHANGELOG.md#133) (patch)
|
|
15
|
-
|
|
16
|
-
### 2.0.5
|
|
17
|
-
|
|
18
|
-
_September 24, 2023_
|
|
19
|
-
|
|
20
|
-
- Small performance improvements
|
|
21
|
-
- Updated [`@csstools/css-tokenizer`](https://github.com/csstools/postcss-plugins/tree/main/packages/css-tokenizer) to [`2.2.1`](https://github.com/csstools/postcss-plugins/tree/main/packages/css-tokenizer/CHANGELOG.md#221) (patch)
|
|
22
|
-
- Updated [`@csstools/css-parser-algorithms`](https://github.com/csstools/postcss-plugins/tree/main/packages/css-parser-algorithms) to [`2.3.2`](https://github.com/csstools/postcss-plugins/tree/main/packages/css-parser-algorithms/CHANGELOG.md#232) (patch)
|
|
23
|
-
- Updated [`@csstools/css-color-parser`](https://github.com/csstools/postcss-plugins/tree/main/packages/css-color-parser) to [`1.3.2`](https://github.com/csstools/postcss-plugins/tree/main/packages/css-color-parser/CHANGELOG.md#132) (patch)
|
|
24
|
-
|
|
25
|
-
### 2.0.4
|
|
26
|
-
|
|
27
|
-
_September 18, 2023_
|
|
28
|
-
|
|
29
|
-
- Updated [`@csstools/postcss-progressive-custom-properties`](https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-progressive-custom-properties) to [`3.0.1`](https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-progressive-custom-properties/CHANGELOG.md#301) (patch)
|
|
30
|
-
|
|
31
|
-
### 2.0.3
|
|
32
|
-
|
|
33
|
-
_September 2, 2023_
|
|
3
|
+
### 2.0.9
|
|
34
4
|
|
|
35
|
-
|
|
5
|
+
_December 31, 2023_
|
|
36
6
|
|
|
37
|
-
|
|
7
|
+
- Updated [`@csstools/css-tokenizer`](https://github.com/csstools/postcss-plugins/tree/main/packages/css-tokenizer) to [`2.2.3`](https://github.com/csstools/postcss-plugins/tree/main/packages/css-tokenizer/CHANGELOG.md#223) (patch)
|
|
8
|
+
- Updated [`@csstools/css-parser-algorithms`](https://github.com/csstools/postcss-plugins/tree/main/packages/css-parser-algorithms) to [`2.5.0`](https://github.com/csstools/postcss-plugins/tree/main/packages/css-parser-algorithms/CHANGELOG.md#250) (minor)
|
|
9
|
+
- Updated [`@csstools/css-color-parser`](https://github.com/csstools/postcss-plugins/tree/main/packages/css-color-parser) to [`1.5.1`](https://github.com/csstools/postcss-plugins/tree/main/packages/css-color-parser/CHANGELOG.md#151) (patch)
|
|
38
10
|
|
|
39
|
-
|
|
11
|
+
### 2.0.8
|
|
40
12
|
|
|
41
|
-
|
|
13
|
+
_December 15, 2023_
|
|
42
14
|
|
|
43
|
-
|
|
15
|
+
- Skip transforms when a color value contains experimental syntax
|
|
16
|
+
- Updated [`@csstools/css-tokenizer`](https://github.com/csstools/postcss-plugins/tree/main/packages/css-tokenizer) to [`2.2.2`](https://github.com/csstools/postcss-plugins/tree/main/packages/css-tokenizer/CHANGELOG.md#222) (patch)
|
|
17
|
+
- Updated [`@csstools/css-parser-algorithms`](https://github.com/csstools/postcss-plugins/tree/main/packages/css-parser-algorithms) to [`2.4.0`](https://github.com/csstools/postcss-plugins/tree/main/packages/css-parser-algorithms/CHANGELOG.md#240) (minor)
|
|
18
|
+
- Updated [`@csstools/postcss-progressive-custom-properties`](https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-progressive-custom-properties) to [`3.0.3`](https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-progressive-custom-properties/CHANGELOG.md#303) (patch)
|
|
19
|
+
- Updated [`@csstools/css-color-parser`](https://github.com/csstools/postcss-plugins/tree/main/packages/css-color-parser) to [`1.5.0`](https://github.com/csstools/postcss-plugins/tree/main/packages/css-color-parser/CHANGELOG.md#150) (minor)
|
|
44
20
|
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
- Updated [`@csstools/css-tokenizer`](https://github.com/csstools/postcss-plugins/tree/main/packages/css-tokenizer) to [`2.2.0`](https://github.com/csstools/postcss-plugins/tree/main/packages/css-tokenizer/CHANGELOG.md#220) (minor)
|
|
48
|
-
- Updated [`@csstools/css-parser-algorithms`](https://github.com/csstools/postcss-plugins/tree/main/packages/css-parser-algorithms) to [`2.3.1`](https://github.com/csstools/postcss-plugins/tree/main/packages/css-parser-algorithms/CHANGELOG.md#231) (patch)
|
|
49
|
-
|
|
50
|
-
### 2.0.0
|
|
51
|
-
|
|
52
|
-
_July 3, 2023_
|
|
53
|
-
|
|
54
|
-
- Change license to `MIT-0` ([read more about this change in the blog post](https://preset-env.cssdb.org/blog/license-change/))
|
|
55
|
-
- Updated [`@csstools/css-parser-algorithms`](https://github.com/csstools/postcss-plugins/tree/main/packages/css-parser-algorithms) to [`2.3.0`](https://github.com/csstools/postcss-plugins/tree/main/packages/css-parser-algorithms/CHANGELOG.md#230) (minor)
|
|
56
|
-
- Updated [`@csstools/postcss-progressive-custom-properties`](https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-progressive-custom-properties) to [`3.0.0`](https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-progressive-custom-properties/CHANGELOG.md#300) (major)
|
|
57
|
-
- Updated [`@csstools/css-color-parser`](https://github.com/csstools/postcss-plugins/tree/main/packages/css-color-parser) to [`1.2.2`](https://github.com/csstools/postcss-plugins/tree/main/packages/css-color-parser/CHANGELOG.md#122) (patch)
|
|
58
|
-
|
|
59
|
-
### 1.0.2
|
|
60
|
-
|
|
61
|
-
_June 14, 2023_
|
|
62
|
-
|
|
63
|
-
- Fix value calculation for `hue` components in relative color syntax.
|
|
64
|
-
|
|
65
|
-
### 1.0.1
|
|
66
|
-
|
|
67
|
-
_June 1, 2023_
|
|
68
|
-
|
|
69
|
-
- Updated `@csstools/postcss-progressive-custom-properties` to `2.3.0` (minor)
|
|
70
|
-
|
|
71
|
-
### 1.0.0
|
|
72
|
-
|
|
73
|
-
_May 19, 2023_
|
|
21
|
+
### 2.0.7
|
|
74
22
|
|
|
75
|
-
|
|
76
|
-
- Updated `@csstools/postcss-progressive-custom-properties` to `2.2.0` (minor)
|
|
77
|
-
- Updated `@csstools/css-color-parser` to `1.2.0` (minor)
|
|
23
|
+
_October 9, 2023_
|
|
78
24
|
|
|
25
|
+
- Updated [`@csstools/css-color-parser`](https://github.com/csstools/postcss-plugins/tree/main/packages/css-color-parser) to [`1.4.0`](https://github.com/csstools/postcss-plugins/tree/main/packages/css-color-parser/CHANGELOG.md#140) (minor)
|
|
26
|
+
- Updated [`@csstools/postcss-progressive-custom-properties`](https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-progressive-custom-properties) to [`3.0.2`](https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-progressive-custom-properties/CHANGELOG.md#302) (patch)
|
|
79
27
|
|
|
28
|
+
[Full CHANGELOG](https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-relative-color-syntax/CHANGELOG.md)
|
package/README.md
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# PostCSS Relative Color Syntax [<img src="https://postcss.github.io/postcss/logo.svg" alt="PostCSS Logo" width="90" height="90" align="right">][PostCSS]
|
|
2
2
|
|
|
3
|
-
[<img alt="npm version" src="https://img.shields.io/npm/v/@csstools/postcss-relative-color-syntax.svg" height="20">][npm-url] [<img alt="
|
|
3
|
+
[<img alt="npm version" src="https://img.shields.io/npm/v/@csstools/postcss-relative-color-syntax.svg" height="20">][npm-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]<br><br>[<img alt="Baseline Status" src="https://cssdb.org/images/badges-baseline/relative-color-syntax.svg" height="20">][css-url] [<img alt="CSS Standard Status" src="https://cssdb.org/images/badges/relative-color-syntax.svg" height="20">][css-url]
|
|
4
4
|
|
|
5
5
|
```bash
|
|
6
6
|
npm install @csstools/postcss-relative-color-syntax --save-dev
|
|
@@ -20,6 +20,9 @@ npm install @csstools/postcss-relative-color-syntax --save-dev
|
|
|
20
20
|
}
|
|
21
21
|
```
|
|
22
22
|
|
|
23
|
+
> [!NOTE]
|
|
24
|
+
> We can not dynamically resolve `var()` arguments in relative color syntax, only static values will work.
|
|
25
|
+
|
|
23
26
|
## Usage
|
|
24
27
|
|
|
25
28
|
Add [PostCSS Relative Color Syntax] to your project:
|
package/dist/index.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var
|
|
1
|
+
"use strict";var s=require("@csstools/postcss-progressive-custom-properties"),e=require("@csstools/css-tokenizer"),t=require("@csstools/css-color-parser"),r=require("@csstools/css-parser-algorithms");function hasFallback(s){const e=s.parent;if(!e)return!1;const t=s.prop.toLowerCase(),r=e.index(s);for(let s=0;s<r;s++){const r=e.nodes[s];if("decl"===r.type&&r.prop.toLowerCase()===t)return!0}return!1}const o=/(rgb|hsl|hwb|lab|lch|oklch|oklab|color)\(\s*?from/i;function hasSupportsAtRuleAncestor(s){let e=s.parent;for(;e;)if("atrule"===e.type){if("supports"===e.name.toLowerCase()&&o.test(e.params))return!0;e=e.parent}else e=e.parent;return!1}const a=/(rgb|hsl|hwb|lab|lch|oklch|oklab|color)\(/i,l=/^(rgb|hsl|hwb|lab|lch|oklch|oklab|color)$/i,n=/from/i,basePlugin=s=>({postcssPlugin:"postcss-relative-color-syntax",Declaration:o=>{const i=o.value;if(!a.test(i)||!n.test(i))return;if(hasFallback(o))return;if(hasSupportsAtRuleAncestor(o))return;const c=e.tokenize({css:i}),u=r.replaceComponentValues(r.parseCommaSeparatedListOfComponentValues(c),(s=>{if(!r.isFunctionNode(s)||!l.test(s.getName()))return;const e=t.color(s);return e&&!e.syntaxFlags.has(t.SyntaxFlag.Experimental)&&!e.syntaxFlags.has(t.SyntaxFlag.HasNoneKeywords)&&e.syntaxFlags.has(t.SyntaxFlag.RelativeColorSyntax)?t.serializeRGB(e):void 0})),p=r.stringify(u);if(p===i)return;let g=p;s?.subFeatures.displayP3&&(g=r.stringify(r.replaceComponentValues(r.parseCommaSeparatedListOfComponentValues(c),(s=>{if(!r.isFunctionNode(s)||!l.test(s.getName()))return;const e=t.color(s);return e&&!e.syntaxFlags.has(t.SyntaxFlag.Experimental)&&!e.syntaxFlags.has(t.SyntaxFlag.HasNoneKeywords)&&e.syntaxFlags.has(t.SyntaxFlag.RelativeColorSyntax)?t.colorDataFitsRGB_Gamut(e)?t.serializeRGB(e):t.serializeP3(e):void 0})))),o.cloneBefore({value:p}),s?.subFeatures.displayP3&&g!==p&&o.cloneBefore({value:g}),s?.preserve||o.remove()}});basePlugin.postcss=!0;const postcssPlugin=e=>{const t=Object.assign({enableProgressiveCustomProperties:!0,preserve:!1,subFeatures:{displayP3:!0}},e);return t.subFeatures=Object.assign({displayP3:!0},t.subFeatures),t.enableProgressiveCustomProperties&&(t.preserve||t.subFeatures.displayP3)?{postcssPlugin:"postcss-relative-color-syntax",plugins:[s(),basePlugin(t)]}:basePlugin(t)};postcssPlugin.postcss=!0,module.exports=postcssPlugin;
|
package/dist/index.d.ts
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import type { PluginCreator } from 'postcss';
|
|
2
|
+
|
|
2
3
|
/** postcss-relative-color-syntax plugin options */
|
|
3
|
-
export type pluginOptions = {
|
|
4
|
+
export declare type pluginOptions = {
|
|
4
5
|
/** Preserve the original notation. default: false */
|
|
5
6
|
preserve?: boolean;
|
|
6
7
|
/** Enable "@csstools/postcss-progressive-custom-properties". default: true */
|
|
@@ -11,5 +12,8 @@ export type pluginOptions = {
|
|
|
11
12
|
displayP3?: boolean;
|
|
12
13
|
};
|
|
13
14
|
};
|
|
15
|
+
|
|
14
16
|
declare const postcssPlugin: PluginCreator<pluginOptions>;
|
|
15
17
|
export default postcssPlugin;
|
|
18
|
+
|
|
19
|
+
export { }
|
package/dist/index.mjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import s from"@csstools/postcss-progressive-custom-properties";import{tokenize as e}from"@csstools/css-tokenizer";import{color as
|
|
1
|
+
import s from"@csstools/postcss-progressive-custom-properties";import{tokenize as e}from"@csstools/css-tokenizer";import{color as t,SyntaxFlag as r,serializeRGB as o,colorDataFitsRGB_Gamut as a,serializeP3 as l}from"@csstools/css-color-parser";import{replaceComponentValues as n,parseCommaSeparatedListOfComponentValues as c,isFunctionNode as i,stringify as p}from"@csstools/css-parser-algorithms";function hasFallback(s){const e=s.parent;if(!e)return!1;const t=s.prop.toLowerCase(),r=e.index(s);for(let s=0;s<r;s++){const r=e.nodes[s];if("decl"===r.type&&r.prop.toLowerCase()===t)return!0}return!1}const u=/(rgb|hsl|hwb|lab|lch|oklch|oklab|color)\(\s*?from/i;function hasSupportsAtRuleAncestor(s){let e=s.parent;for(;e;)if("atrule"===e.type){if("supports"===e.name.toLowerCase()&&u.test(e.params))return!0;e=e.parent}else e=e.parent;return!1}const b=/(rgb|hsl|hwb|lab|lch|oklch|oklab|color)\(/i,f=/^(rgb|hsl|hwb|lab|lch|oklch|oklab|color)$/i,h=/from/i,basePlugin=s=>({postcssPlugin:"postcss-relative-color-syntax",Declaration:u=>{const m=u.value;if(!b.test(m)||!h.test(m))return;if(hasFallback(u))return;if(hasSupportsAtRuleAncestor(u))return;const g=e({css:m}),y=n(c(g),(s=>{if(!i(s)||!f.test(s.getName()))return;const e=t(s);return e&&!e.syntaxFlags.has(r.Experimental)&&!e.syntaxFlags.has(r.HasNoneKeywords)&&e.syntaxFlags.has(r.RelativeColorSyntax)?o(e):void 0})),v=p(y);if(v===m)return;let x=v;s?.subFeatures.displayP3&&(x=p(n(c(g),(s=>{if(!i(s)||!f.test(s.getName()))return;const e=t(s);return e&&!e.syntaxFlags.has(r.Experimental)&&!e.syntaxFlags.has(r.HasNoneKeywords)&&e.syntaxFlags.has(r.RelativeColorSyntax)?a(e)?o(e):l(e):void 0})))),u.cloneBefore({value:v}),s?.subFeatures.displayP3&&x!==v&&u.cloneBefore({value:x}),s?.preserve||u.remove()}});basePlugin.postcss=!0;const postcssPlugin=e=>{const t=Object.assign({enableProgressiveCustomProperties:!0,preserve:!1,subFeatures:{displayP3:!0}},e);return t.subFeatures=Object.assign({displayP3:!0},t.subFeatures),t.enableProgressiveCustomProperties&&(t.preserve||t.subFeatures.displayP3)?{postcssPlugin:"postcss-relative-color-syntax",plugins:[s(),basePlugin(t)]}:basePlugin(t)};postcssPlugin.postcss=!0;export{postcssPlugin as default};
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@csstools/postcss-relative-color-syntax",
|
|
3
3
|
"description": "Use the relative color syntax in CSS",
|
|
4
|
-
"version": "2.0.
|
|
4
|
+
"version": "2.0.9",
|
|
5
5
|
"contributors": [
|
|
6
6
|
{
|
|
7
7
|
"name": "Antonio Laguna",
|
|
@@ -27,15 +27,18 @@
|
|
|
27
27
|
"engines": {
|
|
28
28
|
"node": "^14 || ^16 || >=18"
|
|
29
29
|
},
|
|
30
|
+
"type": "module",
|
|
30
31
|
"main": "dist/index.cjs",
|
|
31
32
|
"module": "dist/index.mjs",
|
|
32
|
-
"types": "dist/index.d.ts",
|
|
33
33
|
"exports": {
|
|
34
34
|
".": {
|
|
35
|
-
"
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
35
|
+
"import": {
|
|
36
|
+
"types": "./dist/index.d.ts",
|
|
37
|
+
"default": "./dist/index.mjs"
|
|
38
|
+
},
|
|
39
|
+
"require": {
|
|
40
|
+
"default": "./dist/index.cjs"
|
|
41
|
+
}
|
|
39
42
|
}
|
|
40
43
|
},
|
|
41
44
|
"files": [
|
|
@@ -45,25 +48,14 @@
|
|
|
45
48
|
"dist"
|
|
46
49
|
],
|
|
47
50
|
"dependencies": {
|
|
48
|
-
"@csstools/css-color-parser": "^1.
|
|
49
|
-
"@csstools/css-parser-algorithms": "^2.
|
|
50
|
-
"@csstools/css-tokenizer": "^2.2.
|
|
51
|
-
"@csstools/postcss-progressive-custom-properties": "^3.0.
|
|
51
|
+
"@csstools/css-color-parser": "^1.5.1",
|
|
52
|
+
"@csstools/css-parser-algorithms": "^2.5.0",
|
|
53
|
+
"@csstools/css-tokenizer": "^2.2.3",
|
|
54
|
+
"@csstools/postcss-progressive-custom-properties": "^3.0.3"
|
|
52
55
|
},
|
|
53
56
|
"peerDependencies": {
|
|
54
57
|
"postcss": "^8.4"
|
|
55
58
|
},
|
|
56
|
-
"devDependencies": {
|
|
57
|
-
"@csstools/postcss-tape": "*"
|
|
58
|
-
},
|
|
59
|
-
"scripts": {
|
|
60
|
-
"build": "rollup -c ../../rollup/default.mjs",
|
|
61
|
-
"docs": "node ../../.github/bin/generate-docs/install.mjs && node ../../.github/bin/generate-docs/readme.mjs",
|
|
62
|
-
"lint": "node ../../.github/bin/format-package-json.mjs",
|
|
63
|
-
"prepublishOnly": "npm run build && npm run test",
|
|
64
|
-
"test": "node .tape.mjs && node ./test/_import.mjs && node ./test/_require.cjs",
|
|
65
|
-
"test:rewrite-expects": "REWRITE_EXPECTS=true node .tape.mjs"
|
|
66
|
-
},
|
|
67
59
|
"homepage": "https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-relative-color-syntax#readme",
|
|
68
60
|
"repository": {
|
|
69
61
|
"type": "git",
|
|
@@ -75,14 +67,5 @@
|
|
|
75
67
|
"color",
|
|
76
68
|
"postcss-plugin",
|
|
77
69
|
"relative color syntax"
|
|
78
|
-
]
|
|
79
|
-
"csstools": {
|
|
80
|
-
"cssdbId": "relative-color-syntax",
|
|
81
|
-
"exportName": "postcssRelativeColorSyntax",
|
|
82
|
-
"humanReadableName": "PostCSS Relative Color Syntax",
|
|
83
|
-
"specUrl": "https://www.w3.org/TR/css-color-5/#relative-colors"
|
|
84
|
-
},
|
|
85
|
-
"volta": {
|
|
86
|
-
"extends": "../../package.json"
|
|
87
|
-
}
|
|
70
|
+
]
|
|
88
71
|
}
|