@zhenliang/sheet 0.1.4 → 0.1.7-3.beta.0

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 (117) hide show
  1. package/dist/assets/arrow-mac-down.svg +19 -0
  2. package/dist/assets/arrow-mac-right.svg +17 -0
  3. package/dist/assets/arrow-windows-down.svg +17 -0
  4. package/dist/assets/arrow-windows-right.svg +17 -0
  5. package/dist/core/config.d.ts +3 -0
  6. package/dist/core/config.js +4 -1
  7. package/dist/core/editor/cascaderEditor/index.d.ts +1 -1
  8. package/dist/core/editor/cascaderEditor/index.js +12 -11
  9. package/dist/core/editor/cascaderEditor/index.less +15 -7
  10. package/dist/core/editor/dateEditor/index.js +31 -8
  11. package/dist/core/editor/dateEditor/index.less +9 -2
  12. package/dist/core/editor/numberEditor/index.d.ts +3 -1
  13. package/dist/core/editor/numberEditor/index.js +62 -27
  14. package/dist/core/editor/numberEditor/index.less +3 -2
  15. package/dist/core/editor/selectEditor/index.d.ts +1 -1
  16. package/dist/core/editor/selectEditor/index.js +34 -19
  17. package/dist/core/editor/selectEditor/index.less +16 -5
  18. package/dist/core/reducers/index.d.ts +2 -2
  19. package/dist/core/reducers/index.js +8 -1
  20. package/dist/core/reducers/keyboardReducer.js +39 -9
  21. package/dist/core/reducers/mouseReducer.js +115 -11
  22. package/dist/core/reducers/sideEffectReducer.d.ts +1 -1
  23. package/dist/core/reducers/sideEffectReducer.js +146 -41
  24. package/dist/core/reducers/stateReducer.d.ts +1 -0
  25. package/dist/core/reducers/stateReducer.js +96 -27
  26. package/dist/core/sheet/Cell.d.ts +1 -1
  27. package/dist/core/sheet/Cell.js +33 -24
  28. package/dist/core/sheet/Control.d.ts +21 -0
  29. package/dist/core/sheet/Control.js +83 -0
  30. package/dist/core/sheet/DataEditor.js +3 -3
  31. package/dist/core/sheet/DefaultCell.d.ts +8 -3
  32. package/dist/core/sheet/DefaultCell.js +12 -8
  33. package/dist/core/sheet/DefaultRow.js +3 -9
  34. package/dist/core/sheet/DefaultRowMapper.d.ts +3 -0
  35. package/dist/core/sheet/DefaultRowMapper.js +22 -6
  36. package/dist/core/sheet/DefaultShell.js +1 -1
  37. package/dist/core/sheet/Event.d.ts +1 -1
  38. package/dist/core/sheet/Event.js +1 -1
  39. package/dist/core/sheet/Menu.d.ts +6 -0
  40. package/dist/core/sheet/Menu.js +21 -0
  41. package/dist/core/sheet/ValueViewer.js +1 -1
  42. package/dist/core/sheet/index.js +249 -88
  43. package/dist/core/sheet/index.less +199 -107
  44. package/dist/core/sheet/searchInput.d.ts +15 -0
  45. package/dist/core/sheet/searchInput.js +78 -0
  46. package/dist/core/sheet/useCellEvent.js +1 -1
  47. package/dist/core/sheet/useContextMenu.d.ts +1 -1
  48. package/dist/core/sheet/useContextMenu.js +13 -10
  49. package/dist/core/sheet/useKeyBoardEvent.js +19 -2
  50. package/dist/core/sheet/useMouseEvent.js +19 -12
  51. package/dist/core/sheet/useSearchInput.d.ts +11 -0
  52. package/dist/core/sheet/useSearchInput.js +65 -0
  53. package/dist/core/sheet/useSelectVisible.d.ts +1 -1
  54. package/dist/core/sheet/useSelectVisible.js +17 -7
  55. package/dist/core/sheet/useVirtualList.d.ts +10 -1
  56. package/dist/core/sheet/useVirtualList.js +44 -28
  57. package/dist/core/sheet/var.less +41 -34
  58. package/dist/core/shell/draggableShell/index.d.ts +4 -1
  59. package/dist/core/shell/draggableShell/index.js +133 -50
  60. package/dist/core/shell/tableShell.d.ts +4 -1
  61. package/dist/core/shell/tableShell.js +82 -34
  62. package/dist/core/table/addButton.d.ts +6 -0
  63. package/dist/core/table/addButton.js +103 -0
  64. package/dist/core/table/events.d.ts +1 -3
  65. package/dist/core/table/events.js +30 -35
  66. package/dist/core/table/index.js +97 -189
  67. package/dist/core/table/index.less +12 -0
  68. package/dist/core/table/useGroupConfig.d.ts +4 -1
  69. package/dist/core/table/useGroupConfig.js +139 -14
  70. package/dist/core/table/useRowSelection.d.ts +3 -0
  71. package/dist/core/table/useRowSelection.js +68 -2
  72. package/dist/core/util.d.ts +10 -4
  73. package/dist/core/util.js +121 -69
  74. package/dist/core/viewer/btnViewer/index.js +3 -3
  75. package/dist/core/viewer/cascaderViewer/index.js +6 -1
  76. package/dist/core/viewer/checkViewer/index.js +2 -2
  77. package/dist/core/viewer/editViewer/index.js +3 -3
  78. package/dist/core/viewer/groupViewer/index.js +26 -10
  79. package/dist/core/viewer/selectorViewer/index.js +7 -3
  80. package/dist/core/viewer/switchViewer/index.js +10 -4
  81. package/dist/example/antComponent.d.ts +1 -1
  82. package/dist/example/antComponent.js +63 -37
  83. package/dist/example/basic.d.ts +1 -1
  84. package/dist/example/basic.js +20 -14
  85. package/dist/example/ellipsis.d.ts +1 -1
  86. package/dist/example/ellipsis.js +3 -2
  87. package/dist/example/fixed.d.ts +1 -1
  88. package/dist/example/fixed.js +3 -2
  89. package/dist/example/group.js +40 -17
  90. package/dist/example/selection.d.ts +1 -1
  91. package/dist/example/selection.js +9 -8
  92. package/dist/example/sheet.d.ts +1 -1
  93. package/dist/example/sheet.js +21 -22
  94. package/dist/example/valuationAnalyze.d.ts +1 -0
  95. package/dist/example/valuationAnalyze.js +3 -4
  96. package/dist/hooks/index.d.ts +1 -1
  97. package/dist/hooks/index.js +1 -1
  98. package/dist/hooks/useEventBus.d.ts +1 -0
  99. package/dist/hooks/useEventBus.js +2 -2
  100. package/dist/hooks/useGroupConfig.d.ts +4 -0
  101. package/dist/hooks/useGroupConfig.js +5 -0
  102. package/dist/hooks/useKeyboard.d.ts +5 -2
  103. package/dist/hooks/useKeyboard.js +17 -3
  104. package/dist/hooks/useMiddlewareReducer.d.ts +5 -5
  105. package/dist/hooks/useMiddlewareReducer.js +3 -3
  106. package/dist/hooks/useMouse.d.ts +1 -1
  107. package/dist/hooks/useMouse.js +7 -7
  108. package/dist/hooks/useSetState.js +7 -7
  109. package/dist/hooks/useSheetEvent.d.ts +1 -1
  110. package/dist/hooks/useSheetEvent.js +2 -2
  111. package/dist/hooks/useWidthConfig.d.ts +3 -3
  112. package/dist/hooks/useWidthConfig.js +2 -2
  113. package/dist/standardUtils/index.d.ts +1 -1
  114. package/dist/standardUtils/index.js +1 -1
  115. package/dist/type/sheet.d.ts +77 -31
  116. package/dist/type/sheetTable.d.ts +21 -12
  117. package/package.json +7 -4
