tailwindcss 3.2.4 → 3.2.5

package/lib/util/formatVariantSelector.js

@@ -9,9 +9,9 @@ function _export(target, all) {
     });
 }
 _export(exports, {
-    selectorFunctions: ()=>selectorFunctions,
     formatVariantSelector: ()=>formatVariantSelector,
-    finalizeSelector: ()=>finalizeSelector
+    finalizeSelector: ()=>finalizeSelector,
+    handleMergePseudo: ()=>handleMergePseudo
 });
 const _postcssSelectorParser = /*#__PURE__*/ _interopRequireDefault(require("postcss-selector-parser"));
 const _unesc = /*#__PURE__*/ _interopRequireDefault(require("postcss-selector-parser/dist/util/unesc"));
@@ -22,28 +22,39 @@ function _interopRequireDefault(obj) {
         default: obj
     };
 }
-var ref;
-let MERGE = ":merge";
-let PARENT = "&";
-let selectorFunctions = new Set([
-    MERGE
-]);
-function formatVariantSelector(current, ...others) {
-    for (let other of others){
-        let incomingValue = resolveFunctionArgument(other, MERGE);
-        if (incomingValue !== null) {
-            let existingValue = resolveFunctionArgument(current, MERGE, incomingValue);
-            if (existingValue !== null) {
-                let existingTarget = `${MERGE}(${incomingValue})`;
-                let splitIdx = other.indexOf(existingTarget);
-                let addition = other.slice(splitIdx + existingTarget.length).split(" ")[0];
-                current = current.replace(existingTarget, existingTarget + addition);
-                continue;
-            }
-        }
-        current = other.replace(PARENT, current);
+/** @typedef {import('postcss-selector-parser').Root} Root */ /** @typedef {import('postcss-selector-parser').Selector} Selector */ /** @typedef {import('postcss-selector-parser').Pseudo} Pseudo */ /** @typedef {import('postcss-selector-parser').Node} Node */ /** @typedef {{format: string, isArbitraryVariant: boolean}[]} RawFormats */ /** @typedef {import('postcss-selector-parser').Root} ParsedFormats */ /** @typedef {RawFormats | ParsedFormats} AcceptedFormats */ let MERGE = ":merge";
+function formatVariantSelector(formats, { context , candidate  }) {
+    var _context_tailwindConfig_prefix;
+    let prefix = (_context_tailwindConfig_prefix = context === null || context === void 0 ? void 0 : context.tailwindConfig.prefix) !== null && _context_tailwindConfig_prefix !== void 0 ? _context_tailwindConfig_prefix : "";
+    // Parse the format selector into an AST
+    let parsedFormats = formats.map((format)=>{
+        let ast = (0, _postcssSelectorParser.default)().astSync(format.format);
+        return {
+            ...format,
+            ast: format.isArbitraryVariant ? ast : (0, _prefixSelector.default)(prefix, ast)
+        };
+    });
+    // We start with the candidate selector
+    let formatAst = _postcssSelectorParser.default.root({
+        nodes: [
+            _postcssSelectorParser.default.selector({
+                nodes: [
+                    _postcssSelectorParser.default.className({
+                        value: (0, _escapeClassName.default)(candidate)
+                    })
+                ]
+            })
+        ]
+    });
+    // And iteratively merge each format selector into the candidate selector
+    for (let { ast  } of parsedFormats){
+        [formatAst, ast] = handleMergePseudo(formatAst, ast);
+        // 2. Merge the format selector into the current selector AST
+        ast.walkNesting((nesting)=>nesting.replaceWith(...formatAst.nodes[0].nodes));
+        // 3. Keep going!
+        formatAst = ast;
     }
-    return current;
+    return formatAst;
 }
 /**
  * Given any node in a selector this gets the "simple" selector it's a part of
@@ -51,10 +62,10 @@ function formatVariantSelector(current, ...others) {
  * Technically :is(), :not(), :has(), etc… can have combinators but those are nested
  * inside the relevant node and won't be picked up so they're fine to ignore
  *
- * @param {import('postcss-selector-parser').Node} node
- * @returns {import('postcss-selector-parser').Node[]}
+ * @param {Node} node
+ * @returns {Node[]}
  **/ function simpleSelectorForNode(node) {
-    /** @type {import('postcss-selector-parser').Node[]} */ let nodes = [];
+    /** @type {Node[]} */ let nodes = [];
     // Walk backwards until we hit a combinator node (or the start)
     while(node.prev() && node.prev().type !== "combinator"){
         node = node.prev();
@@ -70,8 +81,8 @@ function formatVariantSelector(current, ...others) {
  * Resorts the nodes in a selector to ensure they're in the correct order
  * Tags go before classes, and pseudo classes go after classes
  *
- * @param {import('postcss-selector-parser').Selector} sel
- * @returns {import('postcss-selector-parser').Selector}
+ * @param {Selector} sel
+ * @returns {Selector}
  **/ function resortSelector(sel) {
     sel.sort((a, b)=>{
         if (a.type === "tag" && b.type === "class") {
@@ -87,7 +98,18 @@ function formatVariantSelector(current, ...others) {
     });
     return sel;
 }
-function eliminateIrrelevantSelectors(sel, base) {
+/**
+ * Remove extraneous selectors that do not include the base class/candidate
+ *
+ * Example:
+ * Given the utility `.a, .b { color: red}`
+ * Given the candidate `sm:b`
+ *
+ * The final selector should be `.sm\:b` and not `.a, .sm\:b`
+ *
+ * @param {Selector} ast
+ * @param {string} base
+ */ function eliminateIrrelevantSelectors(sel, base) {
     let hasClassesMatchingCandidate = false;
     sel.walk((child)=>{
         if (child.type === "class" && child.value === base) {
@@ -106,27 +128,20 @@ function eliminateIrrelevantSelectors(sel, base) {
 // meaning of the selector.
 // TODO: Can we do this for :matches, :is, and :where?
 }
-var ref1;
-function finalizeSelector(format, { selector , candidate , context , isArbitraryVariant , // 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 ast = (0, _postcssSelectorParser.default)().astSync(selector);
-    // We explicitly DO NOT prefix classes in arbitrary variants
-    if ((context === null || context === void 0 ? void 0 : (ref2 = context.tailwindConfig) === null || ref2 === void 0 ? void 0 : ref2.prefix) && !isArbitraryVariant) {
-        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((sel)=>eliminateIrrelevantSelectors(sel, base));
+function finalizeSelector(current, formats, { context , candidate , base  }) {
+    var _context_tailwindConfig;
+    var _context_tailwindConfig_separator;
+    let separator = (_context_tailwindConfig_separator = context === null || context === void 0 ? void 0 : (_context_tailwindConfig = context.tailwindConfig) === null || _context_tailwindConfig === void 0 ? void 0 : _context_tailwindConfig.separator) !== null && _context_tailwindConfig_separator !== void 0 ? _context_tailwindConfig_separator : ":";
+    // 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 = base !== null && base !== void 0 ? base : candidate.split(new RegExp(`\\${separator}(?![^[]*\\])`)).pop();
+    // Parse the selector into an AST
+    let selector = (0, _postcssSelectorParser.default)().astSync(current);
     // Normalize escaped classes, e.g.:
     //
     // The idea would be to replace the escaped `base` in the selector with the
@@ -138,11 +153,22 @@ base =candidate.split(new RegExp(`\\${(ref1 = context === null || context === vo
     //   base in selector: bg-\\[rgb\\(255\\,0\\,0\\)\\]
     //       escaped base: bg-\\[rgb\\(255\\2c 0\\2c 0\\)\\]
     //
-    ast.walkClasses((node)=>{
+    selector.walkClasses((node)=>{
         if (node.raws && node.value.includes(base)) {
             node.raws.value = (0, _escapeClassName.default)((0, _unesc.default)(node.raws.value));
         }
     });
+    // Remove extraneous selectors that do not include the base candidate
+    selector.each((sel)=>eliminateIrrelevantSelectors(sel, base));
+    // If there are no formats that means there were no variants added to the candidate
+    // so we can just return the selector as-is
+    let formatAst = Array.isArray(formats) ? formatVariantSelector(formats, {
+        context,
+        candidate
+    }) : formats;
+    if (formatAst === null) {
+        return selector.toString();
+    }
     let simpleStart = _postcssSelectorParser.default.comment({
         value: "/*__simple__*/"
     });
@@ -151,7 +177,7 @@ base =candidate.split(new RegExp(`\\${(ref1 = context === null || context === vo
     });
     // We can safely replace the escaped base now, since the `base` section is
     // now in a normalized escaped value.
-    ast.walkClasses((node)=>{
+    selector.walkClasses((node)=>{
         if (node.value !== base) {
             return;
         }
@@ -166,7 +192,7 @@ base =candidate.split(new RegExp(`\\${(ref1 = context === null || context === vo
         parent.insertBefore(simpleSelector[0], simpleStart);
         parent.insertAfter(simpleSelector[simpleSelector.length - 1], simpleEnd);
         for (let child of formatNodes){
-            parent.insertBefore(simpleSelector[0], child);
+            parent.insertBefore(simpleSelector[0], child.clone());
         }
         node.remove();
         // Re-sort the simple selector to ensure it's in the correct order
@@ -178,41 +204,68 @@ base =candidate.split(new RegExp(`\\${(ref1 = context === null || context === vo
         simpleStart.remove();
         simpleEnd.remove();
     });
-    // 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;
-    }
     // Remove unnecessary pseudo selectors that we used as placeholders
-    ast.each((selector)=>{
-        selector.walkPseudos((p)=>{
-            if (selectorFunctions.has(p.value)) {
-                p.replaceWith(p.nodes);
-            }
-        });
-        let pseudoElements = collectPseudoElements(selector);
+    selector.walkPseudos((p)=>{
+        if (p.value === MERGE) {
+            p.replaceWith(p.nodes);
+        }
+    });
+    // Move pseudo elements to the end of the selector (if necessary)
+    selector.each((sel)=>{
+        let pseudoElements = collectPseudoElements(sel);
         if (pseudoElements.length > 0) {
-            selector.nodes.push(pseudoElements.sort(sortSelector));
+            sel.nodes.push(pseudoElements.sort(sortSelector));
         }
     });
-    return ast.toString();
+    return selector.toString();
+}
+function handleMergePseudo(selector, format) {
+    /** @type {{pseudo: Pseudo, value: string}[]} */ let merges = [];
+    // Find all :merge() pseudo-classes in `selector`
+    selector.walkPseudos((pseudo)=>{
+        if (pseudo.value === MERGE) {
+            merges.push({
+                pseudo,
+                value: pseudo.nodes[0].toString()
+            });
+        }
+    });
+    // Find all :merge() "attachments" in `format` and attach them to the matching selector in `selector`
+    format.walkPseudos((pseudo)=>{
+        if (pseudo.value !== MERGE) {
+            return;
+        }
+        let value = pseudo.nodes[0].toString();
+        // Does `selector` contain a :merge() pseudo-class with the same value?
+        let existing = merges.find((merge)=>merge.value === value);
+        // Nope so there's nothing to do
+        if (!existing) {
+            return;
+        }
+        // Everything after `:merge()` up to the next combinator is what is attached to the merged selector
+        let attachments = [];
+        let next = pseudo.next();
+        while(next && next.type !== "combinator"){
+            attachments.push(next);
+            next = next.next();
+        }
+        let combinator = next;
+        existing.pseudo.parent.insertAfter(existing.pseudo, _postcssSelectorParser.default.selector({
+            nodes: attachments.map((node)=>node.clone())
+        }));
+        pseudo.remove();
+        attachments.forEach((node)=>node.remove());
+        // What about this case:
+        // :merge(.group):focus > &
+        // :merge(.group):hover &
+        if (combinator && combinator.type === "combinator") {
+            combinator.remove();
+        }
+    });
+    return [
+        selector,
+        format
+    ];
 }
 // Note: As a rule, double colons (::) should be used instead of a single colon
 // (:). This distinguishes pseudo-classes from pseudo-elements. However, since
@@ -226,8 +279,41 @@ let pseudoElementsBC = [
 ];
 // These pseudo-elements _can_ be combined with other pseudo selectors AND the order does matter.
 let pseudoElementExceptions = [
-    "::file-selector-button"
+    "::file-selector-button",
+    // Webkit scroll bar pseudo elements can be combined with user-action pseudo classes
+    "::-webkit-scrollbar",
+    "::-webkit-scrollbar-button",
+    "::-webkit-scrollbar-thumb",
+    "::-webkit-scrollbar-track",
+    "::-webkit-scrollbar-track-piece",
+    "::-webkit-scrollbar-corner",
+    "::-webkit-resizer"
 ];
+/**
+ * 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.
+ *
+ * @param {Selector} selector
+ **/ function collectPseudoElements(selector) {
+    /** @type {Node[]} */ 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;
+}
 // 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.
@@ -263,23 +349,3 @@ function isPseudoElement(node) {
     if (pseudoElementExceptions.includes(node.value)) return false;
     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 count = 0;
-    for (let char of haystack.slice(startIdx)){
-        if (char !== "(" && char !== ")") {
-            target += char;
-        } else if (char === "(") {
-            target += char;
-            count++;
-        } else if (char === ")") {
-            if (--count < 0) break; // unbalanced
-            target += char;
-        }
-    }
-    return target;
-}

package/lib/util/getAllConfigs.js

@@ -14,8 +14,8 @@ function _interopRequireDefault(obj) {
     };
 }
 function getAllConfigs(config) {
-    var ref;
-    const configs = ((ref = config === null || config === void 0 ? void 0 : config.presets) !== null && ref !== void 0 ? ref : [
+    var _config_presets;
+    const configs = ((_config_presets = config === null || config === void 0 ? void 0 : config.presets) !== null && _config_presets !== void 0 ? _config_presets : [
         _defaultConfigStubJs.default
     ]).slice().reverse().flatMap((preset)=>getAllConfigs(preset instanceof Function ? preset() : preset));
     const features = {

package/lib/util/{isValidArbitraryValue.js → isSyntacticallyValidPropertyValue.js}

@@ -10,7 +10,7 @@ Object.defineProperty(exports, // Arbitrary values must contain balanced bracket
 // E.g.: content-['this-is-also-valid]-weirdly-enough']
 "default", {
     enumerable: true,
-    get: ()=>isValidArbitraryValue
+    get: ()=>isSyntacticallyValidPropertyValue
 });
 let matchingBrackets = new Map([
     [
@@ -35,7 +35,7 @@ let quotes = new Set([
     "'",
     "`"
 ]);
-function isValidArbitraryValue(value) {
+function isSyntacticallyValidPropertyValue(value) {
     let stack = [];
     let inQuotes = false;
     for(let i = 0; i < value.length; i++){

package/lib/util/negateValue.js

@@ -4,9 +4,9 @@ Object.defineProperty(exports, "__esModule", {
 });
 Object.defineProperty(exports, "default", {
     enumerable: true,
-    get: ()=>_default
+    get: ()=>negateValue
 });
-function _default(value) {
+function negateValue(value) {
     value = `${value}`;
     if (value === "0") {
         return "0";

package/lib/util/normalizeConfig.js

@@ -154,12 +154,12 @@ function normalizeConfig(config) {
     }
     // Normalize the `safelist`
     config.safelist = (()=>{
-        var ref;
+        var _purge_options;
         let { content , purge , safelist  } = config;
         if (Array.isArray(safelist)) return safelist;
         if (Array.isArray(content === null || content === void 0 ? void 0 : content.safelist)) return content.safelist;
         if (Array.isArray(purge === null || purge === void 0 ? void 0 : purge.safelist)) return purge.safelist;
-        if (Array.isArray(purge === null || purge === void 0 ? void 0 : (ref = purge.options) === null || ref === void 0 ? void 0 : ref.safelist)) return purge.options.safelist;
+        if (Array.isArray(purge === null || purge === void 0 ? void 0 : (_purge_options = purge.options) === null || _purge_options === void 0 ? void 0 : _purge_options.safelist)) return purge.options.safelist;
         return [];
     })();
     // Normalize the `blocklist`
@@ -185,19 +185,19 @@ function normalizeConfig(config) {
         ]);
         config.prefix = "";
     } else {
-        var _prefix;
-        config.prefix = (_prefix = config.prefix) !== null && _prefix !== void 0 ? _prefix : "";
+        var _config_prefix;
+        config.prefix = (_config_prefix = config.prefix) !== null && _config_prefix !== void 0 ? _config_prefix : "";
     }
     // Normalize the `content`
     config.content = {
         relative: (()=>{
-            var ref;
+            var _config_future;
             let { content  } = config;
             if (content === null || content === void 0 ? void 0 : content.relative) {
                 return content.relative;
             }
-            var ref1;
-            return (ref1 = (ref = config.future) === null || ref === void 0 ? void 0 : ref.relativeContentPathsByDefault) !== null && ref1 !== void 0 ? ref1 : false;
+            var _config_future_relativeContentPathsByDefault;
+            return (_config_future_relativeContentPathsByDefault = (_config_future = config.future) === null || _config_future === void 0 ? void 0 : _config_future.relativeContentPathsByDefault) !== null && _config_future_relativeContentPathsByDefault !== void 0 ? _config_future_relativeContentPathsByDefault : false;
         })(),
         files: (()=>{
             let { content , purge  } = config;
@@ -210,22 +210,22 @@ function normalizeConfig(config) {
         })(),
         extract: (()=>{
             let extract = (()=>{
-                var ref, ref1, ref2, ref3, ref4, ref5, ref6, ref7, ref8, ref9;
-                if ((ref = config.purge) === null || ref === void 0 ? void 0 : ref.extract) return config.purge.extract;
-                if ((ref1 = config.content) === null || ref1 === void 0 ? void 0 : ref1.extract) return config.content.extract;
-                if ((ref2 = config.purge) === null || ref2 === void 0 ? void 0 : (ref3 = ref2.extract) === null || ref3 === void 0 ? void 0 : ref3.DEFAULT) return config.purge.extract.DEFAULT;
-                if ((ref4 = config.content) === null || ref4 === void 0 ? void 0 : (ref5 = ref4.extract) === null || ref5 === void 0 ? void 0 : ref5.DEFAULT) return config.content.extract.DEFAULT;
-                if ((ref6 = config.purge) === null || ref6 === void 0 ? void 0 : (ref7 = ref6.options) === null || ref7 === void 0 ? void 0 : ref7.extractors) return config.purge.options.extractors;
-                if ((ref8 = config.content) === null || ref8 === void 0 ? void 0 : (ref9 = ref8.options) === null || ref9 === void 0 ? void 0 : ref9.extractors) return config.content.options.extractors;
+                var _config_purge, _config_content, _config_purge1, _config_purge_extract, _config_content1, _config_content_extract, _config_purge2, _config_purge_options, _config_content2, _config_content_options;
+                if ((_config_purge = config.purge) === null || _config_purge === void 0 ? void 0 : _config_purge.extract) return config.purge.extract;
+                if ((_config_content = config.content) === null || _config_content === void 0 ? void 0 : _config_content.extract) return config.content.extract;
+                if ((_config_purge1 = config.purge) === null || _config_purge1 === void 0 ? void 0 : (_config_purge_extract = _config_purge1.extract) === null || _config_purge_extract === void 0 ? void 0 : _config_purge_extract.DEFAULT) return config.purge.extract.DEFAULT;
+                if ((_config_content1 = config.content) === null || _config_content1 === void 0 ? void 0 : (_config_content_extract = _config_content1.extract) === null || _config_content_extract === void 0 ? void 0 : _config_content_extract.DEFAULT) return config.content.extract.DEFAULT;
+                if ((_config_purge2 = config.purge) === null || _config_purge2 === void 0 ? void 0 : (_config_purge_options = _config_purge2.options) === null || _config_purge_options === void 0 ? void 0 : _config_purge_options.extractors) return config.purge.options.extractors;
+                if ((_config_content2 = config.content) === null || _config_content2 === void 0 ? void 0 : (_config_content_options = _config_content2.options) === null || _config_content_options === void 0 ? void 0 : _config_content_options.extractors) return config.content.options.extractors;
                 return {};
             })();
             let extractors = {};
             let defaultExtractor = (()=>{
-                var ref, ref1, ref2, ref3;
-                if ((ref = config.purge) === null || ref === void 0 ? void 0 : (ref1 = ref.options) === null || ref1 === void 0 ? void 0 : ref1.defaultExtractor) {
+                var _config_purge, _config_purge_options, _config_content, _config_content_options;
+                if ((_config_purge = config.purge) === null || _config_purge === void 0 ? void 0 : (_config_purge_options = _config_purge.options) === null || _config_purge_options === void 0 ? void 0 : _config_purge_options.defaultExtractor) {
                     return config.purge.options.defaultExtractor;
                 }
-                if ((ref2 = config.content) === null || ref2 === void 0 ? void 0 : (ref3 = ref2.options) === null || ref3 === void 0 ? void 0 : ref3.defaultExtractor) {
+                if ((_config_content = config.content) === null || _config_content === void 0 ? void 0 : (_config_content_options = _config_content.options) === null || _config_content_options === void 0 ? void 0 : _config_content_options.defaultExtractor) {
                     return config.content.options.defaultExtractor;
                 }
                 return undefined;
@@ -249,11 +249,11 @@ function normalizeConfig(config) {
         })(),
         transform: (()=>{
             let transform = (()=>{
-                var ref, ref1, ref2, ref3, ref4, ref5;
-                if ((ref = config.purge) === null || ref === void 0 ? void 0 : ref.transform) return config.purge.transform;
-                if ((ref1 = config.content) === null || ref1 === void 0 ? void 0 : ref1.transform) return config.content.transform;
-                if ((ref2 = config.purge) === null || ref2 === void 0 ? void 0 : (ref3 = ref2.transform) === null || ref3 === void 0 ? void 0 : ref3.DEFAULT) return config.purge.transform.DEFAULT;
-                if ((ref4 = config.content) === null || ref4 === void 0 ? void 0 : (ref5 = ref4.transform) === null || ref5 === void 0 ? void 0 : ref5.DEFAULT) return config.content.transform.DEFAULT;
+                var _config_purge, _config_content, _config_purge1, _config_purge_transform, _config_content1, _config_content_transform;
+                if ((_config_purge = config.purge) === null || _config_purge === void 0 ? void 0 : _config_purge.transform) return config.purge.transform;
+                if ((_config_content = config.content) === null || _config_content === void 0 ? void 0 : _config_content.transform) return config.content.transform;
+                if ((_config_purge1 = config.purge) === null || _config_purge1 === void 0 ? void 0 : (_config_purge_transform = _config_purge1.transform) === null || _config_purge_transform === void 0 ? void 0 : _config_purge_transform.DEFAULT) return config.purge.transform.DEFAULT;
+                if ((_config_content1 = config.content) === null || _config_content1 === void 0 ? void 0 : (_config_content_transform = _config_content1.transform) === null || _config_content_transform === void 0 ? void 0 : _config_content_transform.DEFAULT) return config.content.transform.DEFAULT;
                 return {};
             })();
             let transformers = {};

package/lib/util/pluginUtils.js

@@ -80,8 +80,8 @@ function asNegativeValue(modifier, lookup = {}, validate) {
     }
 }
 function asValue(modifier, options = {}, { validate =()=>true  } = {}) {
-    var ref;
-    let value = (ref = options.values) === null || ref === void 0 ? void 0 : ref[modifier];
+    var _options_values;
+    let value = (_options_values = options.values) === null || _options_values === void 0 ? void 0 : _options_values[modifier];
     if (value !== undefined) {
         return value;
     }
@@ -123,19 +123,19 @@ function parseColorFormat(value) {
     }
     return value;
 }
-function asColor(_, options = {}, { tailwindConfig ={} , utilityModifier , rawModifier  } = {}) {
-    var ref;
-    if (((ref = options.values) === null || ref === void 0 ? void 0 : ref[rawModifier]) !== undefined) {
-        var ref1;
-        return parseColorFormat((ref1 = options.values) === null || ref1 === void 0 ? void 0 : ref1[rawModifier]);
+function asColor(modifier, options = {}, { tailwindConfig ={}  } = {}) {
+    var _options_values;
+    if (((_options_values = options.values) === null || _options_values === void 0 ? void 0 : _options_values[modifier]) !== undefined) {
+        var _options_values1;
+        return parseColorFormat((_options_values1 = options.values) === null || _options_values1 === void 0 ? void 0 : _options_values1[modifier]);
     }
     // TODO: Hoist this up to getMatchingTypes or something
     // We do this here because we need the alpha value (if any)
-    let [color, alpha] = splitUtilityModifier(rawModifier);
+    let [color, alpha] = splitUtilityModifier(modifier);
     if (alpha !== undefined) {
-        var ref2, ref3, ref4;
-        var ref5;
-        let normalizedColor = (ref5 = (ref2 = options.values) === null || ref2 === void 0 ? void 0 : ref2[color]) !== null && ref5 !== void 0 ? ref5 : isArbitraryValue(color) ? color.slice(1, -1) : undefined;
+        var _options_values2, _tailwindConfig_theme, _tailwindConfig_theme_opacity;
+        var _options_values_color;
+        let normalizedColor = (_options_values_color = (_options_values2 = options.values) === null || _options_values2 === void 0 ? void 0 : _options_values2[color]) !== null && _options_values_color !== void 0 ? _options_values_color : isArbitraryValue(color) ? color.slice(1, -1) : undefined;
         if (normalizedColor === undefined) {
             return undefined;
         }
@@ -143,25 +143,22 @@ function asColor(_, options = {}, { tailwindConfig ={} , utilityModifier , rawMo
         if (isArbitraryValue(alpha)) {
             return (0, _withAlphaVariable.withAlphaValue)(normalizedColor, alpha.slice(1, -1));
         }
-        if (((ref3 = tailwindConfig.theme) === null || ref3 === void 0 ? void 0 : (ref4 = ref3.opacity) === null || ref4 === void 0 ? void 0 : ref4[alpha]) === undefined) {
+        if (((_tailwindConfig_theme = tailwindConfig.theme) === null || _tailwindConfig_theme === void 0 ? void 0 : (_tailwindConfig_theme_opacity = _tailwindConfig_theme.opacity) === null || _tailwindConfig_theme_opacity === void 0 ? void 0 : _tailwindConfig_theme_opacity[alpha]) === undefined) {
             return undefined;
         }
         return (0, _withAlphaVariable.withAlphaValue)(normalizedColor, tailwindConfig.theme.opacity[alpha]);
     }
-    return asValue(rawModifier, options, {
-        rawModifier,
-        utilityModifier,
+    return asValue(modifier, options, {
         validate: _dataTypes.color
     });
 }
 function asLookupValue(modifier, options = {}) {
-    var ref;
-    return (ref = options.values) === null || ref === void 0 ? void 0 : ref[modifier];
+    var _options_values;
+    return (_options_values = options.values) === null || _options_values === void 0 ? void 0 : _options_values[modifier];
 }
 function guess(validate) {
-    return (modifier, options, extras)=>{
+    return (modifier, options)=>{
         return asValue(modifier, options, {
-            ...extras,
             validate
         });
     };
@@ -197,6 +194,21 @@ function splitAtFirst(input, delim) {
     ];
 }
 function coerceValue(types, modifier, options, tailwindConfig) {
+    if (options.values && modifier in options.values) {
+        for (let { type  } of types !== null && types !== void 0 ? types : []){
+            let result = typeMap[type](modifier, options, {
+                tailwindConfig
+            });
+            if (result === undefined) {
+                continue;
+            }
+            return [
+                result,
+                type,
+                null
+            ];
+        }
+    }
     if (isArbitraryValue(modifier)) {
         let arbitraryValue = modifier.slice(1, -1);
         let [explicitType, value] = splitAtFirst(arbitraryValue, ":");
@@ -238,39 +250,25 @@ function* getMatchingTypes(types, rawModifier, options, tailwindConfig) {
     // TODO: Move to asValue… somehow
     if (utilityModifier !== undefined) {
         if (typeof options.modifiers === "object") {
-            var ref;
-            var ref1;
-            let configValue = (ref1 = (ref = options.modifiers) === null || ref === void 0 ? void 0 : ref[utilityModifier]) !== null && ref1 !== void 0 ? ref1 : null;
+            var _options_modifiers;
+            var _options_modifiers_utilityModifier;
+            let configValue = (_options_modifiers_utilityModifier = (_options_modifiers = options.modifiers) === null || _options_modifiers === void 0 ? void 0 : _options_modifiers[utilityModifier]) !== null && _options_modifiers_utilityModifier !== void 0 ? _options_modifiers_utilityModifier : null;
             if (configValue !== null) {
                 utilityModifier = configValue;
             } else if (isArbitraryValue(utilityModifier)) {
                 utilityModifier = utilityModifier.slice(1, -1);
             }
         }
-        let result = asValue(rawModifier, options, {
-            rawModifier,
-            utilityModifier,
-            tailwindConfig
-        });
-        if (result !== undefined) {
-            yield [
-                result,
-                "any",
-                null
-            ];
-        }
     }
-    for (const { type  } of types !== null && types !== void 0 ? types : []){
-        let result1 = typeMap[type](modifier, options, {
-            rawModifier,
-            utilityModifier,
+    for (let { type  } of types !== null && types !== void 0 ? types : []){
+        let result = typeMap[type](modifier, options, {
             tailwindConfig
         });
-        if (result1 === undefined) {
+        if (result === undefined) {
             continue;
         }
         yield [
-            result1,
+            result,
             type,
             utilityModifier !== null && utilityModifier !== void 0 ? utilityModifier : null
         ];