Skip to content

Commit 661fcb9

Browse files
committed
feat!: migrate build packages to postcss v8
1 parent 45cba30 commit 661fcb9

File tree

27 files changed

+919
-843
lines changed

27 files changed

+919
-843
lines changed

.storybook/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -44,7 +44,7 @@
4444
"file-loader": "6.2.0",
4545
"lit": "^3.1.1",
4646
"lodash-es": "^4.17.21",
47-
"postcss": "^7.0.36",
47+
"postcss": "^8.4.33",
4848
"postcss-class-prefix": "^0.3.0",
4949
"postcss-loader": "^4.0.0",
5050
"postcss-prefix-selector": "^1.16.0",
Lines changed: 33 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,37 @@
1-
const postcss = require("postcss");
1+
/*!
2+
Copyright 2023 Adobe. All rights reserved.
3+
This file is licensed to you under the Apache License, Version 2.0 (the "License");
4+
you may not use this file except in compliance with the License. You may obtain a copy
5+
of the License at http://www.apache.org/licenses/LICENSE-2.0
26
3-
function dropDupes(root, variableList) {
4-
root.walkRules((rule, ruleIndex) => {
5-
let seen = {};
6-
rule.walkDecls((decl) => {
7-
if (decl.prop.startsWith("--")) {
8-
if (seen[decl.prop]) {
9-
seen[decl.prop].remove();
10-
}
7+
Unless required by applicable law or agreed to in writing, software distributed under
8+
the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
9+
OF ANY KIND, either express or implied. See the License for the specific language
10+
governing permissions and limitations under the License.
11+
*/
1112

12-
seen[decl.prop] = decl;
13-
}
14-
});
15-
});
16-
}
13+
/**
14+
* @typedef Options
15+
*/
1716

