ant-design/components/popconfirm/style/index.tsx

90 lines
2.0 KiB
TypeScript
Raw Normal View History

import type { FullToken, GenerateStyle, GetDefaultToken } from '../../theme/internal';
import { genStyleHooks } from '../../theme/internal';
2017-02-22 18:10:02 +08:00
export interface ComponentToken {
/**
* @desc z-index
* @descEN z-index of Popconfirm
*/
zIndexPopup: number;
}
export interface PopconfirmToken extends FullToken<'Popconfirm'> {}
// =============================== Base ===============================
const genBaseStyle: GenerateStyle<PopconfirmToken> = (token) => {
const {
componentCls,
iconCls,
antCls,
zIndexPopup,
colorText,
colorWarning,
marginXXS,
marginXS,
fontSize,
fontWeightStrong,
colorTextHeading,
} = token;
return {
[componentCls]: {
zIndex: zIndexPopup,
[`&${antCls}-popover`]: {
fontSize,
},
[`${componentCls}-message`]: {
marginBottom: marginXS,
display: 'flex',
flexWrap: 'nowrap',
alignItems: 'start',
[`> ${componentCls}-message-icon ${iconCls}`]: {
color: colorWarning,
fontSize,
lineHeight: 1,
marginInlineEnd: marginXS,
},
[`${componentCls}-title`]: {
fontWeight: fontWeightStrong,
color: colorTextHeading,
'&:only-child': {
fontWeight: 'normal',
},
},
[`${componentCls}-description`]: {
marginTop: marginXXS,
color: colorText,
},
},
[`${componentCls}-buttons`]: {
textAlign: 'end',
whiteSpace: 'nowrap',
button: {
marginInlineStart: marginXS,
},
},
},
};
};
// ============================== Export ==============================
export const prepareComponentToken: GetDefaultToken<'Popconfirm'> = (token) => {
const { zIndexPopupBase } = token;
return {
zIndexPopup: zIndexPopupBase + 60,
};
};
export default genStyleHooks('Popconfirm', (token) => genBaseStyle(token), prepareComponentToken, {
resetStyle: false,
});