@kdcloudjs/kdesign 1.2.2 → 1.3.1

package/lib/carousel/style/index.less

@@ -10,71 +10,11 @@
     overflow: hidden;
     flex: 1;
   }
-  &-slidelist {
-    list-style: none;
-    display: flex;
-    flex-direction: row;
-    width: 100%;
-    &-item {
-      flex-shrink: 0;
-      height: 100%;
-      width: 100%;
-      overflow: hidden;
-      border-radius: @carousel-boder-radius;
-    }
-  }
-  &-fadelist {
-    list-style: none;
-    display: flex;
-    flex-direction: row;
-    flex: 1;
-    position: relative;
-    &-item {
-      opacity: 1;
-      position: relative;
-      flex-shrink: 0;
-      height: 100%;
-      width: 100%;
-      &-animation {
-        transition: opacity 0.3s ease;
-      }
-      &-none-animation {
-        transition: none;
-      }
-      &-not-hidden {
-        opacity: 1;
-      }
-      &-hidden {
-        opacity: 0;
-      }
-    }
-  }
-  &-displaylist {
-    list-style: none;
-    display: flex;
-    flex-direction: row;
-    flex: 1;
-    position: relative;
-    &-item {
-      display: block;
-      position: relative;
-      flex-shrink: 0;
-      height: 100%;
-      width: 100%;
-      &-not-hidden {
-        display: block;
-      }
-      &-hidden {
-        display: none;
-      }
-    }
-  }
 
   &-list {
     list-style: none;
     display: flex;
     flex-direction: row;
-    flex: 1;
     position: relative;
 
     &-item {
@@ -85,6 +25,7 @@
     }
 
     &-slide {
+      width: 100%;
       .@{carousel-prefix-cls}-list-item {
         opacity: 1;
         border-radius: @carousel-boder-radius;
@@ -104,6 +45,7 @@
     }
 
     &-fade {
+      flex: 1;
       .@{carousel-prefix-cls}-list-item {
         opacity: 1;
         &-animation {
@@ -122,6 +64,7 @@
     }
 
     &-display {
+      width: 100%;
       .@{carousel-prefix-cls}-list-item {
         display: block;
         &-not-hidden {

package/lib/checkbox/checkbox.js

@@ -64,7 +64,8 @@ var InternalCheckbox = function InternalCheckbox(props, ref) {
       children = CheckboxProps.children,
       style = CheckboxProps.style,
       value = CheckboxProps.value,
-      indeterminate = CheckboxProps.indeterminate;
+      indeterminate = CheckboxProps.indeterminate,
+      name = CheckboxProps.name;
 
   var getChecked = function getChecked() {
     return (0, _isBoolean.default)(checked) ? checked : defaultChecked;
@@ -134,7 +135,8 @@ var InternalCheckbox = function InternalCheckbox(props, ref) {
         ref: ref,
         value: value,
         checked: selected,
-        disabled: disabled
+        disabled: disabled,
+        name: name
       })), children && /*#__PURE__*/_react.default.createElement("span", {
         className: "".concat(checkboxPrefixCls, "-children")
       }, children), !isDefaultType() && /*#__PURE__*/_react.default.createElement("span", {

package/lib/checkbox/style/index.css

@@ -151,6 +151,10 @@
       -ms-flex-align: center;
           align-items: center;
   z-index: 999;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+      -ms-user-select: none;
+          user-select: none;
 }
 .kd-checkbox-children .kd-input-underline {
   background-color: transparent;
@@ -383,3 +387,6 @@
 .kd-checkbox-default.checked .kd-checkbox-children {
   color: var(--kd-c-checkbox-color-text-primary, #212121);
 }
+.kd-checkbox-default-indeterminate .kd-checkbox-children {
+  color: var(--kd-c-checkbox-color-text-primary, #212121);
+}

package/lib/checkbox/style/index.less

@@ -38,6 +38,8 @@
     justify-content: center;
     align-items: center;
     z-index: 999;
+    user-select: none;
+
     .kd-input-underline {
       background-color: transparent;
       border-bottom: none;
@@ -249,4 +251,9 @@
       color: @checkbox-font-color;
     }
   }
+  &-indeterminate {
+    .@{checkbox-prefix-cls}-children {
+      color: @checkbox-font-color;
+    }
+  }
 }

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

@@ -383,6 +383,7 @@ declare const compDefaultProps: {
         minMark: string;
         maxMark: string;
         mustInScope: boolean;
+        zeroShow: boolean;
     };
     BaseData: {
         mode: string;

package/lib/config-provider/compDefaultProps.js

@@ -415,7 +415,8 @@ var compDefaultProps = {
     borderType: 'bordered',
     minMark: '[',
     maxMark: ']',
-    mustInScope: false
+    mustInScope: false,
+    zeroShow: true
   },
   BaseData: {
     mode: 'single',

package/lib/dropdown/style/index.css

@@ -151,7 +151,7 @@
 .kd-dropdown.arrow::before {
   position: absolute;
   z-index: -2;
-  background: transparent;
+  background: var(--kd-g-color-background, #fff);
   border-style: solid;
   border-width: var(--arrowSize);
   -webkit-transform: rotate(45deg);
@@ -176,7 +176,7 @@
   top: var(--arrowSpill);
   -webkit-box-shadow: -2px -2px calc(10px - 1px) rgba(0, 0, 0, 0.1);
           box-shadow: -2px -2px calc(10px - 1px) rgba(0, 0, 0, 0.1);
-  border-color: var(--kd-g-color-white, #fff) transparent transparent var(--kd-g-color-white, #fff);
+  border-color: var(--kd-g-color-background, #fff) transparent transparent var(--kd-g-color-background, #fff);
 }
 .kd-dropdown.arrow.topLeft::before,
 .kd-dropdown.arrow.top::before,
@@ -185,7 +185,7 @@
   bottom: var(--arrowSpill);
   -webkit-box-shadow: 3px 3px calc(10px + 1px) rgba(0, 0, 0, 0.15);
           box-shadow: 3px 3px calc(10px + 1px) rgba(0, 0, 0, 0.15);
-  border-color: transparent var(--kd-g-color-white, #fff) var(--kd-g-color-white, #fff) transparent;
+  border-color: transparent var(--kd-g-color-background, #fff) var(--kd-g-color-background, #fff) transparent;
 }
 .kd-dropdown.arrow.leftTop::before,
 .kd-dropdown.arrow.left::before,
@@ -194,7 +194,7 @@
   right: var(--arrowSpill);
   -webkit-box-shadow: 3px 0 10px rgba(0, 0, 0, 0.12), 0 -2px 10px rgba(204, 149, 149, 0.12);
           box-shadow: 3px 0 10px rgba(0, 0, 0, 0.12), 0 -2px 10px rgba(204, 149, 149, 0.12);
-  border-color: var(--kd-g-color-white, #fff) var(--kd-g-color-white, #fff) transparent transparent;
+  border-color: var(--kd-g-color-background, #fff) var(--kd-g-color-background, #fff) transparent transparent;
 }
 .kd-dropdown.arrow.rightTop::before,
 .kd-dropdown.arrow.right::before,
@@ -203,7 +203,7 @@
   left: var(--arrowSpill);
   -webkit-box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1), -2px 0 10px rgba(0, 0, 0, 0.1);
           box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1), -2px 0 10px rgba(0, 0, 0, 0.1);
-  border-color: transparent transparent var(--kd-g-color-white, #fff) var(--kd-g-color-white, #fff);
+  border-color: transparent transparent var(--kd-g-color-background, #fff) var(--kd-g-color-background, #fff);
 }
 .kd-dropdown-menu {
   max-height: var(--kd-c-dropdown-menu-sizing-max-height, 336px);

package/lib/form/Field.d.ts

@@ -3,7 +3,7 @@ import { NamePath, LabelAlign, Rule } from './interface';
 export interface FormItemProps {
     children?: React.ReactNode;
     className?: string;
-    defaultValue?: string;
+    defaultValue?: any;
     disabled?: boolean;
     hidden?: boolean;
     label?: string | number;
@@ -15,6 +15,7 @@ export interface FormItemProps {
     rules?: Rule[];
     validateTrigger?: string | string[];
     wrapperWidth?: string | number;
+    valuePropName?: string;
 }
 declare const Field: React.FC<FormItemProps>;
 export default Field;

package/lib/form/Field.js

@@ -13,7 +13,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
-var _extends3 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
+var _extends5 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
 
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
 
@@ -23,8 +23,12 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime-corejs3/hel
 
 var _getOwnPropertySymbols = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols"));
 
+var _concat = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/concat"));
+
 var _map = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/map"));
 
+var _includes = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/includes"));
+
 var _react = _interopRequireWildcard(require("react"));
 
 var _get = _interopRequireDefault(require("lodash/get"));
@@ -65,6 +69,7 @@ var __rest = void 0 && (void 0).__rest || function (s, e) {
 };
 
 var DEFAULT_TRIGGER = 'onChange';
+var FormEventValuePropNames = ['value', 'checked'];
 
 var generateEventHandler = function generateEventHandler(handler, validateTrigger) {
   var eventHandler = {};
@@ -85,7 +90,7 @@ var generateEventHandler = function generateEventHandler(handler, validateTrigge
 };
 
 var Field = function Field(props) {
-  var _classnames, _context;
+  var _classnames, _context2;
 
   (0, _devwarning.default)(! /*#__PURE__*/_react.default.isValidElement(props.children), 'Form.Item', 'Children of Form.Item is not a valid element');
   (0, _devwarning.default)(!props.name, 'Form.Item', 'Form.Item must have a name');
@@ -107,7 +112,8 @@ var Field = function Field(props) {
       getFieldError = fieldContext.getFieldError,
       getInternalHooks = fieldContext.getInternalHooks,
       vertical = fieldContext.vertical,
-      getDefaultValue = fieldContext.getDefaultValue;
+      getDefaultValue = fieldContext.getDefaultValue,
+      local = fieldContext.local;
 
   var _getInternalHooks = getInternalHooks(_useForm.INTERNAL_HOOK_KEY),
       registerField = _getInternalHooks.registerField,
@@ -128,7 +134,9 @@ var Field = function Field(props) {
       rules = _props$rules === void 0 ? [] : _props$rules,
       wrapperWidth = props.wrapperWidth,
       validateTrigger = props.validateTrigger,
-      defaultValue = props.defaultValue;
+      defaultValue = props.defaultValue,
+      _props$valuePropName = props.valuePropName,
+      valuePropName = _props$valuePropName === void 0 ? 'value' : _props$valuePropName;
 
   var onStoreChange = function onStoreChange(stores, _namePathList, source) {
     var prev = stores.prev,
@@ -162,8 +170,11 @@ var Field = function Field(props) {
   if (Array.isArray(rules) && !rules.some(function (rule) {
     return Object.prototype.hasOwnProperty.call(rule, 'required');
   }) && required) {
+    var _context;
+
     rules.push({
-      required: true
+      required: true,
+      message: (0, _concat.default)(_context = "".concat(local && local.requiredMessage)).call(_context, label)
     });
   }
 
@@ -200,10 +211,22 @@ var Field = function Field(props) {
   var value = getFieldValue(name);
   var validateMessage = getFieldError(name);
 
-  var handleValueChange = _react.default.useCallback(function (evt) {
+  var getInputValueFormProp = function getInputValueFormProp(evt) {
     var _a;
 
-    var inputValue = typeof evt === 'string' ? evt : (_a = evt.target) === null || _a === void 0 ? void 0 : _a.value;
+    var inputValue;
+
+    if (Object.prototype.hasOwnProperty.call(evt, 'target') && (0, _includes.default)(FormEventValuePropNames).call(FormEventValuePropNames, valuePropName)) {
+      inputValue = (_a = evt.target) === null || _a === void 0 ? void 0 : _a[valuePropName];
+    } else {
+      inputValue = evt;
+    }
+
+    return inputValue;
+  };
+
+  var handleValueChange = _react.default.useCallback(function (evt) {
+    var inputValue = getInputValueFormProp(evt);
     dispatch({
       type: 'updateValue',
       namePath: name,
@@ -218,9 +241,11 @@ var Field = function Field(props) {
     });
   }, [name]);
 
-  var trigger = (0, _extends3.default)((0, _defineProperty2.default)({}, DEFAULT_TRIGGER, handleValueChange), generateEventHandler(handleValueValidate, validateTrigger));
+  var trigger = (0, _extends5.default)((0, _defineProperty2.default)({}, DEFAULT_TRIGGER, handleValueChange), generateEventHandler(handleValueValidate, validateTrigger));
 
   var mergeProps = function mergeProps(fa, ch) {
+    var _extends3;
+
     if (!ch) {
       return {};
     }
@@ -231,17 +256,13 @@ var Field = function Field(props) {
 
     var _ch$props = ch.props,
         chChange = _ch$props.onChange,
-        chValue = _ch$props.value,
+        chValue = _ch$props[valuePropName],
         chDisabled = _ch$props.disabled,
         chDefaultValue = _ch$props.defaultValue;
 
     var onChange = function onChange(evt) {
       if (chValue === undefined) {
-        if (typeof evt === 'string') {
-          setFieldValue(evt);
-        } else {
-          setFieldValue(evt.target.value);
-        }
+        setFieldValue(getInputValueFormProp(evt));
       }
 
       if (typeof faChange === 'function') {
@@ -264,12 +285,10 @@ var Field = function Field(props) {
       forceUpdate();
     }
 
-    return (0, _extends3.default)((0, _extends3.default)({}, rest), {
+    return (0, _extends5.default)((0, _extends5.default)({}, rest), (_extends3 = {
       onChange: onChange,
-      defaultValue: defaultValue,
-      value: fieldValue,
-      disabled: chDisabled || faDisabled
-    });
+      defaultValue: defaultValue
+    }, (0, _defineProperty2.default)(_extends3, valuePropName, fieldValue), (0, _defineProperty2.default)(_extends3, "disabled", chDisabled || faDisabled), _extends3));
   };
 
   return /*#__PURE__*/_react.default.createElement("div", {
@@ -282,11 +301,10 @@ var Field = function Field(props) {
   }), /*#__PURE__*/_react.default.createElement(_FieldWrapper.default, {
     width: wrapperWidth,
     validateMessage: validateMessage
-  }, (0, _map.default)(_context = (0, _reactChildren.toArray)(children)).call(_context, function (child, index) {
-    var keys = mergeProps((0, _extends3.default)((0, _extends3.default)({
-      disabled: disabled,
-      value: value
-    }, trigger), {
+  }, (0, _map.default)(_context2 = (0, _reactChildren.toArray)(children)).call(_context2, function (child, index) {
+    var keys = mergeProps((0, _extends5.default)((0, _extends5.default)((0, _defineProperty2.default)({
+      disabled: disabled
+    }, valuePropName, value), trigger), {
       key: index
     }), child);
     return child ? /*#__PURE__*/_react.default.cloneElement(child, keys) : child;

package/lib/form/Form.js

@@ -60,9 +60,13 @@ var Form = function Form(props, ref) {
   var _useContext = (0, _react.useContext)(_configProvider.ConfigContext),
       getPrefixCls = _useContext.getPrefixCls,
       prefixCls = _useContext.prefixCls,
-      userDefaultProps = _useContext.compDefaultProps;
+      userDefaultProps = _useContext.compDefaultProps,
+      globalLocale = _useContext.locale;
 
   var formProps = (0, _utils.getCompProps)('Form', userDefaultProps, props);
+  var formLang = globalLocale.getCompLangMsg({
+    componentName: 'Form'
+  });
 
   var children = formProps.children,
       defaultValues = formProps.defaultValues,
@@ -116,9 +120,10 @@ var Form = function Form(props, ref) {
       labelAlign: labelAlign,
       labelWidth: labelWidth,
       wrapperWidth: wrapperWidth,
+      local: formLang,
       vertical: layout === 'vertical'
     });
-  }, [formInstance, labelAlign, labelWidth, wrapperWidth, layout]);
+  }, [formInstance, labelAlign, labelWidth, wrapperWidth, layout, formLang]);
 
   var handleSubmit = function handleSubmit(evt) {
     evt.preventDefault();

package/lib/form/hooks/useForm.js

@@ -229,6 +229,7 @@ var FormStore = /*#__PURE__*/(0, _createClass2.default)(function FormStore() {
     }
 
     _this.store = newStore;
+    _this.errorMessages = {};
 
     _this.notifyObservers(prevStore, null, 'reset');
   };

package/lib/form/interface.d.ts

@@ -25,11 +25,16 @@ export interface FormInstance<Values = any> {
     submit: () => void;
     getInternalHooks: (secret: string) => InternalHooks | null;
 }
+export interface InnerLocale {
+    locale: string;
+    requiredMessage: string;
+}
 export interface InternalFormInstance extends FormInstance {
     labelWidth?: string | number;
     labelAlign?: LabelAlign;
     wrapperWidth?: string | number;
     vertical?: boolean;
+    local?: InnerLocale;
     getInternalHooks: (key: string) => InternalHooks | null;
 }
 export declare type Stores = {

package/lib/input-number/inputNumber.d.ts

@@ -21,6 +21,7 @@ export interface InputNumberProps extends InputProps {
     mustInPrecisionScope?: boolean;
     stepOption?: StepOption;
     stepperrref?: any;
+    formatter?: (value: string | undefined) => string;
 }
 declare const InputNumber: React.ForwardRefExoticComponent<InputNumberProps & React.RefAttributes<unknown>>;
 export default InputNumber;

package/lib/input-number/inputNumber.js

@@ -84,7 +84,8 @@ var InternalInputNumber = function InternalInputNumber(props, ref) {
       maxMark = inputNumberProps.maxMark,
       prefix = inputNumberProps.prefix,
       suffix = inputNumberProps.suffix,
-      others = __rest(inputNumberProps, ["value", "defaultValue", "mustInScope", "decimalLength", "mustInPrecisionScope", "digitLength", "onChange", "symbol", "zeroShow", "showDecimalTailZero", "code", "roundMethod", "mask", "stepOption", "min", "minMark", "max", "maxMark", "prefix", "suffix"]);
+      formatter = inputNumberProps.formatter,
+      others = __rest(inputNumberProps, ["value", "defaultValue", "mustInScope", "decimalLength", "mustInPrecisionScope", "digitLength", "onChange", "symbol", "zeroShow", "showDecimalTailZero", "code", "roundMethod", "mask", "stepOption", "min", "minMark", "max", "maxMark", "prefix", "suffix", "formatter"]);
 
   var initVal = value === undefined ? defaultValue : value;
 
@@ -364,7 +365,7 @@ var InternalInputNumber = function InternalInputNumber(props, ref) {
   });
   return /*#__PURE__*/_react.default.createElement(_input.default, (0, _extends2.default)({}, others, {
     ref: inputNumberRef,
-    value: inputValue,
+    value: inputValue ? (formatter === null || formatter === void 0 ? void 0 : formatter(inputValue)) || inputValue : inputValue,
     prefix: prefix,
     suffix: suffix,
     onChange: handleChange,

package/lib/locale/locale.d.ts

@@ -84,6 +84,7 @@ declare class LocaleCache {
         'Filter.and': string;
         'Filter.settings': string;
         'Filter.schemeNamePlaceholder': string;
+        'Form.requiredMessage': string;
         'DatePicker.placeholder': string;
         'DatePicker.yearPlaceholder': string;
         'DatePicker.quarterPlaceholder': string;

package/lib/locale/zh-CN.d.ts

@@ -58,6 +58,7 @@ declare const locale: {
     'Filter.and': string;
     'Filter.settings': string;
     'Filter.schemeNamePlaceholder': string;
+    'Form.requiredMessage': string;
     'DatePicker.placeholder': string;
     'DatePicker.yearPlaceholder': string;
     'DatePicker.quarterPlaceholder': string;

package/lib/locale/zh-CN.js

@@ -72,7 +72,8 @@ var locale = (0, _extends2.default)((0, _extends2.default)({
   'Filter.query': '查询',
   'Filter.and': '并且',
   'Filter.settings': '设置',
-  'Filter.schemeNamePlaceholder': '请输入方案名称'
+  'Filter.schemeNamePlaceholder': '请输入方案名称',
+  'Form.requiredMessage': '请输入您的'
 });
 var _default = locale;
 exports.default = _default;

package/lib/menu/subMenu.js

@@ -241,6 +241,11 @@ var SubMenu = function SubMenu(props) {
 
     // 保存路径
     info.keyPath = (0, _concat.default)(_context = info.keyPath).call(_context, [keyValue]);
+
+    if (triggerSubMenuAction === 'click' && mode === 'vertical') {
+      closeSubMenu();
+    }
+
     restProps.handleOnClick && restProps.handleOnClick(info);
   }; // 子菜单展开收缩
 
@@ -390,8 +395,7 @@ var SubMenu = function SubMenu(props) {
   return /*#__PURE__*/React.createElement("li", (0, _extends2.default)({
     ref: subMenuRef,
     className: (0, _classnames.default)(prefixCls, className, (_classNames2 = {}, (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-collapsed"), collapsed), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-disabled"), disabled), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-hover"), !disabled && isVisible), _classNames2)),
-    key: keyValue,
-    title: title
+    key: keyValue
   }, mouseEvent, {
     style: style
   }), /*#__PURE__*/React.createElement("div", {

package/lib/popconfirm/style/index.css

@@ -142,7 +142,7 @@
 .kd-popconfirm.arrow::before {
   position: absolute;
   z-index: -2;
-  background: transparent;
+  background: var(--kd-c-popconfirm-color-background, var(--kd-g-color-background, #fff));
   border-style: solid;
   border-width: var(--arrowSize);
   -webkit-transform: rotate(45deg);
@@ -167,7 +167,7 @@
   top: var(--arrowSpill);
   -webkit-box-shadow: -2px -2px calc(16px - 1px) rgba(0, 0, 0, 0.1);
           box-shadow: -2px -2px calc(16px - 1px) rgba(0, 0, 0, 0.1);
-  border-color: var(--kd-g-color-white, #fff) transparent transparent var(--kd-g-color-white, #fff);
+  border-color: var(--kd-c-popconfirm-color-background, var(--kd-g-color-background, #fff)) transparent transparent var(--kd-c-popconfirm-color-background, var(--kd-g-color-background, #fff));
 }
 .kd-popconfirm.arrow.topLeft::before,
 .kd-popconfirm.arrow.top::before,
@@ -176,7 +176,7 @@
   bottom: var(--arrowSpill);
   -webkit-box-shadow: 3px 3px calc(16px + 1px) rgba(0, 0, 0, 0.15);
           box-shadow: 3px 3px calc(16px + 1px) rgba(0, 0, 0, 0.15);
-  border-color: transparent var(--kd-g-color-white, #fff) var(--kd-g-color-white, #fff) transparent;
+  border-color: transparent var(--kd-c-popconfirm-color-background, var(--kd-g-color-background, #fff)) var(--kd-c-popconfirm-color-background, var(--kd-g-color-background, #fff)) transparent;
 }
 .kd-popconfirm.arrow.leftTop::before,
 .kd-popconfirm.arrow.left::before,
@@ -185,7 +185,7 @@
   right: var(--arrowSpill);
   -webkit-box-shadow: 3px 0 16px rgba(0, 0, 0, 0.12), 0 -2px 16px rgba(204, 149, 149, 0.12);
           box-shadow: 3px 0 16px rgba(0, 0, 0, 0.12), 0 -2px 16px rgba(204, 149, 149, 0.12);
-  border-color: var(--kd-g-color-white, #fff) var(--kd-g-color-white, #fff) transparent transparent;
+  border-color: var(--kd-c-popconfirm-color-background, var(--kd-g-color-background, #fff)) var(--kd-c-popconfirm-color-background, var(--kd-g-color-background, #fff)) transparent transparent;
 }
 .kd-popconfirm.arrow.rightTop::before,
 .kd-popconfirm.arrow.right::before,
@@ -194,7 +194,7 @@
   left: var(--arrowSpill);
   -webkit-box-shadow: 0 3px 16px rgba(0, 0, 0, 0.1), -2px 0 16px rgba(0, 0, 0, 0.1);
           box-shadow: 0 3px 16px rgba(0, 0, 0, 0.1), -2px 0 16px rgba(0, 0, 0, 0.1);
-  border-color: transparent transparent var(--kd-g-color-white, #fff) var(--kd-g-color-white, #fff);
+  border-color: transparent transparent var(--kd-c-popconfirm-color-background, var(--kd-g-color-background, #fff)) var(--kd-c-popconfirm-color-background, var(--kd-g-color-background, #fff));
 }
 .kd-popconfirm-content {
   -webkit-box-sizing: border-box;

package/lib/select/index.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
-import { ISelectProps } from './interface';
+import { ISelectProps, SelectValue } from './interface';
 import Option from './option';
-interface CompoundedComponent extends React.ForwardRefExoticComponent<ISelectProps & React.RefAttributes<HTMLElement>> {
+interface CompoundedComponent extends React.ForwardRefExoticComponent<ISelectProps<SelectValue> & React.RefAttributes<HTMLElement>> {
     Option: typeof Option;
 }
 declare const Select: CompoundedComponent;

package/lib/select/interface.d.ts

@@ -43,17 +43,17 @@ export interface OptionsType {
     value?: string;
     label?: React.ReactNode;
 }
-export declare type SelectValue = string | string[] | number | number[] | LabeledValue | LabeledValue[] | null;
-export interface ISelectProps<T = SelectValue> extends AbstractSelectProps {
+export declare type SelectValue = string | string[] | number | number[] | LabeledValue | LabeledValue[] | null | undefined;
+export interface ISelectProps<T extends SelectValue> extends AbstractSelectProps {
     value?: T;
     defaultValue?: T;
     mode?: Mode;
     autoFocus?: boolean;
-    onChange?: (value: T, option: React.ReactElement<any> | React.ReactElement<any>[]) => void;
-    onSelect?: (value: T extends (infer I)[] ? I : T, option: React.ReactElement<any>) => void;
-    onBlur?: (value: T) => void;
+    onChange?: (value?: T, option?: React.ReactElement<any> | React.ReactElement<any>[]) => void;
+    onSelect?: (value?: T extends (infer I)[] ? I : T, option?: React.ReactElement<any>) => void;
+    onBlur?: (value?: T) => void;
     onFocus?: () => void;
-    onSearch?: () => void;
+    onSearch?: (value?: string) => void;
     onClear?: () => void;
-    onDropdownVisibleChange?: (value: T) => void;
+    onDropdownVisibleChange?: (value?: T) => void;
 }

package/lib/select/select.js

@@ -258,8 +258,19 @@ var InternalSelect = function InternalSelect(props, ref) {
       onDropdownVisibleChange && onDropdownVisibleChange(!optionShow);
     } // handleClear()
 
-  }; // 点击下拉列表中某项回调
+  };
+
+  (0, _react.useEffect)(function () {
+    selectionRef.current.addEventListener('mouseup', function (e) {
+      var _a;
+
+      var isCloseBtn = ((_a = e === null || e === void 0 ? void 0 : e.target) === null || _a === void 0 ? void 0 : _a.className.indexOf('kd-tag-close-icon')) > -1;
 
+      if (isCloseBtn) {
+        e.stopPropagation();
+      }
+    });
+  }, []); // 点击下拉列表中某项回调
 
   var handleOption = function handleOption(key, label, isSelected) {
     var _a, _b, _c;