v1.3.2

fix: support for meta+shift plane while retaining short upper chars (#26)

v1.3.1

• Add support for missing shift key (#25)

v1.3.0

• Remove restriction to clickable elements. #24
  • Before: a[href], button, summary, input[type="submit"]
  • After: Anything that's not a form field.

v1.2.4

• Merge pull request #15 from github/add-typescript-definition-file 4d003f0
• Merge branch 'master' into add-typescript-definition-file cd1cc2a
• add typescript definition file 7487d4e

v1.2.3...v1.2.4

1.2.4

Hotkey Behavior

Trigger an action on a target element when a key or sequence of keys is pressed
on the keyboard. This triggers a focus event on form fields, or a click event on
<a href="...">, <button> and <summary> elements.

By default, hotkeys are extracted from a target element's data-hotkey
attribute, but this can be overridden by passing the hotkey to the registering
function (install) as a parameter.

Multiple hotkeys are separated by a ,; key combinations are separated
by a +; and key sequences are separated by a space.

Two-keypress sequences such as g c and g i are stored
under the 'g' key in a nested object with 'c' and 'i' keys.

mappings =
  'c'     : <a href="/rails/rails/issues/new" data-hotkey="c">New Issue</a>
  'g'     :
    'c'   : <a href="/rails/rails" data-hotkey="g c">Code</a>
    'i'   : <a href="/rails/rails/issues" data-hotkey="g i">Issues</a>

In this example, both g c and c could be available as hotkeys on the
same page, but g c and g can't coexist. If the user presses
g, the c hotkey will be unavailable for 1500 ms while we
wait for either g c or g i.

Accessibility considerations

Please note that adding this functionality to your site can be a drawback for
certain users. Providing a way in your system to disable hotkeys or remap
them makes sure that those users can still use your site (given that it's
accessible to those users).

See "Understanding Success Criterion 2.1.4: Character Key Shortcuts"
for further reading on this topic.

Installation

$ npm install @github/hotkey

Usage

HTML

<a href="/page/2" data-hotkey="j">Next</a>
<a href="/help" data-hotkey="Control+h">Help</a>
<a href="/rails/rails" data-hotkey="g c">Code</a>
<a href="/search" data-hotkey="s,/">Search</a>

See the list of KeyboardEvent key values for a list of supported key values.

JS

import {install} from '@github/hotkey'

// Install all the hotkeys on the page
for (const el of document.querySelectorAll('[data-hotkey]')) {
  install(el)
}

Alternatively, the hotkey(s) can be passed to the install function as a parameter e.g.:

for (const el of document.querySelectorAll('[data-shortcut]')) {
  install(el, el.dataset.shortcut)
}

To unregister a hotkey from an element, use uninstall:

import {uninstall} from '@github/hotkey'

for (const el of document.querySelectorAll('[data-hotkey]')) {
  uninstall(el)
}

Development

npm install
npm test

License

Distributed under the MIT license. See LICENSE for details.

v1.2.3

• Merge pull request #17 from github/publish-to-gpr-as-well 27eeb72
• publish to GPR as a postpublish step 6bb7363

v1.2.2...v1.2.3

1.2.3

Hotkey Behavior

Trigger an action on a target element when a key or sequence of keys is pressed
on the keyboard. This triggers a focus event on form fields, or a click event on
<a href="...">, <button> and <summary> elements.

By default, hotkeys are extracted from a target element's data-hotkey
attribute, but this can be overridden by passing the hotkey to the registering
function (install) as a parameter.

Multiple hotkeys are separated by a ,; key combinations are separated
by a +; and key sequences are separated by a space.

Two-keypress sequences such as g c and g i are stored
under the 'g' key in a nested object with 'c' and 'i' keys.

mappings =
  'c'     : <a href="/rails/rails/issues/new" data-hotkey="c">New Issue</a>
  'g'     :
    'c'   : <a href="/rails/rails" data-hotkey="g c">Code</a>
    'i'   : <a href="/rails/rails/issues" data-hotkey="g i">Issues</a>

In this example, both g c and c could be available as hotkeys on the
same page, but g c and g can't coexist. If the user presses
g, the c hotkey will be unavailable for 1500 ms while we
wait for either g c or g i.

Accessibility considerations

Please note that adding this functionality to your site can be a drawback for
certain users. Providing a way in your system to disable hotkeys or remap
them makes sure that those users can still use your site (given that it's
accessible to those users).

See "Understanding Success Criterion 2.1.4: Character Key Shortcuts"
for further reading on this topic.

Installation

$ npm install @github/hotkey

Usage

HTML

<a href="/page/2" data-hotkey="j">Next</a>
<a href="/help" data-hotkey="Control+h">Help</a>
<a href="/rails/rails" data-hotkey="g c">Code</a>
<a href="/search" data-hotkey="s,/">Search</a>

See the list of KeyboardEvent key values for a list of supported key values.

JS

import {install} from '@github/hotkey'

// Install all the hotkeys on the page
for (const el of document.querySelectorAll('[data-hotkey]')) {
  install(el)
}

Alternatively, the hotkey(s) can be passed to the install function as a parameter e.g.:

for (const el of document.querySelectorAll('[data-shortcut]')) {
  install(el, el.dataset.shortcut)
}

To unregister a hotkey from an element, use uninstall:

import {uninstall} from '@github/hotkey'

for (const el of document.querySelectorAll('[data-hotkey]')) {
  uninstall(el)
}

Development

npm install
npm test

License

Distributed under the MIT license. See LICENSE for details.

v1.2.2

• Merge pull request #16 from github/dependabot/npm_and_yarn/lodash-4.17.15 cb313f4
• Bump lodash from 4.17.11 to 4.17.15 fb3d8d2
• 1.2.1 b20310e
• Merge pull request #14 from github/update-deps 4d85c90
• update eslint, eslint-plugin-github, flow-bin and mocha manually to latest versiosn 13f25c1
• fix shadowed variable 5ed5dfd
• run npm update 1346459
• Merge pull request #13 from github/minor-fixes a4e1835
• just use github-lint binary as lint script d66d24a
• update karma to latest version 9f8c5f2

v1.2.0...v1.2.2

v1.2.1

• Merge pull request #14 from github/update-deps 4d85c90
• update eslint, eslint-plugin-github, flow-bin and mocha manually to latest versiosn 13f25c1
• fix shadowed variable 5ed5dfd
• run npm update 1346459
• Merge pull request #13 from github/minor-fixes a4e1835
• just use github-lint binary as lint script d66d24a
• update karma to latest version 9f8c5f2

v1.2.0...v1.2.1

hotkey 1.1.0

• Add the optional 2nd argument to install(el, hotkey) to be the string hotkey to use instead of reading it from the element's data-hotkey HTML attribute.