add all frontend files

node_modules/rc-virtual-list/es/hooks/useChildren.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+import type { RenderFunc, SharedConfig } from '../interface';
+export default function useChildren<T>(list: T[], startIndex: number, endIndex: number, scrollWidth: number, offsetX: number, setNodeRef: (item: T, element: HTMLElement) => void, renderFunc: RenderFunc<T>, { getKey }: SharedConfig<T>): React.JSX.Element[];

node_modules/rc-virtual-list/es/hooks/useChildren.js

@@ -0,0 +1,21 @@
+import * as React from 'react';
+import { Item } from "../Item";
+export default function useChildren(list, startIndex, endIndex, scrollWidth, offsetX, setNodeRef, renderFunc, _ref) {
+  var getKey = _ref.getKey;
+  return list.slice(startIndex, endIndex + 1).map(function (item, index) {
+    var eleIndex = startIndex + index;
+    var node = renderFunc(item, eleIndex, {
+      style: {
+        width: scrollWidth
+      },
+      offsetX: offsetX
+    });
+    var key = getKey(item);
+    return /*#__PURE__*/React.createElement(Item, {
+      key: key,
+      setRef: function setRef(ele) {
+        return setNodeRef(item, ele);
+      }
+    }, node);
+  });
+}

node_modules/rc-virtual-list/es/hooks/useDiffItem.d.ts

@@ -0,0 +1,2 @@
+import type { GetKey } from '../interface';
+export default function useDiffItem<T>(data: T[], getKey: GetKey<T>, onDiff?: (diffIndex: number) => void): [T];

node_modules/rc-virtual-list/es/hooks/useDiffItem.js

@@ -0,0 +1,22 @@
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import * as React from 'react';
+import { findListDiffIndex } from "../utils/algorithmUtil";
+export default function useDiffItem(data, getKey, onDiff) {
+  var _React$useState = React.useState(data),
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    prevData = _React$useState2[0],
+    setPrevData = _React$useState2[1];
+  var _React$useState3 = React.useState(null),
+    _React$useState4 = _slicedToArray(_React$useState3, 2),
+    diffItem = _React$useState4[0],
+    setDiffItem = _React$useState4[1];
+  React.useEffect(function () {
+    var diff = findListDiffIndex(prevData || [], data || [], getKey);
+    if ((diff === null || diff === void 0 ? void 0 : diff.index) !== undefined) {
+      onDiff === null || onDiff === void 0 || onDiff(diff.index);
+      setDiffItem(data[diff.index]);
+    }
+    setPrevData(data);
+  }, [data]);
+  return [diffItem];
+}

node_modules/rc-virtual-list/es/hooks/useFrameWheel.d.ts

@@ -0,0 +1,10 @@
+interface FireFoxDOMMouseScrollEvent {
+    detail: number;
+    preventDefault: VoidFunction;
+}
+export default function useFrameWheel(inVirtual: boolean, isScrollAtTop: boolean, isScrollAtBottom: boolean, isScrollAtLeft: boolean, isScrollAtRight: boolean, horizontalScroll: boolean, 
+/***
+ * Return `true` when you need to prevent default event
+ */
+onWheelDelta: (offset: number, horizontal: boolean) => void): [(e: WheelEvent) => void, (e: FireFoxDOMMouseScrollEvent) => void];
+export {};

node_modules/rc-virtual-list/es/hooks/useFrameWheel.js

