vxe-pc-ui 4.20.34 → 4.20.35

package/lib/number-input/src/number-input.js

@@ -42,1170 +42,1173 @@ var import_vn = require("../../ui/src/vn");
 var import_util = require("./util");
 const { getConfig, getIcon, getI18n, globalEvents, GLOBAL_EVENT_KEYS, createEvent, useFns, renderEmptyElement } = import_core.VxeUI;
 const { errLog } = (0, import_log.createComponentLog)("number-input");
-var number_input_default = (0, import_comp.defineVxeComponent)({
-  name: "VxeNumberInput",
-  props: {
-    modelValue: [String, Number],
-    immediate: {
-      type: Boolean,
-      default: true
-    },
-    name: String,
-    type: {
-      type: String,
-      default: "number"
-    },
-    clearable: {
-      type: Boolean,
-      default: () => getConfig().numberInput.clearable
-    },
-    readonly: {
-      type: Boolean,
-      default: null
-    },
-    disabled: {
-      type: Boolean,
-      default: null
-    },
-    placeholder: String,
-    floatContent: {
-      type: String,
-      default: () => getConfig().numberInput.floatContent
-    },
-    floatAlign: {
-      type: String,
-      default: () => getConfig().numberInput.floatAlign
-    },
-    maxLength: {
-      type: [String, Number],
-      default: () => getConfig().numberInput.maxLength
-    },
-    autoComplete: {
-      type: String,
-      default: "off"
-    },
-    align: String,
-    form: String,
-    className: String,
-    inputClassName: {
-      type: String,
-      default: () => getConfig().numberInput.inputClassName
-    },
-    width: [String, Number],
-    size: {
-      type: String,
-      default: () => getConfig().numberInput.size || getConfig().size
-    },
-    min: {
-      type: [String, Number],
-      default: null
-    },
-    max: {
-      type: [String, Number],
-      default: null
-    },
-    step: [String, Number],
-    exponential: {
-      type: Boolean,
-      default: () => getConfig().numberInput.exponential
-    },
-    negative: {
-      type: Boolean,
-      default: () => getConfig().numberInput.negative
-    },
-    showCurrency: {
-      type: Boolean,
-      default: () => getConfig().numberInput.showCurrency
-    },
-    currencySymbol: {
-      type: String,
-      default: () => getConfig().numberInput.currencySymbol
-    },
-    controlConfig: Object,
-    // number、float、amount
-    roundingMode: {
-      type: String,
-      default: () => getConfig().numberInput.roundingMode
-    },
-    // float、amount
-    digits: {
-      type: [String, Number],
-      default: null
-    },
-    autoFill: {
-      type: Boolean,
-      default: () => getConfig().numberInput.autoFill
-    },
-    editable: {
-      type: Boolean,
-      default: true
-    },
-    plusIcon: String,
-    minusIcon: String,
-    prefixIcon: String,
-    prefixConfig: Object,
-    suffixIcon: String,
-    suffixConfig: Object,
-    showTooltip: {
-      type: Boolean,
-      default: () => getConfig().numberInput.showTooltip
-    },
-    tooltipConfig: Object,
-    // 已废弃
-    controls: {
-      type: Boolean,
-      default: null
+var number_input_default = (
+  /* define-vxe-component start */
+  (0, import_comp.defineVxeComponent)({
+    name: "VxeNumberInput",
+    props: {
+      modelValue: [String, Number],
+      immediate: {
+        type: Boolean,
+        default: true
+      },
+      name: String,
+      type: {
+        type: String,
+        default: "number"
+      },
+      clearable: {
+        type: Boolean,
+        default: () => getConfig().numberInput.clearable
+      },
+      readonly: {
+        type: Boolean,
+        default: null
+      },
+      disabled: {
+        type: Boolean,
+        default: null
+      },
+      placeholder: String,
+      floatContent: {
+        type: String,
+        default: () => getConfig().numberInput.floatContent
+      },
+      floatAlign: {
+        type: String,
+        default: () => getConfig().numberInput.floatAlign
+      },
+      maxLength: {
+        type: [String, Number],
+        default: () => getConfig().numberInput.maxLength
+      },
+      autoComplete: {
+        type: String,
+        default: "off"
+      },
+      align: String,
+      form: String,
+      className: String,
+      inputClassName: {
+        type: String,
+        default: () => getConfig().numberInput.inputClassName
+      },
+      width: [String, Number],
+      size: {
+        type: String,
+        default: () => getConfig().numberInput.size || getConfig().size
+      },
+      min: {
+        type: [String, Number],
+        default: null
+      },
+      max: {
+        type: [String, Number],
+        default: null
+      },
+      step: [String, Number],
+      exponential: {
+        type: Boolean,
+        default: () => getConfig().numberInput.exponential
+      },
+      negative: {
+        type: Boolean,
+        default: () => getConfig().numberInput.negative
+      },
+      showCurrency: {
+        type: Boolean,
+        default: () => getConfig().numberInput.showCurrency
+      },
+      currencySymbol: {
+        type: String,
+        default: () => getConfig().numberInput.currencySymbol
+      },
+      controlConfig: Object,
+      // number、float、amount
+      roundingMode: {
+        type: String,
+        default: () => getConfig().numberInput.roundingMode
+      },
+      // float、amount
+      digits: {
+        type: [String, Number],
+        default: null
+      },
+      autoFill: {
+        type: Boolean,
+        default: () => getConfig().numberInput.autoFill
+      },
+      editable: {
+        type: Boolean,
+        default: true
+      },
+      plusIcon: String,
+      minusIcon: String,
+      prefixIcon: String,
+      prefixConfig: Object,
+      suffixIcon: String,
+      suffixConfig: Object,
+      showTooltip: {
+        type: Boolean,
+        default: () => getConfig().numberInput.showTooltip
+      },
+      tooltipConfig: Object,
+      // 已废弃
+      controls: {
+        type: Boolean,
+        default: null
+      },
+      // 已废弃
+      maxlength: [String, Number],
+      // 已废弃
+      autocomplete: String
     },
-    // 已废弃
-    maxlength: [String, Number],
-    // 已废弃
-    autocomplete: String
-  },
-  emits: [
-    "update:modelValue",
-    "input",
-    "change",
-    "keydown",
-    "keyup",
-    "wheel",
-    "click",
-    "focus",
-    "blur",
-    "clear",
-    "lazy-change",
-    "plus-number",
-    "minus-number",
-    "prefix-click",
-    "suffix-click",
-    // 已废弃
-    "prev-number",
-    "next-number"
-  ],
-  setup(props, context) {
-    const { slots, emit } = context;
-    const $xeForm = (0, import_vue.inject)("$xeForm", null);
-    const formItemInfo = (0, import_vue.inject)("xeFormItemInfo", null);
-    const xID = import_xe_utils.default.uniqueId();
-    const { computeSize } = useFns.useSize(props);
-    const reactData = (0, import_vue.reactive)({
-      isFocus: false,
-      isActivated: false,
-      inputValue: ""
-    });
-    const internalData = {
-      // dnTimeout: undefined,
-      // ainTimeout: undefined,
-      // isMouseDown: undefined,
-      // isUM: undefined
-    };
-    const refElem = (0, import_vue.ref)();
-    const refInputTarget = (0, import_vue.ref)();
-    const refInputPanel = (0, import_vue.ref)();
-    const computeFormReadonly = (0, import_vue.computed)(() => {
-      const { readonly } = props;
-      if (readonly === null) {
-        if ($xeForm) {
-          return $xeForm.props.readonly;
+    emits: [
+      "update:modelValue",
+      "input",
+      "change",
+      "keydown",
+      "keyup",
+      "wheel",
+      "click",
+      "focus",
+      "blur",
+      "clear",
+      "lazy-change",
+      "plus-number",
+      "minus-number",
+      "prefix-click",
+      "suffix-click",
+      // 已废弃
+      "prev-number",
+      "next-number"
+    ],
+    setup(props, context) {
+      const { slots, emit } = context;
+      const $xeForm = (0, import_vue.inject)("$xeForm", null);
+      const formItemInfo = (0, import_vue.inject)("xeFormItemInfo", null);
+      const xID = import_xe_utils.default.uniqueId();
+      const { computeSize } = useFns.useSize(props);
+      const reactData = (0, import_vue.reactive)({
+        isFocus: false,
+        isActivated: false,
+        inputValue: ""
+      });
+      const internalData = {
+        // dnTimeout: undefined,
+        // ainTimeout: undefined,
+        // isMouseDown: undefined,
+        // isUM: undefined
+      };
+      const refElem = (0, import_vue.ref)();
+      const refInputTarget = (0, import_vue.ref)();
+      const refInputPanel = (0, import_vue.ref)();
+      const computeFormReadonly = (0, import_vue.computed)(() => {
+        const { readonly } = props;
+        if (readonly === null) {
+          if ($xeForm) {
+            return $xeForm.props.readonly;
+          }
+          return false;
         }
-        return false;
-      }
-      return readonly;
-    });
-    const computeIsDisabled = (0, import_vue.computed)(() => {
-      const { disabled } = props;
-      if (disabled === null) {
-        if ($xeForm) {
-          return $xeForm.props.disabled;
+        return readonly;
+      });
+      const computeIsDisabled = (0, import_vue.computed)(() => {
+        const { disabled } = props;
+        if (disabled === null) {
+          if ($xeForm) {
+            return $xeForm.props.disabled;
+          }
+          return false;
         }
-        return false;
-      }
-      return disabled;
-    });
-    const computeDigitsValue = (0, import_vue.computed)(() => {
-      const { type, digits } = props;
-      let defDigits = digits;
-      if (defDigits === null) {
-        defDigits = getConfig().numberInput.digits;
+        return disabled;
+      });
+      const computeDigitsValue = (0, import_vue.computed)(() => {
+        const { type, digits } = props;
+        let defDigits = digits;
         if (defDigits === null) {
-          if (type === "amount") {
-            defDigits = 2;
+          defDigits = getConfig().numberInput.digits;
+          if (defDigits === null) {
+            if (type === "amount") {
+              defDigits = 2;
+            }
           }
         }
-      }
-      return import_xe_utils.default.toInteger(defDigits) || 1;
-    });
-    const computeControlOpts = (0, import_vue.computed)(() => {
-      return Object.assign({}, getConfig().numberInput.controlConfig, props.controlConfig);
-    });
-    const computePrefixOpts = (0, import_vue.computed)(() => {
-      return Object.assign({}, getConfig().numberInput.prefixConfig, props.prefixConfig);
-    });
-    const computeSuffixOpts = (0, import_vue.computed)(() => {
-      return Object.assign({}, getConfig().numberInput.suffixConfig, props.suffixConfig);
-    });
-    const computeTooltipOpts = (0, import_vue.computed)(() => {
-      return Object.assign({}, getConfig().numberInput.tooltipConfig, props.tooltipConfig);
-    });
-    const computeDecimalsType = (0, import_vue.computed)(() => {
-      const { type } = props;
-      return type === "float" || type === "amount";
-    });
-    const computeStepValue = (0, import_vue.computed)(() => {
-      const { type } = props;
-      const digitsValue = computeDigitsValue.value;
-      const decimalsType = computeDecimalsType.value;
-      const step = props.step;
-      if (type === "integer") {
-        return import_xe_utils.default.toInteger(step) || 1;
-      } else if (decimalsType) {
-        return import_xe_utils.default.toNumber(step) || 1 / Math.pow(10, digitsValue);
-      }
-      return import_xe_utils.default.toNumber(step) || 1;
-    });
-    const computeIsClearable = (0, import_vue.computed)(() => {
-      return props.clearable;
-    });
-    const computeInputReadonly = (0, import_vue.computed)(() => {
-      const { editable } = props;
-      const formReadonly = computeFormReadonly.value;
-      return formReadonly || !editable;
-    });
-    const computeInpPlaceholder = (0, import_vue.computed)(() => {
-      const { placeholder } = props;
-      if (placeholder) {
-        return (0, import_utils.getFuncText)(placeholder);
-      }
-      const globalPlaceholder = getConfig().numberInput.placeholder;
-      if (globalPlaceholder) {
-        return (0, import_utils.getFuncText)(globalPlaceholder);
-      }
-      return getI18n("vxe.base.pleaseInput");
-    });
-    const computeInpMaxLength = (0, import_vue.computed)(() => {
-      const { type, maxLength, maxlength, min, max } = props;
-      const digitsValue = computeDigitsValue.value;
-      const maxDefLen = 16;
-      if (!(0, import_utils.eqEmptyValue)(min) && !(0, import_utils.eqEmptyValue)(max)) {
-        return `${max}`.length + (type === "integer" ? 0 : digitsValue + 1) + (import_xe_utils.default.toNumber(min) >= 0 ? 0 : 1);
-      }
-      if (maxLength || maxlength) {
-        return import_xe_utils.default.toNumber(maxLength || maxlength);
-      }
-      return maxDefLen;
-    });
-    const computeInpImmediate = (0, import_vue.computed)(() => {
-      const { immediate } = props;
-      return immediate;
-    });
-    const computeNumValue = (0, import_vue.computed)(() => {
-      const { type } = props;
-      const { inputValue } = reactData;
-      return type === "integer" ? import_xe_utils.default.toInteger((0, import_util.handleNumber)(inputValue)) : import_xe_utils.default.toNumber((0, import_util.handleNumber)(inputValue));
-    });
-    const computeNumLabel = (0, import_vue.computed)(() => {
-      const { type, roundingMode, showCurrency, currencySymbol, autoFill } = props;
-      const { inputValue } = reactData;
-      const digitsValue = computeDigitsValue.value;
-      if (type === "amount") {
-        const num = import_xe_utils.default.toNumber(inputValue);
-        const cfyOpts = { digits: digitsValue };
-        if (roundingMode === "floor") {
-          cfyOpts.floor = true;
-        } else if (roundingMode === "ceil") {
-          cfyOpts.ceil = true;
-        } else {
-          cfyOpts.round = true;
-        }
-        let amountLabel = import_xe_utils.default.commafy(num, cfyOpts);
-        if (!autoFill) {
-          const [iStr, dStr] = amountLabel.split(".");
-          if (dStr) {
-            const dRest = dStr.replace(/0+$/, "");
-            amountLabel = dRest ? [iStr, ".", dRest].join("") : iStr;
-          }
+        return import_xe_utils.default.toInteger(defDigits) || 1;
+      });
+      const computeControlOpts = (0, import_vue.computed)(() => {
+        return Object.assign({}, getConfig().numberInput.controlConfig, props.controlConfig);
+      });
+      const computePrefixOpts = (0, import_vue.computed)(() => {
+        return Object.assign({}, getConfig().numberInput.prefixConfig, props.prefixConfig);
+      });
+      const computeSuffixOpts = (0, import_vue.computed)(() => {
+        return Object.assign({}, getConfig().numberInput.suffixConfig, props.suffixConfig);
+      });
+      const computeTooltipOpts = (0, import_vue.computed)(() => {
+        return Object.assign({}, getConfig().numberInput.tooltipConfig, props.tooltipConfig);
+      });
+      const computeDecimalsType = (0, import_vue.computed)(() => {
+        const { type } = props;
+        return type === "float" || type === "amount";
+      });
+      const computeStepValue = (0, import_vue.computed)(() => {
+        const { type } = props;
+        const digitsValue = computeDigitsValue.value;
+        const decimalsType = computeDecimalsType.value;
+        const step = props.step;
+        if (type === "integer") {
+          return import_xe_utils.default.toInteger(step) || 1;
+        } else if (decimalsType) {
+          return import_xe_utils.default.toNumber(step) || 1 / Math.pow(10, digitsValue);
         }
-        if (showCurrency) {
-          return `${currencySymbol || getI18n("vxe.numberInput.currencySymbol") || ""}${amountLabel}`;
+        return import_xe_utils.default.toNumber(step) || 1;
+      });
+      const computeIsClearable = (0, import_vue.computed)(() => {
+        return props.clearable;
+      });
+      const computeInputReadonly = (0, import_vue.computed)(() => {
+        const { editable } = props;
+        const formReadonly = computeFormReadonly.value;
+        return formReadonly || !editable;
+      });
+      const computeInpPlaceholder = (0, import_vue.computed)(() => {
+        const { placeholder } = props;
+        if (placeholder) {
+          return (0, import_utils.getFuncText)(placeholder);
         }
-        return amountLabel;
-      }
-      return import_xe_utils.default.toString(inputValue);
-    });
-    const computeIsDisabledSubtractNumber = (0, import_vue.computed)(() => {
-      const { min } = props;
-      const { inputValue } = reactData;
-      const numValue = computeNumValue.value;
-      if ((inputValue || inputValue === 0) && min !== null) {
-        return numValue <= import_xe_utils.default.toNumber(min);
-      }
-      return false;
-    });
-    const computeIsDisabledAddNumber = (0, import_vue.computed)(() => {
-      const { max } = props;
-      const { inputValue } = reactData;
-      const numValue = computeNumValue.value;
-      if ((inputValue || inputValue === 0) && max !== null) {
-        return numValue >= import_xe_utils.default.toNumber(max);
-      }
-      return false;
-    });
-    const computeInpClassNamevalue = (0, import_vue.computed)(() => {
-      const { inputClassName } = props;
-      return "vxe-number-input--input" + (inputClassName ? " " + inputClassName : "");
-    });
-    const computeCurrStyle = (0, import_vue.computed)(() => {
-      const { width } = props;
-      const stys = {};
-      if (width) {
-        stys.width = (0, import_dom.toCssUnit)(width);
-      }
-      return stys;
-    });
-    const refMaps = {
-      refElem,
-      refInput: refInputTarget
-    };
-    const computeMaps = {
-      computeControlOpts
-    };
-    const $xeNumberInput = {
-      xID,
-      props,
-      context,
-      reactData,
-      internalData,
-      getRefMaps: () => refMaps,
-      getComputeMaps: () => computeMaps
-    };
-    const dispatchEvent = (type, params, evnt) => {
-      emit(type, createEvent(evnt, { $numberInput: $xeNumberInput }, params));
-    };
-    const handleNumberString = (val) => {
-      if (import_xe_utils.default.eqNull(val)) {
-        return "";
-      }
-      return `${val}`;
-    };
-    const getNumberValue = (val) => {
-      const { type, exponential, roundingMode, autoFill } = props;
-      const inpMaxLength = computeInpMaxLength.value;
-      const digitsValue = computeDigitsValue.value;
-      const decimalsType = computeDecimalsType.value;
-      let restVal = "";
-      if (decimalsType) {
-        restVal = (0, import_util.toFloatValueFixed)(val, type, digitsValue, roundingMode);
-        if (!autoFill) {
-          restVal = handleNumberString(import_xe_utils.default.toNumber(restVal));
+        const globalPlaceholder = getConfig().numberInput.placeholder;
+        if (globalPlaceholder) {
+          return (0, import_utils.getFuncText)(globalPlaceholder);
         }
-      } else {
-        restVal = handleNumberString(val);
-      }
-      if (exponential && (val === restVal || handleNumberString(val).toLowerCase() === import_xe_utils.default.toNumber(restVal).toExponential())) {
-        return val;
-      }
-      return restVal.slice(0, inpMaxLength);
-    };
-    const triggerEvent = (evnt) => {
-      const { inputValue } = reactData;
-      dispatchEvent(evnt.type, { value: inputValue }, evnt);
-    };
-    const handleChange = (val, inputValue, evnt) => {
-      const value = (0, import_utils.eqEmptyValue)(val) ? null : Number(val);
-      const isChange = value !== props.modelValue;
-      if (isChange) {
-        internalData.isUM = true;
-        emit("update:modelValue", value);
-      }
-      if (reactData.inputValue !== inputValue) {
-        (0, import_vue.nextTick)(() => {
-          reactData.inputValue = inputValue || "";
-        });
-      }
-      dispatchEvent("input", { value }, evnt);
-      if (isChange) {
-        dispatchEvent("change", { value }, evnt);
-        if ($xeForm && formItemInfo) {
-          $xeForm.triggerItemEvent(evnt, formItemInfo.itemConfig.field, value);
+        return getI18n("vxe.base.pleaseInput");
+      });
+      const computeInpMaxLength = (0, import_vue.computed)(() => {
+        const { type, maxLength, maxlength, min, max } = props;
+        const digitsValue = computeDigitsValue.value;
+        const maxDefLen = 16;
+        if (!(0, import_utils.eqEmptyValue)(min) && !(0, import_utils.eqEmptyValue)(max)) {
+          return `${max}`.length + (type === "integer" ? 0 : digitsValue + 1) + (import_xe_utils.default.toNumber(min) >= 0 ? 0 : 1);
         }
-      }
-    };
-    const emitInputEvent = (inputValue, evnt) => {
-      const inpImmediate = computeInpImmediate.value;
-      const value = (0, import_utils.eqEmptyValue)(inputValue) ? null : import_xe_utils.default.toNumber(inputValue);
-      reactData.inputValue = inputValue;
-      if (inpImmediate) {
-        handleChange(value, inputValue, evnt);
-      } else {
-        dispatchEvent("input", { value }, evnt);
-        if ($xeForm && formItemInfo) {
-          $xeForm.triggerItemEvent(evnt, formItemInfo.itemConfig.field, value);
+        if (maxLength || maxlength) {
+          return import_xe_utils.default.toNumber(maxLength || maxlength);
         }
-      }
-    };
-    const inputEvent = (evnt) => {
-      const inputElem = evnt.target;
-      const value = inputElem.value;
-      emitInputEvent(value, evnt);
-    };
-    const changeEvent = (evnt) => {
-      const inpImmediate = computeInpImmediate.value;
-      if (!inpImmediate) {
-        triggerEvent(evnt);
-      }
-      dispatchEvent("lazy-change", { value: reactData.inputValue }, evnt);
-    };
-    const focusEvent = (evnt) => {
-      const inputReadonly = computeInputReadonly.value;
-      if (!inputReadonly) {
+        return maxDefLen;
+      });
+      const computeInpImmediate = (0, import_vue.computed)(() => {
+        const { immediate } = props;
+        return immediate;
+      });
+      const computeNumValue = (0, import_vue.computed)(() => {
+        const { type } = props;
         const { inputValue } = reactData;
-        reactData.inputValue = (0, import_utils.eqEmptyValue)(inputValue) ? "" : `${import_xe_utils.default.toNumber(inputValue)}`;
-        reactData.isFocus = true;
-        reactData.isActivated = true;
-        triggerEvent(evnt);
-      }
-    };
-    const clickPrefixEvent = (evnt) => {
-      const isDisabled = computeIsDisabled.value;
-      if (!isDisabled) {
+        return type === "integer" ? import_xe_utils.default.toInteger((0, import_util.handleNumber)(inputValue)) : import_xe_utils.default.toNumber((0, import_util.handleNumber)(inputValue));
+      });
+      const computeNumLabel = (0, import_vue.computed)(() => {
+        const { type, roundingMode, showCurrency, currencySymbol, autoFill } = props;
         const { inputValue } = reactData;
-        dispatchEvent("prefix-click", { value: inputValue }, evnt);
-      }
-    };
-    const clearValueEvent = (evnt, value) => {
-      focus();
-      handleChange(null, "", evnt);
-      dispatchEvent("clear", { value }, evnt);
-      dispatchEvent("lazy-change", { value }, evnt);
-      (0, import_vue.nextTick)(() => {
-        handleShowTip();
+        const digitsValue = computeDigitsValue.value;
+        if (type === "amount") {
+          const num = import_xe_utils.default.toNumber(inputValue);
+          const cfyOpts = { digits: digitsValue };
+          if (roundingMode === "floor") {
+            cfyOpts.floor = true;
+          } else if (roundingMode === "ceil") {
+            cfyOpts.ceil = true;
+          } else {
+            cfyOpts.round = true;
+          }
+          let amountLabel = import_xe_utils.default.commafy(num, cfyOpts);
+          if (!autoFill) {
+            const [iStr, dStr] = amountLabel.split(".");
+            if (dStr) {
+              const dRest = dStr.replace(/0+$/, "");
+              amountLabel = dRest ? [iStr, ".", dRest].join("") : iStr;
+            }
+          }
+          if (showCurrency) {
+            return `${currencySymbol || getI18n("vxe.numberInput.currencySymbol") || ""}${amountLabel}`;
+          }
+          return amountLabel;
+        }
+        return import_xe_utils.default.toString(inputValue);
+      });
+      const computeIsDisabledSubtractNumber = (0, import_vue.computed)(() => {
+        const { min } = props;
+        const { inputValue } = reactData;
+        const numValue = computeNumValue.value;
+        if ((inputValue || inputValue === 0) && min !== null) {
+          return numValue <= import_xe_utils.default.toNumber(min);
+        }
+        return false;
       });
-    };
-    const clickSuffixEvent = (evnt) => {
-      const isDisabled = computeIsDisabled.value;
-      if (!isDisabled) {
+      const computeIsDisabledAddNumber = (0, import_vue.computed)(() => {
+        const { max } = props;
         const { inputValue } = reactData;
-        dispatchEvent("suffix-click", { value: inputValue }, evnt);
-      }
-    };
-    const updateModel = (val) => {
-      const { type, roundingMode, autoFill } = props;
-      const { inputValue } = reactData;
-      const digitsValue = computeDigitsValue.value;
-      const decimalsType = computeDecimalsType.value;
-      if ((0, import_utils.eqEmptyValue)(val)) {
-        reactData.inputValue = "";
-      } else {
-        let textValue = "" + val;
+        const numValue = computeNumValue.value;
+        if ((inputValue || inputValue === 0) && max !== null) {
+          return numValue >= import_xe_utils.default.toNumber(max);
+        }
+        return false;
+      });
+      const computeInpClassNamevalue = (0, import_vue.computed)(() => {
+        const { inputClassName } = props;
+        return "vxe-number-input--input" + (inputClassName ? " " + inputClassName : "");
+      });
+      const computeCurrStyle = (0, import_vue.computed)(() => {
+        const { width } = props;
+        const stys = {};
+        if (width) {
+          stys.width = (0, import_dom.toCssUnit)(width);
+        }
+        return stys;
+      });
+      const refMaps = {
+        refElem,
+        refInput: refInputTarget
+      };
+      const computeMaps = {
+        computeControlOpts
+      };
+      const $xeNumberInput = {
+        xID,
+        props,
+        context,
+        reactData,
+        internalData,
+        getRefMaps: () => refMaps,
+        getComputeMaps: () => computeMaps
+      };
+      const dispatchEvent = (type, params, evnt) => {
+        emit(type, createEvent(evnt, { $numberInput: $xeNumberInput }, params));
+      };
+      const handleNumberString = (val) => {
+        if (import_xe_utils.default.eqNull(val)) {
+          return "";
+        }
+        return `${val}`;
+      };
+      const getNumberValue = (val) => {
+        const { type, exponential, roundingMode, autoFill } = props;
+        const inpMaxLength = computeInpMaxLength.value;
+        const digitsValue = computeDigitsValue.value;
+        const decimalsType = computeDecimalsType.value;
+        let restVal = "";
         if (decimalsType) {
-          textValue = (0, import_util.toFloatValueFixed)(val, type, digitsValue, roundingMode);
+          restVal = (0, import_util.toFloatValueFixed)(val, type, digitsValue, roundingMode);
           if (!autoFill) {
-            textValue = "" + import_xe_utils.default.toNumber(textValue);
+            restVal = handleNumberString(import_xe_utils.default.toNumber(restVal));
           }
+        } else {
+          restVal = handleNumberString(val);
         }
-        if (textValue !== inputValue) {
-          reactData.inputValue = textValue;
+        if (exponential && (val === restVal || handleNumberString(val).toLowerCase() === import_xe_utils.default.toNumber(restVal).toExponential())) {
+          return val;
         }
-      }
-    };
-    const initValue = () => {
-      const { type, roundingMode, autoFill } = props;
-      const { inputValue } = reactData;
-      const digitsValue = computeDigitsValue.value;
-      const decimalsType = computeDecimalsType.value;
-      if (decimalsType) {
-        if (inputValue) {
-          let textValue = "";
-          let validValue = null;
-          if (inputValue) {
-            textValue = (0, import_util.toFloatValueFixed)(inputValue, type, digitsValue, roundingMode);
-            validValue = import_xe_utils.default.toNumber(textValue);
+        return restVal.slice(0, inpMaxLength);
+      };
+      const triggerEvent = (evnt) => {
+        const { inputValue } = reactData;
+        dispatchEvent(evnt.type, { value: inputValue }, evnt);
+      };
+      const handleChange = (val, inputValue, evnt) => {
+        const value = (0, import_utils.eqEmptyValue)(val) ? null : Number(val);
+        const isChange = value !== props.modelValue;
+        if (isChange) {
+          internalData.isUM = true;
+          emit("update:modelValue", value);
+        }
+        if (reactData.inputValue !== inputValue) {
+          (0, import_vue.nextTick)(() => {
+            reactData.inputValue = inputValue || "";
+          });
+        }
+        dispatchEvent("input", { value }, evnt);
+        if (isChange) {
+          dispatchEvent("change", { value }, evnt);
+          if ($xeForm && formItemInfo) {
+            $xeForm.triggerItemEvent(evnt, formItemInfo.itemConfig.field, value);
+          }
+        }
+      };
+      const emitInputEvent = (inputValue, evnt) => {
+        const inpImmediate = computeInpImmediate.value;
+        const value = (0, import_utils.eqEmptyValue)(inputValue) ? null : import_xe_utils.default.toNumber(inputValue);
+        reactData.inputValue = inputValue;
+        if (inpImmediate) {
+          handleChange(value, inputValue, evnt);
+        } else {
+          dispatchEvent("input", { value }, evnt);
+          if ($xeForm && formItemInfo) {
+            $xeForm.triggerItemEvent(evnt, formItemInfo.itemConfig.field, value);
+          }
+        }
+      };
+      const inputEvent = (evnt) => {
+        const inputElem = evnt.target;
+        const value = inputElem.value;
+        emitInputEvent(value, evnt);
+      };
+      const changeEvent = (evnt) => {
+        const inpImmediate = computeInpImmediate.value;
+        if (!inpImmediate) {
+          triggerEvent(evnt);
+        }
+        dispatchEvent("lazy-change", { value: reactData.inputValue }, evnt);
+      };
+      const focusEvent = (evnt) => {
+        const inputReadonly = computeInputReadonly.value;
+        if (!inputReadonly) {
+          const { inputValue } = reactData;
+          reactData.inputValue = (0, import_utils.eqEmptyValue)(inputValue) ? "" : `${import_xe_utils.default.toNumber(inputValue)}`;
+          reactData.isFocus = true;
+          reactData.isActivated = true;
+          triggerEvent(evnt);
+        }
+      };
+      const clickPrefixEvent = (evnt) => {
+        const isDisabled = computeIsDisabled.value;
+        if (!isDisabled) {
+          const { inputValue } = reactData;
+          dispatchEvent("prefix-click", { value: inputValue }, evnt);
+        }
+      };
+      const clearValueEvent = (evnt, value) => {
+        focus();
+        handleChange(null, "", evnt);
+        dispatchEvent("clear", { value }, evnt);
+        dispatchEvent("lazy-change", { value }, evnt);
+        (0, import_vue.nextTick)(() => {
+          handleShowTip();
+        });
+      };
+      const clickSuffixEvent = (evnt) => {
+        const isDisabled = computeIsDisabled.value;
+        if (!isDisabled) {
+          const { inputValue } = reactData;
+          dispatchEvent("suffix-click", { value: inputValue }, evnt);
+        }
+      };
+      const updateModel = (val) => {
+        const { type, roundingMode, autoFill } = props;
+        const { inputValue } = reactData;
+        const digitsValue = computeDigitsValue.value;
+        const decimalsType = computeDecimalsType.value;
+        if ((0, import_utils.eqEmptyValue)(val)) {
+          reactData.inputValue = "";
+        } else {
+          let textValue = "" + val;
+          if (decimalsType) {
+            textValue = (0, import_util.toFloatValueFixed)(val, type, digitsValue, roundingMode);
             if (!autoFill) {
-              textValue = `${validValue}`;
+              textValue = "" + import_xe_utils.default.toNumber(textValue);
             }
           }
-          if (inputValue !== validValue) {
-            handleChange(validValue, textValue, { type: "init" });
-          } else {
+          if (textValue !== inputValue) {
             reactData.inputValue = textValue;
           }
         }
-      }
-    };
-    const validMaxNum = (num) => {
-      return props.max === null || props.max === "" || import_xe_utils.default.toNumber(num) <= import_xe_utils.default.toNumber(props.max);
-    };
-    const validMinNum = (num) => {
-      return props.min === null || props.min === "" || import_xe_utils.default.toNumber(num) >= import_xe_utils.default.toNumber(props.min);
-    };
-    const afterCheckValue = () => {
-      const { type, min, max, negative, exponential, clearable } = props;
-      const { inputValue } = reactData;
-      const inputReadonly = computeInputReadonly.value;
-      if (!inputReadonly) {
-        if ((0, import_utils.eqEmptyValue)(inputValue)) {
-          if (clearable) {
-            handleChange(null, "", { type: "check" });
-            return;
-          }
-          let inpNumVal = null;
-          let inpValue = inputValue;
-          if (min || min === 0) {
-            inpNumVal = import_xe_utils.default.toNumber(min);
-            inpValue = `${inpNumVal}`;
+      };
+      const initValue = () => {
+        const { type, roundingMode, autoFill } = props;
+        const { inputValue } = reactData;
+        const digitsValue = computeDigitsValue.value;
+        const decimalsType = computeDecimalsType.value;
+        if (decimalsType) {
+          if (inputValue) {
+            let textValue = "";
+            let validValue = null;
+            if (inputValue) {
+              textValue = (0, import_util.toFloatValueFixed)(inputValue, type, digitsValue, roundingMode);
+              validValue = import_xe_utils.default.toNumber(textValue);
+              if (!autoFill) {
+                textValue = `${validValue}`;
+              }
+            }
+            if (inputValue !== validValue) {
+              handleChange(validValue, textValue, { type: "init" });
+            } else {
+              reactData.inputValue = textValue;
+            }
           }
-          handleChange(inpNumVal, `${inpValue || ""}`, { type: "check" });
-          return;
         }
-        if (inputValue || min || max) {
-          let inpNumVal = type === "integer" ? import_xe_utils.default.toInteger((0, import_util.handleNumber)(inputValue)) : import_xe_utils.default.toNumber((0, import_util.handleNumber)(inputValue));
-          if (!validMinNum(inpNumVal)) {
-            inpNumVal = min;
-          } else if (!validMaxNum(inpNumVal)) {
-            inpNumVal = max;
-          }
-          if (!negative) {
-            inpNumVal = Math.abs(inpNumVal);
+      };
+      const validMaxNum = (num) => {
+        return props.max === null || props.max === "" || import_xe_utils.default.toNumber(num) <= import_xe_utils.default.toNumber(props.max);
+      };
+      const validMinNum = (num) => {
+        return props.min === null || props.min === "" || import_xe_utils.default.toNumber(num) >= import_xe_utils.default.toNumber(props.min);
+      };
+      const afterCheckValue = () => {
+        const { type, min, max, negative, exponential, clearable } = props;
+        const { inputValue } = reactData;
+        const inputReadonly = computeInputReadonly.value;
+        if (!inputReadonly) {
+          if ((0, import_utils.eqEmptyValue)(inputValue)) {
+            if (clearable) {
+              handleChange(null, "", { type: "check" });
+              return;
+            }
+            let inpNumVal = null;
+            let inpValue = inputValue;
+            if (min || min === 0) {
+              inpNumVal = import_xe_utils.default.toNumber(min);
+              inpValue = `${inpNumVal}`;
+            }
+            handleChange(inpNumVal, `${inpValue || ""}`, { type: "check" });
+            return;
           }
-          if (exponential) {
-            const inpStringVal = handleNumberString(inputValue).toLowerCase();
-            if (inpStringVal === import_xe_utils.default.toNumber(inpNumVal).toExponential()) {
-              inpNumVal = inpStringVal;
+          if (inputValue || min || max) {
+            let inpNumVal = type === "integer" ? import_xe_utils.default.toInteger((0, import_util.handleNumber)(inputValue)) : import_xe_utils.default.toNumber((0, import_util.handleNumber)(inputValue));
+            if (!validMinNum(inpNumVal)) {
+              inpNumVal = min;
+            } else if (!validMaxNum(inpNumVal)) {
+              inpNumVal = max;
+            }
+            if (!negative) {
+              inpNumVal = Math.abs(inpNumVal);
             }
+            if (exponential) {
+              const inpStringVal = handleNumberString(inputValue).toLowerCase();
+              if (inpStringVal === import_xe_utils.default.toNumber(inpNumVal).toExponential()) {
+                inpNumVal = inpStringVal;
+              }
+            }
+            const inpValue = getNumberValue(inpNumVal);
+            handleChange((0, import_utils.eqEmptyValue)(inpValue) ? null : Number(inpValue), inpValue, { type: "check" });
           }
-          const inpValue = getNumberValue(inpNumVal);
-          handleChange((0, import_utils.eqEmptyValue)(inpValue) ? null : Number(inpValue), inpValue, { type: "check" });
         }
-      }
-    };
-    const blurEvent = (evnt) => {
-      const { inputValue } = reactData;
-      const inpImmediate = computeInpImmediate.value;
-      const value = inputValue ? Number(inputValue) : null;
-      if (!inpImmediate) {
-        handleChange(value, handleNumberString(inputValue), evnt);
-      }
-      afterCheckValue();
-      reactData.isFocus = false;
-      reactData.isActivated = false;
-      dispatchEvent("blur", { value }, evnt);
-      if ($xeForm && formItemInfo) {
-        $xeForm.triggerItemEvent(evnt, formItemInfo.itemConfig.field, value);
-      }
-    };
-    const mouseenterEvent = () => {
-      handleShowTip();
-    };
-    const mouseleaveEvent = () => {
-      handleHideTip();
-    };
-    const numberChange = (isPlus, evnt) => {
-      const { min, max, type } = props;
-      const { inputValue } = reactData;
-      const stepValue = computeStepValue.value;
-      const numValue = type === "integer" ? import_xe_utils.default.toInteger((0, import_util.handleNumber)(inputValue)) : import_xe_utils.default.toNumber((0, import_util.handleNumber)(inputValue));
-      const newValue = isPlus ? import_xe_utils.default.add(numValue, stepValue) : import_xe_utils.default.subtract(numValue, stepValue);
-      let restNum;
-      if (!validMinNum(newValue)) {
-        restNum = min;
-      } else if (!validMaxNum(newValue)) {
-        restNum = max;
-      } else {
-        restNum = newValue;
-      }
-      emitInputEvent(getNumberValue(restNum), evnt);
-    };
-    const numberPlusEvent = (evnt) => {
-      const isDisabled = computeIsDisabled.value;
-      const formReadonly = computeFormReadonly.value;
-      const isDisabledAddNumber = computeIsDisabledAddNumber.value;
-      if (!isDisabled && !formReadonly && !isDisabledAddNumber) {
-        numberChange(true, evnt);
-      }
-      reactData.isActivated = true;
-      handleShowTip();
-      dispatchEvent("plus-number", { value: reactData.inputValue }, evnt);
-      dispatchEvent("lazy-change", { value: reactData.inputValue }, evnt);
-      dispatchEvent("next-number", { value: reactData.inputValue }, evnt);
-    };
-    const numberMinusEvent = (evnt) => {
-      const isDisabled = computeIsDisabled.value;
-      const formReadonly = computeFormReadonly.value;
-      const isDisabledSubtractNumber = computeIsDisabledSubtractNumber.value;
-      if (!isDisabled && !formReadonly && !isDisabledSubtractNumber) {
-        numberChange(false, evnt);
-      }
-      reactData.isActivated = true;
-      handleShowTip();
-      dispatchEvent("minus-number", { value: reactData.inputValue }, evnt);
-      dispatchEvent("lazy-change", { value: reactData.inputValue }, evnt);
-      dispatchEvent("prev-number", { value: reactData.inputValue }, evnt);
-    };
-    const numberKeydownEvent = (evnt) => {
-      const isUpArrow = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ARROW_UP);
-      const isDwArrow = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ARROW_DOWN);
-      if (isUpArrow || isDwArrow) {
-        evnt.preventDefault();
-        if (isUpArrow) {
-          numberPlusEvent(evnt);
+      };
+      const blurEvent = (evnt) => {
+        const { inputValue } = reactData;
+        const inpImmediate = computeInpImmediate.value;
+        const value = inputValue ? Number(inputValue) : null;
+        if (!inpImmediate) {
+          handleChange(value, handleNumberString(inputValue), evnt);
+        }
+        afterCheckValue();
+        reactData.isFocus = false;
+        reactData.isActivated = false;
+        dispatchEvent("blur", { value }, evnt);
+        if ($xeForm && formItemInfo) {
+          $xeForm.triggerItemEvent(evnt, formItemInfo.itemConfig.field, value);
+        }
+      };
+      const mouseenterEvent = () => {
+        handleShowTip();
+      };
+      const mouseleaveEvent = () => {
+        handleHideTip();
+      };
+      const numberChange = (isPlus, evnt) => {
+        const { min, max, type } = props;
+        const { inputValue } = reactData;
+        const stepValue = computeStepValue.value;
+        const numValue = type === "integer" ? import_xe_utils.default.toInteger((0, import_util.handleNumber)(inputValue)) : import_xe_utils.default.toNumber((0, import_util.handleNumber)(inputValue));
+        const newValue = isPlus ? import_xe_utils.default.add(numValue, stepValue) : import_xe_utils.default.subtract(numValue, stepValue);
+        let restNum;
+        if (!validMinNum(newValue)) {
+          restNum = min;
+        } else if (!validMaxNum(newValue)) {
+          restNum = max;
         } else {
-          numberMinusEvent(evnt);
+          restNum = newValue;
         }
-      }
-    };
-    const handleShowTip = () => {
-      const { type, showTooltip } = props;
-      const { inputValue } = reactData;
-      if (showTooltip) {
-        if (import_core.VxeUI.tooltip) {
-          const numLabel = computeNumLabel.value;
-          const tooltipOpts = computeTooltipOpts.value;
-          const { contentMethod } = tooltipOpts;
-          const inputElem = refInputTarget.value;
-          const content = (0, import_utils.getText)(
-            contentMethod ? contentMethod({
-              $numberInput: $xeNumberInput,
-              type,
-              inputValue: inputElem.value,
-              value: inputValue || "",
-              label: numLabel
-            }) : numLabel
-          );
-          if (content) {
-            import_core.VxeUI.tooltip.open(
-              inputElem,
-              Object.assign(
-                {},
-                {
-                  ...tooltipOpts,
-                  content
-                },
-                {
-                  contentMethod: void 0
-                }
-              )
-            );
+        emitInputEvent(getNumberValue(restNum), evnt);
+      };
+      const numberPlusEvent = (evnt) => {
+        const isDisabled = computeIsDisabled.value;
+        const formReadonly = computeFormReadonly.value;
+        const isDisabledAddNumber = computeIsDisabledAddNumber.value;
+        if (!isDisabled && !formReadonly && !isDisabledAddNumber) {
+          numberChange(true, evnt);
+        }
+        reactData.isActivated = true;
+        handleShowTip();
+        dispatchEvent("plus-number", { value: reactData.inputValue }, evnt);
+        dispatchEvent("lazy-change", { value: reactData.inputValue }, evnt);
+        dispatchEvent("next-number", { value: reactData.inputValue }, evnt);
+      };
+      const numberMinusEvent = (evnt) => {
+        const isDisabled = computeIsDisabled.value;
+        const formReadonly = computeFormReadonly.value;
+        const isDisabledSubtractNumber = computeIsDisabledSubtractNumber.value;
+        if (!isDisabled && !formReadonly && !isDisabledSubtractNumber) {
+          numberChange(false, evnt);
+        }
+        reactData.isActivated = true;
+        handleShowTip();
+        dispatchEvent("minus-number", { value: reactData.inputValue }, evnt);
+        dispatchEvent("lazy-change", { value: reactData.inputValue }, evnt);
+        dispatchEvent("prev-number", { value: reactData.inputValue }, evnt);
+      };
+      const numberKeydownEvent = (evnt) => {
+        const isUpArrow = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ARROW_UP);
+        const isDwArrow = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ARROW_DOWN);
+        if (isUpArrow || isDwArrow) {
+          evnt.preventDefault();
+          if (isUpArrow) {
+            numberPlusEvent(evnt);
           } else {
+            numberMinusEvent(evnt);
+          }
+        }
+      };
+      const handleShowTip = () => {
+        const { type, showTooltip } = props;
+        const { inputValue } = reactData;
+        if (showTooltip) {
+          if (import_core.VxeUI.tooltip) {
+            const numLabel = computeNumLabel.value;
+            const tooltipOpts = computeTooltipOpts.value;
+            const { contentMethod } = tooltipOpts;
+            const inputElem = refInputTarget.value;
+            const content = (0, import_utils.getText)(
+              contentMethod ? contentMethod({
+                $numberInput: $xeNumberInput,
+                type,
+                inputValue: inputElem.value,
+                value: inputValue || "",
+                label: numLabel
+              }) : numLabel
+            );
+            if (content) {
+              import_core.VxeUI.tooltip.open(
+                inputElem,
+                Object.assign(
+                  {},
+                  {
+                    ...tooltipOpts,
+                    content
+                  },
+                  {
+                    contentMethod: void 0
+                  }
+                )
+              );
+            } else {
+              import_core.VxeUI.tooltip.close();
+            }
+          }
+        }
+      };
+      const handleHideTip = () => {
+        const { showTooltip } = props;
+        if (showTooltip) {
+          if (import_core.VxeUI.tooltip) {
             import_core.VxeUI.tooltip.close();
           }
         }
-      }
-    };
-    const handleHideTip = () => {
-      const { showTooltip } = props;
-      if (showTooltip) {
-        if (import_core.VxeUI.tooltip) {
-          import_core.VxeUI.tooltip.close();
+      };
+      const keydownEvent = (evnt) => {
+        const { type, negative, exponential, controls } = props;
+        const controlOpts = computeControlOpts.value;
+        const { isArrow } = controlOpts;
+        const inputReadonly = computeInputReadonly.value;
+        const isControlKey = (0, import_dom.hasControlKey)(evnt);
+        const isShiftKey = evnt.shiftKey;
+        const isAltKey = evnt.altKey;
+        const key = evnt.key;
+        const keyCode = evnt.keyCode;
+        const isEsc = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ESCAPE);
+        const isUpArrow = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ARROW_UP);
+        const isDwArrow = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ARROW_DOWN);
+        if (!isControlKey && !isShiftKey && !isAltKey) {
+          if (globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.SPACEBAR) || !negative && key === "-" || type === "integer" && key === "." || (!exponential || keyCode !== 69) && keyCode >= 65 && keyCode <= 90 || keyCode >= 186 && keyCode <= 188 || keyCode >= 191) {
+            evnt.preventDefault();
+          }
         }
-      }
-    };
-    const keydownEvent = (evnt) => {
-      const { type, negative, exponential, controls } = props;
-      const controlOpts = computeControlOpts.value;
-      const { isArrow } = controlOpts;
-      const inputReadonly = computeInputReadonly.value;
-      const isControlKey = (0, import_dom.hasControlKey)(evnt);
-      const isShiftKey = evnt.shiftKey;
-      const isAltKey = evnt.altKey;
-      const key = evnt.key;
-      const keyCode = evnt.keyCode;
-      const isEsc = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ESCAPE);
-      const isUpArrow = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ARROW_UP);
-      const isDwArrow = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ARROW_DOWN);
-      if (!isControlKey && !isShiftKey && !isAltKey) {
-        if (globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.SPACEBAR) || !negative && key === "-" || type === "integer" && key === "." || (!exponential || keyCode !== 69) && keyCode >= 65 && keyCode <= 90 || keyCode >= 186 && keyCode <= 188 || keyCode >= 191) {
-          evnt.preventDefault();
+        if (isEsc) {
+          afterCheckValue();
+        } else if (isUpArrow || isDwArrow) {
+          if ((0, import_utils.isEnableConf)(controlOpts) && (controls === false ? controls : isArrow) && !inputReadonly) {
+            numberKeydownEvent(evnt);
+          }
         }
-      }
-      if (isEsc) {
-        afterCheckValue();
-      } else if (isUpArrow || isDwArrow) {
-        if ((0, import_utils.isEnableConf)(controlOpts) && (controls === false ? controls : isArrow) && !inputReadonly) {
-          numberKeydownEvent(evnt);
+        triggerEvent(evnt);
+      };
+      const keyupEvent = (evnt) => {
+        handleShowTip();
+        triggerEvent(evnt);
+      };
+      const stopDown = () => {
+        const { dnTimeout } = internalData;
+        if (dnTimeout) {
+          clearTimeout(dnTimeout);
+          internalData.dnTimeout = void 0;
         }
-      }
-      triggerEvent(evnt);
-    };
-    const keyupEvent = (evnt) => {
-      handleShowTip();
-      triggerEvent(evnt);
-    };
-    const stopDown = () => {
-      const { dnTimeout } = internalData;
-      if (dnTimeout) {
-        clearTimeout(dnTimeout);
-        internalData.dnTimeout = void 0;
-      }
-    };
-    const stopAutoIncrement = () => {
-      const { ainTimeout } = internalData;
-      if (ainTimeout) {
-        clearTimeout(ainTimeout);
-        internalData.ainTimeout = void 0;
-      }
-    };
-    const numberDownMinusEvent = (evnt) => {
-      numberStopAll();
-      internalData.ainTimeout = setTimeout(() => {
-        numberMinusEvent(evnt);
-        numberDownMinusEvent(evnt);
-      }, 60);
-    };
-    const numberDownPlusEvent = (evnt) => {
-      numberStopAll();
-      internalData.ainTimeout = setTimeout(() => {
-        numberPlusEvent(evnt);
-        numberDownPlusEvent(evnt);
-      }, 60);
-    };
-    const numberStopAll = () => {
-      stopDown();
-      stopAutoIncrement();
-    };
-    const numberClickEvent = (evnt) => {
-      if (internalData.isMouseDown) {
-        internalData.isMouseDown = false;
-      } else {
+      };
+      const stopAutoIncrement = () => {
+        const { ainTimeout } = internalData;
+        if (ainTimeout) {
+          clearTimeout(ainTimeout);
+          internalData.ainTimeout = void 0;
+        }
+      };
+      const numberDownMinusEvent = (evnt) => {
         numberStopAll();
-        const isAddNumber = (0, import_dom.hasClass)(evnt.currentTarget, "is--plus");
-        if (isAddNumber) {
-          numberPlusEvent(evnt);
-        } else {
+        internalData.ainTimeout = setTimeout(() => {
           numberMinusEvent(evnt);
-        }
-      }
-    };
-    const numberMousedownEvent = (evnt) => {
-      numberStopAll();
-      internalData.isMouseDown = true;
-      if (evnt.button === 0) {
-        const isAddNumber = (0, import_dom.hasClass)(evnt.currentTarget, "is--plus");
-        if (isAddNumber) {
+          numberDownMinusEvent(evnt);
+        }, 60);
+      };
+      const numberDownPlusEvent = (evnt) => {
+        numberStopAll();
+        internalData.ainTimeout = setTimeout(() => {
           numberPlusEvent(evnt);
+          numberDownPlusEvent(evnt);
+        }, 60);
+      };
+      const numberStopAll = () => {
+        stopDown();
+        stopAutoIncrement();
+      };
+      const numberClickEvent = (evnt) => {
+        if (internalData.isMouseDown) {
+          internalData.isMouseDown = false;
         } else {
-          numberMinusEvent(evnt);
-        }
-        internalData.dnTimeout = setTimeout(() => {
+          numberStopAll();
+          const isAddNumber = (0, import_dom.hasClass)(evnt.currentTarget, "is--plus");
           if (isAddNumber) {
-            numberDownPlusEvent(evnt);
+            numberPlusEvent(evnt);
           } else {
-            numberDownMinusEvent(evnt);
-          }
-        }, 500);
-      }
-    };
-    const wheelEvent = (evnt) => {
-      const { controls } = props;
-      const controlOpts = computeControlOpts.value;
-      const { isWheel } = controlOpts;
-      const inputReadonly = computeInputReadonly.value;
-      if ((0, import_utils.isEnableConf)(controlOpts) && (controls === false ? controls : isWheel) && !inputReadonly) {
-        if (reactData.isActivated) {
-          evnt.stopPropagation();
-          evnt.preventDefault();
-          const delta = evnt.deltaY;
-          if (delta > 0) {
             numberMinusEvent(evnt);
-          } else if (delta < 0) {
+          }
+        }
+      };
+      const numberMousedownEvent = (evnt) => {
+        numberStopAll();
+        internalData.isMouseDown = true;
+        if (evnt.button === 0) {
+          const isAddNumber = (0, import_dom.hasClass)(evnt.currentTarget, "is--plus");
+          if (isAddNumber) {
             numberPlusEvent(evnt);
+          } else {
+            numberMinusEvent(evnt);
           }
+          internalData.dnTimeout = setTimeout(() => {
+            if (isAddNumber) {
+              numberDownPlusEvent(evnt);
+            } else {
+              numberDownMinusEvent(evnt);
+            }
+          }, 500);
         }
-      }
-      triggerEvent(evnt);
-    };
-    const clickEvent = (evnt) => {
-      handleShowTip();
-      triggerEvent(evnt);
-    };
-    const handleGlobalMousedownEvent = (evnt) => {
-      const { isActivated } = reactData;
-      const el = refElem.value;
-      const panelElem = refInputPanel.value;
-      const isDisabled = computeIsDisabled.value;
-      const inputReadonly = computeInputReadonly.value;
-      const inpImmediate = computeInpImmediate.value;
-      if (!isDisabled && !inputReadonly && isActivated) {
-        reactData.isActivated = (0, import_dom.getEventTargetNode)(evnt, el).flag || (0, import_dom.getEventTargetNode)(evnt, panelElem).flag;
-        if (!reactData.isActivated) {
-          if (!inpImmediate) {
-            const { inputValue } = reactData;
-            const value = inputValue ? Number(inputValue) : null;
-            handleChange(value, handleNumberString(inputValue), evnt);
+      };
+      const wheelEvent = (evnt) => {
+        const { controls } = props;
+        const controlOpts = computeControlOpts.value;
+        const { isWheel } = controlOpts;
+        const inputReadonly = computeInputReadonly.value;
+        if ((0, import_utils.isEnableConf)(controlOpts) && (controls === false ? controls : isWheel) && !inputReadonly) {
+          if (reactData.isActivated) {
+            evnt.stopPropagation();
+            evnt.preventDefault();
+            const delta = evnt.deltaY;
+            if (delta > 0) {
+              numberMinusEvent(evnt);
+            } else if (delta < 0) {
+              numberPlusEvent(evnt);
+            }
           }
-          afterCheckValue();
-          handleHideTip();
         }
-      }
-    };
-    const handleGlobalKeydownEvent = (evnt) => {
-      const { clearable } = props;
-      const isDisabled = computeIsDisabled.value;
-      const inputReadonly = computeInputReadonly.value;
-      if (!isDisabled && !inputReadonly) {
-        const isTab = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.TAB);
-        const isDel = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.DELETE);
-        let isActivated = reactData.isActivated;
-        if (isTab) {
-          if (isActivated) {
+        triggerEvent(evnt);
+      };
+      const clickEvent = (evnt) => {
+        handleShowTip();
+        triggerEvent(evnt);
+      };
+      const handleGlobalMousedownEvent = (evnt) => {
+        const { isActivated } = reactData;
+        const el = refElem.value;
+        const panelElem = refInputPanel.value;
+        const isDisabled = computeIsDisabled.value;
+        const inputReadonly = computeInputReadonly.value;
+        const inpImmediate = computeInpImmediate.value;
+        if (!isDisabled && !inputReadonly && isActivated) {
+          reactData.isActivated = (0, import_dom.getEventTargetNode)(evnt, el).flag || (0, import_dom.getEventTargetNode)(evnt, panelElem).flag;
+          if (!reactData.isActivated) {
+            if (!inpImmediate) {
+              const { inputValue } = reactData;
+              const value = inputValue ? Number(inputValue) : null;
+              handleChange(value, handleNumberString(inputValue), evnt);
+            }
             afterCheckValue();
+            handleHideTip();
           }
-          isActivated = false;
-          reactData.isActivated = isActivated;
         }
-        if (isDel && clearable) {
-          if (isActivated) {
-            clearValueEvent(evnt, null);
+      };
+      const handleGlobalKeydownEvent = (evnt) => {
+        const { clearable } = props;
+        const isDisabled = computeIsDisabled.value;
+        const inputReadonly = computeInputReadonly.value;
+        if (!isDisabled && !inputReadonly) {
+          const isTab = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.TAB);
+          const isDel = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.DELETE);
+          let isActivated = reactData.isActivated;
+          if (isTab) {
+            if (isActivated) {
+              afterCheckValue();
+            }
+            isActivated = false;
+            reactData.isActivated = isActivated;
+          }
+          if (isDel && clearable) {
+            if (isActivated) {
+              clearValueEvent(evnt, null);
+            }
           }
         }
-      }
-    };
-    const handleGlobalBlurEvent = () => {
-      const { isActivated } = reactData;
-      if (isActivated) {
-        afterCheckValue();
-      }
-    };
-    const numberInputMethods = {
-      dispatchEvent,
-      focus() {
-        const inputReadonly = computeInputReadonly.value;
-        if (!inputReadonly) {
-          const inputElem = refInputTarget.value;
-          reactData.isActivated = true;
-          inputElem.focus();
+      };
+      const handleGlobalBlurEvent = () => {
+        const { isActivated } = reactData;
+        if (isActivated) {
+          afterCheckValue();
         }
-        return (0, import_vue.nextTick)();
-      },
-      blur() {
-        const inputElem = refInputTarget.value;
-        inputElem.blur();
-        reactData.isActivated = false;
-        return (0, import_vue.nextTick)();
-      },
-      select() {
-        const inputElem = refInputTarget.value;
-        inputElem.select();
-        reactData.isActivated = false;
-        return (0, import_vue.nextTick)();
-      }
-    };
-    Object.assign($xeNumberInput, numberInputMethods);
-    const renderPrefixIcon = () => {
-      const { prefixIcon } = props;
-      const prefixOpts = computePrefixOpts.value;
-      const prefixSlot = slots.prefix;
-      const preIcon = prefixIcon || prefixOpts.icon;
-      const sufContent = prefixOpts.content;
-      return prefixSlot || preIcon || sufContent ? (0, import_vue.h)(
-        "div",
-        {
-          class: "vxe-number-input--prefix",
-          onClick: clickPrefixEvent
+      };
+      const numberInputMethods = {
+        dispatchEvent,
+        focus() {
+          const inputReadonly = computeInputReadonly.value;
+          if (!inputReadonly) {
+            const inputElem = refInputTarget.value;
+            reactData.isActivated = true;
+            inputElem.focus();
+          }
+          return (0, import_vue.nextTick)();
         },
-        [
-          (0, import_vue.h)(
-            "div",
-            {
-              class: "vxe-number-input--prefix-icon"
-            },
-            prefixSlot ? (0, import_vn.getSlotVNs)(prefixSlot({})) : [
-              preIcon ? (0, import_vue.h)("i", {
-                class: preIcon
-              }) : renderEmptyElement($xeNumberInput),
-              sufContent ? (0, import_vue.h)(
-                "span",
-                {
-                  class: "vxe-prefix-input--suffix-text"
-                },
-                `${sufContent}`
-              ) : renderEmptyElement($xeNumberInput)
-            ]
-          )
-        ]
-      ) : renderEmptyElement($xeNumberInput);
-    };
-    const renderSuffixIcon = () => {
-      const { suffixIcon } = props;
-      const { inputValue } = reactData;
-      const suffixSlot = slots.suffix;
-      const suffixOpts = computeSuffixOpts.value;
-      const isDisabled = computeIsDisabled.value;
-      const isClearable = computeIsClearable.value;
-      const sufIcon = suffixIcon || suffixOpts.icon;
-      const sufContent = suffixOpts.content;
-      return (0, import_vue.h)(
-        "div",
-        {
-          class: [
-            "vxe-number-input--suffix",
-            {
-              "is--clear": isClearable && !isDisabled && !(inputValue === "" || import_xe_utils.default.eqNull(inputValue))
-            }
-          ]
+        blur() {
+          const inputElem = refInputTarget.value;
+          inputElem.blur();
+          reactData.isActivated = false;
+          return (0, import_vue.nextTick)();
         },
-        [
-          isClearable ? (0, import_vue.h)(
-            "div",
-            {
-              class: "vxe-number-input--clear-icon",
-              onClick: clearValueEvent
-            },
-            [
-              (0, import_vue.h)("i", {
-                class: getIcon().INPUT_CLEAR
-              })
+        select() {
+          const inputElem = refInputTarget.value;
+          inputElem.select();
+          reactData.isActivated = false;
+          return (0, import_vue.nextTick)();
+        }
+      };
+      Object.assign($xeNumberInput, numberInputMethods);
+      const renderPrefixIcon = () => {
+        const { prefixIcon } = props;
+        const prefixOpts = computePrefixOpts.value;
+        const prefixSlot = slots.prefix;
+        const preIcon = prefixIcon || prefixOpts.icon;
+        const sufContent = prefixOpts.content;
+        return prefixSlot || preIcon || sufContent ? (0, import_vue.h)(
+          "div",
+          {
+            class: "vxe-number-input--prefix",
+            onClick: clickPrefixEvent
+          },
+          [
+            (0, import_vue.h)(
+              "div",
+              {
+                class: "vxe-number-input--prefix-icon"
+              },
+              prefixSlot ? (0, import_vn.getSlotVNs)(prefixSlot({})) : [
+                preIcon ? (0, import_vue.h)("i", {
+                  class: preIcon
+                }) : renderEmptyElement($xeNumberInput),
+                sufContent ? (0, import_vue.h)(
+                  "span",
+                  {
+                    class: "vxe-prefix-input--suffix-text"
+                  },
+                  `${sufContent}`
+                ) : renderEmptyElement($xeNumberInput)
+              ]
+            )
+          ]
+        ) : renderEmptyElement($xeNumberInput);
+      };
+      const renderSuffixIcon = () => {
+        const { suffixIcon } = props;
+        const { inputValue } = reactData;
+        const suffixSlot = slots.suffix;
+        const suffixOpts = computeSuffixOpts.value;
+        const isDisabled = computeIsDisabled.value;
+        const isClearable = computeIsClearable.value;
+        const sufIcon = suffixIcon || suffixOpts.icon;
+        const sufContent = suffixOpts.content;
+        return (0, import_vue.h)(
+          "div",
+          {
+            class: [
+              "vxe-number-input--suffix",
+              {
+                "is--clear": isClearable && !isDisabled && !(inputValue === "" || import_xe_utils.default.eqNull(inputValue))
+              }
             ]
-          ) : renderEmptyElement($xeNumberInput),
-          suffixSlot || sufIcon || sufContent ? (0, import_vue.h)(
-            "div",
+          },
+          [
+            isClearable ? (0, import_vue.h)(
+              "div",
+              {
+                class: "vxe-number-input--clear-icon",
+                onClick: clearValueEvent
+              },
+              [
+                (0, import_vue.h)("i", {
+                  class: getIcon().INPUT_CLEAR
+                })
+              ]
+            ) : renderEmptyElement($xeNumberInput),
+            suffixSlot || sufIcon || sufContent ? (0, import_vue.h)(
+              "div",
+              {
+                class: "vxe-number-input--suffix-icon",
+                onClick: clickSuffixEvent
+              },
+              suffixSlot ? (0, import_vn.getSlotVNs)(suffixSlot({})) : [
+                sufIcon ? (0, import_vue.h)("i", {
+                  class: sufIcon
+                }) : renderEmptyElement($xeNumberInput),
+                sufContent ? (0, import_vue.h)(
+                  "span",
+                  {
+                    class: "vxe-number-input--suffix-text"
+                  },
+                  `${sufContent}`
+                ) : renderEmptyElement($xeNumberInput)
+              ]
+            ) : renderEmptyElement($xeNumberInput)
+          ]
+        );
+      };
+      const renderInput = () => {
+        const { type, name, autocomplete, autoComplete } = props;
+        const { inputValue, isFocus } = reactData;
+        const isDisabled = computeIsDisabled.value;
+        const numLabel = computeNumLabel.value;
+        const inputReadonly = computeInputReadonly.value;
+        const inpMaxLength = computeInpMaxLength.value;
+        const inpPlaceholder = computeInpPlaceholder.value;
+        const inpClassName = computeInpClassNamevalue.value;
+        return (0, import_vue.h)(
+          "div",
+          {
+            key: "ni",
+            class: "vxe-number-input--input-wrapper"
+          },
+          [
+            renderPrefixIcon(),
+            (0, import_vue.h)(
+              "div",
+              {
+                class: "vxe-number-input--input-inner"
+              },
+              [
+                (0, import_vue.h)("input", {
+                  ref: refInputTarget,
+                  class: inpClassName,
+                  name,
+                  type: "text",
+                  value: !isFocus && type === "amount" ? numLabel : inputValue,
+                  placeholder: inpPlaceholder,
+                  maxlength: inpMaxLength,
+                  readonly: inputReadonly,
+                  disabled: isDisabled,
+                  autocomplete: autoComplete || autocomplete,
+                  onKeydown: keydownEvent,
+                  onKeyup: keyupEvent,
+                  onClick: clickEvent,
+                  onInput: inputEvent,
+                  onChange: changeEvent,
+                  onFocus: focusEvent,
+                  onBlur: blurEvent
+                }),
+                renderFloat()
+              ]
+            ),
+            renderSuffixIcon()
+          ]
+        );
+      };
+      const renderMinusBtn = () => {
+        const { minusIcon } = props;
+        const isDisabledSubtractNumber = computeIsDisabledSubtractNumber.value;
+        return (0, import_vue.h)(
+          "button",
+          {
+            key: "prev",
+            class: [
+              "vxe-number-input--minus-btn is--minus",
+              {
+                "is--disabled": isDisabledSubtractNumber
+              }
+            ],
+            type: "button",
+            onClick: numberClickEvent,
+            onMousedown: numberMousedownEvent,
+            onMouseup: numberStopAll,
+            onMouseleave: numberStopAll
+          },
+          [
+            (0, import_vue.h)("i", {
+              class: minusIcon || getIcon().NUMBER_INPUT_MINUS_NUM
+            })
+          ]
+        );
+      };
+      const renderPlusBtn = () => {
+        const { plusIcon } = props;
+        const isDisabledAddNumber = computeIsDisabledAddNumber.value;
+        return (0, import_vue.h)(
+          "button",
+          {
+            key: "next",
+            class: [
+              "vxe-number-input--plus-btn is--plus",
+              {
+                "is--disabled": isDisabledAddNumber
+              }
+            ],
+            type: "button",
+            onClick: numberClickEvent,
+            onMousedown: numberMousedownEvent,
+            onMouseup: numberStopAll,
+            onMouseleave: numberStopAll
+          },
+          [
+            (0, import_vue.h)("i", {
+              class: plusIcon || getIcon().NUMBER_INPUT_PLUS_NUM
+            })
+          ]
+        );
+      };
+      const renderSideControl = () => {
+        return (0, import_vue.h)(
+          "div",
+          {
+            key: "cplr",
+            class: "vxe-number-input--side-control"
+          },
+          [renderPlusBtn(), renderMinusBtn()]
+        );
+      };
+      const renderFloat = () => {
+        const { floatContent } = props;
+        const floatSlot = slots.float;
+        if (floatContent || floatSlot) {
+          return (0, import_vue.h)(
+            "span",
             {
-              class: "vxe-number-input--suffix-icon",
-              onClick: clickSuffixEvent
+              class: "vxe-number-input--float-wrapper"
             },
-            suffixSlot ? (0, import_vn.getSlotVNs)(suffixSlot({})) : [
-              sufIcon ? (0, import_vue.h)("i", {
-                class: sufIcon
-              }) : renderEmptyElement($xeNumberInput),
-              sufContent ? (0, import_vue.h)(
-                "span",
-                {
-                  class: "vxe-number-input--suffix-text"
-                },
-                `${sufContent}`
-              ) : renderEmptyElement($xeNumberInput)
-            ]
-          ) : renderEmptyElement($xeNumberInput)
-        ]
-      );
-    };
-    const renderInput = () => {
-      const { type, name, autocomplete, autoComplete } = props;
-      const { inputValue, isFocus } = reactData;
-      const isDisabled = computeIsDisabled.value;
-      const numLabel = computeNumLabel.value;
-      const inputReadonly = computeInputReadonly.value;
-      const inpMaxLength = computeInpMaxLength.value;
-      const inpPlaceholder = computeInpPlaceholder.value;
-      const inpClassName = computeInpClassNamevalue.value;
-      return (0, import_vue.h)(
-        "div",
-        {
-          key: "ni",
-          class: "vxe-number-input--input-wrapper"
-        },
-        [
-          renderPrefixIcon(),
-          (0, import_vue.h)(
+            floatSlot ? floatSlot({}) : (0, import_utils.getText)(floatContent)
+          );
+        }
+        return renderEmptyElement($xeNumberInput);
+      };
+      const renderVN = () => {
+        const { className, controls, type, align, prefixIcon, suffixIcon, floatContent, floatAlign } = props;
+        const { inputValue, isActivated } = reactData;
+        const vSize = computeSize.value;
+        const controlOpts = computeControlOpts.value;
+        const { layout, showButton } = controlOpts;
+        const isDisabled = computeIsDisabled.value;
+        const formReadonly = computeFormReadonly.value;
+        const numLabel = computeNumLabel.value;
+        const prefixSlot = slots.prefix;
+        const suffixSlot = slots.suffix;
+        if (formReadonly) {
+          return (0, import_vue.h)(
             "div",
             {
-              class: "vxe-number-input--input-inner"
+              ref: refElem,
+              class: ["vxe-number-input--readonly", `type--${type}`, className]
             },
-            [
-              (0, import_vue.h)("input", {
-                ref: refInputTarget,
-                class: inpClassName,
-                name,
-                type: "text",
-                value: !isFocus && type === "amount" ? numLabel : inputValue,
-                placeholder: inpPlaceholder,
-                maxlength: inpMaxLength,
-                readonly: inputReadonly,
-                disabled: isDisabled,
-                autocomplete: autoComplete || autocomplete,
-                onKeydown: keydownEvent,
-                onKeyup: keyupEvent,
-                onClick: clickEvent,
-                onInput: inputEvent,
-                onChange: changeEvent,
-                onFocus: focusEvent,
-                onBlur: blurEvent
-              }),
-              renderFloat()
-            ]
-          ),
-          renderSuffixIcon()
-        ]
-      );
-    };
-    const renderMinusBtn = () => {
-      const { minusIcon } = props;
-      const isDisabledSubtractNumber = computeIsDisabledSubtractNumber.value;
-      return (0, import_vue.h)(
-        "button",
-        {
-          key: "prev",
-          class: [
-            "vxe-number-input--minus-btn is--minus",
-            {
-              "is--disabled": isDisabledSubtractNumber
-            }
-          ],
-          type: "button",
-          onClick: numberClickEvent,
-          onMousedown: numberMousedownEvent,
-          onMouseup: numberStopAll,
-          onMouseleave: numberStopAll
-        },
-        [
-          (0, import_vue.h)("i", {
-            class: minusIcon || getIcon().NUMBER_INPUT_MINUS_NUM
-          })
-        ]
-      );
-    };
-    const renderPlusBtn = () => {
-      const { plusIcon } = props;
-      const isDisabledAddNumber = computeIsDisabledAddNumber.value;
-      return (0, import_vue.h)(
-        "button",
-        {
-          key: "next",
-          class: [
-            "vxe-number-input--plus-btn is--plus",
-            {
-              "is--disabled": isDisabledAddNumber
-            }
-          ],
-          type: "button",
-          onClick: numberClickEvent,
-          onMousedown: numberMousedownEvent,
-          onMouseup: numberStopAll,
-          onMouseleave: numberStopAll
-        },
-        [
-          (0, import_vue.h)("i", {
-            class: plusIcon || getIcon().NUMBER_INPUT_PLUS_NUM
-          })
-        ]
-      );
-    };
-    const renderSideControl = () => {
-      return (0, import_vue.h)(
-        "div",
-        {
-          key: "cplr",
-          class: "vxe-number-input--side-control"
-        },
-        [renderPlusBtn(), renderMinusBtn()]
-      );
-    };
-    const renderFloat = () => {
-      const { floatContent } = props;
-      const floatSlot = slots.float;
-      if (floatContent || floatSlot) {
-        return (0, import_vue.h)(
-          "span",
-          {
-            class: "vxe-number-input--float-wrapper"
-          },
-          floatSlot ? floatSlot({}) : (0, import_utils.getText)(floatContent)
-        );
-      }
-      return renderEmptyElement($xeNumberInput);
-    };
-    const renderVN = () => {
-      const { className, controls, type, align, prefixIcon, suffixIcon, floatContent, floatAlign } = props;
-      const { inputValue, isActivated } = reactData;
-      const vSize = computeSize.value;
-      const controlOpts = computeControlOpts.value;
-      const { layout, showButton } = controlOpts;
-      const isDisabled = computeIsDisabled.value;
-      const formReadonly = computeFormReadonly.value;
-      const numLabel = computeNumLabel.value;
-      const prefixSlot = slots.prefix;
-      const suffixSlot = slots.suffix;
-      if (formReadonly) {
+            numLabel
+          );
+        }
+        const currStyle = computeCurrStyle.value;
+        const inputReadonly = computeInputReadonly.value;
+        const isClearable = computeIsClearable.value;
+        const isControls = (0, import_utils.isEnableConf)(controlOpts) && (controls === false ? controls : showButton);
         return (0, import_vue.h)(
           "div",
           {
             ref: refElem,
-            class: ["vxe-number-input--readonly", `type--${type}`, className]
+            class: [
+              "vxe-number-input",
+              `type--${type}`,
+              isControls ? `ctl--${layout === "right" || layout === "left" ? layout : "default"}` : "",
+              floatContent ? `fla--${floatAlign || "center"}` : "",
+              className,
+              {
+                [`size--${vSize}`]: vSize,
+                [`is--${align}`]: align,
+                "is--controls": isControls && !inputReadonly,
+                "is--prefix": !!prefixSlot || prefixIcon,
+                "is--suffix": !!suffixSlot || suffixIcon,
+                "is--disabled": isDisabled,
+                "is--active": isActivated,
+                "show--clear": isClearable && !isDisabled && !(inputValue === "" || import_xe_utils.default.eqNull(inputValue))
+              }
+            ],
+            style: currStyle,
+            spellcheck: false,
+            onMouseenter: mouseenterEvent,
+            onMouseleave: mouseleaveEvent
           },
-          numLabel
+          isControls ? layout === "right" ? [renderInput(), renderSideControl()] : layout === "left" ? [renderSideControl(), renderInput()] : [renderMinusBtn(), renderInput(), renderPlusBtn()] : [renderInput()]
         );
-      }
-      const currStyle = computeCurrStyle.value;
-      const inputReadonly = computeInputReadonly.value;
-      const isClearable = computeIsClearable.value;
-      const isControls = (0, import_utils.isEnableConf)(controlOpts) && (controls === false ? controls : showButton);
-      return (0, import_vue.h)(
-        "div",
-        {
-          ref: refElem,
-          class: [
-            "vxe-number-input",
-            `type--${type}`,
-            isControls ? `ctl--${layout === "right" || layout === "left" ? layout : "default"}` : "",
-            floatContent ? `fla--${floatAlign || "center"}` : "",
-            className,
-            {
-              [`size--${vSize}`]: vSize,
-              [`is--${align}`]: align,
-              "is--controls": isControls && !inputReadonly,
-              "is--prefix": !!prefixSlot || prefixIcon,
-              "is--suffix": !!suffixSlot || suffixIcon,
-              "is--disabled": isDisabled,
-              "is--active": isActivated,
-              "show--clear": isClearable && !isDisabled && !(inputValue === "" || import_xe_utils.default.eqNull(inputValue))
-            }
-          ],
-          style: currStyle,
-          spellcheck: false,
-          onMouseenter: mouseenterEvent,
-          onMouseleave: mouseleaveEvent
-        },
-        isControls ? layout === "right" ? [renderInput(), renderSideControl()] : layout === "left" ? [renderSideControl(), renderInput()] : [renderMinusBtn(), renderInput(), renderPlusBtn()] : [renderInput()]
+      };
+      $xeNumberInput.renderVN = renderVN;
+      (0, import_vue.watch)(
+        () => props.modelValue,
+        (val) => {
+          if (!internalData.isUM) {
+            updateModel(val);
+          }
+          internalData.isUM = false;
+        }
       );
-    };
-    $xeNumberInput.renderVN = renderVN;
-    (0, import_vue.watch)(
-      () => props.modelValue,
-      (val) => {
-        if (!internalData.isUM) {
-          updateModel(val);
+      (0, import_vue.watch)(
+        () => props.type,
+        () => {
+          Object.assign(reactData, {
+            inputValue: props.modelValue
+          });
+          initValue();
         }
-        internalData.isUM = false;
-      }
-    );
-    (0, import_vue.watch)(
-      () => props.type,
-      () => {
-        Object.assign(reactData, {
-          inputValue: props.modelValue
-        });
-        initValue();
-      }
-    );
-    (0, import_vue.onMounted)(() => {
-      if (props.showTooltip) {
-        if (!import_core.VxeUI.tooltip) {
-          errLog("vxe.error.reqComp", ["vxe-tooltip"]);
+      );
+      (0, import_vue.onMounted)(() => {
+        if (props.showTooltip) {
+          if (!import_core.VxeUI.tooltip) {
+            errLog("vxe.error.reqComp", ["vxe-tooltip"]);
+          }
         }
-      }
-      updateModel(props.modelValue);
-      const targetElem = refInputTarget.value;
-      if (targetElem) {
-        targetElem.addEventListener("wheel", wheelEvent, { passive: false });
-      }
-      globalEvents.on($xeNumberInput, "mousedown", handleGlobalMousedownEvent);
-      globalEvents.on($xeNumberInput, "keydown", handleGlobalKeydownEvent);
-      globalEvents.on($xeNumberInput, "blur", handleGlobalBlurEvent);
-    });
-    (0, import_vue.onBeforeUnmount)(() => {
-      reactData.isFocus = false;
-      numberStopAll();
-      afterCheckValue();
-      const targetElem = refInputTarget.value;
-      if (targetElem) {
-        targetElem.removeEventListener("wheel", wheelEvent);
-      }
-      globalEvents.off($xeNumberInput, "mousedown");
-      globalEvents.off($xeNumberInput, "keydown");
-      globalEvents.off($xeNumberInput, "blur");
-    });
-    initValue();
-    return $xeNumberInput;
-  },
-  render() {
-    return this.renderVN();
-  }
-});
+        updateModel(props.modelValue);
+        const targetElem = refInputTarget.value;
+        if (targetElem) {
+          targetElem.addEventListener("wheel", wheelEvent, { passive: false });
+        }
+        globalEvents.on($xeNumberInput, "mousedown", handleGlobalMousedownEvent);
+        globalEvents.on($xeNumberInput, "keydown", handleGlobalKeydownEvent);
+        globalEvents.on($xeNumberInput, "blur", handleGlobalBlurEvent);
+      });
+      (0, import_vue.onBeforeUnmount)(() => {
+        reactData.isFocus = false;
+        numberStopAll();
+        afterCheckValue();
+        const targetElem = refInputTarget.value;
+        if (targetElem) {
+          targetElem.removeEventListener("wheel", wheelEvent);
+        }
+        globalEvents.off($xeNumberInput, "mousedown");
+        globalEvents.off($xeNumberInput, "keydown");
+        globalEvents.off($xeNumberInput, "blur");
+      });
+      initValue();
+      return $xeNumberInput;
+    },
+    render() {
+      return this.renderVN();
+    }
+  })
+);