@indigina/ui-kit 1.1.143 → 1.1.144

package/fesm2022/indigina-ui-kit.mjs

@@ -3,7 +3,7 @@ import { Component, ChangeDetectionStrategy, Input, input, EventEmitter, ViewEnc
 import * as i1 from '@progress/kendo-angular-buttons';
 import { ButtonModule, ButtonGroupModule } from '@progress/kendo-angular-buttons';
 import * as i1$1 from '@angular/common';
-import { CommonModule, NgClass, DOCUMENT, NgTemplateOutlet, DatePipe, TitleCasePipe, AsyncPipe, SlicePipe, DecimalPipe } from '@angular/common';
+import { CommonModule, NgClass, DOCUMENT, NgTemplateOutlet, DatePipe, TitleCasePipe, AsyncPipe, DecimalPipe } from '@angular/common';
 import * as i1$2 from '@progress/kendo-angular-label';
 import { LabelModule } from '@progress/kendo-angular-label';
 import { TooltipDirective, TooltipSettings } from '@progress/kendo-angular-tooltip';
@@ -7400,12 +7400,16 @@ class KitFilterCheckboxComponent {
         return !!this.popup()?.isPopupOpen;
     }
     get checkedItems() {
-        return this.items().filter(item => item.checked).map(item => item.value);
+        return this.items().filter(item => item.checked);
+    }
+    get displayedValues() {
+        return (this.isPopupOpen ? this.checkedItems : this.selectedValues()).map(item => item.title);
     }
     constructor() {
         this.filter = input.required();
         this.translateKeyPrefix = input('');
         this.items = model([]);
+        this.showPopupOnInit = input(true);
         this.filterRemoved = output();
         this.filterChanged = output();
         this.anchor = viewChild.required('toggleButton', { read: ElementRef });
@@ -7421,7 +7425,15 @@ class KitFilterCheckboxComponent {
     ngOnInit() {
         this.initializeSelectedValues();
         this.updateItemsState();
-        this.showPopupOnInit();
+        if (this.showPopupOnInit() && !this.selectedValues().length) {
+            requestAnimationFrame(() => this.onPopupToggle());
+        }
+    }
+    ngOnChanges({ filter }) {
+        if (!filter.isFirstChange()) {
+            this.initializeSelectedValues();
+            this.updateItemsState();
+        }
     }
     removeFilter() {
         this.popup()?.close();
@@ -7437,7 +7449,7 @@ class KitFilterCheckboxComponent {
         })));
     }
     applyFilter() {
-        const checkedValues = this.items().filter(item => item.checked).map(item => item.value);
+        const checkedValues = this.checkedItems.map(item => item.value);
         const checked = {
             logic: KitFilterLogic.OR,
             filters: checkedValues.map(value => ({
@@ -7447,7 +7459,7 @@ class KitFilterCheckboxComponent {
             })),
         };
         this.filterChanged.emit(checked);
-        this.selectedValues.set(checkedValues);
+        this.selectedValues.set(this.checkedItems);
     }
     onPopupToggle() {
         requestAnimationFrame(() => this.popup()?.toggle());
@@ -7471,21 +7483,19 @@ class KitFilterCheckboxComponent {
         this.items.set([...this.items()]);
     }
     initializeSelectedValues() {
-        this.selectedValues.set(this.filter().value?.filters.map(item => item.value) ?? []);
+        this.selectedValues.set(this.filter().value?.filters.map(filter => ({
+            title: this.items().find(item => item.value === filter.value)?.title ?? filter.value,
+            value: filter.value,
+        })) ?? []);
     }
     updateItemsState() {
         this.items.update(items => items.map(item => ({
             ...item,
-            checked: this.selectedValues().includes(item.value) ?? false,
+            checked: this.selectedValues().some(selectedValue => selectedValue.value === item.value) ?? false,
         })));
     }
-    showPopupOnInit() {
-        if (!this.selectedValues().length) {
-            requestAnimationFrame(() => this.onPopupToggle());
-        }
-    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.4", ngImport: i0, type: KitFilterCheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.4", type: KitFilterCheckboxComponent, isStandalone: true, selector: "kit-filter-checkbox", inputs: { filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: true, transformFunction: null }, translateKeyPrefix: { classPropertyName: "translateKeyPrefix", publicName: "translateKeyPrefix", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { items: "itemsChange", filterRemoved: "filterRemoved", filterChanged: "filterChanged" }, viewQueries: [{ propertyName: "anchor", first: true, predicate: ["toggleButton"], descendants: true, read: ElementRef, isSignal: true }, { propertyName: "popup", first: true, predicate: ["popup"], descendants: true, read: KitPopupComponent, isSignal: true }], ngImport: i0, template: "<div class=\"kit-filter-checkbox\">\n  <kit-pill #toggleButton\n            [selectable]=\"!filter().readonly\"\n            [selected]=\"popup.isPopupOpen\"\n            [removable]=\"!filter().readonly\"\n            [theme]=\"filter().readonly && kitPillTheme.BLUE || kitPillTheme.DEFAULT\"\n            (removed)=\"removeFilter()\"\n            (clicked)=\"onPopupToggle()\">\n    {{ filter().title | translate }}:\n    @if (allSelected()) {\n      <div class=\"tooltip\"\n           kitTooltip\n           kitTooltipFilter=\".tooltip\"\n           [kitTooltipPosition]=\"kitTooltipPosition.RIGHT\"\n           [kitTooltipTemplateRef]=\"tooltipTemplateAllValues\">\n        {{ 'kit.filters.all' | translate }}\n      </div>\n    } @else {\n      @if (!isPopupOpen && selectedValues().length) {\n        @if (selectedValues().length > 1) {\n          <div class=\"tooltip\"\n               kitTooltip\n               kitTooltipFilter=\".tooltip\"\n               [kitTooltipPosition]=\"kitTooltipPosition.RIGHT\"\n               [kitTooltipTemplateRef]=\"tooltipTemplate\">\n            {{ buildTranslateKey(selectedValues()[0]) | translate }}\n            <span class=\"tooltip-count\">+{{ selectedValues().length - 1 }}</span>\n          </div>\n        } @else {\n          {{ buildTranslateKey(selectedValues()[0]) | translate }}\n        }\n      } @else if (isPopupOpen && checkedItems.length) {\n        @if (checkedItems.length > 1) {\n          <div class=\"tooltip\"\n               kitTooltip\n               kitTooltipFilter=\".tooltip\"\n               [kitTooltipPosition]=\"kitTooltipPosition.RIGHT\"\n               [kitTooltipTemplateRef]=\"tooltipTemplate\">\n            {{ buildTranslateKey(checkedItems[0]) | translate }}\n            <span class=\"tooltip-count\">+{{ checkedItems.length - 1 }}</span>\n          </div>\n        } @else {\n          {{ buildTranslateKey(checkedItems[0]) | translate }}\n        }\n      }\n    }\n  </kit-pill>\n</div>\n\n<kit-popup #popup\n           popupClass=\"kit-filter-checkbox-popup\"\n           [anchor]=\"anchor()\"\n           [content]=\"content\"\n           [showFooter]=\"true\"\n           [applyButtonLabel]=\"'kit.filters.apply' | translate\"\n           [cancelButtonLabel]=\"'kit.filters.clear' | translate\"\n           [isApplyButtonDisabled]=\"applyButtonDisabled()\"\n           [closePopupOnCancel]=\"false\"\n           (onApply)=\"applyFilter()\"\n           (onCancel)=\"clearAllFilters()\"\n           (onClose)=\"close()\">\n</kit-popup>\n\n<ng-template #content>\n  <div class=\"popup-content\">\n    <kit-checkbox class=\"checkbox-item\"\n                  [label]=\"'kit.filters.all' | translate\"\n                  [(ngModel)]=\"allSelected\"\n                  (changed)=\"toggleAll($event)\">\n    </kit-checkbox>\n\n    @for (item of items(); track $index) {\n      <kit-checkbox class=\"checkbox-item\"\n                    [label]=\"buildTranslateKey(item.title) | translate\"\n                    [(ngModel)]=\"item.checked\"\n                    (changed)=\"onChange()\"\n      ></kit-checkbox>\n    }\n  </div>\n</ng-template>\n\n<ng-template #tooltipTemplate>\n  @for (item of selectedValues() | slice: 1; track item) {\n    <div class=\"tooltip-item\">{{ buildTranslateKey(item) | translate }}</div>\n  }\n</ng-template>\n\n<ng-template #tooltipTemplateAllValues>\n  @for (item of selectedValues(); track item) {\n    <div class=\"tooltip-item\">{{ buildTranslateKey(item) | translate }}</div>\n  }\n</ng-template>\n", styles: [".kit-filter-checkbox .tooltip-count{color:var(--ui-kit-color-main)}.kit-filter-checkbox .tooltip-item{color:var(--ui-kit-color-grey-10);font-size:12px;font-weight:500;line-height:20px}::ng-deep .kit-filter-checkbox-popup .popup-content{width:172px}::ng-deep .kit-filter-checkbox-popup .checkbox-item{display:block;padding:6px 0}\n"], dependencies: [{ kind: "component", type: KitPillComponent, selector: "kit-pill", inputs: ["removable", "selectable", "selected", "type", "theme", "icon", "iconType"], outputs: ["clicked", "removed"] }, { kind: "ngmodule", type: KitTextboxModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$9.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: KitCheckboxModule }, { kind: "component", type: KitCheckboxComponent, selector: "kit-checkbox", inputs: ["label", "disabled", "checked", "readonly", "state", "messageIcon", "messageText"], outputs: ["changed"] }, { kind: "directive", type: KitTooltipDirective, selector: "[kitTooltip]", inputs: ["kitTooltipPosition", "kitTooltipFilter", "kitTooltipTemplateRef", "kitTooltipVisible"] }, { kind: "pipe", type: SlicePipe, name: "slice" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: KitPopupComponent, selector: "kit-popup", inputs: ["anchor", "content", "closeOnOutsideClick", "showFooter", "cancelButtonLabel", "applyButtonLabel", "isApplyButtonDisabled", "positionMode", "popupClass", "closePopupOnCancel"], outputs: ["onCancel", "onApply", "onOpen", "onClose"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.4", type: KitFilterCheckboxComponent, isStandalone: true, selector: "kit-filter-checkbox", inputs: { filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: true, transformFunction: null }, translateKeyPrefix: { classPropertyName: "translateKeyPrefix", publicName: "translateKeyPrefix", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, showPopupOnInit: { classPropertyName: "showPopupOnInit", publicName: "showPopupOnInit", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { items: "itemsChange", filterRemoved: "filterRemoved", filterChanged: "filterChanged" }, viewQueries: [{ propertyName: "anchor", first: true, predicate: ["toggleButton"], descendants: true, read: ElementRef, isSignal: true }, { propertyName: "popup", first: true, predicate: ["popup"], descendants: true, read: KitPopupComponent, isSignal: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"kit-filter-checkbox\">\n  <kit-pill #toggleButton\n            [selectable]=\"!filter().readonly\"\n            [selected]=\"popup.isPopupOpen\"\n            [removable]=\"!filter().readonly\"\n            [theme]=\"filter().readonly && kitPillTheme.BLUE || kitPillTheme.DEFAULT\"\n            (removed)=\"removeFilter()\"\n            (clicked)=\"onPopupToggle()\">\n    {{ filter().title | translate }}:\n    @if (allSelected()) {\n      <div class=\"tooltip\"\n           kitTooltip\n           kitTooltipFilter=\".tooltip\"\n           [kitTooltipPosition]=\"kitTooltipPosition.RIGHT\"\n           [kitTooltipTemplateRef]=\"tooltipTemplate\">\n        {{ 'kit.filters.all' | translate }}\n      </div>\n    } @else if (displayedValues.length > 1) {\n      <div class=\"tooltip\"\n           kitTooltip\n           kitTooltipFilter=\".tooltip\"\n           [kitTooltipPosition]=\"kitTooltipPosition.RIGHT\"\n           [kitTooltipTemplateRef]=\"tooltipTemplate\">\n        {{ buildTranslateKey(displayedValues[0]) | translate }}\n        <span class=\"tooltip-count\">+{{ displayedValues.length - 1 }}</span>\n      </div>\n    } @else {\n      {{ displayedValues[0] ? ((displayedValues[0] ?? '') | translate) : '' }}\n    }\n  </kit-pill>\n</div>\n\n<kit-popup #popup\n           popupClass=\"kit-filter-checkbox-popup\"\n           [anchor]=\"anchor()\"\n           [content]=\"content\"\n           [showFooter]=\"true\"\n           [applyButtonLabel]=\"'kit.filters.apply' | translate\"\n           [cancelButtonLabel]=\"'kit.filters.clear' | translate\"\n           [isApplyButtonDisabled]=\"applyButtonDisabled()\"\n           [closePopupOnCancel]=\"false\"\n           (onApply)=\"applyFilter()\"\n           (onCancel)=\"clearAllFilters()\"\n           (onClose)=\"close()\">\n</kit-popup>\n\n<ng-template #content>\n  <div class=\"popup-content\">\n    <kit-checkbox class=\"checkbox-item\"\n                  [label]=\"'kit.filters.all' | translate\"\n                  [(ngModel)]=\"allSelected\"\n                  (changed)=\"toggleAll($event)\">\n    </kit-checkbox>\n\n    @for (item of items(); track $index) {\n      <kit-checkbox class=\"checkbox-item\"\n                    [label]=\"buildTranslateKey(item.title) | translate\"\n                    [(ngModel)]=\"item.checked\"\n                    (changed)=\"onChange()\"\n      ></kit-checkbox>\n    }\n  </div>\n</ng-template>\n\n<ng-template #tooltipTemplate>\n  @for (item of (displayedValues.length > 1 && !allSelected() ? displayedValues.slice(1) : displayedValues); track item) {\n    <div class=\"tooltip-item\">{{ buildTranslateKey(item) | translate }}</div>\n  }\n</ng-template>\n", styles: [".kit-filter-checkbox .tooltip-count{color:var(--ui-kit-color-main)}.kit-filter-checkbox .tooltip-item{color:var(--ui-kit-color-grey-10);font-size:12px;font-weight:500;line-height:20px}::ng-deep .kit-filter-checkbox-popup .popup-content{width:172px}::ng-deep .kit-filter-checkbox-popup .checkbox-item{display:block;padding:6px 0}\n"], dependencies: [{ kind: "component", type: KitPillComponent, selector: "kit-pill", inputs: ["removable", "selectable", "selected", "type", "theme", "icon", "iconType"], outputs: ["clicked", "removed"] }, { kind: "ngmodule", type: KitTextboxModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$9.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: KitCheckboxModule }, { kind: "component", type: KitCheckboxComponent, selector: "kit-checkbox", inputs: ["label", "disabled", "checked", "readonly", "state", "messageIcon", "messageText"], outputs: ["changed"] }, { kind: "directive", type: KitTooltipDirective, selector: "[kitTooltip]", inputs: ["kitTooltipPosition", "kitTooltipFilter", "kitTooltipTemplateRef", "kitTooltipVisible"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: KitPopupComponent, selector: "kit-popup", inputs: ["anchor", "content", "closeOnOutsideClick", "showFooter", "cancelButtonLabel", "applyButtonLabel", "isApplyButtonDisabled", "positionMode", "popupClass", "closePopupOnCancel"], outputs: ["onCancel", "onApply", "onOpen", "onClose"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.4", ngImport: i0, type: KitFilterCheckboxComponent, decorators: [{
             type: Component,
@@ -7495,10 +7505,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.4", ngImpor
                         TranslateModule,
                         KitCheckboxModule,
                         KitTooltipDirective,
-                        SlicePipe,
                         FormsModule,
                         KitPopupComponent,
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"kit-filter-checkbox\">\n  <kit-pill #toggleButton\n            [selectable]=\"!filter().readonly\"\n            [selected]=\"popup.isPopupOpen\"\n            [removable]=\"!filter().readonly\"\n            [theme]=\"filter().readonly && kitPillTheme.BLUE || kitPillTheme.DEFAULT\"\n            (removed)=\"removeFilter()\"\n            (clicked)=\"onPopupToggle()\">\n    {{ filter().title | translate }}:\n    @if (allSelected()) {\n      <div class=\"tooltip\"\n           kitTooltip\n           kitTooltipFilter=\".tooltip\"\n           [kitTooltipPosition]=\"kitTooltipPosition.RIGHT\"\n           [kitTooltipTemplateRef]=\"tooltipTemplateAllValues\">\n        {{ 'kit.filters.all' | translate }}\n      </div>\n    } @else {\n      @if (!isPopupOpen && selectedValues().length) {\n        @if (selectedValues().length > 1) {\n          <div class=\"tooltip\"\n               kitTooltip\n               kitTooltipFilter=\".tooltip\"\n               [kitTooltipPosition]=\"kitTooltipPosition.RIGHT\"\n               [kitTooltipTemplateRef]=\"tooltipTemplate\">\n            {{ buildTranslateKey(selectedValues()[0]) | translate }}\n            <span class=\"tooltip-count\">+{{ selectedValues().length - 1 }}</span>\n          </div>\n        } @else {\n          {{ buildTranslateKey(selectedValues()[0]) | translate }}\n        }\n      } @else if (isPopupOpen && checkedItems.length) {\n        @if (checkedItems.length > 1) {\n          <div class=\"tooltip\"\n               kitTooltip\n               kitTooltipFilter=\".tooltip\"\n               [kitTooltipPosition]=\"kitTooltipPosition.RIGHT\"\n               [kitTooltipTemplateRef]=\"tooltipTemplate\">\n            {{ buildTranslateKey(checkedItems[0]) | translate }}\n            <span class=\"tooltip-count\">+{{ checkedItems.length - 1 }}</span>\n          </div>\n        } @else {\n          {{ buildTranslateKey(checkedItems[0]) | translate }}\n        }\n      }\n    }\n  </kit-pill>\n</div>\n\n<kit-popup #popup\n           popupClass=\"kit-filter-checkbox-popup\"\n           [anchor]=\"anchor()\"\n           [content]=\"content\"\n           [showFooter]=\"true\"\n           [applyButtonLabel]=\"'kit.filters.apply' | translate\"\n           [cancelButtonLabel]=\"'kit.filters.clear' | translate\"\n           [isApplyButtonDisabled]=\"applyButtonDisabled()\"\n           [closePopupOnCancel]=\"false\"\n           (onApply)=\"applyFilter()\"\n           (onCancel)=\"clearAllFilters()\"\n           (onClose)=\"close()\">\n</kit-popup>\n\n<ng-template #content>\n  <div class=\"popup-content\">\n    <kit-checkbox class=\"checkbox-item\"\n                  [label]=\"'kit.filters.all' | translate\"\n                  [(ngModel)]=\"allSelected\"\n                  (changed)=\"toggleAll($event)\">\n    </kit-checkbox>\n\n    @for (item of items(); track $index) {\n      <kit-checkbox class=\"checkbox-item\"\n                    [label]=\"buildTranslateKey(item.title) | translate\"\n                    [(ngModel)]=\"item.checked\"\n                    (changed)=\"onChange()\"\n      ></kit-checkbox>\n    }\n  </div>\n</ng-template>\n\n<ng-template #tooltipTemplate>\n  @for (item of selectedValues() | slice: 1; track item) {\n    <div class=\"tooltip-item\">{{ buildTranslateKey(item) | translate }}</div>\n  }\n</ng-template>\n\n<ng-template #tooltipTemplateAllValues>\n  @for (item of selectedValues(); track item) {\n    <div class=\"tooltip-item\">{{ buildTranslateKey(item) | translate }}</div>\n  }\n</ng-template>\n", styles: [".kit-filter-checkbox .tooltip-count{color:var(--ui-kit-color-main)}.kit-filter-checkbox .tooltip-item{color:var(--ui-kit-color-grey-10);font-size:12px;font-weight:500;line-height:20px}::ng-deep .kit-filter-checkbox-popup .popup-content{width:172px}::ng-deep .kit-filter-checkbox-popup .checkbox-item{display:block;padding:6px 0}\n"] }]
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"kit-filter-checkbox\">\n  <kit-pill #toggleButton\n            [selectable]=\"!filter().readonly\"\n            [selected]=\"popup.isPopupOpen\"\n            [removable]=\"!filter().readonly\"\n            [theme]=\"filter().readonly && kitPillTheme.BLUE || kitPillTheme.DEFAULT\"\n            (removed)=\"removeFilter()\"\n            (clicked)=\"onPopupToggle()\">\n    {{ filter().title | translate }}:\n    @if (allSelected()) {\n      <div class=\"tooltip\"\n           kitTooltip\n           kitTooltipFilter=\".tooltip\"\n           [kitTooltipPosition]=\"kitTooltipPosition.RIGHT\"\n           [kitTooltipTemplateRef]=\"tooltipTemplate\">\n        {{ 'kit.filters.all' | translate }}\n      </div>\n    } @else if (displayedValues.length > 1) {\n      <div class=\"tooltip\"\n           kitTooltip\n           kitTooltipFilter=\".tooltip\"\n           [kitTooltipPosition]=\"kitTooltipPosition.RIGHT\"\n           [kitTooltipTemplateRef]=\"tooltipTemplate\">\n        {{ buildTranslateKey(displayedValues[0]) | translate }}\n        <span class=\"tooltip-count\">+{{ displayedValues.length - 1 }}</span>\n      </div>\n    } @else {\n      {{ displayedValues[0] ? ((displayedValues[0] ?? '') | translate) : '' }}\n    }\n  </kit-pill>\n</div>\n\n<kit-popup #popup\n           popupClass=\"kit-filter-checkbox-popup\"\n           [anchor]=\"anchor()\"\n           [content]=\"content\"\n           [showFooter]=\"true\"\n           [applyButtonLabel]=\"'kit.filters.apply' | translate\"\n           [cancelButtonLabel]=\"'kit.filters.clear' | translate\"\n           [isApplyButtonDisabled]=\"applyButtonDisabled()\"\n           [closePopupOnCancel]=\"false\"\n           (onApply)=\"applyFilter()\"\n           (onCancel)=\"clearAllFilters()\"\n           (onClose)=\"close()\">\n</kit-popup>\n\n<ng-template #content>\n  <div class=\"popup-content\">\n    <kit-checkbox class=\"checkbox-item\"\n                  [label]=\"'kit.filters.all' | translate\"\n                  [(ngModel)]=\"allSelected\"\n                  (changed)=\"toggleAll($event)\">\n    </kit-checkbox>\n\n    @for (item of items(); track $index) {\n      <kit-checkbox class=\"checkbox-item\"\n                    [label]=\"buildTranslateKey(item.title) | translate\"\n                    [(ngModel)]=\"item.checked\"\n                    (changed)=\"onChange()\"\n      ></kit-checkbox>\n    }\n  </div>\n</ng-template>\n\n<ng-template #tooltipTemplate>\n  @for (item of (displayedValues.length > 1 && !allSelected() ? displayedValues.slice(1) : displayedValues); track item) {\n    <div class=\"tooltip-item\">{{ buildTranslateKey(item) | translate }}</div>\n  }\n</ng-template>\n", styles: [".kit-filter-checkbox .tooltip-count{color:var(--ui-kit-color-main)}.kit-filter-checkbox .tooltip-item{color:var(--ui-kit-color-grey-10);font-size:12px;font-weight:500;line-height:20px}::ng-deep .kit-filter-checkbox-popup .popup-content{width:172px}::ng-deep .kit-filter-checkbox-popup .checkbox-item{display:block;padding:6px 0}\n"] }]
         }], ctorParameters: () => [] });
 
 class KitFilterDateComponent {
@@ -7928,7 +7937,7 @@ class KitGridFiltersComponent {
         return filters.some(filter => filter.field === item.field);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.4", ngImport: i0, type: KitGridFiltersComponent, deps: [{ token: i1$c.Store }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.4", type: KitGridFiltersComponent, isStandalone: true, selector: "kit-grid-filters", inputs: { excludedColumns: { classPropertyName: "excludedColumns", publicName: "excludedColumns", isSignal: true, isRequired: true, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: true, transformFunction: null }, filterListConfig: { classPropertyName: "filterListConfig", publicName: "filterListConfig", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { filterChanged: "filterChanged" }, ngImport: i0, template: "<div class=\"kit-grid-filters\">\n  @for (item of filters(); track item) {\n    @switch (item.type) {\n      @case (kitFilterType.CHECKBOX) {\n        <kit-filter-checkbox [filter]=\"item\"\n                             [items]=\"filterListConfig()[item.field].items\"\n                             [translateKeyPrefix]=\"filterListConfig()[item.field].translateKeyPrefix\"\n                             (filterRemoved)=\"removeFilter(item.field)\"\n                             (filterChanged)=\"applyFilter(item, $event)\"\n        ></kit-filter-checkbox>\n      }\n      @case (kitFilterType.RADIO) {\n        <kit-filter-radio [filter]=\"item\"\n                          [items]=\"filterListConfig()?.[item.field].items\"\n                          [translateKeyPrefix]=\"filterListConfig()?.[item.field].translateKeyPrefix\"\n                          (filterRemoved)=\"removeFilter(item.field)\"\n                          (filterChanged)=\"applyFilter(item, $event)\"\n        ></kit-filter-radio>\n      }\n      @case (kitFilterType.DATE) {\n        <kit-filter-date [filter]=\"item\"\n                         (filterRemoved)=\"removeFilter(item.field)\"\n                         (filterChanged)=\"applyFilter(item, $event)\"\n        ></kit-filter-date>\n      }\n      @case (kitFilterType.TEXT) {\n        <kit-filter-text [filter]=\"item\"\n                         (filterRemoved)=\"removeFilter(item.field)\"\n                         (filterChanged)=\"applyFilter(item, $event)\"\n        ></kit-filter-text>\n      }\n    }\n  }\n\n  <kit-filter-selector [items]=\"filterSelectorItems()\"\n                       (itemSelected)=\"addFilter($event)\"\n  ></kit-filter-selector>\n</div>\n", styles: [".kit-grid-filters{display:flex;flex-wrap:wrap;gap:10px}\n"], dependencies: [{ kind: "component", type: KitFilterSelectorComponent, selector: "kit-filter-selector", inputs: ["items"], outputs: ["itemSelected"] }, { kind: "component", type: KitFilterCheckboxComponent, selector: "kit-filter-checkbox", inputs: ["filter", "translateKeyPrefix", "items"], outputs: ["itemsChange", "filterRemoved", "filterChanged"] }, { kind: "component", type: KitFilterDateComponent, selector: "kit-filter-date", inputs: ["filter"], outputs: ["filterRemoved", "filterChanged"] }, { kind: "component", type: KitFilterTextComponent, selector: "kit-filter-text", inputs: ["filter"], outputs: ["filterRemoved", "filterChanged"] }, { kind: "component", type: KitFilterRadioComponent, selector: "kit-filter-radio", inputs: ["filter", "translateKeyPrefix", "items"], outputs: ["itemsChange", "filterRemoved", "filterChanged"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.4", type: KitGridFiltersComponent, isStandalone: true, selector: "kit-grid-filters", inputs: { excludedColumns: { classPropertyName: "excludedColumns", publicName: "excludedColumns", isSignal: true, isRequired: true, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: true, transformFunction: null }, filterListConfig: { classPropertyName: "filterListConfig", publicName: "filterListConfig", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { filterChanged: "filterChanged" }, ngImport: i0, template: "<div class=\"kit-grid-filters\">\n  @for (item of filters(); track item) {\n    @switch (item.type) {\n      @case (kitFilterType.CHECKBOX) {\n        <kit-filter-checkbox [filter]=\"item\"\n                             [items]=\"filterListConfig()[item.field].items\"\n                             [translateKeyPrefix]=\"filterListConfig()[item.field].translateKeyPrefix\"\n                             (filterRemoved)=\"removeFilter(item.field)\"\n                             (filterChanged)=\"applyFilter(item, $event)\"\n        ></kit-filter-checkbox>\n      }\n      @case (kitFilterType.RADIO) {\n        <kit-filter-radio [filter]=\"item\"\n                          [items]=\"filterListConfig()?.[item.field].items\"\n                          [translateKeyPrefix]=\"filterListConfig()?.[item.field].translateKeyPrefix\"\n                          (filterRemoved)=\"removeFilter(item.field)\"\n                          (filterChanged)=\"applyFilter(item, $event)\"\n        ></kit-filter-radio>\n      }\n      @case (kitFilterType.DATE) {\n        <kit-filter-date [filter]=\"item\"\n                         (filterRemoved)=\"removeFilter(item.field)\"\n                         (filterChanged)=\"applyFilter(item, $event)\"\n        ></kit-filter-date>\n      }\n      @case (kitFilterType.TEXT) {\n        <kit-filter-text [filter]=\"item\"\n                         (filterRemoved)=\"removeFilter(item.field)\"\n                         (filterChanged)=\"applyFilter(item, $event)\"\n        ></kit-filter-text>\n      }\n    }\n  }\n\n  <kit-filter-selector [items]=\"filterSelectorItems()\"\n                       (itemSelected)=\"addFilter($event)\"\n  ></kit-filter-selector>\n</div>\n", styles: [".kit-grid-filters{display:flex;flex-wrap:wrap;gap:10px}\n"], dependencies: [{ kind: "component", type: KitFilterSelectorComponent, selector: "kit-filter-selector", inputs: ["items"], outputs: ["itemSelected"] }, { kind: "component", type: KitFilterCheckboxComponent, selector: "kit-filter-checkbox", inputs: ["filter", "translateKeyPrefix", "items", "showPopupOnInit"], outputs: ["itemsChange", "filterRemoved", "filterChanged"] }, { kind: "component", type: KitFilterDateComponent, selector: "kit-filter-date", inputs: ["filter"], outputs: ["filterRemoved", "filterChanged"] }, { kind: "component", type: KitFilterTextComponent, selector: "kit-filter-text", inputs: ["filter"], outputs: ["filterRemoved", "filterChanged"] }, { kind: "component", type: KitFilterRadioComponent, selector: "kit-filter-radio", inputs: ["filter", "translateKeyPrefix", "items"], outputs: ["itemsChange", "filterRemoved", "filterChanged"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.4", ngImport: i0, type: KitGridFiltersComponent, decorators: [{
             type: Component,
@@ -8307,5 +8316,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.4", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { AbstractKitCtaPanelConfirmationComponent, AddGridFilter, KIT_BASE_PATH, KIT_DATETIME_FORMAT_LONG, KIT_DATE_FORMAT, KIT_GRID_STATE_TOKEN, KitAutocompleteComponent, KitAutocompleteDirective, KitAutocompleteModule, KitAvatarComponent, KitAvatarModule, KitAvatarSize, KitBadgeDirective, KitBadgeTheme, KitBreadcrumbsComponent, KitBreadcrumbsModule, KitButtonComponent, KitButtonIconPosition, KitButtonKind, KitButtonModule, KitButtonState, KitButtonType, KitCardComponent, KitCardModule, KitCardTheme, KitCheckboxComponent, KitCheckboxModule, KitCheckboxState, KitCollapsedListComponent, KitCopyTextComponent, KitCopyTextModule, KitCtaPanelAbstractConfirmationComponent, KitCtaPanelAbstractConfirmationModule, KitCtaPanelActionComponent, KitCtaPanelActionModule, KitCtaPanelConfirmationComponent, KitCtaPanelConfirmationModule, KitCtaPanelItemComponent, KitCtaPanelItemModule, KitCtaPanelItemType, KitDataFieldComponent, KitDataFieldState, KitDatepickerComponent, KitDatepickerModule, KitDaterangeComponent, KitDaterangeModule, KitDaterangeType, KitDatetimepickerComponent, KitDatetimepickerModule, KitDialogActionsComponent, KitDialogComponent, KitDialogService, KitDropdownComponent, KitDropdownItemTemplateDirective, KitDropdownModule, KitDropdownSize, KitEmptySectionComponent, KitEntitySectionComponent, KitEntitySectionContainerComponent, KitEntityTitleComponent, KitEntityTitleModule, KitFileCardComponent, KitFileCardMessagesComponent, KitFileCardModule, KitFileUploadComponent, KitFileUploadModule, KitFilterLogic, KitFilterOperator, KitFilterType, KitGridCellComponent, KitGridCellService, KitGridCellTemplateDirective, KitGridColumnComponent, KitGridColumnManagerComponent, KitGridComponent, KitGridDetailTemplateDirective, KitGridExportComponent, KitGridFiltersComponent, KitGridModule, KitGridSearchComponent, KitGridSortSettingsMode, KitGridState, KitGridViewType, KitGridViewsComponent, KitGridViewsState, KitInputLabelComponent, KitInputLabelModule, KitInputMessageComponent, KitInputMessageModule, KitLoaderComponent, KitLoaderModule, KitLocationStepperComponent, KitLocationStepperModule, KitMultiselectComponent, KitMultiselectModule, KitNavigationMenuComponent, KitNavigationMenuModule, KitNavigationMenuService, KitNavigationMenuSubmenuComponent, KitNavigationTabsComponent, KitNavigationTabsModule, KitNavigationTabsType, KitNoteComponent, KitNoteModule, KitNotificationComponent, KitNotificationService, KitNotificationType, KitNumericTextboxComponent, KitNumericTextboxModule, KitNumericTextboxState, KitPermissionDirective, KitPermissionModule, KitPillComponent, KitPillTheme, KitPillType, KitPopupAlignHorizontal, KitPopupAlignVertical, KitPopupComponent, KitPopupPositionMode, KitProfileMenuComponent, KitQueryParamsName, KitQueryParamsService, KitRadioButtonComponent, KitRadioButtonModule, KitRadioButtonType, KitScrollNavigationComponent, KitScrollNavigationSectionComponent, KitSearchBarComponent, KitSearchBarModule, KitShipmentCard, KitSkeletonAnimation, KitSkeletonComponent, KitSkeletonModule, KitSkeletonShape, KitSortDirection, KitSortableComponent, KitSvgIcon, KitSvgIconComponent, KitSvgIconModule, KitSvgIconType, KitSvgSpriteComponent, KitSvgSpriteModule, KitSwitchComponent, KitSwitchMode, KitSwitchModule, KitSwitchState, KitTabComponent, KitTabContentDirective, KitTabsComponent, KitTabsModule, KitTabsSize, KitTabsType, KitTextLabelComponent, KitTextLabelModule, KitTextLabelState, KitTextareaAutoresizeDirective, KitTextareaComponent, KitTextareaModule, KitTextareaState, KitTextboxComponent, KitTextboxModule, KitTextboxSize, KitTextboxState, KitTileLayoutComponent, KitTileLayoutItemComponent, KitTileLayoutModule, KitTimelineCardComponent, KitTimelineComponent, KitTimelineTheme, KitTimelineType, KitTimepickerComponent, KitTimepickerModule, KitTitleTemplateDirective, KitToastrModule, KitToastrPosition, KitToastrService, KitToastrType, KitToggleComponent, KitToggleModule, KitTooltipDirective, KitTooltipPosition, KitTranslateService, KitTruncateTextComponent, KitUnitsTextboxComponent, KitUnitsTextboxDropdownPosition, KitUnitsTextboxModule, KitUnitsTextboxType, RemoveGridFilter, SetGridColumns, SetGridSkip, SetGridSort, UpdateGridFilter, buildRandomUUID, kitBuildFilterBooleanOptions, kitBuildFilterListOptions, kitBuildFilters, kitBuildGridColumn, kitBuildGridDataResults, kitBuildOdataFilter, kitBuildSortString, kitDataStateToODataString, kitEncodeViewNameToUrl, kitNoValueRequiredFilterOperators };
+export { AbstractKitCtaPanelConfirmationComponent, AddGridFilter, KIT_BASE_PATH, KIT_DATETIME_FORMAT_LONG, KIT_DATE_FORMAT, KIT_GRID_STATE_TOKEN, KitAutocompleteComponent, KitAutocompleteDirective, KitAutocompleteModule, KitAvatarComponent, KitAvatarModule, KitAvatarSize, KitBadgeDirective, KitBadgeTheme, KitBreadcrumbsComponent, KitBreadcrumbsModule, KitButtonComponent, KitButtonIconPosition, KitButtonKind, KitButtonModule, KitButtonState, KitButtonType, KitCardComponent, KitCardModule, KitCardTheme, KitCheckboxComponent, KitCheckboxModule, KitCheckboxState, KitCollapsedListComponent, KitCopyTextComponent, KitCopyTextModule, KitCtaPanelAbstractConfirmationComponent, KitCtaPanelAbstractConfirmationModule, KitCtaPanelActionComponent, KitCtaPanelActionModule, KitCtaPanelConfirmationComponent, KitCtaPanelConfirmationModule, KitCtaPanelItemComponent, KitCtaPanelItemModule, KitCtaPanelItemType, KitDataFieldComponent, KitDataFieldState, KitDatepickerComponent, KitDatepickerModule, KitDaterangeComponent, KitDaterangeModule, KitDaterangeType, KitDatetimepickerComponent, KitDatetimepickerModule, KitDialogActionsComponent, KitDialogComponent, KitDialogService, KitDropdownComponent, KitDropdownItemTemplateDirective, KitDropdownModule, KitDropdownSize, KitEmptySectionComponent, KitEntitySectionComponent, KitEntitySectionContainerComponent, KitEntityTitleComponent, KitEntityTitleModule, KitFileCardComponent, KitFileCardMessagesComponent, KitFileCardModule, KitFileUploadComponent, KitFileUploadModule, KitFilterCheckboxComponent, KitFilterLogic, KitFilterOperator, KitFilterType, KitGridCellComponent, KitGridCellService, KitGridCellTemplateDirective, KitGridColumnComponent, KitGridColumnManagerComponent, KitGridComponent, KitGridDetailTemplateDirective, KitGridExportComponent, KitGridFiltersComponent, KitGridModule, KitGridSearchComponent, KitGridSortSettingsMode, KitGridState, KitGridViewType, KitGridViewsComponent, KitGridViewsState, KitInputLabelComponent, KitInputLabelModule, KitInputMessageComponent, KitInputMessageModule, KitLoaderComponent, KitLoaderModule, KitLocationStepperComponent, KitLocationStepperModule, KitMultiselectComponent, KitMultiselectModule, KitNavigationMenuComponent, KitNavigationMenuModule, KitNavigationMenuService, KitNavigationMenuSubmenuComponent, KitNavigationTabsComponent, KitNavigationTabsModule, KitNavigationTabsType, KitNoteComponent, KitNoteModule, KitNotificationComponent, KitNotificationService, KitNotificationType, KitNumericTextboxComponent, KitNumericTextboxModule, KitNumericTextboxState, KitPermissionDirective, KitPermissionModule, KitPillComponent, KitPillTheme, KitPillType, KitPopupAlignHorizontal, KitPopupAlignVertical, KitPopupComponent, KitPopupPositionMode, KitProfileMenuComponent, KitQueryParamsName, KitQueryParamsService, KitRadioButtonComponent, KitRadioButtonModule, KitRadioButtonType, KitScrollNavigationComponent, KitScrollNavigationSectionComponent, KitSearchBarComponent, KitSearchBarModule, KitShipmentCard, KitSkeletonAnimation, KitSkeletonComponent, KitSkeletonModule, KitSkeletonShape, KitSortDirection, KitSortableComponent, KitSvgIcon, KitSvgIconComponent, KitSvgIconModule, KitSvgIconType, KitSvgSpriteComponent, KitSvgSpriteModule, KitSwitchComponent, KitSwitchMode, KitSwitchModule, KitSwitchState, KitTabComponent, KitTabContentDirective, KitTabsComponent, KitTabsModule, KitTabsSize, KitTabsType, KitTextLabelComponent, KitTextLabelModule, KitTextLabelState, KitTextareaAutoresizeDirective, KitTextareaComponent, KitTextareaModule, KitTextareaState, KitTextboxComponent, KitTextboxModule, KitTextboxSize, KitTextboxState, KitTileLayoutComponent, KitTileLayoutItemComponent, KitTileLayoutModule, KitTimelineCardComponent, KitTimelineComponent, KitTimelineTheme, KitTimelineType, KitTimepickerComponent, KitTimepickerModule, KitTitleTemplateDirective, KitToastrModule, KitToastrPosition, KitToastrService, KitToastrType, KitToggleComponent, KitToggleModule, KitTooltipDirective, KitTooltipPosition, KitTranslateService, KitTruncateTextComponent, KitUnitsTextboxComponent, KitUnitsTextboxDropdownPosition, KitUnitsTextboxModule, KitUnitsTextboxType, RemoveGridFilter, SetGridColumns, SetGridSkip, SetGridSort, UpdateGridFilter, buildRandomUUID, kitBuildFilterBooleanOptions, kitBuildFilterListOptions, kitBuildFilters, kitBuildGridColumn, kitBuildGridDataResults, kitBuildOdataFilter, kitBuildSortString, kitDataStateToODataString, kitEncodeViewNameToUrl, kitNoValueRequiredFilterOperators };
 //# sourceMappingURL=indigina-ui-kit.mjs.map