ng-tailwind 7.0.4 → 7.0.6

package/fesm2022/ng-tailwind.mjs

@@ -1925,7 +1925,7 @@ class NgtControlValueAccessor {
     }
     ;
     set value(v) {
-        if (!this.hasValueChanges(v, this._value())) {
+        if (this.hasValueChanges(v, this._value())) {
             this._value.set(v);
             this.onChange(v);
             if (!this.formControl) {
@@ -1936,7 +1936,7 @@ class NgtControlValueAccessor {
         }
     }
     writeValue(value) {
-        if (value == this.ignore || this.hasValueChanges(value, this._value())) {
+        if (value == this.ignore || !this.hasValueChanges(value, this._value())) {
             return;
         }
         this._value.set(value);
@@ -1977,13 +1977,7 @@ class NgtControlValueAccessor {
         }
     }
     hasValueChanges(value1, value2) {
-        if (Array.isArray(value1)) {
-            value1 = JSON.stringify(value1);
-        }
-        if (Array.isArray(value2)) {
-            value2 = JSON.stringify(value2);
-        }
-        return value1 === value2;
+        return JSON.stringify(value1) != JSON.stringify(value2);
     }
 }
 function NgtValueAccessorProvider(component) {
@@ -9403,12 +9397,19 @@ class NgtReactiveInputComponent extends NgtControlValueAccessor {
     }
     onNativeChange() {
         if (this.hasChangesBetweenValues()) {
-            this.value = this.maskService.removeMask(this.getNativeValue());
+            let value = this.maskService.removeMask(this.getNativeValue());
+            if (value && this.mask() == InputMaskEnum.DECIMAL) {
+                value = parseFloat(value);
+            }
+            this.value = value;
         }
     }
     change(value) {
-        if (value && typeof value === 'string' && this.mask() == InputMaskEnum.DECIMAL) {
-            this.value = parseFloat(value);
+        if (value && this.mask() == InputMaskEnum.DECIMAL) {
+            if (typeof value === 'number') {
+                value = value.toString();
+            }
+            value = value.replace('.', ',');
         }
         if (this.hasChangesBetweenValues()) {
             this.setNativeValue(value ?? '');
@@ -9943,7 +9944,7 @@ class NgtReactiveTextareaComponent extends NgtControlValueAccessor {
         return this.textareaElement.nativeElement.value;
     }
     hasChangesBetweenValues() {
-        return this.getNativeValue() !== this.value;
+        return this.getNativeValue() != this.value;
     }
     getRemainingCharacters() {
         if (!this.showCharactersLength() || !this.maxLength()) {
@@ -9975,7 +9976,7 @@ class NgtReactiveTextareaComponent extends NgtControlValueAccessor {
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: NgtReactiveTextareaComponent, isStandalone: true, selector: "ngt-reactive-textarea", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, helpTitle: { classPropertyName: "helpTitle", publicName: "helpTitle", isSignal: true, isRequired: false, transformFunction: null }, helpText: { classPropertyName: "helpText", publicName: "helpText", isSignal: true, isRequired: false, transformFunction: null }, helpTextColor: { classPropertyName: "helpTextColor", publicName: "helpTextColor", isSignal: true, isRequired: false, transformFunction: null }, showCharactersLength: { classPropertyName: "showCharactersLength", publicName: "showCharactersLength", isSignal: true, isRequired: false, transformFunction: null }, shining: { classPropertyName: "shining", publicName: "shining", isSignal: true, isRequired: false, transformFunction: null }, isDisabled: { classPropertyName: "isDisabled", publicName: "isDisabled", isSignal: true, isRequired: false, transformFunction: null }, isReadonly: { classPropertyName: "isReadonly", publicName: "isReadonly", isSignal: true, isRequired: false, transformFunction: null }, focus: { classPropertyName: "focus", publicName: "focus", isSignal: true, isRequired: false, transformFunction: null }, isRequired: { classPropertyName: "isRequired", publicName: "isRequired", isSignal: true, isRequired: false, transformFunction: null }, maxLength: { classPropertyName: "maxLength", publicName: "maxLength", isSignal: true, isRequired: false, transformFunction: null }, minLength: { classPropertyName: "minLength", publicName: "minLength", isSignal: true, isRequired: false, transformFunction: null }, customSyncValidators: { classPropertyName: "customSyncValidators", publicName: "customSyncValidators", isSignal: true, isRequired: false, transformFunction: null }, customAsyncValidators: { classPropertyName: "customAsyncValidators", publicName: "customAsyncValidators", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onValueChange: "onValueChange" }, providers: [
             NgtValueAccessorProvider(NgtReactiveTextareaComponent),
             NgtReactiveTextareaValidationService,
-        ], viewQueries: [{ propertyName: "textareaElement", first: true, predicate: ["textareaElement"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "@if (label() && !isShining()) {\n    <label class=\"flex mb-2 {{ ngtStyle.compile(['text', 'font', 'color.text']) }}\">\n        <span class=\"truncate\" [title]=\"label()\">\n            {{ label() }}:\n        </span>\n\n        @if (isRequired()) {\n            <span class=\"text-red-500 font-bold text-md ml-1\">*</span>\n        }\n\n        @if (helpText()) {\n            <ngt-helper [helpTitle]=\"helpTitle()\" [iconColor]=\"helpTextColor()\" class=\"ml-1\">\n                {{ helpText() }}\n            </ngt-helper>\n        }\n    </label>\n}\n\n<div [class]=\"isShining() ? 'hidden' : 'flex flex-col'\">\n    <textarea [class]=\"textareaClasses()\" autocomplete=\"new-password\" [rows]=\"rows()\" [disabled]=\"isDisabledState()\"\n        [readonly]=\"isReadonly()\" [placeholder]=\"placeholder()\" (input)=\"onNativeChange()\" (blur)=\"onTouched()\"\n        #textareaElement>\n    </textarea>\n\n    @if (showCharactersLength() && remainingCharacters() !== null) {\n        <p class=\"text-xxs mt-1\">\n            {{ getTranslation('ngtTextAreaRemainingCharacters') }}:\n            <span class=\"font-semibold\">{{ remainingCharacters() }}</span>\n        </p>\n    }\n</div>\n\n@if (isShining()) {\n    <div class=\"flex\">\n        <ngt-shining class=\"h-10 w-full\"></ngt-shining>\n    </div>\n}\n\n<ng-content></ng-content>\n\n<ngt-validation [control]=\"formControl\" [minLength]=\"minLength()\"></ngt-validation>", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: NgtShiningModule }, { kind: "component", type: NgtShiningComponent, selector: "ngt-shining", inputs: ["shiningWidth"] }, { kind: "ngmodule", type: NgtValidationModule }, { kind: "component", type: NgtValidationComponent, selector: "ngt-validation", inputs: ["control", "container", "minValue", "minLength"] }, { kind: "component", type: NgtHelperComponent, selector: "ngt-helper", inputs: ["helpTextColor", "helpText", "helpTitle", "icon", "iconSize", "iconColor", "iconTitle", "tooltipSize", "autoXReverse", "helperReverseYPosition"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], viewQueries: [{ propertyName: "textareaElement", first: true, predicate: ["textareaElement"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "@if (label() && !isShining()) {\n    <label class=\"flex mb-2 {{ ngtStyle.compile(['text', 'font', 'color.text']) }}\">\n        <span class=\"truncate\" [title]=\"label()\">\n            {{ label() }}:\n        </span>\n\n        @if (isRequired()) {\n            <span class=\"text-red-500 font-bold text-md ml-1\">*</span>\n        }\n\n        @if (helpText()) {\n            <ngt-helper [helpTitle]=\"helpTitle()\" [iconColor]=\"helpTextColor()\" class=\"ml-1\">\n                {{ helpText() }}\n            </ngt-helper>\n        }\n    </label>\n}\n\n<div [class]=\"isShining() ? 'hidden' : 'flex flex-col'\">\n    <textarea [class]=\"textareaClasses()\" autocomplete=\"new-password\" [rows]=\"rows()\" [disabled]=\"isDisabledState()\"\n        [readonly]=\"isReadonly()\" [placeholder]=\"placeholder()\" (input)=\"onNativeChange()\" (blur)=\"onTouched()\"\n        #textareaElement></textarea>\n\n    @if (showCharactersLength() && remainingCharacters() !== null) {\n        <p class=\"text-xxs mt-1\">\n            {{ getTranslation('ngtTextAreaRemainingCharacters') }}:\n            <span class=\"font-semibold\">{{ remainingCharacters() }}</span>\n        </p>\n    }\n</div>\n\n@if (isShining()) {\n    <div class=\"flex\">\n        <ngt-shining class=\"h-10 w-full\"></ngt-shining>\n    </div>\n}\n\n<ng-content></ng-content>\n\n<ngt-validation [control]=\"formControl\" [minLength]=\"minLength()\"></ngt-validation>", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: NgtShiningModule }, { kind: "component", type: NgtShiningComponent, selector: "ngt-shining", inputs: ["shiningWidth"] }, { kind: "ngmodule", type: NgtValidationModule }, { kind: "component", type: NgtValidationComponent, selector: "ngt-validation", inputs: ["control", "container", "minValue", "minLength"] }, { kind: "component", type: NgtHelperComponent, selector: "ngt-helper", inputs: ["helpTextColor", "helpText", "helpTitle", "icon", "iconSize", "iconColor", "iconTitle", "tooltipSize", "autoXReverse", "helperReverseYPosition"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgtReactiveTextareaComponent, decorators: [{
             type: Component,
@@ -9988,7 +9989,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
                         NgtShiningModule,
                         NgtValidationModule,
                         NgtHelperComponent,
-                    ], template: "@if (label() && !isShining()) {\n    <label class=\"flex mb-2 {{ ngtStyle.compile(['text', 'font', 'color.text']) }}\">\n        <span class=\"truncate\" [title]=\"label()\">\n            {{ label() }}:\n        </span>\n\n        @if (isRequired()) {\n            <span class=\"text-red-500 font-bold text-md ml-1\">*</span>\n        }\n\n        @if (helpText()) {\n            <ngt-helper [helpTitle]=\"helpTitle()\" [iconColor]=\"helpTextColor()\" class=\"ml-1\">\n                {{ helpText() }}\n            </ngt-helper>\n        }\n    </label>\n}\n\n<div [class]=\"isShining() ? 'hidden' : 'flex flex-col'\">\n    <textarea [class]=\"textareaClasses()\" autocomplete=\"new-password\" [rows]=\"rows()\" [disabled]=\"isDisabledState()\"\n        [readonly]=\"isReadonly()\" [placeholder]=\"placeholder()\" (input)=\"onNativeChange()\" (blur)=\"onTouched()\"\n        #textareaElement>\n    </textarea>\n\n    @if (showCharactersLength() && remainingCharacters() !== null) {\n        <p class=\"text-xxs mt-1\">\n            {{ getTranslation('ngtTextAreaRemainingCharacters') }}:\n            <span class=\"font-semibold\">{{ remainingCharacters() }}</span>\n        </p>\n    }\n</div>\n\n@if (isShining()) {\n    <div class=\"flex\">\n        <ngt-shining class=\"h-10 w-full\"></ngt-shining>\n    </div>\n}\n\n<ng-content></ng-content>\n\n<ngt-validation [control]=\"formControl\" [minLength]=\"minLength()\"></ngt-validation>" }]
+                    ], template: "@if (label() && !isShining()) {\n    <label class=\"flex mb-2 {{ ngtStyle.compile(['text', 'font', 'color.text']) }}\">\n        <span class=\"truncate\" [title]=\"label()\">\n            {{ label() }}:\n        </span>\n\n        @if (isRequired()) {\n            <span class=\"text-red-500 font-bold text-md ml-1\">*</span>\n        }\n\n        @if (helpText()) {\n            <ngt-helper [helpTitle]=\"helpTitle()\" [iconColor]=\"helpTextColor()\" class=\"ml-1\">\n                {{ helpText() }}\n            </ngt-helper>\n        }\n    </label>\n}\n\n<div [class]=\"isShining() ? 'hidden' : 'flex flex-col'\">\n    <textarea [class]=\"textareaClasses()\" autocomplete=\"new-password\" [rows]=\"rows()\" [disabled]=\"isDisabledState()\"\n        [readonly]=\"isReadonly()\" [placeholder]=\"placeholder()\" (input)=\"onNativeChange()\" (blur)=\"onTouched()\"\n        #textareaElement></textarea>\n\n    @if (showCharactersLength() && remainingCharacters() !== null) {\n        <p class=\"text-xxs mt-1\">\n            {{ getTranslation('ngtTextAreaRemainingCharacters') }}:\n            <span class=\"font-semibold\">{{ remainingCharacters() }}</span>\n        </p>\n    }\n</div>\n\n@if (isShining()) {\n    <div class=\"flex\">\n        <ngt-shining class=\"h-10 w-full\"></ngt-shining>\n    </div>\n}\n\n<ng-content></ng-content>\n\n<ngt-validation [control]=\"formControl\" [minLength]=\"minLength()\"></ngt-validation>" }]
         }], ctorParameters: () => [{ type: NgtStylizableDirective, decorators: [{
                     type: Optional
                 }, {
@@ -10462,41 +10463,42 @@ class NgtReactiveSelectComponent extends NgtControlValueAccessor {
         this.helperReverseYPosition = input(false);
         this.helperAutoXReverse = input(true);
         /** Behavior Inputs */
+        this.remoteResource = input();
+        this.items = input([]);
+        this.bindLabel = input('name');
+        this.bindValue = input();
+        this.inputAttrs = input();
+        this.groupBy = input(null);
+        this.tabIndex = input();
+        this.groupValue = input();
+        this.trackByFn = input();
+        this.isAllowedToRemoveFn = input();
+        this.sortSelectedItemsFn = input();
         this.autoLoad = input(false);
         this.allowCreate = input(false);
         this.allowOriginalItemsUnselect = input(true);
         this.isDisabled = input(false);
         this.isReadonly = input(false);
-        this.remoteResource = input();
         this.hideSelected = input(false);
-        this.bindLabel = input('name');
-        this.bindValue = input();
-        this.items = input([]);
-        this.inputAttrs = input();
         this.closeOnSelect = input(true);
         this.clearable = input(true);
-        this.groupBy = input(null);
         this.multiple = input(false);
         this.searchable = input(true);
         this.clearSearchOnAdd = input(true);
         this.virtualScroll = input(true);
-        this.tabIndex = input();
         this.guessCompareWith = input(true);
         this.compareWith = input((a, b) => a === b);
         this.autoSelectUniqueOption = input(false);
-        this.groupValue = input();
-        this.trackByFn = input();
-        this.sortSelectedItemsFn = input();
-        this.isAllowedToRemoveFn = input();
+        this.valueAsArray = input(false);
         /** Validation Inputs */
         this.maxSelectedItems = input();
-        this.isRequired = input(false);
         this.customSyncValidators = input();
+        this.isRequired = input(false);
         /** Outputs */
         this.onLoadRemoteResource = output();
         this.onSelectedItemRemove = output();
         this.onClear = output();
-        this.onClose = output();
+        this.onToggleDropdown = output();
         this.onValueChange = output();
         /** Computed Signals */
         this.isShining = computed(() => this.shining() || this.ngtReactForm?.shining() || this.stateService.shining());
@@ -10542,12 +10544,16 @@ class NgtReactiveSelectComponent extends NgtControlValueAccessor {
         this.destroySubscriptions();
     }
     onOpen() {
+        this.onToggleDropdown.emit(true);
         const parentElements = document.querySelectorAll('#ngtSelectParentContainer');
         if (this.dropdownPosition() === 'auto' && parentElements?.length) {
             const parentContainer = parentElements[parentElements.length - 1];
             this.calculateDropdownPosition(parentContainer);
         }
     }
+    onClose() {
+        this.onToggleDropdown.emit(false);
+    }
     onClearSelect() {
         this.searchService.clearFilters();
         this.onClear.emit();
@@ -10570,16 +10576,18 @@ class NgtReactiveSelectComponent extends NgtControlValueAccessor {
     onNativeChange(value) {
         if (this.hasChangesBetweenValues(this.value, value)) {
             value = this.sortSelectedItems(value);
+            if (this.valueAsArray() && !Array.isArray(value)) {
+                value = [value];
+            }
             this.nativeValue = value;
             this.value = value;
         }
     }
     change(value) {
-        if (this.formControl
-            && this.hasChangesBetweenValues(value, this.formControl.value)) {
-            this.formControl.setValue(value);
-        }
         if (this.hasChangesBetweenValues(value, this.nativeValue)) {
+            if (this.valueAsArray() && !Array.isArray(value)) {
+                value = [value];
+            }
             this.nativeValue = this.sortSelectedItems(value);
             this.changeDetector.detectChanges();
             this.ngSelectComponent.writeValue(this.nativeValue);
@@ -10763,7 +10771,7 @@ class NgtReactiveSelectComponent extends NgtControlValueAccessor {
         return this.ngSelectComponent.element.parentElement.parentElement.parentElement.title;
     }
     hasChangesBetweenValues(a, b) {
-        return JSON.stringify(a) !== JSON.stringify(b);
+        return JSON.stringify(a ?? null) !== JSON.stringify(b ?? null);
     }
     hadPreviousSelection(item) {
         const compareWithFn = this.getCompareWith();
@@ -10777,7 +10785,7 @@ class NgtReactiveSelectComponent extends NgtControlValueAccessor {
         this.subscriptions = [];
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgtReactiveSelectComponent, deps: [{ token: NgtStylizableDirective, optional: true, self: true }, { token: NgtTranslateService, optional: true }, { token: NgtReactiveFormComponent, optional: true, skipSelf: true }, { token: NgtSectionComponent, optional: true, skipSelf: true }, { token: NgtModalComponent, optional: true, skipSelf: true }, { token: NgtReactiveSelectValidationService }, { token: NgtReactiveSelectSearchService }, { token: NgtReactiveSelectItemsService }, { token: NgtReactiveSelectDropdownService }, { token: NgtReactiveSelectTagManagerService }, { token: i0.ChangeDetectorRef }, { token: i0.Injector }, { token: NgtReactiveSelectStateService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: NgtReactiveSelectComponent, isStandalone: true, selector: "ngt-reactive-select", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, labelIcon: { classPropertyName: "labelIcon", publicName: "labelIcon", isSignal: true, isRequired: false, transformFunction: null }, labelIconColor: { classPropertyName: "labelIconColor", publicName: "labelIconColor", isSignal: true, isRequired: false, transformFunction: null }, helpTitle: { classPropertyName: "helpTitle", publicName: "helpTitle", isSignal: true, isRequired: false, transformFunction: null }, helpText: { classPropertyName: "helpText", publicName: "helpText", isSignal: true, isRequired: false, transformFunction: null }, helpTextColor: { classPropertyName: "helpTextColor", publicName: "helpTextColor", isSignal: true, isRequired: false, transformFunction: null }, shining: { classPropertyName: "shining", publicName: "shining", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, loadingText: { classPropertyName: "loadingText", publicName: "loadingText", isSignal: true, isRequired: false, transformFunction: null }, notFoundText: { classPropertyName: "notFoundText", publicName: "notFoundText", isSignal: true, isRequired: false, transformFunction: null }, dropdownPosition: { classPropertyName: "dropdownPosition", publicName: "dropdownPosition", isSignal: true, isRequired: false, transformFunction: null }, typeToSearchText: { classPropertyName: "typeToSearchText", publicName: "typeToSearchText", isSignal: true, isRequired: false, transformFunction: null }, clearAllTooltip: { classPropertyName: "clearAllTooltip", publicName: "clearAllTooltip", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, createText: { classPropertyName: "createText", publicName: "createText", isSignal: true, isRequired: false, transformFunction: null }, labelForId: { classPropertyName: "labelForId", publicName: "labelForId", isSignal: true, isRequired: false, transformFunction: null }, dropdownPanelMinHeight: { classPropertyName: "dropdownPanelMinHeight", publicName: "dropdownPanelMinHeight", isSignal: true, isRequired: false, transformFunction: null }, helperReverseYPosition: { classPropertyName: "helperReverseYPosition", publicName: "helperReverseYPosition", isSignal: true, isRequired: false, transformFunction: null }, helperAutoXReverse: { classPropertyName: "helperAutoXReverse", publicName: "helperAutoXReverse", isSignal: true, isRequired: false, transformFunction: null }, autoLoad: { classPropertyName: "autoLoad", publicName: "autoLoad", isSignal: true, isRequired: false, transformFunction: null }, allowCreate: { classPropertyName: "allowCreate", publicName: "allowCreate", isSignal: true, isRequired: false, transformFunction: null }, allowOriginalItemsUnselect: { classPropertyName: "allowOriginalItemsUnselect", publicName: "allowOriginalItemsUnselect", isSignal: true, isRequired: false, transformFunction: null }, isDisabled: { classPropertyName: "isDisabled", publicName: "isDisabled", isSignal: true, isRequired: false, transformFunction: null }, isReadonly: { classPropertyName: "isReadonly", publicName: "isReadonly", isSignal: true, isRequired: false, transformFunction: null }, remoteResource: { classPropertyName: "remoteResource", publicName: "remoteResource", isSignal: true, isRequired: false, transformFunction: null }, hideSelected: { classPropertyName: "hideSelected", publicName: "hideSelected", isSignal: true, isRequired: false, transformFunction: null }, bindLabel: { classPropertyName: "bindLabel", publicName: "bindLabel", isSignal: true, isRequired: false, transformFunction: null }, bindValue: { classPropertyName: "bindValue", publicName: "bindValue", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, inputAttrs: { classPropertyName: "inputAttrs", publicName: "inputAttrs", isSignal: true, isRequired: false, transformFunction: null }, closeOnSelect: { classPropertyName: "closeOnSelect", publicName: "closeOnSelect", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, groupBy: { classPropertyName: "groupBy", publicName: "groupBy", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, searchable: { classPropertyName: "searchable", publicName: "searchable", isSignal: true, isRequired: false, transformFunction: null }, clearSearchOnAdd: { classPropertyName: "clearSearchOnAdd", publicName: "clearSearchOnAdd", isSignal: true, isRequired: false, transformFunction: null }, virtualScroll: { classPropertyName: "virtualScroll", publicName: "virtualScroll", isSignal: true, isRequired: false, transformFunction: null }, tabIndex: { classPropertyName: "tabIndex", publicName: "tabIndex", isSignal: true, isRequired: false, transformFunction: null }, guessCompareWith: { classPropertyName: "guessCompareWith", publicName: "guessCompareWith", isSignal: true, isRequired: false, transformFunction: null }, compareWith: { classPropertyName: "compareWith", publicName: "compareWith", isSignal: true, isRequired: false, transformFunction: null }, autoSelectUniqueOption: { classPropertyName: "autoSelectUniqueOption", publicName: "autoSelectUniqueOption", isSignal: true, isRequired: false, transformFunction: null }, groupValue: { classPropertyName: "groupValue", publicName: "groupValue", isSignal: true, isRequired: false, transformFunction: null }, trackByFn: { classPropertyName: "trackByFn", publicName: "trackByFn", isSignal: true, isRequired: false, transformFunction: null }, sortSelectedItemsFn: { classPropertyName: "sortSelectedItemsFn", publicName: "sortSelectedItemsFn", isSignal: true, isRequired: false, transformFunction: null }, isAllowedToRemoveFn: { classPropertyName: "isAllowedToRemoveFn", publicName: "isAllowedToRemoveFn", isSignal: true, isRequired: false, transformFunction: null }, maxSelectedItems: { classPropertyName: "maxSelectedItems", publicName: "maxSelectedItems", isSignal: true, isRequired: false, transformFunction: null }, isRequired: { classPropertyName: "isRequired", publicName: "isRequired", isSignal: true, isRequired: false, transformFunction: null }, customSyncValidators: { classPropertyName: "customSyncValidators", publicName: "customSyncValidators", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onLoadRemoteResource: "onLoadRemoteResource", onSelectedItemRemove: "onSelectedItemRemove", onClear: "onClear", onClose: "onClose", onValueChange: "onValueChange" }, providers: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: NgtReactiveSelectComponent, isStandalone: true, selector: "ngt-reactive-select", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, labelIcon: { classPropertyName: "labelIcon", publicName: "labelIcon", isSignal: true, isRequired: false, transformFunction: null }, labelIconColor: { classPropertyName: "labelIconColor", publicName: "labelIconColor", isSignal: true, isRequired: false, transformFunction: null }, helpTitle: { classPropertyName: "helpTitle", publicName: "helpTitle", isSignal: true, isRequired: false, transformFunction: null }, helpText: { classPropertyName: "helpText", publicName: "helpText", isSignal: true, isRequired: false, transformFunction: null }, helpTextColor: { classPropertyName: "helpTextColor", publicName: "helpTextColor", isSignal: true, isRequired: false, transformFunction: null }, shining: { classPropertyName: "shining", publicName: "shining", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, loadingText: { classPropertyName: "loadingText", publicName: "loadingText", isSignal: true, isRequired: false, transformFunction: null }, notFoundText: { classPropertyName: "notFoundText", publicName: "notFoundText", isSignal: true, isRequired: false, transformFunction: null }, dropdownPosition: { classPropertyName: "dropdownPosition", publicName: "dropdownPosition", isSignal: true, isRequired: false, transformFunction: null }, typeToSearchText: { classPropertyName: "typeToSearchText", publicName: "typeToSearchText", isSignal: true, isRequired: false, transformFunction: null }, clearAllTooltip: { classPropertyName: "clearAllTooltip", publicName: "clearAllTooltip", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, createText: { classPropertyName: "createText", publicName: "createText", isSignal: true, isRequired: false, transformFunction: null }, labelForId: { classPropertyName: "labelForId", publicName: "labelForId", isSignal: true, isRequired: false, transformFunction: null }, dropdownPanelMinHeight: { classPropertyName: "dropdownPanelMinHeight", publicName: "dropdownPanelMinHeight", isSignal: true, isRequired: false, transformFunction: null }, helperReverseYPosition: { classPropertyName: "helperReverseYPosition", publicName: "helperReverseYPosition", isSignal: true, isRequired: false, transformFunction: null }, helperAutoXReverse: { classPropertyName: "helperAutoXReverse", publicName: "helperAutoXReverse", isSignal: true, isRequired: false, transformFunction: null }, remoteResource: { classPropertyName: "remoteResource", publicName: "remoteResource", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, bindLabel: { classPropertyName: "bindLabel", publicName: "bindLabel", isSignal: true, isRequired: false, transformFunction: null }, bindValue: { classPropertyName: "bindValue", publicName: "bindValue", isSignal: true, isRequired: false, transformFunction: null }, inputAttrs: { classPropertyName: "inputAttrs", publicName: "inputAttrs", isSignal: true, isRequired: false, transformFunction: null }, groupBy: { classPropertyName: "groupBy", publicName: "groupBy", isSignal: true, isRequired: false, transformFunction: null }, tabIndex: { classPropertyName: "tabIndex", publicName: "tabIndex", isSignal: true, isRequired: false, transformFunction: null }, groupValue: { classPropertyName: "groupValue", publicName: "groupValue", isSignal: true, isRequired: false, transformFunction: null }, trackByFn: { classPropertyName: "trackByFn", publicName: "trackByFn", isSignal: true, isRequired: false, transformFunction: null }, isAllowedToRemoveFn: { classPropertyName: "isAllowedToRemoveFn", publicName: "isAllowedToRemoveFn", isSignal: true, isRequired: false, transformFunction: null }, sortSelectedItemsFn: { classPropertyName: "sortSelectedItemsFn", publicName: "sortSelectedItemsFn", isSignal: true, isRequired: false, transformFunction: null }, autoLoad: { classPropertyName: "autoLoad", publicName: "autoLoad", isSignal: true, isRequired: false, transformFunction: null }, allowCreate: { classPropertyName: "allowCreate", publicName: "allowCreate", isSignal: true, isRequired: false, transformFunction: null }, allowOriginalItemsUnselect: { classPropertyName: "allowOriginalItemsUnselect", publicName: "allowOriginalItemsUnselect", isSignal: true, isRequired: false, transformFunction: null }, isDisabled: { classPropertyName: "isDisabled", publicName: "isDisabled", isSignal: true, isRequired: false, transformFunction: null }, isReadonly: { classPropertyName: "isReadonly", publicName: "isReadonly", isSignal: true, isRequired: false, transformFunction: null }, hideSelected: { classPropertyName: "hideSelected", publicName: "hideSelected", isSignal: true, isRequired: false, transformFunction: null }, closeOnSelect: { classPropertyName: "closeOnSelect", publicName: "closeOnSelect", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, searchable: { classPropertyName: "searchable", publicName: "searchable", isSignal: true, isRequired: false, transformFunction: null }, clearSearchOnAdd: { classPropertyName: "clearSearchOnAdd", publicName: "clearSearchOnAdd", isSignal: true, isRequired: false, transformFunction: null }, virtualScroll: { classPropertyName: "virtualScroll", publicName: "virtualScroll", isSignal: true, isRequired: false, transformFunction: null }, guessCompareWith: { classPropertyName: "guessCompareWith", publicName: "guessCompareWith", isSignal: true, isRequired: false, transformFunction: null }, compareWith: { classPropertyName: "compareWith", publicName: "compareWith", isSignal: true, isRequired: false, transformFunction: null }, autoSelectUniqueOption: { classPropertyName: "autoSelectUniqueOption", publicName: "autoSelectUniqueOption", isSignal: true, isRequired: false, transformFunction: null }, valueAsArray: { classPropertyName: "valueAsArray", publicName: "valueAsArray", isSignal: true, isRequired: false, transformFunction: null }, maxSelectedItems: { classPropertyName: "maxSelectedItems", publicName: "maxSelectedItems", isSignal: true, isRequired: false, transformFunction: null }, customSyncValidators: { classPropertyName: "customSyncValidators", publicName: "customSyncValidators", isSignal: true, isRequired: false, transformFunction: null }, isRequired: { classPropertyName: "isRequired", publicName: "isRequired", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onLoadRemoteResource: "onLoadRemoteResource", onSelectedItemRemove: "onSelectedItemRemove", onClear: "onClear", onToggleDropdown: "onToggleDropdown", onValueChange: "onValueChange" }, providers: [
             NgtValueAccessorProvider(NgtReactiveSelectComponent),
             NgtReactiveSelectValidationService,
             NgtReactiveSelectSearchService,
@@ -10785,7 +10793,7 @@ class NgtReactiveSelectComponent extends NgtControlValueAccessor {
             NgtReactiveSelectDropdownService,
             NgtReactiveSelectStateService,
             NgtReactiveSelectTagManagerService,
-        ], queries: [{ propertyName: "ngtOptionTemplate", first: true, predicate: NgtReactiveSelectOptionTemplate, descendants: true, read: TemplateRef }, { propertyName: "ngtOptionSelectedTemplate", first: true, predicate: NgtReactiveSelectOptionSelectedTemplate, descendants: true, read: TemplateRef }, { propertyName: "ngtSelectHeaderTemplate", first: true, predicate: NgtReactiveSelectHeaderTemplate, descendants: true, read: TemplateRef }], viewQueries: [{ propertyName: "ngSelectComponent", first: true, predicate: NgSelectComponent, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "@if (label() && !isShining()) {\n<label\n    class=\"{{ isShining() ? '' : 'block' }} {{ ngtStyle.compile(['color.text', 'text', 'font', 'fontCase']) }} mb-2 flex\">\n    @if (labelIcon()) {\n        <ngt-svg class=\"mr-1 {{labelIconColor()}}\" [src]=\"labelIcon()\"></ngt-svg>\n    }\n\n    <span class=\"truncate\" [title]=\"label()\">\n        {{ label() }}:\n    </span>\n\n    @if (isRequired()) {\n        <span class=\"text-red-500 font-bold text-md ml-1\">*</span>\n    }\n\n    @if (helpText()) {\n        <ngt-helper [helpTitle]=\"helpTitle()\" [iconColor]=\"helpTextColor()\"\n            [helperReverseYPosition]=\"helperReverseYPosition()\" [autoXReverse]=\"helperAutoXReverse()\" class=\"ml-1\">\n            {{ helpText() }}\n        </ngt-helper>\n    }\n</label>\n}\n\n<div [hidden]=\"isShining()\" class=\"{{ ngtStyle.compile(['text']) }} {{ selectClasses() }} normal-case\"\n    style=\"min-height: 2.5rem;\">\n    <ng-select class=\"custom\" [addTag]=\"allowCreate()\" [readonly]=\"isDisabledState()\"\n        [addTagText]=\"createText() || ngtTranslateService.ngtSelectCreateText\" [bindLabel]=\"bindLabel()\"\n        [multiple]=\"multiple()\" [hideSelected]=\"hideSelected()\" [typeahead]=\"typeaheadSubject()\"\n        [notFoundText]=\"notFoundText() || ngtTranslateService.ngtSelectNotFoundText\" [searchable]=\"searchable()\"\n        [searchFn]=\"itemSearchFn()\" [clearable]=\"isClearable() && hasSelectedValue()\"\n        [closeOnSelect]=\"shouldCloseOnSelect()\" [trackByFn]=\"trackByFn()\" [labelForId]=\"labelForId()\"\n        [typeToSearchText]=\"typeToSearchText() || ngtTranslateService.ngtSelectTypeToSearchText\"\n        [placeholder]=\"placeholder() || ngtTranslateService.ngtSelectPlaceholder\"\n        [dropdownPosition]=\"dropdownPosition()\" [groupBy]=\"groupBy()\"\n        [clearAllText]=\"clearAllTooltip() || ngtTranslateService.ngtSelectClearAllTooltip\"\n        [clearSearchOnAdd]=\"clearSearchOnAdd()\" [bindValue]=\"bindValue()\" [virtualScroll]=\"virtualScroll()\"\n        [loadingText]=\"loadingText() || ngtTranslateService.ngtSelectLoadingText\"\n        [maxSelectedItems]=\"maxSelectedItems()\" [tabIndex]=\"tabIndex()\" [items]=\"stateService.ngSelectItems() | async\"\n        [groupValue]=\"groupValue()\" [loading]=\"isLoading()\" [compareWith]=\"getCompareWith()\" [inputAttrs]=\"inputAttrs()\"\n        (scroll)=\"onScroll($event)\" (close)=\"onClose.emit()\" (clear)=\"onClearSelect()\" \n        (remove)=\"onRemoveSelectedItem($event)\" (open)=\"onOpen()\" (change)=\"onNativeChange($event)\" \n        (blur)=\"onTouched()\" (click)=\"stateService.markAsClicked()\">\n\n        @if (ngtSelectHeaderTemplate) {\n            <ng-template ng-header-tmp>\n                <ng-template [ngTemplateOutlet]=\"ngtSelectHeaderTemplate\">\n                </ng-template>\n            </ng-template>\n        }\n\n        <ng-template ng-label-tmp let-item=\"item\">\n            <div class=\"flex w-full items-center pr-1\">\n                @if (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                }\n\n                @if (ngtOptionSelectedTemplate) {\n                    <ng-template [ngTemplateOutlet]=\"ngtOptionSelectedTemplate\" [ngTemplateOutletContext]=\"{ item: item }\">\n                    </ng-template>\n                }\n\n                @if (!ngtOptionSelectedTemplate && ngtOptionTemplate) {\n                    <ng-template [ngTemplateOutlet]=\"ngtOptionTemplate\" [ngTemplateOutletContext]=\"{ item: item }\">\n                    </ng-template>\n                }\n            </div>\n        </ng-template>\n\n        <ng-template ng-option-tmp let-item=\"item\" let-index=\"index\" let-search=\"searchTerm\">\n            @if (ngtOptionTemplate) {\n                <ng-template [ngTemplateOutlet]=\"ngtOptionTemplate\"\n                    [ngTemplateOutletContext]=\"{ item: item, index: index, searchTerm: search }\">\n                </ng-template>\n            }\n        </ng-template>\n    </ng-select>\n</div>\n\n@if (isShining()) {\n    <div class=\"flex\">\n        <ngt-shining class=\"{{ ngtStyle.compile(['h']) }} w-full\"></ngt-shining>\n    </div>\n}\n\n<ngt-validation [control]=\"formControl\"></ngt-validation>", 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:2.5rem!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: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i2$1.AsyncPipe, name: "async" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: NgSelectModule }, { kind: "component", type: i9.NgSelectComponent, selector: "ng-select", inputs: ["ariaLabelDropdown", "bindLabel", "bindValue", "ariaLabel", "markFirst", "placeholder", "fixedPlaceholder", "notFoundText", "typeToSearchText", "preventToggleOnRightClick", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "tabFocusOnClearButton", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "ngClass", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick", "keyDownFn"], 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: "ngmodule", type: NgtValidationModule }, { kind: "component", type: NgtValidationComponent, selector: "ngt-validation", inputs: ["control", "container", "minValue", "minLength"] }, { kind: "ngmodule", type: NgtShiningModule }, { kind: "component", type: NgtShiningComponent, selector: "ngt-shining", inputs: ["shiningWidth"] }, { kind: "ngmodule", type: NgtSvgModule }, { kind: "component", type: NgtSvgComponent, selector: "ngt-svg", inputs: ["src", "class"] }, { kind: "component", type: NgtHelperComponent, selector: "ngt-helper", inputs: ["helpTextColor", "helpText", "helpTitle", "icon", "iconSize", "iconColor", "iconTitle", "tooltipSize", "autoXReverse", "helperReverseYPosition"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], queries: [{ propertyName: "ngtOptionTemplate", first: true, predicate: NgtReactiveSelectOptionTemplate, descendants: true, read: TemplateRef }, { propertyName: "ngtOptionSelectedTemplate", first: true, predicate: NgtReactiveSelectOptionSelectedTemplate, descendants: true, read: TemplateRef }, { propertyName: "ngtSelectHeaderTemplate", first: true, predicate: NgtReactiveSelectHeaderTemplate, descendants: true, read: TemplateRef }], viewQueries: [{ propertyName: "ngSelectComponent", first: true, predicate: NgSelectComponent, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "@if (label() && !isShining()) {\n<label\n    class=\"{{ isShining() ? '' : 'block' }} {{ ngtStyle.compile(['color.text', 'text', 'font', 'fontCase']) }} mb-2 flex\">\n    @if (labelIcon()) {\n        <ngt-svg class=\"mr-1 {{labelIconColor()}}\" [src]=\"labelIcon()\"></ngt-svg>\n    }\n\n    <span class=\"truncate\" [title]=\"label()\">\n        {{ label() }}:\n    </span>\n\n    @if (isRequired()) {\n        <span class=\"text-red-500 font-bold text-md ml-1\">*</span>\n    }\n\n    @if (helpText()) {\n        <ngt-helper [helpTitle]=\"helpTitle()\" [iconColor]=\"helpTextColor()\"\n            [helperReverseYPosition]=\"helperReverseYPosition()\" [autoXReverse]=\"helperAutoXReverse()\" class=\"ml-1\">\n            {{ helpText() }}\n        </ngt-helper>\n    }\n</label>\n}\n\n<div [hidden]=\"isShining()\" class=\"{{ ngtStyle.compile(['text']) }} {{ selectClasses() }} normal-case\"\n    style=\"min-height: 2.5rem;\">\n    <ng-select class=\"custom\" [addTag]=\"allowCreate()\" [readonly]=\"isDisabledState()\"\n        [addTagText]=\"createText() || ngtTranslateService.ngtSelectCreateText\" [bindLabel]=\"bindLabel()\"\n        [multiple]=\"multiple()\" [hideSelected]=\"hideSelected()\" [typeahead]=\"typeaheadSubject()\"\n        [notFoundText]=\"notFoundText() || ngtTranslateService.ngtSelectNotFoundText\" [searchable]=\"searchable()\"\n        [searchFn]=\"itemSearchFn()\" [clearable]=\"isClearable() && hasSelectedValue()\"\n        [closeOnSelect]=\"shouldCloseOnSelect()\" [trackByFn]=\"trackByFn()\" [labelForId]=\"labelForId()\"\n        [typeToSearchText]=\"typeToSearchText() || ngtTranslateService.ngtSelectTypeToSearchText\"\n        [placeholder]=\"placeholder() || ngtTranslateService.ngtSelectPlaceholder\"\n        [dropdownPosition]=\"dropdownPosition()\" [groupBy]=\"groupBy()\"\n        [clearAllText]=\"clearAllTooltip() || ngtTranslateService.ngtSelectClearAllTooltip\"\n        [clearSearchOnAdd]=\"clearSearchOnAdd()\" [bindValue]=\"bindValue()\" [virtualScroll]=\"virtualScroll()\"\n        [loadingText]=\"loadingText() || ngtTranslateService.ngtSelectLoadingText\"\n        [maxSelectedItems]=\"maxSelectedItems()\" [tabIndex]=\"tabIndex()\" [items]=\"stateService.ngSelectItems() | async\"\n        [groupValue]=\"groupValue()\" [loading]=\"isLoading()\" [compareWith]=\"getCompareWith()\" [inputAttrs]=\"inputAttrs()\"\n        (scroll)=\"onScroll($event)\" (close)=\"onClose()\" (clear)=\"onClearSelect()\" \n        (remove)=\"onRemoveSelectedItem($event)\" (open)=\"onOpen()\" (change)=\"onNativeChange($event)\" \n        (blur)=\"onTouched()\" (click)=\"stateService.markAsClicked()\">\n\n        @if (ngtSelectHeaderTemplate) {\n            <ng-template ng-header-tmp>\n                <ng-template [ngTemplateOutlet]=\"ngtSelectHeaderTemplate\">\n                </ng-template>\n            </ng-template>\n        }\n\n        <ng-template ng-label-tmp let-item=\"item\">\n            <div class=\"flex w-full items-center pr-1\">\n                @if (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                }\n\n                @if (ngtOptionSelectedTemplate) {\n                    <ng-template [ngTemplateOutlet]=\"ngtOptionSelectedTemplate\" [ngTemplateOutletContext]=\"{ item: item }\">\n                    </ng-template>\n                }\n\n                @if (!ngtOptionSelectedTemplate && ngtOptionTemplate) {\n                    <ng-template [ngTemplateOutlet]=\"ngtOptionTemplate\" [ngTemplateOutletContext]=\"{ item: item }\">\n                    </ng-template>\n                }\n            </div>\n        </ng-template>\n\n        <ng-template ng-option-tmp let-item=\"item\" let-index=\"index\" let-search=\"searchTerm\">\n            @if (ngtOptionTemplate) {\n                <ng-template [ngTemplateOutlet]=\"ngtOptionTemplate\"\n                    [ngTemplateOutletContext]=\"{ item: item, index: index, searchTerm: search }\">\n                </ng-template>\n            }\n        </ng-template>\n    </ng-select>\n</div>\n\n@if (isShining()) {\n    <div class=\"flex\">\n        <ngt-shining class=\"{{ ngtStyle.compile(['h']) }} w-full\"></ngt-shining>\n    </div>\n}\n\n<ngt-validation [control]=\"formControl\"></ngt-validation>", 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:2.5rem!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: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i2$1.AsyncPipe, name: "async" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: NgSelectModule }, { kind: "component", type: i9.NgSelectComponent, selector: "ng-select", inputs: ["ariaLabelDropdown", "bindLabel", "bindValue", "ariaLabel", "markFirst", "placeholder", "fixedPlaceholder", "notFoundText", "typeToSearchText", "preventToggleOnRightClick", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "tabFocusOnClearButton", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "ngClass", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick", "keyDownFn"], 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: "ngmodule", type: NgtValidationModule }, { kind: "component", type: NgtValidationComponent, selector: "ngt-validation", inputs: ["control", "container", "minValue", "minLength"] }, { kind: "ngmodule", type: NgtShiningModule }, { kind: "component", type: NgtShiningComponent, selector: "ngt-shining", inputs: ["shiningWidth"] }, { kind: "ngmodule", type: NgtSvgModule }, { kind: "component", type: NgtSvgComponent, selector: "ngt-svg", inputs: ["src", "class"] }, { kind: "component", type: NgtHelperComponent, selector: "ngt-helper", inputs: ["helpTextColor", "helpText", "helpTitle", "icon", "iconSize", "iconColor", "iconTitle", "tooltipSize", "autoXReverse", "helperReverseYPosition"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgtReactiveSelectComponent, decorators: [{
             type: Component,
@@ -10809,7 +10817,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
                         NgtReactiveSelectOptionTemplate,
                         NgtReactiveSelectOptionSelectedTemplate,
                         NgtReactiveSelectHeaderTemplate,
-                    ], template: "@if (label() && !isShining()) {\n<label\n    class=\"{{ isShining() ? '' : 'block' }} {{ ngtStyle.compile(['color.text', 'text', 'font', 'fontCase']) }} mb-2 flex\">\n    @if (labelIcon()) {\n        <ngt-svg class=\"mr-1 {{labelIconColor()}}\" [src]=\"labelIcon()\"></ngt-svg>\n    }\n\n    <span class=\"truncate\" [title]=\"label()\">\n        {{ label() }}:\n    </span>\n\n    @if (isRequired()) {\n        <span class=\"text-red-500 font-bold text-md ml-1\">*</span>\n    }\n\n    @if (helpText()) {\n        <ngt-helper [helpTitle]=\"helpTitle()\" [iconColor]=\"helpTextColor()\"\n            [helperReverseYPosition]=\"helperReverseYPosition()\" [autoXReverse]=\"helperAutoXReverse()\" class=\"ml-1\">\n            {{ helpText() }}\n        </ngt-helper>\n    }\n</label>\n}\n\n<div [hidden]=\"isShining()\" class=\"{{ ngtStyle.compile(['text']) }} {{ selectClasses() }} normal-case\"\n    style=\"min-height: 2.5rem;\">\n    <ng-select class=\"custom\" [addTag]=\"allowCreate()\" [readonly]=\"isDisabledState()\"\n        [addTagText]=\"createText() || ngtTranslateService.ngtSelectCreateText\" [bindLabel]=\"bindLabel()\"\n        [multiple]=\"multiple()\" [hideSelected]=\"hideSelected()\" [typeahead]=\"typeaheadSubject()\"\n        [notFoundText]=\"notFoundText() || ngtTranslateService.ngtSelectNotFoundText\" [searchable]=\"searchable()\"\n        [searchFn]=\"itemSearchFn()\" [clearable]=\"isClearable() && hasSelectedValue()\"\n        [closeOnSelect]=\"shouldCloseOnSelect()\" [trackByFn]=\"trackByFn()\" [labelForId]=\"labelForId()\"\n        [typeToSearchText]=\"typeToSearchText() || ngtTranslateService.ngtSelectTypeToSearchText\"\n        [placeholder]=\"placeholder() || ngtTranslateService.ngtSelectPlaceholder\"\n        [dropdownPosition]=\"dropdownPosition()\" [groupBy]=\"groupBy()\"\n        [clearAllText]=\"clearAllTooltip() || ngtTranslateService.ngtSelectClearAllTooltip\"\n        [clearSearchOnAdd]=\"clearSearchOnAdd()\" [bindValue]=\"bindValue()\" [virtualScroll]=\"virtualScroll()\"\n        [loadingText]=\"loadingText() || ngtTranslateService.ngtSelectLoadingText\"\n        [maxSelectedItems]=\"maxSelectedItems()\" [tabIndex]=\"tabIndex()\" [items]=\"stateService.ngSelectItems() | async\"\n        [groupValue]=\"groupValue()\" [loading]=\"isLoading()\" [compareWith]=\"getCompareWith()\" [inputAttrs]=\"inputAttrs()\"\n        (scroll)=\"onScroll($event)\" (close)=\"onClose.emit()\" (clear)=\"onClearSelect()\" \n        (remove)=\"onRemoveSelectedItem($event)\" (open)=\"onOpen()\" (change)=\"onNativeChange($event)\" \n        (blur)=\"onTouched()\" (click)=\"stateService.markAsClicked()\">\n\n        @if (ngtSelectHeaderTemplate) {\n            <ng-template ng-header-tmp>\n                <ng-template [ngTemplateOutlet]=\"ngtSelectHeaderTemplate\">\n                </ng-template>\n            </ng-template>\n        }\n\n        <ng-template ng-label-tmp let-item=\"item\">\n            <div class=\"flex w-full items-center pr-1\">\n                @if (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                }\n\n                @if (ngtOptionSelectedTemplate) {\n                    <ng-template [ngTemplateOutlet]=\"ngtOptionSelectedTemplate\" [ngTemplateOutletContext]=\"{ item: item }\">\n                    </ng-template>\n                }\n\n                @if (!ngtOptionSelectedTemplate && ngtOptionTemplate) {\n                    <ng-template [ngTemplateOutlet]=\"ngtOptionTemplate\" [ngTemplateOutletContext]=\"{ item: item }\">\n                    </ng-template>\n                }\n            </div>\n        </ng-template>\n\n        <ng-template ng-option-tmp let-item=\"item\" let-index=\"index\" let-search=\"searchTerm\">\n            @if (ngtOptionTemplate) {\n                <ng-template [ngTemplateOutlet]=\"ngtOptionTemplate\"\n                    [ngTemplateOutletContext]=\"{ item: item, index: index, searchTerm: search }\">\n                </ng-template>\n            }\n        </ng-template>\n    </ng-select>\n</div>\n\n@if (isShining()) {\n    <div class=\"flex\">\n        <ngt-shining class=\"{{ ngtStyle.compile(['h']) }} w-full\"></ngt-shining>\n    </div>\n}\n\n<ngt-validation [control]=\"formControl\"></ngt-validation>", 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:2.5rem!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"] }]
+                    ], template: "@if (label() && !isShining()) {\n<label\n    class=\"{{ isShining() ? '' : 'block' }} {{ ngtStyle.compile(['color.text', 'text', 'font', 'fontCase']) }} mb-2 flex\">\n    @if (labelIcon()) {\n        <ngt-svg class=\"mr-1 {{labelIconColor()}}\" [src]=\"labelIcon()\"></ngt-svg>\n    }\n\n    <span class=\"truncate\" [title]=\"label()\">\n        {{ label() }}:\n    </span>\n\n    @if (isRequired()) {\n        <span class=\"text-red-500 font-bold text-md ml-1\">*</span>\n    }\n\n    @if (helpText()) {\n        <ngt-helper [helpTitle]=\"helpTitle()\" [iconColor]=\"helpTextColor()\"\n            [helperReverseYPosition]=\"helperReverseYPosition()\" [autoXReverse]=\"helperAutoXReverse()\" class=\"ml-1\">\n            {{ helpText() }}\n        </ngt-helper>\n    }\n</label>\n}\n\n<div [hidden]=\"isShining()\" class=\"{{ ngtStyle.compile(['text']) }} {{ selectClasses() }} normal-case\"\n    style=\"min-height: 2.5rem;\">\n    <ng-select class=\"custom\" [addTag]=\"allowCreate()\" [readonly]=\"isDisabledState()\"\n        [addTagText]=\"createText() || ngtTranslateService.ngtSelectCreateText\" [bindLabel]=\"bindLabel()\"\n        [multiple]=\"multiple()\" [hideSelected]=\"hideSelected()\" [typeahead]=\"typeaheadSubject()\"\n        [notFoundText]=\"notFoundText() || ngtTranslateService.ngtSelectNotFoundText\" [searchable]=\"searchable()\"\n        [searchFn]=\"itemSearchFn()\" [clearable]=\"isClearable() && hasSelectedValue()\"\n        [closeOnSelect]=\"shouldCloseOnSelect()\" [trackByFn]=\"trackByFn()\" [labelForId]=\"labelForId()\"\n        [typeToSearchText]=\"typeToSearchText() || ngtTranslateService.ngtSelectTypeToSearchText\"\n        [placeholder]=\"placeholder() || ngtTranslateService.ngtSelectPlaceholder\"\n        [dropdownPosition]=\"dropdownPosition()\" [groupBy]=\"groupBy()\"\n        [clearAllText]=\"clearAllTooltip() || ngtTranslateService.ngtSelectClearAllTooltip\"\n        [clearSearchOnAdd]=\"clearSearchOnAdd()\" [bindValue]=\"bindValue()\" [virtualScroll]=\"virtualScroll()\"\n        [loadingText]=\"loadingText() || ngtTranslateService.ngtSelectLoadingText\"\n        [maxSelectedItems]=\"maxSelectedItems()\" [tabIndex]=\"tabIndex()\" [items]=\"stateService.ngSelectItems() | async\"\n        [groupValue]=\"groupValue()\" [loading]=\"isLoading()\" [compareWith]=\"getCompareWith()\" [inputAttrs]=\"inputAttrs()\"\n        (scroll)=\"onScroll($event)\" (close)=\"onClose()\" (clear)=\"onClearSelect()\" \n        (remove)=\"onRemoveSelectedItem($event)\" (open)=\"onOpen()\" (change)=\"onNativeChange($event)\" \n        (blur)=\"onTouched()\" (click)=\"stateService.markAsClicked()\">\n\n        @if (ngtSelectHeaderTemplate) {\n            <ng-template ng-header-tmp>\n                <ng-template [ngTemplateOutlet]=\"ngtSelectHeaderTemplate\">\n                </ng-template>\n            </ng-template>\n        }\n\n        <ng-template ng-label-tmp let-item=\"item\">\n            <div class=\"flex w-full items-center pr-1\">\n                @if (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                }\n\n                @if (ngtOptionSelectedTemplate) {\n                    <ng-template [ngTemplateOutlet]=\"ngtOptionSelectedTemplate\" [ngTemplateOutletContext]=\"{ item: item }\">\n                    </ng-template>\n                }\n\n                @if (!ngtOptionSelectedTemplate && ngtOptionTemplate) {\n                    <ng-template [ngTemplateOutlet]=\"ngtOptionTemplate\" [ngTemplateOutletContext]=\"{ item: item }\">\n                    </ng-template>\n                }\n            </div>\n        </ng-template>\n\n        <ng-template ng-option-tmp let-item=\"item\" let-index=\"index\" let-search=\"searchTerm\">\n            @if (ngtOptionTemplate) {\n                <ng-template [ngTemplateOutlet]=\"ngtOptionTemplate\"\n                    [ngTemplateOutletContext]=\"{ item: item, index: index, searchTerm: search }\">\n                </ng-template>\n            }\n        </ng-template>\n    </ng-select>\n</div>\n\n@if (isShining()) {\n    <div class=\"flex\">\n        <ngt-shining class=\"{{ ngtStyle.compile(['h']) }} w-full\"></ngt-shining>\n    </div>\n}\n\n<ngt-validation [control]=\"formControl\"></ngt-validation>", 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:2.5rem!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: () => [{ type: NgtStylizableDirective, decorators: [{
                     type: Optional
                 }, {
@@ -10842,6 +10850,35 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
                 args: [NgtReactiveSelectHeaderTemplate, { read: TemplateRef }]
             }] } });
 
+class NgtReactiveSelectModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgtReactiveSelectModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.14", ngImport: i0, type: NgtReactiveSelectModule, imports: [NgtReactiveSelectComponent,
+            NgtReactiveSelectOptionTemplate,
+            NgtReactiveSelectOptionSelectedTemplate,
+            NgtReactiveSelectHeaderTemplate], exports: [NgtReactiveSelectComponent,
+            NgtReactiveSelectOptionTemplate,
+            NgtReactiveSelectOptionSelectedTemplate,
+            NgtReactiveSelectHeaderTemplate] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgtReactiveSelectModule, imports: [NgtReactiveSelectComponent] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgtReactiveSelectModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [
+                        NgtReactiveSelectComponent,
+                        NgtReactiveSelectOptionTemplate,
+                        NgtReactiveSelectOptionSelectedTemplate,
+                        NgtReactiveSelectHeaderTemplate,
+                    ],
+                    exports: [
+                        NgtReactiveSelectComponent,
+                        NgtReactiveSelectOptionTemplate,
+                        NgtReactiveSelectOptionSelectedTemplate,
+                        NgtReactiveSelectHeaderTemplate,
+                    ],
+                }]
+        }] });
+
 class NgtReactiveDateFormatterService {
     formatToDisplay(value, enableTime, dateFormat, placeholder) {
         if (!value) {
@@ -11280,7 +11317,6 @@ class NgtReactiveCheckboxComponent extends NgtControlValueAccessor {
         this.formControl = this.getControl();
     }
     change(value) {
-        this.onValueChange.emit(value);
         if (this.hasChangeBetweenValues()) {
             this.setNativeValue(value);
         }
@@ -11288,7 +11324,7 @@ class NgtReactiveCheckboxComponent extends NgtControlValueAccessor {
     onNativeChange() {
         if (this.hasChangeBetweenValues()) {
             this.value = this.getNativeValue();
-            this.formControl?.setValue(this.value);
+            this.onValueChange.emit(this.value);
         }
     }
     setupNgtStylizable() {
@@ -11414,6 +11450,7 @@ class NgtReactiveRadioButtonComponent extends NgtControlValueAccessor {
         this.helperReverseYPosition = input(false);
         this.helperAutoXReverse = input(true);
         /** Behavior Inputs */
+        this.id = input();
         this.isSelectable = input(true);
         this.isDisabled = input(false);
         /** Outputs */
@@ -11526,7 +11563,7 @@ class NgtReactiveRadioButtonComponent extends NgtControlValueAccessor {
         this.subscriptions = [];
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgtReactiveRadioButtonComponent, deps: [{ token: NgtStylizableDirective, optional: true, self: true }, { token: NgtReactiveFormComponent, optional: true, skipSelf: true }, { token: NgtSectionComponent, optional: true, skipSelf: true }, { token: NgtModalComponent, optional: true, skipSelf: true }, { token: NgtReactiveRadioButtonContainerComponent, optional: true, skipSelf: true }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: NgtReactiveRadioButtonComponent, isStandalone: true, selector: "ngt-reactive-radio-button", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, shining: { classPropertyName: "shining", publicName: "shining", isSignal: true, isRequired: false, transformFunction: null }, selectedHexColor: { classPropertyName: "selectedHexColor", publicName: "selectedHexColor", isSignal: true, isRequired: false, transformFunction: null }, helpTitle: { classPropertyName: "helpTitle", publicName: "helpTitle", isSignal: true, isRequired: false, transformFunction: null }, helpTextColor: { classPropertyName: "helpTextColor", publicName: "helpTextColor", isSignal: true, isRequired: false, transformFunction: null }, helpText: { classPropertyName: "helpText", publicName: "helpText", isSignal: true, isRequired: false, transformFunction: null }, helperReverseYPosition: { classPropertyName: "helperReverseYPosition", publicName: "helperReverseYPosition", isSignal: true, isRequired: false, transformFunction: null }, helperAutoXReverse: { classPropertyName: "helperAutoXReverse", publicName: "helperAutoXReverse", isSignal: true, isRequired: false, transformFunction: null }, isSelectable: { classPropertyName: "isSelectable", publicName: "isSelectable", isSignal: true, isRequired: false, transformFunction: null }, isDisabled: { classPropertyName: "isDisabled", publicName: "isDisabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onValueChange: "onValueChange" }, providers: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: NgtReactiveRadioButtonComponent, isStandalone: true, selector: "ngt-reactive-radio-button", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, shining: { classPropertyName: "shining", publicName: "shining", isSignal: true, isRequired: false, transformFunction: null }, selectedHexColor: { classPropertyName: "selectedHexColor", publicName: "selectedHexColor", isSignal: true, isRequired: false, transformFunction: null }, helpTitle: { classPropertyName: "helpTitle", publicName: "helpTitle", isSignal: true, isRequired: false, transformFunction: null }, helpTextColor: { classPropertyName: "helpTextColor", publicName: "helpTextColor", isSignal: true, isRequired: false, transformFunction: null }, helpText: { classPropertyName: "helpText", publicName: "helpText", isSignal: true, isRequired: false, transformFunction: null }, helperReverseYPosition: { classPropertyName: "helperReverseYPosition", publicName: "helperReverseYPosition", isSignal: true, isRequired: false, transformFunction: null }, helperAutoXReverse: { classPropertyName: "helperAutoXReverse", publicName: "helperAutoXReverse", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, isSelectable: { classPropertyName: "isSelectable", publicName: "isSelectable", isSignal: true, isRequired: false, transformFunction: null }, isDisabled: { classPropertyName: "isDisabled", publicName: "isDisabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onValueChange: "onValueChange" }, providers: [
             NgtValueAccessorProvider(NgtReactiveRadioButtonComponent),
         ], viewQueries: [{ propertyName: "radioBtnElement", first: true, predicate: ["radioBtnElement"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<label [class]=\"labelClasses()\">\n    <input class=\"hidden\" type=\"radio\" [disabled]='isDisabledState() || !isSelectable()' (change)=\"onNativeChange()\"\n        #radioBtnElement>\n\n    <div [class]=\"radioClasses()\" [style]=\"radioStyle()\">\n        <div style=\"width: 14px; height: 14px;\">\n            @if (currentValue()) {\n                <svg class=\"fill-current\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 29.107 29.107\">\n                    <path\n                        d=\"M14.554 0C6.561 0 0 6.562 0 14.552c0 7.996 6.561 14.555 14.554 14.555 7.996 0 14.553-6.559 14.553-14.555C29.106 6.562 22.55 0 14.554 0z\" />\n                </svg>\n            }\n        </div>\n    </div>\n\n    @if (label() && !isShining()) {\n        <span class=\"text-xs ml-2\" [class.line-through]='!isSelectable()'>\n            {{ label() }}\n        </span>\n    }\n\n    @if (helpText()) {\n        <ngt-helper class=\"ml-1\" [helpTitle]=\"helpTitle()\" [iconColor]=\"helpTextColor()\"\n            [autoXReverse]=\"helperAutoXReverse()\" [helperReverseYPosition]=\"helperReverseYPosition()\">\n            {{ helpText() }}\n        </ngt-helper>\n    }\n</label>\n\n@if (isShining()) {\n    <div class=\"flex\">\n        <ngt-shining class=\"w-16 h-12\"></ngt-shining>\n    </div>\n}", styles: ["label{margin-bottom:unset!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: NgtShiningModule }, { kind: "component", type: NgtShiningComponent, selector: "ngt-shining", inputs: ["shiningWidth"] }, { kind: "ngmodule", type: NgtSvgModule }, { kind: "component", type: NgtHelperComponent, selector: "ngt-helper", inputs: ["helpTextColor", "helpText", "helpTitle", "icon", "iconSize", "iconColor", "iconTitle", "tooltipSize", "autoXReverse", "helperReverseYPosition"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
@@ -11943,6 +11980,7 @@ class NgtReactiveDropzoneComponent extends NgtControlValueAccessor {
         if (this.hasChangesBetweenValues(this.value, this.stateService.nativeValue())) {
             this.onTouched();
             this.value = this.stateService.nativeValue();
+            this.onValueChange.emit(value);
         }
     }
     change(value) {
@@ -11951,11 +11989,6 @@ class NgtReactiveDropzoneComponent extends NgtControlValueAccessor {
             if (this.hasChangesBetweenValues(this.value, this.stateService.nativeValue())) {
                 this.onNativeChange(value);
             }
-            if (this.formControl
-                && this.hasChangesBetweenValues(this.value, this.formControl.value)) {
-                this.formControl.setValue(value);
-                this.onValueChange.emit(value);
-            }
             if (this.stateService.componentReady()) {
                 this.loadFilePreview(value);
             }
@@ -12062,7 +12095,7 @@ class NgtReactiveDropzoneComponent extends NgtControlValueAccessor {
         }
     }
     hasChangesBetweenValues(a, b) {
-        return JSON.stringify(a) !== JSON.stringify(b);
+        return JSON.stringify(a ?? null) !== JSON.stringify(b ?? null);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgtReactiveDropzoneComponent, deps: [{ token: NgtReactiveFormComponent, optional: true, skipSelf: true }, { token: NgtSectionComponent, optional: true, skipSelf: true }, { token: NgtModalComponent, optional: true, skipSelf: true }, { token: NgtReactiveDropzoneValidationService }, { token: NgtReactiveDropzoneFileService }, { token: NgtReactiveDropzoneErrorService }, { token: NgtReactiveDropzoneViewerService }, { token: NgtReactiveDropzoneStateService }, { token: i0.ChangeDetectorRef }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: NgtReactiveDropzoneComponent, isStandalone: true, selector: "ngt-reactive-dropzone", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, helpTextColor: { classPropertyName: "helpTextColor", publicName: "helpTextColor", isSignal: true, isRequired: false, transformFunction: null }, helpText: { classPropertyName: "helpText", publicName: "helpText", isSignal: true, isRequired: false, transformFunction: null }, helpTitle: { classPropertyName: "helpTitle", publicName: "helpTitle", isSignal: true, isRequired: false, transformFunction: null }, resources: { classPropertyName: "resources", publicName: "resources", isSignal: true, isRequired: false, transformFunction: null }, multipleSelection: { classPropertyName: "multipleSelection", publicName: "multipleSelection", isSignal: true, isRequired: false, transformFunction: null }, itemsLimit: { classPropertyName: "itemsLimit", publicName: "itemsLimit", isSignal: true, isRequired: false, transformFunction: null }, showFileName: { classPropertyName: "showFileName", publicName: "showFileName", isSignal: true, isRequired: false, transformFunction: null }, disableClick: { classPropertyName: "disableClick", publicName: "disableClick", isSignal: true, isRequired: false, transformFunction: null }, isDisabled: { classPropertyName: "isDisabled", publicName: "isDisabled", isSignal: true, isRequired: false, transformFunction: null }, viewMode: { classPropertyName: "viewMode", publicName: "viewMode", isSignal: true, isRequired: false, transformFunction: null }, removable: { classPropertyName: "removable", publicName: "removable", isSignal: true, isRequired: false, transformFunction: null }, canDownloadFile: { classPropertyName: "canDownloadFile", publicName: "canDownloadFile", isSignal: true, isRequired: false, transformFunction: null }, verticalExpandable: { classPropertyName: "verticalExpandable", publicName: "verticalExpandable", isSignal: true, isRequired: false, transformFunction: null }, hideNgxDropzone: { classPropertyName: "hideNgxDropzone", publicName: "hideNgxDropzone", isSignal: true, isRequired: false, transformFunction: null }, acceptedFiles: { classPropertyName: "acceptedFiles", publicName: "acceptedFiles", isSignal: true, isRequired: false, transformFunction: null }, unacceptedFiles: { classPropertyName: "unacceptedFiles", publicName: "unacceptedFiles", isSignal: true, isRequired: false, transformFunction: null }, maxFileSize: { classPropertyName: "maxFileSize", publicName: "maxFileSize", isSignal: true, isRequired: false, transformFunction: null }, previewType: { classPropertyName: "previewType", publicName: "previewType", isSignal: true, isRequired: false, transformFunction: null }, remoteResource: { classPropertyName: "remoteResource", publicName: "remoteResource", isSignal: true, isRequired: false, transformFunction: null }, isRequired: { classPropertyName: "isRequired", publicName: "isRequired", isSignal: true, isRequired: false, transformFunction: null }, customSyncValidators: { classPropertyName: "customSyncValidators", publicName: "customSyncValidators", isSignal: true, isRequired: false, transformFunction: null }, customAsyncValidators: { classPropertyName: "customAsyncValidators", publicName: "customAsyncValidators", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onFileSelected: "onFileSelected", onFileSelectError: "onFileSelectError", onFileUploadFail: "onFileUploadFail", onFileRemoved: "onFileRemoved", onFileUploadInit: "onFileUploadInit", onFileUploaded: "onFileUploaded", onFilePreviewLoaded: "onFilePreviewLoaded", onValueChange: "onValueChange" }, providers: [
@@ -12223,5 +12256,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { NgtAbilityValidationService, NgtActionComponent, NgtActionModule, NgtAttachmentHttpService, NgtButtonComponent, NgtButtonModule, NgtCheckboxComponent, NgtCheckboxMode, NgtCheckboxModule, NgtCheckedElement, NgtContentComponent, NgtContentModule, NgtContextMenuComponent, NgtContextMenuDirective, NgtContextMenuModule, NgtCustomFilter, NgtDatatableComponent, NgtDatatableModule, NgtDatatableParam, NgtDatatableSearchType, NgtDatatableType, NgtDateComponent, NgtDateLocale, NgtDateMode, NgtDateModule, NgtDropdownComponent, NgtDropdownContainerComponent, NgtDropdownOpenMethod, NgtDropzoneComponent, NgtDropzoneErrorType, NgtDropzoneFileTypeEnum, NgtDropzoneModule, NgtDropzonePreviewType, NgtFloatingButtonComponent, NgtFloatingButtonModule, NgtFloatingButtonType, NgtFormComponent, NgtFormModule, NgtFormState, NgtFormValidationMessageComponent, NgtHeaderNavComponent, NgtHeaderNavModule, NgtHelperComponent, NgtHttpFormService, NgtHttpResourceService, NgtHttpService, NgtHttpValidationService, NgtInputComponent, NgtInputModule, NgtModalBodyComponent, NgtModalComponent, NgtModalFooterComponent, NgtModalHeaderComponent, NgtModalModule, NgtMultiSelectComponent, NgtMultiSelectModule, NgtPaginationComponent, NgtPaginationModule, NgtPopoverComponent, NgtPopoverDirective, NgtPopoverModule, NgtPopoverOpenMethod, NgtPortletBodyComponent, NgtPortletComponent, NgtPortletFooterComponent, NgtPortletHeaderComponent, NgtPortletModule, NgtRadioButtonComponent, NgtRadioButtonContainerComponent, NgtRadioButtonModule, NgtReactFormState, NgtReactSelectDropdownPanelHeight, NgtReactiveCheckboxComponent, NgtReactiveCheckboxMode, NgtReactiveDateComponent, NgtReactiveDateLocale, NgtReactiveDateMode, NgtReactiveDropzoneComponent, NgtReactiveFormComponent, NgtReactiveInputComponent, NgtReactiveRadioButtonComponent, NgtReactiveRadioButtonContainerComponent, NgtReactiveSelectComponent, NgtReactiveSelectHeaderTemplate, NgtReactiveSelectOptionSelectedTemplate, NgtReactiveSelectOptionTemplate, NgtReactiveSliderColorSchemeEnum, NgtReactiveSliderComponent, NgtReactiveTextareaComponent, NgtSectionComponent, NgtSectionModule, NgtSelectComponent, NgtSelectDropdownPanelHeight, NgtSelectHeaderTmp, NgtSelectModule, NgtSelectOptionSelectedTmp, NgtSelectOptionTmp, NgtShiningComponent, NgtShiningModule, NgtShiningWidth, NgtSidenavComponent, NgtSidenavModule, NgtSliderColorSchemeEnum, NgtSliderComponent, NgtSliderModule, NgtStylizableDirective, NgtStylizableModule, NgtSvgComponent, NgtSvgModule, NgtTagComponent, NgtTagModule, NgtTbodyComponent, NgtTdCheckComponent, NgtTdComponent, NgtTextareaComponent, NgtTextareaModule, NgtThCheckComponent, NgtThComponent, NgtTheadComponent, NgtTrComponent, NgtTranslateService, Size, fadeDownAnimation, fadeUpAnimation, slideLeftToRightAnimation, slideRightToLeftAnimation };
+export { NgtAbilityValidationService, NgtActionComponent, NgtActionModule, NgtAttachmentHttpService, NgtButtonComponent, NgtButtonModule, NgtCheckboxComponent, NgtCheckboxMode, NgtCheckboxModule, NgtCheckedElement, NgtContentComponent, NgtContentModule, NgtContextMenuComponent, NgtContextMenuDirective, NgtContextMenuModule, NgtCustomFilter, NgtDatatableComponent, NgtDatatableModule, NgtDatatableParam, NgtDatatableSearchType, NgtDatatableType, NgtDateComponent, NgtDateLocale, NgtDateMode, NgtDateModule, NgtDropdownComponent, NgtDropdownContainerComponent, NgtDropdownOpenMethod, NgtDropzoneComponent, NgtDropzoneErrorType, NgtDropzoneFileTypeEnum, NgtDropzoneModule, NgtDropzonePreviewType, NgtFloatingButtonComponent, NgtFloatingButtonModule, NgtFloatingButtonType, NgtFormComponent, NgtFormModule, NgtFormState, NgtFormValidationMessageComponent, NgtHeaderNavComponent, NgtHeaderNavModule, NgtHelperComponent, NgtHttpFormService, NgtHttpResourceService, NgtHttpService, NgtHttpValidationService, NgtInputComponent, NgtInputModule, NgtModalBodyComponent, NgtModalComponent, NgtModalFooterComponent, NgtModalHeaderComponent, NgtModalModule, NgtMultiSelectComponent, NgtMultiSelectModule, NgtPaginationComponent, NgtPaginationModule, NgtPopoverComponent, NgtPopoverDirective, NgtPopoverModule, NgtPopoverOpenMethod, NgtPortletBodyComponent, NgtPortletComponent, NgtPortletFooterComponent, NgtPortletHeaderComponent, NgtPortletModule, NgtRadioButtonComponent, NgtRadioButtonContainerComponent, NgtRadioButtonModule, NgtReactFormState, NgtReactSelectDropdownPanelHeight, NgtReactiveCheckboxComponent, NgtReactiveCheckboxMode, NgtReactiveDateComponent, NgtReactiveDateLocale, NgtReactiveDateMode, NgtReactiveDropzoneComponent, NgtReactiveFormComponent, NgtReactiveInputComponent, NgtReactiveRadioButtonComponent, NgtReactiveRadioButtonContainerComponent, NgtReactiveSelectComponent, NgtReactiveSelectHeaderTemplate, NgtReactiveSelectModule, NgtReactiveSelectOptionSelectedTemplate, NgtReactiveSelectOptionTemplate, NgtReactiveSliderColorSchemeEnum, NgtReactiveSliderComponent, NgtReactiveTextareaComponent, NgtSectionComponent, NgtSectionModule, NgtSelectComponent, NgtSelectDropdownPanelHeight, NgtSelectHeaderTmp, NgtSelectModule, NgtSelectOptionSelectedTmp, NgtSelectOptionTmp, NgtShiningComponent, NgtShiningModule, NgtShiningWidth, NgtSidenavComponent, NgtSidenavModule, NgtSliderColorSchemeEnum, NgtSliderComponent, NgtSliderModule, NgtStylizableDirective, NgtStylizableModule, NgtSvgComponent, NgtSvgModule, NgtTagComponent, NgtTagModule, NgtTbodyComponent, NgtTdCheckComponent, NgtTdComponent, NgtTextareaComponent, NgtTextareaModule, NgtThCheckComponent, NgtThComponent, NgtTheadComponent, NgtTrComponent, NgtTranslateService, Size, fadeDownAnimation, fadeUpAnimation, slideLeftToRightAnimation, slideRightToLeftAnimation };
 //# sourceMappingURL=ng-tailwind.mjs.map