vxe-pc-ui 4.20.33 → 4.20.35

package/es/password-input/src/password-input.js

@@ -6,459 +6,462 @@ import { getFuncText, getText } from "../../ui/src/utils";
 import { getSlotVNs } from "../../ui/src/vn";
 import { toCssUnit } from "../../ui/src/dom";
 const { getConfig, getIcon, getI18n, createEvent, useFns, renderEmptyElement } = VxeUI;
-var password_input_default = defineVxeComponent({
-  name: "VxePasswordInput",
-  props: {
-    modelValue: String,
-    immediate: {
-      type: Boolean,
-      default: true
-    },
-    name: String,
-    clearable: {
-      type: Boolean,
-      default: () => getConfig().passwordInput.clearable
-    },
-    readonly: Boolean,
-    disabled: Boolean,
-    maxLength: [String, Number],
-    placeholder: String,
-    floatContent: {
-      type: String,
-      default: () => getConfig().passwordInput.floatContent
-    },
-    floatAlign: {
-      type: String,
-      default: () => getConfig().passwordInput.floatAlign
-    },
-    autoComplete: {
-      type: String,
-      default: "off"
-    },
-    className: String,
-    inputClassName: {
-      type: String,
-      default: () => getConfig().passwordInput.inputClassName
-    },
-    width: [String, Number],
-    size: {
-      type: String,
-      default: () => getConfig().passwordInput.size || getConfig().size
-    },
-    prefixIcon: String,
-    suffixIcon: String,
-    controls: {
-      type: Boolean,
-      default: () => getConfig().passwordInput.controls
-    },
-    editable: {
-      type: Boolean,
-      default: true
+var password_input_default = (
+  /* define-vxe-component start */
+  defineVxeComponent({
+    name: "VxePasswordInput",
+    props: {
+      modelValue: String,
+      immediate: {
+        type: Boolean,
+        default: true
+      },
+      name: String,
+      clearable: {
+        type: Boolean,
+        default: () => getConfig().passwordInput.clearable
+      },
+      readonly: Boolean,
+      disabled: Boolean,
+      maxLength: [String, Number],
+      placeholder: String,
+      floatContent: {
+        type: String,
+        default: () => getConfig().passwordInput.floatContent
+      },
+      floatAlign: {
+        type: String,
+        default: () => getConfig().passwordInput.floatAlign
+      },
+      autoComplete: {
+        type: String,
+        default: "off"
+      },
+      className: String,
+      inputClassName: {
+        type: String,
+        default: () => getConfig().passwordInput.inputClassName
+      },
+      width: [String, Number],
+      size: {
+        type: String,
+        default: () => getConfig().passwordInput.size || getConfig().size
+      },
+      prefixIcon: String,
+      suffixIcon: String,
+      controls: {
+        type: Boolean,
+        default: () => getConfig().passwordInput.controls
+      },
+      editable: {
+        type: Boolean,
+        default: true
+      },
+      // 已废弃
+      autocomplete: String
     },
-    // 已废弃
-    autocomplete: String
-  },
-  emits: ["update:modelValue", "input", "change", "click", "focus", "blur", "clear", "lazy-change", "toggle-visible", "prefix-click", "suffix-click"],
-  setup(props, context) {
-    const { emit, slots } = context;
-    const $xeForm = inject("$xeForm", null);
-    const formItemInfo = inject("xeFormItemInfo", null);
-    const xID = XEUtils.uniqueId();
-    const { computeSize } = useFns.useSize(props);
-    const reactData = reactive({
-      showPwd: false,
-      isActivated: false,
-      inputValue: props.modelValue
-    });
-    const refElem = ref();
-    const refInputTarget = ref();
-    const refMaps = {
-      refElem,
-      refInput: refInputTarget
-    };
-    const $xePasswordInput = {
-      xID,
-      props,
-      context,
-      reactData,
-      getRefMaps: () => refMaps
-    };
-    const computeIsClearable = computed(() => {
-      return props.clearable;
-    });
-    const computeInpPlaceholder = computed(() => {
-      const { placeholder } = props;
-      if (placeholder) {
-        return getFuncText(placeholder);
-      }
-      const globalPlaceholder = getConfig().passwordInput.placeholder;
-      if (globalPlaceholder) {
-        return getFuncText(globalPlaceholder);
-      }
-      return getI18n("vxe.base.pleaseInput");
-    });
-    const computeFormReadonly = computed(() => {
-      if (getConfig().inputReadonly === "obsolete") {
-        if ($xeForm) {
-          return $xeForm.props.readonly;
+    emits: ["update:modelValue", "input", "change", "click", "focus", "blur", "clear", "lazy-change", "toggle-visible", "prefix-click", "suffix-click"],
+    setup(props, context) {
+      const { emit, slots } = context;
+      const $xeForm = inject("$xeForm", null);
+      const formItemInfo = inject("xeFormItemInfo", null);
+      const xID = XEUtils.uniqueId();
+      const { computeSize } = useFns.useSize(props);
+      const reactData = reactive({
+        showPwd: false,
+        isActivated: false,
+        inputValue: props.modelValue
+      });
+      const refElem = ref();
+      const refInputTarget = ref();
+      const refMaps = {
+        refElem,
+        refInput: refInputTarget
+      };
+      const $xePasswordInput = {
+        xID,
+        props,
+        context,
+        reactData,
+        getRefMaps: () => refMaps
+      };
+      const computeIsClearable = computed(() => {
+        return props.clearable;
+      });
+      const computeInpPlaceholder = computed(() => {
+        const { placeholder } = props;
+        if (placeholder) {
+          return getFuncText(placeholder);
         }
-        return false;
-      }
-      const { readonly } = props;
-      if (readonly === null) {
-        if ($xeForm) {
-          return $xeForm.props.readonly;
+        const globalPlaceholder = getConfig().passwordInput.placeholder;
+        if (globalPlaceholder) {
+          return getFuncText(globalPlaceholder);
         }
-        return false;
-      }
-      return readonly;
-    });
-    const computeIsDisabled = computed(() => {
-      const { disabled } = props;
-      if (disabled === null) {
-        if ($xeForm) {
-          return $xeForm.props.disabled;
+        return getI18n("vxe.base.pleaseInput");
+      });
+      const computeFormReadonly = computed(() => {
+        if (getConfig().inputReadonly === "obsolete") {
+          if ($xeForm) {
+            return $xeForm.props.readonly;
+          }
+          return false;
         }
-        return false;
-      }
-      return disabled;
-    });
-    const computeInputType = computed(() => {
-      const { showPwd } = reactData;
-      if (showPwd) {
-        return "text";
-      }
-      return "password";
-    });
-    const computeInpImmediate = computed(() => {
-      const { immediate } = props;
-      return immediate;
-    });
-    const computeInputReadonly = computed(() => {
-      const { editable } = props;
-      const formReadonly = computeFormReadonly.value;
-      return formReadonly || !editable;
-    });
-    const computeDomValue = computed(() => {
-      const { inputValue } = reactData;
-      return inputValue;
-    });
-    const computeCurrStyle = computed(() => {
-      const { width } = props;
-      const stys = {};
-      if (width) {
-        stys.width = toCssUnit(width);
-      }
-      return stys;
-    });
-    const dispatchEvent = (type, params, evnt) => {
-      emit(type, createEvent(evnt, { $passwordInput: $xePasswordInput }, params));
-    };
-    const updateDomValue = () => {
-      const domValue = computeDomValue.value;
-      const inputElem = refInputTarget.value;
-      if (inputElem) {
-        inputElem.value = XEUtils.eqNull(domValue) ? "" : "" + domValue;
-      }
-    };
-    const triggerEvent = (evnt) => {
-      const { inputValue } = reactData;
-      dispatchEvent(evnt.type, { value: inputValue }, evnt);
-    };
-    const emitInputEvent = (value, evnt) => {
-      const inpImmediate = computeInpImmediate.value;
-      reactData.inputValue = value;
-      if (inpImmediate) {
-        handleChange(value, evnt);
-      } else {
-        dispatchEvent("input", { value }, evnt);
-      }
-    };
-    const inputEvent = (evnt) => {
-      const inputElem = evnt.target;
-      const value = inputElem.value;
-      emitInputEvent(value, evnt);
-    };
-    const handleChange = (value, evnt) => {
-      reactData.inputValue = value;
-      emit("update:modelValue", value);
-      dispatchEvent("input", { value }, evnt);
-      if (XEUtils.toValueString(props.modelValue) !== value) {
-        dispatchEvent("change", { value }, evnt);
-        if ($xeForm && formItemInfo) {
-          $xeForm.triggerItemEvent(evnt, formItemInfo.itemConfig.field, value);
+        const { readonly } = props;
+        if (readonly === null) {
+          if ($xeForm) {
+            return $xeForm.props.readonly;
+          }
+          return false;
         }
-      }
-    };
-    const changeEvent = (evnt) => {
-      triggerEvent(evnt);
-      dispatchEvent("lazy-change", { value: reactData.inputValue }, evnt);
-      if ($xeForm && formItemInfo) {
-        $xeForm.triggerItemEvent(evnt, formItemInfo.itemConfig.field, reactData.inputValue);
-      }
-    };
-    const focusEvent = (evnt) => {
-      reactData.isActivated = true;
-      triggerEvent(evnt);
-    };
-    const blurEvent = (evnt) => {
-      const { inputValue } = reactData;
-      const value = inputValue;
-      reactData.isActivated = false;
-      dispatchEvent("blur", { value }, evnt);
-      if ($xeForm && formItemInfo) {
-        $xeForm.triggerItemEvent(evnt, formItemInfo.itemConfig.field, value);
-      }
-    };
-    const passwordToggleEvent = (evnt) => {
-      const { showPwd } = reactData;
-      const isDisabled = computeIsDisabled.value;
-      const formReadonly = computeFormReadonly.value;
-      if (!isDisabled && !formReadonly) {
-        reactData.showPwd = !showPwd;
-      }
-      dispatchEvent("toggle-visible", { visible: reactData.showPwd }, evnt);
-    };
-    const clickEvent = (evnt) => {
-      triggerEvent(evnt);
-    };
-    const clearValueEvent = (evnt, value) => {
-      focus();
-      handleChange("", evnt);
-      dispatchEvent("clear", { value }, evnt);
-      dispatchEvent("lazy-change", { value: reactData.inputValue }, evnt);
-    };
-    const clickSuffixEvent = (evnt) => {
-      const isDisabled = computeIsDisabled.value;
-      if (!isDisabled) {
-        const { inputValue } = reactData;
-        dispatchEvent("suffix-click", { value: inputValue }, evnt);
-      }
-    };
-    const clickPrefixEvent = (evnt) => {
-      const isDisabled = computeIsDisabled.value;
-      if (!isDisabled) {
+        return readonly;
+      });
+      const computeIsDisabled = computed(() => {
+        const { disabled } = props;
+        if (disabled === null) {
+          if ($xeForm) {
+            return $xeForm.props.disabled;
+          }
+          return false;
+        }
+        return disabled;
+      });
+      const computeInputType = computed(() => {
+        const { showPwd } = reactData;
+        if (showPwd) {
+          return "text";
+        }
+        return "password";
+      });
+      const computeInpImmediate = computed(() => {
+        const { immediate } = props;
+        return immediate;
+      });
+      const computeInputReadonly = computed(() => {
+        const { editable } = props;
+        const formReadonly = computeFormReadonly.value;
+        return formReadonly || !editable;
+      });
+      const computeDomValue = computed(() => {
         const { inputValue } = reactData;
-        dispatchEvent("prefix-click", { value: inputValue }, evnt);
-      }
-    };
-    const passwordInputMethods = {
-      dispatchEvent,
-      focus() {
+        return inputValue;
+      });
+      const computeCurrStyle = computed(() => {
+        const { width } = props;
+        const stys = {};
+        if (width) {
+          stys.width = toCssUnit(width);
+        }
+        return stys;
+      });
+      const dispatchEvent = (type, params, evnt) => {
+        emit(type, createEvent(evnt, { $passwordInput: $xePasswordInput }, params));
+      };
+      const updateDomValue = () => {
+        const domValue = computeDomValue.value;
         const inputElem = refInputTarget.value;
+        if (inputElem) {
+          inputElem.value = XEUtils.eqNull(domValue) ? "" : "" + domValue;
+        }
+      };
+      const triggerEvent = (evnt) => {
+        const { inputValue } = reactData;
+        dispatchEvent(evnt.type, { value: inputValue }, evnt);
+      };
+      const emitInputEvent = (value, evnt) => {
+        const inpImmediate = computeInpImmediate.value;
+        reactData.inputValue = value;
+        if (inpImmediate) {
+          handleChange(value, evnt);
+        } else {
+          dispatchEvent("input", { value }, evnt);
+        }
+      };
+      const inputEvent = (evnt) => {
+        const inputElem = evnt.target;
+        const value = inputElem.value;
+        emitInputEvent(value, evnt);
+      };
+      const handleChange = (value, evnt) => {
+        reactData.inputValue = value;
+        emit("update:modelValue", value);
+        dispatchEvent("input", { value }, evnt);
+        if (XEUtils.toValueString(props.modelValue) !== value) {
+          dispatchEvent("change", { value }, evnt);
+          if ($xeForm && formItemInfo) {
+            $xeForm.triggerItemEvent(evnt, formItemInfo.itemConfig.field, value);
+          }
+        }
+      };
+      const changeEvent = (evnt) => {
+        triggerEvent(evnt);
+        dispatchEvent("lazy-change", { value: reactData.inputValue }, evnt);
+        if ($xeForm && formItemInfo) {
+          $xeForm.triggerItemEvent(evnt, formItemInfo.itemConfig.field, reactData.inputValue);
+        }
+      };
+      const focusEvent = (evnt) => {
         reactData.isActivated = true;
-        inputElem.focus();
-        return nextTick();
-      },
-      blur() {
-        const inputElem = refInputTarget.value;
-        inputElem.blur();
-        reactData.isActivated = false;
-        return nextTick();
-      },
-      select() {
-        const inputElem = refInputTarget.value;
-        inputElem.select();
+        triggerEvent(evnt);
+      };
+      const blurEvent = (evnt) => {
+        const { inputValue } = reactData;
+        const value = inputValue;
         reactData.isActivated = false;
-        return nextTick();
-      }
-    };
-    Object.assign($xePasswordInput, passwordInputMethods);
-    const renderPasswordIcon = () => {
-      const { showPwd } = reactData;
-      return h(
-        "div",
-        {
-          class: "vxe-password-input--control-icon",
-          onClick: passwordToggleEvent
+        dispatchEvent("blur", { value }, evnt);
+        if ($xeForm && formItemInfo) {
+          $xeForm.triggerItemEvent(evnt, formItemInfo.itemConfig.field, value);
+        }
+      };
+      const passwordToggleEvent = (evnt) => {
+        const { showPwd } = reactData;
+        const isDisabled = computeIsDisabled.value;
+        const formReadonly = computeFormReadonly.value;
+        if (!isDisabled && !formReadonly) {
+          reactData.showPwd = !showPwd;
+        }
+        dispatchEvent("toggle-visible", { visible: reactData.showPwd }, evnt);
+      };
+      const clickEvent = (evnt) => {
+        triggerEvent(evnt);
+      };
+      const clearValueEvent = (evnt, value) => {
+        focus();
+        handleChange("", evnt);
+        dispatchEvent("clear", { value }, evnt);
+        dispatchEvent("lazy-change", { value: reactData.inputValue }, evnt);
+      };
+      const clickSuffixEvent = (evnt) => {
+        const isDisabled = computeIsDisabled.value;
+        if (!isDisabled) {
+          const { inputValue } = reactData;
+          dispatchEvent("suffix-click", { value: inputValue }, evnt);
+        }
+      };
+      const clickPrefixEvent = (evnt) => {
+        const isDisabled = computeIsDisabled.value;
+        if (!isDisabled) {
+          const { inputValue } = reactData;
+          dispatchEvent("prefix-click", { value: inputValue }, evnt);
+        }
+      };
+      const passwordInputMethods = {
+        dispatchEvent,
+        focus() {
+          const inputElem = refInputTarget.value;
+          reactData.isActivated = true;
+          inputElem.focus();
+          return nextTick();
         },
-        [
-          h("i", {
-            class: ["vxe-password-input--password-icon", showPwd ? getIcon().PASSWORD_INPUT_SHOW_PWD : getIcon().PASSWORD_INPUT_HIDE_PWD]
-          })
-        ]
-      );
-    };
-    const renderPrefixIcon = () => {
-      const { prefixIcon } = props;
-      const prefixSlot = slots.prefix;
-      return prefixSlot || prefixIcon ? h(
-        "div",
-        {
-          class: "vxe-password-input--prefix",
-          onClick: clickPrefixEvent
+        blur() {
+          const inputElem = refInputTarget.value;
+          inputElem.blur();
+          reactData.isActivated = false;
+          return nextTick();
         },
-        [
-          h(
-            "div",
-            {
-              class: "vxe-password-input--prefix-icon"
-            },
-            prefixSlot ? getSlotVNs(prefixSlot({})) : [
-              h("i", {
-                class: prefixIcon
-              })
-            ]
-          )
-        ]
-      ) : null;
-    };
-    const renderSuffixIcon = () => {
-      const { suffixIcon, controls } = props;
-      const { inputValue } = reactData;
-      const isDisabled = computeIsDisabled.value;
-      const isClearable = computeIsClearable.value;
-      const suffixSlot = slots.suffix;
-      return isClearable || controls || suffixSlot || suffixIcon ? h(
-        "div",
-        {
-          class: [
-            "vxe-password-input--suffix",
-            {
-              "is--clear": isClearable && !isDisabled && !(inputValue === "" || XEUtils.eqNull(inputValue))
-            }
+        select() {
+          const inputElem = refInputTarget.value;
+          inputElem.select();
+          reactData.isActivated = false;
+          return nextTick();
+        }
+      };
+      Object.assign($xePasswordInput, passwordInputMethods);
+      const renderPasswordIcon = () => {
+        const { showPwd } = reactData;
+        return h(
+          "div",
+          {
+            class: "vxe-password-input--control-icon",
+            onClick: passwordToggleEvent
+          },
+          [
+            h("i", {
+              class: ["vxe-password-input--password-icon", showPwd ? getIcon().PASSWORD_INPUT_SHOW_PWD : getIcon().PASSWORD_INPUT_HIDE_PWD]
+            })
           ]
-        },
-        [
-          isClearable ? h(
-            "div",
-            {
-              class: "vxe-password-input--clear-icon",
-              onClick: clearValueEvent
-            },
-            [
-              h("i", {
-                class: getIcon().INPUT_CLEAR
-              })
+        );
+      };
+      const renderPrefixIcon = () => {
+        const { prefixIcon } = props;
+        const prefixSlot = slots.prefix;
+        return prefixSlot || prefixIcon ? h(
+          "div",
+          {
+            class: "vxe-password-input--prefix",
+            onClick: clickPrefixEvent
+          },
+          [
+            h(
+              "div",
+              {
+                class: "vxe-password-input--prefix-icon"
+              },
+              prefixSlot ? getSlotVNs(prefixSlot({})) : [
+                h("i", {
+                  class: prefixIcon
+                })
+              ]
+            )
+          ]
+        ) : null;
+      };
+      const renderSuffixIcon = () => {
+        const { suffixIcon, controls } = props;
+        const { inputValue } = reactData;
+        const isDisabled = computeIsDisabled.value;
+        const isClearable = computeIsClearable.value;
+        const suffixSlot = slots.suffix;
+        return isClearable || controls || suffixSlot || suffixIcon ? h(
+          "div",
+          {
+            class: [
+              "vxe-password-input--suffix",
+              {
+                "is--clear": isClearable && !isDisabled && !(inputValue === "" || XEUtils.eqNull(inputValue))
+              }
             ]
-          ) : renderEmptyElement($xePasswordInput),
-          controls ? renderPasswordIcon() : renderEmptyElement($xePasswordInput),
-          suffixSlot || suffixIcon ? h(
+          },
+          [
+            isClearable ? h(
+              "div",
+              {
+                class: "vxe-password-input--clear-icon",
+                onClick: clearValueEvent
+              },
+              [
+                h("i", {
+                  class: getIcon().INPUT_CLEAR
+                })
+              ]
+            ) : renderEmptyElement($xePasswordInput),
+            controls ? renderPasswordIcon() : renderEmptyElement($xePasswordInput),
+            suffixSlot || suffixIcon ? h(
+              "div",
+              {
+                class: "vxe-password-input--suffix-icon",
+                onClick: clickSuffixEvent
+              },
+              suffixSlot ? getSlotVNs(suffixSlot({})) : [
+                h("i", {
+                  class: suffixIcon
+                })
+              ]
+            ) : renderEmptyElement($xePasswordInput)
+          ]
+        ) : null;
+      };
+      const renderVN = () => {
+        const { className, inputClassName, name, readonly, floatContent, autocomplete, autoComplete, maxLength, floatAlign } = props;
+        const { inputValue, isActivated } = reactData;
+        const isDisabled = computeIsDisabled.value;
+        const formReadonly = computeFormReadonly.value;
+        if (formReadonly) {
+          return h(
             "div",
             {
-              class: "vxe-password-input--suffix-icon",
-              onClick: clickSuffixEvent
+              ref: refElem,
+              class: ["vxe-password-input--readonly", className]
             },
-            suffixSlot ? getSlotVNs(suffixSlot({})) : [
-              h("i", {
-                class: suffixIcon
-              })
-            ]
-          ) : renderEmptyElement($xePasswordInput)
-        ]
-      ) : null;
-    };
-    const renderVN = () => {
-      const { className, inputClassName, name, readonly, floatContent, autocomplete, autoComplete, maxLength, floatAlign } = props;
-      const { inputValue, isActivated } = reactData;
-      const isDisabled = computeIsDisabled.value;
-      const formReadonly = computeFormReadonly.value;
-      if (formReadonly) {
+            getText(inputValue)
+          );
+        }
+        const currStyle = computeCurrStyle.value;
+        const vSize = computeSize.value;
+        const inputType = computeInputType.value;
+        const inpPlaceholder = computeInpPlaceholder.value;
+        const isClearable = computeIsClearable.value;
+        const inputReadonly = computeInputReadonly.value;
+        const prefix = renderPrefixIcon();
+        const suffix = renderSuffixIcon();
+        const floatSlot = slots.float;
         return h(
           "div",
           {
             ref: refElem,
-            class: ["vxe-password-input--readonly", className]
+            class: [
+              "vxe-password-input",
+              floatContent ? `fla--${floatAlign || "center"}` : "",
+              className,
+              {
+                [`size--${vSize}`]: vSize,
+                "is--prefix": !!prefix,
+                "is--suffix": !!suffix,
+                "is--readonly": readonly,
+                "is--disabled": isDisabled,
+                "is--active": isActivated,
+                "show--clear": isClearable && !isDisabled && !(inputValue === "" || XEUtils.eqNull(inputValue))
+              }
+            ],
+            style: currStyle,
+            spellcheck: false
           },
-          getText(inputValue)
+          [
+            prefix || renderEmptyElement($xePasswordInput),
+            h(
+              "div",
+              {
+                class: "vxe-password-input--wrapper"
+              },
+              [
+                h("input", {
+                  ref: refInputTarget,
+                  class: "vxe-password-input--inner" + (inputClassName ? " " + inputClassName : ""),
+                  name,
+                  type: inputType,
+                  placeholder: inpPlaceholder,
+                  readonly: inputReadonly,
+                  disabled: isDisabled,
+                  autocomplete: autocomplete || autoComplete,
+                  maxlength: maxLength,
+                  onClick: clickEvent,
+                  onInput: inputEvent,
+                  onChange: changeEvent,
+                  onFocus: focusEvent,
+                  onBlur: blurEvent
+                }),
+                floatContent || floatSlot ? h(
+                  "span",
+                  {
+                    class: "vxe-password-input--float-wrapper"
+                  },
+                  floatSlot ? floatSlot({}) : getText(floatContent)
+                ) : renderEmptyElement($xePasswordInput)
+              ]
+            ),
+            suffix || renderEmptyElement($xePasswordInput)
+          ]
         );
-      }
-      const currStyle = computeCurrStyle.value;
-      const vSize = computeSize.value;
-      const inputType = computeInputType.value;
-      const inpPlaceholder = computeInpPlaceholder.value;
-      const isClearable = computeIsClearable.value;
-      const inputReadonly = computeInputReadonly.value;
-      const prefix = renderPrefixIcon();
-      const suffix = renderSuffixIcon();
-      const floatSlot = slots.float;
-      return h(
-        "div",
-        {
-          ref: refElem,
-          class: [
-            "vxe-password-input",
-            floatContent ? `fla--${floatAlign || "center"}` : "",
-            className,
-            {
-              [`size--${vSize}`]: vSize,
-              "is--prefix": !!prefix,
-              "is--suffix": !!suffix,
-              "is--readonly": readonly,
-              "is--disabled": isDisabled,
-              "is--active": isActivated,
-              "show--clear": isClearable && !isDisabled && !(inputValue === "" || XEUtils.eqNull(inputValue))
-            }
-          ],
-          style: currStyle,
-          spellcheck: false
-        },
-        [
-          prefix || renderEmptyElement($xePasswordInput),
-          h(
-            "div",
-            {
-              class: "vxe-password-input--wrapper"
-            },
-            [
-              h("input", {
-                ref: refInputTarget,
-                class: "vxe-password-input--inner" + (inputClassName ? " " + inputClassName : ""),
-                name,
-                type: inputType,
-                placeholder: inpPlaceholder,
-                readonly: inputReadonly,
-                disabled: isDisabled,
-                autocomplete: autocomplete || autoComplete,
-                maxlength: maxLength,
-                onClick: clickEvent,
-                onInput: inputEvent,
-                onChange: changeEvent,
-                onFocus: focusEvent,
-                onBlur: blurEvent
-              }),
-              floatContent || floatSlot ? h(
-                "span",
-                {
-                  class: "vxe-password-input--float-wrapper"
-                },
-                floatSlot ? floatSlot({}) : getText(floatContent)
-              ) : renderEmptyElement($xePasswordInput)
-            ]
-          ),
-          suffix || renderEmptyElement($xePasswordInput)
-        ]
+      };
+      watch(
+        () => props.modelValue,
+        (val) => {
+          reactData.inputValue = val;
+        }
       );
-    };
-    watch(
-      () => props.modelValue,
-      (val) => {
-        reactData.inputValue = val;
-      }
-    );
-    const rDvFlag = ref(0);
-    watch(computeFormReadonly, () => {
-      rDvFlag.value++;
-    });
-    watch(computeDomValue, () => {
-      rDvFlag.value++;
-    });
-    watch(rDvFlag, () => {
-      updateDomValue();
-      nextTick(() => {
+      const rDvFlag = ref(0);
+      watch(computeFormReadonly, () => {
+        rDvFlag.value++;
+      });
+      watch(computeDomValue, () => {
+        rDvFlag.value++;
+      });
+      watch(rDvFlag, () => {
         updateDomValue();
+        nextTick(() => {
+          updateDomValue();
+        });
       });
-    });
-    onMounted(() => {
-      updateDomValue();
-    });
-    $xePasswordInput.renderVN = renderVN;
-    return $xePasswordInput;
-  },
-  render() {
-    return this.renderVN();
-  }
-});
+      onMounted(() => {
+        updateDomValue();
+      });
+      $xePasswordInput.renderVN = renderVN;
+      return $xePasswordInput;
+    },
+    render() {
+      return this.renderVN();
+    }
+  })
+);
 export {
   password_input_default as default
 };