@@ -1,5 +1,5 @@
1
1
  import { useMouse } from "../..";
2
- import { useCallback, useRef } from 'react';
2
+ import { useCallback, useEffect, useRef } from "../../../node_modules/@types/react";
3
3
  import { extractDataRowAndCol, findParentTd } from "../util";
4
4
  var rowCount = 10; //每秒10行
5
5
  var colCount = 5; //每秒5列
@@ -32,7 +32,7 @@ export var useMouseEvent = function useMouseEvent(dispatch, elementRef) {
32
32
  var colCalled = 0;
33
33
  var step = function step() {
34
34
  var _elementRef$current;
35
- (_elementRef$current = elementRef.current) === null || _elementRef$current === void 0 ? void 0 : _elementRef$current.style.setProperty('scroll-behavior', 'auto');
35
+ (_elementRef$current = elementRef.current) === null || _elementRef$current === void 0 || _elementRef$current.style.setProperty('scroll-behavior', 'auto');
36
36
  var position = {
37
37
  x: destination.x,
38
38
  y: destination.y
@@ -93,11 +93,11 @@ export var useMouseEvent = function useMouseEvent(dispatch, elementRef) {
93
93
  if (!animateRef.current) return;
94
94
  if (Math.abs(distance.x) + Math.abs(distance.y) < 2) {
95
95
  var _elementRef$current2;
96
- (_elementRef$current2 = elementRef.current) === null || _elementRef$current2 === void 0 ? void 0 : _elementRef$current2.scrollTo(destination.x, destination.y);
96
+ (_elementRef$current2 = elementRef.current) === null || _elementRef$current2 === void 0 || _elementRef$current2.scrollTo(destination.x, destination.y);
97
97
  resetInterval();
98
98
  } else {
99
99
  var _elementRef$current3;
100
- (_elementRef$current3 = elementRef.current) === null || _elementRef$current3 === void 0 ? void 0 : _elementRef$current3.scrollTo(destination.x, destination.y);
100
+ (_elementRef$current3 = elementRef.current) === null || _elementRef$current3 === void 0 || _elementRef$current3.scrollTo(destination.x, destination.y);
101
101
  requestAnimationFrame(step);
102
102
  called++;
103
103
  }
@@ -132,7 +132,7 @@ export var useMouseEvent = function useMouseEvent(dispatch, elementRef) {
132
132
  if (!((_elementRef$current5 = elementRef.current) !== null && _elementRef$current5 !== void 0 && _elementRef$current5.contains(e.target))) return;
133
133
  var currentCell = findParentTd(e.target);
134
134
  if (!currentCell || currentCell.classList.contains('fixed')) return;
135
- (_elementRef$current6 = elementRef.current) === null || _elementRef$current6 === void 0 ? void 0 : _elementRef$current6.style.setProperty('scroll-behavior', 'smooth');
135
+ (_elementRef$current6 = elementRef.current) === null || _elementRef$current6 === void 0 || _elementRef$current6.style.setProperty('scroll-behavior', 'smooth');
136
136
  var currentPos = extractDataRowAndCol(currentCell);
137
137
  dispatch({
138
138
  type: 'mouseOver',
@@ -173,17 +173,14 @@ export var useMouseEvent = function useMouseEvent(dispatch, elementRef) {
173
173
  scrollTo('bottom');
174
174
  // elementRef.current.scrollTop += cellHeight;
175
175
  }
176
-
177
176
  if (dTop < 40) {
178
177
  scrollTo('top');
179
178
  // elementRef.current.scrollTop -= cellHeight;
180
179
  }
181
-
182
180
  if (dLeft < 40) {
183
181
  scrollTo('left');
184
182
  // elementRef.current.scrollLeft -= cellWidth;
185
183
  }
186
-
187
184
  if (dRight > -40) {
188
185
  scrollTo('right');
189
186
  // elementRef.current.scrollLeft += cellWidth;
@@ -267,16 +264,18 @@ export var useMouseEvent = function useMouseEvent(dispatch, elementRef) {
267
264
  });
268
265
  }, []);
269
266
  var loseFocus = useCallback(function (e) {
270
- var _elementRef$current10;
271
- if (!((_elementRef$current10 = elementRef.current) !== null && _elementRef$current10 !== void 0 && _elementRef$current10.contains(e.target))) {
267
+ var _elementRef$current10, _elementRef$current11;
268
+ var isSearch = (_elementRef$current10 = elementRef.current) === null || _elementRef$current10 === void 0 || (_elementRef$current10 = _elementRef$current10.parentElement) === null || _elementRef$current10 === void 0 || (_elementRef$current10 = _elementRef$current10.nextSibling) === null || _elementRef$current10 === void 0 ? void 0 : _elementRef$current10.contains(e.target);
269
+ var isTableAControl = (_elementRef$current11 = elementRef.current) === null || _elementRef$current11 === void 0 || (_elementRef$current11 = _elementRef$current11.parentElement) === null || _elementRef$current11 === void 0 ? void 0 : _elementRef$current11.contains(e.target);
270
+ if (!(isTableAControl || isSearch)) {
272
271
  dispatch({
273
272
  type: 'loseFocus'
274
273
  });
275
274
  return;
276
275
  }
277
- e.preventDefault();
276
+ // e.preventDefault();
278
277
  var currentCell = findParentTd(e.target);
279
- if (currentCell.classList.contains('read-only')) {
278
+ if (!(currentCell !== null && currentCell !== void 0 && currentCell.classList) || currentCell.classList.contains('read-only')) {
280
279
  // 只读
281
280
  return;
282
281
  }
@@ -286,6 +285,14 @@ export var useMouseEvent = function useMouseEvent(dispatch, elementRef) {
286
285
  payload: currentPos
287
286
  });
288
287
  }, []);
288
+ useEffect(function () {
289
+ if (elementRef.current) {
290
+ if (navigator.appVersion.indexOf("Mac") !== -1) {
291
+ elementRef.current.style.setProperty('--arrow-down', 'var(--arrow-mac-down)');
292
+ elementRef.current.style.setProperty('--arrow-right', 'var(--arrow-mac-right)');
293
+ }
294
+ }
295
+ }, []);
289
296
  useMouse({
290
297
  mouseDown: mouseDown,
291
298
  mouseOver: mouseOver,
@@ -0,0 +1,11 @@
1
+ import { Dispatch } from "../../hooks/useMiddlewareReducer";
2
+ import type { SheetType } from "../../type";
3
+ export declare const useSearchInput: (state: Partial<SheetType.UpdateStateType>, dispatch: Dispatch, handlerRef: React.RefObject<SheetType.SheetInstance>) => {
4
+ goNext: () => void;
5
+ goLast: () => void;
6
+ changeSearch: (value: string) => void;
7
+ closeSearch: () => void;
8
+ searchText?: string | undefined;
9
+ searchTotal?: number | undefined;
10
+ searchCurrent?: number | undefined;
11
+ };
@@ -0,0 +1,65 @@
1
+ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
2
+ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
3
+ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
4
+ function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
5
+ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
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
+ import { pick } from 'lodash';
8
+ import { useCallback, useEffect } from "../../../node_modules/@types/react";
9
+ export var useSearchInput = function useSearchInput(state, dispatch, handlerRef) {
10
+ var goSearchResult = useCallback(function (value) {
11
+ var _state$searchResultLi;
12
+ var _state$searchTotal = state.searchTotal,
13
+ searchTotal = _state$searchTotal === void 0 ? 0 : _state$searchTotal;
14
+ var index = (value < 0 ? value + searchTotal : value) % (searchTotal || 1);
15
+ var result = (_state$searchResultLi = state.searchResultList) === null || _state$searchResultLi === void 0 ? void 0 : _state$searchResultLi[index];
16
+ if (result) {
17
+ var _state$eventBus, _handlerRef$current, _handlerRef$current2;
18
+ (_state$eventBus = state.eventBus) === null || _state$eventBus === void 0 || _state$eventBus.emit('group-open-title', true);
19
+ dispatch({
20
+ type: 'changes',
21
+ payload: {
22
+ searchCurrent: index
23
+ }
24
+ });
25
+ (_handlerRef$current = handlerRef.current) === null || _handlerRef$current === void 0 || _handlerRef$current.select({
26
+ start: result,
27
+ end: result
28
+ });
29
+ handlerRef === null || handlerRef === void 0 || (_handlerRef$current2 = handlerRef.current) === null || _handlerRef$current2 === void 0 || _handlerRef$current2.zoomTo();
30
+ }
31
+ }, [state.searchTotal, state.searchResultList]);
32
+ var goNext = useCallback(function () {
33
+ var _state$searchCurrent;
34
+ goSearchResult(((_state$searchCurrent = state.searchCurrent) !== null && _state$searchCurrent !== void 0 ? _state$searchCurrent : 0) + 1);
35
+ }, [goSearchResult, state.searchCurrent]);
36
+ var goLast = useCallback(function () {
37
+ var _state$searchCurrent2;
38
+ goSearchResult(((_state$searchCurrent2 = state.searchCurrent) !== null && _state$searchCurrent2 !== void 0 ? _state$searchCurrent2 : 0) - 1);
39
+ }, [goSearchResult, state.searchCurrent]);
40
+ var closeSearch = useCallback(function () {
41
+ dispatch({
42
+ type: 'closeSearch'
43
+ });
44
+ }, []);
45
+ var changeSearch = useCallback(function (value) {
46
+ dispatch({
47
+ type: 'changeSearch',
48
+ payload: value
49
+ });
50
+ }, [state.data]);
51
+ useEffect(function () {
52
+ var _state$searchResultLi2;
53
+ if (!((_state$searchResultLi2 = state.searchResultList) !== null && _state$searchResultLi2 !== void 0 && _state$searchResultLi2.length)) {
54
+ dispatch({
55
+ type: 'clearSelect'
56
+ });
57
+ }
58
+ }, [state.searchResultList, state.searchTotal]);
59
+ return _objectSpread(_objectSpread({}, pick(state, ['searchText', 'searchTotal', 'searchCurrent'])), {}, {
60
+ goNext: goNext,
61
+ goLast: goLast,
62
+ changeSearch: changeSearch,
63
+ closeSearch: closeSearch
64
+ });
65
+ };
@@ -1,2 +1,2 @@
1
1
  import { SheetType } from "../../type";
2
- export declare const useSelectVisible: (sheetWrapper: React.RefObject<SheetType.refAssertion>, start?: SheetType.CellPosition) => boolean;
2
+ export declare const useSelectVisible: (sheetWrapper: React.RefObject<SheetType.refAssertion>, start?: SheetType.CellPosition) => [boolean, 'up' | 'down'];
@@ -2,24 +2,33 @@ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArra
2
2
  function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
3
3
  function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
4
4
  function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
5
- function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
5
+ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
6
6
  function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
7
7
  import { throttle } from 'lodash';
8
- import { useEffect, useState } from 'react';
8
+ import { useEffect, useState } from "../../../node_modules/@types/react";
9
9
  export var useSelectVisible = function useSelectVisible(sheetWrapper, start) {
10
10
  var _useState = useState(true),
11
11
  _useState2 = _slicedToArray(_useState, 2),
12
12
  startVisible = _useState2[0],
13
13
  setStartVisible = _useState2[1];
14
+ var _useState3 = useState('up'),
15
+ _useState4 = _slicedToArray(_useState3, 2),
16
+ backDirection = _useState4[0],
17
+ setBackDirection = _useState4[1];
14
18
  useEffect(function () {
15
19
  var _sheetWrapper$current3;
16
20
  var handleScroll = throttle(function () {
17
21
  var _sheetWrapper$current, _sheetWrapper$current2;
18
22
  if (!start) {
23
+ setStartVisible(true);
19
24
  return;
20
25
  }
21
26
  var startCell = (_sheetWrapper$current = sheetWrapper.current) === null || _sheetWrapper$current === void 0 ? void 0 : _sheetWrapper$current.querySelector("td.cell[data-row='".concat(start.row, "']"));
22
- if (!startCell) return false;
27
+ if (!startCell) {
28
+ // 找不到说明已经不在可视区域了
29
+ setStartVisible(false);
30
+ return;
31
+ }
23
32
  var _ref = ((_sheetWrapper$current2 = sheetWrapper.current) === null || _sheetWrapper$current2 === void 0 ? void 0 : _sheetWrapper$current2.getBoundingClientRect()) || {},
24
33
  _ref$top = _ref.top,
25
34
  top = _ref$top === void 0 ? 0 : _ref$top,
@@ -32,17 +41,18 @@ export var useSelectVisible = function useSelectVisible(sheetWrapper, start) {
32
41
  setStartVisible(true);
33
42
  } else {
34
43
  setStartVisible(false);
44
+ setBackDirection(top < cellTop ? 'down' : 'up');
35
45
  }
36
46
  }, 100);
37
47
  handleScroll();
38
- (_sheetWrapper$current3 = sheetWrapper.current) === null || _sheetWrapper$current3 === void 0 ? void 0 : _sheetWrapper$current3.addEventListener('scroll', handleScroll);
48
+ (_sheetWrapper$current3 = sheetWrapper.current) === null || _sheetWrapper$current3 === void 0 || _sheetWrapper$current3.addEventListener('scroll', handleScroll);
39
49
  return function () {
40
50
  var _sheetWrapper$current4;
41
- (_sheetWrapper$current4 = sheetWrapper.current) === null || _sheetWrapper$current4 === void 0 ? void 0 : _sheetWrapper$current4.removeEventListener('scroll', handleScroll);
51
+ (_sheetWrapper$current4 = sheetWrapper.current) === null || _sheetWrapper$current4 === void 0 || _sheetWrapper$current4.removeEventListener('scroll', handleScroll);
42
52
  };
43
53
  }, [sheetWrapper.current, start]);
44
54
  if (!start) {
45
- return true;
55
+ return [true, 'up'];
46
56
  }
47
- return startVisible;
57
+ return [startVisible, backDirection];
48
58
  };
@@ -1,7 +1,16 @@
1
+ /// <reference types="react" />
1
2
  import type { SheetType } from "../../type";
2
- export declare const useVirtualList: (elementRef: React.RefObject<SheetType.refAssertion>, data?: SheetType.Cell[][], groupConfig?: SheetType.RowGroupConfig, virtualized?: boolean) => {
3
+ export declare const useVirtualList: (elementRef: React.RefObject<SheetType.refAssertion>, data?: SheetType.Cell[][], virtualized?: boolean) => {
3
4
  virtualStart: number;
4
5
  virtualEnd: number;
5
6
  paddingTop: number;
6
7
  paddingBottom: number;
7
8
  };
9
+ export declare const VirtualizeStart: React.FC<{
10
+ virtualized: boolean;
11
+ paddingTop: number;
12
+ }>;
13
+ export declare const VirtualizeEnd: React.FC<{
14
+ virtualized: boolean;
15
+ paddingBottom: number;
16
+ }>;
@@ -2,17 +2,19 @@ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArra
2
2
  function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
3
3
  function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
4
4
  function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
5
- function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
5
+ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
6
6
  function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
7
- import { isEqual, throttle } from 'lodash';
8
- import { useEffect, useRef, useState } from 'react';
9
- import { getRowHeight, rowToActualRow } from "../util";
7
+ /* eslint-disable @typescript-eslint/no-unused-vars */
8
+ import { useGroup } from "../../hooks/useGroupConfig";
9
+ import { throttle } from 'lodash';
10
+ import { useEffect, useState } from "../../../node_modules/@types/react";
11
+ import { getRowHeight } from "../util";
12
+ import { jsx as _jsx } from "../../../node_modules/@types/react/jsx-runtime";
10
13
  var extra = 20;
11
14
  // 虚拟列表
12
15
  export var useVirtualList = function useVirtualList(elementRef) {
13
16
  var data = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
14
- var groupConfig = arguments.length > 2 ? arguments[2] : undefined;
15
- var virtualized = arguments.length > 3 ? arguments[3] : undefined;
17
+ var virtualized = arguments.length > 2 ? arguments[2] : undefined;
16
18
  var _useState = useState({
17
19
  virtualStart: 0,
18
20
  virtualEnd: virtualized ? Math.min(data.length - 1, 2 * extra) : data.length - 1,
@@ -22,14 +24,18 @@ export var useVirtualList = function useVirtualList(elementRef) {
22
24
  _useState2 = _slicedToArray(_useState, 2),
23
25
  state = _useState2[0],
24
26
  setState = _useState2[1];
27
+ var _useGroup = useGroup(),
28
+ groupConfig = _useGroup.config;
25
29
  var virtualStart = state.virtualStart,
26
30
  virtualEnd = state.virtualEnd,
27
31
  paddingTop = state.paddingTop,
28
32
  paddingBottom = state.paddingBottom;
29
- var virtualRef = useRef();
30
- var groupConfigRef = useRef(groupConfig);
33
+ // const virtualRef = useRef<VirtualConfig | null>();
31
34
  useEffect(function () {
32
- groupConfigRef.current = groupConfig;
35
+ var _elementRef$current;
36
+ (_elementRef$current = elementRef.current) === null || _elementRef$current === void 0 || _elementRef$current.scrollBy({
37
+ top: 0
38
+ });
33
39
  }, [groupConfig]);
34
40
  useEffect(function () {
35
41
  if (!elementRef.current) return;
@@ -43,31 +49,22 @@ export var useVirtualList = function useVirtualList(elementRef) {
43
49
  clientHeight = _ref.clientHeight;
44
50
  var start = Math.floor(scrollTop / itemHeight) - extra;
45
51
  var end = Math.ceil((scrollTop + clientHeight) / itemHeight) + extra;
46
-
47
- // todo 加入分组之后的 虚拟列表计算
48
- var actualStart = groupConfigRef.current ? rowToActualRow(start, groupConfigRef.current) : start;
49
- var actualEnd = groupConfigRef.current ? rowToActualRow(end, groupConfigRef.current) : end;
50
-
51
- // const minStart = start - (actualStart - start)
52
- var maxEnd = end - (actualEnd - end);
53
- var updateVirtualConfig = {
54
- virtualStart: actualStart,
55
- virtualEnd: maxEnd,
56
- paddingTop: actualStart * itemHeight,
57
- paddingBottom: (data.length - maxEnd) * itemHeight
52
+ var newConfig = {
53
+ virtualStart: start,
54
+ virtualEnd: end,
55
+ paddingTop: start * itemHeight,
56
+ paddingBottom: (data.length - end) * itemHeight
58
57
  };
59
- if (isEqual(updateVirtualConfig, virtualRef.current)) {
60
- return;
61
- }
62
- setState(updateVirtualConfig);
63
- virtualRef.current = updateVirtualConfig;
58
+ // virtualRef.current = newConfig;
59
+ setState(newConfig);
60
+ return;
64
61
  }, 50);
65
62
  // data.length change 的时候用 handleScroll 重设 virtual params
66
63
  handleScroll();
67
64
  elementRef.current.addEventListener('scroll', handleScroll);
68
65
  return function () {
69
- var _elementRef$current;
70
- (_elementRef$current = elementRef.current) === null || _elementRef$current === void 0 ? void 0 : _elementRef$current.removeEventListener('scroll', handleScroll);
66
+ var _elementRef$current2;
67
+ (_elementRef$current2 = elementRef.current) === null || _elementRef$current2 === void 0 || _elementRef$current2.removeEventListener('scroll', handleScroll);
71
68
  };
72
69
  }, [elementRef.current, data.length]);
73
70
  if (!virtualized) {
@@ -84,4 +81,23 @@ export var useVirtualList = function useVirtualList(elementRef) {
84
81
  paddingTop: Math.max(0, paddingTop),
85
82
  paddingBottom: data.length - 1 <= virtualEnd ? 0 : paddingBottom
86
83
  };
84
+ };
85
+ export var VirtualizeStart = function VirtualizeStart(_ref2) {
86
+ var virtualized = _ref2.virtualized,
87
+ paddingTop = _ref2.paddingTop;
88
+ return virtualized && paddingTop > 0 ? /*#__PURE__*/_jsx("tr", {
89
+ style: {
90
+ height: 0,
91
+ paddingBottom: paddingTop,
92
+ display: 'block'
93
+ }
94
+ }) : null;
95
+ };
96
+ export var VirtualizeEnd = function VirtualizeEnd(_ref3) {
97
+ var virtualized = _ref3.virtualized,
98
+ paddingBottom = _ref3.paddingBottom;
99
+ return /*#__PURE__*/_jsx(VirtualizeStart, {
100
+ virtualized: virtualized,
101
+ paddingTop: paddingBottom
102
+ });
87
103
  };
@@ -1,41 +1,48 @@
1
- .harvest{
2
- --row-height:40px;
3
- --cell-font-size:12px;
4
- --cell-title-font-size:12px;
5
- --cell-line-height:40px;
6
- --cell-inner-height:39px;
7
- --cell-padding-vertical:0;
8
- --cell-padding-horizontal:5px;
1
+ .harvest {
2
+ --row-height: 40px;
3
+ --cell-font-size: 12px;
4
+ --cell-title-font-size: 12px;
5
+ --cell-line-height: 40px;
6
+ --cell-inner-height: 39px;
7
+ --cell-padding-vertical: 0;
8
+ --cell-padding-horizontal: 5px;
9
9
  --cell-border-color: #DDD;
10
- --cell-background-color:white;
11
- --cell-title-background-color:#f7f9fc;
12
- --cell-read-only-background-color:#f7f9fc;
13
- --cell-hover:white;
14
- --cell-box-shadow:inset 0 -100px 0 rgba(33, 133, 208, 15%);;
15
- --cell-fixed-box-shadow-left:inset 10px 0 8px -8px rgba(5, 5, 5,6%);
16
- --cell-fixed-box-shadow-right:inset -10px 0 8px -8px rgba(5, 5, 5,6%);
10
+ --cell-background-color: white;
11
+ --cell-title-background-color: #f7f9fc;
12
+ --cell-read-only-background-color: #f7f9fc;
13
+ --cell-hover: white;
14
+ --cell-box-shadow: inset 0 -100px 0 rgba(33, 133, 208, 15%);
15
+ ;
16
+ --cell-fixed-box-shadow-left: inset 10px 0 8px -8px rgba(5, 5, 5, 6%);
17
+ --cell-fixed-box-shadow-right: inset -10px 0 8px -8px rgba(5, 5, 5, 6%);
17
18
  --resizer: #2185d0;
18
- --color:black;
19
- --title-color:#999;
20
- --read-color:#999;
19
+ --color: black;
20
+ --title-color: #999;
21
+ --read-color: #999;
22
+ --arrow-mac-down: url('../../assets/arrow-mac-down.svg');
23
+ --arrow-mac-right: url('../../assets/arrow-mac-right.svg');
24
+ --arrow-windows-down: url('../../assets/arrow-windows-down.svg');
25
+ --arrow-windows-right: url('../../assets/arrow-windows-right.svg');
26
+ --arrow-down: var(--arrow-windows-down);
27
+ --arrow-right: var(--arrow-windows-right);
21
28
  }
22
29
 
23
- .ali-devops{
24
- --row-height:40px;
25
- --cell-font-size:14px;
26
- --cell-line-height:20px;
27
- --cell-padding-vertical:12px;
28
- --cell-padding-horizontal:12px;
30
+ .ali-devops {
31
+ --row-height: 40px;
32
+ --cell-font-size: 14px;
33
+ --cell-line-height: 20px;
34
+ --cell-padding-vertical: 12px;
35
+ --cell-padding-horizontal: 12px;
29
36
  --cell-border-color: #e5e5e5;
30
- --cell-background-color:white;
31
- --cell-title-background-color:white;
32
- --cell-read-only-background-color:white;
33
- --cell-fixed-box-shadow:inset -10px 0 8px -8px rgba(5, 5, 5,6%);
34
- --cell-hover:#f7f7f7;
35
- --cell-fixed-box-shadow-left:inset 10px 0 8px -8px rgba(5, 5, 5,6%);
36
- --cell-fixed-box-shadow-right:inset -10px 0 8px -8px rgba(5, 5, 5,6%);
37
+ --cell-background-color: white;
38
+ --cell-title-background-color: white;
39
+ --cell-read-only-background-color: white;
40
+ --cell-fixed-box-shadow: inset -10px 0 8px -8px rgba(5, 5, 5, 6%);
41
+ --cell-hover: #f7f7f7;
42
+ --cell-fixed-box-shadow-left: inset 10px 0 8px -8px rgba(5, 5, 5, 6%);
43
+ --cell-fixed-box-shadow-right: inset -10px 0 8px -8px rgba(5, 5, 5, 6%);
37
44
  --resizer: #1b9aee;
38
- --color:#262626;
39
- --title-color:#8c8c8c;
40
- --read-color:#8c8c8c;
45
+ --color: #262626;
46
+ --title-color: #8c8c8c;
47
+ --read-color: #8c8c8c;
41
48
  }
@@ -1,5 +1,8 @@
1
+ /// <reference types="react" />
1
2
  import type { SheetType } from "../../../type";
2
3
  import './index.less';
3
- export declare const DraggableShell: ({ columns, className, showGroup, showSelect, controlProps, controlWidth, }: SheetType.SheetShell) => import("react").FC<{
4
+ export declare const DraggableShell: ({ columns, className, showGroup, showSelect, controlProps, controlWidth, }: SheetType.SheetShell) => import("../../../../node_modules/@types/react").FC<{
4
5
  children: React.ReactElement;
6
+ isScrolledOver: boolean;
7
+ isScrolledToEnd: boolean;
5
8
  }>;