ant-design/components/_util/motion.ts
renovate[bot] 863f61d908
chore(deps): update dependency eslint to v9 (#50690)
Co-authored-by: afc163 <afc163@gmail.com>
2024-09-19 03:30:19 +08:00

43 lines
1.6 KiB
TypeScript

import type { CSSMotionProps, MotionEndEventHandler, MotionEventHandler } from 'rc-motion';
import type { MotionEvent } from 'rc-motion/lib/interface';
import { defaultPrefixCls } from '../config-provider';
// ================== Collapse Motion ==================
const getCollapsedHeight: MotionEventHandler = () => ({ height: 0, opacity: 0 });
const getRealHeight: MotionEventHandler = (node) => {
const { scrollHeight } = node;
return { height: scrollHeight, opacity: 1 };
};
const getCurrentHeight: MotionEventHandler = (node) => ({ height: node ? node.offsetHeight : 0 });
const skipOpacityTransition: MotionEndEventHandler = (_, event: MotionEvent) =>
event?.deadline === true || (event as TransitionEvent).propertyName === 'height';
const initCollapseMotion = (rootCls = defaultPrefixCls): CSSMotionProps => ({
motionName: `${rootCls}-motion-collapse`,
onAppearStart: getCollapsedHeight,
onEnterStart: getCollapsedHeight,
onAppearActive: getRealHeight,
onEnterActive: getRealHeight,
onLeaveStart: getCurrentHeight,
onLeaveActive: getCollapsedHeight,
onAppearEnd: skipOpacityTransition,
onEnterEnd: skipOpacityTransition,
onLeaveEnd: skipOpacityTransition,
motionDeadline: 500,
});
const _SelectPlacements = ['bottomLeft', 'bottomRight', 'topLeft', 'topRight'] as const;
export type SelectCommonPlacement = (typeof _SelectPlacements)[number];
const getTransitionName = (rootPrefixCls: string, motion: string, transitionName?: string) => {
if (transitionName !== undefined) {
return transitionName;
}
return `${rootPrefixCls}-${motion}`;
};
export { getTransitionName };
export default initCollapseMotion;