@element-plus/nightly 0.0.20220109 → 0.0.20220113

package/lib/components/tooltip/src/content.vue_vue_type_script_lang.js

@@ -3,23 +3,20 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var vue = require('vue');
+var core = require('@vueuse/core');
 require('../../popper/index.js');
 require('../../visual-hidden/index.js');
-var index = require('../../teleport/index.js');
 var dom = require('../../../utils/dom.js');
 require('../../../hooks/index.js');
 var tooltip = require('./tooltip.js');
 var tokens = require('./tokens.js');
 var content_vue_vue_type_script_lang = require('../../popper/src/content.vue_vue_type_script_lang.js');
 var visualHidden_vue_vue_type_script_lang = require('../../visual-hidden/src/visual-hidden.vue_vue_type_script_lang.js');
-var index$1 = require('../../../hooks/use-escape-keydown/index.js');
-var index$2 = require('../../../hooks/use-intermediate-render/index.js');
-var index$3 = require('../../../hooks/use-popper-container/index.js');
+var index = require('../../../hooks/use-escape-keydown/index.js');
 
 var script = vue.defineComponent({
   name: "ElTooltipContent",
   components: {
-    ElTeleport: index.ElTeleport,
     ElPopperContent: content_vue_vue_type_script_lang["default"],
     ElVisuallyHidden: visualHidden_vue_vue_type_script_lang["default"]
   },
@@ -37,76 +34,27 @@ var script = vue.defineComponent({
       }
       return props.persistent;
     });
+    const shouldRender = vue.computed(() => {
+      return vue.unref(persistentRef) ? true : vue.unref(open);
+    });
+    const shouldShow = vue.computed(() => {
+      return props.disabled ? false : vue.unref(open);
+    });
     const contentStyle = vue.computed(() => {
       var _a;
       return (_a = props.style) != null ? _a : {};
     });
-    const shouldRenderTeleport = vue.computed(() => {
-      if (vue.unref(persistentRef))
-        return true;
-      return vue.unref(vue.unref(entering) ? open : intermediateOpen);
-    });
-    const shouldRenderPopperContent = vue.computed(() => {
-      if (vue.unref(persistentRef))
-        return true;
-      return vue.unref(vue.unref(leaving) ? open : intermediateOpen);
-    });
-    const shouldShowPopperContent = vue.computed(() => {
-      if (vue.unref(persistentRef)) {
-        return vue.unref(vue.unref(leaving) ? open : intermediateOpen);
-      }
-      return true;
-    });
-    const ariaHidden = vue.computed(() => !(vue.unref(shouldRenderPopperContent) && vue.unref(shouldShowPopperContent)));
-    index$1.useEscapeKeydown(onClose);
-    index$2.useDelayedRender({
-      indicator: open,
-      intermediateIndicator: intermediateOpen,
-      shouldSetIntermediate: (step) => {
-        return step === "hide" ? false : true;
-      },
-      beforeShow: () => {
-        if (vue.unref(leaving)) {
-          leaving.value = false;
-          intermediateOpen.value = false;
-        }
-        entering.value = true;
-      },
-      beforeHide: () => {
-        if (vue.unref(entering)) {
-          entering.value = false;
-          return;
-        }
-        leaving.value = true;
-      },
-      afterShow: () => {
-        if (!vue.unref(open))
-          return;
-        entering.value = false;
-        onShow();
-        vue.nextTick(() => {
-          var _a;
-          (_a = vue.unref(contentRef)) == null ? void 0 : _a.updatePopper();
-        });
-      },
-      afterHide: () => {
-        if (vue.unref(open))
-          return;
-        onHide();
-      }
-    });
+    const ariaHidden = vue.computed(() => !vue.unref(open));
+    index.useEscapeKeydown(onClose);
     const onTransitionLeave = () => {
-      if (vue.unref(open))
-        return;
-      leaving.value = false;
-      intermediateOpen.value = false;
+      onHide();
     };
     const stopWhenControlled = () => {
       if (vue.unref(controlled))
         return true;
     };
     const onContentEnter = dom.composeEventHandlers(stopWhenControlled, () => {
-      if (props.enterable) {
+      if (props.enterable && vue.unref(trigger) === "hover") {
         onOpen();
       }
     });
@@ -115,6 +63,33 @@ var script = vue.defineComponent({
         onClose();
       }
     });
+    const onBeforeEnter = () => {
+      var _a, _b;
+      (_b = (_a = contentRef.value) == null ? void 0 : _a.updatePopper) == null ? void 0 : _b.call(_a);
+    };
+    const onAfterShow = () => {
+      onShow();
+    };
+    let stopHandle;
+    vue.watch(() => vue.unref(open), (val) => {
+      if (val) {
+        stopHandle = core.onClickOutside(vue.computed(() => {
+          var _a;
+          return (_a = contentRef.value) == null ? void 0 : _a.popperContentRef;
+        }), () => {
+          if (vue.unref(controlled))
+            return;
+          const $trigger = vue.unref(trigger);
+          if ($trigger !== "hover") {
+            onClose();
+          }
+        });
+      } else {
+        stopHandle == null ? void 0 : stopHandle();
+      }
+    }, {
+      flush: "post"
+    });
     return {
       ariaHidden,
       entering,
@@ -123,11 +98,11 @@ var script = vue.defineComponent({
       intermediateOpen,
       contentStyle,
       contentRef,
-      shouldRenderTeleport,
-      shouldRenderPopperContent,
-      shouldShowPopperContent,
+      shouldRender,
+      shouldShow,
       open,
-      POPPER_CONTAINER_SELECTOR: index$3.POPPER_CONTAINER_SELECTOR,
+      onAfterShow,
+      onBeforeEnter,
       onContentEnter,
       onContentLeave,
       onTransitionLeave

package/lib/components/tooltip/src/content.vue_vue_type_script_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"content.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/tooltip/src/content.vue"],"sourcesContent":["<template>\n  <el-teleport\n    v-if=\"shouldRenderTeleport\"\n    :disabled=\"!teleported\"\n    :container=\"POPPER_CONTAINER_SELECTOR\"\n  >\n    <transition :name=\"transition\" @after-leave=\"onTransitionLeave\">\n      <el-popper-content\n        v-if=\"shouldRenderPopperContent\"\n        v-show=\"shouldShowPopperContent\"\n        ref=\"contentRef\"\n        v-bind=\"$attrs\"\n        :aria-hidden=\"ariaHidden\"\n        :boundaries-padding=\"boundariesPadding\"\n        :fallback-placements=\"fallbackPlacements\"\n        :gpu-acceleration=\"gpuAcceleration\"\n        :offset=\"offset\"\n        :placement=\"placement\"\n        :popper-options=\"popperOptions\"\n        :strategy=\"strategy\"\n        :effect=\"effect\"\n        :enterable=\"enterable\"\n        :pure=\"pure\"\n        :popper-class=\"popperClass\"\n        :popper-style=\"[popperStyle, contentStyle]\"\n        :reference-el=\"referenceEl\"\n        :z-index=\"zIndex\"\n        @mouseenter=\"onContentEnter\"\n        @mouseleave=\"onContentLeave\"\n      >\n        <slot />\n        <el-visually-hidden :id=\"id\" role=\"tooltip\">\n          {{ ariaLabel }}\n        </el-visually-hidden>\n      </el-popper-content>\n    </transition>\n  </el-teleport>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, inject, nextTick, ref, unref } from 'vue'\nimport { ElPopperContent } from '@element-plus/components/popper'\nimport { ElVisuallyHidden } from '@element-plus/components/visual-hidden'\nimport { ElTeleport } from '@element-plus/components/teleport'\nimport { composeEventHandlers } from '@element-plus/utils/dom'\nimport {\n  useEscapeKeydown,\n  POPPER_CONTAINER_SELECTOR,\n  useDelayedRender,\n} from '@element-plus/hooks'\n\nimport { useTooltipContentProps } from './tooltip'\nimport { TOOLTIP_INJECTION_KEY } from './tokens'\n\nexport default defineComponent({\n  name: 'ElTooltipContent',\n  components: {\n    ElTeleport,\n    ElPopperContent,\n    ElVisuallyHidden,\n  },\n  inheritAttrs: false,\n  props: useTooltipContentProps,\n  setup(props) {\n    const contentRef = ref<InstanceType<typeof ElPopperContent> | null>(null)\n    const intermediateOpen = ref(false)\n    const entering = ref(false)\n    const leaving = ref(false)\n    const { controlled, id, open, trigger, onClose, onOpen, onShow, onHide } =\n      inject(TOOLTIP_INJECTION_KEY, undefined)!\n    const persistentRef = computed(() => {\n      // For testing, we would always want the content to be rendered\n      // to the DOM, so we need to return true here.\n      if (process.env.NODE_ENV === 'test') {\n        return true\n      }\n      return props.persistent\n    })\n\n    const contentStyle = computed(() => (props.style ?? {}) as any)\n    const shouldRenderTeleport = computed(() => {\n      if (unref(persistentRef)) return true\n      return unref(unref(entering) ? open : intermediateOpen)\n    })\n\n    const shouldRenderPopperContent = computed(() => {\n      if (unref(persistentRef)) return true\n      return unref(unref(leaving) ? open : intermediateOpen)\n    })\n\n    const shouldShowPopperContent = computed(() => {\n      // This is for control persistent mode transition\n      // When persistent this element will always be rendered, we simply use v-show to control the transition\n      if (unref(persistentRef)) {\n        return unref(unref(leaving) ? open : intermediateOpen)\n      }\n      return true\n    })\n\n    const ariaHidden = computed(\n      () =>\n        !(unref(shouldRenderPopperContent) && unref(shouldShowPopperContent))\n    )\n\n    useEscapeKeydown(onClose)\n\n    useDelayedRender({\n      indicator: open,\n      intermediateIndicator: intermediateOpen,\n      shouldSetIntermediate: (step) => {\n        // we don't want to set the intermediateOpen because we want the transition to finish.\n        // After transition finishes, with the hook after-leave we can call intermediate.value = false\n        return step === 'hide' ? false : true\n      },\n      beforeShow: () => {\n        // indicates interruption of hide transition\n        if (unref(leaving)) {\n          leaving.value = false\n          intermediateOpen.value = false\n        }\n        entering.value = true\n      },\n      beforeHide: () => {\n        // indicates interruption of show transition\n        if (unref(entering)) {\n          entering.value = false\n          return\n        }\n        leaving.value = true\n      },\n      afterShow: () => {\n        if (!unref(open)) return\n        entering.value = false\n        onShow()\n        nextTick(() => {\n          unref(contentRef)?.updatePopper()\n        })\n      },\n      afterHide: () => {\n        if (unref(open)) return\n        // prevent the content from hiding if it's still open\n        onHide()\n      },\n    })\n\n    const onTransitionLeave = () => {\n      if (unref(open)) return\n      leaving.value = false\n      intermediateOpen.value = false\n    }\n\n    const stopWhenControlled = () => {\n      if (unref(controlled)) return true\n    }\n\n    const onContentEnter = composeEventHandlers(stopWhenControlled, () => {\n      if (props.enterable) {\n        onOpen()\n      }\n    })\n\n    const onContentLeave = composeEventHandlers(stopWhenControlled, () => {\n      if (unref(trigger) === 'hover') {\n        onClose()\n      }\n    })\n\n    return {\n      ariaHidden,\n      entering,\n      leaving,\n      id,\n      intermediateOpen,\n      contentStyle,\n      contentRef,\n      shouldRenderTeleport,\n      shouldRenderPopperContent,\n      shouldShowPopperContent,\n      open,\n      POPPER_CONTAINER_SELECTOR,\n      onContentEnter,\n      onContentLeave,\n      onTransitionLeave,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","ElTeleport","ElPopperContent","ElVisuallyHidden","useTooltipContentProps","ref","computed","unref","nextTick","composeEventHandlers","POPPER_CONTAINER_SELECTOR"],"mappings":";;;;;;;;;;;;;;;;;;AAmDA,aAAeA,mBAAe;AAC9B,EAAE,wBAAwB;;AAE1B,gBAAIC;qBACAC,2CAAe;sBACfC;;cAEU,EAAE;OACT,EAAEC;EACP;IACE,MAAM,UAAU;IAChB,MAAM,gBAAgB,GAAGC;IACzB,MAAM;IACN,MAAM,OAAO,UAAM,CAAC,KAAK,CAAC,CAAC;IAC3B,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE;IAC9B,MAAM,aAAa,GAAGC;MACpB,IAAI,QAAQ,GAAG,CAAC;QACd,OAAO,IAAI,CAAC;OACb;MACD,OAAO,KAAK,CAAC,UAAU,CAAC;MACxB,CAAC;UACG,YAAY,GAAGA,YAAQ,OAAO;MAClC,IAAI,EAAE,CAAC;aACA,GAAG;MACV;UACI;;;MAGJ,OAAOC,SAAK,CAACA,UAAM,QAAQ,CAAC,GAAG,IAAI,GAAG,gBAAgB,CAAC;KACxD,CAAC,CAAC;UACG,yBAAyB;MAC7B,IAAIA,SAAK,CAAC,aAAa,CAAC;;;KAGzB,CAAC,CAAC;UACG,uBAAuB,GAAGD;MAC9B,IAAIC,SAAK,CAAC,aAAa,CAAC,EAAE;;;MAG1B,OAAO,IAAI,CAAC;MACZ,CAAC;UACG,UAAU,GAAGD,YAAQ,CAAC,MAAM,EAAEC,SAAK,CAAC,yBAAyB,cAAU,CAAC,uBAAuB,CAAC,CAAC,CAAC;4BACxF,CAAC,OAAO,CAAC,CAAC;4BACV,CAAC;MACf;MACA;;;OAGC;MACD;QACE,IAAIA,SAAK,CAAC,OAAO,CAAC,EAAE;;;SAGnB;;OAEF;MACD,YAAY;QACV,IAAIA,SAAK,CAAC,QAAQ,CAAC,EAAE;UACnB,QAAQ,CAAC,KAAK,GAAG,KAAK,CAAC;iBAChB;SACR;QACD,OAAO,CAAC,KAAK,GAAG,IAAI,CAAC;OACtB;MACD,SAAS;QACP,IAAI,CAACA,SAAK,CAAC,IAAI,CAAC;iBACP;gBACD,CAAC,KAAK,QAAQ;cAChB,EAAE,CAAC;QACTC;UACE,IAAI,EAAE,CAAC;;SAER,CAAC,CAAC;;eAEI,EAAE,MAAM;YACXD,SAAK,CAAC,IAAI,CAAC;UACb;QACF;;MAEF,CAAC;UACG;mBACK,CAAC,IAAI,CAAC;QACb,OAAO;aACF,CAAC;uBACS;;;MAGjB;QACE,OAAO,KAAK;;wBAEI,GAAGE,wBAAoB,CAAC;UACtC,KAAK;;;;IAIX,MAAM,cAAc;MAClB,IAAIF,SAAK,CAAC,OAAO,CAAC;QAChB,OAAO,EAAE,CAAC;OACX;;;MAGD,UAAU;MACV,QAAQ;;;MAGR,gBAAgB;MAChB,YAAY;;MAEZ;;;MAGA,IAAI;iCACJG,iCAAyB;;MAEzB;;;;;;;;"}
+{"version":3,"file":"content.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/tooltip/src/content.vue"],"sourcesContent":["<template>\n  <teleport :disabled=\"!teleported\" :to=\"appendTo\">\n    <transition\n      :name=\"transition\"\n      @after-leave=\"onTransitionLeave\"\n      @before-enter=\"onBeforeEnter\"\n      @after-enter=\"onAfterShow\"\n    >\n      <el-popper-content\n        v-if=\"shouldRender\"\n        v-show=\"shouldShow\"\n        ref=\"contentRef\"\n        v-bind=\"$attrs\"\n        :aria-hidden=\"ariaHidden\"\n        :boundaries-padding=\"boundariesPadding\"\n        :fallback-placements=\"fallbackPlacements\"\n        :gpu-acceleration=\"gpuAcceleration\"\n        :offset=\"offset\"\n        :placement=\"placement\"\n        :popper-options=\"popperOptions\"\n        :strategy=\"strategy\"\n        :effect=\"effect\"\n        :enterable=\"enterable\"\n        :pure=\"pure\"\n        :popper-class=\"popperClass\"\n        :popper-style=\"[popperStyle, contentStyle]\"\n        :reference-el=\"referenceEl\"\n        :z-index=\"zIndex\"\n        @mouseenter=\"onContentEnter\"\n        @mouseleave=\"onContentLeave\"\n      >\n        <slot />\n        <el-visually-hidden :id=\"id\" role=\"tooltip\">\n          {{ ariaLabel }}\n        </el-visually-hidden>\n      </el-popper-content>\n    </transition>\n  </teleport>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, inject, ref, unref, watch } from 'vue'\nimport { onClickOutside } from '@vueuse/core'\nimport { ElPopperContent } from '@element-plus/components/popper'\nimport { ElVisuallyHidden } from '@element-plus/components/visual-hidden'\nimport { composeEventHandlers } from '@element-plus/utils/dom'\nimport { useEscapeKeydown } from '@element-plus/hooks'\n\nimport { useTooltipContentProps } from './tooltip'\nimport { TOOLTIP_INJECTION_KEY } from './tokens'\n\nexport default defineComponent({\n  name: 'ElTooltipContent',\n  components: {\n    ElPopperContent,\n    ElVisuallyHidden,\n  },\n  inheritAttrs: false,\n  props: useTooltipContentProps,\n  setup(props) {\n    const contentRef = ref<InstanceType<typeof ElPopperContent> | null>(null)\n    const intermediateOpen = ref(false)\n    const entering = ref(false)\n    const leaving = ref(false)\n    const { controlled, id, open, trigger, onClose, onOpen, onShow, onHide } =\n      inject(TOOLTIP_INJECTION_KEY, undefined)!\n    const persistentRef = computed(() => {\n      // For testing, we would always want the content to be rendered\n      // to the DOM, so we need to return true here.\n      if (process.env.NODE_ENV === 'test') {\n        return true\n      }\n      return props.persistent\n    })\n\n    const shouldRender = computed(() => {\n      return unref(persistentRef) ? true : unref(open)\n    })\n\n    const shouldShow = computed(() => {\n      return props.disabled ? false : unref(open)\n    })\n\n    const contentStyle = computed(() => (props.style ?? {}) as any)\n\n    const ariaHidden = computed(() => !unref(open))\n\n    useEscapeKeydown(onClose)\n\n    const onTransitionLeave = () => {\n      onHide()\n    }\n\n    const stopWhenControlled = () => {\n      if (unref(controlled)) return true\n    }\n\n    const onContentEnter = composeEventHandlers(stopWhenControlled, () => {\n      if (props.enterable && unref(trigger) === 'hover') {\n        onOpen()\n      }\n    })\n\n    const onContentLeave = composeEventHandlers(stopWhenControlled, () => {\n      if (unref(trigger) === 'hover') {\n        onClose()\n      }\n    })\n\n    const onBeforeEnter = () => {\n      contentRef.value?.updatePopper?.()\n    }\n\n    const onAfterShow = () => {\n      onShow()\n    }\n\n    let stopHandle: ReturnType<typeof onClickOutside>\n\n    watch(\n      () => unref(open),\n      (val) => {\n        if (val) {\n          stopHandle = onClickOutside(\n            computed(() => {\n              return contentRef.value?.popperContentRef\n            }),\n            () => {\n              if (unref(controlled)) return\n              const $trigger = unref(trigger)\n              if ($trigger !== 'hover') {\n                onClose()\n              }\n            }\n          )\n        } else {\n          stopHandle?.()\n        }\n      },\n      {\n        flush: 'post',\n      }\n    )\n\n    return {\n      ariaHidden,\n      entering,\n      leaving,\n      id,\n      intermediateOpen,\n      contentStyle,\n      contentRef,\n      shouldRender,\n      shouldShow,\n      open,\n      onAfterShow,\n      onBeforeEnter,\n      onContentEnter,\n      onContentLeave,\n      onTransitionLeave,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","ElPopperContent","ElVisuallyHidden","useTooltipContentProps","ref","computed","unref","useEscapeKeydown","composeEventHandlers"],"mappings":";;;;;;;;;;;;;;;;AAgDA,aAAeA,mBAAe;AAC9B,EAAE,wBAAwB;;AAE1B,qBAAIC,2CAAe;sBACfC,gDAAgB;GACjB;cACW,EAAE;OACT,EAAEC;EACP;IACE,MAAM,UAAU;IAChB,MAAM,gBAAgB,GAAGC;IACzB,MAAM;IACN,MAAM,OAAO,UAAM,CAAC,KAAK,CAAC,CAAC;IAC3B,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE;IAC9B,MAAM,aAAa,GAAGC;MACpB,IAAI,QAAQ,GAAG,CAAC;QACd,OAAO,IAAI,CAAC;OACb;MACD,OAAO,KAAK,CAAC,UAAU,CAAC;MACxB,CAAC;UACG,YAAY,GAAGA,YAAQ,OAAO;MAClC,OAAOC,SAAK,CAAC,aAAa,CAAC,GAAG,IAAI,GAAGA;;;MAGrC,OAAO,KAAK,CAAC,QAAQ;KACtB;;MAEC,IAAI,EAAE,CAAC;MACP,OAAO,CAAC,EAAE,GAAG,KAAK,CAAC,KAAK,SAAS,KAAK,GAAG,EAAE,CAAC;KAC7C;;IAEDC,uBAAiB,OAAO,CAAC,CAAC;UACpB,oBAAoB,MAAM;;;IAGhC,MAAM,kBAAkB,GAAG,MAAM;;QAE7B,OAAO,IAAI;;IAEf,MAAM,cAAc,GAAGC;;QAEnB,MAAM,EAAE,CAAC;OACV;;;MAGD,IAAIF,SAAK,CAAC,OAAO,CAAC,KAAK;eACd,EAAE,CAAC;;;IAGd,MAAM,aAAa,SAAS;MAC1B,IAAI,EAAE,EAAE,EAAE,CAAC;SACR,GAAG,CAAC,EAAE;MACT;IACF;;KAEC,CAAC;kBACY,CAAC;aACV,CAAC,MAAMA;MACV;;;UAGI,OAAO,CAAC,EAAE;SACX,CAAC,EAAE,MAAM;;;UAGR,MAAM,QAAQ,GAAGA;UACjB;;;SAGD,CAAC,CAAC;;QAEH;OACD;OACA;WACI,EAAE;;;gBAGG;cACF;aACD;;sBAES;kBACJ;gBACF;;;UAGN;;mBAES;;MAEb;MACA;;;;;;;"}

package/lib/components/tooltip/src/content.vue_vue_type_template_id_20254f8d_lang.js

@@ -7,62 +7,59 @@ var vue = require('vue');
 function render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_el_visually_hidden = vue.resolveComponent("el-visually-hidden");
   const _component_el_popper_content = vue.resolveComponent("el-popper-content");
-  const _component_el_teleport = vue.resolveComponent("el-teleport");
-  return _ctx.shouldRenderTeleport ? (vue.openBlock(), vue.createBlock(_component_el_teleport, {
-    key: 0,
+  return vue.openBlock(), vue.createBlock(vue.Teleport, {
     disabled: !_ctx.teleported,
-    container: _ctx.POPPER_CONTAINER_SELECTOR
-  }, {
-    default: vue.withCtx(() => [
-      vue.createVNode(vue.Transition, {
-        name: _ctx.transition,
-        onAfterLeave: _ctx.onTransitionLeave
-      }, {
-        default: vue.withCtx(() => [
-          _ctx.shouldRenderPopperContent ? vue.withDirectives((vue.openBlock(), vue.createBlock(_component_el_popper_content, vue.mergeProps({
-            key: 0,
-            ref: "contentRef"
-          }, _ctx.$attrs, {
-            "aria-hidden": _ctx.ariaHidden,
-            "boundaries-padding": _ctx.boundariesPadding,
-            "fallback-placements": _ctx.fallbackPlacements,
-            "gpu-acceleration": _ctx.gpuAcceleration,
-            offset: _ctx.offset,
-            placement: _ctx.placement,
-            "popper-options": _ctx.popperOptions,
-            strategy: _ctx.strategy,
-            effect: _ctx.effect,
-            enterable: _ctx.enterable,
-            pure: _ctx.pure,
-            "popper-class": _ctx.popperClass,
-            "popper-style": [_ctx.popperStyle, _ctx.contentStyle],
-            "reference-el": _ctx.referenceEl,
-            "z-index": _ctx.zIndex,
-            onMouseenter: _ctx.onContentEnter,
-            onMouseleave: _ctx.onContentLeave
-          }), {
-            default: vue.withCtx(() => [
-              vue.renderSlot(_ctx.$slots, "default"),
-              vue.createVNode(_component_el_visually_hidden, {
-                id: _ctx.id,
-                role: "tooltip"
-              }, {
-                default: vue.withCtx(() => [
-                  vue.createTextVNode(vue.toDisplayString(_ctx.ariaLabel), 1)
-                ]),
-                _: 1
-              }, 8, ["id"])
-            ]),
-            _: 3
-          }, 16, ["aria-hidden", "boundaries-padding", "fallback-placements", "gpu-acceleration", "offset", "placement", "popper-options", "strategy", "effect", "enterable", "pure", "popper-class", "popper-style", "reference-el", "z-index", "onMouseenter", "onMouseleave"])), [
-            [vue.vShow, _ctx.shouldShowPopperContent]
-          ]) : vue.createCommentVNode("v-if", true)
-        ]),
-        _: 3
-      }, 8, ["name", "onAfterLeave"])
-    ]),
-    _: 3
-  }, 8, ["disabled", "container"])) : vue.createCommentVNode("v-if", true);
+    to: _ctx.appendTo
+  }, [
+    vue.createVNode(vue.Transition, {
+      name: _ctx.transition,
+      onAfterLeave: _ctx.onTransitionLeave,
+      onBeforeEnter: _ctx.onBeforeEnter,
+      onAfterEnter: _ctx.onAfterShow
+    }, {
+      default: vue.withCtx(() => [
+        _ctx.shouldRender ? vue.withDirectives((vue.openBlock(), vue.createBlock(_component_el_popper_content, vue.mergeProps({
+          key: 0,
+          ref: "contentRef"
+        }, _ctx.$attrs, {
+          "aria-hidden": _ctx.ariaHidden,
+          "boundaries-padding": _ctx.boundariesPadding,
+          "fallback-placements": _ctx.fallbackPlacements,
+          "gpu-acceleration": _ctx.gpuAcceleration,
+          offset: _ctx.offset,
+          placement: _ctx.placement,
+          "popper-options": _ctx.popperOptions,
+          strategy: _ctx.strategy,
+          effect: _ctx.effect,
+          enterable: _ctx.enterable,
+          pure: _ctx.pure,
+          "popper-class": _ctx.popperClass,
+          "popper-style": [_ctx.popperStyle, _ctx.contentStyle],
+          "reference-el": _ctx.referenceEl,
+          "z-index": _ctx.zIndex,
+          onMouseenter: _ctx.onContentEnter,
+          onMouseleave: _ctx.onContentLeave
+        }), {
+          default: vue.withCtx(() => [
+            vue.renderSlot(_ctx.$slots, "default"),
+            vue.createVNode(_component_el_visually_hidden, {
+              id: _ctx.id,
+              role: "tooltip"
+            }, {
+              default: vue.withCtx(() => [
+                vue.createTextVNode(vue.toDisplayString(_ctx.ariaLabel), 1)
+              ]),
+              _: 1
+            }, 8, ["id"])
+          ]),
+          _: 3
+        }, 16, ["aria-hidden", "boundaries-padding", "fallback-placements", "gpu-acceleration", "offset", "placement", "popper-options", "strategy", "effect", "enterable", "pure", "popper-class", "popper-style", "reference-el", "z-index", "onMouseenter", "onMouseleave"])), [
+          [vue.vShow, _ctx.shouldShow]
+        ]) : vue.createCommentVNode("v-if", true)
+      ]),
+      _: 3
+    }, 8, ["name", "onAfterLeave", "onBeforeEnter", "onAfterEnter"])
+  ], 8, ["disabled", "to"]);
 }
 
 exports.render = render;

