@zhenliang/sheet 0.1.50 → 0.1.52

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.
@@ -8,6 +8,7 @@ export declare const DOWN_KEY = 40;
8
8
  export declare const DELETE_KEY = 46;
9
9
  export declare const BACKSPACE_KEY = 8;
10
10
  export declare const Z_KEY = 90;
11
+ export declare const F_KEY = 70;
11
12
  export declare const C_KEY = 67;
12
13
  export declare const V_KEY = 86;
13
14
  export declare const X_KEY = 88;
@@ -8,6 +8,7 @@ export var DOWN_KEY = 40;
8
8
  export var DELETE_KEY = 46;
9
9
  export var BACKSPACE_KEY = 8;
10
10
  export var Z_KEY = 90;
11
+ export var F_KEY = 70;
11
12
  export var C_KEY = 67;
12
13
  export var V_KEY = 86;
13
14
  export var X_KEY = 88;
@@ -1,5 +1,5 @@
1
1
  import type { SheetType } from "../../type";
2
- export type SheetAction = 'change' | 'changes' | 'rowMove' | 'colMove' | 'editFinish' | 'pushHistory' | 'popHistory' | 'select' | 'selectOneRow' | 'clearSelect' | 'clearSelectIfNotSingleRow' | 'clearEdit' | 'mouseDown' | 'mouseOver' | 'mouseUp' | 'selectRow' | 'selectCol' | 'loseFocus' | 'doubleClick' | 'mouseLeaveInterval' | 'move' | 'selectAll' | 'escape' | 'reverse' | 'delete' | 'enter' | 'otherInput' | 'none';
2
+ export type SheetAction = 'change' | 'changes' | 'rowMove' | 'colMove' | 'editFinish' | 'pushHistory' | 'popHistory' | 'select' | 'selectOneRow' | 'changeSearch' | 'closeSearch' | 'openSearch' | 'clearSelect' | 'clearSelectIfNotSingleRow' | 'clearEdit' | 'mouseDown' | 'mouseOver' | 'mouseUp' | 'selectRow' | 'selectCol' | 'loseFocus' | 'doubleClick' | 'mouseLeaveInterval' | 'move' | 'selectAll' | 'escape' | 'reverse' | 'delete' | 'enter' | 'otherInput' | 'none';
3
3
  export type reducerAction = (type: Partial<SheetType.UpdateStateType>, payload?: unknown) => Partial<SheetType.UpdateStateType>;
4
4
  declare const sheetReducer: (state: Partial<SheetType.UpdateStateType>, action: {
5
5
  type: SheetAction;
@@ -15,6 +15,9 @@ var sheetReducer = function sheetReducer(state, action) {
15
15
  case 'clearSelect':
16
16
  case 'clearSelectIfNotSingleRow':
17
17
  case 'clearEdit':
18
+ case 'changeSearch':
19
+ case 'closeSearch':
20
+ case 'openSearch':
18
21
  return stateReducer[action.type](state, action.payload);
19
22
  case 'mouseDown':
20
23
  case 'mouseOver':
@@ -150,7 +150,13 @@ export var mouseReducer = {
150
150
  lastSelected: {
151
151
  start: state.start,
152
152
  end: state.end
153
- }
153
+ },
154
+ searchText: '',
155
+ showSearch: false,
156
+ searchTotal: 0,
157
+ searchCurrent: 0,
158
+ searchCalledCount: 0,
159
+ searchResultList: []
154
160
  });
155
161
  },
