@progress/kendo-angular-grid 17.0.0-develop.33 → 17.0.0-develop.35

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

@@ -3,17 +3,19 @@
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import * as i0 from '@angular/core';
-import { EventEmitter, Injectable, SecurityContext, InjectionToken, Optional, Inject, Directive, SkipSelf, Input, Host, Output, HostBinding, isDevMode, QueryList, Component, ContentChildren, ContentChild, forwardRef, Pipe, TemplateRef, ChangeDetectionStrategy, ViewChildren, ViewChild, Self, NgZone, HostListener, ElementRef, ViewEncapsulation, NgModule } from '@angular/core';
+import { EventEmitter, Injectable, SecurityContext, InjectionToken, Optional, Inject, Directive, SkipSelf, Input, Host, Output, HostBinding, isDevMode, QueryList, Component, ContentChildren, ContentChild, forwardRef, Pipe, TemplateRef, ChangeDetectionStrategy, ViewChildren, ViewChild, Self, NgZone, HostListener, ViewEncapsulation, NgModule } from '@angular/core';
 import { merge, of, Subject, from, Subscription, interval, fromEvent, Observable, zip as zip$1, BehaviorSubject } from 'rxjs';
 import * as i9 from '@progress/kendo-angular-common';
 import { isDocumentAvailable, Keys, isPresent as isPresent$1, anyChanged, TemplateContextDirective, DraggableDirective, EventsOutsideAngularDirective, isChanged as isChanged$1, KendoInput, guid, hasObservers, ResizeSensorComponent, closest as closest$1, isFocusable as isFocusable$1, shouldShowValidationUI, WatermarkOverlayComponent, ResizeBatchService, DraggableModule } from '@progress/kendo-angular-common';
 import * as i1 from '@angular/platform-browser';
 import * as i1$1 from '@progress/kendo-angular-icons';
 import { IconWrapperComponent, IconsService, KENDO_ICONS } from '@progress/kendo-angular-icons';
-import { plusIcon, cancelIcon, lockIcon, unlockIcon, caretAltDownIcon, caretAltRightIcon, caretAltLeftIcon, arrowLeftIcon, arrowRightIcon, sortDescSmallIcon, sortAscSmallIcon, filterClearIcon, filterIcon, columnsIcon, chevronUpIcon, chevronDownIcon, displayInlineFlexIcon, maxWidthIcon, stickIcon, unstickIcon, setColumnPositionIcon, slidersIcon, moreVerticalIcon, reorderIcon, minusIcon, caretAltToLeftIcon, caretAltToRightIcon, insertMiddleIcon, filePdfIcon, fileExcelIcon } from '@progress/kendo-svg-icons';
+import { plusIcon, cancelIcon, lockIcon, unlockIcon, caretAltDownIcon, caretAltRightIcon, caretAltLeftIcon, arrowLeftIcon, arrowRightIcon, sortDescSmallIcon, sortAscSmallIcon, filterClearIcon, filterIcon, columnsIcon, chevronUpIcon, chevronDownIcon, displayInlineFlexIcon, maxWidthIcon, stickIcon, unstickIcon, setColumnPositionIcon, slidersIcon, moreVerticalIcon, reorderIcon, minusIcon, insertMiddleIcon, filePdfIcon, fileExcelIcon } from '@progress/kendo-svg-icons';
 import { switchMap, take, map, filter, takeUntil, switchMapTo, delay, tap, throttleTime, debounceTime, distinctUntilChanged, skip, auditTime, bufferCount } from 'rxjs/operators';
 import * as i1$2 from '@progress/kendo-angular-l10n';
 import { ComponentMessages, LocalizationService, L10N_PREFIX } from '@progress/kendo-angular-l10n';
+import * as i42 from '@progress/kendo-angular-pager';
+import { PagerContextService, PagerNavigationService, PagerTemplateDirective, KENDO_PAGER } from '@progress/kendo-angular-pager';
 import { orderBy, isCompositeFilterDescriptor, groupBy, process, filterBy } from '@progress/kendo-data-query';
 import { NgFor, NgIf, NgTemplateOutlet, NgSwitch, NgSwitchCase, NgClass, NgStyle, NgSwitchDefault } from '@angular/common';
 import { getter } from '@progress/kendo-common';
@@ -26,7 +28,6 @@ import * as i1$4 from '@progress/kendo-angular-dropdowns';
 import { DropDownListComponent, AutoCompleteComponent } from '@progress/kendo-angular-dropdowns';
 import * as i4 from '@angular/forms';
 import { NG_VALUE_ACCESSOR, FormsModule, ReactiveFormsModule, FormControl, FormGroup } from '@angular/forms';
-import * as i1$5 from '@progress/kendo-angular-inputs';
 import { TextBoxDirective, NumericTextBoxComponent, NumericTextBoxCustomMessagesComponent, RadioButtonDirective, TextBoxComponent } from '@progress/kendo-angular-inputs';
 import { DatePickerComponent, DatePickerCustomMessagesComponent, CalendarDOMService, CenturyViewService, DecadeViewService, MonthViewService, YearViewService, NavigationService as NavigationService$1 } from '@progress/kendo-angular-dateinputs';
 import { trigger, state, style, transition, animate } from '@angular/animations';
@@ -34,11 +35,10 @@ import { TabStripComponent, TabStripTabComponent, TabTitleDirective, TabContentD
 import { saveAs } from '@progress/kendo-file-saver';
 import { workbookOptions, toDataURL, ColumnBase as ColumnBase$1, ExcelExportModule } from '@progress/kendo-angular-excel-export';
 import { PDFExportMarginComponent, PDFExportTemplateDirective, PDFExportComponent } from '@progress/kendo-angular-pdf-export';
-import { LabelComponent } from '@progress/kendo-angular-label';
 import { validatePackage } from '@progress/kendo-licensing';
 import { DragTargetContainerDirective, DropTargetContainerDirective } from '@progress/kendo-angular-utils';
-import * as i2 from '@progress/kendo-angular-toolbar';
-import { ToolBarModule } from '@progress/kendo-angular-toolbar';
+import * as i43 from '@progress/kendo-angular-toolbar';
+import { KENDO_TOOLBAR } from '@progress/kendo-angular-toolbar';
 import { DialogContainerService, DialogService, WindowService, WindowContainerService } from '@progress/kendo-angular-dialog';
 
 /* eslint-disable  no-bitwise */
@@ -1671,44 +1671,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
             type: Injectable
         }] });
 
-/**
- * @hidden
- */
-class PagerContextService {
-    total;
-    skip;
-    pageSize;
-    changes = new Subject();
-    pageChange = new Subject();
-    get currentPage() {
-        return this.skip / this.pageSize;
-    }
-    notifyChanges(changes) {
-        this.total = changes.total;
-        this.pageSize = changes.pageSize;
-        this.skip = changes.skip;
-        this.changes.next(changes);
-    }
-    changePage(page) {
-        this.pageChange.next({ skip: page * this.pageSize, take: this.pageSize });
-    }
-    changePageSize(value) {
-        this.pageChange.next({ skip: 0, take: value });
-    }
-    nextPage() {
-        const nextPage = this.currentPage + 1;
-        if (nextPage * this.pageSize < this.total) {
-            this.changePage(nextPage);
-        }
-    }
-    prevPage() {
-        const prevPage = this.currentPage - 1;
-        if (prevPage * this.pageSize >= 0) {
-            this.changePage(prevPage);
-        }
-    }
-}
-
 /**
  * Arguments for the `detailCollapse` event.
  */
@@ -2501,12 +2463,12 @@ class NavigationService {
         const ev = rowSelectionService.selectRange(startRowIndex, endRowIndex);
         rowSelectionService.changes.emit(ev);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: NavigationService, deps: [{ token: i0.NgZone }, { token: DomEventsService }, { token: PagerContextService }, { token: ScrollRequestService }, { token: GroupsService }, { token: DetailsService }, { token: FocusRoot }, { token: EditService }, { token: i0.ChangeDetectorRef }, { token: ContextService }, { token: FocusableDirective, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: NavigationService, deps: [{ token: i0.NgZone }, { token: DomEventsService }, { token: i42.PagerContextService }, { token: ScrollRequestService }, { token: GroupsService }, { token: DetailsService }, { token: FocusRoot }, { token: EditService }, { token: i0.ChangeDetectorRef }, { token: ContextService }, { token: FocusableDirective, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: NavigationService });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: NavigationService, decorators: [{
             type: Injectable
-        }], ctorParameters: function () { return [{ type: i0.NgZone }, { type: DomEventsService }, { type: PagerContextService }, { type: ScrollRequestService }, { type: GroupsService }, { type: DetailsService }, { type: FocusRoot }, { type: EditService }, { type: i0.ChangeDetectorRef }, { type: ContextService }, { type: FocusableDirective, decorators: [{
+        }], ctorParameters: function () { return [{ type: i0.NgZone }, { type: DomEventsService }, { type: i42.PagerContextService }, { type: ScrollRequestService }, { type: GroupsService }, { type: DetailsService }, { type: FocusRoot }, { type: EditService }, { type: i0.ChangeDetectorRef }, { type: ContextService }, { type: FocusableDirective, decorators: [{
                     type: Optional
                 }] }]; } });
 
@@ -19224,6 +19186,53 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                 type: Input
             }] } });
 
+/**
+ * @hidden
+ */
+class ZoneAwareEventEmitter extends EventEmitter {
+    ngZone;
+    constructor(ngZone, isAsync = false) {
+        super(isAsync);
+        this.ngZone = ngZone;
+    }
+    subscribe(generatorOrNext, error, complete) {
+        let schedulerFn;
+        let errorFn = (_) => null;
+        let completeFn = () => null;
+        if (generatorOrNext && typeof generatorOrNext === 'object') {
+            schedulerFn = (value) => { this.ngZone.run(() => generatorOrNext.next(value)); };
+            if (generatorOrNext.error) {
+                errorFn = (err) => { this.ngZone.run(() => generatorOrNext.error(err)); };
+            }
+            if (generatorOrNext.complete) {
+                completeFn = () => { this.ngZone.run(() => generatorOrNext.complete()); };
+            }
+        }
+        else {
+            schedulerFn = (value) => { this.ngZone.run(() => generatorOrNext(value)); };
+            if (error) {
+                errorFn = (err) => { this.ngZone.run(() => error(err)); };
+            }
+            if (complete) {
+                completeFn = () => { this.ngZone.run(() => complete()); };
+            }
+        }
+        return super.subscribe(schedulerFn, errorFn, completeFn);
+    }
+}
+
+/**
+ * @hidden
+ */
+const packageMetadata = {
+    name: '@progress/kendo-angular-grid',
+    productName: 'Kendo UI for Angular',
+    productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
+    publishDate: 1730714659,
+    version: '17.0.0-develop.35',
+    licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
+};
+
 /**
  * @hidden
  */
@@ -19241,1606 +19250,113 @@ const normalizeSettings = ({ buttonCount = 10, info = true, type = 'numeric', pa
  */
 const normalize = (settings) => normalizeSettings(settings === true ? {} : settings);
 
-/**
- * Represents the pager template which helps to customize the pager appearance in the Grid. To define a pager
- * template, nest an `<ng-template>` tag with the `kendoPagerTemplate` directive inside `<kendo-grid>` tag
- * [see example](slug:pager_template_grid).
- *
- * The template context provides the following fields:
- * * `currentPage`&mdash;The index of the displayed page.
- * * `pageSize`&mdash;The value of the current `pageSize`.
- * * `skip`&mdash;The current skip value.
- * * `total`&mdash;The total number of records.
- * * `totalPages`&mdash;The total number of available pages.
- *
- * @example
- * ```html
- * <kendo-grid ... [pageable]="true">
- *   <ng-template kendoPagerTemplate let-totalPages="totalPages" let-currentPage="currentPage">
- *     <kendo-pager-prev-buttons></kendo-pager-prev-buttons>
- *     <kendo-pager-next-buttons></kendo-pager-next-buttons>
- *     <kendo-pager-info></kendo-pager-info>
- *       Current page: {{currentPage}}
- *   </ng-template>
- *   <kendo-grid-column field="ProductID"></kendo-grid-column>
- *   <kendo-grid-column field="ProductName"></kendo-grid-column>
- * </kendo-grid>
- * ```
- */
-class PagerTemplateDirective {
-    templateRef;
-    constructor(templateRef) {
-        this.templateRef = templateRef;
+const canCreateElement = () => isDocumentAvailable() && document.createElement;
+let cachedScrollbarWidth = null;
+let cachedPixelRatio;
+let cachedRtlScrollLeft = null;
+function scrollbarWidth() {
+    if (cachedScrollbarWidth === null && canCreateElement()) {
+        cachedPixelRatio = window.devicePixelRatio || 1;
+        const div = document.createElement("div");
+        div.style.cssText = "overflow:scroll;overflow-x:hidden;zoom:1;clear:both;display:block";
+        div.innerHTML = "&nbsp;";
+        document.body.appendChild(div);
+        cachedScrollbarWidth = div.offsetWidth - div.scrollWidth;
+        document.body.removeChild(div);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PagerTemplateDirective, deps: [{ token: i0.TemplateRef, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: PagerTemplateDirective, isStandalone: true, selector: "[kendoPagerTemplate]", ngImport: i0 });
+    return cachedScrollbarWidth;
+}
+function rtlScrollLeft() {
+    if (cachedRtlScrollLeft === null && canCreateElement()) {
+        const outer = document.createElement('div');
+        outer.style.direction = 'rtl';
+        outer.style.display = 'block';
+        outer.style.clear = 'both';
+        outer.style.width = '100px';
+        outer.style.visibility = 'hidden';
+        outer.style.position = 'absolute';
+        outer.style.left = '-10000px';
+        outer.style.overflow = 'scroll';
+        outer.style.zoom = '1';
+        const inner = document.createElement('div');
+        inner.style.width = '200px';
+        inner.style.height = '1px';
+        outer.append(inner);
+        document.body.appendChild(outer);
+        const initial = outer.scrollLeft;
+        outer.scrollLeft = -1;
+        cachedRtlScrollLeft = outer.scrollLeft < 0 ? outer.scrollLeft : initial;
+        document.body.removeChild(outer);
+    }
+    return cachedRtlScrollLeft;
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PagerTemplateDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[kendoPagerTemplate]',
-                    standalone: true
-                }]
-        }], ctorParameters: function () { return [{ type: i0.TemplateRef, decorators: [{
-                    type: Optional
-                }] }]; } });
-
-/**
- * @hidden
- */
-const GROUP_CELL_WIDTH = 32; // this should be the value of group-cell inside the theme!
-/**
- * @hidden
- */
-const RESPONSIVE_BREAKPOINT_MEDIUM = 600;
-/**
- * @hidden
- */
-const RESPONSIVE_BREAKPOINT_LARGE = 768;
-
 /**
  * @hidden
+ * move to kendo-common
  */
