search

palantir / blueprint

A React-based UI toolkit for the web
https://blueprintjs.com/
Apache License 2.0
20.67k stars 2.17k forks source link

Override ↑↓ keyboard events on numeric input #3650

Open jdpaterson opened 5 years ago

jdpaterson commented 5 years ago

Environment

Feature request

Hi, I would like to be able to disable, or better yet override, the up down keyboard presses when focused in a NumericInput. Currently we are forced to increment by a step value. Not sure if this conflicts with any design standards but thought I'd put it up.

Thanks

Examples

adidahiya commented 5 years ago

Can you explain your use case a bit more? Is incrementing by a certain minor/major step size insufficient? How?

Related: https://github.com/palantir/blueprint/issues/3553

jdpaterson commented 5 years ago

My use case is that I have a grid of NumericInputs, and when I press the arrow keys left-down-up-right , I want to change focus to the corresponding NumericInput in that position.

adidahiya commented 5 years ago

Ok, for that use case, I can see how the component makes it difficult to implement your design. One idea I had was to accept a return value from NumericInput's onKeyDown / onKeyPress and if it's false we could exit early:

https://github.com/palantir/blueprint/blob/7b5592b779c0e5b88e81f3452f149ea897704c7f/packages/core/src/components/forms/numericInput.tsx#L431

... but moving that props.onKeyDown call to earlier in the handler is unfortunately a small breaking change (it currently gets called after props.onValueChange, and this would change it to be called before).

Another approach would be to add a prop like disableKeyInteractions: boolean, but you'd be losing a lot of functionality which the component provides out of the box...