@d-zero/stylelint-rules 5.0.0-alpha.76 → 5.0.0

package/dist/index.js

@@ -1,9 +1,11 @@
 import component from './rules/component/index.js';
+import componentRootDisallowedProperties from './rules/component-root-disallowed-properties/index.js';
 import declarationValueTypeDisallowedList from './rules/declaration-value-type-disallowed-list/index.js';
 import preferIndividualTransformProperties from './rules/prefer-individual-transform-properties/index.js';
 import shorthandPropertyUseLogical from './rules/shorthand-property-use-logical/index.js';
 export default [
     component,
+    componentRootDisallowedProperties,
     declarationValueTypeDisallowedList,
     preferIndividualTransformProperties,
     shorthandPropertyUseLogical,

package/dist/rules/component-root-disallowed-properties/index.js

@@ -0,0 +1,202 @@
+import path from 'node:path';
+import selectorParser from 'postcss-selector-parser';
+import stylelint from 'stylelint';
+import { createRule } from '../../utils/create-rule.js';
+// 禁止プロパティのリスト
+// string: プロパティ名のみ（例: 'width', 'margin'）
+// { [propName: string]: string }: プロパティ名と値のペア（例: { position: 'absolute' }）
+const DISALLOWED_PROPERTIES = [
+    'width',
+    'inline-size',
+    'margin',
+    'margin-top',
+    'margin-right',
+    'margin-bottom',
+    'margin-left',
+    'margin-block',
+    'margin-inline',
+    'margin-block-start',
+    'margin-block-end',
+    'margin-inline-start',
+    'margin-inline-end',
+    'height',
+    'block-size',
+    'inset',
+    'inset-block',
+    'inset-inline',
+    'top',
+    'right',
+    'bottom',
+    'left',
+    'justify-self',
+    'align-self',
+    'place-self',
+    'flex',
+    'flex-grow',
+    'flex-shrink',
+    'flex-basis',
+    'grid-area',
+    'float',
+    'clear',
+    { position: 'absolute' },
+    { position: 'fixed' },
+    { position: 'sticky' },
+];
+/**
+ * プロパティが禁止されているかチェック
+ * @param prop
+ */
+function isDisallowedProperty(prop) {
+    const normalizedProp = prop.toLowerCase();
+    return DISALLOWED_PROPERTIES.some((item) => {
+        if (typeof item === 'string') {
+            return item === normalizedProp;
+        }
+        return false;
+    });
+}
+/**
+ * プロパティと値の組み合わせが禁止されているかチェック
+ * @param prop
+ * @param value
+ */
+function isDisallowedPropertyValue(prop, value) {
+    const normalizedProp = prop.toLowerCase();
+    const normalizedValue = value.toLowerCase().trim();
+    return DISALLOWED_PROPERTIES.some((item) => {
+        if (typeof item === 'object') {
+            return (normalizedProp in item && item[normalizedProp]?.toLowerCase() === normalizedValue);
+        }
+        return false;
+    });
+}
+/**
+ * ルールがコンポーネントルートかどうかを判定
+ * @param rule
+ * @param basename
+ */
+function isComponentRoot(rule, basename) {
+    const ruleSelectors = [];
+    selectorParser((parsedRoot) => {
+        for (const node of parsedRoot.nodes) {
+            ruleSelectors.push(node);
+        }
+    }).processSync(rule.selector);
+    const [ruleFirstSelector] = ruleSelectors;
+    if (!ruleFirstSelector) {
+        return false;
+    }
+    for (const node of ruleFirstSelector.nodes) {
+        if (node.type === 'class') {
+            const className = node.value;
+            // ファイル名と完全一致するクラス名のみがコンポーネントルート
+            // CSSファイルの場合は __ で始まるクラスは子要素なので除外
+            if (className === basename) {
+                return true;
+            }
+        }
+    }
+    return false;
+}
+/**
+ * ルールのセレクタに疑似クラスが含まれているか判定
+ * @param rule
+ */
+function hasPseudoClass(rule) {
+    let hasPseudo = false;
+    selectorParser((parsedRoot) => {
+        parsedRoot.walkPseudos((pseudo) => {
+            // 疑似クラスは : で始まる（疑似要素は :: で始まる）
+            if (pseudo.value.startsWith(':')) {
+                hasPseudo = true;
+            }
+        });
+    }).processSync(rule.selector);
+    return hasPseudo;
+}
+/**
+ * ルールのセレクタに疑似要素が含まれているか判定
+ * @param rule
+ */
+function hasPseudoElement(rule) {
+    let hasPseudo = false;
+    selectorParser((parsedRoot) => {
+        parsedRoot.walkPseudos((pseudo) => {
+            // 疑似要素は :: で始まる
+            if (pseudo.value.startsWith('::')) {
+                hasPseudo = true;
+            }
+        });
+    }).processSync(rule.selector);
+    return hasPseudo;
+}
+export default createRule({
+    name: 'component-root-disallowed-properties',
+    rejected: (property) => `コンポーネントルートで "${property}" プロパティは禁止されています`,
+    rule: (ruleName, messages) => () => {
+        return (root, result) => {
+            const fileName = root.source?.input.file;
+            if (!fileName) {
+                return;
+            }
+            const ext = path.extname(fileName);
+            const originalBasename = path.basename(fileName, ext);
+            const basename = ['.scss', '.sass'].includes(ext)
+                ? originalBasename.replace(/^_/, '')
+                : originalBasename;
+            const rules = root.nodes.filter((node) => node.type === 'rule');
+            /**
+             * ルール内の宣言をチェックする関数
+             * @param rule
+             */
+            const checkDeclarations = (rule) => {
+                for (const node of rule.nodes) {
+                    if (node.type === 'decl') {
+                        const prop = node.prop;
+                        const value = node.value;
+                        // プロパティと値の組み合わせが禁止されているかチェック
+                        if (isDisallowedPropertyValue(prop, value)) {
+                            const normalizedValue = value.toLowerCase().trim();
+                            stylelint.utils.report({
+                                result,
+                                ruleName,
+                                message: messages.rejected(`${prop}: ${normalizedValue}`),
+                                node,
+                            });
+                            continue;
+                        }
+                        // その他の禁止プロパティのチェック
+                        if (isDisallowedProperty(prop)) {
+                            stylelint.utils.report({
+                                result,
+                                ruleName,
+                                message: messages.rejected(prop),
+                                node,
+                            });
+                        }
+                    }
+                    else if (node.type === 'rule') {
+                        // ネストされたルールをチェック
+                        // 疑似要素を含むルールはチェック対象から除外
+                        if (hasPseudoElement(node)) {
+                            continue;
+                        }
+                        // 疑似クラスを含むルールはチェック対象
+                        if (hasPseudoClass(node)) {
+                            checkDeclarations(node);
+                        }
+                    }
+                }
+            };
+            // 各ルールをチェック
+            for (const rule of rules) {
+                // コンポーネントルートかどうかを判定
+                if (!isComponentRoot(rule, basename)) {
+                    continue;
+                }
+                // コンポーネントルート内の直接の子ノード（宣言）と疑似クラスを含むネストされたルールをチェック
+                checkDeclarations(rule);
+            }
+        };
+    },
+});

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@d-zero/stylelint-rules",
-	"version": "5.0.0-alpha.76",
+	"version": "5.0.0",
 	"description": "Rules of Stylelint for D-ZERO",
 	"repository": "https://github.com/d-zero-dev/linters.git",
 	"author": "D-ZERO Co., Ltd.",
@@ -22,7 +22,7 @@
 		"build": "tsc"
 	},
 	"dependencies": {
-		"@d-zero/csstree-scss-syntax": "5.0.0-alpha.76",
+		"@d-zero/csstree-scss-syntax": "5.0.0",
 		"css-tree": "3.1.0",
 		"postcss-selector-parser": "7.1.1",
 		"postcss-value-parser": "4.2.0",
@@ -31,5 +31,5 @@
 	"devDependencies": {
 		"postcss": "8.5.6"
 	},
-	"gitHead": "ce73891d4f524630108d2f3869899b4d6b5b3bfe"
+	"gitHead": "7f635ad8bbb1455d0d362fe00478a2f7bd216924"
 }