@qin-ui/antd-vue-pro 2.5.3 → 2.6.0

package/es/index.js

@@ -1,6 +1,6 @@
 import "./antd-vue-pro.css";
-import { defineComponent, createBlock, renderSlot, openBlock, resolveDynamicComponent, normalizeProps, mergeProps, withCtx, createElementBlock, Fragment, createTextVNode, toDisplayString, inject, computed, toValue, ref, onBeforeUnmount, createCommentVNode, createSlots, renderList, createVNode, watch, h, toRaw, unref, provide, useSlots, shallowRef, onUpdated, triggerRef, createElementVNode, withModifiers, normalizeStyle, nextTick, mergeModels, useModel, getCurrentInstance, onMounted, normalizeClass, guardReactiveProps } from "vue";
-import { Transfer, TreeSelect, Slider, Switch, RadioGroup, CheckboxGroup, TimePicker, RangePicker, DatePicker, Cascader, Select, InputNumber, InputPassword, InputSearch, Textarea, Input, FormItem, Col, Row, Form, Space, Button, theme, Dropdown, Menu, MenuItem, Checkbox, MenuDivider, Table } from "ant-design-vue";
+import { defineComponent, createBlock, renderSlot, openBlock, resolveDynamicComponent, normalizeProps, mergeProps, withCtx, createElementBlock, Fragment, createTextVNode, toDisplayString, inject, computed, toValue, ref, onBeforeUnmount, createCommentVNode, createSlots, renderList, createVNode, watch, h, toRaw, unref, provide, useSlots, shallowRef, onUpdated, triggerRef, createElementVNode, withModifiers, normalizeStyle, nextTick, mergeModels, useModel, useAttrs, Teleport, onDeactivated, onMounted, getCurrentInstance, normalizeClass, guardReactiveProps } from "vue";
+import { Transfer, TreeSelect, Slider, Switch, RadioGroup, CheckboxGroup, TimePicker, RangePicker, DatePicker, Cascader, Select, InputNumber, InputPassword, InputSearch, Textarea, Input, FormItem, Col, Row, Form, Space, Button, theme, Dropdown, Menu, MenuItem, Checkbox, MenuDivider, Tooltip, Table } from "ant-design-vue";
 import { useForm as useForm$1, resolveLocaleName, zhTW, enUS, zhCN, format, useReactiveAttrs, cloneDeep, getObject, InjectionFormSlotsKey, isPlainObject, resolveFieldIdentity, toPath, isObjectItem, InjectionFormKey, createFormProxy, omitBy, camelizeProperties, useFields as useFields$1, useFormRef as useFormRef$1, useSearchFormExpand, pick, isPromise, useTable as useTable$1, omit } from "@qin-ui/pro-components-core";
 import { enUS as enUS2, useFormData, zhCN as zhCN2, zhTW as zhTW2 } from "@qin-ui/pro-components-core";
 import { useConfigContextInject } from "ant-design-vue/es/config-provider/context";
@@ -154,7 +154,7 @@ const ensureInjectConfig = (key) => {
   DYNAMIC_INJECT_CONFIG[key] = created;
   return created;
 };
