@zhenliang/sheet 0.0.1
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/LICENSE +21 -0
- package/README.md +3 -0
- package/dist/core/config.js +13 -0
- package/dist/core/editor/cascaderEditor/index.js +63 -0
- package/dist/core/editor/cascaderEditor/index.less +24 -0
- package/dist/core/editor/dateEditor/index.js +42 -0
- package/dist/core/editor/dateEditor/index.less +7 -0
- package/dist/core/editor/numberEditor/index.js +25 -0
- package/dist/core/editor/numberEditor/index.less +17 -0
- package/dist/core/editor/selectEditor/index.js +44 -0
- package/dist/core/editor/selectEditor/index.less +41 -0
- package/dist/core/reducers/index.js +36 -0
- package/dist/core/reducers/keyboardReducer.js +91 -0
- package/dist/core/reducers/mouseReducer.js +151 -0
- package/dist/core/reducers/sideEffectReducer.js +324 -0
- package/dist/core/reducers/stateReducer.js +140 -0
- package/dist/core/sheet/Cell.js +160 -0
- package/dist/core/sheet/DataEditor.js +21 -0
- package/dist/core/sheet/DefaultCell.js +31 -0
- package/dist/core/sheet/DefaultRow.js +25 -0
- package/dist/core/sheet/DefaultRowMapper.js +15 -0
- package/dist/core/sheet/DefaultShell.js +12 -0
- package/dist/core/sheet/Event.js +17 -0
- package/dist/core/sheet/ValueViewer.js +9 -0
- package/dist/core/sheet/index.js +201 -0
- package/dist/core/sheet/index.less +261 -0
- package/dist/core/sheet/useCellEvent.js +22 -0
- package/dist/core/sheet/useContextMenu.js +86 -0
- package/dist/core/sheet/useKeyBoardEvent.js +44 -0
- package/dist/core/sheet/useMouseEvent.js +298 -0
- package/dist/core/sheet/useVirtualList.js +74 -0
- package/dist/core/sheet/var.less +41 -0
- package/dist/core/shell/draggableShell/index.js +182 -0
- package/dist/core/shell/draggableShell/index.less +16 -0
- package/dist/core/shell/resizeShell.js +57 -0
- package/dist/core/shell/tableShell.js +105 -0
- package/dist/core/table/index.js +311 -0
- package/dist/core/table/useGroupConfig.js +32 -0
- package/dist/core/table/useRowSelection.js +24 -0
- package/dist/core/table/util.js +29 -0
- package/dist/core/util.js +363 -0
- package/dist/core/viewer/checkViewer/index.js +23 -0
- package/dist/core/viewer/groupViewer/index.js +28 -0
- package/dist/example/basic.js +120 -0
- package/dist/example/draggable.js +0 -0
- package/dist/example/ellipsis.js +63 -0
- package/dist/example/fixed.js +88 -0
- package/dist/example/group.js +84 -0
- package/dist/example/index.less +5 -0
- package/dist/example/selection.js +85 -0
- package/dist/example/sheet.js +356 -0
- package/dist/hooks/index.js +6 -0
- package/dist/hooks/useEventBus.js +17 -0
- package/dist/hooks/useKeyboard.js +108 -0
- package/dist/hooks/useMiddlewareReducer.js +47 -0
- package/dist/hooks/useMouse.js +52 -0
- package/dist/hooks/useSetState.js +27 -0
- package/dist/hooks/useSheetEvent.js +5 -0
- package/dist/index.js +3 -0
- package/dist/standardUtils/index.js +32 -0
- package/dist/typings/index.d.ts +1 -0
- package/dist/typings/sheet.d.ts +209 -0
- package/dist/typings/table.js +0 -0
- package/package.json +84 -0
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import EventEmitter from 'events';
|
|
2
|
+
import { useEffect, useRef } from 'react';
|
|
3
|
+
var useEventBus = function useEventBus() {
|
|
4
|
+
var eventBus = useRef(new EventEmitter());
|
|
5
|
+
useEffect(function () {
|
|
6
|
+
return function () {
|
|
7
|
+
var _eventBus$current;
|
|
8
|
+
(_eventBus$current = eventBus.current) === null || _eventBus$current === void 0 ? void 0 : _eventBus$current.removeAllListeners();
|
|
9
|
+
eventBus.current = null;
|
|
10
|
+
};
|
|
11
|
+
}, []);
|
|
12
|
+
if (!eventBus.current) {
|
|
13
|
+
eventBus.current = new EventEmitter();
|
|
14
|
+
}
|
|
15
|
+
return eventBus.current;
|
|
16
|
+
};
|
|
17
|
+
export { useEventBus };
|
|
@@ -0,0 +1,108 @@
|
|
|
1
|
+
import { useCallback, useEffect } from 'react';
|
|
2
|
+
import { BACKSPACE_KEY, C_KEY, DELETE_KEY, DOWN_KEY, ENTER_KEY, ESCAPE_KEY, LEFT_KEY, RIGHT_KEY, TAB_KEY, UP_KEY, V_KEY, X_KEY, Z_KEY } from "../core/config";
|
|
3
|
+
import { isInputKey } from "../core/util";
|
|
4
|
+
var ua = window.navigator.userAgent;
|
|
5
|
+
var isIE = /MSIE|Trident/.test(ua);
|
|
6
|
+
export function move(keyCode, isShiftKey) {
|
|
7
|
+
if (keyCode === TAB_KEY) {
|
|
8
|
+
return {
|
|
9
|
+
row: 0,
|
|
10
|
+
col: isShiftKey ? -1 : 1
|
|
11
|
+
};
|
|
12
|
+
} else if (keyCode === RIGHT_KEY) {
|
|
13
|
+
return {
|
|
14
|
+
row: 0,
|
|
15
|
+
col: 1
|
|
16
|
+
};
|
|
17
|
+
} else if (keyCode === LEFT_KEY) {
|
|
18
|
+
return {
|
|
19
|
+
row: 0,
|
|
20
|
+
col: -1
|
|
21
|
+
};
|
|
22
|
+
} else if (keyCode === UP_KEY) {
|
|
23
|
+
return {
|
|
24
|
+
row: -1,
|
|
25
|
+
col: 0
|
|
26
|
+
};
|
|
27
|
+
} else if (keyCode === DOWN_KEY) {
|
|
28
|
+
return {
|
|
29
|
+
row: 1,
|
|
30
|
+
col: 0
|
|
31
|
+
};
|
|
32
|
+
} else if (keyCode === ENTER_KEY) {
|
|
33
|
+
return {
|
|
34
|
+
row: isShiftKey ? -1 : 1,
|
|
35
|
+
col: 0
|
|
36
|
+
};
|
|
37
|
+
}
|
|
38
|
+
}
|
|
39
|
+
export var useKeyBoard = function useKeyBoard(handler, listenElement) {
|
|
40
|
+
var handleKey = useCallback(function (e) {
|
|
41
|
+
if (e.defaultPrevented) {
|
|
42
|
+
return;
|
|
43
|
+
}
|
|
44
|
+
var ctrlKey = e.ctrlKey,
|
|
45
|
+
metaKey = e.metaKey,
|
|
46
|
+
keyCode = e.keyCode,
|
|
47
|
+
shiftKey = e.shiftKey;
|
|
48
|
+
var ctrlKeyPressed = ctrlKey || metaKey;
|
|
49
|
+
var isEscape = keyCode === ESCAPE_KEY;
|
|
50
|
+
if (isEscape) {
|
|
51
|
+
handler.escape(e);
|
|
52
|
+
return;
|
|
53
|
+
}
|
|
54
|
+
var isReverse = ctrlKeyPressed && keyCode === Z_KEY;
|
|
55
|
+
if (isReverse) {
|
|
56
|
+
handler.reverse(e);
|
|
57
|
+
return;
|
|
58
|
+
}
|
|
59
|
+
var isCopy = ctrlKeyPressed && keyCode === C_KEY;
|
|
60
|
+
if (isCopy && isIE) {
|
|
61
|
+
handler.copy(e);
|
|
62
|
+
return;
|
|
63
|
+
}
|
|
64
|
+
var isCut = ctrlKeyPressed && keyCode === X_KEY;
|
|
65
|
+
if (isCut && isIE) {
|
|
66
|
+
handler.copy(e);
|
|
67
|
+
return;
|
|
68
|
+
}
|
|
69
|
+
var isPaste = ctrlKeyPressed && keyCode === V_KEY;
|
|
70
|
+
if (isPaste && isIE) {
|
|
71
|
+
handler.paste(e);
|
|
72
|
+
return;
|
|
73
|
+
}
|
|
74
|
+
var isDelete = keyCode === DELETE_KEY || keyCode === BACKSPACE_KEY;
|
|
75
|
+
if (isDelete) {
|
|
76
|
+
handler.delete(e);
|
|
77
|
+
return;
|
|
78
|
+
}
|
|
79
|
+
var isEnter = keyCode === ENTER_KEY;
|
|
80
|
+
if (isEnter && !shiftKey) {
|
|
81
|
+
handler.enter(e);
|
|
82
|
+
return;
|
|
83
|
+
}
|
|
84
|
+
if (ctrlKeyPressed) {
|
|
85
|
+
return;
|
|
86
|
+
}
|
|
87
|
+
var isValueInput = isInputKey(keyCode);
|
|
88
|
+
if (isValueInput) {
|
|
89
|
+
handler.otherInput(e, e.key);
|
|
90
|
+
return;
|
|
91
|
+
}
|
|
92
|
+
var moveInfo = move(keyCode, shiftKey);
|
|
93
|
+
moveInfo && handler.move(e, moveInfo);
|
|
94
|
+
}, [handler]);
|
|
95
|
+
useEffect(function () {
|
|
96
|
+
if (!listenElement) return;
|
|
97
|
+
listenElement.addEventListener('keydown', handleKey);
|
|
98
|
+
document.addEventListener('copy', handler.copy);
|
|
99
|
+
document.addEventListener('paste', handler.paste);
|
|
100
|
+
document.addEventListener('cut', handler.cut);
|
|
101
|
+
return function () {
|
|
102
|
+
listenElement.removeEventListener('keydown', handleKey);
|
|
103
|
+
document.removeEventListener('copy', handler.copy);
|
|
104
|
+
document.removeEventListener('paste', handler.paste);
|
|
105
|
+
document.removeEventListener('cut', handler.cut);
|
|
106
|
+
};
|
|
107
|
+
}, [listenElement]);
|
|
108
|
+
};
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
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
|
+
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
|
+
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; } }
|
|
6
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
7
|
+
import * as React from 'react';
|
|
8
|
+
export var useMiddlewareReducer = function useMiddlewareReducer(reducer, initialState) {
|
|
9
|
+
var middleware = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
|
|
10
|
+
var _React$useState = React.useState(initialState),
|
|
11
|
+
_React$useState2 = _slicedToArray(_React$useState, 2),
|
|
12
|
+
state = _React$useState2[0],
|
|
13
|
+
setState = _React$useState2[1];
|
|
14
|
+
var stateRef = React.useRef(state);
|
|
15
|
+
var dispatch = React.useMemo(function () {
|
|
16
|
+
var dispatch = function dispatch() {
|
|
17
|
+
throw new Error("Dispatching while constructing your middleware is not allowed. " + "Other middleware would not be applied to this dispatch.");
|
|
18
|
+
};
|
|
19
|
+
var middlewareAPI = {
|
|
20
|
+
getState: function getState() {
|
|
21
|
+
return stateRef.current;
|
|
22
|
+
},
|
|
23
|
+
dispatch: function (_dispatch) {
|
|
24
|
+
function dispatch(_x2) {
|
|
25
|
+
return _dispatch.apply(this, arguments);
|
|
26
|
+
}
|
|
27
|
+
dispatch.toString = function () {
|
|
28
|
+
return _dispatch.toString();
|
|
29
|
+
};
|
|
30
|
+
return dispatch;
|
|
31
|
+
}(function (action) {
|
|
32
|
+
return dispatch(action);
|
|
33
|
+
})
|
|
34
|
+
};
|
|
35
|
+
var localDispatch = function localDispatch(action) {
|
|
36
|
+
stateRef.current = reducer(stateRef.current, action);
|
|
37
|
+
setState(stateRef.current);
|
|
38
|
+
};
|
|
39
|
+
dispatch = middleware.map(function (middleware) {
|
|
40
|
+
return middleware(middlewareAPI);
|
|
41
|
+
}).reduceRight(function (acc, middleware) {
|
|
42
|
+
return middleware(acc);
|
|
43
|
+
}, localDispatch);
|
|
44
|
+
return dispatch;
|
|
45
|
+
}, []);
|
|
46
|
+
return [state, dispatch];
|
|
47
|
+
};
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
import { debounce } from 'lodash';
|
|
2
|
+
import { useCallback, useEffect } from 'react';
|
|
3
|
+
export var useMouse = function useMouse(handler, listenElement) {
|
|
4
|
+
var mouseUp = handler.mouseUp,
|
|
5
|
+
mouseDown = handler.mouseDown,
|
|
6
|
+
mouseOver = handler.mouseOver,
|
|
7
|
+
mouseLeave = handler.mouseLeave,
|
|
8
|
+
mouseEnter = handler.mouseEnter,
|
|
9
|
+
doubleClick = handler.doubleClick,
|
|
10
|
+
loseFocus = handler.loseFocus;
|
|
11
|
+
|
|
12
|
+
// todo
|
|
13
|
+
var wrapper = useCallback(function (handle) {
|
|
14
|
+
return function (e) {
|
|
15
|
+
if (!listenElement.contains(e.target)) {
|
|
16
|
+
return;
|
|
17
|
+
}
|
|
18
|
+
handle(e);
|
|
19
|
+
};
|
|
20
|
+
}, [listenElement]);
|
|
21
|
+
|
|
22
|
+
// useEffect(() => {
|
|
23
|
+
// if (!listenElement) return;
|
|
24
|
+
// }, [mouseUp]);
|
|
25
|
+
useEffect(function () {
|
|
26
|
+
if (!listenElement) return;
|
|
27
|
+
var debounceOver = debounce(mouseOver, 10);
|
|
28
|
+
var wrappedMouseUp = mouseUp;
|
|
29
|
+
var wrappedMouseDown = function wrappedMouseDown(e) {
|
|
30
|
+
if (!listenElement.contains(e.target)) {
|
|
31
|
+
loseFocus(e);
|
|
32
|
+
return;
|
|
33
|
+
}
|
|
34
|
+
mouseDown(e);
|
|
35
|
+
};
|
|
36
|
+
var wrappedMouseDoubleClick = wrapper(doubleClick);
|
|
37
|
+
document.addEventListener('mouseup', wrappedMouseUp);
|
|
38
|
+
document.addEventListener('mousedown', wrappedMouseDown);
|
|
39
|
+
document.addEventListener('dblclick', wrappedMouseDoubleClick);
|
|
40
|
+
listenElement.addEventListener('mouseover', debounceOver);
|
|
41
|
+
listenElement.addEventListener('mouseleave', mouseLeave);
|
|
42
|
+
listenElement.addEventListener('mouseenter', mouseEnter);
|
|
43
|
+
return function () {
|
|
44
|
+
listenElement.removeEventListener('mouseover', debounceOver);
|
|
45
|
+
listenElement.removeEventListener('mouseleave', mouseLeave);
|
|
46
|
+
listenElement.removeEventListener('mouseenter', mouseEnter);
|
|
47
|
+
document.removeEventListener('mousedown', wrappedMouseUp);
|
|
48
|
+
document.removeEventListener('mouseup', wrappedMouseDown);
|
|
49
|
+
document.removeEventListener('dblclick', wrappedMouseDoubleClick);
|
|
50
|
+
};
|
|
51
|
+
}, [listenElement, mouseUp, mouseDown, mouseOver, mouseLeave, doubleClick, loseFocus]);
|
|
52
|
+
};
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
2
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
3
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
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(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
|
|
6
|
+
function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
7
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
8
|
+
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."); }
|
|
9
|
+
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); }
|
|
10
|
+
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; }
|
|
11
|
+
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; } }
|
|
12
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
13
|
+
import { useCallback, useState } from 'react';
|
|
14
|
+
var useSetState = function useSetState() {
|
|
15
|
+
var initialState = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
|
16
|
+
var _useState = useState(initialState),
|
|
17
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
18
|
+
state = _useState2[0],
|
|
19
|
+
setState = _useState2[1];
|
|
20
|
+
var setMergeState = useCallback(function (patch) {
|
|
21
|
+
setState(function (prevState) {
|
|
22
|
+
return _objectSpread(_objectSpread({}, prevState), typeof patch === 'function' ? patch(prevState) : patch);
|
|
23
|
+
});
|
|
24
|
+
}, []);
|
|
25
|
+
return [state, setMergeState];
|
|
26
|
+
};
|
|
27
|
+
export { useSetState };
|
package/dist/index.js
ADDED
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
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
|
+
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
|
+
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; } }
|
|
6
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
7
|
+
export var formatPrecision = function formatPrecision(value) {
|
|
8
|
+
var precision = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 2;
|
|
9
|
+
if (Number.isNaN(Number(value)) || value === null || value === 0) {
|
|
10
|
+
return '0';
|
|
11
|
+
}
|
|
12
|
+
var b = Math.pow(10, precision);
|
|
13
|
+
var res = Math.round(Number(value) * b) / b;
|
|
14
|
+
return res.toFixed(precision);
|
|
15
|
+
};
|
|
16
|
+
|
|
17
|
+
/**
|
|
18
|
+
* 千位分隔符
|
|
19
|
+
* @param value 需要千分符格式化的数据
|
|
20
|
+
* @returns 含千分符的字符串
|
|
21
|
+
*/
|
|
22
|
+
export var thousandsSeparator = function thousandsSeparator(value) {
|
|
23
|
+
var _String$split = String(value).split('.'),
|
|
24
|
+
_String$split2 = _slicedToArray(_String$split, 2),
|
|
25
|
+
integer = _String$split2[0],
|
|
26
|
+
decimal = _String$split2[1];
|
|
27
|
+
var formattedData = integer.replace(/(\d{1,3})(?=(\d{3})+$)/g, '$1,');
|
|
28
|
+
if (decimal && decimal.length) {
|
|
29
|
+
formattedData += ".".concat(decimal);
|
|
30
|
+
}
|
|
31
|
+
return formattedData;
|
|
32
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
declare module '*.less';
|
|
@@ -0,0 +1,209 @@
|
|
|
1
|
+
declare namespace Sheet {
|
|
2
|
+
type Cell = {
|
|
3
|
+
id: string;
|
|
4
|
+
key?: string;
|
|
5
|
+
readonly?: boolean;
|
|
6
|
+
component?: CellViewer;
|
|
7
|
+
editable?: boolean;
|
|
8
|
+
colSpan?: number;
|
|
9
|
+
rowSpan?: number;
|
|
10
|
+
width?: number;
|
|
11
|
+
record?: Record<string, unknown>;
|
|
12
|
+
disableEvents?: boolean;
|
|
13
|
+
dataEditor?: CellEditor;
|
|
14
|
+
valueViewer?: CellViewer;
|
|
15
|
+
className?: string;
|
|
16
|
+
align?: 'left' | 'center' | 'right';
|
|
17
|
+
fixed?: 'left' | 'right';
|
|
18
|
+
value?: string | number | null;
|
|
19
|
+
};
|
|
20
|
+
|
|
21
|
+
type CellEditorProps = {
|
|
22
|
+
value: unknown;
|
|
23
|
+
cell?: Cell;
|
|
24
|
+
onChange: (value) => void;
|
|
25
|
+
onConfirm: (value) => void;
|
|
26
|
+
};
|
|
27
|
+
|
|
28
|
+
type CellViewerProps = {
|
|
29
|
+
value: unknown;
|
|
30
|
+
record?: Record<string, unknown>;
|
|
31
|
+
row: number;
|
|
32
|
+
col: number;
|
|
33
|
+
cell?: Cell;
|
|
34
|
+
};
|
|
35
|
+
|
|
36
|
+
type CellEditor = React.FC<CellEditorProps> & {
|
|
37
|
+
checker?: (value: unknown) => boolean;
|
|
38
|
+
formatter?: (value: unknown) => unknown;
|
|
39
|
+
};
|
|
40
|
+
type CellViewer = React.FC<CellViewerProps>;
|
|
41
|
+
|
|
42
|
+
type CellPosition = {
|
|
43
|
+
row: number;
|
|
44
|
+
col: number;
|
|
45
|
+
};
|
|
46
|
+
|
|
47
|
+
type CellData = {
|
|
48
|
+
id: string;
|
|
49
|
+
cell: Cell;
|
|
50
|
+
row: number;
|
|
51
|
+
col: number;
|
|
52
|
+
value?: string;
|
|
53
|
+
};
|
|
54
|
+
|
|
55
|
+
type CellNavigable = (cell?: Cell, row?: number, col?: number) => boolean;
|
|
56
|
+
type CellChangeHandler = (cells: CellData[], additions?: CellData[]) => void;
|
|
57
|
+
|
|
58
|
+
type RowGroup = {
|
|
59
|
+
groupName: string;
|
|
60
|
+
groupStart: number;
|
|
61
|
+
groupEnd: number;
|
|
62
|
+
};
|
|
63
|
+
type RowGroupConfig = {
|
|
64
|
+
groups: RowGroup[];
|
|
65
|
+
groupOpen: boolean[];
|
|
66
|
+
};
|
|
67
|
+
type MenuRenderProps = {
|
|
68
|
+
position?: { top: number; left: number };
|
|
69
|
+
cell?: Sheet.CellPosition;
|
|
70
|
+
onContextMenu?: (event: any) => void;
|
|
71
|
+
};
|
|
72
|
+
|
|
73
|
+
type SheetInstance = {
|
|
74
|
+
zoomTo: (row?: number) => void;
|
|
75
|
+
pushToHistory: (value: OperateHistory) => void;
|
|
76
|
+
selectRow: (row?: number) => void;
|
|
77
|
+
popHistory: () => OperateHistory;
|
|
78
|
+
};
|
|
79
|
+
|
|
80
|
+
type SheetProps = {
|
|
81
|
+
sheetInstance?: React.MutableRefObject<Sheet.SheetInstance | null>;
|
|
82
|
+
sheetRenderer?: any;
|
|
83
|
+
rowRenderer?: any;
|
|
84
|
+
className?: string;
|
|
85
|
+
data: Cell[][];
|
|
86
|
+
freePaste?: boolean;
|
|
87
|
+
virtualized?: boolean;
|
|
88
|
+
|
|
89
|
+
groupConfig?: RowGroupConfig;
|
|
90
|
+
|
|
91
|
+
onCellsChanged?: CellChangeHandler;
|
|
92
|
+
menuRenderer?: React.FC<MenuRenderProps>;
|
|
93
|
+
onContextMenu?: (event: any) => void;
|
|
94
|
+
|
|
95
|
+
scroll?: { x?: number | string; y?: number | string };
|
|
96
|
+
rowClassName?:
|
|
97
|
+
| string
|
|
98
|
+
| ((record: Record<string, unknown>, index: number) => string);
|
|
99
|
+
children?: (React.Element | null)[];
|
|
100
|
+
};
|
|
101
|
+
|
|
102
|
+
type SheetShell = Pick<SheetTable.TableProps, 'columns'> & {
|
|
103
|
+
className?: string;
|
|
104
|
+
showGroup?: boolean;
|
|
105
|
+
showSelect?: boolean;
|
|
106
|
+
controlWidth?: number;
|
|
107
|
+
controlProps?: {
|
|
108
|
+
check?: {
|
|
109
|
+
checked: boolean;
|
|
110
|
+
indeterminate?: boolean;
|
|
111
|
+
};
|
|
112
|
+
group?: {
|
|
113
|
+
open: boolean;
|
|
114
|
+
};
|
|
115
|
+
};
|
|
116
|
+
};
|
|
117
|
+
|
|
118
|
+
type SheetRow = {
|
|
119
|
+
row: number;
|
|
120
|
+
cells: Cell[];
|
|
121
|
+
selected: boolean;
|
|
122
|
+
children: React.ElementType;
|
|
123
|
+
};
|
|
124
|
+
|
|
125
|
+
// todo
|
|
126
|
+
type windowAssertion = {
|
|
127
|
+
clipboardData?: {
|
|
128
|
+
getData?: (type: string) => string;
|
|
129
|
+
setData?: (type: string, data: string) => string;
|
|
130
|
+
};
|
|
131
|
+
};
|
|
132
|
+
|
|
133
|
+
type refAssertion = {
|
|
134
|
+
contains?: (target: EventTarget | null) => boolean;
|
|
135
|
+
focus?: () => boolean;
|
|
136
|
+
} & HTMLSpanElement;
|
|
137
|
+
|
|
138
|
+
type AttributesRenderer = (
|
|
139
|
+
cell: Sheet.Cell,
|
|
140
|
+
row: number,
|
|
141
|
+
col: number,
|
|
142
|
+
) => Record<string, string>;
|
|
143
|
+
|
|
144
|
+
type CellProps = {
|
|
145
|
+
row: number;
|
|
146
|
+
col: number;
|
|
147
|
+
cell: Cell;
|
|
148
|
+
cellRenderer?: React.ElementType;
|
|
149
|
+
dataEditor?: React.ElementType;
|
|
150
|
+
valueViewer?: React.ElementType;
|
|
151
|
+
attributesRenderer?: AttributesRenderer;
|
|
152
|
+
};
|
|
153
|
+
|
|
154
|
+
type UpdateStateType = {
|
|
155
|
+
eventBus: EventEmitter;
|
|
156
|
+
start: Sheet.CellPosition;
|
|
157
|
+
end: Sheet.CellPosition;
|
|
158
|
+
selecting: boolean;
|
|
159
|
+
forceEdit: boolean;
|
|
160
|
+
clear: CellPosition;
|
|
161
|
+
editing: CellPosition & { value?: string };
|
|
162
|
+
history: OperateHistory[];
|
|
163
|
+
freePaste?: boolean;
|
|
164
|
+
data: Cell[][];
|
|
165
|
+
mouseDown: boolean;
|
|
166
|
+
lastSelected?: { start?: Sheet.CellPosition; end?: Sheet.CellPosition };
|
|
167
|
+
groupConfig?: {
|
|
168
|
+
groups: RowGroup[];
|
|
169
|
+
groupOpen: boolean[];
|
|
170
|
+
};
|
|
171
|
+
lastFocus: { id: string; col: number }[];
|
|
172
|
+
lastEditing: CellPosition & { confirm?: boolean };
|
|
173
|
+
cellChangeHandler: (cells: CellData[], additions?: CellData[]) => void;
|
|
174
|
+
};
|
|
175
|
+
type UpdateFocus = (start: CellPosition, end: CellPosition) => void;
|
|
176
|
+
|
|
177
|
+
type Options<T> = {
|
|
178
|
+
value: string;
|
|
179
|
+
label: string;
|
|
180
|
+
} & T;
|
|
181
|
+
|
|
182
|
+
type OptionsType = Options<{
|
|
183
|
+
disabled?: boolean;
|
|
184
|
+
children?: Common.Option<{
|
|
185
|
+
children?: Common.Options<Record<string, unknown>>;
|
|
186
|
+
}>;
|
|
187
|
+
}>;
|
|
188
|
+
|
|
189
|
+
type OperateHistory = {
|
|
190
|
+
changes: Partial<CellData>[];
|
|
191
|
+
type: OperateType;
|
|
192
|
+
|
|
193
|
+
rowInfo?: {
|
|
194
|
+
newRow?: number;
|
|
195
|
+
deleteRow?: number;
|
|
196
|
+
};
|
|
197
|
+
extraInfo?: Record<string, unknown>;
|
|
198
|
+
};
|
|
199
|
+
|
|
200
|
+
type OperateType =
|
|
201
|
+
// 前三个Type 直接调用 onCellChange
|
|
202
|
+
| 'Edit'
|
|
203
|
+
| 'Paste'
|
|
204
|
+
| 'Delete'
|
|
205
|
+
// 后三个单独Event 处理
|
|
206
|
+
| 'DeleteRow'
|
|
207
|
+
| 'NewRow'
|
|
208
|
+
| 'Custom';
|
|
209
|
+
}
|
|
File without changes
|
package/package.json
ADDED
|
@@ -0,0 +1,84 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@zhenliang/sheet",
|
|
3
|
+
"version": "0.0.1",
|
|
4
|
+
"description": "A react library developed with dumi",
|
|
5
|
+
"license": "MIT",
|
|
6
|
+
"module": "dist/index.js",
|
|
7
|
+
"types": "dist/index.d.ts",
|
|
8
|
+
"files": [
|
|
9
|
+
"dist"
|
|
10
|
+
],
|
|
11
|
+
"scripts": {
|
|
12
|
+
"build": "father build",
|
|
13
|
+
"build:watch": "father dev",
|
|
14
|
+
"dev": "dumi dev",
|
|
15
|
+
"docs:build": "dumi build",
|
|
16
|
+
"doctor": "father doctor",
|
|
17
|
+
"lint": "npm run lint:es && npm run lint:css",
|
|
18
|
+
"lint:css": "stylelint \"{src,test}/**/*.{css,less}\"",
|
|
19
|
+
"lint:es": "eslint \"{src,test}/**/*.{js,jsx,ts,tsx}\"",
|
|
20
|
+
"prepare": "husky install && dumi setup",
|
|
21
|
+
"prepublishOnly": "father doctor && npm run build",
|
|
22
|
+
"start": "npm run dev"
|
|
23
|
+
},
|
|
24
|
+
"commitlint": {
|
|
25
|
+
"extends": [
|
|
26
|
+
"@commitlint/config-conventional"
|
|
27
|
+
]
|
|
28
|
+
},
|
|
29
|
+
"lint-staged": {
|
|
30
|
+
"*.{md,json}": [
|
|
31
|
+
"prettier --write --no-error-on-unmatched-pattern"
|
|
32
|
+
],
|
|
33
|
+
"*.{css,less}": [
|
|
34
|
+
"stylelint --fix",
|
|
35
|
+
"prettier --write"
|
|
36
|
+
],
|
|
37
|
+
"*.{js,jsx}": [
|
|
38
|
+
"eslint --fix",
|
|
39
|
+
"prettier --write"
|
|
40
|
+
],
|
|
41
|
+
"*.{ts,tsx}": [
|
|
42
|
+
"eslint --fix",
|
|
43
|
+
"prettier --parser=typescript --write"
|
|
44
|
+
]
|
|
45
|
+
},
|
|
46
|
+
"dependencies": {
|
|
47
|
+
"@ant-design/icons": "^4.6.2",
|
|
48
|
+
"events": "^3.3.0",
|
|
49
|
+
"lodash": "^4.17.21",
|
|
50
|
+
"moment": "^2.29.4",
|
|
51
|
+
"redux-logger": "^3.0.6",
|
|
52
|
+
"redux-thunk": "^2.4.2"
|
|
53
|
+
},
|
|
54
|
+
"devDependencies": {
|
|
55
|
+
"@commitlint/cli": "^17.1.2",
|
|
56
|
+
"@commitlint/config-conventional": "^17.1.0",
|
|
57
|
+
"@types/lodash": "^4.14.195",
|
|
58
|
+
"@types/react": "^18.0.0",
|
|
59
|
+
"@types/react-dom": "^18.0.0",
|
|
60
|
+
"@umijs/lint": "^4.0.0",
|
|
61
|
+
"dumi": "^2.2.0",
|
|
62
|
+
"eslint": "^8.23.0",
|
|
63
|
+
"father": "^4.1.0",
|
|
64
|
+
"husky": "^8.0.1",
|
|
65
|
+
"lint-staged": "^13.0.3",
|
|
66
|
+
"prettier": "^2.7.1",
|
|
67
|
+
"prettier-plugin-organize-imports": "^3.0.0",
|
|
68
|
+
"prettier-plugin-packagejson": "^2.2.18",
|
|
69
|
+
"react": "^18.0.0",
|
|
70
|
+
"react-dom": "^18.0.0",
|
|
71
|
+
"stylelint": "^14.9.1"
|
|
72
|
+
},
|
|
73
|
+
"peerDependencies": {
|
|
74
|
+
"antd": "^4.24.0",
|
|
75
|
+
"react": ">=16.9.0",
|
|
76
|
+
"react-dom": ">=16.9.0"
|
|
77
|
+
},
|
|
78
|
+
"publishConfig": {
|
|
79
|
+
"access": "public"
|
|
80
|
+
},
|
|
81
|
+
"authors": [
|
|
82
|
+
"fizz.zhou@ap.jll.com"
|
|
83
|
+
]
|
|
84
|
+
}
|