Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/quickey/quickey
⚡️ Quickey creates keyboard shortcuts for your web apps
https://github.com/quickey/quickey
keyboard shortcuts
Last synced: 2 months ago
JSON representation
⚡️ Quickey creates keyboard shortcuts for your web apps
- Host: GitHub
- URL: https://github.com/quickey/quickey
- Owner: quickey
- License: mit
- Created: 2018-10-17T05:41:35.000Z (almost 6 years ago)
- Default Branch: master
- Last Pushed: 2023-02-04T09:20:31.000Z (over 1 year ago)
- Last Synced: 2024-04-20T08:03:40.767Z (6 months ago)
- Topics: keyboard, shortcuts
- Language: TypeScript
- Homepage:
- Size: 4.86 MB
- Stars: 35
- Watchers: 4
- Forks: 1
- Open Issues: 17
-
Metadata Files:
- Readme: README.md
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
Awesome Lists containing this project
README
⚡️Quickey creates keyboard shortcuts for your web apps## Intro
Quickey is a tool that helps you bind keyboard keys to actions in your web app. You can bind multiple actions to specific elements in your page to help your users navigate your application more efficiently and easily. It also includes UI elements that can be easily integrated into your web app. For example, The **Quickey Legend** element:
Checkout [@quickey/ui](packages/ui/README.md) for details.
## Quickey Start
If you want a quick intro about how to use Quickey, we suggest that you jump to the [@quickey/core](packages/core/README.md) package or read the next sections.
## Install
Quickey can be installed via [npm](https://www.npmjs.com):
```sh
$ npm install --save @quickey/core
```Or via [yarn](https://yarnpkg.com):
```sh
$ yarn add @quickey/core
```Or using the [CDN](https://unpkg.com):
```html
```
Or the minified version:
```html```
## Usage
```javascript
import { createQuickey } from "@quickey/core";// Or when using the UMD module
const createQuickey = Quickey.core.createQuickey;
// First, create a new Quickey instance
const quickey = createQuickey();// Adding actions to your quickey is simple as
quickey
.addAction({
id: "god",
keys: "I > D > D > Q > D",
alias: [{ keys: 'Ctrl + G' }],
callback: (keyBinding, target) => {
console.log("GOD Mode!");
}
});// Remove action
quickey
.removeAction("god");
```
Checkout [@quickey/core](packages/core/README.md) for more options.For your convenience, we created this [**Fiddle**](http://jsfiddle.net/udidu/y6phe5ok/9/), so you can take Quickey for a quick spin.
## Packages
Quickey is built over a few independant packages. Each one can be used by installing via the npm or by importing the UMD module from the CDN.
Each package has its own documentations, explore the list of packages below.### Lib ⚙️
- [@quickey/core](packages/core/README.md)
- [@quickey/binder](packages/binder/README.md)
- [@quickey/keyboard](packages/keyboard/README.md)### UI 🌈
- [@quickey/ui](packages/ui/README.md)
- [@quickey/react](packages/react/README.md)
- ~~@quickey/vue~~
- ~~@quickey/angular~~## Reporting Issues
We use GitHub Issues as the official bug tracker for Quickey. Here are some advices for our users that want to report an issue:
1. Make sure that you are using the latest version of Quickey. The issue that you are about to report may be already fixed in the latest master branch version: https://github.com/quickey/quickey/tree/master.
2. Providing us reproducible steps for the issue will shorten the time it takes for it to be fixed. A JSFiddle is always welcomed, and you can start from this [basic one](http://jsfiddle.net/udidu/y6phe5ok/9/).
3. Some issues may be browser specific, so specifying in what browser you encountered the issue might help.## Contributions
Pull requests are welcome. For major changes, please [open an issue](https://github.com/quickey/quickey/issues/new/choose) first to discuss what you would like to change.
This project is built as monorepo. In the packages folder you can find all it's packages.
For more information about monorepos, checkout [Lerna](https://github.com/lerna/lerna/blob/master/README.md) docs.Please make sure to update tests as appropriate.
## Todo
- [x] Give Quickey a Star and become a Stargazer!
- [x] Add alias to key binding
- [x] Support single key binding
- [x] Finish documentations for all packages
- [ ] Add more UI elements to [@quickey/ui](./packages/ui/README.md)
- [ ] Create the `@quickey/vue` package
- [ ] Create the `@quickey/angular` package## License
This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details
## Links
* [JavaScript Event KeyCodes](https://keycode.info/)