slick-components 4.5.21 → 5.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -53,7 +53,7 @@ class SlickInitService {
53
53
  SlickInitService.getParams().errorLog = errorLog;
54
54
  }
55
55
  }
56
- SlickInitService.version = "4.5.21";
56
+ SlickInitService.version = "5.0.1";
57
57
  /** @nocollapse */ SlickInitService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SlickInitService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
58
58
  /** @nocollapse */ SlickInitService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SlickInitService });
59
59
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SlickInitService, decorators: [{
@@ -583,7 +583,7 @@ class SlickSearchBarComponent {
583
583
  useExisting: forwardRef((() => SlickSearchBarComponent)),
584
584
  multi: true
585
585
  }
586
- ], viewQueries: [{ propertyName: "slickSearchTextBoxRef", first: true, predicate: ["slickSearchTextBoxRef"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"slick-search-bar border d-flex flex-fill align-items-center bg-white\">\r\n\t<div *ngIf=\"showSearchIcon\" class=\"slick-search-bar_icon ml-3 p-0\"><i [ngClass]=\"icon\"></i></div>\r\n\t<div *ngIf=\"!showSearchIcon\" class=\"ml-3\"></div>\r\n\t<input #slickSearchTextBoxRef type=\"text\" class=\"form-control ml-2\" [(ngModel)]=\"searchText\" (keydown)=\"onKeyUp()\" [placeholder]=\"placeholder\" />\r\n\t<div *ngIf=\"(showAddButton || showEditButton)\" class=\"d-flex\">\r\n\t\t<div *ngIf=\"showAddButton\" class=\"slick-search-bar_add-button mr-2\">\r\n\t\t\t<div *ngIf=\"disableAddButton\"><i class=\"far fa-plus\"></i></div>\r\n\t\t\t<a href=\"#\" *ngIf=\"!disableAddButton\" (click)=\"onAddClicked(); false;\"><i class=\"far fa-plus\"></i></a>\r\n\t\t</div>\r\n\t\t<div *ngIf=\"showEditButton\" class=\"slick-search-bar_edit-button mr-2\">\r\n\t\t\t<div *ngIf=\"disableEditButton\"><i class=\"far fa-pencil\"></i></div>\r\n\t\t\t<a href=\"#\" *ngIf=\"!disableEditButton\" (click)=\"onEditClicked(); false;\"><i class=\"far fa-pencil\"></i></a>\r\n\t\t</div>\r\n\t</div>\r\n\t<div style=\"width: 10px\"></div>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
586
+ ], viewQueries: [{ propertyName: "slickSearchTextBoxRef", first: true, predicate: ["slickSearchTextBoxRef"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"slick-search-bar border d-flex flex-fill align-items-center bg-white\">\r\n\t<div *ngIf=\"showSearchIcon\" class=\"slick-search-bar_icon ms-3 p-0\"><i [ngClass]=\"icon\"></i></div>\r\n\t<div *ngIf=\"!showSearchIcon\" class=\"ms-3\"></div>\r\n\t<input #slickSearchTextBoxRef type=\"text\" class=\"form-control ms-2\" [(ngModel)]=\"searchText\" (keydown)=\"onKeyUp()\" [placeholder]=\"placeholder\" />\r\n\t<div *ngIf=\"(showAddButton || showEditButton)\" class=\"d-flex\">\r\n\t\t<div *ngIf=\"showAddButton\" class=\"slick-search-bar_add-button me-2\">\r\n\t\t\t<div *ngIf=\"disableAddButton\"><i class=\"far fa-plus\"></i></div>\r\n\t\t\t<a href=\"#\" *ngIf=\"!disableAddButton\" (click)=\"onAddClicked(); false;\"><i class=\"far fa-plus\"></i></a>\r\n\t\t</div>\r\n\t\t<div *ngIf=\"showEditButton\" class=\"slick-search-bar_edit-button me-2\">\r\n\t\t\t<div *ngIf=\"disableEditButton\"><i class=\"far fa-pencil\"></i></div>\r\n\t\t\t<a href=\"#\" *ngIf=\"!disableEditButton\" (click)=\"onEditClicked(); false;\"><i class=\"far fa-pencil\"></i></a>\r\n\t\t</div>\r\n\t</div>\r\n\t<div style=\"width: 10px\"></div>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
587
587
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SlickSearchBarComponent, decorators: [{
588
588
  type: Component,
589
589
  args: [{ selector: "slick-search-bar", providers: [
@@ -592,7 +592,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImpor
592
592
  useExisting: forwardRef((() => SlickSearchBarComponent)),
593
593
  multi: true
594
594
  }
595
- ], template: "<div class=\"slick-search-bar border d-flex flex-fill align-items-center bg-white\">\r\n\t<div *ngIf=\"showSearchIcon\" class=\"slick-search-bar_icon ml-3 p-0\"><i [ngClass]=\"icon\"></i></div>\r\n\t<div *ngIf=\"!showSearchIcon\" class=\"ml-3\"></div>\r\n\t<input #slickSearchTextBoxRef type=\"text\" class=\"form-control ml-2\" [(ngModel)]=\"searchText\" (keydown)=\"onKeyUp()\" [placeholder]=\"placeholder\" />\r\n\t<div *ngIf=\"(showAddButton || showEditButton)\" class=\"d-flex\">\r\n\t\t<div *ngIf=\"showAddButton\" class=\"slick-search-bar_add-button mr-2\">\r\n\t\t\t<div *ngIf=\"disableAddButton\"><i class=\"far fa-plus\"></i></div>\r\n\t\t\t<a href=\"#\" *ngIf=\"!disableAddButton\" (click)=\"onAddClicked(); false;\"><i class=\"far fa-plus\"></i></a>\r\n\t\t</div>\r\n\t\t<div *ngIf=\"showEditButton\" class=\"slick-search-bar_edit-button mr-2\">\r\n\t\t\t<div *ngIf=\"disableEditButton\"><i class=\"far fa-pencil\"></i></div>\r\n\t\t\t<a href=\"#\" *ngIf=\"!disableEditButton\" (click)=\"onEditClicked(); false;\"><i class=\"far fa-pencil\"></i></a>\r\n\t\t</div>\r\n\t</div>\r\n\t<div style=\"width: 10px\"></div>\r\n</div>\r\n" }]
595
+ ], template: "<div class=\"slick-search-bar border d-flex flex-fill align-items-center bg-white\">\r\n\t<div *ngIf=\"showSearchIcon\" class=\"slick-search-bar_icon ms-3 p-0\"><i [ngClass]=\"icon\"></i></div>\r\n\t<div *ngIf=\"!showSearchIcon\" class=\"ms-3\"></div>\r\n\t<input #slickSearchTextBoxRef type=\"text\" class=\"form-control ms-2\" [(ngModel)]=\"searchText\" (keydown)=\"onKeyUp()\" [placeholder]=\"placeholder\" />\r\n\t<div *ngIf=\"(showAddButton || showEditButton)\" class=\"d-flex\">\r\n\t\t<div *ngIf=\"showAddButton\" class=\"slick-search-bar_add-button me-2\">\r\n\t\t\t<div *ngIf=\"disableAddButton\"><i class=\"far fa-plus\"></i></div>\r\n\t\t\t<a href=\"#\" *ngIf=\"!disableAddButton\" (click)=\"onAddClicked(); false;\"><i class=\"far fa-plus\"></i></a>\r\n\t\t</div>\r\n\t\t<div *ngIf=\"showEditButton\" class=\"slick-search-bar_edit-button me-2\">\r\n\t\t\t<div *ngIf=\"disableEditButton\"><i class=\"far fa-pencil\"></i></div>\r\n\t\t\t<a href=\"#\" *ngIf=\"!disableEditButton\" (click)=\"onEditClicked(); false;\"><i class=\"far fa-pencil\"></i></a>\r\n\t\t</div>\r\n\t</div>\r\n\t<div style=\"width: 10px\"></div>\r\n</div>\r\n" }]
596
596
  }], ctorParameters: function () { return []; }, propDecorators: { flex: [{
597
597
  type: HostBinding,
598
598
  args: ['style.flex']
@@ -1032,7 +1032,7 @@ class SlickAutoCompleteComponent {
1032
1032
  useExisting: forwardRef((() => SlickAutoCompleteComponent)),
1033
1033
  multi: true
1034
1034
  }
1035
- ], queries: [{ propertyName: "listItemTemplateRef", first: true, predicate: SlickAutoCompleteListItemTemplateDirective, descendants: true, static: true }], viewQueries: [{ propertyName: "autoCompleteRef", first: true, predicate: ["autoCompleteRef"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<div #autoCompleteRef id=\"slick-auto-complete_{{uuid}}\" class='slick-auto-complete dropdown-menu' [style.width]=\"width\" [style.minWidth]=\"width\" [style.visibility]=\"(expanded === true) ? 'visible' : 'hidden'\" [style.opacity]=\"(expanded === true) ? '1' : '0'\" [style.max-height]=\"listHeight\" [style.left]=\"left\" [style.top]=\"top\">\r\n\t<div *ngIf=\"loading\" style=\"font-size: .8rem\" class=\"ml-3 py-2\">Loading...</div>\r\n\t<div *ngIf=\"!loading && items?.length === 0\" style=\"font-size: .8rem\" class=\"ml-3\">\r\n\t\tNo items found\r\n\t</div>\r\n\t<div *ngIf=\"!loading && items?.length > 0\">\r\n\t\t<div *ngFor=\"let item of items; let index = index;\" (click)=\"onItemClick(index)\" [class.card-header]=\"selectedIndex === index\" class=\"dropdown-item\">\r\n\t\t\t<ng-container *ngTemplateOutlet=\"listItemTemplateRef.template, context: { $implicit: item, index: index }\">\r\n\t\t\t</ng-container>\r\n\t\t</div>\r\n\t</div>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
1035
+ ], queries: [{ propertyName: "listItemTemplateRef", first: true, predicate: SlickAutoCompleteListItemTemplateDirective, descendants: true, static: true }], viewQueries: [{ propertyName: "autoCompleteRef", first: true, predicate: ["autoCompleteRef"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<div #autoCompleteRef id=\"slick-auto-complete_{{uuid}}\" class='slick-auto-complete dropdown-menu' [style.width]=\"width\" [style.minWidth]=\"width\" [style.visibility]=\"(expanded === true) ? 'visible' : 'hidden'\" [style.opacity]=\"(expanded === true) ? '1' : '0'\" [style.max-height]=\"listHeight\" [style.left]=\"left\" [style.top]=\"top\">\r\n\t<div *ngIf=\"loading\" style=\"font-size: .8rem\" class=\"ms-3 py-2\">Loading...</div>\r\n\t<div *ngIf=\"!loading && items?.length === 0\" style=\"font-size: .8rem\" class=\"ms-3\">\r\n\t\tNo items found\r\n\t</div>\r\n\t<div *ngIf=\"!loading && items?.length > 0\">\r\n\t\t<div *ngFor=\"let item of items; let index = index;\" (click)=\"onItemClick(index)\" [class.card-header]=\"selectedIndex === index\" class=\"dropdown-item\">\r\n\t\t\t<ng-container *ngTemplateOutlet=\"listItemTemplateRef.template, context: { $implicit: item, index: index }\">\r\n\t\t\t</ng-container>\r\n\t\t</div>\r\n\t</div>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
1036
1036
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SlickAutoCompleteComponent, decorators: [{
1037
1037
  type: Component,
1038
1038
  args: [{ selector: 'slick-auto-complete', providers: [
@@ -1041,7 +1041,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImpor
1041
1041
  useExisting: forwardRef((() => SlickAutoCompleteComponent)),
1042
1042
  multi: true
1043
1043
  }
1044
- ], template: "<div #autoCompleteRef id=\"slick-auto-complete_{{uuid}}\" class='slick-auto-complete dropdown-menu' [style.width]=\"width\" [style.minWidth]=\"width\" [style.visibility]=\"(expanded === true) ? 'visible' : 'hidden'\" [style.opacity]=\"(expanded === true) ? '1' : '0'\" [style.max-height]=\"listHeight\" [style.left]=\"left\" [style.top]=\"top\">\r\n\t<div *ngIf=\"loading\" style=\"font-size: .8rem\" class=\"ml-3 py-2\">Loading...</div>\r\n\t<div *ngIf=\"!loading && items?.length === 0\" style=\"font-size: .8rem\" class=\"ml-3\">\r\n\t\tNo items found\r\n\t</div>\r\n\t<div *ngIf=\"!loading && items?.length > 0\">\r\n\t\t<div *ngFor=\"let item of items; let index = index;\" (click)=\"onItemClick(index)\" [class.card-header]=\"selectedIndex === index\" class=\"dropdown-item\">\r\n\t\t\t<ng-container *ngTemplateOutlet=\"listItemTemplateRef.template, context: { $implicit: item, index: index }\">\r\n\t\t\t</ng-container>\r\n\t\t</div>\r\n\t</div>\r\n</div>\r\n" }]
1044
+ ], template: "<div #autoCompleteRef id=\"slick-auto-complete_{{uuid}}\" class='slick-auto-complete dropdown-menu' [style.width]=\"width\" [style.minWidth]=\"width\" [style.visibility]=\"(expanded === true) ? 'visible' : 'hidden'\" [style.opacity]=\"(expanded === true) ? '1' : '0'\" [style.max-height]=\"listHeight\" [style.left]=\"left\" [style.top]=\"top\">\r\n\t<div *ngIf=\"loading\" style=\"font-size: .8rem\" class=\"ms-3 py-2\">Loading...</div>\r\n\t<div *ngIf=\"!loading && items?.length === 0\" style=\"font-size: .8rem\" class=\"ms-3\">\r\n\t\tNo items found\r\n\t</div>\r\n\t<div *ngIf=\"!loading && items?.length > 0\">\r\n\t\t<div *ngFor=\"let item of items; let index = index;\" (click)=\"onItemClick(index)\" [class.card-header]=\"selectedIndex === index\" class=\"dropdown-item\">\r\n\t\t\t<ng-container *ngTemplateOutlet=\"listItemTemplateRef.template, context: { $implicit: item, index: index }\">\r\n\t\t\t</ng-container>\r\n\t\t</div>\r\n\t</div>\r\n</div>\r\n" }]
1045
1045
  }], ctorParameters: function () { return [{ type: SlickFunctionLockService }]; }, propDecorators: { inputRef: [{
1046
1046
  type: Input,
1047
1047
  args: ["inputRef"]
@@ -1937,10 +1937,10 @@ class SlickDialogComponent {
1937
1937
  }
1938
1938
  }
1939
1939
  /** @nocollapse */ SlickDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SlickDialogComponent, deps: [{ token: SlickDialogService }], target: i0.ɵɵFactoryTarget.Component });
1940
- /** @nocollapse */ SlickDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: SlickDialogComponent, selector: "slick-dialog", inputs: { draggable: "draggable", resizable: "resizable", minimizable: "minimizable", header: "header", showHeader: "showHeader", noPadding: "noPadding", top: "top", width: "width", height: "height", maxHeight: "maxHeight", cssClass: "cssClass", key: "key", showOverlay: "showOverlay", disableScrollbar: "disableScrollbar" }, outputs: { onClose: "onClose" }, providers: [SlickDialogService], viewQueries: [{ propertyName: "containerRef", first: true, predicate: ["containerRef"], descendants: true }, { propertyName: "dialogRef", first: true, predicate: ["dialogRef"], descendants: true }, { propertyName: "headerRef", first: true, predicate: ["headerRef"], descendants: true }, { propertyName: "footerRef", first: true, predicate: ["footerRef"], descendants: true }, { propertyName: "dialogWrapper", first: true, predicate: ["dialogWrapper"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div #containerRef class=\"slick-dialog-container\" *ngIf=\"showDialog_internal === true\" [hidden]=\"!isDialogVisible\" [style.zIndex]=\"zIndex\" #bounds>\r\n <div #dialogWrapper class=\"position-absolute slick-dialog-z-index d-inline-block\" [ngClass]=\"{'isMinimized' : isMinimized }\" (endOffset)=\"onMoveEnd($event)\" [position]=\"position\" [ngDraggable]=\"draggable && !isMinimized\" [bounds]=\"bounds\" [handle]=\"draggingHandle\" [inBounds]=\"inBounds\" [style.top.px]=\"top\">\r\n <div #dialogRef (rzStop)=\"onResizeStop($event)\" [ngResizable]=\"resizable && !isMinimized\" class=\"slick-dialog modal-content d-flex flex-column drag-block-handle {{cssClass}}\" [style.height]=\"height === 0 ? '100%' : height + 'px'\" [style.width.px]=\"width\" [style.max-height.px]=\"maxHeight\">\r\n <div [class.slick-dialog-draggingHangle]=\"draggable && !isMinimized\" #draggingHandle>\r\n <div #headerRef class=\"slick-dialog_header modal-header py-0\" *ngIf=\"showHeader === true\">\r\n <div class=\"header-left\">{{header}}</div>\r\n <div class=\"header-right\" *ngIf=\"minimizable && !isMinimized\" (mousedown)=\"onDialogMinimize($event)\" style=\"width: 28px;\"><i class=\"far fa-window-minimize\"></i></div>\r\n <div class=\"header-right\" *ngIf=\"minimizable && !isMinimized\" (mousedown)=\"toggleFullSize($event)\" style=\"width: 28px;\"><i *ngIf=\"!isMaximized\" class=\"far fa-window-maximize\"></i><i *ngIf=\"isMaximized\" class=\"far fa-window-restore\"></i></div>\r\n <div class=\"header-right\" *ngIf=\"minimizable && isMinimized\" (mousedown)=\"onDialogMaximize($event)\" style=\"width: 28px;\"><i class=\"far fa-window-restore\"></i></div>\r\n <div class=\"header-right\" *ngIf=\"!isMinimized\" (mousedown)=\"onDialogClose($event)\" style=\"width: 28px;\"><i class=\"far fa-times\"></i></div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!isMinimized\" [style.visibility]=\"(isBodyVisible === true) ? 'visible' : 'hidden'\" style=\"overflow-y: auto\" class=\"slick-dialog_body modal-body flex-fill\" [ngClass]=\"{'disable_scrollbar' : disableScrollbar === true, 'p-0': noPadding === true }\"><ng-content></ng-content></div>\r\n <div #footerRef [ngClass]=\"{'slick-dialog_footer modal-footer': hasFooter === true }\" *ngIf=\"!isMinimized\"><ng-content select=\"slick-dialog-footer\"></ng-content></div>\r\n </div>\r\n </div>\r\n\r\n</div>", styles: [".ng-resizable{position:relative}.ng-resizable-handle{position:absolute;font-size:.1px;display:block;touch-action:none}.ng-resizable-handle.ng-resizable-e{cursor:e-resize;width:7px;right:-5px;height:100%;top:0}.ng-resizable-handle.ng-resizable-w{cursor:w-resize;width:7px;left:-5px;height:100%;top:0}.ng-resizable-handle.ng-resizable-s{cursor:s-resize;height:7px;bottom:-5px;width:100%;left:0}.ng-resizable-handle.ng-resizable-n{cursor:n-resize;height:7px;top:-5px;width:100%;left:0}.ng-resizable-handle.ng-resizable-se{cursor:se-resize;width:8px;height:8px;right:4px;bottom:4px}.ng-resizable-handle.ng-resizable-sw{cursor:sw-resize;width:12px;height:12px;left:1px;bottom:1px}.ng-resizable-handle.ng-resizable-ne{cursor:ne-resize;width:12px;height:12px;right:1px;top:1px}.ng-resizable-handle.ng-resizable-nw{cursor:nw-resize;width:12px;height:12px;left:1px;top:1px}.ng-resizable-diagonal{box-sizing:border-box;width:0;height:0;border-bottom:8px solid #aaa;border-left:8px solid transparent}.slick-dialog-z-index.isMinimized{-webkit-transition-property:all;-webkit-transition-duration:.3s;-webkit-transition-timing-function:linear;transition-property:all;transition-duration:.3s;transition-timing-function:linear}.isMinimized .header-left{display:inline-block;width:calc(100% - 40px);padding-left:15px;vertical-align:top;font-weight:700;text-overflow:ellipsis;overflow:hidden;width:200px;white-space:nowrap}.disable_scrollbar{overflow:hidden!important;overflow-x:hidden;overflow-y:hidden;padding:10px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.AngularDraggableDirective, selector: "[ngDraggable]", inputs: ["outOfBounds", "gridSize", "inBounds", "trackPosition", "scale", "preventDefaultEvent", "position", "lockAxis", "zIndex", "ngDraggable", "bounds", "handle", "zIndexMoving"], outputs: ["started", "stopped", "edge", "movingOffset", "endOffset"], exportAs: ["ngDraggable"] }, { kind: "directive", type: i3.AngularResizableDirective, selector: "[ngResizable]", inputs: ["rzHandles", "rzAspectRatio", "rzContainment", "rzGrid", "rzMinWidth", "rzMinHeight", "rzMaxWidth", "rzMaxHeight", "preventDefaultEvent", "ngResizable"], outputs: ["rzStart", "rzResizing", "rzStop"], exportAs: ["ngResizable"] }] });
1940
+ /** @nocollapse */ SlickDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: SlickDialogComponent, selector: "slick-dialog", inputs: { draggable: "draggable", resizable: "resizable", minimizable: "minimizable", header: "header", showHeader: "showHeader", noPadding: "noPadding", top: "top", width: "width", height: "height", maxHeight: "maxHeight", cssClass: "cssClass", key: "key", showOverlay: "showOverlay", disableScrollbar: "disableScrollbar" }, outputs: { onClose: "onClose" }, providers: [SlickDialogService], viewQueries: [{ propertyName: "containerRef", first: true, predicate: ["containerRef"], descendants: true }, { propertyName: "dialogRef", first: true, predicate: ["dialogRef"], descendants: true }, { propertyName: "headerRef", first: true, predicate: ["headerRef"], descendants: true }, { propertyName: "footerRef", first: true, predicate: ["footerRef"], descendants: true }, { propertyName: "dialogWrapper", first: true, predicate: ["dialogWrapper"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div #containerRef class=\"slick-dialog-container modal\" *ngIf=\"showDialog_internal === true\" [hidden]=\"!isDialogVisible\" [style.zIndex]=\"zIndex\" #bounds>\r\n <div #dialogWrapper class=\"position-absolute slick-dialog-z-index d-inline-block\" [ngClass]=\"{'isMinimized' : isMinimized }\" (endOffset)=\"onMoveEnd($event)\" [position]=\"position\" [ngDraggable]=\"draggable && !isMinimized\" [bounds]=\"bounds\" [handle]=\"draggingHandle\" [inBounds]=\"inBounds\" [style.top.px]=\"top\">\r\n <div #dialogRef (rzStop)=\"onResizeStop($event)\" [ngResizable]=\"resizable && !isMinimized\" class=\"slick-dialog modal-content d-flex flex-column drag-block-handle {{cssClass}}\" [style.height]=\"height === 0 ? '100%' : height + 'px'\" [style.width.px]=\"width\" [style.max-height.px]=\"maxHeight\">\r\n <div [class.slick-dialog-draggingHangle]=\"draggable && !isMinimized\" #draggingHandle>\r\n <div #headerRef class=\"slick-dialog_header modal-header py-0\" *ngIf=\"showHeader === true\">\r\n <div class=\"header-left\">{{header}}</div>\r\n <div class=\"header-right\" *ngIf=\"minimizable && !isMinimized\" (mousedown)=\"onDialogMinimize($event)\" style=\"width: 28px;\"><i class=\"far fa-window-minimize\"></i></div>\r\n <div class=\"header-right\" *ngIf=\"minimizable && !isMinimized\" (mousedown)=\"toggleFullSize($event)\" style=\"width: 28px;\"><i *ngIf=\"!isMaximized\" class=\"far fa-window-maximize\"></i><i *ngIf=\"isMaximized\" class=\"far fa-window-restore\"></i></div>\r\n <div class=\"header-right\" *ngIf=\"minimizable && isMinimized\" (mousedown)=\"onDialogMaximize($event)\" style=\"width: 28px;\"><i class=\"far fa-window-restore\"></i></div>\r\n <div class=\"header-right\" *ngIf=\"!isMinimized\" (mousedown)=\"onDialogClose($event)\" style=\"width: 28px;\"><i class=\"far fa-times\"></i></div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!isMinimized\" [style.visibility]=\"(isBodyVisible === true) ? 'visible' : 'hidden'\" style=\"overflow-y: auto\" class=\"slick-dialog_body modal-body flex-fill\" [ngClass]=\"{'disable_scrollbar' : disableScrollbar === true, 'p-0': noPadding === true }\"><ng-content></ng-content></div>\r\n <div #footerRef [ngClass]=\"{'slick-dialog_footer modal-footer': hasFooter === true }\" *ngIf=\"!isMinimized\"><ng-content select=\"slick-dialog-footer\"></ng-content></div>\r\n </div>\r\n </div>\r\n\r\n</div>", styles: [".ng-resizable{position:relative}.ng-resizable-handle{position:absolute;font-size:.1px;display:block;touch-action:none}.ng-resizable-handle.ng-resizable-e{cursor:e-resize;width:7px;right:-5px;height:100%;top:0}.ng-resizable-handle.ng-resizable-w{cursor:w-resize;width:7px;left:-5px;height:100%;top:0}.ng-resizable-handle.ng-resizable-s{cursor:s-resize;height:7px;bottom:-5px;width:100%;left:0}.ng-resizable-handle.ng-resizable-n{cursor:n-resize;height:7px;top:-5px;width:100%;left:0}.ng-resizable-handle.ng-resizable-se{cursor:se-resize;width:8px;height:8px;right:4px;bottom:4px}.ng-resizable-handle.ng-resizable-sw{cursor:sw-resize;width:12px;height:12px;left:1px;bottom:1px}.ng-resizable-handle.ng-resizable-ne{cursor:ne-resize;width:12px;height:12px;right:1px;top:1px}.ng-resizable-handle.ng-resizable-nw{cursor:nw-resize;width:12px;height:12px;left:1px;top:1px}.ng-resizable-diagonal{box-sizing:border-box;width:0;height:0;border-bottom:8px solid #aaa;border-left:8px solid transparent}.slick-dialog-z-index.isMinimized{-webkit-transition-property:all;-webkit-transition-duration:.3s;-webkit-transition-timing-function:linear;transition-property:all;transition-duration:.3s;transition-timing-function:linear}.isMinimized .header-left{display:inline-block;width:calc(100% - 40px);padding-left:15px;vertical-align:top;font-weight:700;text-overflow:ellipsis;overflow:hidden;width:200px;white-space:nowrap}.disable_scrollbar{overflow:hidden!important;overflow-x:hidden;overflow-y:hidden;padding:10px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.AngularDraggableDirective, selector: "[ngDraggable]", inputs: ["outOfBounds", "gridSize", "inBounds", "trackPosition", "scale", "preventDefaultEvent", "position", "lockAxis", "zIndex", "ngDraggable", "bounds", "handle", "zIndexMoving"], outputs: ["started", "stopped", "edge", "movingOffset", "endOffset"], exportAs: ["ngDraggable"] }, { kind: "directive", type: i3.AngularResizableDirective, selector: "[ngResizable]", inputs: ["rzHandles", "rzAspectRatio", "rzContainment", "rzGrid", "rzMinWidth", "rzMinHeight", "rzMaxWidth", "rzMaxHeight", "preventDefaultEvent", "ngResizable"], outputs: ["rzStart", "rzResizing", "rzStop"], exportAs: ["ngResizable"] }] });
1941
1941
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SlickDialogComponent, decorators: [{
1942
1942
  type: Component,
1943
- args: [{ selector: 'slick-dialog', providers: [SlickDialogService], template: "<div #containerRef class=\"slick-dialog-container\" *ngIf=\"showDialog_internal === true\" [hidden]=\"!isDialogVisible\" [style.zIndex]=\"zIndex\" #bounds>\r\n <div #dialogWrapper class=\"position-absolute slick-dialog-z-index d-inline-block\" [ngClass]=\"{'isMinimized' : isMinimized }\" (endOffset)=\"onMoveEnd($event)\" [position]=\"position\" [ngDraggable]=\"draggable && !isMinimized\" [bounds]=\"bounds\" [handle]=\"draggingHandle\" [inBounds]=\"inBounds\" [style.top.px]=\"top\">\r\n <div #dialogRef (rzStop)=\"onResizeStop($event)\" [ngResizable]=\"resizable && !isMinimized\" class=\"slick-dialog modal-content d-flex flex-column drag-block-handle {{cssClass}}\" [style.height]=\"height === 0 ? '100%' : height + 'px'\" [style.width.px]=\"width\" [style.max-height.px]=\"maxHeight\">\r\n <div [class.slick-dialog-draggingHangle]=\"draggable && !isMinimized\" #draggingHandle>\r\n <div #headerRef class=\"slick-dialog_header modal-header py-0\" *ngIf=\"showHeader === true\">\r\n <div class=\"header-left\">{{header}}</div>\r\n <div class=\"header-right\" *ngIf=\"minimizable && !isMinimized\" (mousedown)=\"onDialogMinimize($event)\" style=\"width: 28px;\"><i class=\"far fa-window-minimize\"></i></div>\r\n <div class=\"header-right\" *ngIf=\"minimizable && !isMinimized\" (mousedown)=\"toggleFullSize($event)\" style=\"width: 28px;\"><i *ngIf=\"!isMaximized\" class=\"far fa-window-maximize\"></i><i *ngIf=\"isMaximized\" class=\"far fa-window-restore\"></i></div>\r\n <div class=\"header-right\" *ngIf=\"minimizable && isMinimized\" (mousedown)=\"onDialogMaximize($event)\" style=\"width: 28px;\"><i class=\"far fa-window-restore\"></i></div>\r\n <div class=\"header-right\" *ngIf=\"!isMinimized\" (mousedown)=\"onDialogClose($event)\" style=\"width: 28px;\"><i class=\"far fa-times\"></i></div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!isMinimized\" [style.visibility]=\"(isBodyVisible === true) ? 'visible' : 'hidden'\" style=\"overflow-y: auto\" class=\"slick-dialog_body modal-body flex-fill\" [ngClass]=\"{'disable_scrollbar' : disableScrollbar === true, 'p-0': noPadding === true }\"><ng-content></ng-content></div>\r\n <div #footerRef [ngClass]=\"{'slick-dialog_footer modal-footer': hasFooter === true }\" *ngIf=\"!isMinimized\"><ng-content select=\"slick-dialog-footer\"></ng-content></div>\r\n </div>\r\n </div>\r\n\r\n</div>", styles: [".ng-resizable{position:relative}.ng-resizable-handle{position:absolute;font-size:.1px;display:block;touch-action:none}.ng-resizable-handle.ng-resizable-e{cursor:e-resize;width:7px;right:-5px;height:100%;top:0}.ng-resizable-handle.ng-resizable-w{cursor:w-resize;width:7px;left:-5px;height:100%;top:0}.ng-resizable-handle.ng-resizable-s{cursor:s-resize;height:7px;bottom:-5px;width:100%;left:0}.ng-resizable-handle.ng-resizable-n{cursor:n-resize;height:7px;top:-5px;width:100%;left:0}.ng-resizable-handle.ng-resizable-se{cursor:se-resize;width:8px;height:8px;right:4px;bottom:4px}.ng-resizable-handle.ng-resizable-sw{cursor:sw-resize;width:12px;height:12px;left:1px;bottom:1px}.ng-resizable-handle.ng-resizable-ne{cursor:ne-resize;width:12px;height:12px;right:1px;top:1px}.ng-resizable-handle.ng-resizable-nw{cursor:nw-resize;width:12px;height:12px;left:1px;top:1px}.ng-resizable-diagonal{box-sizing:border-box;width:0;height:0;border-bottom:8px solid #aaa;border-left:8px solid transparent}.slick-dialog-z-index.isMinimized{-webkit-transition-property:all;-webkit-transition-duration:.3s;-webkit-transition-timing-function:linear;transition-property:all;transition-duration:.3s;transition-timing-function:linear}.isMinimized .header-left{display:inline-block;width:calc(100% - 40px);padding-left:15px;vertical-align:top;font-weight:700;text-overflow:ellipsis;overflow:hidden;width:200px;white-space:nowrap}.disable_scrollbar{overflow:hidden!important;overflow-x:hidden;overflow-y:hidden;padding:10px}\n"] }]
1943
+ args: [{ selector: 'slick-dialog', providers: [SlickDialogService], template: "<div #containerRef class=\"slick-dialog-container modal\" *ngIf=\"showDialog_internal === true\" [hidden]=\"!isDialogVisible\" [style.zIndex]=\"zIndex\" #bounds>\r\n <div #dialogWrapper class=\"position-absolute slick-dialog-z-index d-inline-block\" [ngClass]=\"{'isMinimized' : isMinimized }\" (endOffset)=\"onMoveEnd($event)\" [position]=\"position\" [ngDraggable]=\"draggable && !isMinimized\" [bounds]=\"bounds\" [handle]=\"draggingHandle\" [inBounds]=\"inBounds\" [style.top.px]=\"top\">\r\n <div #dialogRef (rzStop)=\"onResizeStop($event)\" [ngResizable]=\"resizable && !isMinimized\" class=\"slick-dialog modal-content d-flex flex-column drag-block-handle {{cssClass}}\" [style.height]=\"height === 0 ? '100%' : height + 'px'\" [style.width.px]=\"width\" [style.max-height.px]=\"maxHeight\">\r\n <div [class.slick-dialog-draggingHangle]=\"draggable && !isMinimized\" #draggingHandle>\r\n <div #headerRef class=\"slick-dialog_header modal-header py-0\" *ngIf=\"showHeader === true\">\r\n <div class=\"header-left\">{{header}}</div>\r\n <div class=\"header-right\" *ngIf=\"minimizable && !isMinimized\" (mousedown)=\"onDialogMinimize($event)\" style=\"width: 28px;\"><i class=\"far fa-window-minimize\"></i></div>\r\n <div class=\"header-right\" *ngIf=\"minimizable && !isMinimized\" (mousedown)=\"toggleFullSize($event)\" style=\"width: 28px;\"><i *ngIf=\"!isMaximized\" class=\"far fa-window-maximize\"></i><i *ngIf=\"isMaximized\" class=\"far fa-window-restore\"></i></div>\r\n <div class=\"header-right\" *ngIf=\"minimizable && isMinimized\" (mousedown)=\"onDialogMaximize($event)\" style=\"width: 28px;\"><i class=\"far fa-window-restore\"></i></div>\r\n <div class=\"header-right\" *ngIf=\"!isMinimized\" (mousedown)=\"onDialogClose($event)\" style=\"width: 28px;\"><i class=\"far fa-times\"></i></div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!isMinimized\" [style.visibility]=\"(isBodyVisible === true) ? 'visible' : 'hidden'\" style=\"overflow-y: auto\" class=\"slick-dialog_body modal-body flex-fill\" [ngClass]=\"{'disable_scrollbar' : disableScrollbar === true, 'p-0': noPadding === true }\"><ng-content></ng-content></div>\r\n <div #footerRef [ngClass]=\"{'slick-dialog_footer modal-footer': hasFooter === true }\" *ngIf=\"!isMinimized\"><ng-content select=\"slick-dialog-footer\"></ng-content></div>\r\n </div>\r\n </div>\r\n\r\n</div>", styles: [".ng-resizable{position:relative}.ng-resizable-handle{position:absolute;font-size:.1px;display:block;touch-action:none}.ng-resizable-handle.ng-resizable-e{cursor:e-resize;width:7px;right:-5px;height:100%;top:0}.ng-resizable-handle.ng-resizable-w{cursor:w-resize;width:7px;left:-5px;height:100%;top:0}.ng-resizable-handle.ng-resizable-s{cursor:s-resize;height:7px;bottom:-5px;width:100%;left:0}.ng-resizable-handle.ng-resizable-n{cursor:n-resize;height:7px;top:-5px;width:100%;left:0}.ng-resizable-handle.ng-resizable-se{cursor:se-resize;width:8px;height:8px;right:4px;bottom:4px}.ng-resizable-handle.ng-resizable-sw{cursor:sw-resize;width:12px;height:12px;left:1px;bottom:1px}.ng-resizable-handle.ng-resizable-ne{cursor:ne-resize;width:12px;height:12px;right:1px;top:1px}.ng-resizable-handle.ng-resizable-nw{cursor:nw-resize;width:12px;height:12px;left:1px;top:1px}.ng-resizable-diagonal{box-sizing:border-box;width:0;height:0;border-bottom:8px solid #aaa;border-left:8px solid transparent}.slick-dialog-z-index.isMinimized{-webkit-transition-property:all;-webkit-transition-duration:.3s;-webkit-transition-timing-function:linear;transition-property:all;transition-duration:.3s;transition-timing-function:linear}.isMinimized .header-left{display:inline-block;width:calc(100% - 40px);padding-left:15px;vertical-align:top;font-weight:700;text-overflow:ellipsis;overflow:hidden;width:200px;white-space:nowrap}.disable_scrollbar{overflow:hidden!important;overflow-x:hidden;overflow-y:hidden;padding:10px}\n"] }]
1944
1944
  }], ctorParameters: function () { return [{ type: SlickDialogService }]; }, propDecorators: { draggable: [{
1945
1945
  type: Input
1946
1946
  }], resizable: [{
@@ -3349,7 +3349,7 @@ class SlickDropDownComponent {
3349
3349
  provide: NG_VALUE_ACCESSOR,
3350
3350
  useExisting: forwardRef((() => SlickDropDownComponent)),
3351
3351
  multi: true,
3352
- }], viewQueries: [{ propertyName: "containerDiv", first: true, predicate: ["containerDiv"], descendants: true }, { propertyName: "dropdownList", first: true, predicate: ["dropdownList"], descendants: true }, { propertyName: "selectedTextInputRef", first: true, predicate: ["selectedTextInputRef"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div *ngIf=\"!compact\" #containerDiv class=\"slick-drop-down form-control d-flex flex-fill align-items-center position-relative\" [slick-validation-indicator]=\"validationIndicator\" [slickValidationType]=\"validationIndicatorType\" id=\"slick-drop-down_{{uuid}}\" attr.data-uuid=\"{{uuid}}\" [class.open]=\"expanded\" (click)=\"onDropdownClicked($event)\">\r\n <div *ngIf=\"icon\" class=\"slick-drop-down_icon p-0\" style=\"position: absolute;\"><i class=\"pl-1 pr-1\" [ngClass]=\"icon\"></i></div>\r\n <input #selectedTextInputRef *ngIf=\"!disabled\" class='form-control pl-2 pr-4' [class.pl-4]=\"!!icon\" [(ngModel)]=\"selectedText\" [attr.tabindex]=\"tabindex\" (keyup)=\"onKeyUp($event)\" (keydown)=\"onKeyDown($event)\" (focus)=\"onDropdownClicked($event)\" [readonly]=\"!isMobile\" [placeholder]='placeholder' />\r\n <input #selectedTextInputRef *ngIf=\"disabled\" class='form-control pl-2 pr-4' [class.pl-4]=\"!!icon\" disabled=\"disabled\" [ngModel]=\"selectedText\" tabindex=\"-1\" [readonly]=\"true\" [placeholder]='placeholder' />\r\n <div style=\"position: absolute; right: 0;\">\r\n <i class=\"fas fa-caret-down mr-2\" style=\"pointer-events: none\"></i>\r\n </div>\r\n</div>\r\n\r\n<div *ngIf=\"compact\" #containerDiv class=\"slick-drop-down slick-drop-down-compact form-control d-flex flex-fill align-items-center\" id=\"slick-drop-down_{{uuid}}\" attr.data-uuid=\"{{uuid}}\" [class.open]=\"expanded\" (click)=\"onDropdownClicked($event)\">\r\n <input #selectedTextInputRef *ngIf=\"!disabled\" class='form-control mr-2' [(ngModel)]=\"selectedText\" [attr.tabindex]=\"tabindex\" (keyup)=\"onKeyUp($event)\" (keydown)=\"onKeyDown($event)\" (focus)=\"onDropdownClicked($event)\" [readonly]=\"!isMobile\" [placeholder]='placeholder' />\r\n <input #selectedTextInputRef *ngIf=\"disabled\" class='form-control mr-2' [ngModel]=\"selectedText\" tabindex=\"-1\" [readonly]=\"true\" [placeholder]='placeholder' />\r\n <div>\r\n <i class=\"fas fa-caret-down mr-2\" style=\"pointer-events: none\"></i>\r\n </div>\r\n</div>\r\n\r\n\r\n<ul *ngIf=\"isVisible\" #dropdownList id=\"slick-drop-down_{{uuid}}\" class='slick-drop-down-list-group dropdown-menu' [style.width]=\"listGroupWidth\" [style.visibility]=\"(expanded === true) ? 'visible' : 'hidden'\" [style.opacity]=\"(expanded === true) ? '1' : '0'\" [style.max-height]=\"height\" [style.width.px]=\"listGroupWidth\" [style.left.px]=\"left\" [style.top.px]=\"top\">\r\n <li *ngFor=\"let item of visibleItems; let index = index;\" (click)=\"onItemClick(item)\" [class.active]=\"item.id === selectedItem?.id\" [class.card-header]=\"selectedIndex === index\" class=\"dropdown-item\">{{item.text}}</li>\r\n</ul>\r\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: SlickValidationIndicatorDirective, selector: "[slick-validation-indicator]", inputs: ["slick-validation-indicator", "slickValidationType"] }] });
3352
+ }], viewQueries: [{ propertyName: "containerDiv", first: true, predicate: ["containerDiv"], descendants: true }, { propertyName: "dropdownList", first: true, predicate: ["dropdownList"], descendants: true }, { propertyName: "selectedTextInputRef", first: true, predicate: ["selectedTextInputRef"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "HTML\r\n\r\n<div *ngIf=\"!compact\" #containerDiv class=\"slick-drop-down form-control d-flex flex-fill align-items-center position-relative\" [slick-validation-indicator]=\"validationIndicator\" [slickValidationType]=\"validationIndicatorType\" id=\"slick-drop-down_{{uuid}}\" attr.data-uuid=\"{{uuid}}\" [class.open]=\"expanded\" (click)=\"onDropdownClicked($event)\">\r\n <div *ngIf=\"icon\" class=\"slick-drop-down_icon p-0\" style=\"position: absolute;\"><i class=\"px-1\" [ngClass]=\"icon\"></i></div>\r\n <input #selectedTextInputRef *ngIf=\"!disabled\" class='form-control ps-2 pe-4' [class.ps-4]=\"!!icon\" [(ngModel)]=\"selectedText\" [attr.tabindex]=\"tabindex\" (keyup)=\"onKeyUp($event)\" (keydown)=\"onKeyDown($event)\" (focus)=\"onDropdownClicked($event)\" [readonly]=\"!isMobile\" [placeholder]='placeholder' />\r\n <input #selectedTextInputRef *ngIf=\"disabled\" class='form-control ps-2 pe-4' [class.ps-4]=\"!!icon\" disabled=\"disabled\" [ngModel]=\"selectedText\" tabindex=\"-1\" [readonly]=\"true\" [placeholder]='placeholder' />\r\n <div style=\"position: absolute; right: 0;\">\r\n <i class=\"fas fa-caret-down me-2\" style=\"pointer-events: none\"></i>\r\n </div>\r\n</div>\r\n\r\n<div *ngIf=\"compact\" #containerDiv class=\"slick-drop-down slick-drop-down-compact form-control d-flex flex-fill align-items-center\" id=\"slick-drop-down_{{uuid}}\" attr.data-uuid=\"{{uuid}}\" [class.open]=\"expanded\" (click)=\"onDropdownClicked($event)\">\r\n <input #selectedTextInputRef *ngIf=\"!disabled\" class='form-control me-2' [(ngModel)]=\"selectedText\" [attr.tabindex]=\"tabindex\" (keyup)=\"onKeyUp($event)\" (keydown)=\"onKeyDown($event)\" (focus)=\"onDropdownClicked($event)\" [readonly]=\"!isMobile\" [placeholder]='placeholder' />\r\n <input #selectedTextInputRef *ngIf=\"disabled\" class='form-control me-2' [ngModel]=\"selectedText\" tabindex=\"-1\" [readonly]=\"true\" [placeholder]='placeholder' />\r\n <div>\r\n <i class=\"fas fa-caret-down me-2\" style=\"pointer-events: none\"></i>\r\n </div>\r\n</div>\r\n\r\n\r\n<ul *ngIf=\"isVisible\" #dropdownList id=\"slick-drop-down_{{uuid}}\" class='slick-drop-down-list-group dropdown-menu' [style.width]=\"listGroupWidth\" [style.visibility]=\"(expanded === true) ? 'visible' : 'hidden'\" [style.opacity]=\"(expanded === true) ? '1' : '0'\" [style.max-height]=\"height\" [style.width.px]=\"listGroupWidth\" [style.left.px]=\"left\" [style.top.px]=\"top\">\r\n <li *ngFor=\"let item of visibleItems; let index = index;\" (click)=\"onItemClick(item)\" [class.active]=\"item.id === selectedItem?.id\" [class.card-header]=\"selectedIndex === index\" class=\"dropdown-item\">{{item.text}}</li>\r\n</ul>\r\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: SlickValidationIndicatorDirective, selector: "[slick-validation-indicator]", inputs: ["slick-validation-indicator", "slickValidationType"] }] });
3353
3353
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SlickDropDownComponent, decorators: [{
3354
3354
  type: Component,
3355
3355
  args: [{ selector: 'slick-drop-down', providers: [SlickDropDownService, SlickLogService,
@@ -3357,7 +3357,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImpor
3357
3357
  provide: NG_VALUE_ACCESSOR,
3358
3358
  useExisting: forwardRef((() => SlickDropDownComponent)),
3359
3359
  multi: true,
3360
- }], template: "<div *ngIf=\"!compact\" #containerDiv class=\"slick-drop-down form-control d-flex flex-fill align-items-center position-relative\" [slick-validation-indicator]=\"validationIndicator\" [slickValidationType]=\"validationIndicatorType\" id=\"slick-drop-down_{{uuid}}\" attr.data-uuid=\"{{uuid}}\" [class.open]=\"expanded\" (click)=\"onDropdownClicked($event)\">\r\n <div *ngIf=\"icon\" class=\"slick-drop-down_icon p-0\" style=\"position: absolute;\"><i class=\"pl-1 pr-1\" [ngClass]=\"icon\"></i></div>\r\n <input #selectedTextInputRef *ngIf=\"!disabled\" class='form-control pl-2 pr-4' [class.pl-4]=\"!!icon\" [(ngModel)]=\"selectedText\" [attr.tabindex]=\"tabindex\" (keyup)=\"onKeyUp($event)\" (keydown)=\"onKeyDown($event)\" (focus)=\"onDropdownClicked($event)\" [readonly]=\"!isMobile\" [placeholder]='placeholder' />\r\n <input #selectedTextInputRef *ngIf=\"disabled\" class='form-control pl-2 pr-4' [class.pl-4]=\"!!icon\" disabled=\"disabled\" [ngModel]=\"selectedText\" tabindex=\"-1\" [readonly]=\"true\" [placeholder]='placeholder' />\r\n <div style=\"position: absolute; right: 0;\">\r\n <i class=\"fas fa-caret-down mr-2\" style=\"pointer-events: none\"></i>\r\n </div>\r\n</div>\r\n\r\n<div *ngIf=\"compact\" #containerDiv class=\"slick-drop-down slick-drop-down-compact form-control d-flex flex-fill align-items-center\" id=\"slick-drop-down_{{uuid}}\" attr.data-uuid=\"{{uuid}}\" [class.open]=\"expanded\" (click)=\"onDropdownClicked($event)\">\r\n <input #selectedTextInputRef *ngIf=\"!disabled\" class='form-control mr-2' [(ngModel)]=\"selectedText\" [attr.tabindex]=\"tabindex\" (keyup)=\"onKeyUp($event)\" (keydown)=\"onKeyDown($event)\" (focus)=\"onDropdownClicked($event)\" [readonly]=\"!isMobile\" [placeholder]='placeholder' />\r\n <input #selectedTextInputRef *ngIf=\"disabled\" class='form-control mr-2' [ngModel]=\"selectedText\" tabindex=\"-1\" [readonly]=\"true\" [placeholder]='placeholder' />\r\n <div>\r\n <i class=\"fas fa-caret-down mr-2\" style=\"pointer-events: none\"></i>\r\n </div>\r\n</div>\r\n\r\n\r\n<ul *ngIf=\"isVisible\" #dropdownList id=\"slick-drop-down_{{uuid}}\" class='slick-drop-down-list-group dropdown-menu' [style.width]=\"listGroupWidth\" [style.visibility]=\"(expanded === true) ? 'visible' : 'hidden'\" [style.opacity]=\"(expanded === true) ? '1' : '0'\" [style.max-height]=\"height\" [style.width.px]=\"listGroupWidth\" [style.left.px]=\"left\" [style.top.px]=\"top\">\r\n <li *ngFor=\"let item of visibleItems; let index = index;\" (click)=\"onItemClick(item)\" [class.active]=\"item.id === selectedItem?.id\" [class.card-header]=\"selectedIndex === index\" class=\"dropdown-item\">{{item.text}}</li>\r\n</ul>\r\n" }]
3360
+ }], template: "HTML\r\n\r\n<div *ngIf=\"!compact\" #containerDiv class=\"slick-drop-down form-control d-flex flex-fill align-items-center position-relative\" [slick-validation-indicator]=\"validationIndicator\" [slickValidationType]=\"validationIndicatorType\" id=\"slick-drop-down_{{uuid}}\" attr.data-uuid=\"{{uuid}}\" [class.open]=\"expanded\" (click)=\"onDropdownClicked($event)\">\r\n <div *ngIf=\"icon\" class=\"slick-drop-down_icon p-0\" style=\"position: absolute;\"><i class=\"px-1\" [ngClass]=\"icon\"></i></div>\r\n <input #selectedTextInputRef *ngIf=\"!disabled\" class='form-control ps-2 pe-4' [class.ps-4]=\"!!icon\" [(ngModel)]=\"selectedText\" [attr.tabindex]=\"tabindex\" (keyup)=\"onKeyUp($event)\" (keydown)=\"onKeyDown($event)\" (focus)=\"onDropdownClicked($event)\" [readonly]=\"!isMobile\" [placeholder]='placeholder' />\r\n <input #selectedTextInputRef *ngIf=\"disabled\" class='form-control ps-2 pe-4' [class.ps-4]=\"!!icon\" disabled=\"disabled\" [ngModel]=\"selectedText\" tabindex=\"-1\" [readonly]=\"true\" [placeholder]='placeholder' />\r\n <div style=\"position: absolute; right: 0;\">\r\n <i class=\"fas fa-caret-down me-2\" style=\"pointer-events: none\"></i>\r\n </div>\r\n</div>\r\n\r\n<div *ngIf=\"compact\" #containerDiv class=\"slick-drop-down slick-drop-down-compact form-control d-flex flex-fill align-items-center\" id=\"slick-drop-down_{{uuid}}\" attr.data-uuid=\"{{uuid}}\" [class.open]=\"expanded\" (click)=\"onDropdownClicked($event)\">\r\n <input #selectedTextInputRef *ngIf=\"!disabled\" class='form-control me-2' [(ngModel)]=\"selectedText\" [attr.tabindex]=\"tabindex\" (keyup)=\"onKeyUp($event)\" (keydown)=\"onKeyDown($event)\" (focus)=\"onDropdownClicked($event)\" [readonly]=\"!isMobile\" [placeholder]='placeholder' />\r\n <input #selectedTextInputRef *ngIf=\"disabled\" class='form-control me-2' [ngModel]=\"selectedText\" tabindex=\"-1\" [readonly]=\"true\" [placeholder]='placeholder' />\r\n <div>\r\n <i class=\"fas fa-caret-down me-2\" style=\"pointer-events: none\"></i>\r\n </div>\r\n</div>\r\n\r\n\r\n<ul *ngIf=\"isVisible\" #dropdownList id=\"slick-drop-down_{{uuid}}\" class='slick-drop-down-list-group dropdown-menu' [style.width]=\"listGroupWidth\" [style.visibility]=\"(expanded === true) ? 'visible' : 'hidden'\" [style.opacity]=\"(expanded === true) ? '1' : '0'\" [style.max-height]=\"height\" [style.width.px]=\"listGroupWidth\" [style.left.px]=\"left\" [style.top.px]=\"top\">\r\n <li *ngFor=\"let item of visibleItems; let index = index;\" (click)=\"onItemClick(item)\" [class.active]=\"item.id === selectedItem?.id\" [class.card-header]=\"selectedIndex === index\" class=\"dropdown-item\">{{item.text}}</li>\r\n</ul>\r\n" }]
3361
3361
  }], ctorParameters: function () { return [{ type: SlickDropDownService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { placeholder: [{
3362
3362
  type: Input
3363
3363
  }], items: [{
@@ -4468,7 +4468,7 @@ class SlickEmailerComponent {
4468
4468
  multi: true,
4469
4469
  },
4470
4470
  SlickFunctionLockService
4471
- ], viewQueries: [{ propertyName: "tinyMCEContainerRef", first: true, predicate: ["tinyMCEContainerRef"], descendants: true }], ngImport: i0, template: "<div *ngIf=\"emailerModel\" id=\"slick-emailer_{{uuid}}\" class=\"slick-emailer\">\r\n\t<div class=\"row form-group\">\r\n\t\t<div class=\"col-12\">\r\n\t\t\t<div *ngIf=\"isSubmitted === true && emailerModel.toEmailAddresses.length === 0\" class=\"errorWrapper showIcons\"><div class=\"text-danger\">Email must have at least one email address</div></div>\r\n\t\t\t<div class=\"input-group\">\r\n\t\t\t\t<div class=\"input-group-prepend\">\r\n\t\t\t\t\t<span class=\"input-group-text\"><span class=\"fas fa-search\"></span></span>\r\n\t\t\t\t</div>\r\n\t\t\t\t<input class=\"form-control\" #emailAddressAutocomplete [(ngModel)]=\"toEmailAddress\" placeholder=\"Email Search...\" autofocus />\r\n\t\t\t</div>\r\n\t\t\t<slick-auto-complete [inputRef]=\"emailAddressAutocomplete\" textField=\"emailDisplay\" [items]=\"toEmailAddressList\" (onRefresh)=\"toAddressSearch($event)\" (onSelect)=\"onSelectEmailAddress($event)\" (onFreeformTextSelect)=\"onFreeformTextSelect($event)\">\r\n\t\t\t\t<ng-template let-emailDisplay [slickAutoCompleteListItemTemplate]>\r\n\t\t\t\t\t<div style='line-height: 1.1em; font-size: 12px;'>\r\n\t\t\t\t\t\t{{emailDisplay.displayName}} [{{emailDisplay.emailAddress}}]\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</ng-template>\r\n\t\t\t</slick-auto-complete>\r\n\r\n\t\t\t<label>To:&nbsp;</label>\r\n\t\t\t<div *ngFor=\"let emailAddress of emailerModel.toEmailAddresses; let idx = index;\" class=\"slick-emailer_email-address alert alert-secondary\">{{emailAddress.displayName}} [{{emailAddress.emailAddress}}]<i (click)=\"deleteEmailAddress(idx)\" class=\"fas fa-times-circle bg-white text-danger ml-1\"></i></div>\r\n\t\t</div>\r\n\t</div>\r\n\t<div class=\"row form-group\">\r\n\t\t<div class=\"col-12\">\r\n\t\t\t<label>Subject:</label>\r\n\t\t\t<input type=\"text\" class=\"form-control\" [(ngModel)]=\"emailerModel.subject\" />\r\n\t\t</div>\r\n\t</div>\r\n\r\n\t<div class=\"row form-group\">\r\n\t\t<div class=\"col-12\">\r\n\t\t\t<label>Body:</label>\r\n\t\t\t<div #tinyMCEContainerRef></div>\r\n\t\t</div>\r\n\t</div>\r\n\r\n\t<div class=\"row form-group\">\r\n\t\t<div class=\"col-12\">\r\n\t\t\t<label>Attachments:</label>\r\n\t\t\t<slick-file-drop (filesChanged)=\"onAttachmentsChanged($event)\"></slick-file-drop>\r\n\t\t\t<slick-file-list [(files)]=\"emailerModel.attachments\"></slick-file-list>\r\n\t\t</div>\r\n\t</div>\r\n\r\n\t<div *ngIf=\"showButtons\" class=\"row form-group\">\r\n\t\t<div class=\"col-12 text-center\">\r\n\t\t\t<button type=\"button\" style=\"width: 120px; margin-right: 10px;\" [slick-button-spinner]=\"spinnerStatus\" class=\"btn btn-outline-primary\" (click)=\"onSendEmail()\"><i class=\"far fa-envelope\"></i>&nbsp;Send</button>\r\n\t\t\t<button type=\"button\" style=\"width: 120px;\" class=\"btn btn-outline-danger\" (click)=\"onCancelEmail()\"><i class=\"far fa-times\"></i>&nbsp;Cancel</button>\r\n\t\t</div>\r\n\t</div>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: SlickAutoCompleteComponent, selector: "slick-auto-complete", inputs: ["inputRef", "searchBarRef", "items", "delay", "selectFirst", "displayTextFieldName", "offset", "listHeight", "listWidth", "allowFreeformText", "showNoItemsFoundDisplay"], outputs: ["onRefresh", "onSelect", "onFreeformTextSelect"] }, { kind: "directive", type: SlickAutoCompleteListItemTemplateDirective, selector: "[slickAutoCompleteListItemTemplate]", inputs: ["type", "slickAutoCompleteListItemTemplate"] }, { kind: "component", type: SlickButtonSpinnerComponent, selector: "[slick-button-spinner]", inputs: ["slick-button-spinner"] }, { kind: "component", type: SlickFileDropComponent, selector: "slick-file-drop", inputs: ["displayText"], outputs: ["filesChanged"] }, { kind: "component", type: SlickFileListComponent, selector: "slick-file-list", inputs: ["files", "allowDelete", "showPhotoGallery", "showCheckboxes", "thumbnailSize", "confirmDelete"], outputs: ["filesEmitter", "onFileDelete", "onFileCheckChanged", "onFileClicked"] }] });
4471
+ ], viewQueries: [{ propertyName: "tinyMCEContainerRef", first: true, predicate: ["tinyMCEContainerRef"], descendants: true }], ngImport: i0, template: "<div *ngIf=\"emailerModel\" id=\"slick-emailer_{{uuid}}\" class=\"slick-emailer\">\r\n <div class=\"row form-group\">\r\n <div class=\"col-12\">\r\n <div *ngIf=\"isSubmitted === true && emailerModel.toEmailAddresses.length === 0\" class=\"errorWrapper showIcons\"><div class=\"text-danger\">Email must have at least one email address</div></div>\r\n <div class=\"input-group\">\r\n <span class=\"input-group-text\"><span class=\"fas fa-search\"></span></span>\r\n <input class=\"form-control\" #emailAddressAutocomplete [(ngModel)]=\"toEmailAddress\" placeholder=\"Email Search...\" autofocus />\r\n </div>\r\n <slick-auto-complete [inputRef]=\"emailAddressAutocomplete\" textField=\"emailDisplay\" [items]=\"toEmailAddressList\" (onRefresh)=\"toAddressSearch($event)\" (onSelect)=\"onSelectEmailAddress($event)\" (onFreeformTextSelect)=\"onFreeformTextSelect($event)\">\r\n <ng-template let-emailDisplay [slickAutoCompleteListItemTemplate]>\r\n <div style='line-height: 1.1em; font-size: 12px;'>\r\n {{emailDisplay.displayName}} [{{emailDisplay.emailAddress}}]\r\n </div>\r\n </ng-template>\r\n </slick-auto-complete>\r\n\r\n <label>To:&nbsp;</label>\r\n <div *ngFor=\"let emailAddress of emailerModel.toEmailAddresses; let idx = index;\" class=\"slick-emailer_email-address alert alert-secondary\">{{emailAddress.displayName}} [{{emailAddress.emailAddress}}]<i (click)=\"deleteEmailAddress(idx)\" class=\"fas fa-times-circle bg-white text-danger ms-1\"></i></div>\r\n </div>\r\n </div>\r\n <div class=\"row form-group\">\r\n <div class=\"col-12\">\r\n <label>Subject:</label>\r\n <input type=\"text\" class=\"form-control\" [(ngModel)]=\"emailerModel.subject\" />\r\n </div>\r\n </div>\r\n\r\n <div class=\"row form-group\">\r\n <div class=\"col-12\">\r\n <label>Body:</label>\r\n <div #tinyMCEContainerRef></div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"row form-group\">\r\n <div class=\"col-12\">\r\n <label>Attachments:</label>\r\n <slick-file-drop (filesChanged)=\"onAttachmentsChanged($event)\"></slick-file-drop>\r\n <slick-file-list [(files)]=\"emailerModel.attachments\"></slick-file-list>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"showButtons\" class=\"row form-group\">\r\n <div class=\"col-12 text-center\">\r\n <button type=\"button\" style=\"width: 120px; margin-right: 10px;\" [slick-button-spinner]=\"spinnerStatus\" class=\"btn btn-outline-primary\" (click)=\"onSendEmail()\"><i class=\"far fa-envelope\"></i>&nbsp;Send</button>\r\n <button type=\"button\" style=\"width: 120px;\" class=\"btn btn-outline-danger\" (click)=\"onCancelEmail()\"><i class=\"far fa-times\"></i>&nbsp;Cancel</button>\r\n </div>\r\n </div>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: SlickAutoCompleteComponent, selector: "slick-auto-complete", inputs: ["inputRef", "searchBarRef", "items", "delay", "selectFirst", "displayTextFieldName", "offset", "listHeight", "listWidth", "allowFreeformText", "showNoItemsFoundDisplay"], outputs: ["onRefresh", "onSelect", "onFreeformTextSelect"] }, { kind: "directive", type: SlickAutoCompleteListItemTemplateDirective, selector: "[slickAutoCompleteListItemTemplate]", inputs: ["type", "slickAutoCompleteListItemTemplate"] }, { kind: "component", type: SlickButtonSpinnerComponent, selector: "[slick-button-spinner]", inputs: ["slick-button-spinner"] }, { kind: "component", type: SlickFileDropComponent, selector: "slick-file-drop", inputs: ["displayText"], outputs: ["filesChanged"] }, { kind: "component", type: SlickFileListComponent, selector: "slick-file-list", inputs: ["files", "allowDelete", "showPhotoGallery", "showCheckboxes", "thumbnailSize", "confirmDelete"], outputs: ["filesEmitter", "onFileDelete", "onFileCheckChanged", "onFileClicked"] }] });
4472
4472
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SlickEmailerComponent, decorators: [{
4473
4473
  type: Component,
4474
4474
  args: [{ selector: 'slick-emailer', providers: [
@@ -4478,7 +4478,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImpor
4478
4478
  multi: true,
4479
4479
  },
4480
4480
  SlickFunctionLockService
4481
- ], template: "<div *ngIf=\"emailerModel\" id=\"slick-emailer_{{uuid}}\" class=\"slick-emailer\">\r\n\t<div class=\"row form-group\">\r\n\t\t<div class=\"col-12\">\r\n\t\t\t<div *ngIf=\"isSubmitted === true && emailerModel.toEmailAddresses.length === 0\" class=\"errorWrapper showIcons\"><div class=\"text-danger\">Email must have at least one email address</div></div>\r\n\t\t\t<div class=\"input-group\">\r\n\t\t\t\t<div class=\"input-group-prepend\">\r\n\t\t\t\t\t<span class=\"input-group-text\"><span class=\"fas fa-search\"></span></span>\r\n\t\t\t\t</div>\r\n\t\t\t\t<input class=\"form-control\" #emailAddressAutocomplete [(ngModel)]=\"toEmailAddress\" placeholder=\"Email Search...\" autofocus />\r\n\t\t\t</div>\r\n\t\t\t<slick-auto-complete [inputRef]=\"emailAddressAutocomplete\" textField=\"emailDisplay\" [items]=\"toEmailAddressList\" (onRefresh)=\"toAddressSearch($event)\" (onSelect)=\"onSelectEmailAddress($event)\" (onFreeformTextSelect)=\"onFreeformTextSelect($event)\">\r\n\t\t\t\t<ng-template let-emailDisplay [slickAutoCompleteListItemTemplate]>\r\n\t\t\t\t\t<div style='line-height: 1.1em; font-size: 12px;'>\r\n\t\t\t\t\t\t{{emailDisplay.displayName}} [{{emailDisplay.emailAddress}}]\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</ng-template>\r\n\t\t\t</slick-auto-complete>\r\n\r\n\t\t\t<label>To:&nbsp;</label>\r\n\t\t\t<div *ngFor=\"let emailAddress of emailerModel.toEmailAddresses; let idx = index;\" class=\"slick-emailer_email-address alert alert-secondary\">{{emailAddress.displayName}} [{{emailAddress.emailAddress}}]<i (click)=\"deleteEmailAddress(idx)\" class=\"fas fa-times-circle bg-white text-danger ml-1\"></i></div>\r\n\t\t</div>\r\n\t</div>\r\n\t<div class=\"row form-group\">\r\n\t\t<div class=\"col-12\">\r\n\t\t\t<label>Subject:</label>\r\n\t\t\t<input type=\"text\" class=\"form-control\" [(ngModel)]=\"emailerModel.subject\" />\r\n\t\t</div>\r\n\t</div>\r\n\r\n\t<div class=\"row form-group\">\r\n\t\t<div class=\"col-12\">\r\n\t\t\t<label>Body:</label>\r\n\t\t\t<div #tinyMCEContainerRef></div>\r\n\t\t</div>\r\n\t</div>\r\n\r\n\t<div class=\"row form-group\">\r\n\t\t<div class=\"col-12\">\r\n\t\t\t<label>Attachments:</label>\r\n\t\t\t<slick-file-drop (filesChanged)=\"onAttachmentsChanged($event)\"></slick-file-drop>\r\n\t\t\t<slick-file-list [(files)]=\"emailerModel.attachments\"></slick-file-list>\r\n\t\t</div>\r\n\t</div>\r\n\r\n\t<div *ngIf=\"showButtons\" class=\"row form-group\">\r\n\t\t<div class=\"col-12 text-center\">\r\n\t\t\t<button type=\"button\" style=\"width: 120px; margin-right: 10px;\" [slick-button-spinner]=\"spinnerStatus\" class=\"btn btn-outline-primary\" (click)=\"onSendEmail()\"><i class=\"far fa-envelope\"></i>&nbsp;Send</button>\r\n\t\t\t<button type=\"button\" style=\"width: 120px;\" class=\"btn btn-outline-danger\" (click)=\"onCancelEmail()\"><i class=\"far fa-times\"></i>&nbsp;Cancel</button>\r\n\t\t</div>\r\n\t</div>\r\n</div>\r\n" }]
4481
+ ], template: "<div *ngIf=\"emailerModel\" id=\"slick-emailer_{{uuid}}\" class=\"slick-emailer\">\r\n <div class=\"row form-group\">\r\n <div class=\"col-12\">\r\n <div *ngIf=\"isSubmitted === true && emailerModel.toEmailAddresses.length === 0\" class=\"errorWrapper showIcons\"><div class=\"text-danger\">Email must have at least one email address</div></div>\r\n <div class=\"input-group\">\r\n <span class=\"input-group-text\"><span class=\"fas fa-search\"></span></span>\r\n <input class=\"form-control\" #emailAddressAutocomplete [(ngModel)]=\"toEmailAddress\" placeholder=\"Email Search...\" autofocus />\r\n </div>\r\n <slick-auto-complete [inputRef]=\"emailAddressAutocomplete\" textField=\"emailDisplay\" [items]=\"toEmailAddressList\" (onRefresh)=\"toAddressSearch($event)\" (onSelect)=\"onSelectEmailAddress($event)\" (onFreeformTextSelect)=\"onFreeformTextSelect($event)\">\r\n <ng-template let-emailDisplay [slickAutoCompleteListItemTemplate]>\r\n <div style='line-height: 1.1em; font-size: 12px;'>\r\n {{emailDisplay.displayName}} [{{emailDisplay.emailAddress}}]\r\n </div>\r\n </ng-template>\r\n </slick-auto-complete>\r\n\r\n <label>To:&nbsp;</label>\r\n <div *ngFor=\"let emailAddress of emailerModel.toEmailAddresses; let idx = index;\" class=\"slick-emailer_email-address alert alert-secondary\">{{emailAddress.displayName}} [{{emailAddress.emailAddress}}]<i (click)=\"deleteEmailAddress(idx)\" class=\"fas fa-times-circle bg-white text-danger ms-1\"></i></div>\r\n </div>\r\n </div>\r\n <div class=\"row form-group\">\r\n <div class=\"col-12\">\r\n <label>Subject:</label>\r\n <input type=\"text\" class=\"form-control\" [(ngModel)]=\"emailerModel.subject\" />\r\n </div>\r\n </div>\r\n\r\n <div class=\"row form-group\">\r\n <div class=\"col-12\">\r\n <label>Body:</label>\r\n <div #tinyMCEContainerRef></div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"row form-group\">\r\n <div class=\"col-12\">\r\n <label>Attachments:</label>\r\n <slick-file-drop (filesChanged)=\"onAttachmentsChanged($event)\"></slick-file-drop>\r\n <slick-file-list [(files)]=\"emailerModel.attachments\"></slick-file-list>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"showButtons\" class=\"row form-group\">\r\n <div class=\"col-12 text-center\">\r\n <button type=\"button\" style=\"width: 120px; margin-right: 10px;\" [slick-button-spinner]=\"spinnerStatus\" class=\"btn btn-outline-primary\" (click)=\"onSendEmail()\"><i class=\"far fa-envelope\"></i>&nbsp;Send</button>\r\n <button type=\"button\" style=\"width: 120px;\" class=\"btn btn-outline-danger\" (click)=\"onCancelEmail()\"><i class=\"far fa-times\"></i>&nbsp;Cancel</button>\r\n </div>\r\n </div>\r\n</div>\r\n" }]
4482
4482
  }], ctorParameters: function () { return [{ type: SlickFunctionLockService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { toEmailAddressList: [{
4483
4483
  type: Input,
4484
4484
  args: ["toEmailAddressList"]
@@ -5493,10 +5493,10 @@ class SlickPagingComponent {
5493
5493
  }
5494
5494
  }
5495
5495
  /** @nocollapse */ SlickPagingComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SlickPagingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
5496
- /** @nocollapse */ SlickPagingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: SlickPagingComponent, selector: "slick-paging", inputs: { pageNumber: "pageNumber", totalRecords: "totalRecords", recordsPerPage: "recordsPerPage" }, outputs: { pageNumberChange: "pageNumberChange", onPageChange: "onPageChange" }, host: { properties: { "class": "this.class" } }, usesOnChanges: true, ngImport: i0, template: "<div class=\"slick-paging\">\r\n\t<div class=\"ml-2 d-flex flex-column\">\r\n\t\t<ul class=\"pagination m-0\">\r\n\t\t\t<li class=\"page-item\" [class.disabled]=\"!totalRecords || pageNumber === 1\"><button type=\"button\" class=\"page-link\" (click)=\"previousPage()\" style=\"margin-left: 1px;\"><i class=\"far fa-angle-left\"></i></button></li>\r\n\t\t\t<li *ngIf=\"pageNumber > 10\" class=\"page-item\"><button type=\"button\" class=\"page-link\" (click)=\"first()\" style=\"margin-left: 1px;\">1</button></li>\r\n\t\t\t<li *ngIf=\"preDisplayEllipses === true\" class=\"page-item\"><button type=\"button\" class=\"page-link\" (click)=\"previousSet()\" style=\"margin-left: 1px;\"><i style=\"line-height: .8rem; vertical-align: bottom;\" class=\"far fa-ellipsis-h\"></i></button></li>\r\n\r\n\t\t\t<li *ngIf=\"totalPages > 10\" class=\"page-item\" style=\"margin-left: 2px;\"></li>\r\n\r\n\t\t\t<li class=\"page-item\" *ngFor=\"let displayPageNumber of preDisplayPageNumbers\">\r\n\t\t\t\t<button type=\"button\" class=\"page-link\" style=\"margin-right: 2px;\" (click)=\"selectPage(displayPageNumber)\">{{displayPageNumber}}</button>\r\n\t\t\t</li>\r\n\r\n\t\t\t<li class=\"page-item\" [class.active]=\"pageNumber === displayPageNumber\" *ngFor=\"let displayPageNumber of displayPageNumbers\">\r\n\t\t\t\t<button *ngIf=\"displayPageNumber !== -1\" type=\"button\" class=\"page-link\" (click)=\"selectPage(displayPageNumber)\">{{displayPageNumber}}</button>\r\n\t\t\t\t<div *ngIf=\"displayPageNumber === -1\" class=\"page-link ellipses pl-1 pr-1 text-white bg-primary\"><i class=\"far fa-ellipsis-h\" style=\"position: relative;\ttop: 4px;\"></i></div>\r\n\t\t\t</li>\r\n\r\n\t\t\t<li *ngIf=\"postDisplayPageNumbers.length > 0\" class=\"page-item\" style=\"margin-left: 2px;\"></li>\r\n\r\n\t\t\t<li class=\"page-item\" *ngFor=\"let displayPageNumber of postDisplayPageNumbers\">\r\n\t\t\t\t<button type=\"button\" class=\"page-link\" style=\"margin-right: 2px;\" (click)=\"selectPage(displayPageNumber)\">{{displayPageNumber}}</button>\r\n\t\t\t</li>\r\n\r\n\t\t\t<li *ngIf=\"postDisplayEllipses === true\" class=\"page-item\"><button type=\"button\" class=\"page-link\" (click)=\"nextSet()\" style=\"margin-right: 2px;\"><i style=\"line-height: .8rem; vertical-align: bottom;\" class=\"far fa-ellipsis-h\"></i></button></li>\r\n\t\t\t<li *ngIf=\"totalPages > 10\" class=\"page-item\" [class.disabled]=\"pageNumber === totalPages\"><button type=\"button\" class=\"page-link\" (click)=\"last()\" style=\"margin-right: 2px;\">{{totalPages}}</button></li>\r\n\t\t\t<li class=\"page-item\" [class.disabled]=\"!totalRecords || pageNumber === totalPages\"><button type=\"button\" class=\"page-link\" (click)=\"nextPage()\"><i class=\"far fa-angle-right\"></i></button></li>\r\n\t\t</ul>\r\n\t\t<div *ngIf=\"totalRecords <= 0\" style=\"font-size: .8em; line-height: 1.4em;\">&nbsp;</div>\r\n\t\t<div *ngIf=\"totalRecords > 0\" style=\"font-size: .8em; line-height: 1.4em;\">\r\n\t\t\tShowing {{currentRecordNumber}}-{{endRecordNumber}} of {{totalRecords}}\r\n\t\t</div>\r\n\t</div>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
5496
+ /** @nocollapse */ SlickPagingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: SlickPagingComponent, selector: "slick-paging", inputs: { pageNumber: "pageNumber", totalRecords: "totalRecords", recordsPerPage: "recordsPerPage" }, outputs: { pageNumberChange: "pageNumberChange", onPageChange: "onPageChange" }, host: { properties: { "class": "this.class" } }, usesOnChanges: true, ngImport: i0, template: "<div class=\"slick-paging\">\r\n\t<div class=\"ms-2 d-flex flex-column\">\r\n\t\t<ul class=\"pagination m-0\">\r\n\t\t\t<li class=\"page-item\" [class.disabled]=\"!totalRecords || pageNumber === 1\"><button type=\"button\" class=\"page-link\" (click)=\"previousPage()\" style=\"margin-left: 1px;\"><i class=\"far fa-angle-left\"></i></button></li>\r\n\t\t\t<li *ngIf=\"pageNumber > 10\" class=\"page-item\"><button type=\"button\" class=\"page-link\" (click)=\"first()\" style=\"margin-left: 1px;\">1</button></li>\r\n\t\t\t<li *ngIf=\"preDisplayEllipses === true\" class=\"page-item\"><button type=\"button\" class=\"page-link\" (click)=\"previousSet()\" style=\"margin-left: 1px;\"><i style=\"line-height: .8rem; vertical-align: bottom;\" class=\"far fa-ellipsis-h\"></i></button></li>\r\n\r\n\t\t\t<li *ngIf=\"totalPages > 10\" class=\"page-item\" style=\"margin-left: 2px;\"></li>\r\n\r\n\t\t\t<li class=\"page-item\" *ngFor=\"let displayPageNumber of preDisplayPageNumbers\">\r\n\t\t\t\t<button type=\"button\" class=\"page-link\" style=\"margin-right: 2px;\" (click)=\"selectPage(displayPageNumber)\">{{displayPageNumber}}</button>\r\n\t\t\t</li>\r\n\r\n\t\t\t<li class=\"page-item\" [class.active]=\"pageNumber === displayPageNumber\" *ngFor=\"let displayPageNumber of displayPageNumbers\">\r\n\t\t\t\t<button *ngIf=\"displayPageNumber !== -1\" type=\"button\" class=\"page-link\" (click)=\"selectPage(displayPageNumber)\">{{displayPageNumber}}</button>\r\n\t\t\t\t<div *ngIf=\"displayPageNumber === -1\" class=\"page-link ellipses px-1 text-white bg-primary\"><i class=\"far fa-ellipsis-h\" style=\"position: relative;\ttop: 4px;\"></i></div>\r\n\t\t\t</li>\r\n\r\n\t\t\t<li *ngIf=\"postDisplayPageNumbers.length > 0\" class=\"page-item\" style=\"margin-left: 2px;\"></li>\r\n\r\n\t\t\t<li class=\"page-item\" *ngFor=\"let displayPageNumber of postDisplayPageNumbers\">\r\n\t\t\t\t<button type=\"button\" class=\"page-link\" style=\"margin-right: 2px;\" (click)=\"selectPage(displayPageNumber)\">{{displayPageNumber}}</button>\r\n\t\t\t</li>\r\n\r\n\t\t\t<li *ngIf=\"postDisplayEllipses === true\" class=\"page-item\"><button type=\"button\" class=\"page-link\" (click)=\"nextSet()\" style=\"margin-right: 2px;\"><i style=\"line-height: .8rem; vertical-align: bottom;\" class=\"far fa-ellipsis-h\"></i></button></li>\r\n\t\t\t<li *ngIf=\"totalPages > 10\" class=\"page-item\" [class.disabled]=\"pageNumber === totalPages\"><button type=\"button\" class=\"page-link\" (click)=\"last()\" style=\"margin-right: 2px;\">{{totalPages}}</button></li>\r\n\t\t\t<li class=\"page-item\" [class.disabled]=\"!totalRecords || pageNumber === totalPages\"><button type=\"button\" class=\"page-link\" (click)=\"nextPage()\"><i class=\"far fa-angle-right\"></i></button></li>\r\n\t\t</ul>\r\n\t\t<div *ngIf=\"totalRecords <= 0\" style=\"font-size: .8em; line-height: 1.4em;\">&nbsp;</div>\r\n\t\t<div *ngIf=\"totalRecords > 0\" style=\"font-size: .8em; line-height: 1.4em;\">\r\n\t\t\tShowing {{currentRecordNumber}}-{{endRecordNumber}} of {{totalRecords}}\r\n\t\t</div>\r\n\t</div>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
5497
5497
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SlickPagingComponent, decorators: [{
5498
5498
  type: Component,
5499
- args: [{ selector: 'slick-paging', template: "<div class=\"slick-paging\">\r\n\t<div class=\"ml-2 d-flex flex-column\">\r\n\t\t<ul class=\"pagination m-0\">\r\n\t\t\t<li class=\"page-item\" [class.disabled]=\"!totalRecords || pageNumber === 1\"><button type=\"button\" class=\"page-link\" (click)=\"previousPage()\" style=\"margin-left: 1px;\"><i class=\"far fa-angle-left\"></i></button></li>\r\n\t\t\t<li *ngIf=\"pageNumber > 10\" class=\"page-item\"><button type=\"button\" class=\"page-link\" (click)=\"first()\" style=\"margin-left: 1px;\">1</button></li>\r\n\t\t\t<li *ngIf=\"preDisplayEllipses === true\" class=\"page-item\"><button type=\"button\" class=\"page-link\" (click)=\"previousSet()\" style=\"margin-left: 1px;\"><i style=\"line-height: .8rem; vertical-align: bottom;\" class=\"far fa-ellipsis-h\"></i></button></li>\r\n\r\n\t\t\t<li *ngIf=\"totalPages > 10\" class=\"page-item\" style=\"margin-left: 2px;\"></li>\r\n\r\n\t\t\t<li class=\"page-item\" *ngFor=\"let displayPageNumber of preDisplayPageNumbers\">\r\n\t\t\t\t<button type=\"button\" class=\"page-link\" style=\"margin-right: 2px;\" (click)=\"selectPage(displayPageNumber)\">{{displayPageNumber}}</button>\r\n\t\t\t</li>\r\n\r\n\t\t\t<li class=\"page-item\" [class.active]=\"pageNumber === displayPageNumber\" *ngFor=\"let displayPageNumber of displayPageNumbers\">\r\n\t\t\t\t<button *ngIf=\"displayPageNumber !== -1\" type=\"button\" class=\"page-link\" (click)=\"selectPage(displayPageNumber)\">{{displayPageNumber}}</button>\r\n\t\t\t\t<div *ngIf=\"displayPageNumber === -1\" class=\"page-link ellipses pl-1 pr-1 text-white bg-primary\"><i class=\"far fa-ellipsis-h\" style=\"position: relative;\ttop: 4px;\"></i></div>\r\n\t\t\t</li>\r\n\r\n\t\t\t<li *ngIf=\"postDisplayPageNumbers.length > 0\" class=\"page-item\" style=\"margin-left: 2px;\"></li>\r\n\r\n\t\t\t<li class=\"page-item\" *ngFor=\"let displayPageNumber of postDisplayPageNumbers\">\r\n\t\t\t\t<button type=\"button\" class=\"page-link\" style=\"margin-right: 2px;\" (click)=\"selectPage(displayPageNumber)\">{{displayPageNumber}}</button>\r\n\t\t\t</li>\r\n\r\n\t\t\t<li *ngIf=\"postDisplayEllipses === true\" class=\"page-item\"><button type=\"button\" class=\"page-link\" (click)=\"nextSet()\" style=\"margin-right: 2px;\"><i style=\"line-height: .8rem; vertical-align: bottom;\" class=\"far fa-ellipsis-h\"></i></button></li>\r\n\t\t\t<li *ngIf=\"totalPages > 10\" class=\"page-item\" [class.disabled]=\"pageNumber === totalPages\"><button type=\"button\" class=\"page-link\" (click)=\"last()\" style=\"margin-right: 2px;\">{{totalPages}}</button></li>\r\n\t\t\t<li class=\"page-item\" [class.disabled]=\"!totalRecords || pageNumber === totalPages\"><button type=\"button\" class=\"page-link\" (click)=\"nextPage()\"><i class=\"far fa-angle-right\"></i></button></li>\r\n\t\t</ul>\r\n\t\t<div *ngIf=\"totalRecords <= 0\" style=\"font-size: .8em; line-height: 1.4em;\">&nbsp;</div>\r\n\t\t<div *ngIf=\"totalRecords > 0\" style=\"font-size: .8em; line-height: 1.4em;\">\r\n\t\t\tShowing {{currentRecordNumber}}-{{endRecordNumber}} of {{totalRecords}}\r\n\t\t</div>\r\n\t</div>\r\n</div>\r\n" }]
5499
+ args: [{ selector: 'slick-paging', template: "<div class=\"slick-paging\">\r\n\t<div class=\"ms-2 d-flex flex-column\">\r\n\t\t<ul class=\"pagination m-0\">\r\n\t\t\t<li class=\"page-item\" [class.disabled]=\"!totalRecords || pageNumber === 1\"><button type=\"button\" class=\"page-link\" (click)=\"previousPage()\" style=\"margin-left: 1px;\"><i class=\"far fa-angle-left\"></i></button></li>\r\n\t\t\t<li *ngIf=\"pageNumber > 10\" class=\"page-item\"><button type=\"button\" class=\"page-link\" (click)=\"first()\" style=\"margin-left: 1px;\">1</button></li>\r\n\t\t\t<li *ngIf=\"preDisplayEllipses === true\" class=\"page-item\"><button type=\"button\" class=\"page-link\" (click)=\"previousSet()\" style=\"margin-left: 1px;\"><i style=\"line-height: .8rem; vertical-align: bottom;\" class=\"far fa-ellipsis-h\"></i></button></li>\r\n\r\n\t\t\t<li *ngIf=\"totalPages > 10\" class=\"page-item\" style=\"margin-left: 2px;\"></li>\r\n\r\n\t\t\t<li class=\"page-item\" *ngFor=\"let displayPageNumber of preDisplayPageNumbers\">\r\n\t\t\t\t<button type=\"button\" class=\"page-link\" style=\"margin-right: 2px;\" (click)=\"selectPage(displayPageNumber)\">{{displayPageNumber}}</button>\r\n\t\t\t</li>\r\n\r\n\t\t\t<li class=\"page-item\" [class.active]=\"pageNumber === displayPageNumber\" *ngFor=\"let displayPageNumber of displayPageNumbers\">\r\n\t\t\t\t<button *ngIf=\"displayPageNumber !== -1\" type=\"button\" class=\"page-link\" (click)=\"selectPage(displayPageNumber)\">{{displayPageNumber}}</button>\r\n\t\t\t\t<div *ngIf=\"displayPageNumber === -1\" class=\"page-link ellipses px-1 text-white bg-primary\"><i class=\"far fa-ellipsis-h\" style=\"position: relative;\ttop: 4px;\"></i></div>\r\n\t\t\t</li>\r\n\r\n\t\t\t<li *ngIf=\"postDisplayPageNumbers.length > 0\" class=\"page-item\" style=\"margin-left: 2px;\"></li>\r\n\r\n\t\t\t<li class=\"page-item\" *ngFor=\"let displayPageNumber of postDisplayPageNumbers\">\r\n\t\t\t\t<button type=\"button\" class=\"page-link\" style=\"margin-right: 2px;\" (click)=\"selectPage(displayPageNumber)\">{{displayPageNumber}}</button>\r\n\t\t\t</li>\r\n\r\n\t\t\t<li *ngIf=\"postDisplayEllipses === true\" class=\"page-item\"><button type=\"button\" class=\"page-link\" (click)=\"nextSet()\" style=\"margin-right: 2px;\"><i style=\"line-height: .8rem; vertical-align: bottom;\" class=\"far fa-ellipsis-h\"></i></button></li>\r\n\t\t\t<li *ngIf=\"totalPages > 10\" class=\"page-item\" [class.disabled]=\"pageNumber === totalPages\"><button type=\"button\" class=\"page-link\" (click)=\"last()\" style=\"margin-right: 2px;\">{{totalPages}}</button></li>\r\n\t\t\t<li class=\"page-item\" [class.disabled]=\"!totalRecords || pageNumber === totalPages\"><button type=\"button\" class=\"page-link\" (click)=\"nextPage()\"><i class=\"far fa-angle-right\"></i></button></li>\r\n\t\t</ul>\r\n\t\t<div *ngIf=\"totalRecords <= 0\" style=\"font-size: .8em; line-height: 1.4em;\">&nbsp;</div>\r\n\t\t<div *ngIf=\"totalRecords > 0\" style=\"font-size: .8em; line-height: 1.4em;\">\r\n\t\t\tShowing {{currentRecordNumber}}-{{endRecordNumber}} of {{totalRecords}}\r\n\t\t</div>\r\n\t</div>\r\n</div>\r\n" }]
5500
5500
  }], ctorParameters: function () { return []; }, propDecorators: { class: [{
5501
5501
  type: HostBinding,
5502
5502
  args: ['class']
@@ -6236,10 +6236,10 @@ class SlickGridComponent {
6236
6236
  }
6237
6237
  }
6238
6238
  /** @nocollapse */ SlickGridComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SlickGridComponent, deps: [{ token: SlickGridService }, { token: SlickFunctionLockService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
6239
- /** @nocollapse */ SlickGridComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: SlickGridComponent, selector: "slick-grid", inputs: { gridOptions: "gridOptions", bordered: "bordered", striped: "striped", hover: "hover", showingAllRecords: "showingAllRecords", data: "data" }, outputs: { onRowSelected: "onRowSelected", onRowDoubleClick: "onRowDoubleClick", onRowContextMenu: "onRowContextMenu", onFavoritesModified: "onFavoritesModified" }, host: { listeners: { "window:resize": "onResize($event,$event.target)" }, properties: { "class": "this.flexColumn" } }, providers: [SlickGridService], queries: [{ propertyName: "slickGridColumnTemplates", predicate: SlickGridColumnTemplateDirective }], viewQueries: [{ propertyName: "slickGridRef", first: true, predicate: ["slickGrid"], descendants: true, static: true }, { propertyName: "tableContainerRef", first: true, predicate: ["tableContainer"], descendants: true }, { propertyName: "tableRef", first: true, predicate: ["tableRef"], descendants: true }, { propertyName: "tableHeaderRowRef", first: true, predicate: ["tableHeaderRow"], descendants: true }, { propertyName: "tableHeaderSearchRowRef", first: true, predicate: ["tableHeaderSearchRow"], descendants: true }, { propertyName: "testRowRef", first: true, predicate: ["testRow"], descendants: true }, { propertyName: "tableBodyRowsRef", first: true, predicate: ["tableBodyRows"], descendants: true }, { propertyName: "columnSelectDialogRef", first: true, predicate: ["columnSelectDialogRef"], descendants: true }, { propertyName: "addNewFavoriteDialogRef", first: true, predicate: ["addNewFavoriteDialogRef"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div id=\"slick-grid_{{uuid}}\" class=\"slick-grid d-flex flex-column flex-fill\" style=\"position: absolute; left: 0; top: 0; right: 0; bottom: 0;\" #slickGrid>\r\n\t<div #tableContainer class=\"d-flex flex-fill\" style=\"overflow: auto\">\r\n\r\n\t\t<div>\r\n\t\t\t<table #tableRef class=\"table table-sm\" [class.table-bordered]=\"bordered\" [class.table-borderless]=\"!bordered\" [class.table-striped]=\"striped\" [class.table-hover]=\"hover\" [style.opacity]=\"gridOpacity\" style=\"margin: 0; padding: 0;\" (keydown)=\"tableKeydown($event)\" tabindex=\"0\">\r\n\t\t\t\t<thead>\r\n\t\t\t\t\t<tr #tableHeaderRow (mousemove)=\"onColResizeMousemove($event)\" [ngClass]=\"{ 'resizing': isResizing === true }\">\r\n\t\t\t\t\t\t<td *ngFor=\"let column of visibleColumns; let idx = index\" [style.width]=\"column.width\" [style.maxWidth]=\"column.width\" [style.height]=\"column.titleHeight\">\r\n\t\t\t\t\t\t\t<div [ngClass]=\"{ 'slick-grid_title-vertical' : column.titleOrientation === 1 }\">\r\n\t\t\t\t\t\t\t\t<div *ngIf=\"idx > 0 && idx < visibleColumns.length\" class=\"resize_column_left\" [class.table-bordered]=\"bordered\" (mousedown)=\"onColResizeMousedown($event, idx - 1)\" (dblclick)=\"onColResizeDoubleclick($event, idx - 1)\"></div>\r\n\t\t\t\t\t\t\t\t<span class=\"sortIcon\" *ngIf=\"column.sortable === true && column.sortDirection > 0\"><i class=\"far\" [ngClass]=\"{'fa-caret-up': column.sortDirection === 1, 'fa-caret-down': column.sortDirection === 2}\"></i>&nbsp;</span>\r\n\t\t\t\t\t\t\t\t<a href=\"javascript:void(0)\" *ngIf=\"column.sortable === true\" (click)=\"sortBy(column)\" draggable=\"false\" title=\"{{column.title}}\">{{column.title}}</a>\r\n\t\t\t\t\t\t\t\t<div *ngIf=\"column.sortable === false\" title=\"{{column.title}}\">{{column.title}}</div>\r\n\t\t\t\t\t\t\t\t<div class=\"resize_column_right\" (mousedown)=\"onColResizeMousedown($event, idx)\" (dblclick)=\"onColResizeDoubleclick($event, idx)\"></div>\r\n\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t</td>\r\n\t\t\t\t\t</tr>\r\n\t\t\t\t\t<tr #tableHeaderSearchRow *ngIf=\"showSearchRow === true\">\r\n\t\t\t\t\t\t<td *ngFor=\"let column of visibleColumns\">\r\n\t\t\t\t\t\t\t<div class=\"slick-grid_search-column\">\r\n\t\t\t\t\t\t\t\t<i *ngIf=\"column.isFiltering\" class=\"fas fa-times-circle bg-white text-danger mr-1\" (click)=\"resetFilter(column)\"></i>\r\n\t\t\t\t\t\t\t\t<i *ngIf=\"column.isFiltering && column.isLocked\" class=\"far fa-lock mr-1\" (click)=\"toggleLock(column)\"></i>\r\n\t\t\t\t\t\t\t\t<i *ngIf=\"column.isFiltering && !column.isLocked\" class=\"far fa-lock-open mr-1\" (click)=\"toggleLock(column)\"></i>\r\n\t\t\t\t\t\t\t\t<div *ngIf=\"column.filterType === 1\" class=\"slick-grid_text-search\">\r\n\t\t\t\t\t\t\t\t\t<input autocomplete=\"nope\" type=\"text\" class=\"form-control\" [(ngModel)]=\"column.filterText\" name=\"searchText\" placeholder=\"Search...\" (keydown)=\"onSearch(column)\" />\r\n\t\t\t\t\t\t\t\t</div>\r\n\r\n\t\t\t\t\t\t\t\t<div *ngIf=\"column.filterType === 2\" class=\"input-group slick-grid_drop-down-search\">\r\n\t\t\t\t\t\t\t\t\t<slick-drop-down [items]=\"column.filterDropdownValues\" [(ngModel)]=\"column.filterDropdownValue\" cssClass=\"slick-grid_filter-drop-down\" listWidth=\"auto\" placeholder=\"Search...\" (onSelect)=\"onSearchSelect($event, column)\"></slick-drop-down>\r\n\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t</td>\r\n\t\t\t\t\t</tr>\r\n\t\t\t\t</thead>\r\n\r\n\t\t\t\t<tbody>\r\n\t\t\t\t\t<tr *ngIf=\"loaded && visibleData.length === 0\"><td [colSpan]=\"visibleColumns.length\">No Data</td></tr>\r\n\t\t\t\t\t<tr *ngFor=\"let rowData of visibleData; let idx = index\" #tableBodyRows (click)=\"onRowClicked(rowData, idx)\" (dblclick)=\"onRowDoubleClicked(rowData, idx)\" (contextmenu)=\"onRowContextMenuClicked($event, rowData, idx)\" [class.table-success]=\"selectedIndex === idx\">\r\n\t\t\t\t\t\t<td *ngFor=\"let column of visibleColumns\">\r\n\t\t\t\t\t\t\t<div *ngIf=\"!column.columnKey\" class=\"slick-grid_column-content\" [style.width]=\"column.width\" [style.maxWidth]=\"column.width\" [innerHTML]=\"getColumnHTML(rowData, column.dataFieldName) | slickGridSanitizeHtml\"></div>\r\n\t\t\t\t\t\t\t<div *ngIf=\"column.columnKey\" class=\"slick-grid_column-content\" [style.width]=\"column.width\" [style.maxWidth]=\"column.width\">\r\n\t\t\t\t\t\t\t\t<ng-container *ngTemplateOutlet=\"templateRefs[column.columnKey], context: { $implicit: rowData }\">\r\n\t\t\t\t\t\t\t\t</ng-container>\r\n\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t</td>\r\n\t\t\t\t\t</tr>\r\n\t\t\t\t</tbody>\r\n\t\t\t</table>\r\n\t\t</div>\r\n\t</div>\r\n\r\n\r\n\t<div class=\"slick-grid-footer mt-2 d-flex\">\r\n\t\t<div>\r\n\t\t <button type=\"button\" (click)=\"openColumnSelectDialog()\" class=\"btn btn-outline-primary\" style=\"border-radius: 100%; height: 2.2rem; width: 2.2rem; padding: 0;\"><i class=\"fal fa-columns\"></i></button>\r\n\t\t</div>\r\n\t\t<div *ngIf=\"favorites?.length > 1\">\r\n\t\t <button #favoriteSelectRef type=\"button\" class=\"btn btn-outline-primary ml-1\"><i class=\"far fa-star\"></i> {{this.selectedFavorite}}</button>\r\n\t\t <slick-popover [element]=\"favoriteSelectRef\" position=\"top\" showArrow=\"false\" [topOffsetPx]=\"0\" [leftOffsetPx]=\"0\" [showByClick]=\"true\">\r\n\t\t\t<table class=\"table-borderless table-sm table-hover\" style=\"min-width: 250px; cursor: default\">\r\n\t\t\t <tbody>\r\n\t\t\t\t<tr *ngFor=\"let favorite of favorites\" (click)=\"setFavorite(favorite.text)\">\r\n\t\t\t\t <td><i *ngIf=\"favorite.text === selectedFavorite\" class=\"far fa-star mr-1\"></i>{{favorite.text}}</td>\r\n\t\t\t\t</tr>\r\n\t\t\t </tbody>\r\n\t\t\t</table>\r\n\t\t </slick-popover>\r\n\t\t</div>\r\n\t\t<div *ngIf=\"showingAllRecords == false\">\r\n\t\t <slick-paging [(pageNumber)]=\"currentPage\" [totalRecords]=\"totalRecords\" [recordsPerPage]=\"recordsPerPage\" (onPageChange)=\"onPageChange($event)\"></slick-paging>\r\n\t\t</div>\r\n\t\t<div class=\"ml-auto\">\r\n\t\t <button #recordsPerPageRef type=\"button\" class=\"btn btn-outline-primary\">{{recordsPerPageValue}}&nbsp;&nbsp;<i style=\"font-size: 12px;\" class=\"far fa-chevron-down\"></i></button>\r\n\t\t <slick-popover [element]=\"recordsPerPageRef\" position=\"top\" showArrow=\"false\" [topOffsetPx]=\"0\" [leftOffsetPx]=\"0\" [showByClick]=\"true\">\r\n\t\t\t<table class=\"table-borderless table-sm table-hover\" style=\"min-width: 150px;\">\r\n\t\t\t <tbody>\r\n\t\t\t\t<tr (click)=\"onRecordsPerPageSelected('Auto')\"><td>Auto</td></tr>\r\n\t\t\t\t<tr (click)=\"onRecordsPerPageSelected('25')\"><td>25</td></tr>\r\n\t\t\t\t<tr (click)=\"onRecordsPerPageSelected('50')\"><td>50</td></tr>\r\n\t\t\t\t<tr (click)=\"onRecordsPerPageSelected('100')\"><td>100</td></tr>\r\n\t\t\t </tbody>\r\n\t\t\t</table>\r\n\t\t </slick-popover>\r\n\t\t</div>\r\n\t </div>\r\n\t \r\n</div>\r\n\r\n<slick-dialog #columnSelectDialogRef header=\"Select Columns\">\r\n\t<div style=\"text-align: center; width: 475px;\" class=\"mx-5\">\r\n\t\t<div class=\"d-flex\">\r\n\t\t\t<div class=\"flex-fill\">\r\n\t\t\t\t<slick-drop-down [items]=\"favorites\"\r\n\t\t\t\t\t\t\t\t [ngModel]=\"selectedFavorite\"\r\n\t\t\t\t\t\t\t\t (onSelect)=\"loadFavorite($event)\"></slick-drop-down>\r\n\t\t\t</div>\r\n\t\t\t<div><button class=\"btn btn-outline-primary ml-1\" (click)=\"addNewFavorite()\"><i class=\"far fa-plus\"></i></button></div>\r\n\t\t</div>\r\n\t\t<div class=\"d-flex flex-column mt-1\" slick-drop-list (onSlickDropListReorder)=\"onColumnReorder($event)\">\r\n\t\t\t<div *ngFor=\"let column of columnSelectDialogColumns\" class=\"d-flex\" slick-drop-list-item>\r\n\t\t\t\t<div style=\"width: 20px\"><input type=\"checkbox\" style=\"position: relative; top: 2px;\" [(ngModel)]=\"column.visible\" /></div>\r\n\t\t\t\t<div class=\"py-0 flex-fill\" style=\"text-align: left; cursor: ns-resize\" slick-drop-list-grab>{{column.title}}</div>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t</div>\r\n\t<slick-dialog-footer>\r\n\t\t<div style=\"margin-top: 10px;\" class=\"col-12 text-center mb-2 mt-1\">\r\n\t\t\t<button type=\"button\" (click)=\"onSaveColumns()\" class=\"btn btn-outline-primary mr-1\"><i class=\"far fa-save\"></i>&nbsp;Save</button>&nbsp;\r\n\t\t\t<button type=\"button\" class=\"btn btn-outline-danger\" (click)=\"onCancelColumns()\">Cancel</button>\r\n\t\t</div>\r\n\t</slick-dialog-footer>\r\n</slick-dialog>\r\n\r\n\r\n<slick-confirm-dialog #addNewFavoriteDialogRef width=\"300\">\r\n\t<label>Enter new favorite name</label>\r\n\t<input type=\"text\" class=\"form-control mx-3\" style=\"width: 250px\" [(ngModel)]=\"newFavoriteText\" />\r\n</slick-confirm-dialog>", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SlickConfirmDialogComponent, selector: "slick-confirm-dialog", inputs: ["width", "okButtonText", "cancelButtonText", "showOkButton", "showCancelButton"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: SlickPopoverComponent, selector: "slick-popover", inputs: ["element", "position", "hoverDelay", "outDelay", "alignment", "topOffsetPx", "leftOffsetPx", "whiteBackground", "showByClick", "showArrow"] }, { kind: "component", type: SlickDialogComponent, selector: "slick-dialog", inputs: ["draggable", "resizable", "minimizable", "header", "showHeader", "noPadding", "top", "width", "height", "maxHeight", "cssClass", "key", "showOverlay", "disableScrollbar"], outputs: ["onClose"] }, { kind: "component", type: SlickDialogFooterComponent, selector: "slick-dialog-footer" }, { kind: "component", type: SlickDropDownComponent, selector: "slick-drop-down", inputs: ["placeholder", "items", "idFieldName", "textFieldName", "compact", "disabled", "allowEmpty", "getUrl", "width", "listWidth", "height", "showLoadingMessage", "showDebug", "tabindex", "validationIndicator", "validationIndicatorType", "attachTo", "searchType", "icon", "isMobile", "cssClass"], outputs: ["onExpand", "onSelect", "onChange"] }, { kind: "directive", type: SlickDropListDirective, selector: "[slick-drop-list]", outputs: ["onSlickDropListReorder", "onSlickDropListEnter", "onSlickDropListLeave"] }, { kind: "directive", type: SlickDropListItemDirective, selector: "[slick-drop-list-item]" }, { kind: "directive", type: SlickDropListGrabDirective, selector: "[slick-drop-list-grab]" }, { kind: "component", type: SlickPagingComponent, selector: "slick-paging", inputs: ["pageNumber", "totalRecords", "recordsPerPage"], outputs: ["pageNumberChange", "onPageChange"] }, { kind: "pipe", type: SlickGridSanitizeHtmlPipe, name: "slickGridSanitizeHtml" }] });
6239
+ /** @nocollapse */ SlickGridComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: SlickGridComponent, selector: "slick-grid", inputs: { gridOptions: "gridOptions", bordered: "bordered", striped: "striped", hover: "hover", showingAllRecords: "showingAllRecords", data: "data" }, outputs: { onRowSelected: "onRowSelected", onRowDoubleClick: "onRowDoubleClick", onRowContextMenu: "onRowContextMenu", onFavoritesModified: "onFavoritesModified" }, host: { listeners: { "window:resize": "onResize($event,$event.target)" }, properties: { "class": "this.flexColumn" } }, providers: [SlickGridService], queries: [{ propertyName: "slickGridColumnTemplates", predicate: SlickGridColumnTemplateDirective }], viewQueries: [{ propertyName: "slickGridRef", first: true, predicate: ["slickGrid"], descendants: true, static: true }, { propertyName: "tableContainerRef", first: true, predicate: ["tableContainer"], descendants: true }, { propertyName: "tableRef", first: true, predicate: ["tableRef"], descendants: true }, { propertyName: "tableHeaderRowRef", first: true, predicate: ["tableHeaderRow"], descendants: true }, { propertyName: "tableHeaderSearchRowRef", first: true, predicate: ["tableHeaderSearchRow"], descendants: true }, { propertyName: "testRowRef", first: true, predicate: ["testRow"], descendants: true }, { propertyName: "tableBodyRowsRef", first: true, predicate: ["tableBodyRows"], descendants: true }, { propertyName: "columnSelectDialogRef", first: true, predicate: ["columnSelectDialogRef"], descendants: true }, { propertyName: "addNewFavoriteDialogRef", first: true, predicate: ["addNewFavoriteDialogRef"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div id=\"slick-grid_{{uuid}}\" class=\"slick-grid d-flex flex-column flex-fill\" style=\"position: absolute; left: 0; top: 0; right: 0; bottom: 0;\" #slickGrid>\r\n\t<div #tableContainer class=\"d-flex flex-fill\" style=\"overflow: auto\">\r\n\r\n\t\t<div>\r\n\t\t\t<table #tableRef class=\"table table-sm\" [class.table-bordered]=\"bordered\" [class.table-borderless]=\"!bordered\" [class.table-striped]=\"striped\" [class.table-hover]=\"hover\" [style.opacity]=\"gridOpacity\" style=\"margin: 0; padding: 0;\" (keydown)=\"tableKeydown($event)\" tabindex=\"0\">\r\n\t\t\t\t<thead>\r\n\t\t\t\t\t<tr #tableHeaderRow (mousemove)=\"onColResizeMousemove($event)\" [ngClass]=\"{ 'resizing': isResizing === true }\">\r\n\t\t\t\t\t\t<td *ngFor=\"let column of visibleColumns; let idx = index\" [style.width]=\"column.width\" [style.maxWidth]=\"column.width\" [style.height]=\"column.titleHeight\">\r\n\t\t\t\t\t\t\t<div [ngClass]=\"{ 'slick-grid_title-vertical' : column.titleOrientation === 1 }\">\r\n\t\t\t\t\t\t\t\t<div *ngIf=\"idx > 0 && idx < visibleColumns.length\" class=\"resize_column_left\" [class.table-bordered]=\"bordered\" (mousedown)=\"onColResizeMousedown($event, idx - 1)\" (dblclick)=\"onColResizeDoubleclick($event, idx - 1)\"></div>\r\n\t\t\t\t\t\t\t\t<span class=\"sortIcon\" *ngIf=\"column.sortable === true && column.sortDirection > 0\"><i class=\"far\" [ngClass]=\"{'fa-caret-up': column.sortDirection === 1, 'fa-caret-down': column.sortDirection === 2}\"></i>&nbsp;</span>\r\n\t\t\t\t\t\t\t\t<a href=\"javascript:void(0)\" *ngIf=\"column.sortable === true\" (click)=\"sortBy(column)\" draggable=\"false\" title=\"{{column.title}}\">{{column.title}}</a>\r\n\t\t\t\t\t\t\t\t<div *ngIf=\"column.sortable === false\" title=\"{{column.title}}\">{{column.title}}</div>\r\n\t\t\t\t\t\t\t\t<div class=\"resize_column_right\" (mousedown)=\"onColResizeMousedown($event, idx)\" (dblclick)=\"onColResizeDoubleclick($event, idx)\"></div>\r\n\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t</td>\r\n\t\t\t\t\t</tr>\r\n\t\t\t\t\t<tr #tableHeaderSearchRow *ngIf=\"showSearchRow === true\">\r\n\t\t\t\t\t\t<td *ngFor=\"let column of visibleColumns\">\r\n\t\t\t\t\t\t\t<div class=\"slick-grid_search-column\">\r\n\t\t\t\t\t\t\t\t<i *ngIf=\"column.isFiltering\" class=\"fas fa-times-circle bg-white text-danger me-1\" (click)=\"resetFilter(column)\"></i>\r\n\t\t\t\t\t\t\t\t<i *ngIf=\"column.isFiltering && column.isLocked\" class=\"far fa-lock me-1\" (click)=\"toggleLock(column)\"></i>\r\n\t\t\t\t\t\t\t\t<i *ngIf=\"column.isFiltering && !column.isLocked\" class=\"far fa-lock-open me-1\" (click)=\"toggleLock(column)\"></i>\r\n\t\t\t\t\t\t\t\t<div *ngIf=\"column.filterType === 1\" class=\"slick-grid_text-search\">\r\n\t\t\t\t\t\t\t\t\t<input autocomplete=\"nope\" type=\"text\" class=\"form-control\" [(ngModel)]=\"column.filterText\" name=\"searchText\" placeholder=\"Search...\" (keydown)=\"onSearch(column)\" />\r\n\t\t\t\t\t\t\t\t</div>\r\n\r\n\t\t\t\t\t\t\t\t<div *ngIf=\"column.filterType === 2\" class=\"input-group slick-grid_drop-down-search\">\r\n\t\t\t\t\t\t\t\t\t<slick-drop-down [items]=\"column.filterDropdownValues\" [(ngModel)]=\"column.filterDropdownValue\" cssClass=\"slick-grid_filter-drop-down\" listWidth=\"auto\" placeholder=\"Search...\" (onSelect)=\"onSearchSelect($event, column)\"></slick-drop-down>\r\n\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t</td>\r\n\t\t\t\t\t</tr>\r\n\t\t\t\t</thead>\r\n\r\n\t\t\t\t<tbody>\r\n\t\t\t\t\t<tr *ngIf=\"loaded && visibleData.length === 0\"><td [colSpan]=\"visibleColumns.length\">No Data</td></tr>\r\n\t\t\t\t\t<tr *ngFor=\"let rowData of visibleData; let idx = index\" #tableBodyRows (click)=\"onRowClicked(rowData, idx)\" (dblclick)=\"onRowDoubleClicked(rowData, idx)\" (contextmenu)=\"onRowContextMenuClicked($event, rowData, idx)\" [class.table-success]=\"selectedIndex === idx\">\r\n\t\t\t\t\t\t<td *ngFor=\"let column of visibleColumns\">\r\n\t\t\t\t\t\t\t<div *ngIf=\"!column.columnKey\" class=\"slick-grid_column-content\" [style.width]=\"column.width\" [style.maxWidth]=\"column.width\" [innerHTML]=\"getColumnHTML(rowData, column.dataFieldName) | slickGridSanitizeHtml\"></div>\r\n\t\t\t\t\t\t\t<div *ngIf=\"column.columnKey\" class=\"slick-grid_column-content\" [style.width]=\"column.width\" [style.maxWidth]=\"column.width\">\r\n\t\t\t\t\t\t\t\t<ng-container *ngTemplateOutlet=\"templateRefs[column.columnKey], context: { $implicit: rowData }\">\r\n\t\t\t\t\t\t\t\t</ng-container>\r\n\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t</td>\r\n\t\t\t\t\t</tr>\r\n\t\t\t\t</tbody>\r\n\t\t\t</table>\r\n\t\t</div>\r\n\t</div>\r\n\r\n\r\n\t<div class=\"slick-grid-footer mt-2 d-flex\">\r\n\t\t<div>\r\n\t\t <button type=\"button\" (click)=\"openColumnSelectDialog()\" class=\"btn btn-outline-primary\" style=\"border-radius: 100%; height: 2.2rem; width: 2.2rem; padding: 0;\"><i class=\"fal fa-columns\"></i></button>\r\n\t\t</div>\r\n\t\t<div *ngIf=\"favorites?.length > 1\">\r\n\t\t <button #favoriteSelectRef type=\"button\" class=\"btn btn-outline-primary ms-1\"><i class=\"far fa-star\"></i> {{this.selectedFavorite}}</button>\r\n\t\t <slick-popover [element]=\"favoriteSelectRef\" position=\"top\" showArrow=\"false\" [topOffsetPx]=\"0\" [leftOffsetPx]=\"0\" [showByClick]=\"true\">\r\n\t\t\t<table class=\"table-borderless table-sm table-hover\" style=\"min-width: 250px; cursor: default\">\r\n\t\t\t <tbody>\r\n\t\t\t\t<tr *ngFor=\"let favorite of favorites\" (click)=\"setFavorite(favorite.text)\">\r\n\t\t\t\t <td><i *ngIf=\"favorite.text === selectedFavorite\" class=\"far fa-star me-1\"></i>{{favorite.text}}</td>\r\n\t\t\t\t</tr>\r\n\t\t\t </tbody>\r\n\t\t\t</table>\r\n\t\t </slick-popover>\r\n\t\t</div>\r\n\t\t<div *ngIf=\"showingAllRecords == false\">\r\n\t\t <slick-paging [(pageNumber)]=\"currentPage\" [totalRecords]=\"totalRecords\" [recordsPerPage]=\"recordsPerPage\" (onPageChange)=\"onPageChange($event)\"></slick-paging>\r\n\t\t</div>\r\n\t\t<div class=\"ms-auto\">\r\n\t\t <button #recordsPerPageRef type=\"button\" class=\"btn btn-outline-primary\">{{recordsPerPageValue}}&nbsp;&nbsp;<i style=\"font-size: 12px;\" class=\"far fa-chevron-down\"></i></button>\r\n\t\t <slick-popover [element]=\"recordsPerPageRef\" position=\"top\" showArrow=\"false\" [topOffsetPx]=\"0\" [leftOffsetPx]=\"0\" [showByClick]=\"true\">\r\n\t\t\t<table class=\"table-borderless table-sm table-hover\" style=\"min-width: 150px;\">\r\n\t\t\t <tbody>\r\n\t\t\t\t<tr (click)=\"onRecordsPerPageSelected('Auto')\"><td>Auto</td></tr>\r\n\t\t\t\t<tr (click)=\"onRecordsPerPageSelected('25')\"><td>25</td></tr>\r\n\t\t\t\t<tr (click)=\"onRecordsPerPageSelected('50')\"><td>50</td></tr>\r\n\t\t\t\t<tr (click)=\"onRecordsPerPageSelected('100')\"><td>100</td></tr>\r\n\t\t\t </tbody>\r\n\t\t\t</table>\r\n\t\t </slick-popover>\r\n\t\t</div>\r\n\t </div>\r\n\t \r\n</div>\r\n\r\n<slick-dialog #columnSelectDialogRef header=\"Select Columns\">\r\n\t<div style=\"text-align: center; width: 475px;\" class=\"mx-5\">\r\n\t\t<div class=\"d-flex\">\r\n\t\t\t<div class=\"flex-fill\">\r\n\t\t\t\t<slick-drop-down [items]=\"favorites\"\r\n\t\t\t\t\t\t\t\t [ngModel]=\"selectedFavorite\"\r\n\t\t\t\t\t\t\t\t (onSelect)=\"loadFavorite($event)\"></slick-drop-down>\r\n\t\t\t</div>\r\n\t\t\t<div><button class=\"btn btn-outline-primary ms-1\" (click)=\"addNewFavorite()\"><i class=\"far fa-plus\"></i></button></div>\r\n\t\t</div>\r\n\t\t<div class=\"d-flex flex-column mt-1\" slick-drop-list (onSlickDropListReorder)=\"onColumnReorder($event)\">\r\n\t\t\t<div *ngFor=\"let column of columnSelectDialogColumns\" class=\"d-flex\" slick-drop-list-item>\r\n\t\t\t\t<div style=\"width: 20px\"><input type=\"checkbox\" style=\"position: relative; top: 2px;\" [(ngModel)]=\"column.visible\" /></div>\r\n\t\t\t\t<div class=\"py-0 flex-fill\" style=\"text-align: left; cursor: ns-resize\" slick-drop-list-grab>{{column.title}}</div>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t</div>\r\n\t<slick-dialog-footer>\r\n\t\t<div style=\"margin-top: 10px;\" class=\"col-12 text-center mb-2 mt-1\">\r\n\t\t\t<button type=\"button\" (click)=\"onSaveColumns()\" class=\"btn btn-outline-primary me-1\"><i class=\"far fa-save\"></i>&nbsp;Save</button>&nbsp;\r\n\t\t\t<button type=\"button\" class=\"btn btn-outline-danger\" (click)=\"onCancelColumns()\">Cancel</button>\r\n\t\t</div>\r\n\t</slick-dialog-footer>\r\n</slick-dialog>\r\n\r\n\r\n<slick-confirm-dialog #addNewFavoriteDialogRef width=\"300\">\r\n\t<label>Enter new favorite name</label>\r\n\t<input type=\"text\" class=\"form-control mx-3\" style=\"width: 250px\" [(ngModel)]=\"newFavoriteText\" />\r\n</slick-confirm-dialog>", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SlickConfirmDialogComponent, selector: "slick-confirm-dialog", inputs: ["width", "okButtonText", "cancelButtonText", "showOkButton", "showCancelButton"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: SlickPopoverComponent, selector: "slick-popover", inputs: ["element", "position", "hoverDelay", "outDelay", "alignment", "topOffsetPx", "leftOffsetPx", "whiteBackground", "showByClick", "showArrow"] }, { kind: "component", type: SlickDialogComponent, selector: "slick-dialog", inputs: ["draggable", "resizable", "minimizable", "header", "showHeader", "noPadding", "top", "width", "height", "maxHeight", "cssClass", "key", "showOverlay", "disableScrollbar"], outputs: ["onClose"] }, { kind: "component", type: SlickDialogFooterComponent, selector: "slick-dialog-footer" }, { kind: "component", type: SlickDropDownComponent, selector: "slick-drop-down", inputs: ["placeholder", "items", "idFieldName", "textFieldName", "compact", "disabled", "allowEmpty", "getUrl", "width", "listWidth", "height", "showLoadingMessage", "showDebug", "tabindex", "validationIndicator", "validationIndicatorType", "attachTo", "searchType", "icon", "isMobile", "cssClass"], outputs: ["onExpand", "onSelect", "onChange"] }, { kind: "directive", type: SlickDropListDirective, selector: "[slick-drop-list]", outputs: ["onSlickDropListReorder", "onSlickDropListEnter", "onSlickDropListLeave"] }, { kind: "directive", type: SlickDropListItemDirective, selector: "[slick-drop-list-item]" }, { kind: "directive", type: SlickDropListGrabDirective, selector: "[slick-drop-list-grab]" }, { kind: "component", type: SlickPagingComponent, selector: "slick-paging", inputs: ["pageNumber", "totalRecords", "recordsPerPage"], outputs: ["pageNumberChange", "onPageChange"] }, { kind: "pipe", type: SlickGridSanitizeHtmlPipe, name: "slickGridSanitizeHtml" }] });
6240
6240
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SlickGridComponent, decorators: [{
6241
6241
  type: Component,
6242
- args: [{ selector: 'slick-grid', providers: [SlickGridService], template: "<div id=\"slick-grid_{{uuid}}\" class=\"slick-grid d-flex flex-column flex-fill\" style=\"position: absolute; left: 0; top: 0; right: 0; bottom: 0;\" #slickGrid>\r\n\t<div #tableContainer class=\"d-flex flex-fill\" style=\"overflow: auto\">\r\n\r\n\t\t<div>\r\n\t\t\t<table #tableRef class=\"table table-sm\" [class.table-bordered]=\"bordered\" [class.table-borderless]=\"!bordered\" [class.table-striped]=\"striped\" [class.table-hover]=\"hover\" [style.opacity]=\"gridOpacity\" style=\"margin: 0; padding: 0;\" (keydown)=\"tableKeydown($event)\" tabindex=\"0\">\r\n\t\t\t\t<thead>\r\n\t\t\t\t\t<tr #tableHeaderRow (mousemove)=\"onColResizeMousemove($event)\" [ngClass]=\"{ 'resizing': isResizing === true }\">\r\n\t\t\t\t\t\t<td *ngFor=\"let column of visibleColumns; let idx = index\" [style.width]=\"column.width\" [style.maxWidth]=\"column.width\" [style.height]=\"column.titleHeight\">\r\n\t\t\t\t\t\t\t<div [ngClass]=\"{ 'slick-grid_title-vertical' : column.titleOrientation === 1 }\">\r\n\t\t\t\t\t\t\t\t<div *ngIf=\"idx > 0 && idx < visibleColumns.length\" class=\"resize_column_left\" [class.table-bordered]=\"bordered\" (mousedown)=\"onColResizeMousedown($event, idx - 1)\" (dblclick)=\"onColResizeDoubleclick($event, idx - 1)\"></div>\r\n\t\t\t\t\t\t\t\t<span class=\"sortIcon\" *ngIf=\"column.sortable === true && column.sortDirection > 0\"><i class=\"far\" [ngClass]=\"{'fa-caret-up': column.sortDirection === 1, 'fa-caret-down': column.sortDirection === 2}\"></i>&nbsp;</span>\r\n\t\t\t\t\t\t\t\t<a href=\"javascript:void(0)\" *ngIf=\"column.sortable === true\" (click)=\"sortBy(column)\" draggable=\"false\" title=\"{{column.title}}\">{{column.title}}</a>\r\n\t\t\t\t\t\t\t\t<div *ngIf=\"column.sortable === false\" title=\"{{column.title}}\">{{column.title}}</div>\r\n\t\t\t\t\t\t\t\t<div class=\"resize_column_right\" (mousedown)=\"onColResizeMousedown($event, idx)\" (dblclick)=\"onColResizeDoubleclick($event, idx)\"></div>\r\n\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t</td>\r\n\t\t\t\t\t</tr>\r\n\t\t\t\t\t<tr #tableHeaderSearchRow *ngIf=\"showSearchRow === true\">\r\n\t\t\t\t\t\t<td *ngFor=\"let column of visibleColumns\">\r\n\t\t\t\t\t\t\t<div class=\"slick-grid_search-column\">\r\n\t\t\t\t\t\t\t\t<i *ngIf=\"column.isFiltering\" class=\"fas fa-times-circle bg-white text-danger mr-1\" (click)=\"resetFilter(column)\"></i>\r\n\t\t\t\t\t\t\t\t<i *ngIf=\"column.isFiltering && column.isLocked\" class=\"far fa-lock mr-1\" (click)=\"toggleLock(column)\"></i>\r\n\t\t\t\t\t\t\t\t<i *ngIf=\"column.isFiltering && !column.isLocked\" class=\"far fa-lock-open mr-1\" (click)=\"toggleLock(column)\"></i>\r\n\t\t\t\t\t\t\t\t<div *ngIf=\"column.filterType === 1\" class=\"slick-grid_text-search\">\r\n\t\t\t\t\t\t\t\t\t<input autocomplete=\"nope\" type=\"text\" class=\"form-control\" [(ngModel)]=\"column.filterText\" name=\"searchText\" placeholder=\"Search...\" (keydown)=\"onSearch(column)\" />\r\n\t\t\t\t\t\t\t\t</div>\r\n\r\n\t\t\t\t\t\t\t\t<div *ngIf=\"column.filterType === 2\" class=\"input-group slick-grid_drop-down-search\">\r\n\t\t\t\t\t\t\t\t\t<slick-drop-down [items]=\"column.filterDropdownValues\" [(ngModel)]=\"column.filterDropdownValue\" cssClass=\"slick-grid_filter-drop-down\" listWidth=\"auto\" placeholder=\"Search...\" (onSelect)=\"onSearchSelect($event, column)\"></slick-drop-down>\r\n\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t</td>\r\n\t\t\t\t\t</tr>\r\n\t\t\t\t</thead>\r\n\r\n\t\t\t\t<tbody>\r\n\t\t\t\t\t<tr *ngIf=\"loaded && visibleData.length === 0\"><td [colSpan]=\"visibleColumns.length\">No Data</td></tr>\r\n\t\t\t\t\t<tr *ngFor=\"let rowData of visibleData; let idx = index\" #tableBodyRows (click)=\"onRowClicked(rowData, idx)\" (dblclick)=\"onRowDoubleClicked(rowData, idx)\" (contextmenu)=\"onRowContextMenuClicked($event, rowData, idx)\" [class.table-success]=\"selectedIndex === idx\">\r\n\t\t\t\t\t\t<td *ngFor=\"let column of visibleColumns\">\r\n\t\t\t\t\t\t\t<div *ngIf=\"!column.columnKey\" class=\"slick-grid_column-content\" [style.width]=\"column.width\" [style.maxWidth]=\"column.width\" [innerHTML]=\"getColumnHTML(rowData, column.dataFieldName) | slickGridSanitizeHtml\"></div>\r\n\t\t\t\t\t\t\t<div *ngIf=\"column.columnKey\" class=\"slick-grid_column-content\" [style.width]=\"column.width\" [style.maxWidth]=\"column.width\">\r\n\t\t\t\t\t\t\t\t<ng-container *ngTemplateOutlet=\"templateRefs[column.columnKey], context: { $implicit: rowData }\">\r\n\t\t\t\t\t\t\t\t</ng-container>\r\n\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t</td>\r\n\t\t\t\t\t</tr>\r\n\t\t\t\t</tbody>\r\n\t\t\t</table>\r\n\t\t</div>\r\n\t</div>\r\n\r\n\r\n\t<div class=\"slick-grid-footer mt-2 d-flex\">\r\n\t\t<div>\r\n\t\t <button type=\"button\" (click)=\"openColumnSelectDialog()\" class=\"btn btn-outline-primary\" style=\"border-radius: 100%; height: 2.2rem; width: 2.2rem; padding: 0;\"><i class=\"fal fa-columns\"></i></button>\r\n\t\t</div>\r\n\t\t<div *ngIf=\"favorites?.length > 1\">\r\n\t\t <button #favoriteSelectRef type=\"button\" class=\"btn btn-outline-primary ml-1\"><i class=\"far fa-star\"></i> {{this.selectedFavorite}}</button>\r\n\t\t <slick-popover [element]=\"favoriteSelectRef\" position=\"top\" showArrow=\"false\" [topOffsetPx]=\"0\" [leftOffsetPx]=\"0\" [showByClick]=\"true\">\r\n\t\t\t<table class=\"table-borderless table-sm table-hover\" style=\"min-width: 250px; cursor: default\">\r\n\t\t\t <tbody>\r\n\t\t\t\t<tr *ngFor=\"let favorite of favorites\" (click)=\"setFavorite(favorite.text)\">\r\n\t\t\t\t <td><i *ngIf=\"favorite.text === selectedFavorite\" class=\"far fa-star mr-1\"></i>{{favorite.text}}</td>\r\n\t\t\t\t</tr>\r\n\t\t\t </tbody>\r\n\t\t\t</table>\r\n\t\t </slick-popover>\r\n\t\t</div>\r\n\t\t<div *ngIf=\"showingAllRecords == false\">\r\n\t\t <slick-paging [(pageNumber)]=\"currentPage\" [totalRecords]=\"totalRecords\" [recordsPerPage]=\"recordsPerPage\" (onPageChange)=\"onPageChange($event)\"></slick-paging>\r\n\t\t</div>\r\n\t\t<div class=\"ml-auto\">\r\n\t\t <button #recordsPerPageRef type=\"button\" class=\"btn btn-outline-primary\">{{recordsPerPageValue}}&nbsp;&nbsp;<i style=\"font-size: 12px;\" class=\"far fa-chevron-down\"></i></button>\r\n\t\t <slick-popover [element]=\"recordsPerPageRef\" position=\"top\" showArrow=\"false\" [topOffsetPx]=\"0\" [leftOffsetPx]=\"0\" [showByClick]=\"true\">\r\n\t\t\t<table class=\"table-borderless table-sm table-hover\" style=\"min-width: 150px;\">\r\n\t\t\t <tbody>\r\n\t\t\t\t<tr (click)=\"onRecordsPerPageSelected('Auto')\"><td>Auto</td></tr>\r\n\t\t\t\t<tr (click)=\"onRecordsPerPageSelected('25')\"><td>25</td></tr>\r\n\t\t\t\t<tr (click)=\"onRecordsPerPageSelected('50')\"><td>50</td></tr>\r\n\t\t\t\t<tr (click)=\"onRecordsPerPageSelected('100')\"><td>100</td></tr>\r\n\t\t\t </tbody>\r\n\t\t\t</table>\r\n\t\t </slick-popover>\r\n\t\t</div>\r\n\t </div>\r\n\t \r\n</div>\r\n\r\n<slick-dialog #columnSelectDialogRef header=\"Select Columns\">\r\n\t<div style=\"text-align: center; width: 475px;\" class=\"mx-5\">\r\n\t\t<div class=\"d-flex\">\r\n\t\t\t<div class=\"flex-fill\">\r\n\t\t\t\t<slick-drop-down [items]=\"favorites\"\r\n\t\t\t\t\t\t\t\t [ngModel]=\"selectedFavorite\"\r\n\t\t\t\t\t\t\t\t (onSelect)=\"loadFavorite($event)\"></slick-drop-down>\r\n\t\t\t</div>\r\n\t\t\t<div><button class=\"btn btn-outline-primary ml-1\" (click)=\"addNewFavorite()\"><i class=\"far fa-plus\"></i></button></div>\r\n\t\t</div>\r\n\t\t<div class=\"d-flex flex-column mt-1\" slick-drop-list (onSlickDropListReorder)=\"onColumnReorder($event)\">\r\n\t\t\t<div *ngFor=\"let column of columnSelectDialogColumns\" class=\"d-flex\" slick-drop-list-item>\r\n\t\t\t\t<div style=\"width: 20px\"><input type=\"checkbox\" style=\"position: relative; top: 2px;\" [(ngModel)]=\"column.visible\" /></div>\r\n\t\t\t\t<div class=\"py-0 flex-fill\" style=\"text-align: left; cursor: ns-resize\" slick-drop-list-grab>{{column.title}}</div>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t</div>\r\n\t<slick-dialog-footer>\r\n\t\t<div style=\"margin-top: 10px;\" class=\"col-12 text-center mb-2 mt-1\">\r\n\t\t\t<button type=\"button\" (click)=\"onSaveColumns()\" class=\"btn btn-outline-primary mr-1\"><i class=\"far fa-save\"></i>&nbsp;Save</button>&nbsp;\r\n\t\t\t<button type=\"button\" class=\"btn btn-outline-danger\" (click)=\"onCancelColumns()\">Cancel</button>\r\n\t\t</div>\r\n\t</slick-dialog-footer>\r\n</slick-dialog>\r\n\r\n\r\n<slick-confirm-dialog #addNewFavoriteDialogRef width=\"300\">\r\n\t<label>Enter new favorite name</label>\r\n\t<input type=\"text\" class=\"form-control mx-3\" style=\"width: 250px\" [(ngModel)]=\"newFavoriteText\" />\r\n</slick-confirm-dialog>" }]
6242
+ args: [{ selector: 'slick-grid', providers: [SlickGridService], template: "<div id=\"slick-grid_{{uuid}}\" class=\"slick-grid d-flex flex-column flex-fill\" style=\"position: absolute; left: 0; top: 0; right: 0; bottom: 0;\" #slickGrid>\r\n\t<div #tableContainer class=\"d-flex flex-fill\" style=\"overflow: auto\">\r\n\r\n\t\t<div>\r\n\t\t\t<table #tableRef class=\"table table-sm\" [class.table-bordered]=\"bordered\" [class.table-borderless]=\"!bordered\" [class.table-striped]=\"striped\" [class.table-hover]=\"hover\" [style.opacity]=\"gridOpacity\" style=\"margin: 0; padding: 0;\" (keydown)=\"tableKeydown($event)\" tabindex=\"0\">\r\n\t\t\t\t<thead>\r\n\t\t\t\t\t<tr #tableHeaderRow (mousemove)=\"onColResizeMousemove($event)\" [ngClass]=\"{ 'resizing': isResizing === true }\">\r\n\t\t\t\t\t\t<td *ngFor=\"let column of visibleColumns; let idx = index\" [style.width]=\"column.width\" [style.maxWidth]=\"column.width\" [style.height]=\"column.titleHeight\">\r\n\t\t\t\t\t\t\t<div [ngClass]=\"{ 'slick-grid_title-vertical' : column.titleOrientation === 1 }\">\r\n\t\t\t\t\t\t\t\t<div *ngIf=\"idx > 0 && idx < visibleColumns.length\" class=\"resize_column_left\" [class.table-bordered]=\"bordered\" (mousedown)=\"onColResizeMousedown($event, idx - 1)\" (dblclick)=\"onColResizeDoubleclick($event, idx - 1)\"></div>\r\n\t\t\t\t\t\t\t\t<span class=\"sortIcon\" *ngIf=\"column.sortable === true && column.sortDirection > 0\"><i class=\"far\" [ngClass]=\"{'fa-caret-up': column.sortDirection === 1, 'fa-caret-down': column.sortDirection === 2}\"></i>&nbsp;</span>\r\n\t\t\t\t\t\t\t\t<a href=\"javascript:void(0)\" *ngIf=\"column.sortable === true\" (click)=\"sortBy(column)\" draggable=\"false\" title=\"{{column.title}}\">{{column.title}}</a>\r\n\t\t\t\t\t\t\t\t<div *ngIf=\"column.sortable === false\" title=\"{{column.title}}\">{{column.title}}</div>\r\n\t\t\t\t\t\t\t\t<div class=\"resize_column_right\" (mousedown)=\"onColResizeMousedown($event, idx)\" (dblclick)=\"onColResizeDoubleclick($event, idx)\"></div>\r\n\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t</td>\r\n\t\t\t\t\t</tr>\r\n\t\t\t\t\t<tr #tableHeaderSearchRow *ngIf=\"showSearchRow === true\">\r\n\t\t\t\t\t\t<td *ngFor=\"let column of visibleColumns\">\r\n\t\t\t\t\t\t\t<div class=\"slick-grid_search-column\">\r\n\t\t\t\t\t\t\t\t<i *ngIf=\"column.isFiltering\" class=\"fas fa-times-circle bg-white text-danger me-1\" (click)=\"resetFilter(column)\"></i>\r\n\t\t\t\t\t\t\t\t<i *ngIf=\"column.isFiltering && column.isLocked\" class=\"far fa-lock me-1\" (click)=\"toggleLock(column)\"></i>\r\n\t\t\t\t\t\t\t\t<i *ngIf=\"column.isFiltering && !column.isLocked\" class=\"far fa-lock-open me-1\" (click)=\"toggleLock(column)\"></i>\r\n\t\t\t\t\t\t\t\t<div *ngIf=\"column.filterType === 1\" class=\"slick-grid_text-search\">\r\n\t\t\t\t\t\t\t\t\t<input autocomplete=\"nope\" type=\"text\" class=\"form-control\" [(ngModel)]=\"column.filterText\" name=\"searchText\" placeholder=\"Search...\" (keydown)=\"onSearch(column)\" />\r\n\t\t\t\t\t\t\t\t</div>\r\n\r\n\t\t\t\t\t\t\t\t<div *ngIf=\"column.filterType === 2\" class=\"input-group slick-grid_drop-down-search\">\r\n\t\t\t\t\t\t\t\t\t<slick-drop-down [items]=\"column.filterDropdownValues\" [(ngModel)]=\"column.filterDropdownValue\" cssClass=\"slick-grid_filter-drop-down\" listWidth=\"auto\" placeholder=\"Search...\" (onSelect)=\"onSearchSelect($event, column)\"></slick-drop-down>\r\n\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t</td>\r\n\t\t\t\t\t</tr>\r\n\t\t\t\t</thead>\r\n\r\n\t\t\t\t<tbody>\r\n\t\t\t\t\t<tr *ngIf=\"loaded && visibleData.length === 0\"><td [colSpan]=\"visibleColumns.length\">No Data</td></tr>\r\n\t\t\t\t\t<tr *ngFor=\"let rowData of visibleData; let idx = index\" #tableBodyRows (click)=\"onRowClicked(rowData, idx)\" (dblclick)=\"onRowDoubleClicked(rowData, idx)\" (contextmenu)=\"onRowContextMenuClicked($event, rowData, idx)\" [class.table-success]=\"selectedIndex === idx\">\r\n\t\t\t\t\t\t<td *ngFor=\"let column of visibleColumns\">\r\n\t\t\t\t\t\t\t<div *ngIf=\"!column.columnKey\" class=\"slick-grid_column-content\" [style.width]=\"column.width\" [style.maxWidth]=\"column.width\" [innerHTML]=\"getColumnHTML(rowData, column.dataFieldName) | slickGridSanitizeHtml\"></div>\r\n\t\t\t\t\t\t\t<div *ngIf=\"column.columnKey\" class=\"slick-grid_column-content\" [style.width]=\"column.width\" [style.maxWidth]=\"column.width\">\r\n\t\t\t\t\t\t\t\t<ng-container *ngTemplateOutlet=\"templateRefs[column.columnKey], context: { $implicit: rowData }\">\r\n\t\t\t\t\t\t\t\t</ng-container>\r\n\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t</td>\r\n\t\t\t\t\t</tr>\r\n\t\t\t\t</tbody>\r\n\t\t\t</table>\r\n\t\t</div>\r\n\t</div>\r\n\r\n\r\n\t<div class=\"slick-grid-footer mt-2 d-flex\">\r\n\t\t<div>\r\n\t\t <button type=\"button\" (click)=\"openColumnSelectDialog()\" class=\"btn btn-outline-primary\" style=\"border-radius: 100%; height: 2.2rem; width: 2.2rem; padding: 0;\"><i class=\"fal fa-columns\"></i></button>\r\n\t\t</div>\r\n\t\t<div *ngIf=\"favorites?.length > 1\">\r\n\t\t <button #favoriteSelectRef type=\"button\" class=\"btn btn-outline-primary ms-1\"><i class=\"far fa-star\"></i> {{this.selectedFavorite}}</button>\r\n\t\t <slick-popover [element]=\"favoriteSelectRef\" position=\"top\" showArrow=\"false\" [topOffsetPx]=\"0\" [leftOffsetPx]=\"0\" [showByClick]=\"true\">\r\n\t\t\t<table class=\"table-borderless table-sm table-hover\" style=\"min-width: 250px; cursor: default\">\r\n\t\t\t <tbody>\r\n\t\t\t\t<tr *ngFor=\"let favorite of favorites\" (click)=\"setFavorite(favorite.text)\">\r\n\t\t\t\t <td><i *ngIf=\"favorite.text === selectedFavorite\" class=\"far fa-star me-1\"></i>{{favorite.text}}</td>\r\n\t\t\t\t</tr>\r\n\t\t\t </tbody>\r\n\t\t\t</table>\r\n\t\t </slick-popover>\r\n\t\t</div>\r\n\t\t<div *ngIf=\"showingAllRecords == false\">\r\n\t\t <slick-paging [(pageNumber)]=\"currentPage\" [totalRecords]=\"totalRecords\" [recordsPerPage]=\"recordsPerPage\" (onPageChange)=\"onPageChange($event)\"></slick-paging>\r\n\t\t</div>\r\n\t\t<div class=\"ms-auto\">\r\n\t\t <button #recordsPerPageRef type=\"button\" class=\"btn btn-outline-primary\">{{recordsPerPageValue}}&nbsp;&nbsp;<i style=\"font-size: 12px;\" class=\"far fa-chevron-down\"></i></button>\r\n\t\t <slick-popover [element]=\"recordsPerPageRef\" position=\"top\" showArrow=\"false\" [topOffsetPx]=\"0\" [leftOffsetPx]=\"0\" [showByClick]=\"true\">\r\n\t\t\t<table class=\"table-borderless table-sm table-hover\" style=\"min-width: 150px;\">\r\n\t\t\t <tbody>\r\n\t\t\t\t<tr (click)=\"onRecordsPerPageSelected('Auto')\"><td>Auto</td></tr>\r\n\t\t\t\t<tr (click)=\"onRecordsPerPageSelected('25')\"><td>25</td></tr>\r\n\t\t\t\t<tr (click)=\"onRecordsPerPageSelected('50')\"><td>50</td></tr>\r\n\t\t\t\t<tr (click)=\"onRecordsPerPageSelected('100')\"><td>100</td></tr>\r\n\t\t\t </tbody>\r\n\t\t\t</table>\r\n\t\t </slick-popover>\r\n\t\t</div>\r\n\t </div>\r\n\t \r\n</div>\r\n\r\n<slick-dialog #columnSelectDialogRef header=\"Select Columns\">\r\n\t<div style=\"text-align: center; width: 475px;\" class=\"mx-5\">\r\n\t\t<div class=\"d-flex\">\r\n\t\t\t<div class=\"flex-fill\">\r\n\t\t\t\t<slick-drop-down [items]=\"favorites\"\r\n\t\t\t\t\t\t\t\t [ngModel]=\"selectedFavorite\"\r\n\t\t\t\t\t\t\t\t (onSelect)=\"loadFavorite($event)\"></slick-drop-down>\r\n\t\t\t</div>\r\n\t\t\t<div><button class=\"btn btn-outline-primary ms-1\" (click)=\"addNewFavorite()\"><i class=\"far fa-plus\"></i></button></div>\r\n\t\t</div>\r\n\t\t<div class=\"d-flex flex-column mt-1\" slick-drop-list (onSlickDropListReorder)=\"onColumnReorder($event)\">\r\n\t\t\t<div *ngFor=\"let column of columnSelectDialogColumns\" class=\"d-flex\" slick-drop-list-item>\r\n\t\t\t\t<div style=\"width: 20px\"><input type=\"checkbox\" style=\"position: relative; top: 2px;\" [(ngModel)]=\"column.visible\" /></div>\r\n\t\t\t\t<div class=\"py-0 flex-fill\" style=\"text-align: left; cursor: ns-resize\" slick-drop-list-grab>{{column.title}}</div>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t</div>\r\n\t<slick-dialog-footer>\r\n\t\t<div style=\"margin-top: 10px;\" class=\"col-12 text-center mb-2 mt-1\">\r\n\t\t\t<button type=\"button\" (click)=\"onSaveColumns()\" class=\"btn btn-outline-primary me-1\"><i class=\"far fa-save\"></i>&nbsp;Save</button>&nbsp;\r\n\t\t\t<button type=\"button\" class=\"btn btn-outline-danger\" (click)=\"onCancelColumns()\">Cancel</button>\r\n\t\t</div>\r\n\t</slick-dialog-footer>\r\n</slick-dialog>\r\n\r\n\r\n<slick-confirm-dialog #addNewFavoriteDialogRef width=\"300\">\r\n\t<label>Enter new favorite name</label>\r\n\t<input type=\"text\" class=\"form-control mx-3\" style=\"width: 250px\" [(ngModel)]=\"newFavoriteText\" />\r\n</slick-confirm-dialog>" }]
6243
6243
  }], ctorParameters: function () { return [{ type: SlickGridService }, { type: SlickFunctionLockService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { flexColumn: [{
6244
6244
  type: HostBinding,
6245
6245
  args: ['class']
@@ -7940,7 +7940,7 @@ class SlickStarRatingComponent {
7940
7940
  useExisting: forwardRef((() => SlickStarRatingComponent)),
7941
7941
  multi: true,
7942
7942
  }
7943
- ], usesOnChanges: true, ngImport: i0, template: "<div class=\"d-flex\" (mouseleave)=\"reset()\">\r\n\t<div *ngFor=\"let star of stars; let idx = index\" class=\"pl-1\" style=\"cursor: pointer\" (mouseenter)=\"onMouseEnter(idx)\" (click)=\"setRatingValue(idx)\">\r\n\t\t<div *ngIf=\"star.selected === true\" style=\"position: relative\">\r\n\t\t\t<div class=\"fas fa-star\" [style.color]=\"checkedColor\" [style.font-size]=\"size\"></div>\r\n\t\t\t<div class=\"fal fa-star\" [style.color]=\"uncheckedColor\" [style.font-size]=\"size\" style=\"position: absolute; left: 0;\"></div>\r\n\t\t</div>\r\n\t\t<div *ngIf=\"star.selected === false\" class=\"fal fa-star\" [style.color]=\"uncheckedColor\" [style.font-size]=\"size\"></div>\r\n\t</div>\r\n</div>", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
7943
+ ], usesOnChanges: true, ngImport: i0, template: "<div class=\"d-flex\" (mouseleave)=\"reset()\">\r\n\t<div *ngFor=\"let star of stars; let idx = index\" class=\"ps-1\" style=\"cursor: pointer\" (mouseenter)=\"onMouseEnter(idx)\" (click)=\"setRatingValue(idx)\">\r\n\t\t<div *ngIf=\"star.selected === true\" style=\"position: relative\">\r\n\t\t\t<div class=\"fas fa-star\" [style.color]=\"checkedColor\" [style.font-size]=\"size\"></div>\r\n\t\t\t<div class=\"fal fa-star\" [style.color]=\"uncheckedColor\" [style.font-size]=\"size\" style=\"position: absolute; left: 0;\"></div>\r\n\t\t</div>\r\n\t\t<div *ngIf=\"star.selected === false\" class=\"fal fa-star\" [style.color]=\"uncheckedColor\" [style.font-size]=\"size\"></div>\r\n\t</div>\r\n</div>", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
7944
7944
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SlickStarRatingComponent, decorators: [{
7945
7945
  type: Component,
7946
7946
  args: [{ selector: 'slick-star-rating', providers: [
@@ -7949,7 +7949,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImpor
7949
7949
  useExisting: forwardRef((() => SlickStarRatingComponent)),
7950
7950
  multi: true,
7951
7951
  }
7952
- ], template: "<div class=\"d-flex\" (mouseleave)=\"reset()\">\r\n\t<div *ngFor=\"let star of stars; let idx = index\" class=\"pl-1\" style=\"cursor: pointer\" (mouseenter)=\"onMouseEnter(idx)\" (click)=\"setRatingValue(idx)\">\r\n\t\t<div *ngIf=\"star.selected === true\" style=\"position: relative\">\r\n\t\t\t<div class=\"fas fa-star\" [style.color]=\"checkedColor\" [style.font-size]=\"size\"></div>\r\n\t\t\t<div class=\"fal fa-star\" [style.color]=\"uncheckedColor\" [style.font-size]=\"size\" style=\"position: absolute; left: 0;\"></div>\r\n\t\t</div>\r\n\t\t<div *ngIf=\"star.selected === false\" class=\"fal fa-star\" [style.color]=\"uncheckedColor\" [style.font-size]=\"size\"></div>\r\n\t</div>\r\n</div>" }]
7952
+ ], template: "<div class=\"d-flex\" (mouseleave)=\"reset()\">\r\n\t<div *ngFor=\"let star of stars; let idx = index\" class=\"ps-1\" style=\"cursor: pointer\" (mouseenter)=\"onMouseEnter(idx)\" (click)=\"setRatingValue(idx)\">\r\n\t\t<div *ngIf=\"star.selected === true\" style=\"position: relative\">\r\n\t\t\t<div class=\"fas fa-star\" [style.color]=\"checkedColor\" [style.font-size]=\"size\"></div>\r\n\t\t\t<div class=\"fal fa-star\" [style.color]=\"uncheckedColor\" [style.font-size]=\"size\" style=\"position: absolute; left: 0;\"></div>\r\n\t\t</div>\r\n\t\t<div *ngIf=\"star.selected === false\" class=\"fal fa-star\" [style.color]=\"uncheckedColor\" [style.font-size]=\"size\"></div>\r\n\t</div>\r\n</div>" }]
7953
7953
  }], ctorParameters: function () { return []; }, propDecorators: { checkedColor: [{
7954
7954
  type: Input
7955
7955
  }], uncheckedColor: [{
@@ -8535,10 +8535,10 @@ class SlickTreeViewComponent {
8535
8535
  }
8536
8536
  }
8537
8537
  /** @nocollapse */ SlickTreeViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SlickTreeViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
8538
- /** @nocollapse */ SlickTreeViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: SlickTreeViewComponent, selector: "slick-tree-view", inputs: { nodes: "nodes", showRootNode: "showRootNode", rootNodeUuid: "rootNodeUuid", expandOnClick: "expandOnClick" }, outputs: { nodesChange: "nodesChange", onNodeSelected: "onNodeSelected", onNodeChanged: "onNodeChanged", onNodeAdded: "onNodeAdded", onNodeDeleted: "onNodeDeleted" }, viewQueries: [{ propertyName: "slickTreeViewRef", first: true, predicate: ["slickTreeViewRef"], descendants: true, static: true }, { propertyName: "contextMenuRef", first: true, predicate: ["contextMenuRef"], descendants: true }, { propertyName: "deleteNodeConfirmRef", first: true, predicate: ["deleteNodeConfirmRef"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div #slickTreeViewRef id=\"slick-tree-view_{{uuid}}\" class=\"slick-tree-view position-relative pr-2\">\r\n\t<div class=\"d-flex slick-tree-view-node\" [attr.data-uuid]=\"displayNode.uuid\" *ngFor=\"let displayNode of displayNodes\">\r\n\t\t<div class=\"slick-tree-view_indentation\">\r\n\t\t\t<i *ngFor=\"let indent of displayNode.indentArray\" class=\"far fa-caret-right mr-1\" style=\"opacity: 0\"></i>\r\n\t\t\t<i *ngIf=\"!displayNode.hasChildNodes\" class=\"far fa-caret-right mr-1\" style=\"opacity: 0\"></i>\r\n\t\t\t<i *ngIf=\"displayNode.hasChildNodes && !displayNode.expanded\" class=\"far fa-caret-right mr-1\" style=\"cursor: pointer\" (click)=\"expandNode(displayNode)\"></i>\r\n\t\t\t<i *ngIf=\"displayNode.hasChildNodes && displayNode.expanded\" class=\"far fa-caret-down mr-1\" style=\"cursor: pointer\" (click)=\"collapseNode(displayNode)\"></i>\r\n\t\t</div>\r\n\t\t<div class=\"d-flex px-1\" [ngClass]=\"{'bg-success text-white' : displayNode.uuid === selectedUuid }\">\r\n\t\t\t<div *ngIf=\"displayNode.node.iconClass || displayNode.node.iconUrl\" class=\"mr-1 slick-tree-view_icon\">\r\n\t\t\t\t<i *ngIf=\"displayNode.node.iconClass\" [style.color]=\"displayNode.node.iconColor\" [ngClass]=\"displayNode.node.iconClass\"></i>\r\n\t\t\t</div>\r\n\t\t\t<div *ngIf=\"!displayNode.editingText\" style=\"cursor: pointer\" (click)=\"selectNode(displayNode)\" (dblclick)=\"editText(displayNode)\">{{displayNode.text}}</div>\r\n\t\t\t<div *ngIf=\"displayNode.editingText\" class=\"slick-tree-view_node-text-edit\"><input type=\"text\" class=\"form-control slick-tree-view_node-text-edit_{{displayNode.uuid}}\" [(ngModel)]=\"displayNode.text\" (keydown)=\"onTextKeydown($event, displayNode)\" /></div>\r\n\t\t</div>\r\n\t</div>\r\n\r\n\t<div #contextMenuRef class='slick-tree-view_context-menu dropdown-menu p-0 show menu-hidden'>\r\n\t\t<div *ngIf=\"contextMenuShowAdd\" class=\"px-2 dropdown-item\" (click)=\"addNode()\">Add</div>\r\n\t\t<div *ngIf=\"contextMenuShowDelete\" class=\"px-2 dropdown-item\" (click)=\"deleteNode()\">Delete</div>\r\n\t\t<div *ngIf=\"contextMenuShowEditText\" class=\"px-2 dropdown-item\" (click)=\"editNodeText()\">Edit Name</div>\r\n\t</div>\r\n</div>\r\n\r\n<slick-confirm-dialog #deleteNodeConfirmRef>\r\n\tAre you sure you want to delete {{deleteNodeName}}?\r\n</slick-confirm-dialog>", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: SlickConfirmDialogComponent, selector: "slick-confirm-dialog", inputs: ["width", "okButtonText", "cancelButtonText", "showOkButton", "showCancelButton"] }] });
8538
+ /** @nocollapse */ SlickTreeViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: SlickTreeViewComponent, selector: "slick-tree-view", inputs: { nodes: "nodes", showRootNode: "showRootNode", rootNodeUuid: "rootNodeUuid", expandOnClick: "expandOnClick" }, outputs: { nodesChange: "nodesChange", onNodeSelected: "onNodeSelected", onNodeChanged: "onNodeChanged", onNodeAdded: "onNodeAdded", onNodeDeleted: "onNodeDeleted" }, viewQueries: [{ propertyName: "slickTreeViewRef", first: true, predicate: ["slickTreeViewRef"], descendants: true, static: true }, { propertyName: "contextMenuRef", first: true, predicate: ["contextMenuRef"], descendants: true }, { propertyName: "deleteNodeConfirmRef", first: true, predicate: ["deleteNodeConfirmRef"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div #slickTreeViewRef id=\"slick-tree-view_{{uuid}}\" class=\"slick-tree-view position-relative pe-2\">\r\n\t<div class=\"d-flex slick-tree-view-node\" [attr.data-uuid]=\"displayNode.uuid\" *ngFor=\"let displayNode of displayNodes\">\r\n\t\t<div class=\"slick-tree-view_indentation\">\r\n\t\t\t<i *ngFor=\"let indent of displayNode.indentArray\" class=\"far fa-caret-right me-1\" style=\"opacity: 0\"></i>\r\n\t\t\t<i *ngIf=\"!displayNode.hasChildNodes\" class=\"far fa-caret-right me-1\" style=\"opacity: 0\"></i>\r\n\t\t\t<i *ngIf=\"displayNode.hasChildNodes && !displayNode.expanded\" class=\"far fa-caret-right me-1\" style=\"cursor: pointer\" (click)=\"expandNode(displayNode)\"></i>\r\n\t\t\t<i *ngIf=\"displayNode.hasChildNodes && displayNode.expanded\" class=\"far fa-caret-down me-1\" style=\"cursor: pointer\" (click)=\"collapseNode(displayNode)\"></i>\r\n\t\t</div>\r\n\t\t<div class=\"d-flex px-1\" [ngClass]=\"{'bg-success text-white' : displayNode.uuid === selectedUuid }\">\r\n\t\t\t<div *ngIf=\"displayNode.node.iconClass || displayNode.node.iconUrl\" class=\"me-1 slick-tree-view_icon\">\r\n\t\t\t\t<i *ngIf=\"displayNode.node.iconClass\" [style.color]=\"displayNode.node.iconColor\" [ngClass]=\"displayNode.node.iconClass\"></i>\r\n\t\t\t</div>\r\n\t\t\t<div *ngIf=\"!displayNode.editingText\" style=\"cursor: pointer\" (click)=\"selectNode(displayNode)\" (dblclick)=\"editText(displayNode)\">{{displayNode.text}}</div>\r\n\t\t\t<div *ngIf=\"displayNode.editingText\" class=\"slick-tree-view_node-text-edit\"><input type=\"text\" class=\"form-control slick-tree-view_node-text-edit_{{displayNode.uuid}}\" [(ngModel)]=\"displayNode.text\" (keydown)=\"onTextKeydown($event, displayNode)\" /></div>\r\n\t\t</div>\r\n\t</div>\r\n\r\n\t<div #contextMenuRef class='slick-tree-view_context-menu dropdown-menu p-0 show menu-hidden'>\r\n\t\t<div *ngIf=\"contextMenuShowAdd\" class=\"px-2 dropdown-item\" (click)=\"addNode()\">Add</div>\r\n\t\t<div *ngIf=\"contextMenuShowDelete\" class=\"px-2 dropdown-item\" (click)=\"deleteNode()\">Delete</div>\r\n\t\t<div *ngIf=\"contextMenuShowEditText\" class=\"px-2 dropdown-item\" (click)=\"editNodeText()\">Edit Name</div>\r\n\t</div>\r\n</div>\r\n\r\n<slick-confirm-dialog #deleteNodeConfirmRef>\r\n\tAre you sure you want to delete {{deleteNodeName}}?\r\n</slick-confirm-dialog>", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: SlickConfirmDialogComponent, selector: "slick-confirm-dialog", inputs: ["width", "okButtonText", "cancelButtonText", "showOkButton", "showCancelButton"] }] });
8539
8539
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SlickTreeViewComponent, decorators: [{
8540
8540
  type: Component,
8541
- args: [{ selector: 'slick-tree-view', template: "<div #slickTreeViewRef id=\"slick-tree-view_{{uuid}}\" class=\"slick-tree-view position-relative pr-2\">\r\n\t<div class=\"d-flex slick-tree-view-node\" [attr.data-uuid]=\"displayNode.uuid\" *ngFor=\"let displayNode of displayNodes\">\r\n\t\t<div class=\"slick-tree-view_indentation\">\r\n\t\t\t<i *ngFor=\"let indent of displayNode.indentArray\" class=\"far fa-caret-right mr-1\" style=\"opacity: 0\"></i>\r\n\t\t\t<i *ngIf=\"!displayNode.hasChildNodes\" class=\"far fa-caret-right mr-1\" style=\"opacity: 0\"></i>\r\n\t\t\t<i *ngIf=\"displayNode.hasChildNodes && !displayNode.expanded\" class=\"far fa-caret-right mr-1\" style=\"cursor: pointer\" (click)=\"expandNode(displayNode)\"></i>\r\n\t\t\t<i *ngIf=\"displayNode.hasChildNodes && displayNode.expanded\" class=\"far fa-caret-down mr-1\" style=\"cursor: pointer\" (click)=\"collapseNode(displayNode)\"></i>\r\n\t\t</div>\r\n\t\t<div class=\"d-flex px-1\" [ngClass]=\"{'bg-success text-white' : displayNode.uuid === selectedUuid }\">\r\n\t\t\t<div *ngIf=\"displayNode.node.iconClass || displayNode.node.iconUrl\" class=\"mr-1 slick-tree-view_icon\">\r\n\t\t\t\t<i *ngIf=\"displayNode.node.iconClass\" [style.color]=\"displayNode.node.iconColor\" [ngClass]=\"displayNode.node.iconClass\"></i>\r\n\t\t\t</div>\r\n\t\t\t<div *ngIf=\"!displayNode.editingText\" style=\"cursor: pointer\" (click)=\"selectNode(displayNode)\" (dblclick)=\"editText(displayNode)\">{{displayNode.text}}</div>\r\n\t\t\t<div *ngIf=\"displayNode.editingText\" class=\"slick-tree-view_node-text-edit\"><input type=\"text\" class=\"form-control slick-tree-view_node-text-edit_{{displayNode.uuid}}\" [(ngModel)]=\"displayNode.text\" (keydown)=\"onTextKeydown($event, displayNode)\" /></div>\r\n\t\t</div>\r\n\t</div>\r\n\r\n\t<div #contextMenuRef class='slick-tree-view_context-menu dropdown-menu p-0 show menu-hidden'>\r\n\t\t<div *ngIf=\"contextMenuShowAdd\" class=\"px-2 dropdown-item\" (click)=\"addNode()\">Add</div>\r\n\t\t<div *ngIf=\"contextMenuShowDelete\" class=\"px-2 dropdown-item\" (click)=\"deleteNode()\">Delete</div>\r\n\t\t<div *ngIf=\"contextMenuShowEditText\" class=\"px-2 dropdown-item\" (click)=\"editNodeText()\">Edit Name</div>\r\n\t</div>\r\n</div>\r\n\r\n<slick-confirm-dialog #deleteNodeConfirmRef>\r\n\tAre you sure you want to delete {{deleteNodeName}}?\r\n</slick-confirm-dialog>" }]
8541
+ args: [{ selector: 'slick-tree-view', template: "<div #slickTreeViewRef id=\"slick-tree-view_{{uuid}}\" class=\"slick-tree-view position-relative pe-2\">\r\n\t<div class=\"d-flex slick-tree-view-node\" [attr.data-uuid]=\"displayNode.uuid\" *ngFor=\"let displayNode of displayNodes\">\r\n\t\t<div class=\"slick-tree-view_indentation\">\r\n\t\t\t<i *ngFor=\"let indent of displayNode.indentArray\" class=\"far fa-caret-right me-1\" style=\"opacity: 0\"></i>\r\n\t\t\t<i *ngIf=\"!displayNode.hasChildNodes\" class=\"far fa-caret-right me-1\" style=\"opacity: 0\"></i>\r\n\t\t\t<i *ngIf=\"displayNode.hasChildNodes && !displayNode.expanded\" class=\"far fa-caret-right me-1\" style=\"cursor: pointer\" (click)=\"expandNode(displayNode)\"></i>\r\n\t\t\t<i *ngIf=\"displayNode.hasChildNodes && displayNode.expanded\" class=\"far fa-caret-down me-1\" style=\"cursor: pointer\" (click)=\"collapseNode(displayNode)\"></i>\r\n\t\t</div>\r\n\t\t<div class=\"d-flex px-1\" [ngClass]=\"{'bg-success text-white' : displayNode.uuid === selectedUuid }\">\r\n\t\t\t<div *ngIf=\"displayNode.node.iconClass || displayNode.node.iconUrl\" class=\"me-1 slick-tree-view_icon\">\r\n\t\t\t\t<i *ngIf=\"displayNode.node.iconClass\" [style.color]=\"displayNode.node.iconColor\" [ngClass]=\"displayNode.node.iconClass\"></i>\r\n\t\t\t</div>\r\n\t\t\t<div *ngIf=\"!displayNode.editingText\" style=\"cursor: pointer\" (click)=\"selectNode(displayNode)\" (dblclick)=\"editText(displayNode)\">{{displayNode.text}}</div>\r\n\t\t\t<div *ngIf=\"displayNode.editingText\" class=\"slick-tree-view_node-text-edit\"><input type=\"text\" class=\"form-control slick-tree-view_node-text-edit_{{displayNode.uuid}}\" [(ngModel)]=\"displayNode.text\" (keydown)=\"onTextKeydown($event, displayNode)\" /></div>\r\n\t\t</div>\r\n\t</div>\r\n\r\n\t<div #contextMenuRef class='slick-tree-view_context-menu dropdown-menu p-0 show menu-hidden'>\r\n\t\t<div *ngIf=\"contextMenuShowAdd\" class=\"px-2 dropdown-item\" (click)=\"addNode()\">Add</div>\r\n\t\t<div *ngIf=\"contextMenuShowDelete\" class=\"px-2 dropdown-item\" (click)=\"deleteNode()\">Delete</div>\r\n\t\t<div *ngIf=\"contextMenuShowEditText\" class=\"px-2 dropdown-item\" (click)=\"editNodeText()\">Edit Name</div>\r\n\t</div>\r\n</div>\r\n\r\n<slick-confirm-dialog #deleteNodeConfirmRef>\r\n\tAre you sure you want to delete {{deleteNodeName}}?\r\n</slick-confirm-dialog>" }]
8542
8542
  }], ctorParameters: function () { return []; }, propDecorators: { nodes: [{
8543
8543
  type: Input
8544
8544
  }], nodesChange: [{