@progress/kendo-angular-treelist 3.1.3-dev.202110041229

package/dist/es2015/pager/pager-numeric-buttons.component.js

@@ -0,0 +1,152 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import * as tslib_1 from "tslib";
+import { ChangeDetectionStrategy, ChangeDetectorRef, Component, HostBinding, Input } from '@angular/core';
+import { LocalizationService } from '@progress/kendo-angular-l10n';
+import { PagerContextService } from './pager-context.service';
+import { PagerElementComponent } from './pager-element.component';
+/**
+ * Displays numeric buttons to enable navigation between the pages.
+ */
+let PagerNumericButtonsComponent = class PagerNumericButtonsComponent extends PagerElementComponent {
+    constructor(localization, cd, pagerContext) {
+        super(localization, pagerContext, cd);
+        this.pagerContext = pagerContext;
+        this.numbersWrapClass = true;
+    }
+    /**
+     * @hidden
+     *
+     * @readonly
+     * @type {number[]}
+     * @memberOf PagerNumericButtonsComponent
+     */
+    get buttons() {
+        let 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;
+    }
+    /**
+     * @hidden
+     */
+    pageLabel(num) {
+        const pageText = this.textFor('pagerPage');
+        if (pageText) {
+            return pageText + ' ' + num;
+        }
+        return num.toString();
+    }
+    /**
+     * @hidden
+     */
+    onSelectChange(e) {
+        const target = e.target;
+        const valueAsNumber = Number(target.value);
+        if (!Number.isNaN(valueAsNumber)) {
+            this.changePage(valueAsNumber - 1);
+        }
+        else {
+            if (target.value === 'previousButtons') {
+                this.changePage(this.start - 2);
+            }
+            else {
+                this.changePage(this.end);
+            }
+        }
+    }
+    onChanges({ total, skip, pageSize }) {
+        this.total = total;
+        this.skip = skip;
+        this.pageSize = pageSize;
+        this.cd.markForCheck();
+    }
+};
+tslib_1.__decorate([
+    HostBinding('class.k-pager-numbers-wrap'),
+    tslib_1.__metadata("design:type", Boolean)
+], PagerNumericButtonsComponent.prototype, "numbersWrapClass", void 0);
+tslib_1.__decorate([
+    Input(),
+    tslib_1.__metadata("design:type", Number)
+], PagerNumericButtonsComponent.prototype, "buttonCount", void 0);
+PagerNumericButtonsComponent = tslib_1.__decorate([
+    Component({
+        changeDetection: ChangeDetectionStrategy.OnPush,
+        selector: 'kendo-treelist-pager-numeric-buttons',
+        template: `
+       <select
+            class="k-dropdown"
+            [value]="(currentPage).toString()"
+            (change)="onSelectChange($event)">
+            <option *ngIf="start > 1"
+                class="k-link"
+                value="previousButtons"
+                [attr.aria-label]="pageLabel(start - 1)">...
+            </option>
+            <option *ngFor="let num of buttons"
+                [value]="num.toString()"
+                [attr.aria-label]="pageLabel(num)"
+                [attr.aria-current]="currentPage == num ? 'page' : undefined"
+                [ngClass]="{'k-link': true, 'k-state-selected':currentPage == num}">
+                {{num}}
+            </option>
+            <option *ngIf="end < totalPages"
+                value="nextButtons"
+                class="k-link"
+                [attr.aria-label]="pageLabel(end + 1)">...
+            </option>
+        </select>
+        <ul [ngClass]="{'k-pager-numbers': true, 'k-reset': true}">
+            <li *ngIf="start > 1">
+                <a  class="k-link"
+                    [attr.aria-label]="pageLabel(start - 1)"
+                    href="#"
+                    tabindex="-1"
+                    (click)="changePage(start - 2)">...</a>
+            </li>
+            <li *ngFor="let num of buttons">
+                <a  href="#"
+                    [attr.aria-label]="pageLabel(num)"
+                    tabindex="-1"
+                    [ngClass]="{'k-link': true, 'k-state-selected':currentPage == num}"
+                    (click)="changePage(num - 1)">
+                    {{num}}
+                </a>
+            </li>
+            <li *ngIf="end < totalPages">
+                <a  class="k-link"
+                    [attr.aria-label]="pageLabel(end + 1)"
+                    href="#"
+                    tabindex="-1"
+                    (click)="changePage(end)">...</a>
+            </li>
+        </ul>
+    `
+    }),
+    tslib_1.__metadata("design:paramtypes", [LocalizationService,
+        ChangeDetectorRef,
+        PagerContextService])
+], PagerNumericButtonsComponent);
+export { PagerNumericButtonsComponent };

