@element-plus/nightly 0.0.20220722 → 0.0.20220726

package/dist/index.full.js

@@ -1,4 +1,4 @@
-/*! Element Plus v0.0.20220722 */
+/*! Element Plus v0.0.20220726 */
 
 (function (global, factory) {
   typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('vue')) :
@@ -6878,16 +6878,6 @@
     !isLeaf(el) && el.click();
   };
 
-  const on$1 = (element, event, handler, useCapture = false) => {
-    if (element && event && handler) {
-      element == null ? void 0 : element.addEventListener(event, handler, useCapture);
-    }
-  };
-  const off = (element, event, handler, useCapture = false) => {
-    if (element && event && handler) {
-      element == null ? void 0 : element.removeEventListener(event, handler, useCapture);
-    }
-  };
   const composeEventHandlers = (theirsHandler, oursHandler, { checkForDefaultPrevented = true } = {}) => {
     const handleEvent = (event) => {
       const shouldPrevent = theirsHandler == null ? void 0 : theirsHandler(event);
@@ -7555,14 +7545,14 @@
     return parent;
   };
   let scrollBarWidth;
-  const getScrollBarWidth = () => {
+  const getScrollBarWidth = (namespace) => {
     var _a;
     if (!isClient)
       return 0;
     if (scrollBarWidth !== void 0)
       return scrollBarWidth;
     const outer = document.createElement("div");
-    outer.className = "el-scrollbar__wrap";
+    outer.className = `${namespace}-scrollbar__wrap`;
     outer.style.visibility = "hidden";
     outer.style.width = "100px";
     outer.style.position = "absolute";
@@ -9087,11 +9077,285 @@
     return buildLocaleContext(vue.computed(() => locale.value || English));
   };
 
+  let activeEffectScope;
+  function recordEffectScope(effect2, scope = activeEffectScope) {
+    if (scope && scope.active) {
+      scope.effects.push(effect2);
+    }
+  }
+  const createDep = (effects) => {
+    const dep = new Set(effects);
+    dep.w = 0;
+    dep.n = 0;
+    return dep;
+  };
+  const wasTracked = (dep) => (dep.w & trackOpBit) > 0;
+  const newTracked = (dep) => (dep.n & trackOpBit) > 0;
+  const initDepMarkers = ({ deps }) => {
+    if (deps.length) {
+      for (let i = 0; i < deps.length; i++) {
+        deps[i].w |= trackOpBit;
+      }
+    }
+  };
+  const finalizeDepMarkers = (effect2) => {
+    const { deps } = effect2;
+    if (deps.length) {
+      let ptr = 0;
+      for (let i = 0; i < deps.length; i++) {
+        const dep = deps[i];
+        if (wasTracked(dep) && !newTracked(dep)) {
+          dep.delete(effect2);
+        } else {
+          deps[ptr++] = dep;
+        }
+        dep.w &= ~trackOpBit;
+        dep.n &= ~trackOpBit;
+      }
+      deps.length = ptr;
+    }
+  };
+  let effectTrackDepth = 0;
+  let trackOpBit = 1;
+  const maxMarkerBits = 30;
+  let activeEffect;
+  class ReactiveEffect {
+    constructor(fn, scheduler2 = null, scope) {
+      this.fn = fn;
+      this.scheduler = scheduler2;
+      this.active = true;
+      this.deps = [];
+      this.parent = void 0;
+      recordEffectScope(this, scope);
+    }
+    run() {
+      if (!this.active) {
+        return this.fn();
+      }
+      let parent = activeEffect;
+      let lastShouldTrack = shouldTrack;
+      while (parent) {
+        if (parent === this) {
+          return;
+        }
+        parent = parent.parent;
+      }
+      try {
+        this.parent = activeEffect;
+        activeEffect = this;
+        shouldTrack = true;
+        trackOpBit = 1 << ++effectTrackDepth;
+        if (effectTrackDepth <= maxMarkerBits) {
+          initDepMarkers(this);
+        } else {
+          cleanupEffect(this);
+        }
+        return this.fn();
+      } finally {
+        if (effectTrackDepth <= maxMarkerBits) {
+          finalizeDepMarkers(this);
+        }
+        trackOpBit = 1 << --effectTrackDepth;
+        activeEffect = this.parent;
+        shouldTrack = lastShouldTrack;
+        this.parent = void 0;
+        if (this.deferStop) {
+          this.stop();
+        }
+      }
+    }
+    stop() {
+      if (activeEffect === this) {
+        this.deferStop = true;
+      } else if (this.active) {
+        cleanupEffect(this);
+        if (this.onStop) {
+          this.onStop();
+        }
+        this.active = false;
+      }
+    }
+  }
+  function cleanupEffect(effect2) {
+    const { deps } = effect2;
+    if (deps.length) {
+      for (let i = 0; i < deps.length; i++) {
+        deps[i].delete(effect2);
+      }
+      deps.length = 0;
+    }
+  }
+  let shouldTrack = true;
+  function trackEffects(dep, debuggerEventExtraInfo) {
+    let shouldTrack2 = false;
+    if (effectTrackDepth <= maxMarkerBits) {
+      if (!newTracked(dep)) {
+        dep.n |= trackOpBit;
+        shouldTrack2 = !wasTracked(dep);
+      }
+    } else {
+      shouldTrack2 = !dep.has(activeEffect);
+    }
+    if (shouldTrack2) {
+      dep.add(activeEffect);
+      activeEffect.deps.push(dep);
+    }
+  }
+  function triggerEffects(dep, debuggerEventExtraInfo) {
+    const effects = isArray(dep) ? dep : [...dep];
+    for (const effect2 of effects) {
+      if (effect2.computed) {
+        triggerEffect(effect2);
+      }
+    }
+    for (const effect2 of effects) {
+      if (!effect2.computed) {
+        triggerEffect(effect2);
+      }
+    }
+  }
+  function triggerEffect(effect2, debuggerEventExtraInfo) {
+    if (effect2 !== activeEffect || effect2.allowRecurse) {
+      if (effect2.scheduler) {
+        effect2.scheduler();
+      } else {
+        effect2.run();
+      }
+    }
+  }
+  function toRaw(observed) {
+    const raw = observed && observed["__v_raw"];
+    return raw ? toRaw(raw) : observed;
+  }
+  function trackRefValue(ref2) {
+    if (shouldTrack && activeEffect) {
+      ref2 = toRaw(ref2);
+      {
+        trackEffects(ref2.dep || (ref2.dep = createDep()));
+      }
+    }
+  }
+  function triggerRefValue(ref2, newVal) {
+    ref2 = toRaw(ref2);
+    if (ref2.dep) {
+      {
+        triggerEffects(ref2.dep);
+      }
+    }
+  }
+  class ComputedRefImpl {
+    constructor(getter, _setter, isReadonly2, isSSR) {
+      this._setter = _setter;
+      this.dep = void 0;
+      this.__v_isRef = true;
+      this._dirty = true;
+      this.effect = new ReactiveEffect(getter, () => {
+        if (!this._dirty) {
+          this._dirty = true;
+          triggerRefValue(this);
+        }
+      });
+      this.effect.computed = this;
+      this.effect.active = this._cacheable = !isSSR;
+      this["__v_isReadonly"] = isReadonly2;
+    }
+    get value() {
+      const self = toRaw(this);
+      trackRefValue(self);
+      if (self._dirty || !self._cacheable) {
+        self._dirty = false;
+        self._value = self.effect.run();
+      }
+      return self._value;
+    }
+    set value(newValue) {
+      this._setter(newValue);
+    }
+  }
+  function computed(getterOrOptions, debugOptions, isSSR = false) {
+    let getter;
+    let setter;
+    const onlyGetter = isFunction(getterOrOptions);
+    if (onlyGetter) {
+      getter = getterOrOptions;
+      setter = NOOP;
+    } else {
+      getter = getterOrOptions.get;
+      setter = getterOrOptions.set;
+    }
+    const cRef = new ComputedRefImpl(getter, setter, onlyGetter || !setter, isSSR);
+    return cRef;
+  }
+
+  const defaultNamespace = "el";
+  const statePrefix = "is-";
+  const _bem = (namespace, block, blockSuffix, element, modifier) => {
+    let cls = `${namespace}-${block}`;
+    if (blockSuffix) {
+      cls += `-${blockSuffix}`;
+    }
+    if (element) {
+      cls += `__${element}`;
+    }
+    if (modifier) {
+      cls += `--${modifier}`;
+    }
+    return cls;
+  };
+  const useNamespace = (block) => {
+    const globalConfig = useGlobalConfig("namespace");
+    const namespace = vue.computed(() => globalConfig.value || defaultNamespace);
+    const b = (blockSuffix = "") => _bem(vue.unref(namespace), block, blockSuffix, "", "");
+    const e = (element) => element ? _bem(vue.unref(namespace), block, "", element, "") : "";
+    const m = (modifier) => modifier ? _bem(vue.unref(namespace), block, "", "", modifier) : "";
+    const be = (blockSuffix, element) => blockSuffix && element ? _bem(vue.unref(namespace), block, blockSuffix, element, "") : "";
+    const em = (element, modifier) => element && modifier ? _bem(vue.unref(namespace), block, "", element, modifier) : "";
+    const bm = (blockSuffix, modifier) => blockSuffix && modifier ? _bem(vue.unref(namespace), block, blockSuffix, "", modifier) : "";
+    const bem = (blockSuffix, element, modifier) => blockSuffix && element && modifier ? _bem(vue.unref(namespace), block, blockSuffix, element, modifier) : "";
+    const is = (name, ...args) => {
+      const state = args.length >= 1 ? args[0] : true;
+      return name && state ? `${statePrefix}${name}` : "";
+    };
+    const cssVar = (object) => {
+      const styles = {};
+      for (const key in object) {
+        styles[`--${namespace.value}-${key}`] = object[key];
+      }
+      return styles;
+    };
+    const cssVarBlock = (object) => {
+      const styles = {};
+      for (const key in object) {
+        styles[`--${namespace.value}-${block}-${key}`] = object[key];
+      }
+      return styles;
+    };
+    const cssVarName = (name) => `--${namespace.value}-${name}`;
+    const cssVarBlockName = (name) => `--${namespace.value}-${block}-${name}`;
+    return {
+      namespace,
+      b,
+      e,
+      m,
+      be,
+      em,
+      bm,
+      bem,
+      is,
+      cssVar,
+      cssVarName,
+      cssVarBlock,
+      cssVarBlockName
+    };
+  };
+
   const useLockscreen = (trigger) => {
     if (!vue.isRef(trigger)) {
       throwError("[useLockscreen]", "You need to pass a ref param to this function");
     }
-    if (!isClient || hasClass(document.body, "el-popup-parent--hidden")) {
+    const ns = useNamespace("popup");
+    const hiddenCls = computed(() => ns.bm("parent", "hidden"));
+    if (!isClient || hasClass(document.body, hiddenCls.value)) {
       return;
     }
     let scrollBarWidth = 0;
@@ -9099,7 +9363,7 @@
     let bodyPaddingRight = "0";
     let computedBodyPaddingRight = 0;
     const cleanup = () => {
-      removeClass(document.body, "el-popup-parent--hidden");
+      removeClass(document.body, hiddenCls.value);
       if (withoutHiddenClass) {
         document.body.style.paddingRight = bodyPaddingRight;
       }
@@ -9109,18 +9373,18 @@
         cleanup();
         return;
       }
-      withoutHiddenClass = !hasClass(document.body, "el-popup-parent--hidden");
+      withoutHiddenClass = !hasClass(document.body, hiddenCls.value);
       if (withoutHiddenClass) {
         bodyPaddingRight = document.body.style.paddingRight;
         computedBodyPaddingRight = Number.parseInt(getStyle(document.body, "paddingRight"), 10);
       }
-      scrollBarWidth = getScrollBarWidth();
+      scrollBarWidth = getScrollBarWidth(ns.namespace.value);
       const bodyHasOverflow = document.documentElement.clientHeight < document.body.scrollHeight;
       const bodyOverflowY = getStyle(document.body, "overflowY");
       if (scrollBarWidth > 0 && (bodyHasOverflow || bodyOverflowY === "scroll") && withoutHiddenClass) {
         document.body.style.paddingRight = `${computedBodyPaddingRight + scrollBarWidth}px`;
       }
-      addClass(document.body, "el-popup-parent--hidden");
+      addClass(document.body, hiddenCls.value);
     });
     vue.onScopeDispose(() => cleanup());
   };
@@ -9596,68 +9860,6 @@
     };
   };
 
