@progress/kendo-angular-scrollview 4.1.3-dev.202201190926 → 5.0.0-next.202202251656

package/bundles/kendo-angular-scrollview.umd.js

@@ -0,0 +1,5 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@angular/animations"),require("@progress/kendo-angular-common"),require("@progress/kendo-licensing"),require("@progress/kendo-angular-l10n"),require("@angular/common")):"function"==typeof define&&define.amd?define("KendoAngularScrollview",["exports","@angular/core","@angular/animations","@progress/kendo-angular-common","@progress/kendo-licensing","@progress/kendo-angular-l10n","@angular/common"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoAngularScrollview={},e.ng.core,e.ng.animations,e.KendoAngularCommon,e.KendoLicensing,e.KendoAngularL10N,e.ng.common)}(this,function(p,r,e,t,d,g,h){"use strict";function u(n){if(n&&n.__esModule)return n;var i=Object.create(null);return 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)}var i,n=u(r),m=u(t),v=u(g),a=u(h),y=((s=i=i||{})[s.Next=1]="Next",s[s.Prev=-1]="Prev",{name:"@progress/kendo-angular-scrollview",productName:"Kendo UI for Angular",productCodes:["KENDOUIANGULAR","KENDOUICOMPLETE"],publishDate:1645808127,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"});Object.create;function f(e,t){var n="function"==typeof Symbol&&e[Symbol.iterator];if(!n)return e;var i,a,r=n.call(e),o=[];try{for(;(void 0===t||0<t--)&&!(i=r.next()).done;)o.push(i.value)}catch(e){a={error:e}}finally{try{i&&!i.done&&(n=r.return)&&n.call(r)}finally{if(a)throw a.error}}return o}function x(e,t,n){if(n||2===arguments.length)for(var i,a=0,r=t.length;a<r;a++)!i&&a in t||((i=i||Array.prototype.slice.call(t,0,a))[a]=t[a]);return e.concat(i||Array.prototype.slice.call(t))}Object.create;var w=function(){if("function"==typeof Symbol&&Symbol.iterator)return Symbol.iterator;for(var e=Object.getOwnPropertyNames(Map.prototype),t=Map.prototype,n=0;n<e.length;++n){var i=e[n];if("entries"!==i&&"size"!==i&&t[i]===t.entries)return i}}();var I={},k=(Object.defineProperty(b.prototype,"data",{get:function(){var e=this.total;return e=this.endless?[this.source[(this.index-1+e)%e],this.source[this.index%e],this.source[(this.index+1+e)%e]]:x(x([I],f(this.source)),[I]).slice(this.index,this.index+3),null!==this.pageIndex&&(e[this.pageIndex>this.index?2:0]=this.source[this.pageIndex]),this.rtl?e.reverse():e},enumerable:!1,configurable:!0}),Object.defineProperty(b.prototype,"total",{get:function(){return this.source.length},enumerable:!1,configurable:!0}),b.prototype.canMoveNext=function(){return this.endless||this.index<this.total-1},b.prototype.canMovePrev=function(){return this.endless||0<this.index},b.prototype[w]=function(){return this.data[w]()},b);function b(e,t,n,i,a){this.rtl=!1,this.source=e||[],this.index=t||0,this.endless=n,this.pageIndex=i,this.rtl=a}Object.defineProperty(o.prototype,"length",{get:function(){return this.accessor().data.length},enumerable:!1,configurable:!0}),Object.defineProperty(o.prototype,"total",{get:function(){return this.accessor().total},enumerable:!1,configurable:!0}),o.prototype.item=function(e){return this.accessor().data[e]},o.prototype.canMoveNext=function(){return this.accessor().canMoveNext()},o.prototype.canMovePrev=function(){return this.accessor().canMovePrev()},o.prototype[Symbol.iterator]=function(){return this.accessor()[Symbol.iterator]()};var C=o;function o(e){this.accessor=e}O.prototype.itemClass=function(e){return{"k-primary":e===this.activeIndex}},O.prototype.indexChange=function(e){this.pagerIndexChange.emit(e)};var s=O;function O(){this.pagerIndexChange=new r.EventEmitter}s.ɵfac=n.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:n,type:s,deps:[],target:n.ɵɵFactoryTarget.Component}),s.ɵcmp=n.ɵɵngDeclareComponent({minVersion:"12.0.0",version:"12.2.16",type:s,selector:"kendo-scrollview-pager",inputs:{activeIndex:"activeIndex",data:"data"},outputs:{pagerIndexChange:"pagerIndexChange"},ngImport:n,template:'\n      <ul class="k-scrollview-pageable k-scrollview-nav">\n        <li class="k-button" *ngFor="let item of data; let i = index"\n            [ngClass]="itemClass(i)"\n            (click)="indexChange(i)">\n        </li>\n      </ul>\n    ',isInline:!0,directives:[{type:a.NgForOf,selector:"[ngFor][ngForOf]",inputs:["ngForOf","ngForTrackBy","ngForTemplate"]},{type:a.NgClass,selector:"[ngClass]",inputs:["class","ngClass"]}]}),n.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:n,type:s,decorators:[{type:r.Component,args:[{selector:"kendo-scrollview-pager",template:'\n      <ul class="k-scrollview-pageable k-scrollview-nav">\n        <li class="k-button" *ngFor="let item of data; let i = index"\n            [ngClass]="itemClass(i)"\n            (click)="indexChange(i)">\n        </li>\n      </ul>\n    '}]}],propDecorators:{activeIndex:[{type:r.Input}],data:[{type:r.Input}],pagerIndexChange:[{type:r.Output}]}});Object.defineProperty(c.prototype,"activeIndex",{get:function(){return this._activeIndex},set:function(e){this.index=this._activeIndex=e},enumerable:!1,configurable:!0}),Object.defineProperty(c.prototype,"scrollViewLightOverlayClass",{get:function(){return"light"===this.pagerOverlay},enumerable:!1,configurable:!0}),Object.defineProperty(c.prototype,"scrollViewDarkOverlayClass",{get:function(){return"dark"===this.pagerOverlay},enumerable:!1,configurable:!0}),Object.defineProperty(c.prototype,"hostWidth",{get:function(){return this.width},enumerable:!1,configurable:!0}),Object.defineProperty(c.prototype,"hostHeight",{get:function(){return this.height},enumerable:!1,configurable:!0}),Object.defineProperty(c.prototype,"dir",{get:function(){return this.direction},enumerable:!1,configurable:!0}),Object.defineProperty(c.prototype,"direction",{get:function(){return this.localization.rtl?"rtl":"ltr"},enumerable:!1,configurable:!0}),c.prototype.keyDown=function(e){e.keyCode===t.Keys.ArrowLeft&&(this.isRTL?this.next():this.prev()),e.keyCode===t.Keys.ArrowRight&&(this.isRTL?this.prev():this.next())},c.prototype.ngOnChanges=function(e){this.activeIndex=Math.max(Math.min(this.activeIndex,this.view.total-1),0)},c.prototype.prev=function(){this.navigate(i.Prev)},c.prototype.next=function(){this.navigate(i.Next)},c.prototype.transitionEndHandler=function(e){this.animationState=null,"left"!==e.toState&&"right"!==e.toState||(null!==this.pageIndex&&(this.activeIndex=this.pageIndex,this.pageIndex=null),this.activeIndex=this.index,this.activeIndexChange.emit(this.activeIndex),this.itemChanged.emit({index:this.activeIndex,item:this.view.item(1)}))},c.prototype.handlePress=function(e){this.initialTouchCoordinate=e.pageX},c.prototype.handleDrag=function(e){e=e.pageX-this.initialTouchCoordinate;this.animationState||this.isDragForbidden(e)||!this.draggedInsideBounds(e)||this.renderer.setStyle(this.itemWrapper.nativeElement,"transform","translateX("+e+"px)")},c.prototype.handleRelease=function(e){var t=this,n=e.pageX-this.initialTouchCoordinate;this.isDragForbidden(n)||this.ngZone.run(function(){t.draggedEnoughToNavigate(n)?(t.isRTL?t.changeIndex(n<0?i.Prev:i.Next):t.changeIndex(0<n?i.Prev:i.Next),t.animate||(t.renderer.removeStyle(t.itemWrapper.nativeElement,"transform"),t.activeIndexChange.emit(t.activeIndex),t.itemChanged.emit({index:t.activeIndex,item:t.view.item(1)}))):t.animate&&n?t.animationState="center":t.renderer.removeStyle(t.itemWrapper.nativeElement,"transform")})},c.prototype.pageChange=function(e){this.animationState||this.activeIndex===e||(this.animate?(this.pageIndex=e,this.isRTL?this.animationState=this.pageIndex>this.index?"right":"left":this.animationState=this.pageIndex>this.index?"left":"right"):this.activeIndex=e)},c.prototype.inlineListItemStyles=function(e){return{height:this.height,transform:this.transforms[e],width:"100%"}},c.prototype.displayLeftArrow=function(){var e=this.isRTL?this.activeIndex+1<this.view.total:0<this.activeIndex;return(this.endless||e)&&0<this.view.total},c.prototype.leftArrowClick=function(){this.isRTL?this.next():this.prev()},c.prototype.displayRightArrow=function(){var e=this.isRTL?0<this.activeIndex:this.activeIndex+1<this.view.total;return(this.endless||e)&&0<this.view.total},c.prototype.rightArrowClick=function(){this.isRTL?this.prev():this.next()},c.prototype.draggedInsideBounds=function(e){return Math.abs(e)<=this.element.nativeElement.offsetWidth},c.prototype.draggedEnoughToNavigate=function(e){return Math.abs(e)>this.element.nativeElement.offsetWidth/2},c.prototype.isDragForbidden=function(e){e=this.isRTL?e<0&&0!==e:0<e&&0!==e,e=0===this.activeIndex&&e||this.activeIndex===this.view.total-1&&!e;return!this.endless&&e},c.prototype.navigate=function(e){this.isDataSourceEmpty||this.animationState||(this.changeIndex(e),this.animate||(this.activeIndexChange.emit(this.activeIndex),this.itemChanged.emit({index:this.activeIndex,item:this.view.item(1)})))},c.prototype.changeIndex=function(e){e===i.Next&&this.view.canMoveNext()?(this.index=(this.index+1)%this.view.total,this.animate?this.animationState=this.isRTL?"right":"left":this.activeIndex=this.index):e===i.Prev&&this.view.canMovePrev()&&(this.index=0===this.index?this.view.total-1:this.index-1,this.animate?this.animationState=this.isRTL?"left":"right":this.activeIndex=this.index)},Object.defineProperty(c.prototype,"isRTL",{get:function(){return"rtl"===this.direction},enumerable:!1,configurable:!0});var l=c;function c(e,t,n,i){var a=this;this.element=e,this.localization=t,this.ngZone=n,this.renderer=i,this.data=[],this.endless=!1,this.pagerOverlay="none",this.animate=!0,this.pageable=!1,this.arrows=!1,this.itemChanged=new r.EventEmitter,this.activeIndexChange=new r.EventEmitter,this.scrollViewClass=!0,this.tabIndex=1,this.ariaLive="assertive",this.touchAction="pan-y pinch-zoom",this.animationState=null,this.view=new C(function(){return new k(a.data,a.activeIndex,a.endless,a.pageIndex,a.isRTL)}),this.isDataSourceEmpty=!1,this._activeIndex=0,this.index=0,this.pageIndex=null,this.transforms=["translateX(-100%)","translateX(0%)","translateX(100%)"],d.validatePackage(y)}l.ɵfac=n.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:n,type:l,deps:[{token:n.ElementRef},{token:v.LocalizationService},{token:n.NgZone},{token:n.Renderer2}],target:n.ɵɵFactoryTarget.Component}),l.ɵcmp=n.ɵɵngDeclareComponent({minVersion:"12.0.0",version:"12.2.16",type:l,selector:"kendo-scrollview",inputs:{data:"data",activeIndex:"activeIndex",width:"width",height:"height",endless:"endless",pagerOverlay:"pagerOverlay",animate:"animate",pageable:"pageable",arrows:"arrows"},outputs:{itemChanged:"itemChanged",activeIndexChange:"activeIndexChange"},host:{listeners:{keydown:"keyDown($event)"},properties:{"class.k-scrollview":"this.scrollViewClass","class.k-scrollview-light":"this.scrollViewLightOverlayClass","class.k-scrollview-dark":"this.scrollViewDarkOverlayClass","style.width":"this.hostWidth","style.height":"this.hostHeight","attr.tabindex":"this.tabIndex","attr.aria-live":"this.ariaLive","attr.dir":"this.dir","style.touch-action":"this.touchAction"}},providers:[g.LocalizationService,{provide:g.L10N_PREFIX,useValue:"kendo.scrollview"}],queries:[{propertyName:"itemTemplateRef",first:!0,predicate:r.TemplateRef,descendants:!0}],viewQueries:[{propertyName:"itemWrapper",first:!0,predicate:["itemWrapper"],descendants:!0}],exportAs:["kendoScrollView"],usesOnChanges:!0,ngImport:n,template:'\n        <ul class=\'k-scrollview-wrap\'\n            #itemWrapper\n            [@animateTo]="animationState"\n            (@animateTo.done)="transitionEndHandler($event)"\n            kendoDraggable\n            (kendoDrag)="handleDrag($event)"\n            (kendoPress)="handlePress($event)"\n            (kendoRelease)="handleRelease($event)"\n        >\n            <li\n                *ngFor="let item of view;let i=index"\n                [ngStyle]="inlineListItemStyles(i)"\n                [attr.aria-hidden]="i !== 1"\n            >\n                <ng-template\n                    [ngTemplateOutlet]="itemTemplateRef"\n                    [ngTemplateOutletContext]="{ item: item }">\n                </ng-template>\n            </li>\n      </ul>\n        <div class=\'k-scrollview-elements\'\n            [ngStyle]="{\'height\': height}"\n            *ngIf="!isDataSourceEmpty && (pageable||arrows)">\n\n            <a class="k-scrollview-prev"\n                aria-label="previous"\n                *ngIf="arrows && displayLeftArrow()"\n                (click)="leftArrowClick()">\n                <span class="k-icon k-i-arrowhead-w"></span>\n            </a>\n            <a class="k-scrollview-next"\n                aria-label="next"\n                *ngIf="arrows && displayRightArrow()"\n                (click)="rightArrowClick()">\n                <span class="k-icon k-i-arrowhead-e"></span>\n            </a>\n            <kendo-scrollview-pager\n                class=\'k-scrollview-nav-wrap\'\n                *ngIf="pageable"\n                (pagerIndexChange)="pageChange($event)"\n                [data]="data"\n                [activeIndex]="activeIndex">\n            </kendo-scrollview-pager>\n        </div>\n    ',isInline:!0,components:[{type:s,selector:"kendo-scrollview-pager",inputs:["activeIndex","data"],outputs:["pagerIndexChange"]}],directives:[{type:m.DraggableDirective,selector:"[kendoDraggable]",inputs:["enableDrag"],outputs:["kendoPress","kendoDrag","kendoRelease"]},{type:a.NgForOf,selector:"[ngFor][ngForOf]",inputs:["ngForOf","ngForTrackBy","ngForTemplate"]},{type:a.NgStyle,selector:"[ngStyle]",inputs:["ngStyle"]},{type:a.NgTemplateOutlet,selector:"[ngTemplateOutlet]",inputs:["ngTemplateOutletContext","ngTemplateOutlet"]},{type:a.NgIf,selector:"[ngIf]",inputs:["ngIf","ngIfThen","ngIfElse"]}],animations:[e.trigger("animateTo",[e.state("center, left, right",e.style({transform:"translateX(0)"})),e.transition("* => right",[e.animate("300ms ease-out",e.style({transform:"translateX(100%)"}))]),e.transition("* => left",[e.animate("300ms ease-out",e.style({transform:"translateX(-100%)"}))]),e.transition("* => center",[e.animate("300ms ease-out")])])]}),n.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:n,type:l,decorators:[{type:r.Component,args:[{animations:[e.trigger("animateTo",[e.state("center, left, right",e.style({transform:"translateX(0)"})),e.transition("* => right",[e.animate("300ms ease-out",e.style({transform:"translateX(100%)"}))]),e.transition("* => left",[e.animate("300ms ease-out",e.style({transform:"translateX(-100%)"}))]),e.transition("* => center",[e.animate("300ms ease-out")])])],exportAs:"kendoScrollView",providers:[g.LocalizationService,{provide:g.L10N_PREFIX,useValue:"kendo.scrollview"}],selector:"kendo-scrollview",template:'\n        <ul class=\'k-scrollview-wrap\'\n            #itemWrapper\n            [@animateTo]="animationState"\n            (@animateTo.done)="transitionEndHandler($event)"\n            kendoDraggable\n            (kendoDrag)="handleDrag($event)"\n            (kendoPress)="handlePress($event)"\n            (kendoRelease)="handleRelease($event)"\n        >\n            <li\n                *ngFor="let item of view;let i=index"\n                [ngStyle]="inlineListItemStyles(i)"\n                [attr.aria-hidden]="i !== 1"\n            >\n                <ng-template\n                    [ngTemplateOutlet]="itemTemplateRef"\n                    [ngTemplateOutletContext]="{ item: item }">\n                </ng-template>\n            </li>\n      </ul>\n        <div class=\'k-scrollview-elements\'\n            [ngStyle]="{\'height\': height}"\n            *ngIf="!isDataSourceEmpty && (pageable||arrows)">\n\n            <a class="k-scrollview-prev"\n                aria-label="previous"\n                *ngIf="arrows && displayLeftArrow()"\n                (click)="leftArrowClick()">\n                <span class="k-icon k-i-arrowhead-w"></span>\n            </a>\n            <a class="k-scrollview-next"\n                aria-label="next"\n                *ngIf="arrows && displayRightArrow()"\n                (click)="rightArrowClick()">\n                <span class="k-icon k-i-arrowhead-e"></span>\n            </a>\n            <kendo-scrollview-pager\n                class=\'k-scrollview-nav-wrap\'\n                *ngIf="pageable"\n                (pagerIndexChange)="pageChange($event)"\n                [data]="data"\n                [activeIndex]="activeIndex">\n            </kendo-scrollview-pager>\n        </div>\n    '}]}],ctorParameters:function(){return[{type:n.ElementRef},{type:v.LocalizationService},{type:n.NgZone},{type:n.Renderer2}]},propDecorators:{data:[{type:r.Input}],activeIndex:[{type:r.Input}],width:[{type:r.Input}],height:[{type:r.Input}],endless:[{type:r.Input}],pagerOverlay:[{type:r.Input}],animate:[{type:r.Input}],pageable:[{type:r.Input}],arrows:[{type:r.Input}],itemChanged:[{type:r.Output}],activeIndexChange:[{type:r.Output}],itemTemplateRef:[{type:r.ContentChild,args:[r.TemplateRef,{static:!1}]}],itemWrapper:[{type:r.ViewChild,args:["itemWrapper",{static:!1}]}],scrollViewClass:[{type:r.HostBinding,args:["class.k-scrollview"]}],scrollViewLightOverlayClass:[{type:r.HostBinding,args:["class.k-scrollview-light"]}],scrollViewDarkOverlayClass:[{type:r.HostBinding,args:["class.k-scrollview-dark"]}],hostWidth:[{type:r.HostBinding,args:["style.width"]}],hostHeight:[{type:r.HostBinding,args:["style.height"]}],tabIndex:[{type:r.HostBinding,args:["attr.tabindex"]}],ariaLive:[{type:r.HostBinding,args:["attr.aria-live"]}],dir:[{type:r.HostBinding,args:["attr.dir"]}],touchAction:[{type:r.HostBinding,args:["style.touch-action"]}],keyDown:[{type:r.HostListener,args:["keydown",["$event"]]}]}});m=[l,s],a=[l],e=function(){};e.ɵfac=n.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:n,type:e,deps:[],target:n.ɵɵFactoryTarget.NgModule}),e.ɵmod=n.ɵɵngDeclareNgModule({minVersion:"12.0.0",version:"12.2.16",ngImport:n,type:e,declarations:[l,s],imports:[h.CommonModule,t.DraggableModule],exports:[l]}),e.ɵinj=n.ɵɵngDeclareInjector({minVersion:"12.0.0",version:"12.2.16",ngImport:n,type:e,imports:[[h.CommonModule,t.DraggableModule]]}),n.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:n,type:e,decorators:[{type:r.NgModule,args:[{declarations:[m],exports:[a],imports:[h.CommonModule,t.DraggableModule]}]}]}),p.ScrollViewComponent=l,p.ScrollViewModule=e,p.ScrollViewPagerComponent=s,Object.defineProperty(p,"__esModule",{value:!0})});

