@kdcloudjs/kdesign 1.3.6 → 1.3.9

package/lib/menu/style/mixin.less

@@ -20,12 +20,15 @@
   cursor: pointer;
 
   &-title {
-    .menuItemTitle();
-  }
-
-  &-title > span {
-    opacity: 1;
-    transition: opacity calc(@menu-motion-duration - 0.1s) cubic-bezier(0,.4,.4,1);
+    display: flex;
+    align-items: center;
+    height: 50px;
+    .ellipsis();
+    & > span {
+      .ellipsis();
+      opacity: 1;
+      transition: opacity calc(@menu-motion-duration - 0.1s) cubic-bezier(0, .4, .4, 1);
+    }
   }
 
   &-collapsed {
@@ -42,7 +45,7 @@
 
       & > span {
         opacity: 0;
-        transition: opacity calc(@menu-motion-duration - 0.1s) cubic-bezier(0,.4,.4,1);
+        transition: opacity calc(@menu-motion-duration - 0.1s) cubic-bezier(0, .4, .4, 1);
       }
     }
   }
@@ -54,76 +57,90 @@
 
   &-disabled {
     cursor: not-allowed;
-    color: @menu-color-disabled;
-  }
-
-  &-active {
-    .hover();
+    color: @menu-color-disabled !important;
+    background-color: @menu-color-background !important;
   }
 
   &-arrow {
     margin-left: auto;
     font-size: 16px;
+
     &-up {
       transform: rotate(180deg);
-      transition: transform calc(@menu-motion-duration - 0.1s) cubic-bezier(0,.4,.4,1);
+      transition: transform calc(@menu-motion-duration - 0.1s) cubic-bezier(0, .4, .4, 1);
     }
 
     &-down {
       transform: rotate(0deg);
-      transition: transform calc(@menu-motion-duration - 0.1s) cubic-bezier(0.4,0,0.6,1);
+      transition: transform calc(@menu-motion-duration - 0.1s) cubic-bezier(0.4, 0, 0.6, 1);
     }
   }
 }
 
+
 .hover {
   background-color: @menu-sub-color-background;
   color: @menu-sub-color-hover;
 }
 
