bkui-vue 2.0.2-beta.31 → 2.0.2-beta.33

package/lib/cascader/cascader.css

@@ -163,12 +163,12 @@
   position: absolute;
   right: 2px;
   display: inline-flex;
+  align-items: center;
   height: 100%;
   font-size: 20px;
   color: #979ba5;
-  transform: rotate(180deg);
   transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
-  align-items: center;
+  transform: rotate(180deg);
 }
 .bk-cascader .bk-icon-clear-icon {
   right: 4px;
@@ -186,8 +186,8 @@
   position: static;
   display: block;
   max-width: 100%;
-  max-height: 120px;
   min-height: 30px;
+  max-height: 120px;
   padding: 0 24px 0 11px;
   overflow-x: hidden;
   text-overflow: ellipsis;
@@ -211,18 +211,18 @@
   white-space: nowrap;
 }
 .bk-cascader .bk-cascader-name .cascader-tag-list {
+  box-sizing: border-box;
   display: flex;
+  flex-wrap: wrap;
   height: 32px;
   min-height: 30px;
   padding-top: 5px;
   overflow: hidden;
-  box-sizing: border-box;
-  flex-wrap: wrap;
 }
 .bk-cascader .bk-cascader-name .cascader-tag-list .tag-item {
   position: relative;
-  height: 22px;
   max-width: calc(100% - 50px);
+  height: 22px;
   padding-right: 18px;
   margin: 0 6px 5px 0;
   overflow: hidden;
@@ -242,49 +242,51 @@
   text-overflow: ellipsis;
   white-space: nowrap;
 }
-.bk-cascader-panel-wrapper {
-  display: inline-flex;
+.bk-cascader-popover {
   border: 1px solid #dcdee5;
   border-radius: 2px;
   box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.1);
 }