package/lib/components/tooltip/src/content.vue_vue_type_template_id_20254f8d_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"content.vue_vue_type_template_id_20254f8d_lang.js","sources":["../../../../../../packages/components/tooltip/src/content.vue?vue&type=template&id=20254f8d&lang.js"],"sourcesContent":["<template>\n  <el-teleport\n    v-if=\"shouldRenderTeleport\"\n    :disabled=\"!teleported\"\n    :container=\"POPPER_CONTAINER_SELECTOR\"\n  >\n    <transition :name=\"transition\" @after-leave=\"onTransitionLeave\">\n      <el-popper-content\n        v-if=\"shouldRenderPopperContent\"\n        v-show=\"shouldShowPopperContent\"\n        ref=\"contentRef\"\n        v-bind=\"$attrs\"\n        :aria-hidden=\"ariaHidden\"\n        :boundaries-padding=\"boundariesPadding\"\n        :fallback-placements=\"fallbackPlacements\"\n        :gpu-acceleration=\"gpuAcceleration\"\n        :offset=\"offset\"\n        :placement=\"placement\"\n        :popper-options=\"popperOptions\"\n        :strategy=\"strategy\"\n        :effect=\"effect\"\n        :enterable=\"enterable\"\n        :pure=\"pure\"\n        :popper-class=\"popperClass\"\n        :popper-style=\"[popperStyle, contentStyle]\"\n        :reference-el=\"referenceEl\"\n        :z-index=\"zIndex\"\n        @mouseenter=\"onContentEnter\"\n        @mouseleave=\"onContentLeave\"\n      >\n        <slot />\n        <el-visually-hidden :id=\"id\" role=\"tooltip\">\n          {{ ariaLabel }}\n        </el-visually-hidden>\n      </el-popper-content>\n    </transition>\n  </el-teleport>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, inject, nextTick, ref, unref } from 'vue'\nimport { ElPopperContent } from '@element-plus/components/popper'\nimport { ElVisuallyHidden } from '@element-plus/components/visual-hidden'\nimport { ElTeleport } from '@element-plus/components/teleport'\nimport { composeEventHandlers } from '@element-plus/utils/dom'\nimport {\n  useEscapeKeydown,\n  POPPER_CONTAINER_SELECTOR,\n  useDelayedRender,\n} from '@element-plus/hooks'\n\nimport { useTooltipContentProps } from './tooltip'\nimport { TOOLTIP_INJECTION_KEY } from './tokens'\n\nexport default defineComponent({\n  name: 'ElTooltipContent',\n  components: {\n    ElTeleport,\n    ElPopperContent,\n    ElVisuallyHidden,\n  },\n  inheritAttrs: false,\n  props: useTooltipContentProps,\n  setup(props) {\n    const contentRef = ref<InstanceType<typeof ElPopperContent> | null>(null)\n    const intermediateOpen = ref(false)\n    const entering = ref(false)\n    const leaving = ref(false)\n    const { controlled, id, open, trigger, onClose, onOpen, onShow, onHide } =\n      inject(TOOLTIP_INJECTION_KEY, undefined)!\n    const persistentRef = computed(() => {\n      // For testing, we would always want the content to be rendered\n      // to the DOM, so we need to return true here.\n      if (process.env.NODE_ENV === 'test') {\n        return true\n      }\n      return props.persistent\n    })\n\n    const contentStyle = computed(() => (props.style ?? {}) as any)\n    const shouldRenderTeleport = computed(() => {\n      if (unref(persistentRef)) return true\n      return unref(unref(entering) ? open : intermediateOpen)\n    })\n\n    const shouldRenderPopperContent = computed(() => {\n      if (unref(persistentRef)) return true\n      return unref(unref(leaving) ? open : intermediateOpen)\n    })\n\n    const shouldShowPopperContent = computed(() => {\n      // This is for control persistent mode transition\n      // When persistent this element will always be rendered, we simply use v-show to control the transition\n      if (unref(persistentRef)) {\n        return unref(unref(leaving) ? open : intermediateOpen)\n      }\n      return true\n    })\n\n    const ariaHidden = computed(\n      () =>\n        !(unref(shouldRenderPopperContent) && unref(shouldShowPopperContent))\n    )\n\n    useEscapeKeydown(onClose)\n\n    useDelayedRender({\n      indicator: open,\n      intermediateIndicator: intermediateOpen,\n      shouldSetIntermediate: (step) => {\n        // we don't want to set the intermediateOpen because we want the transition to finish.\n        // After transition finishes, with the hook after-leave we can call intermediate.value = false\n        return step === 'hide' ? false : true\n      },\n      beforeShow: () => {\n        // indicates interruption of hide transition\n        if (unref(leaving)) {\n          leaving.value = false\n          intermediateOpen.value = false\n        }\n        entering.value = true\n      },\n      beforeHide: () => {\n        // indicates interruption of show transition\n        if (unref(entering)) {\n          entering.value = false\n          return\n        }\n        leaving.value = true\n      },\n      afterShow: () => {\n        if (!unref(open)) return\n        entering.value = false\n        onShow()\n        nextTick(() => {\n          unref(contentRef)?.updatePopper()\n        })\n      },\n      afterHide: () => {\n        if (unref(open)) return\n        // prevent the content from hiding if it's still open\n        onHide()\n      },\n    })\n\n    const onTransitionLeave = () => {\n      if (unref(open)) return\n      leaving.value = false\n      intermediateOpen.value = false\n    }\n\n    const stopWhenControlled = () => {\n      if (unref(controlled)) return true\n    }\n\n    const onContentEnter = composeEventHandlers(stopWhenControlled, () => {\n      if (props.enterable) {\n        onOpen()\n      }\n    })\n\n    const onContentLeave = composeEventHandlers(stopWhenControlled, () => {\n      if (unref(trigger) === 'hover') {\n        onClose()\n      }\n    })\n\n    return {\n      ariaHidden,\n      entering,\n      leaving,\n      id,\n      intermediateOpen,\n      contentStyle,\n      contentRef,\n      shouldRenderTeleport,\n      shouldRenderPopperContent,\n      shouldShowPopperContent,\n      open,\n      POPPER_CONTAINER_SELECTOR,\n      onContentEnter,\n      onContentLeave,\n      onTransitionLeave,\n    }\n  },\n})\n</script>\n"],"names":["_Transition","_toDisplayString"],"mappings":";;;;;;;;;;;;;;;;sBAIgBA;;0BAEZ;;;;;;;;;;gCAKkB;oBACb;;;oBAGA;oBACA;;;4BAGQ;0BACF,EAAE;;;;;;gCAMD;;;;;;;sCAKmBC;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"content.vue_vue_type_template_id_20254f8d_lang.js","sources":["../../../../../../packages/components/tooltip/src/content.vue?vue&type=template&id=20254f8d&lang.js"],"sourcesContent":["<template>\n  <teleport :disabled=\"!teleported\" :to=\"appendTo\">\n    <transition\n      :name=\"transition\"\n      @after-leave=\"onTransitionLeave\"\n      @before-enter=\"onBeforeEnter\"\n      @after-enter=\"onAfterShow\"\n    >\n      <el-popper-content\n        v-if=\"shouldRender\"\n        v-show=\"shouldShow\"\n        ref=\"contentRef\"\n        v-bind=\"$attrs\"\n        :aria-hidden=\"ariaHidden\"\n        :boundaries-padding=\"boundariesPadding\"\n        :fallback-placements=\"fallbackPlacements\"\n        :gpu-acceleration=\"gpuAcceleration\"\n        :offset=\"offset\"\n        :placement=\"placement\"\n        :popper-options=\"popperOptions\"\n        :strategy=\"strategy\"\n        :effect=\"effect\"\n        :enterable=\"enterable\"\n        :pure=\"pure\"\n        :popper-class=\"popperClass\"\n        :popper-style=\"[popperStyle, contentStyle]\"\n        :reference-el=\"referenceEl\"\n        :z-index=\"zIndex\"\n        @mouseenter=\"onContentEnter\"\n        @mouseleave=\"onContentLeave\"\n      >\n        <slot />\n        <el-visually-hidden :id=\"id\" role=\"tooltip\">\n          {{ ariaLabel }}\n        </el-visually-hidden>\n      </el-popper-content>\n    </transition>\n  </teleport>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, inject, ref, unref, watch } from 'vue'\nimport { onClickOutside } from '@vueuse/core'\nimport { ElPopperContent } from '@element-plus/components/popper'\nimport { ElVisuallyHidden } from '@element-plus/components/visual-hidden'\nimport { composeEventHandlers } from '@element-plus/utils/dom'\nimport { useEscapeKeydown } from '@element-plus/hooks'\n\nimport { useTooltipContentProps } from './tooltip'\nimport { TOOLTIP_INJECTION_KEY } from './tokens'\n\nexport default defineComponent({\n  name: 'ElTooltipContent',\n  components: {\n    ElPopperContent,\n    ElVisuallyHidden,\n  },\n  inheritAttrs: false,\n  props: useTooltipContentProps,\n  setup(props) {\n    const contentRef = ref<InstanceType<typeof ElPopperContent> | null>(null)\n    const intermediateOpen = ref(false)\n    const entering = ref(false)\n    const leaving = ref(false)\n    const { controlled, id, open, trigger, onClose, onOpen, onShow, onHide } =\n      inject(TOOLTIP_INJECTION_KEY, undefined)!\n    const persistentRef = computed(() => {\n      // For testing, we would always want the content to be rendered\n      // to the DOM, so we need to return true here.\n      if (process.env.NODE_ENV === 'test') {\n        return true\n      }\n      return props.persistent\n    })\n\n    const shouldRender = computed(() => {\n      return unref(persistentRef) ? true : unref(open)\n    })\n\n    const shouldShow = computed(() => {\n      return props.disabled ? false : unref(open)\n    })\n\n    const contentStyle = computed(() => (props.style ?? {}) as any)\n\n    const ariaHidden = computed(() => !unref(open))\n\n    useEscapeKeydown(onClose)\n\n    const onTransitionLeave = () => {\n      onHide()\n    }\n\n    const stopWhenControlled = () => {\n      if (unref(controlled)) return true\n    }\n\n    const onContentEnter = composeEventHandlers(stopWhenControlled, () => {\n      if (props.enterable && unref(trigger) === 'hover') {\n        onOpen()\n      }\n    })\n\n    const onContentLeave = composeEventHandlers(stopWhenControlled, () => {\n      if (unref(trigger) === 'hover') {\n        onClose()\n      }\n    })\n\n    const onBeforeEnter = () => {\n      contentRef.value?.updatePopper?.()\n    }\n\n    const onAfterShow = () => {\n      onShow()\n    }\n\n    let stopHandle: ReturnType<typeof onClickOutside>\n\n    watch(\n      () => unref(open),\n      (val) => {\n        if (val) {\n          stopHandle = onClickOutside(\n            computed(() => {\n              return contentRef.value?.popperContentRef\n            }),\n            () => {\n              if (unref(controlled)) return\n              const $trigger = unref(trigger)\n              if ($trigger !== 'hover') {\n                onClose()\n              }\n            }\n          )\n        } else {\n          stopHandle?.()\n        }\n      },\n      {\n        flush: 'post',\n      }\n    )\n\n    return {\n      ariaHidden,\n      entering,\n      leaving,\n      id,\n      intermediateOpen,\n      contentStyle,\n      contentRef,\n      shouldRender,\n      shouldShow,\n      open,\n      onAfterShow,\n      onBeforeEnter,\n      onContentEnter,\n      onContentLeave,\n      onTransitionLeave,\n    }\n  },\n})\n</script>\n"],"names":["_createVNode","_toDisplayString"],"mappings":";;;;;;;;;;;;;IACqCA;;;MAE9B;MACA,YAAW,EAAE;;MAEb;;;;;;;;;;mCASqB;gCACH;oBACV,aAAQ;uBACL;;cAET;;;;;4BAKY;4BACA;;+BAEA;+BACA,mBAAc;;;;;;oCAGgBC;;;;;;;;;;;;;;;;;"}

