tailwindcss 3.1.0 → 3.1.1

package/CHANGELOG.md

@@ -9,6 +9,15 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 - Nothing yet!
 
+## [3.1.1] - 2022-06-09
+
+### Fixed
+
+- Fix candidate extractor regression ([#8558](https://github.com/tailwindlabs/tailwindcss/pull/8558))
+- Split `::backdrop` into separate defaults group ([#8567](https://github.com/tailwindlabs/tailwindcss/pull/8567))
+- Fix postcss plugin type ([#8564](https://github.com/tailwindlabs/tailwindcss/pull/8564))
+- Fix class detection in markdown code fences and slim templates ([#8569](https://github.com/tailwindlabs/tailwindcss/pull/8569))
+
 ## [3.1.0] - 2022-06-08
 
 ### Fixed
@@ -1952,7 +1961,8 @@ No release notes
 
 - Everything!
 
-[unreleased]: https://github.com/tailwindlabs/tailwindcss/compare/v3.1.0...HEAD
+[unreleased]: https://github.com/tailwindlabs/tailwindcss/compare/v3.1.1...HEAD
+[3.1.1]: https://github.com/tailwindlabs/tailwindcss/compare/v3.1.0...v3.1.1
 [3.1.0]: https://github.com/tailwindlabs/tailwindcss/compare/v3.0.24...v3.1.0
 [3.0.24]: https://github.com/tailwindlabs/tailwindcss/compare/v3.0.23...v3.0.24
 [3.0.23]: https://github.com/tailwindlabs/tailwindcss/compare/v3.0.22...v3.0.23

package/lib/lib/defaultExtractor.js

@@ -62,7 +62,7 @@ function* buildRegExps(context) {
     let variantGroupingEnabled = (0, _featureFlagsJs).flagEnabled(context.tailwindConfig, "variantGrouping");
     let utility = regex.any([
         // Arbitrary properties
-        /\[[^\s:'"]+:[^\s\]]+\]/,
+        /\[[^\s:'"`]+:[^\s\]]+\]/,
         // Utilities
         regex.pattern([
             // Utility Name / Group Name
@@ -75,7 +75,7 @@ function* buildRegExps(context) {
                     // Not immediately followed by an `{[(`
                     /(?![{([]])/,
                     // optionally followed by an opacity modifier
-                    /(?:\/[^\s'"\\$]*)?/, 
+                    /(?:\/[^\s'"`\\><$]*)?/, 
                 ]),
                 regex.pattern([
                     // Arbitrary values
@@ -83,10 +83,10 @@ function* buildRegExps(context) {
                     // Not immediately followed by an `{[(`
                     /(?![{([]])/,
                     // optionally followed by an opacity modifier
-                    /(?:\/[^\s'"\\$]*)?/, 
+                    /(?:\/[^\s'"`\\$]*)?/, 
                 ]),
                 // Normal values w/o quotes — may include an opacity modifier
-                /[-\/][^\s'"\\$={]*/, 
+                /[-\/][^\s'"`\\$={><]*/, 
             ])), 
         ]), 
     ]);
@@ -95,11 +95,11 @@ function* buildRegExps(context) {
         "((?=((",
         regex.any([
             regex.pattern([
-                /([^\s"'\[\\]+-)?\[[^\s"'\\]+\]/,
+                /([^\s"'`\[\\]+-)?\[[^\s"'`\\]+\]/,
                 separator
             ]),
             regex.pattern([
-                /[^\s"'\[\\]+/,
+                /[^\s"'`\[\\]+/,
                 separator
             ]), 
         ], true),
@@ -121,8 +121,8 @@ function* buildRegExps(context) {
             utility, 
         ]) : utility, 
     ]);
-// 5. Inner matches
-// yield /[^<>"'`\s.(){}[\]#=%$]*[^<>"'`\s.(){}[\]#=%:$]/g
+    // 5. Inner matches
+    yield /[^<>"'`\s.(){}[\]#=%$]*[^<>"'`\s.(){}[\]#=%:$]/g;
 }
 // We want to capture any "special" characters
 // AND the characters immediately following them (if there is one)

package/lib/lib/evaluateTailwindFunctions.js

@@ -140,7 +140,7 @@ let nodeTypePropertyMap = {
 function _default({ tailwindConfig: config  }) {
     let functions = {
         theme: (node, path, ...defaultValue)=>{
-            let matches = path.match(/^([^\/\s]+)(?:\s*\/\s*([^\/\s]+))$/);
+            let matches = path.match(/^([^\s]+)(?![^\[]*\])(?:\s*\/\s*([^\/\s]+))$/);
             let alpha = undefined;
             if (matches) {
                 path = matches[1];

package/lib/lib/resolveDefaultsAtRules.js

@@ -23,52 +23,66 @@ function resolveDefaultsAtRules({ tailwindConfig  }) {
             variableNodeMap.get(variable).add(rule.parent);
             rule.remove();
         });
-        for (let universal of universals){
-            /** @type {Map<string, Set<string>>} */ let selectorGroups = new Map();
-            var ref;
-            let rules = (ref = variableNodeMap.get(universal.params)) !== null && ref !== void 0 ? ref : [];
-            for (let rule of rules){
-                for (let selector of extractElementSelector(rule.selector)){
-                    // If selector contains a vendor prefix after a pseudo element or class,
-                    // we consider them separately because merging the declarations into
-                    // a single rule will cause browsers that do not understand the
-                    // vendor prefix to throw out the whole rule
-                    let selectorGroupName = selector.includes(":-") || selector.includes("::-") ? selector : "__DEFAULT__";
-                    var ref1;
-                    let selectors = (ref1 = selectorGroups.get(selectorGroupName)) !== null && ref1 !== void 0 ? ref1 : new Set();
-                    selectorGroups.set(selectorGroupName, selectors);
-                    selectors.add(selector);
+        if ((0, _featureFlags).flagEnabled(tailwindConfig, "optimizeUniversalDefaults")) {
+            for (let universal of universals){
+                /** @type {Map<string, Set<string>>} */ let selectorGroups = new Map();
+                var ref;
+                let rules = (ref = variableNodeMap.get(universal.params)) !== null && ref !== void 0 ? ref : [];
+                for (let rule of rules){
+                    for (let selector of extractElementSelector(rule.selector)){
+                        // If selector contains a vendor prefix after a pseudo element or class,
+                        // we consider them separately because merging the declarations into
+                        // a single rule will cause browsers that do not understand the
+                        // vendor prefix to throw out the whole rule
+                        let selectorGroupName = selector.includes(":-") || selector.includes("::-") ? selector : "__DEFAULT__";
+                        var ref1;
+                        let selectors = (ref1 = selectorGroups.get(selectorGroupName)) !== null && ref1 !== void 0 ? ref1 : new Set();
+                        selectorGroups.set(selectorGroupName, selectors);
+                        selectors.add(selector);
+                    }
                 }
-            }
-            if ((0, _featureFlags).flagEnabled(tailwindConfig, "optimizeUniversalDefaults")) {
-                if (selectorGroups.size === 0) {
-                    universal.remove();
-                    continue;
-                }
-                for (let [, selectors] of selectorGroups){
-                    let universalRule = _postcss.default.rule({
-                        source: universal.source
-                    });
-                    universalRule.selectors = [
-                        ...selectors
-                    ];
-                    universalRule.append(universal.nodes.map((node)=>node.clone()));
-                    universal.before(universalRule);
+                if ((0, _featureFlags).flagEnabled(tailwindConfig, "optimizeUniversalDefaults")) {
+                    if (selectorGroups.size === 0) {
+                        universal.remove();
+                        continue;
+                    }
+                    for (let [, selectors] of selectorGroups){
+                        let universalRule = _postcss.default.rule({
+                            source: universal.source
+                        });
+                        universalRule.selectors = [
+                            ...selectors
+                        ];
+                        universalRule.append(universal.nodes.map((node)=>node.clone()));
+                        universal.before(universalRule);
+                    }
                 }
-            } else {
-                let universalRule = _postcss.default.rule({
-                    source: universal.source
-                });
-                universalRule.selectors = [
+                universal.remove();
+            }
+        } else if (universals.size) {
+            let universalRule = _postcss.default.rule({
+                selectors: [
                     "*",
                     "::before",
-                    "::after",
-                    "::backdrop"
-                ];
+                    "::after"
+                ]
+            });
+            for (let universal of universals){
                 universalRule.append(universal.nodes);
-                universal.before(universalRule);
+                if (!universalRule.parent) {
+                    universal.before(universalRule);
+                }
+                if (!universalRule.source) {
+                    universalRule.source = universal.source;
+                }
+                universal.remove();
             }
-            universal.remove();
+            let backdropRule = universalRule.clone({
+                selectors: [
+                    "::backdrop"
+                ]
+            });
+            universalRule.after(backdropRule);
         }
     };
 }

package/package.json

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

package/src/lib/defaultExtractor.js

@@ -25,7 +25,7 @@ function* buildRegExps(context) {
 
   let utility = regex.any([
     // Arbitrary properties
-    /\[[^\s:'"]+:[^\s\]]+\]/,
+    /\[[^\s:'"`]+:[^\s\]]+\]/,
 
     // Utilities
     regex.pattern([
@@ -43,7 +43,7 @@ function* buildRegExps(context) {
             /(?![{([]])/,
 
             // optionally followed by an opacity modifier
-            /(?:\/[^\s'"\\$]*)?/,
+            /(?:\/[^\s'"`\\><$]*)?/,
           ]),
 
           regex.pattern([
@@ -54,11 +54,11 @@ function* buildRegExps(context) {
             /(?![{([]])/,
 
             // optionally followed by an opacity modifier
-            /(?:\/[^\s'"\\$]*)?/,
+            /(?:\/[^\s'"`\\$]*)?/,
           ]),
 
           // Normal values w/o quotes — may include an opacity modifier
-          /[-\/][^\s'"\\$={]*/,
+          /[-\/][^\s'"`\\$={><]*/,
         ])
       ),
     ]),
@@ -69,8 +69,8 @@ function* buildRegExps(context) {
     '((?=((',
     regex.any(
       [
-        regex.pattern([/([^\s"'\[\\]+-)?\[[^\s"'\\]+\]/, separator]),
-        regex.pattern([/[^\s"'\[\\]+/, separator]),
+        regex.pattern([/([^\s"'`\[\\]+-)?\[[^\s"'`\\]+\]/, separator]),
+        regex.pattern([/[^\s"'`\[\\]+/, separator]),
       ],
       true
     ),
@@ -91,7 +91,7 @@ function* buildRegExps(context) {
   ])
 
   // 5. Inner matches
-  // yield /[^<>"'`\s.(){}[\]#=%$]*[^<>"'`\s.(){}[\]#=%:$]/g
+  yield /[^<>"'`\s.(){}[\]#=%$]*[^<>"'`\s.(){}[\]#=%:$]/g
 }
 
 // We want to capture any "special" characters

package/src/lib/evaluateTailwindFunctions.js

@@ -162,7 +162,7 @@ let nodeTypePropertyMap = {
 export default function ({ tailwindConfig: config }) {
   let functions = {
     theme: (node, path, ...defaultValue) => {
-      let matches = path.match(/^([^\/\s]+)(?:\s*\/\s*([^\/\s]+))$/)
+      let matches = path.match(/^([^\s]+)(?![^\[]*\])(?:\s*\/\s*([^\/\s]+))$/)
       let alpha = undefined
 
       if (matches) {

package/src/lib/resolveDefaultsAtRules.js

@@ -91,56 +91,73 @@ export default function resolveDefaultsAtRules({ tailwindConfig }) {
       rule.remove()
     })
 
-    for (let universal of universals) {
-      /** @type {Map<string, Set<string>>} */
-      let selectorGroups = new Map()
+    if (flagEnabled(tailwindConfig, 'optimizeUniversalDefaults')) {
+      for (let universal of universals) {
+        /** @type {Map<string, Set<string>>} */
+        let selectorGroups = new Map()
+
+        let rules = variableNodeMap.get(universal.params) ?? []
+
+        for (let rule of rules) {
+          for (let selector of extractElementSelector(rule.selector)) {
+            // If selector contains a vendor prefix after a pseudo element or class,
+            // we consider them separately because merging the declarations into
+            // a single rule will cause browsers that do not understand the
+            // vendor prefix to throw out the whole rule
+            let selectorGroupName =
+              selector.includes(':-') || selector.includes('::-') ? selector : '__DEFAULT__'
+
+            let selectors = selectorGroups.get(selectorGroupName) ?? new Set()
+            selectorGroups.set(selectorGroupName, selectors)
+
+            selectors.add(selector)
+          }
+        }
 
-      let rules = variableNodeMap.get(universal.params) ?? []
+        if (flagEnabled(tailwindConfig, 'optimizeUniversalDefaults')) {
+          if (selectorGroups.size === 0) {
+            universal.remove()
+            continue
+          }
 
-      for (let rule of rules) {
-        for (let selector of extractElementSelector(rule.selector)) {
-          // If selector contains a vendor prefix after a pseudo element or class,
-          // we consider them separately because merging the declarations into
-          // a single rule will cause browsers that do not understand the
-          // vendor prefix to throw out the whole rule
-          let selectorGroupName =
-            selector.includes(':-') || selector.includes('::-') ? selector : '__DEFAULT__'
+          for (let [, selectors] of selectorGroups) {
+            let universalRule = postcss.rule({
+              source: universal.source,
+            })
 
-          let selectors = selectorGroups.get(selectorGroupName) ?? new Set()
-          selectorGroups.set(selectorGroupName, selectors)
+            universalRule.selectors = [...selectors]
 
-          selectors.add(selector)
+            universalRule.append(universal.nodes.map((node) => node.clone()))
+            universal.before(universalRule)
+          }
         }
-      }
 
-      if (flagEnabled(tailwindConfig, 'optimizeUniversalDefaults')) {
-        if (selectorGroups.size === 0) {
-          universal.remove()
-          continue
-        }
-
-        for (let [, selectors] of selectorGroups) {
-          let universalRule = postcss.rule({
-            source: universal.source,
-          })
+        universal.remove()
+      }
+    } else if (universals.size) {
+      let universalRule = postcss.rule({
+        selectors: ['*', '::before', '::after'],
+      })
 
-          universalRule.selectors = [...selectors]
+      for (let universal of universals) {
+        universalRule.append(universal.nodes)
 
-          universalRule.append(universal.nodes.map((node) => node.clone()))
+        if (!universalRule.parent) {
           universal.before(universalRule)
         }
-      } else {
-        let universalRule = postcss.rule({
-          source: universal.source,
-        })
 
-        universalRule.selectors = ['*', '::before', '::after', '::backdrop']
+        if (!universalRule.source) {
+          universalRule.source = universal.source
+        }
 
-        universalRule.append(universal.nodes)
-        universal.before(universalRule)
+        universal.remove()
       }
 
-      universal.remove()
+      let backdropRule = universalRule.clone({
+        selectors: ['::backdrop'],
+      })
+
+      universalRule.after(backdropRule)
     }
   }
 }

package/types/index.d.ts

@@ -1 +1,7 @@
-export type { Config } from './config.d'
+import { PluginCreator } from 'postcss'
+import type { Config } from './config.d'
+
+declare const plugin: PluginCreator<string | Config | { config: string | Config }>
+
+export { Config }
+export default plugin