element-plus/es/components/tooltip/src/content.mjs.map

A Component Library for Vue 3

{"version":3,"file":"content.mjs","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'\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":[],"mappings":";;;;;;;;;;;;;;AAmDA,MAAK,YAAa,gBAAa;AAAA,EAC7B,MAAM;AAAA,EACN,YAAY;AAAA,IACV;AAAA,IACA;AAAA;AAAA,EAEF,cAAc;AAAA,EACd,OAAO;AAAA,EACP,MAAM,OAAO;AACX,UAAM,aAAa,IAAiD;AACpE,UAAM,mBAAmB,IAAI;AAC7B,UAAM,WAAW,IAAI;AACrB,UAAM,UAAU,IAAI;AACpB,UAAM,EAAE,YAAY,IAAI,MAAM,SAAS,SAAS,QAAQ,QAAQ,WAC9D,OAAO,uBAAuB;AAChC,UAAM,gBAAgB,SAAS,MAAM;AAGnC,UAAI,QAAQ,IAAI,aAAa,QAAQ;AACnC,eAAO;AAAA;AAET,aAAO,MAAM;AAAA;AAGf,UAAM,eAAe,SAAS,MAAM;AAClC,aAAO,MAAM,iBAAiB,OAAO,MAAM;AAAA;AAG7C,UAAM,aAAa,SAAS,MAAM;AAChC,aAAO,MAAM,WAAW,QAAQ,MAAM;AAAA;AAGxC,UAAM,eAAe,SAAS,MAAO;AAErC,UAAM;AAEN;AAEA;AACE;AAAA;AAGF,UAAM;AACJ;AAAuB;AAAO;AAGhC,UAAM,iBAAiB;AACrB;AACE;AAAA;AAAA;AAIJ;AACE;AACE;AAAA;AAAA;AAIJ;AACE;AAAkB;AAGpB,UAAM;AACJ;AAAA;AAGF;AAEA,UACE,oBACC;AACC,eAAS;AACP;AAEI;AAAyB;AAGzB;AAAuB;AACvB,gBAAM;AACN;AACE;AAAA;AAAA;AAAA;AAKN;AAAA;AAAA;AAGJ;AACS;AAIX;AAAO;AACL;AACA,MACA;AAAA,MACA;AAAA;AACA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA;AAAA;;;;;;AA9JmC;;AACrC;AACmB;AAChB,oBACY;AAAE,MACd,eAAa;AAAA;;;AAGM;;AAEd;AACI;AACI,6BACO;AAAA;AACG,UACrB;AAAkB,UAClB;AAAc;AACH,UACX;AAAc,UACd;AAAkB,UAClB;AAAQ,UACR;AAAW,UACX;AAAU,UACV;AAAA,UACA,gBAAY;AAAG,UACf;AAAyB,UACzB;AAAS,UACT,gBAAY;AAAA,UACZ;AAAY;;;AAEL;AAGa;AAFM;AAAO;;;;;;;;;eAtB1B;AAAU;;;;;;;;;;;;;;;;"}