ng-virtual-list 20.10.12 → 20.10.14

package/fesm2022/ng-virtual-list.mjs

@@ -142,7 +142,7 @@ const TRACK_BY_PROPERTY_NAME = 'id';
 const DEFAULT_DIRECTION = Directions.VERTICAL;
 const DEFAULT_COLLECTION_MODE = CollectionModes.NORMAL;
 const DISPLAY_OBJECTS_LENGTH_MESUREMENT_ERROR = 1;
-const MAX_SCROLL_TO_ITERATIONS = 5;
+const MAX_SCROLL_TO_ITERATIONS = 7;
 const DEFAULT_SNAPPING_METHOD = SnappingMethods.NORMAL;
 const DEFAULT_SELECT_METHOD = MethodsForSelecting.NONE;
 const DEFAULT_SCREEN_READER_MESSAGE = 'Showing items $1 to $2';
@@ -3111,7 +3111,7 @@ class NgScrollView {
     set totalSize(v) {
         this._totalSize = v;
     }
-    _startPosition = this._totalSize;
+    _startPosition = 0;
     get actualScrollHeight() {
         const { height: viewportHeight } = this.viewportBounds(), totalSize = this._totalSize;
         if (this._inversion) {
@@ -3829,10 +3829,10 @@ class NgScrollerComponent extends NgScrollView {
         if (update) {
             this.scrollBar?.scroll({
                 [isVertical ? TOP_PROP_NAME : LEFT_PROP_NAME]: thumbPosition, fireUpdate: false, behavior: BEHAVIOR_INSTANT,
-                userAction: false, blending: false,
+                userAction: false, blending: true,
             });
         }
-        this.scrollbarShow.set(isVertical ? this.scrollHeight > 0 : this.scrollWidth > 0);
+        this.scrollbarShow.set(this.scrollable);
     }
     ;
     ngAfterViewInit() {
@@ -3843,18 +3843,14 @@ class NgScrollerComponent extends NgScrollView {
     }
     onDragStart() {
         super.onDragStart();
-        if (!!this.scrollBar) {
-            this.scrollBar.stopScrolling();
-        }
+        this.stopScrollbar();
         this._isScrollbarUserAction = false;
         this.updateScrollBar();
     }
     reset() {
         super.reset(this.startOffset());
         this.totalSize = 0;
-        if (this.scrollBar) {
-            this.scrollBar.stopScrolling();
-        }
+        this.stopScrollbar();
         this.refresh(true, true);
         this.prepared = false;
     }
@@ -3880,13 +3876,16 @@ class NgScrollerComponent extends NgScrollView {
     scrollTo(params) {
         const userAction = params.userAction ?? true, blending = params.blending ?? true, fireUpdate = params.fireUpdate ?? false;
         if (userAction && (!blending && !this._isMoving) && !fireUpdate) {
-            if (this.scrollBar) {
-                this.scrollBar.stopScrolling();
-            }
+            this.stopScrollbar();
             this._isScrollbarUserAction = false;
         }
         this.scroll(params);
     }
+    stopScrollbar() {
+        if (!!this.scrollBar) {
+            this.scrollBar.stopScrolling();
+        }
+    }
     onScrollBarDragHandler(event) {
         const { animation, position, min, max, userAction } = event;
         this._isScrollbarUserAction = userAction;
@@ -3929,7 +3928,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
                 args: ['scrollBar', { read: NgScrollBarComponent }]
             }], scrollbarEnabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "scrollbarEnabled", required: false }] }], scrollbarInteractive: [{ type: i0.Input, args: [{ isSignal: true, alias: "scrollbarInteractive", required: false }] }], focusedElement: [{ type: i0.Input, args: [{ isSignal: true, alias: "focusedElement", required: false }] }], content: [{ type: i0.Input, args: [{ isSignal: true, alias: "content", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], classes: [{ type: i0.Input, args: [{ isSignal: true, alias: "classes", required: false }] }], startOffset: [{ type: i0.Input, args: [{ isSignal: true, alias: "startOffset", required: false }] }], endOffset: [{ type: i0.Input, args: [{ isSignal: true, alias: "endOffset", required: false }] }], scrollbarTheme: [{ type: i0.Input, args: [{ isSignal: true, alias: "scrollbarTheme", required: false }] }], scrollbarMinSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "scrollbarMinSize", required: false }] }] } });
 