package/lib/components/tooltip/src/tokens.d.ts

@@ -10,5 +10,6 @@ export declare type ElTooltipInjectionContext = {
     onToggle: (e: Event) => void;
     onShow: () => void;
     onHide: () => void;
+    updatePopper: () => void;
 };
 export declare const TOOLTIP_INJECTION_KEY: InjectionKey<ElTooltipInjectionContext>;

package/lib/components/tooltip/src/tokens.js.map

@@ -1 +1 @@
-{"version":3,"file":"tokens.js","sources":["../../../../../../packages/components/tooltip/src/tokens.ts"],"sourcesContent":["import type { InjectionKey, Ref } from 'vue'\nimport type { Trigger } from './tooltip'\n\nexport type ElTooltipInjectionContext = {\n  controlled: Ref<boolean>\n  id: Ref<string>\n  open: Ref<boolean>\n  trigger: Ref<Trigger | Trigger[]>\n  onOpen: (e?: Event) => void\n  onClose: (e?: Event) => void\n  onToggle: (e: Event) => void\n  onShow: () => void\n  onHide: () => void\n}\n\nexport const TOOLTIP_INJECTION_KEY: InjectionKey<ElTooltipInjectionContext> =\n  Symbol('elTooltip')\n"],"names":[],"mappings":";;;;AAAY,MAAC,qBAAqB,GAAG,MAAM,CAAC,WAAW;;;;"}
+{"version":3,"file":"tokens.js","sources":["../../../../../../packages/components/tooltip/src/tokens.ts"],"sourcesContent":["import type { InjectionKey, Ref } from 'vue'\nimport type { Trigger } from './tooltip'\n\nexport type ElTooltipInjectionContext = {\n  controlled: Ref<boolean>\n  id: Ref<string>\n  open: Ref<boolean>\n  trigger: Ref<Trigger | Trigger[]>\n  onOpen: (e?: Event) => void\n  onClose: (e?: Event) => void\n  onToggle: (e: Event) => void\n  onShow: () => void\n  onHide: () => void\n  updatePopper: () => void\n}\n\nexport const TOOLTIP_INJECTION_KEY: InjectionKey<ElTooltipInjectionContext> =\n  Symbol('elTooltip')\n"],"names":[],"mappings":";;;;AAAY,MAAC,qBAAqB,GAAG,MAAM,CAAC,WAAW;;;;"}

