@antdv-next/cssinjs 1.0.0-rc.2 → 1.0.0

package/dist/StyleContext.mjs

@@ -46,6 +46,46 @@ function provideStyleContext(app, props) {
 function useStyleContext() {
 	return inject(StyleContextKey, ref(defaultStyleContext));
 }
+const styleContextProps = {
+	autoClear: {
+		type: Boolean,
+		default: void 0
+	},
+	mock: {
+		type: String,
+		default: void 0
+	},
+	cache: { type: Object },
+	defaultCache: { type: Boolean },
+	hashPriority: {
+		type: String,
+		default: void 0
+	},
+	container: {
+		type: [Object],
+		default: void 0
+	},
+	ssrInline: {
+		type: Boolean,
+		default: void 0
+	},
+	transformers: {
+		type: Array,
+		default: void 0
+	},
+	linters: {
+		type: Array,
+		default: void 0
+	},
+	layer: {
+		type: Boolean,
+		default: void 0
+	},
+	autoPrefix: {
+		type: Boolean,
+		default: void 0
+	}
+};
 const StyleProvider = defineComponent((props, { slots }) => {
 	const parentContext = useStyleContext();
 	useStyleContextProvide(computed(() => {
@@ -64,18 +104,7 @@ const StyleProvider = defineComponent((props, { slots }) => {
 	return () => {
 		return slots?.default?.();
 	};
-}, { props: [
-	"cache",
-	"hashPriority",
-	"defaultCache",
-	"autoClear",
-	"layer",
-	"linters",
-	"container",
-	"mock",
-	"ssrInline",
-	"transformers"
-] });
+}, { props: styleContextProps });
 
 //#endregion
 export { ATTR_CACHE_PATH, ATTR_MARK, ATTR_TOKEN, CSS_IN_JS_INSTANCE, StyleProvider, createCache, provideStyleContext, useStyleContext, useStyleContextProvide };

package/dist/hooks/useGlobalCache.mjs

@@ -10,7 +10,7 @@ const effectMap = /* @__PURE__ */ new Map();
 * 用于解决 Vue Transition 动画期间样式被过早移除的问题
 */
 const REMOVE_STYLE_DELAY = 500;
-const delayedRemoveTimers = /* @__PURE__ */ new Map();
+const delayedRemoveInfo = /* @__PURE__ */ new Map();
 /**
 * Global cache for CSS-in-JS styles
 *
@@ -33,29 +33,45 @@ function useGlobalCache(prefix, keyPath, cacheFn, onCacheRemove, onCacheEffect)
 	const isServerSide = () => styleContext.value.mock !== void 0 ? styleContext.value.mock === "server" : !isClientSide;
 	const clearCache = (pathStr, immediate = false) => {
 		if (isServerSide()) return;
-		const existingTimer = delayedRemoveTimers.get(pathStr);
-		if (existingTimer) {
-			clearTimeout(existingTimer);
-			delayedRemoveTimers.delete(pathStr);
-		}
-		const doCleanup = () => {
+		const doSingleDecrement = () => {
 			globalCache().opUpdate(pathStr, (prevCache) => {
 				const [times = 0, cache] = prevCache || [];
-				if (times - 1 === 0) {
+				const nextCount = times - 1;
+				if (nextCount === 0) {
 					onCacheRemove?.(cache, false);
 					effectMap.delete(pathStr);
 					return null;
 				}
-				return [times - 1, cache];
+				return [nextCount, cache];
 			});
 		};
-		if (immediate || !isClientSide) doCleanup();
+		const doAllPendingDecrements = (count) => {
+			for (let i = 0; i < count; i++) doSingleDecrement();
+		};
+		if (immediate || !isClientSide) doSingleDecrement();
 		else {
-			const timer = setTimeout(() => {
-				delayedRemoveTimers.delete(pathStr);
-				doCleanup();
-			}, REMOVE_STYLE_DELAY);
-			delayedRemoveTimers.set(pathStr, timer);
+			const existingInfo = delayedRemoveInfo.get(pathStr);
+			if (existingInfo) {
+				clearTimeout(existingInfo.timer);
+				const newPendingDecrements = existingInfo.pendingDecrements + 1;
+				const timer = setTimeout(() => {
+					delayedRemoveInfo.delete(pathStr);
+					doAllPendingDecrements(newPendingDecrements);
+				}, REMOVE_STYLE_DELAY);
+				delayedRemoveInfo.set(pathStr, {
+					timer,
+					pendingDecrements: newPendingDecrements
+				});
+			} else {
+				const timer = setTimeout(() => {
+					delayedRemoveInfo.delete(pathStr);
+					doSingleDecrement();
+				}, REMOVE_STYLE_DELAY);
+				delayedRemoveInfo.set(pathStr, {
+					timer,
+					pendingDecrements: 1
+				});
+			}
 		}
 	};
 	const cacheContent = computed(() => {
@@ -72,12 +88,33 @@ function useGlobalCache(prefix, keyPath, cacheFn, onCacheRemove, onCacheEffect)
 	watch(fullPathStr, (newPath, oldPath) => {
 		if (oldPath) clearCache(oldPath, true);
 		currentPathRef.value = newPath;
-		const existingTimer = delayedRemoveTimers.get(newPath);
-		if (existingTimer) {
-			clearTimeout(existingTimer);
-			delayedRemoveTimers.delete(newPath);
-		}
-		globalCache().opUpdate(newPath, (prevCache) => {
+		const existingInfo = delayedRemoveInfo.get(newPath);
+		if (existingInfo) {
+			const newPendingDecrements = existingInfo.pendingDecrements - 1;
+			if (newPendingDecrements <= 0) {
+				clearTimeout(existingInfo.timer);
+				delayedRemoveInfo.delete(newPath);
+			} else {
+				clearTimeout(existingInfo.timer);
+				const timer = setTimeout(() => {
+					delayedRemoveInfo.delete(newPath);
+					for (let i = 0; i < newPendingDecrements; i++) globalCache().opUpdate(newPath, (prevCache) => {
+						const [times = 0, cache] = prevCache || [];
+						const nextCount = times - 1;
+						if (nextCount === 0) {
+							onCacheRemove?.(cache, false);
+							effectMap.delete(newPath);
+							return null;
+						}
+						return [nextCount, cache];
+					});
+				}, REMOVE_STYLE_DELAY);
+				delayedRemoveInfo.set(newPath, {
+					timer,
+					pendingDecrements: newPendingDecrements
+				});
+			}
+		} else globalCache().opUpdate(newPath, (prevCache) => {
 			const [times = 0, cache] = prevCache || [void 0, void 0];
 			const mergedCache = cache || cacheFn();
 			return [times + 1, mergedCache];

package/package.json

@@ -1,8 +1,13 @@
 {
   "name": "@antdv-next/cssinjs",
   "type": "module",
-  "version": "1.0.0-rc.2",
+  "version": "1.0.0",
   "description": "cssinjs solution for ant-design-vue",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/antdv-next/antdv-next.git",
+    "directory": "packages/cssinjs"
+  },
   "exports": {
     ".": {
       "types": "./dist/index.d.mts",
@@ -30,7 +35,7 @@
   "dependencies": {
     "@emotion/hash": "^0.8.0",
     "@emotion/unitless": "^0.7.5",
-    "@v-c/util": "^1.0.9",
+    "@v-c/util": "^1.0.11",
     "csstype": "^3.2.3",
     "defu": "^6.1.4",
     "stylis": "^4.3.6"