@progress/kendo-angular-listview 3.0.2 → 4.0.0-next.202204010900

package/dist/npm/listview.component.js

@@ -1,536 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2021 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var tslib_1 = require("tslib");
-var core_1 = require("@angular/core");
-var kendo_angular_common_1 = require("@progress/kendo-angular-common");
-var kendo_licensing_1 = require("@progress/kendo-licensing");
-var package_metadata_1 = require("./package-metadata");
-var kendo_angular_l10n_1 = require("@progress/kendo-angular-l10n");
-var navigation_service_1 = require("./navigation/navigation.service");
-var listview_navigable_item_directive_1 = require("./navigation/listview-navigable-item.directive");
-var item_template_directive_1 = require("./templates/item-template.directive");
-var header_template_directive_1 = require("./templates/header-template.directive");
-var footer_template_directive_1 = require("./templates/footer-template.directive");
-var loader_template_directive_1 = require("./templates/loader-template.directive");
-var edit_template_directive_1 = require("./editing/edit-template.directive");
-var edit_service_1 = require("./editing/edit.service");
-var utils_1 = require("./utils");
-var forms_1 = require("@angular/forms");
-var DEFAULT_PAGER_SETTINGS = {
-    position: 'bottom',
-    buttonCount: 5,
-    info: true,
-    previousNext: true,
-    type: 'numeric',
-    pageSizeValues: [5, 10, 20]
-};
-var createControl = function (source) { return function (acc, key) {
-    acc[key] = new forms_1.FormControl(source[key]);
-    return acc;
-}; };
-var ɵ0 = createControl;
-exports.ɵ0 = ɵ0;
-/**
- * Represents the Kendo UI ListView component for Angular.
- */
-var ListViewComponent = /** @class */ (function () {
-    function ListViewComponent(ngZone, element, renderer, editService, navigationService) {
-        this.ngZone = ngZone;
-        this.element = element;
-        this.renderer = renderer;
-        this.editService = editService;
-        this.navigationService = navigationService;
-        /**
-         * @hidden
-         */
-        this.className = true;
-        /**
-         * Specifies if the loading indicator of the ListView will be displayed
-         * ([see example]({% slug paging_listview %}#toc-remote-binding)).
-         */
-        this.loading = false;
-        /**
-         * Specifies the content container `role` attribute
-         * ([more details]({% slug accessibility_listview %}#toc-wai-aria-support)).
-         * By default, the container `role` is set to `listbox`.
-         */
-        this.containerRole = 'listbox';
-        /**
-         * Specifies the list item `role` attribute
-         * ([more details]({% slug accessibility_listview %}#toc-wai-aria-support)).
-         * By default, the list item `role` is set to `option`.
-         */
-        this.listItemRole = 'option';
-        /**
-         * Fires when the user scrolls to the last record on the page
-         * ([see endless scrolling example]({% slug scrollmodes_listview %}#toc-endless-scrolling)).
-         */
-        this.scrollBottom = new core_1.EventEmitter();
-        /**
-         * Fires when the page or the page size of the ListView is changed
-         * ([see example]({% slug paging_listview %}#toc-remote-binding)).
-         * You have to handle the event yourself and page the data.
-         */
-        this.pageChange = new core_1.EventEmitter();
-        /**
-         * Fires when the page size of the ListView is changed. This event can be prevented (`$event.preventDefault()`).
-         * If not prevented, the `pageChange` event will be fired subsequently.
-         */
-        this.pageSizeChange = new core_1.EventEmitter();
-        /**
-         * Fires when the user clicks the **Edit** command button to edit an item
-         * ([see example]({% slug editing_template_forms_listview %}#toc-editing-records)).
-         */
-        this.edit = new core_1.EventEmitter();
-        /**
-         * Fires when the user clicks the **Cancel** command button to close an item
-         * ([see example]({% slug editing_template_forms_listview %}#toc-cancelling-editing)).
-         */
-        this.cancel = new core_1.EventEmitter();
-        /**
-         * Fires when the user clicks the **Save** command button to save changes in an item
-         * ([see example]({% slug editing_template_forms_listview %}#toc-saving-records)).
-         */
-        this.save = new core_1.EventEmitter();
-        /**
-         * Fires when the user clicks the **Remove** command button to remove an item
-         * ([see example]({% slug editing_template_forms_listview %}#toc-removing-records)).
-         */
-        this.remove = new core_1.EventEmitter();
-        /**
-         * Fires when the user clicks the **Add** command button to add a new item
-         * ([see example]({% slug editing_template_forms_listview %}#toc-adding-records)).
-         */
-        this.add = new core_1.EventEmitter();
-        this._skip = 0;
-        this._navigable = false;
-        kendo_licensing_1.validatePackage(package_metadata_1.packageMetadata);
-        this.attachEditHandlers();
-    }
-    Object.defineProperty(ListViewComponent.prototype, "navigable", {
-        get: function () {
-            return this._navigable;
-        },
-        /**
-         * Specifies whether the keyboard navigation is enabled
-         * ([see example]({% slug keyboard_navigation_listview %})).
-         * By default, the navigation is disabled.
-         */
-        set: function (navigable) {
-            if (!navigable && utils_1.isPresent(this.removeNavigationListeners)) {
-                this.removeNavigationListeners();
-                this.removeNavigationListeners = null;
-                this.navigationService.isEnabled = false;
-            }
-            else if (navigable && !utils_1.isPresent(this.removeNavigationListeners)) {
-                this.addNavigationListeners();
-                this.navigationService.isEnabled = true;
-            }
-            this._navigable = navigable;
-        },
-        enumerable: true,
-        configurable: true
-    });
-    Object.defineProperty(ListViewComponent.prototype, "skip", {
-        get: function () {
-            return this._skip;
-        },
-        /**
-         * Defines the number of records to be skipped by the pager
-         * ([more details]({% slug paging_listview %})).
-         */
-        set: function (skip) {
-            var parsed = parseInt(skip, 10);
-            var defaultSkipValue = 0;
-            this._skip = !isNaN(parsed) ? parsed : defaultSkipValue;
-        },
-        enumerable: true,
-        configurable: true
-    });
-    Object.defineProperty(ListViewComponent.prototype, "pageable", {
-        get: function () {
-            return this._pageable;
-        },
-        /**
-         * Configures whether the ListView will render a pager
-         * ([more details]({% slug paging_listview %})).
-         * Providing a boolean value will render a pager with the default settings.
-         */
-        set: function (pageable) {
-            this._pageable = pageable;
-            this.pagerSettings = pageable ? Object.assign({}, DEFAULT_PAGER_SETTINGS, pageable) : null;
-        },
-        enumerable: true,
-        configurable: true
-    });
-    Object.defineProperty(ListViewComponent.prototype, "items", {
-        /**
-         * @hidden
-         *
-         * Gets the data items passed to the ListView.
-         * If a ListViewDataResult is passed, the data value is used. If an array is passed - it's directly used.
-         */
-        get: function () {
-            if (!utils_1.isPresent(this.data)) {
-                return [];
-            }
-            return Array.isArray(this.data) ? this.data : this.data.data;
-        },
-        enumerable: true,
-        configurable: true
-    });
-    Object.defineProperty(ListViewComponent.prototype, "total", {
-        /**
-         * @hidden
-         *
-         * Gets the total number of records passed to the ListView.
-         * If a ListViewDataResult is passed, the total value is used. If an array is passed - its length is used.
-         */
-        get: function () {
-            if (!utils_1.isPresent(this.data)) {
-                return 0;
-            }
-            return Array.isArray(this.data) ? this.data.length : this.data.total;
-        },
-        enumerable: true,
-        configurable: true
-    });
-    Object.defineProperty(ListViewComponent.prototype, "containerTabindex", {
-        /**
-         * @hidden
-         */
-        get: function () {
-            // workaround for FF, where a scrollable container is focusable even without a tabindex and creates an unwanted tab stop
-            // https://bugzilla.mozilla.org/show_bug.cgi?id=616594
-            return this.navigable ? -1 : null;
-        },
-        enumerable: true,
-        configurable: true
-    });
-    Object.defineProperty(ListViewComponent.prototype, "activeIndex", {
-        /**
-         * Gets the current active item index
-         * ([see example]({% slug keyboard_navigation_listview %}#toc-controlling-the-focus)).
-         * Returns `null` when the keyboard navigation is disabled.
-         */
-        get: function () {
-            return this.navigationService.activeIndex;
-        },
-        enumerable: true,
-        configurable: true
-    });
-    ListViewComponent.prototype.ngOnChanges = function (changes) {
-        if (kendo_angular_common_1.isChanged('height', changes, false)) {
-            this.renderer.setStyle(this.element.nativeElement, 'height', this.height + "px");
-        }
-    };
-    ListViewComponent.prototype.ngOnDestroy = function () {
-        if (utils_1.isPresent(this.editServiceSubscription)) {
-            this.editServiceSubscription.unsubscribe();
-        }
-    };
-    /**
-     * @hidden
-     */
-    ListViewComponent.prototype.templateContext = function (index) {
-        return {
-            "$implicit": this.items[index],
-            "isLast": index === this.items.length - 1,
-            "isFirst": index === 0,
-            "dataItem": this.items[index],
-            "index": index
-        };
-    };
-    /**
-     * @hidden
-     */
-    ListViewComponent.prototype.editTemplateContext = function (index) {
-        var isNew = index === -1;
-        var group = isNew ? this.editService.newItemGroup : this.editService.editGroup(index);
-        return {
-            "$implicit": group,
-            "formGroup": group,
-            "dataItem": isNew ? this.editService.newDataItem : this.items[index],
-            "isNew": isNew,
-            "index": index
-        };
-    };
-    /**
-     * Focuses the item at the specified index ([see example]({% slug keyboard_navigation_listview %}#toc-controlling-the-focus)):
-     * - If no index is specified, the current active index will be focused.
-     * - If the passed value is below `0`, the first item receives focus.
-     * - If the passed value is above the last available index, the last item receives focus.
-     *
-     * > The index param is based on the logical structure of the ListView and does not correspond to the data item index -
-     * > i.e. the index `0` corresponds to the first rendered list item. Paging is not taken into account.
-     * > Also, for the focusing to work, the `navigable` prop must first be set to `true`.
-     */
-    ListViewComponent.prototype.focus = function (index) {
-        var totalRenderedItems = this.listViewItems.length;
-        this.navigationService.focusIndex(index, totalRenderedItems);
-    };
-    /**
-     * Creates a new item editor ([see example]({% slug editing_template_forms_listview %}#toc-adding-records)).
-     *
-     * @param {FormGroup} group - The [`FormGroup`]({{ site.data.urls.angular['formgroupapi'] }}) that describes
-     * the edit form. If called with a data item, it will build the `FormGroup` from the data item fields.
-     */
-    ListViewComponent.prototype.addItem = function (group) {
-        var isFormGroup = group instanceof forms_1.FormGroup;
-        if (!isFormGroup) {
-            var fields = Object.keys(group).reduce(createControl(group), {});
-            group = new forms_1.FormGroup(fields);
-        }
-        this.editService.addItem(group);
-    };
-    /**
-     * Switches the specified item to edit mode ([see example]({% slug editing_template_forms_listview %}#toc-editing-records)).
-     *
-     * @param index - The item index that will be switched to edit mode.
-     * @param group - The [`FormGroup`]({{ site.data.urls.angular['formgroupapi'] }})
-     * that describes the edit form.
-     */
-    ListViewComponent.prototype.editItem = function (index, group) {
-        this.editService.editItem(index, group);
-    };
-    /**
-     * Closes the editor for a given item ([see example]({% slug editing_template_forms_grid %}#toc-cancelling-editing)).
-     *
-     * @param {number} index - The item index that will be switched out of the edit mode. If no index is provided, it is assumed
-     * that the new item editor will be closed.
-     */
-    ListViewComponent.prototype.closeItem = function (index) {
-        this.editService.close(index);
-    };
-    /**
-     * @hidden
-     */
-    ListViewComponent.prototype.isEdited = function (index) {
-        return this.editService.isEdited(index);
-    };
-    /**
-     * @hidden
-     */
-    ListViewComponent.prototype.handlePageChange = function (event) {
-        this.scrollToContainerTop();
-        var firstIndex = 0;
-        this.navigationService.setActiveIndex(firstIndex);
-        this.pageChange.emit(event);
-    };
-    /**
-     * @hidden
-     */
-    ListViewComponent.prototype.handleContentScroll = function () {
-        var _this = this;
-        if (!kendo_angular_common_1.hasObservers(this.scrollBottom)) {
-            return;
-        }
-        var THRESHOLD = 2;
-        var _a = this.contentContainer.nativeElement, scrollHeight = _a.scrollHeight, scrollTop = _a.scrollTop, clientHeight = _a.clientHeight;
-        var atBottom = scrollHeight - clientHeight - scrollTop <= THRESHOLD;
-        if (atBottom) {
-            this.ngZone.run(function () {
-                var event = { sender: _this };
-                _this.scrollBottom.emit(event);
-            });
-        }
-    };
-    /**
-     * @hidden
-     */
-    ListViewComponent.prototype.itemPosInSet = function (index) {
-        // adds 1 as the aria-posinset is not zero-based and the counting starts from 1
-        return this.skip + index + 1;
-    };
-    ListViewComponent.prototype.scrollToContainerTop = function () {
-        var container = this.contentContainer.nativeElement;
-        container.scrollTop = 0;
-        container.scrollLeft = 0;
-    };
-    ListViewComponent.prototype.addNavigationListeners = function () {
-        var _this = this;
-        this.ngZone.runOutsideAngular(function () {
-            var removeKeydownListener = _this.renderer.listen(_this.contentContainer.nativeElement, 'keydown', function (event) { return _this.navigationService.handleKeyDown(event, _this.listViewItems.length); });
-            var removeFocusInListener = _this.renderer.listen(_this.contentContainer.nativeElement, 'focusin', function (event) { return _this.navigationService.handleFocusIn(event); });
-            var removeFocusOutListener = _this.renderer.listen(_this.contentContainer.nativeElement, 'focusout', function (event) { return _this.navigationService.handleFocusOut(event); });
-            _this.removeNavigationListeners = function () {
-                removeKeydownListener();
-                removeFocusInListener();
-                removeFocusOutListener();
-            };
-        });
-    };
-    ListViewComponent.prototype.attachEditHandlers = function () {
-        if (!utils_1.isPresent(this.editService)) {
-            return;
-        }
-        this.editServiceSubscription = this.editService
-            .changes.subscribe(this.emitCRUDEvent.bind(this));
-    };
-    ListViewComponent.prototype.emitCRUDEvent = function (args) {
-        var action = args.action, itemIndex = args.itemIndex, formGroup = args.formGroup;
-        var dataItem = this.items[itemIndex];
-        if (action !== 'add' && formGroup) {
-            dataItem = formGroup.value;
-        }
-        Object.assign(args, {
-            dataItem: dataItem,
-            sender: this
-        });
-        this[action].emit(args);
-    };
-    tslib_1.__decorate([
-        core_1.HostBinding('class.k-widget'),
-        core_1.HostBinding('class.k-listview'),
-        core_1.HostBinding('class.k-listview-bordered'),
-        core_1.HostBinding('class.k-d-flex'),
-        tslib_1.__metadata("design:type", Boolean)
-    ], ListViewComponent.prototype, "className", void 0);
-    tslib_1.__decorate([
-        core_1.ContentChild(item_template_directive_1.ItemTemplateDirective, { static: false }),
-        tslib_1.__metadata("design:type", item_template_directive_1.ItemTemplateDirective)
-    ], ListViewComponent.prototype, "itemTemplate", void 0);
-    tslib_1.__decorate([
-        core_1.ContentChild(header_template_directive_1.HeaderTemplateDirective, { static: false }),
-        tslib_1.__metadata("design:type", header_template_directive_1.HeaderTemplateDirective)
-    ], ListViewComponent.prototype, "headerTemplate", void 0);
-    tslib_1.__decorate([
-        core_1.ContentChild(footer_template_directive_1.FooterTemplateDirective, { static: false }),
-        tslib_1.__metadata("design:type", footer_template_directive_1.FooterTemplateDirective)
-    ], ListViewComponent.prototype, "footerTemplate", void 0);
-    tslib_1.__decorate([
-        core_1.ContentChild(loader_template_directive_1.LoaderTemplateDirective, { static: false }),
-        tslib_1.__metadata("design:type", loader_template_directive_1.LoaderTemplateDirective)
-    ], ListViewComponent.prototype, "loaderTemplate", void 0);
-    tslib_1.__decorate([
-        core_1.ViewChild('contentContainer', { static: true }),
-        tslib_1.__metadata("design:type", core_1.ElementRef)
-    ], ListViewComponent.prototype, "contentContainer", void 0);
-    tslib_1.__decorate([
-        core_1.ContentChild(edit_template_directive_1.EditTemplateDirective, { static: false }),
-        tslib_1.__metadata("design:type", edit_template_directive_1.EditTemplateDirective)
-    ], ListViewComponent.prototype, "editTemplate", void 0);
-    tslib_1.__decorate([
-        core_1.ViewChildren(listview_navigable_item_directive_1.ListViewNavigableItemDirective),
-        tslib_1.__metadata("design:type", core_1.QueryList)
-    ], ListViewComponent.prototype, "listViewItems", void 0);
-    tslib_1.__decorate([
-        core_1.Input(),
-        tslib_1.__metadata("design:type", Object)
-    ], ListViewComponent.prototype, "data", void 0);
-    tslib_1.__decorate([
-        core_1.Input(),
-        tslib_1.__metadata("design:type", Boolean)
-    ], ListViewComponent.prototype, "loading", void 0);
-    tslib_1.__decorate([
-        core_1.Input(),
-        tslib_1.__metadata("design:type", Object)
-    ], ListViewComponent.prototype, "containerStyle", void 0);
-    tslib_1.__decorate([
-        core_1.Input(),
-        tslib_1.__metadata("design:type", Object)
-    ], ListViewComponent.prototype, "itemStyle", void 0);
-    tslib_1.__decorate([
-        core_1.Input(),
-        tslib_1.__metadata("design:type", Object)
-    ], ListViewComponent.prototype, "containerClass", void 0);
-    tslib_1.__decorate([
-        core_1.Input(),
-        tslib_1.__metadata("design:type", Object)
-    ], ListViewComponent.prototype, "itemClass", void 0);
-    tslib_1.__decorate([
-        core_1.Input(),
-        tslib_1.__metadata("design:type", String)
-    ], ListViewComponent.prototype, "containerLabel", void 0);
-    tslib_1.__decorate([
-        core_1.Input(),
-        tslib_1.__metadata("design:type", String)
-    ], ListViewComponent.prototype, "containerRole", void 0);
-    tslib_1.__decorate([
-        core_1.Input(),
-        tslib_1.__metadata("design:type", String)
-    ], ListViewComponent.prototype, "listItemRole", void 0);
-    tslib_1.__decorate([
-        core_1.Input(),
-        tslib_1.__metadata("design:type", Boolean),
-        tslib_1.__metadata("design:paramtypes", [Boolean])
-    ], ListViewComponent.prototype, "navigable", null);
-    tslib_1.__decorate([
-        core_1.Input(),
-        tslib_1.__metadata("design:type", Number)
-    ], ListViewComponent.prototype, "pageSize", void 0);
-    tslib_1.__decorate([
-        core_1.Input(),
-        tslib_1.__metadata("design:type", Number),
-        tslib_1.__metadata("design:paramtypes", [Number])
-    ], ListViewComponent.prototype, "skip", null);
-    tslib_1.__decorate([
-        core_1.Input(),
-        tslib_1.__metadata("design:type", Object),
-        tslib_1.__metadata("design:paramtypes", [Object])
-    ], ListViewComponent.prototype, "pageable", null);
-    tslib_1.__decorate([
-        core_1.Input(),
-        tslib_1.__metadata("design:type", Number)
-    ], ListViewComponent.prototype, "height", void 0);
-    tslib_1.__decorate([
-        core_1.Output(),
-        tslib_1.__metadata("design:type", core_1.EventEmitter)
-    ], ListViewComponent.prototype, "scrollBottom", void 0);
-    tslib_1.__decorate([
-        core_1.Output(),
-        tslib_1.__metadata("design:type", core_1.EventEmitter)
-    ], ListViewComponent.prototype, "pageChange", void 0);
-    tslib_1.__decorate([
-        core_1.Output(),
-        tslib_1.__metadata("design:type", core_1.EventEmitter)
-    ], ListViewComponent.prototype, "pageSizeChange", void 0);
-    tslib_1.__decorate([
-        core_1.Output(),
-        tslib_1.__metadata("design:type", core_1.EventEmitter)
-    ], ListViewComponent.prototype, "edit", void 0);
-    tslib_1.__decorate([
-        core_1.Output(),
-        tslib_1.__metadata("design:type", core_1.EventEmitter)
-    ], ListViewComponent.prototype, "cancel", void 0);
-    tslib_1.__decorate([
-        core_1.Output(),
-        tslib_1.__metadata("design:type", core_1.EventEmitter)
-    ], ListViewComponent.prototype, "save", void 0);
-    tslib_1.__decorate([
-        core_1.Output(),
-        tslib_1.__metadata("design:type", core_1.EventEmitter)
-    ], ListViewComponent.prototype, "remove", void 0);
-    tslib_1.__decorate([
-        core_1.Output(),
-        tslib_1.__metadata("design:type", core_1.EventEmitter)
-    ], ListViewComponent.prototype, "add", void 0);
-    ListViewComponent = tslib_1.__decorate([
-        core_1.Component({
-            changeDetection: core_1.ChangeDetectionStrategy.OnPush,
-            exportAs: 'kendoListView',
-            selector: 'kendo-listview',
-            providers: [
-                edit_service_1.EditService,
-                navigation_service_1.NavigationService,
-                kendo_angular_l10n_1.LocalizationService,
-                {
-                    provide: kendo_angular_l10n_1.L10N_PREFIX,
-                    useValue: 'kendo.listview'
-                }
-            ],
-            template: "\n        <!-- top pager -->\n        <ng-template\n            *ngIf=\"pagerSettings?.position !== 'bottom'\"\n            [ngTemplateOutlet]=\"pagerTemplate\"\n            [ngTemplateOutletContext]=\"{ pagerClass: 'k-listview-pager k-listview-pager-top' }\"\n        >\n        </ng-template>\n\n        <!-- header -->\n        <div\n            *ngIf=\"headerTemplate\"\n            class=\"k-listview-header\"\n        >\n            <ng-template\n                [ngTemplateOutlet]=\"headerTemplate?.templateRef\"\n            >\n            </ng-template>\n        </div>\n\n        <!-- content -->\n        <div\n            #contentContainer\n            [attr.tabindex]=\"containerTabindex\"\n            class=\"k-listview-content\"\n            [ngClass]=\"containerClass\"\n            [ngStyle]=\"containerStyle\"\n            [kendoEventsOutsideAngular]=\"{\n                scroll: handleContentScroll\n            }\"\n            [scope]=\"this\"\n            [attr.role]=\"containerRole\"\n            [attr.aria-label]=\"containerLabel\"\n        >\n            <!-- new item edit template -->\n            <div\n                *ngIf=\"editService.hasNewItem\"\n                class=\"k-listview-item\"\n                [attr.role]=\"listItemRole\"\n                kendoListViewNavigableItem\n                [index]=\"-1\"\n                [attr.data-kendo-listview-item-index]=\"-1\"\n                [ngClass]=\"itemClass\"\n                [ngStyle]=\"itemStyle\"\n            >\n                <ng-template\n                    *ngIf=\"editTemplate\"\n                    [ngTemplateOutlet]=\"editTemplate?.templateRef\"\n                    [ngTemplateOutletContext]=\"editTemplateContext(-1)\"\n                >\n                </ng-template>\n            </div>\n\n            <!-- items -->\n            <div\n                *ngFor=\"let dataItem of items; let index = index; let first = first; let last = last;\"\n                class=\"k-listview-item\"\n                [attr.role]=\"listItemRole\"\n                [attr.aria-posinset]=\"itemPosInSet(index)\"\n                [attr.aria-setsize]=\"total\"\n                kendoListViewNavigableItem\n                [index]=\"index\"\n                [attr.data-kendo-listview-item-index]=\"index\"\n                [ngClass]=\"itemClass\"\n                [ngStyle]=\"itemStyle\"\n            >\n                <ng-template\n                    [ngTemplateOutlet]=\"isEdited(index) ? editTemplate?.templateRef : itemTemplate?.templateRef\"\n                    [ngTemplateOutletContext]=\"isEdited(index) ? editTemplateContext(index) : templateContext(index)\"\n                >\n                </ng-template>\n            </div>\n\n            <!-- loading indicator -->\n            <div\n                *ngIf=\"loading && !loaderTemplate\"\n                class=\"k-loading-mask\"\n            >\n                <!-- TODO: the k-loading-text is hidden with css but read by readers - review when implementing accessibility + possible localization case -->\n                <span class=\"k-loading-text\">Loading</span>\n                <div class=\"k-loading-image\"></div>\n                <div class=\"k-loading-color\"></div>\n            </div>\n            <ng-template\n                *ngIf=\"loading && loaderTemplate\"\n                [ngTemplateOutlet]=\"loaderTemplate.templateRef\"\n            >\n            </ng-template>\n        </div>\n\n        <!-- footer -->\n        <div\n            *ngIf=\"footerTemplate\"\n            class=\"k-listview-footer\"\n        >\n            <ng-template\n                [ngTemplateOutlet]=\"footerTemplate?.templateRef\"\n            >\n            </ng-template>\n        </div>\n\n        <!-- bottom pager -->\n        <ng-template\n            *ngIf=\"pagerSettings?.position !== 'top'\"\n            [ngTemplateOutlet]=\"pagerTemplate\"\n            [ngTemplateOutletContext]=\"{ pagerClass: 'k-listview-pager' }\"\n        >\n        </ng-template>\n\n        <!-- pager template -->\n        <ng-template #pagerTemplate let-pagerClass=\"pagerClass\">\n            <kendo-datapager\n                *ngIf=\"pageable\"\n                [class]=\"pagerClass\"\n                [total]=\"total\"\n                [pageSize]=\"pageSize\"\n                [skip]=\"skip\"\n                [buttonCount]=\"pagerSettings.buttonCount\"\n                [info]=\"pagerSettings.info\"\n                [previousNext]=\"pagerSettings.previousNext\"\n                [type]=\"pagerSettings.type\"\n                [pageSizeValues]=\"pagerSettings.pageSizeValues\"\n                (pageChange)=\"handlePageChange($event)\"\n                (pageSizeChange)=\"pageSizeChange.emit($event)\"\n            >\n            </kendo-datapager>\n        </ng-template>\n    "
-        }),
-        tslib_1.__metadata("design:paramtypes", [core_1.NgZone,
-            core_1.ElementRef,
-            core_1.Renderer2,
-            edit_service_1.EditService,
-            navigation_service_1.NavigationService])
-    ], ListViewComponent);
-    return ListViewComponent;
-}());
-exports.ListViewComponent = ListViewComponent;

