primevue
Version:
[](https://opensource.org/licenses/MIT) [](https://badge.fury.io/js/primevue) [ • 3.11 kB
JavaScript
import e from"primevue/ripple";import{resolveDirective as s,openBlock as t,createBlock as i,Transition as n,withCtx as a,withDirectives as l,createElementVNode as o,normalizeClass as p,renderSlot as r,createElementBlock as c,createCommentVNode as m,vShow as d}from"vue";var g={name:"Message",emits:["close"],props:{severity:{type:String,default:"info"},closable:{type:Boolean,default:!0},sticky:{type:Boolean,default:!0},life:{type:Number,default:3e3},icon:{type:String,default:null}},timeout:null,data:()=>({visible:!0}),mounted(){this.sticky||setTimeout((()=>{this.visible=!1}),this.life)},methods:{close(e){this.visible=!1,this.$emit("close",e)}},computed:{containerClass(){return"p-message p-component p-message-"+this.severity},iconClass(){return["p-message-icon pi",this.icon?this.icon:{"pi-info-circle":"info"===this.severity,"pi-check":"success"===this.severity,"pi-exclamation-triangle":"warn"===this.severity,"pi-times-circle":"error"===this.severity}]}},directives:{ripple:e}};const u={class:"p-message-wrapper"},f={class:"p-message-text"},y=[o("i",{class:"p-message-close-icon pi pi-times"},null,-1)];!function(e,s){void 0===s&&(s={});var t=s.insertAt;if(e&&"undefined"!=typeof document){var i=document.head||document.getElementsByTagName("head")[0],n=document.createElement("style");n.type="text/css","top"===t&&i.firstChild?i.insertBefore(n,i.firstChild):i.appendChild(n),n.styleSheet?n.styleSheet.cssText=e:n.appendChild(document.createTextNode(e))}}("\n.p-message-wrapper {\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n}\n.p-message-close {\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-pack: center;\n -ms-flex-pack: center;\n justify-content: center;\n}\n.p-message-close.p-link {\n margin-left: auto;\n overflow: hidden;\n position: relative;\n}\n.p-message-enter-from {\n opacity: 0;\n}\n.p-message-enter-active {\n -webkit-transition: opacity .3s;\n transition: opacity .3s;\n}\n.p-message.p-message-leave-from {\n max-height: 1000px;\n}\n.p-message.p-message-leave-to {\n max-height: 0;\n opacity: 0;\n margin: 0 !important;\n}\n.p-message-leave-active {\n overflow: hidden;\n -webkit-transition: max-height .3s cubic-bezier(0, 1, 0, 1), opacity .3s, margin .15s;\n transition: max-height .3s cubic-bezier(0, 1, 0, 1), opacity .3s, margin .15s;\n}\n.p-message-leave-active .p-message-close {\n display: none;\n}\n"),g.render=function(e,g,h,v,b,x){const k=s("ripple");return t(),i(n,{name:"p-message",appear:""},{default:a((()=>[l(o("div",{class:p(x.containerClass),role:"alert"},[o("div",u,[o("span",{class:p(x.iconClass)},null,2),o("div",f,[r(e.$slots,"default")]),h.closable?l((t(),c("button",{key:0,class:"p-message-close p-link",onClick:g[0]||(g[0]=e=>x.close(e)),type:"button"},y)),[[k]]):m("",!0)])],2),[[d,b.visible]])])),_:3})};export{g as default};