feat(#3): add slots to CTList

Realityloop · Sep 17, 2024 · 299c011 · 299c011
1 parent 5eeb213
commit 299c011
Showing 1 changed file with 16 additions and 1 deletion.
diff --git a/src/components/List.vue b/src/components/List.vue
@@ -18,7 +18,7 @@
       </div>
 
       <!-- Filters -->
-      <div v-if="(filters || []).length > 0 || $scopedSlots.filters" class="ct-list__filters">
+      <div v-if="filters?.length > 0 || $scopedSlots.filters" class="ct-list__filters">
         <div class="container">
           <div class="row">
             <div class="col-xxs-12">
@@ -30,6 +30,13 @@
         </div>
       </div>
 
+      <!-- Slot: Body Top -->
+      <div v-if="$slots['body_top']" class="ct-list__body-top">
+        <div class="container">
+          <slot name="body_top" />
+        </div>
+      </div>
+
       <!-- Body -->
       <div class="ct-list__body">
         <div
@@ -39,6 +46,7 @@
           <div class="container">
             <div class="row">
               <div class="col-xxs-12">
+                <!-- Item Grid -->
                 <div class="ct-item-grid__items">
                   <div class="row">
                     <slot>
@@ -67,6 +75,13 @@
         </div>
       </div>
 
+      <!-- Slot: Body Bottom -->
+      <div v-if="$slots['body_bottom']" class="ct-list__body-bottom">
+        <div class="container">
+          <slot name="body_bottom" />
+        </div>
+      </div>
+
       <!-- Pager -->
       <div v-if="(pager && pages) || $scopedSlots.pager" class="ct-list__results-below">
         <div class="container">