@famence/js-keycodes

js-keycodes

Key-Codes as constants and helper functions to identify characters

Installation

NPM	Yarn
npm i -S @famence/js-keycodes	yarn add @famence/js-keycodes

Available Key Codes Constants

import { keyCodes } from '@famence/js-keycodes';

keyCodes.ENTER === 13;
// -> true
keyCodes.F12 === 123;
// -> true

window.addEventListener('keyup', (e) => {
  if (e.keyCode === keyCodes.ENTER) {
    console.log('ENTER was pressed');
  }
});

Constant Name	Key Code value
ENTER	13
ESC	27
BACKSPACE	8
TAB	9
SHIFT	16
CTRL	17
ALT	18
SPACE	32
PAUSE	19
PAGE_UP	33
PAGE_DOWN	34
END	35
HOME	36
LEFT	37
UP	38
RIGHT	39
DOWN	40
INSERT	45
DELETE	46
F1	112
F2	113
F3	114
F4	115
F5	116
F6	117
F7	118
F8	119
F9	120
F10	121
F11	122
F12	123
DOT	190
DOT_NUMPAD	110
COMA	188
COMA_NUMPAD	0
A	65
B	66
C	67
D	68
E	69
F	70
G	71
H	72
I	73
J	74
K	75
L	76
M	77
N	78
O	79
P	80
Q	81
R	82
S	83
T	84
U	85
V	86
W	87
X	88
Y	89
Z	90
ZERO	48
ONE	49
TWO	50
THREE	51
FOUR	52
FIVE	53
SIX	54
SEVEN	55
EIGHT	56
NINE	57
ZERO_NUMPAD	96
ONE_NUMPAD	97
TWO_NUMPAD	98
THREE_NUMPAD	99
FOUR_NUMPAD	100
FIVE_NUMPAD	101
SIX_NUMPAD	102
SEVEN_NUMPAD	103
EIGHT_NUMPAD	104
NINE_NUMPAD	105

Helper functions

import * as KeyCodes from '@famence/js-keycodes';

Or individual functions:

import { isLetter, isNumber } from '@famence/js-keycodes';

Verify if a keyCode is a letter

import { isLetter, keyCodeToString } from '@famence/js-keycodes';

window.addEventListener('keyup', (e) => {
  if (isLetter(e.keyCode)) {
    const char = keyCodeToString(e.keyCode);
    console.log(`"${char}" was pressed`);
  }
});

Verify if ENTER is pressed on an event

import { keyCodes } from '@famence/js-keycodes';

const handleAnEvent = (event) => {
  if (event.keyCode === keyCodes.ENTER) {
    // Do your stuff here.
  }
};

KeyCodes.isNumber()

Return true if the keyCode is a number from 0 to 9.

KeyCodes.isLetter()

Return true if the keyCode is a letter from A to Z.

KeyCodes.isNavigation()

Return true if the keyCode represents an Arrow key ⬆️, ⬇️, ⬅️ or ➡️.

KeyCodes.isWhitespace()

Return true if the keyCode represent ENTER, SPACE or TAB

KeyCodes.isF1ToF12()

Return true if the keyCode represent any of the F buttons from F1 to F12

KeyCodes.keyCodeToString()

Return a string representation of the keyCode.

import { keyCodeToString } from '@famence/js-keycodes';

const myLetter = keyCodeToString(90);
// -> 'Z'

const myNumber = keyCodeToString(50);
//  '2'

KeyCodes.getKeyNameFromKeyCode()

Return a string representation based on the programmatic name of the keyCode

import { getKeyNameFromKeyCode } from '@famence/js-keycodes';

const myLetter = getKeyNameFromKeyCode(90);
// -> 'Z'

const myNumber = getKeyNameFromKeyCode(50);
// -> 'TWO'

const myKey = getKeyNameFromKeyCode(13);
// -> 'ENTER'

const myF = getKeyNameFromKeyCode(121);
// -> 'F10'