tailwindcss 0.0.0-insiders.c5c644f → 0.0.0-insiders.cd5cb00

package/CHANGELOG.md

@@ -29,10 +29,14 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Add `touch-action` utilities ([#5603](https://github.com/tailwindlabs/tailwindcss/pull/5603))
 - Add `inherit` to default color palette ([#5597](https://github.com/tailwindlabs/tailwindcss/pull/5597))
 - Add `overflow-clip`, `overflow-x-clip` and `overflow-y-clip` utilities ([#5630](https://github.com/tailwindlabs/tailwindcss/pull/5630))
+- Add `scroll-snap` utilities ([#5637](https://github.com/tailwindlabs/tailwindcss/pull/5637))
+- Add `border-x` and `border-y` width and color utilities ([#5639](https://github.com/tailwindlabs/tailwindcss/pull/5639))
 
 ### Fixed
 
 - Fix defining colors as functions when color opacity plugins are disabled ([#5470](https://github.com/tailwindlabs/tailwindcss/pull/5470))
+- Fix using negated `content` globs ([#5625](https://github.com/tailwindlabs/tailwindcss/pull/5625))
+- Fix using backslashes in `content` globs ([#5628](https://github.com/tailwindlabs/tailwindcss/pull/5628))
 
 ## [2.2.16] - 2021-09-26
 

package/lib/cli.js

@@ -15,6 +15,7 @@ var _fastGlob = _interopRequireDefault(require("fast-glob"));
 var _getModuleDependencies = _interopRequireDefault(require("./lib/getModuleDependencies"));
 var _log = _interopRequireDefault(require("./util/log"));
 var _packageJson = _interopRequireDefault(require("../package.json"));
+var _normalizePath = _interopRequireDefault(require("normalize-path"));
 function _interopRequireDefault(obj) {
     return obj && obj.__esModule ? obj : {
         default: obj
@@ -386,14 +387,12 @@ async function build() {
         };
         let resolvedConfig = (0, _resolveConfig).default(config);
         if (args['--purge']) {
-            _log.default.warn([
+            _log.default.warn('purge-flag-deprecated', [
                 'The `--purge` flag has been deprecated.',
-                'Please use `--content` instead.'
+                'Please use `--content` instead.', 
             ]);
             if (!args['--content']) {
-                args['--content'] = [
-                    '--purge'
-                ];
+                args['--content'] = args['--purge'];
             }
         }
         if (args['--content']) {
@@ -410,7 +409,8 @@ async function build() {
             // like an object it's probably a raw content object. But this object
             // is not watchable, so let's remove it.
             return typeof file === 'string';
-        });
+        }).map((glob)=>(0, _normalizePath).default(glob)
+        );
     }
     function extractRawContent(config) {
         return extractContent(config).filter((file)=>{

package/lib/corePluginList.js

@@ -48,6 +48,11 @@ var _default = [
     "touchAction",
     "userSelect",
     "resize",
+    "scrollSnapType",
+    "scrollSnapAlign",
+    "scrollSnapStop",
+    "scrollMargin",
+    "scrollPadding",
     "listStylePosition",
     "listStyleType",
     "appearance",

package/lib/corePlugins.js

@@ -263,7 +263,7 @@ var _default = {
         let mode = config('darkMode', 'media');
         if (mode === false) {
             mode = 'media';
-            _log.default.warn([
+            _log.default.warn('darkmode-false', [
                 '`darkMode` is set to `false` in your config.',
                 'This will behave just like the `media` value.', 
             ]);
@@ -1146,6 +1146,165 @@ var _default = {
             }
         });
     },
+    scrollSnapType: ({ addUtilities , addBase  })=>{
+        addBase({
+            '@defaults scroll-snap-type': {
+                '--tw-scroll-snap-strictness': 'proximity'
+            }
+        });
+        addUtilities({
+            '.snap-none': {
+                'scroll-snap-type': 'none'
+            },
+            '.snap-x': {
+                '@defaults scroll-snap-type': {
+                },
+                'scroll-snap-type': 'x var(--tw-scroll-snap-strictness)'
+            },
+            '.snap-y': {
+                '@defaults scroll-snap-type': {
+                },
+                'scroll-snap-type': 'y var(--tw-scroll-snap-strictness)'
+            },
+            '.snap-both': {
+                '@defaults scroll-snap-type': {
+                },
+                'scroll-snap-type': 'both var(--tw-scroll-snap-strictness)'
+            },
+            '.snap-mandatory': {
+                '--tw-scroll-snap-strictness': 'mandatory'
+            },
+            '.snap-proximity': {
+                '--tw-scroll-snap-strictness': 'proximity'
+            }
+        });
+    },
+    scrollSnapAlign: ({ addUtilities  })=>{
+        addUtilities({
+            '.snap-start': {
+                'scroll-snap-align': 'start'
+            },
+            '.snap-end': {
+                'scroll-snap-align': 'end'
+            },
+            '.snap-center': {
+                'scroll-snap-align': 'center'
+            },
+            '.snap-align-none': {
+                'scroll-snap-align': 'none'
+            }
+        });
+    },
+    scrollSnapStop: ({ addUtilities  })=>{
+        addUtilities({
+            '.snap-normal': {
+                'scroll-snap-stop': 'normal'
+            },
+            '.snap-always': {
+                'scroll-snap-stop': 'always'
+            }
+        });
+    },
+    scrollMargin: (0, _createUtilityPlugin).default('scrollMargin', [
+        [
+            'scroll-m',
+            [
+                'scroll-margin'
+            ]
+        ],
+        [
+            [
+                'scroll-mx',
+                [
+                    'scroll-margin-left',
+                    'scroll-margin-right'
+                ]
+            ],
+            [
+                'scroll-my',
+                [
+                    'scroll-margin-top',
+                    'scroll-margin-bottom'
+                ]
+            ], 
+        ],
+        [
+            [
+                'scroll-mt',
+                [
+                    'scroll-margin-top'
+                ]
+            ],
+            [
+                'scroll-mr',
+                [
+                    'scroll-margin-right'
+                ]
+            ],
+            [
+                'scroll-mb',
+                [
+                    'scroll-margin-bottom'
+                ]
+            ],
+            [
+                'scroll-ml',
+                [
+                    'scroll-margin-left'
+                ]
+            ], 
+        ], 
+    ]),
+    scrollPadding: (0, _createUtilityPlugin).default('scrollPadding', [
+        [
+            'scroll-p',
+            [
+                'scroll-padding'
+            ]
+        ],
+        [
+            [
+                'scroll-px',
+                [
+                    'scroll-padding-left',
+                    'scroll-padding-right'
+                ]
+            ],
+            [
+                'scroll-py',
+                [
+                    'scroll-padding-top',
+                    'scroll-padding-bottom'
+                ]
+            ], 
+        ],
+        [
+            [
+                'scroll-pt',
+                [
+                    'scroll-padding-top'
+                ]
+            ],
+            [
+                'scroll-pr',
+                [
+                    'scroll-padding-right'
+                ]
+            ],
+            [
+                'scroll-pb',
+                [
+                    'scroll-padding-bottom'
+                ]
+            ],
+            [
+                'scroll-pl',
+                [
+                    'scroll-padding-left'
+                ]
+            ], 
+        ], 
+    ]),
     listStylePosition: ({ addUtilities  })=>{
         addUtilities({
             '.list-inside': {
@@ -1883,6 +2042,32 @@ var _default = {
                 'border-width'
             ]
         ],
+        [
+            [
+                'border-x',
+                [
+                    [
+                        '@defaults border-width',
+                        {
+                        }
+                    ],
+                    'border-left-width',
+                    'border-right-width'
+                ]
+            ],
+            [
+                'border-y',
+                [
+                    [
+                        '@defaults border-width',
+                        {
+                        }
+                    ],
+                    'border-top-width',
+                    'border-bottom-width'
+                ]
+            ], 
+        ],
         [
             [
                 'border-t',
@@ -1994,6 +2179,44 @@ var _default = {
                 'color'
             ]
         });
+        matchUtilities({
+            'border-x': (value)=>{
+                if (!corePlugins('borderOpacity')) {
+                    return {
+                        'border-left-color': (0, _toColorValue).default(value),
+                        'border-right-color': (0, _toColorValue).default(value)
+                    };
+                }
+                return (0, _withAlphaVariable).default({
+                    color: value,
+                    property: [
+                        'border-left-color',
+                        'border-right-color'
+                    ],
+                    variable: '--tw-border-opacity'
+                });
+            },
+            'border-y': (value)=>{
+                if (!corePlugins('borderOpacity')) {
+                    return {
+                        'border-top-color': (0, _toColorValue).default(value),
+                        'border-bottom-color': (0, _toColorValue).default(value)
+                    };
+                }
+                return (0, _withAlphaVariable).default({
+                    color: value,
+                    property: [
+                        'border-top-color',
+                        'border-bottom-color'
+                    ],
+                    variable: '--tw-border-opacity'
+                });
+            }
+        }, {
+            values: (({ DEFAULT: _ , ...colors })=>colors
+            )((0, _flattenColorPalette).default(theme('borderColor'))),
+            type: 'color'
+        });
         matchUtilities({
             'border-t': (value)=>{
                 if (!corePlugins('borderOpacity')) {

package/lib/featureFlags.js

@@ -47,7 +47,7 @@ function issueFlagNotices(config) {
     if (experimentalFlagsEnabled(config).length > 0) {
         const changes = experimentalFlagsEnabled(config).map((s)=>_chalk.default.yellow(s)
         ).join(', ');
-        _log.default.warn([
+        _log.default.warn('experimental-flags-enabled', [
             `You have enabled experimental features: ${changes}`,
             'Experimental features are not covered by semver, may introduce breaking changes, and can change at any time.', 
         ]);

package/lib/lib/generateRules.js

@@ -9,6 +9,7 @@ var _parseObjectStyles = _interopRequireDefault(require("../util/parseObjectStyl
 var _isPlainObject = _interopRequireDefault(require("../util/isPlainObject"));
 var _prefixSelector = _interopRequireDefault(require("../util/prefixSelector"));
 var _pluginUtils = require("../util/pluginUtils");
+var _log = _interopRequireDefault(require("../util/log"));
 function _interopRequireDefault(obj) {
     return obj && obj.__esModule ? obj : {
         default: obj
@@ -244,16 +245,18 @@ function* resolveMatches(candidate, context) {
     // }
     for (let matchedPlugins of resolveMatchedPlugins(classCandidate, context)){
         let matches = [];
+        let typesByMatches = new Map();
         let [plugins, modifier] = matchedPlugins;
         let isOnlyPlugin = plugins.length === 1;
         for (let [sort, plugin] of plugins){
+            let matchesPerPlugin = [];
             if (typeof plugin === 'function') {
                 for (let ruleSet of [].concat(plugin(modifier, {
                     isOnlyPlugin
                 }))){
                     let [rules, options] = parseRules(ruleSet, context.postCssNodeCache);
                     for (let rule of rules){
-                        matches.push([
+                        matchesPerPlugin.push([
                             {
                                 ...sort,
                                 options: {
@@ -269,7 +272,7 @@ function* resolveMatches(candidate, context) {
                 let ruleSet = plugin;
                 let [rules, options] = parseRules(ruleSet, context.postCssNodeCache);
                 for (let rule of rules){
-                    matches.push([
+                    matchesPerPlugin.push([
                         {
                             ...sort,
                             options: {
@@ -281,8 +284,58 @@ function* resolveMatches(candidate, context) {
                     ]);
                 }
             }
+            if (matchesPerPlugin.length > 0) {
+                var ref;
+                typesByMatches.set(matchesPerPlugin, (ref = sort.options) === null || ref === void 0 ? void 0 : ref.type);
+                matches.push(matchesPerPlugin);
+            }
         }
-        matches = applyPrefix(matches, context);
+        // Only keep the result of the very first plugin if we are dealing with
+        // arbitrary values, to protect against ambiguity.
+        if (isArbitraryValue(modifier) && matches.length > 1) {
+            var ref;
+            let typesPerPlugin = matches.map((match)=>new Set([
+                    ...(ref = typesByMatches.get(match)) !== null && ref !== void 0 ? ref : []
+                ])
+            );
+            // Remove duplicates, so that we can detect proper unique types for each plugin.
+            for (let pluginTypes of typesPerPlugin){
+                for (let type of pluginTypes){
+                    let removeFromOwnGroup = false;
+                    for (let otherGroup of typesPerPlugin){
+                        if (pluginTypes === otherGroup) continue;
+                        if (otherGroup.has(type)) {
+                            otherGroup.delete(type);
+                            removeFromOwnGroup = true;
+                        }
+                    }
+                    if (removeFromOwnGroup) pluginTypes.delete(type);
+                }
+            }
+            let messages = [];
+            for (let [idx, group] of typesPerPlugin.entries()){
+                for (let type of group){
+                    let rules = matches[idx].map(([, rule])=>rule
+                    ).flat().map((rule)=>rule.toString().split('\n').slice(1, -1) // Remove selector and closing '}'
+                        .map((line)=>line.trim()
+                        ).map((x)=>`      ${x}`
+                        ) // Re-indent
+                        .join('\n')
+                    ).join('\n\n');
+                    messages.push(`  - Replace "${candidate}" with "${candidate.replace('[', `[${type}:`)}" for:\n${rules}\n`);
+                    break;
+                }
+            }
+            _log.default.warn([
+                // TODO: Update URL
+                `The class "${candidate}" is ambiguous and matches multiple utilities. Use a type hint (https://tailwindcss.com/docs/just-in-time-mode#ambiguous-values) to fix this.`,
+                '',
+                ...messages,
+                `If this is just part of your content and not a class, replace it with "${candidate.replace('[', '[').replace(']', ']')}" to silence this warning.`, 
+            ]);
+            continue;
+        }
+        matches = applyPrefix(matches.flat(), context);
         if (important) {
             matches = applyImportant(matches, context);
         }
@@ -346,5 +399,8 @@ function generateRules(candidates, context) {
         ];
     });
 }
+function isArbitraryValue(input) {
+    return input.startsWith('[') && input.endsWith(']');
+}
 exports.resolveMatches = resolveMatches;
 exports.generateRules = generateRules;

package/lib/lib/normalizeTailwindDirectives.js

@@ -43,7 +43,7 @@ function normalizeTailwindDirectives(root) {
                 'responsive',
                 'variants'
             ].includes(atRule.name)) {
-                _log.default.warn([
+                _log.default.warn(`${atRule.name}-at-rule-deprecated`, [
                     `'@${atRule.name}' is deprecated, use '@layer utilities' or '@layer components' instead.`, 
                 ]);
             }

package/lib/lib/setupContextUtils.js

@@ -593,8 +593,6 @@ function registerPlugins(plugins, context) {
             ]
         ));
     }
-    //
-    let warnedAbout = new Set([]);
     context.safelist = function() {
         var _safelist;
         let safelist = ((_safelist = context.tailwindConfig.safelist) !== null && _safelist !== void 0 ? _safelist : []).filter(Boolean);
@@ -607,14 +605,11 @@ function registerPlugins(plugins, context) {
                 continue;
             }
             if (value instanceof RegExp) {
-                if (!warnedAbout.has('root-regex')) {
-                    _log.default.warn([
-                        // TODO: Improve this warning message
-                        'RegExp in the safelist option is not supported.',
-                        'Please use the object syntax instead: https://tailwindcss.com/docs/...', 
-                    ]);
-                    warnedAbout.add('root-regex');
-                }
+                _log.default.warn('root-regex', [
+                    // TODO: Improve this warning message
+                    'RegExp in the safelist option is not supported.',
+                    'Please use the object syntax instead: https://tailwindcss.com/docs/...', 
+                ]);
                 continue;
             }
             checks.push(value);

package/lib/lib/setupTrackingContext.js

@@ -29,7 +29,7 @@ function getCandidateFiles(context, tailwindConfig) {
         return candidateFilesCache.get(context);
     }
     let candidateFiles = tailwindConfig.content.content.filter((item)=>typeof item === 'string'
-    ).map((contentPath)=>(0, _normalizePath).default(_path.default.resolve(contentPath))
+    ).map((contentPath)=>(0, _normalizePath).default(contentPath)
     );
     return candidateFilesCache.set(context, candidateFiles).get(context);
 }
@@ -149,7 +149,10 @@ function setupTrackingContext(configOrPath) {
                 let fileModifiedMap = (0, _setupContextUtils).getFileModifiedMap(context);
                 // Add template paths as postcss dependencies.
                 for (let fileOrGlob of candidateFiles){
-                    registerDependency((0, _parseDependency).default(fileOrGlob));
+                    let dependency = (0, _parseDependency).default(fileOrGlob);
+                    if (dependency) {
+                        registerDependency(dependency);
+                    }
                 }
                 for (let changedContent of resolvedChangedContent(context, candidateFiles, fileModifiedMap)){
                     context.changedContent.push(changedContent);

package/lib/lib/setupWatchingContext.js

@@ -137,7 +137,7 @@ function getCandidateFiles(context, tailwindConfig) {
         return candidateFilesCache.get(context);
     }
     let candidateFiles = tailwindConfig.content.content.filter((item)=>typeof item === 'string'
-    ).map((contentPath)=>(0, _normalizePath).default(_path.default.resolve(contentPath))
+    ).map((contentPath)=>(0, _normalizePath).default(contentPath)
     );
     return candidateFilesCache.set(context, candidateFiles).get(context);
 }

package/lib/public/colors.js

@@ -9,15 +9,11 @@ function _interopRequireDefault(obj) {
         default: obj
     };
 }
-let warned = [];
 function warn({ version , from , to  }) {
-    if (!warned.includes(from)) {
-        _log.default.warn([
-            `As of Tailwind CSS ${version}, \`${from}\` has been renamed to \`${to}\`.`,
-            'Please update your color palette to eliminate this warning.', 
-        ]);
-        warned.push(from);
-    }
+    _log.default.warn(`${from}-color-rename`, [
+        `As of Tailwind CSS ${version}, \`${from}\` has been renamed to \`${to}\`.`,
+        'Please update your color palette to eliminate this warning.', 
+    ]);
 }
 var _default = {
     inherit: 'inherit',

package/lib/util/log.js

@@ -9,27 +9,39 @@ function _interopRequireDefault(obj) {
         default: obj
     };
 }
+let alreadyShown = new Set();
+function log(chalk, messages, key) {
+    if (process.env.JEST_WORKER_ID !== undefined) return;
+    if (key && alreadyShown.has(key)) return;
+    if (key) alreadyShown.add(key);
+    console.warn('');
+    messages.forEach((message)=>console.warn(chalk, '-', message)
+    );
+}
 var _default = {
-    info (messages) {
-        if (process.env.JEST_WORKER_ID !== undefined) return;
-        console.warn('');
-        messages.forEach((message)=>{
-            console.warn(_chalk.default.bold.cyan('info'), '-', message);
-        });
+    info (key, messages) {
+        log(_chalk.default.bold.cyan('info'), ...Array.isArray(key) ? [
+            key
+        ] : [
+            messages,
+            key
+        ]);
     },
-    warn (messages) {
-        if (process.env.JEST_WORKER_ID !== undefined) return;
-        console.warn('');
-        messages.forEach((message)=>{
-            console.warn(_chalk.default.bold.yellow('warn'), '-', message);
-        });
+    warn (key, messages) {
+        log(_chalk.default.bold.yellow('warn'), ...Array.isArray(key) ? [
+            key
+        ] : [
+            messages,
+            key
+        ]);
     },
-    risk (messages) {
-        if (process.env.JEST_WORKER_ID !== undefined) return;
-        console.warn('');
-        messages.forEach((message)=>{
-            console.warn(_chalk.default.bold.magenta('risk'), '-', message);
-        });
+    risk (key, messages) {
+        log(_chalk.default.bold.magenta('risk'), ...Array.isArray(key) ? [
+            key
+        ] : [
+            messages,
+            key
+        ]);
     }
 };
 exports.default = _default;

package/lib/util/parseDependency.js

@@ -34,6 +34,9 @@ function parseGlob(pattern) {
     };
 }
 function parseDependency(normalizedFileOrGlob) {
+    if (normalizedFileOrGlob.startsWith('!')) {
+        return null;
+    }
     let message;
     if ((0, _isGlob).default(normalizedFileOrGlob)) {
         let { base , glob  } = parseGlob(normalizedFileOrGlob);

package/lib/util/resolveConfig.js

@@ -44,11 +44,10 @@ const configUtils = {
     colors: _colors.default,
     negative (scale) {
         return Object.keys(scale).filter((key)=>scale[key] !== '0'
-        ).reduce((negativeScale, key)=>({
-                ...negativeScale,
-                [`-${key}`]: (0, _negateValue).default(scale[key])
-            })
-        , {
+        ).reduce((negativeScale, key)=>{
+            negativeScale[`-${key}`] = (0, _negateValue).default(scale[key]);
+            return negativeScale;
+        }, {
         });
     },
     breakpoints (screens) {
@@ -229,16 +228,12 @@ function resolveConfig(configs) {
         }))
     }, ...allConfigs));
 }
-let warnedAbout = new Set();
 function normalizeConfig(config) {
     var ref, ref1, ref2, ref3, ref4, ref5;
-    if (!warnedAbout.has('purge-deprecation') && config.hasOwnProperty('purge')) {
-        _log.default.warn([
-            'The `purge` option in your tailwind.config.js file has been deprecated.',
-            'Please rename this to `content` instead.', 
-        ]);
-        warnedAbout.add('purge-deprecation');
-    }
+    _log.default.warn('purge-deprecation', [
+        'The `purge` option in your tailwind.config.js file has been deprecated.',
+        'Please rename this to `content` instead.', 
+    ]);
     config.content = {
         content: (()=>{
             let { content , purge  } = config;