UNPKG

buefy

Version:

Lightweight UI components for Vue.js (v3) based on Bulma

3 lines (2 loc) 6.91 kB
/*! Buefy v3.0.2 | MIT License | github.com/buefy/buefy */ !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("vue")):"function"==typeof define&&define.amd?define(["exports","vue"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).Snackbar={},e.Vue)}(this,(function(e,t){"use strict";const o=["is-top-right","is-top","is-top-left","is-bottom-right","is-bottom","is-bottom-left"];let i=null,n=3500,s=!0;var a=t.defineComponent({props:{type:{type:String,default:"is-dark"},message:[String,Array],duration:Number,queue:{type:Boolean,default:void 0},indefinite:{type:Boolean,default:!1},pauseOnHover:{type:Boolean,default:!1},position:{type:String,default:"is-top",validator:e=>o.indexOf(e)>-1},container:String},emits:{click:()=>!0,close:()=>!0},data(){return{isActive:!1,isPaused:!1,parentTop:null,parentBottom:null,newContainer:this.container||i,timer:void 0,newDuration:this.duration||0}},computed:{correctParent(){switch(this.position){case"is-top-right":case"is-top":case"is-top-left":return this.parentTop;case"is-bottom-right":case"is-bottom":case"is-bottom-left":return this.parentBottom;default:{const e=this.position;throw new RangeError(`invalid position: ${e}`)}}},transition(){switch(this.position){case"is-top-right":case"is-top":case"is-top-left":return{enter:"fadeInDown",leave:"fadeOut"};case"is-bottom-right":case"is-bottom":case"is-bottom-left":return{enter:"fadeInUp",leave:"fadeOut"};default:{const e=this.position;throw new RangeError(`invalid position: ${e}`)}}}},methods:{pause(){this.pauseOnHover&&!this.indefinite&&(this.isPaused=!0,clearInterval(this.$buefy.globalNoticeInterval))},removePause(){this.pauseOnHover&&!this.indefinite&&(this.isPaused=!1,this.close())},shouldQueue(){return!!(void 0!==this.queue?this.queue:s)&&(this.parentTop.childElementCount>0||this.parentBottom.childElementCount>0)},click(){this.$emit("click")},close(){this.isPaused||(clearTimeout(this.timer),this.isActive=!1,this.$emit("close"),setTimeout((()=>{var e;void 0!==(e=this.$el).remove?e.remove():void 0!==e.parentNode&&null!==e.parentNode&&e.parentNode.removeChild(e)}),150))},timeoutCallback(){return this.close()},showNotice(){this.shouldQueue()&&(this.correctParent.innerHTML=""),this.correctParent.insertAdjacentElement("afterbegin",this.$el),this.isActive=!0,this.indefinite||(this.timer=setTimeout((()=>this.timeoutCallback()),this.newDuration))},setupContainer(){if(this.parentTop=document.querySelector((this.newContainer?this.newContainer:"body")+">.notices.is-top"),this.parentBottom=document.querySelector((this.newContainer?this.newContainer:"body")+">.notices.is-bottom"),this.parentTop&&this.parentBottom)return;this.parentTop||(this.parentTop=document.createElement("div"),this.parentTop.className="notices is-top"),this.parentBottom||(this.parentBottom=document.createElement("div"),this.parentBottom.className="notices is-bottom");const e=document.querySelector(this.newContainer)||document.body;e.appendChild(this.parentTop),e.appendChild(this.parentBottom),this.newContainer&&(this.parentTop.classList.add("has-custom-container"),this.parentBottom.classList.add("has-custom-container"))}},beforeMount(){this.setupContainer()},mounted(){this.showNotice()}});const r=t.defineComponent({name:"BSnackbar",mixins:[a],props:{actionText:{type:String,default:"OK"},onAction:{type:Function,default:()=>{}},cancelText:{type:String,default:null}},data(){return{newDuration:this.duration||n}},methods:{action(){this.onAction(),this.close()}}});const c=["role"],l=["innerHTML"],p={class:"button"},u={class:"button"};var d=((e,t)=>{const o=e.__vccOpts||e;for(const[e,i]of t)o[e]=i;return o})(r,[["render",function(e,o,i,n,s,a){return t.openBlock(),t.createBlock(t.Transition,{"enter-active-class":e.transition.enter,"leave-active-class":e.transition.leave,persisted:""},{default:t.withCtx((()=>[t.withDirectives(t.createElementVNode("div",{class:t.normalizeClass(["snackbar",[e.type,e.position]]),onMouseenter:o[2]||(o[2]=(...t)=>e.pause&&e.pause(...t)),onMouseleave:o[3]||(o[3]=(...t)=>e.removePause&&e.removePause(...t)),role:e.actionText?"alertdialog":"alert"},[e.$slots.default?t.renderSlot(e.$slots,"default",{key:0}):(t.openBlock(),t.createElementBlock(t.Fragment,{key:1},[t.createCommentVNode(" eslint-disable-next-line vue/no-v-html "),t.createElementVNode("div",{class:"text",innerHTML:e.message},null,8,l)],64)),e.cancelText?(t.openBlock(),t.createElementBlock("div",{key:2,class:"action is-light is-cancel",onClick:o[0]||(o[0]=(...t)=>e.close&&e.close(...t))},[t.createElementVNode("button",p,t.toDisplayString(e.cancelText),1)])):t.createCommentVNode("v-if",!0),e.actionText?(t.openBlock(),t.createElementBlock("div",{key:3,class:t.normalizeClass(["action",e.type]),onClick:o[1]||(o[1]=(...t)=>e.action&&e.action(...t))},[t.createElementVNode("button",u,t.toDisplayString(e.actionText),1)],2)):t.createCommentVNode("v-if",!0)],42,c),[[t.vShow,e.isActive]])])),_:3},8,["enter-active-class","leave-active-class"])}]]);var h=Object.defineProperty,m=Object.defineProperties,f=Object.getOwnPropertyDescriptors,v=Object.getOwnPropertySymbols,b=Object.prototype.hasOwnProperty,y=Object.prototype.propertyIsEnumerable,g=(e,t,o)=>t in e?h(e,t,{enumerable:!0,configurable:!0,writable:!0,value:o}):e[t]=o,C=(e,t)=>{for(var o in t||(t={}))b.call(t,o)&&g(e,o,t[o]);if(v)for(var o of v(t))y.call(t,o)&&g(e,o,t[o]);return e};class k{constructor(e){var t;g(this,"app"+"",t),this.app=e}open(e){let o;"string"==typeof e&&(e={message:e});let i=e,{message:n}=i,s=((e,t)=>{var o={};for(var i in e)b.call(e,i)&&t.indexOf(i)<0&&(o[i]=e[i]);if(null!=e&&v)for(var i of v(e))t.indexOf(i)<0&&y.call(e,i)&&(o[i]=e[i]);return o})(i,["message"]);"string"!=typeof n&&(o=n,n=void 0);const a=C({type:"is-success",position:"is-bottom-right",queue:!0,message:n},s),r=document.createElement("div"),c=t.createApp({data:()=>({snackbarVNode:null}),methods:{close(){const e=function(e){if(!e)return;const{component:t}=e;return t?t.exposed&&t.exposeProxy||t.proxy:void 0}(this.snackbarVNode);e&&e.close()}},render(){var e;return this.snackbarVNode=t.h(d,(e=C({},a),m(e,f({onClose(){"function"==typeof a.onClose&&a.onClose(),setTimeout((()=>{c.unmount()}),150)}}))),null!=o?{default:()=>o}:void 0),this.snackbarVNode}});return this.app?function(e,t){const{_context:o}=e,{_context:i}=t;i.config=o.config,i.mixins=o.mixins,i.components=o.components,i.directives=o.directives,i.provides=o.provides,i.optionsCache=o.optionsCache,i.propsCache=o.propsCache,i.emitsCache=o.emitsCache,"__VUE_I18N_SYMBOL__"in e&&(t.__VUE_I18N_SYMBOL__=e.__VUE_I18N_SYMBOL__)}(this.app,c):c.config.globalProperties.$buefy={},c.mount(r)}}const w={install(e){((e,t,o)=>{e.config.globalProperties.$buefy||(e.config.globalProperties.$buefy={}),e.config.globalProperties.$buefy[t]=o})(e,"snackbar",new k(e))}};e.BSnackbar=d,e.SnackbarProgrammatic=k,e.default=w,Object.defineProperty(e,"__esModule",{value:!0})}));