amis-rpc-design/node_modules/antd/lib/style/motion/slide.js

150 lines
3.5 KiB
JavaScript
Raw Normal View History

2023-10-07 19:42:30 +08:00
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.slideUpOut = exports.slideUpIn = exports.slideRightOut = exports.slideRightIn = exports.slideLeftOut = exports.slideLeftIn = exports.slideDownOut = exports.slideDownIn = exports.initSlideMotion = void 0;
var _cssinjs = require("@ant-design/cssinjs");
var _motion = require("./motion");
const slideUpIn = exports.slideUpIn = new _cssinjs.Keyframes('antSlideUpIn', {
'0%': {
transform: 'scaleY(0.8)',
transformOrigin: '0% 0%',
opacity: 0
},
'100%': {
transform: 'scaleY(1)',
transformOrigin: '0% 0%',
opacity: 1
}
});
const slideUpOut = exports.slideUpOut = new _cssinjs.Keyframes('antSlideUpOut', {
'0%': {
transform: 'scaleY(1)',
transformOrigin: '0% 0%',
opacity: 1
},
'100%': {
transform: 'scaleY(0.8)',
transformOrigin: '0% 0%',
opacity: 0
}
});
const slideDownIn = exports.slideDownIn = new _cssinjs.Keyframes('antSlideDownIn', {
'0%': {
transform: 'scaleY(0.8)',
transformOrigin: '100% 100%',
opacity: 0
},
'100%': {
transform: 'scaleY(1)',
transformOrigin: '100% 100%',
opacity: 1
}
});
const slideDownOut = exports.slideDownOut = new _cssinjs.Keyframes('antSlideDownOut', {
'0%': {
transform: 'scaleY(1)',
transformOrigin: '100% 100%',
opacity: 1
},
'100%': {
transform: 'scaleY(0.8)',
transformOrigin: '100% 100%',
opacity: 0
}
});
const slideLeftIn = exports.slideLeftIn = new _cssinjs.Keyframes('antSlideLeftIn', {
'0%': {
transform: 'scaleX(0.8)',
transformOrigin: '0% 0%',
opacity: 0
},
'100%': {
transform: 'scaleX(1)',
transformOrigin: '0% 0%',
opacity: 1
}
});
const slideLeftOut = exports.slideLeftOut = new _cssinjs.Keyframes('antSlideLeftOut', {
'0%': {
transform: 'scaleX(1)',
transformOrigin: '0% 0%',
opacity: 1
},
'100%': {
transform: 'scaleX(0.8)',
transformOrigin: '0% 0%',
opacity: 0
}
});
const slideRightIn = exports.slideRightIn = new _cssinjs.Keyframes('antSlideRightIn', {
'0%': {
transform: 'scaleX(0.8)',
transformOrigin: '100% 0%',
opacity: 0
},
'100%': {
transform: 'scaleX(1)',
transformOrigin: '100% 0%',
opacity: 1
}
});
const slideRightOut = exports.slideRightOut = new _cssinjs.Keyframes('antSlideRightOut', {
'0%': {
transform: 'scaleX(1)',
transformOrigin: '100% 0%',
opacity: 1
},
'100%': {
transform: 'scaleX(0.8)',
transformOrigin: '100% 0%',
opacity: 0
}
});
const slideMotion = {
'slide-up': {
inKeyframes: slideUpIn,
outKeyframes: slideUpOut
},
'slide-down': {
inKeyframes: slideDownIn,
outKeyframes: slideDownOut
},
'slide-left': {
inKeyframes: slideLeftIn,
outKeyframes: slideLeftOut
},
'slide-right': {
inKeyframes: slideRightIn,
outKeyframes: slideRightOut
}
};
const initSlideMotion = (token, motionName) => {
const {
antCls
} = token;
const motionCls = `${antCls}-${motionName}`;
const {
inKeyframes,
outKeyframes
} = slideMotion[motionName];
return [(0, _motion.initMotion)(motionCls, inKeyframes, outKeyframes, token.motionDurationMid), {
[`
${motionCls}-enter,
${motionCls}-appear
`]: {
transform: 'scale(0)',
transformOrigin: '0% 0%',
opacity: 0,
animationTimingFunction: token.motionEaseOutQuint,
[`&-prepare`]: {
transform: 'scale(1)'
}
},
[`${motionCls}-leave`]: {
animationTimingFunction: token.motionEaseInQuint
}
}];
};
exports.initSlideMotion = initSlideMotion;