@@ -0,0 +1,93 @@
+import raf from "rc-util/es/raf";
+import { useRef } from 'react';
+import isFF from "../utils/isFirefox";
+import useOriginScroll from "./useOriginScroll";
+export default function useFrameWheel(inVirtual, isScrollAtTop, isScrollAtBottom, isScrollAtLeft, isScrollAtRight, horizontalScroll,
+/***
+ * Return `true` when you need to prevent default event
+ */
+onWheelDelta) {
+  var offsetRef = useRef(0);
+  var nextFrameRef = useRef(null);
+
+  // Firefox patch
+  var wheelValueRef = useRef(null);
+  var isMouseScrollRef = useRef(false);
+
+  // Scroll status sync
+  var originScroll = useOriginScroll(isScrollAtTop, isScrollAtBottom, isScrollAtLeft, isScrollAtRight);
+  function onWheelY(e, deltaY) {
+    raf.cancel(nextFrameRef.current);
+
+    // Do nothing when scroll at the edge, Skip check when is in scroll
+    if (originScroll(false, deltaY)) return;
+
+    // Skip if nest List has handled this event
+    var event = e;
+    if (!event._virtualHandled) {
+      event._virtualHandled = true;
+    } else {
+      return;
+    }
+    offsetRef.current += deltaY;
+    wheelValueRef.current = deltaY;
+
+    // Proxy of scroll events
+    if (!isFF) {
+      event.preventDefault();
+    }
+    nextFrameRef.current = raf(function () {
+      // Patch a multiple for Firefox to fix wheel number too small
+      // ref: https://github.com/ant-design/ant-design/issues/26372#issuecomment-679460266
+      var patchMultiple = isMouseScrollRef.current ? 10 : 1;
+      onWheelDelta(offsetRef.current * patchMultiple, false);
+      offsetRef.current = 0;
+    });
+  }
+  function onWheelX(event, deltaX) {
+    onWheelDelta(deltaX, true);
+    if (!isFF) {
+      event.preventDefault();
+    }
+  }
+
+  // Check for which direction does wheel do. `sx` means `shift + wheel`
+  var wheelDirectionRef = useRef(null);
+  var wheelDirectionCleanRef = useRef(null);
+  function onWheel(event) {
+    if (!inVirtual) return;
+
+    // Wait for 2 frame to clean direction
+    raf.cancel(wheelDirectionCleanRef.current);
+    wheelDirectionCleanRef.current = raf(function () {
+      wheelDirectionRef.current = null;
+    }, 2);
+    var deltaX = event.deltaX,
+      deltaY = event.deltaY,
+      shiftKey = event.shiftKey;
+    var mergedDeltaX = deltaX;
+    var mergedDeltaY = deltaY;
+    if (wheelDirectionRef.current === 'sx' || !wheelDirectionRef.current && (shiftKey || false) && deltaY && !deltaX) {
+      mergedDeltaX = deltaY;
+      mergedDeltaY = 0;
+      wheelDirectionRef.current = 'sx';
+    }
+    var absX = Math.abs(mergedDeltaX);
+    var absY = Math.abs(mergedDeltaY);
+    if (wheelDirectionRef.current === null) {
+      wheelDirectionRef.current = horizontalScroll && absX > absY ? 'x' : 'y';
+    }
+    if (wheelDirectionRef.current === 'y') {
+      onWheelY(event, mergedDeltaY);
+    } else {
+      onWheelX(event, mergedDeltaX);
+    }
+  }
+
+  // A patch for firefox
+  function onFireFoxScroll(event) {
+    if (!inVirtual) return;
+    isMouseScrollRef.current = event.detail === wheelValueRef.current;
+  }
+  return [onWheel, onFireFoxScroll];
+}

node_modules/rc-virtual-list/es/hooks/useGetSize.d.ts

@@ -0,0 +1,7 @@
+import type CacheMap from '../utils/CacheMap';
+import type { GetKey, GetSize } from '../interface';
+/**
+ * Size info need loop query for the `heights` which will has the perf issue.
+ * Let cache result for each render phase.
+ */
+export declare function useGetSize<T>(mergedData: T[], getKey: GetKey<T>, heights: CacheMap, itemHeight: number): GetSize;

node_modules/rc-virtual-list/es/hooks/useGetSize.js

