remove mount and unmount prop

beekai-oss · Nov 9, 2018 · 62c60d2 · 62c60d2
1 parent d19eedc
commit 62c60d2
Show file tree

Hide file tree

Showing 4 changed files with 14 additions and 59 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "react-simple-animate",
-  "version": "2.1.8",
+  "version": "2.1.9-beta.1",
   "description": "react simple animate",
   "main": "lib/index.js",
   "keywords": [

diff --git a/src/animate.js b/src/animate.js
@@ -27,8 +27,6 @@ export type Props = {
   onComplete?: () => mixed,
   className?: string,
   render?: Object => any,
-  unMount?: boolean,
-  mount?: boolean,
   sequenceId?: string,
   sequenceIndex?: number,
   register?: any => void,
@@ -38,8 +36,6 @@ export type Props = {
 export type State = {
   willComplete: boolean,
   play: boolean,
-  shouldUnMount: boolean,
-  shouldMount: boolean,
 };
 
 export class AnimateChild extends React.PureComponent<Props, State> {
@@ -57,9 +53,11 @@ export class AnimateChild extends React.PureComponent<Props, State> {
 
   constructor(props: Props) {
     super(props);
-    const { play, mount } = props;
 
-    if (play && !mount) {
+    const { play, register } = props;
+    register && register(this.props);
+
+    if (play) {
       this.isMountWithPlay = true;
 
       this.initialPlayTimer = setTimeout(() => {
@@ -72,19 +70,8 @@ export class AnimateChild extends React.PureComponent<Props, State> {
   state: State = {
     willComplete: false,
     play: false,
-    shouldUnMount: false,
-    shouldMount: false,
   };
 
-  componentDidMount() {
-    const { register, mount } = this.props;
-    register && register(this.props);
-
-    if (mount && !this.state.shouldMount) {
-      this.mountTimeout = setTimeout(() => this.setState({ shouldMount: true }));
-    }
-  }
-
   static getDerivedStateFromProps(nextProps: Props, prevState: State) {
     const { animationStates, play, sequenceId, sequenceIndex, onCompleteStyle } = nextProps;
     const id = sequenceId || sequenceIndex;
@@ -103,27 +90,7 @@ export class AnimateChild extends React.PureComponent<Props, State> {
     };
   }
 
-  componentDidUpdate(prevProps: Props) {
-    const { durationSeconds, unMount } = this.props;
-
-    this.onComplete();
-
-    if (!prevProps.unMount && unMount) {
-      this.unMountTimeout = setTimeout(
-        () => this.setState({ shouldUnMount: true }),
-        parseFloat(durationSeconds) * 1000,
-      );
-    }
-  }
-
-  componentWillUnmount() {
-    clearTimeout(this.completeTimeout);
-    clearTimeout(this.unMountTimeout);
-    clearTimeout(this.mountTimeout);
-    clearTimeout(this.initialPlayTimer);
-  }
-
-  onComplete(): void {
+  componentDidUpdate() {
     const {
       delaySeconds,
       play,
@@ -151,19 +118,20 @@ export class AnimateChild extends React.PureComponent<Props, State> {
     }
   }
 
+  componentWillUnmount() {
+    clearTimeout(this.completeTimeout);
+    clearTimeout(this.unMountTimeout);
+    clearTimeout(this.initialPlayTimer);
+  }
+
   completeTimeout: TimeoutID;
 
   unMountTimeout: TimeoutID;
 
-  mountTimeout: TimeoutID;
-
   initialPlayTimer: TimeoutID;
 
   render() {
     const { tag = 'div', children, render } = this.props;
-    const { shouldUnMount } = this.state;
-
-    if (shouldUnMount) return null;
 
     const props = attributesGenerator(this.props, this.state, this.isMountWithPlay);
     return render ? render(props) : React.createElement(tag, props, children);

diff --git a/src/utils/attributesGenerator.js b/src/utils/attributesGenerator.js
@@ -2,7 +2,7 @@
 import type { State, Props } from '../animate';
 import mapSequenceOverProps from './mapSequenceOverProps';
 
-export default function attributesGenerator(props: Props, { willComplete, shouldMount }: State, isMountWithPlay: boolean): Object {
+export default function attributesGenerator(props: Props, { willComplete }: State, isMountWithPlay: boolean): Object {
   const { animationStates, sequenceId, sequenceIndex } = props;
   const id = sequenceId || sequenceIndex;
   const {
@@ -16,22 +16,18 @@ export default function attributesGenerator(props: Props, { willComplete, should
     className,
     reverseDurationSeconds = 0,
     reverseDelaySeconds = 0,
-    unMount,
-    mount,
     forwardedRef,
   } = mapSequenceOverProps(props, id);
   let style = startStyle;
   let transition = `all ${durationSeconds}s ${easeType} ${delaySeconds}s`;
-  const willMountOrUnMount = unMount || (mount && !shouldMount);
 
   if (!play && (reverseDurationSeconds || reverseDelaySeconds)) {
     transition = `all ${reverseDurationSeconds || durationSeconds}s ${easeType} ${reverseDelaySeconds}s`;
-  } else if (!willMountOrUnMount && !isMountWithPlay) {
+  } else if (!isMountWithPlay) {
     if (willComplete && onCompleteStyle && play) {
       style = onCompleteStyle;
       transition = '';
     } else if (
-      mount ||
       play ||
       ((id || id === 0) &&
         Object.keys(animationStates).length &&

diff --git a/test/animate.test.js b/test/animate.test.js
@@ -85,15 +85,6 @@ describe('Animate', () => {
     expect(tree.state('willComplete')).toEqual(true);
   });
 
-  it('should set shouldUnMount to true when prop have been set to unmount', () => {
-    const tree = shallow(<AnimateChild {...{ ...props, play: false }} />);
-    tree.setProps({
-      unMount: true,
-    });
-    jest.runAllTimers();
-    expect(tree.state('shouldUnMount')).toBeTruthy();
-  });
-
   it('should call on complete function when animation is completed', () => {
     const onComplete = jest.fn();
     const tree = shallow(<AnimateChild {...{ ...props, play: false, onComplete }} />);