https://github.com/applitools/modifier-keys
A declarative library designed to handle modifier key states
https://github.com/applitools/modifier-keys
browser keyboard-events keys modifier
Last synced: 7 months ago
JSON representation
A declarative library designed to handle modifier key states
- Host: GitHub
- URL: https://github.com/applitools/modifier-keys
- Owner: applitools
- License: mit
- Created: 2017-10-09T08:18:56.000Z (over 8 years ago)
- Default Branch: master
- Last Pushed: 2018-08-30T17:17:03.000Z (over 7 years ago)
- Last Synced: 2025-09-20T18:50:24.248Z (7 months ago)
- Topics: browser, keyboard-events, keys, modifier
- Language: JavaScript
- Homepage:
- Size: 99.6 KB
- Stars: 0
- Watchers: 4
- Forks: 2
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Modifier Keys · [](https://www.npmjs.com/package/modifier-keys) [](https://travis-ci.org/applitools/modifier-keys) [](https://codecov.io/gh/applitools/modifier-keys)
A declarative library designed to handle modifier key states across multiple systems
## Introduction
Instead of checking whether Command is pressed on macOS or control on Windows, using Modifier Keys you check for `primaryKey` and `secondaryKey`
- Primary Key - set to be Command or Control depending on the operating system
- Secondary Key - set to be Alt
Can also parse key commands to string according to the environment (e.g. `Ctrl+C`)
## Installation
Using [Yarn](https://yarnpkg.com/):
```sh
yarn add modifier-keys
```
Using [npm](https://www.npmjs.com/):
```sh
npm install modifier-keys --save
```
Importing:
```js
import Modifier from 'modifier-keys';
```
## Usage
### Closure Usage
The Modifier closure takes a function that takes an event handler as its first argument, it then adds the primary and secondary key states onto it.
```jsx
import Modifier from 'modifier-keys';
function handleKeyDown(e) {
e.primaryKey; // bool
e.secondaryKey; //bool
}
```
### Function Usage
You can also import a function that directly takes the event instead of using a closure on the handler like so
```jsx
import { modifier } from 'modifier-keys';
function handleKeyDown(e) {
let event = modifier(e);
event.primaryKey; // bool
event.secondaryKey; //bool
}
```
### Command Parser Usage
Takes a `key` (string that will be capitalized) and `options`
```js
import { parse } from 'modifier-keys';
parse('c', { primaryKey: true }); // ⌘C or Ctrl+C
```
#### Options
- `primaryKey` - bool, to include or not the environment's primary key
- `secondaryKey` - bool, to include or not the environment's secondary key