tailwindcss 3.0.22 → 3.1.0

package/lib/util/formatVariantSelector.js

@@ -14,8 +14,9 @@ function _interopRequireDefault(obj) {
         default: obj
     };
 }
-let MERGE = ':merge';
-let PARENT = '&';
+var ref;
+let MERGE = ":merge";
+let PARENT = "&";
 let selectorFunctions = new Set([
     MERGE
 ]);
@@ -28,7 +29,7 @@ function formatVariantSelector(current, ...others) {
             if (existingValue !== null) {
                 let existingTarget = `${MERGE}(${incomingValue})`;
                 let splitIdx = other.indexOf(existingTarget);
-                let addition = other.slice(splitIdx + existingTarget.length).split(' ')[0];
+                let addition = other.slice(splitIdx + existingTarget.length).split(" ")[0];
                 current = current.replace(existingTarget, existingTarget + addition);
                 continue;
             }
@@ -37,23 +38,31 @@ function formatVariantSelector(current, ...others) {
     }
     return current;
 }
-function finalizeSelector(format, { selector: selector1 , candidate , context  }) {
-    var ref, ref1;
+var ref1;
+function finalizeSelector(format, { selector: selector1 , candidate , context , // Split by the separator, but ignore the separator inside square brackets:
+//
+// E.g.: dark:lg:hover:[paint-order:markers]
+//           ┬  ┬     ┬            ┬
+//           │  │     │            ╰── We will not split here
+//           ╰──┴─────┴─────────────── We will split here
+//
+base =candidate.split(new RegExp(`\\${(ref1 = context === null || context === void 0 ? void 0 : (ref = context.tailwindConfig) === null || ref === void 0 ? void 0 : ref.separator) !== null && ref1 !== void 0 ? ref1 : ":"}(?![^[]*\\])`)).pop() ,  }) {
     var ref2;
-    let separator = (ref2 = context === null || context === void 0 ? void 0 : (ref = context.tailwindConfig) === null || ref === void 0 ? void 0 : ref.separator) !== null && ref2 !== void 0 ? ref2 : ':';
-    // Split by the separator, but ignore the separator inside square brackets:
-    //
-    // E.g.: dark:lg:hover:[paint-order:markers]
-    //           ┬  ┬     ┬            ┬
-    //           │  │     │            ╰── We will not split here
-    //           ╰──┴─────┴─────────────── We will split here
-    //
-    let splitter = new RegExp(`\\${separator}(?![^[]*\\])`);
-    let base = candidate.split(splitter).pop();
-    if (context === null || context === void 0 ? void 0 : (ref1 = context.tailwindConfig) === null || ref1 === void 0 ? void 0 : ref1.prefix) {
+    let ast = (0, _postcssSelectorParser).default().astSync(selector1);
+    if (context === null || context === void 0 ? void 0 : (ref2 = context.tailwindConfig) === null || ref2 === void 0 ? void 0 : ref2.prefix) {
         format = (0, _prefixSelector).default(context.tailwindConfig.prefix, format);
     }
     format = format.replace(PARENT, `.${(0, _escapeClassName).default(candidate)}`);
+    let formatAst = (0, _postcssSelectorParser).default().astSync(format);
+    // Remove extraneous selectors that do not include the base class/candidate being matched against
+    // For example if we have a utility defined `.a, .b { color: red}`
+    // And the formatted variant is sm:b then we want the final selector to be `.sm\:b` and not `.a, .sm\:b`
+    ast.each((node)=>{
+        let hasClassesMatchingCandidate = node.some((n)=>n.type === "class" && n.value === base);
+        if (!hasClassesMatchingCandidate) {
+            node.remove();
+        }
+    });
     // Normalize escaped classes, e.g.:
     //
     // The idea would be to replace the escaped `base` in the selector with the
@@ -65,69 +74,67 @@ function finalizeSelector(format, { selector: selector1 , candidate , context  }
     //   base in selector: bg-\\[rgb\\(255\\,0\\,0\\)\\]
     //       escaped base: bg-\\[rgb\\(255\\2c 0\\2c 0\\)\\]
     //
-    selector1 = (0, _postcssSelectorParser).default((selectors)=>{
-        return selectors.walkClasses((node)=>{
-            if (node.raws && node.value.includes(base)) {
-                node.raws.value = (0, _escapeClassName).default((0, _unesc).default(node.raws.value));
-            }
-            return node;
-        });
-    }).processSync(selector1);
+    ast.walkClasses((node)=>{
+        if (node.raws && node.value.includes(base)) {
+            node.raws.value = (0, _escapeClassName).default((0, _unesc).default(node.raws.value));
+        }
+    });
     // We can safely replace the escaped base now, since the `base` section is
     // now in a normalized escaped value.
-    selector1 = selector1.replace(`.${(0, _escapeClassName).default(base)}`, format);
-    // Remove unnecessary pseudo selectors that we used as placeholders
-    return (0, _postcssSelectorParser).default((selectors)=>{
-        return selectors.map((selector2)=>{
-            selector2.walkPseudos((p)=>{
-                if (selectorFunctions.has(p.value)) {
-                    p.replaceWith(p.nodes);
-                }
-                return p;
-            });
-            // This will make sure to move pseudo's to the correct spot (the end for
-            // pseudo elements) because otherwise the selector will never work
-            // anyway.
-            //
-            // E.g.:
-            //  - `before:hover:text-center` would result in `.before\:hover\:text-center:hover::before`
-            //  - `hover:before:text-center` would result in `.hover\:before\:text-center:hover::before`
-            //
-            // `::before:hover` doesn't work, which means that we can make it work for you by flipping the order.
-            function collectPseudoElements(selector) {
-                let nodes = [];
-                for (let node of selector.nodes){
-                    if (isPseudoElement(node)) {
-                        nodes.push(node);
-                        selector.removeChild(node);
-                    }
-                    if (node === null || node === void 0 ? void 0 : node.nodes) {
-                        nodes.push(...collectPseudoElements(node));
-                    }
-                }
-                return nodes;
+    ast.walkClasses((node)=>{
+        if (node.value === base) {
+            node.replaceWith(...formatAst.nodes);
+        }
+    });
+    // This will make sure to move pseudo's to the correct spot (the end for
+    // pseudo elements) because otherwise the selector will never work
+    // anyway.
+    //
+    // E.g.:
+    //  - `before:hover:text-center` would result in `.before\:hover\:text-center:hover::before`
+    //  - `hover:before:text-center` would result in `.hover\:before\:text-center:hover::before`
+    //
+    // `::before:hover` doesn't work, which means that we can make it work for you by flipping the order.
+    function collectPseudoElements(selector) {
+        let nodes = [];
+        for (let node of selector.nodes){
+            if (isPseudoElement(node)) {
+                nodes.push(node);
+                selector.removeChild(node);
+            }
+            if (node === null || node === void 0 ? void 0 : node.nodes) {
+                nodes.push(...collectPseudoElements(node));
             }
-            let pseudoElements = collectPseudoElements(selector2);
-            if (pseudoElements.length > 0) {
-                selector2.nodes.push(pseudoElements.sort(sortSelector));
+        }
+        return nodes;
+    }
+    // Remove unnecessary pseudo selectors that we used as placeholders
+    ast.each((selector)=>{
+        selector.walkPseudos((p)=>{
+            if (selectorFunctions.has(p.value)) {
+                p.replaceWith(p.nodes);
             }
-            return selector2;
         });
-    }).processSync(selector1);
+        let pseudoElements = collectPseudoElements(selector);
+        if (pseudoElements.length > 0) {
+            selector.nodes.push(pseudoElements.sort(sortSelector));
+        }
+    });
+    return ast.toString();
 }
 // Note: As a rule, double colons (::) should be used instead of a single colon
 // (:). This distinguishes pseudo-classes from pseudo-elements. However, since
 // this distinction was not present in older versions of the W3C spec, most
 // browsers support both syntaxes for the original pseudo-elements.
 let pseudoElementsBC = [
-    ':before',
-    ':after',
-    ':first-line',
-    ':first-letter'
+    ":before",
+    ":after",
+    ":first-line",
+    ":first-letter"
 ];
 // These pseudo-elements _can_ be combined with other pseudo selectors AND the order does matter.
 let pseudoElementExceptions = [
-    '::file-selector-button'
+    "::file-selector-button"
 ];
 // This will make sure to move pseudo's to the correct spot (the end for
 // pseudo elements) because otherwise the selector will never work
@@ -142,42 +149,42 @@ let pseudoElementExceptions = [
 function sortSelector(a, z) {
     // Both nodes are non-pseudo's so we can safely ignore them and keep
     // them in the same order.
-    if (a.type !== 'pseudo' && z.type !== 'pseudo') {
+    if (a.type !== "pseudo" && z.type !== "pseudo") {
         return 0;
     }
     // If one of them is a combinator, we need to keep it in the same order
     // because that means it will start a new "section" in the selector.
-    if (a.type === 'combinator' ^ z.type === 'combinator') {
+    if (a.type === "combinator" ^ z.type === "combinator") {
         return 0;
     }
     // One of the items is a pseudo and the other one isn't. Let's move
     // the pseudo to the right.
-    if (a.type === 'pseudo' ^ z.type === 'pseudo') {
-        return (a.type === 'pseudo') - (z.type === 'pseudo');
+    if (a.type === "pseudo" ^ z.type === "pseudo") {
+        return (a.type === "pseudo") - (z.type === "pseudo");
     }
     // Both are pseudo's, move the pseudo elements (except for
     // ::file-selector-button) to the right.
     return isPseudoElement(a) - isPseudoElement(z);
 }
 function isPseudoElement(node) {
-    if (node.type !== 'pseudo') return false;
+    if (node.type !== "pseudo") return false;
     if (pseudoElementExceptions.includes(node.value)) return false;
-    return node.value.startsWith('::') || pseudoElementsBC.includes(node.value);
+    return node.value.startsWith("::") || pseudoElementsBC.includes(node.value);
 }
 function resolveFunctionArgument(haystack, needle, arg) {
     let startIdx = haystack.indexOf(arg ? `${needle}(${arg})` : needle);
     if (startIdx === -1) return null;
     // Start inside the `(`
     startIdx += needle.length + 1;
-    let target = '';
+    let target = "";
     let count = 0;
     for (let char of haystack.slice(startIdx)){
-        if (char !== '(' && char !== ')') {
+        if (char !== "(" && char !== ")") {
             target += char;
-        } else if (char === '(') {
+        } else if (char === "(") {
             target += char;
             count++;
-        } else if (char === ')') {
+        } else if (char === ")") {
             if (--count < 0) break; // unbalanced
             target += char;
         }

package/lib/util/getAllConfigs.js

@@ -5,25 +5,30 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = getAllConfigs;
 var _defaultConfigStubJs = _interopRequireDefault(require("../../stubs/defaultConfig.stub.js"));
 var _featureFlags = require("../featureFlags");
-function _interopRequireDefault(obj) {
-    return obj && obj.__esModule ? obj : {
-        default: obj
-    };
-}
 function getAllConfigs(config) {
     var ref;
     const configs = ((ref = config === null || config === void 0 ? void 0 : config.presets) !== null && ref !== void 0 ? ref : [
         _defaultConfigStubJs.default
-    ]).slice().reverse().flatMap((preset)=>getAllConfigs(preset instanceof Function ? preset() : preset)
-    );
+    ]).slice().reverse().flatMap((preset)=>getAllConfigs(preset instanceof Function ? preset() : preset));
     const features = {
+        // Add experimental configs here...
+        respectDefaultRingColorOpacity: {
+            theme: {
+                ringColor: {
+                    DEFAULT: "#3b82f67f"
+                }
+            }
+        }
     };
-    const experimentals = Object.keys(features).filter((feature)=>(0, _featureFlags).flagEnabled(config, feature)
-    ).map((feature)=>features[feature]
-    );
+    const experimentals = Object.keys(features).filter((feature)=>(0, _featureFlags).flagEnabled(config, feature)).map((feature)=>features[feature]);
     return [
         config,
         ...experimentals,
         ...configs
     ];
 }
+function _interopRequireDefault(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}

package/lib/util/hashConfig.js

@@ -4,13 +4,13 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = hashConfig;
 var _objectHash = _interopRequireDefault(require("object-hash"));
-function _interopRequireDefault(obj) {
-    return obj && obj.__esModule ? obj : {
-        default: obj
-    };
-}
 function hashConfig(config) {
     return (0, _objectHash).default(config, {
         ignoreUnknown: true
     });
 }
+function _interopRequireDefault(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}

package/lib/util/isKeyframeRule.js

@@ -4,5 +4,5 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = isKeyframeRule;
 function isKeyframeRule(rule) {
-    return rule.parent && rule.parent.type === 'atrule' && /keyframes$/.test(rule.parent.name);
+    return rule.parent && rule.parent.type === "atrule" && /keyframes$/.test(rule.parent.name);
 }

package/lib/util/isPlainObject.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = isPlainObject;
 function isPlainObject(value) {
-    if (Object.prototype.toString.call(value) !== '[object Object]') {
+    if (Object.prototype.toString.call(value) !== "[object Object]") {
         return false;
     }
     const prototype = Object.getPrototypeOf(value);

package/lib/util/isValidArbitraryValue.js

@@ -3,44 +3,20 @@ Object.defineProperty(exports, "__esModule", {
     value: true
 });
 exports.default = isValidArbitraryValue;
-let matchingBrackets = new Map([
-    [
-        '{',
-        '}'
-    ],
-    [
-        '[',
-        ']'
-    ],
-    [
-        '(',
-        ')'
-    ], 
-]);
-let inverseMatchingBrackets = new Map(Array.from(matchingBrackets.entries()).map(([k, v])=>[
-        v,
-        k
-    ]
-));
-let quotes = new Set([
-    '"',
-    "'",
-    '`'
-]);
 function isValidArbitraryValue(value) {
     let stack = [];
     let inQuotes = false;
     for(let i = 0; i < value.length; i++){
         let char = value[i];
-        if (char === ':' && !inQuotes && stack.length === 0) {
+        if (char === ":" && !inQuotes && stack.length === 0) {
             return false;
         }
         // Non-escaped quotes allow us to "allow" anything in between
-        if (quotes.has(char) && value[i - 1] !== '\\') {
+        if (quotes.has(char) && value[i - 1] !== "\\") {
             inQuotes = !inQuotes;
         }
         if (inQuotes) continue;
-        if (value[i - 1] === '\\') continue; // Escaped
+        if (value[i - 1] === "\\") continue; // Escaped
         if (matchingBrackets.has(char)) {
             stack.push(char);
         } else if (inverseMatchingBrackets.has(char)) {
@@ -62,3 +38,26 @@ function isValidArbitraryValue(value) {
     // All good, totally balanced!
     return true;
 }
+let matchingBrackets = new Map([
+    [
+        "{",
+        "}"
+    ],
+    [
+        "[",
+        "]"
+    ],
+    [
+        "(",
+        ")"
+    ], 
+]);
+let inverseMatchingBrackets = new Map(Array.from(matchingBrackets.entries()).map(([k, v])=>[
+        v,
+        k
+    ]));
+let quotes = new Set([
+    '"',
+    "'",
+    "`"
+]);

package/lib/util/log.js

@@ -4,27 +4,26 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.dim = dim;
 exports.default = void 0;
-var _chalk = _interopRequireDefault(require("chalk"));
+var _picocolors = _interopRequireDefault(require("picocolors"));
 function _interopRequireDefault(obj) {
     return obj && obj.__esModule ? obj : {
         default: obj
     };
 }
 let alreadyShown = new Set();
-function log(chalk, messages, key) {
-    if (process.env.JEST_WORKER_ID !== undefined) return;
+function log(type, messages, key) {
+    if (typeof process !== "undefined" && process.env.JEST_WORKER_ID) return;
     if (key && alreadyShown.has(key)) return;
     if (key) alreadyShown.add(key);
-    console.warn('');
-    messages.forEach((message)=>console.warn(chalk, '-', message)
-    );
+    console.warn("");
+    messages.forEach((message)=>console.warn(type, "-", message));
 }
 function dim(input) {
-    return _chalk.default.dim(input);
+    return _picocolors.default.dim(input);
 }
 var _default = {
     info (key, messages) {
-        log(_chalk.default.bold.cyan('info'), ...Array.isArray(key) ? [
+        log(_picocolors.default.bold(_picocolors.default.cyan("info")), ...Array.isArray(key) ? [
             key
         ] : [
             messages,
@@ -32,7 +31,7 @@ var _default = {
         ]);
     },
     warn (key, messages) {
-        log(_chalk.default.bold.yellow('warn'), ...Array.isArray(key) ? [
+        log(_picocolors.default.bold(_picocolors.default.yellow("warn")), ...Array.isArray(key) ? [
             key
         ] : [
             messages,
@@ -40,7 +39,7 @@ var _default = {
         ]);
     },
     risk (key, messages) {
-        log(_chalk.default.bold.magenta('risk'), ...Array.isArray(key) ? [
+        log(_picocolors.default.bold(_picocolors.default.magenta("risk")), ...Array.isArray(key) ? [
             key
         ] : [
             messages,

package/lib/util/nameClass.js

@@ -2,11 +2,14 @@
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
-exports.asClass = asClass;
 exports.default = nameClass;
+exports.asClass = asClass;
 exports.formatClass = formatClass;
 var _escapeClassName = _interopRequireDefault(require("./escapeClassName"));
 var _escapeCommas = _interopRequireDefault(require("./escapeCommas"));
+function nameClass(classPrefix, key) {
+    return asClass(formatClass(classPrefix, key));
+}
 function _interopRequireDefault(obj) {
     return obj && obj.__esModule ? obj : {
         default: obj
@@ -15,17 +18,14 @@ function _interopRequireDefault(obj) {
 function asClass(name) {
     return (0, _escapeCommas).default(`.${(0, _escapeClassName).default(name)}`);
 }
-function nameClass(classPrefix, key) {
-    return asClass(formatClass(classPrefix, key));
-}
 function formatClass(classPrefix, key) {
-    if (key === 'DEFAULT') {
+    if (key === "DEFAULT") {
         return classPrefix;
     }
-    if (key === '-' || key === '-DEFAULT') {
+    if (key === "-" || key === "-DEFAULT") {
         return `-${classPrefix}`;
     }
-    if (key.startsWith('-')) {
+    if (key.startsWith("-")) {
         return `-${classPrefix}${key}`;
     }
     return `${classPrefix}-${key}`;

package/lib/util/negateValue.js

@@ -5,15 +5,14 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = _default;
 function _default(value) {
     value = `${value}`;
-    if (value === '0') {
-        return '0';
+    if (value === "0") {
+        return "0";
     }
     // Flip sign of numbers
     if (/^[+-]?(\d+|\d*\.\d+)(e[+-]?\d+)?(%|\w+)?$/.test(value)) {
-        return value.replace(/^[+-]?/, (sign)=>sign === '-' ? '' : '-'
-        );
+        return value.replace(/^[+-]?/, (sign)=>sign === "-" ? "" : "-");
     }
-    if (value.includes('var(') || value.includes('calc(')) {
+    if (value.includes("var(") || value.includes("calc(")) {
         return `calc(${value} * -1)`;
     }
 }