fix(noUnknownProperty): remove explicit ignore for composes

.changeset/social-groups-beg.md

@@ -0,0 +1,5 @@
+---
+"@biomejs/biome": patch
+---
+
+The [noUnknownProperty](https://biomejs.dev/linter/rules/no-unknown-property/) now only ignores `composes` property when `cssModules` is enabled in parser settings

crates/biome_css_analyze/src/lint/correctness/no_unknown_property.rs

@@ -79,9 +79,6 @@ impl Rule for NoUnknownProperty {
         let property_name = node.name().ok()?.to_trimmed_text();
         let property_name_lower = property_name.to_ascii_lowercase_cow();
         if !property_name_lower.starts_with("--")
-            // Ignore `composes` property.
-            // See https://github.com/css-modules/css-modules/blob/master/docs/composition.md for more details.
-            && property_name_lower != "composes"
             && !is_known_properties(&property_name_lower)
             && !vendor_prefixed(&property_name_lower)
         {

crates/biome_css_analyze/tests/specs/correctness/noUnknownProperty/invalid.css

@@ -5,3 +5,14 @@ a {
 a {
   my-property: 1;
 }
+
+/* Composition is only valid when css-modules is enabled */
+.classA {
+  color: green;
+  background: red;
+}
+
+.classB {
+  composes: classA;
+  color: yellow;
+}

crates/biome_css_analyze/tests/specs/correctness/noUnknownProperty/invalid.css.snap

@@ -13,6 +13,17 @@ a {
   my-property: 1;
 }
 
+/* Composition is only valid when css-modules is enabled */
+.classA {
+  color: green;
+  background: red;
+}
+
+.classB {
+  composes: classA;
+  color: yellow;
+}
+
 ```
 
 # Diagnostics
@@ -51,3 +62,21 @@ invalid.css:6:3 lint/correctness/noUnknownProperty ━━━━━━━━━
 
 
 ```
+
+```
+invalid.css:16:3 lint/correctness/noUnknownProperty ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  × Unknown property is not allowed.
+
+    15 │ .classB {
+  > 16 │   composes: classA;
+       │   ^^^^^^^^
+    17 │   color: yellow;
+    18 │ }
+
+  i See CSS Specifications and browser specific properties for more details.
+
+  i To resolve this issue, replace the unknown property with a valid CSS property.
+
+
+```

crates/biome_css_analyze/tests/specs/correctness/noUnknownProperty/valid.css

@@ -57,17 +57,6 @@ a {
   --custom-property: 10px;
 }
 
-/* Composition */
-.classA {
-  color: green;
-  background: red;
-}
-
-.classB {
-  composes: classA;
-  color: yellow;
-}
-
 /* View Transition navigation property (should not be flagged) */
 view-transition {
   navigation: auto;

crates/biome_css_analyze/tests/specs/correctness/noUnknownProperty/valid.css.snap

@@ -63,17 +63,6 @@ a {
   --custom-property: 10px;
 }
 
-/* Composition */
-.classA {
-  color: green;
-  background: red;
-}
-
-.classB {
-  composes: classA;
-  color: yellow;
-}
-
 /* View Transition navigation property (should not be flagged) */
 view-transition {
   navigation: auto;

crates/biome_css_analyze/tests/specs/correctness/noUnknownProperty/validCssModulesComposition.css

@@ -0,0 +1,11 @@
+/* should not generate diagnostics */
+/* Composition */
+.classA {
+  color: green;
+  background: red;
+}
+
+.classB {
+  composes: classA;
+  color: yellow;
+}

crates/biome_css_analyze/tests/specs/correctness/noUnknownProperty/validCssModulesComposition.css.snap

@@ -0,0 +1,19 @@
+---
+source: crates/biome_css_analyze/tests/spec_tests.rs
+expression: validCssModulesComposition.css
+---
+# Input
+```css
+/* should not generate diagnostics */
+/* Composition */
+.classA {
+  color: green;
+  background: red;
+}
+
+.classB {
+  composes: classA;
+  color: yellow;
+}
+
+```

crates/biome_css_analyze/tests/specs/correctness/noUnknownProperty/validCssModulesComposition.options.json

@@ -0,0 +1,7 @@
+{
+  "css": {
+    "parser": {
+      "cssModules": true
+    }
+  }
+}