@kdcloudjs/kdesign 1.7.1 → 1.7.3

package/es/color-picker/constant/colorTypes.js

@@ -3,11 +3,11 @@ export var colorTypes = [{
   value: '#b2b2b2'
 }, {
   type: 'HSB',
-  value: 'hsb(0,0%,70%)'
+  value: 'hsb(0, 0%, 70%)'
 }, {
   type: 'RGB',
-  value: 'rgb(178,178,178)'
+  value: 'rgb(178, 178, 178)'
 }, {
   type: 'HSL',
-  value: 'hsl(0,0%,70%)'
+  value: 'hsl(0, 0%, 70%)'
 }];

package/es/color-picker/style/index.css

@@ -254,8 +254,14 @@
           box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2);
   border-radius: 2px;
 }
-.kd-color-picker-pop .kd-color-picker-panel-input .kd-select .kd-select-dropdown {
-  overflow: hidden;
+.kd-color-picker-pop .kd-color-picker-panel-input .kd-select .kd-select-dropdown .kd-select-item-option {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: center;
+      -ms-flex-pack: center;
+          justify-content: center;
+  min-width: unset;
 }
 .kd-color-picker-pop .kd-color-picker-panel-input .kd-select-bordered {
   border-radius: 2px;

package/es/color-picker/style/index.less

@@ -179,7 +179,11 @@
                 }
 
                 .@{kd-prefix}-select-dropdown {
-                    overflow: hidden;
+                    .@{kd-prefix}-select-item-option {
+                        display: flex;
+                        justify-content: center;
+                        min-width: unset;
+                    }
                 }
             }
 

package/es/config-provider/compDefaultProps.d.ts

