@hi-ui/cascader 4.0.0-beta.4 → 4.0.0-beta.42
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 +27 -148
- package/lib/cjs/CascaderMenuList.js +172 -0
- package/lib/cjs/context.js +0 -1
- package/lib/cjs/hooks/use-async-switch.js +4 -5
- package/lib/cjs/hooks/use-cache/lib/esm/index.js +0 -1
- package/lib/cjs/hooks/use-select.js +0 -1
- package/lib/cjs/icons/index.js +3 -4
- package/lib/cjs/index.js +0 -3
- package/lib/cjs/styles/index.scss.js +2 -3
- package/lib/cjs/use-cascader.js +2 -2
- package/lib/cjs/utils/index.js +0 -1
- package/lib/esm/Cascader.js +17 -137
- package/lib/esm/CascaderMenuList.js +146 -0
- package/lib/esm/context.js +0 -1
- package/lib/esm/hooks/use-async-switch.js +0 -1
- package/lib/esm/hooks/use-cache/lib/esm/index.js +0 -1
- package/lib/esm/hooks/use-select.js +0 -1
- package/lib/esm/icons/index.js +0 -1
- package/lib/esm/index.js +1 -2
- package/lib/esm/styles/index.scss.js +3 -5
- package/lib/esm/use-cascader.js +2 -2
- package/lib/esm/utils/index.js +0 -1
- package/lib/types/Cascader.d.ts +4 -14
- 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 +7 -7
- package/package.json +21 -20
- 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
package/lib/cjs/Cascader.js
CHANGED
@@ -31,8 +31,6 @@ var input = require('@hi-ui/input');
|
|
31
31
|
|
32
32
|
var icons = require('@hi-ui/icons');
|
33
33
|
|
34
|
-
var index$2 = require('./icons/index.js');
|
35
|
-
|
36
34
|
var index$1 = require('./utils/index.js');
|
37
35
|
|
38
36
|
var context = require('./context.js');
|
@@ -45,12 +43,16 @@ var picker = require('@hi-ui/picker');
|
|
45
43
|
|
46
44
|
var useSearchMode = require('@hi-ui/use-search-mode');
|
47
45
|
|
48
|
-
var
|
46
|
+
var arrayUtils = require('@hi-ui/array-utils');
|
49
47
|
|
50
48
|
var index = require('./hooks/use-cache/lib/esm/index.js');
|
51
49
|
|
52
50
|
var localeContext = require('@hi-ui/locale-context');
|
53
51
|
|
52
|
+
var funcUtils = require('@hi-ui/func-utils');
|
53
|
+
|
54
|
+
var CascaderMenuList = require('./CascaderMenuList.js');
|
55
|
+
|
54
56
|
function _interopDefaultLegacy(e) {
|
55
57
|
return e && _typeof(e) === 'object' && 'default' in e ? e : {
|
56
58
|
'default': e
|
@@ -88,19 +90,22 @@ var Cascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
88
90
|
invalid = props.invalid,
|
89
91
|
filterOption = props.filterOption,
|
90
92
|
searchableProp = props.searchable,
|
93
|
+
onSearchProp = props.onSearch,
|
91
94
|
titleRender = props.render,
|
92
95
|
overlayClassName = props.overlayClassName,
|
93
96
|
_props$data = props.data,
|
94
97
|
data = _props$data === void 0 ? NOOP_ARRAY : _props$data,
|
98
|
+
visible = props.visible,
|
95
99
|
onOpen = props.onOpen,
|
96
100
|
onClose = props.onClose,
|
97
|
-
rest = tslib.__rest(props, ["prefixCls", "className", "placeholder", "disabled", "clearable", "type", "fieldNames", "expandTrigger", "displayRender", "onSelect", "onLoadChildren", "appearance", "invalid", "filterOption", "searchable", "render", "overlayClassName", "data", "onOpen", "onClose"]);
|
101
|
+
rest = tslib.__rest(props, ["prefixCls", "className", "placeholder", "disabled", "clearable", "type", "fieldNames", "expandTrigger", "displayRender", "onSelect", "onLoadChildren", "appearance", "invalid", "filterOption", "searchable", "onSearch", "render", "overlayClassName", "data", "visible", "onOpen", "onClose"]);
|
98
102
|
|
99
103
|
var i18n = localeContext.useLocaleContext();
|
100
104
|
var placeholder = typeAssertion.isUndef(placeholderProp) ? i18n.get('cascader.placeholder') : placeholderProp;
|
101
105
|
var flatted = type === 'flatted';
|
102
106
|
|
103
107
|
var _useUncontrolledToggl = useToggle.useUncontrolledToggle({
|
108
|
+
visible: visible,
|
104
109
|
disabled: disabled,
|
105
110
|
onOpen: onOpen,
|
106
111
|
onClose: onClose
|
@@ -149,9 +154,12 @@ var Cascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
149
154
|
data: cascaderData,
|
150
155
|
flattedData: flattedData,
|
151
156
|
enabled: searchableProp,
|
152
|
-
exclude: function exclude(
|
153
|
-
return
|
154
|
-
}
|
157
|
+
exclude: function exclude(node) {
|
158
|
+
return node.disabled;
|
159
|
+
} // exclude: (option: FlattedCascaderDataItem) => {
|
160
|
+
// return checkCanLoadChildren(option, onLoadChildren)
|
161
|
+
// },
|
162
|
+
|
155
163
|
});
|
156
164
|
|
157
165
|
var _useSearchMode = useSearchMode.useSearchMode({
|
@@ -184,7 +192,7 @@ var Cascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
184
192
|
|
185
193
|
return acc;
|
186
194
|
}, []);
|
187
|
-
return /*#__PURE__*/React__default[
|
195
|
+
return /*#__PURE__*/React__default["default"].createElement("span", {
|
188
196
|
className: "title__text"
|
189
197
|
}, mergedTitle);
|
190
198
|
};
|
@@ -228,19 +236,19 @@ var Cascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
228
236
|
var mergedData = React.useMemo(function () {
|
229
237
|
if (selectedItem) {
|
230
238
|
var nextData = [selectedItem].concat(flattedData);
|
231
|
-
return
|
239
|
+
return arrayUtils.uniqBy(nextData, 'id');
|
232
240
|
}
|
233
241
|
|
234
242
|
return flattedData;
|
235
243
|
}, [selectedItem, flattedData]);
|
236
244
|
var cls = classname.cx(prefixCls, className, prefixCls + "--" + (menuVisible ? 'open' : 'closed'));
|
237
|
-
return /*#__PURE__*/React__default[
|
245
|
+
return /*#__PURE__*/React__default["default"].createElement(context.CascaderProvider, {
|
238
246
|
value: Object.assign(Object.assign({}, context$1), {
|
239
247
|
expandTrigger: expandTrigger,
|
240
248
|
titleRender: proxyTitleRender,
|
241
249
|
menuList: showData
|
242
250
|
})
|
243
|
-
}, /*#__PURE__*/React__default[
|
251
|
+
}, /*#__PURE__*/React__default["default"].createElement(picker.Picker, Object.assign({
|
244
252
|
ref: ref,
|
245
253
|
className: cls,
|
246
254
|
overlayClassName: classname.cx(prefixCls + "__popper", overlayClassName)
|
@@ -254,12 +262,12 @@ var Cascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
254
262
|
onOpen: menuVisibleAction.on,
|
255
263
|
onClose: menuVisibleAction.off,
|
256
264
|
searchable: searchable,
|
257
|
-
onSearch: onSearch,
|
258
|
-
trigger: /*#__PURE__*/React__default[
|
265
|
+
onSearch: funcUtils.callAllFuncs(onSearchProp, onSearch),
|
266
|
+
trigger: /*#__PURE__*/React__default["default"].createElement(input.MockInput, {
|
259
267
|
clearable: clearable,
|
260
268
|
placeholder: placeholder,
|
261
269
|
displayRender: displayRender,
|
262
|
-
suffix: menuVisible ? /*#__PURE__*/React__default[
|
270
|
+
suffix: menuVisible ? /*#__PURE__*/React__default["default"].createElement(icons.UpOutlined, null) : /*#__PURE__*/React__default["default"].createElement(icons.DownOutlined, null),
|
263
271
|
focused: menuVisible,
|
264
272
|
value: value[value.length - 1],
|
265
273
|
onChange: function onChange() {
|
@@ -269,139 +277,13 @@ var Cascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
269
277
|
invalid: invalid,
|
270
278
|
appearance: appearance
|
271
279
|
})
|
272
|
-
}), typeAssertion.isArrayNonEmpty(showData) ? /*#__PURE__*/React__default[
|
280
|
+
}), typeAssertion.isArrayNonEmpty(showData) ? /*#__PURE__*/React__default["default"].createElement(CascaderMenuList.CascaderMenuList, null) : null));
|
273
281
|
});
|
274
282
|
|
275
283
|
if (env.__DEV__) {
|
276
284
|
Cascader.displayName = 'Cascader';
|
277
285
|
}
|
278
286
|
|
279
|
-
var menuListPrefix = classname.getPrefixCls('cascader-menu-list');
|
280
|
-
var CascaderMenuList = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
281
|
-
var _a$prefixCls = _a.prefixCls,
|
282
|
-
prefixCls = _a$prefixCls === void 0 ? menuListPrefix : _a$prefixCls,
|
283
|
-
className = _a.className,
|
284
|
-
rest = tslib.__rest(_a, ["prefixCls", "className"]);
|
285
|
-
|
286
|
-
var _useCascaderContext = context.useCascaderContext(),
|
287
|
-
flatted = _useCascaderContext.flatted,
|
288
|
-
menuList = _useCascaderContext.menuList;
|
289
|
-
|
290
|
-
var cls = classname.cx(prefixCls, className, flatted && prefixCls + "--flatted");
|
291
|
-
return /*#__PURE__*/React__default['default'].createElement("div", Object.assign({
|
292
|
-
ref: ref,
|
293
|
-
className: cls
|
294
|
-
}, rest), menuList.map(function (menu, menuIndex) {
|
295
|
-
// @ts-ignore
|
296
|
-
return typeAssertion.isArrayNonEmpty(menu) ? /*#__PURE__*/React__default['default'].createElement(CascaderMenu, {
|
297
|
-
key: menuIndex,
|
298
|
-
data: menu
|
299
|
-
}) : null;
|
300
|
-
}));
|
301
|
-
});
|
302
|
-
|
303
|
-
if (env.__DEV__) {
|
304
|
-
CascaderMenuList.displayName = 'CascaderMenuList';
|
305
|
-
}
|
306
|
-
|
307
|
-
var menuPrefix = classname.getPrefixCls('cascader-menu');
|
308
|
-
|
309
|
-
var CascaderMenu = function CascaderMenu(_ref2) {
|
310
|
-
var _ref2$prefixCls = _ref2.prefixCls,
|
311
|
-
prefixCls = _ref2$prefixCls === void 0 ? menuPrefix : _ref2$prefixCls,
|
312
|
-
_ref2$role = _ref2.role,
|
313
|
-
role = _ref2$role === void 0 ? 'menu' : _ref2$role,
|
314
|
-
className = _ref2.className,
|
315
|
-
menu = _ref2.data;
|
316
|
-
|
317
|
-
var _useCascaderContext2 = context.useCascaderContext(),
|
318
|
-
flatted = _useCascaderContext2.flatted,
|
319
|
-
disabledContext = _useCascaderContext2.disabled,
|
320
|
-
expandTrigger = _useCascaderContext2.expandTrigger,
|
321
|
-
onItemClick = _useCascaderContext2.onItemClick,
|
322
|
-
onItemHover = _useCascaderContext2.onItemHover,
|
323
|
-
titleRender = _useCascaderContext2.titleRender,
|
324
|
-
onLoadChildren = _useCascaderContext2.onLoadChildren,
|
325
|
-
getItemRequiredProps = _useCascaderContext2.getItemRequiredProps;
|
326
|
-
|
327
|
-
var cls = classname.cx(prefixCls, className);
|
328
|
-
return /*#__PURE__*/React__default['default'].createElement("ul", {
|
329
|
-
className: cls,
|
330
|
-
role: role
|
331
|
-
}, menu.map(function (option) {
|
332
|
-
var eventOption = index$1.getItemEventData(option, getItemRequiredProps(option));
|
333
|
-
var selected = eventOption.selected,
|
334
|
-
loading = eventOption.loading;
|
335
|
-
var disabled = disabledContext || option.disabled;
|
336
|
-
var optionCls = classname.cx(prefixCls + "-option", loading && prefixCls + "-option--loading", disabled && prefixCls + "-option--disabled", selected && prefixCls + "-option--selected");
|
337
|
-
return /*#__PURE__*/React__default['default'].createElement("li", {
|
338
|
-
key: option.id,
|
339
|
-
role: "menu-item",
|
340
|
-
className: prefixCls + "-item"
|
341
|
-
}, /*#__PURE__*/React__default['default'].createElement("div", {
|
342
|
-
className: optionCls,
|
343
|
-
onClick: function onClick() {
|
344
|
-
if (disabled) return;
|
345
|
-
onItemClick(eventOption);
|
346
|
-
},
|
347
|
-
onMouseEnter: function onMouseEnter() {
|
348
|
-
if (disabled) return;
|
349
|
-
|
350
|
-
if (expandTrigger === 'hover') {
|
351
|
-
onItemHover(eventOption);
|
352
|
-
}
|
353
|
-
}
|
354
|
-
}, flatted ? renderFlattedTitle(eventOption, titleRender) : /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, renderDefaultTitle(eventOption, titleRender), renderSuffix(prefixCls, option, loading, onLoadChildren))));
|
355
|
-
}));
|
356
|
-
};
|
357
|
-
/**
|
358
|
-
* 渲染菜单子项的展开提示图标
|
359
|
-
*/
|
360
|
-
|
361
|
-
|
362
|
-
var renderSuffix = function renderSuffix(prefixCls, item, loading, onLoadChildren) {
|
363
|
-
if (loading) {
|
364
|
-
return /*#__PURE__*/React__default['default'].createElement("span", {
|
365
|
-
className: classname.cx(prefixCls + "-switcher", prefixCls + "-switcher--loading")
|
366
|
-
}, index$2.defaultLoadingIcon);
|
367
|
-
}
|
368
|
-
|
369
|
-
var canLoadChildren = index$1.checkCanLoadChildren(item, onLoadChildren);
|
370
|
-
|
371
|
-
if (canLoadChildren) {
|
372
|
-
return /*#__PURE__*/React__default['default'].createElement("span", {
|
373
|
-
className: classname.cx(prefixCls + "-switcher", prefixCls + "-switcher--arrow")
|
374
|
-
}, index$2.defaultSuffixIcon);
|
375
|
-
}
|
376
|
-
|
377
|
-
return /*#__PURE__*/React__default['default'].createElement("span", {
|
378
|
-
className: classname.cx(prefixCls + "-switcher", prefixCls + "-switcher--noop")
|
379
|
-
}, index$2.defaultLeafIcon);
|
380
|
-
};
|
381
|
-
|
382
|
-
var renderFlattedTitle = function renderFlattedTitle(option, titleRender) {
|
383
|
-
// 如果 titleRender 返回 `true`,则使用默认 title
|
384
|
-
var title = titleRender ? titleRender(option) : true;
|
385
|
-
if (title !== true) return title;
|
386
|
-
return /*#__PURE__*/React__default['default'].createElement("span", {
|
387
|
-
className: "title__text title__text--cols"
|
388
|
-
}, treeUtils.getTopDownAncestors(option).map(function (item) {
|
389
|
-
return /*#__PURE__*/React__default['default'].createElement("span", {
|
390
|
-
key: item.id,
|
391
|
-
className: "title__text--col"
|
392
|
-
}, item.title);
|
393
|
-
}));
|
394
|
-
};
|
395
|
-
|
396
|
-
var renderDefaultTitle = function renderDefaultTitle(option, titleRender) {
|
397
|
-
// 如果 titleRender 返回 `true`,则使用默认 title
|
398
|
-
var title = titleRender ? titleRender(option) : true;
|
399
|
-
if (title !== true) return title;
|
400
|
-
return /*#__PURE__*/React__default['default'].createElement("span", {
|
401
|
-
className: "title__text"
|
402
|
-
}, option.title);
|
403
|
-
};
|
404
|
-
|
405
287
|
var renderHighlightTitle = function renderHighlightTitle(keyword, option, titleRender) {
|
406
288
|
// 如果 titleRender 返回 `true`,则使用默认 title
|
407
289
|
var title = titleRender ? titleRender(option, keyword) : true;
|
@@ -413,12 +295,12 @@ var renderHighlightTitle = function renderHighlightTitle(keyword, option, titleR
|
|
413
295
|
}
|
414
296
|
|
415
297
|
var found = false;
|
416
|
-
return /*#__PURE__*/React__default[
|
298
|
+
return /*#__PURE__*/React__default["default"].createElement("span", {
|
417
299
|
className: classname.cx("title__text", "title__text--cols")
|
418
300
|
}, treeUtils.getNodeAncestorsWithMe(option).map(function (item) {
|
419
301
|
var title = item.title,
|
420
302
|
id = item.id;
|
421
|
-
var raw = /*#__PURE__*/React__default[
|
303
|
+
var raw = /*#__PURE__*/React__default["default"].createElement("span", {
|
422
304
|
className: "title__text--col",
|
423
305
|
key: id
|
424
306
|
}, title);
|
@@ -429,16 +311,13 @@ var renderHighlightTitle = function renderHighlightTitle(keyword, option, titleR
|
|
429
311
|
found = true;
|
430
312
|
var beforeStr = title.substr(0, index);
|
431
313
|
var afterStr = title.substr(index + keyword.length);
|
432
|
-
return /*#__PURE__*/React__default[
|
314
|
+
return /*#__PURE__*/React__default["default"].createElement("span", {
|
433
315
|
key: id,
|
434
316
|
className: "title__text--col"
|
435
|
-
}, beforeStr, /*#__PURE__*/React__default[
|
317
|
+
}, beforeStr, /*#__PURE__*/React__default["default"].createElement("span", {
|
436
318
|
className: "title__text--matched"
|
437
319
|
}, keyword), afterStr);
|
438
320
|
}).reverse());
|
439
321
|
};
|
440
322
|
|
441
323
|
exports.Cascader = Cascader;
|
442
|
-
exports.CascaderMenu = CascaderMenu;
|
443
|
-
exports.CascaderMenuList = CascaderMenuList;
|
444
|
-
//# sourceMappingURL=Cascader.js.map
|
@@ -0,0 +1,172 @@
|
|
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
|
+
'use strict';
|
11
|
+
|
12
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
13
|
+
|
14
|
+
Object.defineProperty(exports, '__esModule', {
|
15
|
+
value: true
|
16
|
+
});
|
17
|
+
|
18
|
+
var tslib = require('tslib');
|
19
|
+
|
20
|
+
var React = require('react');
|
21
|
+
|
22
|
+
var classname = require('@hi-ui/classname');
|
23
|
+
|
24
|
+
var env = require('@hi-ui/env');
|
25
|
+
|
26
|
+
var index$1 = require('./icons/index.js');
|
27
|
+
|
28
|
+
var index = require('./utils/index.js');
|
29
|
+
|
30
|
+
var context = require('./context.js');
|
31
|
+
|
32
|
+
var treeUtils = require('@hi-ui/tree-utils');
|
33
|
+
|
34
|
+
var typeAssertion = require('@hi-ui/type-assertion');
|
35
|
+
|
36
|
+
function _interopDefaultLegacy(e) {
|
37
|
+
return e && _typeof(e) === 'object' && 'default' in e ? e : {
|
38
|
+
'default': e
|
39
|
+
};
|
40
|
+
}
|
41
|
+
|
42
|
+
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
43
|
+
|
44
|
+
var menuListPrefix = classname.getPrefixCls('cascader-menu-list');
|
45
|
+
var CascaderMenuList = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
46
|
+
var _a$prefixCls = _a.prefixCls,
|
47
|
+
prefixCls = _a$prefixCls === void 0 ? menuListPrefix : _a$prefixCls,
|
48
|
+
className = _a.className,
|
49
|
+
rest = tslib.__rest(_a, ["prefixCls", "className"]);
|
50
|
+
|
51
|
+
var _useCascaderContext = context.useCascaderContext(),
|
52
|
+
flatted = _useCascaderContext.flatted,
|
53
|
+
menuList = _useCascaderContext.menuList;
|
54
|
+
|
55
|
+
var cls = classname.cx(prefixCls, className, flatted && prefixCls + "--flatted");
|
56
|
+
return /*#__PURE__*/React__default["default"].createElement("div", Object.assign({
|
57
|
+
ref: ref,
|
58
|
+
className: cls
|
59
|
+
}, rest), menuList.map(function (menu, menuIndex) {
|
60
|
+
// @ts-ignore
|
61
|
+
return typeAssertion.isArrayNonEmpty(menu) ? /*#__PURE__*/React__default["default"].createElement(CascaderMenu, {
|
62
|
+
key: menuIndex,
|
63
|
+
data: menu
|
64
|
+
}) : null;
|
65
|
+
}));
|
66
|
+
});
|
67
|
+
|
68
|
+
if (env.__DEV__) {
|
69
|
+
CascaderMenuList.displayName = 'CascaderMenuList';
|
70
|
+
}
|
71
|
+
|
72
|
+
var menuPrefix = classname.getPrefixCls('cascader-menu');
|
73
|
+
|
74
|
+
var CascaderMenu = function CascaderMenu(_ref) {
|
75
|
+
var _ref$prefixCls = _ref.prefixCls,
|
76
|
+
prefixCls = _ref$prefixCls === void 0 ? menuPrefix : _ref$prefixCls,
|
77
|
+
_ref$role = _ref.role,
|
78
|
+
role = _ref$role === void 0 ? 'menu' : _ref$role,
|
79
|
+
className = _ref.className,
|
80
|
+
menu = _ref.data;
|
81
|
+
|
82
|
+
var _useCascaderContext2 = context.useCascaderContext(),
|
83
|
+
flatted = _useCascaderContext2.flatted,
|
84
|
+
disabledContext = _useCascaderContext2.disabled,
|
85
|
+
expandTrigger = _useCascaderContext2.expandTrigger,
|
86
|
+
onItemClick = _useCascaderContext2.onItemClick,
|
87
|
+
onItemHover = _useCascaderContext2.onItemHover,
|
88
|
+
titleRender = _useCascaderContext2.titleRender,
|
89
|
+
onLoadChildren = _useCascaderContext2.onLoadChildren,
|
90
|
+
getItemRequiredProps = _useCascaderContext2.getItemRequiredProps;
|
91
|
+
|
92
|
+
var cls = classname.cx(prefixCls, className);
|
93
|
+
return /*#__PURE__*/React__default["default"].createElement("ul", {
|
94
|
+
className: cls,
|
95
|
+
role: role
|
96
|
+
}, menu.map(function (option) {
|
97
|
+
var eventOption = index.getItemEventData(option, getItemRequiredProps(option));
|
98
|
+
var selected = eventOption.selected,
|
99
|
+
loading = eventOption.loading,
|
100
|
+
active = eventOption.active;
|
101
|
+
var disabled = disabledContext || option.disabled;
|
102
|
+
var optionCls = classname.cx(prefixCls + "-option", active && prefixCls + "-option--active", loading && prefixCls + "-option--loading", disabled && prefixCls + "-option--disabled", selected && prefixCls + "-option--selected");
|
103
|
+
return /*#__PURE__*/React__default["default"].createElement("li", {
|
104
|
+
key: option.id,
|
105
|
+
role: "menu-item",
|
106
|
+
className: prefixCls + "-item"
|
107
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
108
|
+
className: optionCls,
|
109
|
+
onClick: function onClick() {
|
110
|
+
if (disabled) return;
|
111
|
+
onItemClick(eventOption);
|
112
|
+
},
|
113
|
+
onMouseEnter: function onMouseEnter() {
|
114
|
+
if (disabled) return;
|
115
|
+
|
116
|
+
if (expandTrigger === 'hover') {
|
117
|
+
onItemHover(eventOption);
|
118
|
+
}
|
119
|
+
}
|
120
|
+
}, flatted ? renderFlattedTitle(eventOption, titleRender) : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, renderDefaultTitle(eventOption, titleRender), renderSuffix(prefixCls, option, loading, onLoadChildren))));
|
121
|
+
}));
|
122
|
+
};
|
123
|
+
/**
|
124
|
+
* 渲染菜单子项的展开提示图标
|
125
|
+
*/
|
126
|
+
|
127
|
+
|
128
|
+
var renderSuffix = function renderSuffix(prefixCls, item, loading, onLoadChildren) {
|
129
|
+
if (loading) {
|
130
|
+
return /*#__PURE__*/React__default["default"].createElement("span", {
|
131
|
+
className: classname.cx(prefixCls + "-switcher", prefixCls + "-switcher--loading")
|
132
|
+
}, index$1.defaultLoadingIcon);
|
133
|
+
}
|
134
|
+
|
135
|
+
var canLoadChildren = index.checkCanLoadChildren(item, onLoadChildren);
|
136
|
+
|
137
|
+
if (canLoadChildren) {
|
138
|
+
return /*#__PURE__*/React__default["default"].createElement("span", {
|
139
|
+
className: classname.cx(prefixCls + "-switcher", prefixCls + "-switcher--arrow")
|
140
|
+
}, index$1.defaultSuffixIcon);
|
141
|
+
}
|
142
|
+
|
143
|
+
return /*#__PURE__*/React__default["default"].createElement("span", {
|
144
|
+
className: classname.cx(prefixCls + "-switcher", prefixCls + "-switcher--noop")
|
145
|
+
}, index$1.defaultLeafIcon);
|
146
|
+
};
|
147
|
+
|
148
|
+
var renderFlattedTitle = function renderFlattedTitle(option, titleRender) {
|
149
|
+
// 如果 titleRender 返回 `true`,则使用默认 title
|
150
|
+
var title = titleRender ? titleRender(option) : true;
|
151
|
+
if (title !== true) return title;
|
152
|
+
return /*#__PURE__*/React__default["default"].createElement("span", {
|
153
|
+
className: "title__text title__text--cols"
|
154
|
+
}, treeUtils.getTopDownAncestors(option).map(function (item) {
|
155
|
+
return /*#__PURE__*/React__default["default"].createElement("span", {
|
156
|
+
key: item.id,
|
157
|
+
className: "title__text--col"
|
158
|
+
}, item.title);
|
159
|
+
}));
|
160
|
+
};
|
161
|
+
|
162
|
+
var renderDefaultTitle = function renderDefaultTitle(option, titleRender) {
|
163
|
+
// 如果 titleRender 返回 `true`,则使用默认 title
|
164
|
+
var title = titleRender ? titleRender(option) : true;
|
165
|
+
if (title !== true) return title;
|
166
|
+
return /*#__PURE__*/React__default["default"].createElement("span", {
|
167
|
+
className: "title__text"
|
168
|
+
}, option.title);
|
169
|
+
};
|
170
|
+
|
171
|
+
exports.CascaderMenu = CascaderMenu;
|
172
|
+
exports.CascaderMenuList = CascaderMenuList;
|
package/lib/cjs/context.js
CHANGED
@@ -39,9 +39,9 @@ var useAsyncSwitch = function useAsyncSwitch(setCascaderData, onExpand, onLoadCh
|
|
39
39
|
var onLoadChildrenLatest = useLatest.useLatestCallback(onLoadChildren); // 加载节点
|
40
40
|
|
41
41
|
var loadChildren = React.useCallback(function (node) {
|
42
|
-
return tslib.__awaiter(void 0, void 0, void 0, /*#__PURE__*/_regeneratorRuntime__default[
|
42
|
+
return tslib.__awaiter(void 0, void 0, void 0, /*#__PURE__*/_regeneratorRuntime__default["default"].mark(function _callee() {
|
43
43
|
var childrenNodes;
|
44
|
-
return _regeneratorRuntime__default[
|
44
|
+
return _regeneratorRuntime__default["default"].wrap(function _callee$(_context) {
|
45
45
|
while (1) {
|
46
46
|
switch (_context.prev = _context.next) {
|
47
47
|
case 0:
|
@@ -82,9 +82,9 @@ var useAsyncSwitch = function useAsyncSwitch(setCascaderData, onExpand, onLoadCh
|
|
82
82
|
onlyExpand = false;
|
83
83
|
}
|
84
84
|
|
85
|
-
return tslib.__awaiter(void 0, void 0, void 0, /*#__PURE__*/_regeneratorRuntime__default[
|
85
|
+
return tslib.__awaiter(void 0, void 0, void 0, /*#__PURE__*/_regeneratorRuntime__default["default"].mark(function _callee2() {
|
86
86
|
var id, children, isLeaf;
|
87
|
-
return _regeneratorRuntime__default[
|
87
|
+
return _regeneratorRuntime__default["default"].wrap(function _callee2$(_context2) {
|
88
88
|
while (1) {
|
89
89
|
switch (_context2.prev = _context2.next) {
|
90
90
|
case 0:
|
@@ -140,4 +140,3 @@ var useAsyncSwitch = function useAsyncSwitch(setCascaderData, onExpand, onLoadCh
|
|
140
140
|
};
|
141
141
|
|
142
142
|
exports.useAsyncSwitch = useAsyncSwitch;
|
143
|
-
//# sourceMappingURL=use-async-switch.js.map
|
package/lib/cjs/icons/index.js
CHANGED
@@ -29,15 +29,14 @@ function _interopDefaultLegacy(e) {
|
|
29
29
|
|
30
30
|
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
31
31
|
|
32
|
-
var defaultSuffixIcon = /*#__PURE__*/React__default[
|
33
|
-
var defaultLeafIcon = /*#__PURE__*/React__default[
|
32
|
+
var defaultSuffixIcon = /*#__PURE__*/React__default["default"].createElement(icons.DownOutlined, null);
|
33
|
+
var defaultLeafIcon = /*#__PURE__*/React__default["default"].createElement("span", {
|
34
34
|
style: {
|
35
35
|
display: 'inline-block',
|
36
36
|
width: 16
|
37
37
|
}
|
38
38
|
});
|
39
|
-
var defaultLoadingIcon = /*#__PURE__*/React__default[
|
39
|
+
var defaultLoadingIcon = /*#__PURE__*/React__default["default"].createElement(spinner.Spinner, null);
|
40
40
|
exports.defaultLeafIcon = defaultLeafIcon;
|
41
41
|
exports.defaultLoadingIcon = defaultLoadingIcon;
|
42
42
|
exports.defaultSuffixIcon = defaultSuffixIcon;
|
43
|
-
//# sourceMappingURL=index.js.map
|
package/lib/cjs/index.js
CHANGED
@@ -18,7 +18,4 @@ require('./styles/index.scss.js');
|
|
18
18
|
var Cascader = require('./Cascader.js');
|
19
19
|
|
20
20
|
exports.Cascader = Cascader.Cascader;
|
21
|
-
exports.CascaderMenu = Cascader.CascaderMenu;
|
22
|
-
exports.CascaderMenuList = Cascader.CascaderMenuList;
|
23
21
|
exports["default"] = Cascader.Cascader;
|
24
|
-
//# sourceMappingURL=index.js.map
|
@@ -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
@@ -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