@@ -0,0 +1,48 @@
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import * as React from 'react';
+
+/**
+ * Size info need loop query for the `heights` which will has the perf issue.
+ * Let cache result for each render phase.
+ */
+export function useGetSize(mergedData, getKey, heights, itemHeight) {
+  var _React$useMemo = React.useMemo(function () {
+      return [new Map(), []];
+    }, [mergedData, heights.id, itemHeight]),
+    _React$useMemo2 = _slicedToArray(_React$useMemo, 2),
+    key2Index = _React$useMemo2[0],
+    bottomList = _React$useMemo2[1];
+  var getSize = function getSize(startKey) {
+    var endKey = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : startKey;
+    // Get from cache first
+    var startIndex = key2Index.get(startKey);
+    var endIndex = key2Index.get(endKey);
+
+    // Loop to fill the cache
+    if (startIndex === undefined || endIndex === undefined) {
+      var dataLen = mergedData.length;
+      for (var i = bottomList.length; i < dataLen; i += 1) {
+        var _heights$get;
+        var item = mergedData[i];
+        var key = getKey(item);
+        key2Index.set(key, i);
+        var cacheHeight = (_heights$get = heights.get(key)) !== null && _heights$get !== void 0 ? _heights$get : itemHeight;
+        bottomList[i] = (bottomList[i - 1] || 0) + cacheHeight;
+        if (key === startKey) {
+          startIndex = i;
+        }
+        if (key === endKey) {
+          endIndex = i;
+        }
+        if (startIndex !== undefined && endIndex !== undefined) {
+          break;
+        }
+      }
+    }
+    return {
+      top: bottomList[startIndex - 1] || 0,
+      bottom: bottomList[endIndex]
+    };
+  };
+  return getSize;
+}

node_modules/rc-virtual-list/es/hooks/useHeights.d.ts

@@ -0,0 +1,8 @@
+import type { GetKey } from '../interface';
+import CacheMap from '../utils/CacheMap';
+export default function useHeights<T>(getKey: GetKey<T>, onItemAdd?: (item: T) => void, onItemRemove?: (item: T) => void): [
+    setInstanceRef: (item: T, instance: HTMLElement) => void,
+    collectHeight: (sync?: boolean) => void,
+    cacheMap: CacheMap,
+    updatedMark: number
+];

node_modules/rc-virtual-list/es/hooks/useHeights.js

@@ -0,0 +1,83 @@
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import * as React from 'react';
+import { useEffect, useRef } from 'react';
+import CacheMap from "../utils/CacheMap";
+function parseNumber(value) {
+  var num = parseFloat(value);
+  return isNaN(num) ? 0 : num;
+}
+export default function useHeights(getKey, onItemAdd, onItemRemove) {
+  var _React$useState = React.useState(0),
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    updatedMark = _React$useState2[0],
+    setUpdatedMark = _React$useState2[1];
+  var instanceRef = useRef(new Map());
+  var heightsRef = useRef(new CacheMap());
+  var promiseIdRef = useRef(0);
+  function cancelRaf() {
+    promiseIdRef.current += 1;
+  }
+  function collectHeight() {
+    var sync = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
+    cancelRaf();
+    var doCollect = function doCollect() {
+      var changed = false;
+      instanceRef.current.forEach(function (element, key) {
+        if (element && element.offsetParent) {
+          var offsetHeight = element.offsetHeight;
+          var _getComputedStyle = getComputedStyle(element),
+            marginTop = _getComputedStyle.marginTop,
+            marginBottom = _getComputedStyle.marginBottom;
+          var marginTopNum = parseNumber(marginTop);
+          var marginBottomNum = parseNumber(marginBottom);
+          var totalHeight = offsetHeight + marginTopNum + marginBottomNum;
+          if (heightsRef.current.get(key) !== totalHeight) {
+            heightsRef.current.set(key, totalHeight);
+            changed = true;
+          }
+        }
+      });
+
+      // Always trigger update mark to tell parent that should re-calculate heights when resized
+      if (changed) {
+        setUpdatedMark(function (c) {
+          return c + 1;
+        });
+      }
+    };
+    if (sync) {
+      doCollect();
+    } else {
+      promiseIdRef.current += 1;
+      var id = promiseIdRef.current;
+      Promise.resolve().then(function () {
+        if (id === promiseIdRef.current) {
+          doCollect();
+        }
+      });
+    }
+  }
+  function setInstanceRef(item, instance) {
+    var key = getKey(item);
+    var origin = instanceRef.current.get(key);
+    if (instance) {
+      instanceRef.current.set(key, instance);
+      collectHeight();
+    } else {
+      instanceRef.current.delete(key);
+    }
+
+    // Instance changed
+    if (!origin !== !instance) {
+      if (instance) {
+        onItemAdd === null || onItemAdd === void 0 || onItemAdd(item);
+      } else {
+        onItemRemove === null || onItemRemove === void 0 || onItemRemove(item);
+      }
+    }
+  }
+  useEffect(function () {
+    return cancelRaf;
+  }, []);
+  return [setInstanceRef, collectHeight, heightsRef.current, updatedMark];
+}

