feat: migrate less to token for Message (#42080)

This commit is contained in:
kiner-tang(文辉) 2023-05-04 15:33:49 +08:00 committed by GitHub
parent 629087833f
commit 18b7d1be5b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 23 additions and 8 deletions

View File

@ -10,11 +10,12 @@ export interface ComponentToken {
// Component token here // Component token here
height: number; height: number;
zIndexPopup: number; zIndexPopup: number;
messageNoticeContentBg: string;
messageNoticeContentPadding: string;
} }
interface MessageToken extends FullToken<'Message'> { interface MessageToken extends FullToken<'Message'> {
// Custom token here // Custom token here
messageNoticeContentPadding: string;
} }
const genMessageStyle: GenerateStyle<MessageToken> = (token) => { const genMessageStyle: GenerateStyle<MessageToken> = (token) => {
@ -175,15 +176,15 @@ export default genComponentStyleHook(
'Message', 'Message',
(token) => { (token) => {
// Gen-style functions here // Gen-style functions here
const combinedToken = mergeToken<MessageToken>(token, { const combinedToken = mergeToken<MessageToken>(token, {});
messageNoticeContentPadding: `${
(token.controlHeightLG - token.fontSize * token.lineHeight) / 2
}px ${token.paddingSM}px`,
});
return [genMessageStyle(combinedToken)]; return [genMessageStyle(combinedToken)];
}, },
(token) => ({ (token) => ({
height: 150, height: 150,
zIndexPopup: token.zIndexPopupBase + 10, zIndexPopup: token.zIndexPopupBase + 10,
messageNoticeContentBg: token.colorBgElevated,
messageNoticeContentPadding: `${
(token.controlHeightLG - token.fontSize * token.lineHeight) / 2
}px ${token.paddingSM}px`,
}), }),
); );

View File

@ -59,7 +59,14 @@ This document contains the correspondence between all the less variables related
<!-- ### Menu --> <!-- ### Menu -->
<!-- ### Message --> ## Message
<!-- prettier-ignore -->
| Less variables | Component Token | Note |
| --- | --- | --- |
| `@zindex-message` | `zIndexPopup` | - |
| `@message-notice-content-padding` | `messageNoticeContentPadding` | - |
| `@message-notice-content-bg` | `messageNoticeContentBg` | - |
## Modal ## Modal

View File

@ -59,7 +59,14 @@ title: Less 变量迁移 Design Token
<!-- ### Menu 导航菜单 --> <!-- ### Menu 导航菜单 -->
<!-- ### Message 全局提示 --> ## Message 全局提示
<!-- prettier-ignore -->
| Less 变量 | Component Token | 备注 |
| --- | --- | --- |
| `@zindex-message` | `zIndexPopup` | - |
| `@message-notice-content-padding` | `messageNoticeContentPadding` | - |
| `@message-notice-content-bg` | `messageNoticeContentBg` | - |
### Modal 对话框 ### Modal 对话框