@volverjs/ui-vue/dist/components/VvAlert/VvAlert.umd.js

@volverjs/ui-vue is a lightweight Vue 3 component library to accompany @volverjs/style.

!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("vue"),require("@iconify/vue")):"function"==typeof define&&define.amd?define(["vue","@iconify/vue"],t):(e="undefined"!=typeof globalThis?globalThis:e||self).VvAlert=t(e.vue,e.vue$1)}(this,function(e,t){"use strict";var o=(e=>(e.local="local",e.session="session",e))(o||{}),l=(e=>(e.left="left",e.right="right",e.top="top",e.bottom="bottom",e))(l||{}),r=(e=>(e.before="before",e.after="after",e))(r||{}),n=(e=>(e.button="button",e.submit="submit",e.reset="reset",e))(n||{}),a=(e=>(e.nuxtLink="nuxt-link",e.routerLink="router-link",e.a="a",e.button="button",e))(a||{}),i=(e=>(e.alert="alert",e.alertdialog="alertdialog",e))(i||{});const s=Symbol.for("volver"),c=Symbol.for("alertGroup"),u={prefix:"normal"},d={icon:{type:[String,Object],default:void 0},iconPosition:{type:String,default:r.before,validation:e=>Object.values(r).includes(e)}},f={id:[String,Number]};function v(t,o,l){return e.computed(()=>{const r={[t]:!0},n="string"==typeof o?.value?o.value.split(" "):o?.value;return n&&Array.isArray(n)&&n.forEach(e=>{e&&(r[`${t}--${e}`]=!0)}),l&&Object.keys(l.value).forEach(o=>{r[`${t}--${o}`]=e.unref(l.value[o])}),r})}l.bottom,n.button,a.button,o.local;const p={...f,...d,modifiers:{type:[String,Array],default:void 0},dismissable:{type:Boolean,default:!1},autoClose:{type:Number,default:0},closeLabel:{type:String,default:"Close"},title:{type:String,default:void 0},content:{type:String,default:void 0},footer:{type:String,default:void 0},role:{type:String,default:i.alert}};function m(t,o){const{bus:n}=e.inject(c,{}),a=(i=e.computed(()=>t.id),e.computed(()=>String(i?.value||e.useId())));var i;const s=e.computed(()=>`${a.value}-title`);let u;const d=()=>{u&&clearTimeout(u),o("close",a.value),n?.emit("close",a.value)};e.watch(()=>t.autoClose,e=>{e>0?u=setTimeout(d,e):u&&clearTimeout(u)},{immediate:!0});const f=e.ref(!1),p=()=>{f.value=!0,u&&clearTimeout(u)},m=()=>{f.value=!1,t.autoClose>0&&(u=setTimeout(d,t.autoClose))},{hasIcon:h}=function(t,o){const n=e.computed(()=>"string"==typeof t?.value?{name:t?.value}:t?.value),a=e.computed(()=>o?.value===r.before?n.value:void 0),i=e.computed(()=>o?.value===r.after?n.value:void 0),s=e.computed(()=>o?.value===l.left?n.value:void 0),c=e.computed(()=>o?.value===l.right?n.value:void 0),u=e.computed(()=>o?.value===l.top?n.value:void 0),d=e.computed(()=>o?.value===l.bottom?n.value:void 0);return{hasIcon:n,hasIconLeft:s,hasIconRight:c,hasIconTop:u,hasIconBottom:d,hasIconBefore:a,hasIconAfter:i}}(e.computed(()=>t.icon)),b=v("vv-alert",e.computed(()=>t.modifiers),e.computed(()=>({dismissable:t.autoClose>0||t.dismissable,"auto-close":t.autoClose>0,hover:f.value}))),y=e.computed(()=>({"--alert-duration":`${t.autoClose}ms`}));return{close:d,hasIcon:h,hasTitleId:s,hasProps:e.computed(()=>({onMouseover:p,onMouseleave:m,class:b.value,style:y.value,role:t.role,"aria-labelledby":s.value}))}}const h=e.defineComponent({name:"VvIcon",props:e.mergeDefaults({name:{},color:{},width:{},height:{},provider:{},prefix:{},src:{},horizontalFlip:{type:Boolean},verticalFlip:{type:Boolean},flip:{},mode:{},inline:{type:Boolean},rotate:{},onLoad:{type:Function},svg:{},modifiers:{}},u),setup(o){const l=o,r=e.computed(()=>"string"==typeof l.rotate?Number.parseFloat(l.rotate):l.rotate),n=e.ref(!0),a=e.inject(s,void 0),{modifiers:i}=e.toRefs(l),c=v("vv-icon",i),u=e.computed(()=>l.provider||a?.iconsProvider),d=e.computed(()=>{const e=l.name??"",o=`@${u.value}:${l.prefix}:${e}`;if(t.iconLoaded(o))return o;const r=a?.iconsCollections.find(o=>{const l=`@${u.value}:${o.prefix}:${e}`;return t.iconLoaded(l)});return r?`@${u.value}:${r.prefix}:${e}`:e});function f(e){const o=function(e){let t;if("undefined"==typeof window){const{JSDOM:e}=require("jsdom");t=(new e).window}return(t?new t.DOMParser:new window.DOMParser).parseFromString(e,"text/html").querySelector("svg")}(e),r=o?.innerHTML.trim()||"";o&&r&&t.addIcon(`@${u.value}:${l.prefix}:${l.name}`,{body:r,height:o.viewBox.baseVal.height,width:o.viewBox.baseVal.width})}return a&&l.src&&!t.iconLoaded(`@${u.value}:${l.prefix}:${l.name}`)&&(n.value=!1,a.fetchIcon(l.src).then(e=>{e&&(f(e),n.value=!0)}).catch(e=>{throw new Error(`Error during fetch icon: ${e?.message}`)})),l.svg&&f(l.svg),(l,a)=>e.unref(n)?(e.openBlock(),e.createBlock(e.unref(t.Icon),e.mergeProps({key:0,class:e.unref(c)},{inline:o.inline,width:o.width,height:o.height,horizontalFlip:o.horizontalFlip,verticalFlip:o.verticalFlip,flip:o.flip,rotate:e.unref(r),color:o.color,icon:e.unref(d)},{onLoad:o.onLoad}),null,16,["class","onLoad"])):e.createCommentVNode("v-if",!0)}}),b={key:0,class:"vv-alert__header"},y=["id"],g=["aria-label"],$={key:1,class:"vv-alert__content"},k={key:2,class:"vv-alert__footer"};return e.defineComponent({name:"VvAlert",props:p,emits:["close"],setup(t,{expose:o,emit:l}){const r=t,n=l,{hasProps:a,hasTitleId:i,hasIcon:s,close:c}=m(r,n);return o({close:c}),(t,o)=>(e.openBlock(),e.createElementBlock("div",e.normalizeProps(e.guardReactiveProps(e.unref(a))),[t.$slots.header||t.$slots.title||t.$slots.close||t.$slots["title::before"]||t.$slots["title::after"]||t.title||e.unref(s)||t.dismissable||t.autoClose?(e.openBlock(),e.createElementBlock("div",b,[e.unref(s)?(e.openBlock(),e.createBlock(h,e.mergeProps({key:0},e.unref(s),{class:"vv-alert__icon"}),null,16)):e.createCommentVNode("v-if",!0),e.renderSlot(t.$slots,"header",{},()=>[e.renderSlot(t.$slots,"title::before"),t.$slots.title||t.title?(e.openBlock(),e.createElementBlock("strong",{key:0,id:e.unref(i),class:"vv-alert__title"},[e.renderSlot(t.$slots,"title",{},()=>[e.createTextVNode(e.toDisplayString(t.title),1)])],8,y)):e.createCommentVNode("v-if",!0),e.renderSlot(t.$slots,"title::after")]),e.renderSlot(t.$slots,"close",e.normalizeProps(e.guardReactiveProps({close:e.unref(c)})),()=>[t.dismissable||t.autoClose?(e.openBlock(),e.createElementBlock("button",{key:0,class:"vv-alert__close",type:"button","aria-label":t.closeLabel,onClick:o[0]||(o[0]=e.withModifiers((...t)=>e.unref(c)&&e.unref(c)(...t),["stop"]))},[...o[1]||(o[1]=[e.createElementVNode("div",{class:"vv-alert__close-mask"},null,-1)])],8,g)):e.createCommentVNode("v-if",!0)])])):e.createCommentVNode("v-if",!0),t.$slots.default||t.content?(e.openBlock(),e.createElementBlock("div",$,[e.renderSlot(t.$slots,"default",{},()=>[e.createTextVNode(e.toDisplayString(t.content),1)])])):e.createCommentVNode("v-if",!0),t.$slots.footer||t.footer?(e.openBlock(),e.createElementBlock("div",k,[e.renderSlot(t.$slots,"footer",{},()=>[e.createTextVNode(e.toDisplayString(t.footer),1)])])):e.createCommentVNode("v-if",!0)],16))}})});