-class PagerElementComponent {
-    ctx;
-    pagerContext;
-    cd;
-    total;
-    skip;
-    pageSize;
-    caretAltLeftIcon = caretAltLeftIcon;
-    caretAltToLeftIcon = caretAltToLeftIcon;
-    caretAltRightIcon = caretAltRightIcon;
-    caretAltToRightIcon = caretAltToRightIcon;
-    /**
-     * Sets the pager element sizing option.
-     * @default `medium`
-     */
-    size = 'medium';
-    /**
-     * @hidden
-     *
-     * @readonly
-     * @type {number}
-     * @memberOf PagerElementComponent
-     */
-    get currentPage() {
-        return Math.floor((this.skip || 0) / this.pageSize) + 1;
-    }
-    /**
-     * @hidden
-     *
-     * @readonly
-     * @type {number}
-     * @memberOf PagerElementComponent
-     */
-    get totalPages() {
-        return Math.ceil((this.total || 0) / this.pageSize);
-    }
+class BrowserSupportService {
+    zone;
+    changeDetector;
+    changes = new EventEmitter();
     subscriptions;
-    constructor(ctx, pagerContext, cd) {
-        this.ctx = ctx;
-        this.pagerContext = pagerContext;
-        this.cd = cd;
-        this.total = pagerContext.total;
-        this.skip = pagerContext.skip;
-        this.pageSize = pagerContext.pageSize;
-    }
-    /**
-     * @hidden
-     *
-     * @param {string} key
-     * @returns {string}
-     *
-     * @memberOf PagerElementComponent
-     */
-    textFor(key) {
-        return this.ctx.localization.get(key);
-    }
-    /**
-     * @hidden
-     *
-     * @param {number} page
-     *
-     * @memberOf PagerElementComponent
-     */
-    changePage(page) {
-        this.pagerContext.changePage(page);
-        return false;
-    }
-    /**
-     * @hidden
-     *
-     * @memberOf PagerElementComponent
-     */
-    ngOnInit() {
-        this.subscriptions = this.pagerContext.changes.subscribe(this.onChanges.bind(this));
-        this.subscriptions.add(this.ctx.localization.changes.subscribe(() => this.cd.markForCheck()));
+    constructor(zone, changeDetector) {
+        this.zone = zone;
+        this.changeDetector = changeDetector;
+        if (typeof window === 'undefined') {
+            return;
+        }
+        this.zone.runOutsideAngular(() => {
+            this.subscriptions = fromEvent(window, 'resize').pipe(auditTime(100)).subscribe(() => {
+                if (cachedPixelRatio !== window.devicePixelRatio) {
+                    zone.run(() => {
+                        cachedScrollbarWidth = null;
+                        this.changes.emit();
+                        this.changeDetector.markForCheck();
+                    });
+                }
+            });
+        });
     }
     ngOnDestroy() {
         if (this.subscriptions) {
             this.subscriptions.unsubscribe();
+            this.subscriptions = null;
         }
     }
-    get prevArrowIcons() {
-        return !this.ctx.localization.rtl ? ['caret-alt-to-left', 'caret-alt-left'] : ['caret-alt-to-right', 'caret-alt-right'];
-    }
-    get prevArrowSVGIcons() {
-        return !this.ctx.localization.rtl ? [this.caretAltToLeftIcon, this.caretAltLeftIcon] : [this.caretAltToRightIcon, this.caretAltRightIcon];
-    }
-    get nextArrowIcons() {
-        return !this.ctx.localization.rtl ? ['caret-alt-right', 'caret-alt-to-right'] : ['caret-alt-left', 'caret-alt-to-left'];
+    get scrollbarWidth() {
+        return scrollbarWidth();
     }
-    get nextArrowSVGIcons() {
-        return !this.ctx.localization.rtl ? [this.caretAltRightIcon, this.caretAltToRightIcon] : [this.caretAltLeftIcon, this.caretAltToLeftIcon];
+    get rtlScrollLeft() {
+        return rtlScrollLeft();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PagerElementComponent, deps: [{ token: ContextService }, { token: PagerContextService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: PagerElementComponent, inputs: { size: "size" }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: BrowserSupportService, deps: [{ token: i0.NgZone }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: BrowserSupportService });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PagerElementComponent, decorators: [{
-            type: Directive,
-            args: [{}]
-        }], ctorParameters: function () { return [{ type: ContextService }, { type: PagerContextService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { size: [{
-                type: Input
-            }] } });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: BrowserSupportService, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: i0.NgZone }, { type: i0.ChangeDetectorRef }]; } });
 
-// eslint-disable no-access-missing-member
+const isGroupItem = (source) => {
+    return source.items !== undefined &&
+        source.field !== undefined;
+};
+const isVirtualGroupItem = (source) => {
+    return source.offset !== undefined &&
+        source.skipHeader !== undefined;
+};
+const flattenGroups = (groups) => (groups.reduce((acc, curr) => {
+    if (isGroupItem(curr)) {
+        return acc.concat(flattenGroups(curr.items));
+    }
+    return acc.concat([curr]);
+}, []));
 /**
- * Displays information about the current page and the total number of records ([see example](slug:pager_template_grid#toc-using-built-in-pager-components)).
+ * @hidden
  */
-class PagerInfoComponent extends PagerElementComponent {
-    pagerContext;
-    /**
-     * @hidden
-     *
-     * @readonly
-     * @type {number}
-     * @memberOf PagerInfoComponent
-     */
-    get maxItems() {
-        return Math.min(this.currentPage * this.pageSize, this.total);
-    }
-    /**
-     * @hidden
-     *
-     * @readonly
-     * @type {number}
-     * @memberOf PagerInfoComponent
-     */
-    get currentPageText() {
-        return this.total ?
-            (this.currentPage - 1) * this.pageSize + 1 :
-            0;
-    }
-    /**
-     * @hidden
-     *
-     * @readonly
-     * @type {boolean}
-     * @memberOf PagerInfoComponent
-     */
-    get classes() {
-        return true;
-    }
-    constructor(ctx, cd, pagerContext) {
-        super(ctx, pagerContext, cd);
-        this.pagerContext = pagerContext;
-    }
-    onChanges({ total, skip, pageSize }) {
-        this.total = total;
-        this.skip = skip;
-        this.pageSize = pageSize;
-        this.cd.markForCheck();
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PagerInfoComponent, deps: [{ token: ContextService }, { token: i0.ChangeDetectorRef }, { token: PagerContextService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: PagerInfoComponent, isStandalone: true, selector: "kendo-pager-info", host: { properties: { "class.k-pager-info": "this.classes", "class.k-label": "this.classes" } }, usesInheritance: true, ngImport: i0, template: `{{currentPageText}} - {{maxItems}} {{textFor('pagerOf')}} {{total}} {{textFor('pagerItems')}}`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PagerInfoComponent, decorators: [{
-            type: Component,
-            args: [{
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    selector: 'kendo-pager-info',
-                    template: `{{currentPageText}} - {{maxItems}} {{textFor('pagerOf')}} {{total}} {{textFor('pagerItems')}}`,
-                    standalone: true
-                }]
-        }], ctorParameters: function () { return [{ type: ContextService }, { type: i0.ChangeDetectorRef }, { type: PagerContextService }]; }, propDecorators: { classes: [{
-                type: HostBinding,
-                args: ["class.k-pager-info"]
-            }, {
-                type: HostBinding,
-                args: ["class.k-label"]
-            }] } });
-
-/**
- * @hidden
- */
-class PagerDropDownListDirective {
-    host;
-    constructor(host) {
-        this.host = host;
-    }
-    ngAfterViewInit() {
-        const wrapperElement = this.host.wrapper.nativeElement;
-        wrapperElement.addEventListener('keydown', this.keydownHandler, true);
-    }
-    ngOnDestroy() {
-        this.host.wrapper.nativeElement.removeEventListener('keydown', this.keydownHandler);
-    }
-    keydownHandler = (e) => {
-        if (e.keyCode === Keys.Escape && this.host.isOpen) {
-            e.stopPropagation();
-            this.host.toggle(false);
-        }
-    };
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PagerDropDownListDirective, deps: [{ token: i1$4.DropDownListComponent }], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: PagerDropDownListDirective, isStandalone: true, selector: "[kendoGridPagerDropDown]", ngImport: i0 });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PagerDropDownListDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[kendoGridPagerDropDown]',
-                    standalone: true
-                }]
-        }], ctorParameters: function () { return [{ type: i1$4.DropDownListComponent }]; } });
-
-/**
- * Displays a drop-down list for the page size selection ([see example](slug:pager_template_grid#toc-using-built-in-pager-components)).
- */
-class PagerPageSizesComponent extends PagerElementComponent {
-    pagerContext;
-    navigationService;
-    /**
-     * The page sizes collection. Can be an Array of numbers and/or [`PageSizeItem`](slug:api_grid_pagesizeitem) objects
-     * ([see example](slug:pager_template_grid))
-     */
-    set pageSizes(pageSizes) {
-        let normalizedItems = [];
-        pageSizes.forEach(item => {
-            if (typeof item === 'number') {
-                normalizedItems.push({
-                    text: item.toString(),
-                    value: item
-                });
-            }
-            else {
-                normalizedItems.push(item);
-            }
-        });
-        if (this.pageSize && !normalizedItems.some(item => item.value === this.pageSize)) {
-            normalizedItems = [{ text: this.pageSize.toString(), value: this.pageSize }, ...normalizedItems];
-        }
-        this._pageSizes = normalizedItems;
-    }
-    get pageSizes() {
-        return this._pageSizes;
-    }
-    /**
-     * @hidden
-     *
-     * @readonly
-     */
-    get classes() {
-        return true;
-    }
-    /**
-     * @hidden
-     *
-     * @readonly
-     */
-    get showInitialPageSize() {
-        return this.pageSizes
-            .filter(item => {
-            if (typeof item.value === 'number') {
-                return item.value === Number(this.pageSize);
-            }
-            return this.total === Number(this.pageSize);
-        })
-            .length === 0;
-    }
-    _pageSizes = [];
-    constructor(ctx, cd, pagerContext, navigationService) {
-        super(ctx, pagerContext, cd);
-        this.pagerContext = pagerContext;
-        this.navigationService = navigationService;
-    }
-    /**
-     * @hidden
-     */
-    pageSizeChange(value) {
-        this.pageSize = typeof value === 'number' ? value : this.total;
-        this.pagerContext.changePageSize(this.pageSize);
-    }
-    /**
-     * @hidden
-     */
-    getValue(page) {
-        return typeof page.value === 'number' ? page.value : this.total;
-    }
-    onChanges({ total, skip, pageSize }) {
-        this.total = total;
-        this.skip = skip;
-        this.pageSize = typeof pageSize === 'number' ? pageSize : this.total;
-        this.cd.markForCheck();
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PagerPageSizesComponent, deps: [{ token: ContextService }, { token: i0.ChangeDetectorRef }, { token: PagerContextService }, { token: NavigationService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: PagerPageSizesComponent, isStandalone: true, selector: "kendo-pager-page-sizes", inputs: { pageSizes: "pageSizes" }, host: { properties: { "class.k-pager-sizes": "this.classes", "class.k-label": "this.classes" } }, usesInheritance: true, ngImport: i0, template: `
-        <kendo-dropdownlist
-            class="k-dropdown"
-            #dropdownlist
-            [size]="size"
-            kendoGridPagerDropDown
-            [tabindex]="0"
-            kendoGridFocusable
-            [data]="pageSizes"
-            textField="text"
-            valueField="value"
-            [valuePrimitive]="true"
-            [value]="pageSize"
-            (valueChange)="pageSizeChange($event)"></kendo-dropdownlist>
-        <kendo-label [for]="dropdownlist" [text]="textFor('pagerItemsPerPage')"></kendo-label>
-    `, isInline: true, dependencies: [{ kind: "component", type: DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "title", "subtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }, { kind: "directive", type: PagerDropDownListDirective, selector: "[kendoGridPagerDropDown]" }, { kind: "directive", type: FocusableDirective, selector: "[kendoGridFocusable],\n        [kendoGridEditCommand],\n        [kendoGridRemoveCommand],\n        [kendoGridSaveCommand],\n        [kendoGridCancelCommand],\n        [kendoGridSelectionCheckbox]\n    ", inputs: ["kendoGridFocusable"] }, { kind: "component", type: LabelComponent, selector: "kendo-label", inputs: ["text", "for", "optional", "labelCssStyle", "labelCssClass"], exportAs: ["kendoLabel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PagerPageSizesComponent, decorators: [{
-            type: Component,
-            args: [{
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    selector: 'kendo-pager-page-sizes',
-                    template: `
-        <kendo-dropdownlist
-            class="k-dropdown"
-            #dropdownlist
-            [size]="size"
-            kendoGridPagerDropDown
-            [tabindex]="0"
-            kendoGridFocusable
-            [data]="pageSizes"
-            textField="text"
-            valueField="value"
-            [valuePrimitive]="true"
-            [value]="pageSize"
-            (valueChange)="pageSizeChange($event)"></kendo-dropdownlist>
-        <kendo-label [for]="dropdownlist" [text]="textFor('pagerItemsPerPage')"></kendo-label>
-    `,
-                    standalone: true,
-                    imports: [DropDownListComponent, PagerDropDownListDirective, FocusableDirective, LabelComponent]
-                }]
-        }], ctorParameters: function () { return [{ type: ContextService }, { type: i0.ChangeDetectorRef }, { type: PagerContextService }, { type: NavigationService }]; }, propDecorators: { pageSizes: [{
-                type: Input
-            }], classes: [{
-                type: HostBinding,
-                args: ['class.k-pager-sizes']
-            }, {
-                type: HostBinding,
-                args: ['class.k-label']
-            }] } });
-
-/**
- * Displays numeric buttons to enable navigation between the pages ([see example](slug:pager_template_grid#toc-using-built-in-pager-components)).
- */
-class PagerNumericButtonsComponent extends PagerElementComponent {
-    pagerContext;
-    selectElement;
-    numbersElement;
-    /**
-     * The count of the displayed buttons.
-     *
-     * @type {number}
-     * @memberOf PagerNumericButtonsComponent
-     */
-    buttonCount;
-    /**
-     * @hidden
-     *
-     * @readonly
-     * @type {number[]}
-     * @memberOf PagerNumericButtonsComponent
-     */
-    get buttons() {
-        const result = [];
-        for (let idx = this.start; idx <= this.end; idx++) {
-            result.push(idx);
-        }
-        return result;
-    }
-    /**
-     * @hidden
-     */
-    get end() {
-        return Math.min((this.start + this.buttonCount) - 1, this.totalPages);
-    }
-    /**
-     * @hidden
-     */
-    get start() {
-        const page = this.currentPage;
-        const buttonCount = this.buttonCount;
-        if (page > buttonCount) {
-            const reminder = (page % buttonCount);
-            return (reminder === 0) ? (page - buttonCount) + 1 : (page - reminder) + 1;
-        }
-        return 1;
-    }
-    constructor(ctx, cd, pagerContext) {
-        super(ctx, pagerContext, cd);
-        this.pagerContext = pagerContext;
-    }
-    /**
-     * @hidden
-     */
-    pageLabel(num) {
-        const pageText = this.textFor('pagerPage');
-        if (pageText) {
-            return pageText + ' ' + num;
-        }
-        return num.toString();
-    }
-    /**
-     * @hidden
-     */
-    onSelectChange(e) {
-        const target = e.target;
-        const valueAsNumber = Number(target.value);
-        if (!Number.isNaN(valueAsNumber)) {
-            this.changePage(valueAsNumber - 1);
-        }
-        else {
-            if (target.value === 'previousButtons') {
-                this.changePage(this.start - 2);
-            }
-            else {
-                this.changePage(this.end);
-            }
-        }
-    }
-    onChanges({ total, skip, pageSize }) {
-        this.total = total;
-        this.skip = skip;
-        this.pageSize = pageSize;
-        this.cd.markForCheck();
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PagerNumericButtonsComponent, deps: [{ token: ContextService }, { token: i0.ChangeDetectorRef }, { token: PagerContextService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: PagerNumericButtonsComponent, isStandalone: true, selector: "kendo-pager-numeric-buttons", inputs: { buttonCount: "buttonCount" }, viewQueries: [{ propertyName: "selectElement", first: true, predicate: ["select"], descendants: true, read: ElementRef }, { propertyName: "numbersElement", first: true, predicate: ["numbers"], descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0, template: `
-        <select
-            #select
-            class="k-dropdown-list k-dropdown k-picker k-picker-solid k-rounded-md"
-            kendoGridFocusable
-            [style.display]="'none'"
-            [attr.title]="textFor('selectPage')"
-            [attr.aria-label]="textFor('selectPage')"
-            [ngClass]="{
-                'k-picker-sm': size === 'small',
-                'k-picker-md': size === 'medium' || !size
-            }"
-            (change)="onSelectChange($event)">
-            <option *ngIf="start > 1"
-                value="previousButtons"
-                [selected]="false"
-                [attr.aria-label]="pageLabel(start - 1)">...
-            </option>
-            <option *ngFor="let num of buttons"
-                [value]="num.toString()"
-                [selected]="num === currentPage"
-                [attr.aria-label]="pageLabel(num)"
-                [attr.aria-current]="currentPage === num ? 'page' : undefined"
-                [ngClass]="{'k-selected':currentPage === num}">
-                {{num}}
-            </option>
-            <option *ngIf="end < totalPages"
-                value="nextButtons"
-                [selected]="false"
-                [attr.aria-label]="pageLabel(end + 1)">...
-            </option>
-        </select>
-        <div class="k-pager-numbers" #numbers>
-            <button *ngIf="start > 1"
-                type="button"
-                kendoGridFocusable
-                kendoButton
-                [size]="size"
-                fillMode="flat"
-                themeColor="primary"
-                class="k-pager-nav"
-                rounded="none"
-                [attr.aria-label]="pageLabel(start - 1)"
-                [attr.title]="pageLabel(start - 1)"
-                (click)="changePage(start - 2)">...</button>
-            <button *ngFor="let num of buttons"
-                type="button"
-                kendoGridFocusable
-                kendoButton
-                [size]="size"
-                fillMode="flat"
-                themeColor="primary"
-                class="k-pager-nav"
-                rounded="none"
-                [attr.aria-label]="pageLabel(num)"
-                [attr.title]="pageLabel(num)"
-                [attr.aria-current]="currentPage === num ? 'page' : undefined"
-                [selected]="currentPage === num"
-                (click)="changePage(num - 1)">
-                {{num}}
-            </button>
-            <button *ngIf="end < totalPages"
-                type="button"
-                kendoGridFocusable
-                kendoButton
-                class="k-pager-nav"
-                [size]="size"
-                fillMode="flat"
-                themeColor="primary"
-                rounded="none"
-                [attr.aria-label]="pageLabel(end + 1)"
-                [attr.title]="pageLabel(end + 1)"
-                (click)="changePage(end)">...</button>
-        </div>
-    `, isInline: true, dependencies: [{ kind: "directive", type: FocusableDirective, selector: "[kendoGridFocusable],\n        [kendoGridEditCommand],\n        [kendoGridRemoveCommand],\n        [kendoGridSaveCommand],\n        [kendoGridCancelCommand],\n        [kendoGridSelectionCheckbox]\n    ", inputs: ["kendoGridFocusable"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PagerNumericButtonsComponent, decorators: [{
-            type: Component,
-            args: [{
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    selector: 'kendo-pager-numeric-buttons',
-                    template: `
-        <select
-            #select
-            class="k-dropdown-list k-dropdown k-picker k-picker-solid k-rounded-md"
-            kendoGridFocusable
-            [style.display]="'none'"
-            [attr.title]="textFor('selectPage')"
-            [attr.aria-label]="textFor('selectPage')"
-            [ngClass]="{
-                'k-picker-sm': size === 'small',
-                'k-picker-md': size === 'medium' || !size
-            }"
-            (change)="onSelectChange($event)">
-            <option *ngIf="start > 1"
-                value="previousButtons"
-                [selected]="false"
-                [attr.aria-label]="pageLabel(start - 1)">...
-            </option>
-            <option *ngFor="let num of buttons"
-                [value]="num.toString()"
-                [selected]="num === currentPage"
-                [attr.aria-label]="pageLabel(num)"
-                [attr.aria-current]="currentPage === num ? 'page' : undefined"
-                [ngClass]="{'k-selected':currentPage === num}">
-                {{num}}
-            </option>
-            <option *ngIf="end < totalPages"
-                value="nextButtons"
-                [selected]="false"
-                [attr.aria-label]="pageLabel(end + 1)">...
-            </option>
-        </select>
-        <div class="k-pager-numbers" #numbers>
-            <button *ngIf="start > 1"
-                type="button"
-                kendoGridFocusable
-                kendoButton
-                [size]="size"
-                fillMode="flat"
-                themeColor="primary"
-                class="k-pager-nav"
-                rounded="none"
-                [attr.aria-label]="pageLabel(start - 1)"
-                [attr.title]="pageLabel(start - 1)"
-                (click)="changePage(start - 2)">...</button>
-            <button *ngFor="let num of buttons"
-                type="button"
-                kendoGridFocusable
-                kendoButton
-                [size]="size"
-                fillMode="flat"
-                themeColor="primary"
-                class="k-pager-nav"
-                rounded="none"
-                [attr.aria-label]="pageLabel(num)"
-                [attr.title]="pageLabel(num)"
-                [attr.aria-current]="currentPage === num ? 'page' : undefined"
-                [selected]="currentPage === num"
-                (click)="changePage(num - 1)">
-                {{num}}
-            </button>
-            <button *ngIf="end < totalPages"
-                type="button"
-                kendoGridFocusable
-                kendoButton
-                class="k-pager-nav"
-                [size]="size"
-                fillMode="flat"
-                themeColor="primary"
-                rounded="none"
-                [attr.aria-label]="pageLabel(end + 1)"
-                [attr.title]="pageLabel(end + 1)"
-                (click)="changePage(end)">...</button>
-        </div>
-    `,
-                    standalone: true,
-                    imports: [FocusableDirective, NgClass, NgIf, NgFor, ButtonComponent]
-                }]
-        }], ctorParameters: function () { return [{ type: ContextService }, { type: i0.ChangeDetectorRef }, { type: PagerContextService }]; }, propDecorators: { selectElement: [{
-                type: ViewChild,
-                args: ['select', { read: ElementRef }]
-            }], numbersElement: [{
-                type: ViewChild,
-                args: ['numbers', { read: ElementRef }]
-            }], buttonCount: [{
-                type: Input
-            }] } });
-
-/**
- * Displays buttons for navigating to the next and to the last page ([see example](slug:pager_template_grid#toc-using-built-in-pager-components)).
- */
-class PagerNextButtonsComponent extends PagerElementComponent {
-    navigationService;
-    /**
-     * @hidden
-     *
-     * @readonly
-     * @type {boolean}
-     * @memberOf PagerNextButtonsComponent
-     */
-    get disabled() {
-        return this.currentPage === this.totalPages || !this.total;
-    }
-    constructor(ctx, pagerContext, cd, navigationService) {
-        super(ctx, pagerContext, cd);
-        this.navigationService = navigationService;
-    }
-    onChanges({ total, skip, pageSize }) {
-        this.total = total;
-        this.skip = skip;
-        this.pageSize = pageSize;
-        this.cd.markForCheck();
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PagerNextButtonsComponent, deps: [{ token: ContextService }, { token: PagerContextService }, { token: i0.ChangeDetectorRef }, { token: NavigationService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: PagerNextButtonsComponent, isStandalone: true, selector: "kendo-pager-next-buttons", usesInheritance: true, ngImport: i0, template: `
-        <button
-            kendoButton
-            [kendoGridFocusable]="!disabled"
-            type="button"
-            [size]="size"
-            [icon]="nextArrowIcons[0]"
-            [svgIcon]="nextArrowSVGIcons[0]"
-            fillMode="flat"
-            rounded="none"
-            class="k-pager-nav"
-            [disabled]="disabled"
-            [title]="textFor('pagerNextPage')"
-            [attr.aria-label]="textFor('pagerNextPage')"
-            (click)="currentPage !== totalPages ? changePage(currentPage) : false">
-        </button>
-        <button
-            kendoButton
-            [kendoGridFocusable]="!disabled"
-            type="button"
-            [size]="size"
-            [icon]="nextArrowIcons[1]"
-            [svgIcon]="nextArrowSVGIcons[1]"
-            fillMode="flat"
-            rounded="none"
-            class="k-pager-nav k-pager-last"
-            [disabled]="disabled"
-            [title]="textFor('pagerLastPage')"
-            [attr.aria-label]="textFor('pagerLastPage')"
-            (click)="currentPage !== totalPages ? changePage(totalPages-1) : false">
-        </button>
-    `, isInline: true, dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "directive", type: FocusableDirective, selector: "[kendoGridFocusable],\n        [kendoGridEditCommand],\n        [kendoGridRemoveCommand],\n        [kendoGridSaveCommand],\n        [kendoGridCancelCommand],\n        [kendoGridSelectionCheckbox]\n    ", inputs: ["kendoGridFocusable"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PagerNextButtonsComponent, decorators: [{
-            type: Component,
-            args: [{
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    selector: 'kendo-pager-next-buttons',
-                    template: `
-        <button
-            kendoButton
-            [kendoGridFocusable]="!disabled"
-            type="button"
-            [size]="size"
-            [icon]="nextArrowIcons[0]"
-            [svgIcon]="nextArrowSVGIcons[0]"
-            fillMode="flat"
-            rounded="none"
-            class="k-pager-nav"
-            [disabled]="disabled"
-            [title]="textFor('pagerNextPage')"
-            [attr.aria-label]="textFor('pagerNextPage')"
-            (click)="currentPage !== totalPages ? changePage(currentPage) : false">
-        </button>
-        <button
-            kendoButton
-            [kendoGridFocusable]="!disabled"
-            type="button"
-            [size]="size"
-            [icon]="nextArrowIcons[1]"
-            [svgIcon]="nextArrowSVGIcons[1]"
-            fillMode="flat"
-            rounded="none"
-            class="k-pager-nav k-pager-last"
-            [disabled]="disabled"
-            [title]="textFor('pagerLastPage')"
-            [attr.aria-label]="textFor('pagerLastPage')"
-            (click)="currentPage !== totalPages ? changePage(totalPages-1) : false">
-        </button>
-    `,
-                    standalone: true,
-                    imports: [ButtonComponent, FocusableDirective]
-                }]
-        }], ctorParameters: function () { return [{ type: ContextService }, { type: PagerContextService }, { type: i0.ChangeDetectorRef }, { type: NavigationService }]; } });
-
-/**
- * @hidden
- */
-class PagerInputDirective {
-    host;
-    renderer;
-    constructor(host, renderer) {
-        this.host = host;
-        this.renderer = renderer;
-    }
-    ngAfterViewInit() {
-        const inputElement = this.host.numericInput.nativeElement;
-        this.renderer.addClass(inputElement, 'k-pager-nav');
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PagerInputDirective, deps: [{ token: i1$5.NumericTextBoxComponent }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: PagerInputDirective, isStandalone: true, selector: "[kendoGridPagerInput]", ngImport: i0 });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PagerInputDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[kendoGridPagerInput]',
-                    standalone: true
-                }]
-        }], ctorParameters: function () { return [{ type: i1$5.NumericTextBoxComponent }, { type: i0.Renderer2 }]; } });
-
-/**
- * Displays an input element which allows the typing and rendering of page numbers ([see example](slug:pager_template_grid#toc-using-built-in-pager-components)).
- */
-class PagerInputComponent extends PagerElementComponent {
-    pagerContext;
-    zone;
-    navigationService;
-    numericInput;
-    constructor(ctx, pagerContext, zone, navigationService, cd) {
-        super(ctx, pagerContext, cd);
-        this.pagerContext = pagerContext;
-        this.zone = zone;
-        this.navigationService = navigationService;
-    }
-    /**
-     * @hidden
-     *
-     * @param {string} value
-     *
-     * @memberOf PagerInputComponent
-     */
-    handleKeyDown = (event) => {
-        const incomingValue = this.numericInput.value || this.current;
-        if (event.keyCode === Keys.Enter) {
-            event.preventDefault();
-            if (incomingValue !== this.current) {
-                this.zone.run(() => {
-                    this.changePage(incomingValue - 1);
-                });
-            }
-        }
-    };
-    /**
-     * @hidden
-     *
-     * @param {string} value
-     *
-     * @memberOf PagerInputComponent
-     */
-    handleBlur = () => {
-        const inputValue = this.numericInput.value;
-        if (!inputValue) {
-            this.numericInput.writeValue(this.current);
-            return;
-        }
-        if (inputValue !== this.current) {
-            this.zone.run(() => {
-                this.changePage(inputValue - 1);
-            });
-        }
-    };
-    /**
-     * @hidden
-     */
-    get current() {
-        return this.hasPages ? this.currentPage : 0;
-    }
-    get hasPages() {
-        return this.totalPages !== 0;
-    }
-    onChanges({ total, skip, pageSize }) {
-        this.total = total;
-        this.skip = skip;
-        this.pageSize = pageSize;
-        this.cd.markForCheck();
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PagerInputComponent, deps: [{ token: ContextService }, { token: PagerContextService }, { token: i0.NgZone }, { token: NavigationService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: PagerInputComponent, isStandalone: true, selector: "kendo-pager-input", viewQueries: [{ propertyName: "numericInput", first: true, predicate: NumericTextBoxComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: `
-     <span class="k-pager-input k-label">
-        {{textFor('pagerPage')}}
-        <kendo-numerictextbox
-            kendoGridPagerInput
-            [kendoGridFocusable]="hasPages"
-            [spinners]="false"
-            [decimals]="0"
-            format="n0"
-            [disabled]="!hasPages"
-            [value]="current"
-            [min]="hasPages ? 1 : 0"
-            [max]="totalPages"
-            [size]="size"
-            [autoCorrect]="true"
-            [title]="textFor('pagerPageNumberInputTitle')"
-            [kendoEventsOutsideAngular]="{
-                keydown: handleKeyDown,
-                focusout: handleBlur
-            }"
-        >
-        </kendo-numerictextbox>
-        {{textFor('pagerOf')}} {{totalPages}}
-     </span>
-    `, isInline: true, dependencies: [{ kind: "component", type: NumericTextBoxComponent, selector: "kendo-numerictextbox", inputs: ["focusableId", "disabled", "readonly", "title", "autoCorrect", "format", "max", "min", "decimals", "placeholder", "step", "spinners", "rangeValidation", "tabindex", "tabIndex", "changeValueOnScroll", "selectOnFocus", "value", "maxlength", "size", "rounded", "fillMode", "inputAttributes"], outputs: ["valueChange", "focus", "blur", "inputFocus", "inputBlur"], exportAs: ["kendoNumericTextBox"] }, { kind: "directive", type: PagerInputDirective, selector: "[kendoGridPagerInput]" }, { kind: "directive", type: FocusableDirective, selector: "[kendoGridFocusable],\n        [kendoGridEditCommand],\n        [kendoGridRemoveCommand],\n        [kendoGridSaveCommand],\n        [kendoGridCancelCommand],\n        [kendoGridSelectionCheckbox]\n    ", inputs: ["kendoGridFocusable"] }, { kind: "directive", type: EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PagerInputComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'kendo-pager-input',
-                    template: `
-     <span class="k-pager-input k-label">
-        {{textFor('pagerPage')}}
-        <kendo-numerictextbox
-            kendoGridPagerInput
-            [kendoGridFocusable]="hasPages"
-            [spinners]="false"
-            [decimals]="0"
-            format="n0"
-            [disabled]="!hasPages"
-            [value]="current"
-            [min]="hasPages ? 1 : 0"
-            [max]="totalPages"
-            [size]="size"
-            [autoCorrect]="true"
-            [title]="textFor('pagerPageNumberInputTitle')"
-            [kendoEventsOutsideAngular]="{
-                keydown: handleKeyDown,
-                focusout: handleBlur
-            }"
-        >
-        </kendo-numerictextbox>
-        {{textFor('pagerOf')}} {{totalPages}}
-     </span>
-    `,
-                    standalone: true,
-                    imports: [NumericTextBoxComponent, PagerInputDirective, FocusableDirective, EventsOutsideAngularDirective]
-                }]
-        }], ctorParameters: function () { return [{ type: ContextService }, { type: PagerContextService }, { type: i0.NgZone }, { type: NavigationService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { numericInput: [{
-                type: ViewChild,
-                args: [NumericTextBoxComponent, { static: false }]
-            }] } });
-
-/**
- * Displays buttons for navigating to the first and to the previous page ([see example](slug:pager_template_grid#toc-using-built-in-pager-components)).
- */
-class PagerPrevButtonsComponent extends PagerElementComponent {
-    navigationService;
-    constructor(ctx, pagerContext, cd, navigationService) {
-        super(ctx, pagerContext, cd);
-        this.navigationService = navigationService;
-    }
-    /**
-     * @hidden
-     *
-     * @readonly
-     * @type {boolean}
-     * @memberOf PagerPrevButtonsComponent
-     */
-    get disabled() {
-        return this.currentPage === 1 || !this.total;
-    }
-    onChanges({ total, skip, pageSize }) {
-        this.total = total;
-        this.skip = skip;
-        this.pageSize = pageSize;
-        this.cd.markForCheck();
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PagerPrevButtonsComponent, deps: [{ token: ContextService }, { token: PagerContextService }, { token: i0.ChangeDetectorRef }, { token: NavigationService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: PagerPrevButtonsComponent, isStandalone: true, selector: "kendo-pager-prev-buttons", usesInheritance: true, ngImport: i0, template: `
-        <button
-            [kendoGridFocusable]="!disabled"
-            kendoButton
-            type="button"
-            [title]="textFor('pagerFirstPage')"
-            [attr.aria-label]="textFor('pagerFirstPage')"
-            (click)="currentPage !== 1 ? changePage(0) : false"
-            role="button"
-            [icon]="prevArrowIcons[0]"
-            [svgIcon]="prevArrowSVGIcons[0]"
-            class="k-pager-nav k-pager-first"
-            [disabled]="disabled"
-            fillMode="flat"
-            rounded="none"
-            [size]="size">
-        </button>
-        <button
-            kendoButton
-            [kendoGridFocusable]="!disabled"
-            type="button"
-            class="k-pager-nav"
-            [disabled]="disabled"
-            [icon]="prevArrowIcons[1]"
-            [svgIcon]="prevArrowSVGIcons[1]"
-            fillMode="flat"
-            rounded="none"
-            [size]="size"
-            [title]="textFor('pagerPreviousPage')"
-            [attr.aria-label]="textFor('pagerPreviousPage')"
-            (click)="currentPage !== 1 ? changePage(currentPage-2) : false">
-        </button>
-    `, isInline: true, dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "directive", type: FocusableDirective, selector: "[kendoGridFocusable],\n        [kendoGridEditCommand],\n        [kendoGridRemoveCommand],\n        [kendoGridSaveCommand],\n        [kendoGridCancelCommand],\n        [kendoGridSelectionCheckbox]\n    ", inputs: ["kendoGridFocusable"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PagerPrevButtonsComponent, decorators: [{
-            type: Component,
-            args: [{
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    selector: 'kendo-pager-prev-buttons',
-                    template: `
-        <button
-            [kendoGridFocusable]="!disabled"
-            kendoButton
-            type="button"
-            [title]="textFor('pagerFirstPage')"
-            [attr.aria-label]="textFor('pagerFirstPage')"
-            (click)="currentPage !== 1 ? changePage(0) : false"
-            role="button"
-            [icon]="prevArrowIcons[0]"
-            [svgIcon]="prevArrowSVGIcons[0]"
-            class="k-pager-nav k-pager-first"
-            [disabled]="disabled"
-            fillMode="flat"
-            rounded="none"
-            [size]="size">
-        </button>
-        <button
-            kendoButton
-            [kendoGridFocusable]="!disabled"
-            type="button"
-            class="k-pager-nav"
-            [disabled]="disabled"
-            [icon]="prevArrowIcons[1]"
-            [svgIcon]="prevArrowSVGIcons[1]"
-            fillMode="flat"
-            rounded="none"
-            [size]="size"
-            [title]="textFor('pagerPreviousPage')"
-            [attr.aria-label]="textFor('pagerPreviousPage')"
-            (click)="currentPage !== 1 ? changePage(currentPage-2) : false">
-        </button>
-    `,
-                    standalone: true,
-                    imports: [ButtonComponent, FocusableDirective]
-                }]
-        }], ctorParameters: function () { return [{ type: ContextService }, { type: PagerContextService }, { type: i0.ChangeDetectorRef }, { type: NavigationService }]; } });
-
-/**
- * @hidden
- */
-class PagerComponent {
-    pagerContext;
-    navigationService;
-    element;
-    renderer;
-    zone;
-    ctx;
-    cellContext;
-    focusRoot;
-    focusGroup;
-    pagerInfo;
-    pagerPageSizes;
-    numericButtons;
-    total = 0;
-    skip = 1;
-    pageSize;
-    set options(value) {
-        this.settings = normalize(value);
-    }
-    set size(size) {
-        this._size = size;
-        if (size === 'none') {
-            this.element.nativeElement.classList.remove('k-pager-sm', 'k-pager-md');
-        }
-    }
-    get size() {
-        return this._size;
-    }
-    template;
-    pageChange = new EventEmitter();
-    gridPagerClass = true;
-    get sizeSmallClass() {
-        return this.size === 'small';
-    }
-    get sizeMediumClass() {
-        return this.size === 'medium' || !this.size;
-    }
-    settings = normalize({});
-    subscriptions = new Subscription();
-    _templateContext = {};
-    _isFocused = false;
-    _size = 'medium';
-    get isFocused() {
-        return this._isFocused;
-    }
-    get pagerAriaLabel() {
-        return this.navigationService.pagerEnabled ? this.pagerLabel : undefined;
-    }
-    get pagerLabel() {
-        const localizationMsg = this.ctx.localization.get('pagerLabel') || '';
-        return replaceMessagePlaceholder(replaceMessagePlaceholder(localizationMsg, 'currentPage', this.currentPage.toString()), 'totalPages', this.totalPages.toString());
-    }
-    get focusTrapTabIndex() {
-        return this.focusGroup.isActive ? '0' : '-1';
-    }
-    onFocusIn(event) {
-        if (this.navigationService.pagerEnabled) {
-            const shouldFocusPager = event.target === this.element.nativeElement;
-            if (shouldFocusPager) {
-                this._isFocused = true;
-                this.focusRoot.deactivate();
-            }
-            else {
-                this.focusRoot.activate();
-            }
-        }
-    }
-    onFocusOut() {
-        if (this.navigationService.pagerEnabled) {
-            this._isFocused = false;
-        }
-    }
-    onEscape() {
-        if (this.navigationService.pagerEnabled) {
-            this.focusRoot.deactivate();
-            this.element.nativeElement.focus();
-        }
-    }
-    onEnter(event) {
-        if (this.navigationService.pagerEnabled && event.target === this.element.nativeElement) {
-            event.preventDefault();
-            this.focusRoot.activate();
-            this.focusFirstElement();
-        }
-    }
-    navigateToPreviousPage(e) {
-        e.preventDefault();
-        if (this.shouldTriggerPageChange(e.target, this.currentPage > 1)) {
-            this.pagerContext.prevPage();
-        }
-    }
-    navigateToNextPage(e) {
-        e.preventDefault();
-        if (this.shouldTriggerPageChange(e.target, this.currentPage < this.totalPages)) {
-            this.pagerContext.nextPage();
-        }
-    }
-    navigateToFirstPage(e) {
-        e.preventDefault();
-        if (this.shouldTriggerPageChange(e.target, this.currentPage > 1)) {
-            this.pagerContext.changePage(0);
-        }
-    }
-    navigateToLastPage(e) {
-        e.preventDefault();
-        if (this.shouldTriggerPageChange(e.target, this.currentPage < this.totalPages)) {
-            this.pagerContext.changePage(this.totalPages - 1);
-        }
-    }
-    get totalPages() {
-        return Math.ceil((this.total || 0) / this.pageSize);
-    }
-    get currentPage() {
-        return Math.floor((this.skip || 0) / this.pageSize) + 1;
-    }
-    get templateContext() {
-        const context = this._templateContext;
-        context.totalPages = this.totalPages;
-        context.total = this.total;
-        context.skip = this.skip;
-        context.pageSize = this.pageSize;
-        context.currentPage = this.currentPage;
-        return context;
-    }
-    constructor(pagerContext, navigationService, element, renderer, zone, ctx, cellContext, focusRoot, focusGroup) {
-        this.pagerContext = pagerContext;
-        this.navigationService = navigationService;
-        this.element = element;
-        this.renderer = renderer;
-        this.zone = zone;
-        this.ctx = ctx;
-        this.cellContext = cellContext;
-        this.focusRoot = focusRoot;
-        this.focusGroup = focusGroup;
-    }
-    ngOnInit() {
-        this.subscriptions.add(this.pagerContext.pageChange.subscribe(this.changePage.bind(this)));
-        if (this.navigationService.pagerEnabled) {
-            this.focusRoot.deactivate();
-        }
-    }
-    ngDoCheck() {
-        this.updateCellContext();
-    }
-    ngOnChanges(changes) {
-        if (anyChanged(['pageSize', 'skip', 'total'], changes, false)) {
-            this.pagerContext.notifyChanges({
-                pageSize: this.pageSize,
-                skip: this.skip,
-                total: this.total
-            });
-        }
-        const changesInTemplate = changes['template'];
-        if (changesInTemplate) {
-            changesInTemplate.currentValue ? this.clearResponsiveStyling() : this.resizeHandler();
-        }
-        if (changes['options']) {
-            this.settings.responsive ? this.resizeHandler() : this.clearResponsiveStyling();
-        }
-    }
-    ngOnDestroy() {
-        if (this.subscriptions) {
-            this.subscriptions.unsubscribe();
-        }
-    }
-    changePage(event) {
-        this.pageChange.emit(event);
-    }
-    resizeHandler = () => {
-        const element = this.element.nativeElement;
-        if (this.template || !element) {
-            return;
-        }
-        this.zone.runOutsideAngular(() => {
-            setTimeout(() => {
-                const width = element.offsetWidth;
-                if (this.numericButtons) {
-                    const selectElement = this.numericButtons.selectElement.nativeElement;
-                    const numbersElement = this.numericButtons.numbersElement.nativeElement;
-                    this.renderer.removeStyle(numbersElement, 'display');
-                    this.renderer.setStyle(selectElement, 'display', 'none');
-                    if (width < RESPONSIVE_BREAKPOINT_MEDIUM) {
-                        this.renderer.removeStyle(selectElement, 'display');
-                        this.renderer.setStyle(numbersElement, 'display', 'none');
-                    }
-                }
-                if (this.pagerInfo) {
-                    this.renderer.removeStyle(this.pagerInfo.nativeElement, 'display');
-                    if (width < RESPONSIVE_BREAKPOINT_LARGE) {
-                        this.renderer.setStyle(this.pagerInfo.nativeElement, 'display', 'none');
-                    }
-                }
-                if (this.pagerPageSizes) {
-                    this.renderer.removeStyle(this.pagerPageSizes.nativeElement, 'display');
-                    if (width < RESPONSIVE_BREAKPOINT_MEDIUM) {
-                        this.renderer.setStyle(this.pagerPageSizes.nativeElement, 'display', 'none');
-                    }
-                }
-            });
-        });
-    };
-    onInnerFocusIn(event, position) {
-        this.zone.onStable.pipe(take(1)).subscribe(() => {
-            if (position === 'start') {
-                if (event.relatedTarget === this.element.nativeElement) {
-                    this.focusFirstElement();
-                }
-                else {
-                    this.focusLastElement();
-                }
-            }
-            else {
-                this.focusFirstElement();
-            }
-        });
-    }
-    shouldTriggerPageChange(target, condition) {
-        return this.navigationService.pagerEnabled &&
-            target === this.element.nativeElement &&
-            condition;
-    }
-    focusFirstElement() {
-        const first = findFocusableChild(this.element.nativeElement, true);
-        if (first) {
-            first.focus();
-        }
-    }
-    focusLastElement() {
-        const last = findLastFocusableChild(this.element.nativeElement, true);
-        if (last) {
-            last.focus();
-        }
-    }
-    updateCellContext() {
-        if (this.cellContext) {
-            this.cellContext.focusGroup = this.focusGroup;
-        }
-    }
-    clearResponsiveStyling() {
-        this.zone.runOutsideAngular(() => {
-            setTimeout(() => {
-                if (this.numericButtons) {
-                    this.renderer.removeStyle(this.numericButtons.numbersElement.nativeElement, 'display');
-                    this.renderer.setStyle(this.numericButtons.selectElement.nativeElement, 'display', 'none');
-                }
-                this.pagerInfo && this.renderer.removeStyle(this.pagerInfo.nativeElement, 'display');
-                this.pagerPageSizes && this.renderer.removeStyle(this.pagerPageSizes.nativeElement, 'display');
-            });
-        });
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PagerComponent, deps: [{ token: PagerContextService }, { token: NavigationService }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.NgZone }, { token: ContextService }, { token: CELL_CONTEXT, optional: true }, { token: FocusRoot }, { token: FocusGroup }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: PagerComponent, isStandalone: true, selector: "kendo-pager", inputs: { total: "total", skip: "skip", pageSize: "pageSize", options: "options", size: "size", 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-grid-pager": "this.gridPagerClass", "class.k-pager-sm": "this.sizeSmallClass", "class.k-pager-md": "this.sizeMediumClass", "class.k-focus": "this.isFocused", "attr.aria-label": "this.pagerAriaLabel" } }, providers: [{
-                provide: FOCUS_ROOT_ACTIVE,
-                useValue: true
-            }, {
-                provide: FocusRoot,
-                deps: [FOCUS_ROOT_ACTIVE],
-                useClass: FocusRoot
-            }, {
-                provide: FocusGroup,
-                deps: [FocusRoot],
-                useClass: FocusGroup
-            }], viewQueries: [{ propertyName: "pagerInfo", first: true, predicate: PagerInfoComponent, descendants: true, read: ElementRef }, { propertyName: "pagerPageSizes", first: true, predicate: PagerPageSizesComponent, descendants: true, read: ElementRef }, { propertyName: "numericButtons", first: true, predicate: PagerNumericButtonsComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: `
-        <div
-            *ngIf="navigationService.pagerEnabled"
-            class="k-sr-only"
-            [tabindex]="focusTrapTabIndex"
-            [attr.aria-hidden]="true"
-            (focusin)="onInnerFocusIn($event, 'start')">
-        </div>
-        <ng-container
-            *ngIf="template?.templateRef"
-            [ngTemplateOutlet]="template.templateRef"
-            [ngTemplateOutletContext]="templateContext">
-        </ng-container>
-        <ng-container *ngIf="!template?.templateRef">
-            <div class="k-pager-numbers-wrap">
-                <kendo-pager-prev-buttons [size]="size" *ngIf="settings.previousNext"></kendo-pager-prev-buttons>
-                <kendo-pager-numeric-buttons
-                    [size]="size"
-                    *ngIf="settings.type === 'numeric'"
-                    [buttonCount]="settings.buttonCount">
-                </kendo-pager-numeric-buttons>
-                <kendo-pager-input [size]="size" *ngIf="settings.type === 'input'"></kendo-pager-input>
-                <kendo-pager-next-buttons [size]="size" *ngIf="settings.previousNext"></kendo-pager-next-buttons>
-            </div>
-            <kendo-pager-info *ngIf='settings.info'></kendo-pager-info>
-            <kendo-pager-page-sizes
-                [size]="size"
-                *ngIf="settings.pageSizes"
-                [pageSizes]="$any(settings.pageSizes)"
-            ></kendo-pager-page-sizes>
-        </ng-container>
-        <div
-            *ngIf="navigationService.pagerEnabled"
-            class="k-sr-only"
-            [tabindex]="focusTrapTabIndex"
-            [attr.aria-hidden]="true"
-            (focusin)="onInnerFocusIn($event, 'end')">
-        </div>
-        <kendo-resize-sensor *ngIf="settings.responsive" (resize)="resizeHandler()"></kendo-resize-sensor>
-  `, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: PagerPrevButtonsComponent, selector: "kendo-pager-prev-buttons" }, { kind: "component", type: PagerNumericButtonsComponent, selector: "kendo-pager-numeric-buttons", inputs: ["buttonCount"] }, { kind: "component", type: PagerInputComponent, selector: "kendo-pager-input" }, { kind: "component", type: PagerNextButtonsComponent, selector: "kendo-pager-next-buttons" }, { kind: "component", type: PagerInfoComponent, selector: "kendo-pager-info" }, { kind: "component", type: PagerPageSizesComponent, selector: "kendo-pager-page-sizes", inputs: ["pageSizes"] }, { kind: "component", type: ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PagerComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'kendo-pager',
-                    providers: [{
-                            provide: FOCUS_ROOT_ACTIVE,
-                            useValue: true
-                        }, {
-                            provide: FocusRoot,
-                            deps: [FOCUS_ROOT_ACTIVE],
-                            useClass: FocusRoot
-                        }, {
-                            provide: FocusGroup,
-                            deps: [FocusRoot],
-                            useClass: FocusGroup
-                        }],
-                    template: `
-        <div
-            *ngIf="navigationService.pagerEnabled"
-            class="k-sr-only"
-            [tabindex]="focusTrapTabIndex"
-            [attr.aria-hidden]="true"
-            (focusin)="onInnerFocusIn($event, 'start')">
-        </div>
-        <ng-container
-            *ngIf="template?.templateRef"
-            [ngTemplateOutlet]="template.templateRef"
-            [ngTemplateOutletContext]="templateContext">
-        </ng-container>
-        <ng-container *ngIf="!template?.templateRef">
-            <div class="k-pager-numbers-wrap">
-                <kendo-pager-prev-buttons [size]="size" *ngIf="settings.previousNext"></kendo-pager-prev-buttons>
-                <kendo-pager-numeric-buttons
-                    [size]="size"
-                    *ngIf="settings.type === 'numeric'"
-                    [buttonCount]="settings.buttonCount">
-                </kendo-pager-numeric-buttons>
-                <kendo-pager-input [size]="size" *ngIf="settings.type === 'input'"></kendo-pager-input>
-                <kendo-pager-next-buttons [size]="size" *ngIf="settings.previousNext"></kendo-pager-next-buttons>
-            </div>
-            <kendo-pager-info *ngIf='settings.info'></kendo-pager-info>
-            <kendo-pager-page-sizes
-                [size]="size"
-                *ngIf="settings.pageSizes"
-                [pageSizes]="$any(settings.pageSizes)"
-            ></kendo-pager-page-sizes>
-        </ng-container>
-        <div
-            *ngIf="navigationService.pagerEnabled"
-            class="k-sr-only"
-            [tabindex]="focusTrapTabIndex"
-            [attr.aria-hidden]="true"
-            (focusin)="onInnerFocusIn($event, 'end')">
-        </div>
-        <kendo-resize-sensor *ngIf="settings.responsive" (resize)="resizeHandler()"></kendo-resize-sensor>
-  `,
-                    standalone: true,
-                    imports: [NgIf, NgTemplateOutlet, PagerPrevButtonsComponent, PagerNumericButtonsComponent, PagerInputComponent, PagerNextButtonsComponent, PagerInfoComponent, PagerPageSizesComponent, ResizeSensorComponent]
-                }]
-        }], ctorParameters: function () { return [{ type: PagerContextService }, { type: NavigationService }, { type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.NgZone }, { type: ContextService }, { type: undefined, decorators: [{
-                    type: Optional
-                }, {
-                    type: Inject,
-                    args: [CELL_CONTEXT]
-                }] }, { type: FocusRoot }, { type: FocusGroup }]; }, propDecorators: { pagerInfo: [{
-                type: ViewChild,
-                args: [PagerInfoComponent, { read: ElementRef }]
-            }], pagerPageSizes: [{
-                type: ViewChild,
-                args: [PagerPageSizesComponent, { read: ElementRef }]
-            }], numericButtons: [{
-                type: ViewChild,
-                args: [PagerNumericButtonsComponent]
-            }], total: [{
-                type: Input
-            }], skip: [{
-                type: Input
-            }], pageSize: [{
-                type: Input
-            }], options: [{
-                type: Input
-            }], size: [{
-                type: Input
-            }], template: [{
-                type: Input
-            }], pageChange: [{
-                type: Output
-            }], gridPagerClass: [{
-                type: HostBinding,
-                args: ['class.k-grid-pager']
-            }], sizeSmallClass: [{
-                type: HostBinding,
-                args: ['class.k-pager-sm']
-            }], sizeMediumClass: [{
-                type: HostBinding,
-                args: ['class.k-pager-md']
-            }], isFocused: [{
-                type: HostBinding,
-                args: ['class.k-focus']
-            }], pagerAriaLabel: [{
-                type: HostBinding,
-                args: ['attr.aria-label']
-            }], onFocusIn: [{
-                type: HostListener,
-                args: ['focusin', ['$event']]
-            }], onFocusOut: [{
-                type: HostListener,
-                args: ['focusout']
-            }], onEscape: [{
-                type: HostListener,
-                args: ['keydown.escape']
-            }], onEnter: [{
-                type: HostListener,
-                args: ['keydown.enter', ['$event']]
-            }], navigateToPreviousPage: [{
-                type: HostListener,
-                args: ['keydown.arrowleft', ['$event']]
-            }, {
-                type: HostListener,
-                args: ['keydown.pageup', ['$event']]
-            }], navigateToNextPage: [{
-                type: HostListener,
-                args: ['keydown.arrowright', ['$event']]
-            }, {
-                type: HostListener,
-                args: ['keydown.pagedown', ['$event']]
-            }], navigateToFirstPage: [{
-                type: HostListener,
-                args: ['keydown.home', ['$event']]
-            }], navigateToLastPage: [{
-                type: HostListener,
-                args: ['keydown.end', ['$event']]
-            }] } });
-
-/**
- * @hidden
- */
-class ZoneAwareEventEmitter extends EventEmitter {
-    ngZone;
-    constructor(ngZone, isAsync = false) {
-        super(isAsync);
-        this.ngZone = ngZone;
-    }
-    subscribe(generatorOrNext, error, complete) {
-        let schedulerFn;
-        let errorFn = (_) => null;
-        let completeFn = () => null;
-        if (generatorOrNext && typeof generatorOrNext === 'object') {
-            schedulerFn = (value) => { this.ngZone.run(() => generatorOrNext.next(value)); };
-            if (generatorOrNext.error) {
-                errorFn = (err) => { this.ngZone.run(() => generatorOrNext.error(err)); };
-            }
-            if (generatorOrNext.complete) {
-                completeFn = () => { this.ngZone.run(() => generatorOrNext.complete()); };
-            }
-        }
-        else {
-            schedulerFn = (value) => { this.ngZone.run(() => generatorOrNext(value)); };
-            if (error) {
-                errorFn = (err) => { this.ngZone.run(() => error(err)); };
-            }
-            if (complete) {
-                completeFn = () => { this.ngZone.run(() => complete()); };
-            }
-        }
-        return super.subscribe(schedulerFn, errorFn, completeFn);
-    }
-}
-
-/**
- * @hidden
- */
-const packageMetadata = {
-    name: '@progress/kendo-angular-grid',
-    productName: 'Kendo UI for Angular',
-    productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1730710037,
-    version: '17.0.0-develop.33',
-    licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
-};
-
-const canCreateElement = () => isDocumentAvailable() && document.createElement;
-let cachedScrollbarWidth = null;
-let cachedPixelRatio;
-let cachedRtlScrollLeft = null;
-function scrollbarWidth() {
-    if (cachedScrollbarWidth === null && canCreateElement()) {
-        cachedPixelRatio = window.devicePixelRatio || 1;
-        const div = document.createElement("div");
-        div.style.cssText = "overflow:scroll;overflow-x:hidden;zoom:1;clear:both;display:block";
-        div.innerHTML = "&nbsp;";
-        document.body.appendChild(div);
-        cachedScrollbarWidth = div.offsetWidth - div.scrollWidth;
-        document.body.removeChild(div);
-    }
-    return cachedScrollbarWidth;
-}
-function rtlScrollLeft() {
-    if (cachedRtlScrollLeft === null && canCreateElement()) {
-        const outer = document.createElement('div');
-        outer.style.direction = 'rtl';
-        outer.style.display = 'block';
-        outer.style.clear = 'both';
-        outer.style.width = '100px';
-        outer.style.visibility = 'hidden';
-        outer.style.position = 'absolute';
-        outer.style.left = '-10000px';
-        outer.style.overflow = 'scroll';
-        outer.style.zoom = '1';
-        const inner = document.createElement('div');
-        inner.style.width = '200px';
-        inner.style.height = '1px';
-        outer.append(inner);
-        document.body.appendChild(outer);
-        const initial = outer.scrollLeft;
-        outer.scrollLeft = -1;
-        cachedRtlScrollLeft = outer.scrollLeft < 0 ? outer.scrollLeft : initial;
-        document.body.removeChild(outer);
-    }
-    return cachedRtlScrollLeft;
-}
-/**
- * @hidden
- * move to kendo-common
- */
-class BrowserSupportService {
-    zone;
-    changeDetector;
-    changes = new EventEmitter();
-    subscriptions;
-    constructor(zone, changeDetector) {
-        this.zone = zone;
-        this.changeDetector = changeDetector;
-        if (typeof window === 'undefined') {
-            return;
-        }
-        this.zone.runOutsideAngular(() => {
-            this.subscriptions = fromEvent(window, 'resize').pipe(auditTime(100)).subscribe(() => {
-                if (cachedPixelRatio !== window.devicePixelRatio) {
-                    zone.run(() => {
-                        cachedScrollbarWidth = null;
-                        this.changes.emit();
-                        this.changeDetector.markForCheck();
-                    });
-                }
-            });
-        });
-    }
-    ngOnDestroy() {
-        if (this.subscriptions) {
-            this.subscriptions.unsubscribe();
-            this.subscriptions = null;
-        }
-    }
-    get scrollbarWidth() {
-        return scrollbarWidth();
-    }
-    get rtlScrollLeft() {
-        return rtlScrollLeft();
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: BrowserSupportService, deps: [{ token: i0.NgZone }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: BrowserSupportService });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: BrowserSupportService, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return [{ type: i0.NgZone }, { type: i0.ChangeDetectorRef }]; } });
-
-const isGroupItem = (source) => {
-    return source.items !== undefined &&
-        source.field !== undefined;
-};
-const isVirtualGroupItem = (source) => {
-    return source.offset !== undefined &&
-        source.skipHeader !== undefined;
-};
-const flattenGroups = (groups) => (groups.reduce((acc, curr) => {
-    if (isGroupItem(curr)) {
-        return acc.concat(flattenGroups(curr.items));
-    }
-    return acc.concat([curr]);
-}, []));
-/**
- * @hidden
- */
-const itemAt = (data, index) => {
-    const first = data[0];
-    if (isPresent(first) && isGroupItem(first)) {
-        return flattenGroups(data)[index];
+const itemAt = (data, index) => {
+    const first = data[0];
+    if (isPresent(first) && isGroupItem(first)) {
+        return flattenGroups(data)[index];
     }
     return data[index];
 };
@@ -21595,6 +20111,19 @@ class ColumnLockedChangeEvent {
     }
 }
 
+/**
+ * @hidden
+ */
+const GROUP_CELL_WIDTH = 32; // this should be the value of group-cell inside the theme!
+/**
+ * @hidden
+ */
+const RESPONSIVE_BREAKPOINT_MEDIUM = 600;
+/**
+ * @hidden
+ */
+const RESPONSIVE_BREAKPOINT_LARGE = 768;
+
 /**
  * Arguments for the `columnStickyChange` event.
  */
@@ -23804,29 +22333,33 @@ class GridMessages extends ComponentMessages {
      */
     pagerNextPage;
     /**
-     * The label displayed before the pager input.
+     * The text displayed before the pager input.
      */
     pagerPage;
     /**
-     * The label displayed after the page-size selector.
+     * The text displayed after the page-size selector.
      */
     pagerItemsPerPage;
     /**
-     * The label before the total-page number.
+     * The text displayed before the total-page number.
      */
     pagerOf;
     /**
-     * The label after the total-page number.
+     * The text displayed after the total number of items.
      */
     pagerItems;
     /**
      * The title attribute of the page number input element.
      */
     pagerPageNumberInputTitle;
+    /**
+     * The text of the aria-label attribute applied to the page number input element.
+     */
+    pagerInputLabel;
     /**
      * The text of the title and `aria-label` attributes applied to the page chooser in the Grid Pager.
      */
-    selectPage;
+    pagerSelectPage;
     /**
      * The label of the filter cell or icon.
      */
@@ -24167,7 +22700,7 @@ class GridMessages extends ComponentMessages {
      */
     groupChipMenuNext;
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GridMessages, deps: null, target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: GridMessages, selector: "kendo-grid-messages-base", inputs: { groupPanelEmpty: "groupPanelEmpty", noRecords: "noRecords", pagerLabel: "pagerLabel", pagerFirstPage: "pagerFirstPage", pagerLastPage: "pagerLastPage", pagerPreviousPage: "pagerPreviousPage", pagerNextPage: "pagerNextPage", pagerPage: "pagerPage", pagerItemsPerPage: "pagerItemsPerPage", pagerOf: "pagerOf", pagerItems: "pagerItems", pagerPageNumberInputTitle: "pagerPageNumberInputTitle", selectPage: "selectPage", filter: "filter", filterInputLabel: "filterInputLabel", filterMenuTitle: "filterMenuTitle", filterMenuOperatorsDropDownLabel: "filterMenuOperatorsDropDownLabel", filterMenuLogicDropDownLabel: "filterMenuLogicDropDownLabel", filterCellOperatorLabel: "filterCellOperatorLabel", booleanFilterCellLabel: "booleanFilterCellLabel", filterEqOperator: "filterEqOperator", filterNotEqOperator: "filterNotEqOperator", filterIsNullOperator: "filterIsNullOperator", filterIsNotNullOperator: "filterIsNotNullOperator", filterIsEmptyOperator: "filterIsEmptyOperator", filterIsNotEmptyOperator: "filterIsNotEmptyOperator", filterStartsWithOperator: "filterStartsWithOperator", filterContainsOperator: "filterContainsOperator", filterNotContainsOperator: "filterNotContainsOperator", filterEndsWithOperator: "filterEndsWithOperator", filterGteOperator: "filterGteOperator", filterGtOperator: "filterGtOperator", filterLteOperator: "filterLteOperator", filterLtOperator: "filterLtOperator", filterIsTrue: "filterIsTrue", filterIsFalse: "filterIsFalse", filterBooleanAll: "filterBooleanAll", filterAfterOrEqualOperator: "filterAfterOrEqualOperator", filterAfterOperator: "filterAfterOperator", filterBeforeOperator: "filterBeforeOperator", filterBeforeOrEqualOperator: "filterBeforeOrEqualOperator", filterFilterButton: "filterFilterButton", filterClearButton: "filterClearButton", filterAndLogic: "filterAndLogic", filterOrLogic: "filterOrLogic", loading: "loading", gridLabel: "gridLabel", columnMenu: "columnMenu", setColumnPosition: "setColumnPosition", columns: "columns", lock: "lock", unlock: "unlock", stick: "stick", unstick: "unstick", sortable: "sortable", sortAscending: "sortAscending", sortDescending: "sortDescending", autosizeThisColumn: "autosizeThisColumn", autosizeAllColumns: "autosizeAllColumns", sortedAscending: "sortedAscending", sortedDescending: "sortedDescending", sortedDefault: "sortedDefault", columnsApply: "columnsApply", columnsReset: "columnsReset", detailExpand: "detailExpand", detailCollapse: "detailCollapse", filterDateToday: "filterDateToday", filterDateToggle: "filterDateToggle", filterNumericDecrement: "filterNumericDecrement", filterNumericIncrement: "filterNumericIncrement", selectionCheckboxLabel: "selectionCheckboxLabel", selectAllCheckboxLabel: "selectAllCheckboxLabel", groupCollapse: "groupCollapse", groupExpand: "groupExpand", topToolbarLabel: "topToolbarLabel", bottomToolbarLabel: "bottomToolbarLabel", groupPanelLabel: "groupPanelLabel", dragRowHandleLabel: "dragRowHandleLabel", columnMenuFilterTabTitle: "columnMenuFilterTabTitle", columnMenuGeneralTabTitle: "columnMenuGeneralTabTitle", columnMenuColumnsTabTitle: "columnMenuColumnsTabTitle", groupChipMenuPrevious: "groupChipMenuPrevious", groupChipMenuNext: "groupChipMenuNext" }, usesInheritance: true, ngImport: i0 });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: GridMessages, selector: "kendo-grid-messages-base", inputs: { groupPanelEmpty: "groupPanelEmpty", noRecords: "noRecords", pagerLabel: "pagerLabel", pagerFirstPage: "pagerFirstPage", pagerLastPage: "pagerLastPage", pagerPreviousPage: "pagerPreviousPage", pagerNextPage: "pagerNextPage", pagerPage: "pagerPage", pagerItemsPerPage: "pagerItemsPerPage", pagerOf: "pagerOf", pagerItems: "pagerItems", pagerPageNumberInputTitle: "pagerPageNumberInputTitle", pagerInputLabel: "pagerInputLabel", pagerSelectPage: "pagerSelectPage", filter: "filter", filterInputLabel: "filterInputLabel", filterMenuTitle: "filterMenuTitle", filterMenuOperatorsDropDownLabel: "filterMenuOperatorsDropDownLabel", filterMenuLogicDropDownLabel: "filterMenuLogicDropDownLabel", filterCellOperatorLabel: "filterCellOperatorLabel", booleanFilterCellLabel: "booleanFilterCellLabel", filterEqOperator: "filterEqOperator", filterNotEqOperator: "filterNotEqOperator", filterIsNullOperator: "filterIsNullOperator", filterIsNotNullOperator: "filterIsNotNullOperator", filterIsEmptyOperator: "filterIsEmptyOperator", filterIsNotEmptyOperator: "filterIsNotEmptyOperator", filterStartsWithOperator: "filterStartsWithOperator", filterContainsOperator: "filterContainsOperator", filterNotContainsOperator: "filterNotContainsOperator", filterEndsWithOperator: "filterEndsWithOperator", filterGteOperator: "filterGteOperator", filterGtOperator: "filterGtOperator", filterLteOperator: "filterLteOperator", filterLtOperator: "filterLtOperator", filterIsTrue: "filterIsTrue", filterIsFalse: "filterIsFalse", filterBooleanAll: "filterBooleanAll", filterAfterOrEqualOperator: "filterAfterOrEqualOperator", filterAfterOperator: "filterAfterOperator", filterBeforeOperator: "filterBeforeOperator", filterBeforeOrEqualOperator: "filterBeforeOrEqualOperator", filterFilterButton: "filterFilterButton", filterClearButton: "filterClearButton", filterAndLogic: "filterAndLogic", filterOrLogic: "filterOrLogic", loading: "loading", gridLabel: "gridLabel", columnMenu: "columnMenu", setColumnPosition: "setColumnPosition", columns: "columns", lock: "lock", unlock: "unlock", stick: "stick", unstick: "unstick", sortable: "sortable", sortAscending: "sortAscending", sortDescending: "sortDescending", autosizeThisColumn: "autosizeThisColumn", autosizeAllColumns: "autosizeAllColumns", sortedAscending: "sortedAscending", sortedDescending: "sortedDescending", sortedDefault: "sortedDefault", columnsApply: "columnsApply", columnsReset: "columnsReset", detailExpand: "detailExpand", detailCollapse: "detailCollapse", filterDateToday: "filterDateToday", filterDateToggle: "filterDateToggle", filterNumericDecrement: "filterNumericDecrement", filterNumericIncrement: "filterNumericIncrement", selectionCheckboxLabel: "selectionCheckboxLabel", selectAllCheckboxLabel: "selectAllCheckboxLabel", groupCollapse: "groupCollapse", groupExpand: "groupExpand", topToolbarLabel: "topToolbarLabel", bottomToolbarLabel: "bottomToolbarLabel", groupPanelLabel: "groupPanelLabel", dragRowHandleLabel: "dragRowHandleLabel", columnMenuFilterTabTitle: "columnMenuFilterTabTitle", columnMenuGeneralTabTitle: "columnMenuGeneralTabTitle", columnMenuColumnsTabTitle: "columnMenuColumnsTabTitle", groupChipMenuPrevious: "groupChipMenuPrevious", groupChipMenuNext: "groupChipMenuNext" }, usesInheritance: true, ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GridMessages, decorators: [{
             type: Directive,
@@ -24199,7 +22732,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                 type: Input
             }], pagerPageNumberInputTitle: [{
                 type: Input
-            }], selectPage: [{
+            }], pagerInputLabel: [{
+                type: Input
+            }], pagerSelectPage: [{
                 type: Input
             }], filter: [{
                 type: Input
@@ -24544,8 +23079,6 @@ class GridComponent {
             this._group = value;
         }
     }
-    /**
-     */
     get group() {
         return this._group;
     }
@@ -24635,6 +23168,9 @@ class GridComponent {
      * @default false
      */
     pageable = false;
+    get normalizedPageableSettings() {
+        return normalize(this.pageable);
+    }
     /**
      * If set to `true`, the user can group the Grid by dragging the column header cells ([see example]({% slug grouping_grid %})).
      * @default false
@@ -25059,7 +23595,7 @@ class GridComponent {
     }
     get headerPadding() {
         if (isUniversal()) {
-            return "";
+            return '';
         }
         const padding = Math.max(0, this.scrollbarWidth) + 'px';
         const right = this.rtl ? 0 : padding;
@@ -25564,9 +24100,7 @@ class GridComponent {
     /**
      * @hidden
      */
-    messageFor(token) {
-        return this.localization.get(token);
-    }
+    messageFor = token => this.localization.get(token);
     /**
      * Switches the specified table row in the edit mode ([see example]({% slug inline_editing_grid %}#toc-editing-records-1)).
      *
@@ -26423,6 +24957,7 @@ class GridComponent {
             FilterService,
             ResponsiveService,
             PagerContextService,
+            PagerNavigationService,
             ExcelService,
             ScrollSyncService,
             ResizeService,
@@ -26482,6 +25017,9 @@ class GridComponent {
             i18n-pagerItemsPerPage="kendo.grid.pagerItemsPerPage|The label for the page size chooser in the Grid pager"
             pagerItemsPerPage="items per page"
 
+            i18n-pagerInputLabel="kendo.grid.pagerInputLabel|The text of the aria-label attribute applied to the input element for entering the page number"
+            pagerInputLabel="Type a page number"
+
             i18n-filter="kendo.grid.filter|The label of the filter cell or icon"
             filter="Filter"
 
@@ -26665,8 +25203,8 @@ class GridComponent {
             i18n-groupExpand="kendo.grid.groupExpand|The text of the title and aria-label attributes applied to the expand icon of group rows."
             groupExpand="Expand Group"
 
-            i18n-selectPage="kendo.grid.selectPage|The text of the title and aria-label attributes applied to the page chooser in the Grid Pager"
-            selectPage="Select page"
+            i18n-pagerSelectPage="kendo.grid.pagerSelectPage|The text of the title and aria-label attributes applied to the page chooser in the Grid Pager"
+            pagerSelectPage="Select page"
 
             i18n-topToolbarLabel="kendo.grid.topToolbarLabel|The label for the Grid top toolbar"
             topToolbarLabel="Top toolbar"
@@ -26706,16 +25244,39 @@ class GridComponent {
         <ng-content select="kendo-toolbar"></ng-content>
         <kendo-pager
             *ngIf="showTopPager"
-            [tabindex]="navigation.pagerEnabled ? '0' : '-1'"
-            [attr.role]="navigation.pagerEnabled ? 'application' : undefined"
-            class="k-grid-pager-top k-pager"
-            [template]="pagerTemplate"
+            #topPager
+            [navigable]="navigation.pagerEnabled"
+            class="k-grid-pager k-grid-pager-top"
             [pageSize]="pageSize"
             [total]="view.total"
             [skip]="skip"
             [size]="size"
-            [options]="pageable"
+            [responsive]="normalizedPageableSettings.responsive && !pagerTemplate"
+            [buttonCount]="normalizedPageableSettings.buttonCount"
+            [info]="normalizedPageableSettings.info"
+            [pageSizeValues]="normalizedPageableSettings.pageSizes"
+            [previousNext]="normalizedPageableSettings.previousNext"
+            [type]="normalizedPageableSettings.type"
             (pageChange)="notifyPageChange('pager', $event)">
+            <ng-template kendoPagerTemplate>
+                <ng-container
+                    [ngTemplateOutlet]="pagerTemplate ? pagerTemplate?.templateRef : defaultPager"
+                    [ngTemplateOutletContext]="topPager.templateContext"></ng-container>
+            </ng-template>
+            <kendo-pager-messages
+                [ariaLabel]="messageFor('pagerLabel')"
+                [firstPage]="messageFor('pagerFirstPage')"
+                [inputLabel]="messageFor('pagerInputLabel')"
+                [previousPage]="messageFor('pagerPreviousPage')"
+                [nextPage]="messageFor('pagerNextPage')"
+                [lastPage]="messageFor('pagerLastPage')"
+                [selectPage]="messageFor('pagerSelectPage')"
+                [page]="messageFor('pagerPage')"
+                [itemsPerPage]="messageFor('pagerItemsPerPage')"
+                [items]="messageFor('pagerItems')"
+                [of]="messageFor('pagerOf')"
+                [pageNumberInputTitle]="messageFor('pagerPageNumberInputTitle')">
+            </kendo-pager-messages>
         </kendo-pager>
         <kendo-grid-group-panel
             *ngIf="showGroupPanel"
@@ -26997,16 +25558,39 @@ class GridComponent {
         </kendo-grid-status-bar>
         <kendo-pager
             *ngIf="showBottomPager"
-            [tabindex]="navigation.pagerEnabled ? '0' : '-1'"
-            [attr.role]="navigation.pagerEnabled ? 'application' : undefined"
-            [template]="pagerTemplate"
+            #bottomPager
+            class="k-grid-pager"
+            [navigable]="navigation.pagerEnabled"
             [pageSize]="pageSize"
             [total]="view.total"
             [skip]="skip"
             [size]="size"
-            [options]="pageable"
-            class="k-pager"
+            [responsive]="normalizedPageableSettings.responsive && !pagerTemplate"
+            [buttonCount]="normalizedPageableSettings.buttonCount"
+            [info]="normalizedPageableSettings.info"
+            [pageSizeValues]="normalizedPageableSettings.pageSizes"
+            [previousNext]="normalizedPageableSettings.previousNext"
+            [type]="normalizedPageableSettings.type"
             (pageChange)="notifyPageChange('pager', $event)">
+            <ng-template kendoPagerTemplate>
+                <ng-container 
+                    [ngTemplateOutlet]="pagerTemplate ? pagerTemplate?.templateRef : defaultPager"
+                    [ngTemplateOutletContext]="bottomPager.templateContext"></ng-container>
+            </ng-template>
+            <kendo-pager-messages
+                [ariaLabel]="messageFor('pagerLabel')"
+                [firstPage]="messageFor('pagerFirstPage')"
+                [inputLabel]="messageFor('pagerInputLabel')"
+                [previousPage]="messageFor('pagerPreviousPage')"
+                [nextPage]="messageFor('pagerNextPage')"
+                [lastPage]="messageFor('pagerLastPage')"
+                [selectPage]="messageFor('pagerSelectPage')"
+                [page]="messageFor('pagerPage')"
+                [itemsPerPage]="messageFor('pagerItemsPerPage')"
+                [items]="messageFor('pagerItems')"
+                [of]="messageFor('pagerOf')"
+                [pageNumberInputTitle]="messageFor('pagerPageNumberInputTitle')">
+            </kendo-pager-messages>
         </kendo-pager>
         <kendo-grid-toolbar
             class="k-grid-toolbar-bottom"
@@ -27027,8 +25611,26 @@ class GridComponent {
             {{hintText}}
         </ng-template>
 
+        <ng-template #defaultPager>
+            <div class="k-pager-numbers-wrap">
+                <kendo-pager-prev-buttons [size]="size" *ngIf="normalizedPageableSettings.previousNext"></kendo-pager-prev-buttons>
+                <kendo-pager-numeric-buttons
+                    [size]="size"
+                    *ngIf="normalizedPageableSettings.type === 'numeric' && normalizedPageableSettings.buttonCount > 0"
+                    [buttonCount]="normalizedPageableSettings.buttonCount">
+                </kendo-pager-numeric-buttons>
+                <kendo-pager-input [size]="size" *ngIf="normalizedPageableSettings.type === 'input'"></kendo-pager-input>
+                <kendo-pager-next-buttons [size]="size" *ngIf="normalizedPageableSettings.previousNext"></kendo-pager-next-buttons>
+            </div>
+            <kendo-pager-page-sizes *ngIf="normalizedPageableSettings.pageSizes"
+                [size]="size"
+                [pageSizes]="normalizedPageableSettings.pageSizes">
+            </kendo-pager-page-sizes>
+            <kendo-pager-info *ngIf="normalizedPageableSettings.info">
+            </kendo-pager-info>
+        </ng-template>
         <div kendoWatermarkOverlay *ngIf="showLicenseWatermark"></div>
-    `, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "[kendoGridLocalizedMessages]" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ToolbarComponent, selector: "kendo-grid-toolbar", inputs: ["position", "size", "navigable"] }, { kind: "component", type: PagerComponent, selector: "kendo-pager", inputs: ["total", "skip", "pageSize", "options", "size", "template"], outputs: ["pageChange"] }, { kind: "component", type: GroupPanelComponent, selector: "kendo-grid-group-panel", inputs: ["text", "navigable", "groups"], outputs: ["change"] }, { kind: "directive", type: TableDirective, selector: "[kendoGridResizableTable]", inputs: ["locked", "virtualColumns"] }, { kind: "directive", type: GridTableDirective, selector: "[kendoGridTable]", inputs: ["size"] }, { kind: "component", type: ColGroupComponent, selector: "[kendoGridColGroup]", inputs: ["columns", "groups", "detailTemplate", "sort"] }, { kind: "component", type: HeaderComponent, selector: "[kendoGridHeader]", inputs: ["totalColumnLevels", "columns", "groups", "detailTemplate", "scrollable", "filterable", "sort", "filter", "sortable", "groupable", "lockedColumnsCount", "resizable", "reorderable", "columnMenu", "columnMenuTemplate", "totalColumnsCount", "totalColumns", "tabIndex", "size"] }, { kind: "directive", type: ResizableContainerDirective, selector: "[kendoGridResizableContainer]", inputs: ["lockedWidth", "kendoGridResizableContainer"] }, { kind: "component", type: ListComponent, selector: "kendo-grid-list", inputs: ["data", "groups", "total", "rowHeight", "stickyRowHeight", "detailRowHeight", "take", "skip", "columns", "detailTemplate", "noRecordsTemplate", "selectable", "groupable", "filterable", "rowClass", "rowSticky", "loading", "trackBy", "virtualColumns", "isVirtual", "cellLoadingTemplate", "loadingTemplate", "sort", "size"], outputs: ["contentScroll", "pageChange", "scrollBottom"] }, { kind: "directive", type: DragTargetContainerDirective, selector: "[kendoDragTargetContainer]", inputs: ["hint", "dragTargetFilter", "dragHandle", "dragDelay", "threshold", "dragTargetId", "dragData", "dragDisabled", "mode"], outputs: ["onDragReady", "onPress", "onDragStart", "onDrag", "onRelease", "onDragEnd"], exportAs: ["kendoDragTargetContainer"] }, { kind: "directive", type: DropTargetContainerDirective, selector: "[kendoDropTargetContainer]", inputs: ["dropTargetFilter", "dropDisabled"], outputs: ["onDragEnter", "onDragOver", "onDragLeave", "onDrop"], exportAs: ["kendoDropTargetContainer"] }, { kind: "directive", type: DraggableDirective, selector: "[kendoDraggable]", inputs: ["enableDrag"], outputs: ["kendoPress", "kendoDrag", "kendoRelease"] }, { kind: "directive", type: GridMarqueeDirective, selector: "[kendoGridSelectionMarquee]" }, { kind: "component", type: FooterComponent, selector: "[kendoGridFooter]", inputs: ["columns", "groups", "detailTemplate", "scrollable", "lockedColumnsCount", "logicalRowIndex", "totalColumns"] }, { kind: "component", type: TableBodyComponent, selector: "[kendoGridTableBody]", inputs: ["columns", "allColumns", "groups", "detailTemplate", "noRecordsTemplate", "data", "skip", "selectable", "filterable", "noRecordsText", "isLocked", "isLoading", "isVirtual", "cellLoadingTemplate", "skipGroupDecoration", "showGroupFooters", "lockedColumnsCount", "totalColumnsCount", "virtualColumns", "trackBy", "rowSticky", "totalColumns", "rowClass"] }, { kind: "component", type: LoadingComponent, selector: "[kendoGridLoading]", inputs: ["loadingTemplate"] }, { kind: "component", type: StatusBarComponent, selector: "kendo-grid-status-bar", inputs: ["statusBarTemplate"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "component", type: WatermarkOverlayComponent, selector: "div[kendoWatermarkOverlay]" }], encapsulation: i0.ViewEncapsulation.None });
+    `, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "[kendoGridLocalizedMessages]" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ToolbarComponent, selector: "kendo-grid-toolbar", inputs: ["position", "size", "navigable"] }, { kind: "component", type: GroupPanelComponent, selector: "kendo-grid-group-panel", inputs: ["text", "navigable", "groups"], outputs: ["change"] }, { kind: "directive", type: TableDirective, selector: "[kendoGridResizableTable]", inputs: ["locked", "virtualColumns"] }, { kind: "directive", type: GridTableDirective, selector: "[kendoGridTable]", inputs: ["size"] }, { kind: "component", type: ColGroupComponent, selector: "[kendoGridColGroup]", inputs: ["columns", "groups", "detailTemplate", "sort"] }, { kind: "component", type: HeaderComponent, selector: "[kendoGridHeader]", inputs: ["totalColumnLevels", "columns", "groups", "detailTemplate", "scrollable", "filterable", "sort", "filter", "sortable", "groupable", "lockedColumnsCount", "resizable", "reorderable", "columnMenu", "columnMenuTemplate", "totalColumnsCount", "totalColumns", "tabIndex", "size"] }, { kind: "directive", type: ResizableContainerDirective, selector: "[kendoGridResizableContainer]", inputs: ["lockedWidth", "kendoGridResizableContainer"] }, { kind: "component", type: ListComponent, selector: "kendo-grid-list", inputs: ["data", "groups", "total", "rowHeight", "stickyRowHeight", "detailRowHeight", "take", "skip", "columns", "detailTemplate", "noRecordsTemplate", "selectable", "groupable", "filterable", "rowClass", "rowSticky", "loading", "trackBy", "virtualColumns", "isVirtual", "cellLoadingTemplate", "loadingTemplate", "sort", "size"], outputs: ["contentScroll", "pageChange", "scrollBottom"] }, { kind: "directive", type: DragTargetContainerDirective, selector: "[kendoDragTargetContainer]", inputs: ["hint", "dragTargetFilter", "dragHandle", "dragDelay", "threshold", "dragTargetId", "dragData", "dragDisabled", "mode"], outputs: ["onDragReady", "onPress", "onDragStart", "onDrag", "onRelease", "onDragEnd"], exportAs: ["kendoDragTargetContainer"] }, { kind: "directive", type: DropTargetContainerDirective, selector: "[kendoDropTargetContainer]", inputs: ["dropTargetFilter", "dropDisabled"], outputs: ["onDragEnter", "onDragOver", "onDragLeave", "onDrop"], exportAs: ["kendoDropTargetContainer"] }, { kind: "directive", type: DraggableDirective, selector: "[kendoDraggable]", inputs: ["enableDrag"], outputs: ["kendoPress", "kendoDrag", "kendoRelease"] }, { kind: "directive", type: GridMarqueeDirective, selector: "[kendoGridSelectionMarquee]" }, { kind: "component", type: FooterComponent, selector: "[kendoGridFooter]", inputs: ["columns", "groups", "detailTemplate", "scrollable", "lockedColumnsCount", "logicalRowIndex", "totalColumns"] }, { kind: "component", type: TableBodyComponent, selector: "[kendoGridTableBody]", inputs: ["columns", "allColumns", "groups", "detailTemplate", "noRecordsTemplate", "data", "skip", "selectable", "filterable", "noRecordsText", "isLocked", "isLoading", "isVirtual", "cellLoadingTemplate", "skipGroupDecoration", "showGroupFooters", "lockedColumnsCount", "totalColumnsCount", "virtualColumns", "trackBy", "rowSticky", "totalColumns", "rowClass"] }, { kind: "component", type: LoadingComponent, selector: "[kendoGridLoading]", inputs: ["loadingTemplate"] }, { kind: "component", type: StatusBarComponent, selector: "kendo-grid-status-bar", inputs: ["statusBarTemplate"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "component", type: WatermarkOverlayComponent, selector: "div[kendoWatermarkOverlay]" }, { kind: "component", type: i42.CustomMessagesComponent, selector: "kendo-datapager-messages, kendo-pager-messages" }, { kind: "component", type: i42.PagerInfoComponent, selector: "kendo-datapager-info, kendo-pager-info" }, { kind: "component", type: i42.PagerInputComponent, selector: "kendo-datapager-input, kendo-pager-input", inputs: ["size"] }, { kind: "component", type: i42.PagerNextButtonsComponent, selector: "kendo-datapager-next-buttons, kendo-pager-next-buttons", inputs: ["size"] }, { kind: "component", type: i42.PagerNumericButtonsComponent, selector: "kendo-datapager-numeric-buttons, kendo-pager-numeric-buttons", inputs: ["buttonCount", "size"] }, { kind: "component", type: i42.PagerPageSizesComponent, selector: "kendo-datapager-page-sizes, kendo-pager-page-sizes", inputs: ["pageSizes", "size"] }, { kind: "component", type: i42.PagerPrevButtonsComponent, selector: "kendo-datapager-prev-buttons, kendo-pager-prev-buttons", inputs: ["size"] }, { kind: "directive", type: i42.PagerTemplateDirective, selector: "[kendoDataPagerTemplate], [kendoPagerTemplate]" }, { kind: "component", type: i42.PagerComponent, selector: "kendo-datapager, kendo-pager", inputs: ["externalTemplate", "total", "skip", "pageSize", "buttonCount", "info", "type", "pageSizeValues", "previousNext", "navigable", "size", "responsive"], outputs: ["pageChange", "pageSizeChange"], exportAs: ["kendoDataPager", "kendoPager"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GridComponent, decorators: [{
             type: Component,
@@ -27059,6 +25661,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                         FilterService,
                         ResponsiveService,
                         PagerContextService,
+                        PagerNavigationService,
                         ExcelService,
                         ScrollSyncService,
                         ResizeService,
@@ -27120,6 +25723,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
             i18n-pagerItemsPerPage="kendo.grid.pagerItemsPerPage|The label for the page size chooser in the Grid pager"
             pagerItemsPerPage="items per page"
 
+            i18n-pagerInputLabel="kendo.grid.pagerInputLabel|The text of the aria-label attribute applied to the input element for entering the page number"
+            pagerInputLabel="Type a page number"
+
             i18n-filter="kendo.grid.filter|The label of the filter cell or icon"
             filter="Filter"
 
@@ -27303,8 +25909,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
             i18n-groupExpand="kendo.grid.groupExpand|The text of the title and aria-label attributes applied to the expand icon of group rows."
             groupExpand="Expand Group"
 
-            i18n-selectPage="kendo.grid.selectPage|The text of the title and aria-label attributes applied to the page chooser in the Grid Pager"
-            selectPage="Select page"
+            i18n-pagerSelectPage="kendo.grid.pagerSelectPage|The text of the title and aria-label attributes applied to the page chooser in the Grid Pager"
+            pagerSelectPage="Select page"
 
             i18n-topToolbarLabel="kendo.grid.topToolbarLabel|The label for the Grid top toolbar"
             topToolbarLabel="Top toolbar"
@@ -27344,16 +25950,39 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
         <ng-content select="kendo-toolbar"></ng-content>
         <kendo-pager
             *ngIf="showTopPager"
-            [tabindex]="navigation.pagerEnabled ? '0' : '-1'"
-            [attr.role]="navigation.pagerEnabled ? 'application' : undefined"
-            class="k-grid-pager-top k-pager"
-            [template]="pagerTemplate"
+            #topPager
+            [navigable]="navigation.pagerEnabled"
+            class="k-grid-pager k-grid-pager-top"
             [pageSize]="pageSize"
             [total]="view.total"
             [skip]="skip"
             [size]="size"
-            [options]="pageable"
+            [responsive]="normalizedPageableSettings.responsive && !pagerTemplate"
+            [buttonCount]="normalizedPageableSettings.buttonCount"
+            [info]="normalizedPageableSettings.info"
+            [pageSizeValues]="normalizedPageableSettings.pageSizes"
+            [previousNext]="normalizedPageableSettings.previousNext"
+            [type]="normalizedPageableSettings.type"
             (pageChange)="notifyPageChange('pager', $event)">
+            <ng-template kendoPagerTemplate>
+                <ng-container
+                    [ngTemplateOutlet]="pagerTemplate ? pagerTemplate?.templateRef : defaultPager"
+                    [ngTemplateOutletContext]="topPager.templateContext"></ng-container>
+            </ng-template>
+            <kendo-pager-messages
+                [ariaLabel]="messageFor('pagerLabel')"
+                [firstPage]="messageFor('pagerFirstPage')"
+                [inputLabel]="messageFor('pagerInputLabel')"
+                [previousPage]="messageFor('pagerPreviousPage')"
+                [nextPage]="messageFor('pagerNextPage')"
+                [lastPage]="messageFor('pagerLastPage')"
+                [selectPage]="messageFor('pagerSelectPage')"
+                [page]="messageFor('pagerPage')"
+                [itemsPerPage]="messageFor('pagerItemsPerPage')"
+                [items]="messageFor('pagerItems')"
+                [of]="messageFor('pagerOf')"
+                [pageNumberInputTitle]="messageFor('pagerPageNumberInputTitle')">
+            </kendo-pager-messages>
         </kendo-pager>
         <kendo-grid-group-panel
             *ngIf="showGroupPanel"
@@ -27635,16 +26264,39 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
         </kendo-grid-status-bar>
         <kendo-pager
             *ngIf="showBottomPager"
-            [tabindex]="navigation.pagerEnabled ? '0' : '-1'"
-            [attr.role]="navigation.pagerEnabled ? 'application' : undefined"
-            [template]="pagerTemplate"
+            #bottomPager
+            class="k-grid-pager"
+            [navigable]="navigation.pagerEnabled"
             [pageSize]="pageSize"
             [total]="view.total"
             [skip]="skip"
             [size]="size"
-            [options]="pageable"
-            class="k-pager"
+            [responsive]="normalizedPageableSettings.responsive && !pagerTemplate"
+            [buttonCount]="normalizedPageableSettings.buttonCount"
+            [info]="normalizedPageableSettings.info"
+            [pageSizeValues]="normalizedPageableSettings.pageSizes"
+            [previousNext]="normalizedPageableSettings.previousNext"
+            [type]="normalizedPageableSettings.type"
             (pageChange)="notifyPageChange('pager', $event)">
+            <ng-template kendoPagerTemplate>
+                <ng-container 
+                    [ngTemplateOutlet]="pagerTemplate ? pagerTemplate?.templateRef : defaultPager"
+                    [ngTemplateOutletContext]="bottomPager.templateContext"></ng-container>
+            </ng-template>
+            <kendo-pager-messages
+                [ariaLabel]="messageFor('pagerLabel')"
+                [firstPage]="messageFor('pagerFirstPage')"
+                [inputLabel]="messageFor('pagerInputLabel')"
+                [previousPage]="messageFor('pagerPreviousPage')"
+                [nextPage]="messageFor('pagerNextPage')"
+                [lastPage]="messageFor('pagerLastPage')"
+                [selectPage]="messageFor('pagerSelectPage')"
+                [page]="messageFor('pagerPage')"
+                [itemsPerPage]="messageFor('pagerItemsPerPage')"
+                [items]="messageFor('pagerItems')"
+                [of]="messageFor('pagerOf')"
+                [pageNumberInputTitle]="messageFor('pagerPageNumberInputTitle')">
+            </kendo-pager-messages>
         </kendo-pager>
         <kendo-grid-toolbar
             class="k-grid-toolbar-bottom"
@@ -27665,15 +26317,33 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
             {{hintText}}
         </ng-template>
 
+        <ng-template #defaultPager>
+            <div class="k-pager-numbers-wrap">
+                <kendo-pager-prev-buttons [size]="size" *ngIf="normalizedPageableSettings.previousNext"></kendo-pager-prev-buttons>
+                <kendo-pager-numeric-buttons
+                    [size]="size"
+                    *ngIf="normalizedPageableSettings.type === 'numeric' && normalizedPageableSettings.buttonCount > 0"
+                    [buttonCount]="normalizedPageableSettings.buttonCount">
+                </kendo-pager-numeric-buttons>
+                <kendo-pager-input [size]="size" *ngIf="normalizedPageableSettings.type === 'input'"></kendo-pager-input>
+                <kendo-pager-next-buttons [size]="size" *ngIf="normalizedPageableSettings.previousNext"></kendo-pager-next-buttons>
+            </div>
+            <kendo-pager-page-sizes *ngIf="normalizedPageableSettings.pageSizes"
+                [size]="size"
+                [pageSizes]="normalizedPageableSettings.pageSizes">
+            </kendo-pager-page-sizes>
+            <kendo-pager-info *ngIf="normalizedPageableSettings.info">
+            </kendo-pager-info>
+        </ng-template>
         <div kendoWatermarkOverlay *ngIf="showLicenseWatermark"></div>
     `,
                     standalone: true,
                     imports: [
-                        LocalizedMessagesDirective, NgIf, ToolbarComponent, PagerComponent, GroupPanelComponent,
+                        LocalizedMessagesDirective, NgIf, ToolbarComponent, GroupPanelComponent,
                         TableDirective, GridTableDirective, ColGroupComponent, HeaderComponent, ResizableContainerDirective,
                         ListComponent, DragTargetContainerDirective, DropTargetContainerDirective, DraggableDirective,
                         GridMarqueeDirective, FooterComponent, TableBodyComponent, LoadingComponent, StatusBarComponent,
-                        IconWrapperComponent, WatermarkOverlayComponent
+                        IconWrapperComponent, WatermarkOverlayComponent, ...KENDO_PAGER, NgTemplateOutlet
                     ]
                 }]
         }], ctorParameters: function () { return [{ type: BrowserSupportService }, { type: SelectionService }, { type: CellSelectionService }, { type: i0.ElementRef }, { type: GroupInfoService }, { type: GroupsService }, { type: ChangeNotificationService }, { type: DetailsService }, { type: EditService }, { type: FilterService }, { type: PDFService }, { type: ResponsiveService }, { type: i0.Renderer2 }, { type: ExcelService }, { type: i0.NgZone }, { type: ScrollSyncService }, { type: DomEventsService }, { type: ColumnResizingService }, { type: i0.ChangeDetectorRef }, { type: ColumnReorderService }, { type: ColumnInfoService }, { type: NavigationService }, { type: SortService }, { type: ScrollRequestService }, { type: i1$2.LocalizationService }, { type: ContextService }, { type: SizingOptionsService }, { type: RowReorderService }]; }, propDecorators: { data: [{
@@ -29126,12 +27796,12 @@ class GridSpacerComponent {
      */
     width;
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GridSpacerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GridSpacerComponent, isStandalone: true, selector: "kendo-grid-spacer, kendo-pager-spacer", inputs: { width: "width" }, host: { properties: { "class.k-spacer": "this.hostClass", "class.k-spacer-sized": "this.sizedClass", "style.flexBasis": "this.flexBasisStyle" } }, ngImport: i0, template: ``, isInline: true });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GridSpacerComponent, isStandalone: true, selector: "kendo-grid-spacer", inputs: { width: "width" }, host: { properties: { "class.k-spacer": "this.hostClass", "class.k-spacer-sized": "this.sizedClass", "style.flexBasis": "this.flexBasisStyle" } }, ngImport: i0, template: ``, isInline: true });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GridSpacerComponent, decorators: [{
             type: Component,
             args: [{
-                    selector: 'kendo-grid-spacer, kendo-pager-spacer',
+                    selector: 'kendo-grid-spacer',
                     template: ``,
                     standalone: true
                 }]
@@ -29425,7 +28095,7 @@ class PDFCommandToolbarDirective {
         e.preventDefault();
         this.pdfService.exportClick.emit();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PDFCommandToolbarDirective, deps: [{ token: PDFService }, { token: i2.ToolBarButtonComponent }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PDFCommandToolbarDirective, deps: [{ token: PDFService }, { token: i43.ToolBarButtonComponent }], target: i0.ɵɵFactoryTarget.Directive });
     static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: PDFCommandToolbarDirective, isStandalone: true, selector: "[kendoGridPDFTool]", ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PDFCommandToolbarDirective, decorators: [{
@@ -29434,7 +28104,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     selector: '[kendoGridPDFTool]',
                     standalone: true
                 }]
-        }], ctorParameters: function () { return [{ type: PDFService }, { type: i2.ToolBarButtonComponent }]; } });
+        }], ctorParameters: function () { return [{ type: PDFService }, { type: i43.ToolBarButtonComponent }]; } });
 
 /**
  * Represents the `export-to-Excel` toolbar tool of the Grid.
@@ -29480,7 +28150,7 @@ class ExcelCommandToolbarDirective {
         e.preventDefault();
         this.excelService.exportClick.emit();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ExcelCommandToolbarDirective, deps: [{ token: ExcelService }, { token: i2.ToolBarButtonComponent }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ExcelCommandToolbarDirective, deps: [{ token: ExcelService }, { token: i43.ToolBarButtonComponent }], target: i0.ɵɵFactoryTarget.Directive });
     static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: ExcelCommandToolbarDirective, isStandalone: true, selector: "[kendoGridExcelTool]", ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ExcelCommandToolbarDirective, decorators: [{
@@ -29489,7 +28159,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     selector: '[kendoGridExcelTool]',
                     standalone: true
                 }]
-        }], ctorParameters: function () { return [{ type: ExcelService }, { type: i2.ToolBarButtonComponent }]; } });
+        }], ctorParameters: function () { return [{ type: ExcelService }, { type: i43.ToolBarButtonComponent }]; } });
 
 /**
  * Represents the command for adding a new item to the Grid.
@@ -29533,7 +28203,7 @@ class AddCommandToolbarDirective {
         e.preventDefault();
         this.editService.beginAdd();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AddCommandToolbarDirective, deps: [{ token: EditService }, { token: i2.ToolBarButtonComponent }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AddCommandToolbarDirective, deps: [{ token: EditService }, { token: i43.ToolBarButtonComponent }], target: i0.ɵɵFactoryTarget.Directive });
     static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: AddCommandToolbarDirective, isStandalone: true, selector: "[kendoGridAddTool]", ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AddCommandToolbarDirective, decorators: [{
@@ -29542,7 +28212,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     selector: '[kendoGridAddTool]',
                     standalone: true
                 }]
-        }], ctorParameters: function () { return [{ type: EditService }, { type: i2.ToolBarButtonComponent }]; } });
+        }], ctorParameters: function () { return [{ type: EditService }, { type: i43.ToolBarButtonComponent }]; } });
 
 // DRAGGABLE COLUMN
 /**
@@ -29764,23 +28434,6 @@ const KENDO_GRID_BODY_EXPORTS = [
     LoadingTemplateDirective,
     RowReorderColumnComponent
 ];
-/**
- * @hidden
- *
- * Utility array that contains the Pager module exports
- */
-const KENDO_GRID_PAGER_EXPORTS = [
-    PagerComponent,
-    PagerPrevButtonsComponent,
-    PagerNextButtonsComponent,
-    PagerNumericButtonsComponent,
-    PagerInputComponent,
-    PagerInfoComponent,
-    PagerPageSizesComponent,
-    PagerTemplateDirective,
-    PagerDropDownListDirective,
-    PagerInputDirective
-];
 /**
  * @hidden
  *
@@ -29833,11 +28486,11 @@ const KENDO_GRID_EXPORTS = [
     ...KENDO_GRID_SHARED,
     ...KENDO_GRID_BODY_EXPORTS,
     ...KENDO_GRID_HEADER_EXPORTS,
-    ...KENDO_GRID_PAGER_EXPORTS,
     ...KENDO_GRID_FILTER_ROW_EXPORTS,
     ...KENDO_GRID_FILTER_OPERATORS,
     ...KENDO_GRID_FILTER_MENU_EXPORTS,
     ...KENDO_GRID_COLUMN_MENU_EXPORTS,
+    ...KENDO_PAGER,
     GridClipboardDirective
 ];
 /**
@@ -29895,7 +28548,7 @@ const KENDO_GRID = [
  */
 class GridModule {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GridModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: GridModule, imports: [GroupHeaderTemplateDirective, GroupHeaderColumnTemplateDirective, GroupFooterTemplateDirective, GroupHeaderComponent, GroupPanelComponent, ColumnComponent, ColumnGroupComponent, LogicalCellDirective, LogicalRowDirective, FocusableDirective, FooterTemplateDirective, ColGroupComponent, ResizableContainerDirective, i9.TemplateContextDirective, FieldAccessorPipe, DetailTemplateDirective, SpanColumnComponent, LoadingComponent, GridTableDirective, CommandColumnComponent, CheckboxColumnComponent, SelectionCheckboxDirective, CellTemplateDirective, EditTemplateDirective, TableBodyComponent, NoRecordsTemplateDirective, CellComponent, EditCommandDirective, CancelCommandDirective, SaveCommandDirective, RemoveCommandDirective, AddCommandDirective, AddCommandToolbarDirective, CellLoadingTemplateDirective, LoadingTemplateDirective, RowReorderColumnComponent, HeaderComponent, HeaderTemplateDirective, ColumnHandleDirective, SelectAllCheckboxDirective, FooterComponent, PagerComponent, PagerPrevButtonsComponent, PagerNextButtonsComponent, PagerNumericButtonsComponent, PagerInputComponent, PagerInfoComponent, PagerPageSizesComponent, PagerTemplateDirective, PagerDropDownListDirective, PagerInputDirective, FilterRowComponent, FilterCellComponent, FilterCellTemplateDirective, StringFilterCellComponent, NumericFilterCellComponent, AutoCompleteFilterCellComponent, BooleanFilterCellComponent, FilterCellHostDirective, FilterCellWrapperComponent, DateFilterCellComponent, ColumnComponent, ColumnGroupComponent, LogicalCellDirective, LogicalRowDirective, FocusableDirective, FooterTemplateDirective, ColGroupComponent, ResizableContainerDirective, i9.TemplateContextDirective, FieldAccessorPipe, DetailTemplateDirective, SpanColumnComponent, LoadingComponent, GridTableDirective, FilterCellOperatorsComponent, ContainsFilterOperatorComponent, DoesNotContainFilterOperatorComponent, EndsWithFilterOperatorComponent, EqualFilterOperatorComponent, IsEmptyFilterOperatorComponent, IsNotEmptyFilterOperatorComponent, IsNotNullFilterOperatorComponent, IsNullFilterOperatorComponent, NotEqualFilterOperatorComponent, StartsWithFilterOperatorComponent, GreaterFilterOperatorComponent, GreaterOrEqualToFilterOperatorComponent, LessFilterOperatorComponent, LessOrEqualToFilterOperatorComponent, AfterFilterOperatorComponent, AfterEqFilterOperatorComponent, BeforeEqFilterOperatorComponent, BeforeFilterOperatorComponent, FilterInputDirective, ColumnComponent, ColumnGroupComponent, LogicalCellDirective, LogicalRowDirective, FocusableDirective, FooterTemplateDirective, ColGroupComponent, ResizableContainerDirective, i9.TemplateContextDirective, FieldAccessorPipe, DetailTemplateDirective, SpanColumnComponent, LoadingComponent, GridTableDirective, FilterCellOperatorsComponent, ContainsFilterOperatorComponent, DoesNotContainFilterOperatorComponent, EndsWithFilterOperatorComponent, EqualFilterOperatorComponent, IsEmptyFilterOperatorComponent, IsNotEmptyFilterOperatorComponent, IsNotNullFilterOperatorComponent, IsNullFilterOperatorComponent, NotEqualFilterOperatorComponent, StartsWithFilterOperatorComponent, GreaterFilterOperatorComponent, GreaterOrEqualToFilterOperatorComponent, LessFilterOperatorComponent, LessOrEqualToFilterOperatorComponent, AfterFilterOperatorComponent, AfterEqFilterOperatorComponent, BeforeEqFilterOperatorComponent, BeforeFilterOperatorComponent, FilterInputDirective, FilterMenuComponent, FilterMenuContainerComponent, FilterMenuInputWrapperComponent, StringFilterMenuInputComponent, StringFilterMenuComponent, FilterMenuTemplateDirective, NumericFilterMenuComponent, NumericFilterMenuInputComponent, DateFilterMenuInputComponent, DateFilterMenuComponent, FilterMenuHostDirective, BooleanFilterMenuComponent, FilterMenuDropDownListDirective, BooleanFilterRadioButtonDirective, ColumnMenuChooserItemCheckedDirective, ColumnListComponent, ColumnChooserComponent, ColumnMenuChooserComponent, ColumnMenuFilterComponent, ColumnMenuItemComponent, ColumnMenuItemContentTemplateDirective, ColumnMenuSortComponent, ColumnMenuComponent, ColumnMenuLockComponent, ColumnMenuTemplateDirective, ColumnMenuContainerComponent, ColumnMenuItemDirective, ColumnMenuStickComponent, ColumnMenuPositionComponent, ColumnMenuAutoSizeColumnComponent, ColumnMenuAutoSizeAllColumnsComponent, GridComponent, ListComponent, ToolbarComponent, LocalizedMessagesDirective, CustomMessagesComponent, DataBindingDirective, ToolbarTemplateDirective, SelectionDirective, TemplateEditingDirective, ReactiveEditingDirective, InCellEditingDirective, ExpandDetailsDirective, ExpandGroupDirective, GroupBindingDirective, GridMarqueeDirective, GridSpacerComponent, GridToolbarFocusableDirective, StatusBarComponent, StatusBarTemplateDirective, GridClipboardDirective, TableDirective], exports: [GridComponent, ToolbarTemplateDirective, ToolbarComponent, GridSpacerComponent, StatusBarTemplateDirective, DataBindingDirective, SelectionDirective, CustomMessagesComponent, GroupBindingDirective, TemplateEditingDirective, ReactiveEditingDirective, InCellEditingDirective, ExpandDetailsDirective, ExpandGroupDirective, GridToolbarFocusableDirective, GroupHeaderTemplateDirective, GroupHeaderColumnTemplateDirective, GroupFooterTemplateDirective, GroupHeaderComponent, GroupPanelComponent, ColumnComponent, ColumnGroupComponent, LogicalCellDirective, LogicalRowDirective, FocusableDirective, FooterTemplateDirective, ColGroupComponent, ResizableContainerDirective, i9.TemplateContextDirective, FieldAccessorPipe, DetailTemplateDirective, SpanColumnComponent, LoadingComponent, GridTableDirective, CommandColumnComponent, CheckboxColumnComponent, SelectionCheckboxDirective, CellTemplateDirective, EditTemplateDirective, TableBodyComponent, NoRecordsTemplateDirective, CellComponent, EditCommandDirective, CancelCommandDirective, SaveCommandDirective, RemoveCommandDirective, AddCommandDirective, AddCommandToolbarDirective, CellLoadingTemplateDirective, LoadingTemplateDirective, RowReorderColumnComponent, HeaderComponent, HeaderTemplateDirective, ColumnHandleDirective, SelectAllCheckboxDirective, PagerComponent, PagerPrevButtonsComponent, PagerNextButtonsComponent, PagerNumericButtonsComponent, PagerInputComponent, PagerInfoComponent, PagerPageSizesComponent, PagerTemplateDirective, PagerDropDownListDirective, PagerInputDirective, FilterRowComponent, FilterCellComponent, FilterCellTemplateDirective, StringFilterCellComponent, NumericFilterCellComponent, AutoCompleteFilterCellComponent, BooleanFilterCellComponent, FilterCellHostDirective, FilterCellWrapperComponent, DateFilterCellComponent, FilterCellOperatorsComponent, ContainsFilterOperatorComponent, DoesNotContainFilterOperatorComponent, EndsWithFilterOperatorComponent, EqualFilterOperatorComponent, IsEmptyFilterOperatorComponent, IsNotEmptyFilterOperatorComponent, IsNotNullFilterOperatorComponent, IsNullFilterOperatorComponent, NotEqualFilterOperatorComponent, StartsWithFilterOperatorComponent, GreaterFilterOperatorComponent, GreaterOrEqualToFilterOperatorComponent, LessFilterOperatorComponent, LessOrEqualToFilterOperatorComponent, AfterFilterOperatorComponent, AfterEqFilterOperatorComponent, BeforeEqFilterOperatorComponent, BeforeFilterOperatorComponent, FilterMenuComponent, FilterMenuContainerComponent, FilterMenuInputWrapperComponent, StringFilterMenuInputComponent, StringFilterMenuComponent, FilterMenuTemplateDirective, NumericFilterMenuComponent, NumericFilterMenuInputComponent, DateFilterMenuInputComponent, DateFilterMenuComponent, FilterMenuHostDirective, BooleanFilterMenuComponent, FilterMenuDropDownListDirective, BooleanFilterRadioButtonDirective, ColumnChooserComponent, ColumnMenuFilterComponent, ColumnMenuItemComponent, ColumnMenuItemContentTemplateDirective, ColumnMenuSortComponent, ColumnMenuLockComponent, ColumnMenuStickComponent, ColumnMenuPositionComponent, ColumnMenuChooserComponent, ColumnMenuTemplateDirective, ColumnMenuContainerComponent, ColumnMenuItemDirective, ColumnMenuComponent, ColumnMenuAutoSizeColumnComponent, ColumnMenuAutoSizeAllColumnsComponent, GridClipboardDirective, ToolBarModule] });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: GridModule, imports: [GroupHeaderTemplateDirective, GroupHeaderColumnTemplateDirective, GroupFooterTemplateDirective, GroupHeaderComponent, GroupPanelComponent, ColumnComponent, ColumnGroupComponent, LogicalCellDirective, LogicalRowDirective, FocusableDirective, FooterTemplateDirective, ColGroupComponent, ResizableContainerDirective, i9.TemplateContextDirective, FieldAccessorPipe, DetailTemplateDirective, SpanColumnComponent, LoadingComponent, GridTableDirective, CommandColumnComponent, CheckboxColumnComponent, SelectionCheckboxDirective, CellTemplateDirective, EditTemplateDirective, TableBodyComponent, NoRecordsTemplateDirective, CellComponent, EditCommandDirective, CancelCommandDirective, SaveCommandDirective, RemoveCommandDirective, AddCommandDirective, AddCommandToolbarDirective, CellLoadingTemplateDirective, LoadingTemplateDirective, RowReorderColumnComponent, HeaderComponent, HeaderTemplateDirective, ColumnHandleDirective, SelectAllCheckboxDirective, FooterComponent, i42.CustomMessagesComponent, i42.PagerFocusableDirective, i42.PagerInfoComponent, i42.PagerInputComponent, i42.PagerNextButtonsComponent, i42.PagerNumericButtonsComponent, i42.PagerPageSizesComponent, i42.PagerPrevButtonsComponent, i42.PagerTemplateDirective, i42.PagerComponent, i42.PagerSpacerComponent, i43.ToolBarComponent, i43.ToolbarCustomMessagesComponent, i43.ToolBarButtonComponent, i43.ToolBarButtonGroupComponent, i43.ToolBarDropDownButtonComponent, i43.ToolBarSeparatorComponent, i43.ToolBarSpacerComponent, i43.ToolBarSplitButtonComponent, i43.ToolBarToolComponent, FilterRowComponent, FilterCellComponent, FilterCellTemplateDirective, StringFilterCellComponent, NumericFilterCellComponent, AutoCompleteFilterCellComponent, BooleanFilterCellComponent, FilterCellHostDirective, FilterCellWrapperComponent, DateFilterCellComponent, ColumnComponent, ColumnGroupComponent, LogicalCellDirective, LogicalRowDirective, FocusableDirective, FooterTemplateDirective, ColGroupComponent, ResizableContainerDirective, i9.TemplateContextDirective, FieldAccessorPipe, DetailTemplateDirective, SpanColumnComponent, LoadingComponent, GridTableDirective, FilterCellOperatorsComponent, ContainsFilterOperatorComponent, DoesNotContainFilterOperatorComponent, EndsWithFilterOperatorComponent, EqualFilterOperatorComponent, IsEmptyFilterOperatorComponent, IsNotEmptyFilterOperatorComponent, IsNotNullFilterOperatorComponent, IsNullFilterOperatorComponent, NotEqualFilterOperatorComponent, StartsWithFilterOperatorComponent, GreaterFilterOperatorComponent, GreaterOrEqualToFilterOperatorComponent, LessFilterOperatorComponent, LessOrEqualToFilterOperatorComponent, AfterFilterOperatorComponent, AfterEqFilterOperatorComponent, BeforeEqFilterOperatorComponent, BeforeFilterOperatorComponent, FilterInputDirective, ColumnComponent, ColumnGroupComponent, LogicalCellDirective, LogicalRowDirective, FocusableDirective, FooterTemplateDirective, ColGroupComponent, ResizableContainerDirective, i9.TemplateContextDirective, FieldAccessorPipe, DetailTemplateDirective, SpanColumnComponent, LoadingComponent, GridTableDirective, FilterCellOperatorsComponent, ContainsFilterOperatorComponent, DoesNotContainFilterOperatorComponent, EndsWithFilterOperatorComponent, EqualFilterOperatorComponent, IsEmptyFilterOperatorComponent, IsNotEmptyFilterOperatorComponent, IsNotNullFilterOperatorComponent, IsNullFilterOperatorComponent, NotEqualFilterOperatorComponent, StartsWithFilterOperatorComponent, GreaterFilterOperatorComponent, GreaterOrEqualToFilterOperatorComponent, LessFilterOperatorComponent, LessOrEqualToFilterOperatorComponent, AfterFilterOperatorComponent, AfterEqFilterOperatorComponent, BeforeEqFilterOperatorComponent, BeforeFilterOperatorComponent, FilterInputDirective, FilterMenuComponent, FilterMenuContainerComponent, FilterMenuInputWrapperComponent, StringFilterMenuInputComponent, StringFilterMenuComponent, FilterMenuTemplateDirective, NumericFilterMenuComponent, NumericFilterMenuInputComponent, DateFilterMenuInputComponent, DateFilterMenuComponent, FilterMenuHostDirective, BooleanFilterMenuComponent, FilterMenuDropDownListDirective, BooleanFilterRadioButtonDirective, ColumnMenuChooserItemCheckedDirective, ColumnListComponent, ColumnChooserComponent, ColumnMenuChooserComponent, ColumnMenuFilterComponent, ColumnMenuItemComponent, ColumnMenuItemContentTemplateDirective, ColumnMenuSortComponent, ColumnMenuComponent, ColumnMenuLockComponent, ColumnMenuTemplateDirective, ColumnMenuContainerComponent, ColumnMenuItemDirective, ColumnMenuStickComponent, ColumnMenuPositionComponent, ColumnMenuAutoSizeColumnComponent, ColumnMenuAutoSizeAllColumnsComponent, GridComponent, ListComponent, ToolbarComponent, LocalizedMessagesDirective, CustomMessagesComponent, DataBindingDirective, ToolbarTemplateDirective, SelectionDirective, TemplateEditingDirective, ReactiveEditingDirective, InCellEditingDirective, ExpandDetailsDirective, ExpandGroupDirective, GroupBindingDirective, GridMarqueeDirective, GridSpacerComponent, GridToolbarFocusableDirective, StatusBarComponent, StatusBarTemplateDirective, GridClipboardDirective, TableDirective], exports: [GridComponent, ToolbarTemplateDirective, ToolbarComponent, GridSpacerComponent, StatusBarTemplateDirective, DataBindingDirective, SelectionDirective, CustomMessagesComponent, GroupBindingDirective, TemplateEditingDirective, ReactiveEditingDirective, InCellEditingDirective, ExpandDetailsDirective, ExpandGroupDirective, GridToolbarFocusableDirective, GroupHeaderTemplateDirective, GroupHeaderColumnTemplateDirective, GroupFooterTemplateDirective, GroupHeaderComponent, GroupPanelComponent, ColumnComponent, ColumnGroupComponent, LogicalCellDirective, LogicalRowDirective, FocusableDirective, FooterTemplateDirective, ColGroupComponent, ResizableContainerDirective, i9.TemplateContextDirective, FieldAccessorPipe, DetailTemplateDirective, SpanColumnComponent, LoadingComponent, GridTableDirective, CommandColumnComponent, CheckboxColumnComponent, SelectionCheckboxDirective, CellTemplateDirective, EditTemplateDirective, TableBodyComponent, NoRecordsTemplateDirective, CellComponent, EditCommandDirective, CancelCommandDirective, SaveCommandDirective, RemoveCommandDirective, AddCommandDirective, AddCommandToolbarDirective, CellLoadingTemplateDirective, LoadingTemplateDirective, RowReorderColumnComponent, HeaderComponent, HeaderTemplateDirective, ColumnHandleDirective, SelectAllCheckboxDirective, FilterRowComponent, FilterCellComponent, FilterCellTemplateDirective, StringFilterCellComponent, NumericFilterCellComponent, AutoCompleteFilterCellComponent, BooleanFilterCellComponent, FilterCellHostDirective, FilterCellWrapperComponent, DateFilterCellComponent, FilterCellOperatorsComponent, ContainsFilterOperatorComponent, DoesNotContainFilterOperatorComponent, EndsWithFilterOperatorComponent, EqualFilterOperatorComponent, IsEmptyFilterOperatorComponent, IsNotEmptyFilterOperatorComponent, IsNotNullFilterOperatorComponent, IsNullFilterOperatorComponent, NotEqualFilterOperatorComponent, StartsWithFilterOperatorComponent, GreaterFilterOperatorComponent, GreaterOrEqualToFilterOperatorComponent, LessFilterOperatorComponent, LessOrEqualToFilterOperatorComponent, AfterFilterOperatorComponent, AfterEqFilterOperatorComponent, BeforeEqFilterOperatorComponent, BeforeFilterOperatorComponent, FilterMenuComponent, FilterMenuContainerComponent, FilterMenuInputWrapperComponent, StringFilterMenuInputComponent, StringFilterMenuComponent, FilterMenuTemplateDirective, NumericFilterMenuComponent, NumericFilterMenuInputComponent, DateFilterMenuInputComponent, DateFilterMenuComponent, FilterMenuHostDirective, BooleanFilterMenuComponent, FilterMenuDropDownListDirective, BooleanFilterRadioButtonDirective, ColumnChooserComponent, ColumnMenuFilterComponent, ColumnMenuItemComponent, ColumnMenuItemContentTemplateDirective, ColumnMenuSortComponent, ColumnMenuLockComponent, ColumnMenuStickComponent, ColumnMenuPositionComponent, ColumnMenuChooserComponent, ColumnMenuTemplateDirective, ColumnMenuContainerComponent, ColumnMenuItemDirective, ColumnMenuComponent, ColumnMenuAutoSizeColumnComponent, ColumnMenuAutoSizeAllColumnsComponent, i42.CustomMessagesComponent, i42.PagerFocusableDirective, i42.PagerInfoComponent, i42.PagerInputComponent, i42.PagerNextButtonsComponent, i42.PagerNumericButtonsComponent, i42.PagerPageSizesComponent, i42.PagerPrevButtonsComponent, i42.PagerTemplateDirective, i42.PagerComponent, i42.PagerSpacerComponent, GridClipboardDirective, i43.ToolBarComponent, i43.ToolbarCustomMessagesComponent, i43.ToolBarButtonComponent, i43.ToolBarButtonGroupComponent, i43.ToolBarDropDownButtonComponent, i43.ToolBarSeparatorComponent, i43.ToolBarSpacerComponent, i43.ToolBarSplitButtonComponent, i43.ToolBarToolComponent] });
     static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GridModule, providers: [
             PopupService,
             ResizeBatchService,
@@ -29910,19 +28563,20 @@ class GridModule {
             MonthViewService,
             YearViewService,
             NavigationService$1
-        ], imports: [GroupHeaderComponent, GroupPanelComponent, TableBodyComponent, CellComponent, EditCommandDirective, CancelCommandDirective, SaveCommandDirective, RemoveCommandDirective, AddCommandDirective, HeaderComponent, PagerComponent, PagerPrevButtonsComponent, PagerNextButtonsComponent, PagerNumericButtonsComponent, PagerInputComponent, PagerPageSizesComponent, StringFilterCellComponent, NumericFilterCellComponent, AutoCompleteFilterCellComponent, BooleanFilterCellComponent, FilterCellWrapperComponent, DateFilterCellComponent, FilterCellOperatorsComponent, FilterCellOperatorsComponent, FilterMenuComponent, FilterMenuContainerComponent, FilterMenuInputWrapperComponent, StringFilterMenuInputComponent, StringFilterMenuComponent, NumericFilterMenuComponent, NumericFilterMenuInputComponent, DateFilterMenuInputComponent, DateFilterMenuComponent, ColumnChooserComponent, ColumnMenuChooserComponent, ColumnMenuFilterComponent, ColumnMenuItemComponent, ColumnMenuSortComponent, ColumnMenuComponent, ColumnMenuLockComponent, ColumnMenuStickComponent, ColumnMenuPositionComponent, ColumnMenuAutoSizeColumnComponent, ColumnMenuAutoSizeAllColumnsComponent, GridComponent, ListComponent, ToolBarModule] });
+        ], imports: [GroupHeaderComponent, GroupPanelComponent, TableBodyComponent, CellComponent, EditCommandDirective, CancelCommandDirective, SaveCommandDirective, RemoveCommandDirective, AddCommandDirective, HeaderComponent, i42.CustomMessagesComponent, i42.PagerInfoComponent, i42.PagerInputComponent, i42.PagerNextButtonsComponent, i42.PagerNumericButtonsComponent, i42.PagerPageSizesComponent, i42.PagerPrevButtonsComponent, i42.PagerComponent, i42.PagerSpacerComponent, i43.ToolBarComponent, i43.ToolbarCustomMessagesComponent, i43.ToolBarButtonComponent, i43.ToolBarButtonGroupComponent, i43.ToolBarDropDownButtonComponent, i43.ToolBarSeparatorComponent, i43.ToolBarSpacerComponent, i43.ToolBarSplitButtonComponent, StringFilterCellComponent, NumericFilterCellComponent, AutoCompleteFilterCellComponent, BooleanFilterCellComponent, FilterCellWrapperComponent, DateFilterCellComponent, FilterCellOperatorsComponent, FilterCellOperatorsComponent, FilterMenuComponent, FilterMenuContainerComponent, FilterMenuInputWrapperComponent, StringFilterMenuInputComponent, StringFilterMenuComponent, NumericFilterMenuComponent, NumericFilterMenuInputComponent, DateFilterMenuInputComponent, DateFilterMenuComponent, ColumnChooserComponent, ColumnMenuChooserComponent, ColumnMenuFilterComponent, ColumnMenuItemComponent, ColumnMenuSortComponent, ColumnMenuComponent, ColumnMenuLockComponent, ColumnMenuStickComponent, ColumnMenuPositionComponent, ColumnMenuAutoSizeColumnComponent, ColumnMenuAutoSizeAllColumnsComponent, GridComponent, ListComponent] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GridModule, decorators: [{
             type: NgModule,
             args: [{
-                    exports: [...KENDO_GRID_EXPORTS, ToolBarModule],
+                    exports: [...KENDO_GRID_EXPORTS, ...KENDO_TOOLBAR],
                     imports: [
                         ...KENDO_GRID_GROUP_EXPORTS,
                         ...KENDO_GRID_SHARED,
                         ...KENDO_GRID_BODY_EXPORTS,
                         ...KENDO_GRID_HEADER_EXPORTS,
                         ...KENDO_GRID_FOOTER_EXPORTS,
-                        ...KENDO_GRID_PAGER_EXPORTS,
+                        ...KENDO_PAGER,
+                        ...KENDO_TOOLBAR,
                         ...KENDO_GRID_FILTER_ROW,
                         ...KENDO_GRID_FILTER_MENU,
                         ...KENDO_GRID_COLUMN_MENU_DECLARATIONS,
@@ -30209,23 +28863,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                 }]
         }] });
 
