@progress/kendo-angular-dateinputs 21.4.1 → 22.0.0-develop.1
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.
- package/calendar/localization/calendar-messages.d.ts +1 -1
- package/calendar/localization/multiview-calendar-messages.d.ts +1 -1
- package/dateinput/localization/messages.d.ts +1 -1
- package/datepicker/localization/messages.d.ts +1 -1
- package/daterange/date-range-input.d.ts +1 -1
- package/daterange/localization/messages.d.ts +1 -1
- package/datetimepicker/localization/messages.d.ts +1 -1
- package/fesm2022/progress-kendo-angular-dateinputs.mjs +262 -262
- package/package.json +15 -23
- package/timepicker/localization/messages.d.ts +1 -1
- package/esm2022/calendar/calendar.component.mjs +0 -1711
- package/esm2022/calendar/calendar.module.mjs +0 -91
- package/esm2022/calendar/calendars.module.mjs +0 -87
- package/esm2022/calendar/footer.component.mjs +0 -77
- package/esm2022/calendar/for.directive.mjs +0 -116
- package/esm2022/calendar/header.component.mjs +0 -367
- package/esm2022/calendar/horizontal-view-list.component.mjs +0 -580
- package/esm2022/calendar/localization/calendar-custom-messages.component.mjs +0 -51
- package/esm2022/calendar/localization/calendar-localized-messages.directive.mjs +0 -39
- package/esm2022/calendar/localization/calendar-messages.mjs +0 -45
- package/esm2022/calendar/localization/multiview-calendar-custom-messages.component.mjs +0 -51
- package/esm2022/calendar/localization/multiview-calendar-localized-messages.directive.mjs +0 -39
- package/esm2022/calendar/localization/multiview-calendar-messages.mjs +0 -45
- package/esm2022/calendar/models/cell-context.interface.mjs +0 -5
- package/esm2022/calendar/models/navigation-action.enum.mjs +0 -20
- package/esm2022/calendar/models/orientation.mjs +0 -5
- package/esm2022/calendar/models/row-length-options.interface.mjs +0 -5
- package/esm2022/calendar/models/scrollable.interface.mjs +0 -5
- package/esm2022/calendar/models/selection-range-end.type.mjs +0 -5
- package/esm2022/calendar/models/selection-range.interface.mjs +0 -10
- package/esm2022/calendar/models/selection.mjs +0 -50
- package/esm2022/calendar/models/type.mjs +0 -5
- package/esm2022/calendar/models/view-service.interface.mjs +0 -5
- package/esm2022/calendar/models/view.enum.mjs +0 -16
- package/esm2022/calendar/models/view.type.mjs +0 -5
- package/esm2022/calendar/multiview-calendar.component.mjs +0 -1564
- package/esm2022/calendar/multiview-calendar.module.mjs +0 -89
- package/esm2022/calendar/navigation.component.mjs +0 -230
- package/esm2022/calendar/services/bus-view.service.mjs +0 -83
- package/esm2022/calendar/services/century-view.service.mjs +0 -219
- package/esm2022/calendar/services/decade-view.service.mjs +0 -217
- package/esm2022/calendar/services/disabled-dates.service.mjs +0 -66
- package/esm2022/calendar/services/dom.service.mjs +0 -203
- package/esm2022/calendar/services/month-view.service.mjs +0 -223
- package/esm2022/calendar/services/navigation.service.mjs +0 -60
- package/esm2022/calendar/services/scroll-sync.service.mjs +0 -89
- package/esm2022/calendar/services/selection.service.mjs +0 -62
- package/esm2022/calendar/services/weeknames.service.mjs +0 -33
- package/esm2022/calendar/services/year-view.service.mjs +0 -204
- package/esm2022/calendar/templates/cell-template.directive.mjs +0 -45
- package/esm2022/calendar/templates/century-cell-template.directive.mjs +0 -43
- package/esm2022/calendar/templates/decade-cell-template.directive.mjs +0 -43
- package/esm2022/calendar/templates/footer-template.directive.mjs +0 -44
- package/esm2022/calendar/templates/header-template.directive.mjs +0 -47
- package/esm2022/calendar/templates/header-title-template.directive.mjs +0 -43
- package/esm2022/calendar/templates/month-cell-template.directive.mjs +0 -43
- package/esm2022/calendar/templates/navigation-item-template.directive.mjs +0 -43
- package/esm2022/calendar/templates/weeknumber-cell-template.directive.mjs +0 -43
- package/esm2022/calendar/templates/year-cell-template.directive.mjs +0 -43
- package/esm2022/calendar/view-list.component.mjs +0 -497
- package/esm2022/calendar/view.component.mjs +0 -432
- package/esm2022/common/dom-queries.mjs +0 -24
- package/esm2022/common/models/fillmode.mjs +0 -5
- package/esm2022/common/models/rounded.mjs +0 -5
- package/esm2022/common/models/size.mjs +0 -5
- package/esm2022/common/models/week-days-format.mjs +0 -5
- package/esm2022/common/picker.service.mjs +0 -17
- package/esm2022/common/utils.mjs +0 -70
- package/esm2022/dateinput/arrow.enum.mjs +0 -13
- package/esm2022/dateinput/dateinput.component.mjs +0 -1196
- package/esm2022/dateinput/dateinput.module.mjs +0 -45
- package/esm2022/dateinput/localization/dateinput-custom-messages.component.mjs +0 -60
- package/esm2022/dateinput/localization/dateinput-localized-messages.directive.mjs +0 -39
- package/esm2022/dateinput/localization/messages.mjs +0 -39
- package/esm2022/dateinput/models/format-placeholder.model.mjs +0 -5
- package/esm2022/dateinput/models/format-settings.model.mjs +0 -5
- package/esm2022/dateinput/models/incremental-steps.model.mjs +0 -5
- package/esm2022/dateinputs.module.mjs +0 -136
- package/esm2022/datepicker/datepicker.component.mjs +0 -1758
- package/esm2022/datepicker/datepicker.module.mjs +0 -83
- package/esm2022/datepicker/localization/datepicker-custom-messages.component.mjs +0 -53
- package/esm2022/datepicker/localization/datepicker-localized-messages.directive.mjs +0 -39
- package/esm2022/datepicker/localization/messages.mjs +0 -63
- package/esm2022/daterange/auto-correct-on.type.mjs +0 -5
- package/esm2022/daterange/date-range-end-input.directive.mjs +0 -105
- package/esm2022/daterange/date-range-input.mjs +0 -138
- package/esm2022/daterange/date-range-popup-template.directive.mjs +0 -36
- package/esm2022/daterange/date-range-popup.component.mjs +0 -1051
- package/esm2022/daterange/date-range-selection.directive.mjs +0 -223
- package/esm2022/daterange/date-range-start-input.directive.mjs +0 -109
- package/esm2022/daterange/date-range.component.mjs +0 -116
- package/esm2022/daterange/date-range.module.mjs +0 -103
- package/esm2022/daterange/date-range.service.mjs +0 -225
- package/esm2022/daterange/localization/daterange-popup-custom-messages.component.mjs +0 -43
- package/esm2022/daterange/localization/daterange-popup-localized-messages.directive.mjs +0 -39
- package/esm2022/daterange/localization/messages.mjs +0 -51
- package/esm2022/datetimepicker/datetimepicker.component.mjs +0 -2505
- package/esm2022/datetimepicker/datetimepicker.module.mjs +0 -106
- package/esm2022/datetimepicker/localization/datetimepicker-custom-messages.component.mjs +0 -52
- package/esm2022/datetimepicker/localization/localized-messages.directive.mjs +0 -39
- package/esm2022/datetimepicker/localization/messages.mjs +0 -153
- package/esm2022/datetimepicker/models/active-tab.type.mjs +0 -5
- package/esm2022/defaults.mjs +0 -24
- package/esm2022/directives.mjs +0 -146
- package/esm2022/index.mjs +0 -78
- package/esm2022/package-metadata.mjs +0 -16
- package/esm2022/popup-settings.model.mjs +0 -5
- package/esm2022/preventable-event.mjs +0 -27
- package/esm2022/progress-kendo-angular-dateinputs.mjs +0 -8
- package/esm2022/timepicker/localization/messages.mjs +0 -105
- package/esm2022/timepicker/localization/timepicker-custom-messages.component.mjs +0 -54
- package/esm2022/timepicker/localization/timepicker-localized-messages.directive.mjs +0 -39
- package/esm2022/timepicker/localization/timeselector-custom-messages.component.mjs +0 -45
- package/esm2022/timepicker/localization/timeselector-localized-messages.directive.mjs +0 -39
- package/esm2022/timepicker/models/incremental-steps.model.mjs +0 -5
- package/esm2022/timepicker/models/list-item.interface.mjs +0 -5
- package/esm2022/timepicker/models/list-service-settings.mjs +0 -5
- package/esm2022/timepicker/models/list-service.interface.mjs +0 -5
- package/esm2022/timepicker/models/time-part.default.mjs +0 -14
- package/esm2022/timepicker/services/dayperiod.service.mjs +0 -131
- package/esm2022/timepicker/services/dom.service.mjs +0 -126
- package/esm2022/timepicker/services/hours.service.mjs +0 -130
- package/esm2022/timepicker/services/milliseconds.service.mjs +0 -131
- package/esm2022/timepicker/services/minutes.service.mjs +0 -128
- package/esm2022/timepicker/services/seconds.service.mjs +0 -128
- package/esm2022/timepicker/timelist.component.mjs +0 -388
- package/esm2022/timepicker/timepicker.component.mjs +0 -1598
- package/esm2022/timepicker/timepicker.module.mjs +0 -71
- package/esm2022/timepicker/timeselector.component.mjs +0 -728
- package/esm2022/timepicker/util.mjs +0 -70
- package/esm2022/util.mjs +0 -406
- package/esm2022/validators/disabled-date.validator.mjs +0 -18
- package/esm2022/validators/disabled-dates-range.validator.mjs +0 -26
- package/esm2022/validators/incomplete-date.validator.mjs +0 -18
- package/esm2022/validators/max.validator.mjs +0 -21
- package/esm2022/validators/min.validator.mjs +0 -21
- package/esm2022/validators/time-range.validator.mjs +0 -23
- package/esm2022/virtualization/models/scrollable.interface.mjs +0 -5
- package/esm2022/virtualization/services/row-height.service.mjs +0 -73
- package/esm2022/virtualization/services/scroller.service.mjs +0 -109
- package/esm2022/virtualization/virtualization.component.mjs +0 -324
|
@@ -1,109 +0,0 @@
|
|
|
1
|
-
/**-----------------------------------------------------------------------------------------
|
|
2
|
-
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
3
|
-
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
|
-
*-------------------------------------------------------------------------------------------*/
|
|
5
|
-
import { Observable, ReplaySubject } from 'rxjs';
|
|
6
|
-
const normalize = x => Math.max(x, 0);
|
|
7
|
-
/**
|
|
8
|
-
* @hidden
|
|
9
|
-
*/
|
|
10
|
-
export class ScrollAction {
|
|
11
|
-
offset;
|
|
12
|
-
constructor(offset) {
|
|
13
|
-
this.offset = offset;
|
|
14
|
-
}
|
|
15
|
-
}
|
|
16
|
-
/**
|
|
17
|
-
* @hidden
|
|
18
|
-
*/
|
|
19
|
-
export class PageAction {
|
|
20
|
-
skip;
|
|
21
|
-
constructor(skip) {
|
|
22
|
-
this.skip = skip;
|
|
23
|
-
}
|
|
24
|
-
}
|
|
25
|
-
/**
|
|
26
|
-
* @hidden
|
|
27
|
-
*/
|
|
28
|
-
export class ScrollerService {
|
|
29
|
-
scrollObservable;
|
|
30
|
-
direction;
|
|
31
|
-
firstLoaded = 0;
|
|
32
|
-
lastLoaded;
|
|
33
|
-
lastScroll;
|
|
34
|
-
take;
|
|
35
|
-
total;
|
|
36
|
-
rowHeightService;
|
|
37
|
-
scrollSubscription;
|
|
38
|
-
subscription;
|
|
39
|
-
bottomOffset = 0;
|
|
40
|
-
topOffset = 0;
|
|
41
|
-
constructor(scrollObservable) {
|
|
42
|
-
this.scrollObservable = scrollObservable;
|
|
43
|
-
}
|
|
44
|
-
create(rowHeightService, skip, take, total, topOffset = 0, bottomOffset = 0, direction = 'vertical') {
|
|
45
|
-
this.rowHeightService = rowHeightService;
|
|
46
|
-
this.firstLoaded = skip;
|
|
47
|
-
this.lastLoaded = skip + take;
|
|
48
|
-
this.take = take;
|
|
49
|
-
this.total = total;
|
|
50
|
-
this.lastScroll = 0;
|
|
51
|
-
this.topOffset = topOffset;
|
|
52
|
-
this.bottomOffset = bottomOffset;
|
|
53
|
-
this.direction = direction;
|
|
54
|
-
const subject = new ReplaySubject(2);
|
|
55
|
-
const offsetBufferRows = this.rowsForHeight(topOffset);
|
|
56
|
-
const skipWithOffset = normalize(skip - offsetBufferRows);
|
|
57
|
-
subject.next(new ScrollAction(this.rowOffset(skipWithOffset)));
|
|
58
|
-
if (offsetBufferRows) {
|
|
59
|
-
subject.next(new PageAction(skipWithOffset));
|
|
60
|
-
}
|
|
61
|
-
this.subscription = new Observable(observer => {
|
|
62
|
-
this.unsubscribe();
|
|
63
|
-
this.scrollSubscription = this.scrollObservable.subscribe(x => this.onScroll(x, observer));
|
|
64
|
-
}).subscribe((x) => subject.next(x));
|
|
65
|
-
return subject;
|
|
66
|
-
}
|
|
67
|
-
destroy() {
|
|
68
|
-
this.unsubscribe();
|
|
69
|
-
if (this.subscription) {
|
|
70
|
-
this.subscription.unsubscribe();
|
|
71
|
-
}
|
|
72
|
-
}
|
|
73
|
-
onScroll({ scrollLeft, scrollTop, offsetHeight, offsetWidth }, observer) {
|
|
74
|
-
const scrollPosition = this.direction === 'vertical' ? scrollTop : scrollLeft;
|
|
75
|
-
const offsetSize = this.direction === 'vertical' ? offsetHeight : offsetWidth;
|
|
76
|
-
if (this.lastScroll === scrollPosition) {
|
|
77
|
-
return;
|
|
78
|
-
}
|
|
79
|
-
const up = this.lastScroll >= scrollPosition;
|
|
80
|
-
this.lastScroll = scrollPosition;
|
|
81
|
-
const firstItemIndex = this.rowHeightService.index(normalize(scrollPosition - this.topOffset));
|
|
82
|
-
const lastItemIndex = this.rowHeightService.index(normalize(scrollPosition + offsetSize - this.bottomOffset));
|
|
83
|
-
if (!up && lastItemIndex >= this.lastLoaded && this.lastLoaded < this.total) {
|
|
84
|
-
this.firstLoaded = firstItemIndex;
|
|
85
|
-
observer.next(new ScrollAction(this.rowOffset(firstItemIndex)));
|
|
86
|
-
this.lastLoaded = Math.min(this.firstLoaded + this.take, this.total);
|
|
87
|
-
observer.next(new PageAction(this.firstLoaded));
|
|
88
|
-
}
|
|
89
|
-
if (up && firstItemIndex <= this.firstLoaded) {
|
|
90
|
-
const nonVisibleBuffer = Math.floor(this.take * 0.3);
|
|
91
|
-
this.firstLoaded = normalize(firstItemIndex - nonVisibleBuffer);
|
|
92
|
-
observer.next(new ScrollAction(this.rowOffset(this.firstLoaded)));
|
|
93
|
-
this.lastLoaded = Math.min(this.firstLoaded + this.take, this.total);
|
|
94
|
-
observer.next(new PageAction(this.firstLoaded));
|
|
95
|
-
}
|
|
96
|
-
}
|
|
97
|
-
rowOffset(index) {
|
|
98
|
-
return this.rowHeightService.offset(index) + this.topOffset;
|
|
99
|
-
}
|
|
100
|
-
rowsForHeight(height) {
|
|
101
|
-
return Math.ceil(height / this.rowHeightService.height(0));
|
|
102
|
-
}
|
|
103
|
-
unsubscribe() {
|
|
104
|
-
if (this.scrollSubscription) {
|
|
105
|
-
this.scrollSubscription.unsubscribe();
|
|
106
|
-
this.scrollSubscription = null;
|
|
107
|
-
}
|
|
108
|
-
}
|
|
109
|
-
}
|
|
@@ -1,324 +0,0 @@
|
|
|
1
|
-
/**-----------------------------------------------------------------------------------------
|
|
2
|
-
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
3
|
-
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
|
-
*-------------------------------------------------------------------------------------------*/
|
|
5
|
-
/* eslint-disable @angular-eslint/component-selector */
|
|
6
|
-
import { Component, EventEmitter, ElementRef, HostBinding, Input, Inject, Output, InjectionToken, Renderer2, NgZone } from '@angular/core';
|
|
7
|
-
import { RowHeightService } from './services/row-height.service';
|
|
8
|
-
import { ScrollerService, PageAction } from './services/scroller.service';
|
|
9
|
-
import { isDocumentAvailable, ScrollbarWidthService } from '@progress/kendo-angular-common';
|
|
10
|
-
import { Subject, fromEvent, interval, EMPTY, of, combineLatest, animationFrameScheduler as animationFrame } from 'rxjs';
|
|
11
|
-
import { map, scan, takeWhile } from 'rxjs/operators';
|
|
12
|
-
import { NgStyle } from '@angular/common';
|
|
13
|
-
import * as i0 from "@angular/core";
|
|
14
|
-
import * as i1 from "@progress/kendo-angular-common";
|
|
15
|
-
/**
|
|
16
|
-
* @hidden
|
|
17
|
-
*/
|
|
18
|
-
export const SCROLLER_FACTORY_TOKEN = new InjectionToken('dateinputs-scroll-service-factory');
|
|
19
|
-
/**
|
|
20
|
-
* @hidden
|
|
21
|
-
*/
|
|
22
|
-
export function DEFAULT_SCROLLER_FACTORY(observable) {
|
|
23
|
-
return new ScrollerService(observable);
|
|
24
|
-
}
|
|
25
|
-
/**
|
|
26
|
-
* @hidden
|
|
27
|
-
*/
|
|
28
|
-
export var ScrollDirection;
|
|
29
|
-
(function (ScrollDirection) {
|
|
30
|
-
ScrollDirection[ScrollDirection["Backward"] = 0] = "Backward";
|
|
31
|
-
ScrollDirection[ScrollDirection["Forward"] = 1] = "Forward";
|
|
32
|
-
})(ScrollDirection || (ScrollDirection = {}));
|
|
33
|
-
const FRAME_DURATION = 17;
|
|
34
|
-
const scrollModifiers = {
|
|
35
|
-
[ScrollDirection.Forward]: (step) => value => value + step,
|
|
36
|
-
[ScrollDirection.Backward]: (step) => value => value - step
|
|
37
|
-
};
|
|
38
|
-
const scrollNormalizers = {
|
|
39
|
-
[ScrollDirection.Forward]: (end) => value => Math.min(value, end),
|
|
40
|
-
[ScrollDirection.Backward]: (end) => value => Math.max(value, end)
|
|
41
|
-
};
|
|
42
|
-
const scrollValidators = {
|
|
43
|
-
[ScrollDirection.Forward]: end => start => start < end,
|
|
44
|
-
[ScrollDirection.Backward]: end => start => start > end
|
|
45
|
-
};
|
|
46
|
-
const differenceToScroll = (scrollTop, staticOffset, maxScrollDifference) => {
|
|
47
|
-
return Math.min(Math.abs(staticOffset - scrollTop), maxScrollDifference);
|
|
48
|
-
};
|
|
49
|
-
/**
|
|
50
|
-
* @hidden
|
|
51
|
-
*/
|
|
52
|
-
export class VirtualizationComponent {
|
|
53
|
-
container;
|
|
54
|
-
renderer;
|
|
55
|
-
zone;
|
|
56
|
-
scrollBarWidthService;
|
|
57
|
-
direction = 'vertical';
|
|
58
|
-
itemHeight = 1;
|
|
59
|
-
itemWidth = 1;
|
|
60
|
-
topOffset = 0;
|
|
61
|
-
bottomOffset = 0;
|
|
62
|
-
maxScrollDifference = 100;
|
|
63
|
-
scrollOffsetSize = 0;
|
|
64
|
-
scrollDuration = 150;
|
|
65
|
-
skip;
|
|
66
|
-
take;
|
|
67
|
-
total;
|
|
68
|
-
activeIndexChange = new EventEmitter();
|
|
69
|
-
pageChange = new EventEmitter();
|
|
70
|
-
scrollChange = new EventEmitter();
|
|
71
|
-
wrapperClasses = true;
|
|
72
|
-
get horizontalClass() {
|
|
73
|
-
return this.direction === 'horizontal';
|
|
74
|
-
}
|
|
75
|
-
totalSize;
|
|
76
|
-
get totalVertexLength() {
|
|
77
|
-
const value = `${this.totalSize}px`;
|
|
78
|
-
return this.direction === 'vertical' ? { height: value } : { width: value };
|
|
79
|
-
}
|
|
80
|
-
get containerOffsetSize() {
|
|
81
|
-
return this.getContainerProperty(this.direction === 'vertical' ? 'offsetHeight' : 'offsetWidth');
|
|
82
|
-
}
|
|
83
|
-
get containerScrollSize() {
|
|
84
|
-
return this.getContainerProperty(this.direction === 'vertical' ? 'scrollHeight' : 'scrollWidth');
|
|
85
|
-
}
|
|
86
|
-
get containerScrollPosition() {
|
|
87
|
-
return this.getContainerProperty(this.direction === 'vertical' ? 'scrollTop' : 'scrollLeft');
|
|
88
|
-
}
|
|
89
|
-
lastActiveIndex;
|
|
90
|
-
resolvedPromise = Promise.resolve(null);
|
|
91
|
-
scroller;
|
|
92
|
-
rowHeightService;
|
|
93
|
-
dispatcher = new Subject();
|
|
94
|
-
scrollSubscription;
|
|
95
|
-
containerScrollSubscription;
|
|
96
|
-
animationSubscription;
|
|
97
|
-
constructor(scrollerFactory, container, renderer, zone, scrollBarWidthService) {
|
|
98
|
-
this.container = container;
|
|
99
|
-
this.renderer = renderer;
|
|
100
|
-
this.zone = zone;
|
|
101
|
-
this.scrollBarWidthService = scrollBarWidthService;
|
|
102
|
-
this.scroller = scrollerFactory(this.dispatcher);
|
|
103
|
-
}
|
|
104
|
-
ngOnChanges(changes) {
|
|
105
|
-
if (changes.direction || changes.take || changes.total) {
|
|
106
|
-
this.initServices();
|
|
107
|
-
this.totalSize = this.rowHeightService.totalHeight() + this.bottomOffset;
|
|
108
|
-
}
|
|
109
|
-
}
|
|
110
|
-
ngOnInit() {
|
|
111
|
-
if (!this.rowHeightService) {
|
|
112
|
-
this.rowHeightService = this.createRowHeightService();
|
|
113
|
-
}
|
|
114
|
-
}
|
|
115
|
-
ngAfterViewInit() {
|
|
116
|
-
this.zone.runOutsideAngular(() => {
|
|
117
|
-
this.containerScrollSubscription = this.scroll$()
|
|
118
|
-
.pipe(map((event) => event.target))
|
|
119
|
-
.subscribe(t => {
|
|
120
|
-
this.dispatcher.next(t);
|
|
121
|
-
this.emitActiveIndex();
|
|
122
|
-
});
|
|
123
|
-
});
|
|
124
|
-
}
|
|
125
|
-
ngOnDestroy() {
|
|
126
|
-
if (this.containerScrollSubscription) {
|
|
127
|
-
this.containerScrollSubscription.unsubscribe();
|
|
128
|
-
}
|
|
129
|
-
if (this.scrollSubscription) {
|
|
130
|
-
this.scrollSubscription.unsubscribe();
|
|
131
|
-
}
|
|
132
|
-
if (this.animationSubscription) {
|
|
133
|
-
this.animationSubscription.unsubscribe();
|
|
134
|
-
}
|
|
135
|
-
}
|
|
136
|
-
getContainerProperty(propertyName) {
|
|
137
|
-
return this.container.nativeElement[propertyName];
|
|
138
|
-
}
|
|
139
|
-
activeIndex() {
|
|
140
|
-
return this.itemIndex(Math.ceil(this.containerScrollPosition)); //handle subpixeling
|
|
141
|
-
}
|
|
142
|
-
itemIndex(offset) {
|
|
143
|
-
return this.rowHeightService.index(offset);
|
|
144
|
-
}
|
|
145
|
-
itemOffset(index) {
|
|
146
|
-
return this.rowHeightService.offset(index);
|
|
147
|
-
}
|
|
148
|
-
isIndexVisible(index) {
|
|
149
|
-
if (!this.rowHeightService) {
|
|
150
|
-
return false;
|
|
151
|
-
}
|
|
152
|
-
const containerTop = this.containerScrollPosition;
|
|
153
|
-
const containerBottom = containerTop + this.containerOffsetSize;
|
|
154
|
-
const top = this.rowHeightService.offset(index);
|
|
155
|
-
const bottom = top + this.rowHeightService.height(index);
|
|
156
|
-
return top >= containerTop && bottom <= containerBottom;
|
|
157
|
-
}
|
|
158
|
-
isListScrolled(index) {
|
|
159
|
-
return this.containerScrollPosition !== this.rowHeightService.offset(index);
|
|
160
|
-
}
|
|
161
|
-
scrollTo(value) {
|
|
162
|
-
const scrollProperty = this.direction === "vertical" ? 'scrollTop' : 'scrollLeft';
|
|
163
|
-
this.renderer.setProperty(this.container.nativeElement, scrollProperty, value);
|
|
164
|
-
}
|
|
165
|
-
scrollToIndex(index) {
|
|
166
|
-
//XXX: scrolling with tick is required to prevent list jump in Chrome.
|
|
167
|
-
//Original issue: focus first day in the month and press LEFT arrow.
|
|
168
|
-
//Notice how the view jumps on every day change.
|
|
169
|
-
//
|
|
170
|
-
this.zone.runOutsideAngular(() => {
|
|
171
|
-
this.resolvedPromise.then(() => {
|
|
172
|
-
this.scrollTo(this.rowHeightService.offset(index));
|
|
173
|
-
});
|
|
174
|
-
});
|
|
175
|
-
}
|
|
176
|
-
scrollToBottom() {
|
|
177
|
-
this.scrollTo(this.totalSize);
|
|
178
|
-
}
|
|
179
|
-
animateToIndex(index) {
|
|
180
|
-
if (this.animationSubscription) {
|
|
181
|
-
this.animationSubscription.unsubscribe();
|
|
182
|
-
}
|
|
183
|
-
const indexOffset = this.rowHeightService.offset(index);
|
|
184
|
-
const direction = this.getContainerScrollDirection(indexOffset);
|
|
185
|
-
const { start, end } = this.scrollRange(indexOffset, direction);
|
|
186
|
-
if (start === end) {
|
|
187
|
-
return;
|
|
188
|
-
}
|
|
189
|
-
const step = this.scrollStep(start, end);
|
|
190
|
-
const modifyScroll = scrollModifiers[direction](step);
|
|
191
|
-
const normalizeScroll = scrollNormalizers[direction](end);
|
|
192
|
-
const isScrollValid = scrollValidators[direction](modifyScroll(end));
|
|
193
|
-
this.zone.runOutsideAngular(() => {
|
|
194
|
-
this.animationSubscription =
|
|
195
|
-
combineLatest(of(start), interval(0, animationFrame)).pipe(map(stream => stream[0]), scan(modifyScroll), takeWhile(isScrollValid), map(normalizeScroll)).subscribe((x) => this.scrollTo(x));
|
|
196
|
-
});
|
|
197
|
-
}
|
|
198
|
-
scrollRange(indexOffset, direction) {
|
|
199
|
-
const containerScroll = this.containerScrollPosition;
|
|
200
|
-
if (parseInt(indexOffset, 10) === parseInt(containerScroll, 10)) {
|
|
201
|
-
return { start: indexOffset, end: indexOffset };
|
|
202
|
-
}
|
|
203
|
-
const maxScroll = this.containerMaxScroll();
|
|
204
|
-
const sign = direction === ScrollDirection.Backward ? 1 : -1;
|
|
205
|
-
const difference = differenceToScroll(containerScroll, indexOffset, this.maxScrollDifference);
|
|
206
|
-
const end = Math.min(indexOffset, maxScroll);
|
|
207
|
-
const start = Math.min(Math.max(end + (sign * difference), 0), maxScroll);
|
|
208
|
-
return { start, end };
|
|
209
|
-
}
|
|
210
|
-
scrollStep(start, end) {
|
|
211
|
-
return Math.abs(end - start) / (this.scrollDuration / FRAME_DURATION);
|
|
212
|
-
}
|
|
213
|
-
scroll$() {
|
|
214
|
-
return isDocumentAvailable() ? fromEvent(this.container.nativeElement, 'scroll') : EMPTY;
|
|
215
|
-
}
|
|
216
|
-
initServices() {
|
|
217
|
-
this.rowHeightService = this.createRowHeightService();
|
|
218
|
-
if (this.scrollSubscription) {
|
|
219
|
-
this.scrollSubscription.unsubscribe();
|
|
220
|
-
}
|
|
221
|
-
this.scrollSubscription = this.scroller
|
|
222
|
-
.create(this.rowHeightService, this.skip, this.take, this.total, this.topOffset, this.scrollOffsetSize, this.direction)
|
|
223
|
-
.subscribe((x) => {
|
|
224
|
-
if (x instanceof PageAction) {
|
|
225
|
-
this.pageChange.emit(x);
|
|
226
|
-
}
|
|
227
|
-
else {
|
|
228
|
-
this.scrollChange.emit(x);
|
|
229
|
-
}
|
|
230
|
-
});
|
|
231
|
-
}
|
|
232
|
-
createRowHeightService() {
|
|
233
|
-
const dimension = this.direction === 'vertical' ? this.itemHeight : this.itemWidth;
|
|
234
|
-
return new RowHeightService(this.total, dimension, 0);
|
|
235
|
-
}
|
|
236
|
-
emitActiveIndex() {
|
|
237
|
-
const index = this.rowHeightService.index(this.containerScrollPosition - this.topOffset);
|
|
238
|
-
if (this.lastActiveIndex !== index) {
|
|
239
|
-
this.lastActiveIndex = index;
|
|
240
|
-
this.activeIndexChange.emit(index);
|
|
241
|
-
}
|
|
242
|
-
}
|
|
243
|
-
containerMaxScroll() {
|
|
244
|
-
return this.containerScrollSize - this.containerOffsetSize;
|
|
245
|
-
}
|
|
246
|
-
getContainerScrollDirection(indexOffset) {
|
|
247
|
-
return indexOffset < this.containerScrollPosition ? ScrollDirection.Backward : ScrollDirection.Forward;
|
|
248
|
-
}
|
|
249
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: VirtualizationComponent, deps: [{ token: SCROLLER_FACTORY_TOKEN }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.NgZone }, { token: i1.ScrollbarWidthService }], target: i0.ɵɵFactoryTarget.Component });
|
|
250
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: VirtualizationComponent, isStandalone: true, selector: "kendo-virtualization", inputs: { direction: "direction", itemHeight: "itemHeight", itemWidth: "itemWidth", topOffset: "topOffset", bottomOffset: "bottomOffset", maxScrollDifference: "maxScrollDifference", scrollOffsetSize: "scrollOffsetSize", scrollDuration: "scrollDuration", skip: "skip", take: "take", total: "total" }, outputs: { activeIndexChange: "activeIndexChange", pageChange: "pageChange", scrollChange: "scrollChange" }, host: { properties: { "class.k-flex": "this.wrapperClasses", "class.k-content": "this.wrapperClasses", "class.k-scrollable": "this.wrapperClasses", "class.k-scrollable-horizontal": "this.horizontalClass" } }, providers: [{
|
|
251
|
-
provide: SCROLLER_FACTORY_TOKEN,
|
|
252
|
-
useValue: DEFAULT_SCROLLER_FACTORY
|
|
253
|
-
}], usesOnChanges: true, ngImport: i0, template: `
|
|
254
|
-
<ng-content></ng-content>
|
|
255
|
-
<div
|
|
256
|
-
class="k-scrollable-placeholder"
|
|
257
|
-
[class.k-scrollable-horizontal-placeholder]="direction === 'horizontal'"
|
|
258
|
-
[ngStyle]="totalVertexLength"
|
|
259
|
-
></div>
|
|
260
|
-
`, isInline: true, dependencies: [{ kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
261
|
-
}
|
|
262
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: VirtualizationComponent, decorators: [{
|
|
263
|
-
type: Component,
|
|
264
|
-
args: [{
|
|
265
|
-
providers: [{
|
|
266
|
-
provide: SCROLLER_FACTORY_TOKEN,
|
|
267
|
-
useValue: DEFAULT_SCROLLER_FACTORY
|
|
268
|
-
}],
|
|
269
|
-
selector: 'kendo-virtualization',
|
|
270
|
-
template: `
|
|
271
|
-
<ng-content></ng-content>
|
|
272
|
-
<div
|
|
273
|
-
class="k-scrollable-placeholder"
|
|
274
|
-
[class.k-scrollable-horizontal-placeholder]="direction === 'horizontal'"
|
|
275
|
-
[ngStyle]="totalVertexLength"
|
|
276
|
-
></div>
|
|
277
|
-
`,
|
|
278
|
-
standalone: true,
|
|
279
|
-
imports: [NgStyle]
|
|
280
|
-
}]
|
|
281
|
-
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
282
|
-
type: Inject,
|
|
283
|
-
args: [SCROLLER_FACTORY_TOKEN]
|
|
284
|
-
}] }, { type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.NgZone }, { type: i1.ScrollbarWidthService }], propDecorators: { direction: [{
|
|
285
|
-
type: Input
|
|
286
|
-
}], itemHeight: [{
|
|
287
|
-
type: Input
|
|
288
|
-
}], itemWidth: [{
|
|
289
|
-
type: Input
|
|
290
|
-
}], topOffset: [{
|
|
291
|
-
type: Input
|
|
292
|
-
}], bottomOffset: [{
|
|
293
|
-
type: Input
|
|
294
|
-
}], maxScrollDifference: [{
|
|
295
|
-
type: Input
|
|
296
|
-
}], scrollOffsetSize: [{
|
|
297
|
-
type: Input
|
|
298
|
-
}], scrollDuration: [{
|
|
299
|
-
type: Input
|
|
300
|
-
}], skip: [{
|
|
301
|
-
type: Input
|
|
302
|
-
}], take: [{
|
|
303
|
-
type: Input
|
|
304
|
-
}], total: [{
|
|
305
|
-
type: Input
|
|
306
|
-
}], activeIndexChange: [{
|
|
307
|
-
type: Output
|
|
308
|
-
}], pageChange: [{
|
|
309
|
-
type: Output
|
|
310
|
-
}], scrollChange: [{
|
|
311
|
-
type: Output
|
|
312
|
-
}], wrapperClasses: [{
|
|
313
|
-
type: HostBinding,
|
|
314
|
-
args: ['class.k-flex']
|
|
315
|
-
}, {
|
|
316
|
-
type: HostBinding,
|
|
317
|
-
args: ['class.k-content']
|
|
318
|
-
}, {
|
|
319
|
-
type: HostBinding,
|
|
320
|
-
args: ['class.k-scrollable']
|
|
321
|
-
}], horizontalClass: [{
|
|
322
|
-
type: HostBinding,
|
|
323
|
-
args: ['class.k-scrollable-horizontal']
|
|
324
|
-
}] } });
|