vxe-pc-ui 4.20.24 → 4.20.26

package/lib/input/src/input.js

@@ -34,13 +34,14 @@ module.exports = __toCommonJS(input_exports);
 var import_vue = require("vue");
 var import_comp = require("../../ui/src/comp");
 var import_xe_utils = __toESM(require("xe-utils"));
-var import_ui = require("../../ui");
+var import_core = require("@vxe-ui/core");
 var import_utils = require("../../ui/src/utils");
 var import_dom = require("../../ui/src/dom");
 var import_util = require("../../date-panel/src/util");
 var import_util2 = require("../../number-input/src/util");
 var import_vn = require("../../ui/src/vn");
 var import_log = require("../../ui/src/log");
+const { getConfig, getIcon, getI18n, globalEvents, GLOBAL_EVENT_KEYS, createEvent, useFns, renderEmptyElement } = import_core.VxeUI;
 const { warnLog } = (0, import_log.createComponentLog)("input");
 var input_default = (0, import_comp.defineVxeComponent)({
   name: "VxeInput",
@@ -58,14 +59,14 @@ var input_default = (0, import_comp.defineVxeComponent)({
     },
     clearable: {
       type: Boolean,
-      default: () => (0, import_ui.getConfig)().input.clearable
+      default: () => getConfig().input.clearable
     },
     /**
      * 已废弃
      */
     delClearable: {
       type: Boolean,
-      default: () => (0, import_ui.getConfig)().input.delClearable
+      default: () => getConfig().input.delClearable
     },
     readonly: {
       type: Boolean,
@@ -81,15 +82,15 @@ var input_default = (0, import_comp.defineVxeComponent)({
     },
     floatContent: {
       type: String,
-      default: () => (0, import_ui.getConfig)().input.floatContent
+      default: () => getConfig().input.floatContent
     },
     floatAlign: {
       type: String,
-      default: () => (0, import_ui.getConfig)().input.floatAlign
+      default: () => getConfig().input.floatAlign
     },
     maxLength: {
       type: [String, Number],
-      default: () => (0, import_ui.getConfig)().input.maxLength
+      default: () => getConfig().input.maxLength
     },
     autoComplete: {
       type: String,
@@ -105,11 +106,11 @@ var input_default = (0, import_comp.defineVxeComponent)({
     width: [String, Number],
     inputClassName: {
       type: String,
-      default: () => (0, import_ui.getConfig)().input.inputClassName
+      default: () => getConfig().input.inputClassName
     },
     size: {
       type: String,
-      default: () => (0, import_ui.getConfig)().input.size || (0, import_ui.getConfig)().size
+      default: () => getConfig().input.size || getConfig().size
     },
     multiple: Boolean,
     // text
@@ -127,30 +128,30 @@ var input_default = (0, import_comp.defineVxeComponent)({
     step: [String, Number],
     trim: {
       type: Boolean,
-      default: () => (0, import_ui.getConfig)().input.trim
+      default: () => getConfig().input.trim
     },
     exponential: {
       type: Boolean,
-      default: () => (0, import_ui.getConfig)().input.exponential
+      default: () => getConfig().input.exponential
     },
     // number、integer、float、password
     controls: {
       type: Boolean,
-      default: () => (0, import_ui.getConfig)().input.controls
+      default: () => getConfig().input.controls
     },
     // float
     digits: {
       type: [String, Number],
-      default: () => (0, import_ui.getConfig)().input.digits
+      default: () => getConfig().input.digits
     },
     // date、week、month、quarter、year
     startDate: {
       type: [String, Number, Date],
-      default: () => (0, import_ui.getConfig)().input.startDate
+      default: () => getConfig().input.startDate
     },
     endDate: {
       type: [String, Number, Date],
-      default: () => (0, import_ui.getConfig)().input.endDate
+      default: () => getConfig().input.endDate
     },
     minDate: [String, Number, Date],
     maxDate: [String, Number, Date],
@@ -158,7 +159,7 @@ var input_default = (0, import_comp.defineVxeComponent)({
     startWeek: Number,
     startDay: {
       type: [String, Number],
-      default: () => (0, import_ui.getConfig)().input.startDay
+      default: () => getConfig().input.startDay
     },
     labelFormat: String,
     valueFormat: String,
@@ -171,7 +172,7 @@ var input_default = (0, import_comp.defineVxeComponent)({
     // week
     selectDay: {
       type: [String, Number],
-      default: () => (0, import_ui.getConfig)().input.selectDay
+      default: () => getConfig().input.selectDay
     },
     prefixIcon: String,
     prefixConfig: Object,
@@ -187,28 +188,7 @@ var input_default = (0, import_comp.defineVxeComponent)({
     // 已废弃
     autocomplete: String
   },
-  emits: [
-    "update:modelValue",
-    "input",
-    "change",
-    "keydown",
-    "keyup",
-    "wheel",
-    "click",
-    "focus",
-    "blur",
-    "clear",
-    "lazy-change",
-    "search-click",
-    "toggle-visible",
-    "prev-number",
-    "next-number",
-    "prefix-click",
-    "suffix-click",
-    "date-prev",
-    "date-today",
-    "date-next"
-  ],
+  emits: ["update:modelValue", "input", "change", "keydown", "keyup", "wheel", "click", "focus", "blur", "clear", "lazy-change", "search-click", "toggle-visible", "prev-number", "next-number", "prefix-click", "suffix-click", "date-prev", "date-today", "date-next"],
   setup(props, context) {
     const { slots, emit } = context;
     const $xeSelect = (0, import_vue.inject)("$xeSelect", null);
@@ -219,7 +199,7 @@ var input_default = (0, import_comp.defineVxeComponent)({
     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 } = (0, import_ui.useSize)(props);
+    const { computeSize } = useFns.useSize(props);
     const reactData = (0, import_vue.reactive)({
       initialized: false,
       panelIndex: 0,
@@ -245,8 +225,8 @@ var input_default = (0, import_comp.defineVxeComponent)({
       dnTimeout: void 0
     };
     const defaultFuncProps = {
-      festivalMethod: (0, import_ui.getConfig)().input.festivalMethod,
-      disabledMethod: (0, import_ui.getConfig)().input.disabledMethod
+      festivalMethod: getConfig().input.festivalMethod,
+      disabledMethod: getConfig().input.disabledMethod
     };
     const refElem = (0, import_vue.ref)();
     const refInputTarget = (0, import_vue.ref)();
@@ -273,15 +253,15 @@ var input_default = (0, import_comp.defineVxeComponent)({
       return import_xe_utils.default.toStringDate(value, format);
     };
     const computePrefixOpts = (0, import_vue.computed)(() => {
-      return Object.assign({}, (0, import_ui.getConfig)().input.prefixConfig, props.prefixConfig);
+      return Object.assign({}, getConfig().input.prefixConfig, props.prefixConfig);
     });
     const computeSuffixOpts = (0, import_vue.computed)(() => {
-      return Object.assign({}, (0, import_ui.getConfig)().input.suffixConfig, props.suffixConfig);
+      return Object.assign({}, getConfig().input.suffixConfig, props.suffixConfig);
     });
     const computeBtnTransfer = (0, import_vue.computed)(() => {
       const { transfer } = props;
       if (transfer === null) {
-        const globalTransfer = (0, import_ui.getConfig)().input.transfer;
+        const globalTransfer = getConfig().input.transfer;
         if (import_xe_utils.default.isBoolean(globalTransfer)) {
           return globalTransfer;
         }
@@ -292,7 +272,7 @@ var input_default = (0, import_comp.defineVxeComponent)({
       return transfer;
     });
     const computeFormReadonly = (0, import_vue.computed)(() => {
-      if ((0, import_ui.getConfig)().inputReadonly === "obsolete") {
+      if (getConfig().inputReadonly === "obsolete") {
         if ($xeForm) {
           return $xeForm.props.readonly;
         }
@@ -475,7 +455,7 @@ var input_default = (0, import_comp.defineVxeComponent)({
       const { labelFormat } = props;
       const isDatePickerType = computeIsDatePickerType.value;
       if (isDatePickerType) {
-        return labelFormat || (0, import_ui.getI18n)(`vxe.input.date.labelFormat.${props.type}`);
+        return labelFormat || getI18n(`vxe.input.date.labelFormat.${props.type}`);
       }
       return "";
     });
@@ -516,12 +496,12 @@ var input_default = (0, import_comp.defineVxeComponent)({
           month = selectMonth.getMonth() + 1;
         }
         if (datePanelType === "quarter" || datePanelType === "month") {
-          y = (0, import_ui.getI18n)("vxe.datePicker.yearTitle", [year]);
+          y = getI18n("vxe.datePicker.yearTitle", [year]);
         } else if (datePanelType === "year") {
           y = yearList.length ? `${yearList[0].year} - ${yearList[yearList.length - 1].year}` : "";
         } else {
-          y = (0, import_ui.getI18n)("vxe.datePicker.yearTitle", [year]);
-          m = month ? (0, import_ui.getI18n)(`vxe.input.date.m${month}`) : "-";
+          y = getI18n("vxe.datePicker.yearTitle", [year]);
+          m = month ? getI18n(`vxe.input.date.m${month}`) : "-";
         }
       }
       return {
@@ -557,7 +537,7 @@ var input_default = (0, import_comp.defineVxeComponent)({
         return weekDatas.map((day) => {
           return {
             value: day,
-            label: (0, import_ui.getI18n)(`vxe.input.date.weeks.w${day}`)
+            label: getI18n(`vxe.input.date.weeks.w${day}`)
           };
         });
       }
@@ -567,7 +547,7 @@ var input_default = (0, import_comp.defineVxeComponent)({
       const isDatePickerType = computeIsDatePickerType.value;
       if (isDatePickerType) {
         const dateHeaders = computeDateHeaders.value;
-        return [{ label: (0, import_ui.getI18n)("vxe.input.date.weeks.w") }].concat(dateHeaders);
+        return [{ label: getI18n("vxe.input.date.weeks.w") }].concat(dateHeaders);
       }
       return [];
     });
@@ -749,11 +729,11 @@ var input_default = (0, import_comp.defineVxeComponent)({
         return (0, import_utils.getFuncText)(placeholder);
       }
       if (import_xe_utils.default.eqNull(placeholder)) {
-        const globalPlaceholder = (0, import_ui.getConfig)().input.placeholder;
+        const globalPlaceholder = getConfig().input.placeholder;
         if (globalPlaceholder) {
           return (0, import_utils.getFuncText)(globalPlaceholder);
         }
-        return (0, import_ui.getI18n)("vxe.base.pleaseInput");
+        return getI18n("vxe.base.pleaseInput");
       }
       return placeholder;
     });
@@ -805,7 +785,7 @@ var input_default = (0, import_comp.defineVxeComponent)({
       return restVal.slice(0, inpMaxLength);
     };
     const dispatchEvent = (type, params, evnt) => {
-      emit(type, (0, import_ui.createEvent)(evnt, { $input: $xeInput }, params));
+      emit(type, createEvent(evnt, { $input: $xeInput }, params));
     };
     const updateDomValue = () => {
       const domValue = computeDomValue.value;
@@ -1186,8 +1166,8 @@ var input_default = (0, import_comp.defineVxeComponent)({
       dispatchEvent("prev-number", { value: reactData.inputValue }, evnt);
     };
     const numberKeydownEvent = (evnt) => {
-      const isUpArrow = import_ui.globalEvents.hasKey(evnt, import_ui.GLOBAL_EVENT_KEYS.ARROW_UP);
-      const isDwArrow = import_ui.globalEvents.hasKey(evnt, import_ui.GLOBAL_EVENT_KEYS.ARROW_DOWN);
+      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) {
@@ -1205,11 +1185,11 @@ var input_default = (0, import_comp.defineVxeComponent)({
         const isShiftKey = evnt.shiftKey;
         const isAltKey = evnt.altKey;
         const keyCode = evnt.keyCode;
-        const isEsc = import_ui.globalEvents.hasKey(evnt, import_ui.GLOBAL_EVENT_KEYS.ESCAPE);
-        const isUpArrow = import_ui.globalEvents.hasKey(evnt, import_ui.GLOBAL_EVENT_KEYS.ARROW_UP);
-        const isDwArrow = import_ui.globalEvents.hasKey(evnt, import_ui.GLOBAL_EVENT_KEYS.ARROW_DOWN);
+        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 (import_ui.globalEvents.hasKey(evnt, import_ui.GLOBAL_EVENT_KEYS.SPACEBAR) || type === "integer" && keyCode === 110 || (!exponential || keyCode !== 69) && (keyCode >= 65 && keyCode <= 90) || keyCode >= 186 && keyCode <= 188 || keyCode >= 191) {
+          if (globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.SPACEBAR) || type === "integer" && keyCode === 110 || (!exponential || keyCode !== 69) && keyCode >= 65 && keyCode <= 90 || keyCode >= 186 && keyCode <= 188 || keyCode >= 191) {
             evnt.preventDefault();
           }
         }
@@ -1537,10 +1517,10 @@ var input_default = (0, import_comp.defineVxeComponent)({
       const { isActivated, datePanelValue, datePanelType } = reactData;
       if (isActivated) {
         evnt.preventDefault();
-        const isLeftArrow = import_ui.globalEvents.hasKey(evnt, import_ui.GLOBAL_EVENT_KEYS.ARROW_LEFT);
-        const isUpArrow = import_ui.globalEvents.hasKey(evnt, import_ui.GLOBAL_EVENT_KEYS.ARROW_UP);
-        const isRightArrow = import_ui.globalEvents.hasKey(evnt, import_ui.GLOBAL_EVENT_KEYS.ARROW_RIGHT);
-        const isDwArrow = import_ui.globalEvents.hasKey(evnt, import_ui.GLOBAL_EVENT_KEYS.ARROW_DOWN);
+        const isLeftArrow = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ARROW_LEFT);
+        const isUpArrow = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ARROW_UP);
+        const isRightArrow = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ARROW_RIGHT);
+        const isDwArrow = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ARROW_DOWN);
         if (datePanelType === "year") {
           let offsetYear = import_xe_utils.default.getWhatYear(datePanelValue || Date.now(), 0, "first");
           if (isLeftArrow) {
@@ -1596,7 +1576,7 @@ var input_default = (0, import_comp.defineVxeComponent)({
     const datePgOffsetEvent = (evnt) => {
       const { isActivated } = reactData;
       if (isActivated) {
-        const isPgUp = import_ui.globalEvents.hasKey(evnt, import_ui.GLOBAL_EVENT_KEYS.PAGE_UP);
+        const isPgUp = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.PAGE_UP);
         evnt.preventDefault();
         if (isPgUp) {
           datePrevEvent(evnt);
@@ -1764,16 +1744,16 @@ var input_default = (0, import_comp.defineVxeComponent)({
       const isDisabled = computeIsDisabled.value;
       const isDatePickerType = computeIsDatePickerType.value;
       if (!isDisabled) {
-        const isTab = import_ui.globalEvents.hasKey(evnt, import_ui.GLOBAL_EVENT_KEYS.TAB);
-        const isDel = import_ui.globalEvents.hasKey(evnt, import_ui.GLOBAL_EVENT_KEYS.DELETE);
-        const isEsc = import_ui.globalEvents.hasKey(evnt, import_ui.GLOBAL_EVENT_KEYS.ESCAPE);
-        const isEnter = import_ui.globalEvents.hasKey(evnt, import_ui.GLOBAL_EVENT_KEYS.ENTER);
-        const isLeftArrow = import_ui.globalEvents.hasKey(evnt, import_ui.GLOBAL_EVENT_KEYS.ARROW_LEFT);
-        const isUpArrow = import_ui.globalEvents.hasKey(evnt, import_ui.GLOBAL_EVENT_KEYS.ARROW_UP);
-        const isRightArrow = import_ui.globalEvents.hasKey(evnt, import_ui.GLOBAL_EVENT_KEYS.ARROW_RIGHT);
-        const isDwArrow = import_ui.globalEvents.hasKey(evnt, import_ui.GLOBAL_EVENT_KEYS.ARROW_DOWN);
-        const isPgUp = import_ui.globalEvents.hasKey(evnt, import_ui.GLOBAL_EVENT_KEYS.PAGE_UP);
-        const isPgDn = import_ui.globalEvents.hasKey(evnt, import_ui.GLOBAL_EVENT_KEYS.PAGE_DOWN);
+        const isTab = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.TAB);
+        const isDel = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.DELETE);
+        const isEsc = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ESCAPE);
+        const isEnter = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ENTER);
+        const isLeftArrow = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ARROW_LEFT);
+        const isUpArrow = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ARROW_UP);
+        const isRightArrow = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ARROW_RIGHT);
+        const isDwArrow = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ARROW_DOWN);
+        const isPgUp = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.PAGE_UP);
+        const isPgDn = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.PAGE_DOWN);
         const operArrow = isLeftArrow || isUpArrow || isRightArrow || isDwArrow;
         let isActivated = reactData.isActivated;
         if (isTab) {
@@ -1887,32 +1867,55 @@ var input_default = (0, import_comp.defineVxeComponent)({
         const festivalItem = festivalRest ? import_xe_utils.default.isString(festivalRest) ? { label: festivalRest } : festivalRest : {};
         const extraItem = festivalItem.extra ? import_xe_utils.default.isString(festivalItem.extra) ? { label: festivalItem.extra } : festivalItem.extra : null;
         const labels = [
-          (0, import_vue.h)("span", {
-            class: ["vxe-input--date-label", {
-              "is-notice": festivalItem.notice
-            }]
-          }, extraItem && extraItem.label ? [
-            (0, import_vue.h)("span", `${label || ""}`),
-            (0, import_vue.h)("span", {
-              class: ["vxe-input--date-label--extra", extraItem.important ? "is-important" : "", extraItem.className],
-              style: extraItem.style
-            }, import_xe_utils.default.toValueString(extraItem.label))
-          ] : [`${label || ""}`])
+          (0, import_vue.h)(
+            "span",
+            {
+              class: [
+                "vxe-input--date-label",
+                {
+                  "is-notice": festivalItem.notice
+                }
+              ]
+            },
+            extraItem && extraItem.label ? [
+              (0, import_vue.h)("span", `${label || ""}`),
+              (0, import_vue.h)(
+                "span",
+                {
+                  class: ["vxe-input--date-label--extra", extraItem.important ? "is-important" : "", extraItem.className],
+                  style: extraItem.style
+                },
+                import_xe_utils.default.toValueString(extraItem.label)
+              )
+            ] : [`${label || ""}`]
+          )
         ];
         const festivalLabel = festivalItem.label;
         if (festivalLabel) {
           const festivalLabels = import_xe_utils.default.toValueString(festivalLabel).split(",");
           labels.push(
-            (0, import_vue.h)("span", {
-              class: ["vxe-input--date-festival", festivalItem.important ? "is-important" : "", festivalItem.className],
-              style: festivalItem.style
-            }, [
-              festivalLabels.length > 1 ? (0, import_vue.h)("span", {
-                class: ["vxe-input--date-festival--overlap", `overlap--${festivalLabels.length}`]
-              }, festivalLabels.map((label2) => (0, import_vue.h)("span", label2.substring(0, 3)))) : (0, import_vue.h)("span", {
-                class: "vxe-input--date-festival--label"
-              }, festivalLabels[0].substring(0, 3))
-            ])
+            (0, import_vue.h)(
+              "span",
+              {
+                class: ["vxe-input--date-festival", festivalItem.important ? "is-important" : "", festivalItem.className],
+                style: festivalItem.style
+              },
+              [
+                festivalLabels.length > 1 ? (0, import_vue.h)(
+                  "span",
+                  {
+                    class: ["vxe-input--date-festival--overlap", `overlap--${festivalLabels.length}`]
+                  },
+                  festivalLabels.map((label2) => (0, import_vue.h)("span", label2.substring(0, 3)))
+                ) : (0, import_vue.h)(
+                  "span",
+                  {
+                    class: "vxe-input--date-festival--label"
+                  },
+                  festivalLabels[0].substring(0, 3)
+                )
+              ]
+            )
           );
         }
         return labels;
@@ -1928,35 +1931,52 @@ var input_default = (0, import_comp.defineVxeComponent)({
       const dateListValue = computeDateListValue.value;
       const matchFormat = "yyyyMMdd";
       return [
-        (0, import_vue.h)("table", {
-          class: `vxe-input--date-${datePanelType}-view`,
-          cellspacing: 0,
-          cellpadding: 0,
-          border: 0
-        }, [
-          (0, import_vue.h)("thead", [
-            (0, import_vue.h)("tr", dateHeaders.map((item) => {
-              return (0, import_vue.h)("th", item.label);
-            }))
-          ]),
-          (0, import_vue.h)("tbody", dayDatas.map((rows) => {
-            return (0, import_vue.h)("tr", rows.map((item) => {
-              return (0, import_vue.h)("td", {
-                class: {
-                  "is--prev": item.isPrev,
-                  "is--current": item.isCurrent,
-                  "is--now": item.isNow,
-                  "is--next": item.isNext,
-                  "is--disabled": isDateDisabled(item),
-                  "is--selected": multiple ? dateListValue.some((val) => import_xe_utils.default.isDateSame(val, item.date, matchFormat)) : import_xe_utils.default.isDateSame(dateValue, item.date, matchFormat),
-                  "is--hover": import_xe_utils.default.isDateSame(datePanelValue, item.date, matchFormat)
-                },
-                onClick: () => dateSelectEvent(item),
-                onMouseenter: () => dateMouseenterEvent(item)
-              }, renderDateLabel(item, item.label));
-            }));
-          }))
-        ])
+        (0, import_vue.h)(
+          "table",
+          {
+            class: `vxe-input--date-${datePanelType}-view`,
+            cellspacing: 0,
+            cellpadding: 0,
+            border: 0
+          },
+          [
+            (0, import_vue.h)("thead", [
+              (0, import_vue.h)(
+                "tr",
+                dateHeaders.map((item) => {
+                  return (0, import_vue.h)("th", item.label);
+                })
+              )
+            ]),
+            (0, import_vue.h)(
+              "tbody",
+              dayDatas.map((rows) => {
+                return (0, import_vue.h)(
+                  "tr",
+                  rows.map((item) => {
+                    return (0, import_vue.h)(
+                      "td",
+                      {
+                        class: {
+                          "is--prev": item.isPrev,
+                          "is--current": item.isCurrent,
+                          "is--now": item.isNow,
+                          "is--next": item.isNext,
+                          "is--disabled": isDateDisabled(item),
+                          "is--selected": multiple ? dateListValue.some((val) => import_xe_utils.default.isDateSame(val, item.date, matchFormat)) : import_xe_utils.default.isDateSame(dateValue, item.date, matchFormat),
+                          "is--hover": import_xe_utils.default.isDateSame(datePanelValue, item.date, matchFormat)
+                        },
+                        onClick: () => dateSelectEvent(item),
+                        onMouseenter: () => dateMouseenterEvent(item)
+                      },
+                      renderDateLabel(item, item.label)
+                    );
+                  })
+                );
+              })
+            )
+          ]
+        )
       ];
     };
     const renderDateWeekTable = () => {
@@ -1968,38 +1988,55 @@ var input_default = (0, import_comp.defineVxeComponent)({
       const dateListValue = computeDateListValue.value;
       const matchFormat = "yyyyMMdd";
       return [
-        (0, import_vue.h)("table", {
-          class: `vxe-input--date-${datePanelType}-view`,
-          cellspacing: 0,
-          cellpadding: 0,
-          border: 0
-        }, [
-          (0, import_vue.h)("thead", [
-            (0, import_vue.h)("tr", weekHeaders.map((item) => {
-              return (0, import_vue.h)("th", item.label);
-            }))
-          ]),
-          (0, import_vue.h)("tbody", weekDates.map((rows) => {
-            const isSelected = multiple ? rows.some((item) => dateListValue.some((val) => import_xe_utils.default.isDateSame(val, item.date, matchFormat))) : rows.some((item) => import_xe_utils.default.isDateSame(dateValue, item.date, matchFormat));
-            const isHover = rows.some((item) => import_xe_utils.default.isDateSame(datePanelValue, item.date, matchFormat));
-            return (0, import_vue.h)("tr", rows.map((item) => {
-              return (0, import_vue.h)("td", {
-                class: {
-                  "is--prev": item.isPrev,
-                  "is--current": item.isCurrent,
-                  "is--now": item.isNow,
-                  "is--next": item.isNext,
-                  "is--disabled": isDateDisabled(item),
-                  "is--selected": isSelected,
-                  "is--hover": isHover
-                },
-                // event
-                onClick: () => dateSelectEvent(item),
-                onMouseenter: () => dateMouseenterEvent(item)
-              }, renderDateLabel(item, item.label));
-            }));
-          }))
-        ])
+        (0, import_vue.h)(
+          "table",
+          {
+            class: `vxe-input--date-${datePanelType}-view`,
+            cellspacing: 0,
+            cellpadding: 0,
+            border: 0
+          },
+          [
+            (0, import_vue.h)("thead", [
+              (0, import_vue.h)(
+                "tr",
+                weekHeaders.map((item) => {
+                  return (0, import_vue.h)("th", item.label);
+                })
+              )
+            ]),
+            (0, import_vue.h)(
+              "tbody",
+              weekDates.map((rows) => {
+                const isSelected = multiple ? rows.some((item) => dateListValue.some((val) => import_xe_utils.default.isDateSame(val, item.date, matchFormat))) : rows.some((item) => import_xe_utils.default.isDateSame(dateValue, item.date, matchFormat));
+                const isHover = rows.some((item) => import_xe_utils.default.isDateSame(datePanelValue, item.date, matchFormat));
+                return (0, import_vue.h)(
+                  "tr",
+                  rows.map((item) => {
+                    return (0, import_vue.h)(
+                      "td",
+                      {
+                        class: {
+                          "is--prev": item.isPrev,
+                          "is--current": item.isCurrent,
+                          "is--now": item.isNow,
+                          "is--next": item.isNext,
+                          "is--disabled": isDateDisabled(item),
+                          "is--selected": isSelected,
+                          "is--hover": isHover
+                        },
+                        // event
+                        onClick: () => dateSelectEvent(item),
+                        onMouseenter: () => dateMouseenterEvent(item)
+                      },
+                      renderDateLabel(item, item.label)
+                    );
+                  })
+                );
+              })
+            )
+          ]
+        )
       ];
     };
     const renderDateMonthTable = () => {
@@ -2010,30 +2047,44 @@ var input_default = (0, import_comp.defineVxeComponent)({
       const dateListValue = computeDateListValue.value;
       const matchFormat = "yyyyMM";
       return [
-        (0, import_vue.h)("table", {
-          class: `vxe-input--date-${datePanelType}-view`,
-          cellspacing: 0,
-          cellpadding: 0,
-          border: 0
-        }, [
-          (0, import_vue.h)("tbody", monthDatas.map((rows) => {
-            return (0, import_vue.h)("tr", rows.map((item) => {
-              return (0, import_vue.h)("td", {
-                class: {
-                  "is--prev": item.isPrev,
-                  "is--current": item.isCurrent,
-                  "is--now": item.isNow,
-                  "is--next": item.isNext,
-                  "is--disabled": isDateDisabled(item),
-                  "is--selected": multiple ? dateListValue.some((val) => import_xe_utils.default.isDateSame(val, item.date, matchFormat)) : import_xe_utils.default.isDateSame(dateValue, item.date, matchFormat),
-                  "is--hover": import_xe_utils.default.isDateSame(datePanelValue, item.date, matchFormat)
-                },
-                onClick: () => dateSelectEvent(item),
-                onMouseenter: () => dateMouseenterEvent(item)
-              }, renderDateLabel(item, (0, import_ui.getI18n)(`vxe.input.date.months.m${item.month}`)));
-            }));
-          }))
-        ])
+        (0, import_vue.h)(
+          "table",
+          {
+            class: `vxe-input--date-${datePanelType}-view`,
+            cellspacing: 0,
+            cellpadding: 0,
+            border: 0
+          },
+          [
+            (0, import_vue.h)(
+              "tbody",
+              monthDatas.map((rows) => {
+                return (0, import_vue.h)(
+                  "tr",
+                  rows.map((item) => {
+                    return (0, import_vue.h)(
+                      "td",
+                      {
+                        class: {
+                          "is--prev": item.isPrev,
+                          "is--current": item.isCurrent,
+                          "is--now": item.isNow,
+                          "is--next": item.isNext,
+                          "is--disabled": isDateDisabled(item),
+                          "is--selected": multiple ? dateListValue.some((val) => import_xe_utils.default.isDateSame(val, item.date, matchFormat)) : import_xe_utils.default.isDateSame(dateValue, item.date, matchFormat),
+                          "is--hover": import_xe_utils.default.isDateSame(datePanelValue, item.date, matchFormat)
+                        },
+                        onClick: () => dateSelectEvent(item),
+                        onMouseenter: () => dateMouseenterEvent(item)
+                      },
+                      renderDateLabel(item, getI18n(`vxe.input.date.months.m${item.month}`))
+                    );
+                  })
+                );
+              })
+            )
+          ]
+        )
       ];
     };
     const renderDateQuarterTable = () => {
@@ -2044,30 +2095,44 @@ var input_default = (0, import_comp.defineVxeComponent)({
       const dateListValue = computeDateListValue.value;
       const matchFormat = "yyyyq";
       return [
-        (0, import_vue.h)("table", {
-          class: `vxe-input--date-${datePanelType}-view`,
-          cellspacing: 0,
-          cellpadding: 0,
-          border: 0
-        }, [
-          (0, import_vue.h)("tbody", quarterDatas.map((rows) => {
-            return (0, import_vue.h)("tr", rows.map((item) => {
-              return (0, import_vue.h)("td", {
-                class: {
-                  "is--prev": item.isPrev,
-                  "is--current": item.isCurrent,
-                  "is--now": item.isNow,
-                  "is--next": item.isNext,
-                  "is--disabled": isDateDisabled(item),
-                  "is--selected": multiple ? dateListValue.some((val) => import_xe_utils.default.isDateSame(val, item.date, matchFormat)) : import_xe_utils.default.isDateSame(dateValue, item.date, matchFormat),
-                  "is--hover": import_xe_utils.default.isDateSame(datePanelValue, item.date, matchFormat)
-                },
-                onClick: () => dateSelectEvent(item),
-                onMouseenter: () => dateMouseenterEvent(item)
-              }, renderDateLabel(item, (0, import_ui.getI18n)(`vxe.input.date.quarters.q${item.quarter}`)));
-            }));
-          }))
-        ])
+        (0, import_vue.h)(
+          "table",
+          {
+            class: `vxe-input--date-${datePanelType}-view`,
+            cellspacing: 0,
+            cellpadding: 0,
+            border: 0
+          },
+          [
+            (0, import_vue.h)(
+              "tbody",
+              quarterDatas.map((rows) => {
+                return (0, import_vue.h)(
+                  "tr",
+                  rows.map((item) => {
+                    return (0, import_vue.h)(
+                      "td",
+                      {
+                        class: {
+                          "is--prev": item.isPrev,
+                          "is--current": item.isCurrent,
+                          "is--now": item.isNow,
+                          "is--next": item.isNext,
+                          "is--disabled": isDateDisabled(item),
+                          "is--selected": multiple ? dateListValue.some((val) => import_xe_utils.default.isDateSame(val, item.date, matchFormat)) : import_xe_utils.default.isDateSame(dateValue, item.date, matchFormat),
+                          "is--hover": import_xe_utils.default.isDateSame(datePanelValue, item.date, matchFormat)
+                        },
+                        onClick: () => dateSelectEvent(item),
+                        onMouseenter: () => dateMouseenterEvent(item)
+                      },
+                      renderDateLabel(item, getI18n(`vxe.input.date.quarters.q${item.quarter}`))
+                    );
+                  })
+                );
+              })
+            )
+          ]
+        )
       ];
     };
     const renderDateYearTable = () => {
@@ -2078,30 +2143,44 @@ var input_default = (0, import_comp.defineVxeComponent)({
       const dateListValue = computeDateListValue.value;
       const matchFormat = "yyyy";
       return [
-        (0, import_vue.h)("table", {
-          class: `vxe-input--date-${datePanelType}-view`,
-          cellspacing: 0,
-          cellpadding: 0,
-          border: 0
-        }, [
-          (0, import_vue.h)("tbody", yearDatas.map((rows) => {
-            return (0, import_vue.h)("tr", rows.map((item) => {
-              return (0, import_vue.h)("td", {
-                class: {
-                  "is--prev": item.isPrev,
-                  "is--current": item.isCurrent,
-                  "is--now": item.isNow,
-                  "is--next": item.isNext,
-                  "is--disabled": isDateDisabled(item),
-                  "is--selected": multiple ? dateListValue.some((val) => import_xe_utils.default.isDateSame(val, item.date, matchFormat)) : import_xe_utils.default.isDateSame(dateValue, item.date, matchFormat),
-                  "is--hover": import_xe_utils.default.isDateSame(datePanelValue, item.date, matchFormat)
-                },
-                onClick: () => dateSelectEvent(item),
-                onMouseenter: () => dateMouseenterEvent(item)
-              }, renderDateLabel(item, item.year));
-            }));
-          }))
-        ])
+        (0, import_vue.h)(
+          "table",
+          {
+            class: `vxe-input--date-${datePanelType}-view`,
+            cellspacing: 0,
+            cellpadding: 0,
+            border: 0
+          },
+          [
+            (0, import_vue.h)(
+              "tbody",
+              yearDatas.map((rows) => {
+                return (0, import_vue.h)(
+                  "tr",
+                  rows.map((item) => {
+                    return (0, import_vue.h)(
+                      "td",
+                      {
+                        class: {
+                          "is--prev": item.isPrev,
+                          "is--current": item.isCurrent,
+                          "is--now": item.isNow,
+                          "is--next": item.isNext,
+                          "is--disabled": isDateDisabled(item),
+                          "is--selected": multiple ? dateListValue.some((val) => import_xe_utils.default.isDateSame(val, item.date, matchFormat)) : import_xe_utils.default.isDateSame(dateValue, item.date, matchFormat),
+                          "is--hover": import_xe_utils.default.isDateSame(datePanelValue, item.date, matchFormat)
+                        },
+                        onClick: () => dateSelectEvent(item),
+                        onMouseenter: () => dateMouseenterEvent(item)
+                      },
+                      renderDateLabel(item, item.year)
+                    );
+                  })
+                );
+              })
+            )
+          ]
+        )
       ];
     };
     const renderDateTable = () => {
@@ -2125,72 +2204,130 @@ var input_default = (0, import_comp.defineVxeComponent)({
       const isDisabledNextDateBtn = computeIsDisabledNextDateBtn.value;
       const selectDatePanelObj = computeSelectDatePanelObj.value;
       return [
-        (0, import_vue.h)("div", {
-          class: "vxe-input--date-picker-header"
-        }, [
-          (0, import_vue.h)("div", {
-            class: "vxe-input--date-picker-type-wrapper"
-          }, [
-            datePanelType === "year" ? (0, import_vue.h)("span", {
-              class: "vxe-input--date-picker-label"
-            }, selectDatePanelObj.y) : (0, import_vue.h)("span", {
-              class: "vxe-input--date-picker-btns"
-            }, [
-              (0, import_vue.h)("span", {
-                class: "vxe-input--date-picker-btn",
-                onClick: dateToggleYearTypeEvent
-              }, selectDatePanelObj.y),
-              selectDatePanelObj.m ? (0, import_vue.h)("span", {
-                class: "vxe-input--date-picker-btn",
-                onClick: dateToggleMonthTypeEvent
-              }, selectDatePanelObj.m) : (0, import_ui.renderEmptyElement)($xeInput)
-            ])
-          ]),
-          (0, import_vue.h)("div", {
-            class: "vxe-input--date-picker-btn-wrapper"
-          }, [
-            (0, import_vue.h)("span", {
-              class: ["vxe-input--date-picker-btn vxe-input--date-picker-prev-btn", {
-                "is--disabled": isDisabledPrevDateBtn
-              }],
-              onClick: datePrevEvent
-            }, [
-              (0, import_vue.h)("i", {
-                class: "vxe-icon-caret-left"
-              })
-            ]),
-            (0, import_vue.h)("span", {
-              class: "vxe-input--date-picker-btn vxe-input--date-picker-current-btn",
-              onClick: dateTodayMonthEvent
-            }, [
-              (0, import_vue.h)("i", {
-                class: "vxe-icon-dot"
-              })
-            ]),
-            (0, import_vue.h)("span", {
-              class: ["vxe-input--date-picker-btn vxe-input--date-picker-next-btn", {
-                "is--disabled": isDisabledNextDateBtn
-              }],
-              onClick: dateNextEvent
-            }, [
-              (0, import_vue.h)("i", {
-                class: "vxe-icon-caret-right"
-              })
-            ]),
-            multiple && computeSupportMultiples.value ? (0, import_vue.h)("span", {
-              class: "vxe-input--date-picker-btn vxe-input--date-picker-confirm-btn"
-            }, [
-              (0, import_vue.h)("button", {
-                class: "vxe-input--date-picker-confirm",
-                type: "button",
-                onClick: dateConfirmEvent
-              }, (0, import_ui.getI18n)("vxe.button.confirm"))
-            ]) : null
-          ])
-        ]),
-        (0, import_vue.h)("div", {
-          class: "vxe-input--date-picker-body"
-        }, renderDateTable())
+        (0, import_vue.h)(
+          "div",
+          {
+            class: "vxe-input--date-picker-header"
+          },
+          [
+            (0, import_vue.h)(
+              "div",
+              {
+                class: "vxe-input--date-picker-type-wrapper"
+              },
+              [
+                datePanelType === "year" ? (0, import_vue.h)(
+                  "span",
+                  {
+                    class: "vxe-input--date-picker-label"
+                  },
+                  selectDatePanelObj.y
+                ) : (0, import_vue.h)(
+                  "span",
+                  {
+                    class: "vxe-input--date-picker-btns"
+                  },
+                  [
+                    (0, import_vue.h)(
+                      "span",
+                      {
+                        class: "vxe-input--date-picker-btn",
+                        onClick: dateToggleYearTypeEvent
+                      },
+                      selectDatePanelObj.y
+                    ),
+                    selectDatePanelObj.m ? (0, import_vue.h)(
+                      "span",
+                      {
+                        class: "vxe-input--date-picker-btn",
+                        onClick: dateToggleMonthTypeEvent
+                      },
+                      selectDatePanelObj.m
+                    ) : renderEmptyElement($xeInput)
+                  ]
+                )
+              ]
+            ),
+            (0, import_vue.h)(
+              "div",
+              {
+                class: "vxe-input--date-picker-btn-wrapper"
+              },
+              [
+                (0, import_vue.h)(
+                  "span",
+                  {
+                    class: [
+                      "vxe-input--date-picker-btn vxe-input--date-picker-prev-btn",
+                      {
+                        "is--disabled": isDisabledPrevDateBtn
+                      }
+                    ],
+                    onClick: datePrevEvent
+                  },
+                  [
+                    (0, import_vue.h)("i", {
+                      class: "vxe-icon-caret-left"
+                    })
+                  ]
+                ),
+                (0, import_vue.h)(
+                  "span",
+                  {
+                    class: "vxe-input--date-picker-btn vxe-input--date-picker-current-btn",
+                    onClick: dateTodayMonthEvent
+                  },
+                  [
+                    (0, import_vue.h)("i", {
+                      class: "vxe-icon-dot"
+                    })
+                  ]
+                ),
+                (0, import_vue.h)(
+                  "span",
+                  {
+                    class: [
+                      "vxe-input--date-picker-btn vxe-input--date-picker-next-btn",
+                      {
+                        "is--disabled": isDisabledNextDateBtn
+                      }
+                    ],
+                    onClick: dateNextEvent
+                  },
+                  [
+                    (0, import_vue.h)("i", {
+                      class: "vxe-icon-caret-right"
+                    })
+                  ]
+                ),
+                multiple && computeSupportMultiples.value ? (0, import_vue.h)(
+                  "span",
+                  {
+                    class: "vxe-input--date-picker-btn vxe-input--date-picker-confirm-btn"
+                  },
+                  [
+                    (0, import_vue.h)(
+                      "button",
+                      {
+                        class: "vxe-input--date-picker-confirm",
+                        type: "button",
+                        onClick: dateConfirmEvent
+                      },
+                      getI18n("vxe.button.confirm")
+                    )
+                  ]
+                ) : null
+              ]
+            )
+          ]
+        ),
+        (0, import_vue.h)(
+          "div",
+          {
+            class: "vxe-input--date-picker-body"
+          },
+          renderDateTable()
+        )
       ];
     };
     const renderTimePanel = () => {
@@ -2202,60 +2339,104 @@ var input_default = (0, import_comp.defineVxeComponent)({
       const hasTimeSecond = computeHasTimeSecond.value;
       const secondList = computeSecondList.value;
       return [
-        (0, import_vue.h)("div", {
-          class: "vxe-input--time-picker-header"
-        }, [
-          hasTimeMinute ? (0, import_vue.h)("span", {
-            class: "vxe-input--time-picker-title"
-          }, dateTimeLabel) : (0, import_vue.createCommentVNode)(),
-          (0, import_vue.h)("div", {
-            class: "vxe-input--time-picker-btn"
-          }, [
-            (0, import_vue.h)("button", {
-              class: "vxe-input--time-picker-confirm",
-              type: "button",
-              onClick: dateConfirmEvent
-            }, (0, import_ui.getI18n)("vxe.button.confirm"))
-          ])
-        ]),
-        (0, import_vue.h)("div", {
-          ref: refInputTimeBody,
-          class: "vxe-input--time-picker-body"
-        }, [
-          (0, import_vue.h)("ul", {
-            class: "vxe-input--time-picker-hour-list"
-          }, hourList.map((item, index) => {
-            return (0, import_vue.h)("li", {
-              key: index,
-              class: {
-                "is--selected": datetimePanelValue && datetimePanelValue.getHours() === item.value
+        (0, import_vue.h)(
+          "div",
+          {
+            class: "vxe-input--time-picker-header"
+          },
+          [
+            hasTimeMinute ? (0, import_vue.h)(
+              "span",
+              {
+                class: "vxe-input--time-picker-title"
+              },
+              dateTimeLabel
+            ) : (0, import_vue.createCommentVNode)(),
+            (0, import_vue.h)(
+              "div",
+              {
+                class: "vxe-input--time-picker-btn"
+              },
+              [
+                (0, import_vue.h)(
+                  "button",
+                  {
+                    class: "vxe-input--time-picker-confirm",
+                    type: "button",
+                    onClick: dateConfirmEvent
+                  },
+                  getI18n("vxe.button.confirm")
+                )
+              ]
+            )
+          ]
+        ),
+        (0, import_vue.h)(
+          "div",
+          {
+            ref: refInputTimeBody,
+            class: "vxe-input--time-picker-body"
+          },
+          [
+            (0, import_vue.h)(
+              "ul",
+              {
+                class: "vxe-input--time-picker-hour-list"
               },
-              onClick: (evnt) => dateHourEvent(evnt, item)
-            }, item.label);
-          })),
-          hasTimeMinute ? (0, import_vue.h)("ul", {
-            class: "vxe-input--time-picker-minute-list"
-          }, minuteList.map((item, index) => {
-            return (0, import_vue.h)("li", {
-              key: index,
-              class: {
-                "is--selected": datetimePanelValue && datetimePanelValue.getMinutes() === item.value
+              hourList.map((item, index) => {
+                return (0, import_vue.h)(
+                  "li",
+                  {
+                    key: index,
+                    class: {
+                      "is--selected": datetimePanelValue && datetimePanelValue.getHours() === item.value
+                    },
+                    onClick: (evnt) => dateHourEvent(evnt, item)
+                  },
+                  item.label
+                );
+              })
+            ),
+            hasTimeMinute ? (0, import_vue.h)(
+              "ul",
+              {
+                class: "vxe-input--time-picker-minute-list"
               },
-              onClick: (evnt) => dateMinuteEvent(evnt, item)
-            }, item.label);
-          })) : (0, import_vue.createCommentVNode)(),
-          hasTimeMinute && hasTimeSecond ? (0, import_vue.h)("ul", {
-            class: "vxe-input--time-picker-second-list"
-          }, secondList.map((item, index) => {
-            return (0, import_vue.h)("li", {
-              key: index,
-              class: {
-                "is--selected": datetimePanelValue && datetimePanelValue.getSeconds() === item.value
+              minuteList.map((item, index) => {
+                return (0, import_vue.h)(
+                  "li",
+                  {
+                    key: index,
+                    class: {
+                      "is--selected": datetimePanelValue && datetimePanelValue.getMinutes() === item.value
+                    },
+                    onClick: (evnt) => dateMinuteEvent(evnt, item)
+                  },
+                  item.label
+                );
+              })
+            ) : (0, import_vue.createCommentVNode)(),
+            hasTimeMinute && hasTimeSecond ? (0, import_vue.h)(
+              "ul",
+              {
+                class: "vxe-input--time-picker-second-list"
               },
-              onClick: (evnt) => dateSecondEvent(evnt, item)
-            }, item.label);
-          })) : (0, import_vue.createCommentVNode)()
-        ])
+              secondList.map((item, index) => {
+                return (0, import_vue.h)(
+                  "li",
+                  {
+                    key: index,
+                    class: {
+                      "is--selected": datetimePanelValue && datetimePanelValue.getSeconds() === item.value
+                    },
+                    onClick: (evnt) => dateSecondEvent(evnt, item)
+                  },
+                  item.label
+                );
+              })
+            ) : (0, import_vue.createCommentVNode)()
+          ]
+        )
       ];
     };
     const renderPanel = () => {
@@ -2268,121 +2449,187 @@ var input_default = (0, import_comp.defineVxeComponent)({
       if (isDatePickerType) {
         if (type === "datetime") {
           renders.push(
-            (0, import_vue.h)("div", {
-              key: type,
-              ref: refPanelWrapper,
-              class: "vxe-input--panel-layout-wrapper"
-            }, [
-              (0, import_vue.h)("div", {
-                class: "vxe-input--panel-left-wrapper"
-              }, renderDatePanel()),
-              (0, import_vue.h)("div", {
-                class: "vxe-input--panel-right-wrapper"
-              }, renderTimePanel())
-            ])
+            (0, import_vue.h)(
+              "div",
+              {
+                key: type,
+                ref: refPanelWrapper,
+                class: "vxe-input--panel-layout-wrapper"
+              },
+              [
+                (0, import_vue.h)(
+                  "div",
+                  {
+                    class: "vxe-input--panel-left-wrapper"
+                  },
+                  renderDatePanel()
+                ),
+                (0, import_vue.h)(
+                  "div",
+                  {
+                    class: "vxe-input--panel-right-wrapper"
+                  },
+                  renderTimePanel()
+                )
+              ]
+            )
           );
         } else if (type === "time") {
           renders.push(
-            (0, import_vue.h)("div", {
-              key: type,
-              ref: refPanelWrapper,
-              class: "vxe-input--panel-wrapper"
-            }, renderTimePanel())
+            (0, import_vue.h)(
+              "div",
+              {
+                key: type,
+                ref: refPanelWrapper,
+                class: "vxe-input--panel-wrapper"
+              },
+              renderTimePanel()
+            )
           );
         } else {
           renders.push(
-            (0, import_vue.h)("div", {
-              key: type || "default",
-              ref: refPanelWrapper,
-              class: "vxe-input--panel-wrapper"
-            }, renderDatePanel())
+            (0, import_vue.h)(
+              "div",
+              {
+                key: type || "default",
+                ref: refPanelWrapper,
+                class: "vxe-input--panel-wrapper"
+              },
+              renderDatePanel()
+            )
           );
         }
-        return (0, import_vue.h)(import_vue.Teleport, {
-          to: "body",
-          disabled: btnTransfer ? !initialized : true
-        }, [
-          (0, import_vue.h)("div", {
-            ref: refInputPanel,
-            class: ["vxe-table--ignore-clear vxe-input--panel", `type--${type}`, {
-              [`size--${vSize}`]: vSize,
-              "is--transfer": btnTransfer,
-              "ani--leave": isAniVisible,
-              "ani--enter": visiblePanel
-            }],
-            placement: panelPlacement,
-            style: panelStyle
-          }, visiblePanel || isAniVisible ? renders : [])
-        ]);
+        return (0, import_vue.h)(
+          import_vue.Teleport,
+          {
+            to: "body",
+            disabled: btnTransfer ? !initialized : true
+          },
+          [
+            (0, import_vue.h)(
+              "div",
+              {
+                ref: refInputPanel,
+                class: [
+                  "vxe-table--ignore-clear vxe-input--panel",
+                  `type--${type}`,
+                  {
+                    [`size--${vSize}`]: vSize,
+                    "is--transfer": btnTransfer,
+                    "ani--leave": isAniVisible,
+                    "ani--enter": visiblePanel
+                  }
+                ],
+                placement: panelPlacement,
+                style: panelStyle
+              },
+              visiblePanel || isAniVisible ? renders : []
+            )
+          ]
+        );
       }
       return (0, import_vue.createCommentVNode)();
     };
     const renderNumberIcon = () => {
       const isDisabledAddNumber = computeIsDisabledAddNumber.value;
       const isDisabledSubtractNumber = computeIsDisabledSubtractNumber.value;
-      return (0, import_vue.h)("div", {
-        class: "vxe-input--control-icon"
-      }, [
-        (0, import_vue.h)("div", {
-          class: "vxe-input--number-icon"
-        }, [
-          (0, import_vue.h)("div", {
-            class: ["vxe-input--number-btn is--prev", {
-              "is--disabled": isDisabledAddNumber
-            }],
-            onMousedown: numberMousedownEvent,
-            onMouseup: numberStopDown,
-            onMouseleave: numberStopDown
-          }, [
-            (0, import_vue.h)("i", {
-              class: (0, import_ui.getIcon)().INPUT_PLUS_NUM
-            })
-          ]),
-          (0, import_vue.h)("div", {
-            class: ["vxe-input--number-btn is--next", {
-              "is--disabled": isDisabledSubtractNumber
-            }],
-            onMousedown: numberMousedownEvent,
-            onMouseup: numberStopDown,
-            onMouseleave: numberStopDown
-          }, [
-            (0, import_vue.h)("i", {
-              class: (0, import_ui.getIcon)().INPUT_MINUS_NUM
-            })
-          ])
-        ])
-      ]);
+      return (0, import_vue.h)(
+        "div",
+        {
+          class: "vxe-input--control-icon"
+        },
+        [
+          (0, import_vue.h)(
+            "div",
+            {
+              class: "vxe-input--number-icon"
+            },
+            [
+              (0, import_vue.h)(
+                "div",
+                {
+                  class: [
+                    "vxe-input--number-btn is--prev",
+                    {
+                      "is--disabled": isDisabledAddNumber
+                    }
+                  ],
+                  onMousedown: numberMousedownEvent,
+                  onMouseup: numberStopDown,
+                  onMouseleave: numberStopDown
+                },
+                [
+                  (0, import_vue.h)("i", {
+                    class: getIcon().INPUT_PLUS_NUM
+                  })
+                ]
+              ),
+              (0, import_vue.h)(
+                "div",
+                {
+                  class: [
+                    "vxe-input--number-btn is--next",
+                    {
+                      "is--disabled": isDisabledSubtractNumber
+                    }
+                  ],
+                  onMousedown: numberMousedownEvent,
+                  onMouseup: numberStopDown,
+                  onMouseleave: numberStopDown
+                },
+                [
+                  (0, import_vue.h)("i", {
+                    class: getIcon().INPUT_MINUS_NUM
+                  })
+                ]
+              )
+            ]
+          )
+        ]
+      );
     };
     const renderDatePickerIcon = () => {
-      return (0, import_vue.h)("div", {
-        class: "vxe-input--control-icon",
-        onClick: datePickerOpenEvent
-      }, [
-        (0, import_vue.h)("i", {
-          class: ["vxe-input--date-picker-icon", (0, import_ui.getIcon)().DATE_PICKER_DATE]
-        })
-      ]);
+      return (0, import_vue.h)(
+        "div",
+        {
+          class: "vxe-input--control-icon",
+          onClick: datePickerOpenEvent
+        },
+        [
+          (0, import_vue.h)("i", {
+            class: ["vxe-input--date-picker-icon", getIcon().DATE_PICKER_DATE]
+          })
+        ]
+      );
     };
     const renderSearchIcon = () => {
-      return (0, import_vue.h)("div", {
-        class: "vxe-input--control-icon",
-        onClick: searchEvent
-      }, [
-        (0, import_vue.h)("i", {
-          class: ["vxe-input--search-icon", (0, import_ui.getIcon)().INPUT_SEARCH]
-        })
-      ]);
+      return (0, import_vue.h)(
+        "div",
+        {
+          class: "vxe-input--control-icon",
+          onClick: searchEvent
+        },
+        [
+          (0, import_vue.h)("i", {
+            class: ["vxe-input--search-icon", getIcon().INPUT_SEARCH]
+          })
+        ]
+      );
     };
     const renderPasswordIcon = () => {
       const { showPwd } = reactData;
-      return (0, import_vue.h)("div", {
-        class: "vxe-input--control-icon",
-        onClick: passwordToggleEvent
-      }, [
-        (0, import_vue.h)("i", {
-          class: ["vxe-input--password-icon", showPwd ? (0, import_ui.getIcon)().PASSWORD_INPUT_SHOW_PWD : (0, import_ui.getIcon)().PASSWORD_INPUT_HIDE_PWD]
-        })
-      ]);
+      return (0, import_vue.h)(
+        "div",
+        {
+          class: "vxe-input--control-icon",
+          onClick: passwordToggleEvent
+        },
+        [
+          (0, import_vue.h)("i", {
+            class: ["vxe-input--password-icon", showPwd ? getIcon().PASSWORD_INPUT_SHOW_PWD : getIcon().PASSWORD_INPUT_HIDE_PWD]
+          })
+        ]
+      );
     };
     const renderPrefixIcon = () => {
       const { prefixIcon } = props;
@@ -2390,21 +2637,33 @@ var input_default = (0, import_comp.defineVxeComponent)({
       const prefixSlot = slots.prefix;
       const preIcon = prefixIcon || prefixOpts.icon;
       const sufContent = prefixOpts.content;
-      return prefixSlot || preIcon || sufContent ? (0, import_vue.h)("div", {
-        class: "vxe-input--prefix",
-        onClick: clickPrefixEvent
-      }, [
-        (0, import_vue.h)("div", {
-          class: "vxe-input--prefix-icon"
-        }, prefixSlot ? (0, import_vn.getSlotVNs)(prefixSlot({})) : [
-          preIcon ? (0, import_vue.h)("i", {
-            class: preIcon
-          }) : (0, import_ui.renderEmptyElement)($xeInput),
-          sufContent ? (0, import_vue.h)("span", {
-            class: "vxe-input--prefix-text"
-          }, `${sufContent}`) : (0, import_ui.renderEmptyElement)($xeInput)
-        ])
-      ]) : (0, import_ui.renderEmptyElement)($xeInput);
+      return prefixSlot || preIcon || sufContent ? (0, import_vue.h)(
+        "div",
+        {
+          class: "vxe-input--prefix",
+          onClick: clickPrefixEvent
+        },
+        [
+          (0, import_vue.h)(
+            "div",
+            {
+              class: "vxe-input--prefix-icon"
+            },
+            prefixSlot ? (0, import_vn.getSlotVNs)(prefixSlot({})) : [
+              preIcon ? (0, import_vue.h)("i", {
+                class: preIcon
+              }) : renderEmptyElement($xeInput),
+              sufContent ? (0, import_vue.h)(
+                "span",
+                {
+                  class: "vxe-input--prefix-text"
+                },
+                `${sufContent}`
+              ) : renderEmptyElement($xeInput)
+            ]
+          )
+        ]
+      ) : renderEmptyElement($xeInput);
     };
     const renderSuffixIcon = () => {
       const { suffixIcon } = props;
@@ -2420,32 +2679,51 @@ var input_default = (0, import_comp.defineVxeComponent)({
       const isExtraBtn = isPawdType || isNumType || isDatePickerType || isSearchType;
       const sufIcon = suffixIcon || suffixOpts.icon;
       const sufContent = suffixOpts.content;
-      return isClearable || suffixSlot || sufIcon || sufContent || isExtraBtn ? (0, import_vue.h)("div", {
-        class: ["vxe-input--suffix", {
-          "is--clear": isClearable && !isDisabled && !(inputValue === "" || import_xe_utils.default.eqNull(inputValue))
-        }]
-      }, [
-        isClearable ? (0, import_vue.h)("div", {
-          class: "vxe-input--clear-icon",
-          onClick: clearValueEvent
-        }, [
-          (0, import_vue.h)("i", {
-            class: (0, import_ui.getIcon)().INPUT_CLEAR
-          })
-        ]) : (0, import_ui.renderEmptyElement)($xeInput),
-        isExtraBtn ? renderExtraSuffixIcon() : (0, import_ui.renderEmptyElement)($xeInput),
-        suffixSlot || sufIcon || sufContent ? (0, import_vue.h)("div", {
-          class: "vxe-input--suffix-icon",
-          onClick: clickSuffixEvent
-        }, suffixSlot ? (0, import_vn.getSlotVNs)(suffixSlot({})) : [
-          sufIcon ? (0, import_vue.h)("i", {
-            class: sufIcon
-          }) : (0, import_ui.renderEmptyElement)($xeInput),
-          sufContent ? (0, import_vue.h)("span", {
-            class: "vxe-input--suffix-text"
-          }, `${sufContent}`) : (0, import_ui.renderEmptyElement)($xeInput)
-        ]) : (0, import_ui.renderEmptyElement)($xeInput)
-      ]) : (0, import_ui.renderEmptyElement)($xeInput);
+      return isClearable || suffixSlot || sufIcon || sufContent || isExtraBtn ? (0, import_vue.h)(
+        "div",
+        {
+          class: [
+            "vxe-input--suffix",
+            {
+              "is--clear": isClearable && !isDisabled && !(inputValue === "" || import_xe_utils.default.eqNull(inputValue))
+            }
+          ]
+        },
+        [
+          isClearable ? (0, import_vue.h)(
+            "div",
+            {
+              class: "vxe-input--clear-icon",
+              onClick: clearValueEvent
+            },
+            [
+              (0, import_vue.h)("i", {
+                class: getIcon().INPUT_CLEAR
+              })
+            ]
+          ) : renderEmptyElement($xeInput),
+          isExtraBtn ? renderExtraSuffixIcon() : renderEmptyElement($xeInput),
+          suffixSlot || sufIcon || sufContent ? (0, import_vue.h)(
+            "div",
+            {
+              class: "vxe-input--suffix-icon",
+              onClick: clickSuffixEvent
+            },
+            suffixSlot ? (0, import_vn.getSlotVNs)(suffixSlot({})) : [
+              sufIcon ? (0, import_vue.h)("i", {
+                class: sufIcon
+              }) : renderEmptyElement($xeInput),
+              sufContent ? (0, import_vue.h)(
+                "span",
+                {
+                  class: "vxe-input--suffix-text"
+                },
+                `${sufContent}`
+              ) : renderEmptyElement($xeInput)
+            ]
+          ) : renderEmptyElement($xeInput)
+        ]
+      ) : renderEmptyElement($xeInput);
     };
     const renderExtraSuffixIcon = () => {
       const { controls } = props;
@@ -2476,10 +2754,14 @@ var input_default = (0, import_comp.defineVxeComponent)({
       const isDisabled = computeIsDisabled.value;
       const formReadonly = computeFormReadonly.value;
       if (formReadonly) {
-        return (0, import_vue.h)("div", {
-          ref: refElem,
-          class: ["vxe-input--readonly", `type--${type}`, className]
-        }, inputValue);
+        return (0, import_vue.h)(
+          "div",
+          {
+            ref: refElem,
+            class: ["vxe-input--readonly", `type--${type}`, className]
+          },
+          inputValue
+        );
       }
       const currStyle = computeCurrStyle.value;
       const isCountError = computeIsCountError.value;
@@ -2493,78 +2775,109 @@ var input_default = (0, import_comp.defineVxeComponent)({
       const prefix = renderPrefixIcon();
       const suffix = renderSuffixIcon();
       const floatSlot = slots.float;
-      return (0, import_vue.h)("div", {
-        ref: refElem,
-        class: ["vxe-input", `type--${type}`, floatContent ? `fla--${floatAlign || "center"}` : "", className, {
-          [`size--${vSize}`]: vSize,
-          [`is--${align}`]: align,
-          "is--controls": controls,
-          "is--prefix": !!prefix,
-          "is--suffix": !!suffix,
-          "is--visible": visiblePanel,
-          "is--clear": isClearable,
-          "is--count": isWordCount,
-          "is--disabled": isDisabled,
-          "is--active": isActivated,
-          "show--clear": isClearable && !isDisabled && !(inputValue === "" || import_xe_utils.default.eqNull(inputValue))
-        }],
-        style: currStyle,
-        spellcheck: false
-      }, [
-        prefix || (0, import_vue.createCommentVNode)(),
-        (0, import_vue.h)("div", {
-          class: "vxe-input--wrapper",
-          title: title || null
-        }, [
-          (0, import_vue.h)("input", {
-            ref: refInputTarget,
-            class: "vxe-input--inner" + (inputClassName ? " " + inputClassName : ""),
-            name,
-            type: inputType,
-            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
-          }),
-          floatContent || floatSlot ? (0, import_vue.h)("span", {
-            class: "vxe-input--float-wrapper"
-          }, floatSlot ? floatSlot({}) : (0, import_utils.getText)(floatContent)) : (0, import_ui.renderEmptyElement)($xeInput)
-        ]),
-        suffix || (0, import_vue.createCommentVNode)(),
-        // 下拉面板
-        renderPanel(),
-        // 字数统计
-        isWordCount ? (0, import_vue.h)("span", {
-          class: ["vxe-input--count", {
-            "is--error": isCountError
-          }]
-        }, countMethod ? `${countMethod({ value: inputValue })}` : `${inputCount}${inpMaxLength ? `/${inpMaxLength}` : ""}`) : (0, import_vue.createCommentVNode)()
-      ]);
-    };
-    (0, import_vue.watch)(() => props.modelValue, (val) => {
-      reactData.inputValue = val;
-      changeValue();
-    });
-    (0, import_vue.watch)(() => props.type, () => {
-      Object.assign(reactData, {
-        inputValue: props.modelValue,
-        datetimePanelValue: null,
-        datePanelValue: null,
-        datePanelLabel: "",
-        datePanelType: "day",
-        selectMonth: null,
-        currentDate: null
-      });
-      initValue();
-    });
+      return (0, import_vue.h)(
+        "div",
+        {
+          ref: refElem,
+          class: [
+            "vxe-input",
+            `type--${type}`,
+            floatContent ? `fla--${floatAlign || "center"}` : "",
+            className,
+            {
+              [`size--${vSize}`]: vSize,
+              [`is--${align}`]: align,
+              "is--controls": controls,
+              "is--prefix": !!prefix,
+              "is--suffix": !!suffix,
+              "is--visible": visiblePanel,
+              "is--clear": isClearable,
+              "is--count": isWordCount,
+              "is--disabled": isDisabled,
+              "is--active": isActivated,
+              "show--clear": isClearable && !isDisabled && !(inputValue === "" || import_xe_utils.default.eqNull(inputValue))
+            }
+          ],
+          style: currStyle,
+          spellcheck: false
+        },
+        [
+          prefix || (0, import_vue.createCommentVNode)(),
+          (0, import_vue.h)(
+            "div",
+            {
+              class: "vxe-input--wrapper",
+              title: title || null
+            },
+            [
+              (0, import_vue.h)("input", {
+                ref: refInputTarget,
+                class: ["vxe-input--inner", inputClassName || ""],
+                name,
+                type: inputType,
+                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
+              }),
+              floatContent || floatSlot ? (0, import_vue.h)(
+                "span",
+                {
+                  class: "vxe-input--float-wrapper"
+                },
+                floatSlot ? floatSlot({}) : (0, import_utils.getText)(floatContent)
+              ) : renderEmptyElement($xeInput)
+            ]
+          ),
+          suffix || (0, import_vue.createCommentVNode)(),
+          // 下拉面板
+          renderPanel(),
+          // 字数统计
+          isWordCount ? (0, import_vue.h)(
+            "span",
+            {
+              class: [
+                "vxe-input--count",
+                {
+                  "is--error": isCountError
+                }
+              ]
+            },
+            countMethod ? `${countMethod({ value: inputValue })}` : `${inputCount}${inpMaxLength ? `/${inpMaxLength}` : ""}`
+          ) : (0, import_vue.createCommentVNode)()
+        ]
+      );
+    };
+    (0, import_vue.watch)(
+      () => props.modelValue,
+      (val) => {
+        reactData.inputValue = val;
+        changeValue();
+      }
+    );
+    (0, import_vue.watch)(
+      () => props.type,
+      () => {
+        Object.assign(reactData, {
+          inputValue: props.modelValue,
+          datetimePanelValue: null,
+          datePanelValue: null,
+          datePanelLabel: "",
+          datePanelType: "day",
+          selectMonth: null,
+          currentDate: null
+        });
+        initValue();
+      }
+    );
     (0, import_vue.watch)(computeDateLabelFormat, () => {
       const isDatePickerType = computeIsDatePickerType.value;
       if (isDatePickerType) {
@@ -2598,10 +2911,10 @@ var input_default = (0, import_comp.defineVxeComponent)({
       if (inputElem) {
         inputElem.addEventListener("wheel", wheelEvent, { passive: false });
       }
-      import_ui.globalEvents.on($xeInput, "mousewheel", handleGlobalMousewheelEvent);
-      import_ui.globalEvents.on($xeInput, "mousedown", handleGlobalMousedownEvent);
-      import_ui.globalEvents.on($xeInput, "keydown", handleGlobalKeydownEvent);
-      import_ui.globalEvents.on($xeInput, "blur", handleGlobalBlurEvent);
+      globalEvents.on($xeInput, "mousewheel", handleGlobalMousewheelEvent);
+      globalEvents.on($xeInput, "mousedown", handleGlobalMousedownEvent);
+      globalEvents.on($xeInput, "keydown", handleGlobalKeydownEvent);
+      globalEvents.on($xeInput, "blur", handleGlobalBlurEvent);
       updateDomValue();
     });
     (0, import_vue.onBeforeUnmount)(() => {
@@ -2611,10 +2924,10 @@ var input_default = (0, import_comp.defineVxeComponent)({
       if (inputElem) {
         inputElem.removeEventListener("wheel", wheelEvent);
       }
-      import_ui.globalEvents.off($xeInput, "mousewheel");
-      import_ui.globalEvents.off($xeInput, "mousedown");
-      import_ui.globalEvents.off($xeInput, "keydown");
-      import_ui.globalEvents.off($xeInput, "blur");
+      globalEvents.off($xeInput, "mousewheel");
+      globalEvents.off($xeInput, "mousedown");
+      globalEvents.off($xeInput, "keydown");
+      globalEvents.off($xeInput, "blur");
     });
     initValue();
     $xeInput.renderVN = renderVN;