@hi-ui/cascader 4.0.0-beta.4 → 4.0.0-beta.40

package/lib/esm/Cascader.js

@@ -15,16 +15,17 @@ import { useUncontrolledToggle } from '@hi-ui/use-toggle';
 import { useCascader } from './use-cascader.js';
 import { MockInput } from '@hi-ui/input';
 import { UpOutlined, DownOutlined } from '@hi-ui/icons';
-import { defaultLoadingIcon, defaultSuffixIcon, defaultLeafIcon } from './icons/index.js';
 import { flattenTreeData, checkCanLoadChildren, getItemEventData } from './utils/index.js';
-import { CascaderProvider, useCascaderContext } from './context.js';
+import { CascaderProvider } from './context.js';
 import { getTopDownAncestors, getNodeAncestorsWithMe } from '@hi-ui/tree-utils';
 import { isUndef, isArrayNonEmpty, isFunction } from '@hi-ui/type-assertion';
 import { Picker } from '@hi-ui/picker';
 import { useTreeCustomSearch, useTreeUpMatchSearch, useSearchMode } from '@hi-ui/use-search-mode';
-import { uniqBy } from 'lodash';
+import { uniqBy } from '@hi-ui/array-utils';
 import { useCache } from './hooks/use-cache/lib/esm/index.js';
 import { useLocaleContext } from '@hi-ui/locale-context';
+import { callAllFuncs } from '@hi-ui/func-utils';
+import { CascaderMenuList } from './CascaderMenuList.js';
 
 var _prefix = getPrefixCls('cascader');
 
