rm deep-eql,fix timeline repeat callback, update d.ts

Author: jljsj33

package.json

@@ -1,6 +1,6 @@
 {
   "name": "rc-tween-one",
-  "version": "2.2.9",
+  "version": "2.2.10",
   "description": "tween-one anim component for react",
   "keywords": [
     "react",
@@ -34,7 +34,9 @@
     "assets/*.css",
     "dist",
     "es",
-    "index.d.ts"
+    "typings/index.d.ts",
+    "typings/AnimObject.d.ts",
+    "typings/TweenOneGroup.d.ts"
   ],
   "licenses": "MIT",
   "main": "./lib/index",
@@ -82,10 +84,9 @@
   "dependencies": {
     "prop-types": "^15.6.1",
     "babel-runtime": "6.x",
-    "deep-eql": "~3.0.1",
     "raf": "~3.4.0",
     "style-utils": "~0.1.13",
     "tween-functions": "~1.2.0"
   },
-  "types": "typeings/index.d.ts"
+  "types": "typings/index.d.ts"
 }

src/TweenOne.jsx

@@ -250,6 +250,7 @@ class TweenOne extends Component {
         ...e,
         timelineMode: '',
       };
+      
       if (
         (this.moment === this.startMoment &&
           (!this.reverse && !e.index && e.mode === 'onStart') ||
@@ -266,10 +267,10 @@ class TweenOne extends Component {
       } else {
         cb.timelineMode = 'onTimelineUpdate';
       }
+      this.timelineRepeatNum = repeatNum;
       this.props.onChange(cb);
     };
     this.moment = moment;
-    this.timelineRepeatNum = repeatNum;
     this.tween.frame(tweenMoment);
   }
 

src/util.js

@@ -1,5 +1,4 @@
 import React from 'react';
-import deepEql from 'deep-eql';
 
 export const windowIsUndefined = !(
   typeof window !== 'undefined' &&
@@ -25,6 +24,26 @@ export function dataToArray(vars) {
   return [vars];
 }
 
+function deepEql(a, b) {
+  if (!a || !b) {
+    return false;
+  }
+  const $a = Object.keys(a);
+  const $b = Object.keys(b);
+  if ($a.length && $b.length && $a.length === $b.length) {
+    return !$a.some((key) => {
+      let aa = a[key];
+      let bb = b[key];
+      if (Array.isArray(aa) && Array.isArray(bb)) {
+        aa = aa.join();
+        bb = bb.join();
+      }
+      return aa !== bb;
+    });
+  }
+  return false;
+}
+
 export function objectEqual(obj1, obj2) {
   if (obj1 === obj2 || deepEql(obj1, obj2)) {
     return true;
@@ -51,6 +70,8 @@ export function objectEqual(obj1, obj2) {
             }
           } else {
             equalBool = false;
+          }
+          if (!equalBool) {
             return false;
           }
         }

typings/TweenOneGroup.d.ts

@@ -2,15 +2,17 @@ import * as React from 'react';
 
 import { IAnimObject, IEaseCallBack } from './AnimObject';
 
-export interface IGroupProps {
+import { Omit } from './index';
+
+export interface IGroupProps<T> extends Omit<React.HTMLAttributes<T>, 'onChange'> {
   appear?: boolean;
   enter?: IAnimObject | IAnimObject[] | ((key: string, index: number) => IAnimObject);
   leave?: IAnimObject | IAnimObject[] | ((key: string, index: number) => IAnimObject);
-  animatingClassName?: [string, string];
+  animatingClassName?: string[] | [string, string];
   exclusive?: boolean;
   onEnd?: (e: { key: string, type: string }) => void;
   component?: string | React.ReactNode;
   componentProps?: {};
 }
 
-export default class RcTweenOneGroup extends React.Component<IGroupProps>{ }
+export default class RcTweenOneGroup<T> extends React.Component<IGroupProps<T>>{ }

typings/index.d.ts

@@ -34,6 +34,8 @@ export interface IProps<T> extends Omit<React.HTMLAttributes<T>, 'onChange'> {
   componentProps?: {};
 }
 
+export const TweenOneGroup: typeof Group;
+
 export default class RcTweenOne<T> extends React.Component<IProps<T>> {
   static easing: {
     path(path: string, parame?: { rect?: number, lengthPixel?: number }): IEaseCallBack;