# shared-event-listeners

> A utility for minimising the number of event listeners bound on a given DOM element.

Latest version **0.1.2** (published 2016-02-09) · MIT license · 0 weekly downloads

## Install

```sh
npm install shared-event-listeners
pnpm add shared-event-listeners
yarn add shared-event-listeners
bun add shared-event-listeners
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.1.2 |
| Published | 2016-02-09 |
| First published | 2016-02-09 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | Lim Yuan Qing |
| Maintainers | yuanqing |
| Keywords | addEventListener, document, dom, event, handler, html, listener, removeEventListener, shared, window |

## Links

- npm: https://www.npmjs.com/package/shared-event-listeners
- Repository: https://github.com/yuanqing/shared-event-listeners
- Homepage: https://github.com/yuanqing/shared-event-listeners#readme
- Issues: https://github.com/yuanqing/shared-event-listeners/issues
- npm.io page: https://npm.io/package/shared-event-listeners

## Alternatives

- [@tsparticles/shape-image](https://npm.io/package/@tsparticles/shape-image.md) — 303.7K weekly downloads
- [@tsparticles/shape-line](https://npm.io/package/@tsparticles/shape-line.md) — 233.7K weekly downloads
- [stringify-attributes](https://npm.io/package/stringify-attributes.md) — 58.6K weekly downloads
- [mobile-drag-drop](https://npm.io/package/mobile-drag-drop.md) — 46.3K weekly downloads
- [@comunica/actor-rdf-parse-html](https://npm.io/package/@comunica/actor-rdf-parse-html.md) — 29.2K weekly downloads

## Recent versions

- 0.1.2 (latest) — 2016-02-09
- 0.1.1 — 2016-02-09
- 0.1.0 — 2016-02-09

## README

# shared-event-listeners [![npm Version](http://img.shields.io/npm/v/shared-event-listeners.svg?style=flat)](https://www.npmjs.com/package/shared-event-listeners) [![Build Status](https://img.shields.io/travis/yuanqing/shared-event-listeners.svg?branch=master&style=flat)](https://travis-ci.org/yuanqing/shared-event-listeners) [![Coverage Status](https://img.shields.io/coveralls/yuanqing/shared-event-listeners.svg?style=flat)](https://coveralls.io/r/yuanqing/shared-event-listeners)

> A utility for minimising the number of event listeners bound on a given DOM element.

## Example

```js
import sharedEventListeners from 'shared-event-listeners';

const button = document.querySelector('.button');
const eventListeners = sharedEventListeners(button);

function foo() {
  console.log('foo');
}
const removeFooListener = eventListeners.add('click', foo);

function bar() {
  console.log('bar');
}
const removeBarListener = eventListeners.add('click', bar);
```

Both the `foo` and `bar` listeners are called when we click on the `.button`. However, only **one** event listener is actually bound on the `.button`. (Internally, said event listener calls `foo` and `bar` in turn on the `click` event.)

Each call to `add` returns a function for removing the particular listener. In our example, the one event listener that was bound will be removed after we call **both** `removeFooListener` and `removeBarListener`.

```js
removeFooListener();
removeBarListener();
```

Run the [example](example/):

```
$ git clone https://github.com/yuanqing/shared-event-listeners
$ npm install
$ npm install --global gulp
$ gulp example --open
```

## API

```js
import sharedEventListeners from 'shared-event-listeners';
```

### const eventListeners = sharedEventListeners([element])

- `element` — A DOM element. Defaults to `window`.

### eventListeners.add(eventName, listener)

*Analogous to calling `addEventListener`.* Returns a function for removing the listener.

- `eventName` — A string.
- `listener` — A function that is called when an event of the specified `eventName` occurs.

### eventListeners.remove(eventName, listener)

*Analogous to calling `removeEventListener`.*

- `eventName` — A string.
- `listener` — The function to be removed.

## Installation

Install via [npm](https://npmjs.com):

```
$ npm i --save shared-event-listeners
```

## License

[MIT](LICENSE.md)

---
_Source: https://npm.io/package/shared-event-listeners · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._