node_modules/rc-virtual-list/es/hooks/useMobileTouchMove.d.ts

@@ -0,0 +1,2 @@
+import type * as React from 'react';
+export default function useMobileTouchMove(inVirtual: boolean, listRef: React.RefObject<HTMLDivElement>, callback: (isHorizontal: boolean, offset: number, smoothOffset: boolean, e?: TouchEvent) => boolean): void;

node_modules/rc-virtual-list/es/hooks/useMobileTouchMove.js

@@ -0,0 +1,87 @@
+import useLayoutEffect from "rc-util/es/hooks/useLayoutEffect";
+import { useRef } from 'react';
+var SMOOTH_PTG = 14 / 15;
+export default function useMobileTouchMove(inVirtual, listRef, callback) {
+  var touchedRef = useRef(false);
+  var touchXRef = useRef(0);
+  var touchYRef = useRef(0);
+  var elementRef = useRef(null);
+
+  // Smooth scroll
+  var intervalRef = useRef(null);
+
+  /* eslint-disable prefer-const */
+  var cleanUpEvents;
+  var onTouchMove = function onTouchMove(e) {
+    if (touchedRef.current) {
+      var currentX = Math.ceil(e.touches[0].pageX);
+      var currentY = Math.ceil(e.touches[0].pageY);
+      var offsetX = touchXRef.current - currentX;
+      var offsetY = touchYRef.current - currentY;
+      var _isHorizontal = Math.abs(offsetX) > Math.abs(offsetY);
+      if (_isHorizontal) {
+        touchXRef.current = currentX;
+      } else {
+        touchYRef.current = currentY;
+      }
+      var scrollHandled = callback(_isHorizontal, _isHorizontal ? offsetX : offsetY, false, e);
+      if (scrollHandled) {
+        e.preventDefault();
+      }
+
+      // Smooth interval
+      clearInterval(intervalRef.current);
+      if (scrollHandled) {
+        intervalRef.current = setInterval(function () {
+          if (_isHorizontal) {
+            offsetX *= SMOOTH_PTG;
+          } else {
+            offsetY *= SMOOTH_PTG;
+          }
+          var offset = Math.floor(_isHorizontal ? offsetX : offsetY);
+          if (!callback(_isHorizontal, offset, true) || Math.abs(offset) <= 0.1) {
+            clearInterval(intervalRef.current);
+          }
+        }, 16);
+      }
+    }
+  };
+  var onTouchEnd = function onTouchEnd() {
+    touchedRef.current = false;
+    cleanUpEvents();
+  };
+  var onTouchStart = function onTouchStart(e) {
+    cleanUpEvents();
+    if (e.touches.length === 1 && !touchedRef.current) {
+      touchedRef.current = true;
+      touchXRef.current = Math.ceil(e.touches[0].pageX);
+      touchYRef.current = Math.ceil(e.touches[0].pageY);
+      elementRef.current = e.target;
+      elementRef.current.addEventListener('touchmove', onTouchMove, {
+        passive: false
+      });
+      elementRef.current.addEventListener('touchend', onTouchEnd, {
+        passive: true
+      });
+    }
+  };
+  cleanUpEvents = function cleanUpEvents() {
+    if (elementRef.current) {
+      elementRef.current.removeEventListener('touchmove', onTouchMove);
+      elementRef.current.removeEventListener('touchend', onTouchEnd);
+    }
+  };
+  useLayoutEffect(function () {
+    if (inVirtual) {
+      listRef.current.addEventListener('touchstart', onTouchStart, {
+        passive: true
+      });
+    }
+    return function () {
+      var _listRef$current;
+      (_listRef$current = listRef.current) === null || _listRef$current === void 0 || _listRef$current.removeEventListener('touchstart', onTouchStart);
+      cleanUpEvents();
+      clearInterval(intervalRef.current);
+    };
+  }, [inVirtual]);
+}

