@ringcentral/juno 2.4.1 → 2.5.0

package/components/Virtuoso/react-virtuoso/scrollIntoViewSystem.js

@@ -0,0 +1,42 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var u = tslib_1.__importStar(require("@virtuoso.dev/urx"));
+var AATree_1 = require("./AATree");
+var domIOSystem_1 = require("./domIOSystem");
+var listStateSystem_1 = require("./listStateSystem");
+var loggerSystem_1 = require("./loggerSystem");
+var scrollToIndexSystem_1 = require("./scrollToIndexSystem");
+var sizeSystem_1 = require("./sizeSystem");
+exports.scrollIntoViewSystem = u.system(function (_a) {
+    var _b = tslib_1.__read(_a, 3), _c = _b[0], sizes = _c.sizes, totalCount = _c.totalCount, _d = _b[1], scrollTop = _d.scrollTop, viewportHeight = _d.viewportHeight, headerHeight = _d.headerHeight, scrollingInProgress = _d.scrollingInProgress, scrollToIndex = _b[2].scrollToIndex;
+    var scrollIntoView = u.stream();
+    u.connect(u.pipe(scrollIntoView, u.withLatestFrom(sizes, viewportHeight, totalCount, headerHeight, scrollTop), u.map(function (_a) {
+        var _b = tslib_1.__read(_a, 6), _c = _b[0], index = _c.index, _d = _c.behavior, behavior = _d === void 0 ? 'auto' : _d, done = _c.done, sizes = _b[1], viewportHeight = _b[2], totalCount = _b[3], headerHeight = _b[4], scrollTop = _b[5];
+        var lastIndex = totalCount - 1;
+        var location = null;
+        index = sizeSystem_1.originalIndexFromItemIndex(index, sizes);
+        index = Math.max(0, index, Math.min(lastIndex, index));
+        var itemTop = sizeSystem_1.offsetOf(index, sizes.offsetTree) + headerHeight;
+        if (itemTop < scrollTop) {
+            location = { index: index, behavior: behavior, align: 'start' };
+        }
+        else {
+            var itemBottom = itemTop + AATree_1.findMaxKeyValue(sizes.sizeTree, index)[1];
+            if (itemBottom > scrollTop + viewportHeight) {
+                location = { index: index, behavior: behavior, align: 'end' };
+            }
+        }
+        if (location) {
+            done &&
+                u.handleNext(u.pipe(scrollingInProgress, u.skip(1), u.filter(function (value) { return value === false; })), done);
+        }
+        else {
+            done && done();
+        }
+        return location;
+    }), u.filter(function (value) { return value !== null; })), scrollToIndex);
+    return {
+        scrollIntoView: scrollIntoView,
+    };
+}, u.tup(sizeSystem_1.sizeSystem, domIOSystem_1.domIOSystem, scrollToIndexSystem_1.scrollToIndexSystem, listStateSystem_1.listStateSystem, loggerSystem_1.loggerSystem), { singleton: true });

package/components/Virtuoso/react-virtuoso/scrollSeekSystem.d.ts

@@ -1,71 +1,56 @@
+import * as u from '@virtuoso.dev/urx';
 import { ListRange, ScrollSeekConfiguration } from './interfaces';
