refactor group and peer variants to use matchVariant API

tailwindlabs · May 17, 2022 · d588816 · d588816
1 parent 24fec23
commit d588816
Showing 1 changed file with 14 additions and 14 deletions.
diff --git a/src/corePlugins.js b/src/corePlugins.js
@@ -60,7 +60,7 @@ export let variantPlugins = {
     })
   },
 
-  pseudoClassVariants: ({ addVariant }) => {
+  pseudoClassVariants: ({ addVariant, matchVariant }) => {
     let pseudoVariants = [
       // Positional
       ['first', ':first-child'],
@@ -132,21 +132,21 @@ export let variantPlugins = {
       })
     }
 
-    for (let [variantName, state] of pseudoVariants) {
-      addVariant(`group-${variantName}`, (ctx) => {
-        let result = typeof state === 'function' ? state(ctx) : state
-
-        return `:merge(.group)${result} &`
-      })
-    }
+    matchVariant(
+      {
+        group: (state, ctx) => {
+          let result = typeof state === 'function' ? state(ctx) : state
 
-    for (let [variantName, state] of pseudoVariants) {
-      addVariant(`peer-${variantName}`, (ctx) => {
-        let result = typeof state === 'function' ? state(ctx) : state
+          return `:merge(.group)${result} &`
+        },
+        peer: (state, ctx) => {
+          let result = typeof state === 'function' ? state(ctx) : state
 
-        return `:merge(.peer)${result} ~ &`
-      })
-    }
+          return `:merge(.peer)${result} ~ &`
+        },
+      },
+      { values: Object.fromEntries(pseudoVariants) }
+    )
   },
 
   directionVariants: ({ addVariant }) => {