@hi-ui/check-cascader 5.0.0-experimental.1 → 5.0.0-experimental.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (11) hide show
  1. package/CHANGELOG.md +24 -0
  2. package/lib/cjs/CheckCascader.js +41 -3
  3. package/lib/cjs/CheckCascaderMenu.js +11 -5
  4. package/lib/cjs/CheckCascaderMenuList.js +11 -5
  5. package/lib/esm/CheckCascader.js +41 -3
  6. package/lib/esm/CheckCascaderMenu.js +11 -5
  7. package/lib/esm/CheckCascaderMenuList.js +11 -5
  8. package/lib/types/CheckCascader.d.ts +7 -2
  9. package/lib/types/CheckCascaderMenuList.d.ts +8 -0
  10. package/lib/types/context.d.ts +2 -0
  11. package/package.json +13 -12
package/CHANGELOG.md CHANGED
@@ -1,5 +1,29 @@
1
1
  # @hi-ui/check-cascader
2
2
 
3
+ ## 5.0.0-experimental.2
4
+
5
+ ### Minor Changes
6
+
7
+ - 59cef699f: feat: 组件语义化样式改造，增加 styles 和 classNames 属性 (5.0)
8
+
9
+ ### Patch Changes
10
+
11
+ - eb17c4697: style: 修复 UI/样式问题 (5.0)
12
+ - Updated dependencies [7f204c892]
13
+ - Updated dependencies [eb17c4697]
14
+ - Updated dependencies [eb17c4697]
15
+ - Updated dependencies [c407744fe]
16
+ - Updated dependencies [59cef699f]
17
+ - @hi-ui/icons@5.0.0-experimental.1
18
+ - @hi-ui/core@5.0.0-experimental.1
19
+ - @hi-ui/checkbox@5.0.0-experimental.1
20
+ - @hi-ui/input@5.0.0-experimental.2
21
+ - @hi-ui/picker@5.0.0-experimental.2
22
+ - @hi-ui/popper@5.0.0-experimental.1
23
+ - @hi-ui/tag-input@5.0.0-experimental.2
24
+ - @hi-ui/use-merge-semantic@5.0.0-experimental.0
25
+ - @hi-ui/spinner@5.0.0-experimental.1
26
+
3
27
  ## 5.0.0-experimental.1
4
28
 
5
29
  ### Patch Changes
package/lib/cjs/CheckCascader.js CHANGED
@@ -23,6 +23,7 @@ var icons = require('@hi-ui/icons');
23
23
  var index = require('./hooks/use-cache/lib/esm/index.js');
24
24
  var picker = require('@hi-ui/picker');
25
25
  var tagInput = require('@hi-ui/tag-input');
26
+ var useMergeSemantic = require('@hi-ui/use-merge-semantic');
26
27
  var CheckCascaderMenuList = require('./CheckCascaderMenuList.js');
27
28
  var useSearchMode = require('@hi-ui/use-search-mode');
28
29
  var index$1 = require('./utils/index.js');
