ember-keyboard

ember-keyboard

ember-keyboard, an Ember addon for the painless support of keyboard events.

Features

• Dynamic priority levels allow you to specify which components respond first to key events and under what circumstances. (Thanks to ember-key-responder for the inspiration)
• Human-readable key-mappings. (Thanks to ember-keyboard-service for the inspiration)
• Support for keyup, keydown, and keypress, as well as the modifier keys: ctrl, alt, shift, and meta.
• Compatible with Ember 2.0+.

Accessibility Considerations

In order to avoid adding keyboard shortcuts to your application that are already in use by assistive technology, please review the existing keyboard shortcuts and gestures available today: https://dequeuniversity.com/screenreaders/.

Installation

ember install ember-keyboard

Documentation & Demo

You can find interactive documentation here.

Changelog

Upgrading from ember-keyboard 5.0.0 to 6.0.0

ember-keyboard 6.0.0-beta.1 introduces new APIs to bring ember-keyboard into the Ember Octane era. The old mixins-based API still works but is deprecated in this release and slated for removal in version 7.

Version 6 requires Ember 3.8 or higher, so if you are on a version of Ember before that, you should stick with 5.0.0 until you are able to upgrade your app's Ember version.

If your app is on a recent version of Ember, you are good to go. The path is to upgrade to ember-keyboard 6.x and you can iteratively update to the new APIs until you have no more deprecation warnings left.

The deprecations page discusses migration paths for each warning you may encounter, but our broader advice is to consider moving as much of your keyboard handling logic to templates as possible. We think that you'll find the on-key helper and modifier to be very convenient to work with. The decorator API (which required ember 3.10 or higher) is closest equivalent to the mixins API, but it should be used sparingly in situations where the template approach isn't a good fit.

There is one other potential breaking change to be aware of when upgrading from v5 to v6: ember-keyboard versions before 6.0 had an ambiguous API when it came to specifying key combos and required the use of code identifiers, like KeyT, Digit1, etc. Be sure to read the docs regarding key vs. code properties and be sure you are specifying the key combo consistent with your intended behavior. You will likely find that you want to update some key combos to the key equivalent. e.g. replace ctrl+KeyT with ctrl+t.