@kdcloudjs/kdesign 1.7.34 → 1.7.37

package/lib/tree-select/interface.d.ts

@@ -56,6 +56,7 @@ export interface ITreeSelectProps<T extends TreeSelectValue> extends AbstractSel
     defaultValue?: T;
     mode?: Mode;
     autoFocus?: boolean;
+    status?: 'error';
     onlyExpandOnClickIcon?: boolean;
     onChange?: (value: T, treeNode: TreeNodeData) => void;
     onSelect?: (value: T extends (infer I)[] ? I : T, { checked, node, event }: any) => void;

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

@@ -163,7 +163,7 @@
 .kd-tree-select-icon-clear:hover {
   color: var(--kd-c-tree-select-color-border-hover, var(--kd-g-color-theme, #5582f3));
 }
-.kd-tree-select-focused {
+.kd-tree-select-focused:not(.kd-tree-select-error) {
   border-color: var(--kd-c-tree-select-color-border-foucs, var(--kd-g-color-theme, #5582f3)) !important;
 }
 .kd-tree-select-placeholder {
@@ -181,7 +181,7 @@
 .kd-tree-select-underline {
   border-bottom: 1px solid var(--kd-c-tree-select-color-border, var(--kd-g-color-input, #999));
 }
-.kd-tree-select-underline:hover:not(.kd-tree-select-multiple-disabled):not(.kd-tree-select-single-disabled) {
+.kd-tree-select-underline:hover:not(.kd-tree-select-multiple-disabled):not(.kd-tree-select-single-disabled):not( .kd-tree-select-error) {
   border-bottom: 1px solid var(--kd-c-tree-select-color-border-hover, var(--kd-g-color-theme, #5582f3));
 }
 .kd-tree-select-bordered {
@@ -189,7 +189,7 @@
   padding-left: var(--kd-c-tree-select-bordered-spacing-padding-left, 8px) !important;
   border-radius: var(--kd-c-tree-select-bordered-radius-border, 2px);
 }
-.kd-tree-select-bordered:hover:not(.kd-tree-select-multiple-disabled):not(.kd-tree-select-single-disabled) {
+.kd-tree-select-bordered:hover:not(.kd-tree-select-multiple-disabled):not(.kd-tree-select-single-disabled):not( .kd-tree-select-error) {
   border: 1px solid var(--kd-c-tree-select-color-border-hover, var(--kd-g-color-theme, #5582f3));
 }
 .kd-tree-select-bordered .kd-tree-select-suffix {
@@ -312,7 +312,7 @@
   white-space: nowrap;
   text-overflow: ellipsis;
 }
-.kd-tree-select .kd-tree-select-single-focused {
+.kd-tree-select .kd-tree-select-single-focused:not(.kd-tree-select-error) {
   border-color: var(--kd-c-tree-select-color-border-foucs, var(--kd-g-color-theme, #5582f3)) !important;
 }
 .kd-tree-select .kd-tree-select-single-disabled {
@@ -495,6 +495,9 @@
   color: var(--kd-c-tree-select-footer-color-text-selected, #0e5fd8);
   padding: 0 2px;
 }
+.kd-tree-select-error:not(.kd-tree-select-single-disabled):not(.kd-tree-select-multiple-disabled) {
+  border-color: var(--kd-c-tree-select-color-error, var(--kd-g-color-error, #fb2323));
+}
 .kd-tree-select.topLeft.hidden,
 .kd-tree-select.bottomLeft.hidden,
 .kd-tree-select.topRight.hidden,

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

@@ -59,7 +59,7 @@
     }
   }
 
-  &-focused {
+  &-focused:not(.@{tree-select-prefix-cls}-error) {
     .focusColor();
   }
   &-placeholder {
@@ -78,7 +78,9 @@
 
   &-underline {
     border-bottom: 1px solid @tree-select-g-color-border;
-    &:hover:not(.@{tree-select-prefix-cls}-multiple-disabled):not(.@{tree-select-prefix-cls}-single-disabled) {
+    &:hover:not(.@{tree-select-prefix-cls}-multiple-disabled):not(.@{tree-select-prefix-cls}-single-disabled):not(
+        .@{tree-select-prefix-cls}-error
+      ) {
       border-bottom: 1px solid @tree-select-g-color-border-hover;
     }
   }
@@ -87,7 +89,9 @@
     border: 1px solid @tree-select-border-g-color-border;
     padding-left: @tree-select-bordered !important;
     border-radius: @tree-select-border-radius-border;
-    &:hover:not(.@{tree-select-prefix-cls}-multiple-disabled):not(.@{tree-select-prefix-cls}-single-disabled) {
+    &:hover:not(.@{tree-select-prefix-cls}-multiple-disabled):not(.@{tree-select-prefix-cls}-single-disabled):not(
+        .@{tree-select-prefix-cls}-error
+      ) {
       border: 1px solid @tree-select-g-color-border-hover;
     }
 
@@ -206,7 +210,7 @@
         .over();
       }
     }
-    &-focused {
+    &-focused:not(.@{tree-select-prefix-cls}-error) {
       .focusColor();
     }
     &-disabled {
@@ -383,6 +387,10 @@
     }
   }
 
+  &-error:not(.@{tree-select-prefix-cls}-single-disabled):not(.@{tree-select-prefix-cls}-multiple-disabled) {
+    border-color: @tree-select-error-color;
+  }
+
   &.topLeft.hidden,
   &.bottomLeft.hidden,
   &.topRight.hidden,

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

@@ -22,6 +22,7 @@
 @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);
+@tree-select-error-color: var(~'@{tree-select-custom-prefix}-color-error', @color-error);
 
 // font
 @tree-select-list-font-size: var(~'@{tree-select-custom-prefix}-dropdown-font-size', 12px); // 下拉列表文字大小

package/lib/tree-select/tree-select.js

@@ -110,7 +110,8 @@ var InternalTreeSelect = function InternalTreeSelect(props, ref) {
     onCheck = treeSelectProps.onCheck,
     dropdownRender = treeSelectProps.dropdownRender,
     onlyExpandOnClickIcon = treeSelectProps.onlyExpandOnClickIcon,
-    listHeight = treeSelectProps.listHeight;
+    listHeight = treeSelectProps.listHeight,
+    status = treeSelectProps.status;
   var isMultiple = mode === 'multiple'; // 是否多选
   var _useMergedState = (0, _hooks.useMergedState)(isMultiple ? [] : undefined, {
       value: value,
@@ -166,7 +167,7 @@ var InternalTreeSelect = function InternalTreeSelect(props, ref) {
   // 下拉列表框样式
   var dropDownCls = (0, _classnames.default)(dropdownClassName, (0, _defineProperty2.default)({}, "".concat(selectPrefixCls, "-dropdown"), true));
   // 多选，单选公共样式
-  var commCls = (0, _classnames.default)((_classNames4 = {}, (0, _defineProperty2.default)(_classNames4, "".concat(selectPrefixCls, "-bordered"), borderType === 'bordered'), (0, _defineProperty2.default)(_classNames4, "".concat(selectPrefixCls, "-underline"), borderType === 'underline'), (0, _defineProperty2.default)(_classNames4, "".concat(selectPrefixCls, "-borderless"), borderType === 'none'), (0, _defineProperty2.default)(_classNames4, (0, _concat.default)(_context3 = "".concat(selectPrefixCls, "-size-")).call(_context3, size), size), (0, _defineProperty2.default)(_classNames4, "".concat(selectPrefixCls, "-wrapper"), true), _classNames4));
+  var commCls = (0, _classnames.default)((_classNames4 = {}, (0, _defineProperty2.default)(_classNames4, "".concat(selectPrefixCls, "-bordered"), borderType === 'bordered'), (0, _defineProperty2.default)(_classNames4, "".concat(selectPrefixCls, "-underline"), borderType === 'underline'), (0, _defineProperty2.default)(_classNames4, "".concat(selectPrefixCls, "-borderless"), borderType === 'none'), (0, _defineProperty2.default)(_classNames4, (0, _concat.default)(_context3 = "".concat(selectPrefixCls, "-size-")).call(_context3, size), size), (0, _defineProperty2.default)(_classNames4, "".concat(selectPrefixCls, "-wrapper"), true), (0, _defineProperty2.default)(_classNames4, "".concat(selectPrefixCls, "-error"), status === 'error'), _classNames4));
   (0, _react.useEffect)(function () {
     var arr = [];
     if (isMultiple) {
@@ -365,6 +366,9 @@ var InternalTreeSelect = function InternalTreeSelect(props, ref) {
       (_a = searchRef.current) === null || _a === void 0 ? void 0 : _a.focus();
     }
   }, [showSearch, autoFocus, disabled]);
+  (0, _react.useEffect)(function () {
+    setSelectedKeys(initValue);
+  }, [initValue]);
   // 渲染下拉列表框
   var renderContent = function renderContent() {
     var dropDownStyle = (0, _extends2.default)({

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kdcloudjs/kdesign",
-  "version": "1.7.34",
+  "version": "1.7.37",
   "description": "KDesign 金蝶前端react 组件库",
   "title": "kdesign",
   "keywords": [

package/es/color-picker/utils/hooks/useOnClickOutside.d.ts

@@ -1,2 +0,0 @@
-declare const useOnClickOutside: (refArr: Array<any>, handler: (e: Event) => void) => void;
-export default useOnClickOutside;

package/es/color-picker/utils/hooks/useOnClickOutside.js

@@ -1,16 +0,0 @@
-import { useEffect } from 'react';
-var useOnClickOutside = function useOnClickOutside(refArr, handler) {
-  useEffect(function () {
-    var mouseDownListener = function mouseDownListener(event) {
-      if (refArr.some(function (ref) {
-        return !ref.current || ref.current.contains(event.target);
-      })) {
-        return;
-      }
-      handler(event);
-    };
-    document.addEventListener('mousedown', mouseDownListener);
-    document.addEventListener('touchstart', mouseDownListener);
-  }, [refArr, handler]);
-};
-export default useOnClickOutside;

package/lib/color-picker/utils/hooks/useOnClickOutside.d.ts

@@ -1,2 +0,0 @@
-declare const useOnClickOutside: (refArr: Array<any>, handler: (e: Event) => void) => void;
-export default useOnClickOutside;

package/lib/color-picker/utils/hooks/useOnClickOutside.js

@@ -1,23 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = require("react");
-var useOnClickOutside = function useOnClickOutside(refArr, handler) {
-  (0, _react.useEffect)(function () {
-    var mouseDownListener = function mouseDownListener(event) {
-      if (refArr.some(function (ref) {
-        return !ref.current || ref.current.contains(event.target);
-      })) {
-        return;
-      }
-      handler(event);
-    };
-    document.addEventListener('mousedown', mouseDownListener);
-    document.addEventListener('touchstart', mouseDownListener);
-  }, [refArr, handler]);
-};
-var _default = useOnClickOutside;
-exports.default = _default;