antd
Version:
An enterprise-class UI design language and React components implementation
32 lines • 991 B
JavaScript
const initMotionCommon = duration => ({
animationDuration: duration,
animationFillMode: 'both'
});
export const initMotion = (motionCls, inKeyframes, outKeyframes, duration, sameLevel = false) => {
const sameLevelPrefix = sameLevel ? '&' : '';
return {
[`
${sameLevelPrefix}${motionCls}-enter,
${sameLevelPrefix}${motionCls}-appear
`]: {
...initMotionCommon(duration),
animationPlayState: 'paused'
},
[`${sameLevelPrefix}${motionCls}-leave`]: {
...initMotionCommon(duration),
animationPlayState: 'paused'
},
[`
${sameLevelPrefix}${motionCls}-enter${motionCls}-enter-active,
${sameLevelPrefix}${motionCls}-appear${motionCls}-appear-active
`]: {
animationName: inKeyframes,
animationPlayState: 'running'
},
[`${sameLevelPrefix}${motionCls}-leave${motionCls}-leave-active`]: {
animationName: outKeyframes,
animationPlayState: 'running',
pointerEvents: 'none'
}
};
};