UNPKG

vexip-ui

Version:

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

3 lines (2 loc) 3.46 kB
"use strict";const e=require("vue");require("../icon/index.cjs");require("../renderer/index.cjs");require("../popup/index.cjs");const f=require("@vexip-ui/config"),u=require("./symbol.cjs"),_=require("../popup/popup.vue2.cjs"),i=require("../icon/icon.cjs"),g=require("../renderer/renderer.cjs"),B=["aria-live"],C=["innerHTML"],z=["onClick"],q=e.defineComponent({name:"Message",__name:"message",setup(h,{expose:v}){const o=f.useNameHelper("message"),c=f.useIcons(),y=e.computed(()=>({primary:c.value.info,info:c.value.info,success:c.value.success,warning:c.value.warning,error:c.value.error})),a=e.ref("top"),s=e.ref(30),t=e.ref(16),r=e.ref(),d=e.computed(()=>`${a.value}-center`);async function k(l){r.value&&await r.value.add(l)}async function p(l){return!!r.value&&await r.value.remove(l)}function m(l){a.value=l.placement||a.value,s.value=l.startOffset||s.value,t.value=l.itemGap||t.value}function b(){r.value&&r.value.clear()}return v(e.reactive({popup:r,add:k,remove:p,clear:b,config:m})),(l,E)=>(e.openBlock(),e.createBlock(e.unref(_),{ref_key:"popup",ref:r,class:e.normalizeClass(e.unref(o).b()),"transition-name":e.unref(o).ns(`popup-${a.value}`),placement:d.value,"start-offset":s.value,"item-gap":t.value},{item:e.withCtx(({item:n})=>[e.createElementVNode("div",{class:e.normalizeClass([{[e.unref(o).be("item")]:!0,[e.unref(o).bs("vars")]:!0,[e.unref(o).bem("item",n.type)]:n.type&&e.unref(u.effectiveTypes).includes(n.type),[e.unref(o).bem("item","background")]:n.background,[e.unref(o).bem("item","color")]:n.background&&n.color,[e.unref(o).bem("item","color-only")]:!n.background&&n.color,[e.unref(o).bem("item","has-icon")]:n.icon,[e.unref(o).bem("item","closable")]:n.closable},n.className]),role:"alert",style:e.normalizeStyle([{color:typeof n.color=="string"?n.color:void 0,backgroundColor:typeof n.background=="string"?n.background:void 0},n.style||{}]),"aria-atomic":"true","aria-live":n.type&&e.unref(u.assertiveTypes).includes(n.type)?"assertive":"polite"},[e.createElementVNode("div",{class:e.normalizeClass(e.unref(o).be("wrapper"))},[n.icon||n.type&&e.unref(u.effectiveTypes).includes(n.type)?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(e.unref(o).be("icon")),style:e.normalizeStyle({color:n.iconColor})},[n.icon?(e.openBlock(),e.createBlock(e.unref(i),{key:0,icon:n.icon,style:e.normalizeStyle([{color:n.iconColor},n.icon.style])},null,8,["icon","style"])):(e.openBlock(),e.createBlock(e.unref(i),e.mergeProps({key:1},y.value[n.type],{style:{color:n.iconColor}}),null,16,["style"]))],6)):e.createCommentVNode("",!0),typeof n.renderer=="function"?(e.openBlock(),e.createBlock(e.unref(g),{key:1,renderer:n.renderer,data:n},null,8,["renderer","data"])):(e.openBlock(),e.createElementBlock(e.Fragment,{key:2},[n.parseHtml?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(e.unref(o).be("content")),innerHTML:n.content},null,10,C)):(e.openBlock(),e.createElementBlock("div",{key:1,class:e.normalizeClass(e.unref(o).be("content"))},e.toDisplayString(n.content||""),3))],64))],2),n.closable?(e.openBlock(),e.createElementBlock("button",{key:0,type:"button",class:e.normalizeClass(e.unref(o).be("close")),onClick:N=>p(n.key)},[e.createVNode(e.unref(i),e.mergeProps(e.unref(c).close,{label:"close"}),null,16)],10,z)):e.createCommentVNode("",!0)],14,B)]),_:1},8,["class","transition-name","placement","start-offset","item-gap"]))}});module.exports=q; //# sourceMappingURL=message.vue2.cjs.map