From 6e2678d1d8a498322eb3eff909ccbba55e40a2b7 Mon Sep 17 00:00:00 2001
From: Vitta <57635138+emavitta@users.noreply.github.com>
Date: Tue, 4 Jun 2024 10:23:17 +0200
Subject: [PATCH] feat(Tabs): add `content` prop to avoid the render of the
 HTML markup (#1831)

Co-authored-by: Benjamin Canac <canacb1@gmail.com>
---
 docs/content/2.components/tabs.md          | 2 ++
 src/runtime/components/navigation/Tabs.vue | 6 +++++-
 2 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/docs/content/2.components/tabs.md b/docs/content/2.components/tabs.md
index 26c05023..ac74c853 100644
--- a/docs/content/2.components/tabs.md
+++ b/docs/content/2.components/tabs.md
@@ -63,6 +63,8 @@ componentProps:
 ---
 ::
 
+You can use the `content` prop and set it to `false` to avoid the rendering of the HTML content if you don't need it.
+
 ### Control the selected index
 
 Use a `v-model` to control the selected index.
diff --git a/src/runtime/components/navigation/Tabs.vue b/src/runtime/components/navigation/Tabs.vue
index bacb3e41..0504edf6 100644
--- a/src/runtime/components/navigation/Tabs.vue
+++ b/src/runtime/components/navigation/Tabs.vue
@@ -32,7 +32,7 @@
       </HTab>
     </HTabList>
 
-    <HTabPanels :class="ui.container">
+    <HTabPanels v-if="content" :class="ui.container">
       <HTabPanel v-for="(item, index) of items" :key="index" v-slot="{ selected }" :class="ui.base" :unmount="unmount">
         <slot :name="item.slot || 'item'" :item="item" :index="index" :selected="selected">
           {{ item.content }}
@@ -88,6 +88,10 @@ export default defineComponent({
       type: Boolean,
       default: false
     },
+    content: {
+      type: Boolean,
+      default: true
+    },
     class: {
       type: [String, Object, Array] as PropType<any>,
       default: () => ''