From 14e236e06a7255dd5c1478ea0fa52e143f6b6fc7 Mon Sep 17 00:00:00 2001
From: francoismassart <francois.massart@gmail.com>
Date: Mon, 5 Feb 2024 13:24:25 +0100
Subject: [PATCH] fix: issue #293

---
 README.md                                     |  1 +
 lib/config/groups.js                          | 19 ++++++++++++++++++-
 tests/lib/rules/no-contradicting-classname.js | 11 +++++++++++
 3 files changed, 30 insertions(+), 1 deletion(-)

diff --git a/README.md b/README.md
index bff30c6..cec6704 100644
--- a/README.md
+++ b/README.md
@@ -40,6 +40,7 @@ You can can the same information on your favorite command line software as well.
 
 ## Latest changelog
 
+- fix: [composable touch action classnames](https://github.com/francoismassart/eslint-plugin-tailwindcss/issues/293)
 - fix: [`shadow-md` + `shadow-[#color]`can be used together 🤝](https://github.com/francoismassart/eslint-plugin-tailwindcss/issues/298)
 - fix: [`tabular-nums` and `slashed-zero` can be used together 🤝](https://github.com/francoismassart/eslint-plugin-tailwindcss/issues/316)
 - fix: [`size-*` based `size` 🤓](https://github.com/francoismassart/eslint-plugin-tailwindcss/issues/315)
diff --git a/lib/config/groups.js b/lib/config/groups.js
index 702f8ba..76a64bd 100644
--- a/lib/config/groups.js
+++ b/lib/config/groups.js
@@ -1337,7 +1337,24 @@ module.exports.groups = [
       },
       {
         type: 'Touch Action',
-        members: 'touch\\-(auto|none|pan\\-(x|left|right|y|up|down)|pinch\\-zoom|manipulation)',
+        members: [
+          {
+            type: 'Touch Action Mode',
+            members: 'touch\\-(auto|none|manipulation)',
+          },
+          {
+            type: 'Touch Action X',
+            members: 'touch\\-(pan\\-(x|left|right))',
+          },
+          {
+            type: 'Touch Action Y',
+            members: 'touch\\-(pan\\-(y|up|down))',
+          },
+          {
+            type: 'Touch Action Pinch Zoom',
+            members: 'touch\\-pinch\\-zoom',
+          },
+        ],
       },
       {
         type: 'User Select',
diff --git a/tests/lib/rules/no-contradicting-classname.js b/tests/lib/rules/no-contradicting-classname.js
index 9bb2274..9996f81 100644
--- a/tests/lib/rules/no-contradicting-classname.js
+++ b/tests/lib/rules/no-contradicting-classname.js
@@ -313,6 +313,9 @@ ruleTester.run("no-contradicting-classname", rule, {
     {
       code: `<div class="shadow-md shadow-[#aabbcc]">Issue #298</div>`,
     },
+    {
+      code: `<pre class="touch-pan-left touch-pan-y touch-pinch-zoom touch-manipulation">valid combo for issue #293</pre>`,
+    },
   ],
 
   invalid: [
@@ -751,6 +754,14 @@ ruleTester.run("no-contradicting-classname", rule, {
       code: `<div class="diagonal-fractions stacked-fractions">Font Variant Numeric #316</div>`,
       errors: generateErrors(["diagonal-fractions stacked-fractions"]),
     },
+    {
+      code: `<pre class="touch-auto touch-none touch-pan-x touch-pan-left touch-pan-right touch-pan-y touch-pan-up touch-pan-down touch-pinch-zoom touch-manipulation">KitchenSink with errors for issue #293</pre>`,
+      errors: generateErrors([
+        "touch-auto touch-none touch-manipulation",
+        "touch-pan-x touch-pan-left touch-pan-right",
+        "touch-pan-y touch-pan-up touch-pan-down",
+      ]),
+    },
     // {
     //   code: `
     //   <div class="scale-75 transform-none">