@kdcloudjs/kdesign 1.7.16 → 1.7.18

package/es/card/card.js

@@ -1,4 +1,13 @@
 import _extends from "@babel/runtime-corejs3/helpers/extends";
+import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
+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 * as React from 'react';
 import classNames from 'classnames';
 import Checkbox from '../checkbox';
@@ -10,31 +19,32 @@ var Card = /*#__PURE__*/React.forwardRef(function (props, ref) {
     pkgPrefixCls = _React$useContext.prefixCls,
     userDefaultProps = _React$useContext.compDefaultProps;
   // 属性需要合并一遍用户定义的默认属性
-  var _getCompProps = 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 = 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 = classNames(prefixCls, {
     hoverable: hoverable
   }, className);
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React.createElement("div", _extends({
     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/es/carousel/carousel.js

@@ -74,8 +74,8 @@ var InternalCarousel = function InternalCarousel(props, ref) {
   var setScrollXEffectStyle = React.useCallback(function () {
     var _context;
     if (!listRef.current) return;
-    listRef.current.style.cssText = needAnimation ? _concatInstanceProperty(_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 ? _concatInstanceProperty(_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.useCallback(function (index, needAnimation) {
     if (isFadeEffect) {
       if (index === -1 || index === children.length) index = 0;
@@ -213,6 +213,7 @@ var InternalCarousel = function InternalCarousel(props, ref) {
       content = /*#__PURE__*/React.createElement(SlideList, {
         items: children,
         parentPrefixCls: carouselPrefixCls,
+        currentIndex: currentIndex,
         ref: listRef
       });
     }

package/es/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/es/carousel/slideList.js

@@ -1,11 +1,14 @@
+import _defineProperty from "@babel/runtime-corejs3/helpers/defineProperty";
 import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/concat";
 import _sliceInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/slice";
 import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/map";
+import classNames from 'classnames';
 import React from 'react';
 export var SlideList = /*#__PURE__*/React.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() {
@@ -13,7 +16,7 @@ export var SlideList = /*#__PURE__*/React.forwardRef(function (props, ref) {
     var _items = _concatInstanceProperty(_context = _sliceInstanceProperty(items).call(items, -1)).call(_context, items, _sliceInstanceProperty(items).call(items, 0, 1)); // 首位分别添加一项
     return _mapInstanceProperty(_items).call(_items, function (item, index) {
       return /*#__PURE__*/React.createElement("li", {
-        className: "".concat(listPrefixCls, "-item"),
+        className: classNames("".concat(listPrefixCls, "-item"), _defineProperty({}, "".concat(listPrefixCls, "-item-active"), currentIndex === index - 1)),
         key: index
       }, item);
     });

package/es/cascader/cascader.js

@@ -16,7 +16,7 @@ var __rest = this && this.__rest || function (s, e) {
   }
   return t;
 };
-import React, { useMemo, useCallback } from 'react';
+import React, { useMemo, useCallback, useState, useRef } from 'react';
 import classNames from 'classnames';
 import { tuple } from '../_utils/type';
 import { getCompProps } from '../_utils';
@@ -59,38 +59,41 @@ var Cascader = /*#__PURE__*/React.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.useRef();
-  var triggerRef = React.useRef();
-  var wrapperRef = React.useRef();
+  var pickerRef = useRef();
+  var triggerRef = useRef();
+  var wrapperRef = useRef();
   var mergeRef = ref || pickerRef;
-  var _React$useState = React.useState(!!props.popperVisible || !!props.popupVisible || defaultPopupVisible),
-    _React$useState2 = _slicedToArray(_React$useState, 2),
-    visible = _React$useState2[0],
-    setVisible = _React$useState2[1];
+  var _useState = useState(!!props.popperVisible || !!props.popupVisible || defaultPopupVisible),
+    _useState2 = _slicedToArray(_useState, 2),
+    visible = _useState2[0],
+    setVisible = _useState2[1];
   React.useEffect(function () {
     setVisible(!!props.popperVisible || !!props.popupVisible);
   }, [props.popperVisible, props.popupVisible]);
-  var _React$useState3 = React.useState([options]),
-    _React$useState4 = _slicedToArray(_React$useState3, 2),
-    menus = _React$useState4[0],
-    setMenus = _React$useState4[1];
-  var _React$useState5 = React.useState([]),
-    _React$useState6 = _slicedToArray(_React$useState5, 2),
-    currentOptions = _React$useState6[0],
-    setCurrentOptions = _React$useState6[1];
-  var _React$useState7 = React.useState([]),
-    _React$useState8 = _slicedToArray(_React$useState7, 2),
-    selectedOptions = _React$useState8[0],
-    setSelectedOptions = _React$useState8[1];
-  var _React$useState9 = React.useState(props.value || defaultValue || []),
-    _React$useState10 = _slicedToArray(_React$useState9, 2),
-    value = _React$useState10[0],
-    setValue = _React$useState10[1];
+  var _useState3 = useState([options]),
+    _useState4 = _slicedToArray(_useState3, 2),
+    menus = _useState4[0],
+    setMenus = _useState4[1];
+  var _useState5 = useState([]),
+    _useState6 = _slicedToArray(_useState5, 2),
+    currentOptions = _useState6[0],
+    setCurrentOptions = _useState6[1];
+  var _useState7 = useState([]),
+    _useState8 = _slicedToArray(_useState7, 2),
+    selectedOptions = _useState8[0],
+    setSelectedOptions = _useState8[1];
+  var _useState9 = useState(props.value || defaultValue || []),
+    _useState10 = _slicedToArray(_useState9, 2),
+    value = _useState10[0],
+    setValue = _useState10[1];
   React.useEffect(function () {
     props.value && setValue(props.value);
   }, [props.value]);
@@ -192,37 +195,10 @@ var Cascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
       });
     });
   }, [currentOptions, isMultiple]);
-  var allowClear = allProps.allowClear && value.length > 0;
-  var locatorProps = {
-    style: style,
-    tabIndex: 0,
-    className: classNames("".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: classNames("".concat(prefixCls, "-picker-input"), {
-      expand: visible
-    }),
-    suffix: props.suffixIcon || /*#__PURE__*/React.createElement(Icon, {
-      type: "arrow-down",
-      className: classNames({
-        expand: visible
-      })
-    })
-  };
-  if (bordered) {
-    inputProps.borderType = 'bordered';
-  }
   var renderSuffix = function renderSuffix() {
     var _classNames;
     var suffixIcon = allProps.suffixIcon;
@@ -260,8 +236,6 @@ var Cascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
   };
   var renderMultiple = function renderMultiple() {
     var _classNames3, _classNames4;
-    var maxTagCount = allProps.maxTagCount,
-      maxTagPlaceholder = allProps.maxTagPlaceholder;
     var multipleCls = classNames((_classNames3 = {
       disabled: disabled
     }, _defineProperty(_classNames3, "".concat(prefixCls, "-multiple"), true), _defineProperty(_classNames3, "".concat(prefixCls, "-bordered"), bordered), _classNames3));
@@ -300,19 +274,44 @@ var Cascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
     }, renderSuffix())));
   };
   var renderSingle = function renderSingle() {
-    return /*#__PURE__*/React.createElement("span", _extends({}, locatorProps, {
+    var inputProps = {
+      value: value,
+      placeholder: placeholder,
+      readOnly: true,
+      borderType: bordered ? 'bordered' : 'underline',
+      disabled: disabled,
+      className: classNames("".concat(prefixCls, "-picker-input"), {
+        expand: visible
+      }),
+      suffix: props.suffixIcon || /*#__PURE__*/React.createElement(Icon, {
+        type: "arrow-down",
+        className: classNames({
+          expand: visible
+        })
+      })
+    };
+    var singleProps = {
+      style: style,
+      tabIndex: 0,
+      className: classNames("".concat(prefixCls, "-picker"), className, _defineProperty({
+        expand: visible,
+        allowClear: allowClear,
+        disabled: disabled
+      }, "".concat(prefixCls, "-bordered"), bordered))
+    };
+    return /*#__PURE__*/React.createElement("div", _extends({}, singleProps, {
       ref: mergeRef
     }, otherProps), React.Children.count(children) === 1 && children.type ? /*#__PURE__*/React.cloneElement(children, {
       ref: triggerRef
-    }) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("span", {
+    }) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
       ref: triggerRef
     }, /*#__PURE__*/React.createElement(Input, _extends({}, inputProps)), /*#__PURE__*/React.createElement("span", {
       className: "".concat(prefixCls, "-picker-label")
-    }, (labels === null || labels === void 0 ? void 0 : labels.length) ? displayRender(labels, currentOptions) : '')), allowClear && /*#__PURE__*/React.createElement(Icon, {
+    }, (labels === null || labels === void 0 ? void 0 : labels.length) ? displayRender(labels, currentOptions) : ''), allowClear && /*#__PURE__*/React.createElement(Icon, {
       type: "close-solid",
       className: "".concat(prefixCls, "-picker-close"),
       onClick: handleClear
-    })));
+    }))));
   };
   var cascaderLocator = isMultiple ? renderMultiple() : renderSingle();
   var onExpend = function onExpend(index, opt, opts) {
@@ -424,7 +423,7 @@ var Cascader = /*#__PURE__*/React.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;

package/es/cascader/style/index.css

@@ -108,9 +108,9 @@
 /** 浮层箭头样式 **/
 .kd-cascader-picker {
   position: relative;
-  display: inline-block;
   outline: none;
   cursor: pointer;
+  background: var(--kd-c-cascader-color-background, var(--kd-g-color-white, #fff));
 }
 .kd-cascader-picker:focus > .kd-cascader-picker-input {
   border-color: var(--kd-c-cascader-color-active, #999);
@@ -139,7 +139,7 @@
   left: 0;
   width: 100%;
   height: 20px;
-  padding: 0 24px 0 9px;
+  padding: 0 24px 0 0;
   line-height: 20px;
   -webkit-transform: translateY(-50%);
           transform: translateY(-50%);
@@ -169,7 +169,7 @@
   -webkit-transition: all 0.2s;
   transition: all 0.2s;
 }
-.kd-cascader-picker.allowClear:hover > .kd-cascader-picker-close {
+.kd-cascader-picker.allowClear:hover .kd-cascader-picker-close {
   opacity: 1;
   visibility: visible;
   -webkit-transition: all 0.2s;
@@ -186,7 +186,7 @@
 .kd-cascader-picker-close {
   position: absolute;
   top: 50%;
-  right: 9px;
+  right: 0;
   opacity: 0;
   cursor: pointer;
   visibility: hidden;
@@ -278,11 +278,20 @@
 .kd-cascader-menus .kd-empty {
   padding: 10px 0 20px;
 }
-.kd-cascader-bordered {
+.kd-cascader-bordered:not(.kd-cascader-multiple) .kd-cascader-picker-label {
+  padding-left: 9px;
+}
+.kd-cascader-bordered:not(.kd-cascader-multiple) .kd-cascader-picker-close {
+  right: 10px;
+}
+.kd-cascader-bordered.kd-cascader-multiple {
   border: 1px solid #d9d9d9;
-  padding-left: 8px !important;
+  padding-left: 8px;
   border-radius: 2px;
 }
+.kd-cascader-bordered.kd-cascader-multiple .kd-cascader-suffix {
+  right: 9px;
+}
 .kd-cascader-multiple {
   padding: 1px 28px 1px 0;
   -webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
@@ -301,6 +310,7 @@
   overflow-x: hidden;
   position: relative;
   border-bottom: 1px solid #d9d9d9;
+  background: var(--kd-c-cascader-color-background, var(--kd-g-color-white, #fff));
 }
 .kd-cascader-multiple-wrapper {
   display: -webkit-box;

package/es/cascader/style/index.less

@@ -8,9 +8,9 @@
 
 .@{cascader-picker-prefix-cls} {
   position: relative;
-  display: inline-block;
   outline: none;
   cursor: pointer;
+  background: @cascader-bg-color;
 
   &:focus > &-input {
     border-color: @cascader-active-color;
@@ -47,7 +47,7 @@
     left: 0;
     width: 100%;
     height: 20px;
-    padding: 0 24px 0 9px;
+    padding: 0 24px 0 0;
     line-height: 20px;
     transform: translateY(-50%);
     .ellipsis;
@@ -78,7 +78,7 @@
   }
 
   &.allowClear:hover {
-    > .@{cascader-picker-prefix-cls}-close {
+    .@{cascader-picker-prefix-cls}-close {
       opacity: 1;
       visibility: visible;
       transition: all 0.2s;
@@ -95,7 +95,7 @@
   &-close {
     position: absolute;
     top: 50%;
-    right: 9px;
+    right: 0;
     opacity: 0;
     cursor: pointer;
     visibility: hidden;
@@ -183,10 +183,23 @@
 }
 
 .@{kd-prefix}-cascader {
-  &-bordered {
+  &-bordered:not(.@{kd-prefix}-cascader-multiple) {
+    .@{cascader-picker-prefix-cls}-label {
+      padding-left: 9px;
+    }
+    .@{cascader-picker-prefix-cls}-close {
+      right: 10px;
+    }
+  }
+
+  &-bordered&-multiple {
     border: 1px solid #d9d9d9;
-    padding-left: 8px !important;
+    padding-left: 8px;
     border-radius: 2px;
+
+    .@{kd-prefix}-cascader-suffix {
+      right: 9px;
+    }
   }
 
   &-multiple {
@@ -203,6 +216,7 @@
     overflow-x: hidden;
     position: relative;
     border-bottom: 1px solid #d9d9d9;
+    background: @cascader-bg-color;
   }
 
   &-multiple-wrapper {

package/es/color-picker/color-picker-panel.js

@@ -42,6 +42,7 @@ var ColorPickerPanel = function ColorPickerPanel(props) {
     showColorTransfer = props.showColorTransfer,
     showPresetColor = props.showPresetColor,
     showColorPickerBox = props.showColorPickerBox,
+    showColorPickerPanel = props.showColorPickerPanel,
     value = props.value;
   var panelInputRef = useRef(null);
   var panelClsRef = useRef(null);
@@ -56,7 +57,7 @@ var ColorPickerPanel = function ColorPickerPanel(props) {
   var panelFollowThemeCls = classNames("".concat(colorPickerPrefixCls, "-panel-switch"));
   var panelInputCls = classNames("".concat(colorPickerPrefixCls, "-panel-input"), _defineProperty({}, "".concat(colorPickerPrefixCls, "-panel-input-no-recommend"), !showPresetColor));
   var transparentCls = classNames("".concat(colorPickerPrefixCls, "-panel-transparent"));
-  var colorDivContainerCls = classNames("".concat(colorPickerPrefixCls, "-panel-colorDivContainer"));
+  var colorDivContainerCls = classNames("".concat(colorPickerPrefixCls, "-panel-colorDivContainer"), _defineProperty({}, "".concat(colorPickerPrefixCls, "-panel-colorDivContainer-unset-color"), (presetColor === null || presetColor === void 0 ? void 0 : presetColor.length) === 0));
   var colorLiClick = function colorLiClick(index, colorValue) {
     var formatArr = colorFormat(colorValue, alpha);
     var formatValue = toLowerCase(formatArr[valOfCorrespondingType(currentColorType)].value);
@@ -172,7 +173,7 @@ var ColorPickerPanel = function ColorPickerPanel(props) {
   useOnClickOutside([panelClsRef, inputRef], function () {
     setShowPanel(false);
   });
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, showColorPickerPanel && /*#__PURE__*/React.createElement("div", {
     className: panelCls,
     ref: panelClsRef
   }, /*#__PURE__*/React.createElement(ChromePicker, {
@@ -229,7 +230,7 @@ var ColorPickerPanel = function ColorPickerPanel(props) {
         'square-click': clickedColorIndex === i
       })
     }));
-  })));
+  }))));
 };
 ColorPickerPanel.displayName = 'ColorPickerPanel';
 export default ColorPickerPanel;

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

@@ -79,6 +79,7 @@ var ColorPicker = function ColorPicker(props) {
   var containerCls = classNames("".concat(colorPickerPrefixCls, "-container"));
   var inputCls = classNames("".concat(colorPickerPrefixCls, "-input"), className);
   var inputRef = useRef(null);
+  var showColorPickerPanel = showColorTransfer || typeof showPresetColor === 'boolean' && showPresetColor && (presetColor === null || presetColor === void 0 ? void 0 : presetColor.length) || typeof showPresetColor === 'undefined' || (functionalColor === null || functionalColor === void 0 ? void 0 : functionalColor.length) && showSwitch || (showColorPickerBox === null || showColorPickerBox === void 0 ? void 0 : showColorPickerBox.showBox) || (showColorPickerBox === null || showColorPickerBox === void 0 ? void 0 : showColorPickerBox.showHue) || (showColorPickerBox === null || showColorPickerBox === void 0 ? void 0 : showColorPickerBox.showOpacity);
   var setIconColor = function setIconColor(value) {
     value === functionalColorName ? setIsFollow(true) : setIsFollow(false);
     var inpValue = value === functionalColorName ? functionalColor : value;
@@ -136,7 +137,7 @@ var ColorPicker = function ColorPicker(props) {
       style: {
         backgroundColor: "".concat(colTypeArr[2].value || defaultSystemColor)
       }
-    }, /*#__PURE__*/React.createElement(Icon, {
+    }, showColorPickerPanel && /*#__PURE__*/React.createElement(Icon, {
       type: "arrow-down"
     }));
   };
@@ -186,7 +187,8 @@ var ColorPicker = function ColorPicker(props) {
     colTypeArr: colTypeArr,
     setColTypeArr: setColTypeArr,
     currentColorType: currentColorType,
-    setCurrentColorType: setCurrentColorType
+    setCurrentColorType: setCurrentColorType,
+    showColorPickerPanel: showColorPickerPanel
   });
   var popperProps = _extends(_extends({}, colorPickerProps), {
     popperClassName: popUpLayer,

package/es/color-picker/interface.d.ts

@@ -58,6 +58,7 @@ export interface IColorPickerPanelProps {
         showHue?: boolean;
         showOpacity?: boolean;
     };
+    showColorPickerPanel: boolean;
     value: string;
     setCurrentColorType: (currentColorType: IColorTypesObj['type']) => void;
     setColTypeArr: (colTypeArr: Array<IColorTypesObj>) => void;

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

@@ -262,7 +262,7 @@
   font-size: var(--kd-c-color-picker-panel-select-font-size, var(--kd-g-font-size-middle, 14px));
 }
 .kd-color-picker-pop .kd-color-picker-panel-input-no-recommend {
-  margin-bottom: 8px;
+  margin-bottom: 0;
 }
 .kd-color-picker-pop .kd-color-picker-panel-input .kd-select.bottomLeft,
 .kd-color-picker-pop .kd-color-picker-panel-input .kd-select.topLeft {
@@ -311,6 +311,9 @@
   grid-row-gap: 8px;
   margin-top: 12px;
 }
+.kd-color-picker-pop .kd-color-picker-panel-colorDivContainer-unset-color {
+  margin-top: 0;
+}
 .kd-color-picker-pop .kd-color-picker-panel-colorDivContainer li {
   position: relative;
   -webkit-box-sizing: border-box;

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

@@ -209,7 +209,7 @@
       font-size: @color-picker-panel-select-font-size;
 
       &-no-recommend {
-        margin-bottom: 8px;
+        margin-bottom: 0;
       }
 
       .@{kd-prefix}-select {
@@ -266,6 +266,10 @@
       grid-row-gap: 8px;
       margin-top: 12px;
 
+      &-unset-color {
+        margin-top: 0;
+      }
+
       li {
         position: relative;
         box-sizing: border-box;

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;
+  var _a, _b, _c, _d;
   var _React$useContext = React.useContext(ConfigContext),
     getPrefixCls = _React$useContext.getPrefixCls,
     pkgPrefixCls = _React$useContext.prefixCls,
@@ -30,6 +30,7 @@ var Dropdown = /*#__PURE__*/React.forwardRef(function (props, ref) {
     onItemClick = allProps.onItemClick,
     defaultVisible = allProps.defaultVisible,
     onVisibleChange = allProps.onVisibleChange,
+    trigger = allProps.trigger,
     customPrefixcls = allProps.prefixCls;
   // className前缀
   var prefixCls = getPrefixCls(pkgPrefixCls, 'dropdown', customPrefixcls);
@@ -40,14 +41,30 @@ var Dropdown = /*#__PURE__*/React.forwardRef(function (props, ref) {
   React.useEffect(function () {
     setVisible(!!props.visible);
   }, [props.visible]);
-  var child = /*#__PURE__*/React.cloneElement(React.Children.only(children), {
+  var handleVisibleChange = function handleVisibleChange(visible) {
+    props.visible === undefined && setVisible(visible);
+    onVisibleChange && onVisibleChange(visible);
+  };
+  var child = children && ((_a = children === null || children === void 0 ? void 0 : children.type) === null || _a === void 0 ? void 0 : _a.displayName) === 'Input' ? /*#__PURE__*/React.createElement("span", {
+    className: classNames("".concat(prefixCls, "-trigger"), "".concat(prefixCls, "-trigger-container")),
+    ref: ref
+  }, trigger === 'focus' ? /*#__PURE__*/React.cloneElement(React.Children.only(children), {
+    onFocus: function onFocus(e) {
+      children.props.onFocus && children.props.onFocus(e);
+      handleVisibleChange(true);
+    },
+    onBlur: function onBlur(e) {
+      children.props.onBlur && children.props.onBlur(e);
+      handleVisibleChange(false);
+    }
+  }) : children) : /*#__PURE__*/React.cloneElement(React.Children.only(children), {
     ref: children.ref || ref,
     className: classNames("".concat(prefixCls, "-trigger"), children.props.className, {
       disabled: disabled
     })
   });
   var isMenu = menu.type === Menu;
-  var _React$useState3 = React.useState(props.selectedKey || ((_a = menu.props) === null || _a === void 0 ? void 0 : _a.defaultKey) || props.defaultKey || ''),
+  var _React$useState3 = React.useState(props.selectedKey || ((_b = menu.props) === null || _b === void 0 ? void 0 : _b.defaultKey) || props.defaultKey || ''),
     _React$useState4 = _slicedToArray(_React$useState3, 2),
     selectedKey = _React$useState4[0],
     setSelectedKey = _React$useState4[1];
@@ -56,7 +73,7 @@ var Dropdown = /*#__PURE__*/React.forwardRef(function (props, ref) {
       setSelectedKey(props.selectedKey);
     }
   }, [props.selectedKey]);
-  var menuSelectable = ((_b = menu.props) === null || _b === void 0 ? void 0 : _b.selectable) === undefined ? selectable : (_c = menu.props) === null || _c === void 0 ? void 0 : _c.selectable;
+  var menuSelectable = ((_c = menu.props) === null || _c === void 0 ? void 0 : _c.selectable) === undefined ? selectable : (_d = menu.props) === null || _d === void 0 ? void 0 : _d.selectable;
   var handleItemClick = function handleItemClick(e) {
     var _a;
     var item = findItem(e.target);
@@ -107,10 +124,6 @@ var Dropdown = /*#__PURE__*/React.forwardRef(function (props, ref) {
       role: "menuitem"
     }, href === undefined || disabled ? /*#__PURE__*/React.createElement("span", null, label) : /*#__PURE__*/React.createElement("a", _extends({}, alinkProps), /*#__PURE__*/React.createElement("span", null, label)));
   }));
-  var handleVisibleChange = function handleVisibleChange(visible) {
-    props.visible === undefined && setVisible(visible);
-    onVisibleChange && onVisibleChange(visible);
-  };
   var popperProps = _extends(_extends({}, allProps), {
     visible: visible,
     prefixCls: prefixCls,

package/es/dropdown/style/index.css

@@ -109,6 +109,9 @@
 .kd-dropdown-trigger {
   outline: none;
 }
+.kd-dropdown-trigger-container {
+  display: inline-block;
+}
 .kd-dropdown {
   -webkit-box-sizing: border-box;
           box-sizing: border-box;

package/es/dropdown/style/index.less

@@ -9,6 +9,10 @@
 
 .@{dropdown-trigger-prefix-cls} {
   outline: none;
+
+  &-container {
+    display: inline-block;
+  }
 }
 
 .@{dropdown-prefix-cls} {

package/es/filter/scheme.js

@@ -153,8 +153,9 @@ var SchemeFilter = function SchemeFilter(props) {
   };
   var handleChangeOption = function handleChangeOption(index, value) {
     var nextScheme = cloneDeep(scheme);
+    var realValue = value.target !== undefined ? value.target.value : value;
     nextScheme.items[index] = _extends(_extends({}, nextScheme.items[index]), {
-      value: value
+      value: realValue
     });
     setScheme(nextScheme);
   };