"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _comp = require("../../ui/src/comp");
var _xeUtils = _interopRequireDefault(require("xe-utils"));
var _ui = require("../../ui");
var _utils = require("../../ui/src/utils");
var _vn = require("../../ui/src/vn");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
var _default2 = exports.default = /* define-vxe-component start */(0, _comp.defineVxeComponent)({
  name: 'VxePasswordInput',
  mixins: [_ui.globalMixins.sizeMixin],
  model: {
    prop: 'value',
    event: 'modelValue'
  },
  props: {
    value: String,
    immediate: {
      type: Boolean,
      default: true
    },
    name: String,
    clearable: {
      type: Boolean,
      default: function _default() {
        return (0, _ui.getConfig)().passwordInput.clearable;
      }
    },
    readonly: Boolean,
    disabled: Boolean,
    maxLength: [String, Number],
    placeholder: String,
    autoComplete: {
      type: String,
      default: 'off'
    },
    className: String,
    size: {
      type: String,
      default: function _default() {
        return (0, _ui.getConfig)().passwordInput.size || (0, _ui.getConfig)().size;
      }
    },
    prefixIcon: String,
    suffixIcon: String,
    controls: {
      type: Boolean,
      default: function _default() {
        return (0, _ui.getConfig)().passwordInput.controls;
      }
    },
    // 已废弃
    autocomplete: String
  },
  inject: {
    $xeForm: {
      default: null
    },
    formItemInfo: {
      from: 'xeFormItemInfo',
      default: null
    }
  },
  data: function data() {
    var xID = _xeUtils.default.uniqueId();
    var reactData = {
      showPwd: false,
      isActivated: false,
      inputValue: ''
    };
    return {
      xID: xID,
      reactData: reactData
    };
  },
  computed: Object.assign(Object.assign({}, {}), {
    computeIsClearable: function computeIsClearable() {
      var $xePasswordInput = this;
      var props = $xePasswordInput;
      return props.clearable;
    },
    computeInpReadonly: function computeInpReadonly() {
      var $xePasswordInput = this;
      var props = $xePasswordInput;
      var readonly = props.readonly;
      return readonly;
    },
    computeInpPlaceholder: function computeInpPlaceholder() {
      var $xePasswordInput = this;
      var props = $xePasswordInput;
      var placeholder = props.placeholder;
      if (placeholder) {
        return (0, _utils.getFuncText)(placeholder);
      }
      var globalPlaceholder = (0, _ui.getConfig)().passwordInput.placeholder;
      if (globalPlaceholder) {
        return (0, _utils.getFuncText)(globalPlaceholder);
      }
      return (0, _ui.getI18n)('vxe.base.pleaseInput');
    },
    computeInputType: function computeInputType() {
      var $xePasswordInput = this;
      var reactData = $xePasswordInput.reactData;
      var showPwd = reactData.showPwd;
      if (showPwd) {
        return 'text';
      }
      return 'password';
    },
    computeInpImmediate: function computeInpImmediate() {
      var $xePasswordInput = this;
      var props = $xePasswordInput;
      var immediate = props.immediate;
      return immediate;
    }
  }),
  methods: {
    //
    // Method
    //
    dispatchEvent: function dispatchEvent(type, params, evnt) {
      var $xePasswordInput = this;
      $xePasswordInput.$emit(type, (0, _ui.createEvent)(evnt, {
        $passwordInput: $xePasswordInput
      }, params));
    },
    emitModel: function emitModel(value) {
      var $xePasswordInput = this;
      var _events = $xePasswordInput._events;
      if (_events && _events.modelValue) {
        $xePasswordInput.$emit('modelValue', value);
      } else {
        $xePasswordInput.$emit('model-value', value);
      }
    },
    focus: function focus() {
      var $xePasswordInput = this;
      var reactData = $xePasswordInput.reactData;
      var inputElem = $xePasswordInput.$refs.refInputTarget;
      reactData.isActivated = true;
      inputElem.focus();
      return $xePasswordInput.$nextTick();
    },
    blur: function blur() {
      var $xePasswordInput = this;
      var reactData = $xePasswordInput.reactData;
      var inputElem = $xePasswordInput.$refs.refInputTarget;
      inputElem.blur();
      reactData.isActivated = false;
      return $xePasswordInput.$nextTick();
    },
    select: function select() {
      var $xePasswordInput = this;
      var reactData = $xePasswordInput.reactData;
      var inputElem = $xePasswordInput.$refs.refInputTarget;
      inputElem.select();
      reactData.isActivated = false;
      return $xePasswordInput.$nextTick();
    },
    triggerEvent: function triggerEvent(evnt) {
      var $xePasswordInput = this;
      var reactData = $xePasswordInput.reactData;
      var inputValue = reactData.inputValue;
      $xePasswordInput.dispatchEvent(evnt.type, {
        value: inputValue
      }, evnt);
    },
    emitInputEvent: function emitInputEvent(value, evnt) {
      var $xePasswordInput = this;
      var reactData = $xePasswordInput.reactData;
      var inpImmediate = $xePasswordInput.computeInpImmediate;
      reactData.inputValue = value;
      if (inpImmediate) {
        $xePasswordInput.handleChange(value, evnt);
      } else {
        $xePasswordInput.dispatchEvent('input', {
          value: value
        }, evnt);
      }
    },
    inputEvent: function inputEvent(evnt) {
      var $xePasswordInput = this;
      var inputElem = evnt.target;
      var value = inputElem.value;
      $xePasswordInput.emitInputEvent(value, evnt);
    },
    handleChange: function handleChange(value, evnt) {
      var $xePasswordInput = this;
      var props = $xePasswordInput;
      var reactData = $xePasswordInput.reactData;
      var $xeForm = $xePasswordInput.$xeForm;
      var formItemInfo = $xePasswordInput.formItemInfo;
      reactData.inputValue = value;
      $xePasswordInput.emitModel(value);
      $xePasswordInput.dispatchEvent('input', {
        value: value
      }, evnt);
      if (_xeUtils.default.toValueString(props.value) !== value) {
        $xePasswordInput.dispatchEvent('change', {
          value: value
        }, evnt);
        // 自动更新校验状态
        if ($xeForm && formItemInfo) {
          $xeForm.triggerItemEvent(evnt, formItemInfo.itemConfig.field, value);
        }
      }
    },
    changeEvent: function changeEvent(evnt) {
      var $xePasswordInput = this;
      var reactData = $xePasswordInput.reactData;
      var $xeForm = $xePasswordInput.$xeForm;
      var formItemInfo = $xePasswordInput.formItemInfo;
      $xePasswordInput.triggerEvent(evnt);
      $xePasswordInput.dispatchEvent('lazy-change', {
        value: reactData.inputValue
      }, evnt);
      // 自动更新校验状态
      if ($xeForm && formItemInfo) {
        $xeForm.triggerItemEvent(evnt, formItemInfo.itemConfig.field, reactData.inputValue);
      }
    },
    focusEvent: function focusEvent(evnt) {
      var $xePasswordInput = this;
      var reactData = $xePasswordInput.reactData;
      reactData.isActivated = true;
      $xePasswordInput.triggerEvent(evnt);
    },
    blurEvent: function blurEvent(evnt) {
      var $xePasswordInput = this;
      var reactData = $xePasswordInput.reactData;
      var $xeForm = $xePasswordInput.$xeForm;
      var formItemInfo = $xePasswordInput.formItemInfo;
      var inputValue = reactData.inputValue;
      var value = inputValue;
      reactData.isActivated = false;
      $xePasswordInput.dispatchEvent('blur', {
        value: value
      }, evnt);
      // 自动更新校验状态
      if ($xeForm && formItemInfo) {
        $xeForm.triggerItemEvent(evnt, formItemInfo.itemConfig.field, value);
      }
    },
    passwordToggleEvent: function passwordToggleEvent(evnt) {
      var $xePasswordInput = this;
      var props = $xePasswordInput;
      var reactData = $xePasswordInput.reactData;
      var readonly = props.readonly,
        disabled = props.disabled;
      var showPwd = reactData.showPwd;
      if (!disabled && !readonly) {
        reactData.showPwd = !showPwd;
      }
      $xePasswordInput.dispatchEvent('toggle-visible', {
        visible: reactData.showPwd
      }, evnt);
    },
    clickEvent: function clickEvent(evnt) {
      var $xePasswordInput = this;
      $xePasswordInput.triggerEvent(evnt);
    },
    clearValueEvent: function clearValueEvent(evnt, value) {
      var $xePasswordInput = this;
      $xePasswordInput.focus();
      $xePasswordInput.handleChange('', evnt);
      $xePasswordInput.dispatchEvent('clear', {
        value: value
      }, evnt);
      $xePasswordInput.dispatchEvent('lazy-change', {
        value: value
      }, evnt);
    },
    clickSuffixEvent: function clickSuffixEvent(evnt) {
      var $xePasswordInput = this;
      var props = $xePasswordInput;
      var reactData = $xePasswordInput.reactData;
      var disabled = props.disabled;
      if (!disabled) {
        var inputValue = reactData.inputValue;
        $xePasswordInput.dispatchEvent('suffix-click', {
          value: inputValue
        }, evnt);
      }
    },
    clickPrefixEvent: function clickPrefixEvent(evnt) {
      var $xePasswordInput = this;
      var props = $xePasswordInput;
      var reactData = $xePasswordInput.reactData;
      var disabled = props.disabled;
      if (!disabled) {
        var inputValue = reactData.inputValue;
        $xePasswordInput.dispatchEvent('prefix-click', {
          value: inputValue
        }, evnt);
      }
    },
    //
    // Render
    //
    renderPasswordIcon: function renderPasswordIcon(h) {
      var $xePasswordInput = this;
      var reactData = $xePasswordInput.reactData;
      var showPwd = reactData.showPwd;
      return h('div', {
        class: 'vxe-password-input--control-icon',
        on: {
          click: $xePasswordInput.passwordToggleEvent
        }
      }, [h('i', {
        class: ['vxe-password-input--password-icon', showPwd ? (0, _ui.getIcon)().PASSWORD_INPUT_SHOW_PWD : (0, _ui.getIcon)().PASSWORD_INPUT_HIDE_PWD]
      })]);
    },
    renderPrefixIcon: function renderPrefixIcon(h) {
      var $xePasswordInput = this;
      var props = $xePasswordInput;
      var slots = $xePasswordInput.$scopedSlots;
      var prefixIcon = props.prefixIcon;
      var prefixSlot = slots.prefix;
      return prefixSlot || prefixIcon ? h('div', {
        class: 'vxe-password-input--prefix',
        on: {
          click: $xePasswordInput.clickPrefixEvent
        }
      }, [h('div', {
        class: 'vxe-password-input--prefix-icon'
      }, prefixSlot ? (0, _vn.getSlotVNs)(prefixSlot({})) : [h('i', {
        class: prefixIcon
      })])]) : null;
    },
    renderSuffixIcon: function renderSuffixIcon(h) {
      var $xePasswordInput = this;
      var props = $xePasswordInput;
      var slots = $xePasswordInput.$scopedSlots;
      var reactData = $xePasswordInput.reactData;
      var disabled = props.disabled,
        suffixIcon = props.suffixIcon,
        controls = props.controls;
      var inputValue = reactData.inputValue;
      var suffixSlot = slots.suffix;
      var isClearable = $xePasswordInput.computeIsClearable;
      return isClearable || controls || suffixSlot || suffixIcon ? h('div', {
        class: ['vxe-password-input--suffix', {
          'is--clear': isClearable && !disabled && !(inputValue === '' || _xeUtils.default.eqNull(inputValue))
        }]
      }, [isClearable ? h('div', {
        class: 'vxe-password-input--clear-icon',
        on: {
          click: $xePasswordInput.clearValueEvent
        }
      }, [h('i', {
        class: (0, _ui.getIcon)().INPUT_CLEAR
      })]) : (0, _ui.renderEmptyElement)($xePasswordInput), controls ? $xePasswordInput.renderPasswordIcon(h) : (0, _ui.renderEmptyElement)($xePasswordInput), suffixSlot || suffixIcon ? h('div', {
        class: 'vxe-password-input--suffix-icon',
        on: {
          click: $xePasswordInput.clickSuffixEvent
        }
      }, suffixSlot ? (0, _vn.getSlotVNs)(suffixSlot({})) : [h('i', {
        class: suffixIcon
      })]) : (0, _ui.renderEmptyElement)($xePasswordInput)]) : null;
    },
    renderVN: function renderVN(h) {
      var $xePasswordInput = this;
      var props = $xePasswordInput;
      var reactData = $xePasswordInput.reactData;
      var className = props.className,
        name = props.name,
        disabled = props.disabled,
        readonly = props.readonly,
        autocomplete = props.autocomplete,
        autoComplete = props.autoComplete,
        maxLength = props.maxLength;
      var inputValue = reactData.inputValue,
        isActivated = reactData.isActivated;
      var vSize = $xePasswordInput.computeSize;
      var inpReadonly = $xePasswordInput.computeInpReadonly;
      var inputType = $xePasswordInput.computeInputType;
      var inpPlaceholder = $xePasswordInput.computeInpPlaceholder;
      var isClearable = $xePasswordInput.computeIsClearable;
      var prefix = $xePasswordInput.renderPrefixIcon(h);
      var suffix = $xePasswordInput.renderSuffixIcon(h);
      return h('div', {
        ref: 'refElem',
        class: ['vxe-password-input', className, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "size--".concat(vSize), vSize), 'is--prefix', !!prefix), 'is--suffix', !!suffix), 'is--readonly', readonly), 'is--disabled', disabled), 'is--active', isActivated), 'show--clear', isClearable && !disabled && !(inputValue === '' || _xeUtils.default.eqNull(inputValue)))],
        attrs: {
          spellcheck: false
        }
      }, [prefix || (0, _ui.renderEmptyElement)($xePasswordInput), h('div', {
        class: 'vxe-password-input--wrapper'
      }, [h('input', {
        ref: 'refInputTarget',
        class: 'vxe-password-input--inner',
        domProps: {
          value: inputValue
        },
        attrs: {
          name: name,
          type: inputType,
          placeholder: inpPlaceholder,
          readonly: inpReadonly,
          disabled: disabled,
          autocomplete: autocomplete || autoComplete,
          maxlength: maxLength
        },
        on: {
          click: $xePasswordInput.clickEvent,
          input: $xePasswordInput.inputEvent,
          change: $xePasswordInput.changeEvent,
          focus: $xePasswordInput.focusEvent,
          blur: $xePasswordInput.blurEvent
        }
      })]), suffix || (0, _ui.renderEmptyElement)($xePasswordInput)]);
    }
  },
  watch: {
    value: function value(val) {
      var $xePasswordInput = this;
      var reactData = $xePasswordInput.reactData;
      reactData.inputValue = val;
    }
  },
  created: function created() {
    var $xePasswordInput = this;
    var props = $xePasswordInput;
    var reactData = $xePasswordInput.reactData;
    reactData.inputValue = props.value;
  },
  render: function render(h) {
    return this.renderVN(h);
  }
});
/* define-vxe-component end */