"use strict";

function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }

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

var _vue = _interopRequireWildcard(require("vue"));

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

var _vueTypes = _interopRequireDefault(require("../_util/vue-types"));

var _vcMenu = _interopRequireDefault(require("../vc-menu"));

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

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

var _vnode = require("../_util/vnode");

var _BaseMixin = _interopRequireDefault(require("../_util/BaseMixin"));

var _propsUtil = require("../_util/props-util");

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }

function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }

function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

var _default2 = {
  name: 'DropdownMenu',
  mixins: [_BaseMixin.default],
  inheritAttrs: false,
  props: {
    ariaId: _vueTypes.default.string,
    defaultActiveFirstOption: _vueTypes.default.bool,
    value: _vueTypes.default.any,
    dropdownMenuStyle: _vueTypes.default.object,
    multiple: _vueTypes.default.bool,
    // onPopupFocus: PropTypes.func,
    // onPopupScroll: PropTypes.func,
    // onMenuDeSelect: PropTypes.func,
    // onMenuSelect: PropTypes.func,
    prefixCls: _vueTypes.default.string,
    menuItems: _vueTypes.default.any,
    inputValue: _vueTypes.default.string,
    visible: _vueTypes.default.bool,
    backfillValue: _vueTypes.default.any,
    firstActiveValue: _vueTypes.default.string,
    menuItemSelectedIcon: _vueTypes.default.any
  },
  watch: {
    visible: function visible(val) {
      var _this = this;

      if (!val) {
        this.lastVisible = val;
      } else {
        this.$nextTick(function () {
          _this.scrollActiveItemToView();
        });
      }
    }
  },
  created: function created() {
    this.rafInstance = null;
    this.saveMenuRef = (0, _util.saveRef)(this, 'menuRef');
    this.lastInputValue = this.$props.inputValue;
    this.lastVisible = false;
  },
  mounted: function mounted() {
    var _this2 = this;

    this.$nextTick(function () {
      _this2.scrollActiveItemToView();
    });
    this.lastVisible = this.$props.visible;
  },
  updated: function updated() {
    var props = this.$props; // if (!this.prevVisible && props.visible) {
    //   this.$nextTick(() => {
    //     this.scrollActiveItemToView();
    //   });
    // }

    this.lastVisible = props.visible;
    this.lastInputValue = props.inputValue;
    this.prevVisible = this.visible;
  },
  beforeUnmount: function beforeUnmount() {
    if (this.rafInstance) {
      _raf.default.cancel(this.rafInstance);
    }
  },
  methods: {
    scrollActiveItemToView: function scrollActiveItemToView() {
      var _this3 = this;

      // scroll into view
      var itemComponent = this.firstActiveItem && (0, _propsUtil.findDOMNode)(this.firstActiveItem);
      var props = this.$props;
      var value = props.value,
          visible = props.visible,
          firstActiveValue = props.firstActiveValue;

      if (!itemComponent || !visible) {
        return;
      }

      var scrollIntoViewOpts = {
        onlyScrollIfNeeded: true
      };

      if ((!value || value.length === 0) && firstActiveValue) {
        scrollIntoViewOpts.alignWithTop = true;
      } // Delay to scroll since current frame item position is not ready when pre view is by filter
      // https://github.com/ant-design/ant-design/issues/11268#issuecomment-406634462


      this.rafInstance = (0, _raf.default)(function () {
        (0, _domScrollIntoView.default)(itemComponent, (0, _propsUtil.findDOMNode)(_this3.menuRef), scrollIntoViewOpts);
      });
    },
    renderMenu: function renderMenu() {
      var _this4 = this;

      var props = _objectSpread(_objectSpread({}, this.$props), this.$attrs);

      var menuItems = props.menuItems,
          menuItemSelectedIcon = props.menuItemSelectedIcon,
          defaultActiveFirstOption = props.defaultActiveFirstOption,
          prefixCls = props.prefixCls,
          multiple = props.multiple,
          onMenuSelect = props.onMenuSelect,
          inputValue = props.inputValue,
          backfillValue = props.backfillValue,
          onMenuDeselect = props.onMenuDeselect,
          visible = props.visible;
      var firstActiveValue = this.firstActiveValue;

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

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

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

        if (selectedKeys.length || firstActiveValue) {
          if (props.visible && !this.lastVisible) {
            activeKeyProps.activeKey = selectedKeys[0] || firstActiveValue;
          } else if (!visible) {
            // Do not trigger auto active since we already have selectedKeys
            if (selectedKeys[0]) {
              defaultActiveFirst = false;
            }

            activeKeyProps.activeKey = undefined;
          }

          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 (0, _vnode.cloneElement)(item, {
                ref: function ref(_ref) {
                  _this4.firstActiveItem = _ref;
                }
              });
            }

            return item;
          };

          clonedMenuItems = menuItems.map(function (item) {
            if (item.type.isMenuItemGroup) {
              var children = (0, _propsUtil.getSlot)(item).map(clone);
              var newItem = (0, _vnode.cloneElement)(item);
              newItem.children = _objectSpread(_objectSpread({}, item.children), {}, {
                default: function _default() {
                  return children;
                }
              });
              return newItem;
            }

            return clone(item);
          });
        } else {
          // Clear firstActiveItem when dropdown menu items was empty
          // Avoid `Unable to find node on an unmounted component`
          // https://github.com/ant-design/ant-design/issues/10774
          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 _vue.createVNode(_vcMenu.default, _vue.mergeProps(activeKeyProps, menuProps, {
          "ref": this.saveMenuRef,
          "style": this.dropdownMenuStyle,
          "defaultActiveFirst": defaultActiveFirst,
          "role": "listbox",
          "itemIcon": multiple ? menuItemSelectedIcon : null,
          "multiple": multiple,
          "selectedKeys": selectedKeys,
          "prefixCls": "".concat(prefixCls, "-menu"),
          "children": clonedMenuItems
        }), null);
      }

      return null;
    }
  },
  render: function render() {
    var renderMenu = this.renderMenu();
    var _this$$attrs = this.$attrs,
        onPopupFocus = _this$$attrs.onPopupFocus,
        onPopupScroll = _this$$attrs.onPopupScroll;
    return renderMenu ? _vue.createVNode("div", {
      "style": {
        overflow: 'auto',
        transform: 'translateZ(0)'
      },
      "id": this.$props.ariaId,
      "tabindex": "-1",
      "onFocus": onPopupFocus,
      "onMousedown": _util.preventDefaultEvent,
      "onScroll": onPopupScroll
    }, [renderMenu]) : null;
  }
};
exports.default = _default2;