fix(Tabs): fixed activation of tabs with keys that are defined but falsy

mtorromeo · Dec 20, 2023 · 184349c · 184349c
1 parent 5032e41
commit 184349c
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 3 deletions.
diff --git a/packages/core/src/components/Tabs/Tab.vue b/packages/core/src/components/Tabs/Tab.vue
@@ -90,7 +90,8 @@ defineSlots<{
 }>();
 
 const instance = getCurrentInstance();
-const key = computed(() => instance?.vnode.key ?? Symbol());
+const fallbackKey = Symbol();
+const key = computed(() => instance?.vnode.key ?? fallbackKey);
 const tabs = inject(TabsProvideKey);
 
 useChildrenTracker(TabsKey, key);

diff --git a/packages/core/src/components/Tabs/Tabs.vue b/packages/core/src/components/Tabs/Tabs.vue
@@ -111,7 +111,7 @@ import { watchEffect, nextTick, onMounted, provide, computed, type InjectionKey,
 import { useOUIAProps, type OUIAProps } from '../../helpers/ouia';
 import AngleLeftIcon from '@vue-patternfly/icons/angle-left-icon';
 import AngleRightIcon from '@vue-patternfly/icons/angle-right-icon';
-import { useEventListener } from '@vueuse/core';
+import { isDefined, useEventListener } from '@vueuse/core';
 import { provideChildrenTracker, type ChildrenTrackerInjectionKey } from '../../use';
 
 defineOptions({
@@ -155,7 +155,7 @@ if (!props.vertical) {
 }
 
 watchEffect(() => {
-  if ((!localActiveKey.value || !tabKeys.find(k => k.value === localActiveKey.value)) && tabKeys.length) {
+  if ((!isDefined(localActiveKey.value) || !tabKeys.find(k => k.value === localActiveKey.value)) && tabKeys.length) {
     localActiveKey.value = tabKeys[0].value;
   }
 });