The KeyboardEvent.key attribute is the way forward to handling keyboard events in JS, and it's based on the UI Events and UI Events key specifications. React ensures that the property is poly-filled across browsers.
This pull request adds all the reserved "named key attribute values" from the UI Events key spec and plops them into a subclass of KeyboardEvent as string constants.
I was contemplating enum'ing these up sort of like ReactStyle's Display property values for example, but I chose not to because:
The key attribute uses arbitrary string for all Unicode printable characters like "Q", "3", "ß", " ", etc.
Having it be a Union<string, NamedKey> would prevent using the key attribute to be used in a switch statement for handling keys like:
switch (ev.Key)
{
case NamedKeys.ArrowUp: /*...*/ break;
case NamedKeys.ArrowLeft: /*...*/ break;
case NamedKeys.ArrowDown: /*...*/ break;
case NamedKeys.ArrowRight: /*...*/ break;
case "W": /*...*/ break;
case "A": /*...*/ break;
case "S": /*...*/ break;
case "D": /*...*/ break;
default: /*...*/ break;
}
(which makes code a lot more readable)
These named key values are currently being used internally on our Select Boxes, Search Box, and Date Picker components. I think it makes sense for these constants to be exposed by Bridge.React since they relate directly to KeyboardEvent.key, and this prevents us from duplicating the effort across projects.
The
KeyboardEvent.key
attribute is the way forward to handling keyboard events in JS, and it's based on the UI Events and UI Events key specifications. React ensures that the property is poly-filled across browsers.This pull request adds all the reserved "named key attribute values" from the UI Events key spec and plops them into a subclass of
KeyboardEvent
as string constants.I was contemplating enum'ing these up sort of like ReactStyle's Display property values for example, but I chose not to because:
key
attribute uses arbitrary string for all Unicode printable characters like "Q", "3", "ß", " ", etc.key
attribute to be used in a switch statement for handling keys like:(which makes code a lot more readable)
These named key values are currently being used internally on our Select Boxes, Search Box, and Date Picker components. I think it makes sense for these constants to be exposed by Bridge.React since they relate directly to
KeyboardEvent.key
, and this prevents us from duplicating the effort across projects.