@hi-ui/check-select 4.0.0-beta.29 → 4.0.0-beta.31

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 (10) hide show
  1. package/README.md +25 -25
  2. package/lib/cjs/CheckSelect.js +13 -26
  3. package/lib/cjs/use-check-select.js +17 -15
  4. package/lib/esm/CheckSelect.js +15 -28
  5. package/lib/esm/use-check-select.js +18 -16
  6. package/lib/types/CheckSelect.d.ts +5 -5
  7. package/lib/types/context.d.ts +4 -2
  8. package/lib/types/types.d.ts +9 -7
  9. package/lib/types/use-check-select.d.ts +6 -6
  10. package/package.json +8 -8
package/README.md CHANGED
@@ -16,30 +16,30 @@
16
16
 
17
17
  ## Props
18
18
 
19
- | 参数 | 说明 | 类型 | 可选值 | 默认值 |
20
- | ----------------- | -------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------- | -------------------------------------------- | --------------------------------------------------------------------- |
21
- | data | 下拉框选项数据源 | DataItem[] \| groupDataItem[] | - | - |
22
- | fieldNames | 设置 data 中 id, title, disabled, children 对应的 key | object | - | { title: 'title', id: 'id',disabled:'disabled', children: 'children'} |
23
- | dataSource | 关键词搜索时，触发异步下拉框选项数据源 | DataSource (keyword: string) => (DataSource \| DataItem \| Promise) | - | - |
24
- | value | 被选中项的值 | ReactText[] | - | - |
25
- | defaultValue | 默认被选中项的值 | ReactText[] | - | - |
26
- | showCheckAll | 是否显示**全选**，只对多选生效 | boolean | true \| false | false |
27
- | showJustSelected | 是否显示**仅看已选**，只对多选生效 (3.0 新增) | boolean | true \| false | false |
28
- | searchable | 是否可以筛选 | boolean | true \| false | false |
29
- | filterOption | 第一个参数为输入的关键字，第二个为数据项，返回值为 true 时将出现在结果项。仅在 searchable 为 true 时有效 | (keyword: string, item: DataItem) => boolean | (keyword: string, item: DataItem) => boolean | - |
30
- | clearable | 是否可以清空 | boolean | true \| false | true |
31
- | disabled | 是否禁用 | boolean | true \| false | false |
32
- | placeholder | 输入框占位 | string | - | '请选择' |
33
- | searchPlaceholder | 搜索输入框占位 | string | - | '搜索' |
34
- | emptyContent | 设置选项为空时展示的内容 | ReactNode | - | '无匹配数据' |
35
- | loadingContent | 设置加载中时展示的内容 | ReactNode | - | '数据加载中...' |
36
- | optionWidth | 自定义下拉选项宽度 | number | - | |
37
- | renderExtraFooter | 自定义下拉菜单底部渲染 | () => ReactNode | - | 无内容 |
38
- | overlayClassName | 下拉根元素的类名称 | string | - | - |
39
- | onOverlayScroll | 下拉列表滚动时的回调 | function | - | - |
40
- | overlay | 自定义控制弹出层 popper 行为 | PopperOverlayProps | - | - |
41
- | render | 自定义渲染节点的 title 内容径 | (item: CheckSelectEventData, keyword: string) => React.ReactNode | - |
42
- | displayRender | 自定义选择后展示的内容 | (selectedItems: DataItem[]) => string | - | - |
19
+ | 参数 | 说明 | 类型 | 可选值 | 默认值 |
20
+ | ----------------- | -------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------- | -------------------------------------------- | --------------------------------------------------------------------- |
21
+ | data | 下拉框选项数据源 | DataItem[] \| groupDataItem[] | - | - |
22
+ | fieldNames | 设置 data 中 id, title, disabled, children 对应的 key | object | - | { title: 'title', id: 'id',disabled:'disabled', children: 'children'} |
23
+ | dataSource | 关键词搜索时，触发异步下拉框选项数据源 | DataSource (keyword: string) => (DataSource \| DataItem \| Promise) | - | - |
24
+ | value | 被选中项的值 | ReactText[] | - | - |
25
+ | defaultValue | 默认被选中项的值 | ReactText[] | - | - |
26
+ | showCheckAll | 是否显示**全选**，只对多选生效 | boolean | true \| false | false |
27
+ | showJustSelected | 是否显示**仅看已选**，只对多选生效 (3.0 新增) | boolean | true \| false | false |
28
+ | searchable | 是否可以筛选 | boolean | true \| false | false |
29
+ | filterOption | 第一个参数为输入的关键字，第二个为数据项，返回值为 true 时将出现在结果项。仅在 searchable 为 true 时有效 | (keyword: string, item: DataItem) => boolean | (keyword: string, item: DataItem) => boolean | - |
30
+ | clearable | 是否可以清空 | boolean | true \| false | true |
31
+ | disabled | 是否禁用 | boolean | true \| false | false |
32
+ | placeholder | 输入框占位 | string | - | '请选择' |
33
+ | searchPlaceholder | 搜索输入框占位 | string | - | '搜索' |
34
+ | emptyContent | 设置选项为空时展示的内容 | ReactNode | - | '无匹配数据' |
35
+ | loadingContent | 设置加载中时展示的内容 | ReactNode | - | '数据加载中...' |
36
+ | optionWidth | 自定义下拉选项宽度 | number | - | |
37
+ | renderExtraFooter | 自定义下拉菜单底部渲染 | () => ReactNode | - | 无内容 |
38
+ | overlayClassName | 下拉根元素的类名称 | string | - | - |
39
+ | onOverlayScroll | 下拉列表滚动时的回调 | function | - | - |
40
+ | overlay | 自定义控制弹出层 popper 行为 | PopperOverlayProps | - | - |
41
+ | render | 自定义渲染节点的 title 内容径 | (item: CheckSelectItemEventData, keyword: string) => React.ReactNode | - |
42
+ | displayRender | 自定义选择后展示的内容 | (selectedItems: DataItem[]) => string | - | - |
43
43
 
