tailwindcss 0.0.0-insiders.ddec022 → 0.0.0-insiders.de00a62

package/lib/util/cloneNodes.js

@@ -1,4 +1,9 @@
-"use strict";
+/**
+ * @param {import('postcss').Container[]} nodes
+ * @param {any} source
+ * @param {any} raws
+ * @returns {import('postcss').Container[]}
+ */ "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
@@ -10,25 +15,40 @@ Object.defineProperty(exports, "default", {
 });
 function cloneNodes(nodes, source = undefined, raws = undefined) {
     return nodes.map((node)=>{
-        var _node_raws_tailwind;
         let cloned = node.clone();
-        // We always want override the source map
-        // except when explicitly told not to
-        let shouldOverwriteSource = ((_node_raws_tailwind = node.raws.tailwind) === null || _node_raws_tailwind === void 0 ? void 0 : _node_raws_tailwind.preserveSource) !== true || !cloned.source;
-        if (source !== undefined && shouldOverwriteSource) {
-            cloned.source = source;
-            if ("walk" in cloned) {
-                cloned.walk((child)=>{
-                    child.source = source;
-                });
-            }
-        }
         if (raws !== undefined) {
             cloned.raws.tailwind = {
                 ...cloned.raws.tailwind,
                 ...raws
             };
         }
+        if (source !== undefined) {
+            traverse(cloned, (node)=>{
+                var _node_raws_tailwind;
+                // Do not traverse nodes that have opted
+                // to preserve their original source
+                let shouldPreserveSource = ((_node_raws_tailwind = node.raws.tailwind) === null || _node_raws_tailwind === void 0 ? void 0 : _node_raws_tailwind.preserveSource) === true && node.source;
+                if (shouldPreserveSource) {
+                    return false;
+                }
+                // Otherwise we can safely replace the source
+                // And continue traversing
+                node.source = source;
+            });
+        }
         return cloned;
     });
 }
+/**
+ * Traverse a tree of nodes and don't traverse children if the callback
+ * returns false. Ideally we'd use Container#walk instead of this
+ * function but it stops traversing siblings too.
+ *
+ * @param {import('postcss').Container} node
+ * @param {(node: import('postcss').Container) => boolean} onNode
+ */ function traverse(node, onNode) {
+    if (onNode(node) !== false) {
+        var _node_each;
+        (_node_each = node.each) === null || _node_each === void 0 ? void 0 : _node_each.call(node, (child)=>traverse(child, onNode));
+    }
+}

package/lib/util/color.js

@@ -27,7 +27,7 @@ let SHORT_HEX = /^#([a-f\d])([a-f\d])([a-f\d])([a-f\d])?$/i;
 let VALUE = /(?:\d+|\d*\.\d+)%?/;
 let SEP = /(?:\s*,\s*|\s+)/;
 let ALPHA_SEP = /\s*[,/]\s*/;