package/dist/npm/listview.module.js

@@ -1,85 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2021 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var tslib_1 = require("tslib");
-var core_1 = require("@angular/core");
-var common_1 = require("@angular/common");
-var kendo_angular_pager_1 = require("@progress/kendo-angular-pager");
-var kendo_angular_common_1 = require("@progress/kendo-angular-common");
-var listview_component_1 = require("./listview.component");
-var listview_navigable_item_directive_1 = require("./navigation/listview-navigable-item.directive");
-var item_template_directive_1 = require("./templates/item-template.directive");
-var header_template_directive_1 = require("./templates/header-template.directive");
-var footer_template_directive_1 = require("./templates/footer-template.directive");
-var template_context_directive_1 = require("./templates/template-context.directive");
-var loader_template_directive_1 = require("./templates/loader-template.directive");
-var data_binding_directive_1 = require("./data-binding/data-binding.directive");
-var edit_template_directive_1 = require("./editing/edit-template.directive");
-var edit_command_directive_1 = require("./editing/commands/edit-command.directive");
-var cancel_command_directive_1 = require("./editing/commands/cancel-command.directive");
-var save_command_directive_1 = require("./editing/commands/save-command.directive");
-var remove_command_directive_1 = require("./editing/commands/remove-command.directive");
-var add_command_directive_1 = require("./editing/commands/add-command.directive");
-var TEMPLATE_DIRECTIVES = [
-    item_template_directive_1.ItemTemplateDirective,
-    header_template_directive_1.HeaderTemplateDirective,
-    footer_template_directive_1.FooterTemplateDirective,
-    loader_template_directive_1.LoaderTemplateDirective
-];
-var BINDING_DIRECTIVES = [
-    data_binding_directive_1.DataBindingDirective
-];
-var EDITING_DIRECTIVES = [
-    edit_template_directive_1.EditTemplateDirective,
-    edit_command_directive_1.EditCommandDirective,
-    cancel_command_directive_1.CancelCommandDirective,
-    save_command_directive_1.SaveCommandDirective,
-    remove_command_directive_1.RemoveCommandDirective,
-    add_command_directive_1.AddCommandDirective
-];
-/**
- * The exported package module.
- *
- * The package exports:
- * - [`ListViewComponent`]({% slug api_listview_listviewcomponent %})—The ListView component class.
- * - [`ItemTemplateDirective`]({% slug api_listview_itemtemplatedirective %})—The item template directive.
- * - [`HeaderTemplateDirective`]({% slug api_listview_headertemplatedirective %})—The header template directive.
- * - [`FooterTemplateDirective`]({% slug api_listview_footertemplatedirective %})—The footer template directive.
- * - [`LoaderTemplateDirective`]({% slug api_listview_loadertemplatedirective %})—The loeader template directive.
- * - [`DataBindingDirective`]({% slug api_listview_databindingdirective %})—The data binding directive.
- * - [`EditTemplateDirective`]({% slug api_listview_editingdirective %}—The editing template directive.
- */
-var ListViewModule = /** @class */ (function () {
-    function ListViewModule() {
-    }
-    ListViewModule = tslib_1.__decorate([
-        core_1.NgModule({
-            declarations: [
-                TEMPLATE_DIRECTIVES,
-                BINDING_DIRECTIVES,
-                EDITING_DIRECTIVES,
-                listview_component_1.ListViewComponent,
-                template_context_directive_1.TemplateContextDirective,
-                listview_navigable_item_directive_1.ListViewNavigableItemDirective
-            ],
-            exports: [
-                TEMPLATE_DIRECTIVES,
-                BINDING_DIRECTIVES,
-                EDITING_DIRECTIVES,
-                listview_component_1.ListViewComponent,
-                common_1.CommonModule,
-                kendo_angular_common_1.EventsModule
-            ],
-            imports: [
-                common_1.CommonModule,
-                kendo_angular_pager_1.PagerModule,
-                kendo_angular_common_1.EventsModule
-            ]
-        })
-    ], ListViewModule);
-    return ListViewModule;
-}());
-exports.ListViewModule = ListViewModule;

