@progress/kendo-angular-pager 17.0.0-develop.21 → 17.0.0-develop.22

package/{esm2020 → esm2022}/pager/pager-page-sizes.component.mjs

@@ -18,23 +18,10 @@ import * as i2 from "./pager-context.service";
  * Displays a drop-down list for the page size selection ([see example]({% slug pager_settings %})).
  */
 export 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 = [];
-    }
+    pagerContext;
+    element;
+    ngZone;
+    dropDownList;
     /**
      * The page sizes collection. Can contain numbers and [PageSizeItem]({% slug api_pager_pagesizeitem %}) objects.
      *
@@ -176,6 +163,16 @@ export class PagerPageSizesComponent extends PagerElementComponent {
     get pageSizes() {
         return this._pageSizes;
     }
+    /**
+     * Specifies the padding of the dropdown.
+     *
+     * The possible values are:
+     * * `small`
+     * * `medium` (default)
+     * * `large`
+     * * `none`
+     */
+    size = DEFAULT_SIZE;
     /**
      * @hidden
      *
@@ -184,6 +181,13 @@ export class PagerPageSizesComponent extends PagerElementComponent {
     get classes() {
         return true;
     }
+    _pageSizes = [];
+    constructor(localization, cd, pagerContext, element, ngZone) {
+        super(localization, pagerContext, cd);
+        this.pagerContext = pagerContext;
+        this.element = element;
+        this.ngZone = ngZone;
+    }
     ngAfterViewInit() {
         this.ngZone.runOutsideAngular(() => {
             this.element.nativeElement.addEventListener('keydown', this.keyDownHandler.bind(this), true);
@@ -214,9 +218,8 @@ export class PagerPageSizesComponent extends PagerElementComponent {
             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: i2.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: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PagerPageSizesComponent, deps: [{ token: i1.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: i2.PagerContextService }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", 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"
@@ -229,7 +232,8 @@ PagerPageSizesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0"
             [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: [{
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PagerPageSizesComponent, decorators: [{
             type: Component,
             args: [{
                     changeDetection: ChangeDetectionStrategy.OnPush,

package/{esm2020 → esm2022}/pager/pager-prev-buttons.component.mjs

@@ -19,17 +19,17 @@ import * as i2 from "./pager-context.service";
 export 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;
     }
+    /**
+     * Specifies the padding of the buttons.
+     *
+     * The possible values are:
+     * * `small`
+     * * `medium` (default)
+     * * `large`
+     * * `none`
+     */
+    size = DEFAULT_SIZE;
     /**
      * @hidden
      *
@@ -46,9 +46,8 @@ export class PagerPrevButtonsComponent extends PagerElementComponent {
         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: i2.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: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PagerPrevButtonsComponent, deps: [{ token: i1.LocalizationService }, { token: i2.PagerContextService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", 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"
@@ -76,7 +75,8 @@ PagerPrevButtonsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.
             (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: [{
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PagerPrevButtonsComponent, decorators: [{
             type: Component,
             args: [{
                     changeDetection: ChangeDetectionStrategy.OnPush,

package/{esm2020 → esm2022}/pager/pager-template.directive.mjs

@@ -47,13 +47,14 @@ import * as i0 from "@angular/core";
  * ```
  */
 export class PagerTemplateDirective {
+    templateRef;
     constructor(templateRef) {
         this.templateRef = templateRef;
     }
+    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: "[kendoDataPagerTemplate]", ngImport: i0 });
 }
-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: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PagerTemplateDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kendoDataPagerTemplate]',

package/{esm2020 → esm2022}/pager/pager.component.mjs

@@ -26,99 +26,41 @@ import * as i1 from "./pager-context.service";
 import * as i2 from "@progress/kendo-angular-l10n";
 import * as i3 from "./navigation.service";
 export 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 = () => {
-            if (this.template?.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';
-    }
+    pagerContext;
+    element;
+    localization;
+    renderer;
+    ngZone;
+    navigationService;
+    resizeSensor;
+    pagerInfo;
+    pagerPageSizes;
+    numericButtons;
+    template;
+    /**
+     * Represents the total number of data items in the collection.
+     */
+    total = 0;
+    /**
+     * Defines the number of data items to be skipped.
+     */
+    skip = 0;
+    /**
+     * Defines the number of data items per page.
+     */
+    pageSize;
+    /**
+     * Sets the maximum numeric buttons count before the buttons are collapsed.
+     */
+    buttonCount = 10;
+    /**
+     * Toggles the information about the current page and the total number of records.
+     */
+    info = true;
+    /**
+     * Defines the type of the pager.
+     */
+    type = 'numeric';
     /**
      * Shows a dropdown for selecting the page size.
      * When set to `true`, the dropdown will contain the default list of options - 5, 10, 20.
@@ -131,6 +73,10 @@ export class PagerComponent {
     get pageSizeValues() {
         return this._pageSizeValues;
     }
+    /**
+     * Toggles the **Previous** and **Next** buttons.
+     */
+    previousNext = true;
     /**
      * 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.
@@ -160,6 +106,22 @@ export class PagerComponent {
     get size() {
         return this._size;
     }
+    /**
+     * 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.
+     */
+    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 %})).
+     */
+    pageSizeChange = new EventEmitter();
+    pagerClass = true;
+    widgetRole = 'application';
+    roleDescription = 'pager';
+    keyShortcuts = 'Enter ArrowRight ArrowLeft';
+    hostTabindex = '0';
     get dir() {
         return this.direction;
     }
