@indigina/ui-kit 1.1.593 → 1.1.594
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -14803,13 +14803,7 @@ class KitFilterCheckboxComponent {
|
|
|
14803
14803
|
requestAnimationFrame(() => this.popup()?.toggle());
|
|
14804
14804
|
}
|
|
14805
14805
|
close() {
|
|
14806
|
-
|
|
14807
|
-
if (selectedValues.length) {
|
|
14808
|
-
this.updateItemsState();
|
|
14809
|
-
}
|
|
14810
|
-
else {
|
|
14811
|
-
this.applyFilter();
|
|
14812
|
-
}
|
|
14806
|
+
this.updateItemsState();
|
|
14813
14807
|
}
|
|
14814
14808
|
buildTranslateKey(value) {
|
|
14815
14809
|
return `${this.translateKeyPrefix()}${value}`;
|
|
@@ -14904,7 +14898,7 @@ class KitFilterCheckboxComponent {
|
|
|
14904
14898
|
})));
|
|
14905
14899
|
}
|
|
14906
14900
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KitFilterCheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
14907
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", 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 }, guidField: { classPropertyName: "guidField", publicName: "guidField", 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: "popupContent", first: true, predicate: ["popupContent"], 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 &&
|
|
14901
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", 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 }, guidField: { classPropertyName: "guidField", publicName: "guidField", 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: "popupContent", first: true, predicate: ["popupContent"], 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 && (filter().removable ?? true)\"\n [theme]=\"filter().readonly && kitPillTheme.BLUE || kitPillTheme.DEFAULT\"\n (removed)=\"removeFilter()\"\n (clicked)=\"onPopupToggle()\">\n {{ filter().title | translate }}:\n @if (allSelected()) {\n <div class=\"kit-filter-checkbox-tooltip\"\n kitTooltip\n kitTooltipFilter=\".kit-filter-checkbox-tooltip\"\n [kitTooltipPosition]=\"kitTooltipPosition.RIGHT\"\n [kitTooltipTemplateRef]=\"tooltipTemplate\">\n {{ 'kit.filters.all' | translate }}\n </div>\n } @else if (displayedValues.length > 1) {\n <div class=\"kit-filter-checkbox-tooltip\"\n kitTooltip\n kitTooltipFilter=\".kit-filter-checkbox-tooltip\"\n [kitTooltipPosition]=\"kitTooltipPosition.RIGHT\"\n [kitTooltipTemplateRef]=\"tooltipTemplate\">\n <span class=\"kit-filter-checkbox-single-item\">{{ displayedValues[0] }}</span>\n <span class=\"kit-filter-checkbox-tooltip-count\">+{{ displayedValues.length - 1 }}</span>\n </div>\n } @else {\n <span class=\"kit-filter-checkbox-single-item\">{{ displayedValues[0] ?? '' }}</span>\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 [closePopupOnCancel]=\"false\"\n (applyAction)=\"applyFilter()\"\n (cancelAction)=\"clearAllFilters()\"\n (closed)=\"close()\">\n</kit-popup>\n\n<ng-template #content>\n <div class=\"popup-search\"\n [hidden]=\"!isContentOverflowing && !searchTerm()\">\n <kit-textbox [placeholder]=\"'kit.filters.search' | translate\"\n [size]=\"kitTextboxSize.SMALL\"\n [defaultValue]=\"searchTerm()\"\n (changed)=\"searchTerm.set($event)\"\n ></kit-textbox>\n </div>\n\n <div #popupContent\n class=\"popup-content\">\n @if (!searchTerm()) {\n <kit-checkbox class=\"checkbox-item\"\n [label]=\"'kit.filters.all' | translate\"\n [(ngModel)]=\"allSelected\"\n (changed)=\"toggleAll($event)\">\n </kit-checkbox>\n }\n\n @for (item of visibleItems(); track $index) {\n <kit-checkbox class=\"checkbox-item\"\n [label]=\"buildTranslateKey(item.title) | translate\"\n [(ngModel)]=\"item.checked\"\n (changed)=\"onChange($event, item.value)\"\n ></kit-checkbox>\n }\n\n @if (!visibleItems().length) {\n {{ ('kit.filters.noDataFound' | translate) }}\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=\"kit-filter-checkbox-tooltip-item\">{{ item }}</div>\n }\n</ng-template>\n", styles: [".kit-filter-checkbox-tooltip{display:flex;align-items:center;gap:3px}.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}.kit-filter-checkbox-single-item{display:block;max-width:180px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}::ng-deep .kit-filter-checkbox-popup .popup-search{margin-bottom:5px;padding-bottom:15px;border-bottom:1px solid var(--ui-kit-color-grey-11)}::ng-deep .kit-filter-checkbox-popup .popup-content{width:172px;max-height:400px;overflow-y:auto}::ng-deep .kit-filter-checkbox-popup .popup-content::-webkit-scrollbar{width:4px;height:4px}::ng-deep .kit-filter-checkbox-popup .popup-content::-webkit-scrollbar-thumb{background-color:var(--ui-kit-color-grey-17);border-radius:2px}::ng-deep .kit-filter-checkbox-popup .popup-content::-webkit-scrollbar-thumb:hover{background-color:var(--ui-kit-color-grey-10)}::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: "component", type: KitCheckboxComponent, selector: "kit-checkbox", inputs: ["label", "disabled", "checked", "readonly", "state", "messageIcon", "messageText", "indeterminate"], outputs: ["changed"] }, { kind: "directive", type: KitTooltipDirective, selector: "[kitTooltip]", inputs: ["kitTooltipPosition", "kitTooltipFilter", "kitTooltipTemplateRef", "kitTooltipVisible", "kitTooltipOffset"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$8.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", "extraInsideSelectors"], outputs: ["cancelAction", "applyAction", "opened", "closed"] }, { kind: "component", type: KitTextboxComponent, selector: "kit-textbox", inputs: ["placeholder", "label", "labelTooltip", "defaultValue", "messageIcon", "messageText", "messageTemplate", "disabled", "maxlength", "state", "size", "icon", "clearButton", "showStateIcon", "readonly", "customStateIcon", "type"], outputs: ["defaultValueChange", "disabledChange", "blured", "focused", "changed"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
14908
14902
|
}
|
|
14909
14903
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KitFilterCheckboxComponent, decorators: [{
|
|
14910
14904
|
type: Component,
|
|
@@ -14916,7 +14910,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImpor
|
|
|
14916
14910
|
FormsModule,
|
|
14917
14911
|
KitPopupComponent,
|
|
14918
14912
|
KitTextboxComponent,
|
|
14919
|
-
], 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 &&
|
|
14913
|
+
], 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 && (filter().removable ?? true)\"\n [theme]=\"filter().readonly && kitPillTheme.BLUE || kitPillTheme.DEFAULT\"\n (removed)=\"removeFilter()\"\n (clicked)=\"onPopupToggle()\">\n {{ filter().title | translate }}:\n @if (allSelected()) {\n <div class=\"kit-filter-checkbox-tooltip\"\n kitTooltip\n kitTooltipFilter=\".kit-filter-checkbox-tooltip\"\n [kitTooltipPosition]=\"kitTooltipPosition.RIGHT\"\n [kitTooltipTemplateRef]=\"tooltipTemplate\">\n {{ 'kit.filters.all' | translate }}\n </div>\n } @else if (displayedValues.length > 1) {\n <div class=\"kit-filter-checkbox-tooltip\"\n kitTooltip\n kitTooltipFilter=\".kit-filter-checkbox-tooltip\"\n [kitTooltipPosition]=\"kitTooltipPosition.RIGHT\"\n [kitTooltipTemplateRef]=\"tooltipTemplate\">\n <span class=\"kit-filter-checkbox-single-item\">{{ displayedValues[0] }}</span>\n <span class=\"kit-filter-checkbox-tooltip-count\">+{{ displayedValues.length - 1 }}</span>\n </div>\n } @else {\n <span class=\"kit-filter-checkbox-single-item\">{{ displayedValues[0] ?? '' }}</span>\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 [closePopupOnCancel]=\"false\"\n (applyAction)=\"applyFilter()\"\n (cancelAction)=\"clearAllFilters()\"\n (closed)=\"close()\">\n</kit-popup>\n\n<ng-template #content>\n <div class=\"popup-search\"\n [hidden]=\"!isContentOverflowing && !searchTerm()\">\n <kit-textbox [placeholder]=\"'kit.filters.search' | translate\"\n [size]=\"kitTextboxSize.SMALL\"\n [defaultValue]=\"searchTerm()\"\n (changed)=\"searchTerm.set($event)\"\n ></kit-textbox>\n </div>\n\n <div #popupContent\n class=\"popup-content\">\n @if (!searchTerm()) {\n <kit-checkbox class=\"checkbox-item\"\n [label]=\"'kit.filters.all' | translate\"\n [(ngModel)]=\"allSelected\"\n (changed)=\"toggleAll($event)\">\n </kit-checkbox>\n }\n\n @for (item of visibleItems(); track $index) {\n <kit-checkbox class=\"checkbox-item\"\n [label]=\"buildTranslateKey(item.title) | translate\"\n [(ngModel)]=\"item.checked\"\n (changed)=\"onChange($event, item.value)\"\n ></kit-checkbox>\n }\n\n @if (!visibleItems().length) {\n {{ ('kit.filters.noDataFound' | translate) }}\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=\"kit-filter-checkbox-tooltip-item\">{{ item }}</div>\n }\n</ng-template>\n", styles: [".kit-filter-checkbox-tooltip{display:flex;align-items:center;gap:3px}.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}.kit-filter-checkbox-single-item{display:block;max-width:180px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}::ng-deep .kit-filter-checkbox-popup .popup-search{margin-bottom:5px;padding-bottom:15px;border-bottom:1px solid var(--ui-kit-color-grey-11)}::ng-deep .kit-filter-checkbox-popup .popup-content{width:172px;max-height:400px;overflow-y:auto}::ng-deep .kit-filter-checkbox-popup .popup-content::-webkit-scrollbar{width:4px;height:4px}::ng-deep .kit-filter-checkbox-popup .popup-content::-webkit-scrollbar-thumb{background-color:var(--ui-kit-color-grey-17);border-radius:2px}::ng-deep .kit-filter-checkbox-popup .popup-content::-webkit-scrollbar-thumb:hover{background-color:var(--ui-kit-color-grey-10)}::ng-deep .kit-filter-checkbox-popup .checkbox-item{display:block;padding:6px 0}\n"] }]
|
|
14920
14914
|
}], ctorParameters: () => [], propDecorators: { filter: [{ type: i0.Input, args: [{ isSignal: true, alias: "filter", required: true }] }], translateKeyPrefix: [{ type: i0.Input, args: [{ isSignal: true, alias: "translateKeyPrefix", required: false }] }], items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }, { type: i0.Output, args: ["itemsChange"] }], showPopupOnInit: [{ type: i0.Input, args: [{ isSignal: true, alias: "showPopupOnInit", required: false }] }], guidField: [{ type: i0.Input, args: [{ isSignal: true, alias: "guidField", required: false }] }], filterRemoved: [{ type: i0.Output, args: ["filterRemoved"] }], filterChanged: [{ type: i0.Output, args: ["filterChanged"] }], anchor: [{ type: i0.ViewChild, args: ['toggleButton', { ...{ read: ElementRef }, isSignal: true }] }], popupContent: [{ type: i0.ViewChild, args: ['popupContent', { ...{ read: ElementRef }, isSignal: true }] }], popup: [{ type: i0.ViewChild, args: ['popup', { ...{ read: KitPopupComponent }, isSignal: true }] }] } });
|
|
14921
14915
|
|
|
14922
14916
|
class KitFilterCustomInputComponent {
|
|
@@ -14945,9 +14939,6 @@ class KitFilterCustomInputComponent {
|
|
|
14945
14939
|
this.rafId = null;
|
|
14946
14940
|
}
|
|
14947
14941
|
}
|
|
14948
|
-
get applyButtonDisabled() {
|
|
14949
|
-
return !this.inputValue().trim();
|
|
14950
|
-
}
|
|
14951
14942
|
onValueChange(value) {
|
|
14952
14943
|
this.inputValue.set(value);
|
|
14953
14944
|
}
|
|
@@ -14961,18 +14952,15 @@ class KitFilterCustomInputComponent {
|
|
|
14961
14952
|
close() {
|
|
14962
14953
|
if (this.selectedValue()) {
|
|
14963
14954
|
this.inputValue.set(this.selectedValue());
|
|
14955
|
+
return;
|
|
14964
14956
|
}
|
|
14965
|
-
|
|
14966
|
-
this.removeFilter();
|
|
14967
|
-
}
|
|
14957
|
+
this.inputValue.set(this.selectedValue());
|
|
14968
14958
|
}
|
|
14969
14959
|
clearAllFilters() {
|
|
14970
14960
|
this.inputValue.set('');
|
|
14971
14961
|
}
|
|
14972
14962
|
onEnterKey() {
|
|
14973
|
-
|
|
14974
|
-
this.popup()?.apply();
|
|
14975
|
-
}
|
|
14963
|
+
this.popup()?.apply();
|
|
14976
14964
|
}
|
|
14977
14965
|
applyFilter() {
|
|
14978
14966
|
const value = this.inputValue().trim();
|
|
@@ -15004,7 +14992,7 @@ class KitFilterCustomInputComponent {
|
|
|
15004
14992
|
}
|
|
15005
14993
|
}
|
|
15006
14994
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KitFilterCustomInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
15007
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.1.1", type: KitFilterCustomInputComponent, isStandalone: true, selector: "kit-filter-custom-input", inputs: { filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { 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: "<kit-pill #toggleButton\n [selectable]=\"!filter().readonly\"\n [selected]=\"popup.isPopupOpen\"\n [removable]=\"!filter().readonly &&
|
|
14995
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.1.1", type: KitFilterCustomInputComponent, isStandalone: true, selector: "kit-filter-custom-input", inputs: { filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { 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: "<kit-pill #toggleButton\n [selectable]=\"!filter().readonly\"\n [selected]=\"popup.isPopupOpen\"\n [removable]=\"!filter().readonly && (filter().removable ?? true)\"\n [theme]=\"filter().readonly && kitPillTheme.BLUE || kitPillTheme.DEFAULT\"\n (removed)=\"removeFilter()\"\n (clicked)=\"onPopupToggle()\">\n {{ filter().title | translate }}:\n <kit-truncate-text class=\"kit-custom-input-selected-values\">\n {{ selectedValue() }}\n </kit-truncate-text>\n</kit-pill>\n\n<kit-popup #popup\n popupClass=\"kit-filter-input-popup\"\n [anchor]=\"anchor()\"\n [content]=\"content\"\n [showFooter]=\"true\"\n [applyButtonLabel]=\"'kit.filters.apply' | translate\"\n [cancelButtonLabel]=\"'kit.filters.clear' | translate\"\n [closePopupOnCancel]=\"false\"\n (applyAction)=\"applyFilter()\"\n (cancelAction)=\"clearAllFilters()\"\n (closed)=\"close()\">\n</kit-popup>\n\n<ng-template #content>\n <div class=\"popup-content\">\n <kit-textbox [size]=\"kitTextboxSize.SMALL\"\n [defaultValue]=\"inputValue()\"\n (changed)=\"onValueChange($event)\"\n (keydown.enter)=\"onEnterKey()\"\n ></kit-textbox>\n </div>\n</ng-template>\n", styles: [".kit-custom-input-selected-values{max-width:180px}::ng-deep .kit-filter-input-popup .popup-content{width:296px;box-sizing:border-box}\n"], dependencies: [{ kind: "component", type: KitPillComponent, selector: "kit-pill", inputs: ["removable", "selectable", "selected", "type", "theme", "icon", "iconType"], outputs: ["clicked", "removed"] }, { kind: "component", type: KitPopupComponent, selector: "kit-popup", inputs: ["anchor", "content", "closeOnOutsideClick", "showFooter", "cancelButtonLabel", "applyButtonLabel", "isApplyButtonDisabled", "positionMode", "popupClass", "closePopupOnCancel", "extraInsideSelectors"], outputs: ["cancelAction", "applyAction", "opened", "closed"] }, { kind: "component", type: KitTextboxComponent, selector: "kit-textbox", inputs: ["placeholder", "label", "labelTooltip", "defaultValue", "messageIcon", "messageText", "messageTemplate", "disabled", "maxlength", "state", "size", "icon", "clearButton", "showStateIcon", "readonly", "customStateIcon", "type"], outputs: ["defaultValueChange", "disabledChange", "blured", "focused", "changed"] }, { kind: "component", type: KitTruncateTextComponent, selector: "kit-truncate-text", inputs: ["tooltipText", "lines", "innerHtml"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
15008
14996
|
}
|
|
15009
14997
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KitFilterCustomInputComponent, decorators: [{
|
|
15010
14998
|
type: Component,
|
|
@@ -15014,7 +15002,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImpor
|
|
|
15014
15002
|
KitTextboxComponent,
|
|
15015
15003
|
TranslatePipe,
|
|
15016
15004
|
KitTruncateTextComponent,
|
|
15017
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<kit-pill #toggleButton\n [selectable]=\"!filter().readonly\"\n [selected]=\"popup.isPopupOpen\"\n [removable]=\"!filter().readonly &&
|
|
15005
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<kit-pill #toggleButton\n [selectable]=\"!filter().readonly\"\n [selected]=\"popup.isPopupOpen\"\n [removable]=\"!filter().readonly && (filter().removable ?? true)\"\n [theme]=\"filter().readonly && kitPillTheme.BLUE || kitPillTheme.DEFAULT\"\n (removed)=\"removeFilter()\"\n (clicked)=\"onPopupToggle()\">\n {{ filter().title | translate }}:\n <kit-truncate-text class=\"kit-custom-input-selected-values\">\n {{ selectedValue() }}\n </kit-truncate-text>\n</kit-pill>\n\n<kit-popup #popup\n popupClass=\"kit-filter-input-popup\"\n [anchor]=\"anchor()\"\n [content]=\"content\"\n [showFooter]=\"true\"\n [applyButtonLabel]=\"'kit.filters.apply' | translate\"\n [cancelButtonLabel]=\"'kit.filters.clear' | translate\"\n [closePopupOnCancel]=\"false\"\n (applyAction)=\"applyFilter()\"\n (cancelAction)=\"clearAllFilters()\"\n (closed)=\"close()\">\n</kit-popup>\n\n<ng-template #content>\n <div class=\"popup-content\">\n <kit-textbox [size]=\"kitTextboxSize.SMALL\"\n [defaultValue]=\"inputValue()\"\n (changed)=\"onValueChange($event)\"\n (keydown.enter)=\"onEnterKey()\"\n ></kit-textbox>\n </div>\n</ng-template>\n", styles: [".kit-custom-input-selected-values{max-width:180px}::ng-deep .kit-filter-input-popup .popup-content{width:296px;box-sizing:border-box}\n"] }]
|
|
15018
15006
|
}], propDecorators: { filter: [{ type: i0.Input, args: [{ isSignal: true, alias: "filter", required: true }] }], filterRemoved: [{ type: i0.Output, args: ["filterRemoved"] }], filterChanged: [{ type: i0.Output, args: ["filterChanged"] }], anchor: [{ type: i0.ViewChild, args: ['toggleButton', { ...{ read: ElementRef }, isSignal: true }] }], popup: [{ type: i0.ViewChild, args: ['popup', { ...{ read: KitPopupComponent }, isSignal: true }] }] } });
|
|
15019
15007
|
|
|
15020
15008
|
class KitFilterDateComponent {
|
|
@@ -15119,13 +15107,14 @@ class KitFilterDateComponent {
|
|
|
15119
15107
|
}
|
|
15120
15108
|
close() {
|
|
15121
15109
|
if (!this.filter().value && !(this.selectedValues().start || this.selectedValues().end)) {
|
|
15122
|
-
this.
|
|
15123
|
-
|
|
15124
|
-
|
|
15125
|
-
|
|
15126
|
-
this.startDate.set(startFilter?.value);
|
|
15127
|
-
this.endDate.set(endFilter?.value);
|
|
15110
|
+
this.startDate.set(undefined);
|
|
15111
|
+
this.endDate.set(undefined);
|
|
15112
|
+
this.dateRange.set(undefined);
|
|
15113
|
+
return;
|
|
15128
15114
|
}
|
|
15115
|
+
const [startFilter, endFilter,] = this.filter().value?.filters || [];
|
|
15116
|
+
this.startDate.set(startFilter?.value);
|
|
15117
|
+
this.endDate.set(endFilter?.value);
|
|
15129
15118
|
}
|
|
15130
15119
|
onFromDateChange(date) {
|
|
15131
15120
|
this.dateRange.set(undefined);
|
|
@@ -15140,12 +15129,7 @@ class KitFilterDateComponent {
|
|
|
15140
15129
|
this.endDate.set(endDate);
|
|
15141
15130
|
}
|
|
15142
15131
|
onEnterKey() {
|
|
15143
|
-
|
|
15144
|
-
this.popup()?.apply();
|
|
15145
|
-
}
|
|
15146
|
-
}
|
|
15147
|
-
applyButtonDisabled() {
|
|
15148
|
-
return !this.startDate() && !this.endDate();
|
|
15132
|
+
this.popup()?.apply();
|
|
15149
15133
|
}
|
|
15150
15134
|
clearAllFilters() {
|
|
15151
15135
|
this.startDate.set(undefined);
|
|
@@ -15239,7 +15223,7 @@ class KitFilterDateComponent {
|
|
|
15239
15223
|
return {};
|
|
15240
15224
|
}
|
|
15241
15225
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KitFilterDateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
15242
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: KitFilterDateComponent, isStandalone: true, selector: "kit-filter-date", inputs: { filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: true, transformFunction: null }, useUserTimeZone: { classPropertyName: "useUserTimeZone", publicName: "useUserTimeZone", isSignal: true, isRequired: false, transformFunction: null }, useLocalTimeZone: { classPropertyName: "useLocalTimeZone", publicName: "useLocalTimeZone", isSignal: true, isRequired: false, transformFunction: null }, dateFilterConstraint: { classPropertyName: "dateFilterConstraint", publicName: "dateFilterConstraint", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { 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-date\">\n <kit-pill #toggleButton\n [selectable]=\"!filter().readonly\"\n [selected]=\"popup.isPopupOpen\"\n [removable]=\"!filter().readonly &&
|
|
15226
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: KitFilterDateComponent, isStandalone: true, selector: "kit-filter-date", inputs: { filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: true, transformFunction: null }, useUserTimeZone: { classPropertyName: "useUserTimeZone", publicName: "useUserTimeZone", isSignal: true, isRequired: false, transformFunction: null }, useLocalTimeZone: { classPropertyName: "useLocalTimeZone", publicName: "useLocalTimeZone", isSignal: true, isRequired: false, transformFunction: null }, dateFilterConstraint: { classPropertyName: "dateFilterConstraint", publicName: "dateFilterConstraint", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { 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-date\">\n <kit-pill #toggleButton\n [selectable]=\"!filter().readonly\"\n [selected]=\"popup.isPopupOpen\"\n [removable]=\"!filter().readonly && (filter().removable ?? true)\"\n [theme]=\"filter().readonly && kitPillTheme.BLUE || kitPillTheme.DEFAULT\"\n (removed)=\"removeFilter()\"\n (clicked)=\"onPopupToggle()\">\n {{ filter().title | translate }}:\n @if (selectedValues(); as selectedValues) { \n {{ localStartDate() | date: pillDateFormat }}\n @if (selectedValues?.start && selectedValues?.end) { \n -\n }\n {{ localEndDate() | date: pillDateFormat }}\n }\n </kit-pill>\n</div>\n\n<kit-popup #popup\n popupClass=\"kit-filter-date-popup\"\n [anchor]=\"anchor()\"\n [content]=\"content\"\n [closeOnOutsideClick]=\"false\"\n [showFooter]=\"true\"\n [applyButtonLabel]=\"'kit.filters.apply' | translate\"\n [cancelButtonLabel]=\"'kit.filters.clear' | translate\"\n [closePopupOnCancel]=\"false\"\n (applyAction)=\"applyFilter()\"\n (cancelAction)=\"clearAllFilters()\"\n (closed)=\"close()\">\n</kit-popup>\n\n<ng-template #content>\n <div class=\"popup-actions\">\n <kit-button [kind]=\"kitButtonKind.SMALL\"\n [type]=\"kitButtonType.GHOST\"\n [label]=\"'kit.filters.today' | translate\"\n [active]=\"dateRange() === kitFilterDateRange.TODAY\"\n (clicked)=\"selectDateRange(kitFilterDateRange.TODAY)\" />\n <kit-button [kind]=\"kitButtonKind.SMALL\"\n [type]=\"kitButtonType.GHOST\"\n [label]=\"'kit.filters.yesterday' | translate\"\n [active]=\"dateRange() === kitFilterDateRange.YESTERDAY\"\n (clicked)=\"selectDateRange(kitFilterDateRange.YESTERDAY)\" />\n <kit-button [kind]=\"kitButtonKind.SMALL\"\n [type]=\"kitButtonType.GHOST\"\n [label]=\"'kit.filters.lastWeek' | translate\"\n [active]=\"dateRange() === kitFilterDateRange.LAST_WEEK\"\n (clicked)=\"selectDateRange(kitFilterDateRange.LAST_WEEK)\" />\n <kit-button [kind]=\"kitButtonKind.SMALL\"\n [type]=\"kitButtonType.GHOST\"\n [label]=\"'kit.filters.lastMonth' | translate\"\n [active]=\"dateRange() === kitFilterDateRange.LAST_MONTH\"\n (clicked)=\"selectDateRange(kitFilterDateRange.LAST_MONTH)\" />\n </div>\n <div class=\"popup-content\">\n <div class=\"date-input\">\n <kit-datepicker [placeholder]=\"'kit.filters.chooseDateFrom' | translate\"\n [defaultDate]=\"localStartDate()\"\n [min]=\"minDateConstraint()\"\n [max]=\"localEndDate()\"\n (changed)=\"onFromDateChange($event)\"\n (keydown.enter)=\"onEnterKey()\"\n ></kit-datepicker>\n <kit-datepicker [placeholder]=\"'kit.filters.chooseDateTo' | translate\"\n [defaultDate]=\"localEndDate()\"\n [min]=\"localStartDate()\"\n [max]=\"maxDateConstraint()\"\n (changed)=\"onToDateChange($event)\"\n (keydown.enter)=\"onEnterKey()\"\n ></kit-datepicker>\n </div>\n </div>\n</ng-template>\n", styles: ["::ng-deep .kit-filter-date-popup{min-width:296px}::ng-deep .kit-filter-date-popup .popup-content{box-sizing:border-box}::ng-deep .kit-filter-date-popup .popup-actions{display:flex;justify-content:space-between;gap:8px;margin-bottom:15px}::ng-deep .kit-filter-date-popup .date-input{display:flex;flex-direction:column;width:100%;gap:10px}\n"], dependencies: [{ kind: "component", type: KitPillComponent, selector: "kit-pill", inputs: ["removable", "selectable", "selected", "type", "theme", "icon", "iconType"], outputs: ["clicked", "removed"] }, { kind: "component", type: KitDatepickerComponent, selector: "kit-datepicker", inputs: ["placeholder", "label", "labelTooltip", "defaultDate", "disabled", "format", "min", "max", "messageIcon", "messageText", "size", "readonly"], outputs: ["defaultDateChange", "disabledChange", "changed"] }, { kind: "component", type: KitPopupComponent, selector: "kit-popup", inputs: ["anchor", "content", "closeOnOutsideClick", "showFooter", "cancelButtonLabel", "applyButtonLabel", "isApplyButtonDisabled", "positionMode", "popupClass", "closePopupOnCancel", "extraInsideSelectors"], outputs: ["cancelAction", "applyAction", "opened", "closed"] }, { kind: "component", type: KitButtonComponent, selector: "kit-button", inputs: ["disabled", "label", "type", "icon", "iconType", "kind", "state", "iconPosition", "buttonClass", "active"], outputs: ["clicked"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
15243
15227
|
}
|
|
15244
15228
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KitFilterDateComponent, decorators: [{
|
|
15245
15229
|
type: Component,
|
|
@@ -15250,7 +15234,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImpor
|
|
|
15250
15234
|
DatePipe,
|
|
15251
15235
|
KitPopupComponent,
|
|
15252
15236
|
KitButtonComponent,
|
|
15253
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"kit-filter-date\">\n <kit-pill #toggleButton\n [selectable]=\"!filter().readonly\"\n [selected]=\"popup.isPopupOpen\"\n [removable]=\"!filter().readonly &&
|
|
15237
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"kit-filter-date\">\n <kit-pill #toggleButton\n [selectable]=\"!filter().readonly\"\n [selected]=\"popup.isPopupOpen\"\n [removable]=\"!filter().readonly && (filter().removable ?? true)\"\n [theme]=\"filter().readonly && kitPillTheme.BLUE || kitPillTheme.DEFAULT\"\n (removed)=\"removeFilter()\"\n (clicked)=\"onPopupToggle()\">\n {{ filter().title | translate }}:\n @if (selectedValues(); as selectedValues) { \n {{ localStartDate() | date: pillDateFormat }}\n @if (selectedValues?.start && selectedValues?.end) { \n -\n }\n {{ localEndDate() | date: pillDateFormat }}\n }\n </kit-pill>\n</div>\n\n<kit-popup #popup\n popupClass=\"kit-filter-date-popup\"\n [anchor]=\"anchor()\"\n [content]=\"content\"\n [closeOnOutsideClick]=\"false\"\n [showFooter]=\"true\"\n [applyButtonLabel]=\"'kit.filters.apply' | translate\"\n [cancelButtonLabel]=\"'kit.filters.clear' | translate\"\n [closePopupOnCancel]=\"false\"\n (applyAction)=\"applyFilter()\"\n (cancelAction)=\"clearAllFilters()\"\n (closed)=\"close()\">\n</kit-popup>\n\n<ng-template #content>\n <div class=\"popup-actions\">\n <kit-button [kind]=\"kitButtonKind.SMALL\"\n [type]=\"kitButtonType.GHOST\"\n [label]=\"'kit.filters.today' | translate\"\n [active]=\"dateRange() === kitFilterDateRange.TODAY\"\n (clicked)=\"selectDateRange(kitFilterDateRange.TODAY)\" />\n <kit-button [kind]=\"kitButtonKind.SMALL\"\n [type]=\"kitButtonType.GHOST\"\n [label]=\"'kit.filters.yesterday' | translate\"\n [active]=\"dateRange() === kitFilterDateRange.YESTERDAY\"\n (clicked)=\"selectDateRange(kitFilterDateRange.YESTERDAY)\" />\n <kit-button [kind]=\"kitButtonKind.SMALL\"\n [type]=\"kitButtonType.GHOST\"\n [label]=\"'kit.filters.lastWeek' | translate\"\n [active]=\"dateRange() === kitFilterDateRange.LAST_WEEK\"\n (clicked)=\"selectDateRange(kitFilterDateRange.LAST_WEEK)\" />\n <kit-button [kind]=\"kitButtonKind.SMALL\"\n [type]=\"kitButtonType.GHOST\"\n [label]=\"'kit.filters.lastMonth' | translate\"\n [active]=\"dateRange() === kitFilterDateRange.LAST_MONTH\"\n (clicked)=\"selectDateRange(kitFilterDateRange.LAST_MONTH)\" />\n </div>\n <div class=\"popup-content\">\n <div class=\"date-input\">\n <kit-datepicker [placeholder]=\"'kit.filters.chooseDateFrom' | translate\"\n [defaultDate]=\"localStartDate()\"\n [min]=\"minDateConstraint()\"\n [max]=\"localEndDate()\"\n (changed)=\"onFromDateChange($event)\"\n (keydown.enter)=\"onEnterKey()\"\n ></kit-datepicker>\n <kit-datepicker [placeholder]=\"'kit.filters.chooseDateTo' | translate\"\n [defaultDate]=\"localEndDate()\"\n [min]=\"localStartDate()\"\n [max]=\"maxDateConstraint()\"\n (changed)=\"onToDateChange($event)\"\n (keydown.enter)=\"onEnterKey()\"\n ></kit-datepicker>\n </div>\n </div>\n</ng-template>\n", styles: ["::ng-deep .kit-filter-date-popup{min-width:296px}::ng-deep .kit-filter-date-popup .popup-content{box-sizing:border-box}::ng-deep .kit-filter-date-popup .popup-actions{display:flex;justify-content:space-between;gap:8px;margin-bottom:15px}::ng-deep .kit-filter-date-popup .date-input{display:flex;flex-direction:column;width:100%;gap:10px}\n"] }]
|
|
15254
15238
|
}], propDecorators: { filter: [{ type: i0.Input, args: [{ isSignal: true, alias: "filter", required: true }] }], useUserTimeZone: [{ type: i0.Input, args: [{ isSignal: true, alias: "useUserTimeZone", required: false }] }], useLocalTimeZone: [{ type: i0.Input, args: [{ isSignal: true, alias: "useLocalTimeZone", required: false }] }], dateFilterConstraint: [{ type: i0.Input, args: [{ isSignal: true, alias: "dateFilterConstraint", required: false }] }], filterRemoved: [{ type: i0.Output, args: ["filterRemoved"] }], filterChanged: [{ type: i0.Output, args: ["filterChanged"] }], anchor: [{ type: i0.ViewChild, args: ['toggleButton', { ...{ read: ElementRef }, isSignal: true }] }], popup: [{ type: i0.ViewChild, args: ['popup', { ...{ read: KitPopupComponent }, isSignal: true }] }] } });
|
|
15255
15239
|
|
|
15256
15240
|
class KitFilterInputComponent {
|
|
@@ -15327,10 +15311,9 @@ class KitFilterInputComponent {
|
|
|
15327
15311
|
const selectedValues = this.selectedValues();
|
|
15328
15312
|
if (selectedValues) {
|
|
15329
15313
|
this.filterItems.set(selectedValues);
|
|
15314
|
+
return;
|
|
15330
15315
|
}
|
|
15331
|
-
|
|
15332
|
-
this.applyFilter();
|
|
15333
|
-
}
|
|
15316
|
+
this.resetFiltersItems();
|
|
15334
15317
|
}
|
|
15335
15318
|
clearAllFilters() {
|
|
15336
15319
|
this.resetFiltersItems();
|
|
@@ -15449,7 +15432,7 @@ class KitFilterInputComponent {
|
|
|
15449
15432
|
this.focusRafId = null;
|
|
15450
15433
|
}
|
|
15451
15434
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KitFilterInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
15452
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: KitFilterInputComponent, isStandalone: true, selector: "kit-filter-input", inputs: { filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: true, transformFunction: null }, filterInputType: { classPropertyName: "filterInputType", publicName: "filterInputType", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { filterRemoved: "filterRemoved", filterChanged: "filterChanged" }, viewQueries: [{ propertyName: "anchor", first: true, predicate: ["toggleButton"], descendants: true, read: ElementRef, isSignal: true }, { propertyName: "textboxComponents", predicate: KitTextboxComponent, descendants: true, isSignal: true }, { propertyName: "numericTextboxComponents", predicate: KitNumericTextboxComponent, descendants: true, isSignal: true }, { propertyName: "popup", first: true, predicate: ["popup"], descendants: true, read: KitPopupComponent, isSignal: true }], ngImport: i0, template: "<kit-pill #toggleButton\n [selectable]=\"!filter().readonly\"\n [selected]=\"popup.isPopupOpen\"\n [removable]=\"!filter().readonly &&
|
|
15435
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: KitFilterInputComponent, isStandalone: true, selector: "kit-filter-input", inputs: { filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: true, transformFunction: null }, filterInputType: { classPropertyName: "filterInputType", publicName: "filterInputType", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { filterRemoved: "filterRemoved", filterChanged: "filterChanged" }, viewQueries: [{ propertyName: "anchor", first: true, predicate: ["toggleButton"], descendants: true, read: ElementRef, isSignal: true }, { propertyName: "textboxComponents", predicate: KitTextboxComponent, descendants: true, isSignal: true }, { propertyName: "numericTextboxComponents", predicate: KitNumericTextboxComponent, descendants: true, isSignal: true }, { propertyName: "popup", first: true, predicate: ["popup"], descendants: true, read: KitPopupComponent, isSignal: true }], ngImport: i0, template: "<kit-pill #toggleButton\n [selectable]=\"!filter().readonly\"\n [selected]=\"popup.isPopupOpen\"\n [removable]=\"!filter().readonly && (filter().removable ?? true)\"\n [theme]=\"filter().readonly && kitPillTheme.BLUE || kitPillTheme.DEFAULT\"\n (removed)=\"removeFilter()\"\n (clicked)=\"onPopupToggle()\">\n {{ filter().title | translate }}:\n @if (selectedValues()?.filters; as selectedFilters) {\n <kit-truncate-text class=\"kit-filter-input-selected-values\">\n @for (filter of selectedFilters; track $index) {\n {{ getSelectedFilterText(filter) }}\n\n @if ($index === 0) {\n {{ getSelectedLogicText(selectedValues()) }}\n }\n }\n </kit-truncate-text>\n }\n</kit-pill>\n\n<kit-popup #popup\n popupClass=\"kit-filter-input-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 [extraInsideSelectors]=\"['.kit-dropdown-popup']\"\n (opened)=\"onPopupOpened()\"\n (applyAction)=\"applyFilter()\"\n (cancelAction)=\"clearAllFilters()\"\n (closed)=\"close()\">\n</kit-popup>\n\n<ng-template #content>\n <div class=\"popup-content\">\n @for (item of filterItems().filters; track $index) {\n <div class=\"filter-item\">\n <kit-dropdown [items]=\"getFilterOperatorDropdownItems()\"\n [size]=\"kitDropdownSize.SMALL\"\n [selectedItem]=\"$any(item.operator)\"\n (selected)=\"onOperatorSelect($event.value, $index)\"\n ></kit-dropdown>\n <div class=\"filter-controls\">\n @switch (filterInputType()) {\n @case (kitFilterType.TEXT) {\n <kit-textbox class=\"filter-item-value\"\n [size]=\"kitTextboxSize.SMALL\"\n [defaultValue]=\"item.value\"\n [disabled]=\"isFilterValueTextboxDisabled($index)\"\n (changed)=\"onValueChange($event, $index)\"\n (keydown.enter)=\"onEnterKey()\"\n ></kit-textbox>\n }\n @case (kitFilterType.NUMERIC) {\n <kit-numeric-textbox class=\"filter-item-value\"\n format=\"#.###\"\n [size]=\"kitNumericTextboxSize.SMALL\"\n [defaultValue]=\"item.value\"\n [min]=\"0\"\n [max]=\"maxIntegerValue\"\n [disabled]=\"isFilterValueTextboxDisabled($index)\"\n (changed)=\"onValueChange($event, $index)\"\n (keydown.enter)=\"onEnterKey()\"\n ></kit-numeric-textbox>\n }\n }\n @if ($index === 0) {\n <kit-dropdown class=\"logic-selector\"\n [selectedItem]=\"filterItems().logic\"\n [items]=\"filterLogicDropdownItems\"\n [size]=\"kitDropdownSize.SMALL\"\n (selected)=\"onLogicChange($event.value)\"\n ></kit-dropdown>\n }\n </div>\n </div>\n }\n </div>\n</ng-template>\n", styles: [".kit-filter-input-selected-values{max-width:180px}::ng-deep .kit-filter-input-popup .popup-content{display:flex;flex-direction:column;gap:10px;width:296px;box-sizing:border-box}::ng-deep .kit-filter-input-popup .filter-item{display:flex;flex-direction:column;gap:10px}::ng-deep .kit-filter-input-popup .filter-item-value{flex:1}::ng-deep .kit-filter-input-popup .filter-controls{display:flex;gap:10px}::ng-deep .kit-filter-input-popup .logic-selector{flex-shrink:0;width:100px}\n"], dependencies: [{ kind: "component", type: KitDropdownComponent, selector: "kit-dropdown", inputs: ["items", "selectedItem", "label", "disabled", "messageIcon", "messageText", "invalid", "defaultItem", "listHeight", "hideDefaultItem", "toggleIcon", "popupSettings", "isValuePrimitive", "footerTemplate", "noDataTemplate", "readonly", "size"], outputs: ["selectedItemChange", "disabledChange", "selected"] }, { kind: "component", type: KitPillComponent, selector: "kit-pill", inputs: ["removable", "selectable", "selected", "type", "theme", "icon", "iconType"], outputs: ["clicked", "removed"] }, { kind: "component", type: KitPopupComponent, selector: "kit-popup", inputs: ["anchor", "content", "closeOnOutsideClick", "showFooter", "cancelButtonLabel", "applyButtonLabel", "isApplyButtonDisabled", "positionMode", "popupClass", "closePopupOnCancel", "extraInsideSelectors"], outputs: ["cancelAction", "applyAction", "opened", "closed"] }, { kind: "component", type: KitTextboxComponent, selector: "kit-textbox", inputs: ["placeholder", "label", "labelTooltip", "defaultValue", "messageIcon", "messageText", "messageTemplate", "disabled", "maxlength", "state", "size", "icon", "clearButton", "showStateIcon", "readonly", "customStateIcon", "type"], outputs: ["defaultValueChange", "disabledChange", "blured", "focused", "changed"] }, { kind: "component", type: KitNumericTextboxComponent, selector: "kit-numeric-textbox", inputs: ["placeholder", "label", "defaultValue", "decimals", "min", "max", "maxlength", "messageIcon", "messageText", "disabled", "format", "state", "icon", "size", "showStateIcon", "readonly"], outputs: ["defaultValueChange", "disabledChange", "blured", "changed"] }, { kind: "component", type: KitTruncateTextComponent, selector: "kit-truncate-text", inputs: ["tooltipText", "lines", "innerHtml"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
15453
15436
|
}
|
|
15454
15437
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KitFilterInputComponent, decorators: [{
|
|
15455
15438
|
type: Component,
|
|
@@ -15461,7 +15444,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImpor
|
|
|
15461
15444
|
TranslatePipe,
|
|
15462
15445
|
KitNumericTextboxComponent,
|
|
15463
15446
|
KitTruncateTextComponent,
|
|
15464
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<kit-pill #toggleButton\n [selectable]=\"!filter().readonly\"\n [selected]=\"popup.isPopupOpen\"\n [removable]=\"!filter().readonly &&
|
|
15447
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<kit-pill #toggleButton\n [selectable]=\"!filter().readonly\"\n [selected]=\"popup.isPopupOpen\"\n [removable]=\"!filter().readonly && (filter().removable ?? true)\"\n [theme]=\"filter().readonly && kitPillTheme.BLUE || kitPillTheme.DEFAULT\"\n (removed)=\"removeFilter()\"\n (clicked)=\"onPopupToggle()\">\n {{ filter().title | translate }}:\n @if (selectedValues()?.filters; as selectedFilters) {\n <kit-truncate-text class=\"kit-filter-input-selected-values\">\n @for (filter of selectedFilters; track $index) {\n {{ getSelectedFilterText(filter) }}\n\n @if ($index === 0) {\n {{ getSelectedLogicText(selectedValues()) }}\n }\n }\n </kit-truncate-text>\n }\n</kit-pill>\n\n<kit-popup #popup\n popupClass=\"kit-filter-input-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 [extraInsideSelectors]=\"['.kit-dropdown-popup']\"\n (opened)=\"onPopupOpened()\"\n (applyAction)=\"applyFilter()\"\n (cancelAction)=\"clearAllFilters()\"\n (closed)=\"close()\">\n</kit-popup>\n\n<ng-template #content>\n <div class=\"popup-content\">\n @for (item of filterItems().filters; track $index) {\n <div class=\"filter-item\">\n <kit-dropdown [items]=\"getFilterOperatorDropdownItems()\"\n [size]=\"kitDropdownSize.SMALL\"\n [selectedItem]=\"$any(item.operator)\"\n (selected)=\"onOperatorSelect($event.value, $index)\"\n ></kit-dropdown>\n <div class=\"filter-controls\">\n @switch (filterInputType()) {\n @case (kitFilterType.TEXT) {\n <kit-textbox class=\"filter-item-value\"\n [size]=\"kitTextboxSize.SMALL\"\n [defaultValue]=\"item.value\"\n [disabled]=\"isFilterValueTextboxDisabled($index)\"\n (changed)=\"onValueChange($event, $index)\"\n (keydown.enter)=\"onEnterKey()\"\n ></kit-textbox>\n }\n @case (kitFilterType.NUMERIC) {\n <kit-numeric-textbox class=\"filter-item-value\"\n format=\"#.###\"\n [size]=\"kitNumericTextboxSize.SMALL\"\n [defaultValue]=\"item.value\"\n [min]=\"0\"\n [max]=\"maxIntegerValue\"\n [disabled]=\"isFilterValueTextboxDisabled($index)\"\n (changed)=\"onValueChange($event, $index)\"\n (keydown.enter)=\"onEnterKey()\"\n ></kit-numeric-textbox>\n }\n }\n @if ($index === 0) {\n <kit-dropdown class=\"logic-selector\"\n [selectedItem]=\"filterItems().logic\"\n [items]=\"filterLogicDropdownItems\"\n [size]=\"kitDropdownSize.SMALL\"\n (selected)=\"onLogicChange($event.value)\"\n ></kit-dropdown>\n }\n </div>\n </div>\n }\n </div>\n</ng-template>\n", styles: [".kit-filter-input-selected-values{max-width:180px}::ng-deep .kit-filter-input-popup .popup-content{display:flex;flex-direction:column;gap:10px;width:296px;box-sizing:border-box}::ng-deep .kit-filter-input-popup .filter-item{display:flex;flex-direction:column;gap:10px}::ng-deep .kit-filter-input-popup .filter-item-value{flex:1}::ng-deep .kit-filter-input-popup .filter-controls{display:flex;gap:10px}::ng-deep .kit-filter-input-popup .logic-selector{flex-shrink:0;width:100px}\n"] }]
|
|
15465
15448
|
}], propDecorators: { filter: [{ type: i0.Input, args: [{ isSignal: true, alias: "filter", required: true }] }], filterInputType: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterInputType", required: true }] }], filterRemoved: [{ type: i0.Output, args: ["filterRemoved"] }], filterChanged: [{ type: i0.Output, args: ["filterChanged"] }], anchor: [{ type: i0.ViewChild, args: ['toggleButton', { ...{ read: ElementRef }, isSignal: true }] }], textboxComponents: [{ type: i0.ViewChildren, args: [i0.forwardRef(() => KitTextboxComponent), { isSignal: true }] }], numericTextboxComponents: [{ type: i0.ViewChildren, args: [i0.forwardRef(() => KitNumericTextboxComponent), { isSignal: true }] }], popup: [{ type: i0.ViewChild, args: ['popup', { ...{ read: KitPopupComponent }, isSignal: true }] }] } });
|
|
15466
15449
|
|
|
15467
15450
|
class KitFilterNullCheckComponent {
|
|
@@ -15489,9 +15472,6 @@ class KitFilterNullCheckComponent {
|
|
|
15489
15472
|
get isPopupOpen() {
|
|
15490
15473
|
return !!this.popup()?.isPopupOpen;
|
|
15491
15474
|
}
|
|
15492
|
-
get displayedValue() {
|
|
15493
|
-
return this.selectedOption()?.label ?? '';
|
|
15494
|
-
}
|
|
15495
15475
|
ngOnInit() {
|
|
15496
15476
|
this.options.set([
|
|
15497
15477
|
{ label: this.nullLabel(), value: KitFilterOperator.IS_NULL, checked: false },
|
|
@@ -15533,11 +15513,17 @@ class KitFilterNullCheckComponent {
|
|
|
15533
15513
|
}
|
|
15534
15514
|
close() {
|
|
15535
15515
|
if (!this.filter().value && !this.selectedOption()) {
|
|
15536
|
-
this.
|
|
15537
|
-
|
|
15538
|
-
else {
|
|
15539
|
-
this.initializeSelectedOption();
|
|
15516
|
+
this.clearFilter();
|
|
15517
|
+
return;
|
|
15540
15518
|
}
|
|
15519
|
+
this.initializeSelectedOption();
|
|
15520
|
+
}
|
|
15521
|
+
onRadioButtonChange(option) {
|
|
15522
|
+
this.onOptionChange({
|
|
15523
|
+
label: option.label,
|
|
15524
|
+
value: option.value,
|
|
15525
|
+
checked: true,
|
|
15526
|
+
});
|
|
15541
15527
|
}
|
|
15542
15528
|
onOptionChange(option) {
|
|
15543
15529
|
this.selectedOption.set({ ...option, checked: true });
|
|
@@ -15556,7 +15542,7 @@ class KitFilterNullCheckComponent {
|
|
|
15556
15542
|
this.onOptionChange(option ?? this.options()[0]);
|
|
15557
15543
|
}
|
|
15558
15544
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KitFilterNullCheckComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
15559
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.1.1", type: KitFilterNullCheckComponent, isStandalone: true, selector: "kit-filter-null-check", inputs: { filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: true, transformFunction: null }, nullLabel: { classPropertyName: "nullLabel", publicName: "nullLabel", isSignal: true, isRequired: false, transformFunction: null }, notNullLabel: { classPropertyName: "notNullLabel", publicName: "notNullLabel", isSignal: true, isRequired: false, transformFunction: null }, showPopupOnInit: { classPropertyName: "showPopupOnInit", publicName: "showPopupOnInit", isSignal: true, isRequired: false, transformFunction: null }, selectedOption: { classPropertyName: "selectedOption", publicName: "selectedOption", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { filterRemoved: "filterRemoved", filterChanged: "filterChanged", selectedOption: "selectedOptionChange", options: "optionsChange" }, 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-null\">\n <kit-pill #toggleButton\n [selectable]=\"!filter().readonly\"\n [selected]=\"popup.isPopupOpen\"\n [removable]=\"!filter().readonly &&
|
|
15545
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.1.1", type: KitFilterNullCheckComponent, isStandalone: true, selector: "kit-filter-null-check", inputs: { filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: true, transformFunction: null }, nullLabel: { classPropertyName: "nullLabel", publicName: "nullLabel", isSignal: true, isRequired: false, transformFunction: null }, notNullLabel: { classPropertyName: "notNullLabel", publicName: "notNullLabel", isSignal: true, isRequired: false, transformFunction: null }, showPopupOnInit: { classPropertyName: "showPopupOnInit", publicName: "showPopupOnInit", isSignal: true, isRequired: false, transformFunction: null }, selectedOption: { classPropertyName: "selectedOption", publicName: "selectedOption", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { filterRemoved: "filterRemoved", filterChanged: "filterChanged", selectedOption: "selectedOptionChange", options: "optionsChange" }, 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-null\">\n <kit-pill #toggleButton\n [selectable]=\"!filter().readonly\"\n [selected]=\"popup.isPopupOpen\"\n [removable]=\"!filter().readonly && (filter().removable ?? true)\"\n [theme]=\"filter().readonly && kitPillTheme.BLUE || kitPillTheme.DEFAULT\"\n (removed)=\"removeFilter()\"\n (clicked)=\"onPopupToggle()\">\n {{ filter().title | translate }}: {{ selectedOption()?.label }}\n </kit-pill>\n</div>\n\n<kit-popup #popup\n popupClass=\"kit-filter-null-popup\"\n [anchor]=\"anchor()\"\n [content]=\"content\"\n [showFooter]=\"true\"\n [applyButtonLabel]=\"'kit.filters.apply' | translate\"\n [cancelButtonLabel]=\"'kit.filters.clear' | translate\"\n [closePopupOnCancel]=\"false\"\n (applyAction)=\"applyFilter()\"\n (cancelAction)=\"clearFilter()\"\n (closed)=\"close()\">\n</kit-popup>\n\n<ng-template #content>\n <div class=\"popup-content\">\n <kit-radio-button [items]=\"options()\"\n (changed)=\"onRadioButtonChange($event)\"\n ></kit-radio-button>\n </div>\n</ng-template>\n", styles: ["::ng-deep .kit-filter-null-popup .popup-content{width:172px}::ng-deep .kit-filter-null-popup .kit-radio-button .kit-radio-button-items{flex-direction:column;gap:0}\n"], dependencies: [{ kind: "component", type: KitPillComponent, selector: "kit-pill", inputs: ["removable", "selectable", "selected", "type", "theme", "icon", "iconType"], outputs: ["clicked", "removed"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: KitPopupComponent, selector: "kit-popup", inputs: ["anchor", "content", "closeOnOutsideClick", "showFooter", "cancelButtonLabel", "applyButtonLabel", "isApplyButtonDisabled", "positionMode", "popupClass", "closePopupOnCancel", "extraInsideSelectors"], outputs: ["cancelAction", "applyAction", "opened", "closed"] }, { kind: "component", type: KitRadioButtonComponent, selector: "kit-radio-button", inputs: ["items", "label", "name", "readonly", "type", "value", "checked", "icon", "disabled"], outputs: ["checkedChange", "disabledChange", "changed"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
15560
15546
|
}
|
|
15561
15547
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KitFilterNullCheckComponent, decorators: [{
|
|
15562
15548
|
type: Component,
|
|
@@ -15566,7 +15552,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImpor
|
|
|
15566
15552
|
FormsModule,
|
|
15567
15553
|
KitPopupComponent,
|
|
15568
15554
|
KitRadioButtonComponent,
|
|
15569
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"kit-filter-null\">\n <kit-pill #toggleButton\n [selectable]=\"!filter().readonly\"\n [selected]=\"popup.isPopupOpen\"\n [removable]=\"!filter().readonly &&
|
|
15555
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"kit-filter-null\">\n <kit-pill #toggleButton\n [selectable]=\"!filter().readonly\"\n [selected]=\"popup.isPopupOpen\"\n [removable]=\"!filter().readonly && (filter().removable ?? true)\"\n [theme]=\"filter().readonly && kitPillTheme.BLUE || kitPillTheme.DEFAULT\"\n (removed)=\"removeFilter()\"\n (clicked)=\"onPopupToggle()\">\n {{ filter().title | translate }}: {{ selectedOption()?.label }}\n </kit-pill>\n</div>\n\n<kit-popup #popup\n popupClass=\"kit-filter-null-popup\"\n [anchor]=\"anchor()\"\n [content]=\"content\"\n [showFooter]=\"true\"\n [applyButtonLabel]=\"'kit.filters.apply' | translate\"\n [cancelButtonLabel]=\"'kit.filters.clear' | translate\"\n [closePopupOnCancel]=\"false\"\n (applyAction)=\"applyFilter()\"\n (cancelAction)=\"clearFilter()\"\n (closed)=\"close()\">\n</kit-popup>\n\n<ng-template #content>\n <div class=\"popup-content\">\n <kit-radio-button [items]=\"options()\"\n (changed)=\"onRadioButtonChange($event)\"\n ></kit-radio-button>\n </div>\n</ng-template>\n", styles: ["::ng-deep .kit-filter-null-popup .popup-content{width:172px}::ng-deep .kit-filter-null-popup .kit-radio-button .kit-radio-button-items{flex-direction:column;gap:0}\n"] }]
|
|
15570
15556
|
}], propDecorators: { filter: [{ type: i0.Input, args: [{ isSignal: true, alias: "filter", required: true }] }], nullLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "nullLabel", required: false }] }], notNullLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "notNullLabel", required: false }] }], showPopupOnInit: [{ type: i0.Input, args: [{ isSignal: true, alias: "showPopupOnInit", required: false }] }], filterRemoved: [{ type: i0.Output, args: ["filterRemoved"] }], filterChanged: [{ type: i0.Output, args: ["filterChanged"] }], anchor: [{ type: i0.ViewChild, args: ['toggleButton', { ...{ read: ElementRef }, isSignal: true }] }], popup: [{ type: i0.ViewChild, args: ['popup', { ...{ read: KitPopupComponent }, isSignal: true }] }], selectedOption: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedOption", required: false }] }, { type: i0.Output, args: ["selectedOptionChange"] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }, { type: i0.Output, args: ["optionsChange"] }] } });
|
|
15571
15557
|
|
|
15572
15558
|
class KitFilterRadioComponent {
|
|
@@ -15613,10 +15599,10 @@ class KitFilterRadioComponent {
|
|
|
15613
15599
|
const selectedValue = this.selectedValue();
|
|
15614
15600
|
if (selectedValue) {
|
|
15615
15601
|
this.updateItemsState();
|
|
15602
|
+
return;
|
|
15616
15603
|
}
|
|
15617
|
-
|
|
15618
|
-
|
|
15619
|
-
}
|
|
15604
|
+
this.radioButtonValue.set(null);
|
|
15605
|
+
this.clearAllFilters();
|
|
15620
15606
|
}
|
|
15621
15607
|
applyFilter() {
|
|
15622
15608
|
const filterValue = {
|
|
@@ -15681,7 +15667,7 @@ class KitFilterRadioComponent {
|
|
|
15681
15667
|
}
|
|
15682
15668
|
}
|
|
15683
15669
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KitFilterRadioComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
15684
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: KitFilterRadioComponent, isStandalone: true, selector: "kit-filter-radio", 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-radio\">\n <kit-pill #toggleButton\n [selectable]=\"!filter().readonly\"\n [selected]=\"popup.isPopupOpen\"\n [removable]=\"!filter().readonly &&
|
|
15670
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: KitFilterRadioComponent, isStandalone: true, selector: "kit-filter-radio", 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-radio\">\n <kit-pill #toggleButton\n [selectable]=\"!filter().readonly\"\n [selected]=\"popup.isPopupOpen\"\n [removable]=\"!filter().readonly && (filter().removable ?? true)\"\n [theme]=\"filter().readonly && kitPillTheme.BLUE || kitPillTheme.DEFAULT\"\n (removed)=\"removeFilter()\"\n (clicked)=\"onPopupToggle()\">\n {{ filter().title | translate }}:\n @if (hasSelectedFilters(selectedFilterValue)) {\n <kit-truncate-text class=\"kit-filter-radio-selected-values\">\n {{ getSelectedFilterText(selectedFilterValue) | translate }}\n </kit-truncate-text>\n }\n </kit-pill>\n</div>\n\n<kit-popup #popup\n popupClass=\"kit-filter-radio-popup\"\n [anchor]=\"anchor()\"\n [content]=\"content\"\n [showFooter]=\"true\"\n [applyButtonLabel]=\"'kit.filters.apply' | translate\"\n [cancelButtonLabel]=\"'kit.filters.clear' | translate\"\n [closePopupOnCancel]=\"false\"\n (applyAction)=\"applyFilter()\"\n (cancelAction)=\"clearAllFilters()\"\n (closed)=\"close()\">\n</kit-popup>\n\n<ng-template #content>\n <div class=\"popup-content\">\n <kit-radio-button [items]=\"buildRadioButtonItems(items())\"\n (changed)=\"onRadioButtonChange($event)\"\n ></kit-radio-button>\n </div>\n</ng-template>\n", styles: [".kit-filter-radio-selected-values{max-width:180px}::ng-deep .kit-filter-radio-popup .popup-content{width:172px;max-height:400px;overflow-y:auto}::ng-deep .kit-filter-radio-popup .kit-radio-button .kit-radio-button-items{flex-direction:column;gap:0}\n"], dependencies: [{ kind: "component", type: KitPillComponent, selector: "kit-pill", inputs: ["removable", "selectable", "selected", "type", "theme", "icon", "iconType"], outputs: ["clicked", "removed"] }, { kind: "component", type: KitPopupComponent, selector: "kit-popup", inputs: ["anchor", "content", "closeOnOutsideClick", "showFooter", "cancelButtonLabel", "applyButtonLabel", "isApplyButtonDisabled", "positionMode", "popupClass", "closePopupOnCancel", "extraInsideSelectors"], outputs: ["cancelAction", "applyAction", "opened", "closed"] }, { kind: "component", type: KitRadioButtonComponent, selector: "kit-radio-button", inputs: ["items", "label", "name", "readonly", "type", "value", "checked", "icon", "disabled"], outputs: ["checkedChange", "disabledChange", "changed"] }, { kind: "component", type: KitTruncateTextComponent, selector: "kit-truncate-text", inputs: ["tooltipText", "lines", "innerHtml"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
15685
15671
|
}
|
|
15686
15672
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KitFilterRadioComponent, decorators: [{
|
|
15687
15673
|
type: Component,
|
|
@@ -15691,7 +15677,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImpor
|
|
|
15691
15677
|
KitPopupComponent,
|
|
15692
15678
|
KitRadioButtonComponent,
|
|
15693
15679
|
KitTruncateTextComponent,
|
|
15694
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"kit-filter-radio\">\n <kit-pill #toggleButton\n [selectable]=\"!filter().readonly\"\n [selected]=\"popup.isPopupOpen\"\n [removable]=\"!filter().readonly &&
|
|
15680
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"kit-filter-radio\">\n <kit-pill #toggleButton\n [selectable]=\"!filter().readonly\"\n [selected]=\"popup.isPopupOpen\"\n [removable]=\"!filter().readonly && (filter().removable ?? true)\"\n [theme]=\"filter().readonly && kitPillTheme.BLUE || kitPillTheme.DEFAULT\"\n (removed)=\"removeFilter()\"\n (clicked)=\"onPopupToggle()\">\n {{ filter().title | translate }}:\n @if (hasSelectedFilters(selectedFilterValue)) {\n <kit-truncate-text class=\"kit-filter-radio-selected-values\">\n {{ getSelectedFilterText(selectedFilterValue) | translate }}\n </kit-truncate-text>\n }\n </kit-pill>\n</div>\n\n<kit-popup #popup\n popupClass=\"kit-filter-radio-popup\"\n [anchor]=\"anchor()\"\n [content]=\"content\"\n [showFooter]=\"true\"\n [applyButtonLabel]=\"'kit.filters.apply' | translate\"\n [cancelButtonLabel]=\"'kit.filters.clear' | translate\"\n [closePopupOnCancel]=\"false\"\n (applyAction)=\"applyFilter()\"\n (cancelAction)=\"clearAllFilters()\"\n (closed)=\"close()\">\n</kit-popup>\n\n<ng-template #content>\n <div class=\"popup-content\">\n <kit-radio-button [items]=\"buildRadioButtonItems(items())\"\n (changed)=\"onRadioButtonChange($event)\"\n ></kit-radio-button>\n </div>\n</ng-template>\n", styles: [".kit-filter-radio-selected-values{max-width:180px}::ng-deep .kit-filter-radio-popup .popup-content{width:172px;max-height:400px;overflow-y:auto}::ng-deep .kit-filter-radio-popup .kit-radio-button .kit-radio-button-items{flex-direction:column;gap:0}\n"] }]
|
|
15695
15681
|
}], propDecorators: { filter: [{ type: i0.Input, args: [{ isSignal: true, alias: "filter", required: true }] }], translateKeyPrefix: [{ type: i0.Input, args: [{ isSignal: true, alias: "translateKeyPrefix", required: false }] }], items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }, { type: i0.Output, args: ["itemsChange"] }], filterRemoved: [{ type: i0.Output, args: ["filterRemoved"] }], filterChanged: [{ type: i0.Output, args: ["filterChanged"] }], anchor: [{ type: i0.ViewChild, args: ['toggleButton', { ...{ read: ElementRef }, isSignal: true }] }], popup: [{ type: i0.ViewChild, args: ['popup', { ...{ read: KitPopupComponent }, isSignal: true }] }] } });
|
|
15696
15682
|
|
|
15697
15683
|
class KitFilterSelectorComponent {
|
|
@@ -15805,11 +15791,17 @@ class KitGridFiltersComponent {
|
|
|
15805
15791
|
getDateFilterConstraint(filter) {
|
|
15806
15792
|
return this.columns().find(col => col.field === filter.field)?.dateFilterConstraint;
|
|
15807
15793
|
}
|
|
15794
|
+
getCheckboxFilterItems(field) {
|
|
15795
|
+
return this.filterListConfig()[field].items.map(item => ({
|
|
15796
|
+
...item,
|
|
15797
|
+
value: String(item.value),
|
|
15798
|
+
}));
|
|
15799
|
+
}
|
|
15808
15800
|
isFilterSelectorItemDisabled(item, filters) {
|
|
15809
15801
|
return filters.some(filter => filter.field === item.field || filter.field === item.apiField);
|
|
15810
15802
|
}
|
|
15811
15803
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KitGridFiltersComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
15812
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", 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 }, useLocalTimeZone: { classPropertyName: "useLocalTimeZone", publicName: "useLocalTimeZone", isSignal: true, isRequired: false, transformFunction: null }, nullLabel: { classPropertyName: "nullLabel", publicName: "nullLabel", isSignal: true, isRequired: false, transformFunction: null }, notNullLabel: { classPropertyName: "notNullLabel", publicName: "notNullLabel", isSignal: true, isRequired: false, 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]=\"
|
|
15804
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", 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 }, useLocalTimeZone: { classPropertyName: "useLocalTimeZone", publicName: "useLocalTimeZone", isSignal: true, isRequired: false, transformFunction: null }, nullLabel: { classPropertyName: "nullLabel", publicName: "nullLabel", isSignal: true, isRequired: false, transformFunction: null }, notNullLabel: { classPropertyName: "notNullLabel", publicName: "notNullLabel", isSignal: true, isRequired: false, 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]=\"getCheckboxFilterItems(item.field)\"\n [translateKeyPrefix]=\"filterListConfig()[item.field].translateKeyPrefix\"\n (filterRemoved)=\"removeFilter(item.field)\"\n (filterChanged)=\"applyFilter(item, $event)\"\n ></kit-filter-checkbox>\n }\n @case (kitFilterType.GUID) {\n <kit-filter-checkbox [filter]=\"item\"\n [items]=\"getCheckboxFilterItems(item.field)\"\n [guidField]=\"filterListConfig()[item.field].guidField ?? ''\"\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 [useLocalTimeZone]=\"useLocalTimeZone() || isLocalDateColumn(item)\"\n [useUserTimeZone]=\"useUserTimeZone(item)\"\n [dateFilterConstraint]=\"getDateFilterConstraint(item)\"\n (filterRemoved)=\"removeFilter(item.field)\"\n (filterChanged)=\"applyFilter(item, $event)\"\n ></kit-filter-date>\n }\n @case (kitFilterType.TEXT) {\n <kit-filter-input [filterInputType]=\"kitFilterType.TEXT\"\n [filter]=\"item\"\n (filterRemoved)=\"removeFilter(item.field)\"\n (filterChanged)=\"applyFilter(item, $event)\"\n ></kit-filter-input>\n }\n @case (kitFilterType.NUMERIC) {\n <kit-filter-input [filterInputType]=\"kitFilterType.NUMERIC\"\n [filter]=\"item\"\n (filterRemoved)=\"removeFilter(item.field)\"\n (filterChanged)=\"applyFilter(item, $event)\"\n ></kit-filter-input>\n }\n @case (kitFilterType.NULL) {\n <kit-filter-null-check [filter]=\"item\"\n [nullLabel]=\"nullLabel()\"\n [notNullLabel]=\"notNullLabel()\"\n (filterRemoved)=\"removeFilter(item.field)\"\n (filterChanged)=\"applyFilter(item, $event)\"\n ></kit-filter-null-check>\n }\n @case (kitFilterType.CUSTOM_INPUT) {\n <kit-filter-custom-input [filter]=\"item\"\n (filterRemoved)=\"removeFilter(item.field)\"\n (filterChanged)=\"applyFilter(item, $event)\"\n ></kit-filter-custom-input>\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}::ng-deep .kit-pill-content{white-space:nowrap}\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", "guidField"], outputs: ["itemsChange", "filterRemoved", "filterChanged"] }, { kind: "component", type: KitFilterDateComponent, selector: "kit-filter-date", inputs: ["filter", "useUserTimeZone", "useLocalTimeZone", "dateFilterConstraint"], outputs: ["filterRemoved", "filterChanged"] }, { kind: "component", type: KitFilterRadioComponent, selector: "kit-filter-radio", inputs: ["filter", "translateKeyPrefix", "items"], outputs: ["itemsChange", "filterRemoved", "filterChanged"] }, { kind: "component", type: KitFilterInputComponent, selector: "kit-filter-input", inputs: ["filter", "filterInputType"], outputs: ["filterRemoved", "filterChanged"] }, { kind: "component", type: KitFilterNullCheckComponent, selector: "kit-filter-null-check", inputs: ["filter", "nullLabel", "notNullLabel", "showPopupOnInit", "selectedOption", "options"], outputs: ["filterRemoved", "filterChanged", "selectedOptionChange", "optionsChange"] }, { kind: "component", type: KitFilterCustomInputComponent, selector: "kit-filter-custom-input", inputs: ["filter"], outputs: ["filterRemoved", "filterChanged"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
15813
15805
|
}
|
|
15814
15806
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KitGridFiltersComponent, decorators: [{
|
|
15815
15807
|
type: Component,
|
|
@@ -15821,7 +15813,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImpor
|
|
|
15821
15813
|
KitFilterInputComponent,
|
|
15822
15814
|
KitFilterNullCheckComponent,
|
|
15823
15815
|
KitFilterCustomInputComponent,
|
|
15824
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, 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]=\"
|
|
15816
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, 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]=\"getCheckboxFilterItems(item.field)\"\n [translateKeyPrefix]=\"filterListConfig()[item.field].translateKeyPrefix\"\n (filterRemoved)=\"removeFilter(item.field)\"\n (filterChanged)=\"applyFilter(item, $event)\"\n ></kit-filter-checkbox>\n }\n @case (kitFilterType.GUID) {\n <kit-filter-checkbox [filter]=\"item\"\n [items]=\"getCheckboxFilterItems(item.field)\"\n [guidField]=\"filterListConfig()[item.field].guidField ?? ''\"\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 [useLocalTimeZone]=\"useLocalTimeZone() || isLocalDateColumn(item)\"\n [useUserTimeZone]=\"useUserTimeZone(item)\"\n [dateFilterConstraint]=\"getDateFilterConstraint(item)\"\n (filterRemoved)=\"removeFilter(item.field)\"\n (filterChanged)=\"applyFilter(item, $event)\"\n ></kit-filter-date>\n }\n @case (kitFilterType.TEXT) {\n <kit-filter-input [filterInputType]=\"kitFilterType.TEXT\"\n [filter]=\"item\"\n (filterRemoved)=\"removeFilter(item.field)\"\n (filterChanged)=\"applyFilter(item, $event)\"\n ></kit-filter-input>\n }\n @case (kitFilterType.NUMERIC) {\n <kit-filter-input [filterInputType]=\"kitFilterType.NUMERIC\"\n [filter]=\"item\"\n (filterRemoved)=\"removeFilter(item.field)\"\n (filterChanged)=\"applyFilter(item, $event)\"\n ></kit-filter-input>\n }\n @case (kitFilterType.NULL) {\n <kit-filter-null-check [filter]=\"item\"\n [nullLabel]=\"nullLabel()\"\n [notNullLabel]=\"notNullLabel()\"\n (filterRemoved)=\"removeFilter(item.field)\"\n (filterChanged)=\"applyFilter(item, $event)\"\n ></kit-filter-null-check>\n }\n @case (kitFilterType.CUSTOM_INPUT) {\n <kit-filter-custom-input [filter]=\"item\"\n (filterRemoved)=\"removeFilter(item.field)\"\n (filterChanged)=\"applyFilter(item, $event)\"\n ></kit-filter-custom-input>\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}::ng-deep .kit-pill-content{white-space:nowrap}\n"] }]
|
|
15825
15817
|
}], propDecorators: { excludedColumns: [{ type: i0.Input, args: [{ isSignal: true, alias: "excludedColumns", required: true }] }], columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: true }] }], filterListConfig: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterListConfig", required: true }] }], useLocalTimeZone: [{ type: i0.Input, args: [{ isSignal: true, alias: "useLocalTimeZone", required: false }] }], nullLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "nullLabel", required: false }] }], notNullLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "notNullLabel", required: false }] }], filterChanged: [{ type: i0.Output, args: ["filterChanged"] }] } });
|
|
15826
15818
|
|
|
15827
15819
|
class KitGridFiltersToggleComponent {
|