element-ps 2.0.37 → 2.0.39

package/dist/index.full.mjs

@@ -1,4 +1,4 @@
-/*! Element Ps v2.0.23 */
+/*! Element Ps v2.0.38 */
 
 import { getCurrentScope, onScopeDispose, readonly, shallowRef, watchEffect, ref, watch, unref, getCurrentInstance, onMounted, nextTick, defineComponent, openBlock, createElementBlock, createElementVNode, warn, isVNode, Fragment, Comment, camelize as camelize$1, computed, inject, provide, onBeforeUnmount, isRef, onUnmounted, h as h$1, Teleport, onBeforeMount, normalizeClass, normalizeStyle, renderSlot, mergeProps, useSlots, createBlock, Transition, withCtx, withDirectives, resolveDynamicComponent, createCommentVNode, createTextVNode, toDisplayString, createVNode, vShow, useAttrs as useAttrs$1, resolveComponent, createSlots, cloneVNode, Text as Text$1, toRef, reactive, onUpdated, resolveDirective, renderList, normalizeProps, guardReactiveProps, vModelCheckbox, toRefs, vModelRadio, withModifiers, onBeforeUpdate, vModelText, toHandlers, markRaw, triggerRef, toRaw, withKeys, TransitionGroup, createApp } from 'vue';
 
@@ -945,9 +945,9 @@ function cacheHas(cache, key) {
   return cache.has(key);
 }
 
