@progress/kendo-angular-scrollview 4.1.4-dev.202202251422 → 5.0.0-dev.202204191146

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (51) hide show
  1. package/bundles/kendo-angular-scrollview.umd.js +5 -0
  2. package/{dist/es2015/change-event-args.d.ts → change-event-args.d.ts} +0 -0
  3. package/{dist/es2015/data.collection.d.ts → data.collection.d.ts} +4 -4
  4. package/{dist/es2015/direction.d.ts → direction.d.ts} +0 -0
  5. package/{dist/es2015/enums.d.ts → enums.d.ts} +0 -0
  6. package/{dist/es2015 → esm2015}/change-event-args.js +1 -0
  7. package/{dist/es2015 → esm2015}/data.collection.js +0 -1
  8. package/{dist/es → esm2015}/direction.js +1 -0
  9. package/{dist/es → esm2015}/enums.js +0 -0
  10. package/{dist/es/index.js → esm2015/kendo-angular-scrollview.js} +0 -0
  11. package/{dist/es → esm2015}/main.js +0 -0
  12. package/{dist/es2015 → esm2015}/package-metadata.js +1 -1
  13. package/esm2015/scrollview-pager.component.js +53 -0
  14. package/{dist/es2015 → esm2015}/scrollview.component.js +160 -136
  15. package/{dist/es2015 → esm2015}/scrollview.module.js +15 -11
  16. package/{dist/fesm2015/index.js → fesm2015/kendo-angular-scrollview.js} +221 -191
  17. package/{dist/es2015/index.d.ts → kendo-angular-scrollview.d.ts} +1 -0
  18. package/{dist/es2015/main.d.ts → main.d.ts} +0 -0
  19. package/{dist/es2015/package-metadata.d.ts → package-metadata.d.ts} +0 -0
  20. package/package.json +30 -93
  21. package/schematics/ngAdd/index.js +5 -2
  22. package/schematics/ngAdd/index.js.map +1 -1
  23. package/{dist/es2015/scrollview-pager.component.d.ts → scrollview-pager.component.d.ts} +3 -0
  24. package/{dist/es2015/scrollview.component.d.ts → scrollview.component.d.ts} +12 -8
  25. package/{dist/es2015/scrollview.module.d.ts → scrollview.module.d.ts} +8 -0
  26. package/dist/cdn/js/kendo-angular-scrollview.js +0 -20
  27. package/dist/cdn/main.js +0 -5
  28. package/dist/es/change-event-args.js +0 -4
  29. package/dist/es/data.collection.js +0 -109
  30. package/dist/es/package-metadata.js +0 -15
  31. package/dist/es/scrollview-pager.component.js +0 -43
  32. package/dist/es/scrollview.component.js +0 -543
  33. package/dist/es/scrollview.module.js +0 -61
  34. package/dist/es2015/direction.js +0 -4
  35. package/dist/es2015/enums.js +0 -12
  36. package/dist/es2015/index.js +0 -8
  37. package/dist/es2015/index.metadata.json +0 -1
  38. package/dist/es2015/main.js +0 -7
  39. package/dist/es2015/scrollview-pager.component.js +0 -52
  40. package/dist/fesm5/index.js +0 -759
  41. package/dist/npm/change-event-args.js +0 -6
  42. package/dist/npm/data.collection.js +0 -111
  43. package/dist/npm/direction.js +0 -6
  44. package/dist/npm/enums.js +0 -14
  45. package/dist/npm/index.js +0 -11
  46. package/dist/npm/main.js +0 -12
  47. package/dist/npm/package-metadata.js +0 -17
  48. package/dist/npm/scrollview-pager.component.js +0 -45
  49. package/dist/npm/scrollview.component.js +0 -545
  50. package/dist/npm/scrollview.module.js +0 -63
  51. package/dist/systemjs/kendo-angular-scrollview.js +0 -5
