feat(parse/css): add option to parse Tailwind v4 directives

.changeset/tasty-hairs-shop.md

@@ -0,0 +1,17 @@
+---
+"@biomejs/biome": minor
+---
+
+Added a new CSS parser option `tailwindDirectives`. Enabling this option will allow all of Tailwind v4's syntax additions to be parsed by Biome.
+
+You can enable this by setting `css.parser.tailwindDirectives` to `true` in your Biome configuration.
+
+```json
+{
+  "css": {
+    "parser": {
+      "tailwindDirectives": true
+    }
+  }
+}
+```

crates/biome_configuration/src/css.rs

@@ -35,6 +35,7 @@ pub struct CssConfiguration {
 
 pub type CssAllowWrongLineCommentsEnabled = Bool<false>;
 pub type CssModulesEnabled = Bool<false>;
+pub type CssTailwindDirectivesEnabled = Bool<false>;
 
 /// Options that changes how the CSS parser behaves
 #[derive(
@@ -50,6 +51,10 @@ pub struct CssParserConfiguration {
     /// Enables parsing of CSS Modules specific features.
     #[bpaf(hide)]
     pub css_modules: Option<CssModulesEnabled>,
+
+    /// Enables parsing of Tailwind CSS 4.0 directives and functions.
+    #[bpaf(hide)]
+    pub tailwind_directives: Option<CssTailwindDirectivesEnabled>,
 }
 
 pub type CssFormatterEnabled = Bool<true>;

crates/biome_css_analyze/src/assist/source/use_sorted_properties.rs

@@ -268,6 +268,9 @@ impl RecessOrderMember {
                                 NodeKindOrder::CustomProperty
                             }
                             AnyCssDeclarationName::CssIdentifier(_) => NodeKindOrder::Declaration,
+                            AnyCssDeclarationName::TwValueThemeReference(_) => {
+                                NodeKindOrder::Declaration
+                            }
                         }
                     }
                 }