@hi-ui/check-tree-select 4.2.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 +38 -0
- package/lib/cjs/CheckTreeSelect.js +114 -176
- 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 +108 -134
- 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/lib/types/CheckTreeSelect.d.ts +5 -0
- package/package.json +22 -22
package/CHANGELOG.md
CHANGED
@@ -1,5 +1,43 @@
|
|
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
|
+
|
30
|
+
## 4.3.0
|
31
|
+
|
32
|
+
### Minor Changes
|
33
|
+
|
34
|
+
- [#2604](https://github.com/XiaoMi/hiui/pull/2604) [`2dd977a5c`](https://github.com/XiaoMi/hiui/commit/2dd977a5c0db411e07aa5c4ea50ef04f37ebf8d2) Thanks [@zyprepare](https://github.com/zyprepare)! - feat: add size api
|
35
|
+
|
36
|
+
### Patch Changes
|
37
|
+
|
38
|
+
- Updated dependencies [[`534bfd298`](https://github.com/XiaoMi/hiui/commit/534bfd29852003af2209c3a64e5f1b2b1d37c19e)]:
|
39
|
+
- @hi-ui/tree@4.5.2
|
40
|
+
|
3
41
|
## 4.2.0
|
4
42
|
|
5
43
|
### 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,67 +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
|
-
|
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"]);
|
121
85
|
var i18n = core.useLocaleContext();
|
122
86
|
var placeholder = typeAssertion.isUndef(placeholderProp) ? i18n.get('checkTreeSelect.placeholder') : placeholderProp;
|
123
|
-
|
124
87
|
var _useUncontrolledToggl = useToggle.useUncontrolledToggle({
|
125
|
-
|
126
|
-
|
127
|
-
|
128
|
-
|
129
|
-
|
130
|
-
|
131
|
-
|
88
|
+
visible: visible,
|
89
|
+
disabled: disabled,
|
90
|
+
onOpen: onOpen,
|
91
|
+
onClose: onClose
|
92
|
+
}),
|
93
|
+
menuVisible = _useUncontrolledToggl[0],
|
94
|
+
menuVisibleAction = _useUncontrolledToggl[1];
|
132
95
|
/**
|
133
96
|
* 转换对象
|
134
97
|
*/
|
135
|
-
|
136
|
-
|
137
98
|
var getKeyFields = React.useCallback(function (node, key) {
|
138
99
|
return node[fieldNames[key] || key];
|
139
100
|
}, [fieldNames]);
|
@@ -145,7 +106,6 @@ var CheckTreeSelect = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
145
106
|
},
|
146
107
|
transform: function transform(node) {
|
147
108
|
var _a, _b;
|
148
|
-
|
149
109
|
var flattedNode = node;
|
150
110
|
var raw = node.raw;
|
151
111
|
flattedNode.id = getKeyFields(raw, 'id');
|
@@ -155,32 +115,29 @@ var CheckTreeSelect = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
155
115
|
return flattedNode;
|
156
116
|
}
|
157
117
|
});
|
158
|
-
}, [data, getKeyFields]);
|
118
|
+
}, [data, getKeyFields]);
|
119
|
+
// TODO: 抽离展开hook
|
159
120
|
// TODO: onLoadChildren 和 defaultExpandAll 共存时
|
160
|
-
|
161
121
|
var _useUncontrolledState = useUncontrolledState.useUncontrolledState(function getDefaultExpandedIds() {
|
162
|
-
|
163
|
-
|
164
|
-
|
165
|
-
|
166
|
-
|
167
|
-
|
168
|
-
|
169
|
-
|
170
|
-
|
171
|
-
|
172
|
-
tryChangeExpandedIds = _useUncontrolledState[1];
|
173
|
-
|
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];
|
174
132
|
var _useCheck = useCheck.useCheck(checkedMode, disabled, flattedData, defaultValue, valueProp, onChange),
|
175
|
-
|
176
|
-
|
177
|
-
|
178
|
-
|
179
|
-
|
180
|
-
|
133
|
+
value = _useCheck[0],
|
134
|
+
tryChangeValue = _useCheck[1],
|
135
|
+
onNodeCheck = _useCheck[2],
|
136
|
+
checkedNodes = _useCheck[3],
|
137
|
+
parsedCheckedIds = _useCheck[4];
|
181
138
|
var onCheck = React.useCallback(function (checkedIds, option) {
|
182
139
|
var targetNode = option.targetNode,
|
183
|
-
|
140
|
+
checked = option.checked;
|
184
141
|
onNodeCheck(targetNode, checked);
|
185
142
|
}, [onNodeCheck]);
|
186
143
|
var onValueChange = React.useCallback(function (values, targetItem, shouldChecked) {
|
@@ -191,16 +148,15 @@ var CheckTreeSelect = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
191
148
|
// 操作单个
|
192
149
|
onNodeCheck(targetItem[0], shouldChecked);
|
193
150
|
}
|
194
|
-
}, [tryChangeValue, onNodeCheck]);
|
151
|
+
}, [tryChangeValue, onNodeCheck]);
|
152
|
+
// ************************** 异步搜索 ************************* //
|
195
153
|
// const { loading, hasError, loadRemoteData } = useDataSource({ dataSource, validate: isArray })
|
196
|
-
|
197
154
|
var _b = useSearchMode.useAsyncSearch({
|
198
|
-
|
199
|
-
|
200
|
-
|
201
|
-
|
202
|
-
|
203
|
-
|
155
|
+
dataSource: dataSource
|
156
|
+
}),
|
157
|
+
loading = _b.loading,
|
158
|
+
hasError = _b.hasError,
|
159
|
+
dataSourceStrategy = tslib.__rest(_b, ["loading", "hasError"]);
|
204
160
|
var customSearchStrategy = useSearchMode.useTreeCustomSearch({
|
205
161
|
data: data,
|
206
162
|
filterOption: filterOption
|
@@ -216,29 +172,25 @@ var CheckTreeSelect = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
216
172
|
flattedData: flattedData,
|
217
173
|
searchMode: searchModeProp
|
218
174
|
});
|
219
|
-
|
220
175
|
var _useSearchMode = useSearchMode.useSearchMode({
|
221
|
-
|
222
|
-
|
223
|
-
|
224
|
-
|
225
|
-
|
226
|
-
|
227
|
-
|
228
|
-
|
229
|
-
|
230
|
-
|
231
|
-
|
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,自定义高亮展示
|
232
186
|
var proxyTitleRender = React.useCallback(function (node) {
|
233
187
|
if (titleRender) {
|
234
188
|
var _ret = titleRender(node);
|
235
|
-
|
236
189
|
if (_ret && _ret !== true) return _ret;
|
237
|
-
}
|
238
|
-
|
239
|
-
|
190
|
+
}
|
191
|
+
// 本地搜索执行默认高亮规则
|
240
192
|
var highlight = !!searchValue && (searchMode === 'highlight' || searchMode === 'filter');
|
241
|
-
var ret = highlight ? /*#__PURE__*/
|
193
|
+
var ret = highlight ? /*#__PURE__*/React.createElement(highlighter.Highlighter, {
|
242
194
|
keyword: searchValue
|
243
195
|
}, node.title) : true;
|
244
196
|
return ret;
|
@@ -255,19 +207,18 @@ var CheckTreeSelect = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
255
207
|
});
|
256
208
|
} : tryChangeExpandedIds,
|
257
209
|
render: proxyTitleRender
|
258
|
-
};
|
259
|
-
|
210
|
+
};
|
211
|
+
// 下拉菜单不能合并(因为树形数据,不知道是第几级)
|
260
212
|
var mergedData = React.useMemo(function () {
|
261
213
|
var nextData = checkedNodes.concat(flattedData);
|
262
214
|
return arrayUtils.uniqBy(nextData, 'id');
|
263
215
|
}, [checkedNodes, flattedData]);
|
264
216
|
var toggleCheckAll = React.useCallback(function () {
|
265
217
|
var _getAllCheckedStatus = index.getAllCheckedStatus(flattedData, parsedCheckedIds),
|
266
|
-
|
267
|
-
|
268
|
-
|
269
|
-
|
270
|
-
|
218
|
+
currentAllChecked = _getAllCheckedStatus[0],
|
219
|
+
hasCheckedAll = _getAllCheckedStatus[2];
|
220
|
+
var shouldChecked = !currentAllChecked;
|
221
|
+
// 全选操作
|
271
222
|
if (!currentAllChecked && !hasCheckedAll) {
|
272
223
|
tryChangeValue(flattedData.filter(function (item) {
|
273
224
|
if (!item.disabled) {
|
@@ -275,14 +226,11 @@ var CheckTreeSelect = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
275
226
|
if (checkedMode === 'CHILD') {
|
276
227
|
return !item.children;
|
277
228
|
}
|
278
|
-
|
279
229
|
if (checkedMode === 'PARENT') {
|
280
230
|
return item.depth === 0;
|
281
231
|
}
|
282
|
-
|
283
232
|
return true;
|
284
233
|
}
|
285
|
-
|
286
234
|
return false;
|
287
235
|
}).map(function (_ref) {
|
288
236
|
var id = _ref.id;
|
@@ -292,32 +240,29 @@ var CheckTreeSelect = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
292
240
|
tryChangeValue([], null, shouldChecked, []);
|
293
241
|
}
|
294
242
|
}, [checkedMode, flattedData, parsedCheckedIds, tryChangeValue]);
|
295
|
-
|
296
243
|
var _useMemo = React.useMemo(function () {
|
297
|
-
|
298
|
-
|
299
|
-
|
300
|
-
|
301
|
-
|
244
|
+
return index.getAllCheckedStatus(flattedData, parsedCheckedIds);
|
245
|
+
}, [flattedData, parsedCheckedIds]),
|
246
|
+
showAllChecked = _useMemo[0],
|
247
|
+
showIndeterminate = _useMemo[1];
|
302
248
|
var renderDefaultFooter = function renderDefaultFooter() {
|
303
249
|
if (showCheckAll) {
|
304
|
-
return /*#__PURE__*/
|
250
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Checkbox, {
|
305
251
|
indeterminate: showIndeterminate,
|
306
252
|
checked: showAllChecked,
|
307
253
|
onChange: toggleCheckAll
|
308
254
|
}, i18n.get('checkSelect.checkAll')));
|
309
255
|
}
|
310
256
|
};
|
311
|
-
|
312
|
-
|
257
|
+
var cls = classname.cx(prefixCls, className);
|
258
|
+
// 过滤掉未选中的数据
|
313
259
|
// const tagList = useMemo(() => {
|
314
260
|
// // @ts-ignore
|
315
261
|
// const [semiCheckedIds] = getSemiCheckedIdsWithSet(flattedData, (id) => value.includes(id))
|
316
262
|
// const ids = Array.from(new Set([...semiCheckedIds, ...value]))
|
317
263
|
// return flattedData.filter((item) => ids.includes(item.id))
|
318
264
|
// }, [value, flattedData])
|
319
|
-
|
320
|
-
return /*#__PURE__*/React__default["default"].createElement(picker.Picker, Object.assign({
|
265
|
+
return /*#__PURE__*/React.createElement(picker.Picker, Object.assign({
|
321
266
|
ref: ref,
|
322
267
|
className: cls
|
323
268
|
}, rest, {
|
@@ -335,7 +280,8 @@ var CheckTreeSelect = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
335
280
|
onSearch: funcUtils.callAllFuncs(onSearchProp, onSearch),
|
336
281
|
footer: renderDefaultFooter(),
|
337
282
|
loading: rest.loading !== undefined ? rest.loading : loading,
|
338
|
-
trigger: /*#__PURE__*/
|
283
|
+
trigger: /*#__PURE__*/React.createElement(tagInput.TagInputMock, Object.assign({}, tagInputProps, {
|
284
|
+
size: size,
|
339
285
|
// ref={targetElementRef}
|
340
286
|
// onClick={openMenu}
|
341
287
|
// disabled={disabled}
|
@@ -343,7 +289,7 @@ var CheckTreeSelect = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
343
289
|
placeholder: placeholder,
|
344
290
|
// @ts-ignore
|
345
291
|
displayRender: displayRender,
|
346
|
-
suffix: menuVisible ? /*#__PURE__*/
|
292
|
+
suffix: menuVisible ? /*#__PURE__*/React.createElement(icons.UpOutlined, null) : /*#__PURE__*/React.createElement(icons.DownOutlined, null),
|
347
293
|
focused: menuVisible,
|
348
294
|
appearance: appearance,
|
349
295
|
value: value,
|
@@ -352,10 +298,10 @@ var CheckTreeSelect = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
352
298
|
// @ts-ignore
|
353
299
|
invalid: invalid
|
354
300
|
}))
|
355
|
-
}), typeAssertion.isArrayNonEmpty(treeProps.data) ?
|
356
|
-
/*#__PURE__*/
|
301
|
+
}), typeAssertion.isArrayNonEmpty(treeProps.data) ? /*#__PURE__*/
|
357
302
|
// 只做渲染,不做逻辑处理(比如搜索过滤后,check操作的是对过滤后的data操作,这是不符合预期的)
|
358
|
-
|
303
|
+
React.createElement(tree.Tree, Object.assign({
|
304
|
+
size: 'md',
|
359
305
|
className: prefixCls + "__tree",
|
360
306
|
selectable: false,
|
361
307
|
checkable: true,
|
@@ -371,11 +317,9 @@ var CheckTreeSelect = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
371
317
|
height: height
|
372
318
|
}, treeProps)) : null);
|
373
319
|
});
|
374
|
-
|
375
320
|
if (env.__DEV__) {
|
376
321
|
CheckTreeSelect.displayName = 'CheckTreeSelect';
|
377
322
|
}
|
378
|
-
|
379
323
|
var ALWAYS_ALLOW = function ALWAYS_ALLOW() {
|
380
324
|
return true;
|
381
325
|
};
|
@@ -386,39 +330,34 @@ var ALWAYS_ALLOW = function ALWAYS_ALLOW() {
|
|
386
330
|
* @param flattedData
|
387
331
|
* @returns
|
388
332
|
*/
|
389
|
-
|
390
|
-
|
391
333
|
var getSemiCheckedIdsWithSet = function getSemiCheckedIdsWithSet(flattedData, isChecked, allowCheck) {
|
392
334
|
if (allowCheck === void 0) {
|
393
335
|
allowCheck = ALWAYS_ALLOW;
|
394
336
|
}
|
395
|
-
|
396
337
|
var semiCheckedNodes = [];
|
397
338
|
var semiCheckedIdsSet = new Set();
|
398
339
|
var parentId;
|
399
340
|
var parent;
|
400
341
|
flattedData.forEach(function (node) {
|
401
342
|
parent = node.parent;
|
402
|
-
|
403
343
|
if (parent && parent.id !== undefined) {
|
404
344
|
if (!allowCheck(parent)) return;
|
405
345
|
parentId = parent.id;
|
406
|
-
if (semiCheckedIdsSet.has(parentId)) return;
|
407
|
-
|
346
|
+
if (semiCheckedIdsSet.has(parentId)) return;
|
347
|
+
// 父节点没选中,但是当前节点被选中,则视为半选
|
408
348
|
if (!isChecked(parentId) && isChecked(node.id)) {
|
409
349
|
semiCheckedIdsSet.add(parentId);
|
410
350
|
semiCheckedNodes.push(parent);
|
411
351
|
}
|
412
352
|
}
|
413
|
-
});
|
414
|
-
|
353
|
+
});
|
354
|
+
// 自下而上设置半选态
|
415
355
|
semiCheckedNodes.forEach(function (node) {
|
416
356
|
parent = node.parent;
|
417
|
-
|
418
357
|
while (parent && parent.id !== undefined) {
|
419
358
|
if (!allowCheck(parent)) return;
|
420
|
-
parentId = parent.id;
|
421
|
-
|
359
|
+
parentId = parent.id;
|
360
|
+
// 可能存在兄弟节点,共同祖先需要去重,避免重复计算
|
422
361
|
if (semiCheckedIdsSet.has(parentId)) return;
|
423
362
|
semiCheckedIdsSet.add(parentId);
|
424
363
|
parent = parent.parent;
|
@@ -427,6 +366,5 @@ var getSemiCheckedIdsWithSet = function getSemiCheckedIdsWithSet(flattedData, is
|
|
427
366
|
var semiCheckedIds = Array.from(semiCheckedIdsSet);
|
428
367
|
return [semiCheckedIds, semiCheckedIdsSet];
|
429
368
|
};
|
430
|
-
|
431
369
|
exports.CheckTreeSelect = CheckTreeSelect;
|
432
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;
|