@@ -55,19 +56,22 @@ var Cascader = /*#__PURE__*/forwardRef(function (props, ref) {
       invalid = props.invalid,
       filterOption = props.filterOption,
       searchableProp = props.searchable,
+      onSearchProp = props.onSearch,
       titleRender = props.render,
       overlayClassName = props.overlayClassName,
       _props$data = props.data,
       data = _props$data === void 0 ? NOOP_ARRAY : _props$data,
+      visible = props.visible,
       onOpen = props.onOpen,
       onClose = props.onClose,
-      rest = __rest(props, ["prefixCls", "className", "placeholder", "disabled", "clearable", "type", "fieldNames", "expandTrigger", "displayRender", "onSelect", "onLoadChildren", "appearance", "invalid", "filterOption", "searchable", "render", "overlayClassName", "data", "onOpen", "onClose"]);
+      rest = __rest(props, ["prefixCls", "className", "placeholder", "disabled", "clearable", "type", "fieldNames", "expandTrigger", "displayRender", "onSelect", "onLoadChildren", "appearance", "invalid", "filterOption", "searchable", "onSearch", "render", "overlayClassName", "data", "visible", "onOpen", "onClose"]);
 
   var i18n = useLocaleContext();
   var placeholder = isUndef(placeholderProp) ? i18n.get('cascader.placeholder') : placeholderProp;
   var flatted = type === 'flatted';
 
   var _useUncontrolledToggl = useUncontrolledToggle({
+    visible: visible,
     disabled: disabled,
     onOpen: onOpen,
     onClose: onClose
@@ -221,7 +225,7 @@ var Cascader = /*#__PURE__*/forwardRef(function (props, ref) {
     onOpen: menuVisibleAction.on,
     onClose: menuVisibleAction.off,
     searchable: searchable,
-    onSearch: onSearch,
+    onSearch: callAllFuncs(onSearchProp, onSearch),
     trigger: /*#__PURE__*/React.createElement(MockInput, {
       clearable: clearable,
       placeholder: placeholder,
@@ -243,132 +247,6 @@ if (__DEV__) {
   Cascader.displayName = 'Cascader';
 }
 
-var menuListPrefix = getPrefixCls('cascader-menu-list');
-var CascaderMenuList = /*#__PURE__*/forwardRef(function (_a, ref) {
-  var _a$prefixCls = _a.prefixCls,
-      prefixCls = _a$prefixCls === void 0 ? menuListPrefix : _a$prefixCls,
-      className = _a.className,
-      rest = __rest(_a, ["prefixCls", "className"]);
-
-  var _useCascaderContext = useCascaderContext(),
-      flatted = _useCascaderContext.flatted,
-      menuList = _useCascaderContext.menuList;
-
-  var cls = cx(prefixCls, className, flatted && prefixCls + "--flatted");
-  return /*#__PURE__*/React.createElement("div", Object.assign({
-    ref: ref,
-    className: cls
-  }, rest), menuList.map(function (menu, menuIndex) {
-    // @ts-ignore
-    return isArrayNonEmpty(menu) ? /*#__PURE__*/React.createElement(CascaderMenu, {
-      key: menuIndex,
-      data: menu
-    }) : null;
-  }));
-});
-
-if (__DEV__) {
-  CascaderMenuList.displayName = 'CascaderMenuList';
-}
-
-var menuPrefix = getPrefixCls('cascader-menu');
-
-var CascaderMenu = function CascaderMenu(_ref2) {
-  var _ref2$prefixCls = _ref2.prefixCls,
-      prefixCls = _ref2$prefixCls === void 0 ? menuPrefix : _ref2$prefixCls,
-      _ref2$role = _ref2.role,
-      role = _ref2$role === void 0 ? 'menu' : _ref2$role,
-      className = _ref2.className,
-      menu = _ref2.data;
-
-  var _useCascaderContext2 = useCascaderContext(),
-      flatted = _useCascaderContext2.flatted,
-      disabledContext = _useCascaderContext2.disabled,
-      expandTrigger = _useCascaderContext2.expandTrigger,
-      onItemClick = _useCascaderContext2.onItemClick,
-      onItemHover = _useCascaderContext2.onItemHover,
-      titleRender = _useCascaderContext2.titleRender,
-      onLoadChildren = _useCascaderContext2.onLoadChildren,
-      getItemRequiredProps = _useCascaderContext2.getItemRequiredProps;
-
-  var cls = cx(prefixCls, className);
-  return /*#__PURE__*/React.createElement("ul", {
-    className: cls,
-    role: role
-  }, menu.map(function (option) {
-    var eventOption = getItemEventData(option, getItemRequiredProps(option));
-    var selected = eventOption.selected,
-        loading = eventOption.loading;
-    var disabled = disabledContext || option.disabled;
-    var optionCls = cx(prefixCls + "-option", loading && prefixCls + "-option--loading", disabled && prefixCls + "-option--disabled", selected && prefixCls + "-option--selected");
-    return /*#__PURE__*/React.createElement("li", {
-      key: option.id,
-      role: "menu-item",
-      className: prefixCls + "-item"
-    }, /*#__PURE__*/React.createElement("div", {
-      className: optionCls,
-      onClick: function onClick() {
-        if (disabled) return;
-        onItemClick(eventOption);
-      },
-      onMouseEnter: function onMouseEnter() {
-        if (disabled) return;
-
-        if (expandTrigger === 'hover') {
-          onItemHover(eventOption);
-        }
-      }
-    }, flatted ? renderFlattedTitle(eventOption, titleRender) : /*#__PURE__*/React.createElement(React.Fragment, null, renderDefaultTitle(eventOption, titleRender), renderSuffix(prefixCls, option, loading, onLoadChildren))));
-  }));
-};
-/**
- * 渲染菜单子项的展开提示图标
- */
-
-
-var renderSuffix = function renderSuffix(prefixCls, item, loading, onLoadChildren) {
-  if (loading) {
-    return /*#__PURE__*/React.createElement("span", {
-      className: cx(prefixCls + "-switcher", prefixCls + "-switcher--loading")
-    }, defaultLoadingIcon);
-  }
-
-  var canLoadChildren = checkCanLoadChildren(item, onLoadChildren);
-
-  if (canLoadChildren) {
-    return /*#__PURE__*/React.createElement("span", {
-      className: cx(prefixCls + "-switcher", prefixCls + "-switcher--arrow")
-    }, defaultSuffixIcon);
-  }
-
-  return /*#__PURE__*/React.createElement("span", {
-    className: cx(prefixCls + "-switcher", prefixCls + "-switcher--noop")
-  }, defaultLeafIcon);
-};
-
-var renderFlattedTitle = function renderFlattedTitle(option, titleRender) {
-  // 如果 titleRender 返回 `true`，则使用默认 title
-  var title = titleRender ? titleRender(option) : true;
-  if (title !== true) return title;
-  return /*#__PURE__*/React.createElement("span", {
-    className: "title__text title__text--cols"
-  }, getTopDownAncestors(option).map(function (item) {
-    return /*#__PURE__*/React.createElement("span", {
-      key: item.id,
-      className: "title__text--col"
-    }, item.title);
-  }));
-};
-
-var renderDefaultTitle = function renderDefaultTitle(option, titleRender) {
-  // 如果 titleRender 返回 `true`，则使用默认 title
-  var title = titleRender ? titleRender(option) : true;
-  if (title !== true) return title;
-  return /*#__PURE__*/React.createElement("span", {
-    className: "title__text"
-  }, option.title);
-};
-
 var renderHighlightTitle = function renderHighlightTitle(keyword, option, titleRender) {
   // 如果 titleRender 返回 `true`，则使用默认 title
   var title = titleRender ? titleRender(option, keyword) : true;
@@ -405,5 +283,4 @@ var renderHighlightTitle = function renderHighlightTitle(keyword, option, titleR
   }).reverse());
 };
 
-export { Cascader, CascaderMenu, CascaderMenuList };
-//# sourceMappingURL=Cascader.js.map
+export { Cascader };

package/lib/esm/CascaderMenuList.js

@@ -0,0 +1,146 @@
+/** @LICENSE
+ * @hi-ui/cascader
+ * https://github.com/XiaoMi/hiui/tree/master/packages/ui/cascader#readme
+ *
+ * Copyright (c) HIUI <mi-hiui@xiaomi.com>.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import { __rest } from 'tslib';
+import React, { forwardRef } from 'react';
+import { getPrefixCls, cx } from '@hi-ui/classname';
+import { __DEV__ } from '@hi-ui/env';
+import { defaultLoadingIcon, defaultSuffixIcon, defaultLeafIcon } from './icons/index.js';
+import { getItemEventData, checkCanLoadChildren } from './utils/index.js';
+import { useCascaderContext } from './context.js';
+import { getTopDownAncestors } from '@hi-ui/tree-utils';
+import { isArrayNonEmpty } from '@hi-ui/type-assertion';
+var menuListPrefix = getPrefixCls('cascader-menu-list');
+var CascaderMenuList = /*#__PURE__*/forwardRef(function (_a, ref) {
+  var _a$prefixCls = _a.prefixCls,
+      prefixCls = _a$prefixCls === void 0 ? menuListPrefix : _a$prefixCls,
+      className = _a.className,
+      rest = __rest(_a, ["prefixCls", "className"]);
+
+  var _useCascaderContext = useCascaderContext(),
+      flatted = _useCascaderContext.flatted,
+      menuList = _useCascaderContext.menuList;
+
+  var cls = cx(prefixCls, className, flatted && prefixCls + "--flatted");
+  return /*#__PURE__*/React.createElement("div", Object.assign({
+    ref: ref,
+    className: cls
+  }, rest), menuList.map(function (menu, menuIndex) {
+    // @ts-ignore
+    return isArrayNonEmpty(menu) ? /*#__PURE__*/React.createElement(CascaderMenu, {
+      key: menuIndex,
+      data: menu
+    }) : null;
+  }));
+});
+
+if (__DEV__) {
+  CascaderMenuList.displayName = 'CascaderMenuList';
+}
+
+var menuPrefix = getPrefixCls('cascader-menu');
+
+var CascaderMenu = function CascaderMenu(_ref) {
+  var _ref$prefixCls = _ref.prefixCls,
+      prefixCls = _ref$prefixCls === void 0 ? menuPrefix : _ref$prefixCls,
+      _ref$role = _ref.role,
+      role = _ref$role === void 0 ? 'menu' : _ref$role,
+      className = _ref.className,
+      menu = _ref.data;
+
+  var _useCascaderContext2 = useCascaderContext(),
+      flatted = _useCascaderContext2.flatted,
+      disabledContext = _useCascaderContext2.disabled,
+      expandTrigger = _useCascaderContext2.expandTrigger,
+      onItemClick = _useCascaderContext2.onItemClick,
+      onItemHover = _useCascaderContext2.onItemHover,
+      titleRender = _useCascaderContext2.titleRender,
+      onLoadChildren = _useCascaderContext2.onLoadChildren,
+      getItemRequiredProps = _useCascaderContext2.getItemRequiredProps;
+
+  var cls = cx(prefixCls, className);
+  return /*#__PURE__*/React.createElement("ul", {
+    className: cls,
+    role: role
+  }, menu.map(function (option) {
+    var eventOption = getItemEventData(option, getItemRequiredProps(option));
+    var selected = eventOption.selected,
+        loading = eventOption.loading,
+        active = eventOption.active;
+    var disabled = disabledContext || option.disabled;
+    var optionCls = cx(prefixCls + "-option", active && prefixCls + "-option--active", loading && prefixCls + "-option--loading", disabled && prefixCls + "-option--disabled", selected && prefixCls + "-option--selected");
+    return /*#__PURE__*/React.createElement("li", {
+      key: option.id,
+      role: "menu-item",
+      className: prefixCls + "-item"
+    }, /*#__PURE__*/React.createElement("div", {
+      className: optionCls,
+      onClick: function onClick() {
+        if (disabled) return;
+        onItemClick(eventOption);
+      },
+      onMouseEnter: function onMouseEnter() {
+        if (disabled) return;
+
+        if (expandTrigger === 'hover') {
+          onItemHover(eventOption);
+        }
+      }
+    }, flatted ? renderFlattedTitle(eventOption, titleRender) : /*#__PURE__*/React.createElement(React.Fragment, null, renderDefaultTitle(eventOption, titleRender), renderSuffix(prefixCls, option, loading, onLoadChildren))));
+  }));
+};
+/**
+ * 渲染菜单子项的展开提示图标
+ */
+
+
+var renderSuffix = function renderSuffix(prefixCls, item, loading, onLoadChildren) {
+  if (loading) {
+    return /*#__PURE__*/React.createElement("span", {
+      className: cx(prefixCls + "-switcher", prefixCls + "-switcher--loading")
+    }, defaultLoadingIcon);
+  }
+
+  var canLoadChildren = checkCanLoadChildren(item, onLoadChildren);
+
+  if (canLoadChildren) {
+    return /*#__PURE__*/React.createElement("span", {
+      className: cx(prefixCls + "-switcher", prefixCls + "-switcher--arrow")
+    }, defaultSuffixIcon);
+  }
+
+  return /*#__PURE__*/React.createElement("span", {
+    className: cx(prefixCls + "-switcher", prefixCls + "-switcher--noop")
+  }, defaultLeafIcon);
+};
+
+var renderFlattedTitle = function renderFlattedTitle(option, titleRender) {
+  // 如果 titleRender 返回 `true`，则使用默认 title
+  var title = titleRender ? titleRender(option) : true;
+  if (title !== true) return title;
+  return /*#__PURE__*/React.createElement("span", {
+    className: "title__text title__text--cols"
+  }, getTopDownAncestors(option).map(function (item) {
+    return /*#__PURE__*/React.createElement("span", {
+      key: item.id,
+      className: "title__text--col"
+    }, item.title);
+  }));
+};
+
+var renderDefaultTitle = function renderDefaultTitle(option, titleRender) {
+  // 如果 titleRender 返回 `true`，则使用默认 title
+  var title = titleRender ? titleRender(option) : true;
+  if (title !== true) return title;
+  return /*#__PURE__*/React.createElement("span", {
+    className: "title__text"
+  }, option.title);
+};
+
+export { CascaderMenu, CascaderMenuList };

package/lib/esm/context.js

@@ -22,4 +22,3 @@ var useCascaderContext = function useCascaderContext() {
 };
 
 export { CascaderProvider, useCascaderContext };
-//# sourceMappingURL=context.js.map

package/lib/esm/hooks/use-async-switch.js

@@ -119,4 +119,3 @@ var useAsyncSwitch = function useAsyncSwitch(setCascaderData, onExpand, onLoadCh
 };
 
 export { useAsyncSwitch };
-//# sourceMappingURL=use-async-switch.js.map

package/lib/esm/hooks/use-cache/lib/esm/index.js

@@ -34,4 +34,3 @@ var useCache = function useCache(data) {
 };
 
 export { useCache };
-//# sourceMappingURL=index.js.map

package/lib/esm/hooks/use-select.js

@@ -55,4 +55,3 @@ var useSelect = function useSelect(disabled, onSelect, changeOnSelect, onLoadChi
 };
 
 export { useSelect };
-//# sourceMappingURL=use-select.js.map

package/lib/esm/icons/index.js

@@ -19,4 +19,3 @@ var defaultLeafIcon = /*#__PURE__*/React.createElement("span", {
 });
 var defaultLoadingIcon = /*#__PURE__*/React.createElement(Spinner, null);
 export { defaultLeafIcon, defaultLoadingIcon, defaultSuffixIcon };
-//# sourceMappingURL=index.js.map

package/lib/esm/index.js

@@ -8,5 +8,4 @@
  * LICENSE file in the root directory of this source tree.
  */
 import './styles/index.scss.js';
-export { Cascader, CascaderMenu, CascaderMenuList, Cascader as default } from './Cascader.js';
-//# sourceMappingURL=index.js.map
+export { Cascader, Cascader as default } from './Cascader.js';

package/lib/esm/styles/index.scss.js

@@ -7,11 +7,9 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-var css_248z = "@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n.hi-v4-cascader__popper .hi-v4-picker__body {\n  padding-left: 0;\n  padding-right: 0; }\n.hi-v4-cascader__popper .hi-v4-picker__loading, .hi-v4-cascader__popper .hi-v4-picker__empty {\n  padding: 10px 16px;\n  padding: var(--hi-v4-spacing-5, 10px) var(--hi-v4-spacing-8, 16px); }\n.hi-v4-cascader-panel {\n  white-space: nowrap;\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n  font-size: 0.875rem;\n  font-size: var(--hi-v4-text-size-normal, 0.875rem);\n  color: #1f2733;\n  color: var(--hi-v4-color-gray-700, #1f2733); }\n.hi-v4-cascader-search {\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n  padding: 0 10px 10px;\n  position: relative; }\n.hi-v4-cascader-search .hi-v4-input__prefix {\n    font-size: 16px;\n    padding-left: 0; }\n.hi-v4-cascader-search__empty {\n    display: inline-block;\n    margin-top: 20px;\n    font-size: 14px;\n    font-weight: 400;\n    color: #999;\n    line-height: 20px; }\n.hi-v4-cascader-menu-list {\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n  overflow-x: auto; }\n.hi-v4-cascader-menu-list--flatted .hi-v4-cascader-menu {\n    -ms-flex-preferred-size: 100%;\n        flex-basis: 100%; }\n.hi-v4-cascader-menu {\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n  margin: 0;\n  padding: 0;\n  border: none;\n  outline: none;\n  font-size: 0.875rem;\n  font-size: var(--hi-v4-text-size-normal, 0.875rem);\n  vertical-align: middle;\n  list-style: none;\n  width: auto;\n  box-sizing: border-box;\n  -ms-flex-negative: 0;\n      flex-shrink: 0;\n  display: inline-block;\n  min-width: 140px;\n  max-height: 260px;\n  overflow: auto;\n  padding: 4px 8px;\n  border-right: 1px solid #ebedf0;\n  border-right: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-gray-200, #ebedf0); }\n.hi-v4-cascader-menu:last-of-type {\n    border: none; }\n.hi-v4-cascader-menu-item {\n    width: 100%;\n    padding: 4px 0;\n    padding: var(--hi-v4-spacing-2, 4px) 0;\n    position: relative;\n    cursor: pointer;\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex; }\n.hi-v4-cascader-menu-option {\n    padding: 0 8px;\n    padding: 0 var(--hi-v4-spacing-4, 8px);\n    -webkit-box-sizing: border-box;\n            box-sizing: border-box;\n    height: 32px;\n    width: 100%;\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    position: relative;\n    -webkit-box-pack: justify;\n        -ms-flex-pack: justify;\n            justify-content: space-between;\n    border-radius: 4px;\n    border-radius: var(--hi-v4-border-radius-normal, 4px); }\n.hi-v4-cascader-menu-option:hover {\n      background-color: #f2f4f7;\n      background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-cascader-menu-option.hi-v4-cascader-menu-option--selected {\n      background-color: #e2f3fe;\n      background-color: var(--hi-v4-color-brandblue-50, #e2f3fe);\n      color: #237ffa;\n      color: var(--hi-v4-color-brandblue-500, #237ffa); }\n.hi-v4-cascader-menu-option.hi-v4-cascader-menu-option--selected .hi-v4-cascader-menu-switcher {\n        color: #237ffa;\n        color: var(--hi-v4-color-brandblue-500, #237ffa); }\n.hi-v4-cascader-menu-option--focused {\n      background-color: #e2f3fe;\n      background-color: var(--hi-v4-color-brandblue-50, #e2f3fe); }\n.hi-v4-cascader-menu-option--checked {\n      font-weight: 700; }\n.hi-v4-cascader-menu-option.hi-v4-cascader-menu-option--disabled {\n      cursor: not-allowed;\n      color: #929aa6;\n      color: var(--hi-v4-color-gray-500, #929aa6);\n      background: transparent; }\n.hi-v4-cascader-menu-option.hi-v4-cascader-menu-option--disabled .hi-v4-cascader-menu-switcher {\n        color: #c9ced6;\n        color: var(--hi-v4-color-gray-400, #c9ced6); }\n.hi-v4-cascader-menu .title__text {\n    -webkit-box-flex: 1;\n        -ms-flex: 1 1;\n            flex: 1 1; }\n.hi-v4-cascader-menu .title__text--cols {\n      display: block;\n      width: 100%;\n      -webkit-box-sizing: border-box;\n              box-sizing: border-box;\n      margin: 0;\n      padding: 0;\n      border: none;\n      outline: none;\n      font-size: 0.875rem;\n      font-size: var(--hi-v4-text-size-normal, 0.875rem);\n      vertical-align: middle;\n      list-style: none; }\n.hi-v4-cascader-menu .title__text--col {\n      display: inline-block; }\n.hi-v4-cascader-menu .title__text--col::after {\n        content: '\\00a0/\\00a0'; }\n.hi-v4-cascader-menu .title__text--col:last-child::after {\n        content: none; }\n.hi-v4-cascader-menu .title__text--matched {\n      color: #237ffa;\n      color: var(--hi-v4-color-brandblue-500, #237ffa); }\n.hi-v4-cascader-menu-switcher {\n    -ms-flex-negative: 0;\n        flex-shrink: 0;\n    font-size: 16px;\n    color: #929aa6;\n    color: var(--hi-v4-color-gray-500, #929aa6); }\n.hi-v4-cascader-menu-switcher--loading {\n      color: #237ffa;\n      color: var(--hi-v4-color-brandblue-500, #237ffa); }\n.hi-v4-cascader-menu-switcher--arrow {\n      -webkit-transform: rotate(-90deg);\n              transform: rotate(-90deg); }\n.hi-v4-cascader__icon--loading {\n  display: inline-block;\n  width: 1em;\n  height: 1em;\n  stroke: none;\n  cursor: default;\n  fill: currentColor; }\n.hi-v4-cascader__icon--loading svg {\n    -webkit-animation-name: hi-rotate;\n            animation-name: hi-rotate;\n    -webkit-animation-duration: 2s;\n            animation-duration: 2s;\n    -webkit-animation-iteration-count: infinite;\n            animation-iteration-count: infinite; }\n@-webkit-keyframes rotate {\n  to {\n    -webkit-transform: rotate(360deg);\n            transform: rotate(360deg); } }\n@keyframes rotate {\n  to {\n    -webkit-transform: rotate(360deg);\n            transform: rotate(360deg); } }\n";
-
-var __styleInject__ = require('style-inject/dist/style-inject.es.js')["default"];
+import __styleInject__ from 'inject-head-style';
+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); } }";
 
 __styleInject__(css_248z);
 
-export default css_248z;
-//# sourceMappingURL=index.scss.js.map
+export { css_248z as default };

package/lib/esm/use-cascader.js

@@ -92,12 +92,13 @@ var useCascader = function useCascader(_a) {
     var id = _ref3.id,
         depth = _ref3.depth;
     return {
+      active: value[depth] === id,
       selected: flatted ? selectedId === id : selectedIds[depth] === id,
       loading: isLoadingId(id),
       // TODO: 表示聚焦状态，添加快捷键时可以一起处理
       focused: false
     };
-  }, [flatted, selectedId, selectedIds, isLoadingId]);
+  }, [flatted, selectedId, selectedIds, isLoadingId, value]);
   var reset = useCallback(function () {
     setSelectedId(value[value.length - 1]);
   }, [setSelectedId, value]);
