test/ant-design
1
0
Fork 0
mirror of https://gitee.com/ant-design/ant-design.git synced 2024-11-30 11:08:45 +08:00
Code Issues Actions 68 Packages Projects Releases Wiki Activity

refactor: empty support css var (#45802)

Browse Source
This commit is contained in:
c0dedance 2023-11-13 14:13:17 +08:00 committed by GitHub
parent 3a0ab9d371
commit 149c89259f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 12 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
components/empty/index.tsx
View File

@ -6,6 +6,7 @@ import DefaultEmptyImg from './empty';
import SimpleEmptyImg from './simple';
import useStyle from './style';
import useCSSVar from './style/cssVar';
const defaultEmptyImg = <DefaultEmptyImg />;
const simpleEmptyImg = <SimpleEmptyImg />;
@ -45,7 +46,8 @@ const Empty: CompoundedComponent = ({
const { getPrefixCls, direction, empty } = React.useContext(ConfigContext);
const prefixCls = getPrefixCls('empty', customizePrefixCls);
const [wrapSSR, hashId] = useStyle(prefixCls);
const [, hashId] = useStyle(prefixCls);
const wrapCSSVar = useCSSVar(prefixCls);
const [locale] = useLocale('Empty');
@ -60,7 +62,7 @@ const Empty: CompoundedComponent = ({
imageNode = image;
}
return wrapSSR(
return wrapCSSVar(
<div
className={classNames(
hashId,

3
components/empty/style/cssVar.ts Normal file
View File

@ -0,0 +1,3 @@
import { genCSSVarRegister } from '../../theme/internal';
export default genCSSVarRegister('Empty', null);

10
components/empty/style/index.ts
View File

@ -7,8 +7,8 @@ export interface ComponentToken {}
interface EmptyToken extends FullToken<'Empty'> {
emptyImgCls: string;
emptyImgHeight: number;
emptyImgHeightSM: number;
emptyImgHeight: number | string;
emptyImgHeightSM: number | string;
emptyImgHeightMD: number;
}
@ -76,13 +76,13 @@ const genSharedEmptyStyle: GenerateStyle<EmptyToken> = (token): CSSObject => {
// ============================== Export ==============================
export default genComponentStyleHook('Empty', (token) => {
const { componentCls, controlHeightLG } = token;
const { componentCls, controlHeightLG, calc } = token;
const emptyToken: EmptyToken = mergeToken<EmptyToken>(token, {
emptyImgCls: `${componentCls}-img`,
emptyImgHeight: controlHeightLG * 2.5,
emptyImgHeight: calc(controlHeightLG).mul(2.5).equal(),
emptyImgHeightMD: controlHeightLG,
emptyImgHeightSM: controlHeightLG * 0.875,
emptyImgHeightSM: calc(controlHeightLG).mul(0.875).equal(),
});
return [genSharedEmptyStyle(emptyToken)];