44
44
  > 注意，如果发现下拉菜单跟随页面滚动，或者需要在其他弹层中触发 CheckSelect，请尝试使用 `overlay={ container: triggerNode.parentElement }` 将下拉弹层渲染节点固定在触发器的父元素中。
45
45
 
@@ -67,7 +67,7 @@
67
67
  | title | 下拉选择项标题 | string | - | - |
68
68
  | disabled | 是否禁用 | boolean | true \| false | false |
69
69
 
70
- ### CheckSelectEventData
70
+ ### CheckSelectItemEventData
71
71
 
72
72
  | 参数 | 说明 | 类型 | 可选值 | 默认值 |
73
73
  | -------- | -------------------------------- | ------- | ------------- | ------ |
package/lib/cjs/CheckSelect.js CHANGED
@@ -133,34 +133,20 @@ var CheckSelect = /*#__PURE__*/React.forwardRef(function (_a, ref) {
133
133
  }
134
134
 
135
135
  return item.title;
136
- }, [displayRenderProp]); // 搜索时临时选中缓存数据
137
-
138
- var _useState = React.useState([]),
139
- selectedItems = _useState[0],
140
- setSelectedItems = _useState[1];
141
-
142
- var onSelect = useLatest.useLatestCallback(function (value, item, shouldChecked) {
143
- onSelectProp === null || onSelectProp === void 0 ? void 0 : onSelectProp(value, item, shouldChecked);
144
-
145
- if (shouldChecked) {
146
- // TODO：as useCheckList
147
- setSelectedItems(function (prev) {
148
- return [].concat(prev, [item]);
149
- });
150
- }
151
- });
136
+ }, [displayRenderProp]);
152
137
 
153
138
  var _b = useCheckSelect.useCheckSelect(Object.assign(Object.assign({}, rest), {
154
139
  children: children,
155
140
  fieldNames: fieldNames,
156
- onSelect: onSelect
141
+ onSelect: onSelectProp
157
142
  })),
158
143
  rootProps = _b.rootProps,
159
144
  context$1 = tslib.__rest(_b, ["rootProps"]);
160
145
 
161
146
  var value = context$1.value,
162
147
  tryChangeValue = context$1.tryChangeValue,
163
- flattedData = context$1.flattedData; // ************************** 搜索 ************************* //
148
+ flattedData = context$1.flattedData,
149
+ checkedItems = context$1.checkedItems; // ************************** 搜索 ************************* //
164
150
 