-  const defaultNamespace = "el";
-  const statePrefix = "is-";
-  const _bem = (namespace, block, blockSuffix, element, modifier) => {
-    let cls = `${namespace}-${block}`;
-    if (blockSuffix) {
-      cls += `-${blockSuffix}`;
-    }
-    if (element) {
-      cls += `__${element}`;
-    }
-    if (modifier) {
-      cls += `--${modifier}`;
-    }
-    return cls;
-  };
-  const useNamespace = (block) => {
-    const globalConfig = useGlobalConfig("namespace");
-    const namespace = vue.computed(() => globalConfig.value || defaultNamespace);
-    const b = (blockSuffix = "") => _bem(vue.unref(namespace), block, blockSuffix, "", "");
-    const e = (element) => element ? _bem(vue.unref(namespace), block, "", element, "") : "";
-    const m = (modifier) => modifier ? _bem(vue.unref(namespace), block, "", "", modifier) : "";
-    const be = (blockSuffix, element) => blockSuffix && element ? _bem(vue.unref(namespace), block, blockSuffix, element, "") : "";
-    const em = (element, modifier) => element && modifier ? _bem(vue.unref(namespace), block, "", element, modifier) : "";
-    const bm = (blockSuffix, modifier) => blockSuffix && modifier ? _bem(vue.unref(namespace), block, blockSuffix, "", modifier) : "";
-    const bem = (blockSuffix, element, modifier) => blockSuffix && element && modifier ? _bem(vue.unref(namespace), block, blockSuffix, element, modifier) : "";
-    const is = (name, ...args) => {
-      const state = args.length >= 1 ? args[0] : true;
-      return name && state ? `${statePrefix}${name}` : "";
-    };
-    const cssVar = (object) => {
-      const styles = {};
-      for (const key in object) {
-        styles[`--${namespace.value}-${key}`] = object[key];
-      }
-      return styles;
-    };
-    const cssVarBlock = (object) => {
-      const styles = {};
-      for (const key in object) {
-        styles[`--${namespace.value}-${block}-${key}`] = object[key];
-      }
-      return styles;
-    };
-    const cssVarName = (name) => `--${namespace.value}-${name}`;
-    const cssVarBlockName = (name) => `--${namespace.value}-${block}-${name}`;
-    return {
-      namespace,
-      b,
-      e,
-      m,
-      be,
-      em,
-      bm,
-      bem,
-      is,
-      cssVar,
-      cssVarName,
-      cssVarBlock,
-      cssVarBlockName
-    };
-  };
-
   const zIndex = vue.ref(0);
   const useZIndex = () => {
     const initialZIndex = useGlobalConfig("zIndex", 2e3);
@@ -10696,7 +10898,7 @@
     return [recordCursor, setCursor];
   }
 