package/dist/es2015/pager/pager-page-sizes.component.d.ts

@@ -0,0 +1,49 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { ChangeDetectorRef } from '@angular/core';
+import { PagerElementComponent } from './pager-element.component';
+import { LocalizationService } from '@progress/kendo-angular-l10n';
+import { PagerContextService, PagerContextChanges } from "./pager-context.service";
+import { PageSizeItem } from './pagesize-item.interface';
+/**
+ * Displays a drop-down list for the page size selection ([see example]({% slug paging_treelist %}#toc-pager-templates)).
+ */
+export declare class PagerPageSizesComponent extends PagerElementComponent {
+    protected pagerContext: PagerContextService;
+    /**
+    * The page sizes collection. Can be an Array of numbers and/or PageSizeItem objects.
+    *
+    * {% meta height:500 %}
+    * {% embed_file configuration/pager-template-page-sizes/app.component.ts preview %}
+    * {% embed_file configuration/pager-template-page-sizes/app.module.ts %}
+    * {% embed_file shared/filesystem.ts %}
+    * {% embed_file shared/main.ts %}
+    * {% endmeta %}
+    */
+    pageSizes: Array<PageSizeItem | number>;
+    /**
+     * @hidden
+     *
+     * @readonly
+     */
+    readonly classes: boolean;
+    /**
+     * @hidden
+     *
+     * @readonly
+     */
+    readonly showInitialPageSize: boolean;
+    private _pageSizes;
+    constructor(localization: LocalizationService, cd: ChangeDetectorRef, pagerContext: PagerContextService);
+    /**
+     * @hidden
+     */
+    pageSizeChange(value: any): void;
+    /**
+     * @hidden
+     */
+    getValue(page: PageSizeItem): number;
+    protected onChanges({ total, skip, pageSize }: PagerContextChanges): void;
+}

package/dist/es2015/pager/pager-page-sizes.component.js