-var COMPARE_PARTIAL_FLAG$3 = 1, COMPARE_UNORDERED_FLAG$1 = 2;
+var COMPARE_PARTIAL_FLAG$5 = 1, COMPARE_UNORDERED_FLAG$3 = 2;
 function equalArrays(array, other, bitmask, customizer, equalFunc, stack) {
-  var isPartial = bitmask & COMPARE_PARTIAL_FLAG$3, arrLength = array.length, othLength = other.length;
+  var isPartial = bitmask & COMPARE_PARTIAL_FLAG$5, arrLength = array.length, othLength = other.length;
   if (arrLength != othLength && !(isPartial && othLength > arrLength)) {
     return false;
   }
@@ -956,7 +956,7 @@ function equalArrays(array, other, bitmask, customizer, equalFunc, stack) {
   if (arrStacked && othStacked) {
     return arrStacked == other && othStacked == array;
   }
-  var index = -1, result = true, seen = bitmask & COMPARE_UNORDERED_FLAG$1 ? new SetCache() : void 0;
+  var index = -1, result = true, seen = bitmask & COMPARE_UNORDERED_FLAG$3 ? new SetCache() : void 0;
   stack.set(array, other);
   stack.set(other, array);
   while (++index < arrLength) {
@@ -1006,7 +1006,7 @@ function setToArray(set) {
   return result;
 }
 
-var COMPARE_PARTIAL_FLAG$2 = 1, COMPARE_UNORDERED_FLAG = 2;
+var COMPARE_PARTIAL_FLAG$4 = 1, COMPARE_UNORDERED_FLAG$2 = 2;
 var boolTag = "[object Boolean]", dateTag = "[object Date]", errorTag = "[object Error]", mapTag = "[object Map]", numberTag = "[object Number]", regexpTag = "[object RegExp]", setTag = "[object Set]", stringTag = "[object String]", symbolTag = "[object Symbol]";
 var arrayBufferTag = "[object ArrayBuffer]", dataViewTag = "[object DataView]";
 var symbolProto = Symbol$2 ? Symbol$2.prototype : void 0, symbolValueOf = symbolProto ? symbolProto.valueOf : void 0;
@@ -1035,7 +1035,7 @@ function equalByTag(object, other, tag, bitmask, customizer, equalFunc, stack) {
     case mapTag:
       var convert = mapToArray;
     case setTag:
-      var isPartial = bitmask & COMPARE_PARTIAL_FLAG$2;
+      var isPartial = bitmask & COMPARE_PARTIAL_FLAG$4;
       convert || (convert = setToArray);
       if (object.size != other.size && !isPartial) {
         return false;
@@ -1044,7 +1044,7 @@ function equalByTag(object, other, tag, bitmask, customizer, equalFunc, stack) {
       if (stacked) {
         return stacked == other;
       }
-      bitmask |= COMPARE_UNORDERED_FLAG;
+      bitmask |= COMPARE_UNORDERED_FLAG$2;
       stack.set(object, other);
       var result = equalArrays(convert(object), convert(other), bitmask, customizer, equalFunc, stack);
       stack["delete"](object);
@@ -1057,11 +1057,11 @@ function equalByTag(object, other, tag, bitmask, customizer, equalFunc, stack) {
   return false;
 }
 
-var COMPARE_PARTIAL_FLAG$1 = 1;
+var COMPARE_PARTIAL_FLAG$3 = 1;
 var objectProto$1 = Object.prototype;
 var hasOwnProperty$2 = objectProto$1.hasOwnProperty;
 function equalObjects(object, other, bitmask, customizer, equalFunc, stack) {
-  var isPartial = bitmask & COMPARE_PARTIAL_FLAG$1, objProps = getAllKeys(object), objLength = objProps.length, othProps = getAllKeys(other), othLength = othProps.length;
+  var isPartial = bitmask & COMPARE_PARTIAL_FLAG$3, objProps = getAllKeys(object), objLength = objProps.length, othProps = getAllKeys(other), othLength = othProps.length;
   if (objLength != othLength && !isPartial) {
     return false;
   }
@@ -1104,7 +1104,7 @@ function equalObjects(object, other, bitmask, customizer, equalFunc, stack) {
   return result;
 }
 
-var COMPARE_PARTIAL_FLAG = 1;
+var COMPARE_PARTIAL_FLAG$2 = 1;
 var argsTag = "[object Arguments]", arrayTag = "[object Array]", objectTag = "[object Object]";
 var objectProto = Object.prototype;
 var hasOwnProperty$1 = objectProto.hasOwnProperty;
@@ -1124,7 +1124,7 @@ function baseIsEqualDeep(object, other, bitmask, customizer, equalFunc, stack) {
     stack || (stack = new Stack());
     return objIsArr || isTypedArray$1(object) ? equalArrays(object, other, bitmask, customizer, equalFunc, stack) : equalByTag(object, other, objTag, bitmask, customizer, equalFunc, stack);
   }
-  if (!(bitmask & COMPARE_PARTIAL_FLAG)) {
+  if (!(bitmask & COMPARE_PARTIAL_FLAG$2)) {
     var objIsWrapped = objIsObj && hasOwnProperty$1.call(object, "__wrapped__"), othIsWrapped = othIsObj && hasOwnProperty$1.call(other, "__wrapped__");
     if (objIsWrapped || othIsWrapped) {
       var objUnwrapped = objIsWrapped ? object.value() : object, othUnwrapped = othIsWrapped ? other.value() : other;
@@ -1149,6 +1149,71 @@ function baseIsEqual(value, other, bitmask, customizer, stack) {
   return baseIsEqualDeep(value, other, bitmask, customizer, baseIsEqual, stack);
 }
 
+var COMPARE_PARTIAL_FLAG$1 = 1, COMPARE_UNORDERED_FLAG$1 = 2;
+function baseIsMatch(object, source, matchData, customizer) {
+  var index = matchData.length, length = index, noCustomizer = !customizer;
+  if (object == null) {
+    return !length;
+  }
+  object = Object(object);
+  while (index--) {
+    var data = matchData[index];
+    if (noCustomizer && data[2] ? data[1] !== object[data[0]] : !(data[0] in object)) {
+      return false;
+    }
+  }
+  while (++index < length) {
+    data = matchData[index];
+    var key = data[0], objValue = object[key], srcValue = data[1];
+    if (noCustomizer && data[2]) {
+      if (objValue === void 0 && !(key in object)) {
+        return false;
+      }
+    } else {
+      var stack = new Stack();
+      if (customizer) {
+        var result = customizer(objValue, srcValue, key, object, source, stack);
+      }
+      if (!(result === void 0 ? baseIsEqual(srcValue, objValue, COMPARE_PARTIAL_FLAG$1 | COMPARE_UNORDERED_FLAG$1, customizer, stack) : result)) {
+        return false;
+      }
+    }
+  }
+  return true;
+}
+
+function isStrictComparable(value) {
+  return value === value && !isObject$2(value);
+}
+
+function getMatchData(object) {
+  var result = keys(object), length = result.length;
+  while (length--) {
+    var key = result[length], value = object[key];
+    result[length] = [key, value, isStrictComparable(value)];
+  }
+  return result;
+}
+
+function matchesStrictComparable(key, srcValue) {
+  return function(object) {
+    if (object == null) {
+      return false;
+    }
+    return object[key] === srcValue && (srcValue !== void 0 || key in Object(object));
+  };
+}
+
+function baseMatches(source) {
+  var matchData = getMatchData(source);
+  if (matchData.length == 1 && matchData[0][2]) {
+    return matchesStrictComparable(matchData[0][0], matchData[0][1]);
+  }
+  return function(object) {
+    return object === source || baseIsMatch(object, source, matchData);
+  };
+}
+
 function baseHasIn(object, key) {
   return object != null && key in Object(object);
 }
@@ -1174,6 +1239,87 @@ function hasIn(object, path) {
   return object != null && hasPath(object, path, baseHasIn);
 }
 
+var COMPARE_PARTIAL_FLAG = 1, COMPARE_UNORDERED_FLAG = 2;
+function baseMatchesProperty(path, srcValue) {
+  if (isKey(path) && isStrictComparable(srcValue)) {
+    return matchesStrictComparable(toKey(path), srcValue);
+  }
+  return function(object) {
+    var objValue = get(object, path);
+    return objValue === void 0 && objValue === srcValue ? hasIn(object, path) : baseIsEqual(srcValue, objValue, COMPARE_PARTIAL_FLAG | COMPARE_UNORDERED_FLAG);
+  };
+}
+
+function baseProperty(key) {
+  return function(object) {
+    return object == null ? void 0 : object[key];
+  };
+}
+
+function basePropertyDeep(path) {
+  return function(object) {
+    return baseGet(object, path);
+  };
+}
+
+function property(path) {
+  return isKey(path) ? baseProperty(toKey(path)) : basePropertyDeep(path);
+}
+
+function baseIteratee(value) {
+  if (typeof value == "function") {
+    return value;
+  }
+  if (value == null) {
+    return identity;
+  }
+  if (typeof value == "object") {
+    return isArray$2(value) ? baseMatchesProperty(value[0], value[1]) : baseMatches(value);
+  }
+  return property(value);
+}
+
+function createBaseFor(fromRight) {
+  return function(object, iteratee, keysFunc) {
+    var index = -1, iterable = Object(object), props = keysFunc(object), length = props.length;
+    while (length--) {
+      var key = props[fromRight ? length : ++index];
+      if (iteratee(iterable[key], key, iterable) === false) {
+        break;
+      }
+    }
+    return object;
+  };
+}
+
+var baseFor = createBaseFor();
+var baseFor$1 = baseFor;
+
+function baseForOwn(object, iteratee) {
+  return object && baseFor$1(object, iteratee, keys);
+}
+
+function createBaseEach(eachFunc, fromRight) {
+  return function(collection, iteratee) {
+    if (collection == null) {
+      return collection;
+    }
+    if (!isArrayLike(collection)) {
+      return eachFunc(collection, iteratee);
+    }
+    var length = collection.length, index = fromRight ? length : -1, iterable = Object(collection);
+    while (fromRight ? index-- : ++index < length) {
+      if (iteratee(iterable[index], index, iterable) === false) {
+        break;
+      }
+    }
+    return collection;
+  };
+}
+
+var baseEach = createBaseEach(baseForOwn);
+var baseEach$1 = baseEach;
+
 var now = function() {
   return root$1.Date.now();
 };
@@ -1277,6 +1423,23 @@ function arrayIncludesWith(array, value, comparator) {
   return false;
 }
 
+function baseMap(collection, iteratee) {
+  var index = -1, result = isArrayLike(collection) ? Array(collection.length) : [];
+  baseEach$1(collection, function(value, key, collection2) {
+    result[++index] = iteratee(value, key, collection2);
+  });
+  return result;
+}
+
+function map(collection, iteratee) {
+  var func = isArray$2(collection) ? arrayMap : baseMap;
+  return func(collection, baseIteratee(iteratee));
+}
+
+function flatMap(collection, iteratee) {
+  return baseFlatten(map(collection, iteratee), 1);
+}
+
 var INFINITY$1 = 1 / 0;
 function flattenDeep(array) {
   var length = array == null ? 0 : array.length;
@@ -4844,7 +5007,7 @@ function useCursor(input) {
   return [recordCursor, setCursor];
 }
 
-const version$1 = "2.0.23";
+const version$1 = "2.0.38";
 
 const INSTALLED_KEY = Symbol("INSTALLED_KEY");
 const makeInstaller = (components = []) => {
@@ -27039,14 +27202,8 @@ function escapeHtml(string) {
 }
 
 const getCell = function(event) {
-  let cell = event.target;
-  while (cell && cell.tagName.toUpperCase() !== "HTML") {
-    if (cell.tagName.toUpperCase() === "TD") {
-      return cell;
-    }
-    cell = cell.parentNode;
-  }
-  return null;
+  var _a;
+  return (_a = event.target) == null ? void 0 : _a.closest("td");
 };
 const isObject = function(obj) {
   return obj !== null && typeof obj === "object";
@@ -27125,6 +27282,8 @@ const getColumnByKey = function(table, columnKey) {
       break;
     }
   }
+  if (!column)
+    throwError("ElTable", `No column matching with column-key: ${columnKey}`);
   return column;
 };
 const getColumnByCell = function(table, cell, namespace) {
@@ -27222,26 +27381,27 @@ function toggleRowStatus(statusArr, row, newVal) {
   let changed = false;
   const index = statusArr.indexOf(row);
   const included = index !== -1;
-  const addRow = () => {
-    statusArr.push(row);
-    changed = true;
-  };
-  const removeRow = () => {
-    statusArr.splice(index, 1);
+  const toggleStatus = (type) => {
+    if (type === "add") {
+      statusArr.push(row);
+    } else {
+      statusArr.splice(index, 1);
+    }
     changed = true;
+    if (isArray(row.children)) {
+      row.children.forEach((item) => {
+        toggleRowStatus(statusArr, item, newVal != null ? newVal : !included);
+      });
+    }
   };
-  if (typeof newVal === "boolean") {
+  if (isBoolean(newVal)) {
     if (newVal && !included) {
-      addRow();
+      toggleStatus("add");
     } else if (!newVal && included) {
-      removeRow();
+      toggleStatus("remove");
     }
   } else {
-    if (included) {
-      removeRow();
-    } else {
-      addRow();
-    }
+    included ? toggleStatus("remove") : toggleStatus("add");
   }
   return changed;
 }
@@ -27272,32 +27432,37 @@ function walkTreeNode(root, cb, childrenKey = "children", lazyKey = "hasChildren
   });
 }
 let removePopper;
-function createTablePopper(trigger, popperContent, popperOptions, tooltipEffect) {
+function createTablePopper(parentNode, trigger, popperContent, popperOptions, tooltipEffect) {
   const { nextZIndex } = useZIndex();
+  const ns = parentNode == null ? void 0 : parentNode.dataset.prefix;
+  const scrollContainer = parentNode == null ? void 0 : parentNode.querySelector(`.${ns}-scrollbar__wrap`);
   function renderContent() {
     const isLight = tooltipEffect === "light";
     const content2 = document.createElement("div");
-    content2.className = `el-popper ${isLight ? "is-light" : "is-dark"}`;
+    content2.className = `${ns}-popper ${isLight ? "is-light" : "is-dark"}`;
     popperContent = escapeHtml_1(popperContent);
     content2.innerHTML = popperContent;
     content2.style.zIndex = String(nextZIndex());
-    document.body.appendChild(content2);
+    parentNode == null ? void 0 : parentNode.appendChild(content2);
     return content2;
   }
   function renderArrow() {
     const arrow2 = document.createElement("div");
-    arrow2.className = "el-popper__arrow";
+    arrow2.className = `${ns}-popper__arrow`;
     return arrow2;
   }
   function showPopper() {
     popperInstance && popperInstance.update();
   }
-  removePopper = function removePopper2() {
+  removePopper == null ? void 0 : removePopper();
+  removePopper = () => {
     try {
       popperInstance && popperInstance.destroy();
-      content && document.body.removeChild(content);
-      off(trigger, "mouseenter", showPopper);
-      off(trigger, "mouseleave", removePopper2);
+      content && (parentNode == null ? void 0 : parentNode.removeChild(content));
+      trigger.removeEventListener("mouseenter", showPopper);
+      trigger.removeEventListener("mouseleave", removePopper);
+      scrollContainer == null ? void 0 : scrollContainer.removeEventListener("scroll", removePopper);
+      removePopper = void 0;
     } catch (e) {
     }
   };
@@ -27306,6 +27471,7 @@ function createTablePopper(trigger, popperContent, popperOptions, tooltipEffect)
   const arrow = renderArrow();
   content.appendChild(arrow);
   popperInstance = yn(trigger, content, {
+    strategy: "absolute",
     modifiers: [
       {
         name: "offset",
@@ -27323,26 +27489,34 @@ function createTablePopper(trigger, popperContent, popperOptions, tooltipEffect)
     ],
     ...popperOptions
   });
-  on$1(trigger, "mouseenter", showPopper);
-  on$1(trigger, "mouseleave", removePopper);
+  trigger.addEventListener("mouseenter", showPopper);
+  trigger.addEventListener("mouseleave", removePopper);
+  scrollContainer == null ? void 0 : scrollContainer.addEventListener("scroll", removePopper);
   return popperInstance;
 }
+function getCurrentColumns(column) {
+  if (column.children) {
+    return flatMap(column.children, getCurrentColumns);
+  } else {
+    return [column];
+  }
+}
+function getColSpan(colSpan, column) {
+  return colSpan + column.colSpan;
+}
 const isFixedColumn = (index, fixed, store, realColumns) => {
   let start = 0;
   let after = index;
+  const columns = store.states.columns.value;
   if (realColumns) {
-    if (realColumns[index].colSpan > 1) {
-      return {};
-    }
-    for (let i = 0; i < index; i++) {
-      start += realColumns[i].colSpan;
-    }
-    after = start + realColumns[index].colSpan - 1;
+    const curColumns = getCurrentColumns(realColumns[index]);
+    const preColumns = columns.slice(0, columns.indexOf(curColumns[0]));
+    start = preColumns.reduce(getColSpan, 0);
+    after = start + curColumns.reduce(getColSpan, 0) - 1;
   } else {
     start = index;
   }
   let fixedLayout;
-  const columns = store.states.columns;
   switch (fixed) {
     case "left":
       if (after < store.states.fixedLeafColumnsLength.value) {
@@ -27350,14 +27524,14 @@ const isFixedColumn = (index, fixed, store, realColumns) => {
       }
       break;
     case "right":
-      if (start >= columns.value.length - store.states.rightFixedLeafColumnsLength.value) {
+      if (start >= columns.length - store.states.rightFixedLeafColumnsLength.value) {
         fixedLayout = "right";
       }
       break;
     default:
       if (after < store.states.fixedLeafColumnsLength.value) {
         fixedLayout = "left";
-      } else if (start >= columns.value.length - store.states.rightFixedLeafColumnsLength.value) {
+      } else if (start >= columns.length - store.states.rightFixedLeafColumnsLength.value) {
         fixedLayout = "right";
       }
   }
@@ -27367,15 +27541,15 @@ const isFixedColumn = (index, fixed, store, realColumns) => {
     after
   } : {};
 };
-const getFixedColumnsClass = (namespace, index, fixed, store, realColumns) => {
+const getFixedColumnsClass = (namespace, index, fixed, store, realColumns, offset = 0) => {
   const classes = [];
-  const { direction, start } = isFixedColumn(index, fixed, store, realColumns);
+  const { direction, start, after } = isFixedColumn(index, fixed, store, realColumns);
   if (direction) {
     const isLeft = direction === "left";
     classes.push(`${namespace}-fixed-column--${direction}`);
-    if (isLeft && start === store.states.fixedLeafColumnsLength.value - 1) {
+    if (isLeft && after + offset === store.states.fixedLeafColumnsLength.value - 1) {
       classes.push("is-last-column");
-    } else if (!isLeft && start === store.states.columns.value.length - store.states.rightFixedLeafColumnsLength.value) {
+    } else if (!isLeft && start - offset === store.states.columns.value.length - store.states.rightFixedLeafColumnsLength.value) {
       classes.push("is-first-column");
     }
   }
@@ -27385,7 +27559,11 @@ function getOffset(offset, column) {
   return offset + (column.realWidth === null || Number.isNaN(column.realWidth) ? Number(column.width) : column.realWidth);
 }
 const getFixedColumnOffset = (index, fixed, store, realColumns) => {
-  const { direction, start = 0 } = isFixedColumn(index, fixed, store, realColumns);
+  const {
+    direction,
+    start = 0,
+    after = 0
+  } = isFixedColumn(index, fixed, store, realColumns);
   if (!direction) {
     return;
   }
@@ -27393,9 +27571,9 @@ const getFixedColumnOffset = (index, fixed, store, realColumns) => {
   const isLeft = direction === "left";
   const columns = store.states.columns.value;
   if (isLeft) {
-    styles.left = columns.slice(0, index).reduce(getOffset, 0);
+    styles.left = columns.slice(0, start).reduce(getOffset, 0);
   } else {
-    styles.right = columns.slice(start + 1).reverse().reduce(getOffset, 0);
+    styles.right = columns.slice(after + 1).reverse().reduce(getOffset, 0);
   }
   return styles;
 };
@@ -27506,19 +27684,21 @@ function useCurrent(watcherData) {
     const rowKey = watcherData.rowKey.value;
     const data = watcherData.data.value || [];
     const oldCurrentRow = currentRow.value;
-    if (!data.includes(oldCurrentRow) && oldCurrentRow) {
-      if (rowKey) {
-        const currentRowKey = getRowIdentity(oldCurrentRow, rowKey);
-        setCurrentRowByKey(currentRowKey);
-      } else {
-        currentRow.value = null;
-      }
-      if (currentRow.value === null) {
-        instance.emit("current-change", null, oldCurrentRow);
+    if (Array.isArray(data)) {
+      if (!data.includes(oldCurrentRow) && oldCurrentRow) {
+        if (rowKey) {
+          const currentRowKey = getRowIdentity(oldCurrentRow, rowKey);
+          setCurrentRowByKey(currentRowKey);
+        } else {
+          currentRow.value = null;
+        }
+        if (currentRow.value === null) {
+          instance.emit("current-change", null, oldCurrentRow);
+        }
+      } else if (_currentRowKey.value) {
+        setCurrentRowByKey(_currentRowKey.value);
+        restoreCurrentRowKey();
       }
-    } else if (_currentRowKey.value) {
-      setCurrentRowByKey(_currentRowKey.value);
-      restoreCurrentRowKey();
     }
   };
   return {
@@ -27767,9 +27947,19 @@ function useWatcher$1() {
   const hoverRow = ref(null);
   const assertRowKey = () => {
     if (!rowKey.value)
-      throw new Error("[PsTable] prop row-key is required");
+      throw new Error("[ElTable] prop row-key is required");
+  };
+  const updateChildFixed = (column) => {
+    var _a2;
+    (_a2 = column.children) == null ? void 0 : _a2.forEach((childColumn) => {
+      childColumn.fixed = column.fixed;
+      updateChildFixed(childColumn);
+    });
   };
   const updateColumns = () => {
+    _columns.value.forEach((column) => {
+      updateChildFixed(column);
+    });
     fixedColumns.value = _columns.value.filter((column) => column.fixed === true || column.fixed === "left");
     rightFixedColumns.value = _columns.value.filter((column) => column.fixed === "right");
     if (fixedColumns.value.length > 0 && _columns.value[0] && _columns.value[0].type === "selection" && !_columns.value[0].fixed) {
@@ -28240,18 +28430,19 @@ function useStore() {
       }
     },
     changeSortCondition(states, options) {
-      const { sortingColumn: column, sortProp: prop, sortOrder: order } = states;
-      if (unref(order) === null) {
+      const { sortingColumn, sortProp, sortOrder } = states;
+      const columnValue = unref(sortingColumn), propValue = unref(sortProp), orderValue = unref(sortOrder);
+      if (orderValue === null) {
         states.sortingColumn.value = null;
         states.sortProp.value = null;
       }
-      const ingore = { filter: true };
-      instance.store.execQuery(ingore);
+      const ignore = { filter: true };
+      instance.store.execQuery(ignore);
       if (!options || !(options.silent || options.init)) {
         instance.emit("sort-change", {
-          column: unref(column),
-          prop: unref(prop),
-          order: unref(order)
+          column: columnValue,
+          prop: propValue,
+          order: orderValue
         });
       }
       instance.store.updateTableScrollY();
@@ -28288,7 +28479,6 @@ function useStore() {
     }
   };
   const updateTableScrollY = function() {
-    nextTick(() => instance.layout.updateScrollY.apply(instance.layout));
   };
   return {
     ns,
@@ -28341,7 +28531,11 @@ function handleValue(value, propsKey, store) {
     storeKey = storeKey.key;
     newVal = newVal || InitialStateMap[propsKey].default;
   }
-  store.states[storeKey].value = newVal;
+  if (propsKey === "data") {
+    store.states[storeKey].value = [{}];
+  } else {
+    store.states[storeKey].value = newVal;
+  }
 }
 function getArrKeysValue(props, keys) {
   if (keys.includes(".")) {
@@ -28370,14 +28564,6 @@ class TableLayout {
     this.bodyWidth = ref(null);
     this.fixedWidth = ref(null);
     this.rightFixedWidth = ref(null);
-    this.tableHeight = ref(null);
-    this.headerHeight = ref(44);
-    this.appendHeight = ref(0);
-    this.footerHeight = ref(44);
-    this.viewportHeight = ref(null);
-    this.bodyHeight = ref(null);
-    this.bodyScrollHeight = ref(0);
-    this.fixedBodyHeight = ref(null);
     this.gutterWidth = 0;
     for (const name in options) {
       if (hasOwn(options, name)) {
@@ -28395,24 +28581,6 @@ class TableLayout {
       throw new Error("Store is required for Table Layout");
     }
   }
-  updateScrollY() {
-    const height = this.height.value;
-    if (height === null)
-      return false;
-    const bodyWrapper = this.table.refs.bodyWrapper;
-    if (this.table.vnode.el && bodyWrapper) {
-      let scrollY = true;
-      const prevScrollY = this.scrollY.value;
-      if (this.bodyHeight.value === null) {
-        scrollY = false;
-      } else {
-        scrollY = bodyWrapper.scrollHeight > this.bodyHeight.value;
-      }
-      this.scrollY.value = scrollY;
-      return prevScrollY !== scrollY;
-    }
-    return false;
-  }
   setHeight(value, prop = "height") {
     if (!isClient)
       return;
@@ -28445,44 +28613,6 @@ class TableLayout {
     return flattenColumns;
   }
   updateElsHeight() {
-    var _a, _b;
-    if (!this.table.$ready)
-      return nextTick(() => this.updateElsHeight());
-    const {
-      tableWrapper,
-      headerWrapper,
-      appendWrapper,
-      footerWrapper,
-      tableHeader,
-      tableBody
-    } = this.table.refs;
-    if (tableWrapper && tableWrapper.style.display === "none") {
-      return;
-    }
-    const { tableLayout } = this.table.props;
-    this.appendHeight.value = appendWrapper ? appendWrapper.offsetHeight : 0;
-    if (this.showHeader && !headerWrapper && tableLayout === "fixed") {
-      return;
-    }
-    const headerTrElm = tableHeader ? tableHeader : null;
-    const noneHeader = this.headerDisplayNone(headerTrElm);
-    const headerWrapperOffsetHeight = (headerWrapper == null ? void 0 : headerWrapper.offsetHeight) || 0;
-    const headerHeight = this.headerHeight.value = !this.showHeader ? 0 : headerWrapperOffsetHeight;
-    if (this.showHeader && !noneHeader && headerWrapperOffsetHeight > 0 && (this.table.store.states.columns.value || []).length > 0 && headerHeight < 2) {
-      return nextTick(() => this.updateElsHeight());
-    }
-    const tableHeight = this.tableHeight.value = (_b = (_a = this.table) == null ? void 0 : _a.vnode.el) == null ? void 0 : _b.clientHeight;
-    const footerHeight = this.footerHeight.value = footerWrapper ? footerWrapper.offsetHeight : 0;
-    if (this.height.value !== null) {
-      if (this.bodyHeight.value === null) {
-        requestAnimationFrame(() => this.updateElsHeight());
-      }
-      this.bodyHeight.value = tableHeight - headerHeight - footerHeight + (footerWrapper ? 1 : 0);
-      this.bodyScrollHeight.value = tableBody == null ? void 0 : tableBody.scrollHeight;
-    }
-    this.fixedBodyHeight.value = this.scrollX.value ? this.bodyHeight.value - this.gutterWidth : this.bodyHeight.value;
-    this.viewportHeight.value = this.scrollX.value ? tableHeight - this.gutterWidth : tableHeight;
-    this.updateScrollY();
     this.notifyObservers("scrollable");
   }
   headerDisplayNone(elm) {
@@ -28710,6 +28840,13 @@ const _sfc_main$o = defineComponent({
       });
       props.store.updateAllSelected();
     };
+    watch(tooltipVisible, (value) => {
+      if (props.column) {
+        props.upDataColumn("filterOpened", value);
+      }
+    }, {
+      immediate: true
+    });
     const popperPaneRef = computed(() => {
       var _a, _b;
       return (_b = (_a = tooltip.value) == null ? void 0 : _a.popperRef) == null ? void 0 : _b.contentRef;
@@ -28902,12 +29039,10 @@ function useEvent(props, emit) {
     }
   };
   const handleMouseMove = (event, column) => {
+    var _a;
     if (column.children && column.children.length > 0)
       return;
-    let target = event.target;
-    while (target && target.tagName !== "TH") {
-      target = target.parentNode;
-    }
+    const target = (_a = event.target) == null ? void 0 : _a.closest("th");
     if (!column || !column.resizable)
       return;
     if (!dragging.value && props.border) {
@@ -28940,13 +29075,11 @@ function useEvent(props, emit) {
     return sortOrders[index > sortOrders.length - 2 ? 0 : index + 1];
   };
   const handleSortClick = (event, column, givenOrder) => {
+    var _a;
     event.stopPropagation();
     const order = column.order === givenOrder ? null : givenOrder || toggleOrder(column);
-    let target = event.target;
-    while (target && target.tagName !== "TH") {
-      target = target.parentNode;
-    }
-    if (target && target.tagName === "TH") {
+    const target = (_a = event.target) == null ? void 0 : _a.closest("th");
+    if (target) {
       if (hasClass(target, "noclick")) {
         removeClass(target, "noclick");
         return;
@@ -29016,13 +29149,13 @@ function useStyle$2(props) {
         column
       });
     }
-    const fixedStyle = column.isSubColumn ? null : getFixedColumnOffset(columnIndex, column.fixed, props.store, row);
+    const fixedStyle = getFixedColumnOffset(columnIndex, column.fixed, props.store, row);
     ensurePosition(fixedStyle, "left");
     ensurePosition(fixedStyle, "right");
     return Object.assign({}, headerCellStyles, fixedStyle);
   };
   const getHeaderCellClass = (rowIndex, columnIndex, row, column) => {
-    const fixedClasses = column.isSubColumn ? [] : getFixedColumnsClass(ns.b(), columnIndex, column.fixed, props.store, row);
+    const fixedClasses = getFixedColumnsClass(ns.b(), columnIndex, column.fixed, props.store, row);
     const classes = [
       column.id,
       column.order,
@@ -29253,8 +29386,7 @@ var TableHeader = defineComponent({
         h$1("div", {
           class: [
             "cell",
-            column.filteredValue && column.filteredValue.length > 0 ? "highlight" : "",
-            column.labelClassName
+            column.filteredValue && column.filteredValue.length > 0 ? "highlight" : ""
           ]
         }, [
           column.renderHeader ? column.renderHeader({
@@ -29323,7 +29455,7 @@ function useEvents(props) {
   const handleMouseLeave = debounce(() => {
     props.store.commit("setHoverRow", null);
   }, 30);
-  const handleCellMouseEnter = (event, row) => {
+  const handleCellMouseEnter = (event, row, tooltipEffect) => {
     var _a;
     const table = parent;
     const cell = getCell(event);
@@ -29345,10 +29477,10 @@ function useEvents(props) {
     const rangeWidth = range.getBoundingClientRect().width;
     const padding = (Number.parseInt(getStyle(cellChild, "paddingLeft"), 10) || 0) + (Number.parseInt(getStyle(cellChild, "paddingRight"), 10) || 0);
     if (rangeWidth + padding > cellChild.offsetWidth || cellChild.scrollWidth > cellChild.offsetWidth) {
-      createTablePopper(cell, cell.innerText || cell.textContent, {
+      createTablePopper(parent == null ? void 0 : parent.refs.tableWrapper, cell, cell.innerText || cell.textContent, {
         placement: "top",
         strategy: "fixed"
-      }, row.tooltipEffect);
+      }, tooltipEffect);
     }
   };
   const handleCellMouseLeave = (event) => {
@@ -29414,13 +29546,13 @@ function useStyles(props) {
         column
       });
     }
-    const fixedStyle = column.isSubColumn ? null : getFixedColumnOffset(columnIndex, props == null ? void 0 : props.fixed, props.store);
+    const fixedStyle = getFixedColumnOffset(columnIndex, props == null ? void 0 : props.fixed, props.store);
     ensurePosition(fixedStyle, "left");
     ensurePosition(fixedStyle, "right");
     return Object.assign({}, cellStyles, fixedStyle);
   };
-  const getCellClass = (rowIndex, columnIndex, row, column) => {
-    const fixedClasses = column.isSubColumn ? [] : getFixedColumnsClass(ns.b(), columnIndex, props == null ? void 0 : props.fixed, props.store);
+  const getCellClass = (rowIndex, columnIndex, row, column, offset) => {
+    const fixedClasses = getFixedColumnsClass(ns.b(), columnIndex, props == null ? void 0 : props.fixed, props.store, void 0, offset);
     const classes = [column.id, column.align, column.className, ...fixedClasses];
     const cellClassName = parent == null ? void 0 : parent.props.cellClassName;
     if (typeof cellClassName === "string") {
@@ -29476,6 +29608,7 @@ function useStyles(props) {
 
 function useRender$1(props) {
   const parent = inject(TABLE_INJECTION_KEY);
+  const ns = useNamespace("table");
   const {
     handleDoubleClick,
     handleClick,
@@ -29511,7 +29644,7 @@ function useRender$1(props) {
     const rowClasses = getRowClass(row, $index);
     let display = true;
     if (treeRowData) {
-      rowClasses.push(`el-table__row--level-${treeRowData.level}`);
+      rowClasses.push(ns.em("row", `level-${treeRowData.level}`));
       display = treeRowData.display;
     }
     const displayStyle = display ? null : {
@@ -29562,7 +29695,7 @@ function useRender$1(props) {
       const tdChildren = cellChildren(cellIndex, column, data);
       return h$1("td", {
         style: getCellStyle($index, cellIndex, row, column),
-        class: getCellClass($index, cellIndex, row, column),
+        class: getCellClass($index, cellIndex, row, column, colspan - 1),
         key: `${patchKey}${baseKey}`,
         rowspan,
         colspan,
@@ -29598,7 +29731,7 @@ function useRender$1(props) {
             }, [
               h$1("td", {
                 colspan: columns.length,
-                class: "el-table__cell el-table__expanded-cell"
+                class: `${ns.e("cell")} ${ns.e("expanded-cell")}`
               }, [renderExpanded({ row, $index, store, expanded })])
             ])
           ]
@@ -29712,10 +29845,6 @@ var TableBody = defineComponent({
       var _a;
       (_a = removePopper) == null ? void 0 : _a();
     });
-    onUpdated(() => {
-      var _a;
-      (_a = removePopper) == null ? void 0 : _a();
-    });
     return {
       ns,
       onColumnsChange,
@@ -29984,7 +30113,8 @@ function useStyle(props, layout, store, table) {
   };
   const resizeState = ref({
     width: null,
-    height: null
+    height: null,
+    headerHeight: null
   });
   const isGroup = ref(false);
   const scrollbarViewStyle = {
@@ -29992,6 +30122,28 @@ function useStyle(props, layout, store, table) {
     verticalAlign: "middle"
   };
   const tableWidth = ref();
+  const tableScrollHeight = ref(0);
+  const bodyScrollHeight = ref(0);
+  const headerScrollHeight = ref(0);
+  const footerScrollHeight = ref(0);
+  watchEffect(() => {
+    layout.setHeight(props.height);
+  });
+  watchEffect(() => {
+    layout.setMaxHeight(props.maxHeight);
+  });
+  watch(() => [props.currentRowKey, store.states.rowKey], ([currentRowKey, rowKey]) => {
+    if (!unref(rowKey) || !unref(currentRowKey))
+      return;
+    store.setCurrentRowKey(`${currentRowKey}`);
+  }, {
+    immediate: true
+  });
+  watchEffect(() => {
+    if (props.expandRowKeys) {
+      store.setExpandRowKeysAdapter(props.expandRowKeys);
+    }
+  });
   const handleMouseLeave = () => {
     table.store.commit("setHoverRow", null);
     if (table.hoverState)
@@ -30016,16 +30168,22 @@ function useStyle(props, layout, store, table) {
       layout.updateElsHeight();
     }
     layout.updateColumnsWidth();
-    requestAnimationFrame(syncPostion);
+    requestAnimationFrame(syncPosition);
   };
   onMounted(async () => {
     await nextTick();
     store.updateColumns();
     bindEvents();
     requestAnimationFrame(doLayout);
+    const el = table.vnode.el;
+    const tableHeader = table.refs.headerWrapper;
+    if (props.flexible && el && el.parentElement) {
+      el.parentElement.style.minWidth = "0";
+    }
     resizeState.value = {
-      width: tableWidth.value = table.vnode.el.offsetWidth,
-      height: table.vnode.el.offsetHeight
+      width: tableWidth.value = el.offsetWidth,
+      height: el.offsetHeight,
+      headerHeight: props.showHeader && tableHeader ? tableHeader.offsetHeight : null
     };
     store.states.columns.value.forEach((column) => {
       if (column.filteredValue && column.filteredValue.length) {
@@ -30053,7 +30211,7 @@ function useStyle(props, layout, store, table) {
     const { tableWrapper } = table.refs;
     return !!(tableWrapper && tableWrapper.classList.contains(className));
   };
-  const syncPostion = function() {
+  const syncPosition = function() {
     if (!table.refs.scrollBarRef)
       return;
     if (!layout.scrollX.value) {
@@ -30063,7 +30221,7 @@ function useStyle(props, layout, store, table) {
       }
       return;
     }
-    const scrollContainer = table.refs.scrollBarRef.wrap$;
+    const scrollContainer = table.refs.scrollBarRef.wrapRef;
     if (!scrollContainer)
       return;
     const { scrollLeft, offsetWidth, scrollWidth } = scrollContainer;
@@ -30082,48 +30240,56 @@ function useStyle(props, layout, store, table) {
     }
   };
   const bindEvents = () => {
-    var _a;
     if (!table.refs.scrollBarRef)
       return;
-    (_a = table.refs.scrollBarRef.wrap$) == null ? void 0 : _a.addEventListener("scroll", syncPostion, {
-      passive: true
-    });
-    if (props.fit) {
-      addResizeListener(table.vnode.el, resizeListener);
-    } else {
-      on$1(window, "resize", doLayout);
+    if (table.refs.scrollBarRef.wrapRef) {
+      useEventListener(table.refs.scrollBarRef.wrapRef, "scroll", syncPosition, {
+        passive: true
+      });
     }
-  };
-  onBeforeUnmount(() => {
-    unbindEvents();
-  });
-  const unbindEvents = () => {
-    var _a;
-    (_a = table.refs.scrollBarRef.wrap$) == null ? void 0 : _a.removeEventListener("scroll", syncPostion, true);
     if (props.fit) {
-      removeResizeListener(table.vnode.el, resizeListener);
+      useResizeObserver(table.vnode.el, resizeListener);
     } else {
-      off(window, "resize", doLayout);
+      useEventListener(window, "resize", resizeListener);
     }
+    useResizeObserver(table.refs.bodyWrapper, () => {
+      var _a, _b;
+      resizeListener();
+      (_b = (_a = table.refs) == null ? void 0 : _a.scrollBarRef) == null ? void 0 : _b.update();
+    });
   };
   const resizeListener = () => {
-    if (!table.$ready)
+    var _a, _b, _c;
+    const el = table.vnode.el;
+    if (!table.$ready || !el)
       return;
     let shouldUpdateLayout = false;
-    const el = table.vnode.el;
-    const { width: oldWidth, height: oldHeight } = resizeState.value;
+    const {
+      width: oldWidth,
+      height: oldHeight,
+      headerHeight: oldHeaderHeight
+    } = resizeState.value;
     const width = tableWidth.value = el.offsetWidth;
     if (oldWidth !== width) {
       shouldUpdateLayout = true;
     }
-    const height2 = el.offsetHeight;
-    if ((props.height || shouldUpdateHeight.value) && oldHeight !== height2) {
+    const height = el.offsetHeight;
+    if ((props.height || shouldUpdateHeight.value) && oldHeight !== height) {
       shouldUpdateLayout = true;
     }
+    const tableHeader = props.tableLayout === "fixed" ? table.refs.headerWrapper : (_a = table.refs.tableHeaderRef) == null ? void 0 : _a.$el;
+    if (props.showHeader && (tableHeader == null ? void 0 : tableHeader.offsetHeight) !== oldHeaderHeight) {
+      shouldUpdateLayout = true;
+    }
+    tableScrollHeight.value = ((_b = table.refs.tableWrapper) == null ? void 0 : _b.scrollHeight) || 0;
+    headerScrollHeight.value = (tableHeader == null ? void 0 : tableHeader.scrollHeight) || 0;
+    footerScrollHeight.value = ((_c = table.refs.footerWrapper) == null ? void 0 : _c.offsetHeight) || 0;
+    bodyScrollHeight.value = tableScrollHeight.value - headerScrollHeight.value - footerScrollHeight.value;
     if (shouldUpdateLayout) {
       resizeState.value = {
         width,
-        height: height2
+        height,
+        headerHeight: props.showHeader && (tableHeader == null ? void 0 : tableHeader.offsetHeight) || 0
       };
       doLayout();
     }
@@ -30138,57 +30304,55 @@ function useStyle(props, layout, store, table) {
       return "fixed";
     return props.tableLayout;
   });
-  function calcMaxHeight(maxHeight, footerHeight, headerHeight) {
-    const parsedMaxHeight = parseHeight(maxHeight);
-    const tableHeaderHeight = props.showHeader ? headerHeight : 0;
-    if (parsedMaxHeight === null)
-      return;
-    if (isString(parsedMaxHeight)) {
-      return `calc(${parsedMaxHeight} - ${footerHeight}px - ${tableHeaderHeight}px)`;
+  const emptyBlockStyle = computed(() => {
+    if (props.data && props.data.length)
+      return null;
+    let height = "100%";
+    if (props.height && bodyScrollHeight.value) {
+      height = `${bodyScrollHeight.value}px`;
     }
-    return parsedMaxHeight - footerHeight - tableHeaderHeight;
-  }
-  const height = computed(() => {
-    const headerHeight = layout.headerHeight.value || 0;
-    const bodyHeight2 = layout.bodyHeight.value;
-    const footerHeight = layout.footerHeight.value || 0;
+    const width = tableWidth.value;
+    return {
+      width: width ? `${width}px` : "",
+      height
+    };
+  });
+  const tableInnerStyle = computed(() => {
     if (props.height) {
-      return bodyHeight2 ? bodyHeight2 : void 0;
-    } else if (props.maxHeight) {
-      return calcMaxHeight(props.maxHeight, footerHeight, headerHeight);
+      return {
+        height: !Number.isNaN(Number(props.height)) ? `${props.height}px` : props.height
+      };
     }
-    return void 0;
+    if (props.maxHeight) {
+      return {
+        maxHeight: !Number.isNaN(Number(props.maxHeight)) ? `${props.maxHeight}px` : props.maxHeight
+      };
+    }
+    return {};
   });
-  const bodyHeight = computed(() => {
-    const headerHeight = layout.headerHeight.value || 0;
-    const bodyHeight2 = layout.bodyHeight.value;
-    const footerHeight = layout.footerHeight.value || 0;
+  const scrollbarStyle = computed(() => {
     if (props.height) {
       return {
-        height: bodyHeight2 ? `${bodyHeight2}px` : ""
+        height: "100%"
       };
-    } else if (props.maxHeight) {
-      const maxHeight = calcMaxHeight(props.maxHeight, footerHeight, headerHeight);
-      if (maxHeight !== null) {
+    }
+    if (props.maxHeight) {
+      if (!Number.isNaN(Number(props.maxHeight))) {
+        const maxHeight = props.maxHeight;
+        const reachMaxHeight = tableScrollHeight.value >= Number(maxHeight);
+        if (reachMaxHeight) {
+          return {
+            maxHeight: `${tableScrollHeight.value - headerScrollHeight.value - footerScrollHeight.value}px`
+          };
+        }
+      } else {
         return {
-          "max-height": `${maxHeight}${isNumber(maxHeight) ? "px" : ""}`
+          maxHeight: `calc(${props.maxHeight} - ${headerScrollHeight.value + footerScrollHeight.value}px)`
         };
       }
     }
     return {};
   });
-  const emptyBlockStyle = computed(() => {
-    if (props.data && props.data.length)
-      return null;
-    let height2 = "100%";
-    if (layout.appendHeight.value) {
-      height2 = `calc(100% - ${layout.appendHeight.value}px)`;
-    }
-    return {
-      width: tableWidth.value ? `${tableWidth.value}px` : "",
-      height: height2
-    };
-  });
   const handleFixedMousewheel = (event, data) => {
     const bodyWrapper = table.refs.bodyWrapper;
     if (Math.abs(data.spinY) > 0) {
@@ -30204,47 +30368,6 @@ function useStyle(props, layout, store, table) {
       bodyWrapper.scrollLeft += Math.ceil(data.pixelX / 5);
     }
   };
-  const fixedHeight = computed(() => {
-    if (props.maxHeight) {
-      if (props.showSummary) {
-        return {
-          bottom: 0
-        };
-      }
-      return {
-        bottom: layout.scrollX.value && props.data.length ? `${layout.gutterWidth}px` : ""
-      };
-    } else {
-      if (props.showSummary) {
-        return {
-          height: layout.tableHeight.value ? `${layout.tableHeight.value}px` : ""
-        };
-      }
-      return {
-        height: layout.viewportHeight.value ? `${layout.viewportHeight.value}px` : ""
-      };
-    }
-  });
-  const fixedBodyHeight = computed(() => {
-    if (props.height) {
-      return {
-        height: layout.fixedBodyHeight.value ? `${layout.fixedBodyHeight.value}px` : ""
-      };
-    } else if (props.maxHeight) {
-      let maxHeight = parseHeight(props.maxHeight);
-      if (typeof maxHeight === "number") {
-        maxHeight = layout.scrollX.value ? maxHeight - layout.gutterWidth : maxHeight;
-        if (props.showHeader) {
-          maxHeight -= layout.headerHeight.value;
-        }
-        maxHeight -= layout.footerHeight.value;
-        return {
-          "max-height": `${maxHeight}px`
-        };
-      }
-    }
-    return {};
-  });
   return {
     isHidden,
     renderExpanded,
@@ -30253,28 +30376,24 @@ function useStyle(props, layout, store, table) {
     handleMouseLeave,
     handleHeaderFooterMousewheel,
     tableSize,
-    bodyHeight,
-    height,
     emptyBlockStyle,
     handleFixedMousewheel,
-    fixedHeight,
-    fixedBodyHeight,
     resizeProxyVisible,
     bodyWidth,
     resizeState,
     doLayout,
     tableBodyStyles,
     tableLayout,
-    scrollbarViewStyle
+    scrollbarViewStyle,
+    tableInnerStyle,
+    scrollbarStyle
   };
 }
 
 var defaultProps$1 = {
   data: {
     type: Array,
-    default: () => {
-      return [];
-    }
+    default: () => []
   },
   size: String,
   width: [String, Number],
@@ -30344,7 +30463,8 @@ var defaultProps$1 = {
   scrollbarAlwaysOn: {
     type: Boolean,
     default: false
-  }
+  },
+  flexible: Boolean
 };
 
 const useScrollbar = () => {
@@ -30439,23 +30559,21 @@ const _sfc_main$n = defineComponent({
       handleMouseLeave,
       handleHeaderFooterMousewheel,
       tableSize,
-      bodyHeight,
-      height,
       emptyBlockStyle,
       handleFixedMousewheel,
-      fixedHeight,
-      fixedBodyHeight,
       resizeProxyVisible,
       bodyWidth,
       resizeState,
       doLayout,
       tableBodyStyles,
       tableLayout,
-      scrollbarViewStyle
+      scrollbarViewStyle,
+      tableInnerStyle,
+      scrollbarStyle
     } = useStyle(props, layout, store, table);
     const { scrollBarRef, scrollTo, setScrollLeft, setScrollTop } = useScrollbar();
     const debouncedUpdateLayout = debounce(doLayout, 50);
-    const tableId = `el-table_${tableIdSeed++}`;
+    const tableId = `${ns.namespace.value}-table_${tableIdSeed++}`;
     table.tableId = tableId;
     table.state = {
       isGroup,
@@ -30482,14 +30600,10 @@ const _sfc_main$n = defineComponent({
       resizeState,
       isGroup,
       bodyWidth,
-      bodyHeight,
-      height,
       tableBodyStyles,
       emptyBlockStyle,
       debouncedUpdateLayout,
       handleFixedMousewheel,
-      fixedHeight,
-      fixedBodyHeight,
       setCurrentRow,
       getSelectionRows,
       toggleRowSelection,
@@ -30507,6 +30621,8 @@ const _sfc_main$n = defineComponent({
       computedEmptyText,
       tableLayout,
       scrollbarViewStyle,
+      tableInnerStyle,
+      scrollbarStyle,
       scrollBarRef,
       scrollTo,
       setScrollLeft,
@@ -30551,7 +30667,8 @@ function _sfc_render$a(_ctx, _cache, $props, $setup, $data, $options) {
     "data-prefix": _ctx.ns.namespace.value
   }, [
     createElementVNode("div", {
-      class: normalizeClass(_ctx.ns.e("inner-wrapper"))
+      class: normalizeClass(_ctx.ns.e("inner-wrapper")),
+      style: normalizeStyle(_ctx.tableInnerStyle)
     }, [
       createElementVNode("div", _hoisted_2$2, [
         renderSlot(_ctx.$slots, "default")
@@ -30585,14 +30702,12 @@ function _sfc_render$a(_ctx, _cache, $props, $setup, $data, $options) {
       ]) : createCommentVNode("v-if", true),
       createElementVNode("div", {
         ref: "bodyWrapper",
-        style: normalizeStyle(_ctx.bodyHeight),
         class: normalizeClass(_ctx.ns.e("body-wrapper"))
       }, [
         createVNode(_component_ps_scrollbar, {
           ref: "scrollBarRef",
-          height: _ctx.maxHeight ? void 0 : _ctx.height,
-          "max-height": _ctx.maxHeight ? _ctx.height : void 0,
           "view-style": _ctx.scrollbarViewStyle,
+          "wrap-style": _ctx.scrollbarStyle,
           always: _ctx.scrollbarAlwaysOn
         }, {
           default: withCtx(() => [
@@ -30613,6 +30728,7 @@ function _sfc_render$a(_ctx, _cache, $props, $setup, $data, $options) {
               }, null, 8, ["columns", "table-layout"]),
               _ctx.showHeader && _ctx.tableLayout === "auto" ? (openBlock(), createBlock(_component_table_header, {
                 key: 0,
+                ref: "tableHeaderRef",
                 border: _ctx.border,
                 "default-sort": _ctx.defaultSort,
                 store: _ctx.store
@@ -30650,30 +30766,30 @@ function _sfc_render$a(_ctx, _cache, $props, $setup, $data, $options) {
             ], 2)) : createCommentVNode("v-if", true)
           ]),
           _: 3
-        }, 8, ["height", "max-height", "view-style", "always"])
-      ], 6),
-      _ctx.border || _ctx.isGroup ? (openBlock(), createElementBlock("div", {
+        }, 8, ["view-style", "wrap-style", "always"])
+      ], 2),
+      _ctx.showSummary ? withDirectives((openBlock(), createElementBlock("div", {
         key: 1,
+        ref: "footerWrapper",
+        class: normalizeClass(_ctx.ns.e("footer-wrapper"))
+      }, [
+        createVNode(_component_table_footer, {
+          border: _ctx.border,
+          "default-sort": _ctx.defaultSort,
+          store: _ctx.store,
+          style: normalizeStyle(_ctx.tableBodyStyles),
+          "sum-text": _ctx.computedSumText,
+          "summary-method": _ctx.summaryMethod
+        }, null, 8, ["border", "default-sort", "store", "style", "sum-text", "summary-method"])
+      ], 2)), [
+        [vShow, !_ctx.isEmpty],
+        [_directive_mousewheel, _ctx.handleHeaderFooterMousewheel]
+      ]) : createCommentVNode("v-if", true),
+      _ctx.border || _ctx.isGroup ? (openBlock(), createElementBlock("div", {
+        key: 2,
         class: normalizeClass(_ctx.ns.e("border-left-patch"))
       }, null, 2)) : createCommentVNode("v-if", true)
-    ], 2),
-    _ctx.showSummary ? withDirectives((openBlock(), createElementBlock("div", {
-      key: 0,
-      ref: "footerWrapper",
-      class: normalizeClass(_ctx.ns.e("footer-wrapper"))
-    }, [
-      createVNode(_component_table_footer, {
-        border: _ctx.border,
-        "default-sort": _ctx.defaultSort,
-        store: _ctx.store,
-        style: normalizeStyle(_ctx.tableBodyStyles),
-        "sum-text": _ctx.computedSumText,
-        "summary-method": _ctx.summaryMethod
-      }, null, 8, ["border", "default-sort", "store", "style", "sum-text", "summary-method"])
-    ], 2)), [
-      [vShow, !_ctx.isEmpty],
-      [_directive_mousewheel, _ctx.handleHeaderFooterMousewheel]
-    ]) : createCommentVNode("v-if", true),
+    ], 6),
     withDirectives(createElementVNode("div", {
       ref: "resizeProxy",
       class: normalizeClass(_ctx.ns.e("column-resize-proxy"))
@@ -30835,6 +30951,9 @@ function treeCellPrefix({
   const ele = [];
   const callback = function(e) {
     e.stopPropagation();
+    if (treeNode.loading) {
+      return;
+    }
     store.loadOrToggle(row);
   };
   if (treeNode.indent) {
@@ -30969,6 +31088,9 @@ function useRender(props, slots, owner) {
     if (realMinWidth.value) {
       column.minWidth = realMinWidth.value;
     }
+    if (!realWidth.value && realMinWidth.value) {
+      column.width = void 0;
+    }
     if (!column.minWidth) {
       column.minWidth = 80;
     }
@@ -31013,7 +31135,6 @@ function useRender(props, slots, owner) {
       };
     }
     let originRenderCell = column.renderCell;
-    const hasTreeColumnValue = hasTreeColumn.value;
     if (column.type === "expand") {
       column.renderCell = (data) => h$1("div", {
         class: "cell"
@@ -31031,7 +31152,7 @@ function useRender(props, slots, owner) {
         } else {
           children = originRenderCell(data);
         }
-        const shouldCreatePlaceholder = hasTreeColumnValue && data.cellIndex === 0;
+        const shouldCreatePlaceholder = hasTreeColumn.value && data.cellIndex === 0 && data.column.type !== "selection";
         const prefix = treeCellPrefix(data, shouldCreatePlaceholder);
         const props2 = {
           class: "cell",