@progress/kendo-angular-filter 2.1.0-dev.202206081432 → 2.1.0-dev.202206150812

package/bundles/kendo-angular-filter.umd.js

@@ -2,4 +2,4 @@
 * Copyright © 2021 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@progress/kendo-angular-l10n"),require("@progress/kendo-licensing"),require("@progress/kendo-angular-dropdowns"),require("@progress/kendo-angular-inputs"),require("@progress/kendo-angular-dateinputs"),require("@angular/common"),require("@progress/kendo-angular-buttons"),require("@progress/kendo-angular-label")):"function"==typeof define&&define.amd?define("KendoAngularFilter",["exports","@angular/core","@progress/kendo-angular-l10n","@progress/kendo-licensing","@progress/kendo-angular-dropdowns","@progress/kendo-angular-inputs","@progress/kendo-angular-dateinputs","@angular/common","@progress/kendo-angular-buttons","@progress/kendo-angular-label"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoAngularFilter={},e.ng.core,e.KendoAngularL10N,e.KendoLicensing,e.KendoAngularDropdowns,e.KendoAngularInputs,e.KendoAngularDateinputs,e.ng.common,e.KendoAngularButtons,e.KendoAngularLabel)}(this,function(e,n,t,z,r,o,i,a,l,s){"use strict";function p(r){if(r&&r.__esModule)return r;var n=Object.create(null);return r&&Object.keys(r).forEach(function(e){var t;"default"!==e&&(t=Object.getOwnPropertyDescriptor(r,e),Object.defineProperty(n,e,t.get?t:{enumerable:!0,get:function(){return r[e]}}))}),n.default=r,Object.freeze(n)}var u=p(n),d=p(t),f=p(r),c=p(o),m=p(i),g=p(a),h=p(l),v=(I.prototype.addFilterGroup=function(e){e.filters.push({logic:"and",filters:[]})},I.prototype.addFilterExpression=function(e){e.filters.push({operator:"eq",value:null,field:null})},I.prototype.remove=function(t,r,e){var n,o=this;e=e||this.normalizedValue,t===e?e.filters=[]:0<=(n=e.filters.indexOf(t))&&n===r?e.filters=e.filters.filter(function(e){return e!==t}):e.filters.forEach(function(e){return e.filters&&o.remove(t,r,e)})},I);function I(){this.normalizedValue={logic:"and",filters:[]},this.filters=[]}v.ɵfac=u.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:v,deps:[],target:u.ɵɵFactoryTarget.Injectable}),v.ɵprov=u.ɵɵngDeclareInjectable({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:v}),u.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:v,decorators:[{type:n.Injectable}]});function b(t,r){return Object.keys(t).find(function(e){return t[e]===r})}function y(r){return function(t){return Object.keys(r).map(function(e){return{text:t.get(e),value:r[e]}})}}var k=["isnull","isnotnull","isempty","isnotempty"],M={filterEqOperator:"eq",filterNotEqOperator:"neq",filterContainsOperator:"contains",filterNotContainsOperator:"doesnotcontain",filterStartsWithOperator:"startswith",filterEndsWithOperator:"endswith",filterIsNullOperator:"isnull",filterIsNotNullOperator:"isnotnull",filterIsEmptyOperator:"isempty",filterIsNotEmptyOperator:"isnotempty"},B={filterEqOperator:"eq",filterNotEqOperator:"neq",filterGteOperator:"gte",filterGtOperator:"gt",filterLteOperator:"lte",filterLtOperator:"lt",filterIsNullOperator:"isnull",filterIsNotNullOperator:"isnotnull"},G={filterEqOperator:"eq",filterNotEqOperator:"neq",filterAfterOrEqualOperator:"gte",filterAfterOperator:"gt",filterBeforeOrEqualOperator:"lte",filterBeforeOperator:"lt",filterIsNullOperator:"isnull",filterIsNotNullOperator:"isnotnull"},P={string:M,number:B,date:G},j={filterAndLogic:"and",filterOrLogic:"or"},R={name:"@progress/kendo-angular-filter",productName:"Kendo UI for Angular",productCodes:["KENDOUIANGULAR","KENDOUICOMPLETE"],publishDate:1654698725,version:"",licensingDocsUrl:"https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning"},O=(Object.defineProperty(_.prototype,"title",{get:function(){return this._title},set:function(e){this._title=e||this.field},enumerable:!1,configurable:!0}),_);function _(){}O.ɵfac=u.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:O,deps:[],target:u.ɵɵFactoryTarget.Component}),O.ɵcmp=u.ɵɵngDeclareComponent({minVersion:"12.0.0",version:"12.2.16",type:O,selector:"kendo-filter-field",inputs:{field:"field",title:"title",editor:"editor",operators:"operators"},ngImport:u,template:"",isInline:!0}),u.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:O,decorators:[{type:n.Component,args:[{selector:"kendo-filter-field",template:""}]}],propDecorators:{field:[{type:n.Input}],title:[{type:n.Input}],editor:[{type:n.Input}],operators:[{type:n.Input}]}});W.prototype.ngOnChanges=function(){var e=this.hostElement.nativeElement.querySelector("input")||this.hostElement.nativeElement;this.renderer.setAttribute(e,"aria-label",this.ariaLabel)};var x=W;function W(e,t){this.hostElement=e,this.renderer=t}x.ɵfac=u.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:x,deps:[{token:u.ElementRef},{token:u.Renderer2}],target:u.ɵɵFactoryTarget.Directive}),x.ɵdir=u.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:x,selector:"[kendoAriaLabelValue]",inputs:{ariaLabel:["kendoAriaLabelValue","ariaLabel"]},usesOnChanges:!0,ngImport:u}),u.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:x,decorators:[{type:n.Directive,args:[{selector:"[kendoAriaLabelValue]"}]}],ctorParameters:function(){return[{type:u.ElementRef},{type:u.Renderer2}]},propDecorators:{ariaLabel:[{type:n.Input,args:["kendoAriaLabelValue"]}]}});D.prototype.messageFor=function(e){return this.localization.get(e)},D.prototype.getOperator=function(e){return this.messageFor(b(P[this.editorType],e))},D.prototype.operatorValueChange=function(e){this.valueChange.emit(e)};var C=D;function D(e){this.localization=e,this.valueChange=new n.EventEmitter,this.operators=[]}C.ɵfac=u.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:C,deps:[{token:d.LocalizationService}],target:u.ɵɵFactoryTarget.Component}),C.ɵcmp=u.ɵɵngDeclareComponent({minVersion:"12.0.0",version:"12.2.16",type:C,selector:"kendo-filter-expression-operators",inputs:{currentItem:"currentItem",editorType:"editorType",operators:"operators"},outputs:{valueChange:"valueChange"},ngImport:u,template:'\n        <kendo-dropdownlist\n            [kendoAriaLabelValue]="messageFor(\'filterOperatorAriaLabel\')"\n            [data]="operators"\n            [title]="messageFor(\'filterExpressionOperators\')"\n            [(value)]="currentItem.operator"\n            (valueChange)="operatorValueChange($event)"\n            [valuePrimitive]="true"\n            textField="text"\n            valueField="value"\n        >\n            <ng-template kendoDropDownListValueTemplate let-dataItem>\n                {{ getOperator(dataItem.value) }}\n            </ng-template>\n            <ng-template kendoDropDownListItemTemplate let-dataItem>\n                {{ getOperator(dataItem.value) }}\n            </ng-template>\n        </kendo-dropdownlist>\n    ',isInline:!0,components:[{type:f.DropDownListComponent,selector:"kendo-dropdownlist",inputs:["iconClass","loading","data","value","textField","valueField","popupSettings","listHeight","defaultItem","disabled","itemDisabled","readonly","filterable","virtual","ignoreCase","delay","valuePrimitive","tabindex","tabIndex","size","rounded","fillMode","id"],outputs:["valueChange","filterChange","selectionChange","open","opened","close","closed","focus","blur"],exportAs:["kendoDropDownList"]}],directives:[{type:x,selector:"[kendoAriaLabelValue]",inputs:["kendoAriaLabelValue"]},{type:f.ValueTemplateDirective,selector:"[kendoDropDownListValueTemplate],[kendoDropDownTreeValueTemplate]"},{type:f.ItemTemplateDirective,selector:"[kendoDropDownListItemTemplate],[kendoComboBoxItemTemplate],[kendoAutoCompleteItemTemplate],[kendoMultiSelectItemTemplate]"}]}),u.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:C,decorators:[{type:n.Component,args:[{selector:"kendo-filter-expression-operators",template:'\n        <kendo-dropdownlist\n            [kendoAriaLabelValue]="messageFor(\'filterOperatorAriaLabel\')"\n            [data]="operators"\n            [title]="messageFor(\'filterExpressionOperators\')"\n            [(value)]="currentItem.operator"\n            (valueChange)="operatorValueChange($event)"\n            [valuePrimitive]="true"\n            textField="text"\n            valueField="value"\n        >\n            <ng-template kendoDropDownListValueTemplate let-dataItem>\n                {{ getOperator(dataItem.value) }}\n            </ng-template>\n            <ng-template kendoDropDownListItemTemplate let-dataItem>\n                {{ getOperator(dataItem.value) }}\n            </ng-template>\n        </kendo-dropdownlist>\n    '}]}],ctorParameters:function(){return[{type:d.LocalizationService}]},propDecorators:{currentItem:[{type:n.Input}],editorType:[{type:n.Input}],valueChange:[{type:n.Output}],operators:[{type:n.Input}]}});K.prototype.messageFor=function(e){return this.localization.get(e)};var F=K;function K(e){this.localization=e,this.valueChange=new n.EventEmitter}F.ɵfac=u.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:F,deps:[{token:d.LocalizationService}],target:u.ɵɵFactoryTarget.Component}),F.ɵcmp=u.ɵɵngDeclareComponent({minVersion:"12.0.0",version:"12.2.16",type:F,selector:"kendo-filter-text-editor",inputs:{currentItem:"currentItem",isDisabled:"isDisabled"},outputs:{valueChange:"valueChange"},ngImport:u,template:'\n        <kendo-textbox\n            [kendoAriaLabelValue]="messageFor(\'filterValueAriaLabel\')"\n            class="k-filter-toolbar-item k-filter-value"\n            [(value)]="currentItem.value"\n            (valueChange)="valueChange.emit()"\n            [disabled]="isDisabled">\n        </kendo-textbox>\n  ',isInline:!0,components:[{type:c.TextBoxComponent,selector:"kendo-textbox",inputs:["focusableId","title","disabled","readonly","tabindex","value","selectOnFocus","showSuccessIcon","showErrorIcon","clearButton","successIcon","errorIcon","clearButtonIcon","size","rounded","fillMode","tabIndex","placeholder","maxlength"],outputs:["valueChange","inputFocus","inputBlur","focus","blur"],exportAs:["kendoTextBox"]}],directives:[{type:x,selector:"[kendoAriaLabelValue]",inputs:["kendoAriaLabelValue"]}]}),u.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:F,decorators:[{type:n.Component,args:[{selector:"kendo-filter-text-editor",template:'\n        <kendo-textbox\n            [kendoAriaLabelValue]="messageFor(\'filterValueAriaLabel\')"\n            class="k-filter-toolbar-item k-filter-value"\n            [(value)]="currentItem.value"\n            (valueChange)="valueChange.emit()"\n            [disabled]="isDisabled">\n        </kendo-textbox>\n  '}]}],ctorParameters:function(){return[{type:d.LocalizationService}]},propDecorators:{currentItem:[{type:n.Input}],isDisabled:[{type:n.Input}],valueChange:[{type:n.Output}]}});U.prototype.messageFor=function(e){return this.localization.get(e)};var T=U;function U(e){this.localization=e,this.valueChange=new n.EventEmitter}T.ɵfac=u.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:T,deps:[{token:d.LocalizationService}],target:u.ɵɵFactoryTarget.Component}),T.ɵcmp=u.ɵɵngDeclareComponent({minVersion:"12.0.0",version:"12.2.16",type:T,selector:"kendo-filter-numeric-editor",inputs:{currentItem:"currentItem",isDisabled:"isDisabled"},outputs:{valueChange:"valueChange"},ngImport:u,template:'\n        <kendo-numerictextbox\n            [kendoAriaLabelValue]="messageFor(\'filterValueAriaLabel\')"\n            class="k-filter-toolbar-item k-filter-value"\n            [(value)]="currentItem.value"\n            (valueChange)="valueChange.emit()"\n            [disabled]="isDisabled">\n            <kendo-numerictextbox-messages\n                [increment]="messageFor(\'editorNumericIncrement\')"\n                [decrement]="messageFor(\'editorNumericDecrement\')">\n            </kendo-numerictextbox-messages>\n        </kendo-numerictextbox>\n  ',isInline:!0,components:[{type:c.NumericTextBoxComponent,selector:"kendo-numerictextbox",inputs:["focusableId","disabled","readonly","title","autoCorrect","format","max","min","decimals","placeholder","step","spinners","rangeValidation","tabindex","tabIndex","changeValueOnScroll","selectOnFocus","value","maxlength","size","rounded","fillMode"],outputs:["valueChange","focus","blur"],exportAs:["kendoNumericTextBox"]},{type:c.NumericTextBoxCustomMessagesComponent,selector:"kendo-numerictextbox-messages"}],directives:[{type:x,selector:"[kendoAriaLabelValue]",inputs:["kendoAriaLabelValue"]}]}),u.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:T,decorators:[{type:n.Component,args:[{selector:"kendo-filter-numeric-editor",template:'\n        <kendo-numerictextbox\n            [kendoAriaLabelValue]="messageFor(\'filterValueAriaLabel\')"\n            class="k-filter-toolbar-item k-filter-value"\n            [(value)]="currentItem.value"\n            (valueChange)="valueChange.emit()"\n            [disabled]="isDisabled">\n            <kendo-numerictextbox-messages\n                [increment]="messageFor(\'editorNumericIncrement\')"\n                [decrement]="messageFor(\'editorNumericDecrement\')">\n            </kendo-numerictextbox-messages>\n        </kendo-numerictextbox>\n  '}]}],ctorParameters:function(){return[{type:d.LocalizationService}]},propDecorators:{currentItem:[{type:n.Input}],isDisabled:[{type:n.Input}],valueChange:[{type:n.Output}]}});L.prototype.ngOnInit=function(){var e=this;this.localizationSubscription=this.localization.changes.subscribe(function(){e.defaultItem=e.getDefaultItem(),e.items=e.getValueItems(),e.cdr.detectChanges()})},L.prototype.getDefaultItem=function(){return{text:this.localization.get("filterBooleanAll"),value:null}},L.prototype.getValueItems=function(){return[{text:this.localization.get("filterIsTrue"),value:!0},{text:this.localization.get("filterIsFalse"),value:!1}]},L.prototype.ngOnDestroy=function(){this.localizationSubscription&&this.localizationSubscription.unsubscribe()},L.prototype.messageFor=function(e){return this.localization.get(e)};c=L;function L(e,t){this.localization=e,this.cdr=t,this.valueChange=new n.EventEmitter,this.items=this.getValueItems(),this.defaultItem=this.getDefaultItem()}c.ɵfac=u.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:c,deps:[{token:d.LocalizationService},{token:u.ChangeDetectorRef}],target:u.ɵɵFactoryTarget.Component}),c.ɵcmp=u.ɵɵngDeclareComponent({minVersion:"12.0.0",version:"12.2.16",type:c,selector:"kendo-filter-boolean-editor",inputs:{currentItem:"currentItem"},outputs:{valueChange:"valueChange"},ngImport:u,template:'\n    <kendo-dropdownlist\n        [kendoAriaLabelValue]="messageFor(\'filterValueAriaLabel\')"\n        class="k-filter-toolbar-item k-filter-value"\n        [(value)]="currentItem.value"\n        (valueChange)="valueChange.emit()"\n        [data]="items"\n        [defaultItem]="defaultItem"\n        [valuePrimitive]="true"\n        textField="text"\n        valueField="value"\n        >\n    </kendo-dropdownlist>\n  ',isInline:!0,components:[{type:f.DropDownListComponent,selector:"kendo-dropdownlist",inputs:["iconClass","loading","data","value","textField","valueField","popupSettings","listHeight","defaultItem","disabled","itemDisabled","readonly","filterable","virtual","ignoreCase","delay","valuePrimitive","tabindex","tabIndex","size","rounded","fillMode","id"],outputs:["valueChange","filterChange","selectionChange","open","opened","close","closed","focus","blur"],exportAs:["kendoDropDownList"]}],directives:[{type:x,selector:"[kendoAriaLabelValue]",inputs:["kendoAriaLabelValue"]}]}),u.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:c,decorators:[{type:n.Component,args:[{selector:"kendo-filter-boolean-editor",template:'\n    <kendo-dropdownlist\n        [kendoAriaLabelValue]="messageFor(\'filterValueAriaLabel\')"\n        class="k-filter-toolbar-item k-filter-value"\n        [(value)]="currentItem.value"\n        (valueChange)="valueChange.emit()"\n        [data]="items"\n        [defaultItem]="defaultItem"\n        [valuePrimitive]="true"\n        textField="text"\n        valueField="value"\n        >\n    </kendo-dropdownlist>\n  '}]}],ctorParameters:function(){return[{type:d.LocalizationService},{type:u.ChangeDetectorRef}]},propDecorators:{currentItem:[{type:n.Input}],valueChange:[{type:n.Output}]}});$.prototype.messageFor=function(e){return this.localization.get(e)};var E=$;function $(e){this.localization=e,this.valueChange=new n.EventEmitter}E.ɵfac=u.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:E,deps:[{token:d.LocalizationService}],target:u.ɵɵFactoryTarget.Component}),E.ɵcmp=u.ɵɵngDeclareComponent({minVersion:"12.0.0",version:"12.2.16",type:E,selector:"kendo-filter-date-editor",inputs:{currentItem:"currentItem",isDisabled:"isDisabled"},outputs:{valueChange:"valueChange"},ngImport:u,template:'\n        <kendo-datepicker\n            [kendoAriaLabelValue]="messageFor(\'filterValueAriaLabel\')"\n            class="k-filter-toolbar-item k-filter-value"\n            [(value)]="currentItem.value"\n            (valueChange)="valueChange.emit()"\n            [disabled]="isDisabled">\n            <kendo-datepicker-messages\n                [toggle]="messageFor(\'editorDateToggleText\')"\n                [today]="messageFor(\'editorDateTodayText\')">\n            </kendo-datepicker-messages>\n        </kendo-datepicker>\n  ',isInline:!0,components:[{type:m.DatePickerComponent,selector:"kendo-datepicker",inputs:["cellTemplate","monthCellTemplate","yearCellTemplate","decadeCellTemplate","centuryCellTemplate","weekNumberTemplate","headerTitleTemplate","navigationItemTemplate","focusableId","activeView","bottomView","topView","calendarType","animateCalendarNavigation","disabled","readonly","readOnlyInput","popupSettings","navigation","min","max","incompleteDateValidation","focusedDate","value","format","twoDigitYearMax","formatPlaceholder","placeholder","tabindex","tabIndex","disabledDates","title","rangeValidation","disabledDatesValidation","weekNumber","size","rounded","fillMode"],outputs:["valueChange","focus","blur","open","close"],exportAs:["kendo-datepicker"]},{type:m.DatePickerCustomMessagesComponent,selector:"kendo-datepicker-messages"}],directives:[{type:x,selector:"[kendoAriaLabelValue]",inputs:["kendoAriaLabelValue"]}]}),u.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:E,decorators:[{type:n.Component,args:[{selector:"kendo-filter-date-editor",template:'\n        <kendo-datepicker\n            [kendoAriaLabelValue]="messageFor(\'filterValueAriaLabel\')"\n            class="k-filter-toolbar-item k-filter-value"\n            [(value)]="currentItem.value"\n            (valueChange)="valueChange.emit()"\n            [disabled]="isDisabled">\n            <kendo-datepicker-messages\n                [toggle]="messageFor(\'editorDateToggleText\')"\n                [today]="messageFor(\'editorDateTodayText\')">\n            </kendo-datepicker-messages>\n        </kendo-datepicker>\n  '}]}],ctorParameters:function(){return[{type:d.LocalizationService}]},propDecorators:{currentItem:[{type:n.Input}],isDisabled:[{type:n.Input}],valueChange:[{type:n.Output}]}});A.prototype.ngOnInit=function(){var e=this,t=(this.isEditorDisabled=0<=k.indexOf(this.currentItem.operator),this.filters=this.filterService.filters,this.getFilterExpressionByField(this.currentItem.field)),r=(this.currentItem.field&&this.setOperators(t),this.getFilterExpressionByField(this.filterService.filters[0].field));this.currentItem.field||(this.currentItem.field=this.filterService.filters[0].field,this.setOperators(r)),this.localizationSubscription=this.localization.changes.subscribe(function(){e.setOperators(t||r),e.cdr.detectChanges()})},A.prototype.ngOnDestroy=function(){this.localizationSubscription&&this.localizationSubscription.unsubscribe()},A.prototype.normalizeOperators=function(e,t){for(var r=[],n=0;n<t.length;n++)0<=["string","number","boolean","date"].indexOf(e)&&r.push({value:t[n],text:this.localization.get(b(P[e],t[n]))});return r},A.prototype.messageFor=function(e){return this.localization.get(e)},A.prototype.getFilterExpressionByField=function(t){var e=this.filterService.filters.find(function(e){return e.field===t});return e||null},A.prototype.filterValueChange=function(e){this.currentItem.value=null,this.currentItem.field=e;e=this.getFilterExpressionByField(this.currentItem.field);this.setOperators(e),this.valueChange.emit()},A.prototype.getDefaultOperators=function(e){switch(e){case"string":return y(M)(this.localization);case"number":return y(B)(this.localization);case"date":return y(G)(this.localization)}},A.prototype.getEditorType=function(){var t=this;return this.filterService.filters.find(function(e){return e.field===t.currentItem.field}).editor},A.prototype.removeFilterExpression=function(){this.filterService.remove(this.currentItem,this.index),this.valueChange.emit()},A.prototype.setOperators=function(e){var t;this.isBoolean="boolean"===e.editor,this.isBoolean||(e.operators?(t=this.normalizeOperators(e.editor,e.operators),this.operators=t,this.currentItem.operator||(this.currentItem.operator=t[0].value)):(this.operators=this.getDefaultOperators(e.editor),this.currentItem.operator||(this.currentItem.operator=this.operators[0].value)))},A.prototype.onOperatorChange=function(e){this.valueChange.emit(),0<=k.indexOf(e)?(this.currentItem.value=null,this.isEditorDisabled=!0):this.isEditorDisabled=!1};m=A;function A(e,t,r){this.filterService=e,this.localization=t,this.cdr=r,this.valueChange=new n.EventEmitter,this.operators=[],this.filters=[],this.isBoolean=!1,this.isEditorDisabled=!1}m.ɵfac=u.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:m,deps:[{token:v},{token:d.LocalizationService},{token:u.ChangeDetectorRef}],target:u.ɵɵFactoryTarget.Component}),m.ɵcmp=u.ɵɵngDeclareComponent({minVersion:"12.0.0",version:"12.2.16",type:m,selector:"kendo-filter-expression",inputs:{index:"index",currentItem:"currentItem"},outputs:{valueChange:"valueChange"},ngImport:u,template:'\n        <div class="k-filter-toolbar" role="group" [attr.aria-label]="messageFor(\'filterAriaLabel\')">\n            <div class="k-toolbar">\n                <div class="k-filter-toolbar-item k-filter-field">\n                    <kendo-dropdownlist\n                        [kendoAriaLabelValue]="messageFor(\'filterFieldAriaLabel\')"\n                        [title]="messageFor(\'filterExpressionFilters\')"\n                        [data]="filters"\n                        textField="title"\n                        valueField="field"\n                        [value]="currentItem.field"\n                        [valuePrimitive]="true"\n                        (valueChange)="filterValueChange($event)">\n                    </kendo-dropdownlist>\n                </div>\n                <div *ngIf="!isBoolean" class="k-filter-toolbar-item k-filter-operator">\n                    <kendo-filter-expression-operators\n                        [currentItem]="currentItem"\n                        [operators]="operators"\n                        [editorType]="getEditorType()"\n                        (valueChange)="onOperatorChange($event);">\n                    </kendo-filter-expression-operators>\n                </div>\n\n                <ng-container [ngSwitch]="getEditorType()">\n                    <kendo-filter-text-editor *ngSwitchCase="\'string\'" [currentItem]="currentItem" [isDisabled]="isEditorDisabled" (valueChange)="valueChange.emit()"></kendo-filter-text-editor>\n                    <kendo-filter-numeric-editor *ngSwitchCase="\'number\'" [currentItem]="currentItem" [isDisabled]="isEditorDisabled" (valueChange)="valueChange.emit()"></kendo-filter-numeric-editor>\n                    <kendo-filter-boolean-editor *ngSwitchCase="\'boolean\'" [currentItem]="currentItem" (valueChange)="valueChange.emit()"></kendo-filter-boolean-editor>\n                    <kendo-filter-date-editor *ngSwitchCase="\'date\'" [currentItem]="currentItem" [isDisabled]="isEditorDisabled" (valueChange)="valueChange.emit()"></kendo-filter-date-editor>\n                </ng-container>\n\n                <div class="k-filter-toolbar-item">\n                    <button\n                        kendoButton\n                        icon="close"\n                        fillMode="flat"\n                        [title]="messageFor(\'remove\')"\n                        (click)="removeFilterExpression()">\n                    </button>\n                </div>\n            </div>\n        </div>\n  ',isInline:!0,components:[{type:f.DropDownListComponent,selector:"kendo-dropdownlist",inputs:["iconClass","loading","data","value","textField","valueField","popupSettings","listHeight","defaultItem","disabled","itemDisabled","readonly","filterable","virtual","ignoreCase","delay","valuePrimitive","tabindex","tabIndex","size","rounded","fillMode","id"],outputs:["valueChange","filterChange","selectionChange","open","opened","close","closed","focus","blur"],exportAs:["kendoDropDownList"]},{type:C,selector:"kendo-filter-expression-operators",inputs:["currentItem","editorType","operators"],outputs:["valueChange"]},{type:F,selector:"kendo-filter-text-editor",inputs:["currentItem","isDisabled"],outputs:["valueChange"]},{type:T,selector:"kendo-filter-numeric-editor",inputs:["currentItem","isDisabled"],outputs:["valueChange"]},{type:c,selector:"kendo-filter-boolean-editor",inputs:["currentItem"],outputs:["valueChange"]},{type:E,selector:"kendo-filter-date-editor",inputs:["currentItem","isDisabled"],outputs:["valueChange"]}],directives:[{type:x,selector:"[kendoAriaLabelValue]",inputs:["kendoAriaLabelValue"]},{type:g.NgIf,selector:"[ngIf]",inputs:["ngIf","ngIfThen","ngIfElse"]},{type:g.NgSwitch,selector:"[ngSwitch]",inputs:["ngSwitch"]},{type:g.NgSwitchCase,selector:"[ngSwitchCase]",inputs:["ngSwitchCase"]},{type:h.ButtonDirective,selector:"button[kendoButton], span[kendoButton]",inputs:["toggleable","togglable","selected","tabIndex","icon","iconClass","imageUrl","disabled","size","rounded","fillMode","themeColor","role","primary","look"],outputs:["selectedChange","click"],exportAs:["kendoButton"]}]}),u.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:m,decorators:[{type:n.Component,args:[{selector:"kendo-filter-expression",template:'\n        <div class="k-filter-toolbar" role="group" [attr.aria-label]="messageFor(\'filterAriaLabel\')">\n            <div class="k-toolbar">\n                <div class="k-filter-toolbar-item k-filter-field">\n                    <kendo-dropdownlist\n                        [kendoAriaLabelValue]="messageFor(\'filterFieldAriaLabel\')"\n                        [title]="messageFor(\'filterExpressionFilters\')"\n                        [data]="filters"\n                        textField="title"\n                        valueField="field"\n                        [value]="currentItem.field"\n                        [valuePrimitive]="true"\n                        (valueChange)="filterValueChange($event)">\n                    </kendo-dropdownlist>\n                </div>\n                <div *ngIf="!isBoolean" class="k-filter-toolbar-item k-filter-operator">\n                    <kendo-filter-expression-operators\n                        [currentItem]="currentItem"\n                        [operators]="operators"\n                        [editorType]="getEditorType()"\n                        (valueChange)="onOperatorChange($event);">\n                    </kendo-filter-expression-operators>\n                </div>\n\n                <ng-container [ngSwitch]="getEditorType()">\n                    <kendo-filter-text-editor *ngSwitchCase="\'string\'" [currentItem]="currentItem" [isDisabled]="isEditorDisabled" (valueChange)="valueChange.emit()"></kendo-filter-text-editor>\n                    <kendo-filter-numeric-editor *ngSwitchCase="\'number\'" [currentItem]="currentItem" [isDisabled]="isEditorDisabled" (valueChange)="valueChange.emit()"></kendo-filter-numeric-editor>\n                    <kendo-filter-boolean-editor *ngSwitchCase="\'boolean\'" [currentItem]="currentItem" (valueChange)="valueChange.emit()"></kendo-filter-boolean-editor>\n                    <kendo-filter-date-editor *ngSwitchCase="\'date\'" [currentItem]="currentItem" [isDisabled]="isEditorDisabled" (valueChange)="valueChange.emit()"></kendo-filter-date-editor>\n                </ng-container>\n\n                <div class="k-filter-toolbar-item">\n                    <button\n                        kendoButton\n                        icon="close"\n                        fillMode="flat"\n                        [title]="messageFor(\'remove\')"\n                        (click)="removeFilterExpression()">\n                    </button>\n                </div>\n            </div>\n        </div>\n  '}]}],ctorParameters:function(){return[{type:v},{type:d.LocalizationService},{type:u.ChangeDetectorRef}]},propDecorators:{index:[{type:n.Input}],currentItem:[{type:n.Input}],valueChange:[{type:n.Output}]}});V.prototype.ngOnInit=function(){var e=this;this.operators=this.getLogicOperators(),this.localizationSubscription=this.localization.changes.subscribe(function(){e.operators=e.getLogicOperators(),e.cdr.detectChanges()})},V.prototype.ngOnDestroy=function(){this.localizationSubscription&&this.localizationSubscription.unsubscribe()},V.prototype.getLogicOperators=function(){return y(j)(this.localization)},V.prototype.messageFor=function(e){return this.localization.get(e)},V.prototype.getOperator=function(e){return this.messageFor(b(j,e))},V.prototype.selectedChange=function(e){this.currentItem.logic!==e&&(this.currentItem.logic=e,this.valueChange.emit())},V.prototype.addFilterExpression=function(){this.filterService.addFilterExpression(this.currentItem),this.valueChange.emit()},V.prototype.addFilterGroup=function(){this.filterService.addFilterGroup(this.currentItem),this.valueChange.emit()},V.prototype.removeFilterGroup=function(){this.filterService.remove(this.currentItem,this.index),this.valueChange.emit()};f=V;function V(e,t,r){this.filterService=e,this.localization=t,this.cdr=r,this.index=0,this.currentItem={logic:"or",filters:[]},this.valueChange=new n.EventEmitter,this.operators=[]}f.ɵfac=u.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:f,deps:[{token:v},{token:d.LocalizationService},{token:u.ChangeDetectorRef}],target:u.ɵɵFactoryTarget.Component}),f.ɵcmp=u.ɵɵngDeclareComponent({minVersion:"12.0.0",version:"12.2.16",type:f,selector:"kendo-filter-group",inputs:{index:"index",currentItem:"currentItem"},outputs:{valueChange:"valueChange"},ngImport:u,template:'\n        <div class="k-filter-toolbar" role="toolbar" [attr.aria-label]="messageFor(\'filterToolbarAriaLabel\')">\n          <div class="k-toolbar">\n            <div class="k-filter-toolbar-item">\n              <div class="k-widget k-button-group" role="group">\n              <button\n                    *ngFor="let operator of operators"\n                    kendoButton\n                    [ngClass]="{\'k-group-start\': operator.value === \'and\', \'k-group-end\': operator.value === \'or\'}"\n                    [selected]="currentItem.logic === operator.value"\n                    [title]="operator.text"\n                    (click)="selectedChange(operator.value)"\n                    >\n                    {{getOperator(operator.value)}}\n                  </button>\n              </div>\n            </div>\n          <div class="k-filter-toolbar-item">\n            <button\n                kendoButton\n                [title]="messageFor(\'addFilter\')"\n                icon="filter-add-expression"\n                (click)="addFilterExpression()">\n                {{messageFor(\'addFilter\')}}\n            </button>\n          </div>\n          <div class="k-filter-toolbar-item">\n            <button\n                kendoButton\n                [title]="messageFor(\'addGroup\')"\n                icon="filter-add-group"\n                (click)="addFilterGroup()">\n                {{messageFor(\'addGroup\')}}\n            </button>\n          </div>\n          <div class="k-filter-toolbar-item">\n            <button\n                kendoButton\n                icon="close"\n                fillMode="flat"\n                [title]="messageFor(\'remove\')"\n                (click)="removeFilterGroup()">\n            </button>\n          </div>\n        </div>\n      </div>\n\n      <ul class="k-filter-lines" *ngIf="currentItem.filters">\n        <ng-container *ngFor="let item of currentItem.filters; let i = index;">\n          <li class="k-filter-item" *ngIf="!item[\'filters\']">\n            <kendo-filter-expression (valueChange)="valueChange.emit()" [currentItem]="item" [index]="i">\n            </kendo-filter-expression>\n          </li>\n          <li class="k-filter-item" *ngIf="item[\'filters\']">\n            <kendo-filter-group\n                (valueChange)="valueChange.emit()"\n                [currentItem]="item"\n                [index]="i"\n                >\n            </kendo-filter-group>\n          </li>\n        </ng-container>\n      </ul>\n  ',isInline:!0,components:[{type:m,selector:"kendo-filter-expression",inputs:["index","currentItem"],outputs:["valueChange"]},{type:f,selector:"kendo-filter-group",inputs:["index","currentItem"],outputs:["valueChange"]}],directives:[{type:g.NgForOf,selector:"[ngFor][ngForOf]",inputs:["ngForOf","ngForTrackBy","ngForTemplate"]},{type:h.ButtonDirective,selector:"button[kendoButton], span[kendoButton]",inputs:["toggleable","togglable","selected","tabIndex","icon","iconClass","imageUrl","disabled","size","rounded","fillMode","themeColor","role","primary","look"],outputs:["selectedChange","click"],exportAs:["kendoButton"]},{type:g.NgClass,selector:"[ngClass]",inputs:["class","ngClass"]},{type:g.NgIf,selector:"[ngIf]",inputs:["ngIf","ngIfThen","ngIfElse"]}]}),u.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:f,decorators:[{type:n.Component,args:[{selector:"kendo-filter-group",template:'\n        <div class="k-filter-toolbar" role="toolbar" [attr.aria-label]="messageFor(\'filterToolbarAriaLabel\')">\n          <div class="k-toolbar">\n            <div class="k-filter-toolbar-item">\n              <div class="k-widget k-button-group" role="group">\n              <button\n                    *ngFor="let operator of operators"\n                    kendoButton\n                    [ngClass]="{\'k-group-start\': operator.value === \'and\', \'k-group-end\': operator.value === \'or\'}"\n                    [selected]="currentItem.logic === operator.value"\n                    [title]="operator.text"\n                    (click)="selectedChange(operator.value)"\n                    >\n                    {{getOperator(operator.value)}}\n                  </button>\n              </div>\n            </div>\n          <div class="k-filter-toolbar-item">\n            <button\n                kendoButton\n                [title]="messageFor(\'addFilter\')"\n                icon="filter-add-expression"\n                (click)="addFilterExpression()">\n                {{messageFor(\'addFilter\')}}\n            </button>\n          </div>\n          <div class="k-filter-toolbar-item">\n            <button\n                kendoButton\n                [title]="messageFor(\'addGroup\')"\n                icon="filter-add-group"\n                (click)="addFilterGroup()">\n                {{messageFor(\'addGroup\')}}\n            </button>\n          </div>\n          <div class="k-filter-toolbar-item">\n            <button\n                kendoButton\n                icon="close"\n                fillMode="flat"\n                [title]="messageFor(\'remove\')"\n                (click)="removeFilterGroup()">\n            </button>\n          </div>\n        </div>\n      </div>\n\n      <ul class="k-filter-lines" *ngIf="currentItem.filters">\n        <ng-container *ngFor="let item of currentItem.filters; let i = index;">\n          <li class="k-filter-item" *ngIf="!item[\'filters\']">\n            <kendo-filter-expression (valueChange)="valueChange.emit()" [currentItem]="item" [index]="i">\n            </kendo-filter-expression>\n          </li>\n          <li class="k-filter-item" *ngIf="item[\'filters\']">\n            <kendo-filter-group\n                (valueChange)="valueChange.emit()"\n                [currentItem]="item"\n                [index]="i"\n                >\n            </kendo-filter-group>\n          </li>\n        </ng-container>\n      </ul>\n  '}]}],ctorParameters:function(){return[{type:v},{type:d.LocalizationService},{type:u.ChangeDetectorRef}]},propDecorators:{index:[{type:n.Input}],currentItem:[{type:n.Input}],valueChange:[{type:n.Output}]}});var H=function(e,t){return(H=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r])})(e,t)};function N(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Class extends value "+String(t)+" is not a constructor or null");function r(){this.constructor=e}H(e,t),e.prototype=null===t?Object.create(t):(r.prototype=t.prototype,new r)}Object.create;function J(e,t){var r="function"==typeof Symbol&&e[Symbol.iterator];if(!r)return e;var n,o,i=r.call(e),a=[];try{for(;(void 0===t||0<t--)&&!(n=i.next()).done;)a.push(n.value)}catch(e){o={error:e}}finally{try{n&&!n.done&&(r=i.return)&&r.call(i)}finally{if(o)throw o.error}}return a}function X(e,t,r){if(r||2===arguments.length)for(var n,o=0,i=t.length;o<i;o++)!n&&o in t||((n=n||Array.prototype.slice.call(t,0,o))[o]=t[o]);return e.concat(n||Array.prototype.slice.call(t))}Object.create;N(Q,Y=t.ComponentMessages);var Y,h=Q;function Q(){return null!==Y&&Y.apply(this,arguments)||this}h.ɵfac=u.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:h,deps:null,target:u.ɵɵFactoryTarget.Directive}),h.ɵdir=u.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:h,selector:"[kendoFilterMessages]",inputs:{filterExpressionOperators:"filterExpressionOperators",filterExpressionFilters:"filterExpressionFilters",remove:"remove",addGroup:"addGroup",addFilter:"addFilter",filterAndLogic:"filterAndLogic",filterOrLogic:"filterOrLogic",filterEqOperator:"filterEqOperator",filterNotEqOperator:"filterNotEqOperator",filterIsNullOperator:"filterIsNullOperator",filterIsNotNullOperator:"filterIsNotNullOperator",filterIsEmptyOperator:"filterIsEmptyOperator",filterIsNotEmptyOperator:"filterIsNotEmptyOperator",filterStartsWithOperator:"filterStartsWithOperator",filterContainsOperator:"filterContainsOperator",filterNotContainsOperator:"filterNotContainsOperator",filterEndsWithOperator:"filterEndsWithOperator",filterGteOperator:"filterGteOperator",filterGtOperator:"filterGtOperator",filterLteOperator:"filterLteOperator",filterLtOperator:"filterLtOperator",filterIsTrue:"filterIsTrue",filterIsFalse:"filterIsFalse",filterBooleanAll:"filterBooleanAll",filterAfterOrEqualOperator:"filterAfterOrEqualOperator",filterAfterOperator:"filterAfterOperator",filterBeforeOperator:"filterBeforeOperator",filterBeforeOrEqualOperator:"filterBeforeOrEqualOperator",editorNumericDecrement:"editorNumericDecrement",editorNumericIncrement:"editorNumericIncrement",editorDateTodayText:"editorDateTodayText",editorDateToggleText:"editorDateToggleText",filterFieldAriaLabel:"filterFieldAriaLabel",filterOperatorAriaLabel:"filterOperatorAriaLabel",filterValueAriaLabel:"filterValueAriaLabel",filterAriaLabel:"filterAriaLabel",filterToolbarAriaLabel:"filterToolbarAriaLabel"},usesInheritance:!0,ngImport:u}),u.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:h,decorators:[{type:n.Directive,args:[{selector:"[kendoFilterMessages]"}]}],propDecorators:{filterExpressionOperators:[{type:n.Input}],filterExpressionFilters:[{type:n.Input}],remove:[{type:n.Input}],addGroup:[{type:n.Input}],addFilter:[{type:n.Input}],filterAndLogic:[{type:n.Input}],filterOrLogic:[{type:n.Input}],filterEqOperator:[{type:n.Input}],filterNotEqOperator:[{type:n.Input}],filterIsNullOperator:[{type:n.Input}],filterIsNotNullOperator:[{type:n.Input}],filterIsEmptyOperator:[{type:n.Input}],filterIsNotEmptyOperator:[{type:n.Input}],filterStartsWithOperator:[{type:n.Input}],filterContainsOperator:[{type:n.Input}],filterNotContainsOperator:[{type:n.Input}],filterEndsWithOperator:[{type:n.Input}],filterGteOperator:[{type:n.Input}],filterGtOperator:[{type:n.Input}],filterLteOperator:[{type:n.Input}],filterLtOperator:[{type:n.Input}],filterIsTrue:[{type:n.Input}],filterIsFalse:[{type:n.Input}],filterBooleanAll:[{type:n.Input}],filterAfterOrEqualOperator:[{type:n.Input}],filterAfterOperator:[{type:n.Input}],filterBeforeOperator:[{type:n.Input}],filterBeforeOrEqualOperator:[{type:n.Input}],editorNumericDecrement:[{type:n.Input}],editorNumericIncrement:[{type:n.Input}],editorDateTodayText:[{type:n.Input}],editorDateToggleText:[{type:n.Input}],filterFieldAriaLabel:[{type:n.Input}],filterOperatorAriaLabel:[{type:n.Input}],filterValueAriaLabel:[{type:n.Input}],filterAriaLabel:[{type:n.Input}],filterToolbarAriaLabel:[{type:n.Input}]}});N(ee,Z=h);var Z,w=ee;function ee(e){var t=Z.call(this)||this;return t.service=e,t}w.ɵfac=u.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:w,deps:[{token:d.LocalizationService}],target:u.ɵɵFactoryTarget.Directive}),w.ɵdir=u.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:w,selector:"[kendoFilterLocalizedMessages]",providers:[{provide:h,useExisting:n.forwardRef(function(){return w})}],usesInheritance:!0,ngImport:u}),u.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:w,decorators:[{type:n.Directive,args:[{providers:[{provide:h,useExisting:n.forwardRef(function(){return w})}],selector:"[kendoFilterLocalizedMessages]"}]}],ctorParameters:function(){return[{type:d.LocalizationService}]}});Object.defineProperty(S.prototype,"filters",{get:function(){return this.filterService.filters},set:function(e){0<e.length&&(this.filterService.filters=e.map(function(e){e=Object.assign({},e);return e.title||(e.title=e.field),e}),this.setValue(this.value))},enumerable:!1,configurable:!0}),Object.defineProperty(S.prototype,"value",{get:function(){return this._value},set:function(e){e=JSON.parse(JSON.stringify(e));this._value=e,0<this.filters.length&&this.setValue(this.value)},enumerable:!1,configurable:!0}),S.prototype.ngOnInit=function(){var t=this;this.localizationSubscription=this.localization.changes.subscribe(function(e){e=e.rtl;t.direction=e?"rtl":"ltr",t.cdr.detectChanges()})},S.prototype.ngAfterViewChecked=function(){if(this.filterFields&&0<this.filterFields.length&&(this.filters=this.filterFields.map(function(e){return e})),0===this.filters.length)throw new Error("Pass at least one user-defined filter through the [filters] input property or nest kendo-filter-field components. See http://www.telerik.com/kendo-angular-ui/components/filter/#data-binding")},S.prototype.ngOnDestroy=function(){this.localizationSubscription&&this.localizationSubscription.unsubscribe()},S.prototype.getCurrentFilter=function(){return this.filterService.normalizedValue},S.prototype.onValueChange=function(){this.valueChange.emit(this.filterService.normalizedValue)},S.prototype.normalizeFilter=function(t){var e=this.filterService.filters.find(function(e){return e.field===t.field});if(n.isDevMode()&&!e)throw new Error("There is no user-defined filter with '"+t.field+"' field provided through the [filters] input property.");if(n.isDevMode()&&"boolean"===e.editor&&!t.value&&!1!==t.value&&console.warn("Provide a value for the boolean '"+t.field+"' user-defined filter as the operator is always set to 'eq'."),t.operator&&e.operators&&!e.operators.some(function(e){return e===t.operator}))throw new Error("The user-defined filter with field '"+t.field+"' is missing the '"+t.operator+"' operator.");"boolean"===e.editor&&(t.operator="eq"),"date"===e.editor&&t.value&&(t.value=new Date(t.value)),null==t.value&&(t.value=null),0<=k.indexOf(t.operator)&&(t.value=null)},S.prototype.setValue=function(e){this.normalizeValue(e),this.filterService.normalizedValue=e},S.prototype.normalizeValue=function(e){var t=this;this.filterService.filters.length&&e.filters.forEach(function(e){e.filters?t.normalizeValue(e):t.normalizeFilter(e)})};g=S;function S(e,t,r){this.filterService=e,this.localization=t,this.cdr=r,this.valueChange=new n.EventEmitter,this._value={filters:[],logic:"and"},z.validatePackage(R),this.direction=t.rtl?"rtl":"ltr"}g.ɵfac=u.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:g,deps:[{token:v},{token:d.LocalizationService},{token:u.ChangeDetectorRef}],target:u.ɵɵFactoryTarget.Component}),g.ɵcmp=u.ɵɵngDeclareComponent({minVersion:"12.0.0",version:"12.2.16",type:g,selector:"kendo-filter",inputs:{filters:"filters",value:"value"},outputs:{valueChange:"valueChange"},host:{properties:{"attr.dir":"this.direction"}},providers:[t.LocalizationService,{provide:t.L10N_PREFIX,useValue:"kendo.filter"},v],queries:[{propertyName:"filterFields",predicate:O}],ngImport:u,template:'\n        <ng-container kendoFilterLocalizedMessages\n            i18n-editorDateTodayText="kendo.filter.editorDateTodayText|The text of the Today button of the Date editor"\n            editorDateTodayText="Today"\n\n            i18n-editorDateToggleText="kendo.filter.editorDateToggleText|The title of the Toggle button of the Date editor."\n            editorDateToggleText="Toggle calendar"\n\n            i18n-editorNumericDecrement="kendo.filter.editorNumericDecrement|The title of the Decrement button of the Numeric editor"\n            editorNumericDecrement="Decrement"\n\n            i18n-editorNumericIncrement="kendo.filter.editorNumericIncrement|The title of the Increment button of the Numeric editor"\n            editorNumericIncrement="Increment"\n\n            i18n-filterExpressionOperators="kendo.filter.filterExpressionOperators|The text of the Filter Expression Operators drop down"\n            filterExpressionOperators="Operators"\n\n            i18n-filterExpressionFilters="kendo.filter.filterExpressionFilters|The text of the Filter Expression filters drop down"\n            filterExpressionFilters="Fields"\n\n            i18n-remove="kendo.filter.remove|The text of the Remove button"\n            remove="Remove"\n\n            i18n-addFilter="kendo.filter.addFilter|The text of the Add Filter button"\n            addFilter="Add Filter"\n\n            i18n-addGroup="kendo.filter.addGroup|The text of the Add Group button"\n            addGroup="Add Group"\n\n            i18n-filterAndLogic="kendo.filter.filterAndLogic|The text of the And filter logic"\n            filterAndLogic="And"\n\n            i18n-filterOrLogic="kendo.filter.filterOrLogic|The text of the Or filter logic"\n            filterOrLogic="Or"\n\n            i18n-filterEqOperator="kendo.filter.filterEqOperator|The text of the equal filter operator"\n            filterEqOperator="Is equal to"\n\n            i18n-filterNotEqOperator="kendo.filter.filterNotEqOperator|The text of the not equal filter operator"\n            filterNotEqOperator="Is not equal to"\n\n            i18n-filterIsNullOperator="kendo.filter.filterIsNullOperator|The text of the is null filter operator"\n            filterIsNullOperator="Is null"\n\n            i18n-filterIsNotNullOperator="kendo.filter.filterIsNotNullOperator|The text of the is not null filter operator"\n            filterIsNotNullOperator="Is not null"\n\n            i18n-filterIsEmptyOperator="kendo.filter.filterIsEmptyOperator|The text of the is empty filter operator"\n            filterIsEmptyOperator="Is empty"\n\n            i18n-filterIsNotEmptyOperator="kendo.filter.filterIsNotEmptyOperator|The text of the is not empty filter operator"\n            filterIsNotEmptyOperator="Is not empty"\n\n            i18n-filterStartsWithOperator="kendo.filter.filterStartsWithOperator|The text of the starts with filter operator"\n            filterStartsWithOperator="Starts with"\n\n            i18n-filterContainsOperator="kendo.filter.filterContainsOperator|The text of the contains filter operator"\n            filterContainsOperator="Contains"\n\n            i18n-filterNotContainsOperator="kendo.filter.filterNotContainsOperator|The text of the does not contain filter operator"\n            filterNotContainsOperator="Does not contain"\n\n            i18n-filterEndsWithOperator="kendo.filter.filterEndsWithOperator|The text of the ends with filter operator"\n            filterEndsWithOperator="Ends with"\n\n            i18n-filterGteOperator="kendo.filter.filterGteOperator|The text of the greater than or equal filter operator"\n            filterGteOperator="Is greater than or equal to"\n\n            i18n-filterGtOperator="kendo.filter.filterGtOperator|The text of the greater than filter operator"\n            filterGtOperator="Is greater than"\n\n            i18n-filterLteOperator="kendo.filter.filterLteOperator|The text of the less than or equal filter operator"\n            filterLteOperator="Is less than or equal to"\n\n            i18n-filterLtOperator="kendo.filter.filterLtOperator|The text of the less than filter operator"\n            filterLtOperator="Is less than"\n\n            i18n-filterIsTrue="kendo.filter.filterIsTrue|The text of the IsTrue boolean filter option"\n            filterIsTrue="Is True"\n\n            i18n-filterIsFalse="kendo.filter.filterIsFalse|The text of the IsFalse boolean filter option"\n            filterIsFalse="Is False"\n\n            i18n-filterBooleanAll="kendo.filter.filterBooleanAll|The text of the (All) boolean filter option"\n            filterBooleanAll="(All)"\n\n            i18n-filterAfterOrEqualOperator="kendo.filter.filterAfterOrEqualOperator|The text of the after or equal date filter operator"\n            filterAfterOrEqualOperator="Is after or equal to"\n\n            i18n-filterAfterOperator="kendo.filter.filterAfterOperator|The text of the after date filter operator"\n            filterAfterOperator="Is after"\n\n            i18n-filterBeforeOperator="kendo.filter.filterBeforeOperator|The text of the before date filter operator"\n            filterBeforeOperator="Is before"\n\n            i18n-filterBeforeOrEqualOperator="kendo.filter.filterBeforeOrEqualOperator|The text of the before or equal date filter operator"\n            filterBeforeOrEqualOperator="Is before or equal to"\n\n            i18n-filterFieldAriaLabel="kendo.filter.filterFieldAriaLabel|The text of the filter field aria label"\n            filterFieldAriaLabel="field"\n\n            i18n-filterOperatorAriaLabel="kendo.filter.filterOperatorAriaLabel|The text of the filter operator aria label"\n            filterOperatorAriaLabel="operator"\n\n            i18n-filterValueAriaLabel="kendo.filter.filterValueAriaLabel|The text of the filter value aria label"\n            filterValueAriaLabel="value"\n\n            i18n-filterAriaLabel="kendo.filter.filterAriaLabel|The text of the filter row aria label"\n            filterAriaLabel="filter"\n\n            i18n-filterToolbarAriaLabel="kendo.filter.filterToolbarAriaLabel|The text of the filter toolbar aria label"\n            filterToolbarAriaLabel="filter settings"\n            >\n        </ng-container>\n        <div class="k-widget k-filter" [attr.dir]="direction">\n            <ul class=\'k-filter-container\'>\n                <li class=\'k-filter-group-main\'>\n                    <kendo-filter-group\n                        [currentItem]="getCurrentFilter()"\n                        (valueChange)="onValueChange()"\n                        >\n                    </kendo-filter-group>\n                </li>\n            </ul>\n        </div>\n    ',isInline:!0,components:[{type:f,selector:"kendo-filter-group",inputs:["index","currentItem"],outputs:["valueChange"]}],directives:[{type:w,selector:"[kendoFilterLocalizedMessages]"}]}),u.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:g,decorators:[{type:n.Component,args:[{providers:[t.LocalizationService,{provide:t.L10N_PREFIX,useValue:"kendo.filter"},v],selector:"kendo-filter",template:'\n        <ng-container kendoFilterLocalizedMessages\n            i18n-editorDateTodayText="kendo.filter.editorDateTodayText|The text of the Today button of the Date editor"\n            editorDateTodayText="Today"\n\n            i18n-editorDateToggleText="kendo.filter.editorDateToggleText|The title of the Toggle button of the Date editor."\n            editorDateToggleText="Toggle calendar"\n\n            i18n-editorNumericDecrement="kendo.filter.editorNumericDecrement|The title of the Decrement button of the Numeric editor"\n            editorNumericDecrement="Decrement"\n\n            i18n-editorNumericIncrement="kendo.filter.editorNumericIncrement|The title of the Increment button of the Numeric editor"\n            editorNumericIncrement="Increment"\n\n            i18n-filterExpressionOperators="kendo.filter.filterExpressionOperators|The text of the Filter Expression Operators drop down"\n            filterExpressionOperators="Operators"\n\n            i18n-filterExpressionFilters="kendo.filter.filterExpressionFilters|The text of the Filter Expression filters drop down"\n            filterExpressionFilters="Fields"\n\n            i18n-remove="kendo.filter.remove|The text of the Remove button"\n            remove="Remove"\n\n            i18n-addFilter="kendo.filter.addFilter|The text of the Add Filter button"\n            addFilter="Add Filter"\n\n            i18n-addGroup="kendo.filter.addGroup|The text of the Add Group button"\n            addGroup="Add Group"\n\n            i18n-filterAndLogic="kendo.filter.filterAndLogic|The text of the And filter logic"\n            filterAndLogic="And"\n\n            i18n-filterOrLogic="kendo.filter.filterOrLogic|The text of the Or filter logic"\n            filterOrLogic="Or"\n\n            i18n-filterEqOperator="kendo.filter.filterEqOperator|The text of the equal filter operator"\n            filterEqOperator="Is equal to"\n\n            i18n-filterNotEqOperator="kendo.filter.filterNotEqOperator|The text of the not equal filter operator"\n            filterNotEqOperator="Is not equal to"\n\n            i18n-filterIsNullOperator="kendo.filter.filterIsNullOperator|The text of the is null filter operator"\n            filterIsNullOperator="Is null"\n\n            i18n-filterIsNotNullOperator="kendo.filter.filterIsNotNullOperator|The text of the is not null filter operator"\n            filterIsNotNullOperator="Is not null"\n\n            i18n-filterIsEmptyOperator="kendo.filter.filterIsEmptyOperator|The text of the is empty filter operator"\n            filterIsEmptyOperator="Is empty"\n\n            i18n-filterIsNotEmptyOperator="kendo.filter.filterIsNotEmptyOperator|The text of the is not empty filter operator"\n            filterIsNotEmptyOperator="Is not empty"\n\n            i18n-filterStartsWithOperator="kendo.filter.filterStartsWithOperator|The text of the starts with filter operator"\n            filterStartsWithOperator="Starts with"\n\n            i18n-filterContainsOperator="kendo.filter.filterContainsOperator|The text of the contains filter operator"\n            filterContainsOperator="Contains"\n\n            i18n-filterNotContainsOperator="kendo.filter.filterNotContainsOperator|The text of the does not contain filter operator"\n            filterNotContainsOperator="Does not contain"\n\n            i18n-filterEndsWithOperator="kendo.filter.filterEndsWithOperator|The text of the ends with filter operator"\n            filterEndsWithOperator="Ends with"\n\n            i18n-filterGteOperator="kendo.filter.filterGteOperator|The text of the greater than or equal filter operator"\n            filterGteOperator="Is greater than or equal to"\n\n            i18n-filterGtOperator="kendo.filter.filterGtOperator|The text of the greater than filter operator"\n            filterGtOperator="Is greater than"\n\n            i18n-filterLteOperator="kendo.filter.filterLteOperator|The text of the less than or equal filter operator"\n            filterLteOperator="Is less than or equal to"\n\n            i18n-filterLtOperator="kendo.filter.filterLtOperator|The text of the less than filter operator"\n            filterLtOperator="Is less than"\n\n            i18n-filterIsTrue="kendo.filter.filterIsTrue|The text of the IsTrue boolean filter option"\n            filterIsTrue="Is True"\n\n            i18n-filterIsFalse="kendo.filter.filterIsFalse|The text of the IsFalse boolean filter option"\n            filterIsFalse="Is False"\n\n            i18n-filterBooleanAll="kendo.filter.filterBooleanAll|The text of the (All) boolean filter option"\n            filterBooleanAll="(All)"\n\n            i18n-filterAfterOrEqualOperator="kendo.filter.filterAfterOrEqualOperator|The text of the after or equal date filter operator"\n            filterAfterOrEqualOperator="Is after or equal to"\n\n            i18n-filterAfterOperator="kendo.filter.filterAfterOperator|The text of the after date filter operator"\n            filterAfterOperator="Is after"\n\n            i18n-filterBeforeOperator="kendo.filter.filterBeforeOperator|The text of the before date filter operator"\n            filterBeforeOperator="Is before"\n\n            i18n-filterBeforeOrEqualOperator="kendo.filter.filterBeforeOrEqualOperator|The text of the before or equal date filter operator"\n            filterBeforeOrEqualOperator="Is before or equal to"\n\n            i18n-filterFieldAriaLabel="kendo.filter.filterFieldAriaLabel|The text of the filter field aria label"\n            filterFieldAriaLabel="field"\n\n            i18n-filterOperatorAriaLabel="kendo.filter.filterOperatorAriaLabel|The text of the filter operator aria label"\n            filterOperatorAriaLabel="operator"\n\n            i18n-filterValueAriaLabel="kendo.filter.filterValueAriaLabel|The text of the filter value aria label"\n            filterValueAriaLabel="value"\n\n            i18n-filterAriaLabel="kendo.filter.filterAriaLabel|The text of the filter row aria label"\n            filterAriaLabel="filter"\n\n            i18n-filterToolbarAriaLabel="kendo.filter.filterToolbarAriaLabel|The text of the filter toolbar aria label"\n            filterToolbarAriaLabel="filter settings"\n            >\n        </ng-container>\n        <div class="k-widget k-filter" [attr.dir]="direction">\n            <ul class=\'k-filter-container\'>\n                <li class=\'k-filter-group-main\'>\n                    <kendo-filter-group\n                        [currentItem]="getCurrentFilter()"\n                        (valueChange)="onValueChange()"\n                        >\n                    </kendo-filter-group>\n                </li>\n            </ul>\n        </div>\n    '}]}],ctorParameters:function(){return[{type:v},{type:d.LocalizationService},{type:u.ChangeDetectorRef}]},propDecorators:{direction:[{type:n.HostBinding,args:["attr.dir"]}],filters:[{type:n.Input}],value:[{type:n.Input}],valueChange:[{type:n.Output}],filterFields:[{type:n.ContentChildren,args:[O]}]}});N(re,te=h),Object.defineProperty(re.prototype,"override",{get:function(){return!0},enumerable:!1,configurable:!0});var te,q=re;function re(e){var t=te.call(this)||this;return t.service=e,t}q.ɵfac=u.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:q,deps:[{token:d.LocalizationService}],target:u.ɵɵFactoryTarget.Component}),q.ɵcmp=u.ɵɵngDeclareComponent({minVersion:"12.0.0",version:"12.2.16",type:q,selector:"kendo-filter-messages",providers:[{provide:h,useExisting:n.forwardRef(function(){return q})}],usesInheritance:!0,ngImport:u,template:"",isInline:!0}),u.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:q,decorators:[{type:n.Component,args:[{providers:[{provide:h,useExisting:n.forwardRef(function(){return q})}],selector:"kendo-filter-messages",template:""}]}],ctorParameters:function(){return[{type:d.LocalizationService}]}});t=[a.CommonModule,o.InputsModule,s.LabelModule,r.DropDownsModule,l.ButtonsModule,i.DateInputsModule],h=function(){},h.ɵfac=u.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:h,deps:[],target:u.ɵɵFactoryTarget.NgModule}),h.ɵmod=u.ɵɵngDeclareNgModule({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:h,imports:[a.CommonModule,o.InputsModule,s.LabelModule,r.DropDownsModule,l.ButtonsModule,i.DateInputsModule],exports:[a.CommonModule,o.InputsModule,s.LabelModule,r.DropDownsModule,l.ButtonsModule,i.DateInputsModule]}),h.ɵinj=u.ɵɵngDeclareInjector({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:h,imports:[X([],J(t)),a.CommonModule,o.InputsModule,s.LabelModule,r.DropDownsModule,l.ButtonsModule,i.DateInputsModule]}),u.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:h,decorators:[{type:n.NgModule,args:[{imports:X([],J(t)),exports:X([],J(t))}]}]}),a=function(){};a.ɵfac=u.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:a,deps:[],target:u.ɵɵFactoryTarget.NgModule}),a.ɵmod=u.ɵɵngDeclareNgModule({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:a,declarations:[g,T,F,m,f,C,c,E,w,q,x,O],imports:[h],exports:[g,T,F,m,f,C,c,E,w,q,x,O]}),a.ɵinj=u.ɵɵngDeclareInjector({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:a,imports:[[h]]}),u.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:a,decorators:[{type:n.NgModule,args:[{imports:[h],declarations:[g,T,F,m,f,C,c,E,w,q,x,O],exports:[g,T,F,m,f,C,c,E,w,q,x,O]}]}]}),e.AriaLabelValueDirective=x,e.CustomMessagesComponent=q,e.FilterBooleanEditorComponent=c,e.FilterComponent=g,e.FilterDateEditorComponent=E,e.FilterExpressionComponent=m,e.FilterExpressionOperatorsComponent=C,e.FilterFieldComponent=O,e.FilterGroupComponent=f,e.FilterModule=a,e.FilterNumericEditorComponent=T,e.FilterTextEditorComponent=F,e.LocalizedMessagesDirective=w,Object.defineProperty(e,"__esModule",{value:!0})});
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@progress/kendo-angular-l10n"),require("@progress/kendo-licensing"),require("@progress/kendo-angular-dropdowns"),require("@progress/kendo-angular-inputs"),require("@progress/kendo-angular-dateinputs"),require("@angular/common"),require("@progress/kendo-angular-buttons"),require("@progress/kendo-angular-label")):"function"==typeof define&&define.amd?define("KendoAngularFilter",["exports","@angular/core","@progress/kendo-angular-l10n","@progress/kendo-licensing","@progress/kendo-angular-dropdowns","@progress/kendo-angular-inputs","@progress/kendo-angular-dateinputs","@angular/common","@progress/kendo-angular-buttons","@progress/kendo-angular-label"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoAngularFilter={},e.ng.core,e.KendoAngularL10N,e.KendoLicensing,e.KendoAngularDropdowns,e.KendoAngularInputs,e.KendoAngularDateinputs,e.ng.common,e.KendoAngularButtons,e.KendoAngularLabel)}(this,function(e,n,t,z,r,o,i,a,l,s){"use strict";function p(r){if(r&&r.__esModule)return r;var n=Object.create(null);return r&&Object.keys(r).forEach(function(e){var t;"default"!==e&&(t=Object.getOwnPropertyDescriptor(r,e),Object.defineProperty(n,e,t.get?t:{enumerable:!0,get:function(){return r[e]}}))}),n.default=r,Object.freeze(n)}var u=p(n),d=p(t),f=p(r),c=p(o),m=p(i),g=p(a),h=p(l),v=(I.prototype.addFilterGroup=function(e){e.filters.push({logic:"and",filters:[]})},I.prototype.addFilterExpression=function(e){e.filters.push({operator:"eq",value:null,field:null})},I.prototype.remove=function(t,r,e){var n,o=this;e=e||this.normalizedValue,t===e?e.filters=[]:0<=(n=e.filters.indexOf(t))&&n===r?e.filters=e.filters.filter(function(e){return e!==t}):e.filters.forEach(function(e){return e.filters&&o.remove(t,r,e)})},I);function I(){this.normalizedValue={logic:"and",filters:[]},this.filters=[]}v.ɵfac=u.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:v,deps:[],target:u.ɵɵFactoryTarget.Injectable}),v.ɵprov=u.ɵɵngDeclareInjectable({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:v}),u.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:v,decorators:[{type:n.Injectable}]});function y(t,r){return Object.keys(t).find(function(e){return t[e]===r})}function b(r){return function(t){return Object.keys(r).map(function(e){return{text:t.get(e),value:r[e]}})}}var k=["isnull","isnotnull","isempty","isnotempty"],M={filterEqOperator:"eq",filterNotEqOperator:"neq",filterContainsOperator:"contains",filterNotContainsOperator:"doesnotcontain",filterStartsWithOperator:"startswith",filterEndsWithOperator:"endswith",filterIsNullOperator:"isnull",filterIsNotNullOperator:"isnotnull",filterIsEmptyOperator:"isempty",filterIsNotEmptyOperator:"isnotempty"},B={filterEqOperator:"eq",filterNotEqOperator:"neq",filterGteOperator:"gte",filterGtOperator:"gt",filterLteOperator:"lte",filterLtOperator:"lt",filterIsNullOperator:"isnull",filterIsNotNullOperator:"isnotnull"},G={filterEqOperator:"eq",filterNotEqOperator:"neq",filterAfterOrEqualOperator:"gte",filterAfterOperator:"gt",filterBeforeOrEqualOperator:"lte",filterBeforeOperator:"lt",filterIsNullOperator:"isnull",filterIsNotNullOperator:"isnotnull"},P={string:M,number:B,date:G},R={filterAndLogic:"and",filterOrLogic:"or"},j={name:"@progress/kendo-angular-filter",productName:"Kendo UI for Angular",productCodes:["KENDOUIANGULAR","KENDOUICOMPLETE"],publishDate:1655280742,version:"",licensingDocsUrl:"https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning"},O=function(e){this.templateRef=e},C=(O.ɵfac=u.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:O,deps:[{token:u.TemplateRef}],target:u.ɵɵFactoryTarget.Directive}),O.ɵdir=u.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:O,selector:"[kendoFilterValueEditorTemplate]",ngImport:u}),u.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:O,decorators:[{type:n.Directive,args:[{selector:"[kendoFilterValueEditorTemplate]"}]}],ctorParameters:function(){return[{type:u.TemplateRef}]}}),Object.defineProperty(_.prototype,"title",{get:function(){return this._title},set:function(e){this._title=e||this.field},enumerable:!1,configurable:!0}),_);function _(){}C.ɵfac=u.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:C,deps:[],target:u.ɵɵFactoryTarget.Component}),C.ɵcmp=u.ɵɵngDeclareComponent({minVersion:"12.0.0",version:"12.2.16",type:C,selector:"kendo-filter-field",inputs:{field:"field",title:"title",editor:"editor",operators:"operators"},queries:[{propertyName:"editorTemplate",first:!0,predicate:O,descendants:!0}],ngImport:u,template:"",isInline:!0}),u.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:C,decorators:[{type:n.Component,args:[{selector:"kendo-filter-field",template:""}]}],propDecorators:{field:[{type:n.Input}],title:[{type:n.Input}],editor:[{type:n.Input}],operators:[{type:n.Input}],editorTemplate:[{type:n.ContentChild,args:[O]}]}});W.prototype.ngOnChanges=function(){var e=this.hostElement.nativeElement.querySelector("input")||this.hostElement.nativeElement;this.renderer.setAttribute(e,"aria-label",this.ariaLabel)};var x=W;function W(e,t){this.hostElement=e,this.renderer=t}x.ɵfac=u.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:x,deps:[{token:u.ElementRef},{token:u.Renderer2}],target:u.ɵɵFactoryTarget.Directive}),x.ɵdir=u.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:x,selector:"[kendoAriaLabelValue]",inputs:{ariaLabel:["kendoAriaLabelValue","ariaLabel"]},usesOnChanges:!0,ngImport:u}),u.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:x,decorators:[{type:n.Directive,args:[{selector:"[kendoAriaLabelValue]"}]}],ctorParameters:function(){return[{type:u.ElementRef},{type:u.Renderer2}]},propDecorators:{ariaLabel:[{type:n.Input,args:["kendoAriaLabelValue"]}]}});D.prototype.messageFor=function(e){return this.localization.get(e)},D.prototype.getOperator=function(e){return this.messageFor(y(P[this.editorType],e))},D.prototype.operatorValueChange=function(e){this.valueChange.emit(e)};var T=D;function D(e){this.localization=e,this.valueChange=new n.EventEmitter,this.operators=[]}T.ɵfac=u.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:T,deps:[{token:d.LocalizationService}],target:u.ɵɵFactoryTarget.Component}),T.ɵcmp=u.ɵɵngDeclareComponent({minVersion:"12.0.0",version:"12.2.16",type:T,selector:"kendo-filter-expression-operators",inputs:{currentItem:"currentItem",editorType:"editorType",operators:"operators"},outputs:{valueChange:"valueChange"},ngImport:u,template:'\n        <kendo-dropdownlist\n            [kendoAriaLabelValue]="messageFor(\'filterOperatorAriaLabel\')"\n            [data]="operators"\n            [title]="messageFor(\'filterExpressionOperators\')"\n            [(value)]="currentItem.operator"\n            (valueChange)="operatorValueChange($event)"\n            [valuePrimitive]="true"\n            textField="text"\n            valueField="value"\n        >\n            <ng-template kendoDropDownListValueTemplate let-dataItem>\n                {{ getOperator(dataItem.value) }}\n            </ng-template>\n            <ng-template kendoDropDownListItemTemplate let-dataItem>\n                {{ getOperator(dataItem.value) }}\n            </ng-template>\n        </kendo-dropdownlist>\n    ',isInline:!0,components:[{type:f.DropDownListComponent,selector:"kendo-dropdownlist",inputs:["iconClass","loading","data","value","textField","valueField","popupSettings","listHeight","defaultItem","disabled","itemDisabled","readonly","filterable","virtual","ignoreCase","delay","valuePrimitive","tabindex","tabIndex","size","rounded","fillMode","id"],outputs:["valueChange","filterChange","selectionChange","open","opened","close","closed","focus","blur"],exportAs:["kendoDropDownList"]}],directives:[{type:x,selector:"[kendoAriaLabelValue]",inputs:["kendoAriaLabelValue"]},{type:f.ValueTemplateDirective,selector:"[kendoDropDownListValueTemplate],[kendoDropDownTreeValueTemplate]"},{type:f.ItemTemplateDirective,selector:"[kendoDropDownListItemTemplate],[kendoComboBoxItemTemplate],[kendoAutoCompleteItemTemplate],[kendoMultiSelectItemTemplate]"}]}),u.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:T,decorators:[{type:n.Component,args:[{selector:"kendo-filter-expression-operators",template:'\n        <kendo-dropdownlist\n            [kendoAriaLabelValue]="messageFor(\'filterOperatorAriaLabel\')"\n            [data]="operators"\n            [title]="messageFor(\'filterExpressionOperators\')"\n            [(value)]="currentItem.operator"\n            (valueChange)="operatorValueChange($event)"\n            [valuePrimitive]="true"\n            textField="text"\n            valueField="value"\n        >\n            <ng-template kendoDropDownListValueTemplate let-dataItem>\n                {{ getOperator(dataItem.value) }}\n            </ng-template>\n            <ng-template kendoDropDownListItemTemplate let-dataItem>\n                {{ getOperator(dataItem.value) }}\n            </ng-template>\n        </kendo-dropdownlist>\n    '}]}],ctorParameters:function(){return[{type:d.LocalizationService}]},propDecorators:{currentItem:[{type:n.Input}],editorType:[{type:n.Input}],valueChange:[{type:n.Output}],operators:[{type:n.Input}]}});K.prototype.messageFor=function(e){return this.localization.get(e)};var F=K;function K(e){this.localization=e,this.valueChange=new n.EventEmitter}F.ɵfac=u.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:F,deps:[{token:d.LocalizationService}],target:u.ɵɵFactoryTarget.Component}),F.ɵcmp=u.ɵɵngDeclareComponent({minVersion:"12.0.0",version:"12.2.16",type:F,selector:"kendo-filter-text-editor",inputs:{currentItem:"currentItem",isDisabled:"isDisabled"},outputs:{valueChange:"valueChange"},ngImport:u,template:'\n        <kendo-textbox\n            [kendoAriaLabelValue]="messageFor(\'filterValueAriaLabel\')"\n            [(value)]="currentItem.value"\n            (valueChange)="valueChange.emit()"\n            [disabled]="isDisabled">\n        </kendo-textbox>\n  ',isInline:!0,components:[{type:c.TextBoxComponent,selector:"kendo-textbox",inputs:["focusableId","title","disabled","readonly","tabindex","value","selectOnFocus","showSuccessIcon","showErrorIcon","clearButton","successIcon","errorIcon","clearButtonIcon","size","rounded","fillMode","tabIndex","placeholder","maxlength"],outputs:["valueChange","inputFocus","inputBlur","focus","blur"],exportAs:["kendoTextBox"]}],directives:[{type:x,selector:"[kendoAriaLabelValue]",inputs:["kendoAriaLabelValue"]}]}),u.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:F,decorators:[{type:n.Component,args:[{selector:"kendo-filter-text-editor",template:'\n        <kendo-textbox\n            [kendoAriaLabelValue]="messageFor(\'filterValueAriaLabel\')"\n            [(value)]="currentItem.value"\n            (valueChange)="valueChange.emit()"\n            [disabled]="isDisabled">\n        </kendo-textbox>\n  '}]}],ctorParameters:function(){return[{type:d.LocalizationService}]},propDecorators:{currentItem:[{type:n.Input}],isDisabled:[{type:n.Input}],valueChange:[{type:n.Output}]}});$.prototype.messageFor=function(e){return this.localization.get(e)};var L=$;function $(e){this.localization=e,this.valueChange=new n.EventEmitter}L.ɵfac=u.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:L,deps:[{token:d.LocalizationService}],target:u.ɵɵFactoryTarget.Component}),L.ɵcmp=u.ɵɵngDeclareComponent({minVersion:"12.0.0",version:"12.2.16",type:L,selector:"kendo-filter-numeric-editor",inputs:{currentItem:"currentItem",isDisabled:"isDisabled"},outputs:{valueChange:"valueChange"},ngImport:u,template:'\n        <kendo-numerictextbox\n            [kendoAriaLabelValue]="messageFor(\'filterValueAriaLabel\')"\n            [(value)]="currentItem.value"\n            (valueChange)="valueChange.emit()"\n            [disabled]="isDisabled">\n            <kendo-numerictextbox-messages\n                [increment]="messageFor(\'editorNumericIncrement\')"\n                [decrement]="messageFor(\'editorNumericDecrement\')">\n            </kendo-numerictextbox-messages>\n        </kendo-numerictextbox>\n  ',isInline:!0,components:[{type:c.NumericTextBoxComponent,selector:"kendo-numerictextbox",inputs:["focusableId","disabled","readonly","title","autoCorrect","format","max","min","decimals","placeholder","step","spinners","rangeValidation","tabindex","tabIndex","changeValueOnScroll","selectOnFocus","value","maxlength","size","rounded","fillMode"],outputs:["valueChange","focus","blur"],exportAs:["kendoNumericTextBox"]},{type:c.NumericTextBoxCustomMessagesComponent,selector:"kendo-numerictextbox-messages"}],directives:[{type:x,selector:"[kendoAriaLabelValue]",inputs:["kendoAriaLabelValue"]}]}),u.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:L,decorators:[{type:n.Component,args:[{selector:"kendo-filter-numeric-editor",template:'\n        <kendo-numerictextbox\n            [kendoAriaLabelValue]="messageFor(\'filterValueAriaLabel\')"\n            [(value)]="currentItem.value"\n            (valueChange)="valueChange.emit()"\n            [disabled]="isDisabled">\n            <kendo-numerictextbox-messages\n                [increment]="messageFor(\'editorNumericIncrement\')"\n                [decrement]="messageFor(\'editorNumericDecrement\')">\n            </kendo-numerictextbox-messages>\n        </kendo-numerictextbox>\n  '}]}],ctorParameters:function(){return[{type:d.LocalizationService}]},propDecorators:{currentItem:[{type:n.Input}],isDisabled:[{type:n.Input}],valueChange:[{type:n.Output}]}});E.prototype.ngOnInit=function(){var e=this;this.localizationSubscription=this.localization.changes.subscribe(function(){e.defaultItem=e.getDefaultItem(),e.items=e.getValueItems(),e.cdr.detectChanges()})},E.prototype.getDefaultItem=function(){return{text:this.localization.get("filterBooleanAll"),value:null}},E.prototype.getValueItems=function(){return[{text:this.localization.get("filterIsTrue"),value:!0},{text:this.localization.get("filterIsFalse"),value:!1}]},E.prototype.ngOnDestroy=function(){this.localizationSubscription&&this.localizationSubscription.unsubscribe()},E.prototype.messageFor=function(e){return this.localization.get(e)};c=E;function E(e,t){this.localization=e,this.cdr=t,this.valueChange=new n.EventEmitter,this.items=this.getValueItems(),this.defaultItem=this.getDefaultItem()}c.ɵfac=u.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:c,deps:[{token:d.LocalizationService},{token:u.ChangeDetectorRef}],target:u.ɵɵFactoryTarget.Component}),c.ɵcmp=u.ɵɵngDeclareComponent({minVersion:"12.0.0",version:"12.2.16",type:c,selector:"kendo-filter-boolean-editor",inputs:{currentItem:"currentItem"},outputs:{valueChange:"valueChange"},ngImport:u,template:'\n    <kendo-dropdownlist\n        [kendoAriaLabelValue]="messageFor(\'filterValueAriaLabel\')"\n        [(value)]="currentItem.value"\n        (valueChange)="valueChange.emit()"\n        [data]="items"\n        [defaultItem]="defaultItem"\n        [valuePrimitive]="true"\n        textField="text"\n        valueField="value"\n        >\n    </kendo-dropdownlist>\n  ',isInline:!0,components:[{type:f.DropDownListComponent,selector:"kendo-dropdownlist",inputs:["iconClass","loading","data","value","textField","valueField","popupSettings","listHeight","defaultItem","disabled","itemDisabled","readonly","filterable","virtual","ignoreCase","delay","valuePrimitive","tabindex","tabIndex","size","rounded","fillMode","id"],outputs:["valueChange","filterChange","selectionChange","open","opened","close","closed","focus","blur"],exportAs:["kendoDropDownList"]}],directives:[{type:x,selector:"[kendoAriaLabelValue]",inputs:["kendoAriaLabelValue"]}]}),u.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:c,decorators:[{type:n.Component,args:[{selector:"kendo-filter-boolean-editor",template:'\n    <kendo-dropdownlist\n        [kendoAriaLabelValue]="messageFor(\'filterValueAriaLabel\')"\n        [(value)]="currentItem.value"\n        (valueChange)="valueChange.emit()"\n        [data]="items"\n        [defaultItem]="defaultItem"\n        [valuePrimitive]="true"\n        textField="text"\n        valueField="value"\n        >\n    </kendo-dropdownlist>\n  '}]}],ctorParameters:function(){return[{type:d.LocalizationService},{type:u.ChangeDetectorRef}]},propDecorators:{currentItem:[{type:n.Input}],valueChange:[{type:n.Output}]}});U.prototype.messageFor=function(e){return this.localization.get(e)};var A=U;function U(e){this.localization=e,this.valueChange=new n.EventEmitter}A.ɵfac=u.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:A,deps:[{token:d.LocalizationService}],target:u.ɵɵFactoryTarget.Component}),A.ɵcmp=u.ɵɵngDeclareComponent({minVersion:"12.0.0",version:"12.2.16",type:A,selector:"kendo-filter-date-editor",inputs:{currentItem:"currentItem",isDisabled:"isDisabled"},outputs:{valueChange:"valueChange"},ngImport:u,template:'\n        <kendo-datepicker\n            [kendoAriaLabelValue]="messageFor(\'filterValueAriaLabel\')"\n            [(value)]="currentItem.value"\n            (valueChange)="valueChange.emit()"\n            [disabled]="isDisabled">\n            <kendo-datepicker-messages\n                [toggle]="messageFor(\'editorDateToggleText\')"\n                [today]="messageFor(\'editorDateTodayText\')">\n            </kendo-datepicker-messages>\n        </kendo-datepicker>\n  ',isInline:!0,components:[{type:m.DatePickerComponent,selector:"kendo-datepicker",inputs:["cellTemplate","monthCellTemplate","yearCellTemplate","decadeCellTemplate","centuryCellTemplate","weekNumberTemplate","headerTitleTemplate","navigationItemTemplate","focusableId","activeView","bottomView","topView","calendarType","animateCalendarNavigation","disabled","readonly","readOnlyInput","popupSettings","navigation","min","max","incompleteDateValidation","focusedDate","value","format","twoDigitYearMax","formatPlaceholder","placeholder","tabindex","tabIndex","disabledDates","title","rangeValidation","disabledDatesValidation","weekNumber","size","rounded","fillMode"],outputs:["valueChange","focus","blur","open","close"],exportAs:["kendo-datepicker"]},{type:m.DatePickerCustomMessagesComponent,selector:"kendo-datepicker-messages"}],directives:[{type:x,selector:"[kendoAriaLabelValue]",inputs:["kendoAriaLabelValue"]}]}),u.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:A,decorators:[{type:n.Component,args:[{selector:"kendo-filter-date-editor",template:'\n        <kendo-datepicker\n            [kendoAriaLabelValue]="messageFor(\'filterValueAriaLabel\')"\n            [(value)]="currentItem.value"\n            (valueChange)="valueChange.emit()"\n            [disabled]="isDisabled">\n            <kendo-datepicker-messages\n                [toggle]="messageFor(\'editorDateToggleText\')"\n                [today]="messageFor(\'editorDateTodayText\')">\n            </kendo-datepicker-messages>\n        </kendo-datepicker>\n  '}]}],ctorParameters:function(){return[{type:d.LocalizationService}]},propDecorators:{currentItem:[{type:n.Input}],isDisabled:[{type:n.Input}],valueChange:[{type:n.Output}]}});V.prototype.ngOnInit=function(){var e=this,t=(this.isEditorDisabled=0<=k.indexOf(this.currentItem.operator),this.filters=this.filterService.filters,this.getFilterExpressionByField(this.currentItem.field)),r=(this.currentItem.field&&this.setOperators(t),this.getFilterExpressionByField(this.filterService.filters[0].field));this.currentItem.field||(this.currentItem.field=this.filterService.filters[0].field,this.setOperators(r)),this.setEditorTemplate(),this.localizationSubscription=this.localization.changes.subscribe(function(){e.setOperators(t||r),e.cdr.detectChanges()})},V.prototype.ngOnDestroy=function(){this.localizationSubscription&&this.localizationSubscription.unsubscribe()},V.prototype.normalizeOperators=function(e,t){for(var r=[],n=0;n<t.length;n++)0<=["string","number","boolean","date"].indexOf(e)&&r.push({value:t[n],text:this.localization.get(y(P[e],t[n]))});return r},V.prototype.messageFor=function(e){return this.localization.get(e)},V.prototype.getFilterExpressionByField=function(t){var e=this.filterService.filters.find(function(e){return e.field===t});return e||null},V.prototype.filterValueChange=function(e){this.currentItem.value=null,this.currentItem.field=e,this.setEditorTemplate();e=this.getFilterExpressionByField(this.currentItem.field);this.setOperators(e),this.valueChange.emit()},V.prototype.getDefaultOperators=function(e){switch(e){case"string":return b(M)(this.localization);case"number":return b(B)(this.localization);case"date":return b(G)(this.localization)}},V.prototype.getEditorType=function(){var t=this;return this.filterService.filters.find(function(e){return e.field===t.currentItem.field}).editor},V.prototype.removeFilterExpression=function(){this.filterService.remove(this.currentItem,this.index),this.valueChange.emit()},V.prototype.setOperators=function(e){var t;this.isBoolean="boolean"===e.editor,this.isBoolean||(e.operators?(t=this.normalizeOperators(e.editor,e.operators),this.operators=t,this.currentItem.operator||(this.currentItem.operator=t[0].value)):(this.operators=this.getDefaultOperators(e.editor),this.currentItem.operator||(this.currentItem.operator=this.operators[0].value)))},V.prototype.onOperatorChange=function(e){this.valueChange.emit(),0<=k.indexOf(e)?(this.currentItem.value=null,this.isEditorDisabled=!0):this.isEditorDisabled=!1},V.prototype.setEditorTemplate=function(){var t=this,e=this.filterService.filters.find(function(e){return e.field===t.currentItem.field});e.editorTemplate&&(this.editorTemplate=e.editorTemplate)};m=V;function V(e,t,r){this.filterService=e,this.localization=t,this.cdr=r,this.valueChange=new n.EventEmitter,this.operators=[],this.filters=[],this.isBoolean=!1,this.isEditorDisabled=!1}m.ɵfac=u.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:m,deps:[{token:v},{token:d.LocalizationService},{token:u.ChangeDetectorRef}],target:u.ɵɵFactoryTarget.Component}),m.ɵcmp=u.ɵɵngDeclareComponent({minVersion:"12.0.0",version:"12.2.16",type:m,selector:"kendo-filter-expression",inputs:{index:"index",currentItem:"currentItem"},outputs:{valueChange:"valueChange"},ngImport:u,template:'\n        <div class="k-filter-toolbar" role="group" [attr.aria-label]="messageFor(\'filterAriaLabel\')">\n            <div class="k-toolbar">\n                <div class="k-filter-toolbar-item k-filter-field">\n                    <kendo-dropdownlist\n                        [kendoAriaLabelValue]="messageFor(\'filterFieldAriaLabel\')"\n                        [title]="messageFor(\'filterExpressionFilters\')"\n                        [data]="filters"\n                        textField="title"\n                        valueField="field"\n                        [value]="currentItem.field"\n                        [valuePrimitive]="true"\n                        (valueChange)="filterValueChange($event)">\n                    </kendo-dropdownlist>\n                </div>\n                <div *ngIf="!isBoolean" class="k-filter-toolbar-item k-filter-operator">\n                    <kendo-filter-expression-operators\n                        [currentItem]="currentItem"\n                        [operators]="operators"\n                        [editorType]="getEditorType()"\n                        (valueChange)="onOperatorChange($event);">\n                    </kendo-filter-expression-operators>\n                </div>\n\n                <div class="k-filter-toolbar-item k-filter-value">\n                    <ng-container *ngIf="!editorTemplate" [ngSwitch]="getEditorType()">\n                        <kendo-filter-text-editor *ngSwitchCase="\'string\'" [currentItem]="currentItem" [isDisabled]="isEditorDisabled" (valueChange)="valueChange.emit()"></kendo-filter-text-editor>\n                        <kendo-filter-numeric-editor *ngSwitchCase="\'number\'" [currentItem]="currentItem" [isDisabled]="isEditorDisabled" (valueChange)="valueChange.emit()"></kendo-filter-numeric-editor>\n                        <kendo-filter-boolean-editor *ngSwitchCase="\'boolean\'" [currentItem]="currentItem" (valueChange)="valueChange.emit()"></kendo-filter-boolean-editor>\n                        <kendo-filter-date-editor *ngSwitchCase="\'date\'" [currentItem]="currentItem" [isDisabled]="isEditorDisabled" (valueChange)="valueChange.emit()"></kendo-filter-date-editor>\n                    </ng-container>\n                    <ng-container *ngIf="editorTemplate">\n                        <ng-template\n                            [templateContext]="{templateRef: editorTemplate, $implicit: currentItem}">\n                        </ng-template>\n                    </ng-container>\n                </div>\n\n                <div class="k-filter-toolbar-item">\n                    <button\n                        kendoButton\n                        icon="close"\n                        fillMode="flat"\n                        [title]="messageFor(\'remove\')"\n                        (click)="removeFilterExpression()">\n                    </button>\n                </div>\n            </div>\n        </div>\n  ',isInline:!0,components:[{type:f.DropDownListComponent,selector:"kendo-dropdownlist",inputs:["iconClass","loading","data","value","textField","valueField","popupSettings","listHeight","defaultItem","disabled","itemDisabled","readonly","filterable","virtual","ignoreCase","delay","valuePrimitive","tabindex","tabIndex","size","rounded","fillMode","id"],outputs:["valueChange","filterChange","selectionChange","open","opened","close","closed","focus","blur"],exportAs:["kendoDropDownList"]},{type:T,selector:"kendo-filter-expression-operators",inputs:["currentItem","editorType","operators"],outputs:["valueChange"]},{type:F,selector:"kendo-filter-text-editor",inputs:["currentItem","isDisabled"],outputs:["valueChange"]},{type:L,selector:"kendo-filter-numeric-editor",inputs:["currentItem","isDisabled"],outputs:["valueChange"]},{type:c,selector:"kendo-filter-boolean-editor",inputs:["currentItem"],outputs:["valueChange"]},{type:A,selector:"kendo-filter-date-editor",inputs:["currentItem","isDisabled"],outputs:["valueChange"]}],directives:[{type:x,selector:"[kendoAriaLabelValue]",inputs:["kendoAriaLabelValue"]},{type:g.NgIf,selector:"[ngIf]",inputs:["ngIf","ngIfThen","ngIfElse"]},{type:g.NgSwitch,selector:"[ngSwitch]",inputs:["ngSwitch"]},{type:g.NgSwitchCase,selector:"[ngSwitchCase]",inputs:["ngSwitchCase"]},{type:h.TemplateContextDirective,selector:"[templateContext]",inputs:["templateContext"]},{type:h.ButtonDirective,selector:"button[kendoButton], span[kendoButton]",inputs:["toggleable","togglable","selected","tabIndex","icon","iconClass","imageUrl","disabled","size","rounded","fillMode","themeColor","role","primary","look"],outputs:["selectedChange","click"],exportAs:["kendoButton"]}]}),u.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:m,decorators:[{type:n.Component,args:[{selector:"kendo-filter-expression",template:'\n        <div class="k-filter-toolbar" role="group" [attr.aria-label]="messageFor(\'filterAriaLabel\')">\n            <div class="k-toolbar">\n                <div class="k-filter-toolbar-item k-filter-field">\n                    <kendo-dropdownlist\n                        [kendoAriaLabelValue]="messageFor(\'filterFieldAriaLabel\')"\n                        [title]="messageFor(\'filterExpressionFilters\')"\n                        [data]="filters"\n                        textField="title"\n                        valueField="field"\n                        [value]="currentItem.field"\n                        [valuePrimitive]="true"\n                        (valueChange)="filterValueChange($event)">\n                    </kendo-dropdownlist>\n                </div>\n                <div *ngIf="!isBoolean" class="k-filter-toolbar-item k-filter-operator">\n                    <kendo-filter-expression-operators\n                        [currentItem]="currentItem"\n                        [operators]="operators"\n                        [editorType]="getEditorType()"\n                        (valueChange)="onOperatorChange($event);">\n                    </kendo-filter-expression-operators>\n                </div>\n\n                <div class="k-filter-toolbar-item k-filter-value">\n                    <ng-container *ngIf="!editorTemplate" [ngSwitch]="getEditorType()">\n                        <kendo-filter-text-editor *ngSwitchCase="\'string\'" [currentItem]="currentItem" [isDisabled]="isEditorDisabled" (valueChange)="valueChange.emit()"></kendo-filter-text-editor>\n                        <kendo-filter-numeric-editor *ngSwitchCase="\'number\'" [currentItem]="currentItem" [isDisabled]="isEditorDisabled" (valueChange)="valueChange.emit()"></kendo-filter-numeric-editor>\n                        <kendo-filter-boolean-editor *ngSwitchCase="\'boolean\'" [currentItem]="currentItem" (valueChange)="valueChange.emit()"></kendo-filter-boolean-editor>\n                        <kendo-filter-date-editor *ngSwitchCase="\'date\'" [currentItem]="currentItem" [isDisabled]="isEditorDisabled" (valueChange)="valueChange.emit()"></kendo-filter-date-editor>\n                    </ng-container>\n                    <ng-container *ngIf="editorTemplate">\n                        <ng-template\n                            [templateContext]="{templateRef: editorTemplate, $implicit: currentItem}">\n                        </ng-template>\n                    </ng-container>\n                </div>\n\n                <div class="k-filter-toolbar-item">\n                    <button\n                        kendoButton\n                        icon="close"\n                        fillMode="flat"\n                        [title]="messageFor(\'remove\')"\n                        (click)="removeFilterExpression()">\n                    </button>\n                </div>\n            </div>\n        </div>\n  '}]}],ctorParameters:function(){return[{type:v},{type:d.LocalizationService},{type:u.ChangeDetectorRef}]},propDecorators:{index:[{type:n.Input}],currentItem:[{type:n.Input}],valueChange:[{type:n.Output}]}});N.prototype.ngOnInit=function(){var e=this;this.operators=this.getLogicOperators(),this.localizationSubscription=this.localization.changes.subscribe(function(){e.operators=e.getLogicOperators(),e.cdr.detectChanges()})},N.prototype.ngOnDestroy=function(){this.localizationSubscription&&this.localizationSubscription.unsubscribe()},N.prototype.getLogicOperators=function(){return b(R)(this.localization)},N.prototype.messageFor=function(e){return this.localization.get(e)},N.prototype.getOperator=function(e){return this.messageFor(y(R,e))},N.prototype.selectedChange=function(e){this.currentItem.logic!==e&&(this.currentItem.logic=e,this.valueChange.emit())},N.prototype.addFilterExpression=function(){this.filterService.addFilterExpression(this.currentItem),this.valueChange.emit()},N.prototype.addFilterGroup=function(){this.filterService.addFilterGroup(this.currentItem),this.valueChange.emit()},N.prototype.removeFilterGroup=function(){this.filterService.remove(this.currentItem,this.index),this.valueChange.emit()};f=N;function N(e,t,r){this.filterService=e,this.localization=t,this.cdr=r,this.index=0,this.currentItem={logic:"or",filters:[]},this.valueChange=new n.EventEmitter,this.operators=[]}f.ɵfac=u.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:f,deps:[{token:v},{token:d.LocalizationService},{token:u.ChangeDetectorRef}],target:u.ɵɵFactoryTarget.Component}),f.ɵcmp=u.ɵɵngDeclareComponent({minVersion:"12.0.0",version:"12.2.16",type:f,selector:"kendo-filter-group",inputs:{index:"index",currentItem:"currentItem"},outputs:{valueChange:"valueChange"},ngImport:u,template:'\n        <div class="k-filter-toolbar" role="toolbar" [attr.aria-label]="messageFor(\'filterToolbarAriaLabel\')">\n          <div class="k-toolbar">\n            <div class="k-filter-toolbar-item">\n              <div class="k-widget k-button-group" role="group">\n              <button\n                    *ngFor="let operator of operators"\n                    kendoButton\n                    [ngClass]="{\'k-group-start\': operator.value === \'and\', \'k-group-end\': operator.value === \'or\'}"\n                    [selected]="currentItem.logic === operator.value"\n                    [title]="operator.text"\n                    (click)="selectedChange(operator.value)"\n                    >\n                    {{getOperator(operator.value)}}\n                  </button>\n              </div>\n            </div>\n          <div class="k-filter-toolbar-item">\n            <button\n                kendoButton\n                [title]="messageFor(\'addFilter\')"\n                icon="filter-add-expression"\n                (click)="addFilterExpression()">\n                {{messageFor(\'addFilter\')}}\n            </button>\n          </div>\n          <div class="k-filter-toolbar-item">\n            <button\n                kendoButton\n                [title]="messageFor(\'addGroup\')"\n                icon="filter-add-group"\n                (click)="addFilterGroup()">\n                {{messageFor(\'addGroup\')}}\n            </button>\n          </div>\n          <div class="k-filter-toolbar-item">\n            <button\n                kendoButton\n                icon="close"\n                fillMode="flat"\n                [title]="messageFor(\'remove\')"\n                (click)="removeFilterGroup()">\n            </button>\n          </div>\n        </div>\n      </div>\n\n      <ul class="k-filter-lines" *ngIf="currentItem.filters">\n        <ng-container *ngFor="let item of currentItem.filters; let i = index;">\n          <li class="k-filter-item" *ngIf="!item[\'filters\']">\n            <kendo-filter-expression (valueChange)="valueChange.emit()" [currentItem]="item" [index]="i">\n            </kendo-filter-expression>\n          </li>\n          <li class="k-filter-item" *ngIf="item[\'filters\']">\n            <kendo-filter-group\n                (valueChange)="valueChange.emit()"\n                [currentItem]="item"\n                [index]="i"\n                >\n            </kendo-filter-group>\n          </li>\n        </ng-container>\n      </ul>\n  ',isInline:!0,components:[{type:m,selector:"kendo-filter-expression",inputs:["index","currentItem"],outputs:["valueChange"]},{type:f,selector:"kendo-filter-group",inputs:["index","currentItem"],outputs:["valueChange"]}],directives:[{type:g.NgForOf,selector:"[ngFor][ngForOf]",inputs:["ngForOf","ngForTrackBy","ngForTemplate"]},{type:h.ButtonDirective,selector:"button[kendoButton], span[kendoButton]",inputs:["toggleable","togglable","selected","tabIndex","icon","iconClass","imageUrl","disabled","size","rounded","fillMode","themeColor","role","primary","look"],outputs:["selectedChange","click"],exportAs:["kendoButton"]},{type:g.NgClass,selector:"[ngClass]",inputs:["class","ngClass"]},{type:g.NgIf,selector:"[ngIf]",inputs:["ngIf","ngIfThen","ngIfElse"]}]}),u.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:f,decorators:[{type:n.Component,args:[{selector:"kendo-filter-group",template:'\n        <div class="k-filter-toolbar" role="toolbar" [attr.aria-label]="messageFor(\'filterToolbarAriaLabel\')">\n          <div class="k-toolbar">\n            <div class="k-filter-toolbar-item">\n              <div class="k-widget k-button-group" role="group">\n              <button\n                    *ngFor="let operator of operators"\n                    kendoButton\n                    [ngClass]="{\'k-group-start\': operator.value === \'and\', \'k-group-end\': operator.value === \'or\'}"\n                    [selected]="currentItem.logic === operator.value"\n                    [title]="operator.text"\n                    (click)="selectedChange(operator.value)"\n                    >\n                    {{getOperator(operator.value)}}\n                  </button>\n              </div>\n            </div>\n          <div class="k-filter-toolbar-item">\n            <button\n                kendoButton\n                [title]="messageFor(\'addFilter\')"\n                icon="filter-add-expression"\n                (click)="addFilterExpression()">\n                {{messageFor(\'addFilter\')}}\n            </button>\n          </div>\n          <div class="k-filter-toolbar-item">\n            <button\n                kendoButton\n                [title]="messageFor(\'addGroup\')"\n                icon="filter-add-group"\n                (click)="addFilterGroup()">\n                {{messageFor(\'addGroup\')}}\n            </button>\n          </div>\n          <div class="k-filter-toolbar-item">\n            <button\n                kendoButton\n                icon="close"\n                fillMode="flat"\n                [title]="messageFor(\'remove\')"\n                (click)="removeFilterGroup()">\n            </button>\n          </div>\n        </div>\n      </div>\n\n      <ul class="k-filter-lines" *ngIf="currentItem.filters">\n        <ng-container *ngFor="let item of currentItem.filters; let i = index;">\n          <li class="k-filter-item" *ngIf="!item[\'filters\']">\n            <kendo-filter-expression (valueChange)="valueChange.emit()" [currentItem]="item" [index]="i">\n            </kendo-filter-expression>\n          </li>\n          <li class="k-filter-item" *ngIf="item[\'filters\']">\n            <kendo-filter-group\n                (valueChange)="valueChange.emit()"\n                [currentItem]="item"\n                [index]="i"\n                >\n            </kendo-filter-group>\n          </li>\n        </ng-container>\n      </ul>\n  '}]}],ctorParameters:function(){return[{type:v},{type:d.LocalizationService},{type:u.ChangeDetectorRef}]},propDecorators:{index:[{type:n.Input}],currentItem:[{type:n.Input}],valueChange:[{type:n.Output}]}});var H=function(e,t){return(H=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r])})(e,t)};function J(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Class extends value "+String(t)+" is not a constructor or null");function r(){this.constructor=e}H(e,t),e.prototype=null===t?Object.create(t):(r.prototype=t.prototype,new r)}Object.create;function X(e,t){var r="function"==typeof Symbol&&e[Symbol.iterator];if(!r)return e;var n,o,i=r.call(e),a=[];try{for(;(void 0===t||0<t--)&&!(n=i.next()).done;)a.push(n.value)}catch(e){o={error:e}}finally{try{n&&!n.done&&(r=i.return)&&r.call(i)}finally{if(o)throw o.error}}return a}function Y(e,t,r){if(r||2===arguments.length)for(var n,o=0,i=t.length;o<i;o++)!n&&o in t||((n=n||Array.prototype.slice.call(t,0,o))[o]=t[o]);return e.concat(n||Array.prototype.slice.call(t))}Object.create;J(Z,Q=t.ComponentMessages);var Q,h=Z;function Z(){return null!==Q&&Q.apply(this,arguments)||this}h.ɵfac=u.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:h,deps:null,target:u.ɵɵFactoryTarget.Directive}),h.ɵdir=u.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:h,selector:"[kendoFilterMessages]",inputs:{filterExpressionOperators:"filterExpressionOperators",filterExpressionFilters:"filterExpressionFilters",remove:"remove",addGroup:"addGroup",addFilter:"addFilter",filterAndLogic:"filterAndLogic",filterOrLogic:"filterOrLogic",filterEqOperator:"filterEqOperator",filterNotEqOperator:"filterNotEqOperator",filterIsNullOperator:"filterIsNullOperator",filterIsNotNullOperator:"filterIsNotNullOperator",filterIsEmptyOperator:"filterIsEmptyOperator",filterIsNotEmptyOperator:"filterIsNotEmptyOperator",filterStartsWithOperator:"filterStartsWithOperator",filterContainsOperator:"filterContainsOperator",filterNotContainsOperator:"filterNotContainsOperator",filterEndsWithOperator:"filterEndsWithOperator",filterGteOperator:"filterGteOperator",filterGtOperator:"filterGtOperator",filterLteOperator:"filterLteOperator",filterLtOperator:"filterLtOperator",filterIsTrue:"filterIsTrue",filterIsFalse:"filterIsFalse",filterBooleanAll:"filterBooleanAll",filterAfterOrEqualOperator:"filterAfterOrEqualOperator",filterAfterOperator:"filterAfterOperator",filterBeforeOperator:"filterBeforeOperator",filterBeforeOrEqualOperator:"filterBeforeOrEqualOperator",editorNumericDecrement:"editorNumericDecrement",editorNumericIncrement:"editorNumericIncrement",editorDateTodayText:"editorDateTodayText",editorDateToggleText:"editorDateToggleText",filterFieldAriaLabel:"filterFieldAriaLabel",filterOperatorAriaLabel:"filterOperatorAriaLabel",filterValueAriaLabel:"filterValueAriaLabel",filterAriaLabel:"filterAriaLabel",filterToolbarAriaLabel:"filterToolbarAriaLabel"},usesInheritance:!0,ngImport:u}),u.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:h,decorators:[{type:n.Directive,args:[{selector:"[kendoFilterMessages]"}]}],propDecorators:{filterExpressionOperators:[{type:n.Input}],filterExpressionFilters:[{type:n.Input}],remove:[{type:n.Input}],addGroup:[{type:n.Input}],addFilter:[{type:n.Input}],filterAndLogic:[{type:n.Input}],filterOrLogic:[{type:n.Input}],filterEqOperator:[{type:n.Input}],filterNotEqOperator:[{type:n.Input}],filterIsNullOperator:[{type:n.Input}],filterIsNotNullOperator:[{type:n.Input}],filterIsEmptyOperator:[{type:n.Input}],filterIsNotEmptyOperator:[{type:n.Input}],filterStartsWithOperator:[{type:n.Input}],filterContainsOperator:[{type:n.Input}],filterNotContainsOperator:[{type:n.Input}],filterEndsWithOperator:[{type:n.Input}],filterGteOperator:[{type:n.Input}],filterGtOperator:[{type:n.Input}],filterLteOperator:[{type:n.Input}],filterLtOperator:[{type:n.Input}],filterIsTrue:[{type:n.Input}],filterIsFalse:[{type:n.Input}],filterBooleanAll:[{type:n.Input}],filterAfterOrEqualOperator:[{type:n.Input}],filterAfterOperator:[{type:n.Input}],filterBeforeOperator:[{type:n.Input}],filterBeforeOrEqualOperator:[{type:n.Input}],editorNumericDecrement:[{type:n.Input}],editorNumericIncrement:[{type:n.Input}],editorDateTodayText:[{type:n.Input}],editorDateToggleText:[{type:n.Input}],filterFieldAriaLabel:[{type:n.Input}],filterOperatorAriaLabel:[{type:n.Input}],filterValueAriaLabel:[{type:n.Input}],filterAriaLabel:[{type:n.Input}],filterToolbarAriaLabel:[{type:n.Input}]}});J(te,ee=h);var ee,w=te;function te(e){var t=ee.call(this)||this;return t.service=e,t}w.ɵfac=u.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:w,deps:[{token:d.LocalizationService}],target:u.ɵɵFactoryTarget.Directive}),w.ɵdir=u.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:w,selector:"[kendoFilterLocalizedMessages]",providers:[{provide:h,useExisting:n.forwardRef(function(){return w})}],usesInheritance:!0,ngImport:u}),u.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:w,decorators:[{type:n.Directive,args:[{providers:[{provide:h,useExisting:n.forwardRef(function(){return w})}],selector:"[kendoFilterLocalizedMessages]"}]}],ctorParameters:function(){return[{type:d.LocalizationService}]}});Object.defineProperty(S.prototype,"filters",{get:function(){return this.filterService.filters},set:function(e){0<e.length&&(this.filterService.filters=e.map(function(e){e=Object.assign({},e);return e.title||(e.title=e.field),e}),this.setValue(this.value))},enumerable:!1,configurable:!0}),Object.defineProperty(S.prototype,"value",{get:function(){return this._value},set:function(e){e=JSON.parse(JSON.stringify(e));this._value=e,0<this.filters.length&&this.setValue(this.value)},enumerable:!1,configurable:!0}),S.prototype.ngOnInit=function(){var t=this;this.localizationSubscription=this.localization.changes.subscribe(function(e){e=e.rtl;t.direction=e?"rtl":"ltr",t.cdr.detectChanges()})},S.prototype.ngAfterViewChecked=function(){if(this.filterFields&&0<this.filterFields.length&&(this.filters=this.filterFields.map(function(e){return Object.assign(Object.assign({},e),{editorTemplate:null==(e=e.editorTemplate)?void 0:e.templateRef})})),0===this.filters.length)throw new Error("Pass at least one user-defined filter through the [filters] input property or nest kendo-filter-field components. See http://www.telerik.com/kendo-angular-ui/components/filter/#data-binding")},S.prototype.ngOnDestroy=function(){this.localizationSubscription&&this.localizationSubscription.unsubscribe()},S.prototype.getCurrentFilter=function(){return this.filterService.normalizedValue},S.prototype.onValueChange=function(){this.valueChange.emit(this.filterService.normalizedValue)},S.prototype.normalizeFilter=function(t){var e=this.filterService.filters.find(function(e){return e.field===t.field});if(n.isDevMode()&&!e)throw new Error("There is no user-defined filter with '"+t.field+"' field provided through the [filters] input property.");if(n.isDevMode()&&"boolean"===e.editor&&!t.value&&!1!==t.value&&console.warn("Provide a value for the boolean '"+t.field+"' user-defined filter as the operator is always set to 'eq'."),n.isDevMode()&&"boolean"===e.editor&&"eq"!==t.operator&&console.warn("The operator of the boolean '"+t.field+"' user-defined filter is always set to 'eq'."),t.operator&&e.operators&&!e.operators.some(function(e){return e===t.operator}))throw new Error("The user-defined filter with field '"+t.field+"' is missing the '"+t.operator+"' operator.");"boolean"===e.editor&&(t.operator="eq"),"date"===e.editor&&t.value&&(t.value=new Date(t.value)),null==t.value&&(t.value=null),0<=k.indexOf(t.operator)&&(t.value=null)},S.prototype.setValue=function(e){this.normalizeValue(e),this.filterService.normalizedValue=e},S.prototype.normalizeValue=function(e){var t=this;this.filterService.filters.length&&e.filters.forEach(function(e){e.filters?t.normalizeValue(e):t.normalizeFilter(e)})};g=S;function S(e,t,r){this.filterService=e,this.localization=t,this.cdr=r,this.valueChange=new n.EventEmitter,this._value={filters:[],logic:"and"},z.validatePackage(j),this.direction=t.rtl?"rtl":"ltr"}g.ɵfac=u.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:g,deps:[{token:v},{token:d.LocalizationService},{token:u.ChangeDetectorRef}],target:u.ɵɵFactoryTarget.Component}),g.ɵcmp=u.ɵɵngDeclareComponent({minVersion:"12.0.0",version:"12.2.16",type:g,selector:"kendo-filter",inputs:{filters:"filters",value:"value"},outputs:{valueChange:"valueChange"},host:{properties:{"attr.dir":"this.direction"}},providers:[t.LocalizationService,{provide:t.L10N_PREFIX,useValue:"kendo.filter"},v],queries:[{propertyName:"filterFields",predicate:C}],ngImport:u,template:'\n        <ng-container kendoFilterLocalizedMessages\n            i18n-editorDateTodayText="kendo.filter.editorDateTodayText|The text of the Today button of the Date editor"\n            editorDateTodayText="Today"\n\n            i18n-editorDateToggleText="kendo.filter.editorDateToggleText|The title of the Toggle button of the Date editor."\n            editorDateToggleText="Toggle calendar"\n\n            i18n-editorNumericDecrement="kendo.filter.editorNumericDecrement|The title of the Decrement button of the Numeric editor"\n            editorNumericDecrement="Decrement"\n\n            i18n-editorNumericIncrement="kendo.filter.editorNumericIncrement|The title of the Increment button of the Numeric editor"\n            editorNumericIncrement="Increment"\n\n            i18n-filterExpressionOperators="kendo.filter.filterExpressionOperators|The text of the Filter Expression Operators drop down"\n            filterExpressionOperators="Operators"\n\n            i18n-filterExpressionFilters="kendo.filter.filterExpressionFilters|The text of the Filter Expression filters drop down"\n            filterExpressionFilters="Fields"\n\n            i18n-remove="kendo.filter.remove|The text of the Remove button"\n            remove="Remove"\n\n            i18n-addFilter="kendo.filter.addFilter|The text of the Add Filter button"\n            addFilter="Add Filter"\n\n            i18n-addGroup="kendo.filter.addGroup|The text of the Add Group button"\n            addGroup="Add Group"\n\n            i18n-filterAndLogic="kendo.filter.filterAndLogic|The text of the And filter logic"\n            filterAndLogic="And"\n\n            i18n-filterOrLogic="kendo.filter.filterOrLogic|The text of the Or filter logic"\n            filterOrLogic="Or"\n\n            i18n-filterEqOperator="kendo.filter.filterEqOperator|The text of the equal filter operator"\n            filterEqOperator="Is equal to"\n\n            i18n-filterNotEqOperator="kendo.filter.filterNotEqOperator|The text of the not equal filter operator"\n            filterNotEqOperator="Is not equal to"\n\n            i18n-filterIsNullOperator="kendo.filter.filterIsNullOperator|The text of the is null filter operator"\n            filterIsNullOperator="Is null"\n\n            i18n-filterIsNotNullOperator="kendo.filter.filterIsNotNullOperator|The text of the is not null filter operator"\n            filterIsNotNullOperator="Is not null"\n\n            i18n-filterIsEmptyOperator="kendo.filter.filterIsEmptyOperator|The text of the is empty filter operator"\n            filterIsEmptyOperator="Is empty"\n\n            i18n-filterIsNotEmptyOperator="kendo.filter.filterIsNotEmptyOperator|The text of the is not empty filter operator"\n            filterIsNotEmptyOperator="Is not empty"\n\n            i18n-filterStartsWithOperator="kendo.filter.filterStartsWithOperator|The text of the starts with filter operator"\n            filterStartsWithOperator="Starts with"\n\n            i18n-filterContainsOperator="kendo.filter.filterContainsOperator|The text of the contains filter operator"\n            filterContainsOperator="Contains"\n\n            i18n-filterNotContainsOperator="kendo.filter.filterNotContainsOperator|The text of the does not contain filter operator"\n            filterNotContainsOperator="Does not contain"\n\n            i18n-filterEndsWithOperator="kendo.filter.filterEndsWithOperator|The text of the ends with filter operator"\n            filterEndsWithOperator="Ends with"\n\n            i18n-filterGteOperator="kendo.filter.filterGteOperator|The text of the greater than or equal filter operator"\n            filterGteOperator="Is greater than or equal to"\n\n            i18n-filterGtOperator="kendo.filter.filterGtOperator|The text of the greater than filter operator"\n            filterGtOperator="Is greater than"\n\n            i18n-filterLteOperator="kendo.filter.filterLteOperator|The text of the less than or equal filter operator"\n            filterLteOperator="Is less than or equal to"\n\n            i18n-filterLtOperator="kendo.filter.filterLtOperator|The text of the less than filter operator"\n            filterLtOperator="Is less than"\n\n            i18n-filterIsTrue="kendo.filter.filterIsTrue|The text of the IsTrue boolean filter option"\n            filterIsTrue="Is True"\n\n            i18n-filterIsFalse="kendo.filter.filterIsFalse|The text of the IsFalse boolean filter option"\n            filterIsFalse="Is False"\n\n            i18n-filterBooleanAll="kendo.filter.filterBooleanAll|The text of the (All) boolean filter option"\n            filterBooleanAll="(All)"\n\n            i18n-filterAfterOrEqualOperator="kendo.filter.filterAfterOrEqualOperator|The text of the after or equal date filter operator"\n            filterAfterOrEqualOperator="Is after or equal to"\n\n            i18n-filterAfterOperator="kendo.filter.filterAfterOperator|The text of the after date filter operator"\n            filterAfterOperator="Is after"\n\n            i18n-filterBeforeOperator="kendo.filter.filterBeforeOperator|The text of the before date filter operator"\n            filterBeforeOperator="Is before"\n\n            i18n-filterBeforeOrEqualOperator="kendo.filter.filterBeforeOrEqualOperator|The text of the before or equal date filter operator"\n            filterBeforeOrEqualOperator="Is before or equal to"\n\n            i18n-filterFieldAriaLabel="kendo.filter.filterFieldAriaLabel|The text of the filter field aria label"\n            filterFieldAriaLabel="field"\n\n            i18n-filterOperatorAriaLabel="kendo.filter.filterOperatorAriaLabel|The text of the filter operator aria label"\n            filterOperatorAriaLabel="operator"\n\n            i18n-filterValueAriaLabel="kendo.filter.filterValueAriaLabel|The text of the filter value aria label"\n            filterValueAriaLabel="value"\n\n            i18n-filterAriaLabel="kendo.filter.filterAriaLabel|The text of the filter row aria label"\n            filterAriaLabel="filter"\n\n            i18n-filterToolbarAriaLabel="kendo.filter.filterToolbarAriaLabel|The text of the filter toolbar aria label"\n            filterToolbarAriaLabel="filter settings"\n            >\n        </ng-container>\n        <div class="k-widget k-filter" [attr.dir]="direction">\n            <ul class=\'k-filter-container\'>\n                <li class=\'k-filter-group-main\'>\n                    <kendo-filter-group\n                        [currentItem]="getCurrentFilter()"\n                        (valueChange)="onValueChange()"\n                        >\n                    </kendo-filter-group>\n                </li>\n            </ul>\n        </div>\n    ',isInline:!0,components:[{type:f,selector:"kendo-filter-group",inputs:["index","currentItem"],outputs:["valueChange"]}],directives:[{type:w,selector:"[kendoFilterLocalizedMessages]"}]}),u.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:g,decorators:[{type:n.Component,args:[{providers:[t.LocalizationService,{provide:t.L10N_PREFIX,useValue:"kendo.filter"},v],selector:"kendo-filter",template:'\n        <ng-container kendoFilterLocalizedMessages\n            i18n-editorDateTodayText="kendo.filter.editorDateTodayText|The text of the Today button of the Date editor"\n            editorDateTodayText="Today"\n\n            i18n-editorDateToggleText="kendo.filter.editorDateToggleText|The title of the Toggle button of the Date editor."\n            editorDateToggleText="Toggle calendar"\n\n            i18n-editorNumericDecrement="kendo.filter.editorNumericDecrement|The title of the Decrement button of the Numeric editor"\n            editorNumericDecrement="Decrement"\n\n            i18n-editorNumericIncrement="kendo.filter.editorNumericIncrement|The title of the Increment button of the Numeric editor"\n            editorNumericIncrement="Increment"\n\n            i18n-filterExpressionOperators="kendo.filter.filterExpressionOperators|The text of the Filter Expression Operators drop down"\n            filterExpressionOperators="Operators"\n\n            i18n-filterExpressionFilters="kendo.filter.filterExpressionFilters|The text of the Filter Expression filters drop down"\n            filterExpressionFilters="Fields"\n\n            i18n-remove="kendo.filter.remove|The text of the Remove button"\n            remove="Remove"\n\n            i18n-addFilter="kendo.filter.addFilter|The text of the Add Filter button"\n            addFilter="Add Filter"\n\n            i18n-addGroup="kendo.filter.addGroup|The text of the Add Group button"\n            addGroup="Add Group"\n\n            i18n-filterAndLogic="kendo.filter.filterAndLogic|The text of the And filter logic"\n            filterAndLogic="And"\n\n            i18n-filterOrLogic="kendo.filter.filterOrLogic|The text of the Or filter logic"\n            filterOrLogic="Or"\n\n            i18n-filterEqOperator="kendo.filter.filterEqOperator|The text of the equal filter operator"\n            filterEqOperator="Is equal to"\n\n            i18n-filterNotEqOperator="kendo.filter.filterNotEqOperator|The text of the not equal filter operator"\n            filterNotEqOperator="Is not equal to"\n\n            i18n-filterIsNullOperator="kendo.filter.filterIsNullOperator|The text of the is null filter operator"\n            filterIsNullOperator="Is null"\n\n            i18n-filterIsNotNullOperator="kendo.filter.filterIsNotNullOperator|The text of the is not null filter operator"\n            filterIsNotNullOperator="Is not null"\n\n            i18n-filterIsEmptyOperator="kendo.filter.filterIsEmptyOperator|The text of the is empty filter operator"\n            filterIsEmptyOperator="Is empty"\n\n            i18n-filterIsNotEmptyOperator="kendo.filter.filterIsNotEmptyOperator|The text of the is not empty filter operator"\n            filterIsNotEmptyOperator="Is not empty"\n\n            i18n-filterStartsWithOperator="kendo.filter.filterStartsWithOperator|The text of the starts with filter operator"\n            filterStartsWithOperator="Starts with"\n\n            i18n-filterContainsOperator="kendo.filter.filterContainsOperator|The text of the contains filter operator"\n            filterContainsOperator="Contains"\n\n            i18n-filterNotContainsOperator="kendo.filter.filterNotContainsOperator|The text of the does not contain filter operator"\n            filterNotContainsOperator="Does not contain"\n\n            i18n-filterEndsWithOperator="kendo.filter.filterEndsWithOperator|The text of the ends with filter operator"\n            filterEndsWithOperator="Ends with"\n\n            i18n-filterGteOperator="kendo.filter.filterGteOperator|The text of the greater than or equal filter operator"\n            filterGteOperator="Is greater than or equal to"\n\n            i18n-filterGtOperator="kendo.filter.filterGtOperator|The text of the greater than filter operator"\n            filterGtOperator="Is greater than"\n\n            i18n-filterLteOperator="kendo.filter.filterLteOperator|The text of the less than or equal filter operator"\n            filterLteOperator="Is less than or equal to"\n\n            i18n-filterLtOperator="kendo.filter.filterLtOperator|The text of the less than filter operator"\n            filterLtOperator="Is less than"\n\n            i18n-filterIsTrue="kendo.filter.filterIsTrue|The text of the IsTrue boolean filter option"\n            filterIsTrue="Is True"\n\n            i18n-filterIsFalse="kendo.filter.filterIsFalse|The text of the IsFalse boolean filter option"\n            filterIsFalse="Is False"\n\n            i18n-filterBooleanAll="kendo.filter.filterBooleanAll|The text of the (All) boolean filter option"\n            filterBooleanAll="(All)"\n\n            i18n-filterAfterOrEqualOperator="kendo.filter.filterAfterOrEqualOperator|The text of the after or equal date filter operator"\n            filterAfterOrEqualOperator="Is after or equal to"\n\n            i18n-filterAfterOperator="kendo.filter.filterAfterOperator|The text of the after date filter operator"\n            filterAfterOperator="Is after"\n\n            i18n-filterBeforeOperator="kendo.filter.filterBeforeOperator|The text of the before date filter operator"\n            filterBeforeOperator="Is before"\n\n            i18n-filterBeforeOrEqualOperator="kendo.filter.filterBeforeOrEqualOperator|The text of the before or equal date filter operator"\n            filterBeforeOrEqualOperator="Is before or equal to"\n\n            i18n-filterFieldAriaLabel="kendo.filter.filterFieldAriaLabel|The text of the filter field aria label"\n            filterFieldAriaLabel="field"\n\n            i18n-filterOperatorAriaLabel="kendo.filter.filterOperatorAriaLabel|The text of the filter operator aria label"\n            filterOperatorAriaLabel="operator"\n\n            i18n-filterValueAriaLabel="kendo.filter.filterValueAriaLabel|The text of the filter value aria label"\n            filterValueAriaLabel="value"\n\n            i18n-filterAriaLabel="kendo.filter.filterAriaLabel|The text of the filter row aria label"\n            filterAriaLabel="filter"\n\n            i18n-filterToolbarAriaLabel="kendo.filter.filterToolbarAriaLabel|The text of the filter toolbar aria label"\n            filterToolbarAriaLabel="filter settings"\n            >\n        </ng-container>\n        <div class="k-widget k-filter" [attr.dir]="direction">\n            <ul class=\'k-filter-container\'>\n                <li class=\'k-filter-group-main\'>\n                    <kendo-filter-group\n                        [currentItem]="getCurrentFilter()"\n                        (valueChange)="onValueChange()"\n                        >\n                    </kendo-filter-group>\n                </li>\n            </ul>\n        </div>\n    '}]}],ctorParameters:function(){return[{type:v},{type:d.LocalizationService},{type:u.ChangeDetectorRef}]},propDecorators:{direction:[{type:n.HostBinding,args:["attr.dir"]}],filters:[{type:n.Input}],value:[{type:n.Input}],valueChange:[{type:n.Output}],filterFields:[{type:n.ContentChildren,args:[C]}]}});J(ne,re=h),Object.defineProperty(ne.prototype,"override",{get:function(){return!0},enumerable:!1,configurable:!0});var re,q=ne;function ne(e){var t=re.call(this)||this;return t.service=e,t}q.ɵfac=u.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:q,deps:[{token:d.LocalizationService}],target:u.ɵɵFactoryTarget.Component}),q.ɵcmp=u.ɵɵngDeclareComponent({minVersion:"12.0.0",version:"12.2.16",type:q,selector:"kendo-filter-messages",providers:[{provide:h,useExisting:n.forwardRef(function(){return q})}],usesInheritance:!0,ngImport:u,template:"",isInline:!0}),u.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:q,decorators:[{type:n.Component,args:[{providers:[{provide:h,useExisting:n.forwardRef(function(){return q})}],selector:"kendo-filter-messages",template:""}]}],ctorParameters:function(){return[{type:d.LocalizationService}]}});t=[a.CommonModule,o.InputsModule,s.LabelModule,r.DropDownsModule,l.ButtonsModule,i.DateInputsModule],h=function(){},h.ɵfac=u.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:h,deps:[],target:u.ɵɵFactoryTarget.NgModule}),h.ɵmod=u.ɵɵngDeclareNgModule({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:h,imports:[a.CommonModule,o.InputsModule,s.LabelModule,r.DropDownsModule,l.ButtonsModule,i.DateInputsModule],exports:[a.CommonModule,o.InputsModule,s.LabelModule,r.DropDownsModule,l.ButtonsModule,i.DateInputsModule]}),h.ɵinj=u.ɵɵngDeclareInjector({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:h,imports:[Y([],X(t)),a.CommonModule,o.InputsModule,s.LabelModule,r.DropDownsModule,l.ButtonsModule,i.DateInputsModule]}),u.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:h,decorators:[{type:n.NgModule,args:[{imports:Y([],X(t)),exports:Y([],X(t))}]}]}),a=function(){};a.ɵfac=u.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:a,deps:[],target:u.ɵɵFactoryTarget.NgModule}),a.ɵmod=u.ɵɵngDeclareNgModule({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:a,declarations:[g,L,F,m,f,T,c,A,w,q,x,C,O],imports:[h],exports:[g,L,F,m,f,T,c,A,w,q,x,C,O]}),a.ɵinj=u.ɵɵngDeclareInjector({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:a,imports:[[h]]}),u.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:u,type:a,decorators:[{type:n.NgModule,args:[{imports:[h],declarations:[g,L,F,m,f,T,c,A,w,q,x,C,O],exports:[g,L,F,m,f,T,c,A,w,q,x,C,O]}]}]}),e.AriaLabelValueDirective=x,e.CustomMessagesComponent=q,e.FilterBooleanEditorComponent=c,e.FilterComponent=g,e.FilterDateEditorComponent=A,e.FilterExpressionComponent=m,e.FilterExpressionOperatorsComponent=T,e.FilterFieldComponent=C,e.FilterGroupComponent=f,e.FilterModule=a,e.FilterNumericEditorComponent=L,e.FilterTextEditorComponent=F,e.FilterValueEditorTemplateDirective=O,e.LocalizedMessagesDirective=w,Object.defineProperty(e,"__esModule",{value:!0})});

package/esm2015/editors/boolean-editor.component.js

@@ -47,7 +47,6 @@ FilterBooleanEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0
 FilterBooleanEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FilterBooleanEditorComponent, selector: "kendo-filter-boolean-editor", inputs: { currentItem: "currentItem" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: `
     <kendo-dropdownlist
         [kendoAriaLabelValue]="messageFor('filterValueAriaLabel')"
-        class="k-filter-toolbar-item k-filter-value"
         [(value)]="currentItem.value"
         (valueChange)="valueChange.emit()"
         [data]="items"
@@ -65,7 +64,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                     template: `
     <kendo-dropdownlist
         [kendoAriaLabelValue]="messageFor('filterValueAriaLabel')"
-        class="k-filter-toolbar-item k-filter-value"
         [(value)]="currentItem.value"
         (valueChange)="valueChange.emit()"
         [data]="items"

package/esm2015/editors/date-editor.component.js

@@ -23,7 +23,6 @@ FilterDateEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0"
 FilterDateEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FilterDateEditorComponent, selector: "kendo-filter-date-editor", inputs: { currentItem: "currentItem", isDisabled: "isDisabled" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: `
         <kendo-datepicker
             [kendoAriaLabelValue]="messageFor('filterValueAriaLabel')"
-            class="k-filter-toolbar-item k-filter-value"
             [(value)]="currentItem.value"
             (valueChange)="valueChange.emit()"
             [disabled]="isDisabled">
@@ -40,7 +39,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                     template: `
         <kendo-datepicker
             [kendoAriaLabelValue]="messageFor('filterValueAriaLabel')"
-            class="k-filter-toolbar-item k-filter-value"
             [(value)]="currentItem.value"
             (valueChange)="valueChange.emit()"
             [disabled]="isDisabled">

package/esm2015/editors/numeric-editor.component.js

@@ -23,7 +23,6 @@ FilterNumericEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0
 FilterNumericEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FilterNumericEditorComponent, selector: "kendo-filter-numeric-editor", inputs: { currentItem: "currentItem", isDisabled: "isDisabled" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: `
         <kendo-numerictextbox
             [kendoAriaLabelValue]="messageFor('filterValueAriaLabel')"
-            class="k-filter-toolbar-item k-filter-value"
             [(value)]="currentItem.value"
             (valueChange)="valueChange.emit()"
             [disabled]="isDisabled">
@@ -40,7 +39,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                     template: `
         <kendo-numerictextbox
             [kendoAriaLabelValue]="messageFor('filterValueAriaLabel')"
-            class="k-filter-toolbar-item k-filter-value"
             [(value)]="currentItem.value"
             (valueChange)="valueChange.emit()"
             [disabled]="isDisabled">

package/esm2015/editors/text-editor.component.js

@@ -23,7 +23,6 @@ FilterTextEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0"
 FilterTextEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FilterTextEditorComponent, selector: "kendo-filter-text-editor", inputs: { currentItem: "currentItem", isDisabled: "isDisabled" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: `
         <kendo-textbox
             [kendoAriaLabelValue]="messageFor('filterValueAriaLabel')"
-            class="k-filter-toolbar-item k-filter-value"
             [(value)]="currentItem.value"
             (valueChange)="valueChange.emit()"
             [disabled]="isDisabled">
@@ -36,7 +35,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                     template: `
         <kendo-textbox
             [kendoAriaLabelValue]="messageFor('filterValueAriaLabel')"
-            class="k-filter-toolbar-item k-filter-value"
             [(value)]="currentItem.value"
             (valueChange)="valueChange.emit()"
             [disabled]="isDisabled">

package/esm2015/filter-expression.component.js

@@ -42,6 +42,7 @@ export class FilterExpressionComponent {
             this.currentItem.field = this.filterService.filters[0].field;
             this.setOperators(defaultFilter);
         }
+        this.setEditorTemplate();
         this.localizationSubscription = this.localization.changes.subscribe(() => {
             this.setOperators(foundFilter || defaultFilter);
             this.cdr.detectChanges();
@@ -77,6 +78,7 @@ export class FilterExpressionComponent {
     filterValueChange(value) {
         this.currentItem.value = null;
         this.currentItem.field = value;
+        this.setEditorTemplate();
         const foundFilter = this.getFilterExpressionByField(this.currentItem.field);
         this.setOperators(foundFilter);
         this.valueChange.emit();
@@ -130,6 +132,12 @@ export class FilterExpressionComponent {
             this.isEditorDisabled = false;
         }
     }
+    setEditorTemplate() {
+        let filterExpression = this.filterService.filters.find((filter) => filter.field === this.currentItem.field);
+        if (filterExpression.editorTemplate) {
+            this.editorTemplate = filterExpression.editorTemplate;
+        }
+    }
 }
 FilterExpressionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: FilterExpressionComponent, deps: [{ token: i1.FilterService }, { token: i2.LocalizationService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
 FilterExpressionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FilterExpressionComponent, selector: "kendo-filter-expression", inputs: { index: "index", currentItem: "currentItem" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: `
@@ -156,12 +164,19 @@ FilterExpressionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.
                     </kendo-filter-expression-operators>
                 </div>
 
-                <ng-container [ngSwitch]="getEditorType()">
-                    <kendo-filter-text-editor *ngSwitchCase="'string'" [currentItem]="currentItem" [isDisabled]="isEditorDisabled" (valueChange)="valueChange.emit()"></kendo-filter-text-editor>
-                    <kendo-filter-numeric-editor *ngSwitchCase="'number'" [currentItem]="currentItem" [isDisabled]="isEditorDisabled" (valueChange)="valueChange.emit()"></kendo-filter-numeric-editor>
-                    <kendo-filter-boolean-editor *ngSwitchCase="'boolean'" [currentItem]="currentItem" (valueChange)="valueChange.emit()"></kendo-filter-boolean-editor>
-                    <kendo-filter-date-editor *ngSwitchCase="'date'" [currentItem]="currentItem" [isDisabled]="isEditorDisabled" (valueChange)="valueChange.emit()"></kendo-filter-date-editor>
-                </ng-container>
+                <div class="k-filter-toolbar-item k-filter-value">
+                    <ng-container *ngIf="!editorTemplate" [ngSwitch]="getEditorType()">
+                        <kendo-filter-text-editor *ngSwitchCase="'string'" [currentItem]="currentItem" [isDisabled]="isEditorDisabled" (valueChange)="valueChange.emit()"></kendo-filter-text-editor>
+                        <kendo-filter-numeric-editor *ngSwitchCase="'number'" [currentItem]="currentItem" [isDisabled]="isEditorDisabled" (valueChange)="valueChange.emit()"></kendo-filter-numeric-editor>
+                        <kendo-filter-boolean-editor *ngSwitchCase="'boolean'" [currentItem]="currentItem" (valueChange)="valueChange.emit()"></kendo-filter-boolean-editor>
+                        <kendo-filter-date-editor *ngSwitchCase="'date'" [currentItem]="currentItem" [isDisabled]="isEditorDisabled" (valueChange)="valueChange.emit()"></kendo-filter-date-editor>
+                    </ng-container>
+                    <ng-container *ngIf="editorTemplate">
+                        <ng-template
+                            [templateContext]="{templateRef: editorTemplate, $implicit: currentItem}">
+                        </ng-template>
+                    </ng-container>
+                </div>
 
                 <div class="k-filter-toolbar-item">
                     <button
@@ -174,7 +189,7 @@ FilterExpressionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.
                 </div>
             </div>
         </div>
-  `, isInline: true, components: [{ type: i3.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["iconClass", "loading", "data", "value", "textField", "valueField", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }, { type: i4.FilterExpressionOperatorsComponent, selector: "kendo-filter-expression-operators", inputs: ["currentItem", "editorType", "operators"], outputs: ["valueChange"] }, { type: i5.FilterTextEditorComponent, selector: "kendo-filter-text-editor", inputs: ["currentItem", "isDisabled"], outputs: ["valueChange"] }, { type: i6.FilterNumericEditorComponent, selector: "kendo-filter-numeric-editor", inputs: ["currentItem", "isDisabled"], outputs: ["valueChange"] }, { type: i7.FilterBooleanEditorComponent, selector: "kendo-filter-boolean-editor", inputs: ["currentItem"], outputs: ["valueChange"] }, { type: i8.FilterDateEditorComponent, selector: "kendo-filter-date-editor", inputs: ["currentItem", "isDisabled"], outputs: ["valueChange"] }], directives: [{ type: i9.AriaLabelValueDirective, selector: "[kendoAriaLabelValue]", inputs: ["kendoAriaLabelValue"] }, { type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i10.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i10.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i11.ButtonDirective, selector: "button[kendoButton], span[kendoButton]", inputs: ["toggleable", "togglable", "selected", "tabIndex", "icon", "iconClass", "imageUrl", "disabled", "size", "rounded", "fillMode", "themeColor", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }] });
+  `, isInline: true, components: [{ type: i3.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["iconClass", "loading", "data", "value", "textField", "valueField", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }, { type: i4.FilterExpressionOperatorsComponent, selector: "kendo-filter-expression-operators", inputs: ["currentItem", "editorType", "operators"], outputs: ["valueChange"] }, { type: i5.FilterTextEditorComponent, selector: "kendo-filter-text-editor", inputs: ["currentItem", "isDisabled"], outputs: ["valueChange"] }, { type: i6.FilterNumericEditorComponent, selector: "kendo-filter-numeric-editor", inputs: ["currentItem", "isDisabled"], outputs: ["valueChange"] }, { type: i7.FilterBooleanEditorComponent, selector: "kendo-filter-boolean-editor", inputs: ["currentItem"], outputs: ["valueChange"] }, { type: i8.FilterDateEditorComponent, selector: "kendo-filter-date-editor", inputs: ["currentItem", "isDisabled"], outputs: ["valueChange"] }], directives: [{ type: i9.AriaLabelValueDirective, selector: "[kendoAriaLabelValue]", inputs: ["kendoAriaLabelValue"] }, { type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i10.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i10.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i11.TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }, { type: i11.ButtonDirective, selector: "button[kendoButton], span[kendoButton]", inputs: ["toggleable", "togglable", "selected", "tabIndex", "icon", "iconClass", "imageUrl", "disabled", "size", "rounded", "fillMode", "themeColor", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: FilterExpressionComponent, decorators: [{
             type: Component,
             args: [{
@@ -203,12 +218,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                     </kendo-filter-expression-operators>
                 </div>
 
-                <ng-container [ngSwitch]="getEditorType()">
-                    <kendo-filter-text-editor *ngSwitchCase="'string'" [currentItem]="currentItem" [isDisabled]="isEditorDisabled" (valueChange)="valueChange.emit()"></kendo-filter-text-editor>
-                    <kendo-filter-numeric-editor *ngSwitchCase="'number'" [currentItem]="currentItem" [isDisabled]="isEditorDisabled" (valueChange)="valueChange.emit()"></kendo-filter-numeric-editor>
-                    <kendo-filter-boolean-editor *ngSwitchCase="'boolean'" [currentItem]="currentItem" (valueChange)="valueChange.emit()"></kendo-filter-boolean-editor>
-                    <kendo-filter-date-editor *ngSwitchCase="'date'" [currentItem]="currentItem" [isDisabled]="isEditorDisabled" (valueChange)="valueChange.emit()"></kendo-filter-date-editor>
-                </ng-container>
+                <div class="k-filter-toolbar-item k-filter-value">
+                    <ng-container *ngIf="!editorTemplate" [ngSwitch]="getEditorType()">
+                        <kendo-filter-text-editor *ngSwitchCase="'string'" [currentItem]="currentItem" [isDisabled]="isEditorDisabled" (valueChange)="valueChange.emit()"></kendo-filter-text-editor>
+                        <kendo-filter-numeric-editor *ngSwitchCase="'number'" [currentItem]="currentItem" [isDisabled]="isEditorDisabled" (valueChange)="valueChange.emit()"></kendo-filter-numeric-editor>
+                        <kendo-filter-boolean-editor *ngSwitchCase="'boolean'" [currentItem]="currentItem" (valueChange)="valueChange.emit()"></kendo-filter-boolean-editor>
+                        <kendo-filter-date-editor *ngSwitchCase="'date'" [currentItem]="currentItem" [isDisabled]="isEditorDisabled" (valueChange)="valueChange.emit()"></kendo-filter-date-editor>
+                    </ng-container>
+                    <ng-container *ngIf="editorTemplate">
+                        <ng-template
+                            [templateContext]="{templateRef: editorTemplate, $implicit: currentItem}">
+                        </ng-template>
+                    </ng-container>
+                </div>
 
                 <div class="k-filter-toolbar-item">
                     <button

package/esm2015/filter-field.component.js

@@ -2,7 +2,9 @@
 * Copyright © 2021 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
+import { ContentChild } from '@angular/core';
 import { Component, Input } from '@angular/core';
+import { FilterValueEditorTemplateDirective } from './templates/value-editor.template';
 import * as i0 from "@angular/core";
 /**
  * Represents the [Kendo UI Filter Field component for Angular]({% slug api_filter_filterfieldcomponent %}).
@@ -45,7 +47,7 @@ export class FilterFieldComponent {
     }
 }
 FilterFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: FilterFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-FilterFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FilterFieldComponent, selector: "kendo-filter-field", inputs: { field: "field", title: "title", editor: "editor", operators: "operators" }, ngImport: i0, template: ``, isInline: true });
+FilterFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FilterFieldComponent, selector: "kendo-filter-field", inputs: { field: "field", title: "title", editor: "editor", operators: "operators" }, queries: [{ propertyName: "editorTemplate", first: true, predicate: FilterValueEditorTemplateDirective, descendants: true }], ngImport: i0, template: ``, isInline: true });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: FilterFieldComponent, decorators: [{
             type: Component,
             args: [{
@@ -60,4 +62,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                 type: Input
             }], operators: [{
                 type: Input
+            }], editorTemplate: [{
+                type: ContentChild,
+                args: [FilterValueEditorTemplateDirective]
             }] } });

package/esm2015/filter.component.js

@@ -99,7 +99,10 @@ export class FilterComponent {
     }
     ngAfterViewChecked() {
         if (this.filterFields && this.filterFields.length > 0) {
-            this.filters = this.filterFields.map((filterField) => filterField);
+            this.filters = this.filterFields.map((filterField) => {
+                var _a;
+                return (Object.assign(Object.assign({}, filterField), { editorTemplate: (_a = filterField.editorTemplate) === null || _a === void 0 ? void 0 : _a.templateRef }));
+            });
         }
         if (this.filters.length === 0) {
             throw new Error(`Pass at least one user-defined filter through the [filters] input property or nest kendo-filter-field components. See http://www.telerik.com/kendo-angular-ui/components/filter/#data-binding`);
@@ -130,6 +133,9 @@ export class FilterComponent {
         if (isDevMode() && foundFilter.editor === 'boolean' && (!filterDescriptor.value && filterDescriptor.value !== false)) {
             console.warn(`Provide a value for the boolean '${filterDescriptor.field}' user-defined filter as the operator is always set to 'eq'.`);
         }
+        if (isDevMode() && foundFilter.editor === 'boolean' && filterDescriptor.operator !== 'eq') {
+            console.warn(`The operator of the boolean '${filterDescriptor.field}' user-defined filter is always set to 'eq'.`);
+        }
         if (filterDescriptor.operator && foundFilter.operators && !foundFilter.operators.some(operator => operator === filterDescriptor.operator)) {
             throw new Error(`The user-defined filter with field '${filterDescriptor.field}' is missing the '${filterDescriptor.operator}' operator.`);
         }

package/esm2015/filter.module.js

@@ -16,6 +16,7 @@ import { FilterComponent } from './filter.component';
 import { CustomMessagesComponent } from './localization/custom-messages.component';
 import { LocalizedMessagesDirective } from './localization/localized-messages.directive';
 import { SharedModule } from './shared.module';
+import { FilterValueEditorTemplateDirective } from './templates/value-editor.template';
 import * as i0 from "@angular/core";
 /**
  * Represents the [NgModule]({{ site.data.urls.angular['ngmoduleapi'] }})
@@ -62,7 +63,8 @@ FilterModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "
         LocalizedMessagesDirective,
         CustomMessagesComponent,
         AriaLabelValueDirective,
-        FilterFieldComponent], imports: [SharedModule], exports: [FilterComponent,
+        FilterFieldComponent,
+        FilterValueEditorTemplateDirective], imports: [SharedModule], exports: [FilterComponent,
         FilterNumericEditorComponent,
         FilterTextEditorComponent,
         FilterExpressionComponent,
@@ -73,7 +75,8 @@ FilterModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "
         LocalizedMessagesDirective,
         CustomMessagesComponent,
         AriaLabelValueDirective,
-        FilterFieldComponent] });
+        FilterFieldComponent,
+        FilterValueEditorTemplateDirective] });
 FilterModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: FilterModule, imports: [[SharedModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: FilterModule, decorators: [{
             type: NgModule,
@@ -90,7 +93,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                         LocalizedMessagesDirective,
                         CustomMessagesComponent,
                         AriaLabelValueDirective,
-                        FilterFieldComponent
+                        FilterFieldComponent,
+                        FilterValueEditorTemplateDirective
                     ],
                     exports: [FilterComponent,
                         FilterNumericEditorComponent,
@@ -103,6 +107,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                         LocalizedMessagesDirective,
                         CustomMessagesComponent,
                         AriaLabelValueDirective,
-                        FilterFieldComponent]
+                        FilterFieldComponent,
+                        FilterValueEditorTemplateDirective]
                 }]
         }] });

package/esm2015/main.js

@@ -15,3 +15,4 @@ export { FilterExpressionComponent } from './filter-expression.component';
 export { CustomMessagesComponent } from './localization/custom-messages.component';
 export { LocalizedMessagesDirective } from './localization/localized-messages.directive';
 export { FilterFieldComponent } from './filter-field.component';
+export { FilterValueEditorTemplateDirective } from './templates/value-editor.template';

package/esm2015/package-metadata.js

@@ -9,7 +9,7 @@ export const packageMetadata = {
     name: '@progress/kendo-angular-filter',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1654698725,
+    publishDate: 1655280742,
     version: '',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning'
 };

package/esm2015/templates/value-editor.template.js

@@ -0,0 +1,19 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { Directive } from '@angular/core';
+import * as i0 from "@angular/core";
+export class FilterValueEditorTemplateDirective {
+    constructor(templateRef) {
+        this.templateRef = templateRef;
+    }
+}
+FilterValueEditorTemplateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: FilterValueEditorTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
+FilterValueEditorTemplateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: FilterValueEditorTemplateDirective, selector: "[kendoFilterValueEditorTemplate]", ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: FilterValueEditorTemplateDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[kendoFilterValueEditorTemplate]'
+                }]
+        }], ctorParameters: function () { return [{ type: i0.TemplateRef }]; } });

package/fesm2015/kendo-angular-filter.js

@@ -3,7 +3,7 @@
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import * as i0 from '@angular/core';
-import { Injectable, Component, Input, Directive, EventEmitter, Output, forwardRef, isDevMode, HostBinding, ContentChildren, NgModule } from '@angular/core';
+import { Injectable, Directive, Component, Input, ContentChild, EventEmitter, Output, forwardRef, isDevMode, HostBinding, ContentChildren, NgModule } from '@angular/core';
 import * as i1 from '@progress/kendo-angular-l10n';
 import { ComponentMessages, LocalizationService, L10N_PREFIX } from '@progress/kendo-angular-l10n';
 import { validatePackage } from '@progress/kendo-licensing';
@@ -201,11 +201,25 @@ const packageMetadata = {
     name: '@progress/kendo-angular-filter',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1654698725,
+    publishDate: 1655280742,
     version: '',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning'
 };
 
+class FilterValueEditorTemplateDirective {
+    constructor(templateRef) {
+        this.templateRef = templateRef;
+    }
+}
+FilterValueEditorTemplateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: FilterValueEditorTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
+FilterValueEditorTemplateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: FilterValueEditorTemplateDirective, selector: "[kendoFilterValueEditorTemplate]", ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: FilterValueEditorTemplateDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[kendoFilterValueEditorTemplate]'
+                }]
+        }], ctorParameters: function () { return [{ type: i0.TemplateRef }]; } });
+
 /**
  * Represents the [Kendo UI Filter Field component for Angular]({% slug api_filter_filterfieldcomponent %}).
  * The Filter Field component can be used to add Filter Expressions declaratively.
@@ -247,7 +261,7 @@ class FilterFieldComponent {
     }
 }
 FilterFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: FilterFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-FilterFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FilterFieldComponent, selector: "kendo-filter-field", inputs: { field: "field", title: "title", editor: "editor", operators: "operators" }, ngImport: i0, template: ``, isInline: true });
+FilterFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FilterFieldComponent, selector: "kendo-filter-field", inputs: { field: "field", title: "title", editor: "editor", operators: "operators" }, queries: [{ propertyName: "editorTemplate", first: true, predicate: FilterValueEditorTemplateDirective, descendants: true }], ngImport: i0, template: ``, isInline: true });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: FilterFieldComponent, decorators: [{
             type: Component,
             args: [{
@@ -262,6 +276,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                 type: Input
             }], operators: [{
                 type: Input
+            }], editorTemplate: [{
+                type: ContentChild,
+                args: [FilterValueEditorTemplateDirective]
             }] } });
 
 /**
@@ -376,7 +393,6 @@ FilterTextEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0"
 FilterTextEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FilterTextEditorComponent, selector: "kendo-filter-text-editor", inputs: { currentItem: "currentItem", isDisabled: "isDisabled" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: `
         <kendo-textbox
             [kendoAriaLabelValue]="messageFor('filterValueAriaLabel')"
-            class="k-filter-toolbar-item k-filter-value"
             [(value)]="currentItem.value"
             (valueChange)="valueChange.emit()"
             [disabled]="isDisabled">
@@ -389,7 +405,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                     template: `
         <kendo-textbox
             [kendoAriaLabelValue]="messageFor('filterValueAriaLabel')"
-            class="k-filter-toolbar-item k-filter-value"
             [(value)]="currentItem.value"
             (valueChange)="valueChange.emit()"
             [disabled]="isDisabled">
@@ -420,7 +435,6 @@ FilterNumericEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0
 FilterNumericEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FilterNumericEditorComponent, selector: "kendo-filter-numeric-editor", inputs: { currentItem: "currentItem", isDisabled: "isDisabled" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: `
         <kendo-numerictextbox
             [kendoAriaLabelValue]="messageFor('filterValueAriaLabel')"
-            class="k-filter-toolbar-item k-filter-value"
             [(value)]="currentItem.value"
             (valueChange)="valueChange.emit()"
             [disabled]="isDisabled">
@@ -437,7 +451,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                     template: `
         <kendo-numerictextbox
             [kendoAriaLabelValue]="messageFor('filterValueAriaLabel')"
-            class="k-filter-toolbar-item k-filter-value"
             [(value)]="currentItem.value"
             (valueChange)="valueChange.emit()"
             [disabled]="isDisabled">
@@ -496,7 +509,6 @@ FilterBooleanEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0
 FilterBooleanEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FilterBooleanEditorComponent, selector: "kendo-filter-boolean-editor", inputs: { currentItem: "currentItem" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: `
     <kendo-dropdownlist
         [kendoAriaLabelValue]="messageFor('filterValueAriaLabel')"
-        class="k-filter-toolbar-item k-filter-value"
         [(value)]="currentItem.value"
         (valueChange)="valueChange.emit()"
         [data]="items"
@@ -514,7 +526,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                     template: `
     <kendo-dropdownlist
         [kendoAriaLabelValue]="messageFor('filterValueAriaLabel')"
-        class="k-filter-toolbar-item k-filter-value"
         [(value)]="currentItem.value"
         (valueChange)="valueChange.emit()"
         [data]="items"
@@ -548,7 +559,6 @@ FilterDateEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0"
 FilterDateEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FilterDateEditorComponent, selector: "kendo-filter-date-editor", inputs: { currentItem: "currentItem", isDisabled: "isDisabled" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: `
         <kendo-datepicker
             [kendoAriaLabelValue]="messageFor('filterValueAriaLabel')"
-            class="k-filter-toolbar-item k-filter-value"
             [(value)]="currentItem.value"
             (valueChange)="valueChange.emit()"
             [disabled]="isDisabled">
@@ -565,7 +575,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                     template: `
         <kendo-datepicker
             [kendoAriaLabelValue]="messageFor('filterValueAriaLabel')"
-            class="k-filter-toolbar-item k-filter-value"
             [(value)]="currentItem.value"
             (valueChange)="valueChange.emit()"
             [disabled]="isDisabled">
@@ -610,6 +619,7 @@ class FilterExpressionComponent {
             this.currentItem.field = this.filterService.filters[0].field;
             this.setOperators(defaultFilter);
         }
+        this.setEditorTemplate();
         this.localizationSubscription = this.localization.changes.subscribe(() => {
             this.setOperators(foundFilter || defaultFilter);
             this.cdr.detectChanges();
@@ -645,6 +655,7 @@ class FilterExpressionComponent {
     filterValueChange(value) {
         this.currentItem.value = null;
         this.currentItem.field = value;
+        this.setEditorTemplate();
         const foundFilter = this.getFilterExpressionByField(this.currentItem.field);
         this.setOperators(foundFilter);
         this.valueChange.emit();
@@ -698,6 +709,12 @@ class FilterExpressionComponent {
             this.isEditorDisabled = false;
         }
     }
+    setEditorTemplate() {
+        let filterExpression = this.filterService.filters.find((filter) => filter.field === this.currentItem.field);
+        if (filterExpression.editorTemplate) {
+            this.editorTemplate = filterExpression.editorTemplate;
+        }
+    }
 }
 FilterExpressionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: FilterExpressionComponent, deps: [{ token: FilterService }, { token: i1.LocalizationService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
 FilterExpressionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FilterExpressionComponent, selector: "kendo-filter-expression", inputs: { index: "index", currentItem: "currentItem" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: `
@@ -724,12 +741,19 @@ FilterExpressionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.
                     </kendo-filter-expression-operators>
                 </div>
 
-                <ng-container [ngSwitch]="getEditorType()">
-                    <kendo-filter-text-editor *ngSwitchCase="'string'" [currentItem]="currentItem" [isDisabled]="isEditorDisabled" (valueChange)="valueChange.emit()"></kendo-filter-text-editor>
-                    <kendo-filter-numeric-editor *ngSwitchCase="'number'" [currentItem]="currentItem" [isDisabled]="isEditorDisabled" (valueChange)="valueChange.emit()"></kendo-filter-numeric-editor>
-                    <kendo-filter-boolean-editor *ngSwitchCase="'boolean'" [currentItem]="currentItem" (valueChange)="valueChange.emit()"></kendo-filter-boolean-editor>
-                    <kendo-filter-date-editor *ngSwitchCase="'date'" [currentItem]="currentItem" [isDisabled]="isEditorDisabled" (valueChange)="valueChange.emit()"></kendo-filter-date-editor>
-                </ng-container>
+                <div class="k-filter-toolbar-item k-filter-value">
+                    <ng-container *ngIf="!editorTemplate" [ngSwitch]="getEditorType()">
+                        <kendo-filter-text-editor *ngSwitchCase="'string'" [currentItem]="currentItem" [isDisabled]="isEditorDisabled" (valueChange)="valueChange.emit()"></kendo-filter-text-editor>
+                        <kendo-filter-numeric-editor *ngSwitchCase="'number'" [currentItem]="currentItem" [isDisabled]="isEditorDisabled" (valueChange)="valueChange.emit()"></kendo-filter-numeric-editor>
+                        <kendo-filter-boolean-editor *ngSwitchCase="'boolean'" [currentItem]="currentItem" (valueChange)="valueChange.emit()"></kendo-filter-boolean-editor>
+                        <kendo-filter-date-editor *ngSwitchCase="'date'" [currentItem]="currentItem" [isDisabled]="isEditorDisabled" (valueChange)="valueChange.emit()"></kendo-filter-date-editor>
+                    </ng-container>
+                    <ng-container *ngIf="editorTemplate">
+                        <ng-template
+                            [templateContext]="{templateRef: editorTemplate, $implicit: currentItem}">
+                        </ng-template>
+                    </ng-container>
+                </div>
 
                 <div class="k-filter-toolbar-item">
                     <button
@@ -742,7 +766,7 @@ FilterExpressionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.
                 </div>
             </div>
         </div>
-  `, isInline: true, components: [{ type: i2.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["iconClass", "loading", "data", "value", "textField", "valueField", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }, { type: FilterExpressionOperatorsComponent, selector: "kendo-filter-expression-operators", inputs: ["currentItem", "editorType", "operators"], outputs: ["valueChange"] }, { type: FilterTextEditorComponent, selector: "kendo-filter-text-editor", inputs: ["currentItem", "isDisabled"], outputs: ["valueChange"] }, { type: FilterNumericEditorComponent, selector: "kendo-filter-numeric-editor", inputs: ["currentItem", "isDisabled"], outputs: ["valueChange"] }, { type: FilterBooleanEditorComponent, selector: "kendo-filter-boolean-editor", inputs: ["currentItem"], outputs: ["valueChange"] }, { type: FilterDateEditorComponent, selector: "kendo-filter-date-editor", inputs: ["currentItem", "isDisabled"], outputs: ["valueChange"] }], directives: [{ type: AriaLabelValueDirective, selector: "[kendoAriaLabelValue]", inputs: ["kendoAriaLabelValue"] }, { type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i10.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i10.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i11.ButtonDirective, selector: "button[kendoButton], span[kendoButton]", inputs: ["toggleable", "togglable", "selected", "tabIndex", "icon", "iconClass", "imageUrl", "disabled", "size", "rounded", "fillMode", "themeColor", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }] });
+  `, isInline: true, components: [{ type: i2.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["iconClass", "loading", "data", "value", "textField", "valueField", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }, { type: FilterExpressionOperatorsComponent, selector: "kendo-filter-expression-operators", inputs: ["currentItem", "editorType", "operators"], outputs: ["valueChange"] }, { type: FilterTextEditorComponent, selector: "kendo-filter-text-editor", inputs: ["currentItem", "isDisabled"], outputs: ["valueChange"] }, { type: FilterNumericEditorComponent, selector: "kendo-filter-numeric-editor", inputs: ["currentItem", "isDisabled"], outputs: ["valueChange"] }, { type: FilterBooleanEditorComponent, selector: "kendo-filter-boolean-editor", inputs: ["currentItem"], outputs: ["valueChange"] }, { type: FilterDateEditorComponent, selector: "kendo-filter-date-editor", inputs: ["currentItem", "isDisabled"], outputs: ["valueChange"] }], directives: [{ type: AriaLabelValueDirective, selector: "[kendoAriaLabelValue]", inputs: ["kendoAriaLabelValue"] }, { type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i10.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i10.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i11.TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }, { type: i11.ButtonDirective, selector: "button[kendoButton], span[kendoButton]", inputs: ["toggleable", "togglable", "selected", "tabIndex", "icon", "iconClass", "imageUrl", "disabled", "size", "rounded", "fillMode", "themeColor", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: FilterExpressionComponent, decorators: [{
             type: Component,
             args: [{
@@ -771,12 +795,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                     </kendo-filter-expression-operators>
                 </div>
 
-                <ng-container [ngSwitch]="getEditorType()">
-                    <kendo-filter-text-editor *ngSwitchCase="'string'" [currentItem]="currentItem" [isDisabled]="isEditorDisabled" (valueChange)="valueChange.emit()"></kendo-filter-text-editor>
-                    <kendo-filter-numeric-editor *ngSwitchCase="'number'" [currentItem]="currentItem" [isDisabled]="isEditorDisabled" (valueChange)="valueChange.emit()"></kendo-filter-numeric-editor>
-                    <kendo-filter-boolean-editor *ngSwitchCase="'boolean'" [currentItem]="currentItem" (valueChange)="valueChange.emit()"></kendo-filter-boolean-editor>
-                    <kendo-filter-date-editor *ngSwitchCase="'date'" [currentItem]="currentItem" [isDisabled]="isEditorDisabled" (valueChange)="valueChange.emit()"></kendo-filter-date-editor>
-                </ng-container>
+                <div class="k-filter-toolbar-item k-filter-value">
+                    <ng-container *ngIf="!editorTemplate" [ngSwitch]="getEditorType()">
+                        <kendo-filter-text-editor *ngSwitchCase="'string'" [currentItem]="currentItem" [isDisabled]="isEditorDisabled" (valueChange)="valueChange.emit()"></kendo-filter-text-editor>
+                        <kendo-filter-numeric-editor *ngSwitchCase="'number'" [currentItem]="currentItem" [isDisabled]="isEditorDisabled" (valueChange)="valueChange.emit()"></kendo-filter-numeric-editor>
+                        <kendo-filter-boolean-editor *ngSwitchCase="'boolean'" [currentItem]="currentItem" (valueChange)="valueChange.emit()"></kendo-filter-boolean-editor>
+                        <kendo-filter-date-editor *ngSwitchCase="'date'" [currentItem]="currentItem" [isDisabled]="isEditorDisabled" (valueChange)="valueChange.emit()"></kendo-filter-date-editor>
+                    </ng-container>
+                    <ng-container *ngIf="editorTemplate">
+                        <ng-template
+                            [templateContext]="{templateRef: editorTemplate, $implicit: currentItem}">
+                        </ng-template>
+                    </ng-container>
+                </div>
 
                 <div class="k-filter-toolbar-item">
                     <button
@@ -1199,7 +1230,10 @@ class FilterComponent {
     }
     ngAfterViewChecked() {
         if (this.filterFields && this.filterFields.length > 0) {
-            this.filters = this.filterFields.map((filterField) => filterField);
+            this.filters = this.filterFields.map((filterField) => {
+                var _a;
+                return (Object.assign(Object.assign({}, filterField), { editorTemplate: (_a = filterField.editorTemplate) === null || _a === void 0 ? void 0 : _a.templateRef }));
+            });
         }
         if (this.filters.length === 0) {
             throw new Error(`Pass at least one user-defined filter through the [filters] input property or nest kendo-filter-field components. See http://www.telerik.com/kendo-angular-ui/components/filter/#data-binding`);
@@ -1230,6 +1264,9 @@ class FilterComponent {
         if (isDevMode() && foundFilter.editor === 'boolean' && (!filterDescriptor.value && filterDescriptor.value !== false)) {
             console.warn(`Provide a value for the boolean '${filterDescriptor.field}' user-defined filter as the operator is always set to 'eq'.`);
         }
+        if (isDevMode() && foundFilter.editor === 'boolean' && filterDescriptor.operator !== 'eq') {
+            console.warn(`The operator of the boolean '${filterDescriptor.field}' user-defined filter is always set to 'eq'.`);
+        }
         if (filterDescriptor.operator && foundFilter.operators && !foundFilter.operators.some(operator => operator === filterDescriptor.operator)) {
             throw new Error(`The user-defined filter with field '${filterDescriptor.field}' is missing the '${filterDescriptor.operator}' operator.`);
         }
@@ -1669,7 +1706,8 @@ FilterModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "
         LocalizedMessagesDirective,
         CustomMessagesComponent,
         AriaLabelValueDirective,
-        FilterFieldComponent], imports: [SharedModule], exports: [FilterComponent,
+        FilterFieldComponent,
+        FilterValueEditorTemplateDirective], imports: [SharedModule], exports: [FilterComponent,
         FilterNumericEditorComponent,
         FilterTextEditorComponent,
         FilterExpressionComponent,
@@ -1680,7 +1718,8 @@ FilterModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "
         LocalizedMessagesDirective,
         CustomMessagesComponent,
         AriaLabelValueDirective,
-        FilterFieldComponent] });
+        FilterFieldComponent,
+        FilterValueEditorTemplateDirective] });
 FilterModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: FilterModule, imports: [[SharedModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: FilterModule, decorators: [{
             type: NgModule,
@@ -1697,7 +1736,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                         LocalizedMessagesDirective,
                         CustomMessagesComponent,
                         AriaLabelValueDirective,
-                        FilterFieldComponent
+                        FilterFieldComponent,
+                        FilterValueEditorTemplateDirective
                     ],
                     exports: [FilterComponent,
                         FilterNumericEditorComponent,
@@ -1710,7 +1750,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                         LocalizedMessagesDirective,
                         CustomMessagesComponent,
                         AriaLabelValueDirective,
-                        FilterFieldComponent]
+                        FilterFieldComponent,
+                        FilterValueEditorTemplateDirective]
                 }]
         }] });
 
@@ -1718,5 +1759,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { AriaLabelValueDirective, CustomMessagesComponent, FilterBooleanEditorComponent, FilterComponent, FilterDateEditorComponent, FilterExpressionComponent, FilterExpressionOperatorsComponent, FilterFieldComponent, FilterGroupComponent, FilterModule, FilterNumericEditorComponent, FilterTextEditorComponent, LocalizedMessagesDirective };
+export { AriaLabelValueDirective, CustomMessagesComponent, FilterBooleanEditorComponent, FilterComponent, FilterDateEditorComponent, FilterExpressionComponent, FilterExpressionOperatorsComponent, FilterFieldComponent, FilterGroupComponent, FilterModule, FilterNumericEditorComponent, FilterTextEditorComponent, FilterValueEditorTemplateDirective, LocalizedMessagesDirective };
 

package/filter-expression.component.d.ts

@@ -2,7 +2,7 @@
 * Copyright © 2021 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
-import { ChangeDetectorRef, EventEmitter, OnDestroy, OnInit } from '@angular/core';
+import { ChangeDetectorRef, EventEmitter, OnDestroy, OnInit, TemplateRef } from '@angular/core';
 import { LocalizationService } from '@progress/kendo-angular-l10n';
 import { CompositeFilterDescriptor } from '@progress/kendo-data-query';
 import { FilterDescriptor } from '@progress/kendo-data-query';
@@ -25,6 +25,7 @@ export declare class FilterExpressionComponent implements OnInit, OnDestroy {
     isBoolean: boolean;
     editorType: FilterEditor;
     isEditorDisabled: boolean;
+    editorTemplate: TemplateRef<any>;
     private localizationSubscription;
     constructor(filterService: FilterService, localization: LocalizationService, cdr: ChangeDetectorRef);
     ngOnInit(): void;
@@ -44,6 +45,7 @@ export declare class FilterExpressionComponent implements OnInit, OnDestroy {
     removeFilterExpression(): void;
     private setOperators;
     onOperatorChange(value: string): void;
+    setEditorTemplate(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<FilterExpressionComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<FilterExpressionComponent, "kendo-filter-expression", never, { "index": "index"; "currentItem": "currentItem"; }, { "valueChange": "valueChange"; }, never, never>;
 }

package/filter-field.component.d.ts

@@ -3,6 +3,7 @@
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import { FilterEditor, FilterOperator } from './model/filter-expression';
+import { FilterValueEditorTemplateDirective } from './templates/value-editor.template';
 import * as i0 from "@angular/core";
 /**
  * Represents the [Kendo UI Filter Field component for Angular]({% slug api_filter_filterfieldcomponent %}).
@@ -72,7 +73,11 @@ export declare class FilterFieldComponent {
      *
      * The boolean operator is always set to `eq`
      */
-    operators?: FilterOperator[];
+    operators: FilterOperator[];
+    /**
+     * @hidden
+     */
+    editorTemplate: FilterValueEditorTemplateDirective;
     static ɵfac: i0.ɵɵFactoryDeclaration<FilterFieldComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<FilterFieldComponent, "kendo-filter-field", never, { "field": "field"; "title": "title"; "editor": "editor"; "operators": "operators"; }, {}, never, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<FilterFieldComponent, "kendo-filter-field", never, { "field": "field"; "title": "title"; "editor": "editor"; "operators": "operators"; }, {}, ["editorTemplate"], never>;
 }

package/filter.module.d.ts

@@ -15,7 +15,8 @@ import * as i9 from "./localization/localized-messages.directive";
 import * as i10 from "./localization/custom-messages.component";
 import * as i11 from "./aria-label.directive";
 import * as i12 from "./filter-field.component";
-import * as i13 from "./shared.module";
+import * as i13 from "./templates/value-editor.template";
+import * as i14 from "./shared.module";
 /**
  * Represents the [NgModule]({{ site.data.urls.angular['ngmoduleapi'] }})
  * definition for the Filter component.
@@ -49,6 +50,6 @@ import * as i13 from "./shared.module";
  */
 export declare class FilterModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<FilterModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<FilterModule, [typeof i1.FilterComponent, typeof i2.FilterNumericEditorComponent, typeof i3.FilterTextEditorComponent, typeof i4.FilterExpressionComponent, typeof i5.FilterGroupComponent, typeof i6.FilterExpressionOperatorsComponent, typeof i7.FilterBooleanEditorComponent, typeof i8.FilterDateEditorComponent, typeof i9.LocalizedMessagesDirective, typeof i10.CustomMessagesComponent, typeof i11.AriaLabelValueDirective, typeof i12.FilterFieldComponent], [typeof i13.SharedModule], [typeof i1.FilterComponent, typeof i2.FilterNumericEditorComponent, typeof i3.FilterTextEditorComponent, typeof i4.FilterExpressionComponent, typeof i5.FilterGroupComponent, typeof i6.FilterExpressionOperatorsComponent, typeof i7.FilterBooleanEditorComponent, typeof i8.FilterDateEditorComponent, typeof i9.LocalizedMessagesDirective, typeof i10.CustomMessagesComponent, typeof i11.AriaLabelValueDirective, typeof i12.FilterFieldComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<FilterModule, [typeof i1.FilterComponent, typeof i2.FilterNumericEditorComponent, typeof i3.FilterTextEditorComponent, typeof i4.FilterExpressionComponent, typeof i5.FilterGroupComponent, typeof i6.FilterExpressionOperatorsComponent, typeof i7.FilterBooleanEditorComponent, typeof i8.FilterDateEditorComponent, typeof i9.LocalizedMessagesDirective, typeof i10.CustomMessagesComponent, typeof i11.AriaLabelValueDirective, typeof i12.FilterFieldComponent, typeof i13.FilterValueEditorTemplateDirective], [typeof i14.SharedModule], [typeof i1.FilterComponent, typeof i2.FilterNumericEditorComponent, typeof i3.FilterTextEditorComponent, typeof i4.FilterExpressionComponent, typeof i5.FilterGroupComponent, typeof i6.FilterExpressionOperatorsComponent, typeof i7.FilterBooleanEditorComponent, typeof i8.FilterDateEditorComponent, typeof i9.LocalizedMessagesDirective, typeof i10.CustomMessagesComponent, typeof i11.AriaLabelValueDirective, typeof i12.FilterFieldComponent, typeof i13.FilterValueEditorTemplateDirective]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<FilterModule>;
 }

package/main.d.ts

@@ -16,3 +16,4 @@ export { FilterExpressionComponent } from './filter-expression.component';
 export { CustomMessagesComponent } from './localization/custom-messages.component';
 export { LocalizedMessagesDirective } from './localization/localized-messages.directive';
 export { FilterFieldComponent } from './filter-field.component';
+export { FilterValueEditorTemplateDirective } from './templates/value-editor.template';

package/model/filter-expression.d.ts

@@ -5,6 +5,7 @@
 /**
  * Represents the FilterOperator type.
  */
+import { TemplateRef } from '@angular/core';
 export declare type FilterOperator = 'eq' | 'neq' | 'gt' | 'gte' | 'lt' | 'lte' | 'isnull' | 'isnotnull' | 'contains' | 'doesnotcontain' | 'startswith' | 'endswidth' | 'isempty' | 'isnotempty';
 /**
  * Represents the FilterEditor type.
@@ -57,4 +58,8 @@ export interface FilterExpression {
      * The boolean operator is always set to `eq`
      */
     operators?: FilterOperator[];
+    /**
+     * Specifies a template for the expression value editor input.
+     */
+    editorTemplate?: TemplateRef<any>;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-angular-filter",
-  "version": "2.1.0-dev.202206081432",
+  "version": "2.1.0-dev.202206150812",
   "description": "Kendo UI Angular Filter",
   "license": "SEE LICENSE IN LICENSE.md",
   "author": "Progress",

package/templates/value-editor.template.d.ts

@@ -0,0 +1,12 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { TemplateRef } from '@angular/core';
+import * as i0 from "@angular/core";
+export declare class FilterValueEditorTemplateDirective {
+    templateRef: TemplateRef<any>;
+    constructor(templateRef: TemplateRef<any>);
+    static ɵfac: i0.ɵɵFactoryDeclaration<FilterValueEditorTemplateDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<FilterValueEditorTemplateDirective, "[kendoFilterValueEditorTemplate]", never, {}, {}, never>;
+}