@sheinx/base 3.4.0-beta.3 → 3.4.0-beta.5

package/esm/tabs/tabs.js

@@ -155,11 +155,10 @@ var Tabs = function Tabs(props) {
       className: tabsStyle.panelWrapper,
       style: panelStyle,
       children: Children.toArray(children).map(function (child, index) {
-        var Chlid = child;
-        if (isNamedComponent(Chlid.type) && Chlid.type.displayName === 'ShineoutTabsPanel') {
-          return /*#__PURE__*/cloneElement(Chlid, {
-            id: Chlid.props.id !== undefined ? Chlid.props.id : index,
-            active: active
+        var Child = child;
+        if (isNamedComponent(Child.type) && Child.type.displayName === 'ShineoutTabsPanel') {
+          return /*#__PURE__*/cloneElement(Child, {
+            id: Child.props.id !== undefined ? Child.props.id : index
           });
         }
         return null;
@@ -170,20 +169,20 @@ var Tabs = function Tabs(props) {
     var tabs = [];
     var border = getSplitColor();
     Children.toArray(children).forEach(function (child, index) {
-      var Chlid = child;
-      if (!Chlid || !Chlid.type) return;
-      var childBorder = Chlid.props.splitColor || Chlid.props.border;
-      var _Chlid$props$id = Chlid.props.id,
-        id = _Chlid$props$id === void 0 ? index : _Chlid$props$id;
+      var Child = child;
+      if (!Child || !Child.type) return;
+      var childBorder = Child.props.splitColor || Child.props.border;
+      var _Child$props$id = Child.props.id,
+        id = _Child$props$id === void 0 ? index : _Child$props$id;
       if (active === id && childBorder) {
         border = childBorder;
       }
       tabs.push({
-        id: Chlid.props.id !== undefined ? Chlid.props.id : index,
-        tab: Chlid.props.tab,
-        disabled: Chlid.props.disabled,
+        id: Child.props.id !== undefined ? Child.props.id : index,
+        tab: Child.props.tab,
+        disabled: Child.props.disabled,
         jssStyle: jssStyle,
-        color: Chlid.props.color || (active === id ? color : undefined)
+        color: Child.props.color || (active === id ? color : undefined)
       });
     });
     var header = /*#__PURE__*/_jsx(TabsHeader, {

package/esm/tag/tag.js

@@ -14,7 +14,7 @@ import TagInput from "./tag-input";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 var Done = 2;
-var Pendding = 1;
+var Pending = 1;
 var Tag = function Tag(props) {
   var _jssStyle$tag;
   var jssStyle = props.jssStyle,
@@ -97,7 +97,7 @@ var Tag = function Tag(props) {
     if (!showClose) {
       return null;
     }
-    if (dismiss === Pendding) {
+    if (dismiss === Pending) {
       // 后面用 Spin 替换
       return /*#__PURE__*/_jsx("span", {});
     }

package/esm/tag/use-tag.js

@@ -8,7 +8,7 @@ import { util } from '@sheinx/hooks';
 import { useState, useEffect } from 'react';
 var Done = 2;
 var Finish = 0;
-var Pendding = 1;
+var Pending = 1;
 var isEmpty = util.isEmpty,
   isPromise = util.isPromise,
   isString = util.isString,
@@ -59,7 +59,7 @@ var useTag = function useTag(props) {
     if (typeof onClose === 'function') {
       callback = onClose(e);
       if (isPromise(callback)) {
-        setDismiss(Pendding);
+        setDismiss(Pending);
         callback.then(function () {
           setDismiss(Done);
         }).catch(function () {

package/esm/tooltip/tooltip.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tooltip.d.ts","sourceRoot":"","sources":["tooltip.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAM9C,QAAA,MAAM,OAAO,UAAW,YAAY,uBA6FnC,CAAC;AAEF,eAAe,OAAO,CAAC"}
+{"version":3,"file":"tooltip.d.ts","sourceRoot":"","sources":["tooltip.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAM9C,QAAA,MAAM,OAAO,UAAW,YAAY,uBAsGnC,CAAC;AAEF,eAAe,OAAO,CAAC"}

package/esm/tooltip/tooltip.js

@@ -6,12 +6,12 @@ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol"
 function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 import { usePopup, util } from '@sheinx/hooks';
 import classNames from 'classnames';
-import React, { cloneElement, isValidElement } from 'react';
+import React, { cloneElement, isValidElement, useRef } from 'react';
 import AbsoluteList from "../absolute-list";
 import { useConfig } from "../config";
 import { jsx as _jsx } from "react/jsx-runtime";
-import { Fragment as _Fragment } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
 var defaultDelay = 0;
 var Tooltip = function Tooltip(props) {
   var _jssStyle$tooltip;
@@ -28,7 +28,8 @@ var Tooltip = function Tooltip(props) {
     _props$type = props.type,
     type = _props$type === void 0 ? 'default' : _props$type,
     _props$position = props.position,
-    popsitionProps = _props$position === void 0 ? 'bottom' : _props$position;
+    popsitionProps = _props$position === void 0 ? 'auto' : _props$position;
+  var arrowStyleRef = useRef({});
   var tooltipClasses = jssStyle === null || jssStyle === void 0 || (_jssStyle$tooltip = jssStyle.tooltip) === null || _jssStyle$tooltip === void 0 ? void 0 : _jssStyle$tooltip.call(jssStyle);
   var config = useConfig();
   var childrenProps = /*#__PURE__*/isValidElement(children) ? children === null || children === void 0 ? void 0 : children.props : {};
@@ -45,7 +46,8 @@ var Tooltip = function Tooltip(props) {
     position = _usePopup.position,
     getTargetProps = _usePopup.getTargetProps,
     targetRef = _usePopup.targetRef,
-    popupRef = _usePopup.popupRef;
+    popupRef = _usePopup.popupRef,
+    arrowRef = _usePopup.arrowRef;
   if (! /*#__PURE__*/isValidElement(children)) {
     console.error(new Error('Tooltip children expect a single ReactElement.'));
     return null;
@@ -76,12 +78,16 @@ var Tooltip = function Tooltip(props) {
       focus: open,
       parentElRef: targetRef,
       popupElRef: popupRef,
+      arrowRef: arrowRef,
       absolute: true,
+      adjust: popsitionProps === 'auto',
       position: position,
       fixedWidth: false,
-      popupGap: 0,
+      popupGap: 0
+      // arrowStyleRef={arrowStyleRef}
+      ,
       zIndex: zIndex,
-      children: /*#__PURE__*/_jsx("div", _objectSpread(_objectSpread({
+      children: /*#__PURE__*/_jsxs("div", _objectSpread(_objectSpread({
         className: classNames(className, tooltipClasses === null || tooltipClasses === void 0 ? void 0 : tooltipClasses.wrapper, open && (tooltipClasses === null || tooltipClasses === void 0 ? void 0 : tooltipClasses.wrapperOpen))
       }, util.getDataAttribute({
         type: type,
@@ -90,11 +96,17 @@ var Tooltip = function Tooltip(props) {
         ref: popupRef,
         onMouseLeave: events.onMouseLeave,
         dir: config.direction,
-        children: /*#__PURE__*/_jsx("div", {
+        children: [/*#__PURE__*/_jsx("span", _objectSpread({
+          ref: arrowRef,
+          style: arrowStyleRef.current,
+          className: tooltipClasses === null || tooltipClasses === void 0 ? void 0 : tooltipClasses.arrow
+        }, util.getDataAttribute({
+          role: 'arrow'
+        }))), /*#__PURE__*/_jsx("div", {
           style: style,
           className: classNames(tooltipClasses === null || tooltipClasses === void 0 ? void 0 : tooltipClasses.content),
           children: tip
-        })
+        })]
       }))
     })]
   });

package/esm/tooltip/tooltip.type.d.ts

@@ -18,6 +18,10 @@ export interface TooltipClasses {
      * 弹出层内容
      */
     content: string;
+    /**
+     * 箭头
+     */
+    arrow: string;
 }
 export interface TooltipProps extends Pick<BasePopupProps, 'trigger' | 'position' | 'priorityDirection'>, Pick<CommonType, 'className' | 'style'> {
     /**

package/esm/tooltip/tooltip.type.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tooltip.type.d.ts","sourceRoot":"","sources":["tooltip.type.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAC5C,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAE/C,MAAM,WAAW,cAAc;IAC7B;;OAEG;IACH,MAAM,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,OAAO,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,WAAW,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,YACf,SAAQ,IAAI,CAAC,cAAc,EAAE,SAAS,GAAG,UAAU,GAAG,mBAAmB,CAAC,EACxE,IAAI,CAAC,UAAU,EAAE,WAAW,GAAG,OAAO,CAAC;IACzC;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,GAAG,OAAO,GAAG,OAAO,CAAC;IACtC,QAAQ,CAAC,EAAE;QACT,OAAO,CAAC,EAAE,MAAM,cAAc,CAAC;KAChC,CAAC;IAIF;;;;OAIG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;OAIG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,GAAG,EAAE,KAAK,CAAC,SAAS,CAAC;IACrB;;;;OAIG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,OAAO,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAC;IAC1E;;;;OAIG;IACH,MAAM,CAAC,EAAE,MAAM,CAAA;CAChB"}
+{"version":3,"file":"tooltip.type.d.ts","sourceRoot":"","sources":["tooltip.type.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAC5C,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAE/C,MAAM,WAAW,cAAc;IAC7B;;OAEG;IACH,MAAM,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,OAAO,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,WAAW,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,OAAO,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,YACf,SAAQ,IAAI,CAAC,cAAc,EAAE,SAAS,GAAG,UAAU,GAAG,mBAAmB,CAAC,EACxE,IAAI,CAAC,UAAU,EAAE,WAAW,GAAG,OAAO,CAAC;IACzC;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,GAAG,OAAO,GAAG,OAAO,CAAC;IACtC,QAAQ,CAAC,EAAE;QACT,OAAO,CAAC,EAAE,MAAM,cAAc,CAAC;KAChC,CAAC;IAIF;;;;OAIG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;OAIG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,GAAG,EAAE,KAAK,CAAC,SAAS,CAAC;IACrB;;;;OAIG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,OAAO,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAC;IAC1E;;;;OAIG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB"}

package/esm/virtual-scroll/scroll.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"scroll.d.ts","sourceRoot":"","sources":["scroll.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiB,MAAM,OAAO,CAAC;AAItC,UAAU,WAAW;IACnB,YAAY,EAAE,MAAM,CAAC;IACrB,WAAW,EAAE,MAAM,CAAC;IACpB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,aAAa,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IACpC,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;IAC7C,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE;QAChB,UAAU,EAAE,MAAM,CAAC;QACnB,SAAS,EAAE,MAAM,CAAC;QAClB,CAAC,EAAE,MAAM,CAAC;QACV,CAAC,EAAE,MAAM,CAAC;QACV,QAAQ,EAAE,OAAO,CAAC;QAClB,MAAM,EAAE,MAAM,CAAC;QACf,KAAK,EAAE,MAAM,CAAC;KACf,KAAK,IAAI,CAAC;IACX,gBAAgB,CAAC,EAAE,CAAC,OAAO,CAAC,EAAE,GAAG,KAAK,IAAI,CAAC;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,aAAa,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IACpC,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,QAAA,MAAM,MAAM,UAAW,WAAW,gBAuHjC,CAAC;AAEF,eAAe,MAAM,CAAC"}
+{"version":3,"file":"scroll.d.ts","sourceRoot":"","sources":["scroll.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiB,MAAM,OAAO,CAAC;AAItC,UAAU,WAAW;IACnB,YAAY,EAAE,MAAM,CAAC;IACrB,WAAW,EAAE,MAAM,CAAC;IACpB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,aAAa,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IACpC,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;IAC7C,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE;QAChB,UAAU,EAAE,MAAM,CAAC;QACnB,SAAS,EAAE,MAAM,CAAC;QAClB,CAAC,EAAE,MAAM,CAAC;QACV,CAAC,EAAE,MAAM,CAAC;QACV,QAAQ,EAAE,OAAO,CAAC;QAClB,MAAM,EAAE,MAAM,CAAC;QACf,KAAK,EAAE,MAAM,CAAC;KACf,KAAK,IAAI,CAAC;IACX,gBAAgB,CAAC,EAAE,CAAC,OAAO,CAAC,EAAE,GAAG,KAAK,IAAI,CAAC;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,aAAa,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IACpC,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,QAAA,MAAM,MAAM,UAAW,WAAW,gBAmIjC,CAAC;AAEF,eAAe,MAAM,CAAC"}

package/esm/virtual-scroll/scroll.js

@@ -5,12 +5,14 @@ function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key i
 function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
 function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 import React, { useRef } from 'react';
-import { usePersistFn, useResize, util } from '@sheinx/hooks';
+import { useForkRef, usePersistFn, useResize, util } from '@sheinx/hooks';
 import { useConfig } from "../config";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 var Scroll = function Scroll(props) {
   var containerRef = useRef(null);
+  var scrollRef = useRef(null);
+  var wrapperRef = useForkRef(scrollRef, props.wrapperRef);
   var _useRef = useRef({
       timer: null,
       isMouseDown: false,
@@ -100,6 +102,13 @@ var Scroll = function Scroll(props) {
       fromDrag: context.isMouseDown
     });
   });
+  var handleInnerScroll = usePersistFn(function (e) {
+    var scrollTop = e.currentTarget.scrollTop;
+    if (scrollRef.current) {
+      e.currentTarget.scrollTop = 0;
+      scrollRef.current.scrollTop += scrollTop;
+    }
+  });
   return /*#__PURE__*/_jsx("div", {
     className: props.className,
     style: props.style,
@@ -109,7 +118,7 @@ var Scroll = function Scroll(props) {
     })), {}, {
       style: scrollerStyle,
       onScroll: handleScroll,
-      ref: props.wrapperRef,
+      ref: wrapperRef,
       onMouseDown: function onMouseDown() {
         context.isMouseDown = true;
       },
@@ -121,6 +130,7 @@ var Scroll = function Scroll(props) {
       })), {}, {
         style: containerStyle,
         ref: containerRef,
+        onScroll: handleInnerScroll,
         children: /*#__PURE__*/_jsx("div", {
           style: _objectSpread({
             flexGrow: 1

package/esm/virtual-scroll/virtual-scroll-list.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"virtual-scroll-list.d.ts","sourceRoot":"","sources":["virtual-scroll-list.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAE,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AAE9D,QAAA,MAAM,WAAW,8DA6GhB,CAAC;AAEF,eAAe,WAAW,CAAC"}
+{"version":3,"file":"virtual-scroll-list.d.ts","sourceRoot":"","sources":["virtual-scroll-list.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAE,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AAE9D,QAAA,MAAM,WAAW,8DAsPhB,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/esm/virtual-scroll/virtual-scroll-list.js

@@ -28,30 +28,110 @@ var VirtualList = function VirtualList(props) {
     _props$tag = props.tag,
     tag = _props$tag === void 0 ? 'div' : _props$tag,
     tagClassName = props.tagClassName,
+    dynamicVirtual = props.dynamicVirtual,
     virtualRef = props.virtualRef,
     onControlTypeChange = props.onControlTypeChange;
   var _useState = useState(0),
     _useState2 = _slicedToArray(_useState, 2),
-    currentIndex = _useState2[0],
-    setCurrentIndex = _useState2[1];
+    top = _useState2[0],
+    setTop = _useState2[1];
   var _useState3 = useState(0),
     _useState4 = _slicedToArray(_useState3, 2),
-    top = _useState4[0],
-    setTop = _useState4[1];
+    offsetY = _useState4[0],
+    setOffsetY = _useState4[1];
+  var _useState5 = useState(props.data.length * lineHeight),
+    _useState6 = _slicedToArray(_useState5, 2),
+    scrollHeight = _useState6[0],
+    setHeight = _useState6[1];
+  var _useState7 = useState(0),
+    _useState8 = _slicedToArray(_useState7, 2),
+    startIndex = _useState8[0],
+    setCurrentIndex = _useState8[1];
   var wrapperRef = useRef(null);
-  var getScrollHeight = function getScrollHeight() {
-    var rows = Math.ceil(data.length);
-    return rows * lineHeight;
+  var _useRef = useRef({
+      cachedHeight: [],
+      controlScrollRate: null,
+      heightCallback: null,
+      preIndex: null,
+      topTimer: null,
+      rateTimer: null,
+      shouldUpdateHeight: true
+    }),
+    context = _useRef.current;
+  var getContentHeight = function getContentHeight(index) {
+    var sum = 0;
+    for (var i = 0; i <= index; i++) {
+      sum += context.cachedHeight[i] || lineHeight;
+    }
+    return sum;
   };
   var getCurrentIndex = usePersistFn(function () {
-    return currentIndex;
+    return startIndex;
   });
   var getTop = usePersistFn(function () {
     return top;
   });
+  var setRowHeight = usePersistFn(function (index, height) {
+    var beforeHeight = context.cachedHeight[index];
+    if (beforeHeight && beforeHeight === height) return;
+    context.cachedHeight[index] = height;
+    if (context.shouldUpdateHeight) {
+      setHeight(getContentHeight(props.data.length - 1));
+    }
+    var preIndex = context.preIndex;
+    // 解决: 从下往上滚 由于高度变化会导致滚动条跳动
+    if (preIndex && preIndex > startIndex && startIndex === index) {
+      // 发生在顶部
+      if (context.heightCallback) return;
+      var offset = height - (beforeHeight || lineHeight);
+      setOffsetY(function (s) {
+        return s + offset;
+      });
+    }
+  });
+  var updateRateScroll = usePersistFn(function (rate) {
+    var sumHeight = getContentHeight(props.data.length - 1);
+    if (sumHeight === scrollHeight) return;
+    context.shouldUpdateHeight = true;
+    context.heightCallback = function () {
+      if (wrapperRef && wrapperRef.current) {
+        var _scrollHeight = wrapperRef.current.scrollHeight;
+        var clientHeight = wrapperRef.current.clientHeight;
+        var nowTop = wrapperRef.current.scrollTop;
+        var max = _scrollHeight - clientHeight;
+        var _top = rate * max;
+        if (Math.abs(nowTop - _top) < 1) {
+          context.controlScrollRate = null;
+        } else {
+          context.controlScrollRate = rate;
+          wrapperRef.current.scrollTop = _top;
+        }
+      }
+    };
+    setHeight(sumHeight);
+  });
+  var updateIndexAndTopFromTop = function updateIndexAndTopFromTop(scrollTop) {
+    var sum = 0;
+    var nextCurrentIndex = 0;
+    var top = 0;
+    var maxIndex = Math.max(props.data.length - rowsInView, 0);
+    for (var i = 0; i <= maxIndex; i++) {
+      sum += context.cachedHeight[i] || lineHeight;
+      if (scrollTop < sum || i === maxIndex) {
+        nextCurrentIndex = i;
+        var beforeHeight = i === 0 ? 0 : sum - (context.cachedHeight[i] || lineHeight);
+        top = scrollTop - beforeHeight;
+        break;
+      }
+    }
+    if (nextCurrentIndex !== startIndex) {
+      setCurrentIndex(nextCurrentIndex);
+    }
+    setTop(top);
+  };
   var handleScrollByStep = usePersistFn(function (step, top) {
     var _wrapperRef$current;
-    var next = currentIndex + step;
+    var next = startIndex + step;
     (_wrapperRef$current = wrapperRef.current) === null || _wrapperRef$current === void 0 || _wrapperRef$current.scrollTo({
       top: next * lineHeight + (top || 0)
     });
@@ -61,21 +141,36 @@ var VirtualList = function VirtualList(props) {
   };
   var handleScroll = function handleScroll(info) {
     var _props$onScroll;
-    var current = Math.floor(info.scrollTop / lineHeight);
-    var top = info.scrollTop - current * lineHeight;
+    var scrollLeft = info.scrollLeft,
+      height = info.height,
+      y = info.y,
+      fromDrag = info.fromDrag;
+    var scrollTop = info.scrollTop;
+    context.shouldUpdateHeight = !fromDrag;
+    var sumHeight = getContentHeight(props.data.length - 1);
+    var max = sumHeight - height;
+    if (scrollTop > max) {
+      scrollTop = max;
+    }
+    if (fromDrag) {
+      var _top2 = y * max;
+      updateIndexAndTopFromTop(_top2);
+      if (context.rateTimer) clearTimeout(context.rateTimer);
+      context.rateTimer = setTimeout(function () {
+        updateRateScroll(y);
+      }, 120);
+    } else {
+      updateIndexAndTopFromTop(scrollTop);
+    }
     (_props$onScroll = props.onScroll) === null || _props$onScroll === void 0 || _props$onScroll.call(props, info);
-    setTop(top);
-    setCurrentIndex(current);
   };
-  var scrollHeight = getScrollHeight();
   var renderList = function renderList() {
-    var start = currentIndex;
-    var end = currentIndex + rowsInView;
-    var items = data.slice(start, end);
+    var items = data.slice(startIndex, startIndex + rowsInView);
     var Tag = tag;
     var shouldScroll = data.length * lineHeight > height;
     var nextStyle = _objectSpread({}, style);
     if (shouldScroll) nextStyle.height = height;
+    var scrollHeight = getContentHeight(data.length - 1);
     return /*#__PURE__*/_jsx(Scroll, {
       className: className,
       style: nextStyle,
@@ -96,16 +191,48 @@ var VirtualList = function VirtualList(props) {
         children: items.map(function (d, i) {
           if (d[groupKey]) {
             return /*#__PURE__*/_jsx(React.Fragment, {
-              children: customRenderItem(d, currentIndex + i, i)
+              children: customRenderItem(d, startIndex + i, i)
             }, i);
           }
           return /*#__PURE__*/_jsx(React.Fragment, {
-            children: renderItem(d, currentIndex + i, i)
-          }, i);
+            children: renderItem(d, startIndex + i, i, setRowHeight)
+          }, dynamicVirtual ? startIndex + i : i);
         })
       })
     });
   };
+  useEffect(function () {
+    setHeight(getContentHeight(props.data.length - 1));
+  }, [data.length]);
+  useEffect(function () {
+    if (offsetY) {
+      // if (wrapperRef.current && props.innerRef.current) {
+      if (wrapperRef.current) {
+        setOffsetY(0);
+        setTop(function (s) {
+          return s + offsetY;
+        });
+        wrapperRef.current.scrollTop += offsetY;
+      }
+    }
+  }, [offsetY, startIndex]);
+  useEffect(function () {
+    // 数据变化的时候清空掉 preIndex, 如果之前有缓存的index, setRowHeight 会有问题
+    return function () {
+      context.preIndex = null;
+    };
+  }, [props.data]);
+  useEffect(function () {
+    if (context.heightCallback) {
+      var cb = context.heightCallback;
+      context.heightCallback = null;
+      cb();
+    }
+  }, [scrollHeight]);
+  useEffect(function () {
+    // 记录preIndex
+    context.preIndex = startIndex;
+  }, [startIndex]);
   useEffect(function () {
     if (virtualRef !== null && virtualRef !== void 0 && virtualRef.current) {
       virtualRef.current.scrollByStep = handleScrollByStep;

package/esm/virtual-scroll/virtual-scroll-list.type.d.ts

@@ -21,6 +21,7 @@ export interface VirtualListProps<DataItem> extends Pick<CommonType, 'className'
     tagClassName?: string;
     virtualRef?: React.MutableRefObject<VirtualListType>;
     scrollerStyle?: React.CSSProperties;
+    dynamicVirtual?: boolean;
     onControlTypeChange?: React.Dispatch<React.SetStateAction<'mouse' | 'keyboard'>>;
     onScroll?: (info: {
         scrollLeft: number;

package/esm/virtual-scroll/virtual-scroll-list.type.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"virtual-scroll-list.type.d.ts","sourceRoot":"","sources":["virtual-scroll-list.type.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAC5C,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAE3C,MAAM,MAAM,eAAe,GAAG;IAC5B,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,GAAG,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IACpD,eAAe,CAAC,EAAE,MAAM,MAAM,CAAC;IAC/B,MAAM,CAAC,EAAE,MAAM,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,MAAM,MAAM,CAAC;CAC9B,CAAC;AAEF,MAAM,WAAW,gBAAgB,CAAC,QAAQ,CAAE,SAAQ,IAAI,CAAC,UAAU,EAAE,WAAW,GAAG,OAAO,CAAC;IACzF,IAAI,EAAE,QAAQ,EAAE,CAAC;IACjB,MAAM,CAAC,EAAE,UAAU,CAAC,QAAQ,CAAC,CAAC;IAE9B,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,UAAU,EAAE,GAAG,CAAC;IAChB,gBAAgB,CAAC,EAAE,GAAG,CAAC;IACvB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,GAAG,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC;IACjC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,UAAU,CAAC,EAAE,KAAK,CAAC,gBAAgB,CAAC,eAAe,CAAC,CAAC;IACrD,aAAa,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAEpC,mBAAmB,CAAC,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,GAAG,UAAU,CAAC,CAAC,CAAC;IACjF,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE;QAChB,UAAU,EAAE,MAAM,CAAC;QACnB,SAAS,EAAE,MAAM,CAAC;QAClB,CAAC,EAAE,MAAM,CAAC;QACV,CAAC,EAAE,MAAM,CAAC;QACV,QAAQ,EAAE,OAAO,CAAC;QAClB,MAAM,EAAE,MAAM,CAAC;QACf,KAAK,EAAE,MAAM,CAAC;KACf,KAAK,IAAI,CAAC;CACZ"}
+{"version":3,"file":"virtual-scroll-list.type.d.ts","sourceRoot":"","sources":["virtual-scroll-list.type.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAC5C,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAE3C,MAAM,MAAM,eAAe,GAAG;IAC5B,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,GAAG,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IACpD,eAAe,CAAC,EAAE,MAAM,MAAM,CAAC;IAC/B,MAAM,CAAC,EAAE,MAAM,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,MAAM,MAAM,CAAC;CAC9B,CAAC;AAEF,MAAM,WAAW,gBAAgB,CAAC,QAAQ,CAAE,SAAQ,IAAI,CAAC,UAAU,EAAE,WAAW,GAAG,OAAO,CAAC;IACzF,IAAI,EAAE,QAAQ,EAAE,CAAC;IACjB,MAAM,CAAC,EAAE,UAAU,CAAC,QAAQ,CAAC,CAAC;IAE9B,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,UAAU,EAAE,GAAG,CAAC;IAChB,gBAAgB,CAAC,EAAE,GAAG,CAAC;IACvB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,GAAG,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC;IACjC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,UAAU,CAAC,EAAE,KAAK,CAAC,gBAAgB,CAAC,eAAe,CAAC,CAAC;IACrD,aAAa,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAEpC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,mBAAmB,CAAC,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,GAAG,UAAU,CAAC,CAAC,CAAC;IACjF,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE;QAChB,UAAU,EAAE,MAAM,CAAC;QACnB,SAAS,EAAE,MAAM,CAAC;QAClB,CAAC,EAAE,MAAM,CAAC;QACV,CAAC,EAAE,MAAM,CAAC;QACV,QAAQ,EAAE,OAAO,CAAC;QAClB,MAAM,EAAE,MAAM,CAAC;QACf,KAAK,EAAE,MAAM,CAAC;KACf,KAAK,IAAI,CAAC;CACZ"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sheinx/base",
-  "version": "3.4.0-beta.3",
+  "version": "3.4.0-beta.5",
   "description": "",
   "keywords": [],
   "license": "MIT",
@@ -10,7 +10,7 @@
   "module": "./esm/index.js",
   "typings": "./cjs/index.d.ts",
   "dependencies": {
-    "@sheinx/hooks": "3.4.0-beta.3",
+    "@sheinx/hooks": "3.4.0-beta.5",
     "immer": "^10.0.0",
     "classnames": "^2.0.0",
     "@shined/reactive": "^0.1.3-alpha.0"