react-transition-group - npm Package Compare versions

Comparing version 2.0.2 to 2.1.0

CSSTransition.js

@@ -176,7 +176,7 @@ 'use strict';
  *
- * .fade-leave {
+ * .fade-exit {
  *   opacity: 1;
  * }
  *
- * .fade-leave.fade-leave-active {
+ * .fade-exit.fade-exit-active {
  *   opacity: 0.01;
@@ -230,3 +230,3 @@ *   transition: opacity 300ms ease-in;
       _this.removeClasses(node, 'appear');
-      _this.removeClasses(node, 'exit');
+      _this.removeClasses(node, 'enter');
       (0, _addClass2.default)(node, className);
@@ -233,0 +233,0 @@

dist/react-transition-group.min.js

@@ -1,1 +0,1 @@
-!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e(require("react"),require("react-dom")):"function"==typeof define&&define.amd?define(["react","react-dom"],e):"object"==typeof exports?exports.ReactTransitionGroup=e(require("react"),require("react-dom")):t.ReactTransitionGroup=e(t.React,t.ReactDOM)}(this,function(t,e){return function(t){function e(r){if(n[r])return n[r].exports;var o=n[r]={i:r,l:!1,exports:{}};return t[r].call(o.exports,o,o.exports,e),o.l=!0,o.exports}var n={};return e.m=t,e.c=n,e.i=function(t){return t},e.d=function(t,n,r){e.o(t,n)||Object.defineProperty(t,n,{configurable:!1,enumerable:!0,get:r})},e.n=function(t){var n=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(n,"a",n),n},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p="",e(e.s=12)}([function(t,e,n){"use strict";"function"==typeof Symbol&&Symbol.iterator;t.exports=n(11)()},function(e,n){e.exports=t},function(t,e,n){"use strict";function r(t){return t&&t.__esModule?t:{default:t}}function o(t,e){var n={};for(var r in t)e.indexOf(r)>=0||Object.prototype.hasOwnProperty.call(t,r)&&(n[r]=t[r]);return n}function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function a(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function s(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}function u(){}e.__esModule=!0,e.EXITING=e.ENTERED=e.ENTERING=e.EXITED=e.UNMOUNTED=void 0;var l=n(0),c=function(t){if(t&&t.__esModule)return t;var e={};if(null!=t)for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n]);return e.default=t,e}(l),p=n(1),f=r(p),d=n(14),h=r(d),E=(n(3),e.UNMOUNTED="unmounted"),m=e.EXITED="exited",x=e.ENTERING="entering",v=e.ENTERED="entered",y=e.EXITING="exiting",b=function(t){function e(n,r){i(this,e);var o=a(this,t.call(this,n,r)),s=r.transitionGroup,u=s&&!s.isMounting?n.enter:n.appear,l=void 0;return o.nextStatus=null,n.in?u?(l=m,o.nextStatus=x):l=v:l=n.unmountOnExit||n.mountOnEnter?E:m,o.state={status:l},o.nextCallback=null,o}return s(e,t),e.prototype.getChildContext=function(){return{transitionGroup:null}},e.prototype.componentDidMount=function(){this.updateStatus(!0)},e.prototype.componentWillReceiveProps=function(t){var e=this.state.status;t.in?(e===E&&this.setState({status:m}),e!==x&&e!==v&&(this.nextStatus=x)):e!==x&&e!==v||(this.nextStatus=y)},e.prototype.componentDidUpdate=function(){this.updateStatus()},e.prototype.componentWillUnmount=function(){this.cancelNextCallback()},e.prototype.getTimeouts=function(){var t=this.props.timeout,e=void 0,n=void 0,r=void 0;return e=n=r=t,"number"!=typeof t&&(e=t.exit,n=t.enter,r=t.appear),{exit:e,enter:n,appear:r}},e.prototype.updateStatus=function(){var t=arguments.length>0&&void 0!==arguments[0]&&arguments[0];if(null!==this.nextStatus){this.cancelNextCallback();var e=h.default.findDOMNode(this);this.nextStatus===x?this.performEnter(e,t):this.performExit(e),this.nextStatus=null}else this.props.unmountOnExit&&this.state.status===m&&this.setState({status:E})},e.prototype.performEnter=function(t,e){var n=this,r=this.props.enter,o=this.context.transitionGroup?this.context.transitionGroup.isMounting:e,i=this.getTimeouts();if(!e&&!r)return void this.safeSetState({status:v},function(){n.props.onEntered(t)});this.props.onEnter(t,o),this.safeSetState({status:x},function(){n.props.onEntering(t,o),n.onTransitionEnd(t,i.enter,function(){n.safeSetState({status:v},function(){n.props.onEntered(t,o)})})})},e.prototype.performExit=function(t){var e=this,n=this.props.exit,r=this.getTimeouts();if(!n)return void this.safeSetState({status:m},function(){e.props.onExited(t)});this.props.onExit(t),this.safeSetState({status:y},function(){e.props.onExiting(t),e.onTransitionEnd(t,r.exit,function(){e.safeSetState({status:m},function(){e.props.onExited(t)})})})},e.prototype.cancelNextCallback=function(){null!==this.nextCallback&&(this.nextCallback.cancel(),this.nextCallback=null)},e.prototype.safeSetState=function(t,e){this.setState(t,this.setNextCallback(e))},e.prototype.setNextCallback=function(t){var e=this,n=!0;return this.nextCallback=function(r){n&&(n=!1,e.nextCallback=null,t(r))},this.nextCallback.cancel=function(){n=!1},this.nextCallback},e.prototype.onTransitionEnd=function(t,e,n){this.setNextCallback(n),t?(this.props.addEndListener&&this.props.addEndListener(t,this.nextCallback),setTimeout(this.nextCallback,e)):setTimeout(this.nextCallback,0)},e.prototype.render=function(){var t=this.state.status;if(t===E)return null;var n=this.props,r=n.children,i=o(n,["children"]);if(Object.keys(e.propTypes).forEach(function(t){return delete i[t]}),"function"==typeof r)return r(t,i);var a=f.default.Children.only(r);return f.default.cloneElement(a,i)},e}(f.default.Component);b.contextTypes={transitionGroup:c.object},b.childContextTypes={transitionGroup:function(){}},b.propTypes={},b.defaultProps={in:!1,mountOnEnter:!1,unmountOnExit:!1,appear:!1,enter:!0,exit:!0,onEnter:u,onEntering:u,onEntered:u,onExit:u,onExiting:u,onExited:u},b.UNMOUNTED=0,b.EXITED=1,b.ENTERING=2,b.ENTERED=3,b.EXITING=4,e.default=b},function(t,e,n){"use strict";function r(t){var e="transition"+t+"Timeout",n="transition"+t;return function(t){if(t[n]){if(null==t[e])return new Error(e+" wasn't supplied to CSSTransitionGroup: this can cause unreliable animations and won't be supported in a future version of React. See https://fb.me/react-animation-transition-group-timeout for more information.");if("number"!=typeof t[e])return new Error(e+" must be a number (in milliseconds)")}return null}}e.__esModule=!0,e.classNamesShape=e.timeoutsShape=void 0,e.transitionTimeout=r;var o=n(0),i=function(t){return t&&t.__esModule?t:{default:t}}(o);e.timeoutsShape=i.default.oneOfType([i.default.number,i.default.shape({enter:i.default.number,exit:i.default.number}).isRequired]).isRequired,e.classNamesShape=i.default.oneOfType([i.default.string,i.default.shape({enter:i.default.string,leave:i.default.string,active:i.default.string}),i.default.shape({enter:i.default.string,enterActive:i.default.string,leave:i.default.string,leaveActive:i.default.string})])},function(t,e,n){"use strict";function r(t){return t&&t.__esModule?t:{default:t}}function o(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function i(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function a(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}e.__esModule=!0;var s=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(t[r]=n[r])}return t},u=n(0),l=function(t){if(t&&t.__esModule)return t;var e={};if(null!=t)for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n]);return e.default=t,e}(u),c=n(6),p=r(c),f=n(8),d=r(f),h=n(1),E=r(h),m=n(2),x=r(m),v=n(3),y=(s({},x.default.propTypes,{classNames:v.classNamesShape,onEnter:l.func,onEntering:l.func,onEntered:l.func,onExit:l.func,onExiting:l.func,onExited:l.func}),function(t){function e(){var n,r,a;o(this,e);for(var s=arguments.length,u=Array(s),l=0;l<s;l++)u[l]=arguments[l];return n=r=i(this,t.call.apply(t,[this].concat(u))),r.onEnter=function(t,e){var n=r.getClassNames(e?"appear":"enter"),o=n.className;r.removeClasses(t,"exit"),(0,p.default)(t,o),r.props.onEnter&&r.props.onEnter(t)},r.onEntering=function(t,e){var n=r.getClassNames(e?"appear":"enter"),o=n.activeClassName;r.reflowAndAddClass(t,o),r.props.onEntering&&r.props.onEntering(t)},r.onEntered=function(t,e){r.removeClasses(t,e?"appear":"enter"),r.props.onEntered&&r.props.onEntered(t)},r.onExit=function(t){var e=r.getClassNames("exit"),n=e.className;r.removeClasses(t,"appear"),r.removeClasses(t,"exit"),(0,p.default)(t,n),r.props.onExit&&r.props.onExit(t)},r.onExiting=function(t){var e=r.getClassNames("exit"),n=e.activeClassName;r.reflowAndAddClass(t,n),r.props.onExiting&&r.props.onExiting(t)},r.onExited=function(t){r.removeClasses(t,"exit"),r.props.onExited&&r.props.onExited(t)},r.getClassNames=function(t){var e=r.props.classNames,n="string"!=typeof e?e[t]:e+"-"+t;return{className:n,activeClassName:"string"!=typeof e?e[t+"Active"]:n+"-active"}},a=n,i(r,a)}return a(e,t),e.prototype.removeClasses=function(t,e){var n=this.getClassNames(e),r=n.className,o=n.activeClassName;r&&(0,d.default)(t,r),o&&(0,d.default)(t,o)},e.prototype.reflowAndAddClass=function(t,e){t.scrollTop,(0,p.default)(t,e)},e.prototype.render=function(){var t=s({},this.props);return delete t.classNames,E.default.createElement(x.default,s({},t,{onEnter:this.onEnter,onEntered:this.onEntered,onEntering:this.onEntering,onExit:this.onExit,onExiting:this.onExiting,onExited:this.onExited}))},e}(E.default.Component));y.propTypes={},e.default=y,t.exports=e.default},function(t,e,n){"use strict";function r(t){return t&&t.__esModule?t:{default:t}}function o(t,e){var n={};for(var r in t)e.indexOf(r)>=0||Object.prototype.hasOwnProperty.call(t,r)&&(n[r]=t[r]);return n}function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function a(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function s(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}e.__esModule=!0;var u=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(t[r]=n[r])}return t},l=n(0),c=r(l),p=n(1),f=r(p),d=n(13),h=Object.values||function(t){return Object.keys(t).map(function(e){return t[e]})},E=(c.default.any,c.default.node,c.default.bool,c.default.bool,c.default.bool,{component:"div"}),m=function(t){function e(n,r){i(this,e);var o=a(this,t.call(this,n,r));return o.handleExited=function(t){var e=(0,d.getChildMapping)(o.props.children);t in e||o.setState(function(e){var n=u({},e.children);return delete n[t],{children:n}})},o.state={children:(0,d.getChildMapping)(n.children,function(t){var e=function(){t.props.onExited&&t.props.onExited(),o.handleExited(t.key)};return(0,p.cloneElement)(t,{onExited:e,in:!0,appear:o.getProp(t,"appear"),enter:o.getProp(t,"enter"),exit:o.getProp(t,"exit")})})},o}return s(e,t),e.prototype.getChildContext=function(){return{transitionGroup:{isMounting:!this.appeared}}},e.prototype.getProp=function(t,e){var n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:this.props;return null!=n[e]?n[e]:t.props[e]},e.prototype.componentDidMount=function(){this.appeared=!0},e.prototype.componentWillReceiveProps=function(t){var e=this,n=this.state.children,r=(0,d.getChildMapping)(t.children),o=(0,d.mergeChildMappings)(n,r);Object.keys(o).forEach(function(i){var a=o[i];if((0,p.isValidElement)(a)){var s=function(){return e.handleExited(i)},u=i in n,l=i in r,c=n[i],f=(0,p.isValidElement)(c)&&!c.props.in;!l||u&&!f?l||!u||f?l&&u&&(0,p.isValidElement)(c)&&(o[i]=(0,p.cloneElement)(a,{onExited:s,in:c.props.in,exit:e.getProp(a,"exit",t),enter:e.getProp(a,"enter",t)})):o[i]=(0,p.cloneElement)(a,{in:!1}):o[i]=(0,p.cloneElement)(a,{onExited:s,in:!0,exit:e.getProp(a,"exit",t),enter:e.getProp(a,"enter",t)})}}),this.setState({children:o})},e.prototype.render=function(){var t=this.props,e=t.component,n=o(t,["component"]),r=this.state.children;return delete n.appear,delete n.enter,delete n.exit,f.default.createElement(e,n,h(r))},e}(f.default.Component);m.childContextTypes={transitionGroup:c.default.object.isRequired},m.propTypes={},m.defaultProps=E,e.default=m,t.exports=e.default},function(t,e,n){"use strict";function r(t,e){t.classList?t.classList.add(e):(0,i.default)(t)||(t.className=t.className+" "+e)}Object.defineProperty(e,"__esModule",{value:!0}),e.default=r;var o=n(7),i=function(t){return t&&t.__esModule?t:{default:t}}(o);t.exports=e.default},function(t,e,n){"use strict";function r(t,e){return t.classList?!!e&&t.classList.contains(e):-1!==(" "+t.className+" ").indexOf(" "+e+" ")}Object.defineProperty(e,"__esModule",{value:!0}),e.default=r,t.exports=e.default},function(t,e,n){"use strict";t.exports=function(t,e){t.classList?t.classList.remove(e):t.className=t.className.replace(new RegExp("(^|\\s)"+e+"(?:\\s|$)","g"),"$1").replace(/\s+/g," ").replace(/^\s*|\s*$/g,"")}},function(t,e,n){"use strict";function r(t){return function(){return t}}var o=function(){};o.thatReturns=r,o.thatReturnsFalse=r(!1),o.thatReturnsTrue=r(!0),o.thatReturnsNull=r(null),o.thatReturnsThis=function(){return this},o.thatReturnsArgument=function(t){return t},t.exports=o},function(t,e,n){"use strict";function r(t,e,n,r,i,a,s,u){if(o(e),!t){var l;if(void 0===e)l=new Error("Minified exception occurred; use the non-minified dev environment for the full error message and additional helpful warnings.");else{var c=[n,r,i,a,s,u],p=0;l=new Error(e.replace(/%s/g,function(){return c[p++]})),l.name="Invariant Violation"}throw l.framesToPop=1,l}}var o=function(t){};t.exports=r},function(t,e,n){"use strict";var r=n(9),o=n(10);t.exports=function(){function t(){o(!1)}function e(){return t}t.isRequired=t;var n={array:t,bool:t,func:t,number:t,object:t,string:t,symbol:t,any:t,arrayOf:e,element:t,instanceOf:e,node:t,objectOf:e,oneOf:e,oneOfType:e,shape:e};return n.checkPropTypes=r,n.PropTypes=n,n}},function(t,e,n){"use strict";function r(t){return t&&t.__esModule?t:{default:t}}var o=n(4),i=r(o),a=n(5),s=r(a),u=n(2),l=r(u);t.exports={Transition:l.default,TransitionGroup:s.default,CSSTransition:i.default}},function(t,e,n){"use strict";function r(t,e){var n=function(t){return e&&(0,i.isValidElement)(t)?e(t):t},r=Object.create(null);return t&&i.Children.map(t,function(t){return t}).forEach(function(t){r[t.key]=n(t)}),r}function o(t,e){function n(n){return n in e?e[n]:t[n]}t=t||{},e=e||{};var r=Object.create(null),o=[];for(var i in t)i in e?o.length&&(r[i]=o,o=[]):o.push(i);var a=void 0,s={};for(var u in e){if(r[u])for(a=0;a<r[u].length;a++){var l=r[u][a];s[r[u][a]]=n(l)}s[u]=n(u)}for(a=0;a<o.length;a++)s[o[a]]=n(o[a]);return s}e.__esModule=!0,e.getChildMapping=r,e.mergeChildMappings=o;var i=n(1)},function(t,n){t.exports=e}])});
+!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e(require("react"),require("react-dom")):"function"==typeof define&&define.amd?define(["react","react-dom"],e):"object"==typeof exports?exports.ReactTransitionGroup=e(require("react"),require("react-dom")):t.ReactTransitionGroup=e(t.React,t.ReactDOM)}(this,function(t,e){return function(t){function e(r){if(n[r])return n[r].exports;var o=n[r]={i:r,l:!1,exports:{}};return t[r].call(o.exports,o,o.exports,e),o.l=!0,o.exports}var n={};return e.m=t,e.c=n,e.i=function(t){return t},e.d=function(t,n,r){e.o(t,n)||Object.defineProperty(t,n,{configurable:!1,enumerable:!0,get:r})},e.n=function(t){var n=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(n,"a",n),n},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p="",e(e.s=12)}([function(t,e,n){"use strict";"function"==typeof Symbol&&Symbol.iterator;t.exports=n(11)()},function(e,n){e.exports=t},function(t,e,n){"use strict";function r(t){return t&&t.__esModule?t:{default:t}}function o(t,e){var n={};for(var r in t)e.indexOf(r)>=0||Object.prototype.hasOwnProperty.call(t,r)&&(n[r]=t[r]);return n}function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function a(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function s(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}function u(){}e.__esModule=!0,e.EXITING=e.ENTERED=e.ENTERING=e.EXITED=e.UNMOUNTED=void 0;var c=n(0),l=function(t){if(t&&t.__esModule)return t;var e={};if(null!=t)for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n]);return e.default=t,e}(c),p=n(1),f=r(p),d=n(14),h=r(d),E=(n(3),e.UNMOUNTED="unmounted"),m=e.EXITED="exited",x=e.ENTERING="entering",y=e.ENTERED="entered",v=e.EXITING="exiting",b=function(t){function e(n,r){i(this,e);var o=a(this,t.call(this,n,r)),s=r.transitionGroup,u=s&&!s.isMounting?n.enter:n.appear,c=void 0;return o.nextStatus=null,n.in?u?(c=m,o.nextStatus=x):c=y:c=n.unmountOnExit||n.mountOnEnter?E:m,o.state={status:c},o.nextCallback=null,o}return s(e,t),e.prototype.getChildContext=function(){return{transitionGroup:null}},e.prototype.componentDidMount=function(){this.updateStatus(!0)},e.prototype.componentWillReceiveProps=function(t){var e=this.state.status;t.in?(e===E&&this.setState({status:m}),e!==x&&e!==y&&(this.nextStatus=x)):e!==x&&e!==y||(this.nextStatus=v)},e.prototype.componentDidUpdate=function(){this.updateStatus()},e.prototype.componentWillUnmount=function(){this.cancelNextCallback()},e.prototype.getTimeouts=function(){var t=this.props.timeout,e=void 0,n=void 0,r=void 0;return e=n=r=t,"number"!=typeof t&&(e=t.exit,n=t.enter,r=t.appear),{exit:e,enter:n,appear:r}},e.prototype.updateStatus=function(){var t=arguments.length>0&&void 0!==arguments[0]&&arguments[0];if(null!==this.nextStatus){this.cancelNextCallback();var e=h.default.findDOMNode(this);this.nextStatus===x?this.performEnter(e,t):this.performExit(e),this.nextStatus=null}else this.props.unmountOnExit&&this.state.status===m&&this.setState({status:E})},e.prototype.performEnter=function(t,e){var n=this,r=this.props.enter,o=this.context.transitionGroup?this.context.transitionGroup.isMounting:e,i=this.getTimeouts();if(!e&&!r)return void this.safeSetState({status:y},function(){n.props.onEntered(t)});this.props.onEnter(t,o),this.safeSetState({status:x},function(){n.props.onEntering(t,o),n.onTransitionEnd(t,i.enter,function(){n.safeSetState({status:y},function(){n.props.onEntered(t,o)})})})},e.prototype.performExit=function(t){var e=this,n=this.props.exit,r=this.getTimeouts();if(!n)return void this.safeSetState({status:m},function(){e.props.onExited(t)});this.props.onExit(t),this.safeSetState({status:v},function(){e.props.onExiting(t),e.onTransitionEnd(t,r.exit,function(){e.safeSetState({status:m},function(){e.props.onExited(t)})})})},e.prototype.cancelNextCallback=function(){null!==this.nextCallback&&(this.nextCallback.cancel(),this.nextCallback=null)},e.prototype.safeSetState=function(t,e){this.setState(t,this.setNextCallback(e))},e.prototype.setNextCallback=function(t){var e=this,n=!0;return this.nextCallback=function(r){n&&(n=!1,e.nextCallback=null,t(r))},this.nextCallback.cancel=function(){n=!1},this.nextCallback},e.prototype.onTransitionEnd=function(t,e,n){this.setNextCallback(n),t?(this.props.addEndListener&&this.props.addEndListener(t,this.nextCallback),setTimeout(this.nextCallback,e)):setTimeout(this.nextCallback,0)},e.prototype.render=function(){var t=this.state.status;if(t===E)return null;var n=this.props,r=n.children,i=o(n,["children"]);if(Object.keys(e.propTypes).forEach(function(t){return delete i[t]}),"function"==typeof r)return r(t,i);var a=f.default.Children.only(r);return f.default.cloneElement(a,i)},e}(f.default.Component);b.contextTypes={transitionGroup:l.object},b.childContextTypes={transitionGroup:function(){}},b.propTypes={},b.defaultProps={in:!1,mountOnEnter:!1,unmountOnExit:!1,appear:!1,enter:!0,exit:!0,onEnter:u,onEntering:u,onEntered:u,onExit:u,onExiting:u,onExited:u},b.UNMOUNTED=0,b.EXITED=1,b.ENTERING=2,b.ENTERED=3,b.EXITING=4,e.default=b},function(t,e,n){"use strict";function r(t){var e="transition"+t+"Timeout",n="transition"+t;return function(t){if(t[n]){if(null==t[e])return new Error(e+" wasn't supplied to CSSTransitionGroup: this can cause unreliable animations and won't be supported in a future version of React. See https://fb.me/react-animation-transition-group-timeout for more information.");if("number"!=typeof t[e])return new Error(e+" must be a number (in milliseconds)")}return null}}e.__esModule=!0,e.classNamesShape=e.timeoutsShape=void 0,e.transitionTimeout=r;var o=n(0),i=function(t){return t&&t.__esModule?t:{default:t}}(o);e.timeoutsShape=i.default.oneOfType([i.default.number,i.default.shape({enter:i.default.number,exit:i.default.number}).isRequired]).isRequired,e.classNamesShape=i.default.oneOfType([i.default.string,i.default.shape({enter:i.default.string,exit:i.default.string,active:i.default.string}),i.default.shape({enter:i.default.string,enterActive:i.default.string,exit:i.default.string,exitActive:i.default.string})])},function(t,e,n){"use strict";function r(t){return t&&t.__esModule?t:{default:t}}function o(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function i(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function a(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}e.__esModule=!0;var s=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(t[r]=n[r])}return t},u=n(0),c=function(t){if(t&&t.__esModule)return t;var e={};if(null!=t)for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n]);return e.default=t,e}(u),l=n(6),p=r(l),f=n(8),d=r(f),h=n(1),E=r(h),m=n(2),x=r(m),y=n(3),v=(s({},x.default.propTypes,{classNames:y.classNamesShape,onEnter:c.func,onEntering:c.func,onEntered:c.func,onExit:c.func,onExiting:c.func,onExited:c.func}),function(t){function e(){var n,r,a;o(this,e);for(var s=arguments.length,u=Array(s),c=0;c<s;c++)u[c]=arguments[c];return n=r=i(this,t.call.apply(t,[this].concat(u))),r.onEnter=function(t,e){var n=r.getClassNames(e?"appear":"enter"),o=n.className;r.removeClasses(t,"exit"),(0,p.default)(t,o),r.props.onEnter&&r.props.onEnter(t)},r.onEntering=function(t,e){var n=r.getClassNames(e?"appear":"enter"),o=n.activeClassName;r.reflowAndAddClass(t,o),r.props.onEntering&&r.props.onEntering(t)},r.onEntered=function(t,e){r.removeClasses(t,e?"appear":"enter"),r.props.onEntered&&r.props.onEntered(t)},r.onExit=function(t){var e=r.getClassNames("exit"),n=e.className;r.removeClasses(t,"appear"),r.removeClasses(t,"enter"),(0,p.default)(t,n),r.props.onExit&&r.props.onExit(t)},r.onExiting=function(t){var e=r.getClassNames("exit"),n=e.activeClassName;r.reflowAndAddClass(t,n),r.props.onExiting&&r.props.onExiting(t)},r.onExited=function(t){r.removeClasses(t,"exit"),r.props.onExited&&r.props.onExited(t)},r.getClassNames=function(t){var e=r.props.classNames,n="string"!=typeof e?e[t]:e+"-"+t;return{className:n,activeClassName:"string"!=typeof e?e[t+"Active"]:n+"-active"}},a=n,i(r,a)}return a(e,t),e.prototype.removeClasses=function(t,e){var n=this.getClassNames(e),r=n.className,o=n.activeClassName;r&&(0,d.default)(t,r),o&&(0,d.default)(t,o)},e.prototype.reflowAndAddClass=function(t,e){t.scrollTop,(0,p.default)(t,e)},e.prototype.render=function(){var t=s({},this.props);return delete t.classNames,E.default.createElement(x.default,s({},t,{onEnter:this.onEnter,onEntered:this.onEntered,onEntering:this.onEntering,onExit:this.onExit,onExiting:this.onExiting,onExited:this.onExited}))},e}(E.default.Component));v.propTypes={},e.default=v,t.exports=e.default},function(t,e,n){"use strict";function r(t){return t&&t.__esModule?t:{default:t}}function o(t,e){var n={};for(var r in t)e.indexOf(r)>=0||Object.prototype.hasOwnProperty.call(t,r)&&(n[r]=t[r]);return n}function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function a(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function s(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}e.__esModule=!0;var u=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(t[r]=n[r])}return t},c=n(0),l=r(c),p=n(1),f=r(p),d=n(13),h=Object.values||function(t){return Object.keys(t).map(function(e){return t[e]})},E=(l.default.any,l.default.node,l.default.bool,l.default.bool,l.default.bool,l.default.func,{component:"div",childFactory:function(t){return t}}),m=function(t){function e(n,r){i(this,e);var o=a(this,t.call(this,n,r));return o.handleExited=function(t,e,n){var r=(0,d.getChildMapping)(o.props.children);t in r||(n&&n(e),o.setState(function(e){var n=u({},e.children);return delete n[t],{children:n}}))},o.state={children:(0,d.getChildMapping)(n.children,function(t){var e=function(e){o.handleExited(t.key,e,t.props.onExited)};return(0,p.cloneElement)(t,{onExited:e,in:!0,appear:o.getProp(t,"appear"),enter:o.getProp(t,"enter"),exit:o.getProp(t,"exit")})})},o}return s(e,t),e.prototype.getChildContext=function(){return{transitionGroup:{isMounting:!this.appeared}}},e.prototype.getProp=function(t,e){var n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:this.props;return null!=n[e]?n[e]:t.props[e]},e.prototype.componentDidMount=function(){this.appeared=!0},e.prototype.componentWillReceiveProps=function(t){var e=this,n=this.state.children,r=(0,d.getChildMapping)(t.children),o=(0,d.mergeChildMappings)(n,r);Object.keys(o).forEach(function(i){var a=o[i];if((0,p.isValidElement)(a)){var s=function(t){e.handleExited(a.key,t,a.props.onExited)},u=i in n,c=i in r,l=n[i],f=(0,p.isValidElement)(l)&&!l.props.in;!c||u&&!f?c||!u||f?c&&u&&(0,p.isValidElement)(l)&&(o[i]=(0,p.cloneElement)(a,{onExited:s,in:l.props.in,exit:e.getProp(a,"exit",t),enter:e.getProp(a,"enter",t)})):o[i]=(0,p.cloneElement)(a,{in:!1}):o[i]=(0,p.cloneElement)(a,{onExited:s,in:!0,exit:e.getProp(a,"exit",t),enter:e.getProp(a,"enter",t)})}}),this.setState({children:o})},e.prototype.render=function(){var t=this.props,e=t.component,n=t.childFactory,r=o(t,["component","childFactory"]),i=this.state.children;return delete r.appear,delete r.enter,delete r.exit,f.default.createElement(e,r,h(i).map(n))},e}(f.default.Component);m.childContextTypes={transitionGroup:l.default.object.isRequired},m.propTypes={},m.defaultProps=E,e.default=m,t.exports=e.default},function(t,e,n){"use strict";function r(t,e){t.classList?t.classList.add(e):(0,i.default)(t)||(t.className=t.className+" "+e)}Object.defineProperty(e,"__esModule",{value:!0}),e.default=r;var o=n(7),i=function(t){return t&&t.__esModule?t:{default:t}}(o);t.exports=e.default},function(t,e,n){"use strict";function r(t,e){return t.classList?!!e&&t.classList.contains(e):-1!==(" "+t.className+" ").indexOf(" "+e+" ")}Object.defineProperty(e,"__esModule",{value:!0}),e.default=r,t.exports=e.default},function(t,e,n){"use strict";t.exports=function(t,e){t.classList?t.classList.remove(e):t.className=t.className.replace(new RegExp("(^|\\s)"+e+"(?:\\s|$)","g"),"$1").replace(/\s+/g," ").replace(/^\s*|\s*$/g,"")}},function(t,e,n){"use strict";function r(t){return function(){return t}}var o=function(){};o.thatReturns=r,o.thatReturnsFalse=r(!1),o.thatReturnsTrue=r(!0),o.thatReturnsNull=r(null),o.thatReturnsThis=function(){return this},o.thatReturnsArgument=function(t){return t},t.exports=o},function(t,e,n){"use strict";function r(t,e,n,r,i,a,s,u){if(o(e),!t){var c;if(void 0===e)c=new Error("Minified exception occurred; use the non-minified dev environment for the full error message and additional helpful warnings.");else{var l=[n,r,i,a,s,u],p=0;c=new Error(e.replace(/%s/g,function(){return l[p++]})),c.name="Invariant Violation"}throw c.framesToPop=1,c}}var o=function(t){};t.exports=r},function(t,e,n){"use strict";var r=n(9),o=n(10);t.exports=function(){function t(){o(!1)}function e(){return t}t.isRequired=t;var n={array:t,bool:t,func:t,number:t,object:t,string:t,symbol:t,any:t,arrayOf:e,element:t,instanceOf:e,node:t,objectOf:e,oneOf:e,oneOfType:e,shape:e};return n.checkPropTypes=r,n.PropTypes=n,n}},function(t,e,n){"use strict";function r(t){return t&&t.__esModule?t:{default:t}}var o=n(4),i=r(o),a=n(5),s=r(a),u=n(2),c=r(u);t.exports={Transition:c.default,TransitionGroup:s.default,CSSTransition:i.default}},function(t,e,n){"use strict";function r(t,e){var n=function(t){return e&&(0,i.isValidElement)(t)?e(t):t},r=Object.create(null);return t&&i.Children.map(t,function(t){return t}).forEach(function(t){r[t.key]=n(t)}),r}function o(t,e){function n(n){return n in e?e[n]:t[n]}t=t||{},e=e||{};var r=Object.create(null),o=[];for(var i in t)i in e?o.length&&(r[i]=o,o=[]):o.push(i);var a=void 0,s={};for(var u in e){if(r[u])for(a=0;a<r[u].length;a++){var c=r[u][a];s[r[u][a]]=n(c)}s[u]=n(u)}for(a=0;a<o.length;a++)s[o[a]]=n(o[a]);return s}e.__esModule=!0,e.getChildMapping=r,e.mergeChildMappings=o;var i=n(1)},function(t,n){t.exports=e}])});

