bkui-vue 2.0.1-beta.72.fix.1 → 2.0.1-beta.74

package/lib/tab/tab.css

@@ -156,6 +156,21 @@
 .bk-tab--right .bk-tab-header {
   flex-direction: column;
 }
+.bk-tab--left .bk-tab-header .bk-tab-header-item .bk-tab-header--has-num,
+.bk-tab--right .bk-tab-header .bk-tab-header-item .bk-tab-header--has-num {
+  width: 100%;
+}
+.bk-tab--left .bk-tab-header .bk-tab-header-item .bk-tab-header--has-num-right .bk-tab-header--has-num-square,
+.bk-tab--right .bk-tab-header .bk-tab-header-item .bk-tab-header--has-num-right .bk-tab-header--has-num-square {
+  border-radius: 2px;
+}
+.bk-tab--left .bk-tab-header .bk-tab-header--active .bk-tab-header--has-num-right .bk-tab-header--has-num-square,
+.bk-tab--right .bk-tab-header .bk-tab-header--active .bk-tab-header--has-num-right .bk-tab-header--has-num-square,
+.bk-tab--left .bk-tab-header .bk-tab-header--active .bk-tab-header--has-num-right .bk-tab-header--has-num-elliptic,
+.bk-tab--right .bk-tab-header .bk-tab-header--active .bk-tab-header--has-num-right .bk-tab-header--has-num-elliptic {
+  background-color: #A3C5FD;
+  color: var(--white-color);
+}
 .bk-tab--left .bk-tab-header > div,
 .bk-tab--right .bk-tab-header > div {
   flex-direction: column;
@@ -167,6 +182,18 @@
 .bk-tab--card-tab .bk-tab-header {
   border-radius: 4px 4px 0;
 }
+.bk-tab--card-tab .bk-tab-header .bk-tab-header-item .bk-tab-header--has-num-right .bk-tab-header--has-num-square {
+  background-color: var(--white-color);
+}
+.bk-tab--card-tab .bk-tab-header .bk-tab-header-item .bk-tab-header--has-num-right .bk-tab-header--has-num-elliptic {
+  background-color: var(--white-color);
+  color: var(--default-color);
+}
+.bk-tab--card-tab .bk-tab-header .bk-tab-header--active .bk-tab-header--has-num-right .bk-tab-header--has-num-square,
+.bk-tab--card-tab .bk-tab-header .bk-tab-header--active .bk-tab-header--has-num-right .bk-tab-header--has-num-elliptic {
+  background-color: #A3C5FD;
+  color: var(--white-color);
+}
 .bk-tab--card .bk-tab-header,
 .bk-tab--vertical-card .bk-tab-header {
   border-bottom: 1px solid var(--disable-color);
@@ -291,6 +318,35 @@
   padding-right: 12px;
   padding-left: 12px;
 }
+.bk-tab-header-item .bk-tab-header--has-num {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+.bk-tab-header-item .bk-tab-header--has-num-right {
+  margin-left: 4px;
+  display: flex;
+  align-items: center;
+  color: var(--default-color);
+}
+.bk-tab-header-item .bk-tab-header--has-num-right .bk-tab-header--has-num-default,
+.bk-tab-header-item .bk-tab-header--has-num-right .bk-tab-header--has-num-bracket {
+  color: var(--default-color);
+}
+.bk-tab-header-item .bk-tab-header--has-num-right .bk-tab-header--has-num-square,
+.bk-tab-header-item .bk-tab-header--has-num-right .bk-tab-header--has-num-elliptic {
+  background-color: #F0F1F5;
+  color: var(--gray-color);
+  padding: 0 8px;
+  line-height: 18px;
+  text-align: center;
+}
+.bk-tab-header-item .bk-tab-header--has-num-right .bk-tab-header--has-num-square {
+  border-radius: 2px;
+}
+.bk-tab-header-item .bk-tab-header--has-num-right .bk-tab-header--has-num-elliptic {
+  border-radius: 18px;
+}
 .bk-tab-header-item:hover {
   color: var(--primary-color);
 }
@@ -336,6 +392,14 @@
 .bk-tab--card-grid .bk-tab-header--active {
   background: #fff;
 }
+.bk-tab-header--active .bk-tab-header--has-num-right .bk-tab-header--has-num-bracket,
+.bk-tab-header--active .bk-tab-header--has-num-right .bk-tab-header--has-num-square,
+.bk-tab-header--active .bk-tab-header--has-num-right .bk-tab-header--has-num-elliptic {
+  color: var(--primary-color);
+}
+.bk-tab-header--active .bk-tab-header--has-num-right .bk-tab-header--has-num-square {
+  background-color: #E1ECFF;
+}
 .bk-tab-header--close {
   display: none;
   font-size: 16px;

package/lib/tab/tab.less

@@ -6,6 +6,9 @@
 @tab-header-bg: #FAFBFD;
 @tab-white: @white-color;
 @tab-gray: @light-gray;
+@tab-number-tag-gray: @gray-color;
+@tab-card-number-active: #E1ECFF;
+@tab-column-active: #A3C5FD;
 @tab-card-tab-bg: #F0F1F5;
 @tab-card-tab-divider: #c4c6cc;
 @tab-disable-color: #aaa;
@@ -42,7 +45,28 @@
 
     .@{bk-prefix}-tab--left &, .@{bk-prefix}-tab--right & {
       flex-direction: column;
-
+      .@{bk-prefix}-tab-header-item {
+        .@{bk-prefix}-tab-header--has-num {
+          width: 100%;
+          &-right {
+            .@{bk-prefix}-tab-header--has-num-square {
+              border-radius: 2px;
+            }
+          }
+        }
+      }
+      .@{bk-prefix}-tab-header--active {
+        .@{bk-prefix}-tab-header--has-num {
+          &-right {
+            .@{bk-prefix}-tab-header--has-num-square,
+            .@{bk-prefix}-tab-header--has-num-elliptic {
+              background-color: @tab-column-active;
+              color: @tab-white;
+            }
+          }
+        }
+      }
+      
       > div {
         flex-direction: column;
       }
@@ -54,6 +78,30 @@
 
     .@{bk-prefix}-tab--card-tab & {
       border-radius: 4px 4px 0;
+      .@{bk-prefix}-tab-header-item {
+        .@{bk-prefix}-tab-header--has-num {
+          &-right {
+            .@{bk-prefix}-tab-header--has-num-square {
+              background-color: @tab-white;
+            }
+            .@{bk-prefix}-tab-header--has-num-elliptic {
+              background-color: @tab-white;
+              color: @tab-color;
+            }
+          }
+        }
+      }
+      .@{bk-prefix}-tab-header--active {
+        .@{bk-prefix}-tab-header--has-num {
+          &-right {
+            .@{bk-prefix}-tab-header--has-num-square,
+            .@{bk-prefix}-tab-header--has-num-elliptic {
+              background-color: @tab-column-active;
+              color: @tab-white;
+            }
+          }
+        }
+      }
     }
 
     .@{bk-prefix}-tab--card &, .@{bk-prefix}-tab--vertical-card & {
@@ -208,7 +256,36 @@
         padding-left: 12px;
       }
 
-
+      .@{bk-prefix}-tab-header--has-num {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        &-right {
+          margin-left: 4px;
+          display: flex;
+          align-items: center;
+          color: @tab-color;
+          .@{bk-prefix}-tab-header--has-num-default,
+          .@{bk-prefix}-tab-header--has-num-bracket {
+            color: @tab-color;
+          }
+          .@{bk-prefix}-tab-header--has-num-square,
+          .@{bk-prefix}-tab-header--has-num-elliptic {
+            background-color: @tab-card-tab-bg;
+            color: @tab-number-tag-gray;
+            padding: 0 8px;
+            line-height: 18px;
+            text-align: center;
+          }
+          .@{bk-prefix}-tab-header--has-num-square {
+            border-radius: 2px;
+          }
+          .@{bk-prefix}-tab-header--has-num-elliptic {
+            border-radius: 18px;
+          }
+        }
+      }
+      
       &:hover {
         color: @tab-active;
 
@@ -218,7 +295,6 @@
           color: @danger-color;
         }
       }
-
     }
 
     &--active {
@@ -260,7 +336,18 @@
         border-left: 2px solid @tab-active;
       }
       */
-
+      .@{bk-prefix}-tab-header--has-num {
+        &-right {
+          .@{bk-prefix}-tab-header--has-num-bracket,
+          .@{bk-prefix}-tab-header--has-num-square,
+          .@{bk-prefix}-tab-header--has-num-elliptic {
+            color: @tab-active;
+          }
+          .@{bk-prefix}-tab-header--has-num-square {
+            background-color: @tab-card-number-active;
+          }
+        }
+      }
     }
 
     &--close {

package/lib/tab/tab.variable.css

@@ -416,6 +416,21 @@
 .bk-tab--right .bk-tab-header {
   flex-direction: column;
 }
+.bk-tab--left .bk-tab-header .bk-tab-header-item .bk-tab-header--has-num,
+.bk-tab--right .bk-tab-header .bk-tab-header-item .bk-tab-header--has-num {
+  width: 100%;
+}
+.bk-tab--left .bk-tab-header .bk-tab-header-item .bk-tab-header--has-num-right .bk-tab-header--has-num-square,
+.bk-tab--right .bk-tab-header .bk-tab-header-item .bk-tab-header--has-num-right .bk-tab-header--has-num-square {
+  border-radius: 2px;
+}
+.bk-tab--left .bk-tab-header .bk-tab-header--active .bk-tab-header--has-num-right .bk-tab-header--has-num-square,
+.bk-tab--right .bk-tab-header .bk-tab-header--active .bk-tab-header--has-num-right .bk-tab-header--has-num-square,
+.bk-tab--left .bk-tab-header .bk-tab-header--active .bk-tab-header--has-num-right .bk-tab-header--has-num-elliptic,
+.bk-tab--right .bk-tab-header .bk-tab-header--active .bk-tab-header--has-num-right .bk-tab-header--has-num-elliptic {
+  background-color: #A3C5FD;
+  color: var(--white-color);
+}
 .bk-tab--left .bk-tab-header > div,
 .bk-tab--right .bk-tab-header > div {
   flex-direction: column;
@@ -427,6 +442,18 @@
 .bk-tab--card-tab .bk-tab-header {
   border-radius: 4px 4px 0;
 }
+.bk-tab--card-tab .bk-tab-header .bk-tab-header-item .bk-tab-header--has-num-right .bk-tab-header--has-num-square {
+  background-color: var(--white-color);
+}
+.bk-tab--card-tab .bk-tab-header .bk-tab-header-item .bk-tab-header--has-num-right .bk-tab-header--has-num-elliptic {
+  background-color: var(--white-color);
+  color: var(--default-color);
+}
+.bk-tab--card-tab .bk-tab-header .bk-tab-header--active .bk-tab-header--has-num-right .bk-tab-header--has-num-square,
+.bk-tab--card-tab .bk-tab-header .bk-tab-header--active .bk-tab-header--has-num-right .bk-tab-header--has-num-elliptic {
+  background-color: #A3C5FD;
+  color: var(--white-color);
+}
 .bk-tab--card .bk-tab-header,
 .bk-tab--vertical-card .bk-tab-header {
   border-bottom: 1px solid var(--disable-color);
@@ -551,6 +578,35 @@
   padding-right: 12px;
   padding-left: 12px;
 }
+.bk-tab-header-item .bk-tab-header--has-num {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+.bk-tab-header-item .bk-tab-header--has-num-right {
+  margin-left: 4px;
+  display: flex;
+  align-items: center;
+  color: var(--default-color);
+}
+.bk-tab-header-item .bk-tab-header--has-num-right .bk-tab-header--has-num-default,
+.bk-tab-header-item .bk-tab-header--has-num-right .bk-tab-header--has-num-bracket {
+  color: var(--default-color);
+}
+.bk-tab-header-item .bk-tab-header--has-num-right .bk-tab-header--has-num-square,
+.bk-tab-header-item .bk-tab-header--has-num-right .bk-tab-header--has-num-elliptic {
+  background-color: #F0F1F5;
+  color: var(--gray-color);
+  padding: 0 8px;
+  line-height: 18px;
+  text-align: center;
+}
+.bk-tab-header-item .bk-tab-header--has-num-right .bk-tab-header--has-num-square {
+  border-radius: 2px;
+}
+.bk-tab-header-item .bk-tab-header--has-num-right .bk-tab-header--has-num-elliptic {
+  border-radius: 18px;
+}
 .bk-tab-header-item:hover {
   color: var(--primary-color);
 }
@@ -596,6 +652,14 @@
 .bk-tab--card-grid .bk-tab-header--active {
   background: #fff;
 }
+.bk-tab-header--active .bk-tab-header--has-num-right .bk-tab-header--has-num-bracket,
+.bk-tab-header--active .bk-tab-header--has-num-right .bk-tab-header--has-num-square,
+.bk-tab-header--active .bk-tab-header--has-num-right .bk-tab-header--has-num-elliptic {
+  color: var(--primary-color);
+}
+.bk-tab-header--active .bk-tab-header--has-num-right .bk-tab-header--has-num-square {
+  background-color: #E1ECFF;
+}
 .bk-tab-header--close {
   display: none;
   font-size: 16px;

package/lib/table/hooks/use-settings.d.ts

@@ -36,6 +36,7 @@ declare const useSettings: (props: TablePropTypes, ctx: SetupContext, columns: U
                     label: string;
                     text?: string;
                     value: string;
+                    tipKey?: string;
                 }[];
                 filterFn?: (...args: any[]) => boolean;
                 match?: import("../props").FullEnum;
@@ -89,6 +90,7 @@ declare const useSettings: (props: TablePropTypes, ctx: SetupContext, columns: U
                         label: string;
                         text?: string;
                         value: string;
+                        tipKey?: string;
                     }[];
                     filterFn?: (...args: any[]) => boolean;
                     match?: import("../props").FullEnum;

package/lib/table/index.js

@@ -17327,7 +17327,7 @@ function _objectDestructuringEmpty(obj) {
 ;// 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({ ["Fragment"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.Fragment, ["computed"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.computed, ["createTextVNode"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.createTextVNode, ["createVNode"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.createVNode, ["defineComponent"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.defineComponent, ["getCurrentInstance"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.getCurrentInstance, ["h"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.h, ["inject"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.inject, ["isProxy"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.isProxy, ["isRef"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.isRef, ["isVNode"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.isVNode, ["mergeProps"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.mergeProps, ["nextTick"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.nextTick, ["onBeforeUnmount"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.onBeforeUnmount, ["onMounted"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.onMounted, ["onUnmounted"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.onUnmounted, ["provide"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.provide, ["reactive"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.reactive, ["ref"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.ref, ["toRaw"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.toRaw, ["toRef"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.toRef, ["unref"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.unref, ["watch"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.watch });
+const external_vue_namespaceObject = external_vue_x({ ["Fragment"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.Fragment, ["computed"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.computed, ["createTextVNode"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.createTextVNode, ["createVNode"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.createVNode, ["defineComponent"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.defineComponent, ["getCurrentInstance"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.getCurrentInstance, ["h"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.h, ["inject"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.inject, ["isProxy"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.isProxy, ["isRef"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.isRef, ["isVNode"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.isVNode, ["mergeProps"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.mergeProps, ["nextTick"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.nextTick, ["onBeforeUnmount"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.onBeforeUnmount, ["onMounted"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.onMounted, ["onUnmounted"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.onUnmounted, ["provide"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.provide, ["reactive"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.reactive, ["ref"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.ref, ["resolveDirective"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.resolveDirective, ["toRaw"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.toRaw, ["toRef"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.toRef, ["unref"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.unref, ["watch"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.watch, ["withDirectives"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.withDirectives });
 ;// CONCATENATED MODULE: ../../node_modules/@babel/runtime/helpers/esm/typeof.js
 function typeof_typeof(o) {
   "@babel/helpers - typeof";
@@ -21762,7 +21762,7 @@ const exception_less_namespaceObject = exception_less_x({  });
 ;// CONCATENATED MODULE: external "../directives"
 var directives_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
 var directives_y = x => () => x
-const directives_namespaceObject = directives_x({ ["bkEllipsisInstance"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_directives_45d4776f__.bkEllipsisInstance });
+const directives_namespaceObject = directives_x({ ["bkEllipsisInstance"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_directives_45d4776f__.bkEllipsisInstance, ["bkTooltips"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_directives_45d4776f__.bkTooltips });
 ;// CONCATENATED MODULE: ../../packages/table/src/components/table-cell.tsx
 
 
@@ -22433,12 +22433,16 @@ const input_less_namespaceObject = input_less_x({  });
 
 
 
+
 function _isSlot(s) {
   return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !(0,external_vue_namespaceObject.isVNode)(s);
 }
 var ROW_HEIGHT = 32;
 /* harmony default export */ const head_filter = ((0,external_vue_namespaceObject.defineComponent)({
   name: 'HeadFilter',
+  directives: {
+    bkTooltips: directives_namespaceObject.bkTooltips
+  },
   props: {
     column: IColumnType,
     height: shared_namespaceObject.PropTypes.number.def(ROW_HEIGHT)
@@ -22459,6 +22463,8 @@ var ROW_HEIGHT = 32;
       return (_filter$value$checked = (_filter$value = filter.value) === null || _filter$value === void 0 ? void 0 : _filter$value.checked) !== null && _filter$value$checked !== void 0 ? _filter$value$checked : [];
     });
     var searchValue = (0,external_vue_namespaceObject.ref)('');
+    var filterPopoverRef = (0,external_vue_namespaceObject.ref)();
+    var allTextRef = (0,external_vue_namespaceObject.ref)([]);
     var state = (0,external_vue_namespaceObject.reactive)({
       isOpen: false,
       checked: []
@@ -22466,11 +22472,11 @@ var ROW_HEIGHT = 32;
     (_state$checked = state.checked).push.apply(_state$checked, _toConsumableArray(checked.value));
     (0,external_vue_namespaceObject.watch)(function () {
       return checked;
-    }, function () {
+    }, function (payload) {
       var _state$checked2;
       state.checked.length = 0;
       state.checked = [];
-      (_state$checked2 = state.checked).push.apply(_state$checked2, _toConsumableArray(checked.value));
+      (_state$checked2 = state.checked).push.apply(_state$checked2, _toConsumableArray(payload.value));
     }, {
       deep: true
     });
@@ -22555,6 +22561,42 @@ var ROW_HEIGHT = 32;
         text: text
       };
     };
+    var resolveOverflowTips = function resolveOverflowTips(payload) {
+      var _filterPopoverRef$val;
+      var labelRef = allTextRef.value["list-item-".concat(payload.value, "-ref")];
+      var checkBoxLabelRef = (_filterPopoverRef$val = filterPopoverRef.value) === null || _filterPopoverRef$val === void 0 ? void 0 : _filterPopoverRef$val.querySelector('.bk-checkbox-label');
+      if (labelRef && checkBoxLabelRef) {
+        var _filterPopoverRef$val2, _filterPopoverRef$val3;
+        var CHECKBOX_WIDTH = 16;
+        var labelStyles = renderDomStyles(labelRef);
+        var checkBoxLabel = renderDomStyles(checkBoxLabelRef);
+        var filterPopoverStyles = renderDomStyles(filterPopoverRef.value);
+        // 获取每个item项的margin、padding、 border
+        var allTipStyles = (labelRef === null || labelRef === void 0 ? void 0 : labelRef.offsetWidth) + (labelStyles === null || labelStyles === void 0 ? void 0 : labelStyles.borderSize) + (labelStyles === null || labelStyles === void 0 ? void 0 : labelStyles.marginSize) + (labelStyles === null || labelStyles === void 0 ? void 0 : labelStyles.paddingSize) + (filterPopoverStyles === null || filterPopoverStyles === void 0 ? void 0 : filterPopoverStyles.borderSize) + (filterPopoverStyles === null || filterPopoverStyles === void 0 ? void 0 : filterPopoverStyles.marginSize) + (filterPopoverStyles === null || filterPopoverStyles === void 0 ? void 0 : filterPopoverStyles.paddingSize) + (checkBoxLabel === null || checkBoxLabel === void 0 ? void 0 : checkBoxLabel.marginSize) + (checkBoxLabel === null || checkBoxLabel === void 0 ? void 0 : checkBoxLabel.paddingSize);
+        if ((labelRef === null || labelRef === void 0 ? void 0 : labelRef.offsetWidth) > ((_filterPopoverRef$val2 = filterPopoverRef.value) === null || _filterPopoverRef$val2 === void 0 ? void 0 : _filterPopoverRef$val2.offsetWidth) || CHECKBOX_WIDTH + allTipStyles > ((_filterPopoverRef$val3 = filterPopoverRef.value) === null || _filterPopoverRef$val3 === void 0 ? void 0 : _filterPopoverRef$val3.offsetWidth)) {
+          return false;
+        }
+      }
+      return true;
+    };
+    var renderDomStyles = function renderDomStyles(el) {
+      if (!el) {
+        return {
+          paddingSize: 0,
+          borderSize: 0,
+          marginSize: 0
+        };
+      }
+      var styles = getComputedStyle(el);
+      var paddingSize = Number.parseFloat(styles.getPropertyValue('padding-left')) + Number.parseFloat(styles.getPropertyValue('padding-right'));
+      var borderSize = Number.parseFloat(styles.getPropertyValue('border-left-width')) + Number.parseFloat(styles.getPropertyValue('border-right-width'));
+      var marginSize = Number.parseFloat(styles.getPropertyValue('margin-left')) + Number.parseFloat(styles.getPropertyValue('margin-right'));
+      return {
+        paddingSize: paddingSize,
+        borderSize: borderSize,
+        marginSize: marginSize
+      };
+    };
     var _filter$value4 = filter.value,
       btnSave = _filter$value4.btnSave,
       btnReset = _filter$value4.btnReset;
@@ -22606,13 +22648,15 @@ var ROW_HEIGHT = 32;
       }
       state.checked.length = 0;
       (_state$checked3 = state.checked).push.apply(_state$checked3, _toConsumableArray(Array.from(setValue)));
+      filter.value.checked = _toConsumableArray(state.checked);
       handleFilterChange();
     };
     var renderFilterList = function renderFilterList(scope) {
       if (scope.data.length) {
         return scope.data.map(function (item) {
-          return (0,external_vue_namespaceObject.createVNode)("div", {
+          return (0,external_vue_namespaceObject.withDirectives)((0,external_vue_namespaceObject.createVNode)("div", {
             "key": item.value,
+            "ref": filterPopoverRef,
             "class": "list-item"
           }, [(0,external_vue_namespaceObject.createVNode)(checkbox_namespaceObject["default"], {
             "checked": state.checked.includes(item.value),
@@ -22624,9 +22668,17 @@ var ROW_HEIGHT = 32;
             }
           }, {
             "default": function _default() {
-              return ["".concat(item.text)];
+              return [(0,external_vue_namespaceObject.createVNode)("span", {
+                "ref": function ref(el) {
+                  return allTextRef.value["list-item-".concat(item.value, "-ref")] = el;
+                }
+              }, ["".concat(item.text)])];
             }
-          })]);
+          })]), [[(0,external_vue_namespaceObject.resolveDirective)("bk-tooltips"), {
+            content: item.tipKey || item.text,
+            placement: 'right',
+            disabled: resolveOverflowTips(item)
+          }]]);
         });
       }
       return (0,external_vue_namespaceObject.createVNode)("div", {
@@ -23465,6 +23517,12 @@ function use_render_isSlot(s) {
    * @param rows
    */
   var handleRowClick = function handleRowClick(e, row, index, rows) {
+    var _e$target;
+    var tagName = (_e$target = e.target) === null || _e$target === void 0 ? void 0 : _e$target.tagName;
+    // span标签中嵌套了input标签产生冒泡，会先后都触发一次click事件, 所以会调用两遍
+    if (tagName === 'INPUT') {
+      return;
+    }
     ctx.emit(EMIT_EVENTS.ROW_CLICK, e, row, index, rows);
   };
   /**
@@ -24724,6 +24782,7 @@ var useSettings = function useSettings(props, ctx, columns, afterSetting) {
       toggleAllSelection: rows.toggleAllSelection,
       toggleRowSelection: rows.toggleRowSelection,
       getSelection: rows.getRowSelection,
+      setRowSelection: rows.setRowSelection,
       clearSort: columns.clearColumnSort,
       scrollTo: scrollTo,
       getRoot: function getRoot() {

package/lib/table/props.d.ts

@@ -71,6 +71,7 @@ export type IFilterShape = {
         label: string;
         text?: string;
         value: string;
+        tipKey?: string;
     }[];
     filterFn?: (...args: any[]) => boolean;
     match?: FullEnum;
@@ -123,12 +124,12 @@ export type Field = {
 export type LabelFunctionString = ((_column: any, _index: any) => JSX.Element | boolean | number | string) | boolean | number | string;
 export declare const LabelFunctionStringType: import("vue-types").VueTypeDef<LabelFunctionString>;
 export type HeadRenderArgs = {
-    cell?: Record<string, object>;
-    data?: Record<string, object>[];
-    row?: Record<string, object>;
+    cell?: any;
+    data?: any;
+    row?: Record<string, any>;
     column?: Column;
     index?: number;
-    rows?: Record<string, object>[];
+    rows?: Record<string, any>[];
 };
 export type RenderFunctionString = (args: HeadRenderArgs) => JSX.Element | boolean | number | string;
 export declare const RenderFunctionStringType: import("vue-types").VueTypeDef<RenderFunctionString>;

package/lib/table/table.css

@@ -1687,6 +1687,12 @@
   border-bottom: none;
   border-left: none;
 }
+.bk-table.bordered-none .bk-table-body table tbody tr td {
+  border-top: none;
+  border-right: 1px solid var(--table-bg-color);
+  border-bottom: none;
+  border-left: none;
+}
 .bk-table .bk-table-fixed {
   position: absolute;
   top: 0;

package/lib/table/table.less

@@ -539,6 +539,20 @@
       border-bottom: none;
       border-left: none;
     }
+    .@{bk-prefix}-table-body {
+      table {
+        tbody {
+          tr {
+            td {
+              border-top: none;
+              border-right: 1px solid @table-bg-color;
+              border-bottom: none;
+              border-left: none;
+            }
+          }
+        }
+      }
+    }
   }
 
   .@{bk-prefix}-table-fixed {

package/lib/table/table.variable.css

@@ -2077,6 +2077,12 @@
   border-bottom: none;
   border-left: none;
 }
+.bk-table.bordered-none .bk-table-body table tbody tr td {
+  border-top: none;
+  border-right: 1px solid var(--table-bg-color);
+  border-bottom: none;
+  border-left: none;
+}
 .bk-table .bk-table-fixed {
   position: absolute;
   top: 0;

package/lib/table/utils.d.ts

@@ -140,6 +140,7 @@ export declare const resolveColumnFilterProp: (col: Column) => {
         label: string;
         text?: string;
         value: string;
+        tipKey?: string;
     }[];
     filterFn?: (...args: any[]) => boolean;
     match?: import("./props").FullEnum;

package/lib/tag-input/common.d.ts

@@ -1,6 +1,6 @@
 import { Ref } from 'vue';
 import type { TagProps } from './tag-props';
-export declare const INPUT_MIN_WIDTH = 12;
+export declare const INPUT_MIN_WIDTH = 10;
 export declare function useDebouncedRef<T>(value: any, delay?: number): Ref<T>;
 export declare function usePage(pageSize: Ref<number>): {
     pageState: {

package/lib/tag-input/index.d.ts

@@ -297,6 +297,7 @@ declare const TagInput: {
         bkTagSelectorRef: import("vue").Ref<any>;
         tagListRef: import("vue").Ref<any>;
         tagInputItemRef: import("vue").Ref<any>;
+        inputValueRef: import("vue").Ref<HTMLElement>;
         selectorListRef: import("vue").Ref<any>;
         triggerClass: import("vue").ComputedRef<{
             [x: string]: boolean;
@@ -964,6 +965,7 @@ declare const TagInput: {
         bkTagSelectorRef: import("vue").Ref<any>;
         tagListRef: import("vue").Ref<any>;
         tagInputItemRef: import("vue").Ref<any>;
+        inputValueRef: import("vue").Ref<HTMLElement>;
         selectorListRef: import("vue").Ref<any>;
         triggerClass: import("vue").ComputedRef<{
             [x: string]: boolean;
@@ -1341,6 +1343,7 @@ declare const TagInput: {
     bkTagSelectorRef: import("vue").Ref<any>;
     tagListRef: import("vue").Ref<any>;
     tagInputItemRef: import("vue").Ref<any>;
+    inputValueRef: import("vue").Ref<HTMLElement>;
     selectorListRef: import("vue").Ref<any>;
     triggerClass: import("vue").ComputedRef<{
         [x: string]: boolean;

package/lib/tag-input/index.js

@@ -17509,7 +17509,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
  * IN THE SOFTWARE.
  */
 
-var INPUT_MIN_WIDTH = 12;
+var INPUT_MIN_WIDTH = 10;
 function useDebouncedRef(value) {
   var delay = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 200;
   var timeout;
@@ -18004,6 +18004,7 @@ function tag_input_objectSpread(e) { for (var r = 1; r < arguments.length; r++)
     var tagListRef = (0,external_vue_namespaceObject.ref)(null);
     var tagInputItemRef = (0,external_vue_namespaceObject.ref)(null);
     var selectorListRef = (0,external_vue_namespaceObject.ref)(null);
+    var inputValueRef = (0,external_vue_namespaceObject.ref)();
     var timer = (0,external_vue_namespaceObject.ref)(null);
     // 是否展示tag close
     var showTagClose = (0,external_vue_namespaceObject.computed)(function () {
@@ -18323,7 +18324,9 @@ function tag_input_objectSpread(e) { for (var r = 1; r < arguments.length; r++)
         var charLen = getCharLength(value);
         if (charLen) {
           filterData(value);
-          tagInputRef.value.style.width = "".concat(charLen * INPUT_MIN_WIDTH, "px");
+          (0,external_vue_namespaceObject.nextTick)(function () {
+            tagInputRef.value.style.width = "".concat(inputValueRef.value.getBoundingClientRect().width, "px");
+          });
         } else {
           if (trigger === 'focus') {
             filterData();
@@ -18771,6 +18774,7 @@ function tag_input_objectSpread(e) { for (var r = 1; r < arguments.length; r++)
       bkTagSelectorRef: bkTagSelectorRef,
       tagListRef: tagListRef,
       tagInputItemRef: tagInputItemRef,
+      inputValueRef: inputValueRef,
       selectorListRef: selectorListRef,
       triggerClass: triggerClass,
       overflowTagIndex: overflowTagIndex,
@@ -18847,6 +18851,7 @@ function tag_input_objectSpread(e) { for (var r = 1; r < arguments.length; r++)
           "onUpdate:modelValue": function onUpdateModelValue($event) {
             return _this.curInputValue = $event;
           },
+          "spellcheck": "false",
           "type": "text",
           "onBlur": _this.handleBlur,
           "onFocus": _this.handleFocus,
@@ -18859,7 +18864,11 @@ function tag_input_objectSpread(e) { for (var r = 1; r < arguments.length; r++)
           "class": "tag"
         }, [(0,external_vue_namespaceObject.createVNode)("span", {
           "class": "text"
-        }, [(0,external_vue_namespaceObject.createTextVNode)("+"), _this.selectedTagList.length - _this.overflowTagIndex])])]), [[(0,external_vue_namespaceObject.resolveDirective)("bk-tooltips"), _this.collapseTooltip.join(', ')]])]), (0,external_vue_namespaceObject.withDirectives)((0,external_vue_namespaceObject.createVNode)("p", {
+        }, [(0,external_vue_namespaceObject.createTextVNode)("+"), _this.selectedTagList.length - _this.overflowTagIndex])])]), [[(0,external_vue_namespaceObject.resolveDirective)("bk-tooltips"), _this.collapseTooltip.join(', ')]]), (0,external_vue_namespaceObject.createVNode)("div", {
+          "key": "inputValuePlaceholder",
+          "ref": "inputValueRef",
+          "style": "position: absolute; white-space: nowrap; border-box; visibility: hidden; z-index: 1"
+        }, [_this.curInputValue])]), (0,external_vue_namespaceObject.withDirectives)((0,external_vue_namespaceObject.createVNode)("p", {
           "class": "placeholder"
         }, [_this.placeholderText]), [[external_vue_namespaceObject.vShow, _this.isShowPlaceholder]]), (_this$$slots$suffix = (_this$$slots = _this.$slots) === null || _this$$slots === void 0 || (_this$$slots$suffix2 = _this$$slots.suffix) === null || _this$$slots$suffix2 === void 0 ? void 0 : _this$$slots$suffix2.call(_this$$slots)) !== null && _this$$slots$suffix !== void 0 ? _this$$slots$suffix : _this.isShowClear && (0,external_vue_namespaceObject.createVNode)(icon_namespaceObject.Close, {
           "class": "clear-icon",