-.bk-cascader-panel-wrapper .bk-cascader-panel {
+.bk-cascader-popover .bk-cascader-panel-wrapper {
+  display: inline-flex;
+}
+.bk-cascader-popover .bk-cascader-panel-wrapper .bk-cascader-panel {
   min-width: 160px;
   padding: 4px 0;
   background: white;
   border-right: 1px solid #dcdee5;
 }
-.bk-cascader-panel-wrapper .bk-cascader-panel:last-child {
+.bk-cascader-popover .bk-cascader-panel-wrapper .bk-cascader-panel:last-child {
   border-right: none;
 }
-.bk-cascader-panel-wrapper .bk-cascader-panel .bk-cascader-node {
+.bk-cascader-popover .bk-cascader-panel-wrapper .bk-cascader-panel .bk-cascader-node {
   position: relative;
   display: flex;
+  align-items: center;
   padding: 0 16px;
   overflow: hidden;
   line-height: 32px;
   text-overflow: ellipsis;
   white-space: nowrap;
   cursor: pointer;
-  align-items: center;
 }
-.bk-cascader-panel-wrapper .bk-cascader-panel .bk-cascader-node:hover {
+.bk-cascader-popover .bk-cascader-panel-wrapper .bk-cascader-panel .bk-cascader-node:hover {
   background: #f5f7fa;
 }
-.bk-cascader-panel-wrapper .bk-cascader-panel .bk-cascader-node.is-selected,
-.bk-cascader-panel-wrapper .bk-cascader-panel .bk-cascader-node.is-checked {
+.bk-cascader-popover .bk-cascader-panel-wrapper .bk-cascader-panel .bk-cascader-node.is-selected,
+.bk-cascader-popover .bk-cascader-panel-wrapper .bk-cascader-panel .bk-cascader-node.is-checked {
   color: #3a84ff;
   background: #e1ecff;
 }
-.bk-cascader-panel-wrapper .bk-cascader-panel .bk-cascader-node.is-disabled {
+.bk-cascader-popover .bk-cascader-panel-wrapper .bk-cascader-panel .bk-cascader-node.is-disabled {
   color: #c4c6cc;
   cursor: not-allowed;
   background-color: white;
 }
-.bk-cascader-panel-wrapper .bk-cascader-panel .bk-cascader-node.is-disabled .bk-icon-angle-right {
+.bk-cascader-popover .bk-cascader-panel-wrapper .bk-cascader-panel .bk-cascader-node.is-disabled .bk-icon-angle-right {
   color: #c4c6cc;
 }
-.bk-cascader-panel-wrapper .bk-cascader-panel .bk-cascader-node .bk-icon-angle-right {
+.bk-cascader-popover .bk-cascader-panel-wrapper .bk-cascader-panel .bk-cascader-node .bk-icon-angle-right {
   position: absolute;
   top: 50%;
   right: 0;
@@ -292,7 +294,7 @@
   color: #979ba5;
   transform: translateY(-50%);
 }
-.bk-cascader-panel-wrapper .bk-cascader-panel .bk-cascader-node .bk-icon-spinner {
+.bk-cascader-popover .bk-cascader-panel-wrapper .bk-cascader-panel .bk-cascader-node .bk-icon-spinner {
   position: absolute;
   top: 50%;
   right: 5px;
@@ -300,14 +302,14 @@
   color: #979ba5;
   transform: translateY(-50%);
 }
-.bk-cascader-panel-wrapper .bk-cascader-panel-empty-wrapper {
+.bk-cascader-popover .bk-cascader-panel-wrapper .bk-cascader-panel-empty-wrapper {
   display: flex;
-  height: 100%;
-  color: #63656e;
   align-items: center;
   justify-content: center;
+  height: 100%;
+  color: #63656e;
 }
-.bk-cascader-panel-wrapper .bk-cascader-search-empty {
+.bk-cascader-popover .bk-cascader-panel-wrapper .bk-cascader-search-empty {
   display: flex;
   align-items: center;
   justify-content: center;
@@ -315,6 +317,6 @@
   color: #63656e;
 }
 .bk-cascader-popover-reference {
-  width: 100%;
   display: block !important;
+  width: 100%;
 }

package/lib/cascader/cascader.less

@@ -110,12 +110,12 @@
     position: absolute;
     right: 2px;
     display: inline-flex;
+    align-items: center;
     height: 100%;
     font-size: 20px;
     color: #979ba5;
-    transform: rotate(180deg);
     transition: transform .3s cubic-bezier(.4,0,.2,1);
-    align-items: center;
+    transform: rotate(180deg);
   }
 
   .@{bk-prefix}-icon-clear-icon {
@@ -135,8 +135,8 @@
     position: static;
     display: block;
     max-width: 100%;
-    max-height: 120px;
     min-height: 30px;
+    max-height: 120px;
     padding: 0 24px 0 11px;
     overflow-x: hidden;
     text-overflow: ellipsis;
@@ -163,18 +163,18 @@
     }
 
     .cascader-tag-list {
+      box-sizing: border-box;
       display: flex;
+      flex-wrap: wrap;
       height: @component-size-base;
       min-height: 30px;
       padding-top: 5px;
       overflow: hidden;
-      box-sizing: border-box;
-      flex-wrap: wrap;
 
       .tag-item {
         position: relative;
-        height: 22px;
         max-width: calc(100% - 50px);
+        height: 22px;
         padding-right: 18px;
         margin: 0 6px 5px 0;
         overflow: hidden;
@@ -200,87 +200,89 @@
   }
 }
 
-.@{bk-prefix}-cascader-panel-wrapper {
-  display: inline-flex;
+.@{bk-prefix}-cascader-popover{
   border: 1px solid @cascader-panel-border-color;
   border-radius: 2px;
   box-shadow: 0px 2px 6px 0px rgba(0,0,0,.10);
-  .@{bk-prefix}-cascader-panel {
-    min-width: 160px;
-    padding: 4px 0;
-    background: @white-color;
-    border-right: 1px solid @cascader-panel-border-color;
-
-    &:last-child {
-      border-right: none;
-    }
-    .@{bk-prefix}-cascader-node {
-      position: relative;
-      display: flex;
-      padding: 0 16px;
-      overflow: hidden;
-      line-height: @component-size-base;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-      cursor: pointer;
-      align-items: center;
-
-      &:hover {
-        background: @cascader-panel-hover;
-      }
-
-      &.is-selected,
-      &.is-checked {
-        color: @primary-color;
-        background: @cascader-panel-active;
+  .@{bk-prefix}-cascader-panel-wrapper {
+    display: inline-flex;
+    .@{bk-prefix}-cascader-panel {
+      min-width: 160px;
+      padding: 4px 0;
+      background: @white-color;
+      border-right: 1px solid @cascader-panel-border-color;
+  
+      &:last-child {
+        border-right: none;
       }
-
-      &.is-disabled {
-        color: @light-gray;
-        cursor: not-allowed;
-        background-color: @white-color;
-
-        .@{bk-prefix}-icon-angle-right {
+      .@{bk-prefix}-cascader-node {
+        position: relative;
+        display: flex;
+        align-items: center;
+        padding: 0 16px;
+        overflow: hidden;
+        line-height: @component-size-base;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+        cursor: pointer;
+  
+        &:hover {
+          background: @cascader-panel-hover;
+        }
+  
+        &.is-selected,
+        &.is-checked {
+          color: @primary-color;
+          background: @cascader-panel-active;
+        }
+  
+        &.is-disabled {
           color: @light-gray;
+          cursor: not-allowed;
+          background-color: @white-color;
+  
+          .@{bk-prefix}-icon-angle-right {
+            color: @light-gray;
+          }
+        }
+  
+        .@{bk-prefix}-icon-angle-right {
+          position: absolute;
+          top: 50%;
+          right: 0;
+          font-size: 20px;
+          color: @gray-color;
+          transform: translateY(-50%);
+        }
+  
+        .@{bk-prefix}-icon-spinner {
+          position: absolute;
+          top: 50%;
+          right: 5px;
+          font-size: 12px;
+          color: @gray-color;
+          transform: translateY(-50%);
         }
-      }
-
-      .@{bk-prefix}-icon-angle-right {
-        position: absolute;
-        top: 50%;
-        right: 0;
-        font-size: 20px;
-        color: @gray-color;
-        transform: translateY(-50%);
-      }
-
-      .@{bk-prefix}-icon-spinner {
-        position: absolute;
-        top: 50%;
-        right: 5px;
-        font-size: 12px;
-        color: @gray-color;
-        transform: translateY(-50%);
       }
     }
-  }
-  .@{bk-prefix}-cascader-panel-empty-wrapper {
-    display: flex;
-    height: 100%;
-    color: #63656e;
-    align-items: center;
-    justify-content: center;
-  }
-  .@{bk-prefix}-cascader-search-empty {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    height: 56px;
-    color: #63656e
+    .@{bk-prefix}-cascader-panel-empty-wrapper {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      height: 100%;
+      color: #63656e;
+    }
+    .@{bk-prefix}-cascader-search-empty {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      height: 56px;
+      color: #63656e
+    }
   }
 }
 
 .@{bk-prefix}-cascader-popover-reference{
-  width: 100%;
   display: block !important;
+  width: 100%;
 }

package/lib/cascader/cascader.variable.css

@@ -293,12 +293,12 @@
   position: absolute;
   right: 2px;
   display: inline-flex;
+  align-items: center;
   height: 100%;
   font-size: 20px;
   color: #979ba5;
-  transform: rotate(180deg);
   transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
-  align-items: center;
+  transform: rotate(180deg);
 }
 .bk-cascader .bk-icon-clear-icon {
   right: 4px;
@@ -316,8 +316,8 @@
   position: static;
   display: block;
   max-width: 100%;
-  max-height: 120px;
   min-height: 30px;
+  max-height: 120px;
   padding: 0 24px 0 11px;
   overflow-x: hidden;
   text-overflow: ellipsis;
@@ -341,18 +341,18 @@
   white-space: nowrap;
 }
 .bk-cascader .bk-cascader-name .cascader-tag-list {
+  box-sizing: border-box;
   display: flex;
+  flex-wrap: wrap;
   height: 32px;
   min-height: 30px;
   padding-top: 5px;
   overflow: hidden;
-  box-sizing: border-box;
-  flex-wrap: wrap;
 }
 .bk-cascader .bk-cascader-name .cascader-tag-list .tag-item {
   position: relative;
-  height: 22px;
   max-width: calc(100% - 50px);
+  height: 22px;
   padding-right: 18px;
   margin: 0 6px 5px 0;
   overflow: hidden;
@@ -372,49 +372,51 @@
   text-overflow: ellipsis;
   white-space: nowrap;
 }
-.bk-cascader-panel-wrapper {
-  display: inline-flex;
+.bk-cascader-popover {
   border: 1px solid #dcdee5;
   border-radius: 2px;
   box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.1);
 }
-.bk-cascader-panel-wrapper .bk-cascader-panel {
+.bk-cascader-popover .bk-cascader-panel-wrapper {
+  display: inline-flex;
+}
+.bk-cascader-popover .bk-cascader-panel-wrapper .bk-cascader-panel {
   min-width: 160px;
   padding: 4px 0;
   background: white;
   border-right: 1px solid #dcdee5;
 }
-.bk-cascader-panel-wrapper .bk-cascader-panel:last-child {
+.bk-cascader-popover .bk-cascader-panel-wrapper .bk-cascader-panel:last-child {
   border-right: none;
 }
-.bk-cascader-panel-wrapper .bk-cascader-panel .bk-cascader-node {
+.bk-cascader-popover .bk-cascader-panel-wrapper .bk-cascader-panel .bk-cascader-node {
   position: relative;
   display: flex;
+  align-items: center;
   padding: 0 16px;
   overflow: hidden;
   line-height: 32px;
   text-overflow: ellipsis;
   white-space: nowrap;
   cursor: pointer;
-  align-items: center;
 }
-.bk-cascader-panel-wrapper .bk-cascader-panel .bk-cascader-node:hover {
+.bk-cascader-popover .bk-cascader-panel-wrapper .bk-cascader-panel .bk-cascader-node:hover {
   background: #f5f7fa;
 }
-.bk-cascader-panel-wrapper .bk-cascader-panel .bk-cascader-node.is-selected,
-.bk-cascader-panel-wrapper .bk-cascader-panel .bk-cascader-node.is-checked {
+.bk-cascader-popover .bk-cascader-panel-wrapper .bk-cascader-panel .bk-cascader-node.is-selected,
+.bk-cascader-popover .bk-cascader-panel-wrapper .bk-cascader-panel .bk-cascader-node.is-checked {
   color: #3a84ff;
   background: #e1ecff;
 }
-.bk-cascader-panel-wrapper .bk-cascader-panel .bk-cascader-node.is-disabled {
+.bk-cascader-popover .bk-cascader-panel-wrapper .bk-cascader-panel .bk-cascader-node.is-disabled {
   color: #c4c6cc;
   cursor: not-allowed;
   background-color: white;
 }
-.bk-cascader-panel-wrapper .bk-cascader-panel .bk-cascader-node.is-disabled .bk-icon-angle-right {
+.bk-cascader-popover .bk-cascader-panel-wrapper .bk-cascader-panel .bk-cascader-node.is-disabled .bk-icon-angle-right {
   color: #c4c6cc;
 }
-.bk-cascader-panel-wrapper .bk-cascader-panel .bk-cascader-node .bk-icon-angle-right {
+.bk-cascader-popover .bk-cascader-panel-wrapper .bk-cascader-panel .bk-cascader-node .bk-icon-angle-right {
   position: absolute;
   top: 50%;
   right: 0;
@@ -422,7 +424,7 @@
   color: #979ba5;
   transform: translateY(-50%);
 }
-.bk-cascader-panel-wrapper .bk-cascader-panel .bk-cascader-node .bk-icon-spinner {
+.bk-cascader-popover .bk-cascader-panel-wrapper .bk-cascader-panel .bk-cascader-node .bk-icon-spinner {
   position: absolute;
   top: 50%;
   right: 5px;
@@ -430,14 +432,14 @@
   color: #979ba5;
   transform: translateY(-50%);
 }
-.bk-cascader-panel-wrapper .bk-cascader-panel-empty-wrapper {
+.bk-cascader-popover .bk-cascader-panel-wrapper .bk-cascader-panel-empty-wrapper {
   display: flex;
-  height: 100%;
-  color: #63656e;
   align-items: center;
   justify-content: center;
+  height: 100%;
+  color: #63656e;
 }
-.bk-cascader-panel-wrapper .bk-cascader-search-empty {
+.bk-cascader-popover .bk-cascader-panel-wrapper .bk-cascader-search-empty {
   display: flex;
   align-items: center;
   justify-content: center;
@@ -445,6 +447,6 @@
   color: #63656e;
 }
 .bk-cascader-popover-reference {
-  width: 100%;
   display: block !important;
+  width: 100%;
 }

package/lib/cascader/index.js

@@ -2819,6 +2819,7 @@ var Store = /*#__PURE__*/function () {
           }, null) : textRender()]);
         },
         content: function content() {
+          var _this$$slots$extensio, _this$$slots;
           return (0,external_vue_.createVNode)("div", {
             "class": _this.resolveClassName('cascader-popover')
           }, [(0,external_vue_.createVNode)(cascader_panel, {
@@ -2840,7 +2841,7 @@ var Store = /*#__PURE__*/function () {
                 "class": _this.resolveClassName('cascader-node-name')
               }, [scope.node.name]);
             }
-          })]);
+          }), (_this$$slots$extensio = (_this$$slots = _this.$slots).extension) === null || _this$$slots$extensio === void 0 ? void 0 : _this$$slots$extensio.call(_this$$slots)]);
         }
       });
     };

package/lib/dropdown/dropdown.d.ts

@@ -36,6 +36,7 @@ declare const _default: import("vue").DefineComponent<{
         default: string;
     };
 }, {
+    isPopoverShow: import("vue").Ref<boolean>;
     afterShow: () => void;
     afterHidden: () => void;
     popoverRef: import("vue").Ref<any>;

package/lib/dropdown/index.d.ts

@@ -37,6 +37,7 @@ declare const BkDropdown: {
         onHide?: (...args: any[]) => any;
         onShowChange?: (...args: any[]) => any;
     }, {
+        isPopoverShow: import("vue").Ref<boolean>;
         afterShow: () => void;
         afterHidden: () => void;
         popoverRef: import("vue").Ref<any>;
@@ -128,6 +129,7 @@ declare const BkDropdown: {
         onHide?: (...args: any[]) => any;
         onShowChange?: (...args: any[]) => any;
     }, {
+        isPopoverShow: import("vue").Ref<boolean>;
         afterShow: () => void;
         afterHidden: () => void;
         popoverRef: import("vue").Ref<any>;
@@ -181,6 +183,7 @@ declare const BkDropdown: {
     onHide?: (...args: any[]) => any;
     onShowChange?: (...args: any[]) => any;
 }, {
+    isPopoverShow: import("vue").Ref<boolean>;
     afterShow: () => void;
     afterHidden: () => void;
     popoverRef: import("vue").Ref<any>;

package/lib/dropdown/index.js

@@ -90,7 +90,7 @@ function _defineProperty(obj, key, value) {
 ;// CONCATENATED MODULE: external "vue"
 var external_vue_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
 var external_vue_y = x => () => x
-const external_vue_namespaceObject = external_vue_x({ ["computed"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.computed, ["createTextVNode"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.createTextVNode, ["createVNode"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.createVNode, ["defineComponent"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.defineComponent, ["mergeProps"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.mergeProps, ["ref"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.ref });
+const external_vue_namespaceObject = external_vue_x({ ["computed"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.computed, ["createVNode"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.createVNode, ["defineComponent"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.defineComponent, ["mergeProps"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.mergeProps, ["ref"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.ref });
 ;// CONCATENATED MODULE: external "../config-provider"
 var config_provider_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
 var config_provider_y = x => () => x
@@ -160,8 +160,13 @@ const merge_namespaceObject = merge_x({ ["default"]: () => __WEBPACK_EXTERNAL_MO
   emits: ['showChange', 'show', 'hide'],
   setup: function setup(_props, _ref) {
     var emit = _ref.emit;
+    var popoverRef = (0,external_vue_namespaceObject.ref)(null);
+    var isPopoverShow = (0,external_vue_namespaceObject.ref)(false);
+    var _usePrefix = (0,config_provider_namespaceObject.usePrefix)(),
+      resolveClassName = _usePrefix.resolveClassName;
     /** 弹层显示值变更 */
     var handleShowChagne = function handleShowChagne(val) {
+      isPopoverShow.value = val;
       emit('showChange', val);
     };
     /** 显示后回调 */
@@ -174,10 +179,8 @@ const merge_namespaceObject = merge_x({ ["default"]: () => __WEBPACK_EXTERNAL_MO
       emit('hide');
       handleShowChagne(false);
     };
-    var popoverRef = (0,external_vue_namespaceObject.ref)(null);
-    var _usePrefix = (0,config_provider_namespaceObject.usePrefix)(),
-      resolveClassName = _usePrefix.resolveClassName;
     return {
+      isPopoverShow: isPopoverShow,
       afterShow: afterShow,
       afterHidden: afterHidden,
       popoverRef: popoverRef,
@@ -209,13 +212,15 @@ const merge_namespaceObject = merge_x({ ["default"]: () => __WEBPACK_EXTERNAL_MO
         var _this$$slots$default, _this$$slots;
         return (0,external_vue_namespaceObject.createVNode)("div", {
           "class": ["".concat(_this.resolveClassName('dropdown-reference')), _this.disabled ? 'disabled' : '']
-        }, [' ', (_this$$slots$default = (_this$$slots = _this.$slots)["default"]) === null || _this$$slots$default === void 0 ? void 0 : _this$$slots$default.call(_this$$slots), ' ']);
+        }, [(_this$$slots$default = (_this$$slots = _this.$slots)["default"]) === null || _this$$slots$default === void 0 ? void 0 : _this$$slots$default.call(_this$$slots, {
+          popoverShow: _this.isPopoverShow
+        })]);
       },
       content: function content() {
         var _this$$slots$content, _this$$slots2;
         return (0,external_vue_namespaceObject.createVNode)("div", {
           "class": "".concat(_this.resolveClassName('dropdown-content'))
-        }, [(0,external_vue_namespaceObject.createTextVNode)(" "), (_this$$slots$content = (_this$$slots2 = _this.$slots).content) === null || _this$$slots$content === void 0 ? void 0 : _this$$slots$content.call(_this$$slots2), (0,external_vue_namespaceObject.createTextVNode)(" ")]);
+        }, [(_this$$slots$content = (_this$$slots2 = _this.$slots).content) === null || _this$$slots$content === void 0 ? void 0 : _this$$slots$content.call(_this$$slots2)]);
       }
     })]);
   }

package/lib/form/form-item.d.ts

@@ -1,5 +1,6 @@
 import type { ComputedRef, ExtractPropTypes } from 'vue';
 declare const formItemProps: {
+    itemType: import("vue-types").VueTypeDef<string>;
     label: import("vue-types").VueTypeValidableDef<string> & {
         default: string;
     };
@@ -46,6 +47,7 @@ declare const formItemProps: {
 };
 export type FormItemProps = Readonly<ExtractPropTypes<typeof formItemProps>>;
 declare const _default: import("vue").DefineComponent<{
+    itemType: import("vue-types").VueTypeDef<string>;
     label: import("vue-types").VueTypeValidableDef<string> & {
         default: string;
     };
@@ -106,6 +108,7 @@ declare const _default: import("vue").DefineComponent<{
     isError: import("vue").Ref<boolean>;
     errorMessage: import("vue").Ref<string>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
+    itemType: import("vue-types").VueTypeDef<string>;
     label: import("vue-types").VueTypeValidableDef<string> & {
         default: string;
     };

package/lib/form/form.css

@@ -19,12 +19,23 @@
   line-height: 20px;
   text-align: left;
 }
-.bk-form--vertical .bk-form-content {
-  text-align: left;
-}
 .bk-form-item {
   margin-bottom: 24px;
 }
+.bk-form-item--vertical .bk-form-label {
+  float: unset;
+  width: auto;
+  padding-right: 0;
+  margin-bottom: 6px;
+  line-height: 20px;
+  text-align: left;
+}
+.bk-form-item--default .bk-form-label {
+  float: left;
+  padding-right: 22px;
+  line-height: 32px;
+  text-align: right;
+}
 .bk-form-item.is-required .bk-form-label:after {
   position: absolute;
   top: 0;
@@ -51,6 +62,7 @@
 }
 .bk-form-label {
   position: relative;
+  box-sizing: border-box;
   float: left;
   padding-right: 22px;
   font-size: 14px;
@@ -59,7 +71,6 @@
   color: #63656e;
   text-align: right;
   vertical-align: middle;
-  box-sizing: border-box;
 }
 .bk-form-label-description {
   cursor: pointer;
@@ -71,6 +82,7 @@
 .bk-form-content {
   position: relative;
   line-height: 32px;
+  text-align: left;
 }
 .bk-form-error {
   position: absolute;