@kdcloudjs/kdesign 1.3.8 → 1.4.1

package/CHANGELOG.md

@@ -1,3 +1,22 @@
+## [1.3.9](https://github.com/kdcloudone/kdesign/compare/v1.3.7...v1.3.9) (2022-07-14)
+
+
+### Bug Fixes
+
+* [anchor] 锚点组件类名调整 ([af0619e](https://github.com/kdcloudone/kdesign/commit/af0619e8b7fb7565ea4f96774433d63684ff331d))
+* [anchor] 锚点组件取消监听事件调整 ([07740e1](https://github.com/kdcloudone/kdesign/commit/07740e1ca7d2d7198392300d641799109e9fcb8a))
+* [docs] 更正cra跳转链接 ([70c1bf3](https://github.com/kdcloudone/kdesign/commit/70c1bf38f441a5e36ec60e30f71d3fb4af4b7b53))
+* [form]onChange及disabled值处理 ([17cf20b](https://github.com/kdcloudone/kdesign/commit/17cf20be64730e0d929aee48fcd624d9e978b743))
+* [menu]菜单切换问题处理 ([3781a69](https://github.com/kdcloudone/kdesign/commit/3781a6967543f795d7a8c3e32d9830a9b4821f9b))
+* [menu]修改高亮样式 ([624cc02](https://github.com/kdcloudone/kdesign/commit/624cc0231ed044c0bc2caafdfb24291b2681132b))
+* [menu]样式修改 ([ee386ea](https://github.com/kdcloudone/kdesign/commit/ee386eaa41cf4e16fc1099e4246b704a6d4f4652))
+* [select] 在启用listHeight属性的时候，拓展内容未固定 ([3684321](https://github.com/kdcloudone/kdesign/commit/36843215765b711ccf8269646f673aab2ebf9c3b))
+* [select] select下拉面板需要z-index设置 ([eb0e46d](https://github.com/kdcloudone/kdesign/commit/eb0e46dffbf6af8a5ff0dd603af4e52d45843e8d))
+* [switch] 解决开关文字垂直没对齐问题 ([df90939](https://github.com/kdcloudone/kdesign/commit/df90939f3d158cd8a1b9524e69741b10939b63df))
+* [tree] 解决api estimatedItemSize设置树节点高度不生效问题 ([fe62d29](https://github.com/kdcloudone/kdesign/commit/fe62d290f7a5c9e3c7f31c8b47d764ae0d485105))
+
+
+
 ## [1.3.7](https://github.com/kdcloudone/kdesign/compare/v1.3.6...v1.3.7) (2022-06-30)
 
 

package/dist/kdesign-complete.less

@@ -5713,6 +5713,8 @@ textarea {
 @menuitem-prefix-cls: ~'@{menu-prefix-cls}-item';
 @menu-dark-prefix-cls: ~'@{menu-prefix-cls}-dark';
 @menu-light-prefix-cls: ~'@{menu-prefix-cls}-light';
+@menu-vertical-prefix-cls: ~'@{menu-prefix-cls}-vertical';
+@menu-inline-prefix-cls: ~'@{menu-prefix-cls}-inline';
 @menu-popper-prefix-cls: ~'@{menu-prefix-cls}-popper';
 @submenu-prefix-cls: ~'@{menu-prefix-cls}-submenu';
 
@@ -5722,56 +5724,17 @@ textarea {
   &-inline {
     .@{menuitem-prefix-cls} {
       .ellipsis();
-
-      &-active {
-        color: @menu-inline-color-active;
-      }
     }
 
     .@{submenu-prefix-cls} {
       padding-right: 0;
     }
-
-    .@{submenu-prefix-cls}:not(.@{submenu-prefix-cls}-disabled):hover {
-      color: @menu-inline-color-active;
-    }
   }
 
   &-collapsed {
     width: 50px;
     min-width: auto;
   }
-
-  &-vertical {
-    .@{submenu-prefix-cls}:not(.@{submenu-prefix-cls}-disabled):hover,
-    .@{submenu-prefix-cls}-hover {
-      .hover();
-    }
-  }
-
-  &-light {
-    .light()
-  }
-
-  &-light&-vertical {
-    .@{submenu-prefix-cls}-sub {
-      box-shadow: 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0, 0.08),
-      0 9px 28px 8px rgba(0, 0, 0, 0.05);
-    }
-
-    .@{menuitem-prefix-cls} {
-      &:not(.@{menuitem-prefix-cls}-disabled):not(.@{menuitem-prefix-cls}-active):hover {
-        .light-hover();
-        border: none;
-      }
-
-      &-active {
-        color: @menu-light-color-active;
-        background-color: @menu-light-color-background-active;
-        border: none !important;
-      }
-    }
-  }
 }
 
 .@{menuitem-prefix-cls} {
@@ -5780,10 +5743,6 @@ textarea {
   transition: color, background-color;
   transition-duration: calc(@menu-motion-duration - 0.1s);
   transition-timing-function: cubic-bezier(0.4, 0, 0.6, 1);
-
-  &:not(&-disabled):hover {
-    .hover();
-  }
 }
 
 .@{submenu-prefix-cls} {
@@ -5793,13 +5752,8 @@ textarea {
   transition-duration: calc(@menu-motion-duration - 0.1s);
   transition-timing-function: cubic-bezier(0.4, 0, 0.6, 1);
 
-  &-hover {
-    .hover();
-  }
-
   &-sub {
     line-height: @menu-item-height;
-    color: @menu-sub-color;
   }
 
   &-thrid {
@@ -5875,26 +5829,68 @@ textarea {
   }
 }
 
+// dark
 .@{menu-dark-prefix-cls} {
+
   .@{submenu-prefix-cls}-sub {
+    color: @menu-sub-color;
     background: @menu-sub-inline-color-background;
   }
 
   .@{submenu-prefix-cls}-sub-second, .@{submenu-prefix-cls}-sub-third {
     background: @menu-sub-color-background;
   }
+
+  .@{menuitem-prefix-cls} {
+    &:not(.@{menuitem-prefix-cls}-disabled):not(.@{menuitem-prefix-cls}-active):hover {
+      .menu-dark-hover();
+    }
+
+    &-active {
+      .menu-dark-active()
+    }
+  }
+
+  .@{menuitem-prefix-cls}-active, .@{submenu-prefix-cls}-active {
+    .menu-dark-active()
+  }
+
+  .@{menuitem-prefix-cls}-hover, .@{submenu-prefix-cls}-hover {
+    .menu-dark-hover()
+  }
 }
 
+.@{menu-inline-prefix-cls}.@{menu-dark-prefix-cls} {
+  .@{menuitem-prefix-cls}-active, .@{submenu-prefix-cls}-active {
+    .@{submenu-prefix-cls}-title {
+      .menu-dark-active-inline-title()
+    }
+  }
+
+  .@{submenu-prefix-cls}:not(.@{submenu-prefix-cls}-disabled):not(.@{submenu-prefix-cls}-active) {
+    > .@{submenu-prefix-cls}-title:hover {
+      .menu-dark-active-inline-title()
+    }
+  }
+}
+
+// light
 .@{menu-light-prefix-cls} {
-  .@{submenu-prefix-cls}-active,.@{menuitem-prefix-cls}-active {
-    .light-active()
+  .menu-light-base();
+}
+
+.@{menu-inline-prefix-cls}.@{menu-light-prefix-cls} {
+  .@{menuitem-prefix-cls}-active, .@{submenu-prefix-cls}-active {
+    .@{submenu-prefix-cls}-title {
+      .menu-light-active-inline-title()
+    }
   }
 }
 
 .@{menu-popper-prefix-cls} {
-  .@{submenu-prefix-cls}:not(.@{submenu-prefix-cls}-disabled):hover,
+  .@{submenu-prefix-cls}:not(.@{submenu-prefix-cls}-disabled):not(.@{submenu-prefix-cls}-active):hover,
   .@{submenu-prefix-cls}-hover {
-    .hover();
+    .menu-dark-hover();
   }
 
   &.hidden {
@@ -5911,12 +5907,15 @@ textarea {
     padding-right: 0;
 
     &-sub {
+      color: @menu-sub-color;
       background: @menu-sub-inline-color-background;
+      box-shadow: 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0, 0.08),
+      0 9px 28px 8px rgba(0, 0, 0, 0.05);
 
       .@{menuitem-prefix-cls} {
-        &:hover,
+        &:not(.@{menuitem-prefix-cls}-disabled):not(.@{menuitem-prefix-cls}-active):hover,
         &-active {
-          color: @menu-sub-color-active;
+          .menu-dark-hover()
         }
       }
 
@@ -5942,28 +5941,7 @@ textarea {
   }
 
   &.light {
-    .light();
-
-    .@{submenu-prefix-cls}-sub {
-      box-shadow: 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0, 0.08),
-      0 9px 28px 8px rgba(0, 0, 0, 0.05);
-    }
-
-    .@{menuitem-prefix-cls}:not(.@{menuitem-prefix-cls}-disabled):not(.@{menuitem-prefix-cls}-active):hover,
-    .@{submenu-prefix-cls}:not(.@{submenu-prefix-cls}-disabled):hover {
-      .light-hover();
-      border: none;
-    }
-
-    .@{menuitem-prefix-cls}-hover,.@{submenu-prefix-cls}-hover {
-      .light-hover();
-      border: none;
-    }
-
-    .@{menuitem-prefix-cls}-active,.@{submenu-prefix-cls}-active {
-      .light-active();
-      border: none;
-    }
+    .menu-light-base();
   }
 }
 
@@ -5997,12 +5975,16 @@ textarea {
   cursor: pointer;
 
   &-title {
-    .menuItemTitle();
-  }
+    display: flex;
+    align-items: center;
+    height: 50px;
+    .ellipsis();
 
-  &-title > span {
-    opacity: 1;
-    transition: opacity calc(@menu-motion-duration - 0.1s) cubic-bezier(0,.4,.4,1);
+    & > span {
+      .ellipsis();
+      opacity: 1;
+      transition: opacity calc(@menu-motion-duration - 0.1s) cubic-bezier(0, .4, .4, 1);
+    }
   }
 
   &-collapsed {
@@ -6019,7 +6001,7 @@ textarea {
 
       & > 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);
       }
     }
   }
@@ -6032,79 +6014,92 @@ textarea {
   &-disabled {
     cursor: not-allowed;
     color: @menu-color-disabled;
-  }
-
-  &-active {
-    .hover();
+    background-color: @menu-color-background;
   }
 
   &-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 {
+
+.menu-dark-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;
+.menu-dark-active {
+  background-color: @menu-sub-color-background;
+  color: @menu-sub-color-hover;
 }
 
-.light-active {
-  background-color: @menu-light-color-background-active;
-  color: @menu-light-color-active;
+.menu-dark-active-inline-title {
+  color: @menu-sub-color-hover;
+  background: @menu-color-background;
+  border: none;
 }
 
-.light-default {
-  color: @menu-light-color;
-  background: #ffffff;
-}
+.menu-light-base {
+  .menu-light-default();
 
-.menuItemTitle() {
-  display: flex;
-  align-items: center;
-  height: 50px;
-  .ellipsis();
-  & > span {
-    .ellipsis();
+  .@{menuitem-prefix-cls}-disabled, .@{submenu-prefix-cls}-disabled {
+    background-color: #fff;
   }
-}
-
-
-.light {
-  .light-default();
 
-  .@{submenu-prefix-cls}-hover,
   .@{submenu-prefix-cls}-sub {
-    .light-default();
+    color: @menu-light-color;
+    background: #fafafa;
   }
 
-  .@{submenu-prefix-cls}-title:hover {
-    color: @menu-light-color-hover;
+  .@{menuitem-prefix-cls}:not(.@{menuitem-prefix-cls}-disabled):not(.@{menuitem-prefix-cls}-active):hover {
+    .menu-light-hover();
   }
 
-  .@{submenu-prefix-cls}:not(.@{submenu-prefix-cls}-disabled):hover {
-    .light-hover();
+  .@{menuitem-prefix-cls}-hover, .@{submenu-prefix-cls}-hover {
+    .menu-light-hover();
   }
 
-  .@{menuitem-prefix-cls}:not(.@{menuitem-prefix-cls}-disabled):hover {
-    .light-hover();
+  .@{menuitem-prefix-cls}-active, .@{submenu-prefix-cls}-active {
+    .menu-light-active();
   }
 }
 
+.menu-light-default {
+  color: @menu-light-color;
+  background: #ffffff;
+}
+
+.menu-light-hover {
+  background-color: @menu-light-color-background-hover;
+  color: @menu-light-color-hover;
+  border: none;
+}
+
+.menu-light-active {
+  background-color: @menu-light-color-background-active;
+  color: @menu-light-color-active;
+  border: none;
+}
+
+.menu-light-active-inline-title {
+  color: @menu-light-color-active;
+  background: #ffffff;
+  border: none;
+}
+
+
+
 
 
 @menu-prefix: '--@{kd-prefix}-c-menu';
@@ -13507,7 +13502,6 @@ template {
     pointer-events: none;
   }
   &-item {
-    height: @tree-node-height;
     display: flex;
     align-items: center;
   }
@@ -13528,7 +13522,7 @@ template {
     border-right: 10px;
     border-color: white;
     border-style: solid;
-    height: @tree-node-height;
+    height: 100%;
     cursor: default;
     opacity: 0;
   }
@@ -13625,7 +13619,6 @@ template {
 @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);