@progress/kendo-angular-pager
Version:
Kendo UI Angular Pager
141 lines (140 loc) • 6.36 kB
JavaScript
/**-----------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the project root for more information
*-------------------------------------------------------------------------------------------*/
// eslint-disable no-access-missing-member
import { Component, ChangeDetectionStrategy, ChangeDetectorRef, Input } from '@angular/core';
import { PagerContextService } from "./pager-context.service";
import { PagerElementComponent } from './pager-element.component';
import { LocalizationService } from '@progress/kendo-angular-l10n';
import { DEFAULT_SIZE } from '../util';
import { PagerFocusableDirective } from './focusable.directive';
import { ButtonComponent } from '@progress/kendo-angular-buttons';
import * as i0 from "@angular/core";
import * as i1 from "@progress/kendo-angular-l10n";
import * as i2 from "./pager-context.service";
/**
* Represents the Kendo UI Pager Previous Buttons component for Angular. Displays buttons for navigating to the first and to the previous page ([see example]({% slug pager_settings %})).
*
* @example
* ```html
* <kendo-pager [skip]="skip" [pageSize]="pageSize" [total]="total">
* <ng-template kendoPagerTemplate>
* <kendo-pager-prev-buttons></kendo-pager-prev-buttons>
* </ng-template>
* </kendo-pager>
* ```
*/
export class PagerPrevButtonsComponent extends PagerElementComponent {
constructor(localization, pagerContext, cd) {
super(localization, pagerContext, cd);
}
/**
* Specifies the padding of the navigation buttons.
*
* @default 'medium'
*/
size = DEFAULT_SIZE;
/**
* @hidden
*
* @readonly
* @type {boolean}
* @memberOf PagerPrevButtonsComponent
*/
get disabled() {
return this.currentPage === 1 || !this.total;
}
/**
* @hidden
*/
onClick(isFirst = false) {
if (this.disabled) {
return false;
}
const targetPage = isFirst ? 0 : this.currentPage - 2;
return this.currentPage !== 1 ? this.changePage(targetPage) : false;
}
onChanges({ total, skip, pageSize }) {
this.total = total;
this.skip = skip;
this.pageSize = pageSize;
this.cd.markForCheck();
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PagerPrevButtonsComponent, deps: [{ token: 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, kendo-pager-prev-buttons", inputs: { size: "size" }, usesInheritance: true, ngImport: i0, template: `
<button
type="button" kendoButton
kendoPagerFocusable
class="k-pager-nav k-pager-first"
[]="disabled"
[]="disabled"
[]="prevArrowIcons[0]"
[]="prevArrowSVGIcons[0]"
fillMode="flat"
rounded="none"
[]="size"
[]="textFor('firstPage')"
[]="textFor('firstPage')"
(click)="onClick(true)">
</button>
<button
type="button" kendoButton
kendoPagerFocusable
class="k-pager-nav"
[]="disabled"
[]="disabled"
[]="prevArrowIcons[1]"
[]="prevArrowSVGIcons[1]"
fillMode="flat"
rounded="none"
[]="size"
[]="textFor('previousPage')"
[]="textFor('previousPage')"
(click)="onClick()">
</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: "16.2.12", ngImport: i0, type: PagerPrevButtonsComponent, decorators: [{
type: Component,
args: [{
changeDetection: ChangeDetectionStrategy.OnPush,
selector: 'kendo-datapager-prev-buttons, kendo-pager-prev-buttons',
template: `
<button
type="button" kendoButton
kendoPagerFocusable
class="k-pager-nav k-pager-first"
[]="disabled"
[]="disabled"
[]="prevArrowIcons[0]"
[]="prevArrowSVGIcons[0]"
fillMode="flat"
rounded="none"
[]="size"
[]="textFor('firstPage')"
[]="textFor('firstPage')"
(click)="onClick(true)">
</button>
<button
type="button" kendoButton
kendoPagerFocusable
class="k-pager-nav"
[]="disabled"
[]="disabled"
[]="prevArrowIcons[1]"
[]="prevArrowSVGIcons[1]"
fillMode="flat"
rounded="none"
[]="size"
[]="textFor('previousPage')"
[]="textFor('previousPage')"
(click)="onClick()">
</button>
`,
standalone: true,
imports: [ButtonComponent, PagerFocusableDirective]
}]
}], ctorParameters: function () { return [{ type: i1.LocalizationService }, { type: i2.PagerContextService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { size: [{
type: Input
}] } });