From 29ebad2fcf0b302dd1c3959c8afc683e773feb28 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=F0=9F=8F=8E=EF=B8=8F=20Yumo?= <yumo.imer@gmail.com>
Date: Fri, 23 Aug 2024 16:17:37 +0800
Subject: [PATCH] fix: genStyleUtils doesn't work when realToken is undefined
fix: getCompUnitless type error
---
src/hooks/useToken.ts | 10 ++++++++--
src/util/genStyleUtils.tsx | 37 +++++++++++++++++++++++++++++--------
2 files changed, 37 insertions(+), 10 deletions(-)
diff --git a/src/hooks/useToken.ts b/src/hooks/useToken.ts
index 1349eae..eaf8c89 100644
--- a/src/hooks/useToken.ts
+++ b/src/hooks/useToken.ts
@@ -21,11 +21,17 @@ export interface UseTokenReturn<
DesignToken extends TokenType,
> {
token: GlobalToken<CompTokenMap, AliasToken>;
- realToken?: GlobalToken<CompTokenMap, AliasToken>;
theme?: Theme<DesignToken, AliasToken>;
- components?: TokenMapWithTheme<CompTokenMap, DesignToken, AliasToken>;
hashId?: string;
+ components?: TokenMapWithTheme<CompTokenMap, DesignToken, AliasToken>;
hashed?: string | boolean;
+ /**
+ * @warring dev only: css var token object. If you use `useToken` in production, you should use `token` instead.
+ */
+ realToken?: GlobalToken<CompTokenMap, AliasToken>;
+ /**
+ * @warring dev only: css var options object. If you use `useToken` in production, do not use it.
+ */
cssVar?: {
prefix?: string;
key?: string;
diff --git a/src/util/genStyleUtils.tsx b/src/util/genStyleUtils.tsx
index fcf0833..9379b9f 100644
--- a/src/util/genStyleUtils.tsx
+++ b/src/util/genStyleUtils.tsx
@@ -10,6 +10,7 @@ import type {
TokenMap,
TokenMapKey,
UseComponentStyleResult,
+ GlobalToken,
} from '../interface';
import type AbstractCalculator from './calc/calculator';
@@ -91,12 +92,10 @@ export type CSSVarRegisterProps = {
export type GetResetStyles<AliasToken extends TokenType> = (token: AliasToken) => CSSInterpolation;
-export type GetCompUnitless<CompTokenMap extends TokenMap, AliasToken extends TokenType> = <
- C extends TokenMapKey<CompTokenMap>,
->(
- component: C | [C, string],
+export type GetCompUnitless<CompTokenMap extends TokenMap, AliasToken extends TokenType> = (
+ component?: TokenMapKey<CompTokenMap> | [TokenMapKey<CompTokenMap>, string],
) => {
- [key in ComponentTokenKey<CompTokenMap, AliasToken, C>]: boolean;
+ [key in keyof AliasToken]?: boolean;
};
function genStyleUtils<
@@ -221,7 +220,12 @@ function genStyleUtils<
const { unitless: compUnitless, injectStyle = true, prefixToken, ignore } = options;
const CSSVarRegister: React.FC<Readonly<CSSVarRegisterProps>> = ({ rootCls, cssVar = {} }) => {
- const { realToken } = useToken();
+ const {
+ /**
+ * @warring dev only, detail see {@link UseTokenReturn.realToken}
+ */
+ realToken = {} as GlobalToken<CompTokenMap, AliasToken>,
+ } = useToken();
useCSSVarRegister(
{
path: [component],
@@ -257,7 +261,12 @@ function genStyleUtils<
};
const useCSSVar = (rootCls: string) => {
- const { cssVar } = useToken();
+ const {
+ /**
+ * @warring dev only, detail see {@link UseTokenReturn.cssVar}
+ */
+ cssVar,
+ } = useToken();
return [
(node: React.ReactElement): React.ReactElement =>
@@ -311,7 +320,19 @@ function genStyleUtils<
// Return new style hook
return (prefixCls: string, rootCls: string = prefixCls): UseComponentStyleResult => {
- const { theme, realToken, hashId, token, cssVar } = useToken();
+ const {
+ theme,
+ hashId,
+ token,
+ /**
+ * @warring dev only, detail see {@link UseTokenReturn.realToken}
+ */
+ realToken = {} as GlobalToken<CompTokenMap, AliasToken>,
+ /**
+ * @warring dev only, detail see {@link UseTokenReturn.cssVar}
+ */
+ cssVar,
+ } = useToken();
const { rootPrefixCls, iconPrefixCls } = usePrefix();
const csp = useCSP();