ngx-techlify-core 14.16.0 → 14.17.0

package/fesm2020/ngx-techlify-core.mjs

@@ -1501,6 +1501,7 @@ let TechlifyTaggerTagFormFieldComponent = TechlifyTaggerTagFormFieldComponent_1
         this.onChange = (_) => { };
         this.onTouched = () => { };
         this.tagInputCtrl = new UntypedFormControl();
+        this.selectionChange = new EventEmitter();
         /**Pass the configuration for Techlify Tagger */
         this.config = new TechlifyTaggerTagFormConfigModel();
         /**Pass the default list of tags */
@@ -1561,8 +1562,15 @@ let TechlifyTaggerTagFormFieldComponent = TechlifyTaggerTagFormFieldComponent_1
         return this._value;
     }
     set value(tagIds) {
-        this._value = tagIds || [];
-        this.stateChanges.next();
+        if (tagIds) {
+            if (Array.isArray(tagIds)) {
+                this._value = tagIds || [];
+            }
+            else {
+                this._value.push(tagIds);
+            }
+            this.stateChanges.next();
+        }
     }
     get errorState() {
         return this.tagInputCtrl.dirty && this.required && (this.value.length == 0);
@@ -1702,6 +1710,7 @@ let TechlifyTaggerTagFormFieldComponent = TechlifyTaggerTagFormFieldComponent_1
     }
     _handleInput() {
         this.onChange(this.value);
+        this.selectionChange.emit(this.value);
     }
     ngOnDestroy() {
         this.stateChanges.complete();
@@ -1710,7 +1719,7 @@ let TechlifyTaggerTagFormFieldComponent = TechlifyTaggerTagFormFieldComponent_1
 };
 TechlifyTaggerTagFormFieldComponent.nextId = 0;
 TechlifyTaggerTagFormFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: TechlifyTaggerTagFormFieldComponent, deps: [{ token: i1$3.FocusMonitor }, { token: i0.ElementRef }, { token: HttpService }, { token: MAT_FORM_FIELD, optional: true }, { token: i1$4.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
-TechlifyTaggerTagFormFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: TechlifyTaggerTagFormFieldComponent, selector: "app-techlify-tagger-tag-form-field", inputs: { config: "config", modelType: "modelType", modelId: "modelId", allTags: "allTags", categories: "categories", defaultCreateCategory: "defaultCreateCategory", required: "required", disabled: "disabled", value: "value", placeholder: "placeholder" }, providers: [{ provide: MatFormFieldControl, useExisting: TechlifyTaggerTagFormFieldComponent_1 }], viewQueries: [{ propertyName: "tagInput", first: true, predicate: ["tagInput"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<mat-chip-list #chipList aria-label=\"Tag Selection\">\n    <mat-chip *ngFor=\"let tag of tags\" [selectable]=\"config.selectable\" [removable]=\"config.removable\"\n        (removed)=\"remove(tag)\">\n        {{tag.title}}\n        <button matChipRemove *ngIf=\"config.removable\" class=\"border-0\">\n            <mat-icon class=\"mat-relative-icon\">cancel</mat-icon>\n        </button>\n    </mat-chip>\n    <input placeholder=\"{{config.isCreateable? config.placeholder:''}}\" #tagInput [formControl]=\"tagInputCtrl\"\n        [matAutocomplete]=\"auto\" [matChipInputFor]=\"chipList\"\n        [matChipInputSeparatorKeyCodes]=\"config.separatorKeysCodes\" (matChipInputTokenEnd)=\"add($event)\"\n        #trigger=\"matAutocompleteTrigger\" (click)=\"trigger.openPanel()\">\n</mat-chip-list>\n<mat-autocomplete #auto=\"matAutocomplete\" (optionSelected)=\"selected($event)\">\n    <mat-option *ngFor=\"let tag of filteredTags\" [value]=\"tag.id\">\n        {{tag.title}}\n    </mat-option>\n</mat-autocomplete>", styles: [".mat-relative-icon{position:relative;top:-3px;right:7px;font-size:20px}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i8$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i8$3.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "component", type: i7$2.MatChipList, selector: "mat-chip-list", inputs: ["role", "aria-describedby", "errorStateMatcher", "multiple", "compareWith", "value", "required", "placeholder", "disabled", "aria-orientation", "selectable", "tabIndex"], outputs: ["change", "valueChange"], exportAs: ["matChipList"] }, { kind: "directive", type: i7$2.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["color", "disableRipple", "tabIndex", "role", "selected", "value", "selectable", "disabled", "removable"], outputs: ["selectionChange", "destroyed", "removed"], exportAs: ["matChip"] }, { kind: "directive", type: i7$2.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }, { kind: "directive", type: i7$2.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i8$4.MatAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple"], exportAs: ["matAutocomplete"] }, { kind: "directive", type: i8$4.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { kind: "directive", type: i1$4.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$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
+TechlifyTaggerTagFormFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: TechlifyTaggerTagFormFieldComponent, selector: "app-techlify-tagger-tag-form-field", inputs: { config: "config", modelType: "modelType", modelId: "modelId", allTags: "allTags", categories: "categories", defaultCreateCategory: "defaultCreateCategory", required: "required", disabled: "disabled", value: "value", placeholder: "placeholder" }, outputs: { selectionChange: "selectionChange" }, providers: [{ provide: MatFormFieldControl, useExisting: TechlifyTaggerTagFormFieldComponent_1 }], viewQueries: [{ propertyName: "tagInput", first: true, predicate: ["tagInput"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<mat-chip-list #chipList aria-label=\"Tag Selection\">\n    <mat-chip *ngFor=\"let tag of tags\" [selectable]=\"config.selectable\" [removable]=\"config.removable\"\n        (removed)=\"remove(tag)\">\n        {{tag.title}}\n        <button matChipRemove *ngIf=\"config.removable\" class=\"border-0\">\n            <mat-icon class=\"mat-relative-icon\">cancel</mat-icon>\n        </button>\n    </mat-chip>\n    <input placeholder=\"{{config.isCreateable? config.placeholder:''}}\" #tagInput [formControl]=\"tagInputCtrl\"\n        [matAutocomplete]=\"auto\" [matChipInputFor]=\"chipList\"\n        [matChipInputSeparatorKeyCodes]=\"config.separatorKeysCodes\" (matChipInputTokenEnd)=\"add($event)\"\n        #trigger=\"matAutocompleteTrigger\" (click)=\"trigger.openPanel()\">\n</mat-chip-list>\n<mat-autocomplete #auto=\"matAutocomplete\" (optionSelected)=\"selected($event)\">\n    <mat-option *ngFor=\"let tag of filteredTags\" [value]=\"tag.id\">\n        {{tag.title}}\n    </mat-option>\n</mat-autocomplete>", styles: [".mat-relative-icon{position:relative;top:-3px;right:7px;font-size:20px}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i8$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i8$3.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "component", type: i7$2.MatChipList, selector: "mat-chip-list", inputs: ["role", "aria-describedby", "errorStateMatcher", "multiple", "compareWith", "value", "required", "placeholder", "disabled", "aria-orientation", "selectable", "tabIndex"], outputs: ["change", "valueChange"], exportAs: ["matChipList"] }, { kind: "directive", type: i7$2.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["color", "disableRipple", "tabIndex", "role", "selected", "value", "selectable", "disabled", "removable"], outputs: ["selectionChange", "destroyed", "removed"], exportAs: ["matChip"] }, { kind: "directive", type: i7$2.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }, { kind: "directive", type: i7$2.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i8$4.MatAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple"], exportAs: ["matAutocomplete"] }, { kind: "directive", type: i8$4.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { kind: "directive", type: i1$4.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$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
 TechlifyTaggerTagFormFieldComponent = TechlifyTaggerTagFormFieldComponent_1 = __decorate([
     UntilDestroy()
 ], TechlifyTaggerTagFormFieldComponent);
@@ -1729,6 +1738,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImpor
                 }] }]; }, propDecorators: { tagInput: [{
                 type: ViewChild,
                 args: ['tagInput']
+            }], selectionChange: [{
+                type: Output
             }], config: [{
                 type: Input
             }], modelType: [{
@@ -1886,7 +1897,7 @@ class EntityFileFormComponent {
     }
 }
 EntityFileFormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: EntityFileFormComponent, deps: [{ token: i1.MatDialogRef }, { token: MAT_DIALOG_DATA }, { token: FormValidatorService }, { token: i1$4.UntypedFormBuilder }, { token: EntityFileService }, { token: AlertService }], target: i0.ɵɵFactoryTarget.Component });
-EntityFileFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: EntityFileFormComponent, selector: "entity-file-form", ngImport: i0, template: "<form [formGroup]=\"entityFileGroup\" (ngSubmit)=\"submit()\">\n  <div fxLayout=\"column\" class=\"mat-typography\">\n    <div mat-dialog-title class=\"text-center\">\n      <div>Entity File</div>\n    </div>\n    <div mat-dialog-content fxLayout=\"column\" fxLayoutAlign.=\"start\">\n      <ng-container *ngIf=\"!hideTitleAndDetails\">\n        <mat-form-field>\n          <input type=\"text\" matInput formControlName=\"title\" placeholder=\"Title\" autocomplete=\"off\">\n        </mat-form-field>\n        <mat-form-field>\n          <textarea matInput formControlName=\"details\" placeholder=\"Details\" autocomplete=\"off\"></textarea>\n        </mat-form-field>\n      </ng-container>\n      <ng-container *ngIf=\"useTechlifyTags\">\n        <mat-form-field>\n          <mat-label>Tag</mat-label>\n          <app-techlify-tagger-tag-form-field\n            [categories]=\"techlifyTagCategories\"\n            modelType=\"entity-file\"\n            formControlName=\"tag_ids\"\n            [modelId]=\"entityFileGroup.get('id').value\"\n            placeholder=\"Enter new tag\"\n            [config]=\"techlifyTagConfig\"\n          ></app-techlify-tagger-tag-form-field>\n        </mat-form-field>\n      </ng-container>\n      <ng-template #fileUpload>\n        <section fxFlex=\"100%\">\n          <div>Entity File*</div>\n          <app-file-dropper [config]=\"fileConfig\" (fileChanged)=\"fileChanged($event)\" [fileArray]=\"fileList\">\n          </app-file-dropper>\n          <div class=\"text-danger\" *ngIf=\"isFieldValid('url')\">\n            {{getErrorMessage(\"url\")}}\n          </div>\n        </section>\n      </ng-template>\n      <div fxFlex=\"100%\" class=\"mt-2\" *ngIf=\"entityFileGroup.get('url').value;else fileUpload;\">\n        <app-document-viewer [file]=\"entityFileGroup.get('file').value\" [fileUrl]=\"entityFileGroup.get('url').value\"\n          [config]=\"this.viewerConfig\" (remove)=\"removeFile()\" [disableEdit]=\"updateMode\">\n        </app-document-viewer>\n      </div>\n      <div class=\"mt-4 mb-2\" fxLayout=\"row\" fxLayoutGap=\"30px\" fxLayoutAlign=\"end\" fxFlex=\"100%\">\n        <button [disabled]=\"isSaving\" mat-raised-button type=\"button\" (click)=\"dialogRef.close()\">\n          Cancel\n        </button>\n        <button [disabled]=\"isSaving\" mat-raised-button type=\"submit\" color=\"primary\">Save</button>\n      </div>\n    </div>\n  </div>\n</form>\n", styles: [""], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$4.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$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i7.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i7.DefaultLayoutGapDirective, selector: "  [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md],  [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md],  [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm],  [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i7.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i7.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "component", type: FileDropperComponent, selector: "app-file-dropper", inputs: ["fileArray", "config", "styles"], outputs: ["fileChanged"] }, { kind: "component", type: DocumentViewerComponent, selector: "app-document-viewer", inputs: ["config", "file", "fileUrl", "disableEdit"], outputs: ["remove"] }, { kind: "component", type: i7$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "component", type: i7$3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i7$3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i9.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: "component", type: TechlifyTaggerTagFormFieldComponent, selector: "app-techlify-tagger-tag-form-field", inputs: ["config", "modelType", "modelId", "allTags", "categories", "defaultCreateCategory", "required", "disabled", "value", "placeholder"] }] });
+EntityFileFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: EntityFileFormComponent, selector: "entity-file-form", ngImport: i0, template: "<form [formGroup]=\"entityFileGroup\" (ngSubmit)=\"submit()\">\n  <div fxLayout=\"column\" class=\"mat-typography\">\n    <div mat-dialog-title class=\"text-center\">\n      <div>Entity File</div>\n    </div>\n    <div mat-dialog-content fxLayout=\"column\" fxLayoutAlign.=\"start\">\n      <ng-container *ngIf=\"!hideTitleAndDetails\">\n        <mat-form-field>\n          <input type=\"text\" matInput formControlName=\"title\" placeholder=\"Title\" autocomplete=\"off\">\n        </mat-form-field>\n        <mat-form-field>\n          <textarea matInput formControlName=\"details\" placeholder=\"Details\" autocomplete=\"off\"></textarea>\n        </mat-form-field>\n      </ng-container>\n      <ng-container *ngIf=\"useTechlifyTags\">\n        <mat-form-field>\n          <mat-label>Tag</mat-label>\n          <app-techlify-tagger-tag-form-field\n            [categories]=\"techlifyTagCategories\"\n            modelType=\"entity-file\"\n            formControlName=\"tag_ids\"\n            [modelId]=\"entityFileGroup.get('id').value\"\n            placeholder=\"Enter new tag\"\n            [config]=\"techlifyTagConfig\"\n          ></app-techlify-tagger-tag-form-field>\n        </mat-form-field>\n      </ng-container>\n      <ng-template #fileUpload>\n        <section fxFlex=\"100%\">\n          <div>Entity File*</div>\n          <app-file-dropper [config]=\"fileConfig\" (fileChanged)=\"fileChanged($event)\" [fileArray]=\"fileList\">\n          </app-file-dropper>\n          <div class=\"text-danger\" *ngIf=\"isFieldValid('url')\">\n            {{getErrorMessage(\"url\")}}\n          </div>\n        </section>\n      </ng-template>\n      <div fxFlex=\"100%\" class=\"mt-2\" *ngIf=\"entityFileGroup.get('url').value;else fileUpload;\">\n        <app-document-viewer [file]=\"entityFileGroup.get('file').value\" [fileUrl]=\"entityFileGroup.get('url').value\"\n          [config]=\"this.viewerConfig\" (remove)=\"removeFile()\" [disableEdit]=\"updateMode\">\n        </app-document-viewer>\n      </div>\n      <div class=\"mt-4 mb-2\" fxLayout=\"row\" fxLayoutGap=\"30px\" fxLayoutAlign=\"end\" fxFlex=\"100%\">\n        <button [disabled]=\"isSaving\" mat-raised-button type=\"button\" (click)=\"dialogRef.close()\">\n          Cancel\n        </button>\n        <button [disabled]=\"isSaving\" mat-raised-button type=\"submit\" color=\"primary\">Save</button>\n      </div>\n    </div>\n  </div>\n</form>\n", styles: [""], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$4.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$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i7.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i7.DefaultLayoutGapDirective, selector: "  [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md],  [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md],  [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm],  [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i7.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i7.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "component", type: FileDropperComponent, selector: "app-file-dropper", inputs: ["fileArray", "config", "styles"], outputs: ["fileChanged"] }, { kind: "component", type: DocumentViewerComponent, selector: "app-document-viewer", inputs: ["config", "file", "fileUrl", "disableEdit"], outputs: ["remove"] }, { kind: "component", type: i7$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "component", type: i7$3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i7$3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i9.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: "component", type: TechlifyTaggerTagFormFieldComponent, selector: "app-techlify-tagger-tag-form-field", inputs: ["config", "modelType", "modelId", "allTags", "categories", "defaultCreateCategory", "required", "disabled", "value", "placeholder"], outputs: ["selectionChange"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: EntityFileFormComponent, decorators: [{
             type: Component,
             args: [{ selector: 'entity-file-form', template: "<form [formGroup]=\"entityFileGroup\" (ngSubmit)=\"submit()\">\n  <div fxLayout=\"column\" class=\"mat-typography\">\n    <div mat-dialog-title class=\"text-center\">\n      <div>Entity File</div>\n    </div>\n    <div mat-dialog-content fxLayout=\"column\" fxLayoutAlign.=\"start\">\n      <ng-container *ngIf=\"!hideTitleAndDetails\">\n        <mat-form-field>\n          <input type=\"text\" matInput formControlName=\"title\" placeholder=\"Title\" autocomplete=\"off\">\n        </mat-form-field>\n        <mat-form-field>\n          <textarea matInput formControlName=\"details\" placeholder=\"Details\" autocomplete=\"off\"></textarea>\n        </mat-form-field>\n      </ng-container>\n      <ng-container *ngIf=\"useTechlifyTags\">\n        <mat-form-field>\n          <mat-label>Tag</mat-label>\n          <app-techlify-tagger-tag-form-field\n            [categories]=\"techlifyTagCategories\"\n            modelType=\"entity-file\"\n            formControlName=\"tag_ids\"\n            [modelId]=\"entityFileGroup.get('id').value\"\n            placeholder=\"Enter new tag\"\n            [config]=\"techlifyTagConfig\"\n          ></app-techlify-tagger-tag-form-field>\n        </mat-form-field>\n      </ng-container>\n      <ng-template #fileUpload>\n        <section fxFlex=\"100%\">\n          <div>Entity File*</div>\n          <app-file-dropper [config]=\"fileConfig\" (fileChanged)=\"fileChanged($event)\" [fileArray]=\"fileList\">\n          </app-file-dropper>\n          <div class=\"text-danger\" *ngIf=\"isFieldValid('url')\">\n            {{getErrorMessage(\"url\")}}\n          </div>\n        </section>\n      </ng-template>\n      <div fxFlex=\"100%\" class=\"mt-2\" *ngIf=\"entityFileGroup.get('url').value;else fileUpload;\">\n        <app-document-viewer [file]=\"entityFileGroup.get('file').value\" [fileUrl]=\"entityFileGroup.get('url').value\"\n          [config]=\"this.viewerConfig\" (remove)=\"removeFile()\" [disableEdit]=\"updateMode\">\n        </app-document-viewer>\n      </div>\n      <div class=\"mt-4 mb-2\" fxLayout=\"row\" fxLayoutGap=\"30px\" fxLayoutAlign=\"end\" fxFlex=\"100%\">\n        <button [disabled]=\"isSaving\" mat-raised-button type=\"button\" (click)=\"dialogRef.close()\">\n          Cancel\n        </button>\n        <button [disabled]=\"isSaving\" mat-raised-button type=\"submit\" color=\"primary\">Save</button>\n      </div>\n    </div>\n  </div>\n</form>\n" }]
@@ -3432,13 +3443,13 @@ let UsersViewAllComponent = class UsersViewAllComponent extends TechlifyListingC
     }
 };
 UsersViewAllComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: UsersViewAllComponent, deps: [{ token: HttpService }, { token: AlertService }, { token: CurrentUserService }, { token: UserConfigService }, { token: i1.MatDialog }, { token: UserService }, { token: i1$4.UntypedFormBuilder }, { token: RequestHelperService }, { token: i1$5.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component });
-UsersViewAllComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: UsersViewAllComponent, selector: "app-users-view-all", inputs: { clientId: "clientId", userTypeIds: "userTypeIds", title: "title" }, usesInheritance: true, ngImport: i0, template: "<div [ngClass]=\"{'m-4':config?.userConfig?.showDefaultMargin}\">\n  <mat-card class=\"mb-2\">\n    <mat-card-content class=\"d-flex justify-content-between align-items center gap-2\">\n      <section class=\"d-flex justify-content-start align-items-center gap-2\">\n        <h3 class=\"mb-0\">\n          {{ title }}\n        </h3>\n        <mat-icon class=\"cursor-pointer\" matTooltip=\"New User\"\n                  *ngIf=\"config?.userConfig?.showAddUser && currentUserService?.hasPermission('user_create')\"\n                  (click)=\"createOrEditUser()\">add</mat-icon>\n        <button mat-raised-button type=\"button\" [routerLink]=\"['../import']\" *ngIf=\"config?.userConfig?.showImportButton\">\n          Import User\n        </button>\n        <button mat-raised-button type=\"button\" [routerLink]=\"['../roles']\" *ngIf=\"config?.userConfig?.showRoles\">\n          <mat-icon>people</mat-icon>\n          Manage Roles\n        </button>\n        <button mat-raised-button type=\"button\" [routerLink]=\"['../role-permissions']\"\n                *ngIf=\"config?.userConfig?.showPermissions\">\n          <mat-icon>lock</mat-icon>\n          Role Permissions\n        </button>\n        <button mat-raised-button type=\"button\" [routerLink]=\"['../configurations']\"\n                *ngIf=\"config?.userConfig?.showConfigurations && currentUser?.user_type_id === 2\">\n          <mat-icon>\n        <span class=\"material-icons-outlined\">\n          toggle_on\n        </span>\n          </mat-icon>\n          Configurations\n        </button>\n        <button mat-raised-button type=\"button\" [routerLink]=\"['../restrictors']\"\n                *ngIf=\"config?.userConfig?.showRestrictors && currentUser?.user_type_id === 2\">\n          <mat-icon>\n        <span class=\"material-icons-outlined\">\n          vpn_lock\n        </span>\n          </mat-icon>\n          Restrictors\n        </button>\n      </section>\n      <form [formGroup]=\"filterForm\" class=\"d-flex justify-content-end align-items-center gap-2\">\n        <mat-form-field style=\"max-width: 150px;\">\n          <mat-label>Search</mat-label>\n          <input autocomplete=\"off\" matInput type=\"text\" name=\"search\" placeholder=\"Search by name, email\" formControlName=\"search\">\n        </mat-form-field>\n        <mat-form-field style=\"max-width: 150px;\">\n          <mat-label>Role</mat-label>\n          <app-searchable-selector apiUrl=\"api/roles\" [multiple]=\"true\" formControlName=\"role_ids\"\n            titleField=\"label\"></app-searchable-selector>\n        </mat-form-field>\n        <mat-button-toggle-group formControlName=\"status\" multiple>\n          <mat-button-toggle value=\"enabled\">Enabled</mat-button-toggle>\n          <mat-button-toggle value=\"disabled\">Disabled</mat-button-toggle>\n        </mat-button-toggle-group>\n      </form>\n    </mat-card-content>\n  </mat-card>\n  <mat-card class=\"mt-2 p-0\">\n    <mat-card-content>\n      <table mat-table [dataSource]=\"models\" class=\"w-100\" aria-describedby=\"Users\" infiniteScroll\n             [infiniteScrollDistance]=\"2\" [infiniteScrollThrottle]=\"50\" [infiniteScrollContainer]=\"scrollContainer\"\n             [fromRoot]=\"true\" (scrolled)=\"onScroll()\" matSort (matSortChange)=\"onSortChange($event)\">\n        <!-- Index Column -->\n        <ng-container matColumnDef=\"index\">\n          <th mat-header-cell *matHeaderCellDef> # </th>\n          <td mat-cell *matCellDef=\"let element; let i = index;\"> {{ i + 1 }} </td>\n        </ng-container>\n\n        <!-- Name Column -->\n        <ng-container matColumnDef=\"name\">\n          <th mat-header-cell mat-sort-header=\"name\" *matHeaderCellDef> Name </th>\n          <td mat-cell *matCellDef=\"let element\">\n            <a [routerLink]=\"[element?.id]\" class=\"text-decoration-none\">\n              {{ element.name }}\n            </a>\n            <p class=\"mb-0 text-secondary\">\n              {{ element?.user_client?.is_enabled ? 'Enabled' : 'Disabled' }}\n            </p>\n          </td>\n        </ng-container>\n\n        <!-- Email Column -->\n        <ng-container matColumnDef=\"email\">\n          <th mat-header-cell mat-sort-header=\"email\" *matHeaderCellDef> Email </th>\n          <td mat-cell *matCellDef=\"let element\"> {{element.email}} </td>\n        </ng-container>\n\n        <!-- Type Column -->\n        <ng-container matColumnDef=\"type\">\n          <th mat-header-cell mat-sort-header=\"user_type_id\" *matHeaderCellDef> User Type </th>\n          <td mat-cell *matCellDef=\"let element\"> {{ getUserType(element) }} </td>\n        </ng-container>\n\n        <!-- Roles Column -->\n        <ng-container matColumnDef=\"roles\">\n          <th mat-header-cell *matHeaderCellDef> Role </th>\n          <td mat-cell *matCellDef=\"let element\">\n            <div class=\"d-flex justify-content-start align-items-center gap-1 flex-wrap\">\n              <span\n                *ngFor=\"let role of element?.roles\"\n                class=\"badge bg-secondary\"\n              >\n                {{ role?.label }}\n              </span>\n            </div>\n          </td>\n        </ng-container>\n\n        <!-- Last Login Column -->\n        <ng-container matColumnDef=\"last_login\">\n          <th mat-header-cell *matHeaderCellDef> Last Login </th>\n          <td mat-cell *matCellDef=\"let element\">{{ element?.last_login | date:'medium' }}</td>\n        </ng-container>\n\n        <!-- Added By Column -->\n        <ng-container matColumnDef=\"added_by\">\n          <th mat-header-cell *matHeaderCellDef> Added By </th>\n          <td mat-cell *matCellDef=\"let element\">\n            <p class=\"mb-0\">{{ element?.creator?.name }}</p>\n            <p class=\"text-secondary\">{{ element?.created_at | date }}</p>\n          </td>\n        </ng-container>\n\n        <!-- Actions Column -->\n        <ng-container matColumnDef=\"actions\">\n          <th mat-header-cell *matHeaderCellDef> Action </th>\n          <td mat-cell *matCellDef=\"let element\">\n            <div fxLayout fxLayoutAlign=\"start center\" fxLayoutGap=\"5px\">\n              <button type=\"button\" mat-icon-button [routerLink]=\"[element.id]\">\n                <mat-icon>visibility</mat-icon>\n              </button>\n\n              <button *ngIf=\"currentUserService.hasPermission('user_update')\" type=\"button\" mat-icon-button\n                (click)=\"createOrEditUser(element)\">\n                <mat-icon>edit</mat-icon>\n              </button>\n\n              <button *ngIf=\"currentUserService.hasPermission('user_delete')\" type=\"button\" mat-icon-button\n                (click)=\"deleteUser(element)\">\n                <mat-icon>delete</mat-icon>\n              </button>\n              <app-user-enable-button [user]=\"element\" (onSave)=\"reload()\"></app-user-enable-button>\n            </div>\n          </td>\n        </ng-container>\n\n        <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n        <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\"></tr>\n      </table>\n      <mat-progress-bar *ngIf=\"isWorking\" mode=\"indeterminate\"></mat-progress-bar>\n    </mat-card-content>\n  </mat-card>\n</div>\n", dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$5.RouterLink, selector: ":not(a):not(area)[routerLink]", inputs: ["queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1$5.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i7$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i7$3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i7$3.MatLabel, selector: "mat-label" }, { kind: "component", type: i8$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i9.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: "directive", type: i10.MatSort, selector: "[matSort]", inputs: ["matSortDisabled", "matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i10.MatSortHeader, selector: "[mat-sort-header]", inputs: ["disabled", "mat-sort-header", "arrowPosition", "start", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "component", type: i11.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i11.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i11.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i11.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i11.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i11.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i11.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i11.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i11.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i11.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i10$1.MatCard, selector: "mat-card", exportAs: ["matCard"] }, { kind: "directive", type: i10$1.MatCardContent, selector: "mat-card-content, [mat-card-content], [matCardContent]" }, { kind: "directive", type: i5.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "directive", type: i3$2.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i3$2.MatButtonToggle, selector: "mat-button-toggle", inputs: ["disableRipple", "aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "appearance", "checked", "disabled"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "directive", type: i7.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i7.DefaultLayoutGapDirective, selector: "  [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md],  [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md],  [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm],  [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i7.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i2.DefaultClassDirective, selector: "  [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],  [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],  [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { kind: "directive", type: i1$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$4.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$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i4.InfiniteScrollDirective, selector: "[infiniteScroll], [infinite-scroll], [data-infinite-scroll]", inputs: ["infiniteScrollDistance", "infiniteScrollUpDistance", "infiniteScrollThrottle", "infiniteScrollDisabled", "infiniteScrollContainer", "scrollWindow", "immediateCheck", "horizontal", "alwaysCallback", "fromRoot"], outputs: ["scrolled", "scrolledUp"] }, { kind: "component", type: SearchableSelectorComponent, selector: "app-searchable-selector", inputs: ["valueField", "titleField", "subtitleField", "apiUrl", "multiple", "selectedValue", "enableSearch", "add", "addConfig", "edit", "editConfig", "sort", "sortBy", "searchField", "itemComponent", "items", "apiDataProperty", "cache", "perPage", "inDataSearch", "required", "disabled", "value"], outputs: ["selectedValueChange", "selectionChange", "itemsChange"] }, { kind: "component", type: i23.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "component", type: UserEnableButtonComponent, selector: "app-user-enable-button", inputs: ["user", "isUseIcons"], outputs: ["onSave"] }, { kind: "pipe", type: i3.DatePipe, name: "date" }] });
+UsersViewAllComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: UsersViewAllComponent, selector: "app-users-view-all", inputs: { clientId: "clientId", userTypeIds: "userTypeIds", title: "title" }, usesInheritance: true, ngImport: i0, template: "<div [ngClass]=\"{'m-4':config?.userConfig?.showDefaultMargin}\">\n  <mat-card class=\"mb-2\">\n    <mat-card-content class=\"d-flex justify-content-between align-items center gap-2\">\n      <section class=\"d-flex justify-content-start align-items-center gap-2\">\n        <h3 class=\"mb-0\">\n          {{ title }}\n        </h3>\n        <mat-icon class=\"cursor-pointer\" matTooltip=\"New User\"\n                  *ngIf=\"config?.userConfig?.showAddUser && currentUserService?.hasPermission('user_create')\"\n                  (click)=\"createOrEditUser()\">add</mat-icon>\n        <button mat-raised-button type=\"button\" [routerLink]=\"['../import']\" *ngIf=\"config?.userConfig?.showImportButton\">\n          Import User\n        </button>\n        <button mat-raised-button type=\"button\" [routerLink]=\"['../roles']\" *ngIf=\"config?.userConfig?.showRoles\">\n          <mat-icon>people</mat-icon>\n          Roles\n        </button>\n        <button mat-raised-button type=\"button\" [routerLink]=\"['../role-permissions']\"\n                *ngIf=\"config?.userConfig?.showPermissions\">\n          <mat-icon>lock</mat-icon>\n          Role Permissions\n        </button>\n        <button mat-raised-button type=\"button\" [routerLink]=\"['../configurations']\"\n                *ngIf=\"config?.userConfig?.showConfigurations && currentUser?.user_type_id === 2\">\n          <mat-icon>\n        <span class=\"material-icons-outlined\">\n          toggle_on\n        </span>\n          </mat-icon>\n          Configurations\n        </button>\n        <button mat-raised-button type=\"button\" [routerLink]=\"['../restrictors']\"\n                *ngIf=\"config?.userConfig?.showRestrictors && currentUser?.user_type_id === 2\">\n          <mat-icon>\n        <span class=\"material-icons-outlined\">\n          vpn_lock\n        </span>\n          </mat-icon>\n          Restrictors\n        </button>\n      </section>\n      <form [formGroup]=\"filterForm\" class=\"d-flex justify-content-end align-items-center gap-2\">\n        <mat-form-field style=\"max-width: 150px;\">\n          <mat-label>Search</mat-label>\n          <input autocomplete=\"off\" matInput type=\"text\" name=\"search\" placeholder=\"Search by name, email\" formControlName=\"search\">\n        </mat-form-field>\n        <mat-form-field style=\"max-width: 150px;\">\n          <mat-label>Role</mat-label>\n          <app-searchable-selector apiUrl=\"api/roles\" [multiple]=\"true\" formControlName=\"role_ids\"\n            titleField=\"label\"></app-searchable-selector>\n        </mat-form-field>\n        <mat-button-toggle-group formControlName=\"status\" multiple>\n          <mat-button-toggle value=\"enabled\">Enabled</mat-button-toggle>\n          <mat-button-toggle value=\"disabled\">Disabled</mat-button-toggle>\n        </mat-button-toggle-group>\n      </form>\n    </mat-card-content>\n  </mat-card>\n  <mat-card class=\"mt-2 p-0\">\n    <mat-card-content>\n      <table mat-table [dataSource]=\"models\" class=\"w-100\" aria-describedby=\"Users\" infiniteScroll\n             [infiniteScrollDistance]=\"2\" [infiniteScrollThrottle]=\"50\" [infiniteScrollContainer]=\"scrollContainer\"\n             [fromRoot]=\"true\" (scrolled)=\"onScroll()\" matSort (matSortChange)=\"onSortChange($event)\">\n        <!-- Index Column -->\n        <ng-container matColumnDef=\"index\">\n          <th mat-header-cell *matHeaderCellDef> # </th>\n          <td mat-cell *matCellDef=\"let element; let i = index;\"> {{ i + 1 }} </td>\n        </ng-container>\n\n        <!-- Name Column -->\n        <ng-container matColumnDef=\"name\">\n          <th mat-header-cell mat-sort-header=\"name\" *matHeaderCellDef> Name </th>\n          <td mat-cell *matCellDef=\"let element\">\n            <a [routerLink]=\"[element?.id]\" class=\"text-decoration-none\">\n              {{ element.name }}\n            </a>\n            <p class=\"mb-0 text-secondary\">\n              <!-- !element?.user_client condition added to check if user has user_client record -->\n              {{ !element?.user_client ? '' : element?.user_client?.is_enabled ? 'Enabled' : 'Disabled' }}\n            </p>\n          </td>\n        </ng-container>\n\n        <!-- Email Column -->\n        <ng-container matColumnDef=\"email\">\n          <th mat-header-cell mat-sort-header=\"email\" *matHeaderCellDef> Email </th>\n          <td mat-cell *matCellDef=\"let element\"> {{element.email}} </td>\n        </ng-container>\n\n        <!-- Type Column -->\n        <ng-container matColumnDef=\"type\">\n          <th mat-header-cell mat-sort-header=\"user_type_id\" *matHeaderCellDef> User Type </th>\n          <td mat-cell *matCellDef=\"let element\"> {{ getUserType(element) }} </td>\n        </ng-container>\n\n        <!-- Roles Column -->\n        <ng-container matColumnDef=\"roles\">\n          <th mat-header-cell *matHeaderCellDef> Role </th>\n          <td mat-cell *matCellDef=\"let element\">\n            <div class=\"d-flex justify-content-start align-items-center gap-1 flex-wrap\">\n              <span\n                *ngFor=\"let role of element?.roles\"\n                class=\"badge bg-secondary\"\n              >\n                {{ role?.label }}\n              </span>\n            </div>\n          </td>\n        </ng-container>\n\n        <!-- Last Login Column -->\n        <ng-container matColumnDef=\"last_login\">\n          <th mat-header-cell *matHeaderCellDef> Last Login </th>\n          <td mat-cell *matCellDef=\"let element\">{{ element?.last_login | date:'medium' }}</td>\n        </ng-container>\n\n        <!-- Added By Column -->\n        <ng-container matColumnDef=\"added_by\">\n          <th mat-header-cell *matHeaderCellDef> Added By </th>\n          <td mat-cell *matCellDef=\"let element\">\n            <p class=\"mb-0\">{{ element?.creator?.name }}</p>\n            <p class=\"text-secondary\">{{ element?.created_at | date }}</p>\n          </td>\n        </ng-container>\n\n        <!-- Actions Column -->\n        <ng-container matColumnDef=\"actions\">\n          <th mat-header-cell *matHeaderCellDef> Action </th>\n          <td mat-cell *matCellDef=\"let element\">\n            <div fxLayout fxLayoutAlign=\"start center\" fxLayoutGap=\"5px\">\n              <button type=\"button\" mat-icon-button [routerLink]=\"[element.id]\">\n                <mat-icon>visibility</mat-icon>\n              </button>\n\n              <button *ngIf=\"currentUserService.hasPermission('user_update')\" type=\"button\" mat-icon-button\n                (click)=\"createOrEditUser(element)\">\n                <mat-icon>edit</mat-icon>\n              </button>\n\n              <button *ngIf=\"currentUserService.hasPermission('user_delete')\" type=\"button\" mat-icon-button\n                (click)=\"deleteUser(element)\">\n                <mat-icon>delete</mat-icon>\n              </button>\n              <app-user-enable-button [user]=\"element\" (onSave)=\"reload()\"></app-user-enable-button>\n            </div>\n          </td>\n        </ng-container>\n\n        <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n        <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\"></tr>\n      </table>\n      <mat-progress-bar *ngIf=\"isWorking\" mode=\"indeterminate\"></mat-progress-bar>\n    </mat-card-content>\n  </mat-card>\n</div>\n", dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$5.RouterLink, selector: ":not(a):not(area)[routerLink]", inputs: ["queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1$5.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i7$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i7$3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i7$3.MatLabel, selector: "mat-label" }, { kind: "component", type: i8$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i9.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: "directive", type: i10.MatSort, selector: "[matSort]", inputs: ["matSortDisabled", "matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i10.MatSortHeader, selector: "[mat-sort-header]", inputs: ["disabled", "mat-sort-header", "arrowPosition", "start", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "component", type: i11.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i11.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i11.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i11.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i11.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i11.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i11.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i11.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i11.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i11.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i10$1.MatCard, selector: "mat-card", exportAs: ["matCard"] }, { kind: "directive", type: i10$1.MatCardContent, selector: "mat-card-content, [mat-card-content], [matCardContent]" }, { kind: "directive", type: i5.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "directive", type: i3$2.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i3$2.MatButtonToggle, selector: "mat-button-toggle", inputs: ["disableRipple", "aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "appearance", "checked", "disabled"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "directive", type: i7.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i7.DefaultLayoutGapDirective, selector: "  [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md],  [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md],  [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm],  [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i7.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i2.DefaultClassDirective, selector: "  [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],  [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],  [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { kind: "directive", type: i1$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$4.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$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i4.InfiniteScrollDirective, selector: "[infiniteScroll], [infinite-scroll], [data-infinite-scroll]", inputs: ["infiniteScrollDistance", "infiniteScrollUpDistance", "infiniteScrollThrottle", "infiniteScrollDisabled", "infiniteScrollContainer", "scrollWindow", "immediateCheck", "horizontal", "alwaysCallback", "fromRoot"], outputs: ["scrolled", "scrolledUp"] }, { kind: "component", type: SearchableSelectorComponent, selector: "app-searchable-selector", inputs: ["valueField", "titleField", "subtitleField", "apiUrl", "multiple", "selectedValue", "enableSearch", "add", "addConfig", "edit", "editConfig", "sort", "sortBy", "searchField", "itemComponent", "items", "apiDataProperty", "cache", "perPage", "inDataSearch", "required", "disabled", "value"], outputs: ["selectedValueChange", "selectionChange", "itemsChange"] }, { kind: "component", type: i23.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "component", type: UserEnableButtonComponent, selector: "app-user-enable-button", inputs: ["user", "isUseIcons"], outputs: ["onSave"] }, { kind: "pipe", type: i3.DatePipe, name: "date" }] });
 UsersViewAllComponent = __decorate([
     UntilDestroy()
 ], UsersViewAllComponent);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: UsersViewAllComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-users-view-all', template: "<div [ngClass]=\"{'m-4':config?.userConfig?.showDefaultMargin}\">\n  <mat-card class=\"mb-2\">\n    <mat-card-content class=\"d-flex justify-content-between align-items center gap-2\">\n      <section class=\"d-flex justify-content-start align-items-center gap-2\">\n        <h3 class=\"mb-0\">\n          {{ title }}\n        </h3>\n        <mat-icon class=\"cursor-pointer\" matTooltip=\"New User\"\n                  *ngIf=\"config?.userConfig?.showAddUser && currentUserService?.hasPermission('user_create')\"\n                  (click)=\"createOrEditUser()\">add</mat-icon>\n        <button mat-raised-button type=\"button\" [routerLink]=\"['../import']\" *ngIf=\"config?.userConfig?.showImportButton\">\n          Import User\n        </button>\n        <button mat-raised-button type=\"button\" [routerLink]=\"['../roles']\" *ngIf=\"config?.userConfig?.showRoles\">\n          <mat-icon>people</mat-icon>\n          Manage Roles\n        </button>\n        <button mat-raised-button type=\"button\" [routerLink]=\"['../role-permissions']\"\n                *ngIf=\"config?.userConfig?.showPermissions\">\n          <mat-icon>lock</mat-icon>\n          Role Permissions\n        </button>\n        <button mat-raised-button type=\"button\" [routerLink]=\"['../configurations']\"\n                *ngIf=\"config?.userConfig?.showConfigurations && currentUser?.user_type_id === 2\">\n          <mat-icon>\n        <span class=\"material-icons-outlined\">\n          toggle_on\n        </span>\n          </mat-icon>\n          Configurations\n        </button>\n        <button mat-raised-button type=\"button\" [routerLink]=\"['../restrictors']\"\n                *ngIf=\"config?.userConfig?.showRestrictors && currentUser?.user_type_id === 2\">\n          <mat-icon>\n        <span class=\"material-icons-outlined\">\n          vpn_lock\n        </span>\n          </mat-icon>\n          Restrictors\n        </button>\n      </section>\n      <form [formGroup]=\"filterForm\" class=\"d-flex justify-content-end align-items-center gap-2\">\n        <mat-form-field style=\"max-width: 150px;\">\n          <mat-label>Search</mat-label>\n          <input autocomplete=\"off\" matInput type=\"text\" name=\"search\" placeholder=\"Search by name, email\" formControlName=\"search\">\n        </mat-form-field>\n        <mat-form-field style=\"max-width: 150px;\">\n          <mat-label>Role</mat-label>\n          <app-searchable-selector apiUrl=\"api/roles\" [multiple]=\"true\" formControlName=\"role_ids\"\n            titleField=\"label\"></app-searchable-selector>\n        </mat-form-field>\n        <mat-button-toggle-group formControlName=\"status\" multiple>\n          <mat-button-toggle value=\"enabled\">Enabled</mat-button-toggle>\n          <mat-button-toggle value=\"disabled\">Disabled</mat-button-toggle>\n        </mat-button-toggle-group>\n      </form>\n    </mat-card-content>\n  </mat-card>\n  <mat-card class=\"mt-2 p-0\">\n    <mat-card-content>\n      <table mat-table [dataSource]=\"models\" class=\"w-100\" aria-describedby=\"Users\" infiniteScroll\n             [infiniteScrollDistance]=\"2\" [infiniteScrollThrottle]=\"50\" [infiniteScrollContainer]=\"scrollContainer\"\n             [fromRoot]=\"true\" (scrolled)=\"onScroll()\" matSort (matSortChange)=\"onSortChange($event)\">\n        <!-- Index Column -->\n        <ng-container matColumnDef=\"index\">\n          <th mat-header-cell *matHeaderCellDef> # </th>\n          <td mat-cell *matCellDef=\"let element; let i = index;\"> {{ i + 1 }} </td>\n        </ng-container>\n\n        <!-- Name Column -->\n        <ng-container matColumnDef=\"name\">\n          <th mat-header-cell mat-sort-header=\"name\" *matHeaderCellDef> Name </th>\n          <td mat-cell *matCellDef=\"let element\">\n            <a [routerLink]=\"[element?.id]\" class=\"text-decoration-none\">\n              {{ element.name }}\n            </a>\n            <p class=\"mb-0 text-secondary\">\n              {{ element?.user_client?.is_enabled ? 'Enabled' : 'Disabled' }}\n            </p>\n          </td>\n        </ng-container>\n\n        <!-- Email Column -->\n        <ng-container matColumnDef=\"email\">\n          <th mat-header-cell mat-sort-header=\"email\" *matHeaderCellDef> Email </th>\n          <td mat-cell *matCellDef=\"let element\"> {{element.email}} </td>\n        </ng-container>\n\n        <!-- Type Column -->\n        <ng-container matColumnDef=\"type\">\n          <th mat-header-cell mat-sort-header=\"user_type_id\" *matHeaderCellDef> User Type </th>\n          <td mat-cell *matCellDef=\"let element\"> {{ getUserType(element) }} </td>\n        </ng-container>\n\n        <!-- Roles Column -->\n        <ng-container matColumnDef=\"roles\">\n          <th mat-header-cell *matHeaderCellDef> Role </th>\n          <td mat-cell *matCellDef=\"let element\">\n            <div class=\"d-flex justify-content-start align-items-center gap-1 flex-wrap\">\n              <span\n                *ngFor=\"let role of element?.roles\"\n                class=\"badge bg-secondary\"\n              >\n                {{ role?.label }}\n              </span>\n            </div>\n          </td>\n        </ng-container>\n\n        <!-- Last Login Column -->\n        <ng-container matColumnDef=\"last_login\">\n          <th mat-header-cell *matHeaderCellDef> Last Login </th>\n          <td mat-cell *matCellDef=\"let element\">{{ element?.last_login | date:'medium' }}</td>\n        </ng-container>\n\n        <!-- Added By Column -->\n        <ng-container matColumnDef=\"added_by\">\n          <th mat-header-cell *matHeaderCellDef> Added By </th>\n          <td mat-cell *matCellDef=\"let element\">\n            <p class=\"mb-0\">{{ element?.creator?.name }}</p>\n            <p class=\"text-secondary\">{{ element?.created_at | date }}</p>\n          </td>\n        </ng-container>\n\n        <!-- Actions Column -->\n        <ng-container matColumnDef=\"actions\">\n          <th mat-header-cell *matHeaderCellDef> Action </th>\n          <td mat-cell *matCellDef=\"let element\">\n            <div fxLayout fxLayoutAlign=\"start center\" fxLayoutGap=\"5px\">\n              <button type=\"button\" mat-icon-button [routerLink]=\"[element.id]\">\n                <mat-icon>visibility</mat-icon>\n              </button>\n\n              <button *ngIf=\"currentUserService.hasPermission('user_update')\" type=\"button\" mat-icon-button\n                (click)=\"createOrEditUser(element)\">\n                <mat-icon>edit</mat-icon>\n              </button>\n\n              <button *ngIf=\"currentUserService.hasPermission('user_delete')\" type=\"button\" mat-icon-button\n                (click)=\"deleteUser(element)\">\n                <mat-icon>delete</mat-icon>\n              </button>\n              <app-user-enable-button [user]=\"element\" (onSave)=\"reload()\"></app-user-enable-button>\n            </div>\n          </td>\n        </ng-container>\n\n        <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n        <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\"></tr>\n      </table>\n      <mat-progress-bar *ngIf=\"isWorking\" mode=\"indeterminate\"></mat-progress-bar>\n    </mat-card-content>\n  </mat-card>\n</div>\n" }]
+            args: [{ selector: 'app-users-view-all', template: "<div [ngClass]=\"{'m-4':config?.userConfig?.showDefaultMargin}\">\n  <mat-card class=\"mb-2\">\n    <mat-card-content class=\"d-flex justify-content-between align-items center gap-2\">\n      <section class=\"d-flex justify-content-start align-items-center gap-2\">\n        <h3 class=\"mb-0\">\n          {{ title }}\n        </h3>\n        <mat-icon class=\"cursor-pointer\" matTooltip=\"New User\"\n                  *ngIf=\"config?.userConfig?.showAddUser && currentUserService?.hasPermission('user_create')\"\n                  (click)=\"createOrEditUser()\">add</mat-icon>\n        <button mat-raised-button type=\"button\" [routerLink]=\"['../import']\" *ngIf=\"config?.userConfig?.showImportButton\">\n          Import User\n        </button>\n        <button mat-raised-button type=\"button\" [routerLink]=\"['../roles']\" *ngIf=\"config?.userConfig?.showRoles\">\n          <mat-icon>people</mat-icon>\n          Roles\n        </button>\n        <button mat-raised-button type=\"button\" [routerLink]=\"['../role-permissions']\"\n                *ngIf=\"config?.userConfig?.showPermissions\">\n          <mat-icon>lock</mat-icon>\n          Role Permissions\n        </button>\n        <button mat-raised-button type=\"button\" [routerLink]=\"['../configurations']\"\n                *ngIf=\"config?.userConfig?.showConfigurations && currentUser?.user_type_id === 2\">\n          <mat-icon>\n        <span class=\"material-icons-outlined\">\n          toggle_on\n        </span>\n          </mat-icon>\n          Configurations\n        </button>\n        <button mat-raised-button type=\"button\" [routerLink]=\"['../restrictors']\"\n                *ngIf=\"config?.userConfig?.showRestrictors && currentUser?.user_type_id === 2\">\n          <mat-icon>\n        <span class=\"material-icons-outlined\">\n          vpn_lock\n        </span>\n          </mat-icon>\n          Restrictors\n        </button>\n      </section>\n      <form [formGroup]=\"filterForm\" class=\"d-flex justify-content-end align-items-center gap-2\">\n        <mat-form-field style=\"max-width: 150px;\">\n          <mat-label>Search</mat-label>\n          <input autocomplete=\"off\" matInput type=\"text\" name=\"search\" placeholder=\"Search by name, email\" formControlName=\"search\">\n        </mat-form-field>\n        <mat-form-field style=\"max-width: 150px;\">\n          <mat-label>Role</mat-label>\n          <app-searchable-selector apiUrl=\"api/roles\" [multiple]=\"true\" formControlName=\"role_ids\"\n            titleField=\"label\"></app-searchable-selector>\n        </mat-form-field>\n        <mat-button-toggle-group formControlName=\"status\" multiple>\n          <mat-button-toggle value=\"enabled\">Enabled</mat-button-toggle>\n          <mat-button-toggle value=\"disabled\">Disabled</mat-button-toggle>\n        </mat-button-toggle-group>\n      </form>\n    </mat-card-content>\n  </mat-card>\n  <mat-card class=\"mt-2 p-0\">\n    <mat-card-content>\n      <table mat-table [dataSource]=\"models\" class=\"w-100\" aria-describedby=\"Users\" infiniteScroll\n             [infiniteScrollDistance]=\"2\" [infiniteScrollThrottle]=\"50\" [infiniteScrollContainer]=\"scrollContainer\"\n             [fromRoot]=\"true\" (scrolled)=\"onScroll()\" matSort (matSortChange)=\"onSortChange($event)\">\n        <!-- Index Column -->\n        <ng-container matColumnDef=\"index\">\n          <th mat-header-cell *matHeaderCellDef> # </th>\n          <td mat-cell *matCellDef=\"let element; let i = index;\"> {{ i + 1 }} </td>\n        </ng-container>\n\n        <!-- Name Column -->\n        <ng-container matColumnDef=\"name\">\n          <th mat-header-cell mat-sort-header=\"name\" *matHeaderCellDef> Name </th>\n          <td mat-cell *matCellDef=\"let element\">\n            <a [routerLink]=\"[element?.id]\" class=\"text-decoration-none\">\n              {{ element.name }}\n            </a>\n            <p class=\"mb-0 text-secondary\">\n              <!-- !element?.user_client condition added to check if user has user_client record -->\n              {{ !element?.user_client ? '' : element?.user_client?.is_enabled ? 'Enabled' : 'Disabled' }}\n            </p>\n          </td>\n        </ng-container>\n\n        <!-- Email Column -->\n        <ng-container matColumnDef=\"email\">\n          <th mat-header-cell mat-sort-header=\"email\" *matHeaderCellDef> Email </th>\n          <td mat-cell *matCellDef=\"let element\"> {{element.email}} </td>\n        </ng-container>\n\n        <!-- Type Column -->\n        <ng-container matColumnDef=\"type\">\n          <th mat-header-cell mat-sort-header=\"user_type_id\" *matHeaderCellDef> User Type </th>\n          <td mat-cell *matCellDef=\"let element\"> {{ getUserType(element) }} </td>\n        </ng-container>\n\n        <!-- Roles Column -->\n        <ng-container matColumnDef=\"roles\">\n          <th mat-header-cell *matHeaderCellDef> Role </th>\n          <td mat-cell *matCellDef=\"let element\">\n            <div class=\"d-flex justify-content-start align-items-center gap-1 flex-wrap\">\n              <span\n                *ngFor=\"let role of element?.roles\"\n                class=\"badge bg-secondary\"\n              >\n                {{ role?.label }}\n              </span>\n            </div>\n          </td>\n        </ng-container>\n\n        <!-- Last Login Column -->\n        <ng-container matColumnDef=\"last_login\">\n          <th mat-header-cell *matHeaderCellDef> Last Login </th>\n          <td mat-cell *matCellDef=\"let element\">{{ element?.last_login | date:'medium' }}</td>\n        </ng-container>\n\n        <!-- Added By Column -->\n        <ng-container matColumnDef=\"added_by\">\n          <th mat-header-cell *matHeaderCellDef> Added By </th>\n          <td mat-cell *matCellDef=\"let element\">\n            <p class=\"mb-0\">{{ element?.creator?.name }}</p>\n            <p class=\"text-secondary\">{{ element?.created_at | date }}</p>\n          </td>\n        </ng-container>\n\n        <!-- Actions Column -->\n        <ng-container matColumnDef=\"actions\">\n          <th mat-header-cell *matHeaderCellDef> Action </th>\n          <td mat-cell *matCellDef=\"let element\">\n            <div fxLayout fxLayoutAlign=\"start center\" fxLayoutGap=\"5px\">\n              <button type=\"button\" mat-icon-button [routerLink]=\"[element.id]\">\n                <mat-icon>visibility</mat-icon>\n              </button>\n\n              <button *ngIf=\"currentUserService.hasPermission('user_update')\" type=\"button\" mat-icon-button\n                (click)=\"createOrEditUser(element)\">\n                <mat-icon>edit</mat-icon>\n              </button>\n\n              <button *ngIf=\"currentUserService.hasPermission('user_delete')\" type=\"button\" mat-icon-button\n                (click)=\"deleteUser(element)\">\n                <mat-icon>delete</mat-icon>\n              </button>\n              <app-user-enable-button [user]=\"element\" (onSave)=\"reload()\"></app-user-enable-button>\n            </div>\n          </td>\n        </ng-container>\n\n        <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n        <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\"></tr>\n      </table>\n      <mat-progress-bar *ngIf=\"isWorking\" mode=\"indeterminate\"></mat-progress-bar>\n    </mat-card-content>\n  </mat-card>\n</div>\n" }]
         }], ctorParameters: function () { return [{ type: HttpService }, { type: AlertService }, { type: CurrentUserService }, { type: UserConfigService }, { type: i1.MatDialog }, { type: UserService }, { type: i1$4.UntypedFormBuilder }, { type: RequestHelperService }, { type: i1$5.ActivatedRoute }]; }, propDecorators: { clientId: [{
                 type: Input
             }], userTypeIds: [{
@@ -4523,7 +4534,7 @@ let EntityFilesViewAllComponent = class EntityFilesViewAllComponent {
     }
 };
 EntityFilesViewAllComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: EntityFilesViewAllComponent, deps: [{ token: EntityFileService }, { token: i3.Location }, { token: AlertService }, { token: i1.MatDialog }, { token: i1$4.UntypedFormBuilder }, { token: ErrorHandlerService }, { token: CurrentUserService }], target: i0.ɵɵFactoryTarget.Component });
-EntityFilesViewAllComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: EntityFilesViewAllComponent, selector: "app-entity-files-view-all", inputs: { entityId: "entityId", entityType: "entityType", viewOnly: "viewOnly", removeSearch: "removeSearch", hideTitleAndDetails: "hideTitleAndDetails", displayMode: "displayMode", allowMultipleFiles: "allowMultipleFiles", allowBulkUpdate: "allowBulkUpdate", useTechlifyTags: "useTechlifyTags", techlifyTagCategories: "techlifyTagCategories", techlifyTagConfig: "techlifyTagConfig", title: "title", permission: "permission" }, ngImport: i0, template: "<div>\n  <div fxLayout=\"column\" [fxHide]=\"!this.documentIds.length\" fxHide.xs fxHide.sm fxHide.lt-md>\n    <mat-card class=\"update_card\" *ngIf=\"this.documentIds.length\">\n      <mat-card-header>\n        <mat-card-title>\n          <div mat-dialog-title class=\"mt-2 ml-2 text-center\">\n            <div>Update Selected Rows</div>\n          </div>\n        </mat-card-title>\n      </mat-card-header>\n      <mat-card-content fxLayout=\"column\">\n        <form [formGroup]=\"updateRowForm\">\n          <div fxLayout=\"column\">\n\n            <mat-form-field fxFlex=\"100%\" class=\"px-1\">\n              <input matInput formControlName=\"title\" placeholder=\"Title\" autocomplete=\"off\" />\n              <button mat-button *ngIf=\"updateRowForm.get('title').value || updateRowForm.get('title').value===0\"\n                matSuffix mat-icon-button style=\"color:red\" (click)=\"resetFieldValueOfRow('title', $event)\">\n                <mat-icon>close</mat-icon>\n              </button>\n              <button mat-button matSuffix mat-icon-button type=\"button\" style=\"color:green\" *ngIf=\"(updateRowForm.get('title').value || updateRowForm.get('title').value===0)\n                && updateRowForm.get('title').valid\" (click)=\"bulkUpdate('title')\">\n                <mat-icon>done</mat-icon>\n              </button>\n            </mat-form-field>\n\n            <mat-form-field fxFlex=\"100%\" class=\"px-1\">\n              <textarea matInput formControlName=\"details\" placeholder=\"Details\" autocomplete=\"off\"></textarea>\n              <button mat-button *ngIf=\"updateRowForm.get('details').value || updateRowForm.get('details').value===0\"\n                matSuffix mat-icon-button style=\"color:red\" (click)=\"resetFieldValueOfRow('details', $event)\">\n                <mat-icon>close</mat-icon>\n              </button>\n              <button mat-button matSuffix mat-icon-button type=\"button\" style=\"color:green\" *ngIf=\"(updateRowForm.get('details').value || updateRowForm.get('details').value===0)\n                && updateRowForm.get('details').valid\" (click)=\"bulkUpdate('details')\">\n                <mat-icon>done</mat-icon>\n              </button>\n            </mat-form-field>\n\n            <ng-container *ngIf=\"useTechlifyTags\">\n              <mat-form-field>\n                <mat-label>Tag</mat-label>\n                <app-techlify-tagger-tag-form-field modelType=\"entity-file\" formControlName=\"tag_ids\"\n                  placeholder=\"Enter new tag\">\n                </app-techlify-tagger-tag-form-field>\n                <button mat-button *ngIf=\"updateRowForm.get('tag_ids').value || updateRowForm.get('tag_ids').value===0\"\n                  matSuffix mat-icon-button style=\"color:red\" (click)=\"resetFieldValueOfRow('tag_ids', $event)\">\n                  <mat-icon>close</mat-icon>\n                </button>\n                <button mat-button matSuffix mat-icon-button type=\"button\" style=\"color:green\" *ngIf=\"(updateRowForm.get('tag_ids').value || updateRowForm.get('tag_ids').value===0)\n                  && updateRowForm.get('tag_ids').valid\" (click)=\"bulkUpdate('tag_ids')\">\n                  <mat-icon>done</mat-icon>\n                </button>\n              </mat-form-field>\n            </ng-container>\n          </div>\n        </form>\n      </mat-card-content>\n    </mat-card>\n\n  </div>\n\n  <div>\n    <div class=\"mat-typography\" *ngIf=\"!displayMode\">\n      <div fxLayout=\"row\" fxLayoutGap=\"1rem\">\n        <mat-card [fxFlex]=\"this.documentIds.length ? '100%' : '70%'\">\n          <mat-card-title>\n            <div fxLayout fxLayoutGap=\"1rem\">\n              <h3 class=\"font-weight-bold primary-color\" fxLayout=\"center center\">\n                <mat-icon>\n                  <span class=\"material-icons\">\n                    description\n                  </span>\n                </mat-icon>\n                {{title}}s\n              </h3>\n              <div>\n                <button type=\"button\" class=\"mx-1\" mat-raised-button color=\"primary\" (click)=\"addEntityFile()\"\n                  *ngIf=\"!viewOnly && isShowCreateAction\">\n                  <mat-icon>\n                    <span class=\"material-icons\">\n                      add_circle_outline\n                    </span>\n                  </mat-icon>\n                  {{title}}\n                </button>\n              </div>\n            </div>\n          </mat-card-title>\n          <mat-card-subtitle>\n            <form [formGroup]=\"filterFormGroup\" style=\"font-size: 10px;\" fxLayout fxLayoutGap=\"1rem\">\n              <mat-form-field *ngIf=\"!removeSearch\" appearance=\"outline\">\n                <mat-label>Search</mat-label>\n                <input type=\"text\" matInput formControlName=\"title\" placeholder=\"Search\" name=\"title\"\n                  autocomplete=\"off\" />\n                <button mat-button *ngIf=\"filters.title\" matSuffix mat-icon-button\n                  (click)=\"resetFieldValue($event, 'title')\">\n                  <mat-icon>close</mat-icon>\n                </button>\n              </mat-form-field>\n\n              <ng-container *ngIf=\"useTechlifyTags\">\n                <mat-form-field>\n                  <mat-label>Tag</mat-label>\n                  <app-techlify-tagger-tag-form-field\n                    [categories]=\"techlifyTagCategories\"\n                    formControlName=\"tag_ids\"\n                    placeholder=\"Select Tags\"\n                    [config]=\"techlifyTagConfig\"\n                  ></app-techlify-tagger-tag-form-field>\n                </mat-form-field>\n              </ng-container>\n\n\n              <button mat-icon-button (click)=\"reload()\" *ngIf=\"isReload\" type=\"button\" matTooltip=\"Refresh\">\n                <mat-icon>\n                  <span class=\"material-icons\">\n                    refresh\n                  </span>\n                </mat-icon>\n              </button>\n            </form>\n          </mat-card-subtitle>\n          <mat-card-content class=\"entity-file-card\">\n            <table mat-table [dataSource]=\"dataSource\" class=\"w-100\" matSort multiTemplateDataRows infiniteScroll\n              [infiniteScrollDistance]=\"1.5\" [infiniteScrollThrottle]=\"50\" (scrolled)=\"onScroll()\">\n\n              <!-- Select Column -->\n              <ng-container matColumnDef=\"select\">\n                <th mat-header-cell *matHeaderCellDef style=\"width:30px\">\n                  <mat-checkbox name=\"employee\" [(ngModel)]=\"isAllSelected\" (change)=\"selectAll()\">\n                  </mat-checkbox>\n                </th>\n                <td mat-cell *matCellDef=\"let element\" style=\"width:30px\">\n                  <mat-checkbox name=\"employee[{{element?.id}}]\" (click)=\"$event.stopPropagation()\"\n                    [(ngModel)]=\"element.is_selected\" (change)=\"employeeListModified($event, element)\"\n                    [disabled]=\"!entityFiles.length\">\n                  </mat-checkbox>\n                </td>\n              </ng-container>\n\n              <!-- Index Column -->\n              <ng-container matColumnDef=\"index\">\n                <th mat-header-cell *matHeaderCellDef> # </th>\n                <td mat-cell *matCellDef=\"let element; let i = dataIndex\"> {{ i+1 }} </td>\n              </ng-container>\n\n              <!-- Title Column -->\n              <ng-container matColumnDef=\"title\">\n                <th mat-header-cell *matHeaderCellDef> Title </th>\n                <td mat-cell *matCellDef=\"let element\">\n                  <div>\n                    <span>\n                      {{element.title}}\n                    </span>\n                    <span>\n                      <a href=\"{{element.url}}\" target=\"_blank\" class=\"text-decoration-none text-muted\">\n                        <button mat-icon-button type=\"button\">\n                          <mat-icon>download</mat-icon>\n                        </button>\n                      </a>\n                    </span>\n                  </div>\n                </td>\n              </ng-container>\n\n              <!-- Details Column -->\n              <ng-container matColumnDef=\"details\">\n                <th mat-header-cell *matHeaderCellDef> Details </th>\n                <td mat-cell *matCellDef=\"let element\">\n                  <app-read-more [text]=\"element.details\" [maxLength]=\"50\"></app-read-more>\n                </td>\n              </ng-container>\n\n              <!-- File size Column -->\n              <ng-container matColumnDef=\"file_size\">\n                <th mat-header-cell *matHeaderCellDef> File Size </th>\n                <td mat-cell *matCellDef=\"let element\"> {{ sizeOf(element.file_size)}} </td>\n              </ng-container>\n\n              <!-- Tags Column -->\n              <ng-container matColumnDef=\"tag\">\n                <th mat-header-cell *matHeaderCellDef> Tag </th>\n                <td mat-cell *matCellDef=\"let element\" class=\"p-1\">\n                  <mat-chip-list aria-label=\"Tags\">\n                    <mat-chip *ngFor=\"let tag of element.tags\">\n                      {{ tag?.title }}\n                    </mat-chip>\n                  </mat-chip-list>\n                </td>\n              </ng-container>\n\n              <!-- Uploaded On Column -->\n              <ng-container matColumnDef=\"uploaded_on\">\n                <th mat-header-cell *matHeaderCellDef> Uploaded On </th>\n                <td mat-cell *matCellDef=\"let element\">\n                  <div>\n                    {{element.created_at | date: 'mediumDate'}}\n                  </div>\n                  <div class=\"text-muted\">\n                    By {{element.creator?.name}}\n                  </div>\n                </td>\n              </ng-container>\n\n              <!-- Actions Column -->\n              <ng-container matColumnDef=\"actions\">\n                <th mat-header-cell *matHeaderCellDef> Actions </th>\n                <td mat-cell *matCellDef=\"let element\" style=\"min-width:110px\" class=\"text-muted\">\n                  <button *ngIf=\"isShowUpdateAction\" type=\"button\" mat-icon-button (click)=\"editEntityFile(element)\">\n                    <mat-icon>edit</mat-icon>\n                  </button>\n                  <button *ngIf=\"isShowDeleteAction\" type=\"button\" mat-icon-button (click)=\"deleteEntityFile(element)\">\n                    <mat-icon>delete</mat-icon>\n                  </button>\n                </td>\n              </ng-container>\n\n              <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n              <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\"></tr>\n            </table>\n\n            <mat-progress-bar mode=\"indeterminate\" *ngIf=\"isWorking\"></mat-progress-bar>\n          </mat-card-content>\n        </mat-card>\n        <section fxFlex=\"30%\" *ngIf=\"!this.documentIds.length\">\n          <app-file-dropper [config]=\"fileConfig\" (fileChanged)=\"fileChanged($event)\" [fileArray]=\"fileList\">\n          </app-file-dropper>\n        </section>\n      </div>\n    </div>\n  </div>\n\n  <div fxLayout=\"row wrap\" fxLayoutGap=\"1rem\" class=\"mat-typography p-4\" *ngIf=\"displayMode\">\n    <div *ngFor=\"let efile of entityFiles\">\n      <app-document-viewer [file]=\"efile.file\" [fileUrl]=\"efile.url\" [config]=\"this.viewerConfig\" [disableEdit]=\"true\">\n      </app-document-viewer>\n      <a href=\"{{efile.url}}\" target=\"_blank\">\n        <button mat-button type=\"button\">View</button>\n      </a>\n    </div>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$4.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$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i7.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i7.DefaultLayoutGapDirective, selector: "  [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md],  [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md],  [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm],  [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i7.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "directive", type: i2.DefaultShowHideDirective, selector: "  [fxShow], [fxShow.print],  [fxShow.xs], [fxShow.sm], [fxShow.md], [fxShow.lg], [fxShow.xl],  [fxShow.lt-sm], [fxShow.lt-md], [fxShow.lt-lg], [fxShow.lt-xl],  [fxShow.gt-xs], [fxShow.gt-sm], [fxShow.gt-md], [fxShow.gt-lg],  [fxHide], [fxHide.print],  [fxHide.xs], [fxHide.sm], [fxHide.md], [fxHide.lg], [fxHide.xl],  [fxHide.lt-sm], [fxHide.lt-md], [fxHide.lt-lg], [fxHide.lt-xl],  [fxHide.gt-xs], [fxHide.gt-sm], [fxHide.gt-md], [fxHide.gt-lg]", inputs: ["fxShow", "fxShow.print", "fxShow.xs", "fxShow.sm", "fxShow.md", "fxShow.lg", "fxShow.xl", "fxShow.lt-sm", "fxShow.lt-md", "fxShow.lt-lg", "fxShow.lt-xl", "fxShow.gt-xs", "fxShow.gt-sm", "fxShow.gt-md", "fxShow.gt-lg", "fxHide", "fxHide.print", "fxHide.xs", "fxHide.sm", "fxHide.md", "fxHide.lg", "fxHide.xl", "fxHide.lt-sm", "fxHide.lt-md", "fxHide.lt-lg", "fxHide.lt-xl", "fxHide.gt-xs", "fxHide.gt-sm", "fxHide.gt-md", "fxHide.gt-lg"] }, { kind: "component", type: FileDropperComponent, selector: "app-file-dropper", inputs: ["fileArray", "config", "styles"], outputs: ["fileChanged"] }, { kind: "component", type: DocumentViewerComponent, selector: "app-document-viewer", inputs: ["config", "file", "fileUrl", "disableEdit"], outputs: ["remove"] }, { kind: "directive", type: i4.InfiniteScrollDirective, selector: "[infiniteScroll], [infinite-scroll], [data-infinite-scroll]", inputs: ["infiniteScrollDistance", "infiniteScrollUpDistance", "infiniteScrollThrottle", "infiniteScrollDisabled", "infiniteScrollContainer", "scrollWindow", "immediateCheck", "horizontal", "alwaysCallback", "fromRoot"], outputs: ["scrolled", "scrolledUp"] }, { kind: "component", type: i7$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i8.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "directive", type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "component", type: i7$3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i7$3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i7$3.MatSuffix, selector: "[matSuffix]" }, { kind: "component", type: i8$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i9.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: "directive", type: i10.MatSort, selector: "[matSort]", inputs: ["matSortDisabled", "matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i11.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i11.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i11.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i11.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i11.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i11.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i11.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i11.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i11.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i11.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i10$1.MatCard, selector: "mat-card", exportAs: ["matCard"] }, { kind: "component", type: i10$1.MatCardHeader, selector: "mat-card-header" }, { kind: "directive", type: i10$1.MatCardContent, selector: "mat-card-content, [mat-card-content], [matCardContent]" }, { kind: "directive", type: i10$1.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { kind: "directive", type: i10$1.MatCardSubtitle, selector: "mat-card-subtitle, [mat-card-subtitle], [matCardSubtitle]" }, { kind: "component", type: i7$2.MatChipList, selector: "mat-chip-list", inputs: ["role", "aria-describedby", "errorStateMatcher", "multiple", "compareWith", "value", "required", "placeholder", "disabled", "aria-orientation", "selectable", "tabIndex"], outputs: ["change", "valueChange"], exportAs: ["matChipList"] }, { kind: "directive", type: i7$2.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["color", "disableRipple", "tabIndex", "role", "selected", "value", "selectable", "disabled", "removable"], outputs: ["selectionChange", "destroyed", "removed"], exportAs: ["matChip"] }, { kind: "directive", type: i5.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: TechlifyTaggerTagFormFieldComponent, selector: "app-techlify-tagger-tag-form-field", inputs: ["config", "modelType", "modelId", "allTags", "categories", "defaultCreateCategory", "required", "disabled", "value", "placeholder"] }, { kind: "component", type: ReadMoreComponent, selector: "app-read-more", inputs: ["text", "maxLength"] }, { kind: "component", type: i23.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "pipe", type: i3.DatePipe, name: "date" }] });
+EntityFilesViewAllComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: EntityFilesViewAllComponent, selector: "app-entity-files-view-all", inputs: { entityId: "entityId", entityType: "entityType", viewOnly: "viewOnly", removeSearch: "removeSearch", hideTitleAndDetails: "hideTitleAndDetails", displayMode: "displayMode", allowMultipleFiles: "allowMultipleFiles", allowBulkUpdate: "allowBulkUpdate", useTechlifyTags: "useTechlifyTags", techlifyTagCategories: "techlifyTagCategories", techlifyTagConfig: "techlifyTagConfig", title: "title", permission: "permission" }, ngImport: i0, template: "<div>\n  <div fxLayout=\"column\" [fxHide]=\"!this.documentIds.length\" fxHide.xs fxHide.sm fxHide.lt-md>\n    <mat-card class=\"update_card\" *ngIf=\"this.documentIds.length\">\n      <mat-card-header>\n        <mat-card-title>\n          <div mat-dialog-title class=\"mt-2 ml-2 text-center\">\n            <div>Update Selected Rows</div>\n          </div>\n        </mat-card-title>\n      </mat-card-header>\n      <mat-card-content fxLayout=\"column\">\n        <form [formGroup]=\"updateRowForm\">\n          <div fxLayout=\"column\">\n\n            <mat-form-field fxFlex=\"100%\" class=\"px-1\">\n              <input matInput formControlName=\"title\" placeholder=\"Title\" autocomplete=\"off\" />\n              <button mat-button *ngIf=\"updateRowForm.get('title').value || updateRowForm.get('title').value===0\"\n                matSuffix mat-icon-button style=\"color:red\" (click)=\"resetFieldValueOfRow('title', $event)\">\n                <mat-icon>close</mat-icon>\n              </button>\n              <button mat-button matSuffix mat-icon-button type=\"button\" style=\"color:green\" *ngIf=\"(updateRowForm.get('title').value || updateRowForm.get('title').value===0)\n                && updateRowForm.get('title').valid\" (click)=\"bulkUpdate('title')\">\n                <mat-icon>done</mat-icon>\n              </button>\n            </mat-form-field>\n\n            <mat-form-field fxFlex=\"100%\" class=\"px-1\">\n              <textarea matInput formControlName=\"details\" placeholder=\"Details\" autocomplete=\"off\"></textarea>\n              <button mat-button *ngIf=\"updateRowForm.get('details').value || updateRowForm.get('details').value===0\"\n                matSuffix mat-icon-button style=\"color:red\" (click)=\"resetFieldValueOfRow('details', $event)\">\n                <mat-icon>close</mat-icon>\n              </button>\n              <button mat-button matSuffix mat-icon-button type=\"button\" style=\"color:green\" *ngIf=\"(updateRowForm.get('details').value || updateRowForm.get('details').value===0)\n                && updateRowForm.get('details').valid\" (click)=\"bulkUpdate('details')\">\n                <mat-icon>done</mat-icon>\n              </button>\n            </mat-form-field>\n\n            <ng-container *ngIf=\"useTechlifyTags\">\n              <mat-form-field>\n                <mat-label>Tag</mat-label>\n                <app-techlify-tagger-tag-form-field modelType=\"entity-file\" formControlName=\"tag_ids\"\n                  placeholder=\"Enter new tag\">\n                </app-techlify-tagger-tag-form-field>\n                <button mat-button *ngIf=\"updateRowForm.get('tag_ids').value || updateRowForm.get('tag_ids').value===0\"\n                  matSuffix mat-icon-button style=\"color:red\" (click)=\"resetFieldValueOfRow('tag_ids', $event)\">\n                  <mat-icon>close</mat-icon>\n                </button>\n                <button mat-button matSuffix mat-icon-button type=\"button\" style=\"color:green\" *ngIf=\"(updateRowForm.get('tag_ids').value || updateRowForm.get('tag_ids').value===0)\n                  && updateRowForm.get('tag_ids').valid\" (click)=\"bulkUpdate('tag_ids')\">\n                  <mat-icon>done</mat-icon>\n                </button>\n              </mat-form-field>\n            </ng-container>\n          </div>\n        </form>\n      </mat-card-content>\n    </mat-card>\n\n  </div>\n\n  <div>\n    <div class=\"mat-typography\" *ngIf=\"!displayMode\">\n      <div fxLayout=\"row\" fxLayoutGap=\"1rem\">\n        <mat-card [fxFlex]=\"this.documentIds.length ? '100%' : '70%'\">\n          <mat-card-title>\n            <div fxLayout fxLayoutGap=\"1rem\">\n              <h3 class=\"font-weight-bold primary-color\" fxLayout=\"center center\">\n                <mat-icon>\n                  <span class=\"material-icons\">\n                    description\n                  </span>\n                </mat-icon>\n                {{title}}s\n              </h3>\n              <div>\n                <button type=\"button\" class=\"mx-1\" mat-raised-button color=\"primary\" (click)=\"addEntityFile()\"\n                  *ngIf=\"!viewOnly && isShowCreateAction\">\n                  <mat-icon>\n                    <span class=\"material-icons\">\n                      add_circle_outline\n                    </span>\n                  </mat-icon>\n                  {{title}}\n                </button>\n              </div>\n            </div>\n          </mat-card-title>\n          <mat-card-subtitle>\n            <form [formGroup]=\"filterFormGroup\" style=\"font-size: 10px;\" fxLayout fxLayoutGap=\"1rem\">\n              <mat-form-field *ngIf=\"!removeSearch\" appearance=\"outline\">\n                <mat-label>Search</mat-label>\n                <input type=\"text\" matInput formControlName=\"title\" placeholder=\"Search\" name=\"title\"\n                  autocomplete=\"off\" />\n                <button mat-button *ngIf=\"filters.title\" matSuffix mat-icon-button\n                  (click)=\"resetFieldValue($event, 'title')\">\n                  <mat-icon>close</mat-icon>\n                </button>\n              </mat-form-field>\n\n              <ng-container *ngIf=\"useTechlifyTags\">\n                <mat-form-field>\n                  <mat-label>Tag</mat-label>\n                  <app-techlify-tagger-tag-form-field\n                    [categories]=\"techlifyTagCategories\"\n                    formControlName=\"tag_ids\"\n                    placeholder=\"Select Tags\"\n                    [config]=\"techlifyTagConfig\"\n                  ></app-techlify-tagger-tag-form-field>\n                </mat-form-field>\n              </ng-container>\n\n\n              <button mat-icon-button (click)=\"reload()\" *ngIf=\"isReload\" type=\"button\" matTooltip=\"Refresh\">\n                <mat-icon>\n                  <span class=\"material-icons\">\n                    refresh\n                  </span>\n                </mat-icon>\n              </button>\n            </form>\n          </mat-card-subtitle>\n          <mat-card-content class=\"entity-file-card\">\n            <table mat-table [dataSource]=\"dataSource\" class=\"w-100\" matSort multiTemplateDataRows infiniteScroll\n              [infiniteScrollDistance]=\"1.5\" [infiniteScrollThrottle]=\"50\" (scrolled)=\"onScroll()\">\n\n              <!-- Select Column -->\n              <ng-container matColumnDef=\"select\">\n                <th mat-header-cell *matHeaderCellDef style=\"width:30px\">\n                  <mat-checkbox name=\"employee\" [(ngModel)]=\"isAllSelected\" (change)=\"selectAll()\">\n                  </mat-checkbox>\n                </th>\n                <td mat-cell *matCellDef=\"let element\" style=\"width:30px\">\n                  <mat-checkbox name=\"employee[{{element?.id}}]\" (click)=\"$event.stopPropagation()\"\n                    [(ngModel)]=\"element.is_selected\" (change)=\"employeeListModified($event, element)\"\n                    [disabled]=\"!entityFiles.length\">\n                  </mat-checkbox>\n                </td>\n              </ng-container>\n\n              <!-- Index Column -->\n              <ng-container matColumnDef=\"index\">\n                <th mat-header-cell *matHeaderCellDef> # </th>\n                <td mat-cell *matCellDef=\"let element; let i = dataIndex\"> {{ i+1 }} </td>\n              </ng-container>\n\n              <!-- Title Column -->\n              <ng-container matColumnDef=\"title\">\n                <th mat-header-cell *matHeaderCellDef> Title </th>\n                <td mat-cell *matCellDef=\"let element\">\n                  <div>\n                    <span>\n                      {{element.title}}\n                    </span>\n                    <span>\n                      <a href=\"{{element.url}}\" target=\"_blank\" class=\"text-decoration-none text-muted\">\n                        <button mat-icon-button type=\"button\">\n                          <mat-icon>download</mat-icon>\n                        </button>\n                      </a>\n                    </span>\n                  </div>\n                </td>\n              </ng-container>\n\n              <!-- Details Column -->\n              <ng-container matColumnDef=\"details\">\n                <th mat-header-cell *matHeaderCellDef> Details </th>\n                <td mat-cell *matCellDef=\"let element\">\n                  <app-read-more [text]=\"element.details\" [maxLength]=\"50\"></app-read-more>\n                </td>\n              </ng-container>\n\n              <!-- File size Column -->\n              <ng-container matColumnDef=\"file_size\">\n                <th mat-header-cell *matHeaderCellDef> File Size </th>\n                <td mat-cell *matCellDef=\"let element\"> {{ sizeOf(element.file_size)}} </td>\n              </ng-container>\n\n              <!-- Tags Column -->\n              <ng-container matColumnDef=\"tag\">\n                <th mat-header-cell *matHeaderCellDef> Tag </th>\n                <td mat-cell *matCellDef=\"let element\" class=\"p-1\">\n                  <mat-chip-list aria-label=\"Tags\">\n                    <mat-chip *ngFor=\"let tag of element.tags\">\n                      {{ tag?.title }}\n                    </mat-chip>\n                  </mat-chip-list>\n                </td>\n              </ng-container>\n\n              <!-- Uploaded On Column -->\n              <ng-container matColumnDef=\"uploaded_on\">\n                <th mat-header-cell *matHeaderCellDef> Uploaded On </th>\n                <td mat-cell *matCellDef=\"let element\">\n                  <div>\n                    {{element.created_at | date: 'mediumDate'}}\n                  </div>\n                  <div class=\"text-muted\">\n                    By {{element.creator?.name}}\n                  </div>\n                </td>\n              </ng-container>\n\n              <!-- Actions Column -->\n              <ng-container matColumnDef=\"actions\">\n                <th mat-header-cell *matHeaderCellDef> Actions </th>\n                <td mat-cell *matCellDef=\"let element\" style=\"min-width:110px\" class=\"text-muted\">\n                  <button *ngIf=\"isShowUpdateAction\" type=\"button\" mat-icon-button (click)=\"editEntityFile(element)\">\n                    <mat-icon>edit</mat-icon>\n                  </button>\n                  <button *ngIf=\"isShowDeleteAction\" type=\"button\" mat-icon-button (click)=\"deleteEntityFile(element)\">\n                    <mat-icon>delete</mat-icon>\n                  </button>\n                </td>\n              </ng-container>\n\n              <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n              <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\"></tr>\n            </table>\n\n            <mat-progress-bar mode=\"indeterminate\" *ngIf=\"isWorking\"></mat-progress-bar>\n          </mat-card-content>\n        </mat-card>\n        <section fxFlex=\"30%\" *ngIf=\"!this.documentIds.length\">\n          <app-file-dropper [config]=\"fileConfig\" (fileChanged)=\"fileChanged($event)\" [fileArray]=\"fileList\">\n          </app-file-dropper>\n        </section>\n      </div>\n    </div>\n  </div>\n\n  <div fxLayout=\"row wrap\" fxLayoutGap=\"1rem\" class=\"mat-typography p-4\" *ngIf=\"displayMode\">\n    <div *ngFor=\"let efile of entityFiles\">\n      <app-document-viewer [file]=\"efile.file\" [fileUrl]=\"efile.url\" [config]=\"this.viewerConfig\" [disableEdit]=\"true\">\n      </app-document-viewer>\n      <a href=\"{{efile.url}}\" target=\"_blank\">\n        <button mat-button type=\"button\">View</button>\n      </a>\n    </div>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$4.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$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i7.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i7.DefaultLayoutGapDirective, selector: "  [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md],  [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md],  [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm],  [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i7.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "directive", type: i2.DefaultShowHideDirective, selector: "  [fxShow], [fxShow.print],  [fxShow.xs], [fxShow.sm], [fxShow.md], [fxShow.lg], [fxShow.xl],  [fxShow.lt-sm], [fxShow.lt-md], [fxShow.lt-lg], [fxShow.lt-xl],  [fxShow.gt-xs], [fxShow.gt-sm], [fxShow.gt-md], [fxShow.gt-lg],  [fxHide], [fxHide.print],  [fxHide.xs], [fxHide.sm], [fxHide.md], [fxHide.lg], [fxHide.xl],  [fxHide.lt-sm], [fxHide.lt-md], [fxHide.lt-lg], [fxHide.lt-xl],  [fxHide.gt-xs], [fxHide.gt-sm], [fxHide.gt-md], [fxHide.gt-lg]", inputs: ["fxShow", "fxShow.print", "fxShow.xs", "fxShow.sm", "fxShow.md", "fxShow.lg", "fxShow.xl", "fxShow.lt-sm", "fxShow.lt-md", "fxShow.lt-lg", "fxShow.lt-xl", "fxShow.gt-xs", "fxShow.gt-sm", "fxShow.gt-md", "fxShow.gt-lg", "fxHide", "fxHide.print", "fxHide.xs", "fxHide.sm", "fxHide.md", "fxHide.lg", "fxHide.xl", "fxHide.lt-sm", "fxHide.lt-md", "fxHide.lt-lg", "fxHide.lt-xl", "fxHide.gt-xs", "fxHide.gt-sm", "fxHide.gt-md", "fxHide.gt-lg"] }, { kind: "component", type: FileDropperComponent, selector: "app-file-dropper", inputs: ["fileArray", "config", "styles"], outputs: ["fileChanged"] }, { kind: "component", type: DocumentViewerComponent, selector: "app-document-viewer", inputs: ["config", "file", "fileUrl", "disableEdit"], outputs: ["remove"] }, { kind: "directive", type: i4.InfiniteScrollDirective, selector: "[infiniteScroll], [infinite-scroll], [data-infinite-scroll]", inputs: ["infiniteScrollDistance", "infiniteScrollUpDistance", "infiniteScrollThrottle", "infiniteScrollDisabled", "infiniteScrollContainer", "scrollWindow", "immediateCheck", "horizontal", "alwaysCallback", "fromRoot"], outputs: ["scrolled", "scrolledUp"] }, { kind: "component", type: i7$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i8.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "directive", type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "component", type: i7$3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i7$3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i7$3.MatSuffix, selector: "[matSuffix]" }, { kind: "component", type: i8$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i9.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: "directive", type: i10.MatSort, selector: "[matSort]", inputs: ["matSortDisabled", "matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i11.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i11.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i11.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i11.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i11.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i11.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i11.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i11.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i11.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i11.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i10$1.MatCard, selector: "mat-card", exportAs: ["matCard"] }, { kind: "component", type: i10$1.MatCardHeader, selector: "mat-card-header" }, { kind: "directive", type: i10$1.MatCardContent, selector: "mat-card-content, [mat-card-content], [matCardContent]" }, { kind: "directive", type: i10$1.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { kind: "directive", type: i10$1.MatCardSubtitle, selector: "mat-card-subtitle, [mat-card-subtitle], [matCardSubtitle]" }, { kind: "component", type: i7$2.MatChipList, selector: "mat-chip-list", inputs: ["role", "aria-describedby", "errorStateMatcher", "multiple", "compareWith", "value", "required", "placeholder", "disabled", "aria-orientation", "selectable", "tabIndex"], outputs: ["change", "valueChange"], exportAs: ["matChipList"] }, { kind: "directive", type: i7$2.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["color", "disableRipple", "tabIndex", "role", "selected", "value", "selectable", "disabled", "removable"], outputs: ["selectionChange", "destroyed", "removed"], exportAs: ["matChip"] }, { kind: "directive", type: i5.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: TechlifyTaggerTagFormFieldComponent, selector: "app-techlify-tagger-tag-form-field", inputs: ["config", "modelType", "modelId", "allTags", "categories", "defaultCreateCategory", "required", "disabled", "value", "placeholder"], outputs: ["selectionChange"] }, { kind: "component", type: ReadMoreComponent, selector: "app-read-more", inputs: ["text", "maxLength"] }, { kind: "component", type: i23.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "pipe", type: i3.DatePipe, name: "date" }] });
 EntityFilesViewAllComponent = __decorate([
     UntilDestroy()
 ], EntityFilesViewAllComponent);
@@ -10689,8 +10700,9 @@ let LoginComponent = class LoginComponent {
         this.userConfigService = userConfigService;
         this.isWorking = false;
         this.loginForm = fb.group({
-            email: new UntypedFormControl('', [Validators.required, Validators.email]),
-            password: new UntypedFormControl('', Validators.required),
+            email: ['', [Validators.required, Validators.email]],
+            password: ['', Validators.required],
+            selected_client: [''],
         });
         this.userConfig = this.userConfigService.getConfig();
     }
@@ -10727,6 +10739,7 @@ let LoginComponent = class LoginComponent {
             grant_type: this.config.getAuthGrantType(),
             username: this.loginForm.value.email,
             password: this.loginForm.value.password,
+            selected_client: this.loginForm.value.selected_client,
             remember: true
         };
         this.credentialService.setCredentials();
@@ -10784,18 +10797,19 @@ let LoginComponent = class LoginComponent {
      * @private
      */
     handleLoginErrors(errorObj) {
-        const { error, error_description } = errorObj?.error;
+        const { error, error_description, user_clients } = errorObj?.error;
         this.loginError = { type: error, message: error_description };
+        this.userClients = user_clients;
     }
 };
 LoginComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: LoginComponent, deps: [{ token: HttpService }, { token: AlertService }, { token: i1$5.Router }, { token: AuthenticationService }, { token: ConfigService }, { token: CurrentUserService }, { token: ErrorHandlerService }, { token: StorageService }, { token: CredentialsService }, { token: i1$4.UntypedFormBuilder }, { token: FormValidatorService }, { token: i1$5.ActivatedRoute }, { token: UserConfigService }], target: i0.ɵɵFactoryTarget.Component });
-LoginComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: LoginComponent, selector: "login", ngImport: i0, template: "<div class=\"h-100 d-flex justify-content-center align-items-center w-100\" style=\"background: #fafafa;\">\n  <div class=\"row w-100\">\n    <div class=\"col-lg-4 col-md-6 col-sm-8 col-xs-10 col-12 mx-auto\">\n      <mat-card class=\"mb-3 mt-3 w-100\">\n        <header class=\"branding-block mb-0 mt-4\">\n          <div class=\"branding text-center\">\n            <a *ngIf=\"userConfig.appLogoUrl\" href=\"{{userConfig.appUrl}}\" target=\"_blank\">\n              <img class=\"techlify-logo d-inline-block\" [src]=\"userConfig.appLogoUrl\" alt=\"Logo\"/>\n            </a>\n          </div>\n          <div class=\"product-info text-center mt-2\">\n            <h3 class=\"product-name\">{{ userConfig.appName }}</h3>\n          </div>\n        </header>\n\n        <div id=\"login-form-wrapper\">\n          <h4 class=\"section-title text-center mt-4\">LOGIN</h4>\n          <form [formGroup]=\"loginForm\"\n                (ngSubmit)=\"login()\"\n                fxLayout=\"column\" fxLayoutAlign=\"start\" fxLayoutGap=\"10px\">\n            <mat-form-field>\n              <mat-label>Email</mat-label>\n              <input matInput\n                     formControlName=\"email\"\n                     placeholder=\"Email\"\n                     type=\"email\"\n                     autocomplete=\"off\"\n                     required />\n              <mat-error *ngIf=\"isFieldValid('email')\">{{getErrorMessage('email')}}</mat-error>\n            </mat-form-field>\n            <mat-form-field>\n              <mat-label>Password</mat-label>\n              <input matInput\n                     formControlName=\"password\"\n                     placeholder=\"Password\"\n                     type=\"password\"\n                     autocomplete=\"off\"\n                     required />\n              <mat-error *ngIf=\"isFieldValid('password')\">{{getErrorMessage('password')}}</mat-error>\n            </mat-form-field>\n\n            <div class=\"alert alert-danger\" *ngIf=\"loginError\">\n              <p class=\"mb-0\">{{ loginError?.message }}</p>\n            </div>\n\n            <button mat-raised-button color=\"primary\" class=\"w-100\" type=\"submit\" [disabled]=\"isWorking\">\n              LOGIN\n            </button>\n\n            <div class=\"mt-2\" *ngIf=\"userConfig.showSocialLogin\">\n              <button class=\"w-100 google-button mb-2\"\n                      mat-raised-button type=\"button\"\n                      (click)=\"redirect('google')\">Google</button>\n\n              <button class=\"w-100 facebook-button\"\n                      mat-raised-button type=\"button\"\n                      (click)=\"redirect('facebook')\">Facebook</button>\n            </div>\n            <div class=\"mt-2 mb-4 text-center\"\n                 *ngIf=\"userConfig.showForgotPassword\">\n              <a href=\"javascript:;\" [routerLink]=\"['/forgot-password']\">Forgot password?</a>\n            </div>\n          </form>\n        </div>\n\n        <div class=\"mt-3 p-0 mr-0 ml-0\" *ngIf=\"userConfig.showSignup\">\n          <p>New to {{ userConfig.appName }}?</p>\n          <button mat-raised-button class=\"w-100\" color=\"accent\" type=\"button\"\n                  [routerLink]=\"['/signup']\">\n            Create an account\n          </button>\n        </div>\n      </mat-card>\n    </div>\n  </div>\n</div>\n", styles: ["#login-form-wrapper{margin-top:40px}#login-form-wrapper .branding-block{margin-bottom:60px}#login-form-wrapper .techlify-logo{height:40px;padding-right:10px;bottom:10px;position:relative}#login-form-wrapper .company-name{margin-bottom:0}#login-form-wrapper .google-button{background:#ce1d1d;color:#fff}#login-form-wrapper .facebook-button{background:#38388e;color:#fff}:host{width:100%}.white-box{background-color:#fff;padding:10px}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$4.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$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i7$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i7$3.MatError, selector: "mat-error", inputs: ["id"] }, { kind: "component", type: i7$3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i7$3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i9.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: "component", type: i10$1.MatCard, selector: "mat-card", exportAs: ["matCard"] }, { kind: "directive", type: i1$5.RouterLink, selector: ":not(a):not(area)[routerLink]", inputs: ["queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1$5.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i7.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i7.DefaultLayoutGapDirective, selector: "  [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md],  [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md],  [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm],  [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i7.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }] });
+LoginComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: LoginComponent, selector: "login", ngImport: i0, template: "<div class=\"h-100 d-flex justify-content-center align-items-center w-100\" style=\"background: #fafafa;\">\n  <div class=\"row w-100\">\n    <div class=\"col-lg-4 col-md-6 col-sm-8 col-xs-10 col-12 mx-auto\">\n      <mat-card class=\"mb-3 mt-3 w-100\">\n        <header class=\"branding-block mb-0 mt-4\">\n          <div class=\"branding text-center\">\n            <a *ngIf=\"userConfig.appLogoUrl\" href=\"{{userConfig.appUrl}}\" target=\"_blank\">\n              <img class=\"techlify-logo d-inline-block\" [src]=\"userConfig.appLogoUrl\" alt=\"Logo\"/>\n            </a>\n          </div>\n          <div class=\"product-info text-center mt-2\">\n            <h3 class=\"product-name\">{{ userConfig.appName }}</h3>\n          </div>\n        </header>\n\n        <div id=\"login-form-wrapper\">\n          <h4 class=\"section-title text-center mt-4\">LOGIN</h4>\n          <form [formGroup]=\"loginForm\"\n                (ngSubmit)=\"login()\"\n                fxLayout=\"column\" fxLayoutAlign=\"start\" fxLayoutGap=\"10px\">\n            <mat-form-field>\n              <mat-label>Email</mat-label>\n              <input matInput\n                     formControlName=\"email\"\n                     placeholder=\"Email\"\n                     type=\"email\"\n                     autocomplete=\"off\"\n                     required />\n              <mat-error *ngIf=\"isFieldValid('email')\">{{getErrorMessage('email')}}</mat-error>\n            </mat-form-field>\n            <mat-form-field>\n              <mat-label>Password</mat-label>\n              <input matInput\n                     formControlName=\"password\"\n                     placeholder=\"Password\"\n                     type=\"password\"\n                     autocomplete=\"off\"\n                     required />\n              <mat-error *ngIf=\"isFieldValid('password')\">{{getErrorMessage('password')}}</mat-error>\n            </mat-form-field>\n\n            <mat-form-field *ngIf=\"userClients\">\n              <mat-label>Select Client</mat-label>\n              <mat-select formControlName=\"selected_client\">\n                <mat-option\n                  *ngFor=\"let userClient of userClients\"\n                  [disabled]=\"!userClient?.is_enabled\"\n                  [value]=\"userClient?.client?.id\"\n                >\n                  {{ userClient?.client?.name }}\n                </mat-option>\n              </mat-select>\n            </mat-form-field>\n\n            <div class=\"alert alert-danger\" *ngIf=\"loginError\">\n              <p class=\"mb-0\">{{ loginError?.message }}</p>\n            </div>\n\n            <button mat-raised-button color=\"primary\" class=\"w-100\" type=\"submit\" [disabled]=\"isWorking\">\n              LOGIN\n            </button>\n\n            <div class=\"mt-2\" *ngIf=\"userConfig.showSocialLogin\">\n              <button class=\"w-100 google-button mb-2\"\n                      mat-raised-button type=\"button\"\n                      (click)=\"redirect('google')\">Google</button>\n\n              <button class=\"w-100 facebook-button\"\n                      mat-raised-button type=\"button\"\n                      (click)=\"redirect('facebook')\">Facebook</button>\n            </div>\n            <div class=\"mt-2 mb-4 text-center\"\n                 *ngIf=\"userConfig.showForgotPassword\">\n              <a href=\"javascript:;\" [routerLink]=\"['/forgot-password']\">Forgot password?</a>\n            </div>\n          </form>\n        </div>\n\n        <div class=\"mt-3 p-0 mr-0 ml-0\" *ngIf=\"userConfig.showSignup\">\n          <p>New to {{ userConfig.appName }}?</p>\n          <button mat-raised-button class=\"w-100\" color=\"accent\" type=\"button\"\n                  [routerLink]=\"['/signup']\">\n            Create an account\n          </button>\n        </div>\n      </mat-card>\n    </div>\n  </div>\n</div>\n", styles: ["#login-form-wrapper{margin-top:40px}#login-form-wrapper .branding-block{margin-bottom:60px}#login-form-wrapper .techlify-logo{height:40px;padding-right:10px;bottom:10px;position:relative}#login-form-wrapper .company-name{margin-bottom:0}#login-form-wrapper .google-button{background:#ce1d1d;color:#fff}#login-form-wrapper .facebook-button{background:#38388e;color:#fff}:host{width:100%}.white-box{background-color:#fff;padding:10px}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$4.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$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i7$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i7$3.MatError, selector: "mat-error", inputs: ["id"] }, { kind: "component", type: i7$3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i7$3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i9.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: "component", type: i8$3.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "component", type: i9$1.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i10$1.MatCard, selector: "mat-card", exportAs: ["matCard"] }, { kind: "directive", type: i1$5.RouterLink, selector: ":not(a):not(area)[routerLink]", inputs: ["queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1$5.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i7.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i7.DefaultLayoutGapDirective, selector: "  [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md],  [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md],  [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm],  [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i7.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }] });
 LoginComponent = __decorate([
     UntilDestroy()
 ], LoginComponent);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: LoginComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'login', template: "<div class=\"h-100 d-flex justify-content-center align-items-center w-100\" style=\"background: #fafafa;\">\n  <div class=\"row w-100\">\n    <div class=\"col-lg-4 col-md-6 col-sm-8 col-xs-10 col-12 mx-auto\">\n      <mat-card class=\"mb-3 mt-3 w-100\">\n        <header class=\"branding-block mb-0 mt-4\">\n          <div class=\"branding text-center\">\n            <a *ngIf=\"userConfig.appLogoUrl\" href=\"{{userConfig.appUrl}}\" target=\"_blank\">\n              <img class=\"techlify-logo d-inline-block\" [src]=\"userConfig.appLogoUrl\" alt=\"Logo\"/>\n            </a>\n          </div>\n          <div class=\"product-info text-center mt-2\">\n            <h3 class=\"product-name\">{{ userConfig.appName }}</h3>\n          </div>\n        </header>\n\n        <div id=\"login-form-wrapper\">\n          <h4 class=\"section-title text-center mt-4\">LOGIN</h4>\n          <form [formGroup]=\"loginForm\"\n                (ngSubmit)=\"login()\"\n                fxLayout=\"column\" fxLayoutAlign=\"start\" fxLayoutGap=\"10px\">\n            <mat-form-field>\n              <mat-label>Email</mat-label>\n              <input matInput\n                     formControlName=\"email\"\n                     placeholder=\"Email\"\n                     type=\"email\"\n                     autocomplete=\"off\"\n                     required />\n              <mat-error *ngIf=\"isFieldValid('email')\">{{getErrorMessage('email')}}</mat-error>\n            </mat-form-field>\n            <mat-form-field>\n              <mat-label>Password</mat-label>\n              <input matInput\n                     formControlName=\"password\"\n                     placeholder=\"Password\"\n                     type=\"password\"\n                     autocomplete=\"off\"\n                     required />\n              <mat-error *ngIf=\"isFieldValid('password')\">{{getErrorMessage('password')}}</mat-error>\n            </mat-form-field>\n\n            <div class=\"alert alert-danger\" *ngIf=\"loginError\">\n              <p class=\"mb-0\">{{ loginError?.message }}</p>\n            </div>\n\n            <button mat-raised-button color=\"primary\" class=\"w-100\" type=\"submit\" [disabled]=\"isWorking\">\n              LOGIN\n            </button>\n\n            <div class=\"mt-2\" *ngIf=\"userConfig.showSocialLogin\">\n              <button class=\"w-100 google-button mb-2\"\n                      mat-raised-button type=\"button\"\n                      (click)=\"redirect('google')\">Google</button>\n\n              <button class=\"w-100 facebook-button\"\n                      mat-raised-button type=\"button\"\n                      (click)=\"redirect('facebook')\">Facebook</button>\n            </div>\n            <div class=\"mt-2 mb-4 text-center\"\n                 *ngIf=\"userConfig.showForgotPassword\">\n              <a href=\"javascript:;\" [routerLink]=\"['/forgot-password']\">Forgot password?</a>\n            </div>\n          </form>\n        </div>\n\n        <div class=\"mt-3 p-0 mr-0 ml-0\" *ngIf=\"userConfig.showSignup\">\n          <p>New to {{ userConfig.appName }}?</p>\n          <button mat-raised-button class=\"w-100\" color=\"accent\" type=\"button\"\n                  [routerLink]=\"['/signup']\">\n            Create an account\n          </button>\n        </div>\n      </mat-card>\n    </div>\n  </div>\n</div>\n", styles: ["#login-form-wrapper{margin-top:40px}#login-form-wrapper .branding-block{margin-bottom:60px}#login-form-wrapper .techlify-logo{height:40px;padding-right:10px;bottom:10px;position:relative}#login-form-wrapper .company-name{margin-bottom:0}#login-form-wrapper .google-button{background:#ce1d1d;color:#fff}#login-form-wrapper .facebook-button{background:#38388e;color:#fff}:host{width:100%}.white-box{background-color:#fff;padding:10px}\n"] }]
+            args: [{ selector: 'login', template: "<div class=\"h-100 d-flex justify-content-center align-items-center w-100\" style=\"background: #fafafa;\">\n  <div class=\"row w-100\">\n    <div class=\"col-lg-4 col-md-6 col-sm-8 col-xs-10 col-12 mx-auto\">\n      <mat-card class=\"mb-3 mt-3 w-100\">\n        <header class=\"branding-block mb-0 mt-4\">\n          <div class=\"branding text-center\">\n            <a *ngIf=\"userConfig.appLogoUrl\" href=\"{{userConfig.appUrl}}\" target=\"_blank\">\n              <img class=\"techlify-logo d-inline-block\" [src]=\"userConfig.appLogoUrl\" alt=\"Logo\"/>\n            </a>\n          </div>\n          <div class=\"product-info text-center mt-2\">\n            <h3 class=\"product-name\">{{ userConfig.appName }}</h3>\n          </div>\n        </header>\n\n        <div id=\"login-form-wrapper\">\n          <h4 class=\"section-title text-center mt-4\">LOGIN</h4>\n          <form [formGroup]=\"loginForm\"\n                (ngSubmit)=\"login()\"\n                fxLayout=\"column\" fxLayoutAlign=\"start\" fxLayoutGap=\"10px\">\n            <mat-form-field>\n              <mat-label>Email</mat-label>\n              <input matInput\n                     formControlName=\"email\"\n                     placeholder=\"Email\"\n                     type=\"email\"\n                     autocomplete=\"off\"\n                     required />\n              <mat-error *ngIf=\"isFieldValid('email')\">{{getErrorMessage('email')}}</mat-error>\n            </mat-form-field>\n            <mat-form-field>\n              <mat-label>Password</mat-label>\n              <input matInput\n                     formControlName=\"password\"\n                     placeholder=\"Password\"\n                     type=\"password\"\n                     autocomplete=\"off\"\n                     required />\n              <mat-error *ngIf=\"isFieldValid('password')\">{{getErrorMessage('password')}}</mat-error>\n            </mat-form-field>\n\n            <mat-form-field *ngIf=\"userClients\">\n              <mat-label>Select Client</mat-label>\n              <mat-select formControlName=\"selected_client\">\n                <mat-option\n                  *ngFor=\"let userClient of userClients\"\n                  [disabled]=\"!userClient?.is_enabled\"\n                  [value]=\"userClient?.client?.id\"\n                >\n                  {{ userClient?.client?.name }}\n                </mat-option>\n              </mat-select>\n            </mat-form-field>\n\n            <div class=\"alert alert-danger\" *ngIf=\"loginError\">\n              <p class=\"mb-0\">{{ loginError?.message }}</p>\n            </div>\n\n            <button mat-raised-button color=\"primary\" class=\"w-100\" type=\"submit\" [disabled]=\"isWorking\">\n              LOGIN\n            </button>\n\n            <div class=\"mt-2\" *ngIf=\"userConfig.showSocialLogin\">\n              <button class=\"w-100 google-button mb-2\"\n                      mat-raised-button type=\"button\"\n                      (click)=\"redirect('google')\">Google</button>\n\n              <button class=\"w-100 facebook-button\"\n                      mat-raised-button type=\"button\"\n                      (click)=\"redirect('facebook')\">Facebook</button>\n            </div>\n            <div class=\"mt-2 mb-4 text-center\"\n                 *ngIf=\"userConfig.showForgotPassword\">\n              <a href=\"javascript:;\" [routerLink]=\"['/forgot-password']\">Forgot password?</a>\n            </div>\n          </form>\n        </div>\n\n        <div class=\"mt-3 p-0 mr-0 ml-0\" *ngIf=\"userConfig.showSignup\">\n          <p>New to {{ userConfig.appName }}?</p>\n          <button mat-raised-button class=\"w-100\" color=\"accent\" type=\"button\"\n                  [routerLink]=\"['/signup']\">\n            Create an account\n          </button>\n        </div>\n      </mat-card>\n    </div>\n  </div>\n</div>\n", styles: ["#login-form-wrapper{margin-top:40px}#login-form-wrapper .branding-block{margin-bottom:60px}#login-form-wrapper .techlify-logo{height:40px;padding-right:10px;bottom:10px;position:relative}#login-form-wrapper .company-name{margin-bottom:0}#login-form-wrapper .google-button{background:#ce1d1d;color:#fff}#login-form-wrapper .facebook-button{background:#38388e;color:#fff}:host{width:100%}.white-box{background-color:#fff;padding:10px}\n"] }]
         }], ctorParameters: function () { return [{ type: HttpService }, { type: AlertService }, { type: i1$5.Router }, { type: AuthenticationService }, { type: ConfigService }, { type: CurrentUserService }, { type: ErrorHandlerService }, { type: StorageService }, { type: CredentialsService }, { type: i1$4.UntypedFormBuilder }, { type: FormValidatorService }, { type: i1$5.ActivatedRoute }, { type: UserConfigService }]; } });
 
 const routes$7 = [