feat(api): adds directive closeButton and update buttons demo with ne… (#132)

…w Close Button component

Author: pavankjadda

projects/ng-kit-demo/src/app/buttons-demo/buttons-demo.component.html

@@ -19,6 +19,7 @@
 	<delete-button (onClick)="setDeleteLoading($event)" [loading]="loading" class="m-3" label="Delete Button"></delete-button>
 
 	<hr />
+	<button closeButton mat-raised-button>Close Button</button>
 	<manage-button class="m-3"></manage-button>
 	<search-button class="m-3"></search-button>
 	<pdf-export-button class="m-3"></pdf-export-button>

projects/ng-kit-demo/src/app/buttons-demo/buttons-demo.component.ts

@@ -1,6 +1,8 @@
-import { Component } from '@angular/core';
+import { ChangeDetectionStrategy, Component } from '@angular/core';
+import { MatButtonModule } from '@angular/material/button';
 import {
 	BsLinkButtonComponent,
+	CloseButtonDirective,
 	DeleteButtonComponent,
 	EditBsButtonComponent,
 	EditButtonComponent,
@@ -34,8 +36,11 @@ import {
 		SearchButtonComponent,
 		SuccessButtonComponent,
 		DeleteButtonComponent,
+		CloseButtonDirective,
+		MatButtonModule,
 	],
 	templateUrl: './buttons-demo.component.html',
+	changeDetection: ChangeDetectionStrategy.OnPush,
 	styles: [],
 })
 export class ButtonsDemoComponent {

projects/ng-kit/src/lib/components/buttons/close-button/close-button.directive.ts

@@ -0,0 +1,13 @@
+import { Directive, ElementRef, inject, Renderer2 } from '@angular/core';
+
+@Directive({
+	selector: '[closeButton]',
+})
+export class CloseButtonDirective {
+	elementRef = inject(ElementRef);
+	renderer = inject(Renderer2);
+
+	constructor() {
+		this.renderer.addClass(this.elementRef.nativeElement, 'secondary-button');
+	}
+}

projects/ng-kit/src/public-api.ts

@@ -1,9 +1,9 @@
 import { ProgressState } from './lib/types/progress-state';
 
 export * from './lib/components/alert/alert.component';
-export * from './lib/components/spinner/spinner.component';
-export * from './lib/components/ngx-spinner/ngx-spinner.service';
 export * from './lib/components/ngx-spinner/ngx-spinner.component';
+export * from './lib/components/ngx-spinner/ngx-spinner.service';
+export * from './lib/components/spinner/spinner.component';
 
 // Export autocomplete component
 export * from './lib/components/autocomplete/autocomplete.component';
@@ -14,19 +14,20 @@ export * from './lib/directives/prevent-multiple-clicks/prevent-multiple-clicks.
 
 // Export buttons
 export * from './lib/components/buttons/bs-link-button/bs-link-button.component';
+export * from './lib/components/buttons/close-button/close-button.directive';
 export * from './lib/components/buttons/delete-button/delete-button.component';
-export * from './lib/components/buttons/edit-button/edit-button.component';
 export * from './lib/components/buttons/edit-bs-button/edit-bs-button.component';
+export * from './lib/components/buttons/edit-button/edit-button.component';
 export * from './lib/components/buttons/edit-svg-icon-button/edit-svg-icon-button.component';
+export * from './lib/components/buttons/excel-export-button/excel-export-button.component';
 export * from './lib/components/buttons/manage-button/manage-button.component';
+export * from './lib/components/buttons/pdf-export-button/pdf-export-button.component';
+export * from './lib/components/buttons/primary-button/primary-button.component';
 export * from './lib/components/buttons/save-primary-button/save-primary-button.component';
 export * from './lib/components/buttons/search-button/search-button.component';
 export * from './lib/components/buttons/success-button/success-button.component';
 export * from './lib/components/buttons/view-button/view-button.component';
 export * from './lib/components/buttons/view-primary-button/view-primary-button.component';
-export * from './lib/components/buttons/primary-button/primary-button.component';
-export * from './lib/components/buttons/pdf-export-button/pdf-export-button.component';
-export * from './lib/components/buttons/excel-export-button/excel-export-button.component';
 
 // Export dialogs
 export * from './lib/components/confirm-dialog/confirm-dialog.component';
@@ -38,8 +39,8 @@ export * from './lib/svg-icons/edit-solid-svg/edit-solid-svg.component';
 export * from './lib/services/mat-snack-bar.service';
 
 // Export store and entity store services
-export * from './lib/store/store';
 export * from './lib/store/entity-store';
+export * from './lib/store/store';
 
 // Export progress state
 export * from './lib/util/progress-util';