tailwindcss 0.0.0-insiders.c3cf064 → 0.0.0-insiders.c44dd7b

package/CHANGELOG.md

@@ -9,6 +9,14 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ### Fixed
 
+- Fix candidate extractor regression ([#8558](https://github.com/tailwindlabs/tailwindcss/pull/8558))
+- Split `::backdrop`` into separate defaults group ([#8567](https://github.com/tailwindlabs/tailwindcss/pull/8567))
+- Fix postcss plugin type ([#8564](https://github.com/tailwindlabs/tailwindcss/pull/8564))
+
+## [3.1.0] - 2022-06-08
+
+### Fixed
+
 - Types: allow for arbitrary theme values (for 3rd party plugins) ([#7926](https://github.com/tailwindlabs/tailwindcss/pull/7926))
 - Don’t split vars with numbers in them inside arbitrary values ([#8091](https://github.com/tailwindlabs/tailwindcss/pull/8091))
 - Require matching prefix when detecting negatives ([#8121](https://github.com/tailwindlabs/tailwindcss/pull/8121))
@@ -25,16 +33,20 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Create tailwind.config.cjs file in ESM package when running init ([#8363](https://github.com/tailwindlabs/tailwindcss/pull/8363))
 - Fix `matchVariants` that use at-rules and placeholders ([#8392](https://github.com/tailwindlabs/tailwindcss/pull/8392))
 - Improve types of the `tailwindcss/plugin` ([#8400](https://github.com/tailwindlabs/tailwindcss/pull/8400))
+- Allow returning parallel variants from `addVariant` or `matchVariant` callback functions ([#8455](https://github.com/tailwindlabs/tailwindcss/pull/8455))
+- Try using local `postcss` installation first in the CLI ([#8270](https://github.com/tailwindlabs/tailwindcss/pull/8270))
+- Allow default ring color to be a function ([#7587](https://github.com/tailwindlabs/tailwindcss/pull/7587))
+- Don't inherit `to` value from parent gradients ([#8489](https://github.com/tailwindlabs/tailwindcss/pull/8489))
+- Remove process dependency from log functions ([#8530](https://github.com/tailwindlabs/tailwindcss/pull/8530))
+- Ensure we can use `@import 'tailwindcss/...'` without node_modules ([#8537](https://github.com/tailwindlabs/tailwindcss/pull/8537))
 
 ### Changed
 
-- Try using local `postcss` installation first in the CLI ([#8270](https://github.com/tailwindlabs/tailwindcss/pull/8270))
 - Only apply hover styles when supported (future) ([#8394](https://github.com/tailwindlabs/tailwindcss/pull/8394))
+- Respect default ring color opacity (future) ([#8448](https://github.com/tailwindlabs/tailwindcss/pull/8448), [3f4005e](https://github.com/tailwindlabs/tailwindcss/commit/3f4005e833445f7549219eb5ae89728cbb3a2630))
 
 ### Added
 
-- Allow default ring color to be a function ([#7587](https://github.com/tailwindlabs/tailwindcss/pull/7587))
-- Add `rgb` and `hsl` color helpers for CSS variables ([#7665](https://github.com/tailwindlabs/tailwindcss/pull/7665))
 - Support PostCSS `Document` nodes ([#7291](https://github.com/tailwindlabs/tailwindcss/pull/7291))
 - Add `text-start` and `text-end` utilities ([#6656](https://github.com/tailwindlabs/tailwindcss/pull/6656))
 - Support customizing class name when using `darkMode: 'class'` ([#5800](https://github.com/tailwindlabs/tailwindcss/pull/5800))
@@ -42,13 +54,16 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Add new `border-spacing` utilities ([#7102](https://github.com/tailwindlabs/tailwindcss/pull/7102))
 - Add `enabled` variant ([#7905](https://github.com/tailwindlabs/tailwindcss/pull/7905))
 - Add TypeScript types for the `tailwind.config.js` file ([#7891](https://github.com/tailwindlabs/tailwindcss/pull/7891))
-- Add `backdrop` variant ([#7924](https://github.com/tailwindlabs/tailwindcss/pull/7924))
+- Add `backdrop` variant ([#7924](https://github.com/tailwindlabs/tailwindcss/pull/7924), [#8526](https://github.com/tailwindlabs/tailwindcss/pull/8526))
 - Add `grid-flow-dense` utility ([#8193](https://github.com/tailwindlabs/tailwindcss/pull/8193))
 - Add `mix-blend-plus-lighter` utility ([#8288](https://github.com/tailwindlabs/tailwindcss/pull/8288))
 - Add arbitrary variants ([#8299](https://github.com/tailwindlabs/tailwindcss/pull/8299))
-- Add `matchVariant` API ([#8310](https://github.com/tailwindlabs/tailwindcss/pull/8310))
+- Add experimental `matchVariant` API ([#8310](https://github.com/tailwindlabs/tailwindcss/pull/8310), [34fd0fb8](https://github.com/tailwindlabs/tailwindcss/commit/34fd0fb82aa574cddc5c7aa3ad7d1af5e3735e5d))
 - Add `prefers-contrast` media query variants ([#8410](https://github.com/tailwindlabs/tailwindcss/pull/8410))
-- Experimental support for variant grouping ([#8405](https://github.com/tailwindlabs/tailwindcss/pull/8405))
+- Add opacity support when referencing colors with `theme` function ([#8416](https://github.com/tailwindlabs/tailwindcss/pull/8416))
+- Add `postcss-import` support to the CLI ([#8437](https://github.com/tailwindlabs/tailwindcss/pull/8437))
+- Add `optional` variant ([#8486](https://github.com/tailwindlabs/tailwindcss/pull/8486))
+- Add `<alpha-value>` placeholder support for custom colors ([#8501](https://github.com/tailwindlabs/tailwindcss/pull/8501))
 
 ## [3.0.24] - 2022-04-12
 
@@ -1941,7 +1956,8 @@ No release notes
 
 - Everything!
 
-[unreleased]: https://github.com/tailwindlabs/tailwindcss/compare/v3.0.24...HEAD
+[unreleased]: https://github.com/tailwindlabs/tailwindcss/compare/v3.1.0...HEAD
+[3.1.0]: https://github.com/tailwindlabs/tailwindcss/compare/v3.0.24...v3.1.0
 [3.0.24]: https://github.com/tailwindlabs/tailwindcss/compare/v3.0.23...v3.0.24
 [3.0.23]: https://github.com/tailwindlabs/tailwindcss/compare/v3.0.22...v3.0.23
 [3.0.22]: https://github.com/tailwindlabs/tailwindcss/compare/v3.0.21...v3.0.22

package/lib/cli-peer-dependencies.js

@@ -3,11 +3,15 @@ Object.defineProperty(exports, "__esModule", {
     value: true
 });
 exports.lazyPostcss = lazyPostcss;
+exports.lazyPostcssImport = lazyPostcssImport;
 exports.lazyAutoprefixer = lazyAutoprefixer;
 exports.lazyCssnano = lazyCssnano;
 function lazyPostcss() {
     return require("postcss");
 }
+function lazyPostcssImport() {
+    return require("postcss-import");
+}
 function lazyAutoprefixer() {
     return require("autoprefixer");
 }

package/lib/cli.js

@@ -72,10 +72,8 @@ function drainStdin() {
         process.stdin.on("data", (chunk)=>{
             result += chunk;
         });
-        process.stdin.on("end", ()=>resolve(result)
-        );
-        process.stdin.on("error", (err)=>reject(err)
-        );
+        process.stdin.on("end", ()=>resolve(result));
+        process.stdin.on("error", (err)=>reject(err));
     });
 }
 function help({ message , usage , commands: commands1 , options  }) {
@@ -166,10 +164,6 @@ let commands = {
                 type: Boolean,
                 description: `Initialize a \`${configs.postcss}\` file`
             },
-            "--types": {
-                type: Boolean,
-                description: `Add TypeScript types for the \`${configs.tailwind}\` file`
-            },
             "-f": "--full",
             "-p": "--postcss"
         }
