@master/eslint-plugin-css 2.0.0-rc.3 → 2.0.0-rc.30
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/README.md +1 -1
- package/dist/create-rule.cjs +8 -0
- package/dist/create-rule.d.ts +3 -0
- package/dist/create-rule.mjs +6 -0
- package/dist/functions/filter-collision-classes.cjs +9 -0
- package/dist/functions/filter-collision-classes.d.ts +3 -0
- package/dist/functions/filter-collision-classes.mjs +11 -0
- package/dist/functions/filter-collision-classes.worker.cjs +35 -0
- package/dist/functions/filter-collision-classes.worker.d.ts +1 -0
- package/dist/functions/filter-collision-classes.worker.mjs +33 -0
- package/dist/functions/get-css.cjs +19 -0
- package/dist/functions/get-css.d.ts +1 -0
- package/dist/functions/get-css.mjs +17 -0
- package/dist/functions/reorder-valid-classes.cjs +9 -0
- package/dist/functions/reorder-valid-classes.d.ts +3 -0
- package/dist/functions/reorder-valid-classes.mjs +11 -0
- package/dist/functions/reorder-valid-classes.worker.cjs +13 -0
- package/dist/functions/reorder-valid-classes.worker.d.ts +1 -0
- package/dist/functions/reorder-valid-classes.worker.mjs +11 -0
- package/dist/functions/validate.cjs +9 -0
- package/dist/functions/validate.d.ts +3 -0
- package/dist/functions/validate.mjs +11 -0
- package/dist/functions/validate.worker.cjs +15 -0
- package/dist/functions/validate.worker.d.ts +5 -0
- package/dist/functions/validate.worker.mjs +13 -0
- package/dist/index.cjs +39 -0
- package/dist/index.d.ts +61 -1
- package/dist/index.mjs +37 -1
- package/dist/plugin.cjs +18 -0
- package/dist/plugin.d.ts +10 -2
- package/dist/plugin.mjs +16 -1
- package/dist/rules/class-collision.cjs +68 -0
- package/dist/rules/class-collision.d.ts +1 -2
- package/dist/rules/class-collision.mjs +66 -1
- package/dist/rules/class-order.cjs +174 -0
- package/dist/rules/class-order.d.ts +1 -2
- package/dist/rules/class-order.mjs +172 -1
- package/dist/rules/class-validation.cjs +70 -0
- package/dist/rules/class-validation.d.ts +1 -2
- package/dist/rules/class-validation.mjs +68 -1
- package/dist/settings-schema.cjs +35 -0
- package/dist/settings-schema.d.ts +3 -0
- package/dist/settings-schema.mjs +33 -0
- package/dist/settings.cjs +16 -0
- package/dist/settings.d.ts +10 -2
- package/dist/settings.mjs +14 -1
- package/dist/utils/define-visitors.cjs +93 -0
- package/dist/utils/define-visitors.d.ts +6 -4
- package/dist/utils/define-visitors.mjs +91 -1
- package/dist/utils/extract-classnames-from-value.cjs +34 -0
- package/dist/utils/extract-classnames-from-value.mjs +32 -1
- package/dist/utils/extract-range-from-node.cjs +18 -0
- package/dist/utils/extract-range-from-node.mjs +16 -1
- package/dist/utils/extract-value-from-node.cjs +23 -0
- package/dist/utils/extract-value-from-node.mjs +21 -1
- package/dist/utils/find-loc.cjs +40 -0
- package/dist/utils/find-loc.mjs +38 -1
- package/dist/utils/get-template-element-body.cjs +12 -0
- package/dist/utils/get-template-element-body.mjs +10 -1
- package/dist/utils/get-template-element-prefix.cjs +11 -0
- package/dist/utils/get-template-element-prefix.mjs +9 -1
- package/dist/utils/get-template-element-suffix.cjs +10 -0
- package/dist/utils/get-template-element-suffix.mjs +8 -1
- package/dist/utils/parse-node-recursive.cjs +130 -0
- package/dist/utils/parse-node-recursive.d.ts +2 -2
- package/dist/utils/parse-node-recursive.mjs +128 -1
- package/dist/utils/resolve-context.cjs +13 -0
- package/dist/utils/resolve-context.d.ts +9 -2
- package/dist/utils/resolve-context.mjs +11 -1
- package/package.json +1 -1
- package/dist/configs/config.d.ts +0 -13
- package/dist/configs/config.js +0 -1
- package/dist/configs/config.mjs +0 -1
- package/dist/configs/flat.d.ts +0 -16
- package/dist/configs/flat.js +0 -1
- package/dist/configs/flat.mjs +0 -1
- package/dist/configs/recommended.d.ts +0 -14
- package/dist/configs/recommended.js +0 -1
- package/dist/configs/recommended.mjs +0 -1
- package/dist/index.js +0 -1
- package/dist/plugin.js +0 -1
- package/dist/rules/class-collision.js +0 -1
- package/dist/rules/class-order.js +0 -1
- package/dist/rules/class-validation.js +0 -1
- package/dist/settings.js +0 -1
- package/dist/utils/are-declarations-equal.d.ts +0 -1
- package/dist/utils/are-declarations-equal.js +0 -1
- package/dist/utils/are-declarations-equal.mjs +0 -1
- package/dist/utils/define-visitors.js +0 -1
- package/dist/utils/extract-classnames-from-value.js +0 -1
- package/dist/utils/extract-range-from-node.js +0 -1
- package/dist/utils/extract-value-from-node.js +0 -1
- package/dist/utils/find-loc.js +0 -1
- package/dist/utils/get-mastercss.d.ts +0 -2
- package/dist/utils/get-mastercss.js +0 -1
- package/dist/utils/get-mastercss.mjs +0 -1
- package/dist/utils/get-template-element-body.js +0 -1
- package/dist/utils/get-template-element-prefix.js +0 -1
- package/dist/utils/get-template-element-suffix.js +0 -1
- package/dist/utils/parse-node-recursive.js +0 -1
- package/dist/utils/reorder-valid-classes-action.d.ts +0 -3
- package/dist/utils/reorder-valid-classes-action.js +0 -1
- package/dist/utils/reorder-valid-classes-action.mjs +0 -1
- package/dist/utils/resolve-context.js +0 -1
- package/dist/utils/valid-rules-action.d.ts +0 -3
- package/dist/utils/valid-rules-action.js +0 -1
- package/dist/utils/valid-rules-action.mjs +0 -1
- package/dist/utils/validate-action.d.ts +0 -3
- package/dist/utils/validate-action.js +0 -1
- package/dist/utils/validate-action.mjs +0 -1
- package/dist/utils/workers/reorder-valid-classes.d.ts +0 -2
- package/dist/utils/workers/reorder-valid-classes.js +0 -1
- package/dist/utils/workers/reorder-valid-classes.mjs +0 -1
- package/dist/utils/workers/valid-rules.d.ts +0 -2
- package/dist/utils/workers/valid-rules.js +0 -1
- package/dist/utils/workers/valid-rules.mjs +0 -1
- package/dist/utils/workers/validate.d.ts +0 -5
- package/dist/utils/workers/validate.js +0 -1
- package/dist/utils/workers/validate.mjs +0 -1
|
@@ -0,0 +1,174 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var defineVisitors = require('../utils/define-visitors.cjs');
|
|
4
|
+
var resolveContext = require('../utils/resolve-context.cjs');
|
|
5
|
+
var getTemplateElementBody = require('../utils/get-template-element-body.cjs');
|
|
6
|
+
var getTemplateElementSuffix = require('../utils/get-template-element-suffix.cjs');
|
|
7
|
+
var getTemplateElementPrefix = require('../utils/get-template-element-prefix.cjs');
|
|
8
|
+
var extractValueFromNode = require('../utils/extract-value-from-node.cjs');
|
|
9
|
+
var extractRangeFromNode = require('../utils/extract-range-from-node.cjs');
|
|
10
|
+
var extractClassnamesFromValue = require('../utils/extract-classnames-from-value.cjs');
|
|
11
|
+
var findLoc = require('../utils/find-loc.cjs');
|
|
12
|
+
var reorderValidClasses = require('../functions/reorder-valid-classes.cjs');
|
|
13
|
+
var createRule = require('../create-rule.cjs');
|
|
14
|
+
var settingsSchema = require('../settings-schema.cjs');
|
|
15
|
+
|
|
16
|
+
var classOrder = createRule({
|
|
17
|
+
name: 'consistent-class-order',
|
|
18
|
+
meta: {
|
|
19
|
+
type: 'layout',
|
|
20
|
+
fixable: 'code',
|
|
21
|
+
docs: {
|
|
22
|
+
description: 'Enforce a consistent and logical order of classes',
|
|
23
|
+
recommended: 'recommended'
|
|
24
|
+
},
|
|
25
|
+
messages: {
|
|
26
|
+
invalidClassOrder: 'No consistent class order followed.'
|
|
27
|
+
},
|
|
28
|
+
schema: [
|
|
29
|
+
settingsSchema
|
|
30
|
+
]
|
|
31
|
+
},
|
|
32
|
+
defaultOptions: [],
|
|
33
|
+
create: function(context) {
|
|
34
|
+
const { options, settings } = resolveContext(context);
|
|
35
|
+
const sourceCode = context.sourceCode;
|
|
36
|
+
const visitNode = (node, arg = null)=>{
|
|
37
|
+
let originalClassNamesValue = null;
|
|
38
|
+
let start = null;
|
|
39
|
+
let end = null;
|
|
40
|
+
let prefix = '';
|
|
41
|
+
let suffix = '';
|
|
42
|
+
let expStrings = [];
|
|
43
|
+
if (arg === null) {
|
|
44
|
+
originalClassNamesValue = extractValueFromNode(node);
|
|
45
|
+
const range = extractRangeFromNode(node);
|
|
46
|
+
if (node.type === 'TextAttribute') {
|
|
47
|
+
start = range[0];
|
|
48
|
+
end = range[1];
|
|
49
|
+
} else {
|
|
50
|
+
start = range[0] + 1;
|
|
51
|
+
end = range[1] - 1;
|
|
52
|
+
}
|
|
53
|
+
} else {
|
|
54
|
+
switch(arg.type){
|
|
55
|
+
case 'Identifier':
|
|
56
|
+
return;
|
|
57
|
+
case 'TemplateLiteral':
|
|
58
|
+
arg.expressions.forEach((exp)=>{
|
|
59
|
+
visitNode(node, exp);
|
|
60
|
+
});
|
|
61
|
+
originalClassNamesValue = sourceCode.getText(arg);
|
|
62
|
+
originalClassNamesValue = originalClassNamesValue.substring(1, originalClassNamesValue.length - 1);
|
|
63
|
+
expStrings = originalClassNamesValue.match(/\$\{(?:(?<!\\\\)(['"`]).*?(?<!\\\\)\1|[^}])*?\}/g) ?? [];
|
|
64
|
+
for(let i = 0; i < expStrings.length; i++){
|
|
65
|
+
originalClassNamesValue = originalClassNamesValue.replace(expStrings[i], `EXPRESSION_STRING_NUM_${i}`);
|
|
66
|
+
}
|
|
67
|
+
start = arg.range[0] + 1;
|
|
68
|
+
end = arg.range[1] - 1;
|
|
69
|
+
break;
|
|
70
|
+
case 'ConditionalExpression':
|
|
71
|
+
visitNode(node, arg.consequent);
|
|
72
|
+
visitNode(node, arg.alternate);
|
|
73
|
+
return;
|
|
74
|
+
case 'LogicalExpression':
|
|
75
|
+
visitNode(node, arg.right);
|
|
76
|
+
return;
|
|
77
|
+
case 'ArrayExpression':
|
|
78
|
+
arg.elements.forEach((el)=>{
|
|
79
|
+
visitNode(node, el);
|
|
80
|
+
});
|
|
81
|
+
return;
|
|
82
|
+
case 'ObjectExpression':
|
|
83
|
+
const isUsedByClassNamesPlugin = node.callee && node.callee.name === 'classnames';
|
|
84
|
+
const isVue = node.key && node.key.type === 'VDirectiveKey';
|
|
85
|
+
arg.properties.forEach((prop)=>{
|
|
86
|
+
const propVal = isUsedByClassNamesPlugin || isVue ? prop.key : prop.value;
|
|
87
|
+
visitNode(node, propVal);
|
|
88
|
+
});
|
|
89
|
+
return;
|
|
90
|
+
case 'Property':
|
|
91
|
+
visitNode(node, arg.key);
|
|
92
|
+
break;
|
|
93
|
+
case 'Literal':
|
|
94
|
+
originalClassNamesValue = arg.raw.slice(1, arg.raw.length - 1);
|
|
95
|
+
start = arg.range[0] + 1;
|
|
96
|
+
end = arg.range[1] - 1;
|
|
97
|
+
break;
|
|
98
|
+
case 'SvelteLiteral':
|
|
99
|
+
originalClassNamesValue = arg.value;
|
|
100
|
+
if (originalClassNamesValue === '') {
|
|
101
|
+
return;
|
|
102
|
+
}
|
|
103
|
+
start = arg.range[0];
|
|
104
|
+
end = arg.range[1];
|
|
105
|
+
break;
|
|
106
|
+
case 'TemplateElement':
|
|
107
|
+
originalClassNamesValue = arg.value.raw;
|
|
108
|
+
if (originalClassNamesValue === '') {
|
|
109
|
+
return;
|
|
110
|
+
}
|
|
111
|
+
start = arg.range[0];
|
|
112
|
+
end = arg.range[1];
|
|
113
|
+
// https://github.com/eslint/eslint/issues/13360
|
|
114
|
+
// The problem is that range computation includes the backticks (`test`)
|
|
115
|
+
// but value.raw does not include them, so there is a mismatch.
|
|
116
|
+
// start/end does not include the backticks, therefore it matches value.raw.
|
|
117
|
+
const txt = context.sourceCode.getText(arg);
|
|
118
|
+
prefix = getTemplateElementPrefix(txt, originalClassNamesValue);
|
|
119
|
+
suffix = getTemplateElementSuffix(txt, originalClassNamesValue);
|
|
120
|
+
originalClassNamesValue = getTemplateElementBody(txt, prefix, suffix);
|
|
121
|
+
break;
|
|
122
|
+
}
|
|
123
|
+
}
|
|
124
|
+
const { classNames, whitespaces, headSpace, tailSpace } = extractClassnamesFromValue(originalClassNamesValue);
|
|
125
|
+
if (classNames.length <= 1) {
|
|
126
|
+
// Don't run sorting for a single or empty className
|
|
127
|
+
return;
|
|
128
|
+
}
|
|
129
|
+
let orderedClassNames = reorderValidClasses(classNames, settings.config);
|
|
130
|
+
orderedClassNames = classNames.filter((x)=>!orderedClassNames.includes(x)).concat(orderedClassNames).filter((x)=>x.trim() !== '');
|
|
131
|
+
// Generates the validated/sorted attribute value
|
|
132
|
+
let validatedClassNamesValue = '';
|
|
133
|
+
for(let i = 0; i < orderedClassNames.length; i++){
|
|
134
|
+
const w = whitespaces[i] ?? '';
|
|
135
|
+
const cls = orderedClassNames[i];
|
|
136
|
+
validatedClassNamesValue += headSpace ? `${w}${cls}` : `${cls}${w}`;
|
|
137
|
+
if (cls) {
|
|
138
|
+
if (!tailSpace && i === orderedClassNames.length - 1) {
|
|
139
|
+
validatedClassNamesValue = validatedClassNamesValue.replace(/\s+$/, '');
|
|
140
|
+
}
|
|
141
|
+
if (headSpace && tailSpace && i === orderedClassNames.length - 1) {
|
|
142
|
+
validatedClassNamesValue += whitespaces[whitespaces.length - 1] ?? '';
|
|
143
|
+
}
|
|
144
|
+
}
|
|
145
|
+
}
|
|
146
|
+
for(let i = 0; i < expStrings.length; i++){
|
|
147
|
+
originalClassNamesValue = originalClassNamesValue.replace(`EXPRESSION_STRING_NUM_${i}`, expStrings[i]);
|
|
148
|
+
validatedClassNamesValue = validatedClassNamesValue.replace(`EXPRESSION_STRING_NUM_${i}`, expStrings[i]);
|
|
149
|
+
}
|
|
150
|
+
if (originalClassNamesValue !== validatedClassNamesValue) {
|
|
151
|
+
validatedClassNamesValue = prefix + validatedClassNamesValue + suffix;
|
|
152
|
+
const sourceCodeLines = sourceCode.lines;
|
|
153
|
+
const nodeStartLine = node.loc.start.line;
|
|
154
|
+
const nodeEndLine = node.loc.end.line;
|
|
155
|
+
context.report({
|
|
156
|
+
loc: findLoc(originalClassNamesValue, sourceCodeLines, nodeStartLine, nodeEndLine),
|
|
157
|
+
messageId: 'invalidClassOrder',
|
|
158
|
+
fix: function(fixer) {
|
|
159
|
+
return fixer.replaceTextRange([
|
|
160
|
+
start,
|
|
161
|
+
end
|
|
162
|
+
], validatedClassNamesValue);
|
|
163
|
+
}
|
|
164
|
+
});
|
|
165
|
+
}
|
|
166
|
+
};
|
|
167
|
+
return defineVisitors({
|
|
168
|
+
context,
|
|
169
|
+
settings
|
|
170
|
+
}, visitNode);
|
|
171
|
+
}
|
|
172
|
+
});
|
|
173
|
+
|
|
174
|
+
module.exports = classOrder;
|
|
@@ -1 +1,172 @@
|
|
|
1
|
-
import
|
|
1
|
+
import defineVisitors from '../utils/define-visitors.mjs';
|
|
2
|
+
import resolveContext from '../utils/resolve-context.mjs';
|
|
3
|
+
import getTemplateElementBody from '../utils/get-template-element-body.mjs';
|
|
4
|
+
import getTemplateElementSuffix from '../utils/get-template-element-suffix.mjs';
|
|
5
|
+
import getTemplateElementPrefix from '../utils/get-template-element-prefix.mjs';
|
|
6
|
+
import extractValueFromNode from '../utils/extract-value-from-node.mjs';
|
|
7
|
+
import extractRangeFromNode from '../utils/extract-range-from-node.mjs';
|
|
8
|
+
import extractClassnamesFromValue from '../utils/extract-classnames-from-value.mjs';
|
|
9
|
+
import findLoc from '../utils/find-loc.mjs';
|
|
10
|
+
import reorderValidClasses from '../functions/reorder-valid-classes.mjs';
|
|
11
|
+
import createRule from '../create-rule.mjs';
|
|
12
|
+
import settingsSchema from '../settings-schema.mjs';
|
|
13
|
+
|
|
14
|
+
var classOrder = createRule({
|
|
15
|
+
name: 'consistent-class-order',
|
|
16
|
+
meta: {
|
|
17
|
+
type: 'layout',
|
|
18
|
+
fixable: 'code',
|
|
19
|
+
docs: {
|
|
20
|
+
description: 'Enforce a consistent and logical order of classes',
|
|
21
|
+
recommended: 'recommended'
|
|
22
|
+
},
|
|
23
|
+
messages: {
|
|
24
|
+
invalidClassOrder: 'No consistent class order followed.'
|
|
25
|
+
},
|
|
26
|
+
schema: [
|
|
27
|
+
settingsSchema
|
|
28
|
+
]
|
|
29
|
+
},
|
|
30
|
+
defaultOptions: [],
|
|
31
|
+
create: function(context) {
|
|
32
|
+
const { options, settings } = resolveContext(context);
|
|
33
|
+
const sourceCode = context.sourceCode;
|
|
34
|
+
const visitNode = (node, arg = null)=>{
|
|
35
|
+
let originalClassNamesValue = null;
|
|
36
|
+
let start = null;
|
|
37
|
+
let end = null;
|
|
38
|
+
let prefix = '';
|
|
39
|
+
let suffix = '';
|
|
40
|
+
let expStrings = [];
|
|
41
|
+
if (arg === null) {
|
|
42
|
+
originalClassNamesValue = extractValueFromNode(node);
|
|
43
|
+
const range = extractRangeFromNode(node);
|
|
44
|
+
if (node.type === 'TextAttribute') {
|
|
45
|
+
start = range[0];
|
|
46
|
+
end = range[1];
|
|
47
|
+
} else {
|
|
48
|
+
start = range[0] + 1;
|
|
49
|
+
end = range[1] - 1;
|
|
50
|
+
}
|
|
51
|
+
} else {
|
|
52
|
+
switch(arg.type){
|
|
53
|
+
case 'Identifier':
|
|
54
|
+
return;
|
|
55
|
+
case 'TemplateLiteral':
|
|
56
|
+
arg.expressions.forEach((exp)=>{
|
|
57
|
+
visitNode(node, exp);
|
|
58
|
+
});
|
|
59
|
+
originalClassNamesValue = sourceCode.getText(arg);
|
|
60
|
+
originalClassNamesValue = originalClassNamesValue.substring(1, originalClassNamesValue.length - 1);
|
|
61
|
+
expStrings = originalClassNamesValue.match(/\$\{(?:(?<!\\\\)(['"`]).*?(?<!\\\\)\1|[^}])*?\}/g) ?? [];
|
|
62
|
+
for(let i = 0; i < expStrings.length; i++){
|
|
63
|
+
originalClassNamesValue = originalClassNamesValue.replace(expStrings[i], `EXPRESSION_STRING_NUM_${i}`);
|
|
64
|
+
}
|
|
65
|
+
start = arg.range[0] + 1;
|
|
66
|
+
end = arg.range[1] - 1;
|
|
67
|
+
break;
|
|
68
|
+
case 'ConditionalExpression':
|
|
69
|
+
visitNode(node, arg.consequent);
|
|
70
|
+
visitNode(node, arg.alternate);
|
|
71
|
+
return;
|
|
72
|
+
case 'LogicalExpression':
|
|
73
|
+
visitNode(node, arg.right);
|
|
74
|
+
return;
|
|
75
|
+
case 'ArrayExpression':
|
|
76
|
+
arg.elements.forEach((el)=>{
|
|
77
|
+
visitNode(node, el);
|
|
78
|
+
});
|
|
79
|
+
return;
|
|
80
|
+
case 'ObjectExpression':
|
|
81
|
+
const isUsedByClassNamesPlugin = node.callee && node.callee.name === 'classnames';
|
|
82
|
+
const isVue = node.key && node.key.type === 'VDirectiveKey';
|
|
83
|
+
arg.properties.forEach((prop)=>{
|
|
84
|
+
const propVal = isUsedByClassNamesPlugin || isVue ? prop.key : prop.value;
|
|
85
|
+
visitNode(node, propVal);
|
|
86
|
+
});
|
|
87
|
+
return;
|
|
88
|
+
case 'Property':
|
|
89
|
+
visitNode(node, arg.key);
|
|
90
|
+
break;
|
|
91
|
+
case 'Literal':
|
|
92
|
+
originalClassNamesValue = arg.raw.slice(1, arg.raw.length - 1);
|
|
93
|
+
start = arg.range[0] + 1;
|
|
94
|
+
end = arg.range[1] - 1;
|
|
95
|
+
break;
|
|
96
|
+
case 'SvelteLiteral':
|
|
97
|
+
originalClassNamesValue = arg.value;
|
|
98
|
+
if (originalClassNamesValue === '') {
|
|
99
|
+
return;
|
|
100
|
+
}
|
|
101
|
+
start = arg.range[0];
|
|
102
|
+
end = arg.range[1];
|
|
103
|
+
break;
|
|
104
|
+
case 'TemplateElement':
|
|
105
|
+
originalClassNamesValue = arg.value.raw;
|
|
106
|
+
if (originalClassNamesValue === '') {
|
|
107
|
+
return;
|
|
108
|
+
}
|
|
109
|
+
start = arg.range[0];
|
|
110
|
+
end = arg.range[1];
|
|
111
|
+
// https://github.com/eslint/eslint/issues/13360
|
|
112
|
+
// The problem is that range computation includes the backticks (`test`)
|
|
113
|
+
// but value.raw does not include them, so there is a mismatch.
|
|
114
|
+
// start/end does not include the backticks, therefore it matches value.raw.
|
|
115
|
+
const txt = context.sourceCode.getText(arg);
|
|
116
|
+
prefix = getTemplateElementPrefix(txt, originalClassNamesValue);
|
|
117
|
+
suffix = getTemplateElementSuffix(txt, originalClassNamesValue);
|
|
118
|
+
originalClassNamesValue = getTemplateElementBody(txt, prefix, suffix);
|
|
119
|
+
break;
|
|
120
|
+
}
|
|
121
|
+
}
|
|
122
|
+
const { classNames, whitespaces, headSpace, tailSpace } = extractClassnamesFromValue(originalClassNamesValue);
|
|
123
|
+
if (classNames.length <= 1) {
|
|
124
|
+
// Don't run sorting for a single or empty className
|
|
125
|
+
return;
|
|
126
|
+
}
|
|
127
|
+
let orderedClassNames = reorderValidClasses(classNames, settings.config);
|
|
128
|
+
orderedClassNames = classNames.filter((x)=>!orderedClassNames.includes(x)).concat(orderedClassNames).filter((x)=>x.trim() !== '');
|
|
129
|
+
// Generates the validated/sorted attribute value
|
|
130
|
+
let validatedClassNamesValue = '';
|
|
131
|
+
for(let i = 0; i < orderedClassNames.length; i++){
|
|
132
|
+
const w = whitespaces[i] ?? '';
|
|
133
|
+
const cls = orderedClassNames[i];
|
|
134
|
+
validatedClassNamesValue += headSpace ? `${w}${cls}` : `${cls}${w}`;
|
|
135
|
+
if (cls) {
|
|
136
|
+
if (!tailSpace && i === orderedClassNames.length - 1) {
|
|
137
|
+
validatedClassNamesValue = validatedClassNamesValue.replace(/\s+$/, '');
|
|
138
|
+
}
|
|
139
|
+
if (headSpace && tailSpace && i === orderedClassNames.length - 1) {
|
|
140
|
+
validatedClassNamesValue += whitespaces[whitespaces.length - 1] ?? '';
|
|
141
|
+
}
|
|
142
|
+
}
|
|
143
|
+
}
|
|
144
|
+
for(let i = 0; i < expStrings.length; i++){
|
|
145
|
+
originalClassNamesValue = originalClassNamesValue.replace(`EXPRESSION_STRING_NUM_${i}`, expStrings[i]);
|
|
146
|
+
validatedClassNamesValue = validatedClassNamesValue.replace(`EXPRESSION_STRING_NUM_${i}`, expStrings[i]);
|
|
147
|
+
}
|
|
148
|
+
if (originalClassNamesValue !== validatedClassNamesValue) {
|
|
149
|
+
validatedClassNamesValue = prefix + validatedClassNamesValue + suffix;
|
|
150
|
+
const sourceCodeLines = sourceCode.lines;
|
|
151
|
+
const nodeStartLine = node.loc.start.line;
|
|
152
|
+
const nodeEndLine = node.loc.end.line;
|
|
153
|
+
context.report({
|
|
154
|
+
loc: findLoc(originalClassNamesValue, sourceCodeLines, nodeStartLine, nodeEndLine),
|
|
155
|
+
messageId: 'invalidClassOrder',
|
|
156
|
+
fix: function(fixer) {
|
|
157
|
+
return fixer.replaceTextRange([
|
|
158
|
+
start,
|
|
159
|
+
end
|
|
160
|
+
], validatedClassNamesValue);
|
|
161
|
+
}
|
|
162
|
+
});
|
|
163
|
+
}
|
|
164
|
+
};
|
|
165
|
+
return defineVisitors({
|
|
166
|
+
context,
|
|
167
|
+
settings
|
|
168
|
+
}, visitNode);
|
|
169
|
+
}
|
|
170
|
+
});
|
|
171
|
+
|
|
172
|
+
export { classOrder as default };
|
|
@@ -0,0 +1,70 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var defineVisitors = require('../utils/define-visitors.cjs');
|
|
4
|
+
var resolveContext = require('../utils/resolve-context.cjs');
|
|
5
|
+
var findLoc = require('../utils/find-loc.cjs');
|
|
6
|
+
var parseNodeRecursive = require('../utils/parse-node-recursive.cjs');
|
|
7
|
+
var validate = require('../functions/validate.cjs');
|
|
8
|
+
var createRule = require('../create-rule.cjs');
|
|
9
|
+
var settingsSchema = require('../settings-schema.cjs');
|
|
10
|
+
|
|
11
|
+
var classValidation = createRule({
|
|
12
|
+
name: 'syntax-error-checks',
|
|
13
|
+
meta: {
|
|
14
|
+
type: 'problem',
|
|
15
|
+
docs: {
|
|
16
|
+
description: 'Detect syntax errors early when writing classes',
|
|
17
|
+
recommended: 'recommended'
|
|
18
|
+
},
|
|
19
|
+
messages: {
|
|
20
|
+
invalidClass: '{{message}}',
|
|
21
|
+
disallowUnknownClass: '{{message}}'
|
|
22
|
+
},
|
|
23
|
+
fixable: null,
|
|
24
|
+
schema: [
|
|
25
|
+
settingsSchema
|
|
26
|
+
]
|
|
27
|
+
},
|
|
28
|
+
defaultOptions: [],
|
|
29
|
+
create: function(context) {
|
|
30
|
+
const { options, settings } = resolveContext(context);
|
|
31
|
+
const visitNode = (node, arg = null)=>{
|
|
32
|
+
parseNodeRecursive.parseNodeRecursive(node, arg, (classNames, node)=>{
|
|
33
|
+
const sourceCode = context.sourceCode;
|
|
34
|
+
const sourceCodeLines = sourceCode.lines;
|
|
35
|
+
const nodeStartLine = node.loc.start.line;
|
|
36
|
+
const nodeEndLine = node.loc.end.line;
|
|
37
|
+
for (const className of classNames){
|
|
38
|
+
const { isMasterCSS, errors } = validate(className, settings.config);
|
|
39
|
+
if (errors.length > 0) {
|
|
40
|
+
for (const error of errors){
|
|
41
|
+
if (isMasterCSS) {
|
|
42
|
+
context.report({
|
|
43
|
+
loc: findLoc(className, sourceCodeLines, nodeStartLine, nodeEndLine),
|
|
44
|
+
messageId: 'invalidClass',
|
|
45
|
+
data: {
|
|
46
|
+
message: error.message + '.'
|
|
47
|
+
}
|
|
48
|
+
});
|
|
49
|
+
} else if (options.disallowUnknownClass) {
|
|
50
|
+
context.report({
|
|
51
|
+
loc: findLoc(className, sourceCodeLines, nodeStartLine, nodeEndLine),
|
|
52
|
+
messageId: 'disallowUnknownClass',
|
|
53
|
+
data: {
|
|
54
|
+
message: `"${className}" is not a valid or known class.`
|
|
55
|
+
}
|
|
56
|
+
});
|
|
57
|
+
}
|
|
58
|
+
}
|
|
59
|
+
}
|
|
60
|
+
}
|
|
61
|
+
}, false, false, settings.ignoredKeys, context);
|
|
62
|
+
};
|
|
63
|
+
return defineVisitors({
|
|
64
|
+
context,
|
|
65
|
+
settings
|
|
66
|
+
}, visitNode);
|
|
67
|
+
}
|
|
68
|
+
});
|
|
69
|
+
|
|
70
|
+
module.exports = classValidation;
|
|
@@ -1,3 +1,2 @@
|
|
|
1
|
-
import
|
|
2
|
-
declare const _default: Rule.RuleModule;
|
|
1
|
+
declare const _default: import("@typescript-eslint/utils/ts-eslint").RuleModule<"invalidClass" | "disallowUnknownClass", [], import("@typescript-eslint/utils/ts-eslint").RuleListener>;
|
|
3
2
|
export default _default;
|
|
@@ -1 +1,68 @@
|
|
|
1
|
-
import
|
|
1
|
+
import defineVisitors from '../utils/define-visitors.mjs';
|
|
2
|
+
import resolveContext from '../utils/resolve-context.mjs';
|
|
3
|
+
import findLoc from '../utils/find-loc.mjs';
|
|
4
|
+
import { parseNodeRecursive } from '../utils/parse-node-recursive.mjs';
|
|
5
|
+
import validate from '../functions/validate.mjs';
|
|
6
|
+
import createRule from '../create-rule.mjs';
|
|
7
|
+
import settingsSchema from '../settings-schema.mjs';
|
|
8
|
+
|
|
9
|
+
var classValidation = createRule({
|
|
10
|
+
name: 'syntax-error-checks',
|
|
11
|
+
meta: {
|
|
12
|
+
type: 'problem',
|
|
13
|
+
docs: {
|
|
14
|
+
description: 'Detect syntax errors early when writing classes',
|
|
15
|
+
recommended: 'recommended'
|
|
16
|
+
},
|
|
17
|
+
messages: {
|
|
18
|
+
invalidClass: '{{message}}',
|
|
19
|
+
disallowUnknownClass: '{{message}}'
|
|
20
|
+
},
|
|
21
|
+
fixable: null,
|
|
22
|
+
schema: [
|
|
23
|
+
settingsSchema
|
|
24
|
+
]
|
|
25
|
+
},
|
|
26
|
+
defaultOptions: [],
|
|
27
|
+
create: function(context) {
|
|
28
|
+
const { options, settings } = resolveContext(context);
|
|
29
|
+
const visitNode = (node, arg = null)=>{
|
|
30
|
+
parseNodeRecursive(node, arg, (classNames, node)=>{
|
|
31
|
+
const sourceCode = context.sourceCode;
|
|
32
|
+
const sourceCodeLines = sourceCode.lines;
|
|
33
|
+
const nodeStartLine = node.loc.start.line;
|
|
34
|
+
const nodeEndLine = node.loc.end.line;
|
|
35
|
+
for (const className of classNames){
|
|
36
|
+
const { isMasterCSS, errors } = validate(className, settings.config);
|
|
37
|
+
if (errors.length > 0) {
|
|
38
|
+
for (const error of errors){
|
|
39
|
+
if (isMasterCSS) {
|
|
40
|
+
context.report({
|
|
41
|
+
loc: findLoc(className, sourceCodeLines, nodeStartLine, nodeEndLine),
|
|
42
|
+
messageId: 'invalidClass',
|
|
43
|
+
data: {
|
|
44
|
+
message: error.message + '.'
|
|
45
|
+
}
|
|
46
|
+
});
|
|
47
|
+
} else if (options.disallowUnknownClass) {
|
|
48
|
+
context.report({
|
|
49
|
+
loc: findLoc(className, sourceCodeLines, nodeStartLine, nodeEndLine),
|
|
50
|
+
messageId: 'disallowUnknownClass',
|
|
51
|
+
data: {
|
|
52
|
+
message: `"${className}" is not a valid or known class.`
|
|
53
|
+
}
|
|
54
|
+
});
|
|
55
|
+
}
|
|
56
|
+
}
|
|
57
|
+
}
|
|
58
|
+
}
|
|
59
|
+
}, false, false, settings.ignoredKeys, context);
|
|
60
|
+
};
|
|
61
|
+
return defineVisitors({
|
|
62
|
+
context,
|
|
63
|
+
settings
|
|
64
|
+
}, visitNode);
|
|
65
|
+
}
|
|
66
|
+
});
|
|
67
|
+
|
|
68
|
+
export { classValidation as default };
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
const settingsSchema = {
|
|
4
|
+
type: 'object',
|
|
5
|
+
properties: {
|
|
6
|
+
classAttributes: {
|
|
7
|
+
type: 'array',
|
|
8
|
+
items: {
|
|
9
|
+
type: 'string'
|
|
10
|
+
}
|
|
11
|
+
},
|
|
12
|
+
classFunctions: {
|
|
13
|
+
type: 'array',
|
|
14
|
+
items: {
|
|
15
|
+
type: 'string'
|
|
16
|
+
}
|
|
17
|
+
},
|
|
18
|
+
ignoredKeys: {
|
|
19
|
+
type: 'array',
|
|
20
|
+
items: {
|
|
21
|
+
type: 'string',
|
|
22
|
+
minLength: 0
|
|
23
|
+
},
|
|
24
|
+
uniqueItems: true
|
|
25
|
+
},
|
|
26
|
+
config: {
|
|
27
|
+
type: [
|
|
28
|
+
'string',
|
|
29
|
+
'object'
|
|
30
|
+
]
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
};
|
|
34
|
+
|
|
35
|
+
module.exports = settingsSchema;
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
const settingsSchema = {
|
|
2
|
+
type: 'object',
|
|
3
|
+
properties: {
|
|
4
|
+
classAttributes: {
|
|
5
|
+
type: 'array',
|
|
6
|
+
items: {
|
|
7
|
+
type: 'string'
|
|
8
|
+
}
|
|
9
|
+
},
|
|
10
|
+
classFunctions: {
|
|
11
|
+
type: 'array',
|
|
12
|
+
items: {
|
|
13
|
+
type: 'string'
|
|
14
|
+
}
|
|
15
|
+
},
|
|
16
|
+
ignoredKeys: {
|
|
17
|
+
type: 'array',
|
|
18
|
+
items: {
|
|
19
|
+
type: 'string',
|
|
20
|
+
minLength: 0
|
|
21
|
+
},
|
|
22
|
+
uniqueItems: true
|
|
23
|
+
},
|
|
24
|
+
config: {
|
|
25
|
+
type: [
|
|
26
|
+
'string',
|
|
27
|
+
'object'
|
|
28
|
+
]
|
|
29
|
+
}
|
|
30
|
+
}
|
|
31
|
+
};
|
|
32
|
+
|
|
33
|
+
export { settingsSchema as default };
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var css = require('@master/css');
|
|
4
|
+
|
|
5
|
+
const settings = {
|
|
6
|
+
classAttributes: css.CLASS_ATTRIBUTES,
|
|
7
|
+
classFunctions: css.CLASS_FUNCTIONS,
|
|
8
|
+
classDeclarations: css.CLASS_DECLARATIONS,
|
|
9
|
+
ignoredKeys: [
|
|
10
|
+
'compoundVariants',
|
|
11
|
+
'defaultVariants'
|
|
12
|
+
],
|
|
13
|
+
config: 'master.css'
|
|
14
|
+
};
|
|
15
|
+
|
|
16
|
+
module.exports = settings;
|
package/dist/settings.d.ts
CHANGED
|
@@ -1,7 +1,15 @@
|
|
|
1
1
|
declare const settings: {
|
|
2
|
-
|
|
3
|
-
|
|
2
|
+
classAttributes: string[];
|
|
3
|
+
classFunctions: string[];
|
|
4
|
+
classDeclarations: string[];
|
|
4
5
|
ignoredKeys: string[];
|
|
5
6
|
config: string;
|
|
6
7
|
};
|
|
7
8
|
export default settings;
|
|
9
|
+
export interface Settings {
|
|
10
|
+
classAttributes?: string[];
|
|
11
|
+
classFunctions?: string[];
|
|
12
|
+
classDeclarations?: string[];
|
|
13
|
+
ignoredKeys: string[];
|
|
14
|
+
config: string | object;
|
|
15
|
+
}
|
package/dist/settings.mjs
CHANGED
|
@@ -1 +1,14 @@
|
|
|
1
|
-
|
|
1
|
+
import { CLASS_ATTRIBUTES, CLASS_FUNCTIONS, CLASS_DECLARATIONS } from '@master/css';
|
|
2
|
+
|
|
3
|
+
const settings = {
|
|
4
|
+
classAttributes: CLASS_ATTRIBUTES,
|
|
5
|
+
classFunctions: CLASS_FUNCTIONS,
|
|
6
|
+
classDeclarations: CLASS_DECLARATIONS,
|
|
7
|
+
ignoredKeys: [
|
|
8
|
+
'compoundVariants',
|
|
9
|
+
'defaultVariants'
|
|
10
|
+
],
|
|
11
|
+
config: 'master.css'
|
|
12
|
+
};
|
|
13
|
+
|
|
14
|
+
export { settings as default };
|