@@ -1,759 +0,0 @@
1
- /**-----------------------------------------------------------------------------------------
2
- * Copyright © 2021 Progress Software Corporation. All rights reserved.
3
- * Licensed under commercial license. See LICENSE.md in the project root for more information
4
- *-------------------------------------------------------------------------------------------*/
5
- import { __decorate, __metadata } from 'tslib';
6
- import { Input, Output, EventEmitter, ContentChild, TemplateRef, ViewChild, ElementRef, HostBinding, HostListener, Component, NgZone, Renderer2, NgModule } from '@angular/core';
7
- import { trigger, state, style, transition, animate } from '@angular/animations';
8
- import { Keys, DraggableModule } from '@progress/kendo-angular-common';
9
- import { validatePackage } from '@progress/kendo-licensing';
10
- import { LocalizationService, L10N_PREFIX } from '@progress/kendo-angular-l10n';
11
- import { CommonModule } from '@angular/common';
12
-
13
- /**
14
- * @hidden
15
- */
16
- var Dir;
17
- (function (Dir) {
18
- Dir[Dir["Next"] = 1] = "Next";
19
- Dir[Dir["Prev"] = -1] = "Prev";
20
- })(Dir || (Dir = {}));
21
-
22
- /**
23
- * @hidden
24
- */
25
- var packageMetadata = {
26
- name: '@progress/kendo-angular-scrollview',
27
- productName: 'Kendo UI for Angular',
28
- productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
29
- publishDate: 1645798934,
30
- version: '',
31
- 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'
32
- };
33
-
34
- /* tslint:disable:use-life-cycle-interface */
35
- /** @hidden */
36
- var iterator = getIterator();
37
- // TODO: Move to kendo-common
38
- function getIterator() {
39
- if (typeof Symbol === 'function' && Symbol.iterator) {
40
- return Symbol.iterator;
41
- }
42
- var keys = Object.getOwnPropertyNames(Map.prototype);
43
- var proto = Map.prototype;
44
- for (var i = 0; i < keys.length; ++i) {
45
- var key = keys[i];
46
- if (key !== 'entries' && key !== 'size' && proto[key] === proto.entries) {
47
- return key;
48
- }
49
- }
50
- }
51
- var EMPTY_OBJ = {};
52
- /**
53
- * @hidden
54
- */
55
- var DataResultIterator = /** @class */ (function () {
56
- function DataResultIterator(source, index, endless, pageIndex, rtl) {
57
- this.rtl = false;
58
- this.source = source ? source : [];
59
- this.index = index ? index : 0;
60
- this.endless = endless;
61
- this.pageIndex = pageIndex;
62
- this.rtl = rtl;
63
- }
64
- Object.defineProperty(DataResultIterator.prototype, "data", {
65
- get: function () {
66
- var itemCount = this.total;
67
- var result;
68
- if (this.endless) {
69
- result = [
70
- this.source[(this.index - 1 + itemCount) % itemCount],
71
- this.source[this.index % itemCount],
72
- this.source[(this.index + 1 + itemCount) % itemCount]
73
- ];
74
- }
75
- else {
76
- var data = [EMPTY_OBJ].concat(this.source, [EMPTY_OBJ]);
77
- result = data.slice(this.index, this.index + 3);
78
- }
79
- if (this.pageIndex !== null) {
80
- var isForward = this.pageIndex > this.index;
81
- result[isForward ? 2 : 0] = this.source[this.pageIndex];
82
- }
83
- return this.rtl ? result.reverse() : result;
84
- },
85
- enumerable: true,
86
- configurable: true
87
- });
88
- Object.defineProperty(DataResultIterator.prototype, "total", {
89
- get: function () {
90
- return this.source.length;
91
- },
92
- enumerable: true,
93
- configurable: true
94
- });
95
- DataResultIterator.prototype.canMoveNext = function () {
96
- return (this.endless || (this.index < this.total - 1));
97
- };
98
- DataResultIterator.prototype.canMovePrev = function () {
99
- return (this.endless || this.index > 0);
100
- };
101
- DataResultIterator.prototype[iterator] = function () {
102
- return this.data[iterator]();
103
- };
104
- return DataResultIterator;
105
- }());
106
- /**
107
- * @hidden
108
- */
109
- var DataCollection = /** @class */ (function () {
110
- function DataCollection(accessor) {
111
- this.accessor = accessor;
112
- }
113
- Object.defineProperty(DataCollection.prototype, "length", {
114
- get: function () { return this.accessor().data.length; },
115
- enumerable: true,
116
- configurable: true
117
- });
118
- Object.defineProperty(DataCollection.prototype, "total", {
119
- get: function () { return this.accessor().total; },
120
- enumerable: true,
121
- configurable: true
122
- });
123
- DataCollection.prototype.item = function (index) {
124
- return this.accessor().data[index];
125
- };
126
- DataCollection.prototype.canMoveNext = function () {
127
- return this.accessor().canMoveNext();
128
- };
129
- DataCollection.prototype.canMovePrev = function () {
130
- return this.accessor().canMovePrev();
131
- };
132
- DataCollection.prototype[Symbol.iterator] = function () {
133
- return this.accessor()[Symbol.iterator]();
134
- };
135
- return DataCollection;
136
- }());
137
-
138
- /**
139
- * Represents the [Kendo UI ScrollView component for Angular]({% slug overview_scrollview %}).
140
- *
141
- * @example
142
- * ```ts
143
- *
144
- * _@Component({
145
- * selector: 'my-app',
146
- * template: `
147
- * <kendo-scrollview
148
- * [data]="items"
149
- * [width]="width"
150
- * [height]="height"
151
- * [endless]="endless"
152
- * [pageable]="pageable">
153
- * <ng-template let-item="item">
154
- * <h2 class="demo-title">{{item.title}}</h2>
155
- * <img src='{{item.url}}' alt='{{item.title}}' [ngStyle]="{minWidth: width}" draggable="false" />
156
- * </ng-template>
157
- * </kendo-scrollview>
158
- * `,
159
- * styles: [`
160
- * .k-scrollview-wrap {
161
- * margin: 0 auto;
162
- * }
163
- * .demo-title {
164
- * position: absolute;
165
- * top: 0;
166
- * left: 0;
167
- * right: 0;
168
- * margin: 0;
169
- * padding: 15px;
170
- * color: #fff;
171
- * background-color: rgba(0,0,0,.4);
172
- * text-align: center;
173
- * font-size: 24px;
174
- * }
175
- * `]
176
- * })
177
- *
178
- * class AppComponent {
179
- * public width: string = "600px";
180
- * public height: string = "400px";
181
- * public endless: boolean = false;
182
- * public pageable: boolean = false;
183
- * public items: any[] = [
184
- * { title: 'Flower', url: 'https://bit.ly/2cJjYuB' },
185
- * { title: 'Mountain', url: 'https://bit.ly/2cTBNaL' },
186
- * { title: 'Sky', url: 'https://bit.ly/2cJl3Cx' }
187
- * ];
188
- * }
189
- * ```
190
- */
191
- var ScrollViewComponent = /** @class */ (function () {
192
- function ScrollViewComponent(element, localization, ngZone, renderer) {
193
- var _this = this;
194
- this.element = element;
195
- this.localization = localization;
196
- this.ngZone = ngZone;
197
- this.renderer = renderer;
198
- /**
199
- * Provides the data source for the ScrollView ([see example]({% slug datasources_scrollview %})).
200
- */
201
- this.data = [];
202
- /**
203
- * Enables or disables the endless scrolling mode in which the data source items are endlessly looped
204
- * ([see example]({% slug endlessscrolling_scrollview %})). By default, `endless` is set to `false`
205
- * and the endless scrolling mode is disabled.
206
- */
207
- this.endless = false;
208
- /**
209
- * Sets `pagerOverlay` to one of three possible values: `dark`, `light` or `none`.
210
- * By default, the pager overlay is set to `none`.
211
- */
212
- this.pagerOverlay = 'none';
213
- /**
214
- * Enables or disables the built-in animations ([see example]({% slug animations_scrollview %})).
215
- * By default, `animate` is set to `true` and animations are enabled.
216
- */
217
- this.animate = true;
218
- /**
219
- * Enables or disables the built-in pager ([see example]({% slug paging_scrollview %})).
220
- * By default, `pageable` is set to `false` and paging is disabled.
221
- */
222
- this.pageable = false;
223
- /**
224
- * Enables or disables the built-in navigation arrows ([see example]({% slug arrows_scrollview %})).
225
- * By default, `arrows` is set to `false` and arrows are disabled.
226
- */
227
- this.arrows = false;
228
- /**
229
- * Fires after the current item is changed.
230
- */
231
- this.itemChanged = new EventEmitter();
232
- /**
233
- * Fires after the activeIndex has changed. Allows for two-way binding of the activeIndex property.
234
- */
235
- this.activeIndexChange = new EventEmitter();
236
- this.scrollViewClass = true;
237
- this.tabIndex = 1;
238
- this.ariaLive = 'assertive';
239
- this.touchAction = 'pan-y pinch-zoom';
240
- this.animationState = null;
241
- this.view = new DataCollection(function () {
242
- return new DataResultIterator(_this.data, _this.activeIndex, _this.endless, _this.pageIndex, _this.isRTL);
243
- });
244
- this.isDataSourceEmpty = false;
245
- this._activeIndex = 0;
246
- this.index = 0;
247
- this.pageIndex = null;
248
- this.transforms = ['translateX(-100%)', 'translateX(0%)', 'translateX(100%)'];
249
- validatePackage(packageMetadata);
250
- }
251
- Object.defineProperty(ScrollViewComponent.prototype, "activeIndex", {
252
- get: function () {
253
- return this._activeIndex;
254
- },
255
- /**
256
- * Represents the current item index ([see example]({% slug activeitems_scrollview %})).
257
- */
258
- set: function (value) {
259
- this.index = this._activeIndex = value;
260
- },
261
- enumerable: true,
262
- configurable: true
263
- });
264
- Object.defineProperty(ScrollViewComponent.prototype, "scrollViewLightOverlayClass", {
265
- get: function () {
266
- return this.pagerOverlay === 'light';
267
- },
268
- enumerable: true,
269
- configurable: true
270
- });
271
- Object.defineProperty(ScrollViewComponent.prototype, "scrollViewDarkOverlayClass", {
272
- get: function () {
273
- return this.pagerOverlay === 'dark';
274
- },
275
- enumerable: true,
276
- configurable: true
277
- });
278
- Object.defineProperty(ScrollViewComponent.prototype, "hostWidth", {
279
- get: function () { return this.width; },
280
- enumerable: true,
281
- configurable: true
282
- });
283
- Object.defineProperty(ScrollViewComponent.prototype, "hostHeight", {
284
- get: function () { return this.height; },
285
- enumerable: true,
286
- configurable: true
287
- });
288
- Object.defineProperty(ScrollViewComponent.prototype, "dir", {
289
- get: function () {
290
- return this.direction;
291
- },
292
- enumerable: true,
293
- configurable: true
294
- });
295
- Object.defineProperty(ScrollViewComponent.prototype, "direction", {
296
- get: function () {
297
- return this.localization.rtl ? 'rtl' : 'ltr';
298
- },
299
- enumerable: true,
300
- configurable: true
301
- });
302
- /**
303
- * @hidden
304
- */
305
- ScrollViewComponent.prototype.keyDown = function (e) {
306
- if (e.keyCode === Keys.ArrowLeft) {
307
- if (this.isRTL) {
308
- this.next();
309
- }
310
- else {
311
- this.prev();
312
- }
313
- }
314
- if (e.keyCode === Keys.ArrowRight) {
315
- if (this.isRTL) {
316
- this.prev();
317
- }
318
- else {
319
- this.next();
320
- }
321
- }
322
- };
323
- ScrollViewComponent.prototype.ngOnChanges = function (_) {
324
- this.activeIndex = Math.max(Math.min(this.activeIndex, this.view.total - 1), 0);
325
- };
326
- /**
327
- * Navigates the ScrollView to the previous item.
328
- */
329
- ScrollViewComponent.prototype.prev = function () {
330
- this.navigate(Dir.Prev);
331
- };
332
- /**
333
- * Navigates the ScrollView to the next item.
334
- */
335
- ScrollViewComponent.prototype.next = function () {
336
- this.navigate(Dir.Next);
337
- };
338
- /**
339
- * @hidden
340
- */
341
- ScrollViewComponent.prototype.transitionEndHandler = function (e) {
342
- this.animationState = null;
343
- if (e.toState === 'left' || e.toState === 'right') {
344
- if (this.pageIndex !== null) {
345
- this.activeIndex = this.pageIndex;
346
- this.pageIndex = null;
347
- }
348
- this.activeIndex = this.index;
349
- this.activeIndexChange.emit(this.activeIndex);
350
- this.itemChanged.emit({ index: this.activeIndex, item: this.view.item(1) });
351
- }
352
- };
353
- /**
354
- * @hidden
355
- */
356
- ScrollViewComponent.prototype.handlePress = function (e) {
357
- this.initialTouchCoordinate = e.pageX;
358
- };
359
- /**
360
- * @hidden
361
- */
362
- ScrollViewComponent.prototype.handleDrag = function (e) {
363
- var deltaX = e.pageX - this.initialTouchCoordinate;
364
- if (!this.animationState && !this.isDragForbidden(deltaX) && this.draggedInsideBounds(deltaX)) {
365
- this.renderer.setStyle(this.itemWrapper.nativeElement, 'transform', "translateX(" + deltaX + "px)");
366
- }
367
- };
368
- /**
369
- * @hidden
370
- */
371
- ScrollViewComponent.prototype.handleRelease = function (e) {
372
- var _this = this;
373
- var deltaX = e.pageX - this.initialTouchCoordinate;
374
- if (this.isDragForbidden(deltaX)) {
375
- return;
376
- }
377
- this.ngZone.run(function () {
378
- if (_this.draggedEnoughToNavigate(deltaX)) {
379
- if (_this.isRTL) {
380
- _this.changeIndex(deltaX < 0 ? Dir.Prev : Dir.Next);
381
- }
382
- else {
383
- _this.changeIndex(deltaX > 0 ? Dir.Prev : Dir.Next);
384
- }
385
- if (!_this.animate) {
386
- _this.renderer.removeStyle(_this.itemWrapper.nativeElement, 'transform');
387
- _this.activeIndexChange.emit(_this.activeIndex);
388
- _this.itemChanged.emit({ index: _this.activeIndex, item: _this.view.item(1) });
389
- }
390
- }
391
- else {
392
- if (_this.animate && deltaX) {
393
- _this.animationState = 'center';
394
- }
395
- else {
396
- _this.renderer.removeStyle(_this.itemWrapper.nativeElement, 'transform');
397
- }
398
- }
399
- });
400
- };
401
- /**
402
- * @hidden
403
- */
404
- ScrollViewComponent.prototype.pageChange = function (idx) {
405
- if (!this.animationState && this.activeIndex !== idx) {
406
- if (this.animate) {
407
- this.pageIndex = idx;
408
- if (this.isRTL) {
409
- this.animationState = (this.pageIndex > this.index ? 'right' : 'left');
410
- }
411
- else {
412
- this.animationState = (this.pageIndex > this.index ? 'left' : 'right');
413
- }
414
- }
415
- else {
416
- this.activeIndex = idx;
417
- }
418
- }
419
- };
420
- /**
421
- * @hidden
422
- */
423
- ScrollViewComponent.prototype.inlineListItemStyles = function (idx) {
424
- return {
425
- 'height': this.height,
426
- 'transform': this.transforms[idx],
427
- 'width': '100%'
428
- };
429
- };
430
- /**
431
- * @hidden
432
- */
433
- ScrollViewComponent.prototype.displayLeftArrow = function () {
434
- var isNotBorderItem;
435
- if (this.isRTL) {
436
- isNotBorderItem = this.activeIndex + 1 < this.view.total;
437
- }
438
- else {
439
- isNotBorderItem = this.activeIndex > 0;
440
- }
441
- return (this.endless || isNotBorderItem) && this.view.total > 0;
442
- };
443
- /**
444
- * @hidden
445
- */
446
- ScrollViewComponent.prototype.leftArrowClick = function () {
447
- if (this.isRTL) {
448
- this.next();
449
- }
450
- else {
451
- this.prev();
452
- }
453
- };
454
- /**
455
- * @hidden
456
- */
457
- ScrollViewComponent.prototype.displayRightArrow = function () {
458
- var isNotBorderItem;
459
- if (this.isRTL) {
460
- isNotBorderItem = this.activeIndex > 0;
461
- }
462
- else {
463
- isNotBorderItem = this.activeIndex + 1 < this.view.total;
464
- }
465
- return (this.endless || isNotBorderItem) && this.view.total > 0;
466
- };
467
- /**
468
- * @hidden
469
- */
470
- ScrollViewComponent.prototype.rightArrowClick = function () {
471
- if (this.isRTL) {
472
- this.prev();
473
- }
474
- else {
475
- this.next();
476
- }
477
- };
478
- ScrollViewComponent.prototype.draggedInsideBounds = function (deltaX) {
479
- return Math.abs(deltaX) <= this.element.nativeElement.offsetWidth;
480
- };
481
- ScrollViewComponent.prototype.draggedEnoughToNavigate = function (deltaX) {
482
- return Math.abs(deltaX) > (this.element.nativeElement.offsetWidth / 2);
483
- };
484
- ScrollViewComponent.prototype.isDragForbidden = function (deltaX) {
485
- var pastEnd;
486
- var isEndReached;
487
- if (this.isRTL) {
488
- pastEnd = deltaX < 0 && deltaX !== 0;
489
- }
490
- else {
491
- pastEnd = deltaX > 0 && deltaX !== 0;
492
- }
493
- isEndReached = ((this.activeIndex === 0 && pastEnd) || (this.activeIndex === this.view.total - 1 && !pastEnd));
494
- return !this.endless && isEndReached;
495
- };
496
- ScrollViewComponent.prototype.navigate = function (direction) {
497
- if (this.isDataSourceEmpty || this.animationState) {
498
- return;
499
- }
500
- this.changeIndex(direction);
501
- if (!this.animate) {
502
- this.activeIndexChange.emit(this.activeIndex);
503
- this.itemChanged.emit({ index: this.activeIndex, item: this.view.item(1) });
504
- }
505
- };
506
- ScrollViewComponent.prototype.changeIndex = function (direction) {
507
- if (direction === Dir.Next && this.view.canMoveNext()) {
508
- this.index = (this.index + 1) % this.view.total;
509
- if (this.animate) {
510
- this.animationState = this.isRTL ? 'right' : 'left';
511
- }
512
- else {
513
- this.activeIndex = this.index;
514
- }
515
- }
516
- else if (direction === Dir.Prev && this.view.canMovePrev()) {
517
- this.index = this.index === 0 ? this.view.total - 1 : this.index - 1;
518
- if (this.animate) {
519
- this.animationState = this.isRTL ? 'left' : 'right';
520
- }
521
- else {
522
- this.activeIndex = this.index;
523
- }
524
- }
525
- };
526
- Object.defineProperty(ScrollViewComponent.prototype, "isRTL", {
527
- get: function () {
528
- return this.direction === 'rtl';
529
- },
530
- enumerable: true,
531
- configurable: true
532
- });
533
- __decorate([
534
- Input(),
535
- __metadata("design:type", Array)
536
- ], ScrollViewComponent.prototype, "data", void 0);
537
- __decorate([
538
- Input(),
539
- __metadata("design:type", Number),
540
- __metadata("design:paramtypes", [Number])
541
- ], ScrollViewComponent.prototype, "activeIndex", null);
542
- __decorate([
543
- Input(),
544
- __metadata("design:type", String)
545
- ], ScrollViewComponent.prototype, "width", void 0);
546
- __decorate([
547
- Input(),
548
- __metadata("design:type", String)
549
- ], ScrollViewComponent.prototype, "height", void 0);
550
- __decorate([
551
- Input(),
552
- __metadata("design:type", Boolean)
553
- ], ScrollViewComponent.prototype, "endless", void 0);
554
- __decorate([
555
- Input(),
556
- __metadata("design:type", String)
557
- ], ScrollViewComponent.prototype, "pagerOverlay", void 0);
558
- __decorate([
559
- Input(),
560
- __metadata("design:type", Boolean)
561
- ], ScrollViewComponent.prototype, "animate", void 0);
562
- __decorate([
563
- Input(),
564
- __metadata("design:type", Boolean)
565
- ], ScrollViewComponent.prototype, "pageable", void 0);
566
- __decorate([
567
- Input(),
568
- __metadata("design:type", Boolean)
569
- ], ScrollViewComponent.prototype, "arrows", void 0);
570
- __decorate([
571
- Output(),
572
- __metadata("design:type", EventEmitter)
573
- ], ScrollViewComponent.prototype, "itemChanged", void 0);
574
- __decorate([
575
- Output(),
576
- __metadata("design:type", EventEmitter)
577
- ], ScrollViewComponent.prototype, "activeIndexChange", void 0);
578
- __decorate([
579
- ContentChild(TemplateRef, { static: false }),
580
- __metadata("design:type", TemplateRef)
581
- ], ScrollViewComponent.prototype, "itemTemplateRef", void 0);
582
- __decorate([
583
- ViewChild('itemWrapper', { static: false }),
584
- __metadata("design:type", ElementRef)
585
- ], ScrollViewComponent.prototype, "itemWrapper", void 0);
586
- __decorate([
587
- HostBinding('class.k-scrollview'),
588
- __metadata("design:type", Boolean)
589
- ], ScrollViewComponent.prototype, "scrollViewClass", void 0);
590
- __decorate([
591
- HostBinding('class.k-scrollview-light'),
592
- __metadata("design:type", Boolean),
593
- __metadata("design:paramtypes", [])
594
- ], ScrollViewComponent.prototype, "scrollViewLightOverlayClass", null);
595
- __decorate([
596
- HostBinding('class.k-scrollview-dark'),
597
- __metadata("design:type", Boolean),
598
- __metadata("design:paramtypes", [])
599
- ], ScrollViewComponent.prototype, "scrollViewDarkOverlayClass", null);
600
- __decorate([
601
- HostBinding('style.width'),
602
- __metadata("design:type", String),
603
- __metadata("design:paramtypes", [])
604
- ], ScrollViewComponent.prototype, "hostWidth", null);
605
- __decorate([
606
- HostBinding('style.height'),
607
- __metadata("design:type", String),
608
- __metadata("design:paramtypes", [])
609
- ], ScrollViewComponent.prototype, "hostHeight", null);
610
- __decorate([
611
- HostBinding('attr.tabindex'),
612
- __metadata("design:type", Number)
613
- ], ScrollViewComponent.prototype, "tabIndex", void 0);
614
- __decorate([
615
- HostBinding('attr.aria-live'),
616
- __metadata("design:type", String)
617
- ], ScrollViewComponent.prototype, "ariaLive", void 0);
618
- __decorate([
619
- HostBinding('attr.dir'),
620
- __metadata("design:type", String),
621
- __metadata("design:paramtypes", [])
622
- ], ScrollViewComponent.prototype, "dir", null);
623
- __decorate([
624
- HostBinding('style.touch-action'),
625
- __metadata("design:type", String)
626
- ], ScrollViewComponent.prototype, "touchAction", void 0);
627
- __decorate([
628
- HostListener('keydown', ['$event']),
629
- __metadata("design:type", Function),
630
- __metadata("design:paramtypes", [Object]),
631
- __metadata("design:returntype", void 0)
632
- ], ScrollViewComponent.prototype, "keyDown", null);
633
- ScrollViewComponent = __decorate([
634
- Component({
635
- animations: [
636
- trigger('animateTo', [
637
- state('center, left, right', style({ transform: 'translateX(0)' })),
638
- transition('* => right', [
639
- animate('300ms ease-out', style({ transform: 'translateX(100%)' }))
640
- ]),
641
- transition('* => left', [
642
- animate('300ms ease-out', style({ transform: 'translateX(-100%)' }))
643
- ]),
644
- transition('* => center', [
645
- animate('300ms ease-out')
646
- ])
647
- ])
648
- ],
649
- exportAs: 'kendoScrollView',
650
- providers: [
651
- LocalizationService,
652
- {
653
- provide: L10N_PREFIX,
654
- useValue: 'kendo.scrollview'
655
- }
656
- ],
657
- selector: 'kendo-scrollview',
658
- 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 "
659
- }),
660
- __metadata("design:paramtypes", [ElementRef,
661
- LocalizationService,
662
- NgZone,
663
- Renderer2])
664
- ], ScrollViewComponent);
665
- return ScrollViewComponent;
666
- }());
667
-
668
- /**
669
- * @hidden
670
- */
671
- var ScrollViewPagerComponent = /** @class */ (function () {
672
- function ScrollViewPagerComponent() {
673
- this.pagerIndexChange = new EventEmitter();
674
- }
675
- ScrollViewPagerComponent.prototype.itemClass = function (idx) {
676
- return {
677
- 'k-primary': idx === this.activeIndex
678
- };
679
- };
680
- ScrollViewPagerComponent.prototype.indexChange = function (selectedIndex) {
681
- this.pagerIndexChange.emit(selectedIndex);
682
- };
683
- __decorate([
684
- Input(),
685
- __metadata("design:type", Number)
686
- ], ScrollViewPagerComponent.prototype, "activeIndex", void 0);
687
- __decorate([
688
- Input(),
689
- __metadata("design:type", Array)
690
- ], ScrollViewPagerComponent.prototype, "data", void 0);
691
- __decorate([
692
- Output(),
693
- __metadata("design:type", EventEmitter)
694
- ], ScrollViewPagerComponent.prototype, "pagerIndexChange", void 0);
695
- ScrollViewPagerComponent = __decorate([
696
- Component({
697
- selector: 'kendo-scrollview-pager',
698
- 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 "
699
- })
700
- ], ScrollViewPagerComponent);
701
- return ScrollViewPagerComponent;
702
- }());
703
-
704
- var DECLARATIONS = [
705
- ScrollViewComponent,
706
- ScrollViewPagerComponent
707
- ];
708
- var EXPORTS = [
709
- ScrollViewComponent
710
- ];
711
- /**
712
- * Represents the [NgModule]({{ site.data.urls.angular['ngmoduleapi'] }})
713
- * definition for the ScrollView component.
714
- *
715
- * @example
716
- *
717
- * ```ts-no-run
718
- * // Import the ScrollView module
719
- * import { ScrollViewModule } from '@progress/kendo-angular-scrollview';
720
- *
721
- * // The browser platform with a compiler
722
- * import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
723
- *
724
- * import { NgModule } from '@angular/core';
725
- *
726
- * // Import the app component
727
- * import { AppComponent } from './app.component';
728
- *
729
- * // Define the app module
730
- * _@NgModule({
731
- * declarations: [AppComponent], // declare app component
732
- * imports: [BrowserModule, ScrollViewModule], // import ScrollView module
733
- * bootstrap: [AppComponent]
734
- * })
735
- * export class AppModule {}
736
- *
737
- * // Compile and launch the module
738
- * platformBrowserDynamic().bootstrapModule(AppModule);
739
- *
740
- * ```
741
- */
742
- var ScrollViewModule = /** @class */ (function () {
743
- function ScrollViewModule() {
744
- }
745
- ScrollViewModule = __decorate([
746
- NgModule({
747
- declarations: [DECLARATIONS],
748
- exports: [EXPORTS],
749
- imports: [CommonModule, DraggableModule]
750
- })
751
- ], ScrollViewModule);
752
- return ScrollViewModule;
753
- }());
754
-
755
- /**
756
- * Generated bundle index. Do not edit.
757
- */
758
-
759
- export { ScrollViewComponent, ScrollViewModule, ScrollViewPagerComponent };