node_modules/rc-virtual-list/es/hooks/useOriginScroll.d.ts

@@ -0,0 +1,2 @@
+declare const _default: (isScrollAtTop: boolean, isScrollAtBottom: boolean, isScrollAtLeft: boolean, isScrollAtRight: boolean) => (isHorizontal: boolean, delta: number, smoothOffset?: boolean) => boolean;
+export default _default;

node_modules/rc-virtual-list/es/hooks/useOriginScroll.js

@@ -0,0 +1,44 @@
+import { useRef } from 'react';
+export default (function (isScrollAtTop, isScrollAtBottom, isScrollAtLeft, isScrollAtRight) {
+  // Do lock for a wheel when scrolling
+  var lockRef = useRef(false);
+  var lockTimeoutRef = useRef(null);
+  function lockScroll() {
+    clearTimeout(lockTimeoutRef.current);
+    lockRef.current = true;
+    lockTimeoutRef.current = setTimeout(function () {
+      lockRef.current = false;
+    }, 50);
+  }
+
+  // Pass to ref since global add is in closure
+  var scrollPingRef = useRef({
+    top: isScrollAtTop,
+    bottom: isScrollAtBottom,
+    left: isScrollAtLeft,
+    right: isScrollAtRight
+  });
+  scrollPingRef.current.top = isScrollAtTop;
+  scrollPingRef.current.bottom = isScrollAtBottom;
+  scrollPingRef.current.left = isScrollAtLeft;
+  scrollPingRef.current.right = isScrollAtRight;
+  return function (isHorizontal, delta) {
+    var smoothOffset = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+    var originScroll = isHorizontal ?
+    // Pass origin wheel when on the left
+    delta < 0 && scrollPingRef.current.left ||
+    // Pass origin wheel when on the right
+    delta > 0 && scrollPingRef.current.right // Pass origin wheel when on the top
+    : delta < 0 && scrollPingRef.current.top ||
+    // Pass origin wheel when on the bottom
+    delta > 0 && scrollPingRef.current.bottom;
+    if (smoothOffset && originScroll) {
+      // No need lock anymore when it's smooth offset from touchMove interval
+      clearTimeout(lockTimeoutRef.current);
+      lockRef.current = false;
+    } else if (!originScroll || lockRef.current) {
+      lockScroll();
+    }
+    return !lockRef.current && originScroll;
+  };
+});

node_modules/rc-virtual-list/es/hooks/useScrollDrag.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+export declare function getPageXY(e: React.MouseEvent | React.TouchEvent | MouseEvent | TouchEvent, horizontal: boolean): number;
+export default function useScrollDrag(inVirtual: boolean, componentRef: React.RefObject<HTMLElement>, onScrollOffset: (offset: number) => void): void;

node_modules/rc-virtual-list/es/hooks/useScrollDrag.js