package/{dist/es2015/data.collection.d.ts → data.collection.d.ts}

@@ -12,8 +12,8 @@ export declare class DataResultIterator {
     private pageIndex;
     private rtl;
     constructor(source: any[], index: number, endless: boolean, pageIndex: number, rtl: boolean);
-    readonly data: any[];
-    readonly total: number;
+    get data(): any[];
+    get total(): number;
     canMoveNext(): boolean;
     canMovePrev(): boolean;
 }
@@ -23,8 +23,8 @@ export declare class DataResultIterator {
 export declare class DataCollection {
     private accessor;
     constructor(accessor: () => DataResultIterator);
-    readonly length: number;
-    readonly total: number;
+    get length(): number;
+    get total(): number;
     item(index: number): any;
     canMoveNext(): boolean;
     canMovePrev(): boolean;

package/{dist/es2015 → esm2015}/change-event-args.js

@@ -2,3 +2,4 @@
 * Copyright © 2021 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
+export {};

package/{dist/es2015 → esm2015}/data.collection.js

@@ -2,7 +2,7 @@
 * Copyright © 2021 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
-/* tslint:disable:use-life-cycle-interface */
+/* eslint-disable use-life-cycle-interface */
 /** @hidden */
 const iterator = getIterator();
 // TODO: Move to kendo-common

package/{dist/es → esm2015}/direction.js

@@ -2,3 +2,4 @@
 * Copyright © 2021 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
+export {};

package/{dist/es2015 → esm2015}/package-metadata.js

@@ -9,7 +9,7 @@ export const packageMetadata = {
     name: '@progress/kendo-angular-scrollview',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1642584306,
+    publishDate: 1645808127,
     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'
 };

package/esm2015/scrollview-pager.component.js

@@ -0,0 +1,53 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { Component, Input, Output } from '@angular/core';
+import { EventEmitter } from '@angular/core';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/common";
+/**
+ * @hidden
+ */
+export class ScrollViewPagerComponent {
+    constructor() {
+        this.pagerIndexChange = new EventEmitter();
+    }
+    itemClass(idx) {
+        return {
+            'k-primary': idx === this.activeIndex
+        };
+    }
+    indexChange(selectedIndex) {
+        this.pagerIndexChange.emit(selectedIndex);
+    }
+}
+ScrollViewPagerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ScrollViewPagerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+ScrollViewPagerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ScrollViewPagerComponent, selector: "kendo-scrollview-pager", inputs: { activeIndex: "activeIndex", data: "data" }, outputs: { pagerIndexChange: "pagerIndexChange" }, ngImport: i0, template: `
+      <ul class="k-scrollview-pageable k-scrollview-nav">
+        <li class="k-button" *ngFor="let item of data; let i = index"
+            [ngClass]="itemClass(i)"
+            (click)="indexChange(i)">
+        </li>
+      </ul>
+    `, isInline: true, directives: [{ type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ScrollViewPagerComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'kendo-scrollview-pager',
+                    template: `
+      <ul class="k-scrollview-pageable k-scrollview-nav">
+        <li class="k-button" *ngFor="let item of data; let i = index"
+            [ngClass]="itemClass(i)"
+            (click)="indexChange(i)">
+        </li>
+      </ul>
+    `
+                }]
+        }], propDecorators: { activeIndex: [{
+                type: Input
+            }], data: [{
+                type: Input
+            }], pagerIndexChange: [{
+                type: Output
+            }] } });