-  const version$1 = "0.0.20220722";
+  const version$1 = "0.0.20220726";
 
   const makeInstaller = (components = []) => {
     const install = (app, options) => {
@@ -16545,7 +16747,6 @@
               ]),
               style: vue.normalizeStyle(_ctx.$attrs.style),
               onClick: handleFocusInput,
-              onMousedown: onMouseDownInput,
               onMouseenter: onMouseEnter,
               onMouseleave: onMouseLeave,
               onTouchstart: onTouchStartInput,
@@ -16571,6 +16772,7 @@
                 disabled: vue.unref(pickerDisabled),
                 readonly: !_ctx.editable || _ctx.readonly,
                 class: vue.normalizeClass(vue.unref(nsRange).b("input")),
+                onMousedown: onMouseDownInput,
                 onInput: handleStartInput,
                 onChange: handleStartChange,
                 onFocus: handleFocusInput,
@@ -16590,6 +16792,7 @@
                 disabled: vue.unref(pickerDisabled),
                 readonly: !_ctx.editable || _ctx.readonly,
                 class: vue.normalizeClass(vue.unref(nsRange).b("input")),
+                onMousedown: onMouseDownInput,
                 onFocus: handleFocusInput,
                 onBlur: handleBlurInput,
                 onInput: handleEndInput,
