@anjianshi/utils 3.0.6 → 3.0.7

package/env-react/emotion.d.ts

@@ -4,16 +4,19 @@
  *
  * 使用前提：
  * 1. 只支持浏览器渲染
- * 2. 调用 getEmotionCacheProvider()，传入来自 @emotion/react 的 withEmotionCache 函数，
- *    并用得到的 EmotionCacheProvider 组件包裹 App 根元素
+ * 2. 使用 EmotionCacheProvider 组件包裹 App 根元素
+ * 3. vite config 需配置 `optimizeDeps: { extensions: ['.jsx'] }`。
+ *    因为此文件是 jsx 文件，@vitejs/plugin-react-swc 无法处理此文件对其他类库的引用，
+ *    需要 vite 对引用进行转换，不然会引不到类库内容。
+ *    详见：https://github.com/vitejs/vite/issues/12172
  *
  * 来自：
  * https://github.com/emotion-js/emotion/issues/1853#issuecomment-623349622
  */
-import type { EmotionCache, withEmotionCache as withEmotionCacheT } from '@emotion/react';
+import { type EmotionCache } from '@emotion/react';
 import { type CSSInterpolation } from '@emotion/serialize';
 export declare const useEmotionCache: () => EmotionCache | undefined;
-export declare function getEmotionCacheProvider(withEmotionCache: typeof withEmotionCacheT): import("react").FC<{
+export declare const EmotionCacheProvider: import("react").FC<{
     children: React.ReactNode;
 } & import("react").RefAttributes<any>> | import("react").ForwardRefExoticComponent<{
     children: React.ReactNode;

package/env-react/emotion.jsx

@@ -1,13 +1,27 @@
+/**
+ * 通过 React Hook 把 emotion css 转换成 className
+ * （不再需要 <ClassName>）
+ *
+ * 使用前提：
+ * 1. 只支持浏览器渲染
+ * 2. 使用 EmotionCacheProvider 组件包裹 App 根元素
+ * 3. vite config 需配置 `optimizeDeps: { extensions: ['.jsx'] }`。
+ *    因为此文件是 jsx 文件，@vitejs/plugin-react-swc 无法处理此文件对其他类库的引用，
+ *    需要 vite 对引用进行转换，不然会引不到类库内容。
+ *    详见：https://github.com/vitejs/vite/issues/12172
+ *
+ * 来自：
+ * https://github.com/emotion-js/emotion/issues/1853#issuecomment-623349622
+ */
+import { withEmotionCache } from '@emotion/react';
 import { serializeStyles } from '@emotion/serialize';
 import { insertStyles } from '@emotion/utils';
 import { createContext, useContext, useCallback } from 'react';
 const CacheContext = createContext(undefined);
 export const useEmotionCache = () => useContext(CacheContext);
-export function getEmotionCacheProvider(withEmotionCache) {
-    return withEmotionCache(({ children }, cache) => {
-        return <CacheContext.Provider value={cache}>{children}</CacheContext.Provider>;
-    });
-}
+export const EmotionCacheProvider = withEmotionCache(({ children }, cache) => {
+    return <CacheContext.Provider value={cache}>{children}</CacheContext.Provider>;
+});
 export function useEmotionClassName() {
     const cache = useEmotionCache();
     return useCallback((...args) => {

package/env-react/hooks.js

@@ -1,4 +1,4 @@
-import { useRef, useCallback } from 'react';
+import { useState, useEffect, useRef, useCallback } from 'react';
 /**
  * 生成一个 state 以及与其值同步的 ref
  */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@anjianshi/utils",
-  "version": "3.0.6",
+  "version": "3.0.7",
   "description": "Common JavaScript Utils",
   "homepage": "https://github.com/anjianshi/js-packages/utils",
   "bugs": {
@@ -31,12 +31,12 @@
     "redis": "^5.5.6",
     "typescript": "^5.8.3",
     "vconsole": "^3.15.1",
-    "@anjianshi/presets-eslint-node": "6.0.0",
     "@anjianshi/presets-prettier": "3.0.5",
-    "@anjianshi/presets-eslint-typescript": "6.0.0",
+    "@anjianshi/presets-eslint-node": "6.0.0",
     "@anjianshi/presets-eslint-react": "6.0.0",
+    "@anjianshi/presets-typescript": "3.2.5",
     "@anjianshi/presets-eslint-base": "6.0.0",
-    "@anjianshi/presets-typescript": "3.2.5"
+    "@anjianshi/presets-eslint-typescript": "6.0.0"
   },
   "peerDependencies": {
     "@emotion/react": "^11.14.0",