@progress/kendo-angular-treelist 17.0.0-develop.4 → 17.0.0-develop.41

package/editing/remove-command.directive.d.ts

@@ -38,5 +38,5 @@ export declare class RemoveCommandDirective extends BaseCommandDirective {
     constructor(editService: EditService, element: ElementRef, renderer: Renderer2, localization: LocalizationService, ngZone: NgZone);
     protected onClick(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<RemoveCommandDirective, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<RemoveCommandDirective, "[kendoTreeListRemoveCommand]", never, { "cellContext": "kendoTreeListRemoveCommand"; }, {}, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<RemoveCommandDirective, "[kendoTreeListRemoveCommand]", never, { "cellContext": { "alias": "kendoTreeListRemoveCommand"; "required": false; }; }, {}, never, ["*"], true, never>;
 }

package/editing/save-command.directive.d.ts

@@ -38,5 +38,5 @@ export declare class SaveCommandDirective extends BaseCommandDirective {
     constructor(editService: EditService, element: ElementRef, renderer: Renderer2, localization: LocalizationService, ngZone: NgZone);
     protected onClick(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<SaveCommandDirective, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<SaveCommandDirective, "[kendoTreeListSaveCommand]", never, { "cellContext": "kendoTreeListSaveCommand"; }, {}, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SaveCommandDirective, "[kendoTreeListSaveCommand]", never, { "cellContext": { "alias": "kendoTreeListSaveCommand"; "required": false; }; }, {}, never, ["*"], true, never>;
 }

package/editing-directives/create-form-group-args.interface.d.ts

@@ -6,4 +6,4 @@ import { EditEvent } from "../editing/edit-event-args.interface";
 /**
  * The argument that is passed to the `createFormGroup` function.
  */
-export declare type CreateFormGroupArgs = EditEvent;
+export type CreateFormGroupArgs = EditEvent;

package/editing-directives/editing-directive-base.d.ts

@@ -55,5 +55,5 @@ export declare abstract class EditingDirectiveBase implements OnInit, OnDestroy
     protected clean(): void;
     protected onStateChange(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<EditingDirectiveBase, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<EditingDirectiveBase, never, never, { "editService": "editService"; "newItemId": "newItemId"; "removeConfirmation": "removeConfirmation"; }, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<EditingDirectiveBase, never, never, { "editService": { "alias": "editService"; "required": false; }; "newItemId": { "alias": "newItemId"; "required": false; }; "removeConfirmation": { "alias": "removeConfirmation"; "required": false; }; }, {}, never, never, false, never>;
 }

package/editing-directives/in-cell-editing.directive.d.ts

@@ -27,5 +27,5 @@ export declare class InCellEditingDirective extends EditingDirectiveBase {
     protected cellClickHandler(args: any): void;
     protected cellCloseHandler(args: any): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<InCellEditingDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<InCellEditingDirective, "[kendoTreeListInCellEditing]", ["kendoTreeListInCellEditing"], { "createFormGroup": "kendoTreeListInCellEditing"; }, {}, never, never, true, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<InCellEditingDirective, "[kendoTreeListInCellEditing]", ["kendoTreeListInCellEditing"], { "createFormGroup": { "alias": "kendoTreeListInCellEditing"; "required": false; }; }, {}, never, never, true, never>;
 }

package/editing-directives/reactive-editing.directive.d.ts

@@ -20,5 +20,5 @@ export declare class ReactiveEditingDirective extends RowEditingDirectiveBase {
     protected createModel(args: any): any;
     protected saveModel({ dataItem, formGroup, isNew }: any): any;
     static ɵfac: i0.ɵɵFactoryDeclaration<ReactiveEditingDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<ReactiveEditingDirective, "[kendoTreeListReactiveEditing]", ["kendoTreeListReactiveEditing"], { "createFormGroup": "kendoTreeListReactiveEditing"; }, {}, never, never, true, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<ReactiveEditingDirective, "[kendoTreeListReactiveEditing]", ["kendoTreeListReactiveEditing"], { "createFormGroup": { "alias": "kendoTreeListReactiveEditing"; "required": false; }; }, {}, never, never, true, never>;
 }

package/editing-directives/row-editing-directive-base.d.ts

@@ -8,7 +8,6 @@ import * as i0 from "@angular/core";
  * @hidden
  */
 export declare abstract class RowEditingDirectiveBase extends EditingDirectiveBase {
-    protected dataItem: any;
     /**
      * @hidden
      */

package/editing-directives/template-editing.directive.d.ts

@@ -15,7 +15,6 @@ export declare class TemplateEditingDirective extends RowEditingDirectiveBase {
      * The function that creates the `dataItem` for the new rows.
      */
     createNewItem: Function;
-    protected dataItem: any;
     protected originalValues: any;
     constructor(treelist: TreeListComponent);
     protected editHandler(args: any): void;
@@ -23,5 +22,5 @@ export declare class TemplateEditingDirective extends RowEditingDirectiveBase {
     protected createModel(args: any): any;
     protected saveModel(args: any): any;
     static ɵfac: i0.ɵɵFactoryDeclaration<TemplateEditingDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<TemplateEditingDirective, "[kendoTreeListTemplateEditing]", ["kendoTreeListTemplateEditing"], { "createNewItem": "kendoTreeListTemplateEditing"; }, {}, never, never, true, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<TemplateEditingDirective, "[kendoTreeListTemplateEditing]", ["kendoTreeListTemplateEditing"], { "createNewItem": { "alias": "kendoTreeListTemplateEditing"; "required": false; }; }, {}, never, never, true, never>;
 }

package/{esm2020 → esm2022}/binding-directives/base-binding.directive.mjs

@@ -13,16 +13,8 @@ import * as i0 from "@angular/core";
 import * as i1 from "./data-bound-tree-component";
 import * as i2 from "./../row-reordering/row-reorder.service";
 export class BaseBindingDirective {
-    constructor(component, rowReorderService) {
-        this.component = component;
-        this.rowReorderService = rowReorderService;
-        this.state = {};
-        this.cache = new Map();
-        this.originalData = [];
-        this.subscriptions = new Subscription();
-        this.component.fetchChildren = this.fetchChildren.bind(this);
-        this.component.hasChildren = this.hasChildren.bind(this);
-    }
+    component;
+    rowReorderService;
     /**
      * Defines the descriptors by which the data will be sorted.
      */
@@ -41,6 +33,18 @@ export class BaseBindingDirective {
     set aggregate(value) {
         this._aggregate = value;
     }
+    state = {};
+    dataChanged;
+    cache = new Map();
+    originalData = [];
+    _aggregate;
+    subscriptions = new Subscription();
+    constructor(component, rowReorderService) {
+        this.component = component;
+        this.rowReorderService = rowReorderService;
+        this.component.fetchChildren = this.fetchChildren.bind(this);
+        this.component.hasChildren = this.hasChildren.bind(this);
+    }
     /**
      * @hidden
      */
@@ -158,10 +162,10 @@ export class BaseBindingDirective {
         this.originalData = value || [];
         this.dataChanged = true;
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: BaseBindingDirective, deps: [{ token: i1.DataBoundTreeComponent }, { token: i2.RowReorderService }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: BaseBindingDirective, inputs: { sort: "sort", filter: "filter", aggregate: "aggregate" }, usesOnChanges: true, ngImport: i0 });
 }
-BaseBindingDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: BaseBindingDirective, deps: [{ token: i1.DataBoundTreeComponent }, { token: i2.RowReorderService }], target: i0.ɵɵFactoryTarget.Directive });
-BaseBindingDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: BaseBindingDirective, inputs: { sort: "sort", filter: "filter", aggregate: "aggregate" }, usesOnChanges: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: BaseBindingDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: BaseBindingDirective, decorators: [{
             type: Directive,
             args: [{}]
         }], ctorParameters: function () { return [{ type: i1.DataBoundTreeComponent }, { type: i2.RowReorderService }]; }, propDecorators: { sort: [{

package/{esm2020 → esm2022}/binding-directives/data-bound-tree-component.mjs

@@ -10,9 +10,9 @@ import * as i0 from "@angular/core";
  * An injection token used by the data binding directives to interface with the TreeList or the Gantt.
  */
 export class DataBoundTreeComponent {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DataBoundTreeComponent, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DataBoundTreeComponent });
 }
-DataBoundTreeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DataBoundTreeComponent, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-DataBoundTreeComponent.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DataBoundTreeComponent });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DataBoundTreeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DataBoundTreeComponent, decorators: [{
             type: Injectable
         }] });

