@progress/kendo-angular-scrollview 4.0.3 → 4.1.1-dev.202110290741

package/dist/npm/scrollview-pager.component.js

@@ -1,5 +1,5 @@
 /**-----------------------------------------------------------------------------------------
-* Copyright © 2020 Progress Software Corporation. All rights reserved.
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 "use strict";

package/dist/npm/scrollview.component.js

@@ -1,5 +1,5 @@
 /**-----------------------------------------------------------------------------------------
-* Copyright © 2020 Progress Software Corporation. All rights reserved.
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 "use strict";
@@ -83,6 +83,11 @@ var ScrollViewComponent = /** @class */ (function () {
          * and the endless scrolling mode is disabled.
          */
         this.endless = false;
+        /**
+         * Sets `pagerOverlay` to one of three possible values: `dark`, `light` or `none`.
+         * By default, the pager overlay is set to `none`.
+         */
+        this.pagerOverlay = 'none';
         /**
          * Enables or disables the built-in animations ([see example]({% slug animations_scrollview %})).
          * By default, `animate` is set to `true` and animations are enabled.
@@ -102,6 +107,10 @@ var ScrollViewComponent = /** @class */ (function () {
          * Fires after the current item is changed.
          */
         this.itemChanged = new core_1.EventEmitter();
+        /**
+         * Fires after the activeIndex has changed. Allows for two-way binding of the activeIndex property.
+         */
+        this.activeIndexChange = new core_1.EventEmitter();
         this.touchAction = 'pan-y pinch-zoom';
         this.animationState = null;
         this.transitionStyle = null;
@@ -142,6 +151,20 @@ var ScrollViewComponent = /** @class */ (function () {
         enumerable: true,
         configurable: true
     });
+    Object.defineProperty(ScrollViewComponent.prototype, "scrollViewLightOverlayClass", {
+        get: function () {
+            return this.pagerOverlay === 'light';
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(ScrollViewComponent.prototype, "scrollViewDarkOverlayClass", {
+        get: function () {
+            return this.pagerOverlay === 'dark';
+        },
+        enumerable: true,
+        configurable: true
+    });
     Object.defineProperty(ScrollViewComponent.prototype, "hostWidth", {
         get: function () { return this.width; },
         enumerable: true,
@@ -227,6 +250,7 @@ var ScrollViewComponent = /** @class */ (function () {
                 this.pageIndex = null;
             }
             this.activeIndex = this.index;
+            this.activeIndexChange.emit(this.activeIndex);
             this.itemChanged.emit({ index: this.activeIndex, item: this.view.item(1) });
             this.application.tick();
         }
@@ -269,6 +293,7 @@ var ScrollViewComponent = /** @class */ (function () {
                 }
                 if (!_this.animate) {
                     _this.transitionStyle = null;
+                    _this.activeIndexChange.emit(_this.activeIndex);
                     _this.itemChanged.emit({ index: _this.activeIndex, item: _this.view.item(1) });
                 }
             }
@@ -383,6 +408,7 @@ var ScrollViewComponent = /** @class */ (function () {
         }
         this.changeIndex(direction);
         if (!this.animate) {
+            this.activeIndexChange.emit(this.activeIndex);
             this.itemChanged.emit({ index: this.activeIndex, item: this.view.item(1) });
         }
     };
@@ -434,6 +460,10 @@ var ScrollViewComponent = /** @class */ (function () {
         core_1.Input(),
         tslib_1.__metadata("design:type", Boolean)
     ], ScrollViewComponent.prototype, "endless", void 0);
+    tslib_1.__decorate([
+        core_1.Input(),
+        tslib_1.__metadata("design:type", String)
+    ], ScrollViewComponent.prototype, "pagerOverlay", void 0);
     tslib_1.__decorate([
         core_1.Input(),
         tslib_1.__metadata("design:type", Boolean)
@@ -450,6 +480,10 @@ var ScrollViewComponent = /** @class */ (function () {
         core_1.Output(),
         tslib_1.__metadata("design:type", core_1.EventEmitter)
     ], ScrollViewComponent.prototype, "itemChanged", void 0);
+    tslib_1.__decorate([
+        core_1.Output(),
+        tslib_1.__metadata("design:type", core_1.EventEmitter)
+    ], ScrollViewComponent.prototype, "activeIndexChange", void 0);
     tslib_1.__decorate([
         core_1.ContentChild(core_1.TemplateRef, { static: false }),
         tslib_1.__metadata("design:type", core_1.TemplateRef)
@@ -464,6 +498,16 @@ var ScrollViewComponent = /** @class */ (function () {
         tslib_1.__metadata("design:type", Boolean),
         tslib_1.__metadata("design:paramtypes", [])
     ], ScrollViewComponent.prototype, "scrollViewClass", null);
+    tslib_1.__decorate([
+        core_1.HostBinding('class.k-scrollview-light'),
+        tslib_1.__metadata("design:type", Boolean),
+        tslib_1.__metadata("design:paramtypes", [])
+    ], ScrollViewComponent.prototype, "scrollViewLightOverlayClass", null);
+    tslib_1.__decorate([
+        core_1.HostBinding('class.k-scrollview-dark'),
+        tslib_1.__metadata("design:type", Boolean),
+        tslib_1.__metadata("design:paramtypes", [])
+    ], ScrollViewComponent.prototype, "scrollViewDarkOverlayClass", null);
     tslib_1.__decorate([
         core_1.HostBinding('style.width'),
         tslib_1.__metadata("design:type", String),

package/dist/npm/scrollview.module.js

@@ -1,5 +1,5 @@
 /**-----------------------------------------------------------------------------------------
-* Copyright © 2020 Progress Software Corporation. All rights reserved.
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 "use strict";

package/dist/systemjs/kendo-angular-scrollview.js

@@ -1,5 +1,5 @@
 /**-----------------------------------------------------------------------------------------
-* Copyright © 2020 Progress Software Corporation. All rights reserved.
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
-System.register("@progress/kendo-angular-scrollview",["@angular/core","@progress/kendo-angular-common","@angular/common","tslib","@angular/animations","@progress/kendo-angular-l10n","@progress/kendo-licensing"],function(o){var r,s,l,d,c,p,u;function t(e){return e.__useDefault?e.default:e}return{setters:[function(e){r=t(e)},function(e){s=t(e)},function(e){l=t(e)},function(e){d=t(e)},function(e){c=t(e)},function(e){p=t(e)},function(e){u=t(e)}],execute:function(){function i(e){if(a[e])return a[e].exports;var t=a[e]={i:e,l:!1,exports:{}};return n[e].call(t.exports,t,t.exports,i),t.l=!0,t.exports}var n,a;a={},i.m=n=[function(e,t){e.exports=r},function(e,t){e.exports=d},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var i=n(1),a=n(0),o=n(0),a=(r.prototype.itemClass=function(e){return{"k-primary":e===this.activeIndex}},r.prototype.indexChange=function(e){this.pagerIndexChange.emit(e)},i.__decorate([a.Input(),i.__metadata("design:type",Number)],r.prototype,"activeIndex",void 0),i.__decorate([a.Input(),i.__metadata("design:type",Array)],r.prototype,"data",void 0),i.__decorate([a.Output(),i.__metadata("design:type",o.EventEmitter)],r.prototype,"pagerIndexChange",void 0),i.__decorate([a.Component({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    '})],r));function r(){this.pagerIndexChange=new o.EventEmitter}t.ScrollViewPagerComponent=a},function(e,t){e.exports=s},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var i=n(1),o=n(0),a=n(12),r=n(11),s=n(3),l=n(10),d=n(9),c=n(8),n=n(7),n=(Object.defineProperty(p.prototype,"activeIndex",{get:function(){return this._activeIndex},set:function(e){this.index=this._activeIndex=e},enumerable:!0,configurable:!0}),Object.defineProperty(p.prototype,"widgetClass",{get:function(){return!0},enumerable:!0,configurable:!0}),Object.defineProperty(p.prototype,"scrollViewClass",{get:function(){return!0},enumerable:!0,configurable:!0}),Object.defineProperty(p.prototype,"hostWidth",{get:function(){return this.width},enumerable:!0,configurable:!0}),Object.defineProperty(p.prototype,"hostHeight",{get:function(){return this.height},enumerable:!0,configurable:!0}),Object.defineProperty(p.prototype,"tabIndex",{get:function(){return 1},enumerable:!0,configurable:!0}),Object.defineProperty(p.prototype,"ariaLive",{get:function(){return"assertive"},enumerable:!0,configurable:!0}),Object.defineProperty(p.prototype,"dir",{get:function(){return this.direction},enumerable:!0,configurable:!0}),Object.defineProperty(p.prototype,"direction",{get:function(){return this.localization.rtl?"rtl":"ltr"},enumerable:!0,configurable:!0}),p.prototype.keyDown=function(e){e.keyCode===s.Keys.ArrowLeft&&(this.isRTL?this.next():this.prev()),e.keyCode===s.Keys.ArrowRight&&(this.isRTL?this.prev():this.next())},p.prototype.ngOnChanges=function(e){this.activeIndex=Math.max(Math.min(this.activeIndex,this.view.total-1),0)},p.prototype.prev=function(){this.navigate(r.Dir.Prev)},p.prototype.next=function(){this.navigate(r.Dir.Next)},p.prototype.transitionEndHandler=function(e){this.animationState=null,this.transitionStyle=null,"left"!==e.toState&&"right"!==e.toState||(null!==this.pageIndex&&(this.activeIndex=this.pageIndex,this.pageIndex=null),this.activeIndex=this.index,this.itemChanged.emit({index:this.activeIndex,item:this.view.item(1)}),this.application.tick())},p.prototype.handlePress=function(e){this.initialTouchCoordinate=e.pageX},p.prototype.handleDrag=function(e){var t=this,n=e.pageX-this.initialTouchCoordinate;this.animationState||this.isDragForbidden(n)||!this.draggedInsideBounds(n)||this.ngZone.run(function(){t.transitionStyle="translateX("+n+"px)"})},p.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?r.Dir.Prev:r.Dir.Next):t.changeIndex(0<n?r.Dir.Prev:r.Dir.Next),t.animate||(t.transitionStyle=null,t.itemChanged.emit({index:t.activeIndex,item:t.view.item(1)}))):0<Math.abs(n)&&(t.animate?t.animationState="center":t.transitionStyle=null)})},p.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)},p.prototype.inlineListItemStyles=function(e){return{height:this.height,transform:this.transforms[e],width:"100%"}},p.prototype.displayLeftArrow=function(){var e=this.isRTL?this.activeIndex+1<this.view.total:0<this.activeIndex;return(this.endless||e)&&0<this.view.total},p.prototype.leftArrowClick=function(){this.isRTL?this.next():this.prev()},p.prototype.displayRightArrow=function(){var e=this.isRTL?0<this.activeIndex:this.activeIndex+1<this.view.total;return(this.endless||e)&&0<this.view.total},p.prototype.rightArrowClick=function(){this.isRTL?this.prev():this.next()},p.prototype.draggedInsideBounds=function(e){return Math.abs(e)<=this.element.nativeElement.offsetWidth},p.prototype.draggedEnoughToNavigate=function(e){return Math.abs(e)>this.element.nativeElement.offsetWidth/2},p.prototype.isDragForbidden=function(e){var 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},p.prototype.navigate=function(e){this.isDataSourceEmpty||this.animationState||(this.changeIndex(e),this.animate||this.itemChanged.emit({index:this.activeIndex,item:this.view.item(1)}))},p.prototype.changeIndex=function(e){e===r.Dir.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===r.Dir.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(p.prototype,"isRTL",{get:function(){return"rtl"===this.direction},enumerable:!0,configurable:!0}),i.__decorate([o.Input(),i.__metadata("design:type",Array)],p.prototype,"data",void 0),i.__decorate([o.Input(),i.__metadata("design:type",Number),i.__metadata("design:paramtypes",[Number])],p.prototype,"activeIndex",null),i.__decorate([o.Input(),i.__metadata("design:type",String)],p.prototype,"width",void 0),i.__decorate([o.Input(),i.__metadata("design:type",String)],p.prototype,"height",void 0),i.__decorate([o.Input(),i.__metadata("design:type",Boolean)],p.prototype,"endless",void 0),i.__decorate([o.Input(),i.__metadata("design:type",Boolean)],p.prototype,"animate",void 0),i.__decorate([o.Input(),i.__metadata("design:type",Boolean)],p.prototype,"pageable",void 0),i.__decorate([o.Input(),i.__metadata("design:type",Boolean)],p.prototype,"arrows",void 0),i.__decorate([o.Output(),i.__metadata("design:type",o.EventEmitter)],p.prototype,"itemChanged",void 0),i.__decorate([o.ContentChild(o.TemplateRef,{static:!1}),i.__metadata("design:type",o.TemplateRef)],p.prototype,"itemTemplateRef",void 0),i.__decorate([o.HostBinding("class.k-widget"),i.__metadata("design:type",Boolean),i.__metadata("design:paramtypes",[])],p.prototype,"widgetClass",null),i.__decorate([o.HostBinding("class.k-scrollview"),i.__metadata("design:type",Boolean),i.__metadata("design:paramtypes",[])],p.prototype,"scrollViewClass",null),i.__decorate([o.HostBinding("style.width"),i.__metadata("design:type",String),i.__metadata("design:paramtypes",[])],p.prototype,"hostWidth",null),i.__decorate([o.HostBinding("style.height"),i.__metadata("design:type",String),i.__metadata("design:paramtypes",[])],p.prototype,"hostHeight",null),i.__decorate([o.HostBinding("attr.tabindex"),i.__metadata("design:type",Number),i.__metadata("design:paramtypes",[])],p.prototype,"tabIndex",null),i.__decorate([o.HostBinding("attr.aria-live"),i.__metadata("design:type",String),i.__metadata("design:paramtypes",[])],p.prototype,"ariaLive",null),i.__decorate([o.HostBinding("attr.dir"),i.__metadata("design:type",String),i.__metadata("design:paramtypes",[])],p.prototype,"dir",null),i.__decorate([o.HostBinding("style.touch-action"),i.__metadata("design:type",String)],p.prototype,"touchAction",void 0),i.__decorate([o.HostListener("keydown",["$event"]),i.__metadata("design:type",Function),i.__metadata("design:paramtypes",[Object]),i.__metadata("design:returntype",void 0)],p.prototype,"keyDown",null),i.__decorate([o.Component({animations:[a.trigger("animateTo",[a.state("center, left, right",a.style({transform:"translateX(0)"})),a.transition("* => right",[a.animate("300ms ease-out",a.style({transform:"translateX(100%)"}))]),a.transition("* => left",[a.animate("300ms ease-out",a.style({transform:"translateX(-100%)"}))]),a.transition("* => center",[a.animate("300ms ease-out")])])],exportAs:"kendoScrollView",providers:[n.LocalizationService,{provide:n.L10N_PREFIX,useValue:"kendo.scrollview"}],selector:"kendo-scrollview",template:'\n        <ul class=\'k-scrollview-wrap\'\n            [ngStyle]="{ transform: transitionStyle }"\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    '}),i.__metadata("design:paramtypes",[o.ElementRef,o.ApplicationRef,n.LocalizationService,o.NgZone])],p));function p(e,t,n,i){var a=this;this.element=e,this.application=t,this.localization=n,this.ngZone=i,this.data=[],this.endless=!1,this.animate=!0,this.pageable=!1,this.arrows=!1,this.itemChanged=new o.EventEmitter,this.touchAction="pan-y pinch-zoom",this.animationState=null,this.transitionStyle=null,this.view=new c.DataCollection(function(){return new c.DataResultIterator(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%)"],l.validatePackage(d.packageMetadata)}t.ScrollViewComponent=n},function(e,t){e.exports=l},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var i=n(1),a=n(0),o=n(5),r=n(4),s=n(2),n=n(3),s=[r.ScrollViewComponent,s.ScrollViewPagerComponent],r=[r.ScrollViewComponent],n=i.__decorate([a.NgModule({declarations:[s],exports:[r],imports:[o.CommonModule,n.DraggableModule]})],function(){});t.ScrollViewModule=n},function(e,t){e.exports=p},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var i=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}}(),a={},o=(Object.defineProperty(r.prototype,"data",{get:function(){var e=this.total,e=this.endless?[this.source[(this.index-1+e)%e],this.source[this.index%e],this.source[(this.index+1+e)%e]]:[a].concat(this.source,[a]).slice(this.index,this.index+3);return null!==this.pageIndex&&(e[this.pageIndex>this.index?2:0]=this.source[this.pageIndex]),this.rtl?e.reverse():e},enumerable:!0,configurable:!0}),Object.defineProperty(r.prototype,"total",{get:function(){return this.source.length},enumerable:!0,configurable:!0}),r.prototype.canMoveNext=function(){return this.endless||this.index<this.total-1},r.prototype.canMovePrev=function(){return this.endless||0<this.index},r.prototype[i]=function(){return this.data[i]()},r);function r(e,t,n,i,a){this.rtl=!1,this.source=e||[],this.index=t||0,this.endless=n,this.pageIndex=i,this.rtl=a}t.DataResultIterator=o;Object.defineProperty(s.prototype,"length",{get:function(){return this.accessor().data.length},enumerable:!0,configurable:!0}),Object.defineProperty(s.prototype,"total",{get:function(){return this.accessor().total},enumerable:!0,configurable:!0}),s.prototype.item=function(e){return this.accessor().data[e]},s.prototype.canMoveNext=function(){return this.accessor().canMoveNext()},s.prototype.canMovePrev=function(){return this.accessor().canMovePrev()},s.prototype[Symbol.iterator]=function(){return this.accessor()[Symbol.iterator]()},o=s;function s(e){this.accessor=e}t.DataCollection=o},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.packageMetadata={name:"@progress/kendo-angular-scrollview",productName:"Kendo UI for Angular",productCodes:["KENDOUIANGULAR","KENDOUICOMPLETE"],publishDate:1620215054,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"}},function(e,t){e.exports=u},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),(t=t.Dir||(t.Dir={}))[t.Next=1]="Next",t[t.Prev=-1]="Prev"},function(e,t){e.exports=c},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var i=n(4);t.ScrollViewComponent=i.ScrollViewComponent;i=n(6);t.ScrollViewModule=i.ScrollViewModule;n=n(2);t.ScrollViewPagerComponent=n.ScrollViewPagerComponent,function(e){for(var t in e)o(t,e[t])}(t)}],i.c=a,i.d=function(e,t,n){i.o(e,t)||Object.defineProperty(e,t,{configurable:!1,enumerable:!0,get:n})},i.r=function(e){Object.defineProperty(e,"__esModule",{value:!0})},i.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return i.d(t,"a",t),t},i.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},i.p="",i(i.s=13)}}});
+System.register("@progress/kendo-angular-scrollview",["tslib","@angular/common","@angular/core","@progress/kendo-angular-common","@progress/kendo-licensing","@angular/animations","@progress/kendo-angular-l10n"],function(o){var r,s,l,d,c,p,u;function t(e){return e.__useDefault?e.default:e}return{setters:[function(e){r=t(e)},function(e){s=t(e)},function(e){l=t(e)},function(e){d=t(e)},function(e){c=t(e)},function(e){p=t(e)},function(e){u=t(e)}],execute:function(){function i(e){if(a[e])return a[e].exports;var t=a[e]={i:e,l:!1,exports:{}};return n[e].call(t.exports,t,t.exports,i),t.l=!0,t.exports}var n,a;n=[function(e,t){e.exports=l},function(e,t){e.exports=r},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var i=n(1),a=n(0),o=n(0),a=(r.prototype.itemClass=function(e){return{"k-primary":e===this.activeIndex}},r.prototype.indexChange=function(e){this.pagerIndexChange.emit(e)},i.__decorate([a.Input(),i.__metadata("design:type",Number)],r.prototype,"activeIndex",void 0),i.__decorate([a.Input(),i.__metadata("design:type",Array)],r.prototype,"data",void 0),i.__decorate([a.Output(),i.__metadata("design:type",o.EventEmitter)],r.prototype,"pagerIndexChange",void 0),i.__decorate([a.Component({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    '})],r));function r(){this.pagerIndexChange=new o.EventEmitter}t.ScrollViewPagerComponent=a},function(e,t){e.exports=d},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var i=n(1),o=n(0),a=n(12),r=n(11),s=n(3),l=n(10),d=n(9),c=n(8),n=n(7),n=(Object.defineProperty(p.prototype,"activeIndex",{get:function(){return this._activeIndex},set:function(e){this.index=this._activeIndex=e},enumerable:!0,configurable:!0}),Object.defineProperty(p.prototype,"widgetClass",{get:function(){return!0},enumerable:!0,configurable:!0}),Object.defineProperty(p.prototype,"scrollViewClass",{get:function(){return!0},enumerable:!0,configurable:!0}),Object.defineProperty(p.prototype,"scrollViewLightOverlayClass",{get:function(){return"light"===this.pagerOverlay},enumerable:!0,configurable:!0}),Object.defineProperty(p.prototype,"scrollViewDarkOverlayClass",{get:function(){return"dark"===this.pagerOverlay},enumerable:!0,configurable:!0}),Object.defineProperty(p.prototype,"hostWidth",{get:function(){return this.width},enumerable:!0,configurable:!0}),Object.defineProperty(p.prototype,"hostHeight",{get:function(){return this.height},enumerable:!0,configurable:!0}),Object.defineProperty(p.prototype,"tabIndex",{get:function(){return 1},enumerable:!0,configurable:!0}),Object.defineProperty(p.prototype,"ariaLive",{get:function(){return"assertive"},enumerable:!0,configurable:!0}),Object.defineProperty(p.prototype,"dir",{get:function(){return this.direction},enumerable:!0,configurable:!0}),Object.defineProperty(p.prototype,"direction",{get:function(){return this.localization.rtl?"rtl":"ltr"},enumerable:!0,configurable:!0}),p.prototype.keyDown=function(e){e.keyCode===s.Keys.ArrowLeft&&(this.isRTL?this.next():this.prev()),e.keyCode===s.Keys.ArrowRight&&(this.isRTL?this.prev():this.next())},p.prototype.ngOnChanges=function(e){this.activeIndex=Math.max(Math.min(this.activeIndex,this.view.total-1),0)},p.prototype.prev=function(){this.navigate(r.Dir.Prev)},p.prototype.next=function(){this.navigate(r.Dir.Next)},p.prototype.transitionEndHandler=function(e){this.animationState=null,this.transitionStyle=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)}),this.application.tick())},p.prototype.handlePress=function(e){this.initialTouchCoordinate=e.pageX},p.prototype.handleDrag=function(e){var t=this,n=e.pageX-this.initialTouchCoordinate;this.animationState||this.isDragForbidden(n)||!this.draggedInsideBounds(n)||this.ngZone.run(function(){t.transitionStyle="translateX("+n+"px)"})},p.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?r.Dir.Prev:r.Dir.Next):t.changeIndex(0<n?r.Dir.Prev:r.Dir.Next),t.animate||(t.transitionStyle=null,t.activeIndexChange.emit(t.activeIndex),t.itemChanged.emit({index:t.activeIndex,item:t.view.item(1)}))):0<Math.abs(n)&&(t.animate?t.animationState="center":t.transitionStyle=null)})},p.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)},p.prototype.inlineListItemStyles=function(e){return{height:this.height,transform:this.transforms[e],width:"100%"}},p.prototype.displayLeftArrow=function(){var e=this.isRTL?this.activeIndex+1<this.view.total:0<this.activeIndex;return(this.endless||e)&&0<this.view.total},p.prototype.leftArrowClick=function(){this.isRTL?this.next():this.prev()},p.prototype.displayRightArrow=function(){var e=this.isRTL?0<this.activeIndex:this.activeIndex+1<this.view.total;return(this.endless||e)&&0<this.view.total},p.prototype.rightArrowClick=function(){this.isRTL?this.prev():this.next()},p.prototype.draggedInsideBounds=function(e){return Math.abs(e)<=this.element.nativeElement.offsetWidth},p.prototype.draggedEnoughToNavigate=function(e){return Math.abs(e)>this.element.nativeElement.offsetWidth/2},p.prototype.isDragForbidden=function(e){var 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},p.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)})))},p.prototype.changeIndex=function(e){e===r.Dir.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===r.Dir.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(p.prototype,"isRTL",{get:function(){return"rtl"===this.direction},enumerable:!0,configurable:!0}),i.__decorate([o.Input(),i.__metadata("design:type",Array)],p.prototype,"data",void 0),i.__decorate([o.Input(),i.__metadata("design:type",Number),i.__metadata("design:paramtypes",[Number])],p.prototype,"activeIndex",null),i.__decorate([o.Input(),i.__metadata("design:type",String)],p.prototype,"width",void 0),i.__decorate([o.Input(),i.__metadata("design:type",String)],p.prototype,"height",void 0),i.__decorate([o.Input(),i.__metadata("design:type",Boolean)],p.prototype,"endless",void 0),i.__decorate([o.Input(),i.__metadata("design:type",String)],p.prototype,"pagerOverlay",void 0),i.__decorate([o.Input(),i.__metadata("design:type",Boolean)],p.prototype,"animate",void 0),i.__decorate([o.Input(),i.__metadata("design:type",Boolean)],p.prototype,"pageable",void 0),i.__decorate([o.Input(),i.__metadata("design:type",Boolean)],p.prototype,"arrows",void 0),i.__decorate([o.Output(),i.__metadata("design:type",o.EventEmitter)],p.prototype,"itemChanged",void 0),i.__decorate([o.Output(),i.__metadata("design:type",o.EventEmitter)],p.prototype,"activeIndexChange",void 0),i.__decorate([o.ContentChild(o.TemplateRef,{static:!1}),i.__metadata("design:type",o.TemplateRef)],p.prototype,"itemTemplateRef",void 0),i.__decorate([o.HostBinding("class.k-widget"),i.__metadata("design:type",Boolean),i.__metadata("design:paramtypes",[])],p.prototype,"widgetClass",null),i.__decorate([o.HostBinding("class.k-scrollview"),i.__metadata("design:type",Boolean),i.__metadata("design:paramtypes",[])],p.prototype,"scrollViewClass",null),i.__decorate([o.HostBinding("class.k-scrollview-light"),i.__metadata("design:type",Boolean),i.__metadata("design:paramtypes",[])],p.prototype,"scrollViewLightOverlayClass",null),i.__decorate([o.HostBinding("class.k-scrollview-dark"),i.__metadata("design:type",Boolean),i.__metadata("design:paramtypes",[])],p.prototype,"scrollViewDarkOverlayClass",null),i.__decorate([o.HostBinding("style.width"),i.__metadata("design:type",String),i.__metadata("design:paramtypes",[])],p.prototype,"hostWidth",null),i.__decorate([o.HostBinding("style.height"),i.__metadata("design:type",String),i.__metadata("design:paramtypes",[])],p.prototype,"hostHeight",null),i.__decorate([o.HostBinding("attr.tabindex"),i.__metadata("design:type",Number),i.__metadata("design:paramtypes",[])],p.prototype,"tabIndex",null),i.__decorate([o.HostBinding("attr.aria-live"),i.__metadata("design:type",String),i.__metadata("design:paramtypes",[])],p.prototype,"ariaLive",null),i.__decorate([o.HostBinding("attr.dir"),i.__metadata("design:type",String),i.__metadata("design:paramtypes",[])],p.prototype,"dir",null),i.__decorate([o.HostBinding("style.touch-action"),i.__metadata("design:type",String)],p.prototype,"touchAction",void 0),i.__decorate([o.HostListener("keydown",["$event"]),i.__metadata("design:type",Function),i.__metadata("design:paramtypes",[Object]),i.__metadata("design:returntype",void 0)],p.prototype,"keyDown",null),i.__decorate([o.Component({animations:[a.trigger("animateTo",[a.state("center, left, right",a.style({transform:"translateX(0)"})),a.transition("* => right",[a.animate("300ms ease-out",a.style({transform:"translateX(100%)"}))]),a.transition("* => left",[a.animate("300ms ease-out",a.style({transform:"translateX(-100%)"}))]),a.transition("* => center",[a.animate("300ms ease-out")])])],exportAs:"kendoScrollView",providers:[n.LocalizationService,{provide:n.L10N_PREFIX,useValue:"kendo.scrollview"}],selector:"kendo-scrollview",template:'\n        <ul class=\'k-scrollview-wrap\'\n            [ngStyle]="{ transform: transitionStyle }"\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    '}),i.__metadata("design:paramtypes",[o.ElementRef,o.ApplicationRef,n.LocalizationService,o.NgZone])],p));function p(e,t,n,i){var a=this;this.element=e,this.application=t,this.localization=n,this.ngZone=i,this.data=[],this.endless=!1,this.pagerOverlay="none",this.animate=!0,this.pageable=!1,this.arrows=!1,this.itemChanged=new o.EventEmitter,this.activeIndexChange=new o.EventEmitter,this.touchAction="pan-y pinch-zoom",this.animationState=null,this.transitionStyle=null,this.view=new c.DataCollection(function(){return new c.DataResultIterator(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%)"],l.validatePackage(d.packageMetadata)}t.ScrollViewComponent=n},function(e,t){e.exports=s},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var i=n(1),a=n(0),o=n(5),r=n(4),s=n(2),n=n(3),s=[r.ScrollViewComponent,s.ScrollViewPagerComponent],r=[r.ScrollViewComponent],n=i.__decorate([a.NgModule({declarations:[s],exports:[r],imports:[o.CommonModule,n.DraggableModule]})],l);function l(){}t.ScrollViewModule=n},function(e,t){e.exports=u},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var i=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}}(),a={},o=(Object.defineProperty(r.prototype,"data",{get:function(){var e=this.total,e=this.endless?[this.source[(this.index-1+e)%e],this.source[this.index%e],this.source[(this.index+1+e)%e]]:[a].concat(this.source,[a]).slice(this.index,this.index+3);return null!==this.pageIndex&&(e[this.pageIndex>this.index?2:0]=this.source[this.pageIndex]),this.rtl?e.reverse():e},enumerable:!0,configurable:!0}),Object.defineProperty(r.prototype,"total",{get:function(){return this.source.length},enumerable:!0,configurable:!0}),r.prototype.canMoveNext=function(){return this.endless||this.index<this.total-1},r.prototype.canMovePrev=function(){return this.endless||0<this.index},r.prototype[i]=function(){return this.data[i]()},r);function r(e,t,n,i,a){this.rtl=!1,this.source=e||[],this.index=t||0,this.endless=n,this.pageIndex=i,this.rtl=a}t.DataResultIterator=o;Object.defineProperty(s.prototype,"length",{get:function(){return this.accessor().data.length},enumerable:!0,configurable:!0}),Object.defineProperty(s.prototype,"total",{get:function(){return this.accessor().total},enumerable:!0,configurable:!0}),s.prototype.item=function(e){return this.accessor().data[e]},s.prototype.canMoveNext=function(){return this.accessor().canMoveNext()},s.prototype.canMovePrev=function(){return this.accessor().canMovePrev()},s.prototype[Symbol.iterator]=function(){return this.accessor()[Symbol.iterator]()},o=s;function s(e){this.accessor=e}t.DataCollection=o},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.packageMetadata={name:"@progress/kendo-angular-scrollview",productName:"Kendo UI for Angular",productCodes:["KENDOUIANGULAR","KENDOUICOMPLETE"],publishDate:1635493249,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"}},function(e,t){e.exports=c},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),(t=t.Dir||(t.Dir={}))[t.Next=1]="Next",t[t.Prev=-1]="Prev"},function(e,t){e.exports=p},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var i=n(4);t.ScrollViewComponent=i.ScrollViewComponent;i=n(6);t.ScrollViewModule=i.ScrollViewModule;n=n(2);t.ScrollViewPagerComponent=n.ScrollViewPagerComponent,function(e){for(var t in e)o(t,e[t])}(t)}],a={},i.m=n,i.c=a,i.d=function(e,t,n){i.o(e,t)||Object.defineProperty(e,t,{configurable:!1,enumerable:!0,get:n})},i.r=function(e){Object.defineProperty(e,"__esModule",{value:!0})},i.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return i.d(t,"a",t),t},i.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},i.p="",i(i.s=13)}}});

package/package.json

@@ -3,7 +3,7 @@
   "description": "A ScrollView Component for Angular",
   "author": "Progress",
   "license": "SEE LICENSE IN LICENSE.md",
-  "version": "4.0.3",
+  "version": "4.1.1-dev.202110290741",
   "main": "dist/npm/index.js",
   "module": "dist/fesm5/index.js",
   "es2015": "dist/fesm2015/index.js",
@@ -32,13 +32,13 @@
     "Angular"
   ],
   "peerDependencies": {
-    "@angular/animations": "8 - 12",
-    "@angular/common": "8 - 12",
-    "@angular/core": "8 - 12",
+    "@angular/animations": "8 - 13",
+    "@angular/common": "8 - 13",
+    "@angular/core": "8 - 13",
     "@progress/kendo-angular-common": "^2.0.0",
     "@progress/kendo-angular-l10n": "^3.0.0",
     "@progress/kendo-licensing": "^1.0.2",
-    "rxjs": "^6.4.0"
+    "rxjs": "^6.4.0 || ^7.0.0"
   },
   "dependencies": {
     "@progress/kendo-schematics": "^1.0.0",
@@ -61,7 +61,7 @@
     "@progress/kendo-angular-e2e": "^2.2.0",
     "@progress/kendo-angular-jest-preset": "^2.0.0",
     "@progress/kendo-angular-l10n": "^3.0.0",
-    "@progress/kendo-angular-tasks": "^18.0.8",
+    "@progress/kendo-angular-tasks": "^19.0.1",
     "@progress/kendo-licensing": "^1.0.2",
     "@progress/kendo-theme-bootstrap": "^4.27.0",
     "@progress/kendo-theme-default": "^4.29.0",