element-plus
Version:
A Component Library for Vue 3
1 lines • 8.56 kB
Source Map (JSON)
{"version":3,"file":"notification.vue2.mjs","sources":["../../../../../../packages/components/notification/src/notification.vue"],"sourcesContent":["<template>\n <transition\n :name=\"ns.b('fade')\"\n @before-leave=\"onClose\"\n @after-leave=\"$emit('destroy')\"\n >\n <div\n v-show=\"visible\"\n :id=\"id\"\n :class=\"[ns.b(), customClass, horizontalClass]\"\n :style=\"positionStyle\"\n role=\"alert\"\n @mouseenter=\"clearTimer\"\n @mouseleave=\"startTimer\"\n @click=\"onClick\"\n >\n <el-icon v-if=\"iconComponent\" :class=\"[ns.e('icon'), typeClass]\">\n <component :is=\"iconComponent\" />\n </el-icon>\n <div :class=\"ns.e('group')\">\n <h2 :class=\"ns.e('title')\" v-text=\"title\" />\n <div\n v-show=\"message\"\n :class=\"ns.e('content')\"\n :style=\"!!title ? undefined : { margin: 0 }\"\n >\n <slot>\n <p v-if=\"!dangerouslyUseHTMLString\">{{ message }}</p>\n <!-- Caution here, message could've been compromised, never use user's input as message -->\n <p v-else v-html=\"message\" />\n </slot>\n </div>\n <el-icon v-if=\"showClose\" :class=\"ns.e('closeBtn')\" @click.stop=\"close\">\n <component :is=\"closeIcon\" />\n </el-icon>\n </div>\n </div>\n </transition>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, markRaw, onMounted, ref } from 'vue'\nimport { useEventListener, useTimeoutFn } from '@vueuse/core'\nimport { TypeComponentsMap, getEventCode } from '@element-plus/utils'\nimport { EVENT_CODE } from '@element-plus/constants'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { useGlobalComponentSettings } from '@element-plus/components/config-provider'\nimport { notificationEmits } from './notification'\nimport { Close } from '@element-plus/icons-vue'\n\nimport type { CSSProperties } from 'vue'\nimport type { NotificationProps } from './notification'\n\ndefineOptions({\n name: 'ElNotification',\n})\n\nconst props = withDefaults(defineProps<NotificationProps>(), {\n customClass: '',\n duration: 4500,\n id: '',\n message: '',\n offset: 0,\n onClick: () => undefined,\n position: 'top-right',\n showClose: true,\n title: '',\n type: '',\n closeIcon: markRaw(Close),\n})\ndefineEmits(notificationEmits)\n\nconst { ns, zIndex } = useGlobalComponentSettings('notification')\nconst { nextZIndex, currentZIndex } = zIndex\n\nconst visible = ref(false)\nlet timer: (() => void) | undefined = undefined\n\nconst typeClass = computed(() => {\n const type = props.type\n return type && TypeComponentsMap[props.type] ? ns.m(type) : ''\n})\n\nconst iconComponent = computed(() => {\n if (!props.type) return props.icon\n return TypeComponentsMap[props.type] || props.icon\n})\n\nconst horizontalClass = computed(() =>\n props.position.endsWith('right') ? 'right' : 'left'\n)\n\nconst verticalProperty = computed(() =>\n props.position.startsWith('top') ? 'top' : 'bottom'\n)\n\nconst positionStyle = computed<CSSProperties>(() => {\n return {\n [verticalProperty.value]: `${props.offset}px`,\n zIndex: props.zIndex ?? currentZIndex.value,\n }\n})\n\nfunction startTimer() {\n if (props.duration > 0) {\n ;({ stop: timer } = useTimeoutFn(() => {\n if (visible.value) close()\n }, props.duration))\n }\n}\n\nfunction clearTimer() {\n timer?.()\n}\n\nfunction close() {\n visible.value = false\n}\n\nfunction onKeydown(event: KeyboardEvent) {\n const code = getEventCode(event)\n\n switch (code) {\n case EVENT_CODE.delete:\n case EVENT_CODE.backspace:\n clearTimer() // press delete/backspace clear timer\n break\n case EVENT_CODE.esc:\n // press esc to close the notification\n if (visible.value) {\n close()\n }\n break\n default: // resume timer\n startTimer()\n break\n }\n}\n\n// lifecycle\nonMounted(() => {\n startTimer()\n nextZIndex()\n visible.value = true\n})\n\nuseEventListener(document, 'keydown', onKeydown)\n\ndefineExpose({\n visible,\n /** @description close notification */\n close,\n})\n</script>\n"],"names":["_createBlock","_Transition","_unref","$emit","_createElementVNode","_normalizeClass","_openBlock","_resolveDynamicComponent","_toDisplayString","_normalizeStyle","_renderSlot","_createElementBlock","_Fragment","_createCommentVNode"],"mappings":"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"}