@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.
Files changed (129) hide show
  1. package/cjs/absolute-list/absolute-list.d.ts.map +1 -1
  2. package/cjs/absolute-list/absolute-list.js +25 -14
  3. package/cjs/absolute-list/absolute-list.type.d.ts +4 -0
  4. package/cjs/absolute-list/absolute-list.type.d.ts.map +1 -1
  5. package/cjs/cascader/cascader.js +2 -2
  6. package/cjs/checkbox/checkbox-group.d.ts.map +1 -1
  7. package/cjs/checkbox/checkbox-group.js +4 -0
  8. package/cjs/date-picker/date-picker.d.ts.map +1 -1
  9. package/cjs/date-picker/date-picker.js +12 -4
  10. package/cjs/date-picker/date-picker.type.d.ts +8 -0
  11. package/cjs/date-picker/date-picker.type.d.ts.map +1 -1
  12. package/cjs/date-picker/day.d.ts.map +1 -1
  13. package/cjs/date-picker/day.js +8 -3
  14. package/cjs/date-picker/day.type.d.ts +3 -0
  15. package/cjs/date-picker/day.type.d.ts.map +1 -1
  16. package/cjs/date-picker/picker.d.ts.map +1 -1
  17. package/cjs/date-picker/picker.js +7 -2
  18. package/cjs/date-picker/picker.type.d.ts +2 -0
  19. package/cjs/date-picker/picker.type.d.ts.map +1 -1
  20. package/cjs/date-picker/quick.d.ts.map +1 -1
  21. package/cjs/date-picker/quick.js +23 -5
  22. package/cjs/date-picker/quick.type.d.ts +1 -0
  23. package/cjs/date-picker/quick.type.d.ts.map +1 -1
  24. package/cjs/form/form-footer-context.d.ts.map +1 -1
  25. package/cjs/form/form-footer-context.js +6 -2
  26. package/cjs/form/form.d.ts.map +1 -1
  27. package/cjs/form/form.js +3 -1
  28. package/cjs/select/list-columns.js +1 -1
  29. package/cjs/select/list-option.d.ts.map +1 -1
  30. package/cjs/select/list-option.js +23 -3
  31. package/cjs/select/list-option.type.d.ts +2 -0
  32. package/cjs/select/list-option.type.d.ts.map +1 -1
  33. package/cjs/select/list.d.ts.map +1 -1
  34. package/cjs/select/list.js +7 -13
  35. package/cjs/select/result-more.d.ts +2 -2
  36. package/cjs/select/result-more.d.ts.map +1 -1
  37. package/cjs/select/result-more.js +2 -2
  38. package/cjs/select/result-more.type.d.ts +1 -1
  39. package/cjs/select/result-more.type.d.ts.map +1 -1
  40. package/cjs/select/select.type.d.ts +6 -3
  41. package/cjs/select/select.type.d.ts.map +1 -1
  42. package/cjs/table/table.d.ts.map +1 -1
  43. package/cjs/table/table.js +2 -2
  44. package/cjs/table/table.type.d.ts +6 -5
  45. package/cjs/table/table.type.d.ts.map +1 -1
  46. package/cjs/table/tbody.d.ts.map +1 -1
  47. package/cjs/table/tbody.js +1 -0
  48. package/cjs/table/tr.d.ts +1 -0
  49. package/cjs/table/tr.d.ts.map +1 -1
  50. package/cjs/table/tr.js +9 -6
  51. package/cjs/tabs/tabs.d.ts.map +1 -1
  52. package/cjs/tabs/tabs.js +13 -14
  53. package/cjs/tag/tag.js +2 -2
  54. package/cjs/tag/use-tag.js +2 -2
  55. package/cjs/tooltip/tooltip.d.ts.map +1 -1
  56. package/cjs/tooltip/tooltip.js +18 -6
  57. package/cjs/tooltip/tooltip.type.d.ts +4 -0
  58. package/cjs/tooltip/tooltip.type.d.ts.map +1 -1
  59. package/cjs/virtual-scroll/scroll.d.ts.map +1 -1
  60. package/cjs/virtual-scroll/scroll.js +11 -1
  61. package/cjs/virtual-scroll/virtual-scroll-list.d.ts.map +1 -1
  62. package/cjs/virtual-scroll/virtual-scroll-list.js +147 -20
  63. package/cjs/virtual-scroll/virtual-scroll-list.type.d.ts +1 -0
  64. package/cjs/virtual-scroll/virtual-scroll-list.type.d.ts.map +1 -1
  65. package/esm/absolute-list/absolute-list.d.ts.map +1 -1
  66. package/esm/absolute-list/absolute-list.js +25 -14
  67. package/esm/absolute-list/absolute-list.type.d.ts +4 -0
  68. package/esm/absolute-list/absolute-list.type.d.ts.map +1 -1
  69. package/esm/cascader/cascader.js +2 -2
  70. package/esm/checkbox/checkbox-group.d.ts.map +1 -1
  71. package/esm/checkbox/checkbox-group.js +6 -2
  72. package/esm/date-picker/date-picker.d.ts.map +1 -1
  73. package/esm/date-picker/date-picker.js +12 -4
  74. package/esm/date-picker/date-picker.type.d.ts +8 -0
  75. package/esm/date-picker/date-picker.type.d.ts.map +1 -1
  76. package/esm/date-picker/day.d.ts.map +1 -1
  77. package/esm/date-picker/day.js +8 -3
  78. package/esm/date-picker/day.type.d.ts +3 -0
  79. package/esm/date-picker/day.type.d.ts.map +1 -1
  80. package/esm/date-picker/picker.d.ts.map +1 -1
  81. package/esm/date-picker/picker.js +7 -2
  82. package/esm/date-picker/picker.type.d.ts +2 -0
  83. package/esm/date-picker/picker.type.d.ts.map +1 -1
  84. package/esm/date-picker/quick.d.ts.map +1 -1
  85. package/esm/date-picker/quick.js +20 -5
  86. package/esm/date-picker/quick.type.d.ts +1 -0
  87. package/esm/date-picker/quick.type.d.ts.map +1 -1
  88. package/esm/form/form-footer-context.d.ts.map +1 -1
  89. package/esm/form/form-footer-context.js +6 -2
  90. package/esm/form/form.d.ts.map +1 -1
  91. package/esm/form/form.js +3 -1
  92. package/esm/select/list-columns.js +1 -1
  93. package/esm/select/list-option.d.ts.map +1 -1
  94. package/esm/select/list-option.js +23 -3
  95. package/esm/select/list-option.type.d.ts +2 -0
  96. package/esm/select/list-option.type.d.ts.map +1 -1
  97. package/esm/select/list.d.ts.map +1 -1
  98. package/esm/select/list.js +7 -13
  99. package/esm/select/result-more.d.ts +2 -2
  100. package/esm/select/result-more.d.ts.map +1 -1
  101. package/esm/select/result-more.js +2 -2
  102. package/esm/select/result-more.type.d.ts +1 -1
  103. package/esm/select/result-more.type.d.ts.map +1 -1
  104. package/esm/select/select.type.d.ts +6 -3
  105. package/esm/select/select.type.d.ts.map +1 -1
  106. package/esm/table/table.d.ts.map +1 -1
  107. package/esm/table/table.js +2 -2
  108. package/esm/table/table.type.d.ts +6 -5
  109. package/esm/table/table.type.d.ts.map +1 -1
  110. package/esm/table/tbody.d.ts.map +1 -1
  111. package/esm/table/tbody.js +1 -0
  112. package/esm/table/tr.d.ts +1 -0
  113. package/esm/table/tr.d.ts.map +1 -1
  114. package/esm/table/tr.js +9 -6
  115. package/esm/tabs/tabs.d.ts.map +1 -1
  116. package/esm/tabs/tabs.js +13 -14
  117. package/esm/tag/tag.js +2 -2
  118. package/esm/tag/use-tag.js +2 -2
  119. package/esm/tooltip/tooltip.d.ts.map +1 -1
  120. package/esm/tooltip/tooltip.js +20 -8
  121. package/esm/tooltip/tooltip.type.d.ts +4 -0
  122. package/esm/tooltip/tooltip.type.d.ts.map +1 -1
  123. package/esm/virtual-scroll/scroll.d.ts.map +1 -1
  124. package/esm/virtual-scroll/scroll.js +12 -2
  125. package/esm/virtual-scroll/virtual-scroll-list.d.ts.map +1 -1
  126. package/esm/virtual-scroll/virtual-scroll-list.js +147 -20
  127. package/esm/virtual-scroll/virtual-scroll-list.type.d.ts +1 -0
  128. package/esm/virtual-scroll/virtual-scroll-list.type.d.ts.map +1 -1
  129. package/package.json +2 -2
