bkui-vue 0.0.1-beta.344 → 0.0.1-beta.345

package/dist/index.esm.js

@@ -7354,6 +7354,41 @@ const observerResize$1 = (root, callbackFn, delay = 60, immediate = false) => {
   };
 };
 const capitalize = (str) => str[0].toUpperCase() + str.slice(1);
+function checkOverflow(el) {
+  if (!el)
+    return false;
+  const createDom = (el2, css) => {
+    const dom = document.createElement("div");
+    const width = parseFloat(css.width) ? `${Math.ceil(parseFloat(css.width))}px` : css.width;
+    dom.style.cssText = `
+      width: ${width};
+      line-height: ${css["line-height"]};
+      font-size: ${css["font-size"]};
+      word-break: ${css["word-break"]};
+      padding: ${css.padding};
+    `;
+    dom.textContent = el2.textContent;
+    return dom;
+  };
+  let isOverflow = false;
+  try {
+    const css = window.getComputedStyle(el, null);
+    const lineClamp = css.webkitLineClamp;
+    if (lineClamp !== "none") {
+      const targetHeight = parseFloat(css.height);
+      const dom = createDom(el, css);
+      document.body.appendChild(dom);
+      const domHeight = window.getComputedStyle(dom, null).height;
+      document.body.removeChild(dom);
+      isOverflow = targetHeight < parseFloat(domHeight);
+    } else {
+      isOverflow = el.clientWidth < el.scrollWidth || el.clientHeight < el.scrollHeight;
+    }
+  } catch (e) {
+    console.warn("There is an error when check element overflow state: ", e);
+  }
+  return isOverflow;
+}
 class BkMaskManager {
   constructor(config) {
     this.multiInstance = false;
@@ -10742,6 +10777,11 @@ var Component$t = defineComponent({
       login
     };
     const renderImg = () => {
+      if (_$1.isFunction(slots.type)) {
+        return createVNode("div", {
+          "class": "bk-exception-img"
+        }, [slots.type()]);
+      }
       const imgSrc = images[props2.type] ? images[props2.type] : empty;
       return createVNode("div", {
         "class": "bk-exception-img"
@@ -17299,8 +17339,8 @@ const getSortFn = (column, sortType) => {
   const fieldName = column.field;
   const getVal = (row) => getRowText(row, fieldName, column);
   const sortFn0 = (a2, b2) => {
-    const val0 = getVal(a2);
-    const val1 = getVal(b2);
+    const val0 = getVal(a2) || "";
+    const val1 = getVal(b2) || "";
     if (typeof val0 === "number" && typeof val1 === "number") {
       return val0 - val1;
     }
@@ -17347,7 +17387,7 @@ const isRowSelectEnable = (props2, {
   isCheckAll
 }) => {
   if (typeof props2.isRowSelectEnable === "boolean") {
-    return props2.isRowSelectEnable;
+    return props2.isRowSelectEnable !== false;
   }
   if (typeof props2.isRowSelectEnable === "function") {
     return props2.isRowSelectEnable({
@@ -17461,7 +17501,7 @@ var TableCell = defineComponent({
     return () => {
       var _a;
       return createVNode("div", {
-        "class": "cell",
+        "class": ["cell", props2.column.type],
         "ref": refRoot,
         "title": props2.title
       }, [(_a = slots.default) == null ? void 0 : _a.call(slots)]);
@@ -18291,7 +18331,6 @@ class TableRender {
           var _a, _b;
           const cellStyle = [resolveFixedColumnStyle(column), ...formatPropAsArray(this.props.cellStyle, [column, index, row, rowIndex, this])];
           const tdCtxClass = {
-            cell: true,
             "expand-cell": column.type === "expand"
           };
           const cellKey = `__CELL_${rowIndex}_${index}`;
@@ -18899,7 +18938,6 @@ const useInit = (props2, targetColumns) => {
         hasChecked = true;
       }
     });
-    reactiveSchema.rowActions.set(TABLE_ROW_ATTRIBUTE.ROW_SELECTION_ALL, hasChecked && !hasUnchecked);
     reactiveSchema.rowActions.set(TABLE_ROW_ATTRIBUTE.ROW_SELECTION_INDETERMINATE, hasChecked && hasUnchecked);
   };
   const isSelectionEnable = () => props2.columns.some((col) => col.type === "selection");
@@ -18912,12 +18950,15 @@ const useInit = (props2, targetColumns) => {
     const isChecked = typeof checked === "boolean" ? checked : !isSelectionAll();
     reactiveSchema.rowActions.set(TABLE_ROW_ATTRIBUTE.ROW_SELECTION_ALL, isChecked);
     reactiveSchema.rowActions.set(TABLE_ROW_ATTRIBUTE.ROW_SELECTION_INDETERMINATE, false);
-    indexData.forEach((row) => {
+    indexData.forEach((row, index) => {
       var _a2;
-      const rowId = row[TABLE_ROW_ATTRIBUTE.ROW_UID];
-      const target = Object.assign({}, (_a2 = reactiveSchema.rowActions.get(rowId)) != null ? _a2 : {}, { isSelected: isChecked });
-      reactiveSchema.rowActions.set(rowId, target);
+      if (isRowSelectEnable(props2, { row, index, isCheckAll: false })) {
+        const rowId = row[TABLE_ROW_ATTRIBUTE.ROW_UID];
+        const target = Object.assign({}, (_a2 = reactiveSchema.rowActions.get(rowId)) != null ? _a2 : {}, { isSelected: isChecked });
+        reactiveSchema.rowActions.set(rowId, target);
+      }
     });
+    updateSelectionAll();
     updateIndexData(isChecked);
     asyncSelection(null, checked, true);
   };
@@ -18948,10 +18989,10 @@ const useInit = (props2, targetColumns) => {
     }
     return thenFn(row);
   };
-  const resolveSelection = (row, _rowId) => resolveSelectionRow(row, () => {
+  const resolveSelection = (row, _rowId, index) => resolveSelectionRow(row, () => {
     var _a2;
     const rowId = _rowId === void 0 ? row[TABLE_ROW_ATTRIBUTE.ROW_UID] : _rowId;
-    if (isSelectionAll()) {
+    if (isRowSelectEnable(props2, { row, index, isCheckAll: false }) && isSelectionAll()) {
       return true;
     }
     if (reactiveSchema.rowActions.has(rowId)) {
@@ -18972,22 +19013,30 @@ const useInit = (props2, targetColumns) => {
         [TABLE_ROW_ATTRIBUTE.ROW_INDEX]: index,
         [TABLE_ROW_ATTRIBUTE.ROW_UID]: rowId,
         [TABLE_ROW_ATTRIBUTE.ROW_EXPAND]: keepLocalAction ? isRowExpand(rowId) : false,
-        [TABLE_ROW_ATTRIBUTE.ROW_SELECTION]: resolveSelection(item, rowId),
+        [TABLE_ROW_ATTRIBUTE.ROW_SELECTION]: resolveSelection(item, rowId, index),
         [TABLE_ROW_ATTRIBUTE.ROW_SOURCE_DATA]: __spreadValues({}, item),
         [TABLE_ROW_ATTRIBUTE.ROW_SKIP_CFG]: cfg
       });
     }));
     initSelectionAllByData();
   };
+  const isRowChecked = (isRowCheckEnable, selectedAll, item, index) => {
+    const isChecked = resolveSelection(item, item[TABLE_ROW_ATTRIBUTE.ROW_UID], index);
+    if (isRowCheckEnable) {
+      return typeof selectedAll === "boolean" ? selectedAll : isChecked;
+    }
+    return isChecked;
+  };
   const updateIndexData = (selectedAll) => {
     let preRowId = null;
     const skipConfig = {};
     indexData.forEach((item, index) => {
       const rowId = item[TABLE_ROW_ATTRIBUTE.ROW_UID];
       const cfg = neepColspanOrRowspan.value ? getSkipConfig(item, rowId, index, skipConfig, preRowId) : {};
+      const isRowCheckEnable = isRowSelectEnable(props2, { row: item, index, isCheckAll: false });
       Object.assign(item, {
         [TABLE_ROW_ATTRIBUTE.ROW_EXPAND]: isRowExpand(item[TABLE_ROW_ATTRIBUTE.ROW_UID]),
-        [TABLE_ROW_ATTRIBUTE.ROW_SELECTION]: typeof selectedAll === "boolean" ? selectedAll : resolveSelection(item, item[TABLE_ROW_ATTRIBUTE.ROW_UID]),
+        [TABLE_ROW_ATTRIBUTE.ROW_SELECTION]: isRowChecked(isRowCheckEnable, selectedAll, item, index),
         [TABLE_ROW_ATTRIBUTE.ROW_SKIP_CFG]: cfg
       });
       preRowId = item[TABLE_ROW_ATTRIBUTE.ROW_UID];
@@ -19577,26 +19626,60 @@ const tagProps = () => ({
   collapseTags: {
     type: Boolean,
     default: false
+  },
+  tagOverflowTips: {
+    type: Object,
+    default: () => ({})
   }
 });
 var TagRender = defineComponent({
   name: "TagRender",
+  directives: {
+    bkTooltips: tooltips
+  },
   props: {
     node: PropTypes.object,
     displayKey: PropTypes.string,
     tpl: {
       type: Function
+    },
+    hasTips: {
+      type: Boolean,
+      default: false
+    },
+    tagOverflowTips: {
+      type: Object,
+      default: () => ({})
     }
   },
+  setup(props2) {
+    const tagRef = ref();
+    const isOverflow = ref(false);
+    const overflowTips = computed(() => __spreadValues({
+      boundary: "window",
+      theme: "light",
+      distance: 12,
+      content: props2.node[props2.displayKey],
+      disabled: props2.hasTips || !isOverflow.value
+    }, props2.tagOverflowTips));
+    onMounted(() => {
+      isOverflow.value = checkOverflow(tagRef.value);
+    });
+    return {
+      overflowTips,
+      tagRef
+    };
+  },
   render() {
     if (this.tpl) {
       return this.tpl(this.node, h$1, this);
     }
-    return createVNode("div", {
-      "class": "tag"
+    return withDirectives(createVNode("div", {
+      "class": "tag",
+      "ref": "tagRef"
     }, [createVNode("span", {
       "class": "text"
-    }, [this.node[this.displayKey]])]);
+    }, [this.node[this.displayKey]])]), [[resolveDirective("bk-tooltips"), this.overflowTips]]);
   }
 });
 var Component$d = defineComponent({
@@ -20068,7 +20151,7 @@ var Component$d = defineComponent({
         case "NumpadEnter":
           if (!props2.allowCreate && popoverProps.isShow || props2.allowCreate && state.focusItemIndex >= 0 && popoverProps.isShow) {
             handleTagSelected(pageState.curPageList[state.focusItemIndex], "select", e);
-          } else if (props2.allowCreate) {
+          } else if (props2.allowCreate && curInputValue.value.trim()) {
             handleTagSelected(curInputValue.value, "custom", e);
           }
           e.preventDefault();
@@ -20308,7 +20391,9 @@ var Component$d = defineComponent({
           }, [createVNode(TagRender, {
             "node": item,
             "tpl": this.tagTpl,
-            "displayKey": this.displayKey
+            "displayKey": this.displayKey,
+            "hasTips": !!this.tooltipKey,
+            "tagOverflowTips": this.tagOverflowTips
           }, null), this.showTagClose ? createVNode(error, {
             "class": "remove-tag",
             "onClick": this.handleTagRemove.bind(this, item, index)
@@ -20616,12 +20701,12 @@ var TabNav = defineComponent({
         tabLabel
       } = item;
       const getNavItemClass = () => {
-        const classNames = ["bk-tab-header-item"];
+        const classNames = [resolveClassName("tab-header-item")];
         if (disabled) {
-          classNames.push("bk-tab-header--disabled");
+          classNames.push(resolveClassName("tab-header--disabled"));
         }
         if (active === name) {
-          classNames.push("bk-tab-header--active");
+          classNames.push(resolveClassName("tab-header--active"));
         }
         return classNames.join(" ");
       };
@@ -20651,7 +20736,7 @@ var TabNav = defineComponent({
         },
         "class": getNavItemClass()
       }, [createVNode("div", null, [tabLabel]), getValue(item.closable, closable) && createVNode(close$1, {
-        "class": "bk-tab-header-item-close",
+        "class": resolveClassName("tab-header-item-close"),
         "onClick": () => this.handleTabRemove(index, item)
       }, null)]);
     });
@@ -20670,9 +20755,9 @@ var TabNav = defineComponent({
       }
       if (list.length) {
         return createVNode("div", {
-          "class": "bk-tab-header-operation"
+          "class": resolveClassName("tab-header-operation")
         }, [list.map((item, index) => createVNode("div", {
-          "class": "bk-tab-header-item",
+          "class": resolveClassName("tab-header-item"),
           "key": index
         }, [item]))]);
       }
@@ -20682,11 +20767,11 @@ var TabNav = defineComponent({
       "style": {
         lineHeight: `${labelHeight}px`
       },
-      "class": "bk-tab-header"
+      "class": resolveClassName("tab-header")
     }, [createVNode("div", {
-      "class": "bk-tab-header-nav"
+      "class": resolveClassName("tab-header-nav")
     }, [renderNavs()]), renderSlot2(), typeof this.$slots.setting === "function" && createVNode("div", {
-      "class": "bk-tab-header-setting"
+      "class": resolveClassName("tab-header-setting")
     }, [this.$slots.setting()])]);
   }
 });
@@ -20861,7 +20946,7 @@ var Tab = defineComponent({
     return createVNode("div", {
       "class": getTabBoxClass()
     }, [getTabHeader(), createVNode("div", {
-      "class": "bk-tab-content"
+      "class": resolveClassName("tab-content")
     }, [(_b = (_a = this.$slots).default) == null ? void 0 : _b.call(_a)])]);
   }
 });
@@ -20887,7 +20972,7 @@ var TabPanel = defineComponent({
     };
     return withDirectives(createVNode("div", {
       "ref": "content",
-      "class": "bk-tab-panel"
+      "class": resolveClassName("tab-panel")
     }, [getContent()]), [[vShow, active]]);
   }
 });