"use strict";

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard")["default"];

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = void 0;

var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));

var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));

var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));

var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));

var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));

var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));

var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));

var _react = _interopRequireWildcard(require("react"));

var _reactDom = require("react-dom");

var _domScrollIntoView = _interopRequireDefault(require("dom-scroll-into-view"));

var _raf = _interopRequireDefault(require("raf"));

var _toArray = _interopRequireDefault(require("../util/Children/toArray"));

var _menu = _interopRequireDefault(require("../menu"));

var _util = require("./util");

var _FilterInput = _interopRequireDefault(require("./FilterInput"));

var _LocaleReceiver = _interopRequireDefault(require("../../locale-provider/LocaleReceiver"));

var _default = _interopRequireDefault(require("../../locale-provider/default"));

var DropdownMenu = /*#__PURE__*/function (_Component) {
  (0, _inherits2["default"])(DropdownMenu, _Component);

  var _super = (0, _createSuper2["default"])(DropdownMenu);

  function DropdownMenu(_props) {
    var _this;

    (0, _classCallCheck2["default"])(this, DropdownMenu);
    _this = _super.call(this, _props);
    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "scrollActiveItemToView", function () {
      // scroll into view
      var itemComponent = (0, _reactDom.findDOMNode)(_this.firstActiveItem);

      if (itemComponent) {
        (0, _raf["default"])(function () {
          if (itemComponent) {
            var _assertThisInitialize = (0, _assertThisInitialized2["default"])(_this),
                props = _assertThisInitialize.props;

            var scrollIntoViewOpts = {
              onlyScrollIfNeeded: true
            };

            if ((!props.value || props.value.length === 0) && props.firstActiveValue) {
              scrollIntoViewOpts.alignWithTop = true;
            }

            (0, _domScrollIntoView["default"])(itemComponent, (0, _reactDom.findDOMNode)(_this.menuRef), scrollIntoViewOpts);
          }
        });
      }
    });
    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "renderCheckLabel", function (locale) {
      var _this$props = _this.props,
          prefixCls = _this$props.prefixCls,
          checkAll = _this$props.checkAll;
      return checkAll ? /*#__PURE__*/_react["default"].createElement("div", {
        className: "".concat(prefixCls, "-select-all-none")
      }, /*#__PURE__*/_react["default"].createElement("span", {
        name: "check-all",
        onClick: checkAll
      }, locale.selectAll), /*#__PURE__*/_react["default"].createElement("span", {
        name: "check-none",
        onClick: checkAll
      }, locale.selectNone)) : null;
    });
    _this.lastInputValue = _props.inputValue;
    _this.saveMenuRef = (0, _util.saveRef)((0, _assertThisInitialized2["default"])(_this), 'menuRef');
    return _this;
  }

  (0, _createClass2["default"])(DropdownMenu, [{
    key: "componentDidMount",
    value: function componentDidMount() {
      this.scrollActiveItemToView();
      this.lastVisible = this.props.visible;
    }
  }, {
    key: "shouldComponentUpdate",
    value: function shouldComponentUpdate(nextProps) {
      if (!nextProps.visible) {
        this.lastVisible = false;
      } // freeze when hide


      return nextProps.visible;
    }
  }, {
    key: "componentDidUpdate",
    value: function componentDidUpdate(prevProps) {
      var props = this.props;

      if (!prevProps.visible && props.visible) {
        this.scrollActiveItemToView();
      }

      this.lastVisible = props.visible;
      this.lastInputValue = props.inputValue;
    }
  }, {
    key: "renderMenu",
    value: function renderMenu() {
      var _this2 = this;

      var props = this.props;
      var menuItems = props.menuItems,
          value = props.value,
          defaultActiveFirstOption = props.defaultActiveFirstOption,
          prefixCls = props.prefixCls,
          multiple = props.multiple,
          onMenuSelect = props.onMenuSelect,
          inputValue = props.inputValue,
          firstActiveValue = props.firstActiveValue,
          backfillValue = props.backfillValue,
          dropdownMenuRippleDisabled = props.dropdownMenuRippleDisabled;

      if (menuItems && menuItems.length) {
        var menuProps = {};

        if (multiple) {
          menuProps.onDeselect = props.onMenuDeselect;
          menuProps.onSelect = onMenuSelect;
        } else {
          menuProps.onClick = onMenuSelect;
        }

        var selectedKeys = (0, _util.getSelectKeys)(menuItems, value);
        var activeKeyProps = {};
        var clonedMenuItems = menuItems;

        if (selectedKeys.length || firstActiveValue) {
          if (props.visible && !this.lastVisible) {
            activeKeyProps.activeKey = selectedKeys[0] || firstActiveValue;
          }

          var foundFirst = false; // set firstActiveItem via cloning menus
          // for scroll into view

          var clone = function clone(item) {
            if (!foundFirst && selectedKeys.indexOf(item.key) !== -1 || !foundFirst && !selectedKeys.length && firstActiveValue.indexOf(item.key) !== -1) {
              foundFirst = true;
              return /*#__PURE__*/(0, _react.cloneElement)(item, {
                ref: function ref(_ref) {
                  _this2.firstActiveItem = _ref;
                }
              });
            }

            return item;
          };

          clonedMenuItems = menuItems.map(function (item) {
            if (item.type.isMenuItemGroup) {
              var children = (0, _toArray["default"])(item.props.children).map(clone);
              return /*#__PURE__*/(0, _react.cloneElement)(item, {}, children);
            }

            return clone(item);
          });
        } else {
          this.firstActiveItem = null;
        } // clear activeKey when inputValue change


        var lastValue = value && value[value.length - 1];

        if (inputValue !== this.lastInputValue && (!lastValue || lastValue !== backfillValue)) {
          activeKeyProps.activeKey = '';
        }

        return /*#__PURE__*/_react["default"].createElement(_menu["default"], (0, _extends2["default"])({
          ref: this.saveMenuRef,
          style: this.props.dropdownMenuStyle,
          defaultActiveFirst: defaultActiveFirstOption,
          rippleDisabled: dropdownMenuRippleDisabled,
          role: "listbox"
        }, activeKeyProps, {
          multiple: multiple
        }, menuProps, {
          selectedKeys: selectedKeys,
          prefixCls: "".concat(prefixCls, "-menu")
        }), clonedMenuItems);
      }

      return null;
    }
  }, {
    key: "renderFilterInput",
    value: function renderFilterInput() {
      var _this$props2 = this.props,
          prefixCls = _this$props2.prefixCls,
          filter = _this$props2.filter,
          placeholder = _this$props2.placeholder,
          onFilterChange = _this$props2.onFilterChange,
          filterValue = _this$props2.filterValue,
          onKeyDown = _this$props2.onKeyDown;
      var props = {
        filterValue: filterValue,
        prefixCls: prefixCls,
        placeholder: placeholder,
        onChange: onFilterChange,
        onKeyDown: onKeyDown
      };
      return filter ? /*#__PURE__*/_react["default"].createElement(_FilterInput["default"], (0, _extends2["default"])({}, props, {
        ref: (0, _util.saveRef)(this, 'filterRef')
      })) : null;
    }
  }, {
    key: "getFooter",
    value: function getFooter() {
      var _this$props3 = this.props,
          prefixCls = _this$props3.prefixCls,
          footer = _this$props3.footer;
      return footer ? /*#__PURE__*/_react["default"].createElement("div", {
        className: "".concat(prefixCls, "-footer"),
        onMouseDown: _util.preventDefaultEvent
      }, footer) : null;
    }
  }, {
    key: "render",
    value: function render() {
      var renderMenu = this.renderMenu();
      var filterInput = this.renderFilterInput();
      var _this$props4 = this.props,
          multiple = _this$props4.multiple,
          menuItems = _this$props4.menuItems,
          checkAll = _this$props4.checkAll,
          onMouseDown = _this$props4.onMouseDown;
      var selectOpt = null;

      if (checkAll && multiple && menuItems.length && menuItems[0].key !== 'NOT_FOUND') {
        selectOpt = /*#__PURE__*/_react["default"].createElement(_LocaleReceiver["default"], {
          componentName: "Select",
          defaultLocale: _default["default"].Select
        }, this.renderCheckLabel);
      }

      var menu = renderMenu ? /*#__PURE__*/_react["default"].createElement("div", {
        style: {
          overflow: 'auto'
        },
        onFocus: this.props.onPopupFocus,
        onMouseDown: _util.preventDefaultEvent,
        onScroll: this.props.onPopupScroll
      }, renderMenu) : null;
      var footer = this.getFooter();
      return menu || filterInput || selectOpt || footer ? /*#__PURE__*/_react["default"].createElement("div", {
        onMouseDown: onMouseDown
      }, filterInput, selectOpt, menu, footer) : null;
    }
  }]);
  return DropdownMenu;
}(_react.Component);

exports["default"] = DropdownMenu;
(0, _defineProperty2["default"])(DropdownMenu, "defaultProps", {
  footer: null
});
DropdownMenu.displayName = 'DropdownMenu';
//# sourceMappingURL=DropdownMenu.js.map
