@progress/kendo-angular-grid 11.0.0-develop.80 → 11.0.0-develop.82

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

@@ -1,5 +1,5 @@
 /**-----------------------------------------------------------------------------------------
-* Copyright © 2022 Progress Software Corporation. All rights reserved.
+* Copyright © 2023 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import * as i0 from '@angular/core';
@@ -2855,7 +2855,7 @@ const packageMetadata = {
     name: '@progress/kendo-angular-grid',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1672394787,
+    publishDate: 1672862517,
     version: '',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
 };
@@ -11222,7 +11222,8 @@ class FilterMenuComponent {
 FilterMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", 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: "13.3.11", 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-menu':true, 'k-grid-header-menu':true, 'k-active': hasFilters}"
+            class="k-grid-filter-menu k-grid-header-menu"
+            [class.k-active]="hasFilters"
             [tabindex]="tabIndex"
             (click)="toggle(anchor, template)"
             (keydown.enter)="$event.stopImmediatePropagation()"
@@ -11240,14 +11241,15 @@ FilterMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ve
                 >
             </kendo-grid-filter-menu-container>
         </ng-template>
-    `, isInline: true, components: [{ type: FilterMenuContainerComponent, selector: "kendo-grid-filter-menu-container", inputs: ["column", "isLast", "isExpanded", "menuTabbingService", "filter", "actionsClass"], outputs: ["close"] }], directives: [{ type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
+    `, isInline: true, components: [{ type: FilterMenuContainerComponent, selector: "kendo-grid-filter-menu-container", inputs: ["column", "isLast", "isExpanded", "menuTabbingService", "filter", "actionsClass"], outputs: ["close"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: FilterMenuComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kendo-grid-filter-menu',
                     template: `
         <a #anchor
-            [ngClass]="{'k-grid-filter-menu':true, 'k-grid-header-menu':true, 'k-active': hasFilters}"
+            class="k-grid-filter-menu k-grid-header-menu"
+            [class.k-active]="hasFilters"
             [tabindex]="tabIndex"
             (click)="toggle(anchor, template)"
             (keydown.enter)="$event.stopImmediatePropagation()"
@@ -13989,11 +13991,6 @@ class LogicalCellDirective {
         }
         this.navigationChange = this.navigationService.changes.subscribe((e) => this.onNavigationChange(e));
     }
-    ngAfterViewInit() {
-        const el = this.element.nativeElement;
-        const elementType = el.tagName.toLowerCase();
-        this.renderer.addClass(el, `k-table-${elementType}`);
-    }
     ngDoCheck() {
         if (!this.navigationService.tableEnabled || this.logicalColIndex === -1) {
             return;
@@ -14154,16 +14151,19 @@ class FilterRowComponent {
 FilterRowComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: FilterRowComponent, deps: [{ token: i1.LocalizationService }, { token: ColumnInfoService }], target: i0.ɵɵFactoryTarget.Component });
 FilterRowComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: FilterRowComponent, selector: "[kendoGridFilterRow]", inputs: { columns: "columns", filter: "filter", groups: "groups", detailTemplate: "detailTemplate", logicalRowIndex: "logicalRowIndex", lockedColumnsCount: "lockedColumnsCount" }, host: { properties: { "class.k-filter-row": "this.filterRowClass" } }, ngImport: i0, template: `
         <td
+            class="k-table-td"
             [class.k-group-cell]="true"
             *ngFor="let g of groups"
             role="presentation">
         </td>
         <td
+            class="k-table-td"
             [class.k-hierarchy-cell]="true"
             *ngIf="detailTemplate?.templateRef"
             role="presentation">
         </td>
         <td *ngFor="let column of columns; let columnIndex = index"
+            class="k-table-td"
             [class.k-grid-header-sticky]="column.sticky"
             [ngStyle]="addStickyStyles(column)"
             [ngClass]="column.filterClass"
@@ -14182,16 +14182,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                     selector: '[kendoGridFilterRow]',
                     template: `
         <td
+            class="k-table-td"
             [class.k-group-cell]="true"
             *ngFor="let g of groups"
             role="presentation">
         </td>
         <td
+            class="k-table-td"
             [class.k-hierarchy-cell]="true"
             *ngIf="detailTemplate?.templateRef"
             role="presentation">
         </td>
         <td *ngFor="let column of columns; let columnIndex = index"
+            class="k-table-td"
             [class.k-grid-header-sticky]="column.sticky"
             [ngStyle]="addStickyStyles(column)"
             [ngClass]="column.filterClass"
@@ -15056,7 +15059,7 @@ HeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", versio
                 role="presentation"
                 *ngFor="let g of groups">
             </th>
-            <th class="k-hierarchy-cell k-header"
+            <th class="k-hierarchy-cell k-header k-table-th"
                 role="gridcell"
                 *ngIf="detailTemplate?.templateRef"
                 kendoGridLogicalCell
@@ -15089,7 +15092,7 @@ HeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", versio
                         hint: column.title || getColumnComponent(column).field,
                         lastColumn: last && columnIndex === 0
                     }"
-                    class="k-header"
+                    class="k-header k-table-th"
                     [class.k-filterable]="(showFilterMenu && isFilterable(getColumnComponent(column))) || showColumnMenu(column)"
                     [class.k-first]="isFirstOnRow(getColumnComponent(column), columnIndex)"
                     [class.k-grid-header-sticky]="column.sticky"
@@ -15209,7 +15212,7 @@ HeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", versio
                         hint: column.title,
                         lastColumn: last && columnIndex === 0
                     }"
-                    class="k-header"
+                    class="k-header k-table-th"
                     [class.k-first]="isFirstOnRow(getColumnComponent(column), columnIndex)"
                     [class.k-filterable]="showColumnMenu(column)"
                     [class.k-grid-content-sticky]="column.sticky"
@@ -15280,7 +15283,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                 role="presentation"
                 *ngFor="let g of groups">
             </th>
-            <th class="k-hierarchy-cell k-header"
+            <th class="k-hierarchy-cell k-header k-table-th"
                 role="gridcell"
                 *ngIf="detailTemplate?.templateRef"
                 kendoGridLogicalCell
@@ -15313,7 +15316,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                         hint: column.title || getColumnComponent(column).field,
                         lastColumn: last && columnIndex === 0
                     }"
-                    class="k-header"
+                    class="k-header k-table-th"
                     [class.k-filterable]="(showFilterMenu && isFilterable(getColumnComponent(column))) || showColumnMenu(column)"
                     [class.k-first]="isFirstOnRow(getColumnComponent(column), columnIndex)"
                     [class.k-grid-header-sticky]="column.sticky"
@@ -15433,7 +15436,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                         hint: column.title,
                         lastColumn: last && columnIndex === 0
                     }"
-                    class="k-header"
+                    class="k-header k-table-th"
                     [class.k-first]="isFirstOnRow(getColumnComponent(column), columnIndex)"
                     [class.k-filterable]="showColumnMenu(column)"
                     [class.k-grid-content-sticky]="column.sticky"
@@ -16348,13 +16351,14 @@ class GroupHeaderComponent {
 GroupHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GroupHeaderComponent, deps: [{ token: GroupsService }, { token: GroupInfoService }, { token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
 GroupHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: GroupHeaderComponent, selector: "[kendoGridGroupHeader]", inputs: { rowIndex: "rowIndex", logicalRowIndex: "logicalRowIndex", item: "item", skipGroupDecoration: "skipGroupDecoration", hasDetails: "hasDetails", totalColumnsCount: "totalColumnsCount", hasGroupHeaderColumn: "hasGroupHeaderColumn", groupHeaderColumns: "groupHeaderColumns", columns: "columns", groups: "groups" }, host: { properties: { "class.k-grouping-row": "this.groupItemClass", "class.k-table-group-row": "this.tableGroupRowClass" } }, ngImport: i0, template: `
         <ng-container *ngIf="!skipGroupDecoration">
-            <td class="k-group-cell"
+            <td class="k-group-cell k-table-td"
                 role="presentation"
                 *ngFor="let g of prefixGroupCell(item)"></td>
         </ng-container>
         <td [attr.colspan]="groupSpan(item)" *ngIf="!(skipGroupDecoration && hasGroupHeaderColumn)"
             [attr.role]="ariaRole()"
             aria-selected="false"
+            class="k-table-td"
             [attr.aria-expanded]="isExpanded"
             kendoGridLogicalCell
             [logicalRowIndex]="logicalRowIndex"
@@ -16391,6 +16395,7 @@ GroupHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", v
         <ng-container *ngIf="hasGroupHeaderColumn">
             <td *ngFor="let column of groupHeaderColumns; let index = index"
                 role="gridcell"
+                class="k-table-td"
                 aria-selected="false"
                 kendoGridLogicalCell
                 [logicalRowIndex]="logicalRowIndex"
@@ -16418,13 +16423,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                     selector: '[kendoGridGroupHeader]',
                     template: `
         <ng-container *ngIf="!skipGroupDecoration">
-            <td class="k-group-cell"
+            <td class="k-group-cell k-table-td"
                 role="presentation"
                 *ngFor="let g of prefixGroupCell(item)"></td>
         </ng-container>
         <td [attr.colspan]="groupSpan(item)" *ngIf="!(skipGroupDecoration && hasGroupHeaderColumn)"
             [attr.role]="ariaRole()"
             aria-selected="false"
+            class="k-table-td"
             [attr.aria-expanded]="isExpanded"
             kendoGridLogicalCell
             [logicalRowIndex]="logicalRowIndex"
@@ -16461,6 +16467,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
         <ng-container *ngIf="hasGroupHeaderColumn">
             <td *ngFor="let column of groupHeaderColumns; let index = index"
                 role="gridcell"
+                class="k-table-td"
                 aria-selected="false"
                 kendoGridLogicalCell
                 [logicalRowIndex]="logicalRowIndex"
@@ -16860,9 +16867,9 @@ TableBodyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ver
                 [logicalCellsCount]="columns.length"
                 [logicalSlaveCellsCount]="unlockedColumnsCount">
             <ng-container *ngIf="!skipGroupDecoration">
-                <td class="k-group-cell" *ngFor="let g of groups" role="presentation"></td>
+                <td class="k-group-cell k-table-td" *ngFor="let g of groups" role="presentation"></td>
             </ng-container>
-            <td class="k-hierarchy-cell"
+            <td class="k-hierarchy-cell k-table-td"
                 *ngIf="detailTemplate?.templateRef"
                 kendoGridLogicalCell
                     [logicalRowIndex]="addRowLogicalIndex()"
@@ -16871,6 +16878,7 @@ TableBodyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ver
                 >
             </td>
             <td *ngFor="let column of columns; let columnIndex = index; trackBy: trackByColumns;"
+                class="k-table-td"
                 kendoGridCell
                     [rowIndex]="-1"
                     [columnIndex]="lockedColumnsCount + columnIndex"
@@ -16891,7 +16899,7 @@ TableBodyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ver
         </tr>
     </ng-container>
     <tr *ngIf="data?.length === 0 || data === null" class="k-grid-norecords">
-        <td [attr.colspan]="colSpan">
+        <td [attr.colspan]="colSpan" class="k-table-td">
             <ng-template
                 *ngIf="noRecordsTemplate?.templateRef"
                 [templateContext]="{
@@ -16941,7 +16949,7 @@ TableBodyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ver
             <ng-container *ngIf="!skipGroupDecoration">
                 <td class="k-group-cell" *ngFor="let g of groups" role="presentation"></td>
             </ng-container>
-            <td class="k-hierarchy-cell"
+            <td class="k-hierarchy-cell k-table-td"
                 *ngIf="detailTemplate?.templateRef"
                 kendoGridLogicalCell
                     [logicalRowIndex]="logicalRowIndex(rowIndex)"
@@ -16976,6 +16984,7 @@ TableBodyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ver
                     [colIndex]="columnIndex"
                     [colSpan]="column.colspan"
                     role="gridcell"
+                    class="k-table-td"
                     [attr.aria-selected]="isSelectable() ? isAriaSelected(item, column) : undefined"
                     [class.k-grid-content-sticky]="column.sticky"
                     [class.k-touch-action-none]="isSelectable() && $any(selectable).drag"
@@ -17002,9 +17011,9 @@ TableBodyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ver
                 [logicalSlaveRow]="false"
                 [logicalCellsCount]="1"
             >
-            <td class="k-group-cell" *ngFor="let g of groups"></td>
-            <td class="k-hierarchy-cell"></td>
-            <td class="k-detail-cell"
+            <td class="k-group-cell k-table-td" *ngFor="let g of groups"></td>
+            <td class="k-hierarchy-cell k-table-td"></td>
+            <td class="k-detail-cell k-table-td"
                 [attr.colspan]="columnsSpan"
                 kendoGridLogicalCell
                     [logicalRowIndex]="logicalRowIndex(rowIndex) + 1"
@@ -17038,7 +17047,7 @@ TableBodyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ver
             <ng-container *ngIf="!skipGroupDecoration">
                 <td class="k-group-cell" *ngFor="let g of groups"></td>
             </ng-container>
-            <td class="k-hierarchy-cell"
+            <td class="k-hierarchy-cell k-table-td"
                 *ngIf="detailTemplate?.templateRef"
                 kendoGridLogicalCell
                     [logicalRowIndex]="logicalRowIndex(rowIndex)"
@@ -17050,6 +17059,7 @@ TableBodyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ver
                     [logicalRowIndex]="logicalRowIndex(rowIndex)"
                     [logicalColIndex]="logicalColIndex(column)"
                 [attr.data-skip]="skipGroupDecoration"
+                class="k-table-td"
                 *ngFor="let column of footerColumns; let columnIndex = index; trackBy: trackByColumns;">
                 <ng-template
                     [templateContext]="{
@@ -17079,9 +17089,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                 [logicalCellsCount]="columns.length"
                 [logicalSlaveCellsCount]="unlockedColumnsCount">
             <ng-container *ngIf="!skipGroupDecoration">
-                <td class="k-group-cell" *ngFor="let g of groups" role="presentation"></td>
+                <td class="k-group-cell k-table-td" *ngFor="let g of groups" role="presentation"></td>
             </ng-container>
-            <td class="k-hierarchy-cell"
+            <td class="k-hierarchy-cell k-table-td"
                 *ngIf="detailTemplate?.templateRef"
                 kendoGridLogicalCell
                     [logicalRowIndex]="addRowLogicalIndex()"
@@ -17090,6 +17100,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                 >
             </td>
             <td *ngFor="let column of columns; let columnIndex = index; trackBy: trackByColumns;"
+                class="k-table-td"
                 kendoGridCell
                     [rowIndex]="-1"
                     [columnIndex]="lockedColumnsCount + columnIndex"
@@ -17110,7 +17121,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
         </tr>
     </ng-container>
     <tr *ngIf="data?.length === 0 || data === null" class="k-grid-norecords">
-        <td [attr.colspan]="colSpan">
+        <td [attr.colspan]="colSpan" class="k-table-td">
             <ng-template
                 *ngIf="noRecordsTemplate?.templateRef"
                 [templateContext]="{
@@ -17160,7 +17171,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
             <ng-container *ngIf="!skipGroupDecoration">
                 <td class="k-group-cell" *ngFor="let g of groups" role="presentation"></td>
             </ng-container>
-            <td class="k-hierarchy-cell"
+            <td class="k-hierarchy-cell k-table-td"
                 *ngIf="detailTemplate?.templateRef"
                 kendoGridLogicalCell
                     [logicalRowIndex]="logicalRowIndex(rowIndex)"
@@ -17195,6 +17206,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                     [colIndex]="columnIndex"
                     [colSpan]="column.colspan"
                     role="gridcell"
+                    class="k-table-td"
                     [attr.aria-selected]="isSelectable() ? isAriaSelected(item, column) : undefined"
                     [class.k-grid-content-sticky]="column.sticky"
                     [class.k-touch-action-none]="isSelectable() && $any(selectable).drag"
@@ -17221,9 +17233,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                 [logicalSlaveRow]="false"
                 [logicalCellsCount]="1"
             >
-            <td class="k-group-cell" *ngFor="let g of groups"></td>
-            <td class="k-hierarchy-cell"></td>
-            <td class="k-detail-cell"
+            <td class="k-group-cell k-table-td" *ngFor="let g of groups"></td>
+            <td class="k-hierarchy-cell k-table-td"></td>
+            <td class="k-detail-cell k-table-td"
                 [attr.colspan]="columnsSpan"
                 kendoGridLogicalCell
                     [logicalRowIndex]="logicalRowIndex(rowIndex) + 1"
@@ -17257,7 +17269,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
             <ng-container *ngIf="!skipGroupDecoration">
                 <td class="k-group-cell" *ngFor="let g of groups"></td>
             </ng-container>
-            <td class="k-hierarchy-cell"
+            <td class="k-hierarchy-cell k-table-td"
                 *ngIf="detailTemplate?.templateRef"
                 kendoGridLogicalCell
                     [logicalRowIndex]="logicalRowIndex(rowIndex)"
@@ -17269,6 +17281,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                     [logicalRowIndex]="logicalRowIndex(rowIndex)"
                     [logicalColIndex]="logicalColIndex(column)"
                 [attr.data-skip]="skipGroupDecoration"
+                class="k-table-td"
                 *ngFor="let column of footerColumns; let columnIndex = index; trackBy: trackByColumns;">
                 <ng-template
                     [templateContext]="{
@@ -18458,18 +18471,19 @@ FooterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", versio
                 [logicalSlaveCellsCount]="columns.length - lockedColumnsCount"
             >
             <td
-                [class.k-group-cell]="true"
+                class="k-table-td k-group-cell"
                 role="presentation"
                 *ngFor="let g of groups">
             </td>
             <td
-                [class.k-hierarchy-cell]="true"
                 role="presentation"
+                class="k-table-td k-hierarchy-cell"
                 *ngIf="detailTemplate?.templateRef">
             </td>
             <td
                 *ngFor="let column of columnsToRender; let columnIndex = index"
                 kendoGridLogicalCell
+                class="k-table-td"
                     [logicalRowIndex]="logicalRowIndex"
                     [logicalColIndex]="logicalColumnIndex(column)"
                     role="columnfooter"
@@ -18504,18 +18518,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                 [logicalSlaveCellsCount]="columns.length - lockedColumnsCount"
             >
             <td
-                [class.k-group-cell]="true"
+                class="k-table-td k-group-cell"
                 role="presentation"
                 *ngFor="let g of groups">
             </td>
             <td
-                [class.k-hierarchy-cell]="true"
                 role="presentation"
+                class="k-table-td k-hierarchy-cell"
                 *ngIf="detailTemplate?.templateRef">
             </td>
             <td
                 *ngFor="let column of columnsToRender; let columnIndex = index"
                 kendoGridLogicalCell
+                class="k-table-td"
                     [logicalRowIndex]="logicalRowIndex"
                     [logicalColIndex]="logicalColumnIndex(column)"
                     role="columnfooter"
@@ -21357,6 +21372,7 @@ GridComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version:
             [skip]="skip"
             [size]="size"
             [options]="pageable"
+            class="k-pager"
             (pageChange)="notifyPageChange('pager', $event)">
         </kendo-pager>
         <kendo-grid-toolbar
@@ -21904,6 +21920,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
             [skip]="skip"
             [size]="size"
             [options]="pageable"
+            class="k-pager"
             (pageChange)="notifyPageChange('pager', $event)">
         </kendo-pager>
         <kendo-grid-toolbar