Oxide: Extract arbitrary container queries (#16984)

Closes #16982

Handle the case of variants looking like this: `@[32rem]:flex`.

## Test plan

Added regression tests

Co-authored-by: Robin Malfait <malfait.robin@gmail.com>
This commit is contained in:
Philipp Spiess 2025-03-06 11:55:42 +01:00 committed by GitHub
parent 4a0236471e
commit 617b7abb81
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 31 additions and 0 deletions

View File

@ -21,6 +21,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
- Ensure classes containing `--` are extracted correctly ([#16972](https://github.com/tailwindlabs/tailwindcss/pull/16972))
- Ensure classes containing numbers followed by dash or underscore are extracted correctly ([#16980](https://github.com/tailwindlabs/tailwindcss/pull/16980))
- Ensure arbitrary container queries are extracted correctly ([#16984](https://github.com/tailwindlabs/tailwindcss/pull/16984))
## [4.0.10] - 2025-03-05

View File

@ -833,6 +833,20 @@ mod tests {
);
}
// https://github.com/tailwindlabs/tailwindcss/issues/16982
#[test]
fn test_arbitrary_container_queries_syntax() {
assert_extract_sorted_candidates(
r#"<div class="@md:flex @max-md:flex @-[36rem]:flex @[36rem]:flex"></div>"#,
vec![
"@md:flex",
"@max-md:flex",
"@-[36rem]:flex",
"@[36rem]:flex",
],
);
}
// https://github.com/tailwindlabs/tailwindcss/issues/16978
#[test]
fn test_classes_containing_number_followed_by_dash_or_underscore() {

View File

@ -169,6 +169,17 @@ impl Machine for NamedVariantMachine {
_ => return self.restart(),
},
// Start of an arbitrary value
//
// E.g.: `@[state=pending]:`.
// ^
Class::OpenBracket => {
return match self.arbitrary_value_machine.next(cursor) {
MachineState::Idle => self.restart(),
MachineState::Done(_) => self.parse_arbitrary_end(cursor),
};
}
Class::Underscore => match cursor.next.into() {
// Valid characters _if_ followed by another valid character. These characters are
// only valid inside of the variant but not at the end of the variant.
@ -360,6 +371,11 @@ mod tests {
vec!["group-[data-state=pending]/name:"],
),
("supports-(--foo)/name:flex", vec!["supports-(--foo)/name:"]),
// Container queries
("@md:flex", vec!["@md:"]),
("@max-md:flex", vec!["@max-md:"]),
("@-[36rem]:flex", vec!["@-[36rem]:"]),
("@[36rem]:flex", vec!["@[36rem]:"]),
// --------------------------------------------------------
// Exceptions: