@progress/kendo-angular-grid 7.2.3-dev.202207251011 → 7.2.4-dev.202208010816

package/esm2015/column-menu/column-menu-item.component.js

@@ -85,8 +85,8 @@ ColumnMenuItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0"
             class="k-columnmenu-item"
             (click)="onClick($event)"
             (keydown.enter)="onClick($event)"
-            [class.k-state-selected]="selected"
-            [class.k-state-disabled]="disabled"
+            [class.k-selected]="selected"
+            [class.k-disabled]="disabled"
             role="button"
             [attr.aria-expanded]="expanded">
            <span *ngIf="icon" class="k-icon" [ngClass]="iconClass">
@@ -152,8 +152,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
             class="k-columnmenu-item"
             (click)="onClick($event)"
             (keydown.enter)="onClick($event)"
-            [class.k-state-selected]="selected"
-            [class.k-state-disabled]="disabled"
+            [class.k-selected]="selected"
+            [class.k-disabled]="disabled"
             role="button"
             [attr.aria-expanded]="expanded">
            <span *ngIf="icon" class="k-icon" [ngClass]="iconClass">

package/esm2015/column-menu/column-menu.component.js

@@ -168,7 +168,7 @@ ColumnMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ve
     ], viewQueries: [{ propertyName: "anchor", first: true, predicate: ["anchor"], descendants: true, static: true }, { propertyName: "template", first: true, predicate: ["template"], descendants: true, read: TemplateRef, static: true }], usesOnChanges: true, ngImport: i0, template: `
         <a #anchor
             class="k-grid-column-menu k-grid-filter"
-            [ngClass]="{ 'k-state-active': isActive }"
+            [ngClass]="{ 'k-active': isActive }"
             (click)="toggle($event, anchor, template)"
             (keydown.enter)="$event.stopImmediatePropagation()"
             href="#"
@@ -229,7 +229,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                     template: `
         <a #anchor
             class="k-grid-column-menu k-grid-filter"
-            [ngClass]="{ 'k-state-active': isActive }"
+            [ngClass]="{ 'k-active': isActive }"
             (click)="toggle($event, anchor, template)"
             (keydown.enter)="$event.stopImmediatePropagation()"
             href="#"

package/esm2015/filtering/menu/filter-menu.component.js

@@ -59,7 +59,7 @@ export class FilterMenuComponent {
 FilterMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: FilterMenuComponent, deps: [{ token: i1.FilterService }, { token: i2.SinglePopupService }, { token: i3.LocalizationService }, { token: i4.NavigationService }], target: i0.ɵɵFactoryTarget.Component });
 FilterMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FilterMenuComponent, selector: "kendo-grid-filter-menu", inputs: { column: "column", filter: "filter", tabIndex: "tabIndex" }, viewQueries: [{ propertyName: "anchor", first: true, predicate: ["anchor"], descendants: true, static: true }, { propertyName: "template", first: true, predicate: ["template"], descendants: true, read: TemplateRef, static: true }], ngImport: i0, template: `
         <a #anchor
-            [ngClass]="{'k-grid-filter':true, 'k-state-active': hasFilters}"
+            [ngClass]="{'k-grid-filter':true, 'k-active': hasFilters}"
             [tabindex]="tabIndex"
             (click)="toggle(anchor, template)"
             (keydown.enter)="$event.stopImmediatePropagation()"
@@ -84,7 +84,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                     selector: 'kendo-grid-filter-menu',
                     template: `
         <a #anchor
-            [ngClass]="{'k-grid-filter':true, 'k-state-active': hasFilters}"
+            [ngClass]="{'k-grid-filter':true, 'k-active': hasFilters}"
             [tabindex]="tabIndex"
             (click)="toggle(anchor, template)"
             (keydown.enter)="$event.stopImmediatePropagation()"

package/esm2015/grid.component.js