-export declare const scrollSeekSystem: import("@virtuoso.dev/urx").SystemSpec<[import("@virtuoso.dev/urx").SystemSpec<never[], () => {
-    scrollTop: import("@virtuoso.dev/urx").Stream<number>;
-    viewportHeight: import("@virtuoso.dev/urx").Stream<number>;
-    headerHeight: import("@virtuoso.dev/urx").StatefulStream<number>;
-    footerHeight: import("@virtuoso.dev/urx").StatefulStream<number>;
-    smoothScrollTargetReached: import("@virtuoso.dev/urx").Stream<true>;
-    scrollTo: import("@virtuoso.dev/urx").Stream<ScrollToOptions>;
-    scrollBy: import("@virtuoso.dev/urx").Stream<ScrollToOptions>;
-    scrollDirection: import("@virtuoso.dev/urx").StatefulStream<import("./domIOSystem").ScrollDirection>;
-    statefulScrollTop: import("@virtuoso.dev/urx").StatefulStream<number>;
-    deviation: import("@virtuoso.dev/urx").StatefulStream<number>;
-    scrollingInProgress: import("@virtuoso.dev/urx").StatefulStream<boolean>;
-}>, import("@virtuoso.dev/urx").SystemSpec<[import("@virtuoso.dev/urx").SystemSpec<never[], () => {
-    scrollTop: import("@virtuoso.dev/urx").Stream<number>;
-    viewportHeight: import("@virtuoso.dev/urx").Stream<number>;
-    headerHeight: import("@virtuoso.dev/urx").StatefulStream<number>;
-    footerHeight: import("@virtuoso.dev/urx").StatefulStream<number>;
-    smoothScrollTargetReached: import("@virtuoso.dev/urx").Stream<true>;
-    scrollTo: import("@virtuoso.dev/urx").Stream<ScrollToOptions>;
-    scrollBy: import("@virtuoso.dev/urx").Stream<ScrollToOptions>;
-    scrollDirection: import("@virtuoso.dev/urx").StatefulStream<import("./domIOSystem").ScrollDirection>;
-    statefulScrollTop: import("@virtuoso.dev/urx").StatefulStream<number>;
-    deviation: import("@virtuoso.dev/urx").StatefulStream<number>;
-    scrollingInProgress: import("@virtuoso.dev/urx").StatefulStream<boolean>;
-}>], ([{ scrollTop, viewportHeight }]: [{
-    scrollTop: import("@virtuoso.dev/urx").Stream<number>;
-    viewportHeight: import("@virtuoso.dev/urx").Stream<number>;
-    headerHeight: import("@virtuoso.dev/urx").StatefulStream<number>;
-    footerHeight: import("@virtuoso.dev/urx").StatefulStream<number>;
-    smoothScrollTargetReached: import("@virtuoso.dev/urx").Stream<true>;
-    scrollTo: import("@virtuoso.dev/urx").Stream<ScrollToOptions>;
-    scrollBy: import("@virtuoso.dev/urx").Stream<ScrollToOptions>;
-    scrollDirection: import("@virtuoso.dev/urx").StatefulStream<import("./domIOSystem").ScrollDirection>;
-    statefulScrollTop: import("@virtuoso.dev/urx").StatefulStream<number>;
-    deviation: import("@virtuoso.dev/urx").StatefulStream<number>;
-    scrollingInProgress: import("@virtuoso.dev/urx").StatefulStream<boolean>;
+export declare const scrollSeekSystem: u.SystemSpec<[u.SystemSpec<[u.SystemSpec<never[], () => {
+    scrollContainerState: u.Stream<[number, number]>;
+    scrollTop: u.Stream<number>;
+    viewportHeight: u.Stream<number>;
+    headerHeight: u.StatefulStream<number>;
+    footerHeight: u.StatefulStream<number>;
+    scrollHeight: u.Stream<number>;
+    smoothScrollTargetReached: u.Stream<true>;
+    scrollTo: u.Stream<ScrollToOptions>;
+    scrollBy: u.Stream<ScrollToOptions>;
+    statefulScrollTop: u.StatefulStream<number>;
+    deviation: u.StatefulStream<number>;
+    scrollingInProgress: u.StatefulStream<boolean>;
+}>], ([{ scrollContainerState, scrollTop, viewportHeight, headerHeight, footerHeight, scrollBy, },]: [{
+    scrollContainerState: u.Stream<[number, number]>;
+    scrollTop: u.Stream<number>;
+    viewportHeight: u.Stream<number>;
+    headerHeight: u.StatefulStream<number>;
+    footerHeight: u.StatefulStream<number>;
+    scrollHeight: u.Stream<number>;
+    smoothScrollTargetReached: u.Stream<true>;
+    scrollTo: u.Stream<ScrollToOptions>;
+    scrollBy: u.Stream<ScrollToOptions>;
+    statefulScrollTop: u.StatefulStream<number>;
+    deviation: u.StatefulStream<number>;
+    scrollingInProgress: u.StatefulStream<boolean>;
 }]) => {
-    isScrolling: import("@virtuoso.dev/urx").Stream<boolean>;
-    isAtTop: import("@virtuoso.dev/urx").StatefulStream<boolean>;
-    isAtBottom: import("@virtuoso.dev/urx").StatefulStream<boolean>;
-    atBottomState: import("@virtuoso.dev/urx").Stream<import("./stateFlagsSystem").AtBottomState>;
-    atTopStateChange: import("@virtuoso.dev/urx").Stream<boolean>;
-    atBottomStateChange: import("@virtuoso.dev/urx").Stream<boolean>;
-    listStateListener: import("@virtuoso.dev/urx").Stream<import("./stateFlagsSystem").ListBottomInfo>;
-}>], ([{ scrollTop }, { isScrolling }]: [{
-    scrollTop: import("@virtuoso.dev/urx").Stream<number>;
-    viewportHeight: import("@virtuoso.dev/urx").Stream<number>;
-    headerHeight: import("@virtuoso.dev/urx").StatefulStream<number>;
-    footerHeight: import("@virtuoso.dev/urx").StatefulStream<number>;
-    smoothScrollTargetReached: import("@virtuoso.dev/urx").Stream<true>;
-    scrollTo: import("@virtuoso.dev/urx").Stream<ScrollToOptions>;
-    scrollBy: import("@virtuoso.dev/urx").Stream<ScrollToOptions>;
-    scrollDirection: import("@virtuoso.dev/urx").StatefulStream<import("./domIOSystem").ScrollDirection>;
-    statefulScrollTop: import("@virtuoso.dev/urx").StatefulStream<number>;
-    deviation: import("@virtuoso.dev/urx").StatefulStream<number>;
-    scrollingInProgress: import("@virtuoso.dev/urx").StatefulStream<boolean>;
-}, {
-    isScrolling: import("@virtuoso.dev/urx").Stream<boolean>;
-    isAtTop: import("@virtuoso.dev/urx").StatefulStream<boolean>;
-    isAtBottom: import("@virtuoso.dev/urx").StatefulStream<boolean>;
-    atBottomState: import("@virtuoso.dev/urx").Stream<import("./stateFlagsSystem").AtBottomState>;
-    atTopStateChange: import("@virtuoso.dev/urx").Stream<boolean>;
-    atBottomStateChange: import("@virtuoso.dev/urx").Stream<boolean>;
-    listStateListener: import("@virtuoso.dev/urx").Stream<import("./stateFlagsSystem").ListBottomInfo>;
+    isScrolling: u.Stream<boolean>;
+    isAtTop: u.StatefulStream<boolean>;
+    isAtBottom: u.StatefulStream<boolean>;
+    atBottomState: u.Stream<import("./stateFlagsSystem").AtBottomState>;
+    atTopStateChange: u.Stream<boolean>;
+    atBottomStateChange: u.Stream<boolean>;
+    scrollDirection: u.StatefulStream<import("./stateFlagsSystem").ScrollDirection>;
+    atBottomThreshold: u.StatefulStream<number>;
+    scrollVelocity: u.StatefulStream<number>;
+    lastJumpDueToItemResize: u.StatefulStream<number>;
+}>], ([{ scrollVelocity }]: [{
+    isScrolling: u.Stream<boolean>;
+    isAtTop: u.StatefulStream<boolean>;
+    isAtBottom: u.StatefulStream<boolean>;
+    atBottomState: u.Stream<import("./stateFlagsSystem").AtBottomState>;
+    atTopStateChange: u.Stream<boolean>;
+    atBottomStateChange: u.Stream<boolean>;
+    scrollDirection: u.StatefulStream<import("./stateFlagsSystem").ScrollDirection>;
+    atBottomThreshold: u.StatefulStream<number>;
+    scrollVelocity: u.StatefulStream<number>;
+    lastJumpDueToItemResize: u.StatefulStream<number>;
 }]) => {
-    isSeeking: import("@virtuoso.dev/urx").StatefulStream<boolean>;
-    scrollSeekConfiguration: import("@virtuoso.dev/urx").StatefulStream<false | ScrollSeekConfiguration | undefined>;
-    scrollVelocity: import("@virtuoso.dev/urx").StatefulStream<number>;
-    scrollSeekRangeChanged: import("@virtuoso.dev/urx").Stream<ListRange>;
+    isSeeking: u.StatefulStream<boolean>;
+    scrollSeekConfiguration: u.StatefulStream<false | ScrollSeekConfiguration | undefined>;
+    scrollVelocity: u.StatefulStream<number>;
+    scrollSeekRangeChanged: u.Stream<ListRange>;
 }>;

package/components/Virtuoso/react-virtuoso/scrollSeekSystem.js

@@ -1,31 +1,17 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 var tslib_1 = require("tslib");
-var urx_1 = require("@virtuoso.dev/urx");
-var domIOSystem_1 = require("./domIOSystem");
+var u = tslib_1.__importStar(require("@virtuoso.dev/urx"));
 var stateFlagsSystem_1 = require("./stateFlagsSystem");
-exports.scrollSeekSystem = urx_1.system(function (_a) {
-    var _b = tslib_1.__read(_a, 2), scrollTop = _b[0].scrollTop, isScrolling = _b[1].isScrolling;
-    var scrollVelocity = urx_1.statefulStream(0);
-    var isSeeking = urx_1.statefulStream(false);
-    var rangeChanged = urx_1.stream();
-    var scrollSeekConfiguration = urx_1.statefulStream(false);
-    urx_1.connect(urx_1.pipe(isScrolling, urx_1.filter(function (value) { return !value; }), urx_1.mapTo(0)), scrollVelocity);
-    urx_1.connect(urx_1.pipe(scrollTop, urx_1.throttleTime(100), urx_1.withLatestFrom(isScrolling), urx_1.filter(function (_a) {
-        var _b = tslib_1.__read(_a, 2), isScrolling = _b[1];
-        return !!isScrolling;
-    }), urx_1.scan(function (_a, _b) {
-        var _c = tslib_1.__read(_a, 2), prev = _c[1];
-        var _d = tslib_1.__read(_b, 1), next = _d[0];
-        return [prev, next];
-    }, [0, 0]), urx_1.map(function (_a) {
-        var _b = tslib_1.__read(_a, 2), prev = _b[0], next = _b[1];
-        return next - prev;
-    })), scrollVelocity);
-    urx_1.connect(urx_1.pipe(scrollVelocity, urx_1.withLatestFrom(scrollSeekConfiguration, isSeeking, rangeChanged), urx_1.filter(function (_a) {
+exports.scrollSeekSystem = u.system(function (_a) {
+    var _b = tslib_1.__read(_a, 1), scrollVelocity = _b[0].scrollVelocity;
+    var isSeeking = u.statefulStream(false);
+    var rangeChanged = u.stream();
+    var scrollSeekConfiguration = u.statefulStream(false);
+    u.connect(u.pipe(scrollVelocity, u.withLatestFrom(scrollSeekConfiguration, isSeeking, rangeChanged), u.filter(function (_a) {
         var _b = tslib_1.__read(_a, 2), config = _b[1];
         return !!config;
-    }), urx_1.map(function (_a) {
+    }), u.map(function (_a) {
         var _b = tslib_1.__read(_a, 4), speed = _b[0], config = _b[1], isSeeking = _b[2], range = _b[3];
         var _c = config, exit = _c.exit, enter = _c.enter;
         if (isSeeking) {
@@ -37,8 +23,8 @@ exports.scrollSeekSystem = urx_1.system(function (_a) {
             return true;
         }
         return isSeeking;
-    }), urx_1.distinctUntilChanged()), isSeeking);
-    urx_1.subscribe(urx_1.pipe(urx_1.combineLatest(isSeeking, scrollVelocity, rangeChanged), urx_1.withLatestFrom(scrollSeekConfiguration)), function (_a) {
+    }), u.distinctUntilChanged()), isSeeking);
+    u.subscribe(u.pipe(u.combineLatest(isSeeking, scrollVelocity, rangeChanged), u.withLatestFrom(scrollSeekConfiguration)), function (_a) {
         var _b = tslib_1.__read(_a, 2), _c = tslib_1.__read(_b[0], 3), isSeeking = _c[0], velocity = _c[1], range = _c[2], config = _b[1];
         return isSeeking && config && config.change && config.change(velocity, range);
     });
@@ -48,4 +34,4 @@ exports.scrollSeekSystem = urx_1.system(function (_a) {
         scrollVelocity: scrollVelocity,
         scrollSeekRangeChanged: rangeChanged,
     };
-}, urx_1.tup(domIOSystem_1.domIOSystem, stateFlagsSystem_1.stateFlagsSystem), { singleton: true });
+}, u.tup(stateFlagsSystem_1.stateFlagsSystem), { singleton: true });

package/components/Virtuoso/react-virtuoso/scrollToIndexSystem.d.ts

@@ -1,8 +1,15 @@
 import * as u from '@virtuoso.dev/urx';
 import { IndexLocationWithAlign } from './interfaces';
+import { LogLevel } from './loggerSystem';
 export declare type IndexLocation = number | IndexLocationWithAlign;
 export declare function normalizeIndexLocation(location: IndexLocation): Required<IndexLocationWithAlign>;
-export declare const scrollToIndexSystem: u.SystemSpec<[u.SystemSpec<never[], () => {
+export declare const scrollToIndexSystem: u.SystemSpec<[u.SystemSpec<[u.SystemSpec<never[], () => {
+    log: u.StatefulStream<import("./loggerSystem").Log>;
+    logLevel: u.StatefulStream<LogLevel>;
+}>], ([{ log }]: [{
+    log: u.StatefulStream<import("./loggerSystem").Log>;
+    logLevel: u.StatefulStream<LogLevel>;
+}]) => {
     data: u.StatefulStream<import("./sizeSystem").Data>;
     totalCount: u.Stream<number>;
     sizeRanges: u.Stream<import("./sizeSystem").SizeRange[]>;
@@ -10,25 +17,32 @@ export declare const scrollToIndexSystem: u.SystemSpec<[u.SystemSpec<never[], ()
     defaultItemSize: u.StatefulStream<number | undefined>;
     fixedItemSize: u.StatefulStream<number | undefined>;
     unshiftWith: u.Stream<number>;
+    shiftWith: u.Stream<number>;
+    shiftWithOffset: u.Stream<number>;
     beforeUnshiftWith: u.Stream<number>;
     firstItemIndex: u.StatefulStream<number>;
     sizes: u.StatefulStream<import("./sizeSystem").SizeState>;
     listRefresh: u.Stream<boolean>;
+    statefulTotalCount: u.StatefulStream<number>;
     trackItemSizes: u.StatefulStream<boolean>;
     itemSize: u.StatefulStream<import("./sizeSystem").SizeFunction>;
 }>, u.SystemSpec<never[], () => {
+    scrollContainerState: u.Stream<[number, number]>;
     scrollTop: u.Stream<number>;
     viewportHeight: u.Stream<number>;
     headerHeight: u.StatefulStream<number>;
     footerHeight: u.StatefulStream<number>;
+    scrollHeight: u.Stream<number>;
     smoothScrollTargetReached: u.Stream<true>;
     scrollTo: u.Stream<ScrollToOptions>;
     scrollBy: u.Stream<ScrollToOptions>;
-    scrollDirection: u.StatefulStream<import("./domIOSystem").ScrollDirection>;
     statefulScrollTop: u.StatefulStream<number>;
     deviation: u.StatefulStream<number>;
     scrollingInProgress: u.StatefulStream<boolean>;
-}>], ([{ sizes, totalCount, listRefresh }, { scrollingInProgress, viewportHeight, scrollTo, smoothScrollTargetReached, headerHeight, footerHeight, },]: [{
+}>, u.SystemSpec<never[], () => {
+    log: u.StatefulStream<import("./loggerSystem").Log>;
+    logLevel: u.StatefulStream<LogLevel>;
+}>], ([{ sizes, totalCount, listRefresh }, { scrollingInProgress, viewportHeight, scrollTo, smoothScrollTargetReached, headerHeight, footerHeight, }, { log },]: [{
     data: u.StatefulStream<import("./sizeSystem").Data>;
     totalCount: u.Stream<number>;
     sizeRanges: u.Stream<import("./sizeSystem").SizeRange[]>;
@@ -36,25 +50,32 @@ export declare const scrollToIndexSystem: u.SystemSpec<[u.SystemSpec<never[], ()
     defaultItemSize: u.StatefulStream<number | undefined>;
     fixedItemSize: u.StatefulStream<number | undefined>;
     unshiftWith: u.Stream<number>;
+    shiftWith: u.Stream<number>;
+    shiftWithOffset: u.Stream<number>;
     beforeUnshiftWith: u.Stream<number>;
     firstItemIndex: u.StatefulStream<number>;
     sizes: u.StatefulStream<import("./sizeSystem").SizeState>;
     listRefresh: u.Stream<boolean>;
+    statefulTotalCount: u.StatefulStream<number>;
     trackItemSizes: u.StatefulStream<boolean>;
     itemSize: u.StatefulStream<import("./sizeSystem").SizeFunction>;
 }, {
+    scrollContainerState: u.Stream<[number, number]>;
     scrollTop: u.Stream<number>;
     viewportHeight: u.Stream<number>;
     headerHeight: u.StatefulStream<number>;
     footerHeight: u.StatefulStream<number>;
+    scrollHeight: u.Stream<number>;
     smoothScrollTargetReached: u.Stream<true>;
     scrollTo: u.Stream<ScrollToOptions>;
     scrollBy: u.Stream<ScrollToOptions>;
-    scrollDirection: u.StatefulStream<import("./domIOSystem").ScrollDirection>;
     statefulScrollTop: u.StatefulStream<number>;
     deviation: u.StatefulStream<number>;
     scrollingInProgress: u.StatefulStream<boolean>;
+}, {
+    log: u.StatefulStream<import("./loggerSystem").Log>;
+    logLevel: u.StatefulStream<LogLevel>;
 }]) => {
-    scrollToIndex: u.Stream<IndexLocation>;
+    scrollToIndex: u.Stream<number | IndexLocationWithAlign>;
     topListHeight: u.StatefulStream<number>;
 }>;

package/components/Virtuoso/react-virtuoso/scrollToIndexSystem.js

@@ -5,6 +5,7 @@ var tslib_1 = require("tslib");
 var u = tslib_1.__importStar(require("@virtuoso.dev/urx"));
 var AATree_1 = require("./AATree");
 var domIOSystem_1 = require("./domIOSystem");
+var loggerSystem_1 = require("./loggerSystem");
 var sizeSystem_1 = require("./sizeSystem");
 var SUPPORTS_SCROLL_TO_OPTIONS = typeof document !== 'undefined' &&
     'scrollBehavior' in document.documentElement.style;
@@ -23,13 +24,13 @@ function normalizeIndexLocation(location) {
 }
 exports.normalizeIndexLocation = normalizeIndexLocation;
 exports.scrollToIndexSystem = u.system(function (_a) {
-    var _b = tslib_1.__read(_a, 2), _c = _b[0], sizes = _c.sizes, totalCount = _c.totalCount, listRefresh = _c.listRefresh, _d = _b[1], scrollingInProgress = _d.scrollingInProgress, viewportHeight = _d.viewportHeight, scrollTo = _d.scrollTo, smoothScrollTargetReached = _d.smoothScrollTargetReached, headerHeight = _d.headerHeight, footerHeight = _d.footerHeight;
+    var _b = tslib_1.__read(_a, 3), _c = _b[0], sizes = _c.sizes, totalCount = _c.totalCount, listRefresh = _c.listRefresh, _d = _b[1], scrollingInProgress = _d.scrollingInProgress, viewportHeight = _d.viewportHeight, scrollTo = _d.scrollTo, smoothScrollTargetReached = _d.smoothScrollTargetReached, headerHeight = _d.headerHeight, footerHeight = _d.footerHeight, log = _b[2].log;
     var scrollToIndex = u.stream();
     var topListHeight = u.statefulStream(0);
     var unsubscribeNextListRefresh = null;
     var cleartTimeoutRef = null;
     var unsubscribeListRefresh = null;
-    var cleanup = function () {
+    function cleanup() {
         if (unsubscribeNextListRefresh) {
             unsubscribeNextListRefresh();
             unsubscribeNextListRefresh = null;
@@ -43,28 +44,33 @@ exports.scrollToIndexSystem = u.system(function (_a) {
             cleartTimeoutRef = null;
         }
         u.publish(scrollingInProgress, false);
-    };
-    u.connect(u.pipe(scrollToIndex, u.withLatestFrom(sizes, viewportHeight, totalCount, topListHeight, headerHeight, footerHeight), u.map(function (_a) {
-        var _b = tslib_1.__read(_a, 7), location = _b[0], sizes = _b[1], viewportHeight = _b[2], totalCount = _b[3], topListHeight = _b[4], headerHeight = _b[5], footerHeight = _b[6];
+    }
+    u.connect(u.pipe(scrollToIndex, u.withLatestFrom(sizes, viewportHeight, totalCount, topListHeight, headerHeight, footerHeight, log), u.map(function (_a) {
+        var _b = tslib_1.__read(_a, 8), location = _b[0], sizes = _b[1], viewportHeight = _b[2], totalCount = _b[3], topListHeight = _b[4], headerHeight = _b[5], footerHeight = _b[6], log = _b[7];
         var normalLocation = normalizeIndexLocation(location);
         var align = normalLocation.align, behavior = normalLocation.behavior, offset = normalLocation.offset;
         var lastIndex = totalCount - 1;
         var index = normalLocation.index;
+        if (index === 'LAST') {
+            index = lastIndex;
+        }
         index = sizeSystem_1.originalIndexFromItemIndex(index, sizes);
         index = Math.max(0, index, Math.min(lastIndex, index));
         var top = sizeSystem_1.offsetOf(index, sizes.offsetTree) + headerHeight;
         if (align === 'end') {
-            top = Math.round(top -
-                viewportHeight +
-                AATree_1.findMaxKeyValue(sizes.sizeTree, index)[1]);
+            top =
+                top -
+                    viewportHeight +
+                    AATree_1.findMaxKeyValue(sizes.sizeTree, index)[1];
             if (index === lastIndex) {
                 top += footerHeight;
             }
         }
         else if (align === 'center') {
-            top = Math.round(top -
-                viewportHeight / 2 +
-                AATree_1.findMaxKeyValue(sizes.sizeTree, index)[1] / 2);
+            top =
+                top -
+                    viewportHeight / 2 +
+                    AATree_1.findMaxKeyValue(sizes.sizeTree, index)[1] / 2;
         }
         else {
             top -= topListHeight;
@@ -75,8 +81,12 @@ exports.scrollToIndexSystem = u.system(function (_a) {
         var retry = function (listChanged) {
             cleanup();
             if (listChanged) {
+                log('retrying to scroll to', { location: location }, loggerSystem_1.LogLevel.DEBUG);
                 u.publish(scrollToIndex, location);
             }
+            else {
+                log('list did not change, scroll successful', {}, loggerSystem_1.LogLevel.DEBUG);
+            }
         };
         cleanup();
         if (behavior === 'smooth') {
@@ -89,7 +99,7 @@ exports.scrollToIndexSystem = u.system(function (_a) {
             });
         }
         else {
-            unsubscribeNextListRefresh = u.handleNext(listRefresh, retry);
+            unsubscribeNextListRefresh = u.handleNext(u.pipe(listRefresh, watchChangesFor(50)), retry);
         }
         // if the scroll jump is too small, the list won't get rerendered.
         // clean this listener
@@ -97,10 +107,24 @@ exports.scrollToIndexSystem = u.system(function (_a) {
             cleanup();
         }, 1200);
         u.publish(scrollingInProgress, true);
+        log('scrolling from index to', { index: index, top: top, behavior: behavior }, loggerSystem_1.LogLevel.DEBUG);
         return { top: top, behavior: behavior };
     })), scrollTo);
     return {
         scrollToIndex: scrollToIndex,
         topListHeight: topListHeight,
     };
-}, u.tup(sizeSystem_1.sizeSystem, domIOSystem_1.domIOSystem), { singleton: true });
+}, u.tup(sizeSystem_1.sizeSystem, domIOSystem_1.domIOSystem, loggerSystem_1.loggerSystem), { singleton: true });
+function watchChangesFor(limit) {
+    return function (done) {
+        var timeoutRef = setTimeout(function () {
+            done(false);
+        }, limit);
+        return function (value) {
+            if (value) {
+                done(true);
+                clearTimeout(timeoutRef);
+            }
+        };
+    };
+}

package/components/Virtuoso/react-virtuoso/sizeRangeSystem.d.ts

@@ -1,5 +1,5 @@
 import * as u from '@virtuoso.dev/urx';
-import { DOWN, ScrollDirection, UP } from './domIOSystem';
+import { DOWN, ScrollDirection, UP } from './stateFlagsSystem';
 export declare type NumberTuple = [number, number];
 export declare type Overscan = number | {
     main: number;
@@ -9,29 +9,34 @@ export declare const TOP: "top";
 export declare const BOTTOM: "bottom";
 export declare const NONE: "none";
 export declare type ListEnd = typeof TOP | typeof BOTTOM;
+export declare type ViewportIncrease = number | {
+    [k in ListEnd]?: number;
+};
 export declare type ChangeDirection = typeof UP | typeof DOWN | typeof NONE;
-export declare const getOverscan: (overscan: Overscan, end: "bottom" | "top", direction: ScrollDirection) => number;
+export declare function getOverscan(overscan: Overscan, end: ListEnd, direction: ScrollDirection): number;
 export declare const sizeRangeSystem: u.SystemSpec<[u.SystemSpec<never[], () => {
+    scrollContainerState: u.Stream<[number, number]>;
     scrollTop: u.Stream<number>;
     viewportHeight: u.Stream<number>;
     headerHeight: u.StatefulStream<number>;
     footerHeight: u.StatefulStream<number>;
+    scrollHeight: u.Stream<number>;
     smoothScrollTargetReached: u.Stream<true>;
     scrollTo: u.Stream<ScrollToOptions>;
     scrollBy: u.Stream<ScrollToOptions>;
-    scrollDirection: u.StatefulStream<ScrollDirection>;
     statefulScrollTop: u.StatefulStream<number>;
     deviation: u.StatefulStream<number>;
     scrollingInProgress: u.StatefulStream<boolean>;
 }>], ([{ scrollTop, viewportHeight, deviation, headerHeight }]: [{
+    scrollContainerState: u.Stream<[number, number]>;
     scrollTop: u.Stream<number>;
     viewportHeight: u.Stream<number>;
     headerHeight: u.StatefulStream<number>;
     footerHeight: u.StatefulStream<number>;
+    scrollHeight: u.Stream<number>;
     smoothScrollTargetReached: u.Stream<true>;
     scrollTo: u.Stream<ScrollToOptions>;
     scrollBy: u.Stream<ScrollToOptions>;
-    scrollDirection: u.StatefulStream<ScrollDirection>;
     statefulScrollTop: u.StatefulStream<number>;
     deviation: u.StatefulStream<number>;
     scrollingInProgress: u.StatefulStream<boolean>;
@@ -39,5 +44,7 @@ export declare const sizeRangeSystem: u.SystemSpec<[u.SystemSpec<never[], () =>
     listBoundary: u.Stream<NumberTuple>;
     overscan: u.StatefulStream<Overscan>;
     topListHeight: u.StatefulStream<number>;
+    fixedHeaderHeight: u.StatefulStream<number>;
+    increaseViewportBy: u.StatefulStream<ViewportIncrease>;
     visibleRange: u.StatefulStream<NumberTuple>;
 }>;

package/components/Virtuoso/react-virtuoso/sizeRangeSystem.js

@@ -4,44 +4,71 @@ var tslib_1 = require("tslib");
 var u = tslib_1.__importStar(require("@virtuoso.dev/urx"));
 var comparators_1 = require("./comparators");
 var domIOSystem_1 = require("./domIOSystem");
+var stateFlagsSystem_1 = require("./stateFlagsSystem");
 exports.TOP = 'top';
 exports.BOTTOM = 'bottom';
 exports.NONE = 'none';
-exports.getOverscan = function (overscan, end, direction) {
+function getOverscan(overscan, end, direction) {
     if (typeof overscan === 'number') {
-        return (direction === domIOSystem_1.UP && end === exports.TOP) ||
-            (direction === domIOSystem_1.DOWN && end === exports.BOTTOM)
+        return (direction === stateFlagsSystem_1.UP && end === exports.TOP) ||
+            (direction === stateFlagsSystem_1.DOWN && end === exports.BOTTOM)
             ? overscan
             : 0;
     }
-    if (direction === domIOSystem_1.UP) {
+    if (direction === stateFlagsSystem_1.UP) {
         return end === exports.TOP ? overscan.main : overscan.reverse;
     }
     return end === exports.BOTTOM ? overscan.main : overscan.reverse;
-};
+}
+exports.getOverscan = getOverscan;
+function getViewportIncrease(value, end) {
+    return typeof value === 'number' ? value : value[end] || 0;
+}
 exports.sizeRangeSystem = u.system(function (_a) {
     var _b = tslib_1.__read(_a, 1), _c = _b[0], scrollTop = _c.scrollTop, viewportHeight = _c.viewportHeight, deviation = _c.deviation, headerHeight = _c.headerHeight;
     var listBoundary = u.stream();
     var topListHeight = u.statefulStream(0);
+    var fixedHeaderHeight = u.statefulStream(0);
+    var increaseViewportBy = u.statefulStream(0);
     var overscan = u.statefulStream(0);
-    var visibleRange = u.statefulStreamFromEmitter(u.pipe(u.combineLatest(u.duc(scrollTop), u.duc(viewportHeight), u.duc(headerHeight), u.duc(listBoundary, comparators_1.tupleComparator), u.duc(overscan), u.duc(topListHeight), u.duc(deviation)), u.map(function (_a) {
-        var _b = tslib_1.__read(_a, 7), scrollTop = _b[0], viewportHeight = _b[1], headerHeight = _b[2], 
+    var visibleRange = u.statefulStreamFromEmitter(u.pipe(u.combineLatest(u.duc(scrollTop), u.duc(viewportHeight), u.duc(headerHeight), u.duc(listBoundary, comparators_1.tupleComparator), u.duc(overscan), u.duc(topListHeight), u.duc(fixedHeaderHeight), u.duc(deviation), u.duc(increaseViewportBy)), u.map(function (_a) {
+        var _b = tslib_1.__read(_a, 9), scrollTop = _b[0], viewportHeight = _b[1], headerHeight = _b[2], 
         // @ts-ignore
-        _c = tslib_1.__read(_b[3], 2), listTop = _c[0], listBottom = _c[1], overscan = _b[4], topListHeight = _b[5], deviation = _b[6];
-        var top = scrollTop - headerHeight - deviation;
+        _c = tslib_1.__read(_b[3], 2), listTop = _c[0], listBottom = _c[1], overscan = _b[4], topListHeight = _b[5], fixedHeaderHeight = _b[6], deviation = _b[7], increaseViewportBy = _b[8];
+        var top = scrollTop - deviation;
+        var stickyHeaderHeight = topListHeight + fixedHeaderHeight;
+        var headerVisible = Math.max(headerHeight - top, 0);
         var direction = exports.NONE;
+        var topViewportAddition = getViewportIncrease(increaseViewportBy, exports.TOP);
+        var bottomViewportAddition = getViewportIncrease(increaseViewportBy, exports.BOTTOM);
         listTop -= deviation;
+        listTop += headerHeight + fixedHeaderHeight;
+        listBottom += headerHeight + fixedHeaderHeight;
         listBottom -= deviation;
-        if (listTop > scrollTop + topListHeight) {
-            direction = domIOSystem_1.UP;
+        // console.log({ listTop, scrollTop, stickyHeaderHeight, topViewportAddition })
+        if (listTop >
+            scrollTop + stickyHeaderHeight - topViewportAddition) {
+            direction = stateFlagsSystem_1.UP;
         }
-        if (listBottom < scrollTop + viewportHeight) {
-            direction = domIOSystem_1.DOWN;
+        if (listBottom <
+            scrollTop -
+                headerVisible +
+                viewportHeight +
+                bottomViewportAddition) {
+            direction = stateFlagsSystem_1.DOWN;
         }
         if (direction !== exports.NONE) {
             return [
-                Math.max(top - exports.getOverscan(overscan, exports.TOP, direction), 0),
-                top + viewportHeight + exports.getOverscan(overscan, exports.BOTTOM, direction),
+                Math.max(top -
+                    headerHeight -
+                    getOverscan(overscan, exports.TOP, direction) -
+                    topViewportAddition, 0),
+                top -
+                    headerVisible -
+                    fixedHeaderHeight +
+                    viewportHeight +
+                    getOverscan(overscan, exports.BOTTOM, direction) +
+                    bottomViewportAddition,
             ];
         }
         return null;
@@ -51,6 +78,8 @@ exports.sizeRangeSystem = u.system(function (_a) {
         listBoundary: listBoundary,
         overscan: overscan,
         topListHeight: topListHeight,
+        fixedHeaderHeight: fixedHeaderHeight,
+        increaseViewportBy: increaseViewportBy,
         // output
         visibleRange: visibleRange,
     };

package/components/Virtuoso/react-virtuoso/sizeSystem.d.ts

@@ -1,5 +1,6 @@
 import * as u from '@virtuoso.dev/urx';
 import { AANode } from './AATree';
+import { Log, LogLevel } from './loggerSystem';
 export interface SizeRange {
     startIndex: number;
     endIndex: number;
@@ -33,13 +34,19 @@ export declare function rangesWithinOffsets(tree: Array<OffsetPoint>, startOffse
         index: number;
     };
 }>;
-export declare function sizeStateReducer(state: SizeState, [ranges, groupIndices]: [SizeRange[], number[]]): SizeState;
+export declare function sizeStateReducer(state: SizeState, [ranges, groupIndices, log]: [SizeRange[], number[], Log]): SizeState;
 export declare function offsetOf(index: number, tree: Array<OffsetPoint>): number;
 export declare function originalIndexFromItemIndex(itemIndex: number, sizes: SizeState): number;
 export declare function hasGroups(sizes: SizeState): boolean;
 /** Calculates the height of `el`, which will be the `Item` element in the DOM. */
 export declare type SizeFunction = (el: HTMLElement, field: 'offsetHeight' | 'offsetWidth') => number;
-export declare const sizeSystem: u.SystemSpec<never[], () => {
+export declare const sizeSystem: u.SystemSpec<[u.SystemSpec<never[], () => {
+    log: u.StatefulStream<Log>;
+    logLevel: u.StatefulStream<LogLevel>;
+}>], ([{ log }]: [{
+    log: u.StatefulStream<Log>;
+    logLevel: u.StatefulStream<LogLevel>;
+}]) => {
     data: u.StatefulStream<Data>;
     totalCount: u.Stream<number>;
     sizeRanges: u.Stream<SizeRange[]>;
@@ -47,10 +54,13 @@ export declare const sizeSystem: u.SystemSpec<never[], () => {
     defaultItemSize: u.StatefulStream<number | undefined>;
     fixedItemSize: u.StatefulStream<number | undefined>;
     unshiftWith: u.Stream<number>;
+    shiftWith: u.Stream<number>;
+    shiftWithOffset: u.Stream<number>;
     beforeUnshiftWith: u.Stream<number>;
     firstItemIndex: u.StatefulStream<number>;
     sizes: u.StatefulStream<SizeState>;
     listRefresh: u.Stream<boolean>;
+    statefulTotalCount: u.StatefulStream<number>;
     trackItemSizes: u.StatefulStream<boolean>;
     itemSize: u.StatefulStream<SizeFunction>;
 }>;