rc-animate
Advanced tools
Comparing version 2.0.4 to 2.1.0
'use strict'; | ||
Object.defineProperty(exports, '__esModule', { | ||
Object.defineProperty(exports, "__esModule", { | ||
value: true | ||
}); | ||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; } | ||
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } | ||
var _react = require('react'); | ||
@@ -25,9 +21,14 @@ | ||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } | ||
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } | ||
var defaultKey = 'rc_animate_' + Date.now(); | ||
function getChildrenFromProps(props) { | ||
var children = props.children; | ||
if (_react2['default'].isValidElement(children)) { | ||
if (_react2["default"].isValidElement(children)) { | ||
if (!children.key) { | ||
return _react2['default'].cloneElement(children, { | ||
return _react2["default"].cloneElement(children, { | ||
key: defaultKey | ||
@@ -42,18 +43,18 @@ }); | ||
var Animate = _react2['default'].createClass({ | ||
var Animate = _react2["default"].createClass({ | ||
displayName: 'Animate', | ||
propTypes: { | ||
component: _react2['default'].PropTypes.any, | ||
animation: _react2['default'].PropTypes.object, | ||
transitionName: _react2['default'].PropTypes.string, | ||
transitionEnter: _react2['default'].PropTypes.bool, | ||
transitionAppear: _react2['default'].PropTypes.bool, | ||
exclusive: _react2['default'].PropTypes.bool, | ||
transitionLeave: _react2['default'].PropTypes.bool, | ||
onEnd: _react2['default'].PropTypes.func, | ||
onEnter: _react2['default'].PropTypes.func, | ||
onLeave: _react2['default'].PropTypes.func, | ||
onAppear: _react2['default'].PropTypes.func, | ||
showProp: _react2['default'].PropTypes.string | ||
component: _react2["default"].PropTypes.any, | ||
animation: _react2["default"].PropTypes.object, | ||
transitionName: _react2["default"].PropTypes.string, | ||
transitionEnter: _react2["default"].PropTypes.bool, | ||
transitionAppear: _react2["default"].PropTypes.bool, | ||
exclusive: _react2["default"].PropTypes.bool, | ||
transitionLeave: _react2["default"].PropTypes.bool, | ||
onEnd: _react2["default"].PropTypes.func, | ||
onEnter: _react2["default"].PropTypes.func, | ||
onLeave: _react2["default"].PropTypes.func, | ||
onAppear: _react2["default"].PropTypes.func, | ||
showProp: _react2["default"].PropTypes.string | ||
}, | ||
@@ -74,3 +75,2 @@ | ||
}, | ||
getInitialState: function getInitialState() { | ||
@@ -84,3 +84,2 @@ this.currentlyAnimatingKeys = {}; | ||
}, | ||
componentDidMount: function componentDidMount() { | ||
@@ -100,3 +99,2 @@ var _this = this; | ||
}, | ||
componentWillReceiveProps: function componentWillReceiveProps(nextProps) { | ||
@@ -123,5 +121,5 @@ var _this2 = this; | ||
var nextChild = (0, _ChildrenUtils.findChildInChildrenByKey)(nextChildren, currentChild.key); | ||
var newChild = undefined; | ||
var newChild = void 0; | ||
if ((!nextChild || !nextChild.props[showProp]) && currentChild.props[showProp]) { | ||
newChild = _react2['default'].cloneElement(nextChild || currentChild, _defineProperty({}, showProp, true)); | ||
newChild = _react2["default"].cloneElement(nextChild || currentChild, _defineProperty({}, showProp, true)); | ||
} else { | ||
@@ -190,14 +188,10 @@ newChild = nextChild; | ||
}, | ||
componentDidUpdate: function componentDidUpdate() { | ||
if (this.isMounted()) { | ||
var keysToEnter = this.keysToEnter; | ||
this.keysToEnter = []; | ||
keysToEnter.forEach(this.performEnter); | ||
var keysToLeave = this.keysToLeave; | ||
this.keysToLeave = []; | ||
keysToLeave.forEach(this.performLeave); | ||
} | ||
var keysToEnter = this.keysToEnter; | ||
this.keysToEnter = []; | ||
keysToEnter.forEach(this.performEnter); | ||
var keysToLeave = this.keysToLeave; | ||
this.keysToLeave = []; | ||
keysToLeave.forEach(this.performLeave); | ||
}, | ||
performEnter: function performEnter(key) { | ||
@@ -210,3 +204,2 @@ // may already remove by exclusive | ||
}, | ||
performAppear: function performAppear(key) { | ||
@@ -218,3 +211,2 @@ if (this.refs[key]) { | ||
}, | ||
handleDoneAdding: function handleDoneAdding(key, type) { | ||
@@ -233,3 +225,3 @@ var props = this.props; | ||
if (type === 'appear') { | ||
if (_util2['default'].allowAppearCallback(props)) { | ||
if (_util2["default"].allowAppearCallback(props)) { | ||
props.onAppear(key); | ||
@@ -239,3 +231,3 @@ props.onEnd(key, true); | ||
} else { | ||
if (_util2['default'].allowEnterCallback(props)) { | ||
if (_util2["default"].allowEnterCallback(props)) { | ||
props.onEnter(key); | ||
@@ -247,3 +239,2 @@ props.onEnd(key, true); | ||
}, | ||
performLeave: function performLeave(key) { | ||
@@ -256,3 +247,2 @@ // may already remove by exclusive | ||
}, | ||
handleDoneLeaving: function handleDoneLeaving(key) { | ||
@@ -270,2 +260,3 @@ var props = this.props; | ||
} else { | ||
/* eslint react/no-is-mounted:0 */ | ||
if (this.isMounted() && !(0, _ChildrenUtils.isSameChildren)(this.state.children, currentChildren, props.showProp)) { | ||
@@ -276,3 +267,3 @@ this.setState({ | ||
} | ||
if (_util2['default'].allowLeaveCallback(props)) { | ||
if (_util2["default"].allowLeaveCallback(props)) { | ||
props.onLeave(key); | ||
@@ -283,3 +274,2 @@ props.onEnd(key, false); | ||
}, | ||
isValidChildByKey: function isValidChildByKey(currentChildren, key) { | ||
@@ -292,3 +282,2 @@ var showProp = this.props.showProp; | ||
}, | ||
stop: function stop(key) { | ||
@@ -301,3 +290,2 @@ delete this.currentlyAnimatingKeys[key]; | ||
}, | ||
render: function render() { | ||
@@ -316,4 +304,4 @@ var props = this.props; | ||
} | ||
return _react2['default'].createElement( | ||
_AnimateChild2['default'], | ||
return _react2["default"].createElement( | ||
_AnimateChild2["default"], | ||
{ | ||
@@ -326,3 +314,4 @@ key: child.key, | ||
transitionAppear: props.transitionAppear, | ||
transitionLeave: props.transitionLeave }, | ||
transitionLeave: props.transitionLeave | ||
}, | ||
child | ||
@@ -334,3 +323,3 @@ ); | ||
if (Component) { | ||
return _react2['default'].createElement( | ||
return _react2["default"].createElement( | ||
Component, | ||
@@ -345,3 +334,3 @@ this.props, | ||
exports['default'] = Animate; | ||
exports["default"] = Animate; | ||
module.exports = exports['default']; |
'use strict'; | ||
Object.defineProperty(exports, '__esModule', { | ||
Object.defineProperty(exports, "__esModule", { | ||
value: true | ||
}); | ||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; } | ||
var _react = require('react'); | ||
@@ -25,2 +23,4 @@ | ||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } | ||
var transitionMap = { | ||
@@ -32,7 +32,7 @@ enter: 'transitionEnter', | ||
var AnimateChild = _react2['default'].createClass({ | ||
var AnimateChild = _react2["default"].createClass({ | ||
displayName: 'AnimateChild', | ||
propTypes: { | ||
children: _react2['default'].PropTypes.any | ||
children: _react2["default"].PropTypes.any | ||
}, | ||
@@ -43,31 +43,30 @@ | ||
}, | ||
componentWillEnter: function componentWillEnter(done) { | ||
if (_util2['default'].isEnterSupported(this.props)) { | ||
if (_util2["default"].isEnterSupported(this.props)) { | ||
this.transition('enter', done); | ||
} else { | ||
done(); | ||
setTimeout(done, 0); | ||
} | ||
}, | ||
componentWillAppear: function componentWillAppear(done) { | ||
if (_util2['default'].isAppearSupported(this.props)) { | ||
if (_util2["default"].isAppearSupported(this.props)) { | ||
this.transition('appear', done); | ||
} else { | ||
done(); | ||
setTimeout(done, 0); | ||
} | ||
}, | ||
componentWillLeave: function componentWillLeave(done) { | ||
if (_util2['default'].isLeaveSupported(this.props)) { | ||
if (_util2["default"].isLeaveSupported(this.props)) { | ||
this.transition('leave', done); | ||
} else { | ||
done(); | ||
// always sync, do not interupt with react component life cycle | ||
// update hidden -> animate hidden -> | ||
// didUpdate -> animate leave -> unmount (if animate is none) | ||
setTimeout(done, 0); | ||
} | ||
}, | ||
transition: function transition(animationType, finishCallback) { | ||
var _this = this; | ||
var node = _reactDom2['default'].findDOMNode(this); | ||
var node = _reactDom2["default"].findDOMNode(this); | ||
var props = this.props; | ||
@@ -81,3 +80,3 @@ var transitionName = props.transitionName; | ||
if ((_cssAnimation.isCssAnimationSupported || !props.animation[animationType]) && transitionName && props[transitionMap[animationType]]) { | ||
this.stopper = (0, _cssAnimation2['default'])(node, transitionName + '-' + animationType, end); | ||
this.stopper = (0, _cssAnimation2["default"])(node, transitionName + '-' + animationType, end); | ||
} else { | ||
@@ -87,3 +86,2 @@ this.stopper = props.animation[animationType](node, end); | ||
}, | ||
stop: function stop() { | ||
@@ -96,3 +94,2 @@ var stopper = this.stopper; | ||
}, | ||
render: function render() { | ||
@@ -103,3 +100,3 @@ return this.props.children; | ||
exports['default'] = AnimateChild; | ||
exports["default"] = AnimateChild; | ||
module.exports = exports['default']; |
'use strict'; | ||
Object.defineProperty(exports, '__esModule', { | ||
Object.defineProperty(exports, "__esModule", { | ||
value: true | ||
@@ -13,4 +13,2 @@ }); | ||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; } | ||
var _react = require('react'); | ||
@@ -20,5 +18,7 @@ | ||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } | ||
function toArrayChildren(children) { | ||
var ret = []; | ||
_react2['default'].Children.forEach(children, function (child) { | ||
_react2["default"].Children.forEach(children, function (child) { | ||
ret.push(child); | ||
@@ -25,0 +25,0 @@ }); |
@@ -1,4 +0,4 @@ | ||
// export this package's api | ||
'use strict'; | ||
// export this package's api | ||
module.exports = require('./Animate'); |
@@ -16,3 +16,2 @@ "use strict"; | ||
}, | ||
allowAppearCallback: function allowAppearCallback(props) { | ||
@@ -29,2 +28,2 @@ return props.transitionAppear || props.animation.appear; | ||
exports["default"] = util; | ||
module.exports = exports["default"]; | ||
module.exports = exports['default']; |
{ | ||
"name": "rc-animate", | ||
"version": "2.0.4", | ||
"version": "2.1.0", | ||
"description": "css-transition ui component for react", | ||
@@ -31,3 +31,3 @@ "keywords": [ | ||
"gh-pages": "rc-tools run gh-pages", | ||
"start": "rc-server", | ||
"start": "rc-tools run server", | ||
"pub": "rc-tools run pub", | ||
@@ -37,4 +37,5 @@ "lint": "rc-tools run lint", | ||
"saucelabs": "rc-tools run saucelabs", | ||
"browser-test": "rc-tools run browser-test", | ||
"browser-test-cover": "rc-tools run browser-test-cover" | ||
"test": "rc-tools run test", | ||
"chrome-test": "rc-tools run chrome-test", | ||
"coverage": "rc-tools run coverage" | ||
}, | ||
@@ -46,7 +47,6 @@ "devDependencies": { | ||
"pre-commit": "1.x", | ||
"rc-server": "3.x", | ||
"rc-tools": "4.x", | ||
"react": "0.14.x", | ||
"react-dom": "0.14.x", | ||
"react-addons-test-utils": "~0.14.0", | ||
"rc-tools": "5.x", | ||
"react": "15.x", | ||
"react-dom": "15.x", | ||
"react-addons-test-utils": "15.x", | ||
"velocity-animate": "~1.2.2" | ||
@@ -53,0 +53,0 @@ }, |
@@ -13,6 +13,2 @@ # rc-animate | ||
[![Sauce Test Status](https://saucelabs.com/buildstatus/rc_animate)](https://saucelabs.com/u/rc_animate) | ||
[![Sauce Test Status](https://saucelabs.com/browser-matrix/rc_animate.svg)](https://saucelabs.com/u/rc_animate) | ||
[npm-image]: http://img.shields.io/npm/v/rc-animate.svg?style=flat-square | ||
@@ -167,10 +163,17 @@ [npm-url]: http://npmjs.org/package/rc-animate | ||
http://localhost:8200/tests/runner.html?coverage | ||
``` | ||
npm test | ||
npm run chrome-test | ||
``` | ||
## Coverage | ||
http://localhost:8200/node_modules/rc-server/node_modules/node-jscover/lib/front-end/jscoverage.html?w=http://localhost:8200/tests/runner.html?coverage | ||
``` | ||
npm run coverage | ||
``` | ||
open coverage/ dir | ||
## License | ||
rc-animate is released under the MIT license. |
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
9
493
178
22421