bkui-vue 2.0.2-beta.41 → 2.0.2-beta.43

package/lib/affix/affix.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-affix {
   position: fixed;

package/lib/alert/alert.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-alert {
   position: relative;

package/lib/backtop/backtop.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 @keyframes loading-scale-animate {
   0% {

package/lib/badge/badge.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-badge-main {
   position: relative;

package/lib/breadcrumb/breadcrumb.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 @keyframes loading-scale-animate {
   0% {

package/lib/button/button.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-button {
   display: inline-flex;

package/lib/card/card.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 @keyframes loading-scale-animate {
   0% {

package/lib/cascader/cascader.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 @keyframes loading-scale-animate {
   0% {

package/lib/checkbox/checkbox.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-checkbox-group {
   display: inline-flex;

package/lib/code-diff/code-diff.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 /* stylelint-disable declaration-no-important */
 .bk-code-diff {

package/lib/collapse/collapse.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-collapse-item {
   display: flex;

package/lib/collapse-transition/collapse-transition.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-collapse-transitioncollapse-transition {
   transition: 0.3s height ease-in-out, 0.3s padding-top ease-in-out, 0.3s padding-bottom ease-in-out;

package/lib/color-picker/color-picker.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-color-picker {
   position: relative;

package/lib/config-provider/config-provider.variable.css

@@ -127,4 +127,5 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }

package/lib/container/container.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 @keyframes loading-scale-animate {
   0% {

package/lib/date-picker/date-picker.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-time-picker-header {
   height: 46px;

package/lib/dialog/dialog.css

@@ -6,6 +6,16 @@
   left: 50%;
   transform: translate(-50%, -50%);
 }
+.bk-infobox .bk-modal-wrapper .bk-modal-body {
+  min-height: 176px;
+}
+.bk-infobox .bk-modal-wrapper .bk-modal-body .bk-modal-content {
+  color: #63656e;
+  font-size: 14px;
+}
+.bk-infobox.no-content-infobox .bk-modal-content {
+  display: none;
+}
 .bk-infobox-header {
   padding-top: 24px;
 }
@@ -40,10 +50,19 @@
   color: #313238;
 }
 .bk-infobox-content {
-  padding-right: 24px;
   padding-left: 24px;
+  padding-right: 24px;
   margin-top: 16px;
 }
+.bk-infobox-content.set-bg-color {
+  background-color: #f5f6fa;
+  margin-left: 32px;
+  margin-right: 32px;
+  padding-top: 12px;
+  padding-bottom: 12px;
+  padding-left: 16px;
+  padding-right: 16px;
+}
 .bk-infobox-footer {
   display: flex;
   padding-right: 24px;

package/lib/dialog/dialog.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-infobox {
   font-size: 12px;
@@ -136,6 +137,16 @@
   left: 50%;
   transform: translate(-50%, -50%);
 }
+.bk-infobox .bk-modal-wrapper .bk-modal-body {
+  min-height: 176px;
+}
+.bk-infobox .bk-modal-wrapper .bk-modal-body .bk-modal-content {
+  color: #63656e;
+  font-size: 14px;
+}
+.bk-infobox.no-content-infobox .bk-modal-content {
+  display: none;
+}
 .bk-infobox-header {
   padding-top: 24px;
 }
@@ -170,10 +181,19 @@
   color: #313238;
 }
 .bk-infobox-content {
-  padding-right: 24px;
   padding-left: 24px;
+  padding-right: 24px;
   margin-top: 16px;
 }
+.bk-infobox-content.set-bg-color {
+  background-color: #f5f6fa;
+  margin-left: 32px;
+  margin-right: 32px;
+  padding-top: 12px;
+  padding-bottom: 12px;
+  padding-left: 16px;
+  padding-right: 16px;
+}
 .bk-infobox-footer {
   display: flex;
   padding-right: 24px;

package/lib/divider/divider.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-divider {
   position: relative;

package/lib/dropdown/dropdown.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-popover.bk-pop2-content {
   position: absolute;

package/lib/exception/exception.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-exception {
   position: relative;

package/lib/fixed-navbar/fixed-navbar.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-fixed-navbar {
   position: fixed;

package/lib/form/form.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 @keyframes form-error-appear-animation {
   from {

package/lib/image/image-viewer.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-image-viewer-wrapper {
   position: fixed;

package/lib/image/image.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-image-viewer-wrapper {
   position: fixed;

package/lib/index.js

@@ -3,5 +3,5 @@ export * from './hooks';
 export { default } from './preset';
 export * from './config-provider';
 export * from './directives';
-export const version = "2.0.2-beta.41";
+export const version = "2.0.2-beta.43";
 window.__bkui_vue_version__ = version;

package/lib/info-box/index.js

@@ -593,6 +593,7 @@ var genDefaultState = function genDefaultState() {
     headerAlign: 'center',
     contentAlign: 'center',
     footerAlign: 'center',
+    showContentBgColor: false,
     showMask: true,
     quickClose: false,
     escClose: false,
@@ -772,9 +773,20 @@ var genDefaultState = function genDefaultState() {
           }
         })]);
       };
+      var renderWidth = function renderWidth() {
+        // 如果有辅助文案类型和有引用内容类型默认宽480px
+        if (!!renderContent() && [400].includes(state.width)) {
+          return 480;
+        }
+        return state.width;
+      };
       return (0,external_vue_namespaceObject.createVNode)(modal_namespaceObject["default"], {
-        "width": state.width,
-        "class": [resolveClassName('infobox'), state["class"]],
+        "width": renderWidth(),
+        "class": [_defineProperty({}, resolveClassName('infobox'), true),
+        // 处理无提示内容modal-content还会占位高度
+        {
+          'no-content-infobox': !state.content
+        }, state["class"]],
         "animateType": "fadein",
         "closeIcon": state.closeIcon,
         "isShow": isShow.value,
@@ -796,7 +808,7 @@ var genDefaultState = function genDefaultState() {
             "style": {
               textAlign: state.contentAlign
             },
-            "class": resolveClassName('infobox-content')
+            "class": _defineProperty(_defineProperty({}, resolveClassName('infobox-content'), true), "set-bg-color", state.showContentBgColor)
           }, [renderContent()]);
         },
         footer: function footer() {
@@ -806,7 +818,10 @@ var genDefaultState = function genDefaultState() {
         },
         close: function close() {
           return (0,external_vue_namespaceObject.createVNode)(icon_namespaceObject.Error, {
-            "onClick": handleCancel
+            "onClick": function onClick() {
+              // 使用 void 明确忽略返回值
+              void handleCancel();
+            }
           }, null);
         }
       });

package/lib/info-box/info-box.css

@@ -6,6 +6,16 @@
   left: 50%;
   transform: translate(-50%, -50%);
 }
+.bk-infobox .bk-modal-wrapper .bk-modal-body {
+  min-height: 176px;
+}
+.bk-infobox .bk-modal-wrapper .bk-modal-body .bk-modal-content {
+  color: #63656e;
+  font-size: 14px;
+}
+.bk-infobox.no-content-infobox .bk-modal-content {
+  display: none;
+}
 .bk-infobox-header {
   padding-top: 24px;
 }
@@ -40,10 +50,19 @@
   color: #313238;
 }
 .bk-infobox-content {
-  padding-right: 24px;
   padding-left: 24px;
+  padding-right: 24px;
   margin-top: 16px;
 }
+.bk-infobox-content.set-bg-color {
+  background-color: #f5f6fa;
+  margin-left: 32px;
+  margin-right: 32px;
+  padding-top: 12px;
+  padding-bottom: 12px;
+  padding-left: 16px;
+  padding-right: 16px;
+}
 .bk-infobox-footer {
   display: flex;
   padding-right: 24px;

package/lib/info-box/info-box.d.ts

@@ -13,6 +13,7 @@ export interface Props {
     headerAlign?: 'center' | 'left' | 'right';
     footerAlign?: 'center' | 'left' | 'right';
     contentAlign?: 'center' | 'left' | 'right';
+    showContentBgColor?: boolean;
     showMask?: boolean;
     quickClose?: boolean;
     escClose?: boolean;

package/lib/info-box/info-box.less

@@ -1,12 +1,28 @@
 @import '../styles/themes/themes.less';
 
 .@{bk-prefix}-infobox {
-  font-size: 12px;
+  font-size: @font-size-base;
 
   .@{bk-prefix}-modal-wrapper {
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
+
+    .@{bk-prefix}-modal-body {
+      min-height: 176px;
+
+      .@{bk-prefix}-modal-content { 
+        color: @default-color;
+        font-size: @font-size-medium;
+      }
+    }
+
+  }
+
+  &.no-content-infobox {
+    .@{bk-prefix}-modal-content {
+      display: none;
+    }
   }
 }
 
@@ -52,9 +68,19 @@
 }
 
 .@{bk-prefix}-infobox-content {
-  padding-right: 24px;
   padding-left: 24px;
+  padding-right: 24px;
   margin-top: 16px;
+
+  &.set-bg-color {
+    background-color: @sub-title-bg-color;
+    margin-left: 32px;
+    margin-right: 32px;
+    padding-top: 12px;
+    padding-bottom: 12px;
+    padding-left: 16px;
+    padding-right: 16px;
+  }
 }
 
 .@{bk-prefix}-infobox-footer {

package/lib/info-box/info-box.variable.css

@@ -127,15 +127,26 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-infobox {
-  font-size: 12px;
+  font-size: var(--font-size-base);
 }
 .bk-infobox .bk-modal-wrapper {
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
 }
+.bk-infobox .bk-modal-wrapper .bk-modal-body {
+  min-height: 176px;
+}
+.bk-infobox .bk-modal-wrapper .bk-modal-body .bk-modal-content {
+  color: var(--default-color);
+  font-size: var(--font-size-medium);
+}
+.bk-infobox.no-content-infobox .bk-modal-content {
+  display: none;
+}
 .bk-infobox-header {
   padding-top: 24px;
 }
@@ -170,10 +181,19 @@
   color: #313238;
 }
 .bk-infobox-content {
-  padding-right: 24px;
   padding-left: 24px;
+  padding-right: 24px;
   margin-top: 16px;
 }
+.bk-infobox-content.set-bg-color {
+  background-color: var(--sub-title-bg-color);
+  margin-left: 32px;
+  margin-right: 32px;
+  padding-top: 12px;
+  padding-bottom: 12px;
+  padding-left: 16px;
+  padding-right: 16px;
+}
 .bk-infobox-footer {
   display: flex;
   padding-right: 24px;

package/lib/input/input.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 @keyframes loading-scale-animate {
   0% {

package/lib/link/link.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-link {
   font-size: var(--font-size-medium);

package/lib/loading/loading.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 @keyframes loading-scale-animate {
   0% {

package/lib/menu/menu.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 @keyframes loading-scale-animate {
   0% {

package/lib/menu/submenu.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-menu {
   display: block;

package/lib/message/message.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-message {
   position: fixed;

package/lib/modal/modal.css

@@ -6,6 +6,16 @@
   left: 50%;
   transform: translate(-50%, -50%);
 }
+.bk-infobox .bk-modal-wrapper .bk-modal-body {
+  min-height: 176px;
+}
+.bk-infobox .bk-modal-wrapper .bk-modal-body .bk-modal-content {
+  color: #63656e;
+  font-size: 14px;
+}
+.bk-infobox.no-content-infobox .bk-modal-content {
+  display: none;
+}
 .bk-infobox-header {
   padding-top: 24px;
 }
@@ -40,10 +50,19 @@
   color: #313238;
 }
 .bk-infobox-content {
-  padding-right: 24px;
   padding-left: 24px;
+  padding-right: 24px;
   margin-top: 16px;
 }
+.bk-infobox-content.set-bg-color {
+  background-color: #f5f6fa;
+  margin-left: 32px;
+  margin-right: 32px;
+  padding-top: 12px;
+  padding-bottom: 12px;
+  padding-left: 16px;
+  padding-right: 16px;
+}
 .bk-infobox-footer {
   display: flex;
   padding-right: 24px;

package/lib/modal/modal.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-infobox {
   font-size: 12px;
@@ -136,6 +137,16 @@
   left: 50%;
   transform: translate(-50%, -50%);
 }
+.bk-infobox .bk-modal-wrapper .bk-modal-body {
+  min-height: 176px;
+}
+.bk-infobox .bk-modal-wrapper .bk-modal-body .bk-modal-content {
+  color: #63656e;
+  font-size: 14px;
+}
+.bk-infobox.no-content-infobox .bk-modal-content {
+  display: none;
+}
 .bk-infobox-header {
   padding-top: 24px;
 }
@@ -170,10 +181,19 @@
   color: #313238;
 }
 .bk-infobox-content {
-  padding-right: 24px;
   padding-left: 24px;
+  padding-right: 24px;
   margin-top: 16px;
 }
+.bk-infobox-content.set-bg-color {
+  background-color: #f5f6fa;
+  margin-left: 32px;
+  margin-right: 32px;
+  padding-top: 12px;
+  padding-bottom: 12px;
+  padding-left: 16px;
+  padding-right: 16px;
+}
 .bk-infobox-footer {
   display: flex;
   padding-right: 24px;

package/lib/navigation/navigation.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-navigation {
   display: flex;

package/lib/notify/notify.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-notify {
   position: fixed;

package/lib/pagination/pagination.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-pagination {
   display: flex;

package/lib/pop-confirm/pop-confirm.variable.css

@@ -127,6 +127,7 @@
   --search-select-menu-border-color: var(--disable-color);
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
+  --sub-title-bg-color: #f5f6fa;
 }
 .bk-popover.bk-pop-confirm-box {
   padding: 16px;