Toast message templating added docs

primefaces · Nov 19, 2021 · 0bd138b · 0bd138b
1 parent bad5179
commit 0bd138b
Show file tree

Hide file tree

Showing 3 changed files with 31 additions and 2 deletions.
diff --git a/api-generator/components/toast.js b/api-generator/components/toast.js
@@ -31,10 +31,18 @@ const ToastProps = [
     }
 ];
 
+const ToastSlots = [
+    {
+        name: "message",
+        description: "Custom content for the component."
+    }
+];
+
 module.exports = {
     toast: {
         name: "Toast",
         description: "Toast is used to display messages in an overlay.",
-        props: ToastProps
+        props: ToastProps,
+        slots: ToastSlots
     }
 };
diff --git a/src/components/toast/Toast.d.ts b/src/components/toast/Toast.d.ts
@@ -1,11 +1,14 @@
-import Vue from 'vue';
+import Vue, { VNode } from 'vue';
 
 declare class Toast extends Vue {
     group?: string;
     position?: string;
     autoZIndex?: boolean;
     baseZIndex?: number;
     breakpoints?: {[key: string]: string};
+    $slots: {
+        message: VNode[];
+    }
 }
 
 export default Toast;
diff --git a/src/views/toast/ToastDoc.vue b/src/views/toast/ToastDoc.vue
@@ -249,6 +249,24 @@ this.$toast.removeAllGroups();
 					</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>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">