@hi-ui/check-cascader 4.2.7 → 4.3.0
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 +10 -0
- package/lib/cjs/CheckCascader.js +18 -6
- package/lib/esm/CheckCascader.js +18 -6
- package/lib/types/CheckCascader.d.ts +17 -1
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
@@ -1,5 +1,15 @@
|
|
1
1
|
# @hi-ui/check-cascader
|
2
2
|
|
3
|
+
## 4.3.0
|
4
|
+
|
5
|
+
### Minor Changes
|
6
|
+
|
7
|
+
- [#2868](https://github.com/XiaoMi/hiui/pull/2868) [`95f2e843d`](https://github.com/XiaoMi/hiui/commit/95f2e843d154d5767c08d7a04a86d61804d71396) Thanks [@xiamiao1121](https://github.com/xiamiao1121)! - feat: 新增支持配置字段别名
|
8
|
+
|
9
|
+
- [#2824](https://github.com/XiaoMi/hiui/pull/2824) [`912c60b7b`](https://github.com/XiaoMi/hiui/commit/912c60b7b0f19a8386ec1de30fe6440e3963f288) Thanks [@xiamiao1121](https://github.com/xiamiao1121)! - feat: 支持前置后置内容
|
10
|
+
|
11
|
+
- [#2920](https://github.com/XiaoMi/hiui/pull/2920) [`ec38ee1a6`](https://github.com/XiaoMi/hiui/commit/ec38ee1a62f1716106ecd4617840295c1f22ed5b) Thanks [@yang-x20](https://github.com/yang-x20)! - feat: 新增自定义触发器
|
12
|
+
|
3
13
|
## 4.2.7
|
4
14
|
|
5
15
|
### Patch Changes
|
package/lib/cjs/CheckCascader.js
CHANGED
@@ -78,9 +78,13 @@ var CheckCascader = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
78
78
|
tagInputProps = _a.tagInputProps,
|
79
79
|
_a$size = _a.size,
|
80
80
|
size = _a$size === void 0 ? 'md' : _a$size,
|
81
|
+
prefix = _a.prefix,
|
82
|
+
suffix = _a.suffix,
|
81
83
|
renderExtraFooter = _a.renderExtraFooter,
|
82
84
|
dropdownColumnRender = _a.dropdownColumnRender,
|
83
|
-
|
85
|
+
customRender = _a.customRender,
|
86
|
+
fieldNames = _a.fieldNames,
|
87
|
+
rest = tslib.__rest(_a, ["prefixCls", "className", "defaultValue", "value", "onChange", "data", "placeholder", "clearable", "onSelect", "expandTrigger", "disabled", "emptyContent", "changeOnSelect", "render", "displayRender", "checkCascaded", "searchPlaceholder", "onLoadChildren", "appearance", "invalid", "filterOption", "searchable", "onSearch", "overlayClassName", "type", "checkedMode", "visible", "onOpen", "onClose", "tagInputProps", "size", "prefix", "suffix", "renderExtraFooter", "dropdownColumnRender", "customRender", "fieldNames"]);
|
84
88
|
var i18n = core.useLocaleContext();
|
85
89
|
var placeholder = typeAssertion.isUndef(placeholderProp) ? i18n.get('checkCascader.placeholder') : placeholderProp;
|
86
90
|
var flatted = type === 'flatted';
|
@@ -96,8 +100,8 @@ var CheckCascader = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
96
100
|
cascaderData = _useCache[0],
|
97
101
|
setCascaderData = _useCache[1];
|
98
102
|
var flattedData = React.useMemo(function () {
|
99
|
-
return index$1.flattenTreeData(cascaderData);
|
100
|
-
}, [cascaderData]);
|
103
|
+
return index$1.flattenTreeData(cascaderData, fieldNames);
|
104
|
+
}, [cascaderData, fieldNames]);
|
101
105
|
var _useUncontrolledState = useUncontrolledState.useUncontrolledState(defaultValue, valueProp, onChange),
|
102
106
|
_value = _useUncontrolledState[0],
|
103
107
|
tryChangeValue = _useUncontrolledState[1];
|
@@ -190,6 +194,13 @@ var CheckCascader = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
190
194
|
titleRender: proxyTitleRender
|
191
195
|
};
|
192
196
|
var cls = classname.cx(prefixCls, className, prefixCls + "--" + (menuVisible ? 'open' : 'closed'));
|
197
|
+
var selectedItems = React.useMemo(function () {
|
198
|
+
return value.map(function (selectedId) {
|
199
|
+
return flattedData.find(function (item) {
|
200
|
+
return item.id === selectedId;
|
201
|
+
});
|
202
|
+
});
|
203
|
+
}, [value, flattedData]);
|
193
204
|
return /*#__PURE__*/React__default["default"].createElement(picker.Picker, Object.assign({
|
194
205
|
ref: ref,
|
195
206
|
className: cls,
|
@@ -210,13 +221,14 @@ var CheckCascader = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
210
221
|
scrollable: false,
|
211
222
|
footer: typeAssertion.isFunction(renderExtraFooter) && renderExtraFooter(),
|
212
223
|
onSearch: funcUtils.callAllFuncs(onSearchProp, onSearch),
|
213
|
-
trigger: /*#__PURE__*/React__default["default"].createElement(tagInput.TagInputMock, Object.assign({}, tagInputProps, {
|
224
|
+
trigger: customRender ? typeof customRender === 'function' ? customRender(selectedItems) : customRender : ( /*#__PURE__*/React__default["default"].createElement(tagInput.TagInputMock, Object.assign({}, tagInputProps, {
|
214
225
|
size: size,
|
215
226
|
clearable: clearable,
|
216
227
|
placeholder: placeholder,
|
217
228
|
// @ts-ignore
|
218
229
|
displayRender: displayRender,
|
219
|
-
|
230
|
+
prefix: prefix,
|
231
|
+
suffix: [menuVisible ? /*#__PURE__*/React__default["default"].createElement(icons.UpOutlined, null) : /*#__PURE__*/React__default["default"].createElement(icons.DownOutlined, null), suffix],
|
220
232
|
focused: menuVisible,
|
221
233
|
appearance: appearance,
|
222
234
|
value: value,
|
@@ -224,7 +236,7 @@ var CheckCascader = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
224
236
|
onChange: proxyOnChange,
|
225
237
|
data: flattedData,
|
226
238
|
invalid: invalid
|
227
|
-
}))
|
239
|
+
})))
|
228
240
|
}), typeAssertion.isArrayNonEmpty(selectProps.data) ? ( /*#__PURE__*/React__default["default"].createElement(CheckCascaderMenuList.CheckCascaderMenuList, {
|
229
241
|
disabled: disabled,
|
230
242
|
value: value,
|
package/lib/esm/CheckCascader.js
CHANGED
@@ -66,9 +66,13 @@ var CheckCascader = /*#__PURE__*/forwardRef(function (_a, ref) {
|
|
66
66
|
tagInputProps = _a.tagInputProps,
|
67
67
|
_a$size = _a.size,
|
68
68
|
size = _a$size === void 0 ? 'md' : _a$size,
|
69
|
+
prefix = _a.prefix,
|
70
|
+
suffix = _a.suffix,
|
69
71
|
renderExtraFooter = _a.renderExtraFooter,
|
70
72
|
dropdownColumnRender = _a.dropdownColumnRender,
|
71
|
-
|
73
|
+
customRender = _a.customRender,
|
74
|
+
fieldNames = _a.fieldNames,
|
75
|
+
rest = __rest(_a, ["prefixCls", "className", "defaultValue", "value", "onChange", "data", "placeholder", "clearable", "onSelect", "expandTrigger", "disabled", "emptyContent", "changeOnSelect", "render", "displayRender", "checkCascaded", "searchPlaceholder", "onLoadChildren", "appearance", "invalid", "filterOption", "searchable", "onSearch", "overlayClassName", "type", "checkedMode", "visible", "onOpen", "onClose", "tagInputProps", "size", "prefix", "suffix", "renderExtraFooter", "dropdownColumnRender", "customRender", "fieldNames"]);
|
72
76
|
var i18n = useLocaleContext();
|
73
77
|
var placeholder = isUndef(placeholderProp) ? i18n.get('checkCascader.placeholder') : placeholderProp;
|
74
78
|
var flatted = type === 'flatted';
|
@@ -84,8 +88,8 @@ var CheckCascader = /*#__PURE__*/forwardRef(function (_a, ref) {
|
|
84
88
|
cascaderData = _useCache[0],
|
85
89
|
setCascaderData = _useCache[1];
|
86
90
|
var flattedData = useMemo(function () {
|
87
|
-
return flattenTreeData(cascaderData);
|
88
|
-
}, [cascaderData]);
|
91
|
+
return flattenTreeData(cascaderData, fieldNames);
|
92
|
+
}, [cascaderData, fieldNames]);
|
89
93
|
var _useUncontrolledState = useUncontrolledState(defaultValue, valueProp, onChange),
|
90
94
|
_value = _useUncontrolledState[0],
|
91
95
|
tryChangeValue = _useUncontrolledState[1];
|
@@ -178,6 +182,13 @@ var CheckCascader = /*#__PURE__*/forwardRef(function (_a, ref) {
|
|
178
182
|
titleRender: proxyTitleRender
|
179
183
|
};
|
180
184
|
var cls = cx(prefixCls, className, prefixCls + "--" + (menuVisible ? 'open' : 'closed'));
|
185
|
+
var selectedItems = useMemo(function () {
|
186
|
+
return value.map(function (selectedId) {
|
187
|
+
return flattedData.find(function (item) {
|
188
|
+
return item.id === selectedId;
|
189
|
+
});
|
190
|
+
});
|
191
|
+
}, [value, flattedData]);
|
181
192
|
return /*#__PURE__*/React.createElement(Picker, Object.assign({
|
182
193
|
ref: ref,
|
183
194
|
className: cls,
|
@@ -198,13 +209,14 @@ var CheckCascader = /*#__PURE__*/forwardRef(function (_a, ref) {
|
|
198
209
|
scrollable: false,
|
199
210
|
footer: isFunction(renderExtraFooter) && renderExtraFooter(),
|
200
211
|
onSearch: callAllFuncs(onSearchProp, onSearch),
|
201
|
-
trigger: /*#__PURE__*/React.createElement(TagInputMock, Object.assign({}, tagInputProps, {
|
212
|
+
trigger: customRender ? typeof customRender === 'function' ? customRender(selectedItems) : customRender : ( /*#__PURE__*/React.createElement(TagInputMock, Object.assign({}, tagInputProps, {
|
202
213
|
size: size,
|
203
214
|
clearable: clearable,
|
204
215
|
placeholder: placeholder,
|
205
216
|
// @ts-ignore
|
206
217
|
displayRender: displayRender,
|
207
|
-
|
218
|
+
prefix: prefix,
|
219
|
+
suffix: [menuVisible ? /*#__PURE__*/React.createElement(UpOutlined, null) : /*#__PURE__*/React.createElement(DownOutlined, null), suffix],
|
208
220
|
focused: menuVisible,
|
209
221
|
appearance: appearance,
|
210
222
|
value: value,
|
@@ -212,7 +224,7 @@ var CheckCascader = /*#__PURE__*/forwardRef(function (_a, ref) {
|
|
212
224
|
onChange: proxyOnChange,
|
213
225
|
data: flattedData,
|
214
226
|
invalid: invalid
|
215
|
-
}))
|
227
|
+
})))
|
216
228
|
}), isArrayNonEmpty(selectProps.data) ? ( /*#__PURE__*/React.createElement(CheckCascaderMenuList, {
|
217
229
|
disabled: disabled,
|
218
230
|
value: value,
|
@@ -2,7 +2,7 @@ import React from 'react';
|
|
2
2
|
import { CheckCascaderDataItem, CheckCascaderExpandTriggerEnum, CheckCascaderItemEventData, FlattedCheckCascaderDataItem } from './types';
|
3
3
|
import { PickerProps } from '@hi-ui/picker';
|
4
4
|
import { TagInputMockProps } from '@hi-ui/tag-input';
|
5
|
-
import { HiBaseAppearanceEnum, HiBaseSizeEnum } from '@hi-ui/core';
|
5
|
+
import { HiBaseAppearanceEnum, HiBaseFieldNames, HiBaseSizeEnum } from '@hi-ui/core';
|
6
6
|
/**
|
7
7
|
* 多项级联选择器
|
8
8
|
*/
|
@@ -12,6 +12,10 @@ export interface CheckCascaderProps extends Omit<PickerProps, 'trigger' | 'scrol
|
|
12
12
|
* 设置选择项数据源
|
13
13
|
*/
|
14
14
|
data: CheckCascaderDataItem[];
|
15
|
+
/**
|
16
|
+
* 设置 data 中字段对应的 key
|
17
|
+
*/
|
18
|
+
fieldNames?: HiBaseFieldNames;
|
15
19
|
/**
|
16
20
|
* 设置当前多选值
|
17
21
|
*/
|
@@ -108,6 +112,14 @@ export interface CheckCascaderProps extends Omit<PickerProps, 'trigger' | 'scrol
|
|
108
112
|
* 设置尺寸
|
109
113
|
*/
|
110
114
|
size?: HiBaseSizeEnum;
|
115
|
+
/**
|
116
|
+
* 选择框前置内容
|
117
|
+
*/
|
118
|
+
prefix?: React.ReactNode;
|
119
|
+
/**
|
120
|
+
* 选择框后置内容
|
121
|
+
*/
|
122
|
+
suffix?: React.ReactNode;
|
111
123
|
/**
|
112
124
|
* 自定义下拉菜单底部渲染
|
113
125
|
*/
|
@@ -116,4 +128,8 @@ export interface CheckCascaderProps extends Omit<PickerProps, 'trigger' | 'scrol
|
|
116
128
|
* 自定义下拉菜单每列渲染
|
117
129
|
*/
|
118
130
|
dropdownColumnRender?: (menu: React.ReactElement, level: number) => React.ReactNode;
|
131
|
+
/**
|
132
|
+
* 自定义触发器
|
133
|
+
*/
|
134
|
+
customRender?: React.ReactNode | ((selectItems: (FlattedCheckCascaderDataItem | undefined)[]) => React.ReactNode);
|
119
135
|
}
|