@zhenliang/sheet 0.1.89-beta.0 → 0.1.89-beta.2

package/dist/core/reducers/keyboardReducer.js

@@ -4,24 +4,26 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 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; }
 function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
 function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-import { isNil } from 'lodash';
-import { getNextVisibleRow, groupConfigToGroupMap, stripRowIndex, getRowHeight, getColWidth } from "../util";
+import { get, isNil } from 'lodash';
+import { getNextVisibleRow, groupConfigToGroupMap, stripRowIndex } from "../util";
 export var keyboardReducer = {
   move: function move(state, payload) {
     var _state$start, _state$start2, _data;
     var _ref = payload,
       optRow = _ref.row,
-      optCol = _ref.col;
+      optCol = _ref.col,
+      elementRef = _ref.elementRef;
     var groupConfig = state.groupConfig,
-      elementRef = state.elementRef,
       _state$data = state.data,
-      data = _state$data === void 0 ? [] : _state$data;
+      data = _state$data === void 0 ? [] : _state$data,
+      rowHeight = state.rowHeight,
+      cloWidthArray = state.cloWidthArray;
     var newRow = (((_state$start = state.start) === null || _state$start === void 0 ? void 0 : _state$start.row) || 0) + optRow;
     var newCol = (((_state$start2 = state.start) === null || _state$start2 === void 0 ? void 0 : _state$start2.col) || 0) + optCol;
     // 越界判断
     var maxRow = (data === null || data === void 0 || (_data = data[data.length - 1]) === null || _data === void 0 ? void 0 : _data[0].row) || data.length - 1;
     var maxCol = data[0].length - 1;
-    var minCol = -1;
+    var minCol = 0;
     data[0].forEach(function (item) {
       var itemCol = item.col;
       if (itemCol < 0) {
@@ -34,21 +36,21 @@ export var keyboardReducer = {
     // 跟随滚动
     if (optCol !== 0) {
       var _elementRef$current;
-      var colWidth = getColWidth(elementRef.current, newCol);
+      var colWidth = get(cloWidthArray.current, newCol);
       elementRef === null || elementRef === void 0 || (_elementRef$current = elementRef.current) === null || _elementRef$current === void 0 || _elementRef$current.scrollBy({
         left: colWidth * optCol
       });
     }
     if (optRow !== 0) {
       var _elementRef$current2;
-      var rowHeight = getRowHeight(elementRef.current);
-      var itemHeight = rowHeight;
+      var itemHeight = rowHeight.current;
       elementRef === null || elementRef === void 0 || (_elementRef$current2 = elementRef.current) === null || _elementRef$current2 === void 0 || _elementRef$current2.scrollBy({
         top: itemHeight * optRow
       });
     }
     if (groupConfig && optRow !== 0) {
-      newRow = getNextVisibleRow(newRow, maxRow, groupConfigToGroupMap(groupConfig), optRow);
+      var _getNextVisibleRow;
+      newRow = (_getNextVisibleRow = getNextVisibleRow(newRow, maxRow, groupConfigToGroupMap(groupConfig), optRow)) !== null && _getNextVisibleRow !== void 0 ? _getNextVisibleRow : 0;
     }
     var currentPos = {
       row: newRow,

package/dist/core/sheet/index.js

@@ -21,7 +21,7 @@ import { isEmpty, isNil, isNumber } from 'lodash';
 import { SheetEventContext, useEventBus, useMiddlewareReducer } from "../../hooks";
 import sheetReducer from "../reducers";
 import { sideEffectReducer } from "../reducers/sideEffectReducer";
-import { classNames, getRowHeight, rowToActualRow } from "../util";
+import { classNames, rowToActualRow } from "../util";
 import { Control } from "./Control";
 import { DefaultRowMapper } from "./DefaultRowMapper";
 import { Menu } from "./Menu";
@@ -87,6 +87,8 @@ var Sheet = function Sheet(props) {
     _useState4 = _slicedToArray(_useState3, 2),
     isScrolledToEnd = _useState4[0],
     setIsScrolledToEnd = _useState4[1];
+  var rowHeight = useRef(30);
+  var cloWidthArray = useRef([]);
   var sheetWrapperRef = useRef(null);
   var contextMenuRef = useRef(null);
   var eventBus = useEventBus();
@@ -100,7 +102,8 @@ var Sheet = function Sheet(props) {
       groupConfig: groupConfig,
       eventBus: eventBus,
       fixedInfo: [],
-      elementRef: sheetWrapperRef
+      rowHeight: rowHeight,
+      cloWidthArray: cloWidthArray
     },
     // [ReduxThunk, ReduxLogger],
     [ReduxThunk]),
@@ -121,10 +124,9 @@ var Sheet = function Sheet(props) {
           var container = sheetWrapperRef.current;
           if (!start && isNil(row)) return;
           var actual = rowToActualRow((_ref = row) !== null && _ref !== void 0 ? _ref : start === null || start === void 0 ? void 0 : start.row, groupConfig, data.length);
-          var rowHeight = getRowHeight(container);
           var firstRowCell = container.querySelector("td.cell[data-col='".concat(start === null || start === void 0 ? void 0 : start.col, "']"));
           var colPosition = firstRowCell ? firstRowCell.offsetLeft - firstRowCell.clientWidth : 0;
-          var scrollHeight = actual * rowHeight;
+          var scrollHeight = actual * rowHeight.current;
           (_sheetWrapperRef$curr = sheetWrapperRef.current) === null || _sheetWrapperRef$curr === void 0 || _sheetWrapperRef$curr.scrollTo(isNumber(row) ? 0 : colPosition, scrollHeight);
 
           // 最后一行的bug暂时用 scroll end 事件来处理
@@ -154,10 +156,9 @@ var Sheet = function Sheet(props) {
           var container = sheetWrapperRef.current;
           if (isNil(row) || isNil(col)) return;
           var actual = rowToActualRow(row, groupConfig, data.length);
-          var rowHeight = getRowHeight(container);
           var firstRowCell = container.querySelector("td.cell[data-col='".concat(col, "']"));
           var colPosition = firstRowCell ? firstRowCell.offsetLeft - firstRowCell.clientWidth : 0;
-          var scrollHeight = actual * rowHeight;
+          var scrollHeight = actual * rowHeight.current;
           if (nextLoop) {
             setTimeout(function () {
               var _sheetWrapperRef$curr4;
@@ -245,6 +246,16 @@ var Sheet = function Sheet(props) {
       }
     });
   }, [onCellsChanged, data, freePaste, groupConfig, freeze]);
+  useEffect(function () {
+    var _sheetWrapperRef$curr6, _sheetWrapperRef$curr7, _sheetWrapperRef$curr8;
+    if (!sheetWrapperRef.current) {
+      return;
+    }
+    rowHeight.current = ((_sheetWrapperRef$curr6 = sheetWrapperRef.current) === null || _sheetWrapperRef$curr6 === void 0 || (_sheetWrapperRef$curr6 = _sheetWrapperRef$curr6.getElementsByTagName('thead')[0]) === null || _sheetWrapperRef$curr6 === void 0 ? void 0 : _sheetWrapperRef$curr6.clientHeight) || 30;
+    cloWidthArray.current = Array.from((_sheetWrapperRef$curr7 = (_sheetWrapperRef$curr8 = sheetWrapperRef.current) === null || _sheetWrapperRef$curr8 === void 0 ? void 0 : _sheetWrapperRef$curr8.getElementsByTagName('col')) !== null && _sheetWrapperRef$curr7 !== void 0 ? _sheetWrapperRef$curr7 : []).map(function (item) {
+      return item.clientWidth;
+    });
+  }, [sheetWrapperRef.current]);
   useCellEvent(dispatch, state);
   useMouseEvent(dispatch, sheetWrapperRef);
   useKeyBoardEvent(dispatch, sheetWrapperRef);
@@ -271,9 +282,9 @@ var Sheet = function Sheet(props) {
   useEffect(function () {
     if (!state.editing && state.start) {
       setTimeout(function () {
-        var _sheetWrapperRef$curr6;
+        var _sheetWrapperRef$curr9;
         // 表格获取焦点 + 接收keyboard event
-        (_sheetWrapperRef$curr6 = sheetWrapperRef.current) === null || _sheetWrapperRef$curr6 === void 0 || _sheetWrapperRef$curr6.focus({
+        (_sheetWrapperRef$curr9 = sheetWrapperRef.current) === null || _sheetWrapperRef$curr9 === void 0 || _sheetWrapperRef$curr9.focus({
           preventScroll: true
         });
       }, 1);

package/dist/core/sheet/useKeyBoardEvent.js

@@ -1,3 +1,9 @@
+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); }
+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; }
+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; }
+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; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 import { useKeyBoard } from "../..";
 import { sideEffectReducer } from "../reducers/sideEffectReducer";
 import { ensureFocus, isSearchElement } from "../util";
@@ -7,7 +13,9 @@ export var useKeyBoardEvent = function useKeyBoardEvent(dispatch, elementRef) {
       e.preventDefault();
       dispatch({
         type: 'move',
-        payload: value
+        payload: _objectSpread(_objectSpread({}, value), {}, {
+          elementRef: elementRef
+        })
       });
     },
     selectAll: function selectAll(e) {

package/dist/core/util.d.ts

@@ -43,7 +43,7 @@ export declare const changeGroupConfig: (rowGroupConfig: SheetType.RowGroupConfi
 export declare const rowToActualRow: (row: number, groupConfig?: SheetType.RowGroupConfig, max?: number) => number;
 export declare const rowToCountRow: (row: number, groupConfig: SheetType.RowGroupConfig, max: number) => number;
 export declare const getRowHeight: (container: HTMLSpanElement) => number;
-export declare const getColWidth: (container: HTMLSpanElement, col: number) => any;
+export declare const getColWidth: (container: HTMLSpanElement, col: number) => number;
 export declare const getNextVisibleRow: (row: number, maxRow: number, groupMap?: Map<number, SheetType.RowGroup & {
     isStart: boolean;
     isOpen: boolean;

package/dist/core/util.js

@@ -16,7 +16,6 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
 
 import { message } from 'antd';
 import { cloneDeep, get, isNil, range } from 'lodash';
-var colElements;
 export function findParentTd(el) {
   if (!el) return null;
   if (el.tagName === 'TD') return el;
@@ -418,16 +417,13 @@ export var getRowHeight = function getRowHeight(container) {
   return h;
 };
 export var getColWidth = function getColWidth(container, col) {
-  if (isNil(colElements)) {
-    colElements = container.getElementsByTagName('col');
-  }
+  var colElements = container.getElementsByTagName('col');
   if (colElements[col]) {
     return colElements[col].clientWidth;
   }
   return 0;
 };
 export var getNextVisibleRow = function getNextVisibleRow(row, maxRow, groupMap) {
-  var _groupMap$get15, _groupMap$get16;
   var up = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 1;
   if (!(groupMap !== null && groupMap !== void 0 && groupMap.size)) {
     return row;
@@ -435,17 +431,20 @@ export var getNextVisibleRow = function getNextVisibleRow(row, maxRow, groupMap)
   if (row > maxRow || row < 0) {
     return null;
   }
-  var isClose = !((_groupMap$get15 = groupMap.get(row)) !== null && _groupMap$get15 !== void 0 && _groupMap$get15.isOpen);
-  var isChild = !((_groupMap$get16 = groupMap.get(row)) !== null && _groupMap$get16 !== void 0 && _groupMap$get16.isStart);
+  var rowInfo = groupMap.get(row);
+  var isClose = !(rowInfo !== null && rowInfo !== void 0 && rowInfo.isOpen);
+  var isChild = !(rowInfo !== null && rowInfo !== void 0 && rowInfo.isStart);
   // 向下 如果遇到了一个关着的 并且 是子行 直接返回他的最后一行+1
-  if (groupMap.get(row) && isClose && isChild && up > 0) {
-    var _groupMap$get17;
-    return ((_groupMap$get17 = groupMap.get(row)) === null || _groupMap$get17 === void 0 ? void 0 : _groupMap$get17.groupEnd) + 1;
+  if (rowInfo && isClose && up > 0 && isChild) {
+    var newRow = rowInfo.groupEnd + 1;
+    if (rowInfo.groupEnd === maxRow) {
+      newRow = rowInfo.groupStart;
+    }
+    return newRow;
   }
   // 向上 如果遇到了一个关着的直接返回他的主行
-  if (groupMap.get(row) && isClose) {
-    var _groupMap$get18;
-    return (_groupMap$get18 = groupMap.get(row)) === null || _groupMap$get18 === void 0 ? void 0 : _groupMap$get18.groupStart;
+  if (rowInfo && isClose) {
+    return rowInfo.groupStart;
   }
   return row;
 };

package/dist/example/group.js

@@ -154,6 +154,21 @@ var data = [{
   name: 'Not Expandable',
   age: 29,
   address: 'Jiangsu No. 1 Lake Park'
+}, {
+  key: 9,
+  id: 9,
+  name: 'Jim Green',
+  age: 42,
+  address: 'London No. 1 Lake Park',
+  children: [{
+    id: 91,
+    key: '9-1',
+    parentId: 9
+  }, {
+    id: 92,
+    key: '9-2',
+    parentId: 9
+  }]
 }];
 var App = function App() {
   var _useState = useState(data),

package/dist/type/sheet.d.ts

@@ -240,7 +240,8 @@ export type UpdateStateType = {
     };
     cellChangeHandler: (cells: CellData[], additions: CellData[] | undefined, type: ChangeType) => void;
     fixedInfo: SheetType.FixedInfo[];
-    elementRef: any;
+    rowHeight: any;
+    cloWidthArray: any;
 } & SearchState;
 export type UpdateFocus = (start: CellPosition, end: CellPosition) => void;
 export type Options<T = any> = {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zhenliang/sheet",
-  "version": "0.1.89-beta.0",
+  "version": "0.1.89-beta.2",
   "description": "A react library developed with dumi",
   "license": "MIT",
   "module": "dist/index.js",