tailwindcss 3.0.18 → 3.0.19

package/CHANGELOG.md

@@ -7,7 +7,18 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
-- Nothing yet!
+Nothing yet!
+
+## [3.0.19] - 2022-02-07
+
+### Fixed
+
+- Fix preflight border color fallback ([#7288](https://github.com/tailwindlabs/tailwindcss/pull/7288))
+- Correctly parse shadow lengths without a leading zero ([#7289](https://github.com/tailwindlabs/tailwindcss/pull/7289))
+- Don't crash when scanning extremely long class candidates ([#7331](https://github.com/tailwindlabs/tailwindcss/pull/7331))
+- Use less hacky fix for URLs detected as custom properties ([#7275](https://github.com/tailwindlabs/tailwindcss/pull/7275))
+- Correctly generate negative utilities when dash is before the prefix ([#7295](https://github.com/tailwindlabs/tailwindcss/pull/7295))
+- Detect prefixed negative utilities in the safelist ([#7295](https://github.com/tailwindlabs/tailwindcss/pull/7295))
 
 ## [3.0.18] - 2022-01-28
 
@@ -1836,7 +1847,8 @@ No release notes
 
 - Everything!
 
-[unreleased]: https://github.com/tailwindlabs/tailwindcss/compare/v3.0.18...HEAD
+[unreleased]: https://github.com/tailwindlabs/tailwindcss/compare/v3.0.19...HEAD
+[3.0.19]: https://github.com/tailwindlabs/tailwindcss/compare/v3.0.18...v3.0.19
 [3.0.18]: https://github.com/tailwindlabs/tailwindcss/compare/v3.0.17...v3.0.18
 [3.0.17]: https://github.com/tailwindlabs/tailwindcss/compare/v3.0.16...v3.0.17
 [3.0.16]: https://github.com/tailwindlabs/tailwindcss/compare/v3.0.15...v3.0.16

package/LICENSE

@@ -1,7 +1,6 @@
 MIT License
 
-Copyright (c) Adam Wathan <adam.wathan@gmail.com>
-Copyright (c) Jonathan Reinink <jonathan@reinink.ca>
+Copyright (c) Tailwind Labs, Inc.
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

package/lib/css/preflight.css

@@ -9,7 +9,7 @@
   box-sizing: border-box; /* 1 */
   border-width: 0; /* 2 */
   border-style: solid; /* 2 */
-  border-color: theme('borderColor.DEFAULT', 'currentColor'); /* 2 */
+  border-color: theme('borderColor.DEFAULT', currentColor); /* 2 */
 }
 
 ::before,

package/lib/lib/generateRules.js

@@ -33,32 +33,32 @@ function getClassNameFromSelector(selector) {
 // Example with dynamic classes:
 // ['grid-cols', '[[linename],1fr,auto]']
 // ['grid', 'cols-[[linename],1fr,auto]']
-function* candidatePermutations(candidate, lastIndex = Infinity) {
-    if (lastIndex < 0) {
-        return;
-    }
-    let dashIdx;
-    if (lastIndex === Infinity && candidate.endsWith(']')) {
-        let bracketIdx = candidate.indexOf('[');
-        // If character before `[` isn't a dash or a slash, this isn't a dynamic class
-        // eg. string[]
-        dashIdx = [
-            '-',
-            '/'
-        ].includes(candidate[bracketIdx - 1]) ? bracketIdx - 1 : -1;
-    } else {
-        dashIdx = candidate.lastIndexOf('-', lastIndex);
-    }
-    if (dashIdx < 0) {
-        return;
+function* candidatePermutations(candidate) {
+    let lastIndex = Infinity;
+    while(lastIndex >= 0){
+        let dashIdx;
+        if (lastIndex === Infinity && candidate.endsWith(']')) {
+            let bracketIdx = candidate.indexOf('[');
+            // If character before `[` isn't a dash or a slash, this isn't a dynamic class
+            // eg. string[]
+            dashIdx = [
+                '-',
+                '/'
+            ].includes(candidate[bracketIdx - 1]) ? bracketIdx - 1 : -1;
+        } else {
+            dashIdx = candidate.lastIndexOf('-', lastIndex);
+        }
+        if (dashIdx < 0) {
+            break;
+        }
+        let prefix = candidate.slice(0, dashIdx);
+        let modifier = candidate.slice(dashIdx + 1);
+        yield [
+            prefix,
+            modifier
+        ];
+        lastIndex = dashIdx - 1;
     }
-    let prefix = candidate.slice(0, dashIdx);
-    let modifier = candidate.slice(dashIdx + 1);
-    yield [
-        prefix,
-        modifier
-    ];
-    yield* candidatePermutations(candidate, dashIdx - 1);
 }
 function applyPrefix(matches, context) {
     if (matches.length === 0 || context.tailwindConfig.prefix === '') {
@@ -72,8 +72,14 @@ function applyPrefix(matches, context) {
                     match[1].clone()
                 ]
             });
+            let classCandidate = match[1].raws.tailwind.classCandidate;
             container.walkRules((r)=>{
-                r.selector = (0, _prefixSelector).default(context.tailwindConfig.prefix, r.selector);
+                // If this is a negative utility with a dash *before* the prefix we
+                // have to ensure that the generated selector matches the candidate
+                // Not doing this will cause `-tw-top-1` to generate the class `.tw--top-1`
+                // The disconnect between candidate <-> class can cause @apply to hard crash.
+                let shouldPrependNegative = classCandidate.startsWith('-');
+                r.selector = (0, _prefixSelector).default(context.tailwindConfig.prefix, r.selector, shouldPrependNegative);
             });
             match[1] = container.nodes[0];
         }
@@ -265,10 +271,32 @@ function parseRules(rule, cache, options = {}) {
 }
 const IS_VALID_PROPERTY_NAME = /^[a-z_-]/;
 function isValidPropName(name) {
-    // TODO: properly fix this!
-    return IS_VALID_PROPERTY_NAME.test(name) && !name.startsWith('http');
+    return IS_VALID_PROPERTY_NAME.test(name);
+}
+/**
+ * @param {string} declaration
+ * @returns {boolean}
+ */ function looksLikeUri(declaration) {
+    // Quick bailout for obvious non-urls
+    // This doesn't support schemes that don't use a leading // but that's unlikely to be a problem
+    if (!declaration.includes('://')) {
+        return false;
+    }
+    try {
+        const url = new URL(declaration);
+        return url.scheme !== '' && url.host !== '';
+    } catch (err) {
+        // Definitely not a valid url
+        return false;
+    }
 }
 function isParsableCssValue(property, value) {
+    // We don't want to to treat [https://example.com] as a custom property
+    // Even though, according to the CSS grammar, it's a totally valid CSS declaration
+    // So we short-circuit here by checking if the custom property looks like a url
+    if (looksLikeUri(`${property}:${value}`)) {
+        return false;
+    }
     try {
         _postcss.default.parse(`a{${property}:${value}}`).toResult();
         return true;
@@ -348,6 +376,14 @@ function* resolveMatchedPlugins(classCandidate, context) {
 function splitWithSeparator(input, separator) {
     return input.split(new RegExp(`\\${separator}(?![^[]*\\])`, 'g'));
 }
+function* recordCandidates(matches, classCandidate) {
+    for (const match of matches){
+        match[1].raws.tailwind = {
+            classCandidate
+        };
+        yield match;
+    }
+}
 function* resolveMatches(candidate, context) {
     let separator = context.tailwindConfig.separator;
     let [classCandidate, ...variants] = splitWithSeparator(candidate, separator).reverse();
@@ -457,7 +493,9 @@ function* resolveMatches(candidate, context) {
             ]);
             continue;
         }
-        matches = applyPrefix(matches.flat(), context);
+        matches = matches.flat();
+        matches = Array.from(recordCandidates(matches, classCandidate));
+        matches = applyPrefix(matches, context);
         if (important) {
             matches = applyImportant(matches, context);
         }

package/lib/lib/setupContextUtils.js

@@ -673,18 +673,31 @@ function registerPlugins(plugins, context) {
         }
         if (checks.length > 0) {
             let patternMatchingCount = new Map();
+            let prefixLength = context.tailwindConfig.prefix.length;
             for (let util of classList){
                 let utils = Array.isArray(util) ? (()=>{
                     let [utilName, options] = util;
                     var ref;
-                    let classes = Object.keys((ref = options === null || options === void 0 ? void 0 : options.values) !== null && ref !== void 0 ? ref : {}).map((value)=>(0, _nameClass).formatClass(utilName, value)
+                    let values = Object.keys((ref = options === null || options === void 0 ? void 0 : options.values) !== null && ref !== void 0 ? ref : {});
+                    let classes = values.map((value)=>(0, _nameClass).formatClass(utilName, value)
                     );
                     if (options === null || options === void 0 ? void 0 : options.supportsNegativeValues) {
+                        // This is the normal negated version
+                        // e.g. `-inset-1` or `-tw-inset-1`
                         classes = [
                             ...classes,
                             ...classes.map((cls)=>'-' + cls
                             )
                         ];
+                        // This is the negated version *after* the prefix
+                        // e.g. `tw--inset-1`
+                        // The prefix is already attached to util name
+                        // So we add the negative after the prefix
+                        classes = [
+                            ...classes,
+                            ...classes.map((cls)=>cls.slice(0, prefixLength) + '-' + cls.slice(prefixLength)
+                            ), 
+                        ];
                     }
                     return classes;
                 })() : [

package/lib/util/parseBoxShadowValue.js

@@ -15,7 +15,7 @@ let COMMA = /\,(?![^(]*\))/g // Comma separator that is not located between brac
 ;
 let SPACE = /\ +(?![^(]*\))/g // Similar to the one above, but with spaces instead.
 ;
-let LENGTH = /^-?(\d+)(.*?)$/g;
+let LENGTH = /^-?(\d+|\.\d+)(.*?)$/g;
 function parseBoxShadowValue(input) {
     let shadows = input.split(COMMA);
     return shadows.map((shadow)=>{

package/lib/util/prefixSelector.js

@@ -4,18 +4,17 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = _default;
 var _postcssSelectorParser = _interopRequireDefault(require("postcss-selector-parser"));
-var _tap = require("./tap");
 function _interopRequireDefault(obj) {
     return obj && obj.__esModule ? obj : {
         default: obj
     };
 }
-function _default(prefix, selector) {
+function _default(prefix, selector, prependNegative = false) {
     return (0, _postcssSelectorParser).default((selectors)=>{
         selectors.walkClasses((classSelector)=>{
-            (0, _tap).tap(classSelector.value, (baseClass)=>{
-                classSelector.value = `${prefix}${baseClass}`;
-            });
+            let baseClass = classSelector.value;
+            let shouldPlaceNegativeBeforePrefix = prependNegative && baseClass.startsWith('-');
+            classSelector.value = shouldPlaceNegativeBeforePrefix ? `-${prefix}${baseClass.slice(1)}` : `${prefix}${baseClass}`;
         });
     }).processSync(selector);
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tailwindcss",
-  "version": "3.0.18",
+  "version": "3.0.19",
   "description": "A utility-first CSS framework for rapidly building custom user interfaces.",
   "license": "MIT",
   "main": "lib/index.js",
@@ -12,11 +12,6 @@
     "tailwind": "lib/cli.js",
     "tailwindcss": "lib/cli.js"
   },
-  "contributors": [
-    "Adam Wathan <adam.wathan@gmail.com>",
-    "Jonathan Reinink <jonathan@reinink.ca>",
-    "David Hemphill <davidlee.hemphill@gmail.com>"
-  ],
   "scripts": {
     "preswcify": "npm run generate:plugin-list && rimraf lib",
     "swcify": "swc src --out-dir lib --copy-files",
@@ -46,11 +41,11 @@
     "@swc/cli": "^0.1.55",
     "@swc/core": "^1.2.127",
     "@swc/jest": "^0.2.17",
-    "@swc/register": "^0.1.7",
+    "@swc/register": "^0.1.10",
     "autoprefixer": "^10.4.2",
-    "cssnano": "^5.0.15",
+    "cssnano": "^5.0.16",
     "esbuild": "^0.14.10",
-    "eslint": "^8.6.0",
+    "eslint": "^8.8.0",
     "eslint-config-prettier": "^8.3.0",
     "eslint-plugin-prettier": "^4.0.0",
     "jest": "^27.4.7",
@@ -83,7 +78,7 @@
     "postcss-selector-parser": "^6.0.9",
     "postcss-value-parser": "^4.2.0",
     "quick-lru": "^5.1.1",
-    "resolve": "^1.21.0"
+    "resolve": "^1.22.0"
   },
   "browserslist": [
     "> 1%",