react-smooth - npm Package Compare versions

Comparing version 0.1.9 to 0.1.10

CHANGELOG.md

@@ -0,1 +1,6 @@
+0.1.10 / 2016-07-07
+==================
+
+* fix: add onAnimationReStart validation
+
 ### 0.1.8/0.1.9 / 2016-05-05
@@ -2,0 +7,0 @@ ===

demo/Pendulum/app.js

@@ -9,3 +9,3 @@ import React, { Component, PropTypes } from 'react';
 function Circle(props) {
-  const { r, currTheta, ropeLength } = props;
+  const { r, currTheta, ropeLength, ...others } = props;
   const cx = (ropeLength - r) * Math.sin(currTheta) + ropeLength - r;
@@ -30,3 +30,3 @@ const cy = (ropeLength - r) * Math.cos(currTheta) - r;
       style={translateStyle(style)}
-      { ...props }
+      { ...others }
     />
@@ -52,5 +52,4 @@ );
       height={ropeLength * 2}
-      viewPort={`0 0 ${ropeLength * 2} ${ropeLength * 2}`}
+      viewBox={`0 0 ${ropeLength * 2} ${ropeLength * 2}`}
       version="1.1"
-      xmlns="http://www.w3.org/2000/svg"
     >
@@ -137,10 +136,12 @@ <line
 