156
162
  doubleClick: function doubleClick(state, payload) {
@@ -1,2 +1,3 @@
1
1
  import { reducerAction } from '.';
2
+ export declare const searchReducer: Record<string, reducerAction>;
2
3
  export declare const stateReducer: Record<string, reducerAction>;
@@ -11,7 +11,78 @@ function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key i
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
13
  import { SheetType } from "../..";
14
- export var stateReducer = {
14
+ export var searchReducer = {
15
+ changeSearch: function changeSearch(state, payload) {
16
+ var data = state.data;
17
+ var count = 0;
18
+ var searchResultList = [];
19
+ payload && (data === null || data === void 0 ? void 0 : data.forEach(function (row, i) {
20
+ return row.forEach(function (item, j) {
21
+ var _item$dataEditor, _item$value;
22
+ if (item.fixed) {
23
+ return;
24
+ }
25
+ var formatterValue;
26
+ if (item.searchKey) {
27
+ var _formatterValue;
28
+ formatterValue = item.searchKey(item.record);
29
+ if ((_formatterValue = formatterValue) !== null && _formatterValue !== void 0 && _formatterValue.includes(payload)) {
30
+ count++;
31
+ searchResultList.push({
32
+ row: i,
33
+ col: j,
34
+ value: item.value,
35
+ formatterValue: formatterValue
36
+ });
37
+ }
38
+ } else if ((_item$dataEditor = item.dataEditor) !== null && _item$dataEditor !== void 0 && _item$dataEditor.formatter) {
39
+ var _item$dataEditor2, _formatterValue2;
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)) {
42
+ count++;
43
+ searchResultList.push({
44
+ row: i,
45
+ col: j,
46
+ value: item.value,
47
+ formatterValue: formatterValue
48
+ });
49
+ }
50
+ } else if ((_item$value = item.value) !== null && _item$value !== void 0 && _item$value.toString().includes(payload)) {
51
+ count++;
52
+ searchResultList.push({
53
+ row: i,
54
+ col: j,
55
+ value: item.value
56
+ });
57
+ }
58
+ });
59
+ }));
60
+ return _objectSpread(_objectSpread({}, state), {}, {
61
+ searchText: payload,
62
+ searchTotal: count,
63
+ searchCurrent: -1,
64
+ searchResultList: searchResultList
65
+ });
66
+ },
67
+ closeSearch: function closeSearch(state) {
68
+ return _objectSpread(_objectSpread({}, state), {}, {
69
+ searchText: '',
70
+ showSearch: false,
71
+ searchTotal: 0,
72
+ searchCurrent: 0,
73
+ searchCalledCount: 0,
74
+ searchResultList: []
75
+ });
76
+ },
77
+ openSearch: function openSearch(state) {
78
+ var _state$searchCalledCo;
79
+ return _objectSpread(_objectSpread({}, state), {}, {
80
+ showSearch: true,
81
+ searchCalledCount: ((_state$searchCalledCo = state.searchCalledCount) !== null && _state$searchCalledCo !== void 0 ? _state$searchCalledCo : 0) + 1
82
+ });
83
+ }
84
+ };
85
+ export var stateReducer = _objectSpread({
15
86
  change: function change(state, payload) {
16
87
  var _ref = payload,
17
88
  key = _ref.key,
@@ -171,4 +242,4 @@ export var stateReducer = {
171
242
  lastEditing: editing
172
243
  });
173
244
  }
174
- };
245
+ }, searchReducer);
@@ -25,8 +25,11 @@ import { useKeyBoardEvent } from "./useKeyBoardEvent";
25
25
  import { useMouseEvent } from "./useMouseEvent";
26
26
  import { useSelectVisible } from "./useSelectVisible";
27
27
  import { VirtualizeEnd, VirtualizeStart, useVirtualList } from "./useVirtualList";
28
+ import { SearchInput } from "./searchInput";
29
+ import { useSearchInput } from "./useSearchInput";
28
30
  import { jsx as _jsx } from "react/jsx-runtime";
29
31
  import { jsxs as _jsxs } from "react/jsx-runtime";
32
+ import { Fragment as _Fragment } from "react/jsx-runtime";
30
33
  var Sheet = function Sheet(props) {
31
34
  var _visibleData$length, _scroll$y, _scroll$x;
32
35
  var _props$sheetInstance = props.sheetInstance,
@@ -138,6 +141,16 @@ var Sheet = function Sheet(props) {
138
141
  type: 'popHistory'
139
142
  });
140
143
  return history !== null && history !== void 0 && history.length ? history === null || history === void 0 ? void 0 : history[history.length - 1] : {};
144
+ },
145
+ dropHistory: function dropHistory() {
146
+ var history = state.history;
147
+ dispatch({
148
+ type: 'changes',
149
+ payload: {
150
+ history: []
151
+ }
152
+ });
153
+ return history !== null && history !== void 0 ? history : [];
141
154
  }