@@ -100,11 +101,31 @@ var CheckCascader = /*#__PURE__*/React.forwardRef(function (_a, ref) {
100
101
  _a$showIndicator = _a.showIndicator,
101
102
  showIndicator = _a$showIndicator === void 0 ? true : _a$showIndicator,
102
103
  renderExtraHeader = _a.renderExtraHeader,
103
- rest = tslib.__rest(_a, ["prefixCls", "className", "defaultValue", "value", "onChange", "data", "placeholder", "clearable", "onClear", "onSelect", "expandTrigger", "disabled", "emptyContent", "changeOnSelect", "render", "displayRender", "checkCascaded", "searchPlaceholder", "onLoadChildren", "appearance", "invalid", "filterOption", "searchable", "keyword", "onSearch", "clearSearchOnClosed", "overlayClassName", "type", "flattedSearchResult", "checkedMode", "visible", "onOpen", "onClose", "tagInputProps", "size", "prefix", "suffix", "renderExtraFooter", "dropdownColumnRender", "customRender", "fieldNames", "label", "showOnlyShowChecked", "virtual", "showCheckAll", "showIndicator", "renderExtraHeader"]);
104
+ classNamesProp = _a.classNames,
105
+ stylesProp = _a.styles,
106
+ rest = tslib.__rest(_a, ["prefixCls", "className", "defaultValue", "value", "onChange", "data", "placeholder", "clearable", "onClear", "onSelect", "expandTrigger", "disabled", "emptyContent", "changeOnSelect", "render", "displayRender", "checkCascaded", "searchPlaceholder", "onLoadChildren", "appearance", "invalid", "filterOption", "searchable", "keyword", "onSearch", "clearSearchOnClosed", "overlayClassName", "type", "flattedSearchResult", "checkedMode", "visible", "onOpen", "onClose", "tagInputProps", "size", "prefix", "suffix", "renderExtraFooter", "dropdownColumnRender", "customRender", "fieldNames", "label", "showOnlyShowChecked", "virtual", "showCheckAll", "showIndicator", "renderExtraHeader", "classNames", "styles"]);
104
107
  var _useGlobalContext = core.useGlobalContext(),
105
- globalSize = _useGlobalContext.size;
108
+ globalSize = _useGlobalContext.size,
109
+ checkCascaderConfig = _useGlobalContext.checkCascader;
106
110
  var size = (_b = sizeProp !== null && sizeProp !== void 0 ? sizeProp : globalSize) !== null && _b !== void 0 ? _b : 'md';
107
111
  var i18n = core.useLocaleContext();
112
+ var _useMergeSemantic = useMergeSemantic.useMergeSemantic({
113
+ classNamesList: [checkCascaderConfig === null || checkCascaderConfig === void 0 ? void 0 : checkCascaderConfig.classNames, classNamesProp],
114
+ stylesList: [checkCascaderConfig === null || checkCascaderConfig === void 0 ? void 0 : checkCascaderConfig.styles, stylesProp],
115
+ info: {
116
+ props: Object.assign(Object.assign({}, rest), {
117
+ data: data,
118
+ disabled: disabled,
119
+ searchable: searchableProp,
120
+ visible: visible,
121
+ size: size,
122
+ appearance: appearance,
123
+ expandTrigger: expandTrigger
124
+ })
125
+ }
126
+ }),
127
+ classNames = _useMergeSemantic.classNames,
128
+ styles = _useMergeSemantic.styles;
108
129
  var pickerInnerRef = React.useRef(null);
109
130
  var placeholder = typeAssertion.isUndef(placeholderProp) ? i18n.get('checkCascader.placeholder') : placeholderProp;
110
131
  var flatted = type === 'flatted';
@@ -288,11 +309,26 @@ var CheckCascader = /*#__PURE__*/React.forwardRef(function (_a, ref) {
288
309
  (_a = pickerInnerRef.current) === null || _a === void 0 ? void 0 : _a.update();
289
310
  }
290
311
  }, [menuVisible]);
312
+ var pickerSemanticKeys = ['root', 'container', 'panel', 'header', 'search', 'body', 'footer', 'loading', 'empty', 'creator'];
313
+ var pickerClassNames = pickerSemanticKeys.reduce(function (acc, key) {
314
+ if ((classNames === null || classNames === void 0 ? void 0 : classNames[key]) !== undefined) {
315
+ acc[key] = classNames[key];
316
+ }
317
+ return acc;
318
+ }, {});
319
+ var pickerStyles = pickerSemanticKeys.reduce(function (acc, key) {
320
+ if (styles === null || styles === void 0 ? void 0 : styles[key]) {
321
+ acc[key] = styles[key];
322
+ }
323
+ return acc;
324
+ }, {});
291
325
  return /*#__PURE__*/React__default["default"].createElement(picker.Picker, Object.assign({
292
326
  ref: ref,
293
327
  innerRef: pickerInnerRef,
294
328
  className: cls,
295
- overlayClassName: classname.cx(prefixCls + "__popper", overlayClassName)
329
+ overlayClassName: classname.cx(prefixCls + "__popper", overlayClassName),
330
+ classNames: pickerClassNames,
331
+ styles: pickerStyles
296
332
  }, rest, {
297
333
  // 这种展现形式宽度是不固定的，关掉宽度匹配策略
298
334
  overlay: Object.assign({
@@ -393,6 +429,8 @@ var CheckCascader = /*#__PURE__*/React.forwardRef(function (_a, ref) {
393
429
  }), typeAssertion.isArrayNonEmpty(selectProps.data) ? ( /*#__PURE__*/React__default["default"].createElement(CheckCascaderMenuList.CheckCascaderMenuList, {
394
430
  disabled: disabled,
395
431
  value: value,
432
+ classNames: classNames,
433
+ styles: styles,
396
434
  // @ts-ignore
397
435
  onChange: proxyOnChange,
398
436
  expandTrigger: expandTrigger,
package/lib/cjs/CheckCascaderMenu.js CHANGED
@@ -42,12 +42,15 @@ var CheckCascaderMenu = function CheckCascaderMenu(_ref) {
42
42
  menu = _ref.data,
43
43
  getCascaderItemRequiredProps = _ref.getCascaderItemRequiredProps;
44
44
  var _useCheckCascaderCont = context.useCheckCascaderContext(),
45
- virtual = _useCheckCascaderCont.virtual;
45
+ virtual = _useCheckCascaderCont.virtual,
46
+ classNames = _useCheckCascaderCont.classNames,
47
+ styles = _useCheckCascaderCont.styles;
46
48
  var isCheckableMenu = menu.some(function (_ref2) {
47
49
  var checkable = _ref2.checkable;
48
50
  return checkable;
49
51
  });
50
- var cls = classname.cx(prefixCls, className, isCheckableMenu && prefixCls + "--checkable");
52
+ var cls = classname.cx(prefixCls, className, classNames === null || classNames === void 0 ? void 0 : classNames.menu, isCheckableMenu && prefixCls + "--checkable");
53
+ var menuStyle = Object.assign(Object.assign({}, style), styles === null || styles === void 0 ? void 0 : styles.menu);
51
54
  var virtualListProps = {
52
55
  virtual: virtual,
53
56
  data: menu,
@@ -56,7 +59,7 @@ var CheckCascaderMenu = function CheckCascaderMenu(_ref) {
56
59
  };
57
60
  return /*#__PURE__*/React__default["default"].createElement("ul", {
58
61
  className: cls,
59
- style: style,
62
+ style: menuStyle,
60
63
  role: role
61
64
  }, virtual ? ( /*#__PURE__*/React__default["default"].createElement(List["default"], Object.assign({
62
65
  itemKey: 'id',
@@ -94,7 +97,9 @@ var MenuItem = /*#__PURE__*/React.forwardRef(function (_ref3, ref) {
94
97
  expandTrigger = _useCheckCascaderCont2.expandTrigger,
95
98
  onCheck = _useCheckCascaderCont2.onCheck,
96
99
  onSelect = _useCheckCascaderCont2.onSelect,
97
- titleRender = _useCheckCascaderCont2.titleRender;
100
+ titleRender = _useCheckCascaderCont2.titleRender,
101
+ classNames = _useCheckCascaderCont2.classNames,
102
+ styles = _useCheckCascaderCont2.styles;
98
103
  var renderTitle = React.useCallback(function (option) {
99
104
  // 如果 titleRender 返回 `true`，则使用默认 title
100
105
  var title = titleRender ? titleRender(option) : true;
@@ -122,7 +127,7 @@ var MenuItem = /*#__PURE__*/React.forwardRef(function (_ref3, ref) {
122
127
  // 此处 option.children?.length || !option.checkable 的含义是
123
128
  // 如果存在子节点，则可以展现选择态
124
129
  // 不存在子节点，如不是可勾选item，则可以展现勾选态
125
- selected && (((_a = option.children) === null || _a === void 0 ? void 0 : _a.length) || !option.checkable) && prefixCls + "-option--selected", loading && prefixCls + "-option--loading", disabled && prefixCls + "-option--disabled");
130
+ selected && (((_a = option.children) === null || _a === void 0 ? void 0 : _a.length) || !option.checkable) && prefixCls + "-option--selected", loading && prefixCls + "-option--loading", disabled && prefixCls + "-option--disabled", classNames === null || classNames === void 0 ? void 0 : classNames.option);
126
131
  return /*#__PURE__*/React__default["default"].createElement("li", {
127
132
  ref: ref,
128
133
  role: "menu-item",
@@ -131,6 +136,7 @@ var MenuItem = /*#__PURE__*/React.forwardRef(function (_ref3, ref) {
131
136
  title: typeof option.title === 'string' ? option.title : undefined
132
137
  }, /*#__PURE__*/React__default["default"].createElement("div", {
133
138
  className: optionCls,
139
+ style: styles === null || styles === void 0 ? void 0 : styles.option,
134
140
  onClick: function onClick(evt) {
135
141
  if (disabled) return;
136
142
  onSelect === null || onSelect === void 0 ? void 0 : onSelect(eventOption);
package/lib/cjs/CheckCascaderMenuList.js CHANGED
@@ -63,7 +63,9 @@ var CheckCascaderMenuList = /*#__PURE__*/React.forwardRef(function (_a, ref) {
63
63
  checkedMode = _a$checkedMode === void 0 ? 'ALL' : _a$checkedMode,
64
64
  virtual = _a.virtual,
65
65
  onMenuListChange = _a.onMenuListChange,
66
- rest = tslib.__rest(_a, ["prefixCls", "role", "className", "children", "data", "flattedData", "originalFlattedData", "onChangeData", "value", "defaultValue", "disabled", "expandTrigger", "changeOnSelect", "checkCascaded", "onLoadChildren", "onChange", "onSelect", "titleRender", "dropdownColumnRender", "flatted", "checkedMode", "virtual", "onMenuListChange"]);
66
+ classNames = _a.classNames,
67
+ styles = _a.styles,
68
+ rest = tslib.__rest(_a, ["prefixCls", "role", "className", "children", "data", "flattedData", "originalFlattedData", "onChangeData", "value", "defaultValue", "disabled", "expandTrigger", "changeOnSelect", "checkCascaded", "onLoadChildren", "onChange", "onSelect", "titleRender", "dropdownColumnRender", "flatted", "checkedMode", "virtual", "onMenuListChange", "classNames", "styles"]);
67
69
  if (checkCascaded === false) {
68
70
  checkedMode = 'SEPARATE';
69
71
  }
@@ -104,9 +106,11 @@ var CheckCascaderMenuList = /*#__PURE__*/React.forwardRef(function (_a, ref) {
104
106
  titleRender: titleRender,
105
107
  onLoadChildren: onLoadChildren,
106
108
  disabled: disabled,
107
- virtual: virtual
109
+ virtual: virtual,
110
+ classNames: classNames,
111
+ styles: styles
108
112
  };
109
- }, [expandTrigger, onOptionCheck, onItemExpand, flatted, changeOnSelect, titleRender, onLoadChildren, disabled, virtual]);
113
+ }, [expandTrigger, onOptionCheck, onItemExpand, flatted, changeOnSelect, titleRender, onLoadChildren, disabled, virtual, classNames, styles]);
110
114
  var filteredMenus = React.useMemo(function () {
111
115
  var menus = flatted ? index.getFlattedMenus(originalFlattedData) : index.getActiveMenus(originalFlattedData, selectedId);
112
116
  return index.getFilteredMenuList(menus, flattedData);
@@ -114,13 +118,15 @@ var CheckCascaderMenuList = /*#__PURE__*/React.forwardRef(function (_a, ref) {
114
118
  React.useEffect(function () {
115
119
  onMenuListChange === null || onMenuListChange === void 0 ? void 0 : onMenuListChange(filteredMenus);
116
120
  }, [filteredMenus, onMenuListChange]);
117
- var cls = classname.cx(prefixCls, className, flatted && prefixCls + "--flatted", changeOnSelect && prefixCls + "--selectchange");
121
+ var cls = classname.cx(prefixCls, className, classNames === null || classNames === void 0 ? void 0 : classNames.menuList, flatted && prefixCls + "--flatted", changeOnSelect && prefixCls + "--selectchange");
122
+ var rootStyle = styles === null || styles === void 0 ? void 0 : styles.menuList;
118
123
  return /*#__PURE__*/React__default["default"].createElement(context.CheckCascaderProvider, {
119
124
  value: providedValue
120
125
  }, /*#__PURE__*/React__default["default"].createElement("div", Object.assign({
121
126
  ref: ref,
122
127
  role: role,
123
- className: cls
128
+ className: cls,
129
+ style: rootStyle
124
130
  }, rest), filteredMenus.map(function (menu, menuIndex) {
125
131
  var menuContent = /*#__PURE__*/React__default["default"].createElement(CheckCascaderMenu.CheckCascaderMenu, {
126
132
  key: menuIndex,
package/lib/esm/CheckCascader.js CHANGED
@@ -17,6 +17,7 @@ import { UpOutlined, DownOutlined } from '@hi-ui/icons';
17
17
  import { useCache } from './hooks/use-cache/lib/esm/index.js';
18
18
  import { Picker } from '@hi-ui/picker';
19
19
  import { TagInputMock } from '@hi-ui/tag-input';
20
+ import { useMergeSemantic } from '@hi-ui/use-merge-semantic';
20
21
  import { CheckCascaderMenuList } from './CheckCascaderMenuList.js';
21
22
  import { useTreeCustomSearch, useTreeUpMatchSearch, useSearchMode, matchStrategy } from '@hi-ui/use-search-mode';
22
23
  import { flattenTreeData, parseCheckDataDirty, getAllCheckedStatus, processCheckedIds, allowCheck } from './utils/index.js';
@@ -87,11 +88,31 @@ var CheckCascader = /*#__PURE__*/forwardRef(function (_a, ref) {
87
88
  _a$showIndicator = _a.showIndicator,
88
89
  showIndicator = _a$showIndicator === void 0 ? true : _a$showIndicator,
89
90
  renderExtraHeader = _a.renderExtraHeader,
90
- rest = __rest(_a, ["prefixCls", "className", "defaultValue", "value", "onChange", "data", "placeholder", "clearable", "onClear", "onSelect", "expandTrigger", "disabled", "emptyContent", "changeOnSelect", "render", "displayRender", "checkCascaded", "searchPlaceholder", "onLoadChildren", "appearance", "invalid", "filterOption", "searchable", "keyword", "onSearch", "clearSearchOnClosed", "overlayClassName", "type", "flattedSearchResult", "checkedMode", "visible", "onOpen", "onClose", "tagInputProps", "size", "prefix", "suffix", "renderExtraFooter", "dropdownColumnRender", "customRender", "fieldNames", "label", "showOnlyShowChecked", "virtual", "showCheckAll", "showIndicator", "renderExtraHeader"]);
91
+ classNamesProp = _a.classNames,
92
+ stylesProp = _a.styles,
93
+ rest = __rest(_a, ["prefixCls", "className", "defaultValue", "value", "onChange", "data", "placeholder", "clearable", "onClear", "onSelect", "expandTrigger", "disabled", "emptyContent", "changeOnSelect", "render", "displayRender", "checkCascaded", "searchPlaceholder", "onLoadChildren", "appearance", "invalid", "filterOption", "searchable", "keyword", "onSearch", "clearSearchOnClosed", "overlayClassName", "type", "flattedSearchResult", "checkedMode", "visible", "onOpen", "onClose", "tagInputProps", "size", "prefix", "suffix", "renderExtraFooter", "dropdownColumnRender", "customRender", "fieldNames", "label", "showOnlyShowChecked", "virtual", "showCheckAll", "showIndicator", "renderExtraHeader", "classNames", "styles"]);
91
94
  var _useGlobalContext = useGlobalContext(),
92
- globalSize = _useGlobalContext.size;
95
+ globalSize = _useGlobalContext.size,
96
+ checkCascaderConfig = _useGlobalContext.checkCascader;
93
97
  var size = (_b = sizeProp !== null && sizeProp !== void 0 ? sizeProp : globalSize) !== null && _b !== void 0 ? _b : 'md';
94
98
  var i18n = useLocaleContext();
99
+ var _useMergeSemantic = useMergeSemantic({
100
+ classNamesList: [checkCascaderConfig === null || checkCascaderConfig === void 0 ? void 0 : checkCascaderConfig.classNames, classNamesProp],
101
+ stylesList: [checkCascaderConfig === null || checkCascaderConfig === void 0 ? void 0 : checkCascaderConfig.styles, stylesProp],
102
+ info: {
103
+ props: Object.assign(Object.assign({}, rest), {
104
+ data: data,
105
+ disabled: disabled,
106
+ searchable: searchableProp,
107
+ visible: visible,
108
+ size: size,
109
+ appearance: appearance,
110
+ expandTrigger: expandTrigger
111
+ })
112
+ }
113
+ }),
114
+ classNames = _useMergeSemantic.classNames,
115
+ styles = _useMergeSemantic.styles;
95
116
  var pickerInnerRef = useRef(null);
96
117
  var placeholder = isUndef(placeholderProp) ? i18n.get('checkCascader.placeholder') : placeholderProp;
97
118
  var flatted = type === 'flatted';
@@ -275,11 +296,26 @@ var CheckCascader = /*#__PURE__*/forwardRef(function (_a, ref) {
275
296
  (_a = pickerInnerRef.current) === null || _a === void 0 ? void 0 : _a.update();
276
297
  }
277
298
  }, [menuVisible]);
299
+ var pickerSemanticKeys = ['root', 'container', 'panel', 'header', 'search', 'body', 'footer', 'loading', 'empty', 'creator'];
300
+ var pickerClassNames = pickerSemanticKeys.reduce(function (acc, key) {
301
+ if ((classNames === null || classNames === void 0 ? void 0 : classNames[key]) !== undefined) {
302
+ acc[key] = classNames[key];
303
+ }
304
+ return acc;
305
+ }, {});
306
+ var pickerStyles = pickerSemanticKeys.reduce(function (acc, key) {
307
+ if (styles === null || styles === void 0 ? void 0 : styles[key]) {
308
+ acc[key] = styles[key];
309
+ }
310
+ return acc;
311
+ }, {});
278
312
  return /*#__PURE__*/React__default.createElement(Picker, Object.assign({
279
313
  ref: ref,
280
314
  innerRef: pickerInnerRef,
281
315
  className: cls,
282
- overlayClassName: cx(prefixCls + "__popper", overlayClassName)
316
+ overlayClassName: cx(prefixCls + "__popper", overlayClassName),
317
+ classNames: pickerClassNames,
318
+ styles: pickerStyles
283
319
  }, rest, {
284
320
  // 这种展现形式宽度是不固定的，关掉宽度匹配策略
285
321
  overlay: Object.assign({
@@ -380,6 +416,8 @@ var CheckCascader = /*#__PURE__*/forwardRef(function (_a, ref) {
380
416
  }), isArrayNonEmpty(selectProps.data) ? ( /*#__PURE__*/React__default.createElement(CheckCascaderMenuList, {
381
417
  disabled: disabled,
382
418
  value: value,
419
+ classNames: classNames,
420
+ styles: styles,
383
421
  // @ts-ignore
384
422
  onChange: proxyOnChange,
385
423
  expandTrigger: expandTrigger,
package/lib/esm/CheckCascaderMenu.js CHANGED
@@ -29,12 +29,15 @@ var CheckCascaderMenu = function CheckCascaderMenu(_ref) {
29
29
  menu = _ref.data,
30
30
  getCascaderItemRequiredProps = _ref.getCascaderItemRequiredProps;
31
31
  var _useCheckCascaderCont = useCheckCascaderContext(),
32
- virtual = _useCheckCascaderCont.virtual;
32
+ virtual = _useCheckCascaderCont.virtual,
33
+ classNames = _useCheckCascaderCont.classNames,
34
+ styles = _useCheckCascaderCont.styles;
33
35
  var isCheckableMenu = menu.some(function (_ref2) {
34
36
  var checkable = _ref2.checkable;
35
37
  return checkable;
36
38
  });
37
- var cls = cx(prefixCls, className, isCheckableMenu && prefixCls + "--checkable");
39
+ var cls = cx(prefixCls, className, classNames === null || classNames === void 0 ? void 0 : classNames.menu, isCheckableMenu && prefixCls + "--checkable");
40
+ var menuStyle = Object.assign(Object.assign({}, style), styles === null || styles === void 0 ? void 0 : styles.menu);
38
41
  var virtualListProps = {
39
42
  virtual: virtual,
40
43
  data: menu,
@@ -43,7 +46,7 @@ var CheckCascaderMenu = function CheckCascaderMenu(_ref) {
43
46
  };
44
47
  return /*#__PURE__*/React__default.createElement("ul", {
45
48
  className: cls,
46
- style: style,
49
+ style: menuStyle,
47
50
  role: role
48
51
  }, virtual ? ( /*#__PURE__*/React__default.createElement(List, Object.assign({
49
52
  itemKey: 'id',
@@ -81,7 +84,9 @@ var MenuItem = /*#__PURE__*/forwardRef(function (_ref3, ref) {
81
84
  expandTrigger = _useCheckCascaderCont2.expandTrigger,
82
85
  onCheck = _useCheckCascaderCont2.onCheck,
83
86
  onSelect = _useCheckCascaderCont2.onSelect,
84
- titleRender = _useCheckCascaderCont2.titleRender;
87
+ titleRender = _useCheckCascaderCont2.titleRender,
88
+ classNames = _useCheckCascaderCont2.classNames,
89
+ styles = _useCheckCascaderCont2.styles;
85
90
  var renderTitle = useCallback(function (option) {
86
91
  // 如果 titleRender 返回 `true`，则使用默认 title
87
92
  var title = titleRender ? titleRender(option) : true;
@@ -109,7 +114,7 @@ var MenuItem = /*#__PURE__*/forwardRef(function (_ref3, ref) {
109
114
  // 此处 option.children?.length || !option.checkable 的含义是
110
115
  // 如果存在子节点，则可以展现选择态
111
116
  // 不存在子节点，如不是可勾选item，则可以展现勾选态
112
- selected && (((_a = option.children) === null || _a === void 0 ? void 0 : _a.length) || !option.checkable) && prefixCls + "-option--selected", loading && prefixCls + "-option--loading", disabled && prefixCls + "-option--disabled");
117
+ selected && (((_a = option.children) === null || _a === void 0 ? void 0 : _a.length) || !option.checkable) && prefixCls + "-option--selected", loading && prefixCls + "-option--loading", disabled && prefixCls + "-option--disabled", classNames === null || classNames === void 0 ? void 0 : classNames.option);
113
118
  return /*#__PURE__*/React__default.createElement("li", {
114
119
  ref: ref,
115
120
  role: "menu-item",
@@ -118,6 +123,7 @@ var MenuItem = /*#__PURE__*/forwardRef(function (_ref3, ref) {
118
123
  title: typeof option.title === 'string' ? option.title : undefined
119
124
  }, /*#__PURE__*/React__default.createElement("div", {
120
125
  className: optionCls,
126
+ style: styles === null || styles === void 0 ? void 0 : styles.option,
121
127
  onClick: function onClick(evt) {
122
128
  if (disabled) return;
123
129
  onSelect === null || onSelect === void 0 ? void 0 : onSelect(eventOption);
package/lib/esm/CheckCascaderMenuList.js CHANGED
@@ -51,7 +51,9 @@ var CheckCascaderMenuList = /*#__PURE__*/forwardRef(function (_a, ref) {
51
51
  checkedMode = _a$checkedMode === void 0 ? 'ALL' : _a$checkedMode,
52
52
  virtual = _a.virtual,
53
53
  onMenuListChange = _a.onMenuListChange,
54
- rest = __rest(_a, ["prefixCls", "role", "className", "children", "data", "flattedData", "originalFlattedData", "onChangeData", "value", "defaultValue", "disabled", "expandTrigger", "changeOnSelect", "checkCascaded", "onLoadChildren", "onChange", "onSelect", "titleRender", "dropdownColumnRender", "flatted", "checkedMode", "virtual", "onMenuListChange"]);
54
+ classNames = _a.classNames,
55
+ styles = _a.styles,
56
+ rest = __rest(_a, ["prefixCls", "role", "className", "children", "data", "flattedData", "originalFlattedData", "onChangeData", "value", "defaultValue", "disabled", "expandTrigger", "changeOnSelect", "checkCascaded", "onLoadChildren", "onChange", "onSelect", "titleRender", "dropdownColumnRender", "flatted", "checkedMode", "virtual", "onMenuListChange", "classNames", "styles"]);
55
57
  if (checkCascaded === false) {
56
58
  checkedMode = 'SEPARATE';
57
59
  }
@@ -92,9 +94,11 @@ var CheckCascaderMenuList = /*#__PURE__*/forwardRef(function (_a, ref) {
92
94
  titleRender: titleRender,
93
95
  onLoadChildren: onLoadChildren,
94
96
  disabled: disabled,
95
- virtual: virtual
97
+ virtual: virtual,
98
+ classNames: classNames,
99
+ styles: styles
96
100
  };
97
- }, [expandTrigger, onOptionCheck, onItemExpand, flatted, changeOnSelect, titleRender, onLoadChildren, disabled, virtual]);
101
+ }, [expandTrigger, onOptionCheck, onItemExpand, flatted, changeOnSelect, titleRender, onLoadChildren, disabled, virtual, classNames, styles]);
98
102
  var filteredMenus = useMemo(function () {
99
103
  var menus = flatted ? getFlattedMenus(originalFlattedData) : getActiveMenus(originalFlattedData, selectedId);
100
104
  return getFilteredMenuList(menus, flattedData);
@@ -102,13 +106,15 @@ var CheckCascaderMenuList = /*#__PURE__*/forwardRef(function (_a, ref) {
102
106
  useEffect(function () {
103
107
  onMenuListChange === null || onMenuListChange === void 0 ? void 0 : onMenuListChange(filteredMenus);
104
108
  }, [filteredMenus, onMenuListChange]);
105
- var cls = cx(prefixCls, className, flatted && prefixCls + "--flatted", changeOnSelect && prefixCls + "--selectchange");
109
+ var cls = cx(prefixCls, className, classNames === null || classNames === void 0 ? void 0 : classNames.menuList, flatted && prefixCls + "--flatted", changeOnSelect && prefixCls + "--selectchange");
110
+ var rootStyle = styles === null || styles === void 0 ? void 0 : styles.menuList;
106
111
  return /*#__PURE__*/React__default.createElement(CheckCascaderProvider, {
107
112
  value: providedValue
108
113
  }, /*#__PURE__*/React__default.createElement("div", Object.assign({
109
114
  ref: ref,
110
115
  role: role,
111
- className: cls
116
+ className: cls,
117
+ style: rootStyle
112
118
  }, rest), filteredMenus.map(function (menu, menuIndex) {
113
119
  var menuContent = /*#__PURE__*/React__default.createElement(CheckCascaderMenu, {
114
120
  key: menuIndex,
package/lib/types/CheckCascader.d.ts CHANGED
@@ -1,13 +1,18 @@
1
1
  import React from 'react';
2
2
  import { CheckCascaderDataItem, CheckCascaderExpandTriggerEnum, CheckCascaderItemEventData, CheckCascaderAppearanceEnum, FlattedCheckCascaderDataItem } from './types';
3
- import { PickerProps } from '@hi-ui/picker';
3
+ import { PickerProps, PickerSemanticName } from '@hi-ui/picker';
4
4
  import { TagInputMockProps } from '@hi-ui/tag-input';
5
+ import type { ComponentSemantic, SemanticClassNamesType, SemanticStylesType } from '@hi-ui/use-merge-semantic';
5
6
  import { HiBaseFieldNames, HiBaseSizeEnum } from '@hi-ui/core';
6
7
  /**
7
8
  * 多项级联选择器
8
9
  */
9
10
  export declare const CheckCascader: React.ForwardRefExoticComponent<CheckCascaderProps & React.RefAttributes<HTMLDivElement | null>>;
10
- export interface CheckCascaderProps extends Omit<PickerProps, 'trigger' | 'scrollable' | 'header' | 'footer'> {
11
+ export type CheckCascaderSemanticName = PickerSemanticName | 'menuList' | 'menu' | 'option';
12
+ export type CheckCascaderSemanticClassNames = SemanticClassNamesType<CheckCascaderProps, CheckCascaderSemanticName>;
13
+ export type CheckCascaderSemanticStyles = SemanticStylesType<CheckCascaderProps, CheckCascaderSemanticName>;
14
+ export type CheckCascaderSemantic = ComponentSemantic<CheckCascaderSemanticClassNames, CheckCascaderSemanticStyles>;
15
+ export interface CheckCascaderProps extends Omit<PickerProps, 'trigger' | 'scrollable' | 'header' | 'footer' | 'classNames' | 'styles'>, CheckCascaderSemantic {
11
16
  /**
12
17
  * 设置选择项数据源
13
18
  */
package/lib/types/CheckCascaderMenuList.d.ts CHANGED
@@ -99,4 +99,12 @@ export interface CascaderMenusProps {
99
99
  * 菜单列表改变时的回调
100
100
  */
101
101
  onMenuListChange?: (menuList: FlattedCheckCascaderDataItem[][]) => void;
102
+ /**
103
+ * 语义化 classNames（由 CheckCascader 传入，用于 menuList/menu/option）
104
+ */
105
+ classNames?: Partial<Record<string, string>>;
106
+ /**
107
+ * 语义化 styles（由 CheckCascader 传入，用于 menuList/menu/option）
108
+ */
109
+ styles?: Partial<Record<string, React.CSSProperties>>;
102
110
  }
package/lib/types/context.d.ts CHANGED
@@ -11,6 +11,8 @@ interface CheckCascaderContext {
11
11
  titleRender?: (item: CheckCascaderItemEventData) => React.ReactNode;
12
12
  getCascaderItemRequiredProps?: (item: FlattedCheckCascaderDataItem) => CheckCascaderDataItemRequiredProps;
13
13
  virtual?: boolean;
14
+ classNames?: Partial<Record<string, string>>;
15
+ styles?: Partial<Record<string, React.CSSProperties>>;
14
16
  }
15
17
  export declare const CheckCascaderProvider: React.Provider<CheckCascaderContext>;
16
18
  export declare const useCheckCascaderContext: () => CheckCascaderContext;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hi-ui/check-cascader",
3
- "version": "5.0.0-experimental.1",
3
+ "version": "5.0.0-experimental.2",
4
4
  "description": "A sub-package for @hi-ui/hiui.",
5
5
  "keywords": [],
6
6
  "author": "HiUI <mi-hiui@xiaomi.com>",
@@ -46,16 +46,16 @@
46
46
  },
47
47
  "dependencies": {
48
48
  "@hi-ui/array-utils": "^5.0.0-experimental.0",
49
- "@hi-ui/checkbox": "^5.0.0-experimental.0",
49
+ "@hi-ui/checkbox": "^5.0.0-experimental.1",
50
50
  "@hi-ui/classname": "^5.0.0-experimental.0",
51
51
  "@hi-ui/env": "^5.0.0-experimental.0",
52
52
  "@hi-ui/func-utils": "^5.0.0-experimental.0",
53
- "@hi-ui/icons": "^5.0.0-experimental.0",
54
- "@hi-ui/input": "^5.0.0-experimental.1",
55
- "@hi-ui/picker": "^5.0.0-experimental.1",
56
- "@hi-ui/popper": "^5.0.0-experimental.0",
57
- "@hi-ui/spinner": "^5.0.0-experimental.0",
58
- "@hi-ui/tag-input": "^5.0.0-experimental.1",
53
+ "@hi-ui/icons": "^5.0.0-experimental.1",
54
+ "@hi-ui/input": "^5.0.0-experimental.2",
55
+ "@hi-ui/picker": "^5.0.0-experimental.2",
56
+ "@hi-ui/popper": "^5.0.0-experimental.1",
57
+ "@hi-ui/spinner": "^5.0.0-experimental.1",
58
+ "@hi-ui/tag-input": "^5.0.0-experimental.2",
59
59
  "@hi-ui/times": "^5.0.0-experimental.0",
60
60
  "@hi-ui/tree-utils": "^5.0.0-experimental.0",
61
61
  "@hi-ui/type-assertion": "^5.0.0-experimental.0",
@@ -66,16 +66,17 @@
66
66
  "@hi-ui/use-outside-click": "^5.0.0-experimental.0",
67
67
  "@hi-ui/use-search-mode": "^5.0.0-experimental.0",
68
68
  "@hi-ui/use-toggle": "^5.0.0-experimental.0",
69
- "@hi-ui/use-uncontrolled-state": "^5.0.0-experimental.0"
69
+ "@hi-ui/use-uncontrolled-state": "^5.0.0-experimental.0",
70
+ "@hi-ui/use-merge-semantic": "^5.0.0-experimental.0"
70
71
  },
71
72
  "peerDependencies": {
72
- "@hi-ui/core": ">=5.0.0-experimental.0",
73
+ "@hi-ui/core": ">=5.0.0-experimental.1",
73
74
  "react": ">=16.8.6",
74
75
  "react-dom": ">=16.8.6"
75
76
  },
76
77
  "devDependencies": {
77
- "@hi-ui/core": "^5.0.0-experimental.0",
78
- "@hi-ui/core-css": "^5.0.0-experimental.1",
78
+ "@hi-ui/core": "^5.0.0-experimental.1",
79
+ "@hi-ui/core-css": "^5.0.0-experimental.2",
79
80
  "react": "^17.0.1",
80
81
  "react-dom": "^17.0.1"
81
82
  }