@@ -18231,6 +18434,7 @@
       const root = vue.ref();
       const items = vue.ref([]);
       const arrowDisplay = vue.computed(() => props.arrow !== "never" && !vue.unref(isVertical));
+      const interval = vue.computed(() => props.interval);
       const hasLabel = vue.computed(() => {
         return items.value.some((item) => item.props.label.toString().length > 0);
       });
@@ -18266,9 +18470,9 @@
         }
       }
       function startTimer() {
-        if (props.interval <= 0 || !props.autoplay || timer.value)
+        if (interval.value <= 0 || !props.autoplay || timer.value)
           return;
-        timer.value = setInterval(() => playSlides(), props.interval);
+        timer.value = setInterval(() => playSlides(), interval.value);
       }
       const playSlides = () => {
         if (activeIndex.value < items.value.length - 1) {
@@ -19171,8 +19375,8 @@
       });
       vue.provide("CheckboxGroup", {
         name: "ElCheckboxGroup",
-        modelValue,
         ...vue.toRefs(props),
+        modelValue,
         checkboxGroupSize,
         changeEvent
       });
@@ -20937,7 +21141,6 @@
     return vue.openBlock(), vue.createBlock(_component_el_tooltip, {
       ref: "tooltipRef",
       visible: _ctx.popperVisible,
-      "onUpdate:visible": _cache[17] || (_cache[17] = ($event) => _ctx.popperVisible = $event),
       teleported: _ctx.teleported,
       "popper-class": [_ctx.nsCascader.e("dropdown"), _ctx.popperClass],
       "popper-options": _ctx.popperOptions,
@@ -21582,10 +21785,10 @@
     };
     const upFn = function(event) {
       var _a;
-      off(document, "mousemove", moveFn);
-      off(document, "mouseup", upFn);
-      off(document, "touchmove", moveFn);
-      off(document, "touchend", upFn);
+      document.removeEventListener("mousemove", moveFn);
+      document.removeEventListener("mouseup", upFn);
+      document.removeEventListener("touchmove", moveFn);
+      document.removeEventListener("touchend", upFn);
       document.onselectstart = null;
       document.ondragstart = null;
       isDragging = false;
@@ -21598,15 +21801,15 @@
       event.preventDefault();
       document.onselectstart = () => false;
       document.ondragstart = () => false;
-      on$1(document, "mousemove", moveFn);
-      on$1(document, "mouseup", upFn);
-      on$1(document, "touchmove", moveFn);
-      on$1(document, "touchend", upFn);
+      document.addEventListener("mousemove", moveFn);
+      document.addEventListener("mouseup", upFn);
+      document.addEventListener("touchmove", moveFn);
+      document.addEventListener("touchend", upFn);
       isDragging = true;
       (_a = options.start) == null ? void 0 : _a.call(options, event);
     };
-    on$1(element, "mousedown", downFn);
-    on$1(element, "touchstart", downFn);
+    document.addEventListener("mousedown", downFn);
+    document.addEventListener("touchstart", downFn);
   }
 
   const _sfc_main$1v = vue.defineComponent({
@@ -22517,7 +22720,6 @@
     return vue.openBlock(), vue.createBlock(_component_el_tooltip, {
       ref: "popper",
       visible: _ctx.showPicker,
-      "onUpdate:visible": _cache[3] || (_cache[3] = ($event) => _ctx.showPicker = $event),
       "show-arrow": false,
       "fallback-placements": ["bottom", "top", "right", "left"],
       offset: 0,
@@ -26895,14 +27097,7 @@
       vue.watch(() => props.currentTabId, (val) => {
         currentTabbedId.value = val != null ? val : null;
       });
-      vue.onMounted(() => {
-        const rovingFocusGroupEl = vue.unref(rovingFocusGroupRef);
-        on$1(rovingFocusGroupEl, ENTRY_FOCUS_EVT, handleEntryFocus);
-      });
-      vue.onBeforeUnmount(() => {
-        const rovingFocusGroupEl = vue.unref(rovingFocusGroupRef);
-        off(rovingFocusGroupEl, ENTRY_FOCUS_EVT, handleEntryFocus);
-      });
+      useEventListener(rovingFocusGroupRef, ENTRY_FOCUS_EVT, handleEntryFocus);
     }
   });
   function _sfc_render$p(_ctx, _cache, $props, $setup, $data, $options) {
@@ -30068,7 +30263,8 @@
     load: (evt) => evt instanceof Event,
     error: (evt) => evt instanceof Event,
     switch: (val) => isNumber(val),
-    close: () => true
+    close: () => true,
+    show: () => true
   };
 
   const _hoisted_1$r = ["src", "loading"];
@@ -30190,6 +30386,7 @@
         prevOverflow = document.body.style.overflow;
         document.body.style.overflow = "hidden";
         showViewer.value = true;
+        emit("show");
       }
       function closeViewer() {
         stopWheelListener == null ? void 0 : stopWheelListener();
@@ -31321,11 +31518,6 @@
         }
         updateActiveIndex(currentActive);
       });
-      vue.watch(items.value, () => {
-        initMenu();
-        if (props.mode === "horizontal" && props.ellipsis)
-          handleResize();
-      });
       vue.watch(() => props.collapse, (value) => {
         if (value)
           openedMenus.value = [];
@@ -32970,12 +33162,11 @@
     return vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", {
       ref: "selectWrapper",
       class: vue.normalizeClass(_ctx.wrapperKls),
-      onClick: _cache[23] || (_cache[23] = vue.withModifiers((...args) => _ctx.toggleMenu && _ctx.toggleMenu(...args), ["stop"]))
+      onClick: _cache[22] || (_cache[22] = vue.withModifiers((...args) => _ctx.toggleMenu && _ctx.toggleMenu(...args), ["stop"]))
     }, [
       vue.createVNode(_component_el_tooltip, {
         ref: "tooltipRef",
         visible: _ctx.dropMenuVisible,
-        "onUpdate:visible": _cache[22] || (_cache[22] = ($event) => _ctx.dropMenuVisible = $event),
         placement: "bottom-start",
         teleported: _ctx.teleported,
         "popper-class": [_ctx.nsSelect.e("popper"), _ctx.popperClass],
@@ -36294,7 +36485,7 @@
           const _states = vue.unref(states);
           columnIdx = Math.max(0, Math.min(columnIdx, props.totalColumn - 1));
           rowIndex = Math.max(0, Math.min(rowIndex, props.totalRow - 1));
-          const scrollBarWidth = getScrollBarWidth();
+          const scrollBarWidth = getScrollBarWidth(ns.namespace.value);
           const _cache = vue.unref(cache);
           const estimatedHeight = getEstimatedTotalHeight(props, _cache);
           const estimatedWidth = getEstimatedTotalWidth(props, _cache);
@@ -38035,14 +38226,13 @@
     return vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", {
       ref: "selectRef",
       class: vue.normalizeClass([_ctx.nsSelectV2.b(), _ctx.nsSelectV2.m(_ctx.selectSize)]),
-      onClick: _cache[24] || (_cache[24] = vue.withModifiers((...args) => _ctx.toggleMenu && _ctx.toggleMenu(...args), ["stop"])),
-      onMouseenter: _cache[25] || (_cache[25] = ($event) => _ctx.states.comboBoxHovering = true),
-      onMouseleave: _cache[26] || (_cache[26] = ($event) => _ctx.states.comboBoxHovering = false)
+      onClick: _cache[23] || (_cache[23] = vue.withModifiers((...args) => _ctx.toggleMenu && _ctx.toggleMenu(...args), ["stop"])),
+      onMouseenter: _cache[24] || (_cache[24] = ($event) => _ctx.states.comboBoxHovering = true),
+      onMouseleave: _cache[25] || (_cache[25] = ($event) => _ctx.states.comboBoxHovering = false)
     }, [
       vue.createVNode(_component_el_tooltip, {
         ref: "popper",
         visible: _ctx.dropdownMenuVisible,
-        "onUpdate:visible": _cache[22] || (_cache[22] = ($event) => _ctx.dropdownMenuVisible = $event),
         teleported: _ctx.teleported,
         "popper-class": [_ctx.nsSelectV2.e("popper"), _ctx.popperClass],
         "gpu-acceleration": false,
@@ -38056,7 +38246,7 @@
         trigger: "click",
         persistent: _ctx.persistent,
         onBeforeShow: _ctx.handleMenuEnter,
-        onHide: _cache[23] || (_cache[23] = ($event) => _ctx.states.inputValue = _ctx.states.displayInputValue)
+        onHide: _cache[22] || (_cache[22] = ($event) => _ctx.states.inputValue = _ctx.states.displayInputValue)
       }, {
         default: vue.withCtx(() => {
           var _a;
@@ -39136,19 +39326,18 @@
           class: vue.normalizeClass([vue.unref(ns).e("button-wrapper"), { hover: vue.unref(hovering), dragging: vue.unref(dragging) }]),
           style: vue.normalizeStyle(vue.unref(wrapperStyle)),
           tabindex: "0",
-          onMouseenter: _cache[1] || (_cache[1] = (...args) => vue.unref(handleMouseEnter) && vue.unref(handleMouseEnter)(...args)),
-          onMouseleave: _cache[2] || (_cache[2] = (...args) => vue.unref(handleMouseLeave) && vue.unref(handleMouseLeave)(...args)),
-          onMousedown: _cache[3] || (_cache[3] = (...args) => vue.unref(onButtonDown) && vue.unref(onButtonDown)(...args)),
-          onTouchstart: _cache[4] || (_cache[4] = (...args) => vue.unref(onButtonDown) && vue.unref(onButtonDown)(...args)),
-          onFocus: _cache[5] || (_cache[5] = (...args) => vue.unref(handleMouseEnter) && vue.unref(handleMouseEnter)(...args)),
-          onBlur: _cache[6] || (_cache[6] = (...args) => vue.unref(handleMouseLeave) && vue.unref(handleMouseLeave)(...args)),
-          onKeydown: _cache[7] || (_cache[7] = (...args) => vue.unref(onKeyDown) && vue.unref(onKeyDown)(...args))
+          onMouseenter: _cache[0] || (_cache[0] = (...args) => vue.unref(handleMouseEnter) && vue.unref(handleMouseEnter)(...args)),
+          onMouseleave: _cache[1] || (_cache[1] = (...args) => vue.unref(handleMouseLeave) && vue.unref(handleMouseLeave)(...args)),
+          onMousedown: _cache[2] || (_cache[2] = (...args) => vue.unref(onButtonDown) && vue.unref(onButtonDown)(...args)),
+          onTouchstart: _cache[3] || (_cache[3] = (...args) => vue.unref(onButtonDown) && vue.unref(onButtonDown)(...args)),
+          onFocus: _cache[4] || (_cache[4] = (...args) => vue.unref(handleMouseEnter) && vue.unref(handleMouseEnter)(...args)),
+          onBlur: _cache[5] || (_cache[5] = (...args) => vue.unref(handleMouseLeave) && vue.unref(handleMouseLeave)(...args)),
+          onKeydown: _cache[6] || (_cache[6] = (...args) => vue.unref(onKeyDown) && vue.unref(onKeyDown)(...args))
         }, [
           vue.createVNode(vue.unref(ElTooltip), {
             ref_key: "tooltip",
             ref: tooltip,
             visible: vue.unref(tooltipVisible),
-            "onUpdate:visible": _cache[0] || (_cache[0] = ($event) => vue.isRef(tooltipVisible) ? tooltipVisible.value = $event : null),
             placement: _ctx.placement,
             "fallback-placements": ["top", "bottom", "right", "left"],
             "stop-popper-mouse-event": false,
@@ -41928,7 +42117,6 @@
     return vue.openBlock(), vue.createBlock(_component_el_tooltip, {
       ref: "tooltip",
       visible: _ctx.tooltipVisible,
-      "onUpdate:visible": _cache[5] || (_cache[5] = ($event) => _ctx.tooltipVisible = $event),
       offset: 0,
       placement: _ctx.placement,
       "show-arrow": false,
@@ -43298,6 +43486,7 @@
     const tableScrollHeight = vue.ref(0);
     const bodyScrollHeight = vue.ref(0);
     const headerScrollHeight = vue.ref(0);
+    const footerScrollHeight = vue.ref(0);
     vue.watchEffect(() => {
       layout.setHeight(props.height);
     });
@@ -43432,7 +43621,7 @@
       }
     };
     const resizeListener = () => {
-      var _a;
+      var _a, _b;
       if (!table.$ready)
         return;
       let shouldUpdateLayout = false;
@@ -43451,17 +43640,18 @@
         shouldUpdateLayout = true;
       }
       const tableHeader = table.refs.headerWrapper;
-      if (props.showHeader && tableHeader.offsetHeight !== oldHeaderHeight) {
+      if (props.showHeader && (tableHeader == null ? void 0 : tableHeader.offsetHeight) !== oldHeaderHeight) {
         shouldUpdateLayout = true;
       }
-      tableScrollHeight.value = table.refs.tableWrapper.scrollHeight;
-      headerScrollHeight.value = ((_a = table.refs.headerWrapper) == null ? void 0 : _a.scrollHeight) || 0;
-      bodyScrollHeight.value = tableScrollHeight.value - headerScrollHeight.value;
+      tableScrollHeight.value = ((_a = table.refs.tableWrapper) == null ? void 0 : _a.scrollHeight) || 0;
+      headerScrollHeight.value = (tableHeader == null ? void 0 : tableHeader.scrollHeight) || 0;
+      footerScrollHeight.value = ((_b = table.refs.footerWrapper) == null ? void 0 : _b.scrollHeight) || 0;
+      bodyScrollHeight.value = tableScrollHeight.value - headerScrollHeight.value - footerScrollHeight.value;
       if (shouldUpdateLayout) {
         resizeState.value = {
           width,
           height,
-          headerHeight: props.showHeader ? tableHeader.offsetHeight : null
+          headerHeight: props.showHeader && (tableHeader == null ? void 0 : tableHeader.offsetHeight) || 0
         };
         doLayout();
       }
@@ -43503,7 +43693,7 @@
       return {};
     });
     const scrollbarStyle = vue.computed(() => {
-      var _a;
+      var _a, _b;
       if (props.height) {
         return {
           height: "100%"
@@ -43512,16 +43702,17 @@
       if (props.maxHeight) {
         if (!Number.isNaN(Number(props.maxHeight))) {
           const headerHeight = ((_a = table.refs.headerWrapper) == null ? void 0 : _a.scrollHeight) || 0;
+          const footerHeight = ((_b = table.refs.footerWrapper) == null ? void 0 : _b.scrollHeight) || 0;
           const maxHeight = props.maxHeight;
           const reachMaxHeight = tableScrollHeight.value >= Number(maxHeight);
           if (reachMaxHeight) {
             return {
-              maxHeight: `${tableScrollHeight.value - headerHeight}px`
+              maxHeight: `${tableScrollHeight.value - headerHeight - footerHeight}px`
             };
           }
         } else {
           return {
-            maxHeight: `calc(${props.maxHeight} - ${headerScrollHeight.value}px)`
+            maxHeight: `calc(${props.maxHeight} - ${headerScrollHeight.value + footerScrollHeight.value}px)`
           };
         }
       }
@@ -43906,6 +44097,7 @@
                 }, null, 8, ["columns", "table-layout"]),
                 _ctx.showHeader && _ctx.tableLayout === "auto" ? (vue.openBlock(), vue.createBlock(_component_table_header, {
                   key: 0,
+                  ref: "tableHeaderRef",
                   border: _ctx.border,
                   "default-sort": _ctx.defaultSort,
                   store: _ctx.store,
@@ -49859,10 +50051,6 @@
     const checkboxItems = vue.shallowRef([]);
     vue.onMounted(() => {
       initTabIndex();
-      on$1(el$.value, "keydown", handleKeydown);
-    });
-    vue.onBeforeUnmount(() => {
-      off(el$.value, "keydown", handleKeydown);
     });
     vue.onUpdated(() => {
       treeItems.value = Array.from(el$.value.querySelectorAll("[role=treeitem]"));
@@ -49926,6 +50114,7 @@
         hasInput.click();
       }
     };
+    useEventListener(el$, "keydown", handleKeydown);
     const initTabIndex = () => {
       var _a;
       treeItems.value = Array.from(el$.value.querySelectorAll(`.${ns.is("focusable")}[role=treeitem]`));
@@ -53245,12 +53434,12 @@
       vue.onMounted(async () => {
         await vue.nextTick();
         if (props.closeOnHashChange) {
-          on$1(window, "hashchange", doClose);
+          window.addEventListener("hashchange", doClose);
         }
       });
       vue.onBeforeUnmount(() => {
         if (props.closeOnHashChange) {
-          off(window, "hashchange", doClose);
+          window.removeEventListener("hashchange", doClose);
         }
       });
       function doClose() {