element-plus
Version:
A Component Library for Vue 3
1 lines • 3.12 kB
Source Map (JSON)
{"version":3,"file":"popover2.mjs","names":[],"sources":["../../../../../../packages/components/popover/src/popover.vue"],"sourcesContent":["<template>\n <el-tooltip\n ref=\"tooltipRef\"\n v-bind=\"$attrs\"\n :trigger=\"trigger\"\n :trigger-keys=\"triggerKeys\"\n :placement=\"placement\"\n :disabled=\"disabled\"\n :visible=\"visible\"\n :transition=\"transition\"\n :popper-options=\"popperOptions\"\n :tabindex=\"tabindex\"\n :content=\"content\"\n :offset=\"offset\"\n :show-after=\"showAfter\"\n :hide-after=\"hideAfter\"\n :auto-close=\"autoClose\"\n :show-arrow=\"showArrow\"\n :aria-label=\"title\"\n :effect=\"effect\"\n :enterable=\"enterable\"\n :popper-class=\"kls\"\n :popper-style=\"style\"\n :teleported=\"teleported\"\n :append-to=\"appendTo\"\n :persistent=\"persistent\"\n :gpu-acceleration=\"gpuAcceleration\"\n @update:visible=\"onUpdateVisible\"\n @before-show=\"beforeEnter\"\n @before-hide=\"beforeLeave\"\n @show=\"afterEnter\"\n @hide=\"afterLeave\"\n >\n <template v-if=\"$slots.reference\">\n <slot name=\"reference\" />\n </template>\n\n <template #content>\n <div v-if=\"title\" :class=\"ns.e('title')\" role=\"title\">\n {{ title }}\n </div>\n <slot :hide=\"hide\">\n {{ content }}\n </slot>\n </template>\n </el-tooltip>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, ref, unref } from 'vue'\nimport { ElTooltip } from '@element-plus/components/tooltip'\nimport { addUnit } from '@element-plus/utils'\nimport { useNamespace } from '@element-plus/hooks'\nimport { popoverEmits, popoverPropsDefaults } from './popover'\n\nimport type { TooltipInstance } from '@element-plus/components/tooltip'\nimport type { PopoverProps } from './popover'\n\ndefineOptions({\n name: 'ElPopover',\n})\n\nconst props = withDefaults(defineProps<PopoverProps>(), popoverPropsDefaults)\nconst emit = defineEmits(popoverEmits)\n\nconst updateEventKeyRaw = `onUpdate:visible` as const\n\nconst onUpdateVisible = computed(() => {\n return props[updateEventKeyRaw]\n})\n\nconst ns = useNamespace('popover')\nconst tooltipRef = ref<TooltipInstance>()\nconst popperRef = computed(() => {\n return unref(tooltipRef)?.popperRef\n})\n\nconst style = computed(() => {\n return [\n {\n width: addUnit(props.width),\n },\n props.popperStyle!,\n ]\n})\n\nconst kls = computed(() => {\n return [ns.b(), props.popperClass!, { [ns.m('plain')]: !!props.content }]\n})\n\nconst gpuAcceleration = computed(() => {\n return props.transition === `${ns.namespace.value}-fade-in-linear`\n})\n\nconst hide = () => {\n tooltipRef.value?.hide()\n}\n\nconst beforeEnter = () => {\n emit('before-enter')\n}\nconst beforeLeave = () => {\n emit('before-leave')\n}\n\nconst afterEnter = () => {\n emit('after-enter')\n}\n\nconst afterLeave = () => {\n emit('update:visible', false)\n emit('after-leave')\n}\n\ndefineExpose({\n /** @description popper ref */\n popperRef,\n /** @description hide popover */\n hide,\n})\n</script>\n"],"mappings":""}