diff --git a/packages/stylelint/__tests__/invalid/avoid-errors.css b/packages/stylelint/__tests__/invalid/avoid-errors.css new file mode 100644 index 0000000..87d13b6 --- /dev/null +++ b/packages/stylelint/__tests__/invalid/avoid-errors.css @@ -0,0 +1,8 @@ +/* declaration-property-value-no-unknown */ +.declaration-property-value-no-unknown { + inset-block-start: unknown; +} + +/* media-feature-name-value-no-unknown */ +@media (color: red) { +} diff --git a/packages/stylelint/__tests__/invalid/rules.css b/packages/stylelint/__tests__/invalid/enforce-conventions.css similarity index 83% rename from packages/stylelint/__tests__/invalid/rules.css rename to packages/stylelint/__tests__/invalid/enforce-conventions.css index 4d91705..7e3ddce 100644 --- a/packages/stylelint/__tests__/invalid/rules.css +++ b/packages/stylelint/__tests__/invalid/enforce-conventions.css @@ -22,20 +22,11 @@ text-align: left; } -/* declaration-property-value-no-unknown */ -.declaration-property-value-no-unknown { - inset-block-start: unknown; -} - /* function-url-no-scheme-relative */ .function-url-no-scheme-relative { background-image: url("//example.com/file.jpg"); } -/* media-feature-name-value-no-unknown */ -@media (color: red) { -} - /* property-disallowed-list */ .property-disallowed-list1 { top: 0; diff --git a/packages/stylelint/__tests__/valid/avoid-errors.css b/packages/stylelint/__tests__/valid/avoid-errors.css new file mode 100644 index 0000000..3f612c5 --- /dev/null +++ b/packages/stylelint/__tests__/valid/avoid-errors.css @@ -0,0 +1,12 @@ +/* no-descending-specificity */ +.container .no-descending-specificity { + inset-block-start: 10px; +} + +.no-descending-specificity { + inset-block-start: 0; +} + +/* block-no-empty */ +.block-no-empty { +} diff --git a/packages/stylelint/__tests__/valid/rules.css b/packages/stylelint/__tests__/valid/enforce-conventions.css similarity index 76% rename from packages/stylelint/__tests__/valid/rules.css rename to packages/stylelint/__tests__/valid/enforce-conventions.css index 594504e..b097064 100644 --- a/packages/stylelint/__tests__/valid/rules.css +++ b/packages/stylelint/__tests__/valid/enforce-conventions.css @@ -10,10 +10,6 @@ } } -/* block-no-empty */ -.block-no-empty { -} - /* color-hex-alpha */ .color-hex-alpha1 { color: #000; @@ -23,10 +19,6 @@ color: #010101; } -/* custom-property-pattern */ ---foo1-1: 1; ---_foo1-1: 1; - /* declaration-property-value-disallowed-list */ .declaration-property-value-disallowed-list { display: block flow; @@ -36,13 +28,9 @@ text-align: start; } -/* no-descending-specificity */ -.container .no-descending-specificity { - inset-block-start: 10px; -} - -.no-descending-specificity { - inset-block-start: 0; +/* value-keyword-case */ +.value-keyword-case { + fill: currentColor; } /* selector-max-universal */ @@ -52,7 +40,6 @@ .selector-max-universal > * + * { } -/* value-keyword-case */ -.value-keyword-case { - fill: currentColor; -} +/* custom-property-pattern */ +--foo1-1: 1; +--_foo1-1: 1; diff --git a/packages/stylelint/stylelint.config.js b/packages/stylelint/stylelint.config.js index 80f3f4c..409f912 100644 --- a/packages/stylelint/stylelint.config.js +++ b/packages/stylelint/stylelint.config.js @@ -1,24 +1,88 @@ export default { extends: ['stylelint-config-standard', 'stylelint-config-concentric-order'], rules: { - 'at-rule-empty-line-before': [ - 'always', - { - except: ['blockless-after-same-name-blockless', 'first-nested'], - ignore: ['after-comment'], - ignoreAtRules: ['import'], - }, - ], - 'block-no-empty': null, + /** + * Avoid errors + */ + /* Descending */ + 'no-descending-specificity': null, // ✅ + + /* Duplicate */ + // ✅ declaration-block-no-duplicate-custom-properties + // ✅ declaration-block-no-duplicate-properties + // ✅ font-family-no-duplicate-names + // ✅ keyframe-block-no-duplicate-selectors + // ✅ no-duplicate-at-import-rules + // ✅ no-duplicate-selectors + + /* Empty */ + 'block-no-empty': null, // ✅ + // ✅ comment-no-empty + // ✅ no-empty-source + + /* Invalid */ + // ✅ color-no-invalid-hex + // ✅ function-calc-no-unspaced-operator + // ✅ keyframe-declaration-no-important + // ✅ media-query-no-invalid + // ✅ named-grid-areas-no-invalid + // ✅ no-invalid-double-slash-comments + // ✅ no-invalid-position-at-import-rule + // ✅ string-no-newline + + /* Irregular */ + // ✅ no-irregular-whitespace + + /* Missing */ + // ✅ custom-property-no-missing-var-function + // ✅ font-family-no-missing-generic-family-keyword + + /* Non-standard */ + // ✅ function-linear-gradient-no-nonstandard-direction + + /* Overrides */ + // ✅ declaration-block-no-shorthand-property-overrides + + /* Unmatchable */ + // ✅ selector-anb-no-unmatchable + + /* Unknown */ + // ✅ annotation-no-unknown + // ✅ at-rule-no-unknown + 'declaration-property-value-no-unknown': true, + // ✅ function-no-unknown + // ✅ media-feature-name-no-unknown + 'media-feature-name-value-no-unknown': true, + // no-unknown-animations + // no-unknown-custom-media + // no-unknown-custom-properties + // ✅ property-no-unknown + // ✅ selector-pseudo-class-no-unknown + // ✅ selector-pseudo-element-no-unknown + // ✅ selector-type-no-unknown + // ✅ unit-no-unknown + + /** + * Enforce conventions + */ + /* Allowed, disallowed & required */ + // at-rule-allowed-list + // at-rule-disallowed-list + // ✅ at-rule-no-vendor-prefix + // at-rule-property-required-list 'color-hex-alpha': 'never', 'color-named': 'never', - 'custom-property-pattern': '^_?([a-z][a-z0-9]*)(-[a-z0-9]+)*$', + // color-no-hex + // comment-word-disallowed-list 'declaration-no-important': [ true, { severity: 'warning', }, ], + // declaration-property-unit-allowed-list + // declaration-property-unit-disallowed-list + // declaration-property-value-allowed-list 'declaration-property-value-disallowed-list': [ { display: [ @@ -114,10 +178,18 @@ export default { severity: 'warning', }, ], - 'declaration-property-value-no-unknown': true, + // function-allowed-list + // function-disallowed-list 'function-url-no-scheme-relative': true, - 'media-feature-name-value-no-unknown': true, - 'no-descending-specificity': null, + // function-url-scheme-allowed-list + // function-url-scheme-disallowed-list + // length-zero-no-unit + // media-feature-name-allowed-list + // media-feature-name-disallowed-list + // ✅ media-feature-name-no-vendor-prefix + // media-feature-name-unit-allowed-list + // media-feature-name-value-allowed-list + // property-allowed-list 'property-disallowed-list': [ [ 'top', @@ -166,20 +238,106 @@ export default { severity: 'warning', }, ], + // ✅ property-no-vendor-prefix + // rule-selector-property-disallowed-list + // selector-attribute-name-disallowed-list + // selector-attribute-operator-allowed-list + // selector-attribute-operator-disallowed-list + // selector-combinator-allowed-list + // selector-combinator-disallowed-list + // selector-disallowed-list + // selector-no-qualifying-type + // ✅ selector-no-vendor-prefix + // selector-pseudo-class-allowed-list + // selector-pseudo-class-disallowed-list + // selector-pseudo-element-allowed-list + // selector-pseudo-element-disallowed-list + // unit-allowed-list + // unit-disallowed-list + // ✅ value-no-vendor-prefix + + /* Case */ + // ✅ function-name-case + // ✅ selector-type-case + 'value-keyword-case': [ + 'lower', + { + camelCaseSvgKeywords: true, + }, + ], + + /* Empty lines */ + 'at-rule-empty-line-before': [ + 'always', + { + except: ['blockless-after-same-name-blockless', 'first-nested'], + ignore: ['after-comment'], + ignoreAtRules: ['import'], + }, + ], // ✅ + // ✅ comment-empty-line-before + // ✅ custom-property-empty-line-before + // ✅ declaration-empty-line-before + // ✅ rule-empty-line-before + + /* Max & min */ + // ✅ declaration-block-single-line-max-declarations + // declaration-property-max-values + // max-nesting-depth + // ✅ number-max-precision + // selector-max-attribute + // selector-max-class + // selector-max-combinators + // selector-max-compound-selectors 'selector-max-id': 0, + // selector-max-pseudo-class + // selector-max-specificity + // selector-max-type 'selector-max-universal': [ 1, { ignoreAfterCombinators: ['+'], }, ], - 'value-keyword-case': [ - 'lower', - { - camelCaseSvgKeywords: true, - }, - ], + // time-min-milliseconds + + /* Notation */ + // ✅ alpha-value-notation + // ✅ color-function-notation + // ✅ color-hex-length + // font-weight-notation + // ✅ hue-degree-notation + // ✅ import-notation + // ✅ keyframe-selector-notation + // ✅ lightness-notation + // ✅ media-feature-range-notation + // ✅ selector-not-notation + // ✅ selector-pseudo-element-colon-notation + + /* Pattern */ + // comment-pattern + // ✅ custom-media-pattern + 'custom-property-pattern': '^_?([a-z][a-z0-9]*)(-[a-z0-9]+)*$', + // ✅ keyframes-name-pattern + // ✅ selector-class-pattern + // ✅ selector-id-pattern + // selector-nested-pattern + + /* Quotes */ + // ✅ font-family-name-quotes + // ✅ function-url-quotes + // ✅ selector-attribute-quotes + + /* Redundant */ + // ✅ declaration-block-no-redundant-longhand-properties + // ✅ shorthand-property-no-redundant-values + + /* Whitespace inside */ + // ✅ comment-whitespace-inside + /** + * order + */ 'order/order': [ [ 'custom-properties',