package/lib/components/tooltip/src/tooltip.d.ts

@@ -2,6 +2,7 @@ import type { ExtractPropTypes, PropType } from 'vue';
 declare const triggers: readonly ["hover", "focus", "click", "contextmenu"];
 export declare type Trigger = typeof triggers[number];
 export declare const useTooltipContentProps: {
+    appendTo: import("element-plus/es/utils/props").BuildPropReturn<import("element-plus/es/utils/props").PropWrapper<string | HTMLElement>, string | (() => string) | undefined, unknown, unknown, unknown>;
     content: import("element-plus/es/utils/props").BuildPropReturn<StringConstructor, string | (() => string) | undefined, unknown, unknown, unknown>;
     rawContent: import("element-plus/es/utils/props").BuildPropReturn<BooleanConstructor, boolean | (() => false) | (() => true) | undefined, unknown, unknown, unknown>;
     persistent: BooleanConstructor;
@@ -9,6 +10,7 @@ export declare const useTooltipContentProps: {
     visible: import("element-plus/es/utils/props").BuildPropReturn<import("element-plus/es/utils/props").PropWrapper<boolean | null>, (() => null) | null | undefined, unknown, unknown, unknown>;
     transition: import("element-plus/es/utils/props").BuildPropReturn<StringConstructor, string | (() => string) | undefined, unknown, unknown, unknown>;
     teleported: import("element-plus/es/utils/props").BuildPropReturn<BooleanConstructor, boolean | (() => false) | (() => true) | undefined, unknown, unknown, unknown>;
+    disabled: import("element-plus/es/utils/props").BuildPropReturn<BooleanConstructor, boolean | (() => false) | (() => true) | undefined, unknown, unknown, unknown>;
     style: import("element-plus/es/utils/props").BuildPropReturn<import("element-plus/es/utils/props").PropWrapper<import("vue").StyleValue>, string | import("vue").CSSProperties | (() => string) | (() => import("vue").CSSProperties) | (() => import("vue").StyleValue[]) | undefined, unknown, unknown, unknown>;
     className: import("element-plus/es/utils/props").BuildPropReturn<import("element-plus/es/utils/props").PropWrapper<string | {
         [x: string]: any;

package/lib/components/tooltip/src/tooltip.js

@@ -7,12 +7,17 @@ require('../../popper/index.js');
 require('../../../hooks/index.js');
 var index = require('../../../hooks/use-delayed-toggle/index.js');
 var popper = require('../../popper/src/popper.js');
+var index$1 = require('../../../hooks/use-popper-container/index.js');
 
 const triggers = ["hover", "focus", "click", "contextmenu"];
 const useTooltipContentProps = {
   ...index.useDelayedToggleProps,
   ...popper.usePopperContentProps,
   ...props.buildProps({
+    appendTo: {
+      type: props.definePropType([String, Object]),
+      default: index$1.POPPER_CONTAINER_SELECTOR
+    },
     content: {
       type: String,
       default: ""
@@ -34,6 +39,9 @@ const useTooltipContentProps = {
     teleported: {
       type: Boolean,
       default: true
+    },
+    disabled: {
+      type: Boolean
     }
   })
 };

package/lib/components/tooltip/src/tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"tooltip.js","sources":["../../../../../../packages/components/tooltip/src/tooltip.ts"],"sourcesContent":["import { buildProps, definePropType } from '@element-plus/utils/props'\nimport {\n  usePopperTriggerProps,\n  usePopperContentProps,\n} from '@element-plus/components/popper'\nimport { useDelayedToggleProps } from '@element-plus/hooks'\n\nimport type { ExtractPropTypes, PropType } from 'vue'\n\nconst triggers = ['hover', 'focus', 'click', 'contextmenu'] as const\n\nexport type Trigger = typeof triggers[number]\n\nexport const useTooltipContentProps = {\n  ...useDelayedToggleProps,\n  ...usePopperContentProps,\n  ...buildProps({\n    content: {\n      type: String,\n      default: '',\n    },\n    rawContent: {\n      type: Boolean,\n      default: false,\n    },\n    persistent: Boolean,\n    ariaLabel: String,\n    // because model toggle prop is generated dynamically\n    // so the typing cannot be evaluated by typescript as type:\n    // [name]: { type: Boolean, default: null }\n    // so we need to declare that again for type checking.\n    visible: {\n      type: definePropType<boolean | null>(Boolean),\n      default: null,\n    },\n    transition: {\n      type: String,\n      default: 'el-fade-in-linear',\n    },\n    teleported: {\n      type: Boolean,\n      default: true,\n    },\n  }),\n}\n\nexport const useTooltipTriggerProps = {\n  ...usePopperTriggerProps,\n  disabled: Boolean,\n  trigger: {\n    type: [String, Array] as PropType<Trigger | Trigger[]>,\n    default: 'hover',\n  },\n}\n\nexport const useTooltipProps = buildProps({\n  openDelay: {\n    type: Number,\n  },\n  visibleArrow: {\n    type: Boolean,\n    default: undefined,\n  },\n  hideAfter: {\n    type: Number,\n    default: 200,\n  },\n  showArrow: {\n    type: Boolean,\n    default: true,\n  },\n})\n\nexport type ElTooltipContentProps = ExtractPropTypes<\n  typeof useTooltipContentProps\n>\n\nexport type ElTooltipTriggerProps = ExtractPropTypes<\n  typeof useTooltipTriggerProps\n>\n\nexport type ElTooltipProps = ExtractPropTypes<typeof useTooltipProps> &\n  ElTooltipContentProps &\n  ElTooltipTriggerProps\n"],"names":["useDelayedToggleProps","usePopperContentProps","buildProps","definePropType","usePopperTriggerProps"],"mappings":";;;;;;;;;;AAMA,MAAM,QAAQ,GAAG,CAAC,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,aAAa,CAAC,CAAC;AAChD,MAAC,sBAAsB,GAAG;AACtC,EAAE,GAAGA,2BAAqB;AAC1B,EAAE,GAAGC,4BAAqB;AAC1B,EAAE,GAAGC,gBAAU,CAAC;AAChB,IAAI,OAAO,EAAE;AACb,MAAM,IAAI,EAAE,MAAM;AAClB,MAAM,OAAO,EAAE,EAAE;AACjB,KAAK;AACL,IAAI,UAAU,EAAE;AAChB,MAAM,IAAI,EAAE,OAAO;AACnB,MAAM,OAAO,EAAE,KAAK;AACpB,KAAK;AACL,IAAI,UAAU,EAAE,OAAO;AACvB,IAAI,SAAS,EAAE,MAAM;AACrB,IAAI,OAAO,EAAE;AACb,MAAM,IAAI,EAAEC,oBAAc,CAAC,OAAO,CAAC;AACnC,MAAM,OAAO,EAAE,IAAI;AACnB,KAAK;AACL,IAAI,UAAU,EAAE;AAChB,MAAM,IAAI,EAAE,MAAM;AAClB,MAAM,OAAO,EAAE,mBAAmB;AAClC,KAAK;AACL,IAAI,UAAU,EAAE;AAChB,MAAM,IAAI,EAAE,OAAO;AACnB,MAAM,OAAO,EAAE,IAAI;AACnB,KAAK;AACL,GAAG,CAAC;AACJ,EAAE;AACU,MAAC,sBAAsB,GAAG;AACtC,EAAE,GAAGC,4BAAqB;AAC1B,EAAE,QAAQ,EAAE,OAAO;AACnB,EAAE,OAAO,EAAE;AACX,IAAI,IAAI,EAAE,CAAC,MAAM,EAAE,KAAK,CAAC;AACzB,IAAI,OAAO,EAAE,OAAO;AACpB,GAAG;AACH,EAAE;AACU,MAAC,eAAe,GAAGF,gBAAU,CAAC;AAC1C,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,MAAM;AAChB,GAAG;AACH,EAAE,YAAY,EAAE;AAChB,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,KAAK,CAAC;AACnB,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,GAAG;AAChB,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,CAAC;;;;;;"}
+{"version":3,"file":"tooltip.js","sources":["../../../../../../packages/components/tooltip/src/tooltip.ts"],"sourcesContent":["import { buildProps, definePropType } from '@element-plus/utils/props'\nimport {\n  usePopperTriggerProps,\n  usePopperContentProps,\n} from '@element-plus/components/popper'\nimport {\n  useDelayedToggleProps,\n  POPPER_CONTAINER_SELECTOR,\n} from '@element-plus/hooks'\n\nimport type { ExtractPropTypes, PropType } from 'vue'\n\nconst triggers = ['hover', 'focus', 'click', 'contextmenu'] as const\n\nexport type Trigger = typeof triggers[number]\n\nexport const useTooltipContentProps = {\n  ...useDelayedToggleProps,\n  ...usePopperContentProps,\n  ...buildProps({\n    appendTo: {\n      type: definePropType<string | HTMLElement>([String, Object]),\n      default: POPPER_CONTAINER_SELECTOR,\n    },\n    content: {\n      type: String,\n      default: '',\n    },\n    rawContent: {\n      type: Boolean,\n      default: false,\n    },\n    persistent: Boolean,\n    ariaLabel: String,\n    // because model toggle prop is generated dynamically\n    // so the typing cannot be evaluated by typescript as type:\n    // [name]: { type: Boolean, default: null }\n    // so we need to declare that again for type checking.\n    visible: {\n      type: definePropType<boolean | null>(Boolean),\n      default: null,\n    },\n    transition: {\n      type: String,\n      default: 'el-fade-in-linear',\n    },\n    teleported: {\n      type: Boolean,\n      default: true,\n    },\n    disabled: {\n      type: Boolean,\n    },\n  }),\n}\n\nexport const useTooltipTriggerProps = {\n  ...usePopperTriggerProps,\n  disabled: Boolean,\n  trigger: {\n    type: [String, Array] as PropType<Trigger | Trigger[]>,\n    default: 'hover',\n  },\n}\n\nexport const useTooltipProps = buildProps({\n  openDelay: {\n    type: Number,\n  },\n  visibleArrow: {\n    type: Boolean,\n    default: undefined,\n  },\n  hideAfter: {\n    type: Number,\n    default: 200,\n  },\n  showArrow: {\n    type: Boolean,\n    default: true,\n  },\n})\n\nexport type ElTooltipContentProps = ExtractPropTypes<\n  typeof useTooltipContentProps\n>\n\nexport type ElTooltipTriggerProps = ExtractPropTypes<\n  typeof useTooltipTriggerProps\n>\n\nexport type ElTooltipProps = ExtractPropTypes<typeof useTooltipProps> &\n  ElTooltipContentProps &\n  ElTooltipTriggerProps\n"],"names":["useDelayedToggleProps","usePopperContentProps","buildProps","definePropType","POPPER_CONTAINER_SELECTOR","usePopperTriggerProps"],"mappings":";;;;;;;;;;;AASA,MAAM,QAAQ,GAAG,CAAC,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,aAAa,CAAC,CAAC;AAChD,MAAC,sBAAsB,GAAG;AACtC,EAAE,GAAGA,2BAAqB;AAC1B,EAAE,GAAGC,4BAAqB;AAC1B,EAAE,GAAGC,gBAAU,CAAC;AAChB,IAAI,QAAQ,EAAE;AACd,MAAM,IAAI,EAAEC,oBAAc,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAC5C,MAAM,OAAO,EAAEC,iCAAyB;AACxC,KAAK;AACL,IAAI,OAAO,EAAE;AACb,MAAM,IAAI,EAAE,MAAM;AAClB,MAAM,OAAO,EAAE,EAAE;AACjB,KAAK;AACL,IAAI,UAAU,EAAE;AAChB,MAAM,IAAI,EAAE,OAAO;AACnB,MAAM,OAAO,EAAE,KAAK;AACpB,KAAK;AACL,IAAI,UAAU,EAAE,OAAO;AACvB,IAAI,SAAS,EAAE,MAAM;AACrB,IAAI,OAAO,EAAE;AACb,MAAM,IAAI,EAAED,oBAAc,CAAC,OAAO,CAAC;AACnC,MAAM,OAAO,EAAE,IAAI;AACnB,KAAK;AACL,IAAI,UAAU,EAAE;AAChB,MAAM,IAAI,EAAE,MAAM;AAClB,MAAM,OAAO,EAAE,mBAAmB;AAClC,KAAK;AACL,IAAI,UAAU,EAAE;AAChB,MAAM,IAAI,EAAE,OAAO;AACnB,MAAM,OAAO,EAAE,IAAI;AACnB,KAAK;AACL,IAAI,QAAQ,EAAE;AACd,MAAM,IAAI,EAAE,OAAO;AACnB,KAAK;AACL,GAAG,CAAC;AACJ,EAAE;AACU,MAAC,sBAAsB,GAAG;AACtC,EAAE,GAAGE,4BAAqB;AAC1B,EAAE,QAAQ,EAAE,OAAO;AACnB,EAAE,OAAO,EAAE;AACX,IAAI,IAAI,EAAE,CAAC,MAAM,EAAE,KAAK,CAAC;AACzB,IAAI,OAAO,EAAE,OAAO;AACpB,GAAG;AACH,EAAE;AACU,MAAC,eAAe,GAAGH,gBAAU,CAAC;AAC1C,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,MAAM;AAChB,GAAG;AACH,EAAE,YAAY,EAAE;AAChB,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,KAAK,CAAC;AACnB,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,GAAG;AAChB,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,CAAC;;;;;;"}

package/lib/components/tooltip/src/tooltip.vue.d.ts

@@ -11,6 +11,7 @@ declare const _default: import("vue").DefineComponent<{
     };
     virtualRef: import("../../../utils/props").BuildPropReturn<import("../../../utils/props").PropWrapper<import("element-plus/es/components/popper").Measurable>, unknown, unknown, unknown, unknown>;
     virtualTriggering: import("../../../utils/props").BuildPropReturn<BooleanConstructor, unknown, unknown, unknown, unknown>;
+    appendTo: import("../../../utils/props").BuildPropReturn<import("../../../utils/props").PropWrapper<string | HTMLElement>, string | (() => string) | undefined, unknown, unknown, unknown>;
     content: import("../../../utils/props").BuildPropReturn<StringConstructor, string | (() => string) | undefined, unknown, unknown, unknown>;
     rawContent: import("../../../utils/props").BuildPropReturn<BooleanConstructor, boolean | (() => false) | (() => true) | undefined, unknown, unknown, unknown>;
     persistent: BooleanConstructor;
@@ -187,6 +188,7 @@ declare const _default: import("vue").DefineComponent<{
     trigger?: unknown;
     virtualRef?: unknown;
     virtualTriggering?: unknown;
+    appendTo?: unknown;
     content?: unknown;
     rawContent?: unknown;
     persistent?: unknown;
@@ -284,6 +286,7 @@ declare const _default: import("vue").DefineComponent<{
     stopPopperMouseEvent: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     showAfter: number;
     hideAfter: number;
+    appendTo: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<string | HTMLElement>, unknown, unknown>;
     rawContent: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     persistent: boolean;
     teleported: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
@@ -370,6 +373,7 @@ declare const _default: import("vue").DefineComponent<{
     stopPopperMouseEvent: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     showAfter: number;
     hideAfter: number;
+    appendTo: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<string | HTMLElement>, unknown, unknown>;
     rawContent: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     persistent: boolean;
     teleported: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;

package/lib/components/tooltip/src/tooltip.vue_vue_type_script_lang.js

@@ -90,7 +90,8 @@ var script = vue.defineComponent({
       },
       onHide: () => {
         emit("hide");
-      }
+      },
+      updatePopper
     });
     return {
       compatShowAfter,

package/lib/components/tooltip/src/tooltip.vue_vue_type_script_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"tooltip.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/tooltip/src/tooltip.vue"],"sourcesContent":["<template>\n  <el-popper ref=\"popperRef\">\n    <el-tooltip-trigger\n      :disabled=\"disabled\"\n      :trigger=\"trigger\"\n      :virtual-ref=\"virtualRef\"\n      :virtual-triggering=\"virtualTriggering\"\n    >\n      <slot v-if=\"$slots.default\" />\n    </el-tooltip-trigger>\n    <el-tooltip-content\n      :aria-label=\"ariaLabel\"\n      :boundaries-padding=\"boundariesPadding\"\n      :content=\"content\"\n      :effect=\"effect\"\n      :enterable=\"enterable\"\n      :fallback-placements=\"fallbackPlacements\"\n      :hide-after=\"hideAfter\"\n      :gpu-acceleration=\"gpuAcceleration\"\n      :offset=\"offset\"\n      :persistent=\"persistent\"\n      :popper-class=\"popperClass\"\n      :popper-style=\"popperStyle\"\n      :placement=\"placement\"\n      :popper-options=\"popperOptions\"\n      :pure=\"pure\"\n      :raw-content=\"rawContent\"\n      :reference-el=\"referenceEl\"\n      :show-after=\"compatShowAfter\"\n      :strategy=\"strategy\"\n      :teleported=\"teleported\"\n      :transition=\"transition\"\n      :z-index=\"zIndex\"\n    >\n      <slot name=\"content\">\n        <span v-if=\"rawContent\" v-html=\"content\"></span>\n        <span v-else>{{ content }}</span>\n      </slot>\n      <el-popper-arrow v-if=\"compatShowArrow\" :arrow-offset=\"arrowOffset\" />\n    </el-tooltip-content>\n  </el-popper>\n</template>\n\n<script lang=\"ts\">\nimport {\n  defineComponent,\n  computed,\n  ref,\n  provide,\n  toRef,\n  readonly,\n  unref,\n} from 'vue'\nimport {\n  ElPopper,\n  ElPopperArrow,\n  usePopperArrowProps,\n} from '@element-plus/components/popper'\n\nimport { debugWarn } from '@element-plus/utils/error'\nimport { isBool, isUndefined } from '@element-plus/utils/util'\nimport {\n  usePopperContainer,\n  useId,\n  createModelToggleComposable,\n  useDelayedToggle,\n} from '@element-plus/hooks'\nimport ElTooltipContent from './content.vue'\nimport ElTooltipTrigger from './trigger.vue'\nimport {\n  useTooltipContentProps,\n  useTooltipTriggerProps,\n  useTooltipProps,\n} from './tooltip'\nimport { TOOLTIP_INJECTION_KEY } from './tokens'\n\nconst { useModelToggleProps, useModelToggle, useModelToggleEmits } =\n  createModelToggleComposable('visible' as const)\n\nexport default defineComponent({\n  name: 'ElTooltip',\n  components: {\n    ElPopper,\n    ElPopperArrow,\n    ElTooltipContent,\n    ElTooltipTrigger,\n  },\n  props: {\n    ...useModelToggleProps,\n    ...useTooltipContentProps,\n    ...useTooltipTriggerProps,\n    ...usePopperArrowProps,\n    ...useTooltipProps,\n  },\n  emits: [...useModelToggleEmits, 'show', 'hide'],\n  setup(props, { emit }) {\n    usePopperContainer()\n    const compatShowAfter = computed(() => {\n      if (!isUndefined(props.openDelay)) {\n        debugWarn(\n          'ElTooltip',\n          'open-delay is about to be deprecated in the next major version, please use `show-after` instead'\n        )\n      }\n      return props.openDelay || (props.showAfter as number)\n    })\n    const compatShowArrow = computed(() => {\n      if (!isUndefined(props.visibleArrow)) {\n        debugWarn(\n          'ElTooltip',\n          '`visible-arrow` is about to be deprecated in the next major version, please use `show-arrow` instead'\n        )\n      }\n      return isBool(props.visibleArrow) ? props.visibleArrow : props.showArrow\n    })\n\n    const id = useId()\n    const popperRef = ref<InstanceType<typeof ElPopper> | null>(null)\n\n    const updatePopper = () => {\n      const popperComponent = unref(popperRef)\n      if (popperComponent) {\n        popperComponent.popperInstanceRef?.update()\n      }\n    }\n    const open = ref(false)\n\n    const { show, hide } = useModelToggle({\n      indicator: open,\n    })\n\n    const { onOpen, onClose } = useDelayedToggle({\n      showAfter: compatShowAfter,\n      hideAfter: toRef(props, 'hideAfter'),\n      open: show,\n      close: hide,\n    })\n\n    const controlled = computed(() => isBool(props.visible))\n\n    provide(TOOLTIP_INJECTION_KEY, {\n      controlled,\n      id,\n      open: readonly(open),\n      trigger: toRef(props, 'trigger'),\n      onOpen,\n      onClose,\n      onToggle: () => {\n        if (unref(open)) {\n          onClose()\n        } else {\n          onOpen()\n        }\n      },\n      onShow: () => {\n        emit('show')\n      },\n      onHide: () => {\n        emit('hide')\n      },\n    })\n\n    return {\n      compatShowAfter,\n      compatShowArrow,\n      popperRef,\n      open,\n      updatePopper,\n      onOpen,\n      onClose,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","ElPopper","ElTooltipContent","ElTooltipTrigger","useTooltipContentProps","useTooltipTriggerProps","useTooltipProps","usePopperContainer","computed","isUndefined","useId","ref","useDelayedToggle","toRef","provide","readonly","unref"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAyEA,QAAQ;AACR,aAAeA,oBAAgB;;AAE/B,EAAE,UAAU,EAAE;cACVC,gBAAQ;;AAEZ,sBAAIC,2CAAgB;sBAChBC;GACD;OACI,EAAE;IACL,GAAG;IACH,GAAGC;IACH,GAAGC;;IAEH,GAAGC;;OAEA,EAAE,CAAC,GAAG;OACN,CAAC,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE;IACrBC,0BAAkB,EAAE,CAAC;IACrB,MAAM;;uBAEO,CAAC,WAAW,EAAE;OACxB;MACD,OAAO,KAAK,CAAC;KACd,CAAC,CAAC;UACG,eAAe,GAAGC,YAAQ,CAAC;UAC3B,CAACC;uBACM,CAAC;;;MAGZ;UACI,KAAKC,aAAK,EAAE,CAAC;IACnB;IACA,MAAM,YAAY,SAAS;MACzB,IAAI,EAAE,CAAC;YACD;UACF;WACC,GAAG,gBAAgB,iBAAiB,SAAS,SAAS,GAAG,GAAG,MAAM,GAAG;;MAE1E;UACI,IAAI,GAAGC,OAAG,CAAC,KAAK,CAAC,CAAC;IACxB;;KAEC,CAAC,CAAC;IACH,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,GAAGC,wBAAgB,CAAC;;MAE3C,SAAS,EAAEC,UAAM,KAAK;MACtB,IAAI,EAAE,IAAI;MACV,KAAK,EAAE,IAAI;;;IAGbC;MACE;;MAEA,IAAI,EAAEC,YAAQ,CAAC,IAAI;MACnB,OAAO,EAAEF,SAAK,CAAC;;;MAGf,QAAQ,EAAE,MAAM;QACd,IAAIG,SAAK,CAAC,IAAI,CAAC,EAAE;UACf,OAAO,EAAE,CAAC;SACX,MAAM;UACL,MAAM;;;MAGV,MAAM,EAAE;;OAEP;MACD,MAAM,EAAE;QACN;OACD;MACD,CAAC;WACI;MACL;MACA;eACS;UACL;;YAEE;;MAEN;;;;;;"}
+{"version":3,"file":"tooltip.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/tooltip/src/tooltip.vue"],"sourcesContent":["<template>\n  <el-popper ref=\"popperRef\">\n    <el-tooltip-trigger\n      :disabled=\"disabled\"\n      :trigger=\"trigger\"\n      :virtual-ref=\"virtualRef\"\n      :virtual-triggering=\"virtualTriggering\"\n    >\n      <slot v-if=\"$slots.default\" />\n    </el-tooltip-trigger>\n    <el-tooltip-content\n      :aria-label=\"ariaLabel\"\n      :boundaries-padding=\"boundariesPadding\"\n      :content=\"content\"\n      :disabled=\"disabled\"\n      :effect=\"effect\"\n      :enterable=\"enterable\"\n      :fallback-placements=\"fallbackPlacements\"\n      :hide-after=\"hideAfter\"\n      :gpu-acceleration=\"gpuAcceleration\"\n      :offset=\"offset\"\n      :persistent=\"persistent\"\n      :popper-class=\"popperClass\"\n      :popper-style=\"popperStyle\"\n      :placement=\"placement\"\n      :popper-options=\"popperOptions\"\n      :pure=\"pure\"\n      :raw-content=\"rawContent\"\n      :reference-el=\"referenceEl\"\n      :show-after=\"compatShowAfter\"\n      :strategy=\"strategy\"\n      :teleported=\"teleported\"\n      :transition=\"transition\"\n      :z-index=\"zIndex\"\n    >\n      <slot name=\"content\">\n        <span v-if=\"rawContent\" v-html=\"content\"></span>\n        <span v-else>{{ content }}</span>\n      </slot>\n      <el-popper-arrow v-if=\"compatShowArrow\" :arrow-offset=\"arrowOffset\" />\n    </el-tooltip-content>\n  </el-popper>\n</template>\n\n<script lang=\"ts\">\nimport {\n  defineComponent,\n  computed,\n  ref,\n  provide,\n  toRef,\n  readonly,\n  unref,\n} from 'vue'\nimport {\n  ElPopper,\n  ElPopperArrow,\n  usePopperArrowProps,\n} from '@element-plus/components/popper'\n\nimport { debugWarn } from '@element-plus/utils/error'\nimport { isBool, isUndefined } from '@element-plus/utils/util'\nimport {\n  usePopperContainer,\n  useId,\n  createModelToggleComposable,\n  useDelayedToggle,\n} from '@element-plus/hooks'\nimport ElTooltipContent from './content.vue'\nimport ElTooltipTrigger from './trigger.vue'\nimport {\n  useTooltipContentProps,\n  useTooltipTriggerProps,\n  useTooltipProps,\n} from './tooltip'\nimport { TOOLTIP_INJECTION_KEY } from './tokens'\n\nconst { useModelToggleProps, useModelToggle, useModelToggleEmits } =\n  createModelToggleComposable('visible' as const)\n\nexport default defineComponent({\n  name: 'ElTooltip',\n  components: {\n    ElPopper,\n    ElPopperArrow,\n    ElTooltipContent,\n    ElTooltipTrigger,\n  },\n  props: {\n    ...useModelToggleProps,\n    ...useTooltipContentProps,\n    ...useTooltipTriggerProps,\n    ...usePopperArrowProps,\n    ...useTooltipProps,\n  },\n  emits: [...useModelToggleEmits, 'show', 'hide'],\n  setup(props, { emit }) {\n    usePopperContainer()\n    const compatShowAfter = computed(() => {\n      if (!isUndefined(props.openDelay)) {\n        debugWarn(\n          'ElTooltip',\n          'open-delay is about to be deprecated in the next major version, please use `show-after` instead'\n        )\n      }\n      return props.openDelay || (props.showAfter as number)\n    })\n    const compatShowArrow = computed(() => {\n      if (!isUndefined(props.visibleArrow)) {\n        debugWarn(\n          'ElTooltip',\n          '`visible-arrow` is about to be deprecated in the next major version, please use `show-arrow` instead'\n        )\n      }\n      return isBool(props.visibleArrow) ? props.visibleArrow : props.showArrow\n    })\n\n    const id = useId()\n    const popperRef = ref<InstanceType<typeof ElPopper> | null>(null)\n\n    const updatePopper = () => {\n      const popperComponent = unref(popperRef)\n      if (popperComponent) {\n        popperComponent.popperInstanceRef?.update()\n      }\n    }\n    const open = ref(false)\n\n    const { show, hide } = useModelToggle({\n      indicator: open,\n    })\n\n    const { onOpen, onClose } = useDelayedToggle({\n      showAfter: compatShowAfter,\n      hideAfter: toRef(props, 'hideAfter'),\n      open: show,\n      close: hide,\n    })\n\n    const controlled = computed(() => isBool(props.visible))\n\n    provide(TOOLTIP_INJECTION_KEY, {\n      controlled,\n      id,\n      open: readonly(open),\n      trigger: toRef(props, 'trigger'),\n      onOpen,\n      onClose,\n      onToggle: () => {\n        if (unref(open)) {\n          onClose()\n        } else {\n          onOpen()\n        }\n      },\n      onShow: () => {\n        emit('show')\n      },\n      onHide: () => {\n        emit('hide')\n      },\n      updatePopper,\n    })\n\n    return {\n      compatShowAfter,\n      compatShowArrow,\n      popperRef,\n      open,\n      updatePopper,\n      onOpen,\n      onClose,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","ElPopper","ElTooltipContent","ElTooltipTrigger","useTooltipContentProps","useTooltipTriggerProps","useTooltipProps","usePopperContainer","computed","isUndefined","useId","ref","useDelayedToggle","toRef","provide","readonly","unref"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AA0EA,QAAQ;AACR,aAAeA,oBAAgB;;AAE/B,EAAE,UAAU,EAAE;cACVC,gBAAQ;;AAEZ,sBAAIC,2CAAgB;sBAChBC;GACD;OACI,EAAE;IACL,GAAG;IACH,GAAGC;IACH,GAAGC;;IAEH,GAAGC;;OAEA,EAAE,CAAC,GAAG;OACN,CAAC,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE;IACrBC,0BAAkB,EAAE,CAAC;IACrB,MAAM;;uBAEO,CAAC,WAAW,EAAE;OACxB;MACD,OAAO,KAAK,CAAC;KACd,CAAC,CAAC;UACG,eAAe,GAAGC,YAAQ,CAAC;UAC3B,CAACC;uBACM,CAAC;;;MAGZ;UACI,KAAKC,aAAK,EAAE,CAAC;IACnB;IACA,MAAM,YAAY,SAAS;MACzB,IAAI,EAAE,CAAC;YACD;UACF;WACC,GAAG,gBAAgB,iBAAiB,SAAS,SAAS,GAAG,GAAG,MAAM,GAAG;;MAE1E;UACI,IAAI,GAAGC,OAAG,CAAC,KAAK,CAAC,CAAC;IACxB;;KAEC,CAAC,CAAC;IACH,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,GAAGC,wBAAgB,CAAC;;MAE3C,SAAS,EAAEC,UAAM,KAAK;MACtB,IAAI,EAAE,IAAI;MACV,KAAK,EAAE,IAAI;;;IAGbC;MACE;;MAEA,IAAI,EAAEC,YAAQ,CAAC,IAAI;MACnB,OAAO,EAAEF,SAAK,CAAC;;;MAGf,QAAQ,EAAE,MAAM;QACd,IAAIG,SAAK,CAAC,IAAI,CAAC,EAAE;UACf,OAAO,EAAE,CAAC;SACX,MAAM;UACL,MAAM;;;MAGV,MAAM,EAAE;;OAEP;MACD,MAAM,EAAE;QACN;OACD;MACD,YAAY;MACZ,CAAC;WACI;MACL;qBACe;eACN;UACL;;;MAGJ;MACA;;;;;;"}

package/lib/components/tooltip/src/tooltip.vue_vue_type_template_id_694d1617_lang.js

@@ -28,6 +28,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
         "aria-label": _ctx.ariaLabel,
         "boundaries-padding": _ctx.boundariesPadding,
         content: _ctx.content,
+        disabled: _ctx.disabled,
         effect: _ctx.effect,
         enterable: _ctx.enterable,
         "fallback-placements": _ctx.fallbackPlacements,
@@ -61,7 +62,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
           }, null, 8, ["arrow-offset"])) : vue.createCommentVNode("v-if", true)
         ]),
         _: 3
-      }, 8, ["aria-label", "boundaries-padding", "content", "effect", "enterable", "fallback-placements", "hide-after", "gpu-acceleration", "offset", "persistent", "popper-class", "popper-style", "placement", "popper-options", "pure", "raw-content", "reference-el", "show-after", "strategy", "teleported", "transition", "z-index"])
+      }, 8, ["aria-label", "boundaries-padding", "content", "disabled", "effect", "enterable", "fallback-placements", "hide-after", "gpu-acceleration", "offset", "persistent", "popper-class", "popper-style", "placement", "popper-options", "pure", "raw-content", "reference-el", "show-after", "strategy", "teleported", "transition", "z-index"])
     ]),
     _: 3
   }, 512);

