From 8844f097455d0e10c6e997937b3aac1faa48585a Mon Sep 17 00:00:00 2001
From: emilhe <emil.h.eriksen@gmail.com>
Date: Sat, 3 Feb 2024 11:51:44 +0100
Subject: [PATCH] Preparing 1.0.11 release

---
 CHANGELOG.md                              |  6 ++++++
 package-lock.json                         |  2 +-
 package.json                              |  2 +-
 pyproject.toml                            |  2 +-
 src/lib/components/EventListener.react.js | 12 +++++++++---
 src/lib/components/Keyboard.react.js      | 17 +++++++++++------
 6 files changed, 29 insertions(+), 12 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index d40cf4c..e3498c6 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -2,6 +2,12 @@
 
 All notable changes to this project will be documented in this file.
 
+## [1.0.11] - 03-02-23
+
+### Changed
+
+- Add `useCapture` property to `EventListener` and `Keyboard` components, thereby fixing [#255](https://github.com/emilhe/dash-extensions/issues/255).
+
 ## [1.0.10] - 03-02-23
 
 ### Changed
diff --git a/package-lock.json b/package-lock.json
index 466e504..95cab3c 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,6 +1,6 @@
 {
   "name": "dash-extensions",
-  "version": "1.0.10",
+  "version": "1.0.11",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
diff --git a/package.json b/package.json
index 83887ad..64fbf7a 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "dash-extensions",
-  "version": "1.0.10",
+  "version": "1.0.11",
   "description": "Extensions for Plotly Dash.",
   "main": "build/index.js",
   "scripts": {
diff --git a/pyproject.toml b/pyproject.toml
index 164ddcc..5600238 100644
--- a/pyproject.toml
+++ b/pyproject.toml
@@ -1,6 +1,6 @@
 [tool.poetry]
 name = "dash-extensions"
-version = "1.0.10"
+version = "1.0.11"
 description = "Extensions for Plotly Dash."
 authors = ["emher <emil.h.eriksen@gmail.com>"]
 license = "MIT"
diff --git a/src/lib/components/EventListener.react.js b/src/lib/components/EventListener.react.js
index 5d3a38c..56921b9 100644
--- a/src/lib/components/EventListener.react.js
+++ b/src/lib/components/EventListener.react.js
@@ -35,12 +35,12 @@ export default class EventListener extends Component {
 
     componentDidMount() {
         const events = this.props.events.map(o => o["event"]);
-        this.getSources().forEach(s => events.forEach(e => s.addEventListener(e, this.eventHandler, false)));
+        this.getSources().forEach(s => events.forEach(e => s.addEventListener(e, this.eventHandler, this.props.useCapture)));
     }
 
     componentWillUnmount() {
         const events = this.props.events.map(o => o["event"]);
-        this.getSources().forEach(s => events.forEach(e => s.removeEventListener(e, this.eventHandler, false)));
+        this.getSources().forEach(s => events.forEach(e => s.removeEventListener(e, this.eventHandler, this.props.useCapture)));
     }
 
     render() {
@@ -55,6 +55,7 @@ EventListener.defaultProps = {
     event: {},
     n_events: 0,
     logging: false,
+    useCapture: false
 };
 
 EventListener.propTypes = {
@@ -107,6 +108,11 @@ EventListener.propTypes = {
     /**
      * The number of events fired.
      */
-    n_events: PropTypes.number
+    n_events: PropTypes.number,
+
+    /**
+     * Value of useCapture used when registering event listeners.
+     */
+    useCapture: PropTypes.bool
 
 };
diff --git a/src/lib/components/Keyboard.react.js b/src/lib/components/Keyboard.react.js
index a6cfd88..7694217 100644
--- a/src/lib/components/Keyboard.react.js
+++ b/src/lib/components/Keyboard.react.js
@@ -50,13 +50,13 @@ export default class Keyboard extends Component {
     }
 
     componentDidMount() {
-        this.getSources().forEach(s => s.addEventListener("keydown", this.keydownHandler, false));
-        this.getSources().forEach(s =>  s.addEventListener("keyup", this.keyupHandler, false));
+        this.getSources().forEach(s => s.addEventListener("keydown", this.keydownHandler, this.props.useCapture));
+        this.getSources().forEach(s =>  s.addEventListener("keyup", this.keyupHandler, this.props.useCapture));
     }
 
     componentWillUnmount() {
-        this.getSources().forEach(s => s.removeEventListener("keydown", this.keydownHandler, false));
-        this.getSources().forEach(s => s.removeEventListener("keyup", this.keyupHandler, false));
+        this.getSources().forEach(s => s.removeEventListener("keydown", this.keydownHandler, this.props.useCapture));
+        this.getSources().forEach(s => s.removeEventListener("keyup", this.keyupHandler, this.props.useCapture));
     }
 
     render() {
@@ -70,7 +70,8 @@ Keyboard.defaultProps = {
     eventProps: ["key", "altKey", "ctrlKey", "shiftKey","metaKey", "repeat"],
     n_keydowns: 0,
     n_keyups: 0,
-    keys_pressed: {}
+    keys_pressed: {},
+    useCapture: false
 };
 
 
@@ -143,7 +144,11 @@ Keyboard.propTypes = {
      /**
      * A counter, which is incremented on each key up event, similar to n_clicks for buttons.
      */
-    n_keyups: PropTypes.number
+    n_keyups: PropTypes.number,
 
+    /**
+     * Value of useCapture used when registering event listeners.
+     */
+    useCapture: PropTypes.bool
 
 };
\ No newline at end of file