-let CUSTOM_PROPERTY = /var\(--(?:[^ )]*?)\)/;
+let CUSTOM_PROPERTY = /var\(--(?:[^ )]*?)(?:,(?:[^ )]*?|var\(--[^ )]*?\)))?\)/;
 let RGB = new RegExp(`^(rgba?)\\(\\s*(${VALUE.source}|${CUSTOM_PROPERTY.source})(?:${SEP.source}(${VALUE.source}|${CUSTOM_PROPERTY.source}))?(?:${SEP.source}(${VALUE.source}|${CUSTOM_PROPERTY.source}))?(?:${ALPHA_SEP.source}(${VALUE.source}|${CUSTOM_PROPERTY.source}))?\\s*\\)$`);
 let HSL = new RegExp(`^(hsla?)\\(\\s*((?:${VALUE.source})(?:deg|rad|grad|turn)?|${CUSTOM_PROPERTY.source})(?:${SEP.source}(${VALUE.source}|${CUSTOM_PROPERTY.source}))?(?:${SEP.source}(${VALUE.source}|${CUSTOM_PROPERTY.source}))?(?:${ALPHA_SEP.source}(${VALUE.source}|${CUSTOM_PROPERTY.source}))?\\s*\\)$`);
 function parseColor(value, { loose =false  } = {}) {

package/lib/util/dataTypes.js

@@ -68,10 +68,30 @@ let cssFunctions = [
 function isCSSFunction(value) {
     return cssFunctions.some((fn)=>new RegExp(`^${fn}\\(.*\\)`).test(value));
 }
-const placeholder = "--tw-placeholder";
-const placeholderRe = new RegExp(placeholder, "g");
-function normalize(value, isRoot = true) {
-    if (value.startsWith("--")) {
+// These properties accept a `<dashed-ident>` as one of the values. This means that you can use them
+// as: `timeline-scope: --tl;`
+//
+// Without the `var(--tl)`, in these cases we don't want to normalize the value, and you should add
+// the `var()` yourself.
+//
+// More info:
+// - https://drafts.csswg.org/scroll-animations/#propdef-timeline-scope
+// - https://developer.mozilla.org/en-US/docs/Web/CSS/timeline-scope#dashed-ident
+//
+const AUTO_VAR_INJECTION_EXCEPTIONS = new Set([
+    // Concrete properties
+    "scroll-timeline-name",
+    "timeline-scope",
+    "view-timeline-name",
+    "font-palette",
+    // Shorthand properties
+    "scroll-timeline",
+    "animation-timeline",
+    "view-timeline"
+]);
+function normalize(value, context = null, isRoot = true) {
+    let isVarException = context && AUTO_VAR_INJECTION_EXCEPTIONS.has(context.property);
+    if (value.startsWith("--") && !isVarException) {
         return `var(${value})`;
     }
     // Keep raw strings if it starts with `url(`
@@ -80,7 +100,7 @@ function normalize(value, isRoot = true) {
             if (/^url\(.*?\)$/.test(part)) {
                 return part;
             }
-            return normalize(part, false);
+            return normalize(part, context, false);
         }).join("");
     }
     // Convert `_` to ` `, except for escaped underscores `\_`
@@ -89,17 +109,115 @@ function normalize(value, isRoot = true) {
     if (isRoot) {
         value = value.trim();
     }
-    // Add spaces around operators inside math functions like calc() that do not follow an operator
-    // or '('.
-    value = value.replace(/(calc|min|max|clamp)\(.+\)/g, (match)=>{
-        let vars = [];
-        return match.replace(/var\((--.+?)[,)]/g, (match, g1)=>{
-            vars.push(g1);
-            return match.replace(g1, placeholder);
-        }).replace(/(-?\d*\.?\d(?!\b-\d.+[,)](?![^+\-/*])\D)(?:%|[a-z]+)?|\))([+\-/*])/g, "$1 $2 ").replace(placeholderRe, ()=>vars.shift());
-    });
+    value = normalizeMathOperatorSpacing(value);
     return value;
 }
+/**
+ * Add spaces around operators inside math functions
+ * like calc() that do not follow an operator, '(', or `,`.
+ *
+ * @param {string} value
+ * @returns {string}
+ */ function normalizeMathOperatorSpacing(value) {
+    let preventFormattingInFunctions = [
+        "theme"
+    ];
+    let preventFormattingKeywords = [
+        "min-content",
+        "max-content",
+        "fit-content",
+        // Env
+        "safe-area-inset-top",
+        "safe-area-inset-right",
+        "safe-area-inset-bottom",
+        "safe-area-inset-left",
+        "titlebar-area-x",
+        "titlebar-area-y",
+        "titlebar-area-width",
+        "titlebar-area-height",
+        "keyboard-inset-top",
+        "keyboard-inset-right",
+        "keyboard-inset-bottom",
+        "keyboard-inset-left",
+        "keyboard-inset-width",
+        "keyboard-inset-height",
+        "radial-gradient",
+        "linear-gradient",
+        "conic-gradient",
+        "repeating-radial-gradient",
+        "repeating-linear-gradient",
+        "repeating-conic-gradient"
+    ];
+    return value.replace(/(calc|min|max|clamp)\(.+\)/g, (match)=>{
+        let result = "";
+        function lastChar() {
+            let char = result.trimEnd();
+            return char[char.length - 1];
+        }
+        for(let i = 0; i < match.length; i++){
+            function peek(word) {
+                return word.split("").every((char, j)=>match[i + j] === char);
+            }
+            function consumeUntil(chars) {
+                let minIndex = Infinity;
+                for (let char of chars){
+                    let index = match.indexOf(char, i);
+                    if (index !== -1 && index < minIndex) {
+                        minIndex = index;
+                    }
+                }
+                let result = match.slice(i, minIndex);
+                i += result.length - 1;
+                return result;
+            }
+            let char = match[i];
+            // Handle `var(--variable)`
+            if (peek("var")) {
+                // When we consume until `)`, then we are dealing with this scenario:
+                //   `var(--example)`
+                //
+                // When we consume until `,`, then we are dealing with this scenario:
+                //   `var(--example, 1rem)`
+                //
+                //   In this case we do want to "format", the default value as well
+                result += consumeUntil([
+                    ")",
+                    ","
+                ]);
+            } else if (preventFormattingKeywords.some((keyword)=>peek(keyword))) {
+                let keyword = preventFormattingKeywords.find((keyword)=>peek(keyword));
+                result += keyword;
+                i += keyword.length - 1;
+            } else if (preventFormattingInFunctions.some((fn)=>peek(fn))) {
+                result += consumeUntil([
+                    ")"
+                ]);
+            } else if (peek("[")) {
+                result += consumeUntil([
+                    "]"
+                ]);
+            } else if ([
+                "+",
+                "-",
+                "*",
+                "/"
+            ].includes(char) && ![
+                "(",
+                "+",
+                "-",
+                "*",
+                "/",
+                ","
+            ].includes(lastChar())) {
+                result += ` ${char} `;
+            } else {
+                result += char;
+            }
+        }
+        // Simplify multiple spaces
+        return result.replace(/\s+/g, " ");
+    });
+}
 function url(value) {
     return value.startsWith("url(");
 }
@@ -199,11 +317,12 @@ function image(value) {
     return images > 0;
 }
 let gradientTypes = new Set([
+    "conic-gradient",
     "linear-gradient",
     "radial-gradient",
+    "repeating-conic-gradient",
     "repeating-linear-gradient",
-    "repeating-radial-gradient",
-    "conic-gradient"
+    "repeating-radial-gradient"
 ]);
 function gradient(value) {
     value = normalize(value);

package/lib/util/formatVariantSelector.js

@@ -27,12 +27,13 @@ const _unesc = /*#__PURE__*/ _interop_require_default(require("postcss-selector-
 const _escapeClassName = /*#__PURE__*/ _interop_require_default(require("../util/escapeClassName"));
 const _prefixSelector = /*#__PURE__*/ _interop_require_default(require("../util/prefixSelector"));
 const _pseudoElements = require("./pseudoElements");
+const _splitAtTopLevelOnly = require("./splitAtTopLevelOnly");
 function _interop_require_default(obj) {
     return obj && obj.__esModule ? obj : {
         default: obj
     };
 }
-/** @typedef {import('postcss-selector-parser').Root} Root */ /** @typedef {import('postcss-selector-parser').Selector} Selector */ /** @typedef {import('postcss-selector-parser').Pseudo} Pseudo */ /** @typedef {import('postcss-selector-parser').Node} Node */ /** @typedef {{format: string, isArbitraryVariant: boolean}[]} RawFormats */ /** @typedef {import('postcss-selector-parser').Root} ParsedFormats */ /** @typedef {RawFormats | ParsedFormats} AcceptedFormats */ let MERGE = ":merge";
+/** @typedef {import('postcss-selector-parser').Root} Root */ /** @typedef {import('postcss-selector-parser').Selector} Selector */ /** @typedef {import('postcss-selector-parser').Pseudo} Pseudo */ /** @typedef {import('postcss-selector-parser').Node} Node */ /** @typedef {{format: string, respectPrefix: boolean}[]} RawFormats */ /** @typedef {import('postcss-selector-parser').Root} ParsedFormats */ /** @typedef {RawFormats | ParsedFormats} AcceptedFormats */ let MERGE = ":merge";
 function formatVariantSelector(formats, { context , candidate  }) {
     var _context_tailwindConfig_prefix;
     let prefix = (_context_tailwindConfig_prefix = context === null || context === void 0 ? void 0 : context.tailwindConfig.prefix) !== null && _context_tailwindConfig_prefix !== void 0 ? _context_tailwindConfig_prefix : "";
@@ -41,7 +42,7 @@ function formatVariantSelector(formats, { context , candidate  }) {
         let ast = (0, _postcssselectorparser.default)().astSync(format.format);
         return {
             ...format,
-            ast: format.isArbitraryVariant ? ast : (0, _prefixSelector.default)(prefix, ast)
+            ast: format.respectPrefix ? (0, _prefixSelector.default)(prefix, ast) : ast
         };
     });
     // We start with the candidate selector
@@ -138,7 +139,7 @@ function finalizeSelector(current, formats, { context , candidate , base  }) {
     //           │  │     │            ╰── We will not split here
     //           ╰──┴─────┴─────────────── We will split here
     //
-    base = base !== null && base !== void 0 ? base : candidate.split(new RegExp(`\\${separator}(?![^[]*\\])`)).pop();
+    base = base !== null && base !== void 0 ? base : (0, _splitAtTopLevelOnly.splitAtTopLevelOnly)(candidate, separator).pop();
     // Parse the selector into an AST
     let selector = (0, _postcssselectorparser.default)().astSync(current);
     // Normalize escaped classes, e.g.:
@@ -159,6 +160,12 @@ function finalizeSelector(current, formats, { context , candidate , base  }) {
     });
     // Remove extraneous selectors that do not include the base candidate
     selector.each((sel)=>eliminateIrrelevantSelectors(sel, base));
+    // If ffter eliminating irrelevant selectors, we end up with nothing
+    // Then the whole "rule" this is associated with does not need to exist
+    // We use `null` as a marker value for that case
+    if (selector.length === 0) {
+        return null;
+    }
     // If there are no formats that means there were no variants added to the candidate
     // so we can just return the selector as-is
     let formatAst = Array.isArray(formats) ? formatVariantSelector(formats, {

package/lib/util/isPlainObject.js

@@ -13,5 +13,5 @@ function isPlainObject(value) {
         return false;
     }
     const prototype = Object.getPrototypeOf(value);
-    return prototype === null || prototype === Object.prototype;
+    return prototype === null || Object.getPrototypeOf(prototype) === null;
 }

package/lib/util/pluginUtils.js

@@ -92,6 +92,19 @@ function isArbitraryValue(input) {
 }
 function splitUtilityModifier(modifier) {
     let slashIdx = modifier.lastIndexOf("/");
+    // If the `/` is inside an arbitrary, we want to find the previous one if any
+    // This logic probably isn't perfect but it should work for most cases
+    let arbitraryStartIdx = modifier.lastIndexOf("[", slashIdx);
+    let arbitraryEndIdx = modifier.indexOf("]", slashIdx);
+    let isNextToArbitrary = modifier[slashIdx - 1] === "]" || modifier[slashIdx + 1] === "[";
+    // Backtrack to the previous `/` if the one we found was inside an arbitrary
+    if (!isNextToArbitrary) {
+        if (arbitraryStartIdx !== -1 && arbitraryEndIdx !== -1) {
+            if (arbitraryStartIdx < slashIdx && slashIdx < arbitraryEndIdx) {
+                slashIdx = modifier.lastIndexOf("/", arbitraryStartIdx);
+            }
+        }
+    }
     if (slashIdx === -1 || slashIdx === modifier.length - 1) {
         return [
             modifier,

package/lib/util/prefixSelector.js

@@ -29,7 +29,7 @@ function _default(prefix, selector, prependNegative = false) {
     if (prefix === "") {
         return selector;
     }
-    let ast = typeof selector === "string" ? (0, _postcssselectorparser.default)().astSync(selector) : selector;
+    /** @type {import('postcss-selector-parser').Root} */ let ast = typeof selector === "string" ? (0, _postcssselectorparser.default)().astSync(selector) : selector;
     ast.walkClasses((classSelector)=>{
         let baseClass = classSelector.value;
         let shouldPlaceNegativeBeforePrefix = prependNegative && baseClass.startsWith("-");

package/lib/util/pseudoElements.js

@@ -11,7 +11,7 @@
 // **Jumpable**
 // Any terminal element may "jump" over combinators when moving to the end of the selector
 //
-// This is a backwards-compat quirk of :before and :after variants.
+// This is a backwards-compat quirk of pseudo element variants from earlier versions of Tailwind CSS.
 /** @typedef {'terminal' | 'actionable' | 'jumpable'} PseudoProperty */ /** @type {Record<string, PseudoProperty[]>} */ "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true
@@ -23,12 +23,14 @@ Object.defineProperty(exports, "movePseudos", {
     }
 });
 let elementProperties = {
+    // Pseudo elements from the spec
     "::after": [
         "terminal",
         "jumpable"
     ],
     "::backdrop": [
-        "terminal"
+        "terminal",
+        "jumpable"
     ],
     "::before": [
         "terminal",
@@ -52,17 +54,20 @@ let elementProperties = {
         "terminal"
     ],
     "::marker": [
-        "terminal"
+        "terminal",
+        "jumpable"
     ],
     "::part": [
         "terminal",
         "actionable"
     ],
     "::placeholder": [
-        "terminal"
+        "terminal",
+        "jumpable"
     ],
     "::selection": [
-        "terminal"
+        "terminal",
+        "jumpable"
     ],
     "::slotted": [
         "terminal"
@@ -73,42 +78,20 @@ let elementProperties = {
     "::target-text": [
         "terminal"
     ],
-    // other
+    // Pseudo elements from the spec with special rules
     "::file-selector-button": [
         "terminal",
         "actionable"
     ],
-    "::-webkit-progress-bar": [
-        "terminal",
+    // Library-specific pseudo elements used by component libraries
+    // These are Shadow DOM-like
+    "::deep": [
         "actionable"
     ],
-    // Webkit scroll bar pseudo elements can be combined with user-action pseudo classes
-    "::-webkit-scrollbar": [
-        "terminal",
+    "::v-deep": [
         "actionable"
     ],
-    "::-webkit-scrollbar-button": [
-        "terminal",
-        "actionable"
-    ],
-    "::-webkit-scrollbar-thumb": [
-        "terminal",
-        "actionable"
-    ],
-    "::-webkit-scrollbar-track": [
-        "terminal",
-        "actionable"
-    ],
-    "::-webkit-scrollbar-track-piece": [
-        "terminal",
-        "actionable"
-    ],
-    "::-webkit-scrollbar-corner": [
-        "terminal",
-        "actionable"
-    ],
-    "::-webkit-resizer": [
-        "terminal",
+    "::ng-deep": [
         "actionable"
     ],
     // Note: As a rule, double colons (::) should be used instead of a single colon
@@ -131,10 +114,14 @@ let elementProperties = {
         "terminal",
         "jumpable"
     ],
+    ":where": [],
+    ":is": [],
+    ":has": [],
     // The default value is used when the pseudo-element is not recognized
     // Because it's not recognized, we don't know if it's terminal or not
-    // So we assume it can't be moved AND can have user-action pseudo classes attached to it
+    // So we assume it can be moved AND can have user-action pseudo classes attached to it
     __default__: [
+        "terminal",
         "actionable"
     ]
 };

package/lib/value-parser/LICENSE

@@ -0,0 +1,22 @@
+Copyright (c) Bogdan Chadkin <trysound@yandex.ru>
+
+Permission is hereby granted, free of charge, to any person
+obtaining a copy of this software and associated documentation
+files (the "Software"), to deal in the Software without
+restriction, including without limitation the rights to use,
+copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the
+Software is furnished to do so, subject to the following
+conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
+OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
+HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
+OTHER DEALINGS IN THE SOFTWARE.

package/lib/value-parser/README.md

@@ -0,0 +1,3 @@
+# postcss-value-parser (forked + inlined)
+
+This is a customized version of of [PostCSS Value Parser](https://github.com/TrySound/postcss-value-parser) to fix some bugs around parsing CSS functions.

package/lib/value-parser/index.d.js

@@ -0,0 +1,2 @@
+"use strict";
+module.exports = postcssValueParser;

package/lib/value-parser/index.js

@@ -0,0 +1,22 @@
+"use strict";
+var parse = require("./parse");
+var walk = require("./walk");
+var stringify = require("./stringify");
+function ValueParser(value) {
+    if (this instanceof ValueParser) {
+        this.nodes = parse(value);
+        return this;
+    }
+    return new ValueParser(value);
+}
+ValueParser.prototype.toString = function() {
+    return Array.isArray(this.nodes) ? stringify(this.nodes) : "";
+};
+ValueParser.prototype.walk = function(cb, bubble) {
+    walk(this.nodes, cb, bubble);
+    return this;
+};
+ValueParser.unit = require("./unit");
+ValueParser.walk = walk;
+ValueParser.stringify = stringify;
+module.exports = ValueParser;