tailwindcss 3.2.7 → 3.3.1

package/CHANGELOG.md

@@ -9,6 +9,51 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 - Nothing yet!
 
+## [3.3.1] - 2023-03-30
+
+### Fixed
+
+- Try resolving `config.default` before `config` to ensure the config file is resolved correctly ([#10898](https://github.com/tailwindlabs/tailwindcss/pull/10898))
+- Pull pseudo elements outside of `:is` and `:has` when using `@apply` ([#10903](https://github.com/tailwindlabs/tailwindcss/pull/10903))
+- Update the types for the `safelist` config ([#10901](https://github.com/tailwindlabs/tailwindcss/pull/10901))
+- Fix `@tailwindcss/line-clamp` warning ([#10915](https://github.com/tailwindlabs/tailwindcss/pull/10915), [#10919](https://github.com/tailwindlabs/tailwindcss/pull/10919))
+- Fix `process` is not defined error ([#10919](https://github.com/tailwindlabs/tailwindcss/pull/10919))
+
+## [3.3.0] - 2023-03-27
+
+### Added
+
+- Support ESM and TypeScript config files ([#10785](https://github.com/tailwindlabs/tailwindcss/pull/10785))
+- Extend default color palette with new 950 shades ([#10879](https://github.com/tailwindlabs/tailwindcss/pull/10879))
+- Add `line-height` modifier support to `font-size` utilities ([#9875](https://github.com/tailwindlabs/tailwindcss/pull/9875))
+- Add support for using variables as arbitrary values without `var(...)` ([#9880](https://github.com/tailwindlabs/tailwindcss/pull/9880), [#9962](https://github.com/tailwindlabs/tailwindcss/pull/9962))
+- Add logical properties support for inline direction ([#10166](https://github.com/tailwindlabs/tailwindcss/pull/10166))
+- Add `hyphens` utilities ([#10071](https://github.com/tailwindlabs/tailwindcss/pull/10071))
+- Add `from-{position}`, `via-{position}` and `to-{position}` utilities ([#10886](https://github.com/tailwindlabs/tailwindcss/pull/10886))
+- Add `list-style-image` utilities ([#10817](https://github.com/tailwindlabs/tailwindcss/pull/10817))
+- Add `caption-side` utilities ([#10470](https://github.com/tailwindlabs/tailwindcss/pull/10470))
+- Add `line-clamp` utilities from `@tailwindcss/line-clamp` to core ([#10768](https://github.com/tailwindlabs/tailwindcss/pull/10768), [#10876](https://github.com/tailwindlabs/tailwindcss/pull/10876), [#10862](https://github.com/tailwindlabs/tailwindcss/pull/10862))
+- Add `delay-0` and `duration-0` utilities ([#10294](https://github.com/tailwindlabs/tailwindcss/pull/10294))
+- Add `justify-normal` and `justify-stretch` utilities ([#10560](https://github.com/tailwindlabs/tailwindcss/pull/10560))
+- Add `content-normal` and `content-stretch` utilities ([#10645](https://github.com/tailwindlabs/tailwindcss/pull/10645))
+- Add `whitespace-break-spaces` utility ([#10729](https://github.com/tailwindlabs/tailwindcss/pull/10729))
+- Add support for configuring default `font-variation-settings` for a `font-family` ([#10034](https://github.com/tailwindlabs/tailwindcss/pull/10034), [#10515](https://github.com/tailwindlabs/tailwindcss/pull/10515))
+
+### Fixed
+
+- Disallow using multiple selectors in arbitrary variants ([#10655](https://github.com/tailwindlabs/tailwindcss/pull/10655))
+- Sort class lists deterministically for Prettier plugin ([#10672](https://github.com/tailwindlabs/tailwindcss/pull/10672))
+- Ensure CLI builds have a non-zero exit code on failure ([#10703](https://github.com/tailwindlabs/tailwindcss/pull/10703))
+- Ensure module dependencies for value `null`, is an empty `Set` ([#10877](https://github.com/tailwindlabs/tailwindcss/pull/10877))
+- Fix format assumption when resolving module dependencies ([#10878](https://github.com/tailwindlabs/tailwindcss/pull/10878))
+
+### Changed
+
+- Mark `rtl` and `ltr` variants as stable and remove warnings ([#10764](https://github.com/tailwindlabs/tailwindcss/pull/10764))
+- Use `inset` instead of `top`, `right`, `bottom`, and `left` properties ([#10765](https://github.com/tailwindlabs/tailwindcss/pull/10765))
+- Make `dark` and `rtl`/`ltr` variants insensitive to DOM order ([#10766](https://github.com/tailwindlabs/tailwindcss/pull/10766))
+- Use `:is` to make important selector option insensitive to DOM order ([#10835](https://github.com/tailwindlabs/tailwindcss/pull/10835))
+
 ## [3.2.7] - 2023-02-16
 
 ### Fixed
@@ -20,7 +65,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ### Fixed
 
-- drop oxide api shim ([add16364b4b1100e1af23ad1ca6900a0b53cbba0](https://github.com/tailwindlabs/tailwindcss/commit/add16364b4b1100e1af23ad1ca6900a0b53cbba0))
+- Fix installation failing with yarn and pnpm by dropping `oxide-api-shim` ([add1636](https://github.com/tailwindlabs/tailwindcss/commit/add16364b4b1100e1af23ad1ca6900a0b53cbba0))
 
 ## [3.2.5] - 2023-02-08
 
@@ -33,7 +78,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Cleanup unused `variantOrder` ([#9829](https://github.com/tailwindlabs/tailwindcss/pull/9829))
 - Fix `foo-[abc]/[def]` not being handled correctly ([#9866](https://github.com/tailwindlabs/tailwindcss/pull/9866))
 - Add container queries plugin to standalone CLI ([#9865](https://github.com/tailwindlabs/tailwindcss/pull/9865))
-- Support renaming of output files by `PostCSS` plugin. ([#9944](https://github.com/tailwindlabs/tailwindcss/pull/9944))
+- Support renaming of output files by PostCSS plugins in CLI ([#9944](https://github.com/tailwindlabs/tailwindcss/pull/9944))
 - Improve return value of `resolveConfig`, unwrap `ResolvableTo` ([#9972](https://github.com/tailwindlabs/tailwindcss/pull/9972))
 - Clip unbalanced brackets in arbitrary values ([#9973](https://github.com/tailwindlabs/tailwindcss/pull/9973))
 - Don’t reorder webkit scrollbar pseudo elements ([#9991](https://github.com/tailwindlabs/tailwindcss/pull/9991))
@@ -62,7 +107,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 - Alphabetize `theme` keys in default config ([#9953](https://github.com/tailwindlabs/tailwindcss/pull/9953))
 - Update esbuild to v17 ([#10368](https://github.com/tailwindlabs/tailwindcss/pull/10368))
-- Include `outline-color` in `transition` and `transition-colors` utilitires ([#10385](https://github.com/tailwindlabs/tailwindcss/pull/10385))
+- Include `outline-color` in `transition` and `transition-colors` utilities ([#10385](https://github.com/tailwindlabs/tailwindcss/pull/10385))
 
 ## [3.2.4] - 2022-11-11
 
@@ -104,7 +149,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Fix missing `supports` in types ([#9616](https://github.com/tailwindlabs/tailwindcss/pull/9616))
 - Fix missing PostCSS dependencies in the CLI ([#9617](https://github.com/tailwindlabs/tailwindcss/pull/9617))
 - Ensure `micromatch` is a proper CLI dependency ([#9620](https://github.com/tailwindlabs/tailwindcss/pull/9620))
-- Ensure modifier values exist when using a `modifiers` object for `matchVariant` ([ba6551db0f2726461371b4f3c6cd4c7090888504](https://github.com/tailwindlabs/tailwindcss/commit/ba6551db0f2726461371b4f3c6cd4c7090888504))
+- Ensure modifier values exist when using a `modifiers` object for `matchVariant` ([ba6551d](https://github.com/tailwindlabs/tailwindcss/commit/ba6551db0f2726461371b4f3c6cd4c7090888504))
 
 ## [3.2.0] - 2022-10-19
 
@@ -295,7 +340,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Split box shadows on top-level commas only ([#7479](https://github.com/tailwindlabs/tailwindcss/pull/7479))
 - Use local user CSS cache for `@apply` ([#7524](https://github.com/tailwindlabs/tailwindcss/pull/7524))
 - Invalidate context when main CSS changes ([#7626](https://github.com/tailwindlabs/tailwindcss/pull/7626))
-- Only add `!` to selector class matching template candidate when using important modifier with mutli-class selectors ([#7664](https://github.com/tailwindlabs/tailwindcss/pull/7664))
+- Only add `!` to selector class matching template candidate when using important modifier with multi-class selectors ([#7664](https://github.com/tailwindlabs/tailwindcss/pull/7664))
 - Correctly parse and prefix animation names with dots ([#7163](https://github.com/tailwindlabs/tailwindcss/pull/7163))
 - Fix extraction from template literal/function with array ([#7481](https://github.com/tailwindlabs/tailwindcss/pull/7481))
 - Don't output unparsable arbitrary values ([#7789](https://github.com/tailwindlabs/tailwindcss/pull/7789))
@@ -739,7 +784,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Remove outdated focus style fix in Preflight ([#4780](https://github.com/tailwindlabs/tailwindcss/pull/4780))
 - Enable `purge` if provided on the CLI ([#4772](https://github.com/tailwindlabs/tailwindcss/pull/4772))
 - JIT: Fix error when not using a config file with postcss-cli ([#4773](https://github.com/tailwindlabs/tailwindcss/pull/4773))
-- Fix issue with `resolveConfig` not being importable in Next.js pags ([#4725](https://github.com/tailwindlabs/tailwindcss/pull/4725))
+- Fix issue with `resolveConfig` not being importable in Next.js pages ([#4725](https://github.com/tailwindlabs/tailwindcss/pull/4725))
 
 ## [2.2.2] - 2021-06-18
 
@@ -874,7 +919,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ### Fixed
 
-- Fix issue with `@apply` not working as expected with `!important` inside an atrule ([#2824](https://github.com/tailwindlabs/tailwindcss/pull/2824))
+- Fix issue with `@apply` not working as expected with `!important` inside an at-rule ([#2824](https://github.com/tailwindlabs/tailwindcss/pull/2824))
 - Fix issue with `@apply` not working as expected with defined classes ([#2832](https://github.com/tailwindlabs/tailwindcss/pull/2832))
 - Fix memory leak, and broken `@apply` when splitting up files ([#3032](https://github.com/tailwindlabs/tailwindcss/pull/3032))
 
@@ -2176,7 +2221,9 @@ No release notes
 
 - Everything!
 
-[unreleased]: https://github.com/tailwindlabs/tailwindcss/compare/v3.2.7...HEAD
+[unreleased]: https://github.com/tailwindlabs/tailwindcss/compare/v3.3.1...HEAD
+[3.3.1]: https://github.com/tailwindlabs/tailwindcss/compare/v3.3.0...v3.3.1
+[3.3.0]: https://github.com/tailwindlabs/tailwindcss/compare/v3.2.7...v3.3.0
 [3.2.7]: https://github.com/tailwindlabs/tailwindcss/compare/v3.2.6...v3.2.7
 [3.2.6]: https://github.com/tailwindlabs/tailwindcss/compare/v3.2.5...v3.2.6
 [3.2.5]: https://github.com/tailwindlabs/tailwindcss/compare/v3.2.4...v3.2.5

package/lib/cli/build/index.js

@@ -9,13 +9,14 @@ Object.defineProperty(exports, "build", {
 });
 const _fs = /*#__PURE__*/ _interopRequireDefault(require("fs"));
 const _path = /*#__PURE__*/ _interopRequireDefault(require("path"));
+const _resolveConfigPathJs = require("../../util/resolveConfigPath.js");
 const _pluginJs = require("./plugin.js");
 function _interopRequireDefault(obj) {
     return obj && obj.__esModule ? obj : {
         default: obj
     };
 }
-async function build(args, configs) {
+async function build(args) {
     let input = args["--input"];
     let shouldWatch = args["--watch"];
     // TODO: Deprecate this in future versions
@@ -32,7 +33,7 @@ async function build(args, configs) {
         process.exit(9);
     }
     // TODO: Reference the @config path here if exists
-    let configPath = args["--config"] ? args["--config"] : ((defaultPath)=>_fs.default.existsSync(defaultPath) ? defaultPath : null)(_path.default.resolve(`./${configs.tailwind}`));
+    let configPath = args["--config"] ? args["--config"] : (0, _resolveConfigPathJs.resolveDefaultConfigPath)();
     let processor = await (0, _pluginJs.createProcessor)(args, configPath);
     if (shouldWatch) {
         // Abort the watcher if stdin is closed to avoid zombie processes
@@ -43,6 +44,9 @@ async function build(args, configs) {
         process.stdin.resume();
         await processor.watch();
     } else {
-        await processor.build();
+        await processor.build().catch((e)=>{
+            console.error(e);
+            process.exit(1);
+        });
     }
 }

package/lib/cli/build/plugin.js

@@ -20,12 +20,13 @@ const _deps = require("./deps");
 const _utils = require("./utils");
 const _sharedState = require("../../lib/sharedState");
 const _resolveConfigJs = /*#__PURE__*/ _interopRequireDefault(require("../../../resolveConfig.js"));
-const _getModuleDependenciesJs = /*#__PURE__*/ _interopRequireDefault(require("../../lib/getModuleDependencies.js"));
 const _contentJs = require("../../lib/content.js");
 const _watchingJs = require("./watching.js");
 const _fastGlob = /*#__PURE__*/ _interopRequireDefault(require("fast-glob"));
 const _findAtConfigPathJs = require("../../lib/findAtConfigPath.js");
 const _log = /*#__PURE__*/ _interopRequireDefault(require("../../util/log"));
+const _loadConfig = require("../../lib/load-config");
+const _getModuleDependencies = /*#__PURE__*/ _interopRequireDefault(require("../../lib/getModuleDependencies"));
 function _interopRequireDefault(obj) {
     return obj && obj.__esModule ? obj : {
         default: obj
@@ -109,7 +110,7 @@ let state = {
     /** @type {any} */ context: null,
     /** @type {ReturnType<typeof createWatcher> | null} */ watcher: null,
     /** @type {{content: string, extension: string}[]} */ changedContent: [],
-    configDependencies: new Set(),
+    /** @type {ReturnType<typeof load> | null} */ configBag: null,
     contextDependencies: new Set(),
     /** @type {import('../../lib/content.js').ContentPath[]} */ contentPaths: [],
     refreshContentPaths () {
@@ -127,32 +128,35 @@ let state = {
     },
     loadConfig (configPath, content) {
         if (this.watcher && configPath) {
-            this.refreshConfigDependencies(configPath);
+            this.refreshConfigDependencies();
         }
-        let config = configPath ? require(configPath) : {};
+        let config = (0, _loadConfig.loadConfig)(configPath);
+        let dependencies = (0, _getModuleDependencies.default)(configPath);
+        this.configBag = {
+            config,
+            dependencies,
+            dispose () {
+                for (let file of dependencies){
+                    delete require.cache[require.resolve(file)];
+                }
+            }
+        };
         // @ts-ignore
-        config = (0, _resolveConfigJs.default)(config, {
+        this.configBag.config = (0, _resolveConfigJs.default)(this.configBag.config, {
             content: {
                 files: []
             }
         });
         // Override content files if `--content` has been passed explicitly
         if ((content === null || content === void 0 ? void 0 : content.length) > 0) {
-            config.content.files = content;
+            this.configBag.config.content.files = content;
         }
-        return config;
+        return this.configBag.config;
     },
-    refreshConfigDependencies (configPath) {
+    refreshConfigDependencies () {
+        var _this_configBag;
         _sharedState.env.DEBUG && console.time("Module dependencies");
-        for (let file of this.configDependencies){
-            delete require.cache[require.resolve(file)];
-        }
-        if (configPath) {
-            let deps = (0, _getModuleDependenciesJs.default)(configPath).map(({ file  })=>file);
-            for (let dependency of deps){
-                this.configDependencies.add(dependency);
-            }
-        }
+        (_this_configBag = this.configBag) === null || _this_configBag === void 0 ? void 0 : _this_configBag.dispose();
         _sharedState.env.DEBUG && console.timeEnd("Module dependencies");
     },
     readContentPaths () {
@@ -326,7 +330,11 @@ async function createProcessor(args, cliConfigPath) {
             // If you fix it and then save the main CSS file so there's no error
             // The watcher will start watching the imported CSS files and will be
             // resilient to future errors.
-            console.error(err);
+            if (state.watcher) {
+                console.error(err);
+            } else {
+                return Promise.reject(err);
+            }
         });
     }
     /**
@@ -349,7 +357,8 @@ async function createProcessor(args, cliConfigPath) {
          * @param {{file: string, content(): Promise<string>, extension: string}[]} changes
          */ async rebuild (changes) {
                     let needsNewContext = changes.some((change)=>{
-                        return state.configDependencies.has(change.file) || state.contextDependencies.has(change.file);
+                        var _state_configBag;
+                        return ((_state_configBag = state.configBag) === null || _state_configBag === void 0 ? void 0 : _state_configBag.dependencies.has(change.file)) || state.contextDependencies.has(change.file);
                     });
                     if (needsNewContext) {
                         state.context = null;

package/lib/cli/build/watching.js

@@ -64,7 +64,9 @@ function createWatcher(args, { state , rebuild  }) {
         // Clear all pending rebuilds for the about-to-be-built files
         changes.forEach((change)=>pendingRebuilds.delete(change.file));
         // Resolve the promise even when the rebuild fails
-        return rebuild(changes).then(()=>{}, ()=>{});
+        return rebuild(changes).then(()=>{}, (e)=>{
+            console.error(e.toString());
+        });
     }
     /**
    *
@@ -171,7 +173,7 @@ function createWatcher(args, { state , rebuild  }) {
         fswatcher: watcher,
         refreshWatchedFiles () {
             watcher.add(Array.from(state.contextDependencies));
-            watcher.add(Array.from(state.configDependencies));
+            watcher.add(Array.from(state.configBag.dependencies));
             watcher.add(state.contentPatterns.all);
         }
     };

package/lib/cli/index.js

@@ -14,23 +14,6 @@ function _interopRequireDefault(obj) {
         default: obj
     };
 }
-function isESM() {
-    const pkgPath = _path.default.resolve("./package.json");
-    try {
-        let pkg = JSON.parse(_fs.default.readFileSync(pkgPath, "utf8"));
-        return pkg.type && pkg.type === "module";
-    } catch (err) {
-        return false;
-    }
-}
-let configs = isESM() ? {
-    tailwind: "tailwind.config.cjs",
-    postcss: "postcss.config.cjs"
-} : {
-    tailwind: "tailwind.config.js",
-    postcss: "postcss.config.js"
-};
-// ---
 function oneOf(...options) {
     return Object.assign((value = true)=>{
         for (let option of options){
@@ -48,13 +31,21 @@ let commands = {
     init: {
         run: _init.init,
         args: {
-            "--full": {
+            "--esm": {
                 type: Boolean,
-                description: `Initialize a full \`${configs.tailwind}\` file`
+                description: `Initialize configuration file as ESM`
+            },
+            "--ts": {
+                type: Boolean,
+                description: `Initialize configuration file as TypeScript`
             },
             "--postcss": {
                 type: Boolean,
-                description: `Initialize a \`${configs.postcss}\` file`
+                description: `Initialize a \`postcss.config.js\` file`
+            },
+            "--full": {
+                type: Boolean,
+                description: `Include the default values for all options in the generated configuration file`
             },
             "-f": "--full",
             "-p": "--postcss"
@@ -236,4 +227,4 @@ if (args["--help"]) {
     });
     process.exit(0);
 }
-run(args, configs);
+run(args);

package/lib/cli/init/index.js

@@ -14,25 +14,40 @@ function _interopRequireDefault(obj) {
         default: obj
     };
 }
-function init(args, configs) {
+function isESM() {
+    const pkgPath = _path.default.resolve("./package.json");
+    try {
+        let pkg = JSON.parse(_fs.default.readFileSync(pkgPath, "utf8"));
+        return pkg.type && pkg.type === "module";
+    } catch (err) {
+        return false;
+    }
+}
+function init(args) {
     let messages = [];
+    let isProjectESM = args["--ts"] || args["--esm"] || isESM();
+    let syntax = args["--ts"] ? "ts" : isProjectESM ? "js" : "cjs";
+    let extension = args["--ts"] ? "ts" : "js";
     var _args___;
-    let tailwindConfigLocation = _path.default.resolve((_args___ = args["_"][1]) !== null && _args___ !== void 0 ? _args___ : `./${configs.tailwind}`);
+    let tailwindConfigLocation = _path.default.resolve((_args___ = args["_"][1]) !== null && _args___ !== void 0 ? _args___ : `./tailwind.config.${extension}`);
     if (_fs.default.existsSync(tailwindConfigLocation)) {
         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");
+        let stubContentsFile = _fs.default.readFileSync(args["--full"] ? _path.default.resolve(__dirname, "../../../stubs/config.full.js") : _path.default.resolve(__dirname, "../../../stubs/config.simple.js"), "utf8");
+        let stubFile = _fs.default.readFileSync(_path.default.resolve(__dirname, `../../../stubs/tailwind.config.${syntax}`), "utf8");
         // Change colors import
-        stubFile = stubFile.replace("../colors", "tailwindcss/colors");
+        stubContentsFile = stubContentsFile.replace("../colors", "tailwindcss/colors");
+        // Replace contents of {ts,js,cjs} file with the stub {simple,full}.
+        stubFile = stubFile.replace("__CONFIG__", stubContentsFile.replace("module.exports =", "").trim()).trim() + "\n\n";
         _fs.default.writeFileSync(tailwindConfigLocation, stubFile, "utf8");
         messages.push(`Created Tailwind CSS config file: ${_path.default.basename(tailwindConfigLocation)}`);
     }
     if (args["--postcss"]) {
-        let postcssConfigLocation = _path.default.resolve(`./${configs.postcss}`);
+        let postcssConfigLocation = _path.default.resolve("./postcss.config.js");
         if (_fs.default.existsSync(postcssConfigLocation)) {
             messages.push(`${_path.default.basename(postcssConfigLocation)} already exists.`);
         } else {
-            let stubFile1 = _fs.default.readFileSync(_path.default.resolve(__dirname, "../../../stubs/defaultPostCssConfig.stub.js"), "utf8");
+            let stubFile1 = _fs.default.readFileSync(isProjectESM ? _path.default.resolve(__dirname, "../../../stubs/postcss.config.js") : _path.default.resolve(__dirname, "../../../stubs/postcss.config.cjs"), "utf8");
             _fs.default.writeFileSync(postcssConfigLocation, stubFile1, "utf8");
             messages.push(`Created PostCSS config file: ${_path.default.basename(postcssConfigLocation)}`);
         }

package/lib/corePluginList.js

@@ -27,6 +27,7 @@ const _default = [
     "clear",
     "margin",
     "boxSizing",
+    "lineClamp",
     "display",
     "aspectRatio",
     "height",
@@ -40,6 +41,7 @@ const _default = [
     "flexGrow",
     "flexBasis",
     "tableLayout",
+    "captionSide",
     "borderCollapse",
     "borderSpacing",
     "transformOrigin",
@@ -60,6 +62,7 @@ const _default = [
     "scrollPadding",
     "listStylePosition",
     "listStyleType",
+    "listStyleImage",
     "appearance",
     "columns",
     "breakBefore",
@@ -91,6 +94,7 @@ const _default = [
     "overscrollBehavior",
     "scrollBehavior",
     "textOverflow",
+    "hyphens",
     "whitespace",
     "wordBreak",
     "borderRadius",