From 37138a4d73e8f6825a3a7bab67213d3956a8520b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Ula=C5=9F=20Turan?= Date: Thu, 10 Nov 2022 13:53:25 +0300 Subject: [PATCH] Fix #3595: Add maxLength prop to InputNumber Component. Fix typo on inputmask and autocomplete. Add doc and api generator value of maxLength prop to inputnumber. --- api-generator/components/autocomplete.js | 2 +- api-generator/components/inputmask.js | 2 +- api-generator/components/inputnumber.js | 6 ++++++ components/doc/autocomplete/apidoc.js | 2 +- components/doc/inputmask/apidoc.js | 2 +- components/doc/inputnumber/apidoc.js | 6 ++++++ components/lib/inputnumber/InputNumber.js | 9 +++++++++ components/lib/inputnumber/inputnumber.d.ts | 1 + 8 files changed, 26 insertions(+), 4 deletions(-) diff --git a/api-generator/components/autocomplete.js b/api-generator/components/autocomplete.js index 884baff243..c0a57f17d6 100644 --- a/api-generator/components/autocomplete.js +++ b/api-generator/components/autocomplete.js @@ -162,7 +162,7 @@ const AutoCompleteProps = [ description: 'When present, it specifies that the component should be disabled.' }, { - name: 'maxlength', + name: 'maxLength', type: 'number', default: 'null', description: 'Maximum number of character allows in the input field.' diff --git a/api-generator/components/inputmask.js b/api-generator/components/inputmask.js index c09d660c12..2640bd9c65 100644 --- a/api-generator/components/inputmask.js +++ b/api-generator/components/inputmask.js @@ -66,7 +66,7 @@ const InputMaskProps = [ description: 'Size of the input field.' }, { - name: 'maxlength', + name: 'maxLength', type: 'number', default: 'null', description: 'Maximum number of character allows in the input field.' diff --git a/api-generator/components/inputnumber.js b/api-generator/components/inputnumber.js index 668658a4b4..a4ea3ff233 100644 --- a/api-generator/components/inputnumber.js +++ b/api-generator/components/inputnumber.js @@ -207,6 +207,12 @@ const InputNumberProps = [ default: 'null', description: 'Size of the input field.' }, + { + name: 'maxLength', + type: 'number', + default: 'null', + description: 'Maximum number of character allows in the input field.' + }, { name: 'style', type: 'string', diff --git a/components/doc/autocomplete/apidoc.js b/components/doc/autocomplete/apidoc.js index dd496f9c4f..52c06faba0 100644 --- a/components/doc/autocomplete/apidoc.js +++ b/components/doc/autocomplete/apidoc.js @@ -205,7 +205,7 @@ export function ApiDoc(props) { When present, it specifies that the component should be disabled. - maxlength + maxLength number null Maximum number of character allows in the input field. diff --git a/components/doc/inputmask/apidoc.js b/components/doc/inputmask/apidoc.js index 5c3d4a6756..2c18d0d494 100644 --- a/components/doc/inputmask/apidoc.js +++ b/components/doc/inputmask/apidoc.js @@ -87,7 +87,7 @@ export function ApiDoc(props) { Size of the input field. - maxlength + maxLength number null Maximum number of character allows in the input field. diff --git a/components/doc/inputnumber/apidoc.js b/components/doc/inputnumber/apidoc.js index 1795ca534d..52ed4171e2 100644 --- a/components/doc/inputnumber/apidoc.js +++ b/components/doc/inputnumber/apidoc.js @@ -239,6 +239,12 @@ export function ApiDoc(props) { null Size of the input field. + + maxLength + number + null + Maximum number of character allows in the input field. + style string diff --git a/components/lib/inputnumber/InputNumber.js b/components/lib/inputnumber/InputNumber.js index 0c1728d46e..21b7714677 100644 --- a/components/lib/inputnumber/InputNumber.js +++ b/components/lib/inputnumber/InputNumber.js @@ -199,6 +199,10 @@ export const InputNumber = React.memo( let currentValue = parseValue(inputRef.current.value) || 0; let newValue = validateValue(currentValue + step); + if (props.maxLength && props.maxLength < formatValue(newValue).length) { + return; + } + // touch devices trigger the keyboard to display because of setSelectionRange !DomHandler.isTouchDevice() && updateInput(newValue, null, 'spin'); updateModel(event, newValue); @@ -809,6 +813,10 @@ export const InputNumber = React.memo( let selectionStart = inputEl.selectionStart; let selectionEnd = inputEl.selectionEnd; + if (props.maxLength && props.maxLength < newValue.length) { + return; + } + inputEl.value = newValue; let newLength = newValue.length; @@ -1168,6 +1176,7 @@ InputNumber.defaultProps = { localeMatcher: undefined, max: null, maxFractionDigits: undefined, + maxLength: null, min: null, minFractionDigits: undefined, mode: 'decimal', diff --git a/components/lib/inputnumber/inputnumber.d.ts b/components/lib/inputnumber/inputnumber.d.ts index e2b4dabd73..dfb02afcb3 100644 --- a/components/lib/inputnumber/inputnumber.d.ts +++ b/components/lib/inputnumber/inputnumber.d.ts @@ -47,6 +47,7 @@ export interface InputNumberProps extends Omit