@@ -0,0 +1,125 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import * as tslib_1 from "tslib";
+// tslint:disable:no-access-missing-member
+import { Component, ChangeDetectorRef, ChangeDetectionStrategy, HostBinding, Input } from '@angular/core';
+import { PagerElementComponent } from './pager-element.component';
+import { LocalizationService } from '@progress/kendo-angular-l10n';
+import { PagerContextService } from "./pager-context.service";
+/**
+ * Displays a drop-down list for the page size selection ([see example]({% slug paging_treelist %}#toc-pager-templates)).
+ */
+let PagerPageSizesComponent = class PagerPageSizesComponent extends PagerElementComponent {
+    constructor(localization, cd, pagerContext) {
+        super(localization, pagerContext, cd);
+        this.pagerContext = pagerContext;
+        this._pageSizes = [];
+    }
+    get pageSizes() {
+        return this._pageSizes;
+    }
+    /**
+     * The page sizes collection. Can be an Array of numbers and/or PageSizeItem objects.
+     *
+     * {% meta height:500 %}
+     * {% embed_file configuration/pager-template-page-sizes/app.component.ts preview %}
+     * {% embed_file configuration/pager-template-page-sizes/app.module.ts %}
+     * {% embed_file shared/filesystem.ts %}
+     * {% embed_file shared/main.ts %}
+     * {% endmeta %}
+     */
+    set pageSizes(pageSizes) {
+        let normalizedItems = [];
+        pageSizes.forEach(item => {
+            if (typeof item === 'number') {
+                normalizedItems.push({
+                    text: item.toString(),
+                    value: item
+                });
+            }
+            else {
+                normalizedItems.push(item);
+            }
+        });
+        if (this.pageSize && !normalizedItems.some(item => item.value === this.pageSize)) {
+            normalizedItems = [{ text: this.pageSize.toString(), value: this.pageSize }, ...normalizedItems];
+        }
+        this._pageSizes = normalizedItems;
+    }
+    /**
+     * @hidden
+     *
+     * @readonly
+     */
+    get classes() {
+        return true;
+    }
+    /**
+     * @hidden
+     *
+     * @readonly
+     */
+    get showInitialPageSize() {
+        return this.pageSizes
+            .filter(item => {
+            if (typeof item.value === 'number') {
+                return item.value === Number(this.pageSize);
+            }
+            return this.total === Number(this.pageSize);
+        })
+            .length === 0;
+    }
+    /**
+     * @hidden
+     */
+    pageSizeChange(value) {
+        this.pageSize = typeof value === 'number' ? value : this.total;
+        this.pagerContext.changePageSize(this.pageSize);
+    }
+    /**
+     * @hidden
+     */
+    getValue(page) {
+        return typeof page.value === 'number' ? page.value : this.total;
+    }
+    onChanges({ total, skip, pageSize }) {
+        this.total = total;
+        this.skip = skip;
+        this.pageSize = typeof pageSize === 'number' ? pageSize : this.total;
+        this.cd.markForCheck();
+    }
+};
+tslib_1.__decorate([
+    Input(),
+    tslib_1.__metadata("design:type", Array),
+    tslib_1.__metadata("design:paramtypes", [Array])
+], PagerPageSizesComponent.prototype, "pageSizes", null);
+tslib_1.__decorate([
+    HostBinding("class.k-pager-sizes"),
+    HostBinding("class.k-label"),
+    tslib_1.__metadata("design:type", Boolean),
+    tslib_1.__metadata("design:paramtypes", [])
+], PagerPageSizesComponent.prototype, "classes", null);
+PagerPageSizesComponent = tslib_1.__decorate([
+    Component({
+        changeDetection: ChangeDetectionStrategy.OnPush,
+        selector: 'kendo-treelist-pager-page-sizes',
+        template: `
+        <kendo-dropdownlist
+            #dropdownlist
+            [data]="pageSizes"
+            textField="text"
+            valueField="value"
+            [valuePrimitive]="true"
+            [value]="pageSize"
+            (valueChange)="pageSizeChange($event)"></kendo-dropdownlist>
+        <kendo-label [for]="dropdownlist" [text]="textFor('pagerItemsPerPage')"></kendo-label>
+    `
+    }),
+    tslib_1.__metadata("design:paramtypes", [LocalizationService,
+        ChangeDetectorRef,
+        PagerContextService])
+], PagerPageSizesComponent);
+export { PagerPageSizesComponent };

package/dist/es2015/pager/pager-prev-buttons.component.d.ts

@@ -0,0 +1,23 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { ChangeDetectorRef } from '@angular/core';
+import { PagerContextService, PagerContextChanges } from "./pager-context.service";
+import { PagerElementComponent } from './pager-element.component';
+import { LocalizationService } from '@progress/kendo-angular-l10n';
+/**
+ * Displays buttons for navigating to the first and to the previous page ([see example]({% slug paging_treelist %}#toc-pager-templates)).
+ */
+export declare class PagerPrevButtonsComponent extends PagerElementComponent {
+    constructor(localization: LocalizationService, pagerContext: PagerContextService, cd: ChangeDetectorRef);
+    /**
+     * @hidden
+     *
+     * @readonly
+     * @type {boolean}
+     * @memberOf PagerPrevButtonsComponent
+     */
+    readonly disabled: boolean;
+    protected onChanges({ total, skip, pageSize }: PagerContextChanges): void;
+}

package/dist/es2015/pager/pager-prev-buttons.component.js