18-
module.exports = postcss.plugin("legacy-postcss-dropdupedvars", function () {
19-
return (root, result) => {
20-
dropDupes(root);
17+
/** @type import('postcss').PluginCreator<Options> */
18+
module.exports = () => {
19+
return {
20+
postcssPlugin: "legacy-postcss-dropdupedvars",
21+
OnceExit(root) {
22+
root.walkRules((rule) => {
23+
const seen = {};
24+
25+
rule.walkDecls(/^--/, (decl) => {
26+
if (seen[decl.prop]) {
27+
seen[decl.prop].remove();
28+
}
29+
30+
seen[decl.prop] = decl;
31+
});
32+
});
33+
},
2134
};
22-
});
35+
};
36+
37+
module.exports.postcss = true;

plugins/legacy-postcss-dropdupedvars/package.json

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -9,10 +9,11 @@
99
"scripts": {
1010
"test": "ava"
1111
},
12-
"dependencies": {
13-
"postcss": "^7.0.32"
12+
"peerDependencies": {
13+
"postcss": ">=8"
1414
},
1515
"devDependencies": {
16-
"ava": "^5.3.1"
16+
"ava": "^6.1.0",
17+
"postcss": "^8.4.33"
1718
}
1819
}
Lines changed: 59 additions & 63 deletions
Original file line numberDiff line numberDiff line change
@@ -1,94 +1,90 @@
1-
const postcss = require("postcss");
1+
/*!
2+
Copyright 2023 Adobe. All rights reserved.
3+
This file is licensed to you under the Apache License, Version 2.0 (the "License");
4+
you may not use this file except in compliance with the License. You may obtain a copy
5+
of the License at http://www.apache.org/licenses/LICENSE-2.0
6+
7+
Unless required by applicable law or agreed to in writing, software distributed under
8+
the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
9+
OF ANY KIND, either express or implied. See the License for the specific language
10+
governing permissions and limitations under the License.
11+
*/
12+
13+
/**
14+
* @typedef Options
15+
*/
16+
217
const valueParser = require("postcss-value-parser");
318

4-
function getUsedVars(root) {
5-
const usedAnywhere = [];
6-
const usedInProps = [];
7-
const variableRelationships = {};
19+
/** @type import('postcss').PluginCreator<Options> */
20+
module.exports = () => {
21+
return {
22+
postcssPlugin: "legacy-postcss-dropunusedvars",
23+
OnceExit(root) {
24+
// Find all used variables
25+
const usedAnywhere = [];
26+
const usedInProps = [];
27+
const variableRelationships = {};
28+
29+
root.walkDecls((decl) => {
30+
const usedInDecl = [];
831

9-
root.walkRules((rule, ruleIndex) => {
10-
rule.walkDecls((decl) => {
11-
const usedInDecl = [];
32+
const isVar = decl.prop.startsWith("--");
33+
const matches = decl.value.match(/var\(.*?\)/g);
1234

13-
const isVar = decl.prop.startsWith("--");
14-
const matches = decl.value.match(/var\(.*?\)/g);
15-
if (matches) {
16-
// Parse value and get a list of variables used
17-
const parsed = valueParser(decl.value);
18-
parsed.walk((node) => {
19-
if (node.type === "function" && node.value === "var") {
20-
if (node.nodes.length) {
21-
const varName = node.nodes[0].value;
22-
usedInDecl.push(varName);
23-
usedAnywhere.push(varName);
24-
if (!isVar) {
25-
usedInProps.push(varName);
35+
if (matches) {
36+
// Parse value and get a list of variables used
37+
valueParser(decl.value).walk((node) => {
38+
if (node.type === "function" && node.value === "var") {
39+
if (node.nodes.length) {
40+
const varName = node.nodes[0].value;
41+
usedInDecl.push(varName);
42+
usedAnywhere.push(varName);
43+
if (!isVar) {
44+
usedInProps.push(varName);
45+
}
2646
}
2747
}
28-
}
29-
});
30-
}
48+
});
49+
}
50+
51+
// Store every variable referenced by this var
52+
if (!isVar || !usedInDecl.length) return;
3153

32-
// Store every variable referenced by this var
33-
if (isVar && usedInDecl.length) {
3454
for (let varName of usedInDecl) {
3555
variableRelationships[varName] = variableRelationships[varName] || [];
3656
variableRelationships[varName].push(decl.prop);
3757
}
38-
}
39-
});
40-
});
41-
42-
return {
43-
usedAnywhere,
44-
usedInProps,
45-
variableRelationships,
46-
};
47-
}
58+
});
4859

49-
function dropUnused(
50-
root,
51-
{ usedAnywhere, usedInProps, variableRelationships }
52-
) {
53-
root.walkRules((rule, ruleIndex) => {
54-
rule.walkDecls((decl) => {
55-
if (decl.prop.startsWith("--")) {
60+
// Drop unused variable definitions
61+
root.walkDecls(/^--/, (decl) => {
5662
const varName = decl.prop;
63+
5764
// Definitely drop it if it's never used
5865
if (!usedAnywhere.includes(varName)) {
5966
decl.remove();
6067
} else if (!usedInProps.includes(varName)) {
6168
// Drop a variable if everything that references it has been removed
6269
let relatedVars = variableRelationships[varName];
70+
6371
if (relatedVars && relatedVars.length) {
6472
let keep = false;
73+
6574
// Check if everything that references this variable has been removed
6675
for (let relatedVar of relatedVars) {
6776
if (usedAnywhere.includes(relatedVar)) {
6877
keep = true;
6978
break;
7079
}
7180
}
72-
if (!keep) {
73-
decl.remove();
74-
}
81+
82+
if (!keep) decl.remove();
7583
}
7684
}
77-
}
78-
});
79-
});
80-
}
81-
82-
function process(root) {
83-
// Find all used variables
84-
const variableUsage = getUsedVars(root);
85-
86-
// Drop unused variable definitions
87-
dropUnused(root, variableUsage);
88-
}
89-
90-
module.exports = postcss.plugin("legacy-postcss-dropunusedvars", function () {
91-
return (root, result) => {
92-
process(root);
85+
});
86+
},
9387
};
94-
});
88+
};
89+
90+
module.exports.postcss = true;

plugins/legacy-postcss-dropunusedvars/package.json

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -10,10 +10,13 @@
1010
"test": "ava"
1111
},
1212
"dependencies": {
13-
"postcss": "^7.0.32",
14-
"postcss-value-parser": "^4.1.0"
13+
"postcss-value-parser": "^4.2.0"
14+
},
15+
"peerDependencies": {
16+
"postcss": ">=8"
1517
},
1618
"devDependencies": {
17-
"ava": "^5.3.1"
19+
"ava": "^6.1.0",
20+
"postcss": "^8.4.33"
1821
}
1922
}

plugins/postcss-combininator/index.js

Lines changed: 33 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -10,35 +10,40 @@ OF ANY KIND, either express or implied. See the License for the specific languag
1010
governing permissions and limitations under the License.
1111
*/
1212

13-
const postcss = require("postcss");
13+
/**
14+
* @typedef Options
15+
*/
1416

15-
function process(root, options) {
16-
let rules = [];
17-
let declarations = {};
18-
root.walkRules((rule) => {
19-
rules.push(rule);
20-
rule.walkDecls((decl) => {
21-
if (decl.prop.startsWith("--")) {
22-
declarations[decl.prop] = decl;
23-
decl.remove();
24-
}
25-
});
26-
});
17+
/** @type import('postcss').PluginCreator<Options> */
18+
module.exports = () => {
19+
return {
20+
postcssPlugin: "postcss-combininator",
21+
OnceExit(root) {
22+
const rules = [];
23+
const declarations = {};
2724

28-
let lastRule = rules[rules.length - 1];
29-
if (lastRule) {
30-
rules.forEach((rule, index) => {
31-
if (index !== rules.length - 1) {
32-
rule.remove();
33-
}
34-
});
25+
root.walkRules((rule) => {
26+
rules.push(rule);
27+
rule.walkDecls(/^--/, (decl) => {
28+
declarations[decl.prop] = decl;
29+
decl.remove();
30+
});
31+
});
3532

36-
for (let decl of Object.values(declarations)) {
37-
lastRule.append(decl);
38-
}
39-
}
40-
}
33+
const lastRule = rules[rules.length - 1];
34+
if (lastRule) {
35+
rules.forEach((rule, index) => {
36+
if (index !== rules.length - 1) {
37+
rule.remove();
38+
}
39+
});
40+
41+
for (const decl of Object.values(declarations)) {
42+
lastRule.append(decl);
43+
}
44+
}
45+
},
46+
};
47+
};
4148

42-
module.exports = postcss.plugin("postcss-combininator", function (options) {
43-
return (root, result) => process(root, options);
44-
});
49+
module.exports.postcss = true;

plugins/postcss-combininator/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
"test": "ava"
1111
},
1212
"dependencies": {
13-
"postcss": "^7.0.32"
13+
"postcss": "^8.4.33"
1414
},
1515
"publishConfig": {
1616
"access": "public"
Lines changed: 27 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,27 @@
1-
const postcss = require("postcss");
1+
/*!
2+
Copyright 2023 Adobe. All rights reserved.
3+
This file is licensed to you under the Apache License, Version 2.0 (the "License");
4+
you may not use this file except in compliance with the License. You may obtain a copy
5+
of the License at http://www.apache.org/licenses/LICENSE-2.0
26
3-
module.exports = postcss.plugin("postcss-dropdupedvars", function () {
4-
return (root) => {
5-
root.walkRules((rule) => {
6-
let seen = {};
7-
rule.walkDecls((decl) => {
8-
if (!decl.prop.startsWith("--")) return;
7+
Unless required by applicable law or agreed to in writing, software distributed under
8+
the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
9+
OF ANY KIND, either express or implied. See the License for the specific language
10+
governing permissions and limitations under the License.
11+
*/
12+
13+
/**
14+
* @typedef Options
15+
*/
16+
17+
/** @type import('postcss').PluginCreator<Options> */
18+
module.exports = () => {
19+
return {
20+
postcssPlugin: "postcss-dropdupedvars",
21+
Rule(rule) {
22+
const seen = {};
23+
24+
rule.walkDecls(/^--/, (decl) => {
925
if (seen[decl.prop]) {
1026
decl.warn(
1127
root.toResult(),
@@ -16,6 +32,8 @@ module.exports = postcss.plugin("postcss-dropdupedvars", function () {
1632

1733
seen[decl.prop] = decl;
1834
});
19-
});
35+
},
2036
};
21-
});
37+
};
38+
39+
module.exports.postcss = true;

plugins/postcss-dropdupedvars/package.json

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -9,10 +9,11 @@
99
"scripts": {
1010
"test": "ava"
1111
},
12-
"dependencies": {
13-
"postcss": "^7.0.32"
12+
"peerDependencies": {
13+
"postcss": ">=8"
1414
},
1515
"devDependencies": {
16-
"ava": "^5.3.1"
16+
"ava": "^6.1.0",
17+
"postcss": "^8.4.33"
1718
}
1819
}

0 commit comments

Comments
 (0)