@@ -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 ? 'bottom' : _props$position;
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__*/_jsx("div", _objectSpread(_objectSpread({
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("div", {
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;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"}
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,gBAuHjC,CAAC;AAEF,eAAe,MAAM,CAAC"}
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: props.wrapperRef,
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,8DA6GhB,CAAC;AAEF,eAAe,WAAW,CAAC"}
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
- currentIndex = _useState2[0],
36
- setCurrentIndex = _useState2[1];
36
+ top = _useState2[0],
37
+ setTop = _useState2[1];
37
38
  var _useState3 = useState(0),
38
39
  _useState4 = _slicedToArray(_useState3, 2),
39
- top = _useState4[0],
40
- setTop = _useState4[1];
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 getScrollHeight = function getScrollHeight() {
43
- var rows = Math.ceil(data.length);
44
- return rows * lineHeight;
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 currentIndex;
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 = currentIndex + step;
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 current = Math.floor(info.scrollTop / lineHeight);
65
- var top = info.scrollTop - current * lineHeight;
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 start = currentIndex;
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, currentIndex + i, i)
194
+ children: customRenderItem(d, startIndex + i, i)
100
195
  }, i);
101
196
  }
102
197
  return /*#__PURE__*/_jsx(React.Fragment, {
103
- children: renderItem(d, currentIndex + i, i)
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.4",
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.4",
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"