import { defineComponent, useAttrs, ref, computed, watch, resolveComponent, createElementBlock, openBlock, mergeProps, unref, createVNode, createCommentVNode, createSlots, withCtx, createBlock, withModifiers, normalizeClass, renderList, renderSlot, normalizeProps, guardReactiveProps, createElementVNode, toDisplayString, Fragment, normalizeStyle, createTextVNode } from 'vue';
import '../../../utils/index.mjs';
import { omit } from 'lodash-es';
import { passwordInputEmits, passwordInputProps } from './input.mjs';
import { createNamespace } from '../../../utils/create-namespace.mjs';

"use strict";
const _hoisted_1 = { class: "title" };
var _sfc_main = /* @__PURE__ */ defineComponent({
  ...{ name: "LlPasswordInput", inheritAttrs: false },
  __name: "password-input",
  props: passwordInputProps,
  emits: passwordInputEmits,
  setup(__props, { expose: __expose, emit: __emit }) {
    const props = __props;
    const emits = __emit;
    const bem = createNamespace("password-input");
    const attrs = useAttrs();
    const inputPasswordRef = ref();
    const clickVisible = ref(false);
    const holdVisible = ref(false);
    const containerAttrs = computed(() => ({
      class: attrs.class,
      style: attrs.style
    }));
    const componentAttrs = computed(() => omit(attrs, ["class", "style"]));
    const newValue = computed({
      get() {
        return props.value;
      },
      set(value) {
        emits("update:value", value);
        emits("change", value);
      }
    });
    const holdVisibleValue = computed({
      get() {
        return props.visible || holdVisible.value;
      },
      set(value) {
        holdVisible.value = value;
        emits("update:visible", value);
      }
    });
    const clickVisibleValue = computed({
      get() {
        return props.visible || clickVisible.value;
      },
      set(value) {
        clickVisible.value = value;
        emits("update:visible", value);
      }
    });
    const newMaxlength = computed(() => {
      if (typeof props.maxlength === "number") {
        return props.maxlength <= 0 ? null : props.maxlength;
      }
      return props.maxlength;
    });
    const checkResults = computed(() => {
      return props.rules.map((rule) => {
        const regexPattern = rule.regex.replace(/^['"]|['"]$/g, "");
        const regex = new RegExp(regexPattern);
        return regex.test(props.value);
      });
    });
    const percent = computed(() => {
      return 100 / props.rules.length * checkResults.value.filter(Boolean).length;
    });
    const color = computed(() => {
      if (percent.value < 50) {
        return props.weakColor;
      } else if (percent.value < 100) {
        return props.mediumColor;
      } else {
        return props.strongColor;
      }
    });
    const focus = () => {
      inputPasswordRef.value.focus();
    };
    const select = () => {
      inputPasswordRef.value.select();
    };
    const handleMouseDown = () => {
      holdVisible.value = true;
    };
    const handleMouseUp = () => {
      holdVisible.value = false;
    };
    watch(
      () => percent.value,
      (v) => {
        emits("state", v === 100);
      },
      {
        immediate: true
      }
    );
    watch(
      () => props.trigger,
      (v) => {
        if (v === "hold") {
          holdVisible.value = false;
        }
      },
      {
        immediate: true
      }
    );
    __expose({
      focus,
      select
    });
    return (_ctx, _cache) => {
      const _component_ll_icon = resolveComponent("ll-icon");
      const _component_a_input_password = resolveComponent("a-input-password");
      const _component_a_progress = resolveComponent("a-progress");
      const _component_ll_tooltip = resolveComponent("ll-tooltip");
      return openBlock(), createElementBlock(
        "div",
        mergeProps({
          class: [unref(bem).b(), unref(bem).is(_ctx.isGray ? "gray-input-password" : "")]
        }, containerAttrs.value),
        [
          createVNode(_component_a_input_password, mergeProps(componentAttrs.value, {
            ref_key: "inputPasswordRef",
            ref: inputPasswordRef,
            value: newValue.value,
            "onUpdate:value": _cache[0] || (_cache[0] = ($event) => newValue.value = $event),
            visible: _ctx.trigger === "hold" ? holdVisibleValue.value : clickVisibleValue.value,
            class: unref(bem).e("input"),
            maxlength: newMaxlength.value,
            "onUpdate:visible": _cache[1] || (_cache[1] = (v) => clickVisibleValue.value = v)
          }), createSlots({
            iconRender: withCtx(() => [
              createCommentVNode(" \u4FEE\u6539\u56FE\u6807\u5BB9\u5668\uFF0C\u6DFB\u52A0\u9F20\u6807\u4E8B\u4EF6 "),
              _ctx.trigger === "hold" ? (openBlock(), createElementBlock(
                "span",
                {
                  key: 0,
                  class: normalizeClass(unref(bem).e("icon-wrapper")),
                  onMousedown: withModifiers(handleMouseDown, ["stop"]),
                  onMouseup: handleMouseUp,
                  onMouseleave: handleMouseUp,
                  onTouchstart: withModifiers(handleMouseDown, ["stop"]),
                  onTouchend: handleMouseUp,
                  onClick: withModifiers(handleMouseUp, ["stop"])
                },
                [
                  createVNode(_component_ll_icon, {
                    "icon-name": holdVisibleValue.value ? "icon-pwd-look" : "icon-pwd-hide"
                  }, null, 8, ["icon-name"])
                ],
                34
                /* CLASS, NEED_HYDRATION */
              )) : (openBlock(), createBlock(_component_ll_icon, {
                key: 1,
                "icon-name": clickVisibleValue.value ? "icon-pwd-look" : "icon-pwd-hide"
              }, null, 8, ["icon-name"]))
            ]),
            _: 2
            /* DYNAMIC */
          }, [
            renderList(Object.keys(_ctx.$slots).filter(
              (key) => key !== "iconRender"
            ), (item) => {
              return {
                name: item,
                fn: withCtx((data) => [
                  renderSlot(_ctx.$slots, item, normalizeProps(guardReactiveProps(data || {})))
                ])
              };
            })
          ]), 1040, ["value", "visible", "class", "maxlength"]),
          createCommentVNode(" \u8FDB\u5EA6\u6761 "),
          _ctx.pwdStrength && _ctx.rules.length > 0 ? (openBlock(), createElementBlock(
            "div",
            {
              key: 0,
              class: normalizeClass(unref(bem).e("strength"))
            },
            [
              createVNode(_component_a_progress, {
                class: normalizeClass(unref(bem).m("progress")),
                percent: percent.value,
                "show-info": false,
                "stroke-color": color.value
              }, null, 8, ["class", "percent", "stroke-color"]),
              createVNode(_component_ll_tooltip, {
                "is-white-bg": "",
                "overlay-class-name": unref(bem).b("tooltip")
              }, {
                title: withCtx(() => [
                  createElementVNode(
                    "div",
                    _hoisted_1,
                    toDisplayString(_ctx.tipTitle),
                    1
                    /* TEXT */
                  ),
                  (openBlock(true), createElementBlock(
                    Fragment,
                    null,
                    renderList(_ctx.rules, (item, idx) => {
                      return openBlock(), createElementBlock(
                        "div",
                        {
                          key: idx,
                          class: "rule-item",
                          style: normalizeStyle({
                            color: checkResults.value[idx] ? "var(--color-success)" : "var(--color-text-tertiary)"
                          })
                        },
                        [
                          createVNode(_component_ll_icon, {
                            "icon-name": checkResults.value[idx] ? "icon-check" : "icon-close2",
                            size: 14
                          }, null, 8, ["icon-name"]),
                          createTextVNode(
                            " " + toDisplayString(item.label),
                            1
                            /* TEXT */
                          )
                        ],
                        4
                        /* STYLE */
                      );
                    }),
                    128
                    /* KEYED_FRAGMENT */
                  ))
                ]),
                _: 1
                /* STABLE */
              }, 8, ["overlay-class-name"])
            ],
            2
            /* CLASS */
          )) : createCommentVNode("v-if", true)
        ],
        16
        /* FULL_PROPS */
      );
    };
  }
});

export { _sfc_main as default };
//# sourceMappingURL=password-input.vue2.mjs.map
