react-native-numeric-input
react-native-numeric-input copied to clipboard
[BUG] - isMax has the inverted value only when keyboard input is provided
Update made a pull request fixing the bug
Description
When i provide keyboard input (this does not happen with button input) the isMax in the limit reached callback is false for the upper limit and true for the lower limit. This happends on both Android and iOS.
Steps to reproduce the behavior:
- provide a minimum and maximum value, in my case these are dynamic
- set a onLimit callback and console log the isMax and msg values
- provide a value out of the range from the keyboard
Code
<NumericInput key={numericInputReRender} value={fromRaw(configuration.temperatureUnit, configuration.minTemp, true)} onChange={handleMinTemperatureChange} onLimitReached={(isMax, msg) => {handleMinTemperatureLimit(isMax); console.log(isMax, msg)}} totalWidth={165} totalHeight={50} minValue={fromRaw(configuration.temperatureUnit, -640, true)} maxValue={fromRaw(configuration.temperatureUnit, configuration.maxTemp, true) - 1} step={1} valueType="real" rounded textColor={ColorScheme.TextPrimary} iconStyle={{ color: ColorScheme.TextSecondary }} rightButtonBackgroundColor={ColorScheme.AccentPrimary} leftButtonBackgroundColor={ColorScheme.AccentPrimary} borderColor={ColorScheme.AccentPrimary} />
I can guarantee that the value, min and max are provided correctly as i tested it without all these abstractions in my implementation.
Expected behavior Getting the isMax values correctly when providing keyboard input the same way it happens when i provide input from the increment and decrement buttons.
Screenshots
the msg variable seems to point to the correct limit and is the opposite of what isMax indicates
Enviorment
- Version: [email protected]
- React Native version: 11.3.7
- Device: iPhone 15 Pro Max (emulator), Motorola g30 (real device)
- Device OS: iOS 16, Android 13
- Expo version: 0.10.14
Additional context The behaviour for the increment and decrement buttons works as expected this only happens with keyboard input
After taking a look at the source code i saw the bug. in the onBlur function when the minimum value is hit the limit callback is called like this:
isMax should be false
this.props.onLimitReached(true, 'Reached Minimum Value!')
and inside the dec function the limit callback is called like this:
isMax is false which is consistent
this.props.onLimitReached(false, 'Reached Minimum Value!')
the same thing happens for the maximum limit.