@@ -436,6 +436,7 @@ declare const compDefaultProps: {
         placeholder: string;
         optionLabelProp: string;
         treeNodeFilterProp: string;
+        treeExpandOnClickNode: boolean;
         showSearch: boolean;
         switcherIcon: () => JSX.Element;
         expandOnClickNode: boolean;

package/es/config-provider/compDefaultProps.js

@@ -450,6 +450,7 @@ var compDefaultProps = {
     placeholder: '请输入需要搜索的内容',
     optionLabelProp: 'title',
     treeNodeFilterProp: 'title',
+    treeExpandOnClickNode: true,
     showSearch: true,
     switcherIcon: function switcherIcon() {
       return /*#__PURE__*/React.createElement(Icon, {

package/es/dropdown/dropdown.js

@@ -16,7 +16,7 @@ var findItem = function findItem(element) {
   }
 };
 var Dropdown = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
+  var _a, _b, _c;
   var _React$useContext = React.useContext(ConfigContext),
     getPrefixCls = _React$useContext.getPrefixCls,
     pkgPrefixCls = _React$useContext.prefixCls,
@@ -74,12 +74,7 @@ var Dropdown = /*#__PURE__*/React.forwardRef(function (props, ref) {
     onClick: handleItemClick,
     selectable: menuSelectable
   });
-  var isItem = React.Children.count((_d = menu.props) === null || _d === void 0 ? void 0 : _d.children) === 1 && ((_g = (_f = (_e = menu.props) === null || _e === void 0 ? void 0 : _e.children) === null || _f === void 0 ? void 0 : _f.type) === null || _g === void 0 ? void 0 : _g.displayName) === 'DropdownMenuItem' || Array.isArray((_k = (_j = (_h = menu.props) === null || _h === void 0 ? void 0 : _h.children) === null || _j === void 0 ? void 0 : _j.props) === null || _k === void 0 ? void 0 : _k.children) || ((_p = (_o = (_m = (_l = menu.props) === null || _l === void 0 ? void 0 : _l.children) === null || _m === void 0 ? void 0 : _m.props) === null || _o === void 0 ? void 0 : _o.children.type) === null || _p === void 0 ? void 0 : _p.displayName) === 'DropdownMenuItem';
-  var menuElement = isMenu ? Array.isArray((_q = menu.props) === null || _q === void 0 ? void 0 : _q.children) || isItem ? cloneObj : /*#__PURE__*/React.createElement("ul", {
-    className: "".concat(prefixCls, "-menu"),
-    onClick: handleItemClick,
-    role: "menu"
-  }, menu.props.children) : /*#__PURE__*/React.createElement("ul", {
+  var menuElement = isMenu ? cloneObj : /*#__PURE__*/React.createElement("ul", {
     className: "".concat(prefixCls, "-menu"),
     onClick: handleItemClick,
     role: "menu"

package/es/dropdown/menu.js

@@ -30,6 +30,9 @@ var Menu = /*#__PURE__*/React.forwardRef(function (props, ref) {
   // className前缀
   var prefixCls = getPrefixCls(pkgPrefixCls, 'dropdown-menu', customPrefixcls);
   var cloneItem = function cloneItem(item, index) {
+    if (! /*#__PURE__*/React.isValidElement(item)) {
+      return item;
+    }
     var key = item.key || index;
     var selected = selectable && String(selectedKey) === String(key);
     return /*#__PURE__*/React.cloneElement(item, {

package/es/modal/modal.d.ts

@@ -1,5 +1,6 @@
 import React, { ReactNode, CSSProperties } from 'react';
 import { IButtonProps } from '../button/button';
+import type { DraggableBounds, DraggableEventHandler } from 'react-draggable';
 declare type CSSSelector = string;
 export declare const ConfirmModalTypes: string[];
 export declare const ModalTypes: ["confirm", "warning", "error", "normal"];
@@ -8,6 +9,7 @@ export interface IModalProps {
     body?: ReactNode;
     bodyClassName?: string;
     bodyStyle?: CSSProperties;
+    style?: CSSProperties;
     cancelButtonProps?: IButtonProps;
     cancelText?: ReactNode;
     className?: string;
@@ -40,6 +42,10 @@ export interface IModalProps {
     visible?: boolean;
     width?: number;
     showline?: boolean;
+    bounds?: DraggableBounds | string | false;
+    onDragStart?: DraggableEventHandler;
+    onDrag?: DraggableEventHandler;
+    onDragStop?: DraggableEventHandler;
 }
-declare const Modal: React.FC<IModalProps>;
+declare const Modal: React.ForwardRefExoticComponent<IModalProps & React.RefAttributes<unknown>>;
 export default Modal;

package/es/modal/modal.js

@@ -1,8 +1,17 @@
 import _defineProperty from "@babel/runtime-corejs3/helpers/defineProperty";
 import _extends from "@babel/runtime-corejs3/helpers/extends";
 import _slicedToArray from "@babel/runtime-corejs3/helpers/slicedToArray";
+import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
 import _includesInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/includes";
 import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/concat";
+var __rest = this && this.__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 _Object$getOwnPropertySymbols === "function") for (var i = 0, p = _Object$getOwnPropertySymbols(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;
+};
 import React, { useContext, useEffect, useState, useRef, useCallback } from 'react';
 import { Icon } from '../index';
 import Button from '../button/button';
@@ -17,7 +26,7 @@ import { getLangMsg } from '../locale/locale';
 import { useHideDocumentScrollBar } from '../_utils/hooks';
 export var ConfirmModalTypes = ['confirm', 'normal'];
 export var ModalTypes = tuple('confirm', 'warning', 'error', 'normal');
-var Modal = function Modal(props) {
+var InternalModal = function InternalModal(props, ref) {
   var _classNames3, _classNames4, _context2, _context3;
   var _useContext = useContext(ConfigContext),
     getPrefixCls = _useContext.getPrefixCls,
@@ -55,14 +64,20 @@ var Modal = function Modal(props) {
     type = modalProps.type,
     visible = modalProps.visible,
     width = modalProps.width,
-    showline = modalProps.showline;
+    showline = modalProps.showline,
+    onDragStart = modalProps.onDragStart,
+    onDrag = modalProps.onDrag,
+    onDragStop = modalProps.onDragStop,
+    bounds = modalProps.bounds,
+    others = __rest(modalProps, ["body", "bodyClassName", "bodyStyle", "cancelButtonProps", "cancelText", "className", "closable", "closeIcon", "destroyOnClose", "draggable", "focusTriggerAfterClose", "footer", "footerClassName", "footerStyle", "footerBtnOrder", "getContainer", "height", "keyboard", "mask", "maskClosable", "maskStyle", "okButtonProps", "okText", "onCancel", "onOk", "prefixCls", "title", "titleIcon", "type", "visible", "width", "showline", "onDragStart", "onDrag", "onDragStop", "bounds"]);
   var isForceController = visible !== undefined;
   var _useState = useState(isForceController ? visible : true),
     _useState2 = _slicedToArray(_useState, 2),
     innerVisible = _useState2[0],
     setInnerVisible = _useState2[1]; // 需要根据visible来判断，不能一开始为true再去设置false
   var previousActiveElement = useRef(null);
-  var containerRef = useRef(null);
+  var innerRef = useRef(null);
+  var containerRef = ref || innerRef;
   var modalPrefixCls = getPrefixCls(prefixCls, 'modal', customPrefixcls);
   devWarning(ModalTypes.indexOf(type) === -1, 'modal', "cannot found modal type '".concat(type, "'"));
   var modalContainer = typeof getContainer === 'function' ? getContainer() : getContainer;
@@ -207,6 +222,10 @@ var Modal = function Modal(props) {
   }, footer || generatorFooterByType(type)));
   // 没有容器应该是不用居中的
   // 但仍可拖拽
+  var handleDragStart = function handleDragStart(e, data) {
+    e === null || e === void 0 ? void 0 : e.stopPropagation();
+    onDragStart === null || onDragStart === void 0 ? void 0 : onDragStart(e, data);
+  };
   var defaultPosition = modalContainer ? {
     x: -(width / 2),
     y: -(height / 2)
@@ -214,9 +233,9 @@ var Modal = function Modal(props) {
     x: 0,
     y: 0
   };
-  var comp = /*#__PURE__*/React.createElement("div", {
+  var comp = /*#__PURE__*/React.createElement("div", _extends({
     className: modalClasses
-  }, mask && /*#__PURE__*/React.createElement("div", {
+  }, others), mask && /*#__PURE__*/React.createElement("div", {
     onClick: handleMaskClick,
     className: "".concat(modalPrefixCls, "-mask"),
     style: maskStyle
@@ -224,11 +243,16 @@ var Modal = function Modal(props) {
     defaultPosition: defaultPosition,
     handle: ".".concat(headerClass),
     disabled: !draggable,
+    onStart: handleDragStart,
+    onDrag: onDrag,
+    onStop: onDragStop,
+    bounds: bounds,
     cancel: _concatInstanceProperty(_context3 = ".".concat(modalPrefixCls, "-title-container, .")).call(_context3, modalPrefixCls, "-close-icon")
   }, container));
   var renderComp = ((isForceController ? visible : innerVisible) || !destroyOnClose) && comp;
   if (modalContainer && renderComp) return /*#__PURE__*/ReactDOM.createPortal(renderComp, modalContainer);
   return renderComp || null;
 };
+var Modal = /*#__PURE__*/React.forwardRef(InternalModal);
 Modal.displayName = 'Modal';
 export default Modal;

package/es/select/select.js

@@ -88,10 +88,11 @@ var InternalSelect = function InternalSelect(props, ref) {
     _useState4 = _slicedToArray(_useState3, 2),
     singleVal = _useState4[0],
     setSingleVal = _useState4[1];
-  var _useState5 = useState(!!props.visible || defaultOpen),
+  var _useState5 = useState(typeof props.visible === 'undefined' ? !!defaultOpen : !!props.visible),
     _useState6 = _slicedToArray(_useState5, 2),
     optionShow = _useState6[0],
-    setOptionShow = _useState6[1]; // 下拉列表是否展示
+    setOptionShow = _useState6[1];
+  // 下拉列表是否展示
   // const [searchInput, setSearchInput] = useState<string>('') // 搜索框值
   var _useState7 = useState(''),
     _useState8 = _slicedToArray(_useState7, 2),
@@ -118,7 +119,9 @@ var InternalSelect = function InternalSelect(props, ref) {
   // 多选，单选公共样式
   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), _classNames6));
   useEffect(function () {
-    setOptionShow(!!props.visible);
+    if (typeof props.visible !== 'undefined') {
+      setOptionShow(props.visible);
+    }
   }, [props.visible]);
   // realchildren更新时数据处理---待解决
   useEffect(function () {

package/es/tree/tree.d.ts

@@ -39,6 +39,7 @@ export interface TreeProps {
     setTreeNodeStyle?: (node: any) => Map<string, string>;
     estimatedItemSize?: number;
     expandOnClickNode?: boolean;
+    onlyExpandOnClickIcon?: boolean;
 }
 export declare type TreeNodeData = {
     checkable?: boolean;

package/es/tree/tree.js

@@ -64,6 +64,8 @@ var InternalTree = /*#__PURE__*/React.forwardRef(function (props, ref) {
     filterTreeNode = TreeProps.filterTreeNode,
     filterValue = TreeProps.filterValue,
     expandOnClickNode = TreeProps.expandOnClickNode,
+    _TreeProps$onlyExpand = TreeProps.onlyExpandOnClickIcon,
+    onlyExpandOnClickIcon = _TreeProps$onlyExpand === void 0 ? false : _TreeProps$onlyExpand,
     loadData = TreeProps.loadData,
     notFoundContent = TreeProps.notFoundContent;
   var treePrefixCls = getPrefixCls(prefixCls, 'tree', customPrefixcls); // 树样式前缀
@@ -403,6 +405,7 @@ var InternalTree = /*#__PURE__*/React.forwardRef(function (props, ref) {
     item.dragOver = dragOverNodeKey === item.key && dropPosition === 0;
     item.dropPosition = dropPosition;
     item.expandOnClickNode = expandOnClickNode;
+    item.onlyExpandOnClickIcon = onlyExpandOnClickIcon;
     item.loading = loadingKeys.has(item.key) && !loadedKeys.has(item.key);
     item.loadData = loadData;
     return /*#__PURE__*/React.createElement(TreeNode, _extends({}, item, {

package/es/tree/treeHooks.js

@@ -116,7 +116,7 @@ export var useSelect = function useSelect(selectedKeysProps, defaultSelectedKeys
     selectedKeys = _useState2[0],
     setSelectedKeys = _useState2[1];
   useEffect(function () {
-    setSelectedKeys(selectedKeysProps);
+    selectedKeysProps && setSelectedKeys(selectedKeysProps);
   }, [selectedKeysProps]);
   return [selectedKeys, setSelectedKeys];
 };

package/es/tree/treeNode.d.ts

@@ -26,6 +26,8 @@ export interface TreeNodeProps {
     estimatedItemSize?: number;
     dragOver?: boolean;
     isLeaf?: boolean;
+    expandOnClickNode?: boolean;
+    onlyExpandOnClickIcon?: boolean;
     onCheck?: (key: string, value: boolean, node: React.ReactNode, event: React.MouseEvent<MouseEvent>, pos: string) => void;
     onSelect?: (event: React.MouseEvent<MouseEvent>, node: React.ReactNode, key: string) => void;
     onExpand?: (value: boolean, node: React.ReactNode) => void;

package/es/tree/treeNode.js

@@ -51,6 +51,7 @@ var TreeNode = /*#__PURE__*/React.forwardRef(function (props, ref) {
     dragOver = TreeNodeProps.dragOver,
     dropPosition = TreeNodeProps.dropPosition,
     expandOnClickNode = TreeNodeProps.expandOnClickNode,
+    onlyExpandOnClickIcon = TreeNodeProps.onlyExpandOnClickIcon,
     loading = TreeNodeProps.loading,
     onExpand = TreeNodeProps.onExpand,
     onCheck = TreeNodeProps.onCheck,
@@ -61,7 +62,7 @@ var TreeNode = /*#__PURE__*/React.forwardRef(function (props, ref) {
     onDragEnd = TreeNodeProps.onDragEnd,
     onDrop = TreeNodeProps.onDrop,
     onSelect = TreeNodeProps.onSelect,
-    others = __rest(TreeNodeProps, ["nodeKey", "prefixCls", "selectable", "checkable", "className", "icon", "switcherIcon", "disabled", "draggable", "pos", "checked", "level", "getDragNode", "hasChildNode", "expand", "title", "showLine", "showIcon", "selected", "setDragNode", "style", "indeterminate", "estimatedItemSize", "dragOver", "dropPosition", "expandOnClickNode", "loading", "onExpand", "onCheck", "onDragStart", "onDragOver", "onDragLeave", "onDragEnter", "onDragEnd", "onDrop", "onSelect"]);
+    others = __rest(TreeNodeProps, ["nodeKey", "prefixCls", "selectable", "checkable", "className", "icon", "switcherIcon", "disabled", "draggable", "pos", "checked", "level", "getDragNode", "hasChildNode", "expand", "title", "showLine", "showIcon", "selected", "setDragNode", "style", "indeterminate", "estimatedItemSize", "dragOver", "dropPosition", "expandOnClickNode", "onlyExpandOnClickIcon", "loading", "onExpand", "onCheck", "onDragStart", "onDragOver", "onDragLeave", "onDragEnter", "onDragEnd", "onDrop", "onSelect"]);
   var nodeData = React.useMemo(function () {
     return _extends({
       selectable: selectable,
@@ -168,12 +169,12 @@ var TreeNode = /*#__PURE__*/React.forwardRef(function (props, ref) {
       if (Array.isArray(switcherIcon) && switcherIcon.length === 2) {
         return /*#__PURE__*/React.createElement("span", {
           className: classNames("".concat(treeNodePrefixCls, "-icon"), _defineProperty({}, "".concat(treeNodePrefixCls, "-icon-hover"), !expandOnClickNode)),
-          onClick: expandOnClickNode ? undefined : handleExpandIconClick
+          onClick: expandOnClickNode ? onlyExpandOnClickIcon ? handleExpandIconClick : undefined : handleExpandIconClick
         }, expandState ? renderIcon(switcherIcon[1]) : renderIcon(switcherIcon[0]));
       }
       return /*#__PURE__*/React.createElement("span", {
         className: classNames("".concat(treeNodePrefixCls, "-icon"), (_classNames3 = {}, _defineProperty(_classNames3, "".concat(treeNodePrefixCls, "-animation-expand"), expandState), _defineProperty(_classNames3, "".concat(treeNodePrefixCls, "-animation-collapse"), !expandState), _defineProperty(_classNames3, "".concat(treeNodePrefixCls, "-icon-hover"), !expandOnClickNode), _classNames3)),
-        onClick: expandOnClickNode ? undefined : handleExpandIconClick
+        onClick: expandOnClickNode ? onlyExpandOnClickIcon ? handleExpandIconClick : undefined : handleExpandIconClick
       }, renderIcon(switcherIcon || /*#__PURE__*/React.createElement(Icon, {
         type: "arrow-right-solid"
       })));
@@ -241,9 +242,11 @@ var TreeNode = /*#__PURE__*/React.forwardRef(function (props, ref) {
   }, [expandState, nodeData, nodeKey, onExpand, setExpandState]);
   var handleClick = React.useCallback(function (e) {
     e.stopPropagation();
-    expandOnClickNode && handleExpandIconClick();
+    if (expandOnClickNode) {
+      !onlyExpandOnClickIcon && handleExpandIconClick();
+    }
     handleSelect(e);
-  }, [expandOnClickNode, handleExpandIconClick, handleSelect]);
+  }, [expandOnClickNode, handleExpandIconClick, handleSelect, onlyExpandOnClickIcon]);
   var handleDragStart = React.useCallback(function (e) {
     if (!draggable) return;
     setDragNode(nodeData);

package/es/tree-select/style/index.css

@@ -240,9 +240,8 @@
           box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2);
   max-height: 200px;
 }
-.kd-tree-select-dropdown .kd-tree {
-  padding-left: 16px;
-  padding-right: 16px;
+.kd-tree-select-dropdown .kd-tree-node-item {
+  padding: 0 var(--kd-c-tree-select-dropdown-node-spacing-padding-horizontal, 16px);
 }
 .kd-tree-select-dropdown-scroll {
   overflow-y: auto;

package/es/tree-select/style/index.less

@@ -137,11 +137,9 @@
     box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2);
     max-height: 200px;
 
-    .@{tree-prefix-cls} {
-      padding-left: 16px;
-      padding-right: 16px;
+    .@{tree-prefix-cls}-node-item {
+      padding: 0 @tree-select-dropdown-node-horizontal;
     }
-    
 
     &-scroll {
       overflow-y: auto;

package/es/tree-select/style/token.less

@@ -1,54 +1,54 @@
 @import '../../style/themes/token.less';
 
-@select-custom-prefix: ~'--@{kd-prefix}-c-tree-select';
-
+@tree-select-custom-prefix: ~'--@{kd-prefix}-c-tree-select';
 
 // color
-@tree-select-dropdown-bg: var(~'@{select-custom-prefix}-dropdown-color-background', @color-background);
-@tree-select-disabled-option-bg: var(~'@{select-custom-prefix}-item-color-background-disabled', #fff);
-@tree-select-item-active-bg: var(~'@{select-custom-prefix}-color-background', #f5f5f5);
-@tree-select-item-selected-bg: var(~'@{select-custom-prefix}-color-background-selected', @color-theme-3);
-@tree-select-g-color-border: var(~'@{select-custom-prefix}-color-border', @color-input);
-@tree-select-g-color-border-foucs: var(~'@{select-custom-prefix}-color-border-foucs', @color-theme);
-@tree-select-g-color-border-hover: var(~'@{select-custom-prefix}-color-border-hover', @color-theme);
-@tree-select-border-g-color-border: var(~'@{select-custom-prefix}-border-color-border', @color-border-strong);
-@tree-select-placeholder-color: var(~'@{select-custom-prefix}-placeholder-color-text', #b2b2b2);
-@tree-select-item-selected-color: var(~'@{select-custom-prefix}-item-color-text-selected', @color-theme);
-@tree-select-font-color: var(~'@{select-custom-prefix}-footer-color-text', @color-text-primary);
-@tree-select-footer-g-text-color-selected: var(~'@{select-custom-prefix}-footer-color-text-selected', #0e5fd8);
-@tree-select-g-item-text-color-disabled: var(~'@{select-custom-prefix}-item-color-text-disabled', @color-disabled);
-@tree-select-color-background-disabled: var(~'@{select-custom-prefix}-color-background-disabled', #f5f5f5);
-@tree-select-color-text-disabled: var(~'@{select-custom-prefix}-color-text-disabled', @color-disabled);
-@tree-select-arrow-icon-color-text-disabled: var(~'@{select-custom-prefix}-arrow-icon-color-text-disabled', #b2b2b2);
-@tree-select-single-color-text: var(~'@{select-custom-prefix}-single-color-text', @color-text-primary);
-@tree-select-clear-color: var(~'@{select-custom-prefix}-icon-clear-color-text', #d9d9d9);
-@tree-select-clear-color-hover: var(~'@{select-custom-prefix}-icon-clear-color-text-hover', #999);
+@tree-select-dropdown-bg: var(~'@{tree-select-custom-prefix}-dropdown-color-background', @color-background);
+@tree-select-disabled-option-bg: var(~'@{tree-select-custom-prefix}-item-color-background-disabled', #fff);
+@tree-select-item-active-bg: var(~'@{tree-select-custom-prefix}-color-background', #f5f5f5);
+@tree-select-item-selected-bg: var(~'@{tree-select-custom-prefix}-color-background-selected', @color-theme-3);
+@tree-select-g-color-border: var(~'@{tree-select-custom-prefix}-color-border', @color-input);
+@tree-select-g-color-border-foucs: var(~'@{tree-select-custom-prefix}-color-border-foucs', @color-theme);
+@tree-select-g-color-border-hover: var(~'@{tree-select-custom-prefix}-color-border-hover', @color-theme);
+@tree-select-border-g-color-border: var(~'@{tree-select-custom-prefix}-border-color-border', @color-border-strong);
+@tree-select-placeholder-color: var(~'@{tree-select-custom-prefix}-placeholder-color-text', #b2b2b2);
+@tree-select-item-selected-color: var(~'@{tree-select-custom-prefix}-item-color-text-selected', @color-theme);
+@tree-select-font-color: var(~'@{tree-select-custom-prefix}-footer-color-text', @color-text-primary);
+@tree-select-footer-g-text-color-selected: var(~'@{tree-select-custom-prefix}-footer-color-text-selected', #0e5fd8);
+@tree-select-g-item-text-color-disabled: var(~'@{tree-select-custom-prefix}-item-color-text-disabled', @color-disabled);
+@tree-select-color-background-disabled: var(~'@{tree-select-custom-prefix}-color-background-disabled', #f5f5f5);
+@tree-select-color-text-disabled: var(~'@{tree-select-custom-prefix}-color-text-disabled', @color-disabled);
+@tree-select-arrow-icon-color-text-disabled: var(~'@{tree-select-custom-prefix}-arrow-icon-color-text-disabled', #b2b2b2);
+@tree-select-single-color-text: var(~'@{tree-select-custom-prefix}-single-color-text', @color-text-primary);
+@tree-select-clear-color: var(~'@{tree-select-custom-prefix}-icon-clear-color-text', #d9d9d9);
+@tree-select-clear-color-hover: var(~'@{tree-select-custom-prefix}-icon-clear-color-text-hover', #999);
 
 // font
-@tree-select-list-font-size: var(~'@{select-custom-prefix}-dropdown-font-size', 12px); // 下拉列表文字大小
-@tree-select-large-font-size: var(~'@{select-custom-prefix}-font-size-large', 16px); // 大号字体
-@tree-select-middle-font-size: var(~'@{select-custom-prefix}-font-size-middle', 14px); // 中号高度
-@tree-select-small-font-size: var(~'@{select-custom-prefix}-font-size-small', 12px); // 小号高度
+@tree-select-list-font-size: var(~'@{tree-select-custom-prefix}-dropdown-font-size', 12px); // 下拉列表文字大小
+@tree-select-large-font-size: var(~'@{tree-select-custom-prefix}-font-size-large', 16px); // 大号字体
+@tree-select-middle-font-size: var(~'@{tree-select-custom-prefix}-font-size-middle', 14px); // 中号高度
+@tree-select-small-font-size: var(~'@{tree-select-custom-prefix}-font-size-small', 12px); // 小号高度
 
 // line-height
-@tree-select-dropdown-line-height: var(~'@{select-custom-prefix}-dropdown-line-height', 22px);
-@tree-select-large-line-height: var(~'@{select-custom-prefix}-line-height-large', 28px);
-@tree-select-middle-line-height: var(~'@{select-custom-prefix}-line-height-middle', 22px);
-@tree-select-small-line-height: var(~'@{select-custom-prefix}-line-height-small', 14px);
+@tree-select-dropdown-line-height: var(~'@{tree-select-custom-prefix}-dropdown-line-height', 22px);
+@tree-select-large-line-height: var(~'@{tree-select-custom-prefix}-line-height-large', 28px);
+@tree-select-middle-line-height: var(~'@{tree-select-custom-prefix}-line-height-middle', 22px);
+@tree-select-small-line-height: var(~'@{tree-select-custom-prefix}-line-height-small', 14px);
 
 // sizing
-@tree-select-dropdown-height: var(~'@{select-custom-prefix}-item-sizing-height', 22px);
-@tree-select-large-height: var(~'@{select-custom-prefix}-sizing-height-large', 36px); // 大号高度 lh:28px
-@tree-select-middle-height: var(~'@{select-custom-prefix}-sizing-height-middle', 32px); // 中号高度lh:22px
-@tree-select-small-height: var(~'@{select-custom-prefix}-sizing-height-small', 24px); // 小号高度lh:12px
+@tree-select-dropdown-height: var(~'@{tree-select-custom-prefix}-item-sizing-height', 22px);
+@tree-select-large-height: var(~'@{tree-select-custom-prefix}-sizing-height-large', 36px); // 大号高度 lh:28px
+@tree-select-middle-height: var(~'@{tree-select-custom-prefix}-sizing-height-middle', 32px); // 中号高度lh:22px
+@tree-select-small-height: var(~'@{tree-select-custom-prefix}-sizing-height-small', 24px); // 小号高度lh:12px
 
 // spacing
-@tree-select-bordered: var(~'@{select-custom-prefix}-bordered-spacing-padding-left', 8px);
-@tree-select-wrapper-padding: var(~'@{select-custom-prefix}-wrapper-spacing-padding', 1px 28px 1px 0);
+@tree-select-bordered: var(~'@{tree-select-custom-prefix}-bordered-spacing-padding-left', 8px);
+@tree-select-wrapper-padding: var(~'@{tree-select-custom-prefix}-wrapper-spacing-padding', 1px 28px 1px 0);
+@tree-select-dropdown-node-horizontal: var(~'@{tree-select-custom-prefix}-dropdown-node-spacing-padding-horizontal', 16px);
 
 // radius
-@tree-select-g-radius-border: var(~'@{select-custom-prefix}-radius-border', @radius-border);
-@tree-select-border-radius-border: var(~'@{select-custom-prefix}-bordered-radius-border', 2px);
+@tree-select-g-radius-border: var(~'@{tree-select-custom-prefix}-radius-border', @radius-border);
+@tree-select-border-radius-border: var(~'@{tree-select-custom-prefix}-bordered-radius-border', 2px);
 
 // z-index
-@tree-select-z-index: var(~'@{select-custom-prefix}-z-index', @z-index-popper);
+@tree-select-z-index: var(~'@{tree-select-custom-prefix}-z-index', @z-index-popper);

package/es/tree-select/tree-select.js

@@ -308,6 +308,7 @@ var InternalTreeSelect = function InternalTreeSelect(props, ref) {
       icon: treeIcon,
       showIcon: showTreeIcon,
       switcherIcon: switcherIcon,
+      onlyExpandOnClickIcon: true,
       notFoundContent: renderNotContent(),
       filterTreeNode: defFilterTreeNode,
       onSelect: handleSelect,

package/lib/color-picker/constant/colorTypes.js

@@ -9,12 +9,12 @@ var colorTypes = [{
   value: '#b2b2b2'
 }, {
   type: 'HSB',
-  value: 'hsb(0,0%,70%)'
+  value: 'hsb(0, 0%, 70%)'
 }, {
   type: 'RGB',
-  value: 'rgb(178,178,178)'
+  value: 'rgb(178, 178, 178)'
 }, {
   type: 'HSL',
-  value: 'hsl(0,0%,70%)'
+  value: 'hsl(0, 0%, 70%)'
 }];
 exports.colorTypes = colorTypes;

package/lib/color-picker/style/index.css

@@ -254,8 +254,14 @@
           box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2);
   border-radius: 2px;
 }
-.kd-color-picker-pop .kd-color-picker-panel-input .kd-select .kd-select-dropdown {
-  overflow: hidden;
+.kd-color-picker-pop .kd-color-picker-panel-input .kd-select .kd-select-dropdown .kd-select-item-option {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: center;
+      -ms-flex-pack: center;
+          justify-content: center;
+  min-width: unset;
 }
 .kd-color-picker-pop .kd-color-picker-panel-input .kd-select-bordered {
   border-radius: 2px;

package/lib/color-picker/style/index.less

@@ -179,7 +179,11 @@
                 }
 
                 .@{kd-prefix}-select-dropdown {
-                    overflow: hidden;
+                    .@{kd-prefix}-select-item-option {
+                        display: flex;
+                        justify-content: center;
+                        min-width: unset;
+                    }
                 }
             }
 

package/lib/config-provider/compDefaultProps.d.ts

@@ -436,6 +436,7 @@ declare const compDefaultProps: {
         placeholder: string;
         optionLabelProp: string;
         treeNodeFilterProp: string;
+        treeExpandOnClickNode: boolean;
         showSearch: boolean;
         switcherIcon: () => JSX.Element;
         expandOnClickNode: boolean;

package/lib/config-provider/compDefaultProps.js

@@ -461,6 +461,7 @@ var compDefaultProps = {
     placeholder: '请输入需要搜索的内容',
     optionLabelProp: 'title',
     treeNodeFilterProp: 'title',
+    treeExpandOnClickNode: true,
     showSearch: true,
     switcherIcon: function switcherIcon() {
       return /*#__PURE__*/React.createElement(_index.Icon, {

package/lib/dropdown/dropdown.js

@@ -28,7 +28,7 @@ var findItem = function findItem(element) {
   }
 };
 var Dropdown = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
+  var _a, _b, _c;
   var _React$useContext = React.useContext(_ConfigContext.default),
     getPrefixCls = _React$useContext.getPrefixCls,
     pkgPrefixCls = _React$useContext.prefixCls,
@@ -86,12 +86,7 @@ var Dropdown = /*#__PURE__*/React.forwardRef(function (props, ref) {
     onClick: handleItemClick,
     selectable: menuSelectable
   });
-  var isItem = React.Children.count((_d = menu.props) === null || _d === void 0 ? void 0 : _d.children) === 1 && ((_g = (_f = (_e = menu.props) === null || _e === void 0 ? void 0 : _e.children) === null || _f === void 0 ? void 0 : _f.type) === null || _g === void 0 ? void 0 : _g.displayName) === 'DropdownMenuItem' || Array.isArray((_k = (_j = (_h = menu.props) === null || _h === void 0 ? void 0 : _h.children) === null || _j === void 0 ? void 0 : _j.props) === null || _k === void 0 ? void 0 : _k.children) || ((_p = (_o = (_m = (_l = menu.props) === null || _l === void 0 ? void 0 : _l.children) === null || _m === void 0 ? void 0 : _m.props) === null || _o === void 0 ? void 0 : _o.children.type) === null || _p === void 0 ? void 0 : _p.displayName) === 'DropdownMenuItem';
-  var menuElement = isMenu ? Array.isArray((_q = menu.props) === null || _q === void 0 ? void 0 : _q.children) || isItem ? cloneObj : /*#__PURE__*/React.createElement("ul", {
-    className: "".concat(prefixCls, "-menu"),
-    onClick: handleItemClick,
-    role: "menu"
-  }, menu.props.children) : /*#__PURE__*/React.createElement("ul", {
+  var menuElement = isMenu ? cloneObj : /*#__PURE__*/React.createElement("ul", {
     className: "".concat(prefixCls, "-menu"),
     onClick: handleItemClick,
     role: "menu"

package/lib/dropdown/menu.js

@@ -42,6 +42,9 @@ var Menu = /*#__PURE__*/React.forwardRef(function (props, ref) {
   // className前缀
   var prefixCls = getPrefixCls(pkgPrefixCls, 'dropdown-menu', customPrefixcls);
   var cloneItem = function cloneItem(item, index) {
+    if (! /*#__PURE__*/React.isValidElement(item)) {
+      return item;
+    }
     var key = item.key || index;
     var selected = selectable && String(selectedKey) === String(key);
     return /*#__PURE__*/React.cloneElement(item, {

package/lib/modal/modal.d.ts

@@ -1,5 +1,6 @@
 import React, { ReactNode, CSSProperties } from 'react';
 import { IButtonProps } from '../button/button';
+import type { DraggableBounds, DraggableEventHandler } from 'react-draggable';
 declare type CSSSelector = string;
 export declare const ConfirmModalTypes: string[];
 export declare const ModalTypes: ["confirm", "warning", "error", "normal"];
@@ -8,6 +9,7 @@ export interface IModalProps {
     body?: ReactNode;
     bodyClassName?: string;
     bodyStyle?: CSSProperties;
+    style?: CSSProperties;
     cancelButtonProps?: IButtonProps;
     cancelText?: ReactNode;
     className?: string;
@@ -40,6 +42,10 @@ export interface IModalProps {
     visible?: boolean;
     width?: number;
     showline?: boolean;
+    bounds?: DraggableBounds | string | false;
+    onDragStart?: DraggableEventHandler;
+    onDrag?: DraggableEventHandler;
+    onDragStop?: DraggableEventHandler;
 }
-declare const Modal: React.FC<IModalProps>;
+declare const Modal: React.ForwardRefExoticComponent<IModalProps & React.RefAttributes<unknown>>;
 export default Modal;