tailwindcss 3.1.4 → 3.1.7

package/lib/util/splitAtTopLevelOnly.js

@@ -2,18 +2,21 @@
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
-exports.splitAtTopLevelOnly = splitAtTopLevelOnly;
-var regex = _interopRequireWildcard(require("../lib/regex"));
-function _getRequireWildcardCache() {
+Object.defineProperty(exports, "splitAtTopLevelOnly", {
+    enumerable: true,
+    get: ()=>splitAtTopLevelOnly
+});
+const _regex = /*#__PURE__*/ _interopRequireWildcard(require("../lib/regex"));
+function _getRequireWildcardCache(nodeInterop) {
     if (typeof WeakMap !== "function") return null;
-    var cache = new WeakMap();
-    _getRequireWildcardCache = function() {
-        return cache;
-    };
-    return cache;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
 }
-function _interopRequireWildcard(obj) {
-    if (obj && obj.__esModule) {
+function _interopRequireWildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
         return obj;
     }
     if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
@@ -21,14 +24,14 @@ function _interopRequireWildcard(obj) {
             default: obj
         };
     }
-    var cache = _getRequireWildcardCache();
+    var cache = _getRequireWildcardCache(nodeInterop);
     if (cache && cache.has(obj)) {
         return cache.get(obj);
     }
     var newObj = {};
     var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
     for(var key in obj){
-        if (Object.prototype.hasOwnProperty.call(obj, key)) {
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
             var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
             if (desc && (desc.get || desc.set)) {
                 Object.defineProperty(newObj, key, desc);
@@ -44,7 +47,7 @@ function _interopRequireWildcard(obj) {
     return newObj;
 }
 function* splitAtTopLevelOnly(input, separator) {
-    let SPECIALS = new RegExp(`[(){}\\[\\]${regex.escape(separator)}]`, "g");
+    let SPECIALS = new RegExp(`[(){}\\[\\]${_regex.escape(separator)}]`, "g");
     let depth = 0;
     let lastIndex = 0;
     let found = false;

package/lib/util/tap.js

@@ -2,7 +2,10 @@
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
-exports.tap = tap;
+Object.defineProperty(exports, "tap", {
+    enumerable: true,
+    get: ()=>tap
+});
 function tap(value, mutator) {
     mutator(value);
     return value;

package/lib/util/toColorValue.js

@@ -2,7 +2,10 @@
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
-exports.default = toColorValue;
+Object.defineProperty(exports, "default", {
+    enumerable: true,
+    get: ()=>toColorValue
+});
 function toColorValue(maybeFunction) {
     return typeof maybeFunction === "function" ? maybeFunction({}) : maybeFunction;
 }

package/lib/util/toPath.js

@@ -1,8 +1,24 @@
-"use strict";
+/**
+ * Parse a path string into an array of path segments.
+ *
+ * Square bracket notation `a[b]` may be used to "escape" dots that would otherwise be interpreted as path separators.
+ *
+ * Example:
+ * a -> ['a']
+ * a.b.c -> ['a', 'b', 'c']
+ * a[b].c -> ['a', 'b', 'c']
+ * a[b.c].e.f -> ['a', 'b.c', 'e', 'f']
+ * a[b][c][d] -> ['a', 'b', 'c', 'd']
+ *
+ * @param {string|string[]} path
+ **/ "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
-exports.toPath = toPath;
+Object.defineProperty(exports, "toPath", {
+    enumerable: true,
+    get: ()=>toPath
+});
 function toPath(path) {
     if (Array.isArray(path)) return path;
     let openBrackets = path.split("[").length - 1;

package/lib/util/transformThemeValue.js

@@ -2,8 +2,16 @@
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
-exports.default = transformThemeValue;
-var _postcss = _interopRequireDefault(require("postcss"));
+Object.defineProperty(exports, "default", {
+    enumerable: true,
+    get: ()=>transformThemeValue
+});
+const _postcss = /*#__PURE__*/ _interopRequireDefault(require("postcss"));
+function _interopRequireDefault(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
 function transformThemeValue(themeSection) {
     if ([
         "fontSize",
@@ -54,8 +62,3 @@ function transformThemeValue(themeSection) {
         return value;
     };
 }
-function _interopRequireDefault(obj) {
-    return obj && obj.__esModule ? obj : {
-        default: obj
-    };
-}

package/lib/util/validateConfig.js

@@ -2,8 +2,11 @@
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
-exports.validateConfig = validateConfig;
-var _log = _interopRequireDefault(require("./log"));
+Object.defineProperty(exports, "validateConfig", {
+    enumerable: true,
+    get: ()=>validateConfig
+});
+const _log = /*#__PURE__*/ _interopRequireDefault(require("./log"));
 function _interopRequireDefault(obj) {
     return obj && obj.__esModule ? obj : {
         default: obj

package/lib/util/withAlphaVariable.js

@@ -2,9 +2,34 @@
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
-exports.default = withAlphaVariable;
-exports.withAlphaValue = withAlphaValue;
-var _color = require("./color");
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    withAlphaValue: ()=>withAlphaValue,
+    default: ()=>withAlphaVariable
+});
+const _color = require("./color");
+function withAlphaValue(color, alphaValue, defaultValue) {
+    if (typeof color === "function") {
+        return color({
+            opacityValue: alphaValue
+        });
+    }
+    let parsed = (0, _color.parseColor)(color, {
+        loose: true
+    });
+    if (parsed === null) {
+        return defaultValue;
+    }
+    return (0, _color.formatColor)({
+        ...parsed,
+        alpha: alphaValue
+    });
+}
 function withAlphaVariable({ color , property , variable  }) {
     let properties = [].concat(property);
     if (typeof color === "function") {
@@ -21,7 +46,7 @@ function withAlphaVariable({ color , property , variable  }) {
             }))
         };
     }
-    const parsed = (0, _color).parseColor(color);
+    const parsed = (0, _color.parseColor)(color);
     if (parsed === null) {
         return Object.fromEntries(properties.map((p)=>[
                 p,
@@ -40,7 +65,7 @@ function withAlphaVariable({ color , property , variable  }) {
         ...Object.fromEntries(properties.map((p)=>{
             return [
                 p,
-                (0, _color).formatColor({
+                (0, _color.formatColor)({
                     ...parsed,
                     alpha: `var(${variable})`
                 })
@@ -48,20 +73,3 @@ function withAlphaVariable({ color , property , variable  }) {
         }))
     };
 }
-function withAlphaValue(color, alphaValue, defaultValue) {
-    if (typeof color === "function") {
-        return color({
-            opacityValue: alphaValue
-        });
-    }
-    let parsed = (0, _color).parseColor(color, {
-        loose: true
-    });
-    if (parsed === null) {
-        return defaultValue;
-    }
-    return (0, _color).formatColor({
-        ...parsed,
-        alpha: alphaValue
-    });
-}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tailwindcss",
-  "version": "3.1.4",
+  "version": "3.1.7",
   "description": "A utility-first CSS framework for rapidly building custom user interfaces.",
   "license": "MIT",
   "main": "lib/index.js",
@@ -43,19 +43,19 @@
   ],
   "devDependencies": {
     "@swc/cli": "^0.1.57",
-    "@swc/core": "^1.2.196",
-    "@swc/jest": "^0.2.21",
+    "@swc/core": "^1.2.218",
+    "@swc/jest": "^0.2.22",
     "@swc/register": "^0.1.10",
     "autoprefixer": "^10.4.7",
-    "cssnano": "^5.1.11",
-    "esbuild": "^0.14.43",
-    "eslint": "^8.16.0",
+    "cssnano": "^5.1.12",
+    "esbuild": "^0.14.48",
+    "eslint": "^8.19.0",
     "eslint-config-prettier": "^8.5.0",
-    "eslint-plugin-prettier": "^4.0.0",
-    "jest": "^28.1.1",
-    "jest-diff": "^28.1.1",
+    "eslint-plugin-prettier": "^4.2.1",
+    "jest": "^28.1.3",
+    "jest-diff": "^28.1.3",
     "prettier": "^2.7.1",
-    "prettier-plugin-tailwindcss": "^0.1.11",
+    "prettier-plugin-tailwindcss": "^0.1.12",
     "rimraf": "^3.0.0",
     "source-map-js": "^1.0.2"
   },
@@ -72,7 +72,7 @@
     "fast-glob": "^3.2.11",
     "glob-parent": "^6.0.2",
     "is-glob": "^4.0.3",
-    "lilconfig": "^2.0.5",
+    "lilconfig": "^2.0.6",
     "normalize-path": "^3.0.0",
     "object-hash": "^3.0.0",
     "picocolors": "^1.0.0",
@@ -84,7 +84,7 @@
     "postcss-selector-parser": "^6.0.10",
     "postcss-value-parser": "^4.2.0",
     "quick-lru": "^5.1.1",
-    "resolve": "^1.22.0"
+    "resolve": "^1.22.1"
   },
   "browserslist": [
     "> 1%",

package/peers/index.js

@@ -5978,6 +5978,7 @@ var require_core = __commonJS({
       "node:string_decoder": [">= 14.18 && < 15", ">= 16"],
       sys: [">= 0.4 && < 0.7", ">= 0.8"],
       "node:sys": [">= 14.18 && < 15", ">= 16"],
+      "node:test": ">= 18",
       timers: true,
       "node:timers": [">= 14.18 && < 15", ">= 16"],
       "timers/promises": ">= 15",
@@ -6092,7 +6093,7 @@ var require_async = __commonJS({
     var nodeModulesPaths = require_node_modules_paths();
     var normalizeOptions = require_normalize_options();
     var isCore = require_is_core_module();
-    var realpathFS = fs.realpath && typeof fs.realpath.native === "function" ? fs.realpath.native : fs.realpath;
+    var realpathFS = process.platform !== "win32" && fs.realpath && typeof fs.realpath.native === "function" ? fs.realpath.native : fs.realpath;
     var homedir = getHomedir();
     var defaultPaths = function() {
       return [
@@ -6525,6 +6526,7 @@ var require_core2 = __commonJS({
       "node:string_decoder": [">= 14.18 && < 15", ">= 16"],
       sys: [">= 0.4 && < 0.7", ">= 0.8"],
       "node:sys": [">= 14.18 && < 15", ">= 16"],
+      "node:test": ">= 18",
       timers: true,
       "node:timers": [">= 14.18 && < 15", ">= 16"],
       "timers/promises": ">= 15",
@@ -6647,7 +6649,7 @@ var require_sync = __commonJS({
     var caller = require_caller();
     var nodeModulesPaths = require_node_modules_paths();
     var normalizeOptions = require_normalize_options();
-    var realpathFS = fs.realpathSync && typeof fs.realpathSync.native === "function" ? fs.realpathSync.native : fs.realpathSync;
+    var realpathFS = process.platform !== "win32" && fs.realpathSync && typeof fs.realpathSync.native === "function" ? fs.realpathSync.native : fs.realpathSync;
     var homedir = getHomedir();
     var defaultPaths = function() {
       return [
@@ -73369,11 +73371,12 @@ var require_src11 = __commonJS({
       ...grid,
       ...columnRules
     ]);
+    var variableFunctions = /* @__PURE__ */ new Set(["var", "env", "constant"]);
     function isVariableFunctionNode(node) {
       if (node.type !== "function") {
         return false;
       }
-      return ["var", "env", "constant"].includes(node.value.toLowerCase());
+      return variableFunctions.has(node.value.toLowerCase());
     }
     function shouldAbort(parsed) {
       let abort = false;
@@ -75319,7 +75322,7 @@ var require_parseWsc = __commonJS({
     var { list } = require_postcss();
     var { isWidth, isStyle, isColor } = require_validateWsc();
     var none = /^\s*(none|medium)(\s+none(\s+(none|currentcolor))?)?\s*$/i;
-    var varRE = /--(\w|[^\x00-\x7F])+/g;
+    var varRE = /--(\w|-|[^\x00-\x7F])+/g;
     var toLower = (v) => {
       let match;
       let lastIndex = 0;
@@ -76402,11 +76405,12 @@ var require_src21 = __commonJS({
     function isCommaNode(node) {
       return node.type === "div" && node.value === ",";
     }
+    var variableFunctions = /* @__PURE__ */ new Set(["var", "env", "constant"]);
     function isVariableFunctionNode(node) {
       if (node.type !== "function") {
         return false;
       }
-      return ["var", "env"].includes(node.value.toLowerCase());
+      return variableFunctions.has(node.value.toLowerCase());
     }
     function transform(value) {
       const parsed = valueParser(value);
@@ -77216,6 +77220,7 @@ var require_src26 = __commonJS({
       ["top", "0"]
     ]);
     var mathFunctions = /* @__PURE__ */ new Set(["calc", "min", "max", "clamp"]);
+    var variableFunctions = /* @__PURE__ */ new Set(["var", "env", "constant"]);
     function isCommaNode(node) {
       return node.type === "div" && node.value === ",";
     }
@@ -77223,7 +77228,7 @@ var require_src26 = __commonJS({
       if (node.type !== "function") {
         return false;
       }
-      return ["var", "env"].includes(node.value.toLowerCase());
+      return variableFunctions.has(node.value.toLowerCase());
     }
     function isMathFunctionNode(node) {
       if (node.type !== "function") {
@@ -77910,10 +77915,19 @@ var require_src32 = __commonJS({
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.lazyPostcss = lazyPostcss;
-exports.lazyPostcssImport = lazyPostcssImport;
-exports.lazyAutoprefixer = lazyAutoprefixer;
-exports.lazyCssnano = lazyCssnano;
+function _export(target, all) {
+  for (var name in all)
+    Object.defineProperty(target, name, {
+      enumerable: true,
+      get: all[name]
+    });
+}
+_export(exports, {
+  lazyPostcss: () => lazyPostcss,
+  lazyPostcssImport: () => lazyPostcssImport,
+  lazyAutoprefixer: () => lazyAutoprefixer,
+  lazyCssnano: () => lazyCssnano
+});
 function lazyPostcss() {
   return require_postcss();
 }

package/resolveConfig.d.ts

@@ -0,0 +1,3 @@
+import type { Config } from './types/config'
+declare function resolveConfig(config: Config): Config
+export = resolveConfig

package/scripts/generate-types.js

@@ -1,8 +1,10 @@
 import prettier from 'prettier'
 import { corePlugins } from '../src/corePlugins'
 import colors from '../src/public/colors'
+import defaultTheme from '../src/public/default-theme'
 import fs from 'fs'
 import path from 'path'
+import * as types from './type-utils'
 
 fs.writeFileSync(
   path.join(process.cwd(), 'types', 'generated', 'corePluginList.d.ts'),
@@ -50,3 +52,54 @@ fs.writeFileSync(
     }
   )
 )
+
+const defaultThemeTypes = Object.entries(defaultTheme)
+  .map(([name, value]) => {
+    // Special cases for slightly more accurate types
+    if (name === 'keyframes') {
+      return [name, `Record<${types.forKeys(value)}, Record<string, CSSDeclarationList>>`]
+    }
+
+    if (name === 'fontSize') {
+      return [name, `Record<${types.forKeys(value)}, [string, { lineHeight: string }]>`]
+    }
+
+    // General cases
+    if (typeof value === 'string') {
+      return [name, `string`]
+    }
+
+    if (typeof value === 'function') {
+      return [name, null]
+    }
+
+    if (typeof value === 'object') {
+      if (Object.keys(value).length === 0) {
+        return [name, null]
+      }
+
+      return [name, types.forValue(value)]
+    }
+
+    return [name, `unknown`]
+  })
+  .filter(([, type]) => type !== null)
+  .map(([name, type]) => `${name}: ${type}`)
+  .join('\n')
+
+fs.writeFileSync(
+  path.join(process.cwd(), 'types', 'generated', 'default-theme.d.ts'),
+  prettier.format(
+    `
+    import { Config } from '../../types'
+    type CSSDeclarationList = Record<string, string>
+    export type DefaultTheme = Config['theme'] & { ${defaultThemeTypes} }
+  `,
+    {
+      semi: false,
+      singleQuote: true,
+      printWidth: 100,
+      parser: 'typescript',
+    }
+  )
+)

package/scripts/type-utils.js

@@ -0,0 +1,27 @@
+export function union(types) {
+  return [...new Set(types)].join(' | ')
+}
+
+export function unionValues(values) {
+  return union(values.map(forValue))
+}
+
+export function forKeys(value) {
+  return union(Object.keys(value).map((key) => `'${key}'`))
+}
+
+export function forValue(value) {
+  if (Array.isArray(value)) {
+    return `(${unionValues(value)})[]`
+  }
+
+  if (typeof value === 'object') {
+    return `Record<${forKeys(value)}, ${unionValues(Object.values(value))}>`
+  }
+
+  if (typeof value === 'string') {
+    return `string`
+  }
+
+  return `any`
+}

package/src/corePlugins.js

@@ -1613,7 +1613,7 @@ export let corePlugins = {
       {
         text: (value) => {
           let [fontSize, options] = Array.isArray(value) ? value : [value]
-          let { lineHeight, letterSpacing } = isPlainObject(options)
+          let { lineHeight, letterSpacing, fontWeight } = isPlainObject(options)
             ? options
             : { lineHeight: options }
 
@@ -1621,6 +1621,7 @@ export let corePlugins = {
             'font-size': fontSize,
             ...(lineHeight === undefined ? {} : { 'line-height': lineHeight }),
             ...(letterSpacing === undefined ? {} : { 'letter-spacing': letterSpacing }),
+            ...(fontWeight === undefined ? {} : { 'font-weight': fontWeight }),
           }
         },
       },

package/src/lib/defaultExtractor.js

@@ -1,4 +1,4 @@
-import { flagEnabled } from '../featureFlags.js'
+import { flagEnabled } from '../featureFlags'
 import * as regex from './regex'
 
 export function defaultExtractor(context) {
@@ -22,6 +22,10 @@ export function defaultExtractor(context) {
 function* buildRegExps(context) {
   let separator = context.tailwindConfig.separator
   let variantGroupingEnabled = flagEnabled(context.tailwindConfig, 'variantGrouping')
+  let prefix =
+    context.tailwindConfig.prefix !== ''
+      ? regex.optional(regex.pattern([/-?/, regex.escape(context.tailwindConfig.prefix)]))
+      : ''
 
   let utility = regex.any([
     // Arbitrary properties
@@ -88,6 +92,8 @@ function* buildRegExps(context) {
       // Important (optional)
       /!?/,
 
+      prefix,
+
       variantGroupingEnabled
         ? regex.any([
             // Or any of those things but grouped separated by commas

package/src/lib/evaluateTailwindFunctions.js

@@ -157,26 +157,52 @@ let nodeTypePropertyMap = {
   decl: 'value',
 }
 
-export default function ({ tailwindConfig: config }) {
-  let functions = {
-    theme: (node, path, ...defaultValue) => {
-      // Strip quotes from beginning and end of string
-      // This allows the alpha value to be present inside of quotes
-      path = path.replace(/^['"]+|['"]+$/g, '')
+/**
+ * @param {string} path
+ * @returns {Iterable<[path: string, alpha: string|undefined]>}
+ */
+function* toPaths(path) {
+  // Strip quotes from beginning and end of string
+  // This allows the alpha value to be present inside of quotes
+  path = path.replace(/^['"]+|['"]+$/g, '')
 
-      let matches = path.match(/^([^\s]+)(?![^\[]*\])(?:\s*\/\s*([^\/\s]+))$/)
-      let alpha = undefined
+  let matches = path.match(/^([^\s]+)(?![^\[]*\])(?:\s*\/\s*([^\/\s]+))$/)
+  let alpha = undefined
 
-      if (matches) {
-        path = matches[1]
-        alpha = matches[2]
-      }
+  yield [path, undefined]
+
+  if (matches) {
+    path = matches[1]
+    alpha = matches[2]
+
+    yield [path, alpha]
+  }
+}
 
-      let { isValid, value, error } = validatePath(
+/**
+ *
+ * @param {any} config
+ * @param {string} path
+ * @param {any} defaultValue
+ */
+function resolvePath(config, path, defaultValue) {
+  const results = Array.from(toPaths(path)).map(([path, alpha]) => {
+    return Object.assign(validatePath(config, path, defaultValue, { opacityValue: alpha }), {
+      resolvedPath: path,
+      alpha,
+    })
+  })
+
+  return results.find((result) => result.isValid) ?? results[0]
+}
+
+export default function ({ tailwindConfig: config }) {
+  let functions = {
+    theme: (node, path, ...defaultValue) => {
+      let { isValid, value, error, alpha } = resolvePath(
         config,
         path,
-        defaultValue.length ? defaultValue : undefined,
-        { opacityValue: alpha }
+        defaultValue.length ? defaultValue : undefined
       )
 
       if (!isValid) {

package/src/lib/generateRules.js

@@ -129,6 +129,7 @@ function applyVariant(variant, matches, context) {
   }
 
   let args
+  let isArbitraryVariant = false
 
   // Find partial arbitrary variants
   if (variant.endsWith(']') && !variant.startsWith('[')) {
@@ -144,6 +145,8 @@ function applyVariant(variant, matches, context) {
       return []
     }
 
+    isArbitraryVariant = true
+
     let fn = parseVariant(selector)
 
     let sort = Array.from(context.variantOrder.values()).pop() << 1n
@@ -300,6 +303,7 @@ function applyVariant(variant, matches, context) {
             ...meta,
             sort: variantSort | meta.sort,
             collectedFormats: (meta.collectedFormats ?? []).concat(collectedFormats),
+            isArbitraryVariant,
           },
           clone.nodes[0],
         ]
@@ -467,7 +471,11 @@ function splitWithSeparator(input, separator) {
 
 function* recordCandidates(matches, classCandidate) {
   for (const match of matches) {
-    match[1].raws.tailwind = { ...match[1].raws.tailwind, classCandidate }
+    match[1].raws.tailwind = {
+      ...match[1].raws.tailwind,
+      classCandidate,
+      preserveSource: match[0].options?.preserveSource ?? false,
+    }
 
     yield match
   }
@@ -627,6 +635,7 @@ function* resolveMatches(candidate, context, original = candidate) {
             base: candidate
               .split(new RegExp(`\\${context?.tailwindConfig?.separator ?? ':'}(?![^[]*\\])`))
               .pop(),
+            isArbitraryVariant: match[0].isArbitraryVariant,
 
             context,
           })