-const MIN_SCROLL_TO_START_PIXELS = 10, RANGE_DISPLAY_ITEMS_END_OFFSET = 20, MIN_PREPARE_ITERATIONS = 35, PREPARATION_REUPDATE_LENGTH = 15, RESET_CACHE_FRAME_NUMBER = 3, EMPTY_SCROLL_STATE_VERSION = '-1', ROLE_LIST = 'list', ROLE_LIST_BOX = 'listbox', ITEM_ID = 'item-id', ITEM_CONTAINER = 'ngvl-item__container', READY_TO_START = 'ready-to-start', WAIT_FOR_PREPARATION = 'wait-for-preparation';
+const MIN_SCROLL_TO_START_PIXELS = 10, RANGE_DISPLAY_ITEMS_END_OFFSET = 20, MIN_PREPARE_ITERATIONS = 5, PREPARATION_REUPDATE_LENGTH = 2, EMPTY_SCROLL_STATE_VERSION = '-1', ROLE_LIST = 'list', ROLE_LIST_BOX = 'listbox', ITEM_ID = 'item-id', ITEM_CONTAINER = 'ngvl-item__container', READY_TO_START = 'ready-to-start', WAIT_FOR_PREPARATION = 'wait-for-preparation';
 const validateScrollIteration = (value) => {
     return Number.isNaN(value) || (value < 0) ? 0 : value > MAX_SCROLL_TO_ITERATIONS ? MAX_SCROLL_TO_ITERATIONS : value;
 }, validateId = (id) => {
@@ -4856,33 +4855,18 @@ class NgVirtualListComponent {
             }
             if (this._prevScrollStateVersion === v) {
                 this._trackBox.isScrollEnd = true;
-                if (this._updateIterations === RESET_CACHE_FRAME_NUMBER) {
-                    this.refreshActualItemSize(true);
-                }
                 if (this._updateIterations < PREPARATION_REUPDATE_LENGTH) {
                     this._updateIterations++;
-                    this._trackBox.isScrollEnd = true;
                     this._$fireUpdate.next();
                     return of(false);
                 }
             }
             this._prevScrollStateVersion = v;
+            this.refreshActualItemSize(false);
             return of(true);
         }), filter$1(v => !!v), distinctUntilChanged()), $items = toObservable(this.items), $dynamicSize = toObservable(this.dynamicSize);
         const $viewInit = this.$viewInit, $snapScrollToBottom = toObservable(this.snapScrollToBottom), $waitForPreparation = toObservable(this.waitForPreparation);
