tailwindcss 3.2.7 → 3.3.0

package/lib/public/default-theme.js

@@ -7,10 +7,10 @@ Object.defineProperty(exports, "default", {
     get: ()=>_default
 });
 const _cloneDeep = require("../util/cloneDeep");
-const _defaultConfigStub = /*#__PURE__*/ _interopRequireDefault(require("../../stubs/defaultConfig.stub"));
+const _configFull = /*#__PURE__*/ _interopRequireDefault(require("../../stubs/config.full"));
 function _interopRequireDefault(obj) {
     return obj && obj.__esModule ? obj : {
         default: obj
     };
 }
-const _default = (0, _cloneDeep.cloneDeep)(_defaultConfigStub.default.theme);
+const _default = (0, _cloneDeep.cloneDeep)(_configFull.default.theme);

package/lib/public/load-config.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "default", {
+    enumerable: true,
+    get: ()=>_default
+});
+const _loadConfig = require("../lib/load-config");
+const _default = _loadConfig.loadConfig;

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/lib/util/dataTypes.js

@@ -41,6 +41,9 @@ function isCSSFunction(value) {
 const placeholder = "--tw-placeholder";
 const placeholderRe = new RegExp(placeholder, "g");
 function normalize(value, isRoot = true) {
+    if (value.startsWith("--")) {
+        return `var(${value})`;
+    }
     // Keep raw strings if it starts with `url(`
     if (value.includes("url(")) {
         return value.split(/(url\(.*?\))/g).filter(Boolean).map((part)=>{

package/lib/util/getAllConfigs.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "default", {
     enumerable: true,
     get: ()=>getAllConfigs
 });
-const _defaultConfigStubJs = /*#__PURE__*/ _interopRequireDefault(require("../../stubs/defaultConfig.stub.js"));
+const _configFullJs = /*#__PURE__*/ _interopRequireDefault(require("../../stubs/config.full.js"));
 const _featureFlags = require("../featureFlags");
 function _interopRequireDefault(obj) {
     return obj && obj.__esModule ? obj : {
@@ -16,7 +16,7 @@ function _interopRequireDefault(obj) {
 function getAllConfigs(config) {
     var _config_presets;
     const configs = ((_config_presets = config === null || config === void 0 ? void 0 : config.presets) !== null && _config_presets !== void 0 ? _config_presets : [
-        _defaultConfigStubJs.default
+        _configFullJs.default
     ]).slice().reverse().flatMap((preset)=>getAllConfigs(preset instanceof Function ? preset() : preset));
     const features = {
         // Add experimental configs here...

package/lib/util/normalizeConfig.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "normalizeConfig", {
     enumerable: true,
     get: ()=>normalizeConfig
 });
+const _featureFlags = require("../featureFlags");
 const _log = /*#__PURE__*/ _interopRequireWildcard(require("./log"));
 function _getRequireWildcardCache(nodeInterop) {
     if (typeof WeakMap !== "function") return null;
@@ -191,13 +192,11 @@ function normalizeConfig(config) {
     // Normalize the `content`
     config.content = {
         relative: (()=>{
-            var _config_future;
             let { content  } = config;
             if (content === null || content === void 0 ? void 0 : content.relative) {
                 return content.relative;
             }
-            var _config_future_relativeContentPathsByDefault;
-            return (_config_future_relativeContentPathsByDefault = (_config_future = config.future) === null || _config_future === void 0 ? void 0 : _config_future.relativeContentPathsByDefault) !== null && _config_future_relativeContentPathsByDefault !== void 0 ? _config_future_relativeContentPathsByDefault : false;
+            return (0, _featureFlags.flagEnabled)(config, "relativeContentPathsByDefault");
         })(),
         files: (()=>{
             let { content , purge  } = config;
@@ -277,5 +276,19 @@ function normalizeConfig(config) {
             break;
         }
     }
+    // Warn if the line-clamp plugin is installed
+    if (config.plugins.length > 0) {
+        let plugin;
+        try {
+            plugin = require("@tailwindcss/line-clamp");
+        } catch  {}
+        if (plugin && config.plugins.includes(plugin)) {
+            _log.default.warn("line-clamp-in-core", [
+                "As of Tailwind CSS v3.3, the `@tailwindcss/line-clamp` plugin is now included by default.",
+                "Remove it from the `plugins` array in your configuration to eliminate this warning."
+            ]);
+            config.plugins = config.plugins.filter((p)=>p !== plugin);
+        }
+    }
     return config;
 }

package/lib/util/pluginUtils.js

@@ -104,6 +104,13 @@ function parseColorFormat(value) {
     }
     return value;
 }
+function unwrapArbitraryModifier(modifier) {
+    modifier = modifier.slice(1, -1);
+    if (modifier.startsWith("--")) {
+        modifier = `var(${modifier})`;
+    }
+    return modifier;
+}
 function asColor(modifier, options = {}, { tailwindConfig ={}  } = {}) {
     var _options_values;
     if (((_options_values = options.values) === null || _options_values === void 0 ? void 0 : _options_values[modifier]) !== undefined) {
@@ -122,7 +129,7 @@ function asColor(modifier, options = {}, { tailwindConfig ={}  } = {}) {
         }
         normalizedColor = parseColorFormat(normalizedColor);
         if (isArbitraryValue(alpha)) {
-            return (0, _withAlphaVariable.withAlphaValue)(normalizedColor, alpha.slice(1, -1));
+            return (0, _withAlphaVariable.withAlphaValue)(normalizedColor, unwrapArbitraryModifier(alpha));
         }
         if (((_tailwindConfig_theme = tailwindConfig.theme) === null || _tailwindConfig_theme === void 0 ? void 0 : (_tailwindConfig_theme_opacity = _tailwindConfig_theme.opacity) === null || _tailwindConfig_theme_opacity === void 0 ? void 0 : _tailwindConfig_theme_opacity[alpha]) === undefined) {
             return undefined;
@@ -237,7 +244,7 @@ function* getMatchingTypes(types, rawModifier, options, tailwindConfig) {
             if (configValue !== null) {
                 utilityModifier = configValue;
             } else if (isArbitraryValue(utilityModifier)) {
-                utilityModifier = utilityModifier.slice(1, -1);
+                utilityModifier = unwrapArbitraryModifier(utilityModifier);
             }
         }
     }

package/lib/util/resolveConfigPath.js

@@ -2,9 +2,15 @@
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
-Object.defineProperty(exports, "default", {
-    enumerable: true,
-    get: ()=>resolveConfigPath
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    default: ()=>resolveConfigPath,
+    resolveDefaultConfigPath: ()=>resolveDefaultConfigPath
 });
 const _fs = /*#__PURE__*/ _interopRequireDefault(require("fs"));
 const _path = /*#__PURE__*/ _interopRequireDefault(require("path"));
@@ -13,6 +19,12 @@ function _interopRequireDefault(obj) {
         default: obj
     };
 }
+const defaultConfigFiles = [
+    "./tailwind.config.js",
+    "./tailwind.config.cjs",
+    "./tailwind.config.mjs",
+    "./tailwind.config.ts"
+];
 function isObject(value) {
     return typeof value === "object" && value !== null;
 }
@@ -40,10 +52,10 @@ function resolveConfigPath(pathOrConfig) {
         return _path.default.resolve(pathOrConfig);
     }
     // require('tailwindcss')
-    for (const configFile of [
-        "./tailwind.config.js",
-        "./tailwind.config.cjs"
-    ]){
+    return resolveDefaultConfigPath();
+}
+function resolveDefaultConfigPath() {
+    for (const configFile of defaultConfigFiles){
         try {
             const configPath = _path.default.resolve(configFile);
             _fs.default.accessSync(configPath);

package/lib/util/splitAtTopLevelOnly.js

@@ -24,14 +24,20 @@ function splitAtTopLevelOnly(input, separator) {
     let stack = [];
     let parts = [];
     let lastPos = 0;
+    let isEscaped = false;
     for(let idx = 0; idx < input.length; idx++){
         let char = input[idx];
-        if (stack.length === 0 && char === separator[0]) {
+        if (stack.length === 0 && char === separator[0] && !isEscaped) {
             if (separator.length === 1 || input.slice(idx, idx + separator.length) === separator) {
                 parts.push(input.slice(lastPos, idx));
                 lastPos = idx + separator.length;
             }
         }
+        if (isEscaped) {
+            isEscaped = false;
+        } else if (char === "\\") {
+            isEscaped = true;
+        }
         if (char === "(" || char === "[" || char === "{") {
             stack.push(char);
         } else if (char === ")" && stack[stack.length - 1] === "(" || char === "]" && stack[stack.length - 1] === "[" || char === "}" && stack[stack.length - 1] === "{") {

package/loadConfig.d.ts

@@ -0,0 +1,4 @@
+import type { Config } from './types/config'
+
+declare function loadConfig(path: string): Config
+export = loadConfig

package/loadConfig.js

@@ -0,0 +1,2 @@
+let loadConfig = require('./lib/public/load-config')
+module.exports = (loadConfig.__esModule ? loadConfig : { default: loadConfig }).default

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tailwindcss",
-  "version": "3.2.7",
+  "version": "3.3.0",
   "description": "A utility-first CSS framework for rapidly building custom user interfaces.",
   "license": "MIT",
   "main": "lib/index.js",
@@ -38,7 +38,7 @@
     "lib/*",
     "peers/*",
     "scripts/*.js",
-    "stubs/*.stub.js",
+    "stubs/*",
     "nesting/*",
     "types/**/*",
     "*.d.ts",
@@ -73,12 +73,12 @@
     "arg": "^5.0.2",
     "chokidar": "^3.5.3",
     "color-name": "^1.1.4",
-    "detective": "^5.2.1",
     "didyoumean": "^1.2.2",
     "dlv": "^1.1.3",
     "fast-glob": "^3.2.12",
     "glob-parent": "^6.0.2",
     "is-glob": "^4.0.3",
+    "jiti": "^1.17.2",
     "lilconfig": "^2.0.6",
     "micromatch": "^4.0.5",
     "normalize-path": "^3.0.0",
@@ -92,7 +92,8 @@
     "postcss-selector-parser": "^6.0.11",
     "postcss-value-parser": "^4.2.0",
     "quick-lru": "^5.1.1",
-    "resolve": "^1.22.1"
+    "resolve": "^1.22.1",
+    "sucrase": "^3.29.0"
   },
   "browserslist": [
     "> 1%",

package/src/cli/build/index.js

@@ -2,9 +2,10 @@
 
 import fs from 'fs'
 import path from 'path'
+import { resolveDefaultConfigPath } from '../../util/resolveConfigPath.js'
 import { createProcessor } from './plugin.js'
 
-export async function build(args, configs) {
+export async function build(args) {
   let input = args['--input']
   let shouldWatch = args['--watch']
 
@@ -25,11 +26,7 @@ export async function build(args, configs) {
   }
 
   // TODO: Reference the @config path here if exists
-  let configPath = args['--config']
-    ? args['--config']
-    : ((defaultPath) => (fs.existsSync(defaultPath) ? defaultPath : null))(
-        path.resolve(`./${configs.tailwind}`)
-      )
+  let configPath = args['--config'] ? args['--config'] : resolveDefaultConfigPath()
 
   let processor = await createProcessor(args, configPath)
 
@@ -44,6 +41,9 @@ export async function build(args, configs) {
 
     await processor.watch()
   } else {
-    await processor.build()
+    await processor.build().catch((e) => {
+      console.error(e)
+      process.exit(1)
+    })
   }
 }

package/src/cli/build/plugin.js

@@ -12,12 +12,13 @@ import { loadAutoprefixer, loadCssNano, loadPostcss, loadPostcssImport } from '.
 import { formatNodes, drainStdin, outputFile } from './utils'
 import { env } from '../../lib/sharedState'
 import resolveConfig from '../../../resolveConfig.js'
-import getModuleDependencies from '../../lib/getModuleDependencies.js'
 import { parseCandidateFiles } from '../../lib/content.js'
 import { createWatcher } from './watching.js'
 import fastGlob from 'fast-glob'
 import { findAtConfigPath } from '../../lib/findAtConfigPath.js'
 import log from '../../util/log'
+import { loadConfig } from '../../lib/load-config'
+import getModuleDependencies from '../../lib/getModuleDependencies'
 
 /**
  *
@@ -117,7 +118,9 @@ let state = {
   /** @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[]} */
@@ -142,37 +145,35 @@ let state = {
 
   loadConfig(configPath, content) {
     if (this.watcher && configPath) {
-      this.refreshConfigDependencies(configPath)
+      this.refreshConfigDependencies()
     }
 
-    let config = configPath ? require(configPath) : {}
+    let config = loadConfig(configPath)
+    let dependencies = getModuleDependencies(configPath)
+    this.configBag = {
+      config,
+      dependencies,
+      dispose() {
+        for (let file of dependencies) {
+          delete require.cache[require.resolve(file)]
+        }
+      },
+    }
 
     // @ts-ignore
-    config = resolveConfig(config, { content: { files: [] } })
+    this.configBag.config = resolveConfig(this.configBag.config, { content: { files: [] } })
 
     // Override content files if `--content` has been passed explicitly
     if (content?.length > 0) {
-      config.content.files = content
+      this.configBag.config.content.files = content
     }
 
-    return config
+    return this.configBag.config
   },
 
-  refreshConfigDependencies(configPath) {
+  refreshConfigDependencies() {
     env.DEBUG && console.time('Module dependencies')
-
-    for (let file of this.configDependencies) {
-      delete require.cache[require.resolve(file)]
-    }
-
-    if (configPath) {
-      let deps = getModuleDependencies(configPath).map(({ file }) => file)
-
-      for (let dependency of deps) {
-        this.configDependencies.add(dependency)
-      }
-    }
-
+    this.configBag?.dispose()
     env.DEBUG && console.timeEnd('Module dependencies')
   },
 
@@ -383,7 +384,11 @@ export async function createProcessor(args, cliConfigPath) {
           // 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)
+          }
         }
       )
   }
@@ -416,7 +421,7 @@ export async function createProcessor(args, cliConfigPath) {
         async rebuild(changes) {
           let needsNewContext = changes.some((change) => {
             return (
-              state.configDependencies.has(change.file) ||
+              state.configBag?.dependencies.has(change.file) ||
               state.contextDependencies.has(change.file)
             )
           })

package/src/cli/build/watching.js

@@ -89,7 +89,9 @@ export function createWatcher(args, { state, rebuild }) {
     // Resolve the promise even when the rebuild fails
     return rebuild(changes).then(
       () => {},
-      () => {}
+      (e) => {
+        console.error(e.toString())
+      }
     )
   }
 
@@ -220,7 +222,7 @@ export function createWatcher(args, { state, rebuild }) {
 
     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/src/cli/index.js

@@ -8,29 +8,6 @@ import { build } from './build'
 import { help } from './help'
 import { init } from './init'
 
-function isESM() {
-  const pkgPath = path.resolve('./package.json')
-
-  try {
-    let pkg = JSON.parse(fs.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) => {
@@ -51,8 +28,13 @@ let commands = {
   init: {
     run: init,
     args: {
-      '--full': { type: Boolean, description: `Initialize a full \`${configs.tailwind}\` file` },
-      '--postcss': { type: Boolean, description: `Initialize a \`${configs.postcss}\` file` },
+      '--esm': { type: Boolean, description: `Initialize configuration file as ESM` },
+      '--ts': { type: Boolean, description: `Initialize configuration file as TypeScript` },
+      '--postcss': { type: Boolean, 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',
     },
@@ -231,4 +213,4 @@ if (args['--help']) {
   process.exit(0)
 }
 
-run(args, configs)
+run(args)

package/src/cli/init/index.js

@@ -3,22 +3,49 @@
 import fs from 'fs'
 import path from 'path'
 
-export function init(args, configs) {
+function isESM() {
+  const pkgPath = path.resolve('./package.json')
+
+  try {
+    let pkg = JSON.parse(fs.readFileSync(pkgPath, 'utf8'))
+    return pkg.type && pkg.type === 'module'
+  } catch (err) {
+    return false
+  }
+}
+
+export function init(args) {
   let messages = []
 
-  let tailwindConfigLocation = path.resolve(args['_'][1] ?? `./${configs.tailwind}`)
+  let isProjectESM = args['--ts'] || args['--esm'] || isESM()
+  let syntax = args['--ts'] ? 'ts' : isProjectESM ? 'js' : 'cjs'
+  let extension = args['--ts'] ? 'ts' : 'js'
+
+  let tailwindConfigLocation = path.resolve(args['_'][1] ?? `./tailwind.config.${extension}`)
+
   if (fs.existsSync(tailwindConfigLocation)) {
     messages.push(`${path.basename(tailwindConfigLocation)} already exists.`)
   } else {
-    let stubFile = fs.readFileSync(
+    let stubContentsFile = fs.readFileSync(
       args['--full']
-        ? path.resolve(__dirname, '../../../stubs/defaultConfig.stub.js')
-        : path.resolve(__dirname, '../../../stubs/simpleConfig.stub.js'),
+        ? path.resolve(__dirname, '../../../stubs/config.full.js')
+        : path.resolve(__dirname, '../../../stubs/config.simple.js'),
+      'utf8'
+    )
+
+    let stubFile = fs.readFileSync(
+      path.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.writeFileSync(tailwindConfigLocation, stubFile, 'utf8')
 
@@ -26,12 +53,14 @@ export function init(args, configs) {
   }
 
   if (args['--postcss']) {
-    let postcssConfigLocation = path.resolve(`./${configs.postcss}`)
+    let postcssConfigLocation = path.resolve('./postcss.config.js')
     if (fs.existsSync(postcssConfigLocation)) {
       messages.push(`${path.basename(postcssConfigLocation)} already exists.`)
     } else {
       let stubFile = fs.readFileSync(
-        path.resolve(__dirname, '../../../stubs/defaultPostCssConfig.stub.js'),
+        isProjectESM
+          ? path.resolve(__dirname, '../../../stubs/postcss.config.js')
+          : path.resolve(__dirname, '../../../stubs/postcss.config.cjs'),
         'utf8'
       )
 

package/src/corePluginList.js

@@ -1 +1 @@
-export default ["preflight","container","accessibility","pointerEvents","visibility","position","inset","isolation","zIndex","order","gridColumn","gridColumnStart","gridColumnEnd","gridRow","gridRowStart","gridRowEnd","float","clear","margin","boxSizing","display","aspectRatio","height","maxHeight","minHeight","width","minWidth","maxWidth","flex","flexShrink","flexGrow","flexBasis","tableLayout","borderCollapse","borderSpacing","transformOrigin","translate","rotate","skew","scale","transform","animation","cursor","touchAction","userSelect","resize","scrollSnapType","scrollSnapAlign","scrollSnapStop","scrollMargin","scrollPadding","listStylePosition","listStyleType","appearance","columns","breakBefore","breakInside","breakAfter","gridAutoColumns","gridAutoFlow","gridAutoRows","gridTemplateColumns","gridTemplateRows","flexDirection","flexWrap","placeContent","placeItems","alignContent","alignItems","justifyContent","justifyItems","gap","space","divideWidth","divideStyle","divideColor","divideOpacity","placeSelf","alignSelf","justifySelf","overflow","overscrollBehavior","scrollBehavior","textOverflow","whitespace","wordBreak","borderRadius","borderWidth","borderStyle","borderColor","borderOpacity","backgroundColor","backgroundOpacity","backgroundImage","gradientColorStops","boxDecorationBreak","backgroundSize","backgroundAttachment","backgroundClip","backgroundPosition","backgroundRepeat","backgroundOrigin","fill","stroke","strokeWidth","objectFit","objectPosition","padding","textAlign","textIndent","verticalAlign","fontFamily","fontSize","fontWeight","textTransform","fontStyle","fontVariantNumeric","lineHeight","letterSpacing","textColor","textOpacity","textDecoration","textDecorationColor","textDecorationStyle","textDecorationThickness","textUnderlineOffset","fontSmoothing","placeholderColor","placeholderOpacity","caretColor","accentColor","opacity","backgroundBlendMode","mixBlendMode","boxShadow","boxShadowColor","outlineStyle","outlineWidth","outlineOffset","outlineColor","ringWidth","ringColor","ringOpacity","ringOffsetWidth","ringOffsetColor","blur","brightness","contrast","dropShadow","grayscale","hueRotate","invert","saturate","sepia","filter","backdropBlur","backdropBrightness","backdropContrast","backdropGrayscale","backdropHueRotate","backdropInvert","backdropOpacity","backdropSaturate","backdropSepia","backdropFilter","transitionProperty","transitionDelay","transitionDuration","transitionTimingFunction","willChange","content"]
+export default ["preflight","container","accessibility","pointerEvents","visibility","position","inset","isolation","zIndex","order","gridColumn","gridColumnStart","gridColumnEnd","gridRow","gridRowStart","gridRowEnd","float","clear","margin","boxSizing","lineClamp","display","aspectRatio","height","maxHeight","minHeight","width","minWidth","maxWidth","flex","flexShrink","flexGrow","flexBasis","tableLayout","captionSide","borderCollapse","borderSpacing","transformOrigin","translate","rotate","skew","scale","transform","animation","cursor","touchAction","userSelect","resize","scrollSnapType","scrollSnapAlign","scrollSnapStop","scrollMargin","scrollPadding","listStylePosition","listStyleType","listStyleImage","appearance","columns","breakBefore","breakInside","breakAfter","gridAutoColumns","gridAutoFlow","gridAutoRows","gridTemplateColumns","gridTemplateRows","flexDirection","flexWrap","placeContent","placeItems","alignContent","alignItems","justifyContent","justifyItems","gap","space","divideWidth","divideStyle","divideColor","divideOpacity","placeSelf","alignSelf","justifySelf","overflow","overscrollBehavior","scrollBehavior","textOverflow","hyphens","whitespace","wordBreak","borderRadius","borderWidth","borderStyle","borderColor","borderOpacity","backgroundColor","backgroundOpacity","backgroundImage","gradientColorStops","boxDecorationBreak","backgroundSize","backgroundAttachment","backgroundClip","backgroundPosition","backgroundRepeat","backgroundOrigin","fill","stroke","strokeWidth","objectFit","objectPosition","padding","textAlign","textIndent","verticalAlign","fontFamily","fontSize","fontWeight","textTransform","fontStyle","fontVariantNumeric","lineHeight","letterSpacing","textColor","textOpacity","textDecoration","textDecorationColor","textDecorationStyle","textDecorationThickness","textUnderlineOffset","fontSmoothing","placeholderColor","placeholderOpacity","caretColor","accentColor","opacity","backgroundBlendMode","mixBlendMode","boxShadow","boxShadowColor","outlineStyle","outlineWidth","outlineOffset","outlineColor","ringWidth","ringColor","ringOpacity","ringOffsetWidth","ringOffsetColor","blur","brightness","contrast","dropShadow","grayscale","hueRotate","invert","saturate","sepia","filter","backdropBlur","backdropBrightness","backdropContrast","backdropGrayscale","backdropHueRotate","backdropInvert","backdropOpacity","backdropSaturate","backdropSepia","backdropFilter","transitionProperty","transitionDelay","transitionDuration","transitionTimingFunction","willChange","content"]