From 304073471927d7ec9079b8c7a2157dfea13a85c3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C3=87etin?=
 <69278826+cetincakiroglu@users.noreply.github.com>
Date: Fri, 24 Dec 2021 16:44:50 +0300
Subject: [PATCH] add loading buttons

---
 src/app/demo/view/buttondemo.component.html | 8 ++++++++
 src/app/demo/view/buttondemo.component.ts   | 7 +++++++
 2 files changed, 15 insertions(+)

diff --git a/src/app/demo/view/buttondemo.component.html b/src/app/demo/view/buttondemo.component.html
index f90232c..7375c63 100644
--- a/src/app/demo/view/buttondemo.component.html
+++ b/src/app/demo/view/buttondemo.component.html
@@ -135,5 +135,13 @@
 			<button pButton pRipple type="button" icon="pi pi-heart" class="p-button-rounded p-button-help p-button-outlined mr-2 mb-2"></button>
 			<button pButton pRipple type="button" icon="pi pi-times" class="p-button-rounded p-button-danger p-button-outlined mr-2 mb-2"></button>
 		</div>
+
+		<div class="card">
+			<h5>Loading</h5>
+			<p-button label="Search" icon="pi pi-search" class="mr-2 mb-2" [loading]="loading[0]" (onClick)="load(0)"></p-button>
+			<p-button label="Search" icon="pi pi-search" iconPos="right" class="mr-2 mb-2" [loading]="loading[1]" (onClick)="load(1)"></p-button>
+			<p-button icon="pi pi-search" class="mr-2 mb-2" [loading]="loading[2]" (onClick)="load(2)"></p-button>
+			<p-button label="Search" class="mr-2 mb-2" [loading]="loading[3]" (onClick)="load(3)"></p-button>
+		</div>
 	</div>
 </div>
diff --git a/src/app/demo/view/buttondemo.component.ts b/src/app/demo/view/buttondemo.component.ts
index 49262e6..3e4a058 100644
--- a/src/app/demo/view/buttondemo.component.ts
+++ b/src/app/demo/view/buttondemo.component.ts
@@ -8,6 +8,8 @@ export class ButtonDemoComponent implements OnInit {
 
     items: MenuItem[];
 
+    loading = [false, false, false, false]
+
     ngOnInit() {
         this.items = [
             {label: 'Update', icon: 'pi pi-refresh'},
@@ -17,4 +19,9 @@ export class ButtonDemoComponent implements OnInit {
             {label: 'Setup', icon: 'pi pi-cog'}
         ];
     }
+
+    load(index) {
+        this.loading[index] = true;
+        setTimeout(() => this.loading[index] = false, 1000);
+    }
 }