165
151
  var _c = useSearchMode.useAsyncSearch({
166
152
  dataSource: dataSource,
@@ -216,16 +202,16 @@ var CheckSelect = /*#__PURE__*/React.forwardRef(function (_a, ref) {
216
202
  var shouldUseSearch = !!searchValue && !hasError;
217
203
  var showData = React.useMemo(function () {
218
204
  return shouldUseSearch ? stateInSearch.data : flattedData;
219
- }, [shouldUseSearch, flattedData, stateInSearch.data]); // 下拉菜单不能合并（因为树形数据，不知道是第几级）
205
+ }, [shouldUseSearch, flattedData, stateInSearch.data]); // 根据 id 进行合并，注意必须是扁平数据
220
206
 
221
207
  var mergedData = React.useMemo(function () {
222
- var nextData = selectedItems.concat(flattedData);
208
+ var nextData = checkedItems.concat(flattedData);
223
209
  return arrayUtils.uniqBy(nextData, 'id');
224
- }, [selectedItems, flattedData]);
210
+ }, [checkedItems, flattedData]);
225
211
 
226
- var _useState2 = React.useState(null),
227
- filterItems = _useState2[0],
228
- setFilterItems = _useState2[1];
212
+ var _useState = React.useState(null),
213
+ filterItems = _useState[0],
214
+ setFilterItems = _useState[1];
229
215
 
230
216
  var dropdownItems = filterItems || showData;
231
217
  var activeExpandable = showOnlyShowChecked && !!filterItems && menuVisible;
@@ -261,13 +247,14 @@ var CheckSelect = /*#__PURE__*/React.forwardRef(function (_a, ref) {
261
247
  var id = _ref2.id;
262
248
  return id;
263
249
  });
250
+ var allData = arrayUtils.uniqBy(items.concat(mergedData), 'id');
264
251
 
