From d8f62f010aaaefae0f4ef061f844f458ed8abafd Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Thu, 11 Apr 2019 20:13:52 +0200
Subject: [PATCH] fix tippy for suggestions

---
 .../Components/Routes/Suggestions/index.vue   | 21 ++++++++++++++++---
 1 file changed, 18 insertions(+), 3 deletions(-)

diff --git a/examples/Components/Routes/Suggestions/index.vue b/examples/Components/Routes/Suggestions/index.vue
index d4f28a077..6d96c6419 100644
--- a/examples/Components/Routes/Suggestions/index.vue
+++ b/examples/Components/Routes/Suggestions/index.vue
@@ -159,6 +159,7 @@ export default {
       filteredUsers: [],
       navigatedUserIndex: 0,
       insertMention: () => {},
+      observer: null,
     }
   },
 
@@ -222,20 +223,35 @@ export default {
         interactive: true,
         theme: 'dark',
         placement: 'top-start',
-        performance: true,
         inertia: true,
         duration: [400, 200],
         showOnInit: true,
         arrow: true,
         arrowType: 'round',
       })
+
+      // we have to update tippy whenever the DOM is updated
+      if (MutationObserver) {
+        this.observer = new MutationObserver(() => {
+          this.popup.popperInstance.scheduleUpdate()
+        })
+        this.observer.observe(this.$refs.suggestions, {
+          childList: true,
+          subtree: true,
+          characterData: true,
+        })
+      }
     },
 
     destroyPopup() {
       if (this.popup) {
-        this.popup.destroyAll()
+        this.popup.destroy()
         this.popup = null
       }
+
+      if (this.observer) {
+        this.observer.disconnect()
+      }
     },
 
   },
@@ -244,7 +260,6 @@ export default {
 
 <style lang="scss">
 @import "~variables";
-@import '~modules/tippy.js/dist/tippy.css';
 
 .mention {
   background: rgba($color-black, 0.1);