package/{esm2020 → esm2022}/binding-directives/flat-binding.directive.mjs

@@ -23,19 +23,8 @@ const ROOT_ID = null;
  * and [filtering]({% slug filtering_treelist %}) ([more information and examples]({% slug databinding_treelist %})).
  */
 export class FlatBindingDirective extends BaseBindingDirective {
-    constructor(component, rowReorderService) {
-        super(component);
-        this.component = component;
-        this.rowReorderService = rowReorderService;
-        this.idGetter = getter('id');
-        this.idSetter = setter('id');
-        this.parentIdGetter = getter('parentId');
-        this.parentIdSetter = setter('parentId');
-        component.localEditService = new FlatEditService(this);
-        if (this.rowReorderService) {
-            this.rowReorderService.bindingDirective = this;
-        }
-    }
+    component;
+    rowReorderService;
     /**
      * The name of the field which contains the identifier of the parent node.
      */
@@ -58,6 +47,25 @@ export class FlatBindingDirective extends BaseBindingDirective {
     get idField() {
         return this._idField;
     }
+    /**
+     * The array of data which will be used to populate the TreeList.
+     */
+    data;
+    idGetter = getter('id');
+    idSetter = setter('id');
+    parentIdGetter = getter('parentId');
+    parentIdSetter = setter('parentId');
+    constructor(component, rowReorderService) {
+        super(component);
+        this.component = component;
+        this.rowReorderService = rowReorderService;
+        component.localEditService = new FlatEditService(this);
+        if (this.rowReorderService) {
+            this.rowReorderService.bindingDirective = this;
+        }
+    }
+    _parentIdField;
+    _idField;
     /**
      * @hidden
      */
@@ -90,15 +98,15 @@ export class FlatBindingDirective extends BaseBindingDirective {
         }
         this.rebind();
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FlatBindingDirective, deps: [{ token: i1.DataBoundTreeComponent }, { token: i2.RowReorderService, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: FlatBindingDirective, isStandalone: true, selector: "[kendoTreeListFlatBinding]", inputs: { parentIdField: "parentIdField", idField: "idField", data: ["kendoTreeListFlatBinding", "data"] }, providers: [
+            {
+                provide: RowReorderService,
+                useClass: FlatRowReorderService
+            }
+        ], exportAs: ["kendoTreeListFlatBinding"], usesInheritance: true, ngImport: i0 });
 }
-FlatBindingDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: FlatBindingDirective, deps: [{ token: i1.DataBoundTreeComponent }, { token: i2.RowReorderService, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
-FlatBindingDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: FlatBindingDirective, isStandalone: true, selector: "[kendoTreeListFlatBinding]", inputs: { parentIdField: "parentIdField", idField: "idField", data: ["kendoTreeListFlatBinding", "data"] }, providers: [
-        {
-            provide: RowReorderService,
-            useClass: FlatRowReorderService
-        }
-    ], exportAs: ["kendoTreeListFlatBinding"], usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: FlatBindingDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FlatBindingDirective, decorators: [{
             type: Directive,
             args: [{
                     exportAs: 'kendoTreeListFlatBinding',

package/{esm2020 → esm2022}/binding-directives/hierarchy-binding.directive.mjs

@@ -20,17 +20,8 @@ import * as i2 from "../row-reordering/row-reorder.service";
  * and [filtering]({% slug filtering_treelist %}) ([more information and examples](slug:local_databinding_treelist#toc-binding-to-hierarchical-data-1)).
  */
 export class HierarchyBindingDirective extends BaseBindingDirective {
-    constructor(component, rowReorderService) {
-        super(component);
-        this.component = component;
-        this.rowReorderService = rowReorderService;
-        this.childrenGetter = getter('items');
-        this.childrenSetter = setter('items');
-        component.localEditService = new HierarchyEditService(this);
-        if (this.rowReorderService) {
-            this.rowReorderService.bindingDirective = this;
-        }
-    }
+    component;
+    rowReorderService;
     /**
      *  The name of the field which holds the child data items of the node.
      */
@@ -42,6 +33,22 @@ export class HierarchyBindingDirective extends BaseBindingDirective {
     get childrenField() {
         return this._childrenField;
     }
+    /**
+     * The array of data which will be used to populate the TreeList.
+     */
+    data;
+    childrenGetter = getter('items');
+    childrenSetter = setter('items');
+    constructor(component, rowReorderService) {
+        super(component);
+        this.component = component;
+        this.rowReorderService = rowReorderService;
+        component.localEditService = new HierarchyEditService(this);
+        if (this.rowReorderService) {
+            this.rowReorderService.bindingDirective = this;
+        }
+    }
+    _childrenField;
     /**
      * @hidden
      */
@@ -64,15 +71,15 @@ export class HierarchyBindingDirective extends BaseBindingDirective {
         this.rowReorderService.reorderRows(ev, this.originalData, this.childrenField);
         this.rebind();
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: HierarchyBindingDirective, deps: [{ token: i1.DataBoundTreeComponent }, { token: i2.RowReorderService, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: HierarchyBindingDirective, isStandalone: true, selector: "[kendoTreeListHierarchyBinding]", inputs: { childrenField: "childrenField", data: ["kendoTreeListHierarchyBinding", "data"] }, providers: [
+            {
+                provide: RowReorderService,
+                useClass: HierarchicalRowReorderService
+            }
+        ], exportAs: ["kendoTreeListHierarchyBinding"], usesInheritance: true, ngImport: i0 });
 }
-HierarchyBindingDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: HierarchyBindingDirective, deps: [{ token: i1.DataBoundTreeComponent }, { token: i2.RowReorderService, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
-HierarchyBindingDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: HierarchyBindingDirective, isStandalone: true, selector: "[kendoTreeListHierarchyBinding]", inputs: { childrenField: "childrenField", data: ["kendoTreeListHierarchyBinding", "data"] }, providers: [
-        {
-            provide: RowReorderService,
-            useClass: HierarchicalRowReorderService
-        }
-    ], exportAs: ["kendoTreeListHierarchyBinding"], usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: HierarchyBindingDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: HierarchyBindingDirective, decorators: [{
             type: Directive,
             args: [{
                     exportAs: 'kendoTreeListHierarchyBinding',

package/{esm2020 → esm2022}/column-menu/column-chooser.component.mjs

@@ -29,6 +29,28 @@ import * as i3 from "@progress/kendo-angular-popup";
  * ```
  */
 export class ColumnChooserComponent {
+    localization;
+    columnInfoService;
+    popupService;
+    ngZone;
+    renderer;
+    changeDetector;
+    /**
+     * Specifies if the changes in the visibility of the column will be immediately applied.
+     * @default false
+     */
+    autoSync = false;
+    /**
+     * Specifies if all columns can be hidden.
+     * @default true
+     */
+    allowHideAll = true;
+    get columns() {
+        return this.columnInfoService.leafNamedColumns;
+    }
+    columnsIcon = columnsIcon;
+    popupRef;
+    closeClick;
     constructor(localization, columnInfoService, popupService, ngZone, renderer, changeDetector) {
         this.localization = localization;
         this.columnInfoService = columnInfoService;
@@ -36,20 +58,6 @@ export class ColumnChooserComponent {
         this.ngZone = ngZone;
         this.renderer = renderer;
         this.changeDetector = changeDetector;
-        /**
-         * Specifies if the changes in the visibility of the column will be immediately applied.
-         * @default false
-         */
-        this.autoSync = false;
-        /**
-         * Specifies if all columns can be hidden.
-         * @default true
-         */
-        this.allowHideAll = true;
-        this.columnsIcon = columnsIcon;
-    }
-    get columns() {
-        return this.columnInfoService.leafNamedColumns;
     }
     ngOnDestroy() {
         this.close();
@@ -112,9 +120,8 @@ export class ColumnChooserComponent {
             this.closeClick = null;
         }
     }
-}
-ColumnChooserComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ColumnChooserComponent, deps: [{ token: i1.LocalizationService }, { token: i2.ColumnInfoService }, { token: i3.PopupService }, { token: i0.NgZone }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-ColumnChooserComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: ColumnChooserComponent, isStandalone: true, selector: "kendo-treelist-column-chooser", inputs: { autoSync: "autoSync", allowHideAll: "allowHideAll" }, ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColumnChooserComponent, deps: [{ token: i1.LocalizationService }, { token: i2.ColumnInfoService }, { token: i3.PopupService }, { token: i0.NgZone }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ColumnChooserComponent, isStandalone: true, selector: "kendo-treelist-column-chooser", inputs: { autoSync: "autoSync", allowHideAll: "allowHideAll" }, ngImport: i0, template: `
         <button #anchor
             kendoButton
             type="button"
@@ -135,8 +142,9 @@ ColumnChooserComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0",
                 (columnChange)="onChange($event)">
             </kendo-treelist-columnlist>
         </ng-template>
-    `, isInline: true, dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[kendoButton], span[kendoButton], kendo-button", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "component", type: ColumnListComponent, selector: "kendo-treelist-columnlist", inputs: ["columns", "autoSync", "allowHideAll", "applyText", "resetText", "actionsClass"], outputs: ["reset", "apply", "columnChange"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ColumnChooserComponent, decorators: [{
+    `, isInline: true, dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "component", type: ColumnListComponent, selector: "kendo-treelist-columnlist", inputs: ["columns", "autoSync", "allowHideAll", "applyText", "resetText", "actionsClass"], outputs: ["reset", "apply", "columnChange"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColumnChooserComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kendo-treelist-column-chooser',

package/{esm2020 → esm2022}/column-menu/column-list.component.mjs

@@ -2,29 +2,24 @@
 * Copyright © 2024 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
-import { Component, HostBinding, Input, ElementRef, NgZone, Renderer2, Output, EventEmitter } from '@angular/core';
-import { hasClasses } from '../rendering/common/dom-queries';
+import { Component, HostBinding, Input, ElementRef, NgZone, Renderer2, Output, EventEmitter, QueryList, ViewChildren } from '@angular/core';
 import { NgFor, NgIf, NgClass } from '@angular/common';
+import { CheckBoxComponent } from '@progress/kendo-angular-inputs';
+import { take } from 'rxjs/operators';
 import * as i0 from "@angular/core";
 /**
  * @hidden
  */
 export class ColumnListComponent {
-    constructor(element, ngZone, renderer) {
-        this.element = element;
-        this.ngZone = ngZone;
-        this.renderer = renderer;
-        this.reset = new EventEmitter();
-        this.apply = new EventEmitter();
-        this.columnChange = new EventEmitter();
-        this.autoSync = true;
-        this.allowHideAll = false;
-        this.actionsClass = 'k-actions';
-        this.unlockedCount = 0;
-    }
+    element;
+    ngZone;
+    renderer;
     get className() {
         return true;
     }
+    reset = new EventEmitter();
+    apply = new EventEmitter();
+    columnChange = new EventEmitter();
     set columns(value) {
         this._columns = value.filter(column => column.includeInChooser !== false);
         this.allColumns = value;
@@ -33,6 +28,25 @@ export class ColumnListComponent {
     get columns() {
         return this._columns;
     }
+    autoSync = true;
+    allowHideAll = false;
+    applyText;
+    resetText;
+    actionsClass = 'k-actions';
+    checkboxes;
+    hasLocked;
+    hasVisibleLocked;
+    unlockedCount = 0;
+    hasUnlockedFiltered;
+    hasFiltered;
+    _columns;
+    allColumns;
+    domSubscriptions;
+    constructor(element, ngZone, renderer) {
+        this.element = element;
+        this.ngZone = ngZone;
+        this.renderer = renderer;
+    }
     isDisabled(column) {
         return !(this.allowHideAll || this.hasFiltered || column.hidden || this.columns.find(current => current !== column && !current.hidden)) ||
             (this.hasVisibleLocked && !this.hasUnlockedFiltered && this.unlockedCount === 1 && !column.locked && !column.hidden);
@@ -43,22 +57,26 @@ export class ColumnListComponent {
         }
         this.ngZone.runOutsideAngular(() => {
             this.domSubscriptions = this.renderer.listen(this.element.nativeElement, 'click', (e) => {
-                if (hasClasses(e.target, 'k-checkbox')) {
-                    if (this.autoSync) {
-                        const index = parseInt(e.target.getAttribute('data-index'), 10);
-                        const column = this.columns[index];
-                        const hidden = !e.target.checked;
-                        if (Boolean(column.hidden) !== hidden) {
-                            this.ngZone.run(() => {
-                                column.hidden = hidden;
-                                this.columnChange.emit([column]);
-                            });
+                this.ngZone.onStable.pipe(take(1)).subscribe(() => {
+                    const closestItem = e.target.closest('.k-checkbox-wrap');
+                    if (closestItem) {
+                        if (this.autoSync) {
+                            const checkbox = this.checkboxes.find(checkBox => checkBox.hostElement.nativeElement === closestItem);
+                            const index = parseInt(closestItem.firstElementChild.getAttribute('data-index'), 10);
+                            const column = this.columns[index];
+                            const hidden = !checkbox.checkedState;
+                            if (Boolean(column.hidden) !== hidden) {
+                                this.ngZone.run(() => {
+                                    column.hidden = hidden;
+                                    this.columnChange.emit([column]);
+                                });
+                            }
+                        }
+                        else {
+                            this.ngZone.run(() => this.updateDisabled());
                         }
                     }
-                    else {
-                        this.updateDisabled();
-                    }
-                }
+                });
             });
         });
     }
@@ -68,17 +86,17 @@ export class ColumnListComponent {
         }
     }
     cancelChanges() {
-        this.forEachCheckBox((element, index) => {
-            element.checked = !this.columns[index].hidden;
+        this.checkboxes.forEach((item, index) => {
+            item.checkedState = !this.columns[index].hidden;
         });
         this.updateDisabled();
         this.reset.emit();
     }
     applyChanges() {
         const changed = [];
-        this.forEachCheckBox((element, index) => {
+        this.checkboxes.forEach((item, index) => {
             const column = this.columns[index];
-            const hidden = !element.checked;
+            const hidden = !item.checkedState;
             if (Boolean(column.hidden) !== hidden) {
                 column.hidden = hidden;
                 changed.push(column);
@@ -87,20 +105,13 @@ export class ColumnListComponent {
         this.updateDisabled();
         this.apply.emit(changed);
     }
-    forEachCheckBox(callback) {
-        const checkboxes = this.element.nativeElement.getElementsByClassName('k-checkbox');
-        const length = checkboxes.length;
-        for (let idx = 0; idx < length; idx++) {
-            callback(checkboxes[idx], idx);
-        }
-    }
     updateDisabled() {
         if (this.allowHideAll && !this.hasLocked) {
             return;
         }
         const checkedItems = [];
-        this.forEachCheckBox((checkbox, index) => {
-            if (checkbox.checked) {
+        this.checkboxes.forEach((checkbox, index) => {
+            if (checkbox.checkedState) {
                 checkedItems.push({ checkbox, index });
             }
             checkbox.disabled = false;
@@ -130,17 +141,15 @@ export class ColumnListComponent {
             this.hasUnlockedFiltered = false;
         }
     }
-}
-ColumnListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ColumnListComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
-ColumnListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: ColumnListComponent, isStandalone: true, selector: "kendo-treelist-columnlist", inputs: { columns: "columns", autoSync: "autoSync", allowHideAll: "allowHideAll", applyText: "applyText", resetText: "resetText", actionsClass: "actionsClass" }, outputs: { reset: "reset", apply: "apply", columnChange: "columnChange" }, host: { properties: { "class.k-column-list-wrapper": "this.className" } }, ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColumnListComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ColumnListComponent, isStandalone: true, selector: "kendo-treelist-columnlist", inputs: { columns: "columns", autoSync: "autoSync", allowHideAll: "allowHideAll", applyText: "applyText", resetText: "resetText", actionsClass: "actionsClass" }, outputs: { reset: "reset", apply: "apply", columnChange: "columnChange" }, host: { properties: { "class.k-column-list-wrapper": "this.className" } }, viewQueries: [{ propertyName: "checkboxes", predicate: CheckBoxComponent, descendants: true }], ngImport: i0, template: `
         <div class="k-column-list">
             <label *ngFor="let column of columns; let index = index;" class='k-column-list-item'>
-                <input
-                    class="k-checkbox k-checkbox-md k-rounded-md"
-                    type="checkbox"
-                    [attr.data-index]="index"
-                    [checked]="!column.hidden"
-                    [disabled]="isDisabled(column)" />
+                <kendo-checkbox
+                    [inputAttributes]="{'data-index': index.toString()}"
+                    [checkedState]="!column.hidden"
+                    [disabled]="isDisabled(column)"
+                ></kendo-checkbox>
                 <span class="k-checkbox-label">{{ column.displayTitle }}</span>
             </label>
         </div>
@@ -158,20 +167,20 @@ ColumnListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", ve
                 {{ applyText }}
             </button>
         </div>
-    `, isInline: true, dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ColumnListComponent, decorators: [{
+    `, isInline: true, dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: CheckBoxComponent, selector: "kendo-checkbox", inputs: ["checkedState", "rounded"], outputs: ["checkedStateChange"], exportAs: ["kendoCheckBox"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColumnListComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kendo-treelist-columnlist',
                     template: `
         <div class="k-column-list">
             <label *ngFor="let column of columns; let index = index;" class='k-column-list-item'>
-                <input
-                    class="k-checkbox k-checkbox-md k-rounded-md"
-                    type="checkbox"
-                    [attr.data-index]="index"
-                    [checked]="!column.hidden"
-                    [disabled]="isDisabled(column)" />
+                <kendo-checkbox
+                    [inputAttributes]="{'data-index': index.toString()}"
+                    [checkedState]="!column.hidden"
+                    [disabled]="isDisabled(column)"
+                ></kendo-checkbox>
                 <span class="k-checkbox-label">{{ column.displayTitle }}</span>
             </label>
         </div>
@@ -191,7 +200,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
         </div>
     `,
                     standalone: true,
-                    imports: [NgFor, NgIf, NgClass]
+                    imports: [NgFor, NgIf, NgClass, CheckBoxComponent]
                 }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.NgZone }, { type: i0.Renderer2 }]; }, propDecorators: { className: [{
                 type: HostBinding,
@@ -214,4 +223,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                 type: Input
             }], actionsClass: [{
                 type: Input
+            }], checkboxes: [{
+                type: ViewChildren,
+                args: [CheckBoxComponent]
             }] } });

package/{esm2020 → esm2022}/column-menu/column-locked-change-event.mjs

@@ -6,6 +6,10 @@
  * Arguments for the `columnLockedChange` event.
  */
 export class ColumnLockedChangeEvent {
+    /**
+     * The columns whose locked state is changed.
+     */
+    columns;
     /**
      * @hidden
      */