package/lib/components/tooltip/src/tooltip.vue_vue_type_template_id_694d1617_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"tooltip.vue_vue_type_template_id_694d1617_lang.js","sources":["../../../../../../packages/components/tooltip/src/tooltip.vue?vue&type=template&id=694d1617&lang.js"],"sourcesContent":["<template>\n  <el-popper ref=\"popperRef\">\n    <el-tooltip-trigger\n      :disabled=\"disabled\"\n      :trigger=\"trigger\"\n      :virtual-ref=\"virtualRef\"\n      :virtual-triggering=\"virtualTriggering\"\n    >\n      <slot v-if=\"$slots.default\" />\n    </el-tooltip-trigger>\n    <el-tooltip-content\n      :aria-label=\"ariaLabel\"\n      :boundaries-padding=\"boundariesPadding\"\n      :content=\"content\"\n      :effect=\"effect\"\n      :enterable=\"enterable\"\n      :fallback-placements=\"fallbackPlacements\"\n      :hide-after=\"hideAfter\"\n      :gpu-acceleration=\"gpuAcceleration\"\n      :offset=\"offset\"\n      :persistent=\"persistent\"\n      :popper-class=\"popperClass\"\n      :popper-style=\"popperStyle\"\n      :placement=\"placement\"\n      :popper-options=\"popperOptions\"\n      :pure=\"pure\"\n      :raw-content=\"rawContent\"\n      :reference-el=\"referenceEl\"\n      :show-after=\"compatShowAfter\"\n      :strategy=\"strategy\"\n      :teleported=\"teleported\"\n      :transition=\"transition\"\n      :z-index=\"zIndex\"\n    >\n      <slot name=\"content\">\n        <span v-if=\"rawContent\" v-html=\"content\"></span>\n        <span v-else>{{ content }}</span>\n      </slot>\n      <el-popper-arrow v-if=\"compatShowArrow\" :arrow-offset=\"arrowOffset\" />\n    </el-tooltip-content>\n  </el-popper>\n</template>\n\n<script lang=\"ts\">\nimport {\n  defineComponent,\n  computed,\n  ref,\n  provide,\n  toRef,\n  readonly,\n  unref,\n} from 'vue'\nimport {\n  ElPopper,\n  ElPopperArrow,\n  usePopperArrowProps,\n} from '@element-plus/components/popper'\n\nimport { debugWarn } from '@element-plus/utils/error'\nimport { isBool, isUndefined } from '@element-plus/utils/util'\nimport {\n  usePopperContainer,\n  useId,\n  createModelToggleComposable,\n  useDelayedToggle,\n} from '@element-plus/hooks'\nimport ElTooltipContent from './content.vue'\nimport ElTooltipTrigger from './trigger.vue'\nimport {\n  useTooltipContentProps,\n  useTooltipTriggerProps,\n  useTooltipProps,\n} from './tooltip'\nimport { TOOLTIP_INJECTION_KEY } from './tokens'\n\nconst { useModelToggleProps, useModelToggle, useModelToggleEmits } =\n  createModelToggleComposable('visible' as const)\n\nexport default defineComponent({\n  name: 'ElTooltip',\n  components: {\n    ElPopper,\n    ElPopperArrow,\n    ElTooltipContent,\n    ElTooltipTrigger,\n  },\n  props: {\n    ...useModelToggleProps,\n    ...useTooltipContentProps,\n    ...useTooltipTriggerProps,\n    ...usePopperArrowProps,\n    ...useTooltipProps,\n  },\n  emits: [...useModelToggleEmits, 'show', 'hide'],\n  setup(props, { emit }) {\n    usePopperContainer()\n    const compatShowAfter = computed(() => {\n      if (!isUndefined(props.openDelay)) {\n        debugWarn(\n          'ElTooltip',\n          'open-delay is about to be deprecated in the next major version, please use `show-after` instead'\n        )\n      }\n      return props.openDelay || (props.showAfter as number)\n    })\n    const compatShowArrow = computed(() => {\n      if (!isUndefined(props.visibleArrow)) {\n        debugWarn(\n          'ElTooltip',\n          '`visible-arrow` is about to be deprecated in the next major version, please use `show-arrow` instead'\n        )\n      }\n      return isBool(props.visibleArrow) ? props.visibleArrow : props.showArrow\n    })\n\n    const id = useId()\n    const popperRef = ref<InstanceType<typeof ElPopper> | null>(null)\n\n    const updatePopper = () => {\n      const popperComponent = unref(popperRef)\n      if (popperComponent) {\n        popperComponent.popperInstanceRef?.update()\n      }\n    }\n    const open = ref(false)\n\n    const { show, hide } = useModelToggle({\n      indicator: open,\n    })\n\n    const { onOpen, onClose } = useDelayedToggle({\n      showAfter: compatShowAfter,\n      hideAfter: toRef(props, 'hideAfter'),\n      open: show,\n      close: hide,\n    })\n\n    const controlled = computed(() => isBool(props.visible))\n\n    provide(TOOLTIP_INJECTION_KEY, {\n      controlled,\n      id,\n      open: readonly(open),\n      trigger: toRef(props, 'trigger'),\n      onOpen,\n      onClose,\n      onToggle: () => {\n        if (unref(open)) {\n          onClose()\n        } else {\n          onOpen()\n        }\n      },\n      onShow: () => {\n        emit('show')\n      },\n      onHide: () => {\n        emit('hide')\n      },\n    })\n\n    return {\n      compatShowAfter,\n      compatShowArrow,\n      popperRef,\n      open,\n      updatePopper,\n      onOpen,\n      onClose,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;sBAEI;;QACG;;QAEA;;;;uBAGkB;;;;;;;QAGlB,4BAAqB;QACrB;QACA;QACA,MAAM,EAAE,WAAM;QACd;QACA,qBAAmB;QACnB,cAAY;QACZ;QACA;QACA,UAAU;QACV;QACA,cAAY,EAAE,gBAAW;QACzB;QACA;QACA;QACA;QACA,gBAAc;;QAEd;sCACsB;;iBAEf,EAAE;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"tooltip.vue_vue_type_template_id_694d1617_lang.js","sources":["../../../../../../packages/components/tooltip/src/tooltip.vue?vue&type=template&id=694d1617&lang.js"],"sourcesContent":["<template>\n  <el-popper ref=\"popperRef\">\n    <el-tooltip-trigger\n      :disabled=\"disabled\"\n      :trigger=\"trigger\"\n      :virtual-ref=\"virtualRef\"\n      :virtual-triggering=\"virtualTriggering\"\n    >\n      <slot v-if=\"$slots.default\" />\n    </el-tooltip-trigger>\n    <el-tooltip-content\n      :aria-label=\"ariaLabel\"\n      :boundaries-padding=\"boundariesPadding\"\n      :content=\"content\"\n      :disabled=\"disabled\"\n      :effect=\"effect\"\n      :enterable=\"enterable\"\n      :fallback-placements=\"fallbackPlacements\"\n      :hide-after=\"hideAfter\"\n      :gpu-acceleration=\"gpuAcceleration\"\n      :offset=\"offset\"\n      :persistent=\"persistent\"\n      :popper-class=\"popperClass\"\n      :popper-style=\"popperStyle\"\n      :placement=\"placement\"\n      :popper-options=\"popperOptions\"\n      :pure=\"pure\"\n      :raw-content=\"rawContent\"\n      :reference-el=\"referenceEl\"\n      :show-after=\"compatShowAfter\"\n      :strategy=\"strategy\"\n      :teleported=\"teleported\"\n      :transition=\"transition\"\n      :z-index=\"zIndex\"\n    >\n      <slot name=\"content\">\n        <span v-if=\"rawContent\" v-html=\"content\"></span>\n        <span v-else>{{ content }}</span>\n      </slot>\n      <el-popper-arrow v-if=\"compatShowArrow\" :arrow-offset=\"arrowOffset\" />\n    </el-tooltip-content>\n  </el-popper>\n</template>\n\n<script lang=\"ts\">\nimport {\n  defineComponent,\n  computed,\n  ref,\n  provide,\n  toRef,\n  readonly,\n  unref,\n} from 'vue'\nimport {\n  ElPopper,\n  ElPopperArrow,\n  usePopperArrowProps,\n} from '@element-plus/components/popper'\n\nimport { debugWarn } from '@element-plus/utils/error'\nimport { isBool, isUndefined } from '@element-plus/utils/util'\nimport {\n  usePopperContainer,\n  useId,\n  createModelToggleComposable,\n  useDelayedToggle,\n} from '@element-plus/hooks'\nimport ElTooltipContent from './content.vue'\nimport ElTooltipTrigger from './trigger.vue'\nimport {\n  useTooltipContentProps,\n  useTooltipTriggerProps,\n  useTooltipProps,\n} from './tooltip'\nimport { TOOLTIP_INJECTION_KEY } from './tokens'\n\nconst { useModelToggleProps, useModelToggle, useModelToggleEmits } =\n  createModelToggleComposable('visible' as const)\n\nexport default defineComponent({\n  name: 'ElTooltip',\n  components: {\n    ElPopper,\n    ElPopperArrow,\n    ElTooltipContent,\n    ElTooltipTrigger,\n  },\n  props: {\n    ...useModelToggleProps,\n    ...useTooltipContentProps,\n    ...useTooltipTriggerProps,\n    ...usePopperArrowProps,\n    ...useTooltipProps,\n  },\n  emits: [...useModelToggleEmits, 'show', 'hide'],\n  setup(props, { emit }) {\n    usePopperContainer()\n    const compatShowAfter = computed(() => {\n      if (!isUndefined(props.openDelay)) {\n        debugWarn(\n          'ElTooltip',\n          'open-delay is about to be deprecated in the next major version, please use `show-after` instead'\n        )\n      }\n      return props.openDelay || (props.showAfter as number)\n    })\n    const compatShowArrow = computed(() => {\n      if (!isUndefined(props.visibleArrow)) {\n        debugWarn(\n          'ElTooltip',\n          '`visible-arrow` is about to be deprecated in the next major version, please use `show-arrow` instead'\n        )\n      }\n      return isBool(props.visibleArrow) ? props.visibleArrow : props.showArrow\n    })\n\n    const id = useId()\n    const popperRef = ref<InstanceType<typeof ElPopper> | null>(null)\n\n    const updatePopper = () => {\n      const popperComponent = unref(popperRef)\n      if (popperComponent) {\n        popperComponent.popperInstanceRef?.update()\n      }\n    }\n    const open = ref(false)\n\n    const { show, hide } = useModelToggle({\n      indicator: open,\n    })\n\n    const { onOpen, onClose } = useDelayedToggle({\n      showAfter: compatShowAfter,\n      hideAfter: toRef(props, 'hideAfter'),\n      open: show,\n      close: hide,\n    })\n\n    const controlled = computed(() => isBool(props.visible))\n\n    provide(TOOLTIP_INJECTION_KEY, {\n      controlled,\n      id,\n      open: readonly(open),\n      trigger: toRef(props, 'trigger'),\n      onOpen,\n      onClose,\n      onToggle: () => {\n        if (unref(open)) {\n          onClose()\n        } else {\n          onOpen()\n        }\n      },\n      onShow: () => {\n        emit('show')\n      },\n      onHide: () => {\n        emit('hide')\n      },\n      updatePopper,\n    })\n\n    return {\n      compatShowAfter,\n      compatShowArrow,\n      popperRef,\n      open,\n      updatePopper,\n      onOpen,\n      onClose,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;sBAEI;;QACG;;QAEA;;;;uBAGkB;;;;;;;QAGlB;QACA;QACA;QACA;QACA,MAAM,EAAE,WAAM;QACd;QACA,qBAAmB;QACnB,cAAY;QACZ;QACA;QACA,UAAU;QACV;QACA,cAAY,EAAE,gBAAW;QACzB;QACA;QACA;QACA;QACA,gBAAc;;QAEd;sCACsB;;iBAEf,EAAE;;;;;;;;;;;;;;;;;;"}

