import _Object$getOwnPropertyDescriptor from "@babel/runtime-corejs2/core-js/object/get-own-property-descriptor";
import "core-js/modules/es6.number.constructor";
import _Array$isArray from "@babel/runtime-corejs2/core-js/array/is-array";
import _inheritsLoose from "../../inheritsLoose";
import _defineProperty from "@babel/runtime-corejs2/helpers/defineProperty";
import _applyDecoratedDescriptor from "@babel/runtime-corejs2/helpers/applyDecoratedDescriptor";

var _dec, _class, _init, _class2, _temp;

import Intact from 'intact-angular';
import template from './index.vdt';
import '../../styles/kpc.css';
import './index.css';
import Option from './option';
import Group from './group';
import { selectInput, _$, isStringOrNumber, toggleArray } from '../utils';
var Select = (_dec = Intact.template(), (_class = (_temp = _class2 =
/*#__PURE__*/
function (_Intact) {
  _inheritsLoose(Select, _Intact);

  function Select() {
    return _Intact.apply(this, arguments) || this;
  }

  var _proto = Select.prototype;

  _proto.defaults = function defaults() {
    return {
      data: [],
      value: '',
      multiple: false,
      // 是否支持多选
      disabled: false,
      clearable: false,
      // 是否可清空 
      filterable: false,
      // 搜索筛选
      filter: function filter(keywords, props) {
        var valid = false;
        var tmp;

        if (keywords == null || props.label && ~props.label.toLowerCase().indexOf(tmp = keywords.toLowerCase()) || isStringOrNumber(props.value) && ~String(props.value).toLowerCase().indexOf(tmp)) {
          valid = true;
        }

        return valid;
      },
      keywords: undefined,
      placeholder: undefined,
      size: 'default',
      fluid: false,
      width: undefined,
      allowUnmatch: false,
      card: false,
      // 卡片式分组
      container: undefined,
      inline: false,
      loading: false,
      hideIcon: false,
      _show: false,
      _activeLabel: undefined
    };
  };

  _proto._init = function _init() {
    var _this = this;

    this.on('$changed:value', function () {
      if (_this.get('multiple') && _this.get('_show')) {
        _this.refs.menu.position();
      }
    });
  };

  _proto._onClear = function _onClear(e) {
    e.stopPropagation();
    this.set('value', '');
  };

  _proto._onSelect = function _onSelect(value) {
    if (!this.get('multiple')) {
      this.set('value', value, {
        async: true
      });
    } else {
      var values = this.get('value');
      values = toggleArray(values, value);
      this.set('value', values, {
        async: true
      });

      this._focusInput();
    }

    this._resetSearch();
  };

  _proto._onSearch = function _onSearch(e) {
    this.set('keywords', e.target.value.trim()); // always show menu on searching

    this.refs.menu.show();
    this.refs.menu.focusItemByIndex(0); // the position may be flip, and the select input height my change height too,
    // so we should reset the position

    this.refs.menu.position();
  };

  _proto._resetSearch = function _resetSearch() {
    this.set('keywords', undefined, {
      async: true
    });
  };

  _proto._onChangeShow = function _onChangeShow(c, value) {
    this.set('_show', value); // reset the _activeLabel if show

    this._setActiveLabelSilent(undefined);
  }
  /**
   * @brief let the blur method be called after select
   * if we have selected the option, then the keywords have been set to undefined
   * in this case, we do nothing, otherwise we reset it
   */
  ;

  _proto._onBlur = function _onBlur() {
    var _this2 = this;

    var _this$get = this.get(),
        keywords = _this$get.keywords,
        allowUnmatch = _this$get.allowUnmatch;

    if (allowUnmatch && keywords != null) {
      this.set({
        value: keywords
      });
    }

    this.timer = setTimeout(function () {
      if (_this2.get('keywords') != null) {
        _this2._resetSearch();
      }
    }, 200);
  };

  _proto._selectInput = function _selectInput(e) {
    selectInput(e.target);
  };

  _proto._onFocus = function _onFocus(e) {
    clearTimeout(this.timer);
  };

  _proto._onFocusout = function _onFocusout() {
    this.refs.dropdown.hide();
  };

  _proto._delete = function _delete(value, e) {
    e.stopPropagation();
    var values = this.get('value').slice(0);
    var index = values.indexOf(value);
    values.splice(index, 1);
    this.set('value', values);

    this._focusInput();
  };

  _proto._focusInput = function _focusInput() {
    if (this.get('filterable')) {
      this.refs.input.focus();
    }
  };

  _proto._position = function _position() {
    var menuElement = this.refs.menu.vdt.vNode.children.element;
    var width = this.element.offsetWidth;
    var menuWidth = menuElement.offsetWidth;

    if (width > menuWidth) {
      menuElement.style.width = width + "px";
    }
  };

  _proto._onKeypress = function _onKeypress(e) {
    this.trigger('keypress', e);

    if (e.keyCode === 13) {
      this.refs.wrapper.click();
    }
  };

  _proto._onKeydown = function _onKeydown(e) {
    this.trigger('keydown', e);

    if (e.keyCode === 9) {
      // tab
      this.refs.dropdown.hide();
    }
  };

  _proto._clearValue = function _clearValue() {
    this.set('value', '', {
      update: false
    });
  };

  _proto._setActiveLabelSilent = function _setActiveLabelSilent(label) {
    this.set('_activeLabel', label, {
      silent: true
    });
  };

  _proto.handleProps = function handleProps(props, labelObj) {
    var _this$get2 = this.get(),
        multiple = _this$get2.multiple,
        value = _this$get2.value,
        filterable = _this$get2.filterable,
        keywords = _this$get2.keywords,
        filter = _this$get2.filter;

    var active = false;
    var valid = false;

    if (!multiple) {
      if (props.value === value) {
        // set label
        labelObj.label = props.label;
        active = true;
      } else {
        active = false;
      }
    } else if (_Array$isArray(value)) {
      var index = value.indexOf(props.value);

      if (~index) {
        // keep order consistent
        labelObj.labels[index] = props.label;
        active = true;
      } else {
        active = false;
      }
    }

    if (!filterable || filter.call(this, keywords, props)) {
      valid = true;
    }

    return {
      active: active,
      valid: valid
    };
  };

  return Select;
}(Intact), _defineProperty(_class2, "template", template), _defineProperty(_class2, "propTypes", {
  data: Array,
  multiple: Boolean,
  disabled: Boolean,
  clearable: Boolean,
  filterable: Boolean,
  filter: Function,
  keywords: String,
  placeholder: String,
  size: ['large', 'default', 'small', 'mini'],
  fluid: Boolean,
  width: [Number, String],
  allowUnmatch: Boolean,
  card: Boolean,
  container: [Function, String],
  inline: Boolean,
  loading: Boolean,
  hideIcon: Boolean
}), _defineProperty(_class2, "events", {
  keypress: true,
  keydown: true
}), _temp), (_applyDecoratedDescriptor(_class, "template", [_dec], (_init = _Object$getOwnPropertyDescriptor(_class, "template"), _init = _init ? _init.value : undefined, {
  enumerable: true,
  configurable: true,
  writable: true,
  initializer: function initializer() {
    return _init;
  }
}), _class)), _class));
export { Select as default };
export { Select, Option, Group as OptionGroup };