bkui-vue 0.0.2-beta.98 → 0.0.2-modal-refactor.1

package/lib/date-picker/index.js

@@ -170,7 +170,7 @@ function _toConsumableArray(arr) {
 ;// CONCATENATED MODULE: external "vue"
 var external_vue_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
 var external_vue_y = x => () => x
-const external_vue_namespaceObject = external_vue_x({ ["Teleport"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.Teleport, ["Transition"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.Transition, ["computed"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.computed, ["createVNode"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.createVNode, ["defineComponent"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.defineComponent, ["getCurrentInstance"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.getCurrentInstance, ["inject"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.inject, ["nextTick"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.nextTick, ["onBeforeUnmount"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.onBeforeUnmount, ["onMounted"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.onMounted, ["provide"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.provide, ["reactive"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.reactive, ["ref"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.ref, ["resolveDirective"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.resolveDirective, ["toRefs"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.toRefs, ["vShow"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.vShow, ["watch"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.watch, ["withDirectives"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.withDirectives });
+const external_vue_namespaceObject = external_vue_x({ ["Fragment"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.Fragment, ["Teleport"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.Teleport, ["Transition"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.Transition, ["computed"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.computed, ["createVNode"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.createVNode, ["defineComponent"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.defineComponent, ["getCurrentInstance"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.getCurrentInstance, ["inject"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.inject, ["nextTick"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.nextTick, ["onBeforeUnmount"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.onBeforeUnmount, ["onMounted"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.onMounted, ["provide"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.provide, ["reactive"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.reactive, ["ref"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.ref, ["resolveDirective"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.resolveDirective, ["toRefs"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.toRefs, ["vShow"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.vShow, ["watch"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.watch, ["withDirectives"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.withDirectives });
 ;// CONCATENATED MODULE: external "../config-provider"
 var external_config_provider_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
 var external_config_provider_y = x => () => x
@@ -435,6 +435,79 @@ var pickerDropdownProps = {
     }, [(_this$$slots$default = (_this$$slots$default2 = (_this$$slots = this.$slots)["default"]) === null || _this$$slots$default2 === void 0 ? void 0 : _this$$slots$default2.call(_this$$slots)) !== null && _this$$slots$default !== void 0 ? _this$$slots$default : '']);
   }
 }));
+;// CONCATENATED MODULE: ../../packages/date-picker/src/common.tsx
+
+/*
+ * Tencent is pleased to support the open source community by making
+ * 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition) available.
+ *
+ * Copyright (C) 2021 THL A29 Limited, a Tencent company.  All rights reserved.
+ *
+ * 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition) is licensed under the MIT License.
+ *
+ * License for 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition):
+ *
+ * ---------------------------------------------------
+ * Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated
+ * documentation files (the "Software"), to deal in the Software without restriction, including without limitation
+ * the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and
+ * to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all copies or substantial portions of
+ * the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO
+ * THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF
+ * CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
+ * IN THE SOFTWARE.
+ */
+var dateIcon = (0,external_vue_namespaceObject.createVNode)(external_vue_namespaceObject.Fragment, null, [(0,external_vue_namespaceObject.createVNode)("svg", {
+  "class": "picker-icon",
+  "x": "0px",
+  "y": "0px",
+  "viewBox": "0 0 1024 1024"
+}, [(0,external_vue_namespaceObject.createVNode)("g", {
+  "id": "date"
+}, [(0,external_vue_namespaceObject.createVNode)("path", {
+  "fill": "#c4c6cc",
+  "d": "M896,128h-96v64h64v112H160V192h64v-64h-96c-17.7,0-32,14.3-32,32v736c0,17.7,14.3,32,32,32h768c17.7,0,32-14.3,32-32V160C928,142.3,913.7,128,896,128z M160,864V368h704v496H160z"
+}, null), (0,external_vue_namespaceObject.createVNode)("rect", {
+  "x": "416",
+  "y": "128",
+  "fill": "#c4c6cc",
+  "width": "192",
+  "height": "64"
+}, null), (0,external_vue_namespaceObject.createVNode)("rect", {
+  "x": "288",
+  "y": "96",
+  "fill": "#c4c6cc",
+  "width": "64",
+  "height": "128"
+}, null), (0,external_vue_namespaceObject.createVNode)("rect", {
+  "x": "672",
+  "y": "96",
+  "fill": "#c4c6cc",
+  "width": "64",
+  "height": "128"
+}, null), (0,external_vue_namespaceObject.createVNode)("polygon", {
+  "fill": "#c4c6cc",
+  "points": "403.7,514.4 557.1,514.4 557.1,515.3 420.1,765.5 483.5,765.5 620.3,504.3 620.3,466.5 403.7,466.5"
+}, null)])])]);
+var timeIcon = (0,external_vue_namespaceObject.createVNode)(external_vue_namespaceObject.Fragment, null, [(0,external_vue_namespaceObject.createVNode)("svg", {
+  "class": "picker-icon",
+  "x": "0px",
+  "y": "0px",
+  "viewBox": "0 0 1024 1024"
+}, [(0,external_vue_namespaceObject.createVNode)("g", {
+  "id": "time"
+}, [(0,external_vue_namespaceObject.createVNode)("path", {
+  "fill": "#c4c6cc",
+  "d": "M512,128c51.9,0,102.2,10.1,149.5,30.2c45.7,19.3,86.8,47,122.1,82.3s63,76.4,82.3,122.1c20,47.3,30.2,97.6,30.2,149.5S886,614.3,865.9,661.6c-19.3,45.7-47,86.8-82.3,122.1s-76.4,63-122.1,82.3c-47.3,20-97.6,30.2-149.5,30.2S409.8,886.1,362.5,866c-45.7-19.3-86.8-47-122.1-82.3s-63-76.4-82.3-122.1c-20-47.3-30.2-97.6-30.2-149.5s10.1-102.2,30.2-149.5c19.3-45.7,47-86.8,82.3-122.1s76.4-63,122.1-82.3C409.8,138.1,460.1,128,512,128 M512,64C264.6,64,64,264.6,64,512s200.6,448,448,448s448-200.6,448-448S759.4,64,512,64L512,64z"
+}, null), (0,external_vue_namespaceObject.createVNode)("polygon", {
+  "fill": "#c4c6cc",
+  "points": "512,512 512,256 448,256 448,512 448,576 512,576 768,576 768,512"
+}, null)])])]);
 ;// CONCATENATED MODULE: external "../button"
 var external_button_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
 var external_button_y = x => () => x
@@ -2303,20 +2376,22 @@ var timeParts = ['hours', 'minutes', 'seconds'];
       var bindFunction = function bindFunction(type) {
         var domRef = getDomRef(type);
         domRef.addEventListener('wheel', (0,debounce_namespaceObject["default"])(function () {
+          // handleWheel(type);
           if (wheelStart.value === true) {
             // console.log('滚动了');
             wheelStart.value = false;
             wheelEnd.value = true;
             // 这里写开始滚动时调用的方法
-            handleWheel(type);
             wheelTimer.value = setTimeout(function () {
+              handleWheel(type);
               stopWheel(domRef);
-            }, 400);
+            }, 200);
           } else {
-            clearTimeout(wheelTimer);
+            clearTimeout(wheelTimer.value);
             wheelTimer.value = setTimeout(function () {
+              handleWheel(type);
               stopWheel(domRef);
-            }, 400);
+            }, 300);
           }
         }, 32), {
           passive: true
@@ -2545,6 +2620,17 @@ var timeProps = {
   confirm: {
     type: Boolean,
     "default": false
+  },
+  selectionMode: {
+    type: String,
+    "default": 'date',
+    validator: function validator(v) {
+      if (['year', 'month', 'date', 'time'].indexOf(v) < 0) {
+        console.error("selectionMode property is not valid: '".concat(v, "'"));
+        return false;
+      }
+      return true;
+    }
   }
 };
 // function injectStrict<T>(key: InjectionKey<T>, fallback?: T) {
@@ -2640,7 +2726,8 @@ var timeProps = {
         return newDate["set".concat((0,external_shared_namespaceObject.capitalize)(type))](date[type]);
       });
       if (isEmit) {
-        emit('pick', newDate, true, 'time');
+        // pick 参数：dates, visible, type, isUseShortCut
+        emit('pick', newDate, true, props.selectionMode);
       }
     }
     function handlePickClick() {
@@ -2859,7 +2946,10 @@ var datePanelProps = {
         state.pickerTable = getTableType(state.currentView);
       }
     };
-    var handlePick = function handlePick(value, type) {
+    var handlePick = function handlePick(value) {
+      var _visible = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+      var type = arguments.length > 2 ? arguments[2] : undefined;
+      var _shortcut = arguments.length > 3 ? arguments[3] : undefined;
       var val = value;
       if (props.selectionMode === 'year') {
         val = new Date(value.getFullYear(), 0, 1);
@@ -2869,6 +2959,7 @@ var datePanelProps = {
         val = new Date(value);
       }
       state.dates = [val];
+      // pick 参数：dates, visible, type, isUseShortCut
       emit('pick', val, false, type || props.selectionMode);
     };
     var handlePickSuccess = function handlePickSuccess() {
@@ -2882,7 +2973,7 @@ var datePanelProps = {
     var handleShortcutClick = function handleShortcutClick(shortcut) {
       if (shortcut.value) {
         // pick 参数：dates, visible, type, isUseShortCut
-        emit('pick', shortcut.value(), false, undefined, shortcut);
+        emit('pick', shortcut.value(), false, props.selectionMode, shortcut);
       }
       if (shortcut.onClick) {
         shortcut.onClick(_this);
@@ -3097,6 +3188,7 @@ var datePanelProps = {
       "ref": "timePickerRef",
       "value": this.dates,
       "format": this.format,
+      "selectionMode": this.selectionMode,
       "disabledDate": this.disabledDate,
       "onPick": this.handlePick,
       "onPick-click": this.handlePickClick,
@@ -3173,6 +3265,17 @@ var timeRangeProps = {
   allowCrossDay: {
     type: Boolean,
     "default": false
+  },
+  selectionMode: {
+    type: String,
+    "default": 'date',
+    validator: function validator(v) {
+      if (['year', 'month', 'date', 'time'].indexOf(v) < 0) {
+        console.error("selectionMode property is not valid: '".concat(v, "'"));
+        return false;
+      }
+      return true;
+    }
   }
 };
 /* harmony default export */ const time_range = ((0,external_vue_namespaceObject.defineComponent)({
@@ -3195,10 +3298,10 @@ var timeRangeProps = {
       return !(props.format || '').match(/mm$/);
     });
     var leftDatePanelLabel = (0,external_vue_namespaceObject.computed)(function () {
-      return src_fecha.format(parentProvide.dates[0], props.format);
+      return src_fecha.format(dateStart, props.format);
     });
     var rightDatePanelLabel = (0,external_vue_namespaceObject.computed)(function () {
-      return src_fecha.format(parentProvide.dates[1], props.format);
+      return src_fecha.format(dateEnd, props.format);
     });
     (0,external_vue_namespaceObject.watch)(function () {
       return props.value;
@@ -3211,7 +3314,7 @@ var timeRangeProps = {
       state.dateEnd = dateEnd || initTime();
     });
     (0,external_vue_namespaceObject.onMounted)(function () {
-      if (parentProvide && parentProvide.parentName === 'DatePanel') {
+      if (parentProvide && (parentProvide.parentName === 'DatePanel' || parentProvide.parentName === 'DateRangePanel')) {
         state.showDate = true;
       }
     });
@@ -3283,7 +3386,8 @@ var timeRangeProps = {
         }
       }
       if (isEmit) {
-        emit('pick', [dateStart, dateEnd], true, 'time');
+        // pick 参数：dates, visible, type, isUseShortCut
+        emit('pick', [dateStart, dateEnd], true, props.selectionMode);
       }
     }
     function handleStartChange(date) {
@@ -3648,6 +3752,7 @@ var dateRangePanelProps = {
      * handleConfirm
      */
     var handleConfirm = function handleConfirm(visible, type) {
+      // pick 参数：dates, visible, type, isUseShortCut
       emit('pick', state.dates, visible, type || props.type);
     };
     /**
@@ -3678,7 +3783,7 @@ var dateRangePanelProps = {
             selecting: false
           };
         }
-        handleConfirm(false, type || 'date');
+        handleConfirm(false, type || props.selectionMode);
       } else {
         state.upToNowEnable = new Date(val).getTime() < new Date().getTime();
         state.rangeState = {
@@ -3724,6 +3829,7 @@ var dateRangePanelProps = {
       state.rangeState.to = to;
       state.dates = [form, to];
       state.selectedIndex = index;
+      // pick 参数：dates, visible, type, isUseShortCut
       emit('pick', value, false, 'shortcut', shortcut);
       if (props.shortcutClose) {
         emit('pick-success');
@@ -4077,6 +4183,7 @@ var dateRangePanelProps = {
       }
     }() : '']), [[external_vue_namespaceObject.vShow, !this.isTime]]), this.isTime ? (0,external_vue_namespaceObject.createVNode)(time_range, {
       "ref": "timePickerRef",
+      "selectionMode": this.selectionMode,
       "value": this.dates,
       "format": this.format,
       "disabledDate": this.disabledDate,
@@ -4139,6 +4246,7 @@ function date_picker_objectSpread(target) { for (var i = 1; i < arguments.length
 
 
 
+
 /* harmony default export */ const date_picker = ((0,external_vue_namespaceObject.defineComponent)({
   name: 'DatePicker',
   directives: {
@@ -4160,7 +4268,8 @@ function date_picker_objectSpread(target) { for (var i = 1; i < arguments.length
     if (props.shortcutSelectedIndex !== -1) {
       shortcut = props.shortcuts[props.shortcutSelectedIndex] || null;
       if (shortcut) {
-        initialValue = shortcut.value();
+        var v = shortcut.value();
+        initialValue = Array.isArray(v) ? v : [v];
       }
     }
     var _usePrefix = (0,external_config_provider_namespaceObject.usePrefix)(),
@@ -4185,7 +4294,9 @@ function date_picker_objectSpread(target) { for (var i = 1; i < arguments.length
       internalFocus: false,
       timeEnterMode: true,
       shortcut: shortcut,
-      onSelectionModeChange: onSelectionModeChange
+      onSelectionModeChange: onSelectionModeChange,
+      // for 编辑时，mouseleave 事件中缓存的 value
+      tmpValue: initialValue
     });
     onSelectionModeChange(props.type);
     function onSelectionModeChange(_type) {
@@ -4339,6 +4450,11 @@ function date_picker_objectSpread(target) { for (var i = 1; i < arguments.length
         emit('input', now);
       }
     });
+    (0,external_vue_namespaceObject.watch)(function () {
+      return state.internalValue;
+    }, function (v) {
+      state.tmpValue = v;
+    });
     (0,external_vue_namespaceObject.onMounted)(function () {
       // 如果是 date-picker 那么 time-picker 就是回车模式
       if (props.type.indexOf('date') > -1) {
@@ -4401,12 +4517,14 @@ function date_picker_objectSpread(target) { for (var i = 1; i < arguments.length
       if (visualValue !== null && visualValue !== void 0 && visualValue.value) {
         state.showClose = true;
       }
+      state.internalValue = state.tmpValue;
     };
     var handleInputMouseleave = function handleInputMouseleave(_e) {
       // if (e.toElement?.classList.contains('clear-action')) {
       //   return;
       // }
       state.showClose = false;
+      state.internalValue = state.tmpValue;
     };
     var emitChange = function emitChange(type) {
       (0,external_vue_namespaceObject.nextTick)(function () {
@@ -4439,6 +4557,21 @@ function date_picker_objectSpread(target) { for (var i = 1; i < arguments.length
         state.forceInputRerender = state.forceInputRerender + 1;
       }
     };
+    var handleInputInput = function handleInputInput(e) {
+      var _props$disabledDate2;
+      var isArrayValue = props.type.includes('range') || props.multiple;
+      var oldValue = visualValue.value;
+      var newValue = e.target.value;
+      var newDate = parseDate(newValue, props.type, props.multiple, props.format);
+      var valueToTest = isArrayValue ? newDate : newDate[0];
+      var isDisabled = (_props$disabledDate2 = props.disabledDate) === null || _props$disabledDate2 === void 0 ? void 0 : _props$disabledDate2.call(props, valueToTest);
+      var isValidDate = newDate.reduce(function (valid, date) {
+        return valid && date instanceof Date;
+      }, true);
+      if (newValue !== oldValue && !isDisabled && isValidDate) {
+        state.tmpValue = newDate;
+      }
+    };
     var handleFocus = function handleFocus(e) {
       if (props.readonly) {
         return;
@@ -4584,8 +4717,8 @@ function date_picker_objectSpread(target) { for (var i = 1; i < arguments.length
       if (state.internalValue[0]) {
         // state.focusedDate = state.internalValue[0];
         var _state$internalValue = _slicedToArray(state.internalValue, 1),
-          v = _state$internalValue[0];
-        state.focusedDate = v;
+          _v = _state$internalValue[0];
+        state.focusedDate = _v;
       }
       state.focusedTime = date_picker_objectSpread(date_picker_objectSpread({}, state.focusedTime), {}, {
         time: state.internalValue.map(extractTime)
@@ -4642,6 +4775,7 @@ function date_picker_objectSpread(target) { for (var i = 1; i < arguments.length
       handleBlur: handleBlur,
       handleKeydown: handleKeydown,
       handleInputChange: handleInputChange,
+      handleInputInput: handleInputInput,
       handleClear: handleClear,
       onPick: onPick,
       onPickSuccess: onPickSuccess,
@@ -4664,51 +4798,7 @@ function date_picker_objectSpread(target) { for (var i = 1; i < arguments.length
     var defaultTrigger = (0,external_vue_namespaceObject.createVNode)("div", null, [(0,external_vue_namespaceObject.createVNode)("span", {
       "class": ['icon-wrapper', this.disabled ? 'disabled' : ''],
       "onClick": this.handleIconClick
-    }, [this.type === 'time' || this.type === 'timerange' ? (0,external_vue_namespaceObject.createVNode)("svg", {
-      "class": "picker-icon",
-      "x": "0px",
-      "y": "0px",
-      "viewBox": "0 0 1024 1024"
-    }, [(0,external_vue_namespaceObject.createVNode)("g", {
-      "id": "time"
-    }, [(0,external_vue_namespaceObject.createVNode)("path", {
-      "fill": "#c4c6cc",
-      "d": "M512,128c51.9,0,102.2,10.1,149.5,30.2c45.7,19.3,86.8,47,122.1,82.3s63,76.4,82.3,122.1c20,47.3,30.2,97.6,30.2,149.5S886,614.3,865.9,661.6c-19.3,45.7-47,86.8-82.3,122.1s-76.4,63-122.1,82.3c-47.3,20-97.6,30.2-149.5,30.2S409.8,886.1,362.5,866c-45.7-19.3-86.8-47-122.1-82.3s-63-76.4-82.3-122.1c-20-47.3-30.2-97.6-30.2-149.5s10.1-102.2,30.2-149.5c19.3-45.7,47-86.8,82.3-122.1s76.4-63,122.1-82.3C409.8,138.1,460.1,128,512,128 M512,64C264.6,64,64,264.6,64,512s200.6,448,448,448s448-200.6,448-448S759.4,64,512,64L512,64z"
-    }, null), (0,external_vue_namespaceObject.createVNode)("polygon", {
-      "fill": "#c4c6cc",
-      "points": "512,512 512,256 448,256 448,512 448,576 512,576 768,576 768,512"
-    }, null)])]) : (0,external_vue_namespaceObject.createVNode)("svg", {
-      "class": "picker-icon",
-      "x": "0px",
-      "y": "0px",
-      "viewBox": "0 0 1024 1024"
-    }, [(0,external_vue_namespaceObject.createVNode)("g", {
-      "id": "date"
-    }, [(0,external_vue_namespaceObject.createVNode)("path", {
-      "fill": "#c4c6cc",
-      "d": "M896,128h-96v64h64v112H160V192h64v-64h-96c-17.7,0-32,14.3-32,32v736c0,17.7,14.3,32,32,32h768c17.7,0,32-14.3,32-32V160C928,142.3,913.7,128,896,128z M160,864V368h704v496H160z"
-    }, null), (0,external_vue_namespaceObject.createVNode)("rect", {
-      "x": "416",
-      "y": "128",
-      "fill": "#c4c6cc",
-      "width": "192",
-      "height": "64"
-    }, null), (0,external_vue_namespaceObject.createVNode)("rect", {
-      "x": "288",
-      "y": "96",
-      "fill": "#c4c6cc",
-      "width": "64",
-      "height": "128"
-    }, null), (0,external_vue_namespaceObject.createVNode)("rect", {
-      "x": "672",
-      "y": "96",
-      "fill": "#c4c6cc",
-      "width": "64",
-      "height": "128"
-    }, null), (0,external_vue_namespaceObject.createVNode)("polygon", {
-      "fill": "#c4c6cc",
-      "points": "403.7,514.4 557.1,514.4 557.1,515.3 420.1,765.5 483.5,765.5 620.3,504.3 620.3,466.5 403.7,466.5"
-    }, null)])])]), (0,external_vue_namespaceObject.createVNode)("input", {
+    }, [this.type === 'time' || this.type === 'timerange' ? timeIcon : dateIcon]), (0,external_vue_namespaceObject.createVNode)("input", {
       "type": "text",
       "class": [this.resolveClassName('date-picker-editor'), this.readonly ? 'readonly' : '', this.fontSizeCls, this.behavior === 'simplicity' ? 'only-bottom-border' : ''],
       "ref": "inputRef",
@@ -4721,7 +4811,8 @@ function date_picker_objectSpread(target) { for (var i = 1; i < arguments.length
       "onClick": this.handleFocus,
       "onBlur": this.handleBlur,
       "onKeydown": this.handleKeydown,
-      "onChange": this.handleInputChange
+      "onChange": this.handleInputChange,
+      "onInput": this.handleInputInput
     }, null), this.clearable && this.showClose ? (0,external_vue_namespaceObject.createVNode)(external_icon_namespaceObject.Close, {
       "onClick": this.handleClear,
       "class": "clear-action"
@@ -4857,6 +4948,7 @@ function time_picker_objectSpread(target) { for (var i = 1; i < arguments.length
 
 
 
+
 /* harmony default export */ const time_picker = ((0,external_vue_namespaceObject.defineComponent)({
   name: 'TimePicker',
   directives: {
@@ -4901,7 +4993,9 @@ function time_picker_objectSpread(target) { for (var i = 1; i < arguments.length
       internalFocus: false,
       timeEnterMode: true,
       shortcut: shortcut,
-      onSelectionModeChange: onSelectionModeChange
+      onSelectionModeChange: onSelectionModeChange,
+      // for 编辑时，mouseleave 事件中缓存的 value
+      tmpValue: initialValue
     });
     function onSelectionModeChange(_type) {
       var type = _type;
@@ -5055,6 +5149,11 @@ function time_picker_objectSpread(target) { for (var i = 1; i < arguments.length
         emit('input', now);
       }
     });
+    (0,external_vue_namespaceObject.watch)(function () {
+      return state.internalValue;
+    }, function (v) {
+      state.tmpValue = v;
+    });
     (0,external_vue_namespaceObject.onMounted)(function () {
       // 如果是 date-picker 那么 time-picker 就是回车模式
       if (props.type.indexOf('date') > -1) {
@@ -5117,12 +5216,14 @@ function time_picker_objectSpread(target) { for (var i = 1; i < arguments.length
       if (visualValue !== null && visualValue !== void 0 && visualValue.value) {
         state.showClose = true;
       }
+      state.internalValue = state.tmpValue;
     };
     var handleInputMouseleave = function handleInputMouseleave(_e) {
       // if (e.toElement?.classList.contains('clear-action')) {
       //   return;
       // }
       state.showClose = false;
+      state.internalValue = state.tmpValue;
     };
     var emitChange = function emitChange(type) {
       (0,external_vue_namespaceObject.nextTick)(function () {
@@ -5155,6 +5256,21 @@ function time_picker_objectSpread(target) { for (var i = 1; i < arguments.length
         state.forceInputRerender = state.forceInputRerender + 1;
       }
     };
+    var handleInputInput = function handleInputInput(e) {
+      var _props$disabledDate2;
+      var isArrayValue = props.type.includes('range') || props.multiple;
+      var oldValue = visualValue.value;
+      var newValue = e.target.value;
+      var newDate = parseDate(newValue, props.type, props.multiple, props.format);
+      var valueToTest = isArrayValue ? newDate : newDate[0];
+      var isDisabled = (_props$disabledDate2 = props.disabledDate) === null || _props$disabledDate2 === void 0 ? void 0 : _props$disabledDate2.call(props, valueToTest);
+      var isValidDate = newDate.reduce(function (valid, date) {
+        return valid && date instanceof Date;
+      }, true);
+      if (newValue !== oldValue && !isDisabled && isValidDate) {
+        state.tmpValue = newDate;
+      }
+    };
     var handleFocus = function handleFocus(e) {
       if (props.readonly) {
         return;
@@ -5356,6 +5472,7 @@ function time_picker_objectSpread(target) { for (var i = 1; i < arguments.length
       handleBlur: handleBlur,
       handleKeydown: handleKeydown,
       handleInputChange: handleInputChange,
+      handleInputInput: handleInputInput,
       handleClear: handleClear,
       handleTransferClick: handleTransferClick,
       onPick: onPick,
@@ -5377,51 +5494,7 @@ function time_picker_objectSpread(target) { for (var i = 1; i < arguments.length
     var defaultTrigger = (0,external_vue_namespaceObject.createVNode)("div", null, [(0,external_vue_namespaceObject.createVNode)("span", {
       "class": ['icon-wrapper', this.disabled ? 'disabled' : ''],
       "onClick": this.handleIconClick
-    }, [this.type === 'time' || this.type === 'timerange' ? (0,external_vue_namespaceObject.createVNode)("svg", {
-      "class": "picker-icon",
-      "x": "0px",
-      "y": "0px",
-      "viewBox": "0 0 1024 1024"
-    }, [(0,external_vue_namespaceObject.createVNode)("g", {
-      "id": "time"
-    }, [(0,external_vue_namespaceObject.createVNode)("path", {
-      "fill": "#c4c6cc",
-      "d": "M512,128c51.9,0,102.2,10.1,149.5,30.2c45.7,19.3,86.8,47,122.1,82.3s63,76.4,82.3,122.1c20,47.3,30.2,97.6,30.2,149.5S886,614.3,865.9,661.6c-19.3,45.7-47,86.8-82.3,122.1s-76.4,63-122.1,82.3c-47.3,20-97.6,30.2-149.5,30.2S409.8,886.1,362.5,866c-45.7-19.3-86.8-47-122.1-82.3s-63-76.4-82.3-122.1c-20-47.3-30.2-97.6-30.2-149.5s10.1-102.2,30.2-149.5c19.3-45.7,47-86.8,82.3-122.1s76.4-63,122.1-82.3C409.8,138.1,460.1,128,512,128 M512,64C264.6,64,64,264.6,64,512s200.6,448,448,448s448-200.6,448-448S759.4,64,512,64L512,64z"
-    }, null), (0,external_vue_namespaceObject.createVNode)("polygon", {
-      "fill": "#c4c6cc",
-      "points": "512,512 512,256 448,256 448,512 448,576 512,576 768,576 768,512"
-    }, null)])]) : (0,external_vue_namespaceObject.createVNode)("svg", {
-      "class": "picker-icon",
-      "x": "0px",
-      "y": "0px",
-      "viewBox": "0 0 1024 1024"
-    }, [(0,external_vue_namespaceObject.createVNode)("g", {
-      "id": "date"
-    }, [(0,external_vue_namespaceObject.createVNode)("path", {
-      "fill": "#c4c6cc",
-      "d": "M896,128h-96v64h64v112H160V192h64v-64h-96c-17.7,0-32,14.3-32,32v736c0,17.7,14.3,32,32,32h768c17.7,0,32-14.3,32-32V160C928,142.3,913.7,128,896,128z M160,864V368h704v496H160z"
-    }, null), (0,external_vue_namespaceObject.createVNode)("rect", {
-      "x": "416",
-      "y": "128",
-      "fill": "#c4c6cc",
-      "width": "192",
-      "height": "64"
-    }, null), (0,external_vue_namespaceObject.createVNode)("rect", {
-      "x": "288",
-      "y": "96",
-      "fill": "#c4c6cc",
-      "width": "64",
-      "height": "128"
-    }, null), (0,external_vue_namespaceObject.createVNode)("rect", {
-      "x": "672",
-      "y": "96",
-      "fill": "#c4c6cc",
-      "width": "64",
-      "height": "128"
-    }, null), (0,external_vue_namespaceObject.createVNode)("polygon", {
-      "fill": "#c4c6cc",
-      "points": "403.7,514.4 557.1,514.4 557.1,515.3 420.1,765.5 483.5,765.5 620.3,504.3 620.3,466.5 403.7,466.5"
-    }, null)])])]), (0,external_vue_namespaceObject.createVNode)("input", {
+    }, [this.type === 'time' || this.type === 'timerange' ? timeIcon : dateIcon]), (0,external_vue_namespaceObject.createVNode)("input", {
       "type": "text",
       "class": [this.resolveClassName('date-picker-editor'), this.readonly ? 'readonly' : '', this.fontSizeCls, this.behavior === 'simplicity' ? 'only-bottom-border' : ''],
       "ref": "inputRef",
@@ -5434,7 +5507,8 @@ function time_picker_objectSpread(target) { for (var i = 1; i < arguments.length
       "onClick": this.handleFocus,
       "onBlur": this.handleBlur,
       "onKeydown": this.handleKeydown,
-      "onChange": this.handleInputChange
+      "onChange": this.handleInputChange,
+      "onInput": this.handleInputInput
     }, null), this.clearable && this.showClose ? (0,external_vue_namespaceObject.createVNode)(external_icon_namespaceObject.Close, {
       "onClick": this.handleClear,
       "class": "clear-action"

package/lib/date-picker/panel/date.d.ts

@@ -108,7 +108,7 @@ declare const _default: import("vue").DefineComponent<{
         readonly default: () => {};
     };
 }, {
-    panelPickerHandlers: import("vue").ComputedRef<(value: any, type: any) => void>;
+    panelPickerHandlers: import("vue").ComputedRef<(value: any, _visible: boolean, type: any, _shortcut: any) => void>;
     datePanelLabel: import("vue").ComputedRef<{
         separator: any;
         labels: any[];
@@ -126,7 +126,7 @@ declare const _default: import("vue").DefineComponent<{
     handleToggleTime: () => void;
     handlePickSuccess: () => void;
     handlePickClear: () => void;
-    handlePick: (value: any, type: any) => void;
+    handlePick: (value: any, _visible: boolean, type: any, _shortcut: any) => void;
     handlePickClick: () => void;
     timePickerRef: any;
     resolveClassName: (cls: string) => string;

package/lib/date-picker/panel/time-range.d.ts

@@ -1,4 +1,5 @@
 import type { ExtractPropTypes, PropType } from 'vue';
+import { SelectionModeType } from '../interface';
 declare const timeRangeProps: {
     steps: {
         type: PropType<number[]>;
@@ -16,6 +17,11 @@ declare const timeRangeProps: {
         type: BooleanConstructor;
         default: boolean;
     };
+    selectionMode: {
+        type: PropType<SelectionModeType>;
+        default: string;
+        validator(v: any): boolean;
+    };
 };
 export type TimeRangePanelProps = Readonly<ExtractPropTypes<typeof timeRangeProps>>;
 declare const _default: import("vue").DefineComponent<{
@@ -35,6 +41,11 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
+    selectionMode: {
+        type: PropType<SelectionModeType>;
+        default: string;
+        validator(v: any): boolean;
+    };
     disabledHours: {
         readonly type: ArrayConstructor;
         readonly default: () => any[];
@@ -322,6 +333,11 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
+    selectionMode: {
+        type: PropType<SelectionModeType>;
+        default: string;
+        validator(v: any): boolean;
+    };
     disabledHours: {
         readonly type: ArrayConstructor;
         readonly default: () => any[];
@@ -492,5 +508,6 @@ declare const _default: import("vue").DefineComponent<{
     disabledSeconds: unknown[];
     hideDisabledOptions: boolean;
     enterMode: boolean;
+    selectionMode: SelectionModeType;
 }, {}>;
 export default _default;

package/lib/date-picker/panel/time.d.ts

@@ -1,5 +1,5 @@
 import type { ExtractPropTypes, PropType } from 'vue';
-import { IDisabledHMS } from '../interface';
+import { IDisabledHMS, SelectionModeType } from '../interface';
 declare const timeProps: {
     disabledDate: {
         type: FunctionConstructor;
@@ -21,6 +21,11 @@ declare const timeProps: {
         type: BooleanConstructor;
         default: boolean;
     };
+    selectionMode: {
+        type: PropType<SelectionModeType>;
+        default: string;
+        validator(v: any): boolean;
+    };
 };
 export type TimePanelProps = Readonly<ExtractPropTypes<typeof timeProps>>;
 declare const _default: import("vue").DefineComponent<{
@@ -44,6 +49,11 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
+    selectionMode: {
+        type: PropType<SelectionModeType>;
+        default: string;
+        validator(v: any): boolean;
+    };
     disabledHours: {
         readonly type: ArrayConstructor;
         readonly default: () => any[];
@@ -273,6 +283,11 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
+    selectionMode: {
+        type: PropType<SelectionModeType>;
+        default: string;
+        validator(v: any): boolean;
+    };
     disabledHours: {
         readonly type: ArrayConstructor;
         readonly default: () => any[];
@@ -448,5 +463,6 @@ declare const _default: import("vue").DefineComponent<{
     disabledSeconds: unknown[];
     hideDisabledOptions: boolean;
     enterMode: boolean;
+    selectionMode: SelectionModeType;
 }, {}>;
 export default _default;