'use strict';

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

var vue = require('vue');
require('../../../utils/index.js');
var antDesignVue = require('ant-design-vue');
var input = require('./input.js');
var createNamespace = require('../../../utils/create-namespace.js');

"use strict";
var _sfc_main = /* @__PURE__ */ vue.defineComponent({
  ...{ name: "LlInput", inheritAttrs: false },
  __name: "input copy",
  props: input.inputProps,
  emits: ["update:value", "change", "clear", "blur"],
  setup(__props, { expose: __expose, emit: __emit }) {
    const bem = createNamespace.createNamespace("input");
    const props = __props;
    const emit = __emit;
    const attrs = vue.useAttrs();
    const getMaxlength = vue.computed(
      () => typeof props.maxlength === "number" ? props.maxlength > 0 ? props.maxlength : null : null
    );
    const innerValue = vue.ref("");
    const inputRef = vue.ref();
    const isMouseOver = vue.ref(false);
    const formItemContext = antDesignVue.Form.useInjectFormItemContext();
    const affixWrapper = vue.ref();
    const hasValue = vue.computed(() => innerValue.value || props.defaultValue);
    const handleMouseOver = () => {
      isMouseOver.value = true;
    };
    const handleMouseOut = () => {
      isMouseOver.value = false;
    };
    const onChange = (e) => {
      const { value } = e.target;
      emit("update:value", value);
      emit("change", e);
      if (!value && e.type === "click") {
        emit("clear", value);
      }
      innerValue.value = value;
      formItemContext.onFieldChange();
    };
    const onBlur = (e) => {
      emit("blur", e);
      formItemContext.onFieldBlur();
    };
    vue.watch(
      () => [props.value, props.defaultValue],
      ([newValue, newDefaultValue]) => {
        innerValue.value = newValue || newDefaultValue;
      },
      {
        immediate: true
      }
    );
    const componentType = props.showPassword ? antDesignVue.Input.Password : antDesignVue.Input;
    const focus = () => {
      inputRef.value?.focus?.();
    };
    const select = () => {
      inputRef.value?.select?.();
    };
    const handleWrapperMouseOver = () => handleMouseOver();
    const handleWrapperMouseOut = () => handleMouseOut();
    vue.onMounted(() => {
      vue.nextTick(() => {
        if (!inputRef.value || !inputRef.value.$el || props.showPassword) return;
        const rootElement = inputRef.value.$el;
        const isRootAffixWrapper = rootElement.classList?.contains(
          "ant-input-affix-wrapper"
        );
        if (isRootAffixWrapper) {
          affixWrapper.value = rootElement;
        } else {
          affixWrapper.value = rootElement.querySelector?.(
            ".ant-input-affix-wrapper"
          );
        }
        if (affixWrapper.value) {
          affixWrapper.value.addEventListener("mouseenter", handleWrapperMouseOver);
          affixWrapper.value.addEventListener("mouseleave", handleWrapperMouseOut);
        }
      });
    });
    vue.onUnmounted(() => {
      if (affixWrapper.value) {
        affixWrapper.value.removeEventListener("mouseenter", handleWrapperMouseOver);
        affixWrapper.value.removeEventListener("mouseleave", handleWrapperMouseOut);
      }
    });
    __expose({
      focus,
      select
    });
    return (_ctx, _cache) => {
      const _component_ll_icon = vue.resolveComponent("ll-icon");
      return vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(vue.unref(componentType)), vue.mergeProps({
        ref_key: "inputRef",
        ref: inputRef
      }, vue.unref(attrs), {
        value: innerValue.value,
        autocomplete: "off",
        "allow-clear": _ctx.allowClear,
        disabled: _ctx.disabled,
        readonly: _ctx.readonly,
        maxlength: getMaxlength.value,
        class: [
          vue.unref(bem).b(),
          vue.unref(bem).is(_ctx.isGray ? "gray-input" : ""),
          _ctx.allowClear && hasValue.value && isMouseOver.value && !_ctx.disabled ? "show-clear-icon" : ""
        ],
        onChange,
        onBlur
      }), vue.createSlots({
        _: 2
        /* DYNAMIC */
      }, [
        vue.renderList(Object.keys(_ctx.$slots), (item) => {
          return {
            name: item,
            fn: vue.withCtx((data) => [
              vue.renderSlot(_ctx.$slots, item, vue.normalizeProps(vue.guardReactiveProps(data || {})))
            ])
          };
        }),
        _ctx.prefixIcon ? {
          name: "prefix",
          fn: vue.withCtx(() => [
            vue.createVNode(_component_ll_icon, {
              "icon-name": _ctx.prefixIcon,
              class: "prefix-icon"
            }, null, 8, ["icon-name"])
          ]),
          key: "0"
        } : void 0,
        _ctx.suffixIcon ? {
          name: "suffix",
          fn: vue.withCtx(() => [
            vue.createVNode(_component_ll_icon, {
              "icon-name": _ctx.suffixIcon,
              class: "suffix-icon"
            }, null, 8, ["icon-name"])
          ]),
          key: "1"
        } : void 0
      ]), 1040, ["value", "allow-clear", "disabled", "readonly", "maxlength", "class"]);
    };
  }
});

exports.default = _sfc_main;
//# sourceMappingURL=input copy.vue2.js.map
