@progress/kendo-angular-treelist 14.0.0-develop.3 → 14.0.0-develop.4

package/esm2020/dragdrop/drag-hint.service.mjs

@@ -12,7 +12,7 @@ import * as i0 from "@angular/core";
 import * as i1 from "@angular/platform-browser";
 import * as i2 from "@progress/kendo-angular-icons";
 const updateClass = (element, valid, svg) => {
-    const icon = element.querySelector('.k-icon, .k-svg-icon');
+    const icon = element.querySelector('.k-icon');
     if (svg) {
         const svg = icon.firstElementChild;
         svg.removeChild(svg.firstElementChild);
@@ -22,7 +22,7 @@ const updateClass = (element, valid, svg) => {
     icon.setAttribute('class', icon.getAttribute('class').replace(/(plus|cancel)/, valid ? 'plus' : 'cancel'));
 };
 const updateLock = (element, locked = null, svg) => {
-    const icon = element.querySelectorAll('.k-icon, .k-svg-icon')[1];
+    const icon = element.querySelectorAll('.k-icon')[1];
     const value = locked === null ? '' : (locked ? `k${svg ? '-svg' : ''}-i-lock` : `k${svg ? '-svg' : ''}-i-unlock`);
     if (svg) {
         icon.setAttribute('class', icon.getAttribute('class').replace(/(k-svg-i-unlock|k-svg-i-lock)/, '').trim() + ` ${value}`);
@@ -38,7 +38,7 @@ const decorate = (element) => {
     element.style.zIndex = '20000';
 };
 const svgIconsMarkup = (viewBox, content, safeTitle) => `
-    <span class="k-svg-icon k-drag-status k-svg-i-cancel">
+    <span class="k-icon k-svg-icon k-drag-status k-svg-i-cancel">
         <svg 
             xmlns="http://www.w3.org/2000/svg"
             xmlns:xlink="http://www.w3.org/1999/xlink"
@@ -46,7 +46,7 @@ const svgIconsMarkup = (viewBox, content, safeTitle) => `
             aria-hidden="true">
             ${content}
         </svg>
-        <span class="k-svg-icon k-icon-modifier">
+        <span class="k-icon k-svg-icon k-icon-modifier">
             <svg
                 xmlns="http://www.w3.org/2000/svg"
                 xmlns:xlink="http://www.w3.org/1999/xlink"
@@ -57,8 +57,8 @@ const svgIconsMarkup = (viewBox, content, safeTitle) => `
     </span>
     ${safeTitle}`;
 const fontIconsMarkup = (safeTitle) => `
-    <span class="k-icon k-drag-status k-i-cancel">
-        <span class="k-icon k-icon-modifier"></span>
+    <span class="k-icon k-font-icon k-drag-status k-i-cancel">
+        <span class="k-icon k-font-icon k-icon-modifier"></span>
     </span>
     ${safeTitle}`;
 /**

package/esm2020/filtering/cell/boolean-filter-cell.component.mjs

@@ -72,7 +72,7 @@ BooleanFilterCellComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0
                 [value]="currentFilter?.value">
             </kendo-dropdownlist>
         </kendo-treelist-filter-wrapper-cell>
-    `, isInline: true, components: [{ type: i3.FilterCellWrapperComponent, selector: "kendo-treelist-filter-wrapper-cell", inputs: ["showOperators"] }, { type: i4.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["showStickyHeader", "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", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }], directives: [{ type: i5.FilterInputDirective, selector: "[kendoFilterInput]", inputs: ["filterDelay", "columnLabel", "column", "value"] }] });
+    `, isInline: true, components: [{ type: i3.FilterCellWrapperComponent, selector: "kendo-treelist-filter-wrapper-cell", inputs: ["showOperators"] }, { type: i4.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "title", "subtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }], directives: [{ type: i5.FilterInputDirective, selector: "[kendoFilterInput]", inputs: ["filterDelay", "columnLabel", "column", "value"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BooleanFilterCellComponent, decorators: [{
             type: Component,
             args: [{

package/esm2020/filtering/cell/filter-cell-operators.component.mjs

@@ -6,7 +6,7 @@ import { Component, EventEmitter, HostBinding, Input, Output, ViewChild } from '
 import { Keys } from '@progress/kendo-angular-common';
 import { DropDownListComponent } from '@progress/kendo-angular-dropdowns';
 import { LocalizationService } from '@progress/kendo-angular-l10n';
-import { filterClearIcon } from '@progress/kendo-svg-icons';
+import { filterClearIcon, filterIcon } from '@progress/kendo-svg-icons';
 import { replaceMessagePlaceholder } from '../../utils';
 import { ColumnComponent } from '../../columns/column.component';
 import * as i0 from "@angular/core";
@@ -37,6 +37,10 @@ export class FilterCellOperatorsComponent {
         this.localization = localization;
         this.clearText = 'Clear';
         this.filterClearIcon = filterClearIcon;
+        /**
+         * @hidden
+         */
+        this.filterSVGIcon = filterIcon;
         /**
          * The filter operators that will be displayed.
          */
@@ -131,7 +135,8 @@ FilterCellOperatorsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12
             (valueChange)="onChange($event)"
             [value]="value"
             [attr.aria-label]="column && columnLabel"
-            iconClass="k-i-filter"
+            icon="filter"
+            [svgIcon]="filterSVGIcon"
             [valuePrimitive]="true"
             textField="text"
             [popupSettings]="{ width: 'auto' }"
@@ -148,7 +153,7 @@ FilterCellOperatorsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12
             (click)="clearClick()"
             (keydown)="clearKeydown($event)">
         </button>
-    `, isInline: true, components: [{ type: i2.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["showStickyHeader", "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", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }, { type: i3.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"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.FocusableDirective, selector: "[kendoTreeListFocusable],\n        [kendoTreeListAddCommand],\n        [kendoTreeListEditCommand],\n        [kendoTreeListRemoveCommand],\n        [kendoTreeListSaveCommand],\n        [kendoTreeListCancelCommand]\n    ", inputs: ["kendoTreeListFocusable", "enabled", "kendoTreeListAddCommand", "kendoTreeListEditCommand", "kendoTreeListRemoveCommand", "kendoTreeListSaveCommand", "kendoTreeListCancelCommand"] }] });
+    `, isInline: true, components: [{ type: i2.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "title", "subtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }, { type: i3.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"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.FocusableDirective, selector: "[kendoTreeListFocusable],\n        [kendoTreeListAddCommand],\n        [kendoTreeListEditCommand],\n        [kendoTreeListRemoveCommand],\n        [kendoTreeListSaveCommand],\n        [kendoTreeListCancelCommand]\n    ", inputs: ["kendoTreeListFocusable", "enabled", "kendoTreeListAddCommand", "kendoTreeListEditCommand", "kendoTreeListRemoveCommand", "kendoTreeListSaveCommand", "kendoTreeListCancelCommand"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: FilterCellOperatorsComponent, decorators: [{
             type: Component,
             args: [{
@@ -163,7 +168,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
             (valueChange)="onChange($event)"
             [value]="value"
             [attr.aria-label]="column && columnLabel"
-            iconClass="k-i-filter"
+            icon="filter"
+            [svgIcon]="filterSVGIcon"
             [valuePrimitive]="true"
             textField="text"
             [popupSettings]="{ width: 'auto' }"

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

@@ -111,7 +111,7 @@ DateFilterMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0"
             [weekNumber]="weekNumber"
             >
         </kendo-treelist-date-filter-menu-input>
-    `, isInline: true, components: [{ type: i2.DateFilterMenuInputComponent, selector: "kendo-treelist-date-filter-menu-input", inputs: ["operators", "column", "filter", "operator", "currentFilter", "filterService", "format", "formatPlaceholder", "placeholder", "min", "max", "activeView", "bottomView", "topView", "weekNumber"] }, { type: i3.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["showStickyHeader", "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", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    `, isInline: true, components: [{ type: i2.DateFilterMenuInputComponent, selector: "kendo-treelist-date-filter-menu-input", inputs: ["operators", "column", "filter", "operator", "currentFilter", "filterService", "format", "formatPlaceholder", "placeholder", "min", "max", "activeView", "bottomView", "topView", "weekNumber"] }, { type: i3.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "title", "subtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: DateFilterMenuComponent, decorators: [{
             type: Component,
             args: [{

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

@@ -65,7 +65,7 @@ FilterMenuInputWrapperComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion:
             valueField="value">
         </kendo-dropdownlist>
         <ng-content></ng-content>
-    `, isInline: true, components: [{ type: i1.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["showStickyHeader", "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", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }] });
+    `, isInline: true, components: [{ type: i1.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "title", "subtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: FilterMenuInputWrapperComponent, decorators: [{
             type: Component,
             args: [{

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

@@ -105,7 +105,7 @@ NumericFilterMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0
             [step]="step"
             >
         </kendo-treelist-numeric-filter-menu-input>
-    `, isInline: true, components: [{ type: i2.NumericFilterMenuInputComponent, selector: "kendo-treelist-numeric-filter-menu-input", inputs: ["operators", "column", "filter", "operator", "currentFilter", "filterService", "step", "min", "max", "spinners", "decimals", "format"] }, { type: i3.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["showStickyHeader", "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", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    `, isInline: true, components: [{ type: i2.NumericFilterMenuInputComponent, selector: "kendo-treelist-numeric-filter-menu-input", inputs: ["operators", "column", "filter", "operator", "currentFilter", "filterService", "step", "min", "max", "spinners", "decimals", "format"] }, { type: i3.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "title", "subtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: NumericFilterMenuComponent, decorators: [{
             type: Component,
             args: [{

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

@@ -92,7 +92,7 @@ StringFilterMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.
             [column]="column"
             [filter]="filter">
         </kendo-treelist-string-filter-menu-input>
-    `, isInline: true, components: [{ type: i2.StringFilterMenuInputComponent, selector: "kendo-treelist-string-filter-menu-input", inputs: ["operators", "column", "filter", "operator", "currentFilter", "filterService"] }, { type: i3.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["showStickyHeader", "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", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    `, isInline: true, components: [{ type: i2.StringFilterMenuInputComponent, selector: "kendo-treelist-string-filter-menu-input", inputs: ["operators", "column", "filter", "operator", "currentFilter", "filterService"] }, { type: i3.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "title", "subtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: StringFilterMenuComponent, 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: 1696001548,
-    version: '14.0.0-develop.3',
+    publishDate: 1696225160,
+    version: '14.0.0-develop.4',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
 };

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: ["showStickyHeader", "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", "leftRightArrowsNavigation", "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 });
+    `, isInline: true, components: [{ type: i3.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "title", "subtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "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: [{

package/esm2020/rendering/cell.component.mjs

@@ -37,6 +37,11 @@ export class CellComponent {
         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 = {};
@@ -149,8 +154,8 @@ CellComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version:
         <ng-container [ngSwitch]="isEdited">
             <ng-container *ngSwitchCase="false">
                 <ng-container *ngIf="column.expandable">
-                    <span class="k-icon k-i-none" *ngFor="let item of level | levelItems : hasChildren && expandIcons"></span>
-                    <kendo-icon-wrapper
+                    <kendo-icon-wrapper name="none" innerCssClass="k-treelist-toggle" [svgIcon]="noneIcon" *ngFor="let item of level | levelItems : hasChildren && expandIcons"></kendo-icon-wrapper>
+                    <kendo-icon-wrapper innerCssClass="k-treelist-toggle"
                         aria-hidden="true"
                         *ngIf="hasChildren && expandIcons && !loading"
                         [name]="arrowIcon"
@@ -230,8 +235,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         <ng-container [ngSwitch]="isEdited">
             <ng-container *ngSwitchCase="false">
                 <ng-container *ngIf="column.expandable">
-                    <span class="k-icon k-i-none" *ngFor="let item of level | levelItems : hasChildren && expandIcons"></span>
-                    <kendo-icon-wrapper
+                    <kendo-icon-wrapper name="none" innerCssClass="k-treelist-toggle" [svgIcon]="noneIcon" *ngFor="let item of level | levelItems : hasChildren && expandIcons"></kendo-icon-wrapper>
+                    <kendo-icon-wrapper innerCssClass="k-treelist-toggle"
                         aria-hidden="true"
                         *ngIf="hasChildren && expandIcons && !loading"
                         [name]="arrowIcon"

package/esm2020/rendering/constants.mjs

@@ -13,7 +13,7 @@ export const NON_DATA_ROW_CLASSES = 'k-grouping-row k-group-footer k-detail-row
 /**
  * @hidden
  */
-export const EMPTY_ICON_CLASS = 'k-i-none';
+export const EMPTY_ICON_CLASS = 'k-i-none k-svg-i-none';
 /**
  * @hidden
  */

package/esm2020/rendering/table-body.component.mjs

@@ -30,10 +30,11 @@ import * as i6 from "../navigation/navigation.service";
 import * as i7 from "../expand-state/expand-state.service";
 import * as i8 from "../selection/selection.service";
 import * as i9 from "./cell.component";
-import * as i10 from "@angular/common";
-import * as i11 from "../navigation/logical-row.directive";
-import * as i12 from "../navigation/logical-cell.directive";
-import * as i13 from "./common/level-items.pipe";
+import * as i10 from "@progress/kendo-angular-icons";
+import * as i11 from "@angular/common";
+import * as i12 from "../navigation/logical-row.directive";
+import * as i13 from "../navigation/logical-cell.directive";
+import * as i14 from "./common/level-items.pipe";
 const columnCellIndex = (cell, cells) => {
     for (let idx = 0; idx < cells.length; idx++) {
         if (cells[idx] === cell) {
@@ -65,6 +66,11 @@ export class TableBodyComponent {
         this.lockedColumnsCount = 0;
         this.totalColumnsCount = 0;
         this.trackBy = defaultTrackBy;
+        this.noneIcon = {
+            name: 'none',
+            content: '',
+            viewBox: '0 0 24 24'
+        };
         this.rowClass = () => null;
         this.cellKeydownSubscription = this.navigationService.cellKeydown.subscribe((args) => this.cellKeydownHandler(args));
         this.trackByWrapper = this.trackByWrapper.bind(this);
@@ -309,7 +315,7 @@ export class TableBodyComponent {
         return {};
     }
     expandClick(eventArg, row) {
-        if (eventArg.type === 'click' && eventArg.target.closest('.k-icon-wrapper-host')) {
+        if (eventArg.type === 'click' && !hasClasses(eventArg.target, EMPTY_ICON_CLASS) && eventArg.target.closest('.k-icon-wrapper-host')) {
             eventArg.preventDefault();
             const viewItem = this.rowItem(row);
             if (viewItem.type === 'data') {
@@ -421,7 +427,7 @@ TableBodyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ver
                 [ngStyle]="column.footerStyle"
                 *ngFor="let column of footerColumns; let columnIndex = index; trackBy: trackByColumns;">
                 <ng-container *ngIf="$any(column).expandable">
-                    <span class="k-icon k-i-none" *ngFor="let item of item.level | levelItems"></span>
+                    <kendo-icon-wrapper name="none" innerCssClass="k-treelist-toggle" [svgIcon]="noneIcon" *ngFor="let item of item.level | levelItems"></kendo-icon-wrapper>
                 </ng-container>
                 <ng-container [ngTemplateOutlet]="column.footerTemplateRef"
                     [ngTemplateOutletContext]="{
@@ -437,7 +443,7 @@ TableBodyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ver
            </td>
         </tr>
     </ng-container>
-    `, isInline: true, components: [{ type: i9.CellComponent, selector: "[kendoTreeListCell]", inputs: ["column", "columnIndex", "isNew", "level", "hasChildren", "isExpanded", "loading", "expandIcons", "selected", "dataItem", "viewItem"] }], directives: [{ type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i10.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i10.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i11.LogicalRowDirective, selector: "[kendoTreeListLogicalRow]", inputs: ["logicalRowIndex", "logicalSlaveRow", "logicalCellsCount", "logicalSlaveCellsCount", "dataRowIndex", "dataItem", "isNew", "totalColumns"] }, { type: i10.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i12.LogicalCellDirective, selector: "[kendoTreeListLogicalCell]", inputs: ["logicalColIndex", "logicalRowIndex", "logicalSlaveCell", "column", "colIndex", "colSpan", "rowSpan", "dataRowIndex", "dataItem", "expandable"] }, { type: i10.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], pipes: { "levelItems": i13.LevelItemsPipe } });
+    `, isInline: true, components: [{ type: i9.CellComponent, selector: "[kendoTreeListCell]", inputs: ["column", "columnIndex", "isNew", "level", "hasChildren", "isExpanded", "loading", "expandIcons", "selected", "dataItem", "viewItem"] }, { type: i10.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }], directives: [{ type: i11.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i11.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i11.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i12.LogicalRowDirective, selector: "[kendoTreeListLogicalRow]", inputs: ["logicalRowIndex", "logicalSlaveRow", "logicalCellsCount", "logicalSlaveCellsCount", "dataRowIndex", "dataItem", "isNew", "totalColumns"] }, { type: i11.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i13.LogicalCellDirective, selector: "[kendoTreeListLogicalCell]", inputs: ["logicalColIndex", "logicalRowIndex", "logicalSlaveCell", "column", "colIndex", "colSpan", "rowSpan", "dataRowIndex", "dataItem", "expandable"] }, { type: i11.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], pipes: { "levelItems": i14.LevelItemsPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: TableBodyComponent, decorators: [{
             type: Component,
             args: [{
@@ -524,7 +530,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
                 [ngStyle]="column.footerStyle"
                 *ngFor="let column of footerColumns; let columnIndex = index; trackBy: trackByColumns;">
                 <ng-container *ngIf="$any(column).expandable">
-                    <span class="k-icon k-i-none" *ngFor="let item of item.level | levelItems"></span>
+                    <kendo-icon-wrapper name="none" innerCssClass="k-treelist-toggle" [svgIcon]="noneIcon" *ngFor="let item of item.level | levelItems"></kendo-icon-wrapper>
                 </ng-container>
                 <ng-container [ngTemplateOutlet]="column.footerTemplateRef"
                     [ngTemplateOutletContext]="{

package/fesm2015/progress-kendo-angular-treelist.mjs

@@ -48,8 +48,8 @@ const packageMetadata = {
     name: '@progress/kendo-angular-treelist',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1696001548,
-    version: '14.0.0-develop.3',
+    publishDate: 1696225160,
+    version: '14.0.0-develop.4',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
 };
 
@@ -3054,7 +3054,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         }] });
 
 const updateClass = (element, valid, svg) => {
-    const icon = element.querySelector('.k-icon, .k-svg-icon');
+    const icon = element.querySelector('.k-icon');
     if (svg) {
         const svg = icon.firstElementChild;
         svg.removeChild(svg.firstElementChild);
@@ -3064,7 +3064,7 @@ const updateClass = (element, valid, svg) => {
     icon.setAttribute('class', icon.getAttribute('class').replace(/(plus|cancel)/, valid ? 'plus' : 'cancel'));
 };
 const updateLock = (element, locked = null, svg) => {
-    const icon = element.querySelectorAll('.k-icon, .k-svg-icon')[1];
+    const icon = element.querySelectorAll('.k-icon')[1];
     const value = locked === null ? '' : (locked ? `k${svg ? '-svg' : ''}-i-lock` : `k${svg ? '-svg' : ''}-i-unlock`);
     if (svg) {
         icon.setAttribute('class', icon.getAttribute('class').replace(/(k-svg-i-unlock|k-svg-i-lock)/, '').trim() + ` ${value}`);
@@ -3080,7 +3080,7 @@ const decorate = (element) => {
     element.style.zIndex = '20000';
 };
 const svgIconsMarkup = (viewBox, content, safeTitle) => `
-    <span class="k-svg-icon k-drag-status k-svg-i-cancel">
+    <span class="k-icon k-svg-icon k-drag-status k-svg-i-cancel">
         <svg 
             xmlns="http://www.w3.org/2000/svg"
             xmlns:xlink="http://www.w3.org/1999/xlink"
@@ -3088,7 +3088,7 @@ const svgIconsMarkup = (viewBox, content, safeTitle) => `
             aria-hidden="true">
             ${content}
         </svg>
-        <span class="k-svg-icon k-icon-modifier">
+        <span class="k-icon k-svg-icon k-icon-modifier">
             <svg
                 xmlns="http://www.w3.org/2000/svg"
                 xmlns:xlink="http://www.w3.org/1999/xlink"
@@ -3099,8 +3099,8 @@ const svgIconsMarkup = (viewBox, content, safeTitle) => `
     </span>
     ${safeTitle}`;
 const fontIconsMarkup = (safeTitle) => `
-    <span class="k-icon k-drag-status k-i-cancel">
-        <span class="k-icon k-icon-modifier"></span>
+    <span class="k-icon k-font-icon k-drag-status k-i-cancel">
+        <span class="k-icon k-font-icon k-icon-modifier"></span>
     </span>
     ${safeTitle}`;
 /**
@@ -6340,7 +6340,7 @@ FilterMenuInputWrapperComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion:
             valueField="value">
         </kendo-dropdownlist>
         <ng-content></ng-content>
-    `, isInline: true, components: [{ type: i3$1.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["showStickyHeader", "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", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }] });
+    `, isInline: true, components: [{ type: i3$1.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "title", "subtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: FilterMenuInputWrapperComponent, decorators: [{
             type: Component,
             args: [{
@@ -6510,7 +6510,7 @@ StringFilterMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.
             [column]="column"
             [filter]="filter">
         </kendo-treelist-string-filter-menu-input>
-    `, isInline: true, components: [{ type: StringFilterMenuInputComponent, selector: "kendo-treelist-string-filter-menu-input", inputs: ["operators", "column", "filter", "operator", "currentFilter", "filterService"] }, { type: i3$1.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["showStickyHeader", "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", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    `, isInline: true, components: [{ type: StringFilterMenuInputComponent, selector: "kendo-treelist-string-filter-menu-input", inputs: ["operators", "column", "filter", "operator", "currentFilter", "filterService"] }, { type: i3$1.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "title", "subtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: StringFilterMenuComponent, decorators: [{
             type: Component,
             args: [{
@@ -6858,7 +6858,7 @@ NumericFilterMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0
             [step]="step"
             >
         </kendo-treelist-numeric-filter-menu-input>
-    `, isInline: true, components: [{ type: NumericFilterMenuInputComponent, selector: "kendo-treelist-numeric-filter-menu-input", inputs: ["operators", "column", "filter", "operator", "currentFilter", "filterService", "step", "min", "max", "spinners", "decimals", "format"] }, { type: i3$1.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["showStickyHeader", "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", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    `, isInline: true, components: [{ type: NumericFilterMenuInputComponent, selector: "kendo-treelist-numeric-filter-menu-input", inputs: ["operators", "column", "filter", "operator", "currentFilter", "filterService", "step", "min", "max", "spinners", "decimals", "format"] }, { type: i3$1.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "title", "subtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: NumericFilterMenuComponent, decorators: [{
             type: Component,
             args: [{
@@ -7262,7 +7262,7 @@ DateFilterMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0"
             [weekNumber]="weekNumber"
             >
         </kendo-treelist-date-filter-menu-input>
-    `, isInline: true, components: [{ type: DateFilterMenuInputComponent, selector: "kendo-treelist-date-filter-menu-input", inputs: ["operators", "column", "filter", "operator", "currentFilter", "filterService", "format", "formatPlaceholder", "placeholder", "min", "max", "activeView", "bottomView", "topView", "weekNumber"] }, { type: i3$1.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["showStickyHeader", "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", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    `, isInline: true, components: [{ type: DateFilterMenuInputComponent, selector: "kendo-treelist-date-filter-menu-input", inputs: ["operators", "column", "filter", "operator", "currentFilter", "filterService", "format", "formatPlaceholder", "placeholder", "min", "max", "activeView", "bottomView", "topView", "weekNumber"] }, { type: i3$1.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "title", "subtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: DateFilterMenuComponent, decorators: [{
             type: Component,
             args: [{
@@ -8884,6 +8884,10 @@ class FilterCellOperatorsComponent {
         this.localization = localization;
         this.clearText = 'Clear';
         this.filterClearIcon = filterClearIcon;
+        /**
+         * @hidden
+         */
+        this.filterSVGIcon = filterIcon;
         /**
          * The filter operators that will be displayed.
          */
@@ -8978,7 +8982,8 @@ FilterCellOperatorsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12
             (valueChange)="onChange($event)"
             [value]="value"
             [attr.aria-label]="column && columnLabel"
-            iconClass="k-i-filter"
+            icon="filter"
+            [svgIcon]="filterSVGIcon"
             [valuePrimitive]="true"
             textField="text"
             [popupSettings]="{ width: 'auto' }"
@@ -8995,7 +9000,7 @@ FilterCellOperatorsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12
             (click)="clearClick()"
             (keydown)="clearKeydown($event)">
         </button>
-    `, isInline: true, components: [{ type: i3$1.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["showStickyHeader", "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", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }, { type: i4$2.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"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: FocusableDirective, selector: "[kendoTreeListFocusable],\n        [kendoTreeListAddCommand],\n        [kendoTreeListEditCommand],\n        [kendoTreeListRemoveCommand],\n        [kendoTreeListSaveCommand],\n        [kendoTreeListCancelCommand]\n    ", inputs: ["kendoTreeListFocusable", "enabled", "kendoTreeListAddCommand", "kendoTreeListEditCommand", "kendoTreeListRemoveCommand", "kendoTreeListSaveCommand", "kendoTreeListCancelCommand"] }] });
+    `, isInline: true, components: [{ type: i3$1.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "title", "subtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }, { type: i4$2.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"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: FocusableDirective, selector: "[kendoTreeListFocusable],\n        [kendoTreeListAddCommand],\n        [kendoTreeListEditCommand],\n        [kendoTreeListRemoveCommand],\n        [kendoTreeListSaveCommand],\n        [kendoTreeListCancelCommand]\n    ", inputs: ["kendoTreeListFocusable", "enabled", "kendoTreeListAddCommand", "kendoTreeListEditCommand", "kendoTreeListRemoveCommand", "kendoTreeListSaveCommand", "kendoTreeListCancelCommand"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: FilterCellOperatorsComponent, decorators: [{
             type: Component,
             args: [{
@@ -9010,7 +9015,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
             (valueChange)="onChange($event)"
             [value]="value"
             [attr.aria-label]="column && columnLabel"
-            iconClass="k-i-filter"
+            icon="filter"
+            [svgIcon]="filterSVGIcon"
             [valuePrimitive]="true"
             textField="text"
             [popupSettings]="{ width: 'auto' }"
@@ -9359,7 +9365,7 @@ BooleanFilterCellComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0
                 [value]="currentFilter?.value">
             </kendo-dropdownlist>
         </kendo-treelist-filter-wrapper-cell>
-    `, isInline: true, components: [{ type: FilterCellWrapperComponent, selector: "kendo-treelist-filter-wrapper-cell", inputs: ["showOperators"] }, { type: i3$1.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["showStickyHeader", "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", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }], directives: [{ type: FilterInputDirective, selector: "[kendoFilterInput]", inputs: ["filterDelay", "columnLabel", "column", "value"] }] });
+    `, isInline: true, components: [{ type: FilterCellWrapperComponent, selector: "kendo-treelist-filter-wrapper-cell", inputs: ["showOperators"] }, { type: i3$1.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "title", "subtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }], directives: [{ type: FilterInputDirective, selector: "[kendoFilterInput]", inputs: ["filterDelay", "columnLabel", "column", "value"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BooleanFilterCellComponent, decorators: [{
             type: Component,
             args: [{
@@ -11122,7 +11128,7 @@ const NON_DATA_ROW_CLASSES = 'k-grouping-row k-group-footer k-detail-row k-grid-
 /**
  * @hidden
  */
-const EMPTY_ICON_CLASS = 'k-i-none';
+const EMPTY_ICON_CLASS = 'k-i-none k-svg-i-none';
 /**
  * @hidden
  */
@@ -11211,6 +11217,11 @@ class CellComponent {
         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 = {};
@@ -11323,8 +11334,8 @@ CellComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version:
         <ng-container [ngSwitch]="isEdited">
             <ng-container *ngSwitchCase="false">
                 <ng-container *ngIf="column.expandable">
-                    <span class="k-icon k-i-none" *ngFor="let item of level | levelItems : hasChildren && expandIcons"></span>
-                    <kendo-icon-wrapper
+                    <kendo-icon-wrapper name="none" innerCssClass="k-treelist-toggle" [svgIcon]="noneIcon" *ngFor="let item of level | levelItems : hasChildren && expandIcons"></kendo-icon-wrapper>
+                    <kendo-icon-wrapper innerCssClass="k-treelist-toggle"
                         aria-hidden="true"
                         *ngIf="hasChildren && expandIcons && !loading"
                         [name]="arrowIcon"
@@ -11404,8 +11415,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         <ng-container [ngSwitch]="isEdited">
             <ng-container *ngSwitchCase="false">
                 <ng-container *ngIf="column.expandable">
-                    <span class="k-icon k-i-none" *ngFor="let item of level | levelItems : hasChildren && expandIcons"></span>
-                    <kendo-icon-wrapper
+                    <kendo-icon-wrapper name="none" innerCssClass="k-treelist-toggle" [svgIcon]="noneIcon" *ngFor="let item of level | levelItems : hasChildren && expandIcons"></kendo-icon-wrapper>
+                    <kendo-icon-wrapper innerCssClass="k-treelist-toggle"
                         aria-hidden="true"
                         *ngIf="hasChildren && expandIcons && !loading"
                         [name]="arrowIcon"
@@ -11551,6 +11562,11 @@ class TableBodyComponent {
         this.lockedColumnsCount = 0;
         this.totalColumnsCount = 0;
         this.trackBy = defaultTrackBy;
+        this.noneIcon = {
+            name: 'none',
+            content: '',
+            viewBox: '0 0 24 24'
+        };
         this.rowClass = () => null;
         this.cellKeydownSubscription = this.navigationService.cellKeydown.subscribe((args) => this.cellKeydownHandler(args));
         this.trackByWrapper = this.trackByWrapper.bind(this);
@@ -11795,7 +11811,7 @@ class TableBodyComponent {
         return {};
     }
     expandClick(eventArg, row) {
-        if (eventArg.type === 'click' && eventArg.target.closest('.k-icon-wrapper-host')) {
+        if (eventArg.type === 'click' && !hasClasses(eventArg.target, EMPTY_ICON_CLASS) && eventArg.target.closest('.k-icon-wrapper-host')) {
             eventArg.preventDefault();
             const viewItem = this.rowItem(row);
             if (viewItem.type === 'data') {
@@ -11907,7 +11923,7 @@ TableBodyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ver
                 [ngStyle]="column.footerStyle"
                 *ngFor="let column of footerColumns; let columnIndex = index; trackBy: trackByColumns;">
                 <ng-container *ngIf="$any(column).expandable">
-                    <span class="k-icon k-i-none" *ngFor="let item of item.level | levelItems"></span>
+                    <kendo-icon-wrapper name="none" innerCssClass="k-treelist-toggle" [svgIcon]="noneIcon" *ngFor="let item of item.level | levelItems"></kendo-icon-wrapper>
                 </ng-container>
                 <ng-container [ngTemplateOutlet]="column.footerTemplateRef"
                     [ngTemplateOutletContext]="{
@@ -11923,7 +11939,7 @@ TableBodyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ver
            </td>
         </tr>
     </ng-container>
-    `, isInline: true, components: [{ type: CellComponent, selector: "[kendoTreeListCell]", inputs: ["column", "columnIndex", "isNew", "level", "hasChildren", "isExpanded", "loading", "expandIcons", "selected", "dataItem", "viewItem"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: LogicalRowDirective, selector: "[kendoTreeListLogicalRow]", inputs: ["logicalRowIndex", "logicalSlaveRow", "logicalCellsCount", "logicalSlaveCellsCount", "dataRowIndex", "dataItem", "isNew", "totalColumns"] }, { type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: LogicalCellDirective, selector: "[kendoTreeListLogicalCell]", inputs: ["logicalColIndex", "logicalRowIndex", "logicalSlaveCell", "column", "colIndex", "colSpan", "rowSpan", "dataRowIndex", "dataItem", "expandable"] }, { type: i4.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], pipes: { "levelItems": LevelItemsPipe } });
+    `, isInline: true, components: [{ type: CellComponent, selector: "[kendoTreeListCell]", inputs: ["column", "columnIndex", "isNew", "level", "hasChildren", "isExpanded", "loading", "expandIcons", "selected", "dataItem", "viewItem"] }, { 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.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: LogicalRowDirective, selector: "[kendoTreeListLogicalRow]", inputs: ["logicalRowIndex", "logicalSlaveRow", "logicalCellsCount", "logicalSlaveCellsCount", "dataRowIndex", "dataItem", "isNew", "totalColumns"] }, { type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: LogicalCellDirective, selector: "[kendoTreeListLogicalCell]", inputs: ["logicalColIndex", "logicalRowIndex", "logicalSlaveCell", "column", "colIndex", "colSpan", "rowSpan", "dataRowIndex", "dataItem", "expandable"] }, { type: i4.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], pipes: { "levelItems": LevelItemsPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: TableBodyComponent, decorators: [{
             type: Component,
             args: [{
@@ -12010,7 +12026,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
                 [ngStyle]="column.footerStyle"
                 *ngFor="let column of footerColumns; let columnIndex = index; trackBy: trackByColumns;">
                 <ng-container *ngIf="$any(column).expandable">
-                    <span class="k-icon k-i-none" *ngFor="let item of item.level | levelItems"></span>
+                    <kendo-icon-wrapper name="none" innerCssClass="k-treelist-toggle" [svgIcon]="noneIcon" *ngFor="let item of item.level | levelItems"></kendo-icon-wrapper>
                 </ng-container>
                 <ng-container [ngTemplateOutlet]="column.footerTemplateRef"
                     [ngTemplateOutletContext]="{
@@ -13242,7 +13258,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$1.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["showStickyHeader", "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", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }, { type: i4$3.LabelComponent, selector: "kendo-label", inputs: ["text", "for", "optional", "labelCssStyle", "labelCssClass"], exportAs: ["kendoLabel"] }], directives: [{ type: 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$1.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "title", "subtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }, { type: i4$3.LabelComponent, selector: "kendo-label", inputs: ["text", "for", "optional", "labelCssStyle", "labelCssClass"], exportAs: ["kendoLabel"] }], directives: [{ type: 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: [{

package/fesm2020/progress-kendo-angular-treelist.mjs

@@ -48,8 +48,8 @@ const packageMetadata = {
     name: '@progress/kendo-angular-treelist',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1696001548,
-    version: '14.0.0-develop.3',
+    publishDate: 1696225160,
+    version: '14.0.0-develop.4',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
 };
 
@@ -3028,7 +3028,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         }] });
 
 const updateClass = (element, valid, svg) => {
-    const icon = element.querySelector('.k-icon, .k-svg-icon');
+    const icon = element.querySelector('.k-icon');
     if (svg) {
         const svg = icon.firstElementChild;
         svg.removeChild(svg.firstElementChild);
@@ -3038,7 +3038,7 @@ const updateClass = (element, valid, svg) => {
     icon.setAttribute('class', icon.getAttribute('class').replace(/(plus|cancel)/, valid ? 'plus' : 'cancel'));
 };
 const updateLock = (element, locked = null, svg) => {
-    const icon = element.querySelectorAll('.k-icon, .k-svg-icon')[1];
+    const icon = element.querySelectorAll('.k-icon')[1];
     const value = locked === null ? '' : (locked ? `k${svg ? '-svg' : ''}-i-lock` : `k${svg ? '-svg' : ''}-i-unlock`);
     if (svg) {
         icon.setAttribute('class', icon.getAttribute('class').replace(/(k-svg-i-unlock|k-svg-i-lock)/, '').trim() + ` ${value}`);
@@ -3054,7 +3054,7 @@ const decorate = (element) => {
     element.style.zIndex = '20000';
 };
 const svgIconsMarkup = (viewBox, content, safeTitle) => `
-    <span class="k-svg-icon k-drag-status k-svg-i-cancel">
+    <span class="k-icon k-svg-icon k-drag-status k-svg-i-cancel">
         <svg 
             xmlns="http://www.w3.org/2000/svg"
             xmlns:xlink="http://www.w3.org/1999/xlink"
@@ -3062,7 +3062,7 @@ const svgIconsMarkup = (viewBox, content, safeTitle) => `
             aria-hidden="true">
             ${content}
         </svg>
-        <span class="k-svg-icon k-icon-modifier">
+        <span class="k-icon k-svg-icon k-icon-modifier">
             <svg
                 xmlns="http://www.w3.org/2000/svg"
                 xmlns:xlink="http://www.w3.org/1999/xlink"
@@ -3073,8 +3073,8 @@ const svgIconsMarkup = (viewBox, content, safeTitle) => `
     </span>
     ${safeTitle}`;
 const fontIconsMarkup = (safeTitle) => `
-    <span class="k-icon k-drag-status k-i-cancel">
-        <span class="k-icon k-icon-modifier"></span>
+    <span class="k-icon k-font-icon k-drag-status k-i-cancel">
+        <span class="k-icon k-font-icon k-icon-modifier"></span>
     </span>
     ${safeTitle}`;
 /**
@@ -6300,7 +6300,7 @@ FilterMenuInputWrapperComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion:
             valueField="value">
         </kendo-dropdownlist>
         <ng-content></ng-content>
-    `, isInline: true, components: [{ type: i3$1.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["showStickyHeader", "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", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }] });
+    `, isInline: true, components: [{ type: i3$1.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "title", "subtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: FilterMenuInputWrapperComponent, decorators: [{
             type: Component,
             args: [{
@@ -6470,7 +6470,7 @@ StringFilterMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.
             [column]="column"
             [filter]="filter">
         </kendo-treelist-string-filter-menu-input>
-    `, isInline: true, components: [{ type: StringFilterMenuInputComponent, selector: "kendo-treelist-string-filter-menu-input", inputs: ["operators", "column", "filter", "operator", "currentFilter", "filterService"] }, { type: i3$1.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["showStickyHeader", "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", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    `, isInline: true, components: [{ type: StringFilterMenuInputComponent, selector: "kendo-treelist-string-filter-menu-input", inputs: ["operators", "column", "filter", "operator", "currentFilter", "filterService"] }, { type: i3$1.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "title", "subtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: StringFilterMenuComponent, decorators: [{
             type: Component,
             args: [{
@@ -6818,7 +6818,7 @@ NumericFilterMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0
             [step]="step"
             >
         </kendo-treelist-numeric-filter-menu-input>
-    `, isInline: true, components: [{ type: NumericFilterMenuInputComponent, selector: "kendo-treelist-numeric-filter-menu-input", inputs: ["operators", "column", "filter", "operator", "currentFilter", "filterService", "step", "min", "max", "spinners", "decimals", "format"] }, { type: i3$1.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["showStickyHeader", "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", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    `, isInline: true, components: [{ type: NumericFilterMenuInputComponent, selector: "kendo-treelist-numeric-filter-menu-input", inputs: ["operators", "column", "filter", "operator", "currentFilter", "filterService", "step", "min", "max", "spinners", "decimals", "format"] }, { type: i3$1.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "title", "subtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: NumericFilterMenuComponent, decorators: [{
             type: Component,
             args: [{
@@ -7222,7 +7222,7 @@ DateFilterMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0"
             [weekNumber]="weekNumber"
             >
         </kendo-treelist-date-filter-menu-input>
-    `, isInline: true, components: [{ type: DateFilterMenuInputComponent, selector: "kendo-treelist-date-filter-menu-input", inputs: ["operators", "column", "filter", "operator", "currentFilter", "filterService", "format", "formatPlaceholder", "placeholder", "min", "max", "activeView", "bottomView", "topView", "weekNumber"] }, { type: i3$1.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["showStickyHeader", "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", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    `, isInline: true, components: [{ type: DateFilterMenuInputComponent, selector: "kendo-treelist-date-filter-menu-input", inputs: ["operators", "column", "filter", "operator", "currentFilter", "filterService", "format", "formatPlaceholder", "placeholder", "min", "max", "activeView", "bottomView", "topView", "weekNumber"] }, { type: i3$1.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "title", "subtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: DateFilterMenuComponent, decorators: [{
             type: Component,
             args: [{
@@ -8840,6 +8840,10 @@ class FilterCellOperatorsComponent {
         this.localization = localization;
         this.clearText = 'Clear';
         this.filterClearIcon = filterClearIcon;
+        /**
+         * @hidden
+         */
+        this.filterSVGIcon = filterIcon;
         /**
          * The filter operators that will be displayed.
          */
@@ -8934,7 +8938,8 @@ FilterCellOperatorsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12
             (valueChange)="onChange($event)"
             [value]="value"
             [attr.aria-label]="column && columnLabel"
-            iconClass="k-i-filter"
+            icon="filter"
+            [svgIcon]="filterSVGIcon"
             [valuePrimitive]="true"
             textField="text"
             [popupSettings]="{ width: 'auto' }"
@@ -8951,7 +8956,7 @@ FilterCellOperatorsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12
             (click)="clearClick()"
             (keydown)="clearKeydown($event)">
         </button>
-    `, isInline: true, components: [{ type: i3$1.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["showStickyHeader", "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", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }, { type: i4$2.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"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: FocusableDirective, selector: "[kendoTreeListFocusable],\n        [kendoTreeListAddCommand],\n        [kendoTreeListEditCommand],\n        [kendoTreeListRemoveCommand],\n        [kendoTreeListSaveCommand],\n        [kendoTreeListCancelCommand]\n    ", inputs: ["kendoTreeListFocusable", "enabled", "kendoTreeListAddCommand", "kendoTreeListEditCommand", "kendoTreeListRemoveCommand", "kendoTreeListSaveCommand", "kendoTreeListCancelCommand"] }] });
+    `, isInline: true, components: [{ type: i3$1.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "title", "subtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }, { type: i4$2.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"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: FocusableDirective, selector: "[kendoTreeListFocusable],\n        [kendoTreeListAddCommand],\n        [kendoTreeListEditCommand],\n        [kendoTreeListRemoveCommand],\n        [kendoTreeListSaveCommand],\n        [kendoTreeListCancelCommand]\n    ", inputs: ["kendoTreeListFocusable", "enabled", "kendoTreeListAddCommand", "kendoTreeListEditCommand", "kendoTreeListRemoveCommand", "kendoTreeListSaveCommand", "kendoTreeListCancelCommand"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: FilterCellOperatorsComponent, decorators: [{
             type: Component,
             args: [{
@@ -8966,7 +8971,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
             (valueChange)="onChange($event)"
             [value]="value"
             [attr.aria-label]="column && columnLabel"
-            iconClass="k-i-filter"
+            icon="filter"
+            [svgIcon]="filterSVGIcon"
             [valuePrimitive]="true"
             textField="text"
             [popupSettings]="{ width: 'auto' }"
@@ -9315,7 +9321,7 @@ BooleanFilterCellComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0
                 [value]="currentFilter?.value">
             </kendo-dropdownlist>
         </kendo-treelist-filter-wrapper-cell>
-    `, isInline: true, components: [{ type: FilterCellWrapperComponent, selector: "kendo-treelist-filter-wrapper-cell", inputs: ["showOperators"] }, { type: i3$1.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["showStickyHeader", "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", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }], directives: [{ type: FilterInputDirective, selector: "[kendoFilterInput]", inputs: ["filterDelay", "columnLabel", "column", "value"] }] });
+    `, isInline: true, components: [{ type: FilterCellWrapperComponent, selector: "kendo-treelist-filter-wrapper-cell", inputs: ["showOperators"] }, { type: i3$1.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "title", "subtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }], directives: [{ type: FilterInputDirective, selector: "[kendoFilterInput]", inputs: ["filterDelay", "columnLabel", "column", "value"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BooleanFilterCellComponent, decorators: [{
             type: Component,
             args: [{
@@ -11073,7 +11079,7 @@ const NON_DATA_ROW_CLASSES = 'k-grouping-row k-group-footer k-detail-row k-grid-
 /**
  * @hidden
  */
-const EMPTY_ICON_CLASS = 'k-i-none';
+const EMPTY_ICON_CLASS = 'k-i-none k-svg-i-none';
 /**
  * @hidden
  */
@@ -11162,6 +11168,11 @@ class CellComponent {
         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 = {};
@@ -11274,8 +11285,8 @@ CellComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version:
         <ng-container [ngSwitch]="isEdited">
             <ng-container *ngSwitchCase="false">
                 <ng-container *ngIf="column.expandable">
-                    <span class="k-icon k-i-none" *ngFor="let item of level | levelItems : hasChildren && expandIcons"></span>
-                    <kendo-icon-wrapper
+                    <kendo-icon-wrapper name="none" innerCssClass="k-treelist-toggle" [svgIcon]="noneIcon" *ngFor="let item of level | levelItems : hasChildren && expandIcons"></kendo-icon-wrapper>
+                    <kendo-icon-wrapper innerCssClass="k-treelist-toggle"
                         aria-hidden="true"
                         *ngIf="hasChildren && expandIcons && !loading"
                         [name]="arrowIcon"
@@ -11355,8 +11366,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         <ng-container [ngSwitch]="isEdited">
             <ng-container *ngSwitchCase="false">
                 <ng-container *ngIf="column.expandable">
-                    <span class="k-icon k-i-none" *ngFor="let item of level | levelItems : hasChildren && expandIcons"></span>
-                    <kendo-icon-wrapper
+                    <kendo-icon-wrapper name="none" innerCssClass="k-treelist-toggle" [svgIcon]="noneIcon" *ngFor="let item of level | levelItems : hasChildren && expandIcons"></kendo-icon-wrapper>
+                    <kendo-icon-wrapper innerCssClass="k-treelist-toggle"
                         aria-hidden="true"
                         *ngIf="hasChildren && expandIcons && !loading"
                         [name]="arrowIcon"
@@ -11502,6 +11513,11 @@ class TableBodyComponent {
         this.lockedColumnsCount = 0;
         this.totalColumnsCount = 0;
         this.trackBy = defaultTrackBy;
+        this.noneIcon = {
+            name: 'none',
+            content: '',
+            viewBox: '0 0 24 24'
+        };
         this.rowClass = () => null;
         this.cellKeydownSubscription = this.navigationService.cellKeydown.subscribe((args) => this.cellKeydownHandler(args));
         this.trackByWrapper = this.trackByWrapper.bind(this);
@@ -11746,7 +11762,7 @@ class TableBodyComponent {
         return {};
     }
     expandClick(eventArg, row) {
-        if (eventArg.type === 'click' && eventArg.target.closest('.k-icon-wrapper-host')) {
+        if (eventArg.type === 'click' && !hasClasses(eventArg.target, EMPTY_ICON_CLASS) && eventArg.target.closest('.k-icon-wrapper-host')) {
             eventArg.preventDefault();
             const viewItem = this.rowItem(row);
             if (viewItem.type === 'data') {
@@ -11858,7 +11874,7 @@ TableBodyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ver
                 [ngStyle]="column.footerStyle"
                 *ngFor="let column of footerColumns; let columnIndex = index; trackBy: trackByColumns;">
                 <ng-container *ngIf="$any(column).expandable">
-                    <span class="k-icon k-i-none" *ngFor="let item of item.level | levelItems"></span>
+                    <kendo-icon-wrapper name="none" innerCssClass="k-treelist-toggle" [svgIcon]="noneIcon" *ngFor="let item of item.level | levelItems"></kendo-icon-wrapper>
                 </ng-container>
                 <ng-container [ngTemplateOutlet]="column.footerTemplateRef"
                     [ngTemplateOutletContext]="{
@@ -11874,7 +11890,7 @@ TableBodyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ver
            </td>
         </tr>
     </ng-container>
-    `, isInline: true, components: [{ type: CellComponent, selector: "[kendoTreeListCell]", inputs: ["column", "columnIndex", "isNew", "level", "hasChildren", "isExpanded", "loading", "expandIcons", "selected", "dataItem", "viewItem"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: LogicalRowDirective, selector: "[kendoTreeListLogicalRow]", inputs: ["logicalRowIndex", "logicalSlaveRow", "logicalCellsCount", "logicalSlaveCellsCount", "dataRowIndex", "dataItem", "isNew", "totalColumns"] }, { type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: LogicalCellDirective, selector: "[kendoTreeListLogicalCell]", inputs: ["logicalColIndex", "logicalRowIndex", "logicalSlaveCell", "column", "colIndex", "colSpan", "rowSpan", "dataRowIndex", "dataItem", "expandable"] }, { type: i4.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], pipes: { "levelItems": LevelItemsPipe } });
+    `, isInline: true, components: [{ type: CellComponent, selector: "[kendoTreeListCell]", inputs: ["column", "columnIndex", "isNew", "level", "hasChildren", "isExpanded", "loading", "expandIcons", "selected", "dataItem", "viewItem"] }, { 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.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: LogicalRowDirective, selector: "[kendoTreeListLogicalRow]", inputs: ["logicalRowIndex", "logicalSlaveRow", "logicalCellsCount", "logicalSlaveCellsCount", "dataRowIndex", "dataItem", "isNew", "totalColumns"] }, { type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: LogicalCellDirective, selector: "[kendoTreeListLogicalCell]", inputs: ["logicalColIndex", "logicalRowIndex", "logicalSlaveCell", "column", "colIndex", "colSpan", "rowSpan", "dataRowIndex", "dataItem", "expandable"] }, { type: i4.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], pipes: { "levelItems": LevelItemsPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: TableBodyComponent, decorators: [{
             type: Component,
             args: [{
@@ -11961,7 +11977,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
                 [ngStyle]="column.footerStyle"
                 *ngFor="let column of footerColumns; let columnIndex = index; trackBy: trackByColumns;">
                 <ng-container *ngIf="$any(column).expandable">
-                    <span class="k-icon k-i-none" *ngFor="let item of item.level | levelItems"></span>
+                    <kendo-icon-wrapper name="none" innerCssClass="k-treelist-toggle" [svgIcon]="noneIcon" *ngFor="let item of item.level | levelItems"></kendo-icon-wrapper>
                 </ng-container>
                 <ng-container [ngTemplateOutlet]="column.footerTemplateRef"
                     [ngTemplateOutletContext]="{
@@ -13191,7 +13207,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$1.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["showStickyHeader", "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", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }, { type: i4$3.LabelComponent, selector: "kendo-label", inputs: ["text", "for", "optional", "labelCssStyle", "labelCssClass"], exportAs: ["kendoLabel"] }], directives: [{ type: 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$1.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "title", "subtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }, { type: i4$3.LabelComponent, selector: "kendo-label", inputs: ["text", "for", "optional", "labelCssStyle", "labelCssClass"], exportAs: ["kendoLabel"] }], directives: [{ type: 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: [{

package/filtering/cell/filter-cell-operators.component.d.ts

@@ -29,6 +29,10 @@ export declare class FilterCellOperatorsComponent implements OnInit, OnDestroy {
     protected localization: LocalizationService;
     clearText: string;
     filterClearIcon: SVGIcon;
+    /**
+     * @hidden
+     */
+    filterSVGIcon: SVGIcon;
     /**
      * @hidden
      */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-angular-treelist",
-  "version": "14.0.0-develop.3",
+  "version": "14.0.0-develop.4",
   "description": "Kendo UI TreeList for Angular - Display hierarchical data in an Angular tree grid view that supports sorting, filtering, paging, and much more.",
   "license": "SEE LICENSE IN LICENSE.md",
   "author": "Progress",
@@ -30,25 +30,25 @@
     "@progress/kendo-data-query": "^1.0.0",
     "@progress/kendo-drawing": "^1.17.2",
     "@progress/kendo-licensing": "^1.0.2",
-    "@progress/kendo-angular-buttons": "14.0.0-develop.3",
-    "@progress/kendo-angular-common": "14.0.0-develop.3",
-    "@progress/kendo-angular-dateinputs": "14.0.0-develop.3",
-    "@progress/kendo-angular-dropdowns": "14.0.0-develop.3",
-    "@progress/kendo-angular-excel-export": "14.0.0-develop.3",
-    "@progress/kendo-angular-icons": "14.0.0-develop.3",
-    "@progress/kendo-angular-inputs": "14.0.0-develop.3",
-    "@progress/kendo-angular-intl": "14.0.0-develop.3",
-    "@progress/kendo-angular-l10n": "14.0.0-develop.3",
-    "@progress/kendo-angular-label": "14.0.0-develop.3",
-    "@progress/kendo-angular-pdf-export": "14.0.0-develop.3",
-    "@progress/kendo-angular-popup": "14.0.0-develop.3",
-    "@progress/kendo-angular-utils": "14.0.0-develop.3",
+    "@progress/kendo-angular-buttons": "14.0.0-develop.4",
+    "@progress/kendo-angular-common": "14.0.0-develop.4",
+    "@progress/kendo-angular-dateinputs": "14.0.0-develop.4",
+    "@progress/kendo-angular-dropdowns": "14.0.0-develop.4",
+    "@progress/kendo-angular-excel-export": "14.0.0-develop.4",
+    "@progress/kendo-angular-icons": "14.0.0-develop.4",
+    "@progress/kendo-angular-inputs": "14.0.0-develop.4",
+    "@progress/kendo-angular-intl": "14.0.0-develop.4",
+    "@progress/kendo-angular-l10n": "14.0.0-develop.4",
+    "@progress/kendo-angular-label": "14.0.0-develop.4",
+    "@progress/kendo-angular-pdf-export": "14.0.0-develop.4",
+    "@progress/kendo-angular-popup": "14.0.0-develop.4",
+    "@progress/kendo-angular-utils": "14.0.0-develop.4",
     "rxjs": "^6.5.3 || ^7.0.0",
-    "@progress/kendo-angular-listview": "14.0.0-develop.3"
+    "@progress/kendo-angular-listview": "14.0.0-develop.4"
   },
   "dependencies": {
     "tslib": "^2.3.1",
-    "@progress/kendo-angular-schematics": "14.0.0-develop.3",
+    "@progress/kendo-angular-schematics": "14.0.0-develop.4",
     "@progress/kendo-common": "^0.2.0",
     "@progress/kendo-file-saver": "^1.0.0"
   },

package/rendering/cell.component.d.ts

@@ -46,6 +46,7 @@ export declare class CellComponent implements AfterContentChecked, DoCheck {
     caretAltRightIcon: SVGIcon;
     caretAltLeftIcon: SVGIcon;
     reorderIcon: SVGIcon;
+    noneIcon: SVGIcon;
     cellContext: any;
     private _templateContext;
     private _editTemplateContext;

package/rendering/constants.d.ts

@@ -13,7 +13,7 @@ export declare const NON_DATA_ROW_CLASSES = "k-grouping-row k-group-footer k-det
 /**
  * @hidden
  */
-export declare const EMPTY_ICON_CLASS = "k-i-none";
+export declare const EMPTY_ICON_CLASS = "k-i-none k-svg-i-none";
 /**
  * @hidden
  */

package/rendering/table-body.component.d.ts

@@ -17,6 +17,7 @@ import { TreeListItem } from '../data/treelist-item.interface';
 import { ExpandStateService } from '../expand-state/expand-state.service';
 import { SelectionService } from '../selection/selection.service';
 import { ColumnsContainer } from '../columns/columns-container';
+import { SVGIcon } from '@progress/kendo-angular-icons';
 import * as i0 from "@angular/core";
 /**
  * @hidden
@@ -48,6 +49,7 @@ export declare class TableBodyComponent implements OnInit, OnDestroy, OnChanges
     expandIcons: boolean;
     trackBy: TrackByFunction<TreeListItem>;
     totalColumns: ColumnsContainer;
+    noneIcon: SVGIcon;
     private clickSubscription;
     private l10nSubscription;
     private cellKeydownSubscription;

package/schematics/ngAdd/index.js

@@ -4,13 +4,13 @@ const schematics_1 = require("@angular-devkit/schematics");
 function default_1(options) {
     const finalOptions = Object.assign(Object.assign({}, options), { mainNgModule: 'TreeListModule', package: 'treelist', peerDependencies: {
             // peer dep of the dropdowns
-            '@progress/kendo-angular-treeview': '14.0.0-develop.3',
+            '@progress/kendo-angular-treeview': '14.0.0-develop.4',
             // peer dependency of kendo-angular-inputs
-            '@progress/kendo-angular-dialog': '14.0.0-develop.3',
+            '@progress/kendo-angular-dialog': '14.0.0-develop.4',
             // peer dependency of kendo-angular-icons
             '@progress/kendo-svg-icons': '^1.0.0',
             // peer dependency of kendo-angular-dateinputs
-            '@progress/kendo-angular-navigation': '14.0.0-develop.3',
+            '@progress/kendo-angular-navigation': '14.0.0-develop.4',
         } });
     return (0, schematics_1.externalSchematic)('@progress/kendo-angular-schematics', 'ng-add', finalOptions);
 }