-const _sfc_main$f = /* @__PURE__ */ defineComponent({
+const _sfc_main$g = /* @__PURE__ */ defineComponent({
   ...{ name: "ContainerFragment", inheritAttrs: false },
   __name: "index",
   props: {
@@ -172,7 +172,7 @@ const _sfc_main$f = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _sfc_main$e = /* @__PURE__ */ defineComponent({
+const _sfc_main$f = /* @__PURE__ */ defineComponent({
   ...{ name: "SlotComponent", inheritAttrs: false },
   __name: "index",
   props: {
@@ -265,7 +265,7 @@ const useLocale = () => {
   };
   return { t, lang };
 };
-const _sfc_main$d = /* @__PURE__ */ defineComponent({
+const _sfc_main$e = /* @__PURE__ */ defineComponent({
   ...{ name: "BaseField", inheritAttrs: false },
   __name: "index",
   props: {
@@ -396,7 +396,7 @@ const _sfc_main$d = /* @__PURE__ */ defineComponent({
       getComponentComputedProps: () => groupedAttrs.value.attrs
     });
     return (_ctx, _cache) => {
-      return openBlock(), createBlock(_sfc_main$f, {
+      return openBlock(), createBlock(_sfc_main$g, {
         component: groupedAttrs.value.componentContainer,
         path: props.path
       }, {
@@ -412,7 +412,7 @@ const _sfc_main$d = /* @__PURE__ */ defineComponent({
               return {
                 name,
                 fn: withCtx((scoped) => [
-                  createVNode(_sfc_main$e, mergeProps({
+                  createVNode(_sfc_main$f, mergeProps({
                     path: props.path
                   }, scoped, { component: slot }), null, 16, ["path", "component"])
                 ])
@@ -495,7 +495,7 @@ function useGroupedField(field) {
     () => groupField(toValue(field), toValue(injectFormItemProps) || {})
   );
 }
-const _sfc_main$c = defineComponent({
+const _sfc_main$d = defineComponent({
   name: "BaseFormItem",
   inheritAttrs: false,
   props: {
@@ -562,7 +562,7 @@ const _sfc_main$c = defineComponent({
     const renderFormItemSlots = (groupedField) => {
       const slots = {};
       Object.entries(groupedField.formItemSlots).forEach(([name, slot]) => {
-        slots[name] = (scope) => h(_sfc_main$e, {
+        slots[name] = (scope) => h(_sfc_main$f, {
           path: groupedField.path,
           component: slot,
           ...scope || {}
@@ -571,13 +571,13 @@ const _sfc_main$c = defineComponent({
       slots.default = () => {
         const field = props.field;
         if (field.fields) {
-          return h(_sfc_main$b, {
+          return h(_sfc_main$c, {
             grid: field.grid ?? props.grid,
             fields: field.fields,
             disabled: toValue(field.disabled)
           });
         }
-        return h(_sfc_main$d, {
+        return h(_sfc_main$e, {
           key: componentKey.value,
           ref: setFieldRef,
           ...groupedField.componentProps,
@@ -663,7 +663,7 @@ const getFieldDataKey = (field, rawFormData) => {
   const rest = segments.slice(lastRowIndex + 1).join(".");
   return `data:${rowIds.join("/")}:${rest}`;
 };
-const _sfc_main$b = /* @__PURE__ */ defineComponent({
+const _sfc_main$c = /* @__PURE__ */ defineComponent({
   ...{ name: "BaseFormItems", inheritAttrs: false },
   __name: "index",
   props: {
@@ -768,7 +768,7 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent({
       return enableGrid.value ? (openBlock(), createBlock(unref(Row), normalizeProps(mergeProps({ key: 0 }, computedGridProps.value)), {
         default: withCtx(() => [
           (openBlock(true), createElementBlock(Fragment, null, renderList(renderedFields.value, (item) => {
-            return openBlock(), createBlock(_sfc_main$c, {
+            return openBlock(), createBlock(_sfc_main$d, {
               key: item.key,
               field: item.field,
               grid: props.grid,
@@ -780,7 +780,7 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent({
         ]),
         _: 1
       }, 16)) : (openBlock(true), createElementBlock(Fragment, { key: 1 }, renderList(renderedFields.value, (item) => {
-        return openBlock(), createBlock(_sfc_main$c, {
+        return openBlock(), createBlock(_sfc_main$d, {
           key: item.key,
           field: item.field,
           grid: props.grid,
@@ -792,7 +792,7 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _sfc_main$a = /* @__PURE__ */ defineComponent({
+const _sfc_main$b = /* @__PURE__ */ defineComponent({
   ...{ name: "ProForm", inheritAttrs: false },
   __name: "index",
   props: {
@@ -855,7 +855,7 @@ const _sfc_main$a = /* @__PURE__ */ defineComponent({
         model: formData.value
       }, formAttrs.value, { class: "pro-form" }), {
         default: withCtx(() => [
-          createVNode(_sfc_main$b, {
+          createVNode(_sfc_main$c, {
             fields: fields.value,
             grid: props.grid
           }, null, 8, ["fields", "grid"]),
@@ -879,7 +879,7 @@ const _export_sfc = (sfc, props) => {
   }
   return target;
 };
-const _sfc_main$9 = {};
+const _sfc_main$a = {};
 const _hoisted_1$3 = {
   focusable: "false",
   "data-icon": "down",
@@ -894,8 +894,8 @@ function _sfc_render$2(_ctx, _cache) {
     createElementVNode("path", { d: "M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z" }, null, -1)
   ])]);
 }
-const DownOutlined = /* @__PURE__ */ _export_sfc(_sfc_main$9, [["render", _sfc_render$2]]);
-const _sfc_main$8 = /* @__PURE__ */ defineComponent({
+const DownOutlined = /* @__PURE__ */ _export_sfc(_sfc_main$a, [["render", _sfc_render$2]]);
+const _sfc_main$9 = /* @__PURE__ */ defineComponent({
   ...{ name: "SearchForm" },
   __name: "SearchForm",
   props: {
@@ -953,7 +953,7 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
       emitSearch();
     };
     return (_ctx, _cache) => {
-      return openBlock(), createBlock(_sfc_main$a, mergeProps(layoutProps.value, {
+      return openBlock(), createBlock(_sfc_main$b, mergeProps(layoutProps.value, {
         form: props.form,
         class: "pro-table_search-form transition",
         onSubmit: withModifiers(onSearchSubmit, ["prevent"])
@@ -1034,8 +1034,8 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const SearchForm = /* @__PURE__ */ _export_sfc(_sfc_main$8, [["__scopeId", "data-v-bf6cca54"]]);
-const _sfc_main$7 = /* @__PURE__ */ defineComponent({
+const SearchForm = /* @__PURE__ */ _export_sfc(_sfc_main$9, [["__scopeId", "data-v-bf6cca54"]]);
+const _sfc_main$8 = /* @__PURE__ */ defineComponent({
   __name: "DefaultSearchFormContainer",
   setup(__props) {
     const { token } = theme.useToken();
@@ -1049,8 +1049,8 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const DefaultSearchFormContainer = /* @__PURE__ */ _export_sfc(_sfc_main$7, [["__scopeId", "data-v-570a1898"]]);
-const _sfc_main$6 = /* @__PURE__ */ defineComponent({
+const DefaultSearchFormContainer = /* @__PURE__ */ _export_sfc(_sfc_main$8, [["__scopeId", "data-v-570a1898"]]);
+const _sfc_main$7 = /* @__PURE__ */ defineComponent({
   __name: "DefaultTableContainer",
   setup(__props) {
     const { token } = theme.useToken();
@@ -1064,8 +1064,8 @@ const _sfc_main$6 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const DefaultTableContainer = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["__scopeId", "data-v-e5c97b2f"]]);
-const _sfc_main$5 = {};
+const DefaultTableContainer = /* @__PURE__ */ _export_sfc(_sfc_main$7, [["__scopeId", "data-v-e5c97b2f"]]);
+const _sfc_main$6 = {};
 const _hoisted_1$2 = {
   focusable: "false",
   "data-icon": "column-height",
@@ -1080,8 +1080,8 @@ function _sfc_render$1(_ctx, _cache) {
     createElementVNode("path", { d: "M840 836H184c-4.4 0-8 3.6-8 8v60c0 4.4 3.6 8 8 8h656c4.4 0 8-3.6 8-8v-60c0-4.4-3.6-8-8-8zm0-724H184c-4.4 0-8 3.6-8 8v60c0 4.4 3.6 8 8 8h656c4.4 0 8-3.6 8-8v-60c0-4.4-3.6-8-8-8zM610.8 378c6 0 9.4-7 5.7-11.7L515.7 238.7a7.14 7.14 0 00-11.3 0L403.6 366.3a7.23 7.23 0 005.7 11.7H476v268h-62.8c-6 0-9.4 7-5.7 11.7l100.8 127.5c2.9 3.7 8.5 3.7 11.3 0l100.8-127.5c3.7-4.7.4-11.7-5.7-11.7H548V378h62.8z" }, null, -1)
   ])]);
 }
-const ColumnHeightOutlined = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["render", _sfc_render$1]]);
-const _sfc_main$4 = /* @__PURE__ */ defineComponent({
+const ColumnHeightOutlined = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["render", _sfc_render$1]]);
+const _sfc_main$5 = /* @__PURE__ */ defineComponent({
   __name: "SizeControl",
   props: /* @__PURE__ */ mergeModels({
     effectiveSize: { default: void 0 }
@@ -1138,8 +1138,8 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const SizeControl = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["__scopeId", "data-v-950f061f"]]);
-const _sfc_main$3 = {};
+const SizeControl = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__scopeId", "data-v-950f061f"]]);
+const _sfc_main$4 = {};
 const _hoisted_1$1 = {
   focusable: "false",
   "data-icon": "filter",
@@ -1154,8 +1154,8 @@ function _sfc_render(_ctx, _cache) {
     createElementVNode("path", { d: "M880.1 154H143.9c-24.5 0-39.8 26.7-27.5 48L349 597.4V838c0 17.7 14.2 32 31.8 32h262.4c17.6 0 31.8-14.3 31.8-32V597.4L907.7 202c12.2-21.3-3.1-48-27.6-48zM603.4 798H420.6V642h182.9v156zm9.6-236.6l-9.5 16.6h-183l-9.5-16.6L212.7 226h598.6L613 561.4z" }, null, -1)
   ])]);
 }
-const FilterOutlined = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["render", _sfc_render]]);
-const _sfc_main$2 = /* @__PURE__ */ defineComponent({
+const FilterOutlined = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["render", _sfc_render]]);
+const _sfc_main$3 = /* @__PURE__ */ defineComponent({
   __name: "ColumnControl",
   props: {
     columns: {},
@@ -1320,7 +1320,303 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const ColumnControl = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-58650608"]]);
+const ColumnControl = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__scopeId", "data-v-58650608"]]);
+const _sfc_main$2 = /* @__PURE__ */ defineComponent({
+  ...{ name: "TableEllipsisTooltip", inheritAttrs: false },
+  __name: "TableEllipsisTooltip",
+  props: {
+    open: { type: Boolean, default: false },
+    content: { default: "" },
+    anchorStyle: { default: () => ({
+      position: "fixed",
+      pointerEvents: "none",
+      opacity: 0
+    }) },
+    container: { type: Function, default: () => void 0 }
+  },
+  setup(__props) {
+    const props = __props;
+    const attrs = useAttrs();
+    const HostTooltip = Tooltip;
+    const tooltipRef = ref(null);
+    const forceAlign = async () => {
+      var _a;
+      if (!props.open) return;
+      await nextTick();
+      const instance = tooltipRef.value;
+      (_a = (instance == null ? void 0 : instance.forceAlign) ?? (instance == null ? void 0 : instance.forcePopupAlign)) == null ? void 0 : _a();
+    };
+    watch(() => props.anchorStyle, forceAlign, { deep: true });
+    watch(
+      () => props.open,
+      (value) => {
+        if (value) forceAlign();
+      }
+    );
+    const getContainerNode = () => {
+      var _a;
+      const container = (_a = props.container) == null ? void 0 : _a.call(props);
+      if (container) return container;
+      return typeof document !== "undefined" ? document.body : void 0;
+    };
+    const getPopupContainer2 = () => getContainerNode() ?? document.body;
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(Teleport, {
+        to: getContainerNode() ?? "body"
+      }, [
+        createVNode(unref(HostTooltip), mergeProps(unref(attrs), {
+          ref_key: "tooltipRef",
+          ref: tooltipRef,
+          open: __props.open,
+          title: __props.content,
+          trigger: [],
+          "get-popup-container": getPopupContainer2
+        }), {
+          default: withCtx(() => [
+            createElementVNode("span", {
+              class: "pro-table_ellipsis-tooltip-anchor",
+              style: normalizeStyle(__props.anchorStyle),
+              "aria-hidden": "true"
+            }, null, 4)
+          ]),
+          _: 1
+        }, 16, ["open", "title"])
+      ], 8, ["to"]);
+    };
+  }
+});
+const ELLIPSIS_TOOLTIP_CELL_ATTR = "data-pro-table-ellipsis";
+const PRO_TABLE_ROOT_ATTR = "data-pro-table-root";
+const ANCHOR_BASE_STYLE = {
+  position: "fixed",
+  pointerEvents: "none",
+  opacity: 0
+};
+const getCellText = (cell) => {
+  const text = cell.innerText || cell.textContent || "";
+  return text.replace(/\s+/g, " ").trim();
+};
+const measureCell = (cell) => {
+  const text = getCellText(cell);
+  return {
+    text,
+    overflow: Boolean(text) && cell.scrollWidth > cell.clientWidth
+  };
+};
+function useEllipsisTooltip(rootRef, enabled, delay, leaveDelay) {
+  const open = ref(false);
+  const content = ref("");
+  const anchorStyle = ref({
+    ...ANCHOR_BASE_STYLE
+  });
+  let activeCell = null;
+  let pendingCell = null;
+  let openTimer = null;
+  let closeTimer = null;
+  const clearOpenTimer = () => {
+    if (openTimer === null) return;
+    clearTimeout(openTimer);
+    openTimer = null;
+    pendingCell = null;
+  };
+  const clearCloseTimer = () => {
+    if (closeTimer === null) return;
+    clearTimeout(closeTimer);
+    closeTimer = null;
+  };
+  const close = () => {
+    clearOpenTimer();
+    clearCloseTimer();
+    open.value = false;
+    activeCell = null;
+  };
+  const getEventRoot = (node) => {
+    var _a;
+    const element = node instanceof Element ? node : node == null ? void 0 : node.parentElement;
+    return ((_a = element == null ? void 0 : element.closest) == null ? void 0 : _a.call(element, `[${PRO_TABLE_ROOT_ATTR}]`)) ?? null;
+  };
+  const getCellFromEvent = (event) => {
+    var _a;
+    const target = event.target;
+    const cell = (_a = target == null ? void 0 : target.closest) == null ? void 0 : _a.call(target, `[${ELLIPSIS_TOOLTIP_CELL_ATTR}]`);
+    if (!(cell instanceof HTMLElement)) return null;
+    const root = rootRef.value;
+    if (!root) return null;
+    if (cell.closest(`[${PRO_TABLE_ROOT_ATTR}]`) !== root) return null;
+    return cell;
+  };
+  const onMouseOver = (event) => {
+    const cell = getCellFromEvent(event);
+    if (!cell) return;
+    clearCloseTimer();
+    if (cell === activeCell || cell === pendingCell) return;
+    close();
+    const measurement = measureCell(cell);
+    if (!measurement.overflow) return;
+    const rect = cell.getBoundingClientRect();
+    if (!rect.width || !rect.height) return;
+    content.value = measurement.text;
+    anchorStyle.value = {
+      ...ANCHOR_BASE_STYLE,
+      left: `${rect.left}px`,
+      top: `${rect.top}px`,
+      width: `${rect.width}px`,
+      height: `${rect.height}px`
+    };
+    pendingCell = cell;
+    openTimer = setTimeout(
+      () => {
+        openTimer = null;
+        pendingCell = null;
+        if (!cell.isConnected) return;
+        activeCell = cell;
+        open.value = true;
+      },
+      Math.max(0, delay.value)
+    );
+  };
+  const onMouseOut = (event) => {
+    if (!activeCell && !pendingCell) return;
+    const owner = activeCell ?? pendingCell;
+    const target = event.target;
+    if (!owner || !target || !owner.contains(target)) return;
+    const related = event.relatedTarget;
+    if (related && owner.contains(related)) {
+      const relatedRoot = getEventRoot(related);
+      if (!relatedRoot || relatedRoot === rootRef.value) return;
+      close();
+      return;
+    }
+    if (pendingCell) {
+      close();
+      return;
+    }
+    clearCloseTimer();
+    const delayMs = Math.max(0, leaveDelay.value);
+    if (delayMs === 0) {
+      close();
+      return;
+    }
+    closeTimer = setTimeout(() => {
+      closeTimer = null;
+      close();
+    }, delayMs);
+  };
+  const onViewportChange = () => close();
+  let listening = false;
+  const addViewportListeners = () => {
+    if (listening || typeof window === "undefined") return;
+    listening = true;
+    window.addEventListener("scroll", onViewportChange, true);
+    window.addEventListener("resize", onViewportChange);
+  };
+  const removeViewportListeners = () => {
+    if (!listening) return;
+    listening = false;
+    window.removeEventListener("scroll", onViewportChange, true);
+    window.removeEventListener("resize", onViewportChange);
+  };
+  onDeactivated(close);
+  onMounted(() => {
+    if (enabled.value) addViewportListeners();
+  });
+  watch(enabled, (value) => {
+    if (value) {
+      addViewportListeners();
+    } else {
+      removeViewportListeners();
+      close();
+    }
+  });
+  onBeforeUnmount(() => {
+    removeViewportListeners();
+    clearOpenTimer();
+    clearCloseTimer();
+  });
+  return {
+    open,
+    content,
+    anchorStyle,
+    onMouseOver,
+    onMouseOut,
+    close
+  };
+}
+function useEllipsisTooltipColumns(getColumns, globalEnabled = () => false) {
+  const originalColumns = /* @__PURE__ */ new WeakMap();
+  const registerColumnClone = (next, source) => {
+    if (next !== source && isObjectItem(next) && !originalColumns.has(next)) {
+      originalColumns.set(next, source);
+    }
+    return next;
+  };
+  const resolveOriginalColumn = (column) => {
+    const raw = toRaw(column);
+    const source = originalColumns.get(raw) ?? raw.__originColumn__;
+    if (!isObjectItem(source)) return column;
+    return originalColumns.get(toRaw(source)) ?? source;
+  };
+  const resolveSorterColumn = (sorter) => sorter && typeof sorter === "object" && sorter.column ? { ...sorter, column: resolveOriginalColumn(sorter.column) } : sorter;
+  const transformColumns = (columns, global, ancestors = /* @__PURE__ */ new Set()) => {
+    const list = [];
+    let changed = false;
+    let hasTooltip = false;
+    for (const column of columns) {
+      if (!isObjectItem(column) || toValue(column.hidden)) {
+        changed = true;
+        continue;
+      }
+      let childChanged = false;
+      let childColumns = column.children;
+      let childHasTooltip = false;
+      if (Array.isArray(column.children) && column.children.length > 0) {
+        if (ancestors.has(column)) {
+          changed = true;
+          continue;
+        }
+        ancestors.add(column);
+        const child = transformColumns(column.children, global, ancestors);
+        ancestors.delete(column);
+        childChanged = child.changed;
+        childColumns = child.columns;
+        childHasTooltip = child.hasTooltip;
+      }
+      const ellipsis = column.ellipsis;
+      const explicit = ellipsis === false ? false : isPlainObject(ellipsis) ? ellipsis.showTooltip : void 0;
+      const tooltipEnabled = explicit === false ? false : global || explicit === true;
+      let next = column;
+      if (childChanged || tooltipEnabled) {
+        const { showTooltip: _showTooltip, ...restEllipsis } = isPlainObject(
+          ellipsis
+        ) ? ellipsis : {};
+        const customCell = column.customCell;
+        next = {
+          ...column,
+          ...childChanged ? { children: childColumns } : {},
+          ...tooltipEnabled ? {
+            ellipsis: { ...restEllipsis, showTitle: false },
+            customCell: (record, rowIndex, cellColumn) => ({
+              ...(customCell == null ? void 0 : customCell(record, rowIndex, cellColumn)) ?? {},
+              [ELLIPSIS_TOOLTIP_CELL_ATTR]: ""
+            })
+          } : {}
+        };
+        registerColumnClone(next, column);
+        changed = true;
+      }
+      if (tooltipEnabled || childHasTooltip) hasTooltip = true;
+      list.push(next);
+    }
+    return { columns: changed ? list : columns, changed, hasTooltip };
+  };
+  const state = computed(() => transformColumns(getColumns(), globalEnabled()));
+  return {
+    columns: computed(() => state.value.columns),
+    hasTooltip: computed(() => state.value.hasTooltip),
+    resolveOriginalColumn,
+    resolveSorterColumn
+  };
+}
 const _hoisted_1 = { class: "pro-table_header" };
 const _hoisted_2 = {
   key: 0,
@@ -1348,7 +1644,8 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
     immediateSearch: { type: Boolean, default: void 0 },
     control: { type: [Boolean, Object], default: void 0 },
     searchFormConfig: { default: void 0 },
-    tableContainer: { type: [Object, Function, Boolean], default: void 0 }
+    tableContainer: { type: [Object, Function, Boolean], default: void 0 },
+    ellipsisTooltip: { type: [Boolean, Object], default: void 0 }
   }, {
     "size": {},
     "sizeModifiers": {},
@@ -1384,6 +1681,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
       return rest;
     });
     const attrs = useReactiveAttrs();
+    const rootRef = ref(null);
     const size = useModel(__props, "size");
     const loading = useModel(__props, "loading");
     let searchSequence = 0;
@@ -1471,19 +1769,6 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
     const effectiveSize = computed(() => {
       return size.value ?? injectAttrs.value.size;
     });
-    const computedTableProps = computed(() => {
-      const merged = {
-        ...injectAttrs.value,
-        ...omitBy(
-          pick(camelAttrs.value, tableProperties),
-          (value) => value === void 0
-        )
-      };
-      delete merged.onChange;
-      merged.size = effectiveSize.value;
-      merged.loading = void 0;
-      return merged;
-    });
     const computedTableContainer = computed(() => {
       const container = props.tableContainer ?? injectProps.value.tableContainer ?? DefaultTableContainer;
       return container ? container : void 0;
@@ -1510,39 +1795,84 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
       const needIndex = props.addIndexColumn ?? injectProps.value.addIndexColumn;
       return needIndex ? [indexColumn.value, ...cols] : cols;
     });
-    const filterVisibleColumns = (columns, ancestors = /* @__PURE__ */ new Set()) => {
-      const list = [];
-      let changed = false;
-      for (const column of columns) {
-        if (!isObjectItem(column) || toValue(column.hidden)) {
-          changed = true;
-          continue;
-        }
-        if (Array.isArray(column.children) && column.children.length > 0) {
-          if (ancestors.has(column)) {
-            changed = true;
-            continue;
-          }
-          ancestors.add(column);
-          const filtered = filterVisibleColumns(column.children, ancestors);
-          ancestors.delete(column);
-          if (filtered.changed) {
-            changed = true;
-            list.push({ ...column, children: filtered.list });
-            continue;
-          }
-        }
-        list.push(column);
+    const ellipsisTooltipValue = computed(
+      () => props.ellipsisTooltip ?? injectProps.value.ellipsisTooltip
+    );
+    const ellipsisTooltipConfig = computed(
+      () => typeof ellipsisTooltipValue.value === "object" && ellipsisTooltipValue.value ? ellipsisTooltipValue.value : {}
+    );
+    const ellipsisTooltipGlobal = computed(
+      () => Boolean(ellipsisTooltipValue.value)
+    );
+    const {
+      columns: visibleComputedColumns,
+      hasTooltip: ellipsisTooltipEnabled,
+      resolveOriginalColumn,
+      resolveSorterColumn
+    } = useEllipsisTooltipColumns(
+      () => computedColumns.value,
+      () => ellipsisTooltipGlobal.value
+    );
+    const computedTableProps = computed(() => {
+      const merged = {
+        ...injectAttrs.value,
+        ...omitBy(
+          pick(camelAttrs.value, tableProperties),
+          (value) => value === void 0
+        )
+      };
+      delete merged.onChange;
+      const resizeColumn = merged.onResizeColumn;
+      if (typeof resizeColumn === "function") {
+        merged.onResizeColumn = (width, column) => resizeColumn(width, resolveOriginalColumn(column));
       }
-      return { list, changed };
-    };
-    const visibleComputedColumns = computed(() => {
-      return filterVisibleColumns(computedColumns.value).list;
+      merged.size = effectiveSize.value;
+      merged.loading = void 0;
+      return merged;
+    });
+    const ellipsisTooltipContainer = computed(() => {
+      const getPopupContainer2 = ellipsisTooltipConfig.value.getPopupContainer;
+      if (!getPopupContainer2) return void 0;
+      return () => {
+        if (typeof document === "undefined") return void 0;
+        const root = rootRef.value ?? document.body;
+        return getPopupContainer2(root) ?? document.body;
+      };
+    });
+    const ellipsisTooltipDelay = computed(
+      () => Math.max(0, (ellipsisTooltipConfig.value.mouseEnterDelay ?? 0.2) * 1e3)
+    );
+    const ellipsisTooltipLeaveDelay = computed(
+      () => Math.max(0, (ellipsisTooltipConfig.value.mouseLeaveDelay ?? 0.1) * 1e3)
+    );
+    const ellipsisTooltipProps = computed(() => {
+      const config2 = ellipsisTooltipConfig.value;
+      const {
+        getPopupContainer: _getPopupContainer,
+        mouseEnterDelay: _mouseEnterDelay,
+        mouseLeaveDelay: _mouseLeaveDelay,
+        ...rest
+      } = config2;
+      return rest;
     });
+    const {
+      open: ellipsisTooltipOpen,
+      content: ellipsisTooltipContent,
+      anchorStyle: ellipsisTooltipAnchorStyle,
+      onMouseOver: onEllipsisMouseOver,
+      onMouseOut: onEllipsisMouseOut,
+      close: closeEllipsisTooltip
+    } = useEllipsisTooltip(
+      rootRef,
+      ellipsisTooltipEnabled,
+      ellipsisTooltipDelay,
+      ellipsisTooltipLeaveDelay
+    );
     const computedDataSource = computed(() => {
       var _a;
       return resolveOwnedProp("dataSource") ?? toValue((_a = props.table) == null ? void 0 : _a.dataSource) ?? [];
     });
+    watch([visibleComputedColumns, computedDataSource], closeEllipsisTooltip);
     const computedPagination = computed(() => {
       var _a, _b, _c;
       const attrsPagination = resolveOwnedProp("pagination");
@@ -1584,7 +1914,14 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
         );
         if (shadowed.length) warnPaginationShadow(shadowed);
       }
-      (_d = attrs.onChange ?? injectProps.value.onChange) == null ? void 0 : _d(...args);
+      const nextArgs = [...args];
+      const sorterArg = nextArgs[2];
+      if (Array.isArray(sorterArg)) {
+        nextArgs[2] = sorterArg.map(resolveSorterColumn);
+      } else if (sorterArg) {
+        nextArgs[2] = resolveSorterColumn(sorterArg);
+      }
+      (_d = attrs.onChange ?? injectProps.value.onChange) == null ? void 0 : _d(...nextArgs);
       _search();
     };
     const searchFormVisible = computed(() => {
@@ -1624,10 +1961,17 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
     });
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", {
+        ref_key: "rootRef",
+        ref: rootRef,
         class: normalizeClass(["pro-table", unref(attrs).class]),
-        style: normalizeStyle(unref(attrs).style)
+        "data-pro-table-root": "",
+        style: normalizeStyle(unref(attrs).style),
+        onMouseover: _cache[1] || (_cache[1] = //@ts-ignore
+        (...args) => unref(onEllipsisMouseOver) && unref(onEllipsisMouseOver)(...args)),
+        onMouseout: _cache[2] || (_cache[2] = //@ts-ignore
+        (...args) => unref(onEllipsisMouseOut) && unref(onEllipsisMouseOut)(...args))
       }, [
-        searchFormVisible.value || _ctx.$slots["search-form"] ? (openBlock(), createBlock(_sfc_main$f, {
+        searchFormVisible.value || _ctx.$slots["search-form"] ? (openBlock(), createBlock(_sfc_main$g, {
           key: 0,
           component: computedSearchFormConfig.value.container
         }, {
@@ -1650,7 +1994,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
           }),
           _: 3
         }, 8, ["component"])) : createCommentVNode("", true),
-        createVNode(_sfc_main$f, { component: computedTableContainer.value }, {
+        createVNode(_sfc_main$g, { component: computedTableContainer.value }, {
           default: withCtx(() => [
             createElementVNode("div", _hoisted_1, [
               _ctx.$slots["button-bar"] ? (openBlock(), createElementBlock("div", _hoisted_2, [
@@ -1675,7 +2019,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
               ])) : createCommentVNode("", true)
             ]),
             renderSlot(_ctx.$slots, "table", normalizeProps(guardReactiveProps({
-              columns: visibleComputedColumns.value,
+              columns: unref(visibleComputedColumns),
               dataSource: computedDataSource.value,
               pagination: computedPagination.value,
               loading: loading.value,
@@ -1684,7 +2028,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
             })), () => [
               createVNode(unref(Table), mergeProps({ class: "pro-table_content" }, computedTableProps.value, {
                 loading: loading.value,
-                columns: visibleComputedColumns.value,
+                columns: unref(visibleComputedColumns),
                 "data-source": computedDataSource.value,
                 pagination: computedPagination.value,
                 onChange: onTableChange
@@ -1701,12 +2045,19 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
             ], true)
           ]),
           _: 3
-        }, 8, ["component"])
-      ], 6);
+        }, 8, ["component"]),
+        unref(ellipsisTooltipEnabled) ? (openBlock(), createBlock(_sfc_main$2, mergeProps({
+          key: 1,
+          open: unref(ellipsisTooltipOpen),
+          content: unref(ellipsisTooltipContent),
+          "anchor-style": unref(ellipsisTooltipAnchorStyle),
+          container: ellipsisTooltipContainer.value
+        }, ellipsisTooltipProps.value), null, 16, ["open", "content", "anchor-style", "container"])) : createCommentVNode("", true)
+      ], 38);
     };
   }
 });
-const ProTable = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-05315c95"]]);
+const ProTable = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-35945e54"]]);
 function useTable(params) {
   return useTable$1(params);
 }
@@ -1794,7 +2145,7 @@ const index = {
    * ```
    */
   install(app) {
-    app.component(_sfc_main$a.name, _sfc_main$a);
+    app.component(_sfc_main$b.name, _sfc_main$b);
     app.component(ProTable.name, ProTable);
     app.component(
       _sfc_main.name ?? "ProComponentProvider",
@@ -1803,12 +2154,12 @@ const index = {
   }
 };
 export {
-  _sfc_main$f as ContainerFragment,
+  _sfc_main$g as ContainerFragment,
   LOCALE_INJECT_KEY,
   _sfc_main as ProComponentProvider,
-  _sfc_main$a as ProForm,
+  _sfc_main$b as ProForm,
   ProTable,
-  _sfc_main$e as SlotComponent,
+  _sfc_main$f as SlotComponent,
   index as default,
   enUS2 as enUS,
   useFields,