package/dist/npm/main.js

@@ -1,24 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2021 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var listview_component_1 = require("./listview.component");
-exports.ListViewComponent = listview_component_1.ListViewComponent;
-var item_template_directive_1 = require("./templates/item-template.directive");
-exports.ItemTemplateDirective = item_template_directive_1.ItemTemplateDirective;
-var header_template_directive_1 = require("./templates/header-template.directive");
-exports.HeaderTemplateDirective = header_template_directive_1.HeaderTemplateDirective;
-var footer_template_directive_1 = require("./templates/footer-template.directive");
-exports.FooterTemplateDirective = footer_template_directive_1.FooterTemplateDirective;
-var loader_template_directive_1 = require("./templates/loader-template.directive");
-exports.LoaderTemplateDirective = loader_template_directive_1.LoaderTemplateDirective;
-var data_binding_directive_1 = require("./data-binding/data-binding.directive");
-exports.DataBindingDirective = data_binding_directive_1.DataBindingDirective;
-var edit_template_directive_1 = require("./editing/edit-template.directive");
-exports.EditTemplateDirective = edit_template_directive_1.EditTemplateDirective;
-var page_size_change_event_1 = require("./models/page-size-change-event");
-exports.PageSizeChangeEvent = page_size_change_event_1.PageSizeChangeEvent;
-var listview_module_1 = require("./listview.module");
-exports.ListViewModule = listview_module_1.ListViewModule;

package/dist/npm/models/listview-data-result.js

@@ -1,6 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2021 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

package/dist/npm/models/page-change-event.js

@@ -1,6 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2021 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });