ng-virtual-list 19.10.3 → 19.10.5

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 = 7;
+const MAX_SCROLL_TO_ITERATIONS = 5;
 const DEFAULT_SNAPPING_METHOD = SnappingMethods.NORMAL;
 const DEFAULT_SELECT_METHOD = MethodsForSelecting.NONE;
 const DEFAULT_SCREEN_READER_MESSAGE = 'Showing items $1 to $2';
@@ -637,7 +637,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImpo
                 args: ['maxClickDistance']
             }] } });
 
-const ZEROS_POSITION = -1000, NAVIGATE_TO_ATTEMT = 5, ATTR_AREA_SELECTED = 'area-selected', POSITION = 'position', POSITION_ZERO = '0', ID$1 = 'item-id', KEY_SPACE = ' ', KEY_ARR_LEFT = 'ArrowLeft', KEY_ARR_UP = 'ArrowUp', KEY_ARR_RIGHT = 'ArrowRight', KEY_ARR_DOWN = 'ArrowDown', EVENT_FOCUS_IN = 'focusin', EVENT_FOCUS_OUT = 'focusout', EVENT_KEY_DOWN = 'keydown', CLASS_NAME_SNAPPED = 'snapped', CLASS_NAME_SNAPPED_OUT = 'snapped-out', CLASS_NAME_FOCUS = 'focus';
+const TRANSLATE_3D_HIDDEN = 'translate3d(-1000px,-1000px,0)', NAVIGATE_TO_ATTEMT = 5, ATTR_AREA_SELECTED = 'area-selected', POSITION = 'position', POSITION_ZERO = '0', ID$1 = 'item-id', KEY_SPACE = ' ', KEY_ARR_LEFT = 'ArrowLeft', KEY_ARR_UP = 'ArrowUp', KEY_ARR_RIGHT = 'ArrowRight', KEY_ARR_DOWN = 'ArrowDown', EVENT_FOCUS_IN = 'focusin', EVENT_FOCUS_OUT = 'focusout', EVENT_KEY_DOWN = 'keydown', CLASS_NAME_SNAPPED = 'snapped', CLASS_NAME_SNAPPED_OUT = 'snapped-out', CLASS_NAME_FOCUS = 'focus';
 /**
  * Virtual list component.
  * Maximum performance for extremely large lists.
@@ -986,7 +986,7 @@ class NgVirtualListItemComponent extends BaseVirtualListItemComponent {
     hide() {
         const el = this._elementRef.nativeElement, styles = el.style;
         styles.position = POSITION_ABSOLUTE;
-        styles.transform = `${TRANSLATE_3D}(${this._data?.config?.isVertical ? 0 : ZEROS_POSITION},${this._data?.config?.isVertical ? 0 : ZEROS_POSITION},0)`;
+        styles.transform = TRANSLATE_3D_HIDDEN;
         styles.zIndex = HIDDEN_ZINDEX;
         if (this.regular) {
             if (styles.display === DISPLAY_NONE) {
@@ -1605,8 +1605,6 @@ const bufferInterpolation = (currentBufferValue, array, value, extra) => {
 var TrackBoxEvents;
 (function (TrackBoxEvents) {
     TrackBoxEvents["CHANGE"] = "change";
-    TrackBoxEvents["PREPARE"] = "prepare";
-    TrackBoxEvents["RESET"] = "reset";
 })(TrackBoxEvents || (TrackBoxEvents = {}));
 var ItemDisplayMethods;
 (function (ItemDisplayMethods) {
@@ -1744,10 +1742,6 @@ class TrackBox extends CacheMap {
     _resetBufferSizeTimeout = DEFAULT_RESET_BUFFER_SIZE_TIMEOUT;
     _resetBufferSizeTimer;
     _isReseted = true;
-    _prepared = false;
-    _preparedToStart = false;
-    _preparedToStartIterations = 2;
-    get prepared() { return this._prepared; }
     lifeCircle() {
         this.fireChangeIfNeed();
         this.lifeCircleDo();
@@ -1763,12 +1757,7 @@ class TrackBox extends CacheMap {
         }
         const reseted = ((!this._previousCollection || this._previousCollection.length === 0) &&
             (!!currentCollection && currentCollection.length > 0));
-        if (this._isReseted !== reseted && reseted && this._prepared) {
-            this._prepared = false;
-            this.dispatch(TrackBoxEvents.PREPARE, false);
-        }
         this._isReseted = reseted;
-        this.dispatch(TrackBoxEvents.RESET, reseted);
         this.updateCache(this._previousCollection, currentCollection, itemSize);
         this._previousCollection = [...(currentCollection || [])];
     }
@@ -1897,7 +1886,7 @@ class TrackBox extends CacheMap {
     updateCollection(items, itemConfigMap, options) {
         const opt = { itemConfigMap, ...options }, dynamicSize = opt.dynamicSize, crudDetected = this._crudDetected, deletedItemsMap = this._deletedItemsMap;
         if (dynamicSize) {
-            this.cacheElements();
+            this.cacheElements(opt.isVertical, opt.itemSize);
         }
         this._defaultBufferSize = opt.bufferSize;
         this._maxBufferSize = opt.maxBufferSize;
@@ -1920,16 +1909,6 @@ class TrackBox extends CacheMap {
         }
         this._delta += metrics.delta;
         this.updateAdaptiveBufferParams(metrics, items.length);
-        if (!opt.dynamicSize || (this._preparedToStart && !this._prepared && this._previousTotalSize === metrics.totalSize)) {
-            this._prepared = true;
-            this.dispatch(TrackBoxEvents.PREPARE, true);
-        }
-        if (this._preparedToStartIterations > 0 && this._previousTotalSize !== metrics.totalSize) {
-            this._preparedToStartIterations--;
-        }
-        if (this._preparedToStartIterations === 0) {
-            this._preparedToStart = true;
-        }
         this._previousTotalSize = metrics.totalSize;
         this._deletedItemsMap = {};
         if (!dynamicSize) {
@@ -2222,6 +2201,20 @@ class TrackBox extends CacheMap {
         };
         return metrics;
     }
+    resetCache(collection, trackBy, isVertical, itemSize, bounds) {
+        const map = this._map;
+        for (let i = 0, l = collection.length; i < l; i++) {
+            const collectionItem = collection[i], id = collectionItem[trackBy];
+            if (map.has(id)) {
+                const cache = map.get(id), bSize = isVertical ? bounds.height : bounds.width;
+                map.set(id, {
+                    ...cache,
+                    width: isVertical ? cache.width : (cache.width <= itemSize || cache.width === bSize) ? itemSize : cache.width,
+                    height: isVertical ? (cache.height <= itemSize || cache.height === bSize) ? itemSize : cache.height : cache.height
+                });
+            }
+        }
+    }
     clearDeltaDirection() {
         this.clearScrollDirectionCache();
     }
@@ -2492,7 +2485,7 @@ class TrackBox extends CacheMap {
     _debouncedIsScrollStartOff = debounce(() => {
         this._isScrollStart = false;
     });
-    cacheElements() {
+    cacheElements(isVertical, itemSize) {
         if (!this._displayComponents) {
             return;
         }
@@ -2502,11 +2495,13 @@ class TrackBox extends CacheMap {
                 continue;
             }
             const bounds = component.instance.getBounds();
-            if (bounds.width && bounds.height) {
-                this.set(itemId, { ...this.get(itemId), ...bounds });
-                if (this._isLazy && (this._isScrollStart)) {
-                    this._debouncedIsScrollStartOff.execute();
-                }
+            this.set(itemId, {
+                ...this.get(itemId), ...bounds,
+                width: bounds.width || (isVertical ? 0 : itemSize),
+                height: bounds.height || (isVertical ? itemSize : 0),
+            });
+            if (this._isLazy && (this._isScrollStart)) {
+                this._debouncedIsScrollStartOff.execute();
             }
         }
     }
@@ -2999,7 +2994,7 @@ const easeLinear = (t) => {
     return t + t;
 };
 
-const DEFAULT_ANIMATION_DURATION = 500, ANIMATOR_MIN_TIMESTAMP = 20, MIN_ANIMATED_VALUE = 10;
+const DEFAULT_ANIMATION_DURATION = 500, ANIMATOR_MIN_TIMESTAMP = 1000 / 30, MIN_ANIMATED_VALUE = 10;
 class Animator {
     _animationId = 0;
     animate(params) {
@@ -3068,7 +3063,7 @@ const calculateDirection = (buffer) => {
     }
     return 1;
 };
-const TOP$1 = 'top', LEFT$1 = 'left', INSTANT$1 = 'instant', AUTO$1 = 'auto', SMOOTH = 'smooth', DURATION = 2000, FRICTION_FORCE = .035, MAX_DURATION = 4000, ANIMATION_DURATION = 50, MASS = .005, MAX_DIST = 12500, MAX_VELOCITY_TIMESTAMP = 100, SPEED_SCALE = 5, OVERSCROLL_START_ITERATION = 2;
+const TOP$1 = 'top', LEFT$1 = 'left', INSTANT$1 = 'instant', AUTO$1 = 'auto', SMOOTH = 'smooth', DURATION = 2000, FRICTION_FORCE = .035, MAX_DURATION = 4000, ANIMATION_DURATION = 50, MASS = .005, MAX_DIST = 12500, MAX_VELOCITY_TIMESTAMP = 100, SPEED_SCALE = 15, OVERSCROLL_START_ITERATION = 2;
 const SCROLL_EVENT$1 = new Event(SCROLLER_SCROLL), WHEEL_EVENT$1 = new Event(SCROLLER_WHEEL), SCROLLBAR_SCROLL_EVENT$1 = new Event(SCROLLER_SCROLLBAR_SCROLL);
 /**
  * NgScrollView
@@ -3099,6 +3094,9 @@ class NgScrollView {
     }
     _destroyRef = inject(DestroyRef);
     _isMoving = false;
+    get isMoving() {
+        return this._isMoving;
+    }
     _x = 0;
     set x(v) {
         this._x = this._actualX = v;
@@ -3113,7 +3111,7 @@ class NgScrollView {
     set totalSize(v) {
         this._totalSize = v;
     }
-    _prevTotalSize = this._totalSize;
+    _startPosition = 0;
     get actualScrollHeight() {
         const { height: viewportHeight } = this.viewportBounds(), totalSize = this._totalSize;
         if (this._inversion) {
@@ -3177,6 +3175,9 @@ class NgScrollView {
     _interactive = true;
     _inversion = inject(SCROLL_VIEW_INVERSION);
     _overscrollIteration = 0;
+    set delta(v) {
+        this._startPosition += v;
+    }
     constructor() {
         this._viewportResizeObserver = new ResizeObserver(this._onResizeViewportHandler);
         this._contentResizeObserver = new ResizeObserver(this._onResizeContentHandler);
@@ -3215,21 +3216,17 @@ class NgScrollView {
                 if (target.classList.contains(INTERACTIVE)) {
                     return of(undefined);
                 }
-                this._prevTotalSize = this._totalSize;
                 const inversion = this._inversion, isVertical = this.isVertical();
                 this._isMoving = true;
                 this.grabbing.set(true);
-                const startPos = isVertical ? this.y : this.x;
+                this._startPosition = (isVertical ? this.y : this.x);
                 let prevClientPosition = 0, startClientPos = isVertical ? e.clientY : e.clientX, offsets = new Array(), velocities = new Array(), startTime = Date.now();
                 return fromEvent(window, MOUSE_MOVE, { passive: false }).pipe(takeUntilDestroyed(this._destroyRef), takeUntil$1($mouseDragCancel), tap(e => {
                     this.checkOverscroll(e);
                 }), switchMap$1(e => {
-                    startClientPos += (this._totalSize - this._prevTotalSize);
-                    this._prevTotalSize = this._totalSize;
-                    const currentPos = (isVertical ? e.clientY : e.clientX), scrollSize = isVertical ? this.scrollHeight : this.scrollWidth, delta = (inversion ? -1 : 1) * (startClientPos - currentPos), dp = startPos + delta, position = Math.round(dp < 0 ? 0 : dp > scrollSize ? scrollSize : dp), endTime = Date.now(), timestamp = endTime - startTime, scrollDelta = prevClientPosition === 0 ? 0 : prevClientPosition - currentPos, { v0 } = this.calculateVelocity(offsets, scrollDelta, timestamp);
-                    this.calculateAcceleration(velocities, v0, timestamp);
+                    const { position, currentPos, endTime, scrollDelta } = this.calculatePosition(isVertical, e, inversion, startClientPos, startTime, prevClientPosition, offsets, velocities);
                     prevClientPosition = currentPos;
-                    this.move(isVertical, position, false, true);
+                    this.move(isVertical, position, true, true, true);
                     startTime = endTime;
                     return race([fromEvent(window, MOUSE_UP, { passive: false }), fromEvent(content, MOUSE_UP, { passive: false })]).pipe(takeUntilDestroyed(this._destroyRef), tap(e => {
                         this.cancelOverscroll();
@@ -3239,7 +3236,7 @@ class NgScrollView {
                         if (this.scrollBehavior() === BEHAVIOR_INSTANT) {
                             return;
                         }
-                        this.moveWithAcceleration(isVertical, position, 0, v0, a0);
+                        this.moveWithAcceleration(isVertical, position, 0, v0, a0, timestamp);
                     }));
                 }));
             }));
@@ -3257,21 +3254,17 @@ class NgScrollView {
                 if (target.classList.contains(INTERACTIVE)) {
                     return of(undefined);
                 }
-                this._prevTotalSize = this._totalSize;
                 const inversion = this._inversion, isVertical = this.isVertical();
                 this._isMoving = true;
                 this.grabbing.set(true);
-                const startPos = isVertical ? this.y : this.x;
-                let prevClientPosition = 0, startClientPos = isVertical ? e.touches[e.touches.length - 1].clientY : e.touches[e.touches.length - 1].clientX, offsets = new Array(), velocities = new Array(), startTime = Date.now(), prevTotalSize = this._totalSize;
+                this._startPosition = (isVertical ? this.y : this.x);
+                let prevClientPosition = 0, startClientPos = isVertical ? e.touches[e.touches.length - 1].clientY : e.touches[e.touches.length - 1].clientX, offsets = new Array(), velocities = new Array(), startTime = Date.now();
                 return fromEvent(window, TOUCH_MOVE, { passive: false }).pipe(takeUntilDestroyed(this._destroyRef), takeUntil$1($touchCanceler), tap(e => {
                     this.checkOverscroll(e);
                 }), switchMap$1(e => {
-                    startClientPos += (this._totalSize - prevTotalSize);
-                    prevTotalSize = this._totalSize;
-                    const currentPos = isVertical ? e.touches[e.touches.length - 1].clientY : e.touches[e.touches.length - 1].clientX, scrollSize = isVertical ? this.scrollHeight : this.scrollWidth, delta = (inversion ? -1 : 1) * (startClientPos - currentPos), dp = startPos + delta, position = Math.round(dp < 0 ? 0 : dp > scrollSize ? scrollSize : dp), endTime = Date.now(), timestamp = endTime - startTime, scrollDelta = prevClientPosition === 0 ? 0 : prevClientPosition - currentPos, { v0 } = this.calculateVelocity(offsets, scrollDelta, timestamp);
-                    this.calculateAcceleration(velocities, v0, timestamp);
+                    const { position, currentPos, endTime, scrollDelta } = this.calculatePosition(isVertical, e, inversion, startClientPos, startTime, prevClientPosition, offsets, velocities);
                     prevClientPosition = currentPos;
-                    this.move(isVertical, position, false, true);
+                    this.move(isVertical, position, true, true, true);
                     startTime = endTime;
                     return race([fromEvent(window, TOUCH_END, { passive: false }), fromEvent(content, TOUCH_END, { passive: false })]).pipe(takeUntilDestroyed(this._destroyRef), tap(e => {
                         this.cancelOverscroll();
@@ -3281,12 +3274,17 @@ class NgScrollView {
                         if (this.scrollBehavior() === BEHAVIOR_INSTANT) {
                             return;
                         }
-                        this.moveWithAcceleration(isVertical, position, this._velocity, v0, a0);
+                        this.moveWithAcceleration(isVertical, position, this._velocity, v0, a0, timestamp);
                     }));
                 }));
             }));
         })).subscribe();
     }
+    calculatePosition(isVertical, e, inversion, startClientPos, startTime, prevClientPosition, offsets, velocities) {
+        const currentPos = isVertical ? e.touches?.[e.touches?.length - 1]?.clientY || e.clientY : e.touches?.[e.touches?.length - 1]?.clientX || e.clientX, scrollSize = isVertical ? this.scrollHeight : this.scrollWidth, delta = (inversion ? -1 : 1) * (startClientPos - currentPos), dp = this._startPosition + delta, position = Math.round(dp < 0 ? 0 : dp > scrollSize ? scrollSize : dp), endTime = Date.now(), timestamp = endTime - startTime, scrollDelta = prevClientPosition === 0 ? 0 : prevClientPosition - currentPos, { v0 } = this.calculateVelocity(offsets, scrollDelta, timestamp);
+        this.calculateAcceleration(velocities, v0, timestamp);
+        return { position, currentPos, endTime, scrollDelta };
+    }
     cancelOverscroll() {
         if (!this.overscrollEnabled()) {
             return;
@@ -3355,8 +3353,8 @@ class NgScrollView {
                 continue;
             }
             if (v00) {
-                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;
-                aSum += a0;
+                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;
+                aSum = (aSum * MASS) + a0;
                 prevV0 = v01;
             }
             prevV0 = v01;
@@ -3370,10 +3368,9 @@ class NgScrollView {
     }
     move(isVertical, position, blending = false, userAction = false, fireUpdate = true) {
         this.scroll({ [isVertical ? TOP$1 : LEFT$1]: position, behavior: INSTANT$1, blending, userAction, fireUpdate });
-        this._prevTotalSize = this._totalSize;
     }
-    moveWithAcceleration(isVertical, position, v0, v, a0) {
-        if (a0 !== 0) {
+    moveWithAcceleration(isVertical, position, v0, v, a0, timestamp) {
+        if (a0 !== 0 && timestamp < MAX_VELOCITY_TIMESTAMP) {
             const dvSign = Math.sign(v), duration = DURATION, maxDuration = MAX_DURATION, maxDistance = dvSign * MAX_DIST, s = (dvSign * Math.abs((a0 * Math.pow(duration, 2)) * .5) / 1000) / MASS, distance = Math.abs(s) < MAX_DIST ? 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;
             this.animate(startPosition, Math.round(positionWithVelocity), aDuration, easeOutQuad, true);
         }
@@ -3932,7 +3929,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImpo
                 args: ['scrollBar', { read: NgScrollBarComponent }]
             }] } });
 
-const MIN_SCROLL_TO_START_PIXELS = 10, RANGE_DISPLAY_ITEMS_END_OFFSET = 20, MIN_PREPARE_ITERATIONS = 15, 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 = 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 validateScrollIteration = (value) => {
     return Number.isNaN(value) || (value < 0) ? 0 : value > MAX_SCROLL_TO_ITERATIONS ? MAX_SCROLL_TO_ITERATIONS : value;
 }, validateId = (id) => {
@@ -4460,6 +4457,7 @@ class NgVirtualListComponent {
      * to adjust the sizes of the items in the unallocated area.
      */
     itemSize = input(DEFAULT_ITEM_SIZE, { ...this._itemSizeOptions });
