/*! bxs-vue-ui v3.3.0 */
'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

require('../utils/entry-virtual.js');
var normalizeComponent = require('../utils/normalize-component.js');
require('../utils/object-create.js');
require('../utils/html.js');
require('../utils/es.number.constructor.js');
require('../utils/sloppy-array-method.js');
require('../utils/index-of.js');
require('../utils/string-trim.js');
var slice = require('../utils/slice.js');
var _extends = require('../utils/extends.js');
var env = require('../utils/env.js');
var icon = require('../icon/index.js');
var trim = require('../utils/trim.js');
var emitter = require('../utils/emitter.js');
var includes = require('../utils/includes.js');

var _components;
var LABEL_THRESHOLD = 5,
    ICON_LINK_NAME = 'arrow-right';
var script = normalizeComponent.create({
  name: 'input',
  // 组件的根元素不继承特性，配合$attrs使用
  // 不会影响 style 和 class 的绑定
  inheritAttrs: false,
  mixins: [emitter.Emitter],
  props: {
    label: {
      type: String,
      default: ''
    },
    value: {
      type: [String, Number],
      default: ''
    },
    clearable: {
      type: Boolean,
      default: true
    },
    // 暂时无用
    error: {
      type: Boolean,
      default: false
    },
    errorMessage: {
      type: String,
      default: ''
    },
    // 是否显示右侧右箭头
    isLink: {
      type: Boolean,
      default: false
    },
    rightIcon: {
      type: String,
      default: ''
    },
    iconColor: {
      type: String,
      default: '#CCC'
    },
    iconSize: {
      type: String,
      default: '18px'
    },
    inputAlign: {
      type: String,
      default: '',
      validator: function validator(value) {
        var _context;

        return includes._includesInstanceProperty(_context = ['', 'bx-center', 'bx-right', 'center', 'right']).call(_context, value);
      }
    },
    autosize: {
      type: [Boolean, Object],
      default: false
    },
    // 是否显示剩余字数统计
    showWordLimit: {
      type: Boolean,
      default: false
    },
    // 开始进行剩余字数统计阈值
    wordLimitThreshold: {
      type: [Number, String],
      default: 50
    }
  },
  data: function data() {
    return {
      isFocus: false
    };
  },
  mounted: function mounted() {
    this.resizeArea();
  },
  watch: {
    currentValue: function currentValue() {
      this.$nextTick(this.resizeArea);
    }
  },
  computed: {
    currentValue: {
      get: function get() {
        return this.value;
      },
      set: function set(value) {
        this.$emit('input', value);
      }
    },
    inputAlignClass: function inputAlignClass() {
      var _context2, _context3;

      var alignClass = ''; // bx-center 和 bx-right 是为了兼容旧版本

      if (includes._includesInstanceProperty(_context2 = ['bx-center', 'center']).call(_context2, this.inputAlign)) {
        alignClass = 'bx-input-center';
      }

      if (includes._includesInstanceProperty(_context3 = ['bx-right', 'right']).call(_context3, this.inputAlign)) {
        alignClass = 'bx-input-right';
      }

      return alignClass;
    },
    iconName: function iconName() {
      return this.isLink ? ICON_LINK_NAME : this.rightIcon;
    },
    // label 文案是否超过阈值LABEL_THRESHOLD=5
    isLabelMoreThanThreshold: function isLabelMoreThanThreshold() {
      return this.label.length >= LABEL_THRESHOLD;
    },
    // 是否显示剩余字数统计
    showTextareaWordLimit: function showTextareaWordLimit() {
      var maxLength = this.$attrs.maxlength;
      return this.showWordLimit && maxLength > 0 && this.remainingWords <= this.wordLimitThreshold;
    },
    // 剩余字数
    remainingWords: function remainingWords() {
      var maxLength = this.$attrs.maxlength;
      var currentLength = this.currentValue.length;

      if (currentLength >= maxLength) {
        currentLength = maxLength;
      }

      return maxLength - currentLength;
    },
    // 属性透传
    inputAttrs: function inputAttrs() {
      return _extends._extends({}, this.$attrs, {
        value: this.currentValue
      });
    },
    // 事件透传
    inputListeners: function inputListeners() {
      var vm = this;
      return _extends._extends({}, this.$listeners, {
        // 与 属性value 合并成v-model语法
        input: function input(event) {
          var value = event.target.value;
          var _vm$$attrs = vm.$attrs,
              type = _vm$$attrs.type,
              maxlength = _vm$$attrs.maxlength; // 解决number类型maxlength不生效问题

          if (type === 'number' && maxlength) {
            value = slice._sliceInstanceProperty(value).call(value, 0, maxlength);
          }

          vm.$emit('input', trim._trimInstanceProperty(value).call(value));
        },
        focus: this.onFocus,
        blur: this.onBlur,
        change: this.onChange
      });
    },
    // 是否显示清除图标
    isShowClearIcon: function isShowClearIcon() {
      return this.currentValue && this.isFocus && this.clearable;
    },
    hasExtraSlot: function hasExtraSlot() {
      return this.$slots.extra;
    }
  },
  methods: {
    getRootScrollTop: function getRootScrollTop() {
      return window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0;
    },
    resizeArea: function resizeArea() {
      var input = this.$refs.input;
      var autosize = this.autosize,
          $attrs = this.$attrs;

      if (!($attrs.type === 'textarea' && autosize)) {
        return;
      }

      input.style.height = 'auto';
      var height = input.scrollHeight;

      if (!(typeof autosize === 'object')) {
        if (height) {
          input.style.height = height + "px";
        }

        return;
      }

      var minHeight = autosize.minHeight,
          maxHeight = autosize.maxHeight;

      if (maxHeight) {
        height = Math.min(height, maxHeight);
      }

      if (minHeight) {
        height = Math.max(height, minHeight);
      }

      input.style.height = height + "px";
    },
    onFocus: function onFocus(event) {
      this.isFocus = true;
      this.$emit('focus', event);
      this.dispatch('bxs-form-item', 'form.item.reset'); // ios手机，input元素加readonly属性
      // 点击后会有光标出现在框中，且会有不完整输入键盘出现

      var input = this.$refs.input;

      if (this.isReadonly(this.$attrs) && input) {
        input.blur();
      }
    },
    onBlur: function onBlur(event) {
      this.isFocus = false;
      this.$emit('blur', event);

      if (!this.isReadonly(this.$attrs)) {
        this.dispatch('bxs-form-item', 'form.item.validate');
      }

      if (env.Env.isIos) {
        window.scrollTo(0, this.getRootScrollTop());
      }
    },
    onChange: function onChange(event) {
      this.$emit('change', event);
      this.dispatch('bxs-form-item', 'form.item.validate');
    },
    clearInput: function clearInput() {
      this.currentValue = '';
      this.$emit('clear');
    },
    clickIcon: function clickIcon() {
      this.$emit('click-icon');
    },
    isReadonly: function isReadonly(attrs) {
      if ({}.hasOwnProperty.call(attrs, 'readonly') && attrs.readonly !== false && attrs.readonly !== null && attrs.readonly !== undefined) {
        return true;
      }

      return false;
    }
  },
  components: (_components = {}, _components[icon.default.name] = icon.default, _components)
});

