@sheinx/base 3.4.0-beta.4 → 3.4.0-beta.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/cjs/absolute-list/absolute-list.d.ts.map +1 -1
- package/cjs/absolute-list/absolute-list.js +25 -14
- package/cjs/absolute-list/absolute-list.type.d.ts +4 -0
- package/cjs/absolute-list/absolute-list.type.d.ts.map +1 -1
- package/cjs/cascader/cascader.js +2 -2
- package/cjs/checkbox/checkbox-group.d.ts.map +1 -1
- package/cjs/checkbox/checkbox-group.js +4 -0
- package/cjs/date-picker/date-picker.d.ts.map +1 -1
- package/cjs/date-picker/date-picker.js +12 -4
- package/cjs/date-picker/date-picker.type.d.ts +8 -0
- package/cjs/date-picker/date-picker.type.d.ts.map +1 -1
- package/cjs/date-picker/day.d.ts.map +1 -1
- package/cjs/date-picker/day.js +8 -3
- package/cjs/date-picker/day.type.d.ts +3 -0
- package/cjs/date-picker/day.type.d.ts.map +1 -1
- package/cjs/date-picker/picker.d.ts.map +1 -1
- package/cjs/date-picker/picker.js +7 -2
- package/cjs/date-picker/picker.type.d.ts +2 -0
- package/cjs/date-picker/picker.type.d.ts.map +1 -1
- package/cjs/date-picker/quick.d.ts.map +1 -1
- package/cjs/date-picker/quick.js +23 -5
- package/cjs/date-picker/quick.type.d.ts +1 -0
- package/cjs/date-picker/quick.type.d.ts.map +1 -1
- package/cjs/form/form-footer-context.d.ts.map +1 -1
- package/cjs/form/form-footer-context.js +6 -2
- package/cjs/form/form.d.ts.map +1 -1
- package/cjs/form/form.js +3 -1
- package/cjs/select/list-columns.js +1 -1
- package/cjs/select/list-option.d.ts.map +1 -1
- package/cjs/select/list-option.js +23 -3
- package/cjs/select/list-option.type.d.ts +2 -0
- package/cjs/select/list-option.type.d.ts.map +1 -1
- package/cjs/select/list.d.ts.map +1 -1
- package/cjs/select/list.js +7 -13
- package/cjs/select/result-more.d.ts +2 -2
- package/cjs/select/result-more.d.ts.map +1 -1
- package/cjs/select/result-more.js +2 -2
- package/cjs/select/result-more.type.d.ts +1 -1
- package/cjs/select/result-more.type.d.ts.map +1 -1
- package/cjs/select/select.type.d.ts +6 -3
- package/cjs/select/select.type.d.ts.map +1 -1
- package/cjs/table/table.d.ts.map +1 -1
- package/cjs/table/table.js +2 -2
- package/cjs/table/table.type.d.ts +6 -5
- package/cjs/table/table.type.d.ts.map +1 -1
- package/cjs/table/tbody.d.ts.map +1 -1
- package/cjs/table/tbody.js +1 -0
- package/cjs/table/tr.d.ts +1 -0
- package/cjs/table/tr.d.ts.map +1 -1
- package/cjs/table/tr.js +9 -6
- package/cjs/tabs/tabs.d.ts.map +1 -1
- package/cjs/tabs/tabs.js +13 -14
- package/cjs/tag/tag.js +2 -2
- package/cjs/tag/use-tag.js +2 -2
- package/cjs/tooltip/tooltip.d.ts.map +1 -1
- package/cjs/tooltip/tooltip.js +18 -6
- package/cjs/tooltip/tooltip.type.d.ts +4 -0
- package/cjs/tooltip/tooltip.type.d.ts.map +1 -1
- package/cjs/virtual-scroll/scroll.d.ts.map +1 -1
- package/cjs/virtual-scroll/scroll.js +11 -1
- package/cjs/virtual-scroll/virtual-scroll-list.d.ts.map +1 -1
- package/cjs/virtual-scroll/virtual-scroll-list.js +147 -20
- package/cjs/virtual-scroll/virtual-scroll-list.type.d.ts +1 -0
- package/cjs/virtual-scroll/virtual-scroll-list.type.d.ts.map +1 -1
- package/esm/absolute-list/absolute-list.d.ts.map +1 -1
- package/esm/absolute-list/absolute-list.js +25 -14
- package/esm/absolute-list/absolute-list.type.d.ts +4 -0
- package/esm/absolute-list/absolute-list.type.d.ts.map +1 -1
- package/esm/cascader/cascader.js +2 -2
- package/esm/checkbox/checkbox-group.d.ts.map +1 -1
- package/esm/checkbox/checkbox-group.js +6 -2
- package/esm/date-picker/date-picker.d.ts.map +1 -1
- package/esm/date-picker/date-picker.js +12 -4
- package/esm/date-picker/date-picker.type.d.ts +8 -0
- package/esm/date-picker/date-picker.type.d.ts.map +1 -1
- package/esm/date-picker/day.d.ts.map +1 -1
- package/esm/date-picker/day.js +8 -3
- package/esm/date-picker/day.type.d.ts +3 -0
- package/esm/date-picker/day.type.d.ts.map +1 -1
- package/esm/date-picker/picker.d.ts.map +1 -1
- package/esm/date-picker/picker.js +7 -2
- package/esm/date-picker/picker.type.d.ts +2 -0
- package/esm/date-picker/picker.type.d.ts.map +1 -1
- package/esm/date-picker/quick.d.ts.map +1 -1
- package/esm/date-picker/quick.js +20 -5
- package/esm/date-picker/quick.type.d.ts +1 -0
- package/esm/date-picker/quick.type.d.ts.map +1 -1
- package/esm/form/form-footer-context.d.ts.map +1 -1
- package/esm/form/form-footer-context.js +6 -2
- package/esm/form/form.d.ts.map +1 -1
- package/esm/form/form.js +3 -1
- package/esm/select/list-columns.js +1 -1
- package/esm/select/list-option.d.ts.map +1 -1
- package/esm/select/list-option.js +23 -3
- package/esm/select/list-option.type.d.ts +2 -0
- package/esm/select/list-option.type.d.ts.map +1 -1
- package/esm/select/list.d.ts.map +1 -1
- package/esm/select/list.js +7 -13
- package/esm/select/result-more.d.ts +2 -2
- package/esm/select/result-more.d.ts.map +1 -1
- package/esm/select/result-more.js +2 -2
- package/esm/select/result-more.type.d.ts +1 -1
- package/esm/select/result-more.type.d.ts.map +1 -1
- package/esm/select/select.type.d.ts +6 -3
- package/esm/select/select.type.d.ts.map +1 -1
- package/esm/table/table.d.ts.map +1 -1
- package/esm/table/table.js +2 -2
- package/esm/table/table.type.d.ts +6 -5
- package/esm/table/table.type.d.ts.map +1 -1
- package/esm/table/tbody.d.ts.map +1 -1
- package/esm/table/tbody.js +1 -0
- package/esm/table/tr.d.ts +1 -0
- package/esm/table/tr.d.ts.map +1 -1
- package/esm/table/tr.js +9 -6
- package/esm/tabs/tabs.d.ts.map +1 -1
- package/esm/tabs/tabs.js +13 -14
- package/esm/tag/tag.js +2 -2
- package/esm/tag/use-tag.js +2 -2
- package/esm/tooltip/tooltip.d.ts.map +1 -1
- package/esm/tooltip/tooltip.js +20 -8
- package/esm/tooltip/tooltip.type.d.ts +4 -0
- package/esm/tooltip/tooltip.type.d.ts.map +1 -1
- package/esm/virtual-scroll/scroll.d.ts.map +1 -1
- package/esm/virtual-scroll/scroll.js +12 -2
- package/esm/virtual-scroll/virtual-scroll-list.d.ts.map +1 -1
- package/esm/virtual-scroll/virtual-scroll-list.js +147 -20
- package/esm/virtual-scroll/virtual-scroll-list.type.d.ts +1 -0
- package/esm/virtual-scroll/virtual-scroll-list.type.d.ts.map +1 -1
- package/package.json +2 -2
package/esm/tooltip/tooltip.js
CHANGED
|
@@ -6,12 +6,12 @@ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol"
|
|
|
6
6
|
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); }
|
|
7
7
|
import { usePopup, util } from '@sheinx/hooks';
|
|
8
8
|
import classNames from 'classnames';
|
|
9
|
-
import React, { cloneElement, isValidElement } from 'react';
|
|
9
|
+
import React, { cloneElement, isValidElement, useRef } from 'react';
|
|
10
10
|
import AbsoluteList from "../absolute-list";
|
|
11
11
|
import { useConfig } from "../config";
|
|
12
12
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
13
|
-
import { Fragment as _Fragment } from "react/jsx-runtime";
|
|
14
13
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
14
|
+
import { Fragment as _Fragment } from "react/jsx-runtime";
|
|
15
15
|
var defaultDelay = 0;
|
|
16
16
|
var Tooltip = function Tooltip(props) {
|
|
17
17
|
var _jssStyle$tooltip;
|
|
@@ -28,7 +28,8 @@ var Tooltip = function Tooltip(props) {
|
|
|
28
28
|
_props$type = props.type,
|
|
29
29
|
type = _props$type === void 0 ? 'default' : _props$type,
|
|
30
30
|
_props$position = props.position,
|
|
31
|
-
popsitionProps = _props$position === void 0 ? '
|
|
31
|
+
popsitionProps = _props$position === void 0 ? 'auto' : _props$position;
|
|
32
|
+
var arrowStyleRef = useRef({});
|
|
32
33
|
var tooltipClasses = jssStyle === null || jssStyle === void 0 || (_jssStyle$tooltip = jssStyle.tooltip) === null || _jssStyle$tooltip === void 0 ? void 0 : _jssStyle$tooltip.call(jssStyle);
|
|
33
34
|
var config = useConfig();
|
|
34
35
|
var childrenProps = /*#__PURE__*/isValidElement(children) ? children === null || children === void 0 ? void 0 : children.props : {};
|
|
@@ -45,7 +46,8 @@ var Tooltip = function Tooltip(props) {
|
|
|
45
46
|
position = _usePopup.position,
|
|
46
47
|
getTargetProps = _usePopup.getTargetProps,
|
|
47
48
|
targetRef = _usePopup.targetRef,
|
|
48
|
-
popupRef = _usePopup.popupRef
|
|
49
|
+
popupRef = _usePopup.popupRef,
|
|
50
|
+
arrowRef = _usePopup.arrowRef;
|
|
49
51
|
if (! /*#__PURE__*/isValidElement(children)) {
|
|
50
52
|
console.error(new Error('Tooltip children expect a single ReactElement.'));
|
|
51
53
|
return null;
|
|
@@ -76,12 +78,16 @@ var Tooltip = function Tooltip(props) {
|
|
|
76
78
|
focus: open,
|
|
77
79
|
parentElRef: targetRef,
|
|
78
80
|
popupElRef: popupRef,
|
|
81
|
+
arrowRef: arrowRef,
|
|
79
82
|
absolute: true,
|
|
83
|
+
adjust: popsitionProps === 'auto',
|
|
80
84
|
position: position,
|
|
81
85
|
fixedWidth: false,
|
|
82
|
-
popupGap: 0
|
|
86
|
+
popupGap: 0
|
|
87
|
+
// arrowStyleRef={arrowStyleRef}
|
|
88
|
+
,
|
|
83
89
|
zIndex: zIndex,
|
|
84
|
-
children: /*#__PURE__*/
|
|
90
|
+
children: /*#__PURE__*/_jsxs("div", _objectSpread(_objectSpread({
|
|
85
91
|
className: classNames(className, tooltipClasses === null || tooltipClasses === void 0 ? void 0 : tooltipClasses.wrapper, open && (tooltipClasses === null || tooltipClasses === void 0 ? void 0 : tooltipClasses.wrapperOpen))
|
|
86
92
|
}, util.getDataAttribute({
|
|
87
93
|
type: type,
|
|
@@ -90,11 +96,17 @@ var Tooltip = function Tooltip(props) {
|
|
|
90
96
|
ref: popupRef,
|
|
91
97
|
onMouseLeave: events.onMouseLeave,
|
|
92
98
|
dir: config.direction,
|
|
93
|
-
children: /*#__PURE__*/_jsx("
|
|
99
|
+
children: [/*#__PURE__*/_jsx("span", _objectSpread({
|
|
100
|
+
ref: arrowRef,
|
|
101
|
+
style: arrowStyleRef.current,
|
|
102
|
+
className: tooltipClasses === null || tooltipClasses === void 0 ? void 0 : tooltipClasses.arrow
|
|
103
|
+
}, util.getDataAttribute({
|
|
104
|
+
role: 'arrow'
|
|
105
|
+
}))), /*#__PURE__*/_jsx("div", {
|
|
94
106
|
style: style,
|
|
95
107
|
className: classNames(tooltipClasses === null || tooltipClasses === void 0 ? void 0 : tooltipClasses.content),
|
|
96
108
|
children: tip
|
|
97
|
-
})
|
|
109
|
+
})]
|
|
98
110
|
}))
|
|
99
111
|
})]
|
|
100
112
|
});
|
|
@@ -18,6 +18,10 @@ export interface TooltipClasses {
|
|
|
18
18
|
* 弹出层内容
|
|
19
19
|
*/
|
|
20
20
|
content: string;
|
|
21
|
+
/**
|
|
22
|
+
* 箭头
|
|
23
|
+
*/
|
|
24
|
+
arrow: string;
|
|
21
25
|
}
|
|
22
26
|
export interface TooltipProps extends Pick<BasePopupProps, 'trigger' | 'position' | 'priorityDirection'>, Pick<CommonType, 'className' | 'style'> {
|
|
23
27
|
/**
|
|
@@ -1 +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;
|
|
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;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"}
|
|
@@ -1 +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,
|
|
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,gBAmIjC,CAAC;AAEF,eAAe,MAAM,CAAC"}
|
|
@@ -5,12 +5,14 @@ function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key i
|
|
|
5
5
|
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
|
|
6
6
|
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); }
|
|
7
7
|
import React, { useRef } from 'react';
|
|
8
|
-
import { usePersistFn, useResize, util } from '@sheinx/hooks';
|
|
8
|
+
import { useForkRef, usePersistFn, useResize, util } from '@sheinx/hooks';
|
|
9
9
|
import { useConfig } from "../config";
|
|
10
10
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
11
11
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
12
12
|
var Scroll = function Scroll(props) {
|
|
13
13
|
var containerRef = useRef(null);
|
|
14
|
+
var scrollRef = useRef(null);
|
|
15
|
+
var wrapperRef = useForkRef(scrollRef, props.wrapperRef);
|
|
14
16
|
var _useRef = useRef({
|
|
15
17
|
timer: null,
|
|
16
18
|
isMouseDown: false,
|
|
@@ -100,6 +102,13 @@ var Scroll = function Scroll(props) {
|
|
|
100
102
|
fromDrag: context.isMouseDown
|
|
101
103
|
});
|
|
102
104
|
});
|
|
105
|
+
var handleInnerScroll = usePersistFn(function (e) {
|
|
106
|
+
var scrollTop = e.currentTarget.scrollTop;
|
|
107
|
+
if (scrollRef.current) {
|
|
108
|
+
e.currentTarget.scrollTop = 0;
|
|
109
|
+
scrollRef.current.scrollTop += scrollTop;
|
|
110
|
+
}
|
|
111
|
+
});
|
|
103
112
|
return /*#__PURE__*/_jsx("div", {
|
|
104
113
|
className: props.className,
|
|
105
114
|
style: props.style,
|
|
@@ -109,7 +118,7 @@ var Scroll = function Scroll(props) {
|
|
|
109
118
|
})), {}, {
|
|
110
119
|
style: scrollerStyle,
|
|
111
120
|
onScroll: handleScroll,
|
|
112
|
-
ref:
|
|
121
|
+
ref: wrapperRef,
|
|
113
122
|
onMouseDown: function onMouseDown() {
|
|
114
123
|
context.isMouseDown = true;
|
|
115
124
|
},
|
|
@@ -121,6 +130,7 @@ var Scroll = function Scroll(props) {
|
|
|
121
130
|
})), {}, {
|
|
122
131
|
style: containerStyle,
|
|
123
132
|
ref: containerRef,
|
|
133
|
+
onScroll: handleInnerScroll,
|
|
124
134
|
children: /*#__PURE__*/_jsx("div", {
|
|
125
135
|
style: _objectSpread({
|
|
126
136
|
flexGrow: 1
|
|
@@ -1 +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,
|
|
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,8DAsPhB,CAAC;AAEF,eAAe,WAAW,CAAC"}
|
|
@@ -28,30 +28,110 @@ var VirtualList = function VirtualList(props) {
|
|
|
28
28
|
_props$tag = props.tag,
|
|
29
29
|
tag = _props$tag === void 0 ? 'div' : _props$tag,
|
|
30
30
|
tagClassName = props.tagClassName,
|
|
31
|
+
dynamicVirtual = props.dynamicVirtual,
|
|
31
32
|
virtualRef = props.virtualRef,
|
|
32
33
|
onControlTypeChange = props.onControlTypeChange;
|
|
33
34
|
var _useState = useState(0),
|
|
34
35
|
_useState2 = _slicedToArray(_useState, 2),
|
|
35
|
-
|
|
36
|
-
|
|
36
|
+
top = _useState2[0],
|
|
37
|
+
setTop = _useState2[1];
|
|
37
38
|
var _useState3 = useState(0),
|
|
38
39
|
_useState4 = _slicedToArray(_useState3, 2),
|
|
39
|
-
|
|
40
|
-
|
|
40
|
+
offsetY = _useState4[0],
|
|
41
|
+
setOffsetY = _useState4[1];
|
|
42
|
+
var _useState5 = useState(props.data.length * lineHeight),
|
|
43
|
+
_useState6 = _slicedToArray(_useState5, 2),
|
|
44
|
+
scrollHeight = _useState6[0],
|
|
45
|
+
setHeight = _useState6[1];
|
|
46
|
+
var _useState7 = useState(0),
|
|
47
|
+
_useState8 = _slicedToArray(_useState7, 2),
|
|
48
|
+
startIndex = _useState8[0],
|
|
49
|
+
setCurrentIndex = _useState8[1];
|
|
41
50
|
var wrapperRef = useRef(null);
|
|
42
|
-
var
|
|
43
|
-
|
|
44
|
-
|
|
51
|
+
var _useRef = useRef({
|
|
52
|
+
cachedHeight: [],
|
|
53
|
+
controlScrollRate: null,
|
|
54
|
+
heightCallback: null,
|
|
55
|
+
preIndex: null,
|
|
56
|
+
topTimer: null,
|
|
57
|
+
rateTimer: null,
|
|
58
|
+
shouldUpdateHeight: true
|
|
59
|
+
}),
|
|
60
|
+
context = _useRef.current;
|
|
61
|
+
var getContentHeight = function getContentHeight(index) {
|
|
62
|
+
var sum = 0;
|
|
63
|
+
for (var i = 0; i <= index; i++) {
|
|
64
|
+
sum += context.cachedHeight[i] || lineHeight;
|
|
65
|
+
}
|
|
66
|
+
return sum;
|
|
45
67
|
};
|
|
46
68
|
var getCurrentIndex = usePersistFn(function () {
|
|
47
|
-
return
|
|
69
|
+
return startIndex;
|
|
48
70
|
});
|
|
49
71
|
var getTop = usePersistFn(function () {
|
|
50
72
|
return top;
|
|
51
73
|
});
|
|
74
|
+
var setRowHeight = usePersistFn(function (index, height) {
|
|
75
|
+
var beforeHeight = context.cachedHeight[index];
|
|
76
|
+
if (beforeHeight && beforeHeight === height) return;
|
|
77
|
+
context.cachedHeight[index] = height;
|
|
78
|
+
if (context.shouldUpdateHeight) {
|
|
79
|
+
setHeight(getContentHeight(props.data.length - 1));
|
|
80
|
+
}
|
|
81
|
+
var preIndex = context.preIndex;
|
|
82
|
+
// 解决: 从下往上滚 由于高度变化会导致滚动条跳动
|
|
83
|
+
if (preIndex && preIndex > startIndex && startIndex === index) {
|
|
84
|
+
// 发生在顶部
|
|
85
|
+
if (context.heightCallback) return;
|
|
86
|
+
var offset = height - (beforeHeight || lineHeight);
|
|
87
|
+
setOffsetY(function (s) {
|
|
88
|
+
return s + offset;
|
|
89
|
+
});
|
|
90
|
+
}
|
|
91
|
+
});
|
|
92
|
+
var updateRateScroll = usePersistFn(function (rate) {
|
|
93
|
+
var sumHeight = getContentHeight(props.data.length - 1);
|
|
94
|
+
if (sumHeight === scrollHeight) return;
|
|
95
|
+
context.shouldUpdateHeight = true;
|
|
96
|
+
context.heightCallback = function () {
|
|
97
|
+
if (wrapperRef && wrapperRef.current) {
|
|
98
|
+
var _scrollHeight = wrapperRef.current.scrollHeight;
|
|
99
|
+
var clientHeight = wrapperRef.current.clientHeight;
|
|
100
|
+
var nowTop = wrapperRef.current.scrollTop;
|
|
101
|
+
var max = _scrollHeight - clientHeight;
|
|
102
|
+
var _top = rate * max;
|
|
103
|
+
if (Math.abs(nowTop - _top) < 1) {
|
|
104
|
+
context.controlScrollRate = null;
|
|
105
|
+
} else {
|
|
106
|
+
context.controlScrollRate = rate;
|
|
107
|
+
wrapperRef.current.scrollTop = _top;
|
|
108
|
+
}
|
|
109
|
+
}
|
|
110
|
+
};
|
|
111
|
+
setHeight(sumHeight);
|
|
112
|
+
});
|
|
113
|
+
var updateIndexAndTopFromTop = function updateIndexAndTopFromTop(scrollTop) {
|
|
114
|
+
var sum = 0;
|
|
115
|
+
var nextCurrentIndex = 0;
|
|
116
|
+
var top = 0;
|
|
117
|
+
var maxIndex = Math.max(props.data.length - rowsInView, 0);
|
|
118
|
+
for (var i = 0; i <= maxIndex; i++) {
|
|
119
|
+
sum += context.cachedHeight[i] || lineHeight;
|
|
120
|
+
if (scrollTop < sum || i === maxIndex) {
|
|
121
|
+
nextCurrentIndex = i;
|
|
122
|
+
var beforeHeight = i === 0 ? 0 : sum - (context.cachedHeight[i] || lineHeight);
|
|
123
|
+
top = scrollTop - beforeHeight;
|
|
124
|
+
break;
|
|
125
|
+
}
|
|
126
|
+
}
|
|
127
|
+
if (nextCurrentIndex !== startIndex) {
|
|
128
|
+
setCurrentIndex(nextCurrentIndex);
|
|
129
|
+
}
|
|
130
|
+
setTop(top);
|
|
131
|
+
};
|
|
52
132
|
var handleScrollByStep = usePersistFn(function (step, top) {
|
|
53
133
|
var _wrapperRef$current;
|
|
54
|
-
var next =
|
|
134
|
+
var next = startIndex + step;
|
|
55
135
|
(_wrapperRef$current = wrapperRef.current) === null || _wrapperRef$current === void 0 || _wrapperRef$current.scrollTo({
|
|
56
136
|
top: next * lineHeight + (top || 0)
|
|
57
137
|
});
|
|
@@ -61,21 +141,36 @@ var VirtualList = function VirtualList(props) {
|
|
|
61
141
|
};
|
|
62
142
|
var handleScroll = function handleScroll(info) {
|
|
63
143
|
var _props$onScroll;
|
|
64
|
-
var
|
|
65
|
-
|
|
144
|
+
var scrollLeft = info.scrollLeft,
|
|
145
|
+
height = info.height,
|
|
146
|
+
y = info.y,
|
|
147
|
+
fromDrag = info.fromDrag;
|
|
148
|
+
var scrollTop = info.scrollTop;
|
|
149
|
+
context.shouldUpdateHeight = !fromDrag;
|
|
150
|
+
var sumHeight = getContentHeight(props.data.length - 1);
|
|
151
|
+
var max = sumHeight - height;
|
|
152
|
+
if (scrollTop > max) {
|
|
153
|
+
scrollTop = max;
|
|
154
|
+
}
|
|
155
|
+
if (fromDrag) {
|
|
156
|
+
var _top2 = y * max;
|
|
157
|
+
updateIndexAndTopFromTop(_top2);
|
|
158
|
+
if (context.rateTimer) clearTimeout(context.rateTimer);
|
|
159
|
+
context.rateTimer = setTimeout(function () {
|
|
160
|
+
updateRateScroll(y);
|
|
161
|
+
}, 120);
|
|
162
|
+
} else {
|
|
163
|
+
updateIndexAndTopFromTop(scrollTop);
|
|
164
|
+
}
|
|
66
165
|
(_props$onScroll = props.onScroll) === null || _props$onScroll === void 0 || _props$onScroll.call(props, info);
|
|
67
|
-
setTop(top);
|
|
68
|
-
setCurrentIndex(current);
|
|
69
166
|
};
|
|
70
|
-
var scrollHeight = getScrollHeight();
|
|
71
167
|
var renderList = function renderList() {
|
|
72
|
-
var
|
|
73
|
-
var end = currentIndex + rowsInView;
|
|
74
|
-
var items = data.slice(start, end);
|
|
168
|
+
var items = data.slice(startIndex, startIndex + rowsInView);
|
|
75
169
|
var Tag = tag;
|
|
76
170
|
var shouldScroll = data.length * lineHeight > height;
|
|
77
171
|
var nextStyle = _objectSpread({}, style);
|
|
78
172
|
if (shouldScroll) nextStyle.height = height;
|
|
173
|
+
var scrollHeight = getContentHeight(data.length - 1);
|
|
79
174
|
return /*#__PURE__*/_jsx(Scroll, {
|
|
80
175
|
className: className,
|
|
81
176
|
style: nextStyle,
|
|
@@ -96,16 +191,48 @@ var VirtualList = function VirtualList(props) {
|
|
|
96
191
|
children: items.map(function (d, i) {
|
|
97
192
|
if (d[groupKey]) {
|
|
98
193
|
return /*#__PURE__*/_jsx(React.Fragment, {
|
|
99
|
-
children: customRenderItem(d,
|
|
194
|
+
children: customRenderItem(d, startIndex + i, i)
|
|
100
195
|
}, i);
|
|
101
196
|
}
|
|
102
197
|
return /*#__PURE__*/_jsx(React.Fragment, {
|
|
103
|
-
children: renderItem(d,
|
|
104
|
-
}, i);
|
|
198
|
+
children: renderItem(d, startIndex + i, i, setRowHeight)
|
|
199
|
+
}, dynamicVirtual ? startIndex + i : i);
|
|
105
200
|
})
|
|
106
201
|
})
|
|
107
202
|
});
|
|
108
203
|
};
|
|
204
|
+
useEffect(function () {
|
|
205
|
+
setHeight(getContentHeight(props.data.length - 1));
|
|
206
|
+
}, [data.length]);
|
|
207
|
+
useEffect(function () {
|
|
208
|
+
if (offsetY) {
|
|
209
|
+
// if (wrapperRef.current && props.innerRef.current) {
|
|
210
|
+
if (wrapperRef.current) {
|
|
211
|
+
setOffsetY(0);
|
|
212
|
+
setTop(function (s) {
|
|
213
|
+
return s + offsetY;
|
|
214
|
+
});
|
|
215
|
+
wrapperRef.current.scrollTop += offsetY;
|
|
216
|
+
}
|
|
217
|
+
}
|
|
218
|
+
}, [offsetY, startIndex]);
|
|
219
|
+
useEffect(function () {
|
|
220
|
+
// 数据变化的时候清空掉 preIndex, 如果之前有缓存的index, setRowHeight 会有问题
|
|
221
|
+
return function () {
|
|
222
|
+
context.preIndex = null;
|
|
223
|
+
};
|
|
224
|
+
}, [props.data]);
|
|
225
|
+
useEffect(function () {
|
|
226
|
+
if (context.heightCallback) {
|
|
227
|
+
var cb = context.heightCallback;
|
|
228
|
+
context.heightCallback = null;
|
|
229
|
+
cb();
|
|
230
|
+
}
|
|
231
|
+
}, [scrollHeight]);
|
|
232
|
+
useEffect(function () {
|
|
233
|
+
// 记录preIndex
|
|
234
|
+
context.preIndex = startIndex;
|
|
235
|
+
}, [startIndex]);
|
|
109
236
|
useEffect(function () {
|
|
110
237
|
if (virtualRef !== null && virtualRef !== void 0 && virtualRef.current) {
|
|
111
238
|
virtualRef.current.scrollByStep = handleScrollByStep;
|
|
@@ -21,6 +21,7 @@ export interface VirtualListProps<DataItem> extends Pick<CommonType, 'className'
|
|
|
21
21
|
tagClassName?: string;
|
|
22
22
|
virtualRef?: React.MutableRefObject<VirtualListType>;
|
|
23
23
|
scrollerStyle?: React.CSSProperties;
|
|
24
|
+
dynamicVirtual?: boolean;
|
|
24
25
|
onControlTypeChange?: React.Dispatch<React.SetStateAction<'mouse' | 'keyboard'>>;
|
|
25
26
|
onScroll?: (info: {
|
|
26
27
|
scrollLeft: number;
|
|
@@ -1 +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"}
|
|
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,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
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@sheinx/base",
|
|
3
|
-
"version": "3.4.0-beta.
|
|
3
|
+
"version": "3.4.0-beta.5",
|
|
4
4
|
"description": "",
|
|
5
5
|
"keywords": [],
|
|
6
6
|
"license": "MIT",
|
|
@@ -10,7 +10,7 @@
|
|
|
10
10
|
"module": "./esm/index.js",
|
|
11
11
|
"typings": "./cjs/index.d.ts",
|
|
12
12
|
"dependencies": {
|
|
13
|
-
"@sheinx/hooks": "3.4.0-beta.
|
|
13
|
+
"@sheinx/hooks": "3.4.0-beta.5",
|
|
14
14
|
"immer": "^10.0.0",
|
|
15
15
|
"classnames": "^2.0.0",
|
|
16
16
|
"@shined/reactive": "^0.1.3-alpha.0"
|