|
1 | 1 | # EventListener |
2 | 2 | Modern event listener for efficient applications based on the [subscribe-publish](https://hackernoon.com/do-you-still-register-window-event-listeners-in-each-component-react-in-example-31a4b1f6f1c8) pattern. |
3 | 3 |
|
| 4 | +**EventListener** is less than 900 bytes when minified, but packs a surprising amount of power. |
| 5 | + |
4 | 6 | # NPM |
5 | 7 | ``` |
6 | 8 | npm install event-listener.js |
7 | 9 | ``` |
8 | 10 |
|
9 | 11 | # Package Features |
10 | | -* *EventListener* is ES6+ sourced with TypeScript definitions; |
11 | | -* *EventListener* comes with ES6, ES5 and ESM packaging, all in `/dist` folder; |
12 | | -* *EventListener* makes use of the native [Map](https://caniuse.com/mdn-javascript_builtins_map) to subscribe/register or unsubscribe/remove listeners, which is perfect since we need to make sure the exact listeners are added/removed; |
13 | | -* *EventListener* allows you to register multiple listeners for the same target, even of the same type, but always uses a single `globalListener` to call them all at once when event is triggered; |
14 | | -* *EventListener* "should" be able to manage event options, especially `once`, meaning that when the option is `true`, the listener is automatically un-subscribed and detached from target; |
15 | | -* *EventListener* will unsubscribe and detach listeners with the same options used when attached, which means you can "lazy" remove listeners on the fly. |
| 12 | +* **EventListener** is ES6+ sourced with TypeScript definitions; |
| 13 | +* **EventListener** comes with ES6, ES5 and ESM packaging, all in `/dist` folder; |
| 14 | +* **EventListener** makes use of the native [Map](https://caniuse.com/mdn-javascript_builtins_map) to subscribe/register or unsubscribe/remove listeners, which is perfect since we need to make sure the exact listeners are added/removed; |
| 15 | +* **EventListener** allows you to register multiple listeners for the same target, even of the same type, but always uses a single `globalListener` to call them all at once when event is triggered; |
| 16 | +* **EventListener** "should" be able to manage event options, especially `once`, meaning that when the option is `true`, the listener is automatically un-subscribed and detached from target; |
| 17 | +* **EventListener** will unsubscribe and detach listeners with the same options used when attached, which means you can "lazy" remove listeners on the fly. |
16 | 18 |
|
17 | 19 | # Use |
18 | 20 |
|
@@ -63,9 +65,14 @@ Map(1) { |
63 | 65 | if (documentClickListeners && documentClickListeners.has(handleMyClick)) { |
64 | 66 | // do something about it |
65 | 67 | } |
| 68 | + |
| 69 | +// get listener options |
| 70 | +const myListenerOptions = documentClickListeners && documentClickListeners.get(handleMyClick)); |
| 71 | + |
| 72 | +// returns { once: true } |
66 | 73 | ``` |
67 | 74 |
|
68 | | -For advanced use, check out the [demo](./demo/index.html), showcasing the *EventListener* usage with a demo component. |
| 75 | +For advanced use, check out the [demo](./demo/index.html), showcasing the **EventListener** usage with a demo component. |
69 | 76 |
|
70 | 77 | # License |
71 | | -*EventListener* is released under the [MIT License](https://github.com/thednp/event-listener.js/blob/main/LICENSE). |
| 78 | +**EventListener** is released under the [MIT License](https://github.com/thednp/event-listener.js/blob/main/LICENSE). |
0 commit comments