-.light-hover {
-  background-color: @menu-light-color-background-hover;
-  color: @menu-light-color-hover;
-}
-
-.light-active {
-  background-color: @menu-light-color-background-active;
-  color: @menu-light-color-active;
-}
-
-.light-default {
-  color: @menu-light-color;
-  background: #ffffff;
+.active {
+  background-color: @menu-sub-color-background;
+  color: @menu-sub-color-hover;
 }
 
-.menuItemTitle() {
-  display: flex;
-  align-items: center;
-  height: 50px;
-  .ellipsis();
-  & > span {
-    .ellipsis();
-  }
+.active-inline-title {
+  color: @menu-sub-color-hover !important;
+  background: @menu-color-background !important;
+  border: none;
 }
 
 
 .light {
   .light-default();
 
-  .@{submenu-prefix-cls}-hover,
-  .@{submenu-prefix-cls}-sub {
-    .light-default();
+  .@{menuitem-prefix-cls}-disabled, .@{submenu-prefix-cls}-disabled {
+    background-color: #fff !important;
   }
 
-  .@{submenu-prefix-cls}-title:hover {
-    color: @menu-light-color-hover;
+  .@{submenu-prefix-cls}-sub {
+    color: @menu-light-color;
+    background: #FAFAFA;
   }
 
-  .@{submenu-prefix-cls}:not(.@{submenu-prefix-cls}-disabled):hover {
+  .@{menuitem-prefix-cls}:hover {
     .light-hover();
   }
 
-  .@{menuitem-prefix-cls}:not(.@{menuitem-prefix-cls}-disabled):hover {
+  .@{menuitem-prefix-cls}-hover, .@{submenu-prefix-cls}-hover {
     .light-hover();
   }
+
+  .@{menuitem-prefix-cls}-active, .@{submenu-prefix-cls}-active {
+    .light-active();
+  }
+}
+
+.light-default {
+  color: @menu-light-color;
+  background: #ffffff;
+}
+
+.light-hover {
+  background-color: @menu-light-color-background-hover;
+  color: @menu-light-color-hover;
+  border: none;
 }
+
+.light-active {
+  background-color: @menu-light-color-background-active !important;
+  color: @menu-light-color-active !important;
+  border: none;
+}
+
+.light-active-inline-title {
+  color: @menu-light-color-active !important;
+  background: #ffffff !important;
+  border: none;
+}
+
+

package/lib/menu/subMenu.js

@@ -74,6 +74,7 @@ var SubMenu = function SubMenu(props) {
       collapsed = _a.collapsed,
       keyValue = _a.keyValue,
       selectedKey = _a.selectedKey,
+      selectedKeyPath = _a.selectedKeyPath,
       openKeys = _a.openKeys,
       triggerSubMenuAction = _a.triggerSubMenuAction,
       forceSubMenuRender = _a.forceSubMenuRender,
@@ -83,7 +84,7 @@ var SubMenu = function SubMenu(props) {
       handleOnOpenChange = _a.handleOnOpenChange,
       _a$paddingLeft = _a.paddingLeft,
       paddingLeft = _a$paddingLeft === void 0 ? 0 : _a$paddingLeft,
-      restProps = __rest(_a, ["prefixCls", "theme", "mode", "title", "icon", "disabled", "children", "collapsed", "keyValue", "selectedKey", "openKeys", "triggerSubMenuAction", "forceSubMenuRender", "inlineIndent", "className", "style", "handleOnOpenChange", "paddingLeft"]);
+      restProps = __rest(_a, ["prefixCls", "theme", "mode", "title", "icon", "disabled", "children", "collapsed", "keyValue", "selectedKey", "selectedKeyPath", "openKeys", "triggerSubMenuAction", "forceSubMenuRender", "inlineIndent", "className", "style", "handleOnOpenChange", "paddingLeft"]);
 
   var isVertical = mode === 'vertical'; // 初始化level
 
@@ -317,7 +318,7 @@ var SubMenu = function SubMenu(props) {
   }; // eslint-disable-next-line react-hooks/rules-of-hooks
 
   var verticalView = (0, _usePopper.default)( /*#__PURE__*/_react.default.createElement("li", (0, _extends2.default)({
-    className: (0, _classnames.default)(prefixCls, className, (_classNames2 = {}, (0, _defineProperty2.default)(_classNames2, "light", theme === 'light'), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-collapsed"), collapsed), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-disabled"), disabled), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-hover"), !disabled && visible), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-active"), Array.isArray(openKeys) && (0, _includes.default)(openKeys).call(openKeys, keyValue)), _classNames2)),
+    className: (0, _classnames.default)(prefixCls, className, (_classNames2 = {}, (0, _defineProperty2.default)(_classNames2, "light", theme === 'light'), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-collapsed"), collapsed), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-disabled"), disabled), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-hover"), !disabled && Array.isArray(openKeys) && (0, _includes.default)(openKeys).call(openKeys, keyValue)), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-active"), Array.isArray(selectedKeyPath) && (0, _includes.default)(selectedKeyPath).call(selectedKeyPath, keyValue)), _classNames2)),
     ref: subMenuVerticalRef,
     key: keyValue
   }, {
@@ -361,7 +362,7 @@ var SubMenu = function SubMenu(props) {
     arrow: false,
     placement: 'rightTop',
     gap: 0,
-    visible: isVertical ? visible : false,
+    visible: isVertical && !disabled ? visible : false,
     disabled: isVertical ? undefined : true,
     prefixCls: 'kd-menu-popper',
     popperClassName: theme === 'light' ? 'light' : ''
@@ -374,7 +375,7 @@ var SubMenu = function SubMenu(props) {
 
     return /*#__PURE__*/_react.default.createElement("li", (0, _extends2.default)({
       ref: subMenuRef,
-      className: (0, _classnames.default)(prefixCls, className, (_classNames4 = {}, (0, _defineProperty2.default)(_classNames4, "".concat(prefixCls, "-collapsed"), collapsed), (0, _defineProperty2.default)(_classNames4, "".concat(prefixCls, "-disabled"), disabled), _classNames4)),
+      className: (0, _classnames.default)(prefixCls, className, (_classNames4 = {}, (0, _defineProperty2.default)(_classNames4, "".concat(prefixCls, "-collapsed"), collapsed), (0, _defineProperty2.default)(_classNames4, "".concat(prefixCls, "-disabled"), disabled), (0, _defineProperty2.default)(_classNames4, "".concat(prefixCls, "-active"), Array.isArray(selectedKeyPath) && (0, _includes.default)(selectedKeyPath).call(selectedKeyPath, keyValue)), _classNames4)),
       key: keyValue
     }, mouseEvent, {
       style: style

package/lib/radio/radio.js

@@ -113,6 +113,8 @@ var InternalRadio = function InternalRadio(props, ref) {
   var classString = (0, _classnames.default)((_classNames = {}, (0, _defineProperty2.default)(_classNames, "".concat(radioPrefixCls), true), (0, _defineProperty2.default)(_classNames, "".concat(radioPrefixCls, "-disabled"), radioProps.disabled), (0, _defineProperty2.default)(_classNames, "".concat(radioPrefixCls, "-checked"), context ? radioProps.checked : isChecked), _classNames), className); // 单选包裹元素class名称
 
   (0, _react.useEffect)(function () {
+    var _a;
+
     var handleRepeatClick = function handleRepeatClick(e) {
       var element = e.target;
 
@@ -122,10 +124,12 @@ var InternalRadio = function InternalRadio(props, ref) {
     };
 
     var radioRef = mergedRef;
-    radioRef.current.addEventListener('click', handleRepeatClick);
+    (_a = radioRef === null || radioRef === void 0 ? void 0 : radioRef.current) === null || _a === void 0 ? void 0 : _a.addEventListener('click', handleRepeatClick);
     return function () {
-      // eslint-disable-next-line react-hooks/exhaustive-deps
-      radioRef.current.removeEventListener('click', handleRepeatClick);
+      var _a; // eslint-disable-next-line react-hooks/exhaustive-deps
+
+
+      (_a = radioRef === null || radioRef === void 0 ? void 0 : radioRef.current) === null || _a === void 0 ? void 0 : _a.removeEventListener('click', handleRepeatClick);
     };
   }, []);
   return (

package/lib/select/select.js

@@ -91,7 +91,9 @@ var InternalSelect = function InternalSelect(props, ref) {
       placeholder = selectProps.placeholder,
       dropdownStyle = selectProps.dropdownStyle,
       style = selectProps.style,
-      clearIcon = selectProps.clearIcon;
+      clearIcon = selectProps.clearIcon,
+      _selectProps$popperSt = selectProps.popperStyle,
+      popperStyle = _selectProps$popperSt === void 0 ? {} : _selectProps$popperSt;
   var isMultiple = mode === 'multiple'; // 是否多选
 
   var _useMergedState = (0, _hooks.useMergedState)(undefined, {
@@ -153,7 +155,7 @@ var InternalSelect = function InternalSelect(props, ref) {
 
   var searchCls = (0, _classnames.default)((0, _defineProperty2.default)({}, "".concat(selectPrefixCls, "-dropdown-search"), true)); // 下拉子项列表样式
 
-  var dropContentCls = (0, _classnames.default)((0, _defineProperty2.default)({}, "".concat(selectPrefixCls, "-dropdown-scroll"), isMultiple ? (realChildren === null || realChildren === void 0 ? void 0 : realChildren.length) > 8 : (realChildren === null || realChildren === void 0 ? void 0 : realChildren.length) > 10)); // 多选底部样式
+  var dropContentCls = (0, _classnames.default)((0, _defineProperty2.default)({}, "".concat(selectPrefixCls, "-dropdown-scroll"), (isMultiple ? (realChildren === null || realChildren === void 0 ? void 0 : realChildren.length) > 8 : (realChildren === null || realChildren === void 0 ? void 0 : realChildren.length) > 10) || selectProps.dropdownRender)); // 多选底部样式
 
   var multipleFooterCls = (0, _classnames.default)((0, _defineProperty2.default)({}, "".concat(selectPrefixCls, "-multiple-footer"), true)); // 多选，单选公共样式
 
@@ -695,10 +697,10 @@ var InternalSelect = function InternalSelect(props, ref) {
       var _ref2 = (_a = selectRef.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect(),
           width = _ref2.width;
 
-      return {
+      return (0, _extends2.default)({
         width: (dropdownStyle === null || dropdownStyle === void 0 ? void 0 : dropdownStyle.width) || (width > 75 ? width : 75),
         zIndex: 1050
-      };
+      }, popperStyle);
     }
   };
 

package/lib/switch/style/index.css

@@ -185,7 +185,7 @@
 .kd-switch-size-small {
   height: var(--kd-c-switch-small-sizing-height, 16px);
   min-width: var(--kd-c-switch-small-sizing-width, 32px);
-  line-height: var(--kd-c-switch-small-line-height, 14px);
+  line-height: var(--kd-c-switch-small-line-height, 16px);
   font-size: var(--kd-c-switch-small-font-size, var(--kd-g-font-size-small, 12px));
   border-radius: var(--kd-c-switch-small-radius-border, 8px);
 }

package/lib/switch/style/token.less

@@ -17,7 +17,7 @@
 
 // line-height
 @switch-large-line-height: var(~'@{switch-prefix}-large-line-height', 20px);
-@switch-small-line-height: var(~'@{switch-prefix}-small-line-height', 14px);
+@switch-small-line-height: var(~'@{switch-prefix}-small-line-height', 16px);
 
 //radius
 @switch-small-border-radius: var(~'@{switch-prefix}-small-radius-border', 8px);

package/lib/table/table.js

@@ -106,6 +106,8 @@ function Table(props) {
   });
 
   if (footerDataSource) {
+    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+    // @ts-ignore
     pipeline.footerDataSource(footerDataSource);
   }
   /* -------------------------------------------------------------------------- */

package/lib/tree/style/index.css

@@ -140,7 +140,6 @@
   pointer-events: none;
 }
 .kd-tree-node-item {
-  height: var(--kd-c-tree-node-sizing-height, 32px);
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
@@ -167,7 +166,7 @@
   border-right: 10px;
   border-color: white;
   border-style: solid;
-  height: var(--kd-c-tree-node-sizing-height, 32px);
+  height: 100%;
   cursor: default;
   opacity: 0;
 }

package/lib/tree/style/index.less

@@ -33,7 +33,6 @@
     pointer-events: none;
   }
   &-item {
-    height: @tree-node-height;
     display: flex;
     align-items: center;
   }
@@ -54,7 +53,7 @@
     border-right: 10px;
     border-color: white;
     border-style: solid;
-    height: @tree-node-height;
+    height: 100%;
     cursor: default;
     opacity: 0;
   }

package/lib/tree/style/token.less

@@ -13,7 +13,6 @@
 @tree-node-icon-color-text: var(~'@{tree-prefix}-node-icon-color-text', #666666);
 
 // sizing
-@tree-node-height: var(~'@{tree-prefix}-node-sizing-height', 32px);
 @tree-expand-icon-height: var(~'@{tree-prefix}-expand-icon-sizing-height', 22px);
 @tree-expand-icon-width: var(~'@{tree-prefix}-expand-icon-sizing-width', 22px);
 @tree-node-icon-height: var(~'@{tree-prefix}-node-icon-sizing-height', 20px);

package/lib/tree/tree.js

@@ -89,8 +89,7 @@ var InternalTree = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
       setTreeNodeClassName = _TreeProps$setTreeNod2 === void 0 ? function () {
     return '';
   } : _TreeProps$setTreeNod2,
-      _TreeProps$estimatedI = TreeProps.estimatedItemSize,
-      innerEstimatedItemSize = _TreeProps$estimatedI === void 0 ? 28 : _TreeProps$estimatedI,
+      innerEstimatedItemSize = TreeProps.estimatedItemSize,
       style = TreeProps.style;
   var treePrefixCls = getPrefixCls(prefixCls, 'tree', customPrefixcls); // 树样式前缀
 

package/lib/tree/treeNode.js

@@ -363,7 +363,7 @@ var TreeNode = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   return /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _classnames.default)("".concat(treeNodePrefixCls, "-item"), (0, _defineProperty2.default)({}, "".concat(treeNodePrefixCls, "-item-hover"), !disabled && selectable), (0, _defineProperty2.default)({}, "".concat(treeNodePrefixCls, "-selected"), selected && selectable && !disabled), (0, _defineProperty2.default)({}, "".concat(treeNodePrefixCls, "-disabled"), disabled), (0, _defineProperty2.default)({}, "".concat(treeNodePrefixCls, "-opened"), expandState), (0, _concat.default)(_context = "".concat(treeNodePrefixCls, "-item-")).call(_context, nodeKey), className),
     style: (0, _extends2.default)({
-      height: "".concat(estimatedItemSize)
+      height: "".concat(estimatedItemSize, "px")
     }, style),
     onClick: handleClick
   }, renderNode());

package/package.json

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