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: about 1 month 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 (about 7 years ago)
• Default Branch: master
• Last Pushed: 2018-08-30T17:17:03.000Z (over 6 years ago)
• Last Synced: 2024-04-14T04:52:39.249Z (8 months ago)
• Topics: browser, keyboard-events, keys, modifier
• Language: JavaScript
• Homepage:
• Size: 99.6 KB
• Stars: 0
• Watchers: 5
• Forks: 2
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Modifier Keys · [![npm version](https://img.shields.io/npm/v/modifier-keys.svg)](https://www.npmjs.com/package/modifier-keys) [![Build Status](https://travis-ci.org/applitools/modifier-keys.svg?branch=master)](https://travis-ci.org/applitools/modifier-keys) [![Coverage Status](https://img.shields.io/codecov/c/github/applitools/modifier-keys.svg)](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