@hi-ui/check-tree-select 4.3.0 → 4.3.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +27 -0
- package/lib/cjs/CheckTreeSelect.js +112 -178
- package/lib/cjs/hooks/use-check.js +31 -47
- package/lib/cjs/index.js +0 -3
- package/lib/cjs/styles/index.scss.js +0 -3
- package/lib/cjs/utils/index.js +10 -39
- package/lib/esm/CheckTreeSelect.js +106 -136
- package/lib/esm/hooks/use-check.js +31 -39
- package/lib/esm/styles/index.scss.js +0 -2
- package/lib/esm/utils/index.js +10 -33
- package/package.json +22 -22
package/CHANGELOG.md
CHANGED
@@ -1,5 +1,32 @@
|
|
1
1
|
# @hi-ui/check-tree-select
|
2
2
|
|
3
|
+
## 4.3.1
|
4
|
+
|
5
|
+
### Patch Changes
|
6
|
+
|
7
|
+
- [#2672](https://github.com/XiaoMi/hiui/pull/2672) [`1ebe27830`](https://github.com/XiaoMi/hiui/commit/1ebe2783098b3a8cd980bd10076d67635463800e) Thanks [@zyprepare](https://github.com/zyprepare)! - build: 升级到 rollup3,重新构建发布组件
|
8
|
+
|
9
|
+
- Updated dependencies [[`1ebe27830`](https://github.com/XiaoMi/hiui/commit/1ebe2783098b3a8cd980bd10076d67635463800e)]:
|
10
|
+
- @hi-ui/core@4.0.6
|
11
|
+
- @hi-ui/use-check@4.0.3
|
12
|
+
- @hi-ui/use-data-source@4.0.2
|
13
|
+
- @hi-ui/use-search-mode@4.1.2
|
14
|
+
- @hi-ui/use-toggle@4.0.2
|
15
|
+
- @hi-ui/use-uncontrolled-state@4.0.2
|
16
|
+
- @hi-ui/icons@4.0.16
|
17
|
+
- @hi-ui/checkbox@4.0.6
|
18
|
+
- @hi-ui/highlighter@4.0.6
|
19
|
+
- @hi-ui/picker@4.1.2
|
20
|
+
- @hi-ui/popper@4.1.1
|
21
|
+
- @hi-ui/tag-input@4.0.8
|
22
|
+
- @hi-ui/tree@4.5.6
|
23
|
+
- @hi-ui/array-utils@4.0.2
|
24
|
+
- @hi-ui/classname@4.0.2
|
25
|
+
- @hi-ui/env@4.0.2
|
26
|
+
- @hi-ui/func-utils@4.0.2
|
27
|
+
- @hi-ui/tree-utils@4.1.2
|
28
|
+
- @hi-ui/type-assertion@4.0.2
|
29
|
+
|
3
30
|
## 4.3.0
|
4
31
|
|
5
32
|
### Minor Changes
|
@@ -9,62 +9,26 @@
|
|
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 useToggle = require('@hi-ui/use-toggle');
|
27
|
-
|
28
17
|
var tree = require('@hi-ui/tree');
|
29
|
-
|
30
18
|
var useUncontrolledState = require('@hi-ui/use-uncontrolled-state');
|
31
|
-
|
32
19
|
var picker = require('@hi-ui/picker');
|
33
|
-
|
34
20
|
var treeUtils = require('@hi-ui/tree-utils');
|
35
|
-
|
36
21
|
var typeAssertion = require('@hi-ui/type-assertion');
|
37
|
-
|
38
22
|
var arrayUtils = require('@hi-ui/array-utils');
|
39
|
-
|
40
23
|
var highlighter = require('@hi-ui/highlighter');
|
41
|
-
|
42
24
|
var tagInput = require('@hi-ui/tag-input');
|
43
|
-
|
44
25
|
var icons = require('@hi-ui/icons');
|
45
|
-
|
46
26
|
var core = require('@hi-ui/core');
|
47
|
-
|
48
27
|
var funcUtils = require('@hi-ui/func-utils');
|
49
|
-
|
50
28
|
var Checkbox = require('@hi-ui/checkbox');
|
51
|
-
|
52
29
|
var useSearchMode = require('@hi-ui/use-search-mode');
|
53
|
-
|
54
30
|
var useCheck = require('./hooks/use-check.js');
|
55
|
-
|
56
31
|
var index = require('./utils/index.js');
|
57
|
-
|
58
|
-
function _interopDefaultLegacy(e) {
|
59
|
-
return e && _typeof(e) === 'object' && 'default' in e ? e : {
|
60
|
-
'default': e
|
61
|
-
};
|
62
|
-
}
|
63
|
-
|
64
|
-
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
65
|
-
|
66
|
-
var Checkbox__default = /*#__PURE__*/_interopDefaultLegacy(Checkbox);
|
67
|
-
|
68
32
|
var TREE_SELECT_PREFIX = classname.getPrefixCls('check-tree-select');
|
69
33
|
var DEFAULT_DATA = [];
|
70
34
|
var DEFAULT_VALUE = [];
|
@@ -73,69 +37,64 @@ var DEFAULT_EXPANDED_IDS = [];
|
|
73
37
|
/**
|
74
38
|
* 多项树形选择器
|
75
39
|
*/
|
76
|
-
|
77
40
|
var CheckTreeSelect = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
78
41
|
var _a$prefixCls = _a.prefixCls,
|
79
|
-
|
80
|
-
|
81
|
-
|
82
|
-
|
83
|
-
|
84
|
-
|
85
|
-
|
86
|
-
|
87
|
-
|
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
|
-
|
42
|
+
prefixCls = _a$prefixCls === void 0 ? TREE_SELECT_PREFIX : _a$prefixCls,
|
43
|
+
className = _a.className,
|
44
|
+
_a$data = _a.data,
|
45
|
+
data = _a$data === void 0 ? DEFAULT_DATA : _a$data,
|
46
|
+
dataSource = _a.dataSource,
|
47
|
+
_a$disabled = _a.disabled,
|
48
|
+
disabled = _a$disabled === void 0 ? false : _a$disabled,
|
49
|
+
visible = _a.visible,
|
50
|
+
onOpen = _a.onOpen,
|
51
|
+
onClose = _a.onClose,
|
52
|
+
_a$fieldNames = _a.fieldNames,
|
53
|
+
fieldNames = _a$fieldNames === void 0 ? DEFAULT_FIELD_NAMES : _a$fieldNames,
|
54
|
+
_a$checkedMode = _a.checkedMode,
|
55
|
+
checkedMode = _a$checkedMode === void 0 ? 'ALL' : _a$checkedMode,
|
56
|
+
_a$defaultExpandAll = _a.defaultExpandAll,
|
57
|
+
defaultExpandAll = _a$defaultExpandAll === void 0 ? false : _a$defaultExpandAll,
|
58
|
+
expandedIdsProp = _a.expandedIds,
|
59
|
+
_a$defaultExpandedIds = _a.defaultExpandedIds,
|
60
|
+
defaultExpandedIds = _a$defaultExpandedIds === void 0 ? DEFAULT_EXPANDED_IDS : _a$defaultExpandedIds,
|
61
|
+
onExpand = _a.onExpand,
|
62
|
+
_a$defaultValue = _a.defaultValue,
|
63
|
+
defaultValue = _a$defaultValue === void 0 ? DEFAULT_VALUE : _a$defaultValue,
|
64
|
+
valueProp = _a.value,
|
65
|
+
onChange = _a.onChange,
|
66
|
+
searchableProp = _a.searchable,
|
67
|
+
searchModeProp = _a.searchMode,
|
68
|
+
onLoadChildren = _a.onLoadChildren,
|
69
|
+
titleRender = _a.render,
|
70
|
+
filterOption = _a.filterOption,
|
71
|
+
onSearchProp = _a.onSearch,
|
72
|
+
clearable = _a.clearable,
|
73
|
+
invalid = _a.invalid,
|
74
|
+
displayRender = _a.displayRender,
|
75
|
+
placeholderProp = _a.placeholder,
|
76
|
+
appearance = _a.appearance,
|
77
|
+
virtual = _a.virtual,
|
78
|
+
itemHeight = _a.itemHeight,
|
79
|
+
height = _a.height,
|
80
|
+
showCheckAll = _a.showCheckAll,
|
81
|
+
tagInputProps = _a.tagInputProps,
|
82
|
+
_a$size = _a.size,
|
83
|
+
size = _a$size === void 0 ? 'md' : _a$size,
|
84
|
+
rest = tslib.__rest(_a, ["prefixCls", "role", "className", "data", "dataSource", "disabled", "visible", "onOpen", "onClose", "fieldNames", "checkedMode", "defaultExpandAll", "expandedIds", "defaultExpandedIds", "onExpand", "defaultValue", "value", "onChange", "searchable", "searchMode", "onLoadChildren", "render", "filterOption", "onSearch", "clearable", "invalid", "displayRender", "placeholder", "appearance", "virtual", "itemHeight", "height", "showCheckAll", "tagInputProps", "size"]);
|
123
85
|
var i18n = core.useLocaleContext();
|
124
86
|
var placeholder = typeAssertion.isUndef(placeholderProp) ? i18n.get('checkTreeSelect.placeholder') : placeholderProp;
|
125
|
-
|
126
87
|
var _useUncontrolledToggl = useToggle.useUncontrolledToggle({
|
127
|
-
|
128
|
-
|
129
|
-
|
130
|
-
|
131
|
-
|
132
|
-
|
133
|
-
|
88
|
+
visible: visible,
|
89
|
+
disabled: disabled,
|
90
|
+
onOpen: onOpen,
|
91
|
+
onClose: onClose
|
92
|
+
}),
|
93
|
+
menuVisible = _useUncontrolledToggl[0],
|
94
|
+
menuVisibleAction = _useUncontrolledToggl[1];
|
134
95
|
/**
|
135
96
|
* 转换对象
|
136
97
|
*/
|
137
|
-
|
138
|
-
|
139
98
|
var getKeyFields = React.useCallback(function (node, key) {
|
140
99
|
return node[fieldNames[key] || key];
|
141
100
|
}, [fieldNames]);
|
@@ -147,7 +106,6 @@ var CheckTreeSelect = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
147
106
|
},
|
148
107
|
transform: function transform(node) {
|
149
108
|
var _a, _b;
|
150
|
-
|
151
109
|
var flattedNode = node;
|
152
110
|
var raw = node.raw;
|
153
111
|
flattedNode.id = getKeyFields(raw, 'id');
|
@@ -157,32 +115,29 @@ var CheckTreeSelect = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
157
115
|
return flattedNode;
|
158
116
|
}
|
159
117
|
});
|
160
|
-
}, [data, getKeyFields]);
|
118
|
+
}, [data, getKeyFields]);
|
119
|
+
// TODO: 抽离展开hook
|
161
120
|
// TODO: onLoadChildren 和 defaultExpandAll 共存时
|
162
|
-
|
163
121
|
var _useUncontrolledState = useUncontrolledState.useUncontrolledState(function getDefaultExpandedIds() {
|
164
|
-
|
165
|
-
|
166
|
-
|
167
|
-
|
168
|
-
|
169
|
-
|
170
|
-
|
171
|
-
|
172
|
-
|
173
|
-
|
174
|
-
tryChangeExpandedIds = _useUncontrolledState[1];
|
175
|
-
|
122
|
+
// 开启默认展开全部
|
123
|
+
if (defaultExpandAll) {
|
124
|
+
return flattedData.map(function (node) {
|
125
|
+
return node.id;
|
126
|
+
});
|
127
|
+
}
|
128
|
+
return defaultExpandedIds;
|
129
|
+
}, expandedIdsProp, onExpand),
|
130
|
+
expandedIds = _useUncontrolledState[0],
|
131
|
+
tryChangeExpandedIds = _useUncontrolledState[1];
|
176
132
|
var _useCheck = useCheck.useCheck(checkedMode, disabled, flattedData, defaultValue, valueProp, onChange),
|
177
|
-
|
178
|
-
|
179
|
-
|
180
|
-
|
181
|
-
|
182
|
-
|
133
|
+
value = _useCheck[0],
|
134
|
+
tryChangeValue = _useCheck[1],
|
135
|
+
onNodeCheck = _useCheck[2],
|
136
|
+
checkedNodes = _useCheck[3],
|
137
|
+
parsedCheckedIds = _useCheck[4];
|
183
138
|
var onCheck = React.useCallback(function (checkedIds, option) {
|
184
139
|
var targetNode = option.targetNode,
|
185
|
-
|
140
|
+
checked = option.checked;
|
186
141
|
onNodeCheck(targetNode, checked);
|
187
142
|
}, [onNodeCheck]);
|
188
143
|
var onValueChange = React.useCallback(function (values, targetItem, shouldChecked) {
|
@@ -193,16 +148,15 @@ var CheckTreeSelect = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
193
148
|
// 操作单个
|
194
149
|
onNodeCheck(targetItem[0], shouldChecked);
|
195
150
|
}
|
196
|
-
}, [tryChangeValue, onNodeCheck]);
|
151
|
+
}, [tryChangeValue, onNodeCheck]);
|
152
|
+
// ************************** 异步搜索 ************************* //
|
197
153
|
// const { loading, hasError, loadRemoteData } = useDataSource({ dataSource, validate: isArray })
|
198
|
-
|
199
154
|
var _b = useSearchMode.useAsyncSearch({
|
200
|
-
|
201
|
-
|
202
|
-
|
203
|
-
|
204
|
-
|
205
|
-
|
155
|
+
dataSource: dataSource
|
156
|
+
}),
|
157
|
+
loading = _b.loading,
|
158
|
+
hasError = _b.hasError,
|
159
|
+
dataSourceStrategy = tslib.__rest(_b, ["loading", "hasError"]);
|
206
160
|
var customSearchStrategy = useSearchMode.useTreeCustomSearch({
|
207
161
|
data: data,
|
208
162
|
filterOption: filterOption
|
@@ -218,29 +172,25 @@ var CheckTreeSelect = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
218
172
|
flattedData: flattedData,
|
219
173
|
searchMode: searchModeProp
|
220
174
|
});
|
221
|
-
|
222
175
|
var _useSearchMode = useSearchMode.useSearchMode({
|
223
|
-
|
224
|
-
|
225
|
-
|
226
|
-
|
227
|
-
|
228
|
-
|
229
|
-
|
230
|
-
|
231
|
-
|
232
|
-
|
233
|
-
|
176
|
+
searchable: searchableProp,
|
177
|
+
strategies: [dataSourceStrategy, customSearchStrategy, filterSearchStrategy, highlightSearchStrategy]
|
178
|
+
}),
|
179
|
+
stateInSearch = _useSearchMode.state,
|
180
|
+
setStateInSearch = _useSearchMode.setStateInSearch,
|
181
|
+
searchable = _useSearchMode.searchable,
|
182
|
+
searchMode = _useSearchMode.searchMode,
|
183
|
+
onSearch = _useSearchMode.onSearch,
|
184
|
+
searchValue = _useSearchMode.keyword;
|
185
|
+
// 拦截 titleRender,自定义高亮展示
|
234
186
|
var proxyTitleRender = React.useCallback(function (node) {
|
235
187
|
if (titleRender) {
|
236
188
|
var _ret = titleRender(node);
|
237
|
-
|
238
189
|
if (_ret && _ret !== true) return _ret;
|
239
|
-
}
|
240
|
-
|
241
|
-
|
190
|
+
}
|
191
|
+
// 本地搜索执行默认高亮规则
|
242
192
|
var highlight = !!searchValue && (searchMode === 'highlight' || searchMode === 'filter');
|
243
|
-
var ret = highlight ? /*#__PURE__*/
|
193
|
+
var ret = highlight ? /*#__PURE__*/React.createElement(highlighter.Highlighter, {
|
244
194
|
keyword: searchValue
|
245
195
|
}, node.title) : true;
|
246
196
|
return ret;
|
@@ -257,19 +207,18 @@ var CheckTreeSelect = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
257
207
|
});
|
258
208
|
} : tryChangeExpandedIds,
|
259
209
|
render: proxyTitleRender
|
260
|
-
};
|
261
|
-
|
210
|
+
};
|
211
|
+
// 下拉菜单不能合并(因为树形数据,不知道是第几级)
|
262
212
|
var mergedData = React.useMemo(function () {
|
263
213
|
var nextData = checkedNodes.concat(flattedData);
|
264
214
|
return arrayUtils.uniqBy(nextData, 'id');
|
265
215
|
}, [checkedNodes, flattedData]);
|
266
216
|
var toggleCheckAll = React.useCallback(function () {
|
267
217
|
var _getAllCheckedStatus = index.getAllCheckedStatus(flattedData, parsedCheckedIds),
|
268
|
-
|
269
|
-
|
270
|
-
|
271
|
-
|
272
|
-
|
218
|
+
currentAllChecked = _getAllCheckedStatus[0],
|
219
|
+
hasCheckedAll = _getAllCheckedStatus[2];
|
220
|
+
var shouldChecked = !currentAllChecked;
|
221
|
+
// 全选操作
|
273
222
|
if (!currentAllChecked && !hasCheckedAll) {
|
274
223
|
tryChangeValue(flattedData.filter(function (item) {
|
275
224
|
if (!item.disabled) {
|
@@ -277,14 +226,11 @@ var CheckTreeSelect = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
277
226
|
if (checkedMode === 'CHILD') {
|
278
227
|
return !item.children;
|
279
228
|
}
|
280
|
-
|
281
229
|
if (checkedMode === 'PARENT') {
|
282
230
|
return item.depth === 0;
|
283
231
|
}
|
284
|
-
|
285
232
|
return true;
|
286
233
|
}
|
287
|
-
|
288
234
|
return false;
|
289
235
|
}).map(function (_ref) {
|
290
236
|
var id = _ref.id;
|
@@ -294,32 +240,29 @@ var CheckTreeSelect = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
294
240
|
tryChangeValue([], null, shouldChecked, []);
|
295
241
|
}
|
296
242
|
}, [checkedMode, flattedData, parsedCheckedIds, tryChangeValue]);
|
297
|
-
|
298
243
|
var _useMemo = React.useMemo(function () {
|
299
|
-
|
300
|
-
|
301
|
-
|
302
|
-
|
303
|
-
|
244
|
+
return index.getAllCheckedStatus(flattedData, parsedCheckedIds);
|
245
|
+
}, [flattedData, parsedCheckedIds]),
|
246
|
+
showAllChecked = _useMemo[0],
|
247
|
+
showIndeterminate = _useMemo[1];
|
304
248
|
var renderDefaultFooter = function renderDefaultFooter() {
|
305
249
|
if (showCheckAll) {
|
306
|
-
return /*#__PURE__*/
|
250
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Checkbox, {
|
307
251
|
indeterminate: showIndeterminate,
|
308
252
|
checked: showAllChecked,
|
309
253
|
onChange: toggleCheckAll
|
310
254
|
}, i18n.get('checkSelect.checkAll')));
|
311
255
|
}
|
312
256
|
};
|
313
|
-
|
314
|
-
|
257
|
+
var cls = classname.cx(prefixCls, className);
|
258
|
+
// 过滤掉未选中的数据
|
315
259
|
// const tagList = useMemo(() => {
|
316
260
|
// // @ts-ignore
|
317
261
|
// const [semiCheckedIds] = getSemiCheckedIdsWithSet(flattedData, (id) => value.includes(id))
|
318
262
|
// const ids = Array.from(new Set([...semiCheckedIds, ...value]))
|
319
263
|
// return flattedData.filter((item) => ids.includes(item.id))
|
320
264
|
// }, [value, flattedData])
|
321
|
-
|
322
|
-
return /*#__PURE__*/React__default["default"].createElement(picker.Picker, Object.assign({
|
265
|
+
return /*#__PURE__*/React.createElement(picker.Picker, Object.assign({
|
323
266
|
ref: ref,
|
324
267
|
className: cls
|
325
268
|
}, rest, {
|
@@ -337,7 +280,7 @@ var CheckTreeSelect = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
337
280
|
onSearch: funcUtils.callAllFuncs(onSearchProp, onSearch),
|
338
281
|
footer: renderDefaultFooter(),
|
339
282
|
loading: rest.loading !== undefined ? rest.loading : loading,
|
340
|
-
trigger: /*#__PURE__*/
|
283
|
+
trigger: /*#__PURE__*/React.createElement(tagInput.TagInputMock, Object.assign({}, tagInputProps, {
|
341
284
|
size: size,
|
342
285
|
// ref={targetElementRef}
|
343
286
|
// onClick={openMenu}
|
@@ -346,7 +289,7 @@ var CheckTreeSelect = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
346
289
|
placeholder: placeholder,
|
347
290
|
// @ts-ignore
|
348
291
|
displayRender: displayRender,
|
349
|
-
suffix: menuVisible ? /*#__PURE__*/
|
292
|
+
suffix: menuVisible ? /*#__PURE__*/React.createElement(icons.UpOutlined, null) : /*#__PURE__*/React.createElement(icons.DownOutlined, null),
|
350
293
|
focused: menuVisible,
|
351
294
|
appearance: appearance,
|
352
295
|
value: value,
|
@@ -355,10 +298,9 @@ var CheckTreeSelect = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
355
298
|
// @ts-ignore
|
356
299
|
invalid: invalid
|
357
300
|
}))
|
358
|
-
}), typeAssertion.isArrayNonEmpty(treeProps.data) ?
|
359
|
-
/*#__PURE__*/
|
301
|
+
}), typeAssertion.isArrayNonEmpty(treeProps.data) ? /*#__PURE__*/
|
360
302
|
// 只做渲染,不做逻辑处理(比如搜索过滤后,check操作的是对过滤后的data操作,这是不符合预期的)
|
361
|
-
|
303
|
+
React.createElement(tree.Tree, Object.assign({
|
362
304
|
size: 'md',
|
363
305
|
className: prefixCls + "__tree",
|
364
306
|
selectable: false,
|
@@ -375,11 +317,9 @@ var CheckTreeSelect = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
375
317
|
height: height
|
376
318
|
}, treeProps)) : null);
|
377
319
|
});
|
378
|
-
|
379
320
|
if (env.__DEV__) {
|
380
321
|
CheckTreeSelect.displayName = 'CheckTreeSelect';
|
381
322
|
}
|
382
|
-
|
383
323
|
var ALWAYS_ALLOW = function ALWAYS_ALLOW() {
|
384
324
|
return true;
|
385
325
|
};
|
@@ -390,39 +330,34 @@ var ALWAYS_ALLOW = function ALWAYS_ALLOW() {
|
|
390
330
|
* @param flattedData
|
391
331
|
* @returns
|
392
332
|
*/
|
393
|
-
|
394
|
-
|
395
333
|
var getSemiCheckedIdsWithSet = function getSemiCheckedIdsWithSet(flattedData, isChecked, allowCheck) {
|
396
334
|
if (allowCheck === void 0) {
|
397
335
|
allowCheck = ALWAYS_ALLOW;
|
398
336
|
}
|
399
|
-
|
400
337
|
var semiCheckedNodes = [];
|
401
338
|
var semiCheckedIdsSet = new Set();
|
402
339
|
var parentId;
|
403
340
|
var parent;
|
404
341
|
flattedData.forEach(function (node) {
|
405
342
|
parent = node.parent;
|
406
|
-
|
407
343
|
if (parent && parent.id !== undefined) {
|
408
344
|
if (!allowCheck(parent)) return;
|
409
345
|
parentId = parent.id;
|
410
|
-
if (semiCheckedIdsSet.has(parentId)) return;
|
411
|
-
|
346
|
+
if (semiCheckedIdsSet.has(parentId)) return;
|
347
|
+
// 父节点没选中,但是当前节点被选中,则视为半选
|
412
348
|
if (!isChecked(parentId) && isChecked(node.id)) {
|
413
349
|
semiCheckedIdsSet.add(parentId);
|
414
350
|
semiCheckedNodes.push(parent);
|
415
351
|
}
|
416
352
|
}
|
417
|
-
});
|
418
|
-
|
353
|
+
});
|
354
|
+
// 自下而上设置半选态
|
419
355
|
semiCheckedNodes.forEach(function (node) {
|
420
356
|
parent = node.parent;
|
421
|
-
|
422
357
|
while (parent && parent.id !== undefined) {
|
423
358
|
if (!allowCheck(parent)) return;
|
424
|
-
parentId = parent.id;
|
425
|
-
|
359
|
+
parentId = parent.id;
|
360
|
+
// 可能存在兄弟节点,共同祖先需要去重,避免重复计算
|
426
361
|
if (semiCheckedIdsSet.has(parentId)) return;
|
427
362
|
semiCheckedIdsSet.add(parentId);
|
428
363
|
parent = parent.parent;
|
@@ -431,6 +366,5 @@ var getSemiCheckedIdsWithSet = function getSemiCheckedIdsWithSet(flattedData, is
|
|
431
366
|
var semiCheckedIds = Array.from(semiCheckedIdsSet);
|
432
367
|
return [semiCheckedIds, semiCheckedIdsSet];
|
433
368
|
};
|
434
|
-
|
435
369
|
exports.CheckTreeSelect = CheckTreeSelect;
|
436
370
|
exports.getSemiCheckedIdsWithSet = getSemiCheckedIdsWithSet;
|
@@ -9,84 +9,68 @@
|
|
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 useUncontrolledState = require('@hi-ui/use-uncontrolled-state');
|
19
|
-
|
20
14
|
var useCheck$1 = require('@hi-ui/use-check');
|
21
|
-
|
22
15
|
var index = require('../utils/index.js');
|
16
|
+
|
23
17
|
/**
|
24
18
|
* 用于 tree 组件复选的 hook
|
25
19
|
*/
|
26
|
-
|
27
|
-
|
28
20
|
var useCheck = function useCheck(checkedMode, disabled, flattedData, defaultCheckedIds, checkedIdsProp, onCheck) {
|
29
21
|
// 搜索时临时选中缓存数据
|
30
22
|
var _useState = React.useState([]),
|
31
|
-
|
32
|
-
|
33
|
-
|
23
|
+
checkedNodes = _useState[0],
|
24
|
+
setCheckedNodes = _useState[1];
|
34
25
|
var _useUncontrolledState = useUncontrolledState.useUncontrolledState(defaultCheckedIds, checkedIdsProp, function (checkedIds, checkedNode, checked, semiCheckedIds) {
|
35
|
-
|
36
|
-
|
37
|
-
|
38
|
-
|
39
|
-
|
40
|
-
|
41
|
-
|
42
|
-
|
43
|
-
|
44
|
-
|
45
|
-
|
46
|
-
|
47
|
-
|
48
|
-
|
49
|
-
|
50
|
-
|
51
|
-
|
26
|
+
var nextCheckedNodes = flattedData.filter(function (item) {
|
27
|
+
return checkedIds.includes(item.id);
|
28
|
+
});
|
29
|
+
setCheckedNodes(nextCheckedNodes);
|
30
|
+
onCheck === null || onCheck === void 0 ? void 0 : onCheck(checkedIds, {
|
31
|
+
checkedNodes: nextCheckedNodes.map(function (item) {
|
32
|
+
return item.raw;
|
33
|
+
}),
|
34
|
+
targetNode: checkedNode,
|
35
|
+
semiCheckedIds: semiCheckedIds,
|
36
|
+
checked: checked
|
37
|
+
});
|
38
|
+
}),
|
39
|
+
checkedIds = _useUncontrolledState[0],
|
40
|
+
trySetCheckedIds = _useUncontrolledState[1];
|
41
|
+
// 入口数据处理
|
52
42
|
var parsedCheckedIds = React.useMemo(function () {
|
53
43
|
return index.parseCheckDataDirty(checkedMode, checkedIds, flattedData, allowCheck);
|
54
44
|
}, [checkedMode, checkedIds, flattedData]);
|
55
45
|
var cascaded = checkedMode !== 'SEPARATE';
|
56
|
-
|
57
46
|
var _useCascadeCheck = useCheck$1.useCascadeCheck({
|
58
|
-
|
59
|
-
|
60
|
-
|
61
|
-
|
62
|
-
|
63
|
-
|
64
|
-
|
65
|
-
|
66
|
-
|
67
|
-
|
68
|
-
|
69
|
-
|
70
|
-
|
47
|
+
cascaded: cascaded,
|
48
|
+
disabled: disabled,
|
49
|
+
flattedData: flattedData,
|
50
|
+
checkedIds: parsedCheckedIds,
|
51
|
+
onCheck: function onCheck(checkedIds, checkedNode, checked, semiCheckedIds) {
|
52
|
+
// 出口数据处理
|
53
|
+
var processedIds = index.processCheckedIds(checkedMode, checkedIds, flattedData, allowCheck);
|
54
|
+
trySetCheckedIds(processedIds, checkedNode, checked, semiCheckedIds);
|
55
|
+
},
|
56
|
+
allowCheck: allowCheck
|
57
|
+
}),
|
58
|
+
onNodeCheck = _useCascadeCheck[0];
|
71
59
|
var proxyOnNodeCheck = React.useCallback(function (target, shouldChecked) {
|
72
60
|
// 保证 target 来源于原数据自身,而不是tree内部
|
73
61
|
var targetNode = flattedData.find(function (item) {
|
74
62
|
return item.id === target.id;
|
75
63
|
});
|
76
|
-
|
77
64
|
if (targetNode) {
|
78
65
|
onNodeCheck(targetNode, shouldChecked);
|
79
66
|
}
|
80
67
|
}, [onNodeCheck, flattedData]);
|
81
68
|
return [checkedIds, trySetCheckedIds, proxyOnNodeCheck, checkedNodes, parsedCheckedIds];
|
82
69
|
};
|
83
|
-
|
84
70
|
var allowCheck = function allowCheck(targetItem) {
|
85
71
|
if (targetItem.disabled) {
|
86
72
|
return false;
|
87
73
|
}
|
88
|
-
|
89
74
|
return true;
|
90
75
|
};
|
91
|
-
|
92
76
|
exports.useCheck = useCheck;
|
package/lib/cjs/index.js
CHANGED
@@ -12,11 +12,8 @@
|
|
12
12
|
Object.defineProperty(exports, '__esModule', {
|
13
13
|
value: true
|
14
14
|
});
|
15
|
-
|
16
15
|
require('./styles/index.scss.js');
|
17
|
-
|
18
16
|
var CheckTreeSelect = require('./CheckTreeSelect.js');
|
19
|
-
|
20
17
|
exports.CheckTreeSelect = CheckTreeSelect.CheckTreeSelect;
|
21
18
|
exports["default"] = CheckTreeSelect.CheckTreeSelect;
|
22
19
|
exports.getSemiCheckedIdsWithSet = CheckTreeSelect.getSemiCheckedIdsWithSet;
|