@kdcloudjs/kdesign 1.7.16 → 1.7.18

package/es/filter/style/index.css

@@ -327,7 +327,8 @@
   list-style: none;
 }
 .kd-filter .kd-filter-body-scheme-detail > li {
-  line-height: 40px;
+  line-height: normal;
+  padding: 7px 0 5px 0;
   color: var(--kd-g-color-text-primary, #212121);
   font-size: var(--kd-g-font-size-small, 12px);
 }

package/es/filter/style/index.less

@@ -117,7 +117,7 @@
         display: block;
       }
     }
-    
+
     &-condition {
       display: flex;
       font-size: @font-size-small;
@@ -221,7 +221,8 @@
       &-detail {
         list-style: none;
         > li {
-          line-height: 40px;
+          line-height: normal;
+          padding: 7px 0 5px 0;
           color: @color-text-primary;
           font-size: @font-size-small;
 

package/es/input/ClearableLabeledInput.js

@@ -1,7 +1,7 @@
 import _defineProperty from "@babel/runtime-corejs3/helpers/defineProperty";
 import _slicedToArray from "@babel/runtime-corejs3/helpers/slicedToArray";
 import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/concat";
-import React, { useState } from 'react';
+import React, { useRef, useState } from 'react';
 import { Icon } from '../index';
 import classNames from 'classnames';
 import { tuple } from '../_utils/type';
@@ -30,6 +30,7 @@ var ClearableInput = function ClearableInput(props) {
     inputCount = props.inputCount,
     count = props.count,
     status = props.status;
+  var fixRef = useRef(null);
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     isMouseEnter = _useState2[0],
@@ -44,6 +45,11 @@ var ClearableInput = function ClearableInput(props) {
     e.stopPropagation();
     e.preventDefault();
   };
+  var clickHandle = function clickHandle(e) {
+    var _a, _b;
+    e.stopPropagation();
+    (_b = (_a = fixRef.current) === null || _a === void 0 ? void 0 : _a.querySelector('input')) === null || _b === void 0 ? void 0 : _b.focus();
+  };
   var renderClearIcon = function renderClearIcon() {
     var _classNames;
     if (!allowClear) {
@@ -85,7 +91,9 @@ var ClearableInput = function ClearableInput(props) {
     var inputWrapperClasses = classNames((_classNames2 = {}, _defineProperty(_classNames2, "".concat(prefixCls, "-wrapper"), true), _defineProperty(_classNames2, "".concat(prefixCls, "-wrapper-focused"), focused && !disabled), _defineProperty(_classNames2, _concatInstanceProperty(_context = "".concat(prefixCls, "-wrapper-size-")).call(_context, size), size), _defineProperty(_classNames2, "".concat(prefixCls, "-wrapper-borderless"), borderType === 'none'), _defineProperty(_classNames2, "".concat(prefixCls, "-wrapper-underline"), borderType === 'underline'), _defineProperty(_classNames2, "".concat(prefixCls, "-error"), status === 'error'), _defineProperty(_classNames2, "".concat(prefixCls, "-wrapper-disabled"), disabled), _classNames2), _defineProperty({}, className, className && !addonBefore && !addonAfter));
     return /*#__PURE__*/React.createElement("span", {
       className: inputWrapperClasses,
+      ref: fixRef,
       style: style,
+      onClick: clickHandle,
       onMouseEnter: mouseEnterHandle,
       onMouseLeave: mouseLeaveHandle
     }, prefixNode, /*#__PURE__*/React.cloneElement(originElement, {

package/es/select/option.js

@@ -48,9 +48,12 @@ var InternalOption = function InternalOption(props, ref) {
     }
     onChangeSelect && onChangeSelect(value, children, isSelected);
   };
-  var handleOnMouseMove = function handleOnMouseMove() {
+  var handleOnMouseEnter = function handleOnMouseEnter() {
     onChangeActiveIndex && onChangeActiveIndex(index);
   };
+  var handleOnMouseLeave = function handleOnMouseLeave() {
+    onChangeActiveIndex && onChangeActiveIndex(-1);
+  };
   var titleText = title || (_typeof(children) !== 'object' ? children : null);
   var checkStyle = {
     minHeight: '22px',
@@ -61,7 +64,8 @@ var InternalOption = function InternalOption(props, ref) {
     className: optionCls,
     title: titleText,
     onClick: handleClick,
-    onMouseMove: handleOnMouseMove
+    onMouseEnter: handleOnMouseEnter,
+    onMouseLeave: handleOnMouseLeave
   }, /*#__PURE__*/React.createElement("div", {
     className: contentCls
   }, isMultiple ? /*#__PURE__*/React.createElement(Checkbox, {

package/es/select/select.js

@@ -53,7 +53,8 @@ var InternalSelect = function InternalSelect(props, ref) {
     children = selectProps.children,
     options = selectProps.options,
     placeholder = selectProps.placeholder,
-    dropdownStyle = selectProps.dropdownStyle,
+    _selectProps$dropdown = selectProps.dropdownStyle,
+    dropdownStyle = _selectProps$dropdown === void 0 ? {} : _selectProps$dropdown,
     style = selectProps.style,
     clearIcon = selectProps.clearIcon,
     filterOption = selectProps.filterOption,
@@ -82,6 +83,7 @@ var InternalSelect = function InternalSelect(props, ref) {
     selectMulOpts: []
   }); // 多选ref已选中项
   var measureRef = useRef(null);
+  var clearRef = useRef(null);
   var _useState = useState([]),
     _useState2 = _slicedToArray(_useState, 2),
     mulOptions = _useState2[0],
@@ -122,7 +124,7 @@ var InternalSelect = function InternalSelect(props, ref) {
   // 多选底部样式
   var multipleFooterCls = classNames(_defineProperty({}, "".concat(selectPrefixCls, "-multiple-footer"), true));
   // 多选，单选公共样式
-  var commCls = classNames((_classNames6 = {}, _defineProperty(_classNames6, "".concat(selectPrefixCls, "-bordered"), borderType === 'bordered'), _defineProperty(_classNames6, "".concat(selectPrefixCls, "-underline"), borderType === 'underline'), _defineProperty(_classNames6, "".concat(selectPrefixCls, "-borderless"), borderType === 'none'), _defineProperty(_classNames6, _concatInstanceProperty(_context = "".concat(selectPrefixCls, "-size-")).call(_context, size), size), _defineProperty(_classNames6, "".concat(selectPrefixCls, "-wrapper"), true), _defineProperty(_classNames6, "".concat(selectPrefixCls, "-show-search"), isShowSearch), _classNames6));
+  var commCls = classNames((_classNames6 = {}, _defineProperty(_classNames6, "".concat(selectPrefixCls, "-bordered"), borderType === 'bordered'), _defineProperty(_classNames6, "".concat(selectPrefixCls, "-underline"), borderType === 'underline'), _defineProperty(_classNames6, "".concat(selectPrefixCls, "-borderless"), borderType === 'none'), _defineProperty(_classNames6, _concatInstanceProperty(_context = "".concat(selectPrefixCls, "-size-")).call(_context, size), size), _defineProperty(_classNames6, "".concat(selectPrefixCls, "-wrapper"), true), _defineProperty(_classNames6, "".concat(selectPrefixCls, "-show-search"), isShowSearch && focusd), _classNames6));
   useEffect(function () {
     if (typeof props.visible !== 'undefined') {
       setOptionShow(props.visible);
@@ -268,7 +270,7 @@ var InternalSelect = function InternalSelect(props, ref) {
   }, [optionLabelProp, selectProps]);
   // 点击下拉列表中某项回调
   var handleOption = function handleOption(key, label, isSelected) {
-    var _a;
+    var _a, _b;
     var onSelect = selectProps.onSelect,
       onDeselect = selectProps.onDeselect,
       labelInValue = selectProps.labelInValue,
@@ -283,6 +285,8 @@ var InternalSelect = function InternalSelect(props, ref) {
     })) || {};
     if (isMultiple) {
       (_a = searchRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+    } else {
+      (_b = searchRef.current) === null || _b === void 0 ? void 0 : _b.blur();
     }
     var optionsObj = obj.props ? obj.props : obj || {};
     if (value !== undefined) {
@@ -439,17 +443,17 @@ var InternalSelect = function InternalSelect(props, ref) {
   var renderSuffix = function renderSuffix() {
     var _classNames7;
     var suffixIcon = selectProps.suffixIcon;
-    var selectedVal = multipleRef.current.selectedVal;
     // 选择器下拉icon样式
     var arrowIconCls = classNames((_classNames7 = {}, _defineProperty(_classNames7, "".concat(selectPrefixCls, "-icon-arrow"), true), _defineProperty(_classNames7, "".concat(selectPrefixCls, "-icon-arrow-up"), optionShow), _defineProperty(_classNames7, "".concat(selectPrefixCls, "-icon-arrow-down"), !optionShow), _defineProperty(_classNames7, "".concat(selectPrefixCls, "-icon-arrow-focus"), optionShow), _classNames7));
-    var iconShow = allowClear && !disabled && ((isMultiple ? mulOptions.length > 0 : (selectedVal !== null && selectedVal !== void 0 ? selectedVal : '') !== '') || searchValue);
+    var iconShow = allowClear && !disabled && ((isMultiple ? mulOptions.length > 0 : (singleVal !== null && singleVal !== void 0 ? singleVal : '') !== '') || searchValue);
     var clearIconCls = classNames(_defineProperty({}, "".concat(selectPrefixCls, "-icon-clear"), true));
     return /*#__PURE__*/React.createElement(React.Fragment, null, iconShow && /*#__PURE__*/React.createElement("span", {
       onClick: handleReset,
       onMouseDown: function onMouseDown(e) {
         return e.preventDefault();
       },
-      className: clearIconCls
+      className: clearIconCls,
+      ref: clearRef
     }, clearIcon || /*#__PURE__*/React.createElement(Icon, {
       type: "close-solid"
     })), showArrow && /*#__PURE__*/React.createElement("span", {
@@ -545,9 +549,6 @@ var InternalSelect = function InternalSelect(props, ref) {
       maxHeight: listHeight || '300px'
     };
     // 下拉框style属性
-    var dropDownStyle = _extends({
-      width: style === null || style === void 0 ? void 0 : style.width
-    }, dropdownStyle);
     var checkboxStyle = {
       height: '30px',
       background: 'none'
@@ -556,7 +557,7 @@ var InternalSelect = function InternalSelect(props, ref) {
     var checked = mulOptions.length === filledOptions.length;
     return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
       className: dropDownCls,
-      style: dropDownStyle,
+      style: dropdownStyle,
       ref: dropDownRef
     }, !dropdownRender && childrenToRender.length > 0 && dropRender(eleOptionList, heightStyle), renderNotContent(), /*#__PURE__*/React.createElement("div", null, dropdownRender && dropdownRender(dropRender(childrenToRender, heightStyle))), isMultiple && realChildren.length > 0 && /*#__PURE__*/React.createElement("div", {
       className: multipleFooterCls
@@ -720,7 +721,18 @@ var InternalSelect = function InternalSelect(props, ref) {
       onDropdownVisibleChange && onDropdownVisibleChange(true);
     }
   }, [optionShow]);
-  var _useState13 = useState(getActiveIndex(0)),
+  useEffect(function () {
+    var _a;
+    var fn = function fn(e) {
+      e.stopPropagation();
+    };
+    (_a = clearRef.current) === null || _a === void 0 ? void 0 : _a.addEventListener('mouseup', fn);
+    return function () {
+      var _a;
+      (_a = clearRef.current) === null || _a === void 0 ? void 0 : _a.removeEventListener('mouseup', fn);
+    };
+  }, [singleVal, mulOptions]);
+  var _useState13 = useState(isShowSearch ? getActiveIndex(0) : -1),
     _useState14 = _slicedToArray(_useState13, 2),
     activeIndex = _useState14[0],
     setActiveIndex = _useState14[1];
@@ -814,13 +826,19 @@ var InternalSelect = function InternalSelect(props, ref) {
     if (selectRef === null || selectRef === void 0 ? void 0 : selectRef.current) {
       var _ref2 = (_a = selectRef.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect(),
         width = _ref2.width;
-      return _extends({
-        width: (dropdownStyle === null || dropdownStyle === void 0 ? void 0 : dropdownStyle.width) || (width > 75 ? width : 75),
+      return _extends(_extends(_extends({
+        minWidth: width,
+        maxWidth: 600
+      }, dropdownStyle), {
+        width: (dropdownStyle === null || dropdownStyle === void 0 ? void 0 : dropdownStyle.width) || 'auto',
         zIndex: 1050
-      }, popperStyle);
+      }), popperStyle);
     }
   };
   var handleVisibleChange = function handleVisibleChange(visible) {
+    if (!visible) {
+      setActiveIndex(isShowSearch ? getActiveIndex(0) : -1);
+    }
     if (visible !== optionShow) {
       props.visible === undefined && setOptionShow(visible);
       onVisibleChange && onVisibleChange(visible);

package/es/select/style/index.css

@@ -249,7 +249,7 @@
 .kd-select-visible .kd-select-icon-active {
   color: #3761ca;
 }
-.kd-select-visible .kd-select-selection-item {
+.kd-select-visible div.kd-select-show-search .kd-select-selection-item {
   color: var(--kd-c-select-placeholder-color-text, #b2b2b2);
 }
 .kd-select-icon-arrow {
@@ -277,9 +277,6 @@
   transition: transform calc(0.3s - 0.1s) cubic-bezier(0.4, 0, 0.6, 1);
   transition: transform calc(0.3s - 0.1s) cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform calc(0.3s - 0.1s) cubic-bezier(0.4, 0, 0.6, 1);
 }
-.kd-select-icon-arrow-focus {
-  color: var(--kd-c-select-color-border-foucs, var(--kd-g-color-theme, #5582f3));
-}
 .kd-select-icon-clear {
   opacity: 0;
   z-index: 1;
@@ -362,7 +359,7 @@
   z-index: var(--kd-c-select-z-index, var(--kd-g-z-index-popper, 1050));
   -webkit-box-sizing: border-box;
           box-sizing: border-box;
-  padding: 4px 0;
+  padding: 8px 0;
   margin: 0;
   overflow: auto;
   font-size: var(--kd-c-select-dropdown-font-size, 12px);
@@ -415,9 +412,6 @@
 .kd-select-item-option-content .kd-checkbox .kd-checkbox-children {
   display: inline-block;
 }
-.kd-select-item-option:hover:not(.kd-select-item-option-selected):not(.kd-select-item-option-disabled) {
-  background-color: var(--kd-c-select-color-background, #f5f5f5);
-}
 .kd-select-item-option-active:not(.kd-select-item-option-disabled) {
   background-color: var(--kd-c-select-color-background, #f5f5f5);
 }

package/es/select/style/index.less

@@ -21,7 +21,8 @@
     .@{select-prefix-cls}-icon-active {
       color: #3761ca;
     }
-    .@{select-prefix-cls}-selection-item {
+
+    & div.@{select-prefix-cls}-show-search .@{select-prefix-cls}-selection-item {
       color: @select-placeholder-color;
     }
   }
@@ -40,10 +41,6 @@
         transform: rotate(0deg);
         transition: transform calc(@transition-duration - 0.1s) @ease;
       }
-
-      &-focus {
-        color: @select-g-color-border-foucs;
-      }
     }
 
     &-clear {
@@ -135,7 +132,7 @@
     left: 0;
     z-index: @select-z-index;
     box-sizing: border-box;
-    padding: 4px 0; // update
+    padding: 8px 0; // update
     margin: 0;
     overflow: auto;
     font-size: @select-list-font-size; // update
@@ -184,10 +181,6 @@
         }
       }
 
-      &:hover:not(&-selected):not(&-disabled) {
-        background-color: @select-item-active-bg;
-      }
-
       &-active:not(&-disabled) {
         background-color: @select-item-active-bg;
       }

package/lib/card/card.js

@@ -9,6 +9,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
+var _getOwnPropertySymbols = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols"));
 var React = _interopRequireWildcard(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _checkbox = _interopRequireDefault(require("../checkbox"));
@@ -16,37 +17,46 @@ var _utils = require("../_utils");
 var _configProvider = require("../config-provider");
 function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+var __rest = void 0 && (void 0).__rest || function (s, e) {
+  var t = {};
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  if (s != null && typeof _getOwnPropertySymbols.default === "function") for (var i = 0, p = (0, _getOwnPropertySymbols.default)(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
 var Card = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var _React$useContext = React.useContext(_configProvider.ConfigContext),
     getPrefixCls = _React$useContext.getPrefixCls,
     pkgPrefixCls = _React$useContext.prefixCls,
     userDefaultProps = _React$useContext.compDefaultProps;
   // 属性需要合并一遍用户定义的默认属性
-  var _getCompProps = (0, _utils.getCompProps)('Card', userDefaultProps, props),
-    tags = _getCompProps.tags,
-    style = _getCompProps.style,
-    title = _getCompProps.title,
-    avatar = _getCompProps.avatar,
-    actions = _getCompProps.actions,
-    extra = _getCompProps.extra,
-    children = _getCompProps.children,
-    className = _getCompProps.className,
-    hoverable = _getCompProps.hoverable,
-    headStyle = _getCompProps.headStyle,
-    bodyStyle = _getCompProps.bodyStyle,
-    selectable = _getCompProps.selectable,
-    checkboxProps = _getCompProps.checkboxProps,
-    customPrefixcls = _getCompProps.prefixCls;
+  var _a = (0, _utils.getCompProps)('Card', userDefaultProps, props),
+    tags = _a.tags,
+    style = _a.style,
+    title = _a.title,
+    avatar = _a.avatar,
+    actions = _a.actions,
+    extra = _a.extra,
+    children = _a.children,
+    className = _a.className,
+    hoverable = _a.hoverable,
+    headStyle = _a.headStyle,
+    bodyStyle = _a.bodyStyle,
+    selectable = _a.selectable,
+    checkboxProps = _a.checkboxProps,
+    customPrefixcls = _a.prefixCls,
+    others = __rest(_a, ["tags", "style", "title", "avatar", "actions", "extra", "children", "className", "hoverable", "headStyle", "bodyStyle", "selectable", "checkboxProps", "prefixCls"]);
   // className前缀
   var prefixCls = getPrefixCls(pkgPrefixCls, 'card', customPrefixcls);
   var cardClassName = (0, _classnames.default)(prefixCls, {
     hoverable: hoverable
   }, className);
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React.createElement("div", (0, _extends2.default)({
     ref: ref,
     className: cardClassName,
     style: style
-  }, title && !avatar && /*#__PURE__*/React.createElement("header", {
+  }, others), title && !avatar && /*#__PURE__*/React.createElement("header", {
     className: "".concat(prefixCls, "-header"),
     style: headStyle
   }, title), avatar && /*#__PURE__*/React.createElement("header", {

package/lib/carousel/carousel.js

@@ -88,8 +88,8 @@ var InternalCarousel = function InternalCarousel(props, ref) {
   var setScrollXEffectStyle = _react.default.useCallback(function () {
     var _context;
     if (!listRef.current) return;
-    listRef.current.style.cssText = needAnimation ? (0, _concat.default)(_context = "transform: translateX(".concat(posX, "px); transition:all 0.3s ")).call(_context, easing) : "transform: translateX(".concat(posX, "px); transition:'none'");
-  }, [needAnimation, easing, posX]);
+    listRef.current.style.cssText = needAnimation ? (0, _concat.default)(_context = "transform: translateX(".concat(posX, "px); transition:all 0.3s ")).call(_context, easing) : "transform: translateX(".concat(posX, "px); transition:none");
+  }, [children === null || children === void 0 ? void 0 : children.length, needAnimation, easing, posX]);
   var jumpTo = _react.default.useCallback(function (index, needAnimation) {
     if (isFadeEffect) {
       if (index === -1 || index === children.length) index = 0;
@@ -227,6 +227,7 @@ var InternalCarousel = function InternalCarousel(props, ref) {
       content = /*#__PURE__*/_react.default.createElement(_slideList.SlideList, {
         items: children,
         parentPrefixCls: carouselPrefixCls,
+        currentIndex: currentIndex,
         ref: listRef
       });
     }

package/lib/carousel/slideList.d.ts

@@ -6,6 +6,7 @@ declare type ItemType = {
 export interface SlideListProps {
     parentPrefixCls: string;
     items: ItemType[];
+    currentIndex: number;
 }
 export declare const SlideList: React.ForwardRefExoticComponent<SlideListProps & React.RefAttributes<unknown>>;
 export {};

package/lib/carousel/slideList.js

@@ -5,14 +5,17 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.SlideList = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
 var _concat = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/concat"));
 var _slice = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/slice"));
 var _map = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/map"));
+var _classnames = _interopRequireDefault(require("classnames"));
 var _react = _interopRequireDefault(require("react"));
 var SlideList = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   var _context2;
   var items = props.items,
-    parentPrefixCls = props.parentPrefixCls;
+    parentPrefixCls = props.parentPrefixCls,
+    currentIndex = props.currentIndex;
   var slideListPrefixCls = "".concat(parentPrefixCls, "-list-slide");
   var listPrefixCls = "".concat(parentPrefixCls, "-list");
   var renderItems = function renderItems() {
@@ -20,7 +23,7 @@ var SlideList = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     var _items = (0, _concat.default)(_context = (0, _slice.default)(items).call(items, -1)).call(_context, items, (0, _slice.default)(items).call(items, 0, 1)); // 首位分别添加一项
     return (0, _map.default)(_items).call(_items, function (item, index) {
       return /*#__PURE__*/_react.default.createElement("li", {
-        className: "".concat(listPrefixCls, "-item"),
+        className: (0, _classnames.default)("".concat(listPrefixCls, "-item"), (0, _defineProperty2.default)({}, "".concat(listPrefixCls, "-item-active"), currentIndex === index - 1)),
         key: index
       }, item);
     });

package/lib/cascader/cascader.js

@@ -72,38 +72,41 @@ var Cascader = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     onPopupVisibleChange = allProps.onPopupVisibleChange,
     onPopperVisibleChange = allProps.onPopperVisibleChange,
     customPrefixcls = allProps.prefixCls,
+    customAllowClear = allProps.allowClear,
+    popupPlacement = allProps.popupPlacement,
+    maxTagCount = allProps.maxTagCount,
     otherProps = __rest(allProps
     // className前缀
-    , ["mode", "style", "options", "bordered", "disabled", "children", "loadData", "clearIcon", "className", "fieldNames", "placeholder", "defaultValue", "maxTagPlaceholder", "displayRender", "expandTrigger", "changeOnSelect", "dropdownRender", "notFoundContent", "getPopupContainer", "defaultPopupVisible", "onPopupVisibleChange", "onPopperVisibleChange", "prefixCls"]);
+    , ["mode", "style", "options", "bordered", "disabled", "children", "loadData", "clearIcon", "className", "fieldNames", "placeholder", "defaultValue", "maxTagPlaceholder", "displayRender", "expandTrigger", "changeOnSelect", "dropdownRender", "notFoundContent", "getPopupContainer", "defaultPopupVisible", "onPopupVisibleChange", "onPopperVisibleChange", "prefixCls", "allowClear", "popupPlacement", "maxTagCount"]);
   // className前缀
   var prefixCls = getPrefixCls(pkgPrefixCls, 'cascader', customPrefixcls);
-  var pickerRef = _react.default.useRef();
-  var triggerRef = _react.default.useRef();
-  var wrapperRef = _react.default.useRef();
+  var pickerRef = (0, _react.useRef)();
+  var triggerRef = (0, _react.useRef)();
+  var wrapperRef = (0, _react.useRef)();
   var mergeRef = ref || pickerRef;
-  var _React$useState = _react.default.useState(!!props.popperVisible || !!props.popupVisible || defaultPopupVisible),
-    _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
-    visible = _React$useState2[0],
-    setVisible = _React$useState2[1];
+  var _useState = (0, _react.useState)(!!props.popperVisible || !!props.popupVisible || defaultPopupVisible),
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    visible = _useState2[0],
+    setVisible = _useState2[1];
   _react.default.useEffect(function () {
     setVisible(!!props.popperVisible || !!props.popupVisible);
   }, [props.popperVisible, props.popupVisible]);
-  var _React$useState3 = _react.default.useState([options]),
-    _React$useState4 = (0, _slicedToArray2.default)(_React$useState3, 2),
-    menus = _React$useState4[0],
-    setMenus = _React$useState4[1];
-  var _React$useState5 = _react.default.useState([]),
-    _React$useState6 = (0, _slicedToArray2.default)(_React$useState5, 2),
-    currentOptions = _React$useState6[0],
-    setCurrentOptions = _React$useState6[1];
-  var _React$useState7 = _react.default.useState([]),
-    _React$useState8 = (0, _slicedToArray2.default)(_React$useState7, 2),
-    selectedOptions = _React$useState8[0],
-    setSelectedOptions = _React$useState8[1];
-  var _React$useState9 = _react.default.useState(props.value || defaultValue || []),
-    _React$useState10 = (0, _slicedToArray2.default)(_React$useState9, 2),
-    value = _React$useState10[0],
-    setValue = _React$useState10[1];
+  var _useState3 = (0, _react.useState)([options]),
+    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+    menus = _useState4[0],
+    setMenus = _useState4[1];
+  var _useState5 = (0, _react.useState)([]),
+    _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
+    currentOptions = _useState6[0],
+    setCurrentOptions = _useState6[1];
+  var _useState7 = (0, _react.useState)([]),
+    _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
+    selectedOptions = _useState8[0],
+    setSelectedOptions = _useState8[1];
+  var _useState9 = (0, _react.useState)(props.value || defaultValue || []),
+    _useState10 = (0, _slicedToArray2.default)(_useState9, 2),
+    value = _useState10[0],
+    setValue = _useState10[1];
   _react.default.useEffect(function () {
     props.value && setValue(props.value);
   }, [props.value]);
@@ -205,37 +208,10 @@ var Cascader = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
       });
     });
   }, [currentOptions, isMultiple]);
-  var allowClear = allProps.allowClear && value.length > 0;
-  var locatorProps = {
-    style: style,
-    tabIndex: 0,
-    className: (0, _classnames.default)("".concat(prefixCls, "-picker"), className, {
-      expand: visible,
-      allowClear: allowClear,
-      disabled: disabled
-    })
-  };
+  var allowClear = customAllowClear && value.length > 0;
   var handleClear = function handleClear() {
     onChange([]);
   };
-  var inputProps = {
-    value: value,
-    placeholder: placeholder,
-    readOnly: true,
-    disabled: disabled,
-    className: (0, _classnames.default)("".concat(prefixCls, "-picker-input"), {
-      expand: visible
-    }),
-    suffix: props.suffixIcon || /*#__PURE__*/_react.default.createElement(_icon.default, {
-      type: "arrow-down",
-      className: (0, _classnames.default)({
-        expand: visible
-      })
-    })
-  };
-  if (bordered) {
-    inputProps.borderType = 'bordered';
-  }
   var renderSuffix = function renderSuffix() {
     var _classNames;
     var suffixIcon = allProps.suffixIcon;
@@ -273,8 +249,6 @@ var Cascader = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   };
   var renderMultiple = function renderMultiple() {
     var _classNames3, _classNames4;
-    var maxTagCount = allProps.maxTagCount,
-      maxTagPlaceholder = allProps.maxTagPlaceholder;
     var multipleCls = (0, _classnames.default)((_classNames3 = {
       disabled: disabled
     }, (0, _defineProperty2.default)(_classNames3, "".concat(prefixCls, "-multiple"), true), (0, _defineProperty2.default)(_classNames3, "".concat(prefixCls, "-bordered"), bordered), _classNames3));
@@ -313,19 +287,44 @@ var Cascader = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     }, renderSuffix())));
   };
   var renderSingle = function renderSingle() {
-    return /*#__PURE__*/_react.default.createElement("span", (0, _extends2.default)({}, locatorProps, {
+    var inputProps = {
+      value: value,
+      placeholder: placeholder,
+      readOnly: true,
+      borderType: bordered ? 'bordered' : 'underline',
+      disabled: disabled,
+      className: (0, _classnames.default)("".concat(prefixCls, "-picker-input"), {
+        expand: visible
+      }),
+      suffix: props.suffixIcon || /*#__PURE__*/_react.default.createElement(_icon.default, {
+        type: "arrow-down",
+        className: (0, _classnames.default)({
+          expand: visible
+        })
+      })
+    };
+    var singleProps = {
+      style: style,
+      tabIndex: 0,
+      className: (0, _classnames.default)("".concat(prefixCls, "-picker"), className, (0, _defineProperty2.default)({
+        expand: visible,
+        allowClear: allowClear,
+        disabled: disabled
+      }, "".concat(prefixCls, "-bordered"), bordered))
+    };
+    return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({}, singleProps, {
       ref: mergeRef
     }, otherProps), _react.default.Children.count(children) === 1 && children.type ? /*#__PURE__*/_react.default.cloneElement(children, {
       ref: triggerRef
-    }) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("span", {
+    }) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
       ref: triggerRef
     }, /*#__PURE__*/_react.default.createElement(_input.default, (0, _extends2.default)({}, inputProps)), /*#__PURE__*/_react.default.createElement("span", {
       className: "".concat(prefixCls, "-picker-label")
-    }, (labels === null || labels === void 0 ? void 0 : labels.length) ? displayRender(labels, currentOptions) : '')), allowClear && /*#__PURE__*/_react.default.createElement(_icon.default, {
+    }, (labels === null || labels === void 0 ? void 0 : labels.length) ? displayRender(labels, currentOptions) : ''), allowClear && /*#__PURE__*/_react.default.createElement(_icon.default, {
       type: "close-solid",
       className: "".concat(prefixCls, "-picker-close"),
       onClick: handleClear
-    })));
+    }))));
   };
   var cascaderLocator = isMultiple ? renderMultiple() : renderSingle();
   var onExpend = function onExpend(index, opt, opts) {
@@ -437,7 +436,7 @@ var Cascader = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     trigger: 'click',
     getPopupContainer: getPopupContainer,
     prefixCls: "".concat(prefixCls, "-menus"),
-    placement: allProps.popperPlacement || allProps.popupPlacement,
+    placement: allProps.popperPlacement || popupPlacement,
     popperClassName: allProps.popperClassName || allProps.popupClassName,
     getTriggerElement: function getTriggerElement() {
       return triggerRef.current;