@progress/kendo-angular-treelist 13.0.0-develop.5 → 13.0.0-develop.7

package/column-menu/column-menu-settings.interface.d.ts

@@ -5,35 +5,32 @@
 /**
  * The settings of the column menu in the TreeList component.
  *
- * {% meta height:500 %}
- * {% embed_file column-menu/chooser/app.component.ts preview %}
- * {% embed_file column-menu/chooser/app.module.ts %}
- * {% embed_file shared/main.ts %}
- * {% embed_file shared/employees.ts %}
- * {% endmeta %}
+ * @example
+ * ```html
+ * <kendo-treelist ...
+ *   [columnMenu]="{ columnChooser: false }">
+ *   ...
+ * </kendo-treelist>
+ * ```
  */
 export interface ColumnMenuSettings {
     /**
      * Specifies if the columns can be sorted in the column menu.
      * If [sorting]({% slug api_treelist_treelistcomponent %}#toc-sortable) is enabled, defaults to `true`.
-     * @default true
      */
     sort?: boolean;
     /**
      * Specifies if the columns can be filtered in the column menu.
      * If [filtering]({% slug api_treelist_treelistcomponent %}#toc-filterable) is enabled, defaults to `true`.
-     * @default true
      */
     filter?: boolean;
     /**
      * Specifies if the item for column selection will be displayed in the column menu.
-     * @default true
      */
     columnChooser?: boolean;
     /**
      * Specifies if the columns can be locked and unlocked from the column menu.
      * This option follows the prerequisites and limitations of the [locked columns]({% slug locked_columns_treelist %}).
-     * @default false
      */
     lock?: boolean;
 }

package/column-resizing/column-resize.interface.d.ts

