UNPKG

element-plus

Version:

A Component Library for Vue 3

1 lines 10.5 kB
{"version":3,"file":"message.vue2.mjs","sources":["../../../../../../packages/components/message/src/message.vue"],"sourcesContent":["<template>\n <transition\n :name=\"ns.b('fade')\"\n @before-enter=\"isStartTransition = true\"\n @before-leave=\"onClose\"\n @after-leave=\"$emit('destroy')\"\n >\n <div\n v-show=\"visible\"\n :id=\"id\"\n ref=\"messageRef\"\n :class=\"[\n ns.b(),\n { [ns.m(type)]: type },\n ns.is('closable', showClose),\n ns.is('plain', plain),\n ns.is('bottom', verticalProperty === 'bottom'),\n horizontalClass,\n customClass,\n ]\"\n :style=\"customStyle\"\n role=\"alert\"\n @mouseenter=\"clearTimer\"\n @mouseleave=\"startTimer\"\n >\n <el-badge\n v-if=\"repeatNum > 1\"\n :value=\"repeatNum\"\n :type=\"badgeType\"\n :class=\"ns.e('badge')\"\n />\n <el-icon v-if=\"iconComponent\" :class=\"[ns.e('icon'), typeClass]\">\n <component :is=\"iconComponent\" />\n </el-icon>\n <slot>\n <p v-if=\"!dangerouslyUseHTMLString\" :class=\"ns.e('content')\">\n {{ message }}\n </p>\n <!-- Caution here, message could've been compromised, never use user's input as message -->\n <p v-else :class=\"ns.e('content')\" v-html=\"message\" />\n </slot>\n <el-icon v-if=\"showClose\" :class=\"ns.e('closeBtn')\" @click.stop=\"close\">\n <Close />\n </el-icon>\n </div>\n </transition>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, nextTick, onMounted, ref, watch } from 'vue'\nimport { useEventListener, useResizeObserver, useTimeoutFn } from '@vueuse/core'\nimport {\n TypeComponents,\n TypeComponentsMap,\n getEventCode,\n} from '@element-plus/utils'\nimport { EVENT_CODE } from '@element-plus/constants'\nimport ElBadge from '@element-plus/components/badge'\nimport { useGlobalComponentSettings } from '@element-plus/components/config-provider'\nimport { ElIcon } from '@element-plus/components/icon'\nimport {\n MESSAGE_DEFAULT_PLACEMENT,\n messageDefaults,\n messageEmits,\n} from './message'\nimport { getLastOffset, getOffsetOrSpace } from './instance'\nimport { omit } from 'lodash-unified'\n\nimport type { BadgeProps } from '@element-plus/components/badge'\nimport type { CSSProperties } from 'vue'\nimport type { MessageProps } from './message'\n\nconst { Close } = TypeComponents\n\ndefineOptions({\n name: 'ElMessage',\n})\n\nconst props = withDefaults(\n defineProps<MessageProps>(),\n omit(messageDefaults, 'appendTo')\n)\nconst emit = defineEmits(messageEmits)\n\nconst isStartTransition = ref(false)\n\nconst { ns, zIndex } = useGlobalComponentSettings('message')\nconst { currentZIndex, nextZIndex } = zIndex\n\nconst messageRef = ref<HTMLDivElement>()\nconst visible = ref(false)\nconst height = ref(0)\n\nlet stopTimer: (() => void) | undefined = undefined\n\nconst badgeType = computed<BadgeProps['type']>(() =>\n props.type ? (props.type === 'error' ? 'danger' : props.type) : 'info'\n)\nconst typeClass = computed(() => {\n const type = props.type\n return { [ns.bm('icon', type)]: type && TypeComponentsMap[type] }\n})\nconst iconComponent = computed(\n () => props.icon || TypeComponentsMap[props.type] || ''\n)\n\nconst placement = computed(() => props.placement || MESSAGE_DEFAULT_PLACEMENT)\n\nconst lastOffset = computed(() => getLastOffset(props.id, placement.value))\nconst offset = computed(() => {\n return (\n getOffsetOrSpace(props.id, props.offset, placement.value) + lastOffset.value\n )\n})\nconst bottom = computed(() => height.value + offset.value)\nconst horizontalClass = computed(() => {\n if (placement.value.includes('left')) return ns.is('left')\n if (placement.value.includes('right')) return ns.is('right')\n return ns.is('center')\n})\n\nconst verticalProperty = computed(() =>\n placement.value.startsWith('top') ? 'top' : 'bottom'\n)\n\nconst customStyle = computed<CSSProperties>(() => ({\n [verticalProperty.value]: `${offset.value}px`,\n zIndex: currentZIndex.value,\n}))\n\nfunction startTimer() {\n if (props.duration === 0) return\n ;({ stop: stopTimer } = useTimeoutFn(() => {\n close()\n }, props.duration))\n}\n\nfunction clearTimer() {\n stopTimer?.()\n}\n\nfunction close() {\n visible.value = false\n\n // if the message has never started a transition, we can destroy it immediately\n nextTick(() => {\n if (!isStartTransition.value) {\n props.onClose?.()\n emit('destroy')\n }\n })\n}\n\nfunction keydown(event: KeyboardEvent) {\n const code = getEventCode(event)\n if (code === EVENT_CODE.esc) {\n // press esc to close the message\n close()\n }\n}\n\nonMounted(() => {\n startTimer()\n nextZIndex()\n visible.value = true\n})\n\nwatch(\n () => props.repeatNum,\n () => {\n clearTimer()\n startTimer()\n }\n)\n\nuseEventListener(document, 'keydown', keydown)\n\nuseResizeObserver(messageRef, () => {\n height.value = messageRef.value!.getBoundingClientRect().height\n})\n\ndefineExpose({\n visible,\n bottom,\n close,\n})\n</script>\n"],"names":["_createBlock","_Transition","_unref","$emit","_createElementVNode","_normalizeClass","_openBlock","_resolveDynamicComponent","_renderSlot","_createElementBlock","_Fragment","_createCommentVNode","_createVNode"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAwEA,IAAA,MAAM,EAAE,OAAM,GAAI,cAAA;AAMlB,IAAA,MAAM,KAAA,GAAQ,OAAA;AAId,IAAA,MAAM,IAAA,GAAO,MAAA;AAEb,IAAA,MAAM,iBAAA,GAAoB,IAAI,KAAK,CAAA;AAEnC,IAAA,MAAM,EAAE,EAAA,EAAI,MAAA,EAAO,GAAI,2BAA2B,SAAS,CAAA;AAC3D,IAAA,MAAM,EAAE,aAAA,EAAe,UAAA,EAAW,GAAI,MAAA;AAEtC,IAAA,MAAM,aAAa,GAAA,EAAoB;AACvC,IAAA,MAAM,OAAA,GAAU,IAAI,KAAK,CAAA;AACzB,IAAA,MAAM,MAAA,GAAS,IAAI,CAAC,CAAA;AAEpB,IAAA,IAAI,SAAA,GAAsC,MAAA;AAE1C,IAAA,MAAM,SAAA,GAAY,QAAA;AAAA,MAA6B,MAC7C,MAAM,IAAA,GAAQ,KAAA,CAAM,SAAS,OAAA,GAAU,QAAA,GAAW,MAAM,IAAA,GAAQ;AAAA,KAClE;AACA,IAAA,MAAM,SAAA,GAAY,SAAS,MAAM;AAC/B,MAAA,MAAM,OAAO,KAAA,CAAM,IAAA;AACnB,MAAA,OAAO,EAAE,CAAC,EAAA,CAAG,EAAA,CAAG,MAAA,EAAQ,IAAI,CAAC,GAAG,IAAA,IAAQ,iBAAA,CAAkB,IAAI,CAAA,EAAE;AAAA,IAClE,CAAC,CAAA;AACD,IAAA,MAAM,aAAA,GAAgB,QAAA;AAAA,MACpB,MAAM,KAAA,CAAM,IAAA,IAAQ,iBAAA,CAAkB,KAAA,CAAM,IAAI,CAAA,IAAK;AAAA,KACvD;AAEA,IAAA,MAAM,SAAA,GAAY,QAAA,CAAS,MAAM,KAAA,CAAM,aAAa,yBAAyB,CAAA;AAE7E,IAAA,MAAM,UAAA,GAAa,SAAS,MAAM,aAAA,CAAc,MAAM,EAAA,EAAI,SAAA,CAAU,KAAK,CAAC,CAAA;AAC1E,IAAA,MAAM,MAAA,GAAS,SAAS,MAAM;AAC5B,MAAA,OACE,gBAAA,CAAiB,MAAM,EAAA,EAAI,KAAA,CAAM,QAAQ,SAAA,CAAU,KAAK,IAAI,UAAA,CAAW,KAAA;AAAA,IAE3E,CAAC,CAAA;AACD,IAAA,MAAM,SAAS,QAAA,CAAS,MAAM,MAAA,CAAO,KAAA,GAAQ,OAAO,KAAK,CAAA;AACzD,IAAA,MAAM,eAAA,GAAkB,SAAS,MAAM;AACrC,MAAA,IAAI,SAAA,CAAU,MAAM,QAAA,CAAS,MAAM,GAAG,OAAO,EAAA,CAAG,GAAG,MAAM,CAAA;AACzD,MAAA,IAAI,SAAA,CAAU,MAAM,QAAA,CAAS,OAAO,GAAG,OAAO,EAAA,CAAG,GAAG,OAAO,CAAA;AAC3D,MAAA,OAAO,EAAA,CAAG,GAAG,QAAQ,CAAA;AAAA,IACvB,CAAC,CAAA;AAED,IAAA,MAAM,gBAAA,GAAmB,QAAA;AAAA,MAAS,MAChC,SAAA,CAAU,KAAA,CAAM,UAAA,CAAW,KAAK,IAAI,KAAA,GAAQ;AAAA,KAC9C;AAEA,IAAA,MAAM,WAAA,GAAc,SAAwB,OAAO;AAAA,MACjD,CAAC,gBAAA,CAAiB,KAAK,GAAG,CAAA,EAAG,OAAO,KAAK,CAAA,EAAA,CAAA;AAAA,MACzC,QAAQ,aAAA,CAAc;AAAA,KACxB,CAAE,CAAA;AAEF,IAAA,SAAS,UAAA,GAAa;AACpB,MAAA,IAAI,KAAA,CAAM,aAAa,CAAA,EAAG;AACzB,MAAA,CAAC,EAAE,IAAA,EAAM,SAAA,EAAU,GAAI,aAAa,MAAM;AACzC,QAAA,KAAA,EAAM;AAAA,MACR,CAAA,EAAG,MAAM,QAAQ,CAAA;AAAA,IACnB;AAEA,IAAA,SAAS,UAAA,GAAa;AACpB,MAAA,SAAA,IAAA,IAAA,GAAA,MAAA,GAAA,SAAA,EAAA;AAAA,IACF;AAEA,IAAA,SAAS,KAAA,GAAQ;AACf,MAAA,OAAA,CAAQ,KAAA,GAAQ,KAAA;AAGhB,MAAA,QAAA,CAAS,MAAM;;AACb,QAAA,IAAI,CAAC,kBAAkB,KAAA,EAAO;AAC5B,UAAA,CAAA,EAAA,GAAA,KAAA,CAAM,OAAA,KAAN,IAAA,GAAA,MAAA,GAAA,EAAA,CAAA,IAAA,CAAA,KAAA,CAAA;AACA,UAAA,IAAA,CAAK,SAAS,CAAA;AAAA,QAChB;AAAA,MACF,CAAC,CAAA;AAAA,IACH;AAEA,IAAA,SAAS,QAAQ,KAAA,EAAsB;AACrC,MAAA,MAAM,IAAA,GAAO,aAAa,KAAK,CAAA;AAC/B,MAAA,IAAI,IAAA,KAAS,WAAW,GAAA,EAAK;AAE3B,QAAA,KAAA,EAAM;AAAA,MACR;AAAA,IACF;AAEA,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,UAAA,EAAW;AACX,MAAA,UAAA,EAAW;AACX,MAAA,OAAA,CAAQ,KAAA,GAAQ,IAAA;AAAA,IAClB,CAAC,CAAA;AAED,IAAA,KAAA;AAAA,MACE,MAAM,KAAA,CAAM,SAAA;AAAA,MACZ,MAAM;AACJ,QAAA,UAAA,EAAW;AACX,QAAA,UAAA,EAAW;AAAA,MACb;AAAA,KACF;AAEA,IAAA,gBAAA,CAAiB,QAAA,EAAU,WAAW,OAAO,CAAA;AAE7C,IAAA,iBAAA,CAAkB,YAAY,MAAM;AAClC,MAAA,MAAA,CAAO,KAAA,GAAQ,UAAA,CAAW,KAAA,CAAO,qBAAA,EAAsB,CAAE,MAAA;AAAA,IAC3D,CAAC,CAAA;AAED,IAAA,QAAA,CAAa;AAAA,MACX,OAAA;AAAA,MACA,MAAA;AAAA,MACA;AAAA,KACD,CAAA;;0BAxLCA,WAAA,CA4CaC,UAAA,EAAA;AAAA,QA3CV,IAAA,EAAMC,KAAA,CAAA,EAAA,CAAA,CAAG,EAAC,MAAA,CAAA;AAAA,QACV,aAAA,wCAAc,iBAAA,CAAA,KAAA,GAAiB,IAAA,CAAA;AAAA,QAC/B,eAAc,OAAA,CAAA,OAAA;AAAA,QACd,YAAA,wCAAaC,IAAAA,CAAAA,KAAAA,CAAK,SAAA,CAAA,CAAA;AAAA,QAJrB,SAAA,EAAA;AAAA;yBAME,MAqCM;AAAA,yBArCNC,mBAqCM,KAAA,EAAA;AAAA,YAnCH,IAAI,OAAA,CAAA,EAAA;AAAA,qBACD,YAAA;AAAA,YAAJ,GAAA,EAAI,UAAA;AAAA,YACH,OAAKC,cAAA,CAAA;AAAA,cAAYH,KAAA,CAAA,EAAA,CAAA,CAAG,CAAA,EAAC;AAAA,cAAe,EAAA,CAAAA,KAAA,CAAA,EAAA,CAAA,CAAG,CAAA,CAAE,OAAA,CAAA,IAAI,IAAI,OAAA,CAAA,IAAA,EAAI;AAAA,cAAYA,MAAA,EAAA,CAAA,CAAG,EAAA,CAAE,UAAA,EAAa,QAAA,SAAS,CAAA;AAAA,cAAWA,MAAA,EAAA,CAAA,CAAG,EAAA,CAAE,OAAA,EAAU,QAAA,KAAK,CAAA;AAAA,cAAWA,MAAA,EAAA,CAAA,CAAG,GAAE,QAAA,EAAW,gBAAA,CAAA,UAAgB,QAAA,CAAA;AAAA,cAAwB,eAAA,CAAA,KAAA;AAAA,cAAyB,OAAA,CAAA;AAAA;YASvN,KAAA,iBAAO,WAAA,CAAA,KAAW,CAAA;AAAA,YACnB,IAAA,EAAK,OAAA;AAAA,YACJ,YAAA,EAAY,UAAA;AAAA,YACZ,YAAA,EAAY;AAAA;YAGL,OAAA,CAAA,YAAS,CAAA,iBADjBF,WAAA,CAKEE,KAAA,CAAA,OAAA,CAAA,EAAA;AAAA;cAHC,OAAO,OAAA,CAAA,SAAA;AAAA,cACP,MAAM,SAAA,CAAA,KAAA;AAAA,cACN,OAAKG,cAAA,CAAEH,KAAA,CAAA,EAAA,CAAA,CAAG,CAAA,CAAC,OAAA,CAAA;AAAA;YAEC,cAAA,KAAA,iBAAfF,WAAA,CAEUE,KAAA,CAAA,MAAA,CAAA,EAAA;AAAA;cAFqB,KAAA,EAAKG,cAAA,CAAA,CAAGH,KAAA,CAAA,EAAA,CAAA,CAAG,CAAA,UAAW,SAAA,CAAA,KAAS,CAAA;AAAA;+BAC5D,MAAiC;AAAA,iBAAjCI,WAAA,EAAAN,WAAA,CAAiCO,uBAAA,CAAjB,aAAA,CAAA,KAAa,CAAA,CAAA;AAAA;;;;YAE/BC,WAMO,IAAA,wBANP,MAMO;AAAA,eALK,OAAA,CAAA,wBAAA,iBAAVC,kBAAA;AAAA,gBAEI,GAAA;AAAA,gBAAA;AAAA;kBAFiC,OAAKJ,cAAA,CAAEH,KAAA,CAAA,EAAA,CAAA,CAAG,CAAA,CAAC,SAAA,CAAA;AAAA;gCAC3C,QAAA,OAAO,CAAA;AAAA,gBAAA;AAAA;AAAA,eAAA,kBAGZO,kBAAA;AAAA,gBAAsDC,QAAA;AAAA,gBAAA,EAAA,KAAA,CAAA,EAAA;AAAA,gBAAA;AAAA,kBADtDC,mBAAA,sFAAA,CAAA;AAAA,kBACAP,mBAAsD,GAAA,EAAA;AAAA,oBAA3C,OAAKC,cAAA,CAAEH,KAAA,CAAA,EAAA,CAAA,CAAG,CAAA,CAAC,SAAA,CAAA,CAAA;AAAA,oBAAa,WAAQ,OAAA,CAAA;AAAA;;;;;;YAE9B,QAAA,SAAA,iBAAfF,WAAA,CAEUE,KAAA,CAAA,MAAA,CAAA,EAAA;AAAA;cAFiB,OAAKG,cAAA,CAAEH,KAAA,CAAA,EAAA,CAAA,CAAG,CAAA,CAAC,UAAA,CAAA,CAAA;AAAA,cAAe,OAAA,gBAAY,KAAA,EAAK,CAAA,MAAA,CAAA;AAAA;+BACpE,MAAS;AAAA,gBAATU,WAAA,CAASV,KAAA,CAAA,KAAA,CAAA;AAAA;;;;;oBAlCH,OAAA,CAAA,KAAO;AAAA;;;;;;;;;;;"}