remove object-assign

examples/simple.js

@@ -16,6 +16,7 @@ class Demo extends React.Component {
         <Element key="aaa"
           prefixCls="banner-user-elem"
           img="https://os.alipayobjects.com/rmsportal/IhCNTqPpLeTNnwr.jpg"
+          id="1"
         >
           <QueueAnim name="QueueAnim">
             <h1 key="h1">Ant Motion Demo</h1>
@@ -28,6 +29,7 @@ class Demo extends React.Component {
         <Element key="bbb"
           prefixCls="banner-user-elem"
           img="https://os.alipayobjects.com/rmsportal/uaQVvDrCwryVlbb.jpg"
+          id="2"
         >
           <QueueAnim name="QueueAnim">
             <h1 key="h1">Ant Motion Demo</h1>

package.json

@@ -48,9 +48,8 @@
     "rc-queue-anim": "0.11.x"
   },
   "dependencies": {
-    "object-assign": "~4.0.1",
-    "rc-tween-one": "~0.6.20",
-    "style-utils": "~0.1.2",
+    "rc-tween-one": "~0.8.0",
+    "style-utils": "~0.1.6",
     "tween-functions": "1.x"
   },
   "pre-commit": [

src/Arrow.jsx

@@ -1,5 +1,4 @@
 import React, { Component, PropTypes } from 'react';
-import assign from 'object-assign';
 
 class Arrow extends Component {
   constructor() {
@@ -19,7 +18,7 @@ class Arrow extends Component {
     className = `${className} ${this.props.prefixCls || ''}`.trim();
     className = !this.props.default ? className : `${className} ${defaultClass}`.trim();
     className = `${className} ${this.props.arrowType}`;
-    const props = assign({}, this.props);
+    const props = { ...this.props };
     [
       `arrowType`, `next`, `prev`,
       `elemHeight`, 'component', 'default', 'prefixCls',

src/BannerAnim.jsx

@@ -1,6 +1,5 @@
 import React, { Component, PropTypes } from 'react';
 import ReactDOM from 'react-dom';
-import assign from 'object-assign';
 import Arrow from './Arrow';
 import Element from './Element';
 import Thumb from './Thumb';
@@ -94,6 +93,9 @@ class BannerAnim extends Component {
   }
 
   onTouchEnd() {
+    if (this.mouseXY) {
+      return;
+    }
     const differX = this.mouseXY.currentX - this.mouseXY.startX;
     const differY = this.mouseXY.currentY - this.mouseXY.startY;
     const r = Math.atan2(differY, differX);
@@ -117,7 +119,7 @@ class BannerAnim extends Component {
       if (!item.key) {
         throw new Error('Please add key, key is required');
       }
-      const itemProps = assign({}, item.props);
+      const itemProps = { ...item.props };
       switch (item.type) {
         case Element:
           itemProps.key = item.key;
@@ -260,7 +262,7 @@ class BannerAnim extends Component {
 
   render() {
     const prefixCls = this.props.prefixCls;
-    const props = assign({}, this.props);
+    const props = { ...this.props };
     [
       `prefixCls`,
       `component`,
@@ -274,7 +276,7 @@ class BannerAnim extends Component {
     ].forEach(key => delete props[key]);
     const childrenToRender = this.getRenderChildren(props.children);
     props.className = `${props.className} ${prefixCls || ''}`.trim();
-    props.style = assign({}, props.style);
+    props.style = { ...props.style };
     if (childrenToRender.length > 1) {
       props.onMouseEnter = this.onMouseEnter;
       props.onMouseLeave = this.onMouseLeave;

src/Element.jsx

@@ -2,7 +2,6 @@ import React, { Component, PropTypes } from 'react';
 import ReactDOM from 'react-dom';
 import TweenOne from 'rc-tween-one';
 import ticker from 'rc-tween-one/lib/ticker';
-import assign from 'object-assign';
 import ease from 'tween-functions';
 import {
   getUnit,
@@ -290,8 +289,8 @@ class Element extends Component {
     const child = toArrayChildren(this.props.children).map(item => {
       const num = keys.indexOf(item.key);
       if (num >= 0) {
-        const props = assign({}, item.props);
-        const style = assign({}, props.style);
+        const props = { ...item.props };
+        const style = { ...props.style };
         const data = this.props.followParallax.data[num];
         if (this.props.followParallax.transition) {
           style.transition = this.props.followParallax.transition;
@@ -388,8 +387,8 @@ class Element extends Component {
   }
 
   render() {
-    const props = assign({}, this.props);
-    const style = assign({}, props.style);
+    const props = { ...this.props };
+    const style = { ...props.style };
     style.display = props.show ? 'block' : 'none';
     style.position = 'absolute';
     style.width = '100%';

src/Thumb.jsx

@@ -1,6 +1,5 @@
 import React, { Component, PropTypes } from 'react';
 import { toArrayChildren } from './utils';
-import assign from 'object-assign';
 
 class Thumb extends Component {
   constructor() {
@@ -28,13 +27,13 @@ class Thumb extends Component {
       console.warn('The thumbnail length and the images length different.'); // eslint-disable-line
     }
     const childToRender = toArrayChildren(children).map((item, i) => {
-      const props = assign({}, item.props);
+      const props = { ...item.props };
       props.onClick = this.props.thumbClick.bind(this, i);
       props.className = `${props.className || ''} ${this.props.active === i ? 'active' : ''}`
         .trim();
       return React.cloneElement(item, props);
     });
-    const props = assign({}, this.props);
+    const props = { ...this.props };
     [`length`, `thumbClick`, `active`, 'default', 'component', 'prefixCls']
       .forEach(key => delete props[key]);
     props.className = className;

src/anim.jsx

@@ -1,12 +1,11 @@
 import React, { cloneElement } from 'react';
-import assign from 'object-assign';
 import { toArrayChildren, setAnimCompToTagComp } from './utils';
 import ticker from 'rc-tween-one/lib/ticker';
 
 export default {
   across(elem, type, direction, animData) {
     let _x;
-    const props = assign({}, elem.props);
+    const props = { ...elem.props };
     let children = props.children;
     if (type === 'enter') {
       _x = direction === 'next' ? '100%' : '-100%';
@@ -25,7 +24,7 @@ export default {
   },
   vertical(elem, type, direction, animData) {
     let _y;
-    const props = assign({}, elem.props);
+    const props = { ...elem.props };
     let children = props.children;
     if (type === 'enter') {
       _y = direction === 'next' ? '-100%' : '100%';
@@ -45,7 +44,7 @@ export default {
   },
   acrossOverlay(elem, type, direction, animData) {
     let _x;
-    const props = assign({}, elem.props);
+    const props = { ...elem.props };
     let children = props.children;
     if (type === 'enter') {
       _x = direction === 'next' ? '100%' : '-100%';
@@ -64,7 +63,7 @@ export default {
   },
   verticalOverlay(elem, type, direction, animData) {
     let _y;
-    const props = assign({}, elem.props);
+    const props = { ...elem.props };
     let children = props.children;
     if (type === 'enter') {
       _y = direction === 'next' ? '-100%' : '100%';
@@ -82,7 +81,7 @@ export default {
     }, children);
   },
   gridBar(elem, type, direction, animData, elemOffset) {
-    const props = assign({}, elem.props);
+    const props = { ...elem.props };
     const animChild = [];
     const girdNum = 10;
     const girdSize = 100 / girdNum;
@@ -96,12 +95,12 @@ export default {
       children = toArrayChildren(children).map(setAnimCompToTagComp);
     }
     for (let i = 0; i < girdNum; i++) {
-      const style = assign({}, props.style);
+      const style = { ...props.style };
       style.width = `${girdSize}%`;
       style.left = `${i * girdSize + 0.01}%`;
       style.position = 'absolute';
       style.overflow = 'hidden';
-      const _style = assign({}, props.style);
+      const _style = { ...props.style };
       _style.width = `${elemOffset.width}px`;
       _style.height = `${elemOffset.height}px`;
       _style.float = 'left';
@@ -124,12 +123,12 @@ export default {
     const animSlot = (<div style={{ width: '100%', position: 'absolute', top: 0 }}>
       {animChild}
     </div>);
-    const _props = assign({}, elem.props);
+    const _props = { ...elem.props };
     _props.children = animSlot;
     return cloneElement(elem, _props);
   },
   grid(elem, type, direction, animData, elemOffset) {
-    const props = assign({}, elem.props);
+    const props = { ...elem.props };
     const animChild = [];
     const gridNum = 10;
     const gridWidth = elemOffset.width / gridNum;
@@ -145,15 +144,15 @@ export default {
     }
     for (let i = 0; i < gridNum * gridNumH; i++) {
       // mask样式
-      const style = assign({}, props.style);
+      const style = { ...props.style };
       style.position = 'absolute';
       style.overflow = 'hidden';
       style.width = `${gridWidth + 1}px`;
       style.height = `${gridWidth + 1}px`;
       style.left = i % gridNum * gridWidth;
       style.top = Math.floor(i / gridNum) * gridWidth;
       // clone 的样式
-      const _style = assign({}, props.style);
+      const _style = { ...props.style };
       _style.width = `${elemOffset.width}px`;
       _style.height = `${elemOffset.height}px`;
       _style.position = 'relative';
@@ -175,7 +174,7 @@ export default {
       </elem.type>);
       animChild.push(mask);
     }
-    const _props = assign({}, elem.props);
+    const _props = { ...elem.props };
     _props.children = animChild;
     return cloneElement(elem, _props);
   },

src/utils.js

@@ -1,6 +1,5 @@
 import React from 'react';
 import TweenOne from 'rc-tween-one';
-import assign from 'object-assign';
 
 export function toArrayChildren(children) {
   const ret = [];
@@ -24,7 +23,7 @@ export function setAnimCompToTagComp(item, i) {
   if (!item) {
     return null;
   }
-  const props = assign({}, item.props);
+  const props = { ...item.props };
   props.key = item.key || i;
   // 压缩后名称不一样了。
   const propTypes = item.type.propTypes;
@@ -40,7 +39,7 @@ export function setAnimCompToTagComp(item, i) {
       || props.name === 'Animate'
     )) {
     // queueAnim or tweeOne or animate;
-    const style = assign({}, props.style);
+    const style = { ...props.style };
     style.position = 'relative';
     props.style = style;
     const component = props.component;