@d-zero/stylelint-rules 5.0.0-alpha.64 → 5.0.0-alpha.65

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.
Files changed (3) hide show
  1. package/dist/rules/component/index.js +50 -45
  2. package/dist/rules/component/index.spec.js +29 -0
  3. package/package.json +3 -3
package/dist/rules/component/index.js CHANGED
@@ -21,13 +21,16 @@ export default createRule({
21
21
  const effectiveAllowMultipleSelectors = isCssFile || allowMultipleSelectors;
22
22
  const rules = root.nodes.filter((node) => node.type === 'rule');
23
23
  const [firstRule, ...overleftRules] = rules;
24
- for (const rule of overleftRules) {
25
- stylelint.utils.report({
26
- result,
27
- ruleName,
28
- message: '1つのファイルに定義できるコンポーネントクラスは1つだけです',
29
- node: rule,
30
- });
24
+ // allowMultipleSelectorsに基づいて複数ルール制約をチェック
25
+ if (!effectiveAllowMultipleSelectors && overleftRules.length > 0) {
26
+ for (const rule of overleftRules) {
27
+ stylelint.utils.report({
28
+ result,
29
+ ruleName,
30
+ message: '1つのファイルに定義できるコンポーネントクラスは1つだけです',
31
+ node: rule,
32
+ });
33
+ }
31
34
  }
32
35
  if (!firstRule) {
33
36
  stylelint.utils.report({
@@ -38,46 +41,48 @@ export default createRule({
38
41
  });
39
42
  return;
40
43
  }
41
- const selectors = [];
42
- selectorParser((parsedRoot) => {
43
- for (const node of parsedRoot.nodes) {
44
- selectors.push(node);
45
- }
46
- }).processSync(firstRule.selector);
47
- const [firstSelector, ...multipleSelectors] = selectors;
48
- if (!firstSelector) {
49
- throw new Error('Do not have a selector');
50
- }
51
- // コンポーネントクラスの検証
52
- let hasValidComponentClass = false;
53
- for (const node of firstSelector.nodes) {
54
- if (node.type === 'class') {
55
- const className = node.value;
56
- // 完全一致またはBEM形式（__で始まる）のチェック
57
- if (className === basename ||
58
- (isCssFile && className.startsWith(`${basename}__`))) {
59
- hasValidComponentClass = true;
60
- break;
44
+ // 全ルールのコンポーネントクラスを検証
45
+ for (const rule of rules) {
46
+ const ruleSelectors = [];
47
+ selectorParser((parsedRoot) => {
48
+ for (const node of parsedRoot.nodes) {
49
+ ruleSelectors.push(node);
50
+ }
51
+ }).processSync(rule.selector);
52
+ const [ruleFirstSelector, ...ruleMultipleSelectors] = ruleSelectors;
53
+ if (!ruleFirstSelector)
54
+ continue;
55
+ let hasValidComponentClass = false;
56
+ for (const node of ruleFirstSelector.nodes) {
57
+ if (node.type === 'class') {
58
+ const className = node.value;
59
+ // 完全一致またはコンポーネント命名規則（__で始まる）のチェック
60
+ if (className === basename ||
61
+ (isCssFile && className.startsWith(`${basename}__`))) {
62
+ hasValidComponentClass = true;
63
+ break;
64
+ }
61
65
  }
62
66
  }
63
- }
64
- if (!hasValidComponentClass) {
65
- stylelint.utils.report({
66
- result,
67
- ruleName,
68
- message: isCssFile
69
- ? `クラス名がファイル名と一致しないか、コンポーネント命名規則（${basename}__）で始まっていません`
70
- : 'クラス名がファイル名と一致しません',
71
- node: firstRule,
72
- });
73
- }
74
- if (!effectiveAllowMultipleSelectors && multipleSelectors.length > 0) {
75
- stylelint.utils.report({
76
- result,
77
- ruleName,
78
- message: 'セレクタの定義は1つだけです',
79
- node: firstRule,
80
- });
67
+ if (!hasValidComponentClass) {
68
+ stylelint.utils.report({
69
+ result,
70
+ ruleName,
71
+ message: isCssFile
72
+ ? `クラス名がファイル名と一致しないか、コンポーネント命名規則（${basename}__）で始まっていません`
73
+ : 'クラス名がファイル名と一致しません',
74
+ node: rule,
75
+ });
76
+ }
77
+ // 複数セレクタのチェック
78
+ if (!effectiveAllowMultipleSelectors && ruleMultipleSelectors.length > 0) {
79
+ stylelint.utils.report({
80
+ result,
81
+ ruleName,
82
+ message: 'セレクタの定義は1つだけです',
83
+ node: rule,
84
+ });
85
+ }
81
86
  }
82
87
  };
83
88
  },
package/dist/rules/component/index.spec.js CHANGED
@@ -188,4 +188,33 @@ describe('Options', () => {
188
188
  expect(parseErrors).toHaveLength(0);
189
189
  expect(warnings).toHaveLength(0);
190
190
  });
191
+ test('CSS files allow multiple rules', async () => {
192
+ const {
193
+ // @ts-ignore
194
+ results: [{ warnings, parseErrors }], } = await lint({
195
+ codeFilename: 'button.css',
196
+ code: `.button { color: currentColor; }
197
+ .button__text { font-size: 14px; }
198
+ .button__icon { width: 16px; }`,
199
+ config: config({}),
200
+ });
201
+ expect(parseErrors).toHaveLength(0);
202
+ expect(warnings).toHaveLength(0);
203
+ });
204
+ test('CSS files reject multiple components', async () => {
205
+ const {
206
+ // @ts-ignore
207
+ results: [{ warnings, parseErrors }], } = await lint({
208
+ codeFilename: 'c-component.css',
209
+ code: `.c-component { --prop: value; }
210
+ .c-component__element { --prop: value; }
211
+ .c-component2 { --prop: value; }
212
+ .c-specific { --prop: value; }`,
213
+ config: config({}),
214
+ });
215
+ expect(parseErrors).toHaveLength(0);
216
+ expect(warnings).toHaveLength(2);
217
+ expect(warnings[0].text).toBe('クラス名がファイル名と一致しないか、コンポーネント命名規則（c-component__）で始まっていません');
218
+ expect(warnings[1].text).toBe('クラス名がファイル名と一致しないか、コンポーネント命名規則（c-component__）で始まっていません');
219
+ });
191
220
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@d-zero/stylelint-rules",
3
- "version": "5.0.0-alpha.64",
3
+ "version": "5.0.0-alpha.65",
4
4
  "description": "Rules of Stylelint for D-ZERO",
5
5
  "repository": "https://github.com/d-zero-dev/linters.git",
6
6
  "author": "D-ZERO Co., Ltd.",
@@ -23,7 +23,7 @@
23
23
  "build": "tsc"
24
24
  },
25
25
  "dependencies": {
26
- "@d-zero/csstree-scss-syntax": "5.0.0-alpha.64",
26
+ "@d-zero/csstree-scss-syntax": "5.0.0-alpha.65",
27
27
  "css-tree": "3.1.0",
28
28
  "postcss-selector-parser": "7.1.0",
29
29
  "postcss-value-parser": "4.2.0",
@@ -32,5 +32,5 @@
32
32
  "devDependencies": {
33
33
  "postcss": "8.5.5"
34
34
  },
35
- "gitHead": "9efcc82edcd2392e49218ef22ce3831f61ba566c"
35
+ "gitHead": "884a176442f45e717290664c2b4b1912d8055b0c"
36
36
  }