tailwindcss 3.0.22 → 3.1.0

package/lib/lib/evaluateTailwindFunctions.js

@@ -10,38 +10,39 @@ var _postcssValueParser = _interopRequireDefault(require("postcss-value-parser")
 var _normalizeScreens = require("../util/normalizeScreens");
 var _buildMediaQuery = _interopRequireDefault(require("../util/buildMediaQuery"));
 var _toPath = require("../util/toPath");
+var _withAlphaVariable = require("../util/withAlphaVariable");
+var _pluginUtils = require("../util/pluginUtils");
 function _interopRequireDefault(obj) {
     return obj && obj.__esModule ? obj : {
         default: obj
     };
 }
 function isObject(input) {
-    return typeof input === 'object' && input !== null;
+    return typeof input === "object" && input !== null;
 }
 function findClosestExistingPath(theme, path) {
     let parts = (0, _toPath).toPath(path);
     do {
         parts.pop();
         if ((0, _dlv).default(theme, parts) !== undefined) break;
-    }while (parts.length)
+    }while (parts.length);
     return parts.length ? parts : undefined;
 }
 function pathToString(path) {
-    if (typeof path === 'string') return path;
+    if (typeof path === "string") return path;
     return path.reduce((acc, cur, i)=>{
-        if (cur.includes('.')) return `${acc}[${cur}]`;
+        if (cur.includes(".")) return `${acc}[${cur}]`;
         return i === 0 ? cur : `${acc}.${cur}`;
-    }, '');
+    }, "");
 }
 function list(items) {
-    return items.map((key)=>`'${key}'`
-    ).join(', ');
+    return items.map((key)=>`'${key}'`).join(", ");
 }
 function listKeys(obj) {
     return list(Object.keys(obj));
 }
-function validatePath(config, path, defaultValue) {
-    const pathString = Array.isArray(path) ? pathToString(path) : path.replace(/^['"]+/g, '').replace(/['"]+$/g, '');
+function validatePath(config, path, defaultValue, themeOpts = {}) {
+    const pathString = Array.isArray(path) ? pathToString(path) : path.replace(/^['"]+/g, "").replace(/['"]+$/g, "");
     const pathSegments = Array.isArray(path) ? path : (0, _toPath).toPath(pathString);
     const value = (0, _dlv).default(config.theme, pathSegments, defaultValue);
     if (value === undefined) {
@@ -52,8 +53,7 @@ function validatePath(config, path, defaultValue) {
             const validKeys = Object.keys(parentValue).filter((key)=>validatePath(config, [
                     ...parentSegments,
                     key
-                ]).isValid
-            );
+                ]).isValid);
             const suggestion = (0, _didyoumean).default(pathSegments[pathSegments.length - 1], validKeys);
             if (suggestion) {
                 error += ` Did you mean '${pathToString([
@@ -81,14 +81,13 @@ function validatePath(config, path, defaultValue) {
             error
         };
     }
-    if (!(typeof value === 'string' || typeof value === 'number' || typeof value === 'function' || value instanceof String || value instanceof Number || Array.isArray(value))) {
+    if (!(typeof value === "string" || typeof value === "number" || typeof value === "function" || value instanceof String || value instanceof Number || Array.isArray(value))) {
         let error = `'${pathString}' was found but does not resolve to a string.`;
         if (isObject(value)) {
             let validKeys = Object.keys(value).filter((key)=>validatePath(config, [
                     ...pathSegments,
                     key
-                ]).isValid
-            );
+                ]).isValid);
             if (validKeys.length) {
                 error += ` Did you mean something like '${pathToString([
                     ...pathSegments,
@@ -104,18 +103,17 @@ function validatePath(config, path, defaultValue) {
     const [themeSection] = pathSegments;
     return {
         isValid: true,
-        value: (0, _transformThemeValue).default(themeSection)(value)
+        value: (0, _transformThemeValue).default(themeSection)(value, themeOpts)
     };
 }
 function extractArgs(node, vNodes, functions) {
-    vNodes = vNodes.map((vNode)=>resolveVNode(node, vNode, functions)
-    );
+    vNodes = vNodes.map((vNode)=>resolveVNode(node, vNode, functions));
     let args = [
-        ''
+        ""
     ];
     for (let vNode1 of vNodes){
-        if (vNode1.type === 'div' && vNode1.value === ',') {
-            args.push('');
+        if (vNode1.type === "div" && vNode1.value === ",") {
+            args.push("");
         } else {
             args[args.length - 1] += _postcssValueParser.default.stringify(vNode1);
         }
@@ -123,9 +121,9 @@ function extractArgs(node, vNodes, functions) {
     return args;
 }
 function resolveVNode(node, vNode, functions) {
-    if (vNode.type === 'function' && functions[vNode.value] !== undefined) {
+    if (vNode.type === "function" && functions[vNode.value] !== undefined) {
         let args = extractArgs(node, vNode.nodes, functions);
-        vNode.type = 'word';
+        vNode.type = "word";
         vNode.value = functions[vNode.value](node, ...args);
     }
     return vNode;
@@ -136,23 +134,34 @@ function resolveFunctions(node, input, functions) {
     }).toString();
 }
 let nodeTypePropertyMap = {
-    atrule: 'params',
-    decl: 'value'
+    atrule: "params",
+    decl: "value"
 };
 function _default({ tailwindConfig: config  }) {
     let functions = {
         theme: (node, path, ...defaultValue)=>{
-            const { isValid , value , error  } = validatePath(config, path, defaultValue.length ? defaultValue : undefined);
+            let matches = path.match(/^([^\/\s]+)(?:\s*\/\s*([^\/\s]+))$/);
+            let alpha = undefined;
+            if (matches) {
+                path = matches[1];
+                alpha = matches[2];
+            }
+            let { isValid , value , error  } = validatePath(config, path, defaultValue.length ? defaultValue : undefined, {
+                opacityValue: alpha
+            });
             if (!isValid) {
                 throw node.error(error);
             }
+            if (alpha !== undefined) {
+                value = (0, _pluginUtils).parseColorFormat(value);
+                value = (0, _withAlphaVariable).withAlphaValue(value, alpha, value);
+            }
             return value;
         },
         screen: (node, screen)=>{
-            screen = screen.replace(/^['"]+/g, '').replace(/['"]+$/g, '');
+            screen = screen.replace(/^['"]+/g, "").replace(/['"]+$/g, "");
             let screens = (0, _normalizeScreens).normalizeScreens(config.theme.screens);
-            let screenDefinition = screens.find(({ name  })=>name === screen
-            );
+            let screenDefinition = screens.find(({ name  })=>name === screen);
             if (!screenDefinition) {
                 throw node.error(`The '${screen}' screen does not exist in your theme.`);
             }