@@ -0,0 +1,75 @@
+import raf from "rc-util/es/raf";
+import * as React from 'react';
+function smoothScrollOffset(offset) {
+  return Math.floor(Math.pow(offset, 0.5));
+}
+export function getPageXY(e, horizontal) {
+  var obj = 'touches' in e ? e.touches[0] : e;
+  return obj[horizontal ? 'pageX' : 'pageY'] - window[horizontal ? 'scrollX' : 'scrollY'];
+}
+export default function useScrollDrag(inVirtual, componentRef, onScrollOffset) {
+  React.useEffect(function () {
+    var ele = componentRef.current;
+    if (inVirtual && ele) {
+      var mouseDownLock = false;
+      var rafId;
+      var _offset;
+      var stopScroll = function stopScroll() {
+        raf.cancel(rafId);
+      };
+      var continueScroll = function continueScroll() {
+        stopScroll();
+        rafId = raf(function () {
+          onScrollOffset(_offset);
+          continueScroll();
+        });
+      };
+      var clearDragState = function clearDragState() {
+        mouseDownLock = false;
+        stopScroll();
+      };
+      var onMouseDown = function onMouseDown(e) {
+        // Skip if element set draggable
+        if (e.target.draggable || e.button !== 0) {
+          return;
+        }
+        // Skip if nest List has handled this event
+        var event = e;
+        if (!event._virtualHandled) {
+          event._virtualHandled = true;
+          mouseDownLock = true;
+        }
+      };
+      var onMouseMove = function onMouseMove(e) {
+        if (mouseDownLock) {
+          var mouseY = getPageXY(e, false);
+          var _ele$getBoundingClien = ele.getBoundingClientRect(),
+            top = _ele$getBoundingClien.top,
+            bottom = _ele$getBoundingClien.bottom;
+          if (mouseY <= top) {
+            var diff = top - mouseY;
+            _offset = -smoothScrollOffset(diff);
+            continueScroll();
+          } else if (mouseY >= bottom) {
+            var _diff = mouseY - bottom;
+            _offset = smoothScrollOffset(_diff);
+            continueScroll();
+          } else {
+            stopScroll();
+          }
+        }
+      };
+      ele.addEventListener('mousedown', onMouseDown);
+      ele.ownerDocument.addEventListener('mouseup', clearDragState);
+      ele.ownerDocument.addEventListener('mousemove', onMouseMove);
+      ele.ownerDocument.addEventListener('dragend', clearDragState);
+      return function () {
+        ele.removeEventListener('mousedown', onMouseDown);
+        ele.ownerDocument.removeEventListener('mouseup', clearDragState);
+        ele.ownerDocument.removeEventListener('mousemove', onMouseMove);
+        ele.ownerDocument.removeEventListener('dragend', clearDragState);
+        stopScroll();
+      };
+    }
+  }, [inVirtual]);
+}

node_modules/rc-virtual-list/es/hooks/useScrollTo.d.ts

@@ -0,0 +1,18 @@
+import * as React from 'react';
+import type { GetKey } from '../interface';
+import type CacheMap from '../utils/CacheMap';
+export type ScrollAlign = 'top' | 'bottom' | 'auto';
+export type ScrollPos = {
+    left?: number;
+    top?: number;
+};
+export type ScrollTarget = {
+    index: number;
+    align?: ScrollAlign;
+    offset?: number;
+} | {
+    key: React.Key;
+    align?: ScrollAlign;
+    offset?: number;
+};
+export default function useScrollTo<T>(containerRef: React.RefObject<HTMLDivElement>, data: T[], heights: CacheMap, itemHeight: number, getKey: GetKey<T>, collectHeight: () => void, syncScrollTop: (newTop: number) => void, triggerFlash: () => void): (arg: number | ScrollTarget) => void;

node_modules/rc-virtual-list/es/hooks/useScrollTo.js