-  handleThetaChange(_theta) {
+  handleThetaChange(e) {
     this.setState({
-      theta: _theta,
+      theta: e.target.value,
     });
   }
 
-  handleRopeChange(ropeLength) {
-    this.setState({ ropeLength });
+  handleRopeChange(e) {
+    this.setState({
+      ropeLength: e.target.value,
+    });
   }
@@ -151,16 +152,7 @@
 
-    const thetaValueLink = {
-      value: theta,
-      requestChange: this.handleThetaChange.bind(this),
-    };
-    const ropeValueLink = {
-      value: ropeLength,
-      requestChange: this.handleRopeChange.bind(this),
-    };
-
     return (
       <div className="pendulum-app">
-        theta: <input type="number" valueLink={thetaValueLink} placeholder="0 ~ 90" />
+        theta: <input type="number" value={theta} onChange={this.handleThetaChange.bind(this)} placeholder="0 ~ 90" />
         <br />
-        rope length: <input type="number" valueLink={ropeValueLink} placeholder="rope length" />
+        rope length: <input type="number" value={ropeLength} onChange={this.handleRopeChange.bind(this)} placeholder="rope length" />
         <Pendulum
@@ -167,0 +159,0 @@ theta={ theta && (parseInt(theta, 10) / 180 * Math.PI) || 0.3 }

es6/Animate.js

@@ -311,4 +311,8 @@ 'use strict';
       var to = _props2.to;
+      var canBegin = _props2.canBegin;
+      var onAnimationEnd = _props2.onAnimationEnd;
+      var shouldReAnimate = _props2.shouldReAnimate;
+      var onAnimationReStart = _props2.onAnimationReStart;
 
-      var others = _objectWithoutProperties(_props2, ['children', 'begin', 'duration', 'attributeName', 'easing', 'isActive', 'steps', 'from', 'to']);
+      var others = _objectWithoutProperties(_props2, ['children', 'begin', 'duration', 'attributeName', 'easing', 'isActive', 'steps', 'from', 'to', 'canBegin', 'onAnimationEnd', 'shouldReAnimate', 'onAnimationReStart']);
 
@@ -379,3 +383,4 @@ var count = _react.Children.count(children);
   shouldReAnimate: _react.PropTypes.bool,
-  onAnimationStart: _react.PropTypes.func
+  onAnimationStart: _react.PropTypes.func,
+  onAnimationReStart: _react.PropTypes.func
 }, _class2.defaultProps = {
@@ -382,0 +387,0 @@ begin: 0,

es6/AnimateGroup.js

@@ -41,4 +41,4 @@ 'use strict';
   _createClass(AnimateGroup, [{
-    key: '_wrapChild',
-    value: function _wrapChild(child) {
+    key: 'wrapChild',
+    value: function wrapChild(child) {
       var _props = this.props;
@@ -72,3 +72,3 @@ var appear = _props.appear;
           component: component,
-          childFactory: this._wrapChild.bind(this)
+          childFactory: this.wrapChild.bind(this)
         },
@@ -75,0 +75,0 @@ children

es6/configUpdate.js

@@ -91,4 +91,4 @@ 'use strict';
   var cafId = -1;
-  var preTime = undefined;
-  var beginTime = undefined;
+  var preTime = void 0;
+  var beginTime = void 0;
   var update = function update() {
@@ -95,0 +95,0 @@ return null;

es6/easing.js

@@ -10,8 +10,2 @@ 'use strict';
 
-var _invariant = require('invariant');
-
-var _invariant2 = _interopRequireDefault(_invariant);
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }
@@ -21,7 +15,7 @@
 
-var _cubicBezier = function _cubicBezier(c1, c2) {
+var cubicBezierFactor = function cubicBezierFactor(c1, c2) {
   return [0, 3 * c1, 3 * c2 - 6 * c1, 3 * c1 - 3 * c2 + 1];
 };
 
-var _multyTime = function _multyTime(params, t) {
+var multyTime = function multyTime(params, t) {
   return params.map(function (param, i) {
@@ -36,5 +30,5 @@ return param * Math.pow(t, i);
   return function (t) {
-    var params = _cubicBezier(c1, c2);
+    var params = cubicBezierFactor(c1, c2);
 
-    return _multyTime(params, t);
+    return multyTime(params, t);
   };
@@ -45,3 +39,3 @@ };
   return function (t) {
-    var params = _cubicBezier(c1, c2);
+    var params = cubicBezierFactor(c1, c2);
     var newParams = [].concat(_toConsumableArray(params.map(function (param, i) {
@@ -51,3 +45,3 @@ return param * i;
 
-    return _multyTime(newParams, t);
+    return multyTime(newParams, t);
   };
@@ -196,3 +190,3 @@ };
       default:
-        (0, _invariant2.default)(false, '[configEasing]: first argument should be one of \'ease\', \'ease-in\', ' + '\'ease-out\', \'ease-in-out\', \'linear\' and \'spring\', instead  received %s', args);
+        (0, _util.warn)(false, '[configEasing]: first argument should be one of \'ease\', \'ease-in\', ' + '\'ease-out\', \'ease-in-out\', \'linear\' and \'spring\', instead  received %s', args);
     }
@@ -205,5 +199,5 @@ }
 
-  (0, _invariant2.default)(false, '[configEasing]: first argument type should be function or ' + 'string, instead received %s', args);
+  (0, _util.warn)(false, '[configEasing]: first argument type should be function or ' + 'string, instead received %s', args);
 
   return null;
 };

es6/PureRender.js

@@ -74,3 +74,3 @@ 'use strict';
 }
-
+/* eslint-disable no-param-reassign */
 function pureRenderDecorator(component) {
@@ -77,0 +77,0 @@ component.prototype.shouldComponentUpdate = shouldComponentUpdate;

es6/util.js

@@ -18,2 +18,3 @@ 'use strict';
 
+/* eslint no-console: 0 */
 var PREFIX_LIST = ['Webkit', 'Moz', 'O', 'ms'];
@@ -146,6 +147,6 @@ var IN_LINE_PREFIX_LIST = ['-webkit-', '-moz-', '-o-', '-ms-'];
 
-var __DEV__ = process.env.NODE_ENV !== 'production';
+var isDev = process.env.NODE_ENV !== 'production';
 
 var warn = exports.warn = function warn(condition, format, a, b, c, d, e, f) {
-  if (__DEV__ && typeof console !== 'undefined' && console.warn) {
+  if (isDev && typeof console !== 'undefined' && console.warn) {
     if (format === undefined) {
@@ -152,0 +153,0 @@ console.warn('LogUtils requires an error message argument');

lib/Animate.js

@@ -311,4 +311,8 @@ 'use strict';
       var to = _props2.to;
+      var canBegin = _props2.canBegin;
+      var onAnimationEnd = _props2.onAnimationEnd;
+      var shouldReAnimate = _props2.shouldReAnimate;
+      var onAnimationReStart = _props2.onAnimationReStart;
 
-      var others = _objectWithoutProperties(_props2, ['children', 'begin', 'duration', 'attributeName', 'easing', 'isActive', 'steps', 'from', 'to']);
+      var others = _objectWithoutProperties(_props2, ['children', 'begin', 'duration', 'attributeName', 'easing', 'isActive', 'steps', 'from', 'to', 'canBegin', 'onAnimationEnd', 'shouldReAnimate', 'onAnimationReStart']);
 
@@ -379,3 +383,4 @@ var count = _react.Children.count(children);
   shouldReAnimate: _react.PropTypes.bool,
-  onAnimationStart: _react.PropTypes.func
+  onAnimationStart: _react.PropTypes.func,
+  onAnimationReStart: _react.PropTypes.func
 }, _class2.defaultProps = {
@@ -382,0 +387,0 @@ begin: 0,

lib/AnimateGroup.js

@@ -41,4 +41,4 @@ 'use strict';
   _createClass(AnimateGroup, [{
-    key: '_wrapChild',
-    value: function _wrapChild(child) {
+    key: 'wrapChild',
+    value: function wrapChild(child) {
       var _props = this.props;
@@ -72,3 +72,3 @@ var appear = _props.appear;
           component: component,
-          childFactory: this._wrapChild.bind(this)
+          childFactory: this.wrapChild.bind(this)
         },
@@ -75,0 +75,0 @@ children

lib/configUpdate.js

@@ -91,4 +91,4 @@ 'use strict';
   var cafId = -1;
-  var preTime = undefined;
-  var beginTime = undefined;
+  var preTime = void 0;
+  var beginTime = void 0;
   var update = function update() {
@@ -95,0 +95,0 @@ return null;

lib/easing.js

@@ -10,8 +10,2 @@ 'use strict';
 
-var _invariant = require('invariant');
-
-var _invariant2 = _interopRequireDefault(_invariant);
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }
@@ -21,7 +15,7 @@
 
-var _cubicBezier = function _cubicBezier(c1, c2) {
+var cubicBezierFactor = function cubicBezierFactor(c1, c2) {
   return [0, 3 * c1, 3 * c2 - 6 * c1, 3 * c1 - 3 * c2 + 1];
 };
 
-var _multyTime = function _multyTime(params, t) {
+var multyTime = function multyTime(params, t) {
   return params.map(function (param, i) {
@@ -36,5 +30,5 @@ return param * Math.pow(t, i);
   return function (t) {
-    var params = _cubicBezier(c1, c2);
+    var params = cubicBezierFactor(c1, c2);
 
-    return _multyTime(params, t);
+    return multyTime(params, t);
   };
@@ -45,3 +39,3 @@ };
   return function (t) {
-    var params = _cubicBezier(c1, c2);
+    var params = cubicBezierFactor(c1, c2);
     var newParams = [].concat(_toConsumableArray(params.map(function (param, i) {
@@ -51,3 +45,3 @@ return param * i;
 
-    return _multyTime(newParams, t);
+    return multyTime(newParams, t);
   };
@@ -196,3 +190,3 @@ };
       default:
-        (0, _invariant2.default)(false, '[configEasing]: first argument should be one of \'ease\', \'ease-in\', ' + '\'ease-out\', \'ease-in-out\', \'linear\' and \'spring\', instead  received %s', args);
+        (0, _util.warn)(false, '[configEasing]: first argument should be one of \'ease\', \'ease-in\', ' + '\'ease-out\', \'ease-in-out\', \'linear\' and \'spring\', instead  received %s', args);
     }
@@ -205,5 +199,5 @@ }
 
-  (0, _invariant2.default)(false, '[configEasing]: first argument type should be function or ' + 'string, instead received %s', args);
+  (0, _util.warn)(false, '[configEasing]: first argument type should be function or ' + 'string, instead received %s', args);
 
   return null;
 };

lib/PureRender.js

@@ -74,3 +74,3 @@ 'use strict';
 }
-
+/* eslint-disable no-param-reassign */
 function pureRenderDecorator(component) {
@@ -77,0 +77,0 @@ component.prototype.shouldComponentUpdate = shouldComponentUpdate;

lib/util.js

@@ -18,2 +18,3 @@ 'use strict';
 
+/* eslint no-console: 0 */
 var PREFIX_LIST = ['Webkit', 'Moz', 'O', 'ms'];
@@ -146,6 +147,6 @@ var IN_LINE_PREFIX_LIST = ['-webkit-', '-moz-', '-o-', '-ms-'];
 
-var __DEV__ = process.env.NODE_ENV !== 'production';
+var isDev = process.env.NODE_ENV !== 'production';
 
 var warn = exports.warn = function warn(condition, format, a, b, c, d, e, f) {
-  if (__DEV__ && typeof console !== 'undefined' && console.warn) {
+  if (isDev && typeof console !== 'undefined' && console.warn) {
     if (format === undefined) {
@@ -152,0 +153,0 @@ console.warn('LogUtils requires an error message argument');

package.json

 {
   "name": "react-smooth",
-  "version": "0.1.9",
+  "version": "0.1.10",
   "description": "react animation library",
@@ -33,2 +33,5 @@ "main": "lib/index",
   },
+  "pre-commit": [
+    "lint"
+  ],
   "repository": {
@@ -44,22 +47,21 @@ "type": "git",
   "peerDependencies": {
-    "react": "^0.14.0 || ^15.0.0",
-    "react-dom": "^0.14.0 || ^15.0.0"
+    "react": "^0.14.0 || ~15.1.0",
+    "react-dom": "^0.14.0 || ~15.1.0"
   },
   "dependencies": {
-    "invariant": "^2.2.1",
-    "lodash": "^4.0.0",
+    "lodash": "~4.13.1",
     "raf": "^3.2.0",
-    "react-addons-transition-group": "^0.14.0 || ^15.0.0"
+    "react-addons-transition-group": "^0.14.0 || ~15.1.0"
   },
   "devDependencies": {
-    "babel-cli": "^6.7.5",
-    "babel-core": "^6.7.6",
-    "babel-eslint": "^6.0.2",
+    "babel-cli": "^6.10.0",
+    "babel-core": "^6.10.0",
+    "babel-eslint": "^6.1.0",
     "babel-loader": "^6.2.4",
-    "babel-plugin-lodash": "2.2.2",
+    "babel-plugin-lodash": "^3.2.0",
     "babel-plugin-transform-decorators-legacy": "^1.3.4",
-    "babel-plugin-transform-export-extensions": "^6.5.0",
-    "babel-polyfill": "^6.7.2",
-    "babel-preset-es2015": "^6.6.0",
-    "babel-preset-react": "^6.5.0",
+    "babel-plugin-transform-export-extensions": "^6.8.0",
+    "babel-polyfill": "^6.9.0",
+    "babel-preset-es2015": "^6.9.0",
+    "babel-preset-react": "^6.11.0",
     "babel-preset-stage-0": "^6.5.0",
@@ -69,17 +71,19 @@ "babel-register": "^6.7.2",
     "chai-spies": "^0.7.1",
-    "eslint": "^2.7.0",
-    "eslint-config-airbnb": "^7.0.0",
-    "eslint-plugin-jsx-a11y": "^0.6.2",
-    "eslint-plugin-react": "^4.3.0",
-    "karma": "^0.13.22",
-    "karma-chrome-launcher": "^0.2.2",
-    "karma-firefox-launcher": "^0.1.7",
-    "karma-mocha": "^0.2.2",
+    "eslint": "^2.9.0",
+    "eslint-config-airbnb": "^9.0.1",
+    "eslint-plugin-jsx-a11y": "^1.5.0",
+    "eslint-plugin-import": "^1.7.0",
+    "eslint-plugin-react": "^5.2.0",
+    "karma": "^1.1.0",
+    "karma-chrome-launcher": "^1.0.1",
+    "karma-firefox-launcher": "^1.0.0",
+    "karma-mocha": "^1.1.0",
     "karma-sourcemap-loader": "^0.3.7",
     "karma-webpack": "^1.7.0",
-    "mocha": "^2.4.5",
-    "react": "^15.0.0",
-    "react-addons-test-utils": "^15.0.0",
-    "react-dom": "^15.0.0",
-    "webpack": "^1.12.15",
+    "mocha": "^2.5.0",
+    "pre-commit": "^1.1.3",
+    "react": "~15.1.0",
+    "react-addons-test-utils": "~15.1.0",
+    "react-dom": "~15.1.0",
+    "webpack": "^1.13.1",
     "webpack-dev-server": "^1.14.1"
@@ -86,0 +90,0 @@ },

README.md

@@ -16,6 +16,6 @@ # react-smooth
 ## Usage
-ordinary animation
+simple animation
 
 ```jsx
-<Animate to="0" attributeName="opacity">
+<Animate to={0} from={1} attributeName="opacity">
   <div />
@@ -22,0 +22,0 @@ </Animate>

src/Animate.js

@@ -39,2 +39,3 @@ import React, { Component, PropTypes, cloneElement, Children } from 'react';
     onAnimationStart: PropTypes.func,
+    onAnimationReStart: PropTypes.func,
   };
@@ -285,2 +286,6 @@
       to,
+      canBegin,
+      onAnimationEnd,
+      shouldReAnimate,
+      onAnimationReStart,
       ...others,
@@ -287,0 +292,0 @@ } = this.props;

src/AnimateGroup.js

@@ -18,3 +18,3 @@ import React, { Component, PropTypes, Children } from 'react';
 
-  _wrapChild(child) {
+  wrapChild(child) {
     const { appear, leave, enter } = this.props;
@@ -28,3 +28,3 @@
       >
-        { child }
+        {child}
       </AnimateGroupChild>
@@ -40,5 +40,5 @@ );
         component={component}
-        childFactory={::this._wrapChild}
+        childFactory={::this.wrapChild}
       >
-        { children }
+        {children}
       </ReactTransitionGroup>
@@ -45,0 +45,0 @@ );

src/AnimateGroupChild.js

@@ -49,3 +49,3 @@ import React, { Component, Children, PropTypes } from 'react';
     return (
-      <Animate { ...this.state }>
+      <Animate {...this.state}>
         {Children.only(this.props.children)}
@@ -52,0 +52,0 @@ </Animate>

src/easing.js

 import { warn } from './util';
-import invariant from 'invariant';
 
 const ACCURACY = 1e-4;
 
-const _cubicBezier = (c1, c2) => [
+const cubicBezierFactor = (c1, c2) => [
   0,
@@ -13,3 +12,3 @@ 3 * c1,
 
-const _multyTime = (params, t) =>
+const multyTime = (params, t) =>
   params.map((param, i) =>
@@ -20,12 +19,12 @@ param * Math.pow(t, i)
 const cubicBezier = (c1, c2) => t => {
-  const params = _cubicBezier(c1, c2);
+  const params = cubicBezierFactor(c1, c2);
 
-  return _multyTime(params, t);
+  return multyTime(params, t);
 };
 
 const derivativeCubicBezier = (c1, c2) => t => {
-  const params = _cubicBezier(c1, c2);
+  const params = cubicBezierFactor(c1, c2);
   const newParams = [...params.map((param, i) => param * i).slice(1), 0];
 
-  return _multyTime(newParams, t);
+  return multyTime(newParams, t);
 };
@@ -137,3 +136,3 @@
       default:
-        invariant(false,
+        warn(false,
           '[configEasing]: first argument should be one of \'ease\', \'ease-in\', ' +
@@ -149,3 +148,3 @@ '\'ease-out\', \'ease-in-out\', \'linear\' and \'spring\', instead  received %s',
 
-  invariant(false, '[configEasing]: first argument type should be function or ' +
+  warn(false, '[configEasing]: first argument type should be function or ' +
     'string, instead received %s', args);
@@ -152,0 +151,0 @@

src/PureRender.js

@@ -54,3 +54,3 @@ import _ from 'lodash';
 }
-
+/* eslint-disable no-param-reassign */
 function pureRenderDecorator(component) {
@@ -57,0 +57,0 @@ component.prototype.shouldComponentUpdate = shouldComponentUpdate;

src/util.js

 import { intersection } from 'lodash';
 
+/* eslint no-console: 0 */
 const PREFIX_LIST = ['Webkit', 'Moz', 'O', 'ms'];
@@ -111,6 +112,6 @@ const IN_LINE_PREFIX_LIST = ['-webkit-', '-moz-', '-o-', '-ms-'];
 
-const __DEV__ = process.env.NODE_ENV !== 'production';
+const isDev = process.env.NODE_ENV !== 'production';
 
 export const warn = (condition, format, a, b, c, d, e, f) => {
-  if (__DEV__ && typeof console !== 'undefined' && console.warn) {
+  if (isDev && typeof console !== 'undefined' && console.warn) {
     if (format === undefined) {
@@ -117,0 +118,0 @@ console.warn('LogUtils requires an error message argument');

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Unidentified License

License

(Experimental) Something that seems like a license was found, but its contents could not be matched with a known license.

Found 2 instances in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Unidentified License

License

(Experimental) Something that seems like a license was found, but its contents could not be matched with a known license.

Found 2 instances in 1 package

Improved metrics

Total package byte prevSize

559695

increased by0.09%

Dependency count

5

decreased by-16.67%

Lines of code

11989

increased by0.06%

Worsened metrics

Dev dependency count

32

increased by6.67%

Dependency changes

• + Addedlodash@4.13.1(transitive)

• + Addedreact@15.1.0(transitive)

• + Addedreact-addons-transition-group@15.1.0(transitive)

• + Addedreact-dom@15.1.0(transitive)

• - Removedinvariant@^2.2.1

• - Removed@babel/runtime@7.25.6(transitive)

• - Removedchain-function@1.0.1(transitive)

• - Removedcreate-react-class@15.7.0(transitive)

• - Removeddom-helpers@3.4.0(transitive)

• - Removedinvariant@2.2.4(transitive)

• - Removedlodash@4.17.21(transitive)

• - Removedprop-types@15.8.1(transitive)

• - Removedreact@15.7.0(transitive)

• - Removedreact-addons-transition-group@15.6.2(transitive)

• - Removedreact-dom@15.7.0(transitive)

• - Removedreact-is@16.13.1(transitive)

• - Removedreact-transition-group@1.2.1(transitive)

• - Removedregenerator-runtime@0.14.1(transitive)

• - Removedwarning@3.0.0(transitive)

• Updatedlodash@~4.13.1

• Updatedreact-addons-transition-group@^0.14.0 || ~15.1.0