/* script */
var __vue_script__ = script;
/* template */

var __vue_render__ = function __vue_render__() {
  var _vm = this;

  var _h = _vm.$createElement;

  var _c = _vm._self._c || _h;

  return _c('div', {
    staticClass: "bx-input",
    class: {
      'bx-input--textarea': _vm.inputAttrs.type === 'textarea',
      'bx-input--center': _vm.$slots.button,
      'bx-input--link': _vm.isLink
    }
  }, [_c('div', {
    staticClass: "bx-input-inner"
  }, [_vm.label ? _c('div', {
    staticClass: "bx-input-label",
    class: _vm.isLabelMoreThanThreshold && 'bx-input-label--lg'
  }, [_c('span', [_vm._v(_vm._s(_vm.label))])]) : _vm._e(), _c('div', {
    staticClass: "bx-input-value"
  }, [_c('div', {
    staticClass: "bx-input-body"
  }, [_vm.inputAttrs.type === 'textarea' ? _c('div', {
    staticClass: "bx-input-textarea"
  }, [_c('textarea', _vm._g(_vm._b({
    ref: "input",
    staticClass: "bx-input-control",
    class: [_vm.inputAlignClass],
    attrs: {
      "rows": "1"
    }
  }, 'textarea', _vm.inputAttrs, false), _vm.inputListeners)), _vm.showTextareaWordLimit ? _c('div', {
    staticClass: "bx-input-textarea--limit"
  }, [_vm._v("\n            " + _vm._s(_vm.remainingWords) + "\n          ")]) : _vm._e()]) : _c('input', _vm._g(_vm._b({
    ref: "input",
    staticClass: "bx-input-control",
    class: [_vm.inputAlignClass]
  }, 'input', _vm.inputAttrs, false), _vm.inputListeners)), _vm.isShowClearIcon ? _c('div', {
    staticClass: "bx-input-icon",
    class: _vm.isShowClearIcon && _vm.iconName && 'bx-input-icon--withPadding',
    on: {
      "touchstart": function touchstart($event) {
        $event.preventDefault();
        return _vm.clearInput($event);
      }
    }
  }, [_c('bxs-icon', {
    staticClass: "bx-input-icon--clearable",
    attrs: {
      "name": "close-solid"
    }
  })], 1) : _vm._e(), _vm.iconName ? _c('div', {
    staticClass: "bx-input-icon",
    class: _vm.isShowClearIcon && 'bx-input-icon--withoutPadding',
    on: {
      "touchstart": function touchstart($event) {
        $event.preventDefault();
        return _vm.clickIcon($event);
      }
    }
  }, [_c('bxs-icon', {
    attrs: {
      "name": _vm.iconName,
      "color": _vm.iconColor,
      "size": _vm.iconSize
    }
  })], 1) : _vm._e(), _vm._t("button")], 2), _vm.hasExtraSlot ? _c('div', {
    staticClass: "bx-input-extra"
  }, [_vm._t("extra")], 2) : _vm._e()])]), _vm.errorMessage ? _c('div', {
    staticClass: "bx-input-error"
  }, [_vm._v("\n    " + _vm._s(_vm.errorMessage) + "\n  ")]) : _vm._e()]);
};

var __vue_staticRenderFns__ = [];
/* style */

var __vue_inject_styles__ = undefined;
/* scoped */

var __vue_scope_id__ = undefined;
/* module identifier */

var __vue_module_identifier__ = undefined;
/* functional template */

var __vue_is_functional_template__ = false;
/* style inject */

/* style inject SSR */

var Input = normalizeComponent.__vue_normalize__({
  render: __vue_render__,
  staticRenderFns: __vue_staticRenderFns__
}, __vue_inject_styles__, __vue_script__, __vue_scope_id__, __vue_is_functional_template__, __vue_module_identifier__, undefined, undefined);

exports.default = Input;
