@douyinfe/semi-animation-react 2.24.2 → 2.25.0-alpha.0

package/lib/cjs/src/Transition.js

@@ -4,50 +4,33 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _Animation = _interopRequireDefault(require("./Animation"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _noop = _interopRequireDefault(require("./utils/noop"));
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 var __rest = void 0 && (void 0).__rest || function (s, e) {
   var t = {};
-
   for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
-
   if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
     if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
   }
   return t;
 };
-/* eslint-disable eqeqeq */
-
-
 class Transition extends _react.Component {
   constructor() {
     let props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
     super(props);
-
     this._isControlled = () => [true, false, 'enter', 'leave'].includes(this.props.state);
-
     this.forwardInstance = instance => {
       this.instance = instance;
     };
-
     this.onRest = props => {
       const {
         state
       } = this.state;
-
       if (state === 'enter') {
         this.props.didEnter(props);
       } else if (state === 'leave') {
@@ -57,71 +40,58 @@ class Transition extends _react.Component {
         });
         this.props.didLeave(props);
       }
-
       this.props.onRest(props);
     };
-
     this.onStart = props => {
       const {
         state
       } = this.state;
-
       if (state === 'enter') {
         this.props.willEnter(props);
       } else if (state === 'leave') {
         this.props.willLeave(props);
       }
-
       this.props.onStart(props);
     };
-
     this.state = {
       state: '',
       lastChildren: null,
       currentChildren: null
     };
   }
-
   static getDerivedStateFromProps(props, state) {
     const willUpdateStates = {};
-
-    if (props.children !== state.currentChildren // && (props.children == null || state.currentChildren == null)
+    if (props.children !== state.currentChildren
+    // && (props.children == null || state.currentChildren == null)
     ) {
       willUpdateStates.lastChildren = state.currentChildren;
       willUpdateStates.currentChildren = props.children;
-
       if (props.children == null) {
         willUpdateStates.state = 'leave';
       } else {
         willUpdateStates.state = 'enter';
       }
     }
-
     if (props.state != null) {
       willUpdateStates.state = props.state;
     }
-
     return willUpdateStates;
   }
-
   componentWillUnmount() {
     if (this.instance) {
       this.instance.destroy();
       this.instance = null;
     }
   }
-
   render() {
     const _a = this.props,
-          {
-      from: propsFrom,
-      enter,
-      leave
-    } = _a,
-          restProps = __rest(_a, ["from", "enter", "leave"]);
-
-    let children; // eslint-disable-next-line prefer-const
-
+      {
+        from: propsFrom,
+        enter,
+        leave
+      } = _a,
+      restProps = __rest(_a, ["from", "enter", "leave"]);
+    let children;
     let {
       currentChildren,
       lastChildren,
@@ -129,44 +99,37 @@ class Transition extends _react.Component {
     } = this.state;
     let from = {};
     let to = {};
-
     const isControlled = this._isControlled();
-
     if (isControlled) {
       children = this.props.children;
       state = this.props.state;
     } else if (currentChildren == null && lastChildren == null) {
       return null;
     }
-
     if (state === 'enter') {
       from = propsFrom;
       to = enter;
-
       if (!isControlled) {
         children = currentChildren;
       }
     } else if (state === 'leave') {
       from = enter;
       to = leave;
-
       if (!isControlled) {
         children = lastChildren;
       }
     }
-
     return /*#__PURE__*/_react.default.createElement(_Animation.default, Object.assign({}, restProps, {
       force: true,
       from: from,
       to: to,
       onRest: this.onRest,
       onStart: this.onStart
-    }), props => // eslint-disable-next-line no-nested-ternary
+    }), props =>
+    // eslint-disable-next-line no-nested-ternary
     typeof children === 'function' ? children(props) : /*#__PURE__*/(0, _react.isValidElement)(children) ? children : null);
   }
-
 }
