tailwindcss 3.1.8 → 3.2.0

package/lib/css/preflight.css

@@ -358,3 +358,8 @@ video {
   max-width: 100%;
   height: auto;
 }
+
+/* Make elements with the HTML hidden attribute stay hidden by default */
+[hidden] {
+  display: none;
+}

package/lib/featureFlags.js

@@ -21,16 +21,19 @@ function _interopRequireDefault(obj) {
     };
 }
 let defaults = {
-    optimizeUniversalDefaults: false
+    optimizeUniversalDefaults: false,
+    generalizedModifiers: true
 };
 let featureFlags = {
     future: [
         "hoverOnlyWhenSupported",
-        "respectDefaultRingColorOpacity"
+        "respectDefaultRingColorOpacity",
+        "disableColorOpacityUtilitiesByDefault",
+        "relativeContentPathsByDefault"
     ],
     experimental: [
         "optimizeUniversalDefaults",
-        "matchVariant" /* , 'variantGrouping' */ 
+        "generalizedModifiers"
     ]
 };
 function flagEnabled(config, flag) {
@@ -61,7 +64,7 @@ function issueFlagNotices(config) {
         let changes = experimentalFlagsEnabled(config).map((s)=>_picocolors.default.yellow(s)).join(", ");
         _log.default.warn("experimental-flags-enabled", [
             `You have enabled experimental features: ${changes}`,
-            "Experimental features in Tailwind CSS are not covered by semver, may introduce breaking changes, and can change at any time.", 
+            "Experimental features in Tailwind CSS are not covered by semver, may introduce breaking changes, and can change at any time."
         ]);
     }
 }

package/lib/index.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 const _setupTrackingContext = /*#__PURE__*/ _interopRequireDefault(require("./lib/setupTrackingContext"));
 const _processTailwindFeatures = /*#__PURE__*/ _interopRequireDefault(require("./processTailwindFeatures"));
 const _sharedState = require("./lib/sharedState");
+const _findAtConfigPath = require("./lib/findAtConfigPath");
 function _interopRequireDefault(obj) {
     return obj && obj.__esModule ? obj : {
         default: obj
@@ -20,6 +21,10 @@ module.exports = function tailwindcss(configOrPath) {
                 return root;
             },
             function(root, result) {
+                var ref;
+                // Use the path for the `@config` directive if it exists, otherwise use the
+                // path for the file being processed
+                configOrPath = (ref = (0, _findAtConfigPath.findAtConfigPath)(root, result)) !== null && ref !== void 0 ? ref : configOrPath;
                 let context = (0, _setupTrackingContext.default)(configOrPath);
                 if (root.type === "document") {
                     let roots = root.nodes.filter((node)=>node.type === "root");
@@ -36,7 +41,7 @@ module.exports = function tailwindcss(configOrPath) {
                 console.timeEnd("JIT TOTAL");
                 console.log("\n");
                 return root;
-            }, 
+            }
         ].filter(Boolean)
     };
 };

package/lib/lib/content.js

