@progress/kendo-angular-filter 24.0.0-develop.3 → 24.0.0-develop.30

package/filter-expression.component.d.ts

@@ -2,7 +2,7 @@
 * Copyright © 2026 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
-import { ElementRef, OnInit, Renderer2, TemplateRef } from '@angular/core';
+import { DoCheck, ElementRef, OnInit, Renderer2, TemplateRef } from '@angular/core';
 import { LocalizationService } from '@progress/kendo-angular-l10n';
 import { CompositeFilterDescriptor, FilterDescriptor } from '@progress/kendo-data-query';
 import { SVGIcon } from '@progress/kendo-svg-icons';
@@ -14,7 +14,7 @@ import * as i0 from "@angular/core";
 /**
  * @hidden
  */
-export declare class FilterExpressionComponent extends BaseFilterRowComponent implements OnInit {
+export declare class FilterExpressionComponent extends BaseFilterRowComponent implements OnInit, DoCheck {
     private filterService;
     /**
      * @hidden
@@ -27,13 +27,18 @@ export declare class FilterExpressionComponent extends BaseFilterRowComponent im
     editorType: FilterEditor;
     isEditorDisabled: boolean;
     editorTemplate: TemplateRef<any>;
+    operatorTemplate: TemplateRef<any>;
     editorFormat: string | DateFormat | NumberFormat;
+    get availableFilters(): FilterExpression[];
+    private _previousField;
+    get fieldTemplate(): TemplateRef<any>;
     private get currentFilterExpression();
     get numericEditorFormat(): string | NumberFormat;
     get dateEditorFormat(): string | DateFormat;
     private isNumberFormat;
     private isDateFormat;
     constructor(filterService: FilterService, element: ElementRef, navigationService: NavigationService, localization: LocalizationService, renderer: Renderer2);
+    ngDoCheck(): void;
     ngOnInit(): void;
     normalizeOperators(filterEditor: FilterEditor, operators: FilterOperator[]): {
         text: string;
@@ -46,11 +51,10 @@ export declare class FilterExpressionComponent extends BaseFilterRowComponent im
         value: string;
     }[];
     getEditorType(): FilterEditor;
-    getFilters(): FilterExpression[];
     removeFilterExpression(): void;
     private setOperators;
     onOperatorChange(value: string): void;
-    setEditorTemplate(): void;
+    setTemplates(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<FilterExpressionComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<FilterExpressionComponent, "kendo-filter-expression", never, { "currentItem": { "alias": "currentItem"; "required": false; }; }, {}, never, never, true, never>;
 }

package/filter-field.component.d.ts

@@ -3,7 +3,8 @@
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import { DateFormat, FilterEditor, FilterOperator, NumberFormat } from './model/filter-expression';
-import { FilterValueEditorTemplateDirective } from './templates/value-editor.template';
+import { FilterValueEditorTemplateDirective } from './templates/value-editor-template.directive';
+import { FilterOperatorTemplateDirective } from './templates/operator-template.directive';
 import * as i0 from "@angular/core";
 /**
  * Represents the [Kendo UI Filter Field component for Angular](https://www.telerik.com/kendo-angular-ui/components/filter/api/filterfieldcomponent).
@@ -73,6 +74,10 @@ export declare class FilterFieldComponent {
      * @hidden
      */
     editorTemplate: FilterValueEditorTemplateDirective;
+    /**
+     * @hidden
+     */
+    operatorTemplate: FilterOperatorTemplateDirective;
     static ɵfac: i0.ɵɵFactoryDeclaration<FilterFieldComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<FilterFieldComponent, "kendo-filter-field", never, { "field": { "alias": "field"; "required": false; }; "title": { "alias": "title"; "required": false; }; "editor": { "alias": "editor"; "required": false; }; "operators": { "alias": "operators"; "required": false; }; "editorFormat": { "alias": "editorFormat"; "required": false; }; }, {}, ["editorTemplate"], never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<FilterFieldComponent, "kendo-filter-field", never, { "field": { "alias": "field"; "required": false; }; "title": { "alias": "title"; "required": false; }; "editor": { "alias": "editor"; "required": false; }; "operators": { "alias": "operators"; "required": false; }; "editorFormat": { "alias": "editorFormat"; "required": false; }; }, {}, ["editorTemplate", "operatorTemplate"], never, true, never>;
 }

package/filter.component.d.ts

@@ -2,7 +2,7 @@
 * Copyright © 2026 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
-import { OnInit, EventEmitter, ElementRef, Renderer2 } from '@angular/core';
+import { AfterContentInit, ElementRef, EventEmitter, OnInit, Renderer2 } from '@angular/core';
 import { LocalizationService } from '@progress/kendo-angular-l10n';
 import { FilterService } from './filter.service';
 import { CompositeFilterDescriptor } from '@progress/kendo-data-query';
@@ -48,7 +48,7 @@ import * as i0 from "@angular/core";
  * @remarks
  * Supported children components are: {@link CustomMessagesComponent}, {@link FilterFieldComponent}.
  */
-export declare class FilterComponent implements OnInit, OnDestroy {
+export declare class FilterComponent implements OnInit, AfterContentInit, OnDestroy {
     private filterService;
     private localization;
     private cdr;
@@ -87,11 +87,13 @@ export declare class FilterComponent implements OnInit, OnDestroy {
     private filterFieldsSubscription;
     private _value;
     private filterFields;
+    private fieldTemplate;
     private _filterItems;
     get filterItems(): FilterItem[];
     get toolbarElement(): HTMLElement;
     constructor(filterService: FilterService, localization: LocalizationService, cdr: ChangeDetectorRef, element: ElementRef, navigationService: NavigationService, renderer: Renderer2);
     ngOnInit(): void;
+    ngAfterContentInit(): void;
     ngAfterViewInit(): void;
     ngOnDestroy(): void;
     private filterFieldsChanged;
@@ -120,5 +122,5 @@ export declare class FilterComponent implements OnInit, OnDestroy {
      */
     private filtersTypeChanged;
     static ɵfac: i0.ɵɵFactoryDeclaration<FilterComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<FilterComponent, "kendo-filter", never, { "filters": { "alias": "filters"; "required": false; }; "value": { "alias": "value"; "required": false; }; }, { "valueChange": "valueChange"; }, ["filterFields"], never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<FilterComponent, "kendo-filter", never, { "filters": { "alias": "filters"; "required": false; }; "value": { "alias": "value"; "required": false; }; }, { "valueChange": "valueChange"; }, ["fieldTemplate", "filterFields"], never, true, never>;
 }

package/filter.module.d.ts

@@ -6,7 +6,9 @@ import * as i0 from "@angular/core";
 import * as i1 from "./filter.component";
 import * as i2 from "./filter-field.component";
 import * as i3 from "./localization/custom-messages.component";
-import * as i4 from "./templates/value-editor.template";
+import * as i4 from "./templates/value-editor-template.directive";
+import * as i5 from "./templates/operator-template.directive";
+import * as i6 from "./templates/field-template.directive";
 /**
  * Represents the [NgModule](link:site.data.urls.angular['ngmoduleapi'])
  * definition for the Filter component.
@@ -40,6 +42,6 @@ import * as i4 from "./templates/value-editor.template";
  */
 export declare class FilterModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<FilterModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<FilterModule, never, [typeof i1.FilterComponent, typeof i2.FilterFieldComponent, typeof i3.CustomMessagesComponent, typeof i4.FilterValueEditorTemplateDirective], [typeof i1.FilterComponent, typeof i2.FilterFieldComponent, typeof i3.CustomMessagesComponent, typeof i4.FilterValueEditorTemplateDirective]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<FilterModule, never, [typeof i1.FilterComponent, typeof i2.FilterFieldComponent, typeof i3.CustomMessagesComponent, typeof i4.FilterValueEditorTemplateDirective, typeof i5.FilterOperatorTemplateDirective, typeof i6.FilterFieldsTemplateDirective], [typeof i1.FilterComponent, typeof i2.FilterFieldComponent, typeof i3.CustomMessagesComponent, typeof i4.FilterValueEditorTemplateDirective, typeof i5.FilterOperatorTemplateDirective, typeof i6.FilterFieldsTemplateDirective]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<FilterModule>;
 }

package/filter.service.d.ts

@@ -2,6 +2,7 @@
 * Copyright © 2026 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 { CompositeFilterDescriptor, FilterDescriptor } from '@progress/kendo-data-query';
 import { FilterExpression } from './model/filter-expression';
 import * as i0 from "@angular/core";
@@ -11,6 +12,7 @@ import * as i0 from "@angular/core";
 export declare class FilterService {
     normalizedValue: CompositeFilterDescriptor;
     filters: FilterExpression[];
+    fieldTemplate: TemplateRef<any> | null;
     addFilterGroup(item: CompositeFilterDescriptor): void;
     addFilterExpression(item: CompositeFilterDescriptor): void;
     remove(item: CompositeFilterDescriptor | FilterDescriptor, positionIndex: number, parentItem?: CompositeFilterDescriptor): void;

package/index.d.ts

@@ -16,6 +16,8 @@ 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';
+export { FilterValueEditorTemplateDirective } from './templates/value-editor-template.directive';
+export { FilterOperatorTemplateDirective } from './templates/operator-template.directive';
+export { FilterFieldsTemplateDirective } from './templates/field-template.directive';
 export { FilterOperator, FilterEditor } from './model/filter-expression';
 export * from './directives';

package/model/filter-expression.d.ts

@@ -78,6 +78,12 @@ export interface FilterExpression {
      * Specifies a template for the expression value editor input.
      */
     editorTemplate?: TemplateRef<any>;
+    /**
+     * Specifies a custom template for the operator dropdown.
+     * When set, the default operator DropDownList is replaced with the provided template.
+     * The template receives the current [`FilterDescriptor`](slug:api_kendo-data-query_filterdescriptor) as implicit context.
+     */
+    operatorTemplate?: TemplateRef<any>;
     /**
      * Specifies the user-defined filter `editor` format that will be used.
      * See the [Filter editor formats documentation](https://www.telerik.com/kendo-angular-ui/components/filter/filter-editors-format).

package/package-metadata.mjs

@@ -7,7 +7,7 @@ export const packageMetadata = {
   "productCodes": [
     "KENDOUIANGULAR"
   ],
-  "publishDate": 1776940655,
-  "version": "24.0.0-develop.3",
+  "publishDate": 1778748863,
+  "version": "24.0.0-develop.30",
   "licensingDocsUrl": "https://www.telerik.com/kendo-angular-ui/my-license/"
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-angular-filter",
-  "version": "24.0.0-develop.3",
+  "version": "24.0.0-develop.30",
   "description": "Kendo UI Angular Filter",
   "license": "SEE LICENSE IN LICENSE.md",
   "author": "Progress",
@@ -17,7 +17,7 @@
     "package": {
       "productName": "Kendo UI for Angular",
       "productCode": "KENDOUIANGULAR",
-      "publishDate": 1776940655,
+      "publishDate": 1778748863,
       "licensingDocsUrl": "https://www.telerik.com/kendo-angular-ui/my-license/"
     }
   },
@@ -28,20 +28,20 @@
     "@angular/platform-browser": "19 - 21",
     "@progress/kendo-data-query": "^1.7.3",
     "@progress/kendo-licensing": "^1.11.0",
-    "@progress/kendo-angular-buttons": "24.0.0-develop.3",
-    "@progress/kendo-angular-common": "24.0.0-develop.3",
-    "@progress/kendo-angular-dateinputs": "24.0.0-develop.3",
-    "@progress/kendo-angular-dropdowns": "24.0.0-develop.3",
-    "@progress/kendo-angular-inputs": "24.0.0-develop.3",
-    "@progress/kendo-angular-intl": "24.0.0-develop.3",
-    "@progress/kendo-angular-l10n": "24.0.0-develop.3",
-    "@progress/kendo-angular-icons": "24.0.0-develop.3",
-    "@progress/kendo-angular-label": "24.0.0-develop.3",
+    "@progress/kendo-angular-buttons": "24.0.0-develop.30",
+    "@progress/kendo-angular-common": "24.0.0-develop.30",
+    "@progress/kendo-angular-dateinputs": "24.0.0-develop.30",
+    "@progress/kendo-angular-dropdowns": "24.0.0-develop.30",
+    "@progress/kendo-angular-inputs": "24.0.0-develop.30",
+    "@progress/kendo-angular-intl": "24.0.0-develop.30",
+    "@progress/kendo-angular-l10n": "24.0.0-develop.30",
+    "@progress/kendo-angular-icons": "24.0.0-develop.30",
+    "@progress/kendo-angular-label": "24.0.0-develop.30",
     "rxjs": "^6.5.3 || ^7.0.0"
   },
   "dependencies": {
     "tslib": "^2.3.1",
-    "@progress/kendo-angular-schematics": "24.0.0-develop.3"
+    "@progress/kendo-angular-schematics": "24.0.0-develop.30"
   },
   "schematics": "./schematics/collection.json",
   "module": "fesm2022/progress-kendo-angular-filter.mjs",

package/schematics/ngAdd/index.js

@@ -9,12 +9,12 @@ const schematics_1 = require("@angular-devkit/schematics");
 function default_1(options) {
     const finalOptions = Object.assign(Object.assign({}, options), { mainNgModule: 'FilterModule', package: 'filter', peerDependencies: {
             // peer deps of the dropdowns
-            '@progress/kendo-angular-treeview': '24.0.0-develop.3',
-            '@progress/kendo-angular-popup': '24.0.0-develop.3',
-            '@progress/kendo-angular-navigation': '24.0.0-develop.3',
+            '@progress/kendo-angular-treeview': '24.0.0-develop.30',
+            '@progress/kendo-angular-popup': '24.0.0-develop.30',
+            '@progress/kendo-angular-navigation': '24.0.0-develop.30',
             // peer dependency of kendo-angular-inputs
             '@progress/kendo-drawing': '^1.16.0',
-            '@progress/kendo-angular-dialog': '24.0.0-develop.3',
+            '@progress/kendo-angular-dialog': '24.0.0-develop.30',
             // Peer dependency of icons
             '@progress/kendo-svg-icons': '^4.0.0'
         } });

package/templates/field-template.directive.d.ts

@@ -0,0 +1,38 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2026 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";
+/**
+ * Replaces the default field selector DropDownList in the Filter component with a custom template.
+ * Apply it to an `ng-template` that is a direct child of a `kendo-filter` element.
+ *
+ * The template context provides the following fields:
+ *
+ * - `let-currentItem`—The [filter descriptor](slug:api_kendo-data-query_filterdescriptor) for the current row. Set its `field` property to change the selected field. The component detects the change and updates the value, operator list, and editor type automatically.
+ * - `let-filters="filters"`—The list of available [`FilterExpression`](slug:api_filter_filterexpression) items.
+ *
+ * @example
+ * ```html
+ * <kendo-filter>
+ *   <ng-template kendoFilterFieldsTemplate let-currentItem let-filters="filters">
+ *     <kendo-dropdownlist
+ *         [data]="filters"
+ *         textField="title"
+ *         valueField="field"
+ *         [valuePrimitive]="true"
+ *         [value]="currentItem.field"
+ *         (valueChange)="currentItem.field = $event">
+ *     </kendo-dropdownlist>
+ *   </ng-template>
+ *   <kendo-filter-field field="name" editor="string"></kendo-filter-field>
+ * </kendo-filter>
+ * ```
+ */
+export declare class FilterFieldsTemplateDirective {
+    templateRef: TemplateRef<any>;
+    constructor(templateRef: TemplateRef<any>);
+    static ɵfac: i0.ɵɵFactoryDeclaration<FilterFieldsTemplateDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<FilterFieldsTemplateDirective, "[kendoFilterFieldsTemplate]", never, {}, {}, never, never, true, never>;
+}

package/templates/operator-template.directive.d.ts

@@ -0,0 +1,38 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2026 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";
+/**
+ * Replaces the default operator DropDownList in the Filter component with a custom template.
+ * Apply it to an `ng-template` inside a `kendo-filter-field` element.
+ *
+ * The template context provides the following field:
+ *
+ * - `let-filter`—The [filter descriptor](slug:api_kendo-data-query_filterdescriptor) for the current row. Set its `operator` property when the user selects a new operator.
+ *
+ * @example
+ * ```html
+ * <kendo-filter>
+ *   <kendo-filter-field field="name" editor="string">
+ *     <ng-template kendoFilterOperatorTemplate let-filter>
+ *       <kendo-combobox
+ *           [data]="customOperators"
+ *           textField="text"
+ *           valueField="value"
+ *           [valuePrimitive]="true"
+ *           [value]="filter.operator"
+ *           (valueChange)="filter.operator = $event">
+ *       </kendo-combobox>
+ *     </ng-template>
+ *   </kendo-filter-field>
+ * </kendo-filter>
+ * ```
+ */
+export declare class FilterOperatorTemplateDirective {
+    templateRef: TemplateRef<any>;
+    constructor(templateRef: TemplateRef<any>);
+    static ɵfac: i0.ɵɵFactoryDeclaration<FilterOperatorTemplateDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<FilterOperatorTemplateDirective, "[kendoFilterOperatorTemplate]", never, {}, {}, never, never, true, never>;
+}