hongluan-ui
Version:
Hongluan Component Library for Vue 3
1 lines • 4.08 kB
Source Map (JSON)
{"version":3,"file":"popover2.mjs","sources":["../../../../../../packages/components/popover/src/popover.vue"],"sourcesContent":["<template>\n <hl-tooltip\n ref=\"tooltipRef\"\n v-bind=\"$attrs\"\n :trigger=\"finalTrigger\"\n :placement=\"placement\"\n :disabled=\"disabled\"\n :visible=\"visible\"\n :transition=\"transition\"\n :popper-options=\"popperOptions\"\n :outside-ignore=\"outsideIgnore\"\n :tabindex=\"tabindex\"\n :append-to-body=\"appendToBody\"\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=\"compatTeleported\"\n :persistent=\"persistent\"\n :gpu-acceleration=\"gpuAcceleration\"\n :trigger-keys=\"triggerKeys\"\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\"></slot>\n </template>\n\n <template #content>\n <div v-if=\"title\" class=\"popover-title\" role=\"title\">\n {{ title }}\n </div>\n <slot>\n {{ content }}\n </slot>\n </template>\n </hl-tooltip>\n</template>\n<script lang=\"ts\" setup>\nimport { computed, ref, unref } from 'vue'\nimport { HlTooltip } from '@hongluan-ui/components/tooltip'\nimport { useDeprecateAppendToBody } from '@hongluan-ui/components/popper'\nimport { isString } from '@hongluan-ui/utils'\nimport { useNamespace } from '@hongluan-ui/hooks'\nimport { popoverEmits, popoverProps } from './popover'\n\nimport type { TooltipInstance } from '@hongluan-ui/components/tooltip'\nimport type { StyleValue } from 'vue'\n\ndefineOptions({\n name: 'Popover',\n inheritAttrs: false,\n})\n\nconst props = defineProps(popoverProps)\nconst emit = defineEmits(popoverEmits)\n\nconst { namespace } = useNamespace('popover')\nconst tooltipRef = ref<TooltipInstance>()\nconst popperRef = computed(() => {\n return unref(tooltipRef)?.popperRef\n})\n\nconst width = computed(() => {\n if (isString(props.width)) {\n return props.width as string\n }\n return `${props.width}px`\n})\n\nconst style = computed(() => {\n return [\n {\n width: width.value,\n },\n props.popperStyle,\n ] as StyleValue\n})\n\nconst kls = computed(() => {\n return [namespace.value, props.popperClass, { 'plain': !!props.content }, props.tooltip ? 'tooltip' : '']\n})\n\nconst gpuAcceleration = computed(() => {\n return props.transition === 'fade'\n})\n\nconst finalTrigger = computed(() => {\n return props.tooltip ? 'hover' : props.trigger\n})\n\nconst { compatTeleported } = useDeprecateAppendToBody('Popover', 'appendToBody')\n\nconst updateEventKeyRaw = `onUpdate:visible` as const\n\nconst onUpdateVisible = computed(() => {\n return props[updateEventKeyRaw]\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\n"],"names":[],"mappings":";;;;;;;;;;;oCA2Dc;AAAA,EACZ,MAAM;AAAA,EACN,cAAc;AAChB;;;;;;;AAKA,UAAM,EAAE,cAAc,aAAa,SAAS;AAC5C,UAAM,aAAa;AACnB,UAAM,YAAY,SAAS,MAAM;AAC/B,aAAO;AAAmB;AAG5B;AACE,UAAI,uBAAuB;AACzB;AAAa;AAEf;AAAgB;AAGlB;AACE;AAAO;AACL;AACe;AACf;AACM;AACR;AAGF;AACE,aAAO,WAAW,OAAO;AAA+E;AAG1G;AACE;AAA4B;AAG9B;AACE;AAAuC;AAGzC;AAIA,UAAM,kBAAkB;AACtB;AAAa;AAGf;AACE,iBAAW;AAAY;AAGzB;AACE;AAAmB,IACrB;AACA,UAAM;AACJ;AAAmB,IACrB;AAEA,UAAM;AACJ;AAAkB,IACpB;AAEA,UAAM;AACJ;AACA;AAAkB;AAGpB,WAAa;AAAA,MAEX;AAAA;AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}