UNPKG

@extclp/vexip-ui

Version:

A Vue 3 UI library, Highly customizability, full TypeScript, performance pretty good

1 lines 13.3 kB
{"version":3,"file":"index.mjs","sources":["../../../components/message/index.ts"],"sourcesContent":["import { createApp, createVNode, markRaw, render } from 'vue'\r\n\r\nimport Component from './message.vue'\r\nimport { proxyExposed, unrefElement } from '@vexip-ui/hooks'\r\nimport { destroyObject, isClient, isNull, noop, toNumber } from '@vexip-ui/utils'\r\n\r\nimport type { App, MaybeRef } from 'vue'\r\nimport type { MaybeInstance } from '@vexip-ui/hooks'\r\nimport type {\r\n Key,\r\n MessageConfig,\r\n MessageInstance,\r\n MessageOptions,\r\n MessagePlacement,\r\n MessageType,\r\n} from './symbol'\r\n\r\nexport type { MessageConfig, MessageType, MessagePlacement, MessageOptions }\r\n\r\ntype FuzzyOptions = string | MessageOptions\r\ntype ManagerOptions = { duration?: number } & MessageConfig & Record<string, unknown>\r\n\r\ninterface AipMethod {\r\n (options: MessageOptions): () => void,\r\n (content: string, duration?: number): () => void,\r\n /** @internal */\r\n (options: FuzzyOptions, duration?: number): () => void,\r\n}\r\n\r\nconst placementWhiteList: MessagePlacement[] = ['top', 'bottom']\r\n\r\nlet count = 1\r\n\r\nfunction getKey() {\r\n return `message-${count++}`\r\n}\r\n\r\nexport class MessageManager {\r\n name: string\r\n defaults: Record<string, unknown>\r\n\r\n open: AipMethod\r\n primary: AipMethod\r\n info: AipMethod\r\n success: AipMethod\r\n warning: AipMethod\r\n error: AipMethod\r\n\r\n private _mountedApp: App<unknown> | null\r\n private _instance: MessageInstance | null\r\n private _innerApp: App<unknown> | null\r\n private _container: HTMLElement | null\r\n private _wrapper: HTMLElement | SVGElement | null\r\n private _mountedEl: HTMLElement | null\r\n private _installed: boolean\r\n private _configRecord: MessageConfig | null\r\n\r\n constructor(options: ManagerOptions = {}) {\r\n options = {\r\n ...options,\r\n duration: options.duration ? toNumber(options.duration) : 3000,\r\n }\r\n\r\n this._mountedApp = null\r\n this._instance = null\r\n this._innerApp = null\r\n this._container = null\r\n this._wrapper = null\r\n this._mountedEl = null\r\n this._installed = false\r\n this._configRecord = null\r\n this.name = 'Message'\r\n this.defaults = {}\r\n\r\n this.config(options)\r\n\r\n this.open = (content: FuzzyOptions, duration?: number) => {\r\n return this._open(null, content, duration)\r\n }\r\n\r\n this.primary = (content: FuzzyOptions, duration?: number) => {\r\n return this._open('primary', content, duration)\r\n }\r\n\r\n this.info = (content: FuzzyOptions, duration?: number) => {\r\n return this._open('info', content, duration)\r\n }\r\n\r\n this.success = (content: FuzzyOptions, duration?: number) => {\r\n return this._open('success', content, duration)\r\n }\r\n\r\n this.warning = (content: FuzzyOptions, duration?: number) => {\r\n return this._open('warning', content, duration)\r\n }\r\n\r\n this.error = (content: FuzzyOptions, duration?: number) => {\r\n return this._open('error', content, duration)\r\n }\r\n }\r\n\r\n judge(state: boolean, success: string, error: string, duration?: number): void\r\n judge(state: boolean, success: MessageOptions, error: string, duration?: number): void\r\n judge(state: boolean, success: string, error: MessageOptions, duration?: number): void\r\n judge(state: boolean, success: MessageOptions, error: MessageOptions): void\r\n judge(\r\n state: boolean,\r\n success: string | MessageOptions,\r\n error: string | MessageOptions,\r\n duration?: number,\r\n ) {\r\n if (state) {\r\n this.success(success, duration)\r\n } else {\r\n this.error(error, duration)\r\n }\r\n }\r\n\r\n close(key: Key) {\r\n if (isNull(key)) {\r\n this.clear()\r\n } else {\r\n this._getInstance()?.remove(key)\r\n }\r\n }\r\n\r\n config({ placement, startOffset, itemGap, ...others }: MessageConfig & MessageOptions) {\r\n this._configRecord = { placement, startOffset, itemGap }\r\n this.defaults = { ...this.defaults, ...others }\r\n\r\n if (this._installed) {\r\n const instance = this._getInstance()\r\n\r\n if (instance) {\r\n if (placement) {\r\n instance.config({\r\n placement: placementWhiteList.includes(placement) ? placement : placementWhiteList[0],\r\n })\r\n }\r\n\r\n instance.config({ startOffset, itemGap })\r\n }\r\n }\r\n }\r\n\r\n clone() {\r\n const manager = new MessageManager(this.defaults)\r\n\r\n manager._mountedApp = this._mountedApp\r\n manager._configRecord = this._configRecord\r\n manager._installed = this._installed\r\n\r\n return manager\r\n }\r\n\r\n clear() {\r\n this._getInstance()?.clear()\r\n }\r\n\r\n destroy() {\r\n this._mountedEl && this._wrapper?.removeChild(this._mountedEl)\r\n this._innerApp?.unmount()\r\n this._container && render(null, this._container)\r\n destroyObject(this)\r\n }\r\n\r\n isDestroyed() {\r\n return false\r\n }\r\n\r\n install(app: App, options: ManagerOptions & { property?: string } = {}) {\r\n const { property, ...others } = options\r\n\r\n this._mountedApp = app\r\n this._installed = true\r\n this.config(others)\r\n\r\n if (property || !app.config.globalProperties.$message) {\r\n app.config.globalProperties[property || '$message'] = this\r\n }\r\n }\r\n\r\n transferTo(target: MaybeRef<string | MaybeInstance>) {\r\n if (!isClient) return\r\n\r\n const el = unrefElement(target)\r\n\r\n if (el) {\r\n this._wrapper = el\r\n\r\n if (this._instance) {\r\n this._mountedEl && this._wrapper.appendChild(this._mountedEl)\r\n } else {\r\n this._getInstance()\r\n }\r\n }\r\n }\r\n\r\n private _getInstance() {\r\n if (!this._instance && isClient) {\r\n if (!this._mountedApp) {\r\n console.warn('[vexip-ui:Message]: App missing, the plugin maybe not installed.')\r\n\r\n this._container = document.createElement('div')\r\n this._innerApp = createApp(Component)\r\n this._instance = this._innerApp.mount(this._container) as MessageInstance\r\n } else {\r\n const vnode = createVNode(Component, null, null)\r\n\r\n this._container = document.createElement('div')\r\n vnode.appContext = this._mountedApp._context\r\n\r\n render(vnode, this._container)\r\n\r\n this._instance = proxyExposed<MessageInstance>(vnode)\r\n }\r\n\r\n this._mountedEl = this._container.firstElementChild as HTMLElement\r\n ;(this._wrapper || document.body).appendChild(this._mountedEl)\r\n }\r\n\r\n return this._instance\r\n }\r\n\r\n private _open(type: null | MessageType, content: FuzzyOptions, _duration?: number) {\r\n if (!isClient) {\r\n return noop\r\n }\r\n\r\n const options = typeof content === 'string' ? { content, duration: _duration } : content\r\n\r\n const key = options.key ?? getKey()\r\n const message = this._getInstance()!\r\n\r\n let timer: ReturnType<typeof setTimeout>\r\n\r\n const userCloseFn = options.onClose\r\n const onClose = () => {\r\n clearTimeout(timer)\r\n\r\n if (typeof userCloseFn === 'function') {\r\n return userCloseFn()\r\n }\r\n }\r\n\r\n const userEnterFn = options.onEnter\r\n const onEnter = () => {\r\n if (options.liveOnEnter) {\r\n clearTimeout(timer)\r\n }\r\n\r\n if (typeof userEnterFn === 'function') {\r\n return userEnterFn()\r\n }\r\n }\r\n\r\n const userLeaveFn = options.onLeave\r\n const onLeave = () => {\r\n if (options.liveOnEnter) {\r\n clearTimeout(timer)\r\n setDelayClose()\r\n }\r\n\r\n if (typeof userLeaveFn === 'function') {\r\n return userLeaveFn()\r\n }\r\n }\r\n\r\n const item: MessageOptions = {\r\n ...this.defaults,\r\n ...options,\r\n key,\r\n type: type ?? options.type,\r\n onClose,\r\n onEnter,\r\n onLeave,\r\n }\r\n\r\n if (item.icon && typeof item.icon !== 'function') {\r\n item.icon = markRaw(item.icon)\r\n }\r\n\r\n message.add(item)\r\n setDelayClose()\r\n\r\n function setDelayClose() {\r\n const duration = typeof item.duration === 'number' ? item.duration : 3000\r\n\r\n if (duration >= 500) {\r\n timer = setTimeout(() => {\r\n message.remove(key)\r\n }, duration)\r\n }\r\n }\r\n\r\n return () => {\r\n clearTimeout(timer)\r\n message.remove(key)\r\n }\r\n }\r\n}\r\n\r\nexport const Message = new MessageManager()\r\n"],"names":["placementWhiteList","count","getKey","MessageManager","options","__publicField","toNumber","content","duration","state","success","error","key","isNull","_a","placement","startOffset","itemGap","others","instance","manager","_b","render","destroyObject","app","property","target","isClient","el","unrefElement","createApp","Component","vnode","createVNode","proxyExposed","type","_duration","noop","message","timer","userCloseFn","onClose","userEnterFn","onEnter","userLeaveFn","onLeave","setDelayClose","item","markRaw","Message"],"mappings":"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"}