Repository: francoismassart/eslint-plugin-tailwindcss
Pull request #81 (2021-12-28 19:48:23)

3.0.1
FIXES
#77 
#80 


Patch:
diff --git a/README.md b/README.md
index a0c90f8..75651e9 100644
--- a/README.md
+++ b/README.md
@@ -6,7 +6,7 @@
 
 Rules enforcing best practices and consistency using [Tailwind CSS](https://tailwindcss.com/)
 
-## **🎉 The version 3 of plugin is now ready for TailwindCSS v3 🎉**
+## **🎉 Version 3 is now ready for TailwindCSS v3 🎉**
 
 ## Make sure to use the correct version
 
@@ -15,6 +15,8 @@ Rules enforcing best practices and consistency using [Tailwind CSS](https://tail
 - Using TailwindCSS v3 ?
   - Make sure to use `v3.x.x` of this plugin
 
+**If you are using the eslint extension, make sure to restart VSCode in order to use the lastest version of the plugin and not the former version from the cache.**
+
 ## We need you ❤️
 
 Version 3 of the plugin is brand new and you will most likely experience bugs, please provide feedback by opening issues on GitHub with all the useful informations so that we can fix them all.
@@ -31,6 +33,10 @@ If you enjoy my work you can:
 
 ## Latest changelog
 
+- FIX: [Arbitrary values of color opacity](https://github.com/francoismassart/eslint-plugin-tailwindcss/issues/80)
+
+- FIX: [Class transition-transform throws the wrong warning](https://github.com/francoismassart/eslint-plugin-tailwindcss/issues/77)
+
 - New rule: [`migration-from-tailwind-2`](docs/rules/migration-from-tailwind-2.md) for easy migration from TailwindCSS `v2` to `v3`
 
 - Support for TailwindCSS v3
diff --git a/lib/rules/migration-from-tailwind-2.js b/lib/rules/migration-from-tailwind-2.js
index bd2ecd8..07e9d4e 100644
--- a/lib/rules/migration-from-tailwind-2.js
+++ b/lib/rules/migration-from-tailwind-2.js
@@ -148,7 +148,7 @@ module.exports = {
       const deprecatedBgOpacity = [];
       const filtered = classNames.filter((cls) => {
         const suffix = groupUtil.getSuffix(cls, mergedConfig.separator);
-        if (/^(backdrop\-)?filter|filter|transform$/i.test(suffix)) {
+        if (/^((backdrop\-)?filter|transform)$/i.test(suffix)) {
           notNeeded.push(cls);
           return false;
         }
diff --git a/lib/util/groupMethods.js b/lib/util/groupMethods.js
index e2cac6f..2b01750 100644
--- a/lib/util/groupMethods.js
+++ b/lib/util/groupMethods.js
@@ -40,9 +40,7 @@ function escapeSpecialChars(str) {
  */
 function generateOptionalOpacitySuffix(config) {
   const opacityKeys = !config.theme['opacity'] ? [] : Object.keys(config.theme['opacity']);
-  if (opacityKeys.length === 0) {
-    return '';
-  }
+  opacityKeys.push('\\[(0|1|0?\\.\\d{1,})\\]');
   return `(\\/(${opacityKeys.join('|')}))?`;
 }
 
diff --git a/package-lock.json b/package-lock.json
index f198d2b..5263893 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,6 +1,6 @@
 {
   "name": "eslint-plugin-tailwindcss",
-  "version": "3.0.0",
+  "version": "3.0.1",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
@@ -1767,9 +1767,9 @@
       }
     },
     "postcss-selector-parser": {
-      "version": "6.0.7",
-      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.0.7.tgz",
-      "integrity": "sha512-U+b/Deoi4I/UmE6KOVPpnhS7I7AYdKbhGcat+qTQ27gycvaACvNEw11ba6RrkwVmDVRW7sigWgLj4/KbbJjeDA==",
+      "version": "6.0.8",
+      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.0.8.tgz",
+      "integrity": "sha512-D5PG53d209Z1Uhcc0qAZ5U3t5HagH3cxu+WLZ22jt3gLUpXM4eXXfiO14jiDWST3NNooX/E8wISfOhZ9eIjGTQ==",
       "requires": {
         "cssesc": "^3.0.0",
         "util-deprecate": "^1.0.2"
@@ -2047,9 +2047,9 @@
       }
     },
     "tailwindcss": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.0.0.tgz",
-      "integrity": "sha512-UPAp2PS5vojAvGClJFIkdh2hfFyaSWo09Ma9j2vZYW+ANhTvpUHFjY85JgtrvvXXREtDvOXy2BxW1yHOz8apCg==",
+      "version": "3.0.7",
+      "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.0.7.tgz",
+      "integrity": "sha512-rZdKNHtC64jcQncLoWOuCzj4lQDTAgLtgK3WmQS88tTdpHh9OwLqULTQxI3tw9AMJsqSpCKlmcjW/8CSnni6zQ==",
       "requires": {
         "arg": "^5.0.1",
         "chalk": "^4.1.2",
@@ -2067,7 +2067,7 @@
         "postcss-js": "^3.0.3",
         "postcss-load-config": "^3.1.0",
         "postcss-nested": "5.0.6",
-        "postcss-selector-parser": "^6.0.6",
+        "postcss-selector-parser": "^6.0.7",
         "postcss-value-parser": "^4.2.0",
         "quick-lru": "^5.1.1",
         "resolve": "^1.20.0",
diff --git a/package.json b/package.json
index 4f66744..7b10124 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "eslint-plugin-tailwindcss",
-  "version": "3.0.0",
+  "version": "3.0.1",
   "description": "Rules enforcing best practices while using Tailwind CSS",
   "keywords": [
     "eslint",
@@ -26,7 +26,7 @@
   "dependencies": {
     "fast-glob": "^3.2.5",
     "postcss": "^8.4.4",
-    "tailwindcss": "^3.0.0"
+    "tailwindcss": "^3.0.7"
   },
   "devDependencies": {
     "@tailwindcss/aspect-ratio": "^0.4.0",


Test patch:
diff --git a/tests/lib/rules/migration-from-tailwind-2.js b/tests/lib/rules/migration-from-tailwind-2.js
index 9b1d310..809ab5d 100644
--- a/tests/lib/rules/migration-from-tailwind-2.js
+++ b/tests/lib/rules/migration-from-tailwind-2.js
@@ -30,6 +30,12 @@ ruleTester.run("migration-from-tailwind-2", rule, {
     {
       code: `<div class="scale-50 grayscale backdrop-blur-sm">Automatic transforms and filters</div>`,
     },
+    {
+      code: `<div class="transition-transform">transition-transform</div>`,
+    },
+    {
+      code: `<div class="transition-[var(--transform)]">transition-[var(--transform)]</div>`,
+    },
   ],
   invalid: [
     {
diff --git a/tests/lib/rules/no-custom-classname.js b/tests/lib/rules/no-custom-classname.js
index af4b03a..55ac1ae 100644
--- a/tests/lib/rules/no-custom-classname.js
+++ b/tests/lib/rules/no-custom-classname.js
@@ -488,6 +488,10 @@ ruleTester.run("no-custom-classname", rule, {
         font-mono is a valid classname
       </div>`,
     },
+    {
+      code: `
+      <div className={'stroke-sky-500/[.1]'}>Arbitrary alpha suffix</div>`,
+    },
   ],
 
   invalid: [