-/**
- * @hidden
- */
-class PagerModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PagerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: PagerModule, imports: [ColumnComponent, ColumnGroupComponent, LogicalCellDirective, LogicalRowDirective, FocusableDirective, FooterTemplateDirective, ColGroupComponent, ResizableContainerDirective, i9.TemplateContextDirective, FieldAccessorPipe, DetailTemplateDirective, SpanColumnComponent, LoadingComponent, GridTableDirective, PagerComponent, PagerPrevButtonsComponent, PagerNextButtonsComponent, PagerNumericButtonsComponent, PagerInputComponent, PagerInfoComponent, PagerPageSizesComponent, PagerTemplateDirective, PagerDropDownListDirective, PagerInputDirective], exports: [PagerComponent, PagerPrevButtonsComponent, PagerNextButtonsComponent, PagerNumericButtonsComponent, PagerInputComponent, PagerInfoComponent, PagerPageSizesComponent, PagerTemplateDirective, PagerDropDownListDirective, PagerInputDirective] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PagerModule, providers: [IconsService, PopupService, ResizeBatchService, DialogContainerService, DialogService, WindowService, WindowContainerService], imports: [PagerComponent, PagerPrevButtonsComponent, PagerNextButtonsComponent, PagerNumericButtonsComponent, PagerInputComponent, PagerPageSizesComponent] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PagerModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    exports: [...KENDO_GRID_PAGER_EXPORTS],
-                    imports: [...KENDO_GRID_SHARED, ...KENDO_GRID_PAGER_EXPORTS],
-                    providers: [IconsService, PopupService, ResizeBatchService, DialogContainerService, DialogService, WindowService, WindowContainerService]
-                }]
-        }] });
-
 // IMPORTANT: NgModule export kept for backwards compatibility
 /**
  * Represents the [NgModule](link:site.data.urls.angular['ngmoduleapi'])
@@ -30350,5 +28987,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { AddCommandDirective, AddCommandToolbarDirective, AfterEqFilterOperatorComponent, AfterFilterOperatorComponent, AutoCompleteFilterCellComponent, BaseFilterCellComponent, BeforeEqFilterOperatorComponent, BeforeFilterOperatorComponent, BodyModule, BooleanFilterCellComponent, BooleanFilterComponent, BooleanFilterMenuComponent, BooleanFilterRadioButtonDirective, BrowserSupportService, CELL_CONTEXT, CancelCommandDirective, CellCloseEvent, CellComponent, CellLoadingTemplateDirective, CellSelectionAggregateService, CellSelectionService, CellTemplateDirective, ChangeNotificationService, CheckboxColumnComponent, ColGroupComponent, ColumnBase, ColumnChooserComponent, ColumnComponent, ColumnGroupComponent, ColumnHandleDirective, ColumnInfoService, ColumnListComponent, ColumnLockedChangeEvent, ColumnMenuAutoSizeAllColumnsComponent, ColumnMenuAutoSizeColumnComponent, ColumnMenuChooserComponent, ColumnMenuComponent, ColumnMenuContainerComponent, ColumnMenuFilterComponent, ColumnMenuItemComponent, ColumnMenuItemContentTemplateDirective, ColumnMenuItemDirective, ColumnMenuLockComponent, ColumnMenuPositionComponent, ColumnMenuService, ColumnMenuSortComponent, ColumnMenuStickComponent, ColumnMenuTemplateDirective, ColumnReorderEvent, ColumnReorderService, ColumnResizingService, ColumnStickyChangeEvent, ColumnVisibilityChangeEvent, ColumnsContainer, CommandColumnComponent, ContainsFilterOperatorComponent, ContextService, CustomMessagesComponent, DEFAULT_SCROLLER_FACTORY, DataBindingDirective, DateFilterCellComponent, DateFilterComponent, DateFilterMenuComponent, DateFilterMenuInputComponent, DetailCollapseEvent, DetailExpandEvent, DetailTemplateDirective, DetailsService, DoesNotContainFilterOperatorComponent, DomEventsService, DragAndDropService, DragHintService, DropCueService, EditCommandDirective, EditService, EditTemplateDirective, EditingDirectiveBase, EndsWithFilterOperatorComponent, EqualFilterOperatorComponent, ExcelCommandDirective, ExcelCommandToolbarDirective, ExcelComponent, ExcelExportEvent, ExcelModule, ExcelService, ExpandDetailsDirective, ExpandGroupDirective, FieldAccessorPipe, FilterCellComponent, FilterCellHostDirective, FilterCellOperatorsComponent, FilterCellTemplateDirective, FilterCellWrapperComponent, FilterInputDirective, FilterMenuComponent, FilterMenuContainerComponent, FilterMenuDropDownListDirective, FilterMenuHostDirective, FilterMenuInputWrapperComponent, FilterMenuModule, FilterMenuTemplateDirective, FilterRowComponent, FilterService, FocusRoot, FocusableDirective, FooterComponent, FooterModule, FooterTemplateDirective, GreaterFilterOperatorComponent, GreaterOrEqualToFilterOperatorComponent, GridClipboardDirective, GridComponent, GridModule, GridSpacerComponent, GridTableDirective, GridToolbarFocusableDirective, GridToolbarNavigationService, GroupBindingDirective, GroupFooterTemplateDirective, GroupHeaderColumnTemplateDirective, GroupHeaderComponent, GroupHeaderTemplateDirective, GroupInfoService, GroupModule, GroupPanelComponent, GroupsService, HeaderComponent, HeaderModule, HeaderTemplateDirective, IdService, InCellEditingDirective, IsEmptyFilterOperatorComponent, IsNotEmptyFilterOperatorComponent, IsNotNullFilterOperatorComponent, IsNullFilterOperatorComponent, KENDO_GRID, KENDO_GRID_BODY_EXPORTS, KENDO_GRID_COLUMN_DRAGANDDROP, KENDO_GRID_COLUMN_MENU_DECLARATIONS, KENDO_GRID_COLUMN_MENU_EXPORTS, KENDO_GRID_DECLARATIONS, KENDO_GRID_EXCEL_EXPORT, KENDO_GRID_EXPORTS, KENDO_GRID_FILTER_MENU, KENDO_GRID_FILTER_MENU_EXPORTS, KENDO_GRID_FILTER_OPERATORS, KENDO_GRID_FILTER_ROW, KENDO_GRID_FILTER_ROW_EXPORTS, KENDO_GRID_FILTER_SHARED, KENDO_GRID_FOOTER_EXPORTS, KENDO_GRID_GROUP_EXPORTS, KENDO_GRID_HEADER_EXPORTS, KENDO_GRID_PAGER_EXPORTS, KENDO_GRID_PDF_EXPORT, KENDO_GRID_SHARED, LessFilterOperatorComponent, LessOrEqualToFilterOperatorComponent, ListComponent, LoadingComponent, LoadingTemplateDirective, LocalDataChangesService, LogicalCellDirective, LogicalRowDirective, MenuTabbingService, NavigationService, NoRecordsTemplateDirective, NotEqualFilterOperatorComponent, NumericFilterCellComponent, NumericFilterComponent, NumericFilterMenuComponent, NumericFilterMenuInputComponent, PDFCommandDirective, PDFCommandToolbarDirective, PDFComponent, PDFMarginComponent, PDFModule, PDFService, PDFTemplateDirective, PagerComponent, PagerContextService, PagerDropDownListDirective, PagerElementComponent, PagerInfoComponent, PagerInputComponent, PagerInputDirective, PagerModule, PagerNextButtonsComponent, PagerNumericButtonsComponent, PagerPageSizesComponent, PagerPrevButtonsComponent, PagerTemplateDirective, PopupCloseEvent, ReactiveEditingDirective, RemoveCommandDirective, ResizableContainerDirective, ResizeService, ResponsiveService, RowEditingDirectiveBase, RowFilterModule, RowReorderColumnComponent, RowReorderService, SaveCommandDirective, ScrollRequestService, ScrollSyncService, SelectAllCheckboxDirective, SelectionCheckboxDirective, SelectionDirective, SelectionService, SharedFilterModule, SharedModule, SinglePopupService, SizingOptionsService, Skip, SortService, SpanColumnComponent, StartsWithFilterOperatorComponent, StatusBarTemplateDirective, StringFilterCellComponent, StringFilterComponent, StringFilterMenuComponent, StringFilterMenuInputComponent, SuspendService, TableBodyComponent, TableDirective, TemplateEditingDirective, ToolbarComponent, ToolbarTemplateDirective, count, defaultTrackBy, hasFilterMenu, hasFilterRow, isFilterable, slice };
+export { AddCommandDirective, AddCommandToolbarDirective, AfterEqFilterOperatorComponent, AfterFilterOperatorComponent, AutoCompleteFilterCellComponent, BaseFilterCellComponent, BeforeEqFilterOperatorComponent, BeforeFilterOperatorComponent, BodyModule, BooleanFilterCellComponent, BooleanFilterComponent, BooleanFilterMenuComponent, BooleanFilterRadioButtonDirective, BrowserSupportService, CELL_CONTEXT, CancelCommandDirective, CellCloseEvent, CellComponent, CellLoadingTemplateDirective, CellSelectionAggregateService, CellSelectionService, CellTemplateDirective, ChangeNotificationService, CheckboxColumnComponent, ColGroupComponent, ColumnBase, ColumnChooserComponent, ColumnComponent, ColumnGroupComponent, ColumnHandleDirective, ColumnInfoService, ColumnListComponent, ColumnLockedChangeEvent, ColumnMenuAutoSizeAllColumnsComponent, ColumnMenuAutoSizeColumnComponent, ColumnMenuChooserComponent, ColumnMenuComponent, ColumnMenuContainerComponent, ColumnMenuFilterComponent, ColumnMenuItemComponent, ColumnMenuItemContentTemplateDirective, ColumnMenuItemDirective, ColumnMenuLockComponent, ColumnMenuPositionComponent, ColumnMenuService, ColumnMenuSortComponent, ColumnMenuStickComponent, ColumnMenuTemplateDirective, ColumnReorderEvent, ColumnReorderService, ColumnResizingService, ColumnStickyChangeEvent, ColumnVisibilityChangeEvent, ColumnsContainer, CommandColumnComponent, ContainsFilterOperatorComponent, ContextService, CustomMessagesComponent, DEFAULT_SCROLLER_FACTORY, DataBindingDirective, DateFilterCellComponent, DateFilterComponent, DateFilterMenuComponent, DateFilterMenuInputComponent, DetailCollapseEvent, DetailExpandEvent, DetailTemplateDirective, DetailsService, DoesNotContainFilterOperatorComponent, DomEventsService, DragAndDropService, DragHintService, DropCueService, EditCommandDirective, EditService, EditTemplateDirective, EditingDirectiveBase, EndsWithFilterOperatorComponent, EqualFilterOperatorComponent, ExcelCommandDirective, ExcelCommandToolbarDirective, ExcelComponent, ExcelExportEvent, ExcelModule, ExcelService, ExpandDetailsDirective, ExpandGroupDirective, FieldAccessorPipe, FilterCellComponent, FilterCellHostDirective, FilterCellOperatorsComponent, FilterCellTemplateDirective, FilterCellWrapperComponent, FilterInputDirective, FilterMenuComponent, FilterMenuContainerComponent, FilterMenuDropDownListDirective, FilterMenuHostDirective, FilterMenuInputWrapperComponent, FilterMenuModule, FilterMenuTemplateDirective, FilterRowComponent, FilterService, FocusRoot, FocusableDirective, FooterComponent, FooterModule, FooterTemplateDirective, GreaterFilterOperatorComponent, GreaterOrEqualToFilterOperatorComponent, GridClipboardDirective, GridComponent, GridModule, GridSpacerComponent, GridTableDirective, GridToolbarFocusableDirective, GridToolbarNavigationService, GroupBindingDirective, GroupFooterTemplateDirective, GroupHeaderColumnTemplateDirective, GroupHeaderComponent, GroupHeaderTemplateDirective, GroupInfoService, GroupModule, GroupPanelComponent, GroupsService, HeaderComponent, HeaderModule, HeaderTemplateDirective, IdService, InCellEditingDirective, IsEmptyFilterOperatorComponent, IsNotEmptyFilterOperatorComponent, IsNotNullFilterOperatorComponent, IsNullFilterOperatorComponent, KENDO_GRID, KENDO_GRID_BODY_EXPORTS, KENDO_GRID_COLUMN_DRAGANDDROP, KENDO_GRID_COLUMN_MENU_DECLARATIONS, KENDO_GRID_COLUMN_MENU_EXPORTS, KENDO_GRID_DECLARATIONS, KENDO_GRID_EXCEL_EXPORT, KENDO_GRID_EXPORTS, KENDO_GRID_FILTER_MENU, KENDO_GRID_FILTER_MENU_EXPORTS, KENDO_GRID_FILTER_OPERATORS, KENDO_GRID_FILTER_ROW, KENDO_GRID_FILTER_ROW_EXPORTS, KENDO_GRID_FILTER_SHARED, KENDO_GRID_FOOTER_EXPORTS, KENDO_GRID_GROUP_EXPORTS, KENDO_GRID_HEADER_EXPORTS, KENDO_GRID_PDF_EXPORT, KENDO_GRID_SHARED, LessFilterOperatorComponent, LessOrEqualToFilterOperatorComponent, ListComponent, LoadingComponent, LoadingTemplateDirective, LocalDataChangesService, LogicalCellDirective, LogicalRowDirective, MenuTabbingService, NavigationService, NoRecordsTemplateDirective, NotEqualFilterOperatorComponent, NumericFilterCellComponent, NumericFilterComponent, NumericFilterMenuComponent, NumericFilterMenuInputComponent, PDFCommandDirective, PDFCommandToolbarDirective, PDFComponent, PDFMarginComponent, PDFModule, PDFService, PDFTemplateDirective, PopupCloseEvent, ReactiveEditingDirective, RemoveCommandDirective, ResizableContainerDirective, ResizeService, ResponsiveService, RowEditingDirectiveBase, RowFilterModule, RowReorderColumnComponent, RowReorderService, SaveCommandDirective, ScrollRequestService, ScrollSyncService, SelectAllCheckboxDirective, SelectionCheckboxDirective, SelectionDirective, SelectionService, SharedFilterModule, SharedModule, SinglePopupService, SizingOptionsService, Skip, SortService, SpanColumnComponent, StartsWithFilterOperatorComponent, StatusBarTemplateDirective, StringFilterCellComponent, StringFilterComponent, StringFilterMenuComponent, StringFilterMenuInputComponent, SuspendService, TableBodyComponent, TableDirective, TemplateEditingDirective, ToolbarComponent, ToolbarTemplateDirective, count, defaultTrackBy, hasFilterMenu, hasFilterRow, isFilterable, slice };