@hi-ui/check-select 4.3.1 → 4.3.3
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/CHANGELOG.md +41 -0
- package/lib/cjs/CheckSelect.js +145 -237
- package/lib/cjs/context.js +0 -9
- package/lib/cjs/hooks/use-cache/lib/esm/index.js +3 -10
- package/lib/cjs/hooks/use-data.js +12 -31
- package/lib/cjs/hooks/use-flatten-data.js +9 -22
- package/lib/cjs/index.js +0 -3
- package/lib/cjs/styles/index.scss.js +0 -3
- package/lib/cjs/use-check-select.js +32 -60
- package/lib/cjs/utils/index.js +0 -8
- package/lib/esm/CheckSelect.js +128 -179
- package/lib/esm/context.js +0 -4
- package/lib/esm/hooks/use-cache/lib/esm/index.js +3 -5
- package/lib/esm/hooks/use-data.js +12 -24
- package/lib/esm/hooks/use-flatten-data.js +9 -16
- package/lib/esm/styles/index.scss.js +0 -2
- package/lib/esm/use-check-select.js +32 -45
- package/lib/esm/utils/index.js +0 -5
- package/package.json +27 -27
package/lib/cjs/CheckSelect.js
CHANGED
@@ -9,169 +9,119 @@
|
|
9
9
|
*/
|
10
10
|
'use strict';
|
11
11
|
|
12
|
-
var _typeof = require("@babel/runtime/helpers/typeof");
|
13
|
-
|
14
|
-
Object.defineProperty(exports, '__esModule', {
|
15
|
-
value: true
|
16
|
-
});
|
17
|
-
|
18
12
|
var tslib = require('tslib');
|
19
|
-
|
20
13
|
var React = require('react');
|
21
|
-
|
22
14
|
var classname = require('@hi-ui/classname');
|
23
|
-
|
24
15
|
var env = require('@hi-ui/env');
|
25
|
-
|
26
16
|
var useCheckSelect = require('./use-check-select.js');
|
27
|
-
|
28
17
|
var icons = require('@hi-ui/icons');
|
29
|
-
|
30
18
|
var context = require('./context.js');
|
31
|
-
|
32
19
|
var useLatest = require('@hi-ui/use-latest');
|
33
|
-
|
34
20
|
var Checkbox = require('@hi-ui/checkbox');
|
35
|
-
|
36
21
|
var tagInput = require('@hi-ui/tag-input');
|
37
|
-
|
38
22
|
var typeAssertion = require('@hi-ui/type-assertion');
|
39
|
-
|
40
23
|
var VirtualList = require('@hi-ui/virtual-list');
|
41
|
-
|
42
24
|
var picker = require('@hi-ui/picker');
|
43
|
-
|
44
25
|
var domUtils = require('@hi-ui/dom-utils');
|
45
|
-
|
46
26
|
var arrayUtils = require('@hi-ui/array-utils');
|
47
|
-
|
48
27
|
var highlighter = require('@hi-ui/highlighter');
|
49
|
-
|
50
28
|
var useToggle = require('@hi-ui/use-toggle');
|
51
|
-
|
52
29
|
var funcUtils = require('@hi-ui/func-utils');
|
53
|
-
|
54
30
|
var core = require('@hi-ui/core');
|
55
|
-
|
56
31
|
var useSearchMode = require('@hi-ui/use-search-mode');
|
57
|
-
|
58
32
|
require('@hi-ui/use-children');
|
59
|
-
|
60
33
|
var useFlattenData = require('./hooks/use-flatten-data.js');
|
61
|
-
|
62
34
|
var index = require('./utils/index.js');
|
63
|
-
|
64
|
-
function _interopDefaultLegacy(e) {
|
65
|
-
return e && _typeof(e) === 'object' && 'default' in e ? e : {
|
66
|
-
'default': e
|
67
|
-
};
|
68
|
-
}
|
69
|
-
|
70
|
-
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
71
|
-
|
72
|
-
var Checkbox__default = /*#__PURE__*/_interopDefaultLegacy(Checkbox);
|
73
|
-
|
74
|
-
var VirtualList__default = /*#__PURE__*/_interopDefaultLegacy(VirtualList);
|
75
|
-
|
76
35
|
var _role = 'check-select';
|
77
|
-
|
78
36
|
var _prefix = classname.getPrefixCls(_role);
|
79
|
-
|
80
37
|
var DEFAULT_FIELD_NAMES = {};
|
81
38
|
/**
|
82
39
|
* 多项选择器
|
83
40
|
*/
|
84
|
-
|
85
41
|
var CheckSelect = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
86
42
|
// ************************** 国际化 ************************* //
|
87
43
|
var _a$prefixCls = _a.prefixCls,
|
88
|
-
|
89
|
-
|
90
|
-
|
91
|
-
|
92
|
-
|
93
|
-
|
94
|
-
|
95
|
-
|
96
|
-
|
97
|
-
|
98
|
-
|
99
|
-
|
100
|
-
|
101
|
-
|
102
|
-
|
103
|
-
|
104
|
-
|
105
|
-
|
106
|
-
|
107
|
-
|
108
|
-
|
109
|
-
|
110
|
-
|
111
|
-
|
112
|
-
|
113
|
-
|
114
|
-
|
115
|
-
|
116
|
-
|
117
|
-
|
118
|
-
|
119
|
-
|
120
|
-
|
121
|
-
|
122
|
-
|
123
|
-
|
124
|
-
|
125
|
-
|
126
|
-
|
44
|
+
prefixCls = _a$prefixCls === void 0 ? _prefix : _a$prefixCls,
|
45
|
+
className = _a.className,
|
46
|
+
children = _a.children,
|
47
|
+
_a$disabled = _a.disabled,
|
48
|
+
disabled = _a$disabled === void 0 ? false : _a$disabled,
|
49
|
+
_a$clearable = _a.clearable,
|
50
|
+
clearable = _a$clearable === void 0 ? true : _a$clearable,
|
51
|
+
_a$showCheckAll = _a.showCheckAll,
|
52
|
+
showCheckAll = _a$showCheckAll === void 0 ? false : _a$showCheckAll,
|
53
|
+
_a$showOnlyShowChecke = _a.showOnlyShowChecked,
|
54
|
+
showOnlyShowChecked = _a$showOnlyShowChecke === void 0 ? false : _a$showOnlyShowChecke,
|
55
|
+
placeholderProp = _a.placeholder,
|
56
|
+
displayRenderProp = _a.displayRender,
|
57
|
+
onSelectProp = _a.onSelect,
|
58
|
+
height = _a.height,
|
59
|
+
_a$itemHeight = _a.itemHeight,
|
60
|
+
itemHeight = _a$itemHeight === void 0 ? 40 : _a$itemHeight,
|
61
|
+
_a$virtual = _a.virtual,
|
62
|
+
virtual = _a$virtual === void 0 ? true : _a$virtual,
|
63
|
+
visible = _a.visible,
|
64
|
+
onOpen = _a.onOpen,
|
65
|
+
onClose = _a.onClose,
|
66
|
+
appearance = _a.appearance,
|
67
|
+
invalid = _a.invalid,
|
68
|
+
dataSource = _a.dataSource,
|
69
|
+
filterOption = _a.filterOption,
|
70
|
+
searchableProp = _a.searchable,
|
71
|
+
titleRender = _a.render,
|
72
|
+
renderExtraFooter = _a.renderExtraFooter,
|
73
|
+
onSearchProp = _a.onSearch,
|
74
|
+
_a$fieldNames = _a.fieldNames,
|
75
|
+
fieldNames = _a$fieldNames === void 0 ? DEFAULT_FIELD_NAMES : _a$fieldNames,
|
76
|
+
customRender = _a.customRender,
|
77
|
+
tagInputProps = _a.tagInputProps,
|
78
|
+
_a$size = _a.size,
|
79
|
+
size = _a$size === void 0 ? 'md' : _a$size,
|
80
|
+
onKeyDownProp = _a.onKeyDown,
|
81
|
+
rest = tslib.__rest(_a, ["prefixCls", "role", "className", "children", "disabled", "clearable", "showCheckAll", "showOnlyShowChecked", "placeholder", "displayRender", "onSelect", "height", "itemHeight", "virtual", "visible", "onOpen", "onClose", "appearance", "invalid", "dataSource", "filterOption", "searchable", "render", "renderExtraFooter", "onSearch", "fieldNames", "customRender", "tagInputProps", "size", "onKeyDown"]);
|
127
82
|
var i18n = core.useLocaleContext();
|
128
|
-
var placeholder = typeAssertion.isUndef(placeholderProp) ? i18n.get('checkSelect.placeholder') : placeholderProp;
|
129
|
-
|
83
|
+
var placeholder = typeAssertion.isUndef(placeholderProp) ? i18n.get('checkSelect.placeholder') : placeholderProp;
|
84
|
+
// ************************** Picker ************************* //
|
130
85
|
var _useUncontrolledToggl = useToggle.useUncontrolledToggle({
|
131
|
-
|
132
|
-
|
133
|
-
|
134
|
-
|
135
|
-
|
136
|
-
|
137
|
-
|
138
|
-
|
86
|
+
visible: visible,
|
87
|
+
disabled: disabled,
|
88
|
+
onOpen: onOpen,
|
89
|
+
onClose: onClose
|
90
|
+
}),
|
91
|
+
menuVisible = _useUncontrolledToggl[0],
|
92
|
+
menuVisibleAction = _useUncontrolledToggl[1];
|
139
93
|
var displayRender = React.useCallback(function (item) {
|
140
94
|
if (typeAssertion.isFunction(displayRenderProp)) {
|
141
95
|
return displayRenderProp(item);
|
142
96
|
}
|
143
|
-
|
144
97
|
return item.title;
|
145
98
|
}, [displayRenderProp]);
|
146
|
-
|
147
99
|
var _b = useCheckSelect.useCheckSelect(Object.assign(Object.assign({}, rest), {
|
148
|
-
|
149
|
-
|
150
|
-
|
151
|
-
|
152
|
-
|
153
|
-
|
154
|
-
|
100
|
+
children: children,
|
101
|
+
fieldNames: fieldNames,
|
102
|
+
onSelect: onSelectProp
|
103
|
+
})),
|
104
|
+
rootProps = _b.rootProps,
|
105
|
+
context$1 = tslib.__rest(_b, ["rootProps"]);
|
155
106
|
var value = context$1.value,
|
156
|
-
|
157
|
-
|
158
|
-
|
159
|
-
|
160
|
-
|
161
|
-
|
107
|
+
tryChangeValue = context$1.tryChangeValue,
|
108
|
+
flattedData = context$1.flattedData,
|
109
|
+
checkedItems = context$1.checkedItems,
|
110
|
+
onSelect = context$1.onSelect,
|
111
|
+
isCheckedId = context$1.isCheckedId;
|
112
|
+
// ************************** 搜索 ************************* //
|
162
113
|
var _c = useSearchMode.useAsyncSearch({
|
163
|
-
|
164
|
-
|
165
|
-
|
166
|
-
|
167
|
-
|
168
|
-
|
169
|
-
|
170
|
-
|
171
|
-
|
172
|
-
|
173
|
-
|
174
|
-
|
114
|
+
dataSource: dataSource,
|
115
|
+
dataTransform: function dataTransform(data) {
|
116
|
+
return useFlattenData.flattenData({
|
117
|
+
data: data,
|
118
|
+
fieldNames: fieldNames
|
119
|
+
});
|
120
|
+
}
|
121
|
+
}),
|
122
|
+
loading = _c.loading,
|
123
|
+
hasError = _c.hasError,
|
124
|
+
dataSourceStrategy = tslib.__rest(_c, ["loading", "hasError"]);
|
175
125
|
var customSearchStrategy = useSearchMode.useTreeCustomSearch({
|
176
126
|
data: flattedData,
|
177
127
|
filterOption: filterOption
|
@@ -181,31 +131,27 @@ var CheckSelect = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
181
131
|
flattedData: flattedData,
|
182
132
|
enabled: searchableProp
|
183
133
|
});
|
184
|
-
|
185
134
|
var _useSearchMode = useSearchMode.useSearchMode({
|
186
|
-
|
187
|
-
|
188
|
-
|
189
|
-
|
190
|
-
|
191
|
-
|
192
|
-
|
193
|
-
|
194
|
-
|
195
|
-
|
135
|
+
searchable: searchableProp,
|
136
|
+
strategies: [dataSourceStrategy, customSearchStrategy, filterSearchStrategy]
|
137
|
+
}),
|
138
|
+
stateInSearch = _useSearchMode.state,
|
139
|
+
searchable = _useSearchMode.searchable,
|
140
|
+
searchMode = _useSearchMode.searchMode,
|
141
|
+
onSearch = _useSearchMode.onSearch,
|
142
|
+
searchValue = _useSearchMode.keyword;
|
143
|
+
// 拦截 titleRender,自定义高亮展示
|
196
144
|
var proxyTitleRender = React.useCallback(function (node) {
|
197
145
|
if (titleRender) {
|
198
146
|
var _ret = titleRender(node);
|
199
|
-
|
200
147
|
if (_ret && _ret !== true) return _ret;
|
201
|
-
}
|
202
|
-
|
203
|
-
|
148
|
+
}
|
149
|
+
// 本地搜索执行默认高亮规则
|
204
150
|
var highlight = !!searchValue && searchMode === 'filter';
|
205
|
-
var ret = highlight ? /*#__PURE__*/
|
151
|
+
var ret = highlight ? /*#__PURE__*/React.createElement(Checkbox, {
|
206
152
|
checked: node.checked,
|
207
153
|
disabled: node.disabled
|
208
|
-
}, /*#__PURE__*/
|
154
|
+
}, /*#__PURE__*/React.createElement(highlighter.Highlighter, {
|
209
155
|
keyword: searchValue
|
210
156
|
}, node.title)) : true;
|
211
157
|
return ret;
|
@@ -213,42 +159,35 @@ var CheckSelect = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
213
159
|
var shouldUseSearch = !!searchValue && !hasError;
|
214
160
|
var showData = React.useMemo(function () {
|
215
161
|
return shouldUseSearch ? stateInSearch.data : flattedData;
|
216
|
-
}, [shouldUseSearch, flattedData, stateInSearch.data]);
|
217
|
-
|
162
|
+
}, [shouldUseSearch, flattedData, stateInSearch.data]);
|
163
|
+
// 根据 id 进行合并,注意必须是扁平数据
|
218
164
|
var mergedData = React.useMemo(function () {
|
219
165
|
var nextData = checkedItems.concat(flattedData);
|
220
166
|
return arrayUtils.uniqBy(nextData, 'id');
|
221
167
|
}, [checkedItems, flattedData]);
|
222
|
-
|
223
168
|
var _useState = React.useState(null),
|
224
|
-
|
225
|
-
|
226
|
-
|
169
|
+
filterItems = _useState[0],
|
170
|
+
setFilterItems = _useState[1];
|
227
171
|
var dropdownItems = filterItems || showData;
|
228
172
|
var activeExpandable = showOnlyShowChecked && !!filterItems && menuVisible;
|
229
|
-
|
230
173
|
var _useMemo = React.useMemo(function () {
|
231
|
-
|
232
|
-
|
233
|
-
|
234
|
-
|
235
|
-
|
174
|
+
return index.getAllCheckedStatus(dropdownItems, value, index.isOption);
|
175
|
+
}, [dropdownItems, value]),
|
176
|
+
showAllChecked = _useMemo[0],
|
177
|
+
showIndeterminate = _useMemo[1];
|
236
178
|
var valueLatestRef = useLatest.useLatestRef(value);
|
237
179
|
var toggleCheckAll = React.useCallback(function () {
|
238
180
|
var value = valueLatestRef.current;
|
239
|
-
|
240
181
|
var _getAllCheckedStatus = index.getAllCheckedStatus(dropdownItems, value, index.isCheckableOption),
|
241
|
-
|
242
|
-
|
243
|
-
|
244
|
-
|
182
|
+
currentAllChecked = _getAllCheckedStatus[0];
|
183
|
+
var shouldChecked = !currentAllChecked;
|
184
|
+
// 当前页的数据选项
|
245
185
|
var items = dropdownItems.filter(index.isCheckableOption);
|
246
186
|
var targetIds = items.map(function (_ref) {
|
247
187
|
var id = _ref.id;
|
248
188
|
return id;
|
249
189
|
});
|
250
190
|
var allData = arrayUtils.uniqBy(items.concat(mergedData), 'id');
|
251
|
-
|
252
191
|
if (shouldChecked) {
|
253
192
|
var nextCheckedIds = Array.from(new Set(value.concat(targetIds)));
|
254
193
|
var changedIds = nextCheckedIds.filter(function (id) {
|
@@ -263,59 +202,47 @@ var CheckSelect = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
263
202
|
var _nextCheckedIds = value.filter(function (id) {
|
264
203
|
return !targetIds.includes(id);
|
265
204
|
});
|
266
|
-
|
267
205
|
var _changedIds = value.filter(function (id) {
|
268
206
|
return !_nextCheckedIds.includes(id);
|
269
207
|
});
|
270
|
-
|
271
208
|
var _changedItems = allData.filter(function (_ref3) {
|
272
209
|
var id = _ref3.id;
|
273
210
|
return _changedIds.includes(id);
|
274
211
|
}); // items
|
275
|
-
|
276
|
-
|
277
212
|
tryChangeValue(_nextCheckedIds, _changedItems, shouldChecked);
|
278
213
|
}
|
279
|
-
}, [dropdownItems, mergedData, valueLatestRef, tryChangeValue]);
|
280
|
-
|
214
|
+
}, [dropdownItems, mergedData, valueLatestRef, tryChangeValue]);
|
215
|
+
// ************************** 回车选中处理 ************************* //
|
281
216
|
var defaultIndex = showData.findIndex(function (item) {
|
282
217
|
return !item.disabled;
|
283
218
|
});
|
284
|
-
|
285
219
|
var _useState2 = React.useState(defaultIndex),
|
286
|
-
|
287
|
-
|
288
|
-
|
220
|
+
focusedIndex = _useState2[0],
|
221
|
+
setFocusedIndex = _useState2[1];
|
289
222
|
var handleKeyDown = useLatest.useLatestCallback(function (evt) {
|
290
223
|
var key = evt.key;
|
291
|
-
|
292
224
|
if (key === 'Enter') {
|
293
225
|
var focusedItem = showData[focusedIndex];
|
294
|
-
|
295
226
|
if (focusedItem) {
|
296
227
|
onSelect(focusedItem, !isCheckedId(focusedItem.id));
|
297
228
|
}
|
298
229
|
}
|
299
|
-
});
|
300
|
-
|
230
|
+
});
|
231
|
+
// 更新 focused 索引
|
301
232
|
React.useEffect(function () {
|
302
233
|
setFocusedIndex(defaultIndex);
|
303
234
|
}, [defaultIndex, menuVisible]);
|
304
|
-
|
305
235
|
var renderDefaultFooter = function renderDefaultFooter() {
|
306
236
|
var extra = renderExtraFooter ? renderExtraFooter() : null;
|
307
|
-
|
308
237
|
if (showCheckAll) {
|
309
|
-
return /*#__PURE__*/
|
238
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Checkbox, {
|
310
239
|
indeterminate: showIndeterminate,
|
311
240
|
checked: showAllChecked,
|
312
241
|
onChange: toggleCheckAll
|
313
242
|
}, i18n.get('checkSelect.checkAll')), extra);
|
314
243
|
}
|
315
|
-
|
316
244
|
return extra;
|
317
245
|
};
|
318
|
-
|
319
246
|
var expandedViewRef = React.useRef('normal');
|
320
247
|
var virtualListProps = {
|
321
248
|
height: height,
|
@@ -323,23 +250,20 @@ var CheckSelect = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
323
250
|
virtual: virtual,
|
324
251
|
data: dropdownItems
|
325
252
|
};
|
326
|
-
|
327
253
|
var _useCheckInVirtual = VirtualList.useCheckInVirtual(virtualListProps),
|
328
|
-
|
329
|
-
|
254
|
+
inVirtual = _useCheckInVirtual.inVirtual;
|
330
255
|
var cls = classname.cx(prefixCls, className, prefixCls + "--" + (menuVisible ? 'open' : 'closed'));
|
331
256
|
var listRef = React.useRef(null);
|
332
257
|
React.useEffect(function () {
|
333
|
-
var _a;
|
334
|
-
|
335
|
-
|
258
|
+
var _a;
|
259
|
+
// 每次打开或数据改变时触发一次滚动条显示
|
336
260
|
if (menuVisible && typeAssertion.isArrayNonEmpty(showData)) {
|
337
261
|
(_a = listRef.current) === null || _a === void 0 ? void 0 : _a.scrollTo(undefined);
|
338
262
|
}
|
339
263
|
}, [menuVisible, showData]);
|
340
|
-
return /*#__PURE__*/
|
264
|
+
return /*#__PURE__*/React.createElement(context.CheckSelectProvider, {
|
341
265
|
value: context$1
|
342
|
-
}, /*#__PURE__*/
|
266
|
+
}, /*#__PURE__*/React.createElement(picker.Picker, Object.assign({
|
343
267
|
ref: ref,
|
344
268
|
className: cls
|
345
269
|
}, rootProps, {
|
@@ -353,13 +277,13 @@ var CheckSelect = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
353
277
|
onSearch: funcUtils.callAllFuncs(onSearchProp, onSearch),
|
354
278
|
loading: rest.loading !== undefined ? rest.loading : loading,
|
355
279
|
footer: renderDefaultFooter(),
|
356
|
-
trigger: customRender ? typeof customRender === 'function' ? customRender(checkedItems) : customRender : /*#__PURE__*/
|
280
|
+
trigger: customRender ? typeof customRender === 'function' ? customRender(checkedItems) : customRender : /*#__PURE__*/React.createElement(tagInput.TagInputMock, Object.assign({}, tagInputProps, {
|
357
281
|
size: size,
|
358
282
|
clearable: clearable,
|
359
283
|
placeholder: placeholder,
|
360
284
|
// @ts-ignore
|
361
285
|
displayRender: displayRender,
|
362
|
-
suffix: menuVisible ? /*#__PURE__*/
|
286
|
+
suffix: menuVisible ? /*#__PURE__*/React.createElement(icons.UpOutlined, null) : /*#__PURE__*/React.createElement(icons.DownOutlined, null),
|
363
287
|
focused: menuVisible,
|
364
288
|
appearance: appearance,
|
365
289
|
value: value,
|
@@ -369,14 +293,12 @@ var CheckSelect = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
369
293
|
invalid: invalid,
|
370
294
|
onClick: function onClick(evt) {
|
371
295
|
if (!showOnlyShowChecked) return;
|
372
|
-
if (disabled) return;
|
373
|
-
|
296
|
+
if (disabled) return;
|
297
|
+
// 阻止 Picker 调用 onOpen/onClose
|
374
298
|
evt.preventDefault();
|
375
|
-
|
376
299
|
if (filterItems) {
|
377
300
|
setFilterItems(null);
|
378
301
|
}
|
379
|
-
|
380
302
|
if (menuVisible) {
|
381
303
|
if (expandedViewRef.current === 'normal') {
|
382
304
|
menuVisibleAction.off();
|
@@ -384,15 +306,14 @@ var CheckSelect = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
384
306
|
} else {
|
385
307
|
menuVisibleAction.on();
|
386
308
|
}
|
387
|
-
|
388
309
|
expandedViewRef.current = 'normal';
|
389
310
|
},
|
390
311
|
expandable: showOnlyShowChecked,
|
391
312
|
activeExpandable: activeExpandable,
|
392
313
|
onExpand: function onExpand(evt) {
|
393
314
|
if (!showOnlyShowChecked) return;
|
394
|
-
if (disabled) return;
|
395
|
-
|
315
|
+
if (disabled) return;
|
316
|
+
// 阻止冒泡触发外层 onClick
|
396
317
|
evt.stopPropagation();
|
397
318
|
evt.preventDefault();
|
398
319
|
setFilterItems(function () {
|
@@ -400,7 +321,6 @@ var CheckSelect = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
400
321
|
return value.includes(item.id);
|
401
322
|
});
|
402
323
|
});
|
403
|
-
|
404
324
|
if (menuVisible) {
|
405
325
|
if (expandedViewRef.current !== 'normal') {
|
406
326
|
menuVisibleAction.off();
|
@@ -408,19 +328,18 @@ var CheckSelect = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
408
328
|
} else {
|
409
329
|
menuVisibleAction.on();
|
410
330
|
}
|
411
|
-
|
412
331
|
expandedViewRef.current = 'onlyChecked';
|
413
332
|
}
|
414
333
|
}))
|
415
|
-
}), typeAssertion.isArrayNonEmpty(dropdownItems) ? /*#__PURE__*/
|
334
|
+
}), typeAssertion.isArrayNonEmpty(dropdownItems) ? /*#__PURE__*/React.createElement(VirtualList, Object.assign({
|
416
335
|
ref: listRef,
|
417
336
|
itemKey: "id",
|
418
337
|
fullHeight: false
|
419
338
|
}, virtualListProps), function (node, index) {
|
420
339
|
/* 反向 map,搜索删选数据时会对数据进行处理 */
|
421
|
-
return 'groupTitle' in node ? /*#__PURE__*/
|
340
|
+
return 'groupTitle' in node ? /*#__PURE__*/React.createElement(CheckSelectOptionGroup, {
|
422
341
|
label: node.groupTitle
|
423
|
-
}) : /*#__PURE__*/
|
342
|
+
}) : /*#__PURE__*/React.createElement(CheckSelectOption, {
|
424
343
|
option: node,
|
425
344
|
depth: node.depth,
|
426
345
|
titleRender: proxyTitleRender,
|
@@ -430,34 +349,30 @@ var CheckSelect = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
430
349
|
focused: focusedIndex === index
|
431
350
|
});
|
432
351
|
}) : null));
|
433
|
-
});
|
434
|
-
|
352
|
+
});
|
353
|
+
// @ts-ignore
|
435
354
|
CheckSelect.HiName = 'CheckSelect';
|
436
|
-
|
437
355
|
if (env.__DEV__) {
|
438
356
|
CheckSelect.displayName = 'CheckSelect';
|
439
357
|
}
|
440
|
-
|
441
358
|
var optionPrefix = classname.getPrefixCls('check-select-option');
|
442
359
|
var CheckSelectOption = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
443
360
|
var _a$prefixCls2 = _a.prefixCls,
|
444
|
-
|
445
|
-
|
446
|
-
|
447
|
-
|
448
|
-
|
449
|
-
|
450
|
-
|
451
|
-
|
452
|
-
|
453
|
-
|
361
|
+
prefixCls = _a$prefixCls2 === void 0 ? optionPrefix : _a$prefixCls2,
|
362
|
+
className = _a.className,
|
363
|
+
_a$option = _a.option,
|
364
|
+
option = _a$option === void 0 ? {} : _a$option,
|
365
|
+
onClick = _a.onClick,
|
366
|
+
titleRender = _a.titleRender,
|
367
|
+
depth = _a.depth,
|
368
|
+
focused = _a.focused,
|
369
|
+
rest = tslib.__rest(_a, ["prefixCls", "className", "children", "option", "onClick", "titleRender", "depth", "focused"]);
|
454
370
|
var _useCheckSelectContex = context.useCheckSelectContext(),
|
455
|
-
|
456
|
-
|
457
|
-
|
371
|
+
isCheckedId = _useCheckSelectContex.isCheckedId,
|
372
|
+
onSelect = _useCheckSelectContex.onSelect;
|
458
373
|
var id = option.id,
|
459
|
-
|
460
|
-
|
374
|
+
_option$disabled = option.disabled,
|
375
|
+
disabled = _option$disabled === void 0 ? false : _option$disabled;
|
461
376
|
var checked = isCheckedId(id);
|
462
377
|
var eventNodeRef = useLatest.useLatestRef(Object.assign({}, option, {
|
463
378
|
disabled: disabled,
|
@@ -471,65 +386,58 @@ var CheckSelectOption = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
471
386
|
var renderTitle = React.useCallback(function (node, titleRender) {
|
472
387
|
// 如果 titleRender 返回 `true`,则使用默认 title
|
473
388
|
var title = titleRender ? titleRender(node) : true;
|
474
|
-
return /*#__PURE__*/
|
389
|
+
return /*#__PURE__*/React.createElement("div", {
|
475
390
|
className: prefixCls + "__title"
|
476
|
-
}, title === true ? /*#__PURE__*/
|
391
|
+
}, title === true ? /*#__PURE__*/React.createElement(Checkbox, {
|
477
392
|
checked: node.checked,
|
478
393
|
disabled: node.disabled
|
479
394
|
}, node.title) : title);
|
480
395
|
}, [prefixCls]);
|
481
|
-
return /*#__PURE__*/
|
396
|
+
return /*#__PURE__*/React.createElement("div", Object.assign({
|
482
397
|
ref: ref,
|
483
398
|
className: cls
|
484
399
|
}, rest, {
|
485
400
|
onClick: handleOptionCheck
|
486
401
|
}), renderIndent(prefixCls, depth), renderTitle(eventNodeRef.current, titleRender));
|
487
|
-
});
|
488
|
-
|
402
|
+
});
|
403
|
+
// @ts-ignore
|
489
404
|
CheckSelectOption.HiName = 'CheckSelectOption';
|
490
|
-
|
491
405
|
if (env.__DEV__) {
|
492
406
|
CheckSelectOption.displayName = 'CheckSelectOption';
|
493
407
|
}
|
494
|
-
|
495
408
|
var optionGroupPrefix = classname.getPrefixCls('select-option-group');
|
496
409
|
var CheckSelectOptionGroup = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
497
410
|
var _a$prefixCls3 = _a.prefixCls,
|
498
|
-
|
499
|
-
|
500
|
-
|
501
|
-
|
502
|
-
|
411
|
+
prefixCls = _a$prefixCls3 === void 0 ? optionGroupPrefix : _a$prefixCls3,
|
412
|
+
className = _a.className,
|
413
|
+
label = _a.label,
|
414
|
+
rest = tslib.__rest(_a, ["prefixCls", "className", "label"]);
|
503
415
|
var cls = classname.cx(prefixCls, className);
|
504
|
-
return /*#__PURE__*/
|
416
|
+
return /*#__PURE__*/React.createElement("div", Object.assign({
|
505
417
|
ref: ref,
|
506
418
|
className: cls
|
507
|
-
}, rest), /*#__PURE__*/
|
508
|
-
});
|
509
|
-
|
419
|
+
}, rest), /*#__PURE__*/React.createElement("span", null, label));
|
420
|
+
});
|
421
|
+
// @ts-ignore
|
510
422
|
CheckSelectOptionGroup.HiName = 'CheckSelectOptionGroup';
|
511
|
-
|
512
423
|
if (env.__DEV__) {
|
513
424
|
CheckSelectOptionGroup.displayName = 'CheckSelectOptionGroup';
|
514
425
|
}
|
515
426
|
/**
|
516
427
|
* 渲染空白占位
|
517
428
|
*/
|
518
|
-
|
519
|
-
|
520
429
|
var renderIndent = function renderIndent(prefixCls, depth) {
|
521
430
|
return arrayUtils.times(depth, function (index) {
|
522
|
-
return /*#__PURE__*/
|
431
|
+
return /*#__PURE__*/React.createElement("span", {
|
523
432
|
key: index,
|
524
433
|
style: {
|
525
434
|
alignSelf: 'stretch'
|
526
435
|
}
|
527
|
-
}, /*#__PURE__*/
|
436
|
+
}, /*#__PURE__*/React.createElement("span", {
|
528
437
|
className: classname.cx(prefixCls + "__indent")
|
529
438
|
}));
|
530
439
|
});
|
531
440
|
};
|
532
|
-
|
533
441
|
exports.CheckSelect = CheckSelect;
|
534
442
|
exports.CheckSelectOption = CheckSelectOption;
|
535
443
|
exports.CheckSelectOptionGroup = CheckSelectOptionGroup;
|
package/lib/cjs/context.js
CHANGED
@@ -9,24 +9,15 @@
|
|
9
9
|
*/
|
10
10
|
'use strict';
|
11
11
|
|
12
|
-
Object.defineProperty(exports, '__esModule', {
|
13
|
-
value: true
|
14
|
-
});
|
15
|
-
|
16
12
|
var React = require('react');
|
17
|
-
|
18
13
|
var checkSelectContext = /*#__PURE__*/React.createContext(null);
|
19
14
|
var CheckSelectProvider = checkSelectContext.Provider;
|
20
|
-
|
21
15
|
var useCheckSelectContext = function useCheckSelectContext() {
|
22
16
|
var context = React.useContext(checkSelectContext);
|
23
|
-
|
24
17
|
if (!context) {
|
25
18
|
throw new Error('The checkSelectContext context should using in CheckSelect.');
|
26
19
|
}
|
27
|
-
|
28
20
|
return context;
|
29
21
|
};
|
30
|
-
|
31
22
|
exports.CheckSelectProvider = CheckSelectProvider;
|
32
23
|
exports.useCheckSelectContext = useCheckSelectContext;
|