-
 exports.default = Transition;
 Transition.propTypes = {
   children: _propTypes.default.any,

package/lib/cjs/src/utils/invokeFns.js

@@ -4,10 +4,8 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = invokeFns;
-
 function invokeFns(fns) {
   let args = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
-
   if (Array.isArray(fns) && fns.length) {
     fns.forEach(fn => {
       if (typeof fn === 'function') {

package/lib/cjs/src/utils/noop.js

@@ -4,6 +4,4 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = noop;
-
-// eslint-disable-next-line @typescript-eslint/no-empty-function
 function noop() {}

package/lib/cjs/src/utils/string.js

@@ -5,24 +5,19 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.lowerCase = lowerCase;
 exports.upperCase = upperCase;
-
-/* eslint-disable eqeqeq */
 function upperCase(str, pos) {
   if (typeof str === 'string') {
-    return str // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+    return str
     // @ts-ignore
     .split().reduce((total, cur, index) => pos == null || pos === index ? total + cur.toUpperCase() : total + cur, '');
   }
-
   return str;
 }
-
 function lowerCase(str, pos) {
   if (typeof str === 'string') {
-    return str // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+    return str
     // @ts-ignore
     .split().reduce((total, cur, index) => pos == null || pos === index ? total + cur.toLowerCase() : total + cur, '');
   }
-
   return str;
 }

package/lib/es/src/Animation.js

@@ -1,6 +1,4 @@
 /* eslint-disable @typescript-eslint/ban-types */
-
-/* eslint-disable react/destructuring-assignment */
 import { PureComponent, isValidElement } from 'react';
 import PropTypes from 'prop-types';
 import { Animation as SemiAnimation, events } from '@douyinfe/semi-animation';
@@ -9,29 +7,24 @@ export default class Animation extends PureComponent {
   constructor() {
     let props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
     super(props);
-
     this.initAnimation = props => {
-      // eslint-disable-next-line eqeqeq
-      props = props == null ? this.props : props; // eslint-disable-next-line prefer-const
-
+      props = props == null ? this.props : props;
       let {
         from,
         to,
         config,
         reverse
       } = props;
-
       if (reverse) {
         [from, to] = [to, from];
       }
-
       this.animation = new SemiAnimation({
         from: Object.assign({}, from),
         to: Object.assign({}, to)
       }, Object.assign({}, config));
       events.forEach(event => {
-        const propName = "on".concat(event[0].toUpperCase() + event.slice(1)); // eslint-disable-next-line @typescript-eslint/no-shadow
-
+        const propName = `on${event[0].toUpperCase() + event.slice(1)}`;
+        // eslint-disable-next-line @typescript-eslint/no-shadow
         this.animation.on(event, props => {
           // avoid memory leak
           if (this._mounted && !this._destroyed) {
@@ -44,61 +37,50 @@ export default class Animation extends PureComponent {
       });
       this._destroyed = false;
     };
-
     this.bindEvents = () => {
       this.startOrNot = () => {
         const {
           immediate,
           autoStart
         } = this.props;
-
         if (immediate) {
           this.end();
         } else if (autoStart) {
           this.start();
         }
       };
-
       this.start = () => {
         this.animation && this.animation.start();
       };
-
       this.pause = () => {
         this.animation && this.animation.pause();
       };
-
       this.stop = () => {
         this.animation && this.animation.stop();
       };
-
       this.end = () => {
         this.animation && this.animation.end();
       };
-
       this.resume = () => {
         this.animation && this.animation.resume();
       };
-
       this.reset = () => {
         if (this.animation) {
           this.animation.reset();
           this.startOrNot();
         }
       };
-
       this.reverse = () => {
         if (this.animation) {
           this.animation.reverse();
           this.startOrNot();
         }
       };
-
       this.destroy = () => {
         this._destroyed = true;
         this.animation && this.animation.destroy();
       };
     };
-
     this.state = {
       currentStyle: {}
     };
@@ -107,42 +89,33 @@ export default class Animation extends PureComponent {
     this.initAnimation();
     this.bindEvents();
   }
-
   startOrNot() {
     throw new Error('Method not implemented.');
   }
-
   componentDidMount() {
     this._mounted = true;
     const {
       forwardInstance
     } = this.props;
-
     if (this.animation === null) {
       // didmount/willUnmount may be called twice when React.StrictMode is true in React 18, we need to ensure that this.animation is correct
       this.initAnimation();
       this.bindEvents();
     }
-
     if (typeof forwardInstance === 'function') {
       forwardInstance(this.animation);
     }
-
     this.startOrNot();
   }
-
   componentWillUnmount() {
     this._mounted = false;
-
     if (this.animation) {
       this.animation.destroy();
       this.animation = null;
     }
   }
-
   componentDidUpdate() {
     let prevProps = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-
     if (this.props.reset) {
       if (this.props.from !== prevProps.from || this.props.to !== prevProps.to) {
         this.destroy();
@@ -150,7 +123,6 @@ export default class Animation extends PureComponent {
         this.startOrNot();
       }
     }
-
     if (this.props.force) {
       if (this.props.to !== prevProps.to) {
         this.initAnimation(Object.assign(Object.assign({}, this.props), {
@@ -160,12 +132,10 @@ export default class Animation extends PureComponent {
       }
     }
   }
-
   render() {
     const {
       children
     } = this.props;
-
     if (typeof children === 'function') {
       return children(this.animation.getCurrentStates());
     } else if ( /*#__PURE__*/isValidElement(children)) {
@@ -174,7 +144,6 @@ export default class Animation extends PureComponent {
       return null;
     }
   }
-
 }
 Animation.propTypes = {
   onStart: PropTypes.func,

package/lib/es/src/KeyFrames.js

@@ -1,4 +1,3 @@
-/* eslint-disable react/destructuring-assignment */
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import noop from './utils/noop';
@@ -6,22 +5,17 @@ import Animation from './Animation';
 export default class KeyFrames extends Component {
   constructor() {
     var _this;
-
     let props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
     super(props);
     _this = this;
-
     this.onFrame = function () {
       let props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
       const currentStyle = Object.assign({}, props);
-
       _this.props.onFrame(currentStyle);
-
       _this.setState({
         currentStyle
       });
     };
-
     this.next = () => {
       let {
         frameIndex
@@ -31,7 +25,6 @@ export default class KeyFrames extends Component {
         loop
       } = this.props;
       frameIndex++;
-
       if (frameIndex < frames.length - 1) {
         this.setState({
           frameIndex
@@ -39,38 +32,31 @@ export default class KeyFrames extends Component {
       } else {
         frameIndex = 0;
         this.props.onRest(this.state.currentStyle);
-
         if (loop) {
           this.setState({
             frameIndex
           });
         }
       }
-
       this.props.onKeyRest(this.state.currentStyle);
     };
-
     this.forwardInstance = instance => {
       this.instance = instance;
-
       if (typeof this.props.forwardInstance === 'function') {
         this.props.forwardInstance(this.instance);
       }
     };
-
     this.state = {
       currentStyle: {},
       frameIndex: 0
     };
   }
-
-  componentDidMount() {// this.props.forwardInstance(this.instance);
+  componentDidMount() {
+    // this.props.forwardInstance(this.instance);
   }
-
   componentWillUnmount() {
     this.instance && this.instance.destroy();
   }
-
   render() {
     const {
       children,
@@ -90,7 +76,6 @@ export default class KeyFrames extends Component {
       onRest: this.next
     }), typeof children === 'function' ? children(currentStyle) : children);
   }
-
 }
 KeyFrames.propTypes = {
   frames: PropTypes.array,

package/lib/es/src/StyledAnimation.js

@@ -1,12 +1,3 @@
-/* eslint-disable react/destructuring-assignment */
-
-/* eslint-disable prefer-const */
-
-/* eslint-disable eqeqeq */
-
-/* eslint-disable import/no-duplicates */
-
-/* eslint-disable no-duplicate-imports */
 import { PureComponent, isValidElement, cloneElement, Children } from 'react';
 import PropTypes from 'prop-types';
 import classnames from 'classnames';
@@ -17,11 +8,9 @@ const types = Object.values(styledTypes).reduce((arr, cur) => [...arr, ...cur],
 export default class StyledAnimation extends PureComponent {
   constructor() {
     var _this;
-
     let props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
     super(props);
     _this = this;
-
     this._generateAnimateEvents = function (child) {
       let props = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
       return {
@@ -29,47 +18,39 @@ export default class StyledAnimation extends PureComponent {
           for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
             args[_key] = arguments[_key];
           }
-
           return invokeFns([child && child.props && child.props.onAnimationIteration, props.onFrame], args);
         },
         onAnimationStart: function () {
           for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
             args[_key2] = arguments[_key2];
           }
-
           return invokeFns([child && child.props && child.props.onAnimationStart, props.onStart], args);
         },
         onAnimationEnd: function () {
           for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
             args[_key3] = arguments[_key3];
           }
-
           return invokeFns([child && child.props && child.props.onAnimationEnd, props.onRest], args);
         }
       };
     };
-
     this._hasSpeedClass = function () {
       let speed = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : _this.props.speed;
       return speed != null && speeds.includes(speed);
     };
-
     this._hasTypeClass = function () {
       let type = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : _this.props.type;
       return type != null && types.includes(type);
     };
-
     this._hasDelayClass = function () {
       let delay = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : _this.props.delay;
       return delay != null && delays.includes(delay);
     };
-
     this._hasLoopClass = function () {
       let loop = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : _this.props.loop;
       return loop != null && loops.includes(loop);
     };
   }
-
   render() {
     let {
       type,
@@ -84,20 +65,15 @@ export default class StyledAnimation extends PureComponent {
       className,
       fillMode
     } = this.props;
-
     const hasTypeClass = this._hasTypeClass();
-
     const hasSpeedClass = this._hasSpeedClass();
-
     const hasDelayClass = this._hasDelayClass();
-
     const hasLoopClass = this._hasLoopClass();
-
-    const animateCls = className || classnames("".concat(prefixCls, "-animated"), {
-      ["".concat(prefixCls, "-").concat(type)]: Boolean(type),
-      ["".concat(prefixCls, "-speed-").concat(speed)]: hasSpeedClass,
-      ["".concat(prefixCls, "-delay-").concat(delay)]: hasDelayClass,
-      ["".concat(prefixCls, "-loop-").concat(loop)]: hasLoopClass
+    const animateCls = className || classnames(`${prefixCls}-animated`, {
+      [`${prefixCls}-${type}`]: Boolean(type),
+      [`${prefixCls}-speed-${speed}`]: hasSpeedClass,
+      [`${prefixCls}-delay-${delay}`]: hasDelayClass,
+      [`${prefixCls}-loop-${loop}`]: hasLoopClass
     });
     const animateStyle = {
       animationTimingFunction: timing,
@@ -108,25 +84,21 @@ export default class StyledAnimation extends PureComponent {
       animationDirection: reverse ? 'alternate' : 'normal',
       animationFillMode: fillMode
     };
-
     if ( /*#__PURE__*/isValidElement(children)) {
       children = Children.map(children, child => {
         const animateEvents = this._generateAnimateEvents(child, this.props);
-
         return /*#__PURE__*/cloneElement(child, Object.assign({
           className: classnames(child.props.className, animateCls),
           style: Object.assign(Object.assign({}, child.props.style), this.props.style)
         }, animateEvents));
       });
     }
-
     return typeof children === 'function' ? children({
       animateCls,
       animateStyle,
       animateEvents: this._generateAnimateEvents(null, this.props)
     }) : children;
   }
-
 }
 StyledAnimation.propTypes = {
   className: PropTypes.string,