|
- 'use strict';
-
- Object.defineProperty(exports, "__esModule", {
- value: true
- });
-
- var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
-
- var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
-
- var _createClass2 = require('babel-runtime/helpers/createClass');
-
- var _createClass3 = _interopRequireDefault(_createClass2);
-
- var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
-
- var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
-
- var _inherits2 = require('babel-runtime/helpers/inherits');
-
- var _inherits3 = _interopRequireDefault(_inherits2);
-
- var _react = require('react');
-
- var _react2 = _interopRequireDefault(_react);
-
- var _reactDom = require('react-dom');
-
- var _reactDom2 = _interopRequireDefault(_reactDom);
-
- var _propTypes = require('prop-types');
-
- var _propTypes2 = _interopRequireDefault(_propTypes);
-
- var _cssAnimation = require('css-animation');
-
- var _cssAnimation2 = _interopRequireDefault(_cssAnimation);
-
- var _animate = require('./util/animate');
-
- var _animate2 = _interopRequireDefault(_animate);
-
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
-
- var transitionMap = {
- enter: 'transitionEnter',
- appear: 'transitionAppear',
- leave: 'transitionLeave'
- };
-
- var AnimateChild = function (_React$Component) {
- (0, _inherits3['default'])(AnimateChild, _React$Component);
-
- function AnimateChild() {
- (0, _classCallCheck3['default'])(this, AnimateChild);
- return (0, _possibleConstructorReturn3['default'])(this, (AnimateChild.__proto__ || Object.getPrototypeOf(AnimateChild)).apply(this, arguments));
- }
-
- (0, _createClass3['default'])(AnimateChild, [{
- key: 'componentWillUnmount',
- value: function componentWillUnmount() {
- this.stop();
- }
- }, {
- key: 'componentWillEnter',
- value: function componentWillEnter(done) {
- if (_animate2['default'].isEnterSupported(this.props)) {
- this.transition('enter', done);
- } else {
- done();
- }
- }
- }, {
- key: 'componentWillAppear',
- value: function componentWillAppear(done) {
- if (_animate2['default'].isAppearSupported(this.props)) {
- this.transition('appear', done);
- } else {
- done();
- }
- }
- }, {
- key: 'componentWillLeave',
- value: function componentWillLeave(done) {
- if (_animate2['default'].isLeaveSupported(this.props)) {
- this.transition('leave', done);
- } else {
- // always sync, do not interupt with react component life cycle
- // update hidden -> animate hidden ->
- // didUpdate -> animate leave -> unmount (if animate is none)
- done();
- }
- }
- }, {
- key: 'transition',
- value: function transition(animationType, finishCallback) {
- var _this2 = this;
-
- var node = _reactDom2['default'].findDOMNode(this);
- var props = this.props;
- var transitionName = props.transitionName;
- var nameIsObj = typeof transitionName === 'object';
- this.stop();
- var end = function end() {
- _this2.stopper = null;
- finishCallback();
- };
- if ((_cssAnimation.isCssAnimationSupported || !props.animation[animationType]) && transitionName && props[transitionMap[animationType]]) {
- var name = nameIsObj ? transitionName[animationType] : transitionName + '-' + animationType;
- var activeName = name + '-active';
- if (nameIsObj && transitionName[animationType + 'Active']) {
- activeName = transitionName[animationType + 'Active'];
- }
- this.stopper = (0, _cssAnimation2['default'])(node, {
- name: name,
- active: activeName
- }, end);
- } else {
- this.stopper = props.animation[animationType](node, end);
- }
- }
- }, {
- key: 'stop',
- value: function stop() {
- var stopper = this.stopper;
- if (stopper) {
- this.stopper = null;
- stopper.stop();
- }
- }
- }, {
- key: 'render',
- value: function render() {
- return this.props.children;
- }
- }]);
- return AnimateChild;
- }(_react2['default'].Component);
-
- AnimateChild.propTypes = {
- children: _propTypes2['default'].any,
- animation: _propTypes2['default'].any,
- transitionName: _propTypes2['default'].any
- };
- exports['default'] = AnimateChild;
- module.exports = exports['default'];
|