From 91e50020507ac66992dfb52b3e0ad1a1ae5614b5 Mon Sep 17 00:00:00 2001
From: Neil Richter <me@neilrichter.com>
Date: Fri, 5 Apr 2024 14:11:31 +0200
Subject: [PATCH] feat(Accordion): add `unmount` prop to allow lazy mounting
 for heavy components (#1590)

---
 src/runtime/components/elements/Accordion.vue | 32 +++++++++++++++----
 1 file changed, 25 insertions(+), 7 deletions(-)

diff --git a/src/runtime/components/elements/Accordion.vue b/src/runtime/components/elements/Accordion.vue
index 0e1adc86..d3b16a5e 100644
--- a/src/runtime/components/elements/Accordion.vue
+++ b/src/runtime/components/elements/Accordion.vue
@@ -39,13 +39,27 @@
         @before-leave="onBeforeLeave"
         @leave="onLeave"
       >
-        <div v-show="open">
-          <HDisclosurePanel :class="[ui.item.base, ui.item.size, ui.item.color, ui.item.padding]" static>
-            <slot :name="item.slot || 'item'" :item="item" :index="index" :open="open" :close="close">
-              {{ item.content }}
-            </slot>
-          </HDisclosurePanel>
-        </div>
+        <HDisclosurePanel
+          v-if="unmount"
+          :class="[ui.item.base, ui.item.size, ui.item.color, ui.item.padding]"
+          unmount
+        >
+          <slot :name="item.slot || 'item'" :item="item" :index="index" :open="open" :close="close">
+            {{ item.content }}
+          </slot>
+        </HDisclosurePanel>
+        <template v-else>
+          <div v-show="open">
+            <HDisclosurePanel
+              :class="[ui.item.base, ui.item.size, ui.item.color, ui.item.padding]"
+              static
+            >
+              <slot :name="item.slot || 'item'" :item="item" :index="index" :open="open" :close="close">
+                {{ item.content }}
+              </slot>
+            </HDisclosurePanel>
+          </div>
+        </template>
       </Transition>
     </HDisclosure>
   </div>
@@ -91,6 +105,10 @@ export default defineComponent({
       type: String,
       default: () => config.default.openIcon
     },
+    unmount: {
+      type: Boolean,
+      default: false
+    },
     closeIcon: {
       type: String,
       default: () => config.default.closeIcon