@wordpress/keycodes Edit

Keycodes utilities for WordPress, used to check the key pressed in events like onKeyDown. Contains keycodes constants for keyboard keys like DOWN, UP, ENTER, etc.

Installation #Installation

Install the module

npm install @wordpress/keycodes --save

This package assumes that your code will run in an ES2015+ environment. If you’re using an environment that has limited or no support for ES2015+ such as lower versions of IE then using core-js or @babel/polyfill will add support for these methods. Learn more about it in Babel docs.

Top ↑

Usage #Usage

Check which key was used in an onKeyDown event:

import { DOWN, ENTER } from '@wordpress/keycodes';

// [...]

onKeyDown( event ) {
    const { keyCode } = event;

    if ( keyCode === DOWN ) {
        alert( 'You pressed the down arrow!' );
    } else if ( keyCode === ENTER ) {
        alert( 'You pressed the enter key!' );
    } else {
        alert( 'You pressed another key.' );
    }
}

Top ↑

API #API

# ALT

Keycode for ALT key.

# BACKSPACE

Keycode for BACKSPACE key.

# COMMAND

Keycode for COMMAND/META key.

# CTRL

Keycode for CTRL key.

# DELETE

Keycode for DELETE key.

# displayShortcut

An object that contains functions to display shortcuts.
E.g. displayShortcut.primary( ‘m’ ) will return ‘⌘M’ on Mac.

Type

• Object Keyed map of functions to display shortcuts.

# displayShortcutList

Return an array of the parts of a keyboard shortcut chord for display
E.g displayShortcutList.primary( ‘m’ ) will return [ ‘⌘’, ‘M’ ] on Mac.

Type

• Object keyed map of functions to shortcut sequences

# DOWN

Keycode for DOWN key.

# ENTER

Keycode for ENTER key.

# ESCAPE

Keycode for ESCAPE key.

# F10

Keycode for F10 key.

# isKeyboardEvent

An object that contains functions to check if a keyboard event matches a
predefined shortcut combination.
E.g. isKeyboardEvent.primary( event, ‘m’ ) will return true if the event
signals pressing ⌘M.

Type

• Object Keyed map of functions to match events.

# LEFT

Keycode for LEFT key.

# modifiers

Object that contains functions that return the available modifier
depending on platform.

• primary: takes a isApple function as a parameter.
• primaryShift: takes a isApple function as a parameter.
• primaryAlt: takes a isApple function as a parameter.
• secondary: takes a isApple function as a parameter.
• access: takes a isApple function as a parameter.
• ctrl
• alt
• ctrlShift
• shift
• shiftAlt

# rawShortcut

An object that contains functions to get raw shortcuts.
E.g. rawShortcut.primary( ‘m’ ) will return ‘meta+m’ on Mac.
These are intended for user with the KeyboardShortcuts component or TinyMCE.

Type

• Object Keyed map of functions to raw shortcuts.

# RIGHT

Keycode for RIGHT key.

# SHIFT

Keycode for SHIFT key.

# shortcutAriaLabel

An object that contains functions to return an aria label for a keyboard shortcut.
E.g. shortcutAriaLabel.primary( ‘.’ ) will return ‘Command + Period’ on Mac.

# SPACE

Keycode for SPACE key.

# TAB

Keycode for TAB key.

# UP

Keycode for UP key.