265
252
  if (showChecked) {
266
253
  var nextCheckedIds = Array.from(new Set(value.concat(targetIds)));
267
254
  var changedIds = nextCheckedIds.filter(function (id) {
268
255
  return !value.includes(id);
269
256
  });
270
- var changedItems = mergedData.filter(function (_ref3) {
257
+ var changedItems = allData.filter(function (_ref3) {
271
258
  var id = _ref3.id;
272
259
  return changedIds.includes(id);
273
260
  });
@@ -281,7 +268,7 @@ var CheckSelect = /*#__PURE__*/React.forwardRef(function (_a, ref) {
281
268
  return !_nextCheckedIds.includes(id);
282
269
  });
283
270
 
284
- var _changedItems = mergedData.filter(function (_ref4) {
271
+ var _changedItems = allData.filter(function (_ref4) {
285
272
  var id = _ref4.id;
286
273
  return _changedIds.includes(id);
287
274
  }); // items
package/lib/cjs/use-check-select.js CHANGED
@@ -65,33 +65,34 @@ var useCheckSelect = function useCheckSelect(_a) {
65
65
  tryChangeValue = _useUncontrolledState[1];
66
66
 
67
67
  var onSelectLatest = useLatest.useLatestCallback(onSelect);
68
- var selectedItemsRef = React.useRef([]);
68
+ var usedItemsRef = React.useRef([]); // 扁平化的选中数据，可能包括异步临时选中缓存数据
69
+
70
+ var _useState = React.useState([]),
71
+ checkedItems = _useState[0],
72
+ setCheckedItems = _useState[1];
73
+
69
74
  var proxyTryChangeValue = React.useCallback(function (value, item, shouldChecked) {
70
75
  var changedItems = item;
71
76
 
72
77
  if (!Array.isArray(item)) {
73
78
  changedItems = [item];
74
-
75
- if (shouldChecked) {
76
- selectedItemsRef.current.push(item);
77
- }
78
-
79
79
  onSelectLatest(value, item, shouldChecked);
80
80
  }
81
81
 
82
- var selectedItems = arrayUtils.uniqBy([].concat(changedItems, selectedItemsRef.current, flattedDataRef.current), 'id'); // 调用用户的select
82
+ var usedItems = arrayUtils.uniqBy([].concat(changedItems, usedItemsRef.current, flattedDataRef.current), 'id');
83
+ usedItemsRef.current = usedItems; // 使用最新的value
83
84
 
84
- var checkedItems = selectedItems // 使用最新的value
85
- .filter(function (item) {
85
+ var nextCheckedItems = usedItems.filter(function (item) {
86
86
  return value.includes(item.id);
87
- }).map(function (item) {
88
- return 'raw' in item ? item.raw : item;
89
87
  });
90
- tryChangeValue(value, // TODO: 处理脏数据
88
+ setCheckedItems(nextCheckedItems);
89
+ tryChangeValue(value, // 处理脏数据
91
90
  changedItems.map(function (item) {
92
91
  return 'raw' in item ? item.raw : item;
93
- }), checkedItems);
94
- }, [tryChangeValue, onSelectLatest, flattedDataRef, selectedItemsRef]);
92
+ }), nextCheckedItems.map(function (item) {
93
+ return 'raw' in item ? item.raw : item;
94
+ }));
95
+ }, [tryChangeValue, onSelectLatest, flattedDataRef, usedItemsRef]);
95
96
 
96
97
  var _useCheckDefault = useCheck.useCheck({
97
98
  disabled: disabled,
@@ -109,7 +110,8 @@ var useCheckSelect = function useCheckSelect(_a) {
109
110
  value: value,
110
111
  tryChangeValue: proxyTryChangeValue,
111
112
  onSelect: onOptionCheck,
112
- isCheckedId: isCheckedId
113
+ isCheckedId: isCheckedId,
114
+ checkedItems: checkedItems
113
115
  };
114
116
  };
115
117
 
package/lib/esm/CheckSelect.js CHANGED
@@ -8,13 +8,13 @@
8
8
  * LICENSE file in the root directory of this source tree.
9
9
  */
10
10
  import { __rest } from 'tslib';
11
- import React, { forwardRef, useCallback, useState, useMemo, useRef } from 'react';
11
+ import React, { forwardRef, useCallback, useMemo, useState, useRef } from 'react';
12
12
  import { getPrefixCls, cx } from '@hi-ui/classname';
13
13
  import { __DEV__ } from '@hi-ui/env';
14
14
  import { useCheckSelect } from './use-check-select.js';
15
15
  import { UpOutlined, DownOutlined } from '@hi-ui/icons';
16
16
  import { CheckSelectProvider, useCheckSelectContext } from './context.js';
17
- import { useLatestCallback, useLatestRef } from '@hi-ui/use-latest';
17
+ import { useLatestRef } from '@hi-ui/use-latest';
18
18
  import Checkbox from '@hi-ui/checkbox';
19
19
  import { TagInputMock } from '@hi-ui/tag-input';
20
20
  import { isUndef, isFunction, isArrayNonEmpty } from '@hi-ui/type-assertion';
@@ -91,34 +91,20 @@ var CheckSelect = /*#__PURE__*/forwardRef(function (_a, ref) {
91
91
  }
92
92
 
93
93
  return item.title;
94
- }, [displayRenderProp]); // 搜索时临时选中缓存数据
95
-
96
- var _useState = useState([]),
97
- selectedItems = _useState[0],
98
- setSelectedItems = _useState[1];
99
-
100
- var onSelect = useLatestCallback(function (value, item, shouldChecked) {
101
- onSelectProp === null || onSelectProp === void 0 ? void 0 : onSelectProp(value, item, shouldChecked);
102
-
103
- if (shouldChecked) {
104
- // TODO：as useCheckList
105
- setSelectedItems(function (prev) {
106
- return [].concat(prev, [item]);
107
- });
108
- }
109
- });
94
+ }, [displayRenderProp]);
110
95
 
111
96
  var _b = useCheckSelect(Object.assign(Object.assign({}, rest), {
112
97
  children: children,
113
98
  fieldNames: fieldNames,
114
- onSelect: onSelect
99
+ onSelect: onSelectProp
115
100
  })),
116
101
  rootProps = _b.rootProps,
117
102
  context = __rest(_b, ["rootProps"]);
118
103
 
119
104
  var value = context.value,
120
105
  tryChangeValue = context.tryChangeValue,
121
- flattedData = context.flattedData; // ************************** 搜索 ************************* //
106
+ flattedData = context.flattedData,
107
+ checkedItems = context.checkedItems; // ************************** 搜索 ************************* //
122
108
 
123
109
  var _c = useAsyncSearch({
124
110
  dataSource: dataSource,
@@ -174,16 +160,16 @@ var CheckSelect = /*#__PURE__*/forwardRef(function (_a, ref) {
174
160
  var shouldUseSearch = !!searchValue && !hasError;
175
161
  var showData = useMemo(function () {
176
162
  return shouldUseSearch ? stateInSearch.data : flattedData;
177
- }, [shouldUseSearch, flattedData, stateInSearch.data]); // 下拉菜单不能合并（因为树形数据，不知道是第几级）
163
+ }, [shouldUseSearch, flattedData, stateInSearch.data]); // 根据 id 进行合并，注意必须是扁平数据
178
164
 
179
165
  var mergedData = useMemo(function () {
180
- var nextData = selectedItems.concat(flattedData);
166
+ var nextData = checkedItems.concat(flattedData);
181
167
  return uniqBy(nextData, 'id');
182
- }, [selectedItems, flattedData]);
168
+ }, [checkedItems, flattedData]);
183
169
 
184
- var _useState2 = useState(null),
185
- filterItems = _useState2[0],
186
- setFilterItems = _useState2[1];
170
+ var _useState = useState(null),
171
+ filterItems = _useState[0],
172
+ setFilterItems = _useState[1];
187
173
 
188
174
  var dropdownItems = filterItems || showData;
189
175
  var activeExpandable = showOnlyShowChecked && !!filterItems && menuVisible;
@@ -219,13 +205,14 @@ var CheckSelect = /*#__PURE__*/forwardRef(function (_a, ref) {
219
205
  var id = _ref2.id;
220
206
  return id;
221
207
  });
208
+ var allData = uniqBy(items.concat(mergedData), 'id');
222
209
 
223
210
  if (showChecked) {
224
211
  var nextCheckedIds = Array.from(new Set(value.concat(targetIds)));
225
212
  var changedIds = nextCheckedIds.filter(function (id) {
226
213
  return !value.includes(id);
227
214
  });
228
- var changedItems = mergedData.filter(function (_ref3) {
215
+ var changedItems = allData.filter(function (_ref3) {
229
216
  var id = _ref3.id;
230
217
  return changedIds.includes(id);
231
218
  });
@@ -239,7 +226,7 @@ var CheckSelect = /*#__PURE__*/forwardRef(function (_a, ref) {
239
226
  return !_nextCheckedIds.includes(id);
240
227
  });
241
228
 
242
- var _changedItems = mergedData.filter(function (_ref4) {
229
+ var _changedItems = allData.filter(function (_ref4) {
243
230
  var id = _ref4.id;
244
231
  return _changedIds.includes(id);
245
232
  }); // items
package/lib/esm/use-check-select.js CHANGED
@@ -8,7 +8,7 @@
8
8
  * LICENSE file in the root directory of this source tree.
9
9
  */
10
10
  import { __rest } from 'tslib';
11
- import { useRef, useCallback } from 'react';
11
+ import { useRef, useState, useCallback } from 'react';
12
12
  import { useUncontrolledState } from '@hi-ui/use-uncontrolled-state';
13
13
  import { uniqBy } from '@hi-ui/array-utils';
14
14
  import { useCheck } from '@hi-ui/use-check';
@@ -49,33 +49,34 @@ var useCheckSelect = function useCheckSelect(_a) {
49
49
  tryChangeValue = _useUncontrolledState[1];
50
50
 
51
51
  var onSelectLatest = useLatestCallback(onSelect);
52
- var selectedItemsRef = useRef([]);
52
+ var usedItemsRef = useRef([]); // 扁平化的选中数据，可能包括异步临时选中缓存数据
53
+
54
+ var _useState = useState([]),
55
+ checkedItems = _useState[0],
56
+ setCheckedItems = _useState[1];
57
+
53
58
  var proxyTryChangeValue = useCallback(function (value, item, shouldChecked) {
54
59
  var changedItems = item;
55
60
 
56
61
  if (!Array.isArray(item)) {
57
62
  changedItems = [item];
58
-
59
- if (shouldChecked) {
60
- selectedItemsRef.current.push(item);
61
- }
62
-
63
63
  onSelectLatest(value, item, shouldChecked);
64
64
  }
65
65
 
66
- var selectedItems = uniqBy([].concat(changedItems, selectedItemsRef.current, flattedDataRef.current), 'id'); // 调用用户的select
66
+ var usedItems = uniqBy([].concat(changedItems, usedItemsRef.current, flattedDataRef.current), 'id');
67
+ usedItemsRef.current = usedItems; // 使用最新的value
67
68
 
68
- var checkedItems = selectedItems // 使用最新的value
69
- .filter(function (item) {
69
+ var nextCheckedItems = usedItems.filter(function (item) {
70
70
  return value.includes(item.id);
71
- }).map(function (item) {
72
- return 'raw' in item ? item.raw : item;
73
71
  });
74
- tryChangeValue(value, // TODO: 处理脏数据
72
+ setCheckedItems(nextCheckedItems);
73
+ tryChangeValue(value, // 处理脏数据
75
74
  changedItems.map(function (item) {
76
75
  return 'raw' in item ? item.raw : item;
77
- }), checkedItems);
78
- }, [tryChangeValue, onSelectLatest, flattedDataRef, selectedItemsRef]);
76
+ }), nextCheckedItems.map(function (item) {
77
+ return 'raw' in item ? item.raw : item;
78
+ }));
79
+ }, [tryChangeValue, onSelectLatest, flattedDataRef, usedItemsRef]);
79
80
 
80
81
  var _useCheckDefault = useCheck({
81
82
  disabled: disabled,
@@ -93,7 +94,8 @@ var useCheckSelect = function useCheckSelect(_a) {
93
94
  value: value,
94
95
  tryChangeValue: proxyTryChangeValue,
95
96
  onSelect: onOptionCheck,
96
- isCheckedId: isCheckedId
97
+ isCheckedId: isCheckedId,
98
+ checkedItems: checkedItems
97
99
  };
98
100
  };
99
101
 
package/lib/types/CheckSelect.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import React from 'react';
2
2
  import { UseCheckSelectProps } from './use-check-select';
3
- import type { HiBaseAppearanceEnum, HiBaseHTMLProps } from '@hi-ui/core';
4
- import { CheckSelectDataItem, CheckSelectEventData, CheckSelectMergedItem } from './types';
3
+ import type { HiBaseHTMLProps } from '@hi-ui/core';
4
+ import { CheckSelectAppearanceEnum, CheckSelectDataItem, CheckSelectItemEventData, CheckSelectMergedItem } from './types';
5
5
  import { PickerProps } from '@hi-ui/picker';
6
6
  import { UseDataSource } from '@hi-ui/use-data-source';
7
7
  /**
@@ -42,11 +42,11 @@ export interface CheckSelectProps extends Omit<PickerProps, 'trigger'>, UseCheck
42
42
  /**
43
43
  * 自定义渲染节点的 title 内容
44
44
  */
45
- render?: (item: CheckSelectEventData) => React.ReactNode;
45
+ render?: (item: CheckSelectItemEventData) => React.ReactNode;
46
46
  /**
47
47
  * 自定义选择后触发器所展示的内容，只在 title 为字符串时有效
48
48
  */
49
- displayRender?: (option: CheckSelectEventData) => React.ReactNode;
49
+ displayRender?: (option: CheckSelectItemEventData) => React.ReactNode;
50
50
  /**
51
51
  * 触发器输入框占位符
52
52
  */
@@ -54,7 +54,7 @@ export interface CheckSelectProps extends Omit<PickerProps, 'trigger'>, UseCheck
54
54
  /**
55
55
  * 设置展现形式
56
56
  */
57
- appearance?: HiBaseAppearanceEnum;
57
+ appearance?: CheckSelectAppearanceEnum;
58
58
  /**
59
59
  * 节点搜索模式，仅在mode=normal模式下生效
60
60
  */
package/lib/types/context.d.ts CHANGED
@@ -4,16 +4,18 @@ export declare const CheckSelectProvider: import("react").Provider<Omit<{
4
4
  data: any[];
5
5
  flattedData: import("packages/utils/tree-utils/lib/types/types").BaseFlattedTreeNodeData<any, any>[];
6
6
  value: import("react").ReactText[];
7
- tryChangeValue: (value: import("react").ReactText[], item: import("./types").CheckSelectEventData | import("./types").CheckSelectEventData[], shouldChecked: boolean) => void;
7
+ tryChangeValue: (value: import("react").ReactText[], item: import("./types").CheckSelectItemEventData | import("./types").CheckSelectItemEventData[], shouldChecked: boolean) => void;
8
8
  onSelect: (targetItem: import("packages/hooks/use-check/lib/types").UseCheckItem, shouldChecked: boolean) => void;
9
9
  isCheckedId: (id: import("react").ReactText) => boolean;
10
+ checkedItems: import("./types").CheckSelectItemEventData[];
10
11
  }, "rootProps"> | null>;
11
12
  export declare const useCheckSelectContext: () => Omit<{
12
13
  rootProps: {};
13
14
  data: any[];
14
15
  flattedData: import("packages/utils/tree-utils/lib/types/types").BaseFlattedTreeNodeData<any, any>[];
15
16
  value: import("react").ReactText[];
16
- tryChangeValue: (value: import("react").ReactText[], item: import("./types").CheckSelectEventData | import("./types").CheckSelectEventData[], shouldChecked: boolean) => void;
17
+ tryChangeValue: (value: import("react").ReactText[], item: import("./types").CheckSelectItemEventData | import("./types").CheckSelectItemEventData[], shouldChecked: boolean) => void;
17
18
  onSelect: (targetItem: import("packages/hooks/use-check/lib/types").UseCheckItem, shouldChecked: boolean) => void;
18
19
  isCheckedId: (id: import("react").ReactText) => boolean;
20
+ checkedItems: import("./types").CheckSelectItemEventData[];
19
21
  }, "rootProps">;
package/lib/types/types.d.ts CHANGED
@@ -1,29 +1,30 @@
1
1
  import React from 'react';
2
+ import type { HiBaseAppearanceEnum } from '@hi-ui/core';
2
3
  export interface CheckSelectDataItem {
3
4
  /**
4
- * 节点唯一 id
5
+ * 选择项值，唯一 id
5
6
  */
6
7
  id?: React.ReactText;
7
8
  /**
8
- * 节点标题
9
+ * 选项标题
9
10
  */
10
11
  title?: React.ReactNode;
11
12
  /**
12
- * 是否禁用该节点
13
+ * 是否禁用该选项
13
14
  */
14
15
  disabled?: boolean;
15
16
  }
16
17
  export interface CheckSelectGroupDataItem {
17
18
  /**
18
- * 节点组标题
19
+ * 选项组标题
19
20
  */
20
21
  groupTitle?: React.ReactNode;
21
22
  /**
22
- * 是否禁用该节点
23
+ * 组选项列表
23
24
  */
24
25
  children?: CheckSelectDataItem[];
25
26
  }
26
- export declare type CheckSelectMergedItem = CheckSelectDataItem & CheckSelectGroupDataItem;
27
+ export declare type CheckSelectMergedItem = CheckSelectDataItem | CheckSelectGroupDataItem;
27
28
  export interface CheckSelectRequiredProps {
28
29
  checked: boolean;
29
30
  focused: boolean;
@@ -46,5 +47,6 @@ export interface FlattedCheckSelectDataItem extends CheckSelectDataItem {
46
47
  */
47
48
  parent?: FlattedCheckSelectDataItem;
48
49
  }
49
- export interface CheckSelectEventData extends FlattedCheckSelectDataItem, CheckSelectRequiredProps {
50
+ export interface CheckSelectItemEventData extends FlattedCheckSelectDataItem, CheckSelectRequiredProps {
50
51
  }
52
+ export declare type CheckSelectAppearanceEnum = HiBaseAppearanceEnum | undefined;
package/lib/types/use-check-select.d.ts CHANGED
@@ -1,14 +1,14 @@
1
1
  import React from 'react';
2
- import { CheckSelectDataItem, CheckSelectEventData, CheckSelectMergedItem } from './types';
3
- import { HiBaseFieldNames } from '@hi-ui/core';
2
+ import { CheckSelectDataItem, CheckSelectItemEventData, CheckSelectMergedItem } from './types';
4
3
  export declare const useCheckSelect: ({ data: dataProp, children, disabled, value: valueProp, defaultValue, onChange: onChangeProp, onSelect, fieldNames, ...rest }: UseCheckSelectProps) => {
5
4
  rootProps: {};
6
5
  data: any[];
7
6
  flattedData: import("packages/utils/tree-utils/lib/types/types").BaseFlattedTreeNodeData<any, any>[];
8
7
  value: React.ReactText[];
9
- tryChangeValue: (value: React.ReactText[], item: CheckSelectEventData | CheckSelectEventData[], shouldChecked: boolean) => void;
8
+ tryChangeValue: (value: React.ReactText[], item: CheckSelectItemEventData | CheckSelectItemEventData[], shouldChecked: boolean) => void;
10
9
  onSelect: (targetItem: import("@hi-ui/use-check").UseCheckItem, shouldChecked: boolean) => void;
11
10
  isCheckedId: (id: React.ReactText) => boolean;
11
+ checkedItems: CheckSelectItemEventData[];
12
12
  };
13
13
  export interface UseCheckSelectProps {
14
14
  /**
@@ -25,12 +25,12 @@ export interface UseCheckSelectProps {
25
25
  * changedItems: 变更的选项集合
26
26
  * checkedItems：所有选中项的选项集合
27
27
  */
28
- onChange?: (value: React.ReactText[], changedItems?: CheckSelectDataItem[], checkedItems?: CheckSelectDataItem[]) => void;
28
+ onChange?: (value: React.ReactText[], changedItems: CheckSelectDataItem[], checkedItems: CheckSelectDataItem[]) => void;
29
29
  /**
30
30
  * 选中值时回调。暂不对外暴露
31
31
  * @private
32
32
  */
33
- onSelect?: (value: React.ReactText[], targetOption: CheckSelectEventData, shouldChecked: boolean) => void;
33
+ onSelect?: (value: React.ReactText[], targetOption: CheckSelectItemEventData, shouldChecked: boolean) => void;
34
34
  /**
35
35
  * 是否禁止使用
36
36
  */
@@ -46,6 +46,6 @@ export interface UseCheckSelectProps {
46
46
  /**
47
47
  * 设置 data 中 id, title, disabled, children 对应的 key
48
48
  */
49
- fieldNames?: HiBaseFieldNames;
49
+ fieldNames?: Record<string, string>;
50
50
  }
51
51
  export declare type UseSelectReturn = ReturnType<typeof useCheckSelect>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hi-ui/check-select",
3
- "version": "4.0.0-beta.29",
3
+ "version": "4.0.0-beta.31",
4
4
  "description": "A sub-package for @hi-ui/hiui.",
5
5
  "keywords": [],
6
6
  "author": "HIUI <mi-hiui@xiaomi.com>",
@@ -44,7 +44,7 @@
44
44
  },
45
45
  "dependencies": {
46
46
  "@hi-ui/array-utils": "^4.0.0-beta.7",
47
- "@hi-ui/checkbox": "^4.0.0-beta.11",
47
+ "@hi-ui/checkbox": "^4.0.0-beta.12",
48
48
  "@hi-ui/classname": "^4.0.0-beta.0",
49
49
  "@hi-ui/core": "^4.0.0-beta.8",
50
50
  "@hi-ui/core-css": "^4.0.0-beta.5",
@@ -52,10 +52,10 @@
52
52
  "@hi-ui/func-utils": "^4.0.0-beta.12",
53
53
  "@hi-ui/highlighter": "^4.0.0-beta.9",
54
54
  "@hi-ui/icons": "^4.0.0-beta.10",
55
- "@hi-ui/input": "^4.0.0-beta.14",
55
+ "@hi-ui/input": "^4.0.0-beta.15",
56
56
  "@hi-ui/locale-context": "^4.0.0-beta.18",
57
- "@hi-ui/picker": "^4.0.0-beta.23",
58
- "@hi-ui/popper": "^4.0.0-beta.13",
57
+ "@hi-ui/picker": "^4.0.0-beta.24",
58
+ "@hi-ui/popper": "^4.0.0-beta.14",
59
59
  "@hi-ui/tag-input": "^4.0.0-beta.18",
60
60
  "@hi-ui/times": "^4.0.0-beta.5",
61
61
  "@hi-ui/tree-utils": "^4.0.0-beta.4",
@@ -64,10 +64,10 @@
64
64
  "@hi-ui/use-children": "^4.0.0-beta.4",
65
65
  "@hi-ui/use-data-source": "^4.0.0-beta.5",
66
66
  "@hi-ui/use-latest": "^4.0.0-beta.4",
67
- "@hi-ui/use-search-mode": "^4.0.0-beta.18",
67
+ "@hi-ui/use-search-mode": "^4.0.0-beta.19",
68
68
  "@hi-ui/use-toggle": "^4.0.0-beta.4",
69
69
  "@hi-ui/use-uncontrolled-state": "^4.0.0-beta.4",
70
- "rc-virtual-list": "^3.4.1"
70
+ "rc-virtual-list": "^3.4.7"
71
71
  },
72
72
  "peerDependencies": {
73
73
  "react": ">=16.8.6",
@@ -78,5 +78,5 @@
78
78
  "react": "^17.0.1",
79
79
  "react-dom": "^17.0.1"
80
80
  },
81
- "gitHead": "7f47840510e6dfce429eeed1591c154e321cd14f"
81
+ "gitHead": "64cc3305632f0d88f852f4a95cba7c27ff388a2d"
82
82
  }