ng-tailwind 4.5.48 → 4.5.50

package/fesm2020/ng-tailwind.mjs

@@ -3193,7 +3193,7 @@ class NgtSelectComponent extends NgtBaseNgModel {
         this.onClear.emit();
     }
     onRemoveSelectedItem(item) {
-        if (!this.allowOriginalItemsUnselect && this.hadPreviousSelection(item.value)) {
+        if (this.cantRemoveItem(item.value)) {
             setTimeout(() => this.ngSelectComponent.select(item));
             return;
         }
@@ -3266,6 +3266,10 @@ class NgtSelectComponent extends NgtBaseNgModel {
     hasSelectedValue() {
         return this.value && JSON.stringify(this.value);
     }
+    cantRemoveItem(itemValue) {
+        return (!this.allowOriginalItemsUnselect && this.hadPreviousSelection(itemValue))
+            || (this.isAllowedToRemoveFn && !this.isAllowedToRemoveFn(itemValue));
+    }
     getSelectClass() {
         let selectClass = this.dropdownPanelMinHeight ? 'ng-select-dropdown-panel-' + this.dropdownPanelMinHeight : 'ng-select-dropdown-panel-auto';
         if (this.disabled()) {
@@ -3451,9 +3455,9 @@ class NgtSelectComponent extends NgtBaseNgModel {
     }
 }
 NgtSelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtSelectComponent, deps: [{ token: NgtStylizableDirective, optional: true, self: true }, { token: i2$1.ControlContainer, host: true, optional: true }, { token: NgtTranslateService, optional: true }, { token: i0.Injector }, { token: NgtHttpService }, { token: i0.ChangeDetectorRef }, { token: NgtFormComponent, optional: true, skipSelf: true }, { token: NgtSectionComponent, optional: true, skipSelf: true }, { token: NgtModalComponent, optional: true, skipSelf: true }], target: i0.ɵɵFactoryTarget.Component });
-NgtSelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.8", type: NgtSelectComponent, selector: "ngt-select", inputs: { label: "label", labelIcon: "labelIcon", labelIconColor: "labelIconColor", helpTitle: "helpTitle", helpText: "helpText", helpTextColor: "helpTextColor", shining: "shining", loading: "loading", loadingText: "loadingText", notFoundText: "notFoundText", dropdownPosition: "dropdownPosition", typeToSearchText: "typeToSearchText", clearAllTooltip: "clearAllTooltip", placeholder: "placeholder", createText: "createText", labelForId: "labelForId", dropdownPanelMinHeight: "dropdownPanelMinHeight", helperReverseYPosition: "helperReverseYPosition", helperAutoXReverse: "helperAutoXReverse", name: "name", autoLoad: "autoLoad", allowCreate: "allowCreate", allowOriginalItemsUnselect: "allowOriginalItemsUnselect", isDisabled: "isDisabled", isReadonly: "isReadonly", remoteResource: "remoteResource", hideSelected: "hideSelected", bindLabel: "bindLabel", bindValue: "bindValue", items: "items", inputAttrs: "inputAttrs", closeOnSelect: "closeOnSelect", clearable: "clearable", groupBy: "groupBy", maxSelectedItems: "maxSelectedItems", multiple: "multiple", searchable: "searchable", clearSearchOnAdd: "clearSearchOnAdd", virtualScroll: "virtualScroll", tabIndex: "tabIndex", typeahead: "typeahead", guessCompareWith: "guessCompareWith", autoSelectUniqueOption: "autoSelectUniqueOption", groupValue: "groupValue", trackBy: "trackBy", sortSelectedItemsFn: "sortSelectedItemsFn", isRequired: "isRequired", compareWith: "compareWith" }, outputs: { onLoadRemoteResource: "onLoadRemoteResource", onSelectedItemRemove: "onSelectedItemRemove", onClear: "onClear", onClose: "onClose" }, providers: [
+NgtSelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.8", type: NgtSelectComponent, selector: "ngt-select", inputs: { label: "label", labelIcon: "labelIcon", labelIconColor: "labelIconColor", helpTitle: "helpTitle", helpText: "helpText", helpTextColor: "helpTextColor", shining: "shining", loading: "loading", loadingText: "loadingText", notFoundText: "notFoundText", dropdownPosition: "dropdownPosition", typeToSearchText: "typeToSearchText", clearAllTooltip: "clearAllTooltip", placeholder: "placeholder", createText: "createText", labelForId: "labelForId", dropdownPanelMinHeight: "dropdownPanelMinHeight", helperReverseYPosition: "helperReverseYPosition", helperAutoXReverse: "helperAutoXReverse", name: "name", autoLoad: "autoLoad", allowCreate: "allowCreate", allowOriginalItemsUnselect: "allowOriginalItemsUnselect", isDisabled: "isDisabled", isReadonly: "isReadonly", remoteResource: "remoteResource", hideSelected: "hideSelected", bindLabel: "bindLabel", bindValue: "bindValue", items: "items", inputAttrs: "inputAttrs", closeOnSelect: "closeOnSelect", clearable: "clearable", groupBy: "groupBy", maxSelectedItems: "maxSelectedItems", multiple: "multiple", searchable: "searchable", clearSearchOnAdd: "clearSearchOnAdd", virtualScroll: "virtualScroll", tabIndex: "tabIndex", typeahead: "typeahead", guessCompareWith: "guessCompareWith", autoSelectUniqueOption: "autoSelectUniqueOption", groupValue: "groupValue", trackBy: "trackBy", sortSelectedItemsFn: "sortSelectedItemsFn", isAllowedToRemoveFn: "isAllowedToRemoveFn", isRequired: "isRequired", compareWith: "compareWith" }, outputs: { onLoadRemoteResource: "onLoadRemoteResource", onSelectedItemRemove: "onSelectedItemRemove", onClear: "onClear", onClose: "onClose" }, providers: [
         NgtMakeProvider(NgtSelectComponent)
-    ], queries: [{ propertyName: "ngtOptionTemplate", first: true, predicate: NgtSelectOptionTmp, descendants: true, read: TemplateRef }, { propertyName: "ngtOptionSelectedTemplate", first: true, predicate: NgtSelectOptionSelectedTmp, descendants: true, read: TemplateRef }, { propertyName: "ngtSelectHeaderTemplate", first: true, predicate: NgtSelectHeaderTmp, descendants: true, read: TemplateRef }], viewQueries: [{ propertyName: "ngSelectComponent", first: true, predicate: NgSelectComponent, descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<label *ngIf=\"label\" [hidden]='shining'\n    class=\"{{ shining ? '' : 'block' }} {{ ngtStyle.compile(['color.text', 'text', 'font', 'fontCase']) }} mb-2 flex\">\n    <ngt-svg *ngIf=\"labelIcon\" class=\"mr-1 {{labelIconColor}}\" src=\"{{labelIcon}}\"></ngt-svg>\n    {{ label }}:\n\n    <span class=\"text-red-500 font-bold text-md ml-1\" *ngIf=\"isRequired\">*</span>\n\n    <ngt-helper *ngIf=\"helpText\" [helpTitle]=\"helpTitle\" [iconColor]=\"helpTextColor\"\n        [helperReverseYPosition]=\"helperReverseYPosition\" [autoXReverse]=\"helperAutoXReverse\" class=\"ml-1\">\n        {{ helpText }}\n    </ngt-helper>\n</label>\n\n<div [hidden]='shining' class=\"{{ getSelectClass() }} normal-case\" style=\"min-height: 3rem;\">\n    <ng-select class=\"custom\" [(ngModel)]='nativeValue' [name]='nativeName' [addTag]='allowCreate'\n        [addTagText]=\"createText || ngtTranslateService.ngtSelectCreateText\" [bindLabel]=\"bindLabel\"\n        [multiple]=\"multiple\" [hideSelected]=\"hideSelected\" [typeahead]=\"typeahead\"\n        [notFoundText]=\"notFoundText || ngtTranslateService.ngtSelectNotFoundText\" [searchable]=\"searchable\"\n        [disabled]='disabled() || isReadonly' [clearable]=\"clearable && hasSelectedValue()\"\n        [closeOnSelect]=\"closeOnSelect\" [trackByFn]=\"trackBy\" [labelForId]=\"labelForId\"\n        [typeToSearchText]=\"typeToSearchText || ngtTranslateService.ngtSelectTypeToSearchText\"\n        [placeholder]=\"placeholder || ngtTranslateService.ngtSelectPlaceholder\" [dropdownPosition]=\"dropdownPosition\"\n        [groupBy]=\"groupBy\" [clearAllText]=\"clearAllTooltip || ngtTranslateService.ngtSelectClearAllTooltip\"\n        [clearSearchOnAdd]=\"clearSearchOnAdd\" [bindValue]=\"bindValue\" [virtualScroll]=\"virtualScroll\"\n        [loadingText]=\"loadingText || ngtTranslateService.ngtSelectLoadingText\" [maxSelectedItems]=\"maxSelectedItems\"\n        [tabIndex]=\"tabIndex\" [items]=\"ngSelectItems | async\" [groupValue]=\"groupValue\" [loading]=\"loading\"\n        [compareWith]='compareWith' [inputAttrs]=\"inputAttrs\" (scroll)=\"onScroll($event)\" (close)=\"onClose.emit()\"\n        (change)=\"onNativeChange($event)\" (clear)='onClearSelect()' (remove)='onRemoveSelectedItem($event)'\n        (click)=\"wasClicked = true\">\n\n        <ng-template *ngIf='ngtSelectHeaderTemplate' ng-header-tmp>\n            <ng-template [ngTemplateOutlet]=\"ngtSelectHeaderTemplate\">\n            </ng-template>\n        </ng-template>\n\n        <ng-template ng-label-tmp let-item=\"item\">\n            <div class=\"flex w-full items-center pr-1\">\n                <ng-container *ngIf=\"multiple\">\n                    <div class=\"ng-value-icon px-1 h-full border-r mr-2 {{ ngtStyle.compile(['color.text', 'text']) }} cursor-pointer\"\n                        (click)='removeItem($event, item)'>\n                        <svg class=\"ng-value-icon fill-current self-center\" xmlns=\"http://www.w3.org/2000/svg\"\n                            viewBox=\"0 0 24 24\">\n                            <path\n                                d=\"M19.1 17.2l-5.3-5.3 5.3-5.3-1.8-1.8-5.3 5.4-5.3-5.3-1.8 1.7 5.3 5.3-5.3 5.3L6.7 19l5.3-5.3 5.3 5.3 1.8-1.8z\" />\n                        </svg>\n                    </div>\n                </ng-container>\n\n                <ng-template *ngIf='ngtOptionSelectedTemplate' [ngTemplateOutlet]=\"ngtOptionSelectedTemplate\"\n                    [ngTemplateOutletContext]=\"{ item: item }\">\n                </ng-template>\n\n                <ng-template *ngIf='!ngtOptionSelectedTemplate' [ngTemplateOutlet]=\"ngtOptionTemplate\"\n                    [ngTemplateOutletContext]=\"{ item: item }\">\n                </ng-template>\n            </div>\n        </ng-template>\n\n        <ng-template ng-option-tmp let-item=\"item\" let-index=\"index\" let-search=\"searchTerm\">\n            <ng-template [ngTemplateOutlet]=\"ngtOptionTemplate\"\n                [ngTemplateOutletContext]=\"{ item: item, index: index, searchTerm: search }\">\n            </ng-template>\n        </ng-template>\n    </ng-select>\n</div>\n\n<ng-container *ngIf='shining'>\n    <div class=\"flex\">\n        <ngt-shining class=\"{{ ngtStyle.compile(['h']) }} w-full\"></ngt-shining>\n    </div>\n</ng-container>\n\n<ngt-validation [control]=\"formControl\" [container]=\"formContainer\"></ngt-validation>\n\n<input *ngIf='componentReady' type='hidden' [ngModel]=\"value\" [name]=\"name\" [value]=\"value\">", styles: [".ng-select.ng-select-opened>.ng-select-container{background:#fff;border-color:#b3b3b3 #ccc #d9d9d9}.ng-select.ng-select-opened>.ng-select-container:hover{box-shadow:none}.ng-select.ng-select-opened>.ng-select-container .ng-arrow{top:-2px;border-color:transparent transparent #999;border-width:0 5px 5px}.ng-select.ng-select-opened>.ng-select-container .ng-arrow:hover{border-color:transparent transparent #333}.ng-select.ng-select-opened.ng-select-bottom>.ng-select-container{border-bottom-right-radius:0;border-bottom-left-radius:0}.ng-select.ng-select-opened.ng-select-top>.ng-select-container{border-top-right-radius:0;border-top-left-radius:0}.ng-select.ng-select-focused:not(.ng-select-opened)>.ng-select-container{border-color:#007eff;box-shadow:inset 0 1px 1px #00000013,0 0 0 3px #007eff1a}.ng-select.ng-select-disabled>.ng-select-container{background-color:#f9f9f9}.ng-select .ng-has-value .ng-placeholder{display:none}.ng-select .ng-select-container{background-color:#fff;border-radius:4px;border:1px solid #ccc;min-height:36px;align-items:center}.ng-select .ng-select-container:hover{box-shadow:0 1px #0000000f}.ng-select .ng-select-container .ng-value-container{align-items:center;padding-left:10px}[dir=rtl] .ng-select .ng-select-container .ng-value-container{padding-right:10px;padding-left:0}.ng-select .ng-select-container .ng-value-container .ng-placeholder{color:#999}.ng-select.ng-select-single .ng-select-container{height:36px}.ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input{top:5px;left:0;padding-left:10px;padding-right:50px}[dir=rtl] .ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input{padding-right:10px;padding-left:50px}.ng-select.ng-select-multiple.ng-select-disabled>.ng-select-container .ng-value-container .ng-value{background-color:#f9f9f9;border:1px solid #e6e6e6}.ng-select.ng-select-multiple.ng-select-disabled>.ng-select-container .ng-value-container .ng-value .ng-value-label{padding:0 5px}.ng-select.ng-select-multiple .ng-select-container .ng-value-container{padding-top:5px;padding-left:7px}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container{padding-right:7px;padding-left:0}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{font-size:.9em;margin-bottom:5px;background-color:#ebf5ff;border-radius:2px;margin-right:5px}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{margin-right:0;margin-left:5px}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value.ng-value-disabled{background-color:#f9f9f9}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value.ng-value-disabled .ng-value-label{padding-left:5px}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value.ng-value-disabled .ng-value-label{padding-left:0;padding-right:5px}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-label,.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon{display:inline-block;padding:1px 5px}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon:hover{background-color:#d1e8ff}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.left{border-right:1px solid #b8dbff}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.left{border-left:1px solid #b8dbff;border-right:none}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.right{border-left:1px solid #b8dbff}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.right{border-left:0;border-right:1px solid #b8dbff}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-input{padding:0 0 3px 3px}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-input{padding:0 3px 3px 0}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-placeholder{padding-bottom:5px;padding-left:3px}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-placeholder{padding-right:3px;padding-left:0}.ng-select .ng-clear-wrapper{color:#999}.ng-select .ng-clear-wrapper:hover .ng-clear{color:#d0021b}.ng-select .ng-spinner-zone{padding:5px 5px 0 0}[dir=rtl] .ng-select .ng-spinner-zone{padding:5px 0 0 5px}.ng-select .ng-arrow-wrapper{width:25px;padding-right:5px}[dir=rtl] .ng-select .ng-arrow-wrapper{padding-left:5px;padding-right:0}.ng-select .ng-arrow-wrapper:hover .ng-arrow{border-top-color:#666}.ng-select .ng-arrow-wrapper .ng-arrow{border-color:#999 transparent transparent;border-style:solid;border-width:5px 5px 2.5px}.ng-dropdown-panel{background-color:#fff;border:1px solid #ccc;box-shadow:0 1px #0000000f;left:0}.ng-dropdown-panel.ng-select-bottom{top:100%;border-bottom-right-radius:4px;border-bottom-left-radius:4px;border-top-color:#e6e6e6;margin-top:-1px}.ng-dropdown-panel.ng-select-bottom .ng-dropdown-panel-items .ng-option:last-child{border-bottom-right-radius:4px;border-bottom-left-radius:4px}.ng-dropdown-panel.ng-select-top{bottom:100%;border-top-right-radius:4px;border-top-left-radius:4px;border-bottom-color:#e6e6e6;margin-bottom:-1px}.ng-dropdown-panel.ng-select-top .ng-dropdown-panel-items .ng-option:first-child{border-top-right-radius:4px;border-top-left-radius:4px}.ng-dropdown-panel .ng-dropdown-header{border-bottom:1px solid #ccc;padding:5px 7px}.ng-dropdown-panel .ng-dropdown-footer{border-top:1px solid #ccc;padding:5px 7px}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup{-webkit-user-select:none;user-select:none;padding:8px 10px;font-weight:500;color:#0000008a;cursor:pointer}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-disabled{cursor:default}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-marked{background-color:#f5faff}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-selected,.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-selected.ng-option-marked{background-color:#ebf5ff;font-weight:600}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option{background-color:#fff;color:#000000de;padding:8px 10px}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected,.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked{color:#333;background-color:#ebf5ff}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected .ng-option-label,.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked .ng-option-label{font-weight:600}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-marked{background-color:#f5faff;color:#333}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-disabled{color:#ccc}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-child{padding-left:22px}[dir=rtl] .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-child{padding-right:22px;padding-left:0}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option .ng-tag-label{font-size:80%;font-weight:400;padding-right:5px}[dir=rtl] .ng-dropdown-panel .ng-dropdown-panel-items .ng-option .ng-tag-label{padding-left:5px;padding-right:0}[dir=rtl] .ng-dropdown-panel{direction:rtl;text-align:right}.ng-select,.ng-select.custom .ng-select-container{height:100%;margin-top:-1px;margin-bottom:-1px}.ng-select-container{color:inherit!important;min-height:3rem!important}.select-border-disabled .ng-select-container{border:solid #cbd5e0 1px!important;background-color:#fafafa!important;border-radius:.25rem;padding:1px}.select-border-error .ng-select-container{border:solid #c53030 1px!important;background-color:unset!important;border-radius:.25rem;padding:1px}.select-border-normal .ng-select-container{border:solid #cbd5e0 1px!important;background-color:unset!important;border-radius:.25rem;padding:1px}.ng-value{max-width:100%}.ng-select-dropdown-panel-auto .ng-dropdown-panel .ng-dropdown-panel-items{min-height:unset}.ng-select-dropdown-panel-xs .ng-dropdown-panel .ng-dropdown-panel-items{min-height:80px!important}.ng-select-dropdown-panel-sm .ng-dropdown-panel .ng-dropdown-panel-items{min-height:100px!important}.ng-select-dropdown-panel-md .ng-dropdown-panel .ng-dropdown-panel-items{min-height:120px!important}.ng-select-dropdown-panel-lg .ng-dropdown-panel .ng-dropdown-panel-items{min-height:140px!important}.ng-select-dropdown-panel-xl .ng-dropdown-panel .ng-dropdown-panel-items{min-height:160px!important}.ng-dropdown-panel .ng-dropdown-header{padding:0!important}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$1.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$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i9.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "directive", type: i9.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { kind: "directive", type: i9.NgLabelTemplateDirective, selector: "[ng-label-tmp]" }, { kind: "directive", type: i9.NgHeaderTemplateDirective, selector: "[ng-header-tmp]" }, { kind: "component", type: NgtValidationComponent, selector: "ngt-validation", inputs: ["control", "container", "minValue", "minLength"] }, { kind: "component", type: NgtShiningComponent, selector: "ngt-shining", inputs: ["shiningWidth"] }, { kind: "component", type: NgtHelperComponent, selector: "ngt-helper", inputs: ["helpTextColor", "helpText", "helpTitle", "icon", "iconSize", "iconColor", "iconTitle", "tooltipSize", "autoXReverse", "helperReverseYPosition"] }, { kind: "component", type: NgtSvgComponent, selector: "ngt-svg", inputs: ["src", "class"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }], viewProviders: [
+    ], queries: [{ propertyName: "ngtOptionTemplate", first: true, predicate: NgtSelectOptionTmp, descendants: true, read: TemplateRef }, { propertyName: "ngtOptionSelectedTemplate", first: true, predicate: NgtSelectOptionSelectedTmp, descendants: true, read: TemplateRef }, { propertyName: "ngtSelectHeaderTemplate", first: true, predicate: NgtSelectHeaderTmp, descendants: true, read: TemplateRef }], viewQueries: [{ propertyName: "ngSelectComponent", first: true, predicate: NgSelectComponent, descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<label *ngIf=\"label\" [hidden]='shining'\n    class=\"{{ shining ? '' : 'block' }} {{ ngtStyle.compile(['color.text', 'text', 'font', 'fontCase']) }} mb-2 flex\">\n    <ngt-svg *ngIf=\"labelIcon\" class=\"mr-1 {{labelIconColor}}\" src=\"{{labelIcon}}\"></ngt-svg>\n    {{ label }}:\n\n    <span class=\"text-red-500 font-bold text-md ml-1\" *ngIf=\"isRequired\">*</span>\n\n    <ngt-helper *ngIf=\"helpText\" [helpTitle]=\"helpTitle\" [iconColor]=\"helpTextColor\"\n        [helperReverseYPosition]=\"helperReverseYPosition\" [autoXReverse]=\"helperAutoXReverse\" class=\"ml-1\">\n        {{ helpText }}\n    </ngt-helper>\n</label>\n\n<div [hidden]='shining' class=\"{{ getSelectClass() }} normal-case\" style=\"min-height: 3rem;\">\n    <ng-select class=\"custom\" [(ngModel)]='nativeValue' [name]='nativeName' [addTag]='allowCreate'\n        [addTagText]=\"createText || ngtTranslateService.ngtSelectCreateText\" [bindLabel]=\"bindLabel\"\n        [multiple]=\"multiple\" [hideSelected]=\"hideSelected\" [typeahead]=\"typeahead\"\n        [notFoundText]=\"notFoundText || ngtTranslateService.ngtSelectNotFoundText\" [searchable]=\"searchable\"\n        [disabled]='disabled() || isReadonly' [clearable]=\"clearable && hasSelectedValue()\"\n        [closeOnSelect]=\"closeOnSelect\" [trackByFn]=\"trackBy\" [labelForId]=\"labelForId\"\n        [typeToSearchText]=\"typeToSearchText || ngtTranslateService.ngtSelectTypeToSearchText\"\n        [placeholder]=\"placeholder || ngtTranslateService.ngtSelectPlaceholder\" [dropdownPosition]=\"dropdownPosition\"\n        [groupBy]=\"groupBy\" [clearAllText]=\"clearAllTooltip || ngtTranslateService.ngtSelectClearAllTooltip\"\n        [clearSearchOnAdd]=\"clearSearchOnAdd\" [bindValue]=\"bindValue\" [virtualScroll]=\"virtualScroll\"\n        [loadingText]=\"loadingText || ngtTranslateService.ngtSelectLoadingText\" [maxSelectedItems]=\"maxSelectedItems\"\n        [tabIndex]=\"tabIndex\" [items]=\"ngSelectItems | async\" [groupValue]=\"groupValue\" [loading]=\"loading\"\n        [compareWith]='compareWith' [inputAttrs]=\"inputAttrs\" (scroll)=\"onScroll($event)\" (close)=\"onClose.emit()\"\n        (change)=\"onNativeChange($event)\" (clear)='onClearSelect()' (remove)='onRemoveSelectedItem($event)'\n        (click)=\"wasClicked = true\">\n\n        <ng-template *ngIf='ngtSelectHeaderTemplate' ng-header-tmp>\n            <ng-template [ngTemplateOutlet]=\"ngtSelectHeaderTemplate\">\n            </ng-template>\n        </ng-template>\n\n        <ng-template ng-label-tmp let-item=\"item\">\n            <div class=\"flex w-full items-center pr-1\">\n                <ng-container *ngIf=\"multiple && !cantRemoveItem(item)\">\n                    <div class=\"ng-value-icon px-1 h-full border-r mr-2 {{ ngtStyle.compile(['color.text', 'text']) }} cursor-pointer\"\n                        (click)='removeItem($event, item)'>\n                        <svg class=\"ng-value-icon fill-current self-center\" xmlns=\"http://www.w3.org/2000/svg\"\n                            viewBox=\"0 0 24 24\">\n                            <path\n                                d=\"M19.1 17.2l-5.3-5.3 5.3-5.3-1.8-1.8-5.3 5.4-5.3-5.3-1.8 1.7 5.3 5.3-5.3 5.3L6.7 19l5.3-5.3 5.3 5.3 1.8-1.8z\" />\n                        </svg>\n                    </div>\n                </ng-container>\n\n                <ng-template *ngIf='ngtOptionSelectedTemplate' [ngTemplateOutlet]=\"ngtOptionSelectedTemplate\"\n                    [ngTemplateOutletContext]=\"{ item: item }\">\n                </ng-template>\n\n                <ng-template *ngIf='!ngtOptionSelectedTemplate' [ngTemplateOutlet]=\"ngtOptionTemplate\"\n                    [ngTemplateOutletContext]=\"{ item: item }\">\n                </ng-template>\n            </div>\n        </ng-template>\n\n        <ng-template ng-option-tmp let-item=\"item\" let-index=\"index\" let-search=\"searchTerm\">\n            <ng-template [ngTemplateOutlet]=\"ngtOptionTemplate\"\n                [ngTemplateOutletContext]=\"{ item: item, index: index, searchTerm: search }\">\n            </ng-template>\n        </ng-template>\n    </ng-select>\n</div>\n\n<ng-container *ngIf='shining'>\n    <div class=\"flex\">\n        <ngt-shining class=\"{{ ngtStyle.compile(['h']) }} w-full\"></ngt-shining>\n    </div>\n</ng-container>\n\n<ngt-validation [control]=\"formControl\" [container]=\"formContainer\"></ngt-validation>\n\n<input *ngIf='componentReady' type='hidden' [ngModel]=\"value\" [name]=\"name\" [value]=\"value\">", styles: [".ng-select.ng-select-opened>.ng-select-container{background:#fff;border-color:#b3b3b3 #ccc #d9d9d9}.ng-select.ng-select-opened>.ng-select-container:hover{box-shadow:none}.ng-select.ng-select-opened>.ng-select-container .ng-arrow{top:-2px;border-color:transparent transparent #999;border-width:0 5px 5px}.ng-select.ng-select-opened>.ng-select-container .ng-arrow:hover{border-color:transparent transparent #333}.ng-select.ng-select-opened.ng-select-bottom>.ng-select-container{border-bottom-right-radius:0;border-bottom-left-radius:0}.ng-select.ng-select-opened.ng-select-top>.ng-select-container{border-top-right-radius:0;border-top-left-radius:0}.ng-select.ng-select-focused:not(.ng-select-opened)>.ng-select-container{border-color:#007eff;box-shadow:inset 0 1px 1px #00000013,0 0 0 3px #007eff1a}.ng-select.ng-select-disabled>.ng-select-container{background-color:#f9f9f9}.ng-select .ng-has-value .ng-placeholder{display:none}.ng-select .ng-select-container{background-color:#fff;border-radius:4px;border:1px solid #ccc;min-height:36px;align-items:center}.ng-select .ng-select-container:hover{box-shadow:0 1px #0000000f}.ng-select .ng-select-container .ng-value-container{align-items:center;padding-left:10px}[dir=rtl] .ng-select .ng-select-container .ng-value-container{padding-right:10px;padding-left:0}.ng-select .ng-select-container .ng-value-container .ng-placeholder{color:#999}.ng-select.ng-select-single .ng-select-container{height:36px}.ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input{top:5px;left:0;padding-left:10px;padding-right:50px}[dir=rtl] .ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input{padding-right:10px;padding-left:50px}.ng-select.ng-select-multiple.ng-select-disabled>.ng-select-container .ng-value-container .ng-value{background-color:#f9f9f9;border:1px solid #e6e6e6}.ng-select.ng-select-multiple.ng-select-disabled>.ng-select-container .ng-value-container .ng-value .ng-value-label{padding:0 5px}.ng-select.ng-select-multiple .ng-select-container .ng-value-container{padding-top:5px;padding-left:7px}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container{padding-right:7px;padding-left:0}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{font-size:.9em;margin-bottom:5px;background-color:#ebf5ff;border-radius:2px;margin-right:5px}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{margin-right:0;margin-left:5px}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value.ng-value-disabled{background-color:#f9f9f9}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value.ng-value-disabled .ng-value-label{padding-left:5px}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value.ng-value-disabled .ng-value-label{padding-left:0;padding-right:5px}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-label,.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon{display:inline-block;padding:1px 5px}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon:hover{background-color:#d1e8ff}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.left{border-right:1px solid #b8dbff}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.left{border-left:1px solid #b8dbff;border-right:none}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.right{border-left:1px solid #b8dbff}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.right{border-left:0;border-right:1px solid #b8dbff}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-input{padding:0 0 3px 3px}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-input{padding:0 3px 3px 0}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-placeholder{padding-bottom:5px;padding-left:3px}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-placeholder{padding-right:3px;padding-left:0}.ng-select .ng-clear-wrapper{color:#999}.ng-select .ng-clear-wrapper:hover .ng-clear{color:#d0021b}.ng-select .ng-spinner-zone{padding:5px 5px 0 0}[dir=rtl] .ng-select .ng-spinner-zone{padding:5px 0 0 5px}.ng-select .ng-arrow-wrapper{width:25px;padding-right:5px}[dir=rtl] .ng-select .ng-arrow-wrapper{padding-left:5px;padding-right:0}.ng-select .ng-arrow-wrapper:hover .ng-arrow{border-top-color:#666}.ng-select .ng-arrow-wrapper .ng-arrow{border-color:#999 transparent transparent;border-style:solid;border-width:5px 5px 2.5px}.ng-dropdown-panel{background-color:#fff;border:1px solid #ccc;box-shadow:0 1px #0000000f;left:0}.ng-dropdown-panel.ng-select-bottom{top:100%;border-bottom-right-radius:4px;border-bottom-left-radius:4px;border-top-color:#e6e6e6;margin-top:-1px}.ng-dropdown-panel.ng-select-bottom .ng-dropdown-panel-items .ng-option:last-child{border-bottom-right-radius:4px;border-bottom-left-radius:4px}.ng-dropdown-panel.ng-select-top{bottom:100%;border-top-right-radius:4px;border-top-left-radius:4px;border-bottom-color:#e6e6e6;margin-bottom:-1px}.ng-dropdown-panel.ng-select-top .ng-dropdown-panel-items .ng-option:first-child{border-top-right-radius:4px;border-top-left-radius:4px}.ng-dropdown-panel .ng-dropdown-header{border-bottom:1px solid #ccc;padding:5px 7px}.ng-dropdown-panel .ng-dropdown-footer{border-top:1px solid #ccc;padding:5px 7px}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup{-webkit-user-select:none;user-select:none;padding:8px 10px;font-weight:500;color:#0000008a;cursor:pointer}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-disabled{cursor:default}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-marked{background-color:#f5faff}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-selected,.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-selected.ng-option-marked{background-color:#ebf5ff;font-weight:600}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option{background-color:#fff;color:#000000de;padding:8px 10px}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected,.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked{color:#333;background-color:#ebf5ff}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected .ng-option-label,.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked .ng-option-label{font-weight:600}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-marked{background-color:#f5faff;color:#333}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-disabled{color:#ccc}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-child{padding-left:22px}[dir=rtl] .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-child{padding-right:22px;padding-left:0}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option .ng-tag-label{font-size:80%;font-weight:400;padding-right:5px}[dir=rtl] .ng-dropdown-panel .ng-dropdown-panel-items .ng-option .ng-tag-label{padding-left:5px;padding-right:0}[dir=rtl] .ng-dropdown-panel{direction:rtl;text-align:right}.ng-select,.ng-select.custom .ng-select-container{height:100%;margin-top:-1px;margin-bottom:-1px}.ng-select-container{color:inherit!important;min-height:3rem!important}.select-border-disabled .ng-select-container{border:solid #cbd5e0 1px!important;background-color:#fafafa!important;border-radius:.25rem;padding:1px}.select-border-error .ng-select-container{border:solid #c53030 1px!important;background-color:unset!important;border-radius:.25rem;padding:1px}.select-border-normal .ng-select-container{border:solid #cbd5e0 1px!important;background-color:unset!important;border-radius:.25rem;padding:1px}.ng-value{max-width:100%}.ng-select-dropdown-panel-auto .ng-dropdown-panel .ng-dropdown-panel-items{min-height:unset}.ng-select-dropdown-panel-xs .ng-dropdown-panel .ng-dropdown-panel-items{min-height:80px!important}.ng-select-dropdown-panel-sm .ng-dropdown-panel .ng-dropdown-panel-items{min-height:100px!important}.ng-select-dropdown-panel-md .ng-dropdown-panel .ng-dropdown-panel-items{min-height:120px!important}.ng-select-dropdown-panel-lg .ng-dropdown-panel .ng-dropdown-panel-items{min-height:140px!important}.ng-select-dropdown-panel-xl .ng-dropdown-panel .ng-dropdown-panel-items{min-height:160px!important}.ng-dropdown-panel .ng-dropdown-header{padding:0!important}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$1.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$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i9.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "directive", type: i9.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { kind: "directive", type: i9.NgLabelTemplateDirective, selector: "[ng-label-tmp]" }, { kind: "directive", type: i9.NgHeaderTemplateDirective, selector: "[ng-header-tmp]" }, { kind: "component", type: NgtValidationComponent, selector: "ngt-validation", inputs: ["control", "container", "minValue", "minLength"] }, { kind: "component", type: NgtShiningComponent, selector: "ngt-shining", inputs: ["shiningWidth"] }, { kind: "component", type: NgtHelperComponent, selector: "ngt-helper", inputs: ["helpTextColor", "helpText", "helpTitle", "icon", "iconSize", "iconColor", "iconTitle", "tooltipSize", "autoXReverse", "helperReverseYPosition"] }, { kind: "component", type: NgtSvgComponent, selector: "ngt-svg", inputs: ["src", "class"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }], viewProviders: [
         { provide: ControlContainer, useExisting: NgForm }
     ], encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtSelectComponent, decorators: [{
@@ -3462,7 +3466,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImpor
                         NgtMakeProvider(NgtSelectComponent)
                     ], viewProviders: [
                         { provide: ControlContainer, useExisting: NgForm }
-                    ], encapsulation: ViewEncapsulation.None, template: "<label *ngIf=\"label\" [hidden]='shining'\n    class=\"{{ shining ? '' : 'block' }} {{ ngtStyle.compile(['color.text', 'text', 'font', 'fontCase']) }} mb-2 flex\">\n    <ngt-svg *ngIf=\"labelIcon\" class=\"mr-1 {{labelIconColor}}\" src=\"{{labelIcon}}\"></ngt-svg>\n    {{ label }}:\n\n    <span class=\"text-red-500 font-bold text-md ml-1\" *ngIf=\"isRequired\">*</span>\n\n    <ngt-helper *ngIf=\"helpText\" [helpTitle]=\"helpTitle\" [iconColor]=\"helpTextColor\"\n        [helperReverseYPosition]=\"helperReverseYPosition\" [autoXReverse]=\"helperAutoXReverse\" class=\"ml-1\">\n        {{ helpText }}\n    </ngt-helper>\n</label>\n\n<div [hidden]='shining' class=\"{{ getSelectClass() }} normal-case\" style=\"min-height: 3rem;\">\n    <ng-select class=\"custom\" [(ngModel)]='nativeValue' [name]='nativeName' [addTag]='allowCreate'\n        [addTagText]=\"createText || ngtTranslateService.ngtSelectCreateText\" [bindLabel]=\"bindLabel\"\n        [multiple]=\"multiple\" [hideSelected]=\"hideSelected\" [typeahead]=\"typeahead\"\n        [notFoundText]=\"notFoundText || ngtTranslateService.ngtSelectNotFoundText\" [searchable]=\"searchable\"\n        [disabled]='disabled() || isReadonly' [clearable]=\"clearable && hasSelectedValue()\"\n        [closeOnSelect]=\"closeOnSelect\" [trackByFn]=\"trackBy\" [labelForId]=\"labelForId\"\n        [typeToSearchText]=\"typeToSearchText || ngtTranslateService.ngtSelectTypeToSearchText\"\n        [placeholder]=\"placeholder || ngtTranslateService.ngtSelectPlaceholder\" [dropdownPosition]=\"dropdownPosition\"\n        [groupBy]=\"groupBy\" [clearAllText]=\"clearAllTooltip || ngtTranslateService.ngtSelectClearAllTooltip\"\n        [clearSearchOnAdd]=\"clearSearchOnAdd\" [bindValue]=\"bindValue\" [virtualScroll]=\"virtualScroll\"\n        [loadingText]=\"loadingText || ngtTranslateService.ngtSelectLoadingText\" [maxSelectedItems]=\"maxSelectedItems\"\n        [tabIndex]=\"tabIndex\" [items]=\"ngSelectItems | async\" [groupValue]=\"groupValue\" [loading]=\"loading\"\n        [compareWith]='compareWith' [inputAttrs]=\"inputAttrs\" (scroll)=\"onScroll($event)\" (close)=\"onClose.emit()\"\n        (change)=\"onNativeChange($event)\" (clear)='onClearSelect()' (remove)='onRemoveSelectedItem($event)'\n        (click)=\"wasClicked = true\">\n\n        <ng-template *ngIf='ngtSelectHeaderTemplate' ng-header-tmp>\n            <ng-template [ngTemplateOutlet]=\"ngtSelectHeaderTemplate\">\n            </ng-template>\n        </ng-template>\n\n        <ng-template ng-label-tmp let-item=\"item\">\n            <div class=\"flex w-full items-center pr-1\">\n                <ng-container *ngIf=\"multiple\">\n                    <div class=\"ng-value-icon px-1 h-full border-r mr-2 {{ ngtStyle.compile(['color.text', 'text']) }} cursor-pointer\"\n                        (click)='removeItem($event, item)'>\n                        <svg class=\"ng-value-icon fill-current self-center\" xmlns=\"http://www.w3.org/2000/svg\"\n                            viewBox=\"0 0 24 24\">\n                            <path\n                                d=\"M19.1 17.2l-5.3-5.3 5.3-5.3-1.8-1.8-5.3 5.4-5.3-5.3-1.8 1.7 5.3 5.3-5.3 5.3L6.7 19l5.3-5.3 5.3 5.3 1.8-1.8z\" />\n                        </svg>\n                    </div>\n                </ng-container>\n\n                <ng-template *ngIf='ngtOptionSelectedTemplate' [ngTemplateOutlet]=\"ngtOptionSelectedTemplate\"\n                    [ngTemplateOutletContext]=\"{ item: item }\">\n                </ng-template>\n\n                <ng-template *ngIf='!ngtOptionSelectedTemplate' [ngTemplateOutlet]=\"ngtOptionTemplate\"\n                    [ngTemplateOutletContext]=\"{ item: item }\">\n                </ng-template>\n            </div>\n        </ng-template>\n\n        <ng-template ng-option-tmp let-item=\"item\" let-index=\"index\" let-search=\"searchTerm\">\n            <ng-template [ngTemplateOutlet]=\"ngtOptionTemplate\"\n                [ngTemplateOutletContext]=\"{ item: item, index: index, searchTerm: search }\">\n            </ng-template>\n        </ng-template>\n    </ng-select>\n</div>\n\n<ng-container *ngIf='shining'>\n    <div class=\"flex\">\n        <ngt-shining class=\"{{ ngtStyle.compile(['h']) }} w-full\"></ngt-shining>\n    </div>\n</ng-container>\n\n<ngt-validation [control]=\"formControl\" [container]=\"formContainer\"></ngt-validation>\n\n<input *ngIf='componentReady' type='hidden' [ngModel]=\"value\" [name]=\"name\" [value]=\"value\">", styles: [".ng-select.ng-select-opened>.ng-select-container{background:#fff;border-color:#b3b3b3 #ccc #d9d9d9}.ng-select.ng-select-opened>.ng-select-container:hover{box-shadow:none}.ng-select.ng-select-opened>.ng-select-container .ng-arrow{top:-2px;border-color:transparent transparent #999;border-width:0 5px 5px}.ng-select.ng-select-opened>.ng-select-container .ng-arrow:hover{border-color:transparent transparent #333}.ng-select.ng-select-opened.ng-select-bottom>.ng-select-container{border-bottom-right-radius:0;border-bottom-left-radius:0}.ng-select.ng-select-opened.ng-select-top>.ng-select-container{border-top-right-radius:0;border-top-left-radius:0}.ng-select.ng-select-focused:not(.ng-select-opened)>.ng-select-container{border-color:#007eff;box-shadow:inset 0 1px 1px #00000013,0 0 0 3px #007eff1a}.ng-select.ng-select-disabled>.ng-select-container{background-color:#f9f9f9}.ng-select .ng-has-value .ng-placeholder{display:none}.ng-select .ng-select-container{background-color:#fff;border-radius:4px;border:1px solid #ccc;min-height:36px;align-items:center}.ng-select .ng-select-container:hover{box-shadow:0 1px #0000000f}.ng-select .ng-select-container .ng-value-container{align-items:center;padding-left:10px}[dir=rtl] .ng-select .ng-select-container .ng-value-container{padding-right:10px;padding-left:0}.ng-select .ng-select-container .ng-value-container .ng-placeholder{color:#999}.ng-select.ng-select-single .ng-select-container{height:36px}.ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input{top:5px;left:0;padding-left:10px;padding-right:50px}[dir=rtl] .ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input{padding-right:10px;padding-left:50px}.ng-select.ng-select-multiple.ng-select-disabled>.ng-select-container .ng-value-container .ng-value{background-color:#f9f9f9;border:1px solid #e6e6e6}.ng-select.ng-select-multiple.ng-select-disabled>.ng-select-container .ng-value-container .ng-value .ng-value-label{padding:0 5px}.ng-select.ng-select-multiple .ng-select-container .ng-value-container{padding-top:5px;padding-left:7px}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container{padding-right:7px;padding-left:0}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{font-size:.9em;margin-bottom:5px;background-color:#ebf5ff;border-radius:2px;margin-right:5px}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{margin-right:0;margin-left:5px}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value.ng-value-disabled{background-color:#f9f9f9}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value.ng-value-disabled .ng-value-label{padding-left:5px}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value.ng-value-disabled .ng-value-label{padding-left:0;padding-right:5px}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-label,.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon{display:inline-block;padding:1px 5px}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon:hover{background-color:#d1e8ff}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.left{border-right:1px solid #b8dbff}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.left{border-left:1px solid #b8dbff;border-right:none}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.right{border-left:1px solid #b8dbff}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.right{border-left:0;border-right:1px solid #b8dbff}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-input{padding:0 0 3px 3px}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-input{padding:0 3px 3px 0}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-placeholder{padding-bottom:5px;padding-left:3px}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-placeholder{padding-right:3px;padding-left:0}.ng-select .ng-clear-wrapper{color:#999}.ng-select .ng-clear-wrapper:hover .ng-clear{color:#d0021b}.ng-select .ng-spinner-zone{padding:5px 5px 0 0}[dir=rtl] .ng-select .ng-spinner-zone{padding:5px 0 0 5px}.ng-select .ng-arrow-wrapper{width:25px;padding-right:5px}[dir=rtl] .ng-select .ng-arrow-wrapper{padding-left:5px;padding-right:0}.ng-select .ng-arrow-wrapper:hover .ng-arrow{border-top-color:#666}.ng-select .ng-arrow-wrapper .ng-arrow{border-color:#999 transparent transparent;border-style:solid;border-width:5px 5px 2.5px}.ng-dropdown-panel{background-color:#fff;border:1px solid #ccc;box-shadow:0 1px #0000000f;left:0}.ng-dropdown-panel.ng-select-bottom{top:100%;border-bottom-right-radius:4px;border-bottom-left-radius:4px;border-top-color:#e6e6e6;margin-top:-1px}.ng-dropdown-panel.ng-select-bottom .ng-dropdown-panel-items .ng-option:last-child{border-bottom-right-radius:4px;border-bottom-left-radius:4px}.ng-dropdown-panel.ng-select-top{bottom:100%;border-top-right-radius:4px;border-top-left-radius:4px;border-bottom-color:#e6e6e6;margin-bottom:-1px}.ng-dropdown-panel.ng-select-top .ng-dropdown-panel-items .ng-option:first-child{border-top-right-radius:4px;border-top-left-radius:4px}.ng-dropdown-panel .ng-dropdown-header{border-bottom:1px solid #ccc;padding:5px 7px}.ng-dropdown-panel .ng-dropdown-footer{border-top:1px solid #ccc;padding:5px 7px}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup{-webkit-user-select:none;user-select:none;padding:8px 10px;font-weight:500;color:#0000008a;cursor:pointer}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-disabled{cursor:default}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-marked{background-color:#f5faff}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-selected,.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-selected.ng-option-marked{background-color:#ebf5ff;font-weight:600}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option{background-color:#fff;color:#000000de;padding:8px 10px}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected,.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked{color:#333;background-color:#ebf5ff}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected .ng-option-label,.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked .ng-option-label{font-weight:600}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-marked{background-color:#f5faff;color:#333}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-disabled{color:#ccc}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-child{padding-left:22px}[dir=rtl] .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-child{padding-right:22px;padding-left:0}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option .ng-tag-label{font-size:80%;font-weight:400;padding-right:5px}[dir=rtl] .ng-dropdown-panel .ng-dropdown-panel-items .ng-option .ng-tag-label{padding-left:5px;padding-right:0}[dir=rtl] .ng-dropdown-panel{direction:rtl;text-align:right}.ng-select,.ng-select.custom .ng-select-container{height:100%;margin-top:-1px;margin-bottom:-1px}.ng-select-container{color:inherit!important;min-height:3rem!important}.select-border-disabled .ng-select-container{border:solid #cbd5e0 1px!important;background-color:#fafafa!important;border-radius:.25rem;padding:1px}.select-border-error .ng-select-container{border:solid #c53030 1px!important;background-color:unset!important;border-radius:.25rem;padding:1px}.select-border-normal .ng-select-container{border:solid #cbd5e0 1px!important;background-color:unset!important;border-radius:.25rem;padding:1px}.ng-value{max-width:100%}.ng-select-dropdown-panel-auto .ng-dropdown-panel .ng-dropdown-panel-items{min-height:unset}.ng-select-dropdown-panel-xs .ng-dropdown-panel .ng-dropdown-panel-items{min-height:80px!important}.ng-select-dropdown-panel-sm .ng-dropdown-panel .ng-dropdown-panel-items{min-height:100px!important}.ng-select-dropdown-panel-md .ng-dropdown-panel .ng-dropdown-panel-items{min-height:120px!important}.ng-select-dropdown-panel-lg .ng-dropdown-panel .ng-dropdown-panel-items{min-height:140px!important}.ng-select-dropdown-panel-xl .ng-dropdown-panel .ng-dropdown-panel-items{min-height:160px!important}.ng-dropdown-panel .ng-dropdown-header{padding:0!important}\n"] }]
+                    ], encapsulation: ViewEncapsulation.None, template: "<label *ngIf=\"label\" [hidden]='shining'\n    class=\"{{ shining ? '' : 'block' }} {{ ngtStyle.compile(['color.text', 'text', 'font', 'fontCase']) }} mb-2 flex\">\n    <ngt-svg *ngIf=\"labelIcon\" class=\"mr-1 {{labelIconColor}}\" src=\"{{labelIcon}}\"></ngt-svg>\n    {{ label }}:\n\n    <span class=\"text-red-500 font-bold text-md ml-1\" *ngIf=\"isRequired\">*</span>\n\n    <ngt-helper *ngIf=\"helpText\" [helpTitle]=\"helpTitle\" [iconColor]=\"helpTextColor\"\n        [helperReverseYPosition]=\"helperReverseYPosition\" [autoXReverse]=\"helperAutoXReverse\" class=\"ml-1\">\n        {{ helpText }}\n    </ngt-helper>\n</label>\n\n<div [hidden]='shining' class=\"{{ getSelectClass() }} normal-case\" style=\"min-height: 3rem;\">\n    <ng-select class=\"custom\" [(ngModel)]='nativeValue' [name]='nativeName' [addTag]='allowCreate'\n        [addTagText]=\"createText || ngtTranslateService.ngtSelectCreateText\" [bindLabel]=\"bindLabel\"\n        [multiple]=\"multiple\" [hideSelected]=\"hideSelected\" [typeahead]=\"typeahead\"\n        [notFoundText]=\"notFoundText || ngtTranslateService.ngtSelectNotFoundText\" [searchable]=\"searchable\"\n        [disabled]='disabled() || isReadonly' [clearable]=\"clearable && hasSelectedValue()\"\n        [closeOnSelect]=\"closeOnSelect\" [trackByFn]=\"trackBy\" [labelForId]=\"labelForId\"\n        [typeToSearchText]=\"typeToSearchText || ngtTranslateService.ngtSelectTypeToSearchText\"\n        [placeholder]=\"placeholder || ngtTranslateService.ngtSelectPlaceholder\" [dropdownPosition]=\"dropdownPosition\"\n        [groupBy]=\"groupBy\" [clearAllText]=\"clearAllTooltip || ngtTranslateService.ngtSelectClearAllTooltip\"\n        [clearSearchOnAdd]=\"clearSearchOnAdd\" [bindValue]=\"bindValue\" [virtualScroll]=\"virtualScroll\"\n        [loadingText]=\"loadingText || ngtTranslateService.ngtSelectLoadingText\" [maxSelectedItems]=\"maxSelectedItems\"\n        [tabIndex]=\"tabIndex\" [items]=\"ngSelectItems | async\" [groupValue]=\"groupValue\" [loading]=\"loading\"\n        [compareWith]='compareWith' [inputAttrs]=\"inputAttrs\" (scroll)=\"onScroll($event)\" (close)=\"onClose.emit()\"\n        (change)=\"onNativeChange($event)\" (clear)='onClearSelect()' (remove)='onRemoveSelectedItem($event)'\n        (click)=\"wasClicked = true\">\n\n        <ng-template *ngIf='ngtSelectHeaderTemplate' ng-header-tmp>\n            <ng-template [ngTemplateOutlet]=\"ngtSelectHeaderTemplate\">\n            </ng-template>\n        </ng-template>\n\n        <ng-template ng-label-tmp let-item=\"item\">\n            <div class=\"flex w-full items-center pr-1\">\n                <ng-container *ngIf=\"multiple && !cantRemoveItem(item)\">\n                    <div class=\"ng-value-icon px-1 h-full border-r mr-2 {{ ngtStyle.compile(['color.text', 'text']) }} cursor-pointer\"\n                        (click)='removeItem($event, item)'>\n                        <svg class=\"ng-value-icon fill-current self-center\" xmlns=\"http://www.w3.org/2000/svg\"\n                            viewBox=\"0 0 24 24\">\n                            <path\n                                d=\"M19.1 17.2l-5.3-5.3 5.3-5.3-1.8-1.8-5.3 5.4-5.3-5.3-1.8 1.7 5.3 5.3-5.3 5.3L6.7 19l5.3-5.3 5.3 5.3 1.8-1.8z\" />\n                        </svg>\n                    </div>\n                </ng-container>\n\n                <ng-template *ngIf='ngtOptionSelectedTemplate' [ngTemplateOutlet]=\"ngtOptionSelectedTemplate\"\n                    [ngTemplateOutletContext]=\"{ item: item }\">\n                </ng-template>\n\n                <ng-template *ngIf='!ngtOptionSelectedTemplate' [ngTemplateOutlet]=\"ngtOptionTemplate\"\n                    [ngTemplateOutletContext]=\"{ item: item }\">\n                </ng-template>\n            </div>\n        </ng-template>\n\n        <ng-template ng-option-tmp let-item=\"item\" let-index=\"index\" let-search=\"searchTerm\">\n            <ng-template [ngTemplateOutlet]=\"ngtOptionTemplate\"\n                [ngTemplateOutletContext]=\"{ item: item, index: index, searchTerm: search }\">\n            </ng-template>\n        </ng-template>\n    </ng-select>\n</div>\n\n<ng-container *ngIf='shining'>\n    <div class=\"flex\">\n        <ngt-shining class=\"{{ ngtStyle.compile(['h']) }} w-full\"></ngt-shining>\n    </div>\n</ng-container>\n\n<ngt-validation [control]=\"formControl\" [container]=\"formContainer\"></ngt-validation>\n\n<input *ngIf='componentReady' type='hidden' [ngModel]=\"value\" [name]=\"name\" [value]=\"value\">", styles: [".ng-select.ng-select-opened>.ng-select-container{background:#fff;border-color:#b3b3b3 #ccc #d9d9d9}.ng-select.ng-select-opened>.ng-select-container:hover{box-shadow:none}.ng-select.ng-select-opened>.ng-select-container .ng-arrow{top:-2px;border-color:transparent transparent #999;border-width:0 5px 5px}.ng-select.ng-select-opened>.ng-select-container .ng-arrow:hover{border-color:transparent transparent #333}.ng-select.ng-select-opened.ng-select-bottom>.ng-select-container{border-bottom-right-radius:0;border-bottom-left-radius:0}.ng-select.ng-select-opened.ng-select-top>.ng-select-container{border-top-right-radius:0;border-top-left-radius:0}.ng-select.ng-select-focused:not(.ng-select-opened)>.ng-select-container{border-color:#007eff;box-shadow:inset 0 1px 1px #00000013,0 0 0 3px #007eff1a}.ng-select.ng-select-disabled>.ng-select-container{background-color:#f9f9f9}.ng-select .ng-has-value .ng-placeholder{display:none}.ng-select .ng-select-container{background-color:#fff;border-radius:4px;border:1px solid #ccc;min-height:36px;align-items:center}.ng-select .ng-select-container:hover{box-shadow:0 1px #0000000f}.ng-select .ng-select-container .ng-value-container{align-items:center;padding-left:10px}[dir=rtl] .ng-select .ng-select-container .ng-value-container{padding-right:10px;padding-left:0}.ng-select .ng-select-container .ng-value-container .ng-placeholder{color:#999}.ng-select.ng-select-single .ng-select-container{height:36px}.ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input{top:5px;left:0;padding-left:10px;padding-right:50px}[dir=rtl] .ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input{padding-right:10px;padding-left:50px}.ng-select.ng-select-multiple.ng-select-disabled>.ng-select-container .ng-value-container .ng-value{background-color:#f9f9f9;border:1px solid #e6e6e6}.ng-select.ng-select-multiple.ng-select-disabled>.ng-select-container .ng-value-container .ng-value .ng-value-label{padding:0 5px}.ng-select.ng-select-multiple .ng-select-container .ng-value-container{padding-top:5px;padding-left:7px}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container{padding-right:7px;padding-left:0}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{font-size:.9em;margin-bottom:5px;background-color:#ebf5ff;border-radius:2px;margin-right:5px}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{margin-right:0;margin-left:5px}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value.ng-value-disabled{background-color:#f9f9f9}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value.ng-value-disabled .ng-value-label{padding-left:5px}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value.ng-value-disabled .ng-value-label{padding-left:0;padding-right:5px}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-label,.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon{display:inline-block;padding:1px 5px}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon:hover{background-color:#d1e8ff}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.left{border-right:1px solid #b8dbff}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.left{border-left:1px solid #b8dbff;border-right:none}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.right{border-left:1px solid #b8dbff}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.right{border-left:0;border-right:1px solid #b8dbff}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-input{padding:0 0 3px 3px}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-input{padding:0 3px 3px 0}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-placeholder{padding-bottom:5px;padding-left:3px}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-placeholder{padding-right:3px;padding-left:0}.ng-select .ng-clear-wrapper{color:#999}.ng-select .ng-clear-wrapper:hover .ng-clear{color:#d0021b}.ng-select .ng-spinner-zone{padding:5px 5px 0 0}[dir=rtl] .ng-select .ng-spinner-zone{padding:5px 0 0 5px}.ng-select .ng-arrow-wrapper{width:25px;padding-right:5px}[dir=rtl] .ng-select .ng-arrow-wrapper{padding-left:5px;padding-right:0}.ng-select .ng-arrow-wrapper:hover .ng-arrow{border-top-color:#666}.ng-select .ng-arrow-wrapper .ng-arrow{border-color:#999 transparent transparent;border-style:solid;border-width:5px 5px 2.5px}.ng-dropdown-panel{background-color:#fff;border:1px solid #ccc;box-shadow:0 1px #0000000f;left:0}.ng-dropdown-panel.ng-select-bottom{top:100%;border-bottom-right-radius:4px;border-bottom-left-radius:4px;border-top-color:#e6e6e6;margin-top:-1px}.ng-dropdown-panel.ng-select-bottom .ng-dropdown-panel-items .ng-option:last-child{border-bottom-right-radius:4px;border-bottom-left-radius:4px}.ng-dropdown-panel.ng-select-top{bottom:100%;border-top-right-radius:4px;border-top-left-radius:4px;border-bottom-color:#e6e6e6;margin-bottom:-1px}.ng-dropdown-panel.ng-select-top .ng-dropdown-panel-items .ng-option:first-child{border-top-right-radius:4px;border-top-left-radius:4px}.ng-dropdown-panel .ng-dropdown-header{border-bottom:1px solid #ccc;padding:5px 7px}.ng-dropdown-panel .ng-dropdown-footer{border-top:1px solid #ccc;padding:5px 7px}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup{-webkit-user-select:none;user-select:none;padding:8px 10px;font-weight:500;color:#0000008a;cursor:pointer}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-disabled{cursor:default}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-marked{background-color:#f5faff}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-selected,.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-selected.ng-option-marked{background-color:#ebf5ff;font-weight:600}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option{background-color:#fff;color:#000000de;padding:8px 10px}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected,.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked{color:#333;background-color:#ebf5ff}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected .ng-option-label,.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked .ng-option-label{font-weight:600}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-marked{background-color:#f5faff;color:#333}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-disabled{color:#ccc}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-child{padding-left:22px}[dir=rtl] .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-child{padding-right:22px;padding-left:0}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option .ng-tag-label{font-size:80%;font-weight:400;padding-right:5px}[dir=rtl] .ng-dropdown-panel .ng-dropdown-panel-items .ng-option .ng-tag-label{padding-left:5px;padding-right:0}[dir=rtl] .ng-dropdown-panel{direction:rtl;text-align:right}.ng-select,.ng-select.custom .ng-select-container{height:100%;margin-top:-1px;margin-bottom:-1px}.ng-select-container{color:inherit!important;min-height:3rem!important}.select-border-disabled .ng-select-container{border:solid #cbd5e0 1px!important;background-color:#fafafa!important;border-radius:.25rem;padding:1px}.select-border-error .ng-select-container{border:solid #c53030 1px!important;background-color:unset!important;border-radius:.25rem;padding:1px}.select-border-normal .ng-select-container{border:solid #cbd5e0 1px!important;background-color:unset!important;border-radius:.25rem;padding:1px}.ng-value{max-width:100%}.ng-select-dropdown-panel-auto .ng-dropdown-panel .ng-dropdown-panel-items{min-height:unset}.ng-select-dropdown-panel-xs .ng-dropdown-panel .ng-dropdown-panel-items{min-height:80px!important}.ng-select-dropdown-panel-sm .ng-dropdown-panel .ng-dropdown-panel-items{min-height:100px!important}.ng-select-dropdown-panel-md .ng-dropdown-panel .ng-dropdown-panel-items{min-height:120px!important}.ng-select-dropdown-panel-lg .ng-dropdown-panel .ng-dropdown-panel-items{min-height:140px!important}.ng-select-dropdown-panel-xl .ng-dropdown-panel .ng-dropdown-panel-items{min-height:160px!important}.ng-dropdown-panel .ng-dropdown-header{padding:0!important}\n"] }]
         }], ctorParameters: function () { return [{ type: NgtStylizableDirective, decorators: [{
                     type: Optional
                 }, {
@@ -3589,6 +3593,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImpor
                 type: Input
             }], sortSelectedItemsFn: [{
                 type: Input
+            }], isAllowedToRemoveFn: [{
+                type: Input
             }], isRequired: [{
                 type: Input
             }], onLoadRemoteResource: [{
@@ -3803,7 +3809,7 @@ class NgtPaginationComponent {
     }
 }
 NgtPaginationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtPaginationComponent, deps: [{ token: i0.Injector }, { token: NgtTranslateService, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-NgtPaginationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.8", type: NgtPaginationComponent, selector: "ngt-pagination", inputs: { pagesInterval: "pagesInterval" }, outputs: { onPageChange: "onPageChange", onPerPageChange: "onPerPageChange" }, ngImport: i0, template: "<div class=\"{{ displayPagination ? 'flex' : 'hidden' }} items-center w-full h-full relative\">\n    <ul class=\"flex justify-start\">\n        <!-- FIRST -->\n        <li (click)='goToFirstPage()' class=\"mr-2\">\n            <ngt-action [ngtStyle]='ngtPaginationFirstLastButtonStyle' [forceEnable]=\"true\">\n                <svg class=\"fill-current\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n                    aria-hidden=\"true\" focusable=\"false\"\n                    style=\"-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); transform: rotate(360deg);\"\n                    preserveAspectRatio=\"xMidYMid meet\" viewBox=\"0 0 24 24\">\n                    <path\n                        d=\"M18.41 7.41L17 6l-6 6l6 6l1.41-1.41L13.83 12l4.58-4.59m-6 0L11 6l-6 6l6 6l1.41-1.41L7.83 12l4.58-4.59z\" />\n                </svg>\n            </ngt-action>\n        </li>\n\n        <!-- PREVIOUS -->\n        <li (click)='goToPreviousPage()' class=\"mr-2\">\n            <ngt-action [ngtStyle]='ngtPaginationNextPreviousButtonStyle' [forceEnable]=\"true\">\n                <svg class=\"fill-current\" xmlns=\"http://www.w3.org/2000/svg\"\n                    style=\"-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); transform: rotate(360deg);\"\n                    preserveAspectRatio=\"xMidYMid meet\" viewBox=\"0 0 24 24\">\n                    <path d=\"M15.41 16.58L10.83 12l4.58-4.59L14 6l-6 6l6 6l1.41-1.42z\" />\n                </svg>\n            </ngt-action>\n        </li>\n\n        <!-- PREVIOUS SECTION -->\n        <li *ngIf=\"displayPreviousSectionButton\" (click)='goToPreviousSection()' class=\"mr-2\">\n            <ngt-action [ngtStyle]='ngtPaginationNextPreviousSectionButtonStyle' [forceEnable]=\"true\">\n                <svg class=\"fill-current\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\">\n                    <path\n                        d=\"M4 12a2 2 0 1 1 0-4 2 2 0 0 1 0 4zm6 0a2 2 0 1 1 0-4 2 2 0 0 1 0 4zm6 0a2 2 0 1 1 0-4 2 2 0 0 1 0 4z\" />\n                </svg>\n            </ngt-action>\n        </li>\n\n        <ng-container *ngFor='let page of pages'>\n            <ng-container *ngIf='page == pagination.page'>\n                <li class=\"mr-2\">\n                    <ngt-action [ngtStyle]='ngtPaginationActivePageButtonStyle' [forceEnable]=\"true\">\n                        {{ page }}\n                    </ngt-action>\n                </li>\n            </ng-container>\n\n            <ng-container *ngIf='page !== pagination.page'>\n                <li (click)='goToPage(page)' class=\"mr-2\">\n                    <ngt-action [ngtStyle]='ngtPaginationPageButtonStyle' [forceEnable]=\"true\">\n                        {{ page }}\n                    </ngt-action>\n                </li>\n            </ng-container>\n\n        </ng-container>\n\n        <!-- NEXT SECTION -->\n        <li *ngIf=\"displayNextSectionButton\" (click)='goToNextSection()' class=\"mr-2\">\n            <ngt-action [ngtStyle]='ngtPaginationNextPreviousSectionButtonStyle' [forceEnable]=\"true\">\n                <svg class=\"fill-current\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\">\n                    <path\n                        d=\"M4 12a2 2 0 1 1 0-4 2 2 0 0 1 0 4zm6 0a2 2 0 1 1 0-4 2 2 0 0 1 0 4zm6 0a2 2 0 1 1 0-4 2 2 0 0 1 0 4z\" />\n                </svg>\n            </ngt-action>\n        </li>\n\n        <!-- NEXT -->\n        <li (click)='goToNextPage()' class=\"mr-2\">\n            <ngt-action [ngtStyle]='ngtPaginationNextPreviousButtonStyle' [forceEnable]=\"true\">\n                <svg class=\"fill-current\" xmlns=\"http://www.w3.org/2000/svg\"\n                    style=\"-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); transform: rotate(360deg);\"\n                    preserveAspectRatio=\"xMidYMid meet\" viewBox=\"0 0 24 24\">\n                    <path d=\"M8.59 16.58L13.17 12L8.59 7.41L10 6l6 6l-6 6l-1.41-1.42z\" />\n                </svg>\n            </ngt-action>\n        </li>\n\n        <!-- LAST -->\n        <li (click)='goToLastPage()' class=\"mr-2\">\n            <ngt-action [ngtStyle]='ngtPaginationFirstLastButtonStyle' [forceEnable]=\"true\">\n                <svg class=\"fill-current\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n                    aria-hidden=\"true\" focusable=\"false\"\n                    style=\"-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); transform: rotate(360deg);\"\n                    preserveAspectRatio=\"xMidYMid meet\" viewBox=\"0 0 24 24\">\n                    <path\n                        d=\"M5.59 7.41L7 6l6 6l-6 6l-1.41-1.41L10.17 12L5.59 7.41m6 0L13 6l6 6l-6 6l-1.41-1.41L16.17 12l-4.58-4.59z\" />\n                </svg>\n            </ngt-action>\n        </li>\n    </ul>\n\n    <!-- REGISTERS PER PAGE -->\n    <div class=\"flex items-center w-auto absolute right-0\">\n        <ngt-select class='block w-20 left-0' [searchable]='false' [clearable]='false' dropdownPosition='top'\n            [items]='registersPerPageOptions' name='registersPerPageSelect' [(ngModel)]=\"currentRegistersPerPage\"\n            h='h-auto' (ngModelChange)='onRegistersPerPageChange($event)' ngt-stylizable>\n            <ng-template let-item=\"item\" let-index=\"index\" ngt-select-option>\n                {{ item ? item : '' }}\n            </ng-template>\n        </ngt-select>\n\n        <P class=\"ml-2\">\n            {{ ngtTranslateService.ngtPagination(pagination.from, pagination.to, pagination.total) }}\n        </P>\n    </div>\n</div>", dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgtStylizableDirective, selector: "[ngt-stylizable]", inputs: ["color", "color.text", "color.bg", "color.border", "h", "w", "p", "px", "py", "pt", "pr", "pb", "pl", "m", "mx", "my", "mt", "mr", "mb", "ml", "border", "shadow", "rounded", "font", "text", "breakWords", "overflow", "position", "justifyContent", "cursor", "fontCase"] }, { kind: "component", type: NgtActionComponent, selector: "ngt-action", inputs: ["href", "icon", "ngtStyle", "isDisabled", "forceEnable"] }, { kind: "component", type: NgtSelectComponent, selector: "ngt-select", inputs: ["label", "labelIcon", "labelIconColor", "helpTitle", "helpText", "helpTextColor", "shining", "loading", "loadingText", "notFoundText", "dropdownPosition", "typeToSearchText", "clearAllTooltip", "placeholder", "createText", "labelForId", "dropdownPanelMinHeight", "helperReverseYPosition", "helperAutoXReverse", "name", "autoLoad", "allowCreate", "allowOriginalItemsUnselect", "isDisabled", "isReadonly", "remoteResource", "hideSelected", "bindLabel", "bindValue", "items", "inputAttrs", "closeOnSelect", "clearable", "groupBy", "maxSelectedItems", "multiple", "searchable", "clearSearchOnAdd", "virtualScroll", "tabIndex", "typeahead", "guessCompareWith", "autoSelectUniqueOption", "groupValue", "trackBy", "sortSelectedItemsFn", "isRequired", "compareWith"], outputs: ["onLoadRemoteResource", "onSelectedItemRemove", "onClear", "onClose"] }, { kind: "directive", type: NgtSelectOptionTmp, selector: "[ngt-select-option]" }] });
+NgtPaginationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.8", type: NgtPaginationComponent, selector: "ngt-pagination", inputs: { pagesInterval: "pagesInterval" }, outputs: { onPageChange: "onPageChange", onPerPageChange: "onPerPageChange" }, ngImport: i0, template: "<div class=\"{{ displayPagination ? 'flex' : 'hidden' }} items-center w-full h-full relative\">\n    <ul class=\"flex justify-start\">\n        <!-- FIRST -->\n        <li (click)='goToFirstPage()' class=\"mr-2\">\n            <ngt-action [ngtStyle]='ngtPaginationFirstLastButtonStyle' [forceEnable]=\"true\">\n                <svg class=\"fill-current\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n                    aria-hidden=\"true\" focusable=\"false\"\n                    style=\"-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); transform: rotate(360deg);\"\n                    preserveAspectRatio=\"xMidYMid meet\" viewBox=\"0 0 24 24\">\n                    <path\n                        d=\"M18.41 7.41L17 6l-6 6l6 6l1.41-1.41L13.83 12l4.58-4.59m-6 0L11 6l-6 6l6 6l1.41-1.41L7.83 12l4.58-4.59z\" />\n                </svg>\n            </ngt-action>\n        </li>\n\n        <!-- PREVIOUS -->\n        <li (click)='goToPreviousPage()' class=\"mr-2\">\n            <ngt-action [ngtStyle]='ngtPaginationNextPreviousButtonStyle' [forceEnable]=\"true\">\n                <svg class=\"fill-current\" xmlns=\"http://www.w3.org/2000/svg\"\n                    style=\"-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); transform: rotate(360deg);\"\n                    preserveAspectRatio=\"xMidYMid meet\" viewBox=\"0 0 24 24\">\n                    <path d=\"M15.41 16.58L10.83 12l4.58-4.59L14 6l-6 6l6 6l1.41-1.42z\" />\n                </svg>\n            </ngt-action>\n        </li>\n\n        <!-- PREVIOUS SECTION -->\n        <li *ngIf=\"displayPreviousSectionButton\" (click)='goToPreviousSection()' class=\"mr-2\">\n            <ngt-action [ngtStyle]='ngtPaginationNextPreviousSectionButtonStyle' [forceEnable]=\"true\">\n                <svg class=\"fill-current\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\">\n                    <path\n                        d=\"M4 12a2 2 0 1 1 0-4 2 2 0 0 1 0 4zm6 0a2 2 0 1 1 0-4 2 2 0 0 1 0 4zm6 0a2 2 0 1 1 0-4 2 2 0 0 1 0 4z\" />\n                </svg>\n            </ngt-action>\n        </li>\n\n        <ng-container *ngFor='let page of pages'>\n            <ng-container *ngIf='page == pagination.page'>\n                <li class=\"mr-2\">\n                    <ngt-action [ngtStyle]='ngtPaginationActivePageButtonStyle' [forceEnable]=\"true\">\n                        {{ page }}\n                    </ngt-action>\n                </li>\n            </ng-container>\n\n            <ng-container *ngIf='page !== pagination.page'>\n                <li (click)='goToPage(page)' class=\"mr-2\">\n                    <ngt-action [ngtStyle]='ngtPaginationPageButtonStyle' [forceEnable]=\"true\">\n                        {{ page }}\n                    </ngt-action>\n                </li>\n            </ng-container>\n\n        </ng-container>\n\n        <!-- NEXT SECTION -->\n        <li *ngIf=\"displayNextSectionButton\" (click)='goToNextSection()' class=\"mr-2\">\n            <ngt-action [ngtStyle]='ngtPaginationNextPreviousSectionButtonStyle' [forceEnable]=\"true\">\n                <svg class=\"fill-current\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\">\n                    <path\n                        d=\"M4 12a2 2 0 1 1 0-4 2 2 0 0 1 0 4zm6 0a2 2 0 1 1 0-4 2 2 0 0 1 0 4zm6 0a2 2 0 1 1 0-4 2 2 0 0 1 0 4z\" />\n                </svg>\n            </ngt-action>\n        </li>\n\n        <!-- NEXT -->\n        <li (click)='goToNextPage()' class=\"mr-2\">\n            <ngt-action [ngtStyle]='ngtPaginationNextPreviousButtonStyle' [forceEnable]=\"true\">\n                <svg class=\"fill-current\" xmlns=\"http://www.w3.org/2000/svg\"\n                    style=\"-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); transform: rotate(360deg);\"\n                    preserveAspectRatio=\"xMidYMid meet\" viewBox=\"0 0 24 24\">\n                    <path d=\"M8.59 16.58L13.17 12L8.59 7.41L10 6l6 6l-6 6l-1.41-1.42z\" />\n                </svg>\n            </ngt-action>\n        </li>\n\n        <!-- LAST -->\n        <li (click)='goToLastPage()' class=\"mr-2\">\n            <ngt-action [ngtStyle]='ngtPaginationFirstLastButtonStyle' [forceEnable]=\"true\">\n                <svg class=\"fill-current\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n                    aria-hidden=\"true\" focusable=\"false\"\n                    style=\"-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); transform: rotate(360deg);\"\n                    preserveAspectRatio=\"xMidYMid meet\" viewBox=\"0 0 24 24\">\n                    <path\n                        d=\"M5.59 7.41L7 6l6 6l-6 6l-1.41-1.41L10.17 12L5.59 7.41m6 0L13 6l6 6l-6 6l-1.41-1.41L16.17 12l-4.58-4.59z\" />\n                </svg>\n            </ngt-action>\n        </li>\n    </ul>\n\n    <!-- REGISTERS PER PAGE -->\n    <div class=\"flex items-center w-auto absolute right-0\">\n        <ngt-select class='block w-20 left-0' [searchable]='false' [clearable]='false' dropdownPosition='top'\n            [items]='registersPerPageOptions' name='registersPerPageSelect' [(ngModel)]=\"currentRegistersPerPage\"\n            h='h-auto' (ngModelChange)='onRegistersPerPageChange($event)' ngt-stylizable>\n            <ng-template let-item=\"item\" let-index=\"index\" ngt-select-option>\n                {{ item ? item : '' }}\n            </ng-template>\n        </ngt-select>\n\n        <P class=\"ml-2\">\n            {{ ngtTranslateService.ngtPagination(pagination.from, pagination.to, pagination.total) }}\n        </P>\n    </div>\n</div>", dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgtStylizableDirective, selector: "[ngt-stylizable]", inputs: ["color", "color.text", "color.bg", "color.border", "h", "w", "p", "px", "py", "pt", "pr", "pb", "pl", "m", "mx", "my", "mt", "mr", "mb", "ml", "border", "shadow", "rounded", "font", "text", "breakWords", "overflow", "position", "justifyContent", "cursor", "fontCase"] }, { kind: "component", type: NgtActionComponent, selector: "ngt-action", inputs: ["href", "icon", "ngtStyle", "isDisabled", "forceEnable"] }, { kind: "component", type: NgtSelectComponent, selector: "ngt-select", inputs: ["label", "labelIcon", "labelIconColor", "helpTitle", "helpText", "helpTextColor", "shining", "loading", "loadingText", "notFoundText", "dropdownPosition", "typeToSearchText", "clearAllTooltip", "placeholder", "createText", "labelForId", "dropdownPanelMinHeight", "helperReverseYPosition", "helperAutoXReverse", "name", "autoLoad", "allowCreate", "allowOriginalItemsUnselect", "isDisabled", "isReadonly", "remoteResource", "hideSelected", "bindLabel", "bindValue", "items", "inputAttrs", "closeOnSelect", "clearable", "groupBy", "maxSelectedItems", "multiple", "searchable", "clearSearchOnAdd", "virtualScroll", "tabIndex", "typeahead", "guessCompareWith", "autoSelectUniqueOption", "groupValue", "trackBy", "sortSelectedItemsFn", "isAllowedToRemoveFn", "isRequired", "compareWith"], outputs: ["onLoadRemoteResource", "onSelectedItemRemove", "onClear", "onClose"] }, { kind: "directive", type: NgtSelectOptionTmp, selector: "[ngt-select-option]" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtPaginationComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ngt-pagination', template: "<div class=\"{{ displayPagination ? 'flex' : 'hidden' }} items-center w-full h-full relative\">\n    <ul class=\"flex justify-start\">\n        <!-- FIRST -->\n        <li (click)='goToFirstPage()' class=\"mr-2\">\n            <ngt-action [ngtStyle]='ngtPaginationFirstLastButtonStyle' [forceEnable]=\"true\">\n                <svg class=\"fill-current\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n                    aria-hidden=\"true\" focusable=\"false\"\n                    style=\"-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); transform: rotate(360deg);\"\n                    preserveAspectRatio=\"xMidYMid meet\" viewBox=\"0 0 24 24\">\n                    <path\n                        d=\"M18.41 7.41L17 6l-6 6l6 6l1.41-1.41L13.83 12l4.58-4.59m-6 0L11 6l-6 6l6 6l1.41-1.41L7.83 12l4.58-4.59z\" />\n                </svg>\n            </ngt-action>\n        </li>\n\n        <!-- PREVIOUS -->\n        <li (click)='goToPreviousPage()' class=\"mr-2\">\n            <ngt-action [ngtStyle]='ngtPaginationNextPreviousButtonStyle' [forceEnable]=\"true\">\n                <svg class=\"fill-current\" xmlns=\"http://www.w3.org/2000/svg\"\n                    style=\"-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); transform: rotate(360deg);\"\n                    preserveAspectRatio=\"xMidYMid meet\" viewBox=\"0 0 24 24\">\n                    <path d=\"M15.41 16.58L10.83 12l4.58-4.59L14 6l-6 6l6 6l1.41-1.42z\" />\n                </svg>\n            </ngt-action>\n        </li>\n\n        <!-- PREVIOUS SECTION -->\n        <li *ngIf=\"displayPreviousSectionButton\" (click)='goToPreviousSection()' class=\"mr-2\">\n            <ngt-action [ngtStyle]='ngtPaginationNextPreviousSectionButtonStyle' [forceEnable]=\"true\">\n                <svg class=\"fill-current\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\">\n                    <path\n                        d=\"M4 12a2 2 0 1 1 0-4 2 2 0 0 1 0 4zm6 0a2 2 0 1 1 0-4 2 2 0 0 1 0 4zm6 0a2 2 0 1 1 0-4 2 2 0 0 1 0 4z\" />\n                </svg>\n            </ngt-action>\n        </li>\n\n        <ng-container *ngFor='let page of pages'>\n            <ng-container *ngIf='page == pagination.page'>\n                <li class=\"mr-2\">\n                    <ngt-action [ngtStyle]='ngtPaginationActivePageButtonStyle' [forceEnable]=\"true\">\n                        {{ page }}\n                    </ngt-action>\n                </li>\n            </ng-container>\n\n            <ng-container *ngIf='page !== pagination.page'>\n                <li (click)='goToPage(page)' class=\"mr-2\">\n                    <ngt-action [ngtStyle]='ngtPaginationPageButtonStyle' [forceEnable]=\"true\">\n                        {{ page }}\n                    </ngt-action>\n                </li>\n            </ng-container>\n\n        </ng-container>\n\n        <!-- NEXT SECTION -->\n        <li *ngIf=\"displayNextSectionButton\" (click)='goToNextSection()' class=\"mr-2\">\n            <ngt-action [ngtStyle]='ngtPaginationNextPreviousSectionButtonStyle' [forceEnable]=\"true\">\n                <svg class=\"fill-current\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\">\n                    <path\n                        d=\"M4 12a2 2 0 1 1 0-4 2 2 0 0 1 0 4zm6 0a2 2 0 1 1 0-4 2 2 0 0 1 0 4zm6 0a2 2 0 1 1 0-4 2 2 0 0 1 0 4z\" />\n                </svg>\n            </ngt-action>\n        </li>\n\n        <!-- NEXT -->\n        <li (click)='goToNextPage()' class=\"mr-2\">\n            <ngt-action [ngtStyle]='ngtPaginationNextPreviousButtonStyle' [forceEnable]=\"true\">\n                <svg class=\"fill-current\" xmlns=\"http://www.w3.org/2000/svg\"\n                    style=\"-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); transform: rotate(360deg);\"\n                    preserveAspectRatio=\"xMidYMid meet\" viewBox=\"0 0 24 24\">\n                    <path d=\"M8.59 16.58L13.17 12L8.59 7.41L10 6l6 6l-6 6l-1.41-1.42z\" />\n                </svg>\n            </ngt-action>\n        </li>\n\n        <!-- LAST -->\n        <li (click)='goToLastPage()' class=\"mr-2\">\n            <ngt-action [ngtStyle]='ngtPaginationFirstLastButtonStyle' [forceEnable]=\"true\">\n                <svg class=\"fill-current\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n                    aria-hidden=\"true\" focusable=\"false\"\n                    style=\"-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); transform: rotate(360deg);\"\n                    preserveAspectRatio=\"xMidYMid meet\" viewBox=\"0 0 24 24\">\n                    <path\n                        d=\"M5.59 7.41L7 6l6 6l-6 6l-1.41-1.41L10.17 12L5.59 7.41m6 0L13 6l6 6l-6 6l-1.41-1.41L16.17 12l-4.58-4.59z\" />\n                </svg>\n            </ngt-action>\n        </li>\n    </ul>\n\n    <!-- REGISTERS PER PAGE -->\n    <div class=\"flex items-center w-auto absolute right-0\">\n        <ngt-select class='block w-20 left-0' [searchable]='false' [clearable]='false' dropdownPosition='top'\n            [items]='registersPerPageOptions' name='registersPerPageSelect' [(ngModel)]=\"currentRegistersPerPage\"\n            h='h-auto' (ngModelChange)='onRegistersPerPageChange($event)' ngt-stylizable>\n            <ng-template let-item=\"item\" let-index=\"index\" ngt-select-option>\n                {{ item ? item : '' }}\n            </ng-template>\n        </ngt-select>\n\n        <P class=\"ml-2\">\n            {{ ngtTranslateService.ngtPagination(pagination.from, pagination.to, pagination.total) }}\n        </P>\n    </div>\n</div>" }]
@@ -4240,10 +4246,10 @@ class NgtDatatableComponent {
     }
 }
 NgtDatatableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtDatatableComponent, deps: [{ token: i0.Injector }, { token: NgtHttpService }, { token: i0.ChangeDetectorRef }, { token: NgtTranslateService, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-NgtDatatableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.8", type: NgtDatatableComponent, selector: "ngt-datatable", inputs: { remoteResource: "remoteResource", type: "type", filterTagBgColor: "filterTagBgColor", filterTagMargin: "filterTagMargin", paginationMargin: "paginationMargin", inputSearch: "inputSearch", searchDelay: "searchDelay", searchTermMinLength: "searchTermMinLength", searchTermOnEnter: "searchTermOnEnter", defaultFilters: "defaultFilters", filtersDescription: "filtersDescription" }, outputs: { onDataChange: "onDataChange", onClearFilter: "onClearFilter", onClearSelectedElements: "onClearSelectedElements", onSelectedElementsChange: "onSelectedElementsChange", onToogleAllCheckboxes: "onToogleAllCheckboxes", onToogleCheckbox: "onToogleCheckbox", onOpenSearchModal: "onOpenSearchModal", onSearch: "onSearch" }, viewQueries: [{ propertyName: "table", first: true, predicate: ["table"], descendants: true, static: true }, { propertyName: "ngtPagination", first: true, predicate: ["ngtPagination"], descendants: true, static: true }, { propertyName: "searchModal", first: true, predicate: ["searchModal"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"w-full\">\n    <div class=\"flex flex-wrap w-full\">\n        <ngt-tag *ngIf=\"hasAppliedFilters()\" class=\"w-full sm:w-auto {{ filterTagMargin }}\"\n            [class.sm:mr-4]=\"filterTagMargin == 'mb-4'\" color.bg=\"bg-red-500\" (click)=\"removeFilter()\" ngt-stylizable>\n            Limpar Filtros\n        </ngt-tag>\n\n        <ng-container *ngIf=\"hasAppliedFilters()\">\n            <ng-container *ngFor=\"let filter of filtersTranslated\">\n                <ngt-tag class=\"w-full sm:w-auto {{ filterTagMargin }}\" [class.sm:mr-4]=\"filterTagMargin == 'mb-4'\"\n                    [color.bg]=\"filterTagBgColor\" (click)=\"removeFilter(filter.reference)\" ngt-stylizable>\n                    {{ filter.translation + ': ' + (filter?.value?.tagValue ? filter.value.tagValue : filter.value)}}\n                </ngt-tag>\n            </ng-container>\n        </ng-container>\n    </div>\n\n    <table style=\"display: table;\" class=\"text-left w-full border-collapse table-responsive\" #table>\n        <ng-content></ng-content>\n    </table>\n\n    <p *ngIf=\"emptyStateVisible\" class=\"mt-8 mx-auto self-center text-center text-xl\">\n        {{ ngtTranslateService.ngtDatatableNoDataFound }}\n    </p>\n\n    <div *ngIf=\"loading\">\n        <div *ngFor=\"let i of [1, 2, 3, 4]\" class=\"flex w-full mt-3\">\n            <ng-container *ngIf=\"columnCount.length >= 2\">\n                <ng-container *ngFor=\"let j of columnCount; let last = last\">\n                    <ng-container *ngIf=\"last\">\n                        <ngt-shining class=\"h-10 w-full\"></ngt-shining>\n                    </ng-container>\n\n                    <ng-container *ngIf=\"!last\">\n                        <ngt-shining class=\"h-10 w-full mr-10\"></ngt-shining>\n                    </ng-container>\n                </ng-container>\n            </ng-container>\n\n            <ng-container *ngIf=\"columnCount.length < 2\">\n                <ngt-shining class=\"h-10 w-full\"></ngt-shining>\n                <ngt-shining class=\"h-10 w-full mr-10 ml-10\"></ngt-shining>\n                <ngt-shining class=\"h-10 w-full\"></ngt-shining>\n            </ng-container>\n        </div>\n    </div>\n</div>\n\n<div class=\"clearfix {{ paginationMargin }}\" [hidden]='!data || data.length == 0'>\n    <ngt-pagination [pagesInterval]='4' (onPageChange)='apply($event, false)' (onPerPageChange)='apply(1, false)'\n        #ngtPagination>\n    </ngt-pagination>\n</div>\n\n<ngt-modal #searchModal [customLayout]='true' [isDisabled]=\"false\">\n    <ng-container *ngTemplateOutlet=\"searchModalTemplate\"></ng-container>\n</ngt-modal>", styles: ["@media (max-width: 767px){.table-responsive{display:block;position:relative;width:100%}.table-responsive thead,.table-responsive tbody,.table-responsive th,.table-responsive td,.table-responsive tr{display:block}.table-responsive td,.table-responsive th{height:50px}.table-responsive thead{float:left;margin-bottom:15px}.table-responsive tbody{width:auto;position:relative;overflow-x:auto;-webkit-overflow-scrolling:touch;white-space:nowrap}.table-responsive tbody tr{display:inline-block;min-width:100%}}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: NgtShiningComponent, selector: "ngt-shining", inputs: ["shiningWidth"] }, { kind: "component", type: NgtPaginationComponent, selector: "ngt-pagination", inputs: ["pagesInterval"], outputs: ["onPageChange", "onPerPageChange"] }, { kind: "component", type: NgtModalComponent, selector: "ngt-modal", inputs: ["customLayout", "disableDefaultCloses", "isDisabled", "ngtStyle"], outputs: ["onCloseModal", "onOpenModal"] }, { kind: "component", type: NgtTagComponent, selector: "ngt-tag", inputs: ["icon"] }, { kind: "directive", type: NgtStylizableDirective, selector: "[ngt-stylizable]", inputs: ["color", "color.text", "color.bg", "color.border", "h", "w", "p", "px", "py", "pt", "pr", "pb", "pl", "m", "mx", "my", "mt", "mr", "mb", "ml", "border", "shadow", "rounded", "font", "text", "breakWords", "overflow", "position", "justifyContent", "cursor", "fontCase"] }] });
+NgtDatatableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.8", type: NgtDatatableComponent, selector: "ngt-datatable", inputs: { remoteResource: "remoteResource", type: "type", filterTagBgColor: "filterTagBgColor", filterTagMargin: "filterTagMargin", paginationMargin: "paginationMargin", inputSearch: "inputSearch", searchDelay: "searchDelay", searchTermMinLength: "searchTermMinLength", searchTermOnEnter: "searchTermOnEnter", defaultFilters: "defaultFilters", filtersDescription: "filtersDescription" }, outputs: { onDataChange: "onDataChange", onClearFilter: "onClearFilter", onClearSelectedElements: "onClearSelectedElements", onSelectedElementsChange: "onSelectedElementsChange", onToogleAllCheckboxes: "onToogleAllCheckboxes", onToogleCheckbox: "onToogleCheckbox", onOpenSearchModal: "onOpenSearchModal", onSearch: "onSearch" }, viewQueries: [{ propertyName: "table", first: true, predicate: ["table"], descendants: true, static: true }, { propertyName: "ngtPagination", first: true, predicate: ["ngtPagination"], descendants: true, static: true }, { propertyName: "searchModal", first: true, predicate: ["searchModal"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"w-full\">\n    <div class=\"flex flex-wrap w-full\">\n        <ngt-tag *ngIf=\"hasAppliedFilters()\" class=\"w-full sm:w-auto {{ filterTagMargin }}\"\n            [class.sm:mr-4]=\"filterTagMargin == 'mb-4'\" color.bg=\"bg-red-500\" (click)=\"removeFilter()\" ngt-stylizable>\n            Limpar Filtros\n        </ngt-tag>\n\n        <ng-container *ngIf=\"hasAppliedFilters()\">\n            <ng-container *ngFor=\"let filter of filtersTranslated\">\n                <ngt-tag class=\"w-full sm:w-auto {{ filterTagMargin }}\" [class.sm:mr-4]=\"filterTagMargin == 'mb-4'\"\n                    [color.bg]=\"filterTagBgColor\" (click)=\"removeFilter(filter.reference)\" ngt-stylizable>\n                    {{ filter.translation + ': ' + (filter?.value?.tagValue ? filter.value.tagValue : filter.value)}}\n                </ngt-tag>\n            </ng-container>\n        </ng-container>\n    </div>\n\n    <table style=\"display: table;\" class=\"text-left w-full border-collapse table-responsive\" #table>\n        <ng-content></ng-content>\n    </table>\n\n    <p *ngIf=\"emptyStateVisible\" class=\"mt-8 mx-auto self-center text-center text-xl\">\n        {{ ngtTranslateService.ngtDatatableNoDataFound }}\n    </p>\n\n    <div *ngIf=\"loading\">\n        <div *ngFor=\"let i of [1, 2, 3, 4]\" class=\"flex w-full mt-3\">\n            <ng-container *ngIf=\"columnCount.length >= 2\">\n                <ng-container *ngFor=\"let j of columnCount; let last = last\">\n                    <ng-container *ngIf=\"last\">\n                        <ngt-shining class=\"h-10 w-full\"></ngt-shining>\n                    </ng-container>\n\n                    <ng-container *ngIf=\"!last\">\n                        <ngt-shining class=\"h-10 w-full mr-10\"></ngt-shining>\n                    </ng-container>\n                </ng-container>\n            </ng-container>\n\n            <ng-container *ngIf=\"columnCount.length < 2\">\n                <ngt-shining class=\"h-10 w-full\"></ngt-shining>\n                <ngt-shining class=\"h-10 w-full mr-10 ml-10\"></ngt-shining>\n                <ngt-shining class=\"h-10 w-full\"></ngt-shining>\n            </ng-container>\n        </div>\n    </div>\n</div>\n\n<div class=\"clearfix {{ paginationMargin }}\" [hidden]='!data || data.length == 0'>\n    <ngt-pagination [pagesInterval]='4' (onPageChange)='apply($event, false)' (onPerPageChange)='apply(1, false)'\n        #ngtPagination>\n    </ngt-pagination>\n</div>\n\n<ngt-modal [customLayout]='true' [isDisabled]=\"false\" overflow=\"overflow-auto\" ngt-stylizable #searchModal>\n    <ng-container *ngTemplateOutlet=\"searchModalTemplate\"></ng-container>\n</ngt-modal>", styles: ["@media (max-width: 767px){.table-responsive{display:block;position:relative;width:100%}.table-responsive thead,.table-responsive tbody,.table-responsive th,.table-responsive td,.table-responsive tr{display:block}.table-responsive td,.table-responsive th{height:50px}.table-responsive thead{float:left;margin-bottom:15px}.table-responsive tbody{width:auto;position:relative;overflow-x:auto;-webkit-overflow-scrolling:touch;white-space:nowrap}.table-responsive tbody tr{display:inline-block;min-width:100%}}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: NgtShiningComponent, selector: "ngt-shining", inputs: ["shiningWidth"] }, { kind: "component", type: NgtPaginationComponent, selector: "ngt-pagination", inputs: ["pagesInterval"], outputs: ["onPageChange", "onPerPageChange"] }, { kind: "component", type: NgtModalComponent, selector: "ngt-modal", inputs: ["customLayout", "disableDefaultCloses", "isDisabled", "ngtStyle"], outputs: ["onCloseModal", "onOpenModal"] }, { kind: "component", type: NgtTagComponent, selector: "ngt-tag", inputs: ["icon"] }, { kind: "directive", type: NgtStylizableDirective, selector: "[ngt-stylizable]", inputs: ["color", "color.text", "color.bg", "color.border", "h", "w", "p", "px", "py", "pt", "pr", "pb", "pl", "m", "mx", "my", "mt", "mr", "mb", "ml", "border", "shadow", "rounded", "font", "text", "breakWords", "overflow", "position", "justifyContent", "cursor", "fontCase"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: NgtDatatableComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ngt-datatable', template: "<div class=\"w-full\">\n    <div class=\"flex flex-wrap w-full\">\n        <ngt-tag *ngIf=\"hasAppliedFilters()\" class=\"w-full sm:w-auto {{ filterTagMargin }}\"\n            [class.sm:mr-4]=\"filterTagMargin == 'mb-4'\" color.bg=\"bg-red-500\" (click)=\"removeFilter()\" ngt-stylizable>\n            Limpar Filtros\n        </ngt-tag>\n\n        <ng-container *ngIf=\"hasAppliedFilters()\">\n            <ng-container *ngFor=\"let filter of filtersTranslated\">\n                <ngt-tag class=\"w-full sm:w-auto {{ filterTagMargin }}\" [class.sm:mr-4]=\"filterTagMargin == 'mb-4'\"\n                    [color.bg]=\"filterTagBgColor\" (click)=\"removeFilter(filter.reference)\" ngt-stylizable>\n                    {{ filter.translation + ': ' + (filter?.value?.tagValue ? filter.value.tagValue : filter.value)}}\n                </ngt-tag>\n            </ng-container>\n        </ng-container>\n    </div>\n\n    <table style=\"display: table;\" class=\"text-left w-full border-collapse table-responsive\" #table>\n        <ng-content></ng-content>\n    </table>\n\n    <p *ngIf=\"emptyStateVisible\" class=\"mt-8 mx-auto self-center text-center text-xl\">\n        {{ ngtTranslateService.ngtDatatableNoDataFound }}\n    </p>\n\n    <div *ngIf=\"loading\">\n        <div *ngFor=\"let i of [1, 2, 3, 4]\" class=\"flex w-full mt-3\">\n            <ng-container *ngIf=\"columnCount.length >= 2\">\n                <ng-container *ngFor=\"let j of columnCount; let last = last\">\n                    <ng-container *ngIf=\"last\">\n                        <ngt-shining class=\"h-10 w-full\"></ngt-shining>\n                    </ng-container>\n\n                    <ng-container *ngIf=\"!last\">\n                        <ngt-shining class=\"h-10 w-full mr-10\"></ngt-shining>\n                    </ng-container>\n                </ng-container>\n            </ng-container>\n\n            <ng-container *ngIf=\"columnCount.length < 2\">\n                <ngt-shining class=\"h-10 w-full\"></ngt-shining>\n                <ngt-shining class=\"h-10 w-full mr-10 ml-10\"></ngt-shining>\n                <ngt-shining class=\"h-10 w-full\"></ngt-shining>\n            </ng-container>\n        </div>\n    </div>\n</div>\n\n<div class=\"clearfix {{ paginationMargin }}\" [hidden]='!data || data.length == 0'>\n    <ngt-pagination [pagesInterval]='4' (onPageChange)='apply($event, false)' (onPerPageChange)='apply(1, false)'\n        #ngtPagination>\n    </ngt-pagination>\n</div>\n\n<ngt-modal #searchModal [customLayout]='true' [isDisabled]=\"false\">\n    <ng-container *ngTemplateOutlet=\"searchModalTemplate\"></ng-container>\n</ngt-modal>", styles: ["@media (max-width: 767px){.table-responsive{display:block;position:relative;width:100%}.table-responsive thead,.table-responsive tbody,.table-responsive th,.table-responsive td,.table-responsive tr{display:block}.table-responsive td,.table-responsive th{height:50px}.table-responsive thead{float:left;margin-bottom:15px}.table-responsive tbody{width:auto;position:relative;overflow-x:auto;-webkit-overflow-scrolling:touch;white-space:nowrap}.table-responsive tbody tr{display:inline-block;min-width:100%}}\n"] }]
+            args: [{ selector: 'ngt-datatable', template: "<div class=\"w-full\">\n    <div class=\"flex flex-wrap w-full\">\n        <ngt-tag *ngIf=\"hasAppliedFilters()\" class=\"w-full sm:w-auto {{ filterTagMargin }}\"\n            [class.sm:mr-4]=\"filterTagMargin == 'mb-4'\" color.bg=\"bg-red-500\" (click)=\"removeFilter()\" ngt-stylizable>\n            Limpar Filtros\n        </ngt-tag>\n\n        <ng-container *ngIf=\"hasAppliedFilters()\">\n            <ng-container *ngFor=\"let filter of filtersTranslated\">\n                <ngt-tag class=\"w-full sm:w-auto {{ filterTagMargin }}\" [class.sm:mr-4]=\"filterTagMargin == 'mb-4'\"\n                    [color.bg]=\"filterTagBgColor\" (click)=\"removeFilter(filter.reference)\" ngt-stylizable>\n                    {{ filter.translation + ': ' + (filter?.value?.tagValue ? filter.value.tagValue : filter.value)}}\n                </ngt-tag>\n            </ng-container>\n        </ng-container>\n    </div>\n\n    <table style=\"display: table;\" class=\"text-left w-full border-collapse table-responsive\" #table>\n        <ng-content></ng-content>\n    </table>\n\n    <p *ngIf=\"emptyStateVisible\" class=\"mt-8 mx-auto self-center text-center text-xl\">\n        {{ ngtTranslateService.ngtDatatableNoDataFound }}\n    </p>\n\n    <div *ngIf=\"loading\">\n        <div *ngFor=\"let i of [1, 2, 3, 4]\" class=\"flex w-full mt-3\">\n            <ng-container *ngIf=\"columnCount.length >= 2\">\n                <ng-container *ngFor=\"let j of columnCount; let last = last\">\n                    <ng-container *ngIf=\"last\">\n                        <ngt-shining class=\"h-10 w-full\"></ngt-shining>\n                    </ng-container>\n\n                    <ng-container *ngIf=\"!last\">\n                        <ngt-shining class=\"h-10 w-full mr-10\"></ngt-shining>\n                    </ng-container>\n                </ng-container>\n            </ng-container>\n\n            <ng-container *ngIf=\"columnCount.length < 2\">\n                <ngt-shining class=\"h-10 w-full\"></ngt-shining>\n                <ngt-shining class=\"h-10 w-full mr-10 ml-10\"></ngt-shining>\n                <ngt-shining class=\"h-10 w-full\"></ngt-shining>\n            </ng-container>\n        </div>\n    </div>\n</div>\n\n<div class=\"clearfix {{ paginationMargin }}\" [hidden]='!data || data.length == 0'>\n    <ngt-pagination [pagesInterval]='4' (onPageChange)='apply($event, false)' (onPerPageChange)='apply(1, false)'\n        #ngtPagination>\n    </ngt-pagination>\n</div>\n\n<ngt-modal [customLayout]='true' [isDisabled]=\"false\" overflow=\"overflow-auto\" ngt-stylizable #searchModal>\n    <ng-container *ngTemplateOutlet=\"searchModalTemplate\"></ng-container>\n</ngt-modal>", styles: ["@media (max-width: 767px){.table-responsive{display:block;position:relative;width:100%}.table-responsive thead,.table-responsive tbody,.table-responsive th,.table-responsive td,.table-responsive tr{display:block}.table-responsive td,.table-responsive th{height:50px}.table-responsive thead{float:left;margin-bottom:15px}.table-responsive tbody{width:auto;position:relative;overflow-x:auto;-webkit-overflow-scrolling:touch;white-space:nowrap}.table-responsive tbody tr{display:inline-block;min-width:100%}}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.Injector }, { type: NgtHttpService }, { type: i0.ChangeDetectorRef }, { type: NgtTranslateService, decorators: [{
                     type: Optional
                 }] }]; }, propDecorators: { table: [{