Fixed #3217

api-generator/components/sidebar.js

@@ -60,11 +60,19 @@ const SidebarEvents = [
     }
 ];
 
+const SidebarSlots = [
+    {
+        name: "header",
+        description: "Custom content for the component's header"
+    }
+];
+
 module.exports = {
     sidebar: {
         name: "Sidebar",
         description: "Sidebar is a panel component displayed as an overlay at the edges of the screen.",
         props: SidebarProps,
-        events: SidebarEvents
+        events: SidebarEvents,
+        slots: SidebarSlots
     }
 };

src/components/sidebar/Sidebar.d.ts

@@ -13,6 +13,7 @@ declare class Sidebar extends Vue {
     $emit(eventName: 'hide'): this;
     $slots: {
         '': VNode[];
+        'header': VNode[];
     }
 }
 

src/components/sidebar/Sidebar.vue

@@ -5,14 +5,7 @@
                 <div v-if="$slots.header" class="p-sidebar-header-content">
                     <slot name="header"></slot>
                 </div>
-                <button
-                    class="p-sidebar-close p-sidebar-icon p-link"
-                    @click="hide"
-                    :aria-label="ariaCloseLabel"
-                    v-if="showCloseIcon"
-                    type="button"
-                    v-ripple
-                >
+                <button class="p-sidebar-close p-sidebar-icon p-link" @click="hide" :aria-label="ariaCloseLabel" v-if="showCloseIcon" type="button" v-ripple>
                     <span class="p-sidebar-close-icon pi pi-times" />
                 </button>
             </div>

src/views/sidebar/SidebarDoc.vue

@@ -131,6 +131,24 @@ import Sidebar from 'primevue/sidebar';
 					</table>
 				</div>
 
+				<h5>Slots</h5>
+                <div class="doc-tablewrapper">
+                    <table class="doc-table">
+                        <thead>
+                            <tr>
+                                <th>Name</th>
+                                <th>Parameters</th>
+                            </tr>
+                        </thead>
+                        <tbody>
+                            <tr>
+                                <td>header</td>
+                                <td>-</td>
+                            </tr>
+                        </tbody>
+                    </table>
+                </div>
+
 				<h5>Styling</h5>
 				<p>Following is the list of structural style classes, for theming classes visit <router-link to="/theming">theming</router-link> page.</p>
 				<div class="doc-tablewrapper">

src/views/slider/SliderDoc.vue

@@ -146,24 +146,6 @@ export default {
 					</table>
 				</div>
 
-                <h5>Slots</h5>
-                <div class="doc-tablewrapper">
-                    <table class="doc-table">
-                        <thead>
-                            <tr>
-                                <th>Name</th>
-                                <th>Parameters</th>
-                            </tr>
-                        </thead>
-                        <tbody>
-                            <tr>
-                                <td>header</td>
-                                <td>-</td>
-                            </tr>
-                        </tbody>
-                    </table>
-                </div>
-
 				<h5>Styling</h5>
 				<p>Following is the list of structural style classes, for theming classes visit <router-link to="/theming">theming</router-link> page.</p>
 				<div class="doc-tablewrapper">