tailwindcss 3.0.12 → 3.0.16

package/lib/lib/expandTailwindAtRules.js

@@ -7,6 +7,7 @@ var _quickLru = _interopRequireDefault(require("quick-lru"));
 var sharedState = _interopRequireWildcard(require("./sharedState"));
 var _generateRules = require("./generateRules");
 var _bigSign = _interopRequireDefault(require("../util/bigSign"));
+var _log = _interopRequireDefault(require("../util/log"));
 var _cloneNodes = _interopRequireDefault(require("../util/cloneNodes"));
 var _defaultExtractor = require("./defaultExtractor");
 function _interopRequireDefault(obj) {
@@ -18,13 +19,11 @@ function _interopRequireWildcard(obj) {
     if (obj && obj.__esModule) {
         return obj;
     } else {
-        var newObj = {
-        };
+        var newObj = {};
         if (obj != null) {
             for(var key in obj){
                 if (Object.prototype.hasOwnProperty.call(obj, key)) {
-                    var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {
-                    };
+                    var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {};
                     if (desc.get || desc.set) {
                         Object.defineProperty(newObj, key, desc);
                     } else {
@@ -193,8 +192,6 @@ function expandTailwindAtRules(context) {
                 ...baseNodes,
                 ...defaultNodes
             ], layerNodes.base.source));
-        }
-        if (layerNodes.base) {
             layerNodes.base.remove();
         }
         if (layerNodes.components) {
@@ -209,15 +206,34 @@ function expandTailwindAtRules(context) {
             ], layerNodes.utilities.source));
             layerNodes.utilities.remove();
         }
+        // We do post-filtering to not alter the emitted order of the variants
+        const variantNodes = Array.from(screenNodes).filter((node)=>{
+            var ref;
+            const parentLayer = (ref = node.raws.tailwind) === null || ref === void 0 ? void 0 : ref.parentLayer;
+            if (parentLayer === 'components') {
+                return layerNodes.components !== null;
+            }
+            if (parentLayer === 'utilities') {
+                return layerNodes.utilities !== null;
+            }
+            return true;
+        });
         if (layerNodes.variants) {
-            layerNodes.variants.before((0, _cloneNodes).default([
-                ...screenNodes
-            ], layerNodes.variants.source));
+            layerNodes.variants.before((0, _cloneNodes).default(variantNodes, layerNodes.variants.source));
             layerNodes.variants.remove();
-        } else {
-            root.append((0, _cloneNodes).default([
-                ...screenNodes
-            ], root.source));
+        } else if (variantNodes.length > 0) {
+            root.append((0, _cloneNodes).default(variantNodes, root.source));
+        }
+        // If we've got a utility layer and no utilities are generated there's likely something wrong
+        const hasUtilityVariants = variantNodes.some((node)=>{
+            var ref;
+            return ((ref = node.raws.tailwind) === null || ref === void 0 ? void 0 : ref.parentLayer) === 'utilities';
+        });
+        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', 
+            ]);
         }
         // ---
         if (env.DEBUG) {

package/lib/lib/generateRules.js

@@ -217,6 +217,13 @@ function applyVariant(variant, matches, context) {
                         rule.selector = before;
                     });
                 }
