tailwindcss 3.4.5 → 3.4.6

package/CHANGELOG.md

@@ -9,6 +9,16 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 - Nothing yet!
 
+## [3.4.6] - 2024-07-16
+
+### Fixed
+
+- Fix detection of some utilities in Slim/Pug templates ([#14006](https://github.com/tailwindlabs/tailwindcss/pull/14006))
+
+### Changed
+
+- Loosen `:is()` wrapping rules when using an important selector ([#13900](https://github.com/tailwindlabs/tailwindcss/pull/13900))
+
 ## [3.4.5] - 2024-07-15
 
 ### Fixed
@@ -2395,7 +2405,8 @@ No release notes
 
 - Everything!
 
-[unreleased]: https://github.com/tailwindlabs/tailwindcss/compare/v3.4.5...HEAD
+[unreleased]: https://github.com/tailwindlabs/tailwindcss/compare/v3.4.6...HEAD
+[3.4.6]: https://github.com/tailwindlabs/tailwindcss/compare/v3.4.5...v3.4.6
 [3.4.5]: https://github.com/tailwindlabs/tailwindcss/compare/v3.4.4...v3.4.5
 [3.4.4]: https://github.com/tailwindlabs/tailwindcss/compare/v3.4.3...v3.4.4
 [3.4.3]: https://github.com/tailwindlabs/tailwindcss/compare/v3.4.2...v3.4.3

package/lib/lib/defaultExtractor.js

@@ -74,7 +74,7 @@ function defaultExtractor(context) {
                 // If the next segment is a number, discard both, for example seeing
                 // `px-1` and `5` means the real candidate was `px-1.5` which is already
                 // captured.
-                let next = parseInt(segments[idx + 1]);
+                let next = Number(segments[idx + 1]);
                 if (isNaN(next)) {
                     results.push(segment);
                 } else {

package/lib/util/applyImportantSelector.js

@@ -18,9 +18,11 @@ function _interop_require_default(obj) {
 function applyImportantSelector(selector, important) {
     let sel = (0, _postcssselectorparser.default)().astSync(selector);
     sel.each((sel)=>{
-        // Wrap with :is if it's not already wrapped
-        let isWrapped = sel.nodes[0].type === "pseudo" && sel.nodes[0].value === ":is" && sel.nodes.every((node)=>node.type !== "combinator");
-        if (!isWrapped) {
+        // For nesting, we only need to wrap a selector with :is() if it has a top-level combinator,
+        // e.g. `.dark .text-white`, to be independent of DOM order. Any other selector, including
+        // combinators inside of pseudos like `:where()`, are ok to nest.
+        let shouldWrap = sel.nodes.some((node)=>node.type === "combinator");
+        if (shouldWrap) {
             sel.nodes = [
                 _postcssselectorparser.default.pseudo({
                     value: ":is",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tailwindcss",
-  "version": "3.4.5",
+  "version": "3.4.6",
   "description": "A utility-first CSS framework for rapidly building custom user interfaces.",
   "license": "MIT",
   "main": "lib/index.js",

package/src/lib/defaultExtractor.js

@@ -32,7 +32,7 @@ export function defaultExtractor(context) {
         // If the next segment is a number, discard both, for example seeing
         // `px-1` and `5` means the real candidate was `px-1.5` which is already
         // captured.
-        let next = parseInt(segments[idx + 1])
+        let next = Number(segments[idx + 1])
         if (isNaN(next)) {
           results.push(segment)
         } else {

package/src/util/applyImportantSelector.js

@@ -5,13 +5,12 @@ export function applyImportantSelector(selector, important) {
   let sel = parser().astSync(selector)
 
   sel.each((sel) => {
-    // Wrap with :is if it's not already wrapped
-    let isWrapped =
-      sel.nodes[0].type === 'pseudo' &&
-      sel.nodes[0].value === ':is' &&
-      sel.nodes.every((node) => node.type !== 'combinator')
+    // For nesting, we only need to wrap a selector with :is() if it has a top-level combinator,
+    // e.g. `.dark .text-white`, to be independent of DOM order. Any other selector, including
+    // combinators inside of pseudos like `:where()`, are ok to nest.
+    let shouldWrap = sel.nodes.some((node) => node.type === 'combinator')
 
-    if (!isWrapped) {
+    if (shouldWrap) {
       sel.nodes = [
         parser.pseudo({
           value: ':is',