ng-virtual-list 19.11.2 → 19.11.4
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/README.md +1 -0
- package/fesm2022/ng-virtual-list.mjs +109 -46
- package/fesm2022/ng-virtual-list.mjs.map +1 -1
- package/lib/components/ng-list-item/base/base-virtual-list-item-component.d.ts +2 -0
- package/lib/components/ng-list-item/ng-virtual-list-item.component.d.ts +0 -2
- package/lib/components/ng-scroll-view/ng-scroll-view.component.d.ts +3 -1
- package/lib/const/index.d.ts +2 -1
- package/lib/directives/item-click/item-click.directive.d.ts +1 -1
- package/lib/directives/locale-sensitive/locale-sensitive.directive.d.ts +1 -1
- package/lib/interfaces/index.d.ts +2 -1
- package/lib/interfaces/scrolling-settings.d.ts +38 -0
- package/lib/ng-virtual-list.component.d.ts +13 -2
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -638,6 +638,7 @@ Inputs
|
|
|
638
638
|
| scrollbarThumbRenderer | TemplateRef<any> \| null = null | Scrollbar customization template. |
|
|
639
639
|
| scrollbarThumbParams | {[propName: string]: any;} \| null | Additional options for the scrollbar. |
|
|
640
640
|
| scrollBehavior | ScrollBehavior? = 'smooth' | Defines the scrolling behavior for any element on the page. The default value is "smooth". |
|
|
641
|
+
| scrollingSettings | [IScrollingSettings](https://github.com/DjonnyX/ng-virtual-list/blob/19.x/projects/ng-virtual-list/src/lib/interfaces/scrolling-settings.ts) = {frictionalForce: 0.035, mass: 0.005, maxDistance: 12500, maxDuration: 4000, speedScale: 15, optimization: true} | Scrolling settings. |
|
|
641
642
|
| trackBy | string? = 'id' | The name of the property by which tracking is performed. |
|
|
642
643
|
|
|
643
644
|
<br/>
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { Injectable, inject, signal, ElementRef, DestroyRef, computed, output, Input, Directive, Injector, ChangeDetectionStrategy, Component, InjectionToken, viewChild, input, ViewChild, effect, ViewContainerRef, ViewEncapsulation, NO_ERRORS_SCHEMA, NgModule
|
|
2
|
+
import { Injectable, inject, signal, ElementRef, DestroyRef, computed, output, Input, Directive, Injector, ChangeDetectionStrategy, Component, InjectionToken, viewChild, input, ViewChild, effect, ViewContainerRef, ViewEncapsulation, NO_ERRORS_SCHEMA, NgModule } from '@angular/core';
|
|
3
3
|
import { Subject, BehaviorSubject, tap, fromEvent, race, of, debounceTime, switchMap as switchMap$1, combineLatest, map, filter as filter$1, takeUntil as takeUntil$1, startWith, from, take, delay, distinctUntilChanged, skip } from 'rxjs';
|
|
4
4
|
import { takeUntilDestroyed, toObservable } from '@angular/core/rxjs-interop';
|
|
5
5
|
import { BehaviorSubject as BehaviorSubject$1 } from 'rxjs/internal/BehaviorSubject';
|
|
@@ -190,6 +190,14 @@ const DEFAULT_ANIMATION_PARAMS = {
|
|
|
190
190
|
navigateToItem: 150,
|
|
191
191
|
navigateByKeyboard: NAVIGATION_BY_KEYBOARD_TIMER,
|
|
192
192
|
};
|
|
193
|
+
const DEFAULT_SCROLLING_SETTINGS = {
|
|
194
|
+
frictionalForce: 0.035,
|
|
195
|
+
maxDuration: 4000,
|
|
196
|
+
mass: 0.005,
|
|
197
|
+
maxDistance: 12500,
|
|
198
|
+
speedScale: 15,
|
|
199
|
+
optimization: true,
|
|
200
|
+
};
|
|
193
201
|
const DEFAULT_OVERSCROLL_ENABLED = true;
|
|
194
202
|
const DEFAULT_SNAP = false;
|
|
195
203
|
const DEFAULT_SELECT_BY_CLICK = true;
|
|
@@ -2472,6 +2480,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImpo
|
|
|
2472
2480
|
*/
|
|
2473
2481
|
class BaseVirtualListItemComponent {
|
|
2474
2482
|
_apiService = inject(NgVirtualListPublicService);
|
|
2483
|
+
_service = inject(NgVirtualListService);
|
|
2475
2484
|
_id;
|
|
2476
2485
|
get id() {
|
|
2477
2486
|
return this._id;
|
|
@@ -2537,6 +2546,9 @@ class BaseVirtualListItemComponent {
|
|
|
2537
2546
|
}
|
|
2538
2547
|
_destroyRef = inject(DestroyRef);
|
|
2539
2548
|
constructor() {
|
|
2549
|
+
this._id = this._service.generateComponentId();
|
|
2550
|
+
this._listId = this._service.id;
|
|
2551
|
+
this._displayId = createDisplayId(this._listId, this._id);
|
|
2540
2552
|
this.classes = computed(() => {
|
|
2541
2553
|
const data = this.data(), focused = this.focused();
|
|
2542
2554
|
return {
|
|
@@ -2660,7 +2672,7 @@ const DEFAULT_MAX_DISTANCE = 40;
|
|
|
2660
2672
|
* ItemClickDirective
|
|
2661
2673
|
* Maximum performance for extremely large lists.
|
|
2662
2674
|
* It is based on algorithms for virtualization of screen objects.
|
|
2663
|
-
* @link https://github.com/DjonnyX/ng-virtual-list/blob/
|
|
2675
|
+
* @link https://github.com/DjonnyX/ng-virtual-list/blob/19.x/projects/ng-virtual-list/src/lib/directives/item-click/item-click.directive.ts
|
|
2664
2676
|
* @author Evgenii Alexandrovich Grebennikov
|
|
2665
2677
|
* @email djonnyx@gmail.com
|
|
2666
2678
|
*/
|
|
@@ -2718,14 +2730,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImpo
|
|
|
2718
2730
|
* @email djonnyx@gmail.com
|
|
2719
2731
|
*/
|
|
2720
2732
|
class NgVirtualListItemComponent extends BaseVirtualListItemComponent {
|
|
2721
|
-
_service = inject(NgVirtualListService);
|
|
2722
2733
|
maxClickDistance = signal(DEFAULT_CLICK_DISTANCE);
|
|
2723
2734
|
_injector = inject(Injector);
|
|
2724
2735
|
constructor() {
|
|
2725
2736
|
super();
|
|
2726
|
-
this._id = this._service.generateComponentId();
|
|
2727
|
-
this._listId = this._service.id;
|
|
2728
|
-
this._displayId = createDisplayId(this._listId, this._id);
|
|
2729
2737
|
}
|
|
2730
2738
|
ngOnInit() {
|
|
2731
2739
|
this._service.$clickDistance.pipe(takeUntilDestroyed(this._destroyRef), tap(v => {
|
|
@@ -3357,6 +3365,7 @@ class NgScrollView extends BaseScrollView {
|
|
|
3357
3365
|
cdkScrollable;
|
|
3358
3366
|
scrollBehavior = input(DEFAULT_SCROLL_BEHAVIOR);
|
|
3359
3367
|
overscrollEnabled = input(DEFAULT_OVERSCROLL_ENABLED);
|
|
3368
|
+
scrollingSettings = input(DEFAULT_SCROLLING_SETTINGS);
|
|
3360
3369
|
_normalizeValueFromZero = inject(SCROLL_VIEW_NORMALIZE_VALUE_FROM_ZERO);
|
|
3361
3370
|
_$scroll = new Subject();
|
|
3362
3371
|
$scroll = this._$scroll.asObservable();
|
|
@@ -3506,14 +3515,14 @@ class NgScrollView extends BaseScrollView {
|
|
|
3506
3515
|
}
|
|
3507
3516
|
calculateVelocity(offsets, delta, timestamp, indexOffset = 10) {
|
|
3508
3517
|
offsets.push([delta, timestamp < ANIMATOR_MIN_TIMESTAMP ? ANIMATOR_MIN_TIMESTAMP : timestamp]);
|
|
3509
|
-
const len = offsets.length, startIndex = len > indexOffset ? len - indexOffset : 0, lastVSign = calculateDirection(offsets);
|
|
3518
|
+
const len = offsets.length, startIndex = len > indexOffset ? len - indexOffset : 0, lastVSign = calculateDirection(offsets), speedScale = this.scrollingSettings()?.speedScale ?? SPEED_SCALE;
|
|
3510
3519
|
let vSum = 0;
|
|
3511
3520
|
for (let i = startIndex, l = offsets.length; i < l; i++) {
|
|
3512
3521
|
const p0 = offsets[i];
|
|
3513
3522
|
if (lastVSign !== Math.sign(p0[0])) {
|
|
3514
3523
|
continue;
|
|
3515
3524
|
}
|
|
3516
|
-
const v0 = (p0[1] !== 0 ? lastVSign * Math.abs(p0[0] / p0[1]) *
|
|
3525
|
+
const v0 = (p0[1] !== 0 ? lastVSign * Math.abs(p0[0] / p0[1]) * speedScale : 0);
|
|
3517
3526
|
vSum += Math.sign(v0) * Math.pow(v0, 4) * .003;
|
|
3518
3527
|
}
|
|
3519
3528
|
const l = Math.min(offsets.length, indexOffset), v0 = l > 0 ? (vSum / l) : 0;
|
|
@@ -3523,6 +3532,7 @@ class NgScrollView extends BaseScrollView {
|
|
|
3523
3532
|
velocities.push([delta, timestamp < ANIMATOR_MIN_TIMESTAMP ? ANIMATOR_MIN_TIMESTAMP : timestamp]);
|
|
3524
3533
|
const len = velocities.length, startIndex = len > indexOffset ? len - indexOffset : 0;
|
|
3525
3534
|
let aSum = 0, prevV0, iteration = 0, lastVSign = calculateDirection(velocities);
|
|
3535
|
+
const mass = this.scrollingSettings()?.mass ?? MASS;
|
|
3526
3536
|
for (let i = startIndex, l = velocities.length; i < l; i++) {
|
|
3527
3537
|
const v00 = prevV0, v01 = velocities[i];
|
|
3528
3538
|
if (lastVSign !== Math.sign(v01[0])) {
|
|
@@ -3530,13 +3540,13 @@ class NgScrollView extends BaseScrollView {
|
|
|
3530
3540
|
}
|
|
3531
3541
|
if (v00) {
|
|
3532
3542
|
const a0 = timestamp < MAX_VELOCITY_TIMESTAMP ? (v00[1] !== 0 ? (lastVSign * Math.abs(Math.abs(v01[0]) - Math.abs(v00[0]))) / Math.abs(v00[1]) : 0) : 0.1;
|
|
3533
|
-
aSum = (aSum *
|
|
3543
|
+
aSum = (aSum * mass) + a0;
|
|
3534
3544
|
prevV0 = v01;
|
|
3535
3545
|
}
|
|
3536
3546
|
prevV0 = v01;
|
|
3537
3547
|
iteration++;
|
|
3538
3548
|
}
|
|
3539
|
-
const a0 = aSum * FRICTION_FORCE;
|
|
3549
|
+
const a0 = aSum * (this.scrollingSettings()?.frictionalForce ?? FRICTION_FORCE);
|
|
3540
3550
|
return { a0 };
|
|
3541
3551
|
}
|
|
3542
3552
|
stopScrolling() {
|
|
@@ -3547,7 +3557,7 @@ class NgScrollView extends BaseScrollView {
|
|
|
3547
3557
|
}
|
|
3548
3558
|
moveWithAcceleration(isVertical, position, v0, v, a0, timestamp) {
|
|
3549
3559
|
if (a0 !== 0 && timestamp < MAX_VELOCITY_TIMESTAMP) {
|
|
3550
|
-
const dvSign = Math.sign(v), duration = DURATION, maxDuration = MAX_DURATION, maxDistance = dvSign *
|
|
3560
|
+
const dvSign = Math.sign(v), mass = this.scrollingSettings()?.mass ?? MASS, duration = DURATION, maxDuration = this.scrollingSettings()?.maxDuration ?? MAX_DURATION, maxDist = this.scrollingSettings()?.maxDistance ?? MAX_DIST, maxDistance = dvSign * maxDist, s = (dvSign * Math.abs((a0 * Math.pow(duration, 2)) * .5) / 1000) / mass, distance = Math.abs(s) < maxDist ? s : maxDistance, positionWithVelocity = position + (this._inversion ? -1 : 1) * distance, vmax = Math.max(Math.abs(v0), Math.abs(v)), ad = Math.abs(vmax !== 0 ? Math.sqrt(vmax) : 0) * 10 / mass, aDuration = ad < maxDuration ? ad : maxDuration, startPosition = isVertical ? this.y : this.x;
|
|
3551
3561
|
this.animate(startPosition, Math.round(positionWithVelocity), aDuration, easeOutQuad, true);
|
|
3552
3562
|
}
|
|
3553
3563
|
}
|
|
@@ -3667,7 +3677,7 @@ class NgScrollView extends BaseScrollView {
|
|
|
3667
3677
|
}
|
|
3668
3678
|
}
|
|
3669
3679
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: NgScrollView, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3670
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.19", type: NgScrollView, isStandalone: true, selector: "ng-scroll-view", inputs: { scrollBehavior: { classPropertyName: "scrollBehavior", publicName: "scrollBehavior", isSignal: true, isRequired: false, transformFunction: null }, overscrollEnabled: { classPropertyName: "overscrollEnabled", publicName: "overscrollEnabled", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "cdkScrollable", first: true, predicate: ["scrollViewport"], descendants: true, read: CdkScrollable }], usesInheritance: true, ngImport: i0, template: '', isInline: true });
|
|
3680
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.19", type: NgScrollView, isStandalone: true, selector: "ng-scroll-view", inputs: { scrollBehavior: { classPropertyName: "scrollBehavior", publicName: "scrollBehavior", isSignal: true, isRequired: false, transformFunction: null }, overscrollEnabled: { classPropertyName: "overscrollEnabled", publicName: "overscrollEnabled", isSignal: true, isRequired: false, transformFunction: null }, scrollingSettings: { classPropertyName: "scrollingSettings", publicName: "scrollingSettings", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "cdkScrollable", first: true, predicate: ["scrollViewport"], descendants: true, read: CdkScrollable }], usesInheritance: true, ngImport: i0, template: '', isInline: true });
|
|
3671
3681
|
}
|
|
3672
3682
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: NgScrollView, decorators: [{
|
|
3673
3683
|
type: Component,
|
|
@@ -3853,7 +3863,7 @@ const RIGHT = 'right', DIR = 'dir';
|
|
|
3853
3863
|
* LocaleSensitiveDirective
|
|
3854
3864
|
* Maximum performance for extremely large lists.
|
|
3855
3865
|
* It is based on algorithms for virtualization of screen objects.
|
|
3856
|
-
* @link https://github.com/DjonnyX/ng-virtual-list/blob/
|
|
3866
|
+
* @link https://github.com/DjonnyX/ng-virtual-list/blob/19.x/projects/ng-virtual-list/src/lib/directives/locale-sensitive/locale-sensitive.directive.ts
|
|
3857
3867
|
* @author Evgenii Alexandrovich Grebennikov
|
|
3858
3868
|
* @email djonnyx@gmail.com
|
|
3859
3869
|
*/
|
|
@@ -5175,6 +5185,66 @@ class NgVirtualListComponent {
|
|
|
5175
5185
|
* Defines the scrolling behavior for any element on the page. The default value is "smooth".
|
|
5176
5186
|
*/
|
|
5177
5187
|
scrollBehavior = input(DEFAULT_SCROLL_BEHAVIOR, { ...this._scrollBehaviorOptions });
|
|
5188
|
+
_scrollingSettingsOptions = {
|
|
5189
|
+
transform: (v) => {
|
|
5190
|
+
let valid = validateObject(v, true, true);
|
|
5191
|
+
if (valid && !!v) {
|
|
5192
|
+
const { frictionalForce, mass, maxDistance, maxDuration, speedScale, optimization } = v;
|
|
5193
|
+
valid = validateFloat(frictionalForce, true);
|
|
5194
|
+
if (!valid) {
|
|
5195
|
+
console.error('The "frictionalForce" parameter must be of type `number` or `undefined`.');
|
|
5196
|
+
return DEFAULT_SCROLLING_SETTINGS;
|
|
5197
|
+
}
|
|
5198
|
+
valid = validateFloat(mass, true);
|
|
5199
|
+
if (!valid) {
|
|
5200
|
+
console.error('The "mass" parameter must be of type `number` or `undefined`.');
|
|
5201
|
+
return DEFAULT_SCROLLING_SETTINGS;
|
|
5202
|
+
}
|
|
5203
|
+
valid = validateFloat(maxDistance, true);
|
|
5204
|
+
if (!valid) {
|
|
5205
|
+
console.error('The "maxDistance" parameter must be of type `number` or `undefined`.');
|
|
5206
|
+
return DEFAULT_SCROLLING_SETTINGS;
|
|
5207
|
+
}
|
|
5208
|
+
valid = validateFloat(maxDuration, true);
|
|
5209
|
+
if (!valid) {
|
|
5210
|
+
console.error('The "maxDuration" parameter must be of type `number` or `undefined`.');
|
|
5211
|
+
return DEFAULT_SCROLLING_SETTINGS;
|
|
5212
|
+
}
|
|
5213
|
+
valid = validateFloat(speedScale, true);
|
|
5214
|
+
if (!valid) {
|
|
5215
|
+
console.error('The "speedScale" parameter must be of type `number` or `undefined`.');
|
|
5216
|
+
return DEFAULT_SCROLLING_SETTINGS;
|
|
5217
|
+
}
|
|
5218
|
+
valid = validateBoolean(optimization, true);
|
|
5219
|
+
if (!valid) {
|
|
5220
|
+
console.error('The "optimization" parameter must be of type `boolean` or `undefined`.');
|
|
5221
|
+
return DEFAULT_SCROLLING_SETTINGS;
|
|
5222
|
+
}
|
|
5223
|
+
}
|
|
5224
|
+
if (!valid) {
|
|
5225
|
+
console.error('The "scrollingSettings" parameter must be of type `object` or null.');
|
|
5226
|
+
return DEFAULT_SCROLLING_SETTINGS;
|
|
5227
|
+
}
|
|
5228
|
+
return {
|
|
5229
|
+
frictionalForce: v.frictionalForce !== undefined && v.frictionalForce > 0 ? v.frictionalForce : DEFAULT_SCROLLING_SETTINGS.frictionalForce,
|
|
5230
|
+
mass: v.mass !== undefined && v.mass > 0 ? v.mass : DEFAULT_SCROLLING_SETTINGS.mass,
|
|
5231
|
+
maxDistance: v.maxDistance !== undefined && v.maxDistance > 0 ? v.maxDistance : DEFAULT_SCROLLING_SETTINGS.maxDistance,
|
|
5232
|
+
maxDuration: v.maxDuration !== undefined && v.maxDuration > 0 ? v.maxDuration : DEFAULT_SCROLLING_SETTINGS.maxDuration,
|
|
5233
|
+
speedScale: v.speedScale !== undefined && v.speedScale > 0 ? v.speedScale : DEFAULT_SCROLLING_SETTINGS.speedScale,
|
|
5234
|
+
optimization: v.optimization ?? DEFAULT_SCROLLING_SETTINGS.optimization,
|
|
5235
|
+
};
|
|
5236
|
+
},
|
|
5237
|
+
};
|
|
5238
|
+
/**
|
|
5239
|
+
* Scrolling settings.
|
|
5240
|
+
* - frictionalForce - Frictional force. Default value is 0.035.
|
|
5241
|
+
* - mass - Mass. Default value is 0.005.
|
|
5242
|
+
* - maxDistance - Maximum scrolling distance. Default value is 12500.
|
|
5243
|
+
* - maxDuration - Maximum animation duration. Default value is 4000.
|
|
5244
|
+
* - speedScale - Speed scale. Default value is 15.
|
|
5245
|
+
* - optimization - Enables scrolling performance optimization. Default value is `true`.
|
|
5246
|
+
*/
|
|
5247
|
+
scrollingSettings = input(DEFAULT_SCROLLING_SETTINGS, { ...this._scrollingSettingsOptions });
|
|
5178
5248
|
_animationParamsOptions = {
|
|
5179
5249
|
transform: (v) => {
|
|
5180
5250
|
const valid = validateObject(v, true, true);
|
|
@@ -6027,7 +6097,7 @@ class NgVirtualListComponent {
|
|
|
6027
6097
|
}
|
|
6028
6098
|
})).subscribe();
|
|
6029
6099
|
const $preventScrollSnapping = this.$preventScrollSnapping;
|
|
6030
|
-
$preventScrollSnapping.pipe(takeUntilDestroyed(), filter$1(v => !!v),
|
|
6100
|
+
$preventScrollSnapping.pipe(takeUntilDestroyed(), filter$1(v => !!v), tap(() => {
|
|
6031
6101
|
if (this._readyForShow) {
|
|
6032
6102
|
this._trackBox.isScrollEnd;
|
|
6033
6103
|
this._trackBox.isScrollStart = this._trackBox.isScrollEnd = false;
|
|
@@ -6110,12 +6180,12 @@ class NgVirtualListComponent {
|
|
|
6110
6180
|
this.resetBoundsSize(isVertical, totalSize);
|
|
6111
6181
|
this.createDisplayComponentsIfNeed(displayItems);
|
|
6112
6182
|
this.tracking();
|
|
6183
|
+
this.snappingHandler();
|
|
6113
6184
|
const delta = this._trackBox.delta, scrollPositionAfterUpdate = Math.round(actualScrollSize + delta), roundedScrollPositionAfterUpdate = Math.round(scrollPositionAfterUpdate), roundedMaxPositionAfterUpdate = Math.round(totalSize - viewportSize);
|
|
6114
6185
|
if (this._isSnappingMethodAdvanced) {
|
|
6115
6186
|
this.updateRegularRenderer();
|
|
6116
6187
|
}
|
|
6117
6188
|
scroller.delta = delta;
|
|
6118
|
-
this.snappingHandler();
|
|
6119
6189
|
if ((snapScrollToStart && this._trackBox.isSnappedToStart) ||
|
|
6120
6190
|
(snapScrollToStart && currentScrollSize <= MIN_PIXELS_FOR_PREVENT_SNAPPING)) {
|
|
6121
6191
|
if (currentScrollSize !== roundedScrollPositionAfterUpdate) {
|
|
@@ -6156,11 +6226,11 @@ class NgVirtualListComponent {
|
|
|
6156
6226
|
if (emitUpdate) {
|
|
6157
6227
|
this._$update.next(this.getScrollStateVersion(totalSize, this._isVertical ? scroller.scrollTop : scroller.scrollLeft, cacheVersion));
|
|
6158
6228
|
}
|
|
6159
|
-
this._trackBox.isScrollEnd;
|
|
6160
6229
|
return;
|
|
6161
6230
|
}
|
|
6162
|
-
if (
|
|
6163
|
-
(
|
|
6231
|
+
if (scrollSize !== scrollPositionAfterUpdate &&
|
|
6232
|
+
((scrollPositionAfterUpdate >= 0 && scrollPositionAfterUpdate < roundedMaxPositionAfterUpdate) ||
|
|
6233
|
+
(scrollSize !== roundedMaxPositionAfterUpdate || currentScrollSize !== scrollPositionAfterUpdate))) {
|
|
6164
6234
|
this._trackBox.clearDelta();
|
|
6165
6235
|
if (this._readyForShow) {
|
|
6166
6236
|
this.emitScrollEvent(true, false, userAction);
|
|
@@ -6173,8 +6243,8 @@ class NgVirtualListComponent {
|
|
|
6173
6243
|
if (emitUpdate) {
|
|
6174
6244
|
this._$update.next(this.getScrollStateVersion(totalSize, this._isVertical ? scroller.scrollTop : scroller.scrollLeft, cacheVersion));
|
|
6175
6245
|
}
|
|
6246
|
+
return;
|
|
6176
6247
|
}
|
|
6177
|
-
return;
|
|
6178
6248
|
}
|
|
6179
6249
|
if (emitUpdate) {
|
|
6180
6250
|
this._$update.next(this.getScrollStateVersion(totalSize, this._isVertical ? scroller.scrollTop : scroller.scrollLeft, cacheVersion));
|
|
@@ -6192,16 +6262,18 @@ class NgVirtualListComponent {
|
|
|
6192
6262
|
itemsChanged = true;
|
|
6193
6263
|
prevItems = items;
|
|
6194
6264
|
}
|
|
6195
|
-
const scroller = this._scrollerComponent(), velocity = this._scrollerComponent()?.averageVelocity ?? 0, maxScrollSize = isVertical ? (scroller?.scrollHeight || 0) : (scroller?.scrollWidth ?? 0), isEdges = scrollSize === 0 || scrollSize === maxScrollSize, isScrolling = this._$scrollingTo.getValue(), useDebouncedUpdate = dynamicSize && !itemsChanged && hasUserAction && !isScrolling && (velocity > 0 && velocity < MAX_VELOCITY_FOR_SCROLL_QUALITY_OPTIMIZATION_LVL1), rerenderOptimization = dynamicSize && !itemsChanged && (hasUserAction || hasScrollbarUserAction) && !isEdges && velocity > 0 &&
|
|
6265
|
+
const enabledOptimization = this.scrollingSettings()?.optimization ?? DEFAULT_SCROLLING_SETTINGS.optimization, scroller = this._scrollerComponent(), velocity = this._scrollerComponent()?.averageVelocity ?? 0, maxScrollSize = isVertical ? (scroller?.scrollHeight || 0) : (scroller?.scrollWidth ?? 0), isEdges = scrollSize === 0 || scrollSize === maxScrollSize, isScrolling = this._$scrollingTo.getValue(), useDebouncedUpdate = dynamicSize && !itemsChanged && hasUserAction && !isScrolling && (velocity > 0 && velocity < MAX_VELOCITY_FOR_SCROLL_QUALITY_OPTIMIZATION_LVL1), rerenderOptimization = enabledOptimization && dynamicSize && !itemsChanged && (hasUserAction || hasScrollbarUserAction) && !isEdges && velocity > 0 &&
|
|
6196
6266
|
(velocity > MAX_VELOCITY_FOR_SCROLL_QUALITY_OPTIMIZATION_LVL2 || hasUserAction);
|
|
6197
|
-
if (
|
|
6198
|
-
|
|
6199
|
-
|
|
6200
|
-
|
|
6201
|
-
|
|
6202
|
-
|
|
6267
|
+
if (enabledOptimization) {
|
|
6268
|
+
if (useDebouncedUpdate) {
|
|
6269
|
+
debouncedUpdate.execute({
|
|
6270
|
+
snapScrollToStart, snapScrollToEnd, bounds, listBounds, scrollEndOffset, items, itemConfigMap, scrollSize, itemSize, collapsedIds,
|
|
6271
|
+
bufferSize, maxBufferSize, snap, isVertical, dynamicSize, enabledBufferOptimization, cacheVersion, userAction: hasUserAction,
|
|
6272
|
+
}, rerenderOptimization, itemsChanged);
|
|
6273
|
+
return;
|
|
6274
|
+
}
|
|
6275
|
+
debouncedUpdate.dispose();
|
|
6203
6276
|
}
|
|
6204
|
-
debouncedUpdate.dispose();
|
|
6205
6277
|
if (!isScrolling) {
|
|
6206
6278
|
update({
|
|
6207
6279
|
snapScrollToStart, snapScrollToEnd, bounds, listBounds, scrollEndOffset, items, itemConfigMap, scrollSize, itemSize, collapsedIds,
|
|
@@ -6214,19 +6286,10 @@ class NgVirtualListComponent {
|
|
|
6214
6286
|
const scrollHandler = (userAction = false) => {
|
|
6215
6287
|
const scroller = this._scrollerComponent();
|
|
6216
6288
|
if (!!scroller) {
|
|
6217
|
-
const isVertical = this._isVertical,
|
|
6289
|
+
const isVertical = this._isVertical, scrollSize = (isVertical ? scroller.scrollTop : scroller.scrollLeft), actualScrollSize = scrollSize;
|
|
6218
6290
|
if (this._readyForShow) {
|
|
6219
6291
|
if (userAction) {
|
|
6220
|
-
|
|
6221
|
-
if (scrollSize > MIN_PIXELS_FOR_PREVENT_SNAPPING) {
|
|
6222
|
-
this._$preventScrollSnapping.next(true);
|
|
6223
|
-
}
|
|
6224
|
-
}
|
|
6225
|
-
if (this._trackBox.isSnappedToEnd) {
|
|
6226
|
-
if (scrollSize < (maxScrollSize - MIN_PIXELS_FOR_PREVENT_SNAPPING)) {
|
|
6227
|
-
this._$preventScrollSnapping.next(true);
|
|
6228
|
-
}
|
|
6229
|
-
}
|
|
6292
|
+
this._$preventScrollSnapping.next(true);
|
|
6230
6293
|
}
|
|
6231
6294
|
}
|
|
6232
6295
|
this._scrollSize.set(actualScrollSize);
|
|
@@ -6772,7 +6835,7 @@ class NgVirtualListComponent {
|
|
|
6772
6835
|
}
|
|
6773
6836
|
if (!!this._snappedDisplayComponents) {
|
|
6774
6837
|
while (this._snappedDisplayComponents.length > 0) {
|
|
6775
|
-
const comp = this.
|
|
6838
|
+
const comp = this._snappedDisplayComponents.shift();
|
|
6776
6839
|
comp?.destroy();
|
|
6777
6840
|
}
|
|
6778
6841
|
}
|
|
@@ -6784,13 +6847,13 @@ class NgVirtualListComponent {
|
|
|
6784
6847
|
}
|
|
6785
6848
|
}
|
|
6786
6849
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: NgVirtualListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
6787
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.19", type: NgVirtualListComponent, isStandalone: false, selector: "ng-virtual-list", inputs: { scrollbarThickness: { classPropertyName: "scrollbarThickness", publicName: "scrollbarThickness", isSignal: true, isRequired: false, transformFunction: null }, scrollbarMinSize: { classPropertyName: "scrollbarMinSize", publicName: "scrollbarMinSize", isSignal: true, isRequired: false, transformFunction: null }, scrollbarThumbRenderer: { classPropertyName: "scrollbarThumbRenderer", publicName: "scrollbarThumbRenderer", isSignal: true, isRequired: false, transformFunction: null }, scrollbarThumbParams: { classPropertyName: "scrollbarThumbParams", publicName: "scrollbarThumbParams", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, waitForPreparation: { classPropertyName: "waitForPreparation", publicName: "waitForPreparation", isSignal: true, isRequired: false, transformFunction: null }, clickDistance: { classPropertyName: "clickDistance", publicName: "clickDistance", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null }, defaultItemValue: { classPropertyName: "defaultItemValue", publicName: "defaultItemValue", isSignal: true, isRequired: false, transformFunction: null }, selectedIds: { classPropertyName: "selectedIds", publicName: "selectedIds", isSignal: true, isRequired: false, transformFunction: null }, collapsedIds: { classPropertyName: "collapsedIds", publicName: "collapsedIds", isSignal: true, isRequired: false, transformFunction: null }, selectByClick: { classPropertyName: "selectByClick", publicName: "selectByClick", isSignal: true, isRequired: false, transformFunction: null }, collapseByClick: { classPropertyName: "collapseByClick", publicName: "collapseByClick", isSignal: true, isRequired: false, transformFunction: null }, snap: { classPropertyName: "snap", publicName: "snap", isSignal: true, isRequired: false, transformFunction: null }, snapToEndTransitionInstantOffset: { classPropertyName: "snapToEndTransitionInstantOffset", publicName: "snapToEndTransitionInstantOffset", isSignal: true, isRequired: false, transformFunction: null }, scrollStartOffset: { classPropertyName: "scrollStartOffset", publicName: "scrollStartOffset", isSignal: true, isRequired: false, transformFunction: null }, scrollEndOffset: { classPropertyName: "scrollEndOffset", publicName: "scrollEndOffset", isSignal: true, isRequired: false, transformFunction: null }, snapScrollToStart: { classPropertyName: "snapScrollToStart", publicName: "snapScrollToStart", isSignal: true, isRequired: false, transformFunction: null }, snapScrollToEnd: { classPropertyName: "snapScrollToEnd", publicName: "snapScrollToEnd", isSignal: true, isRequired: false, transformFunction: null }, snapScrollToBottom: { classPropertyName: "snapScrollToBottom", publicName: "snapScrollToBottom", isSignal: true, isRequired: false, transformFunction: null }, scrollbarEnabled: { classPropertyName: "scrollbarEnabled", publicName: "scrollbarEnabled", isSignal: true, isRequired: false, transformFunction: null }, scrollbarInteractive: { classPropertyName: "scrollbarInteractive", publicName: "scrollbarInteractive", isSignal: true, isRequired: false, transformFunction: null }, scrollBehavior: { classPropertyName: "scrollBehavior", publicName: "scrollBehavior", isSignal: true, isRequired: false, transformFunction: null }, animationParams: { classPropertyName: "animationParams", publicName: "animationParams", isSignal: true, isRequired: false, transformFunction: null }, overscrollEnabled: { classPropertyName: "overscrollEnabled", publicName: "overscrollEnabled", isSignal: true, isRequired: false, transformFunction: null }, enabledBufferOptimization: { classPropertyName: "enabledBufferOptimization", publicName: "enabledBufferOptimization", isSignal: true, isRequired: false, transformFunction: null }, itemRenderer: { classPropertyName: "itemRenderer", publicName: "itemRenderer", isSignal: true, isRequired: true, transformFunction: null }, itemConfigMap: { classPropertyName: "itemConfigMap", publicName: "itemConfigMap", isSignal: true, isRequired: false, transformFunction: null }, itemSize: { classPropertyName: "itemSize", publicName: "itemSize", isSignal: true, isRequired: false, transformFunction: null }, dynamicSize: { classPropertyName: "dynamicSize", publicName: "dynamicSize", isSignal: true, isRequired: false, transformFunction: null }, direction: { classPropertyName: "direction", publicName: "direction", isSignal: true, isRequired: false, transformFunction: null }, collectionMode: { classPropertyName: "collectionMode", publicName: "collectionMode", isSignal: true, isRequired: false, transformFunction: null }, bufferSize: { classPropertyName: "bufferSize", publicName: "bufferSize", isSignal: true, isRequired: false, transformFunction: null }, maxBufferSize: { classPropertyName: "maxBufferSize", publicName: "maxBufferSize", isSignal: true, isRequired: false, transformFunction: null }, snappingMethod: { classPropertyName: "snappingMethod", publicName: "snappingMethod", isSignal: true, isRequired: false, transformFunction: null }, methodForSelecting: { classPropertyName: "methodForSelecting", publicName: "methodForSelecting", isSignal: true, isRequired: false, transformFunction: null }, trackBy: { classPropertyName: "trackBy", publicName: "trackBy", isSignal: true, isRequired: false, transformFunction: null }, screenReaderMessage: { classPropertyName: "screenReaderMessage", publicName: "screenReaderMessage", isSignal: true, isRequired: false, transformFunction: null }, langTextDir: { classPropertyName: "langTextDir", publicName: "langTextDir", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onScroll: "onScroll", onScrollEnd: "onScrollEnd", onViewportChange: "onViewportChange", onItemClick: "onItemClick", onSelect: "onSelect", onCollapse: "onCollapse", onScrollReachStart: "onScrollReachStart", onScrollReachEnd: "onScrollReachEnd" }, host: { styleAttribute: "position: relative;" }, providers: [NgVirtualListService, NgVirtualListPublicService], viewQueries: [{ propertyName: "_prerender", first: true, predicate: ["prerender"], descendants: true, isSignal: true }, { propertyName: "_scrollerComponent", first: true, predicate: ["scroller"], descendants: true, isSignal: true }, { propertyName: "_listContainerRef", first: true, predicate: ["renderersContainer"], descendants: true, read: ViewContainerRef }, { propertyName: "_snapContainerRef", first: true, predicate: ["snapRendererContainer"], descendants: true, read: ViewContainerRef }], ngImport: i0, template: "<div aria-live=\"polite\" aria-atomic=\"true\" class=\"ngvl__screen-reader\">\r\n {{ screenReaderFormattedMessage() }}\r\n</div>\r\n\r\n<ng-prerender-container #prerender [bounds]=\"bounds()!\" [direction]=\"direction()\"\r\n [dynamic]=\"dynamicSize()\" [isVertical]=\"isVertical\" [itemSize]=\"itemSize()\" [trackBy]=\"trackBy()\"\r\n [itemRenderer]=\"itemRenderer()\" [startOffset]=\"scrollStartOffset()\" [endOffset]=\"scrollEndOffset()\"\r\n [scrollbarEnabled]=\"scroller.scrollbarShow()\" [enabled]=\"dynamicSize() && snapScrollToEnd()\" />\r\n\r\n@if (snap()) {\r\n <div localeSensitive [langTextDir]=\"langTextDir()\" #snappedContainer class=\"ngvl__snapped-container\"\r\n [ngClass]=\"classes()\">\r\n <div #snapped part=\"snapped-item\" class=\"ngvl__list-snapper\">\r\n <ng-container #snapRendererContainer></ng-container>\r\n </div>\r\n </div>\r\n}\r\n<ng-scroller #scroller class=\"ngvl__list-scroller\" [classes]=\"classes()\" [startOffset]=\"scrollStartOffset()\"\r\n [direction]=\"direction()\" [endOffset]=\"scrollEndOffset()\" [scrollbarThumbRenderer]=\"scrollbarThumbRenderer()\"\r\n [scrollbarThickness]=\"scrollbarThickness()\" [scrollbarThumbParams]=\"scrollbarThumbParams()\"\r\n [focusedElement]=\"focusedElement()\" [loading]=\"loading()\" [overscrollEnabled]=\"overscrollEnabled()\"\r\n [scrollbarEnabled]=\"scrollbarEnabled()\" [scrollbarInteractive]=\"scrollbarInteractive()\"\r\n [scrollbarMinSize]=\"scrollbarMinSize()\" [scrollBehavior]=\"scrollBehavior()\">\r\n <ng-container #renderersContainer></ng-container>\r\n</ng-scroller>", styles: [":host{position:relative;display:block;width:400px;overflow:hidden}:host(.horizontal){height:48px}:host(.vertical){height:320px}.ngvl__snapped-container{position:relative;width:100%;opacity:0}.ngvl__snapped-container.prepared{opacity:1}.ngvl__list-snapper{-webkit-tap-highlight-color:transparent;pointer-events:none;position:absolute;list-style:none;left:0;top:0;z-index:1}.ngvl__list-scroller{-webkit-tap-highlight-color:transparent;position:absolute;left:0;top:0;width:100%;height:100%;z-index:0}.ngvl__screen-reader{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: NgScrollerComponent, selector: "ng-scroller", inputs: ["scrollbarEnabled", "scrollbarInteractive", "focusedElement", "content", "loading", "classes", "scrollbarMinSize", "scrollbarThickness", "scrollbarThumbRenderer", "scrollbarThumbParams"], outputs: ["onScrollbarVisible"] }, { kind: "component", type: NgPrerenderContainer, selector: "ng-prerender-container", inputs: ["enabled", "direction", "isVertical", "scrollbarEnabled", "startOffset", "endOffset", "bounds", "dynamic", "itemSize", "trackBy", "itemRenderer"] }, { kind: "directive", type: LocaleSensitiveDirective, selector: "[localeSensitive]", inputs: ["langTextDir", "listDir"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.ShadowDom });
|
|
6850
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.19", type: NgVirtualListComponent, isStandalone: false, selector: "ng-virtual-list", inputs: { scrollbarThickness: { classPropertyName: "scrollbarThickness", publicName: "scrollbarThickness", isSignal: true, isRequired: false, transformFunction: null }, scrollbarMinSize: { classPropertyName: "scrollbarMinSize", publicName: "scrollbarMinSize", isSignal: true, isRequired: false, transformFunction: null }, scrollbarThumbRenderer: { classPropertyName: "scrollbarThumbRenderer", publicName: "scrollbarThumbRenderer", isSignal: true, isRequired: false, transformFunction: null }, scrollbarThumbParams: { classPropertyName: "scrollbarThumbParams", publicName: "scrollbarThumbParams", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, waitForPreparation: { classPropertyName: "waitForPreparation", publicName: "waitForPreparation", isSignal: true, isRequired: false, transformFunction: null }, clickDistance: { classPropertyName: "clickDistance", publicName: "clickDistance", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null }, defaultItemValue: { classPropertyName: "defaultItemValue", publicName: "defaultItemValue", isSignal: true, isRequired: false, transformFunction: null }, selectedIds: { classPropertyName: "selectedIds", publicName: "selectedIds", isSignal: true, isRequired: false, transformFunction: null }, collapsedIds: { classPropertyName: "collapsedIds", publicName: "collapsedIds", isSignal: true, isRequired: false, transformFunction: null }, selectByClick: { classPropertyName: "selectByClick", publicName: "selectByClick", isSignal: true, isRequired: false, transformFunction: null }, collapseByClick: { classPropertyName: "collapseByClick", publicName: "collapseByClick", isSignal: true, isRequired: false, transformFunction: null }, snap: { classPropertyName: "snap", publicName: "snap", isSignal: true, isRequired: false, transformFunction: null }, snapToEndTransitionInstantOffset: { classPropertyName: "snapToEndTransitionInstantOffset", publicName: "snapToEndTransitionInstantOffset", isSignal: true, isRequired: false, transformFunction: null }, scrollStartOffset: { classPropertyName: "scrollStartOffset", publicName: "scrollStartOffset", isSignal: true, isRequired: false, transformFunction: null }, scrollEndOffset: { classPropertyName: "scrollEndOffset", publicName: "scrollEndOffset", isSignal: true, isRequired: false, transformFunction: null }, snapScrollToStart: { classPropertyName: "snapScrollToStart", publicName: "snapScrollToStart", isSignal: true, isRequired: false, transformFunction: null }, snapScrollToEnd: { classPropertyName: "snapScrollToEnd", publicName: "snapScrollToEnd", isSignal: true, isRequired: false, transformFunction: null }, snapScrollToBottom: { classPropertyName: "snapScrollToBottom", publicName: "snapScrollToBottom", isSignal: true, isRequired: false, transformFunction: null }, scrollbarEnabled: { classPropertyName: "scrollbarEnabled", publicName: "scrollbarEnabled", isSignal: true, isRequired: false, transformFunction: null }, scrollbarInteractive: { classPropertyName: "scrollbarInteractive", publicName: "scrollbarInteractive", isSignal: true, isRequired: false, transformFunction: null }, scrollBehavior: { classPropertyName: "scrollBehavior", publicName: "scrollBehavior", isSignal: true, isRequired: false, transformFunction: null }, scrollingSettings: { classPropertyName: "scrollingSettings", publicName: "scrollingSettings", isSignal: true, isRequired: false, transformFunction: null }, animationParams: { classPropertyName: "animationParams", publicName: "animationParams", isSignal: true, isRequired: false, transformFunction: null }, overscrollEnabled: { classPropertyName: "overscrollEnabled", publicName: "overscrollEnabled", isSignal: true, isRequired: false, transformFunction: null }, enabledBufferOptimization: { classPropertyName: "enabledBufferOptimization", publicName: "enabledBufferOptimization", isSignal: true, isRequired: false, transformFunction: null }, itemRenderer: { classPropertyName: "itemRenderer", publicName: "itemRenderer", isSignal: true, isRequired: true, transformFunction: null }, itemConfigMap: { classPropertyName: "itemConfigMap", publicName: "itemConfigMap", isSignal: true, isRequired: false, transformFunction: null }, itemSize: { classPropertyName: "itemSize", publicName: "itemSize", isSignal: true, isRequired: false, transformFunction: null }, dynamicSize: { classPropertyName: "dynamicSize", publicName: "dynamicSize", isSignal: true, isRequired: false, transformFunction: null }, direction: { classPropertyName: "direction", publicName: "direction", isSignal: true, isRequired: false, transformFunction: null }, collectionMode: { classPropertyName: "collectionMode", publicName: "collectionMode", isSignal: true, isRequired: false, transformFunction: null }, bufferSize: { classPropertyName: "bufferSize", publicName: "bufferSize", isSignal: true, isRequired: false, transformFunction: null }, maxBufferSize: { classPropertyName: "maxBufferSize", publicName: "maxBufferSize", isSignal: true, isRequired: false, transformFunction: null }, snappingMethod: { classPropertyName: "snappingMethod", publicName: "snappingMethod", isSignal: true, isRequired: false, transformFunction: null }, methodForSelecting: { classPropertyName: "methodForSelecting", publicName: "methodForSelecting", isSignal: true, isRequired: false, transformFunction: null }, trackBy: { classPropertyName: "trackBy", publicName: "trackBy", isSignal: true, isRequired: false, transformFunction: null }, screenReaderMessage: { classPropertyName: "screenReaderMessage", publicName: "screenReaderMessage", isSignal: true, isRequired: false, transformFunction: null }, langTextDir: { classPropertyName: "langTextDir", publicName: "langTextDir", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onScroll: "onScroll", onScrollEnd: "onScrollEnd", onViewportChange: "onViewportChange", onItemClick: "onItemClick", onSelect: "onSelect", onCollapse: "onCollapse", onScrollReachStart: "onScrollReachStart", onScrollReachEnd: "onScrollReachEnd" }, host: { styleAttribute: "position: relative;" }, providers: [NgVirtualListService, NgVirtualListPublicService], viewQueries: [{ propertyName: "_prerender", first: true, predicate: ["prerender"], descendants: true, isSignal: true }, { propertyName: "_scrollerComponent", first: true, predicate: ["scroller"], descendants: true, isSignal: true }, { propertyName: "_listContainerRef", first: true, predicate: ["renderersContainer"], descendants: true, read: ViewContainerRef }, { propertyName: "_snapContainerRef", first: true, predicate: ["snapRendererContainer"], descendants: true, read: ViewContainerRef }], ngImport: i0, template: "<div aria-live=\"polite\" aria-atomic=\"true\" class=\"ngvl__screen-reader\">\r\n {{ screenReaderFormattedMessage() }}\r\n</div>\r\n\r\n<ng-prerender-container #prerender [bounds]=\"bounds()!\" [direction]=\"direction()\"\r\n [dynamic]=\"dynamicSize()\" [isVertical]=\"isVertical\" [itemSize]=\"itemSize()\" [trackBy]=\"trackBy()\"\r\n [itemRenderer]=\"itemRenderer()\" [startOffset]=\"scrollStartOffset()\" [endOffset]=\"scrollEndOffset()\"\r\n [scrollbarEnabled]=\"scroller.scrollbarShow()\" [enabled]=\"dynamicSize() && snapScrollToEnd()\" />\r\n\r\n@if (snap()) {\r\n <div localeSensitive [langTextDir]=\"langTextDir()\" #snappedContainer class=\"ngvl__snapped-container\"\r\n [ngClass]=\"classes()\">\r\n <div #snapped part=\"snapped-item\" class=\"ngvl__list-snapper\">\r\n <ng-container #snapRendererContainer></ng-container>\r\n </div>\r\n </div>\r\n}\r\n<ng-scroller #scroller class=\"ngvl__list-scroller\" [classes]=\"classes()\" [startOffset]=\"scrollStartOffset()\"\r\n [direction]=\"direction()\" [endOffset]=\"scrollEndOffset()\" [scrollbarThumbRenderer]=\"scrollbarThumbRenderer()\"\r\n [scrollbarThickness]=\"scrollbarThickness()\" [scrollbarThumbParams]=\"scrollbarThumbParams()\"\r\n [focusedElement]=\"focusedElement()\" [loading]=\"loading()\" [overscrollEnabled]=\"overscrollEnabled()\"\r\n [scrollbarEnabled]=\"scrollbarEnabled()\" [scrollbarInteractive]=\"scrollbarInteractive()\"\r\n [scrollbarMinSize]=\"scrollbarMinSize()\" [scrollBehavior]=\"scrollBehavior()\" [scrollingSettings]=\"scrollingSettings()\">\r\n <ng-container #renderersContainer></ng-container>\r\n</ng-scroller>", styles: [":host{position:relative;display:block;width:400px;overflow:hidden}:host(.horizontal){height:48px}:host(.vertical){height:320px}.ngvl__snapped-container{position:relative;width:100%;opacity:0}.ngvl__snapped-container.prepared{opacity:1}.ngvl__list-snapper{-webkit-tap-highlight-color:transparent;pointer-events:none;position:absolute;list-style:none;left:0;top:0;z-index:1}.ngvl__list-scroller{-webkit-tap-highlight-color:transparent;position:absolute;left:0;top:0;width:100%;height:100%;z-index:0}.ngvl__screen-reader{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: NgScrollerComponent, selector: "ng-scroller", inputs: ["scrollbarEnabled", "scrollbarInteractive", "focusedElement", "content", "loading", "classes", "scrollbarMinSize", "scrollbarThickness", "scrollbarThumbRenderer", "scrollbarThumbParams"], outputs: ["onScrollbarVisible"] }, { kind: "component", type: NgPrerenderContainer, selector: "ng-prerender-container", inputs: ["enabled", "direction", "isVertical", "scrollbarEnabled", "startOffset", "endOffset", "bounds", "dynamic", "itemSize", "trackBy", "itemRenderer"] }, { kind: "directive", type: LocaleSensitiveDirective, selector: "[localeSensitive]", inputs: ["langTextDir", "listDir"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.ShadowDom });
|
|
6788
6851
|
}
|
|
6789
6852
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: NgVirtualListComponent, decorators: [{
|
|
6790
6853
|
type: Component,
|
|
6791
6854
|
args: [{ selector: 'ng-virtual-list', host: {
|
|
6792
6855
|
'style': 'position: relative;'
|
|
6793
|
-
}, standalone: false, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.ShadowDom, providers: [NgVirtualListService, NgVirtualListPublicService], template: "<div aria-live=\"polite\" aria-atomic=\"true\" class=\"ngvl__screen-reader\">\r\n {{ screenReaderFormattedMessage() }}\r\n</div>\r\n\r\n<ng-prerender-container #prerender [bounds]=\"bounds()!\" [direction]=\"direction()\"\r\n [dynamic]=\"dynamicSize()\" [isVertical]=\"isVertical\" [itemSize]=\"itemSize()\" [trackBy]=\"trackBy()\"\r\n [itemRenderer]=\"itemRenderer()\" [startOffset]=\"scrollStartOffset()\" [endOffset]=\"scrollEndOffset()\"\r\n [scrollbarEnabled]=\"scroller.scrollbarShow()\" [enabled]=\"dynamicSize() && snapScrollToEnd()\" />\r\n\r\n@if (snap()) {\r\n <div localeSensitive [langTextDir]=\"langTextDir()\" #snappedContainer class=\"ngvl__snapped-container\"\r\n [ngClass]=\"classes()\">\r\n <div #snapped part=\"snapped-item\" class=\"ngvl__list-snapper\">\r\n <ng-container #snapRendererContainer></ng-container>\r\n </div>\r\n </div>\r\n}\r\n<ng-scroller #scroller class=\"ngvl__list-scroller\" [classes]=\"classes()\" [startOffset]=\"scrollStartOffset()\"\r\n [direction]=\"direction()\" [endOffset]=\"scrollEndOffset()\" [scrollbarThumbRenderer]=\"scrollbarThumbRenderer()\"\r\n [scrollbarThickness]=\"scrollbarThickness()\" [scrollbarThumbParams]=\"scrollbarThumbParams()\"\r\n [focusedElement]=\"focusedElement()\" [loading]=\"loading()\" [overscrollEnabled]=\"overscrollEnabled()\"\r\n [scrollbarEnabled]=\"scrollbarEnabled()\" [scrollbarInteractive]=\"scrollbarInteractive()\"\r\n [scrollbarMinSize]=\"scrollbarMinSize()\" [scrollBehavior]=\"scrollBehavior()\">\r\n <ng-container #renderersContainer></ng-container>\r\n</ng-scroller>", styles: [":host{position:relative;display:block;width:400px;overflow:hidden}:host(.horizontal){height:48px}:host(.vertical){height:320px}.ngvl__snapped-container{position:relative;width:100%;opacity:0}.ngvl__snapped-container.prepared{opacity:1}.ngvl__list-snapper{-webkit-tap-highlight-color:transparent;pointer-events:none;position:absolute;list-style:none;left:0;top:0;z-index:1}.ngvl__list-scroller{-webkit-tap-highlight-color:transparent;position:absolute;left:0;top:0;width:100%;height:100%;z-index:0}.ngvl__screen-reader{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}\n"] }]
|
|
6856
|
+
}, standalone: false, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.ShadowDom, providers: [NgVirtualListService, NgVirtualListPublicService], template: "<div aria-live=\"polite\" aria-atomic=\"true\" class=\"ngvl__screen-reader\">\r\n {{ screenReaderFormattedMessage() }}\r\n</div>\r\n\r\n<ng-prerender-container #prerender [bounds]=\"bounds()!\" [direction]=\"direction()\"\r\n [dynamic]=\"dynamicSize()\" [isVertical]=\"isVertical\" [itemSize]=\"itemSize()\" [trackBy]=\"trackBy()\"\r\n [itemRenderer]=\"itemRenderer()\" [startOffset]=\"scrollStartOffset()\" [endOffset]=\"scrollEndOffset()\"\r\n [scrollbarEnabled]=\"scroller.scrollbarShow()\" [enabled]=\"dynamicSize() && snapScrollToEnd()\" />\r\n\r\n@if (snap()) {\r\n <div localeSensitive [langTextDir]=\"langTextDir()\" #snappedContainer class=\"ngvl__snapped-container\"\r\n [ngClass]=\"classes()\">\r\n <div #snapped part=\"snapped-item\" class=\"ngvl__list-snapper\">\r\n <ng-container #snapRendererContainer></ng-container>\r\n </div>\r\n </div>\r\n}\r\n<ng-scroller #scroller class=\"ngvl__list-scroller\" [classes]=\"classes()\" [startOffset]=\"scrollStartOffset()\"\r\n [direction]=\"direction()\" [endOffset]=\"scrollEndOffset()\" [scrollbarThumbRenderer]=\"scrollbarThumbRenderer()\"\r\n [scrollbarThickness]=\"scrollbarThickness()\" [scrollbarThumbParams]=\"scrollbarThumbParams()\"\r\n [focusedElement]=\"focusedElement()\" [loading]=\"loading()\" [overscrollEnabled]=\"overscrollEnabled()\"\r\n [scrollbarEnabled]=\"scrollbarEnabled()\" [scrollbarInteractive]=\"scrollbarInteractive()\"\r\n [scrollbarMinSize]=\"scrollbarMinSize()\" [scrollBehavior]=\"scrollBehavior()\" [scrollingSettings]=\"scrollingSettings()\">\r\n <ng-container #renderersContainer></ng-container>\r\n</ng-scroller>", styles: [":host{position:relative;display:block;width:400px;overflow:hidden}:host(.horizontal){height:48px}:host(.vertical){height:320px}.ngvl__snapped-container{position:relative;width:100%;opacity:0}.ngvl__snapped-container.prepared{opacity:1}.ngvl__list-snapper{-webkit-tap-highlight-color:transparent;pointer-events:none;position:absolute;list-style:none;left:0;top:0;z-index:1}.ngvl__list-scroller{-webkit-tap-highlight-color:transparent;position:absolute;left:0;top:0;width:100%;height:100%;z-index:0}.ngvl__screen-reader{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}\n"] }]
|
|
6794
6857
|
}], ctorParameters: () => [], propDecorators: { _listContainerRef: [{
|
|
6795
6858
|
type: ViewChild,
|
|
6796
6859
|
args: ['renderersContainer', { read: ViewContainerRef }]
|
|
@@ -6840,7 +6903,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImpo
|
|
|
6840
6903
|
declarations: [NgVirtualListItemComponent],
|
|
6841
6904
|
exports: [NgVirtualListItemComponent],
|
|
6842
6905
|
imports: [CommonModule, ItemClickModule],
|
|
6843
|
-
schemas: [
|
|
6906
|
+
schemas: [NO_ERRORS_SCHEMA],
|
|
6844
6907
|
}]
|
|
6845
6908
|
}] });
|
|
6846
6909
|
|
|
@@ -6855,7 +6918,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImpo
|
|
|
6855
6918
|
declarations: [NgScrollBarComponent],
|
|
6856
6919
|
exports: [NgScrollBarComponent],
|
|
6857
6920
|
imports: [CommonModule],
|
|
6858
|
-
schemas: [
|
|
6921
|
+
schemas: [NO_ERRORS_SCHEMA],
|
|
6859
6922
|
}]
|
|
6860
6923
|
}] });
|
|
6861
6924
|
|
|
@@ -6870,7 +6933,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImpo
|
|
|
6870
6933
|
declarations: [NgScrollerComponent],
|
|
6871
6934
|
exports: [NgScrollerComponent],
|
|
6872
6935
|
imports: [CommonModule, NgScrollBarModule, LocaleSensitiveModule, CdkScrollableModule],
|
|
6873
|
-
schemas: [
|
|
6936
|
+
schemas: [NO_ERRORS_SCHEMA],
|
|
6874
6937
|
}]
|
|
6875
6938
|
}] });
|
|
6876
6939
|
|
|
@@ -6885,7 +6948,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImpo
|
|
|
6885
6948
|
declarations: [NgPrerenderVirtualListItemComponent],
|
|
6886
6949
|
exports: [NgPrerenderVirtualListItemComponent],
|
|
6887
6950
|
imports: [CommonModule, ItemClickModule],
|
|
6888
|
-
schemas: [
|
|
6951
|
+
schemas: [NO_ERRORS_SCHEMA],
|
|
6889
6952
|
}]
|
|
6890
6953
|
}] });
|
|
6891
6954
|
|
|
@@ -6900,7 +6963,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImpo
|
|
|
6900
6963
|
declarations: [NgPrerenderScrollerComponent],
|
|
6901
6964
|
exports: [NgPrerenderScrollerComponent],
|
|
6902
6965
|
imports: [CommonModule, LocaleSensitiveModule],
|
|
6903
|
-
schemas: [
|
|
6966
|
+
schemas: [NO_ERRORS_SCHEMA],
|
|
6904
6967
|
}]
|
|
6905
6968
|
}] });
|
|
6906
6969
|
|