content2.js 6.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183
  1. 'use strict';
  2. Object.defineProperty(exports, '__esModule', { value: true });
  3. var vue = require('vue');
  4. var core = require('@vueuse/core');
  5. require('../../../hooks/index.js');
  6. require('../../../utils/index.js');
  7. require('../../popper/index.js');
  8. require('../../../tokens/index.js');
  9. var content = require('./content.js');
  10. var pluginVue_exportHelper = require('../../../_virtual/plugin-vue_export-helper.js');
  11. var index = require('../../../hooks/use-popper-container/index.js');
  12. var tooltip = require('../../../tokens/tooltip.js');
  13. var event = require('../../../utils/dom/event.js');
  14. var content$1 = require('../../popper/src/content2.js');
  15. const __default__ = vue.defineComponent({
  16. name: "ElTooltipContent",
  17. inheritAttrs: false
  18. });
  19. const _sfc_main = /* @__PURE__ */ vue.defineComponent({
  20. ...__default__,
  21. props: content.useTooltipContentProps,
  22. setup(__props, { expose }) {
  23. const props = __props;
  24. const { selector } = index.usePopperContainerId();
  25. const contentRef = vue.ref(null);
  26. const destroyed = vue.ref(false);
  27. const {
  28. controlled,
  29. id,
  30. open,
  31. trigger,
  32. onClose,
  33. onOpen,
  34. onShow,
  35. onHide,
  36. onBeforeShow,
  37. onBeforeHide
  38. } = vue.inject(tooltip.TOOLTIP_INJECTION_KEY, void 0);
  39. const persistentRef = vue.computed(() => {
  40. if (process.env.NODE_ENV === "test") {
  41. return true;
  42. }
  43. return props.persistent;
  44. });
  45. vue.onBeforeUnmount(() => {
  46. destroyed.value = true;
  47. });
  48. const shouldRender = vue.computed(() => {
  49. return vue.unref(persistentRef) ? true : vue.unref(open);
  50. });
  51. const shouldShow = vue.computed(() => {
  52. return props.disabled ? false : vue.unref(open);
  53. });
  54. const appendTo = vue.computed(() => {
  55. return props.appendTo || selector.value;
  56. });
  57. const contentStyle = vue.computed(() => {
  58. var _a;
  59. return (_a = props.style) != null ? _a : {};
  60. });
  61. const ariaHidden = vue.computed(() => !vue.unref(open));
  62. const onTransitionLeave = () => {
  63. onHide();
  64. };
  65. const stopWhenControlled = () => {
  66. if (vue.unref(controlled))
  67. return true;
  68. };
  69. const onContentEnter = event.composeEventHandlers(stopWhenControlled, () => {
  70. if (props.enterable && vue.unref(trigger) === "hover") {
  71. onOpen();
  72. }
  73. });
  74. const onContentLeave = event.composeEventHandlers(stopWhenControlled, () => {
  75. if (vue.unref(trigger) === "hover") {
  76. onClose();
  77. }
  78. });
  79. const onBeforeEnter = () => {
  80. var _a, _b;
  81. (_b = (_a = contentRef.value) == null ? void 0 : _a.updatePopper) == null ? void 0 : _b.call(_a);
  82. onBeforeShow == null ? void 0 : onBeforeShow();
  83. };
  84. const onBeforeLeave = () => {
  85. onBeforeHide == null ? void 0 : onBeforeHide();
  86. };
  87. const onAfterShow = () => {
  88. onShow();
  89. stopHandle = core.onClickOutside(vue.computed(() => {
  90. var _a;
  91. return (_a = contentRef.value) == null ? void 0 : _a.popperContentRef;
  92. }), () => {
  93. if (vue.unref(controlled))
  94. return;
  95. const $trigger = vue.unref(trigger);
  96. if ($trigger !== "hover") {
  97. onClose();
  98. }
  99. });
  100. };
  101. const onBlur = () => {
  102. if (!props.virtualTriggering) {
  103. onClose();
  104. }
  105. };
  106. let stopHandle;
  107. vue.watch(() => vue.unref(open), (val) => {
  108. if (!val) {
  109. stopHandle == null ? void 0 : stopHandle();
  110. }
  111. }, {
  112. flush: "post"
  113. });
  114. vue.watch(() => props.content, () => {
  115. var _a, _b;
  116. (_b = (_a = contentRef.value) == null ? void 0 : _a.updatePopper) == null ? void 0 : _b.call(_a);
  117. });
  118. expose({
  119. contentRef
  120. });
  121. return (_ctx, _cache) => {
  122. return vue.openBlock(), vue.createBlock(vue.Teleport, {
  123. disabled: !_ctx.teleported,
  124. to: vue.unref(appendTo)
  125. }, [
  126. vue.createVNode(vue.Transition, {
  127. name: _ctx.transition,
  128. onAfterLeave: onTransitionLeave,
  129. onBeforeEnter,
  130. onAfterEnter: onAfterShow,
  131. onBeforeLeave
  132. }, {
  133. default: vue.withCtx(() => [
  134. vue.unref(shouldRender) ? vue.withDirectives((vue.openBlock(), vue.createBlock(vue.unref(content$1["default"]), vue.mergeProps({
  135. key: 0,
  136. id: vue.unref(id),
  137. ref_key: "contentRef",
  138. ref: contentRef
  139. }, _ctx.$attrs, {
  140. "aria-label": _ctx.ariaLabel,
  141. "aria-hidden": vue.unref(ariaHidden),
  142. "boundaries-padding": _ctx.boundariesPadding,
  143. "fallback-placements": _ctx.fallbackPlacements,
  144. "gpu-acceleration": _ctx.gpuAcceleration,
  145. offset: _ctx.offset,
  146. placement: _ctx.placement,
  147. "popper-options": _ctx.popperOptions,
  148. strategy: _ctx.strategy,
  149. effect: _ctx.effect,
  150. enterable: _ctx.enterable,
  151. pure: _ctx.pure,
  152. "popper-class": _ctx.popperClass,
  153. "popper-style": [_ctx.popperStyle, vue.unref(contentStyle)],
  154. "reference-el": _ctx.referenceEl,
  155. "trigger-target-el": _ctx.triggerTargetEl,
  156. visible: vue.unref(shouldShow),
  157. "z-index": _ctx.zIndex,
  158. onMouseenter: vue.unref(onContentEnter),
  159. onMouseleave: vue.unref(onContentLeave),
  160. onBlur,
  161. onClose: vue.unref(onClose)
  162. }), {
  163. default: vue.withCtx(() => [
  164. !destroyed.value ? vue.renderSlot(_ctx.$slots, "default", { key: 0 }) : vue.createCommentVNode("v-if", true)
  165. ]),
  166. _: 3
  167. }, 16, ["id", "aria-label", "aria-hidden", "boundaries-padding", "fallback-placements", "gpu-acceleration", "offset", "placement", "popper-options", "strategy", "effect", "enterable", "pure", "popper-class", "popper-style", "reference-el", "trigger-target-el", "visible", "z-index", "onMouseenter", "onMouseleave", "onClose"])), [
  168. [vue.vShow, vue.unref(shouldShow)]
  169. ]) : vue.createCommentVNode("v-if", true)
  170. ]),
  171. _: 3
  172. }, 8, ["name"])
  173. ], 8, ["disabled", "to"]);
  174. };
  175. }
  176. });
  177. var ElTooltipContent = /* @__PURE__ */ pluginVue_exportHelper["default"](_sfc_main, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/tooltip/src/content.vue"]]);
  178. exports["default"] = ElTooltipContent;
  179. //# sourceMappingURL=content2.js.map