UNPKG

@extclp/vexip-ui

Version:

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

1 lines 10.2 kB
{"version":3,"file":"notice.vue2.mjs","sources":["../../../components/notice/notice.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { Icon } from '@/components/icon'\r\nimport { Renderer } from '@/components/renderer'\r\nimport { Popup } from '@/components/popup'\r\n\r\nimport { computed, reactive, ref } from 'vue'\r\n\r\nimport { useIcons, useNameHelper } from '@vexip-ui/config'\r\nimport { assertiveTypes, effectiveTypes } from './symbol'\r\n\r\nimport type { Key, NoticeConfig, NoticePlacement } from './symbol'\r\n\r\ndefineOptions({ name: 'Notice' })\r\n\r\nconst nh = useNameHelper('notice')\r\nconst icons = useIcons()\r\n\r\nconst predefinedIcons = computed(() => ({\r\n primary: icons.value.info,\r\n info: icons.value.info,\r\n success: icons.value.success,\r\n warning: icons.value.warning,\r\n error: icons.value.error,\r\n}))\r\n\r\nconst placement = ref<NoticePlacement>('top-right')\r\nconst startOffset = ref(30)\r\nconst itemGap = ref(16)\r\nconst popup = ref<InstanceType<typeof Popup>>()\r\n\r\nasync function add(options: Record<string, any>) {\r\n if (popup.value) {\r\n await popup.value.add(options)\r\n }\r\n}\r\n\r\nasync function remove(key: Key) {\r\n return !!popup.value && (await popup.value.remove(key))\r\n}\r\n\r\nfunction clear() {\r\n popup.value && popup.value.clear()\r\n}\r\n\r\nfunction config(config: NoticeConfig) {\r\n placement.value = config.placement || placement.value\r\n startOffset.value = config.startOffset || startOffset.value\r\n itemGap.value = config.itemGap || itemGap.value\r\n}\r\n\r\ndefineExpose(\r\n reactive({\r\n popup,\r\n add,\r\n remove,\r\n clear,\r\n config,\r\n }),\r\n)\r\n</script>\r\n\r\n<template>\r\n <!-- eslint-disable vue/no-v-html -->\r\n <Popup\r\n ref=\"popup\"\r\n :class=\"nh.b()\"\r\n :transition-name=\"nh.ns(`popup-${placement.split('-')[1]}`)\"\r\n :placement=\"placement\"\r\n :start-offset=\"startOffset\"\r\n :item-gap=\"itemGap\"\r\n >\r\n <template #item=\"{ item }: { item: import('./symbol').NoticeOptions }\">\r\n <div\r\n :class=\"[\r\n {\r\n [nh.be('item')]: true,\r\n [nh.bs('vars')]: true,\r\n [nh.bem('item', 'title-only')]: !item.content && typeof item.renderer !== 'function',\r\n [nh.bem('item', 'has-icon')]: item.icon,\r\n [nh.bem('item', 'content-only')]: !item.title,\r\n [nh.bem('item', item.type!)]: item.type && effectiveTypes.includes(item.type),\r\n [nh.bem('item', 'background')]: item.background,\r\n [nh.bem('item', 'color')]: item.background && item.color,\r\n [nh.bem('item', 'color-only')]: !item.background && item.color,\r\n [nh.bem('item', 'marker')]: item.marker\r\n },\r\n item.className\r\n ]\"\r\n role=\"alert\"\r\n :style=\"[\r\n {\r\n color: typeof item.color === 'string' ? item.color : undefined,\r\n backgroundColor: typeof item.background === 'string' ? item.background : undefined\r\n },\r\n item.style || {}\r\n ]\"\r\n aria-atomic=\"true\"\r\n :aria-live=\"item.type && assertiveTypes.includes(item.type) ? 'assertive' : 'polite'\"\r\n >\r\n <div\r\n v-if=\"item.icon || (item.type && effectiveTypes.includes(item.type))\"\r\n :class=\"nh.be('icon')\"\r\n :style=\"{ color: item.iconColor }\"\r\n >\r\n <Icon\r\n v-if=\"item.icon\"\r\n :icon=\"item.icon\"\r\n :scale=\"!item.content && typeof item.renderer !== 'function' ? 1 : 2\"\r\n :style=\"[{ color: item.iconColor }, (item.icon as any).style]\"\r\n ></Icon>\r\n <Icon\r\n v-else\r\n v-bind=\"predefinedIcons[item.type!]\"\r\n :scale=\"!item.content && typeof item.renderer !== 'function' ? 1 : 2\"\r\n :style=\"{ color: item.iconColor }\"\r\n ></Icon>\r\n </div>\r\n <div :class=\"nh.be('wrapper')\">\r\n <Renderer\r\n v-if=\"typeof item.renderer === 'function'\"\r\n :renderer=\"item.renderer\"\r\n :data=\"item\"\r\n ></Renderer>\r\n <template v-else>\r\n <template v-if=\"item.title\">\r\n <div\r\n v-if=\"item.parseHtml\"\r\n :class=\"nh.be('title')\"\r\n :style=\"{\r\n color: typeof item.titleColor === 'string' ? item.titleColor : undefined\r\n }\"\r\n v-html=\"item.title\"\r\n ></div>\r\n <div\r\n v-else\r\n :class=\"nh.be('title')\"\r\n :style=\"{\r\n color: typeof item.titleColor === 'string' ? item.titleColor : undefined\r\n }\"\r\n >\r\n {{ item.title || '' }}\r\n </div>\r\n </template>\r\n <template v-if=\"item.content\">\r\n <div v-if=\"item.parseHtml\" :class=\"nh.be('content')\" v-html=\"item.content\"></div>\r\n <div v-else :class=\"nh.be('content')\">\r\n {{ item.content || '' }}\r\n </div>\r\n </template>\r\n </template>\r\n </div>\r\n <button\r\n v-if=\"item.closable\"\r\n type=\"button\"\r\n :class=\"nh.be('close')\"\r\n @click=\"remove(item.key!)\"\r\n >\r\n <Icon v-bind=\"icons.close\" label=\"close\"></Icon>\r\n </button>\r\n </div>\r\n </template>\r\n </Popup>\r\n</template>\r\n"],"names":["nh","useNameHelper","icons","useIcons","predefinedIcons","computed","placement","ref","startOffset","itemGap","popup","add","options","remove","key","clear","config","__expose","reactive","_createBlock","_unref","Popup","_normalizeClass","_withCtx","item","_createElementVNode","effectiveTypes","_normalizeStyle","assertiveTypes","_createElementBlock","Icon","_openBlock","_mergeProps","Renderer","_Fragment","_toDisplayString","$event","_createVNode"],"mappings":"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"}