+    actualItemSize = signal(this.itemSize());
     _dynamicSizeOptions = {
         transform: (v) => {
             const valid = validateBoolean(v);
@@ -4696,7 +4694,8 @@ class NgVirtualListComponent {
         }
         const scroller = this._scrollerComponent();
         if (!!scroller) {
-            scroller.refresh(true, true);
+            const updatebale = this._readyToShow;
+            scroller.refresh(updatebale, updatebale);
         }
     };
     _onListResizeHandler = () => {
@@ -4709,6 +4708,9 @@ class NgVirtualListComponent {
         }
     };
     itemToFocus = (element, position, align = FocusAlignments.CENTER, behavior = BEHAVIOR_AUTO) => {
+        if (!this._readyToShow) {
+            return;
+        }
         const scroller = this._scrollerComponent();
         if (scroller) {
             const { width, height } = this._bounds(), { width: elementWidth, height: elementHeight } = element.getBoundingClientRect(), isVertical = this._isVertical, viewportSize = isVertical ? height : width, elementSize = isVertical ? elementHeight : elementWidth;
@@ -4776,8 +4778,6 @@ class NgVirtualListComponent {
         this._cacheVersion.set(v);
     };
     _cacheVersion = signal(-1);
-    _$prepared = new BehaviorSubject$1(false);
-    $prepared = this._$prepared.asObservable();
     _$update = new Subject();
     $update = this._$update.asObservable();
     _$isResetedReachStart = new BehaviorSubject$1(true);
@@ -4792,29 +4792,15 @@ class NgVirtualListComponent {
     $fireUpdateNextFrame = this._$fireUpdateNextFrame.asObservable();
     _$snapScrollToEndCanceller = new BehaviorSubject$1(false);
     $snapScrollToEndCanceller = this._$snapScrollToEndCanceller.asObservable();
-    _onTrackBoxResetHandler = (v) => {
-        if (v && this._scrollerComponent()?.scrollable) {
-            this._$isResetedReachStart.next(true);
-            const scroller = this._scroller()?.nativeElement;
-            if (scroller) {
-                const params = {
-                    [this._isVertical ? TOP_PROP_NAME : LEFT_PROP_NAME]: 0,
-                    behavior: BEHAVIOR_INSTANT,
-                    blending: false,
-                    fireUpdate: false,
-                    userAction: false,
-                    duration: this.animationParams().scrollToItem,
-                };
-                scroller.scrollTo(params);
-            }
-        }
-    };
-    _onPreparedHandler = (v) => {
-        this._$prepared.next(v);
-    };
     _destroyRef = inject(DestroyRef);
     _updateId;
     _scrollStateUpdateIndex = 0;
+    _readyToShow = false;
+    _isUserScrolling = false;
+    _prevScrollStateVersion = EMPTY_SCROLL_STATE_VERSION;
+    _updateIterations = 0;
+    _$viewInit = new BehaviorSubject$1(false);
+    $viewInit = this._$viewInit.asObservable();
     getScrollStateVersion(totalSize, scrollSize, cacheVersion) {
         if (totalSize < scrollSize) {
             this._scrollStateUpdateIndex = this._scrollStateUpdateIndex === Number.MAX_SAFE_INTEGER ? 0 : this._scrollStateUpdateIndex + 1;
@@ -4826,8 +4812,6 @@ class NgVirtualListComponent {
         NgVirtualListComponent.__nextId = NgVirtualListComponent.__nextId + 1 === Number.MAX_SAFE_INTEGER
             ? 0 : NgVirtualListComponent.__nextId + 1;
         this._id = NgVirtualListComponent.__nextId;
-        this._trackBox.addEventListener(TrackBoxEvents.RESET, this._onTrackBoxResetHandler);
-        this._trackBox.addEventListener(TrackBoxEvents.PREPARE, this._onPreparedHandler);
         this._service.initialize(this._trackBox);
         this._service.itemToFocus = this.itemToFocus;
         this._trackBox.displayComponents = this._displayComponents;
@@ -4860,34 +4844,36 @@ class NgVirtualListComponent {
             const dist = this.clickDistance();
             this._service.clickDistance = dist;
         });
-        let prepared = false, readyToStart = false, isUserScrolling = false;
-        let prevScrollStateVersion = EMPTY_SCROLL_STATE_VERSION, updateIterations = 0;
         const $updateComplete = this.$update.pipe(takeUntilDestroyed(), debounceTime(0), switchMap$1((v) => {
-            if (((prevScrollStateVersion === EMPTY_SCROLL_STATE_VERSION) || (prevScrollStateVersion !== v)) &&
-                (updateIterations < MIN_PREPARE_ITERATIONS)) {
+            if (((this._prevScrollStateVersion === EMPTY_SCROLL_STATE_VERSION) || (this._prevScrollStateVersion !== v)) &&
+                (this._updateIterations < MIN_PREPARE_ITERATIONS)) {
                 if (v !== EMPTY_SCROLL_STATE_VERSION) {
-                    prevScrollStateVersion = v;
+                    this._prevScrollStateVersion = v;
                 }
                 this._trackBox.isScrollEnd = true;
-                this.updateToEnd();
+                this._$fireUpdate.next();
                 return of(false);
             }
-            if (prevScrollStateVersion === v) {
+            if (this._prevScrollStateVersion === v) {
                 this._trackBox.isScrollEnd = true;
-                if (updateIterations < MIN_PREPARE_ITERATIONS) {
-                    updateIterations++;
-                    this.updateToEnd();
-                    this._$fireUpdateNextFrame.next();
+                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);
                 }
             }
-            prevScrollStateVersion = v;
+            this._prevScrollStateVersion = v;
             return of(true);
-        }), debounceTime(0), filter$1(v => !!v), distinctUntilChanged()), $items = toObservable(this.items).pipe(takeUntilDestroyed(), map(i => !i ? [] : i)), $dynamicSize = toObservable(this.dynamicSize);
-        const $snapScrollToBottom = toObservable(this.snapScrollToBottom), $waitForPreparation = toObservable(this.waitForPreparation);
-        combineLatest([$dynamicSize, $snapScrollToBottom, $waitForPreparation]).pipe(takeUntilDestroyed(), switchMap$1(([dynamicSize, snapScrollToBottom, waitForPreparation]) => {
+        }), 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) {
-                prepared = readyToStart = true;
+                this._readyToShow = true;
+                this.refreshActualItemSize(true);
                 const scrollerComponent = this._scrollerComponent();
                 if (scrollerComponent) {
                     scrollerComponent.prepared = true;
@@ -4898,60 +4884,76 @@ class NgVirtualListComponent {
                 return of(false);
             }
             if (!!dynamicSize && !!snapScrollToBottom && !!waitForPreparation) {
-                return this.$prepared.pipe(takeUntilDestroyed(this._destroyRef), distinctUntilChanged(), switchMap$1(v => {
+                this._$show.next(false);
+                this.cacheClean();
+                this._readyToShow = this._isUserScrolling = false;
+                const scrollerComponent = this._scrollerComponent();
+                if (scrollerComponent) {
+                    scrollerComponent.prepared = false;
+                    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) {
-                        this._$show.next(false);
-                        readyToStart = isUserScrolling = prepared = false;
                         this.cacheClean();
+                        this._readyToShow = this._isUserScrolling = false;
+                        this.refreshActualItemSize(false);
+                        this._trackBox.isScrollEnd = true;
+                        this._updateIterations = 0;
+                        this._prevScrollStateVersion = EMPTY_SCROLL_STATE_VERSION;
                         const scrollerComponent = this._scrollerComponent();
                         if (scrollerComponent) {
                             scrollerComponent.prepared = false;
                             scrollerComponent.stopScrolling();
                         }
-                        this.classes.set({ prepared: v, [READY_TO_START]: false, [WAIT_FOR_PREPARATION]: false });
-                        this._service.update(true);
+                        this.classes.set({ prepared: false, [READY_TO_START]: false, [WAIT_FOR_PREPARATION]: false });
+                        this._$show.next(false);
                         return of(false);
                     }
-                    return of(true).pipe(takeUntilDestroyed(this._destroyRef), switchMap$1(v => {
+                    return of(true).pipe(takeUntilDestroyed(this._destroyRef), switchMap$1(() => {
                         const waitForPreparation = this.waitForPreparation();
                         if (waitForPreparation) {
-                            prevScrollStateVersion = EMPTY_SCROLL_STATE_VERSION;
-                            updateIterations = 0;
+                            this.refreshActualItemSize(false);
                             return $updateComplete.pipe(takeUntilDestroyed(this._destroyRef), take(1), tap(() => {
-                                prepared = readyToStart = true;
+                                this._readyToShow = true;
                                 const waitForPreparation = this.waitForPreparation(), scrollerComponent = this._scrollerComponent();
                                 if (scrollerComponent) {
                                     scrollerComponent.prepared = true;
                                     scrollerComponent.stopScrolling();
                                 }
                                 this.classes.set({ prepared: true, [READY_TO_START]: true, [WAIT_FOR_PREPARATION]: waitForPreparation });
-                                this._service.update(true);
                                 this._$show.next(true);
+                            }), tap(() => {
+                                this.refreshActualItemSize(true);
+                                this._scrollerComponent()?.refresh(true, true);
                             }));
                         }
-                        prepared = readyToStart = true;
+                        this._readyToShow = true;
                         const scrollerComponent = this._scrollerComponent();
                         if (scrollerComponent) {
                             scrollerComponent.prepared = true;
                             scrollerComponent.stopScrolling();
                         }
                         this.classes.set({ prepared: true, [READY_TO_START]: true, [WAIT_FOR_PREPARATION]: waitForPreparation });
-                        this._service.update(true);
                         this._$show.next(true);
                         return of(false);
                     }));
                 }));
             }
-            prepared = readyToStart = true;
-            const scrollerComponent = this._scrollerComponent();
-            if (scrollerComponent) {
-                scrollerComponent.prepared = true;
-                scrollerComponent.stopScrolling();
+            else {
+                this._readyToShow = true;
+                this.refreshActualItemSize(true);
+                const scrollerComponent = this._scrollerComponent();
+                if (scrollerComponent) {
+                    scrollerComponent.prepared = true;
+                    scrollerComponent.stopScrolling();
+                }
+                this.classes.set({ prepared: true, [READY_TO_START]: true, [WAIT_FOR_PREPARATION]: false });
+                this._service.update(true);
+                this._$show.next(true);
+                this._scrollerComponent()?.refresh(true, true);
+                return of(false);
             }
-            this.classes.set({ prepared: true, [READY_TO_START]: true, [WAIT_FOR_PREPARATION]: false });
-            this._service.update(true);
-            this._$show.next(true);
-            return of(false);
         })).subscribe();
         this._service.$focusedId.pipe(takeUntilDestroyed(), tap(v => {
             this.focusedElement.set(v ?? undefined);
@@ -4987,7 +4989,7 @@ class NgVirtualListComponent {
             isResetedReachStart = v;
         })).subscribe();
         $isScrollStart.pipe(takeUntilDestroyed(), distinctUntilChanged(), debounceTime(0), tap(v => {
-            if (readyToStart && v && !isResetedReachStart && this._scrollerComponent()?.scrollable) {
+            if (this._readyToShow && v && !isResetedReachStart && this._scrollerComponent()?.scrollable) {
                 this._trackBox.isScrollStart = true;
                 this.onScrollReachStart.emit();
             }
@@ -4995,7 +4997,7 @@ class NgVirtualListComponent {
         })).subscribe();
         $isScrollFinished.pipe(takeUntilDestroyed(), distinctUntilChanged(), debounceTime(0), tap(v => {
             this._trackBox.isScrollEnd = v;
-            if (readyToStart && v && this._scrollerComponent()?.scrollable) {
+            if (this._readyToShow && v && this._scrollerComponent()?.scrollable) {
                 this.onScrollReachEnd.emit();
             }
         })).subscribe();
@@ -5008,17 +5010,17 @@ class NgVirtualListComponent {
         $trackBy.pipe(takeUntilDestroyed(), tap(v => {
             this._trackBox.trackingPropertyName = v;
         })).subscribe();
-        const $bounds = toObservable(this._bounds).pipe(filter$1(b => !!b)), $listBounds = toObservable(this._listBounds).pipe(filter$1(b => !!b)), $scrollSize = toObservable(this._scrollSize), $itemSize = toObservable(this.itemSize).pipe(map(v => v <= 0 ? DEFAULT_ITEM_SIZE : v)), $bufferSize = toObservable(this.bufferSize).pipe(map(v => v < 0 ? DEFAULT_BUFFER_SIZE : v)), $maxBufferSize = toObservable(this.maxBufferSize).pipe(map(v => v < 0 ? DEFAULT_BUFFER_SIZE : v)), $itemConfigMap = toObservable(this.itemConfigMap).pipe(map(v => !v ? {} : v)), $snap = toObservable(this.snap), $isLazy = toObservable(this.collectionMode).pipe(map(v => this.getIsLazy(v || DEFAULT_COLLECTION_MODE))), $enabledBufferOptimization = toObservable(this.enabledBufferOptimization), $snappingMethod = toObservable(this.snappingMethod).pipe(map(v => this.getIsSnappingMethodAdvanced(v || DEFAULT_SNAPPING_METHOD))), $methodForSelecting = toObservable(this.methodForSelecting), $selectedIds = toObservable(this.selectedIds), $collapsedIds = toObservable(this.collapsedIds).pipe(map(v => Array.isArray(v) ? v : [])), $collapsedItemIds = toObservable(this._collapsedItemIds).pipe(map(v => Array.isArray(v) ? v : [])), $actualItems = toObservable(this._actualItems), $screenReaderMessage = toObservable(this.screenReaderMessage), $displayItems = this._service.$displayItems, $cacheVersion = toObservable(this._cacheVersion);
+        const $bounds = toObservable(this._bounds).pipe(filter$1(b => !!b)), $listBounds = toObservable(this._listBounds).pipe(filter$1(b => !!b)), $scrollSize = toObservable(this._scrollSize), $itemSize = toObservable(this.actualItemSize).pipe(map(v => v <= 0 ? DEFAULT_ITEM_SIZE : v)), $bufferSize = toObservable(this.bufferSize).pipe(map(v => v < 0 ? DEFAULT_BUFFER_SIZE : v)), $maxBufferSize = toObservable(this.maxBufferSize).pipe(map(v => v < 0 ? DEFAULT_BUFFER_SIZE : v)), $itemConfigMap = toObservable(this.itemConfigMap).pipe(map(v => !v ? {} : v)), $snap = toObservable(this.snap), $isLazy = toObservable(this.collectionMode).pipe(map(v => this.getIsLazy(v || DEFAULT_COLLECTION_MODE))), $enabledBufferOptimization = toObservable(this.enabledBufferOptimization), $snappingMethod = toObservable(this.snappingMethod).pipe(map(v => this.getIsSnappingMethodAdvanced(v || DEFAULT_SNAPPING_METHOD))), $methodForSelecting = toObservable(this.methodForSelecting), $selectedIds = toObservable(this.selectedIds), $collapsedIds = toObservable(this.collapsedIds).pipe(map(v => Array.isArray(v) ? v : [])), $collapsedItemIds = toObservable(this._collapsedItemIds).pipe(map(v => Array.isArray(v) ? v : [])), $actualItems = toObservable(this._actualItems), $screenReaderMessage = toObservable(this.screenReaderMessage), $displayItems = this._service.$displayItems, $cacheVersion = toObservable(this._cacheVersion);
         combineLatest([$displayItems, $screenReaderMessage, $isVertical, $scrollSize, $bounds]).pipe(takeUntilDestroyed(), distinctUntilChanged(), debounceTime(100), takeUntilDestroyed(), tap(([items, screenReaderMessage, isVertical, scrollSize, bounds]) => {
             this.screenReaderFormattedMessage.set(formatScreenReaderMessage(items, screenReaderMessage, scrollSize, isVertical, bounds));
         })).subscribe();
         $isLazy.pipe(takeUntilDestroyed(), tap(v => {
             this._trackBox.isLazy = v;
         })).subscribe();
-        combineLatest([$items, $itemSize]).pipe(takeUntilDestroyed(), map(([items, itemSize]) => ({ items, itemSize })), tap(({ items, itemSize }) => {
-            this._trackBox.resetCollection(items, itemSize);
+        $items.pipe(takeUntilDestroyed(), tap(items => {
+            this._trackBox.resetCollection(items, this.actualItemSize());
         })).subscribe();
-        combineLatest([$items, $collapsedItemIds, $itemConfigMap, $trackBy]).pipe(takeUntilDestroyed(), tap(([items, collapsedIds, itemConfigMap, trackBy]) => {
+        combineLatest([$items, $collapsedItemIds, $itemConfigMap, $trackBy]).pipe(takeUntilDestroyed(), debounceTime(0), tap(([items, collapsedIds, itemConfigMap, trackBy]) => {
             const hiddenItems = new CMap();
             let isCollapsed = false;
             for (let i = 0, l = items.length; i < l; i++) {
@@ -5082,18 +5084,22 @@ class NgVirtualListComponent {
         })).subscribe();
         const $snapScrollToEndCanceller = this.$snapScrollToEndCanceller;
         $snapScrollToEndCanceller.pipe(takeUntilDestroyed(), filter$1(v => !!v), tap((v) => {
-            const scroller = this._scrollerComponent();
-            if (scroller) {
-                this._trackBox.cancelScrollSnappingToEnd(true);
+            if (this._readyToShow) {
+                const scroller = this._scrollerComponent();
+                if (scroller) {
+                    this._trackBox.cancelScrollSnappingToEnd(true);
+                }
             }
         }), tap(() => {
-            this._$snapScrollToEndCanceller.next(false);
+            if (this._readyToShow) {
+                this._$snapScrollToEndCanceller.next(false);
+            }
         })).subscribe();
-        const update = (params) => {
+        const update = (params, emitable = true) => {
             const { snapScrollToBottom, bounds, listBounds, scrollEndOffset, items, itemConfigMap, scrollSize, itemSize, bufferSize, maxBufferSize, snap, isVertical, dynamicSize, enabledBufferOptimization, cacheVersion, } = params;
             const scroller = this._scrollerComponent();
             if (scroller) {
-                let actualScrollSize = !prepared && snapScrollToBottom ? (isVertical ? scroller.scrollHeight ?? 0 : scroller.scrollWidth ?? 0) :
+                let actualScrollSize = !this._readyToShow && snapScrollToBottom ? (isVertical ? scroller.scrollHeight ?? 0 : scroller.scrollWidth ?? 0) :
                     (isVertical ? scroller.scrollTop ?? 0 : scroller.scrollLeft ?? 0), totalSize = 0, displayItems;
                 const { width, height, x, y } = bounds, viewportSize = (isVertical ? height : width);
                 let scrollLength = Math.round(this._totalSize()) ?? 0, actualScrollLength = Math.round(scrollLength === 0 ? 0 : scrollLength > viewportSize ? scrollLength - viewportSize : scrollLength), roundedMaxPosition = Math.round(actualScrollLength), scrollPosition = Math.round(actualScrollSize);
@@ -5101,7 +5107,7 @@ class NgVirtualListComponent {
                     bounds: { width, height, x, y }, dynamicSize, isVertical, itemSize,
                     bufferSize, maxBufferSize, scrollSize: actualScrollSize, snap, enabledBufferOptimization,
                 };
-                if (snapScrollToBottom && !prepared) {
+                if (snapScrollToBottom && !this._readyToShow) {
                     const { displayItems: calculatedDisplayItems, totalSize: calculatedTotalSize1 } = this._trackBox.updateCollection(items, itemConfigMap, { ...opts, scrollSize: actualScrollSize });
                     displayItems = calculatedDisplayItems;
                     totalSize = calculatedTotalSize1;
@@ -5121,8 +5127,8 @@ class NgVirtualListComponent {
                 this.resetBoundsSize(isVertical, totalSize);
                 this.createDisplayComponentsIfNeed(displayItems);
                 this.tracking();
-                if (prepared && readyToStart && actualScrollLength > 0) {
-                    const isScrollStart = isUserScrolling && scrollPosition < MIN_SCROLL_TO_START_PIXELS;
+                if (emitable && this._readyToShow && actualScrollLength > 0) {
+                    const isScrollStart = this._isUserScrolling && scrollPosition < MIN_SCROLL_TO_START_PIXELS;
                     this._isScrollStart.set(isScrollStart);
                     if (isScrollStart) {
                         this._isScrollFinished.set(false);
@@ -5131,12 +5137,13 @@ class NgVirtualListComponent {
                         this._isScrollFinished.set(scrollPosition >= roundedMaxPosition);
                     }
                 }
-                actualScrollSize = !prepared && snapScrollToBottom ? (isVertical ? scroller.scrollHeight ?? 0 : scroller.scrollWidth ?? 0) :
+                actualScrollSize = !this._readyToShow && snapScrollToBottom ? (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) {
                     this.updateRegularRenderer();
                 }
+                scroller.delta = delta;
                 this._trackBox.clearDelta();
                 if ((snapScrollToBottom && this._trackBox.isSnappedToEnd) ||
                     (snapScrollToBottom && actualScrollSize > 0 &&
@@ -5147,17 +5154,19 @@ class NgVirtualListComponent {
                         this._isScrollFinished.set(true);
                     }
                     this._trackBox.isScrollEnd = true;
-                    if (prepared && readyToStart) {
+                    if (emitable && this._readyToShow) {
                         this.emitScrollEvent(true, false);
                     }
-                    if (roundedMaxPositionAfterUpdate > 0) {
+                    if (!this._readyToShow || roundedMaxPositionAfterUpdate > 0) {
                         const params = {
                             [isVertical ? TOP_PROP_NAME : LEFT_PROP_NAME]: roundedMaxPositionAfterUpdate,
                             fireUpdate: false, behavior: BEHAVIOR_INSTANT,
                             blending: false, duration: this.animationParams().scrollToItem,
                         };
                         scroller?.scrollTo?.(params);
-                        this._$update.next(this.getScrollStateVersion(totalSize, this._isVertical ? scroller.scrollTop : scroller.scrollLeft, cacheVersion));
+                        if (emitable && !this._readyToShow) {
+                            this._$update.next(this.getScrollStateVersion(totalSize, this._isVertical ? scroller.scrollTop : scroller.scrollLeft, cacheVersion));
+                        }
                         return;
                     }
                 }
@@ -5169,43 +5178,51 @@ class NgVirtualListComponent {
                     }
                     if (this._scrollSize() !== scrollPositionAfterUpdate) {
                         const params = {
-                            [isVertical ? TOP_PROP_NAME : LEFT_PROP_NAME]: scrollPositionAfterUpdate, blending: prepared && readyToStart,
+                            [isVertical ? TOP_PROP_NAME : LEFT_PROP_NAME]: scrollPositionAfterUpdate, blending: true,
                             fireUpdate: false, behavior: BEHAVIOR_INSTANT, duration: this.animationParams().scrollToItem,
                         };
                         scroller.scrollTo(params);
-                        this._$update.next(this.getScrollStateVersion(totalSize, this._isVertical ? scroller.scrollTop : scroller.scrollLeft, cacheVersion));
+                        if (emitable && !this._readyToShow) {
+                            this._$update.next(this.getScrollStateVersion(totalSize, this._isVertical ? scroller.scrollTop : scroller.scrollLeft, cacheVersion));
+                        }
                         return;
                     }
                 }
-                if (!prepared && !readyToStart) {
+                if (emitable && !this._readyToShow) {
                     this._$update.next(this.getScrollStateVersion(totalSize, this._isVertical ? scroller.scrollTop : scroller.scrollLeft, cacheVersion));
                 }
             }
         };
-        combineLatest([$snapScrollToBottom, $bounds, $listBounds, $scrollEndOffset, $actualItems, $itemConfigMap, $scrollSize, $itemSize,
-            $bufferSize, $maxBufferSize, $snap, $isVertical, $dynamicSize, $enabledBufferOptimization, $cacheVersion, this.$fireUpdate,
-        ]).pipe(takeUntilDestroyed(), distinctUntilChanged(), tap(([snapScrollToBottom, bounds, listBounds, scrollEndOffset, items, itemConfigMap, scrollSize, itemSize, bufferSize, maxBufferSize, snap, isVertical, dynamicSize, enabledBufferOptimization, cacheVersion,]) => {
-            update({
-                snapScrollToBottom, bounds, listBounds, scrollEndOffset, items, itemConfigMap, scrollSize, itemSize,
-                bufferSize, maxBufferSize, snap, isVertical, dynamicSize, enabledBufferOptimization, cacheVersion,
-            });
+        $viewInit.pipe(takeUntilDestroyed(), filter$1(v => !!v), switchMap$1(() => {
+            return combineLatest([$snapScrollToBottom, $bounds, $listBounds, $scrollEndOffset, $actualItems, $itemConfigMap, $scrollSize, $itemSize,
+                $bufferSize, $maxBufferSize, $snap, $isVertical, $dynamicSize, $enabledBufferOptimization, $cacheVersion, this.$fireUpdate,
+            ]).pipe(takeUntilDestroyed(this._destroyRef), distinctUntilChanged(), tap(([snapScrollToBottom, bounds, listBounds, scrollEndOffset, items, itemConfigMap, scrollSize, itemSize, bufferSize, maxBufferSize, snap, isVertical, dynamicSize, enabledBufferOptimization, cacheVersion,]) => {
+                update({
+                    snapScrollToBottom, bounds, listBounds, scrollEndOffset, items, itemConfigMap, scrollSize, itemSize,
+                    bufferSize, maxBufferSize, snap, isVertical, dynamicSize, enabledBufferOptimization, cacheVersion,
+                });
+            }));
         })).subscribe();
-        combineLatest([$items, $dynamicSize]).pipe(takeUntilDestroyed(), filter$1(([, dynamic]) => !dynamic), delay(0), takeUntilDestroyed(), tap(() => {
+        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(() => {
-                return !!this._trackBox.isSnappedToEnd;
+                return !!this._trackBox.isSnappedToEnd && this._readyToShow;
             }), tap(() => {
-                this._$snapScrollToEndCanceller.next(true);
+                if (this._readyToShow) {
+                    this._$snapScrollToEndCanceller.next(true);
+                }
             }));
         })).subscribe();
         $scroller.pipe(takeUntilDestroyed(), distinctUntilChanged(), switchMap$1(scroller => {
             return fromEvent(scroller, SCROLLER_SCROLLBAR_SCROLL, { passive: true }).pipe(takeUntilDestroyed(this._destroyRef), filter$1(() => {
                 return !!this._trackBox.isSnappedToEnd;
             }), tap(() => {
-                this._$snapScrollToEndCanceller.next(true);
+                if (this._readyToShow) {
+                    this._$snapScrollToEndCanceller.next(true);
+                }
             }));
         })).subscribe();
         const $docPointerUp = fromEvent(document, MOUSE_UP, { passive: true }).pipe(take(1)), $docPointerLeave = fromEvent(document, MOUSE_LEAVE, { passive: true }).pipe(take(1)), $docPointerOut = fromEvent(document, MOUSE_OUT, { passive: true }).pipe(take(1)), $pointerMoveTakeUntil = race([$docPointerUp, $docPointerLeave, $docPointerOut]).pipe(takeUntilDestroyed(), take(1));
@@ -5222,14 +5239,16 @@ class NgVirtualListComponent {
                 }
                 return 0;
             }), tap(() => {
-                this._$snapScrollToEndCanceller.next(true);
+                if (this._readyToShow) {
+                    this._$snapScrollToEndCanceller.next(true);
+                }
             }));
         })).subscribe();
         const $docTouchUp = fromEvent(document, TOUCH_END, { passive: true }).pipe(take(1)), $docTouchLeave = fromEvent(document, TOUCH_LEAVE, { passive: true }).pipe(take(1)), $docTouchOut = fromEvent(document, TOUCH_OUT, { passive: true }).pipe(take(1)), $touchMoveTakeUntil = race([$docTouchUp, $docTouchLeave, $docTouchOut]).pipe(takeUntilDestroyed(), take(1));
         $scroller.pipe(takeUntilDestroyed(), distinctUntilChanged(), switchMap$1(scroller => {
             return fromEvent(scroller, TOUCH_START, { passive: true }).pipe(takeUntilDestroyed(this._destroyRef), switchMap$1(e => {
                 return $scrollerScroll.pipe(takeUntilDestroyed(this._destroyRef), takeUntil$1($touchMoveTakeUntil), filter$1(() => {
-                    return !!this._trackBox.isSnappedToEnd;
+                    return !!this._trackBox.isSnappedToEnd && this._readyToShow;
                 }));
             }), map(e => {
                 const scroller = this._scrollerComponent();
@@ -5239,18 +5258,22 @@ class NgVirtualListComponent {
                 }
                 return 0;
             }), tap(() => {
-                this._$snapScrollToEndCanceller.next(true);
+                if (this._readyToShow) {
+                    this._$snapScrollToEndCanceller.next(true);
+                }
             }));
         })).subscribe();
         $scroller.pipe(takeUntilDestroyed(), distinctUntilChanged(), switchMap$1(scroller => {
             return $scrollerScroll.pipe(takeUntilDestroyed(this._destroyRef));
         }), tap(userAction => {
-            isUserScrolling = userAction;
+            this._isUserScrolling = userAction;
             const scrollerEl = this._scroller()?.nativeElement, scrollerComponent = this._scrollerComponent();
             if (scrollerEl && scrollerComponent) {
-                const event = this.emitScrollEvent(false);
+                const event = this.emitScrollEvent(false, this._readyToShow);
                 if (userAction) {
-                    this._$snapScrollToEndCanceller.next(true);
+                    if (this._readyToShow) {
+                        this._$snapScrollToEndCanceller.next(true);
+                    }
                     if (!this.dynamicSize()) {
                         this._$fireUpdate.next(event);
                     }
@@ -5260,12 +5283,14 @@ class NgVirtualListComponent {
         $scroller.pipe(takeUntilDestroyed(), distinctUntilChanged(), switchMap$1(scroller => {
             return $scrollerScrollEnd.pipe(takeUntilDestroyed(this._destroyRef));
         }), tap(userAction => {
-            isUserScrolling = userAction;
+            this._isUserScrolling = userAction;
             const scrollerEl = this._scroller()?.nativeElement, scrollerComponent = this._scrollerComponent();
             if (scrollerEl && scrollerComponent) {
-                const event = this.emitScrollEvent(true);
+                const event = this.emitScrollEvent(true, this._readyToShow);
                 if (userAction) {
-                    this._$snapScrollToEndCanceller.next(true);
+                    if (this._readyToShow) {
+                        this._$snapScrollToEndCanceller.next(true);
+                    }
                     if (!this.dynamicSize()) {
                         this._$fireUpdate.next(event);
                     }
@@ -5278,9 +5303,11 @@ class NgVirtualListComponent {
             const scroller = this._scrollerComponent();
             if (scroller) {
                 const isVertical = this._isVertical, bounds = this._bounds(), listBounds = this._listBounds(), scrollSize = (isVertical ? scroller.scrollTop : scroller.scrollLeft), scrollLength = isVertical ? (listBounds?.height ?? 0) - (bounds?.height ?? 0) : (listBounds?.width ?? 0) - (bounds?.width ?? 0), actualScrollSize = scrollSize;
-                if (this._trackBox.isSnappedToEnd) {
-                    if (scrollSize < scrollLength) {
-                        this._trackBox.cancelScrollSnappingToEnd();
+                if (this._readyToShow) {
+                    if (this._trackBox.isSnappedToEnd) {
+                        if (scrollSize < scrollLength) {
+                            this._trackBox.cancelScrollSnappingToEnd();
+                        }
                     }
                 }
                 this._scrollSize.set(actualScrollSize);
@@ -5304,16 +5331,16 @@ class NgVirtualListComponent {
         })).subscribe();
         const $scrollTo = this.$scrollTo;
         combineLatest([$scroller, $trackBy, $scrollTo]).pipe(takeUntilDestroyed(), filter$1(([scroller]) => scroller !== undefined), map(([scroller, trackBy, event]) => ({ scroller: scroller, trackBy, event })), switchMap$1(({ scroller, trackBy, event }) => {
-            if (!prepared || !readyToStart) {
+            if (!this._readyToShow) {
                 return of([false]);
             }
             const scrollerComponent = this._scrollerComponent(), { id, iteration = 0, blending = false, isLastIteration = false, scrollCalled = false, cb, } = event;
             if (scrollerComponent) {
                 const items = this._actualItems();
                 if (items && items.length) {
-                    const dynamicSize = this.dynamicSize(), itemSize = this.itemSize();
+                    const dynamicSize = this.dynamicSize(), itemSize = this.actualItemSize();
                     if (dynamicSize) {
-                        const { width, height, x, y } = this._bounds() || { x: 0, y: 0, width: DEFAULT_LIST_SIZE, height: DEFAULT_LIST_SIZE }, itemConfigMap = this.itemConfigMap(), items = this._actualItems(), isVertical = this._isVertical, currentScollSize = (isVertical ? scrollerComponent.scrollTop : scrollerComponent.scrollLeft), delta = this._trackBox.delta, opts = {
+                        const { width, height, x, y } = this._bounds() || { x: 0, y: 0, width: DEFAULT_LIST_SIZE, height: DEFAULT_LIST_SIZE }, itemConfigMap = this.itemConfigMap(), items = this._actualItems(), isVertical = this._isVertical, currentScrollSize = (isVertical ? scrollerComponent.scrollTop : scrollerComponent.scrollLeft), delta = this._trackBox.delta, opts = {
                             bounds: { width, height, x, y }, collection: items, dynamicSize, isVertical: this._isVertical, itemSize,
                             bufferSize: this.bufferSize(), maxBufferSize: this.maxBufferSize(),
                             scrollSize: (isVertical ? scrollerComponent.scrollTop : scrollerComponent.scrollLeft) + delta,
@@ -5341,9 +5368,10 @@ class NgVirtualListComponent {
                             return of([true, { id, blending, scroller: scrollerComponent, scrollCalled, cb }]);
                         }
                         this._$snapScrollToEndCanceller.next(true);
-                        const notChanged = actualScrollSize === currentScollSize;
-                        scrollerComponent?.scrollTo?.(params);
-                        if ((!notChanged && iteration < MAX_SCROLL_TO_ITERATIONS) || iteration < MAX_SCROLL_TO_ITERATIONS) {
+                        const notChanged = actualScrollSize === currentScrollSize;
+                        if ((!notChanged && iteration < MAX_SCROLL_TO_ITERATIONS) ||
+                            (!this.snapScrollToBottom() && iteration < MAX_SCROLL_TO_ITERATIONS)) {
+                            scrollerComponent?.scrollTo?.(params);
                             this._$scrollTo.next(params);
                             return of([false, {
                                     id, scroller: scrollerComponent, iteration: iteration + 1, blending,
@@ -5358,8 +5386,8 @@ class NgVirtualListComponent {
                     else {
                         const index = items.findIndex(item => item[trackBy] === id);
                         if (index > -1) {
-                            const isVertical = this._isVertical, currentScollSize = (isVertical ? scrollerComponent.scrollTop : scrollerComponent.scrollLeft), scrollSize = index * this.itemSize();
-                            if (currentScollSize !== scrollSize) {
+                            const isVertical = this._isVertical, currentScrollSize = (isVertical ? scrollerComponent.scrollTop : scrollerComponent.scrollLeft), scrollSize = index * this.actualItemSize();
+                            if (currentScrollSize !== scrollSize) {
                                 this._$snapScrollToEndCanceller.next(true);
                                 const params = {
                                     [this._isVertical ? TOP_PROP_NAME : LEFT_PROP_NAME]: scrollSize,
@@ -5377,10 +5405,12 @@ class NgVirtualListComponent {
             if (!finished) {
                 if (!!params) {
                     this._$scrollTo.next(params);
+                    return;
                 }
-                return;
             }
-            this._trackBox.cancelScrollSnappingToEnd(true);
+            if (this._readyToShow) {
+                this._trackBox.cancelScrollSnappingToEnd(true);
+            }
             const p = params;
             if (p.scrollCalled && p.scroller) {
                 this._scrollerComponent()?.refresh();
@@ -5440,6 +5470,9 @@ class NgVirtualListComponent {
         $collapsedIds.pipe(takeUntilDestroyed(), distinctUntilChanged(), tap(v => {
             this._service.setCollapsedIds(v);
         })).subscribe();
+    }
+    ngAfterViewInit() {
+        this._$viewInit.next(true);
         this._$fireUpdate.next({
             scrollSize: 0,
             scrollWeight: 0,
@@ -5457,8 +5490,8 @@ class NgVirtualListComponent {
     emitScrollEvent(isScrollEnd = false, update = true) {
         const scrollerEl = this._scroller()?.nativeElement, scrollerComponent = this._scrollerComponent();
         if (scrollerEl && scrollerComponent) {
-            const isVertical = this._isVertical, scrollSize = (isVertical ? scrollerComponent.scrollTop : scrollerComponent.scrollLeft), bounds = this._bounds() || { x: 0, y: 0, width: DEFAULT_LIST_SIZE, height: DEFAULT_LIST_SIZE }, currentScollSize = this._scrollSize();
-            this._trackBox.deltaDirection = currentScollSize > scrollSize ? -1 : currentScollSize < scrollSize ? 1 : 0;
+            const isVertical = this._isVertical, scrollSize = (isVertical ? scrollerComponent.scrollTop : scrollerComponent.scrollLeft), bounds = this._bounds() || { x: 0, y: 0, width: DEFAULT_LIST_SIZE, height: DEFAULT_LIST_SIZE }, currentScrollSize = this._scrollSize();
+            this._trackBox.deltaDirection = currentScrollSize > scrollSize ? -1 : currentScrollSize < scrollSize ? 1 : 0;
             const itemsRange = formatActualDisplayItems(this._service.displayItems, this.scrollStartOffset(), this.scrollEndOffset(), scrollSize, isVertical, bounds), event = new ScrollEvent({
                 direction: this._trackBox.scrollDirection, container: scrollerEl,
                 list: this._list().nativeElement, delta: this._trackBox.delta,
@@ -5490,6 +5523,24 @@ class NgVirtualListComponent {
             }
         }
     }
+    refreshActualItemSize(value) {
+        if (!this.waitForPreparation()) {
+            return;
+        }
+        let size;
+        const bounds = this._bounds();
+        if (value === false) {
+            size = (this._isVertical ?
+                bounds?.height || DEFAULT_LIST_SIZE :
+                bounds?.width || DEFAULT_LIST_SIZE);
+            this.actualItemSize.set(size);
+        }
+        else {
+            size = this.itemSize();
+            this.actualItemSize.set(size);
+        }
+        this._trackBox.resetCache(this._actualItems(), this.trackBy(), this._isVertical, size, bounds);
+    }
     getIsSnappingMethodAdvanced(m) {
         const method = m || this.snappingMethod();
         return isSnappingMethodAdvenced(method);
@@ -5572,17 +5623,6 @@ class NgVirtualListComponent {
             l.nativeElement.style[prop] = `${size}${PX$2}`;
         }
     }
-    updateToEnd() {
-        const scroller = this._scrollerComponent();
-        if (!!scroller) {
-            const isVerrtical = this._isVertical, actualScrollSize = isVerrtical ? (scroller?.scrollHeight ?? 0) : (scroller?.scrollWidth ?? 0), params = {
-                [isVerrtical ? TOP_PROP_NAME : LEFT_PROP_NAME]: actualScrollSize,
-                blending: false, fireUpdate: true, userAction: false, behavior: BEHAVIOR_INSTANT,
-            };
-            scroller.scrollTo(params);
-            scroller.refresh();
-        }
-    }
     /**
      * Returns the bounds of an element with a given id
      */
@@ -5678,7 +5718,9 @@ class NgVirtualListComponent {
         if (scrollerComponent) {
             scrollerComponent.reset();
         }
-        this._$prepared.next(false);
+        if (this._scrollerComponent()?.scrollable) {
+            this._$isResetedReachStart.next(true);
+        }
     }
     /**
      * Stops the list from snapping to the bottom edge.
@@ -5726,13 +5768,13 @@ class NgVirtualListComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: NgVirtualListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.19", type: NgVirtualListComponent, isStandalone: false, selector: "ng-virtual-list", inputs: { scrollbarTheme: { classPropertyName: "scrollbarTheme", publicName: "scrollbarTheme", isSignal: true, isRequired: false, transformFunction: null }, scrollbarMinSize: { classPropertyName: "scrollbarMinSize", publicName: "scrollbarMinSize", 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 }, 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], viewQueries: [{ 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@if (snap()) {\r\n  <div #snappedContainer class=\"ngvl__snapped-container\">\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()\" [scrollbarTheme]=\"scrollbarTheme()\"\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%}.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: "component", type: NgScrollerComponent, selector: "ng-scroller", inputs: ["scrollbarEnabled", "scrollbarInteractive", "focusedElement", "content", "loading", "classes", "startOffset", "endOffset", "scrollbarTheme", "scrollbarMinSize"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.ShadowDom });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.19", type: NgVirtualListComponent, isStandalone: false, selector: "ng-virtual-list", inputs: { scrollbarTheme: { classPropertyName: "scrollbarTheme", publicName: "scrollbarTheme", isSignal: true, isRequired: false, transformFunction: null }, scrollbarMinSize: { classPropertyName: "scrollbarMinSize", publicName: "scrollbarMinSize", 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 }, 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], viewQueries: [{ 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@if (snap()) {\r\n  <div #snappedContainer class=\"ngvl__snapped-container\" [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()\" [scrollbarTheme]=\"scrollbarTheme()\"\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", "startOffset", "endOffset", "scrollbarTheme", "scrollbarMinSize"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.ShadowDom });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: NgVirtualListComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ng-virtual-list', host: {
                         'style': 'position: relative;'
-                    }, standalone: false, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.ShadowDom, providers: [NgVirtualListService], template: "<div aria-live=\"polite\" aria-atomic=\"true\" class=\"ngvl__screen-reader\">\r\n  {{ screenReaderFormattedMessage() }}\r\n</div>\r\n\r\n@if (snap()) {\r\n  <div #snappedContainer class=\"ngvl__snapped-container\">\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()\" [scrollbarTheme]=\"scrollbarTheme()\"\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%}.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"] }]
+                    }, standalone: false, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.ShadowDom, providers: [NgVirtualListService], template: "<div aria-live=\"polite\" aria-atomic=\"true\" class=\"ngvl__screen-reader\">\r\n  {{ screenReaderFormattedMessage() }}\r\n</div>\r\n\r\n@if (snap()) {\r\n  <div #snappedContainer class=\"ngvl__snapped-container\" [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()\" [scrollbarTheme]=\"scrollbarTheme()\"\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"] }]
         }], ctorParameters: () => [], propDecorators: { _listContainerRef: [{
                 type: ViewChild,
                 args: ['renderersContainer', { read: ViewContainerRef }]