package/lib/components/tooltip/src/trigger.vue.d.ts

@@ -12,7 +12,7 @@ declare const _default: import("vue").DefineComponent<{
     onFocus: (event: Event) => void;
     onMouseenter: (event: Event) => void;
     onMouseleave: (event: Event) => void;
-    onMousedown: (event: Event) => void;
+    onClick: (event: Event) => void;
     onKeydown: (event: KeyboardEvent) => void;
     open: import("vue").Ref<boolean>;
     id: import("vue").Ref<string>;

package/lib/components/tooltip/src/trigger.vue_vue_type_script_lang.js

@@ -28,7 +28,7 @@ var script = vue.defineComponent({
     const trigger = vue.toRef(props, "trigger");
     const onMouseenter = dom.composeEventHandlers(stopWhenControlledOrDisabled, utils.whenTrigger(trigger, "hover", onOpen));
     const onMouseleave = dom.composeEventHandlers(stopWhenControlledOrDisabled, utils.whenTrigger(trigger, "hover", onClose));
-    const onMousedown = dom.composeEventHandlers(stopWhenControlledOrDisabled, utils.whenTrigger(trigger, "click", (e) => {
+    const onClick = dom.composeEventHandlers(stopWhenControlledOrDisabled, utils.whenTrigger(trigger, "click", (e) => {
       if (e.button === 0) {
         onToggle(e);
       }
@@ -51,7 +51,7 @@ var script = vue.defineComponent({
       onFocus,
       onMouseenter,
       onMouseleave,
-      onMousedown,
+      onClick,
       onKeydown,
       open,
       id,