@js-smart/ng-kit 18.0.0

package/fesm2022/js-smart-ng-kit.mjs

@@ -0,0 +1,1872 @@
+import * as i0 from '@angular/core';
+import { input, signal, Component, Injectable, Pipe, Input, ViewChild, HostListener, output, Optional, Directive, EventEmitter, Output, Inject } from '@angular/core';
+import * as i1$5 from '@angular/common';
+import { CommonModule, AsyncPipe, NgStyle } from '@angular/common';
+import * as i1 from '@angular/material/progress-spinner';
+import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
+import { BehaviorSubject, Subject, throttleTime } from 'rxjs';
+import { filter, takeUntil, startWith, map } from 'rxjs/operators';
+import { trigger, state, style, transition, animate } from '@angular/animations';
+import * as i1$1 from '@angular/platform-browser';
+import * as i1$2 from '@angular/forms';
+import { ReactiveFormsModule } from '@angular/forms';
+import * as i3 from '@angular/material/autocomplete';
+import { MatAutocompleteModule } from '@angular/material/autocomplete';
+import * as i2 from '@angular/material/form-field';
+import { MatFormFieldModule } from '@angular/material/form-field';
+import * as i5 from '@angular/material/input';
+import { MatInputModule } from '@angular/material/input';
+import * as i1$3 from '@angular/material/button';
+import { MatButtonModule, MatAnchor, MatButton } from '@angular/material/button';
+import * as i1$4 from '@angular/material/icon';
+import { MatIconModule, MatIcon } from '@angular/material/icon';
+import * as i4 from '@angular/material/core';
+import * as i1$6 from '@angular/material/dialog';
+import { MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog';
+import * as i3$1 from '@angular/material/divider';
+import { MatDividerModule } from '@angular/material/divider';
+import * as i1$7 from '@angular/material/snack-bar';
+import { MAT_SNACK_BAR_DATA } from '@angular/material/snack-bar';
+
+/**
+ * Boostrap Alert component that can be used to alert messages to the user
+ *
+ * @author Pavan Kumar Jadda
+ * @since 12.0.0
+ */
+class AlertComponent {
+    constructor(cdr) {
+        this.cdr = cdr;
+        /**
+         * Type of the BootStrap Alert. Following values are supported. See BootStrap docs for more information
+         * <pre>
+         *   1. info
+         *   2. primary
+         *   3. secondary
+         *   4. success
+         *   5. warning
+         *   6. danger
+         *   7. dark
+         *   8. light
+         * </pre>
+         */
+        this.type = input('info');
+        /**
+         *  Is alert visible or open
+         */
+        this.isOpen = input(true);
+        /**
+         *  Writable signal for isOpen
+         */
+        this.open = signal(this.isOpen());
+        /**
+         * If set, displays an inline “Close” button
+         */
+        this.dismissible = input(true);
+        /**
+         * If set, dismisses the alert after Dismiss Timeout
+         */
+        this.dismissOnTimeout = input(true);
+        /**
+         * Number in milliseconds, after which alert will be closed. Default value is 5000 ms
+         */
+        this.dismissTimeout = input(5000);
+        /**
+         * Additional classes to be added to the alert. This can be used to add custom styles to the alert
+         */
+        this.class = input('');
+    }
+    /**
+     * Initialize the component and settings
+     *
+     * @author Pavan Kumar Jadda
+     * @since 12.0.0
+     */
+    ngOnInit() {
+        this.openAlert();
+        if (this.dismissOnTimeout()) {
+            setTimeout(() => {
+                this.closeAlert();
+                this.cdr.markForCheck();
+            }, this.dismissTimeout());
+        }
+    }
+    /**
+     * Closes BootStrap Alert if not open
+     *
+     * @author Pavan Kumar Jadda
+     * @since 12.0.0
+     */
+    closeAlert() {
+        if (!this.isOpen()) {
+            return;
+        }
+        this.open.set(false);
+    }
+    /**
+     * Opens Bootstrap Alert
+     *
+     * @author Pavan Kumar Jadda
+     * @since 12.0.0
+     */
+    openAlert() {
+        this.open.set(true);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: AlertComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0", type: AlertComponent, isStandalone: true, selector: "lib-alert, alert", inputs: { type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, isOpen: { classPropertyName: "isOpen", publicName: "isOpen", isSignal: true, isRequired: false, transformFunction: null }, dismissible: { classPropertyName: "dismissible", publicName: "dismissible", isSignal: true, isRequired: false, transformFunction: null }, dismissOnTimeout: { classPropertyName: "dismissOnTimeout", publicName: "dismissOnTimeout", isSignal: true, isRequired: false, transformFunction: null }, dismissTimeout: { classPropertyName: "dismissTimeout", publicName: "dismissTimeout", isSignal: true, isRequired: false, transformFunction: null }, class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (open()) {\n\t<div class=\"row {{ class() }}\">\n\t\t<div class=\"col-xs-12 col-sm-12 col-md-auto mx-auto\">\n\t\t\t<div class=\"alert alert-{{ type() }} alert-dismissible alert_div\" role=\"alert\">\n\t\t\t\t<ng-content></ng-content>\n\t\t\t\t@if (dismissible()) {\n\t\t\t\t\t<button (click)=\"closeAlert()\" aria-label=\"Close\" class=\"btn-close\" data-bs-dismiss=\"alert\" type=\"button\"></button>\n\t\t\t\t}\n\t\t\t</div>\n\t\t</div>\n\t</div>\n}\n", styles: [".alert_div{display:flex;align-items:center;justify-content:center}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: AlertComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-alert, alert', standalone: true, imports: [CommonModule], template: "@if (open()) {\n\t<div class=\"row {{ class() }}\">\n\t\t<div class=\"col-xs-12 col-sm-12 col-md-auto mx-auto\">\n\t\t\t<div class=\"alert alert-{{ type() }} alert-dismissible alert_div\" role=\"alert\">\n\t\t\t\t<ng-content></ng-content>\n\t\t\t\t@if (dismissible()) {\n\t\t\t\t\t<button (click)=\"closeAlert()\" aria-label=\"Close\" class=\"btn-close\" data-bs-dismiss=\"alert\" type=\"button\"></button>\n\t\t\t\t}\n\t\t\t</div>\n\t\t</div>\n\t</div>\n}\n", styles: [".alert_div{display:flex;align-items:center;justify-content:center}\n"] }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }] });
+
+class SpinnerComponent {
+    constructor() {
+        /**
+         *  Use Boostrap Spinner. Default `true`
+         */
+        this.bootstrapSpinner = input(true);
+        /**
+         * Diameter of the Angular Material spinner
+         */
+        this.diameter = input(50);
+        /**
+         *  Color of the Angular Material spinner
+         */
+        this.color = input('primary');
+        /**
+         *  Stroke Width of the Angular Material spinner
+         */
+        this.strokeWidth = input(5);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: SpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0", type: SpinnerComponent, isStandalone: true, selector: "spinner,lib-spinner", inputs: { bootstrapSpinner: { classPropertyName: "bootstrapSpinner", publicName: "bootstrapSpinner", isSignal: true, isRequired: false, transformFunction: null }, diameter: { classPropertyName: "diameter", publicName: "diameter", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, strokeWidth: { classPropertyName: "strokeWidth", publicName: "strokeWidth", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<!-- Angular Material Spinner -->\n@if (!bootstrapSpinner()) {\n\t<mat-spinner [color]=\"color()\" [diameter]=\"diameter()\" [strokeWidth]=\"strokeWidth()\" class=\"mx-auto\"> </mat-spinner>\n}\n\n<!-- Bootstrap Spinner -->\n@if (bootstrapSpinner()) {\n\t<div class=\"d-flex justify-content-center\">\n\t\t<div class=\"spinner-border bs-spinner\" role=\"status\"></div>\n\t</div>\n}\n", styles: [".bs-spinner-sm{color:#3f51b5;margin-bottom:20px}.bs-spinner{color:#3f51b5;width:3rem;height:3rem;margin-bottom:20px}.bs-spinner-lg{color:#3f51b5;width:5rem;height:5rem;margin-bottom:20px}\n"], dependencies: [{ kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i1.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: SpinnerComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'spinner,lib-spinner', standalone: true, imports: [MatProgressSpinnerModule], template: "<!-- Angular Material Spinner -->\n@if (!bootstrapSpinner()) {\n\t<mat-spinner [color]=\"color()\" [diameter]=\"diameter()\" [strokeWidth]=\"strokeWidth()\" class=\"mx-auto\"> </mat-spinner>\n}\n\n<!-- Bootstrap Spinner -->\n@if (bootstrapSpinner()) {\n\t<div class=\"d-flex justify-content-center\">\n\t\t<div class=\"spinner-border bs-spinner\" role=\"status\"></div>\n\t</div>\n}\n", styles: [".bs-spinner-sm{color:#3f51b5;margin-bottom:20px}.bs-spinner{color:#3f51b5;width:3rem;height:3rem;margin-bottom:20px}.bs-spinner-lg{color:#3f51b5;width:5rem;height:5rem;margin-bottom:20px}\n"] }]
+        }] });
+
+const LOADERS = {
+    'ball-clip-rotate': 1,
+};
+const DEFAULTS = {
+    BD_COLOR: 'rgba(51,51,51,0.8)',
+    SPINNER_COLOR: '#fff',
+    SPINNER_TYPE: 'ball-clip-rotate',
+    Z_INDEX: 99999,
+};
+const PRIMARY_SPINNER = 'primary';
+class NgxSpinner {
+    constructor(init) {
+        Object.assign(this, init);
+    }
+}
+
+class NgxSpinnerService {
+    constructor() {
+        /**
+         * Spinner observable
+         *
+         * @memberof NgxSpinnerService
+         */
+        // private spinnerObservable = new ReplaySubject<NgxSpinner>(1);
+        this.spinnerObservable = new BehaviorSubject(undefined);
+    }
+    /**
+     * Creates an instance of NgxSpinnerService.
+     * @memberof NgxSpinnerService
+     */
+    /**
+     * Get subscription of desired spinner
+     * @memberof NgxSpinnerService
+     **/
+    getSpinner(name) {
+        // @ts-ignore
+        return this.spinnerObservable.asObservable().pipe(filter((x) => x?.name === name));
+    }
+    /**
+     * To show spinner
+     *
+     * @memberof NgxSpinnerService
+     */
+    show(name = PRIMARY_SPINNER, spinner) {
+        return new Promise((resolve, _reject) => {
+            setTimeout(() => {
+                if (spinner && Object.keys(spinner).length) {
+                    // @ts-ignore
+                    spinner['name'] = name;
+                    this.spinnerObservable.next(new NgxSpinner({ ...spinner, show: true }));
+                    resolve(true);
+                }
+                else {
+                    this.spinnerObservable.next(new NgxSpinner({ name, show: true }));
+                    resolve(true);
+                }
+            }, 10);
+        });
+    }
+    /**
+     * To hide spinner
+     *
+     * @memberof NgxSpinnerService
+     */
+    hide(name = PRIMARY_SPINNER, debounce = 10) {
+        return new Promise((resolve, _reject) => {
+            setTimeout(() => {
+                this.spinnerObservable.next(new NgxSpinner({ name, show: false }));
+                resolve(true);
+            }, debounce);
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgxSpinnerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgxSpinnerService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgxSpinnerService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }] });
+
+class SafeHtmlPipe {
+    constructor(_sanitizer) {
+        this._sanitizer = _sanitizer;
+    }
+    transform(v) {
+        if (v) {
+            return this._sanitizer.bypassSecurityTrustHtml(v);
+        }
+        return undefined;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: SafeHtmlPipe, deps: [{ token: i1$1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "18.0.0", ngImport: i0, type: SafeHtmlPipe, isStandalone: true, name: "safeHtml" }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: SafeHtmlPipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'safeHtml',
+                    standalone: true,
+                }]
+        }], ctorParameters: () => [{ type: i1$1.DomSanitizer }] });
+
+class NgxSpinnerComponent {
+    /**
+     * Creates an instance of NgxSpinnerComponent.
+     */
+    constructor(spinnerService, changeDetector) {
+        this.spinnerService = spinnerService;
+        this.changeDetector = changeDetector;
+        /**
+         * To enable/disable animation
+         */
+        this.disableAnimation = false;
+        /**
+         * Spinner Object
+         */
+        this.spinner = new NgxSpinner();
+        /**
+         * Unsubscribe from spinner's observable
+         **/
+        this.ngUnsubscribe = new Subject();
+        /**
+         * To set default ngx-spinner options
+         */
+        this.setDefaultOptions = () => {
+            this.spinner = new NgxSpinner({
+                name: this.name,
+                bdColor: this.bdColor,
+                size: this.size,
+                color: this.color,
+                type: this.type,
+                fullScreen: this.fullScreen,
+                divArray: this.divArray,
+                divCount: this.divCount,
+                show: this.show,
+                zIndex: this.zIndex,
+                template: this.template,
+                showSpinner: this.showSpinner,
+            });
+        };
+        this.bdColor = DEFAULTS.BD_COLOR;
+        this.zIndex = DEFAULTS.Z_INDEX;
+        this.color = DEFAULTS.SPINNER_COLOR;
+        this.type = DEFAULTS.SPINNER_TYPE;
+        this.size = 'large';
+        this.fullScreen = true;
+        this.name = PRIMARY_SPINNER;
+        // @ts-ignore
+        this.template = null;
+        this.showSpinner = false;
+        this.divArray = [];
+        this.divCount = 0;
+        this.show = false;
+    }
+    handleKeyboardEvent(event) {
+        if (this.spinnerDOM && this.spinnerDOM.nativeElement) {
+            event.returnValue = false;
+            event.preventDefault();
+        }
+    }
+    /**
+   * Initialization method
+
+   */
+    ngOnInit() {
+        this.setDefaultOptions();
+        this.spinnerService
+            .getSpinner(this.name)
+            .pipe(takeUntil(this.ngUnsubscribe))
+            .subscribe((spinner) => {
+            this.setDefaultOptions();
+            Object.assign(this.spinner, spinner);
+            if (spinner.show) {
+                this.onInputChange();
+            }
+            this.changeDetector.detectChanges();
+        });
+    }
+    /**
+     * On changes event for input variables
+     */
+    ngOnChanges(changes) {
+        for (const propName in changes) {
+            if (propName) {
+                const changedProp = changes[propName];
+                if (changedProp.isFirstChange()) {
+                    return;
+                }
+                else if (typeof changedProp.currentValue !== 'undefined' && changedProp.currentValue !== changedProp.previousValue) {
+                    if (changedProp.currentValue !== '') {
+                        // @ts-ignore
+                        this.spinner[propName] = changedProp.currentValue;
+                        if (propName === 'showSpinner') {
+                            if (changedProp.currentValue) {
+                                this.spinnerService.show(this.spinner.name, this.spinner);
+                            }
+                            else {
+                                this.spinnerService.hide(this.spinner.name);
+                            }
+                        }
+                    }
+                }
+            }
+        }
+    }
+    /**
+     * To get class for spinner
+     */
+    getClass(type, size) {
+        // @ts-ignore
+        this.spinner.divCount = LOADERS[type];
+        this.spinner.divArray = Array(this.spinner.divCount)
+            .fill(0)
+            .map((x, i) => i);
+        let sizeClass = '';
+        switch (size.toLowerCase()) {
+            case 'small':
+                sizeClass = 'la-sm';
+                break;
+            case 'medium':
+                sizeClass = 'la-2x';
+                break;
+            case 'large':
+                sizeClass = 'la-3x';
+                break;
+            default:
+                break;
+        }
+        return 'la-' + type + ' ' + sizeClass;
+    }
+    /**
+     * Check if input variables have changed
+     */
+    onInputChange() {
+        this.spinner.class = this.getClass(this.spinner.type ?? DEFAULTS.SPINNER_TYPE, this.spinner.size ?? 'default');
+    }
+    /**
+     * Component destroy event
+     */
+    ngOnDestroy() {
+        this.ngUnsubscribe.next();
+        this.ngUnsubscribe.complete();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgxSpinnerComponent, deps: [{ token: NgxSpinnerService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0", type: NgxSpinnerComponent, isStandalone: true, selector: "ngx-spinner", inputs: { bdColor: "bdColor", size: "size", color: "color", type: "type", fullScreen: "fullScreen", name: "name", zIndex: "zIndex", template: "template", showSpinner: "showSpinner", disableAnimation: "disableAnimation" }, host: { listeners: { "document:keydown": "handleKeyboardEvent($event)" } }, viewQueries: [{ propertyName: "spinnerDOM", first: true, predicate: ["overlay"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (spinner.show) {\n\t<div\n\t\t#overlay\n\t\t[@.disabled]=\"disableAnimation\"\n\t\t[@fadeIn]=\"'in'\"\n\t\t[style.background-color]=\"spinner.bdColor\"\n\t\t[style.position]=\"spinner.fullScreen ? 'fixed' : 'absolute'\"\n\t\t[style.z-index]=\"spinner.zIndex\"\n\t\tclass=\"ngx-spinner-overlay\">\n\t\t@if (spinner.show) {\n\t\t\t<div [class]=\"spinner.class\" [style.color]=\"spinner.color\">\n\t\t\t\t@for (index of spinner.divArray; track index) {\n\t\t\t\t\t<div></div>\n\t\t\t\t}\n\t\t\t</div>\n\t\t}\n\t\t@if (template) {\n\t\t\t<div [innerHTML]=\"template | safeHtml\"></div>\n\t\t}\n\t\t<div [style.z-index]=\"spinner.zIndex\" class=\"loading-text\">\n\t\t\t<ng-content></ng-content>\n\t\t</div>\n\t</div>\n}\n", styles: [".la-ball-clip-rotate,.la-ball-clip-rotate>div{position:relative;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.la-ball-clip-rotate{display:block;font-size:0;color:#fff}.la-ball-clip-rotate.la-dark{color:#333}.la-ball-clip-rotate>div{display:inline-block;float:none;background-color:currentColor;border:0 solid currentColor}.la-ball-clip-rotate{width:32px;height:32px}.la-ball-clip-rotate>div{width:32px;height:32px;background:transparent;border-width:2px;border-bottom-color:transparent;border-radius:100%;-webkit-animation:ball-clip-rotate .75s linear infinite;-moz-animation:ball-clip-rotate .75s linear infinite;-o-animation:ball-clip-rotate .75s linear infinite;animation:ball-clip-rotate .75s linear infinite}.la-ball-clip-rotate.la-sm{width:16px;height:16px}.la-ball-clip-rotate.la-sm>div{width:16px;height:16px;border-width:1px}.la-ball-clip-rotate.la-2x{width:64px;height:64px}.la-ball-clip-rotate.la-2x>div{width:64px;height:64px;border-width:4px}.la-ball-clip-rotate.la-3x{width:96px;height:96px}.la-ball-clip-rotate.la-3x>div{width:96px;height:96px;border-width:6px}@-webkit-keyframes ball-clip-rotate{0%{-webkit-transform:rotate(0deg);transform:rotate(0)}50%{-webkit-transform:rotate(180deg);transform:rotate(180deg)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@-moz-keyframes ball-clip-rotate{0%{-moz-transform:rotate(0deg);transform:rotate(0)}50%{-moz-transform:rotate(180deg);transform:rotate(180deg)}to{-moz-transform:rotate(360deg);transform:rotate(360deg)}}@-o-keyframes ball-clip-rotate{0%{-o-transform:rotate(0deg);transform:rotate(0)}50%{-o-transform:rotate(180deg);transform:rotate(180deg)}to{-o-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes ball-clip-rotate{0%{-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0)}50%{-webkit-transform:rotate(180deg);-moz-transform:rotate(180deg);-o-transform:rotate(180deg);transform:rotate(180deg)}to{-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);-o-transform:rotate(360deg);transform:rotate(360deg)}}.ngx-spinner-overlay{position:fixed;top:0;left:0;width:100%;height:100%}.ngx-spinner-overlay>div:not(.loading-text){top:50%;left:50%;margin:0;position:absolute;transform:translate(-50%,-50%)}.loading-text{position:absolute;top:60%;left:50%;transform:translate(-50%,-60%)}\n/*!\n * Load Awesome v1.1.0 (http://github.danielcardoso.net/load-awesome/)\n * Copyright 2015 Daniel Cardoso <@DanielCardoso>\n * Licensed under MIT\n */\n"], dependencies: [{ kind: "pipe", type: SafeHtmlPipe, name: "safeHtml" }], animations: [
+            trigger('fadeIn', [
+                state('in', style({ opacity: 1 })),
+                transition(':enter', [style({ opacity: 0 }), animate(300)]),
+                transition(':leave', animate(200, style({ opacity: 0 }))),
+            ]),
+        ] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgxSpinnerComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ngx-spinner', standalone: true, imports: [SafeHtmlPipe], animations: [
+                        trigger('fadeIn', [
+                            state('in', style({ opacity: 1 })),
+                            transition(':enter', [style({ opacity: 0 }), animate(300)]),
+                            transition(':leave', animate(200, style({ opacity: 0 }))),
+                        ]),
+                    ], template: "@if (spinner.show) {\n\t<div\n\t\t#overlay\n\t\t[@.disabled]=\"disableAnimation\"\n\t\t[@fadeIn]=\"'in'\"\n\t\t[style.background-color]=\"spinner.bdColor\"\n\t\t[style.position]=\"spinner.fullScreen ? 'fixed' : 'absolute'\"\n\t\t[style.z-index]=\"spinner.zIndex\"\n\t\tclass=\"ngx-spinner-overlay\">\n\t\t@if (spinner.show) {\n\t\t\t<div [class]=\"spinner.class\" [style.color]=\"spinner.color\">\n\t\t\t\t@for (index of spinner.divArray; track index) {\n\t\t\t\t\t<div></div>\n\t\t\t\t}\n\t\t\t</div>\n\t\t}\n\t\t@if (template) {\n\t\t\t<div [innerHTML]=\"template | safeHtml\"></div>\n\t\t}\n\t\t<div [style.z-index]=\"spinner.zIndex\" class=\"loading-text\">\n\t\t\t<ng-content></ng-content>\n\t\t</div>\n\t</div>\n}\n", styles: [".la-ball-clip-rotate,.la-ball-clip-rotate>div{position:relative;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.la-ball-clip-rotate{display:block;font-size:0;color:#fff}.la-ball-clip-rotate.la-dark{color:#333}.la-ball-clip-rotate>div{display:inline-block;float:none;background-color:currentColor;border:0 solid currentColor}.la-ball-clip-rotate{width:32px;height:32px}.la-ball-clip-rotate>div{width:32px;height:32px;background:transparent;border-width:2px;border-bottom-color:transparent;border-radius:100%;-webkit-animation:ball-clip-rotate .75s linear infinite;-moz-animation:ball-clip-rotate .75s linear infinite;-o-animation:ball-clip-rotate .75s linear infinite;animation:ball-clip-rotate .75s linear infinite}.la-ball-clip-rotate.la-sm{width:16px;height:16px}.la-ball-clip-rotate.la-sm>div{width:16px;height:16px;border-width:1px}.la-ball-clip-rotate.la-2x{width:64px;height:64px}.la-ball-clip-rotate.la-2x>div{width:64px;height:64px;border-width:4px}.la-ball-clip-rotate.la-3x{width:96px;height:96px}.la-ball-clip-rotate.la-3x>div{width:96px;height:96px;border-width:6px}@-webkit-keyframes ball-clip-rotate{0%{-webkit-transform:rotate(0deg);transform:rotate(0)}50%{-webkit-transform:rotate(180deg);transform:rotate(180deg)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@-moz-keyframes ball-clip-rotate{0%{-moz-transform:rotate(0deg);transform:rotate(0)}50%{-moz-transform:rotate(180deg);transform:rotate(180deg)}to{-moz-transform:rotate(360deg);transform:rotate(360deg)}}@-o-keyframes ball-clip-rotate{0%{-o-transform:rotate(0deg);transform:rotate(0)}50%{-o-transform:rotate(180deg);transform:rotate(180deg)}to{-o-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes ball-clip-rotate{0%{-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0)}50%{-webkit-transform:rotate(180deg);-moz-transform:rotate(180deg);-o-transform:rotate(180deg);transform:rotate(180deg)}to{-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);-o-transform:rotate(360deg);transform:rotate(360deg)}}.ngx-spinner-overlay{position:fixed;top:0;left:0;width:100%;height:100%}.ngx-spinner-overlay>div:not(.loading-text){top:50%;left:50%;margin:0;position:absolute;transform:translate(-50%,-50%)}.loading-text{position:absolute;top:60%;left:50%;transform:translate(-50%,-60%)}\n/*!\n * Load Awesome v1.1.0 (http://github.danielcardoso.net/load-awesome/)\n * Copyright 2015 Daniel Cardoso <@DanielCardoso>\n * Licensed under MIT\n */\n"] }]
+        }], ctorParameters: () => [{ type: NgxSpinnerService }, { type: i0.ChangeDetectorRef }], propDecorators: { bdColor: [{
+                type: Input
+            }], size: [{
+                type: Input
+            }], color: [{
+                type: Input
+            }], type: [{
+                type: Input
+            }], fullScreen: [{
+                type: Input
+            }], name: [{
+                type: Input
+            }], zIndex: [{
+                type: Input
+            }], template: [{
+                type: Input
+            }], showSpinner: [{
+                type: Input
+            }], disableAnimation: [{
+                type: Input
+            }], spinnerDOM: [{
+                type: ViewChild,
+                args: ['overlay']
+            }], handleKeyboardEvent: [{
+                type: HostListener,
+                args: ['document:keydown', ['$event']]
+            }] } });
+
+class TypeOfPipe {
+    transform(value) {
+        return typeof value;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: TypeOfPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "18.0.0", ngImport: i0, type: TypeOfPipe, isStandalone: true, name: "typeOf" }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: TypeOfPipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'typeOf',
+                    standalone: true,
+                }]
+        }] });
+
+/**
+ * Reusable Auto Complete component that extends MatAutoComplete to show Clear icon and Arrow buttons
+ *
+ * @author Pavan Kumar Jadda
+ * @since 12.0.0
+ */
+class AutocompleteComponent {
+    constructor(cdRef) {
+        this.cdRef = cdRef;
+        /**
+         * Label of the AutoComplete
+         */
+        this.label = input('');
+        /**
+         * Placeholder of the AutoComplete
+         */
+        this.placeHolder = input('');
+        /**
+         * Appearance of the AutoComplete, defaults to `fill`
+         */
+        this.appearance = input('fill');
+        /**
+         * List of CSS classes that need to applied to autocomplete
+         */
+        this.classes = input('');
+        /**
+         * Attribute of the Object whose value would be shown when searching for data. Defaults to `ID`
+         */
+        this.bindLabel = input('');
+        /**
+         * Attribute of the Object whose value would be used for search
+         */
+        this.bindValue = input('id');
+        /**
+         * Function that maps an option's control value to its display value in the trigger.
+         */
+        this.displayWith = null;
+        /**
+         * Specifies if the autocomplete is required. Default is not required.
+         */
+        this.required = input(false);
+        /**
+         * List of Objects that need to be bind and searched for
+         */
+        this.data = input();
+        /**
+         * Emit selected value on selection changes
+         *
+         * @author Pavan Kumar Jadda
+         * @since 13.0.3
+         */
+        this.onSelectionChange = output();
+        /**
+         * BehaviorSubject that shows the current active arrow icon
+         */
+        this.arrowIconSubject = new BehaviorSubject('arrow_drop_down');
+    }
+    ngAfterContentChecked() {
+        this.cdRef.detectChanges();
+    }
+    /**
+     * Define autocomplete search filter on search text changes
+     *
+     * @author Pavan Kumar Jadda
+     * @since 12.0.0
+     */
+    ngOnInit() {
+        this.filteredOptions = this.inputFormGroup?.get('autocomplete')?.valueChanges.pipe(startWith(''), map((value) => (typeof value === 'string' ? value : value !== null ? value[this.bindLabel()] : '')), map((propertyName) => this.data()?.filter((option) => {
+            return typeof option === 'string'
+                ? option?.toLowerCase().indexOf(propertyName.toLowerCase()) === 0
+                : option[this.bindLabel()]?.toLowerCase().indexOf(propertyName.toLowerCase()) === 0;
+        }) ?? this.data()?.slice()));
+    }
+    ngOnChanges(_changes) {
+        this.displayFn = this.displayFn.bind(this);
+    }
+    /**
+     * Clear input and Reset autocomplete form control
+     *
+     * @author Pavan Kumar Jadda
+     * @since 12.0.0
+     */
+    clearInput(evt) {
+        evt.stopPropagation();
+        this.inputFormGroup.get('autocomplete')?.reset();
+        this.inputAutoComplete?.nativeElement.focus();
+    }
+    /**
+     * Open or Close panel
+     *
+     * @author Pavan Kumar Jadda
+     * @since 12.0.0
+     */
+    openOrClosePanel(evt, trigger) {
+        evt.stopPropagation();
+        if (trigger.panelOpen)
+            trigger.closePanel();
+        else
+            trigger.openPanel();
+    }
+    /**
+     * Display function that is used to show the values
+     *
+     * @author Pavan Kumar Jadda
+     * @since 12.0.0
+     */
+    displayFn(object) {
+        if (this.displayWith !== undefined && this.displayWith !== null && typeof this.displayWith === 'function') {
+            this.displayFn = this.displayWith.bind(this);
+            return this.displayWith(object);
+        }
+        else {
+            if (typeof object === 'string')
+                return object;
+            return object && object[this.bindLabel()] ? object[this.bindLabel()] : '';
+        }
+    }
+    /**
+     * Emit selected value
+     * @param $event - Event emitted by autocomplete
+     *
+     * @author Pavan Kumar Jadda
+     * @since 13.0.3
+     */
+    emitSelectedValue($event) {
+        this.onSelectionChange.emit($event.source.value);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: AutocompleteComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0", type: AutocompleteComponent, isStandalone: true, selector: "autocomplete, lib-autocomplete", inputs: { inputFormGroup: { classPropertyName: "inputFormGroup", publicName: "inputFormGroup", isSignal: false, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeHolder: { classPropertyName: "placeHolder", publicName: "placeHolder", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, classes: { classPropertyName: "classes", publicName: "classes", isSignal: true, isRequired: false, transformFunction: null }, bindLabel: { classPropertyName: "bindLabel", publicName: "bindLabel", isSignal: true, isRequired: false, transformFunction: null }, bindValue: { classPropertyName: "bindValue", publicName: "bindValue", isSignal: true, isRequired: false, transformFunction: null }, displayWith: { classPropertyName: "displayWith", publicName: "displayWith", isSignal: false, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onSelectionChange: "onSelectionChange" }, viewQueries: [{ propertyName: "inputAutoComplete", first: true, predicate: ["inputAutoComplete"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div [formGroup]=\"inputFormGroup\">\n\t<mat-form-field appearance=\"fill\" class=\"{{ classes() }}\">\n\t\t<mat-label>{{ label() }}</mat-label>\n\t\t<input\n\t\t\t#inputAutoComplete\n\t\t\t#trigger=\"matAutocompleteTrigger\"\n\t\t\t[matAutocomplete]=\"auto\"\n\t\t\t[placeholder]=\"placeHolder()\"\n\t\t\t[required]=\"required()\"\n\t\t\tformControlName=\"autocomplete\"\n\t\t\tmatInput\n\t\t\ttype=\"text\" />\n\n\t\t<div matSuffix style=\"display: flex\">\n\t\t\t@if (!!inputFormGroup.get('autocomplete')?.value) {\n\t\t\t\t<button (click)=\"clearInput($event)\" aria-label=\"Clear\" mat-icon-button type=\"button\">\n\t\t\t\t\t<mat-icon>clear</mat-icon>\n\t\t\t\t</button>\n\t\t\t}\n\t\t\t<button (click)=\"openOrClosePanel($event, trigger)\" aria-label=\"Clear\" mat-icon-button type=\"button\">\n\t\t\t\t<mat-icon>{{ arrowIconSubject.getValue() }}</mat-icon>\n\t\t\t</button>\n\t\t</div>\n\n\t\t<mat-autocomplete\n\t\t\t#auto=\"matAutocomplete\"\n\t\t\t(closed)=\"arrowIconSubject.next('arrow_drop_down')\"\n\t\t\t(opened)=\"arrowIconSubject.next('arrow_drop_up')\"\n\t\t\t(optionSelected)=\"arrowIconSubject.next('arrow_drop_down')\"\n\t\t\t[displayWith]=\"displayFn\">\n\t\t\t@for (option of filteredOptions | async; track option[bindValue()]) {\n\t\t\t\t<mat-option (onSelectionChange)=\"emitSelectedValue($event)\" [value]=\"option\">\n\t\t\t\t\t@if ((option | typeOf) === 'string') {\n\t\t\t\t\t\t<ng-container>{{ option }}</ng-container>\n\t\t\t\t\t} @else if ((option | typeOf) === 'object') {\n\t\t\t\t\t\t<ng-container>{{ option[bindLabel()] }}</ng-container>\n\t\t\t\t\t}\n\t\t\t\t</mat-option>\n\t\t\t}\n\t\t</mat-autocomplete>\n\t</mat-form-field>\n</div>\n", dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: TypeOfPipe, name: "typeOf" }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i3.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i4.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i3.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i5.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$3.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1$4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "pipe", type: AsyncPipe, name: "async" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: AutocompleteComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'autocomplete, lib-autocomplete', standalone: true, imports: [
+                        ReactiveFormsModule,
+                        TypeOfPipe,
+                        MatFormFieldModule,
+                        MatAutocompleteModule,
+                        MatInputModule,
+                        MatButtonModule,
+                        MatIconModule,
+                        AsyncPipe,
+                    ], template: "<div [formGroup]=\"inputFormGroup\">\n\t<mat-form-field appearance=\"fill\" class=\"{{ classes() }}\">\n\t\t<mat-label>{{ label() }}</mat-label>\n\t\t<input\n\t\t\t#inputAutoComplete\n\t\t\t#trigger=\"matAutocompleteTrigger\"\n\t\t\t[matAutocomplete]=\"auto\"\n\t\t\t[placeholder]=\"placeHolder()\"\n\t\t\t[required]=\"required()\"\n\t\t\tformControlName=\"autocomplete\"\n\t\t\tmatInput\n\t\t\ttype=\"text\" />\n\n\t\t<div matSuffix style=\"display: flex\">\n\t\t\t@if (!!inputFormGroup.get('autocomplete')?.value) {\n\t\t\t\t<button (click)=\"clearInput($event)\" aria-label=\"Clear\" mat-icon-button type=\"button\">\n\t\t\t\t\t<mat-icon>clear</mat-icon>\n\t\t\t\t</button>\n\t\t\t}\n\t\t\t<button (click)=\"openOrClosePanel($event, trigger)\" aria-label=\"Clear\" mat-icon-button type=\"button\">\n\t\t\t\t<mat-icon>{{ arrowIconSubject.getValue() }}</mat-icon>\n\t\t\t</button>\n\t\t</div>\n\n\t\t<mat-autocomplete\n\t\t\t#auto=\"matAutocomplete\"\n\t\t\t(closed)=\"arrowIconSubject.next('arrow_drop_down')\"\n\t\t\t(opened)=\"arrowIconSubject.next('arrow_drop_up')\"\n\t\t\t(optionSelected)=\"arrowIconSubject.next('arrow_drop_down')\"\n\t\t\t[displayWith]=\"displayFn\">\n\t\t\t@for (option of filteredOptions | async; track option[bindValue()]) {\n\t\t\t\t<mat-option (onSelectionChange)=\"emitSelectedValue($event)\" [value]=\"option\">\n\t\t\t\t\t@if ((option | typeOf) === 'string') {\n\t\t\t\t\t\t<ng-container>{{ option }}</ng-container>\n\t\t\t\t\t} @else if ((option | typeOf) === 'object') {\n\t\t\t\t\t\t<ng-container>{{ option[bindLabel()] }}</ng-container>\n\t\t\t\t\t}\n\t\t\t\t</mat-option>\n\t\t\t}\n\t\t</mat-autocomplete>\n\t</mat-form-field>\n</div>\n" }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { inputAutoComplete: [{
+                type: ViewChild,
+                args: ['inputAutoComplete']
+            }], inputFormGroup: [{
+                type: Input
+            }], displayWith: [{
+                type: Input
+            }, {
+                type: Optional
+            }] } });
+
+/**
+ * Reusable Angular directory that prints given contents of HTML element
+ *
+ * @since 12.0.0
+ * @author Pavan Kumar Jadda
+ */
+class NgxPrintDirective {
+    constructor() {
+        /**
+         * If `true`, uses CSS of HTMl element, otherwise no CSS applied
+         *
+         * @since 12.0.0
+         * @author Pavan Kumar Jadda
+         */
+        this.useExistingCss = false;
+        /**
+         * A delay in milliseconds to force the print dialog to wait before opened. Default: 0
+         *
+         * @since 12.0.0
+         * @author Pavan Kumar Jadda
+         */
+        this.printDelay = 0;
+        /**
+         * ID of the Mat Paginator
+         *
+         * @since 12.0.0
+         * @author Pavan Kumar Jadda
+         */
+        this.paginatorId = '';
+        /**
+         * HTML tag ID of the Mat-Table Input Filter
+         *
+         * @since 12.0.0
+         * @author Pavan Kumar Jadda
+         */
+        this.inputFilterId = '';
+        /**
+         * If `true`, referenced table is Mat-Table
+         *
+         * @since 12.0.0
+         * @author Pavan Kumar Jadda
+         */
+        this.isMatTable = false;
+        /**
+         * If `true` Mat-Table paginator will be hidden
+         *
+         * @since 12.0.0
+         * @author Pavan Kumar Jadda
+         */
+        this.hideMatTablePaginator = false;
+        this.printStyleArray = [];
+        /**
+         * List of Style sheet files
+         *
+         * @since 12.0.0
+         * @author Pavan Kumar Jadda
+         */
+        this.styleSheetFileArray = '';
+    }
+    /**
+     * List of CSS properties that needs to be applied while printing the document
+     *
+     * @since 12.0.0
+     * @author Pavan Kumar Jadda
+     */
+    set printStyle({ values }) {
+        for (const key in values) {
+            if (values.hasOwnProperty(key)) {
+                // @ts-ignore
+                this.printStyleArray.push((key + JSON.stringify(values[key])).replace(/['"]+/g, ''));
+            }
+        }
+        this.returnStyleValues();
+    }
+    /**
+     * Sets given style sheet files to print document
+     *
+     * @param cssList Comma separated value of CSS file names
+     *
+     * @since 12.0.0
+     * @author Pavan Kumar Jadda
+     */
+    set styleSheetFile(cssList) {
+        if (cssList.indexOf(',') !== -1) {
+            const cssFileArray = cssList.split(',');
+            for (const cssFileName of cssFileArray) {
+                this.styleSheetFileArray = this.styleSheetFileArray + NgxPrintDirective.linkTagFn(cssFileName);
+            }
+        }
+        else {
+            this.styleSheetFileArray = NgxPrintDirective.linkTagFn(cssList);
+        }
+    }
+    /**
+     * Build link HTMl tag based on given file name
+     *
+     * @since 12.0.0
+     * @author Pavan Kumar Jadda
+     */
+    static linkTagFn(cssFileName) {
+        return `<link rel="stylesheet" type="text/css" href="${cssFileName}">`;
+    }
+    /**
+     * Gets HTML element by tag name
+     *
+     * @since 12.0.0
+     * @author Pavan Kumar Jadda
+     */
+    static getElementTag(tag) {
+        const html = [];
+        const elements = document.getElementsByTagName(tag);
+        // @ts-ignore
+        for (const element of elements) {
+            html.push(element.outerHTML);
+        }
+        return html.join('\r\n');
+    }
+    /**
+     * Print the element upon clicking the button
+     *
+     * @since 12.0.0
+     * @author Pavan Kumar Jadda
+     */
+    print() {
+        //Hide paginator for Material table
+        if (this.isMatTable && this.hideMatTablePaginator && this.matTableDataSource) {
+            this.matTableDataSource.paginator = null;
+        }
+        setTimeout(() => {
+            if (this.isMatTable) {
+                this.hideMatPaginatorBeforePrinting();
+            }
+            // Do something after
+            let printContents;
+            let popupWin;
+            let styles = '';
+            let links = '';
+            if (this.useExistingCss) {
+                styles = NgxPrintDirective.getElementTag('style');
+                links = NgxPrintDirective.getElementTag('link');
+            }
+            if (this.printSectionId) {
+                printContents = document.getElementById(this.printSectionId)?.innerHTML;
+                popupWin = window.open('', '_blank', 'top=0,left=0,height=auto,width=auto');
+                popupWin?.document.open();
+                popupWin?.document.write(`
+      <html lang="en-us">
+        <head>
+          <title>${this.printTitle ? this.printTitle : ''}</title>
+          ${this.returnStyleValues()}
+          ${this.styleSheetFileArray}
+          ${styles}
+          ${links}
+        </head>
+        <body>
+          ${printContents}
+          <script defer>
+            function triggerPrint() {
+              window.removeEventListener('load', triggerPrint, false);
+              setTimeout(() => {
+                window.print();
+                setTimeout(function() { window.close(); }, 0);
+              }, ${this.printDelay});
+            }
+            window.addEventListener('load', triggerPrint, false);
+          </script>
+        </body>
+      </html>`);
+                popupWin?.document.close();
+                //Revert back the mat-paginator after printing
+                if (this.isMatTable) {
+                    this.showMatPaginatorAfterPrinting();
+                }
+            }
+        }, 1000); //1 second timeout to hide paginator
+    }
+    /**
+     * Hide Mat Paginator before Printing
+     *
+     * @since 12.0.1
+     * @author Pavan Kumar Jadda
+     */
+    hideMatPaginatorBeforePrinting() {
+        // @ts-ignore
+        document.getElementById(this.paginatorId).style.display = 'none';
+        if (document.getElementById(this.inputFilterId) != null) {
+            // @ts-ignore
+            document.getElementById(this.inputFilterId).style.display = 'none';
+        }
+    }
+    /**
+     * Show Mat Paginator after Printing
+     *
+     * @since 12.0.1
+     * @author Pavan Kumar Jadda
+     */
+    showMatPaginatorAfterPrinting() {
+        this.matTableDataSource.paginator = this.paginator;
+        // @ts-ignore
+        document.getElementById(this.paginatorId).style.display = 'block';
+        if (document.getElementById(this.inputFilterId) != null) {
+            // @ts-ignore
+            document.getElementById(this.inputFilterId).style.display = 'block';
+        }
+    }
+    /**
+     * @returns the string that create the stylesheet which will be injected later within <style></style> tag. Join/replace to transform an array objects to css-styled string
+     *
+     * @since 12.0.0
+     * @author Pavan Kumar Jadda
+     */
+    returnStyleValues() {
+        return `<style> ${this.printStyleArray.join(' ').replace(/,/g, ';')} </style>`;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgxPrintDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.0", type: NgxPrintDirective, isStandalone: true, selector: "button[ngxPrint], button[print]", inputs: { printSectionId: "printSectionId", printTitle: "printTitle", useExistingCss: "useExistingCss", printDelay: "printDelay", matTableDataSource: "matTableDataSource", paginator: "paginator", paginatorId: "paginatorId", inputFilterId: "inputFilterId", isMatTable: "isMatTable", hideMatTablePaginator: "hideMatTablePaginator", printStyle: "printStyle", styleSheetFile: "styleSheetFile" }, host: { listeners: { "click": "print()" } }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: NgxPrintDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    // eslint-disable-next-line @angular-eslint/directive-selector
+                    selector: 'button[ngxPrint], button[print]',
+                    standalone: true,
+                }]
+        }], propDecorators: { printSectionId: [{
+                type: Input
+            }], printTitle: [{
+                type: Input
+            }], useExistingCss: [{
+                type: Input
+            }], printDelay: [{
+                type: Input
+            }], matTableDataSource: [{
+                type: Input
+            }], paginator: [{
+                type: Input
+            }], paginatorId: [{
+                type: Input
+            }], inputFilterId: [{
+                type: Input
+            }], isMatTable: [{
+                type: Input
+            }], hideMatTablePaginator: [{
+                type: Input
+            }], printStyle: [{
+                type: Input
+            }], styleSheetFile: [{
+                type: Input
+            }], print: [{
+                type: HostListener,
+                args: ['click']
+            }] } });
+
+class PreventMultipleClicksDirective {
+    constructor() {
+        this.throttleTime = input(2000);
+        this.throttleClick = new EventEmitter();
+        this.clicks = new Subject();
+    }
+    /**
+     * Intercepts click event and stops default navigation. After first click set {@link throttleTime} to 2000 to prevent duplicate clicks
+     *
+     * @param event DOM event
+     *
+     * @author Pavan Kumar Jadda
+     * @since 2.3.27
+     */
+    clickEvent(event) {
+        event.preventDefault();
+        event.stopPropagation();
+        this.clicks.next(event);
+    }
+    ngOnInit() {
+        this.subscription = this.clicks.pipe(throttleTime(this.throttleTime())).subscribe((e) => this.throttleClick.emit(e));
+    }
+    ngOnDestroy() {
+        this.subscription?.unsubscribe();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: PreventMultipleClicksDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.0.0", type: PreventMultipleClicksDirective, isStandalone: true, selector: "[preventMultipleClicks]", inputs: { throttleTime: { classPropertyName: "throttleTime", publicName: "throttleTime", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { throttleClick: "throttleClick" }, host: { listeners: { "click": "clickEvent($event)" } }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: PreventMultipleClicksDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[preventMultipleClicks]',
+                    standalone: true,
+                }]
+        }], propDecorators: { throttleClick: [{
+                type: Output
+            }], clickEvent: [{
+                type: HostListener,
+                args: ['click', ['$event']]
+            }] } });
+
+const EDIT_ICON = `
+<svg xmlns="http://www.w3.org/2000/svg"  viewBox="0 0 512 512">
+  <path d="M490.3 40.4C512.2 62.27 512.2 97.73 490.3 119.6L460.3 149.7L362.3 51.72L392.4 21.66C414.3-.2135 449.7-.2135 471.6 21.66L490.3 40.4zM172.4 241.7L339.7 74.34L437.7 172.3L270.3 339.6C264.2 345.8 256.7 350.4 248.4 353.2L159.6 382.8C150.1 385.6 141.5 383.4 135 376.1C128.6 370.5 126.4 361 129.2 352.4L158.8 263.6C161.6 255.3 166.2 247.8 172.4 241.7V241.7zM192 63.1C209.7 63.1 224 78.33 224 95.1C224 113.7 209.7 127.1 192 127.1H96C78.33 127.1 64 142.3 64 159.1V416C64 433.7 78.33 448 96 448H352C369.7 448 384 433.7 384 416V319.1C384 302.3 398.3 287.1 416 287.1C433.7 287.1 448 302.3 448 319.1V416C448 469 405 512 352 512H96C42.98 512 0 469 0 416V159.1C0 106.1 42.98 63.1 96 63.1H192z"/>
+</svg>
+`;
+class EditSolidSvgComponent {
+    constructor(iconRegistry, sanitizer) {
+        iconRegistry.addSvgIconLiteral('edit-solid', sanitizer.bypassSecurityTrustHtml(EDIT_ICON));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: EditSolidSvgComponent, deps: [{ token: i1$4.MatIconRegistry }, { token: i1$1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0", type: EditSolidSvgComponent, isStandalone: true, selector: "edit-solid-svg", ngImport: i0, template: ` <mat-icon aria-hidden="false" aria-label="Edit" svgIcon="edit-solid"></mat-icon> `, isInline: true, styles: [".mat-icon{vertical-align:bottom;padding-left:5px}\n"], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1$4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: EditSolidSvgComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'edit-solid-svg', standalone: true, imports: [MatIconModule], template: ` <mat-icon aria-hidden="false" aria-label="Edit" svgIcon="edit-solid"></mat-icon> `, styles: [".mat-icon{vertical-align:bottom;padding-left:5px}\n"] }]
+        }], ctorParameters: () => [{ type: i1$4.MatIconRegistry }, { type: i1$1.DomSanitizer }] });
+
+class BaseButtonComponent {
+    constructor() {
+        /**
+         *  Is search in progress and loading the data
+         */
+        this.loading = input(false);
+        /**
+         *  Is button disabled
+         */
+        this.disabled = input(false);
+        /**
+         * Type of the button. Following values are supported. See BootStrap docs for more information
+         * <pre>
+         *   1. button
+         *   2. submit
+         * </pre>
+         */
+        this.type = input('button');
+        /**
+         * If set, shows when action in Progress
+         */
+        this.loadingLabel = input('Saving...');
+        /**
+         * If set, shows when Delete is not in progress
+         */
+        this.label = input('Save');
+        /**
+         * If set, shows the icon. Otherwise, shows delete icon
+         */
+        this.icon = input('save');
+        /**
+         * If set, shows material icon otherwise hides the icons
+         */
+        this.showIcon = input(true);
+        /**
+         * If set, sets the style of the button
+         */
+        this.style = input();
+        /**
+         * If set, sets the class of the button
+         */
+        this.classes = input('btn');
+        /**
+         * If set, sets the data-cy attribute for the button
+         */
+        this.dataCy = input('save-button');
+        /**
+         *  Output event when button is clicked
+         */
+        this.onClick = output();
+        /**
+         *  Output event when button is focused
+         */
+        this.onFocus = output();
+        /**
+         * Output event when button is blurred
+         */
+        this.onBlur = output();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: BaseButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.0", type: BaseButtonComponent, isStandalone: true, selector: "ng-component", inputs: { loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, loadingLabel: { classPropertyName: "loadingLabel", publicName: "loadingLabel", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, showIcon: { classPropertyName: "showIcon", publicName: "showIcon", isSignal: true, isRequired: false, transformFunction: null }, style: { classPropertyName: "style", publicName: "style", isSignal: true, isRequired: false, transformFunction: null }, classes: { classPropertyName: "classes", publicName: "classes", isSignal: true, isRequired: false, transformFunction: null }, dataCy: { classPropertyName: "dataCy", publicName: "dataCy", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onClick: "onClick", onFocus: "onFocus", onBlur: "onBlur" }, ngImport: i0, template: ``, isInline: true }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: BaseButtonComponent, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    template: ``,
+                }]
+        }] });
+
+class BsLinkButtonComponent extends BaseButtonComponent {
+    constructor() {
+        super();
+        this.label = input('Edit');
+        this.icon = input('search');
+        this.classes = input('btn text-primary');
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: BsLinkButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.0", type: BsLinkButtonComponent, isStandalone: true, selector: "bs-link-button", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, classes: { classPropertyName: "classes", publicName: "classes", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
+		<a
+			type="{{ type() }}"
+			class="{{ classes() }}"
+			(click)="onClick.emit($event)"
+			(focus)="onFocus.emit($event)"
+			(blur)="onBlur.emit($event)"
+			[disabled]="disabled()"
+			[type]="type()"
+			[ngStyle]="style()"
+			[attr.data-cy]="'edit-link-button'"
+			mat-button>
+			<mat-icon>{{ icon() }}</mat-icon>
+			{{ label() }}
+		</a>
+	`, isInline: true, styles: [".primary-button,.primary-button:hover,.primary-button:active,.primary-button:visited{color:#fff!important;background-color:var(--primary-color)!important}.secondary-button,.secondary-button:hover,.secondary-button:active,.secondary-button:visited{color:#fff!important;background-color:var(--secondary-color)!important}.success-button,.success-button:hover,.success-button:active,.success-button:visited{color:#fff!important;background-color:var(--success-color)!important}.delete-button,.delete-button:hover,.delete-button:active,.success-button:visited{color:#fff!important;background-color:var(--delete-color)!important}\n"], dependencies: [{ kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatAnchor, selector: "a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button]", exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: BsLinkButtonComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'bs-link-button', standalone: true, imports: [MatButton, MatIcon, EditSolidSvgComponent, MatAnchor, NgStyle], template: `
+		<a
+			type="{{ type() }}"
+			class="{{ classes() }}"
+			(click)="onClick.emit($event)"
+			(focus)="onFocus.emit($event)"
+			(blur)="onBlur.emit($event)"
+			[disabled]="disabled()"
+			[type]="type()"
+			[ngStyle]="style()"
+			[attr.data-cy]="'edit-link-button'"
+			mat-button>
+			<mat-icon>{{ icon() }}</mat-icon>
+			{{ label() }}
+		</a>
+	`, styles: [".primary-button,.primary-button:hover,.primary-button:active,.primary-button:visited{color:#fff!important;background-color:var(--primary-color)!important}.secondary-button,.secondary-button:hover,.secondary-button:active,.secondary-button:visited{color:#fff!important;background-color:var(--secondary-color)!important}.success-button,.success-button:hover,.success-button:active,.success-button:visited{color:#fff!important;background-color:var(--success-color)!important}.delete-button,.delete-button:hover,.delete-button:active,.success-button:visited{color:#fff!important;background-color:var(--delete-color)!important}\n"] }]
+        }], ctorParameters: () => [] });
+
+class DeleteButtonComponent extends BaseButtonComponent {
+    constructor() {
+        super();
+        this.loadingLabel = input('Deleting...');
+        this.label = input('Delete');
+        this.icon = input('delete');
+        this.classes = input('delete-button');
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: DeleteButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0", type: DeleteButtonComponent, isStandalone: true, selector: "delete-button", inputs: { loadingLabel: { classPropertyName: "loadingLabel", publicName: "loadingLabel", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, classes: { classPropertyName: "classes", publicName: "classes", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
+		<button
+			mat-raised-button
+			class="btn {{ classes() }}"
+			(click)="onClick.emit($event)"
+			(focus)="onFocus.emit($event)"
+			(blur)="onBlur.emit($event)"
+			[disabled]="disabled() || loading()"
+			[type]="type()"
+			[ngStyle]="style()"
+			[attr.data-cy]="'delete-button'">
+			@if (loading()) {
+				<span aria-hidden="true" class="spinner-border spinner-border-sm" role="status"></span>
+			}
+			@if (!loading()) {
+				<mat-icon>{{ icon() }}</mat-icon>
+			}
+			{{ loading() ? loadingLabel() : label() }}
+		</button>
+	`, isInline: true, styles: [".primary-button,.primary-button:hover,.primary-button:active,.primary-button:visited{color:#fff!important;background-color:var(--primary-color)!important}.secondary-button,.secondary-button:hover,.secondary-button:active,.secondary-button:visited{color:#fff!important;background-color:var(--secondary-color)!important}.success-button,.success-button:hover,.success-button:active,.success-button:visited{color:#fff!important;background-color:var(--success-color)!important}.delete-button,.delete-button:hover,.delete-button:active,.success-button:visited{color:#fff!important;background-color:var(--delete-color)!important}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$3.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1$4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: DeleteButtonComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'delete-button', standalone: true, imports: [MatButtonModule, MatIconModule, NgStyle], template: `
+		<button
+			mat-raised-button
+			class="btn {{ classes() }}"
+			(click)="onClick.emit($event)"
+			(focus)="onFocus.emit($event)"
+			(blur)="onBlur.emit($event)"
+			[disabled]="disabled() || loading()"
+			[type]="type()"
+			[ngStyle]="style()"
+			[attr.data-cy]="'delete-button'">
+			@if (loading()) {
+				<span aria-hidden="true" class="spinner-border spinner-border-sm" role="status"></span>
+			}
+			@if (!loading()) {
+				<mat-icon>{{ icon() }}</mat-icon>
+			}
+			{{ loading() ? loadingLabel() : label() }}
+		</button>
+	`, styles: [".primary-button,.primary-button:hover,.primary-button:active,.primary-button:visited{color:#fff!important;background-color:var(--primary-color)!important}.secondary-button,.secondary-button:hover,.secondary-button:active,.secondary-button:visited{color:#fff!important;background-color:var(--secondary-color)!important}.success-button,.success-button:hover,.success-button:active,.success-button:visited{color:#fff!important;background-color:var(--success-color)!important}.delete-button,.delete-button:hover,.delete-button:active,.success-button:visited{color:#fff!important;background-color:var(--delete-color)!important}\n"] }]
+        }], ctorParameters: () => [] });
+
+class EditButtonComponent extends BaseButtonComponent {
+    constructor() {
+        super();
+        this.label = input('Edit');
+        this.icon = input('edit');
+        this.classes = input('primary-button');
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: EditButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.0", type: EditButtonComponent, isStandalone: true, selector: "edit-button", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, classes: { classPropertyName: "classes", publicName: "classes", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
+		<button
+			class="{{ classes() }}"
+			(click)="onClick.emit($event)"
+			(focus)="onFocus.emit($event)"
+			(blur)="onBlur.emit($event)"
+			[disabled]="disabled()"
+			[type]="type()"
+			[ngStyle]="style()"
+			[attr.data-cy]="'edit-button'"
+			mat-raised-button>
+			<mat-icon>{{ icon() }}</mat-icon>
+			{{ label() }}
+		</button>
+	`, isInline: true, styles: [".primary-button,.primary-button:hover,.primary-button:active,.primary-button:visited{color:#fff!important;background-color:var(--primary-color)!important}.secondary-button,.secondary-button:hover,.secondary-button:active,.secondary-button:visited{color:#fff!important;background-color:var(--secondary-color)!important}.success-button,.success-button:hover,.success-button:active,.success-button:visited{color:#fff!important;background-color:var(--success-color)!important}.delete-button,.delete-button:hover,.delete-button:active,.success-button:visited{color:#fff!important;background-color:var(--delete-color)!important}\n"], dependencies: [{ kind: "component", type: MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: EditButtonComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'edit-button', standalone: true, imports: [MatButton, MatIcon, NgStyle], template: `
+		<button
+			class="{{ classes() }}"
+			(click)="onClick.emit($event)"
+			(focus)="onFocus.emit($event)"
+			(blur)="onBlur.emit($event)"
+			[disabled]="disabled()"
+			[type]="type()"
+			[ngStyle]="style()"
+			[attr.data-cy]="'edit-button'"
+			mat-raised-button>
+			<mat-icon>{{ icon() }}</mat-icon>
+			{{ label() }}
+		</button>
+	`, styles: [".primary-button,.primary-button:hover,.primary-button:active,.primary-button:visited{color:#fff!important;background-color:var(--primary-color)!important}.secondary-button,.secondary-button:hover,.secondary-button:active,.secondary-button:visited{color:#fff!important;background-color:var(--secondary-color)!important}.success-button,.success-button:hover,.success-button:active,.success-button:visited{color:#fff!important;background-color:var(--success-color)!important}.delete-button,.delete-button:hover,.delete-button:active,.success-button:visited{color:#fff!important;background-color:var(--delete-color)!important}\n"] }]
+        }], ctorParameters: () => [] });
+
+class EditBsButtonComponent extends BaseButtonComponent {
+    constructor() {
+        super();
+        this.label = input('Edit');
+        this.classes = input('text-primary');
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: EditBsButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.0", type: EditBsButtonComponent, isStandalone: true, selector: "edit-bs-button", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, classes: { classPropertyName: "classes", publicName: "classes", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
+		<button
+			color="primary"
+			type="{{ type() }}"
+			class="{{ classes() }}"
+			(click)="onClick.emit($event)"
+			(focus)="onFocus.emit($event)"
+			(blur)="onBlur.emit($event)"
+			[disabled]="disabled()"
+			[type]="type()"
+			[ngStyle]="style()"
+			[attr.data-cy]="'edit-bs-button'"
+			mat-button>
+			<edit-solid-svg></edit-solid-svg>
+			{{ label() }}
+		</button>
+	`, isInline: true, styles: [".primary-button,.primary-button:hover,.primary-button:active,.primary-button:visited{color:#fff!important;background-color:var(--primary-color)!important}.secondary-button,.secondary-button:hover,.secondary-button:active,.secondary-button:visited{color:#fff!important;background-color:var(--secondary-color)!important}.success-button,.success-button:hover,.success-button:active,.success-button:visited{color:#fff!important;background-color:var(--success-color)!important}.delete-button,.delete-button:hover,.delete-button:active,.success-button:visited{color:#fff!important;background-color:var(--delete-color)!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$5.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$3.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: EditSolidSvgComponent, selector: "edit-solid-svg" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: EditBsButtonComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'edit-bs-button', standalone: true, imports: [CommonModule, MatButtonModule, MatIconModule, EditSolidSvgComponent], template: `
+		<button
+			color="primary"
+			type="{{ type() }}"
+			class="{{ classes() }}"
+			(click)="onClick.emit($event)"
+			(focus)="onFocus.emit($event)"
+			(blur)="onBlur.emit($event)"
+			[disabled]="disabled()"
+			[type]="type()"
+			[ngStyle]="style()"
+			[attr.data-cy]="'edit-bs-button'"
+			mat-button>
+			<edit-solid-svg></edit-solid-svg>
+			{{ label() }}
+		</button>
+	`, styles: [".primary-button,.primary-button:hover,.primary-button:active,.primary-button:visited{color:#fff!important;background-color:var(--primary-color)!important}.secondary-button,.secondary-button:hover,.secondary-button:active,.secondary-button:visited{color:#fff!important;background-color:var(--secondary-color)!important}.success-button,.success-button:hover,.success-button:active,.success-button:visited{color:#fff!important;background-color:var(--success-color)!important}.delete-button,.delete-button:hover,.delete-button:active,.success-button:visited{color:#fff!important;background-color:var(--delete-color)!important}\n"] }]
+        }], ctorParameters: () => [] });
+
+class EditSvgIconButtonComponent extends BaseButtonComponent {
+    constructor() {
+        super();
+        this.label = input('Edit');
+        this.icon = input('edit');
+        this.classes = input('primary-button');
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: EditSvgIconButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.0", type: EditSvgIconButtonComponent, isStandalone: true, selector: "edit-svg-icon-button", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, classes: { classPropertyName: "classes", publicName: "classes", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
+		<button
+			type="{{ type() }}"
+			class="{{ classes() }}"
+			(click)="onClick.emit($event)"
+			(focus)="onFocus.emit($event)"
+			(blur)="onBlur.emit($event)"
+			[disabled]="disabled()"
+			[type]="type()"
+			[ngStyle]="style()"
+			[attr.data-cy]="'edit-svg-icon-button'"
+			mat-raised-button>
+			<edit-solid-svg></edit-solid-svg>
+			{{ label() }}
+		</button>
+	`, isInline: true, styles: [".primary-button,.primary-button:hover,.primary-button:active,.primary-button:visited{color:#fff!important;background-color:var(--primary-color)!important}.secondary-button,.secondary-button:hover,.secondary-button:active,.secondary-button:visited{color:#fff!important;background-color:var(--secondary-color)!important}.success-button,.success-button:hover,.success-button:active,.success-button:visited{color:#fff!important;background-color:var(--success-color)!important}.delete-button,.delete-button:hover,.delete-button:active,.success-button:visited{color:#fff!important;background-color:var(--delete-color)!important}\n"], dependencies: [{ kind: "component", type: MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: EditSolidSvgComponent, selector: "edit-solid-svg" }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: EditSvgIconButtonComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'edit-svg-icon-button', standalone: true, imports: [MatButton, EditSolidSvgComponent, NgStyle], template: `
+		<button
+			type="{{ type() }}"
+			class="{{ classes() }}"
+			(click)="onClick.emit($event)"
+			(focus)="onFocus.emit($event)"
+			(blur)="onBlur.emit($event)"
+			[disabled]="disabled()"
+			[type]="type()"
+			[ngStyle]="style()"
+			[attr.data-cy]="'edit-svg-icon-button'"
+			mat-raised-button>
+			<edit-solid-svg></edit-solid-svg>
+			{{ label() }}
+		</button>
+	`, styles: [".primary-button,.primary-button:hover,.primary-button:active,.primary-button:visited{color:#fff!important;background-color:var(--primary-color)!important}.secondary-button,.secondary-button:hover,.secondary-button:active,.secondary-button:visited{color:#fff!important;background-color:var(--secondary-color)!important}.success-button,.success-button:hover,.success-button:active,.success-button:visited{color:#fff!important;background-color:var(--success-color)!important}.delete-button,.delete-button:hover,.delete-button:active,.success-button:visited{color:#fff!important;background-color:var(--delete-color)!important}\n"] }]
+        }], ctorParameters: () => [] });
+
+class ManageButtonComponent extends BaseButtonComponent {
+    constructor() {
+        super();
+        this.label = input('Manage');
+        this.icon = input('settings');
+        this.classes = input('mr-3 btn btn-secondary secondary-button');
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: ManageButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.0", type: ManageButtonComponent, isStandalone: true, selector: "manage-button", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, classes: { classPropertyName: "classes", publicName: "classes", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
+		<button
+			mat-raised-button
+			class="{{ classes() }}"
+			(click)="onClick.emit($event)"
+			(focus)="onFocus.emit($event)"
+			(blur)="onBlur.emit($event)"
+			[disabled]="disabled()"
+			[type]="type()"
+			[ngStyle]="style()"
+			[attr.data-cy]="'manage-button'">
+			<mat-icon>{{ icon() }}</mat-icon>
+			{{ label() }}
+		</button>
+	`, isInline: true, styles: [".primary-button,.primary-button:hover,.primary-button:active,.primary-button:visited{color:#fff!important;background-color:var(--primary-color)!important}.secondary-button,.secondary-button:hover,.secondary-button:active,.secondary-button:visited{color:#fff!important;background-color:var(--secondary-color)!important}.success-button,.success-button:hover,.success-button:active,.success-button:visited{color:#fff!important;background-color:var(--success-color)!important}.delete-button,.delete-button:hover,.delete-button:active,.success-button:visited{color:#fff!important;background-color:var(--delete-color)!important}\n"], dependencies: [{ kind: "component", type: MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: ManageButtonComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'manage-button', standalone: true, imports: [MatButton, MatIcon, NgStyle], template: `
+		<button
+			mat-raised-button
+			class="{{ classes() }}"
+			(click)="onClick.emit($event)"
+			(focus)="onFocus.emit($event)"
+			(blur)="onBlur.emit($event)"
+			[disabled]="disabled()"
+			[type]="type()"
+			[ngStyle]="style()"
+			[attr.data-cy]="'manage-button'">
+			<mat-icon>{{ icon() }}</mat-icon>
+			{{ label() }}
+		</button>
+	`, styles: [".primary-button,.primary-button:hover,.primary-button:active,.primary-button:visited{color:#fff!important;background-color:var(--primary-color)!important}.secondary-button,.secondary-button:hover,.secondary-button:active,.secondary-button:visited{color:#fff!important;background-color:var(--secondary-color)!important}.success-button,.success-button:hover,.success-button:active,.success-button:visited{color:#fff!important;background-color:var(--success-color)!important}.delete-button,.delete-button:hover,.delete-button:active,.success-button:visited{color:#fff!important;background-color:var(--delete-color)!important}\n"] }]
+        }], ctorParameters: () => [] });
+
+class SavePrimaryButtonComponent extends BaseButtonComponent {
+    constructor() {
+        super();
+        this.loadingLabel = input('Saving...');
+        this.label = input('Save');
+        this.icon = input('save');
+        this.classes = input('btn-primary primary-button');
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: SavePrimaryButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0", type: SavePrimaryButtonComponent, isStandalone: true, selector: "save-primary-button", inputs: { loadingLabel: { classPropertyName: "loadingLabel", publicName: "loadingLabel", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, classes: { classPropertyName: "classes", publicName: "classes", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
+		<button
+			mat-raised-button
+			class="btn {{ classes() }}"
+			(click)="onClick.emit($event)"
+			(focus)="onFocus.emit($event)"
+			(blur)="onBlur.emit($event)"
+			[disabled]="disabled() || loading()"
+			[type]="type()"
+			[ngStyle]="style()"
+			[attr.data-cy]="'save-primary-button'">
+			@if (loading()) {
+				<span aria-hidden="true" class="spinner-border spinner-border-sm" role="status"></span>
+			}
+			@if (!loading()) {
+				<mat-icon>{{ icon() }}</mat-icon>
+			}
+			{{ loading() ? loadingLabel() : label() }}
+		</button>
+	`, isInline: true, styles: [".primary-button,.primary-button:hover,.primary-button:active,.primary-button:visited{color:#fff!important;background-color:var(--primary-color)!important}.secondary-button,.secondary-button:hover,.secondary-button:active,.secondary-button:visited{color:#fff!important;background-color:var(--secondary-color)!important}.success-button,.success-button:hover,.success-button:active,.success-button:visited{color:#fff!important;background-color:var(--success-color)!important}.delete-button,.delete-button:hover,.delete-button:active,.success-button:visited{color:#fff!important;background-color:var(--delete-color)!important}\n"], dependencies: [{ kind: "component", type: MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: SavePrimaryButtonComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'save-primary-button', standalone: true, imports: [MatButton, MatIcon, NgStyle], template: `
+		<button
+			mat-raised-button
+			class="btn {{ classes() }}"
+			(click)="onClick.emit($event)"
+			(focus)="onFocus.emit($event)"
+			(blur)="onBlur.emit($event)"
+			[disabled]="disabled() || loading()"
+			[type]="type()"
+			[ngStyle]="style()"
+			[attr.data-cy]="'save-primary-button'">
+			@if (loading()) {
+				<span aria-hidden="true" class="spinner-border spinner-border-sm" role="status"></span>
+			}
+			@if (!loading()) {
+				<mat-icon>{{ icon() }}</mat-icon>
+			}
+			{{ loading() ? loadingLabel() : label() }}
+		</button>
+	`, styles: [".primary-button,.primary-button:hover,.primary-button:active,.primary-button:visited{color:#fff!important;background-color:var(--primary-color)!important}.secondary-button,.secondary-button:hover,.secondary-button:active,.secondary-button:visited{color:#fff!important;background-color:var(--secondary-color)!important}.success-button,.success-button:hover,.success-button:active,.success-button:visited{color:#fff!important;background-color:var(--success-color)!important}.delete-button,.delete-button:hover,.delete-button:active,.success-button:visited{color:#fff!important;background-color:var(--delete-color)!important}\n"] }]
+        }], ctorParameters: () => [] });
+
+class SearchButtonComponent extends BaseButtonComponent {
+    constructor() {
+        super();
+        this.loadingLabel = input('Searching...');
+        this.label = input('Search');
+        this.icon = input('search');
+        this.classes = input('btn-primary primary-button');
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: SearchButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0", type: SearchButtonComponent, isStandalone: true, selector: "search-button", inputs: { loadingLabel: { classPropertyName: "loadingLabel", publicName: "loadingLabel", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, classes: { classPropertyName: "classes", publicName: "classes", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
+		<button
+			class="btn btn-primary primary-button {{ loading() || disabled() ? 'disabled' : '' }}"
+			mat-raised-button
+			type="{{ type() }}"
+			data-cy="primary-button">
+			@if (loading()) {
+				<span aria-hidden="true" class="spinner-border spinner-border-sm" role="status"></span>
+			}
+			@if (!loading()) {
+				<mat-icon>{{ icon() }}</mat-icon>
+			}
+			{{ loading() ? loadingLabel() : label() }}
+		</button>
+	`, isInline: true, styles: [".primary-button,.primary-button:hover,.primary-button:active,.primary-button:visited{color:#fff!important;background-color:var(--primary-color)!important}.secondary-button,.secondary-button:hover,.secondary-button:active,.secondary-button:visited{color:#fff!important;background-color:var(--secondary-color)!important}.success-button,.success-button:hover,.success-button:active,.success-button:visited{color:#fff!important;background-color:var(--success-color)!important}.delete-button,.delete-button:hover,.delete-button:active,.success-button:visited{color:#fff!important;background-color:var(--delete-color)!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$3.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1$4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: SearchButtonComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'search-button', standalone: true, imports: [CommonModule, MatButtonModule, MatIconModule], template: `
+		<button
+			class="btn btn-primary primary-button {{ loading() || disabled() ? 'disabled' : '' }}"
+			mat-raised-button
+			type="{{ type() }}"
+			data-cy="primary-button">
+			@if (loading()) {
+				<span aria-hidden="true" class="spinner-border spinner-border-sm" role="status"></span>
+			}
+			@if (!loading()) {
+				<mat-icon>{{ icon() }}</mat-icon>
+			}
+			{{ loading() ? loadingLabel() : label() }}
+		</button>
+	`, styles: [".primary-button,.primary-button:hover,.primary-button:active,.primary-button:visited{color:#fff!important;background-color:var(--primary-color)!important}.secondary-button,.secondary-button:hover,.secondary-button:active,.secondary-button:visited{color:#fff!important;background-color:var(--secondary-color)!important}.success-button,.success-button:hover,.success-button:active,.success-button:visited{color:#fff!important;background-color:var(--success-color)!important}.delete-button,.delete-button:hover,.delete-button:active,.success-button:visited{color:#fff!important;background-color:var(--delete-color)!important}\n"] }]
+        }], ctorParameters: () => [] });
+
+class SuccessButtonComponent extends BaseButtonComponent {
+    constructor() {
+        super();
+        this.loadingLabel = input('Updating...');
+        this.label = input('Update');
+        this.icon = input('save');
+        this.classes = input('success-button');
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: SuccessButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0", type: SuccessButtonComponent, isStandalone: true, selector: "success-button", inputs: { loadingLabel: { classPropertyName: "loadingLabel", publicName: "loadingLabel", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, classes: { classPropertyName: "classes", publicName: "classes", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
+		<button
+			mat-raised-button
+			class="btn {{ classes() }}"
+			(click)="onClick.emit($event)"
+			(focus)="onFocus.emit($event)"
+			(blur)="onBlur.emit($event)"
+			[disabled]="disabled() || loading()"
+			[type]="type()"
+			[ngStyle]="style()"
+			[attr.data-cy]="'success-button'">
+			@if (loading()) {
+				<span aria-hidden="true" class="spinner-border spinner-border-sm" role="status"></span>
+			}
+			@if (!loading()) {
+				<mat-icon>{{ icon() }}</mat-icon>
+			}
+			{{ loading() ? loadingLabel() : label() }}
+		</button>
+	`, isInline: true, dependencies: [{ kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: SuccessButtonComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'success-button',
+                    standalone: true,
+                    imports: [NgStyle, MatButton, MatIcon],
+                    template: `
+		<button
+			mat-raised-button
+			class="btn {{ classes() }}"
+			(click)="onClick.emit($event)"
+			(focus)="onFocus.emit($event)"
+			(blur)="onBlur.emit($event)"
+			[disabled]="disabled() || loading()"
+			[type]="type()"
+			[ngStyle]="style()"
+			[attr.data-cy]="'success-button'">
+			@if (loading()) {
+				<span aria-hidden="true" class="spinner-border spinner-border-sm" role="status"></span>
+			}
+			@if (!loading()) {
+				<mat-icon>{{ icon() }}</mat-icon>
+			}
+			{{ loading() ? loadingLabel() : label() }}
+		</button>
+	`,
+                }]
+        }], ctorParameters: () => [] });
+
+class ViewButtonComponent extends BaseButtonComponent {
+    constructor() {
+        super();
+        this.label = input('View');
+        this.icon = input('visibility');
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: ViewButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.0", type: ViewButtonComponent, isStandalone: true, selector: "view-button", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
+		<button
+			color="primary"
+			(click)="onClick.emit($event)"
+			(focus)="onFocus.emit($event)"
+			(blur)="onBlur.emit($event)"
+			[disabled]="disabled()"
+			mat-button>
+			<mat-icon>{{ icon() }}</mat-icon>
+			{{ label() }}
+		</button>
+	`, isInline: true, styles: [".primary-button,.primary-button:hover,.primary-button:active,.primary-button:visited{color:#fff!important;background-color:var(--primary-color)!important}.secondary-button,.secondary-button:hover,.secondary-button:active,.secondary-button:visited{color:#fff!important;background-color:var(--secondary-color)!important}.success-button,.success-button:hover,.success-button:active,.success-button:visited{color:#fff!important;background-color:var(--success-color)!important}.delete-button,.delete-button:hover,.delete-button:active,.success-button:visited{color:#fff!important;background-color:var(--delete-color)!important}\n"], dependencies: [{ kind: "component", type: MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: ViewButtonComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'view-button', standalone: true, imports: [MatButton, MatIcon], template: `
+		<button
+			color="primary"
+			(click)="onClick.emit($event)"
+			(focus)="onFocus.emit($event)"
+			(blur)="onBlur.emit($event)"
+			[disabled]="disabled()"
+			mat-button>
+			<mat-icon>{{ icon() }}</mat-icon>
+			{{ label() }}
+		</button>
+	`, styles: [".primary-button,.primary-button:hover,.primary-button:active,.primary-button:visited{color:#fff!important;background-color:var(--primary-color)!important}.secondary-button,.secondary-button:hover,.secondary-button:active,.secondary-button:visited{color:#fff!important;background-color:var(--secondary-color)!important}.success-button,.success-button:hover,.success-button:active,.success-button:visited{color:#fff!important;background-color:var(--success-color)!important}.delete-button,.delete-button:hover,.delete-button:active,.success-button:visited{color:#fff!important;background-color:var(--delete-color)!important}\n"] }]
+        }], ctorParameters: () => [] });
+
+class ViewPrimaryButtonComponent extends BaseButtonComponent {
+    constructor() {
+        super();
+        this.label = input('View');
+        this.icon = input('visibility');
+        this.classes = input('btn-primary primary-button');
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: ViewPrimaryButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.0", type: ViewPrimaryButtonComponent, isStandalone: true, selector: "view-primary-button", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, classes: { classPropertyName: "classes", publicName: "classes", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
+		<button
+			mat-raised-button
+			class="btn {{ classes() }}"
+			(click)="onClick.emit($event)"
+			(focus)="onFocus.emit($event)"
+			(blur)="onBlur.emit($event)"
+			[disabled]="disabled()"
+			[type]="type()"
+			[ngStyle]="style()"
+			[attr.data-cy]="'view-button'">
+			<mat-icon>{{ icon() }}</mat-icon>
+			{{ label() }}
+		</button>
+	`, isInline: true, styles: [".primary-button,.primary-button:hover,.primary-button:active,.primary-button:visited{color:#fff!important;background-color:var(--primary-color)!important}.secondary-button,.secondary-button:hover,.secondary-button:active,.secondary-button:visited{color:#fff!important;background-color:var(--secondary-color)!important}.success-button,.success-button:hover,.success-button:active,.success-button:visited{color:#fff!important;background-color:var(--success-color)!important}.delete-button,.delete-button:hover,.delete-button:active,.success-button:visited{color:#fff!important;background-color:var(--delete-color)!important}\n"], dependencies: [{ kind: "component", type: MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: ViewPrimaryButtonComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'view-primary-button', standalone: true, imports: [MatButton, MatIcon, NgStyle], template: `
+		<button
+			mat-raised-button
+			class="btn {{ classes() }}"
+			(click)="onClick.emit($event)"
+			(focus)="onFocus.emit($event)"
+			(blur)="onBlur.emit($event)"
+			[disabled]="disabled()"
+			[type]="type()"
+			[ngStyle]="style()"
+			[attr.data-cy]="'view-button'">
+			<mat-icon>{{ icon() }}</mat-icon>
+			{{ label() }}
+		</button>
+	`, styles: [".primary-button,.primary-button:hover,.primary-button:active,.primary-button:visited{color:#fff!important;background-color:var(--primary-color)!important}.secondary-button,.secondary-button:hover,.secondary-button:active,.secondary-button:visited{color:#fff!important;background-color:var(--secondary-color)!important}.success-button,.success-button:hover,.success-button:active,.success-button:visited{color:#fff!important;background-color:var(--success-color)!important}.delete-button,.delete-button:hover,.delete-button:active,.success-button:visited{color:#fff!important;background-color:var(--delete-color)!important}\n"] }]
+        }], ctorParameters: () => [] });
+
+class PrimaryButtonComponent extends BaseButtonComponent {
+    constructor() {
+        super();
+        this.loadingLabel = input('Saving...');
+        this.label = input('Save');
+        this.icon = input('save');
+        this.showIcon = input(false);
+        this.classes = input('btn-primary primary-button');
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: PrimaryButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0", type: PrimaryButtonComponent, isStandalone: true, selector: "primary-button", inputs: { loadingLabel: { classPropertyName: "loadingLabel", publicName: "loadingLabel", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, showIcon: { classPropertyName: "showIcon", publicName: "showIcon", isSignal: true, isRequired: false, transformFunction: null }, classes: { classPropertyName: "classes", publicName: "classes", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
+		<button
+			mat-raised-button
+			class="btn {{ classes() }}"
+			(click)="onClick.emit($event)"
+			(focus)="onFocus.emit($event)"
+			(blur)="onBlur.emit($event)"
+			[disabled]="disabled() || loading()"
+			[type]="type()"
+			[ngStyle]="style()"
+			[attr.data-cy]="'primary-button'">
+			@if (loading()) {
+				<span aria-hidden="true" class="spinner-border spinner-border-sm" role="status"></span>
+			}
+			@if (!loading() && showIcon()) {
+				<mat-icon>{{ icon() }}</mat-icon>
+			}
+			{{ loading() ? loadingLabel() : label() }}
+		</button>
+	`, isInline: true, styles: [".primary-button,.primary-button:hover,.primary-button:active,.primary-button:visited{color:#fff!important;background-color:var(--primary-color)!important}.secondary-button,.secondary-button:hover,.secondary-button:active,.secondary-button:visited{color:#fff!important;background-color:var(--secondary-color)!important}.success-button,.success-button:hover,.success-button:active,.success-button:visited{color:#fff!important;background-color:var(--success-color)!important}.delete-button,.delete-button:hover,.delete-button:active,.success-button:visited{color:#fff!important;background-color:var(--delete-color)!important}\n"], dependencies: [{ kind: "component", type: MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: PrimaryButtonComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'primary-button', standalone: true, imports: [MatButton, MatIcon, NgStyle], template: `
+		<button
+			mat-raised-button
+			class="btn {{ classes() }}"
+			(click)="onClick.emit($event)"
+			(focus)="onFocus.emit($event)"
+			(blur)="onBlur.emit($event)"
+			[disabled]="disabled() || loading()"
+			[type]="type()"
+			[ngStyle]="style()"
+			[attr.data-cy]="'primary-button'">
+			@if (loading()) {
+				<span aria-hidden="true" class="spinner-border spinner-border-sm" role="status"></span>
+			}
+			@if (!loading() && showIcon()) {
+				<mat-icon>{{ icon() }}</mat-icon>
+			}
+			{{ loading() ? loadingLabel() : label() }}
+		</button>
+	`, styles: [".primary-button,.primary-button:hover,.primary-button:active,.primary-button:visited{color:#fff!important;background-color:var(--primary-color)!important}.secondary-button,.secondary-button:hover,.secondary-button:active,.secondary-button:visited{color:#fff!important;background-color:var(--secondary-color)!important}.success-button,.success-button:hover,.success-button:active,.success-button:visited{color:#fff!important;background-color:var(--success-color)!important}.delete-button,.delete-button:hover,.delete-button:active,.success-button:visited{color:#fff!important;background-color:var(--delete-color)!important}\n"] }]
+        }], ctorParameters: () => [] });
+
+class PdfExportButtonComponent {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: PdfExportButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0", type: PdfExportButtonComponent, isStandalone: true, selector: "pdf-export-button", ngImport: i0, template: ` <button class="pdf-export-button" mat-raised-button type="button" data-cy="pdf-export-button">PDF</button> `, isInline: true, styles: [".pdf-export-button{margin-left:20px!important;width:100px;color:#fff!important;background-color:#a3071b!important;border-radius:24px!important}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$3.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: PdfExportButtonComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pdf-export-button', standalone: true, imports: [MatButtonModule], template: ` <button class="pdf-export-button" mat-raised-button type="button" data-cy="pdf-export-button">PDF</button> `, styles: [".pdf-export-button{margin-left:20px!important;width:100px;color:#fff!important;background-color:#a3071b!important;border-radius:24px!important}\n"] }]
+        }] });
+
+class ExcelExportButtonComponent {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: ExcelExportButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0", type: ExcelExportButtonComponent, isStandalone: true, selector: "excel-export-button", ngImport: i0, template: ` <button class="excel-export-button" mat-raised-button type="button" data-cy="excel-export-button">Excel</button> `, isInline: true, styles: [".primary-button,.primary-button:hover,.primary-button:active,.primary-button:visited{color:#fff!important;background-color:var(--primary-color)!important}.secondary-button,.secondary-button:hover,.secondary-button:active,.secondary-button:visited{color:#fff!important;background-color:var(--secondary-color)!important}.success-button,.success-button:hover,.success-button:active,.success-button:visited{color:#fff!important;background-color:var(--success-color)!important}.delete-button,.delete-button:hover,.delete-button:active,.success-button:visited{color:#fff!important;background-color:var(--delete-color)!important}\n", ".excel-export-button{margin-left:20px!important;margin-right:20px!important;width:100px;color:#fff!important;background-color:#006400!important;border-radius:24px!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$3.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: ExcelExportButtonComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'excel-export-button', standalone: true, imports: [CommonModule, MatButtonModule], template: ` <button class="excel-export-button" mat-raised-button type="button" data-cy="excel-export-button">Excel</button> `, styles: [".primary-button,.primary-button:hover,.primary-button:active,.primary-button:visited{color:#fff!important;background-color:var(--primary-color)!important}.secondary-button,.secondary-button:hover,.secondary-button:active,.secondary-button:visited{color:#fff!important;background-color:var(--secondary-color)!important}.success-button,.success-button:hover,.success-button:active,.success-button:visited{color:#fff!important;background-color:var(--success-color)!important}.delete-button,.delete-button:hover,.delete-button:active,.success-button:visited{color:#fff!important;background-color:var(--delete-color)!important}\n", ".excel-export-button{margin-left:20px!important;margin-right:20px!important;width:100px;color:#fff!important;background-color:#006400!important;border-radius:24px!important}\n"] }]
+        }] });
+
+class ConfirmDialogComponent {
+    constructor(data, dialogRef) {
+        this.data = data;
+        this.dialogRef = dialogRef;
+        // Update view with given values
+        this.title = data.title;
+        this.message = data.message;
+    }
+    onDismiss() {
+        // Close the dialog, return true
+        this.dialogRef.close(false);
+    }
+    onConfirm() {
+        // Close the dialog, return true
+        this.dialogRef.close(true);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: ConfirmDialogComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i1$6.MatDialogRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0", type: ConfirmDialogComponent, isStandalone: true, selector: "app-confirm-dialog", ngImport: i0, template: `
+		<div class="mat-dialog-title" style="text-align: center">
+			<h3 class="m-3 mat-headline-5	">{{ title }}</h3>
+		</div>
+
+		<mat-divider></mat-divider>
+		<div mat-dialog-content style="margin: 20px">
+			<p>{{ message }}</p>
+		</div>
+
+		<div align="end" class="modal-footer" mat-dialog-actions>
+			<button (click)="onDismiss()" mat-raised-button>No</button>
+			<button (click)="onConfirm()" class="primary-button" mat-raised-button>Yes</button>
+		</div>
+	`, isInline: true, dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$3.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i3$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i1$6.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1$6.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: ConfirmDialogComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'app-confirm-dialog', standalone: true, imports: [MatButtonModule, MatDividerModule, MatDialogModule], template: `
+		<div class="mat-dialog-title" style="text-align: center">
+			<h3 class="m-3 mat-headline-5	">{{ title }}</h3>
+		</div>
+
+		<mat-divider></mat-divider>
+		<div mat-dialog-content style="margin: 20px">
+			<p>{{ message }}</p>
+		</div>
+
+		<div align="end" class="modal-footer" mat-dialog-actions>
+			<button (click)="onDismiss()" mat-raised-button>No</button>
+			<button (click)="onConfirm()" class="primary-button" mat-raised-button>Yes</button>
+		</div>
+	` }]
+        }], ctorParameters: () => [{ type: undefined, decorators: [{
+                    type: Inject,
+                    args: [MAT_DIALOG_DATA]
+                }] }, { type: i1$6.MatDialogRef }] });
+
+class ErrorSnackBarComponent {
+    constructor(msb, data) {
+        this.msb = msb;
+        this.data = data;
+    }
+    /**
+     * Close the Snack Bar
+     *
+     * @author Pavan Kumar Jadda
+     * @since 2.7.18
+     */
+    close() {
+        this.msb.dismissWithAction();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: ErrorSnackBarComponent, deps: [{ token: i1$7.MatSnackBarRef }, { token: MAT_SNACK_BAR_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0", type: ErrorSnackBarComponent, isStandalone: true, selector: "app-error-snack-bar", ngImport: i0, template: `
+		<div class="custom-flex-center error-snackbar">
+			<mat-icon>error</mat-icon>
+			<label>{{ data.message }}</label>
+			<button style="margin-left: auto" (click)="close()" mat-icon-button>
+				<mat-icon>close</mat-icon>
+			</button>
+		</div>
+	`, isInline: true, styles: [":root{--primary-color: #153d77;--secondary-color: #6c757d;--white-color: #fff;--success-color: #198754;--delete-color: #dc3545;--background-color: #f2f2f2}.success-snackbar{color:#fff;--mdc-snackbar-container-color: var(--success-color);--mat-mdc-snack-bar-button-color: var(--white-color)}.error-snackbar{color:#fff;--mdc-snackbar-container-color: var(--delete-color);--mat-mdc-snack-bar-button-color: var(--white-color)}.light-success-snackbar{color:#155724;background-color:#d4edda;--mdc-snackbar-container-color: #d4edda;--mat-mdc-snack-bar-button-color: darkgreen}.light-error-snackbar{color:#721c24;--mdc-snackbar-container-color: var(--success-color);--mat-mdc-snack-bar-button-color: darkred;border-color:#f5c6cb}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1$4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$3.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: ErrorSnackBarComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'app-error-snack-bar', standalone: true, imports: [CommonModule, MatIconModule, MatButtonModule], template: `
+		<div class="custom-flex-center error-snackbar">
+			<mat-icon>error</mat-icon>
+			<label>{{ data.message }}</label>
+			<button style="margin-left: auto" (click)="close()" mat-icon-button>
+				<mat-icon>close</mat-icon>
+			</button>
+		</div>
+	`, styles: [":root{--primary-color: #153d77;--secondary-color: #6c757d;--white-color: #fff;--success-color: #198754;--delete-color: #dc3545;--background-color: #f2f2f2}.success-snackbar{color:#fff;--mdc-snackbar-container-color: var(--success-color);--mat-mdc-snack-bar-button-color: var(--white-color)}.error-snackbar{color:#fff;--mdc-snackbar-container-color: var(--delete-color);--mat-mdc-snack-bar-button-color: var(--white-color)}.light-success-snackbar{color:#155724;background-color:#d4edda;--mdc-snackbar-container-color: #d4edda;--mat-mdc-snack-bar-button-color: darkgreen}.light-error-snackbar{color:#721c24;--mdc-snackbar-container-color: var(--success-color);--mat-mdc-snack-bar-button-color: darkred;border-color:#f5c6cb}\n"] }]
+        }], ctorParameters: () => [{ type: i1$7.MatSnackBarRef }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: [MAT_SNACK_BAR_DATA]
+                }] }] });
+
+class SuccessSnackBarComponent {
+    constructor(msb, data) {
+        this.msb = msb;
+        this.data = data;
+    }
+    /**
+     * Close the Snack Bar
+     *
+     * @author Pavan Kumar Jadda
+     * @since 2.7.18
+     */
+    close() {
+        this.msb.dismissWithAction();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: SuccessSnackBarComponent, deps: [{ token: i1$7.MatSnackBarRef }, { token: MAT_SNACK_BAR_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0", type: SuccessSnackBarComponent, isStandalone: true, selector: "app-success-snack-bar", ngImport: i0, template: `
+		<div class="custom-flex-center success-snackbar">
+			<mat-icon>check_circle</mat-icon>
+			<label>{{ data.message }}</label>
+			<button style="margin-left: auto" (click)="close()" mat-icon-button>
+				<mat-icon>close</mat-icon>
+			</button>
+		</div>
+	`, isInline: true, styles: [":root{--primary-color: #153d77;--secondary-color: #6c757d;--white-color: #fff;--success-color: #198754;--delete-color: #dc3545;--background-color: #f2f2f2}.success-snackbar{color:#fff;--mdc-snackbar-container-color: var(--success-color);--mat-mdc-snack-bar-button-color: var(--white-color)}.error-snackbar{color:#fff;--mdc-snackbar-container-color: var(--delete-color);--mat-mdc-snack-bar-button-color: var(--white-color)}.light-success-snackbar{color:#155724;background-color:#d4edda;--mdc-snackbar-container-color: #d4edda;--mat-mdc-snack-bar-button-color: darkgreen}.light-error-snackbar{color:#721c24;--mdc-snackbar-container-color: var(--success-color);--mat-mdc-snack-bar-button-color: darkred;border-color:#f5c6cb}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$3.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1$4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: SuccessSnackBarComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'app-success-snack-bar', standalone: true, imports: [CommonModule, MatButtonModule, MatIconModule], template: `
+		<div class="custom-flex-center success-snackbar">
+			<mat-icon>check_circle</mat-icon>
+			<label>{{ data.message }}</label>
+			<button style="margin-left: auto" (click)="close()" mat-icon-button>
+				<mat-icon>close</mat-icon>
+			</button>
+		</div>
+	`, styles: [":root{--primary-color: #153d77;--secondary-color: #6c757d;--white-color: #fff;--success-color: #198754;--delete-color: #dc3545;--background-color: #f2f2f2}.success-snackbar{color:#fff;--mdc-snackbar-container-color: var(--success-color);--mat-mdc-snack-bar-button-color: var(--white-color)}.error-snackbar{color:#fff;--mdc-snackbar-container-color: var(--delete-color);--mat-mdc-snack-bar-button-color: var(--white-color)}.light-success-snackbar{color:#155724;background-color:#d4edda;--mdc-snackbar-container-color: #d4edda;--mat-mdc-snack-bar-button-color: darkgreen}.light-error-snackbar{color:#721c24;--mdc-snackbar-container-color: var(--success-color);--mat-mdc-snack-bar-button-color: darkred;border-color:#f5c6cb}\n"] }]
+        }], ctorParameters: () => [{ type: i1$7.MatSnackBarRef }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: [MAT_SNACK_BAR_DATA]
+                }] }] });
+
+class MatSnackBarService {
+    constructor(snackBar) {
+        this.snackBar = snackBar;
+        /**
+         * Duration (in milliseconds) of the Snack Bar to be open. Defaults to 5 seconds(5000 milliseconds)
+         */
+        this.duration = 500000;
+        /**
+         * Horizontal Position of the MatSnackBar. Defaults to left side
+         */
+        this.horizontalPosition = 'right';
+        /**
+         * Vertical Position of the MatSnackBar. Defaults to page bottom
+         */
+        this.verticalPosition = 'top';
+    }
+    /**
+     * Opens Success Snack Bar
+     *
+     * @param message Message to display on Snack Bar
+     * @param options Options of the Snack Bar
+     *
+     * @author Pavan Kumar Jadda
+     * @since 2.2.3
+     */
+    success(message, options) {
+        this.snackBar.openFromComponent(SuccessSnackBarComponent, {
+            data: { message },
+            duration: options?.duration ?? this.duration,
+            panelClass: options?.panelClass ?? 'success-snackbar',
+            horizontalPosition: options?.horizontalPosition ?? this.horizontalPosition,
+            verticalPosition: options?.verticalPosition ?? this.verticalPosition,
+        });
+    }
+    /**
+     * Opens Error Snack Bar
+     *
+     * @param message Message to display on Snack Bar
+     * @param options Options of the Snack Bar
+     *
+     * @author Pavan Kumar Jadda
+     * @since 2.2.3
+     */
+    error(message, options) {
+        this.snackBar.openFromComponent(ErrorSnackBarComponent, {
+            data: { message },
+            duration: options?.duration ?? 10000,
+            panelClass: options?.panelClass ?? 'error-snackbar',
+            horizontalPosition: options?.horizontalPosition ?? this.horizontalPosition,
+            verticalPosition: options?.verticalPosition ?? this.verticalPosition,
+        });
+    }
+    /**
+     * Opens Generic Snack Bar
+     *
+     * @param message Message to display on Snack Bar
+     *
+     * @author Pavan Kumar Jadda
+     * @since 2.2.3
+     */
+    open(message) {
+        this.snackBar.open(message, 'Close', {
+            duration: this.duration,
+            horizontalPosition: this.horizontalPosition,
+            verticalPosition: this.verticalPosition,
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: MatSnackBarService, deps: [{ token: i1$7.MatSnackBar }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: MatSnackBarService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: MatSnackBarService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }], ctorParameters: () => [{ type: i1$7.MatSnackBar }] });
+
+/**
+ * Initialize Loading or Update ProgressState
+ *
+ * @return Updated State Object
+ *
+ * @author Pavan Kumar Jadda
+ * @since 2.7.16
+ */
+const initializeState = () => {
+    return signal({
+        isLoading: false,
+        isSuccess: false,
+        isError: false,
+        isComplete: false,
+        message: '',
+    });
+};
+/**
+ * Initialize Loading or Update ProgressState
+ *
+ * @param progressState Object to initialize
+ * @return ProgressState Updated State Object
+ *
+ * @author Pavan Kumar Jadda
+ * @since 2.7.16
+ */
+const markLoading = (progressState) => {
+    progressState.update((state) => {
+        return {
+            ...state,
+            isLoading: true,
+            isSuccess: false,
+            isError: false,
+            isComplete: false,
+            message: '',
+        };
+    });
+};
+/**
+ * Update state as isSuccess
+ *
+ * @return ProgressState Updated State Object
+ *
+ * @author Pavan Kumar Jadda
+ * @since 2.7.16
+ */
+const markSuccess = (progressState, message) => {
+    progressState.update((state) => {
+        return {
+            ...state,
+            isLoading: false,
+            isSuccess: true,
+            isError: false,
+            isComplete: true,
+            message: message || '',
+        };
+    });
+};
+/**
+ * Update state as failure or isError
+ *
+ * @return ProgressState Updated State Object
+ *
+ * @author Pavan Kumar Jadda
+ * @since 2.7.16
+ */
+const markError = (progressState, message) => {
+    progressState.update((state) => {
+        return {
+            ...state,
+            isLoading: false,
+            isSuccess: false,
+            isError: true,
+            isComplete: true,
+            message: message || '',
+        };
+    });
+};
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { AlertComponent, AutocompleteComponent, BsLinkButtonComponent, ConfirmDialogComponent, DeleteButtonComponent, EditBsButtonComponent, EditButtonComponent, EditSolidSvgComponent, EditSvgIconButtonComponent, ExcelExportButtonComponent, ManageButtonComponent, MatSnackBarService, NgxPrintDirective, NgxSpinnerComponent, NgxSpinnerService, PdfExportButtonComponent, PreventMultipleClicksDirective, PrimaryButtonComponent, SavePrimaryButtonComponent, SearchButtonComponent, SpinnerComponent, SuccessButtonComponent, ViewButtonComponent, ViewPrimaryButtonComponent, initializeState, markError, markLoading, markSuccess };
+//# sourceMappingURL=js-smart-ng-kit.mjs.map