acud 1.0.7 → 1.0.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (72) hide show
  1. package/CHANGELOG.md +466 -0
  2. package/dist/acud.css +4 -32
  3. package/dist/acud.css.map +1 -1
  4. package/dist/acud.js +1091 -482
  5. package/dist/acud.js.map +1 -1
  6. package/dist/acud.min.css +1 -1
  7. package/dist/acud.min.css.map +1 -1
  8. package/dist/acud.min.js +8 -6
  9. package/dist/acud.min.js.map +1 -1
  10. package/es/card/style/index.css +0 -1
  11. package/es/date-picker/src/PickerPanel.js +0 -1
  12. package/es/date-picker/src/RangePicker.js +0 -1
  13. package/es/dialog-box/style/index.css +0 -1
  14. package/es/form/style/index.css +1 -2
  15. package/es/input-number/src/hooks/useFrame.d.ts +1 -1
  16. package/es/input-number/style/index.css +0 -7
  17. package/es/locale/zh_CN.js +2 -1
  18. package/es/modal/style/index.css +0 -1
  19. package/es/pagination/pagination.js +3 -3
  20. package/es/pagination/rc-pagination/Options.js +1 -1
  21. package/es/pagination/style/index.css +0 -2
  22. package/es/popover/style/index.css +0 -1
  23. package/es/rate/style/index.css +0 -1
  24. package/es/select/style/index.css +0 -2
  25. package/es/slider/style/index.css +0 -1
  26. package/es/switch/style/index.css +0 -1
  27. package/es/tabs/style/index.css +0 -1
  28. package/es/tag/style/index.css +0 -1
  29. package/es/timeline/style/index.css +0 -2
  30. package/es/transfer/DataSource.d.ts +2 -0
  31. package/es/transfer/DataSource.js +54 -24
  32. package/es/transfer/Target.d.ts +2 -0
  33. package/es/transfer/Target.js +86 -18
  34. package/es/transfer/index.d.ts +3 -0
  35. package/es/transfer/index.js +14 -5
  36. package/es/transfer/style/index.css +2 -1
  37. package/es/transfer/style/index.less +2 -1
  38. package/es/tree/style/index.css +0 -3
  39. package/es/tree-select/style/index.css +0 -3
  40. package/es/virtual-list/List.js +0 -7
  41. package/lib/card/style/index.css +0 -1
  42. package/lib/date-picker/src/PickerPanel.js +0 -1
  43. package/lib/date-picker/src/RangePicker.js +0 -1
  44. package/lib/dialog-box/style/index.css +0 -1
  45. package/lib/form/style/index.css +1 -2
  46. package/lib/input-number/src/hooks/useFrame.d.ts +1 -1
  47. package/lib/input-number/style/index.css +0 -7
  48. package/lib/locale/zh_CN.js +2 -1
  49. package/lib/modal/style/index.css +0 -1
  50. package/lib/pagination/pagination.js +3 -3
  51. package/lib/pagination/rc-pagination/Options.js +1 -1
  52. package/lib/pagination/style/index.css +0 -2
  53. package/lib/popover/style/index.css +0 -1
  54. package/lib/rate/style/index.css +0 -1
  55. package/lib/select/style/index.css +0 -2
  56. package/lib/slider/style/index.css +0 -1
  57. package/lib/switch/style/index.css +0 -1
  58. package/lib/tabs/style/index.css +0 -1
  59. package/lib/tag/style/index.css +0 -1
  60. package/lib/timeline/style/index.css +0 -2
  61. package/lib/transfer/DataSource.d.ts +2 -0
  62. package/lib/transfer/DataSource.js +54 -24
  63. package/lib/transfer/Target.d.ts +2 -0
  64. package/lib/transfer/Target.js +88 -18
  65. package/lib/transfer/index.d.ts +3 -0
  66. package/lib/transfer/index.js +15 -5
  67. package/lib/transfer/style/index.css +2 -1
  68. package/lib/transfer/style/index.less +2 -1
  69. package/lib/tree/style/index.css +0 -3
  70. package/lib/tree-select/style/index.css +0 -3
  71. package/lib/virtual-list/List.js +0 -7
  72. package/package.json +1 -1