@@ -119,4 +120,3 @@ var useCascader = function useCascader(_a) {
 };
 
 export { useCascader };
-//# sourceMappingURL=use-cascader.js.map

package/lib/esm/utils/index.js

@@ -103,4 +103,3 @@ function getItemEventData(node, requiredProps) {
 }
 
 export { checkCanLoadChildren, flattenTreeData, getActiveMenus, getActiveNodePaths, getFlattedMenus, getItemEventData };
-//# sourceMappingURL=index.js.map

package/lib/types/Cascader.d.ts

@@ -1,15 +1,15 @@
 import React from 'react';
-import type { HiBaseHTMLProps, HiBaseAppearanceEnum } from '@hi-ui/core';
+import type { HiBaseAppearanceEnum } from '@hi-ui/core';
 import { UseCascaderProps } from './use-cascader';
 import type { PopperOverlayProps } from '@hi-ui/popper';
-import { ExpandTrigger, FlattedCascaderItem, CascaderItemEventData } from './types';
+import { CascaderExpandTriggerEnum, CascaderItemEventData } from './types';
 import { PickerProps } from '@hi-ui/picker';
 /**
  * TODO: What is Cascader
  * Trigger + MenuList + Search
  */
 export declare const Cascader: React.ForwardRefExoticComponent<CascaderProps & React.RefAttributes<HTMLDivElement | null>>;
