No description
3aadba7cc1
This PR fixes an issue where a compound variant with a modifier such as `not-group-hover/name:flex` would not generate anything because the `/name` modifier belongs to the `not` variant, and not the compounded `group-hover` variant. This PR is a **workaround** (and definitely not perfect) by special casing the `not`, `has`, and `in` variants such that their modifiers are moved internally to the sub variant as-if the `/name` existed on `group-hover`. We don't do it for other compound variants such as `group` and `peer` because then `group-peer-focus/name:underline` would result in a breaking change: ```diff - .group-peer-focus\\/name\\:flex:is(:where(.group\\/name):is(:where(.peer):focus ~ *) *) + .group-peer-focus\/name\:flex:is(:where(.group):is(:where(.peer\/name):focus ~ *) *) ``` In case the diff is not clear, the name has moved: <img width="1219" height="78" alt="image" src="https://github.com/user-attachments/assets/dce7bc95-9d93-452d-a275-b3891a05a1a4" /> This is also a limited workaround, because if you need multiple modifiers it won't work. I would've loved to special case this _inside_ the `not`, `has`, and `in` code that handles these variants, but we handle the variants in a depth-first way, so by the time you are handling the `not` variant, the sub variant was already handled... In a perfect world, you can use something like `not-group/name-hover` but then it becomes unambiguous because is `name` the name, is `name-hover`? ## Test plan Added a new test that wouldn't generate anything before this fix. Fixes: #15772 |
||
|---|---|---|
| .github | ||
| crates | ||
| integrations | ||
| packages | ||
| patches | ||
| playgrounds | ||
| scripts | ||
| .gitattributes | ||
| .gitignore | ||
| .npmrc | ||
| .prettierignore | ||
| Cargo.lock | ||
| Cargo.toml | ||
| CHANGELOG.md | ||
| LICENSE | ||
| package.json | ||
| pnpm-lock.yaml | ||
| pnpm-workspace.yaml | ||
| README.md | ||
| rust-toolchain.toml | ||
| turbo.json | ||
| vitest.workspace.ts | ||
A utility-first CSS framework for rapidly building custom user interfaces.
Documentation
For full documentation, visit tailwindcss.com.
Community
For help, discussion about best practices, or feature ideas:
Discuss Tailwind CSS on GitHub
Contributing
If you're interested in contributing to Tailwind CSS, please read our contributing docs before submitting a pull request.