🏷️ fix: 修正类型定义不匹配的问题

src/factories/createStyles/index.ts

@@ -5,40 +5,48 @@ import type {
   BaseReturnType,
   ClassNamesUtil,
   CSSObject,
+  HashPriority,
   ResponsiveUtil,
   ReturnStyleToUse,
+  UseTheme,
 } from '@/types';
 import { isReactCssResult } from '@/utils';
 
-import { Emotion } from '@emotion/css/create-instance';
+import { createUseTheme } from '@/factories/createUseTheme';
+import { Emotion, EmotionCache } from '@emotion/css/create-instance';
 import { convertResponsiveStyleToString, useMediaQueryMap } from './response';
 import { ReturnStyles, StyleOrGetStyleFn } from './types';
 
 interface CreateStylesFactory {
-  useEmotion: () => Emotion;
-  useTheme?: any;
-  initParams?: any;
+  cache: EmotionCache;
+  cx: Emotion['cx'];
+  styledUseTheme?: UseTheme;
+  hashPriority?: HashPriority;
+}
+
+export interface CreateStyleOptions {
+  hashPriority?: HashPriority;
 }
 
 /**
  * 创建样式基础写法
  */
 export const createStylesFactory =
-  ({ useEmotion, useTheme, initParams }: CreateStylesFactory) =>
+  ({ styledUseTheme, hashPriority, cache, cx: emotionCX }: CreateStylesFactory) =>
   <Props, Input extends BaseReturnType = BaseReturnType>(
     styleOrGetStyle: StyleOrGetStyleFn<Input, Props>,
   ) =>
-  (props?: Props, options?: any): ReturnStyles<Input> => {
+  (props?: Props, options?: CreateStyleOptions): ReturnStyles<Input> => {
+    const useTheme = createUseTheme(styledUseTheme);
     const theme = useTheme();
 
     const responsiveMap = useMediaQueryMap();
-    const { cx, cache } = useEmotion();
 
-    const css = createClassNameGenerator(cache, options?.hashPriority || initParams?.hashPriority);
+    const css = createClassNameGenerator(cache, options?.hashPriority || hashPriority);
 
     // 由于使用了 reactCss 作为基础样式工具，因此在使用 cx 级联 className 时需要使用特殊处理的 cx
     // 要将 reactCss 的产出转为 css 产物
-    const cxUtil: ClassNamesUtil = createCX(css, cx);
+    const cxUtil: ClassNamesUtil = createCX(css, emotionCX);
 
     const styles = useMemo(() => {
       let tempStyles: ReturnStyleToUse<Input>;

src/factories/createThemeProvider/AntdProvider.tsx

@@ -1,9 +1,8 @@
-import { ConfigProvider, message, Modal, notification, theme } from 'antd';
+import { ConfigProvider, message, Modal, notification, theme, ThemeConfig } from 'antd';
 import { memo, useEffect, useMemo, type FC } from 'react';
 
 import { useThemeMode } from '@/hooks';
-import { ThemeConfig } from 'antd/es/config-provider/context';
-import type { ThemeProviderProps } from './index';
+import type { ThemeProviderProps } from './type';
 
 type AntdProviderProps = Pick<
   ThemeProviderProps<any>,

src/factories/createThemeProvider/ThemeSwitcher.tsx

@@ -11,7 +11,7 @@ import {
 import useControlledState from 'use-merge-value';
 
 import { ThemeModeContext } from '@/context';
-import { Theme, ThemeAppearance, ThemeMode } from '@/types';
+import { ThemeAppearance, ThemeMode, UseTheme } from '@/types';
 
 let darkThemeMatch: MediaQueryList;
 
@@ -70,7 +70,7 @@ export interface ThemeSwitcherProps {
   themeMode?: ThemeMode;
 
   children: ReactNode;
-  useTheme: () => Theme;
+  useTheme: UseTheme;
 }
 
 const ThemeSwitcher: FC<ThemeSwitcherProps> = memo(

src/factories/createThemeProvider/index.tsx

@@ -1,5 +1,6 @@
 import { ReactElement } from 'react';
 
+import { UseTheme } from '@/types';
 import AntdProvider from './AntdProvider';
 import ThemeSwitcher from './ThemeSwitcher';
 import TokenContainer from './TokenContainer';
@@ -10,7 +11,7 @@ export * from './type';
 export const createThemeProvider =
   (
     defaultStyledThemeProvider: StyledThemeProvider,
-    defaultUseTheme,
+    defaultUseTheme: UseTheme,
   ): (<T = any, S = any>(props: ThemeProviderProps<T, S>) => ReactElement | null) =>
   ({
     children,

src/factories/createUseTheme.ts

@@ -1,13 +1,13 @@
-import { Theme } from '@/types';
+import { Theme, UseTheme } from '@/types';
 import { useMemo } from 'react';
 
 import { useAntdTheme } from '@/hooks/useAntdTheme';
 import { useThemeMode } from '@/hooks/useThemeMode';
 
-export const createUseTheme = (useDefaultTheme: () => any) => (): Theme => {
+export const createUseTheme = (useDefaultTheme?: UseTheme) => (): Theme => {
   const antdTheme = useAntdTheme();
   const themeState = useThemeMode();
-  const defaultTheme = useDefaultTheme();
+  const defaultTheme = useDefaultTheme ? useDefaultTheme() : {};
 
   const initTheme = useMemo<Theme>(
     () => ({ ...antdTheme, ...themeState, prefixCls: 'ant' }),

src/functions/createInstance.ts

@@ -45,7 +45,7 @@ interface CreateOptions<T = any> {
 export const createInstance = <T = any>(options: CreateOptions<T>) => {
   const defaultKey = options.key || 'ant-css';
 
-  const innerUseTheme = (options.styled?.useTheme || defaultUseTheme) as () => Theme;
+  const styledUseTheme = (options.styled?.useTheme || defaultUseTheme) as () => Theme;
 
   const defaultThemeProvider = (options.styled?.ThemeProvider ||
     PedestalProvider) as StyledThemeProvider;
@@ -60,12 +60,14 @@ export const createInstance = <T = any>(options: CreateOptions<T>) => {
   const classNameGenerator = createClassNameGenerator(cache, options.hashPriority);
   const cx = createCX(classNameGenerator, emotion.cx);
 
-  const useTheme = createUseTheme(innerUseTheme);
+  const useTheme = createUseTheme(styledUseTheme);
 
   const createStyles = createStylesFactory({
-    useEmotion: () => emotion,
-    initParams: { hashPriority: options.hashPriority },
-    useTheme,
+    cache,
+    cx: emotion.cx,
+    styledUseTheme,
+
+    hashPriority: options.hashPriority,
   });
 
   const createGlobalStyle = createGlobalStyleFactory(useTheme);

src/types/function.ts

@@ -1,13 +1,14 @@
-import { ThemeConfig } from 'antd/es/config-provider/context';
+import { ThemeConfig } from 'antd';
 
 import { ThemeAppearance } from './appearance';
 import { ClassNamesUtil, CssUtil, SerializedStyles } from './css';
 import { AtomInputType } from './genericUtils';
 import { ResponsiveKey } from './response';
-import type { AntdStylish, AntdToken, AppearanceState, FullToken } from './theme';
+import type { AntdStylish, AntdToken, AppearanceState, FullToken, Theme } from './theme';
 
 export type BreakpointMapParams = Partial<Record<ResponsiveKey, AtomInputType>>;
 
+export type UseTheme = () => Theme;
 /**
  * 响应式断点工具函数
  */