🐛 fix: emotion instance should use same cache (#80)

CHANGELOG.md

@@ -1,5 +1,11 @@
 # Changelog
 
+## [3.4.2-beta.1](https://github.com/ant-design/antd-style/compare/v3.4.1...v3.4.2-beta.1) (2023-07-20)
+
+### 🐛 Bug Fixes
+
+- Emotion instance should use same cache, closes [#80](https://github.com/ant-design/antd-style/issues/80) ([17f804e](https://github.com/ant-design/antd-style/commit/17f804e))
+
 ## [3.4.1](https://github.com/ant-design/antd-style/compare/v3.4.0...v3.4.1) (2023-07-02)
 
 ### 🐛 Bug Fixes

package.json

@@ -1,6 +1,6 @@
 {
   "name": "antd-style",
-  "version": "3.4.1",
+  "version": "3.4.2-beta.1",
   "description": "a css-in-js solution for application combine with antd v5 token system and emotion",
   "keywords": [
     "antd",

src/core/CacheManager.ts

@@ -4,10 +4,14 @@ import { EmotionCache } from '@emotion/css/create-instance';
 export class CacheManager {
   private _cacheList: EmotionCache[] = [cache];
 
-  add(cache: EmotionCache) {
-    if (this.hasCache(cache)) return;
-
-    this._cacheList.push(cache);
+  add(cache: EmotionCache): EmotionCache {
+    const existCache = this.getCache(cache.key);
+    if (existCache) {
+      return existCache;
+    } else {
+      this._cacheList.push(cache);
+      return cache;
+    }
   }
 
   delete(cache: EmotionCache) {
@@ -18,6 +22,10 @@ export class CacheManager {
     return this._cacheList.some((c) => c.key === cache.key);
   }
 
+  getCache(key: string) {
+    return this._cacheList.find((c) => c.key === key);
+  }
+
   getCacheList() {
     return this._cacheList;
   }

src/factories/createStyleProvider/index.tsx

@@ -98,7 +98,7 @@ export const createStyleProvider = (EmotionContext: Context<Emotion>): FC<StyleP
 
         if (cacheManager) {
           // add 方法有幂等
-          cacheManager.add(instance.cache);
+          instance.cache = cacheManager.add(instance.cache);
         }
 
         return instance;

src/functions/createInstance.ts

@@ -73,7 +73,7 @@ export const createInstance = <T = any>(options: CreateOptions<T>) => {
   const StyleProvider = createStyleProvider(EmotionContext);
 
   // 将 cache 存到全局管理器中
-  cacheManager.add(emotion.cache);
+  emotion.cache = cacheManager.add(emotion.cache);
 
   // ******* 下面这些都和主题相关，如果做了任何改动，都需要排查一遍 ************* //