@progress/kendo-angular-treelist 17.0.0-develop.9 → 17.0.1-develop.1

package/{esm2020 → esm2022}/rendering/cell.component.mjs

@@ -8,7 +8,7 @@ import { NgSwitch, NgSwitchCase, NgIf, NgFor, NgTemplateOutlet, NgSwitchDefault
 import { caretAltDownIcon, caretAltLeftIcon, caretAltRightIcon, reorderIcon } from '@progress/kendo-svg-icons';
 import { LocalizationService } from "@progress/kendo-angular-l10n";
 import { DatePickerComponent } from '@progress/kendo-angular-dateinputs';
-import { NumericTextBoxComponent } from '@progress/kendo-angular-inputs';
+import { CheckBoxComponent, NumericTextBoxComponent, TextBoxComponent } from '@progress/kendo-angular-inputs';
 import { IconWrapperComponent } from '@progress/kendo-angular-icons';
 import { EditService } from '../editing/edit.service';
 import { isSpanColumn, isCheckboxColumn, isRowReorderColumn } from '../columns/column-base';
@@ -28,27 +28,9 @@ import * as i4 from "@angular/forms";
  * @hidden
  */
 export class CellComponent {
-    constructor(editService, localization, focusGroup) {
-        this.editService = editService;
-        this.localization = localization;
-        this.focusGroup = focusGroup;
-        this.isNew = false;
-        this.level = 0;
-        this.caretAltDownIcon = caretAltDownIcon;
-        this.caretAltRightIcon = caretAltRightIcon;
-        this.caretAltLeftIcon = caretAltLeftIcon;
-        this.reorderIcon = reorderIcon;
-        this.noneIcon = {
-            name: 'none',
-            content: '',
-            viewBox: '0 0 24 24'
-        };
-        this.cellContext = {};
-        this._templateContext = {};
-        this._editTemplateContext = {};
-        this.templateContext.cellContext = this.cellContext;
-        this.cellContext.focusGroup = focusGroup;
-    }
+    editService;
+    localization;
+    focusGroup;
     get commandCellClass() {
         return this.column.isCommand;
     }
@@ -64,6 +46,17 @@ export class CellComponent {
     get dragRowHandleLabel() {
         return isRowReorderColumn(this.column) ? this.localization.get('dragRowHandleLabel') : undefined;
     }
+    column;
+    columnIndex;
+    isNew = false;
+    level = 0;
+    hasChildren;
+    isExpanded;
+    loading;
+    expandIcons;
+    rowIndex;
+    selected;
+    dataItem;
     set viewItem(value) {
         this._viewItem = value;
         this.cellContext.viewItem = this.viewItem;
@@ -91,6 +84,7 @@ export class CellComponent {
         this._editTemplateContext.dataItem = this.dataItem;
         this._editTemplateContext.formGroup = this.formGroup;
         this._editTemplateContext.isNew = this.isNew;
+        this._editTemplateContext.rowIndex = this.isNew ? -1 : this.rowIndex;
         return this._editTemplateContext;
     }
     get format() {
@@ -108,6 +102,26 @@ export class CellComponent {
     get childColumns() {
         return columnsToRender([this.column]);
     }
+    caretAltDownIcon = caretAltDownIcon;
+    caretAltRightIcon = caretAltRightIcon;
+    caretAltLeftIcon = caretAltLeftIcon;
+    reorderIcon = reorderIcon;
+    noneIcon = {
+        name: 'none',
+        content: '',
+        viewBox: '0 0 24 24'
+    };
+    cellContext = {};
+    _templateContext = {};
+    _editTemplateContext = {};
+    _viewItem;
+    constructor(editService, localization, focusGroup) {
+        this.editService = editService;
+        this.localization = localization;
+        this.focusGroup = focusGroup;
+        this.templateContext.cellContext = this.cellContext;
+        this.cellContext.focusGroup = focusGroup;
+    }
     ngDoCheck() {
         this.updateTemplateContext();
     }
@@ -149,9 +163,8 @@ export class CellComponent {
     messageFor(token) {
         return this.localization.get(token);
     }
-}
-CellComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CellComponent, deps: [{ token: i1.EditService }, { token: i2.LocalizationService }, { token: i3.FocusGroup }], target: i0.ɵɵFactoryTarget.Component });
-CellComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CellComponent, isStandalone: true, selector: "[kendoTreeListCell]", inputs: { column: "column", columnIndex: "columnIndex", isNew: "isNew", level: "level", hasChildren: "hasChildren", isExpanded: "isExpanded", loading: "loading", expandIcons: "expandIcons", selected: "selected", dataItem: "dataItem", viewItem: "viewItem" }, host: { properties: { "class.k-command-cell": "this.commandCellClass", "class.k-checkbox-cell": "this.isCheckboxColumn", "class.k-text-nowrap": "this.textNoWrapClass", "class.k-drag-cell": "this.dragHandleCellClass", "class.k-touch-action-none": "this.dragHandleCellClass", "attr.aria-label": "this.dragRowHandleLabel" } }, ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CellComponent, deps: [{ token: i1.EditService }, { token: i2.LocalizationService }, { token: i3.FocusGroup }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CellComponent, isStandalone: true, selector: "[kendoTreeListCell]", inputs: { column: "column", columnIndex: "columnIndex", isNew: "isNew", level: "level", hasChildren: "hasChildren", isExpanded: "isExpanded", loading: "loading", expandIcons: "expandIcons", rowIndex: "rowIndex", selected: "selected", dataItem: "dataItem", viewItem: "viewItem" }, host: { properties: { "class.k-command-cell": "this.commandCellClass", "class.k-checkbox-cell": "this.isCheckboxColumn", "class.k-text-nowrap": "this.textNoWrapClass", "class.k-drag-cell": "this.dragHandleCellClass", "class.k-touch-action-none": "this.dragHandleCellClass", "attr.aria-label": "this.dragRowHandleLabel" } }, ngImport: i0, template: `
         <ng-container [ngSwitch]="isEdited">
             <ng-container *ngSwitchCase="false">
                 <ng-container *ngIf="column.expandable">
@@ -174,12 +187,11 @@ CellComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version:
                 </ng-container>
                 <ng-container *ngIf="isBoundColumn">{{ dataItem | valueOf: column.field: column.format}}</ng-container>
                 <ng-template [ngIf]="column.isCheckboxColumn && !isNew">
-                    <input
-                        type="checkbox"
+                    <kendo-checkbox
                         kendoTreeListFocusable
-                        [attr.aria-label]="messageFor('selectRowCheckboxLabel')"
-                        class="k-checkbox k-checkbox-md k-rounded-md"
-                        [checked]="selected" />
+                        [inputAttributes]="{'aria-label': messageFor('selectRowCheckboxLabel')}"
+                        [checkedState]="selected"
+                    ></kendo-checkbox>
                 </ng-template>
                 <ng-container *ngIf="column.isRowReorderColumn && !isNew">
                     <kendo-icon-wrapper
@@ -209,26 +221,23 @@ CellComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version:
                         kendoTreeListFocusable
                     ></kendo-datepicker>
 
-                    <input
+                    <kendo-checkbox
                         *ngSwitchCase="'boolean'"
-                        type="checkbox"
-                        class="k-checkbox k-checkbox-md k-rounded-md"
                         [formControl]="$any(formGroup.get(column.field))"
                         kendoTreeListFocusable
-                    />
+                    ></kendo-checkbox>
 
-                    <input
+                    <kendo-textbox
                         *ngSwitchDefault
-                        type="text"
-                        class="k-textbox k-input k-input-md k-input-solid k-rounded-md"
                         [formControl]="$any(formGroup.get(column.field))"
                         kendoTreeListFocusable
-                    />
+                    ></kendo-textbox>
                 </ng-container>
             </ng-container>
         </ng-container>
-    `, isInline: true, dependencies: [{ kind: "directive", type: NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: FocusableDirective, selector: "[kendoTreeListFocusable],\n        [kendoTreeListAddCommand],\n        [kendoTreeListEditCommand],\n        [kendoTreeListRemoveCommand],\n        [kendoTreeListSaveCommand],\n        [kendoTreeListCancelCommand]\n    ", inputs: ["kendoTreeListFocusable", "enabled", "kendoTreeListAddCommand", "kendoTreeListEditCommand", "kendoTreeListRemoveCommand", "kendoTreeListSaveCommand", "kendoTreeListCancelCommand"] }, { kind: "component", type: 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", "inputAttributes"], outputs: ["valueChange", "focus", "blur", "inputFocus", "inputBlur"], exportAs: ["kendoNumericTextBox"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: DatePickerComponent, selector: "kendo-datepicker", inputs: ["focusableId", "cellTemplate", "clearButton", "inputAttributes", "monthCellTemplate", "yearCellTemplate", "decadeCellTemplate", "centuryCellTemplate", "weekNumberTemplate", "headerTitleTemplate", "headerTemplate", "footerTemplate", "footer", "navigationItemTemplate", "weekDaysFormat", "showOtherMonthDays", "activeView", "bottomView", "topView", "calendarType", "animateCalendarNavigation", "disabled", "readonly", "readOnlyInput", "popupSettings", "navigation", "min", "max", "incompleteDateValidation", "autoCorrectParts", "autoSwitchParts", "autoSwitchKeys", "enableMouseWheel", "allowCaretMode", "autoFill", "focusedDate", "value", "format", "twoDigitYearMax", "formatPlaceholder", "placeholder", "tabindex", "tabIndex", "disabledDates", "title", "subtitle", "rangeValidation", "disabledDatesValidation", "weekNumber", "size", "rounded", "fillMode", "adaptiveMode"], outputs: ["valueChange", "focus", "blur", "open", "close", "escape"], exportAs: ["kendo-datepicker"] }, { kind: "directive", type: NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "pipe", type: FieldAccessorPipe, name: "valueOf" }, { kind: "pipe", type: LevelItemsPipe, name: "levelItems" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CellComponent, decorators: [{
+    `, isInline: true, dependencies: [{ kind: "directive", type: NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: FocusableDirective, selector: "[kendoTreeListFocusable],\n        [kendoTreeListAddCommand],\n        [kendoTreeListEditCommand],\n        [kendoTreeListRemoveCommand],\n        [kendoTreeListSaveCommand],\n        [kendoTreeListCancelCommand]\n    ", inputs: ["kendoTreeListFocusable", "enabled", "kendoTreeListAddCommand", "kendoTreeListEditCommand", "kendoTreeListRemoveCommand", "kendoTreeListSaveCommand", "kendoTreeListCancelCommand"] }, { kind: "component", type: 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", "inputAttributes"], outputs: ["valueChange", "focus", "blur", "inputFocus", "inputBlur"], exportAs: ["kendoNumericTextBox"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: DatePickerComponent, selector: "kendo-datepicker", inputs: ["focusableId", "cellTemplate", "clearButton", "inputAttributes", "monthCellTemplate", "yearCellTemplate", "decadeCellTemplate", "centuryCellTemplate", "weekNumberTemplate", "headerTitleTemplate", "headerTemplate", "footerTemplate", "footer", "navigationItemTemplate", "weekDaysFormat", "showOtherMonthDays", "activeView", "bottomView", "topView", "calendarType", "animateCalendarNavigation", "disabled", "readonly", "readOnlyInput", "popupSettings", "navigation", "min", "max", "incompleteDateValidation", "autoCorrectParts", "autoSwitchParts", "autoSwitchKeys", "enableMouseWheel", "allowCaretMode", "autoFill", "focusedDate", "value", "format", "twoDigitYearMax", "formatPlaceholder", "placeholder", "tabindex", "tabIndex", "disabledDates", "title", "subtitle", "rangeValidation", "disabledDatesValidation", "weekNumber", "size", "rounded", "fillMode", "adaptiveMode"], outputs: ["valueChange", "focus", "blur", "open", "close", "escape"], exportAs: ["kendo-datepicker"] }, { kind: "directive", type: NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "pipe", type: FieldAccessorPipe, name: "valueOf" }, { kind: "pipe", type: LevelItemsPipe, name: "levelItems" }, { kind: "component", type: CheckBoxComponent, selector: "kendo-checkbox", inputs: ["checkedState", "rounded"], outputs: ["checkedStateChange"], exportAs: ["kendoCheckBox"] }, { kind: "component", type: TextBoxComponent, selector: "kendo-textbox", inputs: ["focusableId", "title", "type", "disabled", "readonly", "tabindex", "value", "selectOnFocus", "showSuccessIcon", "showErrorIcon", "clearButton", "successIcon", "successSvgIcon", "errorIcon", "errorSvgIcon", "clearButtonIcon", "clearButtonSvgIcon", "size", "rounded", "fillMode", "tabIndex", "placeholder", "maxlength", "inputAttributes"], outputs: ["valueChange", "inputFocus", "inputBlur", "focus", "blur"], exportAs: ["kendoTextBox"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CellComponent, decorators: [{
             type: Component,
             args: [{
                     selector: '[kendoTreeListCell]',
@@ -255,12 +264,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                 </ng-container>
                 <ng-container *ngIf="isBoundColumn">{{ dataItem | valueOf: column.field: column.format}}</ng-container>
                 <ng-template [ngIf]="column.isCheckboxColumn && !isNew">
-                    <input
-                        type="checkbox"
+                    <kendo-checkbox
                         kendoTreeListFocusable
-                        [attr.aria-label]="messageFor('selectRowCheckboxLabel')"
-                        class="k-checkbox k-checkbox-md k-rounded-md"
-                        [checked]="selected" />
+                        [inputAttributes]="{'aria-label': messageFor('selectRowCheckboxLabel')}"
+                        [checkedState]="selected"
+                    ></kendo-checkbox>
                 </ng-template>
                 <ng-container *ngIf="column.isRowReorderColumn && !isNew">
                     <kendo-icon-wrapper
@@ -290,27 +298,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                         kendoTreeListFocusable
                     ></kendo-datepicker>
 
-                    <input
+                    <kendo-checkbox
                         *ngSwitchCase="'boolean'"
-                        type="checkbox"
-                        class="k-checkbox k-checkbox-md k-rounded-md"
                         [formControl]="$any(formGroup.get(column.field))"
                         kendoTreeListFocusable
-                    />
+                    ></kendo-checkbox>
 
-                    <input
+                    <kendo-textbox
                         *ngSwitchDefault
-                        type="text"
-                        class="k-textbox k-input k-input-md k-input-solid k-rounded-md"
                         [formControl]="$any(formGroup.get(column.field))"
                         kendoTreeListFocusable
-                    />
+                    ></kendo-textbox>
                 </ng-container>
             </ng-container>
         </ng-container>
     `,
                     standalone: true,
-                    imports: [NgSwitch, NgSwitchCase, NgIf, NgFor, IconWrapperComponent, NgTemplateOutlet, FocusableDirective, NumericTextBoxComponent, ReactiveFormsModule, DatePickerComponent, NgSwitchDefault, FieldAccessorPipe, LevelItemsPipe]
+                    imports: [NgSwitch, NgSwitchCase, NgIf, NgFor, IconWrapperComponent, NgTemplateOutlet, FocusableDirective, NumericTextBoxComponent, ReactiveFormsModule, DatePickerComponent, NgSwitchDefault, FieldAccessorPipe, LevelItemsPipe, CheckBoxComponent, TextBoxComponent]
                 }]
         }], ctorParameters: function () { return [{ type: i1.EditService }, { type: i2.LocalizationService }, { type: i3.FocusGroup }]; }, propDecorators: { commandCellClass: [{
                 type: HostBinding,
@@ -346,6 +350,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                 type: Input
             }], expandIcons: [{
                 type: Input
+            }], rowIndex: [{
+                type: Input
             }], selected: [{
                 type: Input
             }], dataItem: [{

package/{esm2020 → esm2022}/rendering/common/col-group.component.mjs

@@ -10,21 +10,19 @@ import * as i0 from "@angular/core";
  * @hidden
  */
 export class ColGroupComponent {
-    constructor() {
-        this.columns = [];
-    }
+    columns = [];
     get columnsToRender() {
         return columnsToRender(this.columns);
     }
     trackBy(index, _item) {
         return index;
     }
-}
-ColGroupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ColGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ColGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: ColGroupComponent, isStandalone: true, selector: "[kendoTreeListColGroup]", inputs: { columns: "columns" }, ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ColGroupComponent, isStandalone: true, selector: "[kendoTreeListColGroup]", inputs: { columns: "columns" }, ngImport: i0, template: `
         <col *ngFor="let column of columnsToRender; trackBy: trackBy;" [style.width.px]="column.width"/>
     `, isInline: true, dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ColGroupComponent, decorators: [{
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColGroupComponent, decorators: [{
             type: Component,
             args: [{
                     selector: '[kendoTreeListColGroup]',

package/{esm2020 → esm2022}/rendering/common/field-accessor.pipe.mjs

@@ -13,6 +13,7 @@ const FORMAT_REGEX = /\{\d+:?/;
  * @hidden
  */
 export class FieldAccessorPipe {
+    intlService;
     constructor(intlService) {
         this.intlService = intlService;
     }
@@ -33,10 +34,10 @@ export class FieldAccessorPipe {
         }
         return intl.toString(value, format);
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FieldAccessorPipe, deps: [{ token: i1.IntlService }], target: i0.ɵɵFactoryTarget.Pipe });
+    static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: FieldAccessorPipe, isStandalone: true, name: "valueOf", pure: false });
 }
-FieldAccessorPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: FieldAccessorPipe, deps: [{ token: i1.IntlService }], target: i0.ɵɵFactoryTarget.Pipe });
-FieldAccessorPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: FieldAccessorPipe, isStandalone: true, name: "valueOf", pure: false });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: FieldAccessorPipe, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FieldAccessorPipe, decorators: [{
             type: Pipe,
             args: [{
                     // eslint-disable-next-line @angular-eslint/pipe-prefix

package/{esm2020 → esm2022}/rendering/common/level-items.pipe.mjs

@@ -17,10 +17,10 @@ export class LevelItemsPipe {
         }
         return result;
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LevelItemsPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
+    static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: LevelItemsPipe, isStandalone: true, name: "levelItems" });
 }
-LevelItemsPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: LevelItemsPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
-LevelItemsPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: LevelItemsPipe, isStandalone: true, name: "levelItems" });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: LevelItemsPipe, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LevelItemsPipe, decorators: [{
             type: Pipe,
             args: [{
                     name: 'levelItems',

package/{esm2020 → esm2022}/rendering/common/loading.component.mjs

@@ -10,21 +10,22 @@ import * as i1 from "@progress/kendo-angular-l10n";
  * @hidden
  */
 export class LoadingComponent {
-    constructor(localization) {
-        this.localization = localization;
-        this.hostClass = true;
-    }
+    localization;
+    hostClass = true;
     get loadingText() {
         return this.localization.get('loading');
     }
-}
-LoadingComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: LoadingComponent, deps: [{ token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
-LoadingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: LoadingComponent, isStandalone: true, selector: "[kendoTreeListLoading]", host: { properties: { "class.k-loading-mask": "this.hostClass" } }, ngImport: i0, template: `
+    constructor(localization) {
+        this.localization = localization;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LoadingComponent, deps: [{ token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: LoadingComponent, isStandalone: true, selector: "[kendoTreeListLoading]", host: { properties: { "class.k-loading-mask": "this.hostClass" } }, ngImport: i0, template: `
         <span class="k-loading-text">{{ loadingText }}</span>
         <div class="k-loading-image"></div>
         <div class="k-loading-color"></div>
     `, isInline: true });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: LoadingComponent, decorators: [{
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LoadingComponent, decorators: [{
             type: Component,
             args: [{
                     selector: '[kendoTreeListLoading]',

package/{esm2020 → esm2022}/rendering/common/spacer.component.mjs

@@ -12,22 +12,27 @@ import * as i0 from "@angular/core";
  * It can also be used in any flex container within the TreeList. [See example](slug:toolbartemplate_treelist#toc-defining-the-spacing-between-toolbar-elements).
  */
 export class TreeListSpacerComponent {
-    constructor() {
-        this.hostClass = true;
-    }
+    hostClass = true;
     get sizedClass() {
         return isPresent(this.width);
     }
     get flexBasisStyle() {
         return this.width;
     }
+    /**
+     * Specifies the width of the TreeListSpacer.
+     * Accepts the [string values of the CSS `flex-basis` property](https://developer.mozilla.org/en-US/docs/Web/CSS/flex-basis).
+     *
+     * If not set, the TreeListSpacer will take all the available space.
+     */
+    width;
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TreeListSpacerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TreeListSpacerComponent, isStandalone: true, selector: "kendo-treelist-spacer", inputs: { width: "width" }, host: { properties: { "class.k-spacer": "this.hostClass", "class.k-spacer-sized": "this.sizedClass", "style.flexBasis": "this.flexBasisStyle" } }, ngImport: i0, template: ``, isInline: true });
 }
-TreeListSpacerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TreeListSpacerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-TreeListSpacerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: TreeListSpacerComponent, isStandalone: true, selector: "kendo-treelist-spacer, kendo-treelist-pager-spacer", inputs: { width: "width" }, host: { properties: { "class.k-spacer": "this.hostClass", "class.k-spacer-sized": "this.sizedClass", "style.flexBasis": "this.flexBasisStyle" } }, ngImport: i0, template: ``, isInline: true });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TreeListSpacerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TreeListSpacerComponent, decorators: [{
             type: Component,
             args: [{
-                    selector: 'kendo-treelist-spacer, kendo-treelist-pager-spacer',
+                    selector: 'kendo-treelist-spacer',
                     template: ``,
                     standalone: true
                 }]

package/{esm2020 → esm2022}/rendering/footer-template.directive.mjs

@@ -29,13 +29,14 @@ import * as i0 from "@angular/core";
  * ```
  */
 export class FooterTemplateDirective {
+    templateRef;
     constructor(templateRef) {
         this.templateRef = templateRef;
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FooterTemplateDirective, deps: [{ token: i0.TemplateRef, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: FooterTemplateDirective, isStandalone: true, selector: "[kendoTreeListFooterTemplate]", ngImport: i0 });
 }
-FooterTemplateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: FooterTemplateDirective, deps: [{ token: i0.TemplateRef, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
-FooterTemplateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: FooterTemplateDirective, isStandalone: true, selector: "[kendoTreeListFooterTemplate]", ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: FooterTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FooterTemplateDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kendoTreeListFooterTemplate]',

package/{esm2020 → esm2022}/rendering/header/header-template.directive.mjs

@@ -27,13 +27,14 @@ import * as i0 from "@angular/core";
  * ```
  */
 export class HeaderTemplateDirective {
+    templateRef;
     constructor(templateRef) {
         this.templateRef = templateRef;
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: HeaderTemplateDirective, deps: [{ token: i0.TemplateRef, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: HeaderTemplateDirective, isStandalone: true, selector: "[kendoTreeListHeaderTemplate]", ngImport: i0 });
 }
-HeaderTemplateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: HeaderTemplateDirective, deps: [{ token: i0.TemplateRef, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
-HeaderTemplateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: HeaderTemplateDirective, isStandalone: true, selector: "[kendoTreeListHeaderTemplate]", ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: HeaderTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: HeaderTemplateDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kendoTreeListHeaderTemplate]',

package/{esm2020 → esm2022}/rendering/header/header.component.mjs

@@ -35,6 +35,7 @@ import { ColumnMenuComponent } from '../../column-menu/column-menu.component';
 import { FilterMenuComponent } from '../../filtering/menu/filter-menu.component';
 import { LogicalCellDirective } from '../../navigation/logical-cell.directive';
 import { LogicalRowDirective } from '../../navigation/logical-row.directive';
+import { CheckBoxComponent } from '@progress/kendo-angular-inputs';
 import * as i0 from "@angular/core";
 import * as i1 from "../../common/single-popup.service";
 import * as i2 from "../../dragdrop/drag-hint.service";
@@ -67,43 +68,62 @@ const rules = and(ofColumnType, reorderable, notInSpanColumn, notSameElement, sa
  * @hidden
  */
 export class HeaderComponent {
-    constructor(popupService, hint, cue, reorderService, sortService, selectionService, localization, cd) {
-        this.popupService = popupService;
-        this.hint = hint;
-        this.cue = cue;
-        this.reorderService = reorderService;
-        this.sortService = sortService;
-        this.selectionService = selectionService;
-        this.localization = localization;
-        this.cd = cd;
-        this.columns = [];
-        this.sort = new Array();
-        this.sortable = false;
-        this.lockedColumnsCount = 0;
-        this.resizable = false;
-        this.reorderable = false;
-        this.columnMenu = false;
-        this.totalColumnsCount = 0;
-        this.sortedFields = {};
-        this.hostClass = true;
-        this.dropTargets = new QueryList();
-        this.sortAscSmallIcon = sortAscSmallIcon;
-        this.sortDescSmallIcon = sortDescSmallIcon;
-        this.subscription = new Subscription();
-    }
+    popupService;
+    hint;
+    cue;
+    reorderService;
+    sortService;
+    selectionService;
+    localization;
+    cd;
+    /**
+     * @hidden
+     */
+    totalColumnLevels;
+    columns = [];
+    scrollable;
+    filterable;
+    sort = new Array();
+    filter;
+    sortable = false;
+    lockedColumnsCount = 0;
+    resizable = false;
+    reorderable = false;
+    columnMenu = false;
+    columnMenuTemplate;
+    totalColumnsCount = 0;
+    totalColumns;
+    sortedFields = {};
     get headerClass() {
         return !this.scrollable;
     }
+    hostClass = true;
     get sortableLabel() {
         return this.localization.get('sortable');
     }
     get columnMenuSettings() {
         return this.columnMenu;
     }
+    dropTargets = new QueryList();
     // Number of unlocked columns in the next table, if any
     get unlockedColumnsCount() {
         return this.totalColumnsCount - this.lockedColumnsCount - this.columns.length;
     }
+    sortAscSmallIcon = sortAscSmallIcon;
+    sortDescSmallIcon = sortDescSmallIcon;
+    subscription = new Subscription();
+    targetSubscription;
+    _leafColumns;
+    constructor(popupService, hint, cue, reorderService, sortService, selectionService, localization, cd) {
+        this.popupService = popupService;
+        this.hint = hint;
+        this.cue = cue;
+        this.reorderService = reorderService;
+        this.sortService = sortService;
+        this.selectionService = selectionService;
+        this.localization = localization;
+        this.cd = cd;
+    }
     getColumnComponent(column) {
         return column;
     }
@@ -252,8 +272,8 @@ export class HeaderComponent {
         return column.isCheckboxColumn && column.showSelectAll && !column.headerTemplateRef &&
             this.selectionService.enableMultiple;
     }
-    selectAllClick(args) {
-        this.selectionService.toggleAll(args.target.checked);
+    selectAllChange(state) {
+        this.selectionService.toggleAll(state);
     }
     sortDescriptor(field) {
         return this.sort.find(item => item.field === field) || { field };
@@ -341,9 +361,8 @@ export class HeaderComponent {
             target: target.context.column
         });
     }
-}
-HeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: HeaderComponent, deps: [{ token: i1.SinglePopupService }, { token: i2.DragHintService }, { token: i3.DropCueService }, { token: i4.ColumnReorderService }, { token: i5.SortService }, { token: i6.SelectionService }, { token: i7.LocalizationService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-HeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: HeaderComponent, isStandalone: true, selector: "[kendoTreeListHeader]", inputs: { totalColumnLevels: "totalColumnLevels", columns: "columns", scrollable: "scrollable", filterable: "filterable", sort: "sort", filter: "filter", sortable: "sortable", lockedColumnsCount: "lockedColumnsCount", resizable: "resizable", reorderable: "reorderable", columnMenu: "columnMenu", columnMenuTemplate: "columnMenuTemplate", totalColumnsCount: "totalColumnsCount", totalColumns: "totalColumns" }, host: { properties: { "class.k-grid-header": "this.headerClass", "class.k-table-thead": "this.hostClass" } }, viewQueries: [{ propertyName: "dropTargets", predicate: DropTargetDirective, descendants: true }], usesOnChanges: true, ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: HeaderComponent, deps: [{ token: i1.SinglePopupService }, { token: i2.DragHintService }, { token: i3.DropCueService }, { token: i4.ColumnReorderService }, { token: i5.SortService }, { token: i6.SelectionService }, { token: i7.LocalizationService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: HeaderComponent, isStandalone: true, selector: "[kendoTreeListHeader]", inputs: { totalColumnLevels: "totalColumnLevels", columns: "columns", scrollable: "scrollable", filterable: "filterable", sort: "sort", filter: "filter", sortable: "sortable", lockedColumnsCount: "lockedColumnsCount", resizable: "resizable", reorderable: "reorderable", columnMenu: "columnMenu", columnMenuTemplate: "columnMenuTemplate", totalColumnsCount: "totalColumnsCount", totalColumns: "totalColumns" }, host: { properties: { "class.k-grid-header": "this.headerClass", "class.k-table-thead": "this.hostClass" } }, viewQueries: [{ propertyName: "dropTargets", predicate: DropTargetDirective, descendants: true }], usesOnChanges: true, ngImport: i0, template: `
         <tr *ngFor="let i of columnLevels; let levelIndex = index" role="row"
             kendoTreeListLogicalRow
                 [logicalRowIndex]="levelIndex"
@@ -420,7 +439,7 @@ HeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", versio
                                 <ng-container *ngIf="!column.headerTemplateRef">
                                     <span class="k-column-title">{{column.displayTitle}}</span>
                                 </ng-container>
-                                <span class="k-sort-icon">
+                                <span [class.k-sort-icon]="sortDescriptor(getColumnComponent(column).field).dir">
                                 <kendo-icon-wrapper
                                         *ngIf="sortDescriptor(getColumnComponent(column).field).dir"
                                         role="note" [attr.aria-label]="sortableLabel"
@@ -447,12 +466,11 @@ HeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", versio
                         </span>
                     </ng-template>
                     <ng-template [ngIf]="renderSelectAll(column)">
-                        <input
-                            type="checkbox"
-                            class="k-checkbox k-checkbox-md k-rounded-md"
-                            [attr.aria-label]="messageFor('selectAllRowsCheckboxLabel')"
+                        <kendo-checkbox
+                            [inputAttributes]="{'aria-label': messageFor('selectAllRowsCheckboxLabel')}"
                             kendoTreeListFocusable
-                            (click)="selectAllClick($event)" />
+                            (checkedStateChange)="selectAllChange($event)"
+                        ></kendo-checkbox>
                     </ng-template>
                     <span kendoTreeListColumnHandle
                         kendoDraggable
@@ -525,8 +543,9 @@ HeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", versio
             [logicalSlaveCellsCount]="unlockedColumnsCount"
         >
         </tr>
-    `, isInline: true, dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: LogicalRowDirective, selector: "[kendoTreeListLogicalRow]", inputs: ["logicalRowIndex", "logicalSlaveRow", "logicalCellsCount", "logicalSlaveCellsCount", "dataRowIndex", "dataItem", "isNew", "totalColumns"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: LogicalCellDirective, selector: "[kendoTreeListLogicalCell]", inputs: ["logicalColIndex", "logicalRowIndex", "logicalSlaveCell", "column", "colIndex", "colSpan", "rowSpan", "dataRowIndex", "dataItem", "expandable"] }, { kind: "directive", type: DropTargetDirective, selector: "[kendoDropTarget]", inputs: ["context"], outputs: ["enter", "leave", "drop"] }, { kind: "directive", type: DraggableDirective, selector: "[kendoDraggable]", inputs: ["enableDrag"], outputs: ["kendoPress", "kendoDrag", "kendoRelease"] }, { kind: "directive", type: DraggableColumnDirective, selector: "[kendoDraggableColumn]", inputs: ["context", "enableDrag"], outputs: ["drag"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: FilterMenuComponent, selector: "kendo-treelist-filter-menu", inputs: ["column", "filter"] }, { kind: "component", type: ColumnMenuComponent, selector: "kendo-treelist-column-menu", inputs: ["standalone", "column", "settings", "sort", "filter", "sortable", "columnMenuTemplate"] }, { kind: "directive", type: TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "directive", type: FocusableDirective, selector: "[kendoTreeListFocusable],\n        [kendoTreeListAddCommand],\n        [kendoTreeListEditCommand],\n        [kendoTreeListRemoveCommand],\n        [kendoTreeListSaveCommand],\n        [kendoTreeListCancelCommand]\n    ", inputs: ["kendoTreeListFocusable", "enabled", "kendoTreeListAddCommand", "kendoTreeListEditCommand", "kendoTreeListRemoveCommand", "kendoTreeListSaveCommand", "kendoTreeListCancelCommand"] }, { kind: "directive", type: ColumnHandleDirective, selector: "[kendoTreeListColumnHandle]", inputs: ["columns", "column"] }, { kind: "component", type: FilterRowComponent, selector: "[kendoTreeListFilterRow]", inputs: ["columns", "filter", "logicalRowIndex", "lockedColumnsCount"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: HeaderComponent, decorators: [{
+    `, isInline: true, dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: LogicalRowDirective, selector: "[kendoTreeListLogicalRow]", inputs: ["logicalRowIndex", "logicalSlaveRow", "logicalCellsCount", "logicalSlaveCellsCount", "dataRowIndex", "dataItem", "isNew", "totalColumns"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: LogicalCellDirective, selector: "[kendoTreeListLogicalCell]", inputs: ["logicalColIndex", "logicalRowIndex", "logicalSlaveCell", "column", "colIndex", "colSpan", "rowSpan", "dataRowIndex", "dataItem", "expandable"] }, { kind: "directive", type: DropTargetDirective, selector: "[kendoDropTarget]", inputs: ["context"], outputs: ["enter", "leave", "drop"] }, { kind: "directive", type: DraggableDirective, selector: "[kendoDraggable]", inputs: ["enableDrag"], outputs: ["kendoPress", "kendoDrag", "kendoRelease"] }, { kind: "directive", type: DraggableColumnDirective, selector: "[kendoDraggableColumn]", inputs: ["context", "enableDrag"], outputs: ["drag"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: FilterMenuComponent, selector: "kendo-treelist-filter-menu", inputs: ["column", "filter"] }, { kind: "component", type: ColumnMenuComponent, selector: "kendo-treelist-column-menu", inputs: ["standalone", "column", "settings", "sort", "filter", "sortable", "columnMenuTemplate"] }, { kind: "directive", type: TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "directive", type: FocusableDirective, selector: "[kendoTreeListFocusable],\n        [kendoTreeListAddCommand],\n        [kendoTreeListEditCommand],\n        [kendoTreeListRemoveCommand],\n        [kendoTreeListSaveCommand],\n        [kendoTreeListCancelCommand]\n    ", inputs: ["kendoTreeListFocusable", "enabled", "kendoTreeListAddCommand", "kendoTreeListEditCommand", "kendoTreeListRemoveCommand", "kendoTreeListSaveCommand", "kendoTreeListCancelCommand"] }, { kind: "directive", type: ColumnHandleDirective, selector: "[kendoTreeListColumnHandle]", inputs: ["columns", "column"] }, { kind: "component", type: FilterRowComponent, selector: "[kendoTreeListFilterRow]", inputs: ["columns", "filter", "logicalRowIndex", "lockedColumnsCount"] }, { 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: HeaderComponent, decorators: [{
             type: Component,
             args: [{
                     selector: '[kendoTreeListHeader]',
@@ -607,7 +626,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                                 <ng-container *ngIf="!column.headerTemplateRef">
                                     <span class="k-column-title">{{column.displayTitle}}</span>
                                 </ng-container>
-                                <span class="k-sort-icon">
+                                <span [class.k-sort-icon]="sortDescriptor(getColumnComponent(column).field).dir">
                                 <kendo-icon-wrapper
                                         *ngIf="sortDescriptor(getColumnComponent(column).field).dir"
                                         role="note" [attr.aria-label]="sortableLabel"
@@ -634,12 +653,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                         </span>
                     </ng-template>
                     <ng-template [ngIf]="renderSelectAll(column)">
-                        <input
-                            type="checkbox"
-                            class="k-checkbox k-checkbox-md k-rounded-md"
-                            [attr.aria-label]="messageFor('selectAllRowsCheckboxLabel')"
+                        <kendo-checkbox
+                            [inputAttributes]="{'aria-label': messageFor('selectAllRowsCheckboxLabel')}"
                             kendoTreeListFocusable
-                            (click)="selectAllClick($event)" />
+                            (checkedStateChange)="selectAllChange($event)"
+                        ></kendo-checkbox>
                     </ng-template>
                     <span kendoTreeListColumnHandle
                         kendoDraggable
@@ -714,7 +732,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
         </tr>
     `,
                     standalone: true,
-                    imports: [NgFor, LogicalRowDirective, NgIf, LogicalCellDirective, DropTargetDirective, DraggableDirective, DraggableColumnDirective, NgClass, NgStyle, FilterMenuComponent, ColumnMenuComponent, TemplateContextDirective, IconWrapperComponent, FocusableDirective, ColumnHandleDirective, FilterRowComponent]
+                    imports: [NgFor, LogicalRowDirective, NgIf, LogicalCellDirective, DropTargetDirective, DraggableDirective, DraggableColumnDirective, NgClass, NgStyle, FilterMenuComponent, ColumnMenuComponent, TemplateContextDirective, IconWrapperComponent, FocusableDirective, ColumnHandleDirective, FilterRowComponent, CheckBoxComponent]
                 }]
         }], ctorParameters: function () { return [{ type: i1.SinglePopupService }, { type: i2.DragHintService }, { type: i3.DropCueService }, { type: i4.ColumnReorderService }, { type: i5.SortService }, { type: i6.SelectionService }, { type: i7.LocalizationService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { totalColumnLevels: [{
                 type: Input