ant-design/components/notification/util.ts
typenoob 3dad73ff2f
fix: make closeIcon in useNotification work (#52494) (#52516)
* fix: make closeIcon in useNotification work (#52494)

* refactor: strip judge logic into getCloseIconConfig function
2025-01-21 18:02:37 +08:00

85 lines
1.7 KiB
TypeScript

import type * as React from 'react';
import type { CSSMotionProps } from 'rc-motion';
import type { NotificationConfig, NotificationPlacement } from './interface';
import type { NotificationConfig as CPNotificationConfig } from '../config-provider/context';
export function getPlacementStyle(placement: NotificationPlacement, top: number, bottom: number) {
let style: React.CSSProperties;
switch (placement) {
case 'top':
style = {
left: '50%',
transform: 'translateX(-50%)',
right: 'auto',
top,
bottom: 'auto',
};
break;
case 'topLeft':
style = {
left: 0,
top,
bottom: 'auto',
};
break;
case 'topRight':
style = {
right: 0,
top,
bottom: 'auto',
};
break;
case 'bottom':
style = {
left: '50%',
transform: 'translateX(-50%)',
right: 'auto',
top: 'auto',
bottom,
};
break;
case 'bottomLeft':
style = {
left: 0,
top: 'auto',
bottom,
};
break;
default:
style = {
right: 0,
top: 'auto',
bottom,
};
break;
}
return style;
}
export function getMotion(prefixCls: string): CSSMotionProps {
return {
motionName: `${prefixCls}-fade`,
};
}
export function getCloseIconConfig(
closeIcon: React.ReactNode,
notificationConfig?: NotificationConfig,
notification?: CPNotificationConfig,
) {
if (typeof closeIcon !== 'undefined') {
return closeIcon;
}
if (typeof notificationConfig?.closeIcon !== 'undefined') {
return notificationConfig.closeIcon;
}
return notification?.closeIcon;
}