diff --git a/README.md b/README.md
index a94d1a9..ab3f462 100644
--- a/README.md
+++ b/README.md
@@ -2,8 +2,7 @@
 
 ## About
 
-🚨 Sample code in `styles/` use antd internal `genComponentStyleHook` to generate style hook.
-It's only to simplify the dependency of this repo which is **not recommend** to use internal API in real world.
+Sample code in `styles/styleUtil` copy the antd `genComponentStyleHook` function.
 You can use any other css-in-js solution to generate style hook like `Emotion` or `styled-components`.
 
 ## Usage
diff --git a/package.json b/package.json
index 121df72..7074bf9 100644
--- a/package.json
+++ b/package.json
@@ -40,7 +40,7 @@
     "@types/react-dom": "^16.9.0"
   },
   "dependencies": {
-    "@ant-design/cssinjs": "^1.16.1",
+    "@ant-design/cssinjs": "^1.17.0",
     "@babel/runtime": "^7.18.3",
     "@ctrl/tinycolor": "^3.6.0",
     "classnames": "^2.3.2",
diff --git a/src/Text/style.ts b/src/Text/style.ts
index 50a1da8..0525db4 100644
--- a/src/Text/style.ts
+++ b/src/Text/style.ts
@@ -2,7 +2,7 @@ import {
   type GenerateStyle,
   genComponentStyleHook,
   type FullToken,
-} from 'antd/es/theme/internal';
+} from '../styles/styleUtil';
 
 import { background } from '../styles/gradientUtil';
 import { DOT_PREFIX } from '../constant';
diff --git a/src/styles/buttonStyle.ts b/src/styles/buttonStyle.ts
index 9a7dbf9..c00ed43 100644
--- a/src/styles/buttonStyle.ts
+++ b/src/styles/buttonStyle.ts
@@ -2,7 +2,7 @@ import {
   type GenerateStyle,
   genComponentStyleHook,
   type FullToken,
-} from 'antd/es/theme/internal';
+} from './styleUtil';
 
 import {
   getAnimationBackground,
diff --git a/src/styles/cardStyle.ts b/src/styles/cardStyle.ts
index 8fde8f1..035bdb9 100644
--- a/src/styles/cardStyle.ts
+++ b/src/styles/cardStyle.ts
@@ -2,7 +2,7 @@ import {
   type GenerateStyle,
   genComponentStyleHook,
   type FullToken,
-} from 'antd/es/theme/internal';
+} from './styleUtil';
 
 import { getBorderStyle } from './gradientUtil';
 import { DOT_PREFIX } from '../constant';
diff --git a/src/styles/checkboxStyle.ts b/src/styles/checkboxStyle.ts
index 632da8a..87be607 100644
--- a/src/styles/checkboxStyle.ts
+++ b/src/styles/checkboxStyle.ts
@@ -2,7 +2,7 @@ import {
   type GenerateStyle,
   genComponentStyleHook,
   type FullToken,
-} from 'antd/es/theme/internal';
+} from './styleUtil';
 
 import { background, getBorderStyle } from './gradientUtil';
 import { DOT_PREFIX } from '../constant';
diff --git a/src/styles/dividerStyle.ts b/src/styles/dividerStyle.ts
index 7941b78..def2df0 100644
--- a/src/styles/dividerStyle.ts
+++ b/src/styles/dividerStyle.ts
@@ -2,7 +2,7 @@ import {
   type GenerateStyle,
   genComponentStyleHook,
   type FullToken,
-} from 'antd/es/theme/internal';
+} from './styleUtil';
 
 import { background } from './gradientUtil';
 import { DOT_PREFIX } from '../constant';
diff --git a/src/styles/radioStyle.ts b/src/styles/radioStyle.ts
index ae8b3e4..aa0005f 100644
--- a/src/styles/radioStyle.ts
+++ b/src/styles/radioStyle.ts
@@ -1,4 +1,4 @@
-import { genComponentStyleHook } from 'antd/es/theme/internal';
+import { genComponentStyleHook } from './styleUtil';
 
 import { genStyle } from './checkboxStyle';
 
diff --git a/src/styles/spinStyle.ts b/src/styles/spinStyle.ts
index e164746..3f80387 100644
--- a/src/styles/spinStyle.ts
+++ b/src/styles/spinStyle.ts
@@ -2,7 +2,7 @@ import {
   type GenerateStyle,
   genComponentStyleHook,
   type FullToken,
-} from 'antd/es/theme/internal';
+} from './styleUtil';
 
 import { background } from './gradientUtil';
 import { DOT_PREFIX } from '../constant';
diff --git a/src/styles/styleUtil.ts b/src/styles/styleUtil.ts
new file mode 100644
index 0000000..8601b6c
--- /dev/null
+++ b/src/styles/styleUtil.ts
@@ -0,0 +1,51 @@
+export * from 'antd/es/theme/internal';
+import { theme as Theme, ConfigProvider, GlobalToken } from 'antd';
+import { CSSInterpolation, useStyleRegister } from '@ant-design/cssinjs';
+import {
+  FullToken,
+  OverrideComponent,
+} from 'antd/es/theme/util/genComponentStyleHook';
+import React from 'react';
+
+// Copy from antd `genComponentStyleHook`, you can use any other CSS-in-JS library instead.
+export function genComponentStyleHook<ComponentName extends OverrideComponent>(
+  componentNames: [ComponentName, string],
+  styleFn: (token: GlobalToken) => CSSInterpolation,
+) {
+  const concatComponent = componentNames.join('-');
+
+  return (prefixCls: string): void => {
+    const { theme, token, hashId } = Theme.useToken();
+    const { getPrefixCls, iconPrefixCls } = React.useContext(
+      ConfigProvider.ConfigContext,
+    );
+    const rootPrefixCls = getPrefixCls();
+
+    // Shared config
+    const sharedConfig: Omit<Parameters<typeof useStyleRegister>[0], 'path'> = {
+      theme,
+      token,
+      hashId,
+    };
+
+    useStyleRegister(
+      { ...sharedConfig, path: [concatComponent, prefixCls, iconPrefixCls] },
+      () => {
+        const componentCls = `.${prefixCls}`;
+
+        const mergedToken = {
+          ...token,
+          componentCls,
+          prefixCls,
+          iconCls: `.${iconPrefixCls}`,
+          antCls: `.${rootPrefixCls}`,
+        };
+
+        const styleInterpolation = styleFn(
+          mergedToken as any as FullToken<ComponentName>,
+        );
+        return styleInterpolation;
+      },
+    );
+  };
+}
diff --git a/src/styles/switchStyle.ts b/src/styles/switchStyle.ts
index d8d4627..c4480e3 100644
--- a/src/styles/switchStyle.ts
+++ b/src/styles/switchStyle.ts
@@ -2,7 +2,7 @@ import {
   type GenerateStyle,
   genComponentStyleHook,
   type FullToken,
-} from 'antd/es/theme/internal';
+} from './styleUtil';
 
 import { background } from './gradientUtil';
 import { DOT_PREFIX } from '../constant';
diff --git a/src/styles/tagStyle.ts b/src/styles/tagStyle.ts
index f8932df..18f303a 100644
--- a/src/styles/tagStyle.ts
+++ b/src/styles/tagStyle.ts
@@ -2,7 +2,7 @@ import {
   type GenerateStyle,
   genComponentStyleHook,
   type FullToken,
-} from 'antd/es/theme/internal';
+} from './styleUtil';
 
 import { getBackground, getBorderStyle } from './gradientUtil';