@@ -185,6 +147,23 @@ export class PagerComponent {
         context.currentPage = this.currentPage;
         return context;
     }
+    subscriptions = new Subscription();
+    _templateContext = {};
+    _pageSizeValues = DEFAULT_PAGE_SIZE_VALUES;
+    direction;
+    isInnerNavigationEnabled = false;
+    _navigable = false;
+    _size = DEFAULT_SIZE;
+    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;
+        validatePackage(packageMetadata);
+        this.direction = localization.rtl ? 'rtl' : 'ltr';
+    }
     ngOnInit() {
         this.subscriptions.add(this.pagerContext.pageChange.subscribe(this.changePage.bind(this)));
         this.subscriptions.add(this.pagerContext.pageSizeChange.subscribe(this.changePageSize.bind(this)));
@@ -250,6 +229,43 @@ export class PagerComponent {
             this.pageChange.emit({ skip: this.skip, take: event.newPageSize });
         }
     }
+    resizeHandler = () => {
+        if (this.template?.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');
+                    }
+                }
+            });
+        });
+    };
     textFor(value) {
         return this.localization.get(value);
     }
@@ -320,17 +336,16 @@ export class PagerComponent {
             this.renderer.addClass(elem, classes.toAdd);
         }
     }
-}
-PagerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PagerComponent, deps: [{ token: i1.PagerContextService }, { token: i0.ElementRef }, { token: i2.LocalizationService }, { token: i0.Renderer2 }, { token: i0.NgZone }, { token: i3.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: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PagerComponent, deps: [{ token: i1.PagerContextService }, { token: i0.ElementRef }, { token: i2.LocalizationService }, { token: i0.Renderer2 }, { token: i0.NgZone }, { token: i3.PagerNavigationService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", 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"
@@ -391,7 +406,8 @@ PagerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version
         </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: [{
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PagerComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kendo-datapager',

package/{esm2020 → esm2022}/pager/pager.module.mjs

@@ -23,15 +23,15 @@ import * as i10 from "./pager.component";
  * @hidden
  */
 export 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: [i1.CustomMessagesComponent, i2.PagerFocusableDirective, i3.PagerInfoComponent, i4.PagerInputComponent, i5.PagerNextButtonsComponent, i6.PagerNumericButtonsComponent, i7.PagerPageSizesComponent, i8.PagerPrevButtonsComponent, i9.PagerTemplateDirective, i10.PagerComponent], exports: [i1.CustomMessagesComponent, i2.PagerFocusableDirective, i3.PagerInfoComponent, i4.PagerInputComponent, i5.PagerNextButtonsComponent, i6.PagerNumericButtonsComponent, i7.PagerPageSizesComponent, i8.PagerPrevButtonsComponent, i9.PagerTemplateDirective, i10.PagerComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PagerModule, providers: [
+            IconsService,
+            PopupService,
+            ResizeBatchService
+        ], imports: [i4.PagerInputComponent, i5.PagerNextButtonsComponent, i6.PagerNumericButtonsComponent, i7.PagerPageSizesComponent, i8.PagerPrevButtonsComponent, i10.PagerComponent] });
 }
-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: [i1.CustomMessagesComponent, i2.PagerFocusableDirective, i3.PagerInfoComponent, i4.PagerInputComponent, i5.PagerNextButtonsComponent, i6.PagerNumericButtonsComponent, i7.PagerPageSizesComponent, i8.PagerPrevButtonsComponent, i9.PagerTemplateDirective, i10.PagerComponent], exports: [i1.CustomMessagesComponent, i2.PagerFocusableDirective, i3.PagerInfoComponent, i4.PagerInputComponent, i5.PagerNextButtonsComponent, i6.PagerNumericButtonsComponent, i7.PagerPageSizesComponent, i8.PagerPrevButtonsComponent, i9.PagerTemplateDirective, i10.PagerComponent] });
-PagerModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PagerModule, providers: [
-        IconsService,
-        PopupService,
-        ResizeBatchService
-    ], imports: [i1.CustomMessagesComponent, i3.PagerInfoComponent, i4.PagerInputComponent, i5.PagerNextButtonsComponent, i6.PagerNumericButtonsComponent, i7.PagerPageSizesComponent, i8.PagerPrevButtonsComponent, i10.PagerComponent] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PagerModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PagerModule, decorators: [{
             type: NgModule,
             args: [{
                     exports: [...KENDO_PAGER],

package/{esm2020 → esm2022}/pager/pagesizechange-event.mjs

@@ -8,6 +8,10 @@ import { PreventableEvent } from './preventable-event';
  * is changed from the UI. If you cancel the event, the change is prevented.
  */
 export class PageSizeChangeEvent extends PreventableEvent {
+    /**
+     * The newly selected page size.
+     */
+    newPageSize;
     /**
      * Constructs the event arguments for the `pageSizeChange` event.
      * @param newPageSize - The newly selected page size.

package/{esm2020 → esm2022}/pager/preventable-event.mjs

@@ -6,9 +6,7 @@
  * @hidden
  */
 export class PreventableEvent {
-    constructor() {
-        this.prevented = false;
-    }
+    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.