From 33ee64665dcf919b640557c9db657b8e038bed8e Mon Sep 17 00:00:00 2001
From: Robin Malfait <malfait.robin@gmail.com>
Date: Tue, 18 Aug 2020 14:10:28 +0200
Subject: [PATCH] cache className resolve

---
 src/util/generateVariantFunction.js | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/src/util/generateVariantFunction.js b/src/util/generateVariantFunction.js
index 945a6c807..8de4e4867 100644
--- a/src/util/generateVariantFunction.js
+++ b/src/util/generateVariantFunction.js
@@ -1,11 +1,17 @@
 import _ from 'lodash'
 import postcss from 'postcss'
 import selectorParser from 'postcss-selector-parser'
+import { useMemo } from './useMemo'
 
 const classNameParser = selectorParser(selectors => {
   return selectors.first.filter(({ type }) => type === 'class').pop().value
 })
 
+const getClassNameFromSelector = useMemo(
+  selector => classNameParser.transformSync(selector),
+  selector => selector
+)
+
 export default function generateVariantFunction(generator) {
   return (container, config) => {
     const cloned = postcss.root({ nodes: container.clone().nodes })
@@ -24,7 +30,7 @@ export default function generateVariantFunction(generator) {
               rule.selectors = rule.selectors.map(selector => {
                 return modifierFunction({
                   get className() {
-                    return classNameParser.transformSync(selector)
+                    return getClassNameFromSelector(selector)
                   },
                   selector,
                 })