tailwindcss 0.0.0-oxide-insiders.4d2d870 → 0.0.0-oxide-insiders.266f029

package/lib/lib/expandApplyAtRules.js

@@ -10,6 +10,7 @@ const _postcss = /*#__PURE__*/ _interopRequireDefault(require("postcss"));
 const _postcssSelectorParser = /*#__PURE__*/ _interopRequireDefault(require("postcss-selector-parser"));
 const _generateRules = require("./generateRules");
 const _escapeClassName = /*#__PURE__*/ _interopRequireDefault(require("../util/escapeClassName"));
+const _applyImportantSelector = require("../util/applyImportantSelector");
 function _interopRequireDefault(obj) {
     return obj && obj.__esModule ? obj : {
         default: obj
@@ -481,7 +482,7 @@ function processApply(root, context, localCache) {
                         rule.selector = replaceSelector(parentSelector, rule.selector, applyCandidate);
                         // And then re-add it if it was removed
                         if (importantSelector && parentSelector !== parent.selector) {
-                            rule.selector = `${importantSelector} ${rule.selector}`;
+                            rule.selector = (0, _applyImportantSelector.applyImportantSelector)(rule.selector, importantSelector);
                         }
                         rule.walkDecls((d)=>{
                             d.important = meta.important || important;

package/lib/lib/generateRules.js

@@ -28,6 +28,7 @@ const _setupContextUtils = require("./setupContextUtils");
 const _isSyntacticallyValidPropertyValue = /*#__PURE__*/ _interopRequireDefault(require("../util/isSyntacticallyValidPropertyValue"));
 const _splitAtTopLevelOnlyJs = require("../util/splitAtTopLevelOnly.js");
 const _featureFlags = require("../featureFlags");
+const _applyImportantSelector = require("../util/applyImportantSelector");
 function _interopRequireDefault(obj) {
     return obj && obj.__esModule ? obj : {
         default: obj
@@ -823,7 +824,7 @@ function getImportantStrategy(important) {
                 return;
             }
             rule.selectors = rule.selectors.map((selector)=>{
-                return `${important} ${selector}`;
+                return (0, _applyImportantSelector.applyImportantSelector)(selector, important);
             });
         };
     }

package/lib/util/applyImportantSelector.js

@@ -0,0 +1,22 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "applyImportantSelector", {
+    enumerable: true,
+    get: ()=>applyImportantSelector
+});
+const _splitAtTopLevelOnly = require("./splitAtTopLevelOnly");
+function applyImportantSelector(selector, important) {
+    let matches = /^(.*?)(:before|:after|::[\w-]+)(\)*)$/g.exec(selector);
+    if (!matches) return `${important} ${wrapWithIs(selector)}`;
+    let [, before, pseudo, brackets] = matches;
+    return `${important} ${wrapWithIs(before + brackets)}${pseudo}`;
+}
+function wrapWithIs(selector) {
+    let parts = (0, _splitAtTopLevelOnly.splitAtTopLevelOnly)(selector, " ");
+    if (parts.length === 1 && parts[0].startsWith(":is(") && parts[0].endsWith(")")) {
+        return selector;
+    }
+    return `:is(${selector})`;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tailwindcss",
-  "version": "0.0.0-oxide-insiders.4d2d870",
+  "version": "0.0.0-oxide-insiders.266f029",
   "description": "A utility-first CSS framework for rapidly building custom user interfaces.",
   "license": "MIT",
   "main": "lib/index.js",
@@ -70,7 +70,7 @@
     "postcss": "^8.0.9"
   },
   "dependencies": {
-    "@tailwindcss/oxide": "0.0.0-oxide-insiders.4d2d870",
+    "@tailwindcss/oxide": "0.0.0-oxide-insiders.266f029",
     "arg": "^5.0.2",
     "browserslist": "^4.21.5",
     "chokidar": "^3.5.3",

package/src/lib/expandApplyAtRules.js

@@ -3,6 +3,7 @@ import parser from 'postcss-selector-parser'
 
 import { resolveMatches } from './generateRules'
 import escapeClassName from '../util/escapeClassName'
+import { applyImportantSelector } from '../util/applyImportantSelector'
 
 /** @typedef {Map<string, [any, import('postcss').Rule[]]>} ApplyCache */
 
@@ -555,7 +556,7 @@ function processApply(root, context, localCache) {
 
             // And then re-add it if it was removed
             if (importantSelector && parentSelector !== parent.selector) {
-              rule.selector = `${importantSelector} ${rule.selector}`
+              rule.selector = applyImportantSelector(rule.selector, importantSelector)
             }
 
             rule.walkDecls((d) => {

package/src/lib/generateRules.js

@@ -17,6 +17,7 @@ import { isValidVariantFormatString, parseVariant } from './setupContextUtils'
 import isValidArbitraryValue from '../util/isSyntacticallyValidPropertyValue'
 import { splitAtTopLevelOnly } from '../util/splitAtTopLevelOnly.js'
 import { flagEnabled } from '../featureFlags'
+import { applyImportantSelector } from '../util/applyImportantSelector'
 
 let classNameParser = selectorParser((selectors) => {
   return selectors.first.filter(({ type }) => type === 'class').pop().value
@@ -868,7 +869,7 @@ function getImportantStrategy(important) {
       }
 
       rule.selectors = rule.selectors.map((selector) => {
-        return `${important} ${selector}`
+        return applyImportantSelector(selector, important)
       })
     }
   }

package/src/util/applyImportantSelector.js

@@ -0,0 +1,19 @@
+import { splitAtTopLevelOnly } from './splitAtTopLevelOnly'
+
+export function applyImportantSelector(selector, important) {
+  let matches = /^(.*?)(:before|:after|::[\w-]+)(\)*)$/g.exec(selector)
+  if (!matches) return `${important} ${wrapWithIs(selector)}`
+
+  let [, before, pseudo, brackets] = matches
+  return `${important} ${wrapWithIs(before + brackets)}${pseudo}`
+}
+
+function wrapWithIs(selector) {
+  let parts = splitAtTopLevelOnly(selector, ' ')
+
+  if (parts.length === 1 && parts[0].startsWith(':is(') && parts[0].endsWith(')')) {
+    return selector
+  }
+
+  return `:is(${selector})`
+}