package.json

 {
   "name": "react-transition-group",
-  "version": "2.0.2",
+  "version": "2.1.0",
   "description": "A react component toolset for managing animations",
@@ -5,0 +5,0 @@ "main": "index.js",

README.md

@@ -14,2 +14,4 @@ **ATTENTION!** To address many issues that have come up over the years, the API in v2.0.0 is different from the original React addon.
 
+And the Migration details from v1: [https://github.com/reactjs/react-transition-group/blob/master/migration.md](https://github.com/reactjs/react-transition-group/blob/master/migration.md)
+
 ### Examples
@@ -16,0 +18,0 @@

Transition.js

@@ -41,3 +41,3 @@ 'use strict';
  * state to another _over time_ with a simple declarative API. Most commonly
- * It's used to animate the mounting and unmounting of Component, but can also
+ * it's used to animate the mounting and unmounting of a component, but can also
  * be used to describe in-place transition states as well.
@@ -57,3 +57,3 @@ *
  *   transition: `opacity ${duration}ms ease-in-out`,
- *   opactity: 0,
+ *   opacity: 0,
  * }
@@ -80,2 +80,18 @@ *
  *
+ * As noted the `Transition` component doesn't _do_ anything by itself to its child component.
+ * What it does do is track transition states over time so you can adjust you
+ * component (such as adding styles of classes) as it changes states.
+ *
+ * There are 4 main states a Transition can be in:
+ *  - `ENTERING`
+ *  - `ENTERED`
+ *  - `EXITING`
+ *  - `EXITED`
+ *
+ * Transition state is toggled via the `in` prop. When `true` the component begins the
+ * "Enter" stage. During this stage, the component will shift from its current transitions state,
+ * to `'entering'` for the duration of the transition and then to the `'entered'` stage once
+ * it's complete. So in the following example: `<Transition in timeout={500} />`,
+ * the component will immediately shift to `'entering'` and stay there for 500ms and switch to `'entered'`.
+ * When `in` is `false` the same thing happens except the states are `'exiting'` to `'exited'`.
  */
@@ -333,6 +349,3 @@
   /**
-   * Generally a React element to animate, all unknown props on Transition are
-   * transfered to the **single** child element.
-   *
-   * For advanced uses a `function` child can be used instead of a React element.
+   * A `function` child can be used instead of a React element.
    * This function is called with the current transition status
@@ -358,3 +371,6 @@ * ('entering', 'entered', 'exiting', 'exited', 'unmounted'), which can used
   /**
-   * Wait until the first "enter" transition to mount the component (add it to the DOM)
+   * By default the child component is mounted immediately along with
+   * the parent `Transition` component. If you want to "lazy mount" the component on the
+   * first `in={true}` you can set `mountOnEnter`. After the first enter transition the component will stay
+   * mounted even on exit unless you also specify `unmountOnExit`
    */
@@ -364,3 +380,4 @@ mountOnEnter: PropTypes.bool,
   /**
-   * Unmount the component (remove it from the DOM) when it is not shown
+   * By default the child component is mounted in the DOM after it enteres the `'exited'` state.
+   * If you'd prefer to completely unmonut the component after it exits, set `unmountOnExit`.
    */
@@ -370,3 +387,7 @@ unmountOnExit: PropTypes.bool,
   /**
-   * Enable or disable appear (entering on mount) transitions.
+   * Normally a component is not transitioned on it's initial mount. If you
+   * want to transition on the first mount set `appear` to `true`, and the
+   * component will enter the component.
+   *
+   * > Note: there are no specific "appear" states. `apprear` only an additional `enter` transition.
    */
@@ -394,3 +415,3 @@ appear: PropTypes.bool,
    *  enter: 300,
-   *  leave: 500,
+   *  exit: 500,
    * }}