@@ -0,0 +1,167 @@
+// @ts-check
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    parseCandidateFiles: ()=>parseCandidateFiles,
+    resolvedChangedContent: ()=>resolvedChangedContent
+});
+const _fs = /*#__PURE__*/ _interopRequireDefault(require("fs"));
+const _path = /*#__PURE__*/ _interopRequireDefault(require("path"));
+const _isGlob = /*#__PURE__*/ _interopRequireDefault(require("is-glob"));
+const _fastGlob = /*#__PURE__*/ _interopRequireDefault(require("fast-glob"));
+const _normalizePath = /*#__PURE__*/ _interopRequireDefault(require("normalize-path"));
+const _parseGlob = require("../util/parseGlob");
+const _sharedState = require("./sharedState");
+function _interopRequireDefault(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+function parseCandidateFiles(context, tailwindConfig) {
+    let files = tailwindConfig.content.files;
+    // Normalize the file globs
+    files = files.filter((filePath)=>typeof filePath === "string");
+    files = files.map(_normalizePath.default);
+    // Split into included and excluded globs
+    let tasks = _fastGlob.default.generateTasks(files);
+    /** @type {ContentPath[]} */ let included = [];
+    /** @type {ContentPath[]} */ let excluded = [];
+    for (const task of tasks){
+        included.push(...task.positive.map((filePath)=>parseFilePath(filePath, false)));
+        excluded.push(...task.negative.map((filePath)=>parseFilePath(filePath, true)));
+    }
+    let paths = [
+        ...included,
+        ...excluded
+    ];
+    // Resolve paths relative to the config file or cwd
+    paths = resolveRelativePaths(context, paths);
+    // Resolve symlinks if possible
+    paths = paths.flatMap(resolvePathSymlinks);
+    // Update cached patterns
+    paths = paths.map(resolveGlobPattern);
+    return paths;
+}
+/**
+ *
+ * @param {string} filePath
+ * @param {boolean} ignore
+ * @returns {ContentPath}
+ */ function parseFilePath(filePath, ignore) {
+    let contentPath = {
+        original: filePath,
+        base: filePath,
+        ignore,
+        pattern: filePath,
+        glob: null
+    };
+    if ((0, _isGlob.default)(filePath)) {
+        Object.assign(contentPath, (0, _parseGlob.parseGlob)(filePath));
+    }
+    return contentPath;
+}
+/**
+ *
+ * @param {ContentPath} contentPath
+ * @returns {ContentPath}
+ */ function resolveGlobPattern(contentPath) {
+    contentPath.pattern = contentPath.glob ? `${contentPath.base}/${contentPath.glob}` : contentPath.base;
+    contentPath.pattern = contentPath.ignore ? `!${contentPath.pattern}` : contentPath.pattern;
+    // This is required for Windows support to properly pick up Glob paths.
+    // Afaik, this technically shouldn't be needed but there's probably
+    // some internal, direct path matching with a normalized path in
+    // a package which can't handle mixed directory separators
+    contentPath.pattern = (0, _normalizePath.default)(contentPath.pattern);
+    return contentPath;
+}
+/**
+ * Resolve each path relative to the config file (when possible) if the experimental flag is enabled
+ * Otherwise, resolve relative to the current working directory
+ *
+ * @param {any} context
+ * @param {ContentPath[]} contentPaths
+ * @returns {ContentPath[]}
+ */ function resolveRelativePaths(context, contentPaths) {
+    let resolveFrom = [];
+    // Resolve base paths relative to the config file (when possible) if the experimental flag is enabled
+    if (context.userConfigPath && context.tailwindConfig.content.relative) {
+        resolveFrom = [
+            _path.default.dirname(context.userConfigPath)
+        ];
+    }
+    return contentPaths.map((contentPath)=>{
+        contentPath.base = _path.default.resolve(...resolveFrom, contentPath.base);
+        return contentPath;
+    });
+}
+/**
+ * Resolve the symlink for the base directory / file in each path
+ * These are added as additional dependencies to watch for changes because
+ * some tools (like webpack) will only watch the actual file or directory
+ * but not the symlink itself even in projects that use monorepos.
+ *
+ * @param {ContentPath} contentPath
+ * @returns {ContentPath[]}
+ */ function resolvePathSymlinks(contentPath) {
+    let paths = [
+        contentPath
+    ];
+    try {
+        let resolvedPath = _fs.default.realpathSync(contentPath.base);
+        if (resolvedPath !== contentPath.base) {
+            paths.push({
+                ...contentPath,
+                base: resolvedPath
+            });
+        }
+    } catch  {
+    // TODO: log this?
+    }
+    return paths;
+}
+function resolvedChangedContent(context, candidateFiles, fileModifiedMap) {
+    let changedContent = context.tailwindConfig.content.files.filter((item)=>typeof item.raw === "string").map(({ raw , extension ="html"  })=>({
+            content: raw,
+            extension
+        }));
+    for (let changedFile of resolveChangedFiles(candidateFiles, fileModifiedMap)){
+        let content = _fs.default.readFileSync(changedFile, "utf8");
+        let extension = _path.default.extname(changedFile).slice(1);
+        changedContent.push({
+            content,
+            extension
+        });
+    }
+    return changedContent;
+}
+/**
+ *
+ * @param {ContentPath[]} candidateFiles
+ * @param {Map<string, number>} fileModifiedMap
+ * @returns {Set<string>}
+ */ function resolveChangedFiles(candidateFiles, fileModifiedMap) {
+    let paths = candidateFiles.map((contentPath)=>contentPath.pattern);
+    let changedFiles = new Set();
+    _sharedState.env.DEBUG && console.time("Finding changed files");
+    let files = _fastGlob.default.sync(paths, {
+        absolute: true
+    });
+    for (let file of files){
+        let prevModified = fileModifiedMap.has(file) ? fileModifiedMap.get(file) : -Infinity;
+        let modified = _fs.default.statSync(file).mtimeMs;
+        if (modified > prevModified) {
+            changedFiles.add(file);
+            fileModifiedMap.set(file, modified);
+        }
+    }
+    _sharedState.env.DEBUG && console.timeEnd("Finding changed files");
+    return changedFiles;
+}

package/lib/lib/defaultExtractor.js

@@ -85,7 +85,7 @@ function* buildRegExps(context) {
                     // Not immediately followed by an `{[(`
                     /(?![{([]])/,
                     // optionally followed by an opacity modifier
-                    /(?:\/[^\s'"`\\><$]*)?/, 
+                    /(?:\/[^\s'"`\\><$]*)?/
                 ]),
                 _regex.pattern([
                     // Arbitrary values
@@ -93,16 +93,21 @@ 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'"`\\$={><]*/
+            ]))
+        ])
     ]);
     let variantPatterns = [
         // Without quotes
         _regex.any([
+            // This is here to provide special support for the `@` variant
+            _regex.pattern([
+                /@\[[^\s"'`]+\](\/[^\s"'`]+)?/,
+                separator
+            ]),
             _regex.pattern([
                 /([^\s"'`\[\\]+-)?\[[^\s"'`]+\]/,
                 separator
@@ -110,7 +115,7 @@ function* buildRegExps(context) {
             _regex.pattern([
                 /[^\s"'`\[\\]+/,
                 separator
-            ]), 
+            ])
         ]),
         // With quotes allowed
         _regex.any([
@@ -121,8 +126,8 @@ function* buildRegExps(context) {
             _regex.pattern([
                 /[^\s`\[\\]+/,
                 separator
-            ]), 
-        ]), 
+            ])
+        ])
     ];
     for (const variantPattern of variantPatterns){
         yield _regex.pattern([
@@ -145,8 +150,8 @@ function* buildRegExps(context) {
                     /\)/
                 ]),
                 // Arbitrary properties, constrained utilities, arbitrary values, etc…
-                utility, 
-            ]) : utility, 
+                utility
+            ]) : utility
         ]);
     }
     // 5. Inner matches

package/lib/lib/detectNesting.js

@@ -16,7 +16,7 @@ function _default(_context) {
                 node.warn(result, [
                     "Nested @tailwind rules were detected, but are not supported.",
                     "Consider using a prefix to scope Tailwind's classes: https://tailwindcss.com/docs/configuration#prefix",
-                    "Alternatively, use the important selector strategy: https://tailwindcss.com/docs/configuration#selector-strategy", 
+                    "Alternatively, use the important selector strategy: https://tailwindcss.com/docs/configuration#selector-strategy"
                 ].join("\n"));
                 return false;
             }
@@ -28,7 +28,7 @@ function _default(_context) {
                 nestedRule.warn(result, [
                     "Nested CSS was detected, but CSS nesting has not been configured correctly.",
                     "Please enable a CSS nesting plugin *before* Tailwind in your configuration.",
-                    "See how here: https://tailwindcss.com/docs/using-with-preprocessors#nesting", 
+                    "See how here: https://tailwindcss.com/docs/using-with-preprocessors#nesting"
                 ].join("\n"));
                 return false;
             });

package/lib/lib/evaluateTailwindFunctions.js

@@ -15,6 +15,7 @@ const _buildMediaQuery = /*#__PURE__*/ _interopRequireDefault(require("../util/b
 const _toPath = require("../util/toPath");
 const _withAlphaVariable = require("../util/withAlphaVariable");
 const _pluginUtils = require("../util/pluginUtils");
+const _log = /*#__PURE__*/ _interopRequireDefault(require("../util/log"));
 function _interopRequireDefault(obj) {
     return obj && obj.__esModule ? obj : {
         default: obj
@@ -179,11 +180,26 @@ let nodeTypePropertyMap = {
     var ref;
     return (ref = results.find((result)=>result.isValid)) !== null && ref !== void 0 ? ref : results[0];
 }
-function _default({ tailwindConfig: config  }) {
+function _default(context) {
+    let config = context.tailwindConfig;
     let functions = {
         theme: (node, path, ...defaultValue)=>{
             let { isValid , value , error , alpha  } = resolvePath(config, path, defaultValue.length ? defaultValue : undefined);
             if (!isValid) {
+                var ref;
+                let parentNode = node.parent;
+                let candidate = (ref = parentNode === null || parentNode === void 0 ? void 0 : parentNode.raws.tailwind) === null || ref === void 0 ? void 0 : ref.candidate;
+                if (parentNode && candidate !== undefined) {
+                    // Remove this utility from any caches
+                    context.markInvalidUtilityNode(parentNode);
+                    // Remove the CSS node from the markup
+                    parentNode.remove();
+                    // Show a warning
+                    _log.default.warn("invalid-theme-key-in-class", [
+                        `The utility \`${candidate}\` contains an invalid theme value and was not generated.`
+                    ]);
+                    return;
+                }
                 throw node.error(error);
             }
             let maybeColor = (0, _pluginUtils.parseColorFormat)(value);

package/lib/lib/expandApplyAtRules.js

@@ -9,7 +9,6 @@ Object.defineProperty(exports, "default", {
 const _postcss = /*#__PURE__*/ _interopRequireDefault(require("postcss"));
 const _postcssSelectorParser = /*#__PURE__*/ _interopRequireDefault(require("postcss-selector-parser"));
 const _generateRules = require("./generateRules");
-const _bigSign = /*#__PURE__*/ _interopRequireDefault(require("../util/bigSign"));
 const _escapeClassName = /*#__PURE__*/ _interopRequireDefault(require("../util/escapeClassName"));
 function _interopRequireDefault(obj) {
     return obj && obj.__esModule ? obj : {
@@ -41,11 +40,11 @@ function _interopRequireDefault(obj) {
         groups: normalizedGroups
     });
 }
-let selectorExtractor = (0, _postcssSelectorParser.default)((root)=>root.nodes.map((node)=>node.toString()));
+let selectorExtractor = (0, _postcssSelectorParser.default)();
 /**
  * @param {string} ruleSelectors
  */ function extractSelectors(ruleSelectors) {
-    return selectorExtractor.transformSync(ruleSelectors);
+    return selectorExtractor.astSync(ruleSelectors);
 }
 function extractBaseCandidates(candidates, separator) {
     let baseClasses = new Set();
@@ -137,8 +136,7 @@ function* pathToRoot(node) {
  * @param {import('postcss').Root} root
  */ function buildLocalApplyCache(root, context) {
     /** @type {ApplyCache} */ let cache = new Map();
-    let highestOffset = context.layerOrder.user >> 4n;
-    root.walkRules((rule, idx)=>{
+    root.walkRules((rule)=>{
         // Ignore rules generated by Tailwind
         for (let node of pathToRoot(rule)){
             var ref;
@@ -148,16 +146,17 @@ function* pathToRoot(node) {
         }
         // Clone what's required to represent this singular rule in the tree
         let container = nestedClone(rule);
+        let sort = context.offsets.create("user");
         for (let className of extractClasses(rule)){
             let list = cache.get(className) || [];
             cache.set(className, list);
             list.push([
                 {
                     layer: "user",
-                    sort: BigInt(idx) + highestOffset,
+                    sort,
                     important: false
                 },
-                container, 
+                container
             ]);
         }
     });
@@ -268,30 +267,64 @@ function processApply(root, context, localCache) {
    * What happens in this function is that we prepend a `.` and escape the candidate.
    * This will result in `.hover\:font-bold`
    * Which means that we can replace `.hover\:font-bold` with `.abc` in `.hover\:font-bold:hover` resulting in `.abc:hover`
-   */ // TODO: Should we use postcss-selector-parser for this instead?
-    function replaceSelector(selector, utilitySelectors, candidate) {
-        let needle = `.${(0, _escapeClassName.default)(candidate)}`;
-        let needles = [
-            ...new Set([
-                needle,
-                needle.replace(/\\2c /g, "\\,")
-            ])
-        ];
+   *
+   * @param {string} selector
+   * @param {string} utilitySelectors
+   * @param {string} candidate
+   */ function replaceSelector(selector, utilitySelectors, candidate) {
+        let selectorList = extractSelectors(selector);
         let utilitySelectorsList = extractSelectors(utilitySelectors);
-        return extractSelectors(selector).map((s)=>{
-            let replaced = [];
-            for (let utilitySelector of utilitySelectorsList){
-                let replacedSelector = utilitySelector;
-                for (const needle of needles){
-                    replacedSelector = replacedSelector.replace(needle, s);
-                }
-                if (replacedSelector === utilitySelector) {
-                    continue;
-                }
-                replaced.push(replacedSelector);
+        let candidateList = extractSelectors(`.${(0, _escapeClassName.default)(candidate)}`);
+        let candidateClass = candidateList.nodes[0].nodes[0];
+        selectorList.each((sel)=>{
+            /** @type {Set<import('postcss-selector-parser').Selector>} */ let replaced = new Set();
+            utilitySelectorsList.each((utilitySelector)=>{
+                let hasReplaced = false;
+                utilitySelector = utilitySelector.clone();
+                utilitySelector.walkClasses((node)=>{
+                    if (node.value !== candidateClass.value) {
+                        return;
+                    }
+                    // Don't replace multiple instances of the same class
+                    // This is theoretically correct but only partially
+                    // We'd need to generate every possible permutation of the replacement
+                    // For example with `.foo + .foo { … }` and `section { @apply foo; }`
+                    // We'd need to generate all of these:
+                    // - `.foo + .foo`
+                    // - `.foo + section`
+                    // - `section + .foo`
+                    // - `section + section`
+                    if (hasReplaced) {
+                        return;
+                    }
+                    // Since you can only `@apply` class names this is sufficient
+                    // We want to replace the matched class name with the selector the user is using
+                    // Ex: Replace `.text-blue-500` with `.foo.bar:is(.something-cool)`
+                    node.replaceWith(...sel.nodes.map((node)=>node.clone()));
+                    // Record that we did something and we want to use this new selector
+                    replaced.add(utilitySelector);
+                    hasReplaced = true;
+                });
+            });
+            // Sort tag names before class names
+            // This happens when replacing `.bar` in `.foo.bar` with a tag like `section`
+            for (const sel1 of replaced){
+                sel1.sort((a, b)=>{
+                    if (a.type === "tag" && b.type === "class") {
+                        return -1;
+                    } else if (a.type === "class" && b.type === "tag") {
+                        return 1;
+                    } else if (a.type === "class" && b.type === "pseudo") {
+                        return -1;
+                    } else if (a.type === "pseudo" && b.type === "class") {
+                        return 1;
+                    }
+                    return sel1.index(a) - sel1.index(b);
+                });
             }
-            return replaced.join(", ");
-        }).join(", ");
+            sel.replaceWith(...replaced);
+        });
+        return selectorList.toString();
     }
     let perParentApplies = new Map();
     // Collect all apply candidates and their rules
@@ -338,7 +371,7 @@ function processApply(root, context, localCache) {
                 applyCandidate1,
                 ...extractBaseCandidates([
                     applyCandidate1
-                ], context.tailwindConfig.separator), 
+                ], context.tailwindConfig.separator)
             ];
             for (let [meta, node] of rules1){
                 let parentClasses = extractClasses(parent);
@@ -443,17 +476,13 @@ function processApply(root, context, localCache) {
                 }
                 // Insert it
                 siblings.push([
-                    // Ensure that when we are sorting, that we take the layer order into account
-                    {
-                        ...meta,
-                        sort: meta.sort | context.layerOrder[meta.layer]
-                    },
-                    root1.nodes[0], 
+                    meta.sort,
+                    root1.nodes[0]
                 ]);
             }
         }
         // Inject the rules, sorted, correctly
-        let nodes = siblings.sort(([a], [z])=>(0, _bigSign.default)(a.sort - z.sort)).map((s)=>s[1]);
+        let nodes = context.offsets.sort(siblings).map((s)=>s[1]);
         // `parent` refers to the node at `.abc` in: .abc { @apply mt-2 }
         parent.after(nodes);
     }

package/lib/lib/expandTailwindAtRules.js

@@ -9,7 +9,6 @@ Object.defineProperty(exports, "default", {
 const _quickLru = /*#__PURE__*/ _interopRequireDefault(require("quick-lru"));
 const _sharedState = /*#__PURE__*/ _interopRequireWildcard(require("./sharedState"));
 const _generateRules = require("./generateRules");
-const _bigSign = /*#__PURE__*/ _interopRequireDefault(require("../util/bigSign"));
 const _log = /*#__PURE__*/ _interopRequireDefault(require("../util/log"));
 const _cloneNodes = /*#__PURE__*/ _interopRequireDefault(require("../util/cloneNodes"));
 const _defaultExtractor = require("./defaultExtractor");
@@ -103,49 +102,21 @@ function getClassCandidates(content, extractor, candidates, seen) {
         }
     }
 }
-function buildStylesheet(rules, context) {
-    let sortedRules = rules.sort(([a], [z])=>(0, _bigSign.default)(a - z));
+/**
+ *
+ * @param {[import('./offsets.js').RuleOffset, import('postcss').Node][]} rules
+ * @param {*} context
+ */ function buildStylesheet(rules, context) {
+    let sortedRules = context.offsets.sort(rules);
     let returnValue = {
         base: new Set(),
         defaults: new Set(),
         components: new Set(),
         utilities: new Set(),
-        variants: new Set(),
-        // All the CSS that is not Tailwind related can be put in this bucket. This
-        // will make it easier to later use this information when we want to
-        // `@apply` for example. The main reason we do this here is because we
-        // still need to make sure the order is correct. Last but not least, we
-        // will make sure to always re-inject this section into the css, even if
-        // certain rules were not used. This means that it will look like a no-op
-        // from the user's perspective, but we gathered all the useful information
-        // we need.
-        user: new Set()
+        variants: new Set()
     };
     for (let [sort, rule] of sortedRules){
-        if (sort >= context.minimumScreen) {
-            returnValue.variants.add(rule);
-            continue;
-        }
-        if (sort & context.layerOrder.base) {
-            returnValue.base.add(rule);
-            continue;
-        }
-        if (sort & context.layerOrder.defaults) {
-            returnValue.defaults.add(rule);
-            continue;
-        }
-        if (sort & context.layerOrder.components) {
-            returnValue.components.add(rule);
-            continue;
-        }
-        if (sort & context.layerOrder.utilities) {
-            returnValue.utilities.add(rule);
-            continue;
-        }
-        if (sort & context.layerOrder.user) {
-            returnValue.user.add(rule);
-            continue;
-        }
+        returnValue[sort.layer].add(rule);
     }
     return returnValue;
 }
@@ -188,14 +159,11 @@ function expandTailwindAtRules(context) {
         // Generate the actual CSS
         let classCacheCount = context.classCache.size;
         env.DEBUG && console.time("Generate rules");
-        let rules = (0, _generateRules.generateRules)(candidates, context);
+        (0, _generateRules.generateRules)(candidates, context);
         env.DEBUG && console.timeEnd("Generate rules");
         // We only ever add to the classCache, so if it didn't grow, there is nothing new.
         env.DEBUG && console.time("Build stylesheet");
         if (context.stylesheetCache === null || context.classCache.size !== classCacheCount) {
-            for (let rule of rules){
-                context.ruleCache.add(rule);
-            }
             context.stylesheetCache = buildStylesheet([
                 ...context.ruleCache
             ], context);
@@ -259,7 +227,7 @@ function expandTailwindAtRules(context) {
         if (layerNodes.utilities && utilityNodes.size === 0 && !hasUtilityVariants) {
             _log.default.warn("content-problems", [
                 "No utility classes were detected in your source files. If this is unexpected, double-check the `content` option in your Tailwind CSS configuration.",
-                "https://tailwindcss.com/docs/content-configuration", 
+                "https://tailwindcss.com/docs/content-configuration"
             ]);
         }
         // ---

package/lib/lib/findAtConfigPath.js

@@ -0,0 +1,44 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "findAtConfigPath", {
+    enumerable: true,
+    get: ()=>findAtConfigPath
+});
+const _fs = /*#__PURE__*/ _interopRequireDefault(require("fs"));
+const _path = /*#__PURE__*/ _interopRequireDefault(require("path"));
+function _interopRequireDefault(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+function findAtConfigPath(root, result) {
+    let configPath = null;
+    let relativeTo = null;
+    root.walkAtRules("config", (rule)=>{
+        var ref;
+        var _file, ref1;
+        relativeTo = (ref1 = (_file = (ref = rule.source) === null || ref === void 0 ? void 0 : ref.input.file) !== null && _file !== void 0 ? _file : result.opts.from) !== null && ref1 !== void 0 ? ref1 : null;
+        if (relativeTo === null) {
+            throw rule.error("The `@config` directive cannot be used without setting `from` in your PostCSS config.");
+        }
+        if (configPath) {
+            throw rule.error("Only one `@config` directive is allowed per file.");
+        }
+        let matches = rule.params.match(/(['"])(.*?)\1/);
+        if (!matches) {
+            throw rule.error("A path is required when using the `@config` directive.");
+        }
+        let inputPath = matches[2];
+        if (_path.default.isAbsolute(inputPath)) {
+            throw rule.error("The `@config` directive cannot be used with an absolute path.");
+        }
+        configPath = _path.default.resolve(_path.default.dirname(relativeTo), inputPath);
+        if (!_fs.default.existsSync(configPath)) {
+            throw rule.error(`The config file at "${inputPath}" does not exist. Make sure the path is correct and the file exists.`);
+        }
+        rule.remove();
+    });
+    return configPath ? configPath : null;
+}