"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _vue = require("vue");
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
var _classNames2 = _interopRequireDefault(require("../_util/classNames"));
var _propsUtil = require("../_util/props-util");
var _vnode = require("../_util/vnode");
var _Input = _interopRequireDefault(require("./Input"));
var _SearchOutlined = _interopRequireDefault(require("@pf-ui/pf-icons-vue/SearchOutlined"));
var _inputProps = _interopRequireDefault(require("./inputProps"));
var _useConfigInject2 = _interopRequireDefault(require("../_util/hooks/useConfigInject"));
var _omit = _interopRequireDefault(require("../_util/omit"));
var _excluded = ["size", "visibilityToggle"];
var ActionMap = {
  click: 'onClick',
  hover: 'onMouseover'
};
var defaultIconRender = function defaultIconRender() {
  return (0, _vue.createVNode)(_SearchOutlined.default, null, null);
};
var _default = (0, _vue.defineComponent)({
  name: 'PfSearchInput',
  inheritAttrs: false,
  props: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, (0, _inputProps.default)()), {}, {
    prefixCls: String,
    inputPrefixCls: String,
    action: {
      type: String,
      default: 'click'
    },
    visibilityToggle: {
      type: Boolean,
      default: true
    },
    iconRender: Function,
    onSearch: {
      type: Function
    }
  }),
  setup: function setup(props, _ref) {
    var slots = _ref.slots,
      attrs = _ref.attrs,
      expose = _ref.expose,
      emit = _ref.emit;
    var visible = (0, _vue.ref)(false);
    var showClear = (0, _vue.ref)(false);
    var clickAction = function clickAction(e) {
      var _inputRef$value;
      emit('search', (_inputRef$value = inputRef.value) === null || _inputRef$value === void 0 ? void 0 : _inputRef$value.stateValue, e);
    };
    var changeAction = function changeAction(e) {
      var _e$target;
      emit('change', e);
      //@ts-ignore
      if (e !== null && e !== void 0 && (_e$target = e.target) !== null && _e$target !== void 0 && _e$target.value) {
        showClear.value = true;
      } else {
        // 无值时, 保持搜索
        showClear.value = false;
      }
    };
    var inputRef = (0, _vue.ref)();
    var focus = function focus() {
      var _inputRef$value2;
      (_inputRef$value2 = inputRef.value) === null || _inputRef$value2 === void 0 ? void 0 : _inputRef$value2.focus();
    };
    var blur = function blur() {
      var _inputRef$value3;
      (_inputRef$value3 = inputRef.value) === null || _inputRef$value3 === void 0 ? void 0 : _inputRef$value3.blur();
    };
    expose({
      focus: focus,
      blur: blur
    });
    var onFocus = function onFocus(e) {
      var onFocus = props.onFocus;
      onFocus === null || onFocus === void 0 ? void 0 : onFocus(e);
      (0, _vue.nextTick)(function () {
        var _e$target2;
        //@ts-ignore
        if (e !== null && e !== void 0 && (_e$target2 = e.target) !== null && _e$target2 !== void 0 && _e$target2.value) {
          showClear.value = true;
        } else {
          // 无值时, 保持搜索
          showClear.value = false;
        }
      });
    };
    var onBlur = function onBlur(e) {
      var onBlur = props.onBlur;
      onBlur === null || onBlur === void 0 ? void 0 : onBlur(e);
      (0, _vue.nextTick)(function () {
        var _e$target3;
        //@ts-ignore
        if (e !== null && e !== void 0 && (_e$target3 = e.target) !== null && _e$target3 !== void 0 && _e$target3.value) {
          showClear.value = true;
        } else {
          // 无值时, 保持搜索
          showClear.value = false;
        }
      });
    };
    var getIcon = function getIcon(prefixCls) {
      var _iconProps;
      var action = props.action,
        _props$iconRender = props.iconRender,
        iconRender = _props$iconRender === void 0 ? slots.iconRender || defaultIconRender : _props$iconRender;
      var iconTrigger = ActionMap[action] || '';
      var icon = iconRender(visible.value);
      var iconProps = (_iconProps = {}, (0, _defineProperty2.default)(_iconProps, iconTrigger, clickAction), (0, _defineProperty2.default)(_iconProps, "class", "".concat(prefixCls, "-icon")), (0, _defineProperty2.default)(_iconProps, "key", 'passwordIcon'), (0, _defineProperty2.default)(_iconProps, "onMousedown", function onMousedown(e) {
        // Prevent focused state lost
        // https://github.com/ant-design/ant-design/issues/15173
        e.preventDefault();
      }), (0, _defineProperty2.default)(_iconProps, "onMouseup", function onMouseup(e) {
        // Prevent caret position change
        // https://github.com/ant-design/ant-design/issues/23524
        e.preventDefault();
      }), _iconProps);
      return (0, _vnode.cloneElement)((0, _propsUtil.isValidElement)(icon) ? icon : (0, _vue.createVNode)("span", null, [icon]), iconProps);
    };
    var _useConfigInject = (0, _useConfigInject2.default)('search-input', props),
      prefixCls = _useConfigInject.prefixCls,
      getPrefixCls = _useConfigInject.getPrefixCls;
    var inputPrefixCls = (0, _vue.computed)(function () {
      return getPrefixCls('input', props.inputPrefixCls);
    });
    var renderSearchInput = function renderSearchInput() {
      var size = props.size,
        visibilityToggle = props.visibilityToggle,
        restProps = (0, _objectWithoutProperties2.default)(props, _excluded);
      var suffixIcon = visibilityToggle && !showClear.value && getIcon(prefixCls.value);
      var inputClassName = (0, _classNames2.default)(prefixCls.value, attrs.class, (0, _defineProperty2.default)({}, "".concat(prefixCls.value, "-").concat(size), !!size));
      var omittedProps = (0, _objectSpread2.default)((0, _objectSpread2.default)((0, _objectSpread2.default)({}, (0, _omit.default)(restProps, ['suffix', 'iconRender', 'action'])), attrs), {}, {
        type: 'text',
        class: inputClassName,
        prefixCls: inputPrefixCls.value,
        suffix: suffixIcon,
        onFocus: onFocus,
        onBlur: onBlur
      });
      if (size) {
        omittedProps.size = size;
      }
      return (0, _vue.createVNode)(_Input.default, (0, _objectSpread2.default)((0, _objectSpread2.default)({
        "ref": inputRef
      }, omittedProps), {}, {
        "allowClear": showClear.value,
        "onPressEnter": clickAction,
        "onChange": changeAction
      }), slots);
    };
    return function () {
      return renderSearchInput();
    };
  }
});
exports.default = _default;