@zhenliang/sheet 0.1.76 → 0.1.78

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.
@@ -361,7 +361,8 @@ export var sideEffectReducer = {
361
361
  dispatch({
362
362
  type: 'changes',
363
363
  payload: {
364
- history: newHistory
364
+ history: newHistory,
365
+ recoverHistory: []
365
366
  }
366
367
  });
367
368
  cellChangeHandler && cellChangeHandler(changes, undefined, 'Delete');
@@ -371,8 +372,8 @@ export var sideEffectReducer = {
371
372
  start = _getState10.start,
372
373
  end = _getState10.end,
373
374
  history = _getState10.history,
374
- _getState10$recoverHi = _getState10.recoverHisotry,
375
- recoverHisotry = _getState10$recoverHi === void 0 ? [] : _getState10$recoverHi,
375
+ _getState10$recoverHi = _getState10.recoverHistory,
376
+ recoverHistory = _getState10$recoverHi === void 0 ? [] : _getState10$recoverHi,
376
377
  cellChangeHandler = _getState10.cellChangeHandler,
377
378
  eventBus = _getState10.eventBus,
378
379
  data = _getState10.data;
@@ -386,7 +387,7 @@ export var sideEffectReducer = {
386
387
  type: 'changes',
387
388
  payload: {
388
389
  history: changeHistory,
389
- recoverHisotry: [].concat(_toConsumableArray(recoverHisotry), [change])
390
+ recoverHistory: [].concat(_toConsumableArray(recoverHistory), [change])
390
391
  }
391
392
  });
392
393
  return;
@@ -410,23 +411,23 @@ export var sideEffectReducer = {
410
411
  end: end
411
412
  },
412
413
  history: changeHistory,
413
- recoverHisotry: [].concat(_toConsumableArray(recoverHisotry), [recoverChange])
414
+ recoverHistory: [].concat(_toConsumableArray(recoverHistory), [recoverChange])
414
415
  }
415
416
  });
416
417
  },
417
418
  recover: function recover(dispatch, getState) {
418
419
  var _getState11 = getState(),
419
420
  eventBus = _getState11.eventBus,
420
- _getState11$recoverHi = _getState11.recoverHisotry,
421
- recoverHisotry = _getState11$recoverHi === void 0 ? [] : _getState11$recoverHi,
421
+ _getState11$recoverHi = _getState11.recoverHistory,
422
+ recoverHistory = _getState11$recoverHi === void 0 ? [] : _getState11$recoverHi,
422
423
  _getState11$history = _getState11.history,
423
424
  history = _getState11$history === void 0 ? [] : _getState11$history,
424
425
  cellChangeHandler = _getState11.cellChangeHandler,
425
426
  start = _getState11.start,
426
427
  end = _getState11.end,
427
428
  data = _getState11.data;
428
- if (!(recoverHisotry !== null && recoverHisotry !== void 0 && recoverHisotry.length)) return;
429
- var changeHistory = _toConsumableArray(recoverHisotry);
429
+ if (!(recoverHistory !== null && recoverHistory !== void 0 && recoverHistory.length)) return;
430
+ var changeHistory = _toConsumableArray(recoverHistory);
430
431
  var change = changeHistory.pop();
431
432
  var type = change.type;
432
433
  if (!['Edit', 'Paste', 'Delete'].includes(type)) {
@@ -434,7 +435,7 @@ export var sideEffectReducer = {
434
435
  dispatch({
435
436
  type: 'changes',
436
437
  payload: {
437
- recoverHisotry: changeHistory,
438
+ recoverHistory: changeHistory,
438
439
  history: [].concat(_toConsumableArray(history), [change])
439
440
  }
440
441
  });
@@ -459,7 +460,7 @@ export var sideEffectReducer = {
459
460
  end: end
460
461
  },
461
462
  history: [].concat(_toConsumableArray(history), [reverseChange]),
462
- recoverHisotry: changeHistory
463
+ recoverHistory: changeHistory
463
464
  }
464
465
  });
465
466
  }
