From 91adefbd24b2e6a837fe732e2f132049eda9dc87 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Barnab=C3=A1s=20Pataki?= <barnabas.vac@gmail.com>
Date: Fri, 11 Dec 2020 16:55:24 +0100
Subject: [PATCH] fix: cv-tabs fails in focusout event when using router-link
 in a tab (#1084)

* fix #1083: cv-tabs fails in focusout event when using router-link in a tab

* fix #1083: fix build errors

Co-authored-by: Lee Chase <leechase@live.com>
---
 packages/core/src/components/cv-tabs/cv-tabs.vue | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/packages/core/src/components/cv-tabs/cv-tabs.vue b/packages/core/src/components/cv-tabs/cv-tabs.vue
index 7119d78ab..f80856cc2 100644
--- a/packages/core/src/components/cv-tabs/cv-tabs.vue
+++ b/packages/core/src/components/cv-tabs/cv-tabs.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="cv-tabs" @focusout="onFocusout" @focusin="onFocusin" style="width: 100%;">
+  <div class="cv-tabs" ref="tabs" style="width: 100%;">
     <div
       data-tabs
       :class="[`cv-tab ${carbonPrefix}--tabs`, { [`${carbonPrefix}--tabs--container`]: container }]"
@@ -89,6 +89,14 @@ export default {
     this.$on('cv:disabled', srcComponent => this.onCvDisabled(srcComponent));
     this.$on('cv:enabled', srcComponent => this.onCvEnabled(srcComponent));
   },
+  mounted() {
+    this.$refs.tabs.addEventListener('focusout', this.onFocusout);
+    this.$refs.tabs.addEventListener('focusin', this.onFocusin);
+  },
+  beforeDestroy() {
+    this.$refs.tabs.removeEventListener('focusout', this.onFocusout);
+    this.$refs.tabs.removeEventListener('focusin', this.onFocusin);
+  },
   computed: {
     triggerStyleOverride() {
       // <style carbon tweaks - DO NOT USE STYLE TAG as it causes SSR issues