tailwindcss 0.0.0-insiders.bd970d0 → 0.0.0-insiders.bda8421

package/lib/lib/offsets.js

@@ -17,6 +17,44 @@ function _interop_require_default(obj) {
     };
 }
 class Offsets {
+    constructor(){
+        /**
+     * Offsets for the next rule in a given layer
+     *
+     * @type {Record<Layer, bigint>}
+     */ this.offsets = {
+            defaults: 0n,
+            base: 0n,
+            components: 0n,
+            utilities: 0n,
+            variants: 0n,
+            user: 0n
+        };
+        /**
+     * Positions for a given layer
+     *
+     * @type {Record<Layer, bigint>}
+     */ this.layerPositions = {
+            defaults: 0n,
+            base: 1n,
+            components: 2n,
+            utilities: 3n,
+            // There isn't technically a "user" layer, but we need to give it a position
+            // Because it's used for ordering user-css from @apply
+            user: 4n,
+            variants: 5n
+        };
+        /**
+     * The total number of functions currently registered across all variants (including arbitrary variants)
+     *
+     * @type {bigint}
+     */ this.reservedVariantBits = 0n;
+        /**
+     * Positions for a given variant
+     *
+     * @type {Map<string, bigint>}
+     */ this.variantOffsets = new Map();
+    }
     /**
    * @param {Layer} layer
    * @returns {RuleOffset}
@@ -28,15 +66,19 @@ class Offsets {
             variants: 0n,
             parallelIndex: 0n,
             index: this.offsets[layer]++,
+            propertyOffset: 0n,
+            property: "",
             options: []
         };
     }
     /**
+   * @param {string} name
    * @returns {RuleOffset}
-   */ arbitraryProperty() {
+   */ arbitraryProperty(name) {
         return {
-            ...this.create('utilities'),
-            arbitrary: 1n
+            ...this.create("utilities"),
+            arbitrary: 1n,
+            property: name
         };
     }
     /**
@@ -51,7 +93,7 @@ class Offsets {
             throw new Error(`Cannot find offset for unknown variant ${variant}`);
         }
         return {
-            ...this.create('variants'),
+            ...this.create("variants"),
             variants: offset << BigInt(index)
         };
     }
@@ -64,8 +106,8 @@ class Offsets {
         options.variant = variant.variants;
         return {
             ...rule,
-            layer: 'variants',
-            parentLayer: rule.layer === 'variants' ? rule.parentLayer : rule.layer,
+            layer: "variants",
+            parentLayer: rule.layer === "variants" ? rule.parentLayer : rule.layer,
             variants: rule.variants | variant.variants,
             options: options.sort ? [].concat(options, rule.options) : rule.options,
             // TODO: Technically this is wrong. We should be handling parallel index on a per variant basis.
@@ -118,7 +160,7 @@ class Offsets {
         // @see `RuleOffset.parallelIndex`
         this.reservedVariantBits += BigInt(fnCount);
         return {
-            ...this.create('variants'),
+            ...this.create("variants"),
             variants: this.variantOffsets.get(variant)
         };
     }
@@ -176,6 +218,10 @@ class Offsets {
         if (a.arbitrary !== b.arbitrary) {
             return a.arbitrary - b.arbitrary;
         }
+        // Always sort arbitrary properties alphabetically
+        if (a.propertyOffset !== b.propertyOffset) {
+            return a.propertyOffset - b.propertyOffset;
+        }
         // Sort utilities, components, etc… in the order they were registered
         return a.index - b.index;
     }
@@ -187,7 +233,7 @@ class Offsets {
    * be in alphabetical order starting from the offset of the first arbitrary variant.
    */ recalculateVariantOffsets() {
         // Sort the variants by their name
-        let variants = Array.from(this.variantOffsets.entries()).filter(([v])=>v.startsWith('[')).sort(([a], [z])=>fastCompare(a, z));
+        let variants = Array.from(this.variantOffsets.entries()).filter(([v])=>v.startsWith("[")).sort(([a], [z])=>fastCompare(a, z));
         // Sort the list of offsets
         // This is not necessarily a discrete range of numbers which is why
         // we're using sort instead of creating a range from min/max
@@ -208,7 +254,7 @@ class Offsets {
    */ remapArbitraryVariantOffsets(list) {
         let mapping = this.recalculateVariantOffsets();
         // No arbitrary variants? Nothing to do.
-        // Everything already in order? Nothing to do.
+        // Everyhing already in order? Nothing to do.
         if (mapping.length === 0) {
             return list;
         }
@@ -229,48 +275,51 @@ class Offsets {
    * @template T
    * @param {[RuleOffset, T][]} list
    * @returns {[RuleOffset, T][]}
+   */ sortArbitraryProperties(list) {
+        // Collect all known arbitrary properties
+        let known = new Set();
+        for (let [offset] of list){
+            if (offset.arbitrary === 1n) {
+                known.add(offset.property);
+            }
+        }
+        // No arbitrary properties? Nothing to do.
+        if (known.size === 0) {
+            return list;
+        }
+        // Sort the properties alphabetically
+        let properties = Array.from(known).sort();
+        // Create a map from the property name to its offset
+        let offsets = new Map();
+        let offset = 1n;
+        for (let property of properties){
+            offsets.set(property, offset++);
+        }
+        // Apply the sorted offsets to the list
+        return list.map((item)=>{
+            let [offset, rule] = item;
+            var _offsets_get;
+            offset = {
+                ...offset,
+                propertyOffset: (_offsets_get = offsets.get(offset.property)) !== null && _offsets_get !== void 0 ? _offsets_get : 0n
+            };
+            return [
+                offset,
+                rule
+            ];
+        });
+    }
+    /**
+   * @template T
+   * @param {[RuleOffset, T][]} list
+   * @returns {[RuleOffset, T][]}
    */ sort(list) {
+        // Sort arbitrary variants so they're in alphabetical order
         list = this.remapArbitraryVariantOffsets(list);
+        // Sort arbitrary properties so they're in alphabetical order
+        list = this.sortArbitraryProperties(list);
         return list.sort(([a], [b])=>(0, _bigSign.default)(this.compare(a, b)));
     }
-    constructor(){
-        /**
-     * Offsets for the next rule in a given layer
-     *
-     * @type {Record<Layer, bigint>}
-     */ this.offsets = {
-            defaults: 0n,
-            base: 0n,
-            components: 0n,
-            utilities: 0n,
-            variants: 0n,
-            user: 0n
-        };
-        /**
-     * Positions for a given layer
-     *
-     * @type {Record<Layer, bigint>}
-     */ this.layerPositions = {
-            defaults: 0n,
-            base: 1n,
-            components: 2n,
-            utilities: 3n,
-            // There isn't technically a "user" layer, but we need to give it a position
-            // Because it's used for ordering user-css from @apply
-            user: 4n,
-            variants: 5n
-        };
-        /**
-     * The total number of functions currently registered across all variants (including arbitrary variants)
-     *
-     * @type {bigint}
-     */ this.reservedVariantBits = 0n;
-        /**
-     * Positions for a given variant
-     *
-     * @type {Map<string, bigint>}
-     */ this.variantOffsets = new Map();
-    }
 }
 /**
  *
@@ -290,7 +339,7 @@ class Offsets {
  * Using `.sort()` without a custom compare function is faster
  * But you can only use that if you're sorting an array of
  * only strings. If you're sorting strings inside objects
- * or arrays, you need to use a custom compare function.
+ * or arrays, you need must use a custom compare function.
  *
  * @param {string} a
  * @param {string} b

package/lib/lib/partitionApplyAtRules.js

@@ -11,7 +11,7 @@ Object.defineProperty(exports, "default", {
 function partitionRules(root) {
     if (!root.walkAtRules) return;
     let applyParents = new Set();
-    root.walkAtRules('apply', (rule)=>{
+    root.walkAtRules("apply", (rule)=>{
         applyParents.add(rule.parent);
     });
     if (applyParents.size === 0) {
@@ -21,7 +21,7 @@ function partitionRules(root) {
         let nodeGroups = [];
         let lastGroup = [];
         for (let node of rule.nodes){
-            if (node.type === 'atrule' && node.name === 'apply') {
+            if (node.type === "atrule" && node.name === "apply") {
                 if (lastGroup.length > 0) {
                     nodeGroups.push(lastGroup);
                     lastGroup = [];

package/lib/lib/regex.js

@@ -40,16 +40,16 @@ const REGEX_HAS_SPECIAL = RegExp(REGEX_SPECIAL.source);
         source
     ];
     source = source.map((item)=>item instanceof RegExp ? item.source : item);
-    return source.join('');
+    return source.join("");
 }
 function pattern(source) {
-    return new RegExp(toSource(source), 'g');
+    return new RegExp(toSource(source), "g");
 }
 function withoutCapturing(source) {
-    return new RegExp(`(?:${toSource(source)})`, 'g');
+    return new RegExp(`(?:${toSource(source)})`, "g");
 }
 function any(sources) {
-    return `(?:${sources.map(toSource).join('|')})`;
+    return `(?:${sources.map(toSource).join("|")})`;
 }
 function optional(source) {
     return `(?:${toSource(source)})?`;
@@ -70,5 +70,5 @@ function nestedBrackets(open, close, depth = 1) {
     ]);
 }
 function escape(string) {
-    return string && REGEX_HAS_SPECIAL.test(string) ? string.replace(REGEX_SPECIAL, '\\$&') : string || '';
+    return string && REGEX_HAS_SPECIAL.test(string) ? string.replace(REGEX_SPECIAL, "\\$&") : string || "";
 }

package/lib/lib/resolveDefaultsAtRules.js

@@ -27,8 +27,8 @@ function _interop_require_default(obj) {
 let getNode = {
     id (node) {
         return _postcssselectorparser.default.attribute({
-            attribute: 'id',
-            operator: '=',
+            attribute: "id",
+            operator: "=",
             value: node.value,
             quoteMark: '"'
         });
@@ -37,31 +37,31 @@ let getNode = {
 function minimumImpactSelector(nodes) {
     let rest = nodes.filter((node)=>{
         // Keep non-pseudo nodes
-        if (node.type !== 'pseudo') return true;
+        if (node.type !== "pseudo") return true;
         // Keep pseudo nodes that have subnodes
         // E.g.: `:not()` contains subnodes inside the parentheses
         if (node.nodes.length > 0) return true;
         // Keep pseudo `elements`
         // This implicitly means that we ignore pseudo `classes`
-        return node.value.startsWith('::') || [
-            ':before',
-            ':after',
-            ':first-line',
-            ':first-letter'
+        return node.value.startsWith("::") || [
+            ":before",
+            ":after",
+            ":first-line",
+            ":first-letter"
         ].includes(node.value);
     }).reverse();
     let searchFor = new Set([
-        'tag',
-        'class',
-        'id',
-        'attribute'
+        "tag",
+        "class",
+        "id",
+        "attribute"
     ]);
     let splitPointIdx = rest.findIndex((n)=>searchFor.has(n.type));
-    if (splitPointIdx === -1) return rest.reverse().join('').trim();
+    if (splitPointIdx === -1) return rest.reverse().join("").trim();
     let node = rest[splitPointIdx];
     let bestNode = getNode[node.type] ? getNode[node.type](node) : node;
     rest = rest.slice(0, splitPointIdx);
-    let combinatorIdx = rest.findIndex((n)=>n.type === 'combinator' && n.value === '>');
+    let combinatorIdx = rest.findIndex((n)=>n.type === "combinator" && n.value === ">");
     if (combinatorIdx !== -1) {
         rest.splice(0, combinatorIdx);
         rest.unshift(_postcssselectorparser.default.universal());
@@ -69,11 +69,11 @@ function minimumImpactSelector(nodes) {
     return [
         bestNode,
         ...rest.reverse()
-    ].join('').trim();
+    ].join("").trim();
 }
 let elementSelectorParser = (0, _postcssselectorparser.default)((selectors)=>{
     return selectors.map((s)=>{
-        let nodes = s.split((n)=>n.type === 'combinator' && n.value === ' ').pop();
+        let nodes = s.split((n)=>n.type === "combinator" && n.value === " ").pop();
         return minimumImpactSelector(nodes);
     });
 });
@@ -84,11 +84,11 @@ function extractElementSelector(selector) {
     }
     return cache.get(selector);
 }
-function resolveDefaultsAtRules({ tailwindConfig }) {
+function resolveDefaultsAtRules({ tailwindConfig  }) {
     return (root)=>{
         let variableNodeMap = new Map();
         /** @type {Set<import('postcss').AtRule>} */ let universals = new Set();
-        root.walkAtRules('defaults', (rule)=>{
+        root.walkAtRules("defaults", (rule)=>{
             if (rule.nodes && rule.nodes.length > 0) {
                 universals.add(rule);
                 return;
@@ -100,7 +100,7 @@ function resolveDefaultsAtRules({ tailwindConfig }) {
             variableNodeMap.get(variable).add(rule.parent);
             rule.remove();
         });
-        if ((0, _featureFlags.flagEnabled)(tailwindConfig, 'optimizeUniversalDefaults')) {
+        if ((0, _featureFlags.flagEnabled)(tailwindConfig, "optimizeUniversalDefaults")) {
             for (let universal of universals){
                 /** @type {Map<string, Set<string>>} */ let selectorGroups = new Map();
                 var _variableNodeMap_get;
@@ -111,14 +111,16 @@ function resolveDefaultsAtRules({ tailwindConfig }) {
                         // we consider them separately because merging the declarations into
                         // a single rule will cause browsers that do not understand the
                         // vendor prefix to throw out the whole rule
-                        let selectorGroupName = selector.includes(':-') || selector.includes('::-') ? selector : '__DEFAULT__';
+                        // Additionally if a selector contains `:has` we also consider
+                        // it separately because FF only recently gained support for it
+                        let selectorGroupName = selector.includes(":-") || selector.includes("::-") || selector.includes(":has") ? selector : "__DEFAULT__";
                         var _selectorGroups_get;
                         let selectors = (_selectorGroups_get = selectorGroups.get(selectorGroupName)) !== null && _selectorGroups_get !== void 0 ? _selectorGroups_get : new Set();
                         selectorGroups.set(selectorGroupName, selectors);
                         selectors.add(selector);
                     }
                 }
-                if ((0, _featureFlags.flagEnabled)(tailwindConfig, 'optimizeUniversalDefaults')) {
+                if ((0, _featureFlags.flagEnabled)(tailwindConfig, "optimizeUniversalDefaults")) {
                     if (selectorGroups.size === 0) {
                         universal.remove();
                         continue;
@@ -139,9 +141,9 @@ function resolveDefaultsAtRules({ tailwindConfig }) {
         } else if (universals.size) {
             let universalRule = _postcss.default.rule({
                 selectors: [
-                    '*',
-                    '::before',
-                    '::after'
+                    "*",
+                    "::before",
+                    "::after"
                 ]
             });
             for (let universal of universals){
@@ -156,7 +158,7 @@ function resolveDefaultsAtRules({ tailwindConfig }) {
             }
             let backdropRule = universalRule.clone({
                 selectors: [
-                    '::backdrop'
+                    "::backdrop"
                 ]
             });
             universalRule.after(backdropRule);