bkui-vue 0.0.1-beta.175 → 0.0.1-beta.178

package/dist/index.esm.js

@@ -11130,6 +11130,9 @@ const ClickOutside = {
     nodeList$1.delete(el);
   }
 };
+ClickOutside.install = (app) => {
+  app.directive("bkTooltips", ClickOutside);
+};
 const nodeList = /* @__PURE__ */ new Map();
 const tooltips = {
   beforeMount(el, binding) {
@@ -11315,6 +11318,16 @@ const createInstance = (el, binding) => {
       handleMouseLeave
     }
   });
+  const destroyInstance = (element) => {
+    var _a, _b;
+    handleMouseLeave();
+    (_a = element != null ? element : el) == null ? void 0 : _a.removeEventListener("mouseenter", handleMouseEnter);
+    (_b = element != null ? element : el) == null ? void 0 : _b.removeEventListener("mouseleave", handleMouseLeave);
+  };
+  return {
+    destroyInstance,
+    instance
+  };
 };
 const ellipsis = {
   mounted(el, binding) {
@@ -16015,8 +16028,9 @@ const IColumnType = {
   width: PropTypes.oneOfType([PropTypes.number.def(void 0), PropTypes.string.def("auto")]),
   minWidth: PropTypes.oneOfType([PropTypes.number.def(void 0), PropTypes.string.def("auto")]).def(),
   showOverflowTooltip: PropTypes.oneOfType([PropTypes.bool, PropTypes.shape({
-    content: PropTypes.string,
-    disabled: PropTypes.bool
+    content: PropTypes.string.def(""),
+    disabled: PropTypes.bool.def(false),
+    watchCellResize: PropTypes.bool.def(true)
   })]).def(false),
   type: PropTypes.commonType(["selection", "index", "expand", "none"], "columnType").def("none"),
   resizable: PropTypes.bool.def(true),
@@ -16887,6 +16901,8 @@ var TableCell = defineComponent({
     const {
       showOverflowTooltip = false
     } = props2.column || {};
+    let observerIns = null;
+    let bkEllipsisIns = null;
     const resolveTooltipOption = () => {
       let disabled = true;
       let content = refRoot.value.innerText;
@@ -16905,17 +16921,38 @@ var TableCell = defineComponent({
         content
       };
     };
+    const resolveOverflowTooltip = () => {
+      const textWidth = getElementTextWidth(refRoot.value);
+      const cellWidth = refRoot.value.clientWidth;
+      isTipsEnabled.value = textWidth > cellWidth;
+      if (isTipsEnabled.value) {
+        const bindings = ref(resolveTooltipOption());
+        if (bkEllipsisIns === null) {
+          bkEllipsisIns = createInstance(refRoot.value, bindings);
+        }
+      } else {
+        bkEllipsisIns == null ? void 0 : bkEllipsisIns.destroyInstance(refRoot.value);
+        bkEllipsisIns = null;
+      }
+    };
     onMounted(() => {
-      if (props2.column.showOverflowTooltip) {
-        const textWidth = getElementTextWidth(refRoot.value);
-        const cellWidth = refRoot.value.clientWidth;
-        isTipsEnabled.value = textWidth > cellWidth;
-        if (isTipsEnabled.value) {
-          const bindings = ref(resolveTooltipOption());
-          createInstance(refRoot.value, bindings);
+      var _a;
+      const {
+        disabled
+      } = resolveTooltipOption();
+      if (!disabled) {
+        resolveOverflowTooltip();
+        if (((_a = props2.column.showOverflowTooltip) == null ? void 0 : _a.watchCellResize) !== false) {
+          observerIns = observerResize(refRoot.value, () => {
+            resolveOverflowTooltip();
+          }, 60, true);
+          observerIns.start();
         }
       }
     });
+    onBeforeUnmount(() => {
+      bkEllipsisIns == null ? void 0 : bkEllipsisIns.destroyInstance(refRoot.value);
+    });
     return () => {
       var _a;
       return createVNode("div", {