From a2d537bfe2eb818466b2eb604bc4b5f1943dac79 Mon Sep 17 00:00:00 2001
From: Francisco Hodge <hello@franciscohodge.com>
Date: Thu, 9 Jun 2022 22:58:10 -0700
Subject: [PATCH] Ensure caret position is not lost when using
 syncInstanceInputs. Fixes
 https://github.com/hodgef/react-simple-keyboard/issues/1948

---
 src/lib/components/Keyboard.ts | 23 ++++++++++++++++++++++-
 1 file changed, 22 insertions(+), 1 deletion(-)

diff --git a/src/lib/components/Keyboard.ts b/src/lib/components/Keyboard.ts
index 2ea0bdd3..ab0c8475 100644
--- a/src/lib/components/Keyboard.ts
+++ b/src/lib/components/Keyboard.ts
@@ -887,6 +887,7 @@ class SimpleKeyboard {
     }
 
     this.keyboardDOM.className = this.keyboardDOMClass;
+    this.keyboardDOM.setAttribute("data-skInstance", this.currentInstanceName);
     this.buttonElements = {};
   }
 
@@ -1157,10 +1158,20 @@ class SimpleKeyboard {
     }
 
     this.dispatch((instance) => {
-      const isKeyboard =
+      let isKeyboard =
         event.target === instance.keyboardDOM ||
         (event.target && instance.keyboardDOM.contains(event.target));
 
+      /**
+       * If syncInstanceInputs option is enabled, make isKeyboard match any instance
+       * not just the current one
+       */
+      if (this.options.syncInstanceInputs && Array.isArray(event.path)) {
+        isKeyboard = event.path.some((item: HTMLElement) =>
+          item?.hasAttribute?.("data-skInstance")
+        );
+      }
+
       if (
         (targetTagName === "textarea" ||
           (targetTagName === "input" &&
@@ -1297,6 +1308,11 @@ class SimpleKeyboard {
      */
     this.activeInputElement = null;
 
+    /**
+     * Removing instance attribute
+     */
+    this.keyboardDOM.removeAttribute("data-skInstance");
+
     /**
      * Clearing keyboardDOM
      */
@@ -1677,6 +1693,11 @@ class SimpleKeyboard {
       useTouchEventsClass
     );
 
+    /**
+     * Adding keyboard identifier
+     */
+    this.keyboardDOM.setAttribute("data-skInstance", this.currentInstanceName);
+
     /**
      * Create row wrapper
      */