@ferhaps/easy-ui-lib 0.0.8 → 1.0.0

package/fesm2022/ferhaps-easy-ui-lib.mjs

@@ -1,572 +0,0 @@
-import * as i0 from '@angular/core';
-import { Pipe, input, Directive, HostListener, output, Component, Input, viewChild, Injectable, inject, Inject } from '@angular/core';
-import * as i2 from '@angular/forms';
-import { NG_VALIDATORS, FormGroup, FormControl, ReactiveFormsModule } from '@angular/forms';
-import * as i1$1 from '@angular/material/icon';
-import { MatIconModule } from '@angular/material/icon';
-import * as i3 from '@angular/material/dialog';
-import { MatDialogModule, MAT_DIALOG_DATA, MatDialog } from '@angular/material/dialog';
-import * as i1 from '@angular/common';
-import { CommonModule, AsyncPipe } from '@angular/common';
-import * as i1$4 from '@angular/common/http';
-import { HttpErrorResponse } from '@angular/common/http';
-import { debounceTime, distinctUntilChanged, BehaviorSubject, Subject, Subscription } from 'rxjs';
-import { trigger, transition, style, animate, state } from '@angular/animations';
-import * as i1$2 from '@angular/material/menu';
-import { MatMenuModule } from '@angular/material/menu';
-import * as i3$1 from '@angular/material/button';
-import { MatButtonModule } from '@angular/material/button';
-import * as i4 from '@angular/cdk/drag-drop';
-import { moveItemInArray, DragDropModule } from '@angular/cdk/drag-drop';
-import * as i1$3 from '@angular/material/progress-spinner';
-import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
-import { NoopScrollStrategy } from '@angular/cdk/overlay';
-
-class WhiteSpaceFillerPipe {
-    transform(value, fillWith = '-') {
-        if (value === 0) {
-            return '0';
-        }
-        return value ? value : fillWith;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: WhiteSpaceFillerPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.0.6", ngImport: i0, type: WhiteSpaceFillerPipe, isStandalone: true, name: "blankFiller" }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: WhiteSpaceFillerPipe, decorators: [{
-            type: Pipe,
-            args: [{
-                    name: 'blankFiller',
-                }]
-        }] });
-
-class SnakeCaseParserPipe {
-    transform(str) {
-        if (str) {
-            let temp = str.split('_').map(word => {
-                return word.toLowerCase();
-            }).join(' ');
-            return temp.charAt(0).toUpperCase() + temp.slice(1);
-        }
-        return '';
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: SnakeCaseParserPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.0.6", ngImport: i0, type: SnakeCaseParserPipe, isStandalone: true, name: "snakeCaseParser" }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: SnakeCaseParserPipe, decorators: [{
-            type: Pipe,
-            args: [{
-                    name: 'snakeCaseParser',
-                }]
-        }] });
-
-class FieldsMatchValidatorDirective {
-    constructor() {
-        this.fieldToMatch = input.required();
-    }
-    validate(control) {
-        const value = control.value;
-        if (!value) {
-            return null;
-        }
-        const matchingControl = control.root.get(this.fieldToMatch());
-        if (!matchingControl) {
-            return null;
-        }
-        if (value !== matchingControl.value) {
-            return { mismatch: true };
-        }
-        return null;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: FieldsMatchValidatorDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.0.6", type: FieldsMatchValidatorDirective, isStandalone: true, selector: "[libFieldsMatchValidator]", inputs: { fieldToMatch: { classPropertyName: "fieldToMatch", publicName: "fieldToMatch", isSignal: true, isRequired: true, transformFunction: null } }, providers: [
-            {
-                provide: NG_VALIDATORS,
-                useExisting: FieldsMatchValidatorDirective,
-                multi: true,
-            },
-        ], ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: FieldsMatchValidatorDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[libFieldsMatchValidator]',
-                    providers: [
-                        {
-                            provide: NG_VALIDATORS,
-                            useExisting: FieldsMatchValidatorDirective,
-                            multi: true,
-                        },
-                    ],
-                }]
-        }] });
-
-class PhoneValidationDirective {
-    onInput(event) {
-        const input = event.target;
-        if (!input.value.includes('+')) {
-            input.value = `+${input.value}`;
-        }
-        const regex = /^[0-9+]*$/;
-        if (!regex.test(input.value)) {
-            input.value = input.value.replace(/[^0-9+]/g, '');
-        }
-    }
-    onKeyDown(event) {
-        const inputValue = event.target.value;
-        if (event.key === 'Backspace' && inputValue === '+') {
-            event.preventDefault();
-        }
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: PhoneValidationDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.6", type: PhoneValidationDirective, isStandalone: true, selector: "[libPhoneValidation]", host: { listeners: { "input": "onInput($event)", "keydown": "onKeyDown($event)" } }, ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: PhoneValidationDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[libPhoneValidation]',
-                }]
-        }], propDecorators: { onInput: [{
-                type: HostListener,
-                args: ['input', ['$event']]
-            }], onKeyDown: [{
-                type: HostListener,
-                args: ['keydown', ['$event']]
-            }] } });
-
-class PasswordValidatorDirective {
-    validate(control) {
-        const password = control.value;
-        const pattern = /^(?=.*[A-Z])(?=.*[!@#\$%\^&\*])(?=.*\d)/;
-        if (password && !pattern.test(password)) {
-            return { passwordInvalid: true };
-        }
-        return null;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: PasswordValidatorDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.6", type: PasswordValidatorDirective, isStandalone: true, selector: "[libPasswordValidator]", providers: [
-            {
-                provide: NG_VALIDATORS,
-                useExisting: PasswordValidatorDirective,
-                multi: true
-            }
-        ], ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: PasswordValidatorDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[libPasswordValidator]',
-                    providers: [
-                        {
-                            provide: NG_VALIDATORS,
-                            useExisting: PasswordValidatorDirective,
-                            multi: true
-                        }
-                    ]
-                }]
-        }] });
-
-class DefaultDialogComponent {
-    constructor() {
-        this.height = input();
-        this.dialogTitle = input();
-        this.withBack = input();
-        this.back = output();
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: DefaultDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.6", type: DefaultDialogComponent, isStandalone: true, selector: "lib-default-dialog", inputs: { temRef: { classPropertyName: "temRef", publicName: "temRef", isSignal: false, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, dialogTitle: { classPropertyName: "dialogTitle", publicName: "dialogTitle", isSignal: true, isRequired: false, transformFunction: null }, withBack: { classPropertyName: "withBack", publicName: "withBack", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { back: "back" }, ngImport: i0, template: "<div class=\"modal\" [style]=\"{'height': height()}\">\r\n  <div class=\"dialog-title\">\r\n    @if (withBack()) {\r\n      <div class=\"back-arrow\" (click)=\"back.emit()\">\r\n        <mat-icon>keyboard_arrow_left</mat-icon>\r\n      </div>\r\n    }\r\n    <h4 class=\"title\">{{ dialogTitle() }}</h4>\r\n    <div class=\"closer\" mat-dialog-close>\r\n      <mat-icon>close</mat-icon>\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"dialog-content\">\r\n    <ng-content select=\".dialog-content\"></ng-content>\r\n    <ng-template #tempBody></ng-template>\r\n    <ng-container *ngTemplateOutlet=\"temRef ? temRef: tempBody\" />\r\n  </div>\r\n</div>", styles: [".modal{display:flex;flex-direction:column}.dialog-title{padding-inline:2rem;padding-top:1rem;margin-bottom:1rem;position:relative;display:flex;font-size:20px;justify-content:center}.dialog-title .back-arrow{cursor:pointer;margin-right:.5rem}.dialog-title .title{font-weight:700;font-size:24px;margin:0!important}.dialog-title .closer{right:3%;position:absolute;cursor:pointer}.dialog-content{flex:1;min-height:0;overflow:hidden;padding-bottom:1rem;display:flex;flex-direction:column;align-items:center}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i3.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: DefaultDialogComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'lib-default-dialog', imports: [
-                        CommonModule,
-                        MatIconModule,
-                        MatDialogModule
-                    ], template: "<div class=\"modal\" [style]=\"{'height': height()}\">\r\n  <div class=\"dialog-title\">\r\n    @if (withBack()) {\r\n      <div class=\"back-arrow\" (click)=\"back.emit()\">\r\n        <mat-icon>keyboard_arrow_left</mat-icon>\r\n      </div>\r\n    }\r\n    <h4 class=\"title\">{{ dialogTitle() }}</h4>\r\n    <div class=\"closer\" mat-dialog-close>\r\n      <mat-icon>close</mat-icon>\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"dialog-content\">\r\n    <ng-content select=\".dialog-content\"></ng-content>\r\n    <ng-template #tempBody></ng-template>\r\n    <ng-container *ngTemplateOutlet=\"temRef ? temRef: tempBody\" />\r\n  </div>\r\n</div>", styles: [".modal{display:flex;flex-direction:column}.dialog-title{padding-inline:2rem;padding-top:1rem;margin-bottom:1rem;position:relative;display:flex;font-size:20px;justify-content:center}.dialog-title .back-arrow{cursor:pointer;margin-right:.5rem}.dialog-title .title{font-weight:700;font-size:24px;margin:0!important}.dialog-title .closer{right:3%;position:absolute;cursor:pointer}.dialog-content{flex:1;min-height:0;overflow:hidden;padding-bottom:1rem;display:flex;flex-direction:column;align-items:center}\n"] }]
-        }], propDecorators: { temRef: [{
-                type: Input
-            }] } });
-
-class ErrorDispalyComponent {
-    constructor() {
-        this.error = input.required();
-        this.displayError = '';
-    }
-    ngOnInit() {
-        if (this.error() instanceof HttpErrorResponse) {
-            if (typeof this.error().error === 'string') {
-                this.displayError = this.error().error;
-            }
-            else if (this.error && this.error()?.error?.message) {
-                this.displayError = this.error().error.message;
-            }
-            else {
-                this.displayError = 'Unknown error';
-            }
-        }
-        else if (typeof this.error() === 'string') {
-            this.displayError = this.error();
-        }
-        else {
-            this.displayError = 'Unknown error';
-        }
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: ErrorDispalyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.0.6", type: ErrorDispalyComponent, isStandalone: true, selector: "lib-error-dispaly", inputs: { error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: `<strong class="err-container">{{ displayError | snakeCaseParser }}</strong>`, isInline: true, styles: [".err-container{display:block;max-width:300px;font-size:20px;text-align:center;border:1px solid red;border-radius:5px;padding:.5rem 1.5rem;background-color:#ffe6e6;color:red;overflow-wrap:break-word}\n"], dependencies: [{ kind: "pipe", type: SnakeCaseParserPipe, name: "snakeCaseParser" }] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: ErrorDispalyComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'lib-error-dispaly', imports: [
-                        SnakeCaseParserPipe
-                    ], template: `<strong class="err-container">{{ displayError | snakeCaseParser }}</strong>`, styles: [".err-container{display:block;max-width:300px;font-size:20px;text-align:center;border:1px solid red;border-radius:5px;padding:.5rem 1.5rem;background-color:#ffe6e6;color:red;overflow-wrap:break-word}\n"] }]
-        }] });
-
-class SearchBarComponent {
-    constructor() {
-        this.for = input.required();
-        this.search = output();
-        this.searchForm = new FormGroup({
-            search: new FormControl('')
-        });
-        this.searchForm.get('search')?.valueChanges.
-            pipe(debounceTime(1000), distinctUntilChanged()).subscribe((searchTerm) => {
-            if (searchTerm.trim() !== '') {
-                this.search.emit(searchTerm);
-            }
-        });
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: SearchBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.0.6", type: SearchBarComponent, isStandalone: true, selector: "lib-search-bar", inputs: { for: { classPropertyName: "for", publicName: "for", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { search: "search" }, ngImport: i0, template: `
-  <form class="search-bar" [formGroup]="searchForm">
-    <mat-icon>search</mat-icon>
-    <input class="search-input" type="search" name="field"
-      [placeholder]="'Search ' + for()" autocomplete="off" formControlName="search" />
-  </form>
-`, isInline: true, styles: [".search-bar{width:270px;border:1px solid #A4A4A4;display:flex;align-items:center}.search-input{border:none;padding:7px 11px;height:100%;width:100%;background-color:transparent}mat-icon{margin-inline:8px}.search-input:focus{border:none;outline:none}@media (max-width: 1086px){.search-bar{width:170px}}\n"], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: SearchBarComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'lib-search-bar', template: `
-  <form class="search-bar" [formGroup]="searchForm">
-    <mat-icon>search</mat-icon>
-    <input class="search-input" type="search" name="field"
-      [placeholder]="'Search ' + for()" autocomplete="off" formControlName="search" />
-  </form>
-`, imports: [
-                        MatIconModule,
-                        ReactiveFormsModule
-                    ], styles: [".search-bar{width:270px;border:1px solid #A4A4A4;display:flex;align-items:center}.search-input{border:none;padding:7px 11px;height:100%;width:100%;background-color:transparent}mat-icon{margin-inline:8px}.search-input:focus{border:none;outline:none}@media (max-width: 1086px){.search-bar{width:170px}}\n"] }]
-        }], ctorParameters: () => [] });
-
-const fader = trigger('fadeInOut', [
-    transition(':enter', [
-        style({ opacity: 0 }),
-        animate('200ms', style({ opacity: 1 })),
-    ]),
-    transition(':leave', [
-        animate('200ms', style({ opacity: 0 })),
-    ]),
-]);
-const openDropdown = trigger('open-close-dropdown', [
-    transition(':enter', [
-        style({ height: 0, overflow: 'hidden' }),
-        animate('200ms ease', style({ height: '*' }))
-    ]),
-    transition(':leave', [
-        style({ height: '*', overflow: 'hidden' }),
-        animate('200ms ease', style({ height: 0 }))
-    ])
-]);
-const textFader = trigger('textFader', [
-    state('void', style({ opacity: 0 })),
-    state('*', style({ opacity: 1 })),
-    transition('void => *', [animate('0.3s 0.3s ease-in')]),
-    transition('* => void', [animate('0.3s ease-in')])
-]);
-
-class TableSortHeaderComponent {
-    constructor() {
-        this.selected = input.required();
-        this.sort = output();
-        this.sortState = 'none';
-    }
-    onSortClick() {
-        if (this.sortState === 'none') {
-            this.sortState = 'desc';
-        }
-        else if (this.sortState === 'desc') {
-            this.sortState = 'asc';
-        }
-        else {
-            this.sortState = 'none';
-        }
-        this.sort.emit(this.sortState);
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: TableSortHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.0.6", type: TableSortHeaderComponent, isStandalone: true, selector: "lib-table-sort-header", inputs: { selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { sort: "sort" }, ngImport: i0, template: "<div class=\"sorting-container\" (click)=\"onSortClick()\">\r\n  <mat-icon\r\n    [class.selected]=\"selected() && sortState != 'none'\"\r\n    [class.rotated]=\"sortState == 'asc'\">\r\n    sort\r\n  </mat-icon>\r\n</div>", styles: [".sorting-container{display:flex;align-items:center}.sorting-container *{cursor:pointer}.sorting-container .selected{color:#31adff;background-color:#ebf7fc}.sorting-container .rotated{transform:rotate(180deg) scaleX(-1)}\n"], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: TableSortHeaderComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'lib-table-sort-header', imports: [
-                        MatIconModule,
-                    ], template: "<div class=\"sorting-container\" (click)=\"onSortClick()\">\r\n  <mat-icon\r\n    [class.selected]=\"selected() && sortState != 'none'\"\r\n    [class.rotated]=\"sortState == 'asc'\">\r\n    sort\r\n  </mat-icon>\r\n</div>", styles: [".sorting-container{display:flex;align-items:center}.sorting-container *{cursor:pointer}.sorting-container .selected{color:#31adff;background-color:#ebf7fc}.sorting-container .rotated{transform:rotate(180deg) scaleX(-1)}\n"] }]
-        }] });
-
-class TableComponent {
-    constructor() {
-        this.config = input.required();
-        this.action = output();
-        this.scrollContainer = viewChild.required('scrollContainer');
-        this.selectedRowIndex = -1;
-        this.hoverRowIndex = -1;
-        this.currentSortColumn = -1;
-    }
-    getClass(obj, prop) {
-        if (!this.config().classRules)
-            return '';
-        const classes = [];
-        for (let rule of this.config().classRules) {
-            if (rule.condition(obj, prop)) {
-                classes.push(rule.className);
-            }
-        }
-        return classes.join(' ');
-    }
-    drop(event) {
-        if (this.config().draggable) {
-            moveItemInArray(this.config().data, event.previousIndex, event.currentIndex);
-            this.action.emit({ action: 'drag', obj: this.config().data[event.currentIndex], index: event.currentIndex });
-        }
-    }
-    onScroll() {
-        const container = this.scrollContainer().nativeElement;
-        // console.log(Math.ceil(container.scrollTop), container.offsetHeight, container.scrollHeight)
-        if ((Math.ceil(container.scrollTop) + container.offsetHeight) >= container.scrollHeight) {
-            this.action.emit({ action: 'scrolled' });
-        }
-    }
-    onRowClick(event, obj, index) {
-        this.selectedRowIndex = index === this.selectedRowIndex ? -1 : index;
-        this.action.emit({ action: 'rowClick', obj, index, selected: this.selectedRowIndex === index, event });
-    }
-    selectOption(оption, obj, index) {
-        this.action.emit({ action: оption.toLowerCase(), obj, index, selected: this.selectedRowIndex === index });
-    }
-    sortByProp(prop, sortState) {
-        this.action.emit({ action: 'sort', prop, sortState });
-    }
-    trackById(index, obj) {
-        return obj.id || index;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: TableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.6", type: TableComponent, isStandalone: true, selector: "lib-table", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { action: "action" }, viewQueries: [{ propertyName: "scrollContainer", first: true, predicate: ["scrollContainer"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"flexer\">\r\n  @if (config().title) {\r\n    <div class=\"row-heading-labels mb05\">{{config().title}}</div>\r\n  }\r\n  <ng-content select=\".upper-part\"></ng-content>\r\n  @if (config().withAdd) {\r\n    <div class=\"flexer action pointer gap05 mb05\" (click)=\"action.emit({action: 'add'})\">\r\n      <mat-icon>add_circle_outline</mat-icon>\r\n      <div>add</div>\r\n    </div>\r\n  }\r\n</div>\r\n\r\n<div class=\"scroll\" #scrollContainer (scroll)=\"onScroll()\">\r\n  <table [class.with-options]=\"config().options?.length\">\r\n    <thead>\r\n      <tr>\r\n        @for (heading of config().tableHeadings; track heading; let i = $index) {\r\n          <th>\r\n            <div class=\"flexer gap05\">\r\n              {{heading}}\r\n              @if (config().sortable && !config().draggable) {\r\n                <lib-table-sort-header\r\n                  [selected]=\"currentSortColumn === i\"\r\n                  (click)=\"currentSortColumn = i\"\r\n                  (sort)=\"sortByProp(config().dataProps[i], $event)\"\r\n                />\r\n              }\r\n            </div>\r\n          </th>\r\n        }\r\n        @if (config().options?.length) {\r\n          <th></th>\r\n        }\r\n      </tr>\r\n    </thead>\r\n    @if (config().draggable) {\r\n      <tbody cdkDropList (cdkDropListDropped)=\"drop($event)\">\r\n        @for (obj of config().data; track trackById(i, obj); let i = $index) {\r\n          <tr\r\n            (mouseover)=\"hoverRowIndex = i\"\r\n            (mouseleave)=\"hoverRowIndex = -1\"\r\n            cdkDrag cdkDragLockAxis=\"y\"\r\n            [class.pointer]=\"config().selectableRows\"\r\n            [class.hover-row]=\"hoverRowIndex == i\"\r\n            [class.selected-row]=\"config().selectableRows && selectedRowIndex == i\"\r\n            (click)=\"onRowClick($event, obj, i)\"\r\n            @fadeInOut>\r\n            @for (prop of config().dataProps; track prop; let cellIndex = $index) {\r\n              <td\r\n                [class.dragCol]=\"cellIndex === 0\">\r\n                <div class=\"data\" [classList]=\"getClass(obj, prop)\"\r\n                  [class.flexer]=\"cellIndex === 0\">\r\n                  @if (cellIndex === 0) {\r\n                    <mat-icon class=\"draggable\" cdkDragHandle>\r\n                      drag_indicator\r\n                    </mat-icon>\r\n                  }\r\n                  {{obj[prop] | blankFiller}}\r\n                </div>\r\n              </td>\r\n            }\r\n            @if (config().options?.length) {\r\n              <td class=\"right-align\" (click)=\"$event.stopPropagation()\">\r\n                <button mat-icon-button class=\"pointer dots right\" [matMenuTriggerFor]=\"optionsMenu\">\r\n                  <mat-icon>more_vert</mat-icon>\r\n                </button>\r\n                <mat-menu #optionsMenu=\"matMenu\">\r\n                  @for (option of config().options; track option) {\r\n                    <div\r\n                      mat-menu-item (click)=\"selectOption(option, obj, i)\"\r\n                      [class.red]=\"option == 'Remove' || option == 'Delete'\">\r\n                      {{option}}\r\n                    </div>\r\n                  }\r\n                </mat-menu>\r\n              </td>\r\n            }\r\n          </tr>\r\n        }\r\n      </tbody>\r\n    } @else {\r\n      <tbody>\r\n        @for (obj of config().data; track trackById(i, obj); let i = $index) {\r\n          <tr\r\n            (mouseover)=\"hoverRowIndex = i\"\r\n            (mouseleave)=\"hoverRowIndex = -1\"\r\n            [class.pointer]=\"config().selectableRows\"\r\n            [class.hover-row]=\"hoverRowIndex == i\"\r\n            [class.selected-row]=\"config().selectableRows && selectedRowIndex == i\"\r\n            (click)=\"onRowClick($event, obj, i)\"\r\n            @fadeInOut>\r\n            @for (prop of config().dataProps; track prop; let cellIndex = $index) {\r\n              <td>\r\n                <div class=\"data\" [classList]=\"getClass(obj, prop)\">\r\n                  {{obj[prop] | blankFiller}}\r\n                </div>\r\n              </td>\r\n            }\r\n            @if (config().options?.length) {\r\n              <td class=\"right-align\" (click)=\"$event.stopPropagation()\">\r\n                <button mat-icon-button class=\"pointer dots right\" [matMenuTriggerFor]=\"optionsMenu\">\r\n                  <mat-icon>more_vert</mat-icon>\r\n                </button>\r\n                <mat-menu #optionsMenu=\"matMenu\">\r\n                  @for (option of config().options; track option) {\r\n                    <div\r\n                      mat-menu-item (click)=\"selectOption(option, obj, i)\"\r\n                      [class.red]=\"option == 'Remove' || option == 'Delete'\">\r\n                      {{option}}\r\n                    </div>\r\n                  }\r\n                </mat-menu>\r\n              </td>\r\n            }\r\n          </tr>\r\n        }\r\n      </tbody>\r\n    }\r\n  </table>\r\n</div>", styles: [".scroll{overflow-y:auto;max-height:94%}table{width:100%;border-collapse:collapse;border-spacing:0px}table.with-options td{padding-block:3px!important}.flexer{display:flex;align-items:center}.action{color:#009ddc;font-weight:500;text-align:right;margin-left:auto}.pointer{cursor:pointer}.gap05{gap:.5rem}.mb05{margin-bottom:.5}.data{white-space:pre-wrap}.row-heading-labels{font-weight:700;font-size:20px}.selected-row td{background-color:#d3edf8}.hover-row{background-color:#ebf7fc}.red{color:red}@media (max-width: 1086px){table td,table th{padding:3px!important;width:auto!important}}td,th{padding:.5rem 1rem;font-size:14px}th{background-color:#f6f6f6;text-align:left;position:sticky;top:0;z-index:2;border-top:2px solid #E5E4E7}td{border-bottom:2px solid #E5E4E7;border-top:2px solid #E5E4E7}.dots{width:fit-content}.draggable{cursor:grabbing}.dragCol{padding-left:0!important}.cdk-drag-preview{box-sizing:border-box;border-radius:4px;font-size:1.5em;text-align:center;opacity:.8;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.dragdrop-placeholder{background:#ccc;border:dotted 3px #999;min-height:30px;transition:transform .1s cubic-bezier(0,0,.2,1)}\n"], dependencies: [{ kind: "pipe", type: WhiteSpaceFillerPipe, name: "blankFiller" }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i1$2.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i1$2.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i1$2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3$1.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: TableSortHeaderComponent, selector: "lib-table-sort-header", inputs: ["selected"], outputs: ["sort"] }, { kind: "ngmodule", type: DragDropModule }, { kind: "directive", type: i4.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i4.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i4.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }], animations: [fader] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: TableComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'lib-table', animations: [fader], imports: [
-                        WhiteSpaceFillerPipe,
-                        MatMenuModule,
-                        MatIconModule,
-                        MatButtonModule,
-                        TableSortHeaderComponent,
-                        DragDropModule
-                    ], template: "<div class=\"flexer\">\r\n  @if (config().title) {\r\n    <div class=\"row-heading-labels mb05\">{{config().title}}</div>\r\n  }\r\n  <ng-content select=\".upper-part\"></ng-content>\r\n  @if (config().withAdd) {\r\n    <div class=\"flexer action pointer gap05 mb05\" (click)=\"action.emit({action: 'add'})\">\r\n      <mat-icon>add_circle_outline</mat-icon>\r\n      <div>add</div>\r\n    </div>\r\n  }\r\n</div>\r\n\r\n<div class=\"scroll\" #scrollContainer (scroll)=\"onScroll()\">\r\n  <table [class.with-options]=\"config().options?.length\">\r\n    <thead>\r\n      <tr>\r\n        @for (heading of config().tableHeadings; track heading; let i = $index) {\r\n          <th>\r\n            <div class=\"flexer gap05\">\r\n              {{heading}}\r\n              @if (config().sortable && !config().draggable) {\r\n                <lib-table-sort-header\r\n                  [selected]=\"currentSortColumn === i\"\r\n                  (click)=\"currentSortColumn = i\"\r\n                  (sort)=\"sortByProp(config().dataProps[i], $event)\"\r\n                />\r\n              }\r\n            </div>\r\n          </th>\r\n        }\r\n        @if (config().options?.length) {\r\n          <th></th>\r\n        }\r\n      </tr>\r\n    </thead>\r\n    @if (config().draggable) {\r\n      <tbody cdkDropList (cdkDropListDropped)=\"drop($event)\">\r\n        @for (obj of config().data; track trackById(i, obj); let i = $index) {\r\n          <tr\r\n            (mouseover)=\"hoverRowIndex = i\"\r\n            (mouseleave)=\"hoverRowIndex = -1\"\r\n            cdkDrag cdkDragLockAxis=\"y\"\r\n            [class.pointer]=\"config().selectableRows\"\r\n            [class.hover-row]=\"hoverRowIndex == i\"\r\n            [class.selected-row]=\"config().selectableRows && selectedRowIndex == i\"\r\n            (click)=\"onRowClick($event, obj, i)\"\r\n            @fadeInOut>\r\n            @for (prop of config().dataProps; track prop; let cellIndex = $index) {\r\n              <td\r\n                [class.dragCol]=\"cellIndex === 0\">\r\n                <div class=\"data\" [classList]=\"getClass(obj, prop)\"\r\n                  [class.flexer]=\"cellIndex === 0\">\r\n                  @if (cellIndex === 0) {\r\n                    <mat-icon class=\"draggable\" cdkDragHandle>\r\n                      drag_indicator\r\n                    </mat-icon>\r\n                  }\r\n                  {{obj[prop] | blankFiller}}\r\n                </div>\r\n              </td>\r\n            }\r\n            @if (config().options?.length) {\r\n              <td class=\"right-align\" (click)=\"$event.stopPropagation()\">\r\n                <button mat-icon-button class=\"pointer dots right\" [matMenuTriggerFor]=\"optionsMenu\">\r\n                  <mat-icon>more_vert</mat-icon>\r\n                </button>\r\n                <mat-menu #optionsMenu=\"matMenu\">\r\n                  @for (option of config().options; track option) {\r\n                    <div\r\n                      mat-menu-item (click)=\"selectOption(option, obj, i)\"\r\n                      [class.red]=\"option == 'Remove' || option == 'Delete'\">\r\n                      {{option}}\r\n                    </div>\r\n                  }\r\n                </mat-menu>\r\n              </td>\r\n            }\r\n          </tr>\r\n        }\r\n      </tbody>\r\n    } @else {\r\n      <tbody>\r\n        @for (obj of config().data; track trackById(i, obj); let i = $index) {\r\n          <tr\r\n            (mouseover)=\"hoverRowIndex = i\"\r\n            (mouseleave)=\"hoverRowIndex = -1\"\r\n            [class.pointer]=\"config().selectableRows\"\r\n            [class.hover-row]=\"hoverRowIndex == i\"\r\n            [class.selected-row]=\"config().selectableRows && selectedRowIndex == i\"\r\n            (click)=\"onRowClick($event, obj, i)\"\r\n            @fadeInOut>\r\n            @for (prop of config().dataProps; track prop; let cellIndex = $index) {\r\n              <td>\r\n                <div class=\"data\" [classList]=\"getClass(obj, prop)\">\r\n                  {{obj[prop] | blankFiller}}\r\n                </div>\r\n              </td>\r\n            }\r\n            @if (config().options?.length) {\r\n              <td class=\"right-align\" (click)=\"$event.stopPropagation()\">\r\n                <button mat-icon-button class=\"pointer dots right\" [matMenuTriggerFor]=\"optionsMenu\">\r\n                  <mat-icon>more_vert</mat-icon>\r\n                </button>\r\n                <mat-menu #optionsMenu=\"matMenu\">\r\n                  @for (option of config().options; track option) {\r\n                    <div\r\n                      mat-menu-item (click)=\"selectOption(option, obj, i)\"\r\n                      [class.red]=\"option == 'Remove' || option == 'Delete'\">\r\n                      {{option}}\r\n                    </div>\r\n                  }\r\n                </mat-menu>\r\n              </td>\r\n            }\r\n          </tr>\r\n        }\r\n      </tbody>\r\n    }\r\n  </table>\r\n</div>", styles: [".scroll{overflow-y:auto;max-height:94%}table{width:100%;border-collapse:collapse;border-spacing:0px}table.with-options td{padding-block:3px!important}.flexer{display:flex;align-items:center}.action{color:#009ddc;font-weight:500;text-align:right;margin-left:auto}.pointer{cursor:pointer}.gap05{gap:.5rem}.mb05{margin-bottom:.5}.data{white-space:pre-wrap}.row-heading-labels{font-weight:700;font-size:20px}.selected-row td{background-color:#d3edf8}.hover-row{background-color:#ebf7fc}.red{color:red}@media (max-width: 1086px){table td,table th{padding:3px!important;width:auto!important}}td,th{padding:.5rem 1rem;font-size:14px}th{background-color:#f6f6f6;text-align:left;position:sticky;top:0;z-index:2;border-top:2px solid #E5E4E7}td{border-bottom:2px solid #E5E4E7;border-top:2px solid #E5E4E7}.dots{width:fit-content}.draggable{cursor:grabbing}.dragCol{padding-left:0!important}.cdk-drag-preview{box-sizing:border-box;border-radius:4px;font-size:1.5em;text-align:center;opacity:.8;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.dragdrop-placeholder{background:#ccc;border:dotted 3px #999;min-height:30px;transition:transform .1s cubic-bezier(0,0,.2,1)}\n"] }]
-        }] });
-
-class LoaderService {
-    constructor() {
-        this.loadingSubject = new BehaviorSubject(false);
-        this.loading$ = this.loadingSubject.asObservable();
-    }
-    setLoading(loadingState) {
-        this.loadingSubject.next(loadingState);
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: LoaderService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: LoaderService, providedIn: 'root' }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: LoaderService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root'
-                }]
-        }] });
-
-class GlobalLoaderComponent {
-    constructor() {
-        this.loaderService = inject(LoaderService);
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: GlobalLoaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.6", type: GlobalLoaderComponent, isStandalone: true, selector: "lib-global-loader", ngImport: i0, template: "@if (loaderService.loading$ | async) {\r\n  <div class=\"loader\">\r\n    <mat-spinner />\r\n  </div>\r\n}", styles: [".loader{display:flex;justify-content:center;align-items:center;height:100%;width:100%;position:fixed;top:0;left:0;background-color:#0003;z-index:9999}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i1$3.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: GlobalLoaderComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'lib-global-loader', imports: [
-                        AsyncPipe,
-                        MatProgressSpinnerModule
-                    ], template: "@if (loaderService.loading$ | async) {\r\n  <div class=\"loader\">\r\n    <mat-spinner />\r\n  </div>\r\n}", styles: [".loader{display:flex;justify-content:center;align-items:center;height:100%;width:100%;position:fixed;top:0;left:0;background-color:#0003;z-index:9999}\n"] }]
-        }] });
-
-class ErrorService {
-    constructor() {
-        this.errorSubject = new Subject();
-        this.error$ = this.errorSubject.asObservable();
-    }
-    sendError(error) {
-        this.errorSubject.next(error);
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: ErrorService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: ErrorService, providedIn: 'root' }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: ErrorService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root'
-                }]
-        }] });
-
-const HTTP_STATUS_CODES = {
-    100: 'Continue',
-    101: 'Switching Protocols',
-    102: 'Processing',
-    103: 'Early Hints',
-    200: 'OK',
-    201: 'Created',
-    202: 'Accepted',
-    203: 'Non-Authoritative Information',
-    204: 'No Content',
-    205: 'Reset Content',
-    206: 'Partial Content',
-    207: 'Multi-Status',
-    208: 'Already Reported',
-    226: 'IM Used',
-    300: 'Multiple Choices',
-    301: 'Moved Permanently',
-    302: 'Found',
-    303: 'See Other',
-    304: 'Not Modified',
-    305: 'Use Proxy',
-    306: '(Unused)',
-    307: 'Temporary Redirect',
-    308: 'Permanent Redirect',
-    400: 'Bad Request',
-    401: 'Unauthorized',
-    402: 'Payment Required',
-    403: 'Forbidden',
-    404: 'Not Found',
-    405: 'Method Not Allowed',
-    406: 'Not Acceptable',
-    407: 'Proxy Authentication Required',
-    408: 'Request Timeout',
-    409: 'Conflict',
-    410: 'Gone',
-    411: 'Length Required',
-    412: 'Precondition Failed',
-    413: 'Payload Too Large',
-    414: 'URI Too Long',
-    415: 'Unsupported Media Type',
-    416: 'Range Not Satisfiable',
-    417: 'Expectation Failed',
-    418: "I'm a teapot",
-    421: 'Misdirected Request',
-    422: 'Unprocessable Entity',
-    423: 'Locked',
-    424: 'Failed Dependency',
-    425: 'Too Early',
-    426: 'Upgrade Required',
-    428: 'Precondition Required',
-    429: 'Too Many Requests',
-    431: 'Request Header Fields Too Large',
-    451: 'Unavailable For Legal Reasons',
-    500: 'Internal Server Error',
-    501: 'Not Implemented',
-    502: 'Bad Gateway',
-    503: 'Service Unavailable',
-    504: 'Gateway Timeout',
-    505: 'HTTP Version Not Supported',
-    506: 'Variant Also Negotiates',
-    507: 'Insufficient Storage',
-    508: 'Loop Detected',
-    510: 'Not Extended',
-    511: 'Network Authentication Required'
-};
-
-class ErrorPopupComponent {
-    constructor(error) {
-        this.error = error;
-        this.httpStatusCodes = HTTP_STATUS_CODES;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: ErrorPopupComponent, deps: [{ token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.6", type: ErrorPopupComponent, isStandalone: true, selector: "lib-error-popup", ngImport: i0, template: "<lib-default-dialog [dialogTitle]=\"'\u0410n error has occurred'\">\r\n  <div class=\"dialog-content\">\r\n    <div class=\"status-info\">\r\n      <div>{{ error.status }}</div>\r\n      @if (error.status) {\r\n        <div>{{ httpStatusCodes[error.status] }}</div>\r\n      }\r\n    </div>\r\n    <div class=\"error-info\">\r\n      <lib-error-dispaly [error]=\"error\" />\r\n    </div>\r\n  </div>\r\n</lib-default-dialog>", styles: [".dialog-content{display:flex;flex-direction:column;align-items:center;padding-inline:1rem}.dialog-content .status-info{display:flex;margin-bottom:.5rem;font-weight:600;font-size:18px;gap:.5rem}.dialog-content .error-info{display:grid;place-items:center}\n"], dependencies: [{ kind: "component", type: DefaultDialogComponent, selector: "lib-default-dialog", inputs: ["temRef", "height", "dialogTitle", "withBack"], outputs: ["back"] }, { kind: "component", type: ErrorDispalyComponent, selector: "lib-error-dispaly", inputs: ["error"] }] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: ErrorPopupComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'lib-error-popup', imports: [
-                        DefaultDialogComponent,
-                        ErrorDispalyComponent
-                    ], template: "<lib-default-dialog [dialogTitle]=\"'\u0410n error has occurred'\">\r\n  <div class=\"dialog-content\">\r\n    <div class=\"status-info\">\r\n      <div>{{ error.status }}</div>\r\n      @if (error.status) {\r\n        <div>{{ httpStatusCodes[error.status] }}</div>\r\n      }\r\n    </div>\r\n    <div class=\"error-info\">\r\n      <lib-error-dispaly [error]=\"error\" />\r\n    </div>\r\n  </div>\r\n</lib-default-dialog>", styles: [".dialog-content{display:flex;flex-direction:column;align-items:center;padding-inline:1rem}.dialog-content .status-info{display:flex;margin-bottom:.5rem;font-weight:600;font-size:18px;gap:.5rem}.dialog-content .error-info{display:grid;place-items:center}\n"] }]
-        }], ctorParameters: () => [{ type: i1$4.HttpErrorResponse, decorators: [{
-                    type: Inject,
-                    args: [MAT_DIALOG_DATA]
-                }] }] });
-
-class ErrorHandlerComponent {
-    constructor() {
-        this.errSubscriptions = new Subscription();
-        this.errorService = inject(ErrorService);
-        this.dialog = inject(MatDialog);
-        this.errSubscriptions.add(this.errorService.error$.subscribe((err) => {
-            console.log(err);
-            this.showPopup(err);
-        }));
-    }
-    showPopup(error) {
-        this.dialog.closeAll();
-        this.dialog.open(ErrorPopupComponent, {
-            data: error,
-            width: '400px',
-            scrollStrategy: new NoopScrollStrategy(),
-        });
-    }
-    ngOnDestroy() {
-        this.errSubscriptions.unsubscribe();
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: ErrorHandlerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.6", type: ErrorHandlerComponent, isStandalone: true, selector: "lib-error-handler", ngImport: i0, template: "", styles: [""], dependencies: [{ kind: "ngmodule", type: MatDialogModule }] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: ErrorHandlerComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'lib-error-handler', imports: [
-                        MatDialogModule
-                    ], template: "" }]
-        }], ctorParameters: () => [] });
-
-class ChipComponent {
-    constructor() {
-        this.value = input.required();
-        this.isSelected = input.required();
-        this.text = input.required();
-        this.selected = output();
-    }
-    onClick() {
-        if (this.isSelected()) {
-            return;
-        }
-        this.selected.emit(this.value());
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: ChipComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.0.6", type: ChipComponent, isStandalone: true, selector: "lib-chip", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, isSelected: { classPropertyName: "isSelected", publicName: "isSelected", isSignal: true, isRequired: true, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { selected: "selected" }, ngImport: i0, template: "<div class=\"chip\" [class.selected]=\"isSelected()\" (click)=\"onClick()\">\r\n  {{text()}}\r\n</div>\r\n", styles: [".chip{display:inline-block;padding:.5rem 1rem;border-radius:1rem;background-color:#e6e6e6;color:#333;font-size:1rem;cursor:pointer;transition:all .2s}.chip:hover{background-color:#ccc}.chip.selected{background-color:var(--primary-color);color:#fff}\n"] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.6", ngImport: i0, type: ChipComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'lib-chip', imports: [], template: "<div class=\"chip\" [class.selected]=\"isSelected()\" (click)=\"onClick()\">\r\n  {{text()}}\r\n</div>\r\n", styles: [".chip{display:inline-block;padding:.5rem 1rem;border-radius:1rem;background-color:#e6e6e6;color:#333;font-size:1rem;cursor:pointer;transition:all .2s}.chip:hover{background-color:#ccc}.chip.selected{background-color:var(--primary-color);color:#fff}\n"] }]
-        }] });
-
-/*
- * Public API Surface of ui-lib
- */
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { ChipComponent, DefaultDialogComponent, ErrorDispalyComponent, ErrorHandlerComponent, ErrorService, FieldsMatchValidatorDirective, GlobalLoaderComponent, LoaderService, PasswordValidatorDirective, PhoneValidationDirective, SearchBarComponent, SnakeCaseParserPipe, TableComponent, TableSortHeaderComponent, WhiteSpaceFillerPipe, fader, openDropdown, textFader };
-//# sourceMappingURL=ferhaps-easy-ui-lib.mjs.map