@@ -292,7 +292,6 @@
292
292
  white-space: nowrap;
293
293
  -webkit-user-select: none;
294
294
  -moz-user-select: none;
295
- -ms-user-select: none;
296
295
  user-select: none;
297
296
  }
298
297
  .acud-select-tree-indent-unit {
@@ -310,7 +309,6 @@
310
309
  cursor: pointer;
311
310
  -webkit-user-select: none;
312
311
  -moz-user-select: none;
313
- -ms-user-select: none;
314
312
  user-select: none;
315
313
  }
316
314
  .acud-select-tree-switcher .acud-tree-switcher-icon,
@@ -452,7 +450,6 @@
452
450
  line-height: 24px;
453
451
  -webkit-user-select: none;
454
452
  -moz-user-select: none;
455
- -ms-user-select: none;
456
453
  user-select: none;
457
454
  }
458
455
  .acud-select-tree-node-content-wrapper .acud-tree-drop-indicator {
@@ -135,7 +135,6 @@ export function RawList(props, ref) {
135
135
  } // Always use virtual scroll bar in avoid shaking
136
136
 
137
137
 
138
- // Always use virtual scroll bar in avoid shaking
139
138
  if (!inVirtual) {
140
139
  return {
141
140
  scrollHeight: ((_a = fillerInnerRef.current) === null || _a === void 0 ? void 0 : _a.offsetHeight) || 0,
@@ -157,14 +156,12 @@ export function RawList(props, ref) {
157
156
  var cacheHeight = heights.get(key);
158
157
  var currentItemBottom = itemTop + (cacheHeight === undefined ? itemHeight : cacheHeight); // Check item top in the range
159
158
 
160
- // Check item top in the range
161
159
  if (currentItemBottom >= scrollTop && startIndex === undefined) {
162
160
  startIndex = i;
163
161
  startOffset = itemTop;
164
162
  } // Check item bottom in the range. We will render additional one item for motion usage
165
163
 
166
164
 
167
- // Check item bottom in the range. We will render additional one item for motion usage
168
165
  if (currentItemBottom > scrollTop + height && endIndex === undefined) {
169
166
  endIndex = i;
170
167
  }
@@ -175,9 +172,6 @@ export function RawList(props, ref) {
175
172
  /* istanbul ignore next */
176
173
 
177
174
 
178
- // Fallback to normal if not match. This code should never reach
179
-
180
- /* istanbul ignore next */
181
175
  if (startIndex === undefined) {
182
176
  startIndex = 0;
183
177
  startOffset = 0;
@@ -188,7 +182,6 @@ export function RawList(props, ref) {
188
182
  } // Give cache to improve scroll experience
189
183
 
190
184
 
191
- // Give cache to improve scroll experience
192
185
  endIndex = Math.min(endIndex + 1, mergedData.length);
193
186
  return {
194
187
  scrollHeight: itemTop,
@@ -869,7 +869,6 @@
869
869
  .acud-card-loading .acud-card-body {
870
870
  -webkit-user-select: none;
871
871
  -moz-user-select: none;
872
- -ms-user-select: none;
873
872
  user-select: none;
874
873
  }
875
874
  .acud-card-loading-content p {
@@ -159,7 +159,6 @@ function PickerPanel(props) {
159
159
  var now = generateConfig.getNow();
160
160
  if (!date) return now; // When value is null and set showTime
161
161
 
162
- // When value is null and set showTime
163
162
  if (!mergedValue && showTime) {
164
163
  if ((0, _typeof2["default"])(showTime) === 'object') {
165
164
  return (0, _timeUtil.setDateTime)(generateConfig, date, showTime.defaultValue || now);
@@ -212,7 +212,6 @@ function InnerRangePicker(props) {
212
212
  } // Fill disabled unit
213
213
 
214
214
 
215
- // Fill disabled unit
216
215
  for (var i = 0; i < 2; i += 1) {
217
216
  if (mergedDisabled[i] && !(0, _miscUtil.getValue)(postValues, i) && !(0, _miscUtil.getValue)(allowEmpty, i)) {
218
217
  postValues = (0, _miscUtil.updateValues)(postValues, generateConfig.getNow(), i);
@@ -26,7 +26,6 @@
26
26
  animation-duration: 0.3s;
27
27
  -webkit-user-select: none;
28
28
  -moz-user-select: none;
29
- -ms-user-select: none;
30
29
  user-select: none;
31
30
  }
32
31
  .acud-dialogbox-mask {
@@ -742,8 +742,7 @@
742
742
  .acud-form-item-label > label .acud-form-item-tooltip {
743
743
  color: #B8BABF;
744
744
  cursor: help;
745
- -ms-writing-mode: lr-tb;
746
- writing-mode: horizontal-tb;
745
+ writing-mode: horizontal-tb;
747
746
  -webkit-margin-start: 4px;
748
747
  margin-inline-start: 4px;
749
748
  }
@@ -1,5 +1,5 @@
1
- declare const _default: () => (callback: () => void) => void;
2
1
  /**
3
2
  * Always trigger latest once when call multiple time
4
3
  */
4
+ declare const _default: () => (callback: () => void) => void;
5
5
  export default _default;
@@ -249,7 +249,6 @@
249
249
  transition: all 0.1s linear;
250
250
  -webkit-user-select: none;
251
251
  -moz-user-select: none;
252
- -ms-user-select: none;
253
252
  user-select: none;
254
253
  }
255
254
  .acud-input-number-handler-up-inner > *,
@@ -314,18 +313,12 @@
314
313
  .acud-input-number-input::-moz-placeholder {
315
314
  opacity: 1;
316
315
  }
317
- .acud-input-number-input:-ms-input-placeholder {
318
- color: #D4D6D9;
319
- }
320
316
  .acud-input-number-input::placeholder {
321
317
  color: #D4D6D9;
322
318
  }
323
319
  .acud-input-number-input:-moz-placeholder-shown {
324
320
  text-overflow: ellipsis;
325
321
  }
326
- .acud-input-number-input:-ms-input-placeholder {
327
- text-overflow: ellipsis;
328
- }
329
322
  .acud-input-number-input:placeholder-shown {
330
323
  text-overflow: ellipsis;
331
324
  }
@@ -54,7 +54,8 @@ var localeValues = {
54
54
  sourceNoData: '暂无数据',
55
55
  targetTitle: '已选项',
56
56
  targetNoData: '请选择左侧数据',
57
- clearAll: '清空'
57
+ clearAll: '清空',
58
+ workerLoadingTip: '数据计算中...'
58
59
  },
59
60
  Upload: {
60
61
  uploading: '上传中',
@@ -28,7 +28,6 @@
28
28
  animation-duration: 0.3s;
29
29
  -webkit-user-select: none;
30
30
  -moz-user-select: none;
31
- -ms-user-select: none;
32
31
  user-select: none;
33
32
  }
34
33
  .acud-modal-mask {
@@ -111,7 +111,8 @@ var Pagination = function Pagination(_a) {
111
111
  mini: isSmall
112
112
  }, 'rtl', direction === 'rtl'), className);
113
113
  return /*#__PURE__*/React.createElement(_rcPagination["default"], (0, _extends2["default"])({
114
- showSizeChanger: showSizeChanger
114
+ showSizeChanger: showSizeChanger,
115
+ locale: _zh_CN["default"]
115
116
  }, restProps, {
116
117
  prefixCls: prefixCls,
117
118
  selectPrefixCls: selectPrefixCls
@@ -119,8 +120,7 @@ var Pagination = function Pagination(_a) {
119
120
  className: extendedClassName,
120
121
  selectComponentClass: showSizeChanger ? _select["default"] : undefined,
121
122
  Option: Option,
122
- showQuickJumper: showQuickJumper,
123
- locale: _zh_CN["default"]
123
+ showQuickJumper: showQuickJumper
124
124
  }));
125
125
  };
126
126
 
@@ -36,7 +36,7 @@ var Options = function Options(_ref) {
36
36
 
37
37
  buildOptionText = _react["default"].useCallback(function (value) {
38
38
  return "".concat(value, " ").concat(locale.items_per_page);
39
- }, []);
39
+ }, [locale]);
40
40
 
41
41
  var handleChangeSize = _react["default"].useCallback(function (value) {
42
42
  changeSize(Number(value));
@@ -67,7 +67,6 @@
67
67
  cursor: pointer;
68
68
  -webkit-user-select: none;
69
69
  -moz-user-select: none;
70
- -ms-user-select: none;
71
70
  user-select: none;
72
71
  box-sizing: border-box;
73
72
  font-weight: 400;
@@ -251,7 +250,6 @@
251
250
  cursor: pointer;
252
251
  -webkit-user-select: none;
253
252
  -moz-user-select: none;
254
- -ms-user-select: none;
255
253
  user-select: none;
256
254
  }
257
255
  .acud-pagination-prev.acud-pagination-disabled button,
@@ -22,7 +22,6 @@
22
22
  cursor: auto;
23
23
  -webkit-user-select: text;
24
24
  -moz-user-select: text;
25
- -ms-user-select: text;
26
25
  user-select: text;
27
26
  }
28
27
  .acud-popover::after {
@@ -130,7 +130,6 @@
130
130
  margin-bottom: 4px;
131
131
  -webkit-user-select: none;
132
132
  -moz-user-select: none;
133
- -ms-user-select: none;
134
133
  user-select: none;
135
134
  transition: all 0.3s;
136
135
  cursor: pointer;
@@ -38,7 +38,6 @@
38
38
  position: relative;
39
39
  -webkit-user-select: none;
40
40
  -moz-user-select: none;
41
- -ms-user-select: none;
42
41
  user-select: none;
43
42
  color: #151B26;
44
43
  }
@@ -191,7 +190,6 @@
191
190
  transition: font-size 0.3s, line-height 0.3s, height 0.3s;
192
191
  -webkit-user-select: none;
193
192
  -moz-user-select: none;
194
- -ms-user-select: none;
195
193
  user-select: none;
196
194
  -webkit-margin-end: 5px;
197
195
  margin-inline-end: 5px;
@@ -253,7 +253,6 @@
253
253
  cursor: pointer;
254
254
  -webkit-user-select: none;
255
255
  -moz-user-select: none;
256
- -ms-user-select: none;
257
256
  user-select: none;
258
257
  }
259
258
  .acud-slider-mark-text:first-child {
@@ -202,7 +202,6 @@
202
202
  vertical-align: middle;
203
203
  -webkit-user-select: text;
204
204
  -moz-user-select: text;
205
- -ms-user-select: text;
206
205
  user-select: text;
207
206
  pointer-events: none;
208
207
  }
@@ -537,7 +537,6 @@
537
537
  cursor: pointer;
538
538
  -webkit-user-select: none;
539
539
  -moz-user-select: none;
540
- -ms-user-select: none;
541
540
  user-select: none;
542
541
  color: #151B26;
543
542
  }
@@ -312,7 +312,6 @@
312
312
  .acud-tag-type-edit {
313
313
  -webkit-user-select: none;
314
314
  -moz-user-select: none;
315
- -ms-user-select: none;
316
315
  user-select: none;
317
316
  padding-right: 4px;
318
317
  line-height: 24px;
@@ -166,7 +166,6 @@
166
166
  cursor: pointer;
167
167
  -webkit-user-select: none;
168
168
  -moz-user-select: none;
169
- -ms-user-select: none;
170
169
  user-select: none;
171
170
  }
172
171
  .common-content-link {
@@ -579,7 +578,6 @@
579
578
  cursor: pointer;
580
579
  -webkit-user-select: none;
581
580
  -moz-user-select: none;
582
- -ms-user-select: none;
583
581
  user-select: none;
584
582
  }
585
583
  .acud-timeline-item-content-link {
@@ -4,5 +4,7 @@ export interface DataSourceProps<RecordType> extends TransferProps<RecordType> {
4
4
  tKeys: string[];
5
5
  setTKeys: (t: string[]) => void;
6
6
  expansionSource: RecordType[];
7
+ loading: boolean;
8
+ setLoading: (loading: boolean) => void;
7
9
  }
8
10
  export default function dataSource<RecordType extends TransferItem = TransferItem>(props: DataSourceProps<RecordType>): JSX.Element;
@@ -62,23 +62,30 @@ function dataSource(props) {
62
62
  useWorker = _props$useWorker === void 0 ? false : _props$useWorker,
63
63
  tKeys = props.tKeys,
64
64
  setTKeys = props.setTKeys,
65
+ loading = props.loading,
66
+ setLoading = props.setLoading,
67
+ _props$workerLimit = props.workerLimit,
68
+ workerLimit = _props$workerLimit === void 0 ? 20000 : _props$workerLimit,
69
+ _props$workerLoading = props.workerLoading,
70
+ workerLoading = _props$workerLoading === void 0 ? true : _props$workerLoading,
65
71
  leftStyle = props.leftStyle,
66
72
  locale = props.locale;
67
73
  var filterOption = filterOptionProp || (displayType === 'table' ? defaultTableFilterOption : defaultFilterOption);
68
74
  var dataSourceCls = "".concat(prefixCls, "-datasource");
69
75
  var sourceTitle = locale.sourceTitle,
70
76
  searchPlaceholder = locale.searchPlaceholder,
71
- sourceNoData = locale.sourceNoData; // 搜索关键字
77
+ sourceNoData = locale.sourceNoData,
78
+ workerLoadingTip = locale.workerLoadingTip; // 搜索关键字
72
79
 
73
80
  var _React$useState = React.useState(''),
74
81
  _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
75
82
  searchValue = _React$useState2[0],
76
83
  setSearchValue = _React$useState2[1];
77
84
 
78
- var _React$useState3 = React.useState(false),
85
+ var _React$useState3 = React.useState([]),
79
86
  _React$useState4 = (0, _slicedToArray2["default"])(_React$useState3, 2),
80
- loading = _React$useState4[0],
81
- setLoading = _React$useState4[1];
87
+ totalSelectedUndisabledKeys = _React$useState4[0],
88
+ setTotalSelectedUndisabledKeys = _React$useState4[1];
82
89
 
83
90
  var filterSource = React.useMemo(function () {
84
91
  if (searchValue === '') {
@@ -124,37 +131,60 @@ function dataSource(props) {
124
131
  var unDisabledDataSource = filterSource.filter(function (data) {
125
132
  return !data.group && !data.disabled;
126
133
  });
127
- return unDisabledDataSource.map(function (data) {
134
+ var udd = unDisabledDataSource.map(function (data) {
128
135
  return data.key;
129
136
  });
137
+ return udd;
130
138
  }, [filterSource]);
131
- var totalSelectedUndisabledKeys = React.useMemo(function () {
132
- return tKeys.filter(function (key) {
133
- return totalUndisabledKeys.includes(key);
134
- });
135
- }, [totalUndisabledKeys, tKeys]);
139
+ React.useEffect(function () {
140
+ if (useWorker && tKeys.length >= workerLimit && totalUndisabledKeys.length >= workerLimit) {
141
+ workerLoading && setLoading(true);
142
+ var tsuWorker = (0, _createWorker.createWorker)(function (e) {
143
+ var _e$data = e.data,
144
+ tKeys = _e$data.tKeys,
145
+ totalUndisabledKeys = _e$data.totalUndisabledKeys;
146
+ var tsu = tKeys.filter(function (key) {
147
+ return totalUndisabledKeys.includes(key);
148
+ });
149
+ self.postMessage(tsu);
150
+ });
151
+ tsuWorker.addEventListener('message', function (event) {
152
+ setTotalSelectedUndisabledKeys(event.data);
153
+ tsuWorker.terminate();
154
+ workerLoading && setLoading(false);
155
+ });
156
+ tsuWorker.postMessage({
157
+ tKeys: tKeys,
158
+ totalUndisabledKeys: totalUndisabledKeys
159
+ });
160
+ } else {
161
+ var tsu = tKeys.filter(function (key) {
162
+ return totalUndisabledKeys.includes(key);
163
+ });
164
+ setTotalSelectedUndisabledKeys(tsu);
165
+ }
166
+ }, [totalUndisabledKeys, tKeys, useWorker, workerLimit, workerLoading]);
136
167
  var allChecked = totalUndisabledKeys.length === totalSelectedUndisabledKeys.length;
137
168
  var indeterminate = totalSelectedUndisabledKeys.length && totalUndisabledKeys.length > totalSelectedUndisabledKeys.length;
138
169
  var selectAll = React.useCallback(function () {
139
170
  var newTKeys = []; // 取消全选
140
171
 
141
172
  if (allChecked) {
142
- if (useWorker) {
143
- setLoading(true);
173
+ if (useWorker && tKeys.length > workerLimit && totalUndisabledKeys.length >= workerLimit) {
174
+ workerLoading && setLoading(true);
144
175
  var cancelAllWorker = (0, _createWorker.createWorker)(function (e) {
145
- var _e$data = e.data,
146
- tKeys = _e$data.tKeys,
147
- totalUndisabledKeys = _e$data.totalUndisabledKeys;
176
+ var _e$data2 = e.data,
177
+ tKeys = _e$data2.tKeys,
178
+ totalUndisabledKeys = _e$data2.totalUndisabledKeys;
148
179
  var nKeys = tKeys.filter(function (key) {
149
180
  return !totalUndisabledKeys.includes(key);
150
181
  });
151
182
  self.postMessage(nKeys);
152
- }); // 主线程监听worker线程返回的数据
153
-
183
+ });
154
184
  cancelAllWorker.addEventListener('message', function (event) {
155
185
  setTKeys(event.data);
156
186
  cancelAllWorker.terminate();
157
- setLoading(false);
187
+ workerLoading && setLoading(false);
158
188
  });
159
189
  cancelAllWorker.postMessage({
160
190
  tKeys: tKeys,
@@ -170,7 +200,7 @@ function dataSource(props) {
170
200
  newTKeys = (0, _toConsumableArray2["default"])(new Set([].concat((0, _toConsumableArray2["default"])(tKeys), (0, _toConsumableArray2["default"])(totalUndisabledKeys))));
171
201
  setTKeys(newTKeys);
172
202
  }
173
- }, [totalSelectedUndisabledKeys, totalUndisabledKeys, allChecked, tKeys]);
203
+ }, [expansionSource, totalSelectedUndisabledKeys, totalUndisabledKeys, useWorker, workerLimit, workerLoading, allChecked, tKeys]);
174
204
  var searchChange = React.useCallback(function (e) {
175
205
  var searchValue = e.target.value;
176
206
  setSearchValue(searchValue);
@@ -191,13 +221,13 @@ function dataSource(props) {
191
221
  onChange: onSelectChange,
192
222
  selectedRowKeys: tKeys
193
223
  };
194
- return /*#__PURE__*/React.createElement("div", {
195
- className: dataSourceCls,
196
- style: leftStyle
197
- }, /*#__PURE__*/React.createElement(_loading["default"], {
224
+ return /*#__PURE__*/React.createElement(_loading["default"], {
198
225
  loading: loading,
199
- tip: "\u52A0\u8F7D\u4E2D...",
226
+ tip: workerLoadingTip,
200
227
  size: "small"
228
+ }, /*#__PURE__*/React.createElement("div", {
229
+ className: dataSourceCls,
230
+ style: leftStyle
201
231
  }, /*#__PURE__*/React.createElement("div", {
202
232
  className: "".concat(dataSourceCls, "-header")
203
233
  }, showSelectAll && displayType === 'single' && /*#__PURE__*/React.createElement(_checkbox["default"], {
@@ -3,6 +3,8 @@ import { TransferItem, TransferProps } from '.';
3
3
  export interface DataSourceProps<RecordType> extends TransferProps<RecordType> {
4
4
  tKeys: string[];
5
5
  setTKeys: (t: string[]) => void;
6
+ loading: boolean;
7
+ setLoading: (loading: boolean) => void;
6
8
  expansionSource: RecordType[];
7
9
  }
8
10
  export default function target<RecordType extends TransferItem = TransferItem>(props: DataSourceProps<RecordType>): JSX.Element;
@@ -23,6 +23,10 @@ var _dedupe = _interopRequireDefault(require("classnames/dedupe"));
23
23
 
24
24
  var _acudIcon = require("acud-icon");
25
25
 
26
+ var _createWorker = require("../_util/createWorker");
27
+
28
+ var _loading = _interopRequireDefault(require("../loading"));
29
+
26
30
  var _table = _interopRequireDefault(require("../table"));
27
31
 
28
32
  var _TargetList = _interopRequireDefault(require("./TargetList"));
@@ -55,6 +59,13 @@ function target(props) {
55
59
  showSearchClear = _props$showSearchClea === void 0 ? true : _props$showSearchClea,
56
60
  tKeys = props.tKeys,
57
61
  setTKeys = props.setTKeys,
62
+ loading = props.loading,
63
+ setLoading = props.setLoading,
64
+ useWorker = props.useWorker,
65
+ _props$workerLimit = props.workerLimit,
66
+ workerLimit = _props$workerLimit === void 0 ? 20000 : _props$workerLimit,
67
+ _props$workerLoading = props.workerLoading,
68
+ workerLoading = _props$workerLoading === void 0 ? true : _props$workerLoading,
58
69
  rightStyle = props.rightStyle,
59
70
  locale = props.locale,
60
71
  expansionSource = props.expansionSource,
@@ -63,26 +74,58 @@ function target(props) {
63
74
  var targetTitle = locale.targetTitle,
64
75
  searchPlaceholder = locale.searchPlaceholder,
65
76
  targetNoData = locale.targetNoData,
66
- clearAll = locale.clearAll;
67
- var targetSource = React.useMemo(function () {
68
- return expansionSource.filter(function (data) {
69
- return tKeys.includes(data.key) || data.group && data.childrenKeys.some(function (childKey) {
70
- return tKeys.includes(childKey);
77
+ clearAll = locale.clearAll,
78
+ workerLoadingTip = locale.workerLoadingTip;
79
+
80
+ var _React$useState = React.useState([]),
81
+ _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
82
+ targetSource = _React$useState2[0],
83
+ setTargetSource = _React$useState2[1];
84
+
85
+ React.useEffect(function () {
86
+ if (useWorker && expansionSource.length > workerLimit && tKeys.length > workerLimit) {
87
+ workerLoading && setLoading(true);
88
+ var tsWorker = (0, _createWorker.createWorker)(function (e) {
89
+ var _e$data = e.data,
90
+ expansionSource = _e$data.expansionSource,
91
+ tKeys = _e$data.tKeys;
92
+ var tsArr = expansionSource.filter(function (data) {
93
+ return tKeys.includes(data.key) || data.group && data.childrenKeys.some(function (childKey) {
94
+ return tKeys.includes(childKey);
95
+ });
96
+ });
97
+ self.postMessage(tsArr);
71
98
  });
72
- });
99
+ tsWorker.addEventListener('message', function (event) {
100
+ setTargetSource(event.data);
101
+ tsWorker.terminate();
102
+ workerLoading && setLoading(false);
103
+ });
104
+ tsWorker.postMessage({
105
+ expansionSource: expansionSource,
106
+ tKeys: tKeys
107
+ });
108
+ } else {
109
+ var ts = expansionSource.filter(function (data) {
110
+ return tKeys.includes(data.key) || data.group && data.childrenKeys.some(function (childKey) {
111
+ return tKeys.includes(childKey);
112
+ });
113
+ });
114
+ setTargetSource(ts);
115
+ }
73
116
  }, [expansionSource, tKeys]); // 搜索关键字
74
117
 
75
- var _React$useState = React.useState(''),
76
- _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
77
- searchValue = _React$useState2[0],
78
- setSearchValue = _React$useState2[1];
118
+ var _React$useState3 = React.useState(''),
119
+ _React$useState4 = (0, _slicedToArray2["default"])(_React$useState3, 2),
120
+ searchValue = _React$useState4[0],
121
+ setSearchValue = _React$useState4[1];
79
122
 
80
123
  var filterSource = React.useMemo(function () {
81
124
  if (searchValue === '') {
82
125
  return targetSource;
83
126
  }
84
127
 
85
- return targetSource.filter(function (data) {
128
+ var tfs = targetSource.filter(function (data) {
86
129
  if (data.group) {
87
130
  return filterOption(searchValue, data) || data.children.some(function (child) {
88
131
  return tKeys.includes(child.key) && filterOption(searchValue, child);
@@ -98,6 +141,7 @@ function target(props) {
98
141
 
99
142
  return filterOption(searchValue, data);
100
143
  });
144
+ return tfs;
101
145
  }, [searchValue, targetSource]); // 已选项
102
146
 
103
147
  var optionSource = React.useMemo(function () {
@@ -124,11 +168,33 @@ function target(props) {
124
168
  });
125
169
  }, [optionSource]);
126
170
  var handleClearAll = React.useCallback(function () {
127
- var newTKeys = tKeys.filter(function (key) {
128
- return !totalUndisabledKeys.includes(key);
129
- });
130
- setTKeys(newTKeys);
131
- }, [totalUndisabledKeys, tKeys]);
171
+ if (useWorker && tKeys.length > workerLimit && totalUndisabledKeys.length > workerLimit) {
172
+ workerLoading && setLoading(true);
173
+ var tkWorker = (0, _createWorker.createWorker)(function (e) {
174
+ var _e$data2 = e.data,
175
+ totalUndisabledKeys = _e$data2.totalUndisabledKeys,
176
+ tKeys = _e$data2.tKeys;
177
+ var newTKeys = tKeys.filter(function (key) {
178
+ return !totalUndisabledKeys.includes(key);
179
+ });
180
+ self.postMessage(newTKeys);
181
+ });
182
+ tkWorker.addEventListener('message', function (event) {
183
+ setTKeys(event.data);
184
+ tkWorker.terminate();
185
+ workerLoading && setLoading(false);
186
+ });
187
+ tkWorker.postMessage({
188
+ totalUndisabledKeys: totalUndisabledKeys,
189
+ tKeys: tKeys
190
+ });
191
+ } else {
192
+ var newTKeys = tKeys.filter(function (key) {
193
+ return !totalUndisabledKeys.includes(key);
194
+ });
195
+ setTKeys(newTKeys);
196
+ }
197
+ }, [totalUndisabledKeys, tKeys, useWorker, workerLimit, workerLoading]);
132
198
  var searchChange = React.useCallback(function (e) {
133
199
  var searchValue = e.target.value;
134
200
  setSearchValue(searchValue);
@@ -178,7 +244,11 @@ function target(props) {
178
244
  return tColumns;
179
245
  }, [columns, tKeys]);
180
246
  var clearCls = (0, _dedupe["default"])((_classnames = {}, (0, _defineProperty2["default"])(_classnames, "".concat(targetCls, "-clear-all"), true), (0, _defineProperty2["default"])(_classnames, "".concat(targetCls, "-clear-all-disabled"), filterSource.length === totalDisabledKeys.length), _classnames));
181
- return /*#__PURE__*/React.createElement("div", {
247
+ return /*#__PURE__*/React.createElement(_loading["default"], {
248
+ loading: loading,
249
+ tip: workerLoadingTip,
250
+ size: "small"
251
+ }, /*#__PURE__*/React.createElement("div", {
182
252
  className: targetCls,
183
253
  style: rightStyle
184
254
  }, /*#__PURE__*/React.createElement("div", {
@@ -207,5 +277,5 @@ function target(props) {
207
277
  filterSource: filterSource
208
278
  })), filterSource.length === 0 && /*#__PURE__*/React.createElement("p", {
209
279
  className: "".concat(prefixCls, "-target-nodata")
210
- }, /*#__PURE__*/React.createElement("span", null, targetNoData))));
280
+ }, /*#__PURE__*/React.createElement("span", null, targetNoData)))));
211
281
  }
@@ -14,6 +14,7 @@ export interface TransferLocale {
14
14
  sourceNoData: React.ReactNode;
15
15
  targetNoData: React.ReactNode;
16
16
  clearAll: string;
17
+ workerLoadingTip: string;
17
18
  }
18
19
  export interface TransferItem {
19
20
  key?: string;
@@ -45,6 +46,8 @@ export interface TransferProps<RecordType> {
45
46
  defaultExpandGroupKey?: string[] | string | number[] | number | boolean;
46
47
  virtual?: boolean;
47
48
  useWorker?: boolean;
49
+ workerLimit?: number;
50
+ workerLoading?: boolean;
48
51
  columns?: ColumnsType<RecordType>;
49
52
  }
50
53
  export default function transfer<RecordType extends TransferItem = TransferItem>(props: TransferProps<RecordType>): JSX.Element;