bkui-vue 2.1.0-dev-beta.10 → 2.1.0-dev-beta.12

package/lib/input/index.js

@@ -8,6 +8,8 @@ import * as __WEBPACK_EXTERNAL_MODULE__popperjs_core_a5c7319c__ from "@popperjs/
 import * as __WEBPACK_EXTERNAL_MODULE__loading_4d683b23__ from "../loading";
 import * as __WEBPACK_EXTERNAL_MODULE__overflow_title_f9bafa47__ from "../overflow-title";
 import * as __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_icon_a97c79c3__ from "../icon";
+import * as __WEBPACK_EXTERNAL_MODULE_lodash_trim_5cdad98c__ from "lodash/trim";
+import * as __WEBPACK_EXTERNAL_MODULE_lodash_isNumber_64d4ca37__ from "lodash/isNumber";
 /******/ var __webpack_modules__ = ({
 
 /***/ 2439:
@@ -1564,6 +1566,14 @@ function calcTextareaHeight(targetElement) {
   hiddenTextarea = undefined;
   return result;
 }
+;// CONCATENATED MODULE: external "lodash/trim"
+var trim_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
+var trim_y = x => () => x
+const trim_namespaceObject = trim_x({ ["default"]: () => __WEBPACK_EXTERNAL_MODULE_lodash_trim_5cdad98c__["default"] });
+;// CONCATENATED MODULE: external "lodash/isNumber"
+var isNumber_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
+var isNumber_y = x => () => x
+const isNumber_namespaceObject = isNumber_x({ ["default"]: () => __WEBPACK_EXTERNAL_MODULE_lodash_isNumber_64d4ca37__["default"] });
 ;// CONCATENATED MODULE: ../../packages/input/src/input.tsx
 
 
@@ -1605,6 +1615,8 @@ function input_objectSpread(e) { for (var r = 1; r < arguments.length; r++) { va
 
 
 
+
+
 var inputType = {
   type: shared_namespaceObject.PropTypes.string.def('text'),
   clearable: shared_namespaceObject.PropTypes.bool,
@@ -1615,9 +1627,9 @@ var inputType = {
   suffixIcon: shared_namespaceObject.PropTypes.string,
   suffix: shared_namespaceObject.PropTypes.string,
   prefix: shared_namespaceObject.PropTypes.string,
-  step: shared_namespaceObject.PropTypes.number,
-  max: shared_namespaceObject.PropTypes.number,
-  min: shared_namespaceObject.PropTypes.number,
+  step: shared_namespaceObject.PropTypes.number.def(1),
+  max: shared_namespaceObject.PropTypes.number.def(Infinity),
+  min: shared_namespaceObject.PropTypes.number.def(-Infinity),
   maxlength: shared_namespaceObject.PropTypes.number,
   maxcharacter: shared_namespaceObject.PropTypes.number,
   behavior: (0,shared_namespaceObject.InputBehaviorType)(),
@@ -1642,7 +1654,8 @@ var inputType = {
   },
   resize: shared_namespaceObject.PropTypes.bool.def(true),
   autosize: shared_namespaceObject.PropTypes.oneOfType([Boolean, Object]).def(false),
-  stopPropagation: shared_namespaceObject.PropTypes.bool.def(true)
+  stopPropagation: shared_namespaceObject.PropTypes.bool.def(true),
+  allowEmptyValue: shared_namespaceObject.PropTypes.bool.def(false)
 };
 var EVENTS;
 (function (EVENTS) {
@@ -1670,16 +1683,13 @@ function EventFunction(_value, _evt) {
 function PastEventFunction(_value, _e) {
   return true;
 }
-function CompositionEventFunction(evt) {
-  return evt;
-}
 var inputEmitEventsType = (_inputEmitEventsType = {}, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_inputEmitEventsType, EVENTS.UPDATE, EventFunction), EVENTS.FOCUS, function (evt) {
   return evt;
 }), EVENTS.BLUR, function (evt) {
   return evt;
 }), EVENTS.CHANGE, EventFunction), EVENTS.CLEAR, function () {
   return true;
-}), EVENTS.INPUT, EventFunction), EVENTS.KEYPRESS, EventFunction), EVENTS.KEYDOWN, EventFunction), EVENTS.KEYUP, EventFunction), EVENTS.ENTER, EventFunction), _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_inputEmitEventsType, EVENTS.PASTE, PastEventFunction), EVENTS.COMPOSITIONSTART, CompositionEventFunction), EVENTS.COMPOSITIONUPDATE, CompositionEventFunction), EVENTS.COMPOSITIONEND, CompositionEventFunction), EVENTS.SEARCH, function (evt) {
+}), EVENTS.INPUT, EventFunction), EVENTS.KEYPRESS, EventFunction), EVENTS.KEYDOWN, EventFunction), EVENTS.KEYUP, EventFunction), EVENTS.ENTER, EventFunction), _defineProperty(_defineProperty(_inputEmitEventsType, EVENTS.PASTE, PastEventFunction), EVENTS.SEARCH, function (evt) {
   return evt;
 }));
 /* harmony default export */ const input = ((0,external_vue_namespaceObject.defineComponent)({
@@ -1696,7 +1706,6 @@ var inputEmitEventsType = (_inputEmitEventsType = {}, _defineProperty(_definePro
     var formItem = (0,shared_namespaceObject.useFormItem)();
     var t = (0,config_provider_namespaceObject.useLocale)('input');
     var isFocused = (0,external_vue_namespaceObject.ref)(false);
-    var isCNInput = (0,external_vue_namespaceObject.ref)(false);
     var isTextArea = (0,external_vue_namespaceObject.computed)(function () {
       return props.type === 'textarea';
     });
@@ -1783,12 +1792,12 @@ var inputEmitEventsType = (_inputEmitEventsType = {}, _defineProperty(_definePro
     });
     var incControlCls = (0,external_vue_namespaceObject.computed)(function () {
       return (0,shared_namespaceObject.classes)({
-        'is-disabled': props.disabled || props.modelValue >= props.max
+        'is-disabled': props.disabled || Number(props.modelValue) >= props.max
       });
     });
     var decControlCls = (0,external_vue_namespaceObject.computed)(function () {
       return (0,shared_namespaceObject.classes)({
-        'is-disabled': props.disabled || props.modelValue <= props.min
+        'is-disabled': props.disabled || Number(props.modelValue) <= props.min
       });
     });
     var tooltips = (0,external_vue_namespaceObject.computed)(function () {
@@ -1878,10 +1887,15 @@ var inputEmitEventsType = (_inputEmitEventsType = {}, _defineProperty(_definePro
       });
     }
     function clear() {
-      if (props.disabled) return;
-      var resetVal = isNumberInput.value ? props.min : '';
-      ctx.emit(EVENTS.UPDATE, resetVal, null);
-      ctx.emit(EVENTS.CHANGE, resetVal, null);
+      if (props.disabled) {
+        return;
+      }
+      var value = '';
+      if (props.type === 'number' && !props.allowEmptyValue) {
+        value = props.min !== -Infinity ? props.min : 0;
+      }
+      ctx.emit(EVENTS.UPDATE, value, null);
+      ctx.emit(EVENTS.CHANGE, value, null);
       ctx.emit(EVENTS.CLEAR);
     }
     function handleFocus(e) {
@@ -1904,10 +1918,16 @@ var inputEmitEventsType = (_inputEmitEventsType = {}, _defineProperty(_definePro
     function eventHandler(eventName) {
       return function (e) {
         props.stopPropagation && e.stopPropagation();
+        if (e.isComposing) {
+          // 跳过输入法复合事件
+          return;
+        }
+        var inputValue = (0,trim_namespaceObject["default"])(e.target.value) || '';
+        // 字符类型输入框才会有这种场景
         if (showMaxLimit.value && !props.overMaxLengthLimit) {
-          var limit = getValueLimits(e.target.value);
-          if (limit.len >= ceilMaxLength.value && (eventName === EVENTS.KEYDOWN || eventName === EVENTS.INPUT) && !isCNInput.value) {
-            var val = limit.pos > 0 ? e.target.value.slice(0, limit.pos) : e.target.value;
+          var limit = getValueLimits(inputValue);
+          if (limit.len >= ceilMaxLength.value && (eventName === EVENTS.KEYDOWN || eventName === EVENTS.INPUT)) {
+            var val = limit.pos > 0 ? "".concat(inputValue).slice(0, limit.pos) : inputValue;
             innerInputValue.value = {
               value: val
             };
@@ -1916,44 +1936,37 @@ var inputEmitEventsType = (_inputEmitEventsType = {}, _defineProperty(_definePro
             return;
           }
         }
-        if (eventName === EVENTS.KEYDOWN && (e.code === 'Enter' || e.key === 'Enter' || e.keyCode === 13)) {
-          ctx.emit(EVENTS.ENTER, isNumberInput.value ? handleNumber(e.target.value, 0) : e.target.value, e);
-        }
-        if (isCNInput.value && [EVENTS.INPUT, EVENTS.CHANGE, EVENTS.KEYDOWN].some(function (e) {
-          return eventName === e;
-        })) return;
-        if (eventName === EVENTS.INPUT) {
-          // ctx.emit(EVENTS.UPDATE, isNumberInput.value ? handleNumber(e.target.value, 0) : e.target.value, e);
-          ctx.emit(EVENTS.UPDATE, isNumberInput.value ?
-          // 这里不直接使用 handleNumber，是因为 handleNumber 里有 min 和 max 的判断
-          // https://github.com/TencentBlueKing/bkui-vue3/issues/2426
-          function () {
-            var precision = Number.isInteger(props.precision) ? props.precision : 0;
-            var val = e.target.value;
-            if (Number.isNaN(val)) {
-              return isNum(props.min) ? props.min : 0;
-            }
-            if (val === '' || val === null || val === undefined) {
-              return '';
+        // 数字输入框需要处理空值和类型转换
+        if (props.type === 'number') {
+          if (inputValue === '') {
+            // 处理空值(默认为0，可通过allowEmptyValue控制)
+            if (!props.allowEmptyValue) {
+              inputValue = props.min !== -Infinity ? props.min : 0;
             }
-            // 输入过程中只截断超出 precision 的多余小数位，不用 toFixed 补零
-            // 完整的精度格式化在 CHANGE（失焦）时由 handleNumber 处理
-            var dotIndex = val.indexOf('.');
-            if (precision === 0) {
-              return dotIndex > -1 ? val.slice(0, dotIndex) : val;
-            }
-            if (dotIndex > -1 && val.length - dotIndex - 1 > precision) {
-              return val.slice(0, dotIndex + precision + 1);
-            }
-            return val;
-          }() : e.target.value, e);
-        } else if (eventName === EVENTS.CHANGE && isNumberInput.value) {
-          var _val = handleNumber(e.target.value, 0);
-          ctx.emit(EVENTS.UPDATE, _val, e);
-          ctx.emit(eventName, _val, e);
-          return;
+          } else {
+            inputValue = Number(Number(inputValue).toFixed(props.precision));
+          }
+        }
+        if (eventName === EVENTS.KEYDOWN && e.code === 'Enter') {
+          // 输入框值改变时，数字输入框需要限制最大最小值
+          if ((0,isNumber_namespaceObject["default"])(inputValue)) {
+            inputValue = Math.min(Math.max(Number(inputValue), props.min), props.max);
+          }
+          ctx.emit(EVENTS.ENTER, inputValue, e);
+          ctx.emit(EVENTS.UPDATE, inputValue, e);
+        } else if (eventName === EVENTS.INPUT) {
+          ctx.emit(EVENTS.INPUT, inputValue, e);
+          ctx.emit(EVENTS.UPDATE, inputValue, e);
+        } else if (eventName === EVENTS.CHANGE) {
+          // 输入框值改变时，数字输入框需要限制最大最小值
+          if ((0,isNumber_namespaceObject["default"])(inputValue)) {
+            inputValue = Math.min(Math.max(Number(inputValue), props.min), props.max);
+          }
+          ctx.emit(EVENTS.CHANGE, inputValue, e);
+          ctx.emit(EVENTS.UPDATE, inputValue, e);
+        } else {
+          ctx.emit(eventName, inputValue, e);
         }
-        ctx.emit(eventName, isNumberInput.value ? handleNumber(e.target.value, 0) : e.target.value, e);
       };
     }
     var _map = [EVENTS.KEYUP, EVENTS.KEYDOWN, EVENTS.KEYPRESS, EVENTS.PASTE, EVENTS.CHANGE, EVENTS.INPUT].map(eventHandler),
@@ -1964,47 +1977,21 @@ var inputEmitEventsType = (_inputEmitEventsType = {}, _defineProperty(_definePro
       handlePaste = _map2[3],
       handleChange = _map2[4],
       handleInput = _map2[5];
-    // 输入法启用时
-    function handleCompositionStart() {
-      isCNInput.value = true;
-    }
-    // 输入法输入结束时
-    function handleCompositionEnd(e) {
-      isCNInput.value = false;
-      handleInput(e);
-    }
-    function isNum(num) {
-      return typeof num === 'number' && !Number.isNaN(num);
-    }
-    function handleNumber(modelValue, step) {
-      var INC = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
-      var numStep = Number(step);
-      var factor = isNum(numStep) ? numStep : 1;
-      var precision = Number.isInteger(props.precision) ? props.precision : 0;
-      var val = Number(modelValue);
-      if (Number.isNaN(val)) {
-        return isNum(props.min) ? props.min : 0;
-      }
-      var newVal = val + (INC ? factor : -1 * factor);
-      if (isNum(props.max)) {
-        newVal = Math.min(newVal, props.max);
-      }
-      if (isNum(props.min)) {
-        newVal = Math.max(newVal, props.min);
-      }
-      return +newVal.toFixed(precision);
-    }
     function handleInc(e) {
-      if (props.disabled) return;
-      var newVal = handleNumber(props.modelValue, props.step);
-      ctx.emit(EVENTS.UPDATE, newVal, e);
-      ctx.emit(EVENTS.CHANGE, newVal, e);
+      if (props.disabled) {
+        return;
+      }
+      var newValue = Number(Math.min(Number(props.modelValue) + props.step, props.max).toFixed(props.precision));
+      ctx.emit(EVENTS.UPDATE, newValue, e);
+      ctx.emit(EVENTS.CHANGE, newValue, e);
     }
     function handleDec(e) {
-      if (props.disabled) return;
-      var newVal = handleNumber(props.modelValue, props.step, false);
-      ctx.emit(EVENTS.UPDATE, newVal, e);
-      ctx.emit(EVENTS.CHANGE, newVal, e);
+      if (props.disabled) {
+        return;
+      }
+      var newValue = Number(Math.max(Number(props.modelValue) - props.step, props.min).toFixed(props.precision));
+      ctx.emit(EVENTS.UPDATE, newValue, e);
+      ctx.emit(EVENTS.CHANGE, newValue, e);
     }
     function getCls(name) {
       return "".concat(inputClsPrefix.value, "--").concat(name);
@@ -2028,9 +2015,7 @@ var inputEmitEventsType = (_inputEmitEventsType = {}, _defineProperty(_definePro
       onChange: handleChange,
       onKeypress: handleKeyPress,
       onKeydown: handleKeydown,
-      onKeyup: handleKeyup,
-      onCompositionstart: handleCompositionStart,
-      onCompositionend: handleCompositionEnd
+      onKeyup: handleKeyup
     };
     return function () {
       var _ctx$slots$prefix, _ctx$slots, _ctx$slots$prefix2, _ctx$slots$suffix, _ctx$slots2, _ctx$slots2$suffix;

package/lib/input/input.d.ts

@@ -38,12 +38,18 @@ export declare const inputType: {
     };
     step: import("vue-types").VueTypeValidableDef<number> & {
         default: number;
+    } & {
+        default: number;
     };
     max: import("vue-types").VueTypeValidableDef<number> & {
         default: number;
+    } & {
+        default: number;
     };
     min: import("vue-types").VueTypeValidableDef<number> & {
         default: number;
+    } & {
+        default: number;
     };
     maxlength: import("vue-types").VueTypeValidableDef<number> & {
         default: number;
@@ -116,6 +122,11 @@ export declare const inputType: {
     } & {
         default: boolean;
     };
+    allowEmptyValue: import("vue-types").VueTypeValidableDef<boolean> & {
+        default: boolean;
+    } & {
+        default: boolean;
+    };
 };
 export declare const enum EVENTS {
     BLUR = "blur",
@@ -136,7 +147,6 @@ export declare const enum EVENTS {
 }
 declare function EventFunction(_value: any, _evt: KeyboardEvent): any;
 declare function PastEventFunction(_value: any, _e: ClipboardEvent): boolean;
-declare function CompositionEventFunction(evt: CompositionEvent): CompositionEvent;
 export declare const inputEmitEventsType: {
     "update:modelValue": typeof EventFunction;
     focus: (evt: FocusEvent) => FocusEvent;
@@ -149,9 +159,6 @@ export declare const inputEmitEventsType: {
     keyup: typeof EventFunction;
     enter: typeof EventFunction;
     paste: typeof PastEventFunction;
-    compositionstart: typeof CompositionEventFunction;
-    compositionupdate: typeof CompositionEventFunction;
-    compositionend: typeof CompositionEventFunction;
     search: (evt: Event) => Event;
 };
 export type InputType = ExtractPropTypes<typeof inputType>;
@@ -189,12 +196,18 @@ declare const _default: import("vue").DefineComponent<ExtractPropTypes<{
     };
     step: import("vue-types").VueTypeValidableDef<number> & {
         default: number;
+    } & {
+        default: number;
     };
     max: import("vue-types").VueTypeValidableDef<number> & {
         default: number;
+    } & {
+        default: number;
     };
     min: import("vue-types").VueTypeValidableDef<number> & {
         default: number;
+    } & {
+        default: number;
     };
     maxlength: import("vue-types").VueTypeValidableDef<number> & {
         default: number;
@@ -267,6 +280,11 @@ declare const _default: import("vue").DefineComponent<ExtractPropTypes<{
     } & {
         default: boolean;
     };
+    allowEmptyValue: import("vue-types").VueTypeValidableDef<boolean> & {
+        default: boolean;
+    } & {
+        default: boolean;
+    };
 }>, () => JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:modelValue": typeof EventFunction;
     focus: (evt: FocusEvent) => FocusEvent;
@@ -279,9 +297,6 @@ declare const _default: import("vue").DefineComponent<ExtractPropTypes<{
     keyup: typeof EventFunction;
     enter: typeof EventFunction;
     paste: typeof PastEventFunction;
-    compositionstart: typeof CompositionEventFunction;
-    compositionupdate: typeof CompositionEventFunction;
-    compositionend: typeof CompositionEventFunction;
     search: (evt: Event) => Event;
 }, string, import("vue").PublicProps, Readonly<ExtractPropTypes<{
     type: import("vue-types").VueTypeValidableDef<string> & {
@@ -317,12 +332,18 @@ declare const _default: import("vue").DefineComponent<ExtractPropTypes<{
     };
     step: import("vue-types").VueTypeValidableDef<number> & {
         default: number;
+    } & {
+        default: number;
     };
     max: import("vue-types").VueTypeValidableDef<number> & {
         default: number;
+    } & {
+        default: number;
     };
     min: import("vue-types").VueTypeValidableDef<number> & {
         default: number;
+    } & {
+        default: number;
     };
     maxlength: import("vue-types").VueTypeValidableDef<number> & {
         default: number;
@@ -395,13 +416,15 @@ declare const _default: import("vue").DefineComponent<ExtractPropTypes<{
     } & {
         default: boolean;
     };
+    allowEmptyValue: import("vue-types").VueTypeValidableDef<boolean> & {
+        default: boolean;
+    } & {
+        default: boolean;
+    };
 }>> & Readonly<{
     onBlur?: (evt: FocusEvent) => any;
     onChange?: (_value: any, _evt: KeyboardEvent) => any;
     onClear?: () => any;
-    onCompositionend?: (evt: CompositionEvent) => any;
-    onCompositionstart?: (evt: CompositionEvent) => any;
-    onCompositionupdate?: (evt: CompositionEvent) => any;
     onEnter?: (_value: any, _evt: KeyboardEvent) => any;
     onFocus?: (evt: FocusEvent) => any;
     onInput?: (_value: any, _evt: KeyboardEvent) => any;
@@ -440,6 +463,7 @@ declare const _default: import("vue").DefineComponent<ExtractPropTypes<{
     showOverflowTooltips: boolean;
     tooltipsOptions: Partial<IOptions>;
     autosize: boolean | InputAutoSize;
+    allowEmptyValue: boolean;
 }, {}, {}, {
     bkTooltips: import("vue").ObjectDirective<any, any, string, any>;
 }, string, import("vue").ComponentProvideOptions, true, {}, any>;