@hi-ui/cascader 4.0.9 → 4.1.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 +9 -0
- package/lib/cjs/Cascader.js +10 -4
- package/lib/cjs/CascaderMenuList.js +8 -3
- package/lib/cjs/styles/index.scss.js +2 -2
- package/lib/esm/Cascader.js +10 -4
- package/lib/esm/CascaderMenuList.js +9 -4
- package/lib/esm/styles/index.scss.js +2 -2
- package/lib/types/Cascader.d.ts +14 -2
- package/lib/types/CascaderMenuList.d.ts +1 -1
- package/lib/types/context.d.ts +2 -0
- package/package.json +3 -5
- package/LICENSE +0 -21
package/CHANGELOG.md
ADDED
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
# @hi-ui/cascader
|
|
2
|
+
|
|
3
|
+
## 4.1.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- [#2601](https://github.com/XiaoMi/hiui/pull/2601) [`80cc037a1`](https://github.com/XiaoMi/hiui/commit/80cc037a15381a5f3466a7ea79565e10f05ca129) Thanks [@zyprepare](https://github.com/zyprepare)! - feat: add size api
|
|
8
|
+
|
|
9
|
+
- [#2605](https://github.com/XiaoMi/hiui/pull/2605) [`90ea1ea81`](https://github.com/XiaoMi/hiui/commit/90ea1ea810573f730ebbc4c48272dd6181099933) Thanks [@zyprepare](https://github.com/zyprepare)! - feat: 增加 renderExtraFooter 和 dropdownColumnRender api
|
package/lib/cjs/Cascader.js
CHANGED
|
@@ -69,7 +69,7 @@ var _prefix = classname.getPrefixCls('cascader');
|
|
|
69
69
|
|
|
70
70
|
var NOOP_ARRAY = [];
|
|
71
71
|
/**
|
|
72
|
-
*
|
|
72
|
+
* 级联选择器
|
|
73
73
|
* Trigger + MenuList + Search
|
|
74
74
|
*/
|
|
75
75
|
|
|
@@ -102,9 +102,13 @@ var Cascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
102
102
|
_props$flattedSearchR = props.flattedSearchResult,
|
|
103
103
|
flattedSearchResult = _props$flattedSearchR === void 0 ? true : _props$flattedSearchR,
|
|
104
104
|
visible = props.visible,
|
|
105
|
+
_props$size = props.size,
|
|
106
|
+
size = _props$size === void 0 ? 'md' : _props$size,
|
|
105
107
|
onOpen = props.onOpen,
|
|
106
108
|
onClose = props.onClose,
|
|
107
|
-
|
|
109
|
+
renderExtraFooter = props.renderExtraFooter,
|
|
110
|
+
dropdownColumnRender = props.dropdownColumnRender,
|
|
111
|
+
rest = tslib.__rest(props, ["prefixCls", "className", "placeholder", "disabled", "clearable", "type", "fieldNames", "expandTrigger", "displayRender", "onSelect", "onLoadChildren", "appearance", "invalid", "filterOption", "searchable", "onSearch", "render", "overlayClassName", "data", "flattedSearchResult", "visible", "size", "onOpen", "onClose", "renderExtraFooter", "dropdownColumnRender"]);
|
|
108
112
|
|
|
109
113
|
var i18n = core.useLocaleContext();
|
|
110
114
|
var placeholder = typeAssertion.isUndef(placeholderProp) ? i18n.get('cascader.placeholder') : placeholderProp;
|
|
@@ -149,7 +153,6 @@ var Cascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
149
153
|
var flattedData = React.useMemo(function () {
|
|
150
154
|
return index$1.flattenTreeData(cascaderData, fieldNames);
|
|
151
155
|
}, [cascaderData, fieldNames]); // ************************** 异步搜索 ************************* //
|
|
152
|
-
// TODO: 支持对 Item 传入 状态
|
|
153
156
|
|
|
154
157
|
var customSearchStrategy = useSearchMode.useTreeCustomSearch({
|
|
155
158
|
data: flattedData,
|
|
@@ -257,7 +260,8 @@ var Cascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
257
260
|
value: Object.assign(Object.assign({}, context$1), {
|
|
258
261
|
expandTrigger: expandTrigger,
|
|
259
262
|
titleRender: proxyTitleRender,
|
|
260
|
-
menuList: showData
|
|
263
|
+
menuList: showData,
|
|
264
|
+
dropdownColumnRender: dropdownColumnRender
|
|
261
265
|
})
|
|
262
266
|
}, /*#__PURE__*/React__default["default"].createElement(picker.Picker, Object.assign({
|
|
263
267
|
ref: ref,
|
|
@@ -274,8 +278,10 @@ var Cascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
274
278
|
onClose: menuVisibleAction.off,
|
|
275
279
|
searchable: searchable,
|
|
276
280
|
scrollable: false,
|
|
281
|
+
footer: typeAssertion.isFunction(renderExtraFooter) && renderExtraFooter(),
|
|
277
282
|
onSearch: funcUtils.callAllFuncs(onSearchProp, onSearch),
|
|
278
283
|
trigger: /*#__PURE__*/React__default["default"].createElement(input.MockInput, {
|
|
284
|
+
size: size,
|
|
279
285
|
clearable: clearable,
|
|
280
286
|
placeholder: placeholder,
|
|
281
287
|
displayRender: displayRender,
|
|
@@ -50,15 +50,18 @@ var CascaderMenuList = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
|
50
50
|
|
|
51
51
|
var _useCascaderContext = context.useCascaderContext(),
|
|
52
52
|
flatted = _useCascaderContext.flatted,
|
|
53
|
-
menuList = _useCascaderContext.menuList
|
|
53
|
+
menuList = _useCascaderContext.menuList,
|
|
54
|
+
dropdownColumnRender = _useCascaderContext.dropdownColumnRender;
|
|
54
55
|
|
|
55
56
|
var cls = classname.cx(prefixCls, className, flatted && prefixCls + "--flatted");
|
|
56
57
|
return /*#__PURE__*/React__default["default"].createElement("div", Object.assign({
|
|
57
58
|
ref: ref,
|
|
58
59
|
className: cls
|
|
59
60
|
}, rest), menuList.map(function (menu, menuIndex) {
|
|
60
|
-
|
|
61
|
-
|
|
61
|
+
return typeAssertion.isArrayNonEmpty(menu) ? typeAssertion.isFunction(dropdownColumnRender) ? dropdownColumnRender( /*#__PURE__*/React__default["default"].createElement(CascaderMenu, {
|
|
62
|
+
key: menuIndex,
|
|
63
|
+
data: menu
|
|
64
|
+
}), menuIndex) : /*#__PURE__*/React__default["default"].createElement(CascaderMenu, {
|
|
62
65
|
key: menuIndex,
|
|
63
66
|
data: menu
|
|
64
67
|
}) : null;
|
|
@@ -77,6 +80,7 @@ var CascaderMenu = function CascaderMenu(_ref) {
|
|
|
77
80
|
_ref$role = _ref.role,
|
|
78
81
|
role = _ref$role === void 0 ? 'menu' : _ref$role,
|
|
79
82
|
className = _ref.className,
|
|
83
|
+
style = _ref.style,
|
|
80
84
|
menu = _ref.data;
|
|
81
85
|
|
|
82
86
|
var _useCascaderContext2 = context.useCascaderContext(),
|
|
@@ -92,6 +96,7 @@ var CascaderMenu = function CascaderMenu(_ref) {
|
|
|
92
96
|
var cls = classname.cx(prefixCls, className);
|
|
93
97
|
return /*#__PURE__*/React__default["default"].createElement("ul", {
|
|
94
98
|
className: cls,
|
|
99
|
+
style: style,
|
|
95
100
|
role: role
|
|
96
101
|
}, menu.map(function (option) {
|
|
97
102
|
var eventOption = index.getItemEventData(option, getItemRequiredProps(option));
|
|
@@ -12,9 +12,9 @@
|
|
|
12
12
|
Object.defineProperty(exports, '__esModule', {
|
|
13
13
|
value: true
|
|
14
14
|
});
|
|
15
|
-
var css_248z = "
|
|
15
|
+
var css_248z = "@charset \"UTF-8\";.hi-v4-cascader__popper .hi-v4-picker__body {padding-left: 0;padding-right: 0;overflow-y: hidden;}.hi-v4-cascader__popper .hi-v4-picker__loading, .hi-v4-cascader__popper .hi-v4-picker__empty {padding: var(--hi-v4-spacing-5, 10px) var(--hi-v4-spacing-8, 16px);}.hi-v4-cascader-panel {white-space: nowrap;-webkit-box-sizing: border-box;box-sizing: border-box;font-size: var(--hi-v4-text-size-md, 0.875rem);color: var(--hi-v4-color-gray-700, #1f2733);}.hi-v4-cascader-search {-webkit-box-sizing: border-box;box-sizing: border-box;padding: 0 10px 10px;position: relative;}.hi-v4-cascader-search .hi-v4-input__prefix {font-size: 16px;padding-left: 0;}.hi-v4-cascader-search__empty {display: inline-block;margin-top: 20px;font-size: 14px;font-weight: 400;color: #999;line-height: 20px;}.hi-v4-cascader-menu-list {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-sizing: border-box;box-sizing: border-box;overflow-x: auto;}.hi-v4-cascader-menu-list--flatted .hi-v4-cascader-menu {-ms-flex-preferred-size: 100%;flex-basis: 100%;}.hi-v4-cascader-menu {-webkit-box-sizing: border-box;box-sizing: border-box;margin: 0;padding: 0;border: none;outline: none;font-size: var(--hi-v4-text-size-md, 0.875rem);vertical-align: middle;list-style: none;width: auto;box-sizing: border-box;-ms-flex-negative: 0;flex-shrink: 0;display: inline-block;min-width: 140px;max-height: 260px;overflow: auto;padding: 4px 8px;border-right: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-200, #ebedf0);}.hi-v4-cascader-menu:last-of-type {border: none;}.hi-v4-cascader-menu-item {width: 100%;padding: var(--hi-v4-spacing-1, 2px) 0;position: relative;cursor: pointer;display: -webkit-box;display: -ms-flexbox;display: flex;}.hi-v4-cascader-menu-option {padding: 0 var(--hi-v4-spacing-4, 8px);-webkit-box-sizing: border-box;box-sizing: border-box;height: var(--hi-v4-height-7, 28px);width: 100%;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;position: relative;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;border-radius: var(--hi-v4-border-radius-md, 4px);}.hi-v4-cascader-menu-option:hover {background-color: var(--hi-v4-color-gray-100, #f2f4f7);}.hi-v4-cascader-menu-option.hi-v4-cascader-menu-option--selected {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe));color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa));}.hi-v4-cascader-menu-option.hi-v4-cascader-menu-option--selected .hi-v4-cascader-menu-switcher {color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa));}.hi-v4-cascader-menu-option--focused {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe));}.hi-v4-cascader-menu-option--checked {font-weight: 700;}.hi-v4-cascader-menu-option.hi-v4-cascader-menu-option--disabled {cursor: not-allowed;color: var(--hi-v4-color-gray-500, #929aa6);background: transparent;}.hi-v4-cascader-menu-option.hi-v4-cascader-menu-option--disabled .hi-v4-cascader-menu-switcher {color: var(--hi-v4-color-gray-400, #c9ced6);}.hi-v4-cascader-menu .title__text {-webkit-box-flex: 1;-ms-flex: 1 1;flex: 1 1;}.hi-v4-cascader-menu .title__text--cols {display: block;width: 100%;-webkit-box-sizing: border-box;box-sizing: border-box;margin: 0;padding: 0;border: none;outline: none;font-size: var(--hi-v4-text-size-md, 0.875rem);vertical-align: middle;list-style: none;}.hi-v4-cascader-menu .title__text--col {display: inline-block;}.hi-v4-cascader-menu .title__text--col::after {content: \" / \";}.hi-v4-cascader-menu .title__text--col:last-child::after {content: none;}.hi-v4-cascader-menu .title__text--matched {color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa));}.hi-v4-cascader-menu-switcher {-ms-flex-negative: 0;flex-shrink: 0;font-size: 16px;color: var(--hi-v4-color-gray-500, #929aa6);}.hi-v4-cascader-menu-switcher--loading {color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa));}.hi-v4-cascader-menu-switcher--arrow {-webkit-transform: rotate(-90deg);transform: rotate(-90deg);}.hi-v4-cascader__icon--loading {display: inline-block;width: 1em;height: 1em;stroke: none;cursor: default;fill: currentColor;}.hi-v4-cascader__icon--loading svg {-webkit-animation-name: hi-rotate;animation-name: hi-rotate;-webkit-animation-duration: 2s;animation-duration: 2s;-webkit-animation-iteration-count: infinite;animation-iteration-count: infinite;}@-webkit-keyframes rotate {to {-webkit-transform: rotate(360deg);transform: rotate(360deg);}}@keyframes rotate {to {-webkit-transform: rotate(360deg);transform: rotate(360deg);}}";
|
|
16
16
|
|
|
17
|
-
var __styleInject__ = require('inject
|
|
17
|
+
var __styleInject__ = require('style-inject')["default"];
|
|
18
18
|
|
|
19
19
|
__styleInject__(css_248z);
|
|
20
20
|
|
package/lib/esm/Cascader.js
CHANGED
|
@@ -32,7 +32,7 @@ var _prefix = getPrefixCls('cascader');
|
|
|
32
32
|
|
|
33
33
|
var NOOP_ARRAY = [];
|
|
34
34
|
/**
|
|
35
|
-
*
|
|
35
|
+
* 级联选择器
|
|
36
36
|
* Trigger + MenuList + Search
|
|
37
37
|
*/
|
|
38
38
|
|
|
@@ -65,9 +65,13 @@ var Cascader = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
|
65
65
|
_props$flattedSearchR = props.flattedSearchResult,
|
|
66
66
|
flattedSearchResult = _props$flattedSearchR === void 0 ? true : _props$flattedSearchR,
|
|
67
67
|
visible = props.visible,
|
|
68
|
+
_props$size = props.size,
|
|
69
|
+
size = _props$size === void 0 ? 'md' : _props$size,
|
|
68
70
|
onOpen = props.onOpen,
|
|
69
71
|
onClose = props.onClose,
|
|
70
|
-
|
|
72
|
+
renderExtraFooter = props.renderExtraFooter,
|
|
73
|
+
dropdownColumnRender = props.dropdownColumnRender,
|
|
74
|
+
rest = __rest(props, ["prefixCls", "className", "placeholder", "disabled", "clearable", "type", "fieldNames", "expandTrigger", "displayRender", "onSelect", "onLoadChildren", "appearance", "invalid", "filterOption", "searchable", "onSearch", "render", "overlayClassName", "data", "flattedSearchResult", "visible", "size", "onOpen", "onClose", "renderExtraFooter", "dropdownColumnRender"]);
|
|
71
75
|
|
|
72
76
|
var i18n = useLocaleContext();
|
|
73
77
|
var placeholder = isUndef(placeholderProp) ? i18n.get('cascader.placeholder') : placeholderProp;
|
|
@@ -112,7 +116,6 @@ var Cascader = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
|
112
116
|
var flattedData = useMemo(function () {
|
|
113
117
|
return flattenTreeData(cascaderData, fieldNames);
|
|
114
118
|
}, [cascaderData, fieldNames]); // ************************** 异步搜索 ************************* //
|
|
115
|
-
// TODO: 支持对 Item 传入 状态
|
|
116
119
|
|
|
117
120
|
var customSearchStrategy = useTreeCustomSearch({
|
|
118
121
|
data: flattedData,
|
|
@@ -220,7 +223,8 @@ var Cascader = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
|
220
223
|
value: Object.assign(Object.assign({}, context), {
|
|
221
224
|
expandTrigger: expandTrigger,
|
|
222
225
|
titleRender: proxyTitleRender,
|
|
223
|
-
menuList: showData
|
|
226
|
+
menuList: showData,
|
|
227
|
+
dropdownColumnRender: dropdownColumnRender
|
|
224
228
|
})
|
|
225
229
|
}, /*#__PURE__*/React.createElement(Picker, Object.assign({
|
|
226
230
|
ref: ref,
|
|
@@ -237,8 +241,10 @@ var Cascader = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
|
237
241
|
onClose: menuVisibleAction.off,
|
|
238
242
|
searchable: searchable,
|
|
239
243
|
scrollable: false,
|
|
244
|
+
footer: isFunction(renderExtraFooter) && renderExtraFooter(),
|
|
240
245
|
onSearch: callAllFuncs(onSearchProp, onSearch),
|
|
241
246
|
trigger: /*#__PURE__*/React.createElement(MockInput, {
|
|
247
|
+
size: size,
|
|
242
248
|
clearable: clearable,
|
|
243
249
|
placeholder: placeholder,
|
|
244
250
|
displayRender: displayRender,
|
|
@@ -15,7 +15,7 @@ import { defaultLoadingIcon, defaultSuffixIcon, defaultLeafIcon } from './icons/
|
|
|
15
15
|
import { getItemEventData, checkCanLoadChildren } from './utils/index.js';
|
|
16
16
|
import { useCascaderContext } from './context.js';
|
|
17
17
|
import { getTopDownAncestors } from '@hi-ui/tree-utils';
|
|
18
|
-
import { isArrayNonEmpty } from '@hi-ui/type-assertion';
|
|
18
|
+
import { isArrayNonEmpty, isFunction } from '@hi-ui/type-assertion';
|
|
19
19
|
var menuListPrefix = getPrefixCls('cascader-menu-list');
|
|
20
20
|
var CascaderMenuList = /*#__PURE__*/forwardRef(function (_a, ref) {
|
|
21
21
|
var _a$prefixCls = _a.prefixCls,
|
|
@@ -25,15 +25,18 @@ var CascaderMenuList = /*#__PURE__*/forwardRef(function (_a, ref) {
|
|
|
25
25
|
|
|
26
26
|
var _useCascaderContext = useCascaderContext(),
|
|
27
27
|
flatted = _useCascaderContext.flatted,
|
|
28
|
-
menuList = _useCascaderContext.menuList
|
|
28
|
+
menuList = _useCascaderContext.menuList,
|
|
29
|
+
dropdownColumnRender = _useCascaderContext.dropdownColumnRender;
|
|
29
30
|
|
|
30
31
|
var cls = cx(prefixCls, className, flatted && prefixCls + "--flatted");
|
|
31
32
|
return /*#__PURE__*/React.createElement("div", Object.assign({
|
|
32
33
|
ref: ref,
|
|
33
34
|
className: cls
|
|
34
35
|
}, rest), menuList.map(function (menu, menuIndex) {
|
|
35
|
-
|
|
36
|
-
|
|
36
|
+
return isArrayNonEmpty(menu) ? isFunction(dropdownColumnRender) ? dropdownColumnRender( /*#__PURE__*/React.createElement(CascaderMenu, {
|
|
37
|
+
key: menuIndex,
|
|
38
|
+
data: menu
|
|
39
|
+
}), menuIndex) : /*#__PURE__*/React.createElement(CascaderMenu, {
|
|
37
40
|
key: menuIndex,
|
|
38
41
|
data: menu
|
|
39
42
|
}) : null;
|
|
@@ -52,6 +55,7 @@ var CascaderMenu = function CascaderMenu(_ref) {
|
|
|
52
55
|
_ref$role = _ref.role,
|
|
53
56
|
role = _ref$role === void 0 ? 'menu' : _ref$role,
|
|
54
57
|
className = _ref.className,
|
|
58
|
+
style = _ref.style,
|
|
55
59
|
menu = _ref.data;
|
|
56
60
|
|
|
57
61
|
var _useCascaderContext2 = useCascaderContext(),
|
|
@@ -67,6 +71,7 @@ var CascaderMenu = function CascaderMenu(_ref) {
|
|
|
67
71
|
var cls = cx(prefixCls, className);
|
|
68
72
|
return /*#__PURE__*/React.createElement("ul", {
|
|
69
73
|
className: cls,
|
|
74
|
+
style: style,
|
|
70
75
|
role: role
|
|
71
76
|
}, menu.map(function (option) {
|
|
72
77
|
var eventOption = getItemEventData(option, getItemRequiredProps(option));
|
|
@@ -7,8 +7,8 @@
|
|
|
7
7
|
* This source code is licensed under the MIT license found in the
|
|
8
8
|
* LICENSE file in the root directory of this source tree.
|
|
9
9
|
*/
|
|
10
|
-
import __styleInject__ from 'inject
|
|
11
|
-
var css_248z = "
|
|
10
|
+
import __styleInject__ from 'style-inject';
|
|
11
|
+
var css_248z = "@charset \"UTF-8\";.hi-v4-cascader__popper .hi-v4-picker__body {padding-left: 0;padding-right: 0;overflow-y: hidden;}.hi-v4-cascader__popper .hi-v4-picker__loading, .hi-v4-cascader__popper .hi-v4-picker__empty {padding: var(--hi-v4-spacing-5, 10px) var(--hi-v4-spacing-8, 16px);}.hi-v4-cascader-panel {white-space: nowrap;-webkit-box-sizing: border-box;box-sizing: border-box;font-size: var(--hi-v4-text-size-md, 0.875rem);color: var(--hi-v4-color-gray-700, #1f2733);}.hi-v4-cascader-search {-webkit-box-sizing: border-box;box-sizing: border-box;padding: 0 10px 10px;position: relative;}.hi-v4-cascader-search .hi-v4-input__prefix {font-size: 16px;padding-left: 0;}.hi-v4-cascader-search__empty {display: inline-block;margin-top: 20px;font-size: 14px;font-weight: 400;color: #999;line-height: 20px;}.hi-v4-cascader-menu-list {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-sizing: border-box;box-sizing: border-box;overflow-x: auto;}.hi-v4-cascader-menu-list--flatted .hi-v4-cascader-menu {-ms-flex-preferred-size: 100%;flex-basis: 100%;}.hi-v4-cascader-menu {-webkit-box-sizing: border-box;box-sizing: border-box;margin: 0;padding: 0;border: none;outline: none;font-size: var(--hi-v4-text-size-md, 0.875rem);vertical-align: middle;list-style: none;width: auto;box-sizing: border-box;-ms-flex-negative: 0;flex-shrink: 0;display: inline-block;min-width: 140px;max-height: 260px;overflow: auto;padding: 4px 8px;border-right: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-200, #ebedf0);}.hi-v4-cascader-menu:last-of-type {border: none;}.hi-v4-cascader-menu-item {width: 100%;padding: var(--hi-v4-spacing-1, 2px) 0;position: relative;cursor: pointer;display: -webkit-box;display: -ms-flexbox;display: flex;}.hi-v4-cascader-menu-option {padding: 0 var(--hi-v4-spacing-4, 8px);-webkit-box-sizing: border-box;box-sizing: border-box;height: var(--hi-v4-height-7, 28px);width: 100%;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;position: relative;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;border-radius: var(--hi-v4-border-radius-md, 4px);}.hi-v4-cascader-menu-option:hover {background-color: var(--hi-v4-color-gray-100, #f2f4f7);}.hi-v4-cascader-menu-option.hi-v4-cascader-menu-option--selected {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe));color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa));}.hi-v4-cascader-menu-option.hi-v4-cascader-menu-option--selected .hi-v4-cascader-menu-switcher {color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa));}.hi-v4-cascader-menu-option--focused {background-color: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe));}.hi-v4-cascader-menu-option--checked {font-weight: 700;}.hi-v4-cascader-menu-option.hi-v4-cascader-menu-option--disabled {cursor: not-allowed;color: var(--hi-v4-color-gray-500, #929aa6);background: transparent;}.hi-v4-cascader-menu-option.hi-v4-cascader-menu-option--disabled .hi-v4-cascader-menu-switcher {color: var(--hi-v4-color-gray-400, #c9ced6);}.hi-v4-cascader-menu .title__text {-webkit-box-flex: 1;-ms-flex: 1 1;flex: 1 1;}.hi-v4-cascader-menu .title__text--cols {display: block;width: 100%;-webkit-box-sizing: border-box;box-sizing: border-box;margin: 0;padding: 0;border: none;outline: none;font-size: var(--hi-v4-text-size-md, 0.875rem);vertical-align: middle;list-style: none;}.hi-v4-cascader-menu .title__text--col {display: inline-block;}.hi-v4-cascader-menu .title__text--col::after {content: \" / \";}.hi-v4-cascader-menu .title__text--col:last-child::after {content: none;}.hi-v4-cascader-menu .title__text--matched {color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa));}.hi-v4-cascader-menu-switcher {-ms-flex-negative: 0;flex-shrink: 0;font-size: 16px;color: var(--hi-v4-color-gray-500, #929aa6);}.hi-v4-cascader-menu-switcher--loading {color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa));}.hi-v4-cascader-menu-switcher--arrow {-webkit-transform: rotate(-90deg);transform: rotate(-90deg);}.hi-v4-cascader__icon--loading {display: inline-block;width: 1em;height: 1em;stroke: none;cursor: default;fill: currentColor;}.hi-v4-cascader__icon--loading svg {-webkit-animation-name: hi-rotate;animation-name: hi-rotate;-webkit-animation-duration: 2s;animation-duration: 2s;-webkit-animation-iteration-count: infinite;animation-iteration-count: infinite;}@-webkit-keyframes rotate {to {-webkit-transform: rotate(360deg);transform: rotate(360deg);}}@keyframes rotate {to {-webkit-transform: rotate(360deg);transform: rotate(360deg);}}";
|
|
12
12
|
|
|
13
13
|
__styleInject__(css_248z);
|
|
14
14
|
|
package/lib/types/Cascader.d.ts
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import type { HiBaseAppearanceEnum } from '@hi-ui/core';
|
|
2
|
+
import type { HiBaseAppearanceEnum, HiBaseSizeEnum } from '@hi-ui/core';
|
|
3
3
|
import { UseCascaderProps } from './use-cascader';
|
|
4
4
|
import type { PopperOverlayProps } from '@hi-ui/popper';
|
|
5
5
|
import { CascaderExpandTriggerEnum, CascaderItemEventData } from './types';
|
|
6
6
|
import { PickerProps } from '@hi-ui/picker';
|
|
7
7
|
/**
|
|
8
|
-
*
|
|
8
|
+
* 级联选择器
|
|
9
9
|
* Trigger + MenuList + Search
|
|
10
10
|
*/
|
|
11
11
|
export declare const Cascader: React.ForwardRefExoticComponent<CascaderProps & React.RefAttributes<HTMLDivElement | null>>;
|
|
@@ -65,4 +65,16 @@ export interface CascaderProps extends Omit<PickerProps, 'data' | 'onChange' | '
|
|
|
65
65
|
* 搜索结果拍平展示
|
|
66
66
|
*/
|
|
67
67
|
flattedSearchResult?: boolean;
|
|
68
|
+
/**
|
|
69
|
+
* 自定义下拉菜单底部渲染
|
|
70
|
+
*/
|
|
71
|
+
renderExtraFooter?: () => React.ReactNode;
|
|
72
|
+
/**
|
|
73
|
+
* 自定义下拉菜单每列渲染
|
|
74
|
+
*/
|
|
75
|
+
dropdownColumnRender?: (menu: React.ReactElement, level: number) => React.ReactNode;
|
|
76
|
+
/**
|
|
77
|
+
* 设置尺寸
|
|
78
|
+
*/
|
|
79
|
+
size?: HiBaseSizeEnum;
|
|
68
80
|
}
|
|
@@ -4,7 +4,7 @@ import { FlattedCascaderDataItem } from './types';
|
|
|
4
4
|
export declare const CascaderMenuList: React.ForwardRefExoticComponent<Pick<CascaderMenuListProps, string | number> & React.RefAttributes<HTMLDivElement | null>>;
|
|
5
5
|
export interface CascaderMenuListProps extends HiBaseHTMLProps {
|
|
6
6
|
}
|
|
7
|
-
export declare const CascaderMenu: ({ prefixCls, role, className, data: menu, }: CascaderMenuProps) => JSX.Element;
|
|
7
|
+
export declare const CascaderMenu: ({ prefixCls, role, className, style, data: menu, }: CascaderMenuProps) => JSX.Element;
|
|
8
8
|
export interface CascaderMenuProps extends HiBaseHTMLProps {
|
|
9
9
|
/**
|
|
10
10
|
* 设置选择项数据源
|
package/lib/types/context.d.ts
CHANGED
|
@@ -17,6 +17,7 @@ export declare const CascaderProvider: React.Provider<(Omit<{
|
|
|
17
17
|
}, "rootProps"> & {
|
|
18
18
|
expandTrigger: CascaderExpandTriggerEnum;
|
|
19
19
|
titleRender: (item: CascaderItemEventData) => React.ReactNode;
|
|
20
|
+
dropdownColumnRender?: ((menu: React.ReactElement, level: number) => React.ReactNode) | undefined;
|
|
20
21
|
}) | null>;
|
|
21
22
|
export declare const useCascaderContext: () => Omit<{
|
|
22
23
|
rootProps: {};
|
|
@@ -35,4 +36,5 @@ export declare const useCascaderContext: () => Omit<{
|
|
|
35
36
|
}, "rootProps"> & {
|
|
36
37
|
expandTrigger: CascaderExpandTriggerEnum;
|
|
37
38
|
titleRender: (item: CascaderItemEventData) => React.ReactNode;
|
|
39
|
+
dropdownColumnRender?: ((menu: React.ReactElement, level: number) => React.ReactNode) | undefined;
|
|
38
40
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@hi-ui/cascader",
|
|
3
|
-
"version": "4.0
|
|
3
|
+
"version": "4.1.0",
|
|
4
4
|
"description": "A sub-package for @hi-ui/hiui.",
|
|
5
5
|
"keywords": [],
|
|
6
6
|
"author": "HiUI <mi-hiui@xiaomi.com>",
|
|
@@ -69,10 +69,8 @@
|
|
|
69
69
|
},
|
|
70
70
|
"devDependencies": {
|
|
71
71
|
"@hi-ui/core": "^4.0.4",
|
|
72
|
-
"@hi-ui/core-css": "^4.
|
|
73
|
-
"@hi-ui/hi-build": "^4.0.1",
|
|
72
|
+
"@hi-ui/core-css": "^4.1.1",
|
|
74
73
|
"react": "^17.0.1",
|
|
75
74
|
"react-dom": "^17.0.1"
|
|
76
|
-
}
|
|
77
|
-
"gitHead": "d075180134a471227e6c344a5bbbb98d91904f9a"
|
|
75
|
+
}
|
|
78
76
|
}
|
package/LICENSE
DELETED
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
MIT License
|
|
2
|
-
|
|
3
|
-
Copyright (c) 2018 Xiaomi
|
|
4
|
-
|
|
5
|
-
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
-
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
-
in the Software without restriction, including without limitation the rights
|
|
8
|
-
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
-
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
-
furnished to do so, subject to the following conditions:
|
|
11
|
-
|
|
12
|
-
The above copyright notice and this permission notice shall be included in all
|
|
13
|
-
copies or substantial portions of the Software.
|
|
14
|
-
|
|
15
|
-
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
-
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
-
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
-
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
-
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
-
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
-
SOFTWARE.
|