import _extends from 'babel-runtime/helpers/extends';
import _defineProperty from 'babel-runtime/helpers/defineProperty';
import _objectWithoutProperties from 'babel-runtime/helpers/objectWithoutProperties';
import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
import _createClass from 'babel-runtime/helpers/createClass';
import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
import _inherits from 'babel-runtime/helpers/inherits';
var _jsxFileName = 'src/collapse/Collapse.jsx';
import React, { Component } from 'react';
import classNames from 'classnames';
import PropTypes from 'prop-types';
import Transition from 'react-transition-group/Transition';

export function getTransitionProps(props, options) {
    var timeout = props.timeout,
        _props$style = props.style,
        style = _props$style === undefined ? {} : _props$style;


    return {
        duration: style.transitionDuration || typeof timeout === 'number' ? timeout : timeout[options.mode],
        delay: style.transitionDelay
    };
}

var Collapse = function (_Component) {
    _inherits(Collapse, _Component);

    function Collapse() {
        var _ref;

        var _temp, _this, _ret;

        _classCallCheck(this, Collapse);

        for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
            args[_key] = arguments[_key];
        }

        return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_ref = Collapse.__proto__ || Object.getPrototypeOf(Collapse)).call.apply(_ref, [this].concat(args))), _this), _this.getWrapper = function (el) {
            if (el) _this.wrapper = el;
        }, _this.handleEnter = function (node) {
            node.style.height = _this.props.collapsedHeight;

            if (_this.props.onEnter) {
                _this.props.onEnter(node);
            }
        }, _this.handleEntering = function (node) {
            var _this$props = _this.props,
                timeout = _this$props.timeout,
                getAutoDuration = _this$props.getAutoDuration;

            var wrapperHeight = _this.wrapper ? _this.wrapper.clientHeight : 0;

            var _getTransitionProps = getTransitionProps(_this.props, {
                mode: 'enter'
            }),
                transitionDuration = _getTransitionProps.duration;

            if (timeout === 'auto') {
                var autoDuration = getAutoDuration(wrapperHeight);
                node.style.transitionDuration = autoDuration + 'ms';
                _this.autoTransitionDuration = autoDuration;
            } else {
                node.style.transitionDuration = typeof transitionDuration === 'string' ? transitionDuration : transitionDuration + 'ms';
            }

            node.style.height = wrapperHeight + 'px';

            if (_this.props.onEntering) {
                _this.props.onEntering(node);
            }
        }, _this.handleEntered = function (node) {
            node.style.height = 'auto';

            if (_this.props.onEntered) {
                _this.props.onEntered(node);
            }
        }, _this.handleExit = function (node) {
            var wrapperHeight = _this.wrapper ? _this.wrapper.clientHeight : 0;
            node.style.height = wrapperHeight + 'px';

            if (_this.props.onExit) {
                _this.props.onExit(node);
            }
        }, _this.handleExiting = function (node) {
            var _this$props2 = _this.props,
                timeout = _this$props2.timeout,
                getAutoDuration = _this$props2.getAutoDuration;

            var wrapperHeight = _this.wrapper ? _this.wrapper.clientHeight : 0;

            var _getTransitionProps2 = getTransitionProps(_this.props, {
                mode: 'exit'
            }),
                transitionDuration = _getTransitionProps2.duration;

            if (timeout === 'auto') {
                var autoDuration = getAutoDuration(wrapperHeight);
                node.style.transitionDuration = autoDuration + 'ms';
                _this.autoTransitionDuration = autoDuration;
            } else {
                node.style.transitionDuration = typeof transitionDuration === 'string' ? transitionDuration : transitionDuration + 'ms';
            }

            node.style.height = _this.props.collapsedHeight;

            if (_this.props.onExiting) {
                _this.props.onExiting(node);
            }
        }, _this.addEndListener = function (node, next) {
            if (_this.props.timeout === 'auto') {
                _this.timer = setTimeout(next, _this.autoTransitionDuration || 0);
            }
        }, _temp), _possibleConstructorReturn(_this, _ret);
    }

    _createClass(Collapse, [{
        key: 'componentWillUnmount',
        value: function componentWillUnmount() {
            clearTimeout(this.timer);
        }
    }, {
        key: 'render',
        value: function render() {
            var _this2 = this;

            var _props = this.props,
                prefixCls = _props.prefixCls,
                timeout = _props.timeout,
                children = _props.children,
                Wrapper = _props.wrapper,
                wrapperProps = _props.wrapperProps,
                className = _props.className,
                collapsedHeight = _props.collapsedHeight,
                style = _props.style,
                other = _objectWithoutProperties(_props, ['prefixCls', 'timeout', 'children', 'wrapper', 'wrapperProps', 'className', 'collapsedHeight', 'style']);

            return React.createElement(
                Transition,
                Object.assign({
                    onEntering: this.handleEntering,
                    onEnter: this.handleEnter,
                    onEntered: this.handleEntered,
                    onExiting: this.handleExiting,
                    onExit: this.handleExit,
                    addEndListener: this.addEndListener,
                    timeout: timeout === 'auto' ? null : timeout
                }, other, {
                    __source: {
                        fileName: _jsxFileName,
                        lineNumber: 148
                    },
                    __self: this
                }),
                function (state) {
                    return React.createElement(
                        Wrapper,
                        Object.assign({
                            className: classNames(prefixCls, _defineProperty({}, prefixCls + '-entered', state === 'entered'), className),
                            style: _extends({}, style, {
                                minHeight: collapsedHeight
                            })
                        }, wrapperProps, {
                            __source: {
                                fileName: _jsxFileName,
                                lineNumber: 159
                            },
                            __self: _this2
                        }),
                        React.createElement(
                            'div',
                            { className: prefixCls + '-wrapper-inner', ref: _this2.getWrapper, __source: {
                                    fileName: _jsxFileName,
                                    lineNumber: 172
                                },
                                __self: _this2
                            },
                            children
                        )
                    );
                }
            );
        }
    }]);

    return Collapse;
}(Component);

Collapse.propTypes = {
    /** 收缩后剩余高度, 如'5px', '10rem' */
    collapsedHeight: PropTypes.string,
    prefixCls: PropTypes.string,
    /** 是否收缩 */
    in: PropTypes.bool,
    /** 参考react-transition-group/Transition */
    onEnter: PropTypes.func,
    /** 参考react-transition-group/Transition */
    onEntered: PropTypes.func,
    /** 参考react-transition-group/Transition */
    onEntering: PropTypes.func,
    /** 参考react-transition-group/Transition */
    onExit: PropTypes.func,
    /** 参考react-transition-group/Transition */
    onExiting: PropTypes.func,
    /** 动画时间 */
    timeout: PropTypes.oneOfType([PropTypes.number, PropTypes.shape({ enter: PropTypes.number, exit: PropTypes.number }), PropTypes.oneOf(['auto'])]),
    /** 动画时间计算方法 function(height: number) => time: number */
    getAutoDuration: PropTypes.func
};
Collapse.defaultProps = {
    wrapper: 'div',
    prefixCls: 'ne-collapse',
    timeout: 200,
    collapsedHeight: '0px',
    getAutoDuration: function getAutoDuration(height) {
        return height * 2;
    }
};
export default Collapse;