@progress/kendo-angular-pivotgrid 11.0.0-develop.107 → 11.0.0-develop.109

package/configurator/chip-menu/chip-menu-filter.component.d.ts

@@ -4,6 +4,7 @@
 *-------------------------------------------------------------------------------------------*/
 import { EventEmitter, ElementRef } from '@angular/core';
 import { AxisDescriptor } from '@progress/kendo-pivotgrid-common';
+import { SVGIcon } from '@progress/kendo-svg-icons';
 import { PivotLocalizationService } from '../../localization/pivot-localization.service';
 import { ChipMenuItemBase } from './chip-menu-item-base';
 import * as i0 from "@angular/core";
@@ -32,6 +33,7 @@ export declare class ChipMenuFilterComponent extends ChipMenuItemBase {
     expanded: boolean;
     isLast: boolean;
     actionsClass: string;
+    filterSVGIcon: SVGIcon;
     constructor(localization: PivotLocalizationService, hostElement: ElementRef);
     onCollapse(): void;
     onExpand(): void;

package/configurator/chip-menu/chip-menu-item.component.d.ts

@@ -4,6 +4,7 @@
 *-------------------------------------------------------------------------------------------*/
 import { EventEmitter, OnChanges } from '@angular/core';
 import { ChipMenuItemContentTemplateDirective } from './chip-menu-item-content-template.directive';
+import { SVGIcon } from '@progress/kendo-svg-icons';
 import * as i0 from "@angular/core";
 /**
  * @hidden
@@ -27,6 +28,11 @@ export declare class ChipMenuItemComponent implements OnChanges {
      * that will be rendered for the item.
      */
     icon: string;
+    /**
+     * Defines an SVGIcon to be rendered for the column menu items.
+     * The input can take either an [existing Kendo SVG icon](slug:svgicon_list) or a custom one.
+     */
+    svgIcon: SVGIcon;
     /**
      * Specifies the item text.
      */
@@ -46,5 +52,5 @@ export declare class ChipMenuItemComponent implements OnChanges {
     onClick(e: any): void;
     private updateContentState;
     static ɵfac: i0.ɵɵFactoryDeclaration<ChipMenuItemComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ChipMenuItemComponent, "kendo-pivot-chipmenu-item", never, { "icon": "icon"; "text": "text"; "selected": "selected"; "expanded": "expanded"; }, { "itemClick": "itemClick"; "expand": "expand"; "collapse": "collapse"; }, ["contentTemplate"], never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ChipMenuItemComponent, "kendo-pivot-chipmenu-item", never, { "icon": "icon"; "svgIcon": "svgIcon"; "text": "text"; "selected": "selected"; "expanded": "expanded"; }, { "itemClick": "itemClick"; "expand": "expand"; "collapse": "collapse"; }, ["contentTemplate"], never>;
 }

package/configurator/chip-menu/chip-menu-sort.component.d.ts

@@ -7,6 +7,7 @@ import { ChipMenuItemBase } from './chip-menu-item-base';
 import { ConfiguratorService } from '../configurator.service';
 import { AxisDescriptor } from '@progress/kendo-pivotgrid-common';
 import { PivotLocalizationService } from '../../localization/pivot-localization.service';
+import { SVGIcon } from '@progress/kendo-svg-icons';
 import * as i0 from "@angular/core";
 /**
  * @hidden
@@ -19,6 +20,8 @@ export declare class ChipMenuSortComponent extends ChipMenuItemBase {
     protected renderer: Renderer2;
     protected configuratorService: ConfiguratorService;
     chip: AxisDescriptor;
+    sortAscSVGIcon: SVGIcon;
+    sortDescSVGIcon: SVGIcon;
     constructor(localization: PivotLocalizationService, renderer: Renderer2, configuratorService: ConfiguratorService);
     get sortedAsc(): boolean;
     get sortedDesc(): boolean;

package/configurator/chip-menu/chip-menu.component.d.ts

@@ -7,6 +7,7 @@ import { SinglePopupService } from './single-popup.service';
 import { ChipMenuService } from './chip-menu.service';
 import { PivotLocalizationService } from '../../localization/pivot-localization.service';
 import { AxisDescriptor } from '@progress/kendo-pivotgrid-common';
+import { SVGIcon } from '@progress/kendo-svg-icons';
 import * as i0 from "@angular/core";
 /**
  * @hidden
@@ -23,11 +24,12 @@ export declare class ChipMenuComponent implements OnDestroy {
     chip: AxisDescriptor;
     tabIndex: string;
     anchor: ElementRef;
+    menuItemSVGIcon: SVGIcon;
     private popupRef;
     private closeSubscription;
     constructor(popupService: SinglePopupService, localization: PivotLocalizationService, service: ChipMenuService);
     ngOnDestroy(): void;
-    toggle(e: any, anchor: any, template: any): void;
+    toggle(e: any, template: any): void;
     close(): void;
     get chipMenuTitle(): string;
     static ɵfac: i0.ɵɵFactoryDeclaration<ChipMenuComponent, never>;

package/esm2020/configurator/chip-menu/chip-menu-filter.component.mjs

@@ -3,6 +3,7 @@
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import { Component, Input, Output, EventEmitter, ElementRef } from '@angular/core';
+import { filterIcon } from '@progress/kendo-svg-icons';
 import { PivotLocalizationService } from '../../localization/pivot-localization.service';
 import { ChipMenuItemBase } from './chip-menu-item-base';
 import * as i0 from "@angular/core";
@@ -33,6 +34,7 @@ export class ChipMenuFilterComponent extends ChipMenuItemBase {
         this.expanded = false;
         this.isLast = false;
         this.actionsClass = 'k-columnmenu-actions';
+        this.filterSVGIcon = filterIcon;
     }
     onCollapse() {
         this.expanded = false;
@@ -58,6 +60,7 @@ ChipMenuFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0"
             classs="k-widget k-expander"
             [text]="messageFor('fieldMenuFilterItemLabel')"
             icon="filter"
+            [svgIcon]="filterSVGIcon"
             [expanded]="expanded"
             (collapse)="onCollapse()"
             (expand)="onExpand()">
@@ -73,7 +76,7 @@ ChipMenuFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0"
                 </kendo-pivot-filter-menu-container>
             </ng-template>
         </kendo-pivot-chipmenu-item>
-    `, isInline: true, components: [{ type: i2.ChipMenuItemComponent, selector: "kendo-pivot-chipmenu-item", inputs: ["icon", "text", "selected", "expanded"], outputs: ["itemClick", "expand", "collapse"] }, { type: i3.FilterMenuContainerComponent, selector: "kendo-pivot-filter-menu-container", inputs: ["chip", "isLast", "isExpanded", "menuTabbingService", "actionsClass"], outputs: ["close"] }], directives: [{ type: i4.ChipMenuItemContentTemplateDirective, selector: "[kendoPivotChipMenuItemContentTemplate]" }] });
+    `, isInline: true, components: [{ type: i2.ChipMenuItemComponent, selector: "kendo-pivot-chipmenu-item", inputs: ["icon", "svgIcon", "text", "selected", "expanded"], outputs: ["itemClick", "expand", "collapse"] }, { type: i3.FilterMenuContainerComponent, selector: "kendo-pivot-filter-menu-container", inputs: ["chip", "isLast", "isExpanded", "menuTabbingService", "actionsClass"], outputs: ["close"] }], directives: [{ type: i4.ChipMenuItemContentTemplateDirective, selector: "[kendoPivotChipMenuItemContentTemplate]" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ChipMenuFilterComponent, decorators: [{
             type: Component,
             args: [{
@@ -83,6 +86,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
             classs="k-widget k-expander"
             [text]="messageFor('fieldMenuFilterItemLabel')"
             icon="filter"
+            [svgIcon]="filterSVGIcon"
             [expanded]="expanded"
             (collapse)="onCollapse()"
             (expand)="onExpand()">

package/esm2020/configurator/chip-menu/chip-menu-item.component.mjs

@@ -2,11 +2,13 @@
 * Copyright © 2023 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
+/* eslint-disable @typescript-eslint/no-explicit-any */
 import { Component, Input, Output, EventEmitter, ContentChild } from '@angular/core';
 import { trigger, transition, style, animate, state } from '@angular/animations';
 import { ChipMenuItemContentTemplateDirective } from './chip-menu-item-content-template.directive';
 import * as i0 from "@angular/core";
-import * as i1 from "@angular/common";
+import * as i1 from "@progress/kendo-angular-icons";
+import * as i2 from "@angular/common";
 /**
  * @hidden
  *
@@ -53,23 +55,26 @@ export class ChipMenuItemComponent {
     }
 }
 ChipMenuItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ChipMenuItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ChipMenuItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: ChipMenuItemComponent, selector: "kendo-pivot-chipmenu-item", inputs: { icon: "icon", text: "text", selected: "selected", expanded: "expanded" }, outputs: { itemClick: "itemClick", expand: "expand", collapse: "collapse" }, queries: [{ propertyName: "contentTemplate", first: true, predicate: ChipMenuItemContentTemplateDirective, descendants: true }], usesOnChanges: true, ngImport: i0, template: `
+ChipMenuItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: ChipMenuItemComponent, selector: "kendo-pivot-chipmenu-item", inputs: { icon: "icon", svgIcon: "svgIcon", text: "text", selected: "selected", expanded: "expanded" }, outputs: { itemClick: "itemClick", expand: "expand", collapse: "collapse" }, queries: [{ propertyName: "contentTemplate", first: true, predicate: ChipMenuItemContentTemplateDirective, descendants: true }], usesOnChanges: true, ngImport: i0, template: `
         <div
             class="k-columnmenu-item"
             (click)="onClick($event)"
             (keydown.enter)="onClick($event)"
             [class.k-selected]="selected"
             role="button"
-            [attr.aria-expanded]="expanded">
-           <span *ngIf="icon" class="k-icon" [ngClass]="iconClass">
-           </span>
+            [attr.aria-expanded]="expanded"
+        >
+            <kendo-icon-wrapper
+                *ngIf="icon"
+                [name]="icon"
+                [svgIcon]="svgIcon"
+            ></kendo-icon-wrapper>
            {{ text }}
         </div>
         <div *ngIf="contentTemplate" [@state]="contentState" [style.overflow]="'hidden'" class="k-columnmenu-item-content">
-            <ng-container [ngTemplateOutlet]="contentTemplate.templateRef">
-            </ng-container>
+            <ng-container [ngTemplateOutlet]="contentTemplate.templateRef"></ng-container>
         <div>
-    `, isInline: true, directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], animations: [
+    `, isInline: true, components: [{ type: i1.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass"], exportAs: ["kendoIconWrapper"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], animations: [
         trigger('state', [
             state('collapsed', style({ display: 'none' })),
             state('expanded', style({ display: 'block' })),
@@ -126,14 +131,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
             (keydown.enter)="onClick($event)"
             [class.k-selected]="selected"
             role="button"
-            [attr.aria-expanded]="expanded">
-           <span *ngIf="icon" class="k-icon" [ngClass]="iconClass">
-           </span>
+            [attr.aria-expanded]="expanded"
+        >
+            <kendo-icon-wrapper
+                *ngIf="icon"
+                [name]="icon"
+                [svgIcon]="svgIcon"
+            ></kendo-icon-wrapper>
            {{ text }}
         </div>
         <div *ngIf="contentTemplate" [@state]="contentState" [style.overflow]="'hidden'" class="k-columnmenu-item-content">
-            <ng-container [ngTemplateOutlet]="contentTemplate.templateRef">
-            </ng-container>
+            <ng-container [ngTemplateOutlet]="contentTemplate.templateRef"></ng-container>
         <div>
     `
                 }]
@@ -145,6 +153,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                 type: Output
             }], icon: [{
                 type: Input
+            }], svgIcon: [{
+                type: Input
             }], text: [{
                 type: Input
             }], selected: [{

package/esm2020/configurator/chip-menu/chip-menu-sort.component.mjs

@@ -7,6 +7,7 @@ import { ChipMenuItemBase } from './chip-menu-item-base';
 import { ConfiguratorService } from '../configurator.service';
 import { PIVOT_CONFIGURATOR_ACTION } from '@progress/kendo-pivotgrid-common';
 import { PivotLocalizationService } from '../../localization/pivot-localization.service';
+import { sortAscSmallIcon, sortDescSmallIcon } from '@progress/kendo-svg-icons';
 import * as i0 from "@angular/core";
 import * as i1 from "../../localization/pivot-localization.service";
 import * as i2 from "../configurator.service";
@@ -23,6 +24,8 @@ export class ChipMenuSortComponent extends ChipMenuItemBase {
         this.localization = localization;
         this.renderer = renderer;
         this.configuratorService = configuratorService;
+        this.sortAscSVGIcon = sortAscSmallIcon;
+        this.sortDescSVGIcon = sortDescSmallIcon;
     }
     get sortedAsc() {
         const descriptor = this.descriptor;
@@ -57,16 +60,18 @@ ChipMenuSortComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0",
         <kendo-pivot-chipmenu-item
             [text]="messageFor('fieldMenuSortAscendingItemLabel')"
             icon="sort-asc-small"
+            [svgIcon]="sortAscSVGIcon"
             (itemClick)="toggleSort('asc')"
             [selected]="sortedAsc">
         </kendo-pivot-chipmenu-item>
         <kendo-pivot-chipmenu-item
             [text]="messageFor('fieldMenuSortDescendingItemLabel')"
             icon="sort-desc-small"
+            [svgIcon]="sortDescSVGIcon"
             (itemClick)="toggleSort('desc')"
             [selected]="sortedDesc">
         </kendo-pivot-chipmenu-item>
-    `, isInline: true, components: [{ type: i3.ChipMenuItemComponent, selector: "kendo-pivot-chipmenu-item", inputs: ["icon", "text", "selected", "expanded"], outputs: ["itemClick", "expand", "collapse"] }] });
+    `, isInline: true, components: [{ type: i3.ChipMenuItemComponent, selector: "kendo-pivot-chipmenu-item", inputs: ["icon", "svgIcon", "text", "selected", "expanded"], outputs: ["itemClick", "expand", "collapse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ChipMenuSortComponent, decorators: [{
             type: Component,
             args: [{
@@ -75,12 +80,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
         <kendo-pivot-chipmenu-item
             [text]="messageFor('fieldMenuSortAscendingItemLabel')"
             icon="sort-asc-small"
+            [svgIcon]="sortAscSVGIcon"
             (itemClick)="toggleSort('asc')"
             [selected]="sortedAsc">
         </kendo-pivot-chipmenu-item>
         <kendo-pivot-chipmenu-item
             [text]="messageFor('fieldMenuSortDescendingItemLabel')"
             icon="sort-desc-small"
+            [svgIcon]="sortDescSVGIcon"
             (itemClick)="toggleSort('desc')"
             [selected]="sortedDesc">
         </kendo-pivot-chipmenu-item>

package/esm2020/configurator/chip-menu/chip-menu.component.mjs

@@ -2,20 +2,23 @@
 * Copyright © 2023 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
+/* eslint-disable @typescript-eslint/no-explicit-any */
 import { MenuTabbingService } from './filtering/menu-tabbing.service';
 import { Component, Input, ElementRef, ViewChild } from '@angular/core';
 import { SinglePopupService } from './single-popup.service';
 import { ChipMenuService } from './chip-menu.service';
 import { PivotLocalizationService } from '../../localization/pivot-localization.service';
 import { replaceMessagePlaceholder } from '../../util';
+import { moreVerticalIcon } from '@progress/kendo-svg-icons';
 import * as i0 from "@angular/core";
 import * as i1 from "./single-popup.service";
 import * as i2 from "../../localization/pivot-localization.service";
 import * as i3 from "./chip-menu.service";
-import * as i4 from "./chip-menu-container.component";
-import * as i5 from "./chip-menu-sort.component";
-import * as i6 from "./chip-menu-filter.component";
-import * as i7 from "./chip-menu-item.directive";
+import * as i4 from "@progress/kendo-angular-icons";
+import * as i5 from "./chip-menu-container.component";
+import * as i6 from "./chip-menu-sort.component";
+import * as i7 from "./chip-menu-filter.component";
+import * as i8 from "./chip-menu-item.directive";
 const POPUP_CLASS = 'k-column-menu';
 /**
  * @hidden
@@ -28,20 +31,22 @@ export class ChipMenuComponent {
         this.localization = localization;
         this.service = service;
         this.tabIndex = '-1';
+        this.menuItemSVGIcon = moreVerticalIcon;
         this.closeSubscription = service.closeMenu.subscribe(this.close.bind(this));
     }
     ngOnDestroy() {
         this.close();
         this.closeSubscription.unsubscribe();
     }
-    toggle(e, anchor, template) {
+    toggle(e, template) {
         if (e) {
             e.preventDefault();
             e.stopImmediatePropagation();
         }
+        const anchor = this.anchor.nativeElement;
         this.popupRef = this.popupService.open(anchor, template, this.popupRef, POPUP_CLASS);
         if (!this.popupRef) {
-            this.anchor.nativeElement.focus();
+            anchor.focus();
         }
     }
     close() {
@@ -59,13 +64,16 @@ ChipMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", versio
 ChipMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: ChipMenuComponent, selector: "kendo-pivot-chip-menu", inputs: { chip: "chip", tabIndex: "tabIndex" }, providers: [
         ChipMenuService,
         MenuTabbingService
-    ], viewQueries: [{ propertyName: "anchor", first: true, predicate: ["anchor"], descendants: true, static: true }], ngImport: i0, template: `
-        <span #anchor
-            class="k-icon k-i-more-vertical"
-            (click)="toggle($event, anchor, template)"
+    ], viewQueries: [{ propertyName: "anchor", first: true, predicate: ["anchor"], descendants: true, read: ElementRef, static: true }], ngImport: i0, template: `
+        <kendo-icon-wrapper
+            #anchor
+            name="more-vertical"
+            [svgIcon]="menuItemSVGIcon"
+            (click)="toggle($event, template)"
             [tabindex]="tabIndex"
-            [attr.title]="chipMenuTitle">
-        </span>
+            [attr.title]="chipMenuTitle"
+        >
+        </kendo-icon-wrapper>
         <ng-template #template>
             <kendo-pivot-chipmenu-container
                 (keydown.escape)="close()"
@@ -85,7 +93,7 @@ ChipMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", vers
                 </kendo-pivot-chipmenu-filter>
             </kendo-pivot-chipmenu-container>
         </ng-template>
-    `, isInline: true, components: [{ type: i4.ChipMenuContainerComponent, selector: "kendo-pivot-chipmenu-container" }, { type: i5.ChipMenuSortComponent, selector: "kendo-pivot-chipmenu-sort", inputs: ["chip"] }, { type: i6.ChipMenuFilterComponent, selector: "kendo-pivot-chipmenu-filter", inputs: ["chip", "expanded", "isLast"], outputs: ["expand", "collapse"] }], directives: [{ type: i7.ChipMenuItemDirective, selector: "[kendoPivotChipMenuItem]", inputs: ["kendoPivotChipMenuItem"] }] });
+    `, isInline: true, components: [{ type: i4.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass"], exportAs: ["kendoIconWrapper"] }, { type: i5.ChipMenuContainerComponent, selector: "kendo-pivot-chipmenu-container" }, { type: i6.ChipMenuSortComponent, selector: "kendo-pivot-chipmenu-sort", inputs: ["chip"] }, { type: i7.ChipMenuFilterComponent, selector: "kendo-pivot-chipmenu-filter", inputs: ["chip", "expanded", "isLast"], outputs: ["expand", "collapse"] }], directives: [{ type: i8.ChipMenuItemDirective, selector: "[kendoPivotChipMenuItem]", inputs: ["kendoPivotChipMenuItem"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ChipMenuComponent, decorators: [{
             type: Component,
             args: [{
@@ -95,12 +103,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                     ],
                     selector: 'kendo-pivot-chip-menu',
                     template: `
-        <span #anchor
-            class="k-icon k-i-more-vertical"
-            (click)="toggle($event, anchor, template)"
+        <kendo-icon-wrapper
+            #anchor
+            name="more-vertical"
+            [svgIcon]="menuItemSVGIcon"
+            (click)="toggle($event, template)"
             [tabindex]="tabIndex"
-            [attr.title]="chipMenuTitle">
-        </span>
+            [attr.title]="chipMenuTitle"
+        >
+        </kendo-icon-wrapper>
         <ng-template #template>
             <kendo-pivot-chipmenu-container
                 (keydown.escape)="close()"
@@ -128,5 +139,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                 type: Input
             }], anchor: [{
                 type: ViewChild,
-                args: ['anchor', { static: true }]
+                args: ['anchor', { static: true, read: ElementRef }]
             }] } });

package/esm2020/package-metadata.mjs

@@ -9,7 +9,7 @@ export const packageMetadata = {
     name: '@progress/kendo-angular-pivotgrid',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1673545397,
+    publishDate: 1673549015,
     version: '',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning'
 };

package/esm2020/pivotgrid.component.mjs

@@ -13,6 +13,7 @@ import { merge } from 'rxjs/operators';
 import { L10N_PREFIX, LocalizationService } from '@progress/kendo-angular-l10n';
 import { ConfiguratorNavigation, PivotGridNavigation } from '@progress/kendo-pivotgrid-common';
 import { PivotLocalizationService } from './localization/pivot-localization.service';
+import { gearIcon } from '@progress/kendo-svg-icons';
 import * as i0 from "@angular/core";
 import * as i1 from "./data-binding/pivotgrid-data.service";
 import * as i2 from "@progress/kendo-angular-l10n";
@@ -20,8 +21,9 @@ import * as i3 from "@progress/kendo-angular-common";
 import * as i4 from "./rendering/pivotgrid-table.component";
 import * as i5 from "@progress/kendo-angular-indicators";
 import * as i6 from "./configurator/configurator.component";
-import * as i7 from "./localization/localized-messages.directive";
-import * as i8 from "@angular/common";
+import * as i7 from "@progress/kendo-angular-icons";
+import * as i8 from "./localization/localized-messages.directive";
+import * as i9 from "@angular/common";
 const DEFAULT_LOADER_SETTINGS = {
     type: 'converging-spinner',
     themeColor: 'primary',
@@ -54,6 +56,10 @@ export class PivotGridComponent {
          * @default false
          */
         this.navigable = false;
+        /**
+         * @hidden
+         */
+        this.gearSVGIcon = gearIcon;
         this.resizeObservers = [];
         this._loaderSettings = DEFAULT_LOADER_SETTINGS;
         this.subs = new Subscription();
@@ -380,10 +386,10 @@ PivotGridComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ver
             class="k-pivotgrid-configurator-button"
             aria-hidden="true"
             (click)="toggleConfigurator()">
-            <span>{{messageFor('configuratorButtonText')}}<span class="k-icon k-i-gear k-color-inherit"></span>
+            <span>{{messageFor('configuratorButtonText')}}<kendo-icon-wrapper name="gear" innerCssClass="k-color-inherit" [svgIcon]="gearSVGIcon"></kendo-icon-wrapper>
             </span>
         </div>
-   `, isInline: true, components: [{ type: i4.PivotGridTableComponent, selector: "kendo-pivotgrid-table", inputs: ["tableType", "colWidth"] }, { type: i5.LoaderComponent, selector: "kendo-loader", inputs: ["type", "themeColor", "size"] }, { type: i6.PivotGridConfiguratorComponent, selector: "kendo-pivotgrid-configurator", inputs: ["orientation", "sort", "filter", "navigation"], outputs: ["close"] }], directives: [{ type: i7.LocalizedMessagesDirective, selector: "[kendoPivotGridLocalizedMessages]" }, { type: i8.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+   `, isInline: true, components: [{ type: i4.PivotGridTableComponent, selector: "kendo-pivotgrid-table", inputs: ["tableType", "colWidth"] }, { type: i5.LoaderComponent, selector: "kendo-loader", inputs: ["type", "themeColor", "size"] }, { type: i6.PivotGridConfiguratorComponent, selector: "kendo-pivotgrid-configurator", inputs: ["orientation", "sort", "filter", "navigation"], outputs: ["close"] }, { type: i7.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass"], exportAs: ["kendoIconWrapper"] }], directives: [{ type: i8.LocalizedMessagesDirective, selector: "[kendoPivotGridLocalizedMessages]" }, { type: i9.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PivotGridComponent, decorators: [{
             type: Component,
             args: [{
@@ -533,7 +539,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
             class="k-pivotgrid-configurator-button"
             aria-hidden="true"
             (click)="toggleConfigurator()">
-            <span>{{messageFor('configuratorButtonText')}}<span class="k-icon k-i-gear k-color-inherit"></span>
+            <span>{{messageFor('configuratorButtonText')}}<kendo-icon-wrapper name="gear" innerCssClass="k-color-inherit" [svgIcon]="gearSVGIcon"></kendo-icon-wrapper>
             </span>
         </div>
    `

package/esm2020/pivotgrid.module.mjs

@@ -19,6 +19,7 @@ import { DropTargetDirective } from './configurator/drop-target.directive';
 import { ChipMenuModule } from './configurator/chip-menu/chip-menu.module';
 import { SharedModule } from './shared.module';
 import { ChipKeyboardNavigationDirective } from './configurator/chip-kb-nav.directive';
+import { IconsModule } from '@progress/kendo-angular-icons';
 import * as i0 from "@angular/core";
 const IMPORTED_MODULES = [
     EventsModule,
@@ -26,7 +27,8 @@ const IMPORTED_MODULES = [
     TreeViewModule,
     DraggableModule,
     ChipMenuModule,
-    SharedModule
+    SharedModule,
+    IconsModule
 ];
 const DECLARATIONS = [
     PivotGridComponent,
@@ -70,7 +72,8 @@ PivotGridModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version
         TreeViewModule,
         DraggableModule,
         ChipMenuModule,
-        SharedModule], exports: [PivotGridComponent,
+        SharedModule,
+        IconsModule], exports: [PivotGridComponent,
         PivotGridTableComponent,
         PivotGridCellDirective,
         PivotLocalBindingDirective,

package/esm2020/rendering/pivotgrid-cell.directive.mjs

@@ -3,11 +3,13 @@
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import { Component, ElementRef, HostBinding, Input, Renderer2 } from '@angular/core';
+import { chevronDownIcon, chevronUpIcon } from '@progress/kendo-svg-icons';
 import { PivotGridDataService } from '../data-binding/pivotgrid-data.service';
 import * as i0 from "@angular/core";
 import * as i1 from "../data-binding/pivotgrid-data.service";
-import * as i2 from "@angular/common";
-import * as i3 from "@progress/kendo-angular-common";
+import * as i2 from "@progress/kendo-angular-icons";
+import * as i3 from "@angular/common";
+import * as i4 from "@progress/kendo-angular-common";
 /**
  * @hidden
  */
@@ -17,6 +19,8 @@ export class PivotGridCellDirective {
         this.renderer = renderer;
         this.dataService = dataService;
         this.cellClass = true;
+        this.chevronUpSVGIcon = chevronUpIcon;
+        this.chevronDownSVGIcon = chevronDownIcon;
         this.handleClick = () => {
             this.dataService.expandedStateChange.emit({
                 action: this.expanded ? 'collapse' : 'expand',
@@ -49,34 +53,28 @@ export class PivotGridCellDirective {
 }
 PivotGridCellDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PivotGridCellDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i1.PivotGridDataService }], target: i0.ɵɵFactoryTarget.Component });
 PivotGridCellDirective.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: PivotGridCellDirective, selector: "[kendoPivotGridCell]", inputs: { kendoPivotGridCell: "kendoPivotGridCell", tableType: "tableType", rowIndex: "rowIndex", colIndex: "colIndex" }, host: { properties: { "class.k-pivotgrid-cell": "this.cellClass" } }, ngImport: i0, template: `
-        <span 
+        <kendo-icon-wrapper
             *ngIf="kendoPivotGridCell.hasChildren && !kendoPivotGridCell.total"
-            class="k-icon"
             aria-hidden="true"
-            [kendoEventsOutsideAngular]="{
-                click: handleClick
-            }"
-            [ngClass]="{
-                'k-i-arrow-chevron-up': expanded,
-                'k-i-arrow-chevron-down': !expanded
-            }"></span>{{ kendoPivotGridCell.data ? kendoPivotGridCell.data.fmtValue : kendoPivotGridCell.caption }}`, isInline: true, directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }, { type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
+            [kendoEventsOutsideAngular]="{ click: handleClick }"
+            [name]="expanded ? 'chevron-up' : 'chevron-down'"
+            [svgIcon]="expanded ? chevronUpSVGIcon : chevronDownSVGIcon">
+        </kendo-icon-wrapper>
+        {{ kendoPivotGridCell.data ? kendoPivotGridCell.data.fmtValue : kendoPivotGridCell.caption }}`, isInline: true, components: [{ type: i2.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass"], exportAs: ["kendoIconWrapper"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PivotGridCellDirective, decorators: [{
             type: Component,
             args: [{
                     // eslint-disable-next-line @angular-eslint/component-selector
                     selector: '[kendoPivotGridCell]',
                     template: `
-        <span 
+        <kendo-icon-wrapper
             *ngIf="kendoPivotGridCell.hasChildren && !kendoPivotGridCell.total"
-            class="k-icon"
             aria-hidden="true"
-            [kendoEventsOutsideAngular]="{
-                click: handleClick
-            }"
-            [ngClass]="{
-                'k-i-arrow-chevron-up': expanded,
-                'k-i-arrow-chevron-down': !expanded
-            }"></span>{{ kendoPivotGridCell.data ? kendoPivotGridCell.data.fmtValue : kendoPivotGridCell.caption }}`
+            [kendoEventsOutsideAngular]="{ click: handleClick }"
+            [name]="expanded ? 'chevron-up' : 'chevron-down'"
+            [svgIcon]="expanded ? chevronUpSVGIcon : chevronDownSVGIcon">
+        </kendo-icon-wrapper>
+        {{ kendoPivotGridCell.data ? kendoPivotGridCell.data.fmtValue : kendoPivotGridCell.caption }}`
                 }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i1.PivotGridDataService }]; }, propDecorators: { cellClass: [{
                 type: HostBinding,

package/esm2020/shared.module.mjs

@@ -7,11 +7,13 @@ import { CommonModule } from '@angular/common';
 import { DropDownsModule } from '@progress/kendo-angular-dropdowns';
 import { InputsModule } from '@progress/kendo-angular-inputs';
 import { ButtonsModule } from '@progress/kendo-angular-buttons';
+import { IconsModule } from '@progress/kendo-angular-icons';
 import * as i0 from "@angular/core";
 const MODULES = [
     CommonModule,
     DropDownsModule,
     InputsModule,
+    IconsModule,
     ButtonsModule
 ];
 /**
@@ -23,13 +25,16 @@ SharedModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "1
 SharedModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: SharedModule, imports: [CommonModule,
         DropDownsModule,
         InputsModule,
+        IconsModule,
         ButtonsModule], exports: [CommonModule,
         DropDownsModule,
         InputsModule,
+        IconsModule,
         ButtonsModule] });
 SharedModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: SharedModule, imports: [[MODULES], CommonModule,
         DropDownsModule,
         InputsModule,
+        IconsModule,
         ButtonsModule] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: SharedModule, decorators: [{
             type: NgModule,