vue-shortcut

A declarative Vue wrapper for jkup's shortcut library. This component exposes methods that, when used, bind event listeners to common keyboard shortcuts.

Shortcuts

Shortcut	Event Name

  j    |   nextItem
  k    |   prevItem
  n    |   newItem
  o    |   openItem
  /    |   searchItems
  .    |   loadItems
  ?    |   showHelp

Installation

Install the package from npm by running

$ npm install --save vue-shortcut

or

$ yarn add vue-shortcut

Usage

Import, register and place the component in your Vue app. Attach a function to react to any of the events listed above for example 'v-on:nextItem="doSomething"' or '@nextItem="doSomething"'.

<template>
  <VueShortcut @nextItem="goForward" @prevItem="goBack" />
</template>
 
<script>
import VueShortcut from 'vue-shortcut';
 
export default {
  components: {
    VueShortcut
  }
}
</script> 

Dev

Running dev and example scripts require @vue/cli and @vue/cli-service-global to be installed. Install globally by running

$ npm install --save --g @vue/cli @vue/cli-service-global

or

$ yarn add global vue/cli @vue/cli-service-global

Contributing

This project is open to and encourages contributions! Feel free to discuss any bug fixes/features in the issues. If you wish to work on this project:

1. Fork the project
2. Create your feature branch (git checkout -b new-feature-branch)
3. Commit your changes (git commit -am 'add new feature')
4. Push to the branch (git push origin new-feature-branch)
5. Submit a pull request!