Better handling blur events on popovers

kijtra · Jun 1, 2020 · c53d938 · c53d938
1 parent abd60c5
commit c53d938
Show file tree

Hide file tree

Showing 3 changed files with 30 additions and 3 deletions.
diff --git a/src/js/base/module/ImagePopover.js b/src/js/base/module/ImagePopover.js
@@ -16,9 +16,18 @@ export default class ImagePopover {
     this.options = context.options;
 
     this.events = {
-      'summernote.disable summernote.blur': () => {
+      'summernote.disable summernote.dialog.shown': () => {
         this.hide();
       },
+      'summernote.blur': (we, e) => {
+        if (e.originalEvent && e.originalEvent.relatedTarget) {
+          if (!this.$popover[0].contains(e.originalEvent.relatedTarget)) {
+            this.hide();
+          }
+        } else {
+          this.hide();
+        }
+      },
     };
   }
 

diff --git a/src/js/base/module/LinkPopover.js b/src/js/base/module/LinkPopover.js
@@ -12,9 +12,18 @@ export default class LinkPopover {
       'summernote.keyup summernote.mouseup summernote.change summernote.scroll': () => {
         this.update();
       },
-      'summernote.disable summernote.dialog.shown summernote.blur': () => {
+      'summernote.disable summernote.dialog.shown': () => {
         this.hide();
       },
+      'summernote.blur': (we, e) => {
+        if (e.originalEvent && e.originalEvent.relatedTarget) {
+          if (!this.$popover[0].contains(e.originalEvent.relatedTarget)) {
+            this.hide();
+          }
+        } else {
+          this.hide();
+        }
+      },
     };
   }
 

diff --git a/src/js/base/module/TablePopover.js b/src/js/base/module/TablePopover.js
@@ -16,9 +16,18 @@ export default class TablePopover {
       'summernote.keyup summernote.scroll summernote.change': () => {
         this.update();
       },
-      'summernote.disable summernote.blur': () => {
+      'summernote.disable summernote.dialog.shown': () => {
         this.hide();
       },
+      'summernote.blur': (we, e) => {
+        if (e.originalEvent && e.originalEvent.relatedTarget) {
+          if (!this.$popover[0].contains(e.originalEvent.relatedTarget)) {
+            this.hide();
+          }
+        } else {
+          this.hide();
+        }
+      },
     };
   }