@qsxy/element-plus-react 1.0.2 → 2.0.0

package/dist/InputNumber/InputNumber.js

@@ -1,11 +1,7 @@
-function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 var _templateObject, _templateObject2;
-var _excluded = ["name", "max", "min", "step", "precision", "onChange", "classPrefix", "prefix", "suffix", "prepend", "append", "placeholder", "warning", "error", "maxLength", "minLength"];
+var _excluded = ["name", "id", "max", "min", "step", "precision", "stepStrictly", "valueOnClear", "inputmode", "align", "disabledScientific", "controls", "controlsPosition", "onChange", "onFocus", "onBlur", "classPrefix", "prefix", "suffix", "placeholder", "maxLength", "minLength", "decreaseIcon", "increaseIcon"];
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
-function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
@@ -14,43 +10,63 @@ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" !=
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import { useMount, useUnmount } from 'ahooks';
 import classNames from 'classnames';
-import max from 'lodash/max';
-import min from 'lodash/min';
+import isNil from 'lodash/isNil';
 import omit from 'lodash/omit';
 import toFinite from 'lodash/toFinite';
-import React, { forwardRef, memo, useCallback, useEffect, useImperativeHandle, useMemo, useRef } from 'react';
+import React, { forwardRef, memo, useCallback, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react';
+import { useTranslation } from 'react-i18next';
 import { useConfigProvider } from "../ConfigProvider/ConfigProviderContext";
 import Icon from "../Icon/Icon";
 import Input from "../Input/Input";
-import { floatAdd, floatSub, formatNumber, isEmpty, isNotEmpty, mergeDefaultProps } from "../Util";
+import { isNotEmpty, isNumber, isUndefined, mergeDefaultProps } from "../Util";
 import { partitionHTMLProps, useClassNames, useControlled, useDisabled, useSize } from "../hooks";
 var InputNumber = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props, ref) {
+  var _useConfigProvider = useConfigProvider(),
+    locale = _useConfigProvider.locale;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
   props = mergeDefaultProps({
+    disabled: undefined,
     step: 1,
-    precision: 0,
-    max: Infinity,
-    min: -Infinity,
-    placeholder: '请输入'
+    precision: undefined,
+    max: Number.MAX_SAFE_INTEGER,
+    min: Number.MIN_SAFE_INTEGER,
+    placeholder: '',
+    controls: true,
+    stepStrictly: false,
+    valueOnClear: null,
+    // validateEvent: true,
+    inputmode: undefined,
+    align: 'center'
   }, props);
   var _props = props,
     name = _props.name,
+    id = _props.id,
     _maxProp = _props.max,
     _minProp = _props.min,
     step = _props.step,
-    precision = _props.precision,
+    precisionProp = _props.precision,
+    stepStrictly = _props.stepStrictly,
+    valueOnClear = _props.valueOnClear,
+    inputmode = _props.inputmode,
+    align = _props.align,
+    disabledScientific = _props.disabledScientific,
+    controls = _props.controls,
+    controlsPosition = _props.controlsPosition,
     onChange = _props.onChange,
+    onFocus = _props.onFocus,
+    onBlur = _props.onBlur,
     _props$classPrefix = _props.classPrefix,
     classPrefix = _props$classPrefix === void 0 ? 'input-number' : _props$classPrefix,
     prefix = _props.prefix,
     suffix = _props.suffix,
-    prepend = _props.prepend,
-    append = _props.append,
     placeholder = _props.placeholder,
-    warning = _props.warning,
-    error = _props.error,
     maxLength = _props.maxLength,
     minLength = _props.minLength,
+    decreaseIcon = _props.decreaseIcon,
+    increaseIcon = _props.increaseIcon,
     rest = _objectWithoutProperties(_props, _excluded);
   var _useClassNames = useClassNames(classPrefix),
     b = _useClassNames.b,
@@ -71,185 +87,430 @@ var InputNumber = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props, re
     setValue = _useControlled2[1];
   var disabled = useDisabled(props.disabled);
   var size = useSize(props.size);
-  var _useConfigProvider = useConfigProvider(),
-    inputNumber = _useConfigProvider.inputNumber;
+  var _useConfigProvider2 = useConfigProvider(),
+    inputNumber = _useConfigProvider2.inputNumber;
   var valueRef = useRef(value);
   var containerRef = useRef(null);
   var inputRef = useRef(null);
-  // 是否ctrl按键
-  var isCtrlKey = useRef(false);
-  var controlsPositionRight = useMemo(function () {
-    return props.controlsPositionRight || (inputNumber === null || inputNumber === void 0 ? void 0 : inputNumber.controlsPositionRight) || isNotEmpty(prefix) || isNotEmpty(suffix) || isNotEmpty(prepend) || isNotEmpty(append);
-  }, [append, inputNumber === null || inputNumber === void 0 ? void 0 : inputNumber.controlsPositionRight, prefix, prepend, props.controlsPositionRight, suffix]);
+  var _useState = useState(null),
+    _useState2 = _slicedToArray(_useState, 2),
+    userInput = _useState2[0],
+    setUserInput = _useState2[1];
+  var userInputRef = useRef(null);
+  var isMouseDown = useRef(false);
+  var timerRef = useRef(null);
 
-  // const containerRef = useMemo(() => props.containerRef ?? rootRef, [props.containerRef]);
+  // Computed properties equivalent
+  var controlsAtRight = useMemo(function () {
+    return controls && controlsPosition === 'right' || controlsPosition !== '' && (inputNumber === null || inputNumber === void 0 ? void 0 : inputNumber.controlsPosition) === 'right';
+  }, [controls, controlsPosition, inputNumber === null || inputNumber === void 0 ? void 0 : inputNumber.controlsPosition]);
   var maxProp = useMemo(function () {
     var _ref;
-    return (_ref = _maxProp !== null && _maxProp !== void 0 ? _maxProp : inputNumber === null || inputNumber === void 0 ? void 0 : inputNumber.max) !== null && _ref !== void 0 ? _ref : Infinity;
+    return (_ref = _maxProp !== null && _maxProp !== void 0 ? _maxProp : inputNumber === null || inputNumber === void 0 ? void 0 : inputNumber.max) !== null && _ref !== void 0 ? _ref : Number.MAX_SAFE_INTEGER;
   }, [_maxProp, inputNumber === null || inputNumber === void 0 ? void 0 : inputNumber.max]);
   var minProp = useMemo(function () {
     var _ref2;
-    return (_ref2 = _minProp !== null && _minProp !== void 0 ? _minProp : inputNumber === null || inputNumber === void 0 ? void 0 : inputNumber.min) !== null && _ref2 !== void 0 ? _ref2 : -Infinity;
+    return (_ref2 = _minProp !== null && _minProp !== void 0 ? _minProp : inputNumber === null || inputNumber === void 0 ? void 0 : inputNumber.min) !== null && _ref2 !== void 0 ? _ref2 : Number.MIN_SAFE_INTEGER;
   }, [_minProp, inputNumber === null || inputNumber === void 0 ? void 0 : inputNumber.min]);
 
-  /** 递增 */
-  var increase = useCallback(function () {
-    if (disabled) {
+  // Utility functions
+  var getPrecision = useCallback(function (val) {
+    if (val == null) {
+      return 0;
+    }
+    var valueString = val.toString();
+    var dotPosition = valueString.indexOf('.');
+    var precision = 0;
+    if (dotPosition !== -1) {
+      precision = valueString.length - dotPosition - 1;
+    }
+    return precision;
+  }, []);
+  var numPrecision = useMemo(function () {
+    var stepPrecision = getPrecision(step);
+    if (!isUndefined(props.precision)) {
+      if (stepPrecision > precisionProp) {
+        if (process.env.NODE_ENV !== 'production') {
+          console.warn('[InputNumber] precision should not be less than the decimal places of step');
+        }
+      }
+      return precisionProp;
+    } else {
+      return Math.max(getPrecision(value), stepPrecision);
+    }
+  }, [getPrecision, step, props.precision, precisionProp, value]);
+  var minDisabled = useCallback(function () {
+    if (isMouseDown.current) {
+      return userInputRef.current !== null && Number(userInputRef.current) <= minProp;
+    }
+    return typeof value === 'number' && value <= minProp;
+  }, [value, minProp]);
+  var maxDisabled = useCallback(function () {
+    if (isMouseDown.current) {
+      return userInputRef.current !== null && Number(userInputRef.current) >= maxProp;
+    }
+    return typeof value === 'number' && value >= maxProp;
+  }, [value, maxProp]);
+  var displayValue = useMemo(function () {
+    var _currentValue;
+    if (userInput !== null) {
+      return userInput !== null && userInput !== void 0 ? userInput : '';
+    }
+    var currentValue = value;
+    if (isNil(currentValue)) {
+      return '';
+    }
+    if (isNumber(currentValue)) {
+      if (Number.isNaN(currentValue)) {
+        return '';
+      }
+      if (!isUndefined(precisionProp)) {
+        currentValue = currentValue.toFixed(precisionProp);
+      }
+    }
+    return (_currentValue = currentValue) !== null && _currentValue !== void 0 ? _currentValue : '';
+  }, [userInput, value, precisionProp]);
+  var toPrecision = useCallback(function (num, pre) {
+    if (pre === undefined) {
+      pre = numPrecision;
+    }
+    if (pre === 0) {
+      return Math.round(num);
+    }
+    var snum = String(num);
+    var pointPos = snum.indexOf('.');
+    if (pointPos === -1) {
+      return num;
+    }
+    var nums = snum.replace('.', '').split('');
+    var datum = nums[pointPos + pre];
+    if (!datum) {
+      return num;
+    }
+    var length = snum.length;
+    if (snum.charAt(length - 1) === '5') {
+      snum = "".concat(snum.slice(0, Math.max(0, length - 1)), "6");
+    }
+    return Number.parseFloat(Number(snum).toFixed(pre));
+  }, [numPrecision]);
+  var ensurePrecision = useCallback(function (val) {
+    var coefficient = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1;
+    if (typeof val !== 'number') {
+      return value;
+    }
+    if (val >= Number.MAX_SAFE_INTEGER && coefficient === 1) {
+      if (process.env.NODE_ENV !== 'production') {
+        console.warn('InputNumber', 'The value has reached the maximum safe integer limit.');
+      }
+      return val;
+    } else if (val <= Number.MIN_SAFE_INTEGER && coefficient === -1) {
+      if (process.env.NODE_ENV !== 'production') {
+        console.warn('InputNumber', 'The value has reached the minimum safe integer limit.');
+      }
+      return val;
+    }
+    return toPrecision(val + step * coefficient);
+  }, [toPrecision, step, value]);
+  var verifyValue = useCallback(function (val) {
+    var shouldUpdate = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+    if (maxProp < minProp) {
+      throw new Error('InputNumber: min should not be greater than max.');
+    }
+    var newVal = Number(val);
+    if (val == null || Number.isNaN(newVal)) {
+      return null;
+    }
+    if (val === '') {
+      if (valueOnClear === null) {
+        return null;
+      }
+      if (typeof valueOnClear === 'string') {
+        newVal = valueOnClear === 'min' ? minProp : maxProp;
+      } else {
+        newVal = valueOnClear;
+      }
+    }
+    if (stepStrictly) {
+      newVal = toPrecision(Math.round(toPrecision(newVal / step)) * step, precisionProp);
+      if (newVal !== val && shouldUpdate) {
+        // Emit update event - handled by parent in React
+      }
+    }
+    if (precisionProp !== undefined) {
+      newVal = toPrecision(newVal, precisionProp);
+    }
+    if (newVal > maxProp || newVal < minProp) {
+      newVal = newVal > maxProp ? maxProp : minProp;
+      if (shouldUpdate) {
+        // Emit update event - handled by parent in React
+      }
+    }
+    return newVal;
+  }, [maxProp, minProp, valueOnClear, stepStrictly, toPrecision, step, precisionProp]);
+  var setCurrentValue = useCallback(function (val) {
+    var emitChange = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
+    var oldVal = value;
+    var newVal = verifyValue(val);
+    if (!emitChange) {
+      setValue(newVal);
       return;
     }
-    var increaseValue = min([floatAdd(toFinite(value), step), maxProp]);
-    var increaseOldValue = value;
-    var formatVal = formatNumber(increaseValue, precision);
-    setValue(formatVal);
-    onChange === null || onChange === void 0 || onChange(toFinite(formatVal), increaseOldValue);
-  }, [disabled, value, step, maxProp, precision, setValue, onChange]);
-
-  /** 递减 */
-  var decrease = useCallback(function () {
-    if (disabled) {
+    setUserInput(null);
+    userInputRef.current = null;
+    if (oldVal === newVal && val) {
       return;
     }
-    var decreaseValue = max([floatSub(toFinite(value), step), minProp]);
-    var decreaseOldValue = value;
-    var formatVal = formatNumber(decreaseValue, precision);
-    setValue(formatVal);
-    onChange === null || onChange === void 0 || onChange(toFinite(formatVal), decreaseOldValue);
-  }, [disabled, value, step, minProp, precision, setValue, onChange]);
-  var onInput = useCallback(function (inputVal) {
-    // 阻止输入错误位置的负号
-    inputVal = inputVal.split('').filter(function (item, index) {
-      if (item === '-' && index > 0) {
-        return false;
-      }
-      return true;
-    }).join('');
-    // inputVal = inputVal.replace(/[^\d-\\.]/g, '').replace(/(?<=.)-/g, '');
-    setValue(inputVal);
-    valueRef.current = inputVal;
-    // 输入小数点后，如果转为数字会丢失小数点，所以此时不提交数据
-    if (!inputVal.endsWith('.') && !inputVal.endsWith('0')) {
-      var _inputVal = isEmpty(inputVal) ? '' : toFinite(inputVal);
-      setValue(_inputVal);
-      onChange === null || onChange === void 0 || onChange(_inputVal);
-    }
-    inputRef.current.input.current.value = isEmpty(inputVal) ? '' : inputVal;
-  }, [onChange, setValue]);
+    setValue(newVal);
+    if (oldVal !== newVal && onChange) {
+      onChange(newVal, oldVal);
+    }
 
-  /** 输入 */
-  var onBlur = useCallback(function () {
-    // 删除值
-    if (isEmpty(valueRef.current)) {
-      setValue('');
-      onChange === null || onChange === void 0 || onChange('');
-      valueRef.current = '';
-      inputRef.current.input.current.value = '';
+    // Form validation would go here if needed
+  }, [value, verifyValue, setValue, onChange]);
+  var increase = useCallback(function () {
+    if (props.readOnly || disabled || maxDisabled()) {
       return;
     }
-    var inputOldValue = value;
-    var val = toFinite(valueRef.current);
-    var formatVal = formatNumber(val, precision);
-
-    // 限制最大最小
-    if (val > maxProp) {
-      setValue(maxProp);
-      onChange === null || onChange === void 0 || onChange(maxProp, inputOldValue);
-      inputRef.current.input.current.value = maxProp + '';
+    var val = Number(displayValue) || 0;
+    var newVal = ensurePrecision(val);
+    setCurrentValue(newVal);
+    onChange === null || onChange === void 0 || onChange(newVal);
+  }, [props.readOnly, disabled, maxDisabled, displayValue, ensurePrecision, setCurrentValue, onChange]);
+  var decrease = useCallback(function () {
+    if (props.readOnly || disabled || minDisabled()) {
       return;
-    } else if (val < minProp) {
-      setValue(minProp);
-      onChange === null || onChange === void 0 || onChange(minProp, inputOldValue);
-      inputRef.current.input.current.value = minProp + '';
+    }
+    var val = Number(displayValue) || 0;
+    var newVal = ensurePrecision(val, -1);
+    setCurrentValue(newVal);
+    onChange === null || onChange === void 0 || onChange(newVal);
+  }, [props.readOnly, disabled, minDisabled, displayValue, ensurePrecision, setCurrentValue, onChange]);
+
+  // Event handlers
+  var handleKeydown = useCallback(function (event) {
+    var key = event.key;
+    var code = event.code;
+    if (disabledScientific && ['e', 'E'].includes(key)) {
+      event.preventDefault();
       return;
     }
-    setValue(formatVal);
-    onChange === null || onChange === void 0 || onChange(toFinite(formatVal), inputOldValue);
-    inputRef.current.input.current.value = formatVal;
-  }, [maxProp, minProp, onChange, precision, setValue, value]);
+    switch (code) {
+      case 'ArrowUp':
+        {
+          event.preventDefault();
+          increase();
+          break;
+        }
+      case 'ArrowDown':
+        {
+          event.preventDefault();
+          decrease();
+          break;
+        }
+    }
+  }, [decrease, disabledScientific, increase]);
+  var handleInput = useCallback(function (inputVal) {
+    setUserInput(inputVal);
+    userInputRef.current = inputVal;
+    var newVal = inputVal === '' ? null : Number(inputVal);
+    onChange === null || onChange === void 0 || onChange(newVal);
+    setCurrentValue(newVal, false);
+  }, [onChange, setCurrentValue]);
+  var handleInputChange = useCallback(function (inputVal) {
+    var newVal = inputVal !== '' ? Number(inputVal) : '';
+    // onChange?.(newVal);
+    // setCurrentValue(newVal, true);
+    if (typeof newVal === 'number' && !Number.isNaN(newVal) || inputVal === '') {
+      setUserInput(inputVal);
+      userInputRef.current = inputVal;
+      onChange === null || onChange === void 0 || onChange(newVal);
+      // setCurrentValue(newVal);
+    }
+    // setUserInput(null);
+  }, [onChange]);
+  var handleFocus = useCallback(function (event) {
+    onFocus === null || onFocus === void 0 || onFocus(event);
+  }, [onFocus]);
+  var handleBlur = useCallback(function (event) {
+    var _inputRef$current;
+    // setUserInput(null);
+    // Handle Firefox bug where non-numeric content isn't cleared
+    if (value === null && (_inputRef$current = inputRef.current) !== null && _inputRef$current !== void 0 && _inputRef$current.input.current) {
+      inputRef.current.input.current.value = '';
+    }
+    onBlur === null || onBlur === void 0 || onBlur(event);
+    if (isNotEmpty(userInputRef.current)) {
+      setCurrentValue(String(userInputRef.current), true);
+      setUserInput(null);
+      userInputRef.current = null;
+    }
+    // Form validation would go here
+  }, [value, onBlur, setCurrentValue, userInputRef]);
+
+  // Effects
   useEffect(function () {
     valueRef.current = value;
   }, [value]);
+  useEffect(function () {
+    var _inputRef$current2;
+    var innerInput = (_inputRef$current2 = inputRef.current) === null || _inputRef$current2 === void 0 ? void 0 : _inputRef$current2.input.current;
+    if (innerInput) {
+      innerInput.setAttribute('role', 'spinbutton');
+      if (Number.isFinite(maxProp)) {
+        innerInput.setAttribute('aria-valuemax', String(maxProp));
+      } else {
+        innerInput.removeAttribute('aria-valuemax');
+      }
+      if (Number.isFinite(minProp)) {
+        innerInput.setAttribute('aria-valuemin', String(minProp));
+      } else {
+        innerInput.removeAttribute('aria-valuemin');
+      }
+      innerInput.setAttribute('aria-valuenow', value != null ? String(value) : '');
+      innerInput.setAttribute('aria-disabled', String(disabled));
+
+      // Add wheel event listener
+      var handleWheel = function handleWheel(event) {
+        if (document.activeElement === event.target) {
+          event.preventDefault();
+        }
+      };
+      innerInput.addEventListener('wheel', handleWheel, {
+        passive: false
+      });
+      return function () {
+        innerInput.removeEventListener('wheel', handleWheel);
+      };
+    }
+  }, [maxProp, minProp, value, disabled]);
+  var handleMouseUp = useCallback(function () {
+    if (timerRef.current) {
+      clearTimeout(timerRef.current);
+      clearInterval(timerRef.current);
+    }
+    if (isMouseDown.current) {
+      setCurrentValue(userInputRef.current, false);
+      onChange === null || onChange === void 0 || onChange(userInputRef.current);
+      userInputRef.current = null;
+      isMouseDown.current = false;
+    }
+  }, [onChange, setCurrentValue, userInputRef, isMouseDown]);
+  useMount(function () {
+    document.addEventListener('mouseup', handleMouseUp);
+  });
+  useUnmount(function () {
+    document.removeEventListener('mouseup', handleMouseUp);
+  });
+
+  // Ref methods
   useImperativeHandle(ref, function () {
     return {
-      get ref() {
-        return containerRef;
-      },
-      get input() {
-        return inputRef;
-      },
+      ref: containerRef,
+      input: inputRef,
       getValue: function getValue() {
         return toFinite(value);
       },
-      focus: inputRef.current.focus,
-      blur: inputRef.current.blur
+      focus: function focus() {
+        var _inputRef$current3;
+        return (_inputRef$current3 = inputRef.current) === null || _inputRef$current3 === void 0 ? void 0 : _inputRef$current3.focus();
+      },
+      blur: function blur() {
+        var _inputRef$current4;
+        return (_inputRef$current4 = inputRef.current) === null || _inputRef$current4 === void 0 ? void 0 : _inputRef$current4.blur();
+      }
     };
   });
   return /*#__PURE__*/React.createElement("div", _extends({
-    className: classNames(b(), m(_defineProperty({}, size, size)), is({
-      'controls-right': controlsPositionRight
+    className: classNames(b(), m(size), is({
+      disabled: disabled,
+      'without-controls': !controls,
+      'controls-right': controls && controlsAtRight,
+      align: !!align
     }), props.className),
     style: props.style,
     ref: containerRef
-  }, tooltipEvents), /*#__PURE__*/React.createElement("span", {
+  }, tooltipEvents, {
+    onDragStart: function onDragStart(event) {
+      return event.preventDefault();
+    }
+  }), controls && /*#__PURE__*/React.createElement("span", {
     className: classNames(e(_templateObject || (_templateObject = _taggedTemplateLiteral(["decrease"]))), is({
-      disabled: disabled || value == minProp
+      disabled: minDisabled()
     })),
-    onClick: decrease
-  }, /*#__PURE__*/React.createElement(Icon, {
-    prefix: controlsPositionRight ? 'fal' : 'far',
-    name: controlsPositionRight ? 'angle-down' : 'minus'
-  })), /*#__PURE__*/React.createElement("span", {
+    role: "button",
+    "aria-label": t('el.inputNumber.decrease', {
+      lng: locale
+    }),
+    tabIndex: 0,
+    onKeyDown: function onKeyDown(event) {
+      return event.key === 'Enter' && decrease();
+    },
+    onMouseDown: function onMouseDown() {
+      decrease();
+      timerRef.current = setTimeout(function () {
+        isMouseDown.current = true;
+        timerRef.current = setInterval(function () {
+          var val = userInputRef.current !== null ? Number(userInputRef.current) || 0 : Number(displayValue) || 0;
+          var newVal = verifyValue(ensurePrecision(val, -1));
+          setUserInput(!isUndefined(precisionProp) ? newVal.toFixed(precisionProp) : newVal);
+          userInputRef.current = newVal;
+        }, 100);
+      }, 500);
+    }
+    // onClick={decrease}
+  }, decreaseIcon || /*#__PURE__*/React.createElement(Icon, {
+    name: controlsAtRight ? 'angle-down' : 'minus',
+    prefix: controlsAtRight ? 'fal' : 'far'
+  })), controls && /*#__PURE__*/React.createElement("span", {
     className: classNames(e(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["increase"]))), is({
-      disabled: disabled || value == maxProp
+      disabled: maxDisabled()
     })),
-    onClick: increase
-  }, /*#__PURE__*/React.createElement(Icon, {
-    prefix: controlsPositionRight ? 'fal' : 'far',
-    name: controlsPositionRight ? 'angle-up' : 'plus'
+    role: "button",
+    "aria-label": t('el.inputNumber.increase', {
+      lng: locale
+    }),
+    tabIndex: 0,
+    onKeyDown: function onKeyDown(event) {
+      return event.key === 'Enter' && increase();
+    },
+    onMouseDown: function onMouseDown() {
+      increase();
+      timerRef.current = setTimeout(function () {
+        isMouseDown.current = true;
+        timerRef.current = setInterval(function () {
+          var val = userInputRef.current !== null ? Number(userInputRef.current) || 0 : Number(displayValue) || 0;
+          var newVal = verifyValue(ensurePrecision(val));
+          setUserInput(!isUndefined(precisionProp) ? newVal.toFixed(precisionProp) : newVal);
+          userInputRef.current = newVal;
+        }, 100);
+      }, 500);
+    }
+    // onClick={increase}
+  }, increaseIcon || /*#__PURE__*/React.createElement(Icon, {
+    name: controlsAtRight ? 'angle-up' : 'plus',
+    prefix: controlsAtRight ? 'fal' : 'far'
   })), /*#__PURE__*/React.createElement(Input, _extends({
+    id: id,
     placeholder: placeholder,
     prefix: prefix,
     suffix: suffix,
     name: name,
-    value: value,
+    value: displayValue,
     disabled: disabled,
     readOnly: props.readOnly,
     size: size,
-    error: error,
-    warning: warning,
     clearable: false,
-    onBlur: onBlur,
-    onChange: onInput,
+    onBlur: handleBlur,
+    onFocus: handleFocus
+    // onInput={handleInput}
+    ,
+    onChange: handleInputChange,
+    onKeyDown: handleKeydown,
     maxLength: maxLength,
-    minLength: maxLength,
-    onKeyDown: useCallback(function (event) {
-      if (event.ctrlKey) {
-        isCtrlKey.current = true;
-      }
-      // 复制、粘贴和剪切可以执行
-      if (isCtrlKey.current) {
-        if (!['c', 'v', 'x'].includes(event.key)) {
-          event.preventDefault();
-        }
-      } else if (!['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', '-', '.', 'ArrowLeft', 'ArrowRight', 'Backspace', 'Delete'].includes(event.key)) {
-        event.preventDefault();
-      }
-      var val = valueRef.current;
-      if (isNotEmpty(val)) {
-        // 如果已经有小数点了，阻止输入小数点
-        if (val.toString().indexOf('.') > -1 && event.key === '.') {
-          event.preventDefault();
-        }
-        // 如果已经是负数了，阻止输入负号
-        if (val.toString().indexOf('-') > -1 && event.key === '-') {
-          event.preventDefault();
-        }
-      }
-    }, []),
-    onKeyUp: useCallback(function () {
-      isCtrlKey.current = false;
-    }, []),
+    minLength: minLength,
+    inputMode: inputmode,
     ref: inputRef
-  }, omit(htmlInputProps, ['value', 'defaultValue', 'disabled', 'size', 'onInput', 'onKeyDown', 'onKeyUp', 'size', 'onChange', 'style', 'className', 'type', 'name', 'prefix', 'readOnly', 'maxLength', 'minLength']))));
+  }, omit(htmlInputProps, ['value', 'defaultValue', 'disabled', 'size', 'onInput', 'onChange', 'onKeyDown', 'style', 'className', 'type', 'name', 'prefix', 'readOnly', 'maxLength', 'minLength']))));
 }));
 InputNumber.displayName = 'ElInputNumber';
 export default InputNumber;