+                // This tracks the originating layer for the variant
+                // For example:
+                // .sm:underline {} is a variant of something in the utilities layer
+                // .sm:container {} is a variant of the container component
+                clone.nodes[0].raws.tailwind = {
+                    parentLayer: meta.layer
+                };
                 var _collectedFormats;
                 let withOffset = [
                     {
@@ -233,8 +240,7 @@ function applyVariant(variant, matches, context) {
     }
     return [];
 }
-function parseRules(rule, cache, options = {
-}) {
+function parseRules(rule, cache, options = {}) {
     // PostCSS node
     if (!(0, _isPlainObject).default(rule) && !Array.isArray(rule)) {
         return [

package/lib/lib/normalizeTailwindDirectives.js

@@ -49,7 +49,8 @@ function normalizeTailwindDirectives(root) {
             ].includes(atRule.name)) {
                 _log.default.warn(`${atRule.name}-at-rule-deprecated`, [
                     `The \`@${atRule.name}\` directive has been deprecated in Tailwind CSS v3.0.`,
-                    `Use \`@layer utilities\` or \`@layer components\` instead.`, 
+                    `Use \`@layer utilities\` or \`@layer components\` instead.`,
+                    'https://tailwindcss.com/docs/upgrade-guide#replace-variants-with-layer', 
                 ]);
             }
             layerDirectives.add(atRule);

package/lib/lib/partitionApplyAtRules.js

@@ -0,0 +1,53 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+exports.default = expandApplyAtRules;
+function partitionRules(root) {
+    if (!root.walkAtRules) return;
+    let applyParents = new Set();
+    root.walkAtRules('apply', (rule)=>{
+        applyParents.add(rule.parent);
+    });
+    if (applyParents.size === 0) {
+        return;
+    }
+    for (let rule1 of applyParents){
+        let nodeGroups = [];
+        let lastGroup = [];
+        for (let node of rule1.nodes){
+            if (node.type === 'atrule' && node.name === 'apply') {
+                if (lastGroup.length > 0) {
+                    nodeGroups.push(lastGroup);
+                    lastGroup = [];
+                }
+                nodeGroups.push([
+                    node
+                ]);
+            } else {
+                lastGroup.push(node);
+            }
+        }
+        if (lastGroup.length > 0) {
+            nodeGroups.push(lastGroup);
+        }
+        if (nodeGroups.length === 1) {
+            continue;
+        }
+        for (let group of [
+            ...nodeGroups
+        ].reverse()){
+            let clone = rule1.clone({
+                nodes: []
+            });
+            clone.append(group);
+            rule1.after(clone);
+        }
+        rule1.remove();
+    }
+}
+function expandApplyAtRules() {
+    return (root)=>{
+        partitionRules(root);
+    };
+}

package/lib/lib/setupContextUtils.js

@@ -33,13 +33,11 @@ function _interopRequireWildcard(obj) {
     if (obj && obj.__esModule) {
         return obj;
     } else {
-        var newObj = {
-        };
+        var newObj = {};
         if (obj != null) {
             for(var key in obj){
                 if (Object.prototype.hasOwnProperty.call(obj, key)) {
-                    var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {
-                    };
+                    var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {};
                     if (desc.get || desc.set) {
                         Object.defineProperty(newObj, key, desc);
                     } else {
@@ -52,55 +50,6 @@ function _interopRequireWildcard(obj) {
         return newObj;
     }
 }
-function partitionRules(root) {
-    if (!root.walkAtRules) return [
-        root
-    ];
-    let applyParents = new Set();
-    let rules = [];
-    root.walkAtRules('apply', (rule)=>{
-        applyParents.add(rule.parent);
-    });
-    if (applyParents.size === 0) {
-        rules.push(root);
-    }
-    for (let rule1 of applyParents){
-        let nodeGroups = [];
-        let lastGroup = [];
-        for (let node of rule1.nodes){
-            if (node.type === 'atrule' && node.name === 'apply') {
-                if (lastGroup.length > 0) {
-                    nodeGroups.push(lastGroup);
-                    lastGroup = [];
-                }
-                nodeGroups.push([
-                    node
-                ]);
-            } else {
-                lastGroup.push(node);
-            }
-        }
-        if (lastGroup.length > 0) {
-            nodeGroups.push(lastGroup);
-        }
-        if (nodeGroups.length === 1) {
-            rules.push(rule1);
-            continue;
-        }
-        for (let group of [
-            ...nodeGroups
-        ].reverse()){
-            let clone = rule1.clone({
-                nodes: []
-            });
-            clone.append(group);
-            rules.unshift(clone);
-            rule1.after(clone);
-        }
-        rule1.remove();
-    }
-    return rules;
-}
 function parseVariantFormatString(input) {
     if (input.includes('{')) {
         if (!isBalanced(input)) throw new Error(`Your { and } are unbalanced.`);
@@ -125,8 +74,7 @@ function isBalanced(input) {
     }
     return count === 0;
 }
-function insertInto(list, value, { before =[]  } = {
-}) {
+function insertInto(list, value, { before =[]  } = {}) {
     before = [].concat(before);
     if (before.length <= 0) {
         list.push(value);
@@ -232,8 +180,7 @@ function buildPluginApi(tailwindConfig, context, { variantList , variantMap , of
         return context.tailwindConfig.prefix + identifier;
     }
     return {
-        addVariant (variantName, variantFunctions, options = {
-        }) {
+        addVariant (variantName, variantFunctions, options = {}) {
             variantFunctions = [].concat(variantFunctions).map((variantFunction)=>{
                 if (typeof variantFunction !== 'string') {
                     // Safelist public API functions
@@ -294,37 +241,34 @@ function buildPluginApi(tailwindConfig, context, { variantList , variantMap , of
             return [];
         },
         addUserCss (userCss) {
-            for (let [identifier, rule2] of withIdentifiers(userCss)){
+            for (let [identifier, rule] of withIdentifiers(userCss)){
                 let offset = offsets.user++;
                 if (!context.candidateRuleMap.has(identifier)) {
                     context.candidateRuleMap.set(identifier, []);
                 }
-                context.candidateRuleMap.get(identifier).push(...partitionRules(rule2).map((rule)=>[
-                        {
-                            sort: offset,
-                            layer: 'user'
-                        },
-                        rule
-                    ]
-                ));
+                context.candidateRuleMap.get(identifier).push([
+                    {
+                        sort: offset,
+                        layer: 'user'
+                    },
+                    rule
+                ]);
             }
         },
         addBase (base) {
-            for (let [identifier, rule3] of withIdentifiers(base)){
-                let prefixedIdentifier = prefixIdentifier(identifier, {
-                });
+            for (let [identifier, rule] of withIdentifiers(base)){
+                let prefixedIdentifier = prefixIdentifier(identifier, {});
                 let offset = offsets.base++;
                 if (!context.candidateRuleMap.has(prefixedIdentifier)) {
                     context.candidateRuleMap.set(prefixedIdentifier, []);
                 }
-                context.candidateRuleMap.get(prefixedIdentifier).push(...partitionRules(rule3).map((rule)=>[
-                        {
-                            sort: offset,
-                            layer: 'base'
-                        },
-                        rule
-                    ]
-                ));
+                context.candidateRuleMap.get(prefixedIdentifier).push([
+                    {
+                        sort: offset,
+                        layer: 'base'
+                    },
+                    rule
+                ]);
             }
         },
         /**
@@ -334,20 +278,18 @@ function buildPluginApi(tailwindConfig, context, { variantList , variantMap , of
             const groups = {
                 [`@defaults ${group}`]: declarations
             };
-            for (let [identifier, rule4] of withIdentifiers(groups)){
-                let prefixedIdentifier = prefixIdentifier(identifier, {
-                });
+            for (let [identifier, rule] of withIdentifiers(groups)){
+                let prefixedIdentifier = prefixIdentifier(identifier, {});
                 if (!context.candidateRuleMap.has(prefixedIdentifier)) {
                     context.candidateRuleMap.set(prefixedIdentifier, []);
                 }
-                context.candidateRuleMap.get(prefixedIdentifier).push(...partitionRules(rule4).map((rule)=>[
-                        {
-                            sort: offsets.base++,
-                            layer: 'defaults'
-                        },
-                        rule, 
-                    ]
-                ));
+                context.candidateRuleMap.get(prefixedIdentifier).push([
+                    {
+                        sort: offsets.base++,
+                        layer: 'defaults'
+                    },
+                    rule
+                ]);
             }
         },
         addComponents (components, options) {
@@ -355,24 +297,21 @@ function buildPluginApi(tailwindConfig, context, { variantList , variantMap , of
                 respectPrefix: true,
                 respectImportant: false
             };
-            options = Object.assign({
-            }, defaultOptions, Array.isArray(options) ? {
-            } : options);
-            for (let [identifier, rule5] of withIdentifiers(components)){
+            options = Object.assign({}, defaultOptions, Array.isArray(options) ? {} : options);
+            for (let [identifier, rule] of withIdentifiers(components)){
                 let prefixedIdentifier = prefixIdentifier(identifier, options);
                 classList.add(prefixedIdentifier);
                 if (!context.candidateRuleMap.has(prefixedIdentifier)) {
                     context.candidateRuleMap.set(prefixedIdentifier, []);
                 }
-                context.candidateRuleMap.get(prefixedIdentifier).push(...partitionRules(rule5).map((rule)=>[
-                        {
-                            sort: offsets.components++,
-                            layer: 'components',
-                            options
-                        },
-                        rule, 
-                    ]
-                ));
+                context.candidateRuleMap.get(prefixedIdentifier).push([
+                    {
+                        sort: offsets.components++,
+                        layer: 'components',
+                        options
+                    },
+                    rule
+                ]);
             }
         },
         addUtilities (utilities, options) {
@@ -380,24 +319,21 @@ function buildPluginApi(tailwindConfig, context, { variantList , variantMap , of
                 respectPrefix: true,
                 respectImportant: true
             };
-            options = Object.assign({
-            }, defaultOptions, Array.isArray(options) ? {
-            } : options);
-            for (let [identifier, rule6] of withIdentifiers(utilities)){
+            options = Object.assign({}, defaultOptions, Array.isArray(options) ? {} : options);
+            for (let [identifier, rule] of withIdentifiers(utilities)){
                 let prefixedIdentifier = prefixIdentifier(identifier, options);
                 classList.add(prefixedIdentifier);
                 if (!context.candidateRuleMap.has(prefixedIdentifier)) {
                     context.candidateRuleMap.set(prefixedIdentifier, []);
                 }
-                context.candidateRuleMap.get(prefixedIdentifier).push(...partitionRules(rule6).map((rule)=>[
-                        {
-                            sort: offsets.utilities++,
-                            layer: 'utilities',
-                            options
-                        },
-                        rule, 
-                    ]
-                ));
+                context.candidateRuleMap.get(prefixedIdentifier).push([
+                    {
+                        sort: offsets.utilities++,
+                        layer: 'utilities',
+                        options
+                    },
+                    rule
+                ]);
             }
         },
         matchUtilities: function(utilities, options) {
@@ -728,7 +664,8 @@ function registerPlugins(plugins, context) {
             if (value1 instanceof RegExp) {
                 _log.default.warn('root-regex', [
                     'Regular expressions in `safelist` work differently in Tailwind CSS v3.0.',
-                    'Update your `safelist` configuration to eliminate this warning.'
+                    'Update your `safelist` configuration to eliminate this warning.',
+                    'https://tailwindcss.com/docs/content-configuration#safelisting-classes', 
                 ]);
                 continue;
             }
@@ -740,8 +677,7 @@ function registerPlugins(plugins, context) {
                 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 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)
                     );
                     if (options === null || options === void 0 ? void 0 : options.supportsNegativeValues) {
                         classes = [
@@ -781,7 +717,8 @@ function registerPlugins(plugins, context) {
                 if (count !== 0) continue;
                 _log.default.warn([
                     `The safelist pattern \`${regex}\` doesn't match any Tailwind CSS classes.`,
-                    'Fix this pattern or remove it from your `safelist` configuration.', 
+                    'Fix this pattern or remove it from your `safelist` configuration.',
+                    'https://tailwindcss.com/docs/content-configuration#safelisting-classes', 
                 ]);
             }
         }
@@ -795,8 +732,7 @@ function registerPlugins(plugins, context) {
                 let [utilName, options] = util;
                 let negativeClasses = [];
                 var ref;
-                for (let [key, value] of Object.entries((ref = options === null || options === void 0 ? void 0 : options.values) !== null && ref !== void 0 ? ref : {
-                })){
+                for (let [key, value] of Object.entries((ref = options === null || options === void 0 ? void 0 : options.values) !== null && ref !== void 0 ? ref : {})){
                     output.push((0, _nameClass).formatClass(utilName, key));
                     if ((options === null || options === void 0 ? void 0 : options.supportsNegativeValues) && (0, _negateValue).default(value)) {
                         negativeClasses.push((0, _nameClass).formatClass(utilName, `-${key}`));

package/lib/postcss-plugins/nesting/index.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+exports.default = void 0;
+var _plugin = require("./plugin");
+var _default = Object.assign(function(opts) {
+    return {
+        postcssPlugin: 'tailwindcss/nesting',
+        Once (root, { result  }) {
+            return (0, _plugin).nesting(opts)(root, result);
+        }
+    };
+}, {
+    postcss: true
+});
+exports.default = _default;

package/lib/postcss-plugins/nesting/plugin.js

@@ -0,0 +1,53 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+exports.nesting = nesting;
+var _postcss = _interopRequireDefault(require("postcss"));
+var _postcssNested = _interopRequireDefault(require("postcss-nested"));
+function _interopRequireDefault(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+function nesting(opts = _postcssNested.default) {
+    return (root, result)=>{
+        root.walkAtRules('screen', (rule)=>{
+            rule.name = 'media';
+            rule.params = `screen(${rule.params})`;
+        });
+        root.walkAtRules('apply', (rule)=>{
+            rule.before(_postcss.default.decl({
+                prop: '__apply',
+                value: rule.params,
+                source: rule.source
+            }));
+            rule.remove();
+        });
+        let plugin = (()=>{
+            var ref;
+            if (typeof opts === 'function' || typeof opts === 'object' && (opts === null || opts === void 0 ? void 0 : (ref = opts.hasOwnProperty) === null || ref === void 0 ? void 0 : ref.call(opts, 'postcssPlugin'))) {
+                return opts;
+            }
+            if (typeof opts === 'string') {
+                return require(opts);
+            }
+            if (Object.keys(opts).length <= 0) {
+                return _postcssNested.default;
+            }
+            throw new Error('tailwindcss/nesting should be loaded with a nesting plugin.');
+        })();
+        (0, _postcss).default([
+            plugin
+        ]).process(root, result.opts).sync();
+        root.walkDecls('__apply', (decl)=>{
+            decl.before(_postcss.default.atRule({
+                name: 'apply',
+                params: decl.value,
+                source: decl.source
+            }));
+            decl.remove();
+        });
+        return root;
+    };
+}

package/lib/processTailwindFeatures.js

@@ -11,6 +11,7 @@ var _substituteScreenAtRules = _interopRequireDefault(require("./lib/substituteS
 var _resolveDefaultsAtRules = _interopRequireDefault(require("./lib/resolveDefaultsAtRules"));
 var _collapseAdjacentRules = _interopRequireDefault(require("./lib/collapseAdjacentRules"));
 var _collapseDuplicateDeclarations = _interopRequireDefault(require("./lib/collapseDuplicateDeclarations"));
+var _partitionApplyAtRules = _interopRequireDefault(require("./lib/partitionApplyAtRules"));
 var _detectNesting = _interopRequireDefault(require("./lib/detectNesting"));
 var _setupContextUtils = require("./lib/setupContextUtils");
 var _featureFlags = require("./featureFlags");
@@ -23,6 +24,7 @@ function processTailwindFeatures(setupContext) {
     return function(root, result) {
         let { tailwindDirectives , applyDirectives  } = (0, _normalizeTailwindDirectives).default(root);
         (0, _detectNesting).default()(root, result);
+        (0, _partitionApplyAtRules).default()(root, result);
         let context = setupContext({
             tailwindDirectives,
             applyDirectives,

package/lib/util/createPlugin.js

@@ -9,8 +9,7 @@ function createPlugin(plugin, config) {
         config
     };
 }
-createPlugin.withOptions = function(pluginFunction, configFunction = ()=>({
-    })
+createPlugin.withOptions = function(pluginFunction, configFunction = ()=>({})
 ) {
     const optionsFunction = function(options) {
         return {

package/lib/util/createUtilityPlugin.js

@@ -16,8 +16,7 @@ function createUtilityPlugin(themeKey, utilityVariations = [
             themeKey
         ]
     ]
-], { filterDefault =false , ...options } = {
-}) {
+], { filterDefault =false , ...options } = {}) {
     let transformValue = (0, _transformThemeValue).default(themeKey);
     return function({ matchUtilities , theme  }) {
         for (let utilityVariation of utilityVariations){
@@ -37,15 +36,12 @@ function createUtilityPlugin(themeKey, utilityVariations = [
                             return Object.assign(obj, {
                                 [name]: transformValue(value)
                             });
-                        }, {
-                        });
+                        }, {});
                     }
                 });
-            }, {
-            }), {
+            }, {}), {
                 ...options,
-                values: filterDefault ? Object.fromEntries(Object.entries((ref = theme(themeKey)) !== null && ref !== void 0 ? ref : {
-                }).filter(([modifier])=>modifier !== 'DEFAULT'
+                values: filterDefault ? Object.fromEntries(Object.entries((ref = theme(themeKey)) !== null && ref !== void 0 ? ref : {}).filter(([modifier])=>modifier !== 'DEFAULT'
                 )) : theme(themeKey)
             });
         }

package/lib/util/flattenColorPalette.js

@@ -3,9 +3,7 @@ Object.defineProperty(exports, "__esModule", {
     value: true
 });
 exports.default = void 0;
-const flattenColorPalette = (colors)=>Object.assign({
-    }, ...Object.entries(colors !== null && colors !== void 0 ? colors : {
-    }).flatMap(([color, values])=>typeof values == 'object' ? Object.entries(flattenColorPalette(values)).map(([number, hex])=>({
+const flattenColorPalette = (colors)=>Object.assign({}, ...Object.entries(colors !== null && colors !== void 0 ? colors : {}).flatMap(([color, values])=>typeof values == 'object' ? Object.entries(flattenColorPalette(values)).map(([number, hex])=>({
                 [color + (number === 'DEFAULT' ? '' : `-${number}`)]: hex
             })
         ) : [