import _defineProperty from 'babel-runtime/helpers/defineProperty';
import _objectWithoutProperties from 'babel-runtime/helpers/objectWithoutProperties';
import _toConsumableArray from 'babel-runtime/helpers/toConsumableArray';
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/menu/Menu.jsx';
import React, { Component, Children, isValidElement, cloneElement } from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';

/**
 *  Menu
 */

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

    function Menu(props, context) {
        _classCallCheck(this, Menu);

        var _this = _possibleConstructorReturn(this, (Menu.__proto__ || Object.getPrototypeOf(Menu)).call(this, props, context));

        _initialiseProps.call(_this);

        var defaultValue = props.defaultValue,
            multiple = props.multiple,
            value = props.value,
            selectable = props.selectable;

        _this.isControlled = value != null;
        if (selectable && !_this.isControlled) {
            _this.state = {
                currentValue: !Array.isArray(defaultValue) && multiple ? defaultValue === '' || defaultValue == null ? [] : [defaultValue] : defaultValue
            };
        } else {
            _this.state = {};
        }
        return _this;
    }

    _createClass(Menu, [{
        key: 'getChildContext',
        value: function getChildContext() {
            var _props = this.props,
                autoFold = _props.autoFold,
                multiple = _props.multiple,
                selectable = _props.selectable,
                autoIndent = _props.autoIndent,
                indent = _props.indent,
                mode = _props.mode,
                propsValue = _props.value;
            var currentValue = this.state.currentValue;

            var value = selectable ? this.isControlled ? propsValue : currentValue : [];
            value = Array.isArray(value) ? [].concat(_toConsumableArray(value)) : [value];
            return {
                nuiMenuControl: {
                    autoFold: autoFold,
                    multiple: multiple,
                    selectable: selectable,
                    autoIndent: autoIndent,
                    indent: indent,
                    currentValue: value,
                    onSelect: this.onSelect,
                    mode: mode
                }
            };
        }
    }, {
        key: 'componentWillReceiveProps',
        value: function componentWillReceiveProps(newProps) {
            if (!this.isControlled && newProps.value != null) {
                this.isControlled = true;
                this.setState({
                    value: null
                });
            }
            if (newProps.defaultValue !== this.props.defaultValue && newProps.selectable && !this.isControlled) {
                this.setState({
                    currentValue: newProps.defaultValue != null ? newProps.defaultValue : []
                });
            }
        }
    }, {
        key: 'getMenuItems',
        value: function getMenuItems(children) {
            var items = [];
            Children.forEach(children, function (item) {
                if (isValidElement(item)) {
                    items.push(item);
                }
            });
            return items;
        }
    }, {
        key: 'render',
        value: function render() {
            var _classNames;

            var _props2 = this.props,
                children = _props2.children,
                prefixCls = _props2.prefixCls,
                className = _props2.className,
                selectable = _props2.selectable,
                autoFold = _props2.autoFold,
                disableAutoIndent = _props2.disableAutoIndent,
                value = _props2.value,
                defaultValue = _props2.defaultValue,
                onSelect = _props2.onSelect,
                onChange = _props2.onChange,
                level = _props2.level,
                autoIndent = _props2.autoIndent,
                indent = _props2.indent,
                compact = _props2.compact,
                size = _props2.size,
                other = _objectWithoutProperties(_props2, ['children', 'prefixCls', 'className', 'selectable', 'autoFold', 'disableAutoIndent', 'value', 'defaultValue', 'onSelect', 'onChange', 'level', 'autoIndent', 'indent', 'compact', 'size']);

            var classes = classNames(prefixCls, (_classNames = {}, _defineProperty(_classNames, prefixCls + '-compact', compact), _defineProperty(_classNames, prefixCls + '-size-' + size, size), _classNames), className);
            var menu = this.getMenuItems(children).map(function (item, key) {
                if (!React.isValidElement(item)) {
                    return null;
                }
                var newProps = {
                    level: level,
                    size: size,
                    key: item.props.value != null ? item.props.value : 'menu-' + key
                };
                if (compact) {
                    newProps.compact = true;
                }
                if (item.type.displayName === 'NeatUI.SubMenu' && compact) {
                    newProps.mode = 'popup';
                    newProps.trigger = 'click';
                }
                return cloneElement(item, newProps);
            });
            return React.createElement(
                'ul',
                Object.assign({ className: classes }, other, {
                    __source: {
                        fileName: _jsxFileName,
                        lineNumber: 197
                    },
                    __self: this
                }),
                menu
            );
        }
    }]);

    return Menu;
}(Component);

Menu.propTypes = {
    prefixCls: PropTypes.string,
    className: PropTypes.string,
    /** 是否自动折叠 */
    autoFold: PropTypes.bool,
    /** 是否可选中*/
    selectable: PropTypes.bool,
    /** 是否可以多选 */
    multiple: PropTypes.bool,
    /** 默认值 */
    defaultValue: PropTypes.oneOfType([PropTypes.string, PropTypes.number, PropTypes.bool, PropTypes.array]),
    /**
     * 当前值，适用于受控模式下使用
     */
    value: PropTypes.oneOfType([PropTypes.string, PropTypes.number, PropTypes.bool, PropTypes.array]),
    /** 是否自动缩进 */
    autoIndent: PropTypes.bool,
    /** 缩进长度（单位px） */
    indent: PropTypes.number,
    /** 值改变时回调 function(e, value) */
    onChange: PropTypes.func,
    /** 选择菜单中一项时回调 function(e, value) */
    onSelect: PropTypes.func,
    /** 当前菜单层数（计算缩进使用）*/
    level: PropTypes.number,
    /** 同原生role属性 */
    role: PropTypes.string,
    /** 子菜单模式（内联，弹出，多级） */
    mode: PropTypes.oneOf(['inline', 'popup', 'parallel']),
    /** 尺寸 */
    size: PropTypes.oneOf(['small', 'medium', 'large']),
    /** 是否为紧凑模式 */
    compact: PropTypes.bool
};
Menu.defaultProps = {
    defaultValue: [],
    prefixCls: 'ne-menu',
    selectable: false,
    autoFold: false,
    autoIndent: true,
    multiple: false,
    level: 1,
    indent: 12,
    role: 'menu',
    mode: 'inline',
    size: 'medium',
    compact: false
};
Menu.childContextTypes = {
    nuiMenuControl: PropTypes.object
};

var _initialiseProps = function _initialiseProps() {
    var _this2 = this;

    this.isControlled = false;

    this.onSelect = function (e, itemValue) {
        var _props3 = _this2.props,
            onSelect = _props3.onSelect,
            onChange = _props3.onChange,
            selectable = _props3.selectable,
            multiple = _props3.multiple;

        var value = selectable ? _this2.isControlled ? _this2.props.value : _this2.state.currentValue : [];
        value = Array.isArray(value) ? value : [value];
        onSelect && onSelect(e, itemValue);
        if (selectable) {
            if (multiple) {
                var itemIndex = value.indexOf(itemValue);
                value = [].concat(_toConsumableArray(value));
                if (itemIndex === -1) {
                    value.push(itemValue);
                } else {
                    value.splice(itemIndex, 1);
                }
                if (!_this2.isControlled) {
                    _this2.setState({
                        currentValue: value
                    });
                }
            } else if (!_this2.isControlled) {
                _this2.setState({
                    currentValue: itemValue
                });
            }
        }
        if (selectable && !value.includes(itemValue) || multiple) {
            onChange && onChange(e, multiple ? value : itemValue, itemValue);
        }
    };
};

export default Menu;