Merge pull request #45 from react-component/react16

update react 16

Author: jljsj33

.gitignore

@@ -22,4 +22,6 @@ node_modules
 *.css
 build
 lib
-dist
+coverage
+dist
+es

index.js

@@ -1,6 +1,6 @@
 {
   "name": "rc-queue-anim",
-  "version": "1.2.3",
+  "version": "1.3.0",
   "description": "Queue animation component for react",
   "keywords": [
     "react",
@@ -20,42 +20,47 @@
   "files": [
     "lib",
     "assets/*.css",
-    "dist"
+    "dist",
+    "es"
   ],
   "licenses": "MIT",
   "main": "./lib/index",
-  "entry": {
-    "rc-queue-anim": [
-      "./assets/index.less",
-      "./src/index.js"
-    ]
-  },
+  "module": "./es/index",
   "config": {
-    "port": 8001
+    "port": 8001,
+    "entry": {
+      "rc-queue-anim": [
+        "./assets/index.less",
+        "./src/index.js"
+      ]
+    }
   },
   "scripts": {
+    "dist": "rc-tools run dist",
     "build": "rc-tools run build",
     "gh-pages": "rc-tools run gh-pages",
     "start": "rc-tools run server",
+    "compile": "rc-tools run compile --babel-runtime",
     "pub": "rc-tools run pub --babel-runtime",
     "lint": "rc-tools run lint",
-    "karma": "rc-tools run karma",
-    "saucelabs": "rc-tools run saucelabs",
-    "test": "rc-tools run test",
-    "chrome-test": "rc-tools run chrome-test",
-    "coverage": "rc-tools run coverage"
+    "karma": "rc-test run karma",
+    "saucelabs": "rc-test run saucelabs",
+    "test": "rc-test run test",
+    "chrome-test": "rc-test run chrome-test",
+    "coverage": "rc-test run coverage"
   },
   "devDependencies": {
+    "core-js": "^2.5.1",
+    "expect.js": "0.3.x",
+    "pre-commit": "1.x",
+    "rc-test": "6.x",
+    "rc-tools": "6.x",
+    "react": "^16.0.0",
+    "react-dom": "^16.0.0",
     "antd": "^2.12.3",
-    "expect.js": "~0.3.1",
-    "history": "^2.1.2",
     "jquery": "~1.11.3",
     "precommit-hook": "1.x",
     "rc-dialog": "~5.2.1",
-    "rc-tools": "5.x",
-    "react": "~15.5.0",
-    "react-addons-test-utils": "~15.5.0",
-    "react-dom": "~15.5.0",
     "react-router-dom": "^4.1.0",
     "react-router": "~4.1.0"
   },

package.json

@@ -425,5 +425,5 @@ class QueueAnim extends React.Component {
     return createElement(this.props.component, props, childrenToRender);
   }
 }
-
+QueueAnim.isQueueAnim = true;
 export default QueueAnim;

src/QueueAnim.jsx

@@ -1,4 +1,4 @@
 // export this package's api
 import QueueAnim from './QueueAnim';
-QueueAnim.isQueueAnim = true;
+
 export default QueueAnim;

src/index.js

@@ -1,9 +1,11 @@
 /* eslint no-console:0 */
+import 'core-js/es6/map';
+import 'core-js/es6/set';
 import React from 'react';
 import ReactDom from 'react-dom';
 import expect from 'expect.js';
-import QueueAnim from '../index';
-import TestUtils from 'react-addons-test-utils';
+import QueueAnim from '../src';
+import TestUtils from 'react-dom/test-utils';
 import ticker from 'rc-tween-one/lib/ticker';
 import $ from 'jquery';
 
@@ -41,55 +43,53 @@ describe('rc-queue-anim', () => {
   }
 
   function createQueueAnimInstance(props = {}) {
-    const QueueAnimExample = React.createClass({
-      getInitialState() {
-        return {
-          show: true,
-          unMount: false,
-          items: [{
-            key: 1,
-            content: 'div',
-          }, {
-            key: 2,
-            content: 'div',
-          }, {
-            key: 3,
-            content: 'div',
-          }],
-        };
-      },
-      toggle() {
+    class QueueAnimExample extends React.Component {
+      state = {
+        show: true,
+        unMount: false,
+        items: [{
+          key: 1,
+          content: 'div',
+        }, {
+          key: 2,
+          content: 'div',
+        }, {
+          key: 3,
+          content: 'div',
+        }],
+      }
+      toggle = () => {
         this.setState({
           show: !this.state.show,
         });
-      },
-      unMountQueue() {
+      }
+      unMountQueue = () => {
         this.setState({
           unMount: true,
         });
-      },
-      removeOne() {
+      }
+      removeOne = () => {
         const items = this.state.items;
         const removeIndex = 0;
         items.splice(removeIndex, 1);
         this.setState({ items });
         return removeIndex;
-      },
+      }
       render() {
         return (
           <section>
             {!this.state.unMount ? <QueueAnim {...props}>
-                {
-                  this.state.show ?
-                    this.state.items.map((item) => <div key={item.key}>{item.content}</div>) :
-                    null
-                }
-                {null}
-              </QueueAnim> : null}
+              {
+                this.state.show ?
+                  this.state.items.map((item) => <div key={item.key}>{item.content}</div>) :
+                  null
+              }
+              {null}
+            </QueueAnim> : null}
           </section>
         );
-      },
-    });
+      }
+    }
     return ReactDom.render(<QueueAnimExample />, div);
   }
 
@@ -223,6 +223,24 @@ describe('rc-queue-anim', () => {
     }, 18);
   });
 
+  it('should support custom animation config array', (done) => {
+    const instance = createQueueAnimInstance({
+      animConfig: [
+        [{ left: [100, 0] }, { top: [100, 0] }],
+      ],
+    });
+    let children = TestUtils.scryRenderedDOMComponentsWithTag(instance, 'div');
+    expect(isNaN(children[1])).to.be.ok();
+    ticker.timeout(() => {
+      children = TestUtils.scryRenderedDOMComponentsWithTag(instance, 'div');
+      console.log('left:', getLeft(children[1]));
+      console.log('top:', getTop(children[1]));
+      expect(getLeft(children[1])).to.be(100);
+      expect(getTop(children[1])).to.be(100);
+      done();
+    }, 917);
+  });
+
   it('should support animation when change direction at animating', (done) => {
     const instance = createQueueAnimInstance({
       leaveReverse: true,