@@ -418,5 +439,6 @@ * ```
   /**
-   * Callback fired before the "entering" status is applied.
+   * Callback fired before the "entering" status is applied. An extra parameter
+   * `isAppearing` is supplied to indicate if the enter stage is occuring on the initial mount
    *
-   * @type Function(node: HtmlElement, isAppearing: bool)
+   * @type Function(node: HtmlElement, isAppearing: bool) -> void
    */
@@ -426,3 +448,4 @@ onEnter: PropTypes.func,
   /**
-   * Callback fired after the "entering" status is applied.
+   * Callback fired after the "entering" status is applied. An extra parameter
+   * `isAppearing` is supplied to indicate if the enter stage is occuring on the initial mount
    *
@@ -434,5 +457,6 @@ * @type Function(node: HtmlElement, isAppearing: bool)
   /**
-   * Callback fired after the "enter" status is applied.
+   * Callback fired after the "enter" status is applied. An extra parameter
+   * `isAppearing` is supplied to indicate if the enter stage is occuring on the initial mount
    *
-   * @type Function(node: HtmlElement, isAppearing: bool)
+   * @type Function(node: HtmlElement, isAppearing: bool) -> void
    */
@@ -444,3 +468,3 @@ onEntered: PropTypes.func,
    *
-   * @type Function(node: HtmlElement)
+   * @type Function(node: HtmlElement) -> void
    */
@@ -452,3 +476,3 @@ onExit: PropTypes.func,
    *
-   * @type Function(node: HtmlElement)
+   * @type Function(node: HtmlElement) -> void
    */
@@ -460,3 +484,3 @@ onExiting: PropTypes.func,
    *
-   * @type Function(node: HtmlElement)
+   * @type Function(node: HtmlElement) -> void
    */
@@ -463,0 +487,0 @@ onExited: PropTypes.func

TransitionGroup.js

@@ -64,7 +64,22 @@ 'use strict';
     */
-  exit: _propTypes2.default.bool
+  exit: _propTypes2.default.bool,
+
+  /**
+   * You may need to apply reactive updates to a child as it is exiting.
+   * This is generally done by using `cloneElement` however in the case of an exiting
+   * child the element has already been removed and not accessible to the consumer.
+   *
+   * If you do need to update a child as it leaves you can provide a `childFactory`
+   * to wrap every child, even the ones that are leaving.
+   *
+   * @type Function(child: ReactElement) -> ReactElement
+   */
+  childFactory: _propTypes2.default.func
 };
 
 var defaultProps = {
-  component: 'div'
+  component: 'div',
+  childFactory: function childFactory(child) {
+    return child;
+  }
 };
@@ -139,3 +154,3 @@
 
-    _this.handleExited = function (key) {
+    _this.handleExited = function (key, node, originalHandler) {
       var currentChildMapping = (0, _ChildMapping.getChildMapping)(_this.props.children);
@@ -145,4 +160,7 @@
 
+      if (originalHandler) originalHandler(node);
+
       _this.setState(function (state) {
         var children = _extends({}, state.children);
+
         delete children[key];
@@ -155,6 +173,4 @@ return { children: children };
       children: (0, _ChildMapping.getChildMapping)(props.children, function (child) {
-        var onExited = function onExited() {
-          if (child.props.onExited) child.props.onExited();
-
-          _this.handleExited(child.key);
+        var onExited = function onExited(node) {
+          _this.handleExited(child.key, node, child.props.onExited);
         };
@@ -205,4 +221,4 @@
 
-      var onExited = function onExited() {
-        return _this2.handleExited(key);
+      var onExited = function onExited(node) {
+        _this2.handleExited(child.key, node, child.props.onExited);
       };
@@ -250,3 +266,4 @@
         Component = _props.component,
-        props = _objectWithoutProperties(_props, ['component']);
+        childFactory = _props.childFactory,
+        props = _objectWithoutProperties(_props, ['component', 'childFactory']);
 
@@ -263,3 +280,3 @@ var children = this.state.children;
       props,
-      values(children)
+      values(children).map(childFactory)
     );
@@ -266,0 +283,0 @@ };

utils/PropTypes.js

@@ -41,3 +41,3 @@ 'use strict';
   enter: _propTypes2.default.string,
-  leave: _propTypes2.default.string,
+  exit: _propTypes2.default.string,
   active: _propTypes2.default.string
@@ -47,4 +47,4 @@ }), _propTypes2.default.shape({
   enterActive: _propTypes2.default.string,
-  leave: _propTypes2.default.string,
-  leaveActive: _propTypes2.default.string
+  exit: _propTypes2.default.string,
+  exitActive: _propTypes2.default.string
 })]);

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

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

Improved metrics

Total package byte prevSize

141980

increased by3.85%

Lines of code

3111

increased by2.57%

Number of lines in readme file

26

increased by8.33%

No dependency changes