@progress/kendo-angular-treelist 11.0.0-develop.98 → 11.0.0

package/esm2020/rendering/header/header.component.mjs

@@ -22,6 +22,7 @@ import { SortService } from '../../common/sort.service';
 import { hasItems } from '../../column-menu/utils';
 import { closestInScope, isFocusable } from '../common/dom-queries';
 import { SelectionService } from '../../selection/selection.service';
+import { sortAscSmallIcon, sortDescSmallIcon } from '@progress/kendo-svg-icons';
 import * as i0 from "@angular/core";
 import * as i1 from "../../common/single-popup.service";
 import * as i2 from "../../dragdrop/drag-hint.service";
@@ -32,16 +33,17 @@ import * as i6 from "../../selection/selection.service";
 import * as i7 from "@progress/kendo-angular-l10n";
 import * as i8 from "../../filtering/menu/filter-menu.component";
 import * as i9 from "../../column-menu/column-menu.component";
-import * as i10 from "../../filtering/filter-row.component";
-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 "../../dragdrop/drop-target.directive";
-import * as i15 from "@progress/kendo-angular-common";
-import * as i16 from "../../dragdrop/draggable-column.directive";
-import * as i17 from "../common/template-context.directive";
-import * as i18 from "../../navigation/focusable.directive";
-import * as i19 from "../../column-resizing/column-handle.directive";
+import * as i10 from "@progress/kendo-angular-icons";
+import * as i11 from "../../filtering/filter-row.component";
+import * as i12 from "@angular/common";
+import * as i13 from "../../navigation/logical-row.directive";
+import * as i14 from "../../navigation/logical-cell.directive";
+import * as i15 from "../../dragdrop/drop-target.directive";
+import * as i16 from "@progress/kendo-angular-common";
+import * as i17 from "../../dragdrop/draggable-column.directive";
+import * as i18 from "../common/template-context.directive";
+import * as i19 from "../../navigation/focusable.directive";
+import * as i20 from "../../column-resizing/column-handle.directive";
 const mergeObjects = (...args) => Object.assign.apply(null, [{}].concat(args));
 const directions = initialDirection => initialDirection === "asc" ? ["asc", "desc"] : ["desc", "asc"];
 /**
@@ -86,6 +88,8 @@ export class HeaderComponent {
         this.sortedFields = {};
         this.hostClass = true;
         this.dropTargets = new QueryList();
+        this.sortAscSmallIcon = sortAscSmallIcon;
+        this.sortDescSmallIcon = sortDescSmallIcon;
         this.subscription = new Subscription();
     }
     get headerClass() {
@@ -137,14 +141,6 @@ export class HeaderComponent {
             .findIndex(x => x.field === field)
             + 1;
     }
-    sortIcon(field) {
-        const state = this.sortDescriptor(field);
-        return {
-            'k-icon': isPresent(state.dir),
-            'k-i-sort-desc-small': state.dir === "desc",
-            'k-i-sort-asc-small': state.dir === "asc"
-        };
-    }
     sortState(column) {
         if (!this.isSortable(column)) {
             return;
@@ -435,7 +431,12 @@ HeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", versio
                                     <span class="k-column-title">{{column.displayTitle}}</span>
                                 </ng-container>
                                 <span class="k-sort-icon">
-                                    <span role="note" [attr.aria-label]="sortableLabel" [ngClass]="sortIcon(getColumnComponent(column).field)"></span>
+                                <kendo-icon-wrapper
+                                        *ngIf="sortDescriptor(getColumnComponent(column).field).dir"
+                                        role="note" [attr.aria-label]="sortableLabel"
+                                        name="sort-{{sortDescriptor(getColumnComponent(column).field).dir}}-small"
+                                        [svgIcon]="sortDescriptor(getColumnComponent(column).field).dir === 'asc' ? sortAscSmallIcon : sortDescSmallIcon"
+                                        ></kendo-icon-wrapper>
                                 </span>
                                 <span *ngIf="showSortNumbering(getColumnComponent(column))" class="k-sort-order">{{sortOrder(getColumnComponent(column).field)}}</span>
                             </span>
@@ -535,7 +536,7 @@ HeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", versio
             [logicalSlaveCellsCount]="unlockedColumnsCount"
         >
         </tr>
-    `, isInline: true, components: [{ type: i8.FilterMenuComponent, selector: "kendo-treelist-filter-menu", inputs: ["column", "filter"] }, { type: i9.ColumnMenuComponent, selector: "kendo-treelist-column-menu", inputs: ["standalone", "column", "settings", "sort", "filter", "sortable", "columnMenuTemplate"] }, { type: i10.FilterRowComponent, selector: "[kendoTreeListFilterRow]", inputs: ["columns", "filter", "logicalRowIndex", "lockedColumnsCount"] }], directives: [{ type: i11.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i12.LogicalRowDirective, selector: "[kendoTreeListLogicalRow]", inputs: ["logicalRowIndex", "logicalSlaveRow", "logicalCellsCount", "logicalSlaveCellsCount", "dataRowIndex", "dataItem", "isNew"] }, { type: i11.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i13.LogicalCellDirective, selector: "[kendoTreeListLogicalCell]", inputs: ["logicalColIndex", "logicalRowIndex", "logicalSlaveCell", "column", "colIndex", "colSpan", "rowSpan", "dataRowIndex", "dataItem", "expandable"] }, { type: i14.DropTargetDirective, selector: "[kendoDropTarget]", inputs: ["context"], outputs: ["enter", "leave", "drop"] }, { type: i15.DraggableDirective, selector: "[kendoDraggable]", inputs: ["enableDrag"], outputs: ["kendoPress", "kendoDrag", "kendoRelease"] }, { type: i16.DraggableColumnDirective, selector: "[kendoDraggableColumn]", inputs: ["context", "enableDrag"], outputs: ["drag"] }, { type: i11.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i11.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i17.TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }, { type: i18.FocusableDirective, selector: "[kendoTreeListFocusable],\n        [kendoTreeListAddCommand],\n        [kendoTreeListEditCommand],\n        [kendoTreeListRemoveCommand],\n        [kendoTreeListSaveCommand],\n        [kendoTreeListCancelCommand]\n    ", inputs: ["kendoTreeListFocusable", "kendoTreeListAddCommand", "kendoTreeListEditCommand", "kendoTreeListRemoveCommand", "kendoTreeListSaveCommand", "kendoTreeListCancelCommand"] }, { type: i19.ColumnHandleDirective, selector: "[kendoTreeListColumnHandle]", inputs: ["columns", "column"] }] });
+    `, isInline: true, components: [{ type: i8.FilterMenuComponent, selector: "kendo-treelist-filter-menu", inputs: ["column", "filter"] }, { type: i9.ColumnMenuComponent, selector: "kendo-treelist-column-menu", inputs: ["standalone", "column", "settings", "sort", "filter", "sortable", "columnMenuTemplate"] }, { type: i10.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass"], exportAs: ["kendoIconWrapper"] }, { type: i11.FilterRowComponent, selector: "[kendoTreeListFilterRow]", inputs: ["columns", "filter", "logicalRowIndex", "lockedColumnsCount"] }], directives: [{ type: i12.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i13.LogicalRowDirective, selector: "[kendoTreeListLogicalRow]", inputs: ["logicalRowIndex", "logicalSlaveRow", "logicalCellsCount", "logicalSlaveCellsCount", "dataRowIndex", "dataItem", "isNew"] }, { type: i12.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i14.LogicalCellDirective, selector: "[kendoTreeListLogicalCell]", inputs: ["logicalColIndex", "logicalRowIndex", "logicalSlaveCell", "column", "colIndex", "colSpan", "rowSpan", "dataRowIndex", "dataItem", "expandable"] }, { type: i15.DropTargetDirective, selector: "[kendoDropTarget]", inputs: ["context"], outputs: ["enter", "leave", "drop"] }, { type: i16.DraggableDirective, selector: "[kendoDraggable]", inputs: ["enableDrag"], outputs: ["kendoPress", "kendoDrag", "kendoRelease"] }, { type: i17.DraggableColumnDirective, selector: "[kendoDraggableColumn]", inputs: ["context", "enableDrag"], outputs: ["drag"] }, { type: i12.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i12.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i18.TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }, { type: i19.FocusableDirective, selector: "[kendoTreeListFocusable],\n        [kendoTreeListAddCommand],\n        [kendoTreeListEditCommand],\n        [kendoTreeListRemoveCommand],\n        [kendoTreeListSaveCommand],\n        [kendoTreeListCancelCommand]\n    ", inputs: ["kendoTreeListFocusable", "kendoTreeListAddCommand", "kendoTreeListEditCommand", "kendoTreeListRemoveCommand", "kendoTreeListSaveCommand", "kendoTreeListCancelCommand"] }, { type: i20.ColumnHandleDirective, selector: "[kendoTreeListColumnHandle]", inputs: ["columns", "column"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: HeaderComponent, decorators: [{
             type: Component,
             args: [{
@@ -616,7 +617,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                                     <span class="k-column-title">{{column.displayTitle}}</span>
                                 </ng-container>
                                 <span class="k-sort-icon">
-                                    <span role="note" [attr.aria-label]="sortableLabel" [ngClass]="sortIcon(getColumnComponent(column).field)"></span>
+                                <kendo-icon-wrapper
+                                        *ngIf="sortDescriptor(getColumnComponent(column).field).dir"
+                                        role="note" [attr.aria-label]="sortableLabel"
+                                        name="sort-{{sortDescriptor(getColumnComponent(column).field).dir}}-small"
+                                        [svgIcon]="sortDescriptor(getColumnComponent(column).field).dir === 'asc' ? sortAscSmallIcon : sortDescSmallIcon"
+                                        ></kendo-icon-wrapper>
                                 </span>
                                 <span *ngIf="showSortNumbering(getColumnComponent(column))" class="k-sort-order">{{sortOrder(getColumnComponent(column).field)}}</span>
                             </span>

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

@@ -285,7 +285,7 @@ export class TableBodyComponent {
         return {};
     }
     expandClick(eventArg, row) {
-        if (eventArg.type === 'click' && hasClasses(eventArg.target, 'k-i-caret-alt-right k-i-caret-alt-down')) {
+        if (eventArg.type === 'click' && eventArg.target.closest('.k-icon-wrapper-host')) {
             eventArg.preventDefault();
             const viewItem = this.rowItem(row);
             if (viewItem.type === 'data') {