142
155
  };
143
156
  }, [state.history]);
@@ -188,6 +201,11 @@ var Sheet = function Sheet(props) {
188
201
  virtualEnd = _useVirtualList.virtualEnd,
189
202
  paddingTop = _useVirtualList.paddingTop,
190
203
  paddingBottom = _useVirtualList.paddingBottom;
204
+ var _useSearchInput = useSearchInput(state, dispatch, sheetInstance),
205
+ closeSearch = _useSearchInput.closeSearch,
206
+ changeSearch = _useSearchInput.changeSearch,
207
+ goNext = _useSearchInput.goNext,
208
+ goLast = _useSearchInput.goLast;
191
209
  useEffect(function () {
192
210
  dispatch({
193
211
  type: 'clearEdit'
@@ -234,44 +252,57 @@ var Sheet = function Sheet(props) {
234
252
  var hasHorizontalScrollbar = sheetWrapperRef.current && sheetWrapperRef.current.scrollWidth > sheetWrapperRef.current.clientWidth;
235
253
  return /*#__PURE__*/_jsx(SheetEventContext.Provider, {
236
254
  value: eventBus,
237
- children: /*#__PURE__*/_jsxs("span", {
255
+ children: /*#__PURE__*/_jsxs(_Fragment, {
238
256
  children: [/*#__PURE__*/_jsxs("span", {
239
- ref: sheetWrapperRef,
240
- tabIndex: 0,
241
- className: classNames('harvest harvest-sheet-container', className, hasHorizontalScrollbar && boldScroll ? 'tableWarpScroll' : null, hideColBar ? 'hideColBar' : null),
242
- style: {
243
- maxHeight: (_scroll$y = scroll === null || scroll === void 0 ? void 0 : scroll.y) !== null && _scroll$y !== void 0 ? _scroll$y : memoHeight,
244
- width: (_scroll$x = scroll === null || scroll === void 0 ? void 0 : scroll.x) !== null && _scroll$x !== void 0 ? _scroll$x : '100%'
245
- },
246
- children: [/*#__PURE__*/_jsxs(SheetShell, {
247
- className: classNames('harvest-sheet', className),
248
- children: [/*#__PURE__*/_jsx(VirtualizeStart, {
249
- virtualized: virtualized,
250
- paddingTop: paddingTop
251
- }), rowElements, /*#__PURE__*/_jsx(VirtualizeEnd, {
252
- virtualized: virtualized,
253
- paddingBottom: paddingBottom
254
- })]
255
- }, "sheet"), /*#__PURE__*/_jsx(Menu, {
256
- ref: contextMenuRef,
257
- position: menu.position,
258
- cell: menu.cellPosition,
259
- showMenu: menu.showMenu,
260
- contextMenu: ContextMenu,
261
- onContextMenu: onContextMenu
262
- })]
263
- }), EmptyElement, /*#__PURE__*/_jsxs("div", {
264
- className: "harvest-sheet-control",
265
- children: [children, /*#__PURE__*/_jsx(Control, {
266
- showBackEdit: showBackEdit,
267
- startRowVisible: startRowVisible,
268
- handelClick: function handelClick() {
269
- var _sheetInstance$curren;
270
- return sheetInstance === null || sheetInstance === void 0 || (_sheetInstance$curren = sheetInstance.current) === null || _sheetInstance$curren === void 0 ? void 0 : _sheetInstance$curren.zoomTo();
257
+ children: [/*#__PURE__*/_jsxs("span", {
258
+ ref: sheetWrapperRef,
259
+ tabIndex: 0,
260
+ className: classNames('harvest harvest-sheet-container', className, hasHorizontalScrollbar && boldScroll ? 'tableWarpScroll' : null, hideColBar ? 'hideColBar' : null),
261
+ style: {
262
+ maxHeight: (_scroll$y = scroll === null || scroll === void 0 ? void 0 : scroll.y) !== null && _scroll$y !== void 0 ? _scroll$y : memoHeight,
263
+ width: (_scroll$x = scroll === null || scroll === void 0 ? void 0 : scroll.x) !== null && _scroll$x !== void 0 ? _scroll$x : '100%'
271
264
  },
272
- direction: direction,
273
- backEditStyle: backEditStyle
265
+ children: [/*#__PURE__*/_jsxs(SheetShell, {
266
+ className: classNames('harvest-sheet', className),
267
+ children: [/*#__PURE__*/_jsx(VirtualizeStart, {
268
+ virtualized: virtualized,
269
+ paddingTop: paddingTop
270
+ }), rowElements, /*#__PURE__*/_jsx(VirtualizeEnd, {
271
+ virtualized: virtualized,
272
+ paddingBottom: paddingBottom
273
+ })]
274
+ }, "sheet"), /*#__PURE__*/_jsx(Menu, {
275
+ ref: contextMenuRef,
276
+ position: menu.position,
277
+ cell: menu.cellPosition,
278
+ showMenu: menu.showMenu,
279
+ contextMenu: ContextMenu,
280
+ onContextMenu: onContextMenu
281
+ }), EmptyElement]
282
+ }), /*#__PURE__*/_jsxs("div", {
283
+ className: "harvest-sheet-control",
284
+ children: [children, /*#__PURE__*/_jsx(Control, {
285
+ showBackEdit: showBackEdit,
286
+ startRowVisible: startRowVisible,
287
+ handelClick: function handelClick() {
288
+ var _sheetInstance$curren;
289
+ return sheetInstance === null || sheetInstance === void 0 || (_sheetInstance$curren = sheetInstance.current) === null || _sheetInstance$curren === void 0 ? void 0 : _sheetInstance$curren.zoomTo();
290
+ },
291
+ direction: direction,
292
+ backEditStyle: backEditStyle
293
+ })]
274
294
  })]
295
+ }), /*#__PURE__*/_jsx(SearchInput, {
296
+ style: props.searchStyle,
297
+ value: state.searchText,
298
+ total: state.searchTotal,
299
+ current: state.searchCurrent,
300
+ calledCount: state.searchCalledCount,
301
+ open: state.showSearch,
302
+ goNext: goNext,
303
+ goLast: goLast,
304
+ onChange: changeSearch,
305
+ onClose: closeSearch
275
306
  })]
276
307
  })
277
308
  });
@@ -336,6 +336,31 @@ span.harvest-sheet-container:focus {
336
336
  border-radius: 2px;
337
337
  }
338
338
 
339
+ .harvest-search-text {
340
+ position: absolute;
341
+ top: 0px;
342
+ right: 0px;
343
+ width: 280px;
344
+ z-index: 4;
345
+ font-size: 14px;
346
+ margin: 5px;
347
+ }
348
+
349
+ .harvest-search-text .search-text-suffix {
350
+ .search-text-disabled {
351
+ color: #A4A9B2;
352
+ }
353
+
354
+ >span {
355
+ margin: 0 3px;
356
+ }
357
+ }
358
+
359
+ .harvest-search-text .ant-input-affix-wrapper-focused {
360
+ border-color: #0078E0;
361
+ box-shadow: 0px 0px 0px 2px rgba(24, 144, 255, 0.20);
362
+ }
363
+
339
364
  :global {
340
365
  .ant-empty-description {
341
366
  color: #A4A9B2;
@@ -0,0 +1,15 @@
1
+ import { CSSProperties } from 'react';
2
+ interface SearchInputProps {
3
+ open?: boolean;
4
+ style?: Partial<CSSProperties>;
5
+ value?: string;
6
+ current?: number;
7
+ total?: number;
8
+ calledCount?: number;
9
+ goNext?: () => void;
10
+ goLast?: () => void;
11
+ onClose?: () => void;
12
+ onChange?: (value: string) => void;
13
+ }
14
+ export declare const SearchInput: React.FC<SearchInputProps>;
15
+ export {};
@@ -0,0 +1,78 @@
1
+ import { CloseOutlined, DownOutlined, UpOutlined } from '@ant-design/icons';
2
+ import { Divider, Input } from 'antd';
3
+ import { useEffect, useRef } from 'react';
4
+ import { jsxs as _jsxs } from "react/jsx-runtime";
5
+ import { jsx as _jsx } from "react/jsx-runtime";
6
+ export var SearchInput = function SearchInput(props) {
7
+ var inputRef = useRef(null);
8
+ var _props$current = props.current,
9
+ current = _props$current === void 0 ? 0 : _props$current,
10
+ _props$total = props.total,
11
+ total = _props$total === void 0 ? 0 : _props$total,
12
+ value = props.value,
13
+ _onChange = props.onChange,
14
+ open = props.open,
15
+ onClose = props.onClose,
16
+ goLast = props.goLast,
17
+ goNext = props.goNext,
18
+ _props$calledCount = props.calledCount,
19
+ calledCount = _props$calledCount === void 0 ? 0 : _props$calledCount,
20
+ style = props.style;
21
+ useEffect(function () {
22
+ if (calledCount > 0 && inputRef.current) {
23
+ inputRef.current.focus();
24
+ }
25
+ }, [calledCount]);
26
+ if (!open) {
27
+ return null;
28
+ }
29
+ return /*#__PURE__*/_jsx("div", {
30
+ className: "harvest-search-text",
31
+ style: style,
32
+ children: /*#__PURE__*/_jsx(Input, {
33
+ ref: inputRef,
34
+ placeholder: "\u67E5\u627E",
35
+ autoFocus: true,
36
+ style: {
37
+ height: 40
38
+ },
39
+ value: value,
40
+ onChange: function onChange(e) {
41
+ return _onChange && _onChange(e.target.value);
42
+ },
43
+ onPressEnter: function onPressEnter(e) {
44
+ if (e.shiftKey) goLast && goLast();else goNext && goNext();
45
+ setTimeout(function () {
46
+ var _inputRef$current;
47
+ (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 || _inputRef$current.focus();
48
+ }, 100);
49
+ },
50
+ suffix: /*#__PURE__*/_jsxs("span", {
51
+ className: "ant-input-suffix",
52
+ children: [/*#__PURE__*/_jsxs("span", {
53
+ className: "ant-input-show-count-suffix",
54
+ children: [!total ? 0 : (current || 0) + 1, "/", total || 0]
55
+ }), /*#__PURE__*/_jsx(Divider, {
56
+ type: "vertical"
57
+ }), /*#__PURE__*/_jsxs("span", {
58
+ className: "search-text-suffix",
59
+ children: [/*#__PURE__*/_jsx(UpOutlined, {
60
+ className: !total ? 'search-text-disabled' : '',
61
+ onClick: function onClick() {
62
+ return goLast && goLast();
63
+ }
64
+ }), /*#__PURE__*/_jsx(DownOutlined, {
65
+ className: !total ? 'search-text-disabled' : '',
66
+ onClick: function onClick() {
67
+ return goNext && goNext();
68
+ }
69
+ }), /*#__PURE__*/_jsx(CloseOutlined, {
70
+ onClick: function onClick() {
71
+ return onClose && onClose();
72
+ }
73
+ })]
74
+ })]
75
+ })
76
+ })
77
+ });
78
+ };
@@ -67,6 +67,12 @@ export var useKeyBoardEvent = function useKeyBoardEvent(dispatch, elementRef) {
67
67
  cut: function cut() {
68
68
  dispatch(sideEffectReducer.copy);
69
69
  dispatch(sideEffectReducer.delete);
70
+ },
71
+ search: function search(e) {
72
+ e.preventDefault();
73
+ dispatch({
74
+ type: 'openSearch'
75
+ });
70
76
  }
71
77
  }, elementRef.current);
72
78
  };
@@ -264,14 +264,16 @@ export var useMouseEvent = function useMouseEvent(dispatch, elementRef) {
264
264
  });
265
265
  }, []);
266
266
  var loseFocus = useCallback(function (e) {
267
- var _elementRef$current10;
268
- if (!((_elementRef$current10 = elementRef.current) !== null && _elementRef$current10 !== void 0 && (_elementRef$current10 = _elementRef$current10.parentElement) !== 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)) {
269
271
  dispatch({
270
272
  type: 'loseFocus'
271
273
  });
272
274
  return;
273
275
  }
274
- e.preventDefault();
276
+ // e.preventDefault();
275
277
  var currentCell = findParentTd(e.target);
276
278
  if (!(currentCell !== null && currentCell !== void 0 && currentCell.classList) || currentCell.classList.contains('read-only')) {
277
279
  // 只读
@@ -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 '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
+ };
@@ -68,6 +68,9 @@ export var GroupEvent = function GroupEvent(props) {
68
68
  }, "group-open"), /*#__PURE__*/_jsx(SheetEvent, {
69
69
  name: "group-open-title",
70
70
  handler: function handler(value) {
71
+ if (!(rowGroupConfig !== null && rowGroupConfig !== void 0 && rowGroupConfig.groupOpen.some(function (item) {
72
+ return item !== value;
73
+ }))) return;
71
74
  onGroupChange && onGroupChange(_objectSpread(_objectSpread({}, rowGroupConfig), {}, {
72
75
  groupOpen: Array(rowGroupConfig === null || rowGroupConfig === void 0 ? void 0 : rowGroupConfig.groupOpen.length).fill(value),
73
76
  defaultOpen: !groups.length ? value : undefined
@@ -147,6 +147,7 @@ export var formatGroupData = function formatGroupData(param) {
147
147
  editable: !(colInfo.editable instanceof Function) ? colInfo.editable : colInfo.editable(value, itemRow, currentIndex, col),
148
148
  valueViewer: colInfo.render ? colInfo.render : undefined,
149
149
  dataEditor: colInfo.editor ? colInfo.editor : undefined,
150
+ searchKey: colInfo.searchKey,
150
151
  row: currentIndex,
151
152
  className: !(((_colInfo$cellConfig = colInfo.cellConfig) === null || _colInfo$cellConfig === void 0 ? void 0 : _colInfo$cellConfig.className) instanceof Function) ? (_colInfo$cellConfig2 = colInfo.cellConfig) === null || _colInfo$cellConfig2 === void 0 ? void 0 : _colInfo$cellConfig2.className : (_colInfo$cellConfig3 = colInfo.cellConfig) === null || _colInfo$cellConfig3 === void 0 ? void 0 : _colInfo$cellConfig3.className(value, itemRow, currentIndex),
152
153
  dataIndex: colInfo.dataIndex,
@@ -64,6 +64,7 @@ export var formatSelectionData = function formatSelectionData(param) {
64
64
  editable: !(colInfo.editable instanceof Function) ? colInfo.editable : colInfo.editable(value, item, row),
65
65
  valueViewer: colInfo.render ? colInfo.render : undefined,
66
66
  dataEditor: colInfo.editor ? colInfo.editor : undefined,
67
+ searchKey: colInfo.searchKey,
67
68
  className: !(((_colInfo$cellConfig = colInfo.cellConfig) === null || _colInfo$cellConfig === void 0 ? void 0 : _colInfo$cellConfig.className) instanceof Function) ? (_colInfo$cellConfig2 = colInfo.cellConfig) === null || _colInfo$cellConfig2 === void 0 ? void 0 : _colInfo$cellConfig2.className : (_colInfo$cellConfig3 = colInfo.cellConfig) === null || _colInfo$cellConfig3 === void 0 ? void 0 : _colInfo$cellConfig3.className(value, item, row),
68
69
  row: row,
69
70
  col: col,
@@ -10,6 +10,7 @@ type KeyboardHandler = {
10
10
  paste: KeyOrClipBoardEvent;
11
11
  reverse: KeyOrClipBoardEvent;
12
12
  cut: KeyOrClipBoardEvent;
13
+ search: KeyOrClipBoardEvent;
13
14
  };
14
15
  export declare function move(keyCode: number, isShiftKey: boolean): {
15
16
  row: number;
@@ -1,5 +1,5 @@
1
1
  import { useCallback, useEffect } from 'react';
2
- import { A_KEY, 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";
2
+ import { A_KEY, BACKSPACE_KEY, C_KEY, DELETE_KEY, DOWN_KEY, ENTER_KEY, ESCAPE_KEY, F_KEY, LEFT_KEY, RIGHT_KEY, TAB_KEY, UP_KEY, V_KEY, X_KEY, Z_KEY } from "../core/config";
3
3
  import { isInputKey } from "../core/util";
4
4
  var ua = window.navigator.userAgent;
5
5
  var isIE = /MSIE|Trident/.test(ua);
@@ -51,6 +51,11 @@ export var useKeyBoard = function useKeyBoard(handler, listenElement) {
51
51
  handler.escape(e);
52
52
  return;
53
53
  }
54
+ var isSearch = ctrlKeyPressed && keyCode === F_KEY;
55
+ if (isSearch) {
56
+ handler.search(e);
57
+ return;
58
+ }
54
59
  var isReverse = ctrlKeyPressed && keyCode === Z_KEY;
55
60
  if (isReverse) {
56
61
  handler.reverse(e);
@@ -24,6 +24,7 @@ export type Cell = {
24
24
  dataEditor?: CellEditor;
25
25
  dataIndex?: string;
26
26
  valueViewer?: CellViewer;
27
+ searchKey?: (value: unknown, record?: unknown) => string;
27
28
  className?: string;
28
29
  align?: CellAlign;
29
30
  fixed?: Omit<CellAlign, 'center'>;
@@ -92,6 +93,7 @@ export type SheetInstance = {
92
93
  end: SheetType.CellPosition;
93
94
  }) => void;
94
95
  popHistory: () => OperateHistory;
96
+ dropHistory: () => OperateHistory[];
95
97
  };
96
98
  export type SheetProps = {
97
99
  sheetInstance?: React.MutableRefObject<SheetInstance | null>;
@@ -104,6 +106,7 @@ export type SheetProps = {
104
106
  virtualized?: boolean;
105
107
  showBackEdit?: boolean;
106
108
  backEditStyle?: Partial<CSSProperties>;
109
+ searchStyle?: Partial<CSSProperties>;
107
110
  sticky?: boolean;
108
111
  groupConfig?: RowGroupConfig;
109
112
  onCellsChanged?: CellChangeHandler;
@@ -169,6 +172,14 @@ export type CellProps = {
169
172
  valueViewer?: React.ElementType;
170
173
  attributesRenderer?: AttributesRenderer;
171
174
  };
175
+ export type SearchState = {
176
+ showSearch: boolean;
177
+ searchText: string;
178
+ searchTotal: number;
179
+ searchCurrent: number;
180
+ searchResultList?: CellPosition[];
181
+ searchCalledCount: number;
182
+ };
172
183
  export type UpdateStateType = {
173
184
  eventBus: EventEmitter;
174
185
  start: CellPosition;
@@ -200,7 +211,7 @@ export type UpdateStateType = {
200
211
  confirm?: boolean;
201
212
  };
202
213
  cellChangeHandler: (cells: CellData[], additions?: CellData[]) => void;
203
- };
214
+ } & SearchState;
204
215
  export type UpdateFocus = (start: CellPosition, end: CellPosition) => void;
205
216
  export type Options<T = any> = {
206
217
  value: string | number;
@@ -36,6 +36,7 @@ export type ColumnProps = {
36
36
  readonly?: boolean | RecordRowMap<boolean>;
37
37
  render?: SheetType.CellViewer;
38
38
  editor?: SheetType.CellEditor;
39
+ searchKey?: (value: unknown, record: Record<string, unknown>) => string;
39
40
  };
40
41
  export type TableChange = {
41
42
  col?: number;
@@ -80,6 +81,7 @@ export type TableProps = {
80
81
  freePaste?: boolean;
81
82
  showBackEdit?: boolean;
82
83
  backEditStyle?: Partial<CSSProperties>;
84
+ searchStyle?: Partial<CSSProperties>;
83
85
  rowSelection?: TableRowSelection;
84
86
  groupConfig?: TableGroupConfig;
85
87
  menuRenderer?: React.FC<SheetType.MenuRenderProps>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zhenliang/sheet",
3
- "version": "0.1.50",
3
+ "version": "0.1.52",
4
4
  "description": "A react library developed with dumi",
5
5
  "license": "MIT",
6
6
  "module": "dist/index.js",