@@ -233,16 +227,13 @@ let sharedFlags = {
     },
     "-h": "--help"
 };
-if (process.stdout.isTTY /* Detect redirecting output to a file */  && (process.argv[2] === undefined || process.argv.slice(2).every((flag)=>sharedFlags[flag] !== undefined
-))) {
+if (process.stdout.isTTY /* Detect redirecting output to a file */  && (process.argv[2] === undefined || process.argv.slice(2).every((flag)=>sharedFlags[flag] !== undefined))) {
     help({
         usage: [
             "tailwindcss [--input input.css] [--output output.css] [--watch] [options...]",
-            "tailwindcss init [--full] [--postcss] [--types] [options...]", 
+            "tailwindcss init [--full] [--postcss] [options...]", 
         ],
-        commands: Object.keys(commands).filter((command2)=>command2 !== "build"
-        ).map((command3)=>`${command3} [options]`
-        ),
+        commands: Object.keys(commands).filter((command2)=>command2 !== "build").map((command3)=>`${command3} [options]`),
         options: {
             ...commands.build.args,
             ...sharedFlags
@@ -250,8 +241,7 @@ if (process.stdout.isTTY /* Detect redirecting output to a file */  && (process.
     });
     process.exit(0);
 }
-let command = ((arg = "")=>arg.startsWith("-") ? undefined : arg
-)(process.argv[2]) || "build";
+let command = ((arg = "")=>arg.startsWith("-") ? undefined : arg)(process.argv[2]) || "build";
 if (commands[command] === undefined) {
     if (_fs.default.existsSync(_path.default.resolve(command))) {
         // TODO: Deprecate this in future versions
@@ -263,9 +253,7 @@ if (commands[command] === undefined) {
             usage: [
                 "tailwindcss <command> [options]"
             ],
-            commands: Object.keys(commands).filter((command4)=>command4 !== "build"
-            ).map((command5)=>`${command5} [options]`
-            ),
+            commands: Object.keys(commands).filter((command4)=>command4 !== "build").map((command5)=>`${command5} [options]`),
             options: sharedFlags
         });
         process.exit(1);
@@ -284,8 +272,7 @@ let args = (()=>{
         }).map(([key, value])=>[
                 key,
                 typeof value === "object" ? value.type : value
-            ]
-        )), {
+            ])), {
             permissive: true
         });
         // Manual parsing of flags to allow for special flags like oneOf(Boolean, String)
@@ -357,10 +344,6 @@ function init() {
         messages.push(`${_path.default.basename(tailwindConfigLocation)} already exists.`);
     } else {
         let stubFile = _fs.default.readFileSync(args["--full"] ? _path.default.resolve(__dirname, "../stubs/defaultConfig.stub.js") : _path.default.resolve(__dirname, "../stubs/simpleConfig.stub.js"), "utf8");
-        if (args["--types"]) {
-            let typesHeading = "/** @type {import('tailwindcss/types').Config} */";
-            stubFile = stubFile.replace(`module.exports = `, `${typesHeading}\nconst config = `) + "\nmodule.exports = config";
-        }
         // Change colors import
         stubFile = stubFile.replace("../colors", "tailwindcss/colors");
         _fs.default.writeFileSync(tailwindConfigLocation, stubFile, "utf8");
@@ -406,8 +389,7 @@ async function build() {
         console.error(`Specified config file ${args["--config"]} does not exist.`);
         process.exit(9);
     }
-    let configPath = args["--config"] ? args["--config"] : ((defaultPath)=>_fs.default.existsSync(defaultPath) ? defaultPath : null
-    )(_path.default.resolve(`./${configs.tailwind}`));
+    let configPath = args["--config"] ? args["--config"] : ((defaultPath)=>_fs.default.existsSync(defaultPath) ? defaultPath : null)(_path.default.resolve(`./${configs.tailwind}`));
     async function loadPostCssPlugins() {
         let customPostCssPath = typeof args["--postcss"] === "string" ? args["--postcss"] : undefined;
         let config1 = customPostCssPath ? await (async ()=>{
@@ -478,8 +460,7 @@ async function build() {
             // like an object it's probably a raw content object. But this object
             // is not watchable, so let's remove it.
             return typeof file === "string";
-        }).map((glob)=>(0, _normalizePath).default(glob)
-        );
+        }).map((glob)=>(0, _normalizePath).default(glob));
     }
     function extractRawContent(config) {
         return config.content.files.filter((file)=>{
@@ -522,10 +503,39 @@ async function build() {
             };
         };
         tailwindPlugin.postcss = true;
+        let IMPORT_COMMENT = "__TAILWIND_RESTORE_IMPORT__: ";
         let [beforePlugins, afterPlugins, postcssOptions] = includePostCss ? await loadPostCssPlugins() : [
+            [
+                (root)=>{
+                    root.walkAtRules("import", (rule)=>{
+                        if (rule.params.slice(1).startsWith("tailwindcss/")) {
+                            rule.after(postcss.comment({
+                                text: IMPORT_COMMENT + rule.params
+                            }));
+                            rule.remove();
+                        }
+                    });
+                },
+                (()=>{
+                    try {
+                        return require("postcss-import");
+                    } catch  {}
+                    return (0, _indexJs).lazyPostcssImport();
+                })(),
+                (root)=>{
+                    root.walkComments((rule)=>{
+                        if (rule.text.startsWith(IMPORT_COMMENT)) {
+                            rule.after(postcss.atRule({
+                                name: "import",
+                                params: rule.text.replace(IMPORT_COMMENT, "")
+                            }));
+                            rule.remove();
+                        }
+                    });
+                }, 
+            ],
             [],
-            [],
-            {}
+            {}, 
         ];
         let plugins = [
             ...beforePlugins,
@@ -561,13 +571,11 @@ async function build() {
             let start = process.hrtime.bigint();
             return Promise.resolve().then(()=>output ? _fs.default.promises.mkdir(_path.default.dirname(output), {
                     recursive: true
-                }) : null
-            ).then(()=>processor.process(css, {
+                }) : null).then(()=>processor.process(css, {
                     ...postcssOptions,
                     from: input,
                     to: output
-                })
-            ).then((result)=>{
+                })).then((result)=>{
                 if (!output) {
                     return process.stdout.write(result.css);
                 }
@@ -578,7 +586,7 @@ async function build() {
             }).then(()=>{
                 let end = process.hrtime.bigint();
                 console.error();
-                console.error("Done in", (end - start) / BigInt(1000000) + "ms.");
+                console.error("Done in", (end - start) / BigInt(1e6) + "ms.");
             });
         }
         let css1 = await (()=>{
@@ -607,8 +615,7 @@ async function build() {
                 delete require.cache[require.resolve(file1)];
             }
             if (configPath) {
-                configDependencies = (0, _getModuleDependencies).default(configPath).map(({ file  })=>file
-                );
+                configDependencies = (0, _getModuleDependencies).default(configPath).map(({ file  })=>file);
                 for (let dependency of configDependencies){
                     contextDependencies.add(dependency);
                 }
@@ -683,12 +690,10 @@ async function build() {
                 let start = process.hrtime.bigint();
                 return Promise.resolve().then(()=>output ? _fs.default.promises.mkdir(_path.default.dirname(output), {
                         recursive: true
-                    }) : null
-                ).then(()=>processor.process(css, {
+                    }) : null).then(()=>processor.process(css, {
                         from: input,
                         to: output
-                    })
-                ).then(async (result)=>{
+                    })).then(async (result)=>{
                     for (let message of result.messages){
                         if (message.type === "dependency") {
                             contextDependencies.add(message.file);
@@ -706,7 +711,7 @@ async function build() {
                     ].filter(Boolean));
                 }).then(()=>{
                     let end = process.hrtime.bigint();
-                    console.error("Done in", (end - start) / BigInt(1000000) + "ms.");
+                    console.error("Done in", (end - start) / BigInt(1e6) + "ms.");
                 }).catch((err)=>{
                     if (err.name === "CssSyntaxError") {
                         console.error(err.toString());
@@ -788,9 +793,10 @@ async function build() {
         });
     }
     if (shouldWatch) {
-        /* Abort the watcher if stdin is closed to avoid zombie processes */ process.stdin.on("end", ()=>process.exit(0)
-        );
-        process.stdin.resume();
+        /* Abort the watcher if stdin is closed to avoid zombie processes */ if (process.stdin.isTTY) {
+            process.stdin.on("end", ()=>process.exit(0));
+            process.stdin.resume();
+        }
         startWatcher();
     } else {
         buildOnce();

package/lib/corePlugins.js

@@ -25,26 +25,44 @@ function _interopRequireDefault(obj) {
         default: obj
     };
 }
+function _getRequireWildcardCache() {
+    if (typeof WeakMap !== "function") return null;
+    var cache = new WeakMap();
+    _getRequireWildcardCache = function() {
+        return cache;
+    };
+    return cache;
+}
 function _interopRequireWildcard(obj) {
     if (obj && obj.__esModule) {
         return obj;
-    } else {
-        var newObj = {};
-        if (obj != null) {
-            for(var key in obj){
-                if (Object.prototype.hasOwnProperty.call(obj, key)) {
-                    var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {};
-                    if (desc.get || desc.set) {
-                        Object.defineProperty(newObj, key, desc);
-                    } else {
-                        newObj[key] = obj[key];
-                    }
-                }
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache();
+    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)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
             }
         }
-        newObj.default = obj;
-        return newObj;
     }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
 }
 let variantPlugins = {
     pseudoElementVariants: ({ addVariant  })=>{
@@ -152,6 +170,7 @@ let variantPlugins = {
             "indeterminate",
             "placeholder-shown",
             "autofill",
+            "optional",
             "required",
             "valid",
             "invalid",
@@ -174,8 +193,7 @@ let variantPlugins = {
         ].map((variant)=>Array.isArray(variant) ? variant : [
                 variant,
                 `&:${variant}`
-            ]
-        );
+            ]);
         for (let [variantName, state] of pseudoVariants){
             addVariant(variantName, (ctx)=>{
                 let result = typeof state === "function" ? state(ctx) : state;
@@ -292,10 +310,7 @@ let corePlugins = {
     },
     container: (()=>{
         function extractMinWidths(breakpoints = []) {
-            return breakpoints.flatMap((breakpoint1)=>breakpoint1.values.map((breakpoint)=>breakpoint.min
-                )
-            ).filter((v)=>v !== undefined
-            );
+            return breakpoints.flatMap((breakpoint1)=>breakpoint1.values.map((breakpoint)=>breakpoint.min)).filter((v)=>v !== undefined);
         }
         function mapMinWidthsToPadding(minWidths, screens, paddings) {
             if (typeof paddings === "undefined") {
@@ -337,8 +352,7 @@ let corePlugins = {
             let minWidths = extractMinWidths(screens);
             let paddings = mapMinWidthsToPadding(minWidths, screens, theme("container.padding"));
             let generatePaddingFor = (minWidth)=>{
-                let paddingConfig = paddings.find((padding)=>padding.minWidth === minWidth
-                );
+                let paddingConfig = paddings.find((padding)=>padding.minWidth === minWidth);
                 if (!paddingConfig) {
                     return {};
                 }
@@ -347,16 +361,14 @@ let corePlugins = {
                     paddingLeft: paddingConfig.padding
                 };
             };
-            let atRules = Array.from(new Set(minWidths.slice().sort((a, z)=>parseInt(a) - parseInt(z)
-            ))).map((minWidth)=>({
+            let atRules = Array.from(new Set(minWidths.slice().sort((a, z)=>parseInt(a) - parseInt(z)))).map((minWidth)=>({
                     [`@media (min-width: ${minWidth})`]: {
                         ".container": {
                             "max-width": minWidth,
                             ...generatePaddingFor(minWidth)
                         }
                     }
-                })
-            );
+                }));
             addComponents([
                 {
                     ".container": Object.assign({
@@ -1033,8 +1045,7 @@ let corePlugins = {
         });
     },
     animation: ({ matchUtilities , theme , config  })=>{
-        let prefixName = (name)=>`${config("prefix")}${(0, _escapeClassName).default(name)}`
-        ;
+        let prefixName = (name)=>`${config("prefix")}${(0, _escapeClassName).default(name)}`;
         var ref;
         let keyframes = Object.fromEntries(Object.entries((ref = theme("keyframes")) !== null && ref !== void 0 ? ref : {}).map(([key, value])=>{
             return [
@@ -1048,8 +1059,7 @@ let corePlugins = {
             animate: (value1)=>{
                 let animations = (0, _parseAnimationValue).default(value1);
                 return [
-                    ...animations.flatMap((animation)=>keyframes[animation.name]
-                    ),
+                    ...animations.flatMap((animation)=>keyframes[animation.name]),
                     {
                         animation: animations.map(({ name , value  })=>{
                             if (name === undefined || keyframes[name] === undefined) {
@@ -1749,8 +1759,7 @@ let corePlugins = {
                 };
             }
         }, {
-            values: (({ DEFAULT: _ , ...colors })=>colors
-            )((0, _flattenColorPalette).default(theme("divideColor"))),
+            values: (({ DEFAULT: _ , ...colors })=>colors)((0, _flattenColorPalette).default(theme("divideColor"))),
             type: "color"
         });
     },
@@ -2152,8 +2161,7 @@ let corePlugins = {
                 });
             }
         }, {
-            values: (({ DEFAULT: _ , ...colors })=>colors
-            )((0, _flattenColorPalette).default(theme("borderColor"))),
+            values: (({ DEFAULT: _ , ...colors })=>colors)((0, _flattenColorPalette).default(theme("borderColor"))),
             type: [
                 "color"
             ]
@@ -2192,8 +2200,7 @@ let corePlugins = {
                 });
             }
         }, {
-            values: (({ DEFAULT: _ , ...colors })=>colors
-            )((0, _flattenColorPalette).default(theme("borderColor"))),
+            values: (({ DEFAULT: _ , ...colors })=>colors)((0, _flattenColorPalette).default(theme("borderColor"))),
             type: "color"
         });
         matchUtilities({
@@ -2246,8 +2253,7 @@ let corePlugins = {
                 });
             }
         }, {
-            values: (({ DEFAULT: _ , ...colors })=>colors
-            )((0, _flattenColorPalette).default(theme("borderColor"))),
+            values: (({ DEFAULT: _ , ...colors })=>colors)((0, _flattenColorPalette).default(theme("borderColor"))),
             type: "color"
         });
     },
@@ -2317,7 +2323,8 @@ let corePlugins = {
                     let transparentToValue = transparentTo(value);
                     return {
                         "--tw-gradient-from": (0, _toColorValue).default(value, "from"),
-                        "--tw-gradient-stops": `var(--tw-gradient-from), var(--tw-gradient-to, ${transparentToValue})`
+                        "--tw-gradient-to": transparentToValue,
+                        "--tw-gradient-stops": `var(--tw-gradient-from), var(--tw-gradient-to)`
                     };
                 }
             }, options);
@@ -2325,7 +2332,8 @@ let corePlugins = {
                 via: (value)=>{
                     let transparentToValue = transparentTo(value);
                     return {
-                        "--tw-gradient-stops": `var(--tw-gradient-from), ${(0, _toColorValue).default(value, "via")}, var(--tw-gradient-to, ${transparentToValue})`
+                        "--tw-gradient-to": transparentToValue,
+                        "--tw-gradient-stops": `var(--tw-gradient-from), ${(0, _toColorValue).default(value, "via")}, var(--tw-gradient-to)`
                     };
                 }
             }, options);
@@ -3202,10 +3210,18 @@ let corePlugins = {
             ]
         });
     },
-    ringWidth: ({ matchUtilities , addDefaults , addUtilities , theme  })=>{
-        var ref;
-        let ringOpacityDefault = theme("ringOpacity.DEFAULT", "0.5");
-        let ringColorDefault = (0, _withAlphaVariable).withAlphaValue((ref = theme("ringColor")) === null || ref === void 0 ? void 0 : ref.DEFAULT, ringOpacityDefault, `rgb(147 197 253 / ${ringOpacityDefault})`);
+    ringWidth: ({ matchUtilities , addDefaults , addUtilities , theme , config  })=>{
+        let ringColorDefault = (()=>{
+            var ref, ref1;
+            if ((0, _featureFlags).flagEnabled(config(), "respectDefaultRingColorOpacity")) {
+                return theme("ringColor.DEFAULT");
+            }
+            let ringOpacityDefault = theme("ringOpacity.DEFAULT", "0.5");
+            if (!((ref = theme("ringColor")) === null || ref === void 0 ? void 0 : ref.DEFAULT)) {
+                return `rgb(147 197 253 / ${ringOpacityDefault})`;
+            }
+            return (0, _withAlphaVariable).withAlphaValue((ref1 = theme("ringColor")) === null || ref1 === void 0 ? void 0 : ref1.DEFAULT, ringOpacityDefault, `rgb(147 197 253 / ${ringOpacityDefault})`);
+        })();
         addDefaults("ring-width", {
             "--tw-ring-inset": " ",
             "--tw-ring-offset-width": theme("ringOffsetWidth.DEFAULT", "0px"),
@@ -3255,21 +3271,23 @@ let corePlugins = {
                 });
             }
         }, {
-            values: Object.fromEntries(Object.entries((0, _flattenColorPalette).default(theme("ringColor"))).filter(([modifier])=>modifier !== "DEFAULT"
-            )),
+            values: Object.fromEntries(Object.entries((0, _flattenColorPalette).default(theme("ringColor"))).filter(([modifier])=>modifier !== "DEFAULT")),
             type: "color"
         });
     },
-    ringOpacity: (0, _createUtilityPlugin).default("ringOpacity", [
-        [
-            "ring-opacity",
+    ringOpacity: (helpers)=>{
+        let { config  } = helpers;
+        return (0, _createUtilityPlugin).default("ringOpacity", [
             [
-                "--tw-ring-opacity"
+                "ring-opacity",
+                [
+                    "--tw-ring-opacity"
+                ]
             ]
-        ]
-    ], {
-        filterDefault: true
-    }),
+        ], {
+            filterDefault: !(0, _featureFlags).flagEnabled(config(), "respectDefaultRingColorOpacity")
+        })(helpers);
+    },
     ringOffsetWidth: (0, _createUtilityPlugin).default("ringOffsetWidth", [
         [
             "ring-offset",
@@ -3335,8 +3353,7 @@ let corePlugins = {
         matchUtilities({
             "drop-shadow": (value)=>{
                 return {
-                    "--tw-drop-shadow": Array.isArray(value) ? value.map((v)=>`drop-shadow(${v})`
-                    ).join(" ") : `drop-shadow(${value})`,
+                    "--tw-drop-shadow": Array.isArray(value) ? value.map((v)=>`drop-shadow(${v})`).join(" ") : `drop-shadow(${value})`,
                     "@defaults filter": {},
                     filter: cssFilterValue
                 };

package/lib/featureFlags.js

@@ -17,11 +17,12 @@ let defaults = {
 };
 let featureFlags = {
     future: [
-        "hoverOnlyWhenSupported"
+        "hoverOnlyWhenSupported",
+        "respectDefaultRingColorOpacity"
     ],
     experimental: [
         "optimizeUniversalDefaults",
-        "variantGrouping"
+        "matchVariant" /* , 'variantGrouping' */ 
     ]
 };
 function flagEnabled(config, flag) {
@@ -42,16 +43,14 @@ function experimentalFlagsEnabled(config) {
         return featureFlags.experimental;
     }
     var ref;
-    return Object.keys((ref = config === null || config === void 0 ? void 0 : config.experimental) !== null && ref !== void 0 ? ref : {}).filter((flag)=>featureFlags.experimental.includes(flag) && config.experimental[flag]
-    );
+    return Object.keys((ref = config === null || config === void 0 ? void 0 : config.experimental) !== null && ref !== void 0 ? ref : {}).filter((flag)=>featureFlags.experimental.includes(flag) && config.experimental[flag]);
 }
 function issueFlagNotices(config) {
     if (process.env.JEST_WORKER_ID !== undefined) {
         return;
     }
     if (experimentalFlagsEnabled(config).length > 0) {
-        let changes = experimentalFlagsEnabled(config).map((s)=>_picocolors.default.yellow(s)
-        ).join(", ");
+        let changes = experimentalFlagsEnabled(config).map((s)=>_picocolors.default.yellow(s)).join(", ");
         _log.default.warn("experimental-flags-enabled", [
             `You have enabled experimental features: ${changes}`,
             "Experimental features in Tailwind CSS are not covered by semver, may introduce breaking changes, and can change at any time.", 

package/lib/index.js

@@ -19,8 +19,7 @@ module.exports = function tailwindcss(configOrPath) {
             function(root, result) {
                 let context = (0, _setupTrackingContext).default(configOrPath);
                 if (root.type === "document") {
-                    let roots = root.nodes.filter((node)=>node.type === "root"
-                    );
+                    let roots = root.nodes.filter((node)=>node.type === "root");
                     for (const root1 of roots){
                         if (root1.type === "root") {
                             (0, _processTailwindFeatures).default(context)(root1, result);