@progress/kendo-angular-pager 17.0.0-develop.9 → 17.0.0

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

@@ -1,1991 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2024 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-import * as i0 from '@angular/core';
-import { Directive, Input, forwardRef, Component, ChangeDetectionStrategy, ViewChild, HostBinding, Optional, ElementRef, EventEmitter, ContentChildren, Output, HostListener, NgModule } from '@angular/core';
-import * as i1 from '@progress/kendo-angular-l10n';
-import { ComponentMessages, LocalizationService, L10N_PREFIX } from '@progress/kendo-angular-l10n';
-import { caretAltLeftIcon, caretAltToLeftIcon, caretAltRightIcon, caretAltToRightIcon } from '@progress/kendo-svg-icons';
-import { Subject, Subscription } from 'rxjs';
-import { ButtonComponent } from '@progress/kendo-angular-buttons';
-import { DropDownListComponent } from '@progress/kendo-angular-dropdowns';
-import { Keys, EventsOutsideAngularDirective, anyChanged, ResizeSensorComponent, ResizeBatchService } from '@progress/kendo-angular-common';
-import { NgIf, NgFor, NgClass, NgTemplateOutlet } from '@angular/common';
-import { NumericTextBoxComponent } from '@progress/kendo-angular-inputs';
-import { validatePackage } from '@progress/kendo-licensing';
-import { IconsService } from '@progress/kendo-angular-icons';
-import { PopupService } from '@progress/kendo-angular-popup';
-
-/**
- * @hidden
- */
-class PreventableEvent {
-    constructor() {
-        this.prevented = false;
-    }
-    /**
-     * Prevents the default action for a specified event.
-     * In this way, the source component suppresses the built-in behavior that follows the event.
-     */
-    preventDefault() {
-        this.prevented = true;
-    }
-    /**
-     * If the event is prevented by any of its subscribers, returns `true`.
-     *
-     * @returns `true` if the default action was prevented. Otherwise, returns `false`.
-     */
-    isDefaultPrevented() {
-        return this.prevented;
-    }
-}
-
-/**
- * Arguments for the `pageSizeChange` event. The `pageSizeChange` event fires when the page size
- * is changed from the UI. If you cancel the event, the change is prevented.
- */
-class PageSizeChangeEvent extends PreventableEvent {
-    /**
-     * Constructs the event arguments for the `pageSizeChange` event.
-     * @param newPageSize - The newly selected page size.
-     * @hidden
-     */
-    constructor(newPageSize) {
-        super();
-        this.newPageSize = newPageSize;
-    }
-}
-
-/**
- * @hidden
- */
-class Messages extends ComponentMessages {
-}
-Messages.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: Messages, deps: null, target: i0.ɵɵFactoryTarget.Directive });
-Messages.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: Messages, selector: "kendoPagerMessages", inputs: { firstPage: "firstPage", lastPage: "lastPage", previousPage: "previousPage", nextPage: "nextPage", page: "page", pageNumberInputTitle: "pageNumberInputTitle", itemsPerPage: "itemsPerPage", of: "of", items: "items", selectPage: "selectPage", inputLabel: "inputLabel" }, usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: Messages, decorators: [{
-            type: Directive,
-            args: [{
-                    // eslint-disable-next-line @angular-eslint/directive-selector
-                    selector: 'kendoPagerMessages'
-                }]
-        }], propDecorators: { firstPage: [{
-                type: Input
-            }], lastPage: [{
-                type: Input
-            }], previousPage: [{
-                type: Input
-            }], nextPage: [{
-                type: Input
-            }], page: [{
-                type: Input
-            }], pageNumberInputTitle: [{
-                type: Input
-            }], itemsPerPage: [{
-                type: Input
-            }], of: [{
-                type: Input
-            }], items: [{
-                type: Input
-            }], selectPage: [{
-                type: Input
-            }], inputLabel: [{
-                type: Input
-            }] } });
-
-/**
- * Custom component messages override default component messages
- * ([see example]({% slug pager_globalization %}#toc-messages)).
- */
-class CustomMessagesComponent extends Messages {
-    constructor(service) {
-        super();
-        this.service = service;
-    }
-    get override() {
-        return true;
-    }
-}
-CustomMessagesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CustomMessagesComponent, deps: [{ token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
-CustomMessagesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CustomMessagesComponent, isStandalone: true, selector: "kendo-datapager-messages", providers: [
-        {
-            provide: Messages,
-            useExisting: forwardRef(() => CustomMessagesComponent)
-        }
-    ], usesInheritance: true, ngImport: i0, template: ``, isInline: true });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CustomMessagesComponent, decorators: [{
-            type: Component,
-            args: [{
-                    providers: [
-                        {
-                            provide: Messages,
-                            useExisting: forwardRef(() => CustomMessagesComponent)
-                        }
-                    ],
-                    selector: 'kendo-datapager-messages',
-                    template: ``,
-                    standalone: true
-                }]
-        }], ctorParameters: function () { return [{ type: i1.LocalizationService }]; } });
-
-/**
- * @hidden
- */
-class LocalizedMessagesDirective extends Messages {
-    constructor(service) {
-        super();
-        this.service = service;
-    }
-}
-LocalizedMessagesDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: LocalizedMessagesDirective, deps: [{ token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Directive });
-LocalizedMessagesDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: LocalizedMessagesDirective, isStandalone: true, selector: "[kendoDataPagerLocalizedMessages]", providers: [
-        {
-            provide: Messages,
-            useExisting: forwardRef(() => LocalizedMessagesDirective)
-        }
-    ], usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: LocalizedMessagesDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    providers: [
-                        {
-                            provide: Messages,
-                            useExisting: forwardRef(() => LocalizedMessagesDirective)
-                        }
-                    ],
-                    selector: '[kendoDataPagerLocalizedMessages]',
-                    standalone: true
-                }]
-        }], ctorParameters: function () { return [{ type: i1.LocalizationService }]; } });
-
-/**
- * @hidden
- */
-class PagerContextService {
-    constructor() {
-        this.changes = new Subject();
-        this.pageChange = new Subject();
-        this.pageSizeChange = 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(event) {
-        this.pageSizeChange.next(event);
-    }
-    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);
-        }
-    }
-}
-
-/**
- * @hidden
- */
-class PagerElementComponent {
-    constructor(localization, pagerContext, cd) {
-        this.localization = localization;
-        this.pagerContext = pagerContext;
-        this.cd = cd;
-        this.total = this.pagerContext.total;
-        this.skip = this.pagerContext.skip;
-        this.pageSize = this.pagerContext.pageSize;
-        this.caretAltLeftIcon = caretAltLeftIcon;
-        this.caretAltToLeftIcon = caretAltToLeftIcon;
-        this.caretAltRightIcon = caretAltRightIcon;
-        this.caretAltToRightIcon = caretAltToRightIcon;
-    }
-    /**
-     * @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);
-    }
-    /**
-     * @hidden
-     *
-     * @param {string} key
-     * @returns {string}
-     *
-     * @memberOf PagerElementComponent
-     */
-    textFor(key) {
-        return this.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.localization.changes.subscribe(() => this.cd.markForCheck()));
-    }
-    ngOnDestroy() {
-        if (this.subscriptions) {
-            this.subscriptions.unsubscribe();
-        }
-    }
-    get prevArrowIcons() {
-        return !this.localization.rtl ? ['caret-alt-to-left', 'caret-alt-left'] : ['caret-alt-to-right', 'caret-alt-right'];
-    }
-    get prevArrowSVGIcons() {
-        return !this.localization.rtl ? [this.caretAltToLeftIcon, this.caretAltLeftIcon] : [this.caretAltToRightIcon, this.caretAltRightIcon];
-    }
-    get nextArrowIcons() {
-        return !this.localization.rtl ? ['caret-alt-right', 'caret-alt-to-right'] : ['caret-alt-left', 'caret-alt-to-left'];
-    }
-    get nextArrowSVGIcons() {
-        return !this.localization.rtl ? [this.caretAltRightIcon, this.caretAltToRightIcon] : [this.caretAltLeftIcon, this.caretAltToLeftIcon];
-    }
-}
-PagerElementComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PagerElementComponent, deps: [{ token: i1.LocalizationService }, { token: PagerContextService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-PagerElementComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: PagerElementComponent, selector: "kendo-pager-element", ngImport: i0, template: ``, isInline: true });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PagerElementComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'kendo-pager-element',
-                    template: ``
-                }]
-        }], ctorParameters: function () { return [{ type: i1.LocalizationService }, { type: PagerContextService }, { type: i0.ChangeDetectorRef }]; } });
-
-/**
- * @hidden
- */
-const DEFAULT_PAGE_SIZE_VALUES = [5, 10, 20];
-/**
- * @hidden
- */
-const focusableDirectiveSelector = '[kendoPagerFocusable]';
-/**
- * @hidden
- */
-const getAllFocusableChildren = (parent) => {
-    return parent.querySelectorAll(focusableDirectiveSelector);
-};
-/**
- * @hidden
- */
-const focusableSelector = [
-    'a[href]:not([disabled])',
-    'area[href]:not([disabled])',
-    'input:not([disabled])',
-    'select:not([disabled])',
-    'textarea:not([disabled])',
-    'button',
-    'iframe:not([disabled])',
-    'object:not([disabled])',
-    'embed:not([disabled])',
-    '*[tabindex]:not([disabled])',
-    '*[contenteditable]:not([disabled]):not([contenteditable="false"])'
-].join(',');
-/**
- * @hidden
- */
-const DEFAULT_SIZE = 'medium';
-const SIZES = {
-    small: 'sm',
-    medium: 'md',
-    large: 'lg'
-};
-/**
- * @hidden
- *
- * Returns the styling classes to be added and removed
- */
-const getStylingClasses = (componentType, stylingOption, previousValue, newValue) => {
-    switch (stylingOption) {
-        case 'size':
-            return {
-                toRemove: `k-${componentType}-${SIZES[previousValue]}`,
-                toAdd: newValue !== 'none' ? `k-${componentType}-${SIZES[newValue]}` : ''
-            };
-        default:
-            break;
-    }
-};
-
-/**
- * @hidden
- */
-class PagerNavigationService {
-    constructor() {
-        this.isNavigable = false;
-        this.innerNavigationChange = new Subject();
-    }
-    toggleInnerNavigation(value) {
-        this.innerNavigationChange.next(value);
-    }
-    keepFocusWithinComponent(wrapper, target, event) {
-        const [firstFocusable, lastFocusable] = this.getFirstAndLastFocusable(wrapper);
-        const tabAfterLastFocusable = !event.shiftKey && target === lastFocusable;
-        const shiftTabAfterFirstFocusable = event.shiftKey && target === firstFocusable;
-        if (tabAfterLastFocusable) {
-            event.preventDefault();
-            firstFocusable.focus();
-        }
-        if (shiftTabAfterFirstFocusable) {
-            event.preventDefault();
-            lastFocusable.focus();
-        }
-    }
-    getFirstAndLastFocusable(wrapper) {
-        const all = getAllFocusableChildren(wrapper);
-        const firstFocusable = all.length > 0 ? all[0] : parent;
-        const lastFocusable = all.length > 0 ? all[all.length - 1] : parent;
-        return [firstFocusable, lastFocusable];
-    }
-}
-
-/**
- * Place the directive on custom focusable elements in the [`kendoDataPagerTemplate`]({% slug api_pager_pagertemplatedirective %}) to include them in the built-in Pager keyboard navigation.
- */
-class PagerFocusableDirective {
-    constructor(navigationService, element, renderer) {
-        this.navigationService = navigationService;
-        this.element = element;
-        this.renderer = renderer;
-        this.subscriptions = new Subscription();
-    }
-    ngOnInit() {
-        this.subscriptions.add(this.navigationService.innerNavigationChange.subscribe(this.innerNavigationChange.bind(this)));
-    }
-    ngOnDestroy() {
-        this.subscriptions.unsubscribe();
-    }
-    get nativeElement() {
-        return this.element.nativeElement;
-    }
-    innerNavigationChange(value) {
-        if (!this.navigationService.isNavigable) {
-            return;
-        }
-        const index = value ? '0' : '-1';
-        if (this.nativeElement.matches(focusableSelector)) {
-            this.renderer.setAttribute(this.nativeElement, 'tabindex', index);
-        }
-        const focusableElements = this.nativeElement.querySelectorAll(focusableSelector);
-        focusableElements.forEach(el => {
-            this.renderer.setAttribute(el, 'tabindex', index);
-        });
-    }
-}
-PagerFocusableDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PagerFocusableDirective, deps: [{ token: PagerNavigationService }, { token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive });
-PagerFocusableDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: PagerFocusableDirective, isStandalone: true, selector: "[kendoPagerFocusable]", exportAs: ["kendoPagerFocusable"], ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PagerFocusableDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[kendoPagerFocusable]',
-                    exportAs: 'kendoPagerFocusable',
-                    standalone: true
-                }]
-        }], ctorParameters: function () { return [{ type: PagerNavigationService }, { type: i0.ElementRef }, { type: i0.Renderer2 }]; } });
-
-// eslint-disable no-access-missing-member
-/**
- * Displays buttons for navigating to the first and to the previous page ([see example]({% slug pager_settings %})).
- */
-class PagerPrevButtonsComponent extends PagerElementComponent {
-    constructor(localization, pagerContext, cd) {
-        super(localization, pagerContext, cd);
-        /**
-         * Specifies the padding of the buttons.
-         *
-         * The possible values are:
-         * * `small`
-         * * `medium` (default)
-         * * `large`
-         * * `none`
-         */
-        this.size = DEFAULT_SIZE;
-    }
-    /**
-     * @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();
-    }
-}
-PagerPrevButtonsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PagerPrevButtonsComponent, deps: [{ token: i1.LocalizationService }, { token: PagerContextService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-PagerPrevButtonsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: PagerPrevButtonsComponent, isStandalone: true, selector: "kendo-datapager-prev-buttons", inputs: { size: "size" }, usesInheritance: true, ngImport: i0, template: `
-        <button
-            type="button" kendoButton kendoPagerFocusable
-            class="k-pager-nav k-pager-first"
-            [disabled]="disabled"
-            [icon]="prevArrowIcons[0]"
-            [svgIcon]="prevArrowSVGIcons[0]"
-            fillMode="flat"
-            rounded="none"
-            [size]="size"
-            [title]="textFor('firstPage')"
-            [attr.aria-label]="textFor('firstPage')"
-            (click)="currentPage !== 1 ? changePage(0) : false">
-        </button>
-        <button
-            type="button" kendoButton kendoPagerFocusable
-            class="k-pager-nav"
-            [disabled]="disabled"
-            [icon]="prevArrowIcons[1]"
-            [svgIcon]="prevArrowSVGIcons[1]"
-            fillMode="flat"
-            rounded="none"
-            [size]="size"
-            [title]="textFor('previousPage')"
-            [attr.aria-label]="textFor('previousPage')"
-            (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: PagerFocusableDirective, selector: "[kendoPagerFocusable]", exportAs: ["kendoPagerFocusable"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PagerPrevButtonsComponent, decorators: [{
-            type: Component,
-            args: [{
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    selector: 'kendo-datapager-prev-buttons',
-                    template: `
-        <button
-            type="button" kendoButton kendoPagerFocusable
-            class="k-pager-nav k-pager-first"
-            [disabled]="disabled"
-            [icon]="prevArrowIcons[0]"
-            [svgIcon]="prevArrowSVGIcons[0]"
-            fillMode="flat"
-            rounded="none"
-            [size]="size"
-            [title]="textFor('firstPage')"
-            [attr.aria-label]="textFor('firstPage')"
-            (click)="currentPage !== 1 ? changePage(0) : false">
-        </button>
-        <button
-            type="button" kendoButton kendoPagerFocusable
-            class="k-pager-nav"
-            [disabled]="disabled"
-            [icon]="prevArrowIcons[1]"
-            [svgIcon]="prevArrowSVGIcons[1]"
-            fillMode="flat"
-            rounded="none"
-            [size]="size"
-            [title]="textFor('previousPage')"
-            [attr.aria-label]="textFor('previousPage')"
-            (click)="currentPage !== 1 ? changePage(currentPage-2) : false">
-        </button>
-    `,
-                    standalone: true,
-                    imports: [ButtonComponent, PagerFocusableDirective]
-                }]
-        }], ctorParameters: function () { return [{ type: i1.LocalizationService }, { type: PagerContextService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { size: [{
-                type: Input
-            }] } });
-
-/**
- * Displays a drop-down list for the page size selection ([see example]({% slug pager_settings %})).
- */
-class PagerPageSizesComponent extends PagerElementComponent {
-    constructor(localization, cd, pagerContext, element, ngZone) {
-        super(localization, pagerContext, cd);
-        this.pagerContext = pagerContext;
-        this.element = element;
-        this.ngZone = ngZone;
-        /**
-         * Specifies the padding of the dropdown.
-         *
-         * The possible values are:
-         * * `small`
-         * * `medium` (default)
-         * * `large`
-         * * `none`
-         */
-        this.size = DEFAULT_SIZE;
-        this._pageSizes = [];
-    }
-    /**
-     * The page sizes collection. Can contain numbers and [PageSizeItem]({% slug api_pager_pagesizeitem %}) objects.
-     *
-     * @example
-     *
-     * ```ts-preview
-     * _@Component({
-     *    selector: 'my-app',
-     *    template: `
-     *        <div *ngFor="let item of pagedData" style="border: 1px solid black; padding: 10px;">
-     *            <span>{{item.ProductID}}. </span>
-     *            <span>{{item.ProductName}}</span>
-     *        </div>
-     *        <kendo-datapager
-     *             [skip]="skip"
-     *             [pageSize]="pageSize"
-     *             [total]="total"
-     *             (pageChange)="onPageChange($event)">
-     *           <ng-template kendoDataPagerTemplate>
-     *               <kendo-datapager-page-sizes [pageSizes]="pagesizes"></kendo-datapager-page-sizes>
-     *           </ng-template>
-     *        </kendo-datapager>
-     *    `
-     * })
-     * class AppComponent {
-     *    public data: any[] = products;
-     *    public pagedData = [];
-     *    public skip = 0;
-     *    public pageSize = 2;
-     *    public total = products.length;
-     *    public pagesizes = [{text: 'One', value: 1}, {text: 'Two', value: 2}, {text: 'All', value : 'all'}];
-     *
-     *    public ngOnInit() {
-     *        this.pageData();
-     *    }
-     *
-     *    public onPageChange(e) {
-     *        this.skip = e.skip;
-     *        this.pageSize = e.take;
-     *        this.pageData();
-     *    }
-     *
-     *    private pageData() {
-     *        this.pagedData = this.data.slice(this.skip, this.skip + this.pageSize);
-     *    }
-     * }
-     *
-     * const products = [{
-     *   'ProductID' : 1,
-     *   'ProductName' : "Chai",
-     *   'SupplierID' : 1,
-     *   'CategoryID' : 1,
-     *   'QuantityPerUnit' : "10 boxes x 20 bags",
-     *   'UnitPrice' : 18.0000,
-     *   'UnitsInStock' : 39,
-     *   'UnitsOnOrder' : 0,
-     *   'ReorderLevel' : 10,
-     *   'Discontinued' : false
-     *
-     * }, {
-     *   'ProductID' : 2,
-     *   'ProductName' : "Chang",
-     *   'SupplierID' : 1,
-     *   'CategoryID' : 1,
-     *   'QuantityPerUnit' : "24 - 12 oz bottles",
-     *   'UnitPrice' : 19.0000,
-     *   'UnitsInStock' : 17,
-     *   'UnitsOnOrder' : 40,
-     *   'ReorderLevel' : 25,
-     *   'Discontinued' : false
-     * }, {
-     *   'ProductID' : 3,
-     *   'ProductName' : "Aniseed Syrup",
-     *   'SupplierID' : 1,
-     *   'CategoryID' : 2,
-     *   'QuantityPerUnit' : "12 - 550 ml bottles",
-     *   'UnitPrice' : 10.0000,
-     *   'UnitsInStock' : 13,
-     *   'UnitsOnOrder' : 70,
-     *   'ReorderLevel' : 25,
-     *   'Discontinued' : false
-     * }, {
-     *   'ProductID' : 4,
-     *   'ProductName' : "Chef Anton\'s Cajun Seasoning",
-     *   'SupplierID' : 2,
-     *  'CategoryID' : 2,
-     *   'QuantityPerUnit' : "48 - 6 oz jars",
-     *   'UnitPrice' : 22.0000,
-     *   'UnitsInStock' : 53,
-     *   'UnitsOnOrder' : 0,
-     *   'ReorderLevel' : 0,
-     *   'Discontinued' : false
-     * }, {
-     *   'ProductID' : 5,
-     *   'ProductName' : "Chef Anton\'s Gumbo Mix",
-     *   'SupplierID' : 2,
-     *   'CategoryID' : 2,
-     *   'QuantityPerUnit' : "36 boxes",
-     *   'UnitPrice' : 21.3500,
-     *   'UnitsInStock' : 0,
-     *   'UnitsOnOrder' : 0,
-     *   'ReorderLevel' : 0,
-     *   'Discontinued' : true
-     * }, {
-     *   'ProductID' : 6,
-     *   'ProductName' : "Grandma\'s Boysenberry Spread",
-     *   'SupplierID' : 3,
-     *   'CategoryID' : 2,
-     *   'QuantityPerUnit' : "12 - 8 oz jars",
-     *   'UnitPrice' : 25.0000,
-     *   'UnitsInStock' : 120,
-     *   'UnitsOnOrder' : 0,
-     *   'ReorderLevel' : 25,
-     *   'Discontinued' : false
-     * }];
-     * ```
-     *
-     */
-    set pageSizes(pageSizes) {
-        let normalizedItems = [];
-        if (Array.isArray(pageSizes)) {
-            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;
-    }
-    ngAfterViewInit() {
-        this.ngZone.runOutsideAngular(() => {
-            this.element.nativeElement.addEventListener('keydown', this.keyDownHandler.bind(this), true);
-        });
-    }
-    ngOnDestroy() {
-        this.element.nativeElement.removeEventListener('keydown', this.keyDownHandler);
-    }
-    /**
-     * @hidden
-     */
-    pageSizeChange(value, dropdownlist) {
-        const event = new PageSizeChangeEvent(value);
-        this.pagerContext.changePageSize(event);
-        if (event.isDefaultPrevented()) {
-            dropdownlist.writeValue(this.pageSize);
-        }
-    }
-    onChanges({ total, skip, pageSize }) {
-        this.total = total;
-        this.skip = skip;
-        this.pageSize = typeof pageSize === 'number' ? pageSize : this.total;
-        this.cd.markForCheck();
-    }
-    keyDownHandler(ev) {
-        if (ev.keyCode === Keys.Escape && this.dropDownList.isOpen) {
-            ev.stopPropagation();
-            this.dropDownList.toggle(false);
-        }
-    }
-}
-PagerPageSizesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PagerPageSizesComponent, deps: [{ token: i1.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: PagerContextService }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
-PagerPageSizesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: PagerPageSizesComponent, isStandalone: true, selector: "kendo-datapager-page-sizes", inputs: { pageSizes: "pageSizes", size: "size" }, host: { properties: { "class.k-pager-sizes": "this.classes" } }, viewQueries: [{ propertyName: "dropDownList", first: true, predicate: ["dropdownlist"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: `
-        <kendo-dropdownlist kendoPagerFocusable
-            #dropdownlist
-            [size]="size"
-            [data]="pageSizes"
-            textField="text"
-            valueField="value"
-            [valuePrimitive]="true"
-            [value]="pageSize"
-            (valueChange)="pageSizeChange($event, dropdownlist)"
-            [attr.aria-label]="textFor('itemsPerPage')"></kendo-dropdownlist>
-        {{ textFor('itemsPerPage') }}
-    `, 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: PagerFocusableDirective, selector: "[kendoPagerFocusable]", exportAs: ["kendoPagerFocusable"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PagerPageSizesComponent, decorators: [{
-            type: Component,
-            args: [{
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    selector: 'kendo-datapager-page-sizes',
-                    template: `
-        <kendo-dropdownlist kendoPagerFocusable
-            #dropdownlist
-            [size]="size"
-            [data]="pageSizes"
-            textField="text"
-            valueField="value"
-            [valuePrimitive]="true"
-            [value]="pageSize"
-            (valueChange)="pageSizeChange($event, dropdownlist)"
-            [attr.aria-label]="textFor('itemsPerPage')"></kendo-dropdownlist>
-        {{ textFor('itemsPerPage') }}
-    `,
-                    standalone: true,
-                    imports: [DropDownListComponent, PagerFocusableDirective]
-                }]
-        }], ctorParameters: function () { return [{ type: i1.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: PagerContextService }, { type: i0.ElementRef }, { type: i0.NgZone }]; }, propDecorators: { dropDownList: [{
-                type: ViewChild,
-                args: ['dropdownlist', { static: true }]
-            }], pageSizes: [{
-                type: Input
-            }], size: [{
-                type: Input
-            }], classes: [{
-                type: HostBinding,
-                args: ["class.k-pager-sizes"]
-            }] } });
-
-/**
- * Represents the pager template which helps to customize the pager appearance. To define a pager
- * template, nest an `<ng-template>` tag with the `kendoDataPagerTemplate` directive inside `<kendo-datapager>`.
- *
- * 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
- * ```ts-preview
- *
- * _@Component({
- *     selector: 'my-app',
- *     template: `
- *       <kendo-datapager [total]="total" [pageSize]="pageSize" [skip]="skip" (pageChange)="onPageChange($event)">
- *           <ng-template kendoDataPagerTemplate let-totalPages="totalPages" let-currentPage="currentPage">
- *               <kendo-datapager-prev-buttons></kendo-datapager-prev-buttons>
- *               <kendo-datapager-numeric-buttons [buttonCount]="10"></kendo-datapager-numeric-buttons>
- *               <kendo-datapager-next-buttons></kendo-datapager-next-buttons>
- *               <kendo-datapager-info></kendo-datapager-info>
- *               Current page: {{currentPage}}
- *           </ng-template>
- *        </kendo-datapager>
- *     `
- * })
- *
- * class AppComponent {
- *     public skip = 0;
- *     public pageSize = 10;
- *     public total = 100;
- *
- *     public onPageChange(e: any): void {
- *         this.skip = e.skip;
- *         this.pageSize = e.take;
- *     }
- * }
- *
- * ```
- */
-class PagerTemplateDirective {
-    constructor(templateRef) {
-        this.templateRef = templateRef;
-    }
-}
-PagerTemplateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PagerTemplateDirective, deps: [{ token: i0.TemplateRef, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
-PagerTemplateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: PagerTemplateDirective, isStandalone: true, selector: "[kendoDataPagerTemplate]", ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PagerTemplateDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[kendoDataPagerTemplate]',
-                    standalone: true
-                }]
-        }], ctorParameters: function () {
-        return [{ type: i0.TemplateRef, decorators: [{
-                        type: Optional
-                    }] }];
-    } });
-
-/**
- * Displays numeric buttons to enable navigation between the pages.
- */
-class PagerNumericButtonsComponent extends PagerElementComponent {
-    constructor(localization, cd, pagerContext, renderer) {
-        super(localization, pagerContext, cd);
-        this.pagerContext = pagerContext;
-        this.renderer = renderer;
-        this._size = DEFAULT_SIZE;
-    }
-    /**
-     * Specifies the padding of the numeric buttons.
-     *
-     * The possible values are:
-     * * `small`
-     * * `medium` (default)
-     * * `large`
-     * * `none`
-     */
-    set size(size) {
-        const newSize = size ? size : DEFAULT_SIZE;
-        this.handleClasses(newSize, 'size');
-        this._size = newSize;
-    }
-    get size() {
-        return this._size;
-    }
-    /**
-     * @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;
-    }
-    ngAfterViewInit() {
-        this.handleClasses(this.size, 'size');
-    }
-    /**
-     * @hidden
-     */
-    pageLabel(num) {
-        const pageText = this.textFor('page');
-        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();
-    }
-    get pageChooserLabel() {
-        return this.textFor('selectPage');
-    }
-    handleClasses(value, input) {
-        var _a;
-        const elem = (_a = this.selectElement) === null || _a === void 0 ? void 0 : _a.nativeElement;
-        const classes = getStylingClasses('picker', input, this[input], value);
-        if (!elem) {
-            return;
-        }
-        if (classes.toRemove) {
-            this.renderer.removeClass(elem, classes.toRemove);
-        }
-        if (classes.toAdd) {
-            this.renderer.addClass(elem, classes.toAdd);
-        }
-    }
-}
-PagerNumericButtonsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PagerNumericButtonsComponent, deps: [{ token: i1.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: PagerContextService }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
-PagerNumericButtonsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: PagerNumericButtonsComponent, isStandalone: true, selector: "kendo-datapager-numeric-buttons", inputs: { buttonCount: "buttonCount", size: "size" }, 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 kendoPagerFocusable #select
-            class="k-dropdown-list k-dropdown k-picker k-picker-solid k-rounded-md"
-            [style.display]="'none'"
-            [attr.title]="pageChooserLabel"
-            [attr.aria-label]="pageChooserLabel"
-            (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"
-                kendoPagerFocusable
-                kendoButton
-                [size]="size"
-                fillMode="flat"
-                themeColor="primary"
-                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"
-                kendoPagerFocusable
-                kendoButton
-                [size]="size"
-                fillMode="flat"
-                themeColor="primary"
-                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"
-                kendoPagerFocusable
-                kendoButton
-                [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: PagerFocusableDirective, selector: "[kendoPagerFocusable]", exportAs: ["kendoPagerFocusable"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: "15.2.10", ngImport: i0, type: PagerNumericButtonsComponent, decorators: [{
-            type: Component,
-            args: [{
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    selector: 'kendo-datapager-numeric-buttons',
-                    template: `
-        <select kendoPagerFocusable #select
-            class="k-dropdown-list k-dropdown k-picker k-picker-solid k-rounded-md"
-            [style.display]="'none'"
-            [attr.title]="pageChooserLabel"
-            [attr.aria-label]="pageChooserLabel"
-            (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"
-                kendoPagerFocusable
-                kendoButton
-                [size]="size"
-                fillMode="flat"
-                themeColor="primary"
-                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"
-                kendoPagerFocusable
-                kendoButton
-                [size]="size"
-                fillMode="flat"
-                themeColor="primary"
-                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"
-                kendoPagerFocusable
-                kendoButton
-                [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: [PagerFocusableDirective, NgIf, NgFor, NgClass, ButtonComponent]
-                }]
-        }], ctorParameters: function () { return [{ type: i1.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: PagerContextService }, { type: i0.Renderer2 }]; }, propDecorators: { selectElement: [{
-                type: ViewChild,
-                args: ['select', { read: ElementRef }]
-            }], numbersElement: [{
-                type: ViewChild,
-                args: ['numbers', { read: ElementRef }]
-            }], buttonCount: [{
-                type: Input
-            }], size: [{
-                type: Input
-            }] } });
-
-// eslint-disable  no-access-missing-member
-/**
- * Displays buttons for navigating to the next and to the last page ([see example]({% slug pager_settings %})).
- */
-class PagerNextButtonsComponent extends PagerElementComponent {
-    constructor(localization, pagerContext, cd) {
-        super(localization, pagerContext, cd);
-        /**
-         * Specifies the padding of the buttons.
-         *
-         * The possible values are:
-         * * `small`
-         * * `medium` (default)
-         * * `large`
-         * * `none`
-         */
-        this.size = DEFAULT_SIZE;
-    }
-    /**
-     * @hidden
-     *
-     * @readonly
-     * @type {boolean}
-     * @memberOf PagerNextButtonsComponent
-     */
-    get disabled() {
-        return this.currentPage === this.totalPages || !this.total;
-    }
-    onChanges({ total, skip, pageSize }) {
-        this.total = total;
-        this.skip = skip;
-        this.pageSize = pageSize;
-        this.cd.markForCheck();
-    }
-}
-PagerNextButtonsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PagerNextButtonsComponent, deps: [{ token: i1.LocalizationService }, { token: PagerContextService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-PagerNextButtonsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: PagerNextButtonsComponent, isStandalone: true, selector: "kendo-datapager-next-buttons", inputs: { size: "size" }, usesInheritance: true, ngImport: i0, template: `
-        <button kendoButton kendoPagerFocusable
-            type="button"
-            [size]="size"
-            [icon]="nextArrowIcons[0]"
-            [svgIcon]="nextArrowSVGIcons[0]"
-            fillMode="flat"
-            rounded="none"
-            class="k-pager-nav"
-            [disabled]="disabled"
-            [title]="textFor('nextPage')"
-            [attr.aria-label]="textFor('nextPage')"
-            (click)="currentPage !== totalPages ? changePage(currentPage) : false">
-        </button>
-        <button kendoButton kendoPagerFocusable
-            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('lastPage')"
-            [attr.aria-label]="textFor('lastPage')"
-            (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: PagerFocusableDirective, selector: "[kendoPagerFocusable]", exportAs: ["kendoPagerFocusable"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PagerNextButtonsComponent, decorators: [{
-            type: Component,
-            args: [{
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    selector: 'kendo-datapager-next-buttons',
-                    template: `
-        <button kendoButton kendoPagerFocusable
-            type="button"
-            [size]="size"
-            [icon]="nextArrowIcons[0]"
-            [svgIcon]="nextArrowSVGIcons[0]"
-            fillMode="flat"
-            rounded="none"
-            class="k-pager-nav"
-            [disabled]="disabled"
-            [title]="textFor('nextPage')"
-            [attr.aria-label]="textFor('nextPage')"
-            (click)="currentPage !== totalPages ? changePage(currentPage) : false">
-        </button>
-        <button kendoButton kendoPagerFocusable
-            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('lastPage')"
-            [attr.aria-label]="textFor('lastPage')"
-            (click)="currentPage !== totalPages ? changePage(totalPages-1) : false">
-        </button>
-    `,
-                    standalone: true,
-                    imports: [ButtonComponent, PagerFocusableDirective]
-                }]
-        }], ctorParameters: function () { return [{ type: i1.LocalizationService }, { type: PagerContextService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { size: [{
-                type: Input
-            }] } });
-
-/**
- * Displays an input element which allows the typing and rendering of page numbers.
- */
-class PagerInputComponent extends PagerElementComponent {
-    constructor(localization, pagerContext, zone, cd, renderer) {
-        super(localization, pagerContext, cd);
-        this.pagerContext = pagerContext;
-        this.zone = zone;
-        this.renderer = renderer;
-        /**
-         * Specifies the padding of the internal numeric input element.
-         *
-         * The possible values are:
-         * * `small`
-         * * `medium` (default)
-         * * `large`
-         * * `none`
-         */
-        this.size = DEFAULT_SIZE;
-        /**
-         * @hidden
-         *
-         * @param {string} value
-         *
-         * @memberOf PagerInputComponent
-         */
-        this.handleKeyDown = (event) => {
-            const incomingValue = this.numericInput.value || this.current;
-            // eslint-disable import/no-deprecated
-            if (event.keyCode === Keys.Enter) {
-                event.preventDefault();
-                if (incomingValue !== this.current) {
-                    this.zone.run(() => {
-                        this.changePage(incomingValue - 1);
-                    });
-                }
-            }
-        };
-        /**
-         * @hidden
-         *
-         * @param {string} value
-         *
-         * @memberOf PagerInputComponent
-         */
-        this.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);
-                });
-            }
-        };
-    }
-    onChanges({ total, skip, pageSize }) {
-        this.total = total;
-        this.skip = skip;
-        this.pageSize = pageSize;
-        this.cd.markForCheck();
-    }
-    /**
-     * @hidden
-     */
-    get current() {
-        return this.hasPages ? this.currentPage : 0;
-    }
-    /**
-     * @hidden
-     */
-    get hasPages() {
-        return this.totalPages !== 0;
-    }
-}
-PagerInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PagerInputComponent, deps: [{ token: i1.LocalizationService }, { token: PagerContextService }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
-PagerInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: PagerInputComponent, isStandalone: true, selector: "kendo-datapager-input", inputs: { size: "size" }, viewQueries: [{ propertyName: "numericInput", first: true, predicate: NumericTextBoxComponent, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: `
-     <span class="k-pager-input">
-        {{textFor('page')}}
-        <kendo-numerictextbox kendoPagerFocusable
-            [spinners]="false"
-            [decimals]="0"
-            format="n0"
-            [size]="size"
-            [disabled]="!hasPages"
-            [value]="current"
-            [min]="hasPages ? 1 : 0"
-            [max]="totalPages"
-            [autoCorrect]="true"
-            [inputAttributes]="{
-                'aria-label': textFor('inputLabel')
-            }"
-            [title]="textFor('pageNumberInputTitle')"
-            [kendoEventsOutsideAngular]="{
-                keydown: handleKeyDown,
-                focusout: handleBlur
-            }">
-        </kendo-numerictextbox>
-        {{textFor('of')}} {{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: PagerFocusableDirective, selector: "[kendoPagerFocusable]", exportAs: ["kendoPagerFocusable"] }, { kind: "directive", type: EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PagerInputComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'kendo-datapager-input',
-                    template: `
-     <span class="k-pager-input">
-        {{textFor('page')}}
-        <kendo-numerictextbox kendoPagerFocusable
-            [spinners]="false"
-            [decimals]="0"
-            format="n0"
-            [size]="size"
-            [disabled]="!hasPages"
-            [value]="current"
-            [min]="hasPages ? 1 : 0"
-            [max]="totalPages"
-            [autoCorrect]="true"
-            [inputAttributes]="{
-                'aria-label': textFor('inputLabel')
-            }"
-            [title]="textFor('pageNumberInputTitle')"
-            [kendoEventsOutsideAngular]="{
-                keydown: handleKeyDown,
-                focusout: handleBlur
-            }">
-        </kendo-numerictextbox>
-        {{textFor('of')}} {{totalPages}}
-     </span>
-    `,
-                    standalone: true,
-                    imports: [NgClass, NumericTextBoxComponent, PagerFocusableDirective, EventsOutsideAngularDirective]
-                }]
-        }], ctorParameters: function () { return [{ type: i1.LocalizationService }, { type: PagerContextService }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }]; }, propDecorators: { numericInput: [{
-                type: ViewChild,
-                args: [NumericTextBoxComponent, { static: true }]
-            }], size: [{
-                type: Input
-            }] } });
-
-// eslint-disable no-access-missing-member
-/**
- * Displays information about the current page and the total number of records ([see example]({% slug pager_settings %})).
- */
-class PagerInfoComponent extends PagerElementComponent {
-    constructor(localization, cd, pagerContext) {
-        super(localization, pagerContext, cd);
-        this.pagerContext = 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;
-    }
-    onChanges({ total, skip, pageSize }) {
-        this.total = total;
-        this.skip = skip;
-        this.pageSize = pageSize;
-        this.cd.markForCheck();
-    }
-}
-PagerInfoComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PagerInfoComponent, deps: [{ token: i1.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: PagerContextService }], target: i0.ɵɵFactoryTarget.Component });
-PagerInfoComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: PagerInfoComponent, isStandalone: true, selector: "kendo-datapager-info", host: { properties: { "class.k-pager-info": "this.classes" } }, usesInheritance: true, ngImport: i0, template: `{{currentPageText}} - {{maxItems}} {{textFor('of')}} {{total}} {{textFor('items')}}`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PagerInfoComponent, decorators: [{
-            type: Component,
-            args: [{
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    selector: 'kendo-datapager-info',
-                    template: `{{currentPageText}} - {{maxItems}} {{textFor('of')}} {{total}} {{textFor('items')}}`,
-                    standalone: true
-                }]
-        }], ctorParameters: function () { return [{ type: i1.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: PagerContextService }]; }, propDecorators: { classes: [{
-                type: HostBinding,
-                args: ["class.k-pager-info"]
-            }] } });
-
-/**
- * @hidden
- */
-const packageMetadata = {
-    name: '@progress/kendo-angular-pager',
-    productName: 'Kendo UI for Angular',
-    productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1729174545,
-    version: '17.0.0-develop.9',
-    licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
-};
-
-/**
- * @hidden
- */
-const RESPONSIVE_BREAKPOINT_MEDIUM = 600;
-/**
- * @hidden
- */
-const RESPONSIVE_BREAKPOINT_LARGE = 768;
-
-class PagerComponent {
-    constructor(pagerContext, element, localization, renderer, ngZone, navigationService) {
-        this.pagerContext = pagerContext;
-        this.element = element;
-        this.localization = localization;
-        this.renderer = renderer;
-        this.ngZone = ngZone;
-        this.navigationService = navigationService;
-        /**
-         * Represents the total number of data items in the collection.
-         */
-        this.total = 0;
-        /**
-         * Defines the number of data items to be skipped.
-         */
-        this.skip = 0;
-        /**
-         * Sets the maximum numeric buttons count before the buttons are collapsed.
-         */
-        this.buttonCount = 10;
-        /**
-         * Toggles the information about the current page and the total number of records.
-         */
-        this.info = true;
-        /**
-         * Defines the type of the pager.
-         */
-        this.type = 'numeric';
-        /**
-         * Toggles the **Previous** and **Next** buttons.
-         */
-        this.previousNext = true;
-        /**
-         * Fires when the current page of the Pager is changed ([see example](slug:overview_pager)).
-         * You have to handle the event yourself and page the data.
-         */
-        this.pageChange = new EventEmitter();
-        /**
-         * Fires when the page size of the Pager is changed.
-         * You have to handle the event yourself and page the data.
-         * If the event is prevented, the page size will remain unchanged ([see example]({% slug pager_events %})).
-         */
-        this.pageSizeChange = new EventEmitter();
-        this.pagerClass = true;
-        this.widgetRole = 'application';
-        this.roleDescription = 'pager';
-        this.keyShortcuts = 'Enter ArrowRight ArrowLeft';
-        this.hostTabindex = '0';
-        this.subscriptions = new Subscription();
-        this._templateContext = {};
-        this._pageSizeValues = DEFAULT_PAGE_SIZE_VALUES;
-        this.isInnerNavigationEnabled = false;
-        this._navigable = false;
-        this._size = DEFAULT_SIZE;
-        this.resizeHandler = () => {
-            var _a;
-            if ((_a = this.template) === null || _a === void 0 ? void 0 : _a.first) {
-                return;
-            }
-            const width = this.element.nativeElement.offsetWidth;
-            this.ngZone.runOutsideAngular(() => {
-                setTimeout(() => {
-                    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');
-                        this.renderer.addClass(selectElement, 'k-hidden');
-                        if (width < RESPONSIVE_BREAKPOINT_MEDIUM) {
-                            this.renderer.removeStyle(selectElement, 'display');
-                            this.renderer.removeClass(selectElement, 'k-hidden');
-                            this.renderer.setStyle(numbersElement, 'display', 'none');
-                        }
-                        else {
-                            this.renderer.addClass(selectElement, 'k-hidden');
-                        }
-                    }
-                    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');
-                        }
-                    }
-                });
-            });
-        };
-        validatePackage(packageMetadata);
-        this.direction = localization.rtl ? 'rtl' : 'ltr';
-    }
-    /**
-     * Shows a dropdown for selecting the page size.
-     * When set to `true`, the dropdown will contain the default list of options - 5, 10, 20.
-     * To customize the list of options, set `pageSizeValues` to an array of the desired values.
-     * The array can contain numbers and [PageSizeItem]({% slug api_pager_pagesizeitem %}) objects.
-     */
-    set pageSizeValues(pageSizeValues) {
-        this._pageSizeValues = Array.isArray(pageSizeValues) ? pageSizeValues : pageSizeValues ? DEFAULT_PAGE_SIZE_VALUES : false;
-    }
-    get pageSizeValues() {
-        return this._pageSizeValues;
-    }
-    /**
-     * If set to `true`, the user can use dedicated shortcuts to interact with the Pager ([see example]({% slug keyboard_navigation_pager %})).
-     * By default, navigation is disabled and the Pager content is accessible in the normal tab sequence.
-     * @default false
-     */
-    set navigable(value) {
-        this._navigable = value;
-        this.navigationService.isNavigable = value;
-    }
-    get navigable() {
-        return this._navigable;
-    }
-    /**
-     * Specifies the padding of all Pager elements.
-     *
-     * The possible values are:
-     * * `small`
-     * * `medium` (default)
-     * * `large`
-     * * `none`
-     */
-    set size(size) {
-        const newSize = size ? size : DEFAULT_SIZE;
-        this.handleClasses(newSize, 'size');
-        this._size = newSize;
-    }
-    get size() {
-        return this._size;
-    }
-    get dir() {
-        return this.direction;
-    }
-    /**
-     * @hidden
-     */
-    focusHandler(ev) {
-        const isInnerNavigationEnabled = ev.target !== this.element.nativeElement;
-        this.navigationService.toggleInnerNavigation(isInnerNavigationEnabled);
-    }
-    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;
-    }
-    ngOnInit() {
-        this.subscriptions.add(this.pagerContext.pageChange.subscribe(this.changePage.bind(this)));
-        this.subscriptions.add(this.pagerContext.pageSizeChange.subscribe(this.changePageSize.bind(this)));
-        this.subscriptions.add(this.resizeSensor.resize.subscribe(() => this.resizeHandler()));
-        this.subscriptions.add(this.localization.changes.subscribe(({ rtl }) => {
-            this.direction = rtl ? 'rtl' : 'ltr';
-        }));
-        this.subscriptions.add(this.navigationService.innerNavigationChange.subscribe(this.innerNavigationChange.bind(this)));
-        if (this.navigable) {
-            const wrapper = this.element.nativeElement;
-            this.ngZone.runOutsideAngular(() => {
-                this.subscriptions.add(this.renderer.listen(wrapper, 'keydown', this.keyDownHandler.bind(this)));
-            });
-        }
-    }
-    ngAfterViewInit() {
-        this.resizeHandler();
-        this.renderer.setAttribute(this.element.nativeElement, 'aria-label', this.ariaLabel);
-        this.subscriptions.add(this.template.changes.subscribe(() => {
-            this.resizeHandler();
-        }));
-        this.handleClasses(this.size, 'size');
-    }
-    ngOnChanges(changes) {
-        if (anyChanged(["pageSize", "skip", "total"], changes, false)) {
-            this.pagerContext.notifyChanges({
-                pageSize: this.pageSize,
-                skip: this.skip,
-                total: this.total
-            });
-            this.renderer.setAttribute(this.element.nativeElement, 'aria-label', this.ariaLabel);
-        }
-    }
-    ngOnDestroy() {
-        this.subscriptions.unsubscribe();
-    }
-    /**
-     * @hidden
-     */
-    changePage(event) {
-        this.pageChange.emit(event);
-    }
-    /**
-     * @hidden
-     */
-    changePageSize(event) {
-        this.pageSizeChange.emit(event);
-        if (!event.isDefaultPrevented()) {
-            if (event.newPageSize === 'all') {
-                this.pageChange.emit({ skip: 0, take: this.total });
-            }
-            else {
-                this.pageChange.emit({ skip: 0, take: event.newPageSize });
-            }
-        }
-    }
-    /**
-     * @hidden
-     */
-    onPageSizeChange(event) {
-        this.pageSizeChange.emit(event);
-        if (!event.isDefaultPrevented()) {
-            this.pageChange.emit({ skip: this.skip, take: event.newPageSize });
-        }
-    }
-    textFor(value) {
-        return this.localization.get(value);
-    }
-    get ariaLabel() {
-        return `${this.textFor('page')} ${this.currentPage} ${this.textFor('of')} ${this.totalPages}`;
-    }
-    keyDownHandler(e) {
-        const target = e.target;
-        const wrapper = this.element.nativeElement;
-        const isArrowLeftOrPageUp = e.keyCode === Keys.ArrowLeft || e.keyCode === Keys.PageUp;
-        const isArrowRightOrPageDown = e.keyCode === Keys.ArrowRight || e.keyCode === Keys.PageDown;
-        const isEnter = e.keyCode === Keys.Enter;
-        const isHome = e.keyCode === Keys.Home;
-        const isEnd = e.keyCode === Keys.End;
-        const isEsc = e.keyCode === Keys.Escape;
-        const isTab = e.keyCode === Keys.Tab;
-        const isFirstPage = this.currentPage === 1;
-        const isLastPage = this.currentPage === this.totalPages;
-        this.ngZone.run(() => {
-            if (isHome) {
-                e.preventDefault();
-                !isFirstPage && this.pagerContext.changePage(0);
-            }
-            else if (isEnd) {
-                e.preventDefault();
-                !isLastPage && this.pagerContext.changePage(this.totalPages - 1);
-            }
-            else if (this.isInnerNavigationEnabled) {
-                if (isEsc) {
-                    this.navigationService.toggleInnerNavigation(false);
-                    wrapper.focus();
-                }
-                else if (isTab) {
-                    this.navigationService.keepFocusWithinComponent(wrapper, target, e);
-                }
-            }
-            else {
-                if (isArrowLeftOrPageUp) {
-                    e.preventDefault();
-                    !isFirstPage && this.pagerContext.prevPage();
-                }
-                else if (isArrowRightOrPageDown) {
-                    e.preventDefault();
-                    !isLastPage && this.pagerContext.nextPage();
-                }
-                else if (isEnter) {
-                    if (e.target !== wrapper) {
-                        return;
-                    }
-                    e.preventDefault();
-                    const [firstFocusable] = this.navigationService.getFirstAndLastFocusable(wrapper);
-                    this.navigationService.toggleInnerNavigation(true);
-                    firstFocusable === null || firstFocusable === void 0 ? void 0 : firstFocusable.focus();
-                }
-            }
-        });
-    }
-    innerNavigationChange(value) {
-        this.isInnerNavigationEnabled = value;
-    }
-    handleClasses(value, input) {
-        const elem = this.element.nativeElement;
-        const classes = getStylingClasses('pager', input, this[input], value);
-        if (classes.toRemove) {
-            this.renderer.removeClass(elem, classes.toRemove);
-        }
-        if (classes.toAdd) {
-            this.renderer.addClass(elem, classes.toAdd);
-        }
-    }
-}
-PagerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PagerComponent, deps: [{ token: PagerContextService }, { token: i0.ElementRef }, { token: i1.LocalizationService }, { token: i0.Renderer2 }, { token: i0.NgZone }, { token: PagerNavigationService }], target: i0.ɵɵFactoryTarget.Component });
-PagerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: PagerComponent, isStandalone: true, selector: "kendo-datapager", inputs: { total: "total", skip: "skip", pageSize: "pageSize", buttonCount: "buttonCount", info: "info", type: "type", pageSizeValues: "pageSizeValues", previousNext: "previousNext", navigable: "navigable", size: "size" }, outputs: { pageChange: "pageChange", pageSizeChange: "pageSizeChange" }, host: { listeners: { "focusin": "focusHandler($event)" }, properties: { "class.k-pager": "this.pagerClass", "attr.role": "this.widgetRole", "attr.aria-roledescription": "this.roleDescription", "attr.aria-keyshortcuts": "this.keyShortcuts", "attr.tabindex": "this.hostTabindex", "attr.dir": "this.dir" } }, providers: [
-        LocalizationService,
-        PagerContextService,
-        PagerNavigationService,
-        {
-            provide: L10N_PREFIX,
-            useValue: 'kendo.pager'
-        }
-    ], queries: [{ propertyName: "template", predicate: PagerTemplateDirective }], viewQueries: [{ propertyName: "resizeSensor", first: true, predicate: ResizeSensorComponent, descendants: true, static: true }, { 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 }], exportAs: ["kendoDataPager"], usesOnChanges: true, ngImport: i0, template: `
-        <ng-container kendoDataPagerLocalizedMessages
-            i18n-firstPage="kendo.pager.firstPage|The label for the first page button in the Pager"
-            firstPage="Go to the first page"
-
-            i18n-previousPage="kendo.pager.previousPage|The label for the previous page button in the Pager"
-            previousPage="Go to the previous page"
-
-            i18n-nextPage="kendo.pager.nextPage|The label for the next page button in the Pager"
-            nextPage="Go to the next page"
-
-            i18n-lastPage="kendo.pager.lastPage|The label for the last page button in the Pager"
-            lastPage="Go to the last page"
-
-            i18n-page="kendo.pager.page|The label before the current page number in the Pager"
-            page="Page"
-
-            i18n-of="kendo.pager.of|The label before the total pages number in the Pager"
-            of="of"
-
-            i18n-pageNumberInputTitle="kendo.pager.pageNumberInputTitle|The label for the pager input in the Pager"
-            pageNumberInputTitle="Page Number"
-
-            i18n-items="kendo.pager.items|The label after the total pages number in the Pager"
-            items="items"
-
-            i18n-itemsPerPage="kendo.pager.itemsPerPage|The label for the page size chooser in the Pager"
-            itemsPerPage="items per page"
-
-            i18n-selectPage="kendo.pager.selectPage|The text of the title and aria-label attributes applied to the page chooser in the Pager"
-            selectPage="Select page"
-
-            i18n-inputLabel="kendo.pager.inputLabel|The text of the aria-label attribute applied to the input element for entering the page number."
-            inputLabel="Type a page number"
-         >
-        </ng-container>
-        <ng-container
-            *ngIf="template.first?.templateRef"
-            [ngTemplateOutlet]="template.first?.templateRef"
-            [ngTemplateOutletContext]="templateContext">
-        </ng-container>
-        <ng-container *ngIf="!template?.first?.templateRef">
-            <div class="k-pager-numbers-wrap">
-                <kendo-datapager-prev-buttons [size]="size" *ngIf="previousNext"></kendo-datapager-prev-buttons>
-                <kendo-datapager-numeric-buttons
-                    [size]="size"
-                    *ngIf="type === 'numeric' && buttonCount > 0"
-                    [buttonCount]="buttonCount">
-                </kendo-datapager-numeric-buttons>
-                <kendo-datapager-input [size]="size" *ngIf="type === 'input'"></kendo-datapager-input>
-                <kendo-datapager-next-buttons [size]="size" *ngIf="previousNext"></kendo-datapager-next-buttons>
-            </div>
-            <kendo-datapager-page-sizes *ngIf="pageSizeValues"
-                [size]="size"
-                [pageSizes]="pageSizeValues">
-            </kendo-datapager-page-sizes>
-            <kendo-datapager-info *ngIf='info'>
-            </kendo-datapager-info>
-        </ng-container>
-        <kendo-resize-sensor></kendo-resize-sensor>
-  `, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "[kendoDataPagerLocalizedMessages]" }, { 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-datapager-prev-buttons", inputs: ["size"] }, { kind: "component", type: PagerNumericButtonsComponent, selector: "kendo-datapager-numeric-buttons", inputs: ["buttonCount", "size"] }, { kind: "component", type: PagerInputComponent, selector: "kendo-datapager-input", inputs: ["size"] }, { kind: "component", type: PagerNextButtonsComponent, selector: "kendo-datapager-next-buttons", inputs: ["size"] }, { kind: "component", type: PagerPageSizesComponent, selector: "kendo-datapager-page-sizes", inputs: ["pageSizes", "size"] }, { kind: "component", type: PagerInfoComponent, selector: "kendo-datapager-info" }, { kind: "component", type: ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PagerComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'kendo-datapager',
-                    exportAs: 'kendoDataPager',
-                    providers: [
-                        LocalizationService,
-                        PagerContextService,
-                        PagerNavigationService,
-                        {
-                            provide: L10N_PREFIX,
-                            useValue: 'kendo.pager'
-                        }
-                    ],
-                    template: `
-        <ng-container kendoDataPagerLocalizedMessages
-            i18n-firstPage="kendo.pager.firstPage|The label for the first page button in the Pager"
-            firstPage="Go to the first page"
-
-            i18n-previousPage="kendo.pager.previousPage|The label for the previous page button in the Pager"
-            previousPage="Go to the previous page"
-
-            i18n-nextPage="kendo.pager.nextPage|The label for the next page button in the Pager"
-            nextPage="Go to the next page"
-
-            i18n-lastPage="kendo.pager.lastPage|The label for the last page button in the Pager"
-            lastPage="Go to the last page"
-
-            i18n-page="kendo.pager.page|The label before the current page number in the Pager"
-            page="Page"
-
-            i18n-of="kendo.pager.of|The label before the total pages number in the Pager"
-            of="of"
-
-            i18n-pageNumberInputTitle="kendo.pager.pageNumberInputTitle|The label for the pager input in the Pager"
-            pageNumberInputTitle="Page Number"
-
-            i18n-items="kendo.pager.items|The label after the total pages number in the Pager"
-            items="items"
-
-            i18n-itemsPerPage="kendo.pager.itemsPerPage|The label for the page size chooser in the Pager"
-            itemsPerPage="items per page"
-
-            i18n-selectPage="kendo.pager.selectPage|The text of the title and aria-label attributes applied to the page chooser in the Pager"
-            selectPage="Select page"
-
-            i18n-inputLabel="kendo.pager.inputLabel|The text of the aria-label attribute applied to the input element for entering the page number."
-            inputLabel="Type a page number"
-         >
-        </ng-container>
-        <ng-container
-            *ngIf="template.first?.templateRef"
-            [ngTemplateOutlet]="template.first?.templateRef"
-            [ngTemplateOutletContext]="templateContext">
-        </ng-container>
-        <ng-container *ngIf="!template?.first?.templateRef">
-            <div class="k-pager-numbers-wrap">
-                <kendo-datapager-prev-buttons [size]="size" *ngIf="previousNext"></kendo-datapager-prev-buttons>
-                <kendo-datapager-numeric-buttons
-                    [size]="size"
-                    *ngIf="type === 'numeric' && buttonCount > 0"
-                    [buttonCount]="buttonCount">
-                </kendo-datapager-numeric-buttons>
-                <kendo-datapager-input [size]="size" *ngIf="type === 'input'"></kendo-datapager-input>
-                <kendo-datapager-next-buttons [size]="size" *ngIf="previousNext"></kendo-datapager-next-buttons>
-            </div>
-            <kendo-datapager-page-sizes *ngIf="pageSizeValues"
-                [size]="size"
-                [pageSizes]="pageSizeValues">
-            </kendo-datapager-page-sizes>
-            <kendo-datapager-info *ngIf='info'>
-            </kendo-datapager-info>
-        </ng-container>
-        <kendo-resize-sensor></kendo-resize-sensor>
-  `,
-                    standalone: true,
-                    imports: [LocalizedMessagesDirective, NgIf, NgTemplateOutlet, PagerPrevButtonsComponent, PagerNumericButtonsComponent, PagerInputComponent, PagerNextButtonsComponent, PagerPageSizesComponent, PagerInfoComponent, ResizeSensorComponent]
-                }]
-        }], ctorParameters: function () { return [{ type: PagerContextService }, { type: i0.ElementRef }, { type: i1.LocalizationService }, { type: i0.Renderer2 }, { type: i0.NgZone }, { type: PagerNavigationService }]; }, propDecorators: { resizeSensor: [{
-                type: ViewChild,
-                args: [ResizeSensorComponent, { static: true }]
-            }], pagerInfo: [{
-                type: ViewChild,
-                args: [PagerInfoComponent, { read: ElementRef }]
-            }], pagerPageSizes: [{
-                type: ViewChild,
-                args: [PagerPageSizesComponent, { read: ElementRef }]
-            }], numericButtons: [{
-                type: ViewChild,
-                args: [PagerNumericButtonsComponent]
-            }], template: [{
-                type: ContentChildren,
-                args: [PagerTemplateDirective]
-            }], total: [{
-                type: Input
-            }], skip: [{
-                type: Input
-            }], pageSize: [{
-                type: Input
-            }], buttonCount: [{
-                type: Input
-            }], info: [{
-                type: Input
-            }], type: [{
-                type: Input
-            }], pageSizeValues: [{
-                type: Input
-            }], previousNext: [{
-                type: Input
-            }], navigable: [{
-                type: Input
-            }], size: [{
-                type: Input
-            }], pageChange: [{
-                type: Output
-            }], pageSizeChange: [{
-                type: Output
-            }], pagerClass: [{
-                type: HostBinding,
-                args: ['class.k-pager']
-            }], widgetRole: [{
-                type: HostBinding,
-                args: ['attr.role']
-            }], roleDescription: [{
-                type: HostBinding,
-                args: ['attr.aria-roledescription']
-            }], keyShortcuts: [{
-                type: HostBinding,
-                args: ['attr.aria-keyshortcuts']
-            }], hostTabindex: [{
-                type: HostBinding,
-                args: ['attr.tabindex']
-            }], dir: [{
-                type: HostBinding,
-                args: ['attr.dir']
-            }], focusHandler: [{
-                type: HostListener,
-                args: ['focusin', ['$event']]
-            }] } });
-
-/**
- * Utility array that contains all `@progress/kendo-angular-pager` related components and directives
- */
-const KENDO_PAGER = [
-    CustomMessagesComponent,
-    PagerFocusableDirective,
-    PagerInfoComponent,
-    PagerInputComponent,
-    PagerNextButtonsComponent,
-    PagerNumericButtonsComponent,
-    PagerPageSizesComponent,
-    PagerPrevButtonsComponent,
-    PagerTemplateDirective,
-    PagerComponent
-];
-
-// IMPORTANT: NgModule export kept for backwards compatibility
-/**
- * @hidden
- */
-class PagerModule {
-}
-PagerModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PagerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-PagerModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: PagerModule, imports: [CustomMessagesComponent, PagerFocusableDirective, PagerInfoComponent, PagerInputComponent, PagerNextButtonsComponent, PagerNumericButtonsComponent, PagerPageSizesComponent, PagerPrevButtonsComponent, PagerTemplateDirective, PagerComponent], exports: [CustomMessagesComponent, PagerFocusableDirective, PagerInfoComponent, PagerInputComponent, PagerNextButtonsComponent, PagerNumericButtonsComponent, PagerPageSizesComponent, PagerPrevButtonsComponent, PagerTemplateDirective, PagerComponent] });
-PagerModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PagerModule, providers: [
-        IconsService,
-        PopupService,
-        ResizeBatchService
-    ], imports: [CustomMessagesComponent, PagerInfoComponent, PagerInputComponent, PagerNextButtonsComponent, PagerNumericButtonsComponent, PagerPageSizesComponent, PagerPrevButtonsComponent, PagerComponent] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PagerModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    exports: [...KENDO_PAGER],
-                    imports: [...KENDO_PAGER],
-                    providers: [
-                        IconsService,
-                        PopupService,
-                        ResizeBatchService
-                    ]
-                }]
-        }] });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { CustomMessagesComponent, KENDO_PAGER, LocalizedMessagesDirective, PageSizeChangeEvent, PagerComponent, PagerFocusableDirective, PagerInfoComponent, PagerInputComponent, PagerModule, PagerNextButtonsComponent, PagerNumericButtonsComponent, PagerPageSizesComponent, PagerPrevButtonsComponent, PagerTemplateDirective };
-