UNPKG

element-plus

Version:

A Component Library for Vue 3

1 lines 10.6 kB
{"version":3,"file":"notify.mjs","sources":["../../../../../../packages/components/notification/src/notify.ts"],"sourcesContent":["import { createVNode, isVNode, render } from 'vue'\nimport {\n debugWarn,\n isClient,\n isElement,\n isFunction,\n isString,\n isUndefined,\n} from '@element-plus/utils'\nimport NotificationConstructor from './notification.vue'\nimport { notificationTypes } from './notification'\n\nimport type { Ref, VNode } from 'vue'\nimport type {\n NotificationPosition,\n NotificationProps,\n NotificationQueue,\n Notify,\n NotifyFn,\n} from './notification'\n\n// This should be a queue but considering there were `non-autoclosable` notifications.\nconst notifications: Record<NotificationPosition, NotificationQueue> = {\n 'top-left': [],\n 'top-right': [],\n 'bottom-left': [],\n 'bottom-right': [],\n}\n\n// the gap size between each notification\nconst GAP_SIZE = 16\nlet seed = 1\n\nconst notify: NotifyFn & Partial<Notify> = function (options = {}, context) {\n if (!isClient) return { close: () => undefined }\n\n if (isString(options) || isVNode(options)) {\n options = { message: options }\n }\n\n const position = options.position || 'top-right'\n\n let verticalOffset = options.offset || 0\n notifications[position].forEach(({ vm }) => {\n verticalOffset += (vm.el?.offsetHeight || 0) + GAP_SIZE\n })\n verticalOffset += GAP_SIZE\n\n const id = `notification_${seed++}`\n const userOnClose = options.onClose\n const props: Partial<NotificationProps> = {\n ...options,\n offset: verticalOffset,\n id,\n onClose: () => {\n close(id, position, userOnClose)\n },\n }\n\n let appendTo: HTMLElement | null = document.body\n if (isElement(options.appendTo)) {\n appendTo = options.appendTo\n } else if (isString(options.appendTo)) {\n appendTo = document.querySelector(options.appendTo)\n }\n\n // should fallback to default value with a warning\n if (!isElement(appendTo)) {\n debugWarn(\n 'ElNotification',\n 'the appendTo option is not an HTMLElement. Falling back to document.body.'\n )\n appendTo = document.body\n }\n\n const container = document.createElement('div')\n\n const vm = createVNode(\n NotificationConstructor,\n props,\n isFunction(props.message)\n ? props.message\n : isVNode(props.message)\n ? () => props.message\n : null\n )\n vm.appContext = isUndefined(context) ? notify._context : context\n\n // clean notification element preventing mem leak\n vm.props!.onDestroy = () => {\n render(null, container)\n }\n\n // instances will remove this item when close function gets called. So we do not need to worry about it.\n render(vm, container)\n notifications[position].push({ vm })\n appendTo.appendChild(container.firstElementChild!)\n\n return {\n // instead of calling the onClose function directly, setting this value so that we can have the full lifecycle\n // for out component, so that all closing steps will not be skipped.\n close: () => {\n ;(vm.component!.exposed as { visible: Ref<boolean> }).visible.value =\n false\n },\n }\n}\nnotificationTypes.forEach((type) => {\n notify[type] = (options = {}, appContext) => {\n if (isString(options) || isVNode(options)) {\n options = {\n message: options,\n }\n }\n return notify({ ...options, type }, appContext)\n }\n})\n\n/**\n * This function gets called when user click `x` button or press `esc` or the time reached its limitation.\n * Emitted by transition@before-leave event so that we can fetch the current notification.offsetHeight, if this was called\n * by @after-leave the DOM element will be removed from the page thus we can no longer fetch the offsetHeight.\n * @param {String} id notification id to be closed\n * @param {Position} position the positioning strategy\n * @param {Function} userOnClose the callback called when close passed by user\n */\nexport function close(\n id: string,\n position: NotificationPosition,\n userOnClose?: (vm: VNode) => void\n): void {\n // maybe we can store the index when inserting the vm to notification list.\n const orientedNotifications = notifications[position]\n const idx = orientedNotifications.findIndex(\n ({ vm }) => vm.component?.props.id === id\n )\n if (idx === -1) return\n const { vm } = orientedNotifications[idx]\n if (!vm) return\n // calling user's on close function before notification gets removed from DOM.\n userOnClose?.(vm)\n\n // note that this is called @before-leave, that's why we were able to fetch this property.\n const removedHeight = vm.el!.offsetHeight\n const verticalPos = position.split('-')[0]\n orientedNotifications.splice(idx, 1)\n const len = orientedNotifications.length\n if (len < 1) return\n // starting from the removing item.\n for (let i = idx; i < len; i++) {\n // new position equals the current offsetTop minus removed height plus 16px(the gap size between each item)\n const { el, component } = orientedNotifications[i].vm\n const pos =\n Number.parseInt(el!.style[verticalPos], 10) - removedHeight - GAP_SIZE\n component!.props.offset = pos\n }\n}\n\nexport function closeAll(): void {\n // loop through all directions, close them at once.\n for (const orientedNotifications of Object.values(notifications)) {\n orientedNotifications.forEach(({ vm }) => {\n // same as the previous close method, we'd like to make sure lifecycle gets handle properly.\n ;(vm.component!.exposed as { visible: Ref<boolean> }).visible.value =\n false\n })\n }\n}\n\nexport function updateOffsets(position: NotificationPosition = 'top-right') {\n let verticalOffset =\n notifications[position][0]?.vm.component?.props?.offset || 0\n\n for (const { vm } of notifications[position]) {\n vm.component!.props.offset = verticalOffset\n verticalOffset += (vm.el?.offsetHeight || 0) + GAP_SIZE\n }\n}\n\nnotify.closeAll = closeAll\nnotify.updateOffsets = updateOffsets\nnotify._context = null\n\nexport default notify as Notify\n"],"names":["vm","NotificationConstructor"],"mappings":"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"}