package/{dist/es2015 → esm2015}/scrollview.component.js

@@ -2,8 +2,7 @@
 * Copyright © 2021 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
-import * as tslib_1 from "tslib";
-import { Component, ContentChild, ElementRef, EventEmitter, HostBinding, HostListener, Input, Output, TemplateRef, NgZone, ViewChild, Renderer2 } from '@angular/core';
+import { Component, ContentChild, EventEmitter, HostBinding, HostListener, Input, Output, TemplateRef, ViewChild } from '@angular/core';
 import { animate, state, style, transition, trigger } from '@angular/animations';
 import { Dir } from './enums';
 import { Keys } from '@progress/kendo-angular-common';
@@ -11,6 +10,11 @@ import { validatePackage } from '@progress/kendo-licensing';
 import { packageMetadata } from './package-metadata';
 import { DataCollection, DataResultIterator } from './data.collection';
 import { LocalizationService, L10N_PREFIX } from '@progress/kendo-angular-l10n';
+import * as i0 from "@angular/core";
+import * as i1 from "@progress/kendo-angular-l10n";
+import * as i2 from "./scrollview-pager.component";
+import * as i3 from "@progress/kendo-angular-common";
+import * as i4 from "@angular/common";
 /**
  * Represents the [Kendo UI ScrollView component for Angular]({% slug overview_scrollview %}).
  *
@@ -64,7 +68,7 @@ import { LocalizationService, L10N_PREFIX } from '@progress/kendo-angular-l10n';
  * }
  * ```
  */
