palantir/blueprint

NumericInput - prevent exceeding min or max when typing or pasting values

Open

#2,071 opened on Feb 2, 2018

View on GitHub
 (2 comments) (0 reactions) (0 assignees)TypeScript (20,263 stars) (2,167 forks)batch import
Package: coreType: enhancementhelp wanted

Description

Current NumericInput implementation caps properly at bounds when using the mouse, but when one types or pastes a value, the input should prevent typing a value exceeding the limits, it currently does not and users can type garbage.

One way to prevent this is, until a solution appears, is to check again the bounds in the onValueChange event, but is redundant.

Contributor guide

Tech stack
typescriptreacthtmlcss
Domain
frontend
Issue type
bug
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
3
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
1-3 hours
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
stale
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
clear
Prerequisites
React state handlingNumericInput component APIinput event handlingbounds validation
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
70
Research direction
Examine the NumericInput component's onValueChange event handler in the Blueprint source code (likely in packages/core/src/components/forms/numericInput*.ts). The existing implementation enforces min/max bounds for mouse interactions; replicate that logic for typed/pasted input. Ensure validation occurs before updating state, preventing values outside the range. Check for any existing onBlur validation that might duplicate this effort.