@@ -5,7 +5,7 @@
 import { Observable } from 'rxjs';
 import { ColumnBase } from '../columns/column-base';
 /**
- * The returned type of the `columnResize` event.
+ * The returned type of the [`columnResize`](slug:api_treelist_treelistcomponent#toc-columnresize) event.
  */
 export interface ColumnResizeArgs {
     /**

package/data/change-event-args.interface.d.ts

@@ -4,7 +4,7 @@
 *-------------------------------------------------------------------------------------------*/
 import { SortDescriptor, CompositeFilterDescriptor } from '@progress/kendo-data-query';
 /**
- * Arguments for the `pageChange` event.
+ * Arguments for the [`pageChange`](slug:api_treelist_treelistcomponent#toc-pagechange) event.
  */
 export interface PageChangeEvent {
     /**
@@ -17,7 +17,7 @@ export interface PageChangeEvent {
     take: number;
 }
 /**
- * Arguments for the `dataStateChange` event
+ * Arguments for the [`dataStateChange`](slug:api_treelist_treelistcomponent#toc-datastatechange) event
  * ([more information and examples]({% slug databinding_treelist %})).
  */
 export interface DataStateChangeEvent {

package/data/data.collection.d.ts

@@ -8,7 +8,13 @@ import { EventEmitter } from '@angular/core';
  * The data type that is expected by the TreeList.
  */
 export interface TreeListDataResult {
+    /**
+     * The data that will be rendered by the TreeList as an array.
+     */
     data: any[];
+    /**
+     * The aggregated values for the group. An [`AggregateResult`](slug:treelist_with_aggregates) instance.
+     */
     aggregates?: any;
 }
 /**

package/dragdrop/column-reorder-config.d.ts

@@ -3,7 +3,7 @@
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 /**
- * Additional configuration for the `reorderColumn` method.
+ * Additional configuration for the [`reorderColumn`](slug:api_treelist_treelistcomponent#toc-reordercolumn) method.
  */
 export interface ColumnReorderConfig {
     /**

package/editing/edit-event-args.interface.d.ts

@@ -4,7 +4,7 @@
 *-------------------------------------------------------------------------------------------*/
 import type { TreeListComponent } from "../treelist.component";
 /**
- * Arguments for the `remove` event.
+ * Arguments for the [`edit`](slug:api_treelist_treelistcomponent#toc-edit) event.
  */
 export interface EditEvent {
     /**

package/editing/remove-event-args.interface.d.ts

@@ -4,7 +4,7 @@
 *-------------------------------------------------------------------------------------------*/
 import { EditEvent } from "./edit-event-args.interface";
 /**
- * Arguments for the `remove` event.
+ * Arguments for the [`remove`](slug:api_treelist_treelistcomponent#toc-remove) event.
  */
 export interface RemoveEvent extends EditEvent {
     /**

package/editing/save-event-args.interface.d.ts

@@ -5,7 +5,7 @@
 import { EditEvent } from "./edit-event-args.interface";
 import { FormGroup } from "@angular/forms";
 /**
- * Arguments for the `save` event.
+ * Arguments for the [`save`](slug:api_treelist_treelistcomponent#toc-save) event.
  */
 export interface SaveEvent extends EditEvent {
     /**

package/esm2020/column-menu/column-menu-item.component.mjs

@@ -72,7 +72,7 @@ ColumnMenuItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0"
             <ng-container [ngTemplateOutlet]="contentTemplate.templateRef">
             </ng-container>
         <div>
-    `, isInline: true, components: [{ type: i1.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass"], exportAs: ["kendoIconWrapper"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], animations: [
+    `, isInline: true, components: [{ type: i1.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], animations: [
         trigger('state', [
             state('collapsed', style({ display: 'none' })),
             state('expanded', style({ display: 'block' })),

package/esm2020/column-menu/column-menu.component.mjs

@@ -153,7 +153,7 @@ ColumnMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ve
                 [expanded]="expandedFilter" (expand)="onFilterExpand()">
             </kendo-treelist-columnmenu-filter>
         </ng-template>
-    `, isInline: true, components: [{ type: i4.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass"], exportAs: ["kendoIconWrapper"] }, { type: i5.ColumnMenuSortComponent, selector: "kendo-treelist-columnmenu-sort" }, { type: i6.ColumnMenuLockComponent, selector: "kendo-treelist-columnmenu-lock" }, { type: i7.ColumnMenuChooserComponent, selector: "kendo-treelist-columnmenu-chooser", inputs: ["expanded"], outputs: ["expand", "collapse"] }, { type: i8.ColumnMenuFilterComponent, selector: "kendo-treelist-columnmenu-filter", inputs: ["expanded"], outputs: ["expand", "collapse"] }], directives: [{ type: i9.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i9.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i9.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    `, isInline: true, components: [{ type: i4.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { type: i5.ColumnMenuSortComponent, selector: "kendo-treelist-columnmenu-sort" }, { type: i6.ColumnMenuLockComponent, selector: "kendo-treelist-columnmenu-lock" }, { type: i7.ColumnMenuChooserComponent, selector: "kendo-treelist-columnmenu-chooser", inputs: ["expanded"], outputs: ["expand", "collapse"] }, { type: i8.ColumnMenuFilterComponent, selector: "kendo-treelist-columnmenu-filter", inputs: ["expanded"], outputs: ["expand", "collapse"] }], directives: [{ type: i9.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i9.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i9.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: ColumnMenuComponent, decorators: [{
             type: Component,
             args: [{

package/esm2020/data/data.collection.mjs

@@ -9,22 +9,22 @@ import { EventEmitter } from '@angular/core';
  * @hidden
  */
 export const EXPANDED_STATE = {
-    isExpanded: () => true
+    isExpanded: () => true,
 };
 /**
  * @hidden
  */
 export const UNSELECTED_STATE = {
-    isRowSelected: () => false
+    isRowSelected: () => false,
 };
 /**
  * @hidden
  */
 export const NOT_EDITED_STATE = {
     hasNew: () => false,
-    context: () => null
+    context: () => null,
 };
-const identity = item => item;
+const identity = (item) => item;
 function loadView(view, subject) {
     view.loadData();
     if (view.loading) {
@@ -69,10 +69,11 @@ class ViewRange {
         return true;
     }
     includeParents(_children) {
+        // eslint-disable-next-line no-empty
     }
 }
 function isPagerSettings(pageable) {
-    return typeof pageable === "object";
+    return typeof pageable === 'object';
 }
 class PagerRange extends ViewRange {
     constructor(skip, pageSize, pageable) {
@@ -86,8 +87,8 @@ class PagerRange extends ViewRange {
         return this.skip <= index && index < this.skip + this.pageSize;
     }
     levelInRange(parent, items, _rowIndex) {
-        return parent.level === -1 ||
-            (this.skip <= parent.index + items.length && parent.index + 1 < this.skip + this.pageSize);
+        return (parent.level === -1 ||
+            (this.skip <= parent.index + items.length && parent.index + 1 < this.skip + this.pageSize));
     }
     includeParents(children) {
         let parentLevel = children.parentLevel;
@@ -130,7 +131,7 @@ export class ViewItemFactory {
             this.rootLevel = this.dataLevel({
                 level: -1,
                 id: null,
-                expanded: true
+                expanded: true,
             }, options.data);
         }
     }
@@ -145,7 +146,8 @@ export class ViewItemFactory {
             while (dataLevels[0] && dataLevels[0].idx >= dataLevels[0].items.length) {
                 const dataLevel = dataLevels.shift();
                 if (this.hasFooter && dataLevel.expanded && dataLevel.items.length) {
-                    if (dataLevel.inRange || this.viewRange.levelInRange(dataLevel.parent, dataLevel.items, this.rowIndex)) {
+                    if (dataLevel.inRange ||
+                        this.viewRange.levelInRange(dataLevel.parent, dataLevel.items, this.rowIndex)) {
                         result.push({
                             type: 'footer',
                             items: dataLevel.items,
@@ -153,7 +155,7 @@ export class ViewItemFactory {
                             level: dataLevel.level,
                             parentItem: dataLevel.parent.data,
                             parentIndex: dataLevel.parentIndex,
-                            rowIndex: this.rowIndex
+                            rowIndex: this.rowIndex,
                         });
                         this.viewRange.includeParents(dataLevel);
                     }
@@ -173,7 +175,7 @@ export class ViewItemFactory {
                 index: itemIndex,
                 level: currentLevel.level,
                 hasChildren: this.hasChildren(dataItem),
-                parent: currentLevel.parent
+                parent: currentLevel.parent,
             };
             if (currentLevel.expanded) {
                 this.rowIndex++;
@@ -206,7 +208,7 @@ export class ViewItemFactory {
             observables: this.observables,
             total: itemCount,
             totalVisible: itemIndex,
-            totalRows: this.rowIndex
+            totalRows: this.rowIndex,
         };
     }
     loadChildren(parent) {
@@ -225,7 +227,7 @@ export class ViewItemFactory {
             if (isObservable(children)) {
                 this.observables.push({
                     observable: children,
-                    parentId: parentId
+                    parentId: parentId,
                 });
                 parent.loading = true;
             }
@@ -246,7 +248,7 @@ export class ViewItemFactory {
             aggregates: children.aggregates,
             expanded: parent.expanded,
             parentIndex: parent.index,
-            parent: parent
+            parent: parent,
         };
     }
     addNew(result, parent) {
@@ -259,7 +261,7 @@ export class ViewItemFactory {
                 type: 'data',
                 data: this.editState.newItem.dataItem,
                 editContext: this.editState.newItem,
-                rowIndex: rowIndex
+                rowIndex: rowIndex,
             });
             if (parent || inRange) {
                 this.rowIndex++;
@@ -295,7 +297,7 @@ export class ViewCollection {
             idGetter: identity,
             pageable: false,
             isVirtual: false,
-            skip: 0
+            skip: 0,
         }, options.fields);
         const childrenView = new ViewCollection(viewFields, options.expandState || EXPANDED_STATE, options.editState || NOT_EDITED_STATE, options.selectionState || UNSELECTED_STATE);
         if (options.loaded) {
@@ -316,20 +318,28 @@ export class ViewCollection {
         }
         return this._data;
     }
-    get length() { return this.data.length; }
-    get first() { return this.data[0]; }
+    get length() {
+        return this.data.length;
+    }
+    get first() {
+        return this.data[0];
+    }
     get firstItem() {
-        return this.find(item => item.type === 'data');
+        return this.find((item) => item.type === 'data');
+    }
+    get last() {
+        return this.data[this.data.length - 1];
     }
-    get last() { return this.data[this.data.length - 1]; }
     at(index) {
         return this.data[index];
     }
     itemIndex(item) {
         const idGetter = this.fieldAccessor().idGetter;
-        return this.data.findIndex(i => i.id === idGetter(item));
+        return this.data.findIndex((i) => i.id === idGetter(item));
+    }
+    map(fn) {
+        return this.data.map(fn);
     }
-    map(fn) { return this.data.map(fn); }
     filter(fn) {
         return this.data.filter(fn);
     }
@@ -348,16 +358,18 @@ export class ViewCollection {
     find(fn) {
         return this.data.find(fn);
     }
-    toString() { return this.data.toString(); }
+    toString() {
+        return this.data.toString();
+    }
     updateSelectedState() {
-        this.forEach(item => {
+        this.forEach((item) => {
             if (item.type === 'data') {
                 item.selected = this.selectionState.isRowSelected(item.data);
             }
         });
     }
     updateEditedState() {
-        this.forEach(item => {
+        this.forEach((item) => {
             if (item.type === 'data') {
                 item.editContext = this.editState.context(item.data);
             }
@@ -390,7 +402,7 @@ export class ViewCollection {
     loadData() {
         const itemFactory = new ViewItemFactory(this.expandState, this.editState, this.selectionState, this.loaded, this.fieldAccessor);
         let result = itemFactory.generate();
-        if (!result.loading && result.total && (!result.items.length || !result.items.some(i => i.type === 'data'))) {
+        if (!result.loading && result.total && (!result.items.length || !result.items.some((i) => i.type === 'data'))) {
             this.resetPage.emit();
             result = new ViewItemFactory(this.expandState, this.editState, this.selectionState, this.loaded, this.fieldAccessor).generate();
         }
@@ -404,9 +416,10 @@ export class ViewCollection {
             if (!this.childrenSubscription) {
                 this.childrenSubscription = new Subscription();
             }
-            result.observables.forEach(o => {
+            result.observables.forEach((o) => {
                 this.loaded.set(o.parentId, LOADING);
-                this.childrenSubscription.add(o.observable.subscribe(children => {
+                this.childrenSubscription.add(o.observable.subscribe((children) => {
+                    // handle error, might show reload icon
                     this.clear();
                     this.loaded.set(o.parentId, children);
                     this.childrenLoaded.emit();

package/esm2020/editing/add-command.directive.mjs

@@ -57,7 +57,7 @@ AddCommandDirective.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ve
         </span>
         <span *ngIf="iconClass" class="k-button-icon" [ngClass]="iconClass"></span>
         <span class="k-button-text"><ng-content></ng-content></span>
-    `, isInline: true, components: [{ type: i3.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass"], exportAs: ["kendoIconWrapper"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
+    `, isInline: true, components: [{ type: i3.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: AddCommandDirective, decorators: [{
             type: Component,
             args: [{

package/esm2020/editing/base-command.directive.mjs

@@ -55,7 +55,7 @@ BaseCommandDirective.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", v
         </span>
         <span *ngIf="iconClass" class="k-button-icon" [ngClass]="iconClass"></span>
         <span class="k-button-text"><ng-content></ng-content></span>
-    `, isInline: true, components: [{ type: i3.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass"], exportAs: ["kendoIconWrapper"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
+    `, isInline: true, components: [{ type: i3.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BaseCommandDirective, decorators: [{
             type: Component,
             args: [{

package/esm2020/editing/cancel-command.directive.mjs

@@ -57,7 +57,7 @@ CancelCommandDirective.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0",
         </span>
         <span *ngIf="iconClass" class="k-button-icon" [ngClass]="iconClass"></span>
         <span class="k-button-text"><ng-content></ng-content></span>
-    `, isInline: true, components: [{ type: i3.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass"], exportAs: ["kendoIconWrapper"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
+    `, isInline: true, components: [{ type: i3.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: CancelCommandDirective, decorators: [{
             type: Component,
             args: [{

package/esm2020/editing/edit-command.directive.mjs

@@ -57,7 +57,7 @@ EditCommandDirective.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", v
         </span>
         <span *ngIf="iconClass" class="k-button-icon" [ngClass]="iconClass"></span>
         <span class="k-button-text"><ng-content></ng-content></span>
-    `, isInline: true, components: [{ type: i3.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass"], exportAs: ["kendoIconWrapper"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
+    `, isInline: true, components: [{ type: i3.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: EditCommandDirective, decorators: [{
             type: Component,
             args: [{

package/esm2020/editing/remove-command.directive.mjs

@@ -56,7 +56,7 @@ RemoveCommandDirective.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0",
         </span>
         <span *ngIf="iconClass" class="k-button-icon" [ngClass]="iconClass"></span>
         <span class="k-button-text"><ng-content></ng-content></span>
-    `, isInline: true, components: [{ type: i3.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass"], exportAs: ["kendoIconWrapper"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
+    `, isInline: true, components: [{ type: i3.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: RemoveCommandDirective, decorators: [{
             type: Component,
             args: [{

package/esm2020/editing/save-command.directive.mjs

@@ -56,7 +56,7 @@ SaveCommandDirective.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", v
         </span>
         <span *ngIf="iconClass" class="k-button-icon" [ngClass]="iconClass"></span>
         <span class="k-button-text"><ng-content></ng-content></span>
-    `, isInline: true, components: [{ type: i3.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass"], exportAs: ["kendoIconWrapper"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
+    `, isInline: true, components: [{ type: i3.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: SaveCommandDirective, decorators: [{
             type: Component,
             args: [{

package/esm2020/excel/excel-command.directive.mjs

@@ -61,7 +61,7 @@ ExcelCommandDirective.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0",
         </span>
         <span *ngIf="iconClass" class="k-button-icon" [ngClass]="iconClass"></span>
         <span class="k-button-text"><ng-content></ng-content></span>
-    `, isInline: true, components: [{ type: i3.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass"], exportAs: ["kendoIconWrapper"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
+    `, isInline: true, components: [{ type: i3.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: ExcelCommandDirective, decorators: [{
             type: Component,
             args: [{

package/esm2020/filtering/menu/filter-menu.component.mjs

@@ -60,7 +60,7 @@ FilterMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ve
                 >
             </kendo-treelist-filter-menu-container>
         </ng-template>
-    `, isInline: true, components: [{ type: i4.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass"], exportAs: ["kendoIconWrapper"] }, { type: i5.FilterMenuContainerComponent, selector: "kendo-treelist-filter-menu-container", inputs: ["column", "filter", "actionsClass"], outputs: ["close"] }] });
+    `, isInline: true, components: [{ type: i4.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { type: i5.FilterMenuContainerComponent, selector: "kendo-treelist-filter-menu-container", inputs: ["column", "filter", "actionsClass"], outputs: ["close"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: FilterMenuComponent, decorators: [{
             type: Component,
             args: [{

package/esm2020/package-metadata.mjs

@@ -9,7 +9,7 @@ export const packageMetadata = {
     name: '@progress/kendo-angular-treelist',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1685016622,
-    version: '13.0.0-develop.5',
+    publishDate: 1685097058,
+    version: '13.0.0-develop.7',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
 };

package/esm2020/pager/pager-element.component.mjs

@@ -5,6 +5,7 @@
 import { ChangeDetectorRef, Directive } from '@angular/core';
 import { PagerContextService } from "./pager-context.service";
 import { LocalizationService } from '@progress/kendo-angular-l10n';
+import { caretAltLeftIcon, caretAltRightIcon, caretAltToLeftIcon, caretAltToRightIcon } from '@progress/kendo-svg-icons';
 import * as i0 from "@angular/core";
 import * as i1 from "@progress/kendo-angular-l10n";
 import * as i2 from "./pager-context.service";
@@ -20,6 +21,10 @@ export class PagerElementComponent {
         this.skip = this.pagerContext.skip;
         this.pageSize = this.pagerContext.pageSize;
         this.allCount = this.pagerContext.allCount;
+        this.caretAltLeftIcon = caretAltLeftIcon;
+        this.caretAltToLeftIcon = caretAltToLeftIcon;
+        this.caretAltRightIcon = caretAltRightIcon;
+        this.caretAltToRightIcon = caretAltToRightIcon;
     }
     /**
      * @hidden
@@ -77,6 +82,18 @@ export class PagerElementComponent {
             this.subscriptions.unsubscribe();
         }
     }
+    get prevArrowIcons() {
+        return !this.localization.rtl ? ['caret-alt-to-left', 'caret-alt-left'] : ['caret-alt-to-right', 'caret-alt-right'];
+    }
+    get prevArrowSVGIcons() {
+        return !this.localization.rtl ? [this.caretAltToLeftIcon, this.caretAltLeftIcon] : [this.caretAltToRightIcon, this.caretAltRightIcon];
+    }
+    get nextArrowIcons() {
+        return !this.localization.rtl ? ['caret-alt-right', 'caret-alt-to-right'] : ['caret-alt-left', 'caret-alt-to-left'];
+    }
+    get nextArrowSVGIcons() {
+        return !this.localization.rtl ? [this.caretAltRightIcon, this.caretAltToRightIcon] : [this.caretAltLeftIcon, this.caretAltToLeftIcon];
+    }
 }
 PagerElementComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: PagerElementComponent, deps: [{ token: i1.LocalizationService }, { token: i2.PagerContextService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive });
 PagerElementComponent.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.12", type: PagerElementComponent, ngImport: i0 });

package/esm2020/pager/pager-next-buttons.component.mjs

@@ -7,7 +7,6 @@ import { Component, ChangeDetectionStrategy, ChangeDetectorRef, Input } from '@a
 import { PagerContextService } from "./pager-context.service";
 import { PagerElementComponent } from './pager-element.component';
 import { LocalizationService } from '@progress/kendo-angular-l10n';
-import { caretAltRightIcon, caretAltToRightIcon } from '@progress/kendo-svg-icons';
 import { NavigationService } from '../navigation/navigation.service';
 import * as i0 from "@angular/core";
 import * as i1 from "@progress/kendo-angular-l10n";
@@ -22,8 +21,6 @@ export class PagerNextButtonsComponent extends PagerElementComponent {
     constructor(localization, pagerContext, cd, navigationService) {
         super(localization, pagerContext, cd);
         this.navigationService = navigationService;
-        this.caretAltRightIcon = caretAltRightIcon;
-        this.caretAltToRightIcon = caretAltToRightIcon;
     }
     /**
      * @hidden
@@ -58,8 +55,8 @@ PagerNextButtonsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.
             type="button"
             kendoTreeListFocusable
             [enabled]="!disabled"
-            icon="caret-alt-right"
-            [svgIcon]="caretAltRightIcon"
+            [icon]="nextArrowIcons[0]"
+            [svgIcon]="nextArrowSVGIcons[0]"
             fillMode="flat"
             rounded="none"
             class="k-pager-nav"
@@ -73,8 +70,8 @@ PagerNextButtonsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.
             type="button"
             kendoTreeListFocusable
             [enabled]="!disabled"
-            icon="caret-alt-to-right"
-            [svgIcon]="caretAltToRightIcon"
+            [icon]="nextArrowIcons[1]"
+            [svgIcon]="nextArrowSVGIcons[1]"
             fillMode="flat"
             rounded="none"
             class="k-pager-nav k-pager-last"
@@ -95,8 +92,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
             type="button"
             kendoTreeListFocusable
             [enabled]="!disabled"
-            icon="caret-alt-right"
-            [svgIcon]="caretAltRightIcon"
+            [icon]="nextArrowIcons[0]"
+            [svgIcon]="nextArrowSVGIcons[0]"
             fillMode="flat"
             rounded="none"
             class="k-pager-nav"
@@ -110,8 +107,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
             type="button"
             kendoTreeListFocusable
             [enabled]="!disabled"
-            icon="caret-alt-to-right"
-            [svgIcon]="caretAltToRightIcon"
+            [icon]="nextArrowIcons[1]"
+            [svgIcon]="nextArrowSVGIcons[1]"
             fillMode="flat"
             rounded="none"
             class="k-pager-nav k-pager-last"

package/esm2020/pager/pager-page-sizes.component.mjs

@@ -105,7 +105,7 @@ PagerPageSizesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0"
             [attr.aria-label]="textFor('pagerItemsPerPage')"
             (valueChange)="pageSizeChange($event)"></kendo-dropdownlist>
         <kendo-label [for]="dropdownlist" [text]="textFor('pagerItemsPerPage')"></kendo-label>
-    `, isInline: true, components: [{ type: i3.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["iconClass", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "title", "subtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }, { type: i4.LabelComponent, selector: "kendo-label", inputs: ["text", "for", "optional"], exportAs: ["kendoLabel"] }], directives: [{ type: i5.FocusableDirective, selector: "[kendoTreeListFocusable],\n        [kendoTreeListAddCommand],\n        [kendoTreeListEditCommand],\n        [kendoTreeListRemoveCommand],\n        [kendoTreeListSaveCommand],\n        [kendoTreeListCancelCommand]\n    ", inputs: ["kendoTreeListFocusable", "enabled", "kendoTreeListAddCommand", "kendoTreeListEditCommand", "kendoTreeListRemoveCommand", "kendoTreeListSaveCommand", "kendoTreeListCancelCommand"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    `, isInline: true, components: [{ type: i3.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["iconClass", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "title", "subtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }, { type: i4.LabelComponent, selector: "kendo-label", inputs: ["text", "for", "optional", "labelCssStyle", "labelCssClass"], exportAs: ["kendoLabel"] }], directives: [{ type: i5.FocusableDirective, selector: "[kendoTreeListFocusable],\n        [kendoTreeListAddCommand],\n        [kendoTreeListEditCommand],\n        [kendoTreeListRemoveCommand],\n        [kendoTreeListSaveCommand],\n        [kendoTreeListCancelCommand]\n    ", inputs: ["kendoTreeListFocusable", "enabled", "kendoTreeListAddCommand", "kendoTreeListEditCommand", "kendoTreeListRemoveCommand", "kendoTreeListSaveCommand", "kendoTreeListCancelCommand"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: PagerPageSizesComponent, decorators: [{
             type: Component,
             args: [{