tailwindcss 0.0.0-insiders.bbf3a37 → 0.0.0-insiders.bc46d0e

package/CHANGELOG.md

@@ -16,15 +16,21 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Use local user CSS cache for `@apply` ([#7524](https://github.com/tailwindlabs/tailwindcss/pull/7524))
 - Invalidate context when main CSS changes ([#7626](https://github.com/tailwindlabs/tailwindcss/pull/7626))
 - Only add `!` to selector class matching template candidate when using important modifier with mutli-class selectors ([#7664](https://github.com/tailwindlabs/tailwindcss/pull/7664))
+- Correctly parse and prefix animation names with dots ([#7163](https://github.com/tailwindlabs/tailwindcss/pull/7163))
+- Fix extraction from template literal/function with array ([#7481](https://github.com/tailwindlabs/tailwindcss/pull/7481))
 
 ### Changed
 
 - Replace `chalk` with `picocolors` ([#6039](https://github.com/tailwindlabs/tailwindcss/pull/6039))
+- Replace `cosmiconfig` with `lilconfig` ([#6039](https://github.com/tailwindlabs/tailwindcss/pull/6038))
 
 ### Added
 
 - Allow default ring color to be a function ([#7587](https://github.com/tailwindlabs/tailwindcss/pull/7587))
 - Add `rgb` and `hsl` color helpers for CSS variables ([#7665](https://github.com/tailwindlabs/tailwindcss/pull/7665))
+- Support PostCSS `Document` nodes ([#7291](https://github.com/tailwindlabs/tailwindcss/pull/7291))
+- Add `text-start` and `text-end` utilities ([#6656](https://github.com/tailwindlabs/tailwindcss/pull/6656))
+- Support customizing class name when using `darkMode: 'class'` ([#5800](https://github.com/tailwindlabs/tailwindcss/pull/5800))
 
 ## [3.0.23] - 2022-02-16
 

package/lib/cli.js

@@ -6,7 +6,7 @@ var _path = _interopRequireDefault(require("path"));
 var _arg = _interopRequireDefault(require("arg"));
 var _fs = _interopRequireDefault(require("fs"));
 var _postcssLoadConfig = _interopRequireDefault(require("postcss-load-config"));
-var _cosmiconfig = require("cosmiconfig");
+var _lilconfig = require("lilconfig");
 var _plugins // Little bit scary, looking at private/internal API
  = _interopRequireDefault(require("postcss-load-config/src/plugins"));
 var _processTailwindFeatures = _interopRequireDefault(require("./processTailwindFeatures"));
@@ -368,8 +368,8 @@ async function build() {
         let customPostCssPath = typeof args['--postcss'] === 'string' ? args['--postcss'] : undefined;
         let { plugins: configPlugins  } = customPostCssPath ? await (async ()=>{
             let file = _path.default.resolve(customPostCssPath);
-            // Implementation, see: https://unpkg.com/browse/postcss-load-config@3.0.1/src/index.js
-            let { config ={}  } = await (0, _cosmiconfig).cosmiconfig('postcss').load(file);
+            // Implementation, see: https://unpkg.com/browse/postcss-load-config@3.1.0/src/index.js
+            let { config ={}  } = await (0, _lilconfig).lilconfig('postcss').load(file);
             if (typeof config === 'function') {
                 config = config();
             } else {

package/lib/corePlugins.js

@@ -8,6 +8,7 @@ var path = _interopRequireWildcard(require("path"));
 var _postcss = _interopRequireDefault(require("postcss"));
 var _createUtilityPlugin = _interopRequireDefault(require("./util/createUtilityPlugin"));
 var _buildMediaQuery = _interopRequireDefault(require("./util/buildMediaQuery"));
+var _escapeClassName = _interopRequireDefault(require("./util/escapeClassName"));
 var _parseAnimationValue = _interopRequireDefault(require("./util/parseAnimationValue"));
 var _flattenColorPalette = _interopRequireDefault(require("./util/flattenColorPalette"));
 var _withAlphaVariable = _interopRequireWildcard(require("./util/withAlphaVariable"));
@@ -209,7 +210,7 @@ let variantPlugins = {
         addVariant('motion-reduce', '@media (prefers-reduced-motion: reduce)');
     },
     darkVariants: ({ config , addVariant  })=>{
-        let mode = config('darkMode', 'media');
+        let [mode, className = '.dark'] = [].concat(config('darkMode', 'media'));
         if (mode === false) {
             mode = 'media';
             _log.default.warn('darkmode-false', [
@@ -219,7 +220,7 @@ let variantPlugins = {
             ]);
         }
         if (mode === 'class') {
-            addVariant('dark', '.dark &');
+            addVariant('dark', `${className} &`);
         } else if (mode === 'media') {
             addVariant('dark', '@media (prefers-color-scheme: dark)');
         }
@@ -989,8 +990,8 @@ let corePlugins = {
             }
         });
     },
-    animation: ({ matchUtilities , theme , prefix  })=>{
-        let prefixName = (name)=>prefix(`.${name}`).slice(1)
+    animation: ({ matchUtilities , theme , config  })=>{
+        let prefixName = (name)=>`${config('prefix')}${(0, _escapeClassName).default(name)}`
         ;
         var ref;
         let keyframes = Object.fromEntries(Object.entries((ref = theme('keyframes')) !== null && ref !== void 0 ? ref : {}).map(([key, value])=>{
@@ -2531,6 +2532,12 @@ let corePlugins = {
             },
             '.text-justify': {
                 'text-align': 'justify'
+            },
+            '.text-start': {
+                'text-align': 'start'
+            },
+            '.text-end': {
+                'text-align': 'end'
             }
         });
     },

package/lib/index.js

@@ -17,7 +17,18 @@ module.exports = function tailwindcss(configOrPath) {
                 return root;
             },
             function(root, result) {
-                (0, _processTailwindFeatures).default((0, _setupTrackingContext).default(configOrPath))(root, result);
+                let context = (0, _setupTrackingContext).default(configOrPath);
+                if (root.type === 'document') {
+                    let roots = root.nodes.filter((node)=>node.type === 'root'
+                    );
+                    for (const root1 of roots){
+                        if (root1.type === 'root') {
+                            (0, _processTailwindFeatures).default(context)(root1, result);
+                        }
+                    }
+                    return;
+                }
+                (0, _processTailwindFeatures).default(context)(root, result);
             },
             _sharedState.env.DEBUG && function(root) {
                 console.timeEnd('JIT TOTAL');

package/lib/lib/defaultExtractor.js

@@ -7,16 +7,16 @@ const PATTERNS = [
     /(?:\['([^'\s]+[^<>"'`\s:\\])')/.source,
     /(?:\["([^"\s]+[^<>"'`\s:\\])")/.source,
     /(?:\[`([^`\s]+[^<>"'`\s:\\])`)/.source,
-    /([^<>"'`\s]*\[\w*'[^"`\s]*'?\])/.source,
-    /([^<>"'`\s]*\[\w*"[^'`\s]*"?\])/.source,
+    /([^${(<>"'`\s]*\[\w*'[^"`\s]*'?\])/.source,
+    /([^${(<>"'`\s]*\[\w*"[^'`\s]*"?\])/.source,
     /([^<>"'`\s]*\[\w*\('[^"'`\s]*'\)\])/.source,
     /([^<>"'`\s]*\[\w*\("[^"'`\s]*"\)\])/.source,
     /([^<>"'`\s]*\[\w*\('[^"`\s]*'\)\])/.source,
     /([^<>"'`\s]*\[\w*\("[^'`\s]*"\)\])/.source,
     /([^<>"'`\s]*\[[^<>"'`\s]*\('[^"`\s]*'\)+\])/.source,
     /([^<>"'`\s]*\[[^<>"'`\s]*\("[^'`\s]*"\)+\])/.source,
-    /([^<>"'`\s]*\['[^"'`\s]*'\])/.source,
-    /([^<>"'`\s]*\["[^"'`\s]*"\])/.source,
+    /([^${(<>"'`\s]*\['[^"'`\s]*'\])/.source,
+    /([^${(<>"'`\s]*\["[^"'`\s]*"\])/.source,
     /([^<>"'`\s]*\[[^<>"'`\s]*:[^\]\s]*\])/.source,
     /([^<>"'`\s]*\[[^<>"'`\s]*:'[^"'`\s]*'\])/.source,
     /([^<>"'`\s]*\[[^<>"'`\s]*:"[^"'`\s]*"\])/.source,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tailwindcss",
-  "version": "0.0.0-insiders.bbf3a37",
+  "version": "0.0.0-insiders.bc46d0e",
   "description": "A utility-first CSS framework for rapidly building custom user interfaces.",
   "license": "MIT",
   "main": "lib/index.js",
@@ -45,8 +45,8 @@
     "autoprefixer": "^10.4.2",
     "cssnano": "^5.0.17",
     "esbuild": "^0.14.21",
-    "eslint": "^8.8.0",
-    "eslint-config-prettier": "^8.3.0",
+    "eslint": "^8.9.0",
+    "eslint-config-prettier": "^8.4.0",
     "eslint-plugin-prettier": "^4.0.0",
     "jest": "^27.5.1",
     "jest-diff": "^27.5.1",
@@ -63,13 +63,13 @@
     "arg": "^5.0.1",
     "chokidar": "^3.5.3",
     "color-name": "^1.1.4",
-    "cosmiconfig": "^7.0.1",
     "detective": "^5.2.0",
     "didyoumean": "^1.2.2",
     "dlv": "^1.1.3",
     "fast-glob": "^3.2.11",
     "glob-parent": "^6.0.2",
     "is-glob": "^4.0.3",
+    "lilconfig": "^2.0.4",
     "normalize-path": "^3.0.0",
     "object-hash": "^3.0.0",
     "picocolors": "^1.0.0",

package/src/cli.js

@@ -7,7 +7,7 @@ import path from 'path'
 import arg from 'arg'
 import fs from 'fs'
 import postcssrc from 'postcss-load-config'
-import { cosmiconfig } from 'cosmiconfig'
+import { lilconfig } from 'lilconfig'
 import loadPlugins from 'postcss-load-config/src/plugins' // Little bit scary, looking at private/internal API
 import tailwind from './processTailwindFeatures'
 import resolveConfigInternal from '../resolveConfig'
@@ -397,8 +397,8 @@ async function build() {
       ? await (async () => {
           let file = path.resolve(customPostCssPath)
 
-          // Implementation, see: https://unpkg.com/browse/postcss-load-config@3.0.1/src/index.js
-          let { config = {} } = await cosmiconfig('postcss').load(file)
+          // Implementation, see: https://unpkg.com/browse/postcss-load-config@3.1.0/src/index.js
+          let { config = {} } = await lilconfig('postcss').load(file)
           if (typeof config === 'function') {
             config = config()
           } else {

package/src/corePlugins.js

@@ -3,6 +3,7 @@ import * as path from 'path'
 import postcss from 'postcss'
 import createUtilityPlugin from './util/createUtilityPlugin'
 import buildMediaQuery from './util/buildMediaQuery'
+import escapeClassName from './util/escapeClassName'
 import parseAnimationValue from './util/parseAnimationValue'
 import flattenColorPalette from './util/flattenColorPalette'
 import withAlphaVariable, { withAlphaValue } from './util/withAlphaVariable'
@@ -171,7 +172,8 @@ export let variantPlugins = {
   },
 
   darkVariants: ({ config, addVariant }) => {
-    let mode = config('darkMode', 'media')
+    let [mode, className = '.dark'] = [].concat(config('darkMode', 'media'))
+
     if (mode === false) {
       mode = 'media'
       log.warn('darkmode-false', [
@@ -182,7 +184,7 @@ export let variantPlugins = {
     }
 
     if (mode === 'class') {
-      addVariant('dark', '.dark &')
+      addVariant('dark', `${className} &`)
     } else if (mode === 'media') {
       addVariant('dark', '@media (prefers-color-scheme: dark)')
     }
@@ -611,8 +613,8 @@ export let corePlugins = {
     })
   },
 
-  animation: ({ matchUtilities, theme, prefix }) => {
-    let prefixName = (name) => prefix(`.${name}`).slice(1)
+  animation: ({ matchUtilities, theme, config }) => {
+    let prefixName = (name) => `${config('prefix')}${escapeClassName(name)}`
     let keyframes = Object.fromEntries(
       Object.entries(theme('keyframes') ?? {}).map(([key, value]) => {
         return [key, { [`@keyframes ${prefixName(key)}`]: value }]
@@ -1522,6 +1524,8 @@ export let corePlugins = {
       '.text-center': { 'text-align': 'center' },
       '.text-right': { 'text-align': 'right' },
       '.text-justify': { 'text-align': 'justify' },
+      '.text-start': { 'text-align': 'start' },
+      '.text-end': { 'text-align': 'end' },
     })
   },
 

package/src/index.js

@@ -13,7 +13,21 @@ module.exports = function tailwindcss(configOrPath) {
           return root
         },
       function (root, result) {
-        processTailwindFeatures(setupTrackingContext(configOrPath))(root, result)
+        let context = setupTrackingContext(configOrPath)
+
+        if (root.type === 'document') {
+          let roots = root.nodes.filter((node) => node.type === 'root')
+
+          for (const root of roots) {
+            if (root.type === 'root') {
+              processTailwindFeatures(context)(root, result)
+            }
+          }
+
+          return
+        }
+
+        processTailwindFeatures(context)(root, result)
       },
       env.DEBUG &&
         function (root) {

package/src/lib/defaultExtractor.js

@@ -2,16 +2,16 @@ const PATTERNS = [
   /(?:\['([^'\s]+[^<>"'`\s:\\])')/.source, // ['text-lg' -> text-lg
   /(?:\["([^"\s]+[^<>"'`\s:\\])")/.source, // ["text-lg" -> text-lg
   /(?:\[`([^`\s]+[^<>"'`\s:\\])`)/.source, // [`text-lg` -> text-lg
-  /([^<>"'`\s]*\[\w*'[^"`\s]*'?\])/.source, // font-['some_font',sans-serif]
-  /([^<>"'`\s]*\[\w*"[^'`\s]*"?\])/.source, // font-["some_font",sans-serif]
+  /([^${(<>"'`\s]*\[\w*'[^"`\s]*'?\])/.source, // font-['some_font',sans-serif]
+  /([^${(<>"'`\s]*\[\w*"[^'`\s]*"?\])/.source, // font-["some_font",sans-serif]
   /([^<>"'`\s]*\[\w*\('[^"'`\s]*'\)\])/.source, // bg-[url('...')]
   /([^<>"'`\s]*\[\w*\("[^"'`\s]*"\)\])/.source, // bg-[url("...")]
   /([^<>"'`\s]*\[\w*\('[^"`\s]*'\)\])/.source, // bg-[url('...'),url('...')]
   /([^<>"'`\s]*\[\w*\("[^'`\s]*"\)\])/.source, // bg-[url("..."),url("...")]
   /([^<>"'`\s]*\[[^<>"'`\s]*\('[^"`\s]*'\)+\])/.source, // h-[calc(100%-theme('spacing.1'))]
   /([^<>"'`\s]*\[[^<>"'`\s]*\("[^'`\s]*"\)+\])/.source, // h-[calc(100%-theme("spacing.1"))]
-  /([^<>"'`\s]*\['[^"'`\s]*'\])/.source, // `content-['hello']` but not `content-['hello']']`
-  /([^<>"'`\s]*\["[^"'`\s]*"\])/.source, // `content-["hello"]` but not `content-["hello"]"]`
+  /([^${(<>"'`\s]*\['[^"'`\s]*'\])/.source, // `content-['hello']` but not `content-['hello']']`
+  /([^${(<>"'`\s]*\["[^"'`\s]*"\])/.source, // `content-["hello"]` but not `content-["hello"]"]`
   /([^<>"'`\s]*\[[^<>"'`\s]*:[^\]\s]*\])/.source, // `[attr:value]`
   /([^<>"'`\s]*\[[^<>"'`\s]*:'[^"'`\s]*'\])/.source, // `[content:'hello']` but not `[content:"hello"]`
   /([^<>"'`\s]*\[[^<>"'`\s]*:"[^"'`\s]*"\])/.source, // `[content:"hello"]` but not `[content:'hello']`