motion.js 1.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051
  1. "use strict";
  2. Object.defineProperty(exports, "__esModule", {
  3. value: true
  4. });
  5. exports.default = void 0;
  6. var _cssinjs = require("@ant-design/cssinjs");
  7. var _motion = require("../../style/motion");
  8. // =========================== Motion ===========================
  9. const genMotionStyle = token => {
  10. const {
  11. componentCls
  12. } = token;
  13. const uploadAnimateInlineIn = new _cssinjs.Keyframes('uploadAnimateInlineIn', {
  14. from: {
  15. width: 0,
  16. height: 0,
  17. padding: 0,
  18. opacity: 0,
  19. margin: token.calc(token.marginXS).div(-2).equal()
  20. }
  21. });
  22. const uploadAnimateInlineOut = new _cssinjs.Keyframes('uploadAnimateInlineOut', {
  23. to: {
  24. width: 0,
  25. height: 0,
  26. padding: 0,
  27. opacity: 0,
  28. margin: token.calc(token.marginXS).div(-2).equal()
  29. }
  30. });
  31. const inlineCls = `${componentCls}-animate-inline`;
  32. return [{
  33. [`${componentCls}-wrapper`]: {
  34. [`${inlineCls}-appear, ${inlineCls}-enter, ${inlineCls}-leave`]: {
  35. animationDuration: token.motionDurationSlow,
  36. animationTimingFunction: token.motionEaseInOutCirc,
  37. animationFillMode: 'forwards'
  38. },
  39. [`${inlineCls}-appear, ${inlineCls}-enter`]: {
  40. animationName: uploadAnimateInlineIn
  41. },
  42. [`${inlineCls}-leave`]: {
  43. animationName: uploadAnimateInlineOut
  44. }
  45. }
  46. }, {
  47. [`${componentCls}-wrapper`]: (0, _motion.initFadeMotion)(token)
  48. }, uploadAnimateInlineIn, uploadAnimateInlineOut];
  49. };
  50. var _default = exports.default = genMotionStyle;