@apdesign/code-style-react 1.0.7 → 1.0.8
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/package.json
CHANGED
|
@@ -6,8 +6,7 @@ const messages = stylelint.utils.ruleMessages(ruleName, {
|
|
|
6
6
|
expected: (val) => `Expected color "${val}" to be a color variable`,
|
|
7
7
|
});
|
|
8
8
|
|
|
9
|
-
|
|
10
|
-
const defaultCssColorKeywords = [
|
|
9
|
+
const cssColorKeywords = [
|
|
11
10
|
'red',
|
|
12
11
|
'blue',
|
|
13
12
|
'green',
|
|
@@ -31,67 +30,31 @@ const defaultCssColorKeywords = [
|
|
|
31
30
|
'magenta',
|
|
32
31
|
'gold',
|
|
33
32
|
'azure',
|
|
33
|
+
'transparent',
|
|
34
|
+
'currentColor',
|
|
34
35
|
];
|
|
35
36
|
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
'
|
|
39
|
-
|
|
40
|
-
'background-color',
|
|
41
|
-
'border',
|
|
42
|
-
'border-color',
|
|
43
|
-
'border-top-color',
|
|
44
|
-
'border-right-color',
|
|
45
|
-
'border-bottom-color',
|
|
46
|
-
'border-left-color',
|
|
47
|
-
'outline',
|
|
48
|
-
'outline-color',
|
|
49
|
-
'text-decoration-color',
|
|
50
|
-
'box-shadow',
|
|
51
|
-
'text-shadow',
|
|
52
|
-
'column-rule-color',
|
|
53
|
-
'caret-color',
|
|
54
|
-
'fill',
|
|
55
|
-
'stroke',
|
|
56
|
-
'stop-color',
|
|
57
|
-
];
|
|
37
|
+
const colorWordRegex = new RegExp(
|
|
38
|
+
`^(#(?:[0-9a-fA-F]{3,8})|(?:${cssColorKeywords.join('|')}))$`,
|
|
39
|
+
'i',
|
|
40
|
+
);
|
|
58
41
|
|
|
59
|
-
const
|
|
42
|
+
const isColorWord = (node) => node.type === 'word' && colorWordRegex.test(node.value);
|
|
43
|
+
const isHardcodedFunctionColor = (node) =>
|
|
44
|
+
node.type === 'function' && /^(rgb|rgba|hsl|hsla|lab|lch)$/i.test(node.value);
|
|
45
|
+
const containsVar = (node) => {
|
|
60
46
|
if (node.type === 'function' && node.value === 'var') return true;
|
|
47
|
+
if (node.type === 'word' && (node.value.startsWith('@') || node.value.startsWith('$')))
|
|
48
|
+
return true;
|
|
61
49
|
if (node.nodes && node.nodes.length) {
|
|
62
|
-
return node.nodes.some(
|
|
50
|
+
return node.nodes.some(containsVar);
|
|
63
51
|
}
|
|
64
52
|
return false;
|
|
65
53
|
};
|
|
66
54
|
|
|
67
55
|
module.exports = stylelint.createPlugin(ruleName, (primaryOption, secondaryOptions = {}) => {
|
|
68
|
-
// 合并自定义颜色关键字和默认颜色关键字（去重）
|
|
69
|
-
const cssColorKeywords = Array.from(
|
|
70
|
-
new Set([...(secondaryOptions.cssColorKeywords || []), ...defaultCssColorKeywords]),
|
|
71
|
-
);
|
|
72
|
-
|
|
73
|
-
// 生成颜色匹配正则
|
|
74
|
-
const colorWordRegex = new RegExp(
|
|
75
|
-
`^(#(?:[0-9a-fA-F]{3,8})|(?:${cssColorKeywords.join('|')}))$`,
|
|
76
|
-
'i',
|
|
77
|
-
);
|
|
78
|
-
|
|
79
|
-
// 判断是否为硬编码颜色文字，如 #fff 或 red
|
|
80
|
-
const isColorWord = (node) => node.type === 'word' && colorWordRegex.test(node.value);
|
|
81
|
-
|
|
82
|
-
// 判断是否为硬编码颜色函数，如 rgb(), hsl() 等
|
|
83
|
-
const isHardcodedFunctionColor = (node) =>
|
|
84
|
-
node.type === 'function' && /^(rgb|rgba|hsl|hsla|lab|lch)$/i.test(node.value);
|
|
85
|
-
|
|
86
|
-
// 合并自定义属性和默认属性（去重）
|
|
87
|
-
const propsToCheck = Array.from(
|
|
88
|
-
new Set([...(secondaryOptions.properties || []), ...defaultPropsToCheck]),
|
|
89
|
-
);
|
|
90
|
-
|
|
91
56
|
return (root, result) => {
|
|
92
57
|
root.walkDecls((decl) => {
|
|
93
|
-
if (!propsToCheck.includes(decl.prop)) return;
|
|
94
|
-
|
|
95
58
|
let parsedValue;
|
|
96
59
|
try {
|
|
97
60
|
parsedValue = valueParser(decl.value);
|
|
@@ -101,7 +64,7 @@ module.exports = stylelint.createPlugin(ruleName, (primaryOption, secondaryOptio
|
|
|
101
64
|
|
|
102
65
|
parsedValue.walk((node) => {
|
|
103
66
|
const nodeStr = valueParser.stringify(node);
|
|
104
|
-
if (
|
|
67
|
+
if (containsVar(node)) return; // 跳过包含 var() 的
|
|
105
68
|
|
|
106
69
|
if (isColorWord(node) || isHardcodedFunctionColor(node)) {
|
|
107
70
|
stylelint.utils.report({
|