@progress/kendo-angular-listview - npm Package Compare versions

Comparing version 4.0.2 to 4.0.3-dev.202210121100

bundles/kendo-angular-listview.umd.js

@@ -5,2 +5,2 @@ /**-----------------------------------------------------------------------------------------
 *-------------------------------------------------------------------------------------------*/
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@progress/kendo-angular-common"),require("@progress/kendo-licensing"),require("@progress/kendo-angular-l10n"),require("rxjs"),require("@angular/forms"),require("rxjs/operators"),require("@progress/kendo-angular-pager"),require("@angular/common"),require("@progress/kendo-angular-buttons")):"function"==typeof define&&define.amd?define("KendoAngularListview",["exports","@angular/core","@progress/kendo-angular-common","@progress/kendo-licensing","@progress/kendo-angular-l10n","rxjs","@angular/forms","rxjs/operators","@progress/kendo-angular-pager","@angular/common","@progress/kendo-angular-buttons"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoAngularListview={},e.ng.core,e.KendoAngularCommon,e.KendoLicensing,e.KendoAngularL10N,e.rxjs,e.ng.forms,e.rxjs.operators,e.KendoAngularPager,e.ng.common,e.KendoAngularButtons)}(this,function(e,r,a,z,t,n,i,j,o,s,l){"use strict";function p(n){var i;return n&&n.__esModule?n:(i=Object.create(null),n&&Object.keys(n).forEach(function(e){var t;"default"!==e&&(t=Object.getOwnPropertyDescriptor(n,e),Object.defineProperty(i,e,t.get?t:{enumerable:!0,get:function(){return n[e]}}))}),i.default=n,Object.freeze(i))}function A(e,t){var n=e.matches||e.msMatchesSelector||e.webkitMatchesSelector;return!!v(n)&&n.call(e,t)}function M(e){return!!v(e)&&A(e,K)}function H(e){return v(e)?Number(e.getAttribute("data-kendo-listview-item-index")):null}function _(e,t){for(var n=e;null!==n&&1===n.nodeType;){if(A(n,t))return n;n=n.parentElement||n.parentNode}return null}function c(e){return v(e)?(e=_(e,K),H(e)):null}var d=p(r),B=p(a),g=p(t),m=p(o),u=p(s),Z={name:"@progress/kendo-angular-listview",productName:"Kendo UI for Angular",productCodes:["KENDOUIANGULAR","KENDOUICOMPLETE"],publishDate:1662551388,version:"",licensingDocsUrl:"https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning"},K=".k-listview-item",v=function(e){return null!=e},h=(Object.defineProperty(y.prototype,"isEnabled",{get:function(){return v(this.activeIndex)},set:function(e){this.activeIndex=e?0:null,this.changes.next()},enumerable:!1,configurable:!0}),y.prototype.isActive=function(e){return e===this.activeIndex},y.prototype.handleKeyDown=function(e,t){switch(e.keyCode){case a.Keys.ArrowLeft:case a.Keys.ArrowUp:this.navigateToPrevious();break;case a.Keys.ArrowRight:case a.Keys.ArrowDown:this.navigateToNext(t);break;case a.Keys.Home:this.navigateTo(0);break;case a.Keys.End:this.navigateTo(t-1);break;default:return}e.preventDefault()},y.prototype.handleFocusIn=function(e){var t,e=e.target;M(e)?(t=H(e),this.isFocused&&t===this.activeIndex||(this.activeIndex=t,this.isFocused=!0,this.changes.next())):(t=_(e,".k-listview-item"),v(t)&&(e=H(t),this.setActiveIndex(e)))},y.prototype.handleFocusOut=function(e){M(e.target)&&!M(v((e=e).relatedTarget)&&a.isDocumentAvailable()?e.relatedTarget||document.activeElement:null)&&(this.isFocused=!1,this.changes.next())},y.prototype.setActiveIndex=function(e){this.isEnabled&&e!==this.activeIndex&&(this.activeIndex=e,this.changes.next())},y.prototype.focusIndex=function(e,t){var n;this.isEnabled&&(e=parseInt(e,10),t=t-1,n=isNaN(e)?this.activeIndex:(n=0,t=t,!v(e=e)||e<=n?n:t<=e?t:e),this.navigateTo(n))},y.prototype.navigateTo=function(e){this.isFocused&&this.activeIndex===e||(this.isFocused=!0,this.activeIndex=e,this.changes.next())},y.prototype.navigateToPrevious=function(){var e=Math.max(this.activeIndex-1,0);this.navigateTo(e)},y.prototype.navigateToNext=function(e){e=Math.min(this.activeIndex+1,e-1);this.navigateTo(e)},y);function y(){this.changes=new n.Subject,this.isFocused=!1,this.activeIndex=null}h.ɵfac=d.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:h,deps:[],target:d.ɵɵFactoryTarget.Injectable}),h.ɵprov=d.ɵɵngDeclareInjectable({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:h}),d.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:h,decorators:[{type:r.Injectable}]});I.prototype.ngOnChanges=function(){this.updateNavigationState()},I.prototype.ngOnInit=function(){this.navigationSubscription=this.navigationService.changes.subscribe(this.updateNavigationState.bind(this))},I.prototype.ngOnDestroy=function(){v(this.navigationSubscription)&&this.navigationSubscription.unsubscribe()},I.prototype.updateNavigationState=function(){this.updateTabIndex(),this.updateFocusedState()},I.prototype.updateFocusedState=function(){var e="k-focus";this.navigationService.isActive(this.index)&&this.navigationService.isFocused?(this.renderer.addClass(this.hostElement.nativeElement,e),this.hostElement.nativeElement.focus()):this.renderer.removeClass(this.hostElement.nativeElement,e)},I.prototype.updateTabIndex=function(){this.navigationService.isEnabled?this.navigationService.isActive(this.index)?this.renderer.setAttribute(this.hostElement.nativeElement,"tabindex","0"):this.renderer.setAttribute(this.hostElement.nativeElement,"tabindex","-1"):this.renderer.removeAttribute(this.hostElement.nativeElement,"tabindex")};var f=I;function I(e,t,n){this.hostElement=e,this.renderer=t,this.navigationService=n}f.ɵfac=d.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:f,deps:[{token:d.ElementRef},{token:d.Renderer2},{token:h}],target:d.ɵɵFactoryTarget.Directive}),f.ɵdir=d.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:f,selector:"[kendoListViewNavigableItem]",inputs:{index:"index"},usesOnChanges:!0,ngImport:d}),d.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:f,decorators:[{type:r.Directive,args:[{selector:"[kendoListViewNavigableItem]"}]}],ctorParameters:function(){return[{type:d.ElementRef},{type:d.Renderer2},{type:h}]},propDecorators:{index:[{type:r.Input}]}});function k(e){return-1===e||void 0===e}var C=function(e){this.templateRef=e},b=(C.ɵfac=d.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:C,deps:[{token:d.TemplateRef}],target:d.ɵɵFactoryTarget.Directive}),C.ɵdir=d.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:C,selector:"[kendoListViewItemTemplate]",ngImport:d}),d.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:C,decorators:[{type:r.Directive,args:[{selector:"[kendoListViewItemTemplate]"}]}],ctorParameters:function(){return[{type:d.TemplateRef}]}}),function(e){this.templateRef=e}),w=(b.ɵfac=d.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:b,deps:[{token:d.TemplateRef}],target:d.ɵɵFactoryTarget.Directive}),b.ɵdir=d.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:b,selector:"[kendoListViewHeaderTemplate]",ngImport:d}),d.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:b,decorators:[{type:r.Directive,args:[{selector:"[kendoListViewHeaderTemplate]"}]}],ctorParameters:function(){return[{type:d.TemplateRef}]}}),function(e){this.templateRef=e}),S=(w.ɵfac=d.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:w,deps:[{token:d.TemplateRef}],target:d.ɵɵFactoryTarget.Directive}),w.ɵdir=d.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:w,selector:"[kendoListViewFooterTemplate]",ngImport:d}),d.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:w,decorators:[{type:r.Directive,args:[{selector:"[kendoListViewFooterTemplate]"}]}],ctorParameters:function(){return[{type:d.TemplateRef}]}}),function(e){this.templateRef=e}),D=(S.ɵfac=d.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:S,deps:[{token:d.TemplateRef}],target:d.ɵɵFactoryTarget.Directive}),S.ɵdir=d.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:S,selector:"[kendoListViewLoaderTemplate]",ngImport:d}),d.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:S,decorators:[{type:r.Directive,args:[{selector:"[kendoListViewLoaderTemplate]"}]}],ctorParameters:function(){return[{type:d.TemplateRef}]}}),function(e){this.templateRef=e}),T=(D.ɵfac=d.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:D,deps:[{token:d.TemplateRef,optional:!0}],target:d.ɵɵFactoryTarget.Directive}),D.ɵdir=d.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:D,selector:"[kendoListViewEditTemplate]",ngImport:d}),d.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:D,decorators:[{type:r.Directive,args:[{selector:"[kendoListViewEditTemplate]"}]}],ctorParameters:function(){return[{type:d.TemplateRef,decorators:[{type:r.Optional}]}]}}),x.prototype.editItem=function(e,t){this.editedIndices.push({index:e,group:t=void 0===t?void 0:t}),this.onChanged()},x.prototype.addItem=function(e){this.newItem={group:e},this.onChanged()},x.prototype.isEditing=function(){return 0<this.editedIndices.length},Object.defineProperty(x.prototype,"hasNewItem",{get:function(){return v(this.newItem)},enumerable:!1,configurable:!0}),Object.defineProperty(x.prototype,"newDataItem",{get:function(){return this.hasNewItem?this.newItem.group.value:{}},enumerable:!1,configurable:!0}),Object.defineProperty(x.prototype,"newItemGroup",{get:function(){return this.hasNewItem?this.newItem.group:new i.FormGroup({})},enumerable:!1,configurable:!0}),x.prototype.editGroup=function(e){return this.context(e).group},x.prototype.close=function(e){var t;k(e)?this.newItem=void 0:(this.editedIndices=this.editedIndices.filter((t=e,function(e){return e.index!==t})),this.onChanged())},x.prototype.context=function(e){return k(e)?this.newItem:this.findByIndex(e)},x.prototype.isEdited=function(e){return!(!k(e)||!v(this.newItem))||v(this.findByIndex(e))},x.prototype.hasEdited=function(e){return v(this.context(e))},x.prototype.beginEdit=function(e){this.changes.emit({action:"edit",itemIndex:e})},x.prototype.beginAdd=function(){this.changes.emit({action:"add"})},x.prototype.endEdit=function(e){var t=this.context(e).group;this.changes.emit({action:"cancel",itemIndex:e,formGroup:t,isNew:k(e)})},x.prototype.save=function(e){var t=this.context(e).group;this.changes.emit({action:"save",itemIndex:e,formGroup:t,isNew:k(e)})},x.prototype.remove=function(e){this.changes.emit({action:"remove",itemIndex:e})},x.prototype.findByIndex=function(e){return this.editedIndices.find((t=e,function(e){return e.index===t}));var t},x.prototype.onChanged=function(){var e=this;this.ngZone.runOutsideAngular(function(){e.changedSource.next()})},x);function x(e){var t=this;this.ngZone=e,this.changes=new r.EventEmitter,this.editedIndices=[],this.changedSource=new n.Subject,this.changed=this.changedSource.asObservable().pipe(j.switchMap(function(){return t.ngZone.onStable.asObservable().pipe(j.take(1))}))}T.ɵfac=d.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:T,deps:[{token:d.NgZone}],target:d.ɵɵFactoryTarget.Injectable}),T.ɵprov=d.ɵɵngDeclareInjectable({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:T}),d.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:T,decorators:[{type:r.Injectable}],ctorParameters:function(){return[{type:d.NgZone}]}});var $={position:"bottom",buttonCount:5,info:!0,previousNext:!0,type:"numeric",pageSizeValues:[5,10,20]},V=(Object.defineProperty(E.prototype,"navigable",{get:function(){return this._navigable},set:function(e){!e&&v(this.removeNavigationListeners)?(this.removeNavigationListeners(),this.removeNavigationListeners=null,this.navigationService.isEnabled=!1):e&&!v(this.removeNavigationListeners)&&(this.addNavigationListeners(),this.navigationService.isEnabled=!0),this._navigable=e},enumerable:!1,configurable:!0}),Object.defineProperty(E.prototype,"skip",{get:function(){return this._skip},set:function(e){e=parseInt(e,10);this._skip=isNaN(e)?0:e},enumerable:!1,configurable:!0}),Object.defineProperty(E.prototype,"pageable",{get:function(){return this._pageable},set:function(e){this._pageable=e,this.pagerSettings=e?Object.assign({},$,e):null},enumerable:!1,configurable:!0}),Object.defineProperty(E.prototype,"items",{get:function(){return v(this.data)?(Array.isArray(this.data)?this:this.data).data:[]},enumerable:!1,configurable:!0}),Object.defineProperty(E.prototype,"total",{get:function(){return v(this.data)?Array.isArray(this.data)?this.data.length:this.data.total:0},enumerable:!1,configurable:!0}),Object.defineProperty(E.prototype,"containerTabindex",{get:function(){return this.navigable?-1:null},enumerable:!1,configurable:!0}),Object.defineProperty(E.prototype,"activeIndex",{get:function(){return this.navigationService.activeIndex},enumerable:!1,configurable:!0}),E.prototype.ngOnChanges=function(e){a.isChanged("height",e,!1)&&this.renderer.setStyle(this.element.nativeElement,"height",this.height+"px")},E.prototype.ngOnDestroy=function(){v(this.editServiceSubscription)&&this.editServiceSubscription.unsubscribe()},E.prototype.templateContext=function(e){return{$implicit:this.items[e],isLast:e===this.items.length-1,isFirst:0===e,dataItem:this.items[e],index:e}},E.prototype.editTemplateContext=function(e){var t=-1===e,n=t?this.editService.newItemGroup:this.editService.editGroup(e);return{$implicit:n,formGroup:n,dataItem:t?this.editService.newDataItem:this.items[e],isNew:t,index:e}},E.prototype.focus=function(e){var t=this.listViewItems.length;this.navigationService.focusIndex(e,t)},E.prototype.addItem=function(e){var t,n;e instanceof i.FormGroup||(t=Object.keys(e).reduce((n=e,function(e,t){return e[t]=new i.FormControl(n[t]),e}),{}),e=new i.FormGroup(t)),this.editService.addItem(e)},E.prototype.editItem=function(e,t){this.editService.editItem(e,t)},E.prototype.closeItem=function(e){this.editService.close(e)},E.prototype.isEdited=function(e){return this.editService.isEdited(e)},E.prototype.handlePageChange=function(e){this.scrollToContainerTop();this.navigationService.setActiveIndex(0),this.pageChange.emit(e)},E.prototype.handleContentScroll=function(){var e,t,n,i=this;a.hasObservers(this.scrollBottom)&&(t=(e=this.contentContainer.nativeElement).scrollHeight,n=e.scrollTop,t-e.clientHeight-n<=2&&this.ngZone.run(function(){i.scrollBottom.emit({sender:i})}))},E.prototype.itemPosInSet=function(e){return this.skip+e+1},E.prototype.scrollToContainerTop=function(){var e=this.contentContainer.nativeElement;e.scrollTop=0,e.scrollLeft=0},E.prototype.addNavigationListeners=function(){var i=this;this.ngZone.runOutsideAngular(function(){var e=i.renderer.listen(i.contentContainer.nativeElement,"keydown",function(e){return i.navigationService.handleKeyDown(e,i.listViewItems.length)}),t=i.renderer.listen(i.contentContainer.nativeElement,"focusin",function(e){return i.navigationService.handleFocusIn(e)}),n=i.renderer.listen(i.contentContainer.nativeElement,"focusout",function(e){return i.navigationService.handleFocusOut(e)});i.removeNavigationListeners=function(){e(),t(),n()}})},E.prototype.attachEditHandlers=function(){v(this.editService)&&(this.editServiceSubscription=this.editService.changes.subscribe(this.emitCRUDEvent.bind(this)))},E.prototype.emitCRUDEvent=function(e){var t=e.action,n=e.itemIndex,i=e.formGroup,n=this.items[n];"add"!==t&&i&&(n=i.value),Object.assign(e,{dataItem:n,sender:this}),this[t].emit(e)},E);function E(e,t,n,i,a){this.ngZone=e,this.element=t,this.renderer=n,this.editService=i,this.navigationService=a,this.className=!0,this.loading=!1,this.containerRole="listbox",this.listItemRole="option",this.scrollBottom=new r.EventEmitter,this.pageChange=new r.EventEmitter,this.pageSizeChange=new r.EventEmitter,this.edit=new r.EventEmitter,this.cancel=new r.EventEmitter,this.save=new r.EventEmitter,this.remove=new r.EventEmitter,this.add=new r.EventEmitter,this._skip=0,this._navigable=!1,z.validatePackage(Z),this.attachEditHandlers()}V.ɵfac=d.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:V,deps:[{token:d.NgZone},{token:d.ElementRef},{token:d.Renderer2},{token:T},{token:h}],target:d.ɵɵFactoryTarget.Component}),V.ɵcmp=d.ɵɵngDeclareComponent({minVersion:"12.0.0",version:"12.2.16",type:V,selector:"kendo-listview",inputs:{data:"data",loading:"loading",containerStyle:"containerStyle",itemStyle:"itemStyle",containerClass:"containerClass",itemClass:"itemClass",containerLabel:"containerLabel",containerRole:"containerRole",listItemRole:"listItemRole",navigable:"navigable",pageSize:"pageSize",skip:"skip",pageable:"pageable",height:"height"},outputs:{scrollBottom:"scrollBottom",pageChange:"pageChange",pageSizeChange:"pageSizeChange",edit:"edit",cancel:"cancel",save:"save",remove:"remove",add:"add"},host:{properties:{"class.k-widget":"this.className","class.k-listview":"this.className","class.k-listview-bordered":"this.className","class.k-d-flex":"this.className"}},providers:[T,h,t.LocalizationService,{provide:t.L10N_PREFIX,useValue:"kendo.listview"}],queries:[{propertyName:"itemTemplate",first:!0,predicate:C,descendants:!0},{propertyName:"headerTemplate",first:!0,predicate:b,descendants:!0},{propertyName:"footerTemplate",first:!0,predicate:w,descendants:!0},{propertyName:"loaderTemplate",first:!0,predicate:S,descendants:!0},{propertyName:"editTemplate",first:!0,predicate:D,descendants:!0}],viewQueries:[{propertyName:"contentContainer",first:!0,predicate:["contentContainer"],descendants:!0,static:!0},{propertyName:"listViewItems",predicate:f,descendants:!0}],exportAs:["kendoListView"],usesOnChanges:!0,ngImport:d,template:'\n        \x3c!-- top pager --\x3e\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        \x3c!-- header --\x3e\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        \x3c!-- content --\x3e\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            \x3c!-- new item edit template --\x3e\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            \x3c!-- items --\x3e\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            \x3c!-- loading indicator --\x3e\n            <div\n                *ngIf="loading && !loaderTemplate"\n                class="k-loading-mask"\n            >\n                \x3c!-- TODO: the k-loading-text is hidden with css but read by readers - review when implementing accessibility + possible localization case --\x3e\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        \x3c!-- footer --\x3e\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        \x3c!-- bottom pager --\x3e\n        <ng-template\n            *ngIf="pagerSettings?.position !== \'top\'"\n            [ngTemplateOutlet]="pagerTemplate"\n            [ngTemplateOutletContext]="{ pagerClass: \'k-listview-pager\' }"\n        >\n        </ng-template>\n\n        \x3c!-- pager template --\x3e\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    ',isInline:!0,components:[{type:m.PagerComponent,selector:"kendo-datapager",inputs:["total","skip","pageSize","buttonCount","info","type","pageSizeValues","previousNext"],outputs:["pageChange","pageSizeChange"],exportAs:["kendoDataPager"]}],directives:[{type:u.NgIf,selector:"[ngIf]",inputs:["ngIf","ngIfThen","ngIfElse"]},{type:u.NgTemplateOutlet,selector:"[ngTemplateOutlet]",inputs:["ngTemplateOutletContext","ngTemplateOutlet"]},{type:u.NgClass,selector:"[ngClass]",inputs:["class","ngClass"]},{type:u.NgStyle,selector:"[ngStyle]",inputs:["ngStyle"]},{type:B.EventsOutsideAngularDirective,selector:"[kendoEventsOutsideAngular]",inputs:["kendoEventsOutsideAngular","scope"]},{type:f,selector:"[kendoListViewNavigableItem]",inputs:["index"]},{type:u.NgForOf,selector:"[ngFor][ngForOf]",inputs:["ngForOf","ngForTrackBy","ngForTemplate"]}],changeDetection:d.ChangeDetectionStrategy.OnPush}),d.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:V,decorators:[{type:r.Component,args:[{changeDetection:r.ChangeDetectionStrategy.OnPush,exportAs:"kendoListView",selector:"kendo-listview",providers:[T,h,t.LocalizationService,{provide:t.L10N_PREFIX,useValue:"kendo.listview"}],template:'\n        \x3c!-- top pager --\x3e\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        \x3c!-- header --\x3e\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        \x3c!-- content --\x3e\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            \x3c!-- new item edit template --\x3e\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            \x3c!-- items --\x3e\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            \x3c!-- loading indicator --\x3e\n            <div\n                *ngIf="loading && !loaderTemplate"\n                class="k-loading-mask"\n            >\n                \x3c!-- TODO: the k-loading-text is hidden with css but read by readers - review when implementing accessibility + possible localization case --\x3e\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        \x3c!-- footer --\x3e\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        \x3c!-- bottom pager --\x3e\n        <ng-template\n            *ngIf="pagerSettings?.position !== \'top\'"\n            [ngTemplateOutlet]="pagerTemplate"\n            [ngTemplateOutletContext]="{ pagerClass: \'k-listview-pager\' }"\n        >\n        </ng-template>\n\n        \x3c!-- pager template --\x3e\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    '}]}],ctorParameters:function(){return[{type:d.NgZone},{type:d.ElementRef},{type:d.Renderer2},{type:T},{type:h}]},propDecorators:{className:[{type:r.HostBinding,args:["class.k-widget"]},{type:r.HostBinding,args:["class.k-listview"]},{type:r.HostBinding,args:["class.k-listview-bordered"]},{type:r.HostBinding,args:["class.k-d-flex"]}],itemTemplate:[{type:r.ContentChild,args:[C,{static:!1}]}],headerTemplate:[{type:r.ContentChild,args:[b,{static:!1}]}],footerTemplate:[{type:r.ContentChild,args:[w,{static:!1}]}],loaderTemplate:[{type:r.ContentChild,args:[S,{static:!1}]}],contentContainer:[{type:r.ViewChild,args:["contentContainer",{static:!0}]}],editTemplate:[{type:r.ContentChild,args:[D,{static:!1}]}],listViewItems:[{type:r.ViewChildren,args:[f]}],data:[{type:r.Input}],loading:[{type:r.Input}],containerStyle:[{type:r.Input}],itemStyle:[{type:r.Input}],containerClass:[{type:r.Input}],itemClass:[{type:r.Input}],containerLabel:[{type:r.Input}],containerRole:[{type:r.Input}],listItemRole:[{type:r.Input}],navigable:[{type:r.Input}],pageSize:[{type:r.Input}],skip:[{type:r.Input}],pageable:[{type:r.Input}],height:[{type:r.Input}],scrollBottom:[{type:r.Output}],pageChange:[{type:r.Output}],pageSizeChange:[{type:r.Output}],edit:[{type:r.Output}],cancel:[{type:r.Output}],save:[{type:r.Output}],remove:[{type:r.Output}],add:[{type:r.Output}]}});Object.defineProperty(O.prototype,"data",{get:function(){return this._data},set:function(e){this._data=e||[],this.updateListViewData()},enumerable:!1,configurable:!0}),O.prototype.ngOnInit=function(){this.subscriptions.add(this.listView.pageChange.subscribe(this.handlePageChange.bind(this))),this.subscriptions.add(this.listView.pageSizeChange.subscribe(this.handlePageSizeChange.bind(this))),this.updateListViewData()},O.prototype.ngOnDestroy=function(){this.subscriptions.unsubscribe()},O.prototype.handlePageChange=function(e){this.listView.skip=e.skip,this.listView.pageSize=e.take,this.updateListViewData()},O.prototype.handlePageSizeChange=function(e){this.listView.pageSize=Number(e.newPageSize)},O.prototype.updateListViewData=function(){var e=this.listView.skip||0,t=e+(this.listView.pageSize||this.data.length);this.listView.data={data:this.data.slice(e,t),total:this.data.length}};m=O;function O(e){this.listView=e,this.subscriptions=new n.Subscription}m.ɵfac=d.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:m,deps:[{token:V}],target:d.ɵɵFactoryTarget.Directive}),m.ɵdir=d.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:m,selector:"[kendoListViewBinding]",inputs:{data:["kendoListViewBinding","data"]},ngImport:d}),d.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:m,decorators:[{type:r.Directive,args:[{selector:"[kendoListViewBinding]"}]}],ctorParameters:function(){return[{type:V}]},propDecorators:{data:[{type:r.Input,args:["kendoListViewBinding"]}]}});var G=function(e,t){return(G=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n])})(e,t)};function R(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Class extends value "+String(t)+" is not a constructor or null");function n(){this.constructor=e}G(e,t),e.prototype=null===t?Object.create(t):(n.prototype=t.prototype,new n)}Object.create;Object.create;R(U,q=o.PageSizeChangeEvent);var q,B=U;function U(){return null!==q&&q.apply(this,arguments)||this}R(Q,X=l.Button),Q.prototype.clickHandler=function(e){e.preventDefault();e=c(this.elementRef.nativeElement);this.editService.beginEdit(e)};var X,u=Q;function Q(e,t,n,i,a){n=X.call(this,t,n,null,i,a)||this;return n.editService=e,n.elementRef=t,n}u.ɵfac=d.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:u,deps:[{token:T},{token:d.ElementRef},{token:d.Renderer2},{token:g.LocalizationService},{token:d.NgZone}],target:d.ɵɵFactoryTarget.Directive}),u.ɵdir=d.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:u,selector:"[kendoListViewEditCommand]",host:{listeners:{click:"clickHandler($event)"}},usesInheritance:!0,ngImport:d}),d.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:u,decorators:[{type:r.Directive,args:[{selector:"[kendoListViewEditCommand]"}]}],ctorParameters:function(){return[{type:T},{type:d.ElementRef},{type:d.Renderer2},{type:g.LocalizationService},{type:d.NgZone}]},propDecorators:{clickHandler:[{type:r.HostListener,args:["click",["$event"]]}]}});R(W,J=l.Button),W.prototype.clickHandler=function(e){e.preventDefault(),this.editService.beginAdd()};var J,t=W;function W(e,t,n,i,a){t=J.call(this,t,n,null,i,a)||this;return t.editService=e,t}t.ɵfac=d.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:t,deps:[{token:T},{token:d.ElementRef},{token:d.Renderer2},{token:g.LocalizationService},{token:d.NgZone}],target:d.ɵɵFactoryTarget.Directive}),t.ɵdir=d.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:t,selector:"[kendoListViewAddCommand]",host:{listeners:{click:"clickHandler($event)"}},usesInheritance:!0,ngImport:d}),d.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:t,decorators:[{type:r.Directive,args:[{selector:"[kendoListViewAddCommand]"}]}],ctorParameters:function(){return[{type:T},{type:d.ElementRef},{type:d.Renderer2},{type:g.LocalizationService},{type:d.NgZone}]},propDecorators:{clickHandler:[{type:r.HostListener,args:["click",["$event"]]}]}});R(ee,Y=l.Button),ee.prototype.clickHandler=function(e){e.preventDefault();e=c(this.elementRef.nativeElement);this.editService.isEdited(e)&&this.editService.save(e)};var Y,L=ee;function ee(e,t,n,i,a){n=Y.call(this,t,n,null,i,a)||this;return n.editService=e,n.elementRef=t,n}L.ɵfac=d.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:L,deps:[{token:T},{token:d.ElementRef},{token:d.Renderer2},{token:g.LocalizationService},{token:d.NgZone}],target:d.ɵɵFactoryTarget.Directive}),L.ɵdir=d.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:L,selector:"[kendoListViewSaveCommand]",host:{listeners:{click:"clickHandler($event)"}},usesInheritance:!0,ngImport:d}),d.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:L,decorators:[{type:r.Directive,args:[{selector:"[kendoListViewSaveCommand]"}]}],ctorParameters:function(){return[{type:T},{type:d.ElementRef},{type:d.Renderer2},{type:g.LocalizationService},{type:d.NgZone}]},propDecorators:{clickHandler:[{type:r.HostListener,args:["click",["$event"]]}]}});R(ne,te=l.Button),ne.prototype.clickHandler=function(e){e.preventDefault();e=c(this.elementRef.nativeElement);this.editService.isEdited(e)&&this.editService.endEdit(e)};var te,N=ne;function ne(e,t,n,i,a){n=te.call(this,t,n,null,i,a)||this;return n.editService=e,n.elementRef=t,n}N.ɵfac=d.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:N,deps:[{token:T},{token:d.ElementRef},{token:d.Renderer2},{token:g.LocalizationService},{token:d.NgZone}],target:d.ɵɵFactoryTarget.Directive}),N.ɵdir=d.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:N,selector:"[kendoListViewCancelCommand]",host:{listeners:{click:"clickHandler($event)"}},usesInheritance:!0,ngImport:d}),d.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:N,decorators:[{type:r.Directive,args:[{selector:"[kendoListViewCancelCommand]"}]}],ctorParameters:function(){return[{type:T},{type:d.ElementRef},{type:d.Renderer2},{type:g.LocalizationService},{type:d.NgZone}]},propDecorators:{clickHandler:[{type:r.HostListener,args:["click",["$event"]]}]}});R(ae,ie=l.Button),ae.prototype.clickHandler=function(e){e.preventDefault();e=c(this.elementRef.nativeElement);this.editService.remove(e)};var ie,l=ae;function ae(e,t,n,i,a){n=ie.call(this,t,n,null,i,a)||this;return n.editService=e,n.elementRef=t,n}l.ɵfac=d.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:l,deps:[{token:T},{token:d.ElementRef},{token:d.Renderer2},{token:g.LocalizationService},{token:d.NgZone}],target:d.ɵɵFactoryTarget.Directive}),l.ɵdir=d.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:l,selector:"[kendoListViewRemoveCommand]",host:{listeners:{click:"clickHandler($event)"}},usesInheritance:!0,ngImport:d}),d.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:l,decorators:[{type:r.Directive,args:[{selector:"[kendoListViewRemoveCommand]"}]}],ctorParameters:function(){return[{type:T},{type:d.ElementRef},{type:d.Renderer2},{type:g.LocalizationService},{type:d.NgZone}]},propDecorators:{clickHandler:[{type:r.HostListener,args:["click",["$event"]]}]}});Object.defineProperty(re.prototype,"templateContext",{set:function(e){this.insertedViewRef&&(this.viewContainerRef.remove(this.viewContainerRef.indexOf(this.insertedViewRef)),this.insertedViewRef=void 0),e.templateRef&&(this.insertedViewRef=this.viewContainerRef.createEmbeddedView(e.templateRef,e))},enumerable:!1,configurable:!0});var F=re;function re(e){this.viewContainerRef=e}F.ɵfac=d.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:F,deps:[{token:d.ViewContainerRef}],target:d.ɵɵFactoryTarget.Directive}),F.ɵdir=d.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:F,selector:"[templateContext]",inputs:{templateContext:"templateContext"},ngImport:d}),d.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:F,decorators:[{type:r.Directive,args:[{selector:"[templateContext]"}]}],ctorParameters:function(){return[{type:d.ViewContainerRef}]},propDecorators:{templateContext:[{type:r.Input}]}});var oe=[C,b,w,S],se=[m],le=[D,u,N,L,l,t],P=function(){};P.ɵfac=d.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:P,deps:[],target:d.ɵɵFactoryTarget.NgModule}),P.ɵmod=d.ɵɵngDeclareNgModule({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:P,declarations:[C,b,w,S,m,D,u,N,L,l,t,V,F,f],imports:[s.CommonModule,o.PagerModule,a.EventsModule],exports:[C,b,w,S,m,D,u,N,L,l,t,V,s.CommonModule,a.EventsModule]}),P.ɵinj=d.ɵɵngDeclareInjector({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:P,imports:[[s.CommonModule,o.PagerModule,a.EventsModule],s.CommonModule,a.EventsModule]}),d.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:P,decorators:[{type:r.NgModule,args:[{declarations:[oe,se,le,V,F,f],exports:[oe,se,le,V,s.CommonModule,a.EventsModule],imports:[s.CommonModule,o.PagerModule,a.EventsModule]}]}]}),e.AddCommandDirective=t,e.CancelCommandDirective=N,e.DataBindingDirective=m,e.EditCommandDirective=u,e.EditTemplateDirective=D,e.FooterTemplateDirective=w,e.HeaderTemplateDirective=b,e.ItemTemplateDirective=C,e.ListViewComponent=V,e.ListViewModule=P,e.LoaderTemplateDirective=S,e.PageSizeChangeEvent=B,e.RemoveCommandDirective=l,e.SaveCommandDirective=L,Object.defineProperty(e,"__esModule",{value:!0})});
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@progress/kendo-angular-common"),require("@progress/kendo-licensing"),require("@progress/kendo-angular-l10n"),require("rxjs"),require("@angular/forms"),require("rxjs/operators"),require("@progress/kendo-angular-pager"),require("@angular/common"),require("@progress/kendo-angular-buttons")):"function"==typeof define&&define.amd?define("KendoAngularListview",["exports","@angular/core","@progress/kendo-angular-common","@progress/kendo-licensing","@progress/kendo-angular-l10n","rxjs","@angular/forms","rxjs/operators","@progress/kendo-angular-pager","@angular/common","@progress/kendo-angular-buttons"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoAngularListview={},e.ng.core,e.KendoAngularCommon,e.KendoLicensing,e.KendoAngularL10N,e.rxjs,e.ng.forms,e.rxjs.operators,e.KendoAngularPager,e.ng.common,e.KendoAngularButtons)}(this,function(e,r,a,z,t,n,i,j,o,s,l){"use strict";function p(n){var i;return n&&n.__esModule?n:(i=Object.create(null),n&&Object.keys(n).forEach(function(e){var t;"default"!==e&&(t=Object.getOwnPropertyDescriptor(n,e),Object.defineProperty(i,e,t.get?t:{enumerable:!0,get:function(){return n[e]}}))}),i.default=n,Object.freeze(i))}function A(e,t){var n=e.matches||e.msMatchesSelector||e.webkitMatchesSelector;return!!v(n)&&n.call(e,t)}function M(e){return!!v(e)&&A(e,K)}function H(e){return v(e)?Number(e.getAttribute("data-kendo-listview-item-index")):null}function _(e,t){for(var n=e;null!==n&&1===n.nodeType;){if(A(n,t))return n;n=n.parentElement||n.parentNode}return null}function c(e){return v(e)?(e=_(e,K),H(e)):null}var d=p(r),B=p(a),g=p(t),m=p(o),u=p(s),Z={name:"@progress/kendo-angular-listview",productName:"Kendo UI for Angular",productCodes:["KENDOUIANGULAR","KENDOUICOMPLETE"],publishDate:1665572385,version:"",licensingDocsUrl:"https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning"},K=".k-listview-item",v=function(e){return null!=e},h=(Object.defineProperty(y.prototype,"isEnabled",{get:function(){return v(this.activeIndex)},set:function(e){this.activeIndex=e?0:null,this.changes.next()},enumerable:!1,configurable:!0}),y.prototype.isActive=function(e){return e===this.activeIndex},y.prototype.handleKeyDown=function(e,t){switch(e.keyCode){case a.Keys.ArrowLeft:case a.Keys.ArrowUp:this.navigateToPrevious();break;case a.Keys.ArrowRight:case a.Keys.ArrowDown:this.navigateToNext(t);break;case a.Keys.Home:this.navigateTo(0);break;case a.Keys.End:this.navigateTo(t-1);break;default:return}e.preventDefault()},y.prototype.handleFocusIn=function(e){var t,e=e.target;M(e)?(t=H(e),this.isFocused&&t===this.activeIndex||(this.activeIndex=t,this.isFocused=!0,this.changes.next())):(t=_(e,".k-listview-item"),v(t)&&(e=H(t),this.setActiveIndex(e)))},y.prototype.handleFocusOut=function(e){M(e.target)&&!M(v((e=e).relatedTarget)&&a.isDocumentAvailable()?e.relatedTarget||document.activeElement:null)&&(this.isFocused=!1,this.changes.next())},y.prototype.setActiveIndex=function(e){this.isEnabled&&e!==this.activeIndex&&(this.activeIndex=e,this.changes.next())},y.prototype.focusIndex=function(e,t){var n;this.isEnabled&&(e=parseInt(e,10),t=t-1,n=isNaN(e)?this.activeIndex:(n=0,t=t,!v(e=e)||e<=n?n:t<=e?t:e),this.navigateTo(n))},y.prototype.navigateTo=function(e){this.isFocused&&this.activeIndex===e||(this.isFocused=!0,this.activeIndex=e,this.changes.next())},y.prototype.navigateToPrevious=function(){var e=Math.max(this.activeIndex-1,0);this.navigateTo(e)},y.prototype.navigateToNext=function(e){e=Math.min(this.activeIndex+1,e-1);this.navigateTo(e)},y);function y(){this.changes=new n.Subject,this.isFocused=!1,this.activeIndex=null}h.ɵfac=d.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:h,deps:[],target:d.ɵɵFactoryTarget.Injectable}),h.ɵprov=d.ɵɵngDeclareInjectable({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:h}),d.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:h,decorators:[{type:r.Injectable}]});I.prototype.ngOnChanges=function(){this.updateNavigationState()},I.prototype.ngOnInit=function(){this.navigationSubscription=this.navigationService.changes.subscribe(this.updateNavigationState.bind(this))},I.prototype.ngOnDestroy=function(){v(this.navigationSubscription)&&this.navigationSubscription.unsubscribe()},I.prototype.updateNavigationState=function(){this.updateTabIndex(),this.updateFocusedState()},I.prototype.updateFocusedState=function(){var e="k-focus";this.navigationService.isActive(this.index)&&this.navigationService.isFocused?(this.renderer.addClass(this.hostElement.nativeElement,e),this.hostElement.nativeElement.focus()):this.renderer.removeClass(this.hostElement.nativeElement,e)},I.prototype.updateTabIndex=function(){this.navigationService.isEnabled?this.navigationService.isActive(this.index)?this.renderer.setAttribute(this.hostElement.nativeElement,"tabindex","0"):this.renderer.setAttribute(this.hostElement.nativeElement,"tabindex","-1"):this.renderer.removeAttribute(this.hostElement.nativeElement,"tabindex")};var f=I;function I(e,t,n){this.hostElement=e,this.renderer=t,this.navigationService=n}f.ɵfac=d.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:f,deps:[{token:d.ElementRef},{token:d.Renderer2},{token:h}],target:d.ɵɵFactoryTarget.Directive}),f.ɵdir=d.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:f,selector:"[kendoListViewNavigableItem]",inputs:{index:"index"},usesOnChanges:!0,ngImport:d}),d.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:f,decorators:[{type:r.Directive,args:[{selector:"[kendoListViewNavigableItem]"}]}],ctorParameters:function(){return[{type:d.ElementRef},{type:d.Renderer2},{type:h}]},propDecorators:{index:[{type:r.Input}]}});function k(e){return-1===e||void 0===e}var C=function(e){this.templateRef=e},b=(C.ɵfac=d.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:C,deps:[{token:d.TemplateRef}],target:d.ɵɵFactoryTarget.Directive}),C.ɵdir=d.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:C,selector:"[kendoListViewItemTemplate]",ngImport:d}),d.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:C,decorators:[{type:r.Directive,args:[{selector:"[kendoListViewItemTemplate]"}]}],ctorParameters:function(){return[{type:d.TemplateRef}]}}),function(e){this.templateRef=e}),w=(b.ɵfac=d.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:b,deps:[{token:d.TemplateRef}],target:d.ɵɵFactoryTarget.Directive}),b.ɵdir=d.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:b,selector:"[kendoListViewHeaderTemplate]",ngImport:d}),d.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:b,decorators:[{type:r.Directive,args:[{selector:"[kendoListViewHeaderTemplate]"}]}],ctorParameters:function(){return[{type:d.TemplateRef}]}}),function(e){this.templateRef=e}),S=(w.ɵfac=d.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:w,deps:[{token:d.TemplateRef}],target:d.ɵɵFactoryTarget.Directive}),w.ɵdir=d.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:w,selector:"[kendoListViewFooterTemplate]",ngImport:d}),d.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:w,decorators:[{type:r.Directive,args:[{selector:"[kendoListViewFooterTemplate]"}]}],ctorParameters:function(){return[{type:d.TemplateRef}]}}),function(e){this.templateRef=e}),D=(S.ɵfac=d.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:S,deps:[{token:d.TemplateRef}],target:d.ɵɵFactoryTarget.Directive}),S.ɵdir=d.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:S,selector:"[kendoListViewLoaderTemplate]",ngImport:d}),d.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:S,decorators:[{type:r.Directive,args:[{selector:"[kendoListViewLoaderTemplate]"}]}],ctorParameters:function(){return[{type:d.TemplateRef}]}}),function(e){this.templateRef=e}),T=(D.ɵfac=d.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:D,deps:[{token:d.TemplateRef,optional:!0}],target:d.ɵɵFactoryTarget.Directive}),D.ɵdir=d.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:D,selector:"[kendoListViewEditTemplate]",ngImport:d}),d.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:D,decorators:[{type:r.Directive,args:[{selector:"[kendoListViewEditTemplate]"}]}],ctorParameters:function(){return[{type:d.TemplateRef,decorators:[{type:r.Optional}]}]}}),x.prototype.editItem=function(e,t){this.editedIndices.push({index:e,group:t=void 0===t?void 0:t}),this.onChanged()},x.prototype.addItem=function(e){this.newItem={group:e},this.onChanged()},x.prototype.isEditing=function(){return 0<this.editedIndices.length},Object.defineProperty(x.prototype,"hasNewItem",{get:function(){return v(this.newItem)},enumerable:!1,configurable:!0}),Object.defineProperty(x.prototype,"newDataItem",{get:function(){return this.hasNewItem?this.newItem.group.value:{}},enumerable:!1,configurable:!0}),Object.defineProperty(x.prototype,"newItemGroup",{get:function(){return this.hasNewItem?this.newItem.group:new i.FormGroup({})},enumerable:!1,configurable:!0}),x.prototype.editGroup=function(e){return this.context(e).group},x.prototype.close=function(e){var t;k(e)?this.newItem=void 0:(this.editedIndices=this.editedIndices.filter((t=e,function(e){return e.index!==t})),this.onChanged())},x.prototype.context=function(e){return k(e)?this.newItem:this.findByIndex(e)},x.prototype.isEdited=function(e){return!(!k(e)||!v(this.newItem))||v(this.findByIndex(e))},x.prototype.hasEdited=function(e){return v(this.context(e))},x.prototype.beginEdit=function(e){this.changes.emit({action:"edit",itemIndex:e})},x.prototype.beginAdd=function(){this.changes.emit({action:"add"})},x.prototype.endEdit=function(e){var t=this.context(e).group;this.changes.emit({action:"cancel",itemIndex:e,formGroup:t,isNew:k(e)})},x.prototype.save=function(e){var t=this.context(e).group;this.changes.emit({action:"save",itemIndex:e,formGroup:t,isNew:k(e)})},x.prototype.remove=function(e){this.changes.emit({action:"remove",itemIndex:e})},x.prototype.findByIndex=function(e){return this.editedIndices.find((t=e,function(e){return e.index===t}));var t},x.prototype.onChanged=function(){var e=this;this.ngZone.runOutsideAngular(function(){e.changedSource.next()})},x);function x(e){var t=this;this.ngZone=e,this.changes=new r.EventEmitter,this.editedIndices=[],this.changedSource=new n.Subject,this.changed=this.changedSource.asObservable().pipe(j.switchMap(function(){return t.ngZone.onStable.asObservable().pipe(j.take(1))}))}T.ɵfac=d.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:T,deps:[{token:d.NgZone}],target:d.ɵɵFactoryTarget.Injectable}),T.ɵprov=d.ɵɵngDeclareInjectable({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:T}),d.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:T,decorators:[{type:r.Injectable}],ctorParameters:function(){return[{type:d.NgZone}]}});var $={position:"bottom",buttonCount:5,info:!0,previousNext:!0,type:"numeric",pageSizeValues:[5,10,20]},V=(Object.defineProperty(E.prototype,"navigable",{get:function(){return this._navigable},set:function(e){!e&&v(this.removeNavigationListeners)?(this.removeNavigationListeners(),this.removeNavigationListeners=null,this.navigationService.isEnabled=!1):e&&!v(this.removeNavigationListeners)&&(this.addNavigationListeners(),this.navigationService.isEnabled=!0),this._navigable=e},enumerable:!1,configurable:!0}),Object.defineProperty(E.prototype,"skip",{get:function(){return this._skip},set:function(e){e=parseInt(e,10);this._skip=isNaN(e)?0:e},enumerable:!1,configurable:!0}),Object.defineProperty(E.prototype,"pageable",{get:function(){return this._pageable},set:function(e){this._pageable=e,this.pagerSettings=e?Object.assign({},$,e):null},enumerable:!1,configurable:!0}),Object.defineProperty(E.prototype,"items",{get:function(){return v(this.data)?(Array.isArray(this.data)?this:this.data).data:[]},enumerable:!1,configurable:!0}),Object.defineProperty(E.prototype,"total",{get:function(){return v(this.data)?Array.isArray(this.data)?this.data.length:this.data.total:0},enumerable:!1,configurable:!0}),Object.defineProperty(E.prototype,"containerTabindex",{get:function(){return this.navigable?-1:null},enumerable:!1,configurable:!0}),Object.defineProperty(E.prototype,"activeIndex",{get:function(){return this.navigationService.activeIndex},enumerable:!1,configurable:!0}),E.prototype.ngOnChanges=function(e){a.isChanged("height",e,!1)&&this.renderer.setStyle(this.element.nativeElement,"height",this.height+"px")},E.prototype.ngOnDestroy=function(){v(this.editServiceSubscription)&&this.editServiceSubscription.unsubscribe()},E.prototype.templateContext=function(e){return{$implicit:this.items[e],isLast:e===this.items.length-1,isFirst:0===e,dataItem:this.items[e],index:e}},E.prototype.editTemplateContext=function(e){var t=-1===e,n=t?this.editService.newItemGroup:this.editService.editGroup(e);return{$implicit:n,formGroup:n,dataItem:t?this.editService.newDataItem:this.items[e],isNew:t,index:e}},E.prototype.focus=function(e){var t=this.listViewItems.length;this.navigationService.focusIndex(e,t)},E.prototype.addItem=function(e){var t,n;e instanceof i.FormGroup||(t=Object.keys(e).reduce((n=e,function(e,t){return e[t]=new i.FormControl(n[t]),e}),{}),e=new i.FormGroup(t)),this.editService.addItem(e)},E.prototype.editItem=function(e,t){this.editService.editItem(e,t)},E.prototype.closeItem=function(e){this.editService.close(e)},E.prototype.isEdited=function(e){return this.editService.isEdited(e)},E.prototype.handlePageChange=function(e){this.scrollToContainerTop();this.navigationService.setActiveIndex(0),this.pageChange.emit(e)},E.prototype.handleContentScroll=function(){var e,t,n,i=this;a.hasObservers(this.scrollBottom)&&(t=(e=this.contentContainer.nativeElement).scrollHeight,n=e.scrollTop,t-e.clientHeight-n<=2&&this.ngZone.run(function(){i.scrollBottom.emit({sender:i})}))},E.prototype.itemPosInSet=function(e){return this.skip+e+1},E.prototype.scrollToContainerTop=function(){var e=this.contentContainer.nativeElement;e.scrollTop=0,e.scrollLeft=0},E.prototype.addNavigationListeners=function(){var i=this;this.ngZone.runOutsideAngular(function(){var e=i.renderer.listen(i.contentContainer.nativeElement,"keydown",function(e){return i.navigationService.handleKeyDown(e,i.listViewItems.length)}),t=i.renderer.listen(i.contentContainer.nativeElement,"focusin",function(e){return i.navigationService.handleFocusIn(e)}),n=i.renderer.listen(i.contentContainer.nativeElement,"focusout",function(e){return i.navigationService.handleFocusOut(e)});i.removeNavigationListeners=function(){e(),t(),n()}})},E.prototype.attachEditHandlers=function(){v(this.editService)&&(this.editServiceSubscription=this.editService.changes.subscribe(this.emitCRUDEvent.bind(this)))},E.prototype.emitCRUDEvent=function(e){var t=e.action,n=e.itemIndex,i=e.formGroup,n=this.items[n];"add"!==t&&i&&(n=i.value),Object.assign(e,{dataItem:n,sender:this}),this[t].emit(e)},E);function E(e,t,n,i,a){this.ngZone=e,this.element=t,this.renderer=n,this.editService=i,this.navigationService=a,this.className=!0,this.loading=!1,this.containerRole="listbox",this.listItemRole="option",this.scrollBottom=new r.EventEmitter,this.pageChange=new r.EventEmitter,this.pageSizeChange=new r.EventEmitter,this.edit=new r.EventEmitter,this.cancel=new r.EventEmitter,this.save=new r.EventEmitter,this.remove=new r.EventEmitter,this.add=new r.EventEmitter,this._skip=0,this._navigable=!1,z.validatePackage(Z),this.attachEditHandlers()}V.ɵfac=d.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:V,deps:[{token:d.NgZone},{token:d.ElementRef},{token:d.Renderer2},{token:T},{token:h}],target:d.ɵɵFactoryTarget.Component}),V.ɵcmp=d.ɵɵngDeclareComponent({minVersion:"12.0.0",version:"12.2.16",type:V,selector:"kendo-listview",inputs:{data:"data",loading:"loading",containerStyle:"containerStyle",itemStyle:"itemStyle",containerClass:"containerClass",itemClass:"itemClass",containerLabel:"containerLabel",containerRole:"containerRole",listItemRole:"listItemRole",navigable:"navigable",pageSize:"pageSize",skip:"skip",pageable:"pageable",height:"height"},outputs:{scrollBottom:"scrollBottom",pageChange:"pageChange",pageSizeChange:"pageSizeChange",edit:"edit",cancel:"cancel",save:"save",remove:"remove",add:"add"},host:{properties:{"class.k-widget":"this.className","class.k-listview":"this.className","class.k-listview-bordered":"this.className","class.k-d-flex":"this.className"}},providers:[T,h,t.LocalizationService,{provide:t.L10N_PREFIX,useValue:"kendo.listview"}],queries:[{propertyName:"itemTemplate",first:!0,predicate:C,descendants:!0},{propertyName:"headerTemplate",first:!0,predicate:b,descendants:!0},{propertyName:"footerTemplate",first:!0,predicate:w,descendants:!0},{propertyName:"loaderTemplate",first:!0,predicate:S,descendants:!0},{propertyName:"editTemplate",first:!0,predicate:D,descendants:!0}],viewQueries:[{propertyName:"contentContainer",first:!0,predicate:["contentContainer"],descendants:!0,static:!0},{propertyName:"listViewItems",predicate:f,descendants:!0}],exportAs:["kendoListView"],usesOnChanges:!0,ngImport:d,template:'\n        \x3c!-- top pager --\x3e\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        \x3c!-- header --\x3e\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        \x3c!-- content --\x3e\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            \x3c!-- new item edit template --\x3e\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            \x3c!-- items --\x3e\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            \x3c!-- loading indicator --\x3e\n            <div\n                *ngIf="loading && !loaderTemplate"\n                class="k-loading-mask"\n            >\n                \x3c!-- TODO: the k-loading-text is hidden with css but read by readers - review when implementing accessibility + possible localization case --\x3e\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        \x3c!-- footer --\x3e\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        \x3c!-- bottom pager --\x3e\n        <ng-template\n            *ngIf="pagerSettings?.position !== \'top\'"\n            [ngTemplateOutlet]="pagerTemplate"\n            [ngTemplateOutletContext]="{ pagerClass: \'k-listview-pager\' }"\n        >\n        </ng-template>\n\n        \x3c!-- pager template --\x3e\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    ',isInline:!0,components:[{type:m.PagerComponent,selector:"kendo-datapager",inputs:["total","skip","pageSize","buttonCount","info","type","pageSizeValues","previousNext"],outputs:["pageChange","pageSizeChange"],exportAs:["kendoDataPager"]}],directives:[{type:u.NgIf,selector:"[ngIf]",inputs:["ngIf","ngIfThen","ngIfElse"]},{type:u.NgTemplateOutlet,selector:"[ngTemplateOutlet]",inputs:["ngTemplateOutletContext","ngTemplateOutlet"]},{type:u.NgClass,selector:"[ngClass]",inputs:["class","ngClass"]},{type:u.NgStyle,selector:"[ngStyle]",inputs:["ngStyle"]},{type:B.EventsOutsideAngularDirective,selector:"[kendoEventsOutsideAngular]",inputs:["kendoEventsOutsideAngular","scope"]},{type:f,selector:"[kendoListViewNavigableItem]",inputs:["index"]},{type:u.NgForOf,selector:"[ngFor][ngForOf]",inputs:["ngForOf","ngForTrackBy","ngForTemplate"]}],changeDetection:d.ChangeDetectionStrategy.OnPush}),d.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:V,decorators:[{type:r.Component,args:[{changeDetection:r.ChangeDetectionStrategy.OnPush,exportAs:"kendoListView",selector:"kendo-listview",providers:[T,h,t.LocalizationService,{provide:t.L10N_PREFIX,useValue:"kendo.listview"}],template:'\n        \x3c!-- top pager --\x3e\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        \x3c!-- header --\x3e\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        \x3c!-- content --\x3e\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            \x3c!-- new item edit template --\x3e\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            \x3c!-- items --\x3e\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            \x3c!-- loading indicator --\x3e\n            <div\n                *ngIf="loading && !loaderTemplate"\n                class="k-loading-mask"\n            >\n                \x3c!-- TODO: the k-loading-text is hidden with css but read by readers - review when implementing accessibility + possible localization case --\x3e\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        \x3c!-- footer --\x3e\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        \x3c!-- bottom pager --\x3e\n        <ng-template\n            *ngIf="pagerSettings?.position !== \'top\'"\n            [ngTemplateOutlet]="pagerTemplate"\n            [ngTemplateOutletContext]="{ pagerClass: \'k-listview-pager\' }"\n        >\n        </ng-template>\n\n        \x3c!-- pager template --\x3e\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    '}]}],ctorParameters:function(){return[{type:d.NgZone},{type:d.ElementRef},{type:d.Renderer2},{type:T},{type:h}]},propDecorators:{className:[{type:r.HostBinding,args:["class.k-widget"]},{type:r.HostBinding,args:["class.k-listview"]},{type:r.HostBinding,args:["class.k-listview-bordered"]},{type:r.HostBinding,args:["class.k-d-flex"]}],itemTemplate:[{type:r.ContentChild,args:[C,{static:!1}]}],headerTemplate:[{type:r.ContentChild,args:[b,{static:!1}]}],footerTemplate:[{type:r.ContentChild,args:[w,{static:!1}]}],loaderTemplate:[{type:r.ContentChild,args:[S,{static:!1}]}],contentContainer:[{type:r.ViewChild,args:["contentContainer",{static:!0}]}],editTemplate:[{type:r.ContentChild,args:[D,{static:!1}]}],listViewItems:[{type:r.ViewChildren,args:[f]}],data:[{type:r.Input}],loading:[{type:r.Input}],containerStyle:[{type:r.Input}],itemStyle:[{type:r.Input}],containerClass:[{type:r.Input}],itemClass:[{type:r.Input}],containerLabel:[{type:r.Input}],containerRole:[{type:r.Input}],listItemRole:[{type:r.Input}],navigable:[{type:r.Input}],pageSize:[{type:r.Input}],skip:[{type:r.Input}],pageable:[{type:r.Input}],height:[{type:r.Input}],scrollBottom:[{type:r.Output}],pageChange:[{type:r.Output}],pageSizeChange:[{type:r.Output}],edit:[{type:r.Output}],cancel:[{type:r.Output}],save:[{type:r.Output}],remove:[{type:r.Output}],add:[{type:r.Output}]}});Object.defineProperty(O.prototype,"data",{get:function(){return this._data},set:function(e){this._data=e||[],this.updateListViewData()},enumerable:!1,configurable:!0}),O.prototype.ngOnInit=function(){this.subscriptions.add(this.listView.pageChange.subscribe(this.handlePageChange.bind(this))),this.subscriptions.add(this.listView.pageSizeChange.subscribe(this.handlePageSizeChange.bind(this))),this.updateListViewData()},O.prototype.ngOnDestroy=function(){this.subscriptions.unsubscribe()},O.prototype.handlePageChange=function(e){this.listView.skip=e.skip,this.listView.pageSize=e.take,this.updateListViewData()},O.prototype.handlePageSizeChange=function(e){this.listView.pageSize=Number(e.newPageSize)},O.prototype.updateListViewData=function(){var e=this.listView.skip||0,t=e+(this.listView.pageSize||this.data.length);this.listView.data={data:this.data.slice(e,t),total:this.data.length}};m=O;function O(e){this.listView=e,this.subscriptions=new n.Subscription}m.ɵfac=d.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:m,deps:[{token:V}],target:d.ɵɵFactoryTarget.Directive}),m.ɵdir=d.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:m,selector:"[kendoListViewBinding]",inputs:{data:["kendoListViewBinding","data"]},ngImport:d}),d.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:m,decorators:[{type:r.Directive,args:[{selector:"[kendoListViewBinding]"}]}],ctorParameters:function(){return[{type:V}]},propDecorators:{data:[{type:r.Input,args:["kendoListViewBinding"]}]}});var G=function(e,t){return(G=Object.setPrototypeOf||({__proto__:[]}instanceof Array?function(e,t){e.__proto__=t}:function(e,t){for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n])}))(e,t)};function R(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Class extends value "+String(t)+" is not a constructor or null");function n(){this.constructor=e}G(e,t),e.prototype=null===t?Object.create(t):(n.prototype=t.prototype,new n)}Object.create;Object.create;R(U,q=o.PageSizeChangeEvent);var q,B=U;function U(){return null!==q&&q.apply(this,arguments)||this}R(Q,X=l.Button),Q.prototype.clickHandler=function(e){e.preventDefault();e=c(this.elementRef.nativeElement);this.editService.beginEdit(e)};var X,u=Q;function Q(e,t,n,i,a){n=X.call(this,t,n,null,i,a)||this;return n.editService=e,n.elementRef=t,n}u.ɵfac=d.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:u,deps:[{token:T},{token:d.ElementRef},{token:d.Renderer2},{token:g.LocalizationService},{token:d.NgZone}],target:d.ɵɵFactoryTarget.Directive}),u.ɵdir=d.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:u,selector:"[kendoListViewEditCommand]",host:{listeners:{click:"clickHandler($event)"}},usesInheritance:!0,ngImport:d}),d.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:u,decorators:[{type:r.Directive,args:[{selector:"[kendoListViewEditCommand]"}]}],ctorParameters:function(){return[{type:T},{type:d.ElementRef},{type:d.Renderer2},{type:g.LocalizationService},{type:d.NgZone}]},propDecorators:{clickHandler:[{type:r.HostListener,args:["click",["$event"]]}]}});R(W,J=l.Button),W.prototype.clickHandler=function(e){e.preventDefault(),this.editService.beginAdd()};var J,t=W;function W(e,t,n,i,a){t=J.call(this,t,n,null,i,a)||this;return t.editService=e,t}t.ɵfac=d.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:t,deps:[{token:T},{token:d.ElementRef},{token:d.Renderer2},{token:g.LocalizationService},{token:d.NgZone}],target:d.ɵɵFactoryTarget.Directive}),t.ɵdir=d.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:t,selector:"[kendoListViewAddCommand]",host:{listeners:{click:"clickHandler($event)"}},usesInheritance:!0,ngImport:d}),d.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:t,decorators:[{type:r.Directive,args:[{selector:"[kendoListViewAddCommand]"}]}],ctorParameters:function(){return[{type:T},{type:d.ElementRef},{type:d.Renderer2},{type:g.LocalizationService},{type:d.NgZone}]},propDecorators:{clickHandler:[{type:r.HostListener,args:["click",["$event"]]}]}});R(ee,Y=l.Button),ee.prototype.clickHandler=function(e){e.preventDefault();e=c(this.elementRef.nativeElement);this.editService.isEdited(e)&&this.editService.save(e)};var Y,L=ee;function ee(e,t,n,i,a){n=Y.call(this,t,n,null,i,a)||this;return n.editService=e,n.elementRef=t,n}L.ɵfac=d.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:L,deps:[{token:T},{token:d.ElementRef},{token:d.Renderer2},{token:g.LocalizationService},{token:d.NgZone}],target:d.ɵɵFactoryTarget.Directive}),L.ɵdir=d.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:L,selector:"[kendoListViewSaveCommand]",host:{listeners:{click:"clickHandler($event)"}},usesInheritance:!0,ngImport:d}),d.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:L,decorators:[{type:r.Directive,args:[{selector:"[kendoListViewSaveCommand]"}]}],ctorParameters:function(){return[{type:T},{type:d.ElementRef},{type:d.Renderer2},{type:g.LocalizationService},{type:d.NgZone}]},propDecorators:{clickHandler:[{type:r.HostListener,args:["click",["$event"]]}]}});R(ne,te=l.Button),ne.prototype.clickHandler=function(e){e.preventDefault();e=c(this.elementRef.nativeElement);this.editService.isEdited(e)&&this.editService.endEdit(e)};var te,N=ne;function ne(e,t,n,i,a){n=te.call(this,t,n,null,i,a)||this;return n.editService=e,n.elementRef=t,n}N.ɵfac=d.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:N,deps:[{token:T},{token:d.ElementRef},{token:d.Renderer2},{token:g.LocalizationService},{token:d.NgZone}],target:d.ɵɵFactoryTarget.Directive}),N.ɵdir=d.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:N,selector:"[kendoListViewCancelCommand]",host:{listeners:{click:"clickHandler($event)"}},usesInheritance:!0,ngImport:d}),d.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:N,decorators:[{type:r.Directive,args:[{selector:"[kendoListViewCancelCommand]"}]}],ctorParameters:function(){return[{type:T},{type:d.ElementRef},{type:d.Renderer2},{type:g.LocalizationService},{type:d.NgZone}]},propDecorators:{clickHandler:[{type:r.HostListener,args:["click",["$event"]]}]}});R(ae,ie=l.Button),ae.prototype.clickHandler=function(e){e.preventDefault();e=c(this.elementRef.nativeElement);this.editService.remove(e)};var ie,l=ae;function ae(e,t,n,i,a){n=ie.call(this,t,n,null,i,a)||this;return n.editService=e,n.elementRef=t,n}l.ɵfac=d.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:l,deps:[{token:T},{token:d.ElementRef},{token:d.Renderer2},{token:g.LocalizationService},{token:d.NgZone}],target:d.ɵɵFactoryTarget.Directive}),l.ɵdir=d.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:l,selector:"[kendoListViewRemoveCommand]",host:{listeners:{click:"clickHandler($event)"}},usesInheritance:!0,ngImport:d}),d.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:l,decorators:[{type:r.Directive,args:[{selector:"[kendoListViewRemoveCommand]"}]}],ctorParameters:function(){return[{type:T},{type:d.ElementRef},{type:d.Renderer2},{type:g.LocalizationService},{type:d.NgZone}]},propDecorators:{clickHandler:[{type:r.HostListener,args:["click",["$event"]]}]}});Object.defineProperty(re.prototype,"templateContext",{set:function(e){this.insertedViewRef&&(this.viewContainerRef.remove(this.viewContainerRef.indexOf(this.insertedViewRef)),this.insertedViewRef=void 0),e.templateRef&&(this.insertedViewRef=this.viewContainerRef.createEmbeddedView(e.templateRef,e))},enumerable:!1,configurable:!0});var F=re;function re(e){this.viewContainerRef=e}F.ɵfac=d.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:F,deps:[{token:d.ViewContainerRef}],target:d.ɵɵFactoryTarget.Directive}),F.ɵdir=d.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:F,selector:"[templateContext]",inputs:{templateContext:"templateContext"},ngImport:d}),d.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:F,decorators:[{type:r.Directive,args:[{selector:"[templateContext]"}]}],ctorParameters:function(){return[{type:d.ViewContainerRef}]},propDecorators:{templateContext:[{type:r.Input}]}});var oe=[C,b,w,S],se=[m],le=[D,u,N,L,l,t],P=function(){};P.ɵfac=d.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:P,deps:[],target:d.ɵɵFactoryTarget.NgModule}),P.ɵmod=d.ɵɵngDeclareNgModule({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:P,declarations:[C,b,w,S,m,D,u,N,L,l,t,V,F,f],imports:[s.CommonModule,o.PagerModule,a.EventsModule],exports:[C,b,w,S,m,D,u,N,L,l,t,V,s.CommonModule,a.EventsModule]}),P.ɵinj=d.ɵɵngDeclareInjector({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:P,imports:[[s.CommonModule,o.PagerModule,a.EventsModule],s.CommonModule,a.EventsModule]}),d.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:d,type:P,decorators:[{type:r.NgModule,args:[{declarations:[oe,se,le,V,F,f],exports:[oe,se,le,V,s.CommonModule,a.EventsModule],imports:[s.CommonModule,o.PagerModule,a.EventsModule]}]}]}),e.AddCommandDirective=t,e.CancelCommandDirective=N,e.DataBindingDirective=m,e.EditCommandDirective=u,e.EditTemplateDirective=D,e.FooterTemplateDirective=w,e.HeaderTemplateDirective=b,e.ItemTemplateDirective=C,e.ListViewComponent=V,e.ListViewModule=P,e.LoaderTemplateDirective=S,e.PageSizeChangeEvent=B,e.RemoveCommandDirective=l,e.SaveCommandDirective=L,Object.defineProperty(e,"__esModule",{value:!0})});

esm2015/listview.component.js

@@ -275,3 +275,3 @@ /**-----------------------------------------------------------------------------------------
     /**
-     * Closes the editor for a given item ([see example]({% slug editing_template_forms_grid %}#toc-cancelling-editing)).
+     * Closes the editor for a given item ([see example]({% slug editing_template_forms_listview %}#toc-cancelling-editing)).
      *
@@ -278,0 +278,0 @@ * @param {number} index - The item index that will be switched out of the edit mode. If no index is provided, it is assumed

esm2015/package-metadata.js

@@ -12,5 +12,5 @@ /**-----------------------------------------------------------------------------------------
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1662551388,
+    publishDate: 1665572385,
     version: '',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning'
 };

listview.component.d.ts

@@ -265,3 +265,3 @@ /**-----------------------------------------------------------------------------------------
     /**
-     * Closes the editor for a given item ([see example]({% slug editing_template_forms_grid %}#toc-cancelling-editing)).
+     * Closes the editor for a given item ([see example]({% slug editing_template_forms_listview %}#toc-cancelling-editing)).
      *
@@ -268,0 +268,0 @@ * @param {number} index - The item index that will be switched out of the edit mode. If no index is provided, it is assumed

package.json

 {
   "name": "@progress/kendo-angular-listview",
-  "version": "4.0.2",
+  "version": "4.0.3-dev.202210121100",
   "description": "Kendo UI ListView component for Angular",
@@ -5,0 +5,0 @@ "license": "SEE LICENSE IN LICENSE.md",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

298609

increased by0.01%

Worsened metrics

Number of low quality alerts

2

increased by100%

No dependency changes