@hi-ui/cascader 4.0.0-beta.9 → 4.0.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/lib/cjs/Cascader.js +47 -150
- package/lib/cjs/CascaderMenuList.js +172 -0
- package/lib/cjs/context.js +1 -2
- package/lib/cjs/hooks/use-async-switch.js +5 -6
- package/lib/cjs/hooks/use-cache/lib/esm/index.js +2 -3
- package/lib/cjs/hooks/use-select.js +1 -2
- package/lib/cjs/icons/index.js +4 -5
- package/lib/cjs/index.js +1 -4
- package/lib/cjs/styles/index.scss.js +3 -4
- package/lib/cjs/use-cascader.js +3 -3
- package/lib/cjs/utils/index.js +30 -2
- package/lib/esm/Cascader.js +35 -139
- package/lib/esm/CascaderMenuList.js +146 -0
- package/lib/esm/context.js +1 -2
- package/lib/esm/hooks/use-async-switch.js +1 -2
- package/lib/esm/hooks/use-cache/lib/esm/index.js +2 -3
- package/lib/esm/hooks/use-select.js +1 -2
- package/lib/esm/icons/index.js +1 -2
- package/lib/esm/index.js +2 -3
- package/lib/esm/styles/index.scss.js +4 -6
- package/lib/esm/use-cascader.js +3 -3
- package/lib/esm/utils/index.js +30 -3
- package/lib/types/Cascader.d.ts +6 -12
- package/lib/types/CascaderMenuList.d.ts +13 -0
- package/lib/types/context.d.ts +7 -7
- package/lib/types/hooks/use-select.d.ts +2 -2
- package/lib/types/index.d.ts +1 -0
- package/lib/types/types.d.ts +15 -18
- package/lib/types/use-cascader.d.ts +6 -7
- package/lib/types/utils/index.d.ts +8 -7
- package/package.json +25 -23
- package/lib/cjs/Cascader.js.map +0 -1
- package/lib/cjs/context.js.map +0 -1
- package/lib/cjs/hooks/use-async-switch.js.map +0 -1
- package/lib/cjs/hooks/use-cache/lib/esm/index.js.map +0 -1
- package/lib/cjs/hooks/use-select.js.map +0 -1
- package/lib/cjs/icons/index.js.map +0 -1
- package/lib/cjs/index.js.map +0 -1
- package/lib/cjs/styles/index.scss.js.map +0 -1
- package/lib/cjs/use-cascader.js.map +0 -1
- package/lib/cjs/utils/index.js.map +0 -1
- package/lib/esm/Cascader.js.map +0 -1
- package/lib/esm/context.js.map +0 -1
- package/lib/esm/hooks/use-async-switch.js.map +0 -1
- package/lib/esm/hooks/use-cache/lib/esm/index.js.map +0 -1
- package/lib/esm/hooks/use-select.js.map +0 -1
- package/lib/esm/icons/index.js.map +0 -1
- package/lib/esm/index.js.map +0 -1
- package/lib/esm/styles/index.scss.js.map +0 -1
- package/lib/esm/use-cascader.js.map +0 -1
- package/lib/esm/utils/index.js.map +0 -1
@@ -2,7 +2,7 @@
|
|
2
2
|
* @hi-ui/cascader
|
3
3
|
* https://github.com/XiaoMi/hiui/tree/master/packages/ui/cascader#readme
|
4
4
|
*
|
5
|
-
* Copyright (c)
|
5
|
+
* Copyright (c) HiUI <mi-hiui@xiaomi.com>.
|
6
6
|
*
|
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.
|
@@ -12,11 +12,10 @@
|
|
12
12
|
Object.defineProperty(exports, '__esModule', {
|
13
13
|
value: true
|
14
14
|
});
|
15
|
-
var css_248z = "
|
15
|
+
var css_248z = ".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-2, 4px) 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: 32px;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: '\\00a0/\\00a0'; }.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('
|
17
|
+
var __styleInject__ = require('inject-head-style')["default"];
|
18
18
|
|
19
19
|
__styleInject__(css_248z);
|
20
20
|
|
21
21
|
exports["default"] = css_248z;
|
22
|
-
//# sourceMappingURL=index.scss.js.map
|
package/lib/cjs/use-cascader.js
CHANGED
@@ -2,7 +2,7 @@
|
|
2
2
|
* @hi-ui/cascader
|
3
3
|
* https://github.com/XiaoMi/hiui/tree/master/packages/ui/cascader#readme
|
4
4
|
*
|
5
|
-
* Copyright (c)
|
5
|
+
* Copyright (c) HiUI <mi-hiui@xiaomi.com>.
|
6
6
|
*
|
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.
|
@@ -105,12 +105,13 @@ var useCascader = function useCascader(_a) {
|
|
105
105
|
var id = _ref3.id,
|
106
106
|
depth = _ref3.depth;
|
107
107
|
return {
|
108
|
+
active: value[depth] === id,
|
108
109
|
selected: flatted ? selectedId === id : selectedIds[depth] === id,
|
109
110
|
loading: isLoadingId(id),
|
110
111
|
// TODO: 表示聚焦状态,添加快捷键时可以一起处理
|
111
112
|
focused: false
|
112
113
|
};
|
113
|
-
}, [flatted, selectedId, selectedIds, isLoadingId]);
|
114
|
+
}, [flatted, selectedId, selectedIds, isLoadingId, value]);
|
114
115
|
var reset = React.useCallback(function () {
|
115
116
|
setSelectedId(value[value.length - 1]);
|
116
117
|
}, [setSelectedId, value]);
|
@@ -132,4 +133,3 @@ var useCascader = function useCascader(_a) {
|
|
132
133
|
};
|
133
134
|
|
134
135
|
exports.useCascader = useCascader;
|
135
|
-
//# sourceMappingURL=use-cascader.js.map
|
package/lib/cjs/utils/index.js
CHANGED
@@ -2,7 +2,7 @@
|
|
2
2
|
* @hi-ui/cascader
|
3
3
|
* https://github.com/XiaoMi/hiui/tree/master/packages/ui/cascader#readme
|
4
4
|
*
|
5
|
-
* Copyright (c)
|
5
|
+
* Copyright (c) HiUI <mi-hiui@xiaomi.com>.
|
6
6
|
*
|
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.
|
@@ -110,10 +110,38 @@ function getItemEventData(node, requiredProps) {
|
|
110
110
|
return Object.assign(Object.assign({}, node), requiredProps);
|
111
111
|
}
|
112
112
|
|
113
|
+
var getFilteredMenuList = function getFilteredMenuList(menuList, searchedData) {
|
114
|
+
var result = [];
|
115
|
+
searchedData.forEach(function (item) {
|
116
|
+
while (item && item.depth >= 0) {
|
117
|
+
var depth = item.depth;
|
118
|
+
var depthResult = result[depth];
|
119
|
+
|
120
|
+
if (!depthResult) {
|
121
|
+
depthResult = new Map();
|
122
|
+
result[depth] = depthResult;
|
123
|
+
}
|
124
|
+
|
125
|
+
depthResult.set(item.id, item);
|
126
|
+
item = item.parent;
|
127
|
+
}
|
128
|
+
});
|
129
|
+
return menuList.map(function (depthItems, depth) {
|
130
|
+
var depthSavedMp = result[depth];
|
131
|
+
if (!depthSavedMp) return depthItems;
|
132
|
+
return depthItems.filter(function (item) {
|
133
|
+
var depthSavedMp = result[item.depth];
|
134
|
+
if (!depthSavedMp) return true;
|
135
|
+
if (depthSavedMp.has(item.id)) return true;
|
136
|
+
return false;
|
137
|
+
});
|
138
|
+
});
|
139
|
+
};
|
140
|
+
|
113
141
|
exports.checkCanLoadChildren = checkCanLoadChildren;
|
114
142
|
exports.flattenTreeData = flattenTreeData;
|
115
143
|
exports.getActiveMenus = getActiveMenus;
|
116
144
|
exports.getActiveNodePaths = getActiveNodePaths;
|
145
|
+
exports.getFilteredMenuList = getFilteredMenuList;
|
117
146
|
exports.getFlattedMenus = getFlattedMenus;
|
118
147
|
exports.getItemEventData = getItemEventData;
|
119
|
-
//# sourceMappingURL=index.js.map
|
package/lib/esm/Cascader.js
CHANGED
@@ -2,7 +2,7 @@
|
|
2
2
|
* @hi-ui/cascader
|
3
3
|
* https://github.com/XiaoMi/hiui/tree/master/packages/ui/cascader#readme
|
4
4
|
*
|
5
|
-
* Copyright (c)
|
5
|
+
* Copyright (c) HiUI <mi-hiui@xiaomi.com>.
|
6
6
|
*
|
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.
|
@@ -15,17 +15,18 @@ import { useUncontrolledToggle } from '@hi-ui/use-toggle';
|
|
15
15
|
import { useCascader } from './use-cascader.js';
|
16
16
|
import { MockInput } from '@hi-ui/input';
|
17
17
|
import { UpOutlined, DownOutlined } from '@hi-ui/icons';
|
18
|
-
import {
|
19
|
-
import {
|
20
|
-
import { CascaderProvider, useCascaderContext } from './context.js';
|
18
|
+
import { flattenTreeData, getFilteredMenuList, getItemEventData } from './utils/index.js';
|
19
|
+
import { CascaderProvider } from './context.js';
|
21
20
|
import { getTopDownAncestors, getNodeAncestorsWithMe } from '@hi-ui/tree-utils';
|
22
21
|
import { isUndef, isArrayNonEmpty, isFunction } from '@hi-ui/type-assertion';
|
23
22
|
import { Picker } from '@hi-ui/picker';
|
24
23
|
import { useTreeCustomSearch, useTreeUpMatchSearch, useSearchMode } from '@hi-ui/use-search-mode';
|
25
24
|
import { uniqBy } from '@hi-ui/array-utils';
|
26
25
|
import { useCache } from './hooks/use-cache/lib/esm/index.js';
|
27
|
-
import { useLocaleContext } from '@hi-ui/
|
26
|
+
import { useLocaleContext } from '@hi-ui/core';
|
28
27
|
import { callAllFuncs } from '@hi-ui/func-utils';
|
28
|
+
import { CascaderMenuList } from './CascaderMenuList.js';
|
29
|
+
import Highlighter from '@hi-ui/highlighter';
|
29
30
|
|
30
31
|
var _prefix = getPrefixCls('cascader');
|
31
32
|
|
@@ -61,15 +62,18 @@ var Cascader = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
61
62
|
overlayClassName = props.overlayClassName,
|
62
63
|
_props$data = props.data,
|
63
64
|
data = _props$data === void 0 ? NOOP_ARRAY : _props$data,
|
65
|
+
_props$flattedSearchR = props.flattedSearchResult,
|
66
|
+
flattedSearchResult = _props$flattedSearchR === void 0 ? true : _props$flattedSearchR,
|
67
|
+
visible = props.visible,
|
64
68
|
onOpen = props.onOpen,
|
65
69
|
onClose = props.onClose,
|
66
|
-
rest = __rest(props, ["prefixCls", "className", "placeholder", "disabled", "clearable", "type", "fieldNames", "expandTrigger", "displayRender", "onSelect", "onLoadChildren", "appearance", "invalid", "filterOption", "searchable", "onSearch", "render", "overlayClassName", "data", "onOpen", "onClose"]);
|
70
|
+
rest = __rest(props, ["prefixCls", "className", "placeholder", "disabled", "clearable", "type", "fieldNames", "expandTrigger", "displayRender", "onSelect", "onLoadChildren", "appearance", "invalid", "filterOption", "searchable", "onSearch", "render", "overlayClassName", "data", "flattedSearchResult", "visible", "onOpen", "onClose"]);
|
67
71
|
|
68
72
|
var i18n = useLocaleContext();
|
69
73
|
var placeholder = isUndef(placeholderProp) ? i18n.get('cascader.placeholder') : placeholderProp;
|
70
|
-
var flatted = type === 'flatted';
|
71
74
|
|
72
75
|
var _useUncontrolledToggl = useUncontrolledToggle({
|
76
|
+
visible: visible,
|
73
77
|
disabled: disabled,
|
74
78
|
onOpen: onOpen,
|
75
79
|
onClose: onClose
|
@@ -95,7 +99,7 @@ var Cascader = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
95
99
|
var highlight = !!searchValue && searchMode === 'upMatch';
|
96
100
|
|
97
101
|
if (highlight) {
|
98
|
-
return renderHighlightTitle(searchValue, node, titleRender);
|
102
|
+
return flattedSearchResult ? renderHighlightTitles(searchValue, node, titleRender) : renderHighlightTitle(searchValue, node, titleRender);
|
99
103
|
}
|
100
104
|
|
101
105
|
return isFunction(titleRender) ? titleRender(node) : true;
|
@@ -118,9 +122,12 @@ var Cascader = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
118
122
|
data: cascaderData,
|
119
123
|
flattedData: flattedData,
|
120
124
|
enabled: searchableProp,
|
121
|
-
exclude: function exclude(
|
122
|
-
return
|
123
|
-
}
|
125
|
+
exclude: function exclude(node) {
|
126
|
+
return node.disabled;
|
127
|
+
} // exclude: (option: FlattedCascaderDataItem) => {
|
128
|
+
// return checkCanLoadChildren(option, onLoadChildren)
|
129
|
+
// },
|
130
|
+
|
124
131
|
});
|
125
132
|
|
126
133
|
var _useSearchMode = useSearchMode({
|
@@ -158,11 +165,14 @@ var Cascader = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
158
165
|
}, mergedTitle);
|
159
166
|
};
|
160
167
|
|
168
|
+
var shouldUseSearch = !!searchValue; // 搜索的结果列表也采用 flatted 模式进行展示
|
169
|
+
|
170
|
+
var flatted = shouldUseSearch ? flattedSearchResult : type === 'flatted';
|
171
|
+
|
161
172
|
var _a = useCascader(Object.assign(Object.assign({}, rest), {
|
162
173
|
disabled: disabled,
|
163
174
|
fieldNames: fieldNames,
|
164
|
-
|
165
|
-
flatted: flatted || !!searchValue,
|
175
|
+
flatted: flatted,
|
166
176
|
onSelect: onSelect,
|
167
177
|
onLoadChildren: onLoadChildren,
|
168
178
|
data: data,
|
@@ -179,14 +189,17 @@ var Cascader = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
179
189
|
reset = context.reset,
|
180
190
|
menuList = context.menuList,
|
181
191
|
getItemRequiredProps = context.getItemRequiredProps;
|
182
|
-
var shouldUseSearch = !!searchValue;
|
183
192
|
var showData = useMemo(function () {
|
184
193
|
if (shouldUseSearch) {
|
194
|
+
if (!flattedSearchResult) {
|
195
|
+
return getFilteredMenuList(menuList, stateInSearch.data);
|
196
|
+
}
|
197
|
+
|
185
198
|
return isArrayNonEmpty(stateInSearch.data) ? [stateInSearch.data] : [];
|
186
199
|
}
|
187
200
|
|
188
201
|
return menuList;
|
189
|
-
}, [shouldUseSearch, stateInSearch.data, menuList]);
|
202
|
+
}, [shouldUseSearch, flattedSearchResult, stateInSearch.data, menuList]);
|
190
203
|
useEffect(function () {
|
191
204
|
// 关闭展示后,重置展开要高亮的选项
|
192
205
|
if (!menuVisible) {
|
@@ -245,133 +258,17 @@ if (__DEV__) {
|
|
245
258
|
Cascader.displayName = 'Cascader';
|
246
259
|
}
|
247
260
|
|
248
|
-
var
|
249
|
-
var CascaderMenuList = /*#__PURE__*/forwardRef(function (_a, ref) {
|
250
|
-
var _a$prefixCls = _a.prefixCls,
|
251
|
-
prefixCls = _a$prefixCls === void 0 ? menuListPrefix : _a$prefixCls,
|
252
|
-
className = _a.className,
|
253
|
-
rest = __rest(_a, ["prefixCls", "className"]);
|
254
|
-
|
255
|
-
var _useCascaderContext = useCascaderContext(),
|
256
|
-
flatted = _useCascaderContext.flatted,
|
257
|
-
menuList = _useCascaderContext.menuList;
|
258
|
-
|
259
|
-
var cls = cx(prefixCls, className, flatted && prefixCls + "--flatted");
|
260
|
-
return /*#__PURE__*/React.createElement("div", Object.assign({
|
261
|
-
ref: ref,
|
262
|
-
className: cls
|
263
|
-
}, rest), menuList.map(function (menu, menuIndex) {
|
264
|
-
// @ts-ignore
|
265
|
-
return isArrayNonEmpty(menu) ? /*#__PURE__*/React.createElement(CascaderMenu, {
|
266
|
-
key: menuIndex,
|
267
|
-
data: menu
|
268
|
-
}) : null;
|
269
|
-
}));
|
270
|
-
});
|
271
|
-
|
272
|
-
if (__DEV__) {
|
273
|
-
CascaderMenuList.displayName = 'CascaderMenuList';
|
274
|
-
}
|
275
|
-
|
276
|
-
var menuPrefix = getPrefixCls('cascader-menu');
|
277
|
-
|
278
|
-
var CascaderMenu = function CascaderMenu(_ref2) {
|
279
|
-
var _ref2$prefixCls = _ref2.prefixCls,
|
280
|
-
prefixCls = _ref2$prefixCls === void 0 ? menuPrefix : _ref2$prefixCls,
|
281
|
-
_ref2$role = _ref2.role,
|
282
|
-
role = _ref2$role === void 0 ? 'menu' : _ref2$role,
|
283
|
-
className = _ref2.className,
|
284
|
-
menu = _ref2.data;
|
285
|
-
|
286
|
-
var _useCascaderContext2 = useCascaderContext(),
|
287
|
-
flatted = _useCascaderContext2.flatted,
|
288
|
-
disabledContext = _useCascaderContext2.disabled,
|
289
|
-
expandTrigger = _useCascaderContext2.expandTrigger,
|
290
|
-
onItemClick = _useCascaderContext2.onItemClick,
|
291
|
-
onItemHover = _useCascaderContext2.onItemHover,
|
292
|
-
titleRender = _useCascaderContext2.titleRender,
|
293
|
-
onLoadChildren = _useCascaderContext2.onLoadChildren,
|
294
|
-
getItemRequiredProps = _useCascaderContext2.getItemRequiredProps;
|
295
|
-
|
296
|
-
var cls = cx(prefixCls, className);
|
297
|
-
return /*#__PURE__*/React.createElement("ul", {
|
298
|
-
className: cls,
|
299
|
-
role: role
|
300
|
-
}, menu.map(function (option) {
|
301
|
-
var eventOption = getItemEventData(option, getItemRequiredProps(option));
|
302
|
-
var selected = eventOption.selected,
|
303
|
-
loading = eventOption.loading;
|
304
|
-
var disabled = disabledContext || option.disabled;
|
305
|
-
var optionCls = cx(prefixCls + "-option", loading && prefixCls + "-option--loading", disabled && prefixCls + "-option--disabled", selected && prefixCls + "-option--selected");
|
306
|
-
return /*#__PURE__*/React.createElement("li", {
|
307
|
-
key: option.id,
|
308
|
-
role: "menu-item",
|
309
|
-
className: prefixCls + "-item"
|
310
|
-
}, /*#__PURE__*/React.createElement("div", {
|
311
|
-
className: optionCls,
|
312
|
-
onClick: function onClick() {
|
313
|
-
if (disabled) return;
|
314
|
-
onItemClick(eventOption);
|
315
|
-
},
|
316
|
-
onMouseEnter: function onMouseEnter() {
|
317
|
-
if (disabled) return;
|
318
|
-
|
319
|
-
if (expandTrigger === 'hover') {
|
320
|
-
onItemHover(eventOption);
|
321
|
-
}
|
322
|
-
}
|
323
|
-
}, flatted ? renderFlattedTitle(eventOption, titleRender) : /*#__PURE__*/React.createElement(React.Fragment, null, renderDefaultTitle(eventOption, titleRender), renderSuffix(prefixCls, option, loading, onLoadChildren))));
|
324
|
-
}));
|
325
|
-
};
|
326
|
-
/**
|
327
|
-
* 渲染菜单子项的展开提示图标
|
328
|
-
*/
|
329
|
-
|
330
|
-
|
331
|
-
var renderSuffix = function renderSuffix(prefixCls, item, loading, onLoadChildren) {
|
332
|
-
if (loading) {
|
333
|
-
return /*#__PURE__*/React.createElement("span", {
|
334
|
-
className: cx(prefixCls + "-switcher", prefixCls + "-switcher--loading")
|
335
|
-
}, defaultLoadingIcon);
|
336
|
-
}
|
337
|
-
|
338
|
-
var canLoadChildren = checkCanLoadChildren(item, onLoadChildren);
|
339
|
-
|
340
|
-
if (canLoadChildren) {
|
341
|
-
return /*#__PURE__*/React.createElement("span", {
|
342
|
-
className: cx(prefixCls + "-switcher", prefixCls + "-switcher--arrow")
|
343
|
-
}, defaultSuffixIcon);
|
344
|
-
}
|
345
|
-
|
346
|
-
return /*#__PURE__*/React.createElement("span", {
|
347
|
-
className: cx(prefixCls + "-switcher", prefixCls + "-switcher--noop")
|
348
|
-
}, defaultLeafIcon);
|
349
|
-
};
|
350
|
-
|
351
|
-
var renderFlattedTitle = function renderFlattedTitle(option, titleRender) {
|
352
|
-
// 如果 titleRender 返回 `true`,则使用默认 title
|
353
|
-
var title = titleRender ? titleRender(option) : true;
|
354
|
-
if (title !== true) return title;
|
355
|
-
return /*#__PURE__*/React.createElement("span", {
|
356
|
-
className: "title__text title__text--cols"
|
357
|
-
}, getTopDownAncestors(option).map(function (item) {
|
358
|
-
return /*#__PURE__*/React.createElement("span", {
|
359
|
-
key: item.id,
|
360
|
-
className: "title__text--col"
|
361
|
-
}, item.title);
|
362
|
-
}));
|
363
|
-
};
|
364
|
-
|
365
|
-
var renderDefaultTitle = function renderDefaultTitle(option, titleRender) {
|
261
|
+
var renderHighlightTitle = function renderHighlightTitle(keyword, option, titleRender) {
|
366
262
|
// 如果 titleRender 返回 `true`,则使用默认 title
|
367
|
-
var title = titleRender ? titleRender(option) : true;
|
263
|
+
var title = titleRender ? titleRender(option, keyword) : true;
|
368
264
|
if (title !== true) return title;
|
369
|
-
return /*#__PURE__*/React.createElement(
|
370
|
-
|
265
|
+
return /*#__PURE__*/React.createElement(Highlighter, {
|
266
|
+
key: option.id,
|
267
|
+
keyword: keyword
|
371
268
|
}, option.title);
|
372
269
|
};
|
373
270
|
|
374
|
-
var
|
271
|
+
var renderHighlightTitles = function renderHighlightTitles(keyword, option, titleRender) {
|
375
272
|
// 如果 titleRender 返回 `true`,则使用默认 title
|
376
273
|
var title = titleRender ? titleRender(option, keyword) : true;
|
377
274
|
if (title !== true) return title;
|
@@ -407,5 +304,4 @@ var renderHighlightTitle = function renderHighlightTitle(keyword, option, titleR
|
|
407
304
|
}).reverse());
|
408
305
|
};
|
409
306
|
|
410
|
-
export { Cascader
|
411
|
-
//# sourceMappingURL=Cascader.js.map
|
307
|
+
export { Cascader };
|
@@ -0,0 +1,146 @@
|
|
1
|
+
/** @LICENSE
|
2
|
+
* @hi-ui/cascader
|
3
|
+
* https://github.com/XiaoMi/hiui/tree/master/packages/ui/cascader#readme
|
4
|
+
*
|
5
|
+
* Copyright (c) HiUI <mi-hiui@xiaomi.com>.
|
6
|
+
*
|
7
|
+
* This source code is licensed under the MIT license found in the
|
8
|
+
* LICENSE file in the root directory of this source tree.
|
9
|
+
*/
|
10
|
+
import { __rest } from 'tslib';
|
11
|
+
import React, { forwardRef } from 'react';
|
12
|
+
import { getPrefixCls, cx } from '@hi-ui/classname';
|
13
|
+
import { __DEV__ } from '@hi-ui/env';
|
14
|
+
import { defaultLoadingIcon, defaultSuffixIcon, defaultLeafIcon } from './icons/index.js';
|
15
|
+
import { getItemEventData, checkCanLoadChildren } from './utils/index.js';
|
16
|
+
import { useCascaderContext } from './context.js';
|
17
|
+
import { getTopDownAncestors } from '@hi-ui/tree-utils';
|
18
|
+
import { isArrayNonEmpty } from '@hi-ui/type-assertion';
|
19
|
+
var menuListPrefix = getPrefixCls('cascader-menu-list');
|
20
|
+
var CascaderMenuList = /*#__PURE__*/forwardRef(function (_a, ref) {
|
21
|
+
var _a$prefixCls = _a.prefixCls,
|
22
|
+
prefixCls = _a$prefixCls === void 0 ? menuListPrefix : _a$prefixCls,
|
23
|
+
className = _a.className,
|
24
|
+
rest = __rest(_a, ["prefixCls", "className"]);
|
25
|
+
|
26
|
+
var _useCascaderContext = useCascaderContext(),
|
27
|
+
flatted = _useCascaderContext.flatted,
|
28
|
+
menuList = _useCascaderContext.menuList;
|
29
|
+
|
30
|
+
var cls = cx(prefixCls, className, flatted && prefixCls + "--flatted");
|
31
|
+
return /*#__PURE__*/React.createElement("div", Object.assign({
|
32
|
+
ref: ref,
|
33
|
+
className: cls
|
34
|
+
}, rest), menuList.map(function (menu, menuIndex) {
|
35
|
+
// @ts-ignore
|
36
|
+
return isArrayNonEmpty(menu) ? /*#__PURE__*/React.createElement(CascaderMenu, {
|
37
|
+
key: menuIndex,
|
38
|
+
data: menu
|
39
|
+
}) : null;
|
40
|
+
}));
|
41
|
+
});
|
42
|
+
|
43
|
+
if (__DEV__) {
|
44
|
+
CascaderMenuList.displayName = 'CascaderMenuList';
|
45
|
+
}
|
46
|
+
|
47
|
+
var menuPrefix = getPrefixCls('cascader-menu');
|
48
|
+
|
49
|
+
var CascaderMenu = function CascaderMenu(_ref) {
|
50
|
+
var _ref$prefixCls = _ref.prefixCls,
|
51
|
+
prefixCls = _ref$prefixCls === void 0 ? menuPrefix : _ref$prefixCls,
|
52
|
+
_ref$role = _ref.role,
|
53
|
+
role = _ref$role === void 0 ? 'menu' : _ref$role,
|
54
|
+
className = _ref.className,
|
55
|
+
menu = _ref.data;
|
56
|
+
|
57
|
+
var _useCascaderContext2 = useCascaderContext(),
|
58
|
+
flatted = _useCascaderContext2.flatted,
|
59
|
+
disabledContext = _useCascaderContext2.disabled,
|
60
|
+
expandTrigger = _useCascaderContext2.expandTrigger,
|
61
|
+
onItemClick = _useCascaderContext2.onItemClick,
|
62
|
+
onItemHover = _useCascaderContext2.onItemHover,
|
63
|
+
titleRender = _useCascaderContext2.titleRender,
|
64
|
+
onLoadChildren = _useCascaderContext2.onLoadChildren,
|
65
|
+
getItemRequiredProps = _useCascaderContext2.getItemRequiredProps;
|
66
|
+
|
67
|
+
var cls = cx(prefixCls, className);
|
68
|
+
return /*#__PURE__*/React.createElement("ul", {
|
69
|
+
className: cls,
|
70
|
+
role: role
|
71
|
+
}, menu.map(function (option) {
|
72
|
+
var eventOption = getItemEventData(option, getItemRequiredProps(option));
|
73
|
+
var selected = eventOption.selected,
|
74
|
+
loading = eventOption.loading,
|
75
|
+
active = eventOption.active;
|
76
|
+
var disabled = disabledContext || option.disabled;
|
77
|
+
var optionCls = cx(prefixCls + "-option", active && prefixCls + "-option--active", loading && prefixCls + "-option--loading", disabled && prefixCls + "-option--disabled", selected && prefixCls + "-option--selected");
|
78
|
+
return /*#__PURE__*/React.createElement("li", {
|
79
|
+
key: option.id,
|
80
|
+
role: "menu-item",
|
81
|
+
className: prefixCls + "-item"
|
82
|
+
}, /*#__PURE__*/React.createElement("div", {
|
83
|
+
className: optionCls,
|
84
|
+
onClick: function onClick() {
|
85
|
+
if (disabled) return;
|
86
|
+
onItemClick(eventOption);
|
87
|
+
},
|
88
|
+
onMouseEnter: function onMouseEnter() {
|
89
|
+
if (disabled) return;
|
90
|
+
|
91
|
+
if (expandTrigger === 'hover') {
|
92
|
+
onItemHover(eventOption);
|
93
|
+
}
|
94
|
+
}
|
95
|
+
}, flatted ? renderFlattedTitle(eventOption, titleRender) : /*#__PURE__*/React.createElement(React.Fragment, null, renderDefaultTitle(eventOption, titleRender), renderSuffix(prefixCls, option, loading, onLoadChildren))));
|
96
|
+
}));
|
97
|
+
};
|
98
|
+
/**
|
99
|
+
* 渲染菜单子项的展开提示图标
|
100
|
+
*/
|
101
|
+
|
102
|
+
|
103
|
+
var renderSuffix = function renderSuffix(prefixCls, item, loading, onLoadChildren) {
|
104
|
+
if (loading) {
|
105
|
+
return /*#__PURE__*/React.createElement("span", {
|
106
|
+
className: cx(prefixCls + "-switcher", prefixCls + "-switcher--loading")
|
107
|
+
}, defaultLoadingIcon);
|
108
|
+
}
|
109
|
+
|
110
|
+
var canLoadChildren = checkCanLoadChildren(item, onLoadChildren);
|
111
|
+
|
112
|
+
if (canLoadChildren) {
|
113
|
+
return /*#__PURE__*/React.createElement("span", {
|
114
|
+
className: cx(prefixCls + "-switcher", prefixCls + "-switcher--arrow")
|
115
|
+
}, defaultSuffixIcon);
|
116
|
+
}
|
117
|
+
|
118
|
+
return /*#__PURE__*/React.createElement("span", {
|
119
|
+
className: cx(prefixCls + "-switcher", prefixCls + "-switcher--noop")
|
120
|
+
}, defaultLeafIcon);
|
121
|
+
};
|
122
|
+
|
123
|
+
var renderFlattedTitle = function renderFlattedTitle(option, titleRender) {
|
124
|
+
// 如果 titleRender 返回 `true`,则使用默认 title
|
125
|
+
var title = titleRender ? titleRender(option) : true;
|
126
|
+
if (title !== true) return title;
|
127
|
+
return /*#__PURE__*/React.createElement("span", {
|
128
|
+
className: "title__text title__text--cols"
|
129
|
+
}, getTopDownAncestors(option).map(function (item) {
|
130
|
+
return /*#__PURE__*/React.createElement("span", {
|
131
|
+
key: item.id,
|
132
|
+
className: "title__text--col"
|
133
|
+
}, item.title);
|
134
|
+
}));
|
135
|
+
};
|
136
|
+
|
137
|
+
var renderDefaultTitle = function renderDefaultTitle(option, titleRender) {
|
138
|
+
// 如果 titleRender 返回 `true`,则使用默认 title
|
139
|
+
var title = titleRender ? titleRender(option) : true;
|
140
|
+
if (title !== true) return title;
|
141
|
+
return /*#__PURE__*/React.createElement("span", {
|
142
|
+
className: "title__text"
|
143
|
+
}, option.title);
|
144
|
+
};
|
145
|
+
|
146
|
+
export { CascaderMenu, CascaderMenuList };
|
package/lib/esm/context.js
CHANGED
@@ -2,7 +2,7 @@
|
|
2
2
|
* @hi-ui/cascader
|
3
3
|
* https://github.com/XiaoMi/hiui/tree/master/packages/ui/cascader#readme
|
4
4
|
*
|
5
|
-
* Copyright (c)
|
5
|
+
* Copyright (c) HiUI <mi-hiui@xiaomi.com>.
|
6
6
|
*
|
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.
|
@@ -22,4 +22,3 @@ var useCascaderContext = function useCascaderContext() {
|
|
22
22
|
};
|
23
23
|
|
24
24
|
export { CascaderProvider, useCascaderContext };
|
25
|
-
//# sourceMappingURL=context.js.map
|
@@ -2,7 +2,7 @@
|
|
2
2
|
* @hi-ui/cascader
|
3
3
|
* https://github.com/XiaoMi/hiui/tree/master/packages/ui/cascader#readme
|
4
4
|
*
|
5
|
-
* Copyright (c)
|
5
|
+
* Copyright (c) HiUI <mi-hiui@xiaomi.com>.
|
6
6
|
*
|
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.
|
@@ -119,4 +119,3 @@ var useAsyncSwitch = function useAsyncSwitch(setCascaderData, onExpand, onLoadCh
|
|
119
119
|
};
|
120
120
|
|
121
121
|
export { useAsyncSwitch };
|
122
|
-
//# sourceMappingURL=use-async-switch.js.map
|
@@ -2,7 +2,7 @@
|
|
2
2
|
* @hi-ui/cascader
|
3
3
|
* https://github.com/XiaoMi/hiui/tree/master/packages/ui/cascader#readme
|
4
4
|
*
|
5
|
-
* Copyright (c)
|
5
|
+
* Copyright (c) HiUI <mi-hiui@xiaomi.com>.
|
6
6
|
*
|
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.
|
@@ -12,7 +12,7 @@ import { useState, useEffect } from 'react';
|
|
12
12
|
* @hi-ui/use-cache
|
13
13
|
* https://github.com/XiaoMi/hiui/tree/master/packages/hooks/use-cache#readme
|
14
14
|
*
|
15
|
-
* Copyright (c)
|
15
|
+
* Copyright (c) HiUI <mi-hiui@xiaomi.com>.
|
16
16
|
*
|
17
17
|
* This source code is licensed under the MIT license found in the
|
18
18
|
* LICENSE file in the root directory of this source tree.
|
@@ -34,4 +34,3 @@ var useCache = function useCache(data) {
|
|
34
34
|
};
|
35
35
|
|
36
36
|
export { useCache };
|
37
|
-
//# sourceMappingURL=index.js.map
|
@@ -2,7 +2,7 @@
|
|
2
2
|
* @hi-ui/cascader
|
3
3
|
* https://github.com/XiaoMi/hiui/tree/master/packages/ui/cascader#readme
|
4
4
|
*
|
5
|
-
* Copyright (c)
|
5
|
+
* Copyright (c) HiUI <mi-hiui@xiaomi.com>.
|
6
6
|
*
|
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.
|
@@ -55,4 +55,3 @@ var useSelect = function useSelect(disabled, onSelect, changeOnSelect, onLoadChi
|
|
55
55
|
};
|
56
56
|
|
57
57
|
export { useSelect };
|
58
|
-
//# sourceMappingURL=use-select.js.map
|
package/lib/esm/icons/index.js
CHANGED
@@ -2,7 +2,7 @@
|
|
2
2
|
* @hi-ui/cascader
|
3
3
|
* https://github.com/XiaoMi/hiui/tree/master/packages/ui/cascader#readme
|
4
4
|
*
|
5
|
-
* Copyright (c)
|
5
|
+
* Copyright (c) HiUI <mi-hiui@xiaomi.com>.
|
6
6
|
*
|
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.
|
@@ -19,4 +19,3 @@ var defaultLeafIcon = /*#__PURE__*/React.createElement("span", {
|
|
19
19
|
});
|
20
20
|
var defaultLoadingIcon = /*#__PURE__*/React.createElement(Spinner, null);
|
21
21
|
export { defaultLeafIcon, defaultLoadingIcon, defaultSuffixIcon };
|
22
|
-
//# sourceMappingURL=index.js.map
|
package/lib/esm/index.js
CHANGED
@@ -2,11 +2,10 @@
|
|
2
2
|
* @hi-ui/cascader
|
3
3
|
* https://github.com/XiaoMi/hiui/tree/master/packages/ui/cascader#readme
|
4
4
|
*
|
5
|
-
* Copyright (c)
|
5
|
+
* Copyright (c) HiUI <mi-hiui@xiaomi.com>.
|
6
6
|
*
|
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
10
|
import './styles/index.scss.js';
|
11
|
-
export { Cascader,
|
12
|
-
//# sourceMappingURL=index.js.map
|
11
|
+
export { Cascader, Cascader as default } from './Cascader.js';
|