@@ -0,0 +1,80 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import * as tslib_1 from "tslib";
+// tslint:disable:no-access-missing-member
+import { Component, ChangeDetectionStrategy, ChangeDetectorRef } from '@angular/core';
+import { PagerContextService } from "./pager-context.service";
+import { PagerElementComponent } from './pager-element.component';
+import { LocalizationService } from '@progress/kendo-angular-l10n';
+/**
+ * Displays buttons for navigating to the first and to the previous page ([see example]({% slug paging_treelist %}#toc-pager-templates)).
+ */
+let PagerPrevButtonsComponent = class PagerPrevButtonsComponent extends PagerElementComponent {
+    constructor(localization, pagerContext, cd) {
+        super(localization, pagerContext, cd);
+    }
+    /**
+     * @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 = tslib_1.__decorate([
+    Component({
+        changeDetection: ChangeDetectionStrategy.OnPush,
+        selector: 'kendo-treelist-pager-prev-buttons',
+        template: `
+        <a  href="#"
+            tabindex="-1"
+            [title]="textFor('pagerFirstPage')"
+            (click)="currentPage !== 1 ? changePage(0) : false"
+            [ngClass]="{
+                'k-link': true,
+                'k-pager-nav': true,
+                'k-state-disabled': disabled,
+                'k-pager-first': true
+            }">
+            <span [attr.aria-label]="textFor('pagerFirstPage')"
+                [ngClass]="{
+                    'k-icon':true,
+                    'k-i-seek-w': true
+                }">
+            </span>
+        </a>
+        <a  href="#"
+            tabindex="-1"
+            [title]="textFor('pagerPreviousPage')"
+            (click)="currentPage !== 1 ? changePage(currentPage-2) : false"
+            [ngClass]="{
+                'k-link': true,
+                'k-pager-nav': true,
+                'k-state-disabled': disabled,
+                '': true
+            }">
+            <span [attr.aria-label]="textFor('pagerPreviousPage')"
+                [ngClass]="{
+                    'k-icon':true,
+                    'k-i-arrow-w': true
+                }">
+            </span>
+        </a>
+    `
+    }),
+    tslib_1.__metadata("design:paramtypes", [LocalizationService,
+        PagerContextService,
+        ChangeDetectorRef])
+], PagerPrevButtonsComponent);
+export { PagerPrevButtonsComponent };

package/dist/es2015/pager/pager-settings.d.ts

@@ -0,0 +1,85 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+/**
+ * The type of the TreeList pager.
+ *
+ * The available values are:
+ * * `numeric`—Buttons with numbers.
+ * * `input`—Input for typing the page number.
+ *
+ * @example
+ * ```html-no-run
+ *
+ * <kendo-treelist
+ *    [pageable]="{
+ *        type: 'numeric'
+ *    }">
+ * </kendo-treelist>
+ * ```
+ */
+export declare type PagerType = 'numeric' | 'input';
+/**
+ * The pager settings of the TreeList.
+ *
+ * @example
+ * ```html-no-run
+ *
+ * <kendo-treelist
+ *    [pageable]="{
+ *        buttonCount: 2,
+ *        info: false
+ *    }">
+ * </kendo-treelist>
+ * ```
+ */
+export interface PagerSettings {
+    /**
+     * Sets the maximum numeric buttons count before the buttons are collapsed.
+     *
+     * @default 10
+     */
+    buttonCount?: number;
+    /**
+     * A flag that indicates if child nodes should be fetched and counted for the pager total.
+     *
+     * @default true
+     */
+    countChildren?: boolean;
+    /**
+     * Toggles the information about the current page and the total number of records.
+     *
+     * @default true
+     */
+    info?: boolean;
+    /**
+     * Defines the type of the TreeList pager.
+     *
+     * @default 'numeric'
+     */
+    type?: PagerType;
+    /**
+     * Shows a menu for selecting the page size.
+     *
+     * @default false
+     */
+    pageSizes?: boolean | Array<number>;
+    /**
+     * Toggles the **Previous** and **Next** buttons.
+     *
+     * @default true
+     */
+    previousNext?: boolean;
+    /**
+     * Toggles the built-in responsive behavior of the Pager.
+     * Available in version `3.0.0` and above ([see example]({% slug paging_treelist %})).
+     *
+     * @default true
+     */
+    responsive?: boolean;
+}
+/**
+ * @hidden
+ */
+export declare const normalize: (settings: any) => any;

package/dist/es2015/pager/pager-settings.js

@@ -0,0 +1,21 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+/**
+ * @hidden
+ */
+const normalizeSettings = ({ buttonCount = 10, info = true, type = 'numeric', pageSizes = false, previousNext = true, responsive = true }) => ({
+    buttonCount,
+    info,
+    pageSizes: pageSizes === true ? [5, 10, 20] : pageSizes,
+    previousNext,
+    type,
+    responsive
+});
+const ɵ0 = normalizeSettings;
+/**
+ * @hidden
+ */
+export const normalize = (settings) => normalizeSettings(settings === true ? {} : settings);
+export { ɵ0 };

package/dist/es2015/pager/pager-template.directive.d.ts

@@ -0,0 +1,27 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { TemplateRef } from '@angular/core';
+/**
+ * Represents the pager template which helps to customize the pager appearance in the TreeList. To define a pager
+ * template, nest an `<ng-template>` tag with the `kendoTreeListPagerTemplate` directive inside `<kendo-treelist>`.
+ *
+ * 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.
+ *
+ * {% meta height:470 %}
+ * {% embed_file configuration/pager-template-all/app.component.ts preview %}
+ * {% embed_file configuration/pager-template-all/app.module.ts %}
+ * {% embed_file shared/main.ts %}
+ * {% embed_file shared/filesystem.ts %}
+ * {% endmeta %}
+ */
+export declare class PagerTemplateDirective {
+    templateRef: TemplateRef<any>;
+    constructor(templateRef: TemplateRef<any>);
+}

package/dist/es2015/pager/pager-template.directive.js

@@ -0,0 +1,37 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import * as tslib_1 from "tslib";
+import { Directive, TemplateRef, Optional } from '@angular/core';
+/**
+ * Represents the pager template which helps to customize the pager appearance in the TreeList. To define a pager
+ * template, nest an `<ng-template>` tag with the `kendoTreeListPagerTemplate` directive inside `<kendo-treelist>`.
+ *
+ * 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.
+ *
+ * {% meta height:470 %}
+ * {% embed_file configuration/pager-template-all/app.component.ts preview %}
+ * {% embed_file configuration/pager-template-all/app.module.ts %}
+ * {% embed_file shared/main.ts %}
+ * {% embed_file shared/filesystem.ts %}
+ * {% endmeta %}
+ */
+let PagerTemplateDirective = class PagerTemplateDirective {
+    constructor(templateRef) {
+        this.templateRef = templateRef;
+    }
+};
+PagerTemplateDirective = tslib_1.__decorate([
+    Directive({
+        selector: '[kendoTreeListPagerTemplate]'
+    }),
+    tslib_1.__param(0, Optional()),
+    tslib_1.__metadata("design:paramtypes", [TemplateRef])
+], PagerTemplateDirective);
+export { PagerTemplateDirective };

package/dist/es2015/pager/pager.component.d.ts

@@ -0,0 +1,40 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { EventEmitter, OnChanges, SimpleChanges, OnInit, OnDestroy, ElementRef, Renderer2 } from '@angular/core';
+import { PagerSettings } from './pager-settings';
+import { PageChangeEvent } from '../data/change-event-args.interface';
+import { PagerTemplateDirective } from "./pager-template.directive";
+import { PagerContextService } from "./pager-context.service";
+/**
+ * @hidden
+ */
+export declare class PagerComponent implements OnChanges, OnInit, OnDestroy {
+    private pagerContext;
+    private element;
+    private renderer;
+    allCount: number;
+    total: number;
+    skip: number;
+    pageSize: number;
+    options: PagerSettings | boolean;
+    template: PagerTemplateDirective;
+    pageChange: EventEmitter<PageChangeEvent>;
+    pagerWrapClass: boolean;
+    gridPagerClass: boolean;
+    widgetClass: boolean;
+    settings: PagerSettings;
+    readonly totalPages: number;
+    readonly currentPage: number;
+    readonly templateContext: any;
+    private subscriptions;
+    private _templateContext;
+    constructor(pagerContext: PagerContextService, element: ElementRef, renderer: Renderer2);
+    ngOnInit(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    ngOnDestroy(): void;
+    changePage(event: PageChangeEvent): void;
+    resizeHandler: () => void;
+    private clearResponsiveClasses;
+}