@@ -10,12 +10,13 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
10
10
  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; }
11
11
  function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
12
12
  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); }
13
- import { stripRowIndex } from "../util";
13
+ import { noramlizeSearch, searchInclude, stripRowIndex } from "../util";
14
14
  export var searchReducer = {
15
15
  changeSearch: function changeSearch(state, payload) {
16
16
  var data = state.data;
17
17
  var count = 0;
18
18
  var searchResultList = [];
19
+ var normalSearchText = noramlizeSearch(payload);
19
20
  payload && (data === null || data === void 0 ? void 0 : data.forEach(function (row, i) {
20
21
  return row.forEach(function (item, j) {
21
22
  var _item$dataEditor, _item$value;
@@ -24,9 +25,8 @@ export var searchReducer = {
24
25
  }
25
26
  var formatterValue;
26
27
  if (item.searchKey) {
27
- var _formatterValue;
28
28
  formatterValue = item.searchKey(item.record);
29
- if ((_formatterValue = formatterValue) !== null && _formatterValue !== void 0 && _formatterValue.includes(payload)) {
29
+ if (searchInclude(normalSearchText, formatterValue)) {
30
30
  count++;
31
31
  searchResultList.push({
32
32
  row: i,
@@ -36,9 +36,9 @@ export var searchReducer = {
36
36
  });
37
37
  }
38
38
  } else if ((_item$dataEditor = item.dataEditor) !== null && _item$dataEditor !== void 0 && _item$dataEditor.formatter) {
39
- var _item$dataEditor2, _formatterValue2;
39
+ var _item$dataEditor2;
40
40
  formatterValue = (_item$dataEditor2 = item.dataEditor) === null || _item$dataEditor2 === void 0 || (_item$dataEditor2 = _item$dataEditor2.formatter(item.value, item.record)) === null || _item$dataEditor2 === void 0 ? void 0 : _item$dataEditor2.toString();
41
- if ((_formatterValue2 = formatterValue) !== null && _formatterValue2 !== void 0 && _formatterValue2.includes(payload)) {
41
+ if (searchInclude(normalSearchText, formatterValue)) {
42
42
  count++;
43
43
  searchResultList.push({
44
44
  row: i,
@@ -47,7 +47,7 @@ export var searchReducer = {
47
47
  formatterValue: formatterValue
48
48
  });
49
49
  }
50
- } else if ((_item$value = item.value) !== null && _item$value !== void 0 && _item$value.toString().includes(payload)) {
50
+ } else if (searchInclude(normalSearchText, (_item$value = item.value) === null || _item$value === void 0 ? void 0 : _item$value.toString())) {
51
51
  count++;
52
52
  searchResultList.push({
53
53
  row: i,
@@ -61,7 +61,8 @@ export var searchReducer = {
61
61
  searchText: payload,
62
62
  searchTotal: count,
63
63
  searchCurrent: -1,
64
- searchResultList: searchResultList
64
+ searchResultList: searchResultList,
65
+ shouldSearchUpdate: false
65
66
  });
66
67
  },
67
68
  closeSearch: function closeSearch(state) {
@@ -145,11 +146,13 @@ export var stateReducer = _objectSpread({
145
146
  return _objectSpread(_objectSpread({}, state), {}, {
146
147
  editing: undefined,
147
148
  lastEditing: state.editing,
148
- history: history
149
+ history: history,
150
+ recoverHistory: []
149
151
  });
150
152
  }
151
153
  return _objectSpread(_objectSpread({}, state), {}, {
152
- history: history
154
+ history: history,
155
+ recoverHistory: []
153
156
  });
154
157
  },
155
158
  popHistory: function popHistory(state) {
@@ -162,8 +165,13 @@ export var stateReducer = _objectSpread({
162
165
  });
163
166
  },
164
167
  pushHistory: function pushHistory(state, payload) {
168
+ var newRecoverHistory = state.recoverHistory;
169
+ if (['DeleteRow', 'NewRow'].includes(payload.type)) {
170
+ newRecoverHistory = [];
171
+ }
165
172
  return _objectSpread(_objectSpread({}, state), {}, {
166
- history: [].concat(_toConsumableArray(state.history || []), [payload])
173
+ history: [].concat(_toConsumableArray(state.history || []), [payload]),
174
+ recoverHistory: newRecoverHistory
167
175
  });
168
176
  },
169
177
  select: function select(state, payload) {
@@ -208,6 +208,16 @@ var Sheet = function Sheet(props) {
208
208
  });
209
209
  return history !== null && history !== void 0 ? history : [];
210
210
  },
211
+ dropRecover: function dropRecover() {
212
+ var recoverHistory = state.recoverHistory;
213
+ dispatch({
214
+ type: 'changes',
215
+ payload: {
216
+ recoverHistory: []
217
+ }
218
+ });
219
+ return recoverHistory !== null && recoverHistory !== void 0 ? recoverHistory : [];
220
+ },
211
221
  call: function call(caller) {
212
222
  for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
213
223
  args[_key - 1] = arguments[_key];
@@ -462,6 +472,7 @@ var Sheet = function Sheet(props) {
462
472
  current: state.searchCurrent,
463
473
  calledCount: state.searchCalledCount,
464
474
  open: state.showSearch,
475
+ shouldUpdate: state.shouldSearchUpdate,
465
476
  goNext: goNext,
466
477
  goLast: goLast,
467
478
  onChange: changeSearch,
@@ -349,16 +349,24 @@ span.harvest-sheet-container:focus {
349
349
  }
350
350
  }
351
351
 
352
+ @keyframes pop{
353
+ 0% {width:0px}
354
+ 100% {width:290px}
355
+ }
356
+
357
+
358
+
352
359
  .harvest-search-text {
353
360
  position: absolute;
354
361
  top: 0px;
355
362
  right: 0px;
356
- width: 280px;
357
363
  z-index: 4;
358
364
  font-size: 14px;
359
365
  margin: 5px;
366
+ animation: pop .5s ease;
360
367
  }
361
368
 
369
+
362
370
  .harvest-search-text .search-text-suffix {
363
371
  .search-text-disabled {
364
372
  color: #a4a9b2;
@@ -1,6 +1,7 @@
1
1
  import { CSSProperties } from 'react';
2
2
  interface SearchInputProps {
3
3
  open?: boolean;
4
+ shouldUpdate?: boolean;
4
5
  style?: Partial<CSSProperties>;
5
6
  value?: string;
6
7
  current?: number;
@@ -1,6 +1,7 @@
1
1
  import { CloseOutlined, DownOutlined, UpOutlined } from '@ant-design/icons';
2
2
  import { Divider, Input } from 'antd';
3
- import { useEffect, useRef } from 'react';
3
+ import { useEffect, useMemo, useRef } from 'react';
4
+ import { getTextWidth } from "../util";
4
5
  import { jsxs as _jsxs } from "react/jsx-runtime";
5
6
  import { jsx as _jsx } from "react/jsx-runtime";
6
7
  export var SearchInput = function SearchInput(props) {
@@ -12,6 +13,8 @@ export var SearchInput = function SearchInput(props) {
12
13
  value = props.value,
13
14
  _onChange = props.onChange,
14
15
  open = props.open,
16
+ _props$shouldUpdate = props.shouldUpdate,
17
+ shouldUpdate = _props$shouldUpdate === void 0 ? false : _props$shouldUpdate,
15
18
  onClose = props.onClose,
16
19
  goLast = props.goLast,
17
20
  goNext = props.goNext,
@@ -23,6 +26,21 @@ export var SearchInput = function SearchInput(props) {
23
26
  inputRef.current.focus();
24
27
  }
25
28
  }, [calledCount]);
29
+ var inputWidth = useMemo(function () {
30
+ var otherWidth = 140;
31
+ var textWidth = 0;
32
+ if (!value) {
33
+ textWidth = 150;
34
+ return otherWidth + textWidth;
35
+ }
36
+ textWidth = getTextWidth(value);
37
+ if (textWidth > 350) {
38
+ textWidth = 350;
39
+ } else if (textWidth < 150) {
40
+ textWidth = 150;
41
+ }
42
+ return textWidth + otherWidth;
43
+ }, [value]);
26
44
  if (!open) {
27
45
  return null;
28
46
  }
@@ -33,14 +51,23 @@ export var SearchInput = function SearchInput(props) {
33
51
  ref: inputRef,
34
52
  placeholder: "\u67E5\u627E",
35
53
  autoFocus: true,
54
+ onFocus: function onFocus(e) {
55
+ return e.target.select();
56
+ },
57
+ contentEditable: true,
36
58
  style: {
37
- height: 40
59
+ height: 40,
60
+ width: inputWidth,
61
+ minWidth: 250
38
62
  },
39
63
  value: value,
40
64
  onChange: function onChange(e) {
41
65
  return _onChange && _onChange(e.target.value);
42
66
  },
43
67
  onPressEnter: function onPressEnter(e) {
68
+ if (shouldUpdate) {
69
+ _onChange && _onChange(e.target.value);
70
+ }
44
71
  if (e.shiftKey) goLast && goLast();else goNext && goNext();
45
72
  setTimeout(function () {
46
73
  var _inputRef$current;
@@ -48,6 +48,16 @@ export var useSearchInput = function useSearchInput(state, dispatch, handlerRef)
48
48
  payload: value
49
49
  });
50
50
  }, [state.data]);
51
+ useEffect(function () {
52
+ if (state.searchText) {
53
+ dispatch({
54
+ type: 'changes',
55
+ payload: {
56
+ shouldSearchUpdate: true
57
+ }
58
+ });
59
+ }
60
+ }, [state.data]);
51
61
  useEffect(function () {
52
62
  var _state$searchResultLi2;
53
63
  if (!((_state$searchResultLi2 = state.searchResultList) !== null && _state$searchResultLi2 !== void 0 && _state$searchResultLi2.length)) {
@@ -63,3 +63,6 @@ export declare const stripRowIndex: (data: SheetType.Cell[][]) => {
63
63
  };
64
64
  export declare const ensureFocus: (container?: HTMLElement | null) => void;
65
65
  export declare const isSearchElement: (tableRootNode: HTMLDivElement, target: HTMLElement) => boolean | undefined;
66
+ export declare const noramlizeSearch: (target: string) => string;
67
+ export declare const searchInclude: (search: string, compare: string) => boolean;
68
+ export declare const getTextWidth: (text: any) => number;
package/dist/core/util.js CHANGED
@@ -499,4 +499,35 @@ export var ensureFocus = function ensureFocus(container) {
499
499
  export var isSearchElement = function isSearchElement(tableRootNode, target) {
500
500
  var _tableRootNode$nextSi;
501
501
  return (_tableRootNode$nextSi = tableRootNode.nextSibling) === null || _tableRootNode$nextSi === void 0 || (_tableRootNode$nextSi = _tableRootNode$nextSi.nextSibling) === null || _tableRootNode$nextSi === void 0 ? void 0 : _tableRootNode$nextSi.contains(target);
502
+ };
503
+ var punctuationMap = new Map([[",", ","], [":", ":"], [";", ";"]]);
504
+ export var noramlizeSearch = function noramlizeSearch(target) {
505
+ if (!target) {
506
+ return target;
507
+ }
508
+ var lower = target.toLowerCase();
509
+ // 逗号分号
510
+ punctuationMap.forEach(function (value, key) {
511
+ lower = lower.replace(new RegExp(key, "g"), value);
512
+ });
513
+ return lower;
514
+ };
515
+ export var searchInclude = function searchInclude(search, compare) {
516
+ if (!compare) {
517
+ return false;
518
+ }
519
+ var normalCompare = noramlizeSearch(compare);
520
+ return normalCompare.includes(search);
521
+ };
522
+ export var getTextWidth = function getTextWidth(text) {
523
+ // 创建隐藏的临时元素
524
+ var tempElement = document.createElement("span");
525
+ tempElement.style.visibility = "hidden";
526
+ tempElement.style.whiteSpace = "pre"; // 保持空格和换行的格式
527
+ tempElement.style.display = "inline-block";
528
+ tempElement.textContent = text;
529
+ document.body.appendChild(tempElement);
530
+ var width = tempElement.offsetWidth;
531
+ document.body.removeChild(tempElement);
532
+ return width;
502
533
  };
@@ -160,19 +160,22 @@ var columns = [{
160
160
  width: 200,
161
161
  dataIndex: 'address5',
162
162
  key: '6'
163
- }, {
164
- title: 'Column 7',
165
- width: 200,
166
- dataIndex: 'address6',
167
- key: '7',
168
- fixed: 'right'
169
- }, {
170
- title: 'Column 8',
171
- width: 200,
172
- dataIndex: 'address7',
173
- key: '8',
174
- fixed: 'right'
175
- }, {
163
+ },
164
+ // {
165
+ // title: 'Column 7',
166
+ // width: 200,
167
+ // dataIndex: 'address6',
168
+ // key: '7',
169
+ // fixed: 'right',
170
+ // },
171
+ // {
172
+ // title: 'Column 8',
173
+ // width: 200,
174
+ // dataIndex: 'address7',
175
+ // key: '8',
176
+ // fixed: 'right',
177
+ // },
178
+ {
176
179
  title: 'Action',
177
180
  align: SheetType.CellAlign.center,
178
181
  key: 'operation',
@@ -218,7 +221,6 @@ var App = function App() {
218
221
  setOptions = _useState4[1];
219
222
  var sheetInstance = useRef(null);
220
223
  var handleChange = useCallback(function (changes, extChange) {
221
- // console.log(extChange);
222
224
  var newState = cloneDeep(state);
223
225
  changes.forEach(function (change) {
224
226
  var row = change.row,
@@ -52,11 +52,19 @@ export var useKeyBoard = function useKeyBoard(handler, listenElement) {
52
52
  handler.escape(e);
53
53
  return;
54
54
  }
55
+ var isEnter = keyCode === ENTER_KEY;
56
+ if (isEnter && !shiftKey) {
57
+ handler.enter(e);
58
+ return;
59
+ }
55
60
  var isSearch = ctrlKeyPressed && keyCode === F_KEY;
56
61
  if (isSearch) {
57
62
  handler.search(e);
58
63
  return;
59
64
  }
65
+ if (e.target !== listenElement) {
66
+ return;
67
+ }
60
68
  var isReverse = ctrlKeyPressed && keyCode === Z_KEY && !shiftKey;
61
69
  if (isReverse) {
62
70
  handler.reverse(e);
@@ -91,11 +99,6 @@ export var useKeyBoard = function useKeyBoard(handler, listenElement) {
91
99
  handler.delete(e);
92
100
  return;
93
101
  }
94
- var isEnter = keyCode === ENTER_KEY;
95
- if (isEnter && !shiftKey) {
96
- handler.enter(e);
97
- return;
98
- }
99
102
  if (ctrlKeyPressed) {
100
103
  return;
101
104
  }
@@ -196,6 +196,7 @@ export type CellProps = {
196
196
  };
197
197
  export type SearchState = {
198
198
  showSearch: boolean;
199
+ shouldSearchUpdate: boolean;
199
200
  searchText: string;
200
201
  searchTotal: number;
201
202
  searchCurrent: number;
@@ -213,7 +214,7 @@ export type UpdateStateType = {
213
214
  value?: string;
214
215
  };
215
216
  history: OperateHistory[];
216
- recoverHisotry: OperateHistory[];
217
+ recoverHistory: OperateHistory[];
217
218
  freePaste?: boolean;
218
219
  data: Cell[][];
219
220
  mouseDown: boolean;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zhenliang/sheet",
3
- "version": "0.1.76",
3
+ "version": "0.1.78",
4
4
  "description": "A react library developed with dumi",
5
5
  "license": "MIT",
6
6
  "module": "dist/index.js",