@@ -0,0 +1,143 @@
+import _typeof from "@babel/runtime/helpers/esm/typeof";
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+/* eslint-disable no-param-reassign */
+import * as React from 'react';
+import raf from "rc-util/es/raf";
+import useLayoutEffect from "rc-util/es/hooks/useLayoutEffect";
+import { warning } from 'rc-util';
+var MAX_TIMES = 10;
+export default function useScrollTo(containerRef, data, heights, itemHeight, getKey, collectHeight, syncScrollTop, triggerFlash) {
+  var scrollRef = React.useRef();
+  var _React$useState = React.useState(null),
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    syncState = _React$useState2[0],
+    setSyncState = _React$useState2[1];
+
+  // ========================== Sync Scroll ==========================
+  useLayoutEffect(function () {
+    if (syncState && syncState.times < MAX_TIMES) {
+      // Never reach
+      if (!containerRef.current) {
+        setSyncState(function (ori) {
+          return _objectSpread({}, ori);
+        });
+        return;
+      }
+      collectHeight();
+      var targetAlign = syncState.targetAlign,
+        originAlign = syncState.originAlign,
+        index = syncState.index,
+        offset = syncState.offset;
+      var height = containerRef.current.clientHeight;
+      var needCollectHeight = false;
+      var newTargetAlign = targetAlign;
+      var targetTop = null;
+
+      // Go to next frame if height not exist
+      if (height) {
+        var mergedAlign = targetAlign || originAlign;
+
+        // Get top & bottom
+        var stackTop = 0;
+        var itemTop = 0;
+        var itemBottom = 0;
+        var maxLen = Math.min(data.length - 1, index);
+        for (var i = 0; i <= maxLen; i += 1) {
+          var key = getKey(data[i]);
+          itemTop = stackTop;
+          var cacheHeight = heights.get(key);
+          itemBottom = itemTop + (cacheHeight === undefined ? itemHeight : cacheHeight);
+          stackTop = itemBottom;
+        }
+
+        // Check if need sync height (visible range has item not record height)
+        var leftHeight = mergedAlign === 'top' ? offset : height - offset;
+        for (var _i = maxLen; _i >= 0; _i -= 1) {
+          var _key = getKey(data[_i]);
+          var _cacheHeight = heights.get(_key);
+          if (_cacheHeight === undefined) {
+            needCollectHeight = true;
+            break;
+          }
+          leftHeight -= _cacheHeight;
+          if (leftHeight <= 0) {
+            break;
+          }
+        }
+
+        // Scroll to
+        switch (mergedAlign) {
+          case 'top':
+            targetTop = itemTop - offset;
+            break;
+          case 'bottom':
+            targetTop = itemBottom - height + offset;
+            break;
+          default:
+            {
+              var scrollTop = containerRef.current.scrollTop;
+              var scrollBottom = scrollTop + height;
+              if (itemTop < scrollTop) {
+                newTargetAlign = 'top';
+              } else if (itemBottom > scrollBottom) {
+                newTargetAlign = 'bottom';
+              }
+            }
+        }
+        if (targetTop !== null) {
+          syncScrollTop(targetTop);
+        }
+
+        // One more time for sync
+        if (targetTop !== syncState.lastTop) {
+          needCollectHeight = true;
+        }
+      }
+
+      // Trigger next effect
+      if (needCollectHeight) {
+        setSyncState(_objectSpread(_objectSpread({}, syncState), {}, {
+          times: syncState.times + 1,
+          targetAlign: newTargetAlign,
+          lastTop: targetTop
+        }));
+      }
+    } else if (process.env.NODE_ENV !== 'production' && (syncState === null || syncState === void 0 ? void 0 : syncState.times) === MAX_TIMES) {
+      warning(false, 'Seems `scrollTo` with `rc-virtual-list` reach the max limitation. Please fire issue for us. Thanks.');
+    }
+  }, [syncState, containerRef.current]);
+
+  // =========================== Scroll To ===========================
+  return function (arg) {
+    // When not argument provided, we think dev may want to show the scrollbar
+    if (arg === null || arg === undefined) {
+      triggerFlash();
+      return;
+    }
+
+    // Normal scroll logic
+    raf.cancel(scrollRef.current);
+    if (typeof arg === 'number') {
+      syncScrollTop(arg);
+    } else if (arg && _typeof(arg) === 'object') {
+      var index;
+      var align = arg.align;
+      if ('index' in arg) {
+        index = arg.index;
+      } else {
+        index = data.findIndex(function (item) {
+          return getKey(item) === arg.key;
+        });
+      }
+      var _arg$offset = arg.offset,
+        offset = _arg$offset === void 0 ? 0 : _arg$offset;
+      setSyncState({
+        times: 0,
+        index: index,
+        offset: offset,
+        originAlign: align
+      });
+    }
+  };
+}