-        combineLatest([$dynamicSize, $snapScrollToBottom, $waitForPreparation]).pipe(takeUntilDestroyed(this._destroyRef), distinctUntilChanged(), switchMap$1(([dynamicSize, snapScrollToBottom, waitForPreparation]) => {
-            if (!dynamicSize || !snapScrollToBottom || !waitForPreparation) {
-                this._readyToShow = true;
-                this.refreshActualItemSize(true);
-                const scrollerComponent = this._scrollerComponent();
-                if (scrollerComponent) {
-                    scrollerComponent.prepared = true;
-                }
-                this.classes.set({ prepared: true, [READY_TO_START]: true, [WAIT_FOR_PREPARATION]: false });
-                this._service.update();
-                this._$show.next(true);
-                return of(false);
-            }
+        combineLatest([$viewInit, $dynamicSize, $snapScrollToBottom, $waitForPreparation]).pipe(takeUntilDestroyed(this._destroyRef), distinctUntilChanged(), filter$1(([init]) => !!init), switchMap$1(([, dynamicSize, snapScrollToBottom, waitForPreparation]) => {
             if (!!dynamicSize && !!snapScrollToBottom && !!waitForPreparation) {
                 this._$show.next(false);
                 this.cacheClean();
@@ -4893,12 +4877,14 @@ class NgVirtualListComponent {
                     scrollerComponent.stopScrolling();
                 }
                 this.classes.set({ prepared: false, [READY_TO_START]: false, [WAIT_FOR_PREPARATION]: false });
-                return $items.pipe(takeUntilDestroyed(this._destroyRef), debounceTime(0), map(i => (i ?? []).length > 0), distinctUntilChanged(), switchMap$1(v => {
-                    if (!v) {
+                return $items.pipe(takeUntilDestroyed(this._destroyRef), debounceTime(0), tap(items => {
+                    if (!items || items.length === 0) {
                         this.cacheClean();
                         this._readyToShow = this._isUserScrolling = false;
                         this.refreshActualItemSize(false);
-                        this._trackBox.isScrollEnd = true;
+                        if (this.snapScrollToBottom()) {
+                            this._trackBox.isScrollEnd = true;
+                        }
                         this._updateIterations = 0;
                         this._prevScrollStateVersion = EMPTY_SCROLL_STATE_VERSION;
                         const scrollerComponent = this._scrollerComponent();
@@ -4908,6 +4894,10 @@ class NgVirtualListComponent {
                         }
                         this.classes.set({ prepared: false, [READY_TO_START]: false, [WAIT_FOR_PREPARATION]: false });
                         this._$show.next(false);
+                    }
+                    this._trackBox.resetCollection(items, this.itemSize());
+                }), map(i => (i ?? []).length > 0), distinctUntilChanged(), switchMap$1(v => {
+                    if (!v) {
                         return of(false);
                     }
                     return of(true).pipe(takeUntilDestroyed(this._destroyRef), switchMap$1(() => {
@@ -4952,7 +4942,17 @@ class NgVirtualListComponent {
                 this._service.update(true);
                 this._$show.next(true);
                 this._scrollerComponent()?.refresh(true, true);
-                return of(false);
+                return $items.pipe(takeUntilDestroyed(this._destroyRef), debounceTime(0), tap(items => {
+                    if (!items || items.length === 0) {
+                        this.cacheClean();
+                    }
+                    this._trackBox.resetCollection(items, this.itemSize());
+                    const scrollerComponent = this._scrollerComponent();
+                    if (scrollerComponent) {
+                        scrollerComponent.prepared = true;
+                    }
+                }));
+                ;
             }
         })).subscribe();
         this._service.$focusedId.pipe(takeUntilDestroyed(), tap(v => {
@@ -5017,9 +5017,6 @@ class NgVirtualListComponent {
         $isLazy.pipe(takeUntilDestroyed(), tap(v => {
             this._trackBox.isLazy = v;
         })).subscribe();
-        $items.pipe(takeUntilDestroyed(), debounceTime(0), tap(items => {
-            this._trackBox.resetCollection(items, this.actualItemSize());
-        })).subscribe();
         combineLatest([$items, $collapsedItemIds, $itemConfigMap, $trackBy]).pipe(takeUntilDestroyed(), debounceTime(0), tap(([items, collapsedIds, itemConfigMap, trackBy]) => {
             const hiddenItems = new CMap();
             let isCollapsed = false;
@@ -5137,7 +5134,8 @@ class NgVirtualListComponent {
                         this._isScrollFinished.set(scrollPosition >= roundedMaxPosition);
                     }
                 }
-                actualScrollSize = !this._readyToShow && snapScrollToBottom ? (isVertical ? scroller.scrollHeight ?? 0 : scroller.scrollWidth ?? 0) :
+                actualScrollSize = ((!this._readyToShow && snapScrollToBottom) || this._trackBox.isSnappedToEnd) ?
+                    (isVertical ? scroller.scrollHeight ?? 0 : scroller.scrollWidth ?? 0) :
                     (isVertical ? scroller.scrollTop ?? 0 : scroller.scrollLeft ?? 0);
                 const delta = this._trackBox.delta, roundedActualScrollSize = Math.round(actualScrollSize), scrollPositionAfterUpdate = actualScrollSize + delta, roundedScrollPositionAfterUpdate = Math.round(scrollPositionAfterUpdate), roundedMaxPositionAfterUpdate = Math.round(totalSize - viewportSize);
                 if (this._isSnappingMethodAdvanced) {
@@ -5157,10 +5155,11 @@ class NgVirtualListComponent {
                     if (emitable && this._readyToShow) {
                         this.emitScrollEvent(true, false);
                     }
-                    if (!this._readyToShow || roundedMaxPositionAfterUpdate > 0) {
+                    if ((this._readyToShow && roundedMaxPositionAfterUpdate > 0) ||
+                        (roundedMaxPositionAfterUpdate >= 0 && this._scrollSize() !== roundedMaxPositionAfterUpdate)) {
                         const params = {
                             [isVertical ? TOP_PROP_NAME : LEFT_PROP_NAME]: roundedMaxPositionAfterUpdate,
-                            fireUpdate: false, behavior: BEHAVIOR_INSTANT,
+                            fireUpdate: !this._readyToShow, behavior: BEHAVIOR_INSTANT,
                             blending: false, duration: this.animationParams().scrollToItem,
                         };
                         scroller?.scrollTo?.(params);
@@ -5179,7 +5178,7 @@ class NgVirtualListComponent {
                     if (this._scrollSize() !== scrollPositionAfterUpdate) {
                         const params = {
                             [isVertical ? TOP_PROP_NAME : LEFT_PROP_NAME]: scrollPositionAfterUpdate, blending: true,
-                            fireUpdate: false, behavior: BEHAVIOR_INSTANT, duration: this.animationParams().scrollToItem,
+                            fireUpdate: !this._readyToShow, behavior: BEHAVIOR_INSTANT, duration: this.animationParams().scrollToItem,
                         };
                         scroller.scrollTo(params);
                         if (emitable && !this._readyToShow) {
@@ -5203,9 +5202,6 @@ class NgVirtualListComponent {
                 });
             }));
         })).subscribe();
-        combineLatest([$items, $dynamicSize]).pipe(takeUntilDestroyed(), debounceTime(0), filter$1(([, dynamic]) => !dynamic), delay(0), takeUntilDestroyed(), tap(() => {
-            this._scrollerComponent()?.refresh(true);
-        })).subscribe();
         const $scroller = toObservable(this._scroller).pipe(takeUntilDestroyed(), filter$1(v => !!v), map(v => v.nativeElement), take(1)), $scrollerScroll = toObservable(this._scrollerComponent).pipe(takeUntilDestroyed(), filter$1(v => !!v), take(1), switchMap$1(scroller => scroller.$scroll)), $scrollerScrollEnd = toObservable(this._scrollerComponent).pipe(takeUntilDestroyed(), filter$1(v => !!v), take(1), switchMap$1(scroller => scroller.$scrollEnd)), $list = toObservable(this._list).pipe(takeUntilDestroyed(), filter$1(v => !!v), map(v => v.nativeElement), take(1));
         $scroller.pipe(takeUntilDestroyed(), distinctUntilChanged(), switchMap$1(scroller => {
             return fromEvent(scroller, SCROLLER_WHEEL, { passive: true }).pipe(takeUntilDestroyed(this._destroyRef), filter$1(() => {
@@ -5376,7 +5372,7 @@ class NgVirtualListComponent {
                             return of([false, {
                                     id, scroller: scrollerComponent, iteration: iteration + 1, blending,
                                     isLastIteration: notChanged, scrollCalled: true, cb
-                                }]).pipe(delay(1));
+                                }]).pipe(delay(0));
                         }
                         else {
                             this._scrollSize.set(actualScrollSize);