From 111f09aa0c70cb20fbfbfb1d0e8804dc30b3fb3e Mon Sep 17 00:00:00 2001
From: Bahadir Sofuoglu <bahadirsofuoglu@gmail.com>
Date: Thu, 25 Aug 2022 16:18:05 +0300
Subject: [PATCH] review fixes

---
 .../confirmdialog/ConfirmDialog.vue           |  3 +-
 src/views/confirmdialog/ConfirmDialogDoc.vue  | 33 +++++++++++++++++++
 2 files changed, 34 insertions(+), 2 deletions(-)

diff --git a/src/components/confirmdialog/ConfirmDialog.vue b/src/components/confirmdialog/ConfirmDialog.vue
index 1cf5ebd20..5dee6d61b 100644
--- a/src/components/confirmdialog/ConfirmDialog.vue
+++ b/src/components/confirmdialog/ConfirmDialog.vue
@@ -5,8 +5,7 @@
             <i :class="iconClass" />
             <span class="p-confirm-dialog-message">{{ message }}</span>
         </template>
-        <component v-else :is="$slots.message"
-        :message="confirmation"></component>
+        <component v-else :is="$slots.message" :message="confirmation"></component>
         <template #footer>
             <CDButton :label="rejectLabel" :icon="rejectIcon" :class="rejectClass" @click="reject()" :autofocus="autoFocusReject"/>
             <CDButton :label="acceptLabel" :icon="acceptIcon" :class="acceptClass" @click="accept()" :autofocus="autoFocusAccept" />
diff --git a/src/views/confirmdialog/ConfirmDialogDoc.vue b/src/views/confirmdialog/ConfirmDialogDoc.vue
index b28028cd3..03b68c9e5 100644
--- a/src/views/confirmdialog/ConfirmDialogDoc.vue
+++ b/src/views/confirmdialog/ConfirmDialogDoc.vue
@@ -92,6 +92,21 @@ export default {
     }
 }
 
+</code></pre>
+
+        <h5>Templating</h5>
+        <p>Templating allows customizing the content where the message instance is available as the implicit variable.</p>
+<pre v-code><code><template v-pre>
+&lt;ConfirmPopup group="demo">
+    &lt;template #message="slotProps"&gt;
+        &lt;div class="flex p-4"&gt;
+            &lt;i :class="slotProps.message.icon" style="font-size: 1.5rem"&gt;&lt;/i&gt;
+            &lt;p class="pl-2"&gt;{{slotProps.message.message}}&lt;/p&gt;
+        &lt;/div&gt;
+    &lt;/template&gt;
+&lt;/ConfirmPopup&gt;
+
+</template>
 </code></pre>
 
         <h5>Responsive</h5>
@@ -263,6 +278,24 @@ 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>message</td>
+                        <td>-</td>
+                    </tr>
+				</tbody>
+			</table>
+		</div>
+
 		<h5>Styling</h5>
 		<p>ConfirmDialog inherits all the classes from the Dialog component, visit <router-link to="/dialog">dialog</router-link> for more information.</p>
 		<div class="doc-tablewrapper">