-export interface CascaderProps extends Omit<PickerProps, 'data' | 'onChange' | 'trigger'>, UseCascaderProps {
+export interface CascaderProps extends Omit<PickerProps, 'data' | 'onChange' | 'trigger' | 'scrollable'>, UseCascaderProps {
     /**
      * 将 check 子项拍平展示。暂不对外暴露
      * @private
@@ -18,7 +18,7 @@ export interface CascaderProps extends Omit<PickerProps, 'data' | 'onChange' | '
     /**
      * 次级菜单的展开方式
      */
-    expandTrigger?: ExpandTrigger;
+    expandTrigger?: CascaderExpandTriggerEnum;
     /**
      * 是否可搜索（仅在 title 为字符串时支持）
      */
@@ -62,13 +62,3 @@ export interface CascaderProps extends Omit<PickerProps, 'data' | 'onChange' | '
      */
     appearance?: HiBaseAppearanceEnum;
 }
-export declare const CascaderMenuList: React.ForwardRefExoticComponent<Pick<CascaderMenuListProps, string | number> & React.RefAttributes<HTMLDivElement | null>>;
-export interface CascaderMenuListProps extends HiBaseHTMLProps {
-}
-export declare const CascaderMenu: ({ prefixCls, role, className, data: menu, }: CascaderMenuProps) => JSX.Element;
-export interface CascaderMenuProps extends HiBaseHTMLProps {
-    /**
-     * 设置选择项数据源
-     */
-    data: FlattedCascaderItem[];
-}

package/lib/types/CascaderMenuList.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import type { HiBaseHTMLProps } from '@hi-ui/core';
+import { FlattedCascaderDataItem } from './types';
+export declare const CascaderMenuList: React.ForwardRefExoticComponent<Pick<CascaderMenuListProps, string | number> & React.RefAttributes<HTMLDivElement | null>>;
+export interface CascaderMenuListProps extends HiBaseHTMLProps {
+}
+export declare const CascaderMenu: ({ prefixCls, role, className, data: menu, }: CascaderMenuProps) => JSX.Element;
+export interface CascaderMenuProps extends HiBaseHTMLProps {
+    /**
+     * 设置选择项数据源
+     */
+    data: FlattedCascaderDataItem[];
+}

package/lib/types/context.d.ts

@@ -1,21 +1,21 @@
 import React from 'react';
-import { CascaderItemEventData, ExpandTrigger } from './types';
+import { CascaderItemEventData, CascaderExpandTriggerEnum } from './types';
 export declare const CascaderProvider: React.Provider<(Omit<{
     rootProps: {};
     reset: () => void;
     flattedData: any;
     value: React.ReactText[];
     tryChangeValue: (stateOrFunction: React.SetStateAction<React.ReactText[]>, ...args: any[]) => void;
-    getItemRequiredProps: ({ id, depth }: import("./types").FlattedCascaderItem) => import("./types").CascaderItemRequiredProps;
+    getItemRequiredProps: ({ id, depth }: import("./types").FlattedCascaderDataItem) => import("./types").CascaderItemRequiredProps;
     flatted: boolean;
     onItemClick: (node: CascaderItemEventData, onlyExpand?: any) => Promise<void>;
     onItemHover: (option: any) => void;
     changeOnSelect: boolean;
     onLoadChildren: ((item: CascaderItemEventData, idPaths: React.ReactText[]) => void | Promise<void | import("./types").CascaderDataItem[]>) | undefined;
     disabled: boolean;
-    menuList: import("./types").FlattedCascaderItem[][];
+    menuList: import("./types").FlattedCascaderDataItem[][];
 }, "rootProps"> & {
-    expandTrigger: ExpandTrigger;
+    expandTrigger: CascaderExpandTriggerEnum;
     titleRender: (item: CascaderItemEventData) => React.ReactNode;
 }) | null>;
 export declare const useCascaderContext: () => Omit<{
@@ -24,15 +24,15 @@ export declare const useCascaderContext: () => Omit<{
     flattedData: any;
     value: React.ReactText[];
     tryChangeValue: (stateOrFunction: React.SetStateAction<React.ReactText[]>, ...args: any[]) => void;
-    getItemRequiredProps: ({ id, depth }: import("./types").FlattedCascaderItem) => import("./types").CascaderItemRequiredProps;
+    getItemRequiredProps: ({ id, depth }: import("./types").FlattedCascaderDataItem) => import("./types").CascaderItemRequiredProps;
     flatted: boolean;
     onItemClick: (node: CascaderItemEventData, onlyExpand?: any) => Promise<void>;
     onItemHover: (option: any) => void;
     changeOnSelect: boolean;
     onLoadChildren: ((item: CascaderItemEventData, idPaths: React.ReactText[]) => void | Promise<void | import("./types").CascaderDataItem[]>) | undefined;
     disabled: boolean;
-    menuList: import("./types").FlattedCascaderItem[][];
+    menuList: import("./types").FlattedCascaderDataItem[][];
 }, "rootProps"> & {
-    expandTrigger: ExpandTrigger;
+    expandTrigger: CascaderExpandTriggerEnum;
     titleRender: (item: CascaderItemEventData) => React.ReactNode;
 };

package/lib/types/hooks/use-select.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
-import { CascaderItemEventData, FlattedCascaderItem } from '../types';
+import { CascaderItemEventData, FlattedCascaderDataItem } from '../types';
 /**
  * 用于选中的 hook
  */
-export declare const useSelect: (disabled: boolean, onSelect: (value: React.ReactText, item: CascaderItemEventData, itemPaths: FlattedCascaderItem[]) => void, changeOnSelect: boolean, onLoadChildren?: ((item: CascaderItemEventData, idPaths: React.ReactText[]) => void) | undefined) => readonly [React.ReactText, (targetItem: CascaderItemEventData, onlyExpand: boolean) => void, React.Dispatch<React.SetStateAction<React.ReactText>>];
+export declare const useSelect: (disabled: boolean, onSelect: (value: React.ReactText, item: CascaderItemEventData, itemPaths: FlattedCascaderDataItem[]) => void, changeOnSelect: boolean, onLoadChildren?: ((item: CascaderItemEventData, idPaths: React.ReactText[]) => void) | undefined) => readonly [React.ReactText, (targetItem: CascaderItemEventData, onlyExpand: boolean) => void, React.Dispatch<React.SetStateAction<React.ReactText>>];

package/lib/types/index.d.ts

@@ -1,3 +1,4 @@
 import './styles/index.scss';
 export * from './Cascader';
 export { Cascader as default } from './Cascader';
+export * from './types';

package/lib/types/types.d.ts

@@ -1,15 +1,15 @@
 import React from 'react';
 export interface CascaderDataItem extends Record<string, any> {
     /**
-     * 树节点唯一 id
+     * 选择项值，唯一 id
      */
     id?: React.ReactText;
     /**
-     * 树节点标题
+     * 选项标题
      */
     title?: React.ReactNode;
     /**
-     * 该节点的子节点列表
+     * 下一级选项列表
      */
     children?: CascaderDataItem[];
     /**
@@ -21,24 +21,24 @@ export interface CascaderDataItem extends Record<string, any> {
      */
     disabled?: boolean;
 }
-export interface FlattedCascaderItemWithChildren extends FlattedCascaderItem {
-    children: FlattedCascaderItem[];
+export interface FlattedCascaderDataItemWithChildren extends FlattedCascaderDataItem {
+    children: FlattedCascaderDataItem[];
 }
-export interface FlattedCascaderItem extends Required<Omit<CascaderDataItem, 'children'>> {
+export interface FlattedCascaderDataItem extends Required<Omit<CascaderDataItem, 'children'>> {
     /**
-     * 树节点唯一 id
+     * 选择项值，唯一 id
      */
     id: React.ReactText;
     /**
-     * 树节点标题
+     * 选项标题
      */
     title: React.ReactNode;
     /**
-     * 该节点的子节点列表
+     * 下一级选项列表
      */
-    children?: FlattedCascaderItem[];
+    children?: FlattedCascaderDataItem[];
     /**
-     * 关联用户传入的原始节点
+     * 关联用户传入的原始数据对象
      */
     raw: CascaderDataItem;
     /**
@@ -48,17 +48,14 @@ export interface FlattedCascaderItem extends Required<Omit<CascaderDataItem, 'ch
     /**
      * 该节点的父节点
      */
-    parent: FlattedCascaderItemWithChildren;
+    parent: FlattedCascaderDataItemWithChildren;
 }
 export interface CascaderItemRequiredProps {
     selected: boolean;
     loading: boolean;
     focused: boolean;
+    active: boolean;
 }
-export interface CascaderItemEventData extends FlattedCascaderItem, CascaderItemRequiredProps {
-}
-export declare type ExpandTrigger = 'click' | 'hover';
-export interface NodeRoot<T> {
-    depth: -1;
-    children: T[];
+export interface CascaderItemEventData extends FlattedCascaderDataItem, CascaderItemRequiredProps {
 }
+export declare type CascaderExpandTriggerEnum = 'click' | 'hover';