@@ -661,7 +661,7 @@ export class GridComponent {
      * ```
      */
     set rowClass(fn) {
-        if (isDevMode && typeof fn !== 'function') {
+        if (isDevMode() && typeof fn !== 'function') {
             throw new Error(`rowClass must be a function, but received ${JSON.stringify(fn)}.`);
         }
         this._rowClass = fn;
@@ -674,7 +674,7 @@ export class GridComponent {
      * and determines whether the row will be sticky, i.e. always visible after scrolling.
      */
     set rowSticky(fn) {
-        if (isDevMode && isPresent(fn) && typeof fn !== 'function') {
+        if (isDevMode() && isPresent(fn) && typeof fn !== 'function') {
             throw new Error(`rowSticky must be a function, but received ${JSON.stringify(fn)}.`);
         }
         if (isPresent(fn)) {
@@ -690,7 +690,7 @@ export class GridComponent {
      * Determines whether the row will be selected.
      */
     set rowSelected(fn) {
-        if (isDevMode && typeof fn !== 'function') {
+        if (isDevMode() && typeof fn !== 'function') {
             throw new Error(`rowSelected must be a function, but received ${JSON.stringify(fn)}.`);
         }
         this._rowSelected = fn;
@@ -707,7 +707,7 @@ export class GridComponent {
      * as part of a change detection cycle. ([see example]({% slug grid_selection_custom %}#toc-setting-the-selected-cells))
      */
     set cellSelected(fn) {
-        if (isDevMode && typeof fn !== 'function') {
+        if (isDevMode() && typeof fn !== 'function') {
             throw new Error(`cellSelected must be a function, but received ${JSON.stringify(fn)}.`);
         }
         this._cellSelected = fn;

package/esm2015/navigation/logical-cell.directive.js

@@ -102,14 +102,14 @@ export class LogicalCellDirective {
                 if (!this.logicalSlaveCell && this.navigationService.autoFocusCell(this.logicalColIndex, this.logicalColIndex + this.colSpan - 1)) {
                     this.microtask(() => this.isFocused() && el.focus());
                 }
-                this.renderer.addClass(el, 'k-state-focused');
+                this.renderer.addClass(el, 'k-focus');
             }
             if (this.headerLabelText) {
                 el.setAttribute('aria-label', '');
             }
         }
         else {
-            this.renderer.removeClass(el, 'k-state-focused');
+            this.renderer.removeClass(el, 'k-focus');
             if (this.headerLabelText) {
                 el.setAttribute('aria-label', this.headerLabelText);
             }

package/esm2015/package-metadata.js

@@ -9,7 +9,7 @@ export const packageMetadata = {
     name: '@progress/kendo-angular-grid',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1658743777,
+    publishDate: 1659341662,
     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/esm2015/pager/pager-next-buttons.component.js

@@ -47,7 +47,7 @@ PagerNextButtonsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.
             [ngClass]="{
                 'k-link': true,
                 'k-pager-nav': true,
-                'k-state-disabled': disabled,
+                'k-disabled': disabled,
                 '': true
             }">
             <span role="note" [attr.aria-label]="textFor('pagerNextPage')"
@@ -67,7 +67,7 @@ PagerNextButtonsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.
             [ngClass]="{
                 'k-link': true,
                 'k-pager-nav': true,
-                'k-state-disabled': disabled,
+                'k-disabled': disabled,
                 'k-pager-last': true
             }">
             <span role="note" [attr.aria-label]="textFor('pagerLastPage')"
@@ -94,7 +94,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
             [ngClass]="{
                 'k-link': true,
                 'k-pager-nav': true,
-                'k-state-disabled': disabled,
+                'k-disabled': disabled,
                 '': true
             }">
             <span role="note" [attr.aria-label]="textFor('pagerNextPage')"
@@ -114,7 +114,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
             [ngClass]="{
                 'k-link': true,
                 'k-pager-nav': true,
-                'k-state-disabled': disabled,
+                'k-disabled': disabled,
                 'k-pager-last': true
             }">
             <span role="note" [attr.aria-label]="textFor('pagerLastPage')"

package/esm2015/pager/pager-numeric-buttons.component.js

@@ -103,7 +103,7 @@ PagerNumericButtonsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12
                 [selected]="num === currentPage"
                 [attr.aria-label]="pageLabel(num)"
                 [attr.aria-current]="currentPage === num ? 'page' : undefined"
-                [ngClass]="{'k-link': true, 'k-state-selected':currentPage === num}">
+                [ngClass]="{'k-link': true, 'k-selected':currentPage === num}">
                 {{num}}
             </option>
             <option *ngIf="end < totalPages"
@@ -130,7 +130,7 @@ PagerNumericButtonsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12
                     tabindex="0"
                     role="button"
                     [attr.aria-label]="pageLabel(num)"
-                    [ngClass]="{'k-link': true, 'k-state-selected':currentPage === num, 'k-pager-nav': true}"
+                    [ngClass]="{'k-link': true, 'k-selected':currentPage === num, 'k-pager-nav': true}"
                     (click)="changePage(num - 1)"
                     (keydown.enter)="changePage(num - 1)">
                     {{num}}
@@ -170,7 +170,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                 [selected]="num === currentPage"
                 [attr.aria-label]="pageLabel(num)"
                 [attr.aria-current]="currentPage === num ? 'page' : undefined"
-                [ngClass]="{'k-link': true, 'k-state-selected':currentPage === num}">
+                [ngClass]="{'k-link': true, 'k-selected':currentPage === num}">
                 {{num}}
             </option>
             <option *ngIf="end < totalPages"
@@ -197,7 +197,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                     tabindex="0"
                     role="button"
                     [attr.aria-label]="pageLabel(num)"
-                    [ngClass]="{'k-link': true, 'k-state-selected':currentPage === num, 'k-pager-nav': true}"
+                    [ngClass]="{'k-link': true, 'k-selected':currentPage === num, 'k-pager-nav': true}"
                     (click)="changePage(num - 1)"
                     (keydown.enter)="changePage(num - 1)">
                     {{num}}

package/esm2015/pager/pager-prev-buttons.component.js

@@ -46,7 +46,7 @@ PagerPrevButtonsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.
             [ngClass]="{
                 'k-link': true,
                 'k-pager-nav': true,
-                'k-state-disabled': disabled,
+                'k-disabled': disabled,
                 'k-pager-first': true
             }">
             <span role="note"
@@ -66,7 +66,7 @@ PagerPrevButtonsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.
             [ngClass]="{
                 'k-link': true,
                 'k-pager-nav': true,
-                'k-state-disabled': disabled,
+                'k-disabled': disabled,
                 '': true
             }">
             <span role="note"
@@ -93,7 +93,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
             [ngClass]="{
                 'k-link': true,
                 'k-pager-nav': true,
-                'k-state-disabled': disabled,
+                'k-disabled': disabled,
                 'k-pager-first': true
             }">
             <span role="note"
@@ -113,7 +113,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
             [ngClass]="{
                 'k-link': true,
                 'k-pager-nav': true,
-                'k-state-disabled': disabled,
+                'k-disabled': disabled,
                 '': true
             }">
             <span role="note"

package/esm2015/pager/pager.component.js

@@ -229,7 +229,7 @@ export class PagerComponent {
     }
 }
 PagerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: PagerComponent, deps: [{ token: i1.PagerContextService }, { token: i2.NavigationService }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.NgZone }, { token: i3.LocalizationService }, { token: CELL_CONTEXT, optional: true }, { token: i4.FocusRoot }, { token: i5.FocusGroup }], target: i0.ɵɵFactoryTarget.Component });
-PagerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: PagerComponent, selector: "kendo-pager", inputs: { total: "total", skip: "skip", pageSize: "pageSize", options: "options", template: "template" }, outputs: { pageChange: "pageChange" }, host: { listeners: { "focusin": "onFocusIn($event)", "focusout": "onFocusOut()", "keydown.escape": "onEscape()", "keydown.enter": "onEnter($event)", "keydown.arrowleft": "navigateToPreviousPage($event)", "keydown.pageup": "navigateToPreviousPage($event)", "keydown.arrowright": "navigateToNextPage($event)", "keydown.pagedown": "navigateToNextPage($event)", "keydown.home": "navigateToFirstPage($event)", "keydown.end": "navigateToLastPage($event)" }, properties: { "class.k-pager-wrap": "this.pagerWrapClass", "class.k-grid-pager": "this.gridPagerClass", "class.k-state-focused": "this.isFocused", "attr.aria-label": "this.pagerAriaLabel" } }, providers: [{
+PagerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: PagerComponent, selector: "kendo-pager", inputs: { total: "total", skip: "skip", pageSize: "pageSize", options: "options", template: "template" }, outputs: { pageChange: "pageChange" }, host: { listeners: { "focusin": "onFocusIn($event)", "focusout": "onFocusOut()", "keydown.escape": "onEscape()", "keydown.enter": "onEnter($event)", "keydown.arrowleft": "navigateToPreviousPage($event)", "keydown.pageup": "navigateToPreviousPage($event)", "keydown.arrowright": "navigateToNextPage($event)", "keydown.pagedown": "navigateToNextPage($event)", "keydown.home": "navigateToFirstPage($event)", "keydown.end": "navigateToLastPage($event)" }, properties: { "class.k-pager-wrap": "this.pagerWrapClass", "class.k-grid-pager": "this.gridPagerClass", "class.k-focus": "this.isFocused", "attr.aria-label": "this.pagerAriaLabel" } }, providers: [{
             provide: FOCUS_ROOT_ACTIVE,
             useValue: true
         }, {
@@ -356,7 +356,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                 args: ['class.k-grid-pager']
             }], isFocused: [{
                 type: HostBinding,
-                args: ['class.k-state-focused']
+                args: ['class.k-focus']
             }], pagerAriaLabel: [{
                 type: HostBinding,
                 args: ['attr.aria-label']

package/esm2015/rendering/table-body.component.js

@@ -445,7 +445,7 @@ TableBodyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ver
             [class.k-master-row]="detailTemplate?.templateRef"
             [class.k-grid-edit-row]="isEditingRow($any(item).index)"
             [attr.data-kendo-grid-item-index]="$any(item).index"
-            [class.k-state-selected]="isSelectable() && isRowSelected(item)">
+            [class.k-selected]="isSelectable() && isRowSelected(item)">
             <ng-container *ngIf="!skipGroupDecoration">
                 <td class="k-group-cell" *ngFor="let g of groups" role="presentation"></td>
             </ng-container>
@@ -492,7 +492,7 @@ TableBodyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ver
                 [class.k-grid-edit-cell]="isEditingCell($any(item).index, column)"
                 [ngStyle]="column.sticky ? addStickyColumnStyles(column) : column.style"
                 [attr.colspan]="column.colspan"
-                [class.k-state-selected]="isSelectable && cellSelectionService.isCellSelected(item, column)"
+                [class.k-selected]="isSelectable && cellSelectionService.isCellSelected(item, column)"
                 *ngFor="let column of columns; let columnIndex = index; trackBy: trackByColumns;">
             </td>
         </tr>
@@ -664,7 +664,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
             [class.k-master-row]="detailTemplate?.templateRef"
             [class.k-grid-edit-row]="isEditingRow($any(item).index)"
             [attr.data-kendo-grid-item-index]="$any(item).index"
-            [class.k-state-selected]="isSelectable() && isRowSelected(item)">
+            [class.k-selected]="isSelectable() && isRowSelected(item)">
             <ng-container *ngIf="!skipGroupDecoration">
                 <td class="k-group-cell" *ngFor="let g of groups" role="presentation"></td>
             </ng-container>
@@ -711,7 +711,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                 [class.k-grid-edit-cell]="isEditingCell($any(item).index, column)"
                 [ngStyle]="column.sticky ? addStickyColumnStyles(column) : column.style"
                 [attr.colspan]="column.colspan"
-                [class.k-state-selected]="isSelectable && cellSelectionService.isCellSelected(item, column)"
+                [class.k-selected]="isSelectable && cellSelectionService.isCellSelected(item, column)"
                 *ngFor="let column of columns; let columnIndex = index; trackBy: trackByColumns;">
             </td>
         </tr>

package/esm2015/selection/marquee.directive.js

@@ -52,7 +52,8 @@ export class GridMarqueeDirective {
         this.clean();
     }
     start(args) {
-        if (args.originalEvent.target.classList.contains('k-checkbox')) {
+        const isInvalidTarget = args.originalEvent.target.matches('.k-grid-content, .k-grid-content-locked, .k-grid-aria-root, .k-checkbox');
+        if (isInvalidTarget) {
             this.pressArgs = null;
             return;
         }

package/fesm2015/kendo-angular-grid.js

@@ -2683,7 +2683,8 @@ class GridMarqueeDirective {
         this.clean();
     }
     start(args) {
-        if (args.originalEvent.target.classList.contains('k-checkbox')) {
+        const isInvalidTarget = args.originalEvent.target.matches('.k-grid-content, .k-grid-content-locked, .k-grid-aria-root, .k-checkbox');
+        if (isInvalidTarget) {
             this.pressArgs = null;
             return;
         }
@@ -2835,7 +2836,7 @@ const packageMetadata = {
     name: '@progress/kendo-angular-grid',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1658743777,
+    publishDate: 1659341662,
     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'
 };
@@ -6799,7 +6800,7 @@ PagerPrevButtonsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.
             [ngClass]="{
                 'k-link': true,
                 'k-pager-nav': true,
-                'k-state-disabled': disabled,
+                'k-disabled': disabled,
                 'k-pager-first': true
             }">
             <span role="note"
@@ -6819,7 +6820,7 @@ PagerPrevButtonsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.
             [ngClass]="{
                 'k-link': true,
                 'k-pager-nav': true,
-                'k-state-disabled': disabled,
+                'k-disabled': disabled,
                 '': true
             }">
             <span role="note"
@@ -6846,7 +6847,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
             [ngClass]="{
                 'k-link': true,
                 'k-pager-nav': true,
-                'k-state-disabled': disabled,
+                'k-disabled': disabled,
                 'k-pager-first': true
             }">
             <span role="note"
@@ -6866,7 +6867,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
             [ngClass]="{
                 'k-link': true,
                 'k-pager-nav': true,
-                'k-state-disabled': disabled,
+                'k-disabled': disabled,
                 '': true
             }">
             <span role="note"
@@ -6975,7 +6976,7 @@ PagerNumericButtonsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12
                 [selected]="num === currentPage"
                 [attr.aria-label]="pageLabel(num)"
                 [attr.aria-current]="currentPage === num ? 'page' : undefined"
-                [ngClass]="{'k-link': true, 'k-state-selected':currentPage === num}">
+                [ngClass]="{'k-link': true, 'k-selected':currentPage === num}">
                 {{num}}
             </option>
             <option *ngIf="end < totalPages"
@@ -7002,7 +7003,7 @@ PagerNumericButtonsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12
                     tabindex="0"
                     role="button"
                     [attr.aria-label]="pageLabel(num)"
-                    [ngClass]="{'k-link': true, 'k-state-selected':currentPage === num, 'k-pager-nav': true}"
+                    [ngClass]="{'k-link': true, 'k-selected':currentPage === num, 'k-pager-nav': true}"
                     (click)="changePage(num - 1)"
                     (keydown.enter)="changePage(num - 1)">
                     {{num}}
@@ -7042,7 +7043,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                 [selected]="num === currentPage"
                 [attr.aria-label]="pageLabel(num)"
                 [attr.aria-current]="currentPage === num ? 'page' : undefined"
-                [ngClass]="{'k-link': true, 'k-state-selected':currentPage === num}">
+                [ngClass]="{'k-link': true, 'k-selected':currentPage === num}">
                 {{num}}
             </option>
             <option *ngIf="end < totalPages"
@@ -7069,7 +7070,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                     tabindex="0"
                     role="button"
                     [attr.aria-label]="pageLabel(num)"
-                    [ngClass]="{'k-link': true, 'k-state-selected':currentPage === num, 'k-pager-nav': true}"
+                    [ngClass]="{'k-link': true, 'k-selected':currentPage === num, 'k-pager-nav': true}"
                     (click)="changePage(num - 1)"
                     (keydown.enter)="changePage(num - 1)">
                     {{num}}
@@ -7323,7 +7324,7 @@ PagerNextButtonsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.
             [ngClass]="{
                 'k-link': true,
                 'k-pager-nav': true,
-                'k-state-disabled': disabled,
+                'k-disabled': disabled,
                 '': true
             }">
             <span role="note" [attr.aria-label]="textFor('pagerNextPage')"
@@ -7343,7 +7344,7 @@ PagerNextButtonsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.
             [ngClass]="{
                 'k-link': true,
                 'k-pager-nav': true,
-                'k-state-disabled': disabled,
+                'k-disabled': disabled,
                 'k-pager-last': true
             }">
             <span role="note" [attr.aria-label]="textFor('pagerLastPage')"
@@ -7370,7 +7371,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
             [ngClass]="{
                 'k-link': true,
                 'k-pager-nav': true,
-                'k-state-disabled': disabled,
+                'k-disabled': disabled,
                 '': true
             }">
             <span role="note" [attr.aria-label]="textFor('pagerNextPage')"
@@ -7390,7 +7391,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
             [ngClass]="{
                 'k-link': true,
                 'k-pager-nav': true,
-                'k-state-disabled': disabled,
+                'k-disabled': disabled,
                 'k-pager-last': true
             }">
             <span role="note" [attr.aria-label]="textFor('pagerLastPage')"
@@ -7912,7 +7913,7 @@ class PagerComponent {
     }
 }
 PagerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: PagerComponent, deps: [{ token: PagerContextService }, { token: NavigationService }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.NgZone }, { token: i1.LocalizationService }, { token: CELL_CONTEXT, optional: true }, { token: FocusRoot }, { token: FocusGroup }], target: i0.ɵɵFactoryTarget.Component });
-PagerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: PagerComponent, selector: "kendo-pager", inputs: { total: "total", skip: "skip", pageSize: "pageSize", options: "options", template: "template" }, outputs: { pageChange: "pageChange" }, host: { listeners: { "focusin": "onFocusIn($event)", "focusout": "onFocusOut()", "keydown.escape": "onEscape()", "keydown.enter": "onEnter($event)", "keydown.arrowleft": "navigateToPreviousPage($event)", "keydown.pageup": "navigateToPreviousPage($event)", "keydown.arrowright": "navigateToNextPage($event)", "keydown.pagedown": "navigateToNextPage($event)", "keydown.home": "navigateToFirstPage($event)", "keydown.end": "navigateToLastPage($event)" }, properties: { "class.k-pager-wrap": "this.pagerWrapClass", "class.k-grid-pager": "this.gridPagerClass", "class.k-state-focused": "this.isFocused", "attr.aria-label": "this.pagerAriaLabel" } }, providers: [{
+PagerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: PagerComponent, selector: "kendo-pager", inputs: { total: "total", skip: "skip", pageSize: "pageSize", options: "options", template: "template" }, outputs: { pageChange: "pageChange" }, host: { listeners: { "focusin": "onFocusIn($event)", "focusout": "onFocusOut()", "keydown.escape": "onEscape()", "keydown.enter": "onEnter($event)", "keydown.arrowleft": "navigateToPreviousPage($event)", "keydown.pageup": "navigateToPreviousPage($event)", "keydown.arrowright": "navigateToNextPage($event)", "keydown.pagedown": "navigateToNextPage($event)", "keydown.home": "navigateToFirstPage($event)", "keydown.end": "navigateToLastPage($event)" }, properties: { "class.k-pager-wrap": "this.pagerWrapClass", "class.k-grid-pager": "this.gridPagerClass", "class.k-focus": "this.isFocused", "attr.aria-label": "this.pagerAriaLabel" } }, providers: [{
             provide: FOCUS_ROOT_ACTIVE,
             useValue: true
         }, {
@@ -8039,7 +8040,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                 args: ['class.k-grid-pager']
             }], isFocused: [{
                 type: HostBinding,
-                args: ['class.k-state-focused']
+                args: ['class.k-focus']
             }], pagerAriaLabel: [{
                 type: HostBinding,
                 args: ['attr.aria-label']
@@ -11024,7 +11025,7 @@ class FilterMenuComponent {
 FilterMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: FilterMenuComponent, deps: [{ token: FilterService }, { token: SinglePopupService }, { token: i1.LocalizationService }, { token: NavigationService }], target: i0.ɵɵFactoryTarget.Component });
 FilterMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FilterMenuComponent, selector: "kendo-grid-filter-menu", inputs: { column: "column", filter: "filter", tabIndex: "tabIndex" }, viewQueries: [{ propertyName: "anchor", first: true, predicate: ["anchor"], descendants: true, static: true }, { propertyName: "template", first: true, predicate: ["template"], descendants: true, read: TemplateRef, static: true }], ngImport: i0, template: `
         <a #anchor
-            [ngClass]="{'k-grid-filter':true, 'k-state-active': hasFilters}"
+            [ngClass]="{'k-grid-filter':true, 'k-active': hasFilters}"
             [tabindex]="tabIndex"
             (click)="toggle(anchor, template)"
             (keydown.enter)="$event.stopImmediatePropagation()"
@@ -11049,7 +11050,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                     selector: 'kendo-grid-filter-menu',
                     template: `
         <a #anchor
-            [ngClass]="{'k-grid-filter':true, 'k-state-active': hasFilters}"
+            [ngClass]="{'k-grid-filter':true, 'k-active': hasFilters}"
             [tabindex]="tabIndex"
             (click)="toggle(anchor, template)"
             (keydown.enter)="$event.stopImmediatePropagation()"
@@ -11297,8 +11298,8 @@ ColumnMenuItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0"
             class="k-columnmenu-item"
             (click)="onClick($event)"
             (keydown.enter)="onClick($event)"
-            [class.k-state-selected]="selected"
-            [class.k-state-disabled]="disabled"
+            [class.k-selected]="selected"
+            [class.k-disabled]="disabled"
             role="button"
             [attr.aria-expanded]="expanded">
            <span *ngIf="icon" class="k-icon" [ngClass]="iconClass">
@@ -11364,8 +11365,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
             class="k-columnmenu-item"
             (click)="onClick($event)"
             (keydown.enter)="onClick($event)"
-            [class.k-state-selected]="selected"
-            [class.k-state-disabled]="disabled"
+            [class.k-selected]="selected"
+            [class.k-disabled]="disabled"
             role="button"
             [attr.aria-expanded]="expanded">
            <span *ngIf="icon" class="k-icon" [ngClass]="iconClass">
@@ -12627,7 +12628,7 @@ ColumnMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ve
     ], viewQueries: [{ propertyName: "anchor", first: true, predicate: ["anchor"], descendants: true, static: true }, { propertyName: "template", first: true, predicate: ["template"], descendants: true, read: TemplateRef, static: true }], usesOnChanges: true, ngImport: i0, template: `
         <a #anchor
             class="k-grid-column-menu k-grid-filter"
-            [ngClass]="{ 'k-state-active': isActive }"
+            [ngClass]="{ 'k-active': isActive }"
             (click)="toggle($event, anchor, template)"
             (keydown.enter)="$event.stopImmediatePropagation()"
             href="#"
@@ -12688,7 +12689,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                     template: `
         <a #anchor
             class="k-grid-column-menu k-grid-filter"
-            [ngClass]="{ 'k-state-active': isActive }"
+            [ngClass]="{ 'k-active': isActive }"
             (click)="toggle($event, anchor, template)"
             (keydown.enter)="$event.stopImmediatePropagation()"
             href="#"
@@ -13572,14 +13573,14 @@ class LogicalCellDirective {
                 if (!this.logicalSlaveCell && this.navigationService.autoFocusCell(this.logicalColIndex, this.logicalColIndex + this.colSpan - 1)) {
                     this.microtask(() => this.isFocused() && el.focus());
                 }
-                this.renderer.addClass(el, 'k-state-focused');
+                this.renderer.addClass(el, 'k-focus');
             }
             if (this.headerLabelText) {
                 el.setAttribute('aria-label', '');
             }
         }
         else {
-            this.renderer.removeClass(el, 'k-state-focused');
+            this.renderer.removeClass(el, 'k-focus');
             if (this.headerLabelText) {
                 el.setAttribute('aria-label', this.headerLabelText);
             }
@@ -16383,7 +16384,7 @@ TableBodyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ver
             [class.k-master-row]="detailTemplate?.templateRef"
             [class.k-grid-edit-row]="isEditingRow($any(item).index)"
             [attr.data-kendo-grid-item-index]="$any(item).index"
-            [class.k-state-selected]="isSelectable() && isRowSelected(item)">
+            [class.k-selected]="isSelectable() && isRowSelected(item)">
             <ng-container *ngIf="!skipGroupDecoration">
                 <td class="k-group-cell" *ngFor="let g of groups" role="presentation"></td>
             </ng-container>
@@ -16430,7 +16431,7 @@ TableBodyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ver
                 [class.k-grid-edit-cell]="isEditingCell($any(item).index, column)"
                 [ngStyle]="column.sticky ? addStickyColumnStyles(column) : column.style"
                 [attr.colspan]="column.colspan"
-                [class.k-state-selected]="isSelectable && cellSelectionService.isCellSelected(item, column)"
+                [class.k-selected]="isSelectable && cellSelectionService.isCellSelected(item, column)"
                 *ngFor="let column of columns; let columnIndex = index; trackBy: trackByColumns;">
             </td>
         </tr>
@@ -16602,7 +16603,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
             [class.k-master-row]="detailTemplate?.templateRef"
             [class.k-grid-edit-row]="isEditingRow($any(item).index)"
             [attr.data-kendo-grid-item-index]="$any(item).index"
-            [class.k-state-selected]="isSelectable() && isRowSelected(item)">
+            [class.k-selected]="isSelectable() && isRowSelected(item)">
             <ng-container *ngIf="!skipGroupDecoration">
                 <td class="k-group-cell" *ngFor="let g of groups" role="presentation"></td>
             </ng-container>
@@ -16649,7 +16650,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                 [class.k-grid-edit-cell]="isEditingCell($any(item).index, column)"
                 [ngStyle]="column.sticky ? addStickyColumnStyles(column) : column.style"
                 [attr.colspan]="column.colspan"
-                [class.k-state-selected]="isSelectable && cellSelectionService.isCellSelected(item, column)"
+                [class.k-selected]="isSelectable && cellSelectionService.isCellSelected(item, column)"
                 *ngFor="let column of columns; let columnIndex = index; trackBy: trackByColumns;">
             </td>
         </tr>
@@ -18672,7 +18673,7 @@ class GridComponent {
      * ```
      */
     set rowClass(fn) {
-        if (isDevMode && typeof fn !== 'function') {
+        if (isDevMode() && typeof fn !== 'function') {
             throw new Error(`rowClass must be a function, but received ${JSON.stringify(fn)}.`);
         }
         this._rowClass = fn;
@@ -18685,7 +18686,7 @@ class GridComponent {
      * and determines whether the row will be sticky, i.e. always visible after scrolling.
      */
     set rowSticky(fn) {
-        if (isDevMode && isPresent(fn) && typeof fn !== 'function') {
+        if (isDevMode() && isPresent(fn) && typeof fn !== 'function') {
             throw new Error(`rowSticky must be a function, but received ${JSON.stringify(fn)}.`);
         }
         if (isPresent(fn)) {
@@ -18701,7 +18702,7 @@ class GridComponent {
      * Determines whether the row will be selected.
      */
     set rowSelected(fn) {
-        if (isDevMode && typeof fn !== 'function') {
+        if (isDevMode() && typeof fn !== 'function') {
             throw new Error(`rowSelected must be a function, but received ${JSON.stringify(fn)}.`);
         }
         this._rowSelected = fn;
@@ -18718,7 +18719,7 @@ class GridComponent {
      * as part of a change detection cycle. ([see example]({% slug grid_selection_custom %}#toc-setting-the-selected-cells))
      */
     set cellSelected(fn) {
-        if (isDevMode && typeof fn !== 'function') {
+        if (isDevMode() && typeof fn !== 'function') {
             throw new Error(`cellSelected must be a function, but received ${JSON.stringify(fn)}.`);
         }
         this._cellSelected = fn;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-angular-grid",
-  "version": "7.2.3-dev.202207251011",
+  "version": "7.2.4-dev.202208010816",
   "description": "Kendo UI Grid for Angular - high performance data grid with paging, filtering, virtualization, CRUD, and more.",
   "license": "SEE LICENSE IN LICENSE.md",
   "author": "Progress",