-let ScrollViewComponent = class ScrollViewComponent {
+export class ScrollViewComponent {
     constructor(element, localization, ngZone, renderer) {
         this.element = element;
         this.localization = localization;
@@ -370,133 +374,100 @@ let ScrollViewComponent = class ScrollViewComponent {
     get isRTL() {
         return this.direction === 'rtl';
     }
-};
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", Array)
-], ScrollViewComponent.prototype, "data", void 0);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", Number),
-    tslib_1.__metadata("design:paramtypes", [Number])
-], ScrollViewComponent.prototype, "activeIndex", null);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", String)
-], ScrollViewComponent.prototype, "width", void 0);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", String)
-], ScrollViewComponent.prototype, "height", void 0);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", Boolean)
-], ScrollViewComponent.prototype, "endless", void 0);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", String)
-], ScrollViewComponent.prototype, "pagerOverlay", void 0);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", Boolean)
-], ScrollViewComponent.prototype, "animate", void 0);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", Boolean)
-], ScrollViewComponent.prototype, "pageable", void 0);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", Boolean)
-], ScrollViewComponent.prototype, "arrows", void 0);
-tslib_1.__decorate([
-    Output(),
-    tslib_1.__metadata("design:type", EventEmitter)
-], ScrollViewComponent.prototype, "itemChanged", void 0);
-tslib_1.__decorate([
-    Output(),
-    tslib_1.__metadata("design:type", EventEmitter)
-], ScrollViewComponent.prototype, "activeIndexChange", void 0);
-tslib_1.__decorate([
-    ContentChild(TemplateRef, { static: false }),
-    tslib_1.__metadata("design:type", TemplateRef)
-], ScrollViewComponent.prototype, "itemTemplateRef", void 0);
-tslib_1.__decorate([
-    ViewChild('itemWrapper', { static: false }),
-    tslib_1.__metadata("design:type", ElementRef)
-], ScrollViewComponent.prototype, "itemWrapper", void 0);
-tslib_1.__decorate([
-    HostBinding('class.k-scrollview'),
-    tslib_1.__metadata("design:type", Boolean)
-], ScrollViewComponent.prototype, "scrollViewClass", void 0);
-tslib_1.__decorate([
-    HostBinding('class.k-scrollview-light'),
-    tslib_1.__metadata("design:type", Boolean),
-    tslib_1.__metadata("design:paramtypes", [])
-], ScrollViewComponent.prototype, "scrollViewLightOverlayClass", null);
-tslib_1.__decorate([
-    HostBinding('class.k-scrollview-dark'),
-    tslib_1.__metadata("design:type", Boolean),
-    tslib_1.__metadata("design:paramtypes", [])
-], ScrollViewComponent.prototype, "scrollViewDarkOverlayClass", null);
-tslib_1.__decorate([
-    HostBinding('style.width'),
-    tslib_1.__metadata("design:type", String),
-    tslib_1.__metadata("design:paramtypes", [])
-], ScrollViewComponent.prototype, "hostWidth", null);
-tslib_1.__decorate([
-    HostBinding('style.height'),
-    tslib_1.__metadata("design:type", String),
-    tslib_1.__metadata("design:paramtypes", [])
-], ScrollViewComponent.prototype, "hostHeight", null);
-tslib_1.__decorate([
-    HostBinding('attr.tabindex'),
-    tslib_1.__metadata("design:type", Number)
-], ScrollViewComponent.prototype, "tabIndex", void 0);
-tslib_1.__decorate([
-    HostBinding('attr.aria-live'),
-    tslib_1.__metadata("design:type", String)
-], ScrollViewComponent.prototype, "ariaLive", void 0);
-tslib_1.__decorate([
-    HostBinding('attr.dir'),
-    tslib_1.__metadata("design:type", String),
-    tslib_1.__metadata("design:paramtypes", [])
-], ScrollViewComponent.prototype, "dir", null);
-tslib_1.__decorate([
-    HostBinding('style.touch-action'),
-    tslib_1.__metadata("design:type", String)
-], ScrollViewComponent.prototype, "touchAction", void 0);
-tslib_1.__decorate([
-    HostListener('keydown', ['$event']),
-    tslib_1.__metadata("design:type", Function),
-    tslib_1.__metadata("design:paramtypes", [Object]),
-    tslib_1.__metadata("design:returntype", void 0)
-], ScrollViewComponent.prototype, "keyDown", null);
-ScrollViewComponent = tslib_1.__decorate([
-    Component({
-        animations: [
-            trigger('animateTo', [
-                state('center, left, right', style({ transform: 'translateX(0)' })),
-                transition('* => right', [
-                    animate('300ms ease-out', style({ transform: 'translateX(100%)' }))
-                ]),
-                transition('* => left', [
-                    animate('300ms ease-out', style({ transform: 'translateX(-100%)' }))
-                ]),
-                transition('* => center', [
-                    animate('300ms ease-out')
-                ])
+}
+ScrollViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ScrollViewComponent, deps: [{ token: i0.ElementRef }, { token: i1.LocalizationService }, { token: i0.NgZone }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
+ScrollViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ScrollViewComponent, selector: "kendo-scrollview", inputs: { data: "data", activeIndex: "activeIndex", width: "width", height: "height", endless: "endless", pagerOverlay: "pagerOverlay", animate: "animate", pageable: "pageable", arrows: "arrows" }, outputs: { itemChanged: "itemChanged", activeIndexChange: "activeIndexChange" }, host: { listeners: { "keydown": "keyDown($event)" }, properties: { "class.k-scrollview": "this.scrollViewClass", "class.k-scrollview-light": "this.scrollViewLightOverlayClass", "class.k-scrollview-dark": "this.scrollViewDarkOverlayClass", "style.width": "this.hostWidth", "style.height": "this.hostHeight", "attr.tabindex": "this.tabIndex", "attr.aria-live": "this.ariaLive", "attr.dir": "this.dir", "style.touch-action": "this.touchAction" } }, providers: [
+        LocalizationService,
+        {
+            provide: L10N_PREFIX,
+            useValue: 'kendo.scrollview'
+        }
+    ], queries: [{ propertyName: "itemTemplateRef", first: true, predicate: TemplateRef, descendants: true }], viewQueries: [{ propertyName: "itemWrapper", first: true, predicate: ["itemWrapper"], descendants: true }], exportAs: ["kendoScrollView"], usesOnChanges: true, ngImport: i0, template: `
+        <ul class='k-scrollview-wrap'
+            #itemWrapper
+            [@animateTo]="animationState"
+            (@animateTo.done)="transitionEndHandler($event)"
+            kendoDraggable
+            (kendoDrag)="handleDrag($event)"
+            (kendoPress)="handlePress($event)"
+            (kendoRelease)="handleRelease($event)"
+        >
+            <li
+                *ngFor="let item of view;let i=index"
+                [ngStyle]="inlineListItemStyles(i)"
+                [attr.aria-hidden]="i !== 1"
+            >
+                <ng-template
+                    [ngTemplateOutlet]="itemTemplateRef"
+                    [ngTemplateOutletContext]="{ item: item }">
+                </ng-template>
+            </li>
+      </ul>
+        <div class='k-scrollview-elements'
+            [ngStyle]="{'height': height}"
+            *ngIf="!isDataSourceEmpty && (pageable||arrows)">
+
+            <a class="k-scrollview-prev"
+                aria-label="previous"
+                *ngIf="arrows && displayLeftArrow()"
+                (click)="leftArrowClick()">
+                <span class="k-icon k-i-arrowhead-w"></span>
+            </a>
+            <a class="k-scrollview-next"
+                aria-label="next"
+                *ngIf="arrows && displayRightArrow()"
+                (click)="rightArrowClick()">
+                <span class="k-icon k-i-arrowhead-e"></span>
+            </a>
+            <kendo-scrollview-pager
+                class='k-scrollview-nav-wrap'
+                *ngIf="pageable"
+                (pagerIndexChange)="pageChange($event)"
+                [data]="data"
+                [activeIndex]="activeIndex">
+            </kendo-scrollview-pager>
+        </div>
+    `, isInline: true, components: [{ type: i2.ScrollViewPagerComponent, selector: "kendo-scrollview-pager", inputs: ["activeIndex", "data"], outputs: ["pagerIndexChange"] }], directives: [{ type: i3.DraggableDirective, selector: "[kendoDraggable]", inputs: ["enableDrag"], outputs: ["kendoPress", "kendoDrag", "kendoRelease"] }, { type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], animations: [
+        trigger('animateTo', [
+            state('center, left, right', style({ transform: 'translateX(0)' })),
+            transition('* => right', [
+                animate('300ms ease-out', style({ transform: 'translateX(100%)' }))
+            ]),
+            transition('* => left', [
+                animate('300ms ease-out', style({ transform: 'translateX(-100%)' }))
+            ]),
+            transition('* => center', [
+                animate('300ms ease-out')
             ])
-        ],
-        exportAs: 'kendoScrollView',
-        providers: [
-            LocalizationService,
-            {
-                provide: L10N_PREFIX,
-                useValue: 'kendo.scrollview'
-            }
-        ],
-        selector: 'kendo-scrollview',
-        template: `
+        ])
+    ] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ScrollViewComponent, decorators: [{
+            type: Component,
+            args: [{
+                    animations: [
+                        trigger('animateTo', [
+                            state('center, left, right', style({ transform: 'translateX(0)' })),
+                            transition('* => right', [
+                                animate('300ms ease-out', style({ transform: 'translateX(100%)' }))
+                            ]),
+                            transition('* => left', [
+                                animate('300ms ease-out', style({ transform: 'translateX(-100%)' }))
+                            ]),
+                            transition('* => center', [
+                                animate('300ms ease-out')
+                            ])
+                        ])
+                    ],
+                    exportAs: 'kendoScrollView',
+                    providers: [
+                        LocalizationService,
+                        {
+                            provide: L10N_PREFIX,
+                            useValue: 'kendo.scrollview'
+                        }
+                    ],
+                    selector: 'kendo-scrollview',
+                    template: `
         <ul class='k-scrollview-wrap'
             #itemWrapper
             [@animateTo]="animationState"
@@ -542,10 +513,63 @@ ScrollViewComponent = tslib_1.__decorate([
             </kendo-scrollview-pager>
         </div>
     `
-    }),
-    tslib_1.__metadata("design:paramtypes", [ElementRef,
-        LocalizationService,
-        NgZone,
-        Renderer2])
-], ScrollViewComponent);
-export { ScrollViewComponent };
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1.LocalizationService }, { type: i0.NgZone }, { type: i0.Renderer2 }]; }, propDecorators: { data: [{
+                type: Input
+            }], activeIndex: [{
+                type: Input
+            }], width: [{
+                type: Input
+            }], height: [{
+                type: Input
+            }], endless: [{
+                type: Input
+            }], pagerOverlay: [{
+                type: Input
+            }], animate: [{
+                type: Input
+            }], pageable: [{
+                type: Input
+            }], arrows: [{
+                type: Input
+            }], itemChanged: [{
+                type: Output
+            }], activeIndexChange: [{
+                type: Output
+            }], itemTemplateRef: [{
+                type: ContentChild,
+                args: [TemplateRef, { static: false }]
+            }], itemWrapper: [{
+                type: ViewChild,
+                args: ['itemWrapper', { static: false }]
+            }], scrollViewClass: [{
+                type: HostBinding,
+                args: ['class.k-scrollview']
+            }], scrollViewLightOverlayClass: [{
+                type: HostBinding,
+                args: ['class.k-scrollview-light']
+            }], scrollViewDarkOverlayClass: [{
+                type: HostBinding,
+                args: ['class.k-scrollview-dark']
+            }], hostWidth: [{
+                type: HostBinding,
+                args: ['style.width']
+            }], hostHeight: [{
+                type: HostBinding,
+                args: ['style.height']
+            }], tabIndex: [{
+                type: HostBinding,
+                args: ['attr.tabindex']
+            }], ariaLive: [{
+                type: HostBinding,
+                args: ['attr.aria-live']
+            }], dir: [{
+                type: HostBinding,
+                args: ['attr.dir']
+            }], touchAction: [{
+                type: HostBinding,
+                args: ['style.touch-action']
+            }], keyDown: [{
+                type: HostListener,
+                args: ['keydown', ['$event']]
+            }] } });

package/{dist/es2015 → esm2015}/scrollview.module.js

@@ -2,12 +2,12 @@
 * Copyright © 2021 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
-import * as tslib_1 from "tslib";
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { ScrollViewComponent } from './scrollview.component';
 import { ScrollViewPagerComponent } from "./scrollview-pager.component";
 import { DraggableModule } from '@progress/kendo-angular-common';
+import * as i0 from "@angular/core";
 const DECLARATIONS = [
     ScrollViewComponent,
     ScrollViewPagerComponent
@@ -46,13 +46,17 @@ const EXPORTS = [
  *
  * ```
  */
-let ScrollViewModule = class ScrollViewModule {
-};
-ScrollViewModule = tslib_1.__decorate([
-    NgModule({
-        declarations: [DECLARATIONS],
-        exports: [EXPORTS],
-        imports: [CommonModule, DraggableModule]
-    })
-], ScrollViewModule);
-export { ScrollViewModule };
+export class ScrollViewModule {
+}
+ScrollViewModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ScrollViewModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+ScrollViewModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ScrollViewModule, declarations: [ScrollViewComponent,
+        ScrollViewPagerComponent], imports: [CommonModule, DraggableModule], exports: [ScrollViewComponent] });
+ScrollViewModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ScrollViewModule, imports: [[CommonModule, DraggableModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ScrollViewModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [DECLARATIONS],
+                    exports: [EXPORTS],
+                    imports: [CommonModule, DraggableModule]
+                }]
+        }] });